@kaizen/components 1.79.6 → 1.79.7

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 (96) hide show
  1. package/dist/cjs/alpha.cjs +4 -0
  2. package/dist/cjs/src/Button/Button/Button.cjs +5 -0
  3. package/dist/cjs/src/Button/IconButton/IconButton.cjs +5 -0
  4. package/dist/cjs/src/LikertScaleLegacy/LikertScaleLegacy.cjs +3 -0
  5. package/dist/cjs/src/Skirt/Skirt.cjs +3 -0
  6. package/dist/cjs/src/Skirt/subcomponents/SkirtCard/SkirtCard.cjs +4 -0
  7. package/dist/cjs/src/SplitButton/SplitButton.cjs +2 -0
  8. package/dist/cjs/src/TitleBlockZen/TitleBlockZen.cjs +3 -0
  9. package/dist/cjs/src/__alpha__/SingleSelect/SingleSelect.cjs +32 -0
  10. package/dist/cjs/src/__alpha__/SingleSelect/SingleSelect.module.css.cjs +6 -0
  11. package/dist/cjs/src/__alpha__/SingleSelect/subcomponents/List/List.cjs +24 -0
  12. package/dist/cjs/src/__alpha__/SingleSelect/subcomponents/List/List.module.css.cjs +6 -0
  13. package/dist/cjs/src/__alpha__/SingleSelect/subcomponents/ListItem/ListItem.cjs +24 -0
  14. package/dist/cjs/src/__alpha__/SingleSelect/subcomponents/ListItem/ListItem.module.css.cjs +6 -0
  15. package/dist/cjs/src/__alpha__/SingleSelect/subcomponents/ListSection/ListSection.cjs +25 -0
  16. package/dist/cjs/src/__alpha__/SingleSelect/subcomponents/ListSection/ListSection.module.css.cjs +6 -0
  17. package/dist/cjs/src/__alpha__/SingleSelect/subcomponents/Trigger/Trigger.cjs +21 -0
  18. package/dist/cjs/src/__alpha__/SingleSelect/subcomponents/Trigger/Trigger.module.css.cjs +6 -0
  19. package/dist/esm/alpha.mjs +1 -0
  20. package/dist/esm/src/Button/Button/Button.mjs +5 -0
  21. package/dist/esm/src/Button/IconButton/IconButton.mjs +5 -0
  22. package/dist/esm/src/LikertScaleLegacy/LikertScaleLegacy.mjs +3 -0
  23. package/dist/esm/src/Skirt/Skirt.mjs +3 -0
  24. package/dist/esm/src/Skirt/subcomponents/SkirtCard/SkirtCard.mjs +4 -0
  25. package/dist/esm/src/SplitButton/SplitButton.mjs +2 -0
  26. package/dist/esm/src/TitleBlockZen/TitleBlockZen.mjs +3 -0
  27. package/dist/esm/src/__alpha__/SingleSelect/SingleSelect.mjs +27 -0
  28. package/dist/esm/src/__alpha__/SingleSelect/SingleSelect.module.css.mjs +4 -0
  29. package/dist/esm/src/__alpha__/SingleSelect/subcomponents/List/List.mjs +18 -0
  30. package/dist/esm/src/__alpha__/SingleSelect/subcomponents/List/List.module.css.mjs +4 -0
  31. package/dist/esm/src/__alpha__/SingleSelect/subcomponents/ListItem/ListItem.mjs +18 -0
  32. package/dist/esm/src/__alpha__/SingleSelect/subcomponents/ListItem/ListItem.module.css.mjs +4 -0
  33. package/dist/esm/src/__alpha__/SingleSelect/subcomponents/ListSection/ListSection.mjs +19 -0
  34. package/dist/esm/src/__alpha__/SingleSelect/subcomponents/ListSection/ListSection.module.css.mjs +4 -0
  35. package/dist/esm/src/__alpha__/SingleSelect/subcomponents/Trigger/Trigger.mjs +13 -0
  36. package/dist/esm/src/__alpha__/SingleSelect/subcomponents/Trigger/Trigger.module.css.mjs +4 -0
  37. package/dist/styles.css +57 -0
  38. package/dist/types/Button/Button/Button.d.ts +5 -0
  39. package/dist/types/Button/IconButton/IconButton.d.ts +5 -0
  40. package/dist/types/LikertScaleLegacy/LikertScaleLegacy.d.ts +3 -0
  41. package/dist/types/Skirt/Skirt.d.ts +3 -0
  42. package/dist/types/Skirt/subcomponents/SkirtCard/SkirtCard.d.ts +3 -0
  43. package/dist/types/SplitButton/SplitButton.d.ts +2 -0
  44. package/dist/types/TitleBlockZen/TitleBlockZen.d.ts +3 -0
  45. package/dist/types/__alpha__/SingleSelect/SingleSelect.d.ts +23 -0
  46. package/dist/types/__alpha__/SingleSelect/_docs/mockData.d.ts +59 -0
  47. package/dist/types/__alpha__/SingleSelect/index.d.ts +1 -0
  48. package/dist/types/__alpha__/SingleSelect/subcomponents/List/List.d.ts +6 -0
  49. package/dist/types/__alpha__/SingleSelect/subcomponents/List/index.d.ts +1 -0
  50. package/dist/types/__alpha__/SingleSelect/subcomponents/ListItem/ListItem.d.ts +6 -0
  51. package/dist/types/__alpha__/SingleSelect/subcomponents/ListItem/index.d.ts +1 -0
  52. package/dist/types/__alpha__/SingleSelect/subcomponents/ListSection/ListSection.d.ts +8 -0
  53. package/dist/types/__alpha__/SingleSelect/subcomponents/ListSection/index.d.ts +1 -0
  54. package/dist/types/__alpha__/SingleSelect/subcomponents/Trigger/Trigger.d.ts +1 -0
  55. package/dist/types/__alpha__/SingleSelect/subcomponents/Trigger/index.d.ts +1 -0
  56. package/dist/types/__alpha__/SingleSelect/subcomponents/index.d.ts +4 -0
  57. package/dist/types/__alpha__/index.d.ts +1 -0
  58. package/package.json +1 -1
  59. package/src/Button/Button/Button.tsx +5 -0
  60. package/src/Button/IconButton/IconButton.tsx +5 -0
  61. package/src/LikertScaleLegacy/LikertScaleLegacy.tsx +3 -0
  62. package/src/LikertScaleLegacy/_docs/LikertScaleLegacy.mdx +3 -2
  63. package/src/LikertScaleLegacy/_docs/LikertScaleLegacy.stickersheet.stories.tsx +1 -1
  64. package/src/LikertScaleLegacy/_docs/LikertScaleLegacy.stories.tsx +1 -1
  65. package/src/Skirt/Skirt.tsx +4 -0
  66. package/src/Skirt/_docs/Skirt.mdx +3 -1
  67. package/src/Skirt/_docs/Skirt.stories.tsx +1 -1
  68. package/src/Skirt/subcomponents/SkirtCard/SkirtCard.tsx +4 -0
  69. package/src/SplitButton/SplitButton.tsx +2 -0
  70. package/src/SplitButton/_docs/SplitButton.mdx +3 -1
  71. package/src/SplitButton/_docs/SplitButton.stickersheet.stories.tsx +1 -1
  72. package/src/SplitButton/_docs/SplitButton.stories.tsx +1 -1
  73. package/src/TitleBlockZen/TitleBlockZen.tsx +3 -0
  74. package/src/TitleBlockZen/_docs/TitleBlockZen.mdx +3 -2
  75. package/src/__alpha__/SingleSelect/SingleSelect.module.css +9 -0
  76. package/src/__alpha__/SingleSelect/SingleSelect.spec.tsx +26 -0
  77. package/src/__alpha__/SingleSelect/SingleSelect.tsx +27 -0
  78. package/src/__alpha__/SingleSelect/_docs/SingleSelect.mdx +27 -0
  79. package/src/__alpha__/SingleSelect/_docs/SingleSelect.stickersheet.stories.tsx +83 -0
  80. package/src/__alpha__/SingleSelect/_docs/SingleSelect.stories.tsx +23 -0
  81. package/src/__alpha__/SingleSelect/_docs/mockData.ts +92 -0
  82. package/src/__alpha__/SingleSelect/index.ts +1 -0
  83. package/src/__alpha__/SingleSelect/subcomponents/List/List.module.css +7 -0
  84. package/src/__alpha__/SingleSelect/subcomponents/List/List.tsx +17 -0
  85. package/src/__alpha__/SingleSelect/subcomponents/List/index.ts +1 -0
  86. package/src/__alpha__/SingleSelect/subcomponents/ListItem/ListItem.module.css +9 -0
  87. package/src/__alpha__/SingleSelect/subcomponents/ListItem/ListItem.tsx +17 -0
  88. package/src/__alpha__/SingleSelect/subcomponents/ListItem/index.ts +1 -0
  89. package/src/__alpha__/SingleSelect/subcomponents/ListSection/ListSection.module.css +9 -0
  90. package/src/__alpha__/SingleSelect/subcomponents/ListSection/ListSection.tsx +23 -0
  91. package/src/__alpha__/SingleSelect/subcomponents/ListSection/index.ts +1 -0
  92. package/src/__alpha__/SingleSelect/subcomponents/Trigger/Trigger.module.css +18 -0
  93. package/src/__alpha__/SingleSelect/subcomponents/Trigger/Trigger.tsx +13 -0
  94. package/src/__alpha__/SingleSelect/subcomponents/Trigger/index.ts +1 -0
  95. package/src/__alpha__/SingleSelect/subcomponents/index.ts +4 -0
  96. package/src/__alpha__/index.ts +1 -0
