@spark-ui/components 18.1.1 → 18.1.3

package/dist/alert-dialog/index.mjs

@@ -1,5 +1,5 @@
-import { Slot as e } from "../slot/index.mjs";
-import { t } from "../DialogContent.styles-ClKRO43s.mjs";
+import { t as e } from "../DialogContent.styles-BVyH8M3z.mjs";
+import { createRenderSlot as t } from "@spark-ui/internal-utils";
 import { cx as n } from "class-variance-authority";
 import { createContext as r, useContext as i, useRef as a } from "react";
 import { jsx as o } from "react/jsx-runtime";
@@ -33,25 +33,20 @@ var u = r(null), d = ({ children: e, withFade: t = !1, cancelRef: n }) => /* @__
 };
 p.displayName = "AlertDialog";
 //#endregion
-//#region src/alert-dialog/useRenderSlot.tsx
-function m(t, n) {
-	let r = t ? e : n;
-	return t ? ({ ...e }) => /* @__PURE__ */ o(r, { ...e }) : void 0;
-}
-//#endregion
 //#region src/alert-dialog/AlertDialogAction.tsx
-var h = ({ asChild: e = !1, ...t }) => {
-	let n = m(e, "button");
+var m = ({ asChild: e = !1, children: n, ...r }) => {
+	let { renderProp: i, innerChildren: a } = t(e, n);
 	return /* @__PURE__ */ o(s.Close, {
 		"data-spark-component": "alert-dialog-action",
-		render: n,
-		...t
+		render: i,
+		...r,
+		children: a
 	});
 };
-h.displayName = "AlertDialog.Action";
+m.displayName = "AlertDialog.Action";
 //#endregion
 //#region src/alert-dialog/AlertDialogBody.tsx
-var g = ({ children: e, className: t, inset: r = !1, ref: i, ...s }) => {
+var h = ({ children: e, className: t, inset: r = !1, ref: i, ...s }) => {
 	let u = a(null), d = c(i, u), { withFade: p } = f(), { overflow: m } = l(u);
 	return /* @__PURE__ */ o("div", {
 		"data-spark-component": "alert-dialog-body",
@@ -66,115 +61,117 @@ var g = ({ children: e, className: t, inset: r = !1, ref: i, ...s }) => {
 		children: e
 	});
 };
-g.displayName = "AlertDialog.Body";
+h.displayName = "AlertDialog.Body";
 //#endregion
 //#region src/alert-dialog/AlertDialogCancel.tsx
-var _ = ({ asChild: e = !1, ref: t, ...n }) => {
-	let { cancelRef: r } = f(), i = c(t, r), a = m(e, "button");
+var g = ({ asChild: e = !1, ref: n, children: r, ...i }) => {
+	let { cancelRef: a } = f(), l = c(n, a), { renderProp: u, innerChildren: d } = t(e, r);
 	return /* @__PURE__ */ o(s.Close, {
-		ref: i,
+		ref: l,
 		"data-spark-component": "alert-dialog-cancel",
-		render: a,
-		...n
+		render: u,
+		...i,
+		children: d
 	});
 };
-_.displayName = "AlertDialog.Cancel";
+g.displayName = "AlertDialog.Cancel";
 //#endregion
 //#region src/alert-dialog/AlertDialogContent.tsx
-var v = ({ className: e, ref: r, initialFocus: i, ...a }) => {
+var _ = ({ className: t, ref: r, initialFocus: i, ...a }) => {
 	let { cancelRef: c } = f(), l = i === void 0 ? () => c.current : i;
 	return /* @__PURE__ */ o(s.Popup, {
 		ref: r,
 		"data-spark-component": "alert-dialog-content",
 		role: "alertdialog",
-		className: (r) => n(t({
+		className: (r) => n(e({
 			size: "md",
 			isNarrow: !0
-		}), "min-w-[min(288px,calc(100vw-2rem))]", "transition-all duration-150", "data-starting-style:scale-90 data-starting-style:opacity-0", "data-ending-style:scale-90 data-ending-style:opacity-0", typeof e == "function" ? e(r) : e),
+		}), "min-w-[min(288px,calc(100vw-var(--spacing-sz-32)))]", "transition-all duration-150", "data-starting-style:scale-90 data-starting-style:opacity-0", "data-ending-style:scale-90 data-ending-style:opacity-0", typeof t == "function" ? t(r) : t),
 		initialFocus: l,
 		...a
 	});
 };
-v.displayName = "AlertDialog.Content";
+_.displayName = "AlertDialog.Content";
 //#endregion
 //#region src/alert-dialog/AlertDialogDescription.tsx
-var y = (e) => /* @__PURE__ */ o(s.Description, {
+var v = (e) => /* @__PURE__ */ o(s.Description, {
 	"data-spark-component": "alert-dialog-description",
 	...e
 });
-y.displayName = "AlertDialog.Description";
+v.displayName = "AlertDialog.Description";
 //#endregion
 //#region src/alert-dialog/AlertDialogFooter.tsx
-var b = ({ children: e, className: t, ref: r, ...i }) => /* @__PURE__ */ o("footer", {
+var y = ({ children: e, className: t, ref: r, ...i }) => /* @__PURE__ */ o("footer", {
 	"data-spark-component": "alert-dialog-footer",
 	ref: r,
 	className: n(t, ["px-xl", "py-lg"]),
 	...i,
 	children: e
 });
-b.displayName = "AlertDialog.Footer";
+y.displayName = "AlertDialog.Footer";
 //#endregion
 //#region src/alert-dialog/AlertDialogHeader.tsx
-var x = ({ children: e, className: t, ref: r, ...i }) => /* @__PURE__ */ o("header", {
+var b = ({ children: e, className: t, ref: r, ...i }) => /* @__PURE__ */ o("header", {
 	"data-spark-component": "alert-dialog-header",
 	ref: r,
 	className: n(t, ["px-xl", "py-lg"]),
 	...i,
 	children: e
 });
-x.displayName = "AlertDialog.Header";
+b.displayName = "AlertDialog.Header";
 //#endregion
 //#region src/alert-dialog/AlertDialogOverlay.tsx
-var S = ({ className: e, ...t }) => /* @__PURE__ */ o(s.Backdrop, {
+var x = ({ className: e, ...t }) => /* @__PURE__ */ o(s.Backdrop, {
 	"data-spark-component": "alert-dialog-overlay",
 	className: (t) => n("z-overlay fixed top-0 left-0 h-screen w-screen", "bg-overlay/dim-1", "data-starting-style:animate-fade-in", "data-ending-style:animate-fade-out", typeof e == "function" ? e(t) : e),
 	...t
 });
-S.displayName = "AlertDialog.Overlay";
+x.displayName = "AlertDialog.Overlay";
 //#endregion
 //#region src/alert-dialog/AlertDialogPortal.tsx
-var C = ({ className: e, ...t }) => /* @__PURE__ */ o(s.Portal, {
+var S = ({ className: e, ...t }) => /* @__PURE__ */ o(s.Portal, {
 	"data-spark-component": "alert-dialog-portal",
 	className: n(e, "z-modal absolute"),
 	...t
 });
-C.displayName = "AlertDialog.Portal";
+S.displayName = "AlertDialog.Portal";
 //#endregion
 //#region src/alert-dialog/AlertDialogTitle.tsx
-var w = ({ className: e, ...t }) => /* @__PURE__ */ o(s.Title, {
+var C = ({ className: e, ...t }) => /* @__PURE__ */ o(s.Title, {
 	"data-spark-component": "alert-dialog-title",
 	className: n("text-headline-1 text-on-surface", e),
 	...t
 });
-w.displayName = "AlertDialog.Title";
+C.displayName = "AlertDialog.Title";
 //#endregion
 //#region src/alert-dialog/AlertDialogTrigger.tsx
-var T = ({ asChild: e = !1, ...t }) => {
-	let n = m(e, "button");
+var w = ({ asChild: e = !1, children: n, ...r }) => {
+	let { renderProp: i, innerChildren: a } = t(e, n);
 	return /* @__PURE__ */ o(s.Trigger, {
 		"data-spark-component": "alert-dialog-trigger",
-		render: n,
-		...t
+		render: i,
+		...r,
+		children: a
 	});
 };
-T.displayName = "AlertDialog.Trigger";
+w.displayName = "AlertDialog.Trigger";
 //#endregion
 //#region src/alert-dialog/index.ts
-var E = Object.assign(p, {
-	Action: h,
-	Body: g,
-	Cancel: _,
-	Content: v,
-	Description: y,
-	Footer: b,
-	Header: x,
-	Overlay: S,
-	Portal: C,
-	Title: w,
-	Trigger: T
+var T = Object.assign(p, {
+	Action: m,
+	Body: h,
+	Cancel: g,
+	Content: _,
+	Description: v,
+	Footer: y,
+	Header: b,
+	Overlay: x,
+	Portal: S,
+	Title: C,
+	Trigger: w
 });
-E.displayName = "AlertDialog", E.Action.displayName = "AlertDialog.Action", E.Body.displayName = "AlertDialog.Body", E.Cancel.displayName = "AlertDialog.Cancel", E.Content.displayName = "AlertDialog.Content", E.Description.displayName = "AlertDialog.Description", E.Footer.displayName = "AlertDialog.Footer", E.Header.displayName = "AlertDialog.Header", E.Overlay.displayName = "AlertDialog.Overlay", E.Portal.displayName = "AlertDialog.Portal", E.Title.displayName = "AlertDialog.Title", E.Trigger.displayName = "AlertDialog.Trigger";
+T.displayName = "AlertDialog", T.Action.displayName = "AlertDialog.Action", T.Body.displayName = "AlertDialog.Body", T.Cancel.displayName = "AlertDialog.Cancel", T.Content.displayName = "AlertDialog.Content", T.Description.displayName = "AlertDialog.Description", T.Footer.displayName = "AlertDialog.Footer", T.Header.displayName = "AlertDialog.Header", T.Overlay.displayName = "AlertDialog.Overlay", T.Portal.displayName = "AlertDialog.Portal", T.Title.displayName = "AlertDialog.Title", T.Trigger.displayName = "AlertDialog.Trigger";
 //#endregion
-export { E as AlertDialog, f as useAlertDialog };
+export { T as AlertDialog, f as useAlertDialog };
 
 //# sourceMappingURL=index.mjs.map

package/dist/alert-dialog/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/useRenderSlot.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n  withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n  children,\n  withFade = false,\n  cancelRef,\n}: {\n  children: ReactNode\n  withFade?: boolean\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n  return (\n    <AlertDialogContext\n      value={{\n        cancelRef,\n        withFade,\n      }}\n    >\n      {children}\n    </AlertDialogContext>\n  )\n}\n\nexport const useAlertDialog = () => {\n  const context = useContext(AlertDialogContext)\n\n  if (!context) {\n    throw Error('useAlertDialog must be used within an AlertDialog provider')\n  }\n\n  return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Root>,\n  'onOpenChange' | 'render'\n> {\n  /**\n   * Specifies if the dialog is open or not.\n   */\n  open?: boolean\n  /**\n   * Default open state.\n   */\n  defaultOpen?: boolean\n  /**\n   * Handler executed on every dialog open state change.\n   */\n  onOpenChange?: (open: boolean) => void\n  /**\n   * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n   */\n  withFade?: boolean\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n  const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n  const handleOpenChange = onOpenChange\n    ? (open: boolean, _eventDetails: unknown) => {\n        onOpenChange(open)\n      }\n    : undefined\n\n  return (\n    <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n      <BaseAlertDialog.Root\n        data-spark-component=\"alert-dialog\"\n        onOpenChange={handleOpenChange}\n        {...props}\n      />\n    </AlertDialogProvider>\n  )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n  const Component = asChild ? Slot : defaultTag\n\n  return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogActionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog and confirms the action. Renders a <button> element.\n */\nexport const AlertDialogAction = ({ asChild = false, ...props }: AlertDialogActionProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n\n  return (\n    <BaseAlertDialog.Close\n      data-spark-component=\"alert-dialog-action\"\n      render={renderSlot}\n      {...props}\n    />\n  )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n  children: ReactNode\n  className?: string\n  tabIndex?: number\n  ref?: Ref<HTMLDivElement>\n  inset?: boolean\n}\n\n/**\n * The scrollable body section of the alert dialog. Renders a <div> element.\n */\nexport const AlertDialogBody = ({\n  children,\n  className,\n  inset = false,\n  ref: forwardedRef,\n  ...rest\n}: AlertDialogBodyProps): ReactElement => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n  const { withFade } = useAlertDialog()\n  const { overflow } = useScrollOverflow(scrollAreaRef)\n\n  return (\n    <div\n      data-spark-component=\"alert-dialog-body\"\n      ref={ref}\n      className={cx(\n        'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n        'transition-all duration-300',\n        {\n          ['px-xl py-lg']: !inset,\n        },\n        className\n      )}\n      style={{\n        ...(withFade && {\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n          maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n          maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n        }),\n      }}\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogCancelProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog without confirming the action. Renders a <button> element.\n */\nexport const AlertDialogCancel = ({\n  asChild = false,\n  ref: forwardedRef,\n  ...props\n}: AlertDialogCancelProps) => {\n  const { cancelRef } = useAlertDialog()\n  const ref = useMergeRefs(forwardedRef, cancelRef)\n  const renderSlot = useRenderSlot(asChild, 'button')\n\n  return (\n    <BaseAlertDialog.Close\n      ref={ref}\n      data-spark-component=\"alert-dialog-cancel\"\n      render={renderSlot}\n      {...props}\n    />\n  )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Popup>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The popup element that contains the alert dialog content. Renders a <div> element.\n */\nexport const AlertDialogContent = ({\n  className,\n  ref,\n  initialFocus,\n  ...others\n}: AlertDialogContentProps) => {\n  const { cancelRef } = useAlertDialog()\n\n  // Default: focus the cancel button when dialog opens\n  // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n  const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n  return (\n    <BaseAlertDialog.Popup\n      ref={ref}\n      data-spark-component=\"alert-dialog-content\"\n      role=\"alertdialog\"\n      className={state =>\n        cx(\n          dialogContentStyles({ size: 'md', isNarrow: true }),\n          'min-w-[min(288px,calc(100vw-2rem))]',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          // Transition with opacity and scale for smooth open/close animations\n          'transition-all duration-150',\n          'data-starting-style:scale-90 data-starting-style:opacity-0',\n          'data-ending-style:scale-90 data-ending-style:opacity-0',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      initialFocus={handleInitialFocus}\n      {...others}\n    />\n  )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Description>,\n  'render'\n> {\n  ref?: Ref<HTMLParagraphElement>\n}\n\n/**\n * A paragraph with additional information about the dialog. Renders a <p> element.\n */\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n  return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The footer section of the alert dialog, typically containing action buttons. Renders a <footer> element.\n */\nexport const AlertDialogFooter = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogFooterProps): ReactElement => (\n  <footer\n    data-spark-component=\"alert-dialog-footer\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The header section of the alert dialog. Renders a <header> element.\n */\nexport const AlertDialogHeader = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n  <header\n    data-spark-component=\"alert-dialog-header\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Backdrop>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The backdrop element that dims the rest of the page. Renders a <div> element.\n */\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n  return (\n    <BaseAlertDialog.Backdrop\n      data-spark-component=\"alert-dialog-overlay\"\n      className={state =>\n        cx(\n          'z-overlay fixed top-0 left-0 h-screen w-screen',\n          'bg-overlay/dim-1',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          'data-starting-style:animate-fade-in',\n          'data-ending-style:animate-fade-out',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      {...props}\n    />\n  )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\n/**\n * A portal that renders the dialog in a different part of the DOM. Renders a <div> element.\n */\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n  return (\n    <BaseAlertDialog.Portal\n      data-spark-component=\"alert-dialog-portal\"\n      className={cx(className, 'z-modal absolute')}\n      {...props}\n    />\n  )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Title>,\n  'render'\n> {\n  ref?: Ref<HTMLHeadingElement>\n}\n\n/**\n * The title of the alert dialog, announced to assistive technology. Renders an <h2> element.\n */\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n  return (\n    <BaseAlertDialog.Title\n      data-spark-component=\"alert-dialog-title\"\n      className={cx('text-headline-1 text-on-surface', className)}\n      {...props}\n    />\n  )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogTriggerProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Trigger>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that opens the alert dialog. Renders a <button> element.\n */\nexport const AlertDialogTrigger = ({ asChild = false, ...props }: AlertDialogTriggerProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n\n  return (\n    <BaseAlertDialog.Trigger\n      data-spark-component=\"alert-dialog-trigger\"\n      render={renderSlot}\n      {...props}\n    />\n  )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\n/**\n * A modal dialog that interrupts the user with important content and requires a response.\n */\nexport const AlertDialog: typeof Root & {\n  Action: typeof AlertDialogAction\n  Body: typeof AlertDialogBody\n  Cancel: typeof AlertDialogCancel\n  Content: typeof AlertDialogContent\n  Description: typeof AlertDialogDescription\n  Footer: typeof AlertDialogFooter\n  Header: typeof AlertDialogHeader\n  Overlay: typeof AlertDialogOverlay\n  Portal: typeof AlertDialogPortal\n  Title: typeof AlertDialogTitle\n  Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n  Action: AlertDialogAction,\n  Body: AlertDialogBody,\n  Cancel: AlertDialogCancel,\n  Content: AlertDialogContent,\n  Description: AlertDialogDescription,\n  Footer: AlertDialogFooter,\n  Header: AlertDialogHeader,\n  Overlay: AlertDialogOverlay,\n  Portal: AlertDialogPortal,\n  Title: AlertDialogTitle,\n  Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"mappings":"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"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n  withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n  children,\n  withFade = false,\n  cancelRef,\n}: {\n  children: ReactNode\n  withFade?: boolean\n  cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n  return (\n    <AlertDialogContext\n      value={{\n        cancelRef,\n        withFade,\n      }}\n    >\n      {children}\n    </AlertDialogContext>\n  )\n}\n\nexport const useAlertDialog = () => {\n  const context = useContext(AlertDialogContext)\n\n  if (!context) {\n    throw Error('useAlertDialog must be used within an AlertDialog provider')\n  }\n\n  return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Root>,\n  'onOpenChange' | 'render'\n> {\n  /**\n   * Specifies if the dialog is open or not.\n   */\n  open?: boolean\n  /**\n   * Default open state.\n   */\n  defaultOpen?: boolean\n  /**\n   * Handler executed on every dialog open state change.\n   */\n  onOpenChange?: (open: boolean) => void\n  /**\n   * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n   */\n  withFade?: boolean\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n  const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n  const handleOpenChange = onOpenChange\n    ? (open: boolean, _eventDetails: unknown) => {\n        onOpenChange(open)\n      }\n    : undefined\n\n  return (\n    <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n      <BaseAlertDialog.Root\n        data-spark-component=\"alert-dialog\"\n        onOpenChange={handleOpenChange}\n        {...props}\n      />\n    </AlertDialogProvider>\n  )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogActionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog and confirms the action. Renders a <button> element.\n */\nexport const AlertDialogAction = ({\n  asChild = false,\n  children,\n  ...props\n}: AlertDialogActionProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Close\n      data-spark-component=\"alert-dialog-action\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Close>\n  )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n  children: ReactNode\n  className?: string\n  tabIndex?: number\n  ref?: Ref<HTMLDivElement>\n  inset?: boolean\n}\n\n/**\n * The scrollable body section of the alert dialog. Renders a <div> element.\n */\nexport const AlertDialogBody = ({\n  children,\n  className,\n  inset = false,\n  ref: forwardedRef,\n  ...rest\n}: AlertDialogBodyProps): ReactElement => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n  const { withFade } = useAlertDialog()\n  const { overflow } = useScrollOverflow(scrollAreaRef)\n\n  return (\n    <div\n      data-spark-component=\"alert-dialog-body\"\n      ref={ref}\n      className={cx(\n        'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n        'transition-all duration-300',\n        {\n          ['px-xl py-lg']: !inset,\n        },\n        className\n      )}\n      style={{\n        ...(withFade && {\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n          maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n          maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n        }),\n      }}\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogCancelProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Close>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog without confirming the action. Renders a <button> element.\n */\nexport const AlertDialogCancel = ({\n  asChild = false,\n  ref: forwardedRef,\n  children,\n  ...props\n}: AlertDialogCancelProps) => {\n  const { cancelRef } = useAlertDialog()\n  const ref = useMergeRefs(forwardedRef, cancelRef)\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Close\n      ref={ref}\n      data-spark-component=\"alert-dialog-cancel\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Close>\n  )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Popup>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The popup element that contains the alert dialog content. Renders a <div> element.\n */\nexport const AlertDialogContent = ({\n  className,\n  ref,\n  initialFocus,\n  ...others\n}: AlertDialogContentProps) => {\n  const { cancelRef } = useAlertDialog()\n\n  // Default: focus the cancel button when dialog opens\n  // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n  const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n  return (\n    <BaseAlertDialog.Popup\n      ref={ref}\n      data-spark-component=\"alert-dialog-content\"\n      role=\"alertdialog\"\n      className={state =>\n        cx(\n          dialogContentStyles({ size: 'md', isNarrow: true }),\n          'min-w-[min(288px,calc(100vw-var(--spacing-sz-32)))]',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          // Transition with opacity and scale for smooth open/close animations\n          'transition-all duration-150',\n          'data-starting-style:scale-90 data-starting-style:opacity-0',\n          'data-ending-style:scale-90 data-ending-style:opacity-0',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      initialFocus={handleInitialFocus}\n      {...others}\n    />\n  )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Description>,\n  'render'\n> {\n  ref?: Ref<HTMLParagraphElement>\n}\n\n/**\n * A paragraph with additional information about the dialog. Renders a <p> element.\n */\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n  return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The footer section of the alert dialog, typically containing action buttons. Renders a <footer> element.\n */\nexport const AlertDialogFooter = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogFooterProps): ReactElement => (\n  <footer\n    data-spark-component=\"alert-dialog-footer\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The header section of the alert dialog. Renders a <header> element.\n */\nexport const AlertDialogHeader = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n  <header\n    data-spark-component=\"alert-dialog-header\"\n    ref={ref}\n    className={cx(className, ['px-xl', 'py-lg'])}\n    {...rest}\n  >\n    {children}\n  </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Backdrop>,\n  'render'\n> {\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The backdrop element that dims the rest of the page. Renders a <div> element.\n */\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n  return (\n    <BaseAlertDialog.Backdrop\n      data-spark-component=\"alert-dialog-overlay\"\n      className={state =>\n        cx(\n          'z-overlay fixed top-0 left-0 h-screen w-screen',\n          'bg-overlay/dim-1',\n          // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n          'data-starting-style:animate-fade-in',\n          'data-ending-style:animate-fade-out',\n          typeof className === 'function' ? className(state) : className\n        )\n      }\n      {...props}\n    />\n  )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\n/**\n * A portal that renders the dialog in a different part of the DOM. Renders a <div> element.\n */\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n  return (\n    <BaseAlertDialog.Portal\n      data-spark-component=\"alert-dialog-portal\"\n      className={cx(className, 'z-modal absolute')}\n      {...props}\n    />\n  )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Title>,\n  'render'\n> {\n  ref?: Ref<HTMLHeadingElement>\n}\n\n/**\n * The title of the alert dialog, announced to assistive technology. Renders an <h2> element.\n */\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n  return (\n    <BaseAlertDialog.Title\n      data-spark-component=\"alert-dialog-title\"\n      className={cx('text-headline-1 text-on-surface', className)}\n      {...props}\n    />\n  )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTriggerProps extends Omit<\n  ComponentProps<typeof BaseAlertDialog.Trigger>,\n  'render'\n> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that opens the alert dialog. Renders a <button> element.\n */\nexport const AlertDialogTrigger = ({\n  asChild = false,\n  children,\n  ...props\n}: AlertDialogTriggerProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseAlertDialog.Trigger\n      data-spark-component=\"alert-dialog-trigger\"\n      render={renderProp}\n      {...props}\n    >\n      {innerChildren}\n    </BaseAlertDialog.Trigger>\n  )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\n/**\n * A modal dialog that interrupts the user with important content and requires a response.\n */\nexport const AlertDialog: typeof Root & {\n  Action: typeof AlertDialogAction\n  Body: typeof AlertDialogBody\n  Cancel: typeof AlertDialogCancel\n  Content: typeof AlertDialogContent\n  Description: typeof AlertDialogDescription\n  Footer: typeof AlertDialogFooter\n  Header: typeof AlertDialogHeader\n  Overlay: typeof AlertDialogOverlay\n  Portal: typeof AlertDialogPortal\n  Title: typeof AlertDialogTitle\n  Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n  Action: AlertDialogAction,\n  Body: AlertDialogBody,\n  Cancel: AlertDialogCancel,\n  Content: AlertDialogContent,\n  Description: AlertDialogDescription,\n  Footer: AlertDialogFooter,\n  Header: AlertDialogHeader,\n  Overlay: AlertDialogOverlay,\n  Portal: AlertDialogPortal,\n  Title: AlertDialogTitle,\n  Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"mappings":"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"}

package/dist/avatar/index.js

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-CMqjfN_6.js"),t=require("../slot/index.js"),n=require("../icon-DY4l9nsc.js"),r=require("../icon-button-DRFf308H.js");let i=require("class-variance-authority"),a=require("react");a=e.t(a);let o=require("react/jsx-runtime"),s=require("@spark-ui/icons/PenOutline");var c=a.createContext(void 0),l=()=>{let e=a.useContext(c);if(!e)throw Error(`useAvatarContext must be used within an Avatar component`);return e},u={xs:24,sm:32,md:40,lg:56,xl:64,"2xl":96},d=a.forwardRef(({className:e,size:n=`xl`,isOnline:r=!1,onlineText:s,username:l,asChild:d,children:f,shape:p=`circle`,...m},h)=>{let g=d?t.Slot:`div`;return(0,o.jsx)(c,{value:a.useMemo(()=>({size:n,isOnline:r,onlineText:s,username:l,shape:p,pixelSize:u[n]}),[n,r,l,p,s]),children:(0,o.jsx)(g,{ref:h,style:{width:u[n],height:u[n]},"data-spark-component":`avatar`,className:(0,i.cx)(`relative inline-flex items-center justify-center`,e),...m,children:f})})});d.displayName=`Avatar`;var f=({className:e,children:a,asChild:c,angle:u=135,ariaLabel:d,...f})=>{let p=c?t.Slot:r.t,{pixelSize:m,shape:h}=l();function g(e){let t=(90-u)*Math.PI/180,n=e/2;return{x:n+n*Math.cos(t),y:n-n*Math.sin(t)}}let _=g(m),v=c;return(0,o.jsx)(p,{"data-spark-component":`avatar-action`,style:{position:`absolute`,...h===`circle`?{left:`${_.x}px`,top:`${_.y}px`}:{},...h===`square`?{right:`0px`,bottom:`0px`}:{}},className:(0,i.cx)(`z-raised`,h===`circle`?`-translate-x-1/2 -translate-y-1/2`:`translate-x-1/4 translate-y-1/4`,{"shadow-sm":!v},e),"aria-label":d,title:d,...v?{}:{size:`sm`,intent:`support`,design:`contrast`},...f,children:a||(0,o.jsx)(n.t,{size:`sm`,children:(0,o.jsx)(s.PenOutline,{})})})};f.displayName=`AvatarAction`;var p=({className:e,asChild:n,src:r,onLoad:s,onError:c,...u})=>{let{username:d,isOnline:f,onlineText:p}=l(),m=n?t.Slot:`img`,[h,g]=(0,a.useState)(!1),_=f&&p?`${d} (${p})`:d;return(0,a.useEffect)(()=>{g(!1)},[r]),r?(0,o.jsx)(m,{"aria-hidden":!0,className:(0,i.cx)(`absolute inset-0 size-full`,`object-cover`,{"transition-all duration-300 group-hover:scale-120":u.onClick},`focus-visible:u-outline`,h?`block`:`hidden`,e),alt:_,src:r,onLoad:e=>{g(!0),s?.(e)},onError:e=>{g(!1),c?.(e)},...u}):null};p.displayName=`AvatarImage`;var m=({angle:e=135,...t})=>{let{isOnline:n,pixelSize:r,shape:a,onlineText:s,size:c}=l();if(!n)return null;function u(t){let n=(90-e)*Math.PI/180,r=t/2;return{x:r+r*Math.cos(n),y:r-r*Math.sin(n)}}let d=u(r);return(0,o.jsx)(`div`,{"data-spark-component":`avatar-online-badge`,role:`status`,"aria-label":s,style:{...a===`circle`?{left:`${d.x}px`,top:`${d.y}px`}:{right:`0px`,bottom:`0px`}},className:(0,i.cx)(`bg-success outline-surface absolute rounded-full`,a===`circle`?`-translate-x-1/2 -translate-y-1/2`:`translate-x-1/4 translate-y-1/4`,[`lg`,`xl`,`2xl`].includes(c)?(0,i.cx)(`size-sz-12 outline-4`):(0,i.cx)(`size-sz-8 outline-2`)),...t})};m.displayName=`AvatarOnlineBadge`;var h=({className:e,children:t,...n})=>{let{size:r,username:a}=l(),s=a?.charAt(0);return(0,o.jsx)(`div`,{"aria-hidden":!0,className:(0,i.cx)(`absolute inset-0 flex size-full items-center justify-center`,`default:bg-neutral default:text-on-neutral`,{"text-display-1":r===`2xl`,"text-display-2":[`xl`,`lg`].includes(r),"text-display-3":r===`md`,"text-headline-2":r===`sm`,"text-body-2-highlight":r===`xs`},e),...n,children:t||s})};h.displayName=`AvatarPlaceholder`;var g=({asChild:e,children:n,className:r,...a})=>{let{shape:s,isOnline:c,onlineText:u,username:d}=l(),f=e?t.Slot:`div`,p=c&&u?`${d} (${u})`:d;return(0,o.jsx)(f,{...!e&&{role:`img`},"aria-label":p,title:p,className:(0,i.cx)(`group default:border-outline relative size-full overflow-hidden`,`focus-visible:u-outline`,{"default:rounded-full":s===`circle`,"default:rounded-md":s===`square`,"hover:opacity-dim-1 cursor-pointer":e||a.onClick},r),...a,children:n})};g.displayName=`AvatarUser`;var _=Object.assign(d,{Image:p,Action:f,OnlineBadge:m,User:g,Placeholder:h});_.displayName=`Avatar`,p.displayName=`Avatar.Image`,f.displayName=`Avatar.Action`,m.displayName=`Avatar.OnlineBadge`,g.displayName=`Avatar.User`,h.displayName=`Avatar.Placeholder`,exports.Avatar=_;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-CMqjfN_6.js"),t=require("../slot/index.js"),n=require("../icon-CfEsla9z.js"),r=require("../icon-button-B2TM0Xby.js");let i=require("class-variance-authority"),a=require("react");a=e.t(a);let o=require("react/jsx-runtime"),s=require("@spark-ui/icons/PenOutline");var c=a.createContext(void 0),l=()=>{let e=a.useContext(c);if(!e)throw Error(`useAvatarContext must be used within an Avatar component`);return e},u={xs:24,sm:32,md:40,lg:56,xl:64,"2xl":96},d=a.forwardRef(({className:e,size:n=`xl`,isOnline:r=!1,onlineText:s,username:l,asChild:d,children:f,shape:p=`circle`,...m},h)=>{let g=d?t.Slot:`div`;return(0,o.jsx)(c,{value:a.useMemo(()=>({size:n,isOnline:r,onlineText:s,username:l,shape:p,pixelSize:u[n]}),[n,r,l,p,s]),children:(0,o.jsx)(g,{ref:h,style:{width:u[n],height:u[n]},"data-spark-component":`avatar`,className:(0,i.cx)(`relative inline-flex items-center justify-center`,e),...m,children:f})})});d.displayName=`Avatar`;var f=({className:e,children:a,asChild:c,angle:u=135,ariaLabel:d,...f})=>{let p=c?t.Slot:r.t,{pixelSize:m,shape:h}=l();function g(e){let t=(90-u)*Math.PI/180,n=e/2;return{x:n+n*Math.cos(t),y:n-n*Math.sin(t)}}let _=g(m),v=c;return(0,o.jsx)(p,{"data-spark-component":`avatar-action`,style:{position:`absolute`,...h===`circle`?{left:`${_.x}px`,top:`${_.y}px`}:{},...h===`square`?{right:`0px`,bottom:`0px`}:{}},className:(0,i.cx)(`z-raised`,h===`circle`?`-translate-x-1/2 -translate-y-1/2`:`translate-x-1/4 translate-y-1/4`,{"shadow-sm":!v},e),"aria-label":d,title:d,...v?{}:{size:`sm`,intent:`support`,design:`contrast`},...f,children:a||(0,o.jsx)(n.t,{size:`sm`,children:(0,o.jsx)(s.PenOutline,{})})})};f.displayName=`AvatarAction`;var p=({className:e,asChild:n,src:r,onLoad:s,onError:c,...u})=>{let{username:d,isOnline:f,onlineText:p}=l(),m=n?t.Slot:`img`,[h,g]=(0,a.useState)(!1),_=f&&p?`${d} (${p})`:d;return(0,a.useEffect)(()=>{g(!1)},[r]),r?(0,o.jsx)(m,{"aria-hidden":!0,className:(0,i.cx)(`absolute inset-0 size-full`,`object-cover`,{"transition-all duration-300 group-hover:scale-120":u.onClick},`focus-visible:u-outline`,h?`block`:`hidden`,e),alt:_,src:r,onLoad:e=>{g(!0),s?.(e)},onError:e=>{g(!1),c?.(e)},...u}):null};p.displayName=`AvatarImage`;var m=({angle:e=135,...t})=>{let{isOnline:n,pixelSize:r,shape:a,onlineText:s,size:c}=l();if(!n)return null;function u(t){let n=(90-e)*Math.PI/180,r=t/2;return{x:r+r*Math.cos(n),y:r-r*Math.sin(n)}}let d=u(r);return(0,o.jsx)(`div`,{"data-spark-component":`avatar-online-badge`,role:`status`,"aria-label":s,style:{...a===`circle`?{left:`${d.x}px`,top:`${d.y}px`}:{right:`0px`,bottom:`0px`}},className:(0,i.cx)(`bg-success outline-surface absolute rounded-full`,a===`circle`?`-translate-x-1/2 -translate-y-1/2`:`translate-x-1/4 translate-y-1/4`,[`lg`,`xl`,`2xl`].includes(c)?(0,i.cx)(`size-sz-12 outline-4`):(0,i.cx)(`size-sz-8 outline-2`)),...t})};m.displayName=`AvatarOnlineBadge`;var h=({className:e,children:t,...n})=>{let{size:r,username:a}=l(),s=a?.charAt(0);return(0,o.jsx)(`div`,{"aria-hidden":!0,className:(0,i.cx)(`absolute inset-0 flex size-full items-center justify-center`,`default:bg-neutral default:text-on-neutral`,{"text-display-1":r===`2xl`,"text-display-2":[`xl`,`lg`].includes(r),"text-display-3":r===`md`,"text-headline-2":r===`sm`,"text-body-2-highlight":r===`xs`},e),...n,children:t||s})};h.displayName=`AvatarPlaceholder`;var g=({asChild:e,children:n,className:r,...a})=>{let{shape:s,isOnline:c,onlineText:u,username:d}=l(),f=e?t.Slot:`div`,p=c&&u?`${d} (${u})`:d;return(0,o.jsx)(f,{...!e&&{role:`img`},"aria-label":p,title:p,className:(0,i.cx)(`group default:border-outline relative size-full overflow-hidden`,`focus-visible:u-outline`,{"default:rounded-full":s===`circle`,"default:rounded-md":s===`square`,"hover:opacity-dim-1 cursor-pointer":e||a.onClick},r),...a,children:n})};g.displayName=`AvatarUser`;var _=Object.assign(d,{Image:p,Action:f,OnlineBadge:m,User:g,Placeholder:h});_.displayName=`Avatar`,p.displayName=`Avatar.Image`,f.displayName=`Avatar.Action`,m.displayName=`Avatar.OnlineBadge`,g.displayName=`Avatar.User`,h.displayName=`Avatar.Placeholder`,exports.Avatar=_;
 //# sourceMappingURL=index.js.map

package/dist/avatar/index.mjs

@@ -1,6 +1,6 @@
 import { Slot as e } from "../slot/index.mjs";
-import { t } from "../icon-Bs-39J-H.mjs";
-import { t as n } from "../icon-button-C1ThqdK1.mjs";
+import { t } from "../icon-VM_Ys9Xn.mjs";
+import { t as n } from "../icon-button-CexCkoV0.mjs";
 import { cx as r } from "class-variance-authority";
 import * as i from "react";
 import { useEffect as a, useState as o } from "react";

package/dist/badge/BadgeItem.styles.d.ts

@@ -1,6 +1,6 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const styles: (props?: ({
-    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
+    intent?: "main" | "surface" | "support" | "alert" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
     size?: "sm" | "md" | null | undefined;
     type?: "relative" | "standalone" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/badge/index.js

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("class-variance-authority"),t=require("react/jsx-runtime"),n=require("@spark-ui/internal-utils");var r=(0,e.cva)([`inline-flex h-fit`,`empty:p-0`,`text-center`,`rounded-full box-content`],{variants:{intent:(0,n.makeVariants)({main:[`bg-main`,`text-on-main`,`border-surface`],support:[`bg-support`,`text-on-support`,`border-surface`],accent:[`bg-accent`,`text-on-accent`,`border-surface`],success:[`bg-success`,`text-on-success`,`border-surface`],alert:[`bg-alert`,`text-on-alert`,`border-surface`],danger:[`bg-error`,`text-on-error`,`border-surface`],info:[`bg-info`,`text-on-info`,`border-surface`],neutral:[`bg-neutral`,`text-on-neutral`,`border-surface`],surface:[`bg-surface`,`text-on-surface`,`border-surface`]}),size:(0,n.makeVariants)({sm:[`text-small-highlight`,`px-[var(--spacing-sz-6)] py-[var(--spacing-sz-2)]`,`empty:size-sz-8`],md:[`text-caption-highlight`,`px-md py-sm`,`empty:size-sz-16`]}),type:{relative:[`absolute right-0 border-md`,`translate-x-1/2 -translate-y-1/2`],standalone:[]}},defaultVariants:{intent:`danger`,size:`md`,type:`relative`}}),i=({intent:e=`danger`,size:n=`md`,type:i=`relative`,count:a,overflowCount:o=99,"aria-label":s,className:c,...l})=>{let u=a&&a>o,d=typeof s==`function`?s({count:a,overflowCount:o}):s,f={...l,"aria-label":d};return(0,t.jsx)(`span`,{"data-spark-component":`badge`,role:`status`,className:r({intent:e,size:n,type:i,className:c}),...f,children:u?`${o}+`:a})};i.displayName=`BadgeItem`;var a=({children:e,...n})=>e?(0,t.jsxs)(`div`,{className:`relative inline-flex`,children:[e,(0,t.jsx)(i,{...n})]}):(0,t.jsx)(i,{type:`standalone`,...n});a.displayName=`Badge`,exports.Badge=a;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("@spark-ui/internal-utils"),t=require("class-variance-authority"),n=require("react/jsx-runtime");var r=(0,t.cva)([`inline-flex h-fit`,`empty:p-0`,`text-center`,`rounded-full box-content`],{variants:{intent:(0,e.makeVariants)({main:[`bg-main`,`text-on-main`,`border-surface`],support:[`bg-support`,`text-on-support`,`border-surface`],accent:[`bg-accent`,`text-on-accent`,`border-surface`],success:[`bg-success`,`text-on-success`,`border-surface`],alert:[`bg-alert`,`text-on-alert`,`border-surface`],danger:[`bg-error`,`text-on-error`,`border-surface`],info:[`bg-info`,`text-on-info`,`border-surface`],neutral:[`bg-neutral`,`text-on-neutral`,`border-surface`],surface:[`bg-surface`,`text-on-surface`,`border-surface`]}),size:(0,e.makeVariants)({sm:[`text-small-highlight`,`px-[var(--spacing-sz-6)] py-[var(--spacing-sz-2)]`,`empty:size-sz-8`],md:[`text-caption-highlight`,`px-md py-sm`,`empty:size-sz-16`]}),type:{relative:[`absolute right-0 border-md`,`translate-x-1/2 -translate-y-1/2`],standalone:[]}},defaultVariants:{intent:`danger`,size:`md`,type:`relative`}}),i=({intent:e=`danger`,size:t=`md`,type:i=`relative`,count:a,overflowCount:o=99,"aria-label":s,className:c,...l})=>{let u=a&&a>o,d=typeof s==`function`?s({count:a,overflowCount:o}):s,f={...l,"aria-label":d};return(0,n.jsx)(`span`,{"data-spark-component":`badge`,role:`status`,className:r({intent:e,size:t,type:i,className:c}),...f,children:u?`${o}+`:a})};i.displayName=`BadgeItem`;var a=({children:e,...t})=>e?(0,n.jsxs)(`div`,{className:`relative inline-flex`,children:[e,(0,n.jsx)(i,{...t})]}):(0,n.jsx)(i,{type:`standalone`,...t});a.displayName=`Badge`,exports.Badge=a;
 //# sourceMappingURL=index.js.map

package/dist/badge/index.mjs

@@ -1,15 +1,15 @@
-import { cva as e } from "class-variance-authority";
-import { jsx as t, jsxs as n } from "react/jsx-runtime";
-import { makeVariants as r } from "@spark-ui/internal-utils";
+import { makeVariants as e } from "@spark-ui/internal-utils";
+import { cva as t } from "class-variance-authority";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/badge/BadgeItem.styles.tsx
-var i = e([
+var i = t([
 	"inline-flex h-fit",
 	"empty:p-0",
 	"text-center",
 	"rounded-full box-content"
 ], {
 	variants: {
-		intent: r({
+		intent: e({
 			main: [
 				"bg-main",
 				"text-on-main",
@@ -56,7 +56,7 @@ var i = e([
 				"border-surface"
 			]
 		}),
-		size: r({
+		size: e({
 			sm: [
 				"text-small-highlight",
 				"px-[var(--spacing-sz-6)] py-[var(--spacing-sz-2)]",
@@ -78,7 +78,7 @@ var i = e([
 		size: "md",
 		type: "relative"
 	}
-}), a = ({ intent: e = "danger", size: n = "md", type: r = "relative", count: a, overflowCount: o = 99, "aria-label": s, className: c, ...l }) => {
+}), a = ({ intent: e = "danger", size: t = "md", type: r = "relative", count: a, overflowCount: o = 99, "aria-label": s, className: c, ...l }) => {
 	let u = a && a > o, d = typeof s == "function" ? s({
 		count: a,
 		overflowCount: o
@@ -86,12 +86,12 @@ var i = e([
 		...l,
 		"aria-label": d
 	};
-	return /* @__PURE__ */ t("span", {
+	return /* @__PURE__ */ n("span", {
 		"data-spark-component": "badge",
 		role: "status",
 		className: i({
 			intent: e,
-			size: n,
+			size: t,
 			type: r,
 			className: c
 		}),
@@ -102,12 +102,12 @@ var i = e([
 a.displayName = "BadgeItem";
 //#endregion
 //#region src/badge/Badge.tsx
-var o = ({ children: e, ...r }) => e ? /* @__PURE__ */ n("div", {
+var o = ({ children: e, ...t }) => e ? /* @__PURE__ */ r("div", {
 	className: "relative inline-flex",
-	children: [e, /* @__PURE__ */ t(a, { ...r })]
-}) : /* @__PURE__ */ t(a, {
+	children: [e, /* @__PURE__ */ n(a, { ...t })]
+}) : /* @__PURE__ */ n(a, {
 	type: "standalone",
-	...r
+	...t
 });
 o.displayName = "Badge";
 //#endregion

package/dist/breadcrumb/index.js

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../slot/index.js"),t=require("../icon-DY4l9nsc.js"),n=require("../text-link/index.js");let r=require("class-variance-authority"),i=require("react/jsx-runtime"),a=require("@spark-ui/icons/ArrowVerticalRight");var o=({className:e,"aria-label":t,ref:n,...a})=>(0,i.jsx)(`nav`,{"data-spark-component":`breadcrumb`,ref:n,"aria-label":t,className:(0,r.cx)(`text-caption text-neutral`,e),children:(0,i.jsx)(`ol`,{className:(0,r.cx)(`gap-sm flex flex-wrap items-center break-words`),...a})});o.displayName=`Breadcrumb.Breadcrumb`;var s=({asChild:t=!1,className:n,children:a,...o})=>(0,i.jsx)(t?e.Slot:`span`,{"data-spark-component":`breadcrumb-current-page`,role:`link`,"aria-disabled":!0,"aria-current":`page`,className:(0,r.cx)(`inline! overflow-hidden font-medium text-ellipsis whitespace-nowrap text-current`,n),...o,children:a});s.displayName=`Breadcrumb.CurrentPage`;var c=({className:e,...t})=>(0,i.jsx)(`li`,{"data-spark-component":`breadcrumb-item`,className:(0,r.cx)(`min-w-none gap-sm inline-flex items-center`,e),...t});c.displayName=`Breadcrumb.Item`;var l=({asChild:t=!1,className:a,bold:o=!0,intent:s=`current`,underline:c=!0,href:l,ref:u,...d})=>(0,i.jsx)(t?e.Slot:n.TextLink,{"data-spark-component":`breadcrumb-link`,href:l,ref:u,className:(0,r.cx)(`inline! overflow-hidden text-ellipsis whitespace-nowrap`,a),bold:o,intent:s,underline:c,...d});l.displayName=`Breadcrumb.Link`;var u=({asChild:n=!1,className:o,children:s,ref:c,...l})=>(0,i.jsx)(n?e.Slot:`li`,{role:`presentation`,"aria-hidden":!0,"data-spark-component":`breadcrumb-separator`,ref:c,className:(0,r.cx)(`gap-sm inline-flex items-center`,o),...l,children:s??(0,i.jsx)(t.t,{children:(0,i.jsx)(a.ArrowVerticalRight,{})})});u.displayName=`Breadcrumb.Separator`;var d=Object.assign(o,{Item:c,Link:l,CurrentPage:s,Separator:u});d.displayName=`Breadcrumb`,c.displayName=`Breadcrumb.Item`,l.displayName=`Breadcrumb.Link`,s.displayName=`Breadcrumb.CurrentPage`,u.displayName=`Breadcrumb.Separator`,exports.Breadcrumb=d;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../slot/index.js"),t=require("../icon-CfEsla9z.js"),n=require("../text-link/index.js");let r=require("class-variance-authority"),i=require("react/jsx-runtime"),a=require("@spark-ui/icons/ArrowVerticalRight");var o=({className:e,"aria-label":t,ref:n,...a})=>(0,i.jsx)(`nav`,{"data-spark-component":`breadcrumb`,ref:n,"aria-label":t,className:(0,r.cx)(`text-caption text-neutral`,e),children:(0,i.jsx)(`ol`,{className:(0,r.cx)(`gap-sm flex flex-wrap items-center break-words`),...a})});o.displayName=`Breadcrumb.Breadcrumb`;var s=({asChild:t=!1,className:n,children:a,...o})=>(0,i.jsx)(t?e.Slot:`span`,{"data-spark-component":`breadcrumb-current-page`,role:`link`,"aria-disabled":!0,"aria-current":`page`,className:(0,r.cx)(`inline! overflow-hidden font-medium text-ellipsis whitespace-nowrap text-current`,n),...o,children:a});s.displayName=`Breadcrumb.CurrentPage`;var c=({className:e,...t})=>(0,i.jsx)(`li`,{"data-spark-component":`breadcrumb-item`,className:(0,r.cx)(`min-w-none gap-sm inline-flex items-center`,e),...t});c.displayName=`Breadcrumb.Item`;var l=({asChild:t=!1,className:a,bold:o=!0,intent:s=`current`,underline:c=!0,href:l,ref:u,...d})=>(0,i.jsx)(t?e.Slot:n.TextLink,{"data-spark-component":`breadcrumb-link`,href:l,ref:u,className:(0,r.cx)(`inline! overflow-hidden text-ellipsis whitespace-nowrap`,a),bold:o,intent:s,underline:c,...d});l.displayName=`Breadcrumb.Link`;var u=({asChild:n=!1,className:o,children:s,ref:c,...l})=>(0,i.jsx)(n?e.Slot:`li`,{role:`presentation`,"aria-hidden":!0,"data-spark-component":`breadcrumb-separator`,ref:c,className:(0,r.cx)(`gap-sm inline-flex items-center`,o),...l,children:s??(0,i.jsx)(t.t,{children:(0,i.jsx)(a.ArrowVerticalRight,{})})});u.displayName=`Breadcrumb.Separator`;var d=Object.assign(o,{Item:c,Link:l,CurrentPage:s,Separator:u});d.displayName=`Breadcrumb`,c.displayName=`Breadcrumb.Item`,l.displayName=`Breadcrumb.Link`,s.displayName=`Breadcrumb.CurrentPage`,u.displayName=`Breadcrumb.Separator`,exports.Breadcrumb=d;
 //# sourceMappingURL=index.js.map

package/dist/breadcrumb/index.mjs

@@ -1,5 +1,5 @@
 import { Slot as e } from "../slot/index.mjs";
-import { t } from "../icon-Bs-39J-H.mjs";
+import { t } from "../icon-VM_Ys9Xn.mjs";
 import { TextLink as n } from "../text-link/index.mjs";
 import { cx as r } from "class-variance-authority";
 import { jsx as i } from "react/jsx-runtime";

package/dist/button/Button.styles.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
 export declare const buttonStyles: (props?: ({
     design?: "filled" | "outlined" | "contrast" | "ghost" | "tinted" | null | undefined;
     underline?: boolean | null | undefined;
-    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "ai" | "danger" | "surfaceInverse" | null | undefined;
+    intent?: "main" | "surface" | "support" | "alert" | "accent" | "success" | "info" | "neutral" | "ai" | "danger" | "surfaceInverse" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
     shape?: "square" | "rounded" | "pill" | null | undefined;
     disabled?: boolean | null | undefined;

package/dist/button/index.js

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../button-D0s-21qo.js");exports.Button=e.t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../button-3vvMrf1L.js");exports.Button=e.t;

package/dist/button/index.mjs

@@ -1,2 +1,2 @@
-import { t as e } from "../button-DwLTXeJX.mjs";
+import { t as e } from "../button-DBNjh3Bi.mjs";
 export { e as Button };

package/dist/{button-D0s-21qo.js → button-3vvMrf1L.js}

@@ -1,2 +1,2 @@
-const e=require("./slot/index.js"),t=require("./spinner-CmPypfJR.js");let n=require("class-variance-authority"),r=require("react"),i=require("react/jsx-runtime"),a=require("@spark-ui/internal-utils");var o=(0,n.cva)([`u-shadow-border-transition`,`box-border inline-flex items-center justify-center gap-md whitespace-nowrap`,`default:px-lg`,`rounded-button`,`text-body-1-highlight`,`focus-visible:u-outline`],{variants:{underline:{true:[`underline`]},appearance:{primary:[`bg-main`,`text-on-main`,`rounded-button`,`enabled:hover:bg-main-hovered`,`enabled:active:bg-main-hovered`,`enabled:focus-visible:bg-main-hovered`],secondary:[`bg-support`,`text-on-support`,`rounded-button`,`enabled:hover:bg-support-hovered`,`enabled:active:bg-support-hovered`,`enabled:focus-visible:bg-support-hovered`],tertiary:[`border-outline`,`border-sm`,`bg-surface`,`text-on-surface`,`rounded-button`,`enabled:hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`enabled:focus-visible:bg-surface-hovered`],contrast:[`bg-surface`,`text-on-surface`,`rounded-button`,`enabled:hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`enabled:focus-visible:bg-surface-hovered`],ghost:[`text-on-surface default:-mx-md px-md enabled:hover:bg-surface-hovered`],success:[`border-outline`,`border-sm`,`bg-transparent`,`text-success`,`rounded-button`,`enabled:hover:bg-success-container`,`enabled:active:bg-success-container`,`enabled:focus-visible:bg-success-container`],danger:[`border-outline`,`border-sm`,`bg-transparent`,`text-error`,`rounded-button`,`enabled:hover:bg-error-container`,`enabled:active:bg-error-container`,`enabled:focus-visible:bg-error-container`],boost:[`bg-accent`,`text-on-accent`,`rounded-button`,`enabled:hover:bg-accent-hovered`,`enabled:active:bg-accent-hovered`,`enabled:focus-visible:bg-accent-hovered`],AI:[`bg-ai`,`text-on-ai`,`rounded-button`,`enabled:hover:bg-ai-hovered`,`enabled:active:bg-ai-hovered`,`enabled:focus-visible:bg-ai-hovered`]},size:(0,a.makeVariants)({sm:[`min-w-sz-32 h-sz-32`],md:[`min-w-sz-44 h-sz-44`],lg:[`min-w-sz-56 h-sz-56`]}),disabled:{true:[`cursor-not-allowed opacity-dim-3`],false:[`cursor-pointer`]}},defaultVariants:{size:`md`}}),s=[{intent:`main`,design:`filled`,class:(0,a.tw)([`bg-main`,`text-on-main`,`hover:bg-main-hovered`,`enabled:active:bg-main-hovered`,`focus-visible:bg-main-hovered`])},{intent:`support`,design:`filled`,class:(0,a.tw)([`bg-support`,`text-on-support`,`hover:bg-support-hovered`,`enabled:active:bg-support-hovered`,`focus-visible:bg-support-hovered`])},{intent:`accent`,design:`filled`,class:(0,a.tw)([`bg-accent`,`text-on-accent`,`hover:bg-accent-hovered`,`enabled:active:bg-accent-hovered`,`focus-visible:bg-accent-hovered`])},{intent:`ai`,design:`filled`,class:(0,a.tw)([`bg-ai`,`text-on-ai`,`hover:bg-ai-hovered`,`enabled:active:bg-ai-hovered`,`focus-visible:bg-ai-hovered`])},{intent:`success`,design:`filled`,class:(0,a.tw)([`bg-success`,`text-on-success`,`hover:bg-success-hovered`,`enabled:active:bg-success-hovered`,`focus-visible:bg-success-hovered`])},{intent:`alert`,design:`filled`,class:(0,a.tw)([`bg-alert`,`text-on-alert`,`hover:bg-alert-hovered`,`enabled:active:bg-alert-hovered`,`focus-visible:bg-alert-hovered`])},{intent:`danger`,design:`filled`,class:(0,a.tw)([`text-on-error bg-error`,`hover:bg-error-hovered enabled:active:bg-error-hovered`,`focus-visible:bg-error-hovered`])},{intent:`info`,design:`filled`,class:(0,a.tw)([`text-on-error bg-info`,`hover:bg-info-hovered enabled:active:bg-info-hovered`,`focus-visible:bg-info-hovered`])},{intent:`neutral`,design:`filled`,class:(0,a.tw)([`bg-neutral`,`text-on-neutral`,`hover:bg-neutral-hovered`,`enabled:active:bg-neutral-hovered`,`focus-visible:bg-neutral-hovered`])},{intent:`surface`,design:`filled`,class:(0,a.tw)([`bg-surface`,`text-on-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`filled`,class:(0,a.tw)([`bg-surface-inverse`,`text-on-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],c=[{intent:`main`,design:`ghost`,class:(0,a.tw)([`text-on-main-container`,`hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`])},{intent:`support`,design:`ghost`,class:(0,a.tw)([`text-on-support-container`,`hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`])},{intent:`accent`,design:`ghost`,class:(0,a.tw)([`text-on-accent-container`,`hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`])},{intent:`ai`,design:`ghost`,class:(0,a.tw)([`text-on-ai-container`,`hover:bg-ai/dim-5`,`enabled:active:bg-ai/dim-5`,`focus-visible:bg-ai/dim-5`])},{intent:`success`,design:`ghost`,class:(0,a.tw)([`text-on-success-container`,`hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`])},{intent:`alert`,design:`ghost`,class:(0,a.tw)([`text-on-alert-container`,`hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`])},{intent:`danger`,design:`ghost`,class:(0,a.tw)([`text-on-error-container`,`hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`])},{intent:`info`,design:`ghost`,class:(0,a.tw)([`text-on-info-container`,`hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`])},{intent:`neutral`,design:`ghost`,class:(0,a.tw)([`text-on-neutral-container`,`hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`])},{intent:`surface`,design:`ghost`,class:(0,a.tw)([`text-surface`,`hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`])},{intent:`surfaceInverse`,design:`ghost`,class:(0,a.tw)([`text-surface-inverse`,`hover:bg-surface-inverse/dim-5`,`enabled:active:bg-surface-inverse/dim-5`,`focus-visible:bg-surface-inverse/dim-5`])}],l=[{intent:`main`,design:`outlined`,class:(0,a.tw)([`hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`,`text-main`])},{intent:`support`,design:`outlined`,class:(0,a.tw)([`hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`,`text-support`])},{intent:`accent`,design:`outlined`,class:(0,a.tw)([`hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`,`text-accent`])},{intent:`ai`,design:`outlined`,class:(0,a.tw)([`hover:bg-ai/dim-5`,`enabled:active:bg-ai/dim-5`,`focus-visible:bg-ai/dim-5`,`text-ai`])},{intent:`success`,design:`outlined`,class:(0,a.tw)([`hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`,`text-success`])},{intent:`alert`,design:`outlined`,class:(0,a.tw)([`hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`,`text-alert`])},{intent:`danger`,design:`outlined`,class:(0,a.tw)([`hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`,`text-error`])},{intent:`info`,design:`outlined`,class:(0,a.tw)([`hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`,`text-info`])},{intent:`neutral`,design:`outlined`,class:(0,a.tw)([`hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`,`text-neutral`])},{intent:`surface`,design:`outlined`,class:(0,a.tw)([`hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`,`text-surface`])},{intent:`surfaceInverse`,design:`outlined`,class:(0,a.tw)([`hover:bg-surface-inverse/dim-5`,`enabled:active:bg-surface-inverse/dim-5`,`focus-visible:bg-surface-inverse/dim-5`,`text-surface-inverse`])}],u=[{intent:`main`,design:`tinted`,class:(0,a.tw)([`bg-main-container`,`text-on-main-container`,`hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`])},{intent:`support`,design:`tinted`,class:(0,a.tw)([`bg-support-container`,`text-on-support-container`,`hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`])},{intent:`accent`,design:`tinted`,class:(0,a.tw)([`bg-accent-container`,`text-on-accent-container`,`hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`])},{intent:`ai`,design:`tinted`,class:(0,a.tw)([`bg-ai-container`,`text-on-ai-container`,`hover:bg-ai-container-hovered`,`enabled:active:bg-ai-container-hovered`,`focus-visible:bg-ai-container-hovered`])},{intent:`success`,design:`tinted`,class:(0,a.tw)([`bg-success-container`,`text-on-success-container`,`hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`])},{intent:`alert`,design:`tinted`,class:(0,a.tw)([`bg-alert-container`,`text-on-alert-container`,`hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`])},{intent:`danger`,design:`tinted`,class:(0,a.tw)([`bg-error-container`,`text-on-error-container`,`hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`])},{intent:`info`,design:`tinted`,class:(0,a.tw)([`bg-info-container`,`text-on-info-container`,`hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`])},{intent:`neutral`,design:`tinted`,class:(0,a.tw)([`bg-neutral-container`,`text-on-neutral-container`,`hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`])},{intent:`surface`,design:`tinted`,class:(0,a.tw)([`bg-surface`,`text-on-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`tinted`,class:(0,a.tw)([`bg-surface-inverse`,`text-on-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],d=[{intent:`main`,design:`contrast`,class:(0,a.tw)([`text-on-main-contaier bg-surface`,`hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`])},{intent:`support`,design:`contrast`,class:(0,a.tw)([`text-on-support-container bg-surface`,`hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`])},{intent:`accent`,design:`contrast`,class:(0,a.tw)([`text-on-accent-container bg-surface`,`hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`])},{intent:`ai`,design:`contrast`,class:(0,a.tw)([`text-on-ai-container bg-surface`,`hover:bg-ai-container-hovered`,`enabled:active:bg-ai-container-hovered`,`focus-visible:bg-ai-container-hovered`])},{intent:`success`,design:`contrast`,class:(0,a.tw)([`text-on-success-container bg-surface`,`hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`])},{intent:`alert`,design:`contrast`,class:(0,a.tw)([`text-on-alert-container bg-surface`,`hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`])},{intent:`danger`,design:`contrast`,class:(0,a.tw)([`text-on-error-container bg-surface`,`hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`])},{intent:`info`,design:`contrast`,class:(0,a.tw)([`text-on-info-container bg-surface`,`hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`])},{intent:`neutral`,design:`contrast`,class:(0,a.tw)([`text-on-neutral-container bg-surface`,`hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`])},{intent:`surface`,design:`contrast`,class:(0,a.tw)([`text-on-surface bg-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`contrast`,class:(0,a.tw)([`text-on-surface-inverse bg-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],f=(0,n.cva)([`u-shadow-border-transition`,`box-border inline-flex items-center justify-center gap-md whitespace-nowrap`,`default:px-lg`,`text-body-1-highlight`,`focus-visible:u-outline`],{variants:{design:(0,a.makeVariants)({filled:[],outlined:[`bg-transparent`,`border-sm`,`border-current`],tinted:[],ghost:[`default:-mx-md px-md hover:bg-main/dim-5`],contrast:[]}),underline:{true:[`underline`]},intent:(0,a.makeVariants)({main:[],support:[],accent:[],ai:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[],surfaceInverse:[]}),size:(0,a.makeVariants)({sm:[`min-w-sz-32`,`h-sz-32`],md:[`min-w-sz-44`,`h-sz-44`],lg:[`min-w-sz-56`,`h-sz-56`]}),shape:(0,a.makeVariants)({rounded:[`rounded-button`],square:[`rounded-0`],pill:[`rounded-full`]}),disabled:{true:[`cursor-not-allowed`,`opacity-dim-3`],false:[`cursor-pointer`]}},compoundVariants:[...s,...l,...u,...c,...d],defaultVariants:{design:`filled`,intent:`main`,size:`md`,shape:`rounded`}}),p=[`onClick`,`onMouseDown`,`onMouseUp`,`onMouseEnter`,`onMouseLeave`,`onMouseOver`,`onMouseOut`,`onKeyDown`,`onKeyPress`,`onKeyUp`,`onSubmit`],m=({children:a,design:s=`filled`,disabled:c=!1,ariaDisabled:l=!1,intent:u=`main`,isLoading:d=!1,loadingLabel:m,loadingText:h,shape:g=`pill`,size:_=`md`,asChild:v,className:y,underline:b=!1,appearance:x,ref:S,...C})=>{let w=v?e.Slot:`button`,T=!!c||!!l||d,E=!!c&&!l,D=(0,r.useMemo)(()=>{let e={};return T&&p.forEach(t=>{e[t]=e=>{e.type===`keydown`&&e.key===`Tab`||e.preventDefault()}}),e},[T]),O={size:`current`,className:h?`inline-block`:`absolute`,...m&&{"aria-label":m}},k=x?o({className:y,appearance:x,disabled:T,size:_,underline:b}):f({className:y,design:s,disabled:T,intent:u,shape:g,size:_,underline:b});return(0,i.jsx)(w,{"data-spark-component":`button`,...w===`button`&&{type:`button`},ref:S,className:k,disabled:E,"aria-disabled":T?!0:void 0,"aria-busy":d,"aria-live":d?`assertive`:`off`,...C,...D,children:e.wrapPolymorphicSlot(v,a,e=>d?(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(t.t,{...O}),h,(0,i.jsx)(`div`,{"aria-hidden":!0,className:(0,n.cx)(`gap-md`,h?`hidden`:`inline-flex opacity-0`),children:e})]}):e)})};m.displayName=`Button`,Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return m}});
-//# sourceMappingURL=button-D0s-21qo.js.map
+const e=require("./slot/index.js"),t=require("./spinner-BAreohbs.js");let n=require("@spark-ui/internal-utils"),r=require("class-variance-authority"),i=require("react"),a=require("react/jsx-runtime");var o=(0,r.cva)([`u-shadow-border-transition`,`box-border inline-flex items-center justify-center gap-md whitespace-nowrap`,`default:px-lg`,`rounded-button`,`text-body-1-highlight`,`focus-visible:u-outline`],{variants:{underline:{true:[`underline`]},appearance:{primary:[`bg-main`,`text-on-main`,`rounded-button`,`enabled:hover:bg-main-hovered`,`enabled:active:bg-main-hovered`,`enabled:focus-visible:bg-main-hovered`],secondary:[`bg-support`,`text-on-support`,`rounded-button`,`enabled:hover:bg-support-hovered`,`enabled:active:bg-support-hovered`,`enabled:focus-visible:bg-support-hovered`],tertiary:[`border-outline`,`border-sm`,`bg-surface`,`text-on-surface`,`rounded-button`,`enabled:hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`enabled:focus-visible:bg-surface-hovered`],contrast:[`bg-surface`,`text-on-surface`,`rounded-button`,`enabled:hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`enabled:focus-visible:bg-surface-hovered`],ghost:[`text-on-surface default:-mx-md px-md enabled:hover:bg-surface-hovered`],success:[`border-outline`,`border-sm`,`bg-transparent`,`text-success`,`rounded-button`,`enabled:hover:bg-success-container`,`enabled:active:bg-success-container`,`enabled:focus-visible:bg-success-container`],danger:[`border-outline`,`border-sm`,`bg-transparent`,`text-error`,`rounded-button`,`enabled:hover:bg-error-container`,`enabled:active:bg-error-container`,`enabled:focus-visible:bg-error-container`],boost:[`bg-accent`,`text-on-accent`,`rounded-button`,`enabled:hover:bg-accent-hovered`,`enabled:active:bg-accent-hovered`,`enabled:focus-visible:bg-accent-hovered`],AI:[`bg-ai`,`text-on-ai`,`rounded-button`,`enabled:hover:bg-ai-hovered`,`enabled:active:bg-ai-hovered`,`enabled:focus-visible:bg-ai-hovered`]},size:(0,n.makeVariants)({sm:[`min-w-sz-32 h-sz-32`],md:[`min-w-sz-44 h-sz-44`],lg:[`min-w-sz-56 h-sz-56`]}),disabled:{true:[`cursor-not-allowed opacity-dim-3`],false:[`cursor-pointer`]}},defaultVariants:{size:`md`}}),s=[{intent:`main`,design:`filled`,class:(0,n.tw)([`bg-main`,`text-on-main`,`hover:bg-main-hovered`,`enabled:active:bg-main-hovered`,`focus-visible:bg-main-hovered`])},{intent:`support`,design:`filled`,class:(0,n.tw)([`bg-support`,`text-on-support`,`hover:bg-support-hovered`,`enabled:active:bg-support-hovered`,`focus-visible:bg-support-hovered`])},{intent:`accent`,design:`filled`,class:(0,n.tw)([`bg-accent`,`text-on-accent`,`hover:bg-accent-hovered`,`enabled:active:bg-accent-hovered`,`focus-visible:bg-accent-hovered`])},{intent:`ai`,design:`filled`,class:(0,n.tw)([`bg-ai`,`text-on-ai`,`hover:bg-ai-hovered`,`enabled:active:bg-ai-hovered`,`focus-visible:bg-ai-hovered`])},{intent:`success`,design:`filled`,class:(0,n.tw)([`bg-success`,`text-on-success`,`hover:bg-success-hovered`,`enabled:active:bg-success-hovered`,`focus-visible:bg-success-hovered`])},{intent:`alert`,design:`filled`,class:(0,n.tw)([`bg-alert`,`text-on-alert`,`hover:bg-alert-hovered`,`enabled:active:bg-alert-hovered`,`focus-visible:bg-alert-hovered`])},{intent:`danger`,design:`filled`,class:(0,n.tw)([`text-on-error bg-error`,`hover:bg-error-hovered enabled:active:bg-error-hovered`,`focus-visible:bg-error-hovered`])},{intent:`info`,design:`filled`,class:(0,n.tw)([`text-on-error bg-info`,`hover:bg-info-hovered enabled:active:bg-info-hovered`,`focus-visible:bg-info-hovered`])},{intent:`neutral`,design:`filled`,class:(0,n.tw)([`bg-neutral`,`text-on-neutral`,`hover:bg-neutral-hovered`,`enabled:active:bg-neutral-hovered`,`focus-visible:bg-neutral-hovered`])},{intent:`surface`,design:`filled`,class:(0,n.tw)([`bg-surface`,`text-on-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`filled`,class:(0,n.tw)([`bg-surface-inverse`,`text-on-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],c=[{intent:`main`,design:`ghost`,class:(0,n.tw)([`text-on-main-container`,`hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`])},{intent:`support`,design:`ghost`,class:(0,n.tw)([`text-on-support-container`,`hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`])},{intent:`accent`,design:`ghost`,class:(0,n.tw)([`text-on-accent-container`,`hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`])},{intent:`ai`,design:`ghost`,class:(0,n.tw)([`text-on-ai-container`,`hover:bg-ai/dim-5`,`enabled:active:bg-ai/dim-5`,`focus-visible:bg-ai/dim-5`])},{intent:`success`,design:`ghost`,class:(0,n.tw)([`text-on-success-container`,`hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`])},{intent:`alert`,design:`ghost`,class:(0,n.tw)([`text-on-alert-container`,`hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`])},{intent:`danger`,design:`ghost`,class:(0,n.tw)([`text-on-error-container`,`hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`])},{intent:`info`,design:`ghost`,class:(0,n.tw)([`text-on-info-container`,`hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`])},{intent:`neutral`,design:`ghost`,class:(0,n.tw)([`text-on-neutral-container`,`hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`])},{intent:`surface`,design:`ghost`,class:(0,n.tw)([`text-surface`,`hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`])},{intent:`surfaceInverse`,design:`ghost`,class:(0,n.tw)([`text-surface-inverse`,`hover:bg-surface-inverse/dim-5`,`enabled:active:bg-surface-inverse/dim-5`,`focus-visible:bg-surface-inverse/dim-5`])}],l=[{intent:`main`,design:`outlined`,class:(0,n.tw)([`hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`,`text-main`])},{intent:`support`,design:`outlined`,class:(0,n.tw)([`hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`,`text-support`])},{intent:`accent`,design:`outlined`,class:(0,n.tw)([`hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`,`text-accent`])},{intent:`ai`,design:`outlined`,class:(0,n.tw)([`hover:bg-ai/dim-5`,`enabled:active:bg-ai/dim-5`,`focus-visible:bg-ai/dim-5`,`text-ai`])},{intent:`success`,design:`outlined`,class:(0,n.tw)([`hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`,`text-success`])},{intent:`alert`,design:`outlined`,class:(0,n.tw)([`hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`,`text-alert`])},{intent:`danger`,design:`outlined`,class:(0,n.tw)([`hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`,`text-error`])},{intent:`info`,design:`outlined`,class:(0,n.tw)([`hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`,`text-info`])},{intent:`neutral`,design:`outlined`,class:(0,n.tw)([`hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`,`text-neutral`])},{intent:`surface`,design:`outlined`,class:(0,n.tw)([`hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`,`text-surface`])},{intent:`surfaceInverse`,design:`outlined`,class:(0,n.tw)([`hover:bg-surface-inverse/dim-5`,`enabled:active:bg-surface-inverse/dim-5`,`focus-visible:bg-surface-inverse/dim-5`,`text-surface-inverse`])}],u=[{intent:`main`,design:`tinted`,class:(0,n.tw)([`bg-main-container`,`text-on-main-container`,`hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`])},{intent:`support`,design:`tinted`,class:(0,n.tw)([`bg-support-container`,`text-on-support-container`,`hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`])},{intent:`accent`,design:`tinted`,class:(0,n.tw)([`bg-accent-container`,`text-on-accent-container`,`hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`])},{intent:`ai`,design:`tinted`,class:(0,n.tw)([`bg-ai-container`,`text-on-ai-container`,`hover:bg-ai-container-hovered`,`enabled:active:bg-ai-container-hovered`,`focus-visible:bg-ai-container-hovered`])},{intent:`success`,design:`tinted`,class:(0,n.tw)([`bg-success-container`,`text-on-success-container`,`hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`])},{intent:`alert`,design:`tinted`,class:(0,n.tw)([`bg-alert-container`,`text-on-alert-container`,`hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`])},{intent:`danger`,design:`tinted`,class:(0,n.tw)([`bg-error-container`,`text-on-error-container`,`hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`])},{intent:`info`,design:`tinted`,class:(0,n.tw)([`bg-info-container`,`text-on-info-container`,`hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`])},{intent:`neutral`,design:`tinted`,class:(0,n.tw)([`bg-neutral-container`,`text-on-neutral-container`,`hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`])},{intent:`surface`,design:`tinted`,class:(0,n.tw)([`bg-surface`,`text-on-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`tinted`,class:(0,n.tw)([`bg-surface-inverse`,`text-on-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],d=[{intent:`main`,design:`contrast`,class:(0,n.tw)([`text-on-main-contaier bg-surface`,`hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`])},{intent:`support`,design:`contrast`,class:(0,n.tw)([`text-on-support-container bg-surface`,`hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`])},{intent:`accent`,design:`contrast`,class:(0,n.tw)([`text-on-accent-container bg-surface`,`hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`])},{intent:`ai`,design:`contrast`,class:(0,n.tw)([`text-on-ai-container bg-surface`,`hover:bg-ai-container-hovered`,`enabled:active:bg-ai-container-hovered`,`focus-visible:bg-ai-container-hovered`])},{intent:`success`,design:`contrast`,class:(0,n.tw)([`text-on-success-container bg-surface`,`hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`])},{intent:`alert`,design:`contrast`,class:(0,n.tw)([`text-on-alert-container bg-surface`,`hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`])},{intent:`danger`,design:`contrast`,class:(0,n.tw)([`text-on-error-container bg-surface`,`hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`])},{intent:`info`,design:`contrast`,class:(0,n.tw)([`text-on-info-container bg-surface`,`hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`])},{intent:`neutral`,design:`contrast`,class:(0,n.tw)([`text-on-neutral-container bg-surface`,`hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`])},{intent:`surface`,design:`contrast`,class:(0,n.tw)([`text-on-surface bg-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`contrast`,class:(0,n.tw)([`text-on-surface-inverse bg-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],f=(0,r.cva)([`u-shadow-border-transition`,`box-border inline-flex items-center justify-center gap-md whitespace-nowrap`,`default:px-lg`,`text-body-1-highlight`,`focus-visible:u-outline`],{variants:{design:(0,n.makeVariants)({filled:[],outlined:[`bg-transparent`,`border-sm`,`border-current`],tinted:[],ghost:[`default:-mx-md px-md hover:bg-main/dim-5`],contrast:[]}),underline:{true:[`underline`]},intent:(0,n.makeVariants)({main:[],support:[],accent:[],ai:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[],surfaceInverse:[]}),size:(0,n.makeVariants)({sm:[`min-w-sz-32`,`h-sz-32`],md:[`min-w-sz-44`,`h-sz-44`],lg:[`min-w-sz-56`,`h-sz-56`]}),shape:(0,n.makeVariants)({rounded:[`rounded-button`],square:[`rounded-0`],pill:[`rounded-full`]}),disabled:{true:[`cursor-not-allowed`,`opacity-dim-3`],false:[`cursor-pointer`]}},compoundVariants:[...s,...l,...u,...c,...d],defaultVariants:{design:`filled`,intent:`main`,size:`md`,shape:`rounded`}}),p=[`onClick`,`onMouseDown`,`onMouseUp`,`onMouseEnter`,`onMouseLeave`,`onMouseOver`,`onMouseOut`,`onKeyDown`,`onKeyPress`,`onKeyUp`,`onSubmit`],m=({children:n,design:s=`filled`,disabled:c=!1,ariaDisabled:l=!1,intent:u=`main`,isLoading:d=!1,loadingLabel:m,loadingText:h,shape:g=`pill`,size:_=`md`,asChild:v,className:y,underline:b=!1,appearance:x,ref:S,...C})=>{let w=v?e.Slot:`button`,T=!!c||!!l||d,E=!!c&&!l,D=(0,i.useMemo)(()=>{let e={};return T&&p.forEach(t=>{e[t]=e=>{e.type===`keydown`&&e.key===`Tab`||e.preventDefault()}}),e},[T]),O={size:`current`,className:h?`inline-block`:`absolute`,...m&&{"aria-label":m}},k=x?o({className:y,appearance:x,disabled:T,size:_,underline:b}):f({className:y,design:s,disabled:T,intent:u,shape:g,size:_,underline:b});return(0,a.jsx)(w,{"data-spark-component":`button`,...w===`button`&&{type:`button`},ref:S,className:k,disabled:E,"aria-disabled":T?!0:void 0,"aria-busy":d,"aria-live":d?`assertive`:`off`,...C,...D,children:e.wrapPolymorphicSlot(v,n,e=>d?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.t,{...O}),h,(0,a.jsx)(`div`,{"aria-hidden":!0,className:(0,r.cx)(`gap-md`,h?`hidden`:`inline-flex opacity-0`),children:e})]}):e)})};m.displayName=`Button`,Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return m}});
+//# sourceMappingURL=button-3vvMrf1L.js.map