@windstream/react-shared-components 0.1.91 → 0.1.92

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 (199) 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/index.d.ts +1 -1
  7. package/dist/index.js.map +1 -1
  8. package/dist/styles.css +1 -1
  9. package/package.json +185 -185
  10. package/src/components/accordion/Accordion.stories.tsx +230 -230
  11. package/src/components/accordion/index.tsx +70 -70
  12. package/src/components/accordion/types.ts +12 -12
  13. package/src/components/alert-card/AlertCard.stories.tsx +171 -171
  14. package/src/components/alert-card/index.tsx +41 -41
  15. package/src/components/alert-card/types.ts +13 -13
  16. package/src/components/animation-wrapper/index.tsx +129 -129
  17. package/src/components/animation-wrapper/types.ts +11 -11
  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 +120 -120
  21. package/src/components/brand-button/types.ts +38 -38
  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 +106 -106
  27. package/src/components/call-button/types.ts +16 -16
  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 +61 -61
  33. package/src/components/checklist/types.ts +17 -17
  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/index.tsx +116 -116
  48. package/src/components/link/types.ts +25 -25
  49. package/src/components/list/List.stories.tsx +272 -272
  50. package/src/components/list/index.tsx +88 -88
  51. package/src/components/list/list-item/index.tsx +38 -38
  52. package/src/components/list/list-item/types.ts +13 -13
  53. package/src/components/list/types.ts +29 -29
  54. package/src/components/material-icon/MaterialIcon.stories.tsx +322 -322
  55. package/src/components/material-icon/constants.ts +99 -99
  56. package/src/components/material-icon/index.tsx +47 -47
  57. package/src/components/material-icon/types.ts +31 -31
  58. package/src/components/modal/Modal.stories.tsx +171 -171
  59. package/src/components/modal/index.tsx +164 -164
  60. package/src/components/modal/types.ts +24 -24
  61. package/src/components/next-image/index.tsx +74 -74
  62. package/src/components/next-image/types.ts +1 -1
  63. package/src/components/pagination/index.tsx +91 -91
  64. package/src/components/pagination/types.ts +6 -6
  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 +155 -155
  73. package/src/components/select/types.ts +36 -36
  74. package/src/components/select-plan-button/SelectPlanButton.stories.tsx +184 -184
  75. package/src/components/select-plan-button/index.tsx +63 -63
  76. package/src/components/select-plan-button/types.ts +17 -17
  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/Accordion.stories.mocks.tsx +128 -128
  93. package/src/contentful/blocks/accordion/Accordion.stories.tsx +98 -98
  94. package/src/contentful/blocks/accordion/index.tsx +112 -112
  95. package/src/contentful/blocks/accordion/types.ts +34 -34
  96. package/src/contentful/blocks/address-input-banner/index.tsx +52 -52
  97. package/src/contentful/blocks/address-input-banner/types.ts +14 -14
  98. package/src/contentful/blocks/anchored-bottom-banner/index.tsx +181 -181
  99. package/src/contentful/blocks/anchored-bottom-banner/types.ts +13 -13
  100. package/src/contentful/blocks/blogs-grid/BlogGrid.stories.mocks.tsx +144 -144
  101. package/src/contentful/blocks/blogs-grid/BlogGrid.stories.tsx +156 -156
  102. package/src/contentful/blocks/blogs-grid/index.tsx +134 -134
  103. package/src/contentful/blocks/blogs-grid/types.ts +26 -26
  104. package/src/contentful/blocks/blogs-grid-base/index.tsx +119 -119
  105. package/src/contentful/blocks/blogs-grid-base/types.ts +36 -36
  106. package/src/contentful/blocks/breadcrumbs/BreadcrumbNavigation.stories.tsx +147 -147
  107. package/src/contentful/blocks/breadcrumbs/index.tsx +95 -95
  108. package/src/contentful/blocks/breadcrumbs/types.ts +8 -8
  109. package/src/contentful/blocks/button/Button.stories.tsx +40 -40
  110. package/src/contentful/blocks/button/index.tsx +131 -131
  111. package/src/contentful/blocks/button/types.ts +39 -39
  112. package/src/contentful/blocks/callout/Callout.stories.tsx +23 -23
  113. package/src/contentful/blocks/callout/index.tsx +277 -277
  114. package/src/contentful/blocks/callout/types.ts +78 -78
  115. package/src/contentful/blocks/cards/Cards.stories.tsx +23 -23
  116. package/src/contentful/blocks/cards/blog-card/index.tsx +129 -129
  117. package/src/contentful/blocks/cards/blog-card/types.ts +34 -34
  118. package/src/contentful/blocks/cards/floating-image-card/index.tsx +119 -119
  119. package/src/contentful/blocks/cards/floating-image-card/types.ts +30 -30
  120. package/src/contentful/blocks/cards/full-image-card/index.tsx +130 -130
  121. package/src/contentful/blocks/cards/full-image-card/types.ts +29 -29
  122. package/src/contentful/blocks/cards/index.tsx +13 -13
  123. package/src/contentful/blocks/cards/product-card/index.tsx +251 -251
  124. package/src/contentful/blocks/cards/product-card/types.ts +28 -28
  125. package/src/contentful/blocks/cards/simple-card/index.tsx +325 -325
  126. package/src/contentful/blocks/cards/simple-card/types.ts +71 -71
  127. package/src/contentful/blocks/cards/testimonial-card/index.tsx +90 -90
  128. package/src/contentful/blocks/cards/testimonial-card/types.tsx +12 -12
  129. package/src/contentful/blocks/cards/types.ts +1 -1
  130. package/src/contentful/blocks/carousel/Carousel.stories.tsx +23 -23
  131. package/src/contentful/blocks/carousel/helper.tsx +494 -494
  132. package/src/contentful/blocks/carousel/index.tsx +87 -87
  133. package/src/contentful/blocks/carousel/types.ts +145 -145
  134. package/src/contentful/blocks/cart-retention-banner/index.tsx +109 -109
  135. package/src/contentful/blocks/cart-retention-banner/types.ts +11 -11
  136. package/src/contentful/blocks/comparison-table/index.tsx +29 -29
  137. package/src/contentful/blocks/comparison-table/types.ts +6 -6
  138. package/src/contentful/blocks/cookiebanner/index.tsx +146 -146
  139. package/src/contentful/blocks/cookiebanner/type.ts +7 -7
  140. package/src/contentful/blocks/cta-callout/CtaCallout.stories.tsx +46 -46
  141. package/src/contentful/blocks/cta-callout/index.tsx +73 -73
  142. package/src/contentful/blocks/cta-callout/types.ts +26 -26
  143. package/src/contentful/blocks/dynamic-tabs/index.tsx +204 -204
  144. package/src/contentful/blocks/dynamic-tabs/types.ts +21 -21
  145. package/src/contentful/blocks/email-input-block/index.tsx +116 -116
  146. package/src/contentful/blocks/email-input-block/types.ts +16 -16
  147. package/src/contentful/blocks/find-kinetic/FindKinetic.stories.tsx +23 -23
  148. package/src/contentful/blocks/find-kinetic/index.tsx +130 -130
  149. package/src/contentful/blocks/find-kinetic/types.ts +19 -19
  150. package/src/contentful/blocks/floating-banner/FloatingBanner.stories.tsx +34 -34
  151. package/src/contentful/blocks/floating-banner/index.tsx +97 -97
  152. package/src/contentful/blocks/floating-banner/types.ts +22 -22
  153. package/src/contentful/blocks/footer/Footer.stories.tsx +317 -317
  154. package/src/contentful/blocks/footer/index.tsx +91 -91
  155. package/src/contentful/blocks/footer/types.ts +13 -13
  156. package/src/contentful/blocks/image-promo-bar/ImagePromoBar.stories.tsx +23 -23
  157. package/src/contentful/blocks/image-promo-bar/helper.tsx +28 -28
  158. package/src/contentful/blocks/image-promo-bar/index.tsx +246 -246
  159. package/src/contentful/blocks/image-promo-bar/types.ts +44 -44
  160. package/src/contentful/blocks/image-promo-bar/vimeo-embed.tsx +93 -93
  161. package/src/contentful/blocks/image-promo-bar/youtube-embed.tsx +46 -46
  162. package/src/contentful/blocks/modal/constants.ts +53 -53
  163. package/src/contentful/blocks/modal/index.tsx +108 -107
  164. package/src/contentful/blocks/modal/types.ts +12 -12
  165. package/src/contentful/blocks/navigation/desktop-link-groups.tsx/index.tsx +139 -139
  166. package/src/contentful/blocks/navigation/index.tsx +568 -568
  167. package/src/contentful/blocks/navigation/mobile-link-groups.tsx/index.tsx +82 -82
  168. package/src/contentful/blocks/navigation/types.ts +71 -71
  169. package/src/contentful/blocks/primary-hero/PrimaryHero.stories.tsx +23 -23
  170. package/src/contentful/blocks/primary-hero/index.tsx +236 -236
  171. package/src/contentful/blocks/primary-hero/types.ts +37 -37
  172. package/src/contentful/blocks/search-block/index.tsx +90 -90
  173. package/src/contentful/blocks/search-block/types.ts +15 -15
  174. package/src/contentful/blocks/shape-background-wrapper/ShapeBackgroundWrapper.stories.tsx +26 -26
  175. package/src/contentful/blocks/shape-background-wrapper/index.tsx +124 -124
  176. package/src/contentful/blocks/shape-background-wrapper/types.ts +36 -36
  177. package/src/contentful/blocks/text/Text.stories.tsx +23 -23
  178. package/src/contentful/blocks/text/index.tsx +12 -12
  179. package/src/contentful/blocks/text/types.ts +1 -1
  180. package/src/contentful/index.ts +105 -105
  181. package/src/hooks/contentful/use-contentful-rich-text.tsx +309 -309
  182. package/src/hooks/contentful/use-processed-check-list.ts +63 -63
  183. package/src/hooks/use-body-scroll-lock.ts +34 -34
  184. package/src/hooks/use-carousel-swipe.ts +264 -264
  185. package/src/hooks/use-outside-click.ts +17 -17
  186. package/src/index.ts +107 -107
  187. package/src/next/index.ts +5 -5
  188. package/src/setupTests.ts +46 -46
  189. package/src/stories/DocsTemplate.tsx +24 -24
  190. package/src/styles/globals.css +343 -343
  191. package/src/types/global.d.ts +9 -9
  192. package/src/types/micro-components.ts +99 -99
  193. package/src/types/utm.ts +49 -49
  194. package/src/utils/contentful/to-document.ts +24 -24
  195. package/src/utils/cookie.ts +84 -84
  196. package/src/utils/cx.ts +49 -49
  197. package/src/utils/index.ts +41 -41
  198. package/src/utils/speed-card-bg.ts +24 -24
  199. package/src/utils/utm.ts +221 -221
