prometeo-design-system 7.4.1 → 7.4.2

package/dist/Card.es.js

@@ -1,112 +1,130 @@
-import { j as o } from "./jsx-runtime-GkKLlHH4.js";
-import { createContext as N, useContext as j, memo as d, forwardRef as w, useMemo as z } from "react";
-import { c as s } from "./cn-B6yFEsav.js";
-import { c as i } from "./index-BOQuZ0gG.js";
-import F from "./CardBackground.es.js";
-const l = N(null);
-function C() {
-  const a = j(l);
+import { j as e } from "./jsx-runtime-GkKLlHH4.js";
+import { createContext as z, useContext as w, memo as s, forwardRef as F, useMemo as H } from "react";
+import { c as i } from "./cn-B6yFEsav.js";
+import { c as d } from "./index-BOQuZ0gG.js";
+import V from "./CardBackground.es.js";
+const C = z(null);
+function m() {
+  const a = w(C);
   if (!a)
     throw new Error(
       "Card compound components (Card.Header, Card.Content, Card.Footer) must be used inside <Card>"
     );
   return a;
 }
-const H = i(
-  "relative overflow-hidden dropshadow-100 radius-medium border border-neutral-default-default p-3 shrink-0",
+const k = d(
+  "relative overflow-hidden dropshadow-100 radius-medium border border-neutral-default-default p-3 shrink-0 *:z-10",
   {
     variants: {
-      direction: {
+      orientation: {
         vertical: "flex flex-col",
         horizontal: "flex flex-row"
       }
     },
     defaultVariants: {
-      direction: "vertical"
+      orientation: "vertical"
     }
   }
-), V = i("shrink-0 z-10", {
+), b = d("shrink-0 z-10", {
   variants: {
-    direction: {
+    orientation: {
       vertical: "",
       horizontal: ""
     }
   }
-}), k = i("shrink-0 z-10", {
+}), y = d("shrink-0 z-10", {
   variants: {
-    direction: {
+    orientation: {
       vertical: "",
       horizontal: ""
     }
   }
-}), b = i("flex-1 min-h-0 min-w-0 z-10"), y = w(function({
+}), E = d("flex-1 min-h-0 min-w-0 z-10"), g = F(function({
   variant: r = "1-slot",
-  direction: t = "vertical",
-  cardBackground: e,
-  children: n,
-  className: x,
-  ...h
-}, v) {
-  const p = z(
-    () => ({ variant: r, direction: t }),
-    [r, t]
+  direction: t,
+  orientation: o,
+  cardBackground: n,
+  children: h,
+  className: v,
+  ...N
+}, p) {
+  const l = o ?? t ?? "vertical", j = H(
+    () => ({ orientation: l, variant: r }),
+    [l, r]
   );
-  return /* @__PURE__ */ o.jsx(l.Provider, { value: p, children: /* @__PURE__ */ o.jsxs(
+  return /* @__PURE__ */ e.jsx(C.Provider, { value: j, children: /* @__PURE__ */ e.jsxs(
     "div",
     {
-      ref: v,
-      className: s(H({ direction: t }), x),
-      ...h,
+      ref: p,
+      className: i(
+        k({ orientation: l }),
+        v
+      ),
+      ...N,
       children: [
-        /* @__PURE__ */ o.jsx(
-          F,
+        /* @__PURE__ */ e.jsx(
+          V,
           {
-            ...e,
-            className: s(
+            ...n,
+            className: i(
               "inset-0 absolute z-0",
-              e?.className
+              n?.className
             )
           }
         ),
-        n
+        h
       ]
     }
   ) });
-}), m = d(function({
+}), u = s(function({
   children: r,
   className: t,
-  ...e
+  ...o
 }) {
-  const { direction: n } = C();
-  return /* @__PURE__ */ o.jsx("div", { className: s(V({ direction: n }), t), ...e, children: r });
-}), u = d(function({
+  const { orientation: n } = m();
+  return /* @__PURE__ */ e.jsx(
+    "div",
+    {
+      className: i(b({ orientation: n }), t),
+      ...o,
+      children: r
+    }
+  );
+}), f = s(function({
   children: r,
   className: t,
-  ...e
+  ...o
 }) {
-  return /* @__PURE__ */ o.jsx("div", { className: s(b(), t), ...e, children: r });
-}), f = d(function({
+  return /* @__PURE__ */ e.jsx("div", { className: i(E(), t), ...o, children: r });
+}), x = s(function({
   children: r,
   className: t,
-  ...e
+  ...o
 }) {
-  const { direction: n } = C();
-  return /* @__PURE__ */ o.jsx("div", { className: s(k({ direction: n }), t), ...e, children: r });
+  const { orientation: n } = m();
+  return /* @__PURE__ */ e.jsx(
+    "div",
+    {
+      className: i(y({ orientation: n }), t),
+      ...o,
+      children: r
+    }
+  );
 });
-function E(a, r) {
-  return a.variant === r.variant && a.direction === r.direction && a.className === r.className && a.children === r.children && a.cardBackground === r.cardBackground;
+function B(a, r) {
+  return a.variant === r.variant && a.direction === r.direction && a.orientation === r.orientation && a.className === r.className && a.children === r.children && a.cardBackground === r.cardBackground;
 }
-const c = d(y, E);
-c.Header = m;
-c.Content = u;
-c.Footer = f;
+const c = s(g, B);
+c.Header = u;
+c.Content = f;
+c.Footer = x;
 c.displayName = "Card";
-m.displayName = "Card.Header";
-u.displayName = "Card.Content";
-f.displayName = "Card.Footer";
+u.displayName = "Card.Header";
+f.displayName = "Card.Content";
+x.displayName = "Card.Footer";
 export {
   c as Card,
-  u as CardContent,
-  f as CardFooter,
-  m as CardHeader
+  f as CardContent,
+  x as CardFooter,
+  u as CardHeader
 };

package/dist/Collapsible.css

@@ -0,0 +1 @@
+.pyrion-collapsible-content[data-orientation=vertical]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s ease-out,opacity .1s ease-in;opacity:0}.pyrion-collapsible-content[data-orientation=vertical][data-expanded=true]{grid-template-rows:1fr;opacity:1;transition:grid-template-rows .25s ease-out,opacity .15s ease-out 50ms}.pyrion-collapsible-content[data-orientation=horizontal]{display:grid;grid-template-columns:0fr;transition:grid-template-columns .25s ease-out,opacity .1s ease-in;opacity:0}.pyrion-collapsible-content[data-orientation=horizontal][data-expanded=true]{grid-template-columns:1fr;opacity:1;transition:grid-template-columns .25s ease-out,opacity .15s ease-out 50ms}.pyrion-collapsible-inner{overflow:hidden}.pyrion-collapsible-content[data-orientation=vertical] .pyrion-collapsible-inner{min-height:0}.pyrion-collapsible-content[data-orientation=horizontal] .pyrion-collapsible-inner{min-width:0}.pyrion-collapsible-trigger{display:flex;align-items:center;cursor:pointer;background:none;border:none;padding:0;width:100%;text-align:left;color:inherit;font:inherit}.pyrion-collapsible-trigger:disabled{cursor:not-allowed;opacity:.4}.pyrion-collapsible-trigger svg{transition:transform .25s ease;flex-shrink:0}.pyrion-collapsible-trigger[data-expanded=true] svg{transform:rotate(180deg)}.pyrion-collapsible-trigger[data-orientation=horizontal][data-expanded=true] svg{transform:rotate(90deg)}

package/dist/Collapsible.d.ts

@@ -0,0 +1,6 @@
+export * from './exports/Collapsible'
+export {}
+import PrometeoDesignSystem from './exports/Collapsible'
+export default PrometeoDesignSystem
+export * from './exports/Collapsible'
+export {}

package/dist/Collapsible.es.js

@@ -0,0 +1,78 @@
+import { j as i } from "./jsx-runtime-GkKLlHH4.js";
+import { createContext as g, useContext as j, memo as v, useState as y, useCallback as O } from "react";
+const u = g(null);
+function d() {
+  const e = j(u);
+  if (!e)
+    throw new Error(
+      "Collapsible sub-components must be used inside <Collapsible>"
+    );
+  return e;
+}
+function N({
+  orientation: e = "vertical",
+  defaultOpen: t = !1,
+  open: n,
+  onOpenChange: o,
+  disabled: l = !1,
+  children: s,
+  className: a
+}) {
+  const r = n !== void 0, [x, m] = y(t), p = r ? n : x, f = O(() => {
+    if (l) return;
+    const c = !p;
+    r || m(c), o?.(c);
+  }, [l, r, p, o]);
+  return /* @__PURE__ */ i.jsx(
+    u.Provider,
+    {
+      value: { isOpen: p, toggle: f, orientation: e, disabled: l },
+      children: /* @__PURE__ */ i.jsx("div", { className: a, children: s })
+    }
+  );
+}
+function C({
+  children: e,
+  className: t,
+  ...n
+}) {
+  const { isOpen: o, toggle: l, orientation: s, disabled: a } = d();
+  return /* @__PURE__ */ i.jsx(
+    "button",
+    {
+      type: "button",
+      className: `pyrion-collapsible-trigger${t ? ` ${t}` : ""}`,
+      onClick: l,
+      disabled: a,
+      "aria-expanded": o,
+      "data-expanded": o,
+      "data-orientation": s,
+      ...n,
+      children: e
+    }
+  );
+}
+function b({ children: e, className: t }) {
+  const { isOpen: n, orientation: o } = d();
+  return /* @__PURE__ */ i.jsx(
+    "div",
+    {
+      className: `pyrion-collapsible-content${t ? ` ${t}` : ""}`,
+      "data-expanded": n,
+      "data-orientation": o,
+      ...n ? {} : { inert: !0 },
+      children: /* @__PURE__ */ i.jsx("div", { className: "pyrion-collapsible-inner", children: e })
+    }
+  );
+}
+const $ = Object.assign(v(N), {
+  Trigger: C,
+  Content: b
+});
+$.displayName = "Collapsible";
+C.displayName = "Collapsible.Trigger";
+b.displayName = "Collapsible.Content";
+export {
+  $ as Collapsible,
+  $ as default
+};