@kanso-labs/kanso-ui 0.4.6 → 0.5.0

package/dist/cjs/components/code/index.cjs

@@ -1,51 +0,0 @@
-let _base_ui_react_use_render = require("@base-ui/react/use-render");
-let react_compiler_runtime = require("react/compiler-runtime");
-//#region src/components/code/index.tsx
-/**
-* A fragment of code, a path, or an identifier set in the mono face. It
-* renders a `<code>` and takes its scale from the text around it.
-*/
-function Code(t0) {
-	const $ = (0, react_compiler_runtime.c)(9);
-	let props;
-	let render;
-	if ($[0] !== t0) {
-		({render, ...props} = t0);
-		$[0] = t0;
-		$[1] = props;
-		$[2] = render;
-	} else {
-		props = $[1];
-		render = $[2];
-	}
-	let t1;
-	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
-		t1 = { className: "x139gbkf xbppi91 x1s8wshw xj0a0fe" };
-		$[3] = t1;
-	} else t1 = $[3];
-	let t2;
-	if ($[4] !== props) {
-		t2 = {
-			...props,
-			...t1
-		};
-		$[4] = props;
-		$[5] = t2;
-	} else t2 = $[5];
-	let t3;
-	if ($[6] !== render || $[7] !== t2) {
-		t3 = {
-			defaultTagName: "code",
-			props: t2,
-			render
-		};
-		$[6] = render;
-		$[7] = t2;
-		$[8] = t3;
-	} else t3 = $[8];
-	return (0, _base_ui_react_use_render.useRender)(t3);
-}
-//#endregion
-exports.default = Code;
-
-//# sourceMappingURL=index.cjs.map

package/dist/cjs/components/code/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../../../src/components/code/index.tsx"],"sourcesContent":["import { useRender } from '@base-ui/react/use-render';\nimport * as stylex from '@stylexjs/stylex';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, typography } from '../../tokens/design.tokens.stylex';\n\n// Sized in em rather than px, so a fragment of code takes the scale of\n// whatever it interrupts. A mono face at the same nominal size as the prose\n// around it reads a little larger — its glyphs are wider and its x-height\n// taller — so 0.875em is what makes the two look level rather than what makes\n// them measure the same.\n//\n// No background. The mono face against the serif and sans faces the rest of\n// the system uses is already an unmistakable signal, and a tint here would\n// introduce a second surface inside Card and Sheet, competing with the\n// hierarchy those already establish. A call site wanting one can wrap this.\n\ntype CodeProps = useRender.ComponentProps<'code'>;\n\n/**\n * A fragment of code, a path, or an identifier set in the mono face. It\n * renders a `<code>` and takes its scale from the text around it.\n */\nfunction Code({\n  render,\n  ...props\n}: CodeProps) {\n  // stylex.props() spreads after `props` for the same reason Text and Currency\n  // do it: it wins over a consumer-supplied className rather than merging with\n  // one, so which of the two applies is not left to stylesheet order.\n  return useRender({\n    defaultTagName: 'code',\n    props: {\n      ...props,\n      ...{\n        className: \"x139gbkf xbppi91 x1s8wshw xj0a0fe\"\n      }\n    },\n    render\n  });\n}\nexport type { CodeProps };\nexport default Code;"],"mappings":";;;;;;;AAsBA,SAAA,KAAA,IAAA;CAAA,MAAA,KAAA,GAAA,uBAAA,EAAA,CAAA,CAAA;CAAA,IAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,IAAA;EAAc,CAAA,CAAA,WAAA,SAAA;EAGF,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA;EAAA,QAAA,EAAA;EAAA,SAAA,EAAA;CAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,GAAA;EAQH,KAAA,EAAA,WACU,oCACb;EAAC,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,OAAA;EAJI,KAAA;GAAA,GACF;GAAK,GACL;EAGL;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,UAAA,EAAA,OAAA,IAAA;EAPc,KAAA;GAAA,gBACC;GAAM,OACf;GAKN;EAEH;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,QAAA,GATM,0BAAA,UAAA,CAAU,EAShB;AAAC"}

package/dist/cjs/components/code/index.d.cts

@@ -1,11 +0,0 @@
-import { useRender } from "@base-ui/react/use-render";
-//#region src/components/code/index.d.ts
-type CodeProps = useRender.ComponentProps<'code'>;
-/**
- * A fragment of code, a path, or an identifier set in the mono face. It
- * renders a `<code>` and takes its scale from the text around it.
- */
-declare function Code({ render, ...props }: CodeProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
-//#endregion
-export { type CodeProps, Code as default };
-//# sourceMappingURL=index.d.cts.map

package/dist/cjs/components/copy-field/index.cjs

@@ -1,59 +0,0 @@
-const require_index = require("../button/index.cjs");
-const require_index$1 = require("../code/index.cjs");
-let react_jsx_runtime = require("react/jsx-runtime");
-let react = require("react");
-//#region src/components/copy-field/index.tsx
-const COPIED_RESET_MS = 2e3;
-/**
-* A value to be read and taken away — a repository URL, a token, a command.
-* It shows the value in the mono face and copies it on request, confirming
-* on the button itself.
-*/
-function CopyField({ copiedLabel = "Copied", copyLabel = "Copy", onCopied, value, ...props }) {
-	const [copied, setCopied] = (0, react.useState)(false);
-	const timer = (0, react.useRef)(void 0);
-	(0, react.useEffect)(() => () => {
-		clearTimeout(timer.current);
-	}, []);
-	const handleCopy = (0, react.useCallback)(() => {
-		const write = async () => {
-			try {
-				await navigator.clipboard.writeText(value);
-			} catch {
-				setCopied(false);
-				return;
-			}
-			setCopied(true);
-			onCopied?.(value);
-			clearTimeout(timer.current);
-			timer.current = setTimeout(() => {
-				setCopied(false);
-			}, COPIED_RESET_MS);
-		};
-		write();
-	}, [onCopied, value]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		...props,
-		className: "x6s0dn4 x14s9m32 x1fwvt7v x1xdvaa9 x1y0btm7 xmkeg23 x78zum5 x126z3so xmqoko8 x18fpw6u",
-		children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "x1iyjqo2 x1b35g6e xeuugli",
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index$1.default, { children: value })
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.default, {
-				onClick: handleCopy,
-				size: "xs",
-				variant: "text",
-				children: copied ? copiedLabel : copyLabel
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("output", {
-				className: "xjm9jq1 x1hyvwdk x1i1rx1s xb3r6kr x10l6tqk xuxw1ft",
-				children: copied ? copiedLabel : ""
-			})
-		]
-	});
-}
-//#endregion
-exports.default = CopyField;
-
-//# sourceMappingURL=index.cjs.map

