@ada-cx/lovelace 1.0.0-setup.0

package/dist/components/Input/Input.context.d.ts

@@ -0,0 +1,12 @@
+export type InputVariant = "default" | "composer";
+/** State the root Input shares with descendants that RAC's TextField does not
+ * propagate to on its own — the custom Input.Button (isDisabled), the
+ * description Text (isInvalid), and the field styling variant. Extend as more
+ * shared state is needed. */
+export interface InputContextValue {
+    isDisabled: boolean;
+    isInvalid: boolean;
+    variant: InputVariant;
+}
+export declare const InputContext: import("react").Context<InputContextValue>;
+export declare const useInputContext: () => InputContextValue;

package/dist/components/Input/Input.context.js

@@ -0,0 +1,11 @@
+import { createContext as e, useContext as t } from "react";
+//#region src/components/Input/Input.context.ts
+var n = e({
+	isDisabled: !1,
+	isInvalid: !1,
+	variant: "default"
+}), r = () => t(n);
+//#endregion
+export { n as InputContext, r as useInputContext };
+
+//# sourceMappingURL=Input.context.js.map

package/dist/components/Input/Input.context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.context.js","names":[],"sources":["../../../src/components/Input/Input.context.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\n\nexport type InputVariant = \"default\" | \"composer\";\n\n/** State the root Input shares with descendants that RAC's TextField does not\n * propagate to on its own — the custom Input.Button (isDisabled), the\n * description Text (isInvalid), and the field styling variant. Extend as more\n * shared state is needed. */\nexport interface InputContextValue {\n\tisDisabled: boolean;\n\tisInvalid: boolean;\n\tvariant: InputVariant;\n}\n\nexport const InputContext = createContext<InputContextValue>({\n\tisDisabled: false,\n\tisInvalid: false,\n\tvariant: \"default\",\n});\n\nexport const useInputContext = () => useContext(InputContext);\n"],"mappings":";;AAcA,IAAa,IAAe,EAAiC;CAC5D,YAAY;CACZ,WAAW;CACX,SAAS;CACT,CAAC,EAEW,UAAwB,EAAW,EAAa"}

package/dist/components/Input/Input.css.d.ts

@@ -0,0 +1,11 @@
+import type { ComplexStyleRule } from "@vanilla-extract/css";
+import type { RuntimeFn } from "@vanilla-extract/recipes";
+export declare const inputRoot: string;
+export declare const inputField: RuntimeFn<{
+    variant: Record<"default" | "composer", ComplexStyleRule>;
+}>;
+export declare const inputControl: string;
+export declare const inputTextArea: string;
+export declare const inputButton: string;
+export declare const inputLabel: string;
+export declare const inputHelperText: string;

package/dist/components/Input/Input.css.js

@@ -0,0 +1,16 @@
+import { createRuntimeFn as e } from "../../vendor/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";
+/* empty css                         */
+//#region src/components/Input/Input.css.ts
+var t = "ynzg8v0", n = e({
+	defaultClassName: "ynzg8v3 ynzg8v1",
+	variantClassNames: { variant: {
+		default: "ynzg8v4",
+		composer: "ynzg8v5 ynzg8v2"
+	} },
+	defaultVariants: { variant: "default" },
+	compoundVariants: []
+}), r = "ynzg8v6", i = "ynzg8v7 ynzg8v6", a = "ynzg8v8", o = "ynzg8v9", s = "ynzg8va";
+//#endregion
+export { a as inputButton, r as inputControl, n as inputField, s as inputHelperText, o as inputLabel, t as inputRoot, i as inputTextArea };
+
+//# sourceMappingURL=Input.css.js.map

