@ngrok/mantle 0.0.41 → 0.1.0

package/README.md

@@ -2,6 +2,29 @@
 
 [Mantle](https://mantle.ngrok.com) is [ngrok](https://ngrok.com/)’s UI library and design system. It’s based on [shadcn/ui](https://ui.shadcn.com) and [Radix](https://www.radix-ui.com) with [Tailwind](https://tailwindcss.com/) providing styling. It’s documented using [Remix](https://remix.run/docs).
 
+## Get Started
+
+To get started, install `@ngrok/mantle` with your preferred package manager:
+
+| package manager | command                      |
+| --------------- | ---------------------------- |
+| npm             | npm install -E @ngrok/mantle |
+| yarn            | yarn add -E @ngrok/mantle    |
+| pnpm            | pnpm add -E @ngrok/mantle    |
+| bun             | bun add -E @ngrok/mantle     |
+
+Then, add the [preset](https://tailwindcss.com/docs/presets) to your tailwind configuration.
+
+```ts
+import { mantlePreset } from "@ngrok/mantle/tailwind-preset";
+import type { Config } from "tailwindcss";
+
+export default {
+	presets: [mantlePreset],
+	// ... the rest of your tailwind config!
+} satisfies Config;
+```
+
 ### Installation
 
 Mantle uses `pnpm` as its package manager. First, install the dependencies in the repo’s directory by running `pnpm install`.

package/assets/mantle.css

@@ -613,9 +613,8 @@
 	/* shadow tokens */
 
 	--shadow-color: 0 0% 0%;
-	--shadow-first: 4%;
+	--shadow-first: 5%;
 	--shadow-second: 10%;
-	--shadow-third: 25%;
 }
 
 :root.dark {
@@ -909,7 +908,6 @@
 
 	--shadow-first: 15%;
 	--shadow-second: 30%;
-	--shadow-third: 90%;
 }
 
 :root.light-high-contrast {
@@ -1153,7 +1151,6 @@
 
 	--shadow-first: 100%;
 	--shadow-second: 100%;
-	--shadow-third: 100%;
 }
 
 :root.dark-high-contrast {
@@ -1406,7 +1403,6 @@
 
 	--shadow-first: 100%;
 	--shadow-second: 100%;
-	--shadow-third: 100%;
 }
 
 /**

package/dist/alert.d.ts

@@ -0,0 +1,26 @@
+import * as react from 'react';
+import { HTMLAttributes } from 'react';
+import * as class_variance_authority from 'class-variance-authority';
+import { D as DeepNonNullable } from './deep-non-nullable-SmpSvoSd.js';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+/**
+ * Displays a callout for user attention.
+ */
+declare const Alert: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & Partial<DeepNonNullable<class_variance_authority.VariantProps<(props?: ({
+    priority?: "danger" | "default" | "info" | "success" | "warning" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string>>> & react.RefAttributes<HTMLDivElement>>;
+/**
+ * The container for the content slot of an alert. Place the title and description as direct children.
+ */
+declare const AlertContent: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+/**
+ * The title of an alert.
+ */
+declare const AlertTitle: react.ForwardRefExoticComponent<HTMLAttributes<HTMLHeadingElement> & react.RefAttributes<HTMLParagraphElement>>;
+/**
+ * The description of an alert.
+ */
+declare const AlertDescription: react.ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & react.RefAttributes<HTMLParagraphElement>>;
+
+export { Alert, AlertContent, AlertDescription, AlertTitle };

package/dist/alert.js

@@ -0,0 +1,2 @@
+import{a}from"./chunk-Z4VZBWSY.js";import"./chunk-Z7MU3U6D.js";import{cva as p}from"class-variance-authority";import{forwardRef as n}from"react";import{jsx as i}from"react/jsx-runtime";var d=p("relative flex w-full gap-1.5 rounded-md border p-2.5 text-sm",{variants:{priority:{danger:"border-danger-500/50 bg-danger-500/10 text-danger-700",default:"border-neutral-500/50 bg-neutral-500/10 text-neutral-700",info:"border-accent-500/50 bg-accent-500/10 text-accent-700",success:"border-success-500/50 bg-success-500/10 text-success-700",warning:"border-warning-500/50 bg-warning-500/10 text-warning-700"}},defaultVariants:{priority:"default"}}),l=n(({className:e,priority:t="default",...r},c)=>i("div",{ref:c,className:a(d({priority:t}),e),...r}));l.displayName="Alert";var s=n(({className:e,...t},r)=>i("div",{ref:r,className:a("min-w-0 flex-1",e),...t}));s.displayName="AlertContent";var o=n(({className:e,...t},r)=>i("h5",{ref:r,className:a("font-medium",e),...t}));o.displayName="AlertTitle";var m=n(({className:e,...t},r)=>i("div",{ref:r,className:a("text-sm",e),...t}));m.displayName="AlertDescription";export{l as Alert,s as AlertContent,m as AlertDescription,o as AlertTitle};
+//# sourceMappingURL=alert.js.map

package/dist/alert.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/alert/src/alert.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport { forwardRef } from \"react\";\nimport type { HTMLAttributes } from \"react\";\nimport { cx } from \"../../core\";\nimport type { VariantProps } from \"../../types\";\n\nconst alertVariants = cva(\"relative flex w-full gap-1.5 rounded-md border p-2.5 text-sm\", {\n\tvariants: {\n\t\t/**\n\t\t * The priority of the Alert. Indicates the importance or impact level of the Alert,\n\t\t * affecting its color and styling to communicate its purpose to the user.\n\t\t * @default \"default\"\n\t\t */\n\t\tpriority: {\n\t\t\tdanger: \"border-danger-500/50 bg-danger-500/10 text-danger-700\",\n\t\t\tdefault: \"border-neutral-500/50 bg-neutral-500/10 text-neutral-700\",\n\t\t\tinfo: \"border-accent-500/50 bg-accent-500/10 text-accent-700\",\n\t\t\tsuccess: \"border-success-500/50 bg-success-500/10 text-success-700\",\n\t\t\twarning: \"border-warning-500/50 bg-warning-500/10 text-warning-700\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tpriority: \"default\",\n\t},\n});\n\ntype AlertVariants = VariantProps<typeof alertVariants>;\n\n/**\n * Displays a callout for user attention.\n */\nconst Alert = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement> & AlertVariants>(\n\t({ className, priority = \"default\", ...props }, ref) => (\n\t\t<div ref={ref} className={cx(alertVariants({ priority }), className)} {...props} />\n\t),\n);\nAlert.displayName = \"Alert\";\n\n/**\n * The container for the content slot of an alert. Place the title and description as direct children.\n */\nconst AlertContent = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (\n\t<div ref={ref} className={cx(\"min-w-0 flex-1\", className)} {...props} />\n));\nAlertContent.displayName = \"AlertContent\";\n\n/**\n * The title of an alert.\n */\nconst AlertTitle = forwardRef<HTMLParagraphElement, HTMLAttributes<HTMLHeadingElement>>(\n\t({ className, ...props }, ref) => <h5 ref={ref} className={cx(\"font-medium\", className)} {...props} />,\n);\nAlertTitle.displayName = \"AlertTitle\";\n\n/**\n * The description of an alert.\n */\nconst AlertDescription = forwardRef<HTMLParagraphElement, HTMLAttributes<HTMLParagraphElement>>(\n\t({ className, ...props }, ref) => <div ref={ref} className={cx(\"text-sm\", className)} {...props} />,\n);\nAlertDescription.displayName = \"AlertDescription\";\n\nexport { Alert, AlertContent, AlertTitle, AlertDescription };\n"],"mappings":"+DAAA,OAAS,OAAAA,MAAW,2BACpB,OAAS,cAAAC,MAAkB,QAgCzB,cAAAC,MAAA,oBA3BF,IAAMC,EAAgBC,EAAI,+DAAgE,CACzF,SAAU,CAMT,SAAU,CACT,OAAQ,wDACR,QAAS,2DACT,KAAM,wDACN,QAAS,2DACT,QAAS,0DACV,CACD,EACA,gBAAiB,CAChB,SAAU,SACX,CACD,CAAC,EAOKC,EAAQC,EACb,CAAC,CAAE,UAAAC,EAAW,SAAAC,EAAW,UAAW,GAAGC,CAAM,EAAGC,IAC/CR,EAAC,OAAI,IAAKQ,EAAK,UAAWC,EAAGR,EAAc,CAAE,SAAAK,CAAS,CAAC,EAAGD,CAAS,EAAI,GAAGE,EAAO,CAEnF,EACAJ,EAAM,YAAc,QAKpB,IAAMO,EAAeN,EAA2D,CAAC,CAAE,UAAAC,EAAW,GAAGE,CAAM,EAAGC,IACzGR,EAAC,OAAI,IAAKQ,EAAK,UAAWC,EAAG,iBAAkBJ,CAAS,EAAI,GAAGE,EAAO,CACtE,EACDG,EAAa,YAAc,eAK3B,IAAMC,EAAaP,EAClB,CAAC,CAAE,UAAAC,EAAW,GAAGE,CAAM,EAAGC,IAAQR,EAAC,MAAG,IAAKQ,EAAK,UAAWC,EAAG,cAAeJ,CAAS,EAAI,GAAGE,EAAO,CACrG,EACAI,EAAW,YAAc,aAKzB,IAAMC,EAAmBR,EACxB,CAAC,CAAE,UAAAC,EAAW,GAAGE,CAAM,EAAGC,IAAQR,EAAC,OAAI,IAAKQ,EAAK,UAAWC,EAAG,UAAWJ,CAAS,EAAI,GAAGE,EAAO,CAClG,EACAK,EAAiB,YAAc","names":["cva","forwardRef","jsx","alertVariants","cva","Alert","forwardRef","className","priority","props","ref","cx","AlertContent","AlertTitle","AlertDescription"]}

package/dist/{components/anchor/src/anchor.d.ts → anchor.d.ts}

@@ -1,5 +1,7 @@
-import { AnchorHTMLAttributes } from "react";
-import { WithAsChild } from "../../types/src/as-child";
+import * as react from 'react';
+import { AnchorHTMLAttributes } from 'react';
+import { W as WithAsChild } from './as-child-BjnPZ1DU.js';
+
 declare const anchorClassNames: (className: string | undefined) => string;
 /**
  * Fundamental component for rendering links to external addresses.
@@ -10,6 +12,6 @@ declare const anchorClassNames: (className: string | undefined) => string;
  * [`react-router-dom` `<Link>`](https://reactrouter.com/en/main/components/link) or the
  * [`@remix-run/react` `<Link>`](https://remix.run/docs/en/main/components/link).
  */
-declare const Anchor: import("react").ForwardRefExoticComponent<AnchorHTMLAttributes<HTMLAnchorElement> & WithAsChild & import("react").RefAttributes<HTMLAnchorElement>>;
+declare const Anchor: react.ForwardRefExoticComponent<AnchorHTMLAttributes<HTMLAnchorElement> & WithAsChild & react.RefAttributes<HTMLAnchorElement>>;
+
 export { Anchor, anchorClassNames };
-//# sourceMappingURL=anchor.d.ts.map

package/dist/anchor.js

@@ -0,0 +1,2 @@
+import{a as r}from"./chunk-Z4VZBWSY.js";import"./chunk-Z7MU3U6D.js";import{Slot as i}from"@radix-ui/react-slot";import{forwardRef as h}from"react";import{jsx as m}from"react/jsx-runtime";var n=o=>r("cursor-pointer rounded bg-transparent text-accent-600 hover:underline focus:outline-none focus-visible:ring focus-visible:ring-focus-accent",o),e=h(({asChild:o,className:t,...s},c)=>m(o?i:"a",{className:n(t),ref:c,...s}));e.displayName="Anchor";export{e as Anchor,n as anchorClassNames};
+//# sourceMappingURL=anchor.js.map

package/dist/anchor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/anchor/src/anchor.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport { AnchorHTMLAttributes, forwardRef } from \"react\";\nimport { cx } from \"../../core\";\nimport { WithAsChild } from \"../../types/src/as-child\";\n\nconst anchorClassNames = (className: string | undefined) =>\n\tcx(\n\t\t\"cursor-pointer rounded bg-transparent text-accent-600 hover:underline focus:outline-none focus-visible:ring focus-visible:ring-focus-accent\",\n\t\tclassName,\n\t);\n\ntype AnchorProps = AnchorHTMLAttributes<HTMLAnchorElement> & WithAsChild;\n\n/**\n * Fundamental component for rendering links to external addresses.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a\n *\n * @note If you need to link to an internal application route, prefer using the\n * [`react-router-dom` `<Link>`](https://reactrouter.com/en/main/components/link) or the\n * [`@remix-run/react` `<Link>`](https://remix.run/docs/en/main/components/link).\n */\nconst Anchor = forwardRef<HTMLAnchorElement, AnchorProps>(({ asChild, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"a\";\n\n\treturn <Component className={anchorClassNames(className)} ref={ref} {...props} />;\n});\nAnchor.displayName = \"Anchor\";\n\nexport { Anchor, anchorClassNames };\n"],"mappings":"oEAAA,OAAS,QAAAA,MAAY,uBACrB,OAA+B,cAAAC,MAAkB,QAwBzC,cAAAC,MAAA,oBApBR,IAAMC,EAAoBC,GACzBC,EACC,8IACAD,CACD,EAaKE,EAASC,EAA2C,CAAC,CAAE,QAAAC,EAAS,UAAAJ,EAAW,GAAGK,CAAM,EAAGC,IAGrFR,EAFWM,EAAUG,EAAO,IAE3B,CAAU,UAAWR,EAAiBC,CAAS,EAAG,IAAKM,EAAM,GAAGD,EAAO,CAC/E,EACDH,EAAO,YAAc","names":["Slot","forwardRef","jsx","anchorClassNames","className","cx","Anchor","forwardRef","asChild","props","ref","Slot"]}

