@windstream/react-shared-components 0.0.71 → 0.0.73

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 (138) hide show
  1. package/README.md +629 -629
  2. package/dist/contentful/index.d.ts +17 -6
  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 +4 -4
  8. package/dist/index.d.ts +1 -1
  9. package/dist/index.js.map +1 -1
  10. package/dist/styles.css +1 -1
  11. package/package.json +175 -175
  12. package/src/components/accordion/Accordion.stories.tsx +230 -230
  13. package/src/components/accordion/types.ts +10 -10
  14. package/src/components/alert-card/AlertCard.stories.tsx +171 -171
  15. package/src/components/alert-card/index.tsx +32 -32
  16. package/src/components/alert-card/types.ts +9 -9
  17. package/src/components/brand-button/BrandButton.stories.tsx +219 -219
  18. package/src/components/brand-button/helpers.ts +35 -35
  19. package/src/components/brand-button/index.tsx +93 -93
  20. package/src/components/brand-button/types.ts +25 -25
  21. package/src/components/button/Button.stories.tsx +108 -108
  22. package/src/components/button/index.tsx +27 -27
  23. package/src/components/button/types.ts +14 -14
  24. package/src/components/call-button/CallButton.stories.tsx +324 -324
  25. package/src/components/call-button/index.tsx +86 -86
  26. package/src/components/call-button/types.ts +11 -11
  27. package/src/components/checkbox/Checkbox.stories.tsx +247 -247
  28. package/src/components/checkbox/index.tsx +197 -197
  29. package/src/components/checkbox/types.ts +27 -27
  30. package/src/components/checklist/Checklist.stories.tsx +150 -150
  31. package/src/components/collapse/Collapse.stories.tsx +255 -255
  32. package/src/components/collapse/index.tsx +46 -46
  33. package/src/components/collapse/types.ts +6 -6
  34. package/src/components/divider/Divider.stories.tsx +205 -205
  35. package/src/components/divider/index.tsx +22 -22
  36. package/src/components/divider/type.ts +3 -3
  37. package/src/components/image/Image.stories.tsx +113 -113
  38. package/src/components/image/index.tsx +25 -25
  39. package/src/components/image/types.ts +40 -40
  40. package/src/components/input/Input.stories.tsx +325 -325
  41. package/src/components/input/index.tsx +177 -177
  42. package/src/components/input/types.ts +37 -37
  43. package/src/components/link/Link.stories.tsx +163 -163
  44. package/src/components/link/types.ts +25 -25
  45. package/src/components/list/List.stories.tsx +272 -272
  46. package/src/components/list/index.tsx +88 -88
  47. package/src/components/list/list-item/index.tsx +38 -38
  48. package/src/components/list/list-item/types.ts +13 -13
  49. package/src/components/list/types.ts +29 -29
  50. package/src/components/material-icon/MaterialIcon.stories.tsx +330 -330
  51. package/src/components/material-icon/constants.ts +96 -96
  52. package/src/components/material-icon/index.tsx +44 -44
  53. package/src/components/material-icon/types.ts +31 -31
  54. package/src/components/modal/Modal.stories.tsx +171 -171
  55. package/src/components/modal/index.tsx +164 -164
  56. package/src/components/modal/types.ts +24 -24
  57. package/src/components/next-image/index.tsx +32 -32
  58. package/src/components/next-image/types.ts +1 -1
  59. package/src/components/radio-button/RadioButton.stories.tsx +307 -307
  60. package/src/components/radio-button/index.tsx +75 -75
  61. package/src/components/radio-button/types.ts +21 -21
  62. package/src/components/see-more/SeeMore.stories.tsx +181 -181
  63. package/src/components/see-more/index.tsx +44 -44
  64. package/src/components/see-more/types.ts +4 -4
  65. package/src/components/select/Select.stories.tsx +411 -411
  66. package/src/components/select/index.tsx +150 -150
  67. package/src/components/select/types.ts +35 -35
  68. package/src/components/select-plan-button/SelectPlanButton.stories.tsx +184 -184
  69. package/src/components/select-plan-button/index.tsx +31 -31
  70. package/src/components/select-plan-button/types.ts +5 -5
  71. package/src/components/skeleton/Skeleton.stories.tsx +179 -179
  72. package/src/components/skeleton/index.tsx +61 -61
  73. package/src/components/skeleton/types.ts +4 -4
  74. package/src/components/spinner/Spinner.stories.tsx +335 -335
  75. package/src/components/spinner/index.tsx +44 -44
  76. package/src/components/spinner/types.ts +5 -5
  77. package/src/components/text/Text.stories.tsx +321 -321
  78. package/src/components/text/index.tsx +25 -25
  79. package/src/components/text/types.ts +45 -45
  80. package/src/components/tooltip/Tooltip.stories.tsx +219 -219
  81. package/src/components/tooltip/index.tsx +74 -74
  82. package/src/components/tooltip/types.ts +7 -7
  83. package/src/components/view-cart-button/ViewCartButton.stories.tsx +252 -252
  84. package/src/components/view-cart-button/index.tsx +44 -44
  85. package/src/components/view-cart-button/types.ts +5 -5
  86. package/src/contentful/blocks/button/Button.stories.tsx +40 -40
  87. package/src/contentful/blocks/button/index.tsx +84 -84
  88. package/src/contentful/blocks/button/types.ts +26 -26
  89. package/src/contentful/blocks/callout/Callout.stories.tsx +23 -23
  90. package/src/contentful/blocks/callout/index.tsx +66 -52
  91. package/src/contentful/blocks/cards/Cards.stories.tsx +23 -23
  92. package/src/contentful/blocks/cards/index.tsx +13 -13
  93. package/src/contentful/blocks/cards/product-card/index.tsx +199 -199
  94. package/src/contentful/blocks/cards/product-card/types.ts +18 -18
  95. package/src/contentful/blocks/cards/simple-card/index.tsx +77 -45
  96. package/src/contentful/blocks/cards/simple-card/types.ts +31 -9
  97. package/src/contentful/blocks/cards/testimonial-card/index.tsx +88 -88
  98. package/src/contentful/blocks/cards/testimonial-card/types.tsx +12 -12
  99. package/src/contentful/blocks/cards/types.ts +1 -1
  100. package/src/contentful/blocks/carousel/Carousel.stories.tsx +23 -23
  101. package/src/contentful/blocks/carousel/helper.tsx +314 -314
  102. package/src/contentful/blocks/carousel/index.tsx +50 -50
  103. package/src/contentful/blocks/carousel/types.ts +126 -126
  104. package/src/contentful/blocks/cta-callout/CtaCallout.stories.tsx +46 -46
  105. package/src/contentful/blocks/cta-callout/index.tsx +54 -54
  106. package/src/contentful/blocks/cta-callout/types.ts +22 -22
  107. package/src/contentful/blocks/floating-banner/FloatingBanner.stories.tsx +34 -34
  108. package/src/contentful/blocks/floating-banner/types.ts +22 -22
  109. package/src/contentful/blocks/footer/Footer.stories.tsx +30 -30
  110. package/src/contentful/blocks/image-promo-bar/ImagePromoBar.stories.tsx +23 -23
  111. package/src/contentful/blocks/image-promo-bar/types.ts +27 -27
  112. package/src/contentful/blocks/modal/Modal.stories.tsx +23 -23
  113. package/src/contentful/blocks/modal/index.tsx +12 -12
  114. package/src/contentful/blocks/modal/types.ts +1 -1
  115. package/src/contentful/blocks/navigation/desktop-link-groups.tsx/index.tsx +111 -111
  116. package/src/contentful/blocks/navigation/index.tsx +380 -380
  117. package/src/contentful/blocks/navigation/mobile-link-groups.tsx/index.tsx +80 -80
  118. package/src/contentful/blocks/navigation/types.ts +41 -41
  119. package/src/contentful/blocks/primary-hero/PrimaryHero.stories.tsx +23 -23
  120. package/src/contentful/blocks/primary-hero/index.tsx +160 -160
  121. package/src/contentful/blocks/primary-hero/types.ts +30 -30
  122. package/src/contentful/blocks/shape-background-wrapper/ShapeBackgroundWrapper.stories.tsx +26 -26
  123. package/src/contentful/blocks/shape-background-wrapper/index.tsx +124 -124
  124. package/src/contentful/blocks/shape-background-wrapper/types.ts +36 -36
  125. package/src/contentful/blocks/text/Text.stories.tsx +23 -23
  126. package/src/contentful/blocks/text/index.tsx +12 -12
  127. package/src/contentful/blocks/text/types.ts +1 -1
  128. package/src/contentful/index.ts +57 -57
  129. package/src/hooks/use-body-scroll-lock.ts +34 -34
  130. package/src/hooks/use-outside-click.ts +17 -17
  131. package/src/index.ts +96 -96
  132. package/src/next/index.ts +5 -5
  133. package/src/setupTests.ts +46 -46
  134. package/src/stories/DocsTemplate.tsx +24 -24
  135. package/src/styles/globals.css +307 -307
  136. package/src/types/global.d.ts +9 -9
  137. package/src/types/micro-components.ts +80 -80
  138. package/src/utils/index.ts +49 -49