package/dist/components/Input/Input.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.css.js","names":[],"sources":["../../../src/components/Input/Input.css.ts"],"sourcesContent":["import type { ComplexStyleRule } from \"@vanilla-extract/css\";\nimport { globalStyle, style } from \"@vanilla-extract/css\";\nimport type { RuntimeFn } from \"@vanilla-extract/recipes\";\nimport { recipe } from \"@vanilla-extract/recipes\";\nimport { t } from \"../../tokens/index.js\";\n\n// Shared by the text control and the label so their typography stays in lockstep.\nconst bodyText = {\n\tfontFamily: t(\"font-family-body\"),\n\tfontWeight: t(\"font-weight-regular\"),\n\tfontSize: t(\"font-size-body\"),\n\tlineHeight: t(\"line-height-body\"),\n} as const;\n\n// Field and action-button icon glyphs share sizing.\nconst iconSlotSizing = {\n\tflexShrink: 0,\n\tfontSize: t(\"icon-size-control\"),\n} as const;\n\nexport const inputRoot = style({\n\tdisplay: \"flex\",\n\tflexDirection: \"column\",\n\twidth: \"100%\",\n\tfontFamily: t(\"font-family-body\"),\n});\n\n// Empty style used purely as a stable selector anchor for the globalStyle rules\n// below — a recipe class isn't a usable selector string, so descendant styles\n// hang off this base class instead.\nconst inputFieldBase = style({});\n\n// Composer-variant anchor: composed into the `composer` variant so the control's\n// content/placeholder colors (a descendant, not the field) can be re-themed to\n// the composer-* tokens via globalStyle.\nconst inputFieldComposer = style({});\n\n// Explicit annotation: the inferred recipe type exceeds tsc's declaration\n// serialization limit (TS7056) under `tsc -p tsconfig.build.json`.\nexport const inputField: RuntimeFn<{\n\tvariant: Record<\"default\" | \"composer\", ComplexStyleRule>;\n}> = recipe({\n\tbase: [\n\t\tinputFieldBase,\n\t\t{\n\t\t\tdisplay: \"flex\",\n\t\t\talignItems: \"flex-end\",\n\t\t\tgap: t(\"gap-8\"),\n\t\t\twidth: \"100%\",\n\t\t\tminHeight: \"40px\",\n\t\t\tboxSizing: \"border-box\",\n\t\t\tpaddingInline: t(\"padding-12\"),\n\t\t\tpaddingBlock: t(\"padding-8\"),\n\t\t\tborder: `${t(\"border-width-default\")} solid ${t(\"color-border-default\")}`,\n\t\t\tbackgroundColor: t(\"color-background-default\"),\n\t\t\tborderRadius: t(\"border-radius-input\"),\n\t\t\tcursor: \"text\",\n\t\t\tselectors: {\n\t\t\t\t\"&[data-focus-within]\": {\n\t\t\t\t\tborderColor: t(\"color-border-accent\"),\n\t\t\t\t\tboxShadow: `0 0 0 ${t(\"border-width-focus\")} ${t(\"color-border-focus\")}`,\n\t\t\t\t},\n\t\t\t\t// After focus-within so an invalid field keeps its destructive border while focused.\n\t\t\t\t\"&[data-invalid]\": {\n\t\t\t\t\tborderColor: t(\"color-border-destructive\"),\n\t\t\t\t},\n\t\t\t\t\"&[data-disabled]\": {\n\t\t\t\t\tbackgroundColor: t(\"color-background-disabled\"),\n\t\t\t\t\tcursor: \"not-allowed\",\n\t\t\t\t},\n\t\t\t},\n\t\t\t\"@media\": {\n\t\t\t\t\"(prefers-reduced-motion: no-preference)\": {\n\t\t\t\t\ttransitionProperty: \"border-color, box-shadow\",\n\t\t\t\t\ttransitionDuration: t(\"duration-fast\"),\n\t\t\t\t\ttransitionTimingFunction: t(\"easing-standard\"),\n\t\t\t\t},\n\t\t\t\t// Token-color focus ring flattens in forced-colors; redraw with a system color.\n\t\t\t\t\"(forced-colors: active)\": {\n\t\t\t\t\tselectors: {\n\t\t\t\t\t\t\"&[data-focus-within]\": {\n\t\t\t\t\t\t\toutline: \"2px solid Highlight\",\n\t\t\t\t\t\t\toutlineOffset: \"2px\",\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t],\n\tvariants: {\n\t\tvariant: {\n\t\t\t// Default field styling lives in `base`; this key exists so the variant\n\t\t\t// axis accepts \"default\" as an explicit no-op.\n\t\t\tdefault: {},\n\t\t\tcomposer: [\n\t\t\t\tinputFieldComposer,\n\t\t\t\t{\n\t\t\t\t\tborderRadius: t(\"border-radius-composer\"),\n\t\t\t\t\tborder: `${t(\"border-width-default\")} solid ${t(\"composer-border-default\")}`,\n\t\t\t\t\tbackgroundColor: t(\"composer-background\"),\n\t\t\t\t\tselectors: {\n\t\t\t\t\t\t\"&[data-focus-within]\": {\n\t\t\t\t\t\t\tborderColor: t(\"composer-border-active\"),\n\t\t\t\t\t\t\tboxShadow: `0 0 0 ${t(\"border-width-focus\")} ${t(\"composer-border-focus\")}`,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t// Re-declared after focus-within for the same reason the base does:\n\t\t\t\t\t\t// variant styles are emitted after base at equal specificity, so\n\t\t\t\t\t\t// without this the composer's focus colour would win and an invalid\n\t\t\t\t\t\t// composer would lose its destructive border while focused.\n\t\t\t\t\t\t\"&[data-invalid]\": {\n\t\t\t\t\t\t\tborderColor: t(\"color-border-destructive\"),\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t],\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tvariant: \"default\",\n\t},\n});\n\nexport const inputControl = style({\n\tflex: 1,\n\tminWidth: 0,\n\tmargin: 0,\n\tpadding: 0,\n\tborder: \"none\",\n\tbackgroundColor: \"transparent\",\n\toutline: \"none\",\n\tappearance: \"none\",\n\t...bodyText,\n\tcolor: t(\"color-content-default\"),\n\tselectors: {\n\t\t\"&::placeholder\": {\n\t\t\tcolor: t(\"color-content-secondary\"),\n\t\t\topacity: 1,\n\t\t},\n\t\t\"&[data-disabled]\": {\n\t\t\tcolor: t(\"color-content-disabled\"),\n\t\t\tcursor: \"not-allowed\",\n\t\t},\n\t\t\"&[data-disabled]::placeholder\": {\n\t\t\tcolor: t(\"color-content-disabled\"),\n\t\t},\n\t},\n});\n\n// Same control base as the single-line inputControl (typography, colors,\n// placeholder/disabled states), plus the multi-line-specific box behavior.\nexport const inputTextArea = style([\n\tinputControl,\n\t{\n\t\tdisplay: \"block\",\n\t\twidth: \"100%\",\n\t\tboxSizing: \"border-box\",\n\t\t// Height is driven by the auto-grow logic in InputTextArea; the user never drags it.\n\t\tresize: \"none\",\n\t\toverflowY: \"auto\",\n\t\toverflowWrap: \"anywhere\",\n\t\twordBreak: \"break-word\",\n\t\tscrollbarWidth: \"thin\",\n\t\tscrollbarColor: `${t(\"color-border-default\")} transparent`,\n\t},\n]);\n\nexport const inputButton = style({\n\tposition: \"relative\",\n\tisolation: \"isolate\",\n\tdisplay: \"inline-flex\",\n\talignItems: \"center\",\n\tjustifyContent: \"center\",\n\tflexShrink: 0,\n\t// Circular send/action button — 22px square per Figma (matches the field's icon size).\n\twidth: \"22px\",\n\theight: \"22px\",\n\tpadding: 0,\n\tborder: \"none\",\n\tborderRadius: t(\"border-radius-full\"),\n\tbackgroundColor: t(\"button-primary-background\"),\n\tcolor: t(\"button-primary-content\"),\n\tcursor: \"pointer\",\n\tappearance: \"none\",\n\toutline: \"none\",\n\toverflow: \"hidden\",\n\t\"::after\": {\n\t\tcontent: '\"\"',\n\t\tposition: \"absolute\",\n\t\tinset: 0,\n\t\tborderRadius: \"inherit\",\n\t\tbackgroundColor: \"currentColor\",\n\t\topacity: 0,\n\t\tpointerEvents: \"none\",\n\t\tzIndex: -1,\n\t},\n\tselectors: {\n\t\t\"&[data-hovered]:not([data-disabled])::after\": {\n\t\t\topacity: t(\"opacity-state-hover\"),\n\t\t},\n\t\t\"&[data-focus-visible]:not([data-disabled])::after\": {\n\t\t\topacity: t(\"opacity-state-focus\"),\n\t\t},\n\t\t\"&[data-pressed]:not([data-disabled])::after\": {\n\t\t\topacity: t(\"opacity-state-pressed\"),\n\t\t},\n\t\t\"&[data-focus-visible]:not([data-disabled])\": {\n\t\t\tboxShadow: `0 0 0 ${t(\"border-width-focus\")} ${t(\"color-border-focus\")}`,\n\t\t},\n\t\t\"&[data-disabled]\": {\n\t\t\tcursor: \"not-allowed\",\n\t\t\tbackgroundColor: t(\"color-background-disabled\"),\n\t\t\tcolor: t(\"color-content-disabled\"),\n\t\t},\n\t},\n\t\"@media\": {\n\t\t\"(prefers-reduced-motion: no-preference)\": {\n\t\t\tselectors: {\n\t\t\t\t\"&::after\": {\n\t\t\t\t\ttransition: `opacity ${t(\"duration-fast\")} ${t(\"easing-standard\")}`,\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t\t// Token-color focus ring flattens in forced-colors; redraw with a system color.\n\t\t\"(forced-colors: active)\": {\n\t\t\tselectors: {\n\t\t\t\t\"&[data-focus-visible]:not([data-disabled])\": {\n\t\t\t\t\toutline: \"2px solid Highlight\",\n\t\t\t\t\toutlineOffset: \"2px\",\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t},\n});\n\nexport const inputLabel = style({\n\t...bodyText,\n\tmarginBottom: t(\"gap-8\"),\n\tcolor: t(\"color-content-default\"),\n});\n\nexport const inputHelperText = style({\n\tmarginTop: t(\"gap-4\"),\n\tfontFamily: t(\"font-family-body\"),\n\tfontWeight: t(\"font-weight-regular\"),\n\tfontSize: t(\"font-size-caption\"),\n\tlineHeight: t(\"line-height-caption\"),\n\tcolor: t(\"color-content-secondary\"),\n\tselectors: {\n\t\t\"&[data-invalid]\": {\n\t\t\tcolor: t(\"color-content-destructive\"),\n\t\t},\n\t},\n});\n\nglobalStyle(`${inputFieldBase} [data-slot='icon']`, iconSlotSizing);\nglobalStyle(`${inputButton} [data-slot='icon']`, iconSlotSizing);\n\n// Direct child only: field-level icons follow content color. The send button's\n// icon is a deeper descendant, so it deliberately has no rule of its own — it\n// inherits the button's paired tokens (button-primary-content over\n// button-primary-background, or the disabled pair). Giving the icon its own\n// background re-pairs an accent foreground with a neutral backdrop, and those\n// two are unrelated tokens: a customer tint near the surface color then renders\n// the arrow at ~1:1.\nglobalStyle(`${inputFieldBase} > [data-slot='icon']`, {\n\tcolor: t(\"color-content-secondary\"),\n});\n\nglobalStyle(`${inputFieldBase}[data-disabled] > [data-slot='icon']`, {\n\tcolor: t(\"color-content-disabled\"),\n});\n\n// Composer variant re-themes the field's content colors to the composer-* tokens.\n// The control (input/textarea) and field-level icons are descendants of the field,\n// so these ride the composer anchor rather than the field recipe.\nglobalStyle(`${inputFieldComposer} ${inputControl}`, {\n\tcolor: t(\"composer-content-default\"),\n});\n\nglobalStyle(`${inputFieldComposer} ${inputControl}::placeholder`, {\n\tcolor: t(\"composer-content-secondary\"),\n});\n\nglobalStyle(`${inputFieldComposer} > [data-slot='icon']`, {\n\tcolor: t(\"composer-content-secondary\"),\n});\n\n// The composer rules above are descendant selectors, so they tie with the field\n// recipe's [data-disabled] rules on specificity and win on order. Re-assert the\n// disabled colors after them or a disabled control renders as if it were editable.\nglobalStyle(`${inputFieldComposer} ${inputControl}[data-disabled]`, {\n\tcolor: t(\"color-content-disabled\"),\n});\n\nglobalStyle(\n\t`${inputFieldComposer} ${inputControl}[data-disabled]::placeholder`,\n\t{\n\t\tcolor: t(\"color-content-disabled\"),\n\t},\n);\n"],"mappings":""}

