@kaizen/components 0.0.0-canary-toast-notification-fix-20240822034045 → 0.0.0-canary-workflow-export-20240910075656

package/dist/esm/__future__/Workflow/subcomponents/Header/components/Actions/Actions.mjs

@@ -1,21 +0,0 @@
-import { __rest, __assign } from 'tslib';
-import React from 'react';
-import styles from './Actions.module.scss.mjs';
-
-/** A wrapper for an exit trigger (and other) actions of the Header Workflow  */
-const Actions = /*#__PURE__*/function () {
-  const Actions = function (_a) {
-    var headerActions = _a.headerActions,
-      restProps = __rest(_a, ["headerActions"]);
-    return /*#__PURE__*/React.createElement("div", __assign({
-      className: styles.actions
-    }, restProps), headerActions === null || headerActions === void 0 ? void 0 : headerActions.map(function (action, index) {
-      return /*#__PURE__*/React.createElement(action.type, __assign({
-        key: "header-actions ".concat(index)
-      }, action.props));
-    }));
-  };
-  Actions.displayName = "Workflow.Actions";
-  return Actions;
-}();
-export { Actions };

package/dist/esm/__future__/Workflow/subcomponents/Header/components/Actions/Actions.module.scss.mjs

@@ -1,4 +0,0 @@
-var styles = {
-  "actions": "Actions-module_actions__Prrp0"
-};
-export { styles as default };

package/dist/esm/__future__/Workflow/subcomponents/Header/components/Branding/Branding.mjs

@@ -1,20 +0,0 @@
-import React from 'react';
-import { Brand } from '../../../../../../Brand/Brand.mjs';
-import styles from './Branding.module.scss.mjs';
-const Branding = /*#__PURE__*/function () {
-  const Branding = function (_a) {
-    var _b = _a.variant,
-      variant = _b === void 0 ? "logo-horizontal" : _b,
-      alt = _a.alt;
-    return /*#__PURE__*/React.createElement("div", {
-      className: styles.branding
-    }, /*#__PURE__*/React.createElement(Brand, {
-      classNameOverride: styles.logo,
-      variant: variant,
-      alt: alt
-    }));
-  };
-  Branding.displayName = "Workflow.Branding";
-  return Branding;
-}();
-export { Branding };

package/dist/esm/__future__/Workflow/subcomponents/Header/components/Branding/Branding.module.scss.mjs

@@ -1,5 +0,0 @@
-var styles = {
-  "branding": "Branding-module_branding__4h-rD",
-  "logo": "Branding-module_logo__vqqec"
-};
-export { styles as default };

package/dist/esm/__future__/Workflow/subcomponents/Header/components/Root/Root.mjs

@@ -1,17 +0,0 @@
-import { __rest, __assign } from 'tslib';
-import React from 'react';
-import classnames from 'classnames';
-import styles from './Root.module.scss.mjs';
-const HeaderRoot = /*#__PURE__*/function () {
-  const HeaderRoot = function (_a) {
-    var children = _a.children,
-      classNameOverride = _a.classNameOverride,
-      restProps = __rest(_a, ["children", "classNameOverride"]);
-    return /*#__PURE__*/React.createElement("header", __assign({
-      className: classnames(styles.root, classNameOverride)
-    }, restProps), children);
-  };
-  HeaderRoot.displayName = "Workflow.HeaderRoot";
-  return HeaderRoot;
-}();
-export { HeaderRoot };

package/dist/esm/__future__/Workflow/subcomponents/Header/components/Titles/Titles.mjs