package/dist/cjs/components/copy-field/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../../../src/components/copy-field/index.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport * as stylex from '@stylexjs/stylex';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, radii, spacing, typography } from '../../tokens/design.tokens.stylex';\nimport Button from '../button';\nimport Code from '../code';\n\n// How long the confirmation stands before the control returns to offering the\n// copy again. Not a motion token: those are transition durations, measured in\n// hundreds of milliseconds, and this is a dwell — long enough to be read\n// without being long enough to leave the button lying about what it will do.\nconst COPIED_RESET_MS = 2000;\ntype CopyFieldProps = {\n  /**\n   * What the button says once the value has been copied. It reverts to\n   * `copyLabel` on its own after a couple of seconds.\n   * @default 'Copied'\n   */\n  copiedLabel?: string;\n  /**\n   * What the button says at rest.\n   * @default 'Copy'\n   */\n  copyLabel?: string;\n  /**\n   * Called with the value after it reaches the clipboard, never before.\n   *\n   * Named `onCopied` rather than `onCopy` because the root is a `<div>`, which\n   * already has an `onCopy` of its own — React's handler for the native copy\n   * event, fired when the reader presses the copy shortcut inside the element.\n   * The two are different moments, and a prop that quietly shadowed the\n   * built-in would be a trap rather than a convenience.\n   */\n  onCopied?: (value: string) => void;\n  /** The text shown, and the text copied. */\n  value: string;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'children'>;\n\n/**\n * A value to be read and taken away — a repository URL, a token, a command.\n * It shows the value in the mono face and copies it on request, confirming\n * on the button itself.\n */\nfunction CopyField({\n  copiedLabel = 'Copied',\n  copyLabel = 'Copy',\n  onCopied,\n  value,\n  ...props\n}: CopyFieldProps) {\n  const [copied, setCopied] = useState(false);\n  const timer = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n\n  // Without this, a field unmounted inside the dwell leaves a timer holding a\n  // setState for a tree that is gone.\n  useEffect(() => () => {\n    clearTimeout(timer.current);\n  }, []);\n  const handleCopy = useCallback(() => {\n    const write = async () => {\n      try {\n        await navigator.clipboard.writeText(value);\n      } catch {\n        // A clipboard write is refused outside a secure context and wherever\n        // the permission is denied, and neither is something the call site can\n        // fix. Staying at rest is the honest report: the value is not on the\n        // clipboard, so the control must not claim it is.\n        setCopied(false);\n        return;\n      }\n      setCopied(true);\n      onCopied?.(value);\n      clearTimeout(timer.current);\n      timer.current = setTimeout(() => {\n        setCopied(false);\n      }, COPIED_RESET_MS);\n    };\n    void write();\n  }, [onCopied, value]);\n  return <div {...props} className=\"x6s0dn4 x14s9m32 x1fwvt7v x1xdvaa9 x1y0btm7 xmkeg23 x78zum5 x126z3so xmqoko8 x18fpw6u\">\n      <span className=\"x1iyjqo2 x1b35g6e xeuugli\">\n        <Code>{value}</Code>\n      </span>\n      <Button onClick={handleCopy} size=\"xs\" variant=\"text\">\n        {copied ? copiedLabel : copyLabel}\n      </Button>\n      {/* The button's own label changes, but a label changing under a screen\n          reader is not reliably announced. This is. `<output>` carries an\n          implicit role of status, so it needs no role attribute of its own. */}\n      <output className=\"xjm9jq1 x1hyvwdk x1i1rx1s xb3r6kr x10l6tqk xuxw1ft\">\n        {copied ? copiedLabel : ''}\n      </output>\n    </div>;\n}\nexport type { CopyFieldProps };\nexport default CopyField;"],"mappings":";;;;;AAYA,MAAM,kBAAkB;;;;;;AAgCxB,SAAS,UAAU,EACjB,cAAc,UACd,YAAY,QACZ,UACA,OACA,GAAG,SACc;CACjB,MAAM,CAAC,QAAQ,cAAA,GAAa,MAAA,SAAA,CAAS,KAAK;CAC1C,MAAM,SAAA,GAAQ,MAAA,OAAA,CAAkD,KAAA,CAAS;CAIzE,CAAA,GAAA,MAAA,UAAA,aAAsB;EACpB,aAAa,MAAM,OAAO;CAC5B,GAAG,CAAA,CAAE;CACL,MAAM,cAAA,GAAa,MAAA,YAAA,OAAkB;EACnC,MAAM,QAAQ,YAAY;GACxB,IAAI;IACF,MAAM,UAAU,UAAU,UAAU,KAAK;GAC3C,QAAQ;IAKN,UAAU,KAAK;IACf;GACF;GACA,UAAU,IAAI;GACd,WAAW,KAAK;GAChB,aAAa,MAAM,OAAO;GAC1B,MAAM,UAAU,iBAAiB;IAC/B,UAAU,KAAK;GACjB,GAAG,eAAe;EACpB;EACA,MAAW;CACb,GAAG,CAAC,UAAU,KAAK,CAAC;CACpB,OAAO,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EAAK,GAAI;EAAO,WAAU;EAA1B,UAAA;GACH,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,WAAU;IACd,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,gBAAA,SAAD,EAAA,UAAO,MAAY,CAAA;GACf,CAAA;GACN,iBAAA,GAAA,kBAAA,IAAA,CAAC,cAAA,SAAD;IAAQ,SAAS;IAAY,MAAK;IAAK,SAAQ;IAC5C,UAAA,SAAS,cAAc;GAClB,CAAA;GAIR,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD;IAAQ,WAAU;IACf,UAAA,SAAS,cAAc;GAClB,CAAA;EACL;;AACT"}

package/dist/cjs/components/copy-field/index.d.cts

