@skalar-saas/design-system 0.2.3 → 0.2.5

package/dist/{index-DC7H6Bp7.js → index-D7xgKYfe.js}

@@ -592,7 +592,7 @@ const r3 = ({
           "div",
           {
             className: P(
-              "absolute top-0 z-50",
+              "absolute inset-y-0 z-50",
               q === "right" ? "right-0 translate-x-full" : "left-0 -translate-x-full"
             ),
             onMouseDown: R,
@@ -4930,7 +4930,7 @@ const f4 = {
       )
     ] }) })
   }
-), x4 = A.lazy(() => import("./index-DOWXdrvI.js")), tg = ({ children: e }) => /* @__PURE__ */ s(aO, { fallback: /* @__PURE__ */ s("span", { children: e }), children: /* @__PURE__ */ s(x4, { children: e }) }), w4 = A.memo(({
+), x4 = A.lazy(() => import("./index-ByK6rU3h.js")), tg = ({ children: e }) => /* @__PURE__ */ s(aO, { fallback: /* @__PURE__ */ s("span", { children: e }), children: /* @__PURE__ */ s(x4, { children: e }) }), w4 = A.memo(({
   messages: e,
   showTypingIndicator: t = !1,
   children: r,
@@ -6628,68 +6628,68 @@ const TV = ({
     "items-center",
     "justify-center",
     "p-1 bg-brand-primary-main-special rounded-8 border border-brand-primary-accent-special gap-2"
-  ), [i, o] = G(null), l = le(null);
+  ), [i, o] = G(null);
   return ve(() => {
-    const u = (d) => {
-      l.current && !l.current.contains(d.target) && o(null);
+    const c = (u) => {
+      u.target?.closest("[data-floatingbar-dropdown]") || o(null);
     };
     if (i)
-      return document.addEventListener("mousedown", u), () => document.removeEventListener("mousedown", u);
+      return document.addEventListener("mousedown", c), () => document.removeEventListener("mousedown", c);
   }, [i]), /* @__PURE__ */ s("div", { style: {
     width: r,
     height: n
-  }, className: P("flex items-center gap-4 w-fit", t), children: e.map((u, d) => /* @__PURE__ */ s("div", { className: a, children: u.map((f) => /* @__PURE__ */ s("div", { className: "relative", children: f.type === "dropdown" ? (
+  }, className: P("flex items-center gap-4 w-fit", t), children: e.map((c, u) => /* @__PURE__ */ s("div", { className: a, children: c.map((d) => /* @__PURE__ */ s("div", { className: "relative", children: d.type === "dropdown" ? (
     /* Dropdown Action with DropMenu */
-    /* @__PURE__ */ w("div", { ref: l, className: "relative gap-4", children: [
+    /* @__PURE__ */ w("div", { "data-floatingbar-dropdown": d.id, className: "relative gap-4", children: [
       /* @__PURE__ */ s(
         H,
         {
-          variant: f.variant || "brand",
-          hierarchy: f.hierarchy || "secondary",
-          size: f.size || "sm",
-          icons: f.label && f.leadingIcon ? "both" : "trailing",
-          leadingIcon: f.label ? f.leadingIcon : void 0,
-          trailingIcon: i === f.id ? /* @__PURE__ */ s(s3, {}) : /* @__PURE__ */ s(o3, {}),
-          onClick: () => o(i === f.id ? null : f.id),
-          disabled: f.disabled,
+          variant: d.variant || "brand",
+          hierarchy: d.hierarchy || "secondary",
+          size: d.size || "sm",
+          icons: d.label && d.leadingIcon ? "both" : "trailing",
+          leadingIcon: d.label ? d.leadingIcon : void 0,
+          trailingIcon: i === d.id ? /* @__PURE__ */ s(s3, {}) : /* @__PURE__ */ s(o3, {}),
+          onClick: () => o(i === d.id ? null : d.id),
+          disabled: d.disabled,
           style: { outline: "none", boxShadow: "none" },
           className: P(
-            f.className,
-            i === f.id && "bg-brand-primary-accent-special"
+            d.className,
+            i === d.id && "bg-brand-primary-accent-special"
           ),
-          children: f.label ? f.label : A.isValidElement(f.leadingIcon) ? A.cloneElement(f.leadingIcon, {
+          children: d.label ? d.label : A.isValidElement(d.leadingIcon) ? A.cloneElement(d.leadingIcon, {
             size: 18,
             color: "currentColor"
-          }) : f.leadingIcon
+          }) : d.leadingIcon
         }
       ),
-      i === f.id && /* @__PURE__ */ s(
+      i === d.id && /* @__PURE__ */ s(
         or,
         {
           floating: !0,
-          size: f.dropMenuSize || "sm",
-          selectedIds: f.selectedIds,
-          items: f.items.map((h) => ({
-            id: h.id,
-            title: h.label,
-            leadingIcon: h.icon,
-            showLeadingIcon: !!h.icon,
-            showDescription: f.showDescription ?? !1,
-            showTrailingIcon: f.showTrailingIcon ?? !1,
-            showTrailingText: f.showTrailingText ?? !1,
-            trailingText: h.trailingText,
-            showTag: f.showTag ?? !1,
-            showCheckbox: f.showCheckbox ?? !1,
-            disabled: h.disabled,
-            showDividerAfter: h.showDividerAfter,
+          size: d.dropMenuSize || "sm",
+          selectedIds: d.selectedIds,
+          items: d.items.map((f) => ({
+            id: f.id,
+            title: f.label,
+            leadingIcon: f.icon,
+            showLeadingIcon: !!f.icon,
+            showDescription: d.showDescription ?? !1,
+            showTrailingIcon: d.showTrailingIcon ?? !1,
+            showTrailingText: d.showTrailingText ?? !1,
+            trailingText: f.trailingText,
+            showTag: d.showTag ?? !1,
+            showCheckbox: d.showCheckbox ?? !1,
+            disabled: f.disabled,
+            showDividerAfter: f.showDividerAfter,
             onClick: () => {
-              h.onClick(), o(null);
+              f.onClick(), o(null);
             },
-            ...h.destructive && {
-              customTitleColor: f.destructiveColor || "text-danger-em"
+            ...f.destructive && {
+              customTitleColor: d.destructiveColor || "text-danger-em"
             }
           })),
-          className: P("bottom-full mb-4", f.dropMenuClassName)
+          className: P("bottom-full mb-4", d.dropMenuClassName)
         }
       )
     ] })
@@ -6698,22 +6698,22 @@ const TV = ({
     /* @__PURE__ */ s(
       H,
       {
-        variant: f.variant || "brand",
-        hierarchy: f.hierarchy || "secondary",
-        size: f.size || "sm",
-        icons: f.label ? f.leadingIcon && f.trailingIcon ? "both" : f.leadingIcon ? "leading" : f.trailingIcon ? "trailing" : void 0 : "only",
-        leadingIcon: f.leadingIcon,
-        trailingIcon: f.trailingIcon,
-        onClick: f.onClick,
-        disabled: f.disabled,
+        variant: d.variant || "brand",
+        hierarchy: d.hierarchy || "secondary",
+        size: d.size || "sm",
+        icons: d.label ? d.leadingIcon && d.trailingIcon ? "both" : d.leadingIcon ? "leading" : d.trailingIcon ? "trailing" : void 0 : "only",
+        leadingIcon: d.leadingIcon,
+        trailingIcon: d.trailingIcon,
+        onClick: d.onClick,
+        disabled: d.disabled,
         style: { outline: "none", boxShadow: "none" },
         className: P(
-          f.className
+          d.className
         ),
-        children: f.label
+        children: d.label
       }
     )
-  ) }, f.id)) }, d)) });
+  ) }, d.id)) }, u)) });
 }, Z4 = ({
   icon: e,
   text: t,
@@ -38952,4 +38952,4 @@ export {
   cN as y,
   Ir as z
 };
-//# sourceMappingURL=index-DC7H6Bp7.js.map
+//# sourceMappingURL=index-D7xgKYfe.js.map