@kaizen/components 1.73.10 → 1.73.11

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.
@@ -59,6 +59,7 @@ var Select = function (_a) {
59
59
  var fallbackId = React.useId();
60
60
  var id = propsId !== null && propsId !== void 0 ? propsId : fallbackId;
61
61
  var descriptionId = "".concat(id, "--description");
62
+ var validationId = "".concat(id, "--validation");
62
63
  var popoverId = "".concat(id, "--popover");
63
64
  var disabledKeys = getDisabledKeysFromItems.getDisabledKeysFromItems(items);
64
65
  var ariaSelectProps = tslib.__assign({
@@ -92,14 +93,15 @@ var Select = function (_a) {
92
93
  var selectToggleProps = tslib.__assign(tslib.__assign({}, buttonProps), {
93
94
  label: label,
94
95
  labelProps: labelProps,
95
- value: (_b = state === null || state === void 0 ? void 0 : state.selectedItem) === null || _b === void 0 ? void 0 : _b.rendered,
96
+ 'value': (_b = state === null || state === void 0 ? void 0 : state.selectedItem) === null || _b === void 0 ? void 0 : _b.rendered,
96
97
  valueProps: valueProps,
97
- isOpen: state.isOpen,
98
+ 'isOpen': state.isOpen,
98
99
  placeholder: placeholder,
99
100
  status: status,
100
- isDisabled: triggerProps.isDisabled,
101
+ 'isDisabled': triggerProps.isDisabled,
101
102
  isReversed: isReversed,
102
- ref: refs.setReference
103
+ 'ref': refs.setReference,
104
+ 'aria-describedby': classnames__default.default(validationMessage && validationId, description && descriptionId)
103
105
  });
104
106
  var _e = React.useState(),
105
107
  portalContainer = _e[0],
@@ -128,6 +130,7 @@ var Select = function (_a) {
128
130
  }, React__default.default.createElement(SelectPopoverContents.SelectPopoverContents, {
129
131
  menuProps: menuProps
130
132
  }, children)))), validationMessage && React__default.default.createElement(FieldMessage.FieldMessage, tslib.__assign({}, errorMessageProps, {
133
+ id: validationId,
131
134
  message: validationMessage,
132
135
  status: status,
133
136
  reversed: isReversed
@@ -51,6 +51,7 @@ const Select = /*#__PURE__*/function () {
51
51
  var fallbackId = useId();
52
52
  var id = propsId !== null && propsId !== void 0 ? propsId : fallbackId;
53
53
  var descriptionId = "".concat(id, "--description");
54
+ var validationId = "".concat(id, "--validation");
54
55
  var popoverId = "".concat(id, "--popover");
55
56
  var disabledKeys = getDisabledKeysFromItems(items);
56
57
  var ariaSelectProps = __assign({
@@ -84,14 +85,15 @@ const Select = /*#__PURE__*/function () {
84
85
  var selectToggleProps = __assign(__assign({}, buttonProps), {
85
86
  label: label,
86
87
  labelProps: labelProps,
87
- value: (_b = state === null || state === void 0 ? void 0 : state.selectedItem) === null || _b === void 0 ? void 0 : _b.rendered,
88
+ 'value': (_b = state === null || state === void 0 ? void 0 : state.selectedItem) === null || _b === void 0 ? void 0 : _b.rendered,
88
89
  valueProps: valueProps,
89
- isOpen: state.isOpen,
90
+ 'isOpen': state.isOpen,
90
91
  placeholder: placeholder,
91
92
  status: status,
92
- isDisabled: triggerProps.isDisabled,
93
+ 'isDisabled': triggerProps.isDisabled,
93
94
  isReversed: isReversed,
94
- ref: refs.setReference
95
+ 'ref': refs.setReference,
96
+ 'aria-describedby': classnames(validationMessage && validationId, description && descriptionId)
95
97
  });
96
98
  var _e = useState(),
97
99
  portalContainer = _e[0],
@@ -120,6 +122,7 @@ const Select = /*#__PURE__*/function () {
120
122
  }, /*#__PURE__*/React.createElement(SelectPopoverContents, {
121
123
  menuProps: menuProps
122
124
  }, children))))), validationMessage && (/*#__PURE__*/React.createElement(FieldMessage, __assign({}, errorMessageProps, {
125
+ id: validationId,
123
126
  message: validationMessage,
124
127
  status: status,
125
128
  reversed: isReversed
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kaizen/components",
3
- "version": "1.73.10",
3
+ "version": "1.73.11",
4
4
  "description": "Kaizen component library",
5
5
  "author": "Geoffrey Chong <geoff.chong@cultureamp.com>",
6
6
  "homepage": "https://cultureamp.design",
@@ -100,6 +100,7 @@ export const Select = <Option extends SelectOption = SelectOption>({
100
100
  const fallbackId = useId()
101
101
  const id = propsId ?? fallbackId
102
102
  const descriptionId = `${id}--description`
103
+ const validationId = `${id}--validation`
103
104
  const popoverId = `${id}--popover`
104
105
 
105
106
  const disabledKeys = getDisabledKeysFromItems(items)
@@ -143,14 +144,15 @@ export const Select = <Option extends SelectOption = SelectOption>({
143
144
  ...buttonProps,
144
145
  label,
145
146
  labelProps,
146
- value: state?.selectedItem?.rendered,
147
+ 'value': state?.selectedItem?.rendered,
147
148
  valueProps,
148
- isOpen: state.isOpen,
149
+ 'isOpen': state.isOpen,
149
150
  placeholder,
150
151
  status,
151
- isDisabled: triggerProps.isDisabled,
152
+ 'isDisabled': triggerProps.isDisabled,
152
153
  isReversed,
153
- ref: refs.setReference,
154
+ 'ref': refs.setReference,
155
+ 'aria-describedby': classnames(validationMessage && validationId, description && descriptionId),
154
156
  }
155
157
 
156
158
  const [portalContainer, setPortalContainer] = useState<HTMLElement>()
@@ -184,6 +186,7 @@ export const Select = <Option extends SelectOption = SelectOption>({
184
186
  {validationMessage && (
185
187
  <FieldMessage
186
188
  {...errorMessageProps}
189
+ id={validationId}
187
190
  message={validationMessage}
188
191
  status={status}
189
192
  reversed={isReversed}