@windstream/react-shared-components 0.1.1 → 0.1.3

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 (151) hide show
  1. package/README.md +635 -635
  2. package/dist/contentful/index.esm.js +2 -2
  3. package/dist/contentful/index.esm.js.map +1 -1
  4. package/dist/contentful/index.js +2 -2
  5. package/dist/contentful/index.js.map +1 -1
  6. package/dist/core.d.ts +1 -1
  7. package/dist/index.d.ts +1 -1
  8. package/dist/index.esm.js +1 -1
  9. package/dist/index.esm.js.map +1 -1
  10. package/dist/index.js +1 -1
  11. package/dist/index.js.map +1 -1
  12. package/package.json +177 -177
  13. package/src/components/accordion/Accordion.stories.tsx +230 -230
  14. package/src/components/accordion/types.ts +11 -11
  15. package/src/components/alert-card/AlertCard.stories.tsx +171 -171
  16. package/src/components/alert-card/index.tsx +38 -38
  17. package/src/components/alert-card/types.ts +12 -12
  18. package/src/components/brand-button/BrandButton.stories.tsx +223 -223
  19. package/src/components/brand-button/helpers.ts +35 -35
  20. package/src/components/brand-button/index.tsx +115 -115
  21. package/src/components/brand-button/types.ts +37 -37
  22. package/src/components/button/Button.stories.tsx +108 -108
  23. package/src/components/button/index.tsx +27 -27
  24. package/src/components/button/types.ts +14 -14
  25. package/src/components/call-button/CallButton.stories.tsx +324 -324
  26. package/src/components/call-button/index.tsx +86 -86
  27. package/src/components/call-button/types.ts +11 -11
  28. package/src/components/checkbox/Checkbox.stories.tsx +247 -247
  29. package/src/components/checkbox/index.tsx +197 -197
  30. package/src/components/checkbox/types.ts +27 -27
  31. package/src/components/checklist/Checklist.stories.tsx +150 -150
  32. package/src/components/checklist/index.tsx +55 -55
  33. package/src/components/checklist/types.ts +14 -14
  34. package/src/components/collapse/Collapse.stories.tsx +255 -255
  35. package/src/components/collapse/index.tsx +46 -46
  36. package/src/components/collapse/types.ts +6 -6
  37. package/src/components/divider/Divider.stories.tsx +205 -205
  38. package/src/components/divider/index.tsx +22 -22
  39. package/src/components/divider/type.ts +3 -3
  40. package/src/components/image/Image.stories.tsx +113 -113
  41. package/src/components/image/index.tsx +25 -25
  42. package/src/components/image/types.ts +40 -40
  43. package/src/components/input/Input.stories.tsx +325 -325
  44. package/src/components/input/index.tsx +177 -177
  45. package/src/components/input/types.ts +37 -37
  46. package/src/components/link/Link.stories.tsx +163 -163
  47. package/src/components/link/types.ts +25 -25
  48. package/src/components/list/List.stories.tsx +272 -272
  49. package/src/components/list/index.tsx +88 -88
  50. package/src/components/list/list-item/index.tsx +38 -38
  51. package/src/components/list/list-item/types.ts +13 -13
  52. package/src/components/list/types.ts +29 -29
  53. package/src/components/material-icon/MaterialIcon.stories.tsx +322 -322
  54. package/src/components/material-icon/constants.ts +98 -98
  55. package/src/components/material-icon/index.tsx +47 -47
  56. package/src/components/material-icon/types.ts +31 -31
  57. package/src/components/modal/Modal.stories.tsx +171 -171
  58. package/src/components/modal/index.tsx +164 -164
  59. package/src/components/modal/types.ts +24 -24
  60. package/src/components/next-image/index.tsx +32 -32
  61. package/src/components/next-image/types.ts +1 -1
  62. package/src/components/pagination/index.tsx +100 -100
  63. package/src/components/pagination/types.ts +6 -6
  64. package/src/components/radio-button/RadioButton.stories.tsx +307 -307
  65. package/src/components/radio-button/index.tsx +75 -75
  66. package/src/components/radio-button/types.ts +21 -21
  67. package/src/components/see-more/SeeMore.stories.tsx +181 -181
  68. package/src/components/see-more/index.tsx +44 -44
  69. package/src/components/see-more/types.ts +4 -4
  70. package/src/components/select/Select.stories.tsx +411 -411
  71. package/src/components/select/index.tsx +150 -150
  72. package/src/components/select/types.ts +35 -35
  73. package/src/components/select-plan-button/SelectPlanButton.stories.tsx +184 -184
  74. package/src/components/select-plan-button/index.tsx +57 -57
  75. package/src/components/select-plan-button/types.ts +14 -14
  76. package/src/components/skeleton/Skeleton.stories.tsx +179 -179
  77. package/src/components/skeleton/index.tsx +61 -61
  78. package/src/components/skeleton/types.ts +4 -4
  79. package/src/components/spinner/Spinner.stories.tsx +335 -335
  80. package/src/components/spinner/index.tsx +44 -44
  81. package/src/components/spinner/types.ts +5 -5
  82. package/src/components/text/Text.stories.tsx +321 -321
  83. package/src/components/text/index.tsx +25 -25
  84. package/src/components/text/types.ts +45 -45
  85. package/src/components/tooltip/Tooltip.stories.tsx +219 -219
  86. package/src/components/tooltip/index.tsx +74 -74
  87. package/src/components/tooltip/types.ts +7 -7
  88. package/src/components/view-cart-button/ViewCartButton.stories.tsx +252 -252
  89. package/src/components/view-cart-button/index.tsx +42 -42
  90. package/src/components/view-cart-button/types.ts +5 -5
  91. package/src/contentful/blocks/blogs-grid/index.tsx +129 -129
  92. package/src/contentful/blocks/blogs-grid/types.ts +26 -26
  93. package/src/contentful/blocks/button/Button.stories.tsx +40 -40
  94. package/src/contentful/blocks/button/index.tsx +108 -108
  95. package/src/contentful/blocks/button/types.ts +34 -34
  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/blog-card/index.tsx +99 -99
  100. package/src/contentful/blocks/cards/blog-card/types.ts +14 -14
  101. package/src/contentful/blocks/cards/index.tsx +13 -13
  102. package/src/contentful/blocks/cards/product-card/index.tsx +208 -208
  103. package/src/contentful/blocks/cards/product-card/types.ts +28 -28
  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 +356 -356
  109. package/src/contentful/blocks/carousel/index.tsx +74 -74
  110. package/src/contentful/blocks/carousel/types.ts +143 -143
  111. package/src/contentful/blocks/cta-callout/CtaCallout.stories.tsx +46 -46
  112. package/src/contentful/blocks/cta-callout/index.tsx +60 -60
  113. package/src/contentful/blocks/cta-callout/types.ts +26 -26
  114. package/src/contentful/blocks/find-kinetic/index.tsx +130 -130
  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 +234 -234
  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 +229 -229
  133. package/src/contentful/blocks/primary-hero/types.ts +35 -35
  134. package/src/contentful/blocks/search-block/index.tsx +2 -2
  135. package/src/contentful/blocks/shape-background-wrapper/ShapeBackgroundWrapper.stories.tsx +26 -26
  136. package/src/contentful/blocks/shape-background-wrapper/index.tsx +124 -124
  137. package/src/contentful/blocks/shape-background-wrapper/types.ts +36 -36
  138. package/src/contentful/blocks/text/Text.stories.tsx +23 -23
  139. package/src/contentful/blocks/text/index.tsx +12 -12
  140. package/src/contentful/blocks/text/types.ts +1 -1
  141. package/src/contentful/index.ts +68 -68
  142. package/src/hooks/use-body-scroll-lock.ts +34 -34
  143. package/src/hooks/use-outside-click.ts +17 -17
  144. package/src/index.ts +96 -96
  145. package/src/next/index.ts +5 -5
  146. package/src/setupTests.ts +46 -46
  147. package/src/stories/DocsTemplate.tsx +24 -24
  148. package/src/styles/globals.css +343 -343
  149. package/src/types/global.d.ts +9 -9
  150. package/src/types/micro-components.ts +99 -99
  151. package/src/utils/index.ts +49 -49