@@ -0,0 +1,4 @@
1
+ 'use strict';
2
+
3
+ var SingleSelect = require('./src/__alpha__/SingleSelect/SingleSelect.cjs');
4
+ exports.SingleSelect = SingleSelect.SingleSelect;
@@ -11,6 +11,11 @@ function _interopDefault(e) {
11
11
  var React__default = /*#__PURE__*/_interopDefault(React);
12
12
 
13
13
  /**
14
+ * @deprecated This component will be replaced by the next Button component in v2.
15
+ * Use `@kaizen/components/next` Button instead.
16
+ * Migration guide: {@link https://cultureamp.design/?path=/docs/components-button-migration-guide--docs}
17
+ * Codemod available: `upgradeV1Buttons`
18
+ *
14
19
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3062890984/Button Guidance} |
15
20
  * {@link https://cultureamp.design/?path=/docs/components-buttons-button--docs Storybook}
16
21
  */
@@ -11,6 +11,11 @@ function _interopDefault(e) {
11
11
  var React__default = /*#__PURE__*/_interopDefault(React);
12
12
 
13
13
  /**
14
+ * @deprecated This component will be replaced by the next Button component in v2.
15
+ * Use `@kaizen/components/next` Button instead.
16
+ * Migration guide: {@link https://cultureamp.design/?path=/docs/components-button-migration-guide--docs}
17
+ * Codemod available: `upgradeV1Buttons`
18
+ *
14
19
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3062890984/Button Guidance} |
15
20
  * {@link https://cultureamp.design/?path=/docs/components-iconbutton--docs Storybook}
16
21
  */
@@ -22,6 +22,9 @@ var SelectedItemIcon = function () {
22
22
  });
23
23
  };
24
24
  /**
25
+ * @deprecated This component will be renamed to LikertScale in v2.
26
+ * Start importing as LikertScale instead.
27
+ *
25
28
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082060201/Likert+Scale Guidance} |
26
29
  * {@link https://cultureamp.design/?path=/docs/components-likertscalelegacy--docs Storybook}
27
30
  */
@@ -17,6 +17,9 @@ var classnames__default = /*#__PURE__*/_interopDefault(classnames);
17
17
  var spacing = 24;
18
18
  var maxHeight = 222;
19
19
  var fallbackPercentage = 0.8;
