@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,129 +1,129 @@
1
- "use client";
2
-
3
- import React from "react";
4
- import { AnimationType, AnimationWrapperProps } from "./types";
5
- import { motion, useReducedMotion } from "framer-motion";
6
-
7
- interface AnimationPreset {
8
- whileHover: Record<string, unknown>;
9
- whileTap?: Record<string, unknown>;
10
- transition: Record<string, unknown>;
11
- }
12
-
13
- const ANIMATION_PRESETS: Record<AnimationType, AnimationPreset> = {
14
- scale: {
15
- whileHover: { scale: 1.02 },
16
- whileTap: { scale: 0.98 },
17
- transition: { duration: 0.3 },
18
- },
19
- shadow: {
20
- whileHover: { boxShadow: "0 10px 25px rgba(0,0,0,0.15)" },
21
- transition: { duration: 0.3 },
22
- },
23
- lift: {
24
- whileHover: { y: -5 },
25
- whileTap: { y: 0 },
26
- transition: { type: "spring", stiffness: 300, damping: 20 },
27
- },
28
- opacity: {
29
- whileHover: { opacity: 0.8 },
30
- transition: { duration: 0.2 },
31
- },
32
- grow: {
33
- whileHover: { scale: 1.1 },
34
- whileTap: { scale: 0.95 },
35
- transition: { type: "spring", stiffness: 300, damping: 20 },
36
- },
37
- };
38
-
39
- function mergePresets(animationType?: AnimationType | AnimationType[]) {
40
- if (!animationType) return undefined;
41
-
42
- const types = Array.isArray(animationType) ? animationType : [animationType];
43
- if (types.length === 0) return undefined;
44
-
45
- return types.reduce<AnimationPreset>(
46
- (merged, type) => {
47
- const preset = ANIMATION_PRESETS[type];
48
- return {
49
- whileHover: { ...merged.whileHover, ...preset.whileHover },
50
- ...(merged.whileTap || preset.whileTap
51
- ? {
52
- whileTap: { ...merged.whileTap, ...preset.whileTap },
53
- }
54
- : {}),
55
- transition: { ...merged.transition, ...preset.transition },
56
- };
57
- },
58
- { whileHover: {}, transition: {} }
59
- );
60
- }
61
-
62
- export function AnimationWrapper({
63
- children,
64
- animationType,
65
- // default to true for backward compatibility
66
- disableAnimation = true,
67
- whileHover,
68
- whileTap,
69
- transition,
70
- ...motionProps
71
- }: AnimationWrapperProps) {
72
- const prefersReducedMotion = useReducedMotion();
73
-
74
- const child = React.Children.only(children) as React.ReactElement<
75
- Record<string, unknown>
76
- >;
77
-
78
- if (disableAnimation || prefersReducedMotion) {
79
- return child;
80
- }
81
-
82
- const preset = mergePresets(animationType);
83
-
84
- const mergedWhileHover = preset
85
- ? { ...preset.whileHover, ...(whileHover as Record<string, unknown>) }
86
- : whileHover;
87
-
88
- const mergedWhileTap =
89
- preset?.whileTap || whileTap
90
- ? { ...preset?.whileTap, ...(whileTap as Record<string, unknown>) }
91
- : undefined;
92
-
93
- const mergedTransition = preset
94
- ? { ...preset.transition, ...(transition as Record<string, unknown>) }
95
- : transition;
96
-
97
- const isIntrinsicElement = typeof child.type === "string";
98
-
99
- if (isIntrinsicElement) {
100
- const MotionComponent = motion[
101
- child.type as keyof typeof motion
102
- ] as React.ComponentType<Record<string, unknown>>;
103
-
104
- return (
105
- <MotionComponent
106
- {...child.props}
107
- whileHover={mergedWhileHover}
108
- whileTap={mergedWhileTap}
109
- transition={mergedTransition}
110
- {...motionProps}
111
- />
112
- );
113
- }
114
-
115
- return (
116
- <motion.div
117
- whileHover={mergedWhileHover}
118
- whileTap={mergedWhileTap}
119
- transition={mergedTransition}
120
- {...motionProps}
121
- >
122
- {child}
123
- </motion.div>
124
- );
125
- }
126
-
127
- AnimationWrapper.displayName = "AnimationWrapper";
128
-
129
- export type { AnimationWrapperProps, AnimationType };
1
+ "use client";
2
+
3
+ import React from "react";
4
+ import { AnimationType, AnimationWrapperProps } from "./types";
5
+ import { motion, useReducedMotion } from "framer-motion";
6
+
7
+ interface AnimationPreset {
8
+ whileHover: Record<string, unknown>;
9
+ whileTap?: Record<string, unknown>;
10
+ transition: Record<string, unknown>;
11
+ }
12
+
13
+ const ANIMATION_PRESETS: Record<AnimationType, AnimationPreset> = {
14
+ scale: {
15
+ whileHover: { scale: 1.02 },
16
+ whileTap: { scale: 0.98 },
17
+ transition: { duration: 0.3 },
18
+ },
19
+ shadow: {
20
+ whileHover: { boxShadow: "0 10px 25px rgba(0,0,0,0.15)" },
21
+ transition: { duration: 0.3 },
22
+ },
23
+ lift: {
24
+ whileHover: { y: -5 },
25
+ whileTap: { y: 0 },
26
+ transition: { type: "spring", stiffness: 300, damping: 20 },
27
+ },
28
+ opacity: {
29
+ whileHover: { opacity: 0.8 },
30
+ transition: { duration: 0.2 },
31
+ },
32
+ grow: {
33
+ whileHover: { scale: 1.1 },
34
+ whileTap: { scale: 0.95 },
35
+ transition: { type: "spring", stiffness: 300, damping: 20 },
36
+ },
37
+ };
38
+
39
+ function mergePresets(animationType?: AnimationType | AnimationType[]) {
40
+ if (!animationType) return undefined;
41
+
42
+ const types = Array.isArray(animationType) ? animationType : [animationType];
43
+ if (types.length === 0) return undefined;
44
+
45
+ return types.reduce<AnimationPreset>(
46
+ (merged, type) => {
47
+ const preset = ANIMATION_PRESETS[type];
48
+ return {
49
+ whileHover: { ...merged.whileHover, ...preset.whileHover },
50
+ ...(merged.whileTap || preset.whileTap
51
+ ? {
52
+ whileTap: { ...merged.whileTap, ...preset.whileTap },
53
+ }
54
+ : {}),
55
+ transition: { ...merged.transition, ...preset.transition },
56
+ };
57
+ },
58
+ { whileHover: {}, transition: {} }
59
+ );
60
+ }
61
+
62
+ export function AnimationWrapper({
63
+ children,
64
+ animationType,
65
+ // default to true for backward compatibility
66
+ disableAnimation = true,
67
+ whileHover,
68
+ whileTap,
69
+ transition,
70
+ ...motionProps
71
+ }: AnimationWrapperProps) {
72
+ const prefersReducedMotion = useReducedMotion();
73
+
74
+ const child = React.Children.only(children) as React.ReactElement<
75
+ Record<string, unknown>
76
+ >;
77
+
78
+ if (disableAnimation || prefersReducedMotion) {
79
+ return child;
80
+ }
81
+
82
+ const preset = mergePresets(animationType);
83
+
84
+ const mergedWhileHover = preset
85
+ ? { ...preset.whileHover, ...(whileHover as Record<string, unknown>) }
86
+ : whileHover;
87
+
88
+ const mergedWhileTap =
89
+ preset?.whileTap || whileTap
90
+ ? { ...preset?.whileTap, ...(whileTap as Record<string, unknown>) }
91
+ : undefined;
92
+
93
+ const mergedTransition = preset
94
+ ? { ...preset.transition, ...(transition as Record<string, unknown>) }
95
+ : transition;
96
+
97
+ const isIntrinsicElement = typeof child.type === "string";
98
+
99
+ if (isIntrinsicElement) {
100
+ const MotionComponent = motion[
101
+ child.type as keyof typeof motion
102
+ ] as React.ComponentType<Record<string, unknown>>;
103
+
104
+ return (
105
+ <MotionComponent
106
+ {...child.props}
107
+ whileHover={mergedWhileHover}
108
+ whileTap={mergedWhileTap}
109
+ transition={mergedTransition}
110
+ {...motionProps}
111
+ />
112
+ );
113
+ }
114
+
115
+ return (
116
+ <motion.div
117
+ whileHover={mergedWhileHover}
118
+ whileTap={mergedWhileTap}
119
+ transition={mergedTransition}
120
+ {...motionProps}
121
+ >
122
+ {child}
123
+ </motion.div>
124
+ );
125
+ }
126
+
127
+ AnimationWrapper.displayName = "AnimationWrapper";
128
+
129
+ export type { AnimationWrapperProps, AnimationType };
@@ -1,11 +1,11 @@
1
- import { ReactElement } from "react";
2
- import { HTMLMotionProps } from "framer-motion";
3
-
4
- export type AnimationType = "scale" | "shadow" | "lift" | "opacity" | "grow";
5
-
6
- export interface AnimationWrapperProps
7
- extends Omit<HTMLMotionProps<"div">, "children"> {
8
- children: ReactElement;
9
- animationType?: AnimationType | AnimationType[];
10
- disableAnimation?: boolean;
11
- }
1
+ import { ReactElement } from "react";
2
+ import { HTMLMotionProps } from "framer-motion";
3
+
4
+ export type AnimationType = "scale" | "shadow" | "lift" | "opacity" | "grow";
5
+
6
+ export interface AnimationWrapperProps
7
+ extends Omit<HTMLMotionProps<"div">, "children"> {
8
+ children: ReactElement;
9
+ animationType?: AnimationType | AnimationType[];
10
+ disableAnimation?: boolean;
11
+ }