package/dist/{components/types/src/as-child.d.ts → as-child-BjnPZ1DU.d.ts}

@@ -1,7 +1,7 @@
 /**
  * Utility type for adding the `asChild` boolean prop to a component.
  */
-export type WithAsChild = {
+type WithAsChild = {
     /**
      * Use the `asChild` prop to compose Radix's functionality onto alternative
      * element types or your own React components.
@@ -18,4 +18,5 @@ export type WithAsChild = {
      */
     asChild?: boolean;
 };
-//# sourceMappingURL=as-child.d.ts.map
+
+export type { WithAsChild as W };

package/dist/button.d.ts

@@ -0,0 +1,92 @@
+import * as react from 'react';
+import { ButtonHTMLAttributes, ReactNode } from 'react';
+import { W as WithAsChild } from './as-child-BjnPZ1DU.js';
+import { V as VariantProps } from './variant-props-Dc9PJLzN.js';
+import { D as DeepNonNullable } from './deep-non-nullable-SmpSvoSd.js';
+import * as class_variance_authority from 'class-variance-authority';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+declare const buttonVariants: (props?: ({
+    appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
+    iconPlacement?: "end" | "start" | null | undefined;
+    isLoading?: boolean | null | undefined;
+    priority?: "default" | "danger" | "neutral" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type ButtonVariants = VariantProps<typeof buttonVariants>;
+/**
+ * The props for the `Button` component.
+ */
+type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & ButtonVariants & {
+    /**
+     * An icon to render inside the button. If the `state` is `"pending"`, then
+     * the icon will automatically be replaced with a spinner.
+     */
+    icon?: ReactNode;
+};
+/**
+ * Renders a button or a component that looks like a button, an interactive
+ * element activated by a user with a mouse, keyboard, finger, voice command, or
+ * other assistive technology. Once activated, it then performs an action, such
+ * as submitting a form or opening a dialog.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button
+ */
+declare const Button: react.ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & Partial<DeepNonNullable<class_variance_authority.VariantProps<(props?: ({
+    appearance?: "link" | "filled" | "ghost" | "outlined" | null | undefined;
+    iconPlacement?: "end" | "start" | null | undefined;
+    isLoading?: boolean | null | undefined;
+    priority?: "default" | "danger" | "neutral" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string>>> & {
+    /**
+     * An icon to render inside the button. If the `state` is `"pending"`, then
+     * the icon will automatically be replaced with a spinner.
+     */
+    icon?: ReactNode;
+} & react.RefAttributes<HTMLButtonElement>>;
+
+declare const iconButtonVariants: (props?: ({
+    appearance?: "ghost" | "outlined" | null | undefined;
+    isLoading?: boolean | null | undefined;
+    size?: "xs" | "sm" | "md" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type IconButtonVariants = VariantProps<typeof iconButtonVariants>;
+/**
+ * The props for the `Button` component.
+ */
+type IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & IconButtonVariants & {
+    /**
+     * The accessible label for the icon. This label will be visually hidden but announced to screen reader users, similar to alt text for img tags.
+     */
+    label: string;
+    /**
+     * An icon to render inside the button. If the `state` is `"pending"`, then
+     * the icon will automatically be replaced with a spinner.
+     */
+    icon: ReactNode;
+};
+/**
+ * Renders a button or a component that looks like a button, an interactive
+ * element activated by a user with a mouse, keyboard, finger, voice command, or
+ * other assistive technology. Once activated, it then performs an action, such
+ * as submitting a form or opening a dialog.
+ * Renders only a single icon as children with an accessible, screen-reader-only label.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button
+ */
+declare const IconButton: react.ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & Partial<DeepNonNullable<class_variance_authority.VariantProps<(props?: ({
+    appearance?: "ghost" | "outlined" | null | undefined;
+    isLoading?: boolean | null | undefined;
+    size?: "xs" | "sm" | "md" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string>>> & {
+    /**
+     * The accessible label for the icon. This label will be visually hidden but announced to screen reader users, similar to alt text for img tags.
+     */
+    label: string;
+    /**
+     * An icon to render inside the button. If the `state` is `"pending"`, then
+     * the icon will automatically be replaced with a spinner.
+     */
+    icon: ReactNode;
+} & react.RefAttributes<HTMLButtonElement>>;
+
+export { Button, type ButtonProps, IconButton, type IconButtonProps };

package/dist/button.js

@@ -0,0 +1,2 @@
+import{a,b}from"./chunk-6R4HKO6I.js";import"./chunk-EX4RHD64.js";import"./chunk-Z4VZBWSY.js";import"./chunk-Z7MU3U6D.js";export{a as Button,b as IconButton};
+//# sourceMappingURL=button.js.map

package/dist/button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/card.d.ts

@@ -0,0 +1,29 @@
+import * as react from 'react';
+import { HTMLAttributes } from 'react';
+import { W as WithAsChild } from './as-child-BjnPZ1DU.js';
+
+type CardProps = HTMLAttributes<HTMLDivElement>;
+/**
+ * A container that can be used to display content in a box resembling a playing
+ * card.
+ */
+declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * The main content of a card. Usually composed as a direct child of a `Card` component.
+ */
+declare const CardBody: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * The footer container of a card. Usually composed as a direct child of a `Card` component.
+ */
+declare const CardFooter: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * The header container of a card. Usually composed as a direct child of a `Card` component.
+ */
+declare const CardHeader: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
+type CardTitleProps = HTMLAttributes<HTMLHeadingElement> & WithAsChild;
+/**
+ * The title of a card. Usually composed as a direct child of a `CardHeader` component.
+ */
+declare const CardTitle: react.ForwardRefExoticComponent<HTMLAttributes<HTMLHeadingElement> & WithAsChild & react.RefAttributes<HTMLParagraphElement>>;
+
+export { Card, CardBody, CardFooter, CardHeader, type CardProps, CardTitle, type CardTitleProps };

package/dist/card.js

@@ -0,0 +1,2 @@
+import{a as t}from"./chunk-Z4VZBWSY.js";import"./chunk-Z7MU3U6D.js";import{Slot as c}from"@radix-ui/react-slot";import{forwardRef as o}from"react";import{jsx as i}from"react/jsx-runtime";var p=o(({className:r,children:e,...d},a)=>i("div",{ref:a,className:t("relative divide-y divide-card-muted rounded-md border border-card bg-card",r),...d,children:e}));p.displayName="Card";var s=o(({className:r,children:e,...d},a)=>i("div",{ref:a,className:t("p-6",r),...d,children:e}));s.displayName="CardBody";var m=o(({className:r,children:e,...d},a)=>i("div",{ref:a,className:t("px-6 py-3",r),...d,children:e}));m.displayName="CardFooter";var l=o(({className:r,children:e,...d},a)=>i("div",{ref:a,className:t("px-6 py-3",r),...d,children:e}));l.displayName="CardHeader";var C=o(({className:r,asChild:e,...d},a)=>i(e?c:"h3",{ref:a,className:t("font-semibold leading-none tracking-tight",r),...d}));C.displayName="CardTitle";export{p as Card,s as CardBody,m as CardFooter,l as CardHeader,C as CardTitle};
+//# sourceMappingURL=card.js.map

package/dist/card.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/card/src/card.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport type { HTMLAttributes } from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../core\";\nimport type { WithAsChild } from \"../../types/src/as-child\";\n\nexport type CardProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * A container that can be used to display content in a box resembling a playing\n * card.\n */\nexport const Card = forwardRef<HTMLDivElement, CardProps>(({ className, children, ...rest }, ref) => (\n\t<div\n\t\tref={ref}\n\t\tclassName={cx(\"relative divide-y divide-card-muted rounded-md border border-card bg-card\", className)}\n\t\t{...rest}\n\t>\n\t\t{children}\n\t</div>\n));\nCard.displayName = \"Card\";\n\n/**\n * The main content of a card. Usually composed as a direct child of a `Card` component.\n */\nexport const CardBody = forwardRef<HTMLDivElement, CardProps>(({ className, children, ...rest }, ref) => (\n\t<div ref={ref} className={cx(\"p-6\", className)} {...rest}>\n\t\t{children}\n\t</div>\n));\nCardBody.displayName = \"CardBody\";\n\n/**\n * The footer container of a card. Usually composed as a direct child of a `Card` component.\n */\nexport const CardFooter = forwardRef<HTMLDivElement, CardProps>(({ className, children, ...rest }, ref) => (\n\t<div ref={ref} className={cx(\"px-6 py-3\", className)} {...rest}>\n\t\t{children}\n\t</div>\n));\nCardFooter.displayName = \"CardFooter\";\n\n/**\n * The header container of a card. Usually composed as a direct child of a `Card` component.\n */\nexport const CardHeader = forwardRef<HTMLDivElement, CardProps>(({ className, children, ...rest }, ref) => (\n\t<div ref={ref} className={cx(\"px-6 py-3\", className)} {...rest}>\n\t\t{children}\n\t</div>\n));\nCardHeader.displayName = \"CardHeader\";\n\nexport type CardTitleProps = HTMLAttributes<HTMLHeadingElement> & WithAsChild;\n\n/**\n * The title of a card. Usually composed as a direct child of a `CardHeader` component.\n */\nexport const CardTitle = forwardRef<HTMLParagraphElement, CardTitleProps>(({ className, asChild, ...props }, ref) => {\n\tconst Comp = asChild ? Slot : \"h3\";\n\treturn <Comp ref={ref} className={cx(\"font-semibold leading-none tracking-tight\", className)} {...props} />;\n});\nCardTitle.displayName = \"CardTitle\";\n"],"mappings":"oEAAA,OAAS,QAAAA,MAAY,uBAErB,OAAS,cAAAC,MAAkB,QAW1B,cAAAC,MAAA,oBADM,IAAMC,EAAOC,EAAsC,CAAC,CAAE,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAC5FN,EAAC,OACA,IAAKM,EACL,UAAWC,EAAG,4EAA6EJ,CAAS,EACnG,GAAGE,EAEH,SAAAD,EACF,CACA,EACDH,EAAK,YAAc,OAKZ,IAAMO,EAAWN,EAAsC,CAAC,CAAE,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAChGN,EAAC,OAAI,IAAKM,EAAK,UAAWC,EAAG,MAAOJ,CAAS,EAAI,GAAGE,EAClD,SAAAD,EACF,CACA,EACDI,EAAS,YAAc,WAKhB,IAAMC,EAAaP,EAAsC,CAAC,CAAE,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAClGN,EAAC,OAAI,IAAKM,EAAK,UAAWC,EAAG,YAAaJ,CAAS,EAAI,GAAGE,EACxD,SAAAD,EACF,CACA,EACDK,EAAW,YAAc,aAKlB,IAAMC,EAAaR,EAAsC,CAAC,CAAE,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAClGN,EAAC,OAAI,IAAKM,EAAK,UAAWC,EAAG,YAAaJ,CAAS,EAAI,GAAGE,EACxD,SAAAD,EACF,CACA,EACDM,EAAW,YAAc,aAOlB,IAAMC,EAAYT,EAAiD,CAAC,CAAE,UAAAC,EAAW,QAAAS,EAAS,GAAGC,CAAM,EAAGP,IAErGN,EADMY,EAAUE,EAAO,KACtB,CAAK,IAAKR,EAAK,UAAWC,EAAG,4CAA6CJ,CAAS,EAAI,GAAGU,EAAO,CACzG,EACDF,EAAU,YAAc","names":["Slot","forwardRef","jsx","Card","forwardRef","className","children","rest","ref","cx","CardBody","CardFooter","CardHeader","CardTitle","asChild","props","Slot"]}

package/dist/checkbox.d.ts

@@ -0,0 +1,6 @@
+import * as react from 'react';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+
+declare const Checkbox: react.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+
+export { Checkbox };

package/dist/checkbox.js

@@ -0,0 +1,2 @@
+import{a as r}from"./chunk-Z4VZBWSY.js";import"./chunk-Z7MU3U6D.js";import*as t from"@radix-ui/react-checkbox";import{forwardRef as n}from"react";import{jsx as e,jsxs as d}from"react/jsx-runtime";var a=n(({className:o,...i},s)=>d(t.Root,{ref:s,className:r("size-4 shrink-0 appearance-none rounded border border-form bg-form focus:border-accent-600 focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-focus-accent disabled:cursor-not-allowed disabled:opacity-50 data-state-checked:border-transparent data-state-checked:bg-filled-accent data-state-indeterminate:border-transparent data-state-indeterminate:bg-filled-accent",o),...i,children:[e(t.Indicator,{className:"hidden items-center justify-center leading-none text-on-filled data-state-checked:flex",children:e(c,{className:"size-3"})}),e(t.Indicator,{className:"hidden items-center justify-center text-on-filled data-state-indeterminate:flex",children:e(l,{className:"size-3"})}),e(t.Indicator,{})]}));a.displayName="Checkbox";var c=({className:o,style:i})=>e("svg",{className:o,style:i,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M12.7071 4.29289C13.0976 4.68342 13.0976 5.31658 12.7071 5.70711L6.70711 11.7071C6.31658 12.0976 5.68342 12.0976 5.29289 11.7071L3.29289 9.70711C2.90237 9.31658 2.90237 8.68342 3.29289 8.29289C3.68342 7.90237 4.31658 7.90237 4.70711 8.29289L6 9.58579L11.2929 4.29289C11.6834 3.90237 12.3166 3.90237 12.7071 4.29289Z",fill:"currentColor"})}),l=({className:o,style:i})=>e("svg",{className:o,style:i,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M4 8C4 7.44772 4.44772 7 5 7H11C11.5523 7 12 7.44772 12 8C12 8.55228 11.5523 9 11 9H5C4.44772 9 4 8.55228 4 8Z",fill:"currentColor"})});export{a as Checkbox};
+//# sourceMappingURL=checkbox.js.map

package/dist/checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/checkbox/src/checkbox.tsx"],"sourcesContent":["import * as CheckboxPrimitive from \"@radix-ui/react-checkbox\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementRef } from \"react\";\nimport { cx } from \"../../core\";\nimport { WithStyleProps } from \"../../types\";\n\ntype Props = ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>;\n\nconst Checkbox = forwardRef<ElementRef<typeof CheckboxPrimitive.Root>, Props>(({ className, ...props }, ref) => (\n\t<CheckboxPrimitive.Root\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"size-4 shrink-0 appearance-none rounded border border-form bg-form focus:border-accent-600 focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-focus-accent disabled:cursor-not-allowed disabled:opacity-50 data-state-checked:border-transparent data-state-checked:bg-filled-accent data-state-indeterminate:border-transparent data-state-indeterminate:bg-filled-accent\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<CheckboxPrimitive.Indicator className=\"hidden items-center justify-center leading-none text-on-filled data-state-checked:flex\">\n\t\t\t<CheckedIcon className=\"size-3\" />\n\t\t</CheckboxPrimitive.Indicator>\n\t\t<CheckboxPrimitive.Indicator className=\"hidden items-center justify-center text-on-filled data-state-indeterminate:flex\">\n\t\t\t<IndeterminateIcon className=\"size-3\" />\n\t\t</CheckboxPrimitive.Indicator>\n\t\t<CheckboxPrimitive.Indicator />\n\t</CheckboxPrimitive.Root>\n));\nCheckbox.displayName = \"Checkbox\";\n\nexport { Checkbox };\n\nconst CheckedIcon = ({ className, style }: WithStyleProps) => (\n\t<svg className={className} style={style} viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t<path\n\t\t\td=\"M12.7071 4.29289C13.0976 4.68342 13.0976 5.31658 12.7071 5.70711L6.70711 11.7071C6.31658 12.0976 5.68342 12.0976 5.29289 11.7071L3.29289 9.70711C2.90237 9.31658 2.90237 8.68342 3.29289 8.29289C3.68342 7.90237 4.31658 7.90237 4.70711 8.29289L6 9.58579L11.2929 4.29289C11.6834 3.90237 12.3166 3.90237 12.7071 4.29289Z\"\n\t\t\tfill=\"currentColor\"\n\t\t/>\n\t</svg>\n);\n\nconst IndeterminateIcon = ({ className, style }: WithStyleProps) => (\n\t<svg className={className} style={style} viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t<path\n\t\t\td=\"M4 8C4 7.44772 4.44772 7 5 7H11C11.5523 7 12 7.44772 12 8C12 8.55228 11.5523 9 11 9H5C4.44772 9 4 8.55228 4 8Z\"\n\t\t\tfill=\"currentColor\"\n\t\t/>\n\t</svg>\n);\n"],"mappings":"oEAAA,UAAYA,MAAuB,2BACnC,OAAS,cAAAC,MAAkB,QAQ1B,OASE,OAAAC,EATF,QAAAC,MAAA,oBADD,IAAMC,EAAWC,EAA6D,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IACvGL,EAAmB,OAAlB,CACA,IAAKK,EACL,UAAWC,EACV,6XACAH,CACD,EACC,GAAGC,EAEJ,UAAAL,EAAmB,YAAlB,CAA4B,UAAU,yFACtC,SAAAA,EAACQ,EAAA,CAAY,UAAU,SAAS,EACjC,EACAR,EAAmB,YAAlB,CAA4B,UAAU,kFACtC,SAAAA,EAACS,EAAA,CAAkB,UAAU,SAAS,EACvC,EACAT,EAAmB,YAAlB,EAA4B,GAC9B,CACA,EACDE,EAAS,YAAc,WAIvB,IAAMQ,EAAc,CAAC,CAAE,UAAAC,EAAW,MAAAC,CAAM,IACvCC,EAAC,OAAI,UAAWF,EAAW,MAAOC,EAAO,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAC9E,SAAAC,EAAC,QACA,EAAE,8TACF,KAAK,eACN,EACD,EAGKC,EAAoB,CAAC,CAAE,UAAAH,EAAW,MAAAC,CAAM,IAC7CC,EAAC,OAAI,UAAWF,EAAW,MAAOC,EAAO,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAC9E,SAAAC,EAAC,QACA,EAAE,iHACF,KAAK,eACN,EACD","names":["CheckboxPrimitive","forwardRef","jsx","jsxs","Checkbox","forwardRef","className","props","ref","cx","CheckedIcon","IndeterminateIcon","CheckedIcon","className","style","jsx","IndeterminateIcon"]}

package/dist/chunk-6R4HKO6I.js

@@ -0,0 +1,2 @@
+import{a as p}from"./chunk-EX4RHD64.js";import{a as f}from"./chunk-Z4VZBWSY.js";import{CircleNotch as E}from"@phosphor-icons/react/CircleNotch";import{Slot as M}from"@radix-ui/react-slot";import{cva as H}from"class-variance-authority";import C from"clsx";import{Children as T,cloneElement as k,forwardRef as w,isValidElement as z}from"react";import A from"tiny-invariant";import{jsx as s,jsxs as R}from"react/jsx-runtime";var W=H("items-center justify-center gap-1.5 whitespace-nowrap rounded-md focus-within:outline-none focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50 sm:text-sm [&>*]:focus-within:outline-none",{variants:{appearance:{filled:"inline-flex h-11 border border-transparent bg-filled-accent px-3 font-medium text-on-filled hover:bg-filled-accent-hover focus-visible:border-accent-600 focus-visible:ring-focus-accent active:bg-filled-accent-active sm:h-9",ghost:"inline-flex h-11 border border-transparent px-3 font-medium text-accent-600 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:bg-accent-500/15 active:text-accent-700 sm:h-9",outlined:"inline-flex h-11 border border-accent-600 bg-form px-3 font-medium text-accent-600 hover:border-accent-700 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:border-accent-700 active:bg-accent-500/15 active:text-accent-700 sm:h-9",link:"group inline cursor-pointer border-transparent text-accent-600 hover:underline focus-visible:ring-focus-accent"},iconPlacement:{end:"pe-2.5",start:"ps-2.5"},isLoading:{false:"",true:"opacity-50"},priority:{danger:"",default:"",neutral:""}},defaultVariants:{appearance:"outlined",isLoading:!1,priority:"default"},compoundVariants:[{appearance:"ghost",priority:"danger",class:"border-transparent text-danger-600 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:bg-danger-500/15 active:text-danger-700"},{appearance:"outlined",priority:"danger",class:"border-danger-600 bg-form text-danger-600 hover:border-danger-700 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:border-danger-700 active:bg-danger-500/15 active:text-danger-700"},{appearance:"filled",priority:"danger",class:"border-transparent bg-filled-danger hover:bg-filled-danger-hover focus-visible:border-danger-600 focus-visible:ring-focus-danger active:bg-filled-danger-active"},{appearance:"link",priority:"danger",class:"text-danger-600 focus-visible:ring-focus-danger"},{appearance:"ghost",priority:"neutral",class:"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong"},{appearance:"outlined",priority:"neutral",class:"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600"},{appearance:"filled",priority:"neutral",class:"border-transparent bg-filled-neutral hover:bg-filled-neutral-hover focus-visible:border-neutral-600 focus-visible:ring-focus-neutral active:bg-filled-neutral-active"},{appearance:"link",priority:"neutral",class:"text-strong focus-visible:ring-focus-accent"}]}),V=w(({"aria-disabled":l,appearance:r="outlined",asChild:o=!1,children:a,className:b,icon:t,iconPlacement:i="start",isLoading:n=!1,onClickCapture:g,priority:m="default",...v},h)=>{let x=l??n,u=n?s(E,{className:"animate-spin"}):t,d=e=>{n&&(e.preventDefault(),e.stopPropagation()),g?.(e)},y={"aria-disabled":x,className:f(W({appearance:r,priority:m,isLoading:n,iconPlacement:u?i:void 0}),b),"data-loading":n,onClickCapture:d,ref:h,...v};if(o){let e=T.only(a);A(z(e),"When using `asChild`, Button must be passed a single child as a JSX tag.");let B=e.props?.children;return s(M,{...y,children:k(e,{},s(P,{appearance:r,icon:u,iconPlacement:i,children:B}))})}return s("button",{...y,children:s(P,{appearance:r,icon:u,iconPlacement:i,children:a})})});V.displayName="Button";var P=({appearance:l,children:r,icon:o,iconPlacement:a})=>R("span",{className:C("inline-flex items-center gap-1.5 focus-within:outline-none focus-visible:outline-none",l==="link"&&"group-hover:underline"),children:[o&&s(p,{svg:o,className:C(a==="end"&&"order-last")}),r]});import{CircleNotch as N}from"@phosphor-icons/react/CircleNotch";import{Slot as S}from"@radix-ui/react-slot";import{cva as D}from"class-variance-authority";import{Children as L,cloneElement as _,forwardRef as J,isValidElement as X}from"react";import{jsx as c,jsxs as q}from"react/jsx-runtime";var j=D("inline-flex items-center justify-center rounded-md border focus-within:outline-none focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50",{variants:{appearance:{ghost:"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong",outlined:"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600"},isLoading:{false:"",true:"opacity-50"},size:{xs:"size-7 sm:size-6",sm:"size-9 sm:size-7",md:"size-11 sm:size-9"}},defaultVariants:{appearance:"outlined",size:"md"}}),I=J(({"aria-disabled":l,appearance:r,asChild:o=!1,children:a,className:b,isLoading:t=!1,icon:i,label:n,onClickCapture:g,size:m,...v},h)=>{let x=l??t,u=e=>{t&&(e.preventDefault(),e.stopPropagation()),g?.(e)},d={"aria-disabled":x,className:f(j({appearance:r,isLoading:t,size:m}),b),"data-loading":t,onClickCapture:u,ref:h,...v};if(o){let e=L.only(a),B=X(e);return c(S,{...d,children:B&&_(e,{},c(p,{svg:t?c(N,{className:"animate-spin"}):i}))})}return q("button",{...d,children:[c("span",{className:"sr-only",children:n}),c(p,{svg:t?c(N,{className:"animate-spin"}):i})]})});I.displayName="IconButton";export{V as a,I as b};
+//# sourceMappingURL=chunk-6R4HKO6I.js.map

package/dist/chunk-6R4HKO6I.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/button/src/button.tsx","../packages/button/src/icon-button.tsx"],"sourcesContent":["import { CircleNotch } from \"@phosphor-icons/react/CircleNotch\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva } from \"class-variance-authority\";\nimport clsx from \"clsx\";\nimport { Children, cloneElement, forwardRef, isValidElement } from \"react\";\nimport type { ButtonHTMLAttributes, MouseEvent, PropsWithChildren, ReactNode } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { cx } from \"../../core\";\nimport { Icon } from \"../../icon\";\nimport type { WithAsChild } from \"../../types/src/as-child\";\nimport type { VariantProps } from \"../../types/src/variant-props\";\n\nconst buttonVariants = cva(\n\t\"items-center justify-center gap-1.5 whitespace-nowrap rounded-md focus-within:outline-none focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50 sm:text-sm [&>*]:focus-within:outline-none\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * Defines the visual style of the Button.\n\t\t\t */\n\t\t\tappearance: {\n\t\t\t\tfilled:\n\t\t\t\t\t\"inline-flex h-11 border border-transparent bg-filled-accent px-3 font-medium text-on-filled hover:bg-filled-accent-hover focus-visible:border-accent-600 focus-visible:ring-focus-accent active:bg-filled-accent-active sm:h-9\",\n\t\t\t\tghost:\n\t\t\t\t\t\"inline-flex h-11 border border-transparent px-3 font-medium text-accent-600 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:bg-accent-500/15 active:text-accent-700 sm:h-9\",\n\t\t\t\toutlined:\n\t\t\t\t\t\"inline-flex h-11 border border-accent-600 bg-form px-3 font-medium text-accent-600 hover:border-accent-700 hover:bg-accent-500/10 hover:text-accent-700 focus-visible:ring-focus-accent active:border-accent-700 active:bg-accent-500/15 active:text-accent-700 sm:h-9\",\n\t\t\t\tlink: \"group inline cursor-pointer border-transparent text-accent-600 hover:underline focus-visible:ring-focus-accent\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * The side that the icon will render on, if one is present. If `state=\"pending\"`,\n\t\t\t * then the loading icon will also render on this side.\n\t\t\t */\n\t\t\ticonPlacement: {\n\t\t\t\tend: \"pe-2.5\",\n\t\t\t\tstart: \"ps-2.5\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * Whether or not the button is in a loading state, default `false`. Setting `isLoading` will\n\t\t\t * replace any `icon` with a spinner, or add one if an icon wasn't given.\n\t\t\t * It will also disable user interaction with the button and set `aria-disabled`.\n\t\t\t */\n\t\t\tisLoading: {\n\t\t\t\tfalse: \"\",\n\t\t\t\ttrue: \"opacity-50\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * Indicates the importance or impact level of the button, affecting its\n\t\t\t * 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\tdefault: \"\",\n\t\t\t\tneutral: \"\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tappearance: \"outlined\",\n\t\t\tisLoading: false,\n\t\t\tpriority: \"default\",\n\t\t},\n\t\tcompoundVariants: [\n\t\t\t{\n\t\t\t\tappearance: \"ghost\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent text-danger-600 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:bg-danger-500/15 active:text-danger-700\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"outlined\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-danger-600 bg-form text-danger-600 hover:border-danger-700 hover:bg-danger-500/10 hover:text-danger-700 focus-visible:ring-focus-danger active:border-danger-700 active:bg-danger-500/15 active:text-danger-700\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"filled\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent bg-filled-danger hover:bg-filled-danger-hover focus-visible:border-danger-600 focus-visible:ring-focus-danger active:bg-filled-danger-active\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"link\",\n\t\t\t\tpriority: \"danger\",\n\t\t\t\tclass: \"text-danger-600 focus-visible:ring-focus-danger\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"ghost\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"outlined\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"filled\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass:\n\t\t\t\t\t\"border-transparent bg-filled-neutral hover:bg-filled-neutral-hover focus-visible:border-neutral-600 focus-visible:ring-focus-neutral active:bg-filled-neutral-active\",\n\t\t\t},\n\t\t\t{\n\t\t\t\tappearance: \"link\",\n\t\t\t\tpriority: \"neutral\",\n\t\t\t\tclass: \"text-strong focus-visible:ring-focus-accent\",\n\t\t\t},\n\t\t],\n\t},\n);\n\ntype ButtonVariants = VariantProps<typeof buttonVariants>;\n\n/**\n * The props for the `Button` component.\n */\ntype ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n\tWithAsChild &\n\tButtonVariants & {\n\t\t/**\n\t\t * An icon to render inside the button. If the `state` is `\"pending\"`, then\n\t\t * the icon will automatically be replaced with a spinner.\n\t\t */\n\t\ticon?: ReactNode;\n\t};\n\n/**\n * Renders a button or a component that looks like a button, an interactive\n * element activated by a user with a mouse, keyboard, finger, voice command, or\n * other assistive technology. Once activated, it then performs an action, such\n * as submitting a form or opening a dialog.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button\n */\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n\t(\n\t\t{\n\t\t\t\"aria-disabled\": _ariaDisabled,\n\t\t\tappearance = \"outlined\",\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\ticon: propIcon,\n\t\t\ticonPlacement = \"start\",\n\t\t\tisLoading = false,\n\t\t\tonClickCapture,\n\t\t\tpriority = \"default\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ariaDisabled = _ariaDisabled ?? isLoading;\n\t\tconst icon = isLoading ? <CircleNotch className=\"animate-spin\" /> : propIcon;\n\n\t\tconst _onClickCapture = (event: MouseEvent<HTMLButtonElement>) => {\n\t\t\tif (isLoading) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\t\t\t}\n\t\t\tonClickCapture?.(event);\n\t\t};\n\n\t\tconst buttonProps = {\n\t\t\t\"aria-disabled\": ariaDisabled,\n\t\t\tclassName: cx(\n\t\t\t\tbuttonVariants({ appearance, priority, isLoading, iconPlacement: icon ? iconPlacement : undefined }),\n\t\t\t\tclassName,\n\t\t\t),\n\t\t\t\"data-loading\": isLoading,\n\t\t\tonClickCapture: _onClickCapture,\n\t\t\tref,\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<ButtonProps>(singleChild),\n\t\t\t\t\"When using `asChild`, Button 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 {...buttonProps}>\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<InnerContent appearance={appearance} icon={icon} iconPlacement={iconPlacement}>\n\t\t\t\t\t\t\t{grandchildren}\n\t\t\t\t\t\t</InnerContent>,\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<button {...buttonProps}>\n\t\t\t\t<InnerContent appearance={appearance} icon={icon} iconPlacement={iconPlacement}>\n\t\t\t\t\t{children}\n\t\t\t\t</InnerContent>\n\t\t\t</button>\n\t\t);\n\t},\n);\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\nexport type { ButtonProps };\n\ntype InnerContentProps = PropsWithChildren & Pick<ButtonProps, \"appearance\" | \"icon\" | \"iconPlacement\">;\n\nconst InnerContent = ({ appearance, children, icon, iconPlacement }: InnerContentProps) => (\n\t<span\n\t\tclassName={clsx(\n\t\t\t\"inline-flex items-center gap-1.5 focus-within:outline-none focus-visible:outline-none\",\n\t\t\tappearance === \"link\" && \"group-hover:underline\",\n\t\t)}\n\t>\n\t\t{icon && <Icon svg={icon} className={clsx(iconPlacement === \"end\" && \"order-last\")} />}\n\t\t{children}\n\t</span>\n);\n","import { CircleNotch } from \"@phosphor-icons/react/CircleNotch\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva } from \"class-variance-authority\";\nimport { ButtonHTMLAttributes, Children, cloneElement, forwardRef, isValidElement, MouseEvent, ReactNode } from \"react\";\nimport { cx } from \"../../core\";\nimport { Icon } from \"../../icon\";\nimport type { VariantProps, WithAsChild } from \"../../types\";\n\nconst iconButtonVariants = cva(\n\t\"inline-flex items-center justify-center rounded-md border focus-within:outline-none focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * Defines the visual style of the Button.\n\t\t\t */\n\t\t\tappearance: {\n\t\t\t\tghost:\n\t\t\t\t\t\"border-transparent text-strong hover:bg-neutral-500/10 hover:text-strong focus-visible:ring-focus-accent active:bg-neutral-500/15 active:text-strong\",\n\t\t\t\toutlined:\n\t\t\t\t\t\"border-form bg-form text-strong hover:border-neutral-400 hover:bg-form-hover hover:text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent active:border-neutral-400 active:bg-neutral-500/10 active:text-strong focus-visible:active:border-accent-600\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * Whether or not the button is in a loading state, default `false`. Setting `isLoading` will\n\t\t\t * replace the `icon` with a spinner.\n\t\t\t * It will also disable user interaction with the button and set `aria-disabled`.\n\t\t\t */\n\t\t\tisLoading: {\n\t\t\t\tfalse: \"\",\n\t\t\t\ttrue: \"opacity-50\",\n\t\t\t},\n\t\t\t/**\n\t\t\t * The size of the IconButton.\n\t\t\t */\n\t\t\tsize: {\n\t\t\t\txs: \"size-7 sm:size-6\",\n\t\t\t\tsm: \"size-9 sm:size-7\",\n\t\t\t\tmd: \"size-11 sm:size-9\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tappearance: \"outlined\",\n\t\t\tsize: \"md\",\n\t\t},\n\t},\n);\n\ntype IconButtonVariants = VariantProps<typeof iconButtonVariants>;\n\n/**\n * The props for the `Button` component.\n */\ntype IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n\tWithAsChild &\n\tIconButtonVariants & {\n\t\t/**\n\t\t * The accessible label for the icon. This label will be visually hidden but announced to screen reader users, similar to alt text for img tags.\n\t\t */\n\t\tlabel: string;\n\t\t/**\n\t\t * An icon to render inside the button. If the `state` is `\"pending\"`, then\n\t\t * the icon will automatically be replaced with a spinner.\n\t\t */\n\t\ticon: ReactNode;\n\t};\n\n/**\n * Renders a button or a component that looks like a button, an interactive\n * element activated by a user with a mouse, keyboard, finger, voice command, or\n * other assistive technology. Once activated, it then performs an action, such\n * as submitting a form or opening a dialog.\n * Renders only a single icon as children with an accessible, screen-reader-only label.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button\n */\nconst IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n\t(\n\t\t{\n\t\t\t\"aria-disabled\": _ariaDisabled,\n\t\t\tappearance,\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tisLoading = false,\n\t\t\ticon: propIcon,\n\t\t\tlabel,\n\t\t\tonClickCapture,\n\t\t\tsize,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ariaDisabled = _ariaDisabled ?? isLoading;\n\n\t\tconst _onClickCapture = (event: MouseEvent<HTMLButtonElement>) => {\n\t\t\tif (isLoading) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\t\t\t}\n\t\t\tonClickCapture?.(event);\n\t\t};\n\n\t\tconst buttonProps = {\n\t\t\t\"aria-disabled\": ariaDisabled,\n\t\t\tclassName: cx(iconButtonVariants({ appearance, isLoading, size }), className),\n\t\t\t\"data-loading\": isLoading,\n\t\t\tonClickCapture: _onClickCapture,\n\t\t\tref,\n\t\t\t...props,\n\t\t};\n\n\t\tif (asChild) {\n\t\t\tconst singleChild = Children.only(children);\n\t\t\tconst isValidChild = isValidElement(singleChild);\n\t\t\tconst icon = isLoading ? <CircleNotch className=\"animate-spin\" /> : propIcon;\n\n\t\t\treturn <Slot {...buttonProps}>{isValidChild && cloneElement(singleChild, {}, <Icon svg={icon} />)}</Slot>;\n\t\t}\n\n\t\tconst icon = isLoading ? <CircleNotch className=\"animate-spin\" /> : propIcon;\n\n\t\treturn (\n\t\t\t<button {...buttonProps}>\n\t\t\t\t<span className=\"sr-only\">{label}</span>\n\t\t\t\t<Icon svg={icon} />\n\t\t\t</button>\n\t\t);\n\t},\n);\nIconButton.displayName = \"IconButton\";\n\nexport { IconButton };\nexport type { IconButtonProps };\n"],"mappings":"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","names":["CircleNotch","Slot","cva","clsx","Children","cloneElement","forwardRef","isValidElement","invariant","jsx","jsxs","buttonVariants","cva","Button","forwardRef","_ariaDisabled","appearance","asChild","children","className","propIcon","iconPlacement","isLoading","onClickCapture","priority","props","ref","ariaDisabled","icon","CircleNotch","_onClickCapture","event","buttonProps","cx","singleChild","Children","invariant","isValidElement","grandchildren","Slot","cloneElement","InnerContent","InnerContent","appearance","children","icon","iconPlacement","jsxs","clsx","jsx","Icon","CircleNotch","Slot","cva","Children","cloneElement","forwardRef","isValidElement","jsx","jsxs","iconButtonVariants","cva","IconButton","forwardRef","_ariaDisabled","appearance","asChild","children","className","isLoading","propIcon","label","onClickCapture","size","props","ref","ariaDisabled","_onClickCapture","event","buttonProps","cx","singleChild","Children","isValidChild","isValidElement","Slot","cloneElement","Icon","CircleNotch"]}

package/dist/chunk-EX4RHD64.js

@@ -0,0 +1,2 @@
+import{a as e}from"./chunk-Z4VZBWSY.js";import{Children as n,cloneElement as i,isValidElement as p}from"react";import c from"tiny-invariant";import{Fragment as l,jsx as m}from"react/jsx-runtime";var a=({className:o,style:s,svg:r})=>{let t=n.only(r);return c(p(t),"Icon must be passed a single SVG icon as a JSX tag."),m(l,{children:i(t,{className:e("size-6 sm:size-5 shrink-0",t.props.className,o),style:{...t.props.style,...s}})})};export{a};
+//# sourceMappingURL=chunk-EX4RHD64.js.map

package/dist/chunk-EX4RHD64.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/icon/src/icon.tsx"],"sourcesContent":["import { Children, cloneElement, HTMLAttributes, isValidElement, ReactElement, ReactNode } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { cx } from \"../../core\";\nimport { WithStyleProps } from \"../../types\";\n\ntype IconProps = WithStyleProps & {\n\t/**\n\t * A single SVG icon element.\n\t */\n\tsvg: ReactNode;\n};\n\ntype SvgAttributes = HTMLAttributes<SVGElement> & {\n\tfocusable?: \"true\" | \"false\";\n};\n\n/**\n * Decorates an svg icon with automatic sizing styles.\n * Merges `className` selectors with the following order of precedence (last one wins):\n * 1. Icon base classes\n * 2. svg className\n * 3. Icon className\n */\nconst Icon = ({ className, style, svg }: IconProps) => {\n\tconst icon = Children.only(svg) as ReactElement;\n\tinvariant(isValidElement<SvgAttributes>(icon), \"Icon must be passed a single SVG icon as a JSX tag.\");\n\n\treturn (\n\t\t<>\n\t\t\t{cloneElement(icon, {\n\t\t\t\tclassName: cx(\"size-6 sm:size-5 shrink-0\", icon.props.className, className),\n\t\t\t\tstyle: { ...icon.props.style, ...style },\n\t\t\t})}\n\t\t</>\n\t);\n};\n\nexport { Icon };\nexport type { IconProps, SvgAttributes };\n"],"mappings":"wCAAA,OAAS,YAAAA,EAAU,gBAAAC,EAA8B,kBAAAC,MAA+C,QAChG,OAAOC,MAAe,iBA2BpB,mBAAAC,EAAA,OAAAC,MAAA,oBALF,IAAMC,EAAO,CAAC,CAAE,UAAAC,EAAW,MAAAC,EAAO,IAAAC,CAAI,IAAiB,CACtD,IAAMC,EAAOC,EAAS,KAAKF,CAAG,EAC9B,OAAAG,EAAUC,EAA8BH,CAAI,EAAG,qDAAqD,EAGnGL,EAAAD,EAAA,CACE,SAAAU,EAAaJ,EAAM,CACnB,UAAWK,EAAG,4BAA6BL,EAAK,MAAM,UAAWH,CAAS,EAC1E,MAAO,CAAE,GAAGG,EAAK,MAAM,MAAO,GAAGF,CAAM,CACxC,CAAC,EACF,CAEF","names":["Children","cloneElement","isValidElement","invariant","Fragment","jsx","Icon","className","style","svg","icon","Children","invariant","isValidElement","cloneElement","cx"]}

package/dist/chunk-REJRMQU5.js

@@ -0,0 +1,2 @@
+import{a as t}from"./chunk-Z4VZBWSY.js";import*as a from"@radix-ui/react-separator";import{forwardRef as f}from"react";import{jsx as n}from"react/jsx-runtime";var e=f(({className:i,orientation:r="horizontal",decorative:o=!0,...p},m)=>n(a.Root,{ref:m,"aria-orientation":o?void 0:r,decorative:o,orientation:r,className:t("shrink-0 bg-gray-500/20 dark-high-contrast:bg-black high-contrast:bg-black dark:bg-gray-600/20",r==="horizontal"?"h-px w-full":"h-full w-px",i),...p}));e.displayName="Separator";export{e as a};
+//# sourceMappingURL=chunk-REJRMQU5.js.map

package/dist/chunk-REJRMQU5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/separator/src/separator.tsx"],"sourcesContent":["import * as SeparatorPrimitive from \"@radix-ui/react-separator\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementRef } from \"react\";\nimport { cx } from \"../../core\";\n\n/**\n * Visually or semantically separates content.\n */\nconst Separator = forwardRef<\n\tElementRef<typeof SeparatorPrimitive.Root>,\n\tComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>\n>(({ className, orientation = \"horizontal\", decorative = true, ...props }, ref) => (\n\t<SeparatorPrimitive.Root\n\t\tref={ref}\n\t\taria-orientation={decorative ? undefined : orientation}\n\t\tdecorative={decorative}\n\t\torientation={orientation}\n\t\tclassName={cx(\n\t\t\t\"shrink-0 bg-gray-500/20 dark-high-contrast:bg-black high-contrast:bg-black dark:bg-gray-600/20\",\n\t\t\torientation === \"horizontal\" ? \"h-px w-full\" : \"h-full w-px\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nSeparator.displayName = \"Separator\";\n\nexport { Separator };\n"],"mappings":"wCAAA,UAAYA,MAAwB,4BACpC,OAAS,cAAAC,MAAkB,QAW1B,cAAAC,MAAA,oBAJD,IAAMC,EAAYC,EAGhB,CAAC,CAAE,UAAAC,EAAW,YAAAC,EAAc,aAAc,WAAAC,EAAa,GAAM,GAAGC,CAAM,EAAGC,IAC1EP,EAAoB,OAAnB,CACA,IAAKO,EACL,mBAAkBF,EAAa,OAAYD,EAC3C,WAAYC,EACZ,YAAaD,EACb,UAAWI,EACV,iGACAJ,IAAgB,aAAe,cAAgB,cAC/CD,CACD,EACC,GAAGG,EACL,CACA,EACDL,EAAU,YAAc","names":["SeparatorPrimitive","forwardRef","jsx","Separator","forwardRef","className","orientation","decorative","props","ref","cx"]}

package/dist/chunk-Z4VZBWSY.js

@@ -0,0 +1,2 @@
+import{clsx as n}from"clsx";import{twMerge as u}from"tailwind-merge";function c(...e){return u(n(e))}import{useEffect as f,useState as i}from"react";var d="(prefers-reduced-motion: no-preference)";function m(){let[e,r]=i(!0);return f(()=>{let t=window.matchMedia(d);r(!t.matches);function o(s){r(!s.matches)}return t.addEventListener("change",o),()=>{t.removeEventListener("change",o)}},[]),e}import{useEffect as a,useLayoutEffect as p}from"react";var x=typeof window<"u"?p:a;export{c as a,m as b,x as c};
+//# sourceMappingURL=chunk-Z4VZBWSY.js.map

package/dist/chunk-Z4VZBWSY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/core/src/cx.ts","../packages/core/src/use-prefers-reduced-motion.tsx","../packages/core/src/use-isomorphic-layout-effect.tsx"],"sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Conditionally add Tailwind (and other) CSS classes.\n *\n * Allows for tailwind overrides in LTR-specificity-like order of applied classes.\n */\nexport function cx(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n","import { useEffect, useState } from \"react\";\n\n/**\n * no-preference is the default value for the prefers-reduced-motion media query.\n * Users who have never fiddled with their a11y settings will still see animations\n * (no explicit opt-in required from a user's perspective)\n */\nconst query = \"(prefers-reduced-motion: no-preference)\";\n\n/**\n * usePrefersReducedMotion returns true if the user has opted out of animations\n */\nexport function usePrefersReducedMotion() {\n\t// default to no animations, since we don't know what the user's preference is on the server\n\tconst [prefersReducedMotion, setPrefersReducedMotion] = useState(true);\n\n\tuseEffect(() => {\n\t\tconst mediaQueryList = window.matchMedia(query);\n\n\t\t// set the _real_ initial value now that we're on the client\n\t\tsetPrefersReducedMotion(!mediaQueryList.matches);\n\n\t\t// register for updates\n\t\tfunction listener(event: MediaQueryListEvent) {\n\t\t\tsetPrefersReducedMotion(!event.matches);\n\t\t}\n\n\t\tmediaQueryList.addEventListener(\"change\", listener);\n\n\t\treturn () => {\n\t\t\tmediaQueryList.removeEventListener(\"change\", listener);\n\t\t};\n\t}, []);\n\n\treturn prefersReducedMotion;\n}\n","import { useEffect, useLayoutEffect } from \"react\";\n\n/**\n * useIsomorphicLayoutEffect is a hook that uses useLayoutEffect on the client and useEffect on the server.\n */\nexport const useIsomorphicLayoutEffect = typeof window !== \"undefined\" ? useLayoutEffect : useEffect;\n"],"mappings":"AAAA,OAAS,QAAAA,MAA6B,OACtC,OAAS,WAAAC,MAAe,iBAOjB,SAASC,KAAMC,EAAsB,CAC3C,OAAOF,EAAQD,EAAKG,CAAM,CAAC,CAC5B,CCVA,OAAS,aAAAC,EAAW,YAAAC,MAAgB,QAOpC,IAAMC,EAAQ,0CAKP,SAASC,GAA0B,CAEzC,GAAM,CAACC,EAAsBC,CAAuB,EAAIJ,EAAS,EAAI,EAErE,OAAAD,EAAU,IAAM,CACf,IAAMM,EAAiB,OAAO,WAAWJ,CAAK,EAG9CG,EAAwB,CAACC,EAAe,OAAO,EAG/C,SAASC,EAASC,EAA4B,CAC7CH,EAAwB,CAACG,EAAM,OAAO,CACvC,CAEA,OAAAF,EAAe,iBAAiB,SAAUC,CAAQ,EAE3C,IAAM,CACZD,EAAe,oBAAoB,SAAUC,CAAQ,CACtD,CACD,EAAG,CAAC,CAAC,EAEEH,CACR,CCnCA,OAAS,aAAAK,EAAW,mBAAAC,MAAuB,QAKpC,IAAMC,EAA4B,OAAO,OAAW,IAAcD,EAAkBD","names":["clsx","twMerge","cx","inputs","useEffect","useState","query","usePrefersReducedMotion","prefersReducedMotion","setPrefersReducedMotion","mediaQueryList","listener","event","useEffect","useLayoutEffect","useIsomorphicLayoutEffect"]}

