@windstream/react-shared-components 0.0.45 → 0.0.46

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