@sudobility/components 2.0.3 → 2.0.6

package/dist/index.esm.js

@@ -2609,8 +2609,9 @@ const h = {
     // Dropdown menus
     dropdown: {
       container: () => "relative inline-block",
-      trigger: () => "inline-flex justify-center items-center bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 text-gray-900 dark:text-gray-100 hover:bg-gray-50 dark:hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:ring-offset-gray-950 transition-colors",
-      menu: () => "absolute z-50 w-56 bg-white dark:bg-gray-800 rounded-md shadow-lg border border-gray-200 dark:border-gray-700 focus:outline-none transition-all duration-200",
+      trigger: () => "inline-flex justify-center items-center bg-transparent border-0 text-gray-900 dark:text-gray-100 focus:outline-none transition-colors",
+      triggerBordered: () => "inline-flex justify-center items-center bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 text-gray-900 dark:text-gray-100 hover:bg-gray-50 dark:hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:ring-offset-gray-950 transition-colors",
+      menu: () => "absolute z-50 w-56 bg-white dark:bg-gray-800 rounded-md shadow-lg focus:outline-none transition-all duration-200",
       menuSmall: () => "w-40",
       menuLarge: () => "w-72",
       menuAuto: () => "w-auto min-w-40",
@@ -5823,56 +5824,50 @@ const ra = {
   trigger: t,
   items: e,
   align: r = "right",
-  className: a = ""
+  className: a = "",
+  variant: o = "default"
 }) => {
-  const [o, i] = E(!1), l = k.useRef(null);
-  Hr(l, () => i(!1));
-  const s = (g) => {
-    g.disabled || (g.onClick(), i(!1));
-  }, d = r === "left" ? v.overlays.dropdown.menuRight() : v.overlays.dropdown.menuLeft();
+  const [i, l] = E(!1), s = k.useRef(null);
+  Hr(s, () => l(!1));
+  const d = (b) => {
+    b.disabled || (b.onClick(), l(!1));
+  }, g = r === "left" ? v.overlays.dropdown.menuRight() : v.overlays.dropdown.menuLeft(), m = o === "bordered" ? v.overlays.dropdown.triggerBordered() : v.overlays.dropdown.trigger();
   return /* @__PURE__ */ u(
     "div",
     {
       className: `${v.overlays.dropdown.container()} ${a}`,
-      ref: l,
+      ref: s,
       children: [
-        /* @__PURE__ */ n(
-          "div",
-          {
-            className: v.overlays.dropdown.trigger(),
-            onClick: () => i(!o),
-            children: t
-          }
-        ),
-        o && /* @__PURE__ */ n(
+        /* @__PURE__ */ n("div", { className: m, onClick: () => l(!i), children: t }),
+        i && /* @__PURE__ */ n(
           "div",
           {
-            className: `${v.overlays.dropdown.menu()} ${d} ${v.overlays.dropdown.menuBottom()}`,
+            className: `${v.overlays.dropdown.menu()} ${g} ${v.overlays.dropdown.menuBottom()}`,
             children: /* @__PURE__ */ n("div", { className: v.overlays.dropdown.itemContainer(), children: e.map(
-              (g) => g.separator ? /* @__PURE__ */ n(
+              (b) => b.separator ? /* @__PURE__ */ n(
                 "div",
                 {
                   className: "my-1 h-px bg-gray-200 dark:bg-gray-700",
                   role: "separator"
                 },
-                g.id
+                b.id
               ) : /* @__PURE__ */ u(
                 "button",
                 {
-                  onClick: () => s(g),
-                  disabled: g.disabled,
-                  className: g.disabled ? v.overlays.dropdown.itemDisabled() : v.overlays.dropdown.item(),
+                  onClick: () => d(b),
+                  disabled: b.disabled,
+                  className: b.disabled ? v.overlays.dropdown.itemDisabled() : v.overlays.dropdown.item(),
                   children: [
-                    g.icon && /* @__PURE__ */ n(
-                      g.icon,
+                    b.icon && /* @__PURE__ */ n(
+                      b.icon,
                       {
                         className: v.overlays.dropdown.itemIcon()
                       }
                     ),
-                    /* @__PURE__ */ n("span", { children: g.label })
+                    /* @__PURE__ */ n("span", { children: b.label })
                   ]
                 },
-                g.id
+                b.id
               )
             ) })
           }