package/dist/components/Input/Input.d.ts

@@ -0,0 +1,22 @@
+import { InputButton } from "./InputButton.js";
+import { InputControl } from "./InputControl.js";
+import { InputField } from "./InputField.js";
+import { InputHelperText } from "./InputHelperText.js";
+import { InputLabel } from "./InputLabel.js";
+import { InputRoot } from "./InputRoot.js";
+import { InputTextArea } from "./InputTextArea.js";
+export type { InputButtonProps } from "./InputButton.js";
+export type { InputControlProps } from "./InputControl.js";
+export type { InputFieldProps } from "./InputField.js";
+export type { InputHelperTextProps } from "./InputHelperText.js";
+export type { InputLabelProps } from "./InputLabel.js";
+export type { InputProps } from "./InputRoot.js";
+export type { InputTextAreaProps } from "./InputTextArea.js";
+export declare const Input: typeof InputRoot & {
+    Label: typeof InputLabel;
+    Field: typeof InputField;
+    Control: typeof InputControl;
+    TextArea: typeof InputTextArea;
+    HelperText: typeof InputHelperText;
+    Button: typeof InputButton;
+};

package/dist/components/Input/Input.js

@@ -0,0 +1,20 @@
+import { InputButton as e } from "./InputButton.js";
+import { InputControl as t } from "./InputControl.js";
+import { InputField as n } from "./InputField.js";
+import { InputHelperText as r } from "./InputHelperText.js";
+import { InputLabel as i } from "./InputLabel.js";
+import { InputRoot as a } from "./InputRoot.js";
+import { InputTextArea as o } from "./InputTextArea.js";
+//#region src/components/Input/Input.tsx
+var s = Object.assign(a, {
+	Label: i,
+	Field: n,
+	Control: t,
+	TextArea: o,
+	HelperText: r,
+	Button: e
+});
+//#endregion
+export { s as Input };
+
+//# sourceMappingURL=Input.js.map

package/dist/components/Input/Input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.js","names":[],"sources":["../../../src/components/Input/Input.tsx"],"sourcesContent":["import { InputButton } from \"./InputButton.js\";\nimport { InputControl } from \"./InputControl.js\";\nimport { InputField } from \"./InputField.js\";\nimport { InputHelperText } from \"./InputHelperText.js\";\nimport { InputLabel } from \"./InputLabel.js\";\nimport { InputRoot } from \"./InputRoot.js\";\nimport { InputTextArea } from \"./InputTextArea.js\";\n\nexport type { InputButtonProps } from \"./InputButton.js\";\nexport type { InputControlProps } from \"./InputControl.js\";\nexport type { InputFieldProps } from \"./InputField.js\";\nexport type { InputHelperTextProps } from \"./InputHelperText.js\";\nexport type { InputLabelProps } from \"./InputLabel.js\";\nexport type { InputProps } from \"./InputRoot.js\";\nexport type { InputTextAreaProps } from \"./InputTextArea.js\";\n\nexport const Input = Object.assign(InputRoot, {\n\tLabel: InputLabel,\n\tField: InputField,\n\tControl: InputControl,\n\tTextArea: InputTextArea,\n\tHelperText: InputHelperText,\n\tButton: InputButton,\n});\n"],"mappings":";;;;;;;;AAgBA,IAAa,IAAQ,OAAO,OAAO,GAAW;CAC7C,OAAO;CACP,OAAO;CACP,SAAS;CACT,UAAU;CACV,YAAY;CACZ,QAAQ;CACR,CAAC"}

package/dist/components/Input/InputButton.d.ts

@@ -0,0 +1,12 @@
+import type { CSSProperties, ReactNode, Ref } from "react";
+import type { ButtonProps as AriaButtonProps } from "react-aria-components";
+export interface InputButtonProps extends Omit<AriaButtonProps, "children" | "className" | "style" | "aria-label"> {
+    /** Accessible name for the icon-only action; maps to `aria-label`. Required — there is no visible text. */
+    label: string;
+    className?: string;
+    style?: CSSProperties;
+    ref?: Ref<HTMLButtonElement>;
+    /** A single icon — compose with the shared `<Icon>` primitive (icon glyphs already wrap themselves). */
+    children: ReactNode;
+}
+export declare function InputButton({ label, className, children, isDisabled, ...rest }: InputButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Input/InputButton.js

@@ -0,0 +1,21 @@
+import { cx as e } from "../../utils/cx.js";
+import { useInputContext as t } from "./Input.context.js";
+import { inputButton as n } from "./Input.css.js";
+import { jsx as r } from "react/jsx-runtime";
+import { Button as i } from "react-aria-components";
+//#region src/components/Input/InputButton.tsx
+function a({ label: a, className: o, children: s, isDisabled: c, ...l }) {
+	let { isDisabled: u } = t();
+	return /* @__PURE__ */ r(i, {
+		...l,
+		"data-slot": "button",
+		isDisabled: c || u,
+		"aria-label": a,
+		className: e(n, o),
+		children: s
+	});
+}
+//#endregion
+export { a as InputButton };
+
+//# sourceMappingURL=InputButton.js.map

package/dist/components/Input/InputButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputButton.js","names":[],"sources":["../../../src/components/Input/InputButton.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode, Ref } from \"react\";\nimport type { ButtonProps as AriaButtonProps } from \"react-aria-components\";\nimport { Button as AriaButton } from \"react-aria-components\";\nimport { cx } from \"../../utils/cx.js\";\nimport { useInputContext } from \"./Input.context.js\";\nimport { inputButton } from \"./Input.css.js\";\n\nexport interface InputButtonProps\n\textends Omit<\n\t\tAriaButtonProps,\n\t\t\"children\" | \"className\" | \"style\" | \"aria-label\"\n\t> {\n\t/** Accessible name for the icon-only action; maps to `aria-label`. Required — there is no visible text. */\n\tlabel: string;\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tref?: Ref<HTMLButtonElement>;\n\t/** A single icon — compose with the shared `<Icon>` primitive (icon glyphs already wrap themselves). */\n\tchildren: ReactNode;\n}\n\nexport function InputButton({\n\tlabel,\n\tclassName,\n\tchildren,\n\tisDisabled,\n\t...rest\n}: InputButtonProps) {\n\tconst { isDisabled: fieldDisabled } = useInputContext();\n\treturn (\n\t\t<AriaButton\n\t\t\t{...rest}\n\t\t\tdata-slot=\"button\"\n\t\t\tisDisabled={isDisabled || fieldDisabled}\n\t\t\taria-label={label}\n\t\t\tclassName={cx(inputButton, className)}\n\t\t>\n\t\t\t{children}\n\t\t</AriaButton>\n\t);\n}\n"],"mappings":";;;;;;AAqBA,SAAgB,EAAY,EAC3B,UACA,cACA,aACA,eACA,GAAG,KACiB;CACpB,IAAM,EAAE,YAAY,MAAkB,GAAiB;AACvD,QACC,kBAAC,GAAD;EACC,GAAI;EACJ,aAAU;EACV,YAAY,KAAc;EAC1B,cAAY;EACZ,WAAW,EAAG,GAAa,EAAU;EAEpC;EACW,CAAA"}

package/dist/components/Input/InputControl.d.ts

