@windstream/react-shared-components 0.1.4 → 0.1.6

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 (152) 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 +3 -3
  7. package/dist/index.esm.js +1 -1
  8. package/dist/index.esm.js.map +1 -1
  9. package/dist/index.js +1 -1
  10. package/dist/index.js.map +1 -1
  11. package/dist/styles.css +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 +40 -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 +59 -59
  33. package/src/components/checklist/types.ts +16 -16
  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/breadcrumbs/index.tsx +55 -55
  94. package/src/contentful/blocks/button/Button.stories.tsx +40 -40
  95. package/src/contentful/blocks/button/index.tsx +108 -108
  96. package/src/contentful/blocks/button/types.ts +34 -34
  97. package/src/contentful/blocks/callout/Callout.stories.tsx +23 -23
  98. package/src/contentful/blocks/callout/index.tsx +66 -66
  99. package/src/contentful/blocks/cards/Cards.stories.tsx +23 -23
  100. package/src/contentful/blocks/cards/blog-card/index.tsx +99 -99
  101. package/src/contentful/blocks/cards/blog-card/types.ts +14 -14
  102. package/src/contentful/blocks/cards/index.tsx +13 -13
  103. package/src/contentful/blocks/cards/product-card/index.tsx +208 -208
  104. package/src/contentful/blocks/cards/product-card/types.ts +28 -28
  105. package/src/contentful/blocks/cards/testimonial-card/index.tsx +88 -88
  106. package/src/contentful/blocks/cards/testimonial-card/types.tsx +12 -12
  107. package/src/contentful/blocks/cards/types.ts +1 -1
  108. package/src/contentful/blocks/carousel/Carousel.stories.tsx +23 -23
  109. package/src/contentful/blocks/carousel/helper.tsx +356 -356
  110. package/src/contentful/blocks/carousel/index.tsx +74 -74
  111. package/src/contentful/blocks/carousel/types.ts +143 -143
  112. package/src/contentful/blocks/cta-callout/CtaCallout.stories.tsx +46 -46
  113. package/src/contentful/blocks/cta-callout/index.tsx +60 -60
  114. package/src/contentful/blocks/cta-callout/types.ts +26 -26
  115. package/src/contentful/blocks/find-kinetic/index.tsx +130 -130
  116. package/src/contentful/blocks/floating-banner/FloatingBanner.stories.tsx +34 -34
  117. package/src/contentful/blocks/floating-banner/types.ts +22 -22
  118. package/src/contentful/blocks/footer/Footer.stories.tsx +30 -30
  119. package/src/contentful/blocks/image-promo-bar/ImagePromoBar.stories.tsx +23 -23
  120. package/src/contentful/blocks/image-promo-bar/helper.tsx +28 -28
  121. package/src/contentful/blocks/image-promo-bar/index.tsx +45 -41
  122. package/src/contentful/blocks/image-promo-bar/types.ts +44 -44
  123. package/src/contentful/blocks/image-promo-bar/vimeo-embed.tsx +93 -93
  124. package/src/contentful/blocks/image-promo-bar/youtube-embed.tsx +46 -46
  125. package/src/contentful/blocks/modal/constants.ts +53 -53
  126. package/src/contentful/blocks/modal/index.tsx +91 -91
  127. package/src/contentful/blocks/modal/types.ts +12 -12
  128. package/src/contentful/blocks/navigation/desktop-link-groups.tsx/index.tsx +111 -111
  129. package/src/contentful/blocks/navigation/index.tsx +385 -385
  130. package/src/contentful/blocks/navigation/mobile-link-groups.tsx/index.tsx +80 -80
  131. package/src/contentful/blocks/navigation/types.ts +41 -41
  132. package/src/contentful/blocks/primary-hero/PrimaryHero.stories.tsx +23 -23
  133. package/src/contentful/blocks/primary-hero/index.tsx +229 -229
  134. package/src/contentful/blocks/primary-hero/types.ts +35 -35
  135. package/src/contentful/blocks/search-block/index.tsx +90 -90
  136. package/src/contentful/blocks/shape-background-wrapper/ShapeBackgroundWrapper.stories.tsx +26 -26
  137. package/src/contentful/blocks/shape-background-wrapper/index.tsx +124 -124
  138. package/src/contentful/blocks/shape-background-wrapper/types.ts +36 -36
  139. package/src/contentful/blocks/text/Text.stories.tsx +23 -23
  140. package/src/contentful/blocks/text/index.tsx +12 -12
  141. package/src/contentful/blocks/text/types.ts +1 -1
  142. package/src/contentful/index.ts +69 -69
  143. package/src/hooks/use-body-scroll-lock.ts +34 -34
  144. package/src/hooks/use-outside-click.ts +17 -17
  145. package/src/index.ts +96 -96
  146. package/src/next/index.ts +5 -5
  147. package/src/setupTests.ts +46 -46
  148. package/src/stories/DocsTemplate.tsx +24 -24
  149. package/src/styles/globals.css +343 -343
  150. package/src/types/global.d.ts +9 -9
  151. package/src/types/micro-components.ts +99 -99
  152. package/src/utils/index.ts +49 -49
@@ -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,47 +1,47 @@
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(
32
- "material-symbols-rounded inline-block max-w-[52px] overflow-hidden",
33
- className
34
- )}
35
- onClick={onClick}
36
- data-testid={dataTestId}
37
- >
38
- {name}
39
- </span>
40
- );
41
- };
42
-
43
- export { MaterialIcon };
44
-
45
- MaterialIcon.displayName = "MaterialIcon";
46
-
47
- 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(
32
+ "material-symbols-rounded inline-block max-w-[52px] overflow-hidden",
33
+ className
34
+ )}
35
+ onClick={onClick}
36
+ data-testid={dataTestId}
37
+ >
38
+ {name}
39
+ </span>
40
+ );
41
+ };
42
+
43
+ export { MaterialIcon };
44
+
45
+ MaterialIcon.displayName = "MaterialIcon";
46
+
47
+ 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
+ };