@ngrok/mantle 0.73.4 → 0.74.0

package/dist/accordion.d.ts

@@ -184,7 +184,7 @@ declare const Accordion: {
     ({
       className,
       ...props
-    }: Omit<IconProps, "svg">): import("react/jsx-runtime").JSX.Element;
+    }: Omit<IconProps, "svg">): import("react").JSX.Element;
     displayName: string;
   };
 };

package/dist/agent.json

@@ -1,6 +1,6 @@
 {
 	"name": "@ngrok/mantle",
-	"version": "0.73.4",
+	"version": "0.74.0",
 	"origin": "https://mantle.ngrok.com",
 	"endpoints": {
 		"docs": "https://mantle.ngrok.com/",
@@ -54,6 +54,7 @@
 		"@ngrok/mantle/pagination",
 		"@ngrok/mantle/popover",
 		"@ngrok/mantle/progress",
+		"@ngrok/mantle/qr-code",
 		"@ngrok/mantle/radio-group",
 		"@ngrok/mantle/sandboxed-on-click",
 		"@ngrok/mantle/select",

package/dist/alert-dialog.d.ts

@@ -1,7 +1,7 @@
 import { t as SvgAttributes } from "./types-BvUzforF.js";
 import { t as DeepNonNullable } from "./deep-non-nullable-BxRoySYR.js";
 import { t as WithAsChild } from "./as-child-uN_018tj.js";
-import { t as Root$1 } from "./primitive-D_-h74Kt.js";
+import { t as Root$1 } from "./primitive-FoWela9a.js";
 import { ComponentProps, ReactNode } from "react";
 
 //#region src/components/alert-dialog/alert-dialog.d.ts
@@ -54,7 +54,7 @@ type AlertDialogProps = ComponentProps<typeof Root$1> & {
 declare function Root({
   priority,
   ...props
-}: AlertDialogProps): import("react/jsx-runtime").JSX.Element;
+}: AlertDialogProps): import("react").JSX.Element;
 declare namespace Root {
   var displayName: string;
 }
@@ -198,7 +198,7 @@ declare const AlertDialog: {
    * ```
    */
   readonly Action: import("react").ForwardRefExoticComponent<(Omit<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Partial<DeepNonNullable<import("class-variance-authority").VariantProps<(props?: ({
-    appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
+    appearance?: "link" | "ghost" | "outlined" | "filled" | null | undefined;
     isLoading?: boolean | null | undefined;
     priority?: "danger" | "neutral" | "default" | null | undefined;
   } & import("class-variance-authority/types").ClassProp) | undefined) => string>>> & {
@@ -208,7 +208,7 @@ declare const AlertDialog: {
     asChild: true;
     type?: ComponentProps<"button">["type"];
   }, "ref"> | Omit<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Partial<DeepNonNullable<import("class-variance-authority").VariantProps<(props?: ({
-    appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
+    appearance?: "link" | "ghost" | "outlined" | "filled" | null | undefined;
     isLoading?: boolean | null | undefined;
     priority?: "danger" | "neutral" | "default" | null | undefined;
   } & import("class-variance-authority/types").ClassProp) | undefined) => string>>> & {
@@ -293,7 +293,7 @@ declare const AlertDialog: {
    * ```
    */
   readonly Cancel: import("react").ForwardRefExoticComponent<(Omit<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Partial<DeepNonNullable<import("class-variance-authority").VariantProps<(props?: ({
-    appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
+    appearance?: "link" | "ghost" | "outlined" | "filled" | null | undefined;
     isLoading?: boolean | null | undefined;
     priority?: "danger" | "neutral" | "default" | null | undefined;
   } & import("class-variance-authority/types").ClassProp) | undefined) => string>>> & {
@@ -303,7 +303,7 @@ declare const AlertDialog: {
     asChild: true;
     type?: ComponentProps<"button">["type"];
   }, "ref"> | Omit<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Partial<DeepNonNullable<import("class-variance-authority").VariantProps<(props?: ({
-    appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
+    appearance?: "link" | "ghost" | "outlined" | "filled" | null | undefined;
     isLoading?: boolean | null | undefined;
     priority?: "danger" | "neutral" | "default" | null | undefined;
   } & import("class-variance-authority/types").ClassProp) | undefined) => string>>> & {

package/dist/alert.d.ts

@@ -145,7 +145,7 @@ declare const Alert: {
       icon,
       style,
       ...props
-    }: AlertDismissIconButtonProps): import("react/jsx-runtime").JSX.Element;
+    }: AlertDismissIconButtonProps): import("react").JSX.Element;
     displayName: string;
   };
   /**

package/dist/alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert.js","names":[],"sources":["../src/components/alert/alert.tsx"],"sourcesContent":["import { CheckCircleIcon } from \"@phosphor-icons/react/CheckCircle\";\nimport { InfoIcon } from \"@phosphor-icons/react/Info\";\nimport { MegaphoneIcon } from \"@phosphor-icons/react/Megaphone\";\nimport { WarningIcon } from \"@phosphor-icons/react/Warning\";\nimport { WarningDiamondIcon } from \"@phosphor-icons/react/WarningDiamond\";\nimport { XIcon } from \"@phosphor-icons/react/X\";\nimport { cva } from \"class-variance-authority\";\nimport type { ComponentProps, ComponentRef, HTMLAttributes, ReactNode } from \"react\";\nimport { createContext, forwardRef, useContext, useMemo } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { $cssProperties, type WithAsChild } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { IconButton, type IconButtonProps } from \"../button/icon-button.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { Slot } from \"../slot/index.js\";\n\nconst priorities = [\n\t//,\n\t\"danger\",\n\t\"important\",\n\t\"info\",\n\t// \"neutral\",\n\t\"success\",\n\t\"warning\",\n] as const;\ntype Priority = (typeof priorities)[number];\n\nconst appearances = [\"banner\", \"default\"] as const;\ntype Appearance = (typeof appearances)[number];\n\ntype AlertContextValue = {\n\tpriority: Priority;\n};\n\nconst AlertContext = createContext<AlertContextValue | null>(null);\n\nconst defaultDismissIcon = <XIcon />;\n\nfunction useAlertContext() {\n\tconst context = useContext(AlertContext);\n\tinvariant(context, \"useAlertContext hook used outside of Alert parent!\");\n\treturn context;\n}\n\nconst alertVariants = cva(\n\t\"relative flex w-full gap-1.5 rounded-md border p-2.5 text-sm font-sans\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * The priority of the Alert. Indicates the importance or impact level of the Alert,\n\t\t\t * affecting its color and styling to communicate its purpose to the user.\n\t\t\t */\n\t\t\tpriority: {\n\t\t\t\tdanger:\n\t\t\t\t\t\"border-danger-500/50 bg-danger-500/10 text-danger-700 [&_code]:bg-danger-500/10 [&_code]:border-danger-500/20 [&_code]:text-danger-900 [&_a]:text-danger-700 [&_a]:underline\",\n\t\t\t\timportant:\n\t\t\t\t\t\"border-important-500/50 bg-important-500/10 text-important-700 [&_code]:bg-important-500/10 [&_code]:border-important-500/20 [&_code]:text-important-900 [&_a]:text-important-700 [&_a]:underline\",\n\t\t\t\tinfo: \"border-info-500/50 bg-info-500/10 text-info-700 [&_code]:bg-info-500/10 [&_code]:border-info-500/20 [&_code]:text-info-900 [&_a]:text-info-700 [&_a]:underline\",\n\t\t\t\t// neutral: \"border-neutral-500/50 bg-neutral-500/10 text-neutral-700\",\n\t\t\t\tsuccess:\n\t\t\t\t\t\"border-success-500/50 bg-success-500/10 text-success-700 [&_code]:bg-success-500/10 [&_code]:border-success-500/20 [&_code]:text-success-900 [&_a]:text-success-700 [&_a]:underline\",\n\t\t\t\twarning:\n\t\t\t\t\t\"border-warning-500/50 bg-warning-500/10 text-warning-700 [&_code]:bg-warning-500/10 [&_code]:border-warning-500/20 [&_code]:text-warning-900 [&_a]:text-warning-700 [&_a]:underline\",\n\t\t\t} as const satisfies Record<Priority, string>,\n\t\t\t/**\n\t\t\t * Controls the visual style of the Alert.\n\t\t\t * - \"default\" provides standard rounded corners and borders.\n\t\t\t * - \"banner\" creates a banner-style alert with no rounded corners, sticky positioning, and no left/right borders.\n\t\t\t *\n\t\t\t * @default \"default\"\n\t\t\t */\n\t\t\tappearance: {\n\t\t\t\tbanner: \"border-x-0 border-t-0 rounded-none z-50 sticky\",\n\t\t\t\tdefault: \"\",\n\t\t\t} as const satisfies Record<Appearance, string>,\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tappearance: \"banner\",\n\t\t\t\tclassName: \"\", // placeholder for different bg-color (color-mix w/ bg-popover)\n\t\t\t},\n\t\t\t{\n\t\t\t\tpriority: \"important\",\n\t\t\t\tappearance: \"banner\",\n\t\t\t\tclassName: \"\", // placeholder for different bg-color (color-mix w/ bg-popover)\n\t\t\t},\n\t\t\t{\n\t\t\t\tpriority: \"info\",\n\t\t\t\tappearance: \"banner\",\n\t\t\t\tclassName: \"\", // placeholder for different bg-color (color-mix w/ bg-popover)\n\t\t\t},\n\t\t\t{\n\t\t\t\tpriority: \"success\",\n\t\t\t\tappearance: \"banner\",\n\t\t\t\tclassName: \"\", // placeholder for different bg-color (color-mix w/ bg-popover)\n\t\t\t},\n\t\t\t{\n\t\t\t\tpriority: \"warning\",\n\t\t\t\tappearance: \"banner\",\n\t\t\t\tclassName: \"\", // placeholder for different bg-color (color-mix w/ bg-popover)\n\t\t\t},\n\t\t],\n\t},\n);\n\ntype AlertProps = ComponentProps<\"div\"> & {\n\t/**\n\t * Indicates the importance or impact level of the Alert, affecting its\n\t * color and styling to communicate its purpose to the user.\n\t */\n\tpriority: Priority;\n\t/**\n\t * Controls the visual style of the Alert.\n\t * - \"default\" provides standard rounded corners and borders.\n\t * - \"banner\" creates a banner-style alert with no rounded corners, sticky positioning, and no left/right borders.\n\t *\n\t * @default \"default\"\n\t */\n\tappearance?: Appearance;\n};\n\n/**\n * Displays a callout for user attention. Root container for all Alert sub-components.\n *\n * @see https://mantle.ngrok.com/components/alert#alertroot\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *      <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst Root = forwardRef<ComponentRef<\"div\">, AlertProps>(\n\t({ appearance = \"default\", className, priority, ...props }, ref) => {\n\t\tconst context: AlertContextValue = useMemo(() => ({ priority }), [priority]);\n\n\t\treturn (\n\t\t\t<AlertContext.Provider value={context}>\n\t\t\t\t<div\n\t\t\t\t\tref={ref}\n\t\t\t\t\tdata-slot=\"alert\"\n\t\t\t\t\tclassName={cx(alertVariants({ appearance, priority }), className)}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t</AlertContext.Provider>\n\t\t);\n\t},\n);\nRoot.displayName = \"Alert\";\n\ntype AlertIconProps = Omit<SvgAttributes, \"children\"> & {\n\t/**\n\t * An optional icon that renders in place of the default icon for the Alert priority.\n\t */\n\tsvg?: ReactNode;\n};\n\n/**\n * Default `<AlertIcon>` icons for each priority.\n */\nconst defaultIcons = {\n\tdanger: <WarningIcon />,\n\timportant: <MegaphoneIcon mirrored />,\n\tinfo: <InfoIcon />,\n\t// neutral: <BellRinging />,\n\tsuccess: <CheckCircleIcon />,\n\twarning: <WarningDiamondIcon />,\n} as const satisfies Record<Priority, ReactNode>;\n\n/**\n * An optional icon that visually represents the priority of the Alert.\n *\n * The default rendered icon be overridden with a custom icon using the `svg` prop.\n *\n * @see https://mantle.ngrok.com/components/alert#alerticon\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n * ```\n */\nconst Icon = forwardRef<ComponentRef<\"svg\">, AlertIconProps>(\n\t({ className, svg, ...props }, ref) => {\n\t\tconst ctx = useAlertContext();\n\t\tconst defaultIcon = defaultIcons[ctx.priority];\n\n\t\treturn (\n\t\t\t<SvgOnly\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"alert-icon\"\n\t\t\t\tclassName={cx(\"size-5\", className)}\n\t\t\t\tsvg={svg ?? defaultIcon}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nIcon.displayName = \"AlertIcon\";\n\n/**\n * The container for the content slot of an alert. Place the title and description as direct children.\n *\n * @see https://mantle.ngrok.com/components/alert#alertcontent\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst Content = forwardRef<ComponentRef<\"div\">, ComponentProps<\"div\">>(\n\t({ className, ...props }, ref) => (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tdata-slot=\"alert-content\"\n\t\t\tclassName={cx(\"min-w-0 flex-1 has-data-alert-dismiss:pr-6\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nContent.displayName = \"AlertContent\";\n\ntype AlertTitleProps = HTMLAttributes<HTMLHeadingElement> & WithAsChild;\n\n/**\n * The title of an alert. Default renders as an h5 element, use asChild to render something else.\n *\n * @see https://mantle.ngrok.com/components/alert#alerttitle\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst Title = forwardRef<HTMLHeadingElement, AlertTitleProps>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"h5\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"alert-title\"\n\t\t\t\tclassName={cx(\"font-medium\", className)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nTitle.displayName = \"AlertTitle\";\n\ntype AlertDescriptionProps = ComponentProps<\"div\"> & WithAsChild;\n\n/**\n * The optional description of an alert.\n * Renders as a `div` by default, but can be changed to any other element using\n * the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/alert#alertdescription\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n * ```\n */\nconst Description = forwardRef<ComponentRef<\"div\">, AlertDescriptionProps>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"alert-description\"\n\t\t\t\tclassName={cx(\"text-sm\", className)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nDescription.displayName = \"AlertDescription\";\n\nconst dismissTextColor = <T extends Priority = Priority>(priority: T) =>\n\t`var(--color-${priority}-700)`;\n\nconst dismissHoverColor = <T extends Priority = Priority>(priority: T) =>\n\t`var(--color-${priority}-800)`;\n\nconst dismissHoverBgColor = <T extends Priority = Priority>(priority: T) =>\n\t`color-mix(in oklab, var(--color-${priority}-500) 10%, transparent)`;\n\ntype AlertDismissIconButtonProps = Partial<Omit<IconButtonProps, \"icon\">> & {\n\t/**\n\t * An optional icon to render inside the dismiss button. Defaults to an X icon.\n\t */\n\ticon?: ReactNode;\n};\n\nconst DismissIconButton = ({\n\tsize = \"sm\",\n\ttype = \"button\",\n\tlabel = \"Dismiss Alert\",\n\tappearance = \"ghost\",\n\tclassName,\n\ticon = defaultDismissIcon,\n\tstyle,\n\t...props\n}: AlertDismissIconButtonProps) => {\n\tconst ctx = useAlertContext();\n\treturn (\n\t\t<IconButton\n\t\t\tappearance={appearance}\n\t\t\ticon={icon}\n\t\t\tlabel={label}\n\t\t\tsize={size}\n\t\t\tdata-slot=\"alert-dismiss-icon-button\"\n\t\t\tdata-alert-dismiss\n\t\t\tclassName={cx(\n\t\t\t\t\"right-1.5 top-1.5 absolute\",\n\t\t\t\t\"text-(--alert-dismiss-icon-color)\",\n\t\t\t\t\"not-disabled:hover:bg-(--alert-dismiss-hover-bg) not-disabled:hover:text-(--alert-dismiss-icon-hover-color)\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\ttype={type}\n\t\t\tstyle={$cssProperties({\n\t\t\t\t...style,\n\t\t\t\t\"--alert-dismiss-icon-color\": dismissTextColor(ctx.priority),\n\t\t\t\t\"--alert-dismiss-icon-hover-color\": dismissHoverColor(ctx.priority),\n\t\t\t\t\"--alert-dismiss-hover-bg\": dismissHoverBgColor(ctx.priority),\n\t\t\t})}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\nDismissIconButton.displayName = \"AlertDismissIconButton\";\n\n/**\n * Displays a callout for user attention.\n *\n * @see https://mantle.ngrok.com/components/alert\n *\n * @example\n * Composition:\n * ```\n * Alert.Root\n * ├── Alert.Icon\n * └── Alert.Content\n *     ├── Alert.Title\n *     ├── Alert.Description\n *     └── Alert.DismissIconButton\n * ```\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *      <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst Alert = {\n\t/**\n\t * The root container of the alert component.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alertroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.Description>Alert description</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * The container for the content slot of an alert.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alertcontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.Description>Alert description text.</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * The optional description of an alert.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alertdescription\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.Description>Alert description text.</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tDescription,\n\t/**\n\t * An optional dismiss button that can be used to close the alert.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alertdismissiconbutton\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.DismissIconButton />\n\t *     <Alert.Description>Alert description text.</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tDismissIconButton,\n\t/**\n\t * An optional icon that visually represents the priority of the Alert.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alerticon\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.Description>Alert description text.</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tIcon,\n\t/**\n\t * The title of an alert.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alerttitle\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.Description>Alert description text.</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tTitle,\n} as const;\n\nexport {\n\t//,\n\tAlert,\n};\n"],"mappings":"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"}
+{"version":3,"file":"alert.js","names":[],"sources":["../src/components/alert/alert.tsx"],"sourcesContent":["import { CheckCircleIcon } from \"@phosphor-icons/react/CheckCircle\";\nimport { InfoIcon } from \"@phosphor-icons/react/Info\";\nimport { MegaphoneIcon } from \"@phosphor-icons/react/Megaphone\";\nimport { WarningIcon } from \"@phosphor-icons/react/Warning\";\nimport { WarningDiamondIcon } from \"@phosphor-icons/react/WarningDiamond\";\nimport { XIcon } from \"@phosphor-icons/react/X\";\nimport { cva } from \"class-variance-authority\";\nimport type { ComponentProps, ComponentRef, HTMLAttributes, ReactNode } from \"react\";\nimport { createContext, forwardRef, useContext, useMemo } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { $cssProperties, type WithAsChild } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { IconButton, type IconButtonProps } from \"../button/icon-button.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { Slot } from \"../slot/index.js\";\n\nconst priorities = [\n\t//,\n\t\"danger\",\n\t\"important\",\n\t\"info\",\n\t// \"neutral\",\n\t\"success\",\n\t\"warning\",\n] as const;\ntype Priority = (typeof priorities)[number];\n\nconst appearances = [\"banner\", \"default\"] as const;\ntype Appearance = (typeof appearances)[number];\n\ntype AlertContextValue = {\n\tpriority: Priority;\n};\n\nconst AlertContext = createContext<AlertContextValue | null>(null);\n\nconst defaultDismissIcon = <XIcon />;\n\nfunction useAlertContext() {\n\tconst context = useContext(AlertContext);\n\tinvariant(context, \"useAlertContext hook used outside of Alert parent!\");\n\treturn context;\n}\n\nconst alertVariants = cva(\n\t\"relative flex w-full gap-1.5 rounded-md border p-2.5 text-sm font-sans\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * The priority of the Alert. Indicates the importance or impact level of the Alert,\n\t\t\t * affecting its color and styling to communicate its purpose to the user.\n\t\t\t */\n\t\t\tpriority: {\n\t\t\t\tdanger:\n\t\t\t\t\t\"border-danger-500/50 bg-danger-500/10 text-danger-700 [&_code]:bg-danger-500/10 [&_code]:border-danger-500/20 [&_code]:text-danger-900 [&_a]:text-danger-700 [&_a]:underline\",\n\t\t\t\timportant:\n\t\t\t\t\t\"border-important-500/50 bg-important-500/10 text-important-700 [&_code]:bg-important-500/10 [&_code]:border-important-500/20 [&_code]:text-important-900 [&_a]:text-important-700 [&_a]:underline\",\n\t\t\t\tinfo: \"border-info-500/50 bg-info-500/10 text-info-700 [&_code]:bg-info-500/10 [&_code]:border-info-500/20 [&_code]:text-info-900 [&_a]:text-info-700 [&_a]:underline\",\n\t\t\t\t// neutral: \"border-neutral-500/50 bg-neutral-500/10 text-neutral-700\",\n\t\t\t\tsuccess:\n\t\t\t\t\t\"border-success-500/50 bg-success-500/10 text-success-700 [&_code]:bg-success-500/10 [&_code]:border-success-500/20 [&_code]:text-success-900 [&_a]:text-success-700 [&_a]:underline\",\n\t\t\t\twarning:\n\t\t\t\t\t\"border-warning-500/50 bg-warning-500/10 text-warning-700 [&_code]:bg-warning-500/10 [&_code]:border-warning-500/20 [&_code]:text-warning-900 [&_a]:text-warning-700 [&_a]:underline\",\n\t\t\t} as const satisfies Record<Priority, string>,\n\t\t\t/**\n\t\t\t * Controls the visual style of the Alert.\n\t\t\t * - \"default\" provides standard rounded corners and borders.\n\t\t\t * - \"banner\" creates a banner-style alert with no rounded corners, sticky positioning, and no left/right borders.\n\t\t\t *\n\t\t\t * @default \"default\"\n\t\t\t */\n\t\t\tappearance: {\n\t\t\t\tbanner: \"border-x-0 border-t-0 rounded-none z-50 sticky\",\n\t\t\t\tdefault: \"\",\n\t\t\t} as const satisfies Record<Appearance, string>,\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tappearance: \"banner\",\n\t\t\t\tclassName: \"\", // placeholder for different bg-color (color-mix w/ bg-popover)\n\t\t\t},\n\t\t\t{\n\t\t\t\tpriority: \"important\",\n\t\t\t\tappearance: \"banner\",\n\t\t\t\tclassName: \"\", // placeholder for different bg-color (color-mix w/ bg-popover)\n\t\t\t},\n\t\t\t{\n\t\t\t\tpriority: \"info\",\n\t\t\t\tappearance: \"banner\",\n\t\t\t\tclassName: \"\", // placeholder for different bg-color (color-mix w/ bg-popover)\n\t\t\t},\n\t\t\t{\n\t\t\t\tpriority: \"success\",\n\t\t\t\tappearance: \"banner\",\n\t\t\t\tclassName: \"\", // placeholder for different bg-color (color-mix w/ bg-popover)\n\t\t\t},\n\t\t\t{\n\t\t\t\tpriority: \"warning\",\n\t\t\t\tappearance: \"banner\",\n\t\t\t\tclassName: \"\", // placeholder for different bg-color (color-mix w/ bg-popover)\n\t\t\t},\n\t\t],\n\t},\n);\n\ntype AlertProps = ComponentProps<\"div\"> & {\n\t/**\n\t * Indicates the importance or impact level of the Alert, affecting its\n\t * color and styling to communicate its purpose to the user.\n\t */\n\tpriority: Priority;\n\t/**\n\t * Controls the visual style of the Alert.\n\t * - \"default\" provides standard rounded corners and borders.\n\t * - \"banner\" creates a banner-style alert with no rounded corners, sticky positioning, and no left/right borders.\n\t *\n\t * @default \"default\"\n\t */\n\tappearance?: Appearance;\n};\n\n/**\n * Displays a callout for user attention. Root container for all Alert sub-components.\n *\n * @see https://mantle.ngrok.com/components/alert#alertroot\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *      <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst Root = forwardRef<ComponentRef<\"div\">, AlertProps>(\n\t({ appearance = \"default\", className, priority, ...props }, ref) => {\n\t\tconst context: AlertContextValue = useMemo(() => ({ priority }), [priority]);\n\n\t\treturn (\n\t\t\t<AlertContext.Provider value={context}>\n\t\t\t\t<div\n\t\t\t\t\tref={ref}\n\t\t\t\t\tdata-slot=\"alert\"\n\t\t\t\t\tclassName={cx(alertVariants({ appearance, priority }), className)}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t</AlertContext.Provider>\n\t\t);\n\t},\n);\nRoot.displayName = \"Alert\";\n\ntype AlertIconProps = Omit<SvgAttributes, \"children\"> & {\n\t/**\n\t * An optional icon that renders in place of the default icon for the Alert priority.\n\t */\n\tsvg?: ReactNode;\n};\n\n/**\n * Default `<AlertIcon>` icons for each priority.\n */\nconst defaultIcons = {\n\tdanger: <WarningIcon />,\n\timportant: <MegaphoneIcon mirrored />,\n\tinfo: <InfoIcon />,\n\t// neutral: <BellRinging />,\n\tsuccess: <CheckCircleIcon />,\n\twarning: <WarningDiamondIcon />,\n} as const satisfies Record<Priority, ReactNode>;\n\n/**\n * An optional icon that visually represents the priority of the Alert.\n *\n * The default rendered icon be overridden with a custom icon using the `svg` prop.\n *\n * @see https://mantle.ngrok.com/components/alert#alerticon\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n * ```\n */\nconst Icon = forwardRef<ComponentRef<\"svg\">, AlertIconProps>(\n\t({ className, svg, ...props }, ref) => {\n\t\tconst ctx = useAlertContext();\n\t\tconst defaultIcon = defaultIcons[ctx.priority];\n\n\t\treturn (\n\t\t\t<SvgOnly\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"alert-icon\"\n\t\t\t\tclassName={cx(\"size-5\", className)}\n\t\t\t\tsvg={svg ?? defaultIcon}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nIcon.displayName = \"AlertIcon\";\n\n/**\n * The container for the content slot of an alert. Place the title and description as direct children.\n *\n * @see https://mantle.ngrok.com/components/alert#alertcontent\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst Content = forwardRef<ComponentRef<\"div\">, ComponentProps<\"div\">>(\n\t({ className, ...props }, ref) => (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tdata-slot=\"alert-content\"\n\t\t\tclassName={cx(\"min-w-0 flex-1 has-data-alert-dismiss:pr-6\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nContent.displayName = \"AlertContent\";\n\ntype AlertTitleProps = HTMLAttributes<HTMLHeadingElement> & WithAsChild;\n\n/**\n * The title of an alert. Default renders as an h5 element, use asChild to render something else.\n *\n * @see https://mantle.ngrok.com/components/alert#alerttitle\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst Title = forwardRef<HTMLHeadingElement, AlertTitleProps>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"h5\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"alert-title\"\n\t\t\t\tclassName={cx(\"font-medium\", className)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nTitle.displayName = \"AlertTitle\";\n\ntype AlertDescriptionProps = ComponentProps<\"div\"> & WithAsChild;\n\n/**\n * The optional description of an alert.\n * Renders as a `div` by default, but can be changed to any other element using\n * the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/alert#alertdescription\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n * ```\n */\nconst Description = forwardRef<ComponentRef<\"div\">, AlertDescriptionProps>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"alert-description\"\n\t\t\t\tclassName={cx(\"text-sm\", className)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nDescription.displayName = \"AlertDescription\";\n\nconst dismissTextColor = <T extends Priority = Priority>(priority: T) =>\n\t`var(--color-${priority}-700)`;\n\nconst dismissHoverColor = <T extends Priority = Priority>(priority: T) =>\n\t`var(--color-${priority}-800)`;\n\nconst dismissHoverBgColor = <T extends Priority = Priority>(priority: T) =>\n\t`color-mix(in oklab, var(--color-${priority}-500) 10%, transparent)`;\n\ntype AlertDismissIconButtonProps = Partial<Omit<IconButtonProps, \"icon\">> & {\n\t/**\n\t * An optional icon to render inside the dismiss button. Defaults to an X icon.\n\t */\n\ticon?: ReactNode;\n};\n\nconst DismissIconButton = ({\n\tsize = \"sm\",\n\ttype = \"button\",\n\tlabel = \"Dismiss Alert\",\n\tappearance = \"ghost\",\n\tclassName,\n\ticon = defaultDismissIcon,\n\tstyle,\n\t...props\n}: AlertDismissIconButtonProps) => {\n\tconst ctx = useAlertContext();\n\treturn (\n\t\t<IconButton\n\t\t\tappearance={appearance}\n\t\t\ticon={icon}\n\t\t\tlabel={label}\n\t\t\tsize={size}\n\t\t\tdata-slot=\"alert-dismiss-icon-button\"\n\t\t\tdata-alert-dismiss\n\t\t\tclassName={cx(\n\t\t\t\t\"right-1.5 top-1.5 absolute\",\n\t\t\t\t\"text-(--alert-dismiss-icon-color)\",\n\t\t\t\t\"not-disabled:hover:bg-(--alert-dismiss-hover-bg) not-disabled:hover:text-(--alert-dismiss-icon-hover-color)\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\ttype={type}\n\t\t\tstyle={$cssProperties({\n\t\t\t\t...style,\n\t\t\t\t\"--alert-dismiss-icon-color\": dismissTextColor(ctx.priority),\n\t\t\t\t\"--alert-dismiss-icon-hover-color\": dismissHoverColor(ctx.priority),\n\t\t\t\t\"--alert-dismiss-hover-bg\": dismissHoverBgColor(ctx.priority),\n\t\t\t})}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\nDismissIconButton.displayName = \"AlertDismissIconButton\";\n\n/**\n * Displays a callout for user attention.\n *\n * @see https://mantle.ngrok.com/components/alert\n *\n * @example\n * Composition:\n * ```\n * Alert.Root\n * ├── Alert.Icon\n * └── Alert.Content\n *     ├── Alert.Title\n *     ├── Alert.Description\n *     └── Alert.DismissIconButton\n * ```\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *      <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst Alert = {\n\t/**\n\t * The root container of the alert component.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alertroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.Description>Alert description</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * The container for the content slot of an alert.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alertcontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.Description>Alert description text.</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * The optional description of an alert.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alertdescription\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.Description>Alert description text.</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tDescription,\n\t/**\n\t * An optional dismiss button that can be used to close the alert.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alertdismissiconbutton\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.DismissIconButton />\n\t *     <Alert.Description>Alert description text.</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tDismissIconButton,\n\t/**\n\t * An optional icon that visually represents the priority of the Alert.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alerticon\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.Description>Alert description text.</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tIcon,\n\t/**\n\t * The title of an alert.\n\t *\n\t * @see https://mantle.ngrok.com/components/alert#alerttitle\n\t *\n\t * @example\n\t * ```tsx\n\t * <Alert.Root priority=\"info\">\n\t *   <Alert.Icon />\n\t *   <Alert.Content>\n\t *     <Alert.Title>Alert Title</Alert.Title>\n\t *     <Alert.Description>Alert description text.</Alert.Description>\n\t *   </Alert.Content>\n\t * </Alert.Root>\n\t * ```\n\t */\n\tTitle,\n} as const;\n\nexport {\n\t//,\n\tAlert,\n};\n"],"mappings":"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"}

