@windstream/react-shared-components 0.0.93 → 0.0.94

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 (150) hide show
  1. package/README.md +635 -635
  2. package/dist/contentful/index.d.ts +28 -31
  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 +1 -1
  8. package/dist/index.d.ts +1 -1
  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/styles.css +1 -1
  14. package/package.json +177 -177
  15. package/src/components/accordion/Accordion.stories.tsx +230 -230
  16. package/src/components/accordion/index.tsx +9 -2
  17. package/src/components/accordion/types.ts +11 -10
  18. package/src/components/alert-card/AlertCard.stories.tsx +171 -171
  19. package/src/components/alert-card/index.tsx +33 -33
  20. package/src/components/alert-card/types.ts +11 -11
  21. package/src/components/brand-button/BrandButton.stories.tsx +223 -223
  22. package/src/components/brand-button/helpers.ts +35 -35
  23. package/src/components/brand-button/index.tsx +115 -115
  24. package/src/components/brand-button/types.ts +37 -37
  25. package/src/components/button/Button.stories.tsx +108 -108
  26. package/src/components/button/index.tsx +27 -27
  27. package/src/components/button/types.ts +14 -14
  28. package/src/components/call-button/CallButton.stories.tsx +324 -324
  29. package/src/components/call-button/index.tsx +86 -86
  30. package/src/components/call-button/types.ts +11 -11
  31. package/src/components/checkbox/Checkbox.stories.tsx +247 -247
  32. package/src/components/checkbox/index.tsx +197 -197
  33. package/src/components/checkbox/types.ts +27 -27
  34. package/src/components/checklist/Checklist.stories.tsx +150 -150
  35. package/src/components/checklist/index.tsx +55 -55
  36. package/src/components/checklist/types.ts +14 -14
  37. package/src/components/collapse/Collapse.stories.tsx +255 -255
  38. package/src/components/collapse/index.tsx +46 -46
  39. package/src/components/collapse/types.ts +6 -6
  40. package/src/components/divider/Divider.stories.tsx +205 -205
  41. package/src/components/divider/index.tsx +22 -22
  42. package/src/components/divider/type.ts +3 -3
  43. package/src/components/image/Image.stories.tsx +113 -113
  44. package/src/components/image/index.tsx +25 -25
  45. package/src/components/image/types.ts +40 -40
  46. package/src/components/input/Input.stories.tsx +325 -325
  47. package/src/components/input/index.tsx +177 -177
  48. package/src/components/input/types.ts +37 -37
  49. package/src/components/link/Link.stories.tsx +163 -163
  50. package/src/components/link/types.ts +25 -25
  51. package/src/components/list/List.stories.tsx +272 -272
  52. package/src/components/list/index.tsx +88 -88
  53. package/src/components/list/list-item/index.tsx +38 -38
  54. package/src/components/list/list-item/types.ts +13 -13
  55. package/src/components/list/types.ts +29 -29
  56. package/src/components/material-icon/MaterialIcon.stories.tsx +322 -322
  57. package/src/components/material-icon/constants.ts +98 -98
  58. package/src/components/material-icon/index.tsx +47 -47
  59. package/src/components/material-icon/types.ts +31 -31
  60. package/src/components/modal/Modal.stories.tsx +171 -171
  61. package/src/components/modal/index.tsx +164 -164
  62. package/src/components/modal/types.ts +24 -24
  63. package/src/components/next-image/index.tsx +32 -32
  64. package/src/components/next-image/types.ts +1 -1
  65. package/src/components/radio-button/RadioButton.stories.tsx +307 -307
  66. package/src/components/radio-button/index.tsx +75 -75
  67. package/src/components/radio-button/types.ts +21 -21
  68. package/src/components/see-more/SeeMore.stories.tsx +181 -181
  69. package/src/components/see-more/index.tsx +44 -44
  70. package/src/components/see-more/types.ts +4 -4
  71. package/src/components/select/Select.stories.tsx +411 -411
  72. package/src/components/select/index.tsx +150 -150
  73. package/src/components/select/types.ts +35 -35
  74. package/src/components/select-plan-button/SelectPlanButton.stories.tsx +184 -184
  75. package/src/components/select-plan-button/index.tsx +31 -31
  76. package/src/components/select-plan-button/types.ts +5 -5
  77. package/src/components/skeleton/Skeleton.stories.tsx +179 -179
  78. package/src/components/skeleton/index.tsx +61 -61
  79. package/src/components/skeleton/types.ts +4 -4
  80. package/src/components/spinner/Spinner.stories.tsx +335 -335
  81. package/src/components/spinner/index.tsx +44 -44
  82. package/src/components/spinner/types.ts +5 -5
  83. package/src/components/text/Text.stories.tsx +321 -321
  84. package/src/components/text/index.tsx +25 -25
  85. package/src/components/text/types.ts +45 -45
  86. package/src/components/tooltip/Tooltip.stories.tsx +219 -219
  87. package/src/components/tooltip/index.tsx +74 -74
  88. package/src/components/tooltip/types.ts +7 -7
  89. package/src/components/view-cart-button/ViewCartButton.stories.tsx +252 -252
  90. package/src/components/view-cart-button/index.tsx +42 -42
  91. package/src/components/view-cart-button/types.ts +5 -5
  92. package/src/contentful/blocks/accordion/index.tsx +3 -1
  93. package/src/contentful/blocks/button/Button.stories.tsx +40 -40
  94. package/src/contentful/blocks/button/index.tsx +3 -1
  95. package/src/contentful/blocks/button/types.ts +32 -31
  96. package/src/contentful/blocks/callout/Callout.stories.tsx +23 -23
  97. package/src/contentful/blocks/callout/index.tsx +66 -66
  98. package/src/contentful/blocks/cards/Cards.stories.tsx +23 -23
  99. package/src/contentful/blocks/cards/index.tsx +13 -13
  100. package/src/contentful/blocks/cards/product-card/index.tsx +199 -199
  101. package/src/contentful/blocks/cards/product-card/types.ts +21 -21
  102. package/src/contentful/blocks/cards/simple-card/index.tsx +12 -1
  103. package/src/contentful/blocks/cards/simple-card/types.ts +2 -5
  104. package/src/contentful/blocks/cards/testimonial-card/index.tsx +88 -88
  105. package/src/contentful/blocks/cards/testimonial-card/types.tsx +12 -12
  106. package/src/contentful/blocks/cards/types.ts +1 -1
  107. package/src/contentful/blocks/carousel/Carousel.stories.tsx +23 -23
  108. package/src/contentful/blocks/carousel/helper.tsx +348 -349
  109. package/src/contentful/blocks/carousel/index.tsx +68 -68
  110. package/src/contentful/blocks/carousel/types.ts +139 -139
  111. package/src/contentful/blocks/cta-callout/CtaCallout.stories.tsx +46 -46
  112. package/src/contentful/blocks/cta-callout/index.tsx +54 -54
  113. package/src/contentful/blocks/cta-callout/types.ts +22 -22
  114. package/src/contentful/blocks/find-kinetic/index.tsx +124 -124
  115. package/src/contentful/blocks/floating-banner/FloatingBanner.stories.tsx +34 -34
  116. package/src/contentful/blocks/floating-banner/types.ts +22 -22
  117. package/src/contentful/blocks/footer/Footer.stories.tsx +30 -30
  118. package/src/contentful/blocks/image-promo-bar/ImagePromoBar.stories.tsx +23 -23
  119. package/src/contentful/blocks/image-promo-bar/helper.tsx +28 -28
  120. package/src/contentful/blocks/image-promo-bar/index.tsx +231 -231
  121. package/src/contentful/blocks/image-promo-bar/types.ts +44 -44
  122. package/src/contentful/blocks/image-promo-bar/vimeo-embed.tsx +93 -93
  123. package/src/contentful/blocks/image-promo-bar/youtube-embed.tsx +46 -46
  124. package/src/contentful/blocks/modal/constants.ts +53 -53
  125. package/src/contentful/blocks/modal/index.tsx +91 -91
  126. package/src/contentful/blocks/modal/types.ts +12 -12
  127. package/src/contentful/blocks/navigation/desktop-link-groups.tsx/index.tsx +111 -111
  128. package/src/contentful/blocks/navigation/index.tsx +385 -385
  129. package/src/contentful/blocks/navigation/mobile-link-groups.tsx/index.tsx +80 -80
  130. package/src/contentful/blocks/navigation/types.ts +41 -41
  131. package/src/contentful/blocks/primary-hero/PrimaryHero.stories.tsx +23 -23
  132. package/src/contentful/blocks/primary-hero/index.tsx +228 -228
  133. package/src/contentful/blocks/primary-hero/types.ts +35 -35
  134. package/src/contentful/blocks/shape-background-wrapper/ShapeBackgroundWrapper.stories.tsx +26 -26
  135. package/src/contentful/blocks/shape-background-wrapper/index.tsx +124 -124
  136. package/src/contentful/blocks/shape-background-wrapper/types.ts +36 -36
  137. package/src/contentful/blocks/text/Text.stories.tsx +23 -23
  138. package/src/contentful/blocks/text/index.tsx +12 -12
  139. package/src/contentful/blocks/text/types.ts +1 -1
  140. package/src/contentful/index.ts +57 -57
  141. package/src/hooks/use-body-scroll-lock.ts +34 -34
  142. package/src/hooks/use-outside-click.ts +17 -17
  143. package/src/index.ts +96 -96
  144. package/src/next/index.ts +5 -5
  145. package/src/setupTests.ts +46 -46
  146. package/src/stories/DocsTemplate.tsx +24 -24
  147. package/src/styles/globals.css +343 -343
  148. package/src/types/global.d.ts +9 -9
  149. package/src/types/micro-components.ts +89 -89
  150. 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
+ }