@@ -0,0 +1,8 @@
+import type { CSSProperties, Ref } from "react";
+import type { InputProps as AriaInputProps } from "react-aria-components";
+export interface InputControlProps extends Omit<AriaInputProps, "className" | "style"> {
+    className?: string;
+    style?: CSSProperties;
+    ref?: Ref<HTMLInputElement>;
+}
+export declare function InputControl({ className, ...rest }: InputControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Input/InputControl.js

@@ -0,0 +1,15 @@
+import { cx as e } from "../../utils/cx.js";
+import { inputControl as t } from "./Input.css.js";
+import { jsx as n } from "react/jsx-runtime";
+import { Input as r } from "react-aria-components";
+//#region src/components/Input/InputControl.tsx
+function i({ className: i, ...a }) {
+	return /* @__PURE__ */ n(r, {
+		...a,
+		className: e(t, i)
+	});
+}
+//#endregion
+export { i as InputControl };
+
+//# sourceMappingURL=InputControl.js.map

package/dist/components/Input/InputControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputControl.js","names":[],"sources":["../../../src/components/Input/InputControl.tsx"],"sourcesContent":["import type { CSSProperties, Ref } from \"react\";\nimport type { InputProps as AriaInputProps } from \"react-aria-components\";\nimport { Input as AriaInput } from \"react-aria-components\";\nimport { cx } from \"../../utils/cx.js\";\nimport { inputControl } from \"./Input.css.js\";\n\nexport interface InputControlProps\n\textends Omit<AriaInputProps, \"className\" | \"style\"> {\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tref?: Ref<HTMLInputElement>;\n}\n\nexport function InputControl({ className, ...rest }: InputControlProps) {\n\treturn <AriaInput {...rest} className={cx(inputControl, className)} />;\n}\n"],"mappings":";;;;;AAaA,SAAgB,EAAa,EAAE,cAAW,GAAG,KAA2B;AACvE,QAAO,kBAAC,GAAD;EAAW,GAAI;EAAM,WAAW,EAAG,GAAc,EAAU;EAAI,CAAA"}

package/dist/components/Input/InputField.d.ts

@@ -0,0 +1,9 @@
+import type { CSSProperties, ReactNode, Ref } from "react";
+import type { GroupProps as AriaGroupProps } from "react-aria-components";
+export interface InputFieldProps extends Omit<AriaGroupProps, "className" | "style"> {
+    className?: string;
+    style?: CSSProperties;
+    ref?: Ref<HTMLDivElement>;
+    children?: ReactNode;
+}
+export declare function InputField({ className, children, onPointerDown, ...rest }: InputFieldProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Input/InputField.js

@@ -0,0 +1,23 @@
+import { cx as e } from "../../utils/cx.js";
+import { useInputContext as t } from "./Input.context.js";
+import { inputField as n } from "./Input.css.js";
+import { jsx as r } from "react/jsx-runtime";
+import { Group as i } from "react-aria-components";
+//#region src/components/Input/InputField.tsx
+function a({ className: a, children: o, onPointerDown: s, ...c }) {
+	let { variant: l } = t(), u = (e) => {
+		if (s?.(e), e.defaultPrevented || e.target.closest("button, a, input, textarea, select, [tabindex]")) return;
+		let t = e.currentTarget.querySelector("input, textarea");
+		t && (e.preventDefault(), t.focus());
+	};
+	return /* @__PURE__ */ r(i, {
+		...c,
+		onPointerDown: u,
+		className: e(n({ variant: l }), a),
+		children: o
+	});
+}
+//#endregion
+export { a as InputField };
+
+//# sourceMappingURL=InputField.js.map

package/dist/components/Input/InputField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputField.js","names":[],"sources":["../../../src/components/Input/InputField.tsx"],"sourcesContent":["import type { CSSProperties, PointerEvent, ReactNode, Ref } from \"react\";\nimport type { GroupProps as AriaGroupProps } from \"react-aria-components\";\nimport { Group as AriaGroup } from \"react-aria-components\";\nimport { cx } from \"../../utils/cx.js\";\nimport { useInputContext } from \"./Input.context.js\";\nimport { inputField } from \"./Input.css.js\";\n\nexport interface InputFieldProps\n\textends Omit<AriaGroupProps, \"className\" | \"style\"> {\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tref?: Ref<HTMLDivElement>;\n\tchildren?: ReactNode;\n}\n\nexport function InputField({\n\tclassName,\n\tchildren,\n\tonPointerDown,\n\t...rest\n}: InputFieldProps) {\n\tconst { variant } = useInputContext();\n\tconst handlePointerDown = (event: PointerEvent<HTMLDivElement>) => {\n\t\tonPointerDown?.(event);\n\t\tif (event.defaultPrevented) {\n\t\t\treturn;\n\t\t}\n\t\tconst target = event.target as HTMLElement;\n\t\tif (target.closest(\"button, a, input, textarea, select, [tabindex]\")) {\n\t\t\treturn;\n\t\t}\n\t\tconst control =\n\t\t\tevent.currentTarget.querySelector<HTMLInputElement>(\"input, textarea\");\n\t\tif (control) {\n\t\t\tevent.preventDefault();\n\t\t\tcontrol.focus();\n\t\t}\n\t};\n\treturn (\n\t\t<AriaGroup\n\t\t\t{...rest}\n\t\t\tonPointerDown={handlePointerDown}\n\t\t\tclassName={cx(inputField({ variant }), className)}\n\t\t>\n\t\t\t{children}\n\t\t</AriaGroup>\n\t);\n}\n"],"mappings":";;;;;;AAeA,SAAgB,EAAW,EAC1B,cACA,aACA,kBACA,GAAG,KACgB;CACnB,IAAM,EAAE,eAAY,GAAiB,EAC/B,KAAqB,MAAwC;AAMlE,MALA,IAAgB,EAAM,EAClB,EAAM,oBAGK,EAAM,OACV,QAAQ,iDAAiD,CACnE;EAED,IAAM,IACL,EAAM,cAAc,cAAgC,kBAAkB;AACvE,EAAI,MACH,EAAM,gBAAgB,EACtB,EAAQ,OAAO;;AAGjB,QACC,kBAAC,GAAD;EACC,GAAI;EACJ,eAAe;EACf,WAAW,EAAG,EAAW,EAAE,YAAS,CAAC,EAAE,EAAU;EAEhD;EACU,CAAA"}

package/dist/components/Input/InputHelperText.d.ts

@@ -0,0 +1,8 @@
+import type { CSSProperties, Ref } from "react";
+import type { TextProps as AriaTextProps } from "react-aria-components";
+export interface InputHelperTextProps extends Omit<AriaTextProps, "className" | "style" | "slot"> {
+    className?: string;
+    style?: CSSProperties;
+    ref?: Ref<HTMLElement>;
+}
+export declare function InputHelperText({ className, children, ...rest }: InputHelperTextProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Input/InputHelperText.js

@@ -0,0 +1,20 @@
+import { cx as e } from "../../utils/cx.js";
+import { useInputContext as t } from "./Input.context.js";
+import { inputHelperText as n } from "./Input.css.js";
+import { jsx as r } from "react/jsx-runtime";
+import { Text as i } from "react-aria-components";
+//#region src/components/Input/InputHelperText.tsx
+function a({ className: a, children: o, ...s }) {
+	let { isInvalid: c } = t();
+	return /* @__PURE__ */ r(i, {
+		...s,
+		slot: "description",
+		"data-invalid": c || void 0,
+		className: e(n, a),
+		children: o
+	});
+}
+//#endregion
+export { a as InputHelperText };
+
+//# sourceMappingURL=InputHelperText.js.map

package/dist/components/Input/InputHelperText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputHelperText.js","names":[],"sources":["../../../src/components/Input/InputHelperText.tsx"],"sourcesContent":["import type { CSSProperties, Ref } from \"react\";\nimport type { TextProps as AriaTextProps } from \"react-aria-components\";\nimport { Text as AriaText } from \"react-aria-components\";\nimport { cx } from \"../../utils/cx.js\";\nimport { useInputContext } from \"./Input.context.js\";\nimport { inputHelperText } from \"./Input.css.js\";\n\nexport interface InputHelperTextProps\n\textends Omit<AriaTextProps, \"className\" | \"style\" | \"slot\"> {\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tref?: Ref<HTMLElement>;\n}\n\nexport function InputHelperText({\n\tclassName,\n\tchildren,\n\t...rest\n}: InputHelperTextProps) {\n\tconst { isInvalid } = useInputContext();\n\treturn (\n\t\t<AriaText\n\t\t\t{...rest}\n\t\t\tslot=\"description\"\n\t\t\tdata-invalid={isInvalid || undefined}\n\t\t\tclassName={cx(inputHelperText, className)}\n\t\t>\n\t\t\t{children}\n\t\t</AriaText>\n\t);\n}\n"],"mappings":";;;;;;AAcA,SAAgB,EAAgB,EAC/B,cACA,aACA,GAAG,KACqB;CACxB,IAAM,EAAE,iBAAc,GAAiB;AACvC,QACC,kBAAC,GAAD;EACC,GAAI;EACJ,MAAK;EACL,gBAAc,KAAa,KAAA;EAC3B,WAAW,EAAG,GAAiB,EAAU;EAExC;EACS,CAAA"}

