boreal-ui 0.0.34 → 0.0.36

package/dist/core/{Tabs-gpyaJFUs.js → Tabs-BaKDr0uF.js}

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { useState, useRef, useEffect, useMemo } from "react";
+import { useId, useState, useRef, useEffect, useMemo } from "react";
 import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
 import { c as capitalize } from "./capitalize-C0TSQSPh.js";
 import { c as getDefaultSize, d as getDefaultTheme, a as getDefaultRounding, b as getDefaultShadow } from "./boreal-style-config-BILmxkZG.js";
@@ -13,38 +13,25 @@ const TabsBase = ({
   theme = getDefaultTheme(),
   state = "",
   size = getDefaultSize(),
+  orientation = "horizontal",
+  activationMode = "auto",
   "data-testid": testId = "tabs",
   classMap
 }) => {
+  const uid = useId();
+  const baseId = `${testId}-${uid}`;
   const [activeIndex, setActiveIndex] = useState(defaultIndex);
+  const [focusIndex, setFocusIndex] = useState(defaultIndex);
   const tabRefs = useRef([]);
   useEffect(() => {
     var _a;
-    (_a = tabRefs.current[activeIndex]) == null ? void 0 : _a.focus();
-  }, [activeIndex]);
-  const handleTabClick = (index) => {
-    setActiveIndex(index);
-    onChange == null ? void 0 : onChange(index);
-  };
-  const handleKeyDown = (event) => {
-    const { key } = event;
-    const lastIndex = tabs.length - 1;
-    let newIndex = activeIndex;
-    if (key === "ArrowRight") {
-      newIndex = activeIndex === lastIndex ? 0 : activeIndex + 1;
-    } else if (key === "ArrowLeft") {
-      newIndex = activeIndex === 0 ? lastIndex : activeIndex - 1;
-    } else if (key === "Home") {
-      newIndex = 0;
-    } else if (key === "End") {
-      newIndex = lastIndex;
-    }
-    if (newIndex !== activeIndex) {
-      event.preventDefault();
-      setActiveIndex(newIndex);
-      onChange == null ? void 0 : onChange(newIndex);
-    }
-  };
+    const current = activationMode === "manual" ? focusIndex : activeIndex;
+    tabRefs.current.forEach((el, i) => {
+      if (!el) return;
+      el.setAttribute("tabindex", i === current ? "0" : "-1");
+    });
+    (_a = tabRefs.current[current]) == null ? void 0 : _a.focus();
+  }, [activeIndex, focusIndex, activationMode]);
   const containerClassNames = useMemo(
     () => combineClassNames(
       classMap.container,
@@ -61,8 +48,59 @@ const TabsBase = ({
       shadow && classMap[`shadow${capitalize(shadow)}`],
       rounding && classMap[`round${capitalize(rounding)}`]
     ),
-    [classMap]
+    [classMap, shadow, rounding]
   );
+  const activate = (index) => {
+    setActiveIndex(index);
+    onChange == null ? void 0 : onChange(index);
+  };
+  const isDisabled = (index) => {
+    var _a;
+    return !!((_a = tabs[index]) == null ? void 0 : _a.disabled);
+  };
+  const nextEnabled = (start, dir) => {
+    const len = tabs.length;
+    let i = start;
+    for (let n = 0; n < len; n++) {
+      i = (i + dir + len) % len;
+      if (!isDisabled(i)) return i;
+    }
+    return start;
+  };
+  const onKeyDown = (event) => {
+    const horiz = orientation === "horizontal";
+    const { key } = event;
+    let newFocus = focusIndex;
+    if (horiz && key === "ArrowRight") {
+      event.preventDefault();
+      newFocus = nextEnabled(focusIndex, 1);
+    } else if (horiz && key === "ArrowLeft") {
+      event.preventDefault();
+      newFocus = nextEnabled(focusIndex, -1);
+    } else if (!horiz && key === "ArrowDown") {
+      event.preventDefault();
+      newFocus = nextEnabled(focusIndex, 1);
+    } else if (!horiz && key === "ArrowUp") {
+      event.preventDefault();
+      newFocus = nextEnabled(focusIndex, -1);
+    } else if (key === "Home") {
+      event.preventDefault();
+      newFocus = nextEnabled(-1, 1);
+    } else if (key === "End") {
+      event.preventDefault();
+      newFocus = nextEnabled(0, -1);
+    } else if (activationMode === "manual" && (key === "Enter" || key === " ")) {
+      event.preventDefault();
+      if (!isDisabled(focusIndex)) activate(focusIndex);
+      return;
+    } else {
+      return;
+    }
+    setFocusIndex(newFocus);
+    if (activationMode === "auto") activate(newFocus);
+  };
+  const currentPanelId = `${baseId}-panel-${activeIndex}`;
+  const currentTabId = `${baseId}-tab-${activeIndex}`;
   return /* @__PURE__ */ jsxs("div", { className: containerClassNames, "data-testid": testId, children: [
     /* @__PURE__ */ jsx(
       "div",
@@ -70,11 +108,15 @@ const TabsBase = ({
         className: classMap.tabs,
         role: "tablist",
         "aria-label": "Tabs",
-        onKeyDown: handleKeyDown,
+        "aria-orientation": orientation,
+        onKeyDown,
         "data-testid": `${testId}-tablist`,
         children: tabs.map((tab, index) => {
           const Icon = tab.icon;
           const isActive = index === activeIndex;
+          const disabled = isDisabled(index);
+          const tabId = `${baseId}-tab-${index}`;
+          const panelId = `${baseId}-panel-${index}`;
           return /* @__PURE__ */ jsxs(
             "button",
             {
@@ -83,15 +125,20 @@ const TabsBase = ({
               },
               className: combineClassNames(
                 tabClassNames,
-                isActive ? classMap.active : ""
+                isActive && classMap.active,
+                disabled && classMap.disabled
               ),
-              onClick: () => handleTabClick(index),
               role: "tab",
               type: "button",
-              tabIndex: isActive ? 0 : -1,
               "aria-selected": isActive,
-              "aria-controls": `${testId}-panel-${index}`,
-              id: `${testId}-tab-${index}`,
+              "aria-controls": panelId,
+              id: tabId,
+              "aria-disabled": disabled || void 0,
+              onClick: () => {
+                if (disabled) return;
+                setFocusIndex(index);
+                activate(index);
+              },
               "data-testid": `${testId}-tab-${index}`,
               children: [
                 Icon && /* @__PURE__ */ jsx(
@@ -116,8 +163,8 @@ const TabsBase = ({
       {
         className: classMap.content,
         role: "tabpanel",
-        id: `${testId}-panel-${activeIndex}`,
-        "aria-labelledby": `${testId}-tab-${activeIndex}`,
+        id: currentPanelId,
+        "aria-labelledby": currentTabId,
         tabIndex: 0,
         "data-testid": `${testId}-panel`,
         children: tabs[activeIndex].content
@@ -125,6 +172,7 @@ const TabsBase = ({
     )
   ] });
 };
+TabsBase.displayName = "TabsBase";
 const classes = {
   tabsContainer: "tabs_container",
   tabs: "tabs",
@@ -161,4 +209,4 @@ const Tabs = (props) => {
 export {
   Tabs as T
 };
-//# sourceMappingURL=Tabs-gpyaJFUs.js.map
+//# sourceMappingURL=Tabs-BaKDr0uF.js.map

package/dist/core/Tabs-BaKDr0uF.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs-BaKDr0uF.js","sources":["../../src/components/Tabs/TabsBase.tsx","../../src/components/Tabs/core/Tabs.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState, useId } from \"react\";\r\nimport { BaseTabsProps } from \"./Tabs.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst TabsBase: React.FC<BaseTabsProps> = ({\r\n  tabs,\r\n  defaultIndex = 0,\r\n  onChange,\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  className = \"\",\r\n  theme = getDefaultTheme(),\r\n  state = \"\",\r\n  size = getDefaultSize(),\r\n  orientation = \"horizontal\",\r\n  activationMode = \"auto\",\r\n  \"data-testid\": testId = \"tabs\",\r\n  classMap,\r\n}) => {\r\n  const uid = useId();\r\n  const baseId = `${testId}-${uid}`;\r\n\r\n  const [activeIndex, setActiveIndex] = useState(defaultIndex);\r\n  const [focusIndex, setFocusIndex] = useState(defaultIndex);\r\n\r\n  const tabRefs = useRef<(HTMLButtonElement | null)[]>([]);\r\n\r\n  useEffect(() => {\r\n    const current = activationMode === \"manual\" ? focusIndex : activeIndex;\r\n    tabRefs.current.forEach((el, i) => {\r\n      if (!el) return;\r\n      el.setAttribute(\"tabindex\", i === current ? \"0\" : \"-1\");\r\n    });\r\n    tabRefs.current[current]?.focus();\r\n  }, [activeIndex, focusIndex, activationMode]);\r\n\r\n  const containerClassNames = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.container,\r\n        classMap[theme],\r\n        classMap[state],\r\n        classMap[size],\r\n        className\r\n      ),\r\n    [classMap, theme, state, size, className]\r\n  );\r\n\r\n  const tabClassNames = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.tab,\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`]\r\n      ),\r\n    [classMap, shadow, rounding]\r\n  );\r\n\r\n  const activate = (index: number) => {\r\n    setActiveIndex(index);\r\n    onChange?.(index);\r\n  };\r\n\r\n  const isDisabled = (index: number) => !!tabs[index]?.disabled;\r\n\r\n  const nextEnabled = (start: number, dir: 1 | -1) => {\r\n    const len = tabs.length;\r\n    let i = start;\r\n    for (let n = 0; n < len; n++) {\r\n      i = (i + dir + len) % len;\r\n      if (!isDisabled(i)) return i;\r\n    }\r\n    return start;\r\n  };\r\n\r\n  const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n    const horiz = orientation === \"horizontal\";\r\n    const { key } = event;\r\n\r\n    let newFocus = focusIndex;\r\n\r\n    if (horiz && key === \"ArrowRight\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(focusIndex, 1);\r\n    } else if (horiz && key === \"ArrowLeft\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(focusIndex, -1);\r\n    } else if (!horiz && key === \"ArrowDown\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(focusIndex, 1);\r\n    } else if (!horiz && key === \"ArrowUp\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(focusIndex, -1);\r\n    } else if (key === \"Home\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(-1, 1);\r\n    } else if (key === \"End\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(0, -1);\r\n    } else if (\r\n      activationMode === \"manual\" &&\r\n      (key === \"Enter\" || key === \" \")\r\n    ) {\r\n      event.preventDefault();\r\n      if (!isDisabled(focusIndex)) activate(focusIndex);\r\n      return;\r\n    } else {\r\n      return;\r\n    }\r\n\r\n    setFocusIndex(newFocus);\r\n    if (activationMode === \"auto\") activate(newFocus);\r\n  };\r\n\r\n  const currentPanelId = `${baseId}-panel-${activeIndex}`;\r\n  const currentTabId = `${baseId}-tab-${activeIndex}`;\r\n\r\n  return (\r\n    <div className={containerClassNames} data-testid={testId}>\r\n      <div\r\n        className={classMap.tabs}\r\n        role=\"tablist\"\r\n        aria-label=\"Tabs\"\r\n        aria-orientation={orientation}\r\n        onKeyDown={onKeyDown}\r\n        data-testid={`${testId}-tablist`}\r\n      >\r\n        {tabs.map((tab, index) => {\r\n          const Icon = tab.icon;\r\n          const isActive = index === activeIndex;\r\n          const disabled = isDisabled(index);\r\n          const tabId = `${baseId}-tab-${index}`;\r\n          const panelId = `${baseId}-panel-${index}`;\r\n\r\n          return (\r\n            <button\r\n              key={index}\r\n              ref={(el) => {\r\n                tabRefs.current[index] = el;\r\n              }}\r\n              className={combineClassNames(\r\n                tabClassNames,\r\n                isActive && classMap.active,\r\n                disabled && classMap.disabled\r\n              )}\r\n              role=\"tab\"\r\n              type=\"button\"\r\n              aria-selected={isActive}\r\n              aria-controls={panelId}\r\n              id={tabId}\r\n              aria-disabled={disabled || undefined}\r\n              onClick={() => {\r\n                if (disabled) return;\r\n                setFocusIndex(index);\r\n                activate(index);\r\n              }}\r\n              data-testid={`${testId}-tab-${index}`}\r\n            >\r\n              {Icon && (\r\n                <div\r\n                  className={classMap.icon}\r\n                  aria-hidden=\"true\"\r\n                  data-testid={`${testId}-icon-${index}`}\r\n                >\r\n                  <Icon />\r\n                </div>\r\n              )}\r\n              {tab.label}\r\n            </button>\r\n          );\r\n        })}\r\n      </div>\r\n\r\n      <div\r\n        className={classMap.content}\r\n        role=\"tabpanel\"\r\n        id={currentPanelId}\r\n        aria-labelledby={currentTabId}\r\n        tabIndex={0}\r\n        data-testid={`${testId}-panel`}\r\n      >\r\n        {tabs[activeIndex].content}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nTabsBase.displayName = \"TabsBase\";\r\nexport default TabsBase;\r\n","import React from \"react\";\r\nimport \"./Tabs.scss\";\r\nimport TabsBase from \"../TabsBase\";\r\nimport { TabsProps } from \"../Tabs.types\";\r\n\r\nconst classes = {\r\n  tabsContainer: \"tabs_container\",\r\n  tabs: \"tabs\",\r\n  tab: \"tabs_tab\",\r\n  active: \"tabs_active\",\r\n  content: \"tabs_content\",\r\n  icon: \"tabs_icon\",\r\n\r\n  primary: \"tabs_primary\",\r\n  secondary: \"tabs_secondary\",\r\n  tertiary: \"tabs_tertiary\",\r\n  quaternary: \"tabs_quaternary\",\r\n\r\n  success: \"tabs_success\",\r\n  error: \"tabs_error\",\r\n  warning: \"tabs_warning\",\r\n\r\n  clear: \"tabs_clear\",\r\n\r\n  xs: \"tabs_xs\",\r\n  xl: \"tabs_xl\",\r\n  small: \"tabs_small\",\r\n  medium: \"tabs_medium\",\r\n  large: \"tabs_large\",\r\n\r\n  shadowNone: \"tabs_shadow-None\",\r\n  shadowLight: \"tabs_shadow-Light\",\r\n  shadowMedium: \"tabs_shadow-Medium\",\r\n  shadowStrong: \"tabs_shadow-Strong\",\r\n  shadowIntense: \"tabs_shadow-Intense\",\r\n\r\n  roundNone: \"tabs_round-None\",\r\n  roundSmall: \"tabs_round-Small\",\r\n  roundMedium: \"tabs_round-Medium\",\r\n  roundLarge: \"tabs_round-Large\",\r\n};\r\n\r\nconst Tabs: React.FC<TabsProps> = (props) => {\r\n  return <TabsBase {...props} classMap={classes} />;\r\n};\r\n\r\nexport default Tabs;\r\n"],"names":[],"mappings":"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"}

package/dist/core/{Tabs-DptKFvPK.cjs → Tabs-C6lDM19i.cjs}

@@ -14,38 +14,25 @@ const TabsBase = ({
   theme = borealStyleConfig.getDefaultTheme(),
   state = "",
   size = borealStyleConfig.getDefaultSize(),
+  orientation = "horizontal",
+  activationMode = "auto",
   "data-testid": testId = "tabs",
   classMap
 }) => {
+  const uid = React.useId();
+  const baseId = `${testId}-${uid}`;
   const [activeIndex, setActiveIndex] = React.useState(defaultIndex);
+  const [focusIndex, setFocusIndex] = React.useState(defaultIndex);
   const tabRefs = React.useRef([]);
   React.useEffect(() => {
     var _a;
-    (_a = tabRefs.current[activeIndex]) == null ? void 0 : _a.focus();
-  }, [activeIndex]);
-  const handleTabClick = (index) => {
-    setActiveIndex(index);
-    onChange == null ? void 0 : onChange(index);
-  };
-  const handleKeyDown = (event) => {
-    const { key } = event;
-    const lastIndex = tabs.length - 1;
-    let newIndex = activeIndex;
-    if (key === "ArrowRight") {
-      newIndex = activeIndex === lastIndex ? 0 : activeIndex + 1;
-    } else if (key === "ArrowLeft") {
-      newIndex = activeIndex === 0 ? lastIndex : activeIndex - 1;
-    } else if (key === "Home") {
-      newIndex = 0;
-    } else if (key === "End") {
-      newIndex = lastIndex;
-    }
-    if (newIndex !== activeIndex) {
-      event.preventDefault();
-      setActiveIndex(newIndex);
-      onChange == null ? void 0 : onChange(newIndex);
-    }
-  };
+    const current = activationMode === "manual" ? focusIndex : activeIndex;
+    tabRefs.current.forEach((el, i) => {
+      if (!el) return;
+      el.setAttribute("tabindex", i === current ? "0" : "-1");
+    });
+    (_a = tabRefs.current[current]) == null ? void 0 : _a.focus();
+  }, [activeIndex, focusIndex, activationMode]);
   const containerClassNames = React.useMemo(
     () => classNames.combineClassNames(
       classMap.container,
@@ -62,8 +49,59 @@ const TabsBase = ({
       shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
       rounding && classMap[`round${capitalize.capitalize(rounding)}`]
     ),
-    [classMap]
+    [classMap, shadow, rounding]
   );
+  const activate = (index) => {
+    setActiveIndex(index);
+    onChange == null ? void 0 : onChange(index);
+  };
+  const isDisabled = (index) => {
+    var _a;
+    return !!((_a = tabs[index]) == null ? void 0 : _a.disabled);
+  };
+  const nextEnabled = (start, dir) => {
+    const len = tabs.length;
+    let i = start;
+    for (let n = 0; n < len; n++) {
+      i = (i + dir + len) % len;
+      if (!isDisabled(i)) return i;
+    }
+    return start;
+  };
+  const onKeyDown = (event) => {
+    const horiz = orientation === "horizontal";
+    const { key } = event;
+    let newFocus = focusIndex;
+    if (horiz && key === "ArrowRight") {
+      event.preventDefault();
+      newFocus = nextEnabled(focusIndex, 1);
+    } else if (horiz && key === "ArrowLeft") {
+      event.preventDefault();
+      newFocus = nextEnabled(focusIndex, -1);
+    } else if (!horiz && key === "ArrowDown") {
+      event.preventDefault();
+      newFocus = nextEnabled(focusIndex, 1);
+    } else if (!horiz && key === "ArrowUp") {
+      event.preventDefault();
+      newFocus = nextEnabled(focusIndex, -1);
+    } else if (key === "Home") {
+      event.preventDefault();
+      newFocus = nextEnabled(-1, 1);
+    } else if (key === "End") {
+      event.preventDefault();
+      newFocus = nextEnabled(0, -1);
+    } else if (activationMode === "manual" && (key === "Enter" || key === " ")) {
+      event.preventDefault();
+      if (!isDisabled(focusIndex)) activate(focusIndex);
+      return;
+    } else {
+      return;
+    }
+    setFocusIndex(newFocus);
+    if (activationMode === "auto") activate(newFocus);
+  };
+  const currentPanelId = `${baseId}-panel-${activeIndex}`;
+  const currentTabId = `${baseId}-tab-${activeIndex}`;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: containerClassNames, "data-testid": testId, children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       "div",
@@ -71,11 +109,15 @@ const TabsBase = ({
         className: classMap.tabs,
         role: "tablist",
         "aria-label": "Tabs",
-        onKeyDown: handleKeyDown,
+        "aria-orientation": orientation,
+        onKeyDown,
         "data-testid": `${testId}-tablist`,
         children: tabs.map((tab, index) => {
           const Icon = tab.icon;
           const isActive = index === activeIndex;
+          const disabled = isDisabled(index);
+          const tabId = `${baseId}-tab-${index}`;
+          const panelId = `${baseId}-panel-${index}`;
           return /* @__PURE__ */ jsxRuntime.jsxs(
             "button",
             {
@@ -84,15 +126,20 @@ const TabsBase = ({
               },
               className: classNames.combineClassNames(
                 tabClassNames,
-                isActive ? classMap.active : ""
+                isActive && classMap.active,
+                disabled && classMap.disabled
               ),
-              onClick: () => handleTabClick(index),
               role: "tab",
               type: "button",
-              tabIndex: isActive ? 0 : -1,
               "aria-selected": isActive,
-              "aria-controls": `${testId}-panel-${index}`,
-              id: `${testId}-tab-${index}`,
+              "aria-controls": panelId,
+              id: tabId,
+              "aria-disabled": disabled || void 0,
+              onClick: () => {
+                if (disabled) return;
+                setFocusIndex(index);
+                activate(index);
+              },
               "data-testid": `${testId}-tab-${index}`,
               children: [
                 Icon && /* @__PURE__ */ jsxRuntime.jsx(
@@ -117,8 +164,8 @@ const TabsBase = ({
       {
         className: classMap.content,
         role: "tabpanel",
-        id: `${testId}-panel-${activeIndex}`,
-        "aria-labelledby": `${testId}-tab-${activeIndex}`,
+        id: currentPanelId,
+        "aria-labelledby": currentTabId,
         tabIndex: 0,
         "data-testid": `${testId}-panel`,
         children: tabs[activeIndex].content
@@ -126,6 +173,7 @@ const TabsBase = ({
     )
   ] });
 };
+TabsBase.displayName = "TabsBase";
 const classes = {
   tabsContainer: "tabs_container",
   tabs: "tabs",
@@ -160,4 +208,4 @@ const Tabs = (props) => {
   return /* @__PURE__ */ jsxRuntime.jsx(TabsBase, { ...props, classMap: classes });
 };
 exports.Tabs = Tabs;
-//# sourceMappingURL=Tabs-DptKFvPK.cjs.map
+//# sourceMappingURL=Tabs-C6lDM19i.cjs.map

package/dist/core/Tabs-C6lDM19i.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs-C6lDM19i.cjs","sources":["../../src/components/Tabs/TabsBase.tsx","../../src/components/Tabs/core/Tabs.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState, useId } from \"react\";\r\nimport { BaseTabsProps } from \"./Tabs.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst TabsBase: React.FC<BaseTabsProps> = ({\r\n  tabs,\r\n  defaultIndex = 0,\r\n  onChange,\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  className = \"\",\r\n  theme = getDefaultTheme(),\r\n  state = \"\",\r\n  size = getDefaultSize(),\r\n  orientation = \"horizontal\",\r\n  activationMode = \"auto\",\r\n  \"data-testid\": testId = \"tabs\",\r\n  classMap,\r\n}) => {\r\n  const uid = useId();\r\n  const baseId = `${testId}-${uid}`;\r\n\r\n  const [activeIndex, setActiveIndex] = useState(defaultIndex);\r\n  const [focusIndex, setFocusIndex] = useState(defaultIndex);\r\n\r\n  const tabRefs = useRef<(HTMLButtonElement | null)[]>([]);\r\n\r\n  useEffect(() => {\r\n    const current = activationMode === \"manual\" ? focusIndex : activeIndex;\r\n    tabRefs.current.forEach((el, i) => {\r\n      if (!el) return;\r\n      el.setAttribute(\"tabindex\", i === current ? \"0\" : \"-1\");\r\n    });\r\n    tabRefs.current[current]?.focus();\r\n  }, [activeIndex, focusIndex, activationMode]);\r\n\r\n  const containerClassNames = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.container,\r\n        classMap[theme],\r\n        classMap[state],\r\n        classMap[size],\r\n        className\r\n      ),\r\n    [classMap, theme, state, size, className]\r\n  );\r\n\r\n  const tabClassNames = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.tab,\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`]\r\n      ),\r\n    [classMap, shadow, rounding]\r\n  );\r\n\r\n  const activate = (index: number) => {\r\n    setActiveIndex(index);\r\n    onChange?.(index);\r\n  };\r\n\r\n  const isDisabled = (index: number) => !!tabs[index]?.disabled;\r\n\r\n  const nextEnabled = (start: number, dir: 1 | -1) => {\r\n    const len = tabs.length;\r\n    let i = start;\r\n    for (let n = 0; n < len; n++) {\r\n      i = (i + dir + len) % len;\r\n      if (!isDisabled(i)) return i;\r\n    }\r\n    return start;\r\n  };\r\n\r\n  const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n    const horiz = orientation === \"horizontal\";\r\n    const { key } = event;\r\n\r\n    let newFocus = focusIndex;\r\n\r\n    if (horiz && key === \"ArrowRight\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(focusIndex, 1);\r\n    } else if (horiz && key === \"ArrowLeft\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(focusIndex, -1);\r\n    } else if (!horiz && key === \"ArrowDown\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(focusIndex, 1);\r\n    } else if (!horiz && key === \"ArrowUp\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(focusIndex, -1);\r\n    } else if (key === \"Home\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(-1, 1);\r\n    } else if (key === \"End\") {\r\n      event.preventDefault();\r\n      newFocus = nextEnabled(0, -1);\r\n    } else if (\r\n      activationMode === \"manual\" &&\r\n      (key === \"Enter\" || key === \" \")\r\n    ) {\r\n      event.preventDefault();\r\n      if (!isDisabled(focusIndex)) activate(focusIndex);\r\n      return;\r\n    } else {\r\n      return;\r\n    }\r\n\r\n    setFocusIndex(newFocus);\r\n    if (activationMode === \"auto\") activate(newFocus);\r\n  };\r\n\r\n  const currentPanelId = `${baseId}-panel-${activeIndex}`;\r\n  const currentTabId = `${baseId}-tab-${activeIndex}`;\r\n\r\n  return (\r\n    <div className={containerClassNames} data-testid={testId}>\r\n      <div\r\n        className={classMap.tabs}\r\n        role=\"tablist\"\r\n        aria-label=\"Tabs\"\r\n        aria-orientation={orientation}\r\n        onKeyDown={onKeyDown}\r\n        data-testid={`${testId}-tablist`}\r\n      >\r\n        {tabs.map((tab, index) => {\r\n          const Icon = tab.icon;\r\n          const isActive = index === activeIndex;\r\n          const disabled = isDisabled(index);\r\n          const tabId = `${baseId}-tab-${index}`;\r\n          const panelId = `${baseId}-panel-${index}`;\r\n\r\n          return (\r\n            <button\r\n              key={index}\r\n              ref={(el) => {\r\n                tabRefs.current[index] = el;\r\n              }}\r\n              className={combineClassNames(\r\n                tabClassNames,\r\n                isActive && classMap.active,\r\n                disabled && classMap.disabled\r\n              )}\r\n              role=\"tab\"\r\n              type=\"button\"\r\n              aria-selected={isActive}\r\n              aria-controls={panelId}\r\n              id={tabId}\r\n              aria-disabled={disabled || undefined}\r\n              onClick={() => {\r\n                if (disabled) return;\r\n                setFocusIndex(index);\r\n                activate(index);\r\n              }}\r\n              data-testid={`${testId}-tab-${index}`}\r\n            >\r\n              {Icon && (\r\n                <div\r\n                  className={classMap.icon}\r\n                  aria-hidden=\"true\"\r\n                  data-testid={`${testId}-icon-${index}`}\r\n                >\r\n                  <Icon />\r\n                </div>\r\n              )}\r\n              {tab.label}\r\n            </button>\r\n          );\r\n        })}\r\n      </div>\r\n\r\n      <div\r\n        className={classMap.content}\r\n        role=\"tabpanel\"\r\n        id={currentPanelId}\r\n        aria-labelledby={currentTabId}\r\n        tabIndex={0}\r\n        data-testid={`${testId}-panel`}\r\n      >\r\n        {tabs[activeIndex].content}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nTabsBase.displayName = \"TabsBase\";\r\nexport default TabsBase;\r\n","import React from \"react\";\r\nimport \"./Tabs.scss\";\r\nimport TabsBase from \"../TabsBase\";\r\nimport { TabsProps } from \"../Tabs.types\";\r\n\r\nconst classes = {\r\n  tabsContainer: \"tabs_container\",\r\n  tabs: \"tabs\",\r\n  tab: \"tabs_tab\",\r\n  active: \"tabs_active\",\r\n  content: \"tabs_content\",\r\n  icon: \"tabs_icon\",\r\n\r\n  primary: \"tabs_primary\",\r\n  secondary: \"tabs_secondary\",\r\n  tertiary: \"tabs_tertiary\",\r\n  quaternary: \"tabs_quaternary\",\r\n\r\n  success: \"tabs_success\",\r\n  error: \"tabs_error\",\r\n  warning: \"tabs_warning\",\r\n\r\n  clear: \"tabs_clear\",\r\n\r\n  xs: \"tabs_xs\",\r\n  xl: \"tabs_xl\",\r\n  small: \"tabs_small\",\r\n  medium: \"tabs_medium\",\r\n  large: \"tabs_large\",\r\n\r\n  shadowNone: \"tabs_shadow-None\",\r\n  shadowLight: \"tabs_shadow-Light\",\r\n  shadowMedium: \"tabs_shadow-Medium\",\r\n  shadowStrong: \"tabs_shadow-Strong\",\r\n  shadowIntense: \"tabs_shadow-Intense\",\r\n\r\n  roundNone: \"tabs_round-None\",\r\n  roundSmall: \"tabs_round-Small\",\r\n  roundMedium: \"tabs_round-Medium\",\r\n  roundLarge: \"tabs_round-Large\",\r\n};\r\n\r\nconst Tabs: React.FC<TabsProps> = (props) => {\r\n  return <TabsBase {...props} classMap={classes} />;\r\n};\r\n\r\nexport default Tabs;\r\n"],"names":["getDefaultRounding","getDefaultShadow","getDefaultTheme","getDefaultSize","useId","useState","useRef","useEffect","useMemo","combineClassNames","capitalize","jsxs","jsx"],"mappings":"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"}

package/dist/core/Tabs.cjs.js

@@ -1,4 +1,4 @@
 "use strict";
-const Tabs = require("./Tabs-DptKFvPK.cjs");
+const Tabs = require("./Tabs-C6lDM19i.cjs");
 module.exports = Tabs.Tabs;
 //# sourceMappingURL=Tabs.cjs.js.map

package/dist/core/Tabs.js

@@ -1,4 +1,4 @@
-import { T } from "./Tabs-gpyaJFUs.js";
+import { T } from "./Tabs-BaKDr0uF.js";
 export {
   T as default
 };

package/dist/core/TagInput.cjs.js

@@ -1,4 +1,4 @@
 "use strict";
-const Taginput = require("./Taginput-BNZg4SGI.cjs");
+const Taginput = require("./Taginput-kqeTeVJY.cjs");
 module.exports = Taginput.TagInput;
 //# sourceMappingURL=TagInput.cjs.js.map

package/dist/core/TagInput.js

@@ -1,4 +1,4 @@
-import { T } from "./Taginput-D0wKEzGh.js";
+import { T } from "./Taginput-C_JJRoDF.js";
 export {
   T as default
 };