@windstream/react-shared-components 0.0.91 → 0.0.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 (148) hide show
  1. package/README.md +635 -635
  2. package/dist/contentful/index.esm.js +1 -1
  3. package/dist/contentful/index.esm.js.map +1 -1
  4. package/dist/contentful/index.js +1 -1
  5. package/dist/contentful/index.js.map +1 -1
  6. package/dist/core.d.ts +1 -1
  7. package/dist/index.d.ts +3 -3
  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/dist/styles.css +1 -1
  13. package/package.json +177 -177
  14. package/src/components/accordion/Accordion.stories.tsx +230 -230
  15. package/src/components/accordion/types.ts +10 -10
  16. package/src/components/alert-card/AlertCard.stories.tsx +171 -171
  17. package/src/components/alert-card/index.tsx +32 -32
  18. package/src/components/alert-card/types.ts +9 -9
  19. package/src/components/brand-button/BrandButton.stories.tsx +223 -223
  20. package/src/components/brand-button/helpers.ts +35 -35
  21. package/src/components/brand-button/index.tsx +115 -115
  22. package/src/components/brand-button/types.ts +37 -37
  23. package/src/components/button/Button.stories.tsx +108 -108
  24. package/src/components/button/index.tsx +27 -27
  25. package/src/components/button/types.ts +14 -14
  26. package/src/components/call-button/CallButton.stories.tsx +324 -324
  27. package/src/components/call-button/index.tsx +86 -86
  28. package/src/components/call-button/types.ts +11 -11
  29. package/src/components/checkbox/Checkbox.stories.tsx +247 -247
  30. package/src/components/checkbox/index.tsx +197 -197
  31. package/src/components/checkbox/types.ts +27 -27
  32. package/src/components/checklist/Checklist.stories.tsx +150 -150
  33. package/src/components/checklist/index.tsx +55 -55
  34. package/src/components/checklist/types.ts +14 -14
  35. package/src/components/collapse/Collapse.stories.tsx +255 -255
  36. package/src/components/collapse/index.tsx +46 -46
  37. package/src/components/collapse/types.ts +6 -6
  38. package/src/components/divider/Divider.stories.tsx +205 -205
  39. package/src/components/divider/index.tsx +22 -22
  40. package/src/components/divider/type.ts +3 -3
  41. package/src/components/image/Image.stories.tsx +113 -113
  42. package/src/components/image/index.tsx +25 -25
  43. package/src/components/image/types.ts +40 -40
  44. package/src/components/input/Input.stories.tsx +325 -325
  45. package/src/components/input/index.tsx +177 -177
  46. package/src/components/input/types.ts +37 -37
  47. package/src/components/link/Link.stories.tsx +163 -163
  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 +330 -330
  55. package/src/components/material-icon/constants.ts +98 -98
  56. package/src/components/material-icon/index.tsx +44 -44
  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 +32 -32
  62. package/src/components/next-image/types.ts +1 -1
  63. package/src/components/radio-button/RadioButton.stories.tsx +307 -307
  64. package/src/components/radio-button/index.tsx +75 -75
  65. package/src/components/radio-button/types.ts +21 -21
  66. package/src/components/see-more/SeeMore.stories.tsx +181 -181
  67. package/src/components/see-more/index.tsx +44 -44
  68. package/src/components/see-more/types.ts +4 -4
  69. package/src/components/select/Select.stories.tsx +411 -411
  70. package/src/components/select/index.tsx +150 -150
  71. package/src/components/select/types.ts +35 -35
  72. package/src/components/select-plan-button/SelectPlanButton.stories.tsx +184 -184
  73. package/src/components/select-plan-button/index.tsx +31 -31
  74. package/src/components/select-plan-button/types.ts +5 -5
  75. package/src/components/skeleton/Skeleton.stories.tsx +179 -179
  76. package/src/components/skeleton/index.tsx +61 -61
  77. package/src/components/skeleton/types.ts +4 -4
  78. package/src/components/spinner/Spinner.stories.tsx +335 -335
  79. package/src/components/spinner/index.tsx +44 -44
  80. package/src/components/spinner/types.ts +5 -5
  81. package/src/components/text/Text.stories.tsx +321 -321
  82. package/src/components/text/index.tsx +25 -25
  83. package/src/components/text/types.ts +45 -45
  84. package/src/components/tooltip/Tooltip.stories.tsx +219 -219
  85. package/src/components/tooltip/index.tsx +74 -74
  86. package/src/components/tooltip/types.ts +7 -7
  87. package/src/components/view-cart-button/ViewCartButton.stories.tsx +252 -252
  88. package/src/components/view-cart-button/index.tsx +42 -42
  89. package/src/components/view-cart-button/types.ts +5 -5
  90. package/src/contentful/blocks/button/Button.stories.tsx +40 -40
  91. package/src/contentful/blocks/button/index.tsx +99 -99
  92. package/src/contentful/blocks/button/types.ts +31 -31
  93. package/src/contentful/blocks/callout/Callout.stories.tsx +23 -23
  94. package/src/contentful/blocks/callout/index.tsx +66 -66
  95. package/src/contentful/blocks/cards/Cards.stories.tsx +23 -23
  96. package/src/contentful/blocks/cards/index.tsx +13 -13
  97. package/src/contentful/blocks/cards/product-card/index.tsx +199 -199
  98. package/src/contentful/blocks/cards/product-card/types.ts +21 -21
  99. package/src/contentful/blocks/cards/simple-card/index.tsx +77 -77
  100. package/src/contentful/blocks/cards/simple-card/types.ts +31 -31
  101. package/src/contentful/blocks/cards/testimonial-card/index.tsx +88 -88
  102. package/src/contentful/blocks/cards/testimonial-card/types.tsx +12 -12
  103. package/src/contentful/blocks/cards/types.ts +1 -1
  104. package/src/contentful/blocks/carousel/Carousel.stories.tsx +23 -23
  105. package/src/contentful/blocks/carousel/helper.tsx +349 -349
  106. package/src/contentful/blocks/carousel/index.tsx +68 -68
  107. package/src/contentful/blocks/carousel/types.ts +139 -139
  108. package/src/contentful/blocks/cta-callout/CtaCallout.stories.tsx +46 -46
  109. package/src/contentful/blocks/cta-callout/index.tsx +54 -54
  110. package/src/contentful/blocks/cta-callout/types.ts +22 -22
  111. package/src/contentful/blocks/find-kinetic/index.tsx +124 -124
  112. package/src/contentful/blocks/floating-banner/FloatingBanner.stories.tsx +34 -34
  113. package/src/contentful/blocks/floating-banner/types.ts +22 -22
  114. package/src/contentful/blocks/footer/Footer.stories.tsx +30 -30
  115. package/src/contentful/blocks/image-promo-bar/ImagePromoBar.stories.tsx +23 -23
  116. package/src/contentful/blocks/image-promo-bar/helper.tsx +28 -28
  117. package/src/contentful/blocks/image-promo-bar/index.tsx +231 -231
  118. package/src/contentful/blocks/image-promo-bar/types.ts +44 -44
  119. package/src/contentful/blocks/image-promo-bar/vimeo-embed.tsx +93 -93
  120. package/src/contentful/blocks/image-promo-bar/youtube-embed.tsx +46 -46
  121. package/src/contentful/blocks/modal/constants.ts +53 -53
  122. package/src/contentful/blocks/modal/index.tsx +91 -91
  123. package/src/contentful/blocks/modal/types.ts +12 -12
  124. package/src/contentful/blocks/navigation/desktop-link-groups.tsx/index.tsx +111 -111
  125. package/src/contentful/blocks/navigation/index.tsx +385 -385
  126. package/src/contentful/blocks/navigation/mobile-link-groups.tsx/index.tsx +80 -80
  127. package/src/contentful/blocks/navigation/types.ts +41 -41
  128. package/src/contentful/blocks/primary-hero/PrimaryHero.stories.tsx +23 -23
  129. package/src/contentful/blocks/primary-hero/index.tsx +228 -228
  130. package/src/contentful/blocks/primary-hero/types.ts +35 -35
  131. package/src/contentful/blocks/shape-background-wrapper/ShapeBackgroundWrapper.stories.tsx +26 -26
  132. package/src/contentful/blocks/shape-background-wrapper/index.tsx +124 -124
  133. package/src/contentful/blocks/shape-background-wrapper/types.ts +36 -36
  134. package/src/contentful/blocks/text/Text.stories.tsx +23 -23
  135. package/src/contentful/blocks/text/index.tsx +12 -12
  136. package/src/contentful/blocks/text/types.ts +1 -1
  137. package/src/contentful/index.ts +57 -57
  138. package/src/hooks/use-body-scroll-lock.ts +34 -34
  139. package/src/hooks/use-outside-click.ts +17 -17
  140. package/src/index.ts +96 -96
  141. package/src/next/index.ts +5 -5
  142. package/src/setupTests.ts +46 -46
  143. package/src/stories/DocsTemplate.tsx +24 -24
  144. package/src/styles/globals.css +307 -307
  145. package/src/types/global.d.ts +9 -9
  146. package/src/types/micro-components.ts +89 -89
  147. package/src/utils/index.ts +49 -49
  148. package/tailwind.config.cjs +8 -24
