@orioncactuscorp/ui 1.13.0 → 1.15.0

package/dist/components/internal/ModalPresentation.js

@@ -0,0 +1,361 @@
+'use client';
+import { jsx as t, jsxs as g } from "react/jsx-runtime";
+import { useCallback as B, useEffect as Z, useId as _, useState as aa } from "react";
+import { Dialog as ea } from "@base-ui-components/react/dialog";
+import { MotionExpand as oa } from "../../react/motion.js";
+import { mergeRefs as ta } from "../../utils/mergeRefs.js";
+import na from "../Background/Background.js";
+import ra from "../Interaction/Interaction.js";
+import { ScrollArea as z, ScrollAreaContainer as F } from "../ScrollArea/ScrollArea.js";
+import { DisclosureIndicator as ia } from "./DisclosureIndicator.js";
+import { normalizeSlotIcon as la } from "./slot.js";
+import e from "../Modal/Modal.module.scss.js";
+import { getModalScrollState as ca } from "../Modal/modalScrollArbitration.js";
+import { useControllableState as da } from "../Modal/useControllableState.js";
+import { useMeasuredElement as sa } from "../Modal/useElementSize.js";
+function d(...a) {
+  return a.filter(Boolean).join(" ");
+}
+function C(a) {
+  return a != null && a !== !1 && a !== "";
+}
+function xa(a, n) {
+  return a === !0 || a === "auto" && n.canScroll && !n.scrolledToBottom;
+}
+function Ba({
+  bodyNode: a,
+  bodyRef: n,
+  setBodyNode: i,
+  setScrollState: l
+}) {
+  const r = B(
+    (o) => {
+      l(ca(o));
+    },
+    [l]
+  ), m = B(
+    (o) => {
+      ta(i, n, r)(o);
+    },
+    [n, i, r]
+  );
+  return Z(() => {
+    const o = a;
+    if (!o || (r(o), typeof ResizeObserver > "u")) return;
+    const s = new ResizeObserver(() => r(o));
+    return s.observe(o), o.firstElementChild && s.observe(o.firstElementChild), () => s.disconnect();
+  }, [a, r]), { setBodyRef: m, updateScrollState: r };
+}
+function za({
+  children: a,
+  className: n,
+  contentTransition: i,
+  placement: l,
+  ref: r,
+  resize: m,
+  scrollable: o,
+  size: s,
+  style: p,
+  variant: u
+}) {
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      ref: r,
+      className: d(e.surface, e[m], n),
+      "data-oc-part": "surface",
+      "data-oc-variant": u,
+      "data-oc-size": s,
+      "data-oc-resize": m,
+      "data-oc-content-transition": i,
+      "data-oc-modal-placement": l,
+      "data-oc-scrollable": o ? "true" : "false",
+      style: p,
+      children: a
+    }
+  );
+}
+function Fa({
+  bottomSlot: a,
+  children: n,
+  className: i = "",
+  closeContent: l,
+  dragEnabled: r,
+  handleContent: m,
+  leadingContent: o,
+  sticky: s,
+  titleContent: p,
+  trailingContent: u,
+  ...h
+}) {
+  const v = C(o), N = C(a);
+  return /* @__PURE__ */ g(
+    na,
+    {
+      ...h,
+      as: "header",
+      backdrop: "compact",
+      className: d(e.header, i),
+      backColor: "var(--oc-color-theme-background-elevated-normal)",
+      frontColor: "transparent",
+      "data-oc-part": "header",
+      "data-oc-component": "modal-header",
+      variant: "strong",
+      "data-oc-draggable": r === void 0 ? void 0 : String(r),
+      "data-oc-sticky": s ? "true" : "false",
+      children: [
+        m,
+        /* @__PURE__ */ g(
+          "div",
+          {
+            className: e.headerInner,
+            "data-oc-has-leading": v ? "true" : "false",
+            "data-oc-part": "header-inner",
+            children: [
+              v ? /* @__PURE__ */ t("div", { className: e.headerLeading, "data-oc-part": "header-leading", children: o }) : null,
+              /* @__PURE__ */ t("div", { className: e.headerTitle, "data-oc-part": "header-title", children: p ?? n }),
+              /* @__PURE__ */ g("div", { className: e.headerTrailing, "data-oc-part": "header-trailing", children: [
+                u,
+                l
+              ] })
+            ]
+          }
+        ),
+        N ? /* @__PURE__ */ t("div", { className: e.headerBottom, "data-oc-part": "header-bottom", children: a }) : null
+      ]
+    }
+  );
+}
+function Pa({
+  className: a = "",
+  title: n,
+  children: i,
+  expanded: l,
+  defaultExpanded: r = !0,
+  onExpandedChange: m,
+  disabled: o = !1,
+  forceMount: s = !0,
+  headingLevel: p = 2,
+  indicator: u,
+  titleAsDialogTitle: h = !0,
+  navigationProps: v,
+  panelProps: N,
+  panelContentProps: P,
+  ref: T,
+  style: S,
+  canRenderHandle: R,
+  handleProps: M,
+  onPanelMotionStateChange: E,
+  ...H
+}) {
+  const { height: y, setNode: $ } = sa(), b = _(), [c, j] = da({
+    value: l,
+    defaultValue: r,
+    onChange: m
+  }), [D, L] = aa(
+    c ? "open" : "closed"
+  ), O = `h${p >= 2 && p <= 6 ? p : 2}`, {
+    className: w = "",
+    id: A,
+    onClick: V,
+    ...I
+  } = v ?? {}, {
+    className: q = "",
+    id: G,
+    role: J,
+    ...K
+  } = N ?? {}, { className: Q = "", ...U } = P ?? {}, k = A ?? `${b}-navigation`, x = G ?? `${b}-panel`, W = `${b}-dialog-title`, X = C(n), Y = y > 0 ? {
+    ...S,
+    "--oc-modal-navigation-block-size": `${y}px`
+  } : S;
+  return /* @__PURE__ */ g(
+    "section",
+    {
+      ref: T,
+      className: d(e.navigationSection, a),
+      style: Y,
+      ...H,
+      "data-oc-component": "modal-navigation-section",
+      "data-oc-motion-state": D,
+      "data-oc-state": c ? "open" : "closed",
+      children: [
+        h && X ? /* @__PURE__ */ t(
+          ea.Title,
+          {
+            className: e.navigationDialogTitle,
+            id: W,
+            children: n
+          }
+        ) : null,
+        R ? /* @__PURE__ */ t(
+          "div",
+          {
+            ...M,
+            "aria-hidden": "true",
+            className: d(e.handle, M?.className),
+            "data-oc-part": "handle"
+          }
+        ) : null,
+        /* @__PURE__ */ t(O, { className: e.navigationHeading, "data-oc-part": "heading", children: /* @__PURE__ */ g(
+          "button",
+          {
+            ...I,
+            ref: $,
+            id: k,
+            className: d(
+              e.navigation,
+              w
+            ),
+            type: "button",
+            disabled: o,
+            "aria-disabled": o ? "true" : I["aria-disabled"],
+            "aria-expanded": c,
+            "aria-controls": x,
+            onClick: (f) => {
+              V?.(f), !(f.defaultPrevented || o) && j(!c);
+            },
+            "data-oc-component": "modal-navigation",
+            "data-oc-part": "navigation",
+            "data-oc-state": c ? "open" : "closed",
+            children: [
+              /* @__PURE__ */ t("span", { className: e.navigationTitle, "data-oc-part": "title", children: n }),
+              u === void 0 ? /* @__PURE__ */ t(
+                ia,
+                {
+                  className: e.navigationIndicator,
+                  open: c
+                }
+              ) : u ? /* @__PURE__ */ t(
+                "span",
+                {
+                  className: e.navigationIndicator,
+                  "data-oc-part": "indicator",
+                  "data-oc-state": c ? "open" : "closed",
+                  children: /* @__PURE__ */ t("span", { "data-oc-part": "indicator-frame", children: la(u) })
+                }
+              ) : null,
+              o ? null : /* @__PURE__ */ t(ra, { variant: "light" })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ t(
+          oa,
+          {
+            className: d(e.navigationPanel, q),
+            open: c,
+            forceMount: s,
+            intent: "expand",
+            measureBlockSize: "rendered",
+            onMotionStateChange: (f) => {
+              L(f), E?.(f);
+            },
+            contentProps: {
+              className: e.navigationPanelFrame,
+              "data-oc-part": "panel-inner"
+            },
+            ...K,
+            "aria-hidden": c ? void 0 : !0,
+            "aria-labelledby": k,
+            id: x,
+            inert: c ? void 0 : !0,
+            role: J ?? "region",
+            "data-oc-component": "modal-navigation-panel",
+            "data-oc-state": c ? "open" : "closed",
+            children: /* @__PURE__ */ t(
+              z,
+              {
+                className: e.navigationPanelScroll,
+                "data-oc-component": "modal-navigation-panel-scroll-area",
+                "data-oc-part": "panel-scroll-area",
+                children: /* @__PURE__ */ t(
+                  F,
+                  {
+                    ...U,
+                    className: d(
+                      e.navigationPanelInner,
+                      Q
+                    ),
+                    "data-oc-component": "modal-navigation-panel-content",
+                    children: i
+                  }
+                )
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+function Ta({
+  bodyContainerProps: a,
+  bodyContentProps: n,
+  children: i,
+  layout: l,
+  scrollAreaProps: r
+}) {
+  return /* @__PURE__ */ t(
+    z,
+    {
+      ...r,
+      className: d(e.body, r?.className),
+      "data-oc-part": "body",
+      "data-oc-component": "modal-body",
+      children: /* @__PURE__ */ t(
+        F,
+        {
+          ...a,
+          className: d(
+            e.bodyContainer,
+            a?.className
+          ),
+          "data-oc-part": "body-container",
+          "data-oc-component": "modal-body-container",
+          children: /* @__PURE__ */ t(
+            "section",
+            {
+              ...n,
+              className: d(
+                e.bodyContent,
+                n?.className
+              ),
+              "data-oc-part": "body-content",
+              "data-oc-component": "modal-body-content",
+              "data-oc-layout": l,
+              children: i
+            }
+          )
+        }
+      )
+    }
+  );
+}
+function Ra({
+  backgroundActive: a,
+  children: n,
+  className: i = "",
+  ...l
+}) {
+  return /* @__PURE__ */ t(
+    "footer",
+    {
+      ...l,
+      className: d(e.footer, i),
+      "data-oc-part": "footer",
+      "data-oc-component": "modal-footer",
+      "data-oc-background": a ? "true" : "false",
+      children: n
+    }
+  );
+}
+export {
+  Ta as ModalBodyFrame,
+  Ra as ModalFooterFrame,
+  Fa as ModalHeaderFrame,
+  Pa as ModalNavigationSectionFrame,
+  za as ModalSurfaceFrame,
+  C as hasRenderableModalContent,
+  d as mergeModalClassName,
+  xa as resolveModalFooterBackground,
+  Ba as useModalBodyScrollState
+};

package/dist/components/internal/OverlayPortalContext.js

@@ -0,0 +1,20 @@
+'use client';
+import { jsx as e } from "react/jsx-runtime";
+import { useContext as n, createContext as a } from "react";
+const t = a(
+  void 0
+);
+function u({
+  children: r,
+  container: o
+}) {
+  return /* @__PURE__ */ e(t.Provider, { value: o, children: r });
+}
+function l(r) {
+  const o = n(t);
+  return r === void 0 ? o : r;
+}
+export {
+  u as OverlayPortalProvider,
+  l as useOverlayPortalContainer
+};

package/dist/index.js

@@ -1,116 +1,139 @@
-import { default as t } from "./components/SectionHeader/SectionHeader.js";
+import { default as e } from "./components/SectionHeader/SectionHeader.js";
 import { default as a } from "./components/Button/Button.js";
-import { default as n, ActionAreaButton as d } from "./components/ActionArea/ActionArea.js";
-import { default as i, ActionAreaLayoutActionArea as u, ActionAreaLayoutBody as p, ActionAreaLayoutFooter as s, ActionAreaLayout as x } from "./components/ActionArea/ActionAreaLayout.js";
-import { default as m } from "./components/Badge/Badge.js";
-import { default as g } from "./components/Background/Background.js";
-import { default as T } from "./components/Divider/Divider.js";
-import { default as B } from "./components/Loading/Loading.js";
-import { default as S } from "./components/Skeleton/Skeleton.js";
-import { default as y, CellItem as I } from "./components/Cell/Cell.js";
-import { default as b } from "./components/TextButton/TextButton.js";
-import { default as v } from "./components/IconButton/IconButton.js";
-import { default as h } from "./components/BackgroundIconButton/BackgroundIconButton.js";
-import { default as P } from "./components/Interaction/Interaction.js";
-import { Field as E, FieldControl as G, FieldErrorMessage as N, FieldLabel as j, FieldMessage as q } from "./components/Field/Field.js";
-import { FieldGroup as J, FieldLegend as K, Fieldset as O, FieldsetContent as Q } from "./components/Fieldset/Fieldset.js";
-import { default as V } from "./components/Checkbox/Checkbox.js";
-import { default as X } from "./components/CheckMark/CheckMark.js";
-import { default as Z } from "./components/Radio/Radio.js";
-import { default as $ } from "./components/Switch/Switch.js";
-import { default as eo } from "./components/TextInput/TextInput.js";
-import { default as ro } from "./components/TextInput/TextInputContent.js";
-import { default as lo } from "./components/TextArea/TextArea.js";
-import { default as fo } from "./components/TextArea/TextAreaContent.js";
-import { default as uo } from "./components/Select/Select.js";
-import { default as so } from "./components/Select/SelectContent.js";
-import { MenuContent as co, MenuItem as mo, MenuRoot as Ao, MenuSeparator as go, MenuTrigger as Mo } from "./components/Menu/Menu.js";
-import { default as Co, AlertAction as Bo, AlertActionArea as Fo, AlertContent as So, AlertDescription as Lo, AlertHeading as yo, AlertRoot as Io } from "./components/Alert/Alert.js";
-import { default as bo, AccordionContent as Ro, AccordionDescription as vo, AccordionDetails as Do, AccordionItem as ho, AccordionSummary as Ho } from "./components/Accordion/Accordion.js";
-import { TabsList as wo, TabsPanel as Eo, TabsRoot as Go, TabsTab as No } from "./components/Tabs/Tabs.js";
-import { default as qo, ModalBody as zo, ModalClose as Jo, ModalContent as Ko, ModalFooter as Oo, ModalHeader as Qo, ModalNavigationSection as Uo, ModalRoot as Vo, ModalTrigger as Wo } from "./components/Modal/Modal.js";
-import { TooltipContent as Yo, TooltipProvider as Zo, TooltipRoot as _o, TooltipTrigger as $o } from "./components/Tooltip/Tooltip.js";
-import { ScrollArea as ee, ScrollAreaContainer as te } from "./components/ScrollArea/ScrollArea.js";
-import { getBreakpoint as ae, getBreakpoints as le } from "./utils/breakpoints.js";
-import { SvgIcon as de } from "@orioncactuscorp/icons";
+import { default as i, PositionSnapHandle as l, PositionSnapPositioner as d, PositionSnapRoot as f } from "./components/PositionSnap/PositionSnap.js";
+import { default as s, ActionAreaButton as u } from "./components/ActionArea/ActionArea.js";
+import { default as m, ActionAreaLayoutActionArea as c, ActionAreaLayoutBody as A, ActionAreaLayoutFooter as g, ActionAreaLayout as F } from "./components/ActionArea/ActionAreaLayout.js";
+import { default as T } from "./components/Badge/Badge.js";
+import { default as S } from "./components/Background/Background.js";
+import { default as W } from "./components/Divider/Divider.js";
+import { default as y } from "./components/Loading/Loading.js";
+import { default as L } from "./components/ProgressIndicator/ProgressIndicator.js";
+import { default as k } from "./components/Skeleton/Skeleton.js";
+import { default as b, CellItem as D } from "./components/Cell/Cell.js";
+import { default as v } from "./components/TextButton/TextButton.js";
+import { default as N } from "./components/IconButton/IconButton.js";
+import { default as G } from "./components/BackgroundIconButton/BackgroundIconButton.js";
+import { default as q } from "./components/Interaction/Interaction.js";
+import { Field as J, FieldControl as K, FieldErrorMessage as O, FieldLabel as Q, FieldMessage as U } from "./components/Field/Field.js";
+import { FieldGroup as X, FieldLegend as Y, Fieldset as Z, FieldsetContent as _ } from "./components/Fieldset/Fieldset.js";
+import { default as oo } from "./components/Checkbox/Checkbox.js";
+import { default as eo } from "./components/CheckMark/CheckMark.js";
+import { default as ao } from "./components/Radio/Radio.js";
+import { default as io } from "./components/Switch/Switch.js";
+import { default as fo } from "./components/TextInput/TextInput.js";
+import { default as so } from "./components/TextInput/TextInputContent.js";
+import { default as xo } from "./components/TextArea/TextArea.js";
+import { default as co } from "./components/TextArea/TextAreaContent.js";
+import { default as go } from "./components/Select/Select.js";
+import { default as Mo } from "./components/Select/SelectContent.js";
+import { MenuContent as Co, MenuItem as So, MenuRoot as wo, MenuSeparator as Wo, MenuTrigger as Bo } from "./components/Menu/Menu.js";
+import { default as Io, FloatingWindowBody as Lo, FloatingWindowClose as Ro, FloatingWindowContent as ko, FloatingWindowDescription as Po, FloatingWindowDragHandle as bo, FloatingWindowFooter as Do, FloatingWindowHeader as Ho, FloatingWindowNavigationSection as vo, FloatingWindowRoot as ho, FloatingWindowTitle as No, FloatingWindowTrigger as Eo, ModalWindowRoot as Go } from "./components/FloatingWindow/FloatingWindow.js";
+import { FloatingWindowManager as qo } from "./components/FloatingWindow/FloatingWindowManager.js";
+import { default as Jo, AlertAction as Ko, AlertActionArea as Oo, AlertContent as Qo, AlertDescription as Uo, AlertHeading as Vo, AlertRoot as Xo } from "./components/Alert/Alert.js";
+import { default as Zo, AccordionContent as _o, AccordionDescription as $o, AccordionDetails as ot, AccordionItem as tt, AccordionSummary as et } from "./components/Accordion/Accordion.js";
+import { TabsList as at, TabsPanel as nt, TabsRoot as it, TabsTab as lt } from "./components/Tabs/Tabs.js";
+import { default as ft, ModalBody as pt, ModalClose as st, ModalContent as ut, ModalFooter as xt, ModalHeader as mt, ModalNavigationSection as ct, ModalRoot as At, ModalTrigger as gt } from "./components/Modal/Modal.js";
+import { TooltipContent as Mt, TooltipProvider as Tt, TooltipRoot as Ct, TooltipTrigger as St } from "./components/Tooltip/Tooltip.js";
+import { ScrollArea as Wt, ScrollAreaContainer as Bt } from "./components/ScrollArea/ScrollArea.js";
+import { getBreakpoint as It, getBreakpoints as Lt } from "./utils/breakpoints.js";
+import { SvgIcon as kt } from "@orioncactuscorp/icons";
 export {
-  bo as Accordion,
-  Ro as AccordionContent,
-  vo as AccordionDescription,
-  Do as AccordionDetails,
-  ho as AccordionItem,
-  Ho as AccordionSummary,
-  n as ActionArea,
-  d as ActionAreaButton,
-  i as ActionAreaLayout,
-  u as ActionAreaLayoutActionArea,
-  p as ActionAreaLayoutBody,
-  s as ActionAreaLayoutFooter,
-  x as ActionAreaLayoutRoot,
-  Co as Alert,
-  Bo as AlertAction,
-  Fo as AlertActionArea,
-  So as AlertContent,
-  Lo as AlertDescription,
-  yo as AlertHeading,
-  Io as AlertRoot,
-  g as Background,
-  h as BackgroundIconButton,
-  m as Badge,
+  Zo as Accordion,
+  _o as AccordionContent,
+  $o as AccordionDescription,
+  ot as AccordionDetails,
+  tt as AccordionItem,
+  et as AccordionSummary,
+  s as ActionArea,
+  u as ActionAreaButton,
+  m as ActionAreaLayout,
+  c as ActionAreaLayoutActionArea,
+  A as ActionAreaLayoutBody,
+  g as ActionAreaLayoutFooter,
+  F as ActionAreaLayoutRoot,
+  Jo as Alert,
+  Ko as AlertAction,
+  Oo as AlertActionArea,
+  Qo as AlertContent,
+  Uo as AlertDescription,
+  Vo as AlertHeading,
+  Xo as AlertRoot,
+  S as Background,
+  G as BackgroundIconButton,
+  T as Badge,
   a as Button,
-  y as Cell,
-  I as CellItem,
-  X as CheckMark,
-  V as Checkbox,
-  T as Divider,
-  E as Field,
-  G as FieldControl,
-  N as FieldErrorMessage,
-  J as FieldGroup,
-  j as FieldLabel,
-  K as FieldLegend,
-  q as FieldMessage,
-  O as Fieldset,
-  Q as FieldsetContent,
-  v as IconButton,
-  P as Interaction,
-  B as Loading,
-  co as MenuContent,
-  mo as MenuItem,
-  Ao as MenuRoot,
-  go as MenuSeparator,
-  Mo as MenuTrigger,
-  qo as Modal,
-  zo as ModalBody,
-  Jo as ModalClose,
-  Ko as ModalContent,
-  Oo as ModalFooter,
-  Qo as ModalHeader,
-  Uo as ModalNavigationSection,
-  Vo as ModalRoot,
-  Wo as ModalTrigger,
-  Z as Radio,
-  ee as ScrollArea,
-  te as ScrollAreaContainer,
-  t as SectionHeader,
-  uo as Select,
-  so as SelectContent,
-  S as Skeleton,
-  de as SvgIcon,
-  $ as Switch,
-  wo as TabsList,
-  Eo as TabsPanel,
-  Go as TabsRoot,
-  No as TabsTab,
-  lo as TextArea,
-  fo as TextAreaContent,
-  b as TextButton,
-  eo as TextInput,
-  ro as TextInputContent,
-  Yo as TooltipContent,
-  Zo as TooltipProvider,
-  _o as TooltipRoot,
-  $o as TooltipTrigger,
-  ae as getBreakpoint,
-  le as getBreakpoints
+  b as Cell,
+  D as CellItem,
+  eo as CheckMark,
+  oo as Checkbox,
+  W as Divider,
+  J as Field,
+  K as FieldControl,
+  O as FieldErrorMessage,
+  X as FieldGroup,
+  Q as FieldLabel,
+  Y as FieldLegend,
+  U as FieldMessage,
+  Z as Fieldset,
+  _ as FieldsetContent,
+  Io as FloatingWindow,
+  Lo as FloatingWindowBody,
+  Ro as FloatingWindowClose,
+  ko as FloatingWindowContent,
+  Po as FloatingWindowDescription,
+  bo as FloatingWindowDragHandle,
+  Do as FloatingWindowFooter,
+  Ho as FloatingWindowHeader,
+  qo as FloatingWindowManager,
+  vo as FloatingWindowNavigationSection,
+  ho as FloatingWindowRoot,
+  No as FloatingWindowTitle,
+  Eo as FloatingWindowTrigger,
+  N as IconButton,
+  q as Interaction,
+  y as Loading,
+  Co as MenuContent,
+  So as MenuItem,
+  wo as MenuRoot,
+  Wo as MenuSeparator,
+  Bo as MenuTrigger,
+  ft as Modal,
+  pt as ModalBody,
+  st as ModalClose,
+  ut as ModalContent,
+  xt as ModalFooter,
+  mt as ModalHeader,
+  ct as ModalNavigationSection,
+  At as ModalRoot,
+  gt as ModalTrigger,
+  Go as ModalWindowRoot,
+  i as PositionSnap,
+  l as PositionSnapHandle,
+  d as PositionSnapPositioner,
+  f as PositionSnapRoot,
+  L as ProgressIndicator,
+  ao as Radio,
+  Wt as ScrollArea,
+  Bt as ScrollAreaContainer,
+  e as SectionHeader,
+  go as Select,
+  Mo as SelectContent,
+  k as Skeleton,
+  kt as SvgIcon,
+  io as Switch,
+  at as TabsList,
+  nt as TabsPanel,
+  it as TabsRoot,
+  lt as TabsTab,
+  xo as TextArea,
+  co as TextAreaContent,
+  v as TextButton,
+  fo as TextInput,
+  so as TextInputContent,
+  Mt as TooltipContent,
+  Tt as TooltipProvider,
+  Ct as TooltipRoot,
+  St as TooltipTrigger,
+  It as getBreakpoint,
+  Lt as getBreakpoints
 };