@@ -1,36 +0,0 @@
-import { HTMLAttributes } from "react";
-//#region src/components/copy-field/index.d.ts
-type CopyFieldProps = {
-  /**
-   * What the button says once the value has been copied. It reverts to
-   * `copyLabel` on its own after a couple of seconds.
-   * @default 'Copied'
-   */
-  copiedLabel?: string;
-  /**
-   * What the button says at rest.
-   * @default 'Copy'
-   */
-  copyLabel?: string;
-  /**
-   * Called with the value after it reaches the clipboard, never before.
-   *
-   * Named `onCopied` rather than `onCopy` because the root is a `<div>`, which
-   * already has an `onCopy` of its own — React's handler for the native copy
-   * event, fired when the reader presses the copy shortcut inside the element.
-   * The two are different moments, and a prop that quietly shadowed the
-   * built-in would be a trap rather than a convenience.
-   */
-  onCopied?: (value: string) => void;
-  /** The text shown, and the text copied. */
-  value: string;
-} & Omit<HTMLAttributes<HTMLDivElement>, 'children'>;
-/**
- * A value to be read and taken away — a repository URL, a token, a command.
- * It shows the value in the mono face and copies it on request, confirming
- * on the button itself.
- */
-declare function CopyField({ copiedLabel, copyLabel, onCopied, value, ...props }: CopyFieldProps): import("react").JSX.Element;
-//#endregion
-export { type CopyFieldProps, CopyField as default };
-//# sourceMappingURL=index.d.cts.map

package/dist/cjs/components/currency/index.cjs

@@ -1,56 +0,0 @@
-const require_stylex = require("../../node_modules/@stylexjs/stylex/lib/es/stylex.cjs");
-let _base_ui_react_use_render = require("@base-ui/react/use-render");
-//#region src/components/currency/index.tsx
-const styles = { base: {
-	kMv6JI: "xbppi91",
-	kcqcaj: "xss6m8b",
-	k63SB2: "x1bf3uqz",
-	$$css: true
-} };
-const tones = {
-	negative: {
-		kMwMTN: "x12gp0t",
-		$$css: true
-	},
-	neutral: {
-		kMwMTN: "x139gbkf",
-		$$css: true
-	},
-	positive: {
-		kMwMTN: "x4no3js",
-		$$css: true
-	}
-};
-const MINUS_SIGN = "−";
-function Currency({ currency = "USD", locale, render, sign = "auto", tone = "auto", value, ...props$1 }) {
-	return (0, _base_ui_react_use_render.useRender)({
-		defaultTagName: "span",
-		props: {
-			...props$1,
-			children: formatCurrency(value, {
-				currency,
-				locale,
-				sign
-			}),
-			...require_stylex.props(styles.base, tones[resolveTone(value, tone)])
-		},
-		render
-	});
-}
-function formatCurrency(value, options) {
-	return new Intl.NumberFormat(options.locale, {
-		currency: options.currency,
-		signDisplay: options.sign,
-		style: "currency"
-	}).formatToParts(value).map((part) => part.type === "minusSign" ? MINUS_SIGN : part.value).join("");
-}
-function resolveTone(value, tone) {
-	if (tone !== "auto") return tone;
-	if (value > 0) return "positive";
-	if (value < 0) return "negative";
-	return "neutral";
-}
-//#endregion
-exports.default = Currency;
-
-//# sourceMappingURL=index.cjs.map