@@ -1,38 +0,0 @@
-import { __rest, __assign } from 'tslib';
-import React from 'react';
-import { Heading } from '../../../../../../Heading/Heading.mjs';
-import { Tag } from '../../../../../../Tag/Tag.mjs';
-import { VisuallyHidden } from '../../../../../../VisuallyHidden/VisuallyHidden.mjs';
-import styles from './Titles.module.scss.mjs';
-const Titles = /*#__PURE__*/function () {
-  const Titles = function (_a) {
-    var workflowName = _a.workflowName,
-      stepName = _a.stepName,
-      status = _a.status,
-      restProps = __rest(_a, ["workflowName", "stepName", "status"]);
-    return /*#__PURE__*/React.createElement("div", __assign({
-      className: styles.titles
-    }, restProps), /*#__PURE__*/React.createElement(Heading, {
-      variant: "heading-1",
-      tag: "h1",
-      color: "dark",
-      classNameOverride: styles.pageTitle
-    }, /*#__PURE__*/React.createElement(Heading, {
-      classNameOverride: styles.prefix,
-      variant: "heading-6",
-      tag: "span",
-      color: "dark-reduced-opacity"
-    }, workflowName, /*#__PURE__*/React.createElement(VisuallyHidden, null, ":")), /*#__PURE__*/React.createElement("span", null, stepName)), status && (
-    /*#__PURE__*/
-    // status may need to be update by a fetch
-    React.createElement("div", {
-      className: styles.status
-    }, /*#__PURE__*/React.createElement(Tag, {
-      inline: true,
-      variant: (status === null || status === void 0 ? void 0 : status.variant) || "statusDraft"
-    }, status === null || status === void 0 ? void 0 : status.content))));
-  };
-  Titles.displayName = "Workflow.Titles";
-  return Titles;
-}();
-export { Titles };

package/dist/esm/__future__/Workflow/subcomponents/Header/components/Titles/Titles.module.scss.mjs

@@ -1,7 +0,0 @@
-var styles = {
-  "titles": "Titles-module_titles__JYwU0",
-  "pageTitle": "Titles-module_pageTitle__YDp9S",
-  "prefix": "Titles-module_prefix__40x8n",
-  "status": "Titles-module_status__huuP7"
-};
-export { styles as default };

package/dist/esm/__future__/Workflow/subcomponents/Main/Main.mjs

@@ -1,17 +0,0 @@
-import { __rest, __assign } from 'tslib';
-import React from 'react';
-import classnames from 'classnames';
-import styles from './Main.module.scss.mjs';
-const Main = /*#__PURE__*/function () {
-  const Main = function (_a) {
-    var children = _a.children,
-      classNameOverride = _a.classNameOverride,
-      restProps = __rest(_a, ["children", "classNameOverride"]);
-    return /*#__PURE__*/React.createElement("main", __assign({
-      className: classnames([styles.main, classNameOverride])
-    }, restProps), children);
-  };
-  Main.displayName = "Workflow.Main";
-  return Main;
-}();
-export { Main };

package/dist/esm/__future__/Workflow/subcomponents/Wrapper/Wrapper.mjs

@@ -1,17 +0,0 @@
-import { __rest, __assign } from 'tslib';
-import React from 'react';
-import classnames from 'classnames';
-import styles from './Wrapper.module.scss.mjs';
-const Wrapper = /*#__PURE__*/function () {
-  const Wrapper = function (_a) {
-    var children = _a.children,
-      classNameOverride = _a.classNameOverride,
-      restProps = __rest(_a, ["children", "classNameOverride"]);
-    return /*#__PURE__*/React.createElement("div", __assign({
-      className: classnames(styles.wrapper, classNameOverride)
-    }, restProps), children);
-  };
-  Wrapper.displayName = "Workflow.Wrapper";
-  return Wrapper;
-}();
-export { Wrapper };

package/dist/esm/__future__/Workflow/subcomponents/Wrapper/Wrapper.module.scss.mjs

@@ -1,4 +0,0 @@
-var styles = {
-  "wrapper": "Wrapper-module_wrapper__89WmC"
-};
-export { styles as default };

package/dist/esm/containersV1.mjs

@@ -1 +0,0 @@
-export { GuidanceBlock } from './__containers__/GuidanceBlock/v1/GuidanceBlock.mjs';

package/dist/esm/containersV2.mjs

@@ -1 +0,0 @@
-export { GuidanceBlock } from './__containers__/GuidanceBlock/v2/GuidanceBlock.mjs';

package/dist/types/__containers__/GuidanceBlock/v2/GuidanceBlock.d.ts