package/dist/anchor-CcTY5SIz.js.map

@@ -1 +1 @@
-{"version":3,"file":"anchor-CcTY5SIz.js","names":[],"sources":["../src/components/anchor/anchor.tsx"],"sourcesContent":["import type { ComponentProps, ComponentRef, ReactNode } from \"react\";\nimport { Children, cloneElement, forwardRef, isValidElement } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Slot } from \"../slot/index.js\";\nimport type { Rel } from \"./types.js\";\n\n/**\n * The class names for the `Anchor` component which define the styles for the component.\n */\nconst anchorClassNames = (className?: string) =>\n\tcx(\n\t\t\"cursor-pointer rounded bg-transparent text-accent-600 hover:underline focus:outline-hidden focus-visible:ring-3 focus-visible:ring-focus-accent\",\n\t\tclassName,\n\t);\n\n/**\n * The props for the `Anchor` component.\n */\ntype AnchorProps = Omit<ComponentProps<\"a\">, \"rel\"> &\n\tWithAsChild & {\n\t\t/**\n\t\t * An icon to render inside the anchor\n\t\t */\n\t\ticon?: ReactNode;\n\t\t/**\n\t\t * The side that the icon will render on, if one is present\n\t\t * @default \"start\"\n\t\t */\n\t\ticonPlacement?: \"start\" | \"end\";\n\t\t/**\n\t\t * The rel attribute defines the relationship between a linked resource and the current document.\n\t\t *\n\t\t * Every keyword within a space-separated value should be unique within that value.\n\t\t *\n\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel\n\t\t */\n\t\trel?: Rel | (string & {}) | undefined | (Rel | (string & {}) | undefined | null)[];\n\t};\n\n/**\n * A styled hyperlink — a native `<a>` with mantle's link styling, focus\n * treatment, optional leading/trailing icon, and a safer default for the\n * `rel` attribute. Use for links that point _outside_ the current\n * application.\n *\n * **When to use**\n * - External URLs (docs, marketing pages, third-party sites).\n * - Links to files or `mailto:` / `tel:` destinations.\n *\n * **When not to use**\n * - Internal application routes — prefer the framework router's link\n *   primitive ({@link https://reactrouter.com/en/main/components/link `react-router` `<Link>`})\n *   so client-side navigation kicks in. You can keep mantle's styling by\n *   composing: `<Anchor asChild><Link to=\"/foo\">…</Link></Anchor>`.\n * - For triggering an action — use a {@link https://mantle.ngrok.com/components/button Button}\n *   instead. If it doesn't navigate, it's not a link.\n *\n * **Icons.** Pass `icon` (a phosphor or custom SVG) and optionally\n * `iconPlacement` (`\"start\"` default, or `\"end\"`) to render a small inline\n * icon — useful for \"external link\" or \"download\" affordances. Icons are\n * decorative; the link text must still describe the destination on its own.\n *\n * **Security.** When `target=\"_blank\"`, `rel` should include\n * `\"noopener noreferrer\"`. The `rel` prop accepts an array — duplicates\n * are de-duped and sorted, so it's safe to merge token sets.\n *\n * **Accessibility.** Link text must be self-describing — avoid \"click\n * here\" / \"read more\". For purely decorative icons, no extra labeling is\n * needed; for icon-only links, provide an `aria-label`.\n *\n * @see https://mantle.ngrok.com/components/anchor\n *\n * @example\n * ```tsx\n * import { Anchor } from \"@ngrok/mantle/anchor\";\n * import { BookIcon } from \"@phosphor-icons/react/Book\";\n * import { Link } from \"react-router\";\n *\n * // Basic external link.\n * <Anchor href=\"https://ngrok.com/\">ngrok.com</Anchor>\n *\n * // External link in a new tab with a leading icon.\n * <Anchor\n *   href=\"https://ngrok.com/docs\"\n *   target=\"_blank\"\n *   rel={[\"noopener\", \"noreferrer\"]}\n *   icon={<BookIcon />}\n * >\n *   ngrok docs\n * </Anchor>\n *\n * // Compose Anchor styling onto a react-router Link for internal navigation.\n * <Anchor asChild>\n *   <Link to=\"/dashboard\">Open dashboard</Link>\n * </Anchor>\n * ```\n */\nconst Anchor = forwardRef<ComponentRef<\"a\">, AnchorProps>(\n\t(\n\t\t{ asChild, children, className, rel: propRel, icon, iconPlacement = \"start\", ...props },\n\t\tref,\n\t) => {\n\t\tconst rel = resolveRel(propRel);\n\t\tconst componentProps = {\n\t\t\t\"data-slot\": \"anchor\",\n\t\t\tclassName: anchorClassNames(className),\n\t\t\tref,\n\t\t\trel,\n\t\t\t...props,\n\t\t};\n\n\t\tif (asChild) {\n\t\t\tconst singleChild = Children.only(children);\n\t\t\tinvariant(\n\t\t\t\tisValidElement<AnchorProps>(singleChild),\n\t\t\t\t\"When using `asChild`, Anchor must be passed a single child as a JSX tag.\",\n\t\t\t);\n\t\t\tconst grandchildren = singleChild.props?.children;\n\n\t\t\treturn (\n\t\t\t\t<Slot {...componentProps}>\n\t\t\t\t\t{cloneElement(\n\t\t\t\t\t\tsingleChild,\n\t\t\t\t\t\t{},\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{icon && iconPlacement === \"start\" && (\n\t\t\t\t\t\t\t\t<Icon className=\"inline-block mr-1.5\" svg={icon} />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{grandchildren}\n\t\t\t\t\t\t\t{icon && iconPlacement === \"end\" && (\n\t\t\t\t\t\t\t\t<Icon className=\"inline-block ml-1.5\" svg={icon} />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>,\n\t\t\t\t\t)}\n\t\t\t\t</Slot>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<a {...componentProps}>\n\t\t\t\t{icon && iconPlacement === \"start\" && <Icon className=\"inline-block mr-1.5\" svg={icon} />}\n\t\t\t\t{children}\n\t\t\t\t{icon && iconPlacement === \"end\" && <Icon className=\"inline-block ml-1.5\" svg={icon} />}\n\t\t\t</a>\n\t\t);\n\t},\n);\nAnchor.displayName = \"Anchor\";\n\n/**\n * Resolves the `rel` attribute to a string.\n *\n * If the value is an array, it will be filtered for empty values, ensure uniqueness, sorted, and joined with a space.\n */\nfunction resolveRel(\n\trel: Rel | (string & {}) | undefined | null | (Rel | (string & {}) | undefined | null)[],\n) {\n\tif (Array.isArray(rel)) {\n\t\tconst uniqueRel = new Set(rel);\n\t\tconst result = [...uniqueRel]\n\t\t\t.map((item) => item?.trim())\n\t\t\t.filter(Boolean)\n\t\t\t.toSorted()\n\t\t\t.join(\" \");\n\t\treturn result || undefined;\n\t}\n\n\treturn rel?.trim() || undefined;\n}\n\nexport {\n\t//,\n\tAnchor,\n\tanchorClassNames,\n\tresolveRel,\n};\n\nexport type {\n\t//,\n\tAnchorProps,\n};\n"],"mappings":"mSAYA,MAAM,EAAoB,GACzB,EACC,kJACA,CACD,EAoFK,EAAS,GAEb,CAAE,UAAS,WAAU,YAAW,IAAK,EAAS,OAAM,gBAAgB,QAAS,GAAG,GAChF,IACI,CACJ,IAAM,EAAM,EAAW,CAAO,EACxB,EAAiB,CACtB,YAAa,SACb,UAAW,EAAiB,CAAS,EACrC,MACA,MACA,GAAG,CACJ,EAEA,GAAI,EAAS,CACZ,IAAM,EAAc,EAAS,KAAK,CAAQ,EAC1C,EACC,EAA4B,CAAW,EACvC,0EACD,EACA,IAAM,EAAgB,EAAY,OAAO,SAEzC,OACC,EAAC,EAAD,CAAM,GAAI,WACR,EACA,EACA,CAAC,EACD,EAAA,EAAA,CAAA,SAAA,CACE,GAAQ,IAAkB,SAC1B,EAAC,EAAD,CAAM,UAAU,sBAAsB,IAAK,CAAO,CAAA,EAElD,EACA,GAAQ,IAAkB,OAC1B,EAAC,EAAD,CAAM,UAAU,sBAAsB,IAAK,CAAO,CAAA,CAElD,CAAA,CAAA,CACH,CACK,CAAA,CAER,CAEA,OACC,EAAC,IAAD,CAAG,GAAI,WAAP,CACE,GAAQ,IAAkB,SAAW,EAAC,EAAD,CAAM,UAAU,sBAAsB,IAAK,CAAO,CAAA,EACvF,EACA,GAAQ,IAAkB,OAAS,EAAC,EAAD,CAAM,UAAU,sBAAsB,IAAK,CAAO,CAAA,CACpF,GAEL,CACD,EACA,EAAO,YAAc,SAOrB,SAAS,EACR,EACC,CAWD,OAVI,MAAM,QAAQ,CAAG,EAEL,CAAC,GAAG,IADG,IAAI,CACC,CAAC,EAC1B,IAAK,GAAS,GAAM,KAAK,CAAC,EAC1B,OAAO,OAAO,EACd,SAAS,EACT,KAAK,GACK,GAAK,IAAA,GAGX,GAAK,KAAK,GAAK,IAAA,EACvB"}
+{"version":3,"file":"anchor-CcTY5SIz.js","names":[],"sources":["../src/components/anchor/anchor.tsx"],"sourcesContent":["import type { ComponentProps, ComponentRef, ReactNode } from \"react\";\nimport { Children, cloneElement, forwardRef, isValidElement } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Slot } from \"../slot/index.js\";\nimport type { Rel } from \"./types.js\";\n\n/**\n * The class names for the `Anchor` component which define the styles for the component.\n */\nconst anchorClassNames = (className?: string) =>\n\tcx(\n\t\t\"cursor-pointer rounded bg-transparent text-accent-600 hover:underline focus:outline-hidden focus-visible:ring-3 focus-visible:ring-focus-accent\",\n\t\tclassName,\n\t);\n\n/**\n * The props for the `Anchor` component.\n */\ntype AnchorProps = Omit<ComponentProps<\"a\">, \"rel\"> &\n\tWithAsChild & {\n\t\t/**\n\t\t * An icon to render inside the anchor\n\t\t */\n\t\ticon?: ReactNode;\n\t\t/**\n\t\t * The side that the icon will render on, if one is present\n\t\t * @default \"start\"\n\t\t */\n\t\ticonPlacement?: \"start\" | \"end\";\n\t\t/**\n\t\t * The rel attribute defines the relationship between a linked resource and the current document.\n\t\t *\n\t\t * Every keyword within a space-separated value should be unique within that value.\n\t\t *\n\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel\n\t\t */\n\t\trel?: Rel | (string & {}) | undefined | (Rel | (string & {}) | undefined | null)[];\n\t};\n\n/**\n * A styled hyperlink — a native `<a>` with mantle's link styling, focus\n * treatment, optional leading/trailing icon, and a safer default for the\n * `rel` attribute. Use for links that point _outside_ the current\n * application.\n *\n * **When to use**\n * - External URLs (docs, marketing pages, third-party sites).\n * - Links to files or `mailto:` / `tel:` destinations.\n *\n * **When not to use**\n * - Internal application routes — prefer the framework router's link\n *   primitive ({@link https://reactrouter.com/en/main/components/link `react-router` `<Link>`})\n *   so client-side navigation kicks in. You can keep mantle's styling by\n *   composing: `<Anchor asChild><Link to=\"/foo\">…</Link></Anchor>`.\n * - For triggering an action — use a {@link https://mantle.ngrok.com/components/button Button}\n *   instead. If it doesn't navigate, it's not a link.\n *\n * **Icons.** Pass `icon` (a phosphor or custom SVG) and optionally\n * `iconPlacement` (`\"start\"` default, or `\"end\"`) to render a small inline\n * icon — useful for \"external link\" or \"download\" affordances. Icons are\n * decorative; the link text must still describe the destination on its own.\n *\n * **Security.** When `target=\"_blank\"`, `rel` should include\n * `\"noopener noreferrer\"`. The `rel` prop accepts an array — duplicates\n * are de-duped and sorted, so it's safe to merge token sets.\n *\n * **Accessibility.** Link text must be self-describing — avoid \"click\n * here\" / \"read more\". For purely decorative icons, no extra labeling is\n * needed; for icon-only links, provide an `aria-label`.\n *\n * @see https://mantle.ngrok.com/components/anchor\n *\n * @example\n * ```tsx\n * import { Anchor } from \"@ngrok/mantle/anchor\";\n * import { BookIcon } from \"@phosphor-icons/react/Book\";\n * import { Link } from \"react-router\";\n *\n * // Basic external link.\n * <Anchor href=\"https://ngrok.com/\">ngrok.com</Anchor>\n *\n * // External link in a new tab with a leading icon.\n * <Anchor\n *   href=\"https://ngrok.com/docs\"\n *   target=\"_blank\"\n *   rel={[\"noopener\", \"noreferrer\"]}\n *   icon={<BookIcon />}\n * >\n *   ngrok docs\n * </Anchor>\n *\n * // Compose Anchor styling onto a react-router Link for internal navigation.\n * <Anchor asChild>\n *   <Link to=\"/dashboard\">Open dashboard</Link>\n * </Anchor>\n * ```\n */\nconst Anchor = forwardRef<ComponentRef<\"a\">, AnchorProps>(\n\t(\n\t\t{ asChild, children, className, rel: propRel, icon, iconPlacement = \"start\", ...props },\n\t\tref,\n\t) => {\n\t\tconst rel = resolveRel(propRel);\n\t\tconst componentProps = {\n\t\t\t\"data-slot\": \"anchor\",\n\t\t\tclassName: anchorClassNames(className),\n\t\t\tref,\n\t\t\trel,\n\t\t\t...props,\n\t\t};\n\n\t\tif (asChild) {\n\t\t\tconst singleChild = Children.only(children);\n\t\t\tinvariant(\n\t\t\t\tisValidElement<AnchorProps>(singleChild),\n\t\t\t\t\"When using `asChild`, Anchor must be passed a single child as a JSX tag.\",\n\t\t\t);\n\t\t\tconst grandchildren = singleChild.props?.children;\n\n\t\t\treturn (\n\t\t\t\t<Slot {...componentProps}>\n\t\t\t\t\t{cloneElement(\n\t\t\t\t\t\tsingleChild,\n\t\t\t\t\t\t{},\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{icon && iconPlacement === \"start\" && (\n\t\t\t\t\t\t\t\t<Icon className=\"inline-block mr-1.5\" svg={icon} />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{grandchildren}\n\t\t\t\t\t\t\t{icon && iconPlacement === \"end\" && (\n\t\t\t\t\t\t\t\t<Icon className=\"inline-block ml-1.5\" svg={icon} />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>,\n\t\t\t\t\t)}\n\t\t\t\t</Slot>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<a {...componentProps}>\n\t\t\t\t{icon && iconPlacement === \"start\" && <Icon className=\"inline-block mr-1.5\" svg={icon} />}\n\t\t\t\t{children}\n\t\t\t\t{icon && iconPlacement === \"end\" && <Icon className=\"inline-block ml-1.5\" svg={icon} />}\n\t\t\t</a>\n\t\t);\n\t},\n);\nAnchor.displayName = \"Anchor\";\n\n/**\n * Resolves the `rel` attribute to a string.\n *\n * If the value is an array, it will be filtered for empty values, ensure uniqueness, sorted, and joined with a space.\n */\nfunction resolveRel(\n\trel: Rel | (string & {}) | undefined | null | (Rel | (string & {}) | undefined | null)[],\n) {\n\tif (Array.isArray(rel)) {\n\t\tconst uniqueRel = new Set(rel);\n\t\tconst result = [...uniqueRel]\n\t\t\t.map((item) => item?.trim())\n\t\t\t.filter(Boolean)\n\t\t\t.toSorted()\n\t\t\t.join(\" \");\n\t\treturn result || undefined;\n\t}\n\n\treturn rel?.trim() || undefined;\n}\n\nexport {\n\t//,\n\tAnchor,\n\tanchorClassNames,\n\tresolveRel,\n};\n\nexport type {\n\t//,\n\tAnchorProps,\n};\n"],"mappings":"mSAYA,MAAM,EAAoB,GACzB,EACC,kJACA,CACD,EAoFK,EAAS,GAEb,CAAE,UAAS,WAAU,YAAW,IAAK,EAAS,OAAM,gBAAgB,QAAS,GAAG,GAChF,IACI,CACJ,IAAM,EAAM,EAAW,CAAO,EACxB,EAAiB,CACtB,YAAa,SACb,UAAW,EAAiB,CAAS,EACrC,MACA,MACA,GAAG,CACJ,EAEA,GAAI,EAAS,CACZ,IAAM,EAAc,EAAS,KAAK,CAAQ,EAC1C,EACC,EAA4B,CAAW,EACvC,0EACD,EACA,IAAM,EAAgB,EAAY,OAAO,SAEzC,OACC,EAAC,EAAD,CAAM,GAAI,WACR,EACA,EACA,CAAC,EACD,EAAA,EAAA,CAAA,SAAA,CACE,GAAQ,IAAkB,SAC1B,EAAC,EAAD,CAAM,UAAU,sBAAsB,IAAK,CAAO,CAAA,EAElD,EACA,GAAQ,IAAkB,OAC1B,EAAC,EAAD,CAAM,UAAU,sBAAsB,IAAK,CAAO,CAAA,CAElD,CAAA,CAAA,CACH,CACK,CAAA,CAER,CAEA,OACC,EAAC,IAAD,CAAG,GAAI,WAAP,CACE,GAAQ,IAAkB,SAAW,EAAC,EAAD,CAAM,UAAU,sBAAsB,IAAK,CAAO,CAAA,EACvF,EACA,GAAQ,IAAkB,OAAS,EAAC,EAAD,CAAM,UAAU,sBAAsB,IAAK,CAAO,CAAA,CACpF,GAEL,CACD,EACA,EAAO,YAAc,SAOrB,SAAS,EACR,EACC,CAWD,OAVI,MAAM,QAAQ,CAAG,EAEL,CAAC,GAAG,IADG,IAAI,CACC,CAAC,CAAC,CAC3B,IAAK,GAAS,GAAM,KAAK,CAAC,CAAC,CAC3B,OAAO,OAAO,CAAC,CACf,SAAS,CAAC,CACV,KAAK,GACK,GAAK,IAAA,GAGX,GAAK,KAAK,GAAK,IAAA,EACvB"}

