@allxsmith/bestax-bulma 4.0.0 → 5.1.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 (12) hide show
  1. package/dist/index.cjs.js +222 -235
  2. package/dist/index.cjs.js.map +1 -1
  3. package/dist/index.esm.js +222 -235
  4. package/dist/index.esm.js.map +1 -1
  5. package/dist/types/helpers/Theme.d.ts +1 -0
  6. package/dist/types/skill-examples/ExampleMeta.d.ts +10 -0
  7. package/dist/types/skill-examples/ProfileCard.d.ts +10 -0
  8. package/package.json +5 -11
  9. package/dist/versions/bestax-bulma-prefixed.css +0 -3
  10. package/dist/versions/bestax-bulma-prefixed.css.map +0 -1
  11. package/dist/versions/bestax-bulma-prefixed.js +0 -1
  12. package/src/scss/versions/bestax-bulma-prefixed.scss +0 -15
package/dist/index.cjs.js CHANGED
@@ -762,7 +762,7 @@ const CardComponent = ({ className, children, textColor, bgColor, hasShadow = tr
762
762
  'is-centered': headerCentered,
763
763
  }), children: header })), headerIcon] }));
764
764
  };
765
- return (jsxRuntime.jsxs("div", { className: cardClasses, ...rest, children: [renderHeader(header, headerIcon, headerCentered, classPrefix), image && (jsxRuntime.jsx("div", { className: prefixedClassNames(classPrefix, 'card-image'), children: typeof image === 'string' ? (jsxRuntime.jsx("figure", { className: prefixedClassNames(classPrefix, 'image'), children: jsxRuntime.jsx("img", { src: image, alt: imageAlt !== null && imageAlt !== void 0 ? imageAlt : 'Card image' }) })) : (image) })), typeof children !== 'undefined' &&
765
+ return (jsxRuntime.jsxs("div", { className: cardClasses, ...rest, children: [renderHeader(header, headerIcon, headerCentered, classPrefix), image && (jsxRuntime.jsx("div", { className: prefixedClassNames(classPrefix, 'card-image'), children: typeof image === 'string' ? (jsxRuntime.jsx("figure", { className: prefixedClassNames(classPrefix, 'image'), children: jsxRuntime.jsx("img", { src: image, alt: imageAlt ?? 'Card image' }) })) : (image) })), typeof children !== 'undefined' &&
766
766
  children !== null &&
767
767
  children !== '' &&
768
768
  !hasCompoundComponents(children) && (jsxRuntime.jsx("div", { className: prefixedClassNames(classPrefix, 'card-content'), children: children })), typeof children !== 'undefined' &&
@@ -825,10 +825,9 @@ const DropdownComponent = ({ label, children, className, menuClassName, active:
825
825
  if (!isBrowser$1(window, document))
826
826
  return;
827
827
  const handleClick = (e) => {
828
- var _a;
829
- if (!((_a = dropdownRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
828
+ if (!dropdownRef.current?.contains(e.target)) {
830
829
  setActive(false);
831
- onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(false);
830
+ onActiveChange?.(false);
832
831
  }
833
832
  };
834
833
  document.addEventListener('mousedown', handleClick);
@@ -839,12 +838,12 @@ const DropdownComponent = ({ label, children, className, menuClassName, active:
839
838
  return;
840
839
  const newActive = !active;
841
840
  setActive(newActive);
842
- onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(newActive);
841
+ onActiveChange?.(newActive);
843
842
  };
844
843
  const handleMenuClick = () => {
845
844
  if (closeOnClick) {
846
845
  setActive(false);
847
- onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(false);
846
+ onActiveChange?.(false);
848
847
  }
849
848
  };
850
849
  const dropdownClasses = classNames(bulmaClasses, bulmaHelperClasses, className);
@@ -965,14 +964,13 @@ const ModalClose = ({ className, size = 'large', variant = 'delete', ...props })
965
964
  return (jsxRuntime.jsx("button", { className: classes, "aria-label": "close", type: "button", ...props }));
966
965
  };
967
966
  const ModalRoot = ({ active, isActive, onClose, className, textColor, bgColor, modalCardTitle, modalCardFoot, type, children, ...props }) => {
968
- var _a;
969
967
  const { classPrefix } = useConfig();
970
968
  const { bulmaHelperClasses, rest } = useBulmaClasses({
971
969
  color: textColor,
972
970
  backgroundColor: bgColor,
973
971
  ...props,
974
972
  });
975
- const isModalActive = (_a = active !== null && active !== void 0 ? active : isActive) !== null && _a !== void 0 ? _a : false;
973
+ const isModalActive = active ?? isActive ?? false;
976
974
  const hasCompoundComponents = React.Children.toArray(children).some(child => React.isValidElement(child) &&
977
975
  (child.type === ModalBackground ||
978
976
  child.type === ModalContent ||
@@ -1033,13 +1031,12 @@ const NavbarItem = ({ className, as: Component = 'a', active, textColor, bgColor
1033
1031
  }), bulmaHelperClasses, className), ...rest, children: children }));
1034
1032
  };
1035
1033
  const NavbarBurger = ({ className, active, children, ...props }) => {
1036
- var _a;
1037
1034
  const { bulmaHelperClasses, rest } = useBulmaClasses({
1038
1035
  ...props,
1039
1036
  });
1040
1037
  return (jsxRuntime.jsxs("button", { type: "button", className: classNames(usePrefixedClassNames('navbar-burger', {
1041
1038
  'is-active': active,
1042
- }), bulmaHelperClasses, className), "aria-label": props['aria-label'] || 'menu', "aria-expanded": (_a = props['aria-expanded']) !== null && _a !== void 0 ? _a : !!active, ...rest, children: [jsxRuntime.jsx("span", { "aria-hidden": "true" }), jsxRuntime.jsx("span", { "aria-hidden": "true" }), jsxRuntime.jsx("span", { "aria-hidden": "true" }), children] }));
1039
+ }), bulmaHelperClasses, className), "aria-label": props['aria-label'] || 'menu', "aria-expanded": props['aria-expanded'] ?? !!active, ...rest, children: [jsxRuntime.jsx("span", { "aria-hidden": "true" }), jsxRuntime.jsx("span", { "aria-hidden": "true" }), jsxRuntime.jsx("span", { "aria-hidden": "true" }), children] }));
1043
1040
  };
1044
1041
  const NavbarMenu = ({ className, active, children, ...props }) => {
1045
1042
  const { bulmaHelperClasses, rest } = useBulmaClasses({
@@ -1353,7 +1350,7 @@ const Tabs = ({ align, size, fullwidth, boxed, toggle, rounded, color, value, on
1353
1350
  if (!isControlled) {
1354
1351
  setInternalTab(index);
1355
1352
  }
1356
- onChange === null || onChange === void 0 ? void 0 : onChange(index);
1353
+ onChange?.(index);
1357
1354
  }, [isControlled, onChange]);
1358
1355
  const contextValue = { activeTab, setActiveTab };
1359
1356
  const tabsClasses = usePrefixedClassNames('tabs', {
@@ -1523,10 +1520,10 @@ const Collapse = ({ open: controlledOpen, defaultOpen = false, onOpen, onClose,
1523
1520
  const newOpen = !internalOpen;
1524
1521
  setInternalOpen(newOpen);
1525
1522
  if (newOpen) {
1526
- onOpen === null || onOpen === void 0 ? void 0 : onOpen();
1523
+ onOpen?.();
1527
1524
  }
1528
1525
  else {
1529
- onClose === null || onClose === void 0 ? void 0 : onClose();
1526
+ onClose?.();
1530
1527
  }
1531
1528
  }
1532
1529
  }, [isControlled, internalOpen, onOpen, onClose]);
@@ -1745,7 +1742,7 @@ const Step = ({ isActive = false, isCompleted = false, label, icon, clickable =
1745
1742
  const markerContent = icon ||
1746
1743
  (isCompleted && resolvedCompletedIcon
1747
1744
  ? resolvedCompletedIcon
1748
- : (stepNumber !== null && stepNumber !== void 0 ? stepNumber : null));
1745
+ : (stepNumber ?? null));
1749
1746
  return (jsxRuntime.jsx("li", { className: stepClasses, onClick: handleClick, onKeyDown: handleKeyDown, tabIndex: clickable ? 0 : undefined, role: clickable ? 'button' : undefined, "aria-current": isActive ? 'step' : undefined, ...rest, children: jsxRuntime.jsxs("div", { className: "steps-link", children: [jsxRuntime.jsx("span", { className: "steps-marker", children: markerContent }), (label || children) && (jsxRuntime.jsx("div", { className: "steps-content", children: jsxRuntime.jsx("p", { className: "steps-title", children: label || children }) }))] }) }));
1750
1747
  };
1751
1748
  const Steps = ({ value = 0, items, size, color, hasMarker = true, animated = true, rounded = true, vertical = false, labelPosition = 'bottom', mobileMode, showStepNumbers = true, hasNavigation = false, prevLabel, nextLabel, onPrev, onNext, onStepClick, className, children, ...props }) => {
@@ -1786,7 +1783,7 @@ const Steps = ({ value = 0, items, size, color, hasMarker = true, animated = tru
1786
1783
  }
1787
1784
  return null;
1788
1785
  };
1789
- return (jsxRuntime.jsxs("div", { className: combinedClasses, ...rest, children: [jsxRuntime.jsx("ul", { className: listClasses, children: renderSteps() }), hasNavigation && (jsxRuntime.jsxs("div", { className: "steps-navigation", children: [jsxRuntime.jsx("button", { className: "button", disabled: value === 0, onClick: onPrev !== null && onPrev !== void 0 ? onPrev : (() => onStepClick === null || onStepClick === void 0 ? void 0 : onStepClick(value - 1)), children: prevLabel !== null && prevLabel !== void 0 ? prevLabel : 'Previous' }), jsxRuntime.jsx("button", { className: "button is-primary", disabled: value === totalSteps - 1, onClick: onNext !== null && onNext !== void 0 ? onNext : (() => onStepClick === null || onStepClick === void 0 ? void 0 : onStepClick(value + 1)), children: nextLabel !== null && nextLabel !== void 0 ? nextLabel : 'Next' })] }))] }));
1786
+ return (jsxRuntime.jsxs("div", { className: combinedClasses, ...rest, children: [jsxRuntime.jsx("ul", { className: listClasses, children: renderSteps() }), hasNavigation && (jsxRuntime.jsxs("div", { className: "steps-navigation", children: [jsxRuntime.jsx("button", { className: "button", disabled: value === 0, onClick: onPrev ?? (() => onStepClick?.(value - 1)), children: prevLabel ?? 'Previous' }), jsxRuntime.jsx("button", { className: "button is-primary", disabled: value === totalSteps - 1, onClick: onNext ?? (() => onStepClick?.(value + 1)), children: nextLabel ?? 'Next' })] }))] }));
1790
1787
  };
1791
1788
  Steps.Step = Step;
1792
1789
 
@@ -1907,10 +1904,10 @@ const Toast = React.forwardRef(({ message, type = 'default', actionType, positio
1907
1904
  const toastRef = React.useRef(null);
1908
1905
  const handleClose = React.useCallback(() => {
1909
1906
  setIsVisible(false);
1910
- onClose === null || onClose === void 0 ? void 0 : onClose();
1907
+ onClose?.();
1911
1908
  }, [onClose]);
1912
1909
  const handleAction = React.useCallback(() => {
1913
- onAction === null || onAction === void 0 ? void 0 : onAction();
1910
+ onAction?.();
1914
1911
  handleClose();
1915
1912
  }, [onAction, handleClose]);
1916
1913
  React.useEffect(() => {
@@ -2097,11 +2094,11 @@ const Dialog = React.forwardRef(({ isOpen, title, message, type = 'default', con
2097
2094
  const cancelRef = React.useRef(null);
2098
2095
  const handleCancel = React.useCallback(() => {
2099
2096
  if (canCancel) {
2100
- onCancel === null || onCancel === void 0 ? void 0 : onCancel();
2097
+ onCancel?.();
2101
2098
  }
2102
2099
  }, [canCancel, onCancel]);
2103
2100
  const handleConfirm = React.useCallback(() => {
2104
- onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm();
2101
+ onConfirm?.();
2105
2102
  }, [onConfirm]);
2106
2103
  const handleBackgroundClick = React.useCallback(() => {
2107
2104
  if (canCancel) {
@@ -2122,7 +2119,7 @@ const Dialog = React.forwardRef(({ isOpen, title, message, type = 'default', con
2122
2119
  React.useEffect(() => {
2123
2120
  if (isOpen) {
2124
2121
  const buttonToFocus = focusCancel && showCancel ? cancelRef.current : confirmRef.current;
2125
- buttonToFocus === null || buttonToFocus === void 0 ? void 0 : buttonToFocus.focus();
2122
+ buttonToFocus?.focus();
2126
2123
  }
2127
2124
  }, [isOpen, focusCancel, showCancel]);
2128
2125
  React.useEffect(() => {
@@ -2322,7 +2319,7 @@ const Carousel = React.forwardRef(({ value: controlledValue, autoplay = false, i
2322
2319
  if (syncDisplay) {
2323
2320
  setDisplayIndex(newIndex);
2324
2321
  }
2325
- onChange === null || onChange === void 0 ? void 0 : onChange(newIndex);
2322
+ onChange?.(newIndex);
2326
2323
  }, [controlledValue, itemCount, repeat, onChange]);
2327
2324
  const goToPrev = React.useCallback(() => {
2328
2325
  if (activeIndex === 0 && repeat && itemCount > 1) {
@@ -2410,8 +2407,7 @@ const Carousel = React.forwardRef(({ value: controlledValue, autoplay = false, i
2410
2407
  }, [handleDragEnd]);
2411
2408
  React.useEffect(() => {
2412
2409
  const handleKeyDown = (e) => {
2413
- var _a;
2414
- if (!((_a = carouselRef.current) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement)))
2410
+ if (!carouselRef.current?.contains(document.activeElement))
2415
2411
  return;
2416
2412
  switch (e.key) {
2417
2413
  case 'ArrowLeft':
@@ -3117,17 +3113,16 @@ const Checkbox = React.forwardRef(({ color, size, className, children, textColor
3117
3113
  ...props,
3118
3114
  });
3119
3115
  const group = useCheckboxesGroup();
3120
- const effectiveName = name !== null && name !== void 0 ? name : group === null || group === void 0 ? void 0 : group.name;
3121
- const groupManaged = (group === null || group === void 0 ? void 0 : group.value) !== undefined && value !== undefined;
3116
+ const effectiveName = name ?? group?.name;
3117
+ const groupManaged = group?.value !== undefined && value !== undefined;
3122
3118
  const groupHas = groupManaged && group.value.includes(String(value));
3123
3119
  const effectiveChecked = checked !== undefined ? checked : groupManaged ? groupHas : undefined;
3124
3120
  const effectiveDefaultChecked = groupManaged ? undefined : defaultChecked;
3125
3121
  const handleChange = React.useCallback((e) => {
3126
- var _a;
3127
- onChange === null || onChange === void 0 ? void 0 : onChange(e);
3128
- if ((group === null || group === void 0 ? void 0 : group.onChange) && value !== undefined) {
3122
+ onChange?.(e);
3123
+ if (group?.onChange && value !== undefined) {
3129
3124
  const valStr = String(value);
3130
- const currentArr = (_a = group.value) !== null && _a !== void 0 ? _a : [];
3125
+ const currentArr = group.value ?? [];
3131
3126
  const next = e.target.checked
3132
3127
  ? currentArr.includes(valStr)
3133
3128
  ? currentArr
@@ -3188,29 +3183,23 @@ const Field = ({ horizontal, grouped, hasAddons, narrow, label, labelSize, label
3188
3183
  'is-grouped-multiline': grouped === 'multiline',
3189
3184
  });
3190
3185
  const fieldClass = classNames(mainClass, bulmaHelperClasses, className);
3191
- const effectiveLabelSize = labelSize !== null && labelSize !== void 0 ? labelSize : (horizontal ? 'normal' : undefined);
3186
+ const effectiveLabelSize = labelSize ?? (horizontal ? 'normal' : undefined);
3192
3187
  const labelClass = usePrefixedClassNames('label');
3193
3188
  let renderedLabel = null;
3194
3189
  if (label) {
3195
3190
  if (horizontal) {
3196
- renderedLabel = (jsxRuntime.jsx(FieldLabel, { size: effectiveLabelSize, children: jsxRuntime.jsx("label", { ...labelProps, className: classNames(labelClass, labelProps === null || labelProps === void 0 ? void 0 : labelProps.className), style: labelProps === null || labelProps === void 0 ? void 0 : labelProps.style, children: label }) }));
3191
+ renderedLabel = (jsxRuntime.jsx(FieldLabel, { size: effectiveLabelSize, children: jsxRuntime.jsx("label", { ...labelProps, className: classNames(labelClass, labelProps?.className), style: labelProps?.style, children: label }) }));
3197
3192
  }
3198
3193
  else {
3199
- renderedLabel = (jsxRuntime.jsx("label", { ...labelProps, className: classNames(labelClass, labelProps === null || labelProps === void 0 ? void 0 : labelProps.className), style: { display: 'block', ...((labelProps === null || labelProps === void 0 ? void 0 : labelProps.style) || {}) }, children: label }));
3194
+ renderedLabel = (jsxRuntime.jsx("label", { ...labelProps, className: classNames(labelClass, labelProps?.className), style: { display: 'block', ...(labelProps?.style || {}) }, children: label }));
3200
3195
  }
3201
3196
  }
3202
3197
  let content = children;
3203
3198
  if (horizontal) {
3204
- const isFieldBody = (c) => {
3205
- var _a;
3206
- return React.isValidElement(c) &&
3207
- (c.type === FieldBody || ((_a = c.type) === null || _a === void 0 ? void 0 : _a.displayName) === 'FieldBody');
3208
- };
3209
- const isFieldLabel = (c) => {
3210
- var _a;
3211
- return React.isValidElement(c) &&
3212
- (c.type === FieldLabel || ((_a = c.type) === null || _a === void 0 ? void 0 : _a.displayName) === 'FieldLabel');
3213
- };
3199
+ const isFieldBody = (c) => React.isValidElement(c) &&
3200
+ (c.type === FieldBody || c.type?.displayName === 'FieldBody');
3201
+ const isFieldLabel = (c) => React.isValidElement(c) &&
3202
+ (c.type === FieldLabel || c.type?.displayName === 'FieldLabel');
3214
3203
  const childArray = React.Children.toArray(children);
3215
3204
  const userProvidedStructure = childArray.some(c => isFieldBody(c) || isFieldLabel(c));
3216
3205
  if (userProvidedStructure) {
@@ -3288,7 +3277,7 @@ const Checkboxes = ({ label, labelSize, labelProps, horizontal, message, message
3288
3277
  const handleChange = React.useCallback((newValues) => {
3289
3278
  if (!isControlled)
3290
3279
  setInternalValue(newValues);
3291
- onChange === null || onChange === void 0 ? void 0 : onChange(newValues);
3280
+ onChange?.(newValues);
3292
3281
  }, [isControlled, onChange]);
3293
3282
  const ctx = React.useMemo(() => ({
3294
3283
  name,
@@ -3357,8 +3346,8 @@ const Radio = React.forwardRef(({ color, size, className, children, textColor, d
3357
3346
  ...props,
3358
3347
  });
3359
3348
  const group = useRadiosGroup();
3360
- const effectiveName = name !== null && name !== void 0 ? name : group === null || group === void 0 ? void 0 : group.name;
3361
- const groupManaged = (group === null || group === void 0 ? void 0 : group.value) !== undefined && value !== undefined;
3349
+ const effectiveName = name ?? group?.name;
3350
+ const groupManaged = group?.value !== undefined && value !== undefined;
3362
3351
  const effectiveChecked = checked !== undefined
3363
3352
  ? checked
3364
3353
  : groupManaged
@@ -3366,8 +3355,8 @@ const Radio = React.forwardRef(({ color, size, className, children, textColor, d
3366
3355
  : undefined;
3367
3356
  const effectiveDefaultChecked = groupManaged ? undefined : defaultChecked;
3368
3357
  const handleChange = React.useCallback((e) => {
3369
- onChange === null || onChange === void 0 ? void 0 : onChange(e);
3370
- if ((group === null || group === void 0 ? void 0 : group.onChange) && value !== undefined) {
3358
+ onChange?.(e);
3359
+ if (group?.onChange && value !== undefined) {
3371
3360
  group.onChange(String(value));
3372
3361
  }
3373
3362
  }, [onChange, group, value]);
@@ -3399,7 +3388,7 @@ const Radios = ({ label, labelSize, labelProps, horizontal, message, messageColo
3399
3388
  const handleChange = React.useCallback((newValue) => {
3400
3389
  if (!isControlled)
3401
3390
  setInternalValue(newValue);
3402
- onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
3391
+ onChange?.(newValue);
3403
3392
  }, [isControlled, onChange]);
3404
3393
  const ctx = React.useMemo(() => ({
3405
3394
  name,
@@ -3465,7 +3454,6 @@ function getTickPositions(min, max, step, ticks, marks) {
3465
3454
  return positions;
3466
3455
  }
3467
3456
  const Slider = React.forwardRef((props, ref) => {
3468
- var _a, _b, _c;
3469
3457
  let range;
3470
3458
  let controlledValue;
3471
3459
  let defaultValue;
@@ -3480,7 +3468,7 @@ const Slider = React.forwardRef((props, ref) => {
3480
3468
  defaultValue = props.defaultValue;
3481
3469
  onChange = props.onChange;
3482
3470
  ariaLabel = props.ariaLabel;
3483
- minDistance = (_a = props.minDistance) !== null && _a !== void 0 ? _a : 0;
3471
+ minDistance = props.minDistance ?? 0;
3484
3472
  nameLow = props.nameLow;
3485
3473
  nameHigh = props.nameHigh;
3486
3474
  }
@@ -3495,9 +3483,9 @@ const Slider = React.forwardRef((props, ref) => {
3495
3483
  const insideField = useInsideField();
3496
3484
  const insideControl = useInsideControl();
3497
3485
  const { bulmaHelperClasses, rest } = useBulmaClasses(restProps);
3498
- const tooltipMode = tooltip !== null && tooltip !== void 0 ? tooltip : (showOutput ? 'auto' : 'hidden');
3499
- const [internalRange, setInternalRange] = React.useState(() => { var _a; return range ? ((_a = defaultValue) !== null && _a !== void 0 ? _a : [min, max]) : [min, min]; });
3500
- const [internalSingle, setInternalSingle] = React.useState(() => { var _a; return !range ? ((_a = defaultValue) !== null && _a !== void 0 ? _a : 0) : 0; });
3486
+ const tooltipMode = tooltip ?? (showOutput ? 'auto' : 'hidden');
3487
+ const [internalRange, setInternalRange] = React.useState(() => range ? (defaultValue ?? [min, max]) : [min, min]);
3488
+ const [internalSingle, setInternalSingle] = React.useState(() => !range ? (defaultValue ?? 0) : 0);
3501
3489
  const [showTooltip, setShowTooltip] = React.useState(false);
3502
3490
  const [showTooltipHigh, setShowTooltipHigh] = React.useState(false);
3503
3491
  const inputRef = React.useRef(null);
@@ -3539,7 +3527,7 @@ const Slider = React.forwardRef((props, ref) => {
3539
3527
  const newValue = parseFloat(e.target.value);
3540
3528
  if (!isControlled)
3541
3529
  setInternalSingle(newValue);
3542
- onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
3530
+ onChange?.(newValue);
3543
3531
  }, [isControlled, onChange]);
3544
3532
  const handleRangeLowChange = React.useCallback((e) => {
3545
3533
  const raw = parseFloat(e.target.value);
@@ -3547,7 +3535,7 @@ const Slider = React.forwardRef((props, ref) => {
3547
3535
  const newRange = [clamped, currentRange[1]];
3548
3536
  if (!isControlled)
3549
3537
  setInternalRange(newRange);
3550
- onChange === null || onChange === void 0 ? void 0 : onChange(newRange);
3538
+ onChange?.(newRange);
3551
3539
  }, [isControlled, onChange, currentRange, minDistance]);
3552
3540
  const handleRangeHighChange = React.useCallback((e) => {
3553
3541
  const raw = parseFloat(e.target.value);
@@ -3555,7 +3543,7 @@ const Slider = React.forwardRef((props, ref) => {
3555
3543
  const newRange = [currentRange[0], clamped];
3556
3544
  if (!isControlled)
3557
3545
  setInternalRange(newRange);
3558
- onChange === null || onChange === void 0 ? void 0 : onChange(newRange);
3546
+ onChange?.(newRange);
3559
3547
  }, [isControlled, onChange, currentRange, minDistance]);
3560
3548
  const handleKeyDown = React.useCallback((e) => {
3561
3549
  if (e.key === 'Home') {
@@ -3563,7 +3551,7 @@ const Slider = React.forwardRef((props, ref) => {
3563
3551
  if (!range) {
3564
3552
  if (!isControlled)
3565
3553
  setInternalSingle(min);
3566
- onChange === null || onChange === void 0 ? void 0 : onChange(min);
3554
+ onChange?.(min);
3567
3555
  }
3568
3556
  }
3569
3557
  else if (e.key === 'End') {
@@ -3571,7 +3559,7 @@ const Slider = React.forwardRef((props, ref) => {
3571
3559
  if (!range) {
3572
3560
  if (!isControlled)
3573
3561
  setInternalSingle(max);
3574
- onChange === null || onChange === void 0 ? void 0 : onChange(max);
3562
+ onChange?.(max);
3575
3563
  }
3576
3564
  }
3577
3565
  }, [range, isControlled, onChange, min, max]);
@@ -3758,7 +3746,7 @@ const Slider = React.forwardRef((props, ref) => {
3758
3746
  : {
3759
3747
  '--slider-progress-low': `${progressLow}%`,
3760
3748
  '--slider-progress-high': `${progressHigh}%`,
3761
- } }), jsxRuntime.jsx("input", { ref: combinedRef, type: "range", min: min, max: max, step: step, value: currentRange[0], disabled: disabled, onChange: handleRangeLowChange, onKeyDown: handleKeyDown, onMouseEnter: () => setShowTooltip(true), onMouseLeave: () => setShowTooltip(false), onFocus: () => setShowTooltip(true), onBlur: () => setShowTooltip(false), className: "slider-input slider-input-low", "aria-valuenow": currentRange[0], "aria-valuemin": min, "aria-valuemax": max, "aria-orientation": isVertical ? 'vertical' : undefined, "aria-label": (_b = ariaLabel === null || ariaLabel === void 0 ? void 0 : ariaLabel[0]) !== null && _b !== void 0 ? _b : 'Minimum value', ...getAriaProps(currentRange[0]), ...rest, ...(nameLow !== undefined ? { name: nameLow } : {}) }), jsxRuntime.jsx("input", { ref: inputHighRef, type: "range", min: min, max: max, step: step, value: currentRange[1], disabled: disabled, onChange: handleRangeHighChange, onMouseEnter: () => setShowTooltipHigh(true), onMouseLeave: () => setShowTooltipHigh(false), onFocus: () => setShowTooltipHigh(true), onBlur: () => setShowTooltipHigh(false), className: "slider-input slider-input-high", "aria-valuenow": currentRange[1], "aria-valuemin": min, "aria-valuemax": max, "aria-orientation": isVertical ? 'vertical' : undefined, "aria-label": (_c = ariaLabel === null || ariaLabel === void 0 ? void 0 : ariaLabel[1]) !== null && _c !== void 0 ? _c : 'Maximum value', ...getAriaProps(currentRange[1]), name: nameHigh }), tooltipMode !== 'hidden' && (jsxRuntime.jsx("output", { ref: outputRef, className: classNames('slider-output slider-output-low', {
3749
+ } }), jsxRuntime.jsx("input", { ref: combinedRef, type: "range", min: min, max: max, step: step, value: currentRange[0], disabled: disabled, onChange: handleRangeLowChange, onKeyDown: handleKeyDown, onMouseEnter: () => setShowTooltip(true), onMouseLeave: () => setShowTooltip(false), onFocus: () => setShowTooltip(true), onBlur: () => setShowTooltip(false), className: "slider-input slider-input-low", "aria-valuenow": currentRange[0], "aria-valuemin": min, "aria-valuemax": max, "aria-orientation": isVertical ? 'vertical' : undefined, "aria-label": ariaLabel?.[0] ?? 'Minimum value', ...getAriaProps(currentRange[0]), ...rest, ...(nameLow !== undefined ? { name: nameLow } : {}) }), jsxRuntime.jsx("input", { ref: inputHighRef, type: "range", min: min, max: max, step: step, value: currentRange[1], disabled: disabled, onChange: handleRangeHighChange, onMouseEnter: () => setShowTooltipHigh(true), onMouseLeave: () => setShowTooltipHigh(false), onFocus: () => setShowTooltipHigh(true), onBlur: () => setShowTooltipHigh(false), className: "slider-input slider-input-high", "aria-valuenow": currentRange[1], "aria-valuemin": min, "aria-valuemax": max, "aria-orientation": isVertical ? 'vertical' : undefined, "aria-label": ariaLabel?.[1] ?? 'Maximum value', ...getAriaProps(currentRange[1]), name: nameHigh }), tooltipMode !== 'hidden' && (jsxRuntime.jsx("output", { ref: outputRef, className: classNames('slider-output slider-output-low', {
3762
3750
  'is-visible': showTipLow,
3763
3751
  'is-flipped': flipped,
3764
3752
  'is-flipped-left': isVertical && verticalFlippedLeft,
@@ -3814,7 +3802,7 @@ const ArrowDropUp = () => (jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "
3814
3802
  const ArrowDropDown = () => (jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: jsxRuntime.jsx("path", { d: "M7 9.5l5 5 5-5" }) }));
3815
3803
  const Numberinput = React.forwardRef(({ label, labelSize, labelProps, horizontal, message, messageColor, fieldClassName, value: controlledValue, defaultValue, min, max, step = 1, size, color, inputColor, controlsPosition = 'both', controlsRounded = false, compact = false, bare, variant = 'plusminus', disabled = false, editable = true, isLoading = false, exponential = false, onChange, className, ...props }, ref) => {
3816
3804
  const insideField = useInsideField();
3817
- const effectiveBare = bare !== null && bare !== void 0 ? bare : insideField;
3805
+ const effectiveBare = bare ?? insideField;
3818
3806
  const { bulmaHelperClasses, rest } = useBulmaClasses(props);
3819
3807
  const [internalValue, setInternalValue] = React.useState(defaultValue);
3820
3808
  const inputRef = React.useRef(null);
@@ -3836,18 +3824,18 @@ const Numberinput = React.forwardRef(({ label, labelSize, labelProps, horizontal
3836
3824
  if (!isControlled) {
3837
3825
  setInternalValue(clampedValue);
3838
3826
  }
3839
- onChange === null || onChange === void 0 ? void 0 : onChange(clampedValue);
3827
+ onChange?.(clampedValue);
3840
3828
  }, [isControlled, clampValue, onChange]);
3841
3829
  const getEffectiveStep = React.useCallback(() => {
3842
3830
  if (!exponential)
3843
3831
  return step;
3844
- return step * Math.max(1, Math.floor(Math.abs(currentValue !== null && currentValue !== void 0 ? currentValue : 0)));
3832
+ return step * Math.max(1, Math.floor(Math.abs(currentValue ?? 0)));
3845
3833
  }, [exponential, step, currentValue]);
3846
3834
  const handleIncrement = React.useCallback(() => {
3847
- updateValue((currentValue !== null && currentValue !== void 0 ? currentValue : 0) + getEffectiveStep());
3835
+ updateValue((currentValue ?? 0) + getEffectiveStep());
3848
3836
  }, [currentValue, getEffectiveStep, updateValue]);
3849
3837
  const handleDecrement = React.useCallback(() => {
3850
- updateValue((currentValue !== null && currentValue !== void 0 ? currentValue : 0) - getEffectiveStep());
3838
+ updateValue((currentValue ?? 0) - getEffectiveStep());
3851
3839
  }, [currentValue, getEffectiveStep, updateValue]);
3852
3840
  const handleInputChange = React.useCallback((e) => {
3853
3841
  const newValue = parseFloat(e.target.value);
@@ -3910,7 +3898,7 @@ const Numberinput = React.forwardRef(({ label, labelSize, labelProps, horizontal
3910
3898
  ref.current = node;
3911
3899
  }
3912
3900
  };
3913
- const inputControl = (jsxRuntime.jsx("div", { className: expandedControlClasses, children: jsxRuntime.jsx("input", { ref: combinedRef, type: "number", className: inputClasses, value: currentValue !== null && currentValue !== void 0 ? currentValue : '', min: min, max: max, step: step, disabled: disabled, readOnly: !editable, onChange: handleInputChange, onKeyDown: handleKeyDown, "aria-valuenow": currentValue !== null && currentValue !== void 0 ? currentValue : undefined, "aria-valuemin": min, "aria-valuemax": max, ...rest }) }));
3901
+ const inputControl = (jsxRuntime.jsx("div", { className: expandedControlClasses, children: jsxRuntime.jsx("input", { ref: combinedRef, type: "number", className: inputClasses, value: currentValue ?? '', min: min, max: max, step: step, disabled: disabled, readOnly: !editable, onChange: handleInputChange, onKeyDown: handleKeyDown, "aria-valuenow": currentValue ?? undefined, "aria-valuemin": min, "aria-valuemax": max, ...rest }) }));
3914
3902
  if (isStepper) {
3915
3903
  const stepperElement = (jsxRuntime.jsxs("div", { className: combinedClasses, children: [inputControl, jsxRuntime.jsx("div", { className: controlClasses, children: jsxRuntime.jsxs("div", { className: stepperClasses, children: [jsxRuntime.jsx("button", { type: "button", className: stepperButtonClasses, onClick: handleIncrement, disabled: disabled || isAtMax, tabIndex: -1, "aria-label": "Increase value", children: jsxRuntime.jsx(ArrowDropUp, {}) }), jsxRuntime.jsx("button", { type: "button", className: stepperButtonClasses, onClick: handleDecrement, disabled: disabled || isAtMin, tabIndex: -1, "aria-label": "Decrease value", children: jsxRuntime.jsx(ArrowDropDown, {}) })] }) })] }));
3916
3904
  if (!insideField) {
@@ -3978,7 +3966,7 @@ const Rate = React.forwardRef(({ label, labelSize, labelProps, horizontal, messa
3978
3966
  if (!isControlled) {
3979
3967
  setInternalValue(finalValue);
3980
3968
  }
3981
- onChange === null || onChange === void 0 ? void 0 : onChange(finalValue);
3969
+ onChange?.(finalValue);
3982
3970
  }, [isControlled, currentValue, disabled, onChange]);
3983
3971
  const handleClick = React.useCallback((iconIndex, e) => {
3984
3972
  if (disabled)
@@ -4043,7 +4031,7 @@ const Rate = React.forwardRef(({ label, labelSize, labelProps, horizontal, messa
4043
4031
  if (!isControlled) {
4044
4032
  setInternalValue(newValue);
4045
4033
  }
4046
- onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
4034
+ onChange?.(newValue);
4047
4035
  }
4048
4036
  }, [currentValue, max, precision, disabled, isControlled, onChange]);
4049
4037
  const getText = () => {
@@ -4093,7 +4081,7 @@ const Rate = React.forwardRef(({ label, labelSize, labelProps, horizontal, messa
4093
4081
  const iconProps = {
4094
4082
  index: iconIndex,
4095
4083
  isActive: fillPercent > 0,
4096
- isHovered: hoverValue !== null && iconIndex < (hoverValue !== null && hoverValue !== void 0 ? hoverValue : 0),
4084
+ isHovered: hoverValue !== null && iconIndex < (hoverValue ?? 0),
4097
4085
  value: displayValue,
4098
4086
  fillPercent,
4099
4087
  };
@@ -4176,7 +4164,7 @@ const Autocomplete = React.forwardRef(({ data = [], value: controlledValue, plac
4176
4164
  if (controlledValue === undefined) {
4177
4165
  setInternalValue(newValue);
4178
4166
  }
4179
- onInput === null || onInput === void 0 ? void 0 : onInput(newValue);
4167
+ onInput?.(newValue);
4180
4168
  if (!isActive && newValue) {
4181
4169
  setIsActive(true);
4182
4170
  }
@@ -4188,21 +4176,20 @@ const Autocomplete = React.forwardRef(({ data = [], value: controlledValue, plac
4188
4176
  if (controlledValue === undefined) {
4189
4177
  setInternalValue(displayValue);
4190
4178
  }
4191
- onInput === null || onInput === void 0 ? void 0 : onInput(displayValue);
4192
- onSelect === null || onSelect === void 0 ? void 0 : onSelect(item);
4179
+ onInput?.(displayValue);
4180
+ onSelect?.(item);
4193
4181
  if (!keepOpen) {
4194
4182
  setIsActive(false);
4195
4183
  }
4196
4184
  setHighlightedIndex(-1);
4197
4185
  }, [controlledValue, field, keepOpen, onInput, onSelect]);
4198
4186
  const handleClear = React.useCallback(() => {
4199
- var _a;
4200
4187
  if (controlledValue === undefined) {
4201
4188
  setInternalValue('');
4202
4189
  }
4203
- onInput === null || onInput === void 0 ? void 0 : onInput('');
4204
- onSelect === null || onSelect === void 0 ? void 0 : onSelect(null);
4205
- (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
4190
+ onInput?.('');
4191
+ onSelect?.(null);
4192
+ inputRef.current?.focus();
4206
4193
  }, [controlledValue, onInput, onSelect]);
4207
4194
  const handleFocus = React.useCallback(() => {
4208
4195
  if (openOnFocus && !disabled) {
@@ -4234,7 +4221,7 @@ const Autocomplete = React.forwardRef(({ data = [], value: controlledValue, plac
4234
4221
  handleSelect,
4235
4222
  ]);
4236
4223
  React.useEffect(() => {
4237
- onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(isActive);
4224
+ onActiveChange?.(isActive);
4238
4225
  }, [isActive, onActiveChange]);
4239
4226
  React.useEffect(() => {
4240
4227
  if (keepFirst && isActive && filteredData.length > 0) {
@@ -4282,7 +4269,7 @@ const Autocomplete = React.forwardRef(({ data = [], value: controlledValue, plac
4282
4269
  return;
4283
4270
  const { scrollTop, scrollHeight, clientHeight } = dropdownRef.current;
4284
4271
  if (scrollHeight - scrollTop - clientHeight <= infiniteScrollDistance) {
4285
- onInfiniteScroll === null || onInfiniteScroll === void 0 ? void 0 : onInfiniteScroll();
4272
+ onInfiniteScroll?.();
4286
4273
  }
4287
4274
  }, [checkInfiniteScroll, infiniteScrollDistance, onInfiniteScroll]);
4288
4275
  React.useEffect(() => {
@@ -4388,7 +4375,7 @@ const Taginput = React.forwardRef(({ label, labelSize, labelProps, horizontal, m
4388
4375
  if (controlledValue === undefined) {
4389
4376
  setInternalTags(newTags);
4390
4377
  }
4391
- onChange === null || onChange === void 0 ? void 0 : onChange(newTags);
4378
+ onChange?.(newTags);
4392
4379
  }, [controlledValue, onChange]);
4393
4380
  const addTag = React.useCallback((value) => {
4394
4381
  if (disabled || readonly)
@@ -4412,7 +4399,7 @@ const Taginput = React.forwardRef(({ label, labelSize, labelProps, horizontal, m
4412
4399
  const finalTag = createTag ? createTag(displayValue) : tagValue;
4413
4400
  const newTags = [...tags, finalTag];
4414
4401
  updateTags(newTags);
4415
- onAdd === null || onAdd === void 0 ? void 0 : onAdd(finalTag);
4402
+ onAdd?.(finalTag);
4416
4403
  setInputValue('');
4417
4404
  if (!keepOpen) {
4418
4405
  setIsActive(false);
@@ -4439,7 +4426,7 @@ const Taginput = React.forwardRef(({ label, labelSize, labelProps, horizontal, m
4439
4426
  const removedTag = tags[index];
4440
4427
  const newTags = tags.filter((_, i) => i !== index);
4441
4428
  updateTags(newTags);
4442
- onRemove === null || onRemove === void 0 ? void 0 : onRemove(removedTag, index);
4429
+ onRemove?.(removedTag, index);
4443
4430
  }, [disabled, readonly, tags, updateTags, onRemove]);
4444
4431
  const handleInputChange = React.useCallback((e) => {
4445
4432
  const newValue = e.target.value;
@@ -4452,7 +4439,7 @@ const Taginput = React.forwardRef(({ label, labelSize, labelProps, horizontal, m
4452
4439
  return;
4453
4440
  }
4454
4441
  setInputValue(newValue);
4455
- onTyping === null || onTyping === void 0 ? void 0 : onTyping(newValue);
4442
+ onTyping?.(newValue);
4456
4443
  if (newValue && data.length > 0) {
4457
4444
  setIsActive(true);
4458
4445
  }
@@ -4557,8 +4544,7 @@ const Taginput = React.forwardRef(({ label, labelSize, labelProps, horizontal, m
4557
4544
  }
4558
4545
  }, [ref]);
4559
4546
  const handleContainerClick = React.useCallback(() => {
4560
- var _a;
4561
- (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
4547
+ inputRef.current?.focus();
4562
4548
  }, []);
4563
4549
  const taginputClasses = pcn('taginput', {
4564
4550
  'is-active': isActive,
@@ -4766,7 +4752,7 @@ const DEFAULT_PICKER_LABELS = {
4766
4752
  };
4767
4753
  const mergeLabels = (overrides) => ({
4768
4754
  ...DEFAULT_PICKER_LABELS,
4769
- ...(overrides !== null && overrides !== void 0 ? overrides : {}),
4755
+ ...(overrides ?? {}),
4770
4756
  });
4771
4757
 
4772
4758
  const DEFAULT_DATE_FORMAT = 'YYYY-MM-DD';
@@ -4824,19 +4810,19 @@ function formatWithIntl(d, options, locale) {
4824
4810
  return new Intl.DateTimeFormat(locale, options).format(d);
4825
4811
  }
4826
4812
  function formatDate(d, fmt, locale) {
4827
- const f = fmt !== null && fmt !== void 0 ? fmt : DEFAULT_DATE_FORMAT;
4813
+ const f = fmt ?? DEFAULT_DATE_FORMAT;
4828
4814
  if (typeof f === 'string')
4829
4815
  return formatTokenString(d, f);
4830
4816
  return formatWithIntl(d, f, locale);
4831
4817
  }
4832
4818
  function formatTime(d, fmt, locale) {
4833
- const f = fmt !== null && fmt !== void 0 ? fmt : DEFAULT_TIME_FORMAT_24;
4819
+ const f = fmt ?? DEFAULT_TIME_FORMAT_24;
4834
4820
  if (typeof f === 'string')
4835
4821
  return formatTokenString(d, f);
4836
4822
  return formatWithIntl(d, f, locale);
4837
4823
  }
4838
4824
  function formatDateTime(d, fmt, locale) {
4839
- const f = fmt !== null && fmt !== void 0 ? fmt : DEFAULT_DATETIME_FORMAT;
4825
+ const f = fmt ?? DEFAULT_DATETIME_FORMAT;
4840
4826
  if (typeof f === 'string')
4841
4827
  return formatTokenString(d, f);
4842
4828
  return formatWithIntl(d, f, locale);
@@ -4853,19 +4839,18 @@ function hourCycleFromFormat(fmt) {
4853
4839
  return null;
4854
4840
  }
4855
4841
  function parseDate(s, fmt, _locale) {
4856
- var _a, _b, _c, _d, _e, _f;
4857
4842
  if (!s)
4858
4843
  return null;
4859
- const format = fmt !== null && fmt !== void 0 ? fmt : DEFAULT_DATE_FORMAT;
4844
+ const format = fmt ?? DEFAULT_DATE_FORMAT;
4860
4845
  const parts = parseTokens(s, format);
4861
4846
  if (!parts)
4862
4847
  return null;
4863
- const year = (_a = parts.year) !== null && _a !== void 0 ? _a : new Date().getFullYear();
4864
- const month = ((_b = parts.month) !== null && _b !== void 0 ? _b : 1) - 1;
4865
- const day = (_c = parts.day) !== null && _c !== void 0 ? _c : 1;
4866
- const hours = (_d = parts.hours) !== null && _d !== void 0 ? _d : 0;
4867
- const minutes = (_e = parts.minutes) !== null && _e !== void 0 ? _e : 0;
4868
- const seconds = (_f = parts.seconds) !== null && _f !== void 0 ? _f : 0;
4848
+ const year = parts.year ?? new Date().getFullYear();
4849
+ const month = (parts.month ?? 1) - 1;
4850
+ const day = parts.day ?? 1;
4851
+ const hours = parts.hours ?? 0;
4852
+ const minutes = parts.minutes ?? 0;
4853
+ const seconds = parts.seconds ?? 0;
4869
4854
  const d = new Date(year, month, day, hours, minutes, seconds, 0);
4870
4855
  if (d.getFullYear() !== year ||
4871
4856
  d.getMonth() !== month ||
@@ -4875,15 +4860,14 @@ function parseDate(s, fmt, _locale) {
4875
4860
  return d;
4876
4861
  }
4877
4862
  function parseTime(s, fmt) {
4878
- var _a, _b, _c;
4879
4863
  if (!s)
4880
4864
  return null;
4881
- const format = fmt !== null && fmt !== void 0 ? fmt : DEFAULT_TIME_FORMAT_24;
4865
+ const format = fmt ?? DEFAULT_TIME_FORMAT_24;
4882
4866
  const parts = parseTokens(s, format);
4883
4867
  if (!parts)
4884
4868
  return null;
4885
4869
  const today = new Date();
4886
- return new Date(today.getFullYear(), today.getMonth(), today.getDate(), (_a = parts.hours) !== null && _a !== void 0 ? _a : 0, (_b = parts.minutes) !== null && _b !== void 0 ? _b : 0, (_c = parts.seconds) !== null && _c !== void 0 ? _c : 0, 0);
4870
+ return new Date(today.getFullYear(), today.getMonth(), today.getDate(), parts.hours ?? 0, parts.minutes ?? 0, parts.seconds ?? 0, 0);
4887
4871
  }
4888
4872
  function escapeRegExp(s) {
4889
4873
  return s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
@@ -5157,9 +5141,9 @@ const Calendar = ({ value, focusedDate, onSelect, onFocusedDateChange, min, max,
5157
5141
  const isDateUnselectable = React.useCallback((d) => {
5158
5142
  if (!isWithin(d, min, max))
5159
5143
  return true;
5160
- if (shouldDisableDate === null || shouldDisableDate === void 0 ? void 0 : shouldDisableDate(d))
5144
+ if (shouldDisableDate?.(d))
5161
5145
  return true;
5162
- if (unselectableDates === null || unselectableDates === void 0 ? void 0 : unselectableDates.some(u => isSameDay(u, d)))
5146
+ if (unselectableDates?.some(u => isSameDay(u, d)))
5163
5147
  return true;
5164
5148
  return false;
5165
5149
  }, [min, max, shouldDisableDate, unselectableDates]);
@@ -5256,7 +5240,7 @@ const Calendar = ({ value, focusedDate, onSelect, onFocusedDateChange, min, max,
5256
5240
  const focusedYear = focusedDate.getFullYear();
5257
5241
  const minYear = min ? min.getFullYear() : focusedYear - 100;
5258
5242
  const maxYear = max ? max.getFullYear() : focusedYear + 100;
5259
- const [lo, hi] = yearsRange !== null && yearsRange !== void 0 ? yearsRange : [minYear, maxYear];
5243
+ const [lo, hi] = yearsRange ?? [minYear, maxYear];
5260
5244
  const start = Math.max(lo, minYear);
5261
5245
  const end = Math.min(hi, maxYear);
5262
5246
  const out = [];
@@ -5276,14 +5260,14 @@ const Calendar = ({ value, focusedDate, onSelect, onFocusedDateChange, min, max,
5276
5260
  if (!autoFocusCell || !gridRef.current)
5277
5261
  return;
5278
5262
  const target = gridRef.current.querySelector('[data-focused="true"]');
5279
- target === null || target === void 0 ? void 0 : target.focus();
5263
+ target?.focus();
5280
5264
  }, [autoFocusCell, focusedDate, view]);
5281
5265
  React.useEffect(() => {
5282
5266
  if (view !== 'years' || !yearGridRef.current)
5283
5267
  return;
5284
5268
  const sel = yearGridRef.current.querySelector('[data-focused-year="true"]');
5285
- sel === null || sel === void 0 ? void 0 : sel.scrollIntoView({ block: 'center' });
5286
- sel === null || sel === void 0 ? void 0 : sel.focus();
5269
+ sel?.scrollIntoView({ block: 'center' });
5270
+ sel?.focus();
5287
5271
  }, [view]);
5288
5272
  const focusedYear = focusedDate.getFullYear();
5289
5273
  const todayYear = new Date().getFullYear();
@@ -5342,13 +5326,12 @@ function useFocusTrap(containerRef, active, options = {}) {
5342
5326
  ? document.activeElement
5343
5327
  : null;
5344
5328
  const focusInitial = () => {
5345
- var _a;
5346
- if (initialFocusRef === null || initialFocusRef === void 0 ? void 0 : initialFocusRef.current) {
5329
+ if (initialFocusRef?.current) {
5347
5330
  initialFocusRef.current.focus();
5348
5331
  return;
5349
5332
  }
5350
5333
  const focusables = Array.from(container.querySelectorAll(FOCUSABLE_SELECTOR)).filter(el => !el.hasAttribute('disabled'));
5351
- const target = (_a = focusables[0]) !== null && _a !== void 0 ? _a : container;
5334
+ const target = focusables[0] ?? container;
5352
5335
  target.focus();
5353
5336
  };
5354
5337
  focusInitial();
@@ -5375,7 +5358,7 @@ function useFocusTrap(containerRef, active, options = {}) {
5375
5358
  container.addEventListener('keydown', handleKeyDown);
5376
5359
  return () => {
5377
5360
  container.removeEventListener('keydown', handleKeyDown);
5378
- if (restoreFocus && (previouslyFocused === null || previouslyFocused === void 0 ? void 0 : previouslyFocused.focus)) {
5361
+ if (restoreFocus && previouslyFocused?.focus) {
5379
5362
  previouslyFocused.focus();
5380
5363
  }
5381
5364
  };
@@ -5749,13 +5732,12 @@ function setAmPm(currentDate, isPm) {
5749
5732
  return next;
5750
5733
  }
5751
5734
  function segmentIndexAtCaret(map, caret) {
5752
- var _a;
5753
5735
  for (const idx of map.editable) {
5754
5736
  const s = map.segments[idx];
5755
5737
  if (caret >= s.start && caret <= s.end)
5756
5738
  return idx;
5757
5739
  }
5758
- let bestIdx = (_a = map.editable[0]) !== null && _a !== void 0 ? _a : null;
5740
+ let bestIdx = map.editable[0] ?? null;
5759
5741
  let bestDist = Infinity;
5760
5742
  for (const idx of map.editable) {
5761
5743
  const s = map.segments[idx];
@@ -5775,8 +5757,8 @@ function useSegmentedEntry(params) {
5775
5757
  const [activeSegmentIdx, setActiveSegmentIdx] = React.useState(null);
5776
5758
  const typedDigitsRef = React.useRef('');
5777
5759
  const segmentEditable = !!segmentMap && !!editable && !disabled && !readOnly;
5778
- const segmentBaseDate = React.useCallback(() => value !== null && value !== void 0 ? value : makeBaseDate(), [value, makeBaseDate]);
5779
- const isAllowed = React.useCallback((d) => isWithin(d, min, max) && !(isBlocked === null || isBlocked === void 0 ? void 0 : isBlocked(d)), [min, max, isBlocked]);
5760
+ const segmentBaseDate = React.useCallback(() => value ?? makeBaseDate(), [value, makeBaseDate]);
5761
+ const isAllowed = React.useCallback((d) => isWithin(d, min, max) && !isBlocked?.(d), [min, max, isBlocked]);
5780
5762
  const applyDateFromSegment = React.useCallback((next) => {
5781
5763
  if (!isAllowed(next))
5782
5764
  return;
@@ -5819,7 +5801,7 @@ function useSegmentedEntry(params) {
5819
5801
  containerRef.current !== null &&
5820
5802
  containerRef.current.contains(nextFocus);
5821
5803
  if (stayingInPicker) {
5822
- onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
5804
+ onBlur?.(e);
5823
5805
  return;
5824
5806
  }
5825
5807
  setActiveSegmentIdx(null);
@@ -5831,7 +5813,7 @@ function useSegmentedEntry(params) {
5831
5813
  else {
5832
5814
  setText(value ? formatFn(value, format, locale) : '');
5833
5815
  }
5834
- onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
5816
+ onBlur?.(e);
5835
5817
  }, [
5836
5818
  containerRef,
5837
5819
  tryParse,
@@ -5855,7 +5837,7 @@ function useSegmentedEntry(params) {
5855
5837
  typedDigitsRef.current = '';
5856
5838
  setActiveSegmentIdx(segmentMap.editable[0]);
5857
5839
  }
5858
- onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
5840
+ onFocus?.(e);
5859
5841
  }, [
5860
5842
  openOnFocus,
5861
5843
  popover,
@@ -5873,18 +5855,17 @@ function useSegmentedEntry(params) {
5873
5855
  onFocus,
5874
5856
  ]);
5875
5857
  const handleClick = React.useCallback((e) => {
5876
- var _a;
5877
5858
  if (openOnFocus && popover && !disabled && !readOnly)
5878
5859
  setOpen(true);
5879
5860
  if (segmentEditable && segmentMap && inputRef.current) {
5880
- const caret = (_a = inputRef.current.selectionStart) !== null && _a !== void 0 ? _a : 0;
5861
+ const caret = inputRef.current.selectionStart ?? 0;
5881
5862
  const idx = segmentIndexAtCaret(segmentMap, caret);
5882
5863
  if (idx !== null && idx !== activeSegmentIdx) {
5883
5864
  typedDigitsRef.current = '';
5884
5865
  setActiveSegmentIdx(idx);
5885
5866
  }
5886
5867
  }
5887
- onClick === null || onClick === void 0 ? void 0 : onClick(e);
5868
+ onClick?.(e);
5888
5869
  }, [
5889
5870
  openOnFocus,
5890
5871
  popover,
@@ -6002,7 +5983,7 @@ function useSegmentedEntry(params) {
6002
5983
  setOpen(false);
6003
5984
  }
6004
5985
  }
6005
- onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(e);
5986
+ onKeyDown?.(e);
6006
5987
  }, [
6007
5988
  inSegmentMode,
6008
5989
  segmentMap,
@@ -6046,9 +6027,9 @@ const DateInputBase = React.forwardRef((props, ref) => {
6046
6027
  const { value: controlledValue, defaultValue, onChange, onOpen, onClose, min, max, disabled, readOnly, placeholder, format, parse, locale, inline = false, mobileNative = 'auto', editable = true, popover = true, openOnFocus = true, closeOnSelect = true, position = 'bottom-left', appendToBody = false, color, size, isRounded, shouldDisableDate, unselectableDates, firstDayOfWeek = 0, dayNames, monthNames, nearbyMonthDays = true, className, name, form, required, id, onFocus, onClick, onKeyDown, onBlur, iconLeftName: _iconLeftName, triggerIcon = true, triggerIconName = 'chevron-down', labels, ...rest } = props;
6047
6028
  const t = mergeLabels(labels);
6048
6029
  const isControlled = controlledValue !== undefined;
6049
- const [internalValue, setInternalValue] = React.useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);
6050
- const value = isControlled ? (controlledValue !== null && controlledValue !== void 0 ? controlledValue : null) : internalValue;
6051
- const initialFocused = React.useMemo(() => clampDate(value !== null && value !== void 0 ? value : new Date(), min, max), []);
6030
+ const [internalValue, setInternalValue] = React.useState(defaultValue ?? null);
6031
+ const value = isControlled ? (controlledValue ?? null) : internalValue;
6032
+ const initialFocused = React.useMemo(() => clampDate(value ?? new Date(), min, max), []);
6052
6033
  const [focusedDate, setFocusedDate] = React.useState(initialFocused);
6053
6034
  React.useEffect(() => {
6054
6035
  setFocusedDate(prev => clampDate(prev, min, max));
@@ -6076,9 +6057,9 @@ const DateInputBase = React.forwardRef((props, ref) => {
6076
6057
  if (prev === next)
6077
6058
  return prev;
6078
6059
  if (next)
6079
- onOpen === null || onOpen === void 0 ? void 0 : onOpen();
6060
+ onOpen?.();
6080
6061
  else
6081
- onClose === null || onClose === void 0 ? void 0 : onClose();
6062
+ onClose?.();
6082
6063
  return next;
6083
6064
  });
6084
6065
  }, [onOpen, onClose]);
@@ -6090,7 +6071,7 @@ const DateInputBase = React.forwardRef((props, ref) => {
6090
6071
  setInternalValue(next);
6091
6072
  if (next)
6092
6073
  setFocusedDate(next);
6093
- onChange === null || onChange === void 0 ? void 0 : onChange(next);
6074
+ onChange?.(next);
6094
6075
  }, [isControlled, onChange]);
6095
6076
  const handleSelect = React.useCallback((d) => {
6096
6077
  if (!isWithin(d, min, max))
@@ -6107,7 +6088,7 @@ const DateInputBase = React.forwardRef((props, ref) => {
6107
6088
  const fmt = typeof format === 'string' ? format : undefined;
6108
6089
  return parse
6109
6090
  ? parse(trimmed)
6110
- : parseDate(trimmed, fmt !== null && fmt !== void 0 ? fmt : DEFAULT_DATE_FORMAT);
6091
+ : parseDate(trimmed, fmt ?? DEFAULT_DATE_FORMAT);
6111
6092
  }, [parse, format, locale]);
6112
6093
  const makeBaseDate = React.useCallback(() => {
6113
6094
  const d = new Date();
@@ -6117,13 +6098,13 @@ const DateInputBase = React.forwardRef((props, ref) => {
6117
6098
  const inputReadOnlyAttr = !!readOnly || !editable;
6118
6099
  const canOpen = !!popover && !disabled && !readOnly;
6119
6100
  const isBlocked = React.useMemo(() => {
6120
- if (!shouldDisableDate && !(unselectableDates === null || unselectableDates === void 0 ? void 0 : unselectableDates.length))
6101
+ if (!shouldDisableDate && !unselectableDates?.length)
6121
6102
  return undefined;
6122
- return (d) => !!(shouldDisableDate === null || shouldDisableDate === void 0 ? void 0 : shouldDisableDate(d)) ||
6123
- !!(unselectableDates === null || unselectableDates === void 0 ? void 0 : unselectableDates.some(u => isSameDay(u, d)));
6103
+ return (d) => !!shouldDisableDate?.(d) ||
6104
+ !!unselectableDates?.some(u => isSameDay(u, d));
6124
6105
  }, [shouldDisableDate, unselectableDates]);
6125
6106
  const { inputHandlers } = useSegmentedEntry({
6126
- format: format !== null && format !== void 0 ? format : DEFAULT_DATE_FORMAT,
6107
+ format: format ?? DEFAULT_DATE_FORMAT,
6127
6108
  value,
6128
6109
  commitValue,
6129
6110
  formatFn: formatDate,
@@ -6178,13 +6159,12 @@ const DateInputBase = React.forwardRef((props, ref) => {
6178
6159
  DateInputBase.displayName = 'DateInputBase';
6179
6160
 
6180
6161
  const DateInput = React.forwardRef(({ label, labelSize, labelProps, horizontal, iconLeft, iconRight, iconLeftName = 'calendar', iconRightName, iconLeftSize, iconRightSize, hasIconsLeft, hasIconsRight, isLoading, isExpanded, controlSize, message, messageColor, fieldClassName, controlClassName, ...baseProps }, ref) => {
6181
- var _a;
6182
6162
  const insideField = useInsideField();
6183
6163
  const insideControl = useInsideControl();
6184
6164
  const helpClass = usePrefixedClassNames('help', {
6185
6165
  [`is-${messageColor}`]: !!messageColor,
6186
6166
  });
6187
- let content = (jsxRuntime.jsx(DateInputBase, { ref: ref, ...baseProps, triggerIcon: (_a = baseProps.triggerIcon) !== null && _a !== void 0 ? _a : !isLoading }));
6167
+ let content = (jsxRuntime.jsx(DateInputBase, { ref: ref, ...baseProps, triggerIcon: baseProps.triggerIcon ?? !isLoading }));
6188
6168
  if (!insideControl && !baseProps.inline) {
6189
6169
  content = (jsxRuntime.jsx(Control, { iconLeft: iconLeft, iconRight: iconRight, iconLeftName: iconLeftName, iconRightName: iconRightName, iconLeftSize: iconLeftSize, iconRightSize: iconRightSize, hasIconsLeft: hasIconsLeft || !!iconLeftName, hasIconsRight: hasIconsRight, isLoading: isLoading, isExpanded: isExpanded, size: controlSize, className: controlClassName, children: content }));
6190
6170
  }
@@ -6209,11 +6189,10 @@ const tickHaptic = () => {
6209
6189
 
6210
6190
  let audioCtx = null;
6211
6191
  const getAudioContextCtor = () => {
6212
- var _a, _b;
6213
6192
  if (typeof window === 'undefined')
6214
6193
  return null;
6215
6194
  const w = window;
6216
- return (_b = (_a = w.AudioContext) !== null && _a !== void 0 ? _a : w.webkitAudioContext) !== null && _b !== void 0 ? _b : null;
6195
+ return w.AudioContext ?? w.webkitAudioContext ?? null;
6217
6196
  };
6218
6197
  const ensureAudioCtx = () => {
6219
6198
  if (audioCtx)
@@ -6293,11 +6272,10 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
6293
6272
  const audioTickEnabledRef = React.useRef(audioTick);
6294
6273
  audioTickEnabledRef.current = audioTick;
6295
6274
  const playBandPulse = React.useCallback(() => {
6296
- var _a;
6297
6275
  const el = bandRef.current;
6298
6276
  if (!el || typeof el.animate !== 'function')
6299
6277
  return;
6300
- if ((_a = reducedMotionMqlRef.current) === null || _a === void 0 ? void 0 : _a.matches)
6278
+ if (reducedMotionMqlRef.current?.matches)
6301
6279
  return;
6302
6280
  pulseAnimRef.current = el.animate([
6303
6281
  { transform: 'scale(1)', filter: 'brightness(1)' },
@@ -6333,15 +6311,13 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
6333
6311
  }
6334
6312
  }, []);
6335
6313
  React.useEffect(() => () => {
6336
- var _a;
6337
6314
  cancelRaf();
6338
- (_a = pulseAnimRef.current) === null || _a === void 0 ? void 0 : _a.cancel();
6315
+ pulseAnimRef.current?.cancel();
6339
6316
  pulseAnimRef.current = null;
6340
6317
  }, [cancelRaf]);
6341
6318
  React.useImperativeHandle(ref, () => ({
6342
- focus: () => { var _a; return (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.focus(); },
6319
+ focus: () => rootRef.current?.focus(),
6343
6320
  startDrag: (pointerId, clientY) => {
6344
- var _a;
6345
6321
  if (disabled)
6346
6322
  return;
6347
6323
  cancelRaf();
@@ -6356,7 +6332,7 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
6356
6332
  samples: [{ t: now, y: clientY }],
6357
6333
  };
6358
6334
  try {
6359
- (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.setPointerCapture(pointerId);
6335
+ rootRef.current?.setPointerCapture(pointerId);
6360
6336
  }
6361
6337
  catch {
6362
6338
  }
@@ -6446,15 +6422,15 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
6446
6422
  break;
6447
6423
  case 'ArrowLeft':
6448
6424
  e.preventDefault();
6449
- onFocusPrev === null || onFocusPrev === void 0 ? void 0 : onFocusPrev();
6425
+ onFocusPrev?.();
6450
6426
  break;
6451
6427
  case 'ArrowRight':
6452
6428
  e.preventDefault();
6453
- onFocusNext === null || onFocusNext === void 0 ? void 0 : onFocusNext();
6429
+ onFocusNext?.();
6454
6430
  break;
6455
6431
  case 'Enter':
6456
6432
  e.preventDefault();
6457
- onCommit === null || onCommit === void 0 ? void 0 : onCommit();
6433
+ onCommit?.();
6458
6434
  break;
6459
6435
  }
6460
6436
  }, [
@@ -6580,7 +6556,6 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
6580
6556
  };
6581
6557
  };
6582
6558
  const onPointerMove = (e) => {
6583
- var _a;
6584
6559
  const s = dragStateRef.current;
6585
6560
  if (s.pointerId !== e.pointerId)
6586
6561
  return;
@@ -6588,7 +6563,7 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
6588
6563
  if (!s.captured) {
6589
6564
  if (Math.abs(dy) < DRAG_THRESHOLD_PX)
6590
6565
  return;
6591
- (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.setPointerCapture(e.pointerId);
6566
+ rootRef.current?.setPointerCapture(e.pointerId);
6592
6567
  s.captured = true;
6593
6568
  setIsDragging(true);
6594
6569
  }
@@ -6601,13 +6576,12 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
6601
6576
  commitPosition(s.startPosition - dy / itemHeight);
6602
6577
  };
6603
6578
  const onPointerUp = (e) => {
6604
- var _a, _b;
6605
6579
  const s = dragStateRef.current;
6606
6580
  if (s.pointerId !== e.pointerId)
6607
6581
  return;
6608
6582
  if (s.captured) {
6609
- (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.releasePointerCapture(e.pointerId);
6610
- (_b = rootRef.current) === null || _b === void 0 ? void 0 : _b.focus();
6583
+ rootRef.current?.releasePointerCapture(e.pointerId);
6584
+ rootRef.current?.focus();
6611
6585
  const samples = s.samples;
6612
6586
  let pxPerMs = 0;
6613
6587
  if (samples.length >= 2) {
@@ -6674,15 +6648,13 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
6674
6648
  height: itemHeight,
6675
6649
  top: `${top}px`,
6676
6650
  }, disabled: itemDisabled, onClick: () => {
6677
- var _a;
6678
6651
  moveBy(vIdx - virtualIdx);
6679
- (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.focus();
6652
+ rootRef.current?.focus();
6680
6653
  }, children: formatLabel(values[aIdx]) }, vIdx));
6681
6654
  })] }));
6682
6655
  };
6683
6656
  const Wheel = React.forwardRef(WheelInner);
6684
6657
  const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false, incrementHours = 1, incrementMinutes = 1, incrementSeconds = 1, unselectableTimes, size, color, disabled, className, id, labels, visibleCount = 5, itemHeight = 32, audioTick = false, onCommit, }) => {
6685
- var _a;
6686
6658
  const t = mergeLabels(labels);
6687
6659
  const rootClass = usePrefixedClassNames('timeinput', {
6688
6660
  [`is-${color}`]: !!color,
@@ -6705,29 +6677,27 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
6705
6677
  return !unselectableTimes(probe);
6706
6678
  }, [unselectableTimes]);
6707
6679
  const isHourDisabled = React.useCallback((display) => {
6708
- var _a;
6709
6680
  let h24 = display;
6710
6681
  if (hourFormat === '12') {
6711
6682
  const base = display % 12;
6712
6683
  h24 = isPm ? base + 12 : base;
6713
6684
  }
6714
- return !isTimeAllowed(h24, value.minutes, (_a = value.seconds) !== null && _a !== void 0 ? _a : 0);
6685
+ return !isTimeAllowed(h24, value.minutes, value.seconds ?? 0);
6715
6686
  }, [hourFormat, isPm, isTimeAllowed, value.minutes, value.seconds]);
6716
- const isMinuteDisabled = React.useCallback((m) => { var _a; return !isTimeAllowed(value.hours, m, (_a = value.seconds) !== null && _a !== void 0 ? _a : 0); }, [isTimeAllowed, value.hours, value.seconds]);
6687
+ const isMinuteDisabled = React.useCallback((m) => !isTimeAllowed(value.hours, m, value.seconds ?? 0), [isTimeAllowed, value.hours, value.seconds]);
6717
6688
  const isSecondDisabled = React.useCallback((s) => !isTimeAllowed(value.hours, value.minutes, s), [isTimeAllowed, value.hours, value.minutes]);
6718
6689
  const hourDisabledFor = unselectableTimes ? isHourDisabled : undefined;
6719
6690
  const minuteDisabledFor = unselectableTimes ? isMinuteDisabled : undefined;
6720
6691
  const secondDisabledFor = unselectableTimes ? isSecondDisabled : undefined;
6721
6692
  const commit = React.useCallback((next) => {
6722
- var _a, _b, _c, _d, _e;
6723
6693
  const merged = {
6724
- hours: (_a = next.hours) !== null && _a !== void 0 ? _a : value.hours,
6725
- minutes: (_b = next.minutes) !== null && _b !== void 0 ? _b : value.minutes,
6694
+ hours: next.hours ?? value.hours,
6695
+ minutes: next.minutes ?? value.minutes,
6726
6696
  seconds: enableSeconds
6727
- ? ((_d = (_c = next.seconds) !== null && _c !== void 0 ? _c : value.seconds) !== null && _d !== void 0 ? _d : 0)
6697
+ ? (next.seconds ?? value.seconds ?? 0)
6728
6698
  : undefined,
6729
6699
  };
6730
- if (!isTimeAllowed(merged.hours, merged.minutes, (_e = merged.seconds) !== null && _e !== void 0 ? _e : 0)) {
6700
+ if (!isTimeAllowed(merged.hours, merged.minutes, merged.seconds ?? 0)) {
6731
6701
  return;
6732
6702
  }
6733
6703
  onChange(merged);
@@ -6766,7 +6736,7 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
6766
6736
  : value.hours;
6767
6737
  const hourIndex = Math.max(0, hourValues.indexOf(displayedHours));
6768
6738
  const minuteIndex = Math.max(0, minuteValues.indexOf(value.minutes));
6769
- const secondIndex = Math.max(0, secondValues.indexOf((_a = value.seconds) !== null && _a !== void 0 ? _a : 0));
6739
+ const secondIndex = Math.max(0, secondValues.indexOf(value.seconds ?? 0));
6770
6740
  const ampmIndex = isPm ? 1 : 0;
6771
6741
  const hoursRef = React.useRef(null);
6772
6742
  const minutesRef = React.useRef(null);
@@ -6779,7 +6749,7 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
6779
6749
  columnOrder.push(secondsRef);
6780
6750
  if (hourFormat === '12')
6781
6751
  columnOrder.push(ampmRef);
6782
- const focusAt = (i) => { var _a, _b; return (_b = (_a = columnOrder[i]) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.focus(); };
6752
+ const focusAt = (i) => columnOrder[i]?.current?.focus();
6783
6753
  const indexOf = (r) => columnOrder.indexOf(r);
6784
6754
  const focusPrevOf = (r) => () => focusAt(indexOf(r) - 1);
6785
6755
  const focusNextOf = (r) => () => focusAt(indexOf(r) + 1);
@@ -6790,18 +6760,17 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
6790
6760
  const baseHour = display % 12;
6791
6761
  next24 = isPm ? baseHour + 12 : baseHour;
6792
6762
  }
6793
- const allowed = nextValid(next24, next24 >= value.hours ? 1 : -1, 24, h => { var _a; return isTimeAllowed(h, value.minutes, (_a = value.seconds) !== null && _a !== void 0 ? _a : 0); });
6763
+ const allowed = nextValid(next24, next24 >= value.hours ? 1 : -1, 24, h => isTimeAllowed(h, value.minutes, value.seconds ?? 0));
6794
6764
  commit({ hours: allowed });
6795
6765
  };
6796
6766
  const onMinuteIndex = (next) => {
6797
6767
  const m = minuteValues[Math.max(0, Math.min(minuteValues.length - 1, next))];
6798
- const allowed = nextValid(m, m >= value.minutes ? 1 : -1, 60, mm => { var _a; return isTimeAllowed(value.hours, mm, (_a = value.seconds) !== null && _a !== void 0 ? _a : 0); });
6768
+ const allowed = nextValid(m, m >= value.minutes ? 1 : -1, 60, mm => isTimeAllowed(value.hours, mm, value.seconds ?? 0));
6799
6769
  commit({ minutes: allowed });
6800
6770
  };
6801
6771
  const onSecondIndex = (next) => {
6802
- var _a;
6803
6772
  const s = secondValues[Math.max(0, Math.min(secondValues.length - 1, next))];
6804
- const allowed = nextValid(s, s >= ((_a = value.seconds) !== null && _a !== void 0 ? _a : 0) ? 1 : -1, 60, ss => isTimeAllowed(value.hours, value.minutes, ss));
6773
+ const allowed = nextValid(s, s >= (value.seconds ?? 0) ? 1 : -1, 60, ss => isTimeAllowed(value.hours, value.minutes, ss));
6805
6774
  commit({ seconds: allowed });
6806
6775
  };
6807
6776
  const onAmpmIndex = (next) => {
@@ -6810,7 +6779,6 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
6810
6779
  commit({ hours: (value.hours + 12) % 24 });
6811
6780
  };
6812
6781
  const onWheelsContainerPointerDown = (e) => {
6813
- var _a, _b;
6814
6782
  if (disabled)
6815
6783
  return;
6816
6784
  if (e.target.closest(`.${wheelSingleClass}`))
@@ -6833,7 +6801,7 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
6833
6801
  nearestIdx = i;
6834
6802
  }
6835
6803
  });
6836
- (_b = (_a = columnOrder[nearestIdx]) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.startDrag(e.pointerId, e.clientY);
6804
+ columnOrder[nearestIdx]?.current?.startDrag(e.pointerId, e.clientY);
6837
6805
  };
6838
6806
  return (jsxRuntime.jsx("div", { id: id, className: classNames(rootClass, className), "aria-disabled": disabled, children: jsxRuntime.jsxs("div", { className: wheelsClass, ref: wheelsContainerRef, onPointerDown: onWheelsContainerPointerDown, children: [jsxRuntime.jsx(Wheel, { ref: hoursRef, values: hourValues, index: hourIndex, onChange: onHourIndex, formatLabel: pad2, ariaLabel: t.hours, visibleCount: visibleCount, itemHeight: itemHeight, disabled: disabled, size: size, color: color, wrap: true, onCommit: onCommit, onFocusPrev: focusPrevOf(hoursRef), onFocusNext: focusNextOf(hoursRef), disabledFor: hourDisabledFor, audioTick: audioTick }), jsxRuntime.jsx("div", { className: sepClass, "aria-hidden": "true", children: ":" }), jsxRuntime.jsx(Wheel, { ref: minutesRef, values: minuteValues, index: minuteIndex, onChange: onMinuteIndex, formatLabel: pad2, ariaLabel: t.minutes, visibleCount: visibleCount, itemHeight: itemHeight, disabled: disabled, size: size, color: color, wrap: true, onCommit: onCommit, onFocusPrev: focusPrevOf(minutesRef), onFocusNext: focusNextOf(minutesRef), disabledFor: minuteDisabledFor, audioTick: audioTick }), enableSeconds && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: sepClass, "aria-hidden": "true", children: ":" }), jsxRuntime.jsx(Wheel, { ref: secondsRef, values: secondValues, index: secondIndex, onChange: onSecondIndex, formatLabel: pad2, ariaLabel: t.seconds, visibleCount: visibleCount, itemHeight: itemHeight, disabled: disabled, size: size, color: color, wrap: true, onFocusPrev: focusPrevOf(secondsRef), onFocusNext: focusNextOf(secondsRef), disabledFor: secondDisabledFor, audioTick: audioTick })] })), hourFormat === '12' && (jsxRuntime.jsx(Wheel, { ref: ampmRef, values: ['AM', 'PM'], index: ampmIndex, onChange: onAmpmIndex, formatLabel: v => v, ariaLabel: t.ampm, visibleCount: visibleCount, itemHeight: itemHeight, disabled: disabled, size: size, color: color, onCommit: onCommit, onFocusPrev: focusPrevOf(ampmRef), onFocusNext: focusNextOf(ampmRef), audioTick: audioTick }))] }) }));
6839
6807
  };
@@ -6855,23 +6823,23 @@ const fromIsoTime = (s) => {
6855
6823
  return new Date(today.getFullYear(), today.getMonth(), today.getDate(), Number(m[1]), Number(m[2]), m[3] ? Number(m[3]) : 0, 0);
6856
6824
  };
6857
6825
  const TimeInputBase = React.forwardRef((props, ref) => {
6858
- var _a, _b, _c, _d;
6859
6826
  const { value: controlledValue, defaultValue, onChange, onOpen, onClose, min, max, disabled, readOnly, placeholder, format, parse, locale, inline = false, mobileNative = 'auto', editable = true, popover = true, openOnFocus = true, closeOnSelect = false, position = 'bottom-left', appendToBody = false, color, size, isRounded, hourFormat = '24', enableSeconds = false, incrementHours = 1, incrementMinutes = 1, incrementSeconds = 1, unselectableTimes, className, name, form, required, id, onFocus, onClick, onKeyDown, onBlur, iconLeftName: _iconLeftName, triggerIcon = true, triggerIconName = 'chevron-down', labels, audioTick = false, haptics = false, ...rest } = props;
6860
6827
  const hasVibrate = typeof navigator !== 'undefined' &&
6861
6828
  typeof navigator.vibrate === 'function';
6862
6829
  const effectiveAudioTick = audioTick || (haptics && !hasVibrate);
6863
6830
  const t = mergeLabels(labels);
6864
6831
  const isControlled = controlledValue !== undefined;
6865
- const [internalValue, setInternalValue] = React.useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);
6866
- const value = isControlled ? (controlledValue !== null && controlledValue !== void 0 ? controlledValue : null) : internalValue;
6867
- const defaultFormat = format !== null && format !== void 0 ? format : (hourFormat === '12'
6868
- ? enableSeconds
6869
- ? 'hh:mm:ss A'
6870
- : DEFAULT_TIME_FORMAT_12
6871
- : enableSeconds
6872
- ? 'HH:mm:ss'
6873
- : DEFAULT_TIME_FORMAT_24);
6874
- const effectiveHourFormat = (_a = hourCycleFromFormat(defaultFormat)) !== null && _a !== void 0 ? _a : hourFormat;
6832
+ const [internalValue, setInternalValue] = React.useState(defaultValue ?? null);
6833
+ const value = isControlled ? (controlledValue ?? null) : internalValue;
6834
+ const defaultFormat = format ??
6835
+ (hourFormat === '12'
6836
+ ? enableSeconds
6837
+ ? 'hh:mm:ss A'
6838
+ : DEFAULT_TIME_FORMAT_12
6839
+ : enableSeconds
6840
+ ? 'HH:mm:ss'
6841
+ : DEFAULT_TIME_FORMAT_24);
6842
+ const effectiveHourFormat = hourCycleFromFormat(defaultFormat) ?? hourFormat;
6875
6843
  const [open, setOpenState] = React.useState(false);
6876
6844
  const [text, setText] = React.useState(value ? formatTime(value, defaultFormat, locale) : '');
6877
6845
  const inputRef = React.useRef(null);
@@ -6905,10 +6873,10 @@ const TimeInputBase = React.forwardRef((props, ref) => {
6905
6873
  return prev;
6906
6874
  if (next) {
6907
6875
  valueAtOpenRef.current = value;
6908
- onOpen === null || onOpen === void 0 ? void 0 : onOpen();
6876
+ onOpen?.();
6909
6877
  }
6910
6878
  else {
6911
- onClose === null || onClose === void 0 ? void 0 : onClose();
6879
+ onClose?.();
6912
6880
  }
6913
6881
  return next;
6914
6882
  });
@@ -6919,10 +6887,10 @@ const TimeInputBase = React.forwardRef((props, ref) => {
6919
6887
  const commitValue = React.useCallback((next) => {
6920
6888
  if (!isControlled)
6921
6889
  setInternalValue(next);
6922
- onChange === null || onChange === void 0 ? void 0 : onChange(next);
6890
+ onChange?.(next);
6923
6891
  }, [isControlled, onChange]);
6924
6892
  const handleSpinnerChange = React.useCallback((parts) => {
6925
- const base = value !== null && value !== void 0 ? value : new Date();
6893
+ const base = value ?? new Date();
6926
6894
  const next = setTimeOfDay(base, parts);
6927
6895
  if (!isWithin(next, min, max))
6928
6896
  return;
@@ -6935,9 +6903,10 @@ const TimeInputBase = React.forwardRef((props, ref) => {
6935
6903
  const fmt = typeof format === 'string' ? format : undefined;
6936
6904
  return parse
6937
6905
  ? parse(trimmed)
6938
- : parseTime(trimmed, fmt !== null && fmt !== void 0 ? fmt : (typeof defaultFormat === 'string'
6939
- ? defaultFormat
6940
- : DEFAULT_TIME_FORMAT_24));
6906
+ : parseTime(trimmed, fmt ??
6907
+ (typeof defaultFormat === 'string'
6908
+ ? defaultFormat
6909
+ : DEFAULT_TIME_FORMAT_24));
6941
6910
  }, [parse, format, defaultFormat]);
6942
6911
  const makeBaseDate = React.useCallback(() => {
6943
6912
  const d = new Date();
@@ -6993,9 +6962,9 @@ const TimeInputBase = React.forwardRef((props, ref) => {
6993
6962
  }, min: min ? toIsoTime(min, enableSeconds) : undefined, max: max ? toIsoTime(max, enableSeconds) : undefined, disabled: disabled, readOnly: readOnly, placeholder: placeholder, name: name, form: form, required: required, id: id }));
6994
6963
  }
6995
6964
  const spinnerValue = {
6996
- hours: (_b = value === null || value === void 0 ? void 0 : value.getHours()) !== null && _b !== void 0 ? _b : 0,
6997
- minutes: (_c = value === null || value === void 0 ? void 0 : value.getMinutes()) !== null && _c !== void 0 ? _c : 0,
6998
- seconds: enableSeconds ? ((_d = value === null || value === void 0 ? void 0 : value.getSeconds()) !== null && _d !== void 0 ? _d : 0) : undefined,
6965
+ hours: value?.getHours() ?? 0,
6966
+ minutes: value?.getMinutes() ?? 0,
6967
+ seconds: enableSeconds ? (value?.getSeconds() ?? 0) : undefined,
6999
6968
  };
7000
6969
  const panel = (jsxRuntime.jsxs("div", { className: panelClass, children: [jsxRuntime.jsx(TimeWheels, { value: spinnerValue, onChange: handleSpinnerChange, hourFormat: effectiveHourFormat, enableSeconds: enableSeconds, incrementHours: incrementHours, incrementMinutes: incrementMinutes, incrementSeconds: incrementSeconds, unselectableTimes: unselectableTimes, color: color, size: size, disabled: disabled, id: popoverId, labels: labels, itemHeight: wheelItemHeight, audioTick: effectiveAudioTick, onCommit: () => setOpen(false) }), !inline && !isSmallViewport && (jsxRuntime.jsxs(Buttons, { className: footerClass, hasAddons: true, children: [jsxRuntime.jsx("button", { type: "button", className: footerOkClass, onClick: () => setOpen(false), children: t.ok }), jsxRuntime.jsx("button", { type: "button", className: footerButton, onClick: () => {
7001
6970
  commitValue(snapTimeToIncrement(new Date(), {
@@ -7023,13 +6992,12 @@ const TimeInputBase = React.forwardRef((props, ref) => {
7023
6992
  TimeInputBase.displayName = 'TimeInputBase';
7024
6993
 
7025
6994
  const TimeInput = React.forwardRef(({ label, labelSize, labelProps, horizontal, iconLeft, iconRight, iconLeftName = 'clock', iconRightName, iconLeftSize, iconRightSize, hasIconsLeft, hasIconsRight, isLoading, isExpanded, controlSize, message, messageColor, fieldClassName, controlClassName, ...baseProps }, ref) => {
7026
- var _a;
7027
6995
  const insideField = useInsideField();
7028
6996
  const insideControl = useInsideControl();
7029
6997
  const helpClass = usePrefixedClassNames('help', {
7030
6998
  [`is-${messageColor}`]: !!messageColor,
7031
6999
  });
7032
- let content = (jsxRuntime.jsx(TimeInputBase, { ref: ref, ...baseProps, triggerIcon: (_a = baseProps.triggerIcon) !== null && _a !== void 0 ? _a : !isLoading }));
7000
+ let content = (jsxRuntime.jsx(TimeInputBase, { ref: ref, ...baseProps, triggerIcon: baseProps.triggerIcon ?? !isLoading }));
7033
7001
  if (!insideControl && !baseProps.inline) {
7034
7002
  content = (jsxRuntime.jsx(Control, { iconLeft: iconLeft, iconRight: iconRight, iconLeftName: iconLeftName, iconRightName: iconRightName, iconLeftSize: iconLeftSize, iconRightSize: iconRightSize, hasIconsLeft: hasIconsLeft || !!iconLeftName, hasIconsRight: hasIconsRight, isLoading: isLoading, isExpanded: isExpanded, size: controlSize, className: controlClassName, children: content }));
7035
7003
  }
@@ -7059,27 +7027,27 @@ const fromIsoDateTime = (s) => {
7059
7027
  return new Date(Number(m[1]), Number(m[2]) - 1, Number(m[3]), Number(m[4]), Number(m[5]), m[6] ? Number(m[6]) : 0, 0);
7060
7028
  };
7061
7029
  const DateTimeInputBase = React.forwardRef((props, ref) => {
7062
- var _a, _b, _c, _d;
7063
7030
  const { value: controlledValue, defaultValue, onChange, onOpen, onClose, min, max, disabled, readOnly, placeholder, format, parse, locale, inline = false, mobileNative = 'auto', editable = true, popover = true, openOnFocus = true, closeOnSelect = false, position = 'bottom-left', appendToBody = false, color, size, isRounded, shouldDisableDate, unselectableDates, firstDayOfWeek = 0, dayNames, monthNames, nearbyMonthDays = true, hourFormat = '24', enableSeconds = false, incrementHours = 1, incrementMinutes = 1, incrementSeconds = 1, unselectableTimes, className, name, form, required, id, onFocus, onClick, onKeyDown, onBlur, iconLeftName: _iconLeftName, triggerIcon = true, triggerIconName = 'chevron-down', audioTick = false, haptics = false, labels, ...rest } = props;
7064
7031
  const t = mergeLabels(labels);
7065
7032
  const hasVibrate = typeof navigator !== 'undefined' && typeof navigator.vibrate === 'function';
7066
7033
  const effectiveAudioTick = audioTick || (haptics && !hasVibrate);
7067
7034
  const isControlled = controlledValue !== undefined;
7068
- const [internalValue, setInternalValue] = React.useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);
7069
- const value = isControlled ? (controlledValue !== null && controlledValue !== void 0 ? controlledValue : null) : internalValue;
7070
- const initialFocused = React.useMemo(() => clampDate(value !== null && value !== void 0 ? value : new Date(), min, max), []);
7035
+ const [internalValue, setInternalValue] = React.useState(defaultValue ?? null);
7036
+ const value = isControlled ? (controlledValue ?? null) : internalValue;
7037
+ const initialFocused = React.useMemo(() => clampDate(value ?? new Date(), min, max), []);
7071
7038
  const [focusedDate, setFocusedDate] = React.useState(initialFocused);
7072
7039
  React.useEffect(() => {
7073
7040
  setFocusedDate(prev => clampDate(prev, min, max));
7074
7041
  }, [min, max]);
7075
- const defaultFormat = format !== null && format !== void 0 ? format : (hourFormat === '12'
7076
- ? enableSeconds
7077
- ? 'YYYY-MM-DD hh:mm:ss A'
7078
- : 'YYYY-MM-DD hh:mm A'
7079
- : enableSeconds
7080
- ? 'YYYY-MM-DD HH:mm:ss'
7081
- : DEFAULT_DATETIME_FORMAT);
7082
- const effectiveHourFormat = (_a = hourCycleFromFormat(defaultFormat)) !== null && _a !== void 0 ? _a : hourFormat;
7042
+ const defaultFormat = format ??
7043
+ (hourFormat === '12'
7044
+ ? enableSeconds
7045
+ ? 'YYYY-MM-DD hh:mm:ss A'
7046
+ : 'YYYY-MM-DD hh:mm A'
7047
+ : enableSeconds
7048
+ ? 'YYYY-MM-DD HH:mm:ss'
7049
+ : DEFAULT_DATETIME_FORMAT);
7050
+ const effectiveHourFormat = hourCycleFromFormat(defaultFormat) ?? hourFormat;
7083
7051
  const [open, setOpenState] = React.useState(false);
7084
7052
  const [timeOpen, setTimeOpen] = React.useState(false);
7085
7053
  const [text, setText] = React.useState(value ? formatDateTime(value, defaultFormat, locale) : '');
@@ -7124,10 +7092,10 @@ const DateTimeInputBase = React.forwardRef((props, ref) => {
7124
7092
  return prev;
7125
7093
  if (next) {
7126
7094
  valueAtOpenRef.current = value;
7127
- onOpen === null || onOpen === void 0 ? void 0 : onOpen();
7095
+ onOpen?.();
7128
7096
  }
7129
7097
  else {
7130
- onClose === null || onClose === void 0 ? void 0 : onClose();
7098
+ onClose?.();
7131
7099
  }
7132
7100
  return next;
7133
7101
  });
@@ -7144,14 +7112,13 @@ const DateTimeInputBase = React.forwardRef((props, ref) => {
7144
7112
  setInternalValue(next);
7145
7113
  if (next)
7146
7114
  setFocusedDate(next);
7147
- onChange === null || onChange === void 0 ? void 0 : onChange(next);
7115
+ onChange?.(next);
7148
7116
  }, [isControlled, onChange]);
7149
7117
  const handleDateSelect = React.useCallback((d) => {
7150
- var _a, _b, _c;
7151
7118
  const merged = setTimeOfDay(d, {
7152
- hours: (_a = value === null || value === void 0 ? void 0 : value.getHours()) !== null && _a !== void 0 ? _a : 0,
7153
- minutes: (_b = value === null || value === void 0 ? void 0 : value.getMinutes()) !== null && _b !== void 0 ? _b : 0,
7154
- seconds: enableSeconds ? ((_c = value === null || value === void 0 ? void 0 : value.getSeconds()) !== null && _c !== void 0 ? _c : 0) : undefined,
7119
+ hours: value?.getHours() ?? 0,
7120
+ minutes: value?.getMinutes() ?? 0,
7121
+ seconds: enableSeconds ? (value?.getSeconds() ?? 0) : undefined,
7155
7122
  });
7156
7123
  if (!isWithin(merged, min, max))
7157
7124
  return;
@@ -7159,7 +7126,7 @@ const DateTimeInputBase = React.forwardRef((props, ref) => {
7159
7126
  setFocusedDate(d);
7160
7127
  }, [value, enableSeconds, min, max, commitValue]);
7161
7128
  const handleTimeChange = React.useCallback((parts) => {
7162
- const base = value !== null && value !== void 0 ? value : focusedDate;
7129
+ const base = value ?? focusedDate;
7163
7130
  const next = setTimeOfDay(base, parts);
7164
7131
  if (!isWithin(next, min, max))
7165
7132
  return;
@@ -7172,17 +7139,17 @@ const DateTimeInputBase = React.forwardRef((props, ref) => {
7172
7139
  if (parse)
7173
7140
  return parse(trimmed);
7174
7141
  const fmt = typeof defaultFormat === 'string' ? defaultFormat : undefined;
7175
- return parseDate(trimmed, fmt !== null && fmt !== void 0 ? fmt : DEFAULT_DATETIME_FORMAT);
7142
+ return parseDate(trimmed, fmt ?? DEFAULT_DATETIME_FORMAT);
7176
7143
  }, [parse, defaultFormat, locale]);
7177
7144
  const makeBaseDate = React.useCallback(() => new Date(), []);
7178
7145
  const inputReadOnlyAttr = !!readOnly || !editable;
7179
7146
  const canOpen = !!popover && !disabled && !readOnly;
7180
7147
  const isBlocked = React.useMemo(() => {
7181
- if (!shouldDisableDate && !(unselectableDates === null || unselectableDates === void 0 ? void 0 : unselectableDates.length) && !unselectableTimes)
7148
+ if (!shouldDisableDate && !unselectableDates?.length && !unselectableTimes)
7182
7149
  return undefined;
7183
- return (d) => !!(shouldDisableDate === null || shouldDisableDate === void 0 ? void 0 : shouldDisableDate(d)) ||
7184
- !!(unselectableDates === null || unselectableDates === void 0 ? void 0 : unselectableDates.some(u => isSameDay(u, d))) ||
7185
- !!(unselectableTimes === null || unselectableTimes === void 0 ? void 0 : unselectableTimes(d));
7150
+ return (d) => !!shouldDisableDate?.(d) ||
7151
+ !!unselectableDates?.some(u => isSameDay(u, d)) ||
7152
+ !!unselectableTimes?.(d);
7186
7153
  }, [shouldDisableDate, unselectableDates, unselectableTimes]);
7187
7154
  const { inputHandlers } = useSegmentedEntry({
7188
7155
  format: defaultFormat,
@@ -7230,9 +7197,9 @@ const DateTimeInputBase = React.forwardRef((props, ref) => {
7230
7197
  }, min: min ? toIsoDateTime(min, enableSeconds) : undefined, max: max ? toIsoDateTime(max, enableSeconds) : undefined, disabled: disabled, readOnly: readOnly, placeholder: placeholder, name: name, form: form, required: required, id: id }));
7231
7198
  }
7232
7199
  const spinnerValue = {
7233
- hours: (_b = value === null || value === void 0 ? void 0 : value.getHours()) !== null && _b !== void 0 ? _b : 0,
7234
- minutes: (_c = value === null || value === void 0 ? void 0 : value.getMinutes()) !== null && _c !== void 0 ? _c : 0,
7235
- seconds: enableSeconds ? ((_d = value === null || value === void 0 ? void 0 : value.getSeconds()) !== null && _d !== void 0 ? _d : 0) : undefined,
7200
+ hours: value?.getHours() ?? 0,
7201
+ minutes: value?.getMinutes() ?? 0,
7202
+ seconds: enableSeconds ? (value?.getSeconds() ?? 0) : undefined,
7236
7203
  };
7237
7204
  const panel = (jsxRuntime.jsxs("div", { className: panelClass, onKeyDown: e => {
7238
7205
  if (timeOpen && e.key === 'Escape') {
@@ -7254,13 +7221,12 @@ const DateTimeInputBase = React.forwardRef((props, ref) => {
7254
7221
  DateTimeInputBase.displayName = 'DateTimeInputBase';
7255
7222
 
7256
7223
  const DateTimeInput = React.forwardRef(({ label, labelSize, labelProps, horizontal, iconLeft, iconRight, iconLeftName = 'calendar-alt', iconRightName, iconLeftSize, iconRightSize, hasIconsLeft, hasIconsRight, isLoading, isExpanded, controlSize, message, messageColor, fieldClassName, controlClassName, ...baseProps }, ref) => {
7257
- var _a;
7258
7224
  const insideField = useInsideField();
7259
7225
  const insideControl = useInsideControl();
7260
7226
  const helpClass = usePrefixedClassNames('help', {
7261
7227
  [`is-${messageColor}`]: !!messageColor,
7262
7228
  });
7263
- let content = (jsxRuntime.jsx(DateTimeInputBase, { ref: ref, ...baseProps, triggerIcon: (_a = baseProps.triggerIcon) !== null && _a !== void 0 ? _a : !isLoading }));
7229
+ let content = (jsxRuntime.jsx(DateTimeInputBase, { ref: ref, ...baseProps, triggerIcon: baseProps.triggerIcon ?? !isLoading }));
7264
7230
  if (!insideControl && !baseProps.inline) {
7265
7231
  content = (jsxRuntime.jsx(Control, { iconLeft: iconLeft, iconRight: iconRight, iconLeftName: iconLeftName, iconRightName: iconRightName, iconLeftSize: iconLeftSize, iconRightSize: iconRightSize, hasIconsLeft: hasIconsLeft || !!iconLeftName, hasIconsRight: hasIconsRight, isLoading: isLoading, isExpanded: isExpanded, size: controlSize, className: controlClassName, children: content }));
7266
7232
  }
@@ -7839,7 +7805,7 @@ function cssVarToProp(varName) {
7839
7805
  .join('');
7840
7806
  }
7841
7807
  const bulmaVarPropMap = Object.fromEntries(bulmaCssVars.map(cssVar => [cssVarToProp(cssVar), cssVar]));
7842
- const Theme = ({ bulmaVars = {}, children, className, isRoot = false, ...restProps }) => {
7808
+ const Theme = ({ bulmaVars = {}, children, className, isRoot = false, colorMode, ...restProps }) => {
7843
7809
  const { bulmaVarProps, otherProps } = React.useMemo(() => {
7844
7810
  const varProps = {};
7845
7811
  const otherPropsObj = {};
@@ -7889,6 +7855,27 @@ const Theme = ({ bulmaVars = {}, children, className, isRoot = false, ...restPro
7889
7855
  }
7890
7856
  };
7891
7857
  }, [mergedVars, isRoot]);
7858
+ React.useEffect(() => {
7859
+ if (colorMode === undefined) {
7860
+ return;
7861
+ }
7862
+ const root = document.documentElement;
7863
+ const previous = root.getAttribute('data-theme');
7864
+ if (colorMode === 'system') {
7865
+ root.removeAttribute('data-theme');
7866
+ }
7867
+ else {
7868
+ root.setAttribute('data-theme', colorMode);
7869
+ }
7870
+ return () => {
7871
+ if (previous === null) {
7872
+ root.removeAttribute('data-theme');
7873
+ }
7874
+ else {
7875
+ root.setAttribute('data-theme', previous);
7876
+ }
7877
+ };
7878
+ }, [colorMode]);
7892
7879
  const style = React.useMemo(() => {
7893
7880
  if (isRoot) {
7894
7881
  return {};
@@ -7943,7 +7930,7 @@ const Container = ({ className, textColor, bgColor, fluid, widescreen, fullhd, b
7943
7930
 
7944
7931
  const Footer = ({ as = 'footer', className, children, color, bgColor, textColor, ...props }) => {
7945
7932
  const { bulmaHelperClasses, rest } = useBulmaClasses({
7946
- color: textColor !== null && textColor !== void 0 ? textColor : color,
7933
+ color: textColor ?? color,
7947
7934
  backgroundColor: bgColor,
7948
7935
  ...props,
7949
7936
  });
@@ -7968,7 +7955,7 @@ const Hero = ({ className, color, size, bgColor, fullheightWithNavbar, children,
7968
7955
  };
7969
7956
  const HeroHead = ({ className, children, color, bgColor, textColor, ...props }) => {
7970
7957
  const { bulmaHelperClasses, rest } = useBulmaClasses({
7971
- color: textColor !== null && textColor !== void 0 ? textColor : color,
7958
+ color: textColor ?? color,
7972
7959
  backgroundColor: bgColor,
7973
7960
  ...props,
7974
7961
  });
@@ -7978,7 +7965,7 @@ const HeroHead = ({ className, children, color, bgColor, textColor, ...props })
7978
7965
  };
7979
7966
  const HeroBody = ({ className, children, color, bgColor, textColor, ...props }) => {
7980
7967
  const { bulmaHelperClasses, rest } = useBulmaClasses({
7981
- color: textColor !== null && textColor !== void 0 ? textColor : color,
7968
+ color: textColor ?? color,
7982
7969
  backgroundColor: bgColor,
7983
7970
  ...props,
7984
7971
  });
@@ -7988,7 +7975,7 @@ const HeroBody = ({ className, children, color, bgColor, textColor, ...props })
7988
7975
  };
7989
7976
  const HeroFoot = ({ className, children, color, bgColor, textColor, ...props }) => {
7990
7977
  const { bulmaHelperClasses, rest } = useBulmaClasses({
7991
- color: textColor !== null && textColor !== void 0 ? textColor : color,
7978
+ color: textColor ?? color,
7992
7979
  backgroundColor: bgColor,
7993
7980
  ...props,
7994
7981
  });
@@ -8002,7 +7989,7 @@ Hero.Foot = HeroFoot;
8002
7989
 
8003
7990
  const Level = ({ isMobile, className, children, color, bgColor, textColor, ...props }) => {
8004
7991
  const { bulmaHelperClasses, rest } = useBulmaClasses({
8005
- color: textColor !== null && textColor !== void 0 ? textColor : color,
7992
+ color: textColor ?? color,
8006
7993
  backgroundColor: bgColor,
8007
7994
  ...props,
8008
7995
  });
@@ -8014,7 +8001,7 @@ const Level = ({ isMobile, className, children, color, bgColor, textColor, ...pr
8014
8001
  };
8015
8002
  const LevelLeft = ({ className, children, color, bgColor, textColor, ...props }) => {
8016
8003
  const { bulmaHelperClasses, rest } = useBulmaClasses({
8017
- color: textColor !== null && textColor !== void 0 ? textColor : color,
8004
+ color: textColor ?? color,
8018
8005
  backgroundColor: bgColor,
8019
8006
  ...props,
8020
8007
  });
@@ -8024,7 +8011,7 @@ const LevelLeft = ({ className, children, color, bgColor, textColor, ...props })
8024
8011
  };
8025
8012
  const LevelRight = ({ className, children, color, bgColor, textColor, ...props }) => {
8026
8013
  const { bulmaHelperClasses, rest } = useBulmaClasses({
8027
- color: textColor !== null && textColor !== void 0 ? textColor : color,
8014
+ color: textColor ?? color,
8028
8015
  backgroundColor: bgColor,
8029
8016
  ...props,
8030
8017
  });
@@ -8034,7 +8021,7 @@ const LevelRight = ({ className, children, color, bgColor, textColor, ...props }
8034
8021
  };
8035
8022
  const LevelItem = ({ as = 'div', hasTextCentered, className, children, href, target, rel, color, bgColor, textColor, ...props }) => {
8036
8023
  const { bulmaHelperClasses, rest } = useBulmaClasses({
8037
- color: textColor !== null && textColor !== void 0 ? textColor : color,
8024
+ color: textColor ?? color,
8038
8025
  backgroundColor: bgColor,
8039
8026
  ...props,
8040
8027
  });
@@ -8054,7 +8041,7 @@ Level.Item = LevelItem;
8054
8041
 
8055
8042
  const Media = ({ as = 'article', className, children, color, bgColor, textColor, ...props }) => {
8056
8043
  const { bulmaHelperClasses, rest } = useBulmaClasses({
8057
- color: textColor !== null && textColor !== void 0 ? textColor : color,
8044
+ color: textColor ?? color,
8058
8045
  backgroundColor: bgColor,
8059
8046
  ...props,
8060
8047
  });
@@ -8065,7 +8052,7 @@ const Media = ({ as = 'article', className, children, color, bgColor, textColor,
8065
8052
  };
8066
8053
  const MediaLeft = ({ as = 'figure', className, children, color, bgColor, textColor, ...props }) => {
8067
8054
  const { bulmaHelperClasses, rest } = useBulmaClasses({
8068
- color: textColor !== null && textColor !== void 0 ? textColor : color,
8055
+ color: textColor ?? color,
8069
8056
  backgroundColor: bgColor,
8070
8057
  ...props,
8071
8058
  });
@@ -8076,7 +8063,7 @@ const MediaLeft = ({ as = 'figure', className, children, color, bgColor, textCol
8076
8063
  };
8077
8064
  const MediaContent = ({ className, children, color, bgColor, textColor, ...props }) => {
8078
8065
  const { bulmaHelperClasses, rest } = useBulmaClasses({
8079
- color: textColor !== null && textColor !== void 0 ? textColor : color,
8066
+ color: textColor ?? color,
8080
8067
  backgroundColor: bgColor,
8081
8068
  ...props,
8082
8069
  });
@@ -8086,7 +8073,7 @@ const MediaContent = ({ className, children, color, bgColor, textColor, ...props
8086
8073
  };
8087
8074
  const MediaRight = ({ className, children, color, bgColor, textColor, ...props }) => {
8088
8075
  const { bulmaHelperClasses, rest } = useBulmaClasses({
8089
- color: textColor !== null && textColor !== void 0 ? textColor : color,
8076
+ color: textColor ?? color,
8090
8077
  backgroundColor: bgColor,
8091
8078
  ...props,
8092
8079
  });
@@ -8101,7 +8088,7 @@ MediaWithSubcomponents.Right = MediaRight;
8101
8088
 
8102
8089
  const Section = ({ size, className, children, color, bgColor, textColor, ...props }) => {
8103
8090
  const { bulmaHelperClasses, rest } = useBulmaClasses({
8104
- color: textColor !== null && textColor !== void 0 ? textColor : color,
8091
+ color: textColor ?? color,
8105
8092
  backgroundColor: bgColor,
8106
8093
  ...props,
8107
8094
  });