@@ -1,59 +0,0 @@
-import React from "react";
-import { HeadingProps } from "../../../Heading";
-import { SceneProps, SpotProps } from "../../../Illustration";
-import { ButtonProps } from "../../../__actions__/v2";
-import { TooltipProps } from "../../../__overlays__/Tooltip/v1";
-export type ActionProps = ButtonProps & {
-    tooltip?: TooltipProps;
-};
-type LayoutType = "default" | "inline" | "stacked";
-type IllustrationType = "spot" | "scene";
-type TextAlignment = "center" | "left";
-type GuidanceBlockActions = {
-    primary: ActionProps;
-    secondary?: ActionProps;
-    dismiss?: {
-        onClick: () => void;
-    };
-};
-type BaseGuidanceBlockProps = {
-    layout?: LayoutType;
-    illustration: React.ReactElement<SpotProps | SceneProps>;
-    illustrationType?: IllustrationType;
-    smallScreenTextAlignment?: TextAlignment;
-    actions?: GuidanceBlockActions;
-    secondaryDismiss?: boolean;
-    /**
-     * If you are migrating from the KAIO v1:
-     * - `prominent` is now `expert-advice`
-     * - All other variants are removed in favour of `default`
-     */
-    variant?: "default" | "expert-advice";
-    withActionButtonArrow?: boolean;
-    noMaxWidth?: boolean;
-};
-type GuidanceBlockWithText = {
-    text: {
-        title: string;
-        titleTag?: HeadingProps["tag"];
-        description: string | React.ReactNode;
-    };
-} & BaseGuidanceBlockProps;
-type GuidanceBlockPropsWithContent = {
-    content: React.ReactElement;
-} & BaseGuidanceBlockProps;
-export type GuidanceBlockProps = GuidanceBlockWithText | GuidanceBlockPropsWithContent;
-export type GuidanceBlockState = {
-    hidden: boolean;
-    removed: boolean;
-    mediaQueryLayout: string;
-};
-/**
- * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082093807/Guidance+Block Guidance} |
- * {@link https://cultureamp.design/?path=/docs/components-guidanceblock--docs Storybook}
- */
-export declare const GuidanceBlock: {
-    ({ layout, variant, withActionButtonArrow, noMaxWidth, illustrationType, smallScreenTextAlignment, actions, illustration, secondaryDismiss, ...restProps }: GuidanceBlockProps): JSX.Element;
-    displayName: string;
-};
-export {};

package/dist/types/__containers__/GuidanceBlock/v2/index.d.ts

@@ -1 +0,0 @@
-export * from "./GuidanceBlock";

package/dist/types/__containers__/v1.d.ts

@@ -1 +0,0 @@
-export * from "./GuidanceBlock/v1";

package/dist/types/__containers__/v2.d.ts

@@ -1 +0,0 @@
-export * from "./GuidanceBlock/v2";

package/dist/types/__future__/Workflow/Workflow.d.ts

@@ -1,27 +0,0 @@
-import { HTMLAttributes } from "react";
-import { OverrideClassName } from "../../types/OverrideClassName";
-import { FooterProps, HeaderProps } from "./subcomponents";
-export type WorkflowProps = OverrideClassName<HTMLAttributes<HTMLDivElement>> & FooterProps & Pick<HeaderProps, "workflowName" | "status" | "headerActions">;
-export declare const Workflow: {
-    ({ steps, currentStepId, isComplete, workflowName, status, headerActions, children, nextAction, previousAction, classNameOverride, ...restProps }: WorkflowProps): JSX.Element;
-    Header: {
-        ({ workflowName, stepName, status, headerActions, ...restProps }: HeaderProps): JSX.Element;
-        displayName: string;
-    };
-    Footer: {
-        ({ steps, currentStepId, isComplete, previousAction, nextAction, ...restProps }: FooterProps): JSX.Element;
-        displayName: string;
-    };
-    Main: {
-        ({ children, classNameOverride, ...restProps }: import("./subcomponents").WorkflowMainProps): JSX.Element;
-        displayName: string;
-    };
-    ProgressStepper: {
-        ({ currentStepId, steps, isComplete, ...restprops }: import("./subcomponents").ProgressStepperProps): JSX.Element;
-        displayName: string;
-    };
-    Wrapper: {
-        ({ children, classNameOverride, ...restProps }: import("./subcomponents").WorkflowWrapperProps): JSX.Element;
-        displayName: string;
-    };
-};

package/dist/types/__future__/Workflow/_docs/controls/controls.d.ts

@@ -1,2 +0,0 @@
-import { ArgTypes } from "@storybook/react";
-export declare const WorkflowControls: Partial<ArgTypes>;

package/dist/types/__future__/Workflow/_docs/controls/index.d.ts

@@ -1 +0,0 @@
-export * from "./controls";

