@carbon/react 1.92.0-rc.0 → 1.92.1

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 (14) hide show
  1. package/.playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json +855 -855
  2. package/es/components/ComposedModal/ComposedModal.js +3 -11
  3. package/es/components/DatePicker/DatePicker.js +14 -6
  4. package/es/components/DatePickerInput/DatePickerInput.js +1 -1
  5. package/es/components/MenuButton/index.d.ts +1 -1
  6. package/es/components/MenuButton/index.js +1 -1
  7. package/es/components/Modal/Modal.js +3 -13
  8. package/lib/components/ComposedModal/ComposedModal.js +3 -11
  9. package/lib/components/DatePicker/DatePicker.js +14 -6
  10. package/lib/components/DatePickerInput/DatePickerInput.js +1 -1
  11. package/lib/components/MenuButton/index.d.ts +1 -1
  12. package/lib/components/MenuButton/index.js +1 -1
  13. package/lib/components/Modal/Modal.js +3 -13
  14. package/package.json +7 -7
package/es/components/ComposedModal/ComposedModal.js CHANGED
@@ -243,17 +243,9 @@ const ComposedModalDialog = /*#__PURE__*/React.forwardRef(function ComposedModal
243
243
  if (!modalContent || !modalContent.classList.contains(`${prefix}--modal-scroll-content`) || !currentActiveNode || !modalContent.contains(currentActiveNode)) {
244
244
  return;
245
245
  }
246
- const lastContent = modalContent.children[modalContent.children.length - 1];
247
- const gradientSpacing = modalContent.scrollHeight - lastContent.offsetTop - lastContent.clientHeight;
248
- for (const elem of modalContent.children) {
249
- if (elem.contains(currentActiveNode)) {
250
- const spaceBelow = modalContent.clientHeight - elem.offsetTop + modalContent.scrollTop - elem.clientHeight;
251
- if (spaceBelow < gradientSpacing) {
252
- modalContent.scrollTop = modalContent.scrollTop + (gradientSpacing - spaceBelow);
253
- }
254
- break;
255
- }
256
- }
246
+ currentActiveNode.scrollIntoView({
247
+ block: 'center'
248
+ });
257
249
  }
