@assure-one/design-system 0.17.0 → 1.0.0

package/dist/index.d.ts

@@ -289,11 +289,17 @@ interface CommandPaletteProps {
 declare function CommandPalette({ items, open: controlledOpen, onOpenChange, placeholder, }: CommandPaletteProps): react_jsx_runtime.JSX.Element;
 
 interface ConfirmActionButtonProps {
-    /** Element rendered as the dialog trigger via `<AlertDialogTrigger asChild>`. */
-    trigger: React$1.ReactNode;
+    /** Element rendered as the dialog trigger via `<AlertDialogTrigger asChild>`.
+     *  Optional: omit it when the dialog is driven entirely by `open` /
+     *  `onOpenChange` (e.g. a menu item hoists the dialog out of a closing
+     *  DropdownMenu). With no trigger, nothing renders until `open` is set. */
+    trigger?: React$1.ReactNode;
     title: React$1.ReactNode;
     description?: React$1.ReactNode;
     confirmLabel?: React$1.ReactNode;
+    /** Shown on the confirm button while `onConfirm` is awaiting. Falls back to
+     *  `confirmLabel` when omitted, so existing callers are unaffected. */
+    pendingLabel?: React$1.ReactNode;
     cancelLabel?: React$1.ReactNode;
     /** Awaited; dialog closes after resolve, stays open on reject. */
     onConfirm: () => void | Promise<void>;
@@ -309,7 +315,7 @@ interface ConfirmActionButtonProps {
     /** Called when the dialog requests an open-state change. */
     onOpenChange?: (open: boolean) => void;
 }
-declare function ConfirmActionButton({ trigger, title, description, confirmLabel, cancelLabel, onConfirm, destructive, contentClassName, open, defaultOpen, onOpenChange, }: ConfirmActionButtonProps): react_jsx_runtime.JSX.Element;
+declare function ConfirmActionButton({ trigger, title, description, confirmLabel, pendingLabel, cancelLabel, onConfirm, destructive, contentClassName, open, defaultOpen, onOpenChange, }: ConfirmActionButtonProps): react_jsx_runtime.JSX.Element;
 
 declare const ContextMenu: React$1.FC<ContextMenuPrimitive.ContextMenuProps>;
 declare const ContextMenuTrigger: React$1.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuTriggerProps & React$1.RefAttributes<HTMLSpanElement>>;

package/dist/index.js

@@ -3053,7 +3053,7 @@ var Checkbox = React36.forwardRef(function Checkbox2({
           shape === "circle" ? "rounded-full" : "rounded-[4px]",
           "transition-[color,background-color,border-color,box-shadow] duration-[var(--duration-fast)]",
           "hover:border-fg-4",
-          "focus-visible:border-accent focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none",
+          "focus-visible:[border-color:var(--focus-ring-border)] focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none",
           "data-[state=checked]:border-pro-fg data-[state=checked]:bg-pro-bg",
           "data-[state=indeterminate]:border-pro-fg data-[state=indeterminate]:bg-pro-bg",
           "disabled:bg-bg-disabled disabled:border-rule disabled:text-fg-disabled disabled:cursor-not-allowed",
@@ -3087,7 +3087,7 @@ var SelectTrigger = React36.forwardRef(({ className, children, ...props }, ref)
       "transition-[color,background-color,border-color,box-shadow] duration-[var(--duration-fast)] ease-[var(--ease-out-quart)]",
       "motion-reduce:transition-none",
       "placeholder:text-fg-4",
-      "focus-visible:border-accent focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none",
+      "focus-visible:[border-color:var(--focus-ring-border)] focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none",
       "disabled:bg-bg-disabled disabled:text-fg-disabled disabled:cursor-not-allowed",
       "data-[placeholder]:text-fg-4",
       "aria-[invalid=true]:border-danger-line aria-[invalid=true]:focus-visible:border-danger-fg",
@@ -3651,6 +3651,7 @@ function ConfirmActionButton({
   title,
   description,
   confirmLabel = "Confirm",
+  pendingLabel,
   cancelLabel = "Cancel",
   onConfirm,
   destructive = true,
@@ -3691,7 +3692,7 @@ function ConfirmActionButton({
         setDialogOpen(next);
       },
       children: [
-        /* @__PURE__ */ jsx(AlertDialogTrigger, { asChild: true, children: trigger }),
+        trigger != null && /* @__PURE__ */ jsx(AlertDialogTrigger, { asChild: true, children: trigger }),
         /* @__PURE__ */ jsxs(AlertDialogContent, { className: contentClassName, children: [
           /* @__PURE__ */ jsxs(AlertDialogHeader, { children: [
             /* @__PURE__ */ jsx(AlertDialogTitle, { children: title }),
@@ -3707,7 +3708,7 @@ function ConfirmActionButton({
                 className: cn(
                   !destructive && "bg-pro-fg text-fg-on-pro hover:bg-pro-hover active:bg-pro-active"
                 ),
-                children: confirmLabel
+                children: pending && pendingLabel != null ? pendingLabel : confirmLabel
               }
             )
           ] })
@@ -4188,7 +4189,7 @@ var DatePicker = forwardRef(function DatePicker2({
             "transition-[color,background-color,border-color,box-shadow] duration-[var(--duration-fast)] ease-[var(--ease-out-quart)]",
             "motion-reduce:transition-none",
             "placeholder:font-body placeholder:text-fg-4",
-            "focus-visible:border-accent focus-visible:outline-none",
+            "focus-visible:[border-color:var(--focus-ring-border)] focus-visible:outline-none",
             "focus-visible:[box-shadow:var(--shadow-focus-ring)]",
             "disabled:bg-bg-disabled disabled:text-fg-disabled disabled:cursor-not-allowed",
             "aria-[invalid=true]:border-danger-line aria-[invalid=true]:focus-visible:border-danger-fg",
@@ -4370,7 +4371,7 @@ var DateRangePicker = forwardRef(
               "transition-[color,background-color,border-color,box-shadow] duration-[var(--duration-fast)] ease-[var(--ease-out-quart)]",
               "motion-reduce:transition-none",
               "hover:bg-bg-2",
-              "focus-visible:border-accent focus-visible:outline-none",
+              "focus-visible:[border-color:var(--focus-ring-border)] focus-visible:outline-none",
               "focus-visible:[box-shadow:var(--shadow-focus-ring)]",
               "disabled:bg-bg-disabled disabled:text-fg-disabled disabled:cursor-not-allowed disabled:hover:bg-bg-disabled",
               "data-[invalid=true]:border-danger-line data-[invalid=true]:focus-visible:border-danger-fg",
@@ -4886,7 +4887,7 @@ var inputVariants = cva(
     "flex w-full rounded-input border bg-surface font-body text-fg",
     "transition-[color,background-color,border-color,box-shadow] duration-[var(--duration-fast)]",
     "placeholder:text-fg-4",
-    "focus-visible:outline-none focus-visible:border-accent",
+    "focus-visible:outline-none focus-visible:[border-color:var(--focus-ring-border)]",
     "focus-visible:[box-shadow:var(--shadow-focus-ring)]",
     "disabled:cursor-not-allowed disabled:bg-bg-disabled disabled:text-fg-disabled",
     "aria-[invalid=true]:border-danger-line aria-[invalid=true]:focus-visible:border-danger-fg",
@@ -5497,7 +5498,7 @@ function OTPSlot({ isActive, char, hasFakeCaret, hasError }) {
         "transition-[color,background-color,border-color,box-shadow] duration-[var(--duration-fast)]",
         "sm:h-14 sm:w-12 sm:text-xl",
         "border-rule-strong",
-        isActive && "border-accent z-10 [box-shadow:var(--shadow-focus-ring)]",
+        isActive && "[border-color:var(--focus-ring-border)] z-10 [box-shadow:var(--shadow-focus-ring)]",
         hasError && "border-danger-line",
         hasError && isActive && "border-danger-fg [box-shadow:0_0_0_2px_var(--color-danger-bg)]"
       ),
@@ -5886,7 +5887,7 @@ var RadioGroupItem = React36.forwardRef(function RadioGroupItem2({ className, la
         "peer border-rule-strong bg-surface text-pro-fg aspect-square size-4 shrink-0 rounded-full border",
         "transition-[color,background-color,border-color,box-shadow] duration-[var(--duration-fast)]",
         "hover:border-fg-4",
-        "focus-visible:border-accent focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none",
+        "focus-visible:[border-color:var(--focus-ring-border)] focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none",
         "data-[state=checked]:border-pro-fg",
         "disabled:bg-bg-disabled disabled:border-rule disabled:cursor-not-allowed",
         "aria-[invalid=true]:border-danger-line",
@@ -5975,7 +5976,7 @@ var searchInputVariants = cva(
     "transition-[color,background-color,border-color,box-shadow] duration-[var(--duration-fast)] ease-[var(--ease-out-quart)]",
     "motion-reduce:transition-none",
     "placeholder:text-fg-4",
-    "focus-visible:outline-none focus-visible:border-accent",
+    "focus-visible:outline-none focus-visible:[border-color:var(--focus-ring-border)]",
     "focus-visible:[box-shadow:var(--shadow-focus-ring)]",
     "disabled:cursor-not-allowed disabled:bg-bg-disabled disabled:text-fg-disabled",
     // Hide the native search-cancel button — we render our own clear button.
@@ -7540,7 +7541,7 @@ var textareaVariants = cva(
     "flex w-full rounded-input border bg-surface font-body text-fg",
     "transition-[color,background-color,border-color,box-shadow] duration-[var(--duration-fast)]",
     "placeholder:text-fg-4",
-    "focus-visible:outline-none focus-visible:border-accent",
+    "focus-visible:outline-none focus-visible:[border-color:var(--focus-ring-border)]",
     "focus-visible:[box-shadow:var(--shadow-focus-ring)]",
     "disabled:cursor-not-allowed disabled:bg-bg-disabled disabled:text-fg-disabled",
     "aria-[invalid=true]:border-danger-line aria-[invalid=true]:focus-visible:border-danger-fg",
@@ -10844,10 +10845,17 @@ function BulkActionBar({
       }
     );
   }
-  return /* @__PURE__ */ jsxs("div", { className: cn("sticky bottom-4 z-[var(--z-sticky)] mt-3", className), ...props, children: [
-    /* @__PURE__ */ jsx("div", { className: "border-rule bg-surface mx-auto flex max-w-3xl flex-wrap items-center gap-3 rounded-full border px-4 py-2 shadow-card", children: content }),
-    footer
-  ] });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("sticky bottom-4 z-[var(--z-sticky)] mt-3 flex justify-center", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "border-rule bg-surface flex w-fit max-w-full items-center gap-3 overflow-x-auto rounded-card border px-4 py-2 shadow-card", children: content }),
+        footer
+      ]
+    }
+  );
 }
 var PrimaryAction = forwardRef(
   function PrimaryAction2({ arrow, iconRight, children, className, ...props }, ref) {