@kaizen/components 1.78.1 → 1.78.2

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 (24) hide show
  1. package/dist/cjs/src/LikertScaleLegacy/LikertScaleLegacy.cjs +5 -3
  2. package/dist/cjs/src/Menu/subcomponents/StatelessMenu/StatelessMenu.cjs +0 -1
  3. package/dist/cjs/src/__next__/Select/Select.cjs +23 -15
  4. package/dist/esm/src/LikertScaleLegacy/LikertScaleLegacy.mjs +5 -3
  5. package/dist/esm/src/Menu/subcomponents/StatelessMenu/StatelessMenu.mjs +0 -1
  6. package/dist/esm/src/__next__/Select/Select.mjs +23 -15
  7. package/dist/styles.css +1816 -1816
  8. package/dist/types/LikertScaleLegacy/LikertScaleLegacy.d.ts +5 -1
  9. package/dist/types/Menu/subcomponents/StatelessMenu/StatelessMenu.d.ts +0 -1
  10. package/dist/types/__next__/Select/Select.d.ts +1 -1
  11. package/package.json +1 -1
  12. package/src/LikertScaleLegacy/LikertScaleLegacy.spec.tsx +1 -0
  13. package/src/LikertScaleLegacy/LikertScaleLegacy.tsx +7 -1
  14. package/src/LikertScaleLegacy/_docs/LikertScaleLegacy.mdx +8 -0
  15. package/src/LikertScaleLegacy/_docs/LikertScaleLegacy.stories.tsx +30 -1
  16. package/src/Menu/subcomponents/StatelessMenu/StatelessMenu.tsx +0 -2
  17. package/src/__next__/Select/Select.tsx +5 -0
  18. package/src/__next__/Select/_docs/Select.mdx +8 -0
  19. package/src/__next__/Select/_docs/Select.stories.tsx +93 -0
  20. package/src/__next__/Tooltip/_docs/ApiSpecification.mdx +2 -2
  21. package/src/__next__/Tooltip/_docs/Tooltip.docs.stories.tsx +15 -30
  22. package/src/__next__/Tooltip/_docs/Tooltip.mdx +1 -1
  23. package/src/__next__/Tooltip/_docs/Tooltip.spec.stories.tsx +21 -58
  24. package/src/__next__/Tooltip/_docs/Tooltip.stories.tsx +2 -2