package/dist/components/Input/InputLabel.d.ts

@@ -0,0 +1,8 @@
+import type { CSSProperties, Ref } from "react";
+import type { LabelProps as AriaLabelProps } from "react-aria-components";
+export interface InputLabelProps extends Omit<AriaLabelProps, "className" | "style"> {
+    className?: string;
+    style?: CSSProperties;
+    ref?: Ref<HTMLLabelElement>;
+}
+export declare function InputLabel({ className, children, ...rest }: InputLabelProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Input/InputLabel.js

@@ -0,0 +1,16 @@
+import { cx as e } from "../../utils/cx.js";
+import { inputLabel as t } from "./Input.css.js";
+import { jsx as n } from "react/jsx-runtime";
+import { Label as r } from "react-aria-components";
+//#region src/components/Input/InputLabel.tsx
+function i({ className: i, children: a, ...o }) {
+	return /* @__PURE__ */ n(r, {
+		...o,
+		className: e(t, i),
+		children: a
+	});
+}
+//#endregion
+export { i as InputLabel };
+
+//# sourceMappingURL=InputLabel.js.map

package/dist/components/Input/InputLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputLabel.js","names":[],"sources":["../../../src/components/Input/InputLabel.tsx"],"sourcesContent":["import type { CSSProperties, Ref } from \"react\";\nimport type { LabelProps as AriaLabelProps } from \"react-aria-components\";\nimport { Label as AriaLabel } from \"react-aria-components\";\nimport { cx } from \"../../utils/cx.js\";\nimport { inputLabel } from \"./Input.css.js\";\n\nexport interface InputLabelProps\n\textends Omit<AriaLabelProps, \"className\" | \"style\"> {\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tref?: Ref<HTMLLabelElement>;\n}\n\nexport function InputLabel({ className, children, ...rest }: InputLabelProps) {\n\treturn (\n\t\t<AriaLabel {...rest} className={cx(inputLabel, className)}>\n\t\t\t{children}\n\t\t</AriaLabel>\n\t);\n}\n"],"mappings":";;;;;AAaA,SAAgB,EAAW,EAAE,cAAW,aAAU,GAAG,KAAyB;AAC7E,QACC,kBAAC,GAAD;EAAW,GAAI;EAAM,WAAW,EAAG,GAAY,EAAU;EACvD;EACU,CAAA"}

package/dist/components/Input/InputRoot.d.ts

@@ -0,0 +1,11 @@
+import type { CSSProperties, ReactNode, Ref } from "react";
+import type { TextFieldProps as AriaTextFieldProps } from "react-aria-components";
+import type { InputVariant } from "./Input.context.js";
+export interface InputProps extends Omit<AriaTextFieldProps, "children" | "className" | "style"> {
+    variant?: InputVariant;
+    className?: string;
+    style?: CSSProperties;
+    ref?: Ref<HTMLDivElement>;
+    children?: ReactNode;
+}
+export declare function InputRoot({ className, children, variant, ...rest }: InputProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Input/InputRoot.js

@@ -0,0 +1,30 @@
+import { cx as e } from "../../utils/cx.js";
+import { InputContext as t } from "./Input.context.js";
+import { inputRoot as n } from "./Input.css.js";
+import { jsx as r } from "react/jsx-runtime";
+import { TextField as i } from "react-aria-components";
+import { useMemo as a } from "react";
+//#region src/components/Input/InputRoot.tsx
+function o({ className: o, children: s, variant: c = "default", ...l }) {
+	let u = l.isDisabled ?? !1, d = l.isInvalid ?? !1, f = a(() => ({
+		isDisabled: u,
+		isInvalid: d,
+		variant: c
+	}), [
+		u,
+		d,
+		c
+	]);
+	return /* @__PURE__ */ r(i, {
+		...l,
+		className: e(n, o),
+		children: /* @__PURE__ */ r(t.Provider, {
+			value: f,
+			children: s
+		})
+	});
+}
+//#endregion
+export { o as InputRoot };
+
+//# sourceMappingURL=InputRoot.js.map

package/dist/components/Input/InputRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputRoot.js","names":[],"sources":["../../../src/components/Input/InputRoot.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode, Ref } from \"react\";\nimport { useMemo } from \"react\";\nimport type { TextFieldProps as AriaTextFieldProps } from \"react-aria-components\";\nimport { TextField as AriaTextField } from \"react-aria-components\";\nimport { cx } from \"../../utils/cx.js\";\nimport type { InputVariant } from \"./Input.context.js\";\nimport { InputContext } from \"./Input.context.js\";\nimport { inputRoot } from \"./Input.css.js\";\n\nexport interface InputProps\n\textends Omit<AriaTextFieldProps, \"children\" | \"className\" | \"style\"> {\n\tvariant?: InputVariant;\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tref?: Ref<HTMLDivElement>;\n\tchildren?: ReactNode;\n}\n\nexport function InputRoot({\n\tclassName,\n\tchildren,\n\tvariant = \"default\",\n\t...rest\n}: InputProps) {\n\tconst isDisabled = rest.isDisabled ?? false;\n\tconst isInvalid = rest.isInvalid ?? false;\n\tconst context = useMemo(\n\t\t() => ({ isDisabled, isInvalid, variant }),\n\t\t[isDisabled, isInvalid, variant],\n\t);\n\treturn (\n\t\t<AriaTextField {...rest} className={cx(inputRoot, className)}>\n\t\t\t<InputContext.Provider value={context}>{children}</InputContext.Provider>\n\t\t</AriaTextField>\n\t);\n}\n"],"mappings":";;;;;;;AAkBA,SAAgB,EAAU,EACzB,cACA,aACA,aAAU,WACV,GAAG,KACW;CACd,IAAM,IAAa,EAAK,cAAc,IAChC,IAAY,EAAK,aAAa,IAC9B,IAAU,SACR;EAAE;EAAY;EAAW;EAAS,GACzC;EAAC;EAAY;EAAW;EAAQ,CAChC;AACD,QACC,kBAAC,GAAD;EAAe,GAAI;EAAM,WAAW,EAAG,GAAW,EAAU;YAC3D,kBAAC,EAAa,UAAd;GAAuB,OAAO;GAAU;GAAiC,CAAA;EAC1D,CAAA"}

package/dist/components/Input/InputTextArea.d.ts