package/dist/chunk-Z7MU3U6D.js

@@ -0,0 +1,2 @@
+import{useCallback as a,useSyncExternalStore as i}from"react";function c(e){let r=a(t=>{let n=window.matchMedia(e);return n.addEventListener("change",t),()=>{n.removeEventListener("change",t)}},[e]);return i(r,()=>window.matchMedia(e).matches,()=>!1)}export{c as a};
+//# sourceMappingURL=chunk-Z7MU3U6D.js.map

package/dist/chunk-Z7MU3U6D.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../packages/core/src/use-matches-media-query.tsx"],"sourcesContent":["import { useCallback, useSyncExternalStore } from \"react\";\n\nexport function useMatchesMediaQuery(query: string) {\n\tconst subscribe = useCallback(\n\t\t(callback: () => void) => {\n\t\t\tconst matchMedia = window.matchMedia(query);\n\n\t\t\tmatchMedia.addEventListener(\"change\", callback);\n\t\t\treturn () => {\n\t\t\t\tmatchMedia.removeEventListener(\"change\", callback);\n\t\t\t};\n\t\t},\n\t\t[query],\n\t);\n\n\treturn useSyncExternalStore(\n\t\tsubscribe,\n\t\t() => {\n\t\t\treturn window.matchMedia(query).matches;\n\t\t},\n\t\t() => false,\n\t);\n}\n"],"mappings":"AAAA,OAAS,eAAAA,EAAa,wBAAAC,MAA4B,QAE3C,SAASC,EAAqBC,EAAe,CACnD,IAAMC,EAAYJ,EAChBK,GAAyB,CACzB,IAAMC,EAAa,OAAO,WAAWH,CAAK,EAE1C,OAAAG,EAAW,iBAAiB,SAAUD,CAAQ,EACvC,IAAM,CACZC,EAAW,oBAAoB,SAAUD,CAAQ,CAClD,CACD,EACA,CAACF,CAAK,CACP,EAEA,OAAOF,EACNG,EACA,IACQ,OAAO,WAAWD,CAAK,EAAE,QAEjC,IAAM,EACP,CACD","names":["useCallback","useSyncExternalStore","useMatchesMediaQuery","query","subscribe","callback","matchMedia"]}