@@ -1,17 +1,17 @@
1
- import { RefObject, useEffect } from "react";
2
-
3
- export const useOutsideClick = (ref: RefObject<any>, callback: () => void) => {
4
- const handleClick = (e: MouseEvent) => {
5
- if (!ref?.current?.contains(e.target)) {
6
- callback();
7
- }
8
- };
9
-
10
- useEffect(() => {
11
- document.addEventListener("click", handleClick);
12
-
13
- return () => {
14
- document.removeEventListener("click", handleClick);
15
- };
16
- });
17
- };
1
+ import { RefObject, useEffect } from "react";
2
+
3
+ export const useOutsideClick = (ref: RefObject<any>, callback: () => void) => {
4
+ const handleClick = (e: MouseEvent) => {
5
+ if (!ref?.current?.contains(e.target)) {
6
+ callback();
7
+ }
8
+ };
9
+
10
+ useEffect(() => {
11
+ document.addEventListener("click", handleClick);
12
+
13
+ return () => {
14
+ document.removeEventListener("click", handleClick);
15
+ };
16
+ });
17
+ };
package/src/index.ts CHANGED
@@ -1,96 +1,96 @@
1
- // Import global styles
2
- import "./styles/globals.css";
3
-
4
- // Core Components
5
- export { Button } from "./components/button";
6
- export type { ButtonProps } from "./components/button";
7
-
8
- export { Input, InputField, Input as TextInput } from "./components/input";
9
- export type { InputProps, InputFieldProps } from "./components/input";
10
-
11
- export { Image } from "./components/image";
12
- export type { ImageProps, ImageComponentProps } from "./components/image";
13
-
14
- export { NextImage } from "./components/next-image";
15
- export type { NextImageComponentProps } from "./components/next-image";
16
-
17
- export { Link } from "./components/link";
18
- export type { LinkProps } from "./components/link";
19
-
20
- export { List, ListItem } from "./components/list";
21
- export type { ListProps, ListItemProps } from "./components/list";
22
-
23
- export { MaterialIcon } from "./components/material-icon";
24
- export type { IconProps, IconName } from "./components/material-icon";
25
-
26
- export { Spinner } from "./components/spinner";
27
- export type { SpinnerProps } from "./components/spinner";
28
-
29
- export { Text } from "./components/text";
30
- export type { TextProps, TextVariant } from "./components/text";
31
-
32
- export { CallButton } from "./components/call-button";
33
- export type { CallButtonProps } from "./components/call-button";
34
-
35
- export { Modal } from "./components/modal";
36
- export type { ModalProps, Size, Shape, Animation } from "./components/modal";
37
-
38
- export { Accordion } from "./components/accordion";
39
- export type { AccordionProps } from "./components/accordion";
40
-
41
- export { Checkbox } from "./components/checkbox";
42
- export type { CheckboxProps } from "./components/checkbox";
43
-
44
- export { Select } from "./components/select";
45
- export type {
46
- SelectProps,
47
- SelectOption,
48
- FilterOptions,
49
- } from "./components/select";
50
-
51
- export { AlertCard } from "./components/alert-card";
52
- export type { AlertCardProps } from "./components/alert-card";
53
-
54
- export { BrandButton } from "./components/brand-button";
55
- export type {
56
- ButtonProps as BrandButtonProps,
57
- ButtonVariantsT,
58
- ButtonSizeT,
59
- ResponsiveSize,
60
- } from "./components/brand-button";
61
-
62
- export { Checklist } from "./components/checklist";
63
- export type { ChecklistProps } from "./components/checklist";
64
-
65
- export { Collapse } from "./components/collapse";
66
- export type { CollapsibleProps } from "./components/collapse";
67
-
68
- export { Divider } from "./components/divider";
69
- export type { DividerProps } from "./components/divider";
70
-
71
- export { RadioButton } from "./components/radio-button";
72
- export type { RadioButtonProps } from "./components/radio-button";
73
-
74
- export { SeeMore } from "./components/see-more";
75
- export type { SeeMoreProps } from "./components/see-more";
76
-
77
- export { SelectPlanButton } from "./components/select-plan-button";
78
- export type { SelectPlanButtonProps } from "./components/select-plan-button";
79
-
80
- export { Skeleton, PageSkeleton } from "./components/skeleton";
81
- export type { SkeletonProps } from "./components/skeleton";
82
-
83
- export { Tooltip } from "./components/tooltip";
84
- export type { ToolTipProps } from "./components/tooltip";
85
-
86
- export { ViewCartButton } from "./components/view-cart-button";
87
- export type { ViewCartButtonProps } from "./components/view-cart-button";
88
-
89
- export { default as useBodyScrollLock } from "./hooks/use-body-scroll-lock";
90
-
91
- // Utils
92
- export { cx, clsx } from "./utils";
93
- export type { ClassValue } from "./utils";
94
-
95
- // Re-export types
96
- export type { ButtonHTMLAttributes, CSSProperties, ReactNode } from "react";
1
+ // Import global styles
2
+ import "./styles/globals.css";
3
+
4
+ // Core Components
5
+ export { Button } from "./components/button";
6
+ export type { ButtonProps } from "./components/button";
7
+
8
+ export { Input, InputField, Input as TextInput } from "./components/input";
9
+ export type { InputProps, InputFieldProps } from "./components/input";
10
+
11
+ export { Image } from "./components/image";
12
+ export type { ImageProps, ImageComponentProps } from "./components/image";
13
+
14
+ export { NextImage } from "./components/next-image";
15
+ export type { NextImageComponentProps } from "./components/next-image";
16
+
17
+ export { Link } from "./components/link";
18
+ export type { LinkProps } from "./components/link";
19
+
20
+ export { List, ListItem } from "./components/list";
21
+ export type { ListProps, ListItemProps } from "./components/list";
22
+
23
+ export { MaterialIcon } from "./components/material-icon";
24
+ export type { IconProps, IconName } from "./components/material-icon";
25
+
26
+ export { Spinner } from "./components/spinner";
27
+ export type { SpinnerProps } from "./components/spinner";
28
+
29
+ export { Text } from "./components/text";
30
+ export type { TextProps, TextVariant } from "./components/text";
31
+
32
+ export { CallButton } from "./components/call-button";
33
+ export type { CallButtonProps } from "./components/call-button";
34
+
35
+ export { Modal } from "./components/modal";
36
+ export type { ModalProps, Size, Shape, Animation } from "./components/modal";
37
+
38
+ export { Accordion } from "./components/accordion";
39
+ export type { AccordionProps } from "./components/accordion";
40
+
41
+ export { Checkbox } from "./components/checkbox";
42
+ export type { CheckboxProps } from "./components/checkbox";
43
+
44
+ export { Select } from "./components/select";
45
+ export type {
46
+ SelectProps,
47
+ SelectOption,
48
+ FilterOptions,
49
+ } from "./components/select";
50
+
51
+ export { AlertCard } from "./components/alert-card";
52
+ export type { AlertCardProps } from "./components/alert-card";
53
+
54
+ export { BrandButton } from "./components/brand-button";
55
+ export type {
56
+ ButtonProps as BrandButtonProps,
57
+ ButtonVariantsT,
58
+ ButtonSizeT,
59
+ ResponsiveSize,
60
+ } from "./components/brand-button";
61
+
62
+ export { Checklist } from "./components/checklist";
63
+ export type { ChecklistProps } from "./components/checklist";
64
+
65
+ export { Collapse } from "./components/collapse";
66
+ export type { CollapsibleProps } from "./components/collapse";
67
+
68
+ export { Divider } from "./components/divider";
69
+ export type { DividerProps } from "./components/divider";
70
+
71
+ export { RadioButton } from "./components/radio-button";
72
+ export type { RadioButtonProps } from "./components/radio-button";
73
+
74
+ export { SeeMore } from "./components/see-more";
75
+ export type { SeeMoreProps } from "./components/see-more";
76
+
77
+ export { SelectPlanButton } from "./components/select-plan-button";
78
+ export type { SelectPlanButtonProps } from "./components/select-plan-button";
79
+
80
+ export { Skeleton, PageSkeleton } from "./components/skeleton";
81
+ export type { SkeletonProps } from "./components/skeleton";
82
+
83
+ export { Tooltip } from "./components/tooltip";
84
+ export type { ToolTipProps } from "./components/tooltip";
85
+
86
+ export { ViewCartButton } from "./components/view-cart-button";
87
+ export type { ViewCartButtonProps } from "./components/view-cart-button";
88
+
89
+ export { default as useBodyScrollLock } from "./hooks/use-body-scroll-lock";
90
+
91
+ // Utils
92
+ export { cx, clsx } from "./utils";
93
+ export type { ClassValue } from "./utils";
94
+
95
+ // Re-export types
96
+ export type { ButtonHTMLAttributes, CSSProperties, ReactNode } from "react";
package/src/next/index.ts CHANGED
@@ -1,5 +1,5 @@
1
- "use client";
2
-
3
- // Next.js specific components
4
- export { NextImage } from "../components/next-image";
5
- export type { NextImageComponentProps } from "../components/next-image";
1
+ "use client";
2
+
3
+ // Next.js specific components
4
+ export { NextImage } from "../components/next-image";
5
+ export type { NextImageComponentProps } from "../components/next-image";
package/src/setupTests.ts CHANGED
@@ -1,46 +1,46 @@
1
- import "@testing-library/jest-dom";
2
-
3
- // Mock window.matchMedia
4
- Object.defineProperty(window, "matchMedia", {
5
- writable: true,
6
- value: (query: string) => ({
7
- matches: false,
8
- media: query,
9
- onchange: null,
10
- addListener: () => {}, // deprecated
11
- removeListener: () => {}, // deprecated
12
- addEventListener: () => {},
13
- removeEventListener: () => {},
14
- dispatchEvent: () => true,
15
- }),
16
- });
17
-
18
- // Mock ResizeObserver
19
- global.ResizeObserver = class ResizeObserver {
20
- observe = () => {};
21
- unobserve = () => {};
22
- disconnect = () => {};
23
- constructor(_callback: ResizeObserverCallback) {}
24
- } as unknown as typeof ResizeObserver;
25
-
26
- // Mock IntersectionObserver
27
- global.IntersectionObserver = class IntersectionObserver {
28
- observe = () => {};
29
- unobserve = () => {};
30
- disconnect = () => {};
31
- constructor(_callback: IntersectionObserverCallback) {}
32
- } as unknown as typeof IntersectionObserver;
33
-
34
- // Mock scrollTo
35
- Object.defineProperty(window, "scrollTo", {
36
- writable: true,
37
- value: () => {},
38
- });
39
-
40
- // Mock getComputedStyle
41
- Object.defineProperty(window, "getComputedStyle", {
42
- writable: true,
43
- value: () => ({
44
- getPropertyValue: () => "",
45
- }),
46
- });
1
+ import "@testing-library/jest-dom";
2
+
3
+ // Mock window.matchMedia
4
+ Object.defineProperty(window, "matchMedia", {
5
+ writable: true,
6
+ value: (query: string) => ({
7
+ matches: false,
8
+ media: query,
9
+ onchange: null,
10
+ addListener: () => {}, // deprecated
11
+ removeListener: () => {}, // deprecated
12
+ addEventListener: () => {},
13
+ removeEventListener: () => {},
14
+ dispatchEvent: () => true,
15
+ }),
16
+ });
17
+
18
+ // Mock ResizeObserver
19
+ global.ResizeObserver = class ResizeObserver {
20
+ observe = () => {};
21
+ unobserve = () => {};
22
+ disconnect = () => {};
23
+ constructor(_callback: ResizeObserverCallback) {}
24
+ } as unknown as typeof ResizeObserver;
25
+
26
+ // Mock IntersectionObserver
27
+ global.IntersectionObserver = class IntersectionObserver {
28
+ observe = () => {};
29
+ unobserve = () => {};
30
+ disconnect = () => {};
31
+ constructor(_callback: IntersectionObserverCallback) {}
32
+ } as unknown as typeof IntersectionObserver;
33
+
34
+ // Mock scrollTo
35
+ Object.defineProperty(window, "scrollTo", {
36
+ writable: true,
37
+ value: () => {},
38
+ });
39
+
40
+ // Mock getComputedStyle
41
+ Object.defineProperty(window, "getComputedStyle", {
42
+ writable: true,
43
+ value: () => ({
44
+ getPropertyValue: () => "",
45
+ }),
46
+ });
@@ -1,24 +1,24 @@
1
- import {
2
- ArgTypes,
3
- Controls,
4
- Description,
5
- Primary,
6
- Source,
7
- Stories,
8
- Subtitle,
9
- Title,
10
- } from "@storybook/blocks";
11
-
12
- // Shared docs layout used by all component stories
13
- export const DocsPage = () => (
14
- <>
15
- <Title />
16
- <Subtitle />
17
- <Description />
18
- <Primary />
19
- <Source />
20
- <Controls />
21
- <Stories includePrimary={false} title="Examples" />
22
- <ArgTypes />
23
- </>
24
- );
1
+ import {
2
+ ArgTypes,
3
+ Controls,
4
+ Description,
5
+ Primary,
6
+ Source,
7
+ Stories,
8
+ Subtitle,
9
+ Title,
10
+ } from "@storybook/blocks";
11
+
12
+ // Shared docs layout used by all component stories
13
+ export const DocsPage = () => (
14
+ <>
15
+ <Title />
16
+ <Subtitle />
17
+ <Description />
18
+ <Primary />
19
+ <Source />
20
+ <Controls />
21
+ <Stories includePrimary={false} title="Examples" />
22
+ <ArgTypes />
23
+ </>
24
+ );