@allxsmith/bestax-bulma 3.0.2 → 5.0.0

package/dist/index.esm.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import React, { createContext, useContext, useMemo, useState, useRef, useEffect, useCallback, useLayoutEffect, forwardRef, Children, isValidElement, cloneElement, useId } from 'react';
+import React, { createContext, useContext, useMemo, useState, useRef, useEffect, useCallback, useId, useLayoutEffect, forwardRef, Children, isValidElement, cloneElement } from 'react';
 import { createPortal } from 'react-dom';
 
 const ConfigContext = createContext({});
@@ -760,7 +760,7 @@ const CardComponent = ({ className, children, textColor, bgColor, hasShadow = tr
                         'is-centered': headerCentered,
                     }), children: header })), headerIcon] }));
     };
-    return (jsxs("div", { className: cardClasses, ...rest, children: [renderHeader(header, headerIcon, headerCentered, classPrefix), image && (jsx("div", { className: prefixedClassNames(classPrefix, 'card-image'), children: typeof image === 'string' ? (jsx("figure", { className: prefixedClassNames(classPrefix, 'image'), children: jsx("img", { src: image, alt: imageAlt !== null && imageAlt !== void 0 ? imageAlt : 'Card image' }) })) : (image) })), typeof children !== 'undefined' &&
+    return (jsxs("div", { className: cardClasses, ...rest, children: [renderHeader(header, headerIcon, headerCentered, classPrefix), image && (jsx("div", { className: prefixedClassNames(classPrefix, 'card-image'), children: typeof image === 'string' ? (jsx("figure", { className: prefixedClassNames(classPrefix, 'image'), children: jsx("img", { src: image, alt: imageAlt ?? 'Card image' }) })) : (image) })), typeof children !== 'undefined' &&
                 children !== null &&
                 children !== '' &&
                 !hasCompoundComponents(children) && (jsx("div", { className: prefixedClassNames(classPrefix, 'card-content'), children: children })), typeof children !== 'undefined' &&
@@ -823,10 +823,9 @@ const DropdownComponent = ({ label, children, className, menuClassName, active:
         if (!isBrowser$1(window, document))
             return;
         const handleClick = (e) => {
-            var _a;
-            if (!((_a = dropdownRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
+            if (!dropdownRef.current?.contains(e.target)) {
                 setActive(false);
-                onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(false);
+                onActiveChange?.(false);
             }
         };
         document.addEventListener('mousedown', handleClick);
@@ -837,12 +836,12 @@ const DropdownComponent = ({ label, children, className, menuClassName, active:
             return;
         const newActive = !active;
         setActive(newActive);
-        onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(newActive);
+        onActiveChange?.(newActive);
     };
     const handleMenuClick = () => {
         if (closeOnClick) {
             setActive(false);
-            onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(false);
+            onActiveChange?.(false);
         }
     };
     const dropdownClasses = classNames(bulmaClasses, bulmaHelperClasses, className);
@@ -963,14 +962,13 @@ const ModalClose = ({ className, size = 'large', variant = 'delete', ...props })
     return (jsx("button", { className: classes, "aria-label": "close", type: "button", ...props }));
 };
 const ModalRoot = ({ active, isActive, onClose, className, textColor, bgColor, modalCardTitle, modalCardFoot, type, children, ...props }) => {
-    var _a;
     const { classPrefix } = useConfig();
     const { bulmaHelperClasses, rest } = useBulmaClasses({
         color: textColor,
         backgroundColor: bgColor,
         ...props,
     });
-    const isModalActive = (_a = active !== null && active !== void 0 ? active : isActive) !== null && _a !== void 0 ? _a : false;
+    const isModalActive = active ?? isActive ?? false;
     const hasCompoundComponents = React.Children.toArray(children).some(child => React.isValidElement(child) &&
         (child.type === ModalBackground ||
             child.type === ModalContent ||
@@ -1031,13 +1029,12 @@ const NavbarItem = ({ className, as: Component = 'a', active, textColor, bgColor
         }), bulmaHelperClasses, className), ...rest, children: children }));
 };
 const NavbarBurger = ({ className, active, children, ...props }) => {
-    var _a;
     const { bulmaHelperClasses, rest } = useBulmaClasses({
         ...props,
     });
     return (jsxs("button", { type: "button", className: classNames(usePrefixedClassNames('navbar-burger', {
             'is-active': active,
-        }), bulmaHelperClasses, className), "aria-label": props['aria-label'] || 'menu', "aria-expanded": (_a = props['aria-expanded']) !== null && _a !== void 0 ? _a : !!active, ...rest, children: [jsx("span", { "aria-hidden": "true" }), jsx("span", { "aria-hidden": "true" }), jsx("span", { "aria-hidden": "true" }), children] }));
+        }), bulmaHelperClasses, className), "aria-label": props['aria-label'] || 'menu', "aria-expanded": props['aria-expanded'] ?? !!active, ...rest, children: [jsx("span", { "aria-hidden": "true" }), jsx("span", { "aria-hidden": "true" }), jsx("span", { "aria-hidden": "true" }), children] }));
 };
 const NavbarMenu = ({ className, active, children, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
@@ -1159,9 +1156,9 @@ Pagination.Previous = PaginationPrevious;
 Pagination.Next = PaginationNext;
 
 function getIconClasses(library, name, variant, features) {
-    let baseClass = '';
-    let iconClass = '';
-    let featureList = Array.isArray(features)
+    let baseClass;
+    let iconClass;
+    const featureList = Array.isArray(features)
         ? features
         : features
             ? [features]
@@ -1351,7 +1348,7 @@ const Tabs = ({ align, size, fullwidth, boxed, toggle, rounded, color, value, on
         if (!isControlled) {
             setInternalTab(index);
         }
-        onChange === null || onChange === void 0 ? void 0 : onChange(index);
+        onChange?.(index);
     }, [isControlled, onChange]);
     const contextValue = { activeTab, setActiveTab };
     const tabsClasses = usePrefixedClassNames('tabs', {
@@ -1486,7 +1483,8 @@ const Collapse = ({ open: controlledOpen, defaultOpen = false, onOpen, onClose,
     const isControlled = controlledOpen !== undefined;
     const [internalOpen, setInternalOpen] = useState(defaultOpen);
     const isOpen = isControlled ? controlledOpen : internalOpen;
-    const uniqueId = useRef(ariaId || `collapse-${Math.random().toString(36).slice(2, 9)}`);
+    const generatedId = useId();
+    const uniqueId = ariaId || generatedId;
     useEffect(() => {
         if (!contentRef.current)
             return undefined;
@@ -1520,10 +1518,10 @@ const Collapse = ({ open: controlledOpen, defaultOpen = false, onOpen, onClose,
             const newOpen = !internalOpen;
             setInternalOpen(newOpen);
             if (newOpen) {
-                onOpen === null || onOpen === void 0 ? void 0 : onOpen();
+                onOpen?.();
             }
             else {
-                onClose === null || onClose === void 0 ? void 0 : onClose();
+                onClose?.();
             }
         }
     }, [isControlled, internalOpen, onOpen, onClose]);
@@ -1563,8 +1561,8 @@ const Collapse = ({ open: controlledOpen, defaultOpen = false, onOpen, onClose,
             display: isOpen ? 'block' : 'none',
         };
     }
-    const triggerElement = (jsx("div", { className: combinedTriggerClasses, onClick: handleToggle, onKeyDown: handleKeyDown, role: "button", tabIndex: 0, "aria-expanded": isOpen, "aria-controls": uniqueId.current, children: trigger }));
-    const contentElement = (jsx("div", { style: contentWrapperStyle, children: jsx("div", { ref: contentRef, id: uniqueId.current, className: combinedContentClasses, "aria-hidden": !isOpen, children: children }) }));
+    const triggerElement = (jsx("div", { className: combinedTriggerClasses, onClick: handleToggle, onKeyDown: handleKeyDown, role: "button", tabIndex: 0, "aria-expanded": isOpen, "aria-controls": uniqueId, children: trigger }));
+    const contentElement = (jsx("div", { style: contentWrapperStyle, children: jsx("div", { ref: contentRef, id: uniqueId, className: combinedContentClasses, "aria-hidden": !isOpen, children: children }) }));
     return (jsx("div", { className: combinedClasses, ...rest, children: position === 'bottom' ? (jsxs(Fragment, { children: [contentElement, triggerElement] })) : (jsxs(Fragment, { children: [triggerElement, contentElement] })) }));
 };
 
@@ -1742,7 +1740,7 @@ const Step = ({ isActive = false, isCompleted = false, label, icon, clickable =
     const markerContent = icon ||
         (isCompleted && resolvedCompletedIcon
             ? resolvedCompletedIcon
-            : (stepNumber !== null && stepNumber !== void 0 ? stepNumber : null));
+            : (stepNumber ?? null));
     return (jsx("li", { className: stepClasses, onClick: handleClick, onKeyDown: handleKeyDown, tabIndex: clickable ? 0 : undefined, role: clickable ? 'button' : undefined, "aria-current": isActive ? 'step' : undefined, ...rest, children: jsxs("div", { className: "steps-link", children: [jsx("span", { className: "steps-marker", children: markerContent }), (label || children) && (jsx("div", { className: "steps-content", children: jsx("p", { className: "steps-title", children: label || children }) }))] }) }));
 };
 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 }) => {
@@ -1783,7 +1781,7 @@ const Steps = ({ value = 0, items, size, color, hasMarker = true, animated = tru
         }
         return null;
     };
-    return (jsxs("div", { className: combinedClasses, ...rest, children: [jsx("ul", { className: listClasses, children: renderSteps() }), hasNavigation && (jsxs("div", { className: "steps-navigation", children: [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' }), 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' })] }))] }));
+    return (jsxs("div", { className: combinedClasses, ...rest, children: [jsx("ul", { className: listClasses, children: renderSteps() }), hasNavigation && (jsxs("div", { className: "steps-navigation", children: [jsx("button", { className: "button", disabled: value === 0, onClick: onPrev ?? (() => onStepClick?.(value - 1)), children: prevLabel ?? 'Previous' }), jsx("button", { className: "button is-primary", disabled: value === totalSteps - 1, onClick: onNext ?? (() => onStepClick?.(value + 1)), children: nextLabel ?? 'Next' })] }))] }));
 };
 Steps.Step = Step;
 
@@ -1904,10 +1902,10 @@ const Toast = forwardRef(({ message, type = 'default', actionType, position = 't
     const toastRef = useRef(null);
     const handleClose = useCallback(() => {
         setIsVisible(false);
-        onClose === null || onClose === void 0 ? void 0 : onClose();
+        onClose?.();
     }, [onClose]);
     const handleAction = useCallback(() => {
-        onAction === null || onAction === void 0 ? void 0 : onAction();
+        onAction?.();
         handleClose();
     }, [onAction, handleClose]);
     useEffect(() => {
@@ -2094,11 +2092,11 @@ const Dialog = forwardRef(({ isOpen, title, message, type = 'default', confirmTe
     const cancelRef = useRef(null);
     const handleCancel = useCallback(() => {
         if (canCancel) {
-            onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+            onCancel?.();
         }
     }, [canCancel, onCancel]);
     const handleConfirm = useCallback(() => {
-        onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm();
+        onConfirm?.();
     }, [onConfirm]);
     const handleBackgroundClick = useCallback(() => {
         if (canCancel) {
@@ -2119,7 +2117,7 @@ const Dialog = forwardRef(({ isOpen, title, message, type = 'default', confirmTe
     useEffect(() => {
         if (isOpen) {
             const buttonToFocus = focusCancel && showCancel ? cancelRef.current : confirmRef.current;
-            buttonToFocus === null || buttonToFocus === void 0 ? void 0 : buttonToFocus.focus();
+            buttonToFocus?.focus();
         }
     }, [isOpen, focusCancel, showCancel]);
     useEffect(() => {
@@ -2319,7 +2317,7 @@ const Carousel = forwardRef(({ value: controlledValue, autoplay = false, interva
         if (syncDisplay) {
             setDisplayIndex(newIndex);
         }
-        onChange === null || onChange === void 0 ? void 0 : onChange(newIndex);
+        onChange?.(newIndex);
     }, [controlledValue, itemCount, repeat, onChange]);
     const goToPrev = useCallback(() => {
         if (activeIndex === 0 && repeat && itemCount > 1) {
@@ -2407,8 +2405,7 @@ const Carousel = forwardRef(({ value: controlledValue, autoplay = false, interva
     }, [handleDragEnd]);
     useEffect(() => {
         const handleKeyDown = (e) => {
-            var _a;
-            if (!((_a = carouselRef.current) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement)))
+            if (!carouselRef.current?.contains(document.activeElement))
                 return;
             switch (e.key) {
                 case 'ArrowLeft':
@@ -3114,17 +3111,16 @@ const Checkbox = forwardRef(({ color, size, className, children, textColor, disa
         ...props,
     });
     const group = useCheckboxesGroup();
-    const effectiveName = name !== null && name !== void 0 ? name : group === null || group === void 0 ? void 0 : group.name;
-    const groupManaged = (group === null || group === void 0 ? void 0 : group.value) !== undefined && value !== undefined;
+    const effectiveName = name ?? group?.name;
+    const groupManaged = group?.value !== undefined && value !== undefined;
     const groupHas = groupManaged && group.value.includes(String(value));
     const effectiveChecked = checked !== undefined ? checked : groupManaged ? groupHas : undefined;
     const effectiveDefaultChecked = groupManaged ? undefined : defaultChecked;
     const handleChange = useCallback((e) => {
-        var _a;
-        onChange === null || onChange === void 0 ? void 0 : onChange(e);
-        if ((group === null || group === void 0 ? void 0 : group.onChange) && value !== undefined) {
+        onChange?.(e);
+        if (group?.onChange && value !== undefined) {
             const valStr = String(value);
-            const currentArr = (_a = group.value) !== null && _a !== void 0 ? _a : [];
+            const currentArr = group.value ?? [];
             const next = e.target.checked
                 ? currentArr.includes(valStr)
                     ? currentArr
@@ -3185,29 +3181,23 @@ const Field = ({ horizontal, grouped, hasAddons, narrow, label, labelSize, label
         'is-grouped-multiline': grouped === 'multiline',
     });
     const fieldClass = classNames(mainClass, bulmaHelperClasses, className);
-    const effectiveLabelSize = labelSize !== null && labelSize !== void 0 ? labelSize : (horizontal ? 'normal' : undefined);
+    const effectiveLabelSize = labelSize ?? (horizontal ? 'normal' : undefined);
     const labelClass = usePrefixedClassNames('label');
     let renderedLabel = null;
     if (label) {
         if (horizontal) {
-            renderedLabel = (jsx(FieldLabel, { size: effectiveLabelSize, children: 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 }) }));
+            renderedLabel = (jsx(FieldLabel, { size: effectiveLabelSize, children: jsx("label", { ...labelProps, className: classNames(labelClass, labelProps?.className), style: labelProps?.style, children: label }) }));
         }
         else {
-            renderedLabel = (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 }));
+            renderedLabel = (jsx("label", { ...labelProps, className: classNames(labelClass, labelProps?.className), style: { display: 'block', ...(labelProps?.style || {}) }, children: label }));
         }
     }
     let content = children;
     if (horizontal) {
-        const isFieldBody = (c) => {
-            var _a;
-            return React.isValidElement(c) &&
-                (c.type === FieldBody || ((_a = c.type) === null || _a === void 0 ? void 0 : _a.displayName) === 'FieldBody');
-        };
-        const isFieldLabel = (c) => {
-            var _a;
-            return React.isValidElement(c) &&
-                (c.type === FieldLabel || ((_a = c.type) === null || _a === void 0 ? void 0 : _a.displayName) === 'FieldLabel');
-        };
+        const isFieldBody = (c) => React.isValidElement(c) &&
+            (c.type === FieldBody || c.type?.displayName === 'FieldBody');
+        const isFieldLabel = (c) => React.isValidElement(c) &&
+            (c.type === FieldLabel || c.type?.displayName === 'FieldLabel');
         const childArray = React.Children.toArray(children);
         const userProvidedStructure = childArray.some(c => isFieldBody(c) || isFieldLabel(c));
         if (userProvidedStructure) {
@@ -3285,7 +3275,7 @@ const Checkboxes = ({ label, labelSize, labelProps, horizontal, message, message
     const handleChange = useCallback((newValues) => {
         if (!isControlled)
             setInternalValue(newValues);
-        onChange === null || onChange === void 0 ? void 0 : onChange(newValues);
+        onChange?.(newValues);
     }, [isControlled, onChange]);
     const ctx = useMemo(() => ({
         name,
@@ -3354,8 +3344,8 @@ const Radio = forwardRef(({ color, size, className, children, textColor, disable
         ...props,
     });
     const group = useRadiosGroup();
-    const effectiveName = name !== null && name !== void 0 ? name : group === null || group === void 0 ? void 0 : group.name;
-    const groupManaged = (group === null || group === void 0 ? void 0 : group.value) !== undefined && value !== undefined;
+    const effectiveName = name ?? group?.name;
+    const groupManaged = group?.value !== undefined && value !== undefined;
     const effectiveChecked = checked !== undefined
         ? checked
         : groupManaged
@@ -3363,8 +3353,8 @@ const Radio = forwardRef(({ color, size, className, children, textColor, disable
             : undefined;
     const effectiveDefaultChecked = groupManaged ? undefined : defaultChecked;
     const handleChange = useCallback((e) => {
-        onChange === null || onChange === void 0 ? void 0 : onChange(e);
-        if ((group === null || group === void 0 ? void 0 : group.onChange) && value !== undefined) {
+        onChange?.(e);
+        if (group?.onChange && value !== undefined) {
             group.onChange(String(value));
         }
     }, [onChange, group, value]);
@@ -3396,7 +3386,7 @@ const Radios = ({ label, labelSize, labelProps, horizontal, message, messageColo
     const handleChange = useCallback((newValue) => {
         if (!isControlled)
             setInternalValue(newValue);
-        onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
+        onChange?.(newValue);
     }, [isControlled, onChange]);
     const ctx = useMemo(() => ({
         name,
@@ -3462,7 +3452,6 @@ function getTickPositions(min, max, step, ticks, marks) {
     return positions;
 }
 const Slider = forwardRef((props, ref) => {
-    var _a, _b, _c;
     let range;
     let controlledValue;
     let defaultValue;
@@ -3477,7 +3466,7 @@ const Slider = forwardRef((props, ref) => {
         defaultValue = props.defaultValue;
         onChange = props.onChange;
         ariaLabel = props.ariaLabel;
-        minDistance = (_a = props.minDistance) !== null && _a !== void 0 ? _a : 0;
+        minDistance = props.minDistance ?? 0;
         nameLow = props.nameLow;
         nameHigh = props.nameHigh;
     }
@@ -3492,9 +3481,9 @@ const Slider = forwardRef((props, ref) => {
     const insideField = useInsideField();
     const insideControl = useInsideControl();
     const { bulmaHelperClasses, rest } = useBulmaClasses(restProps);
-    const tooltipMode = tooltip !== null && tooltip !== void 0 ? tooltip : (showOutput ? 'auto' : 'hidden');
-    const [internalRange, setInternalRange] = useState(() => { var _a; return range ? ((_a = defaultValue) !== null && _a !== void 0 ? _a : [min, max]) : [min, min]; });
-    const [internalSingle, setInternalSingle] = useState(() => { var _a; return !range ? ((_a = defaultValue) !== null && _a !== void 0 ? _a : 0) : 0; });
+    const tooltipMode = tooltip ?? (showOutput ? 'auto' : 'hidden');
+    const [internalRange, setInternalRange] = useState(() => range ? (defaultValue ?? [min, max]) : [min, min]);
+    const [internalSingle, setInternalSingle] = useState(() => !range ? (defaultValue ?? 0) : 0);
     const [showTooltip, setShowTooltip] = useState(false);
     const [showTooltipHigh, setShowTooltipHigh] = useState(false);
     const inputRef = useRef(null);
@@ -3536,7 +3525,7 @@ const Slider = forwardRef((props, ref) => {
         const newValue = parseFloat(e.target.value);
         if (!isControlled)
             setInternalSingle(newValue);
-        onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
+        onChange?.(newValue);
     }, [isControlled, onChange]);
     const handleRangeLowChange = useCallback((e) => {
         const raw = parseFloat(e.target.value);
@@ -3544,7 +3533,7 @@ const Slider = forwardRef((props, ref) => {
         const newRange = [clamped, currentRange[1]];
         if (!isControlled)
             setInternalRange(newRange);
-        onChange === null || onChange === void 0 ? void 0 : onChange(newRange);
+        onChange?.(newRange);
     }, [isControlled, onChange, currentRange, minDistance]);
     const handleRangeHighChange = useCallback((e) => {
         const raw = parseFloat(e.target.value);
@@ -3552,7 +3541,7 @@ const Slider = forwardRef((props, ref) => {
         const newRange = [currentRange[0], clamped];
         if (!isControlled)
             setInternalRange(newRange);
-        onChange === null || onChange === void 0 ? void 0 : onChange(newRange);
+        onChange?.(newRange);
     }, [isControlled, onChange, currentRange, minDistance]);
     const handleKeyDown = useCallback((e) => {
         if (e.key === 'Home') {
@@ -3560,7 +3549,7 @@ const Slider = forwardRef((props, ref) => {
             if (!range) {
                 if (!isControlled)
                     setInternalSingle(min);
-                onChange === null || onChange === void 0 ? void 0 : onChange(min);
+                onChange?.(min);
             }
         }
         else if (e.key === 'End') {
@@ -3568,7 +3557,7 @@ const Slider = forwardRef((props, ref) => {
             if (!range) {
                 if (!isControlled)
                     setInternalSingle(max);
-                onChange === null || onChange === void 0 ? void 0 : onChange(max);
+                onChange?.(max);
             }
         }
     }, [range, isControlled, onChange, min, max]);
@@ -3755,7 +3744,7 @@ const Slider = forwardRef((props, ref) => {
                     : {
                         '--slider-progress-low': `${progressLow}%`,
                         '--slider-progress-high': `${progressHigh}%`,
-                    } }), 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 } : {}) }), 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' && (jsx("output", { ref: outputRef, className: classNames('slider-output slider-output-low', {
+                    } }), 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 } : {}) }), 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' && (jsx("output", { ref: outputRef, className: classNames('slider-output slider-output-low', {
                     'is-visible': showTipLow,
                     'is-flipped': flipped,
                     'is-flipped-left': isVertical && verticalFlippedLeft,
@@ -3811,7 +3800,7 @@ const ArrowDropUp = () => (jsx("svg", { viewBox: "0 0 24 24", fill: "none", stro
 const ArrowDropDown = () => (jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: jsx("path", { d: "M7 9.5l5 5 5-5" }) }));
 const Numberinput = 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) => {
     const insideField = useInsideField();
-    const effectiveBare = bare !== null && bare !== void 0 ? bare : insideField;
+    const effectiveBare = bare ?? insideField;
     const { bulmaHelperClasses, rest } = useBulmaClasses(props);
     const [internalValue, setInternalValue] = useState(defaultValue);
     const inputRef = useRef(null);
@@ -3833,18 +3822,18 @@ const Numberinput = forwardRef(({ label, labelSize, labelProps, horizontal, mess
         if (!isControlled) {
             setInternalValue(clampedValue);
         }
-        onChange === null || onChange === void 0 ? void 0 : onChange(clampedValue);
+        onChange?.(clampedValue);
     }, [isControlled, clampValue, onChange]);
     const getEffectiveStep = useCallback(() => {
         if (!exponential)
             return step;
-        return step * Math.max(1, Math.floor(Math.abs(currentValue !== null && currentValue !== void 0 ? currentValue : 0)));
+        return step * Math.max(1, Math.floor(Math.abs(currentValue ?? 0)));
     }, [exponential, step, currentValue]);
     const handleIncrement = useCallback(() => {
-        updateValue((currentValue !== null && currentValue !== void 0 ? currentValue : 0) + getEffectiveStep());
+        updateValue((currentValue ?? 0) + getEffectiveStep());
     }, [currentValue, getEffectiveStep, updateValue]);
     const handleDecrement = useCallback(() => {
-        updateValue((currentValue !== null && currentValue !== void 0 ? currentValue : 0) - getEffectiveStep());
+        updateValue((currentValue ?? 0) - getEffectiveStep());
     }, [currentValue, getEffectiveStep, updateValue]);
     const handleInputChange = useCallback((e) => {
         const newValue = parseFloat(e.target.value);
@@ -3907,7 +3896,7 @@ const Numberinput = forwardRef(({ label, labelSize, labelProps, horizontal, mess
             ref.current = node;
         }
     };
-    const inputControl = (jsx("div", { className: expandedControlClasses, children: 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 }) }));
+    const inputControl = (jsx("div", { className: expandedControlClasses, children: 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 }) }));
     if (isStepper) {
         const stepperElement = (jsxs("div", { className: combinedClasses, children: [inputControl, jsx("div", { className: controlClasses, children: jsxs("div", { className: stepperClasses, children: [jsx("button", { type: "button", className: stepperButtonClasses, onClick: handleIncrement, disabled: disabled || isAtMax, tabIndex: -1, "aria-label": "Increase value", children: jsx(ArrowDropUp, {}) }), jsx("button", { type: "button", className: stepperButtonClasses, onClick: handleDecrement, disabled: disabled || isAtMin, tabIndex: -1, "aria-label": "Decrease value", children: jsx(ArrowDropDown, {}) })] }) })] }));
         if (!insideField) {
@@ -3975,7 +3964,7 @@ const Rate = forwardRef(({ label, labelSize, labelProps, horizontal, message, me
         if (!isControlled) {
             setInternalValue(finalValue);
         }
-        onChange === null || onChange === void 0 ? void 0 : onChange(finalValue);
+        onChange?.(finalValue);
     }, [isControlled, currentValue, disabled, onChange]);
     const handleClick = useCallback((iconIndex, e) => {
         if (disabled)
@@ -4040,7 +4029,7 @@ const Rate = forwardRef(({ label, labelSize, labelProps, horizontal, message, me
             if (!isControlled) {
                 setInternalValue(newValue);
             }
-            onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
+            onChange?.(newValue);
         }
     }, [currentValue, max, precision, disabled, isControlled, onChange]);
     const getText = () => {
@@ -4090,7 +4079,7 @@ const Rate = forwardRef(({ label, labelSize, labelProps, horizontal, message, me
             const iconProps = {
                 index: iconIndex,
                 isActive: fillPercent > 0,
-                isHovered: hoverValue !== null && iconIndex < (hoverValue !== null && hoverValue !== void 0 ? hoverValue : 0),
+                isHovered: hoverValue !== null && iconIndex < (hoverValue ?? 0),
                 value: displayValue,
                 fillPercent,
             };
@@ -4173,7 +4162,7 @@ const Autocomplete = forwardRef(({ data = [], value: controlledValue, placeholde
         if (controlledValue === undefined) {
             setInternalValue(newValue);
         }
-        onInput === null || onInput === void 0 ? void 0 : onInput(newValue);
+        onInput?.(newValue);
         if (!isActive && newValue) {
             setIsActive(true);
         }
@@ -4185,21 +4174,20 @@ const Autocomplete = forwardRef(({ data = [], value: controlledValue, placeholde
         if (controlledValue === undefined) {
             setInternalValue(displayValue);
         }
-        onInput === null || onInput === void 0 ? void 0 : onInput(displayValue);
-        onSelect === null || onSelect === void 0 ? void 0 : onSelect(item);
+        onInput?.(displayValue);
+        onSelect?.(item);
         if (!keepOpen) {
             setIsActive(false);
         }
         setHighlightedIndex(-1);
     }, [controlledValue, field, keepOpen, onInput, onSelect]);
     const handleClear = useCallback(() => {
-        var _a;
         if (controlledValue === undefined) {
             setInternalValue('');
         }
-        onInput === null || onInput === void 0 ? void 0 : onInput('');
-        onSelect === null || onSelect === void 0 ? void 0 : onSelect(null);
-        (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        onInput?.('');
+        onSelect?.(null);
+        inputRef.current?.focus();
     }, [controlledValue, onInput, onSelect]);
     const handleFocus = useCallback(() => {
         if (openOnFocus && !disabled) {
@@ -4231,7 +4219,7 @@ const Autocomplete = forwardRef(({ data = [], value: controlledValue, placeholde
         handleSelect,
     ]);
     useEffect(() => {
-        onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(isActive);
+        onActiveChange?.(isActive);
     }, [isActive, onActiveChange]);
     useEffect(() => {
         if (keepFirst && isActive && filteredData.length > 0) {
@@ -4279,7 +4267,7 @@ const Autocomplete = forwardRef(({ data = [], value: controlledValue, placeholde
             return;
         const { scrollTop, scrollHeight, clientHeight } = dropdownRef.current;
         if (scrollHeight - scrollTop - clientHeight <= infiniteScrollDistance) {
-            onInfiniteScroll === null || onInfiniteScroll === void 0 ? void 0 : onInfiniteScroll();
+            onInfiniteScroll?.();
         }
     }, [checkInfiniteScroll, infiniteScrollDistance, onInfiniteScroll]);
     useEffect(() => {
@@ -4385,7 +4373,7 @@ const Taginput = forwardRef(({ label, labelSize, labelProps, horizontal, message
         if (controlledValue === undefined) {
             setInternalTags(newTags);
         }
-        onChange === null || onChange === void 0 ? void 0 : onChange(newTags);
+        onChange?.(newTags);
     }, [controlledValue, onChange]);
     const addTag = useCallback((value) => {
         if (disabled || readonly)
@@ -4409,7 +4397,7 @@ const Taginput = forwardRef(({ label, labelSize, labelProps, horizontal, message
         const finalTag = createTag ? createTag(displayValue) : tagValue;
         const newTags = [...tags, finalTag];
         updateTags(newTags);
-        onAdd === null || onAdd === void 0 ? void 0 : onAdd(finalTag);
+        onAdd?.(finalTag);
         setInputValue('');
         if (!keepOpen) {
             setIsActive(false);
@@ -4436,7 +4424,7 @@ const Taginput = forwardRef(({ label, labelSize, labelProps, horizontal, message
         const removedTag = tags[index];
         const newTags = tags.filter((_, i) => i !== index);
         updateTags(newTags);
-        onRemove === null || onRemove === void 0 ? void 0 : onRemove(removedTag, index);
+        onRemove?.(removedTag, index);
     }, [disabled, readonly, tags, updateTags, onRemove]);
     const handleInputChange = useCallback((e) => {
         const newValue = e.target.value;
@@ -4449,7 +4437,7 @@ const Taginput = forwardRef(({ label, labelSize, labelProps, horizontal, message
             return;
         }
         setInputValue(newValue);
-        onTyping === null || onTyping === void 0 ? void 0 : onTyping(newValue);
+        onTyping?.(newValue);
         if (newValue && data.length > 0) {
             setIsActive(true);
         }
@@ -4554,8 +4542,7 @@ const Taginput = forwardRef(({ label, labelSize, labelProps, horizontal, message
         }
     }, [ref]);
     const handleContainerClick = useCallback(() => {
-        var _a;
-        (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        inputRef.current?.focus();
     }, []);
     const taginputClasses = pcn('taginput', {
         'is-active': isActive,
@@ -4763,7 +4750,7 @@ const DEFAULT_PICKER_LABELS = {
 };
 const mergeLabels = (overrides) => ({
     ...DEFAULT_PICKER_LABELS,
-    ...(overrides !== null && overrides !== void 0 ? overrides : {}),
+    ...(overrides ?? {}),
 });
 
 const DEFAULT_DATE_FORMAT = 'YYYY-MM-DD';
@@ -4821,19 +4808,19 @@ function formatWithIntl(d, options, locale) {
     return new Intl.DateTimeFormat(locale, options).format(d);
 }
 function formatDate(d, fmt, locale) {
-    const f = fmt !== null && fmt !== void 0 ? fmt : DEFAULT_DATE_FORMAT;
+    const f = fmt ?? DEFAULT_DATE_FORMAT;
     if (typeof f === 'string')
         return formatTokenString(d, f);
     return formatWithIntl(d, f, locale);
 }
 function formatTime(d, fmt, locale) {
-    const f = fmt !== null && fmt !== void 0 ? fmt : DEFAULT_TIME_FORMAT_24;
+    const f = fmt ?? DEFAULT_TIME_FORMAT_24;
     if (typeof f === 'string')
         return formatTokenString(d, f);
     return formatWithIntl(d, f, locale);
 }
 function formatDateTime(d, fmt, locale) {
-    const f = fmt !== null && fmt !== void 0 ? fmt : DEFAULT_DATETIME_FORMAT;
+    const f = fmt ?? DEFAULT_DATETIME_FORMAT;
     if (typeof f === 'string')
         return formatTokenString(d, f);
     return formatWithIntl(d, f, locale);
@@ -4850,19 +4837,18 @@ function hourCycleFromFormat(fmt) {
     return null;
 }
 function parseDate(s, fmt, _locale) {
-    var _a, _b, _c, _d, _e, _f;
     if (!s)
         return null;
-    const format = fmt !== null && fmt !== void 0 ? fmt : DEFAULT_DATE_FORMAT;
+    const format = fmt ?? DEFAULT_DATE_FORMAT;
     const parts = parseTokens(s, format);
     if (!parts)
         return null;
-    const year = (_a = parts.year) !== null && _a !== void 0 ? _a : new Date().getFullYear();
-    const month = ((_b = parts.month) !== null && _b !== void 0 ? _b : 1) - 1;
-    const day = (_c = parts.day) !== null && _c !== void 0 ? _c : 1;
-    const hours = (_d = parts.hours) !== null && _d !== void 0 ? _d : 0;
-    const minutes = (_e = parts.minutes) !== null && _e !== void 0 ? _e : 0;
-    const seconds = (_f = parts.seconds) !== null && _f !== void 0 ? _f : 0;
+    const year = parts.year ?? new Date().getFullYear();
+    const month = (parts.month ?? 1) - 1;
+    const day = parts.day ?? 1;
+    const hours = parts.hours ?? 0;
+    const minutes = parts.minutes ?? 0;
+    const seconds = parts.seconds ?? 0;
     const d = new Date(year, month, day, hours, minutes, seconds, 0);
     if (d.getFullYear() !== year ||
         d.getMonth() !== month ||
@@ -4872,15 +4858,14 @@ function parseDate(s, fmt, _locale) {
     return d;
 }
 function parseTime(s, fmt) {
-    var _a, _b, _c;
     if (!s)
         return null;
-    const format = fmt !== null && fmt !== void 0 ? fmt : DEFAULT_TIME_FORMAT_24;
+    const format = fmt ?? DEFAULT_TIME_FORMAT_24;
     const parts = parseTokens(s, format);
     if (!parts)
         return null;
     const today = new Date();
-    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);
+    return new Date(today.getFullYear(), today.getMonth(), today.getDate(), parts.hours ?? 0, parts.minutes ?? 0, parts.seconds ?? 0, 0);
 }
 function escapeRegExp(s) {
     return s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
@@ -5154,9 +5139,9 @@ const Calendar = ({ value, focusedDate, onSelect, onFocusedDateChange, min, max,
     const isDateUnselectable = useCallback((d) => {
         if (!isWithin(d, min, max))
             return true;
-        if (shouldDisableDate === null || shouldDisableDate === void 0 ? void 0 : shouldDisableDate(d))
+        if (shouldDisableDate?.(d))
             return true;
-        if (unselectableDates === null || unselectableDates === void 0 ? void 0 : unselectableDates.some(u => isSameDay(u, d)))
+        if (unselectableDates?.some(u => isSameDay(u, d)))
             return true;
         return false;
     }, [min, max, shouldDisableDate, unselectableDates]);
@@ -5253,7 +5238,7 @@ const Calendar = ({ value, focusedDate, onSelect, onFocusedDateChange, min, max,
         const focusedYear = focusedDate.getFullYear();
         const minYear = min ? min.getFullYear() : focusedYear - 100;
         const maxYear = max ? max.getFullYear() : focusedYear + 100;
-        const [lo, hi] = yearsRange !== null && yearsRange !== void 0 ? yearsRange : [minYear, maxYear];
+        const [lo, hi] = yearsRange ?? [minYear, maxYear];
         const start = Math.max(lo, minYear);
         const end = Math.min(hi, maxYear);
         const out = [];
@@ -5273,14 +5258,14 @@ const Calendar = ({ value, focusedDate, onSelect, onFocusedDateChange, min, max,
         if (!autoFocusCell || !gridRef.current)
             return;
         const target = gridRef.current.querySelector('[data-focused="true"]');
-        target === null || target === void 0 ? void 0 : target.focus();
+        target?.focus();
     }, [autoFocusCell, focusedDate, view]);
     useEffect(() => {
         if (view !== 'years' || !yearGridRef.current)
             return;
         const sel = yearGridRef.current.querySelector('[data-focused-year="true"]');
-        sel === null || sel === void 0 ? void 0 : sel.scrollIntoView({ block: 'center' });
-        sel === null || sel === void 0 ? void 0 : sel.focus();
+        sel?.scrollIntoView({ block: 'center' });
+        sel?.focus();
     }, [view]);
     const focusedYear = focusedDate.getFullYear();
     const todayYear = new Date().getFullYear();
@@ -5339,13 +5324,12 @@ function useFocusTrap(containerRef, active, options = {}) {
             ? document.activeElement
             : null;
         const focusInitial = () => {
-            var _a;
-            if (initialFocusRef === null || initialFocusRef === void 0 ? void 0 : initialFocusRef.current) {
+            if (initialFocusRef?.current) {
                 initialFocusRef.current.focus();
                 return;
             }
             const focusables = Array.from(container.querySelectorAll(FOCUSABLE_SELECTOR)).filter(el => !el.hasAttribute('disabled'));
-            const target = (_a = focusables[0]) !== null && _a !== void 0 ? _a : container;
+            const target = focusables[0] ?? container;
             target.focus();
         };
         focusInitial();
@@ -5372,7 +5356,7 @@ function useFocusTrap(containerRef, active, options = {}) {
         container.addEventListener('keydown', handleKeyDown);
         return () => {
             container.removeEventListener('keydown', handleKeyDown);
-            if (restoreFocus && (previouslyFocused === null || previouslyFocused === void 0 ? void 0 : previouslyFocused.focus)) {
+            if (restoreFocus && previouslyFocused?.focus) {
                 previouslyFocused.focus();
             }
         };
@@ -5746,13 +5730,12 @@ function setAmPm(currentDate, isPm) {
     return next;
 }
 function segmentIndexAtCaret(map, caret) {
-    var _a;
     for (const idx of map.editable) {
         const s = map.segments[idx];
         if (caret >= s.start && caret <= s.end)
             return idx;
     }
-    let bestIdx = (_a = map.editable[0]) !== null && _a !== void 0 ? _a : null;
+    let bestIdx = map.editable[0] ?? null;
     let bestDist = Infinity;
     for (const idx of map.editable) {
         const s = map.segments[idx];
@@ -5772,8 +5755,8 @@ function useSegmentedEntry(params) {
     const [activeSegmentIdx, setActiveSegmentIdx] = useState(null);
     const typedDigitsRef = useRef('');
     const segmentEditable = !!segmentMap && !!editable && !disabled && !readOnly;
-    const segmentBaseDate = useCallback(() => value !== null && value !== void 0 ? value : makeBaseDate(), [value, makeBaseDate]);
-    const isAllowed = useCallback((d) => isWithin(d, min, max) && !(isBlocked === null || isBlocked === void 0 ? void 0 : isBlocked(d)), [min, max, isBlocked]);
+    const segmentBaseDate = useCallback(() => value ?? makeBaseDate(), [value, makeBaseDate]);
+    const isAllowed = useCallback((d) => isWithin(d, min, max) && !isBlocked?.(d), [min, max, isBlocked]);
     const applyDateFromSegment = useCallback((next) => {
         if (!isAllowed(next))
             return;
@@ -5816,7 +5799,7 @@ function useSegmentedEntry(params) {
             containerRef.current !== null &&
             containerRef.current.contains(nextFocus);
         if (stayingInPicker) {
-            onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
+            onBlur?.(e);
             return;
         }
         setActiveSegmentIdx(null);
@@ -5828,7 +5811,7 @@ function useSegmentedEntry(params) {
         else {
             setText(value ? formatFn(value, format, locale) : '');
         }
-        onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
+        onBlur?.(e);
     }, [
         containerRef,
         tryParse,
@@ -5852,7 +5835,7 @@ function useSegmentedEntry(params) {
             typedDigitsRef.current = '';
             setActiveSegmentIdx(segmentMap.editable[0]);
         }
-        onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
+        onFocus?.(e);
     }, [
         openOnFocus,
         popover,
@@ -5870,18 +5853,17 @@ function useSegmentedEntry(params) {
         onFocus,
     ]);
     const handleClick = useCallback((e) => {
-        var _a;
         if (openOnFocus && popover && !disabled && !readOnly)
             setOpen(true);
         if (segmentEditable && segmentMap && inputRef.current) {
-            const caret = (_a = inputRef.current.selectionStart) !== null && _a !== void 0 ? _a : 0;
+            const caret = inputRef.current.selectionStart ?? 0;
             const idx = segmentIndexAtCaret(segmentMap, caret);
             if (idx !== null && idx !== activeSegmentIdx) {
                 typedDigitsRef.current = '';
                 setActiveSegmentIdx(idx);
             }
         }
-        onClick === null || onClick === void 0 ? void 0 : onClick(e);
+        onClick?.(e);
     }, [
         openOnFocus,
         popover,
@@ -5999,7 +5981,7 @@ function useSegmentedEntry(params) {
                     setOpen(false);
             }
         }
-        onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(e);
+        onKeyDown?.(e);
     }, [
         inSegmentMode,
         segmentMap,
@@ -6043,9 +6025,9 @@ const DateInputBase = forwardRef((props, ref) => {
     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;
     const t = mergeLabels(labels);
     const isControlled = controlledValue !== undefined;
-    const [internalValue, setInternalValue] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);
-    const value = isControlled ? (controlledValue !== null && controlledValue !== void 0 ? controlledValue : null) : internalValue;
-    const initialFocused = useMemo(() => clampDate(value !== null && value !== void 0 ? value : new Date(), min, max), []);
+    const [internalValue, setInternalValue] = useState(defaultValue ?? null);
+    const value = isControlled ? (controlledValue ?? null) : internalValue;
+    const initialFocused = useMemo(() => clampDate(value ?? new Date(), min, max), []);
     const [focusedDate, setFocusedDate] = useState(initialFocused);
     useEffect(() => {
         setFocusedDate(prev => clampDate(prev, min, max));
@@ -6073,9 +6055,9 @@ const DateInputBase = forwardRef((props, ref) => {
             if (prev === next)
                 return prev;
             if (next)
-                onOpen === null || onOpen === void 0 ? void 0 : onOpen();
+                onOpen?.();
             else
-                onClose === null || onClose === void 0 ? void 0 : onClose();
+                onClose?.();
             return next;
         });
     }, [onOpen, onClose]);
@@ -6087,7 +6069,7 @@ const DateInputBase = forwardRef((props, ref) => {
             setInternalValue(next);
         if (next)
             setFocusedDate(next);
-        onChange === null || onChange === void 0 ? void 0 : onChange(next);
+        onChange?.(next);
     }, [isControlled, onChange]);
     const handleSelect = useCallback((d) => {
         if (!isWithin(d, min, max))
@@ -6104,7 +6086,7 @@ const DateInputBase = forwardRef((props, ref) => {
         const fmt = typeof format === 'string' ? format : undefined;
         return parse
             ? parse(trimmed)
-            : parseDate(trimmed, fmt !== null && fmt !== void 0 ? fmt : DEFAULT_DATE_FORMAT);
+            : parseDate(trimmed, fmt ?? DEFAULT_DATE_FORMAT);
     }, [parse, format, locale]);
     const makeBaseDate = useCallback(() => {
         const d = new Date();
@@ -6114,13 +6096,13 @@ const DateInputBase = forwardRef((props, ref) => {
     const inputReadOnlyAttr = !!readOnly || !editable;
     const canOpen = !!popover && !disabled && !readOnly;
     const isBlocked = useMemo(() => {
-        if (!shouldDisableDate && !(unselectableDates === null || unselectableDates === void 0 ? void 0 : unselectableDates.length))
+        if (!shouldDisableDate && !unselectableDates?.length)
             return undefined;
-        return (d) => !!(shouldDisableDate === null || shouldDisableDate === void 0 ? void 0 : shouldDisableDate(d)) ||
-            !!(unselectableDates === null || unselectableDates === void 0 ? void 0 : unselectableDates.some(u => isSameDay(u, d)));
+        return (d) => !!shouldDisableDate?.(d) ||
+            !!unselectableDates?.some(u => isSameDay(u, d));
     }, [shouldDisableDate, unselectableDates]);
     const { inputHandlers } = useSegmentedEntry({
-        format: format !== null && format !== void 0 ? format : DEFAULT_DATE_FORMAT,
+        format: format ?? DEFAULT_DATE_FORMAT,
         value,
         commitValue,
         formatFn: formatDate,
@@ -6175,13 +6157,12 @@ const DateInputBase = forwardRef((props, ref) => {
 DateInputBase.displayName = 'DateInputBase';
 
 const DateInput = forwardRef(({ label, labelSize, labelProps, horizontal, iconLeft, iconRight, iconLeftName = 'calendar', iconRightName, iconLeftSize, iconRightSize, hasIconsLeft, hasIconsRight, isLoading, isExpanded, controlSize, message, messageColor, fieldClassName, controlClassName, ...baseProps }, ref) => {
-    var _a;
     const insideField = useInsideField();
     const insideControl = useInsideControl();
     const helpClass = usePrefixedClassNames('help', {
         [`is-${messageColor}`]: !!messageColor,
     });
-    let content = (jsx(DateInputBase, { ref: ref, ...baseProps, triggerIcon: (_a = baseProps.triggerIcon) !== null && _a !== void 0 ? _a : !isLoading }));
+    let content = (jsx(DateInputBase, { ref: ref, ...baseProps, triggerIcon: baseProps.triggerIcon ?? !isLoading }));
     if (!insideControl && !baseProps.inline) {
         content = (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 }));
     }
@@ -6206,11 +6187,10 @@ const tickHaptic = () => {
 
 let audioCtx = null;
 const getAudioContextCtor = () => {
-    var _a, _b;
     if (typeof window === 'undefined')
         return null;
     const w = window;
-    return (_b = (_a = w.AudioContext) !== null && _a !== void 0 ? _a : w.webkitAudioContext) !== null && _b !== void 0 ? _b : null;
+    return w.AudioContext ?? w.webkitAudioContext ?? null;
 };
 const ensureAudioCtx = () => {
     if (audioCtx)
@@ -6290,11 +6270,10 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
     const audioTickEnabledRef = useRef(audioTick);
     audioTickEnabledRef.current = audioTick;
     const playBandPulse = useCallback(() => {
-        var _a;
         const el = bandRef.current;
         if (!el || typeof el.animate !== 'function')
             return;
-        if ((_a = reducedMotionMqlRef.current) === null || _a === void 0 ? void 0 : _a.matches)
+        if (reducedMotionMqlRef.current?.matches)
             return;
         pulseAnimRef.current = el.animate([
             { transform: 'scale(1)', filter: 'brightness(1)' },
@@ -6330,15 +6309,13 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
         }
     }, []);
     useEffect(() => () => {
-        var _a;
         cancelRaf();
-        (_a = pulseAnimRef.current) === null || _a === void 0 ? void 0 : _a.cancel();
+        pulseAnimRef.current?.cancel();
         pulseAnimRef.current = null;
     }, [cancelRaf]);
     React.useImperativeHandle(ref, () => ({
-        focus: () => { var _a; return (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.focus(); },
+        focus: () => rootRef.current?.focus(),
         startDrag: (pointerId, clientY) => {
-            var _a;
             if (disabled)
                 return;
             cancelRaf();
@@ -6353,7 +6330,7 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
                 samples: [{ t: now, y: clientY }],
             };
             try {
-                (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.setPointerCapture(pointerId);
+                rootRef.current?.setPointerCapture(pointerId);
             }
             catch {
             }
@@ -6443,15 +6420,15 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
                 break;
             case 'ArrowLeft':
                 e.preventDefault();
-                onFocusPrev === null || onFocusPrev === void 0 ? void 0 : onFocusPrev();
+                onFocusPrev?.();
                 break;
             case 'ArrowRight':
                 e.preventDefault();
-                onFocusNext === null || onFocusNext === void 0 ? void 0 : onFocusNext();
+                onFocusNext?.();
                 break;
             case 'Enter':
                 e.preventDefault();
-                onCommit === null || onCommit === void 0 ? void 0 : onCommit();
+                onCommit?.();
                 break;
         }
     }, [
@@ -6577,7 +6554,6 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
         };
     };
     const onPointerMove = (e) => {
-        var _a;
         const s = dragStateRef.current;
         if (s.pointerId !== e.pointerId)
             return;
@@ -6585,7 +6561,7 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
         if (!s.captured) {
             if (Math.abs(dy) < DRAG_THRESHOLD_PX)
                 return;
-            (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.setPointerCapture(e.pointerId);
+            rootRef.current?.setPointerCapture(e.pointerId);
             s.captured = true;
             setIsDragging(true);
         }
@@ -6598,13 +6574,12 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
         commitPosition(s.startPosition - dy / itemHeight);
     };
     const onPointerUp = (e) => {
-        var _a, _b;
         const s = dragStateRef.current;
         if (s.pointerId !== e.pointerId)
             return;
         if (s.captured) {
-            (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.releasePointerCapture(e.pointerId);
-            (_b = rootRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+            rootRef.current?.releasePointerCapture(e.pointerId);
+            rootRef.current?.focus();
             const samples = s.samples;
             let pxPerMs = 0;
             if (samples.length >= 2) {
@@ -6671,15 +6646,13 @@ const WheelInner = ({ values, index, onChange, formatLabel, formatAriaText, aria
                         height: itemHeight,
                         top: `${top}px`,
                     }, disabled: itemDisabled, onClick: () => {
-                        var _a;
                         moveBy(vIdx - virtualIdx);
-                        (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+                        rootRef.current?.focus();
                     }, children: formatLabel(values[aIdx]) }, vIdx));
             })] }));
 };
 const Wheel = React.forwardRef(WheelInner);
 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, }) => {
-    var _a;
     const t = mergeLabels(labels);
     const rootClass = usePrefixedClassNames('timeinput', {
         [`is-${color}`]: !!color,
@@ -6702,29 +6675,27 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
         return !unselectableTimes(probe);
     }, [unselectableTimes]);
     const isHourDisabled = useCallback((display) => {
-        var _a;
         let h24 = display;
         if (hourFormat === '12') {
             const base = display % 12;
             h24 = isPm ? base + 12 : base;
         }
-        return !isTimeAllowed(h24, value.minutes, (_a = value.seconds) !== null && _a !== void 0 ? _a : 0);
+        return !isTimeAllowed(h24, value.minutes, value.seconds ?? 0);
     }, [hourFormat, isPm, isTimeAllowed, value.minutes, value.seconds]);
-    const isMinuteDisabled = useCallback((m) => { var _a; return !isTimeAllowed(value.hours, m, (_a = value.seconds) !== null && _a !== void 0 ? _a : 0); }, [isTimeAllowed, value.hours, value.seconds]);
+    const isMinuteDisabled = useCallback((m) => !isTimeAllowed(value.hours, m, value.seconds ?? 0), [isTimeAllowed, value.hours, value.seconds]);
     const isSecondDisabled = useCallback((s) => !isTimeAllowed(value.hours, value.minutes, s), [isTimeAllowed, value.hours, value.minutes]);
     const hourDisabledFor = unselectableTimes ? isHourDisabled : undefined;
     const minuteDisabledFor = unselectableTimes ? isMinuteDisabled : undefined;
     const secondDisabledFor = unselectableTimes ? isSecondDisabled : undefined;
     const commit = useCallback((next) => {
-        var _a, _b, _c, _d, _e;
         const merged = {
-            hours: (_a = next.hours) !== null && _a !== void 0 ? _a : value.hours,
-            minutes: (_b = next.minutes) !== null && _b !== void 0 ? _b : value.minutes,
+            hours: next.hours ?? value.hours,
+            minutes: next.minutes ?? value.minutes,
             seconds: enableSeconds
-                ? ((_d = (_c = next.seconds) !== null && _c !== void 0 ? _c : value.seconds) !== null && _d !== void 0 ? _d : 0)
+                ? (next.seconds ?? value.seconds ?? 0)
                 : undefined,
         };
-        if (!isTimeAllowed(merged.hours, merged.minutes, (_e = merged.seconds) !== null && _e !== void 0 ? _e : 0)) {
+        if (!isTimeAllowed(merged.hours, merged.minutes, merged.seconds ?? 0)) {
             return;
         }
         onChange(merged);
@@ -6763,7 +6734,7 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
         : value.hours;
     const hourIndex = Math.max(0, hourValues.indexOf(displayedHours));
     const minuteIndex = Math.max(0, minuteValues.indexOf(value.minutes));
-    const secondIndex = Math.max(0, secondValues.indexOf((_a = value.seconds) !== null && _a !== void 0 ? _a : 0));
+    const secondIndex = Math.max(0, secondValues.indexOf(value.seconds ?? 0));
     const ampmIndex = isPm ? 1 : 0;
     const hoursRef = useRef(null);
     const minutesRef = useRef(null);
@@ -6776,7 +6747,7 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
         columnOrder.push(secondsRef);
     if (hourFormat === '12')
         columnOrder.push(ampmRef);
-    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(); };
+    const focusAt = (i) => columnOrder[i]?.current?.focus();
     const indexOf = (r) => columnOrder.indexOf(r);
     const focusPrevOf = (r) => () => focusAt(indexOf(r) - 1);
     const focusNextOf = (r) => () => focusAt(indexOf(r) + 1);
@@ -6787,18 +6758,17 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
             const baseHour = display % 12;
             next24 = isPm ? baseHour + 12 : baseHour;
         }
-        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); });
+        const allowed = nextValid(next24, next24 >= value.hours ? 1 : -1, 24, h => isTimeAllowed(h, value.minutes, value.seconds ?? 0));
         commit({ hours: allowed });
     };
     const onMinuteIndex = (next) => {
         const m = minuteValues[Math.max(0, Math.min(minuteValues.length - 1, next))];
-        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); });
+        const allowed = nextValid(m, m >= value.minutes ? 1 : -1, 60, mm => isTimeAllowed(value.hours, mm, value.seconds ?? 0));
         commit({ minutes: allowed });
     };
     const onSecondIndex = (next) => {
-        var _a;
         const s = secondValues[Math.max(0, Math.min(secondValues.length - 1, next))];
-        const allowed = nextValid(s, s >= ((_a = value.seconds) !== null && _a !== void 0 ? _a : 0) ? 1 : -1, 60, ss => isTimeAllowed(value.hours, value.minutes, ss));
+        const allowed = nextValid(s, s >= (value.seconds ?? 0) ? 1 : -1, 60, ss => isTimeAllowed(value.hours, value.minutes, ss));
         commit({ seconds: allowed });
     };
     const onAmpmIndex = (next) => {
@@ -6807,7 +6777,6 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
         commit({ hours: (value.hours + 12) % 24 });
     };
     const onWheelsContainerPointerDown = (e) => {
-        var _a, _b;
         if (disabled)
             return;
         if (e.target.closest(`.${wheelSingleClass}`))
@@ -6830,7 +6799,7 @@ const TimeWheels = ({ value, onChange, hourFormat = '24', enableSeconds = false,
                 nearestIdx = i;
             }
         });
-        (_b = (_a = columnOrder[nearestIdx]) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.startDrag(e.pointerId, e.clientY);
+        columnOrder[nearestIdx]?.current?.startDrag(e.pointerId, e.clientY);
     };
     return (jsx("div", { id: id, className: classNames(rootClass, className), "aria-disabled": disabled, children: jsxs("div", { className: wheelsClass, ref: wheelsContainerRef, onPointerDown: onWheelsContainerPointerDown, children: [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 }), jsx("div", { className: sepClass, "aria-hidden": "true", children: ":" }), 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 && (jsxs(Fragment, { children: [jsx("div", { className: sepClass, "aria-hidden": "true", children: ":" }), 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' && (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 }))] }) }));
 };
@@ -6852,23 +6821,23 @@ const fromIsoTime = (s) => {
     return new Date(today.getFullYear(), today.getMonth(), today.getDate(), Number(m[1]), Number(m[2]), m[3] ? Number(m[3]) : 0, 0);
 };
 const TimeInputBase = forwardRef((props, ref) => {
-    var _a, _b, _c, _d;
     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;
     const hasVibrate = typeof navigator !== 'undefined' &&
         typeof navigator.vibrate === 'function';
     const effectiveAudioTick = audioTick || (haptics && !hasVibrate);
     const t = mergeLabels(labels);
     const isControlled = controlledValue !== undefined;
-    const [internalValue, setInternalValue] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);
-    const value = isControlled ? (controlledValue !== null && controlledValue !== void 0 ? controlledValue : null) : internalValue;
-    const defaultFormat = format !== null && format !== void 0 ? format : (hourFormat === '12'
-        ? enableSeconds
-            ? 'hh:mm:ss A'
-            : DEFAULT_TIME_FORMAT_12
-        : enableSeconds
-            ? 'HH:mm:ss'
-            : DEFAULT_TIME_FORMAT_24);
-    const effectiveHourFormat = (_a = hourCycleFromFormat(defaultFormat)) !== null && _a !== void 0 ? _a : hourFormat;
+    const [internalValue, setInternalValue] = useState(defaultValue ?? null);
+    const value = isControlled ? (controlledValue ?? null) : internalValue;
+    const defaultFormat = format ??
+        (hourFormat === '12'
+            ? enableSeconds
+                ? 'hh:mm:ss A'
+                : DEFAULT_TIME_FORMAT_12
+            : enableSeconds
+                ? 'HH:mm:ss'
+                : DEFAULT_TIME_FORMAT_24);
+    const effectiveHourFormat = hourCycleFromFormat(defaultFormat) ?? hourFormat;
     const [open, setOpenState] = useState(false);
     const [text, setText] = useState(value ? formatTime(value, defaultFormat, locale) : '');
     const inputRef = useRef(null);
@@ -6902,10 +6871,10 @@ const TimeInputBase = forwardRef((props, ref) => {
                 return prev;
             if (next) {
                 valueAtOpenRef.current = value;
-                onOpen === null || onOpen === void 0 ? void 0 : onOpen();
+                onOpen?.();
             }
             else {
-                onClose === null || onClose === void 0 ? void 0 : onClose();
+                onClose?.();
             }
             return next;
         });
@@ -6916,10 +6885,10 @@ const TimeInputBase = forwardRef((props, ref) => {
     const commitValue = useCallback((next) => {
         if (!isControlled)
             setInternalValue(next);
-        onChange === null || onChange === void 0 ? void 0 : onChange(next);
+        onChange?.(next);
     }, [isControlled, onChange]);
     const handleSpinnerChange = useCallback((parts) => {
-        const base = value !== null && value !== void 0 ? value : new Date();
+        const base = value ?? new Date();
         const next = setTimeOfDay(base, parts);
         if (!isWithin(next, min, max))
             return;
@@ -6932,9 +6901,10 @@ const TimeInputBase = forwardRef((props, ref) => {
         const fmt = typeof format === 'string' ? format : undefined;
         return parse
             ? parse(trimmed)
-            : parseTime(trimmed, fmt !== null && fmt !== void 0 ? fmt : (typeof defaultFormat === 'string'
-                ? defaultFormat
-                : DEFAULT_TIME_FORMAT_24));
+            : parseTime(trimmed, fmt ??
+                (typeof defaultFormat === 'string'
+                    ? defaultFormat
+                    : DEFAULT_TIME_FORMAT_24));
     }, [parse, format, defaultFormat]);
     const makeBaseDate = useCallback(() => {
         const d = new Date();
@@ -6990,9 +6960,9 @@ const TimeInputBase = forwardRef((props, ref) => {
             }, 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 }));
     }
     const spinnerValue = {
-        hours: (_b = value === null || value === void 0 ? void 0 : value.getHours()) !== null && _b !== void 0 ? _b : 0,
-        minutes: (_c = value === null || value === void 0 ? void 0 : value.getMinutes()) !== null && _c !== void 0 ? _c : 0,
-        seconds: enableSeconds ? ((_d = value === null || value === void 0 ? void 0 : value.getSeconds()) !== null && _d !== void 0 ? _d : 0) : undefined,
+        hours: value?.getHours() ?? 0,
+        minutes: value?.getMinutes() ?? 0,
+        seconds: enableSeconds ? (value?.getSeconds() ?? 0) : undefined,
     };
     const panel = (jsxs("div", { className: panelClass, children: [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 && (jsxs(Buttons, { className: footerClass, hasAddons: true, children: [jsx("button", { type: "button", className: footerOkClass, onClick: () => setOpen(false), children: t.ok }), jsx("button", { type: "button", className: footerButton, onClick: () => {
                             commitValue(snapTimeToIncrement(new Date(), {
@@ -7020,13 +6990,12 @@ const TimeInputBase = forwardRef((props, ref) => {
 TimeInputBase.displayName = 'TimeInputBase';
 
 const TimeInput = forwardRef(({ label, labelSize, labelProps, horizontal, iconLeft, iconRight, iconLeftName = 'clock', iconRightName, iconLeftSize, iconRightSize, hasIconsLeft, hasIconsRight, isLoading, isExpanded, controlSize, message, messageColor, fieldClassName, controlClassName, ...baseProps }, ref) => {
-    var _a;
     const insideField = useInsideField();
     const insideControl = useInsideControl();
     const helpClass = usePrefixedClassNames('help', {
         [`is-${messageColor}`]: !!messageColor,
     });
-    let content = (jsx(TimeInputBase, { ref: ref, ...baseProps, triggerIcon: (_a = baseProps.triggerIcon) !== null && _a !== void 0 ? _a : !isLoading }));
+    let content = (jsx(TimeInputBase, { ref: ref, ...baseProps, triggerIcon: baseProps.triggerIcon ?? !isLoading }));
     if (!insideControl && !baseProps.inline) {
         content = (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 }));
     }
@@ -7056,27 +7025,27 @@ const fromIsoDateTime = (s) => {
     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);
 };
 const DateTimeInputBase = forwardRef((props, ref) => {
-    var _a, _b, _c, _d;
     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;
     const t = mergeLabels(labels);
     const hasVibrate = typeof navigator !== 'undefined' && typeof navigator.vibrate === 'function';
     const effectiveAudioTick = audioTick || (haptics && !hasVibrate);
     const isControlled = controlledValue !== undefined;
-    const [internalValue, setInternalValue] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);
-    const value = isControlled ? (controlledValue !== null && controlledValue !== void 0 ? controlledValue : null) : internalValue;
-    const initialFocused = useMemo(() => clampDate(value !== null && value !== void 0 ? value : new Date(), min, max), []);
+    const [internalValue, setInternalValue] = useState(defaultValue ?? null);
+    const value = isControlled ? (controlledValue ?? null) : internalValue;
+    const initialFocused = useMemo(() => clampDate(value ?? new Date(), min, max), []);
     const [focusedDate, setFocusedDate] = useState(initialFocused);
     useEffect(() => {
         setFocusedDate(prev => clampDate(prev, min, max));
     }, [min, max]);
-    const defaultFormat = format !== null && format !== void 0 ? format : (hourFormat === '12'
-        ? enableSeconds
-            ? 'YYYY-MM-DD hh:mm:ss A'
-            : 'YYYY-MM-DD hh:mm A'
-        : enableSeconds
-            ? 'YYYY-MM-DD HH:mm:ss'
-            : DEFAULT_DATETIME_FORMAT);
-    const effectiveHourFormat = (_a = hourCycleFromFormat(defaultFormat)) !== null && _a !== void 0 ? _a : hourFormat;
+    const defaultFormat = format ??
+        (hourFormat === '12'
+            ? enableSeconds
+                ? 'YYYY-MM-DD hh:mm:ss A'
+                : 'YYYY-MM-DD hh:mm A'
+            : enableSeconds
+                ? 'YYYY-MM-DD HH:mm:ss'
+                : DEFAULT_DATETIME_FORMAT);
+    const effectiveHourFormat = hourCycleFromFormat(defaultFormat) ?? hourFormat;
     const [open, setOpenState] = useState(false);
     const [timeOpen, setTimeOpen] = useState(false);
     const [text, setText] = useState(value ? formatDateTime(value, defaultFormat, locale) : '');
@@ -7121,10 +7090,10 @@ const DateTimeInputBase = forwardRef((props, ref) => {
                 return prev;
             if (next) {
                 valueAtOpenRef.current = value;
-                onOpen === null || onOpen === void 0 ? void 0 : onOpen();
+                onOpen?.();
             }
             else {
-                onClose === null || onClose === void 0 ? void 0 : onClose();
+                onClose?.();
             }
             return next;
         });
@@ -7141,14 +7110,13 @@ const DateTimeInputBase = forwardRef((props, ref) => {
             setInternalValue(next);
         if (next)
             setFocusedDate(next);
-        onChange === null || onChange === void 0 ? void 0 : onChange(next);
+        onChange?.(next);
     }, [isControlled, onChange]);
     const handleDateSelect = useCallback((d) => {
-        var _a, _b, _c;
         const merged = setTimeOfDay(d, {
-            hours: (_a = value === null || value === void 0 ? void 0 : value.getHours()) !== null && _a !== void 0 ? _a : 0,
-            minutes: (_b = value === null || value === void 0 ? void 0 : value.getMinutes()) !== null && _b !== void 0 ? _b : 0,
-            seconds: enableSeconds ? ((_c = value === null || value === void 0 ? void 0 : value.getSeconds()) !== null && _c !== void 0 ? _c : 0) : undefined,
+            hours: value?.getHours() ?? 0,
+            minutes: value?.getMinutes() ?? 0,
+            seconds: enableSeconds ? (value?.getSeconds() ?? 0) : undefined,
         });
         if (!isWithin(merged, min, max))
             return;
@@ -7156,7 +7124,7 @@ const DateTimeInputBase = forwardRef((props, ref) => {
         setFocusedDate(d);
     }, [value, enableSeconds, min, max, commitValue]);
     const handleTimeChange = useCallback((parts) => {
-        const base = value !== null && value !== void 0 ? value : focusedDate;
+        const base = value ?? focusedDate;
         const next = setTimeOfDay(base, parts);
         if (!isWithin(next, min, max))
             return;
@@ -7169,17 +7137,17 @@ const DateTimeInputBase = forwardRef((props, ref) => {
         if (parse)
             return parse(trimmed);
         const fmt = typeof defaultFormat === 'string' ? defaultFormat : undefined;
-        return parseDate(trimmed, fmt !== null && fmt !== void 0 ? fmt : DEFAULT_DATETIME_FORMAT);
+        return parseDate(trimmed, fmt ?? DEFAULT_DATETIME_FORMAT);
     }, [parse, defaultFormat, locale]);
     const makeBaseDate = useCallback(() => new Date(), []);
     const inputReadOnlyAttr = !!readOnly || !editable;
     const canOpen = !!popover && !disabled && !readOnly;
     const isBlocked = useMemo(() => {
-        if (!shouldDisableDate && !(unselectableDates === null || unselectableDates === void 0 ? void 0 : unselectableDates.length) && !unselectableTimes)
+        if (!shouldDisableDate && !unselectableDates?.length && !unselectableTimes)
             return undefined;
-        return (d) => !!(shouldDisableDate === null || shouldDisableDate === void 0 ? void 0 : shouldDisableDate(d)) ||
-            !!(unselectableDates === null || unselectableDates === void 0 ? void 0 : unselectableDates.some(u => isSameDay(u, d))) ||
-            !!(unselectableTimes === null || unselectableTimes === void 0 ? void 0 : unselectableTimes(d));
+        return (d) => !!shouldDisableDate?.(d) ||
+            !!unselectableDates?.some(u => isSameDay(u, d)) ||
+            !!unselectableTimes?.(d);
     }, [shouldDisableDate, unselectableDates, unselectableTimes]);
     const { inputHandlers } = useSegmentedEntry({
         format: defaultFormat,
@@ -7227,9 +7195,9 @@ const DateTimeInputBase = forwardRef((props, ref) => {
             }, 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 }));
     }
     const spinnerValue = {
-        hours: (_b = value === null || value === void 0 ? void 0 : value.getHours()) !== null && _b !== void 0 ? _b : 0,
-        minutes: (_c = value === null || value === void 0 ? void 0 : value.getMinutes()) !== null && _c !== void 0 ? _c : 0,
-        seconds: enableSeconds ? ((_d = value === null || value === void 0 ? void 0 : value.getSeconds()) !== null && _d !== void 0 ? _d : 0) : undefined,
+        hours: value?.getHours() ?? 0,
+        minutes: value?.getMinutes() ?? 0,
+        seconds: enableSeconds ? (value?.getSeconds() ?? 0) : undefined,
     };
     const panel = (jsxs("div", { className: panelClass, onKeyDown: e => {
             if (timeOpen && e.key === 'Escape') {
@@ -7251,13 +7219,12 @@ const DateTimeInputBase = forwardRef((props, ref) => {
 DateTimeInputBase.displayName = 'DateTimeInputBase';
 
 const DateTimeInput = forwardRef(({ label, labelSize, labelProps, horizontal, iconLeft, iconRight, iconLeftName = 'calendar-alt', iconRightName, iconLeftSize, iconRightSize, hasIconsLeft, hasIconsRight, isLoading, isExpanded, controlSize, message, messageColor, fieldClassName, controlClassName, ...baseProps }, ref) => {
-    var _a;
     const insideField = useInsideField();
     const insideControl = useInsideControl();
     const helpClass = usePrefixedClassNames('help', {
         [`is-${messageColor}`]: !!messageColor,
     });
-    let content = (jsx(DateTimeInputBase, { ref: ref, ...baseProps, triggerIcon: (_a = baseProps.triggerIcon) !== null && _a !== void 0 ? _a : !isLoading }));
+    let content = (jsx(DateTimeInputBase, { ref: ref, ...baseProps, triggerIcon: baseProps.triggerIcon ?? !isLoading }));
     if (!insideControl && !baseProps.inline) {
         content = (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 }));
     }
@@ -7940,7 +7907,7 @@ const Container = ({ className, textColor, bgColor, fluid, widescreen, fullhd, b
 
 const Footer = ({ as = 'footer', className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -7965,7 +7932,7 @@ const Hero = ({ className, color, size, bgColor, fullheightWithNavbar, children,
 };
 const HeroHead = ({ className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -7975,7 +7942,7 @@ const HeroHead = ({ className, children, color, bgColor, textColor, ...props })
 };
 const HeroBody = ({ className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -7985,7 +7952,7 @@ const HeroBody = ({ className, children, color, bgColor, textColor, ...props })
 };
 const HeroFoot = ({ className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -7999,7 +7966,7 @@ Hero.Foot = HeroFoot;
 
 const Level = ({ isMobile, className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -8011,7 +7978,7 @@ const Level = ({ isMobile, className, children, color, bgColor, textColor, ...pr
 };
 const LevelLeft = ({ className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -8021,7 +7988,7 @@ const LevelLeft = ({ className, children, color, bgColor, textColor, ...props })
 };
 const LevelRight = ({ className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -8031,7 +7998,7 @@ const LevelRight = ({ className, children, color, bgColor, textColor, ...props }
 };
 const LevelItem = ({ as = 'div', hasTextCentered, className, children, href, target, rel, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -8051,7 +8018,7 @@ Level.Item = LevelItem;
 
 const Media = ({ as = 'article', className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -8062,7 +8029,7 @@ const Media = ({ as = 'article', className, children, color, bgColor, textColor,
 };
 const MediaLeft = ({ as = 'figure', className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -8073,7 +8040,7 @@ const MediaLeft = ({ as = 'figure', className, children, color, bgColor, textCol
 };
 const MediaContent = ({ className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -8083,7 +8050,7 @@ const MediaContent = ({ className, children, color, bgColor, textColor, ...props
 };
 const MediaRight = ({ className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });
@@ -8098,7 +8065,7 @@ MediaWithSubcomponents.Right = MediaRight;
 
 const Section = ({ size, className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
-        color: textColor !== null && textColor !== void 0 ? textColor : color,
+        color: textColor ?? color,
         backgroundColor: bgColor,
         ...props,
     });