package/dist/types/__future__/Workflow/index.d.ts

@@ -1 +0,0 @@
-export * from "./Workflow";

package/dist/types/__future__/Workflow/subcomponents/Footer/Footer.d.ts

@@ -1,12 +0,0 @@
-import { OverrideClassName } from "../../../../types/OverrideClassName";
-import { ProgressStepperProps, FooterRootProps } from "./components";
-export type FooterProps = {
-    /** An action to return to a previous step */
-    previousAction?: JSX.Element;
-    /** An action to progress to the next step or submit the form */
-    nextAction?: JSX.Element;
-} & ProgressStepperProps & OverrideClassName<Omit<FooterRootProps, "children">>;
-export declare const Footer: {
-    ({ steps, currentStepId, isComplete, previousAction, nextAction, ...restProps }: FooterProps): JSX.Element;
-    displayName: string;
-};

package/dist/types/__future__/Workflow/subcomponents/Footer/components/FooterActions/FooterActions.d.ts

@@ -1,11 +0,0 @@
-import { HTMLAttributes } from "react";
-import { OverrideClassName } from "../../../../../../types/OverrideClassName";
-export type FooterActionsProps = {
-    actionType?: "Previous" | "Next";
-    action?: JSX.Element;
-} & OverrideClassName<Omit<HTMLAttributes<HTMLDivElement>, "children">>;
-/** A simple wrapper for a Footer previous or next action  */
-export declare const FooterAction: {
-    ({ actionType, action, ...restProps }: FooterActionsProps): JSX.Element;
-    displayName: string;
-};

package/dist/types/__future__/Workflow/subcomponents/Footer/components/FooterActions/index.d.ts

@@ -1 +0,0 @@
-export * from "./FooterActions";

package/dist/types/__future__/Workflow/subcomponents/Footer/components/ProgressStepper/index.d.ts

@@ -1 +0,0 @@
-export * from "./ProgressStepper";

package/dist/types/__future__/Workflow/subcomponents/Footer/components/Root/Root.d.ts

@@ -1,7 +0,0 @@
-import { HTMLAttributes } from "react";
-import { OverrideClassName } from "../../../../../../types/OverrideClassName";
-export type FooterRootProps = OverrideClassName<HTMLAttributes<HTMLHeadingElement>>;
-export declare const FooterRoot: {
-    ({ children, classNameOverride, ...restProps }: FooterRootProps): JSX.Element;
-    displayName: string;
-};

package/dist/types/__future__/Workflow/subcomponents/Footer/components/Root/index.d.ts

@@ -1 +0,0 @@
-export * from "./Root";

package/dist/types/__future__/Workflow/subcomponents/Footer/components/index.d.ts

@@ -1,3 +0,0 @@
-export * from "./Root";
-export * from "./ProgressStepper";
-export * from "./FooterActions";

package/dist/types/__future__/Workflow/subcomponents/Footer/index.d.ts

@@ -1,2 +0,0 @@
-export * from "./Footer";
-export * from "./components";

package/dist/types/__future__/Workflow/subcomponents/Header/Header.d.ts

@@ -1,6 +0,0 @@
-import { WorkflowActionsProps, WorkflowTitlesProps } from "./components";
-export type HeaderProps = WorkflowTitlesProps & WorkflowActionsProps;
-export declare const Header: {
-    ({ workflowName, stepName, status, headerActions, ...restProps }: HeaderProps): JSX.Element;
-    displayName: string;
-};

package/dist/types/__future__/Workflow/subcomponents/Header/components/Actions/Actions.d.ts

@@ -1,13 +0,0 @@
-import { HTMLAttributes } from "react";
-import { OverrideClassName } from "../../../../../../types/OverrideClassName";
-export type WorkflowActionsProps = {
-    /**
-     * Header actions will render in order of the array.
-     */
-    headerActions?: JSX.Element[];
-} & OverrideClassName<Omit<HTMLAttributes<HTMLDivElement>, "children">>;
-/** A wrapper for an exit trigger (and other) actions of the Header Workflow  */
-export declare const Actions: {
-    ({ headerActions, ...restProps }: WorkflowActionsProps): JSX.Element;
-    displayName: string;
-};

package/dist/types/__future__/Workflow/subcomponents/Header/components/Actions/index.d.ts

@@ -1 +0,0 @@
-export * from "./Actions";

