@4alldigital/foundation-ui--gamma 1.22.0 → 1.23.0

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 (105) hide show
  1. package/dist/foundation-ui.css +1 -1
  2. package/dist/index.esm.js +121 -99
  3. package/dist/index.js +121 -98
  4. package/dist/types/fui/components/Blockquote/Blockquote.d.ts +7 -0
  5. package/dist/types/fui/components/Blockquote/Blockquote.stories.d.ts +6 -0
  6. package/dist/types/fui/components/Blockquote/Blockquote.test.d.ts +1 -0
  7. package/dist/types/fui/components/Blockquote/Blockquote.types.d.ts +7 -0
  8. package/dist/types/fui/components/Blockquote/index.d.ts +1 -0
  9. package/dist/types/fui/components/Button/Button.d.ts +7 -0
  10. package/dist/types/fui/components/Button/Button.stories.d.ts +8 -0
  11. package/dist/types/fui/components/Button/Button.test.d.ts +1 -0
  12. package/dist/types/fui/components/Button/Button.types.d.ts +36 -0
  13. package/dist/types/fui/components/Button/index.d.ts +1 -0
  14. package/dist/types/fui/components/Container/Container.d.ts +7 -0
  15. package/dist/types/fui/components/Container/Container.stories.d.ts +6 -0
  16. package/dist/types/fui/components/Container/Container.test.d.ts +1 -0
  17. package/dist/types/fui/components/Container/Container.types.d.ts +7 -0
  18. package/dist/types/fui/components/Container/index.d.ts +1 -0
  19. package/dist/types/fui/components/ContentPageLayout/ContentPageLayout.d.ts +7 -0
  20. package/dist/types/fui/components/ContentPageLayout/ContentPageLayout.stories.d.ts +6 -0
  21. package/dist/types/fui/components/ContentPageLayout/ContentPageLayout.test.d.ts +1 -0
  22. package/dist/types/fui/components/ContentPageLayout/ContentPageLayout.types.d.ts +17 -0
  23. package/dist/types/fui/components/ContentPageLayout/index.d.ts +1 -0
  24. package/dist/types/fui/components/ContentRowsLayout/ContentRowsLayout.d.ts +7 -0
  25. package/dist/types/fui/components/ContentRowsLayout/ContentRowsLayout.stories.d.ts +6 -0
  26. package/dist/types/fui/components/ContentRowsLayout/ContentRowsLayout.test.d.ts +1 -0
  27. package/dist/types/fui/components/ContentRowsLayout/ContentRowsLayout.types.d.ts +15 -0
  28. package/dist/types/fui/components/ContentRowsLayout/index.d.ts +1 -0
  29. package/dist/types/fui/components/Copy/Copy.d.ts +7 -0
  30. package/dist/types/fui/components/Copy/Copy.stories.d.ts +6 -0
  31. package/dist/types/fui/components/Copy/Copy.test.d.ts +1 -0
  32. package/dist/types/fui/components/Copy/Copy.types.d.ts +41 -0
  33. package/dist/types/fui/components/Copy/index.d.ts +1 -0
  34. package/dist/types/fui/components/Form/Form.d.ts +8 -0
  35. package/dist/types/fui/components/Form/Form.stories.d.ts +7 -0
  36. package/dist/types/fui/components/Form/Form.test.d.ts +1 -0
  37. package/dist/types/fui/components/Form/Form.types.d.ts +21 -0
  38. package/dist/types/fui/components/Form/index.d.ts +1 -0
  39. package/dist/types/fui/components/FormField/FormField.d.ts +8 -0
  40. package/dist/types/fui/components/FormField/FormField.stories.d.ts +7 -0
  41. package/dist/types/fui/components/FormField/FormField.test.d.ts +1 -0
  42. package/dist/types/fui/components/FormField/FormField.types.d.ts +25 -0
  43. package/dist/types/fui/components/FormField/index.d.ts +1 -0
  44. package/dist/types/fui/components/FormSelect/FormSelect.d.ts +4 -0
  45. package/dist/types/fui/components/FormSelect/FormSelect.stories.d.ts +6 -0
  46. package/dist/types/fui/components/FormSelect/FormSelect.test.d.ts +1 -0
  47. package/dist/types/fui/components/FormSelect/FormSelect.types.d.ts +39 -0
  48. package/dist/types/fui/components/FormSelect/index.d.ts +1 -0
  49. package/dist/types/fui/components/Heading/Heading.d.ts +7 -0
  50. package/dist/types/fui/components/Heading/Heading.stories.d.ts +7 -0
  51. package/dist/types/fui/components/Heading/Heading.test.d.ts +1 -0
  52. package/dist/types/fui/components/Heading/Heading.types.d.ts +31 -0
  53. package/dist/types/fui/components/Heading/index.d.ts +1 -0
  54. package/dist/types/fui/components/Hr/Hr.d.ts +5 -0
  55. package/dist/types/fui/components/Hr/Hr.stories.d.ts +6 -0
  56. package/dist/types/fui/components/Hr/Hr.test.d.ts +1 -0
  57. package/dist/types/fui/components/Hr/index.d.ts +1 -0
  58. package/dist/types/fui/components/Icon/Icon.d.ts +11 -0
  59. package/dist/types/fui/components/Icon/Icon.stories.d.ts +6 -0
  60. package/dist/types/fui/components/Icon/Icon.test.d.ts +1 -0
  61. package/dist/types/fui/components/Icon/Icon.types.d.ts +7 -0
  62. package/dist/types/fui/components/Icon/index.d.ts +1 -0
  63. package/dist/types/fui/components/Image/Image.d.ts +7 -0
  64. package/dist/types/fui/components/Image/Image.stories.d.ts +6 -0
  65. package/dist/types/fui/components/Image/Image.test.d.ts +1 -0
  66. package/dist/types/fui/components/Image/Image.types.d.ts +16 -0
  67. package/dist/types/fui/components/Image/index.d.ts +1 -0
  68. package/dist/types/fui/components/Link/Link.d.ts +7 -0
  69. package/dist/types/fui/components/Link/Link.stories.d.ts +6 -0
  70. package/dist/types/fui/components/Link/Link.test.d.ts +1 -0
  71. package/dist/types/fui/components/Link/Link.types.d.ts +12 -0
  72. package/dist/types/fui/components/Link/index.d.ts +1 -0
  73. package/dist/types/fui/components/List/List.d.ts +7 -0
  74. package/dist/types/fui/components/List/List.stories.d.ts +6 -0
  75. package/dist/types/fui/components/List/List.test.d.ts +1 -0
  76. package/dist/types/fui/components/List/List.types.d.ts +25 -0
  77. package/dist/types/fui/components/List/index.d.ts +1 -0
  78. package/dist/types/fui/components/ListItem/ListItem.d.ts +7 -0
  79. package/dist/types/fui/components/ListItem/ListItem.test.d.ts +1 -0
  80. package/dist/types/fui/components/ListItem/ListItem.types.d.ts +8 -0
  81. package/dist/types/fui/components/ListItem/index.d.ts +1 -0
  82. package/dist/types/fui/components/Loader/Loader.d.ts +7 -0
  83. package/dist/types/fui/components/Loader/Loader.stories.d.ts +6 -0
  84. package/dist/types/fui/components/Loader/Loader.test.d.ts +1 -0
  85. package/dist/types/fui/components/Loader/Loader.types.d.ts +4 -0
  86. package/dist/types/fui/components/Loader/index.d.ts +1 -0
  87. package/dist/types/fui/components/Notice/Notice.d.ts +7 -0
  88. package/dist/types/fui/components/Notice/Notice.stories.d.ts +6 -0
  89. package/dist/types/fui/components/Notice/Notice.test.d.ts +1 -0
  90. package/dist/types/fui/components/Notice/Notice.types.d.ts +5 -0
  91. package/dist/types/fui/components/Notice/index.d.ts +1 -0
  92. package/dist/types/fui/components/TextInput/TextInput.d.ts +5 -0
  93. package/dist/types/fui/components/TextInput/TextInput.stories.d.ts +6 -0
  94. package/dist/types/fui/components/TextInput/TextInput.test.d.ts +1 -0
  95. package/dist/types/fui/components/TextInput/TextInput.types.d.ts +31 -0
  96. package/dist/types/fui/components/TextInput/index.d.ts +1 -0
  97. package/dist/types/fui/components/index.d.ts +15 -0
  98. package/dist/types/fui/context/ThemeContext.d.ts +18 -0
  99. package/dist/types/fui/index.d.ts +1 -0
  100. package/dist/types/fui/setupTests.d.ts +1 -0
  101. package/dist/types/fui/stories/Header.d.ts +11 -0
  102. package/dist/types/fui/stories/Header.stories.d.ts +8 -0
  103. package/dist/types/fui/stories/Page.d.ts +2 -0
  104. package/dist/types/fui/stories/Page.stories.d.ts +8 -0
  105. package/package.json +2 -4
