@windstream/react-shared-components 0.0.63 → 0.0.65

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 (144) hide show
  1. package/README.md +629 -629
  2. package/dist/contentful/index.d.ts +34 -28
  3. package/dist/contentful/index.esm.js +1 -1
  4. package/dist/contentful/index.esm.js.map +1 -1
  5. package/dist/contentful/index.js +1 -1
  6. package/dist/contentful/index.js.map +1 -1
  7. package/dist/core.d.ts +2 -2
  8. package/dist/index.d.ts +2 -2
  9. package/dist/index.esm.js +1 -1
  10. package/dist/index.esm.js.map +1 -1
  11. package/dist/index.js +1 -1
  12. package/dist/index.js.map +1 -1
  13. package/dist/next/index.esm.js +1 -1
  14. package/dist/next/index.esm.js.map +1 -1
  15. package/dist/next/index.js +1 -1
  16. package/dist/next/index.js.map +1 -1
  17. package/dist/styles.css +1 -1
  18. package/package.json +175 -175
  19. package/src/components/accordion/Accordion.stories.tsx +230 -230
  20. package/src/components/accordion/types.ts +10 -10
  21. package/src/components/alert-card/AlertCard.stories.tsx +171 -171
  22. package/src/components/alert-card/index.tsx +32 -32
  23. package/src/components/alert-card/types.ts +9 -9
  24. package/src/components/brand-button/BrandButton.stories.tsx +219 -219
  25. package/src/components/brand-button/helpers.ts +35 -35
  26. package/src/components/brand-button/index.tsx +93 -93
  27. package/src/components/brand-button/types.ts +25 -25
  28. package/src/components/button/Button.stories.tsx +108 -108
  29. package/src/components/button/index.tsx +27 -27
  30. package/src/components/button/types.ts +14 -14
  31. package/src/components/call-button/CallButton.stories.tsx +324 -324
  32. package/src/components/call-button/index.tsx +79 -79
  33. package/src/components/call-button/types.ts +10 -10
  34. package/src/components/checkbox/Checkbox.stories.tsx +247 -247
  35. package/src/components/checkbox/index.tsx +197 -197
  36. package/src/components/checkbox/types.ts +27 -27
  37. package/src/components/checklist/Checklist.stories.tsx +150 -150
  38. package/src/components/collapse/Collapse.stories.tsx +255 -255
  39. package/src/components/collapse/index.tsx +46 -46
  40. package/src/components/collapse/types.ts +6 -6
  41. package/src/components/divider/Divider.stories.tsx +205 -205
  42. package/src/components/divider/index.tsx +22 -22
  43. package/src/components/divider/type.ts +3 -3
  44. package/src/components/image/Image.stories.tsx +113 -113
  45. package/src/components/image/index.tsx +25 -25
  46. package/src/components/image/types.ts +40 -40
  47. package/src/components/input/Input.stories.tsx +325 -325
  48. package/src/components/input/index.tsx +177 -177
  49. package/src/components/input/types.ts +37 -37
  50. package/src/components/link/Link.stories.tsx +163 -163
  51. package/src/components/link/types.ts +25 -25
  52. package/src/components/list/List.stories.tsx +272 -272
  53. package/src/components/list/index.tsx +88 -88
  54. package/src/components/list/list-item/index.tsx +38 -38
  55. package/src/components/list/list-item/types.ts +13 -13
  56. package/src/components/list/types.ts +29 -29
  57. package/src/components/material-icon/MaterialIcon.stories.tsx +330 -330
  58. package/src/components/material-icon/constants.ts +96 -96
  59. package/src/components/material-icon/index.tsx +44 -44
  60. package/src/components/material-icon/types.ts +31 -31
  61. package/src/components/modal/Modal.stories.tsx +171 -171
  62. package/src/components/modal/index.tsx +164 -164
  63. package/src/components/modal/types.ts +24 -24
  64. package/src/components/next-image/index.tsx +32 -18
  65. package/src/components/next-image/types.ts +1 -1
  66. package/src/components/radio-button/RadioButton.stories.tsx +307 -307
  67. package/src/components/radio-button/index.tsx +75 -75
  68. package/src/components/radio-button/types.ts +21 -21
  69. package/src/components/see-more/SeeMore.stories.tsx +181 -181
  70. package/src/components/see-more/index.tsx +44 -44
  71. package/src/components/see-more/types.ts +4 -4
  72. package/src/components/select/Select.stories.tsx +411 -411
  73. package/src/components/select/index.tsx +150 -150
  74. package/src/components/select/types.ts +35 -35
  75. package/src/components/select-plan-button/SelectPlanButton.stories.tsx +184 -184
  76. package/src/components/select-plan-button/index.tsx +31 -31
  77. package/src/components/select-plan-button/types.ts +5 -5
  78. package/src/components/skeleton/Skeleton.stories.tsx +179 -179
  79. package/src/components/skeleton/index.tsx +61 -61
  80. package/src/components/skeleton/types.ts +4 -4
  81. package/src/components/spinner/Spinner.stories.tsx +335 -335
  82. package/src/components/spinner/index.tsx +44 -44
  83. package/src/components/spinner/types.ts +5 -5
  84. package/src/components/text/Text.stories.tsx +321 -321
  85. package/src/components/text/index.tsx +25 -25
  86. package/src/components/text/types.ts +45 -45
  87. package/src/components/tooltip/Tooltip.stories.tsx +219 -219
  88. package/src/components/tooltip/index.tsx +74 -74
  89. package/src/components/tooltip/types.ts +7 -7
  90. package/src/components/view-cart-button/ViewCartButton.stories.tsx +252 -252
  91. package/src/components/view-cart-button/index.tsx +44 -44
  92. package/src/components/view-cart-button/types.ts +5 -5
  93. package/src/contentful/blocks/button/Button.stories.tsx +40 -40
  94. package/src/contentful/blocks/button/index.tsx +64 -64
  95. package/src/contentful/blocks/button/types.ts +24 -24
  96. package/src/contentful/blocks/callout/Callout.stories.tsx +23 -23
  97. package/src/contentful/blocks/cards/Cards.stories.tsx +23 -23
  98. package/src/contentful/blocks/cards/index.tsx +13 -13
  99. package/src/contentful/blocks/cards/product-card/index.tsx +198 -198
  100. package/src/contentful/blocks/cards/product-card/types.ts +18 -18
  101. package/src/contentful/blocks/cards/testimonial-card/index.tsx +86 -86
  102. package/src/contentful/blocks/cards/testimonial-card/types.tsx +10 -10
  103. package/src/contentful/blocks/cards/types.ts +1 -1
  104. package/src/contentful/blocks/carousel/Carousel.stories.tsx +23 -23
  105. package/src/contentful/blocks/carousel/index.tsx +13 -13
  106. package/src/contentful/blocks/carousel/types.ts +1 -1
  107. package/src/contentful/blocks/cta-callout/CtaCallout.stories.tsx +46 -46
  108. package/src/contentful/blocks/cta-callout/index.tsx +54 -54
  109. package/src/contentful/blocks/cta-callout/types.ts +22 -22
  110. package/src/contentful/blocks/floating-banner/FloatingBanner.stories.tsx +34 -34
  111. package/src/contentful/blocks/floating-banner/types.ts +22 -22
  112. package/src/contentful/blocks/footer/Footer.stories.tsx +30 -30
  113. package/src/contentful/blocks/image-promo-bar/ImagePromoBar.stories.tsx +23 -23
  114. package/src/contentful/blocks/image-promo-bar/types.ts +27 -27
  115. package/src/contentful/blocks/modal/Modal.stories.tsx +23 -23
  116. package/src/contentful/blocks/modal/index.tsx +12 -12
  117. package/src/contentful/blocks/modal/types.ts +1 -1
  118. package/src/contentful/blocks/navigation/desktop-link-groups.tsx/index.tsx +111 -0
  119. package/src/contentful/blocks/navigation/index.tsx +366 -56
  120. package/src/contentful/blocks/navigation/mobile-link-groups.tsx/index.tsx +80 -0
  121. package/src/contentful/blocks/navigation/types.ts +39 -21
  122. package/src/contentful/blocks/primary-hero/PrimaryHero.stories.tsx +23 -23
  123. package/src/contentful/blocks/primary-hero/index.tsx +160 -160
  124. package/src/contentful/blocks/primary-hero/types.ts +30 -30
  125. package/src/contentful/blocks/shape-background-wrapper/ShapeBackgroundWrapper.stories.tsx +26 -26
  126. package/src/contentful/blocks/shape-background-wrapper/index.tsx +124 -124
  127. package/src/contentful/blocks/shape-background-wrapper/types.ts +36 -36
  128. package/src/contentful/blocks/text/Text.stories.tsx +23 -23
  129. package/src/contentful/blocks/text/index.tsx +12 -12
  130. package/src/contentful/blocks/text/types.ts +1 -1
  131. package/src/contentful/index.ts +54 -54
  132. package/src/hooks/use-body-scroll-lock.ts +34 -34
  133. package/src/hooks/use-outside-click.ts +17 -0
  134. package/src/index.ts +96 -96
  135. package/src/next/index.ts +5 -5
  136. package/src/setupTests.ts +46 -46
  137. package/src/stories/DocsTemplate.tsx +24 -24
  138. package/src/styles/globals.css +307 -307
  139. package/src/types/global.d.ts +9 -9
  140. package/src/types/micro-components.ts +80 -0
  141. package/src/utils/index.ts +49 -49
  142. package/tailwind.config.cjs +1 -2
  143. package/src/contentful/blocks/navigation/Navigation.stories.tsx +0 -23
  144. package/src/contentful/blocks/navigation/link-groups.tsx/index.tsx +0 -62