package/dist/types/__future__/Workflow/subcomponents/Header/components/Branding/Branding.d.ts

@@ -1,11 +0,0 @@
-import { HTMLAttributes } from "react";
-import { BrandProps } from "../../../../../../Brand";
-import { OverrideClassName } from "../../../../../../types/OverrideClassName";
-export type WorflowBrandingProps = {
-    variant?: BrandProps["variant"];
-    alt: string;
-} & OverrideClassName<HTMLAttributes<HTMLDivElement>>;
-export declare const Branding: {
-    ({ variant, alt, }: WorflowBrandingProps): JSX.Element;
-    displayName: string;
-};

package/dist/types/__future__/Workflow/subcomponents/Header/components/Branding/index.d.ts

@@ -1 +0,0 @@
-export * from "./Branding";

package/dist/types/__future__/Workflow/subcomponents/Header/components/Root/Root.d.ts

@@ -1,7 +0,0 @@
-import { HTMLAttributes } from "react";
-import { OverrideClassName } from "../../../../../../types/OverrideClassName";
-export type HeaderRootProps = OverrideClassName<HTMLAttributes<HTMLHeadingElement>>;
-export declare const HeaderRoot: {
-    ({ children, classNameOverride, ...restProps }: HeaderRootProps): JSX.Element;
-    displayName: string;
-};

package/dist/types/__future__/Workflow/subcomponents/Header/components/Root/index.d.ts

@@ -1 +0,0 @@
-export * from "./Root";

package/dist/types/__future__/Workflow/subcomponents/Header/components/Titles/Titles.d.ts

@@ -1,17 +0,0 @@
-import { HTMLAttributes } from "react";
-import { DefaultTagProps } from "../../../../../../Tag";
-import { OverrideClassName } from "../../../../../../types/OverrideClassName";
-export type WorkflowStatus = {
-    /** @default: "statusDraft" */
-    variant?: DefaultTagProps["variant"];
-    content?: string;
-};
-export type WorkflowTitlesProps = {
-    workflowName: string;
-    stepName: string;
-    status?: WorkflowStatus;
-} & OverrideClassName<HTMLAttributes<HTMLDivElement>>;
-export declare const Titles: {
-    ({ workflowName, stepName, status, ...restProps }: WorkflowTitlesProps): JSX.Element;
-    displayName: string;
-};

package/dist/types/__future__/Workflow/subcomponents/Header/components/Titles/index.d.ts

@@ -1 +0,0 @@
-export * from "./Titles";

package/dist/types/__future__/Workflow/subcomponents/Header/components/index.d.ts

@@ -1,4 +0,0 @@
-export * from "./Titles";
-export * from "./Actions";
-export * from "./Branding";
-export * from "./Root";

package/dist/types/__future__/Workflow/subcomponents/Header/index.d.ts

@@ -1,2 +0,0 @@
-export * from "./Header";
-export * from "./components";

package/dist/types/__future__/Workflow/subcomponents/Main/Main.d.ts

@@ -1,9 +0,0 @@
-import { HTMLAttributes, ReactNode } from "react";
-import { OverrideClassName } from "../../../../types/OverrideClassName";
-export type WorkflowMainProps = OverrideClassName<HTMLAttributes<HTMLDivElement>> & {
-    children: ReactNode;
-};
-export declare const Main: {
-    ({ children, classNameOverride, ...restProps }: WorkflowMainProps): JSX.Element;
-    displayName: string;
-};

package/dist/types/__future__/Workflow/subcomponents/Main/index.d.ts

@@ -1 +0,0 @@
-export * from "./Main";

package/dist/types/__future__/Workflow/subcomponents/Wrapper/Wrapper.d.ts

@@ -1,9 +0,0 @@
-import { HTMLAttributes, ReactNode } from "react";
-import { OverrideClassName } from "../../../../types/OverrideClassName";
-export type WorkflowWrapperProps = OverrideClassName<HTMLAttributes<HTMLDivElement>> & {
-    children: ReactNode;
-};
-export declare const Wrapper: {
-    ({ children, classNameOverride, ...restProps }: WorkflowWrapperProps): JSX.Element;
-    displayName: string;
-};

package/dist/types/__future__/Workflow/subcomponents/Wrapper/index.d.ts

@@ -1 +0,0 @@
-export * from "./Wrapper";

