impact-nova 2.2.6 → 2.2.8

package/dist/components/flows/filter-strip/filter-tag-list.js

@@ -1,27 +1,27 @@
-import { jsx as o, jsxs as r } from "react/jsx-runtime";
+import { jsx as o, jsxs as t } from "react/jsx-runtime";
 import * as N from "react";
-import { cn as O } from "../../../lib/utils.js";
+import { cn as k } from "../../../lib/utils.js";
 import { HorizontalScroller as $ } from "../../layout/horizontal-scroller/horizontal-scroller.js";
-import { TagGroup as A } from "../../primitives/tag-group/tag-group.js";
-import { Tag as C } from "../../primitives/tag/tag.js";
-import { Tooltip as k, TooltipTrigger as T, TooltipContent as z } from "../../feedback/tooltip/tooltip.js";
-import { OverflowTooltip as P } from "../../feedback/tooltip/overflow-tooltip.js";
-import { PopoverContent as j, Popover as R, PopoverTrigger as B } from "../../feedback/popover/popover.js";
-import { Button as F } from "../../primitives/button/button.js";
-import { Checkmark as I, Copy as L, Cross as V } from "impact-nova-icons";
-const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px-2 text-xs font-medium font-['Manrope'] cursor-pointer focus:!ring-inset focus:!ring-offset-0 focus:!ring-brand data-[state=open]:!ring-inset data-[state=open]:!ring-offset-0 data-[state=open]:!ring-brand", E = ({
-  remainingValues: a,
-  viewAllTrigger: c = "expand",
-  onViewAll: h,
-  onItemRemove: v,
-  isRemovable: f,
+import { TagGroup as I } from "../../primitives/tag-group/tag-group.js";
+import { Tag as T } from "../../primitives/tag/tag.js";
+import { Tooltip as P, TooltipTrigger as z, TooltipContent as S } from "../../feedback/tooltip/tooltip.js";
+import { OverflowTooltip as R } from "../../feedback/tooltip/overflow-tooltip.js";
+import { PopoverContent as j, Popover as F, PopoverTrigger as V } from "../../feedback/popover/popover.js";
+import { Button as B } from "../../primitives/button/button.js";
+import { Checkmark as L, Copy as E, Cross as M } from "impact-nova-icons";
+const O = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px-2 text-xs font-medium font-['Manrope'] cursor-pointer focus:!ring-inset focus:!ring-offset-0 focus:!ring-brand data-[state=open]:!ring-inset data-[state=open]:!ring-offset-0 data-[state=open]:!ring-brand", A = 3, q = "max-h-[180px] min-h-0 overflow-y-auto", D = "group relative flex shrink-0 min-w-0 items-stretch overflow-hidden rounded px-3 py-2 text-[14px] font-medium leading-[20px] text-foreground hover:bg-secondary", G = ({
+  remainingValues: s,
+  viewAllTrigger: d = "expand",
+  onViewAll: f,
+  onItemRemove: g,
+  isRemovable: x,
   isCopyable: e = !1,