package/dist/cjs/components/currency/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../../../src/components/currency/index.tsx"],"sourcesContent":["import { useRender } from '@base-ui/react/use-render';\nimport * as stylex from '@stylexjs/stylex';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, typography } from '../../tokens/design.tokens.stylex';\n\n// Deliberately sets no font-size. The same value turns up at several sizes —\n// inside a list row, as a heading-scale figure, as a total — differing in\n// nothing else, so the size is the container's decision. What must never vary\n// is here: the mono face, tabular figures so a column of them lines up on the\n// decimal point, and the medium weight that separates a figure from the prose\n// around it.\nconst styles = {\n  base: {\n    kMv6JI: \"xbppi91\",\n    kcqcaj: \"xss6m8b\",\n    k63SB2: \"x1bf3uqz\",\n    $$css: true\n  }\n};\nconst tones = {\n  negative: {\n    kMwMTN: \"x12gp0t\",\n    $$css: true\n  },\n  neutral: {\n    kMwMTN: \"x139gbkf\",\n    $$css: true\n  },\n  positive: {\n    kMwMTN: \"x4no3js\",\n    $$css: true\n  }\n};\n\n// U+2212 MINUS SIGN, not the U+002D hyphen Intl actually emits. The hyphen is\n// a typographic stand-in: it is narrower than the plus it pairs with and does\n// not sit on the same optical centre as the digits, which shows up as a\n// wobbling column the moment amounts are stacked.\nconst MINUS_SIGN = '−';\ntype CurrencyProps = Omit<useRender.ComponentProps<'span'>, 'children'> & {\n  /**\n   * ISO 4217 code for the currency to format in.\n   * @default 'USD'\n   */\n  currency?: string;\n  /**\n   * BCP 47 locale to format for. Defaults to the runtime's own locale, so an\n   * app that has not chosen one still formats the way its reader expects.\n   */\n  locale?: string;\n  /**\n   * When to show the sign. `auto` shows one only on negatives, `always` also\n   * prefixes positives with a plus, and `never` shows neither — which leaves\n   * colour as the only thing separating a credit from a debt, so reach for it\n   * only where the direction is already stated some other way.\n   * @default 'auto'\n   */\n  sign?: SignDisplay;\n  /**\n   * Which colour role to render in. `auto` follows the sign of `value`, with\n   * zero reading as neutral.\n   * @default 'auto'\n   */\n  tone?: Tone;\n  /** The amount, in the currency's major units. */\n  value: number;\n};\ntype SignDisplay = 'always' | 'auto' | 'never';\ntype Tone = 'auto' | 'negative' | 'neutral' | 'positive';\nfunction Currency({\n  currency = 'USD',\n  locale,\n  render,\n  sign = 'auto',\n  tone = 'auto',\n  value,\n  ...props\n}: CurrencyProps) {\n  // stylex.props() spreads after `props` for the same reason Text does it: it\n  // wins over a consumer-supplied className rather than merging with one.\n  return useRender({\n    defaultTagName: 'span',\n    props: {\n      ...props,\n      children: formatCurrency(value, {\n        currency,\n        locale,\n        sign\n      }),\n      ...stylex.props(styles.base, tones[resolveTone(value, tone)])\n    },\n    render\n  });\n}\n\n// formatToParts rather than a replace over the formatted string, so only the\n// sign is substituted. A blind replace would also hit a hyphen inside a\n// locale's currency name or grouping, and locales that wrap negatives in\n// parentheses have no minus to swap at all — both of which this leaves alone.\nfunction formatCurrency(value: number, options: {\n  currency: string;\n  locale: string | undefined;\n  sign: SignDisplay;\n}) {\n  return new Intl.NumberFormat(options.locale, {\n    currency: options.currency,\n    signDisplay: options.sign,\n    style: 'currency'\n  }).formatToParts(value).map(part => part.type === 'minusSign' ? MINUS_SIGN : part.value).join('');\n}\n\n// Zero is neither owed nor owing, so it takes the neutral role rather than\n// being forced into one of the two. Negative zero lands here too, which is\n// what a rounded-away debt should read as.\nfunction resolveTone(value: number, tone: Tone) {\n  if (tone !== 'auto') {\n    return tone;\n  }\n  if (value > 0) {\n    return 'positive';\n  }\n  if (value < 0) {\n    return 'negative';\n  }\n  return 'neutral';\n}\nexport type { CurrencyProps };\nexport default Currency;"],"mappings":";;;AAWA,MAAM,SAAS,EACb,MAAM;CACJ,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,OAAO;AACT,EACF;AACA,MAAM,QAAQ;CACZ,UAAU;EACR,QAAQ;EACR,OAAO;CACT;CACA,SAAS;EACP,QAAQ;EACR,OAAO;CACT;CACA,UAAU;EACR,QAAQ;EACR,OAAO;CACT;AACF;AAMA,MAAM,aAAa;AA+BnB,SAAS,SAAS,EAChB,WAAW,OACX,QACA,QACA,OAAO,QACP,OAAO,QACP,OACA,GAAG,WACa;CAGhB,QAAA,GAAO,0BAAA,UAAA,CAAU;EACf,gBAAgB;EAChB,OAAO;GACL,GAAG;GACH,UAAU,eAAe,OAAO;IAC9B;IACA;IACA;GACF,CAAC;GACD,GAAA,eAAA,MAAgB,OAAO,MAAM,MAAM,YAAY,OAAO,IAAI,EAAE;EAC9D;EACA;CACF,CAAC;AACH;AAMA,SAAS,eAAe,OAAe,SAIpC;CACD,OAAO,IAAI,KAAK,aAAa,QAAQ,QAAQ;EAC3C,UAAU,QAAQ;EAClB,aAAa,QAAQ;EACrB,OAAO;CACT,CAAC,CAAC,CAAC,cAAc,KAAK,CAAC,CAAC,KAAI,SAAQ,KAAK,SAAS,cAAc,aAAa,KAAK,KAAK,CAAC,CAAC,KAAK,EAAE;AAClG;AAKA,SAAS,YAAY,OAAe,MAAY;CAC9C,IAAI,SAAS,QACX,OAAO;CAET,IAAI,QAAQ,GACV,OAAO;CAET,IAAI,QAAQ,GACV,OAAO;CAET,OAAO;AACT"}

package/dist/cjs/components/currency/index.d.cts