package/dist/types/__future__/Workflow/subcomponents/index.d.ts

@@ -1,4 +0,0 @@
-export * from "./Footer";
-export * from "./Header";
-export * from "./Main";
-export * from "./Wrapper";

package/src/Heading/__snapshots__/Heading.spec.tsx.snap

@@ -1,85 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={display-0} /> 1`] = `
-<body>
-  <div>
-    <h1
-      class="heading display-0 dark large"
-    >
-      Example
-    </h1>
-  </div>
-</body>
-`;
-
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-1} /> 1`] = `
-<body>
-  <div>
-    <h1
-      class="heading heading-1 dark large"
-    >
-      Example
-    </h1>
-  </div>
-</body>
-`;
-
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-2} /> 1`] = `
-<body>
-  <div>
-    <h2
-      class="heading heading-2 dark large"
-    >
-      Example
-    </h2>
-  </div>
-</body>
-`;
-
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-3} /> 1`] = `
-<body>
-  <div>
-    <h3
-      class="heading heading-3 dark small"
-    >
-      Example
-    </h3>
-  </div>
-</body>
-`;
-
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-4} /> 1`] = `
-<body>
-  <div>
-    <h4
-      class="heading heading-4 dark small"
-    >
-      Example
-    </h4>
-  </div>
-</body>
-`;
-
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-5} /> 1`] = `
-<body>
-  <div>
-    <h5
-      class="heading heading-5 dark small"
-    >
-      Example
-    </h5>
-  </div>
-</body>
-`;
-
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-6} /> 1`] = `
-<body>
-  <div>
-    <h6
-      class="heading heading-6 dark small"
-    >
-      Example
-    </h6>
-  </div>
-</body>
-`;

package/src/Illustration/utils/usePausePlay.spec.tsx

@@ -1,86 +0,0 @@
-import React, { RefObject, act } from "react"
-import { render } from "@testing-library/react"
-import { renderHook } from "@testing-library/react-hooks"
-import { LaunchIcon, PauseIcon } from "~components/Icon"
-import { usePausePlay, usePausePlayHook } from "./usePausePlay"
-
-describe("usePausePlay()", () => {
-  beforeEach(() => {
-    jest.clearAllMocks()
-  })
-
-  let hookResult: usePausePlayHook
-  const mockPause = jest.fn()
-  const mockPlay = jest.fn()
-
-  describe("when toggling a currently playing video", () => {
-    beforeEach(() => {
-      const fakeRef = {
-        current: {
-          pause: mockPause,
-          play: mockPlay,
-          paused: false, // It's playing
-        },
-      } as unknown as RefObject<HTMLVideoElement>
-
-      const { result } = renderHook(() => usePausePlay(fakeRef))
-
-      act(() => {
-        result.current.toggle()
-      })
-
-      hookResult = result.current
-    })
-
-    it("pauses the video", () => {
-      expect(mockPause).toHaveBeenCalled()
-    })
-
-    it("returns the play icon", () => {
-      const { baseElement: original } = render(hookResult.icon)
-      const { baseElement: comparison } = render(
-        <LaunchIcon role="presentation" />
-      )
-      expect(original).toEqual(comparison)
-    })
-
-    it("returns the 'Play animation' label", () => {
-      expect(hookResult.label).toEqual("Play animation")
-    })
-  })
-
-  describe("when toggling a currently paused video", () => {
-    beforeEach(() => {
-      const fakeRef = {
-        current: {
-          pause: mockPause,
-          play: mockPlay,
-          paused: true, // It's not playing
-        },
-      } as unknown as RefObject<HTMLVideoElement>
-
-      const { result } = renderHook(() => usePausePlay(fakeRef))
-
-      act(() => {
-        result.current.toggle()
-      })
-
-      hookResult = result.current
-    })
-    it("starts the video again", () => {
-      expect(mockPlay).toHaveBeenCalled()
-    })
-
-    it("returns the pause icon", () => {
-      const { baseElement: original } = render(hookResult.icon)
-      const { baseElement: comparison } = render(
-        <PauseIcon role="presentation" />
-      )
-      expect(original).toEqual(comparison)
-    })
-
-    it("returns the 'Pause animation' label", () => {
-      expect(hookResult.label).toEqual("Pause animation")
-    })
-  })
-})