package/dist/index.js CHANGED
@@ -5,16 +5,33 @@ var cx = require('classnames');
5
5
  var react = require('@iconify/react');
6
6
 
7
7
  var Blockquote = function (_a) {
8
- var text = _a.text, citation = _a.citation, className = _a.className, citationAttribute = _a.citationAttribute, showIcon = _a.showIcon;
8
+ var text = _a.text, citation = _a.citation, className = _a.className, citationAttribute = _a.citationAttribute, _b = _a.showIcon, showIcon = _b === void 0 ? true : _b;
9
9
  var classes = cx('text-xl italic font-bold', className);
10
10
  return (jsxRuntime.jsxs("blockquote", { "data-testid": "Blockquote", className: classes, children: [showIcon && jsxRuntime.jsx("svg", { "aria-hidden": "true", className: "w-10 h-10", viewBox: "0 0 24 27", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("path", { d: "M14.017 18L14.017 10.609C14.017 4.905 17.748 1.039 23 0L23.995 2.151C21.563 3.068 20 5.789 20 8H24V18H14.017ZM0 18V10.609C0 4.905 3.748 1.038 9 0L9.996 2.151C7.563 3.068 6 5.789 6 8H9.983L9.983 18L0 18Z", fill: "currentColor" }) }), jsxRuntime.jsx("div", { children: text }), citation && (jsxRuntime.jsx("figcaption", { className: "flex flex-start items-center mt-6 space-x-3", children: jsxRuntime.jsxs("div", { className: "flex items-center divide-x-2", children: [jsxRuntime.jsx("cite", { className: "pr-3 font-medium", children: citation }), citationAttribute && jsxRuntime.jsx("cite", { className: "pl-3 text-sm font-light", children: citationAttribute })] }) }))] }));
11
11
  };