20
+ /**
21
+ * @deprecated This component will be removed in v2. Please remove any usages.
22
+ */
20
23
  var Skirt = function (_a) {
21
24
  var children = _a.children,
22
25
  _b = _a.variant,
@@ -12,6 +12,10 @@ function _interopDefault(e) {
12
12
  }
13
13
  var React__default = /*#__PURE__*/_interopDefault(React);
14
14
  var classnames__default = /*#__PURE__*/_interopDefault(classnames);
15
+
16
+ /**
17
+ * @deprecated This component will be removed in v2. Use a regular Card component instead.
18
+ */
15
19
  var SkirtCard = function (props) {
16
20
  var classNameOverride = props.classNameOverride,
17
21
  restProps = tslib.__rest(props, ["classNameOverride"]);
@@ -16,6 +16,8 @@ var React__default = /*#__PURE__*/_interopDefault(React);
16
16
  var classnames__default = /*#__PURE__*/_interopDefault(classnames);
17
17
 
18
18
  /**
19
+ * @deprecated This component will be removed in v2. Use a Button and Menu component instead.
20
+ *
19
21
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896196/Split+Button Guidance} |
20
22
  * {@link https://cultureamp.design/storybook/?path=/docs/components-splitbutton--docs Storybook}
21
23
  */
@@ -168,6 +168,9 @@ var renderNavigationTabs = function (navigationTabs, collapse, ariaLabel) {
168
168
  }))));
169
169
  };
170
170
  /**
171
+ * @deprecated This component will be renamed to TitleBlock in v2.
172
+ * Start importing as TitleBlock instead.
173
+ *
171
174
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3075605782/Title+Block Guidance} |
172
175
  * {@link https://cultureamp.design/?path=/story/components-titleblock--docs Storybook}
173
176
  */
@@ -0,0 +1,32 @@
1
+ 'use strict';
2
+
3
+ var tslib = require('tslib');
4
+ var React = require('react');
5
+ var reactAriaComponents = require('react-aria-components');
6
+ var List = require('./subcomponents/List/List.cjs');
7
+ var ListSection = require('./subcomponents/ListSection/ListSection.cjs');
8
+ var ListItem = require('./subcomponents/ListItem/ListItem.cjs');
9
+ var Trigger = require('./subcomponents/Trigger/Trigger.cjs');
10
+ var SingleSelect_module = require('./SingleSelect.module.css.cjs');
11
+ function _interopDefault(e) {
12
+ return e && e.__esModule ? e : {
13
+ default: e
14
+ };
15
+ }
16
+ var React__default = /*#__PURE__*/_interopDefault(React);
17
+ var SingleSelect = function (_a) {
18
+ var classNameOverride = _a.classNameOverride,
19
+ children = _a.children,
20
+ restProps = tslib.__rest(_a, ["classNameOverride", "children"]);
21
+ return React__default.default.createElement(reactAriaComponents.Select, tslib.__assign({
22
+ className: classNameOverride,
23
+ placeholder: ""
24
+ }, restProps), React__default.default.createElement(Trigger.Trigger, null), React__default.default.createElement(reactAriaComponents.Popover, {
25
+ className: SingleSelect_module.popover
26
+ }, children));
27
+ };
28
+ SingleSelect.displayName = 'SingleSelect';
29
+ SingleSelect.List = List.List;
30
+ SingleSelect.ListItem = ListItem.ListItem;
31
+ SingleSelect.ListSection = ListSection.ListSection;
32
+ exports.SingleSelect = SingleSelect;
@@ -0,0 +1,6 @@
1
+ 'use strict';
2
+
3
+ var styles = {
4
+ "popover": "SingleSelect-module_popover__ZjL9n"
5
+ };
6
+ module.exports = styles;
@@ -0,0 +1,24 @@
1
+ 'use strict';
2
+
3
+ var tslib = require('tslib');
4
+ var React = require('react');
5
+ var classnames = require('classnames');
6
+ var reactAriaComponents = require('react-aria-components');
7
+ var List_module = require('./List.module.css.cjs');
8
+ function _interopDefault(e) {
9
+ return e && e.__esModule ? e : {
10
+ default: e
11
+ };
12
+ }
13
+ var React__default = /*#__PURE__*/_interopDefault(React);
14
+ var classnames__default = /*#__PURE__*/_interopDefault(classnames);
15
+ var List = function (_a) {
16
+ var children = _a.children,
17
+ className = _a.className,
18
+ props = tslib.__rest(_a, ["children", "className"]);
19
+ return React__default.default.createElement(reactAriaComponents.ListBox, tslib.__assign({
20
+ className: classnames__default.default(List_module.list, className)
21
+ }, props), children);
22
+ };
23
+ List.displayName = 'SingleSelect.List';
24
+ exports.List = List;
@@ -0,0 +1,6 @@
1
+ 'use strict';
2
+
3
+ var styles = {
4
+ "list": "List-module_list__bbFPn"
5
+ };
6
+ module.exports = styles;
@@ -0,0 +1,24 @@
1
+ 'use strict';
2
+
3
+ var tslib = require('tslib');
4
+ var React = require('react');
5
+ var classnames = require('classnames');
6
+ var reactAriaComponents = require('react-aria-components');
7
+ var ListItem_module = require('./ListItem.module.css.cjs');
8
+ function _interopDefault(e) {
9
+ return e && e.__esModule ? e : {
10
+ default: e
11
+ };
12
+ }
13
+ var React__default = /*#__PURE__*/_interopDefault(React);
14
+ var classnames__default = /*#__PURE__*/_interopDefault(classnames);
15
+ var ListItem = function (_a) {
16
+ var children = _a.children,
17
+ className = _a.className,
18
+ props = tslib.__rest(_a, ["children", "className"]);
19
+ return React__default.default.createElement(reactAriaComponents.ListBoxItem, tslib.__assign({
20
+ className: classnames__default.default(ListItem_module.listItem, className)
21
+ }, props), children);
22
+ };
23
+ ListItem.displayName = 'SingleSelect.ListItem';
24
+ exports.ListItem = ListItem;
@@ -0,0 +1,6 @@
1
+ 'use strict';
2
+
3
+ var styles = {
4
+ "listItem": "ListItem-module_listItem__xGr6A"
5
+ };
6
+ module.exports = styles;
@@ -0,0 +1,25 @@
1
+ 'use strict';
2
+
3
+ var tslib = require('tslib');
4
+ var React = require('react');
5
+ var classnames = require('classnames');
6
+ var reactAriaComponents = require('react-aria-components');
7
+ var ListSection_module = require('./ListSection.module.css.cjs');
8
+ function _interopDefault(e) {
9
+ return e && e.__esModule ? e : {
10
+ default: e
11
+ };
12
+ }
13
+ var React__default = /*#__PURE__*/_interopDefault(React);
14
+ var classnames__default = /*#__PURE__*/_interopDefault(classnames);
15
+ var ListSection = function (_a) {
16
+ var name = _a.name,
17
+ className = _a.className,
18
+ children = _a.children,
19
+ props = tslib.__rest(_a, ["name", "className", "children"]);
20
+ return React__default.default.createElement(reactAriaComponents.ListBoxSection, tslib.__assign({}, props), React__default.default.createElement(reactAriaComponents.Header, {
21
+ className: classnames__default.default(ListSection_module.listSectionHeader, className)
22
+ }, name), children);
23
+ };
24
+ ListSection.displayName = 'SingleSelect.ListSection';
25
+ exports.ListSection = ListSection;
@@ -0,0 +1,6 @@
1
+ 'use strict';
2
+
3
+ var styles = {
4
+ "listSectionHeader": "ListSection-module_listSectionHeader__bptHg"
5
+ };
6
+ module.exports = styles;
@@ -0,0 +1,21 @@
1
+ 'use strict';
2
+
3
+ var React = require('react');
4
+ var reactAriaComponents = require('react-aria-components');
5
+ var Icon = require('../../../../__next__/Icon/Icon.cjs');
6
+ var Trigger_module = require('./Trigger.module.css.cjs');
7
+ function _interopDefault(e) {
8
+ return e && e.__esModule ? e : {
9
+ default: e
10
+ };
11
+ }
12
+ var React__default = /*#__PURE__*/_interopDefault(React);
13
+ var Trigger = function () {
14
+ return React__default.default.createElement(reactAriaComponents.Button, {
15
+ className: Trigger_module.button
16
+ }, React__default.default.createElement(reactAriaComponents.SelectValue, null), React__default.default.createElement(Icon.Icon, {
17
+ name: "keyboard_arrow_down",
18
+ isPresentational: true
19
+ }));
20
+ };
21
+ exports.Trigger = Trigger;
@@ -0,0 +1,6 @@
1
+ 'use strict';
2
+
3
+ var styles = {
4
+ "button": "Trigger-module_button__giSqA"
5
+ };
6
+ module.exports = styles;
@@ -0,0 +1 @@
1
+ export { SingleSelect } from './src/__alpha__/SingleSelect/SingleSelect.mjs';
@@ -3,6 +3,11 @@ import React, { forwardRef } from 'react';
3
3
  import { GenericButton } from '../GenericButton/GenericButton.mjs';