@@ -0,0 +1,15 @@
+import type { CSSProperties, Ref } from "react";
+import type { TextAreaProps as AriaTextAreaProps } from "react-aria-components";
+export interface InputTextAreaProps extends Omit<AriaTextAreaProps, "className" | "style"> {
+    className?: string;
+    style?: CSSProperties;
+    ref?: Ref<HTMLTextAreaElement>;
+    /** Rows the textarea occupies before it starts growing. Default 1. */
+    minRows?: number;
+    /** Rows the textarea grows to before it scrolls instead. Default: uncapped. */
+    maxRows?: number;
+}
+/** Multi-line control for `Input`, wrapping RAC's `TextArea`. Auto-grows with its
+ * content between `minRows` and `maxRows`, then scrolls. Use in place of
+ * `Input.Control` when the field needs multiple lines (e.g. a message composer). */
+export declare function InputTextArea({ className, ref, minRows, maxRows, rows, onInput, ...rest }: InputTextAreaProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Input/InputTextArea.js

@@ -0,0 +1,39 @@
+import { cx as e } from "../../utils/cx.js";
+import { inputTextArea as t } from "./Input.css.js";
+import { jsx as n } from "react/jsx-runtime";
+import { TextArea as r } from "react-aria-components";
+import { useCallback as i, useLayoutEffect as a } from "react";
+import { useObjectRef as o } from "react-aria/useObjectRef";
+//#region src/components/Input/InputTextArea.tsx
+function s({ className: s, ref: c, minRows: l = 1, maxRows: u, rows: d, onInput: f, ...p }) {
+	let m = o(c), h = i(() => {
+		let e = m.current;
+		if (!e) return;
+		let t = Number.parseFloat(getComputedStyle(e).lineHeight);
+		if (!Number.isFinite(t)) return;
+		e.style.height = "auto";
+		let n = e.scrollHeight, r = l * t, i = u == null ? Infinity : u * t, a = Math.min(Math.max(n, r), i);
+		e.style.height = `${a}px`, e.style.overflowY = n > i ? "auto" : "hidden";
+	}, [
+		m,
+		l,
+		u
+	]);
+	a(() => {
+		h();
+	});
+	let g = i((e) => {
+		h(), f?.(e);
+	}, [h, f]);
+	return /* @__PURE__ */ n(r, {
+		...p,
+		ref: m,
+		rows: d ?? l,
+		onInput: g,
+		className: e(t, s)
+	});
+}
+//#endregion
+export { s as InputTextArea };
+
+//# sourceMappingURL=InputTextArea.js.map

package/dist/components/Input/InputTextArea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputTextArea.js","names":[],"sources":["../../../src/components/Input/InputTextArea.tsx"],"sourcesContent":["import type { CSSProperties, Ref } from \"react\";\nimport { useCallback, useLayoutEffect } from \"react\";\nimport { useObjectRef } from \"react-aria/useObjectRef\";\nimport type { TextAreaProps as AriaTextAreaProps } from \"react-aria-components\";\nimport { TextArea as AriaTextArea } from \"react-aria-components\";\nimport { cx } from \"../../utils/cx.js\";\nimport { inputTextArea } from \"./Input.css.js\";\n\nexport interface InputTextAreaProps\n\textends Omit<AriaTextAreaProps, \"className\" | \"style\"> {\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tref?: Ref<HTMLTextAreaElement>;\n\t/** Rows the textarea occupies before it starts growing. Default 1. */\n\tminRows?: number;\n\t/** Rows the textarea grows to before it scrolls instead. Default: uncapped. */\n\tmaxRows?: number;\n}\n\n/** Multi-line control for `Input`, wrapping RAC's `TextArea`. Auto-grows with its\n * content between `minRows` and `maxRows`, then scrolls. Use in place of\n * `Input.Control` when the field needs multiple lines (e.g. a message composer). */\nexport function InputTextArea({\n\tclassName,\n\tref,\n\tminRows = 1,\n\tmaxRows,\n\trows,\n\tonInput,\n\t...rest\n}: InputTextAreaProps) {\n\t// useObjectRef gives us an object ref to read for measurement while still\n\t// forwarding to the caller's ref (object or callback).\n\tconst objRef = useObjectRef(ref);\n\n\tconst resize = useCallback(() => {\n\t\tconst el = objRef.current;\n\t\tif (!el) {\n\t\t\treturn;\n\t\t}\n\t\t// Measure the element's own line-height so the row→px math holds regardless\n\t\t// of token values; padding/border are 0 here, so height === content height.\n\t\tconst lineHeight = Number.parseFloat(getComputedStyle(el).lineHeight);\n\t\tif (!Number.isFinite(lineHeight)) {\n\t\t\treturn;\n\t\t}\n\t\tel.style.height = \"auto\";\n\t\tconst content = el.scrollHeight;\n\t\tconst min = minRows * lineHeight;\n\t\tconst max =\n\t\t\tmaxRows != null ? maxRows * lineHeight : Number.POSITIVE_INFINITY;\n\t\tconst next = Math.min(Math.max(content, min), max);\n\t\tel.style.height = `${next}px`;\n\t\tel.style.overflowY = content > max ? \"auto\" : \"hidden\";\n\t}, [objRef, minRows, maxRows]);\n\n\t// Re-measure after every commit: for a controlled field RAC re-renders on each\n\t// keystroke and on programmatic value changes (e.g. clear-on-send), so this\n\t// stays in sync without a value dependency. Setting inline height does not\n\t// schedule a render, so there is no loop. (Standard autosize-textarea pattern.)\n\tuseLayoutEffect(() => {\n\t\tresize();\n\t});\n\n\t// An uncontrolled field mutates the DOM without a React render, so the effect\n\t// above never re-fires while typing — resize off the native input event too.\n\tconst handleInput = useCallback(\n\t\t(event: Parameters<NonNullable<AriaTextAreaProps[\"onInput\"]>>[0]) => {\n\t\t\tresize();\n\t\t\tonInput?.(event);\n\t\t},\n\t\t[resize, onInput],\n\t);\n\n\treturn (\n\t\t<AriaTextArea\n\t\t\t{...rest}\n\t\t\tref={objRef}\n\t\t\trows={rows ?? minRows}\n\t\t\tonInput={handleInput}\n\t\t\tclassName={cx(inputTextArea, className)}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;;AAsBA,SAAgB,EAAc,EAC7B,cACA,QACA,aAAU,GACV,YACA,SACA,YACA,GAAG,KACmB;CAGtB,IAAM,IAAS,EAAa,EAAI,EAE1B,IAAS,QAAkB;EAChC,IAAM,IAAK,EAAO;AAClB,MAAI,CAAC,EACJ;EAID,IAAM,IAAa,OAAO,WAAW,iBAAiB,EAAG,CAAC,WAAW;AACrE,MAAI,CAAC,OAAO,SAAS,EAAW,CAC/B;AAED,IAAG,MAAM,SAAS;EAClB,IAAM,IAAU,EAAG,cACb,IAAM,IAAU,GAChB,IACL,KAAW,OAA8B,WAAvB,IAAU,GACvB,IAAO,KAAK,IAAI,KAAK,IAAI,GAAS,EAAI,EAAE,EAAI;AAElD,EADA,EAAG,MAAM,SAAS,GAAG,EAAK,KAC1B,EAAG,MAAM,YAAY,IAAU,IAAM,SAAS;IAC5C;EAAC;EAAQ;EAAS;EAAQ,CAAC;AAM9B,SAAsB;AACrB,KAAQ;GACP;CAIF,IAAM,IAAc,GAClB,MAAoE;AAEpE,EADA,GAAQ,EACR,IAAU,EAAM;IAEjB,CAAC,GAAQ,EAAQ,CACjB;AAED,QACC,kBAAC,GAAD;EACC,GAAI;EACJ,KAAK;EACL,MAAM,KAAQ;EACd,SAAS;EACT,WAAW,EAAG,GAAe,EAAU;EACtC,CAAA"}

package/dist/components/Input/index.d.ts

@@ -0,0 +1,2 @@
+export type { InputButtonProps, InputControlProps, InputFieldProps, InputHelperTextProps, InputLabelProps, InputProps, InputTextAreaProps, } from "./Input.js";
+export { Input } from "./Input.js";

package/dist/components/Link/Link.css.d.ts

@@ -0,0 +1,8 @@
+export declare const linkRoot: import("@vanilla-extract/recipes").RuntimeFn<{
+    underlined: {
+        true: {
+            textDecoration: "underline";
+        };
+        false: {};
+    };
+}>;

package/dist/components/Link/Link.css.js

@@ -0,0 +1,16 @@
+import { createRuntimeFn as e } from "../../vendor/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";
+/* empty css                        */
+//#region src/components/Link/Link.css.ts
+var t = e({
+	defaultClassName: "k107bi1 k107bi0",
+	variantClassNames: { underlined: {
+		true: "k107bi2",
+		false: "k107bi3"
+	} },
+	defaultVariants: { underlined: !1 },
+	compoundVariants: []
+});
+//#endregion
+export { t as linkRoot };
+
+//# sourceMappingURL=Link.css.js.map