@@ -1,63 +1,63 @@
1
- import { createElement, useMemo, type ReactNode } from "react";
2
- import { renderContentfulRichText } from "./use-contentful-rich-text";
3
-
4
- import { type Options } from "@contentful/rich-text-react-renderer";
5
- import { MARKS } from "@contentful/rich-text-types";
6
- import { toDocument } from "@shared/utils/contentful/to-document";
7
-
8
- export const label1BoldOptions = {
9
- renderMark: {
10
- [MARKS.BOLD]: (text: ReactNode) =>
11
- createElement("span", { className: "label1" }, text),
12
- },
13
- };
14
-
15
- export interface ProcessedChecklistItem {
16
- title: string;
17
- iconUrl?: string;
18
- anchorId?: string;
19
- }
20
-
21
- // titlesOnly as a boolean parameter with a conditional return type
22
- export function useProcessedChecklist<T extends boolean = false>(
23
- checklistData?: any,
24
- titlesOnly?: T,
25
- richTextOptions?: Options,
26
- richTextClassName?: string
27
- ): T extends true ? string[] : ProcessedChecklistItem[] {
28
- return useMemo(() => {
29
- const rawItems: any[] = checklistData?.list?.items ?? [];
30
-
31
- if (titlesOnly) {
32
- return rawItems.map(
33
- item =>
34
- renderContentfulRichText(
35
- toDocument(item?.checkListTitle ?? ""),
36
- undefined,
37
- richTextClassName,
38
- undefined,
39
- richTextOptions
40
- ) ?? ""
41
- ) as any;
42
- }
43
-
44
- return rawItems.map(item => ({
45
- title:
46
- renderContentfulRichText(
47
- toDocument(item?.checkListTitle ?? ""),
48
- undefined,
49
- richTextClassName,
50
- undefined,
51
- richTextOptions
52
- ) ?? "",
53
- iconUrl: item?.icon?.url ?? undefined,
54
- anchorId: item?.anchorId ?? undefined,
55
- })) as any;
56
- }, [checklistData, titlesOnly, richTextOptions, richTextClassName]) as any;
57
- }
58
-
59
- // Usage:
60
- // Full items
61
- //const items = useProcessedChecklist(checklistData); // ProcessedChecklistItem[]
62
- // Titles only
63
- //const titles = useProcessedChecklist(checklistData, true); // string[]
1
+ import { createElement, useMemo, type ReactNode } from "react";
2
+ import { renderContentfulRichText } from "./use-contentful-rich-text";
3
+
4
+ import { type Options } from "@contentful/rich-text-react-renderer";
5
+ import { MARKS } from "@contentful/rich-text-types";
6
+ import { toDocument } from "@shared/utils/contentful/to-document";
7
+
8
+ export const label1BoldOptions = {
9
+ renderMark: {
10
+ [MARKS.BOLD]: (text: ReactNode) =>
11
+ createElement("span", { className: "label1" }, text),
12
+ },
13
+ };
14
+
15
+ export interface ProcessedChecklistItem {
16
+ title: string;
17
+ iconUrl?: string;
18
+ anchorId?: string;
19
+ }
20
+
21
+ // titlesOnly as a boolean parameter with a conditional return type
22
+ export function useProcessedChecklist<T extends boolean = false>(
23
+ checklistData?: any,
24
+ titlesOnly?: T,
25
+ richTextOptions?: Options,
26
+ richTextClassName?: string
27
+ ): T extends true ? string[] : ProcessedChecklistItem[] {
28
+ return useMemo(() => {
29
+ const rawItems: any[] = checklistData?.list?.items ?? [];
30
+
31
+ if (titlesOnly) {
32
+ return rawItems.map(
33
+ item =>
34
+ renderContentfulRichText(
35
+ toDocument(item?.checkListTitle ?? ""),
36
+ undefined,
37
+ richTextClassName,
38
+ undefined,
39
+ richTextOptions
40
+ ) ?? ""
41
+ ) as any;
42
+ }
43
+
44
+ return rawItems.map(item => ({
45
+ title:
46
+ renderContentfulRichText(
47
+ toDocument(item?.checkListTitle ?? ""),
48
+ undefined,
49
+ richTextClassName,
50
+ undefined,
51
+ richTextOptions
52
+ ) ?? "",
53
+ iconUrl: item?.icon?.url ?? undefined,
54
+ anchorId: item?.anchorId ?? undefined,
55
+ })) as any;
56
+ }, [checklistData, titlesOnly, richTextOptions, richTextClassName]) as any;
57
+ }
58
+
59
+ // Usage:
60
+ // Full items
61
+ //const items = useProcessedChecklist(checklistData); // ProcessedChecklistItem[]
62
+ // Titles only
63
+ //const titles = useProcessedChecklist(checklistData, true); // string[]
@@ -1,34 +1,34 @@
1
- "use client";
2
-
3
- import { useEffect } from "react";
4
-
5
- /**
6
- * A custom hook that locks the body scroll based on the `isOpen` and `hideScrollOnIsOpenFalse` flags.
7
- *
8
- * @param {boolean} isOpen - Determines if the scroll should be locked (hidden).
9
- * @param {boolean} hideScrollOnIsOpenFalse - Determines if the scroll should be reset when `isOpen` is false.
10
- */
11
- function useBodyScrollLock(isOpen: boolean, hideScrollOnIsOpenFalse: boolean) {
12
- useEffect(() => {
13
- if (typeof document === "undefined") return;
14
-
15
- // To avoid content shifting when the scrollbar appears/disappears
16
- const scrollbarWidth =
17
- window.innerWidth - document.documentElement.clientWidth;
18
- document.body.style.marginRight = isOpen ? `${scrollbarWidth}px` : "unset";
19
-
20
- // Set the body overflow style based on the `isOpen` and `hideScrollOnIsOpenFalse` values.
21
- document.body.style.overflow = isOpen
22
- ? "hidden"
23
- : hideScrollOnIsOpenFalse
24
- ? "unset"
25
- : document.body.style.overflow;
26
-
27
- // Cleanup function to reset body overflow when the component unmounts or dependencies change.
28
- return () => {
29
- document.body.style.overflow = "unset";
30
- };
31
- }, [isOpen, hideScrollOnIsOpenFalse]);
32
- }
33
-
34
- export default useBodyScrollLock;
1
+ "use client";
2
+
3
+ import { useEffect } from "react";
4
+
5
+ /**
6
+ * A custom hook that locks the body scroll based on the `isOpen` and `hideScrollOnIsOpenFalse` flags.
7
+ *
8
+ * @param {boolean} isOpen - Determines if the scroll should be locked (hidden).
9
+ * @param {boolean} hideScrollOnIsOpenFalse - Determines if the scroll should be reset when `isOpen` is false.
10
+ */
11
+ function useBodyScrollLock(isOpen: boolean, hideScrollOnIsOpenFalse: boolean) {
12
+ useEffect(() => {
13
+ if (typeof document === "undefined") return;
14
+
15
+ // To avoid content shifting when the scrollbar appears/disappears
16
+ const scrollbarWidth =
17
+ window.innerWidth - document.documentElement.clientWidth;
18
+ document.body.style.marginRight = isOpen ? `${scrollbarWidth}px` : "unset";
19
+
20
+ // Set the body overflow style based on the `isOpen` and `hideScrollOnIsOpenFalse` values.
21
+ document.body.style.overflow = isOpen
22
+ ? "hidden"
23
+ : hideScrollOnIsOpenFalse
24
+ ? "unset"
25
+ : document.body.style.overflow;
26
+
27
+ // Cleanup function to reset body overflow when the component unmounts or dependencies change.
28
+ return () => {
29
+ document.body.style.overflow = "unset";
30
+ };
31
+ }, [isOpen, hideScrollOnIsOpenFalse]);
32
+ }
33
+
34
+ export default useBodyScrollLock;