4
4
 
5
5
  /**
6
+ * @deprecated This component will be replaced by the next Button component in v2.
7
+ * Use `@kaizen/components/next` Button instead.
8
+ * Migration guide: {@link https://cultureamp.design/?path=/docs/components-button-migration-guide--docs}
9
+ * Codemod available: `upgradeV1Buttons`
10
+ *
6
11
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3062890984/Button Guidance} |
7
12
  * {@link https://cultureamp.design/?path=/docs/components-buttons-button--docs Storybook}
8
13
  */
@@ -3,6 +3,11 @@ import React, { forwardRef } from 'react';
3
3
  import { GenericButton } from '../GenericButton/GenericButton.mjs';
4
4
 
5
5
  /**
6
+ * @deprecated This component will be replaced by the next Button component in v2.
7
+ * Use `@kaizen/components/next` Button instead.
8
+ * Migration guide: {@link https://cultureamp.design/?path=/docs/components-button-migration-guide--docs}
9
+ * Codemod available: `upgradeV1Buttons`
10
+ *
6
11
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3062890984/Button Guidance} |
7
12
  * {@link https://cultureamp.design/?path=/docs/components-iconbutton--docs Storybook}
8
13
  */
@@ -13,6 +13,9 @@ var SelectedItemIcon = function () {
13
13
  });
14
14
  };
15
15
  /**
16
+ * @deprecated This component will be renamed to LikertScale in v2.
17
+ * Start importing as LikertScale instead.
18
+ *
16
19
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082060201/Likert+Scale Guidance} |
17
20
  * {@link https://cultureamp.design/?path=/docs/components-likertscalelegacy--docs Storybook}
18
21
  */
@@ -8,6 +8,9 @@ import styles from './Skirt.module.scss.mjs';
8
8
  var spacing = 24;
9
9
  var maxHeight = 222;
10
10
  var fallbackPercentage = 0.8;
11
+ /**
12
+ * @deprecated This component will be removed in v2. Please remove any usages.
13
+ */
11
14
  const Skirt = /*#__PURE__*/function () {
12
15
  const Skirt = function (_a) {
13
16
  var children = _a.children,
@@ -3,6 +3,10 @@ import React from 'react';
3
3
  import classnames from 'classnames';
4
4
  import { Card } from '../../../Card/Card.mjs';
5
5
  import styles from './SkirtCard.module.scss.mjs';
6
+
7
+ /**
8
+ * @deprecated This component will be removed in v2. Use a regular Card component instead.
9
+ */
6
10
  const SkirtCard = /*#__PURE__*/function () {
7
11
  const SkirtCard = function (props) {
8
12
  var classNameOverride = props.classNameOverride,
@@ -7,6 +7,8 @@ import { DropdownButton } from './subcomponents/DropdownButton/DropdownButton.mj
7
7
  import styles from './SplitButton.module.scss.mjs';
8
8
 
9
9
  /**
10
+ * @deprecated This component will be removed in v2. Use a Button and Menu component instead.
11
+ *
10
12
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896196/Split+Button Guidance} |
11
13
  * {@link https://cultureamp.design/storybook/?path=/docs/components-splitbutton--docs Storybook}
12
14
  */
@@ -159,6 +159,9 @@ var renderNavigationTabs = function (navigationTabs, collapse, ariaLabel) {
159
159
  })))));
160
160
  };
161
161
  /**
162
+ * @deprecated This component will be renamed to TitleBlock in v2.
163
+ * Start importing as TitleBlock instead.
164
+ *
162
165
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3075605782/Title+Block Guidance} |
163
166
  * {@link https://cultureamp.design/?path=/story/components-titleblock--docs Storybook}
164
167
  */
