npm - @kaizen/components - Versions diffs - 0.0.0-canary-toast-notification-fix-20240822034045 → 0.0.0-canary-workflow-export-20240910075656 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (517) hide show

package/src/Notification/subcomponents/GenericNotification/GenericNotification.spec.tsx DELETED Viewed

@@ -1,76 +0,0 @@
-import React, { act } from "react"
-import { fireEvent, waitFor } from "@testing-library/dom"
-import { render } from "@testing-library/react"
-import ReactTestUtils from "react-dom/test-utils"
-import { GenericNotification } from "./GenericNotification"
-describe("<GenericNotification />", () => {
-  afterEach(() => {
-    jest.runAllTimers()
-  })
-  beforeEach(() => {
-    jest.useFakeTimers()
-  })
-  it('begins "hidden" but transitions out of it immediately', async () => {
-    const { container } = render(
-      <GenericNotification type="positive" style="inline" title="Success">
-        This is my positive notification
-      </GenericNotification>
-    )
-    await waitFor(() => {
-      expect(container.querySelector(".hidden")).toBeInTheDocument()
-    })
-    await act(async () => {
-      jest.advanceTimersByTime(50)
-    })
-    await waitFor(() => {
-      expect(container.querySelector(".hidden")).not.toBeInTheDocument()
-    })
-  })
-  it("hides the notification and triggers the onHide callback when the cancel button is clicked", async () => {
-    const onHide = jest.fn()
-    const { container, getByTestId } = render(
-      <GenericNotification
-        type="positive"
-        style="inline"
-        title="Success"
-        onHide={onHide}
-      >
-        Notification Text
-      </GenericNotification>
-    )
-    // The element should start in a "hidden" state
-    expect(container.querySelector(".hidden")).toBeTruthy()
-    // After clicking, the element should fade out, but the onHide not trigger yet.
-    const cancelButton = getByTestId("close-button")
-    const notification = container.querySelector(".notification")
-    fireEvent(cancelButton, new MouseEvent("click"))
-    await waitFor(() => {
-      expect(notification).toBeTruthy()
-    })
-    // Cannot use @testing-library/react `fireEvent` as it relies on jsdom events
-    // TransitionEvent has not been implemented yet, using `ReactTestUtils.Simulate` is a workaround
-    act(() => {
-      notification &&
-        ReactTestUtils.Simulate.transitionEnd(notification, {
-          propertyName: "margin-top",
-        } as any)
-    })
-    await waitFor(() => {
-      expect(notification).not.toBeInTheDocument()
-    })
-    await waitFor(() => expect(onHide).toHaveBeenCalledTimes(1))
-  })
-})

package/src/Text/__snapshots__/Text.spec.tsx.snap DELETED Viewed

@@ -1,49 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`<Text /> defaults to the correct HTML element renders the correct element for <Text variant={body} /> 1`] = `
-<body>
-  <div>
-    <p
-      class="text body dark"
-    >
-      Example
-    </p>
-  </div>
-</body>
-`;
-exports[`<Text /> defaults to the correct HTML element renders the correct element for <Text variant={extra-small} /> 1`] = `
-<body>
-  <div>
-    <p
-      class="text extra-small dark"
-    >
-      Example
-    </p>
-  </div>
-</body>
-`;
-exports[`<Text /> defaults to the correct HTML element renders the correct element for <Text variant={intro-lede} /> 1`] = `
-<body>
-  <div>
-    <p
-      class="text intro-lede dark"
-    >
-      Example
-    </p>
-  </div>
-</body>
-`;
-exports[`<Text /> defaults to the correct HTML element renders the correct element for <Text variant={small} /> 1`] = `
-<body>
-  <div>
-    <p
-      class="text small dark"
-    >
-      Example
-    </p>
-  </div>
-</body>
-`;

package/src/Workflow/subcomponents/Footer/components/Root/FooterRoot.module.scss DELETED Viewed

