@windstream/react-shared-components 0.0.63 → 0.0.65

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 (144) hide show
  1. package/README.md +629 -629
  2. package/dist/contentful/index.d.ts +34 -28
  3. package/dist/contentful/index.esm.js +1 -1
  4. package/dist/contentful/index.esm.js.map +1 -1
  5. package/dist/contentful/index.js +1 -1
  6. package/dist/contentful/index.js.map +1 -1
  7. package/dist/core.d.ts +2 -2
  8. package/dist/index.d.ts +2 -2
  9. package/dist/index.esm.js +1 -1
  10. package/dist/index.esm.js.map +1 -1
  11. package/dist/index.js +1 -1
  12. package/dist/index.js.map +1 -1
  13. package/dist/next/index.esm.js +1 -1
  14. package/dist/next/index.esm.js.map +1 -1
  15. package/dist/next/index.js +1 -1
  16. package/dist/next/index.js.map +1 -1
  17. package/dist/styles.css +1 -1
  18. package/package.json +175 -175
  19. package/src/components/accordion/Accordion.stories.tsx +230 -230
  20. package/src/components/accordion/types.ts +10 -10
  21. package/src/components/alert-card/AlertCard.stories.tsx +171 -171
  22. package/src/components/alert-card/index.tsx +32 -32
  23. package/src/components/alert-card/types.ts +9 -9
  24. package/src/components/brand-button/BrandButton.stories.tsx +219 -219
  25. package/src/components/brand-button/helpers.ts +35 -35
  26. package/src/components/brand-button/index.tsx +93 -93
  27. package/src/components/brand-button/types.ts +25 -25
  28. package/src/components/button/Button.stories.tsx +108 -108
  29. package/src/components/button/index.tsx +27 -27
  30. package/src/components/button/types.ts +14 -14
  31. package/src/components/call-button/CallButton.stories.tsx +324 -324
  32. package/src/components/call-button/index.tsx +79 -79
  33. package/src/components/call-button/types.ts +10 -10
  34. package/src/components/checkbox/Checkbox.stories.tsx +247 -247
  35. package/src/components/checkbox/index.tsx +197 -197
  36. package/src/components/checkbox/types.ts +27 -27
  37. package/src/components/checklist/Checklist.stories.tsx +150 -150
  38. package/src/components/collapse/Collapse.stories.tsx +255 -255
  39. package/src/components/collapse/index.tsx +46 -46
  40. package/src/components/collapse/types.ts +6 -6
  41. package/src/components/divider/Divider.stories.tsx +205 -205
  42. package/src/components/divider/index.tsx +22 -22
  43. package/src/components/divider/type.ts +3 -3
  44. package/src/components/image/Image.stories.tsx +113 -113
  45. package/src/components/image/index.tsx +25 -25
  46. package/src/components/image/types.ts +40 -40
  47. package/src/components/input/Input.stories.tsx +325 -325
  48. package/src/components/input/index.tsx +177 -177
  49. package/src/components/input/types.ts +37 -37
  50. package/src/components/link/Link.stories.tsx +163 -163
  51. package/src/components/link/types.ts +25 -25
  52. package/src/components/list/List.stories.tsx +272 -272
  53. package/src/components/list/index.tsx +88 -88
  54. package/src/components/list/list-item/index.tsx +38 -38
  55. package/src/components/list/list-item/types.ts +13 -13
  56. package/src/components/list/types.ts +29 -29
  57. package/src/components/material-icon/MaterialIcon.stories.tsx +330 -330
  58. package/src/components/material-icon/constants.ts +96 -96
  59. package/src/components/material-icon/index.tsx +44 -44
  60. package/src/components/material-icon/types.ts +31 -31
  61. package/src/components/modal/Modal.stories.tsx +171 -171
  62. package/src/components/modal/index.tsx +164 -164
  63. package/src/components/modal/types.ts +24 -24
  64. package/src/components/next-image/index.tsx +32 -18
  65. package/src/components/next-image/types.ts +1 -1
  66. package/src/components/radio-button/RadioButton.stories.tsx +307 -307
  67. package/src/components/radio-button/index.tsx +75 -75
  68. package/src/components/radio-button/types.ts +21 -21
  69. package/src/components/see-more/SeeMore.stories.tsx +181 -181
  70. package/src/components/see-more/index.tsx +44 -44
  71. package/src/components/see-more/types.ts +4 -4
  72. package/src/components/select/Select.stories.tsx +411 -411
  73. package/src/components/select/index.tsx +150 -150
  74. package/src/components/select/types.ts +35 -35
  75. package/src/components/select-plan-button/SelectPlanButton.stories.tsx +184 -184
  76. package/src/components/select-plan-button/index.tsx +31 -31
  77. package/src/components/select-plan-button/types.ts +5 -5
  78. package/src/components/skeleton/Skeleton.stories.tsx +179 -179
  79. package/src/components/skeleton/index.tsx +61 -61
  80. package/src/components/skeleton/types.ts +4 -4
  81. package/src/components/spinner/Spinner.stories.tsx +335 -335
  82. package/src/components/spinner/index.tsx +44 -44
  83. package/src/components/spinner/types.ts +5 -5
  84. package/src/components/text/Text.stories.tsx +321 -321
  85. package/src/components/text/index.tsx +25 -25
  86. package/src/components/text/types.ts +45 -45
  87. package/src/components/tooltip/Tooltip.stories.tsx +219 -219
  88. package/src/components/tooltip/index.tsx +74 -74
  89. package/src/components/tooltip/types.ts +7 -7
  90. package/src/components/view-cart-button/ViewCartButton.stories.tsx +252 -252
  91. package/src/components/view-cart-button/index.tsx +44 -44
  92. package/src/components/view-cart-button/types.ts +5 -5
  93. package/src/contentful/blocks/button/Button.stories.tsx +40 -40
  94. package/src/contentful/blocks/button/index.tsx +64 -64
  95. package/src/contentful/blocks/button/types.ts +24 -24
  96. package/src/contentful/blocks/callout/Callout.stories.tsx +23 -23
  97. package/src/contentful/blocks/cards/Cards.stories.tsx +23 -23
  98. package/src/contentful/blocks/cards/index.tsx +13 -13
  99. package/src/contentful/blocks/cards/product-card/index.tsx +198 -198
  100. package/src/contentful/blocks/cards/product-card/types.ts +18 -18
  101. package/src/contentful/blocks/cards/testimonial-card/index.tsx +86 -86
  102. package/src/contentful/blocks/cards/testimonial-card/types.tsx +10 -10
  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/index.tsx +13 -13
  106. package/src/contentful/blocks/carousel/types.ts +1 -1
  107. package/src/contentful/blocks/cta-callout/CtaCallout.stories.tsx +46 -46
  108. package/src/contentful/blocks/cta-callout/index.tsx +54 -54
  109. package/src/contentful/blocks/cta-callout/types.ts +22 -22
  110. package/src/contentful/blocks/floating-banner/FloatingBanner.stories.tsx +34 -34
  111. package/src/contentful/blocks/floating-banner/types.ts +22 -22
  112. package/src/contentful/blocks/footer/Footer.stories.tsx +30 -30
  113. package/src/contentful/blocks/image-promo-bar/ImagePromoBar.stories.tsx +23 -23
  114. package/src/contentful/blocks/image-promo-bar/types.ts +27 -27
  115. package/src/contentful/blocks/modal/Modal.stories.tsx +23 -23
  116. package/src/contentful/blocks/modal/index.tsx +12 -12
  117. package/src/contentful/blocks/modal/types.ts +1 -1
  118. package/src/contentful/blocks/navigation/desktop-link-groups.tsx/index.tsx +111 -0
  119. package/src/contentful/blocks/navigation/index.tsx +366 -56
  120. package/src/contentful/blocks/navigation/mobile-link-groups.tsx/index.tsx +80 -0
  121. package/src/contentful/blocks/navigation/types.ts +39 -21
  122. package/src/contentful/blocks/primary-hero/PrimaryHero.stories.tsx +23 -23
  123. package/src/contentful/blocks/primary-hero/index.tsx +160 -160
  124. package/src/contentful/blocks/primary-hero/types.ts +30 -30
  125. package/src/contentful/blocks/shape-background-wrapper/ShapeBackgroundWrapper.stories.tsx +26 -26
  126. package/src/contentful/blocks/shape-background-wrapper/index.tsx +124 -124
  127. package/src/contentful/blocks/shape-background-wrapper/types.ts +36 -36
  128. package/src/contentful/blocks/text/Text.stories.tsx +23 -23
  129. package/src/contentful/blocks/text/index.tsx +12 -12
  130. package/src/contentful/blocks/text/types.ts +1 -1
  131. package/src/contentful/index.ts +54 -54
  132. package/src/hooks/use-body-scroll-lock.ts +34 -34
  133. package/src/hooks/use-outside-click.ts +17 -0
  134. package/src/index.ts +96 -96
  135. package/src/next/index.ts +5 -5
  136. package/src/setupTests.ts +46 -46
  137. package/src/stories/DocsTemplate.tsx +24 -24
  138. package/src/styles/globals.css +307 -307
  139. package/src/types/global.d.ts +9 -9
  140. package/src/types/micro-components.ts +80 -0
  141. package/src/utils/index.ts +49 -49
  142. package/tailwind.config.cjs +1 -2
  143. package/src/contentful/blocks/navigation/Navigation.stories.tsx +0 -23
  144. package/src/contentful/blocks/navigation/link-groups.tsx/index.tsx +0 -62
@@ -1,96 +1,96 @@
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
- ] as const;
84
-
85
- export const OpticalSizes = ["20dp", "24dp", "40dp", "48dp"] as const;
86
- export const weights = [
87
- "100",
88
- "200",
89
- "300",
90
- "400",
91
- "500",
92
- "600",
93
- "700",
94
- ] as const;
95
- export const emphasis = [-25, 0, 200] as const;
96
- 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
+ ] as const;
84
+
85
+ export const OpticalSizes = ["20dp", "24dp", "40dp", "48dp"] as const;
86
+ export const weights = [
87
+ "100",
88
+ "200",
89
+ "300",
90
+ "400",
91
+ "500",
92
+ "600",
93
+ "700",
94
+ ] as const;
95
+ export const emphasis = [-25, 0, 200] as const;
96
+ 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
+ };