@ballistix.digital/react-components 9.8.0 → 9.8.1

package/dist/index.js

@@ -4487,6 +4487,7 @@ const $06795e94e474e27d$var$List = (props)=>{
     const handleChangeSelect = (0, $iA2ta$react.useCallback)((e)=>{
         const key = e?.currentTarget?.value;
         const tab = (0, $iA2ta$react.Children).map(children, (child)=>child)?.find((child)=>child.props.accessor === key);
+        if (tab?.props.isDisabled) return;
         if (tab?.props.href) window.location.href = tab.props.href;
         else if (tab?.props.onClick) setActive && setActive(tab?.props.accessor);
     }, [
@@ -4534,6 +4535,7 @@ const $06795e94e474e27d$var$List = (props)=>{
                             if (child.props.isHidden) return null;
                             return (0, $iA2ta$reactjsxruntime.jsx)("option", {
                                 value: child.props.accessor,
+                                disabled: child.props.isDisabled,
                                 children: child.props.label
                             }, child?.props?.accessor);
                         })
@@ -4551,7 +4553,7 @@ const $06795e94e474e27d$var$List = (props)=>{
     });
 };
 const $06795e94e474e27d$var$Item = (props)=>{
-    const { label: label, icon: icon, as: LinkComponent = 'a', type: type = 'underline', href: href, isCurrent: isCurrent, onClick: onClick, styles: stylesOverrides, isLoading: isLoading, isHidden: isHidden } = props;
+    const { label: label, icon: icon, as: LinkComponent = 'a', type: type = 'underline', href: href, isCurrent: isCurrent, onClick: onClick, styles: stylesOverrides, isLoading: isLoading, isHidden: isHidden, isDisabled: isDisabled } = props;
     if (isHidden) return null;
     const handleGenerateStyle = ()=>{
         const result = (0, $f0c671820c340322$export$e2d2075c69d9100d)((0, $9420756208be2d43$export$2e2bcd8739ae039).base);
@@ -4562,18 +4564,31 @@ const $06795e94e474e27d$var$Item = (props)=>{
         return result;
     };
     const styles = handleGenerateStyle();
+    const handleClickLink = (e)=>{
+        if (isDisabled || isLoading || !onClick) {
+            e.preventDefault();
+            return;
+        }
+        onClick(e);
+    };
+    const handleClick = (e)=>{
+        if (isDisabled || isLoading || !onClick) return;
+        onClick(e);
+    };
     if (href && LinkComponent) return (0, $iA2ta$reactjsxruntime.jsxs)(LinkComponent, {
-        href: href,
-        className: (0, $622cd2936b18c771$export$4370d69198e9314a)(styles.tab.base, isCurrent ? styles.tab.active : styles.tab.inactive, isLoading && 'opacity-30 text-gray-300! cursor-default!', isLoading && styles.tab.inactive),
-        onClick: onClick,
+        href: !isDisabled ? href : undefined,
+        "aria-disabled": isDisabled,
+        className: (0, $622cd2936b18c771$export$4370d69198e9314a)(styles.tab.base, isCurrent ? styles.tab.active : styles.tab.inactive, isLoading && 'opacity-30 text-gray-300! cursor-default!', isLoading && styles.tab.inactive, isDisabled && 'opacity-30 text-gray-300! cursor-not-allowed! pointer-events-none', isDisabled && styles.tab.inactive),
+        onClick: handleClickLink,
         children: [
             icon,
             label
         ]
     });
     return (0, $iA2ta$reactjsxruntime.jsxs)("div", {
-        className: (0, $622cd2936b18c771$export$4370d69198e9314a)(styles.tab.base, isCurrent ? styles.tab.active : styles.tab.inactive, isLoading && 'opacity-30 text-gray-300! cursor-default!', isLoading && styles.tab.inactive),
-        onClick: !isLoading ? onClick : ()=>null,
+        className: (0, $622cd2936b18c771$export$4370d69198e9314a)(styles.tab.base, isCurrent ? styles.tab.active : styles.tab.inactive, isLoading && 'opacity-30 text-gray-300! cursor-default!', isLoading && styles.tab.inactive, isDisabled && 'opacity-30 text-gray-300! cursor-not-allowed!', isDisabled && styles.tab.inactive),
+        "aria-disabled": isDisabled,
+        onClick: handleClick,
         children: [
             icon,
             label