12
- Blockquote.defaultProps = {
13
- showIcon: true,
14
- };
12
+ Blockquote.displayName = 'Blockquote';
13
+
14
+ var BTN_TYPES;
15
+ (function (BTN_TYPES) {
16
+ BTN_TYPES["SUBMIT"] = "submit";
17
+ BTN_TYPES["RESET"] = "reset";
18
+ BTN_TYPES["BUTTON"] = "button";
19
+ })(BTN_TYPES || (BTN_TYPES = {}));
20
+ var BTN_VARIANTS;
21
+ (function (BTN_VARIANTS) {
22
+ BTN_VARIANTS["PRIMARY"] = "primary";
23
+ BTN_VARIANTS["SECONDARY"] = "secondary";
24
+ BTN_VARIANTS["TERTIARY"] = "tertiary";
25
+ })(BTN_VARIANTS || (BTN_VARIANTS = {}));
26
+ var BTN_SIZES;
27
+ (function (BTN_SIZES) {
28
+ BTN_SIZES["SMALL"] = "small";
29
+ BTN_SIZES["MEDIUM"] = "medium";
30
+ BTN_SIZES["LARGE"] = "large";
31
+ })(BTN_SIZES || (BTN_SIZES = {}));
15
32
 
16
33
  var Button = function (_a) {
17
- var variant = _a.variant, size = _a.size, uppercase = _a.uppercase, children = _a.children, id = _a.id, type = _a.type, disabled = _a.disabled, ariaLabel = _a.ariaLabel, onClick = _a.onClick, icon = _a.icon, external = _a.external, iconFirst = _a.iconFirst, raised = _a.raised, outline = _a.outline, wide = _a.wide, rounded = _a.rounded, testID = _a.testID;
34
+ var _b = _a.variant, variant = _b === void 0 ? BTN_VARIANTS.PRIMARY : _b, _c = _a.size, size = _c === void 0 ? BTN_SIZES.MEDIUM : _c, _d = _a.type, type = _d === void 0 ? BTN_TYPES.BUTTON : _d, _e = _a.wide, wide = _e === void 0 ? true : _e, _f = _a.rounded, rounded = _f === void 0 ? true : _f, _g = _a.raised, raised = _g === void 0 ? true : _g, uppercase = _a.uppercase, children = _a.children, id = _a.id, disabled = _a.disabled, ariaLabel = _a.ariaLabel, onClick = _a.onClick, icon = _a.icon, external = _a.external, iconFirst = _a.iconFirst, outline = _a.outline, testID = _a.testID, className = _a.className;
18
35
  var smallX = wide ? 'px-5' : 'px-3';
19
36
  var mediumX = wide ? 'px-8' : 'px-4';
20
37
  var largeX = wide ? 'px-11' : 'px-5';
@@ -38,69 +55,59 @@ var Button = function (_a) {
38
55
  y: 'py-3',
39
56
  space: 'space-x-4',
40
57
  text: 'text-lg',
41
- icon: 'w-6 h-6'
58
+ icon: 'w-6 h-6',
42
59
  },
43
60
  };
44
- var classes = cx('font-bold flex items-center transition-all duration-200 transform active:scale-95 justify-around border-solid border rounded', { 'text-white border-primary hover:bg-primary-darker hover:border-primary-darker': variant === 'primary' }, { 'text-white border-secondary hover:bg-secondary-darker hover:border-secondary-darker': variant === 'secondary' }, { 'text-black border-tertiary hover:bg-tertiary-darker hover:border-tertiary-darker': variant === 'tertiary' }, { 'bg-primary': variant === 'primary' && !outline }, { 'bg-secondary': variant === 'secondary' && !outline }, { 'bg-tertiary': variant === 'tertiary' && !outline }, { 'bg-transparent': outline }, { shadow: raised }, { uppercase: uppercase }, { 'auto-cols-auto grid-cols-2 gap-2': icon || external }, { 'rounded-full': rounded }, { 'flex-row-reverse': iconFirst }, "".concat(sizes[size].y, " ").concat(sizes[size].x, " ").concat(sizes[size].text));
61
+ var classes = cx('font-bold flex items-center transition-all duration-200 transform active:scale-95 justify-around border-solid border rounded', { 'text-white border-primary hover:bg-primary-darker hover:border-primary-darker': variant === 'primary' }, { 'text-white border-secondary hover:bg-secondary-darker hover:border-secondary-darker': variant === 'secondary' }, { 'text-black border-tertiary hover:bg-tertiary-darker hover:border-tertiary-darker': variant === 'tertiary' }, { 'bg-primary': variant === 'primary' && !outline }, { 'bg-secondary': variant === 'secondary' && !outline }, { 'bg-tertiary': variant === 'tertiary' && !outline }, { 'bg-transparent': outline }, { shadow: raised }, { uppercase: uppercase }, { 'auto-cols-auto grid-cols-2 gap-2': icon || external }, { 'rounded-full': rounded }, { 'flex-row-reverse': iconFirst }, "".concat(sizes[size].y, " ").concat(sizes[size].x, " ").concat(sizes[size].text), className);
45
62
  var iconClasses = cx(sizes[size].icon);