@@ -1,22 +0,0 @@
-@import "~@kaizen/design-tokens/sass/spacing";
-@import "~@kaizen/design-tokens/sass/color";
-.footerRoot {
-  display: grid;
-  grid-template-areas: "prev stepper next";
-  grid-template-columns: 1fr 2fr 1fr;
-  flex-grow: 1;
-  justify-content: center;
-  align-items: center;
-  padding: $spacing-24 $spacing-12;
-  background: $color-blue-500;
-  gap: $spacing-16;
-  @media (min-width: 768px) {
-    grid-template-columns: 1fr 5fr 1fr;
-    padding: $spacing-24 $spacing-32;
-    position: sticky;
-    bottom: 0;
-    z-index: 1;
-  }
-}

package/src/Workflow/subcomponents/Header/components/Actions/Actions.module.scss DELETED Viewed

@@ -1,17 +0,0 @@
-@import "~@kaizen/design-tokens/sass/spacing";
-.actions {
-  grid-area: actions;
-  display: flex;
-  flex-direction: column;
-  flex-grow: 1;
-  justify-content: center;
-  align-items: center;
-  @media (min-width: 768px) {
-    flex-direction: row;
-    align-items: flex-start;
-    justify-content: flex-end;
-    margin-top: calc(-1 * #{$spacing-12});
-  }
-}

package/src/Workflow/subcomponents/Header/components/Branding/Branding.module.scss DELETED Viewed

@@ -1,17 +0,0 @@
-@import "~@kaizen/design-tokens/sass/spacing";
-.branding {
-  justify-content: center;
-  grid-area: branding;
-  display: flex;
-  flex-grow: 1;
-  padding-top: $spacing-4;
-  @media (min-width: 768px) {
-    justify-content: unset;
-  }
-}
-.logo {
-  flex-basis: 7.5rem;
-}

package/src/Workflow/subcomponents/Header/components/Root/Root.module.scss DELETED Viewed

@@ -1,24 +0,0 @@
-@import "~@kaizen/design-tokens/sass/shadow";
-@import "~@kaizen/design-tokens/sass/spacing";
-@import "~@kaizen/design-tokens/sass/color";
-.root {
-  display: grid;
-  background-color: $color-white;
-  grid-template: "branding" min-content "titles" max-content "actions" min-content / 1fr;
-  flex-grow: 1;
-  justify-content: center;
-  align-items: center;
-  text-align: center;
-  box-shadow: $shadow-small-box-shadow;
-  padding: $spacing-24;
-  gap: $spacing-16;
-  @media (min-width: 768px) {
-    align-items: start;
-    grid-template: "branding titles actions" min-content / 1fr max-content 1fr;
-    position: sticky;
-    top: 0;
-    z-index: 1;
-  }
-}

package/src/Workflow/subcomponents/Header/components/Titles/Titles.module.scss DELETED Viewed

@@ -1,23 +0,0 @@
-@import "~@kaizen/design-tokens/sass/spacing";
-.titles {
-  grid-area: titles;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  flex-grow: 1;
-}
-.pageTitle {
-  display: flex;
-  flex-direction: column;
-}
-.prefix {
-  margin-bottom: $spacing-4;
-}
-.status {
-  margin-top: $spacing-8;
-}

package/src/Workflow/subcomponents/Main/Main.module.scss DELETED Viewed

@@ -1,4 +0,0 @@
-.main {
-  // This is set so children will sit beneath the header and footer when sticky
-  z-index: 0;
-}

package/src/Workflow/subcomponents/Wrapper/Wrapper.module.scss DELETED Viewed

@@ -1,9 +0,0 @@
-@import "~@kaizen/design-tokens/sass/color";
-.wrapper {
-  display: grid;
-  grid-template-rows: min-content 1fr min-content;
-  position: relative;
-  min-height: 100vh;
-  background: $color-gray-100;
-}

package/src/__containers__/GuidanceBlock/v1/GuidanceBlock.spec.tsx DELETED Viewed

@@ -1,82 +0,0 @@
-import React from "react"
-import { cleanup, render, waitFor } from "@testing-library/react"
-import userEvent from "@testing-library/user-event"
-import { Informative } from "~components/Illustration"
-import { GuidanceBlock } from "./GuidanceBlock"
-const user = userEvent.setup()
-// eslint-disable-next-line ssr-friendly/no-dom-globals-in-module-scope
-window.matchMedia = jest.fn().mockImplementation(() => ({
-  matches: false,
-  media: "",
-  onchange: null,
-  addListener: jest.fn(),
-  removeListener: jest.fn(),
-}))
-describe("GuidanceBlock", () => {
-  afterEach(cleanup)
-  it("calls the action function when action button is clicked", async () => {
-    const onAction = jest.fn()
-    const { container } = render(
-      <GuidanceBlock
-        illustration={<Informative alt="" />}
-        text={{
-          title: "This is the call to action title",
-          description:
-            "Mussum Ipsum, cacilds vidis litro abertis. Suco de cevadiss, é um leite divinis.",
-        }}
-        actions={{
-          primary: { label: "Action!", onClick: onAction },
-        }}
-      />
-    )
-    const actionButton = container.querySelector("button")
-    actionButton && (await user.click(actionButton))
-    await waitFor(() => {
-      expect(onAction).toHaveBeenCalledTimes(1)
-    })
-  })
-  it("has a default title tag of h3", () => {
-    const { getByRole } = render(
-      <GuidanceBlock
-        illustration={<Informative alt="" />}
-        text={{
-          title: "This is the call to action title",
-          description:
-            "Mussum Ipsum, cacilds vidis litro abertis. Suco de cevadiss, é um leite divinis.",
-        }}
-      />
-    )
-    expect(
-      getByRole("heading", {
-        level: 3,
-        name: "This is the call to action title",
-      })
-    ).toBeInTheDocument()
-  })
-  it("can allow the user to override the title tag", () => {
-    const { getByRole } = render(
-      <GuidanceBlock
-        illustration={<Informative alt="" />}
-        text={{
-          title: "This is the call to action title",
-          description:
-            "Mussum Ipsum, cacilds vidis litro abertis. Suco de cevadiss, é um leite divinis.",
-          titleTag: "h2",
-        }}
-      />
-    )
-    expect(
-      getByRole("heading", {
-        level: 2,
-        name: "This is the call to action title",
-      })
-    ).toBeInTheDocument()
-  })
-})

package/src/__containers__/GuidanceBlock/v1/_docs/GuidanceBlock.mdx DELETED Viewed

@@ -1,38 +0,0 @@
-import { Canvas, Controls, DocsStory, Meta } from "@storybook/blocks"
-import { ResourceLinks, KAIOInstallation } from "~storybook/components"
-import * as GuidanceBlockStories from "./GuidanceBlock.stories"
-<Meta of={GuidanceBlockStories} />
-# GuidanceBlock (V1)
-<ResourceLinks
-  sourceCode="https://github.com/cultureamp/kaizen-design-system/tree/main/packages/components/src/GuidanceBlock"
-  figma="https://www.figma.com/file/ZRfnoNUXbGZv4eVWLbF4Az/%EF%B8%8F%F0%9F%96%BC%EF%B8%8F-Component-Gallery?node-id=622%3A149926&t=P1w10jr2cpPuaayw-1"
-  designGuidelines="https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082093807/Guidance+Block"
-/>
-<KAIOInstallation exportNames="GuidanceBlock" version="1" family="containers" />
-## Overview
-A Guidance Block provides a familiar layout that is visually prominent to draw attention to related content.
-It guides people to new actions they haven't done before or connects them to relevant content they can view on another page.
-<Canvas of={GuidanceBlockStories.Playground} />
-<Controls of={GuidanceBlockStories.Playground} />
-## API
-<DocsStory of={GuidanceBlockStories.Actions} />
-<DocsStory of={GuidanceBlockStories.Tooltip} />
-<DocsStory of={GuidanceBlockStories.CustomContent} />
-<DocsStory of={GuidanceBlockStories.Stacked} />
-<DocsStory of={GuidanceBlockStories.SceneExample} />
-<DocsStory of={GuidanceBlockStories.Variants} />