@windstream/react-shared-components 0.1.90 → 0.1.91

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 (210) hide show
  1. package/README.md +635 -635
  2. package/dist/contentful/index.esm.js +3 -3
  3. package/dist/contentful/index.esm.js.map +1 -1
  4. package/dist/contentful/index.js +3 -3
  5. package/dist/contentful/index.js.map +1 -1
  6. package/dist/index.d.ts +2 -2
  7. package/dist/index.esm.js +13 -5
  8. package/dist/index.esm.js.map +1 -1
  9. package/dist/index.js +13 -5
  10. package/dist/index.js.map +1 -1
  11. package/dist/next/index.esm.js +2 -2
  12. package/dist/next/index.esm.js.map +1 -1
  13. package/dist/next/index.js +2 -2
  14. package/dist/next/index.js.map +1 -1
  15. package/dist/styles.css +1 -1
  16. package/dist/utils/index.esm.js +1 -1
  17. package/dist/utils/index.esm.js.map +1 -1
  18. package/dist/utils/index.js +1 -1
  19. package/dist/utils/index.js.map +1 -1
  20. package/package.json +185 -185
  21. package/src/components/accordion/Accordion.stories.tsx +230 -230
  22. package/src/components/accordion/index.tsx +70 -70
  23. package/src/components/accordion/types.ts +12 -12
  24. package/src/components/alert-card/AlertCard.stories.tsx +171 -171
  25. package/src/components/alert-card/index.tsx +41 -41
  26. package/src/components/alert-card/types.ts +13 -13
  27. package/src/components/animation-wrapper/index.tsx +129 -129
  28. package/src/components/animation-wrapper/types.ts +11 -11
  29. package/src/components/brand-button/BrandButton.stories.tsx +223 -223
  30. package/src/components/brand-button/helpers.ts +35 -35
  31. package/src/components/brand-button/index.tsx +120 -120
  32. package/src/components/brand-button/types.ts +38 -38
  33. package/src/components/button/Button.stories.tsx +108 -108
  34. package/src/components/button/index.tsx +27 -27
  35. package/src/components/button/types.ts +14 -14
  36. package/src/components/call-button/CallButton.stories.tsx +324 -324
  37. package/src/components/call-button/index.tsx +106 -106
  38. package/src/components/call-button/types.ts +16 -16
  39. package/src/components/checkbox/Checkbox.stories.tsx +247 -247
  40. package/src/components/checkbox/index.tsx +197 -197
  41. package/src/components/checkbox/types.ts +27 -27
  42. package/src/components/checklist/Checklist.stories.tsx +150 -150
  43. package/src/components/checklist/index.tsx +61 -61
  44. package/src/components/checklist/types.ts +17 -17
  45. package/src/components/collapse/Collapse.stories.tsx +255 -255
  46. package/src/components/collapse/index.tsx +46 -46
  47. package/src/components/collapse/types.ts +6 -6
  48. package/src/components/divider/Divider.stories.tsx +205 -205
  49. package/src/components/divider/index.tsx +22 -22
  50. package/src/components/divider/type.ts +3 -3
  51. package/src/components/image/Image.stories.tsx +113 -113
  52. package/src/components/image/index.tsx +25 -25
  53. package/src/components/image/types.ts +40 -40
  54. package/src/components/input/Input.stories.tsx +325 -325
  55. package/src/components/input/index.tsx +177 -177
  56. package/src/components/input/types.ts +37 -37
  57. package/src/components/link/Link.stories.tsx +163 -163
  58. package/src/components/link/index.tsx +116 -116
  59. package/src/components/link/types.ts +25 -25
  60. package/src/components/list/List.stories.tsx +272 -272
  61. package/src/components/list/index.tsx +88 -88
  62. package/src/components/list/list-item/index.tsx +38 -38
  63. package/src/components/list/list-item/types.ts +13 -13
  64. package/src/components/list/types.ts +29 -29
  65. package/src/components/material-icon/MaterialIcon.stories.tsx +322 -322
  66. package/src/components/material-icon/constants.ts +99 -99
  67. package/src/components/material-icon/index.tsx +47 -47
  68. package/src/components/material-icon/types.ts +31 -31
  69. package/src/components/modal/Modal.stories.tsx +171 -171
  70. package/src/components/modal/index.tsx +164 -164
  71. package/src/components/modal/types.ts +24 -24
  72. package/src/components/next-image/index.tsx +74 -74
  73. package/src/components/next-image/types.ts +1 -1
  74. package/src/components/pagination/index.tsx +91 -91
  75. package/src/components/pagination/types.ts +6 -6
  76. package/src/components/radio-button/RadioButton.stories.tsx +307 -307
  77. package/src/components/radio-button/index.tsx +75 -75
  78. package/src/components/radio-button/types.ts +21 -21
  79. package/src/components/see-more/SeeMore.stories.tsx +181 -181
  80. package/src/components/see-more/index.tsx +44 -44
  81. package/src/components/see-more/types.ts +4 -4
  82. package/src/components/select/Select.stories.tsx +411 -411
  83. package/src/components/select/index.tsx +155 -155
  84. package/src/components/select/types.ts +36 -36
  85. package/src/components/select-plan-button/SelectPlanButton.stories.tsx +184 -184
  86. package/src/components/select-plan-button/index.tsx +63 -63
  87. package/src/components/select-plan-button/types.ts +17 -17
  88. package/src/components/skeleton/Skeleton.stories.tsx +179 -179
  89. package/src/components/skeleton/index.tsx +61 -61
  90. package/src/components/skeleton/types.ts +4 -4
  91. package/src/components/spinner/Spinner.stories.tsx +335 -335
  92. package/src/components/spinner/index.tsx +44 -44
  93. package/src/components/spinner/types.ts +5 -5
  94. package/src/components/text/Text.stories.tsx +321 -321
  95. package/src/components/text/index.tsx +25 -25
  96. package/src/components/text/types.ts +45 -45
  97. package/src/components/tooltip/Tooltip.stories.tsx +219 -219
  98. package/src/components/tooltip/index.tsx +74 -74
  99. package/src/components/tooltip/types.ts +7 -7
  100. package/src/components/view-cart-button/ViewCartButton.stories.tsx +252 -252
  101. package/src/components/view-cart-button/index.tsx +42 -42
  102. package/src/components/view-cart-button/types.ts +5 -5
  103. package/src/contentful/blocks/accordion/Accordion.stories.mocks.tsx +128 -128
  104. package/src/contentful/blocks/accordion/Accordion.stories.tsx +98 -98
  105. package/src/contentful/blocks/accordion/index.tsx +112 -112
  106. package/src/contentful/blocks/accordion/types.ts +34 -34
  107. package/src/contentful/blocks/address-input-banner/index.tsx +52 -52
  108. package/src/contentful/blocks/address-input-banner/types.ts +14 -14
  109. package/src/contentful/blocks/anchored-bottom-banner/index.tsx +181 -181
  110. package/src/contentful/blocks/anchored-bottom-banner/types.ts +13 -13
  111. package/src/contentful/blocks/blogs-grid/BlogGrid.stories.mocks.tsx +144 -144
  112. package/src/contentful/blocks/blogs-grid/BlogGrid.stories.tsx +156 -156
  113. package/src/contentful/blocks/blogs-grid/index.tsx +134 -134
  114. package/src/contentful/blocks/blogs-grid/types.ts +26 -26
  115. package/src/contentful/blocks/blogs-grid-base/index.tsx +119 -119
  116. package/src/contentful/blocks/blogs-grid-base/types.ts +36 -36
  117. package/src/contentful/blocks/breadcrumbs/BreadcrumbNavigation.stories.tsx +147 -147
  118. package/src/contentful/blocks/breadcrumbs/index.tsx +95 -95
  119. package/src/contentful/blocks/breadcrumbs/types.ts +8 -8
  120. package/src/contentful/blocks/button/Button.stories.tsx +40 -40
  121. package/src/contentful/blocks/button/index.tsx +131 -131
  122. package/src/contentful/blocks/button/types.ts +39 -39
  123. package/src/contentful/blocks/callout/Callout.stories.tsx +23 -23
  124. package/src/contentful/blocks/callout/index.tsx +277 -279
  125. package/src/contentful/blocks/callout/types.ts +78 -78
  126. package/src/contentful/blocks/cards/Cards.stories.tsx +23 -23
  127. package/src/contentful/blocks/cards/blog-card/index.tsx +129 -129
  128. package/src/contentful/blocks/cards/blog-card/types.ts +34 -34
  129. package/src/contentful/blocks/cards/floating-image-card/index.tsx +119 -119
  130. package/src/contentful/blocks/cards/floating-image-card/types.ts +30 -30
  131. package/src/contentful/blocks/cards/full-image-card/index.tsx +130 -130
  132. package/src/contentful/blocks/cards/full-image-card/types.ts +29 -29
  133. package/src/contentful/blocks/cards/index.tsx +13 -13
  134. package/src/contentful/blocks/cards/product-card/index.tsx +251 -251
  135. package/src/contentful/blocks/cards/product-card/types.ts +28 -28
  136. package/src/contentful/blocks/cards/simple-card/index.tsx +325 -325
  137. package/src/contentful/blocks/cards/simple-card/types.ts +71 -71
  138. package/src/contentful/blocks/cards/testimonial-card/index.tsx +90 -90
  139. package/src/contentful/blocks/cards/testimonial-card/types.tsx +12 -12
  140. package/src/contentful/blocks/cards/types.ts +1 -1
  141. package/src/contentful/blocks/carousel/Carousel.stories.tsx +23 -23
  142. package/src/contentful/blocks/carousel/helper.tsx +494 -494
  143. package/src/contentful/blocks/carousel/index.tsx +87 -87
  144. package/src/contentful/blocks/carousel/types.ts +145 -145
  145. package/src/contentful/blocks/cart-retention-banner/index.tsx +109 -109
  146. package/src/contentful/blocks/cart-retention-banner/types.ts +11 -11
  147. package/src/contentful/blocks/comparison-table/index.tsx +29 -29
  148. package/src/contentful/blocks/comparison-table/types.ts +6 -6
  149. package/src/contentful/blocks/cookiebanner/index.tsx +146 -146
  150. package/src/contentful/blocks/cookiebanner/type.ts +7 -7
  151. package/src/contentful/blocks/cta-callout/CtaCallout.stories.tsx +46 -46
  152. package/src/contentful/blocks/cta-callout/index.tsx +73 -71
  153. package/src/contentful/blocks/cta-callout/types.ts +26 -26
  154. package/src/contentful/blocks/dynamic-tabs/index.tsx +204 -204
  155. package/src/contentful/blocks/dynamic-tabs/types.ts +21 -21
  156. package/src/contentful/blocks/email-input-block/index.tsx +116 -116
  157. package/src/contentful/blocks/email-input-block/types.ts +16 -16
  158. package/src/contentful/blocks/find-kinetic/FindKinetic.stories.tsx +23 -23
  159. package/src/contentful/blocks/find-kinetic/index.tsx +130 -130
  160. package/src/contentful/blocks/find-kinetic/types.ts +19 -19
  161. package/src/contentful/blocks/floating-banner/FloatingBanner.stories.tsx +34 -34
  162. package/src/contentful/blocks/floating-banner/index.tsx +97 -97
  163. package/src/contentful/blocks/floating-banner/types.ts +22 -22
  164. package/src/contentful/blocks/footer/Footer.stories.tsx +317 -317
  165. package/src/contentful/blocks/footer/index.tsx +91 -91
  166. package/src/contentful/blocks/footer/types.ts +13 -13
  167. package/src/contentful/blocks/image-promo-bar/ImagePromoBar.stories.tsx +23 -23
  168. package/src/contentful/blocks/image-promo-bar/helper.tsx +28 -28
  169. package/src/contentful/blocks/image-promo-bar/index.tsx +246 -246
  170. package/src/contentful/blocks/image-promo-bar/types.ts +44 -44
  171. package/src/contentful/blocks/image-promo-bar/vimeo-embed.tsx +93 -93
  172. package/src/contentful/blocks/image-promo-bar/youtube-embed.tsx +46 -46
  173. package/src/contentful/blocks/modal/constants.ts +53 -53
  174. package/src/contentful/blocks/modal/index.tsx +107 -107
  175. package/src/contentful/blocks/modal/types.ts +12 -12
  176. package/src/contentful/blocks/navigation/desktop-link-groups.tsx/index.tsx +139 -139
  177. package/src/contentful/blocks/navigation/index.tsx +568 -568
  178. package/src/contentful/blocks/navigation/mobile-link-groups.tsx/index.tsx +82 -82
  179. package/src/contentful/blocks/navigation/types.ts +71 -71
  180. package/src/contentful/blocks/primary-hero/PrimaryHero.stories.tsx +23 -23
  181. package/src/contentful/blocks/primary-hero/index.tsx +236 -236
  182. package/src/contentful/blocks/primary-hero/types.ts +37 -37
  183. package/src/contentful/blocks/search-block/index.tsx +90 -90
  184. package/src/contentful/blocks/search-block/types.ts +15 -15
  185. package/src/contentful/blocks/shape-background-wrapper/ShapeBackgroundWrapper.stories.tsx +26 -26
  186. package/src/contentful/blocks/shape-background-wrapper/index.tsx +124 -124
  187. package/src/contentful/blocks/shape-background-wrapper/types.ts +36 -36
  188. package/src/contentful/blocks/text/Text.stories.tsx +23 -23
  189. package/src/contentful/blocks/text/index.tsx +12 -12
  190. package/src/contentful/blocks/text/types.ts +1 -1
  191. package/src/contentful/index.ts +105 -105
  192. package/src/hooks/contentful/use-contentful-rich-text.tsx +309 -309
  193. package/src/hooks/contentful/use-processed-check-list.ts +63 -63
  194. package/src/hooks/use-body-scroll-lock.ts +34 -34
  195. package/src/hooks/use-carousel-swipe.ts +264 -264
  196. package/src/hooks/use-outside-click.ts +17 -17
  197. package/src/index.ts +107 -107
  198. package/src/next/index.ts +5 -5
  199. package/src/setupTests.ts +46 -46
  200. package/src/stories/DocsTemplate.tsx +24 -24
  201. package/src/styles/globals.css +343 -343
  202. package/src/types/global.d.ts +9 -9
  203. package/src/types/micro-components.ts +99 -99
  204. package/src/types/utm.ts +49 -49
  205. package/src/utils/contentful/to-document.ts +24 -24
  206. package/src/utils/cookie.ts +84 -84
  207. package/src/utils/cx.ts +49 -49
  208. package/src/utils/index.ts +41 -41
  209. package/src/utils/speed-card-bg.ts +24 -24
  210. 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
+ }