package/dist/components/Link/Link.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Link.css.js","names":[],"sources":["../../../src/components/Link/Link.css.ts"],"sourcesContent":["import { globalStyle, style } from \"@vanilla-extract/css\";\nimport { recipe } from \"@vanilla-extract/recipes\";\nimport { t } from \"../../tokens/index.js\";\n\nconst linkBase = style({});\n\nexport const linkRoot = recipe({\n\tbase: [\n\t\tlinkBase,\n\t\t{\n\t\t\tposition: \"relative\",\n\t\t\tisolation: \"isolate\",\n\t\t\tdisplay: \"inline-flex\",\n\t\t\talignItems: \"center\",\n\t\t\tgap: t(\"gap-4\"),\n\t\t\tcolor: t(\"color-content-link\"),\n\t\t\tfontFamily: t(\"font-family-body\"),\n\t\t\tfontWeight: t(\"font-weight-regular\"),\n\t\t\tfontSize: t(\"font-size-body\"),\n\t\t\tlineHeight: t(\"line-height-body\"),\n\t\t\twordBreak: \"break-word\",\n\t\t\ttextDecoration: \"none\",\n\t\t\tcursor: \"pointer\",\n\t\t\toutline: \"none\",\n\t\t\tborderRadius: t(\"border-radius-6\"),\n\t\t\t\"::after\": {\n\t\t\t\tcontent: '\"\"',\n\t\t\t\tposition: \"absolute\",\n\t\t\t\t// Horizontal breathing room lives on the decorative overlay, not the\n\t\t\t\t// element box, so the state layer balances against the icon's trailing\n\t\t\t\t// whitespace without altering the link's inline layout footprint.\n\t\t\t\tinsetBlock: 0,\n\t\t\t\tinsetInline: `calc(-1 * ${t(\"padding-4\")})`,\n\t\t\t\tborderRadius: \"inherit\",\n\t\t\t\tbackgroundColor: \"currentColor\",\n\t\t\t\topacity: 0,\n\t\t\t\tpointerEvents: \"none\",\n\t\t\t\tzIndex: -1,\n\t\t\t\ttransition: `opacity ${t(\"duration-fast\")} ${t(\"easing-standard\")}`,\n\t\t\t},\n\t\t\tselectors: {\n\t\t\t\t// Without the trailing icon, the underline is the only non-color\n\t\t\t\t// signal that this is a link, so it is mandatory when no icon shows.\n\t\t\t\t\"&:not([data-icon])\": {\n\t\t\t\t\ttextDecoration: \"underline\",\n\t\t\t\t},\n\t\t\t\t\"&[data-hovered]:not([data-disabled])::after\": {\n\t\t\t\t\topacity: t(\"opacity-state-hover\"),\n\t\t\t\t},\n\t\t\t\t\"&[data-focus-visible]:not([data-disabled])::after\": {\n\t\t\t\t\topacity: t(\"opacity-state-focus\"),\n\t\t\t\t},\n\t\t\t\t\"&[data-pressed]:not([data-disabled])::after\": {\n\t\t\t\t\topacity: t(\"opacity-state-pressed\"),\n\t\t\t\t},\n\t\t\t\t\"&[data-focus-visible]:not([data-disabled])\": {\n\t\t\t\t\tboxShadow: `0 0 0 ${t(\"border-width-focus\")} ${t(\"color-border-focus\")}`,\n\t\t\t\t},\n\t\t\t\t\"&[data-disabled]\": {\n\t\t\t\t\tcursor: \"not-allowed\",\n\t\t\t\t\tcolor: t(\"color-content-disabled\"),\n\t\t\t\t},\n\t\t\t},\n\t\t\t\"@media\": {\n\t\t\t\t\"(forced-colors: active)\": {\n\t\t\t\t\tselectors: {\n\t\t\t\t\t\t\"&[data-focus-visible]:not([data-disabled])\": {\n\t\t\t\t\t\t\toutline: \"2px solid Highlight\",\n\t\t\t\t\t\t\toutlineOffset: \"2px\",\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t],\n\tvariants: {\n\t\tunderlined: {\n\t\t\ttrue: { textDecoration: \"underline\" },\n\t\t\tfalse: {},\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tunderlined: false,\n\t},\n});\n\nglobalStyle(`${linkBase} [data-slot='icon']`, {\n\tflexShrink: 0,\n\tfontSize: t(\"icon-size-control\"),\n});\n\n// The external-link arrow points outward in the reading direction, so it mirrors\n// under RTL. The download glyph is direction-neutral and is left unmirrored.\nglobalStyle(`[dir=\"rtl\"] ${linkBase}:not([data-download]) [data-slot='icon']`, {\n\ttransform: \"scaleX(-1)\",\n});\n"],"mappings":""}

package/dist/components/Link/Link.d.ts

@@ -0,0 +1,12 @@
+import type { CSSProperties, ReactNode, Ref } from "react";
+import type { LinkProps as AriaLinkProps } from "react-aria-components";
+export interface LinkProps extends Omit<AriaLinkProps, "children" | "className" | "style"> {
+    underlined?: boolean;
+    showIcon?: boolean;
+    download?: boolean | string;
+    className?: string;
+    style?: CSSProperties;
+    ref?: Ref<HTMLAnchorElement>;
+    children?: ReactNode;
+}
+export declare function Link({ underlined, showIcon, download, className, children, ...rest }: LinkProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Link/Link.js

@@ -0,0 +1,24 @@
+import { cx as e } from "../../utils/cx.js";
+import { ArrowNortheast as t } from "../Icon/icons/ArrowNortheast.js";
+import { Download as n } from "../Icon/icons/Download.js";
+import { linkRoot as r } from "./Link.css.js";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Link as o } from "react-aria-components";
+//#region src/components/Link/Link.tsx
+function s({ underlined: s = !1, showIcon: c = !0, download: l, className: u, children: d, ...f }) {
+	let p = l !== void 0 && l !== !1;
+	return /* @__PURE__ */ a(o, {
+		...f,
+		download: l,
+		"data-slot": "link",
+		"data-icon": c || void 0,
+		"data-underlined": s || void 0,
+		"data-download": p || void 0,
+		className: e(r({ underlined: s }), u),
+		children: [d, c && i(p ? n : t, {})]
+	});
+}
+//#endregion
+export { s as Link };
+
+//# sourceMappingURL=Link.js.map

package/dist/components/Link/Link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Link.js","names":[],"sources":["../../../src/components/Link/Link.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode, Ref } from \"react\";\nimport type { LinkProps as AriaLinkProps } from \"react-aria-components\";\nimport { Link as AriaLink } from \"react-aria-components\";\nimport { cx } from \"../../utils/cx.js\";\nimport { ArrowNortheast, Download } from \"../Icon/icons/index.js\";\nimport { linkRoot } from \"./Link.css.js\";\n\nexport interface LinkProps\n\textends Omit<AriaLinkProps, \"children\" | \"className\" | \"style\"> {\n\tunderlined?: boolean;\n\tshowIcon?: boolean;\n\tdownload?: boolean | string;\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tref?: Ref<HTMLAnchorElement>;\n\tchildren?: ReactNode;\n}\n\nexport function Link({\n\tunderlined = false,\n\tshowIcon = true,\n\tdownload,\n\tclassName,\n\tchildren,\n\t...rest\n}: LinkProps) {\n\tconst isDownload = download !== undefined && download !== false;\n\treturn (\n\t\t<AriaLink\n\t\t\t{...rest}\n\t\t\tdownload={download}\n\t\t\tdata-slot=\"link\"\n\t\t\tdata-icon={showIcon || undefined}\n\t\t\tdata-underlined={underlined || undefined}\n\t\t\tdata-download={isDownload || undefined}\n\t\t\tclassName={cx(linkRoot({ underlined }), className)}\n\t\t>\n\t\t\t{children}\n\t\t\t{showIcon && (isDownload ? <Download /> : <ArrowNortheast />)}\n\t\t</AriaLink>\n\t);\n}\n"],"mappings":";;;;;;;AAkBA,SAAgB,EAAK,EACpB,gBAAa,IACb,cAAW,IACX,aACA,cACA,aACA,GAAG,KACU;CACb,IAAM,IAAa,MAAa,KAAA,KAAa,MAAa;AAC1D,QACC,kBAAC,GAAD;EACC,GAAI;EACM;EACV,aAAU;EACV,aAAW,KAAY,KAAA;EACvB,mBAAiB,KAAc,KAAA;EAC/B,iBAAe,KAAc,KAAA;EAC7B,WAAW,EAAG,EAAS,EAAE,eAAY,CAAC,EAAE,EAAU;YAPnD,CASE,GACA,KAA0B,EAAb,IAAc,IAAe,GAAhB,EAAY,CAAqB,CAClD"}

package/dist/components/Link/index.d.ts

@@ -0,0 +1,2 @@
+export type { LinkProps } from "./Link.js";
+export { Link } from "./Link.js";

package/dist/components/MenuItem/Menu.d.ts