@@ -1,36 +0,0 @@
-import { useRender } from "@base-ui/react/use-render";
-//#region src/components/currency/index.d.ts
-type CurrencyProps = Omit<useRender.ComponentProps<'span'>, 'children'> & {
-  /**
-   * ISO 4217 code for the currency to format in.
-   * @default 'USD'
-   */
-  currency?: string;
-  /**
-   * BCP 47 locale to format for. Defaults to the runtime's own locale, so an
-   * app that has not chosen one still formats the way its reader expects.
-   */
-  locale?: string;
-  /**
-   * When to show the sign. `auto` shows one only on negatives, `always` also
-   * prefixes positives with a plus, and `never` shows neither — which leaves
-   * colour as the only thing separating a credit from a debt, so reach for it
-   * only where the direction is already stated some other way.
-   * @default 'auto'
-   */
-  sign?: SignDisplay;
-  /**
-   * Which colour role to render in. `auto` follows the sign of `value`, with
-   * zero reading as neutral.
-   * @default 'auto'
-   */
-  tone?: Tone;
-  /** The amount, in the currency's major units. */
-  value: number;
-};
-type SignDisplay = 'always' | 'auto' | 'never';
-type Tone = 'auto' | 'negative' | 'neutral' | 'positive';
-declare function Currency({ currency, locale, render, sign, tone, value, ...props }: CurrencyProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
-//#endregion
-export { type CurrencyProps, Currency as default };
-//# sourceMappingURL=index.d.cts.map

package/dist/cjs/components/icon-button/index.cjs

@@ -1,80 +0,0 @@
-const require_stylex = require("../../node_modules/@stylexjs/stylex/lib/es/stylex.cjs");
-const require_useRipple = require("../../hooks/useRipple.cjs");
-let react_jsx_runtime = require("react/jsx-runtime");
-let _base_ui_react_button = require("@base-ui/react/button");
-//#region src/components/icon-button/index.tsx
-const styles = {
-	base: {
-		kGNEyG: "x6s0dn4",
-		kaIpWk: "xtecew7 x3y1ksm",
-		kMzoRj: "xc342km",
-		kkrTdU: "x1s07b3s x1ypdohk",
-		k1xSpc: "x3nfvp2",
-		kmuXW: "x2lah0s",
-		kjj79g: "xl56j7k",
-		kjBf7l: "xrgy624",
-		kInvED: "x1hl8ikr",
-		k3XXqK: "x9v5kkp x1t137rt",
-		kMeerF: "x1de99jn",
-		kmVPX3: "x1717udv",
-		kVAEAm: "x1n2onr6",
-		kIyJzY: "x1iuyhda",
-		k1ekBW: "xb5u718",
-		kAMwcw: "x15l9jch",
-		$$css: true
-	},
-	filled: {
-		kWkggS: "xm7dzmu x1n0xrd1 x197hsbc xnety89",
-		kMwMTN: "xhfb3ry xwjo7ld",
-		$$css: true
-	},
-	lg: {
-		kZKoxP: "xnnlda6",
-		kGuDYH: "x1s3cmhv",
-		kzqmXN: "x15yg21f",
-		$$css: true
-	},
-	md: {
-		kZKoxP: "x1vqgdyp",
-		kGuDYH: "x1pvqxga",
-		kzqmXN: "x100vrsf",
-		$$css: true
-	},
-	standard: {
-		kWkggS: "x1a42vn9 x6gcojk xjbqb8w",
-		kMwMTN: "xhfb3ry x1w5n3ug",
-		$$css: true
-	},
-	tonal: {
-		kWkggS: "x1c3n7wt x1n0xrd1 xwypj8i xp89om9",
-		kMwMTN: "xhfb3ry xscdzaa",
-		$$css: true
-	},
-	xs: {
-		kZKoxP: "x10w6t97",
-		kGuDYH: "xwsyq91",
-		kzqmXN: "x1td3qas",
-		$$css: true
-	}
-};
-function IconButton({ children, disabled = false, disableRipple = false, onClick, onContextMenu, onPointerCancel, onPointerDown, onPointerLeave, onPointerUp, size = "md", variant = "standard", ...props$1 }) {
-	const ripple = require_useRipple.useRipple(!disableRipple, {
-		onClick,
-		onContextMenu,
-		onPointerCancel,
-		onPointerDown,
-		onPointerLeave,
-		onPointerUp
-	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_button.Button, {
-		disabled,
-		...ripple.handlers,
-		...props$1,
-		...require_stylex.props(styles.base, styles[variant], styles[size]),
-		children: [children, ripple.surface]
-	});
-}
-//#endregion
-exports.default = IconButton;
-
-//# sourceMappingURL=index.cjs.map

package/dist/cjs/components/icon-button/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../../../src/components/icon-button/index.tsx"],"sourcesContent":["import type { ButtonProps as BaseUIButtonProps } from '@base-ui/react/button';\nimport { Button as BaseUIButton } from '@base-ui/react/button';\nimport * as stylex from '@stylexjs/stylex';\nimport { useRipple } from '../../hooks/useRipple';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, motion, radii, stateLayerOpacity } from '../../tokens/design.tokens.stylex';\n\n// Each variant composites an 'on-color' over its own container at the\n// interaction state's opacity, rather than swapping in a separate hover\n// color. calc(<opacity> * 100%) turns the token's unitless 0-1 ratio into the\n// percentage color-mix() takes. Inlined at each property rather than factored\n// into a helper: @stylexjs/babel-plugin only statically recognizes\n// expressions written directly as property values.\n//\n// :hover and :active still match a disabled native <button>, and stylex's\n// fixed pseudo-class ordering places both after :disabled, so without the\n// :not(:disabled) guard a hovered disabled button would render with the\n// interaction color instead of the disabled one.\n//\n// The corner softens from a circle to a rounded square while pressed, which\n// is the shape morph the source design gives this control. The two\n// transitioned properties take different curves — the colour change is\n// linear-ish and the shape change is emphasized — so the timing functions are\n// a matching comma list rather than one value.\nconst styles = {\n  base: {\n    kGNEyG: \"x6s0dn4\",\n    kaIpWk: \"xtecew7 x3y1ksm\",\n    kMzoRj: \"xc342km\",\n    kkrTdU: \"x1s07b3s x1ypdohk\",\n    k1xSpc: \"x3nfvp2\",\n    kmuXW: \"x2lah0s\",\n    kjj79g: \"xl56j7k\",\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x1hl8ikr\",\n    k3XXqK: \"x9v5kkp x1t137rt\",\n    kMeerF: \"x1de99jn\",\n    kmVPX3: \"x1717udv\",\n    kVAEAm: \"x1n2onr6\",\n    kIyJzY: \"x1iuyhda\",\n    k1ekBW: \"xb5u718\",\n    kAMwcw: \"x15l9jch\",\n    $$css: true\n  },\n  filled: {\n    kWkggS: \"xm7dzmu x1n0xrd1 x197hsbc xnety89\",\n    kMwMTN: \"xhfb3ry xwjo7ld\",\n    $$css: true\n  },\n  lg: {\n    kZKoxP: \"xnnlda6\",\n    kGuDYH: \"x1s3cmhv\",\n    kzqmXN: \"x15yg21f\",\n    $$css: true\n  },\n  md: {\n    kZKoxP: \"x1vqgdyp\",\n    kGuDYH: \"x1pvqxga\",\n    kzqmXN: \"x100vrsf\",\n    $$css: true\n  },\n  standard: {\n    kWkggS: \"x1a42vn9 x6gcojk xjbqb8w\",\n    kMwMTN: \"xhfb3ry x1w5n3ug\",\n    $$css: true\n  },\n  tonal: {\n    kWkggS: \"x1c3n7wt x1n0xrd1 xwypj8i xp89om9\",\n    kMwMTN: \"xhfb3ry xscdzaa\",\n    $$css: true\n  },\n  xs: {\n    kZKoxP: \"x10w6t97\",\n    kGuDYH: \"xwsyq91\",\n    kzqmXN: \"x1td3qas\",\n    $$css: true\n  }\n};\ntype IconButtonProps = BaseUIButtonProps & {\n  /**\n   * What the button does, in words. Required rather than optional: an icon\n   * on its own has no accessible name, so without this the control announces\n   * nothing at all.\n   */\n  'aria-label': string;\n  /**\n   * Disables the press ripple. The hover and pressed state layers are\n   * unaffected.\n   * @default false\n   */\n  disableRipple?: boolean;\n  /**\n   * Control size: `xs` 32px, `md` 40px, `lg` 56px — the same heights `Button`\n   * uses, so the two line up beside each other in a row.\n   * @default 'md'\n   */\n  size?: 'lg' | 'md' | 'xs';\n  /**\n   * `standard` is transparent and tints what it sits on; `filled` and `tonal`\n   * carry a container of their own.\n   * @default 'standard'\n   */\n  variant?: 'filled' | 'standard' | 'tonal';\n};\nfunction IconButton({\n  children,\n  disabled = false,\n  disableRipple = false,\n  onClick,\n  onContextMenu,\n  onPointerCancel,\n  onPointerDown,\n  onPointerLeave,\n  onPointerUp,\n  size = 'md',\n  variant = 'standard',\n  ...props\n}: IconButtonProps) {\n  // `props` (className/style/render, etc.) is spread separately: `className`\n  // and `style` there may be functions of render state, a Base UI extension\n  // ripple's own handler-only merge doesn't need to know about.\n  const ripple = useRipple<HTMLButtonElement>(!disableRipple, {\n    onClick,\n    onContextMenu,\n    onPointerCancel,\n    onPointerDown,\n    onPointerLeave,\n    onPointerUp\n  });\n  return <BaseUIButton disabled={disabled} {...ripple.handlers} {...props} {...stylex.props(styles.base, styles[variant], styles[size])}>\n      {children}\n      {ripple.surface}\n    </BaseUIButton>;\n}\nexport type { IconButtonProps };\nexport default IconButton;"],"mappings":";;;;;AAwBA,MAAM,SAAS;CACb,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,QAAQ;EACN,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,IAAI;EACF,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,IAAI;EACF,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,UAAU;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,IAAI;EACF,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;AACF;AA2BA,SAAS,WAAW,EAClB,UACA,WAAW,OACX,gBAAgB,OAChB,SACA,eACA,iBACA,eACA,gBACA,aACA,OAAO,MACP,UAAU,YACV,GAAG,WACe;CAIlB,MAAM,SAAS,kBAAA,UAA6B,CAAC,eAAe;EAC1D;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CACD,OAAO,iBAAA,GAAA,kBAAA,KAAA,CAAC,sBAAA,QAAD;EAAwB;EAAU,GAAI,OAAO;EAAU,GAAI;EAAO,GAAA,eAAA,MAAiB,OAAO,MAAM,OAAO,UAAU,OAAO,KAAK;EAA7H,UAAA,CACF,UACA,OAAO,OACI;;AAClB"}

package/dist/cjs/components/icon-button/index.d.cts

@@ -1,32 +0,0 @@
-import { ButtonProps } from "@base-ui/react/button";
-//#region src/components/icon-button/index.d.ts
-type IconButtonProps = ButtonProps & {
-  /**
-   * What the button does, in words. Required rather than optional: an icon
-   * on its own has no accessible name, so without this the control announces
-   * nothing at all.
-   */
-  'aria-label': string;
-  /**
-   * Disables the press ripple. The hover and pressed state layers are
-   * unaffected.
-   * @default false
-   */
-  disableRipple?: boolean;
-  /**
-   * Control size: `xs` 32px, `md` 40px, `lg` 56px — the same heights `Button`
-   * uses, so the two line up beside each other in a row.
-   * @default 'md'
-   */
-  size?: 'lg' | 'md' | 'xs';
-  /**
-   * `standard` is transparent and tints what it sits on; `filled` and `tonal`
-   * carry a container of their own.
-   * @default 'standard'
-   */
-  variant?: 'filled' | 'standard' | 'tonal';
-};
-declare function IconButton({ children, disabled, disableRipple, onClick, onContextMenu, onPointerCancel, onPointerDown, onPointerLeave, onPointerUp, size, variant, ...props }: IconButtonProps): import("react").JSX.Element;
-//#endregion
-export { type IconButtonProps, IconButton as default };
-//# sourceMappingURL=index.d.cts.map

package/dist/cjs/components/index.d.cts

@@ -1,18 +0,0 @@
-import Avatar, { AvatarProps } from "./avatar/index.cjs";
-import Badge, { BadgeProps } from "./badge/index.cjs";
-import Button, { ButtonProps } from "./button/index.cjs";
-import Card, { CardProps } from "./card/index.cjs";
-import Chip, { ChipProps } from "./chip/index.cjs";
-import Code, { CodeProps } from "./code/index.cjs";
-import CopyField, { CopyFieldProps } from "./copy-field/index.cjs";
-import Currency, { CurrencyProps } from "./currency/index.cjs";
-import IconButton, { IconButtonProps } from "./icon-button/index.cjs";
-import Keycap, { KeycapProps } from "./keycap/index.cjs";
-import Link, { LinkProps } from "./link/index.cjs";
-import ListItem, { ListItemProps } from "./list-item/index.cjs";
-import Separator, { SeparatorProps } from "./separator/index.cjs";
-import Sheet, { SheetProps } from "./sheet/index.cjs";
-import Tabs, { TabsProps } from "./tabs/index.cjs";
-import Text, { TextProps } from "./text/index.cjs";
-import TextField, { TextFieldProps } from "./text-field/index.cjs";
-export { Avatar, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, Card, type CardProps, Chip, type ChipProps, Code, type CodeProps, CopyField, type CopyFieldProps, Currency, type CurrencyProps, IconButton, type IconButtonProps, Keycap, type KeycapProps, Link, type LinkProps, ListItem, type ListItemProps, Separator, type SeparatorProps, Sheet, type SheetProps, Tabs, type TabsProps, Text, TextField, type TextFieldProps, type TextProps };

package/dist/cjs/components/keycap/index.cjs

@@ -1,52 +0,0 @@
-let _base_ui_react_use_render = require("@base-ui/react/use-render");
-let react_compiler_runtime = require("react/compiler-runtime");
-//#region src/components/keycap/index.tsx
-/**
-* A single key on a keyboard, as named in an instruction — `Enter`, `Esc`,
-* `Ctrl`. It renders a `<kbd>` and takes its scale from the text around it. A
-* chord is several of these, combined at the call site.
-*/
-function Keycap(t0) {
-	const $ = (0, react_compiler_runtime.c)(9);
-	let props;
-	let render;
-	if ($[0] !== t0) {
-		({render, ...props} = t0);
-		$[0] = t0;
-		$[1] = props;
-		$[2] = render;
-	} else {
-		props = $[1];
-		render = $[2];
-	}
-	let t1;
-	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
-		t1 = { className: "xjbqb8w x1fwvt7v x1tfhd1 x1y0btm7 xmkeg23 x139gbkf x1rg5ohu xbppi91 xuegzgz x37zpob xt970qd xdomwbk xuxw1ft" };
-		$[3] = t1;
-	} else t1 = $[3];
-	let t2;
-	if ($[4] !== props) {
-		t2 = {
-			...props,
-			...t1
-		};
-		$[4] = props;
-		$[5] = t2;
-	} else t2 = $[5];
-	let t3;
-	if ($[6] !== render || $[7] !== t2) {
-		t3 = {
-			defaultTagName: "kbd",
-			props: t2,
-			render
-		};
-		$[6] = render;
-		$[7] = t2;
-		$[8] = t3;
-	} else t3 = $[8];
-	return (0, _base_ui_react_use_render.useRender)(t3);
-}
-//#endregion
-exports.default = Keycap;
-
-//# sourceMappingURL=index.cjs.map