258
250
  function closeModal(evt) {
259
251
  if (!onClose || onClose(evt) !== false) {
package/es/components/DatePicker/DatePicker.js CHANGED
@@ -218,6 +218,7 @@ const DatePicker = /*#__PURE__*/React.forwardRef(function DatePicker({
218
218
  const lastFocusedField = useRef(null);
219
219
  const savedOnChange = useSavedCallback(onChange);
220
220
  const savedOnOpen = useSavedCallback(onOpen);
221
+ const effectiveWarn = warn && !invalid;
221
222
  const datePickerClasses = cx(`${prefix}--date-picker`, {
222
223
  [`${prefix}--date-picker--short`]: short,
223
224
  [`${prefix}--date-picker--light`]: light,
@@ -238,26 +239,34 @@ const DatePicker = /*#__PURE__*/React.forwardRef(function DatePicker({
238
239
  return /*#__PURE__*/React.cloneElement(child, {
239
240
  datePickerType,
240
241
  ref: startInputField,
241
- readOnly
242
+ readOnly,
243
+ invalid,
244
+ warn: effectiveWarn
242
245
  });
243
246
  }
244
247
  if (index === 1 && child.type === /*#__PURE__*/React.createElement(DatePickerInput, child.props).type) {
245
248
  return /*#__PURE__*/React.cloneElement(child, {
246
249
  datePickerType,
247
250
  ref: endInputField,
248
- readOnly
251
+ readOnly,
252
+ invalid,
253
+ warn: effectiveWarn
249
254
  });
250
255
  }
251
256
  if (index === 0) {
252
257
  return /*#__PURE__*/React.cloneElement(child, {
253
258
  ref: startInputField,
254
- readOnly
259
+ readOnly,
260
+ invalid,
261
+ warn: effectiveWarn
255
262
  });
256
263
  }
257
264
  if (index === 1) {
258
265
  return /*#__PURE__*/React.cloneElement(child, {
259
266
  ref: endInputField,
260
- readOnly
267
+ readOnly,
268
+ invalid,
269
+ warn: effectiveWarn
261
270
  });
262
271
  }
263
272
  });
@@ -616,8 +625,7 @@ const DatePicker = /*#__PURE__*/React.forwardRef(function DatePicker({
616
625
  }), /*#__PURE__*/React.createElement("div", {
617
626
  className: `${prefix}--form-requirement`
618
627
  }, invalidText));
619
- }
620
- if (warn && !invalid) {
628
+ } else if (warn) {
621
629
  fluidError = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(WarningAltFilled, {
622
630
  className: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--warn`
623
631
  }), /*#__PURE__*/React.createElement("hr", {
package/es/components/DatePickerInput/DatePickerInput.js CHANGED
@@ -137,7 +137,7 @@ const DatePickerInput = /*#__PURE__*/React.forwardRef(function DatePickerInput(p
137
137
  }), /*#__PURE__*/React.createElement(Text, {
138
138
  as: "div",
139
139
  className: `${prefix}--form-requirement`
140
- }, invalidText)), warn && /*#__PURE__*/React.createElement(React.Fragment, null, isFluid && /*#__PURE__*/React.createElement("hr", {
140
+ }, invalidText)), warn && !invalid && /*#__PURE__*/React.createElement(React.Fragment, null, isFluid && /*#__PURE__*/React.createElement("hr", {
141
141
  className: `${prefix}--date-picker__divider`
142
142
  }), /*#__PURE__*/React.createElement(Text, {
143
143
  as: "div",
package/es/components/MenuButton/index.d.ts CHANGED
@@ -34,7 +34,7 @@ export interface MenuButtonProps extends ComponentProps<'div'> {
34
34
  /**
35
35
  * Specify the size of the button and menu.
36
36
  */
37
- size?: 'sm' | 'md' | 'lg';
37
+ size?: 'xs' | 'sm' | 'md' | 'lg';
38
38
  /**
39
39
  * Specify the tabIndex of the button.
40
40
  */
package/es/components/MenuButton/index.js CHANGED
@@ -177,7 +177,7 @@ MenuButton.propTypes = {
177
177
  */
178
178
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20071
179
179
  // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
180
- size: PropTypes.oneOf(['sm', 'md', 'lg']),
180
+ size: PropTypes.oneOf(['xs', 'sm', 'md', 'lg']),
181
181
  /**
182
182
  * Specify the tabIndex of the button.
183
183
  */
package/es/components/Modal/Modal.js CHANGED
@@ -207,19 +207,9 @@ const ModalDialog = /*#__PURE__*/React.forwardRef(function ModalDialog({
207
207
  if (!modalContent || !modalContent.classList.contains(`${prefix}--modal-scroll-content`) || !currentActiveNode || !modalContent.contains(currentActiveNode)) {
208
208
  return;
209
209
  }
210
- const lastContent = modalContent.children[modalContent.children.length - 1];
211
- const gradientSpacing = modalContent.scrollHeight - lastContent.offsetTop - lastContent.clientHeight;
212
-
213
- // eslint-disable-next-line prefer-const -- https://github.com/carbon-design-system/carbon/issues/20071
214
- for (let elem of modalContent.children) {
215
- if (elem.contains(currentActiveNode)) {
216
- const spaceBelow = modalContent.clientHeight - elem.offsetTop + modalContent.scrollTop - elem.clientHeight;
217
- if (spaceBelow < gradientSpacing) {
218
- modalContent.scrollTop = modalContent.scrollTop + (gradientSpacing - spaceBelow);
219
- }
220
- break;
221
- }
222
- }
210
+ currentActiveNode.scrollIntoView({
211
+ block: 'center'
212
+ });
223
213
  }
224
214
  const onSecondaryButtonClick = onSecondarySubmit ? onSecondarySubmit : onRequestClose;
225
215
  const modalClasses = cx(`${prefix}--modal`, {
package/lib/components/ComposedModal/ComposedModal.js CHANGED
@@ -247,17 +247,9 @@ const ComposedModalDialog = /*#__PURE__*/React.forwardRef(function ComposedModal
247
247
  if (!modalContent || !modalContent.classList.contains(`${prefix}--modal-scroll-content`) || !currentActiveNode || !modalContent.contains(currentActiveNode)) {
248
248
  return;
249
249
  }
250
- const lastContent = modalContent.children[modalContent.children.length - 1];
251
- const gradientSpacing = modalContent.scrollHeight - lastContent.offsetTop - lastContent.clientHeight;
252
- for (const elem of modalContent.children) {
253
- if (elem.contains(currentActiveNode)) {
254
- const spaceBelow = modalContent.clientHeight - elem.offsetTop + modalContent.scrollTop - elem.clientHeight;
255
- if (spaceBelow < gradientSpacing) {
256
- modalContent.scrollTop = modalContent.scrollTop + (gradientSpacing - spaceBelow);
257
- }
258
- break;
259
- }
260
- }
250
+ currentActiveNode.scrollIntoView({
251
+ block: 'center'
252
+ });
261
253
  }
262
254
  function closeModal(evt) {
263
255
  if (!onClose || onClose(evt) !== false) {
package/lib/components/DatePicker/DatePicker.js CHANGED
@@ -222,6 +222,7 @@ const DatePicker = /*#__PURE__*/React.forwardRef(function DatePicker({
222
222
  const lastFocusedField = React.useRef(null);
223
223
  const savedOnChange = useSavedCallback.useSavedCallback(onChange);
224
224
  const savedOnOpen = useSavedCallback.useSavedCallback(onOpen);
225
+ const effectiveWarn = warn && !invalid;
225
226
  const datePickerClasses = cx(`${prefix}--date-picker`, {
226
227
  [`${prefix}--date-picker--short`]: short,
227
228
  [`${prefix}--date-picker--light`]: light,
@@ -242,26 +243,34 @@ const DatePicker = /*#__PURE__*/React.forwardRef(function DatePicker({
242
243
  return /*#__PURE__*/React.cloneElement(child, {
243
244
  datePickerType,
244
245
  ref: startInputField,
245
- readOnly
246
+ readOnly,
247
+ invalid,
248
+ warn: effectiveWarn
246
249
  });
247
250
  }
248
251
  if (index === 1 && child.type === /*#__PURE__*/React.createElement(DatePickerInput.default, child.props).type) {
249
252
  return /*#__PURE__*/React.cloneElement(child, {
250
253
  datePickerType,
251
254
  ref: endInputField,
252
- readOnly
255
+ readOnly,
256
+ invalid,
257
+ warn: effectiveWarn
253
258
  });
254
259
  }
255
260
  if (index === 0) {
256
261
  return /*#__PURE__*/React.cloneElement(child, {
257
262
  ref: startInputField,
258
- readOnly
263
+ readOnly,
264
+ invalid,
265
+ warn: effectiveWarn
259
266
  });
260
267
  }
261
268
  if (index === 1) {
262
269
  return /*#__PURE__*/React.cloneElement(child, {
263
270
  ref: endInputField,
264
- readOnly
271
+ readOnly,
272
+ invalid,
273
+ warn: effectiveWarn
265
274
  });
266
275
  }
267
276
  });
@@ -620,8 +629,7 @@ const DatePicker = /*#__PURE__*/React.forwardRef(function DatePicker({
620
629
  }), /*#__PURE__*/React.createElement("div", {
621
630
  className: `${prefix}--form-requirement`
622
631
  }, invalidText));
623
- }
624
- if (warn && !invalid) {
632
+ } else if (warn) {
625
633
  fluidError = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(iconsReact.WarningAltFilled, {
626
634
  className: `${prefix}--date-picker__icon ${prefix}--date-picker__icon--warn`
627
635
  }), /*#__PURE__*/React.createElement("hr", {
package/lib/components/DatePickerInput/DatePickerInput.js CHANGED
@@ -141,7 +141,7 @@ const DatePickerInput = /*#__PURE__*/React.forwardRef(function DatePickerInput(p
141
141
  }), /*#__PURE__*/React.createElement(Text.Text, {
142
142
  as: "div",
143
143
  className: `${prefix}--form-requirement`
144
- }, invalidText)), warn && /*#__PURE__*/React.createElement(React.Fragment, null, isFluid && /*#__PURE__*/React.createElement("hr", {
144
+ }, invalidText)), warn && !invalid && /*#__PURE__*/React.createElement(React.Fragment, null, isFluid && /*#__PURE__*/React.createElement("hr", {
145
145
  className: `${prefix}--date-picker__divider`
146
146
  }), /*#__PURE__*/React.createElement(Text.Text, {
147
147
  as: "div",
package/lib/components/MenuButton/index.d.ts CHANGED
@@ -34,7 +34,7 @@ export interface MenuButtonProps extends ComponentProps<'div'> {
34
34
  /**
35
35
  * Specify the size of the button and menu.
36
36
  */
37
- size?: 'sm' | 'md' | 'lg';
37
+ size?: 'xs' | 'sm' | 'md' | 'lg';
38
38
  /**
39
39
  * Specify the tabIndex of the button.
40
40
  */
package/lib/components/MenuButton/index.js CHANGED
@@ -179,7 +179,7 @@ MenuButton.propTypes = {
179
179
  */
180
180
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20071
181
181
  // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
182
- size: PropTypes.oneOf(['sm', 'md', 'lg']),
182
+ size: PropTypes.oneOf(['xs', 'sm', 'md', 'lg']),
183
183
  /**
184
184
  * Specify the tabIndex of the button.
185
185
  */
package/lib/components/Modal/Modal.js CHANGED
@@ -211,19 +211,9 @@ const ModalDialog = /*#__PURE__*/React.forwardRef(function ModalDialog({
211
211
  if (!modalContent || !modalContent.classList.contains(`${prefix}--modal-scroll-content`) || !currentActiveNode || !modalContent.contains(currentActiveNode)) {
212
212
  return;
213
213
  }
214
- const lastContent = modalContent.children[modalContent.children.length - 1];
215
- const gradientSpacing = modalContent.scrollHeight - lastContent.offsetTop - lastContent.clientHeight;
216
-
217
- // eslint-disable-next-line prefer-const -- https://github.com/carbon-design-system/carbon/issues/20071
218
- for (let elem of modalContent.children) {
219
- if (elem.contains(currentActiveNode)) {
220
- const spaceBelow = modalContent.clientHeight - elem.offsetTop + modalContent.scrollTop - elem.clientHeight;
221
- if (spaceBelow < gradientSpacing) {
222
- modalContent.scrollTop = modalContent.scrollTop + (gradientSpacing - spaceBelow);
223
- }
224
- break;
225
- }
226
- }
214
+ currentActiveNode.scrollIntoView({
215
+ block: 'center'
216
+ });
227
217
  }
228
218
  const onSecondaryButtonClick = onSecondarySubmit ? onSecondarySubmit : onRequestClose;
229
219
  const modalClasses = cx(`${prefix}--modal`, {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@carbon/react",
3
3
  "description": "React components for the Carbon Design System",
4
- "version": "1.92.0-rc.0",
4
+ "version": "1.92.1",
5
5
  "license": "Apache-2.0",
6
6
  "main": "lib/index.js",
7
7
  "types": "lib/index.d.ts",
@@ -52,10 +52,10 @@
52
52
  },
53
53
  "dependencies": {
54
54
  "@babel/runtime": "^7.27.3",
55
- "@carbon/feature-flags": "^0.31.0-rc.0",
56
- "@carbon/icons-react": "^11.68.0-rc.0",
57
- "@carbon/layout": "^11.42.0-rc.0",
58
- "@carbon/styles": "^1.91.0-rc.0",
55
+ "@carbon/feature-flags": "^0.31.0",
56
+ "@carbon/icons-react": "^11.68.0",
57
+ "@carbon/layout": "^11.42.0",
58
+ "@carbon/styles": "^1.91.0",
59
59
  "@carbon/utilities": "^0.10.0",
60
60
  "@floating-ui/react": "^0.27.4",
61
61
  "@ibm/telemetry-js": "^1.5.0",
@@ -80,7 +80,7 @@
80
80
  "@babel/preset-react": "^7.27.1",
81
81
  "@babel/preset-typescript": "^7.27.1",
82
82
  "@carbon/test-utils": "^10.38.0",
83
- "@carbon/themes": "^11.61.0-rc.0",
83
+ "@carbon/themes": "^11.61.0",
84
84
  "@figma/code-connect": "^1.3.2",
85
85
  "@rollup/plugin-babel": "^6.0.0",
86
86
  "@rollup/plugin-commonjs": "^28.0.3",
@@ -139,5 +139,5 @@
139
139
  "**/*.scss",
140
140
  "**/*.css"
141
141
  ],
142
- "gitHead": "eae1402aa3c86b644feefc43bd3202915404e924"
142
+ "gitHead": "b8f0a82e77dab7c49f4ff03127dc588658fff527"
143
143
  }