@orioncactuscorp/ui 1.3.0 → 1.4.0

package/dist/components/IconButton/IconButton.js

@@ -1,49 +1,68 @@
-import { jsxs as p, jsx as d } from "react/jsx-runtime";
-import { isValidElement as y, cloneElement as E } from "react";
-import j from "../Interaction/Interaction.js";
-import i from "./IconButton.module.scss.js";
-function V({
-  className: l = "",
-  style: c,
-  type: s = "button",
+'use client';
+import { jsx as c, jsxs as g, Fragment as j } from "react/jsx-runtime";
+import { isValidElement as y, cloneElement as B } from "react";
+import I from "../Interaction/Interaction.js";
+import f from "../internal/Pressable.js";
+import b from "./IconButton.module.scss.js";
+function F({
+  className: N = "",
+  style: e,
   children: o,
+  href: i,
+  disabled: s = !1,
   size: t = 24,
   variant: n = "normal",
-  viewBox: r,
-  color: u,
+  viewBox: l,
+  color: E,
   ref: m,
   "aria-label": a,
-  "aria-labelledby": e,
-  ...f
+  "aria-labelledby": r,
+  ...u
 }) {
-  process.env.NODE_ENV !== "production" && !a && !e && console.warn(
+  process.env.NODE_ENV !== "production" && !a && !r && console.warn(
     "[@orioncactuscorp/ui] IconButton requires `aria-label` or `aria-labelledby` for screen reader accessibility."
   );
-  const b = y(o) ? E(o, {
+  const P = y(o) ? B(o, {
     size: t,
-    color: u,
-    ...r ? { viewBox: r } : {}
-  }) : o;
-  return /* @__PURE__ */ p(
-    "button",
+    color: E,
+    ...l ? { viewBox: l } : {}
+  }) : o, p = /* @__PURE__ */ g(j, { children: [
+    P,
+    /* @__PURE__ */ c(I, { self: !0 })
+  ] }), d = [b.iconButton, b[n], N].filter(Boolean).join(" ");
+  return i !== void 0 ? /* @__PURE__ */ c(
+    f,
     {
-      ...f,
+      ...u,
       ref: m,
-      className: [i.iconButton, i[n], l].filter(Boolean).join(" "),
-      style: c,
-      type: s,
+      className: d,
+      style: e,
+      href: i,
+      disabled: s,
       "aria-label": a,
-      "aria-labelledby": e,
+      "aria-labelledby": r,
       "data-oc-component": "icon-button",
       "data-oc-variant": n,
       "data-oc-size": String(t),
-      children: [
-        b,
-        /* @__PURE__ */ d(j, { self: !0 })
-      ]
+      children: p
+    }
+  ) : /* @__PURE__ */ c(
+    f,
+    {
+      ...u,
+      ref: m,
+      className: d,
+      style: e,
+      disabled: s,
+      "aria-label": a,
+      "aria-labelledby": r,
+      "data-oc-component": "icon-button",
+      "data-oc-variant": n,
+      "data-oc-size": String(t),
+      children: p
     }
   );
 }
 export {
-  V as default
+  F as default
 };

package/dist/components/Loading/Loading.css

@@ -1 +1 @@
-.oc-Loading-module__loading__7gLQd{display:inline-flex;flex:none;inline-size:var(--oc-loading-size);block-size:var(--oc-loading-size);color:var(--oc-loading-color, var(--oc-color-theme-line-normal-strong))}.oc-Loading-module__loading__7gLQd [data-oc-part=icon]{inline-size:100%;block-size:100%;stroke:currentcolor}.oc-Loading-module__loading__7gLQd circle{transform-origin:center center;fill:none;stroke:currentcolor;stroke-dasharray:0 100;stroke-dashoffset:0;stroke-linecap:round;stroke-width:2.2}.oc-Loading-module__small__Z6U9M{--oc-loading-size: 1rem}.oc-Loading-module__medium__4KydF{--oc-loading-size: 1.5rem}.oc-Loading-module__large__u-Eod{--oc-loading-size: 3rem}.oc-Loading-module__circular__KTVW- circle{animation:oc-Loading-module__oc-loading-start-in__ZjFKt 2s cubic-bezier(.4,0,1,1),oc-Loading-module__oc-loading-start-out__s5c-1 .2s cubic-bezier(0,0,.6,1) 2s,oc-Loading-module__oc-loading-fade__wpHpE 2.2s ease-in-out,oc-Loading-module__oc-loading-array__FAP-n 5.3333s ease 2.2s infinite,oc-Loading-module__oc-loading-offset__tDLdP 5.3333s ease 2.2s infinite,oc-Loading-module__oc-loading-rotate__T9lw5 2.2s linear infinite}@media(prefers-reduced-motion:reduce){.oc-Loading-module__circular__KTVW- circle{animation:oc-Loading-module__oc-loading-fade__wpHpE 1.25s ease-in-out,oc-Loading-module__oc-loading-rotate__T9lw5 1.25s linear infinite;opacity:1;transform:none;stroke-dasharray:75 25;stroke-dashoffset:0}}@keyframes oc-Loading-module__oc-loading-fade__wpHpE{0%{opacity:0}to{opacity:1}}@keyframes oc-Loading-module__oc-loading-start-in__ZjFKt{0%{stroke-dasharray:0 100;stroke-dashoffset:0}to{stroke-dasharray:50 50;stroke-dashoffset:-50}}@keyframes oc-Loading-module__oc-loading-start-out__s5c-1{0%{stroke-dasharray:50 50;stroke-dashoffset:-50}to{stroke-dasharray:0 100;stroke-dashoffset:-100.01}}@keyframes oc-Loading-module__oc-loading-array__FAP-n{0%,25%,50%,75%,to{stroke-dasharray:0 100}12.5%,37.5%,62.5%,87.5%{stroke-dasharray:75 25}}@keyframes oc-Loading-module__oc-loading-offset__tDLdP{0%,12.5%{stroke-dashoffset:0}25%,37.5%{stroke-dashoffset:-75}50%,62.5%{stroke-dashoffset:-150}75%,87.5%{stroke-dashoffset:-225}to{stroke-dashoffset:-300.01}}@keyframes oc-Loading-module__oc-loading-rotate__T9lw5{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
+.oc-Loading-module__loading__7gLQd{display:inline-flex;flex:none;inline-size:var(--oc-loading-size);block-size:var(--oc-loading-size);color:var(--oc-loading-color, var(--oc-color-theme-line-normal-strong))}.oc-Loading-module__loading__7gLQd [data-oc-part=indicator]{inline-size:100%;block-size:100%;stroke:currentcolor}.oc-Loading-module__loading__7gLQd circle{transform-origin:center center;fill:none;stroke:currentcolor;stroke-dasharray:0 100;stroke-dashoffset:0;stroke-linecap:round;stroke-width:2.2}.oc-Loading-module__small__Z6U9M{--oc-loading-size: 1rem}.oc-Loading-module__medium__4KydF{--oc-loading-size: 1.5rem}.oc-Loading-module__large__u-Eod{--oc-loading-size: 3rem}.oc-Loading-module__circular__KTVW- circle{animation:oc-Loading-module__oc-loading-start-in__ZjFKt 2s cubic-bezier(.4,0,1,1),oc-Loading-module__oc-loading-start-out__s5c-1 .2s cubic-bezier(0,0,.6,1) 2s,oc-Loading-module__oc-loading-fade__wpHpE 2.2s ease-in-out,oc-Loading-module__oc-loading-array__FAP-n 5.3333s ease 2.2s infinite,oc-Loading-module__oc-loading-offset__tDLdP 5.3333s ease 2.2s infinite,oc-Loading-module__oc-loading-rotate__T9lw5 2.2s linear infinite}@media(prefers-reduced-motion:reduce){.oc-Loading-module__circular__KTVW- circle{animation:oc-Loading-module__oc-loading-fade__wpHpE 1.25s ease-in-out,oc-Loading-module__oc-loading-rotate__T9lw5 1.25s linear infinite;opacity:1;transform:none;stroke-dasharray:75 25;stroke-dashoffset:0}}@keyframes oc-Loading-module__oc-loading-fade__wpHpE{0%{opacity:0}to{opacity:1}}@keyframes oc-Loading-module__oc-loading-start-in__ZjFKt{0%{stroke-dasharray:0 100;stroke-dashoffset:0}to{stroke-dasharray:50 50;stroke-dashoffset:-50}}@keyframes oc-Loading-module__oc-loading-start-out__s5c-1{0%{stroke-dasharray:50 50;stroke-dashoffset:-50}to{stroke-dasharray:0 100;stroke-dashoffset:-100.01}}@keyframes oc-Loading-module__oc-loading-array__FAP-n{0%,25%,50%,75%,to{stroke-dasharray:0 100}12.5%,37.5%,62.5%,87.5%{stroke-dasharray:75 25}}@keyframes oc-Loading-module__oc-loading-offset__tDLdP{0%,12.5%{stroke-dashoffset:0}25%,37.5%{stroke-dashoffset:-75}50%,62.5%{stroke-dashoffset:-150}75%,87.5%{stroke-dashoffset:-225}to{stroke-dashoffset:-300.01}}@keyframes oc-Loading-module__oc-loading-rotate__T9lw5{0%{transform:rotate(0)}to{transform:rotate(360deg)}}

package/dist/components/Loading/Loading.js

@@ -2,39 +2,39 @@ import { jsx as t } from "react/jsx-runtime";
 import a from "./Loading.module.scss.js";
 function g({
   className: e = "",
-  variant: n = "circular",
+  variant: r = "circular",
   size: o = "large",
-  ref: c,
-  style: i,
+  ref: i,
+  style: c,
   ...l
 }) {
-  const r = typeof o == "number" ? `${o}px` : void 0, s = [
+  const n = typeof o == "number" ? `${o}px` : void 0, s = [
     a.loading,
-    a[n],
+    a[r],
     typeof o == "string" && o !== "custom" ? a[o] : "",
     e
   ].filter(Boolean).join(" ");
   return /* @__PURE__ */ t(
     "span",
     {
-      ref: c,
+      ref: i,
       className: s,
       ...l,
       role: "status",
       "aria-live": "polite",
       style: {
-        ...i,
-        ...r ? { "--oc-loading-size": r } : null
+        ...c,
+        ...n ? { "--oc-loading-size": n } : null
       },
       "data-oc-component": "loading",
-      "data-oc-variant": n,
+      "data-oc-variant": r,
       "data-oc-size": String(o),
       children: /* @__PURE__ */ t(
         "svg",
         {
           xmlns: "http://www.w3.org/2000/svg",
           viewBox: "0 0 24 24",
-          "data-oc-part": "icon",
+          "data-oc-part": "indicator",
           "aria-hidden": "true",
           children: /* @__PURE__ */ t("circle", { pathLength: "100", cx: "12", cy: "12", r: "9" })
         }

package/dist/components/internal/Pressable.js

@@ -0,0 +1,90 @@
+import { jsx as c } from "react/jsx-runtime";
+function t(r, e = !0) {
+  r.preventDefault(), e && r.stopPropagation();
+}
+function j({
+  children: r,
+  className: e,
+  style: u,
+  disabled: o = !1,
+  href: a,
+  ...i
+}) {
+  if (a !== void 0) {
+    const w = i, {
+      "aria-disabled": h,
+      onAuxClick: k,
+      onClick: p,
+      onKeyDown: P,
+      onMouseDown: x,
+      onPointerDown: C,
+      ref: y,
+      tabIndex: A,
+      ...d
+    } = w;
+    return /* @__PURE__ */ c(
+      "a",
+      {
+        ...d,
+        ref: y,
+        className: e,
+        style: u,
+        href: a,
+        onAuxClick: (n) => {
+          if (o) {
+            t(n);
+            return;
+          }
+          k?.(n);
+        },
+        onClick: (n) => {
+          if (o) {
+            t(n, !1);
+            return;
+          }
+          p?.(n);
+        },
+        onKeyDown: (n) => {
+          if ((n.key === "Enter" || n.key === " ") && o) {
+            t(n);
+            return;
+          }
+          P?.(n);
+        },
+        onMouseDown: (n) => {
+          if (o) {
+            t(n);
+            return;
+          }
+          x?.(n);
+        },
+        onPointerDown: (n) => {
+          if (o) {
+            t(n);
+            return;
+          }
+          C?.(n);
+        },
+        "aria-disabled": o ? "true" : h,
+        tabIndex: o ? -1 : A,
+        children: r
+      }
+    );
+  }
+  const s = i, { ref: f, type: l = "button", ...D } = s;
+  return /* @__PURE__ */ c(
+    "button",
+    {
+      ...D,
+      ref: f,
+      className: e,
+      style: u,
+      type: l,
+      disabled: o,
+      children: r
+    }
+  );
+}
+export {
+  j as default
+};

package/dist/index.js

@@ -1,102 +1,108 @@
 import { default as t } from "./components/SectionHeader/SectionHeader.js";
 import { default as a } from "./components/Button/Button.js";
-import { default as d, ActionAreaButton as n } from "./components/ActionArea/ActionArea.js";
-import { default as p } from "./components/Badge/Badge.js";
-import { default as u } from "./components/Background/Background.js";
-import { default as m } from "./components/Divider/Divider.js";
-import { default as c } from "./components/Loading/Loading.js";
-import { default as g, CellItem as C } from "./components/Cell/Cell.js";
-import { default as T } from "./components/TextButton/TextButton.js";
-import { default as F } from "./components/IconButton/IconButton.js";
-import { default as S } from "./components/BackgroundIconButton/BackgroundIconButton.js";
-import { default as R } from "./components/Interaction/Interaction.js";
-import { Field as h, FieldControl as v, FieldErrorMessage as H, FieldLabel as L, FieldMessage as b } from "./components/Field/Field.js";
-import { FieldGroup as w, FieldLegend as E, Fieldset as G, FieldsetContent as P } from "./components/Fieldset/Fieldset.js";
-import { default as q } from "./components/Checkbox/Checkbox.js";
-import { default as J } from "./components/CheckMark/CheckMark.js";
-import { default as N } from "./components/Radio/Radio.js";
-import { default as Q } from "./components/Switch/Switch.js";
-import { default as V } from "./components/TextInput/TextInput.js";
-import { default as X } from "./components/TextInput/TextInputContent.js";
-import { default as Z } from "./components/TextArea/TextArea.js";
-import { default as $ } from "./components/TextArea/TextAreaContent.js";
-import { default as eo } from "./components/Select/Select.js";
-import { default as ro } from "./components/Select/SelectContent.js";
-import { MenuContent as lo, MenuItem as no, MenuRoot as fo, MenuSeparator as po, MenuTrigger as io } from "./components/Menu/Menu.js";
-import { default as xo, AlertAction as mo, AlertActionArea as so, AlertContent as co, AlertDescription as Ao, AlertHeading as go, AlertRoot as Co } from "./components/Alert/Alert.js";
-import { default as To, AccordionContent as Bo, AccordionDescription as Fo, AccordionDetails as Io, AccordionItem as So, AccordionSummary as ko } from "./components/Accordion/Accordion.js";
-import { default as Do, ModalBody as ho, ModalClose as vo, ModalContent as Ho, ModalFooter as Lo, ModalHeader as bo, ModalRoot as yo, ModalTrigger as wo } from "./components/Modal/Modal.js";
-import { TooltipContent as Go, TooltipProvider as Po, TooltipRoot as jo, TooltipTrigger as qo } from "./components/Tooltip/Tooltip.js";
-import { ScrollArea as Jo, ScrollAreaContainer as Ko } from "./components/ScrollArea/ScrollArea.js";
-import { getBreakpoint as Oo, getBreakpoints as Qo } from "./utils/breakpoints.js";
-import { SvgIcon as Vo } from "@orioncactuscorp/icons";
+import { default as n, ActionAreaButton as d } from "./components/ActionArea/ActionArea.js";
+import { default as i, ActionAreaLayoutActionArea as u, ActionAreaLayoutBody as p, ActionAreaLayoutFooter as c, ActionAreaLayout as x } from "./components/ActionArea/ActionAreaLayout.js";
+import { default as s } from "./components/Badge/Badge.js";
+import { default as g } from "./components/Background/Background.js";
+import { default as M } from "./components/Divider/Divider.js";
+import { default as T } from "./components/Loading/Loading.js";
+import { default as y, CellItem as I } from "./components/Cell/Cell.js";
+import { default as S } from "./components/TextButton/TextButton.js";
+import { default as R } from "./components/IconButton/IconButton.js";
+import { default as h } from "./components/BackgroundIconButton/BackgroundIconButton.js";
+import { default as H } from "./components/Interaction/Interaction.js";
+import { Field as w, FieldControl as E, FieldErrorMessage as G, FieldLabel as P, FieldMessage as j } from "./components/Field/Field.js";
+import { FieldGroup as z, FieldLegend as J, Fieldset as K, FieldsetContent as N } from "./components/Fieldset/Fieldset.js";
+import { default as Q } from "./components/Checkbox/Checkbox.js";
+import { default as V } from "./components/CheckMark/CheckMark.js";
+import { default as X } from "./components/Radio/Radio.js";
+import { default as Z } from "./components/Switch/Switch.js";
+import { default as $ } from "./components/TextInput/TextInput.js";
+import { default as eo } from "./components/TextInput/TextInputContent.js";
+import { default as ro } from "./components/TextArea/TextArea.js";
+import { default as lo } from "./components/TextArea/TextAreaContent.js";
+import { default as fo } from "./components/Select/Select.js";
+import { default as uo } from "./components/Select/SelectContent.js";
+import { MenuContent as co, MenuItem as xo, MenuRoot as mo, MenuSeparator as so, MenuTrigger as Ao } from "./components/Menu/Menu.js";
+import { default as Co, AlertAction as Mo, AlertActionArea as Bo, AlertContent as To, AlertDescription as Fo, AlertHeading as yo, AlertRoot as Io } from "./components/Alert/Alert.js";
+import { default as So, AccordionContent as ko, AccordionDescription as Ro, AccordionDetails as Do, AccordionItem as ho, AccordionSummary as vo } from "./components/Accordion/Accordion.js";
+import { default as bo, ModalBody as wo, ModalClose as Eo, ModalContent as Go, ModalFooter as Po, ModalHeader as jo, ModalRoot as qo, ModalTrigger as zo } from "./components/Modal/Modal.js";
+import { TooltipContent as Ko, TooltipProvider as No, TooltipRoot as Oo, TooltipTrigger as Qo } from "./components/Tooltip/Tooltip.js";
+import { ScrollArea as Vo, ScrollAreaContainer as Wo } from "./components/ScrollArea/ScrollArea.js";
+import { getBreakpoint as Yo, getBreakpoints as Zo } from "./utils/breakpoints.js";
+import { SvgIcon as $o } from "@orioncactuscorp/icons";
 export {
-  To as Accordion,
-  Bo as AccordionContent,
-  Fo as AccordionDescription,
-  Io as AccordionDetails,
-  So as AccordionItem,
-  ko as AccordionSummary,
-  d as ActionArea,
-  n as ActionAreaButton,
-  xo as Alert,
-  mo as AlertAction,
-  so as AlertActionArea,
-  co as AlertContent,
-  Ao as AlertDescription,
-  go as AlertHeading,
-  Co as AlertRoot,
-  u as Background,
-  S as BackgroundIconButton,
-  p as Badge,
+  So as Accordion,
+  ko as AccordionContent,
+  Ro as AccordionDescription,
+  Do as AccordionDetails,
+  ho as AccordionItem,
+  vo as AccordionSummary,
+  n as ActionArea,
+  d as ActionAreaButton,
+  i as ActionAreaLayout,
+  u as ActionAreaLayoutActionArea,
+  p as ActionAreaLayoutBody,
+  c as ActionAreaLayoutFooter,
+  x as ActionAreaLayoutRoot,
+  Co as Alert,
+  Mo as AlertAction,
+  Bo as AlertActionArea,
+  To as AlertContent,
+  Fo as AlertDescription,
+  yo as AlertHeading,
+  Io as AlertRoot,
+  g as Background,
+  h as BackgroundIconButton,
+  s as Badge,
   a as Button,
-  g as Cell,
-  C as CellItem,
-  J as CheckMark,
-  q as Checkbox,
-  m as Divider,
-  h as Field,
-  v as FieldControl,
-  H as FieldErrorMessage,
-  w as FieldGroup,
-  L as FieldLabel,
-  E as FieldLegend,
-  b as FieldMessage,
-  G as Fieldset,
-  P as FieldsetContent,
-  F as IconButton,
-  R as Interaction,
-  c as Loading,
-  lo as MenuContent,
-  no as MenuItem,
-  fo as MenuRoot,
-  po as MenuSeparator,
-  io as MenuTrigger,
-  Do as Modal,
-  ho as ModalBody,
-  vo as ModalClose,
-  Ho as ModalContent,
-  Lo as ModalFooter,
-  bo as ModalHeader,
-  yo as ModalRoot,
-  wo as ModalTrigger,
-  N as Radio,
-  Jo as ScrollArea,
-  Ko as ScrollAreaContainer,
+  y as Cell,
+  I as CellItem,
+  V as CheckMark,
+  Q as Checkbox,
+  M as Divider,
+  w as Field,
+  E as FieldControl,
+  G as FieldErrorMessage,
+  z as FieldGroup,
+  P as FieldLabel,
+  J as FieldLegend,
+  j as FieldMessage,
+  K as Fieldset,
+  N as FieldsetContent,
+  R as IconButton,
+  H as Interaction,
+  T as Loading,
+  co as MenuContent,
+  xo as MenuItem,
+  mo as MenuRoot,
+  so as MenuSeparator,
+  Ao as MenuTrigger,
+  bo as Modal,
+  wo as ModalBody,
+  Eo as ModalClose,
+  Go as ModalContent,
+  Po as ModalFooter,
+  jo as ModalHeader,
+  qo as ModalRoot,
+  zo as ModalTrigger,
+  X as Radio,
+  Vo as ScrollArea,
+  Wo as ScrollAreaContainer,
   t as SectionHeader,
-  eo as Select,
-  ro as SelectContent,
-  Vo as SvgIcon,
-  Q as Switch,
-  Z as TextArea,
-  $ as TextAreaContent,
-  T as TextButton,
-  V as TextInput,
-  X as TextInputContent,
-  Go as TooltipContent,
-  Po as TooltipProvider,
-  jo as TooltipRoot,
-  qo as TooltipTrigger,
-  Oo as getBreakpoint,
-  Qo as getBreakpoints
+  fo as Select,
+  uo as SelectContent,
+  $o as SvgIcon,
+  Z as Switch,
+  ro as TextArea,
+  lo as TextAreaContent,
+  S as TextButton,
+  $ as TextInput,
+  eo as TextInputContent,
+  Ko as TooltipContent,
+  No as TooltipProvider,
+  Oo as TooltipRoot,
+  Qo as TooltipTrigger,
+  Yo as getBreakpoint,
+  Zo as getBreakpoints
 };