@theroutingcompany/components 0.0.148 → 0.0.149-alpha.0

package/dist/trc-components.es.js

@@ -15384,7 +15384,8 @@ const Ed = {
     color: ${f.color_deprecated_fill_inverse_hover};
   }
 
-  &[data-state~='pressed'] {
+  &[data-state~='pressed'],
+  &[data-active='true'] {
     background: ${f.color_deprecated_fill_primary_pressed};
   }
 
@@ -15461,25 +15462,29 @@ const Ed = {
       autoFocus: s,
       children: c,
       style: d = {},
-      ...p
-    } = e, h = qr(), v = u ?? h, { buttonProps: g, isPressed: b } = Jn(
+      as: p,
+      active: h,
+      ...v
+    } = e, g = qr(), b = u ?? g, { buttonProps: y, isPressed: D } = Jn(
       {
         onPress: l,
-        isDisabled: v,
+        isDisabled: b,
         autoFocus: s
       },
       r
-    ), { isFocusVisible: y, focusProps: D } = ga({ autoFocus: s }), E = Hb({ isFocusVisible: y, isPressed: b }), x = bR[i], S = A1[a], w = Ed[o], P = Re(D, p, g, {
-      "data-state": E
+    ), { isFocusVisible: E, focusProps: x } = ga({ autoFocus: s }), S = Hb({ isFocusVisible: E, isPressed: D }), w = bR[i], P = A1[a], k = Ed[o], B = Re(x, v, y, {
+      "data-state": S,
+      "data-active": h ? "true" : "false"
     });
     return /* @__PURE__ */ m(
-      x,
+      w,
       {
         ref: r,
-        ...P,
+        ...B,
+        as: p,
         style: {
-          "--icon-button-size": w,
-          "--icon-button-border-radius": S,
+          "--icon-button-size": k,
+          "--icon-button-border-radius": P,
           ...d
         },
         children: /* @__PURE__ */ m(dl, { label: n, children: c })
@@ -18543,7 +18548,7 @@ const BI = mt`
   line-height: ${f.line_height_deprecated_133};
   font-family: ${f.font_family_pingo};
   max-width: ${f.sizing_1000};
-  z-index: 30;
+  z-index: 2100;
   animation-duration: 400ms;
   animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
 
@@ -30229,25 +30234,35 @@ const f0 = H.createContext({
   position: relative;
   width: inherit;
 `, ci = Me((e, t) => {
-  const [r, n] = re(!1), [o, i] = re(null), a = vn(t);
+  const [r, n] = re(!1), [o, i] = re(null), a = vn(t), u = e.isOpen !== void 0, l = u ? e.isOpen ?? !1 : r, s = ne(
+    (c) => {
+      var d;
+      if (u) {
+        const p = typeof c == "function" ? c(e.isOpen ?? !1) : c;
+        (d = e.onOpenChange) == null || d.call(e, p);
+      } else
+        n(c);
+    },
+    [u, e]
+  );
   return ue(() => {
-    const u = document.getElementById(d0);
-    function l(s) {
-      const c = s.target;
-      a.current && !a.current.contains(c) && !(u != null && u.contains(c)) && n(!1);
+    const c = document.getElementById(d0);
+    function d(p) {
+      const h = p.target;
+      a.current && !a.current.contains(h) && !(c != null && c.contains(h)) && s(!1);
     }
-    return document.addEventListener("mousedown", l), () => {
-      document.removeEventListener("mousedown", l);
+    return document.addEventListener("mousedown", d), () => {
+      document.removeEventListener("mousedown", d);
     };
-  }, [a]), /* @__PURE__ */ m(
+  }, [a, s]), /* @__PURE__ */ m(
     f0.Provider,
     {
       value: {
         menuRef: a,
         triggerRef: o,
         setTriggerRef: i,
-        open: r,
-        setOpen: n,
+        open: l,
+        setOpen: s,
         direction: e.direction ?? "Down"
         /* Down */
       },