46
- return (jsxRuntime.jsx("button", { id: id, "data-testid": testID || id || "Button", onClick: onClick, className: classes, type: type, disabled: disabled, "aria-label": ariaLabel, role: "button", children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [children, icon && !external && (jsxRuntime.jsx("span", { className: "flex items-center", children: jsxRuntime.jsx(react.Icon, { icon: icon, className: iconClasses }) })), external && (jsxRuntime.jsx("span", { className: "flex items-center", children: jsxRuntime.jsx(react.Icon, { icon: "carbon:launch", className: iconClasses }) }))] }) }));
47
- };
48
- Button.defaultProps = {
49
- variant: 'primary',
50
- size: 'medium',
51
- type: 'button',
52
- raised: true,
53
- wide: true,
54
- rounded: true,
63
+ return (jsxRuntime.jsx("button", { id: id, "data-testid": testID || id || 'Button', onClick: onClick, className: classes, type: type, disabled: disabled, "aria-label": ariaLabel, role: "button", children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [children, icon && !external && (jsxRuntime.jsx("span", { className: "flex items-center", children: jsxRuntime.jsx(react.Icon, { icon: icon, className: iconClasses }) })), external && (jsxRuntime.jsx("span", { className: "flex items-center", children: jsxRuntime.jsx(react.Icon, { icon: "carbon:launch", className: iconClasses }) }))] }) }));
55
64
  };
65
+ Button.displayName = 'Button';
56
66
 
57
- var Align;
58
- (function (Align) {
59
- Align["LEFT"] = "left";
60
- Align["CENTER"] = "center";
61
- Align["RIGHT"] = "right";
62
- Align["JUSTIFY"] = "justify";
63
- Align["NOWRAP"] = "nowrap";
64
- })(Align || (Align = {}));
65
- var Transform;
66
- (function (Transform) {
67
- Transform["LOWERCASE"] = "lowercase";
68
- Transform["UPPERCASE"] = "uppercase";
69
- Transform["CAPITALIZE"] = "capitalize";
70
- Transform["NORMALCASE"] = "normal-case";
71
- })(Transform || (Transform = {}));
72
- var Contextual;
73
- (function (Contextual) {
74
- Contextual["INVERTED"] = "inverted";
75
- Contextual["MUTED"] = "muted";
76
- })(Contextual || (Contextual = {}));
77
- var Size;
78
- (function (Size) {
79
- Size["SMALL"] = "small";
80
- Size["LARGE"] = "large";
81
- Size["INTRO"] = "intro";
82
- })(Size || (Size = {}));
83
- var Tag;
84
- (function (Tag) {
85
- Tag["P"] = "p";
86
- Tag["DIV"] = "div";
87
- Tag["SMALL"] = "small";
88
- })(Tag || (Tag = {}));
67
+ var ALIGN;
68
+ (function (ALIGN) {
69
+ ALIGN["LEFT"] = "left";
70
+ ALIGN["CENTER"] = "center";
71
+ ALIGN["RIGHT"] = "right";
72
+ ALIGN["JUSTIFY"] = "justify";
73
+ ALIGN["NOWRAP"] = "nowrap";
74
+ })(ALIGN || (ALIGN = {}));
75
+ var TRANSFORM;
76
+ (function (TRANSFORM) {
77
+ TRANSFORM["LOWERCASE"] = "lowercase";
78
+ TRANSFORM["UPPERCASE"] = "uppercase";
79
+ TRANSFORM["CAPITALIZE"] = "capitalize";
80
+ TRANSFORM["NORMALCASE"] = "normal-case";
81
+ })(TRANSFORM || (TRANSFORM = {}));
82
+ var CONTEXTUAL;
83
+ (function (CONTEXTUAL) {
84
+ CONTEXTUAL["INVERTED"] = "inverted";
85
+ CONTEXTUAL["MUTED"] = "muted";
86
+ })(CONTEXTUAL || (CONTEXTUAL = {}));
87
+ var SIZE$1;
88
+ (function (SIZE) {
89
+ SIZE["SMALL"] = "small";
90
+ SIZE["LARGE"] = "large";
91
+ SIZE["INTRO"] = "intro";
92
+ })(SIZE$1 || (SIZE$1 = {}));
93
+ var TAG;
94
+ (function (TAG) {
95
+ TAG["P"] = "p";
96
+ TAG["SPAN"] = "span";
97
+ TAG["DIV"] = "div";
98
+ TAG["SMALL"] = "small";
99
+ })(TAG || (TAG = {}));
89
100
 
90
101
  var Copy = function (_a) {
91
102
  var _b;
92
- var children = _a.children, Tag = _a.tag, size = _a.size, align = _a.align, transform = _a.transform, id = _a.id, testID = _a.testID;
103
+ var children = _a.children, _c = _a.as, Tag = _c === void 0 ? TAG.P : _c, size = _a.size, _d = _a.align, align = _d === void 0 ? ALIGN.LEFT : _d, transform = _a.transform, id = _a.id, testID = _a.testID;
93
104
  var classes = cx((_b = {}, _b["text-".concat(align)] = align, _b), { 'text-sm': size === 'small' }, { 'text-lg': size === 'large' }, { 'text-2xl': size === 'intro' }, { 'mb-3 leading-5': Tag === 'p' }, { 'text-sm': Tag === 'small' }, 'body-text', transform);
94
- return jsxRuntime.jsx(Tag, { "data-testid": testID || id || "Copy", className: classes, children: children });
95
- };
96
- Copy.defaultProps = {
97
- inverted: false,
98
- maxLength: false,
99
- tag: Tag.DIV,
100
- align: Align.LEFT,
105
+ return (jsxRuntime.jsx(Tag, { "data-testid": testID || id || 'Copy', className: classes, children: children }));
101
106
  };
107
+ Copy.displayName = 'Copy';
102
108
 
103
109
  var Hr = function () { return (jsxRuntime.jsx("hr", { className: cx('border-0 border-b border-dark-body-text dark:border-dark-body-text') })); };