@@ -0,0 +1,27 @@
1
+ import { __rest, __assign } from 'tslib';
2
+ import React from 'react';
3
+ import { Select, Popover } from 'react-aria-components';
4
+ import { List } from './subcomponents/List/List.mjs';
5
+ import { ListSection } from './subcomponents/ListSection/ListSection.mjs';
6
+ import { ListItem } from './subcomponents/ListItem/ListItem.mjs';
7
+ import { Trigger } from './subcomponents/Trigger/Trigger.mjs';
8
+ import styles from './SingleSelect.module.css.mjs';
9
+ const SingleSelect = /*#__PURE__*/function () {
10
+ const SingleSelect = function (_a) {
11
+ var classNameOverride = _a.classNameOverride,
12
+ children = _a.children,
13
+ restProps = __rest(_a, ["classNameOverride", "children"]);
14
+ return /*#__PURE__*/React.createElement(Select, __assign({
15
+ className: classNameOverride,
16
+ placeholder: ""
17
+ }, restProps), /*#__PURE__*/React.createElement(Trigger, null), /*#__PURE__*/React.createElement(Popover, {
18
+ className: styles.popover
19
+ }, children));
20
+ };
21
+ SingleSelect.displayName = 'SingleSelect';
22
+ SingleSelect.List = List;
23
+ SingleSelect.ListItem = ListItem;
24
+ SingleSelect.ListSection = ListSection;
25
+ return SingleSelect;
26
+ }();
27
+ export { SingleSelect };
@@ -0,0 +1,4 @@
1
+ var styles = {
2
+ "popover": "SingleSelect-module_popover__ZjL9n"
3
+ };
4
+ export { styles as default };
@@ -0,0 +1,18 @@
1
+ import { __rest, __assign } from 'tslib';
2
+ import React from 'react';
3
+ import classnames from 'classnames';
4
+ import { ListBox } from 'react-aria-components';
5
+ import styles from './List.module.css.mjs';
6
+ const List = /*#__PURE__*/function () {
7
+ const List = function (_a) {
8
+ var children = _a.children,
9
+ className = _a.className,
10
+ props = __rest(_a, ["children", "className"]);
11
+ return /*#__PURE__*/React.createElement(ListBox, __assign({
12
+ className: classnames(styles.list, className)
13
+ }, props), children);
14
+ };
15
+ List.displayName = 'SingleSelect.List';
16
+ return List;
17
+ }();
18
+ export { List };
@@ -0,0 +1,4 @@
1
+ var styles = {
2
+ "list": "List-module_list__bbFPn"
3
+ };
4
+ export { styles as default };
@@ -0,0 +1,18 @@
1
+ import { __rest, __assign } from 'tslib';
2
+ import React from 'react';
3
+ import classnames from 'classnames';
4
+ import { ListBoxItem } from 'react-aria-components';
5
+ import styles from './ListItem.module.css.mjs';
6
+ const ListItem = /*#__PURE__*/function () {
7
+ const ListItem = function (_a) {
8
+ var children = _a.children,
9
+ className = _a.className,
10
+ props = __rest(_a, ["children", "className"]);
11
+ return /*#__PURE__*/React.createElement(ListBoxItem, __assign({
12
+ className: classnames(styles.listItem, className)
13
+ }, props), children);
14
+ };
15
+ ListItem.displayName = 'SingleSelect.ListItem';
16
+ return ListItem;
17
+ }();
18
+ export { ListItem };
@@ -0,0 +1,4 @@
1
+ var styles = {
2
+ "listItem": "ListItem-module_listItem__xGr6A"
3
+ };
4
+ export { styles as default };
@@ -0,0 +1,19 @@
1
+ import { __rest, __assign } from 'tslib';
2
+ import React from 'react';
3
+ import classnames from 'classnames';
4
+ import { ListBoxSection, Header } from 'react-aria-components';
5
+ import styles from './ListSection.module.css.mjs';
6
+ const ListSection = /*#__PURE__*/function () {
7
+ const ListSection = function (_a) {
8
+ var name = _a.name,
9
+ className = _a.className,
10
+ children = _a.children,
11
+ props = __rest(_a, ["name", "className", "children"]);
12
+ return /*#__PURE__*/React.createElement(ListBoxSection, __assign({}, props), /*#__PURE__*/React.createElement(Header, {
13
+ className: classnames(styles.listSectionHeader, className)
14
+ }, name), children);
15
+ };
16
+ ListSection.displayName = 'SingleSelect.ListSection';
17
+ return ListSection;
18
+ }();
19
+ export { ListSection };
@@ -0,0 +1,4 @@
1
+ var styles = {
2
+ "listSectionHeader": "ListSection-module_listSectionHeader__bptHg"
3
+ };
4
+ export { styles as default };
@@ -0,0 +1,13 @@
1
+ import React from 'react';
2
+ import { Button, SelectValue } from 'react-aria-components';
3
+ import { Icon } from '../../../../__next__/Icon/Icon.mjs';
4
+ import styles from './Trigger.module.css.mjs';
5
+ var Trigger = function () {
6
+ return /*#__PURE__*/React.createElement(Button, {
7
+ className: styles.button
8
+ }, /*#__PURE__*/React.createElement(SelectValue, null), /*#__PURE__*/React.createElement(Icon, {
9
+ name: "keyboard_arrow_down",
10
+ isPresentational: true
11
+ }));
12
+ };
13
+ export { Trigger };
@@ -0,0 +1,4 @@
1
+ var styles = {
2
+ "button": "Trigger-module_button__giSqA"
3
+ };
4
+ export { styles as default };
package/dist/styles.css CHANGED
@@ -1,4 +1,61 @@
1
1
  @layer tokens, normalize, reset, kz-components;@layer tokens{:root{--theme-key:heart;--animation-easing-function-ease-in-out:cubic-bezier(0.455,0.03,0.515,0.955);--animation-easing-function-ease-in:cubic-bezier(0.55,0.085,0.68,0.53);--animation-easing-function-ease-out:cubic-bezier(0.25,0.46,0.45,0.94);--animation-easing-function-linear:linear;--animation-easing-function-bounce-in:cubic-bezier(0.485,0.155,0.24,1.245);--animation-easing-function-bounce-out:cubic-bezier(0.485,0.155,0.515,0.845);--animation-easing-function-bounce-in-out:cubic-bezier(0.76,-0.245,0.24,1.245);--animation-duration-instant:0ms;--animation-duration-immediate:100ms;--animation-duration-rapid:200ms;--animation-duration-fast:300ms;--animation-duration-slow:400ms;--animation-duration-deliberate:700ms;--border-solid-border-width:2px;--border-solid-border-radius:7px;--border-solid-border-style:solid;--border-solid-border-color:#e1e2ea;--border-solid-border-color-rgb:225,226,234;--border-dashed-border-width:2px;--border-dashed-border-radius:7px;--border-dashed-border-style:dashed;--border-borderless-border-width:2px;--border-borderless-border-radius:7px;--border-borderless-border-style:solid;--border-borderless-border-color:transparent;--border-borderless-border-color-rgb:0,0,0;--border-focus-ring-border-width:2px;--border-focus-ring-border-radius:10px;--border-focus-ring-border-style:solid;--border-width-1:1px;--color-purple-100:#f4edf8;--color-purple-100-rgb:244,237,248;--color-purple-200:#dfc9ea;--color-purple-200-rgb:223,201,234;--color-purple-300:#c9a5dd;--color-purple-300-rgb:201,165,221;--color-purple-400:#ae67b1;--color-purple-400-rgb:174,103,177;--color-purple-500:#844587;--color-purple-500-rgb:132,69,135;--color-purple-600:#5f3361;--color-purple-600-rgb:95,51,97;--color-purple-700:#4a234d;--color-purple-700-rgb:74,35,77;--color-purple-800:#2f2438;--color-purple-800-rgb:47,36,56;--color-blue-100:#e6f6ff;--color-blue-100-rgb:230,246,255;--color-blue-200:#bde2f5;--color-blue-200-rgb:189,226,245;--color-blue-300:#73c0e8;--color-blue-300-rgb:115,192,232;--color-blue-400:#008bd6;--color-blue-400-rgb:0,139,214;--color-blue-500:#0168b3;--color-blue-500-rgb:1,104,179;--color-blue-600:#004970;--color-blue-600-rgb:0,73,112;--color-blue-700:#003157;--color-blue-700-rgb:0,49,87;--color-green-100:#e8f8f4;--color-green-100-rgb:232,248,244;--color-green-200:#c4ede2;--color-green-200-rgb:196,237,226;--color-green-300:#8fdbc7;--color-green-300-rgb:143,219,199;--color-green-400:#5dcaad;--color-green-400-rgb:93,202,173;--color-green-500:#3f9a86;--color-green-500-rgb:63,154,134;--color-green-600:#2c7d67;--color-green-600-rgb:44,125,103;--color-green-700:#22594a;--color-green-700-rgb:34,89,74;--color-yellow-100:#fff9e4;--color-yellow-100-rgb:255,249,228;--color-yellow-200:#ffeeb3;--color-yellow-200-rgb:255,238,179;--color-yellow-300:#ffe36e;--color-yellow-300-rgb:255,227,110;--color-yellow-400:#ffca4d;--color-yellow-400-rgb:255,202,77;--color-yellow-500:#ffb600;--color-yellow-500-rgb:255,182,0;--color-yellow-600:#c68600;--color-yellow-600-rgb:198,134,0;--color-yellow-700:#876400;--color-yellow-700-rgb:135,100,0;--color-red-100:#fdeaee;--color-red-100-rgb:253,234,238;--color-red-200:#f9c2cb;--color-red-200-rgb:249,194,203;--color-red-300:#f597a8;--color-red-300-rgb:245,151,168;--color-red-400:#e0707d;--color-red-400-rgb:224,112,125;--color-red-500:#c93b55;--color-red-500-rgb:201,59,85;--color-red-600:#a82433;--color-red-600-rgb:168,36,51;--color-red-700:#6c1e20;--color-red-700-rgb:108,30,32;--color-orange-100:#fff0e8;--color-orange-100-rgb:255,240,232;--color-orange-200:#ffd1b9;--color-orange-200-rgb:255,209,185;--color-orange-300:#ffb08a;--color-orange-300-rgb:255,176,138;--color-orange-400:#ff9461;--color-orange-400-rgb:255,148,97;--color-orange-500:#e96c2f;--color-orange-500-rgb:233,108,47;--color-orange-600:#b74302;--color-orange-600-rgb:183,67,2;--color-orange-700:#903c00;--color-orange-700-rgb:144,60,0;--color-gray-100:#f9f9f9;--color-gray-100-rgb:249,249,249;--color-gray-200:#f4f4f5;--color-gray-200-rgb:244,244,245;--color-gray-300:#eaeaec;--color-gray-300-rgb:234,234,236;--color-gray-400:#cdcdd0;--color-gray-400-rgb:205,205,208;--color-gray-500:#878792;--color-gray-500-rgb:135,135,146;--color-gray-600:#524e56;--color-gray-600-rgb:82,78,86;--color-white:#fff;--color-white-rgb:255,255,255;--color-black:#000;--color-black-rgb:0,0,0;--data-viz-favorable:#7dd5bd;--data-viz-favorable-rgb:125,213,189;--data-viz-unfavorable:#e68d97;--data-viz-unfavorable-rgb:230,141,151;--layout-content-max-width:1392px;--layout-content-max-width-with-sidebar:1080px;--layout-content-side-margin:72px;--layout-mobile-actions-drawer-height:60px;--layout-navigation-bar-height:72px;--layout-breakpoints-medium:768px;--layout-breakpoints-large:1080px;--shadow-small-box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 3px 16px 0 rgba(0,0,0,.06);--shadow-large-box-shadow:0 3px 9px 0 rgba(0,0,0,.1),0 8px 40px 0 rgba(0,0,0,.08);--spacing-0:0;--spacing-1:.0625rem;--spacing-2:.125rem;--spacing-4:.25rem;--spacing-6:.375rem;--spacing-8:.5rem;--spacing-12:.75rem;--spacing-16:1rem;--spacing-20:1.25rem;--spacing-24:1.5rem;--spacing-32:2rem;--spacing-40:2.5rem;--spacing-48:3rem;--spacing-56:3.5rem;--spacing-64:4rem;--spacing-72:4.5rem;--spacing-80:5rem;--spacing-96:6rem;--spacing-112:7rem;--spacing-128:8rem;--spacing-160:10rem;--spacing-200:12.5rem;--spacing-240:15rem;--spacing-280:17.5rem;--spacing-320:20rem;--spacing-xs:0.375rem;--spacing-sm:0.75rem;--spacing-md:1.5rem;--spacing-lg:2.25rem;--spacing-xl:3rem;--spacing-xxl:3.75rem;--spacing-xxxl:4.5rem;--spacing-xxxxl:5.25rem;--spacing-xxxxxl:6rem;--typography-data-large-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-data-large-font-weight:700;--typography-data-large-font-size:5.25rem;--typography-data-large-line-height:5.25rem;--typography-data-large-letter-spacing:normal;--typography-data-large-units-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-data-large-units-font-weight:700;--typography-data-large-units-font-size:2.625rem;--typography-data-large-units-line-height:5.25rem;--typography-data-large-units-letter-spacing:normal;--typography-data-medium-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-data-medium-font-weight:700;--typography-data-medium-font-size:3rem;--typography-data-medium-line-height:5rem;--typography-data-medium-letter-spacing:normal;--typography-data-medium-units-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-data-medium-units-font-weight:700;--typography-data-medium-units-font-size:1.5rem;--typography-data-medium-units-line-height:5rem;--typography-data-medium-units-letter-spacing:normal;--typography-data-small-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-data-small-font-weight:700;--typography-data-small-font-size:1.5rem;--typography-data-small-line-height:1.5rem;--typography-data-small-letter-spacing:normal;--typography-data-small-units-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-data-small-units-font-weight:700;--typography-data-small-units-font-size:1.125rem;--typography-data-small-units-line-height:1.5rem;--typography-data-small-units-letter-spacing:normal;--typography-display-0-font-family:"Tiempos Headline",Georgia,serif;--typography-display-0-font-weight:800;--typography-display-0-font-size:4.5rem;--typography-display-0-line-height:5.25rem;--typography-display-0-letter-spacing:0em;--typography-heading-1-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-heading-1-font-weight:500;--typography-heading-1-font-size:2.125rem;--typography-heading-1-line-height:2.625rem;--typography-heading-1-letter-spacing:normal;--typography-heading-2-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-heading-2-font-weight:600;--typography-heading-2-font-size:1.75rem;--typography-heading-2-line-height:2.25rem;--typography-heading-2-letter-spacing:normal;--typography-heading-3-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-heading-3-font-weight:600;--typography-heading-3-font-size:1.375rem;--typography-heading-3-line-height:1.875rem;--typography-heading-3-letter-spacing:normal;--typography-heading-4-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-heading-4-font-weight:600;--typography-heading-4-font-size:1.125rem;--typography-heading-4-line-height:1.5rem;--typography-heading-4-letter-spacing:normal;--typography-heading-5-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-heading-5-font-weight:600;--typography-heading-5-font-size:1rem;--typography-heading-5-line-height:1.5rem;--typography-heading-5-letter-spacing:normal;--typography-heading-6-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-heading-6-font-weight:600;--typography-heading-6-font-size:0.875rem;--typography-heading-6-line-height:1.5rem;--typography-heading-6-letter-spacing:normal;--typography-paragraph-intro-lede-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-paragraph-intro-lede-font-weight:400;--typography-paragraph-intro-lede-font-size:1.25rem;--typography-paragraph-intro-lede-line-height:1.875rem;--typography-paragraph-intro-lede-letter-spacing:0;--typography-paragraph-intro-lede-max-width:975px;--typography-paragraph-body-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-paragraph-body-font-weight:400;--typography-paragraph-body-font-size:1rem;--typography-paragraph-body-line-height:1.5rem;--typography-paragraph-body-letter-spacing:normal;--typography-paragraph-body-max-width:780px;--typography-paragraph-small-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-paragraph-small-font-weight:400;--typography-paragraph-small-font-size:0.875rem;--typography-paragraph-small-line-height:1.125rem;--typography-paragraph-small-letter-spacing:normal;--typography-paragraph-small-max-width:680px;--typography-paragraph-extra-small-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-paragraph-extra-small-font-weight:400;--typography-paragraph-extra-small-font-size:0.75rem;--typography-paragraph-extra-small-line-height:1.125rem;--typography-paragraph-extra-small-letter-spacing:normal;--typography-paragraph-extra-small-max-width:600px;--typography-paragraph-bold-font-weight:600;--typography-button-primary-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-button-primary-font-weight:500;--typography-button-primary-font-size:1.125rem;--typography-button-primary-line-height:1.5rem;--typography-button-primary-letter-spacing:normal;--typography-button-secondary-font-family:"Inter","Noto Sans",Helvetica,Arial,sans-serif;--typography-button-secondary-font-weight:500;--typography-button-secondary-font-size:1rem;--typography-button-secondary-line-height:1.5rem;--typography-button-secondary-letter-spacing:normal}}@layer normalize{html{text-size-adjust:100%;line-height:1.15}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{appearance:auto}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{appearance:none}::-webkit-file-upload-button{appearance:auto;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}}@layer reset{@font-face{font-family:Tiempos Headline;font-weight:800;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/tiempos/tiempos-headline-bold.woff2),url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/tiempos/tiempos-headline-bold.woff)}@font-face{font-family:Tiempos Headline;font-weight:500;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/tiempos/tiempos-headline-medium.woff2),url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/tiempos/tiempos-headline-medium.woff)}@font-face{font-family:Greycliff CF;font-weight:300;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/greycliff/greycliff-cf-light.woff) format("woff")}@font-face{font-family:Greycliff CF;font-weight:400;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/greycliff/greycliff-cf-regular.woff) format("woff")}@font-face{font-family:Greycliff CF;font-weight:500;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/greycliff/greycliff-cf-medium.woff) format("woff")}@font-face{font-family:Greycliff CF;font-weight:600;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/greycliff/greycliff-cf-demi-bold.woff) format("woff")}@font-face{font-family:Greycliff CF;font-weight:700;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/greycliff/greycliff-cf-bold.woff) format("woff")}@font-face{font-family:Greycliff CF;font-weight:800;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/greycliff/greycliff-cf-extra-bold.woff) format("woff")}@font-face{font-family:Inter;font-weight:300;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-light.woff2),url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-light.woff)}@font-face{font-family:Inter;font-weight:400;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-regular.woff2),url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-regular.woff)}@font-face{font-family:Inter;font-weight:500;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-medium.woff2),url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-medium.woff)}@font-face{font-family:Inter;font-weight:600;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-demi-bold.woff2),url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-demi-bold.woff)}@font-face{font-family:Inter;font-weight:700;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-bold.woff2),url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-bold.woff)}@font-face{font-family:Inter;font-weight:800;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-extra-bold.woff2),url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-extra-bold.woff)}@font-face{font-family:IBM Plex Mono;src:url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/ibm-plex-mono/ibm-plex-mono-regular.woff2),url(https://d1e7r7b0lb8p4d.cloudfront.net/fonts/ibm-plex-mono/ibm-plex-mono-regular.woff)}}@layer reset{*,:after,:before{border-color:var(--border-solid-border-color,"currentColor");border-style:solid;border-width:0}}
2
+ @layer kz-components {
3
+ .SingleSelect-module_popover__ZjL9n {
4
+ background-color: var(--color-white);
5
+ border-radius: var(--spacing-8);
6
+ padding: var(--spacing-8);
7
+ width: 200px;
8
+ box-shadow: var(--shadow-small-box-shadow);
9
+ }
10
+ }
11
+
12
+ @layer kz-components {
13
+ .List-module_list__bbFPn {
14
+ display: flex;
15
+ flex-direction: column;
16
+ gap: var(--spacing-16);
17
+ }
18
+ }
19
+
20
+ @layer kz-components {
21
+ .Trigger-module_button__giSqA {
22
+ display: flex;
23
+ align-items: center;
24
+ justify-content: space-between;
25
+ font-family: var(--typography-paragraph-body-font-family);
26
+ font-weight: var(--typography-paragraph-body-font-weight);
27
+ font-size: var(--typography-paragraph-body-font-size);
28
+ line-height: var(--typography-paragraph-body-line-height);
29
+ letter-spacing: var(--typography-paragraph-body-letter-spacing);
30
+ padding: var(--spacing-12);
31
+ min-height: var(--spacing-48);
32
+ min-width: var(--spacing-200);
33
+ background-color: var(--color-white);
34
+ border-radius: var(--spacing-8);
35
+ border: 1px solid var(--color-gray-500);
36
+ }
37
+ }
38
+
39
+ @layer kz-components {
40
+ .ListItem-module_listItem__xGr6A {
41
+ font-family: var(--typography-paragraph-body-font-family);
42
+ font-weight: var(--typography-paragraph-body-font-weight);
43
+ font-size: var(--typography-paragraph-body-font-size);
44
+ line-height: var(--typography-paragraph-body-line-height);
45
+ letter-spacing: var(--typography-paragraph-body-letter-spacing);
46
+ }
47
+ }
48
+
49
+ @layer kz-components {
50
+ .ListSection-module_listSectionHeader__bptHg {
51
+ font-family: var(--typography-heading-5-font-family);
52
+ font-weight: var(--typography-heading-5-font-weight);
53
+ font-size: var(--typography-heading-5-font-size);
54
+ line-height: var(--typography-heading-5-line-height);
55
+ letter-spacing: var(--typography-heading-5-letter-spacing);
56
+ }
57
+ }
58
+
2
59
  @layer kz-components {
3
60
  /*
4
61
  * This is taken from the Material Symbols CDN
@@ -2,6 +2,11 @@ import React from 'react';
2
2
  import { type ButtonRef, type GenericButtonProps } from '../GenericButton';
3
3
  export type ButtonProps = GenericButtonProps;
4
4
  /**
5
+ * @deprecated This component will be replaced by the next Button component in v2.
6
+ * Use `@kaizen/components/next` Button instead.
7
+ * Migration guide: {@link https://cultureamp.design/?path=/docs/components-button-migration-guide--docs}
8
+ * Codemod available: `upgradeV1Buttons`
9
+ *
5
10
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3062890984/Button Guidance} |
6
11
  * {@link https://cultureamp.design/?path=/docs/components-buttons-button--docs Storybook}
7
12
  */
@@ -2,6 +2,11 @@ import React from 'react';
2
2
  import { type BaseButtonProps, type ButtonRef, type WorkingButtonProps } from '../GenericButton';
3
3
  export type IconButtonProps = Omit<BaseButtonProps, 'iconPosition'> & WorkingButtonProps;
4
4
  /**
5
+ * @deprecated This component will be replaced by the next Button component in v2.
6
+ * Use `@kaizen/components/next` Button instead.
7
+ * Migration guide: {@link https://cultureamp.design/?path=/docs/components-button-migration-guide--docs}
8
+ * Codemod available: `upgradeV1Buttons`
9
+ *
5
10
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3062890984/Button Guidance} |
6
11
  * {@link https://cultureamp.design/?path=/docs/components-iconbutton--docs Storybook}
7
12
  */
@@ -19,6 +19,9 @@ export type LikertScaleProps = {
19
19
  'onSelect': (value: ScaleItem | null) => void;
20
20
  };
21
21
  /**
22
+ * @deprecated This component will be renamed to LikertScale in v2.
23
+ * Start importing as LikertScale instead.
24
+ *
22
25
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082060201/Likert+Scale Guidance} |
23
26
  * {@link https://cultureamp.design/?path=/docs/components-likertscalelegacy--docs Storybook}
24
27
  */
@@ -6,6 +6,9 @@ export type SkirtProps = {
6
6
  variant?: Variant;
7
7
  titleBlockHasNavigation?: boolean;
8
8
  } & ContentProps;
9
+ /**
10
+ * @deprecated This component will be removed in v2. Please remove any usages.
11
+ */
9
12
  export declare const Skirt: {
10
13
  ({ children, variant, titleBlockHasNavigation, classNameOverride, ...restProps }: SkirtProps): JSX.Element;
11
14
  displayName: string;
@@ -1,5 +1,8 @@
1
1
  import { type CardProps } from "../../../Card";
2
2
  export type SkirtCardProps = CardProps;
3
+ /**
4
+ * @deprecated This component will be removed in v2. Use a regular Card component instead.
5
+ */
3
6
  export declare const SkirtCard: {
4
7
  (props: SkirtCardProps): JSX.Element;
5
8
  displayName: string;