@@ -1,98 +1,98 @@
1
- //If new icon need to add, Add iconname in iconNameList array and follow instruction in README.md
2
- export const iconNameList = [
3
- "info",
4
- "download",
5
- "featured_seasonal_and_gifts",
6
- "visibility",
7
- "paid",
8
- "check_box",
9
- "check_box_outline_blank",
10
- "radio_button_unchecked",
11
- "radio_button_checked",
12
- "counter_1",
13
- "counter_2",
14
- "counter_3",
15
- "error",
16
- "search",
17
- "cancel",
18
- "router",
19
- "broadcast_on_home",
20
- "check",
21
- "check_circle",
22
- "lock",
23
- "shield_lock",
24
- "phone_in_talk",
25
- "call",
26
- "chevron_left",
27
- "chevron_right",
28
- "keyboard_arrow_down",
29
- "keyboard_arrow_up",
30
- "arrow_back",
31
- "arrow_forward",
32
- "help",
33
- "home_pin",
34
- "location_on",
35
- "timer",
36
- "schedule",
37
- "add",
38
- "remove",
39
- "bolt",
40
- "rocket",
41
- "cloud_sync",
42
- "close",
43
- "groups",
44
- "speed",
45
- "mail",
46
- "credit_card",
47
- "language",
48
- "forum",
49
- "contract",
50
- "local_atm",
51
- "headset_mic",
52
- "sensors",
53
- "wifi",
54
- "settings",
55
- "home",
56
- "devices",
57
- "build",
58
- "thumb_up",
59
- "desktop_windows",
60
- "block",
61
- "all_inclusive",
62
- "verified_user",
63
- "extension",
64
- "stadia_controller",
65
- "visibility_off",
66
- "close_fullscreen",
67
- "progress_activity",
68
- "travel_explore",
69
- "share",
70
- "business_center",
71
- "upload",
72
- "videocam",
73
- "expand_circle_right",
74
- "add_circle",
75
- "do_not_disturb_on",
76
- "expand_circle_up",
77
- "expand_circle_down",
78
- "replay",
79
- "fiber_manual_record",
80
- "menu",
81
- "dangerous",
82
- "star",
83
- "play_arrow",
84
- "calendar_clock",
85
- ] as const;
86
-
87
- export const OpticalSizes = ["20dp", "24dp", "40dp", "48dp"] as const;
88
- export const weights = [
89
- "100",
90
- "200",
91
- "300",
92
- "400",
93
- "500",
94
- "600",
95
- "700",
96
- ] as const;
97
- export const emphasis = [-25, 0, 200] as const;
98
- export const sizes = [20, 24, 32, 40, 48, 52] as const;
1
+ //If new icon need to add, Add iconname in iconNameList array and follow instruction in README.md
2
+ export const iconNameList = [
3
+ "info",
4
+ "download",
5
+ "featured_seasonal_and_gifts",
6
+ "visibility",
7
+ "paid",
8
+ "check_box",
9
+ "check_box_outline_blank",
10
+ "radio_button_unchecked",
11
+ "radio_button_checked",
12
+ "counter_1",
13
+ "counter_2",
14
+ "counter_3",
15
+ "error",
16
+ "search",
17
+ "cancel",
18
+ "router",
19
+ "broadcast_on_home",
20
+ "check",
21
+ "check_circle",
22
+ "lock",
23
+ "shield_lock",
24
+ "phone_in_talk",
25
+ "call",
26
+ "chevron_left",
27
+ "chevron_right",
28
+ "keyboard_arrow_down",
29
+ "keyboard_arrow_up",
30
+ "arrow_back",
31
+ "arrow_forward",
32
+ "help",
33
+ "home_pin",
34
+ "location_on",
35
+ "timer",
36
+ "schedule",
37
+ "add",
38
+ "remove",
39
+ "bolt",
40
+ "rocket",
41
+ "cloud_sync",
42
+ "close",
43
+ "groups",
44
+ "speed",
45
+ "mail",
46
+ "credit_card",
47
+ "language",
48
+ "forum",
49
+ "contract",
50
+ "local_atm",
51
+ "headset_mic",
52
+ "sensors",
53
+ "wifi",
54
+ "settings",
55
+ "home",
56
+ "devices",
57
+ "build",
58
+ "thumb_up",
59
+ "desktop_windows",
60
+ "block",
61
+ "all_inclusive",
62
+ "verified_user",
63
+ "extension",
64
+ "stadia_controller",
65
+ "visibility_off",
66
+ "close_fullscreen",
67
+ "progress_activity",
68
+ "travel_explore",
69
+ "share",
70
+ "business_center",
71
+ "upload",
72
+ "videocam",
73
+ "expand_circle_right",
74
+ "add_circle",
75
+ "do_not_disturb_on",
76
+ "expand_circle_up",
77
+ "expand_circle_down",
78
+ "replay",
79
+ "fiber_manual_record",
80
+ "menu",
81
+ "dangerous",
82
+ "star",
83
+ "play_arrow",
84
+ "calendar_clock",
85
+ ] as const;
86
+
87
+ export const OpticalSizes = ["20dp", "24dp", "40dp", "48dp"] as const;
88
+ export const weights = [
89
+ "100",
90
+ "200",
91
+ "300",
92
+ "400",
93
+ "500",
94
+ "600",
95
+ "700",
96
+ ] as const;
97
+ export const emphasis = [-25, 0, 200] as const;
98
+ export const sizes = [20, 24, 32, 40, 48, 52] as const;
@@ -1,44 +1,44 @@
1
- import React from "react";
2
- import { cx } from "../../utils";
3
- import type { IconProps } from "./types";
4
-
5
- const MaterialIcon: React.FC<IconProps> = ({
6
- name,
7
- fill = 0,
8
- opticalSize = "48dp",
9
- weight = "200",
10
- emphasis = 145,
11
- size = 24,
12
- color = "currentColor",
13
- style = {},
14
- className,
15
- onClick,
16
- dataTestId,
17
- }) => {
18
- const fontVariationSettings = `'FILL' ${fill}, 'wght' ${weight}, 'GRAD' ${emphasis}, 'opsz' ${opticalSize.substring(0, 2)}`;
19
-
20
- const combinedStyle: React.CSSProperties = {
21
- fontVariationSettings,
22
- fontSize: `${size}px`,
23
- fontFamily: "'Material Symbols Rounded'",
24
- color: color || "currentColor",
25
- ...style,
26
- };
27
-
28
- return (
29
- <span
30
- style={combinedStyle}
31
- className={cx("material-symbols-rounded", className)}
32
- onClick={onClick}
33
- data-testid={dataTestId}
34
- >
35
- {name}
36
- </span>
37
- );
38
- };
39
-
40
- export { MaterialIcon };
41
-
42
- MaterialIcon.displayName = "MaterialIcon";
43
-
44
- export type { IconProps, IconName } from "./types";
1
+ import React from "react";
2
+ import { cx } from "../../utils";
3
+ import type { IconProps } from "./types";
4
+
5
+ const MaterialIcon: React.FC<IconProps> = ({
6
+ name,
7
+ fill = 0,
8
+ opticalSize = "48dp",
9
+ weight = "200",
10
+ emphasis = 145,
11
+ size = 24,
12
+ color = "currentColor",
13
+ style = {},
14
+ className,
15
+ onClick,
16
+ dataTestId,
17
+ }) => {
18
+ const fontVariationSettings = `'FILL' ${fill}, 'wght' ${weight}, 'GRAD' ${emphasis}, 'opsz' ${opticalSize.substring(0, 2)}`;
19
+
20
+ const combinedStyle: React.CSSProperties = {
21
+ fontVariationSettings,
22
+ fontSize: `${size}px`,
23
+ fontFamily: "'Material Symbols Rounded'",
24
+ color: color || "currentColor",
25
+ ...style,
26
+ };
27
+
28
+ return (
29
+ <span
30
+ style={combinedStyle}
31
+ className={cx("material-symbols-rounded", className)}
32
+ onClick={onClick}
33
+ data-testid={dataTestId}
34
+ >
35
+ {name}
36
+ </span>
37
+ );
38
+ };
39
+
40
+ export { MaterialIcon };
41
+
42
+ MaterialIcon.displayName = "MaterialIcon";
43
+
44
+ export type { IconProps, IconName } from "./types";
@@ -1,31 +1,31 @@
1
- import type { CSSProperties } from "react";
2
- import {
3
- emphasis,
4
- iconNameList,
5
- OpticalSizes,
6
- sizes,
7
- weights,
8
- } from "./constants";
9
-
10
- export type Fill = 1 | 0;
11
-
12
- export type IconName = (typeof iconNameList)[number];
13
-
14
- export type OpticalSize = (typeof OpticalSizes)[number];
15
- export type Weight = (typeof weights)[number];
16
- export type Emphasis = (typeof emphasis)[number];
17
- export type Size = (typeof sizes)[number];
18
-
19
- export type IconProps = {
20
- name: IconName;
21
- fill?: Fill;
22
- opticalSize?: OpticalSize;
23
- weight?: Weight;
24
- emphasis?: Emphasis;
25
- size?: Size;
26
- color?: string;
27
- style?: CSSProperties;
28
- className?: string;
29
- onClick?: () => void;
30
- dataTestId?: string;
31
- };
1
+ import type { CSSProperties } from "react";
2
+ import {
3
+ emphasis,
4
+ iconNameList,
5
+ OpticalSizes,
6
+ sizes,
7
+ weights,
8
+ } from "./constants";
9
+
10
+ export type Fill = 1 | 0;
11
+
12
+ export type IconName = (typeof iconNameList)[number];
13
+
14
+ export type OpticalSize = (typeof OpticalSizes)[number];
15
+ export type Weight = (typeof weights)[number];
16
+ export type Emphasis = (typeof emphasis)[number];
17
+ export type Size = (typeof sizes)[number];
18
+
19
+ export type IconProps = {
20
+ name: IconName;
21
+ fill?: Fill;
22
+ opticalSize?: OpticalSize;
23
+ weight?: Weight;
24
+ emphasis?: Emphasis;
25
+ size?: Size;
26
+ color?: string;
27
+ style?: CSSProperties;
28
+ className?: string;
29
+ onClick?: () => void;
30
+ dataTestId?: string;
31
+ };