package/dist/cjs/src/LikertScaleLegacy/LikertScaleLegacy.cjs CHANGED
@@ -36,7 +36,8 @@ var LikertScaleLegacy = function (_a) {
36
36
  onSelect = _a.onSelect,
37
37
  validationMessage = _a.validationMessage,
38
38
  status = _a.status,
39
- labelId = _a.labelId;
39
+ labelId = _a.labelId,
40
+ isRequired = _a.isRequired;
40
41
  var _e = React.useState(null),
41
42
  hoveredItem = _e[0],
42
43
  setHoveredItem = _e[1];
@@ -83,11 +84,12 @@ var LikertScaleLegacy = function (_a) {
83
84
  var isRated = selectedItem && selectedItem.value > 0;
84
85
  return React__default.default.createElement("div", {
85
86
  className: classnames__default.default(LikertScaleLegacy_module.container, isRated && LikertScaleLegacy_module.rated, reversed && [LikertScaleLegacy_module.reversed], hoveredItem !== null && LikertScaleLegacy_module.hovered),
86
- "aria-labelledby": labelId,
87
+ "aria-labelledby": isRequired ? "".concat(labelId) : labelId,
87
88
  role: "radiogroup",
88
89
  tabIndex: -1,
89
90
  "aria-describedby": validationMessageId,
90
- "data-testid": dataTestId
91
+ "data-testid": dataTestId,
92
+ "aria-required": isRequired
91
93
  }, React__default.default.createElement("div", {
92
94
  className: LikertScaleLegacy_module.legend,
93
95
  "data-testid": dataTestId && "".concat(dataTestId, "-legend")
package/dist/cjs/src/Menu/subcomponents/StatelessMenu/StatelessMenu.cjs CHANGED
@@ -40,7 +40,6 @@ var StatelessMenu = function (_a) {
40
40
  'onMouseDown': function (e) {
41
41
  return e.preventDefault();
42
42
  },
43
- 'aria-haspopup': true,
44
43
  'aria-expanded': isMenuVisible
45
44
  });
46
45
  React.useEffect(function () {
package/dist/cjs/src/__next__/Select/Select.cjs CHANGED
@@ -44,16 +44,19 @@ var Select = function (_a) {
44
44
  status = _a.status,
45
45
  validationMessage = _a.validationMessage,
46
46
  isReversed = _a.isReversed,
47
+ _c = _a.isRequired,
48
+ isRequired = _c === void 0 ? false : _c,
47
49
  isFullWidth = _a.isFullWidth,
48
50
  disabledValues = _a.disabledValues,
49
51
  classNameOverride = _a.classNameOverride,
50
52
  selectedKey = _a.selectedKey,
51
53
  description = _a.description,
52
- _c = _a.placeholder,
53
- placeholder = _c === void 0 ? '' : _c,
54
+ _d = _a.placeholder,
55
+ placeholder = _d === void 0 ? '' : _d,
54
56
  isDisabled = _a.isDisabled,
55
57
  portalContainerId = _a.portalContainerId,
56
- restProps = tslib.__rest(_a, ["label", "items", "id", "trigger", "children", "status", "validationMessage", "isReversed", "isFullWidth", "disabledValues", "classNameOverride", "selectedKey", "description", "placeholder", "isDisabled", "portalContainerId"]);
58
+ onSelectionChange = _a.onSelectionChange,
59
+ restProps = tslib.__rest(_a, ["label", "items", "id", "trigger", "children", "status", "validationMessage", "isReversed", "isRequired", "isFullWidth", "disabledValues", "classNameOverride", "selectedKey", "description", "placeholder", "isDisabled", "portalContainerId", "onSelectionChange"]);
57
60
  var refs = reactDom.useFloating().refs;
58
61
  var triggerRef = refs.reference;
59
62
  var fallbackId = React.useId();
@@ -70,16 +73,20 @@ var Select = function (_a) {
70
73
  selectedKey: typeof selectedKey === 'number' ? selectedKey.toString() : selectedKey,
71
74
  description: description,
72
75
  placeholder: placeholder,
73
- isDisabled: isDisabled
76
+ isDisabled: isDisabled,
77
+ isRequired: isRequired,
78
+ onSelectionChange: onSelectionChange ? function (key) {
79
+ return onSelectionChange(key);
80
+ } : undefined
74
81
  }, restProps);
75
82
  var state = select.useSelectState(ariaSelectProps);
76
- var _d = select$1.useSelect(ariaSelectProps, state, triggerRef),
77
- labelProps = _d.labelProps,
78
- reactAriaTriggerProps = _d.triggerProps,
79
- valueProps = _d.valueProps,
80
- menuProps = _d.menuProps,
81
- errorMessageProps = _d.errorMessageProps,
82
- descriptionProps = _d.descriptionProps;
83
+ var _e = select$1.useSelect(ariaSelectProps, state, triggerRef),
84
+ labelProps = _e.labelProps,
85
+ reactAriaTriggerProps = _e.triggerProps,
86
+ valueProps = _e.valueProps,
87
+ menuProps = _e.menuProps,
88
+ errorMessageProps = _e.errorMessageProps,
89
+ descriptionProps = _e.descriptionProps;
83
90
  // Hack incoming:
84
91
  // react-aria/useSelect wants to prefix the combobox's accessible name with the value of the select.
85
92
  // We use role=combobox, meaning screen readers will read the value.
@@ -101,11 +108,12 @@ var Select = function (_a) {
101
108
  'isDisabled': triggerProps.isDisabled,
102
109
  isReversed: isReversed,
103
110
  'ref': refs.setReference,
104
- 'aria-describedby': classnames__default.default(validationMessage && validationId, description && descriptionId)
111
+ 'aria-describedby': classnames__default.default(validationMessage && validationId, description && descriptionId),
112
+ 'aria-required': isRequired
105
113
  });
106
- var _e = React.useState(),
107
- portalContainer = _e[0],
108
- setPortalContainer = _e[1];
114
+ var _f = React.useState(),
115
+ portalContainer = _f[0],
116
+ setPortalContainer = _f[1];
109
117
  React.useEffect(function () {
110
118
  if (portalContainerId) {
111
119
  var portalElement = document.getElementById(portalContainerId);
package/dist/esm/src/LikertScaleLegacy/LikertScaleLegacy.mjs CHANGED
@@ -27,7 +27,8 @@ var LikertScaleLegacy = function (_a) {
27
27
  onSelect = _a.onSelect,
28
28
  validationMessage = _a.validationMessage,
29
29
  status = _a.status,
30
- labelId = _a.labelId;
30
+ labelId = _a.labelId,
31
+ isRequired = _a.isRequired;
31
32
  var _e = useState(null),
32
33
  hoveredItem = _e[0],
33
34
  setHoveredItem = _e[1];
@@ -74,11 +75,12 @@ var LikertScaleLegacy = function (_a) {
74
75
  var isRated = selectedItem && selectedItem.value > 0;
75
76
  return /*#__PURE__*/React.createElement("div", {
76
77
  className: classnames(styles.container, isRated && styles.rated, reversed && [styles.reversed], hoveredItem !== null && styles.hovered),
77
- "aria-labelledby": labelId,
78
+ "aria-labelledby": isRequired ? "".concat(labelId) : labelId,
78
79
  role: "radiogroup",
79
80
  tabIndex: -1,
80
81
  "aria-describedby": validationMessageId,
81
- "data-testid": dataTestId
82
+ "data-testid": dataTestId,
83
+ "aria-required": isRequired
82
84
  }, /*#__PURE__*/React.createElement("div", {
83
85
  className: styles.legend,
84
86
  "data-testid": dataTestId && "".concat(dataTestId, "-legend")
package/dist/esm/src/Menu/subcomponents/StatelessMenu/StatelessMenu.mjs CHANGED
@@ -32,7 +32,6 @@ const StatelessMenu = /*#__PURE__*/function () {
32
32
  'onMouseDown': function (e) {
33
33
  return e.preventDefault();
34
34
  },
35
- 'aria-haspopup': true,
36
35
  'aria-expanded': isMenuVisible
37
36
  });
38
37
  useEffect(function () {
package/dist/esm/src/__next__/Select/Select.mjs CHANGED
@@ -36,16 +36,19 @@ const Select = /*#__PURE__*/function () {
36
36
  status = _a.status,
37
37
  validationMessage = _a.validationMessage,
38
38
  isReversed = _a.isReversed,
39
+ _c = _a.isRequired,
40
+ isRequired = _c === void 0 ? false : _c,
39
41
  isFullWidth = _a.isFullWidth,
40
42
  disabledValues = _a.disabledValues,
41
43
  classNameOverride = _a.classNameOverride,
42
44
  selectedKey = _a.selectedKey,
43
45
  description = _a.description,
44
- _c = _a.placeholder,
45
- placeholder = _c === void 0 ? '' : _c,
46
+ _d = _a.placeholder,
47
+ placeholder = _d === void 0 ? '' : _d,
46
48
  isDisabled = _a.isDisabled,
47
49
  portalContainerId = _a.portalContainerId,
48
- restProps = __rest(_a, ["label", "items", "id", "trigger", "children", "status", "validationMessage", "isReversed", "isFullWidth", "disabledValues", "classNameOverride", "selectedKey", "description", "placeholder", "isDisabled", "portalContainerId"]);
50
+ onSelectionChange = _a.onSelectionChange,
51
+ restProps = __rest(_a, ["label", "items", "id", "trigger", "children", "status", "validationMessage", "isReversed", "isRequired", "isFullWidth", "disabledValues", "classNameOverride", "selectedKey", "description", "placeholder", "isDisabled", "portalContainerId", "onSelectionChange"]);
49
52
  var refs = useFloating().refs;
50
53
  var triggerRef = refs.reference;
51
54
  var fallbackId = useId();
@@ -62,16 +65,20 @@ const Select = /*#__PURE__*/function () {
62
65
  selectedKey: typeof selectedKey === 'number' ? selectedKey.toString() : selectedKey,
63
66
  description: description,
64
67
  placeholder: placeholder,
65
- isDisabled: isDisabled
68
+ isDisabled: isDisabled,
69
+ isRequired: isRequired,
70
+ onSelectionChange: onSelectionChange ? function (key) {
71
+ return onSelectionChange(key);
72
+ } : undefined
66
73
  }, restProps);
67
74
  var state = useSelectState(ariaSelectProps);
68
- var _d = useSelect(ariaSelectProps, state, triggerRef),
69
- labelProps = _d.labelProps,
70
- reactAriaTriggerProps = _d.triggerProps,
71
- valueProps = _d.valueProps,
72
- menuProps = _d.menuProps,
73
- errorMessageProps = _d.errorMessageProps,
74
- descriptionProps = _d.descriptionProps;
75
+ var _e = useSelect(ariaSelectProps, state, triggerRef),
76
+ labelProps = _e.labelProps,
77
+ reactAriaTriggerProps = _e.triggerProps,
78
+ valueProps = _e.valueProps,
79
+ menuProps = _e.menuProps,
80
+ errorMessageProps = _e.errorMessageProps,
81
+ descriptionProps = _e.descriptionProps;
75
82
  // Hack incoming:
76
83
  // react-aria/useSelect wants to prefix the combobox's accessible name with the value of the select.
77
84
  // We use role=combobox, meaning screen readers will read the value.
@@ -93,11 +100,12 @@ const Select = /*#__PURE__*/function () {
93
100
  'isDisabled': triggerProps.isDisabled,
94
101
  isReversed: isReversed,
95
102
  'ref': refs.setReference,
96
- 'aria-describedby': classnames(validationMessage && validationId, description && descriptionId)
103
+ 'aria-describedby': classnames(validationMessage && validationId, description && descriptionId),
104
+ 'aria-required': isRequired
97
105
  });
98
- var _e = useState(),
99
- portalContainer = _e[0],
100
- setPortalContainer = _e[1];
106
+ var _f = useState(),
107
+ portalContainer = _f[0],
108
+ setPortalContainer = _f[1];
101
109
  useEffect(function () {
102
110
  if (portalContainerId) {
103
111
  var portalElement = document.getElementById(portalContainerId);