@eightshift/ui-components 0.0.1 → 0.0.2

package/dist/components/spacer/spacer.js

@@ -1,5 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { classnames } from "../../utilities/classnames.js";
+import { c as clsx } from "../../lite-pbIeT7tm.js";
+import { RichLabel } from "../rich-label/rich-label.js";
 /**
  * A simple spacer/divider component, with optional text or icon.
  *
@@ -9,8 +10,10 @@ import { classnames } from "../../utilities/classnames.js";
  * @param {boolean} [props.border=false] - Whether to show a border in the middle.
  * @param {string} [props.className] - Additional classes to add.
  * @param {string} [props.text] - Text to display.
+ * @param {string} [props.subtitle] - Subtitle to display.
  * @param {JSX.Element} [props.icon] - Icon to display.
  * @param {boolean} [props.vertical=false] - Whether the spacer is vertical.
+ * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
  *
  * @returns {JSX.Element} The Spacer component.
  *
@@ -29,7 +32,10 @@ import { classnames } from "../../utilities/classnames.js";
  * @preserve
  */
 const Spacer = (props) => {
-  const { size = "m", border, className, text, icon, vertical = false } = props;
+  const { size = "px", border, className, text, subtitle, icon, vertical = false, hidden } = props;
+  if (hidden) {
+    return null;
+  }
   const sizes = {
     px: {
       sizeHorizontal: "es-uic-h-px",
@@ -56,7 +62,7 @@ const Spacer = (props) => {
       sizeVerticalBorder: "es-uic-w-2"
     }
   };
-  const spaceClass = classnames(
+  const spaceClass = clsx(
     vertical ? "es-uic-h-full" : "es-uic-w-full",
     !vertical && !border && sizes[size].sizeHorizontal,
     !vertical && border && sizes[size].sizeHorizontalBorder,
@@ -65,10 +71,17 @@ const Spacer = (props) => {
     className
   );
   if (text || icon) {
-    return /* @__PURE__ */ jsxs("div", { className: classnames("es-uic-flex es-uic-items-center es-uic-gap-1.5", className), children: [
-      icon && /* @__PURE__ */ jsx("span", { className: "es-uic-shrink-0 es-uic-rounded es-uic-bg-gray-500 es-uic-p-0.5 es-uic-text-gray-50 es-uic-shadow-sm [&>svg]:es-uic-size-5.5", children: icon }),
-      text && /* @__PURE__ */ jsx("span", { className: "es-uic-shrink-0 es-uic-text-balance es-uic-text-sm es-uic-text-gray-500", children: text }),
-      border && /* @__PURE__ */ jsx("div", { className: "es-uic-h-px es-uic-w-full es-uic-bg-gray-300" })
+    return /* @__PURE__ */ jsxs("div", { className: clsx("es-uic-flex es-uic-items-center es-uic-gap-1.5", className), children: [
+      /* @__PURE__ */ jsx(
+        RichLabel,
+        {
+          icon,
+          label: text,
+          subtitle,
+          className: "es-uic-shrink-0 es-uic-text-slate-500"
+        }
+      ),
+      border && /* @__PURE__ */ jsx("div", { className: "es-uic-h-px es-uic-w-full es-uic-bg-slate-300 es-uic-leading-3" })
     ] });
   }
   if (border) {
@@ -77,10 +90,7 @@ const Spacer = (props) => {
       /* @__PURE__ */ jsx(
         "div",
         {
-          className: classnames(
-            "es-uic-bg-gray-300",
-            vertical ? "es-uic-h-full es-uic-w-px" : "es-uic-h-px es-uic-w-full"
-          )
+          className: clsx("es-uic-bg-gray-300", vertical ? "es-uic-h-full es-uic-w-px" : "es-uic-h-px es-uic-w-full")
         }
       ),
       size !== "px" && /* @__PURE__ */ jsx("div", { className: spaceClass })

package/dist/components/tabs/tabs.js

@@ -1,17 +1,17 @@
 import { jsx } from "react/jsx-runtime";
-import { f as $880e95eb8b93ba9a$export$ecf600387e221c37, c as $ae20dd8cbca75726$export$d6daf82dcd84e87c, g as $7135fc7d473fd974$export$7cd71aa5ddd6dc4e, h as $7135fc7d473fd974$export$8c25dea96356a8b6, i as $7135fc7d473fd974$export$813b5978dd974d8, j as $7135fc7d473fd974$export$e7c29ae2353b16ea } from "../../SelectionManager-mefd0ThJ.js";
-import { d as $3ef42575df84b30b$export$9d1611c77c2fe928, e as $bdb11010cef70236$export$f680877a34711e37, b as $64fa3d84918910a7$export$86427a43e3e48ebb, a as $64fa3d84918910a7$export$29f1550f4b0d4415, p as $64fa3d84918910a7$export$8dc98ba7eadeaa56, c as $64fa3d84918910a7$export$4d86445c2cf5e3, j as $64fa3d84918910a7$export$2881499e37b75b9a, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, l as $df56164dff5785e2$export$4338b53315abf666 } from "../../utils-BsiH7-5Y.js";
+import { f as $880e95eb8b93ba9a$export$ecf600387e221c37, c as $ae20dd8cbca75726$export$d6daf82dcd84e87c, g as $7135fc7d473fd974$export$7cd71aa5ddd6dc4e, h as $7135fc7d473fd974$export$8c25dea96356a8b6, i as $7135fc7d473fd974$export$813b5978dd974d8, j as $7135fc7d473fd974$export$e7c29ae2353b16ea } from "../../SelectionManager-sedvcM-1.js";
+import { d as $3ef42575df84b30b$export$9d1611c77c2fe928, e as $bdb11010cef70236$export$f680877a34711e37, b as $64fa3d84918910a7$export$86427a43e3e48ebb, a as $64fa3d84918910a7$export$29f1550f4b0d4415, p as $64fa3d84918910a7$export$8dc98ba7eadeaa56, c as $64fa3d84918910a7$export$4d86445c2cf5e3, j as $64fa3d84918910a7$export$2881499e37b75b9a, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, l as $df56164dff5785e2$export$4338b53315abf666 } from "../../utils-DIBzm1e4.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-DG2RfOUr.js";
 import React__default, { useMemo, useRef, useEffect, forwardRef, useContext, createContext, useId, cloneElement } from "react";
-import { $ as $e72dd72e1c76a225$export$2f645645f7bca764 } from "../../useListState-Domq0blV.js";
-import { e as $458b0a5536c1a7cf$export$40bfa8c7b0832715, $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../focusSafely-C3K8zAKj.js";
-import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-Cc-4eouh.js";
-import { $ as $313b98861ee5dd6c$export$d6875122194c7b44 } from "../../useLabels-Dg62M_3P.js";
-import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-jMy6xdVq.js";
-import { a as $ea8dcbcb9ea1b556$export$7e924b3091a3bd18 } from "../../usePress-BQgVor4T.js";
-import { $ as $83013635b024ae3d$export$eac1895992b9f3d6 } from "../../useHasTabbableChild-D3uUNhJ0.js";
-import { _ as __, s as sprintf } from "../../default-i18n-BhE-OUmt.js";
-import { classnames } from "../../utilities/classnames.js";
+import { $ as $e72dd72e1c76a225$export$2f645645f7bca764 } from "../../useListState-BRsq7O1C.js";
+import { e as $458b0a5536c1a7cf$export$40bfa8c7b0832715, $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../focusSafely-B0hyd-S4.js";
+import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-CRx_hYC4.js";
+import { $ as $313b98861ee5dd6c$export$d6875122194c7b44 } from "../../useLabels-C7E5SkOi.js";
+import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-BAcFg5GO.js";
+import { a as $ea8dcbcb9ea1b556$export$7e924b3091a3bd18 } from "../../usePress-B42RawCH.js";
+import { $ as $83013635b024ae3d$export$eac1895992b9f3d6 } from "../../useHasTabbableChild-domoFB7A.js";
+import { _ as __, s as sprintf } from "../../default-i18n-Bk1GxDHz.js";
+import { c as clsx } from "../../lite-pbIeT7tm.js";
 import { Notice } from "../notice/notice.js";
 const $99b62ae3ff97ec45$export$c5f62239608282b6 = /* @__PURE__ */ new WeakMap();
 function $99b62ae3ff97ec45$export$567fc7097e064344(state, key, role) {
@@ -423,6 +423,7 @@ const $5e8ad37a45e1c704$export$3d96ec278d3efce4 = /* @__PURE__ */ $64fa3d8491891
  * @param {Object} props - Component props.
  * @param {boolean} [props.vertical=false] - Whether the tabs are vertical.
  * @param {string} [props.className] - Classes to pass to the tabs container.
+ * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
  *
  * @returns {JSX.Element} The Tabs component.
  *
@@ -439,8 +440,11 @@ const $5e8ad37a45e1c704$export$3d96ec278d3efce4 = /* @__PURE__ */ $64fa3d8491891
  * @preserve
  */
 const Tabs = (props) => {
-  const { children, vertical, className, ...rest } = props;
+  const { children, vertical, className, hidden, ...rest } = props;
   const baseId = useId();
+  if (hidden) {
+    return null;
+  }
   let tabPanelCounter = 1;
   let tabCounter = 1;
   const preparedChildren = Array.isArray(children) ? children : [children];
@@ -475,7 +479,7 @@ const Tabs = (props) => {
         cloneElement(child, {
           id: `tab-${baseId}-${tabPanelCounter++}`,
           key: index,
-          className: classnames(child.props.className, vertical && "es-uic-border-l es-uic-border-l-300 es-uic-pl-3")
+          className: clsx(child.props.className, vertical && "es-uic-border-l es-uic-border-l-300 es-uic-pl-3")
         })
       ];
     }
@@ -507,7 +511,7 @@ const Tabs = (props) => {
     {
       ...rest,
       orientation: vertical ? "vertical" : "horizontal",
-      className: classnames(
+      className: clsx(
         vertical ? "es-uic-grid es-uic-size-full es-uic-min-h-40 es-uic-grid-cols-[minmax(0,_15rem),_2fr] es-uic-gap-4" : "es-uic-flex-col",
         className
       ),
@@ -535,7 +539,7 @@ const TabList = (props) => {
     $5e8ad37a45e1c704$export$e51a686c67fdaa2d,
     {
       "aria-label": ariaLabel ?? __("tabs", "eightshift-ui-components"),
-      className: ({ orientation }) => classnames(
+      className: ({ orientation }) => clsx(
         "es-uic-flex es-uic-gap-1",
         orientation === "vertical" && "es-uic-h-full es-uic-flex-col es-uic-pr-1.5",
         orientation === "horizontal" && "es-uic-w-full es-uic-items-end es-uic-border-b es-uic-border-b-gray-300",
@@ -569,7 +573,7 @@ const Tab = (props) => {
       ...other,
       isDisabled: disabled,
       className: ({ isSelected, isDisabled }) => {
-        return classnames(
+        return clsx(
           "es-uic-relative es-uic-flex es-uic-select-none es-uic-items-center es-uic-rounded es-uic-p-1.5 es-uic-text-sm es-uic-transition",
           "focus:es-uic-outline-none focus-visible:es-uic-outline-none focus-visible:es-uic-ring focus-visible:es-uic-ring-teal-500 focus-visible:es-uic-ring-opacity-50",
           'after:es-uic-absolute after:es-uic-rounded-full after:es-uic-bg-teal-600 after:es-uic-shadow-sm after:es-uic-shadow-teal-500/25 after:es-uic-transition after:es-uic-duration-300 after:es-uic-content-[""]',
@@ -609,10 +613,7 @@ const TabPanel = (props) => {
     $5e8ad37a45e1c704$export$3d96ec278d3efce4,
     {
       ...other,
-      className: classnames(
-        "es-uic-mt-1.5 es-uic-space-y-2.5 es-uic-text-sm focus:es-uic-outline-none",
-        className
-      ),
+      className: clsx("es-uic-mt-1.5 es-uic-space-y-2.5 es-uic-text-sm focus:es-uic-outline-none", className),
       children
     }
   );

package/dist/components/toggle/switch.js

@@ -1,13 +1,13 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { a as $64fa3d84918910a7$export$29f1550f4b0d4415, l as $df56164dff5785e2$export$4338b53315abf666, m as $5dc95899b306f630$export$c9058316764c140e, i as $64fa3d84918910a7$export$ef03459518577ad4, c as $64fa3d84918910a7$export$4d86445c2cf5e3, d as $3ef42575df84b30b$export$9d1611c77c2fe928 } from "../../utils-BsiH7-5Y.js";
+import { a as $64fa3d84918910a7$export$29f1550f4b0d4415, l as $df56164dff5785e2$export$4338b53315abf666, m as $5dc95899b306f630$export$c9058316764c140e, i as $64fa3d84918910a7$export$ef03459518577ad4, c as $64fa3d84918910a7$export$4d86445c2cf5e3, d as $3ef42575df84b30b$export$9d1611c77c2fe928 } from "../../utils-DIBzm1e4.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-DG2RfOUr.js";
 import React__default, { forwardRef, createContext } from "react";
-import { $ as $3017fa7ffdddec74$export$8042c6c013fd5226 } from "../../useToggleState-DJ_z5E2S.js";
-import { $ as $d2c8e2b0480f3f34$export$cbe85ee05b554577 } from "../../useToggle-C9ETOBaZ.js";
-import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-Cc-4eouh.js";
-import { $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../focusSafely-C3K8zAKj.js";
-import { $ as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../../VisuallyHidden-BYRI1Lfo.js";
-import { classnames } from "../../utilities/classnames.js";
+import { $ as $3017fa7ffdddec74$export$8042c6c013fd5226 } from "../../useToggleState-DghG5ImG.js";
+import { $ as $d2c8e2b0480f3f34$export$cbe85ee05b554577 } from "../../useToggle-CExfZM8x.js";
+import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-CRx_hYC4.js";
+import { $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../focusSafely-B0hyd-S4.js";
+import { $ as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../../VisuallyHidden-BPJVSUyp.js";
+import { c as clsx } from "../../lite-pbIeT7tm.js";
 function $b418ec0c85c52f27$export$d853f7095ae95f88(props, state, ref) {
   let { labelProps, inputProps, isSelected, isPressed, isDisabled, isReadOnly } = $d2c8e2b0480f3f34$export$cbe85ee05b554577(props, state, ref);
   return {
@@ -85,6 +85,8 @@ const $8e59e948500a8fe1$export$b5d5cf8927ab7262 = /* @__PURE__ */ forwardRef($8e
  * @param {boolean} [props.disabled] - Whether the switch is disabled.
  * @param {string} [props.id] - The ID of the switch.
  * @param {string} [props.className] - Classes to pass to the switch.
+ * @param {boolean} [props.isIndeterminate] - If `true`, the switch will render in an indeterminate state.
+ * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
  *
  * @returns {JSX.Element} The Switch component.
  *
@@ -99,7 +101,10 @@ const $8e59e948500a8fe1$export$b5d5cf8927ab7262 = /* @__PURE__ */ forwardRef($8e
  * @preserve
  */
 const Switch = (props) => {
-  const { checked, onChange, disabled, id, children, className } = props;
+  const { checked, onChange, disabled, id, children, className, isIndeterminate, hidden } = props;
+  if (hidden) {
+    return null;
+  }
   return /* @__PURE__ */ jsxs(
     $8e59e948500a8fe1$export$b5d5cf8927ab7262,
     {
@@ -110,10 +115,10 @@ const Switch = (props) => {
       className: "es-uic-group es-uic-flex es-uic-items-center es-uic-justify-between es-uic-gap-2",
       children: [
         children,
-        /* @__PURE__ */ jsx("div", { className: classnames("es-uic-flex es-uic-items-center es-uic-min-w-9 es-uic-justify-center", className), children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx("div", { className: clsx("es-uic-flex es-uic-shrink-0 es-uic-items-center es-uic-justify-center", className), children: /* @__PURE__ */ jsx(
           "div",
           {
-            className: classnames(
+            className: clsx(
               "es-uic-no-webkit-highlight es-uic-h-4 es-uic-w-7 es-uic-shrink-0 es-uic-cursor-pointer es-uic-rounded-full es-uic-border es-uic-border-gray-500 es-uic-bg-white es-uic-p-[0.1875rem] es-uic-shadow-sm es-uic-outline-none es-uic-transition",
               "group-focus-visible:es-uic-ring group-focus-visible:es-uic-ring-teal-500 group-focus-visible:es-uic-ring-opacity-50",
               "group-selected:es-uic-border-teal-800/75 group-selected:es-uic-bg-teal-100/25 group-selected:es-uic-shadow-teal-500/25",
@@ -122,10 +127,11 @@ const Switch = (props) => {
             children: /* @__PURE__ */ jsx(
               "span",
               {
-                className: classnames(
+                className: clsx(
                   "es-uic-block es-uic-size-2 es-uic-rounded-full es-uic-border es-uic-border-gray-500 es-uic-bg-gray-500 es-uic-transition es-uic-will-change-transform",
                   "group-selected:es-uic-translate-x-3 group-selected:es-uic-scale-125 group-selected:es-uic-border-teal-600 group-selected:es-uic-bg-teal-600",
-                  "group-disabled:es-uic-border-gray-300 group-disabled:es-uic-bg-white"
+                  "group-disabled:es-uic-border-gray-300 group-disabled:es-uic-bg-white",
+                  isIndeterminate && "es-uic-translate-x-1.5"
                 )
               }
             )

package/dist/components/toggle/toggle.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BPzS-sR7.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-9x5iLJ-Y.js";
 import { Switch } from "./switch.js";
 import { RichLabel } from "../rich-label/rich-label.js";
 /**
@@ -15,6 +15,8 @@ import { RichLabel } from "../rich-label/rich-label.js";
  * @param {string} [props.subtitle] - Subtitle to display.
  * @param {string} [props.className] - Classes to pass to the toggle switch.
  * @param {string} [props.labelClassName] - Classes to pass to the label.
+ * @param {boolean} [props.isIndeterminate] - If `true`, the switch will render in an indeterminate state.
+ * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
  *
  * @returns {JSX.Element} The Toggle component.
  *
@@ -31,7 +33,10 @@ import { RichLabel } from "../rich-label/rich-label.js";
  * @preserve
  */
 const Toggle = (props) => {
-  const { checked, onChange, icon, label, subtitle, disabled, className, labelClassName } = props;
+  const { checked, onChange, icon, label, subtitle, disabled, className, labelClassName, isIndeterminate, hidden } = props;
+  if (hidden) {
+    return null;
+  }
   return /* @__PURE__ */ jsx(
     Switch,
     {
@@ -39,6 +44,7 @@ const Toggle = (props) => {
       onChange,
       disabled,
       className,
+      isIndeterminate,
       children: /* @__PURE__ */ jsx(
         RichLabel,
         {

package/dist/components/toggle-button/toggle-button.js

@@ -1,12 +1,12 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { n as $ff5963eb1fccf552$export$e08e3b67e392101e, d as $3ef42575df84b30b$export$9d1611c77c2fe928, a as $64fa3d84918910a7$export$29f1550f4b0d4415, c as $64fa3d84918910a7$export$4d86445c2cf5e3 } from "../../utils-BsiH7-5Y.js";
+import { n as $ff5963eb1fccf552$export$e08e3b67e392101e, d as $3ef42575df84b30b$export$9d1611c77c2fe928, a as $64fa3d84918910a7$export$29f1550f4b0d4415, c as $64fa3d84918910a7$export$4d86445c2cf5e3 } from "../../utils-DIBzm1e4.js";
 import React__default, { forwardRef, createContext } from "react";
-import { $ as $3017fa7ffdddec74$export$8042c6c013fd5226 } from "../../useToggleState-DJ_z5E2S.js";
-import { $ as $701a24aa0da5b062$export$ea18c227d4417cc3 } from "../../useButton-CuG5UzUw.js";
-import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-Cc-4eouh.js";
-import { $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../focusSafely-C3K8zAKj.js";
-import { classnames } from "../../utilities/classnames.js";
-import { T as Tooltip } from "../../tooltip-CkCndvTI.js";
+import { $ as $3017fa7ffdddec74$export$8042c6c013fd5226 } from "../../useToggleState-DghG5ImG.js";
+import { $ as $701a24aa0da5b062$export$ea18c227d4417cc3 } from "../../useButton-D-xACzEY.js";
+import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-CRx_hYC4.js";
+import { $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../focusSafely-B0hyd-S4.js";
+import { c as clsx } from "../../lite-pbIeT7tm.js";
+import { T as Tooltip } from "../../tooltip-T6H9uF-Z.js";
 function $55f54f7887471b58$export$51e84d46ca0bc451(props, state, ref) {
   const { isSelected } = state;
   const { isPressed, buttonProps } = $701a24aa0da5b062$export$ea18c227d4417cc3({
@@ -69,6 +69,7 @@ const $efde0372d7a700fe$export$d2b052e7b4be1756 = /* @__PURE__ */ forwardRef($ef
  * @param {Function} [props.onChange] - Function to run when the toggle state changes.
  * @param {string} [props.wrapperClassName] - Classes to pass to the tooltip wrapper.
  * @param {Object} [props.tooltipProps] - Props to pass to the tooltip.
+ * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
  *
  * @returns {JSX.Element} The Button component.
  *
@@ -107,8 +108,12 @@ const ToggleButton = (props) => {
     onChange,
     wrapperClassName,
     tooltipProps,
+    hidden,
     ...other
   } = props;
+  if (hidden) {
+    return null;
+  }
   const sizes = {
     small: {
       iconButton: "es-uic-size-7",
@@ -157,8 +162,11 @@ const ToggleButton = (props) => {
       isDisabled: disabled,
       className: ({ isSelected }) => {
         var _a, _b, _c, _d, _e, _f;
-        return classnames(
-          "es-uic-isolate es-uic-flex es-uic-items-center es-uic-justify-center es-uic-gap-1 es-uic-rounded-md es-uic-transition es-uic-duration-300 es-uic-relative",
+        return clsx(
+          "es-uic-relative es-uic-isolate es-uic-flex es-uic-items-center es-uic-gap-1 es-uic-rounded-md es-uic-transition es-uic-duration-300",
+          icon && children && "es-uic-justify-start",
+          icon && !children && "es-uic-justify-center",
+          !icon && children && "es-uic-justify-center",
           'after:es-uic-absolute after:es-uic-inset-0 after:-es-uic-z-10 after:es-uic-rounded-[0.3125rem] after:es-uic-bg-gradient-to-br after:es-uic-from-teal-100/40 after:es-uic-via-transparent after:es-uic-to-teal-200/50 after:es-uic-opacity-0 after:es-uic-transition-opacity after:es-uic-content-[""]',
           "disabled:es-uic-shadow-none",
           "focus:es-uic-outline-none focus-visible:es-uic-outline-none focus-visible:es-uic-ring",
@@ -174,10 +182,14 @@ const ToggleButton = (props) => {
           children && !icon && sizes[size].buttonPadding,
           sizes[size].iconSize,
           isSelected && (((_f = themes[type]) == null ? void 0 : _f.selected) ?? themes.default.selected),
-          "[.es-uic-button-group_&:not(:first-child)]:es-uic-rounded-l-none [.es-uic-button-group_&:not(:last-child)]:-es-uic-mr-px [.es-uic-button-group_&:not(:last-child)]:es-uic-rounded-r-none",
-          "[.es-uic-button-group_&:not(:first-child)]:after:es-uic-rounded-l-none [.es-uic-button-group_&:not(:last-child)]:after:es-uic-rounded-r-none",
-          "[.es-uic-button-group_div:not(:first-child)_>_&]:es-uic-rounded-l-none [.es-uic-button-group_div:not(:last-child)_>_&]:-es-uic-mr-px [.es-uic-button-group_div:not(:last-child)_>_&]:es-uic-rounded-r-none",
-          "[.es-uic-button-group_div:not(:last-child)_>_&]:after:es-uic-rounded-r-none [.es-uic-button-group_div:not(:first-child)_>_&]:after:es-uic-rounded-l-none",
+          "[.es-uic-button-group-h_&:not(:first-child)]:es-uic-rounded-l-none [.es-uic-button-group-h_&:not(:last-child)]:-es-uic-mr-px [.es-uic-button-group-h_&:not(:last-child)]:es-uic-rounded-r-none",
+          "[.es-uic-button-group-h_&:not(:first-child)]:after:es-uic-rounded-l-none [.es-uic-button-group-h_&:not(:last-child)]:after:es-uic-rounded-r-none",
+          "[.es-uic-button-group-h_div:not(:first-child)_>_&]:es-uic-rounded-l-none [.es-uic-button-group-h_div:not(:last-child)_>_&]:-es-uic-mr-px [.es-uic-button-group-h_div:not(:last-child)_>_&]:es-uic-rounded-r-none",
+          "[.es-uic-button-group-h_div:not(:first-child)_>_&]:after:es-uic-rounded-l-none [.es-uic-button-group-h_div:not(:last-child)_>_&]:after:es-uic-rounded-r-none",
+          "[.es-uic-button-group-v_&:not(:first-child)]:es-uic-rounded-t-none [.es-uic-button-group-v_&:not(:last-child)]:-es-uic-mb-px [.es-uic-button-group-v_&:not(:last-child)]:es-uic-rounded-b-none",
+          "[.es-uic-button-group-v_&:not(:first-child)]:after:es-uic-rounded-t-none [.es-uic-button-group-v_&:not(:last-child)]:after:es-uic-rounded-b-none",
+          "[.es-uic-button-group-v_div:not(:first-child)_>_&]:es-uic-rounded-t-none [.es-uic-button-group-v_div:not(:last-child)_>_&]:-es-uic-mb-px [.es-uic-button-group-v_div:not(:last-child)_>_&]:es-uic-rounded-b-none",
+          "[.es-uic-button-group-v_div:not(:first-child)_>_&]:after:es-uic-rounded-t-none [.es-uic-button-group-v_div:not(:last-child)_>_&]:after:es-uic-rounded-b-none",
           className
         );
       },

package/dist/components/tooltip/tooltip.js

@@ -1,9 +1,9 @@
 import "react/jsx-runtime";
-import { D, T } from "../../tooltip-CkCndvTI.js";
-import "../../utilities/classnames.js";
+import { D, T } from "../../tooltip-T6H9uF-Z.js";
+import "../../lite-pbIeT7tm.js";
 import "react";
-import "../../focusSafely-C3K8zAKj.js";
-import "../../utils-BsiH7-5Y.js";
+import "../../focusSafely-B0hyd-S4.js";
+import "../../utils-DIBzm1e4.js";
 export {
   D as DecorativeTooltip,
   T as Tooltip

package/dist/{context-jMy6xdVq.js → context-BAcFg5GO.js}

@@ -1,5 +1,5 @@
 import React__default, { useState, useEffect, useContext } from "react";
-import { o as $b5e257d569688ac6$export$535bd6ca7f90a273 } from "./utils-BsiH7-5Y.js";
+import { o as $b5e257d569688ac6$export$535bd6ca7f90a273 } from "./utils-DIBzm1e4.js";
 const $148a7a147e38ea7f$var$RTL_SCRIPTS = /* @__PURE__ */ new Set([
   "Arab",
   "Syrc",

package/dist/{default-i18n-BhE-OUmt.js → default-i18n-Bk1GxDHz.js}

@@ -1,4 +1,4 @@
-import { g as getDefaultExportFromCjs } from "./_commonjsHelpers-CUmg6egw.js";
+import { g as getDefaultExportFromCjs } from "./_commonjsHelpers-DWwsNxpa.js";
 function memize(fn, options) {
   var size = 0;
   var head;

package/dist/{focusSafely-C3K8zAKj.js → focusSafely-B0hyd-S4.js}

@@ -1,4 +1,4 @@
-import { g as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, f as $8ae05eaa5c114e9c$export$7f54fc3180508a52, o as $b5e257d569688ac6$export$535bd6ca7f90a273 } from "./utils-BsiH7-5Y.js";
+import { g as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, f as $8ae05eaa5c114e9c$export$7f54fc3180508a52, o as $b5e257d569688ac6$export$535bd6ca7f90a273 } from "./utils-DIBzm1e4.js";
 import { useState, useRef, useEffect, useCallback, useMemo } from "react";
 const $431fbd86ca7dc216$export$b204af158042fbac = (el) => {
   var _el_ownerDocument;

package/dist/fonts.js

@@ -0,0 +1 @@
+import './assets/fonts.css';