package/dist/cjs/components/keycap/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../../../src/components/keycap/index.tsx"],"sourcesContent":["import { useRender } from '@base-ui/react/use-render';\nimport * as stylex from '@stylexjs/stylex';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, radii, spacing, typography } from '../../tokens/design.tokens.stylex';\n\n// Named for the physical thing it draws rather than for the element it\n// renders. `Kbd` would match the tag, but a component library is read by\n// people writing call sites, not markup, and `Key` in that setting is already\n// spoken for several times over — an API key, an object key, React's own key\n// prop. A keycap is unambiguously the one on a keyboard.\n//\n// Sized in em for the same reason Code is: a key named inside a footnote and\n// one named inside a paragraph are the same component. The ratio is smaller\n// than Code's because the border adds height that the glyphs do not, and\n// matching Code's 0.875 leaves a keycap standing taller than the line it\n// sits in.\n//\n// Transparent rather than filled, so a keycap inside a Card or a Sheet does\n// not read as a nested surface. The border alone carries the metaphor.\n\ntype KeycapProps = useRender.ComponentProps<'kbd'>;\n\n/**\n * A single key on a keyboard, as named in an instruction — `Enter`, `Esc`,\n * `Ctrl`. It renders a `<kbd>` and takes its scale from the text around it. A\n * chord is several of these, combined at the call site.\n */\nfunction Keycap({\n  render,\n  ...props\n}: KeycapProps) {\n  // stylex.props() spreads after `props` for the same reason Text and Currency\n  // do it: it wins over a consumer-supplied className rather than merging with\n  // one, so which of the two applies is not left to stylesheet order.\n  return useRender({\n    defaultTagName: 'kbd',\n    props: {\n      ...props,\n      ...{\n        className: \"xjbqb8w x1fwvt7v x1tfhd1 x1y0btm7 xmkeg23 x139gbkf x1rg5ohu xbppi91 xuegzgz x37zpob xt970qd xdomwbk xuxw1ft\"\n      }\n    },\n    render\n  });\n}\nexport type { KeycapProps };\nexport default Keycap;"],"mappings":";;;;;;;;AA2BA,SAAA,OAAA,IAAA;CAAA,MAAA,KAAA,GAAA,uBAAA,EAAA,CAAA,CAAA;CAAA,IAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,IAAA;EAAgB,CAAA,CAAA,WAAA,SAAA;EAGF,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA;EAAA,QAAA,EAAA;EAAA,SAAA,EAAA;CAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,GAAA;EAQL,KAAA,EAAA,WACU,8GACb;EAAC,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,OAAA;EAJI,KAAA;GAAA,GACF;GAAK,GACL;EAGL;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,UAAA,EAAA,OAAA,IAAA;EAPc,KAAA;GAAA,gBACC;GAAK,OACd;GAKN;EAEH;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,QAAA,GATM,0BAAA,UAAA,CAAU,EAShB;AAAC"}