package/dist/badge.d.ts

@@ -70,7 +70,7 @@ declare const Badge: {
     color,
     icon,
     ...props
-  }: BadgeProps): import("react/jsx-runtime").JSX.Element;
+  }: BadgeProps): import("react").JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/{button-BYZOBUgj.d.ts → button-BXZ_JTu_.d.ts}

@@ -4,7 +4,7 @@ import { ComponentProps, ReactNode } from "react";
 
 //#region src/components/button/button.d.ts
 declare const buttonVariants: (props?: ({
-  appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
+  appearance?: "link" | "ghost" | "outlined" | "filled" | null | undefined;
   isLoading?: boolean | null | undefined;
   priority?: "danger" | "neutral" | "default" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
@@ -88,7 +88,7 @@ type ButtonProps = ComponentProps<"button"> & ButtonVariants & {
  * ```
  */
 declare const Button: import("react").ForwardRefExoticComponent<(Omit<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Partial<DeepNonNullable<import("class-variance-authority").VariantProps<(props?: ({
-  appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
+  appearance?: "link" | "ghost" | "outlined" | "filled" | null | undefined;
   isLoading?: boolean | null | undefined;
   priority?: "danger" | "neutral" | "default" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string>>> & {
@@ -134,7 +134,7 @@ declare const Button: import("react").ForwardRefExoticComponent<(Omit<import("re
    */
   type?: ComponentProps<"button">["type"];
 }, "ref"> | Omit<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Partial<DeepNonNullable<import("class-variance-authority").VariantProps<(props?: ({
-  appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
+  appearance?: "link" | "ghost" | "outlined" | "filled" | null | undefined;
   isLoading?: boolean | null | undefined;
   priority?: "danger" | "neutral" | "default" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string>>> & {
@@ -169,4 +169,4 @@ declare const Button: import("react").ForwardRefExoticComponent<(Omit<import("re
 }, "ref">) & import("react").RefAttributes<HTMLButtonElement>>;
 //#endregion
 export { ButtonProps as n, Button as t };
-//# sourceMappingURL=button-BYZOBUgj.d.ts.map
+//# sourceMappingURL=button-BXZ_JTu_.d.ts.map

package/dist/button.d.ts

@@ -1,4 +1,4 @@
 import { n as IconButtonProps, t as IconButton } from "./icon-button-ntupABbM.js";
-import { n as ButtonProps, t as Button } from "./button-BYZOBUgj.js";
+import { n as ButtonProps, t as Button } from "./button-BXZ_JTu_.js";
 import { n as ButtonGroupProps, t as ButtonGroup } from "./index-DBZ3eRsl.js";
 export { Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, IconButton, type IconButtonProps };

package/dist/calendar.d.ts

@@ -33,7 +33,7 @@ declare function Calendar({
   classNames,
   showOutsideDays,
   ...props
-}: CalendarProps): import("react/jsx-runtime").JSX.Element;
+}: CalendarProps): import("react").JSX.Element;
 declare namespace Calendar {
   var displayName: string;
 }

package/dist/checkbox.d.ts

@@ -18,7 +18,7 @@ type CheckedState = boolean | "indeterminate";
  * </form>
  * ```
  */
-declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "defaultChecked" | "type" | "checked"> & WithValidation & {
+declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "defaultChecked" | "checked" | "type"> & WithValidation & {
   /**
    * The controlled checked state of the checkbox. Must be used in conjunction with onChange.
    */

package/dist/code-block.d.ts

@@ -78,7 +78,7 @@ declare function CodeBlockIconComponent({
   preset,
   svg: _svgProp,
   ...props
-}: CodeBlockIconProps): import("react/jsx-runtime").JSX.Element;
+}: CodeBlockIconProps): import("react").JSX.Element;
 declare namespace CodeBlockIconComponent {
   var displayName: string;
 }