package/dist/code-block.d.ts

@@ -0,0 +1,108 @@
+import * as react from 'react';
+import { HTMLAttributes } from 'react';
+import { W as WithStyleProps } from './with-style-props-VnLWm0Yd.js';
+import { z } from 'zod';
+
+declare const CodeBlock: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+declare const CodeBlockBody: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+declare const CodeBlockCode: react.ForwardRefExoticComponent<WithStyleProps & {
+    /**
+     * The code to display in the code block. Should be code formatted as a string. This code will be passed to our syntax highlighter.
+     */
+    value: string;
+    /**
+     * @todo not implemented yet
+     */
+    highlightLines?: (number | `${number}-${number}`)[] | undefined;
+    /**
+     * The language of the code block. This will be used to determine how to syntax highlight the code. @default `"text"`.
+     */
+    language?: "bash" | "cs" | "csharp" | "css" | "dotnet" | "go" | "html" | "java" | "javascript" | "js" | "json" | "jsx" | "markup" | "plain" | "plaintext" | "py" | "python" | "rb" | "ruby" | "rust" | "sh" | "shell" | "text" | "ts" | "tsx" | "txt" | "typescript" | "xml" | "yaml" | "yml" | undefined;
+    /**
+     * @todo not implemented yet
+     */
+    showLineNumbers?: boolean | undefined;
+} & react.RefAttributes<HTMLPreElement>>;
+declare const CodeBlockHeader: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+declare const CodeBlockTitle: react.ForwardRefExoticComponent<HTMLAttributes<HTMLHeadingElement> & {
+    asChild?: boolean | undefined;
+} & react.RefAttributes<HTMLHeadingElement>>;
+declare const CodeBlockCopyButton: react.ForwardRefExoticComponent<WithStyleProps & {
+    /**
+     * Callback fired when the copy button is clicked, passes the copied text as an argument.
+     */
+    onCopy?: ((value: string) => void) | undefined;
+    /**
+     * Callback fired when an error occurs during copying.
+     */
+    onCopyError?: ((error: unknown) => void) | undefined;
+} & react.RefAttributes<HTMLButtonElement>>;
+type CodeBlockExpanderButtonProps = Omit<HTMLAttributes<HTMLButtonElement>, "children" | "aria-controls" | "aria-expanded">;
+declare const CodeBlockExpanderButton: react.ForwardRefExoticComponent<CodeBlockExpanderButtonProps & react.RefAttributes<HTMLButtonElement>>;
+
+type Primitive = string | number | boolean | undefined | null;
+/**
+ * Tagged template literal to format code blocks and normalize leading indentation
+ */
+declare function fmtCode(strings: TemplateStringsArray, ...values: Primitive[]): string;
+
+declare const modes: readonly ["file", "cli"];
+type Mode = (typeof modes)[number];
+declare const metaSchema: z.ZodObject<{
+    collapsible: z.ZodDefault<z.ZodBoolean>;
+    disableCopy: z.ZodDefault<z.ZodBoolean>;
+    mode: z.ZodOptional<z.ZodEnum<["file", "cli"]>>;
+    title: z.ZodOptional<z.ZodString>;
+}, "strip", z.ZodTypeAny, {
+    collapsible: boolean;
+    disableCopy: boolean;
+    mode?: "file" | "cli" | undefined;
+    title?: string | undefined;
+}, {
+    collapsible?: boolean | undefined;
+    disableCopy?: boolean | undefined;
+    mode?: "file" | "cli" | undefined;
+    title?: string | undefined;
+}>;
+type MetaInput = z.input<typeof metaSchema>;
+type Meta = z.infer<typeof metaSchema>;
+declare const defaultMeta: {
+    readonly collapsible: false;
+    readonly disableCopy: false;
+    readonly mode: undefined;
+    readonly title: undefined;
+};
+type DefaultMeta = typeof defaultMeta;
+/**
+ * Parses a markdown code block (```) metastring into a meta object.
+ * Defaults to DefaultMeta if no metastring given or if metastring is invalid.
+ * Useful for parsing the metastring from a markdown code block to pass into the
+ * CodeBlock components as props.
+ */
+declare function parseMetastring(value: string | undefined): Meta;
+
+/**
+ * List of supported languages for syntax highlighting.
+ * @private
+ */
+declare const supportedLanguages: readonly ["bash", "cs", "csharp", "css", "dotnet", "go", "html", "java", "javascript", "js", "json", "jsx", "markup", "plain", "plaintext", "py", "python", "rb", "ruby", "rust", "sh", "shell", "text", "ts", "tsx", "txt", "typescript", "xml", "yaml", "yml"];
+/**
+ * Supported languages for syntax highlighting.
+ */
+type SupportedLanguage = (typeof supportedLanguages)[number];
+/**
+ * Parses a markdown code block (```) language class into a SupportedLanguage.
+ * Defaults to "sh" if no supported language is found.
+ */
+declare function parseLanguage(value: `language-${string}` | `lang-${string}` | (string & {}) | undefined): SupportedLanguage;
+/**
+ * Type Predicate: checks if an arbitrary value is a supported syntax highlighting language.
+ */
+declare const isSupportedLanguage: (value: unknown) => value is "bash" | "cs" | "csharp" | "css" | "dotnet" | "go" | "html" | "java" | "javascript" | "js" | "json" | "jsx" | "markup" | "plain" | "plaintext" | "py" | "python" | "rb" | "ruby" | "rust" | "sh" | "shell" | "text" | "ts" | "tsx" | "txt" | "typescript" | "xml" | "yaml" | "yml";
+/**
+ * Formats a language name into a class name that Prism.js can understand.
+ * @default "language-sh"
+ */
+declare function formatLanguageClassName(language?: SupportedLanguage | undefined): "language-bash" | "language-cs" | "language-csharp" | "language-css" | "language-dotnet" | "language-go" | "language-html" | "language-java" | "language-javascript" | "language-js" | "language-json" | "language-jsx" | "language-markup" | "language-plain" | "language-plaintext" | "language-py" | "language-python" | "language-rb" | "language-ruby" | "language-rust" | "language-sh" | "language-shell" | "language-text" | "language-ts" | "language-tsx" | "language-txt" | "language-typescript" | "language-xml" | "language-yaml" | "language-yml";
+
+export { CodeBlock, CodeBlockBody, CodeBlockCode, CodeBlockCopyButton, CodeBlockExpanderButton, CodeBlockHeader, CodeBlockTitle, type DefaultMeta, type Meta, type MetaInput, type Mode, type SupportedLanguage, defaultMeta, fmtCode, formatLanguageClassName, isSupportedLanguage, parseLanguage, parseMetastring, supportedLanguages };