package/dist/cjs/components/keycap/index.d.cts

@@ -1,12 +0,0 @@
-import { useRender } from "@base-ui/react/use-render";
-//#region src/components/keycap/index.d.ts
-type KeycapProps = useRender.ComponentProps<'kbd'>;
-/**
- * A single key on a keyboard, as named in an instruction — `Enter`, `Esc`,
- * `Ctrl`. It renders a `<kbd>` and takes its scale from the text around it. A
- * chord is several of these, combined at the call site.
- */
-declare function Keycap({ render, ...props }: KeycapProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
-//#endregion
-export { type KeycapProps, Keycap as default };
-//# sourceMappingURL=index.d.cts.map

package/dist/cjs/components/link/index.cjs

@@ -1,61 +0,0 @@
-const require_stylex = require("../../node_modules/@stylexjs/stylex/lib/es/stylex.cjs");
-let _base_ui_react_use_render = require("@base-ui/react/use-render");
-//#region src/components/link/index.tsx
-const styles = { base: {
-	kaIpWk: "x1tfhd1",
-	kkrTdU: "x1ypdohk",
-	kjBf7l: "xrgy624",
-	kInvED: "x1hl8ikr",
-	k3XXqK: "x9v5kkp x1t137rt",
-	kMeerF: "x1de99jn",
-	kNySMw: "xyi4chj",
-	kcSHmL: "x1ohr1zr",
-	kIyJzY: "x1qno0dh",
-	k1ekBW: "xz1df8t",
-	kAMwcw: "xpc4ca7",
-	$$css: true
-} };
-const tones = {
-	inherit: {
-		kMwMTN: "x1aetzt3 x1heor9g",
-		k1TLXF: "x1rdisx9 x1dbr5dg",
-		$$css: true
-	},
-	primary: {
-		kMwMTN: "x1mxwv8y",
-		k1TLXF: "x1rdisx9 xfhk6l2",
-		$$css: true
-	}
-};
-const underlines = {
-	always: {
-		kMnn75: "xujl8zx",
-		$$css: true
-	},
-	hover: {
-		kMnn75: "x1sur9pj xkrqix3",
-		$$css: true
-	},
-	none: {
-		kMnn75: "xkrqix3",
-		$$css: true
-	}
-};
-/**
-* A navigational link. It renders an `<a>` and sets no type of its own, so it
-* takes the size and face of the text it sits in.
-*/
-function Link({ render, tone = "primary", underline = "always", ...props$1 }) {
-	return (0, _base_ui_react_use_render.useRender)({
-		defaultTagName: "a",
-		props: {
-			...props$1,
-			...require_stylex.props(styles.base, tones[tone], underlines[underline])
-		},
-		render
-	});
-}
-//#endregion
-exports.default = Link;
-
-//# sourceMappingURL=index.cjs.map

package/dist/cjs/components/link/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../../../src/components/link/index.tsx"],"sourcesContent":["import { useRender } from '@base-ui/react/use-render';\nimport * as stylex from '@stylexjs/stylex';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, motion, radii } from '../../tokens/design.tokens.stylex';\n\n// Deliberately sets no font size or family. A link is nearly always a run of\n// words inside something else — a paragraph, a list, a table cell — so its\n// type is the surrounding text's decision. What is here is only what makes it\n// read as a link: the colour, the rule under it, and the focus ring.\n//\n// The underline is on by default rather than an opt-in. Colour alone fails\n// anyone who cannot separate the two hues, so a link in prose that is not\n// underlined is only distinguishable to some readers.\nconst styles = {\n  base: {\n    kaIpWk: \"x1tfhd1\",\n    kkrTdU: \"x1ypdohk\",\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x1hl8ikr\",\n    k3XXqK: \"x9v5kkp x1t137rt\",\n    kMeerF: \"x1de99jn\",\n    kNySMw: \"xyi4chj\",\n    kcSHmL: \"x1ohr1zr\",\n    kIyJzY: \"x1qno0dh\",\n    k1ekBW: \"xz1df8t\",\n    kAMwcw: \"xpc4ca7\",\n    $$css: true\n  }\n};\n\n// Each tone gets a hover that means something. `primary` is already the accent\n// colour, so hovering it deepens the rule instead of restating the colour;\n// `inherit` sits in body text, so hovering moves it to the accent — which is\n// what tells the reader the words are a link and not emphasis.\nconst tones = {\n  inherit: {\n    kMwMTN: \"x1aetzt3 x1heor9g\",\n    k1TLXF: \"x1rdisx9 x1dbr5dg\",\n    $$css: true\n  },\n  primary: {\n    kMwMTN: \"x1mxwv8y\",\n    k1TLXF: \"x1rdisx9 xfhk6l2\",\n    $$css: true\n  }\n};\nconst underlines = {\n  always: {\n    kMnn75: \"xujl8zx\",\n    $$css: true\n  },\n  hover: {\n    kMnn75: \"x1sur9pj xkrqix3\",\n    $$css: true\n  },\n  none: {\n    kMnn75: \"xkrqix3\",\n    $$css: true\n  }\n};\ntype LinkProps = {\n  /**\n   * Which colour role to render in. `primary` marks the link out from the\n   * text around it; `inherit` takes the surrounding colour and leans on the\n   * underline alone, for a link in a place already understood to be links —\n   * a footer, a breadcrumb, a nav.\n   * @default 'primary'\n   */\n  tone?: LinkTone;\n  /**\n   * When to draw the rule. Leave it at `always` in prose: without it, colour\n   * is the only thing separating the link from the sentence, which some\n   * readers cannot see. `hover` and `none` are for links whose position\n   * already announces them, such as a row of footer links.\n   * @default 'always'\n   */\n  underline?: LinkUnderline;\n} & useRender.ComponentProps<'a'>;\ntype LinkTone = 'inherit' | 'primary';\ntype LinkUnderline = 'always' | 'hover' | 'none';\n\n/**\n * A navigational link. It renders an `<a>` and sets no type of its own, so it\n * takes the size and face of the text it sits in.\n */\nfunction Link({\n  render,\n  tone = 'primary',\n  underline = 'always',\n  ...props\n}: LinkProps) {\n  // stylex.props() spreads after `props` for the same reason Text and Currency\n  // do it: it wins over a consumer-supplied className rather than merging with\n  // one, so which of the two applies is not left to stylesheet order.\n  return useRender({\n    defaultTagName: 'a',\n    props: {\n      ...props,\n      ...stylex.props(styles.base, tones[tone], underlines[underline])\n    },\n    render\n  });\n}\nexport type { LinkProps };\nexport default Link;"],"mappings":";;;AAaA,MAAM,SAAS,EACb,MAAM;CACJ,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,OAAO;AACT,EACF;AAMA,MAAM,QAAQ;CACZ,SAAS;EACP,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,SAAS;EACP,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;AACF;AACA,MAAM,aAAa;CACjB,QAAQ;EACN,QAAQ;EACR,OAAO;CACT;CACA,OAAO;EACL,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,OAAO;CACT;AACF;;;;;AA0BA,SAAS,KAAK,EACZ,QACA,OAAO,WACP,YAAY,UACZ,GAAG,WACS;CAIZ,QAAA,GAAO,0BAAA,UAAA,CAAU;EACf,gBAAgB;EAChB,OAAO;GACL,GAAG;GACH,GAAA,eAAA,MAAgB,OAAO,MAAM,MAAM,OAAO,WAAW,UAAU;EACjE;EACA;CACF,CAAC;AACH"}