-  externalCopyFunction: m
+  externalCopyFunction: h
 }) => {
-  const [s, g] = N.useState(!1), [n, d] = N.useState(null), x = (t, l, i) => {
-    navigator.clipboard.writeText(String(l)), d(i), t.currentTarget.blur(), setTimeout(() => d(null), 1500);
-  }, b = s ? a : a.slice(0, 3), w = a.length > 3, u = () => {
-    c === "custom" ? h?.() : g(!0);
+  const [a, u] = N.useState(!1), [r, l] = N.useState(null), w = (n, i, c) => {
+    navigator.clipboard.writeText(String(i)), l(c), n.currentTarget.blur(), setTimeout(() => l(null), 1500);
+  }, b = a ? s : s.slice(0, A), y = s.length > A, v = () => {
+    d === "custom" ? f?.() : u(!0);
   };
   return /* @__PURE__ */ o(
     j,
@@ -29,157 +29,165 @@ const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px
       className: "w-[200px] p-0 rounded-[8px] bg-canvas-elevated shadow-elevation-floating border-none",
       align: "start",
       sideOffset: 8,
-      onOpenAutoFocus: (t) => t.preventDefault(),
-      children: /* @__PURE__ */ r("div", { className: "flex flex-col py-2 px-[6px]", children: [
+      "data-component": "filter-popover-content",
+      onOpenAutoFocus: (n) => n.preventDefault(),
+      onCloseAutoFocus: () => {
+        u(!1), l(null);
+      },
+      children: /* @__PURE__ */ t("div", { className: "flex flex-col py-2 px-[6px]", children: [
         /* @__PURE__ */ o(
           "div",
           {
-            className: `flex flex-col gap-1 mb-2 ${s ? "max-h-[180px] overflow-y-auto" : ""}`,
-            children: b.map((t, l) => {
-              const i = String(t), y = !!(e || f);
-              return /* @__PURE__ */ r(
+            className: k(
+              "mb-2",
+              a && q
+            ),
+            tabIndex: a ? 0 : void 0,
+            children: /* @__PURE__ */ o("div", { className: "flex flex-col gap-1", children: b.map((n, i) => {
+              const c = String(n), C = !!(e || x);
+              return /* @__PURE__ */ t(
                 "div",
                 {
-                  className: "group relative shrink-0 overflow-hidden rounded px-3 py-2 text-[14px] font-medium leading-[20px] text-foreground hover:bg-secondary",
+                  className: D,
                   children: [
                     /* @__PURE__ */ o(
-                      P,
+                      R,
                       {
-                        triggerClassName: O(
-                          "block min-w-0 w-full truncate",
-                          y && "pe-0 group-hover:pe-10"
+                        triggerClassName: k(
+                          "block min-w-0 flex-1 self-stretch truncate overflow-hidden",
+                          C && "pe-0 group-hover:pe-10"
                         ),
-                        content: i,
+                        content: c,
                         side: "right",
                         variant: "tertiary",
-                        children: i
+                        children: c
                       }
                     ),
-                    y ? /* @__PURE__ */ r("div", { className: "pointer-events-none absolute end-2 top-1/2 z-10 flex -translate-y-1/2 items-center gap-1 opacity-0 transition-opacity group-hover:pointer-events-auto group-hover:opacity-100 focus-within:pointer-events-auto focus-within:opacity-100", children: [
+                    C ? /* @__PURE__ */ t("div", { className: "pointer-events-none absolute end-2 top-1/2 z-10 flex -translate-y-1/2 items-center gap-1 opacity-0 transition-opacity group-hover:pointer-events-auto group-hover:opacity-100 focus-within:pointer-events-auto focus-within:opacity-100", children: [
                       e ? /* @__PURE__ */ o(
                         "button",
                         {
                           type: "button",
-                          onClick: (p) => {
-                            p.stopPropagation(), m ? m({ e: p, val: t, index: l }) : x(p, t, l);
+                          onClick: (m) => {
+                            m.stopPropagation(), h ? h({ e: m, val: n, index: i }) : w(m, n, i);
                           },
-                          "aria-label": `Copy ${i}`,
+                          "aria-label": `Copy ${c}`,
                           className: "flex h-4 w-4 shrink-0 items-center justify-center rounded-full text-content-icon hover:bg-scrim-hover hover:text-content-secondary",
-                          children: n === l ? /* @__PURE__ */ o(I, { size: 12, className: "text-success" }) : /* @__PURE__ */ o(L, { size: 12 })
+                          children: r === i ? /* @__PURE__ */ o(L, { size: 12, className: "text-success" }) : /* @__PURE__ */ o(E, { size: 12 })
                         }
                       ) : null,
-                      f ? /* @__PURE__ */ o(
+                      x ? /* @__PURE__ */ o(
                         "button",
                         {
                           type: "button",
-                          onClick: (p) => {
-                            p.stopPropagation(), v(t);
+                          onClick: (m) => {
+                            m.stopPropagation(), g(n);
                           },
-                          "aria-label": `Remove ${i}`,
+                          "aria-label": `Remove ${c}`,
                           className: "flex h-4 w-4 shrink-0 items-center justify-center rounded-full text-content-icon hover:bg-scrim-hover hover:text-content-secondary",
-                          children: /* @__PURE__ */ o(V, { size: 12 })
+                          children: /* @__PURE__ */ o(M, { size: 12 })
                         }
                       ) : null
                     ] }) : null
                   ]
                 },
-                l
+                i
               );
-            })
+            }) })
           }
         ),
-        !s && w && /* @__PURE__ */ r("div", { className: "flex flex-col gap-2", children: [
+        !a && y && /* @__PURE__ */ t("div", { className: "flex flex-col gap-2", children: [
           /* @__PURE__ */ o("div", { className: "h-px bg-stroke-hairline w-full" }),
           /* @__PURE__ */ o(
-            F,
+            B,
             {
               variant: "secondary",
               size: "md",
               className: "w-full justify-center",
-              onClick: u,
-              children: c === "custom" ? "View all" : `View all (${a.length})`
+              onClick: v,
+              children: d === "custom" ? "View all" : `View all (${s.length})`
             }
           )
         ] })
       ] })
     }
   );
-}, X = ({
-  filters: a,
-  onFilterRemove: c,
-  onOverflowClick: h,
-  onViewAll: v
+}, ee = ({
+  filters: s,
+  onFilterRemove: d,
+  onOverflowClick: f,
+  onViewAll: g
 }) => /* @__PURE__ */ o("div", { className: "flex flex-1 items-center min-w-0", children: /* @__PURE__ */ o(
   $,
   {
-    items: a,
-    renderItem: (e, m) => {
-      const s = Array.isArray(e.value) ? e.value : [e.value], g = s.slice(0, 2), n = s.slice(2), d = !!e.overflow, x = e.overflow?.label ? e.overflow.label : e.overflow?.count ? `+${e.overflow.count}` : null, b = n.length > 0, w = d || b, u = `+${n.length}`;
-      return /* @__PURE__ */ r("div", { className: "flex items-center px-1", children: [
-        m > 0 && /* @__PURE__ */ o("div", { className: "mx-3 h-4 w-px bg-stroke-hairline shrink-0" }),
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ r("span", { className: "text-xs font-medium leading-[21px] text-secondary-foreground whitespace-nowrap", children: [
+    items: s,
+    renderItem: (e, h) => {
+      const a = Array.isArray(e.value) ? e.value : [e.value], u = a.slice(0, 2), r = a.slice(2), l = !!e.overflow, w = e.overflow?.label ? e.overflow.label : e.overflow?.count ? `+${e.overflow.count}` : null, b = r.length > 0, y = l || b, v = `+${r.length}`;
+      return /* @__PURE__ */ t("div", { className: "flex items-center px-1", children: [
+        h > 0 && /* @__PURE__ */ o("div", { className: "mx-3 h-4 w-px bg-stroke-hairline shrink-0" }),
+        /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ t("span", { className: "text-xs font-medium leading-[21px] text-secondary-foreground whitespace-nowrap", children: [
             e.label,
             e.required && /* @__PURE__ */ o("span", { className: "text-validation ms-0.5", children: "*" })
           ] }),
-          /* @__PURE__ */ r("div", { className: "flex items-center gap-1", children: [
+          /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: [
             /* @__PURE__ */ o(
-              A,
+              I,
               {
                 spacing: "sm",
-                tags: g.map((t) => ({
-                  label: String(t),
+                tags: u.map((p) => ({
+                  label: String(p),
                   variant: "secondary",
                   size: "md",
                   shape: "rounded",
                   removable: e.removable,
-                  onRemove: () => c(e.id, t)
+                  onRemove: () => d(e.id, p)
                 }))
               }
             ),
-            w && (d ? /* @__PURE__ */ r(k, { children: [
-              /* @__PURE__ */ o(T, { asChild: !0, children: /* @__PURE__ */ o(
-                C,
+            y && (l ? /* @__PURE__ */ t(P, { children: [
+              /* @__PURE__ */ o(z, { asChild: !0, children: /* @__PURE__ */ o(
+                T,
                 {
                   asButton: !0,
                   variant: "secondary",
                   size: "md",
                   shape: "rounded",
-                  className: S,
-                  "aria-label": `${e.overflow?.count || n.length} more filters for ${e.label}`,
-                  onClick: () => h?.(e.id),
-                  children: x || u
+                  className: O,
+                  "aria-label": `${e.overflow?.count || r.length} more filters for ${e.label}`,
+                  onClick: () => f?.(e.id),
+                  children: w || v
                 }
               ) }),
-              /* @__PURE__ */ r(z, { variant: "tertiary", side: "top", children: [
-                e.overflow?.count || n.length,
+              /* @__PURE__ */ t(S, { variant: "tertiary", side: "top", children: [
+                e.overflow?.count || r.length,
                 " more filters"
               ] })
-            ] }) : /* @__PURE__ */ r(R, { children: [
-              /* @__PURE__ */ r(k, { children: [
-                /* @__PURE__ */ o(T, { asChild: !0, children: /* @__PURE__ */ o(B, { asChild: !0, children: /* @__PURE__ */ o(
-                  C,
+            ] }) : /* @__PURE__ */ t(F, { children: [
+              /* @__PURE__ */ t(P, { children: [
+                /* @__PURE__ */ o(z, { asChild: !0, children: /* @__PURE__ */ o(V, { asChild: !0, children: /* @__PURE__ */ o(
+                  T,
                   {
                     asButton: !0,
                     variant: "secondary",
                     size: "md",
                     shape: "rounded",
-                    className: S,
-                    children: u
+                    className: O,
+                    children: v
                   }
                 ) }) }),
-                /* @__PURE__ */ r(z, { variant: "tertiary", side: "top", children: [
-                  n.length,
+                /* @__PURE__ */ t(S, { variant: "tertiary", side: "top", children: [
+                  r.length,
                   " more filters"
                 ] })
               ] }),
               /* @__PURE__ */ o(
-                E,
+                G,
                 {
-                  remainingValues: n,
+                  remainingValues: r,
                   viewAllTrigger: e.viewAllTrigger,
-                  onViewAll: v,
-                  onItemRemove: (t) => c(e.id, t),
+                  onViewAll: g,
+                  onItemRemove: (p) => d(e.id, p),
                   isRemovable: e.removable,
                   isCopyable: e.copyable
                 }
@@ -194,6 +202,6 @@ const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px
   }
 ) });
 export {
-  E as FilterPopoverContent,
-  X as FilterTagList
+  G as FilterPopoverContent,
+  ee as FilterTagList
 };

package/dist/components/forms/prompt/prompt.js

@@ -8,8 +8,8 @@ import { useImpactNovaI18n as u } from "../../../i18n/use-impact-nova-i18n.js";
 import { Tooltip as W, TooltipTrigger as q, TooltipContent as A } from "../../feedback/tooltip/tooltip.js";
 import { Button as f } from "../../primitives/button/button.js";
 import { Dialog as E, DialogContent as G, DialogHeader as J, DialogTitle as K, DialogDescription as M, DialogFooter as Q } from "../../feedback/dialog/dialog.js";
-const re = p("PromptClose", ({ className: i, ...s }, l) => {
-  const { t: c } = u();
+const re = p("PromptClose", ({ className: i, ...c }, l) => {
+  const { t: s } = u();
   return /* @__PURE__ */ n(W, { children: [
     /* @__PURE__ */ e(q, { asChild: !0, children: /* @__PURE__ */ e(
       "button",
@@ -17,20 +17,20 @@ const re = p("PromptClose", ({ className: i, ...s }, l) => {
         ref: l,
         className: r("text-content-tertiary hover:text-content transition-colors", i),
         type: "button",
-        "aria-label": c("aria.close"),
-        ...s,
+        "aria-label": s("aria.close"),
+        ...c,
         children: /* @__PURE__ */ e(B, { size: 16 })
       }
     ) }),
-    /* @__PURE__ */ e(A, { side: "top", variant: "tertiary", children: c("aria.close") })
+    /* @__PURE__ */ e(A, { side: "top", variant: "tertiary", children: s("aria.close") })
   ] });
 }), oe = p(
   "Prompt",
   ({
     open: i,
-    onOpenChange: s,
+    onOpenChange: c,
     title: l,
-    description: c,
+    description: s,
     confirmLabel: x,
     cancelLabel: b,
     onConfirm: h,
@@ -46,11 +46,11 @@ const re = p("PromptClose", ({ className: i, ...s }, l) => {
     ...D
   }, j) => {
     const { t: m } = u(), k = b ?? m("prompt.cancel"), z = x ?? m("prompt.confirm"), P = () => {
-      h?.(), s?.(!1);
+      h?.(), c?.(!1);
     }, T = () => {
-      g?.(), s?.(!1);
+      g?.(), c?.(!1);
     }, o = t !== "default", I = C || (t === "destructive" ? "destructive" : "default");
-    return /* @__PURE__ */ e(E, { open: i, onOpenChange: s, ...D, children: /* @__PURE__ */ n(
+    return /* @__PURE__ */ e(E, { open: i, onOpenChange: c, ...D, children: /* @__PURE__ */ n(
       G,
       {
         ref: j,
@@ -88,7 +88,7 @@ const re = p("PromptClose", ({ className: i, ...s }, l) => {
           /* @__PURE__ */ n(
             J,
             {
-              className: r(o && "space-y-2 items-center bg-canvas-elevated border-none"),
+              className: r(o && "space-y-2 items-center bg-canvas-elevated border-none text-center sm:text-center pe-4"),
               children: [
                 /* @__PURE__ */ e(
                   K,
@@ -99,11 +99,11 @@ const re = p("PromptClose", ({ className: i, ...s }, l) => {
                     children: l
                   }
                 ),
-                c && /* @__PURE__ */ e(
+                s && /* @__PURE__ */ e(
                   M,
                   {
                     className: r(o && "text-sm text-content-tertiary"),
-                    children: c
+                    children: s
                   }
                 )
               ]

package/dist/components/forms/prompt/prompt.variants.d.ts

@@ -1,3 +1,3 @@
 export declare const promptVariants: (props?: ({
-    variant?: "default" | "destructive" | "info" | "warning" | "success" | null | undefined;
+    variant?: "default" | "success" | "warning" | "destructive" | "info" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/components/forms/select/components/SelectMenuPanel.js

@@ -1,58 +1,62 @@
 import { jsx as o } from "react/jsx-runtime";
-import * as a from "@radix-ui/react-popover";
-import { cn as i } from "../../../../lib/utils.js";
-import { useOverlayPortalContainer as m } from "../../../../lib/overlay/overlay-portal-context.js";
-import { OVERLAY_NESTED_FLOATING_INSTANT_HIDE_CLASS as v } from "../../../../lib/overlay/overlay-host.constants.js";
-function g({
-  menuRef: n,
-  menuMinHeight: t,
-  menuWidth: l,
+import * as n from "@radix-ui/react-popover";
+import { cn as a } from "../../../../lib/utils.js";
+import { preventDismissOnTooltipOutside as t } from "../../../../lib/overlay/prevent-dismiss-on-tooltip-outside.js";
+import { useOverlayPortalContainer as v } from "../../../../lib/overlay/overlay-portal-context.js";
+import { OVERLAY_NESTED_FLOATING_INSTANT_HIDE_CLASS as f } from "../../../../lib/overlay/overlay-host.constants.js";
+function O({
+  menuRef: l,
+  menuMinHeight: i,
+  menuWidth: s,
   isReadOnly: r,
   id: d,
-  menuLabel: s,
-  children: p
+  menuLabel: p,
+  children: m
 }) {
-  const c = m();
-  return /* @__PURE__ */ o(a.Portal, { container: c, children: /* @__PURE__ */ o(
-    a.Content,
+  const c = v();
+  return /* @__PURE__ */ o(n.Portal, { container: c, children: /* @__PURE__ */ o(
+    n.Content,
     {
-      ref: n,
+      ref: l,
       side: "bottom",
       sideOffset: 4,
       align: "start",
       avoidCollisions: !0,
       collisionPadding: 8,
-      "aria-label": s,
+      "aria-label": p,
       onOpenAutoFocus: (e) => e.preventDefault(),
+      onPointerDownOutside: t,
+      onInteractOutside: t,
+      onFocusOutside: t,
       onWheel: (e) => e.stopPropagation(),
       style: {
-        width: l ?? "var(--radix-popover-trigger-width)",
+        width: s ?? "var(--radix-popover-trigger-width)",
         minWidth: "var(--radix-popover-trigger-width)",
         maxHeight: "min(320px, var(--radix-popover-content-available-height, 320px))"
       },
-      className: i(
+      className: a(
         "z-50 flex flex-col overflow-hidden rounded-[12px] p-0 text-base shadow-elevation-select focus:outline-none sm:text-sm border-none pointer-events-auto",
         r ? "bg-disabled-surface" : "bg-canvas-elevated",
-        v
+        f
       ),
       "data-testid": `select-menu-${d || "default"}`,
       "data-component": "select-menu",
       children: /* @__PURE__ */ o(
         "div",
         {
-          className: i(
+          className: a(
             "flex min-h-0 flex-1 flex-col overflow-hidden rounded-[12px]",
             r ? "bg-disabled-surface" : "bg-canvas-elevated"
           ),
           style: {
-            minHeight: t ? `${t}px` : void 0
+            minHeight: i ? `${i}px` : void 0
           },
-          children: p
+          children: m
         }
       )
     }
   ) });
 }
 export {
-  g as SelectMenuPanel
+  O as SelectMenuPanel
 };