package/dist/code-block.js

@@ -0,0 +1,4 @@
+import{a as u}from"./chunk-Z4VZBWSY.js";import"./chunk-Z7MU3U6D.js";import{Slot as R}from"@radix-ui/react-slot";import w from"prismjs";import{createContext as O,forwardRef as m,useContext as v,useEffect as y,useId as W,useMemo as F,useState as g}from"react";import"prismjs/components/prism-bash.js";import"prismjs/components/prism-bash.js";import"prismjs/components/prism-csharp.js";import"prismjs/components/prism-css.js";import"prismjs/components/prism-go.js";import"prismjs/components/prism-java.js";import"prismjs/components/prism-javascript.js";import"prismjs/components/prism-json.js";import"prismjs/components/prism-jsx.js";import"prismjs/components/prism-markup.js";import"prismjs/components/prism-python.js";import"prismjs/components/prism-ruby.js";import"prismjs/components/prism-rust.js";import"prismjs/components/prism-tsx.js";import"prismjs/components/prism-typescript.js";import"prismjs/components/prism-yaml.js";import{CaretDown as Y}from"@phosphor-icons/react/CaretDown";import{Check as J}from"@phosphor-icons/react/Check";import{Copy as Q}from"@phosphor-icons/react/Copy";import{useCopyToClipboard as V}from"@uidotdev/usehooks";import M from"tiny-invariant";var b=["bash","cs","csharp","css","dotnet","go","html","java","javascript","js","json","jsx","markup","plain","plaintext","py","python","rb","ruby","rust","sh","shell","text","ts","tsx","txt","typescript","xml","yaml","yml"];function $(e){if(!e)return"sh";let o=e.trim().slice(e.indexOf("-")+1);return S(o)?o:"sh"}var S=e=>typeof e=="string"&&b.includes(e);function L(e="sh"){return`language-${e??"sh"}`}import{Fragment as q,jsx as l,jsxs as T}from"react/jsx-runtime";var B=O({codeId:void 0,copyText:"",hasCodeExpander:!1,isCodeExpanded:!1,registerCodeId:()=>{},setCopyText:()=>{},setHasCodeExpander:()=>{},setIsCodeExpanded:()=>{},unregisterCodeId:()=>{}}),H=m(({className:e,...o},r)=>{let[t,a]=g(""),[n,i]=g(!1),[s,c]=g(!1),[d,f]=g(void 0),h=F(()=>({codeId:d,copyText:t,hasCodeExpander:n,isCodeExpanded:s,registerCodeId:p=>{f(C=>(M(C==null,"You can only render a single CodeBlockCode within a CodeBlock."),p))},setCopyText:a,setHasCodeExpander:i,setIsCodeExpanded:c,unregisterCodeId:p=>{f(C=>{M(C===p,"You can only render a single CodeBlockCode within a CodeBlock.")})}}),[d,t,n,s]);return l(B.Provider,{value:h,children:l("div",{className:u("overflow-hidden rounded-md border border-gray-300 bg-gray-50 font-mono text-[0.8125rem]",e),ref:r,...o})})});H.displayName="CodeBlock";var I=m(({className:e,...o},r)=>l("div",{className:u("relative",e),ref:r,...o}));I.displayName="CodeBlockBody";var N=m((e,o)=>{let{className:r,language:t="text",style:a,value:n}=e,i=W(),{hasCodeExpander:s,isCodeExpanded:c,registerCodeId:d,setCopyText:f,unregisterCodeId:h}=v(B),p=n?.trim()??"",[C,j]=g(p);return y(()=>{let E=w.languages[t];M(E,`CodeBlock does not support the language "${t}". The syntax highlighter does not have a grammar for this language. The supported languages are: ${b.join(", ")}.`);let z=w.highlight(p,E,t);j(z)},[p,t]),y(()=>{f(p)},[p,f]),y(()=>(d(i),()=>{h(i)}),[i,d,h]),l("pre",{"aria-expanded":s?c:void 0,className:u(L(t),"scrollbar overflow-x-auto overflow-y-hidden p-4 pr-[3.375rem] firefox:after:mr-[3.375rem] firefox:after:inline-block firefox:after:content-['']","aria-collapsed:max-h-[13.6rem]",r),"data-lang":t,id:i,ref:o,style:{...a,tabSize:2,MozTabSize:2},children:l("code",{dangerouslySetInnerHTML:{__html:C}})})});N.displayName="CodeBlockCode";var A=m(({className:e,...o},r)=>l("div",{className:u("flex items-center gap-1 border-b border-gray-300 bg-gray-100 px-4 py-2 text-gray-700",e),ref:r,...o}));A.displayName="CodeBlockHeader";var P=m(({asChild:e=!1,className:o,...r},t)=>l(e?R:"h3",{ref:t,className:u("font-mono text-[0.8125rem] font-normal",o),...r}));P.displayName="CodeBlockTitle";var D=m(({className:e,onCopy:o,onCopyError:r,style:t},a)=>{let{copyText:n}=v(B),[,i]=V(),[s,c]=g(!1);return y(()=>{if(s){let d=window.setTimeout(()=>{c(!1)},2e3);return()=>{clearTimeout(d)}}},[s]),T("button",{type:"button",className:u("absolute right-3 top-3 z-10 flex h-7 w-7 items-center justify-center rounded border border-gray-300 bg-gray-50 shadow-[-1rem_0_0.75rem_-0.375rem_hsl(var(--gray-50)),1rem_0_0_-0.25rem_hsl(var(--gray-50))] hover:border-gray-400 hover:bg-gray-200 focus-visible:border-accent-600 focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-focus-accent",s&&"w-auto gap-1 border-transparent bg-filled-success pl-2 pr-1.5 text-on-filled hover:border-transparent hover:bg-filled-success focus:bg-filled-success focus-visible:border-success-600 focus-visible:ring-focus-success",e),ref:a,style:t,onClick:async()=>{try{await i(n),o?.(n),c(!0)}catch(d){r?.(d)}},children:[l("span",{className:"sr-only",children:"Copy code"}),s?T(q,{children:["Copied",l(J,{className:"h-4 w-4",weight:"bold"})]}):l(Q,{className:"-ml-px h-5 w-5"})]})});D.displayName="CodeBlockCopyButton";var _=m(({className:e,onClick:o,...r},t)=>{let{codeId:a,isCodeExpanded:n,setIsCodeExpanded:i,setHasCodeExpander:s}=v(B);return y(()=>(s(!0),()=>{s(!1)}),[s]),T("button",{...r,"aria-controls":a,"aria-expanded":n,className:u("flex w-full items-center justify-center gap-0.5 border-t border-gray-300 bg-gray-50 px-4 py-2 font-sans text-gray-700 hover:bg-gray-100",e),ref:t,type:"button",onClick:c=>{i(d=>!d),o?.(c)},children:[n?"Show less":"Show more"," ",l(Y,{className:u("h-4 w-4",n&&"rotate-180","transition-all duration-150"),weight:"bold"})]})});_.displayName="CodeBlockExpanderButton";function G(e,...o){if(!U(e)||!Array.isArray(o))throw new Error("It looks like you tried to call `fmtCode` as a function. Make sure to use it as a tagged template.\n	Example: fmtCode`SELECT * FROM users`, not fmtCode('SELECT * FROM users')");let r=String.raw({raw:e},...o),t=K(r);return r.trim().split(`
+`).map(n=>/^\S+/.test(n)?n:n.slice(t)).join(`
+`)}function K(e){let o=e.match(/^[ \t]*(?=\S)/gm);return o?o.reduce((r,t)=>Math.min(r,t.length),1/0):0}function U(e){return Array.isArray(e)&&"raw"in e&&Array.isArray(e.raw)}import{z as x}from"zod";var X=["file","cli"],Z=x.object({collapsible:x.boolean().default(!1),disableCopy:x.boolean().default(!1),mode:x.enum(X).optional(),title:x.string().trim().optional()}),k={collapsible:!1,disableCopy:!1,mode:void 0,title:void 0};function ee(e){let o=e?.trim()??"";if(!o)return k;let r=oe(o).reduce((t,a)=>{let[n,i]=a.split("=");if(!n)return t;let s=te(i);return t[n]=s??!0,t},{});try{let t=Z.parse(r);return{...k,...t}}catch{return k}}function te(e){return e?.trim().replace(/^"(.*)"$/,"$1")}function oe(e){let o=e?.trim()??"",r=[],t="",a=!1;for(let n of o)n===" "&&!a?t&&(r.push(t),t=""):(n==='"'&&(a=!a),t+=n);return t&&r.push(t),r}export{H as CodeBlock,I as CodeBlockBody,N as CodeBlockCode,D as CodeBlockCopyButton,_ as CodeBlockExpanderButton,A as CodeBlockHeader,P as CodeBlockTitle,k as defaultMeta,G as fmtCode,L as formatLanguageClassName,S as isSupportedLanguage,$ as parseLanguage,ee as parseMetastring,b as supportedLanguages};
+//# sourceMappingURL=code-block.js.map