@@ -0,0 +1,14 @@
+import type { CSSProperties, Ref } from "react";
+import type { MenuProps as AriaMenuProps } from "react-aria-components";
+export interface MenuProps<T extends object = object> extends Omit<AriaMenuProps<T>, "className" | "style"> {
+    className?: string;
+    style?: CSSProperties;
+    ref?: Ref<HTMLDivElement>;
+}
+/**
+ * A `role="menu"` collection container for `MenuItem` rows. Owns keyboard
+ * navigation (arrow keys, typeahead) and the menu's accessible name — supply
+ * `aria-label` or `aria-labelledby`. Render inside React Aria's `MenuTrigger` +
+ * `Popover` for a dropdown, or standalone for an inline menu.
+ */
+export declare function Menu<T extends object>({ className, ...rest }: MenuProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/components/MenuItem/Menu.js

@@ -0,0 +1,15 @@
+import { cx as e } from "../../utils/cx.js";
+import { menu as t } from "./MenuItem.css.js";
+import { jsx as n } from "react/jsx-runtime";
+import { Menu as r } from "react-aria-components";
+//#region src/components/MenuItem/Menu.tsx
+function i({ className: i, ...a }) {
+	return /* @__PURE__ */ n(r, {
+		...a,
+		className: e(t, i)
+	});
+}
+//#endregion
+export { i as Menu };
+
+//# sourceMappingURL=Menu.js.map

package/dist/components/MenuItem/Menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.js","names":[],"sources":["../../../src/components/MenuItem/Menu.tsx"],"sourcesContent":["import type { CSSProperties, Ref } from \"react\";\nimport type { MenuProps as AriaMenuProps } from \"react-aria-components\";\nimport { Menu as AriaMenu } from \"react-aria-components\";\nimport { cx } from \"../../utils/cx.js\";\nimport { menu } from \"./MenuItem.css.js\";\n\nexport interface MenuProps<T extends object = object>\n\textends Omit<AriaMenuProps<T>, \"className\" | \"style\"> {\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tref?: Ref<HTMLDivElement>;\n}\n\n/**\n * A `role=\"menu\"` collection container for `MenuItem` rows. Owns keyboard\n * navigation (arrow keys, typeahead) and the menu's accessible name — supply\n * `aria-label` or `aria-labelledby`. Render inside React Aria's `MenuTrigger` +\n * `Popover` for a dropdown, or standalone for an inline menu.\n */\nexport function Menu<T extends object>({ className, ...rest }: MenuProps<T>) {\n\treturn <AriaMenu {...rest} className={cx(menu, className)} />;\n}\n"],"mappings":";;;;;AAmBA,SAAgB,EAAuB,EAAE,cAAW,GAAG,KAAsB;AAC5E,QAAO,kBAAC,GAAD;EAAU,GAAI;EAAM,WAAW,EAAG,GAAM,EAAU;EAAI,CAAA"}

package/dist/components/MenuItem/MenuItem.css.d.ts

@@ -0,0 +1,4 @@
+export declare const menu: string;
+export declare const menuItem: string;
+export declare const menuItemLeading: string;
+export declare const menuItemTrailing: string;

package/dist/components/MenuItem/MenuItem.css.js

@@ -0,0 +1,7 @@
+/* empty css                            */
+//#region src/components/MenuItem/MenuItem.css.ts
+var e = "fa1x5n0", t = "fa1x5n1", n = "fa1x5n2", r = "fa1x5n3";
+//#endregion
+export { e as menu, t as menuItem, n as menuItemLeading, r as menuItemTrailing };
+
+//# sourceMappingURL=MenuItem.css.js.map

package/dist/components/MenuItem/MenuItem.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.css.js","names":[],"sources":["../../../src/components/MenuItem/MenuItem.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\nimport { t } from \"../../tokens/index.js\";\n\n// The row is a fixed 40px control frame and each slot a fixed 24px box — Figma\n// pins both as literals (no control-size token tier exists yet), the same\n// treatment as Chip's height and Radio's control size.\nconst ROW_HEIGHT = \"40px\";\nconst SLOT_SIZE = \"24px\";\n\n// Shared 24px slot box that centres an icon or a selection indicator. `fontSize`\n// drives a slotted `<Icon>`'s 1em glyph up to the slot size; `color: inherit`\n// lets the glyph track the row's content colour (and its disabled dim).\nconst slotBase = {\n\tdisplay: \"inline-flex\",\n\talignItems: \"center\",\n\tjustifyContent: \"center\",\n\tboxSizing: \"border-box\",\n\tflexShrink: 0,\n\twidth: SLOT_SIZE,\n\theight: SLOT_SIZE,\n\tfontSize: t(\"icon-size-lg\"),\n\tcolor: \"inherit\",\n} as const;\n\nexport const menu = style({\n\tdisplay: \"flex\",\n\tflexDirection: \"column\",\n\toutline: \"none\",\n});\n\nexport const menuItem = style({\n\tposition: \"relative\",\n\tisolation: \"isolate\",\n\tboxSizing: \"border-box\",\n\tdisplay: \"flex\",\n\talignItems: \"center\",\n\tgap: t(\"gap-12\"),\n\theight: ROW_HEIGHT,\n\tpaddingInline: t(\"padding-8\"),\n\tborderRadius: t(\"border-radius-button\"),\n\tborder: `${t(\"border-width-default\")} solid transparent`,\n\tbackgroundColor: t(\"color-background-default\"),\n\tcolor: t(\"color-content-default\"),\n\tfontFamily: t(\"font-family-body\"),\n\tfontSize: t(\"font-size-body\"),\n\tfontWeight: t(\"font-weight-regular\"),\n\tlineHeight: t(\"line-height-body\"),\n\ttextAlign: \"start\",\n\tcursor: \"pointer\",\n\tuserSelect: \"none\",\n\toutline: \"none\",\n\ttransitionProperty: \"background-color, border-color\",\n\ttransitionDuration: t(\"duration-fast\"),\n\ttransitionTimingFunction: t(\"easing-standard\"),\n\t\"::after\": {\n\t\tcontent: '\"\"',\n\t\tposition: \"absolute\",\n\t\tinset: 0,\n\t\tborderRadius: \"inherit\",\n\t\tbackgroundColor: \"currentColor\",\n\t\topacity: 0,\n\t\tpointerEvents: \"none\",\n\t\tzIndex: -1,\n\t\ttransition: `opacity ${t(\"duration-fast\")} ${t(\"easing-standard\")}`,\n\t},\n\tselectors: {\n\t\t\"&[data-hovered]:not([data-disabled])::after\": {\n\t\t\topacity: t(\"opacity-state-hover\"),\n\t\t},\n\t\t\"&[data-focus-visible]:not([data-disabled])::after\": {\n\t\t\topacity: t(\"opacity-state-focus\"),\n\t\t},\n\t\t\"&[data-pressed]:not([data-disabled])::after\": {\n\t\t\topacity: t(\"opacity-state-pressed\"),\n\t\t},\n\t\t// Focus: inner 1px accent border + outer 2px focus ring (Figma double ring).\n\t\t\"&[data-focus-visible]:not([data-disabled])\": {\n\t\t\tborderColor: t(\"color-border-accent\"),\n\t\t\tboxShadow: `0 0 0 ${t(\"border-width-focus\")} ${t(\"color-border-focus\")}`,\n\t\t},\n\t\t\"&[data-disabled]\": {\n\t\t\tcursor: \"not-allowed\",\n\t\t\tcolor: t(\"color-content-disabled\"),\n\t\t},\n\t},\n\t\"@media\": {\n\t\t// Custom colors flatten to system colors here, so the token focus ring is\n\t\t// lost — redraw it with a system color (matches Button/Chip/Radio).\n\t\t\"(forced-colors: active)\": {\n\t\t\tselectors: {\n\t\t\t\t\"&[data-focus-visible]:not([data-disabled])\": {\n\t\t\t\t\toutline: \"2px solid Highlight\",\n\t\t\t\t\toutlineOffset: \"2px\",\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t},\n});\n\nexport const menuItemLeading = style(slotBase);\n\n// A trailing slot pins to the row's end (auto inline-start margin, which mirrors\n// under `dir=\"rtl\"`), so the label between the slots takes the remaining space\n// without needing a wrapper element.\nexport const menuItemTrailing = style({\n\t...slotBase,\n\tmarginInlineStart: \"auto\",\n});\n"],"mappings":""}