@stackframe/stack-ui 2.8.17 → 2.8.20

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @stackframe/stack-ui
 
+## 2.8.20
+
+### Patch Changes
+
+- Updated dependencies
+  - @stackframe/stack-shared@2.8.20
+
+## 2.8.19
+
+### Patch Changes
+
+- Various changes
+- Updated dependencies
+  - @stackframe/stack-shared@2.8.19
+
+## 2.8.18
+
+### Patch Changes
+
+- Updated dependencies
+  - @stackframe/stack-shared@2.8.18
+
 ## 2.8.17
 
 ### Patch Changes

package/dist/components/action-dialog.js

@@ -29,7 +29,7 @@ export function ActionDialog(props) {
                                     if (await cancelButton.onClick?.() !== "prevent-close") {
                                         onOpenChange(false);
                                     }
-                                }, ...cancelButton.props, children: "Cancel" })), okButton && (_jsx(Button, { disabled: !!props.confirmText && !confirmed, variant: props.danger ? "destructive" : "default", onClick: async () => {
+                                }, ...cancelButton.props, children: cancelButton.label ?? "Cancel" })), okButton && (_jsx(Button, { disabled: !!props.confirmText && !confirmed, variant: props.danger ? "destructive" : "default", onClick: async () => {
                                     if (await okButton.onClick?.() !== "prevent-close") {
                                         onOpenChange(false);
                                     }

package/dist/components/copy-button.d.ts

@@ -2,6 +2,7 @@ import React from "react";
 declare const CopyButton: React.FC<{
     onClick?: ((e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void | Promise<void>) | undefined;
     loading?: boolean | undefined;
+    loadingStyle?: "spinner" | "disabled" | undefined;
 } & {
     asChild?: boolean | undefined;
 } & React.ButtonHTMLAttributes<HTMLButtonElement> & import("class-variance-authority").VariantProps<(props?: ({

package/dist/components/copy-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"copy-button.d.ts","sourceRoot":"","sources":["../../src/components/copy-button.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,QAAA,MAAM,UAAU;;;;;;;;;;;aAEmC,MAAM;EAuBvD,CAAC;AAGH,OAAO,EAAE,UAAU,EAAE,CAAC"}
+{"version":3,"file":"copy-button.d.ts","sourceRoot":"","sources":["../../src/components/copy-button.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,QAAA,MAAM,UAAU;;;;;;;;;;;;aAEmC,MAAM;EAuBvD,CAAC;AAGH,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/dist/components/simple-tooltip.js

@@ -9,5 +9,5 @@ export function SimpleTooltip(props) {
             _jsx(Info, { className: iconClassName }) :
             null;
     const trigger = (_jsxs(_Fragment, { children: [icon, props.children] }));
-    return (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { open: props.disabled ? false : undefined, children: [_jsx(TooltipTrigger, { asChild: true, children: props.inline ? (_jsx("span", { className: cn(props.className), children: trigger })) : (_jsx("div", { className: cn("flex items-center gap-1", props.className), children: trigger })) }), _jsx(TooltipContent, { children: _jsx("div", { className: "max-w-60 text-center text-wrap whitespace-pre-wrap", children: props.tooltip }) })] }) }));
+    return (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { open: props.disabled ? false : undefined, children: [_jsx(TooltipTrigger, { asChild: true, children: props.inline ? (_jsx("span", { className: cn(props.className), children: trigger })) : (_jsx("div", { className: cn("flex items-center gap-1", props.className), children: trigger })) }), props.tooltip && _jsx(TooltipContent, { children: _jsx("div", { className: "max-w-60 text-center text-wrap whitespace-pre-wrap", children: props.tooltip }) })] }) }));
 }

package/dist/components/ui/button.d.ts

@@ -10,10 +10,12 @@ export type OriginalButtonProps = {
 type ButtonProps = {
     onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void | Promise<void>;
     loading?: boolean;
+    loadingStyle?: "spinner" | "disabled";
 } & OriginalButtonProps;
 declare const Button: React.FC<{
     onClick?: ((e: React.MouseEvent<HTMLButtonElement>) => void | Promise<void>) | undefined;
     loading?: boolean | undefined;
+    loadingStyle?: "spinner" | "disabled" | undefined;
 } & {
     asChild?: boolean | undefined;
 } & React.ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<(props?: ({

package/dist/components/ui/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/ui/button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,QAAA,MAAM,cAAc;;;8EA8BnB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAA;AAgBvF,KAAK,WAAW,GAAG;IACjB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC3E,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,mBAAmB,CAAA;AAEvB,QAAA,MAAM,MAAM;mBAJI,gBAAgB,CAAC,iBAAiB,CAAC,KAAK,IAAI,GAAG,QAAQ,IAAI,CAAC;;;;;;;;;EA0B3E,CAAC;AAGF,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/ui/button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,QAAA,MAAM,cAAc;;;8EA8BnB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAA;AAgBvF,KAAK,WAAW,GAAG;IACjB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC3E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;CACvC,GAAG,mBAAmB,CAAA;AAEvB,QAAA,MAAM,MAAM;mBALI,gBAAgB,CAAC,iBAAiB,CAAC,KAAK,IAAI,GAAG,QAAQ,IAAI,CAAC;;;;;;;;;;EA2B3E,CAAC;AAGF,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,CAAC"}

package/dist/components/ui/button.js

@@ -35,12 +35,12 @@ const OriginalButton = forwardRefIfNeeded(({ className, variant, size, asChild =
     return (_jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), ref: ref, ...props }));
 });
 OriginalButton.displayName = "Button";
-const Button = forwardRefIfNeeded(({ onClick, loading: loadingProp, children, size, ...props }, ref) => {
+const Button = forwardRefIfNeeded(({ onClick, loading: loadingProp, loadingStyle = "spinner", children, size, ...props }, ref) => {
     const [handleClick, isLoading] = useAsyncCallback(async (e) => {
         await onClick?.(e);
     }, [onClick]);
     const loading = loadingProp || isLoading;
-    return (_jsxs(OriginalButton, { ...props, ref: ref, disabled: props.disabled || loading, onClick: (e) => runAsynchronouslyWithAlert(handleClick(e)), size: size, className: cn("relative", loading && "[&>:not(.stack-button-do-not-hide-when-siblings-are)]:invisible", props.className), children: [_jsx(Spinner, { className: cn("absolute inset-0 flex items-center justify-center stack-button-do-not-hide-when-siblings-are", !loading && "invisible") }), typeof children === "string" ? _jsx("span", { children: children }) : children] }));
+    return (_jsxs(OriginalButton, { ...props, ref: ref, disabled: props.disabled || loading, onClick: (e) => runAsynchronouslyWithAlert(handleClick(e)), size: size, className: cn("relative", loading && "[&>:not(.stack-button-do-not-hide-when-siblings-are)]:invisible", props.className), children: [loadingStyle === "spinner" && _jsx(Spinner, { className: cn("absolute inset-0 flex items-center justify-center stack-button-do-not-hide-when-siblings-are", !loading && "invisible") }), typeof children === "string" ? _jsx("span", { children: children }) : children] }));
 });
 Button.displayName = "Button";
 export { Button, buttonVariants };

package/dist/components/ui/dialog.d.ts

@@ -8,6 +8,10 @@ declare const DialogOverlay: React.FC<Omit<DialogPrimitive.DialogOverlayProps &
     ref?: React.Ref<HTMLDivElement> | undefined;
 }>;
 declare const DialogContent: React.FC<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    overlayProps?: Omit<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+        ref?: React.Ref<HTMLDivElement> | undefined;
+    }, "ref"> | undefined;
+} & {
     ref?: React.Ref<HTMLDivElement> | undefined;
 }>;
 declare const DialogBody: ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
@@ -25,5 +29,5 @@ declare const DialogTitle: React.FC<Omit<DialogPrimitive.DialogTitleProps & Reac
 declare const DialogDescription: React.FC<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & {
     ref?: React.Ref<HTMLParagraphElement> | undefined;
 }>;
-export { Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, };
+export { Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };
 //# sourceMappingURL=dialog.d.ts.map

package/dist/components/ui/dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../src/components/ui/dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAG1D,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,QAAA,MAAM,MAAM,uCAAuB,CAAC;AAEpC,QAAA,MAAM,aAAa,8GAA0B,CAAC;AAE9C,QAAA,MAAM,YAAY,6CAAyB,CAAC;AAE5C,QAAA,MAAM,WAAW,4GAAwB,CAAC;AAE1C,QAAA,MAAM,aAAa;;EAYjB,CAAC;AAGH,QAAA,MAAM,aAAa;;EAqBjB,CAAC;AAGH,QAAA,MAAM,UAAU,4BAGb,MAAM,cAAc,CAAC,cAAc,CAAC,4CAEtC,CAAC;AAEF,QAAA,MAAM,YAAY;8BAGf,MAAM,cAAc,CAAC,cAAc,CAAC;;CAQtC,CAAC;AAGF,QAAA,MAAM,YAAY;8BAGf,MAAM,cAAc,CAAC,cAAc,CAAC;;CAQtC,CAAC;AAGF,QAAA,MAAM,WAAW;;EAYf,CAAC;AAGH,QAAA,MAAM,iBAAiB;;EASrB,CAAC;AAGH,OAAO,EACL,MAAM,EACN,UAAU,EACV,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,GACd,CAAC"}
+{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../src/components/ui/dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAG1D,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,QAAA,MAAM,MAAM,uCAAuB,CAAC;AAEpC,QAAA,MAAM,aAAa,8GAA0B,CAAC;AAE9C,QAAA,MAAM,YAAY,6CAAyB,CAAC;AAE5C,QAAA,MAAM,WAAW,4GAAwB,CAAC;AAE1C,QAAA,MAAM,aAAa;;EAYjB,CAAC;AAGH,QAAA,MAAM,aAAa;;;;;;EAuBjB,CAAC;AAGH,QAAA,MAAM,UAAU,4BAGb,MAAM,cAAc,CAAC,cAAc,CAAC,4CAEtC,CAAC;AAEF,QAAA,MAAM,YAAY;8BAGf,MAAM,cAAc,CAAC,cAAc,CAAC;;CAQtC,CAAC;AAGF,QAAA,MAAM,YAAY;8BAGf,MAAM,cAAc,CAAC,cAAc,CAAC;;CAQtC,CAAC;AAGF,QAAA,MAAM,WAAW;;EAYf,CAAC;AAGH,QAAA,MAAM,iBAAiB;;EASrB,CAAC;AAGH,OAAO,EACL,MAAM,EACN,UAAU,EACV,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,EACd,CAAC"}

package/dist/components/ui/dialog.js

@@ -8,9 +8,9 @@ const Dialog = DialogPrimitive.Root;
 const DialogTrigger = DialogPrimitive.Trigger;
 const DialogPortal = DialogPrimitive.Portal;
 const DialogClose = DialogPrimitive.Close;
-const DialogOverlay = forwardRefIfNeeded(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Overlay, { ref: ref, className: cn("stack-scope fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className), ...props })));
+const DialogOverlay = forwardRefIfNeeded(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Overlay, { ref: ref, className: cn("stack-scope fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out data-[state=open]:fade-in", className), ...props })));
 DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
-const DialogContent = forwardRefIfNeeded(({ className, children, ...props }, ref) => (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, { ref: ref, className: cn("stack-scope fixed left-[50%] top-[50%] max-h-screen z-50 flex flex-col w-full max-w-lg translate-x-[-50%] translate-y-[-50%] border bg-background p-6 shadow-lg duration-100 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg", className), ...props, children: [children, _jsxs(DialogPrimitive.Close, { className: "absolute right-4 top-4 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 data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [_jsx(Cross2Icon, { className: "h-4 w-4" }), _jsx("span", { className: "sr-only", children: "Close" })] })] })] })));
+const DialogContent = forwardRefIfNeeded(({ className, children, overlayProps, ...props }, ref) => (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, { ...overlayProps }), _jsxs(DialogPrimitive.Content, { ref: ref, className: cn("stack-scope fixed left-[50%] top-[50%] max-h-screen z-50 flex flex-col w-full max-w-lg translate-x-[-50%] translate-y-[-50%] border bg-background p-6 shadow-lg duration-100 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg", className), ...props, children: [children, _jsxs(DialogPrimitive.Close, { className: "absolute right-4 top-4 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 data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [_jsx(Cross2Icon, { className: "h-4 w-4" }), _jsx("span", { className: "sr-only", children: "Close" })] })] })] })));
 DialogContent.displayName = DialogPrimitive.Content.displayName;
 const DialogBody = ({ className, ...props }) => (_jsx("div", { className: cn("stack-scope overflow-y-auto flex flex-col gap-4 w-[calc(100%+3rem)] -mx-6 px-6 my-2 py-2", className), ...props }));
 const DialogHeader = ({ className, ...props }) => (_jsx("div", { className: cn("stack-scope flex flex-col space-y-1.5 text-center sm:text-left", className), ...props }));
@@ -21,4 +21,4 @@ const DialogTitle = forwardRefIfNeeded(({ className, ...props }, ref) => (_jsx(D
 DialogTitle.displayName = DialogPrimitive.Title.displayName;
 const DialogDescription = forwardRefIfNeeded(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Description, { ref: ref, className: cn("stack-scope text-sm text-muted-foreground", className), ...props })));
 DialogDescription.displayName = DialogPrimitive.Description.displayName;
-export { Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, };
+export { Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stackframe/stack-ui",
-  "version": "2.8.17",
+  "version": "2.8.20",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "sideEffects": false,
@@ -76,7 +76,7 @@
     "react-hook-form": "^7.53.1",
     "react-resizable-panels": "^2.1.6",
     "tailwind-merge": "^2.5.4",
-    "@stackframe/stack-shared": "2.8.17"
+    "@stackframe/stack-shared": "2.8.20"
   },
   "devDependencies": {
     "@types/react": "^18.2.12",