@@ -1,88 +1,88 @@
1
- "use client";
2
-
3
- import React, { forwardRef } from "react";
4
- import { cx } from "../../utils";
5
- import { ListItem, ListItemProps } from "./list-item";
6
- import { ListProps } from "./types";
7
-
8
- export const List = forwardRef<HTMLUListElement | HTMLOListElement, ListProps>(
9
- (
10
- {
11
- type = "ul",
12
- items,
13
- className = "",
14
- renderItem,
15
- children,
16
- variant = "unstyled",
17
- style,
18
- ...props
19
- },
20
- ref
21
- ) => {
22
- // Get Tailwind classes for different variants
23
- const getVariantClasses = () => {
24
- if (variant === "unstyled") {
25
- return "";
26
- }
27
-
28
- // TODO: Add styles based on the figma design for all variants
29
- const baseClasses = "m-0 p-0";
30
- const typeClasses =
31
- type === "ol" ? "pl-6 list-decimal" : "pl-5 list-disc";
32
-
33
- return `${baseClasses} ${typeClasses}`;
34
- };
35
-
36
- const tailwindClasses = getVariantClasses();
37
- const combinedClassName = cx(
38
- tailwindClasses,
39
- `list--${type}`,
40
- `list--${variant}`,
41
- className
42
- );
43
-
44
- // Render items if provided
45
- const renderItems = () => {
46
- if (!items || items.length === 0) return null;
47
-
48
- return items.map((item, index) => {
49
- if (renderItem) {
50
- return renderItem(item, index);
51
- }
52
-
53
- return (
54
- <ListItem
55
- key={item.id || index}
56
- className={item.className}
57
- variant={variant}
58
- >
59
- {item.content}
60
- </ListItem>
61
- );
62
- });
63
- };
64
-
65
- const content = children || renderItems();
66
-
67
- // Create props object to avoid duplication
68
- const listProps = {
69
- className: combinedClassName,
70
- style,
71
- ...props,
72
- children: content,
73
- };
74
-
75
- // Return appropriate list type with conditional rendering for proper TypeScript inference
76
- if (type === "ol") {
77
- return <ol {...listProps} ref={ref as React.Ref<HTMLOListElement>} />;
78
- }
79
-
80
- return <ul {...listProps} ref={ref as React.Ref<HTMLUListElement>} />;
81
- }
82
- );
83
-
84
- List.displayName = "List";
85
-
86
- export { ListItem };
87
-
88
- export type { ListProps, ListItemProps };
1
+ "use client";
2
+
3
+ import React, { forwardRef } from "react";
4
+ import { cx } from "../../utils";
5
+ import { ListItem, ListItemProps } from "./list-item";
6
+ import { ListProps } from "./types";
7
+
8
+ export const List = forwardRef<HTMLUListElement | HTMLOListElement, ListProps>(
9
+ (
10
+ {
11
+ type = "ul",
12
+ items,
13
+ className = "",
14
+ renderItem,
15
+ children,
16
+ variant = "unstyled",
17
+ style,
18
+ ...props
19
+ },
20
+ ref
21
+ ) => {
22
+ // Get Tailwind classes for different variants
23
+ const getVariantClasses = () => {
24
+ if (variant === "unstyled") {
25
+ return "";
26
+ }
27
+
28
+ // TODO: Add styles based on the figma design for all variants
29
+ const baseClasses = "m-0 p-0";
30
+ const typeClasses =
31
+ type === "ol" ? "pl-6 list-decimal" : "pl-5 list-disc";
32
+
33
+ return `${baseClasses} ${typeClasses}`;
34
+ };
35
+
36
+ const tailwindClasses = getVariantClasses();
37
+ const combinedClassName = cx(
38
+ tailwindClasses,
39
+ `list--${type}`,
40
+ `list--${variant}`,
41
+ className
42
+ );
43
+
44
+ // Render items if provided
45
+ const renderItems = () => {
46
+ if (!items || items.length === 0) return null;
47
+
48
+ return items.map((item, index) => {
49
+ if (renderItem) {
50
+ return renderItem(item, index);
51
+ }
52
+
53
+ return (
54
+ <ListItem
55
+ key={item.id || index}
56
+ className={item.className}
57
+ variant={variant}
58
+ >
59
+ {item.content}
60
+ </ListItem>
61
+ );
62
+ });
63
+ };
64
+
65
+ const content = children || renderItems();
66
+
67
+ // Create props object to avoid duplication
68
+ const listProps = {
69
+ className: combinedClassName,
70
+ style,
71
+ ...props,
72
+ children: content,
73
+ };
74
+
75
+ // Return appropriate list type with conditional rendering for proper TypeScript inference
76
+ if (type === "ol") {
77
+ return <ol {...listProps} ref={ref as React.Ref<HTMLOListElement>} />;
78
+ }
79
+
80
+ return <ul {...listProps} ref={ref as React.Ref<HTMLUListElement>} />;
81
+ }
82
+ );
83
+
84
+ List.displayName = "List";
85
+
86
+ export { ListItem };
87
+
88
+ export type { ListProps, ListItemProps };
@@ -1,38 +1,38 @@
1
- "use client";
2
-
3
- import { forwardRef } from "react";
4
- import { cx } from "../../../utils";
5
- import { ListItemProps } from "./types";
6
-
7
- export const ListItem = forwardRef<HTMLLIElement, ListItemProps>(
8
- (
9
- { children, className = "", variant = "unstyled", style, ...props },
10
- ref
11
- ) => {
12
- // Get Tailwind classes for different variants
13
- const getVariantClasses = () => {
14
- if (variant === "unstyled") return "";
15
-
16
- // TODO: Add styles based on the figma design for all variants
17
- return "mb-1 leading-6";
18
- };
19
-
20
- const tailwindClasses = getVariantClasses();
21
- const combinedClassName = cx(
22
- tailwindClasses,
23
- "list-item",
24
- `list-item--${variant}`,
25
- className
26
- );
27
-
28
- return (
29
- <li ref={ref} className={combinedClassName} style={style} {...props}>
30
- {children}
31
- </li>
32
- );
33
- }
34
- );
35
-
36
- ListItem.displayName = "ListItem";
37
-
38
- export type { ListItemProps };
1
+ "use client";
2
+
3
+ import { forwardRef } from "react";
4
+ import { cx } from "../../../utils";
5
+ import { ListItemProps } from "./types";
6
+
7
+ export const ListItem = forwardRef<HTMLLIElement, ListItemProps>(
8
+ (
9
+ { children, className = "", variant = "unstyled", style, ...props },
10
+ ref
11
+ ) => {
12
+ // Get Tailwind classes for different variants
13
+ const getVariantClasses = () => {
14
+ if (variant === "unstyled") return "";
15
+
16
+ // TODO: Add styles based on the figma design for all variants
17
+ return "mb-1 leading-6";
18
+ };
19
+
20
+ const tailwindClasses = getVariantClasses();
21
+ const combinedClassName = cx(
22
+ tailwindClasses,
23
+ "list-item",
24
+ `list-item--${variant}`,
25
+ className
26
+ );
27
+
28
+ return (
29
+ <li ref={ref} className={combinedClassName} style={style} {...props}>
30
+ {children}
31
+ </li>
32
+ );
33
+ }
34
+ );
35
+
36
+ ListItem.displayName = "ListItem";
37
+
38
+ export type { ListItemProps };
@@ -1,13 +1,13 @@
1
- import { CSSProperties, LiHTMLAttributes, ReactNode } from "react";
2
- import { ListVariant } from "../types";
3
-
4
- export interface ListItemProps extends LiHTMLAttributes<HTMLLIElement> {
5
- /** Content to render inside the list item */
6
- children: ReactNode;
7
- /** Custom className for the list item */
8
- className?: string;
9
- /** Additional styling options */
10
- variant?: ListVariant;
11
- /** Custom styles */
12
- style?: CSSProperties;
13
- }
1
+ import { CSSProperties, LiHTMLAttributes, ReactNode } from "react";
2
+ import { ListVariant } from "../types";
3
+
4
+ export interface ListItemProps extends LiHTMLAttributes<HTMLLIElement> {
5
+ /** Content to render inside the list item */
6
+ children: ReactNode;
7
+ /** Custom className for the list item */
8
+ className?: string;
9
+ /** Additional styling options */
10
+ variant?: ListVariant;
11
+ /** Custom styles */
12
+ style?: CSSProperties;
13
+ }
@@ -1,29 +1,29 @@
1
- import { CSSProperties, HTMLAttributes, ReactNode } from "react";
2
-
3
- export type ListType = "ul" | "ol";
4
- export type ListVariant = "default" | "unstyled";
5
-
6
- export type ListItem = {
7
- id: string | number;
8
- content: ReactNode;
9
- className?: string;
10
- [key: string]: any;
11
- };
12
-
13
- export interface ListProps
14
- extends Omit<HTMLAttributes<HTMLUListElement | HTMLOListElement>, "type"> {
15
- /** List type - unordered (ul) or ordered (ol) */
16
- type?: ListType;
17
- /** Array of items to render */
18
- items?: ListItem[];
19
- /** Custom className for the list */
20
- className?: string;
21
- /** Custom item renderer function */
22
- renderItem?: (item: ListItem, index: number) => ReactNode;
23
- /** Children to render instead of items */
24
- children?: ReactNode;
25
- /** Additional styling options */
26
- variant?: ListVariant;
27
- /** Custom styles */
28
- style?: CSSProperties;
29
- }
1
+ import { CSSProperties, HTMLAttributes, ReactNode } from "react";
2
+
3
+ export type ListType = "ul" | "ol";
4
+ export type ListVariant = "default" | "unstyled";
5
+
6
+ export type ListItem = {
7
+ id: string | number;
8
+ content: ReactNode;
9
+ className?: string;
10
+ [key: string]: any;
11
+ };
12
+
13
+ export interface ListProps
14
+ extends Omit<HTMLAttributes<HTMLUListElement | HTMLOListElement>, "type"> {
15
+ /** List type - unordered (ul) or ordered (ol) */
16
+ type?: ListType;
17
+ /** Array of items to render */
18
+ items?: ListItem[];
19
+ /** Custom className for the list */
20
+ className?: string;
21
+ /** Custom item renderer function */
22
+ renderItem?: (item: ListItem, index: number) => ReactNode;
23
+ /** Children to render instead of items */
24
+ children?: ReactNode;
25
+ /** Additional styling options */
26
+ variant?: ListVariant;
27
+ /** Custom styles */
28
+ style?: CSSProperties;
29
+ }