impact-nova 2.2.1 → 2.2.3

package/dist/components/feedback/popover/popover.js

@@ -1,48 +1,51 @@
-import { jsx as e, jsxs as p } from "react/jsx-runtime";
-import * as d from "react";
+import { jsx as e, jsxs as l } from "react/jsx-runtime";
+import * as p from "react";
 import * as a from "@radix-ui/react-popover";
-import { Cross as f } from "impact-nova-icons";
-import { Tooltip as h, TooltipTrigger as g, TooltipContent as y } from "../tooltip/tooltip.js";
-import { wrapRadixPart as l, createCompoundPart as u } from "../../../lib/primitives/create-compound.js";
+import { Cross as N } from "impact-nova-icons";
+import { Tooltip as g, TooltipTrigger as u, TooltipContent as P } from "../tooltip/tooltip.js";
+import { wrapRadixPart as d, createCompoundPart as x } from "../../../lib/primitives/create-compound.js";
 import { cn as n } from "../../../lib/utils.js";
-import { useImpactNovaI18n as c } from "../../../i18n/use-impact-nova-i18n.js";
-const B = (o) => /* @__PURE__ */ e(
+import { useImpactNovaI18n as m } from "../../../i18n/use-impact-nova-i18n.js";
+import { useOverlayNestedLayerDismiss as C, useOverlayPortalContainer as b } from "../../../lib/overlay/overlay-portal-context.js";
+import { OVERLAY_NESTED_FLOATING_INSTANT_HIDE_CLASS as T } from "../../../lib/overlay/overlay-host.constants.js";
+const H = (o) => (C(o.open, o.onOpenChange), /* @__PURE__ */ e(
   a.Root,
   {
     "data-component": "popover",
     modal: !1,
     ...o
   }
-), F = l(
+)), B = d(
   "popover",
   "trigger",
   "PopoverTrigger",
   a.Trigger
-), H = l(
+), k = d(
   "popover",
   "anchor",
   "PopoverAnchor",
   a.Anchor
-), P = d.forwardRef(({ className: o, align: t = "center", sideOffset: i = 4, "aria-label": s, ...r }, m) => {
-  const { t: v } = c();
-  return /* @__PURE__ */ e(a.Portal, { children: /* @__PURE__ */ e(
+), w = p.forwardRef(({ className: o, align: t = "center", sideOffset: i = 4, container: s, "aria-label": r, ...c }, v) => {
+  const { t: f } = m(), y = b(), h = s ?? y;
+  return /* @__PURE__ */ e(a.Portal, { container: h, children: /* @__PURE__ */ e(
     a.Content,
     {
-      ref: m,
+      ref: v,
       align: t,
       sideOffset: i,
-      "aria-label": s ?? v("aria.popover"),
+      "aria-label": r ?? f("aria.popover"),
       "data-component": "popover-content",
       className: n(
         "z-50 min-w-[240px] rounded-xl border bg-canvas-overlay p-3 text-canvas-overlay-foreground shadow-md outline-none overflow-hidden data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-popover-content-transform-origin] pointer-events-auto motion-reduce:animate-none motion-reduce:transition-none",
+        T,
         o
       ),
-      ...r
+      ...c
     }
   ) });
 });
-P.displayName = a.Content.displayName;
-const x = ({
+w.displayName = a.Content.displayName;
+const A = ({
   className: o,
   ...t
 }) => /* @__PURE__ */ e(
@@ -52,8 +55,8 @@ const x = ({
     ...t
   }
 );
-x.displayName = "PopoverHeader";
-const N = ({
+A.displayName = "PopoverHeader";
+const R = ({
   className: o,
   ...t
 }) => /* @__PURE__ */ e(
@@ -67,15 +70,15 @@ const N = ({
     ...t
   }
 );
-N.displayName = "PopoverTitle";
-const I = u("popover", {
+R.displayName = "PopoverTitle";
+const G = x("popover", {
   part: "body",
   displayName: "PopoverBody",
   className: "text-sm"
-}), b = d.forwardRef(({ className: o, ...t }, i) => {
-  const { t: s } = c(), r = s("aria.close");
-  return /* @__PURE__ */ p(h, { children: [
-    /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ p(
+}), I = p.forwardRef(({ className: o, ...t }, i) => {
+  const { t: s } = m(), r = s("aria.close");
+  return /* @__PURE__ */ l(g, { children: [
+    /* @__PURE__ */ e(u, { asChild: !0, children: /* @__PURE__ */ l(
       a.Close,
       {
         ref: i,
@@ -87,31 +90,31 @@ const I = u("popover", {
         "aria-label": r,
         ...t,
         children: [
-          /* @__PURE__ */ e(f, { className: "!h-3 !w-3 text-content-tertiary" }),
+          /* @__PURE__ */ e(N, { className: "!h-3 !w-3 text-content-tertiary" }),
           /* @__PURE__ */ e("span", { className: "sr-only", children: r })
         ]
       }
     ) }),
-    /* @__PURE__ */ e(y, { variant: "tertiary", side: "top", children: r })
+    /* @__PURE__ */ e(P, { variant: "tertiary", side: "top", children: r })
   ] });
 });
-b.displayName = a.Close.displayName;
-const C = ({
+I.displayName = a.Close.displayName;
+const L = ({
   className: o,
   ...t
-}) => /* @__PURE__ */ p("div", { className: n("mt-4 flex flex-col gap-3", o), ...t, children: [
+}) => /* @__PURE__ */ l("div", { className: n("mt-4 flex flex-col gap-3", o), ...t, children: [
   /* @__PURE__ */ e("div", { className: "h-[1px] w-full bg-stroke-hairline" }),
   /* @__PURE__ */ e("div", { className: "flex justify-end gap-2", children: t.children })
 ] });
-C.displayName = "PopoverFooter";
+L.displayName = "PopoverFooter";
 export {
-  B as Popover,
-  H as PopoverAnchor,
-  I as PopoverBody,
-  b as PopoverClose,
-  P as PopoverContent,
-  C as PopoverFooter,
-  x as PopoverHeader,
-  N as PopoverTitle,
-  F as PopoverTrigger
+  H as Popover,
+  k as PopoverAnchor,
+  G as PopoverBody,
+  I as PopoverClose,
+  w as PopoverContent,
+  L as PopoverFooter,
+  A as PopoverHeader,
+  R as PopoverTitle,
+  B as PopoverTrigger
 };

package/dist/components/feedback/sheet/sheet.js

@@ -1,170 +1,217 @@
-import { jsx as e, jsxs as a } from "react/jsx-runtime";
+import { jsx as e, jsxs as m } from "react/jsx-runtime";
 import * as p from "react";
-import * as t from "@radix-ui/react-dialog";
-import { ChevronRight as y, Cross as k } from "impact-nova-icons";
-import { createCompoundPart as S, wrapRadixPart as h } from "../../../lib/primitives/create-compound.js";
-import { cn as x } from "../../../lib/utils.js";
-import { useImpactNovaI18n as w } from "../../../i18n/use-impact-nova-i18n.js";
-import { Tooltip as b, TooltipTrigger as v, TooltipContent as N } from "../tooltip/tooltip.js";
-import { SheetContext as C } from "./sheet-context.js";
-import { sheetVariants as P } from "./sheet.variants.js";
-const V = (o) => /* @__PURE__ */ e(t.Root, { "data-component": "sheet", ...o }), q = h(
+import * as n from "@radix-ui/react-dialog";
+import { ChevronRight as v, Cross as L } from "impact-nova-icons";
+import { createCompoundPart as b, wrapRadixPart as y } from "../../../lib/primitives/create-compound.js";
+import { cn as g } from "../../../lib/utils.js";
+import { useImpactNovaI18n as R } from "../../../i18n/use-impact-nova-i18n.js";
+import { Tooltip as N, TooltipTrigger as C, TooltipContent as S } from "../tooltip/tooltip.js";
+import { mergeElementRefs as E } from "../../../lib/overlay/merge-element-refs.js";
+import { OverlayHostProvider as k, useOverlayHostDismissBeforeClose as x, useOverlayHostNestedDismissing as B } from "../../../lib/overlay/overlay-portal-context.js";
+import { OVERLAY_HOST_GROUP_CLASS as j } from "../../../lib/overlay/overlay-host.constants.js";
+import { useOverlayPortalContainerState as z } from "../../../lib/overlay/use-overlay-portal-container-state.js";
+import { SheetContext as T } from "./sheet-context.js";
+import { sheetVariants as A } from "./sheet.variants.js";
+const ee = (t) => /* @__PURE__ */ e(n.Root, { "data-component": "sheet", ...t }), te = y(
   "sheet",
   "trigger",
   "SheetTrigger",
-  t.Trigger
-), R = h(
+  n.Trigger
+), F = y(
   "sheet",
   "close",
   "SheetClose",
-  t.Close
-), D = t.Portal, T = p.forwardRef(({ className: o, ...r }, i) => /* @__PURE__ */ e(
-  t.Overlay,
-  {
-    className: x(
-      "fixed inset-0 z-50 bg-scrim  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 motion-reduce:animate-none motion-reduce:transition-none",
-      o
-    ),
-    ...r,
-    ref: i
+  n.Close
+), I = n.Portal, P = p.forwardRef(({ className: t, onPointerDown: i, ...l }, a) => {
+  const o = x();
+  return /* @__PURE__ */ e(
+    n.Overlay,
+    {
+      className: g(
+        "fixed inset-0 z-50 bg-scrim  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 motion-reduce:animate-none motion-reduce:transition-none",
+        t
+      ),
+      onPointerDown: (c) => {
+        o(), i?.(c);
+      },
+      ...l,
+      ref: a
+    }
+  );
+});
+P.displayName = n.Overlay.displayName;
+const D = p.forwardRef(
+  ({
+    side: t,
+    isExpanded: i,
+    setPortalContainerElement: l,
+    className: a,
+    children: o,
+    onOpenAutoFocus: c,
+    onEscapeKeyDown: h,
+    ...f
+  }, u) => {
+    const r = B(), d = x();
+    return /* @__PURE__ */ e(
+      n.Content,
+      {
+        ref: E(u, l),
+        "data-component": "sheet-content",
+        "data-overlay-host": "",
+        "data-nested-dismissing": r || void 0,
+        onOpenAutoFocus: (s) => {
+          s.preventDefault(), c?.(s);
+        },
+        onEscapeKeyDown: (s) => {
+          d(), h?.(s);
+        },
+        className: g(
+          A({ side: t }),
+          j,
+          "flex flex-col p-0 transition-all duration-300 motion-reduce:transition-none",
+          t === "bottom" && (i ? "h-[96vh]" : "h-[40vh]"),
+          a
+        ),
+        ...f,
+        children: o
+      }
+    );
   }
-));
-T.displayName = t.Overlay.displayName;
-const E = p.forwardRef(
+);
+D.displayName = "SheetHostContent";
+const _ = p.forwardRef(
   ({
-    side: o = "right",
-    className: r,
-    children: i,
-    expandable: l = !1,
-    defaultExpanded: n = !1,
-    onOpenAutoFocus: f,
-    ...u
-  }, g) => {
-    const [s, c] = p.useState(n), d = p.useCallback(() => {
-      c((m) => !m);
+    side: t = "right",
+    className: i,
+    children: l,
+    expandable: a = !1,
+    defaultExpanded: o = !1,
+    onOpenAutoFocus: c,
+    onEscapeKeyDown: h,
+    ...f
+  }, u) => {
+    const [r, d] = p.useState(o), { portalContainer: s, setPortalContainerElement: H } = z(), O = p.useCallback(() => {
+      d((w) => !w);
     }, []);
     return /* @__PURE__ */ e(
-      C.Provider,
+      T.Provider,
       {
         value: {
-          isExpanded: s,
-          onExpandToggle: d,
-          expandable: l,
-          side: o || void 0
+          isExpanded: r,
+          onExpandToggle: O,
+          expandable: a,
+          side: t || void 0
         },
-        children: /* @__PURE__ */ a(D, { children: [
-          /* @__PURE__ */ e(T, {}),
+        children: /* @__PURE__ */ e(I, { children: /* @__PURE__ */ m(k, { portalContainer: s, children: [
+          /* @__PURE__ */ e(P, {}),
           /* @__PURE__ */ e(
-            t.Content,
+            D,
             {
-              ref: g,
-              "data-component": "sheet-content",
-              onOpenAutoFocus: (m) => {
-                m.preventDefault(), f?.(m);
-              },
-              className: x(
-                P({ side: o }),
-                "flex flex-col p-0 transition-all duration-300 motion-reduce:transition-none",
-                o === "bottom" && (s ? "h-[96vh]" : "h-[40vh]"),
-                r
-              ),
-              ...u,
-              children: i
+              ref: u,
+              side: t,
+              isExpanded: r,
+              setPortalContainerElement: H,
+              className: i,
+              onOpenAutoFocus: c,
+              onEscapeKeyDown: h,
+              ...f,
+              children: l
             }
           )
-        ] })
+        ] }) })
       }
     );
   }
 );
-E.displayName = t.Content.displayName;
-const L = ({
-  className: o,
-  children: r,
-  ...i
+_.displayName = n.Content.displayName;
+const V = ({
+  className: t,
+  children: i,
+  ...l
 }) => {
-  const { t: l } = w(), { isExpanded: n, onExpandToggle: f, expandable: u, side: g } = p.useContext(C), s = l("aria.close"), c = l("nestedList.expand"), d = l("nestedList.collapse");
-  return /* @__PURE__ */ a(
+  const { t: a } = R(), { isExpanded: o, onExpandToggle: c, expandable: h, side: f } = p.useContext(T), u = x(), r = a("aria.close"), d = a("nestedList.expand"), s = a("nestedList.collapse");
+  return /* @__PURE__ */ m(
     "div",
     {
-      className: x(
+      className: g(
         "flex shrink-0 items-center justify-between border-b bg-brand-tint px-4 py-4",
-        g === "bottom" && "rounded-t-lg",
-        o
+        f === "bottom" && "rounded-t-lg",
+        t
       ),
-      ...i,
+      ...l,
       children: [
-        /* @__PURE__ */ e("div", { className: "flex flex-col space-y-1 text-center sm:text-start", children: r }),
-        /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
-          u && /* @__PURE__ */ a(b, { children: [
-            /* @__PURE__ */ e(v, { asChild: !0, children: /* @__PURE__ */ a(
+        /* @__PURE__ */ e("div", { className: "flex flex-col space-y-1 text-center sm:text-start", children: i }),
+        /* @__PURE__ */ m("div", { className: "flex items-center gap-2", children: [
+          h && /* @__PURE__ */ m(N, { children: [
+            /* @__PURE__ */ e(C, { asChild: !0, children: /* @__PURE__ */ m(
               "button",
               {
                 type: "button",
                 "data-component": "sheet-expand-toggle",
-                onClick: f,
+                onClick: c,
                 className: "rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none",
-                "aria-label": n ? d : c,
+                "aria-label": o ? s : d,
                 children: [
-                  n ? /* @__PURE__ */ e(y, { size: 19, className: " -rotate-90" }) : /* @__PURE__ */ e(y, { size: 19, className: "rotate-90" }),
-                  /* @__PURE__ */ e("span", { className: "sr-only", children: n ? d : c })
+                  o ? /* @__PURE__ */ e(v, { size: 19, className: " -rotate-90" }) : /* @__PURE__ */ e(v, { size: 19, className: "rotate-90" }),
+                  /* @__PURE__ */ e("span", { className: "sr-only", children: o ? s : d })
                 ]
               }
             ) }),
-            /* @__PURE__ */ e(N, { variant: "tertiary", side: "top", children: n ? d : c })
+            /* @__PURE__ */ e(S, { variant: "tertiary", side: "top", children: o ? s : d })
           ] }),
-          /* @__PURE__ */ a(b, { children: [
-            /* @__PURE__ */ e(v, { asChild: !0, children: /* @__PURE__ */ a(
-              R,
+          /* @__PURE__ */ m(N, { children: [
+            /* @__PURE__ */ e(C, { asChild: !0, children: /* @__PURE__ */ m(
+              F,
               {
                 "data-component": "sheet-close",
                 className: "rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
-                "aria-label": s,
+                "aria-label": r,
+                onPointerDown: () => u(),
                 children: [
-                  /* @__PURE__ */ e(k, { className: "!h-3 !w-3" }),
-                  /* @__PURE__ */ e("span", { className: "sr-only", children: s })
+                  /* @__PURE__ */ e(L, { className: "!h-3 !w-3" }),
+                  /* @__PURE__ */ e("span", { className: "sr-only", children: r })
                 ]
               }
             ) }),
-            /* @__PURE__ */ e(N, { variant: "tertiary", side: "top", children: s })
+            /* @__PURE__ */ e(S, { variant: "tertiary", side: "top", children: r })
           ] })
         ] })
       ]
     }
   );
 };
-L.displayName = "SheetHeader";
-const G = S("sheet", {
+V.displayName = "SheetHeader";
+const oe = b("sheet", {
   part: "body",
   displayName: "SheetBody",
   className: "flex-1 overflow-y-auto p-4"
-}), J = S("sheet", {
+}), se = b("sheet", {
   part: "footer",
   displayName: "SheetFooter",
   className: "mt-auto flex shrink-0 items-center justify-end gap-2 border-t bg-canvas-elevated px-4 py-3"
-}), K = h(
+}), ne = y(
   "sheet",
   "title",
   "SheetTitle",
-  t.Title,
+  n.Title,
   "text-sm font-bold leading-none tracking-tight"
-), M = h(
+), ae = y(
   "sheet",
   "description",
   "SheetDescription",
-  t.Description,
+  n.Description,
   "text-sm text-content-secondary"
 );
 export {
-  V as Sheet,
-  G as SheetBody,
-  R as SheetClose,
-  E as SheetContent,
-  M as SheetDescription,
-  J as SheetFooter,
-  L as SheetHeader,
-  T as SheetOverlay,
-  D as SheetPortal,
-  K as SheetTitle,
-  q as SheetTrigger
+  ee as Sheet,
+  oe as SheetBody,
+  F as SheetClose,
+  _ as SheetContent,
+  ae as SheetDescription,
+  se as SheetFooter,
+  V as SheetHeader,
+  P as SheetOverlay,
+  I as SheetPortal,
+  ne as SheetTitle,
+  te as SheetTrigger
 };

package/dist/components/feedback/tooltip/tab-tooltip-render.js

@@ -1,7 +1,6 @@
 import { jsxs as t, jsx as e } from "react/jsx-runtime";
 import { Tooltip as l, TooltipTrigger as n, TooltipContent as o } from "./tooltip.js";
-import "react";
-const p = (i, r, a) => /* @__PURE__ */ t(l, { children: [
+const d = (i, r, a) => /* @__PURE__ */ t(l, { children: [
   /* @__PURE__ */ e(n, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "inline-flex items-center justify-center h-full w-full", children: i }) }),
   /* @__PURE__ */ e(o, { variant: "tertiary", className: a, children: r })
 ] }), h = (i, r) => /* @__PURE__ */ t(l, { children: [
@@ -10,5 +9,5 @@ const p = (i, r, a) => /* @__PURE__ */ t(l, { children: [
 ] });
 export {
   h as defaultAccordionTooltipRender,
-  p as defaultTabTooltipRender
+  d as defaultTabTooltipRender
 };