110
+ Hr.displayName = 'Hr';
104
111
 
105
112
  var HeadingTag;
106
113
  (function (HeadingTag) {
@@ -128,7 +135,7 @@ var HeadingTransform;
128
135
 
129
136
  var Heading = function (_a) {
130
137
  var _b;
131
- var children = _a.children, tag = _a.tag, transform = _a.transform, align = _a.align, id = _a.id, testID = _a.testID, flush = _a.flush, className = _a.className;
138
+ var children = _a.children, _c = _a.tag, tag = _c === void 0 ? HeadingTag.H1 : _c, transform = _a.transform, align = _a.align, id = _a.id, testID = _a.testID, flush = _a.flush, className = _a.className;
132
139
  var fontSize = function () {
133
140
  switch (tag) {
134
141
  case 'h1':
@@ -150,29 +157,25 @@ var Heading = function (_a) {
150
157
  var classes = cx("font-heading font-bold ".concat(size), (_b = {}, _b["text-".concat(align)] = align, _b), { 'm-0': flush }, transform, className);
151
158
  return (jsxRuntime.jsx(Tag, { "data-testid": testID || id || 'Heading', className: classes, children: children }));
152
159
  };
153
- Heading.defaultProps = {
154
- tag: HeadingTag.H1,
155
- };
160
+ Heading.displayName = 'Heading';
156
161
 
157
162
  /**
158
163
  * Icon component
159
164
  * List of supported icons can be found at https://icon-sets.iconify.design.
160
165
  */
161
166
  var Icon = function (_a) {
162
- var name = _a.name, size = _a.size, color = _a.color, id = _a.id, testID = _a.testID;
167
+ var name = _a.name, _b = _a.size, size = _b === void 0 ? 24 : _b, color = _a.color, id = _a.id, testID = _a.testID;
163
168
  if (color) {
164
169
  return jsxRuntime.jsx(react.Icon, { "data-testid": testID || id || "Icon", icon: name, width: size, height: size, color: color });
165
170
  }
166
171
  return jsxRuntime.jsx(react.Icon, { "data-testid": testID || id || "Icon", icon: name, width: size, height: size, className: cx('fill-current') });
167
172
  };
168
- Icon.defaultProps = {
169
- size: 24,
170
- };
173
+ Icon.displayName = 'Icon';
171
174
 
172
175
  var Image = function (_a) {
173
- var src = _a.src, alt = _a.alt, title = _a.title, caption = _a.caption, figure = _a.figure, onLoad = _a.onLoad, id = _a.id, testID = _a.testID;
176
+ var src = _a.src, alt = _a.alt, title = _a.title, caption = _a.caption, _b = _a.figure, figure = _b === void 0 ? false : _b, onLoad = _a.onLoad, id = _a.id, className = _a.className, testID = _a.testID;
174
177
  var figureClasses = cx('m-0');
175
- var classes = cx('w-full h-auto');
178
+ var classes = cx('w-full h-auto', className);
176
179
  /**
177
180
  * Render as a figure.
178
181
  */
@@ -184,9 +187,10 @@ var Image = function (_a) {
184
187
  */
185
188
  return jsxRuntime.jsx("img", { "data-testid": testID || id || "Image", onLoad: onLoad, src: src, alt: alt, title: title, className: classes });
186
189
  };
190
+ Image.displayName = 'Image';
187
191
 
188
192
  var Link = function (_a) {
189
- var href = _a.href, children = _a.children, onClick = _a.onClick, history = _a.history, target = _a.target, id = _a.id, testID = _a.testID;
193
+ var href = _a.href, children = _a.children, _b = _a.onClick, onClick = _b === void 0 ? function () { return console.log('Link clicked'); } : _b, history = _a.history, target = _a.target, id = _a.id, testID = _a.testID, className = _a.className;
190
194
  var handleClick = function (event) {
191
195
  if (onClick) {
192
196
  onClick(event);
@@ -200,15 +204,10 @@ var Link = function (_a) {
200
204
  history.push(href);
201
205
  }
202
206
  };
203
- var classes = cx('link');
204
- return (jsxRuntime.jsx("a", { "data-testid": testID || id || "Link", className: classes, href: href, onClick: handleClick, target: target, children: children }));
205
- };
206
- Link.defaultProps = {
207
- href: undefined,
208
- onClick: function () { return console.log('Link clicked'); },
209
- history: undefined,
210
- target: undefined,
207
+ var classes = cx('link', className);
208
+ return (jsxRuntime.jsx("a", { "data-testid": testID || id || 'Link', className: classes, href: href, onClick: handleClick, target: target, children: children }));
211
209
  };
210
+ Link.displayName = 'Link';
212
211
 
213
212
  var Variants;
214
213
  (function (Variants) {
@@ -229,56 +228,80 @@ var ListTag;
229
228
  })(ListTag || (ListTag = {}));
230
229
 
231
230
  var List = function (_a) {
232
- var variants = _a.variants, children = _a.children, as = _a.as, id = _a.id, testID = _a.testID;
233
- var modifiers = variants
234
- ? variants.map(function (el) { return "list--".concat(el); })
235
- : null;
231
+ var variants = _a.variants, children = _a.children, _b = _a.as, as = _b === void 0 ? ListTag.UL : _b, id = _a.id, testID = _a.testID, className = _a.className;
232
+ var modifiers = variants ? variants.map(function (el) { return "list--".concat(el); }) : null;
236
233
  var Tag = as;
237
- return jsxRuntime.jsx(Tag, { "data-testid": testID || id || "List", className: cx(modifiers), children: children });
238
- };
239
- List.defaultProps = {
240
- as: ListTag.UL,
234
+ return (jsxRuntime.jsx(Tag, { "data-testid": testID || id || 'List', className: cx(modifiers, className), children: children }));
241
235
  };
236
+ List.displayName = 'List';
242
237
 
243
238
  var ListItem = function (_a) {
244
- var children = _a.children, Tag = _a.as, id = _a.id, testID = _a.testID;
245
- return jsxRuntime.jsx(Tag, { "data-testid": testID || id || "ListItem", className: cx('list-item'), children: children });
246
- };
247
- ListItem.defaultProps = {
248
- as: 'li',
239
+ var children = _a.children, _b = _a.as, Tag = _b === void 0 ? 'li' : _b, id = _a.id, testID = _a.testID, className = _a.className;
240
+ return (jsxRuntime.jsx(Tag, { "data-testid": testID || id || 'ListItem', className: cx('list-item', className), children: children }));
249
241
  };
242
+ ListItem.displayName = 'ListItem';
250
243
 
251
244
  var Notice = function (_a) {
252
- var foo = _a.foo, id = _a.id, testID = _a.testID;
253
- return (jsxRuntime.jsx("div", { "data-testid": testID || id || "Notice", className: "foo-bar", children: foo }));
245
+ var _b = _a.foo, foo = _b === void 0 ? 'bar' : _b, id = _a.id, testID = _a.testID;
246
+ return (jsxRuntime.jsx("div", { "data-testid": testID || id || 'Notice', className: "foo-bar", children: foo }));
254
247
  };
248
+ Notice.displayName = 'Notice';
255
249
 
256
250
  var Loader = function (_a) {
257
- var size = _a.size;
251
+ var _b = _a.size, size = _b === void 0 ? 8 : _b;
258
252
  var sizeClass = size ? "w-".concat(size, " h-").concat(size) : 'w-8 h-8';
259
253
  return (jsxRuntime.jsx("div", { "data-testid": "Loader", children: jsxRuntime.jsxs("div", { role: "status", children: [jsxRuntime.jsxs("svg", { className: "animate-spin -ml-1 mr-3 ".concat(sizeClass, " text-white"), xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: [jsxRuntime.jsx("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), jsxRuntime.jsx("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })] }), jsxRuntime.jsx("span", { className: "sr-only", children: "Loading..." })] }) }));
260
254
  };
261
- Loader.defaultProps = {
262
- size: 8,
263
- };
255
+ Loader.displayName = 'Loader';
264
256
 
265
257
  var Container = function (_a) {
266
- var children = _a.children, className = _a.className, spacing = _a.spacing;
267
- var classes = cx('container', 'mx-auto', 'my-0', 'px-4', { 'py-40': spacing === 'feature' }, { 'py-24': spacing === 'component' }, { 'py-16': spacing === 'module' }, { 'py-10': spacing === 'element' }, { 'py-4': spacing === 'atom' }, { 'py-0': spacing === 'none' }, className);
258
+ var children = _a.children, className = _a.className, spacing = _a.spacing, padded = _a.padded;
259
+ var classes = cx('container', 'mx-auto', 'my-0', { 'px-4': padded }, { 'py-40': spacing === 'feature' }, { 'py-24': spacing === 'component' }, { 'py-16': spacing === 'module' }, { 'py-10': spacing === 'element' }, { 'py-4': spacing === 'atom' }, { 'py-0': spacing === 'none' }, className);
268
260
  return (jsxRuntime.jsx("div", { "data-testid": "Container", className: classes, children: children }));
269
261
  };
270
- Container.defaultProps = {};
262
+ Container.displayName = 'Container';
263
+
264
+ var SPACING;
265
+ (function (SPACING) {
266
+ SPACING["NONE"] = "none";
267
+ SPACING["ATOM"] = "atom";
268
+ SPACING["DEFAULT"] = "default";
269
+ SPACING["ELEMENT"] = "element";
270
+ SPACING["COMPONENT"] = "component";
271
+ SPACING["MODULE"] = "module";
272
+ SPACING["FEATURE"] = "feature";
273
+ })(SPACING || (SPACING = {}));
271
274
 
272
275
  var ContentPageLayout = function (_a) {
273
- var children = _a.children, spacing = _a.spacing, narrow = _a.narrow, flush = _a.flush, className = _a.className;
276
+ var _b = _a.spacing, spacing = _b === void 0 ? SPACING.DEFAULT : _b, children = _a.children, narrow = _a.narrow, flush = _a.flush, className = _a.className;
274
277
  var classes = cx('flex', 'flex-col', 'flex-1', 'relative', { 'py-40': spacing === 'feature' }, { 'py-24': spacing === 'component' }, { 'py-16': spacing === 'module' }, { 'py-10': spacing === 'element' }, { 'py-8': spacing === 'default' }, { 'py-4': spacing === 'atom' }, { 'py-0': spacing === 'none' }, { 'max-w-5xl': narrow }, { 'p-0': flush }, className);
275
278
  return (jsxRuntime.jsx("div", { "data-testid": "ContentPageLayout", className: classes, children: children }));
276
279
  };
280
+ ContentPageLayout.displayName = 'ContentPageLayout';
281
+
282
+ var SIZE;
283
+ (function (SIZE) {
284
+ SIZE["NONE"] = "none";
285
+ SIZE["ATOM"] = "atom";
286
+ SIZE["DEFAULT"] = "default";
287
+ SIZE["ELEMENT"] = "element";
288
+ SIZE["COMPONENT"] = "component";
289
+ SIZE["MODULE"] = "module";
290
+ SIZE["FEATURE"] = "feature";
291
+ })(SIZE || (SIZE = {}));
292
+
293
+ var ContentRowsLayout = function (_a) {
294
+ var className = _a.className, children = _a.children, _b = _a.size, size = _b === void 0 ? SIZE.DEFAULT : _b;
295
+ var classes = cx('grid', 'auto-rows-min', 'grid-cols-1', 'gap-x-4', { 'gap-y-0 mb-0': size === 'none' }, { 'gap-y-2 mb-2': size === 'atom' }, { 'gap-y-4 mb-4': size === 'default' }, { 'gap-y-8 mb-8': size === 'element' }, { 'gap-y-16 mb-16': size === 'module' }, { 'gap-y-24 mb-24': size === 'component' }, { 'gap-y-40 mb-40': size === 'feature' }, className);
296
+ return (jsxRuntime.jsx("div", { "data-testid": "ContentRowsLayout", className: classes, children: children }));
297
+ };
298
+ ContentRowsLayout.displayName = 'ContentRowsLayout';
277
299
 
278
300
  exports.Blockquote = Blockquote;
279
301
  exports.Button = Button;
280
302
  exports.Container = Container;
281
303
  exports.ContentPageLayout = ContentPageLayout;
304
+ exports.ContentRowsLayout = ContentRowsLayout;
282
305
  exports.Copy = Copy;
283
306
  exports.Heading = Heading;
284
307
  exports.Hr = Hr;
@@ -0,0 +1,7 @@
1
+ import { Props } from './Blockquote.types';
2
+ declare const Blockquote: {
3
+ ({ text, citation, className, citationAttribute, showIcon, }: Props): React.ReactElement;
4
+ displayName: string;
5
+ };
6
+ export default Blockquote;
7
+ export type { Props };
@@ -0,0 +1,6 @@
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+ import Blockquote from '.';
3
+ declare const meta: Meta<typeof Blockquote>;
4
+ type Story = StoryObj<typeof Blockquote>;
5
+ export declare const Default: Story;
6
+ export default meta;
@@ -0,0 +1,7 @@
1
+ export interface Props {
2
+ text: string | Array<string>;
3
+ className?: string;
4
+ citation?: string;
5
+ citationAttribute?: string;
6
+ showIcon?: boolean;
7
+ }
@@ -0,0 +1 @@
1
+ export { default } from './Blockquote';
@@ -0,0 +1,7 @@
1
+ import { Props } from './Button.types';
2
+ declare const Button: {
3
+ ({ variant, size, type, wide, rounded, raised, uppercase, children, id, disabled, ariaLabel, onClick, icon, external, iconFirst, outline, testID, className, }: Props): React.ReactElement;
4
+ displayName: string;
5
+ };
6
+ export default Button;
7
+ export type { Props };
@@ -0,0 +1,8 @@
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+ import Button from '.';
3
+ declare const meta: Meta<typeof Button>;
4
+ type Story = StoryObj<typeof Button>;
5
+ export declare const Default: Story;
6
+ export default meta;
7
+ export declare const WithIcon: Story;
8
+ export declare const IconOnly: Story;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,36 @@
1
+ import { MouseEventHandler } from 'react';
2
+ export declare enum BTN_TYPES {
3
+ SUBMIT = "submit",
4
+ RESET = "reset",
5
+ BUTTON = "button"
6
+ }
7
+ export declare enum BTN_VARIANTS {
8
+ PRIMARY = "primary",
9
+ SECONDARY = "secondary",
10
+ TERTIARY = "tertiary"
11
+ }
12
+ export declare enum BTN_SIZES {
13
+ SMALL = "small",
14
+ MEDIUM = "medium",
15
+ LARGE = "large"
16
+ }
17
+ export interface Props {
18
+ variant?: BTN_VARIANTS;
19
+ size: BTN_SIZES;
20
+ uppercase?: boolean;
21
+ children: React.ReactNode;
22
+ type?: BTN_TYPES;
23
+ disabled?: boolean;
24
+ ariaLabel: string;
25
+ onClick?: MouseEventHandler<HTMLButtonElement>;
26
+ icon?: string;
27
+ external?: boolean;
28
+ iconFirst?: boolean;
29
+ raised?: boolean;
30
+ outline?: boolean;
31
+ wide?: boolean;
32
+ rounded?: boolean;
33
+ id?: string;
34
+ testID?: string;
35
+ className?: string;
36
+ }
@@ -0,0 +1 @@
1
+ export { default } from './Button';
@@ -0,0 +1,7 @@
1
+ import { Props } from './Container.types';
2
+ declare const Container: {
3
+ ({ children, className, spacing, padded }: Props): React.ReactElement;
4
+ displayName: string;
5
+ };
6
+ export default Container;
7
+ export type { Props };
@@ -0,0 +1,6 @@
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+ import Container from '.';
3
+ declare const meta: Meta<typeof Container>;
4
+ type Story = StoryObj<typeof Container>;
5
+ export declare const Default: Story;
6
+ export default meta;
@@ -0,0 +1,7 @@
1
+ /// <reference types="react" />
2
+ export interface Props {
3
+ children: React.ReactNode;
4
+ className?: string;
5
+ spacing?: 'feature' | 'component' | 'module' | 'element' | 'atom' | 'none';
6
+ padded?: boolean;
7
+ }
@@ -0,0 +1 @@
1
+ export { default } from './Container';
@@ -0,0 +1,7 @@
1
+ import { Props } from './ContentPageLayout.types';
2
+ declare const ContentPageLayout: {
3
+ ({ spacing, children, narrow, flush, className, }: Props): React.ReactElement;
4
+ displayName: string;
5
+ };
6
+ export default ContentPageLayout;
7
+ export type { Props };
@@ -0,0 +1,6 @@
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+ import ContentPageLayout from '.';
3
+ declare const meta: Meta<typeof ContentPageLayout>;
4
+ type Story = StoryObj<typeof ContentPageLayout>;
5
+ export declare const Default: Story;
6
+ export default meta;
@@ -0,0 +1,17 @@
1
+ /// <reference types="react" />
2
+ export declare enum SPACING {
3
+ NONE = "none",
4
+ ATOM = "atom",
5
+ DEFAULT = "default",
6
+ ELEMENT = "element",
7
+ COMPONENT = "component",
8
+ MODULE = "module",
9
+ FEATURE = "feature"
10
+ }
11
+ export interface Props {
12
+ children: React.ReactNode;
13
+ narrow?: boolean;
14
+ flush?: boolean;
15
+ spacing?: SPACING;
16
+ className?: string;
17
+ }
@@ -0,0 +1 @@
1
+ export { default } from './ContentPageLayout';
@@ -0,0 +1,7 @@
1
+ import { Props } from './ContentRowsLayout.types';
2
+ declare const ContentRowsLayout: {
3
+ ({ className, children, size }: Props): React.ReactElement;
4
+ displayName: string;
5
+ };
6
+ export default ContentRowsLayout;
7
+ export type { Props };
@@ -0,0 +1,6 @@
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+ import ContentRowsLayout from '.';
3
+ declare const meta: Meta<typeof ContentRowsLayout>;
4
+ type Story = StoryObj<typeof ContentRowsLayout>;
5
+ export declare const Default: Story;
6
+ export default meta;
@@ -0,0 +1,15 @@
1
+ /// <reference types="react" />
2
+ export declare enum SIZE {
3
+ NONE = "none",
4
+ ATOM = "atom",
5
+ DEFAULT = "default",
6
+ ELEMENT = "element",
7
+ COMPONENT = "component",
8
+ MODULE = "module",
9
+ FEATURE = "feature"
10
+ }
11
+ export interface Props {
12
+ className?: string;
13
+ children: React.ReactNode;
14
+ size?: SIZE;
15
+ }
@@ -0,0 +1 @@
1
+ export { default } from './ContentRowsLayout';
@@ -0,0 +1,7 @@
1
+ import { Props } from './Copy.types';
2
+ declare const Copy: {
3
+ ({ children, as: Tag, size, align, transform, id, testID, }: Props): React.ReactElement;
4
+ displayName: string;
5
+ };
6
+ export default Copy;
7
+ export type { Props };
@@ -0,0 +1,6 @@
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+ import Copy from '.';
3
+ declare const meta: Meta<typeof Copy>;
4
+ type Story = StoryObj<typeof Copy>;
5
+ export declare const Default: Story;
6
+ export default meta;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,41 @@
1
+ /// <reference types="react" />
2
+ export declare enum ALIGN {
3
+ LEFT = "left",
4
+ CENTER = "center",
5
+ RIGHT = "right",
6
+ JUSTIFY = "justify",
7
+ NOWRAP = "nowrap"
8
+ }
9
+ export declare enum TRANSFORM {
10
+ LOWERCASE = "lowercase",
11
+ UPPERCASE = "uppercase",
12
+ CAPITALIZE = "capitalize",
13
+ NORMALCASE = "normal-case"
14
+ }
15
+ export declare enum CONTEXTUAL {
16
+ INVERTED = "inverted",
17
+ MUTED = "muted"
18
+ }
19
+ export declare enum SIZE {
20
+ SMALL = "small",
21
+ LARGE = "large",
22
+ INTRO = "intro"
23
+ }
24
+ export declare enum TAG {
25
+ P = "p",
26
+ SPAN = "span",
27
+ DIV = "div",
28
+ SMALL = "small"
29
+ }
30
+ export interface Props {
31
+ children: string | Array<React.ReactNode> | React.ReactNode;
32
+ align?: ALIGN;
33
+ size?: SIZE;
34
+ transform?: TRANSFORM;
35
+ contextual?: CONTEXTUAL;
36
+ inverted?: boolean;
37
+ maxLength?: boolean;
38
+ as: TAG;
39
+ id?: string;
40
+ testID?: string;
41
+ }
@@ -0,0 +1 @@
1
+ export { default } from './Copy';
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ import { Props } from './Form.types';
3
+ declare const Form: {
4
+ ({ children, className, noValidate, submit, onSubmit, hideSubmit, ariaSubmitLabel, submitID, }: Props): React.ReactElement;
5
+ displayName: string;
6
+ };
7
+ export default Form;
8
+ export type { Props };
@@ -0,0 +1,7 @@
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+ import Form from '.';
3
+ declare const meta: Meta<typeof Form>;
4
+ type Story = StoryObj<typeof Form>;
5
+ export declare const Default: Story;
6
+ export declare const Example: Story;
7
+ export default meta;
@@ -0,0 +1 @@
1
+ export {};