package/dist/cjs/components/link/index.d.cts

@@ -1,30 +0,0 @@
-import { useRender } from "@base-ui/react/use-render";
-//#region src/components/link/index.d.ts
-type LinkProps = {
-  /**
-   * Which colour role to render in. `primary` marks the link out from the
-   * text around it; `inherit` takes the surrounding colour and leans on the
-   * underline alone, for a link in a place already understood to be links —
-   * a footer, a breadcrumb, a nav.
-   * @default 'primary'
-   */
-  tone?: LinkTone;
-  /**
-   * When to draw the rule. Leave it at `always` in prose: without it, colour
-   * is the only thing separating the link from the sentence, which some
-   * readers cannot see. `hover` and `none` are for links whose position
-   * already announces them, such as a row of footer links.
-   * @default 'always'
-   */
-  underline?: LinkUnderline;
-} & useRender.ComponentProps<'a'>;
-type LinkTone = 'inherit' | 'primary';
-type LinkUnderline = 'always' | 'hover' | 'none';
-/**
- * A navigational link. It renders an `<a>` and sets no type of its own, so it
- * takes the size and face of the text it sits in.
- */
-declare function Link({ render, tone, underline, ...props }: LinkProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
-//#endregion
-export { type LinkProps, Link as default };
-//# sourceMappingURL=index.d.cts.map