@@ -1,44 +1,44 @@
1
- import { Button } from "../button";
2
- import { MaterialIcon } from "../material-icon";
3
- import { Text } from "../text";
4
- import { ViewCartButtonProps } from "./types";
5
-
6
- import { cx } from "@shared/utils";
7
-
8
- const baseClasses =
9
- "btn-medium rounded-2xl pl-15 pr-15 inline-flex gap-2 items-center justify-center outline-none focus:ring-2 focus:ring-offset-2 cursor-pointer transition-colors duration-200 align-top border-2 border-border-secondary-on-bg-fill bg-bg text-text focus:ring-bg-surface-inverse";
10
- export const ViewCartButton: React.FC<ViewCartButtonProps> = props => {
11
- const { cartTotalText, onClick, isOpen, ...rest } = props;
12
- return (
13
- <Button
14
- className={cx(
15
- baseClasses,
16
- "btn-small w-full border-border pl-6 pr-4 md:btn-medium"
17
- )}
18
- onClick={onClick}
19
- {...rest}
20
- >
21
- <div className="flex w-full items-center justify-center gap-2">
22
- <div className="flex flex-col items-center justify-center">
23
- <Text className="footnote -mb-1 text-text-secondary sm:body3">
24
- View cart
25
- </Text>
26
- <Text className="body3 font-bold md:body1" data-testid="cart-total">
27
- {cartTotalText}
28
- </Text>
29
- </div>
30
- <MaterialIcon
31
- name="keyboard_arrow_up"
32
- size={24}
33
- fill={0}
34
- className={cx(
35
- "h-6 w-6 transition-transform",
36
- isOpen ? "rotate-180" : "rotate-0"
37
- )}
38
- />
39
- </div>
40
- </Button>
41
- );
42
- };
43
-
44
- export type { ViewCartButtonProps } from "./types";
1
+ import { Button } from "../button";
2
+ import { MaterialIcon } from "../material-icon";
3
+ import { Text } from "../text";
4
+ import { ViewCartButtonProps } from "./types";
5
+
6
+ import { cx } from "@shared/utils";
7
+
8
+ const baseClasses =
9
+ "btn-medium rounded-2xl pl-15 pr-15 inline-flex gap-2 items-center justify-center outline-none focus:ring-2 focus:ring-offset-2 cursor-pointer transition-colors duration-200 align-top border-2 border-border-secondary-on-bg-fill bg-bg text-text focus:ring-bg-surface-inverse";
10
+ export const ViewCartButton: React.FC<ViewCartButtonProps> = props => {
11
+ const { cartTotalText, onClick, isOpen, ...rest } = props;
12
+ return (
13
+ <Button
14
+ className={cx(
15
+ baseClasses,
16
+ "btn-small w-full border-border pl-6 pr-4 md:btn-medium"
17
+ )}
18
+ onClick={onClick}
19
+ {...rest}
20
+ >
21
+ <div className="flex w-full items-center justify-center gap-2">
22
+ <div className="flex flex-col items-center justify-center">
23
+ <Text className="footnote -mb-1 text-text-secondary sm:body3">
24
+ View cart
25
+ </Text>
26
+ <Text className="body3 font-bold md:body1" data-testid="cart-total">
27
+ {cartTotalText}
28
+ </Text>
29
+ </div>
30
+ <MaterialIcon
31
+ name="keyboard_arrow_up"
32
+ size={24}
33
+ fill={0}
34
+ className={cx(
35
+ "h-6 w-6 transition-transform",
36
+ isOpen ? "rotate-180" : "rotate-0"
37
+ )}
38
+ />
39
+ </div>
40
+ </Button>
41
+ );
42
+ };
43
+
44
+ export type { ViewCartButtonProps } from "./types";
@@ -1,5 +1,5 @@
1
- export type ViewCartButtonProps = {
2
- cartTotalText: string;
3
- onClick: () => void;
4
- isOpen: boolean;
5
- } & React.ButtonHTMLAttributes<HTMLButtonElement>;
1
+ export type ViewCartButtonProps = {
2
+ cartTotalText: string;
3
+ onClick: () => void;
4
+ isOpen: boolean;
5
+ } & React.ButtonHTMLAttributes<HTMLButtonElement>;
@@ -1,40 +1,40 @@
1
- import { Button } from "./index";
2
-
3
- import { DocsPage } from "@shared/stories/DocsTemplate";
4
- import type { Meta, StoryObj } from "@storybook/react";
5
-
6
- const meta: Meta<typeof Button> = {
7
- title: "Contentful Blocks/Button",
8
- component: Button,
9
- tags: ["autodocs"],
10
- parameters: {
11
- layout: "centered",
12
- docs: {
13
- page: DocsPage,
14
- description: {
15
- component:
16
- "Contentful button block. Renders as solid (BrandButton) or text (Link).",
17
- },
18
- },
19
- },
20
- args: {
21
- showButtonAs: "solid",
22
- buttonVariant: "primary_brand",
23
- buttonLabel: "Button",
24
- buttonPrefix: "",
25
- badge: "",
26
- badgeIcon: "",
27
- buttonIcon: "",
28
- buttonIconPosition: "left",
29
- href: "",
30
- target: "_self",
31
- anchorId: "",
32
- preserveQueryParameters: false,
33
- clickToOpen: "",
34
- tabmodalNameToOpen: "",
35
- preDefinedFunctionExecution: "",
36
- },
37
- };
38
- export default meta;
39
- type Story = StoryObj<typeof meta>;
40
- export const Default: Story = {};
1
+ import { Button } from "./index";
2
+
3
+ import { DocsPage } from "@shared/stories/DocsTemplate";
4
+ import type { Meta, StoryObj } from "@storybook/react";
5
+
6
+ const meta: Meta<typeof Button> = {
7
+ title: "Contentful Blocks/Button",
8
+ component: Button,
9
+ tags: ["autodocs"],
10
+ parameters: {
11
+ layout: "centered",
12
+ docs: {
13
+ page: DocsPage,
14
+ description: {
15
+ component:
16
+ "Contentful button block. Renders as solid (BrandButton) or text (Link).",
17
+ },
18
+ },
19
+ },
20
+ args: {
21
+ showButtonAs: "solid",
22
+ buttonVariant: "primary_brand",
23
+ buttonLabel: "Button",
24
+ buttonPrefix: "",
25
+ badge: "",
26
+ badgeIcon: "",
27
+ buttonIcon: "",
28
+ buttonIconPosition: "left",
29
+ href: "",
30
+ target: "_self",
31
+ anchorId: "",
32
+ preserveQueryParameters: false,
33
+ clickToOpen: "",
34
+ tabmodalNameToOpen: "",
35
+ preDefinedFunctionExecution: "",
36
+ },
37
+ };
38
+ export default meta;
39
+ type Story = StoryObj<typeof meta>;
40
+ export const Default: Story = {};
@@ -1,64 +1,64 @@
1
- import React from "react";
2
- import { ButtonProps } from "./types";
3
-
4
- import { BrandButton } from "@shared/components/brand-button";
5
- import { Link } from "@shared/components/link";
6
-
7
- export const Button: React.FC<ButtonProps> = ({
8
- showButtonAs,
9
- buttonVariant,
10
- buttonLabel,
11
- buttonPrefix,
12
- href,
13
- target,
14
- anchorId,
15
- linkClassName,
16
- linkVariant,
17
- fullWidth,
18
- preDefinedFunctionExecution,
19
- checkPlansJSX,
20
- onClick,
21
- }) => {
22
- if (preDefinedFunctionExecution === "check availability") {
23
- return checkPlansJSX;
24
- }
25
- function linkClick(event: React.MouseEvent<HTMLAnchorElement>) {
26
- onClick?.(event);
27
- }
28
-
29
- function buttonClick(event: React.MouseEvent<HTMLButtonElement>) {
30
- onClick?.(event);
31
- }
32
-
33
- return showButtonAs === "solid" ? (
34
- <BrandButton
35
- id={anchorId}
36
- variant={buttonVariant}
37
- text={buttonLabel}
38
- label={buttonPrefix}
39
- fullWidth={fullWidth}
40
- onClick={buttonClick}
41
- // badge={badge}
42
- // badgeIcon={badgeIcon}
43
- // icon={buttonIcon}
44
- // iconPosition={buttonIconPosition}
45
- // href={href}
46
- // target={target}
47
- // preserveQueryParameters={preserveQueryParameters}
48
- // clickToOpen={clickToOpen}
49
- // tabmodalNameToOpen={tabmodalNameToOpen}
50
- // preDefinedFunctionExecution={preDefinedFunctionExecution}
51
- />
52
- ) : showButtonAs === "text" ? (
53
- <Link
54
- href={href}
55
- target={target}
56
- variant={linkVariant || "default"}
57
- className={`text-text-brand ${linkClassName || ""}`}
58
- onClick={linkClick}
59
- >
60
- {buttonLabel}
61
- </Link>
62
- ) : null;
63
- };
64
- export default Button;
1
+ import React from "react";
2
+ import { ButtonProps } from "./types";
3
+
4
+ import { BrandButton } from "@shared/components/brand-button";
5
+ import { Link } from "@shared/components/link";
6
+
7
+ export const Button: React.FC<ButtonProps> = ({
8
+ showButtonAs = "solid",
9
+ buttonVariant = "primary_brand",
10
+ buttonLabel,
11
+ buttonPrefix,
12
+ href,
13
+ target = "_blank",
14
+ anchorId,
15
+ linkClassName,
16
+ linkVariant,
17
+ fullWidth,
18
+ preDefinedFunctionExecution,
19
+ checkPlansJSX,
20
+ onClick,
21
+ }) => {
22
+ if (preDefinedFunctionExecution === "check availability") {
23
+ return checkPlansJSX;
24
+ }
25
+ function linkClick(event: React.MouseEvent<HTMLAnchorElement>) {
26
+ onClick?.(event);
27
+ }
28
+
29
+ function buttonClick(event: React.MouseEvent<HTMLButtonElement>) {
30
+ onClick?.(event);
31
+ }
32
+
33
+ return showButtonAs === "solid" ? (
34
+ <BrandButton
35
+ id={anchorId}
36
+ variant={buttonVariant}
37
+ text={buttonLabel}
38
+ label={buttonPrefix}
39
+ fullWidth={fullWidth}
40
+ onClick={buttonClick}
41
+ // badge={badge}
42
+ // badgeIcon={badgeIcon}
43
+ // icon={buttonIcon}
44
+ // iconPosition={buttonIconPosition}
45
+ // href={href}
46
+ // target={target}
47
+ // preserveQueryParameters={preserveQueryParameters}
48
+ // clickToOpen={clickToOpen}
49
+ // tabmodalNameToOpen={tabmodalNameToOpen}
50
+ // preDefinedFunctionExecution={preDefinedFunctionExecution}
51
+ />
52
+ ) : showButtonAs === "text" ? (
53
+ <Link
54
+ href={href}
55
+ target={target}
56
+ variant={linkVariant || "default"}
57
+ className={`text-text-brand ${linkClassName || ""}`}
58
+ onClick={linkClick}
59
+ >
60
+ {buttonLabel}
61
+ </Link>
62
+ ) : null;
63
+ };
64
+ export default Button;
@@ -1,24 +1,24 @@
1
- export type ButtonProps = {
2
- showButtonAs: "solid" | "text";
3
- buttonVariant: "primary_brand" | "secondary" | "primary_inverse";
4
- buttonLabel: string;
5
- buttonPrefix: string;
6
- badge: string;
7
- badgeIcon: string;
8
- buttonIcon: string;
9
- buttonIconPosition: "left" | "right";
10
- href: string;
11
- target: "_self" | "_blank";
12
- anchorId: string;
13
- preserveQueryParameters: boolean;
14
- clickToOpen: string;
15
- tabmodalNameToOpen: string;
16
- preDefinedFunctionExecution: string;
17
- checkPlansJSX?: React.ReactNode;
18
- linkClassName?: string;
19
- linkVariant?: "unstyled" | "default";
20
- fullWidth?: boolean;
21
- onClick?: (
22
- event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>
23
- ) => void;
24
- };
1
+ export type ButtonProps = {
2
+ showButtonAs?: "solid" | "text";
3
+ buttonVariant?: "primary_brand" | "secondary" | "primary_inverse";
4
+ buttonLabel?: string;
5
+ buttonPrefix?: string;
6
+ badge?: string;
7
+ badgeIcon?: string;
8
+ buttonIcon?: string;
9
+ buttonIconPosition?: "left" | "right";
10
+ href?: string;
11
+ target?: "_self" | "_blank";
12
+ anchorId?: string;
13
+ preserveQueryParameters?: boolean;
14
+ clickToOpen?: string;
15
+ tabmodalNameToOpen?: string;
16
+ preDefinedFunctionExecution?: string;
17
+ checkPlansJSX?: React.ReactNode;
18
+ linkClassName?: string;
19
+ linkVariant?: "unstyled" | "default";
20
+ fullWidth?: boolean;
21
+ onClick?: (
22
+ event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>
23
+ ) => void;
24
+ };
@@ -1,23 +1,23 @@
1
- import { Callout } from "./index";
2
-
3
- import { DocsPage } from "@shared/stories/DocsTemplate";
4
- import type { Meta, StoryObj } from "@storybook/react";
5
-
6
- const meta: Meta<typeof Callout> = {
7
- title: "Contentful Blocks/Callout",
8
- component: Callout,
9
- tags: ["autodocs"],
10
- parameters: {
11
- layout: "centered",
12
- docs: {
13
- page: DocsPage,
14
- description: {
15
- component: "Contentful callout block.",
16
- },
17
- },
18
- },
19
- args: {},
20
- };
21
- export default meta;
22
- type Story = StoryObj<typeof meta>;
23
- export const Default: Story = {};
1
+ import { Callout } from "./index";
2
+
3
+ import { DocsPage } from "@shared/stories/DocsTemplate";
4
+ import type { Meta, StoryObj } from "@storybook/react";
5
+
6
+ const meta: Meta<typeof Callout> = {
7
+ title: "Contentful Blocks/Callout",
8
+ component: Callout,
9
+ tags: ["autodocs"],
10
+ parameters: {
11
+ layout: "centered",
12
+ docs: {
13
+ page: DocsPage,
14
+ description: {
15
+ component: "Contentful callout block.",
16
+ },
17
+ },
18
+ },
19
+ args: {},
20
+ };
21
+ export default meta;
22
+ type Story = StoryObj<typeof meta>;
23
+ export const Default: Story = {};
@@ -1,23 +1,23 @@
1
- import { Cards } from "./index";
2
-
3
- import { DocsPage } from "@shared/stories/DocsTemplate";
4
- import type { Meta, StoryObj } from "@storybook/react";
5
-
6
- const meta: Meta<typeof Cards> = {
7
- title: "Contentful Blocks/Cards",
8
- component: Cards,
9
- tags: ["autodocs"],
10
- parameters: {
11
- layout: "centered",
12
- docs: {
13
- page: DocsPage,
14
- description: {
15
- component: "Contentful cards block.",
16
- },
17
- },
18
- },
19
- args: { fields: {} },
20
- };
21
- export default meta;
22
- type Story = StoryObj<typeof meta>;
23
- export const Default: Story = {};
1
+ import { Cards } from "./index";
2
+
3
+ import { DocsPage } from "@shared/stories/DocsTemplate";
4
+ import type { Meta, StoryObj } from "@storybook/react";
5
+
6
+ const meta: Meta<typeof Cards> = {
7
+ title: "Contentful Blocks/Cards",
8
+ component: Cards,
9
+ tags: ["autodocs"],
10
+ parameters: {
11
+ layout: "centered",
12
+ docs: {
13
+ page: DocsPage,
14
+ description: {
15
+ component: "Contentful cards block.",
16
+ },
17
+ },
18
+ },
19
+ args: { fields: {} },
20
+ };
21
+ export default meta;
22
+ type Story = StoryObj<typeof meta>;
23
+ export const Default: Story = {};
@@ -1,13 +1,13 @@
1
- import { CardsProps } from "./types";
2
-
3
- import { Text } from "@shared/components/text";
4
-
5
- export const Cards: React.FC<{ fields: CardsProps }> = ({ fields }) => {
6
- return (
7
- <div>
8
- <Text>Cards</Text>
9
- </div>
10
- );
11
- };
12
-
13
- export default Cards;
1
+ import { CardsProps } from "./types";
2
+
3
+ import { Text } from "@shared/components/text";
4
+
5
+ export const Cards: React.FC<{ fields: CardsProps }> = ({ fields }) => {
6
+ return (
7
+ <div>
8
+ <Text>Cards</Text>
9
+ </div>
10
+ );
11
+ };
12
+
13
+ export default Cards;