<commit_before>import React from "react";
import { takeSnapshotsOf } from "@hig/jest-preset/helpers";
import { mount } from "enzyme";
import Button from "@hig/button";

import { anchorPoints } from "./anchorPoints";
import Flyout from "./Flyout";
import PanelContainerPresenter from "./presenters/PanelContainerPresenter";

describe("flyout/Flyout", () => {
  describe("snapshots", () => {
    const basicProps = {
      anchorPoint: anchorPoints.TOP_CENTER,
      children: <Button title="Click Me" />,
      content: "Hello World",
      maxHeight: 150,
      onClickOutside: function onClickOutside() {},
      onScroll: function onScroll() {},
      open: true,
      openOnHover: false
    };
    const MyCustomContainer = jest.fn(({ children, onScroll, maxHeight }) => (
      <div
        data-mock="MyCustomContainer"
        onScroll={onScroll}
        style={{ maxHeight }}
      >
        {children}
      </div>
    ));
    const renderContent = jest.fn(() => "Content from render prop");
    const renderPanelBasic = jest.fn(({ content }) => <div>{content}</div>);
    const renderChildren = jest.fn(({ handleClick }) => (
      <Button onClick={handleClick} title="Render prop" />
    ));
    const renderPanelComplex = jest.fn(
      ({ innerRef, content, handleScroll, maxHeight }) => (
        <PanelContainerPresenter innerRef={innerRef}>
          <MyCustomContainer onScroll={handleScroll} style={{ maxHeight }}>
            {content}
          </MyCustomContainer>
        </PanelContainerPresenter>
      )
    );

    takeSnapshotsOf(Flyout, [
      {
        desc: "renders without props",
        props: {}
      },
      {
        desc: "renders open by default",
        props: {
          defaultOpen: true
        }
      },
      {
        desc: "renders with a basic set of props",
        props: basicProps
      },
      {
        desc: "renders children from the given render function",
        props: {
          ...basicProps,
          children: renderChildren
        }
      },
      {
        desc: "renders content from the given render function",
        props: {
          ...basicProps,
          content: renderContent
        }
      },
      {
        desc: "renders the panel from a basic render function",
        props: {
          ...basicProps,
          panel: renderPanelBasic
        }
      },
      {
        desc: "renders the panel from a complex render function",
        props: {
          ...basicProps,
          children: renderChildren,
          content: renderContent,
          panel: renderPanelComplex
        }
      },
      {
        desc: "renders a custom pointer",
        props: {
          ...basicProps,
          pointer: <span>my custom pointer</span>
        }
      },
      {
        desc: "renders with className prop",
        props: {
          ...basicProps,
          className: "my-class"
        }
      }
    ]);
  });<commit_msg>test: add stylesheet prop test for Flyout<commit_after>import React from "react";
import { takeSnapshotsOf } from "@hig/jest-preset/helpers";
import { mount } from "enzyme";
import Button from "@hig/button";

import { anchorPoints } from "./anchorPoints";
import Flyout from "./Flyout";
import PanelContainerPresenter from "./presenters/PanelContainerPresenter";

describe("flyout/Flyout", () => {
  describe("snapshots", () => {
    const basicProps = {
      anchorPoint: anchorPoints.TOP_CENTER,
      children: <Button title="Click Me" />,
      content: "Hello World",
      maxHeight: 150,
      onClickOutside: function onClickOutside() {},
      onScroll: function onScroll() {},
      open: true,
      openOnHover: false
    };
    const MyCustomContainer = jest.fn(({ children, onScroll, maxHeight }) => (
      <div
        data-mock="MyCustomContainer"
        onScroll={onScroll}
        style={{ maxHeight }}
      >
        {children}
      </div>
    ));
    const renderContent = jest.fn(() => "Content from render prop");
    const renderPanelBasic = jest.fn(({ content }) => <div>{content}</div>);
    const renderChildren = jest.fn(({ handleClick }) => (
      <Button onClick={handleClick} title="Render prop" />
    ));
    const renderPanelComplex = jest.fn(
      ({ innerRef, content, handleScroll, maxHeight }) => (
        <PanelContainerPresenter innerRef={innerRef}>
          <MyCustomContainer onScroll={handleScroll} style={{ maxHeight }}>
            {content}
          </MyCustomContainer>
        </PanelContainerPresenter>
      )
    );

    takeSnapshotsOf(Flyout, [
      {
        desc: "renders without props",
        props: {}
      },
      {
        desc: "renders open by default",
        props: {
          defaultOpen: true
        }
      },
      {
        desc: "renders with a basic set of props",
        props: basicProps
      },
      {
        desc: "renders children from the given render function",
        props: {
          ...basicProps,
          children: renderChildren
        }
      },
      {
        desc: "renders content from the given render function",
        props: {
          ...basicProps,
          content: renderContent
        }
      },
      {
        desc: "renders the panel from a basic render function",
        props: {
          ...basicProps,
          panel: renderPanelBasic
        }
      },
      {
        desc: "renders the panel from a complex render function",
        props: {
          ...basicProps,
          children: renderChildren,
          content: renderContent,
          panel: renderPanelComplex
        }
      },
      {
        desc: "renders a custom pointer",
        props: {
          ...basicProps,
          pointer: <span>my custom pointer</span>
        }
      },
      {
        desc: "renders with className prop",
        props: {
          ...basicProps,
          className: "my-class"
        }
      },
      {
        desc: "renders with custom stylesheet function",
        props: {
          ...basicProps,
          stylesheet(styles) {
            return {
              ...styles,
              flyoutContainer: {
                ...styles.flyoutContainer,
                opacity: "0.3"
              },
              panel: {
                ...styles.panel,
                backgroundColor: "orange"
              },
              pointerBody: {
                fill: "orange"
              }
            };
          }
        }
      }
    ]);
  });
{'fraction_non_alphanumeric': 0.12139629110176095, 'fraction_numerical': 0.0012466884837151317, 'mean_word_length': 1.756872852233677, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 41, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3291803', 'n_tokens_mistral': 1728, 'n_tokens_neox': 1699, 'n_words': 428}