@kanso-labs/kanso-ui 0.35.0 → 0.37.0

package/dist/components/number-field/index.js

@@ -1,7 +1,7 @@
 "use client";
 import { props } from "../../node_modules/@stylexjs/stylex/lib/es/stylex.js";
-import { mergeStatefulStyles } from "../../styles/merge.js";
 import { spacing, typography } from "../../tokens/design.tokens.stylex.js";
+import { mergeStatefulStyles } from "../../styles/merge.js";
 import { MinusGlyph, PlusGlyph } from "../../glyphs/index.js";
 import { fieldStyles, invalidFrom, useFieldValidationBehavior } from "../../field/root.js";
 import { FieldBox, FieldInput, FieldMessage } from "../../field/index.js";
@@ -79,58 +79,56 @@ const styles = {
 * are the field chrome in `src/field`, shared with every other field.
 */
 function NumberField$1(t0) {
-	const $ = c(36);
-	const { decrementLabel: t1, description, error, floatingLabel: t2, incrementLabel: t3, inputRef, isDisabled: t4, label, numeric: t5, steppers: t6, variant: t7, ...props$1 } = t0;
-	const decrementLabel = t1 === void 0 ? "Decrease" : t1;
-	const floatingLabel = t2 === void 0 ? true : t2;
-	const incrementLabel = t3 === void 0 ? "Increase" : t3;
-	const isDisabled = t4 === void 0 ? false : t4;
-	const numeric = t5 === void 0 ? true : t5;
-	const steppers = t6 === void 0 ? "vertical" : t6;
-	const variant = t7 === void 0 ? "filled" : t7;
+	const $ = c(37);
+	const { decrementLabel, description, error, floatingLabel: t1, incrementLabel, inputRef, isDisabled: t2, label, numeric: t3, steppers: t4, variant: t5, ...props$1 } = t0;
+	const floatingLabel = t1 === void 0 ? true : t1;
+	const isDisabled = t2 === void 0 ? false : t2;
+	const numeric = t3 === void 0 ? true : t3;
+	const steppers = t4 === void 0 ? "vertical" : t4;
+	const variant = t5 === void 0 ? "filled" : t5;
 	const inline = steppers === "horizontal";
 	const validationBehavior = useFieldValidationBehavior();
 	const T0 = NumberField;
-	let t8;
+	let t6;
 	if ($[0] !== error) {
-		t8 = invalidFrom(error);
+		t6 = invalidFrom(error);
 		$[0] = error;
-		$[1] = t8;
-	} else t8 = $[1];
-	const t9 = mergeStatefulStyles(props(fieldStyles.root), props$1);
-	let t10;
+		$[1] = t6;
+	} else t6 = $[1];
+	const t7 = mergeStatefulStyles(props(fieldStyles.root), props$1);
+	let t8;
 	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
-		t10 = {
+		t8 = {
 			0: { className: "x1cy8zhl x9f619 x78zum5 x126z3so" },
 			1: { className: "x9f619 x78zum5 x126z3so x6s0dn4" }
 		};
-		$[2] = t10;
-	} else t10 = $[2];
-	const t11 = t10[!!inline << 0];
-	let t12;
+		$[2] = t8;
+	} else t8 = $[2];
+	const t9 = t8[!!inline << 0];
+	let t10;
 	if ($[3] !== inputRef || $[4] !== numeric) {
-		t12 = /* @__PURE__ */ jsx(FieldInput, {
+		t10 = /* @__PURE__ */ jsx(FieldInput, {
 			numeric,
 			ref: inputRef
 		});
 		$[3] = inputRef;
 		$[4] = numeric;
-		$[5] = t12;
-	} else t12 = $[5];
-	let t13;
+		$[5] = t10;
+	} else t10 = $[5];
+	let t11;
 	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
-		t13 = {
+		t11 = {
 			0: { className: "x78zum5 xdt5ytf x2lah0s x1motrhk xk4mfur" },
 			2: { className: "x78zum5 x2lah0s x1q0g3np x126z3so xdj266r x1tn5xpv" },
 			1: { className: "x78zum5 xdt5ytf x2lah0s xk4mfur x17v9ssf" },
 			3: { className: "x78zum5 x2lah0s x1q0g3np x126z3so x1tn5xpv x17v9ssf" }
 		};
-		$[6] = t13;
-	} else t13 = $[6];
-	const t14 = t13[!!inline << 1 | !!(!inline && variant === "outlined") << 0];
-	let t15;
+		$[6] = t11;
+	} else t11 = $[6];
+	const t12 = t11[!!inline << 1 | !!(!inline && variant === "outlined") << 0];
+	let t13;
 	if ($[7] !== decrementLabel || $[8] !== incrementLabel || $[9] !== inline || $[10] !== variant) {
-		t15 = inline ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(IconButton, {
+		t13 = inline ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(IconButton, {
 			"aria-label": decrementLabel,
 			size: "xs",
 			slot: "decrement",
@@ -155,74 +153,76 @@ function NumberField$1(t0) {
 		$[8] = incrementLabel;
 		$[9] = inline;
 		$[10] = variant;
-		$[11] = t15;
-	} else t15 = $[11];
-	let t16;
-	if ($[12] !== t14 || $[13] !== t15) {
-		t16 = /* @__PURE__ */ jsx("div", {
-			...t14,
-			children: t15
+		$[11] = t13;
+	} else t13 = $[11];
+	let t14;
+	if ($[12] !== t12 || $[13] !== t13) {
+		t14 = /* @__PURE__ */ jsx("div", {
+			...t12,
+			children: t13
 		});
-		$[12] = t14;
-		$[13] = t15;
-		$[14] = t16;
-	} else t16 = $[14];
-	let t17;
-	if ($[15] !== t11 || $[16] !== t12 || $[17] !== t16) {
-		t17 = /* @__PURE__ */ jsxs("div", {
-			...t11,
-			children: [t12, t16]
+		$[12] = t12;
+		$[13] = t13;
+		$[14] = t14;
+	} else t14 = $[14];
+	let t15;
+	if ($[15] !== t10 || $[16] !== t14 || $[17] !== t9) {
+		t15 = /* @__PURE__ */ jsxs("div", {
+			...t9,
+			children: [t10, t14]
 		});
-		$[15] = t11;
-		$[16] = t12;
-		$[17] = t16;
-		$[18] = t17;
-	} else t17 = $[18];
-	let t18;
-	if ($[19] !== floatingLabel || $[20] !== label || $[21] !== t17 || $[22] !== variant) {
-		t18 = /* @__PURE__ */ jsx(FieldBox, {
+		$[15] = t10;
+		$[16] = t14;
+		$[17] = t9;
+		$[18] = t15;
+	} else t15 = $[18];
+	let t16;
+	if ($[19] !== floatingLabel || $[20] !== label || $[21] !== props$1.isRequired || $[22] !== t15 || $[23] !== variant) {
+		t16 = /* @__PURE__ */ jsx(FieldBox, {
 			floatingLabel,
+			isRequired: props$1.isRequired,
 			label,
 			variant,
-			children: t17
+			children: t15
 		});
 		$[19] = floatingLabel;
 		$[20] = label;
-		$[21] = t17;
-		$[22] = variant;
-		$[23] = t18;
-	} else t18 = $[23];
-	let t19;
-	if ($[24] !== description || $[25] !== error) {
-		t19 = /* @__PURE__ */ jsx(FieldMessage, {
+		$[21] = props$1.isRequired;
+		$[22] = t15;
+		$[23] = variant;
+		$[24] = t16;
+	} else t16 = $[24];
+	let t17;
+	if ($[25] !== description || $[26] !== error) {
+		t17 = /* @__PURE__ */ jsx(FieldMessage, {
 			description,
 			error
 		});
-		$[24] = description;
-		$[25] = error;
-		$[26] = t19;
-	} else t19 = $[26];
-	let t20;
-	if ($[27] !== T0 || $[28] !== isDisabled || $[29] !== props$1 || $[30] !== t18 || $[31] !== t19 || $[32] !== t8 || $[33] !== t9 || $[34] !== validationBehavior) {
-		t20 = /* @__PURE__ */ jsxs(T0, {
+		$[25] = description;
+		$[26] = error;
+		$[27] = t17;
+	} else t17 = $[27];
+	let t18;
+	if ($[28] !== T0 || $[29] !== isDisabled || $[30] !== props$1 || $[31] !== t16 || $[32] !== t17 || $[33] !== t6 || $[34] !== t7 || $[35] !== validationBehavior) {
+		t18 = /* @__PURE__ */ jsxs(T0, {
 			isDisabled,
-			isInvalid: t8,
+			isInvalid: t6,
 			validationBehavior,
 			...props$1,
-			...t9,
-			children: [t18, t19]
+			...t7,
+			children: [t16, t17]
 		});
-		$[27] = T0;
-		$[28] = isDisabled;
-		$[29] = props$1;
-		$[30] = t18;
-		$[31] = t19;
-		$[32] = t8;
-		$[33] = t9;
-		$[34] = validationBehavior;
-		$[35] = t20;
-	} else t20 = $[35];
-	return t20;
+		$[28] = T0;
+		$[29] = isDisabled;
+		$[30] = props$1;
+		$[31] = t16;
+		$[32] = t17;
+		$[33] = t6;
+		$[34] = t7;
+		$[35] = validationBehavior;
+		$[36] = t18;
+	} else t18 = $[36];
+	return t18;
 }
 function StackedStepper(t0) {
 	const $ = c(8);

package/dist/components/number-field/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","ReactNode","Ref","RefAttributes","ButtonRenderProps","NumberFieldProps","RACNumberFieldProps","stylex","Button","RACButton","NumberField","RACNumberField","FieldVariant","FieldBox","FieldInput","FieldMessage","fieldStyles","invalidFrom","useFieldValidationBehavior","MinusGlyph","PlusGlyph","mergeStatefulStyles","colors","motion","radii","spacing","stateLayerOpacity","typography","IconButton","BOX_HALF","sm","bodySmallLineHeight","bodyLargeLineHeight","BOX_OUTLINED_HALF","lg","styles","stepper","k6CgDc","kGNEyG","kWkggS","kZKoxP","kaIpWk","kMzoRj","kB7OPa","kMwMTN","kkrTdU","k1xSpc","kzqmXN","kjj79g","kjBf7l","kInvED","k3XXqK","kMeerF","kmVPX3","kIyJzY","k1ekBW","kAMwcw","$$css","stepperBottomOutlined","kT0f0o","stepperDisabled","stepperFocused","stepperHovered","stepperOutlined","stepperPressed","stepperTop","kfmiAY","decrementLabel","description","error","floatingLabel","incrementLabel","inputRef","HTMLInputElement","label","numeric","steppers","variant","Omit","t0","$","t1","t2","t3","isDisabled","t4","t5","t6","t7","props","undefined","inline","validationBehavior","T0","t8","t9","root","t10","Symbol","for","0","className","1","t11","t12","t13","2","3","t14","t15","t16","t17","t18","t19","t20","StackedStepper","children","outlined","slot","stepperStyles","top","state","isHovered","isPressed","isFocusVisible","NumberField","_c","props","RACNumberField","stylex.props","RACButton"],"sources":["../../../src/components/number-field/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode, Ref, RefAttributes } from 'react';\nimport type { ButtonRenderProps, NumberFieldProps as RACNumberFieldProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { Button as RACButton, NumberField as RACNumberField } from 'react-aria-components';\nimport type { FieldVariant } from '../../field';\nimport { FieldBox, FieldInput, FieldMessage } from '../../field';\nimport { fieldStyles, invalidFrom, useFieldValidationBehavior } from '../../field/root';\nimport { MinusGlyph, PlusGlyph } from '../../glyphs';\nimport { mergeStatefulStyles } from '../../styles/merge';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, motion, radii, spacing, stateLayerOpacity, typography } from '../../tokens/design.tokens.stylex';\nimport IconButton from '../icon-button';\n\n// The text fields page's field, holding a number: the same box, floating\n// label, underline and message as TextField, with the value in the mono\n// face and tabular figures by default, since a number is what those are\n// for, and two steppers at the trailing end.\n//\n// The steppers come in two layouts. Stacked, the plus over the minus, they\n// are a column flush with the box's top, end and bottom, each half of the\n// box's 56dp and 32dp wide, drawn here since the smallest icon button is\n// 32dp and two of those do not fit; the glyph is the icon buttons page's\n// 20dp for that size, and the hover, pressed, focus and disabled treatments\n// are the standard icon button's. Side by side, they are extra-small icon\n// buttons, the page's trailing icons in the library's own control, 12dp\n// from the end where the page puts a field's icons — the box's 16dp of\n// padding less the 4dp they pull back.\n//\n// **The stacked pair is the one control here that does not reach the 48dp\n// target**, and it is the layout rather than an oversight. Every other small\n// control in the library draws that target out of flow, over whatever sits\n// beside it — src/control/styles.ts carries the decision. These two have only\n// each other beside them: the column is 56dp tall in total, so two 48dp\n// targets inside it would overlap across most of their height, and the half\n// of a press that landed in the overlap would go to whichever box was\n// uppermost rather than to the glyph under the finger. Incrementing when a\n// reader meant to decrement is worse than a target that is short, so the\n// stacked layout keeps its 32 by 28 and the reader who needs the larger one\n// has `steppers=\"horizontal\"`, where each is an extra-small icon button and\n// gets the target from there — with the gap that keeps those two targets off\n// each other, which is the room the column has none of.\n//\n// React Aria's `NumberField` is the root and the box is its `Group`, which\n// is what names the box and the two steppers as one control; the steppers\n// are its increment and decrement buttons through context, disabled at the\n// ends of the range and kept out of the tab order, and the formatting is its\n// `formatOptions`.\n// Half the box, spelled from the same tokens the box derives its height\n// from rather than as the 28 that half of 56 comes to. A theme with a longer\n// body line makes the box taller — `Editorial` in src/theming/themes.ts does\n// — and a stated half leaves the pair short of the bottom edge they are\n// flush with.\n//\n// Written here rather than imported from src/field/styles.ts, which spells\n// the same two expressions: the StyleX compiler resolves a constant across\n// files only out of a `.stylex.ts` module, the same reason that file gives\n// for re-declaring the forced-colours query. The two have to move together.\nconst BOX_HALF = `calc((2 * ${spacing.sm} + ${typography.bodySmallLineHeight} + ${typography.bodyLargeLineHeight}) / 2)`;\nconst BOX_OUTLINED_HALF = `calc((2 * ${spacing.lg} + ${typography.bodyLargeLineHeight}) / 2)`;\nconst styles = {\n  stepper: {\n    k6CgDc: \"x12w9bfk\",\n    kGNEyG: \"x6s0dn4\",\n    kWkggS: \"xjbqb8w\",\n    kZKoxP: \"x1viytl0\",\n    kaIpWk: \"x2u8bby\",\n    kMzoRj: \"xc342km\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1w5n3ug\",\n    kkrTdU: \"x1ypdohk\",\n    k1xSpc: \"x78zum5\",\n    kzqmXN: \"x1td3qas\",\n    kjj79g: \"xl56j7k\",\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x2ssjo2\",\n    k3XXqK: \"x1t137rt\",\n    kMeerF: \"x1de99jn\",\n    kmVPX3: \"x1717udv\",\n    kIyJzY: \"x1qno0dh\",\n    k1ekBW: \"xs2xxs2\",\n    kAMwcw: \"xpc4ca7\",\n    $$css: true\n  },\n  stepperBottomOutlined: {\n    kT0f0o: \"x4gcak0\",\n    $$css: true\n  },\n  stepperDisabled: {\n    kMwMTN: \"x1xj74d8\",\n    kkrTdU: \"x1h6gzvc\",\n    $$css: true\n  },\n  stepperFocused: {\n    k3XXqK: \"xaatb59\",\n    $$css: true\n  },\n  stepperHovered: {\n    kWkggS: \"x14noynh\",\n    $$css: true\n  },\n  stepperOutlined: {\n    kZKoxP: \"x1o675yb\",\n    $$css: true\n  },\n  stepperPressed: {\n    kWkggS: \"x123fei2\",\n    $$css: true\n  },\n  stepperTop: {\n    kfmiAY: \"xirz1nw\",\n    $$css: true\n  }\n};\ntype NumberFieldProps = {\n  /**\n   * The name of the stepper that lowers the value, for a screen reader.\n   * @default 'Decrease'\n   */\n  decrementLabel?: string;\n  /**\n   * A hint shown under the field. Replaced by `error` when there is one, so\n   * the two never stack.\n   */\n  description?: string;\n  /**\n   * The problem with the current value, in words. Its presence is what puts\n   * the field in its error state — the message, the red underline, and\n   * `aria-invalid` all follow from it.\n   *\n   * Outside a `Form` the message line arrives with the message, so the\n   * field grows when this does and moves what is under it. A `Form` holds\n   * that space from the start; so does a permanent `description`.\n   */\n  error?: string;\n  /**\n   * Whether the label sits in the empty box and floats to the top once the\n   * field is focused or holds a value, as the text fields page draws it.\n   * `false` keeps it small at the top in every state.\n   * @default true\n   */\n  floatingLabel?: boolean;\n  /**\n   * The name of the stepper that raises the value, for a screen reader.\n   * @default 'Increase'\n   */\n  incrementLabel?: string;\n  /**\n   * A ref to the field's own `<input>`, which is the element a call site moves\n   * focus to — after a server's error, say. `ref` is the field as a whole.\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  /**\n   * What the field is for. Required rather than optional: a field with no\n   * label is a box a screen reader cannot name.\n   */\n  label: string;\n  /**\n   * Renders the value in the mono face with tabular figures, for amounts and\n   * other numbers meant to be compared down a column. On by default, since a\n   * number field holds nothing else.\n   * @default true\n   */\n  numeric?: boolean;\n  /**\n   * How the two steppers sit at the end of the box: stacked, the plus over\n   * the minus, flush with the box's edge, or side by side as extra-small\n   * icon buttons.\n   * @default 'vertical'\n   */\n  steppers?: 'horizontal' | 'vertical';\n  /**\n   * The filled box, or the outlined one: no fill, an outline that thickens\n   * and takes the primary role while focused, and the label cutting it once\n   * it floats — the text fields page's two fields.\n   * @default 'filled'\n   */\n  variant?: FieldVariant;\n} & Omit<RACNumberFieldProps, 'children' | 'isInvalid' | 'validationBehavior'>;\n\n/**\n * A labelled number input with steppers. Its value is React Aria's: pass\n * `value` with `onChange` to control it, or `defaultValue` to let it keep\n * its own — and `onChange` is handed the number, `NaN` while the field is\n * empty. `minValue`, `maxValue` and `step` shape it, and `formatOptions`\n * says how it reads, in the locale the page is in: a currency, a percentage,\n * a unit. Arrow keys step the value, and Page Up and Page Down by ten steps.\n *\n * The call site's `className` and `style` land on the field as a whole,\n * which is the element a layout positions. The box, label, input and message\n * are the field chrome in `src/field`, shared with every other field.\n */\nfunction NumberField({\n  decrementLabel = 'Decrease',\n  description,\n  error,\n  floatingLabel = true,\n  incrementLabel = 'Increase',\n  inputRef,\n  isDisabled = false,\n  label,\n  numeric = true,\n  steppers = 'vertical',\n  variant = 'filled',\n  ...props\n}: NumberFieldProps & RefAttributes<HTMLDivElement>) {\n  const inline = steppers === 'horizontal';\n  const validationBehavior = useFieldValidationBehavior();\n  return <RACNumberField isDisabled={isDisabled} isInvalid={invalidFrom(error)} validationBehavior={validationBehavior} {...props} {...mergeStatefulStyles(stylex.props(fieldStyles.root), props)}>\n      <FieldBox floatingLabel={floatingLabel} label={label} variant={variant}>\n        <div {...{\n        0: {\n          className: \"x1cy8zhl x9f619 x78zum5 x126z3so\"\n        },\n        1: {\n          className: \"x9f619 x78zum5 x126z3so x6s0dn4\"\n        }\n      }[!!inline << 0]}>\n          <FieldInput numeric={numeric} ref={inputRef} />\n          <div {...{\n          0: {\n            className: \"x78zum5 xdt5ytf x2lah0s x1motrhk xk4mfur\"\n          },\n          2: {\n            className: \"x78zum5 x2lah0s x1q0g3np x126z3so xdj266r x1tn5xpv\"\n          },\n          1: {\n            className: \"x78zum5 xdt5ytf x2lah0s xk4mfur x17v9ssf\"\n          },\n          3: {\n            className: \"x78zum5 x2lah0s x1q0g3np x126z3so x1tn5xpv x17v9ssf\"\n          }\n        }[!!inline << 1 | !!(!inline && variant === 'outlined') << 0]}>\n            {inline ? <>\n                <IconButton aria-label={decrementLabel} size=\"xs\" slot=\"decrement\">\n                  <MinusGlyph className=\"xlzyvqe x1lliihq x15vhz18\" />\n                </IconButton>\n                <IconButton aria-label={incrementLabel} size=\"xs\" slot=\"increment\">\n                  <PlusGlyph className=\"xlzyvqe x1lliihq x15vhz18\" />\n                </IconButton>\n              </> : <>\n                <StackedStepper label={incrementLabel} outlined={variant === 'outlined'} slot=\"increment\">\n                  <PlusGlyph className=\"x1qx5ct2 x1lliihq xw4jnvo\" />\n                </StackedStepper>\n                <StackedStepper label={decrementLabel} outlined={variant === 'outlined'} slot=\"decrement\">\n                  <MinusGlyph className=\"x1qx5ct2 x1lliihq xw4jnvo\" />\n                </StackedStepper>\n              </>}\n          </div>\n        </div>\n      </FieldBox>\n      <FieldMessage description={description} error={error} />\n    </RACNumberField>;\n}\nfunction StackedStepper({\n  children,\n  label,\n  outlined,\n  slot\n}: {\n  children: ReactNode;\n  label: string;\n  outlined: boolean;\n  slot: 'decrement' | 'increment';\n}) {\n  return <RACButton aria-label={label} slot={slot} {...mergeStatefulStyles(stepperStyles(slot === 'increment', outlined), {})}>\n      {children}\n    </RACButton>;\n}\n\n// A stacked stepper: React Aria's button with the slot the field's context\n// looks for, drawn from its render state. Built by a call rather than\n// written inline at the prop, which is what react-perf's\n// no-new-function-as-prop is after.\nfunction stepperStyles(top: boolean, outlined: boolean) {\n  return (state: ButtonRenderProps) => stylex.props(styles.stepper, outlined && styles.stepperOutlined, top && styles.stepperTop, !top && outlined && styles.stepperBottomOutlined, state.isHovered && !state.isDisabled && styles.stepperHovered, state.isPressed && !state.isDisabled && styles.stepperPressed, state.isFocusVisible && styles.stepperFocused, state.isDisabled && styles.stepperDisabled);\n}\nexport type { NumberFieldProps };\nexport default NumberField;"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["c","_c","ReactNode","Ref","RefAttributes","ButtonRenderProps","NumberFieldProps","RACNumberFieldProps","stylex","Button","RACButton","NumberField","RACNumberField","FieldVariant","FieldBox","FieldInput","FieldMessage","fieldStyles","invalidFrom","useFieldValidationBehavior","MinusGlyph","PlusGlyph","mergeStatefulStyles","colors","motion","radii","spacing","stateLayerOpacity","typography","IconButton","BOX_HALF","sm","bodySmallLineHeight","bodyLargeLineHeight","BOX_OUTLINED_HALF","lg","styles","stepper","k6CgDc","kGNEyG","kWkggS","kZKoxP","kaIpWk","kMzoRj","kB7OPa","kMwMTN","kkrTdU","k1xSpc","kzqmXN","kjj79g","kjBf7l","kInvED","k3XXqK","kMeerF","kmVPX3","kIyJzY","k1ekBW","kAMwcw","$$css","stepperBottomOutlined","kT0f0o","stepperDisabled","stepperFocused","stepperHovered","stepperOutlined","stepperPressed","stepperTop","kfmiAY","decrementLabel","description","error","floatingLabel","incrementLabel","inputRef","HTMLInputElement","label","numeric","steppers","variant","Omit","t0","$","t1","isDisabled","t2","t3","t4","t5","props","undefined","inline","validationBehavior","T0","t6","t7","root","t8","Symbol","for","0","className","1","t9","t10","t11","2","3","t12","t13","t14","t15","t16","isRequired","t17","t18","StackedStepper","children","outlined","slot","stepperStyles","top","state","isHovered","isPressed","isFocusVisible","NumberField","_c","props","RACNumberField","stylex.props","RACButton"],"sources":["../../../src/components/number-field/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode, Ref, RefAttributes } from 'react';\nimport type { ButtonRenderProps, NumberFieldProps as RACNumberFieldProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { Button as RACButton, NumberField as RACNumberField } from 'react-aria-components';\nimport type { FieldVariant } from '../../field';\nimport { FieldBox, FieldInput, FieldMessage } from '../../field';\nimport { fieldStyles, invalidFrom, useFieldValidationBehavior } from '../../field/root';\nimport { MinusGlyph, PlusGlyph } from '../../glyphs';\nimport { mergeStatefulStyles } from '../../styles/merge';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, motion, radii, spacing, stateLayerOpacity, typography } from '../../tokens/design.tokens.stylex';\nimport IconButton from '../icon-button';\n\n// The text fields page's field, holding a number: the same box, floating\n// label, underline and message as TextField, with the value in the mono\n// face and tabular figures by default, since a number is what those are\n// for, and two steppers at the trailing end.\n//\n// The steppers come in two layouts. Stacked, the plus over the minus, they\n// are a column flush with the box's top, end and bottom, each half of the\n// box's 56dp and 32dp wide, drawn here since the smallest icon button is\n// 32dp and two of those do not fit; the glyph is the icon buttons page's\n// 20dp for that size, and the hover, pressed, focus and disabled treatments\n// are the standard icon button's. Side by side, they are extra-small icon\n// buttons, the page's trailing icons in the library's own control, 12dp\n// from the end where the page puts a field's icons — the box's 16dp of\n// padding less the 4dp they pull back.\n//\n// **The stacked pair is the one control here that does not reach the 48dp\n// target**, and it is the layout rather than an oversight. Every other small\n// control in the library draws that target out of flow, over whatever sits\n// beside it — src/control/styles.ts carries the decision. These two have only\n// each other beside them: the column is 56dp tall in total, so two 48dp\n// targets inside it would overlap across most of their height, and the half\n// of a press that landed in the overlap would go to whichever box was\n// uppermost rather than to the glyph under the finger. Incrementing when a\n// reader meant to decrement is worse than a target that is short, so the\n// stacked layout keeps its 32 by 28 and the reader who needs the larger one\n// has `steppers=\"horizontal\"`, where each is an extra-small icon button and\n// gets the target from there — with the gap that keeps those two targets off\n// each other, which is the room the column has none of.\n//\n// React Aria's `NumberField` is the root and the box is its `Group`, which\n// is what names the box and the two steppers as one control; the steppers\n// are its increment and decrement buttons through context, disabled at the\n// ends of the range and kept out of the tab order, and the formatting is its\n// `formatOptions`.\n// Half the box, spelled from the same tokens the box derives its height\n// from rather than as the 28 that half of 56 comes to. A theme with a longer\n// body line makes the box taller — `Editorial` in src/theming/themes.ts does\n// — and a stated half leaves the pair short of the bottom edge they are\n// flush with.\n//\n// Written here rather than imported from src/field/styles.ts, which spells\n// the same two expressions: the StyleX compiler resolves a constant across\n// files only out of a `.stylex.ts` module, the same reason that file gives\n// for re-declaring the forced-colours query. The two have to move together.\nconst BOX_HALF = `calc((2 * ${spacing.sm} + ${typography.bodySmallLineHeight} + ${typography.bodyLargeLineHeight}) / 2)`;\nconst BOX_OUTLINED_HALF = `calc((2 * ${spacing.lg} + ${typography.bodyLargeLineHeight}) / 2)`;\nconst styles = {\n  stepper: {\n    k6CgDc: \"x12w9bfk\",\n    kGNEyG: \"x6s0dn4\",\n    kWkggS: \"xjbqb8w\",\n    kZKoxP: \"x1viytl0\",\n    kaIpWk: \"x2u8bby\",\n    kMzoRj: \"xc342km\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1w5n3ug\",\n    kkrTdU: \"x1ypdohk\",\n    k1xSpc: \"x78zum5\",\n    kzqmXN: \"x1td3qas\",\n    kjj79g: \"xl56j7k\",\n    kjBf7l: \"xrgy624\",\n    kInvED: \"x2ssjo2\",\n    k3XXqK: \"x1t137rt\",\n    kMeerF: \"x1de99jn\",\n    kmVPX3: \"x1717udv\",\n    kIyJzY: \"x1qno0dh\",\n    k1ekBW: \"xs2xxs2\",\n    kAMwcw: \"xpc4ca7\",\n    $$css: true\n  },\n  stepperBottomOutlined: {\n    kT0f0o: \"x4gcak0\",\n    $$css: true\n  },\n  stepperDisabled: {\n    kMwMTN: \"x1xj74d8\",\n    kkrTdU: \"x1h6gzvc\",\n    $$css: true\n  },\n  stepperFocused: {\n    k3XXqK: \"xaatb59\",\n    $$css: true\n  },\n  stepperHovered: {\n    kWkggS: \"x14noynh\",\n    $$css: true\n  },\n  stepperOutlined: {\n    kZKoxP: \"x1o675yb\",\n    $$css: true\n  },\n  stepperPressed: {\n    kWkggS: \"x123fei2\",\n    $$css: true\n  },\n  stepperTop: {\n    kfmiAY: \"xirz1nw\",\n    $$css: true\n  }\n};\ntype NumberFieldProps = {\n  /**\n   * The name of the stepper that lowers the value, for a screen reader. Left\n   * out, React Aria names it in the reader's locale, followed by the field's\n   * own label — \"Decrease Quantity\" in English.\n   */\n  decrementLabel?: string;\n  /**\n   * A hint shown under the field. Replaced by `error` when there is one, so\n   * the two never stack.\n   */\n  description?: string;\n  /**\n   * The problem with the current value, in words. Its presence is what puts\n   * the field in its error state — the message, the red underline, and\n   * `aria-invalid` all follow from it.\n   *\n   * Outside a `Form` the message line arrives with the message, so the\n   * field grows when this does and moves what is under it. A `Form` holds\n   * that space from the start; so does a permanent `description`.\n   */\n  error?: string;\n  /**\n   * Whether the label sits in the empty box and floats to the top once the\n   * field is focused or holds a value, as the text fields page draws it.\n   * `false` keeps it small at the top in every state.\n   * @default true\n   */\n  floatingLabel?: boolean;\n  /**\n   * The name of the stepper that raises the value, for a screen reader. Left\n   * out, React Aria names it in the reader's locale, followed by the field's\n   * own label — \"Increase Quantity\" in English.\n   */\n  incrementLabel?: string;\n  /**\n   * A ref to the field's own `<input>`, which is the element a call site moves\n   * focus to — after a server's error, say. `ref` is the field as a whole.\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  /**\n   * What the field is for. Required rather than optional: a field with no\n   * label is a box a screen reader cannot name.\n   */\n  label: string;\n  /**\n   * Renders the value in the mono face with tabular figures, for amounts and\n   * other numbers meant to be compared down a column. On by default, since a\n   * number field holds nothing else.\n   * @default true\n   */\n  numeric?: boolean;\n  /**\n   * How the two steppers sit at the end of the box: stacked, the plus over\n   * the minus, flush with the box's edge, or side by side as extra-small\n   * icon buttons.\n   * @default 'vertical'\n   */\n  steppers?: 'horizontal' | 'vertical';\n  /**\n   * The filled box, or the outlined one: no fill, an outline that thickens\n   * and takes the primary role while focused, and the label cutting it once\n   * it floats — the text fields page's two fields.\n   * @default 'filled'\n   */\n  variant?: FieldVariant;\n} & Omit<RACNumberFieldProps, 'children' | 'isInvalid' | 'validationBehavior'>;\n\n/**\n * A labelled number input with steppers. Its value is React Aria's: pass\n * `value` with `onChange` to control it, or `defaultValue` to let it keep\n * its own — and `onChange` is handed the number, `NaN` while the field is\n * empty. `minValue`, `maxValue` and `step` shape it, and `formatOptions`\n * says how it reads, in the locale the page is in: a currency, a percentage,\n * a unit. Arrow keys step the value, and Page Up and Page Down by ten steps.\n *\n * The call site's `className` and `style` land on the field as a whole,\n * which is the element a layout positions. The box, label, input and message\n * are the field chrome in `src/field`, shared with every other field.\n */\nfunction NumberField({\n  decrementLabel,\n  description,\n  error,\n  floatingLabel = true,\n  incrementLabel,\n  inputRef,\n  isDisabled = false,\n  label,\n  numeric = true,\n  steppers = 'vertical',\n  variant = 'filled',\n  ...props\n}: NumberFieldProps & RefAttributes<HTMLDivElement>) {\n  const inline = steppers === 'horizontal';\n  const validationBehavior = useFieldValidationBehavior();\n  return <RACNumberField isDisabled={isDisabled} isInvalid={invalidFrom(error)} validationBehavior={validationBehavior} {...props} {...mergeStatefulStyles(stylex.props(fieldStyles.root), props)}>\n      <FieldBox floatingLabel={floatingLabel} isRequired={props.isRequired} label={label} variant={variant}>\n        <div {...{\n        0: {\n          className: \"x1cy8zhl x9f619 x78zum5 x126z3so\"\n        },\n        1: {\n          className: \"x9f619 x78zum5 x126z3so x6s0dn4\"\n        }\n      }[!!inline << 0]}>\n          <FieldInput numeric={numeric} ref={inputRef} />\n          <div {...{\n          0: {\n            className: \"x78zum5 xdt5ytf x2lah0s x1motrhk xk4mfur\"\n          },\n          2: {\n            className: \"x78zum5 x2lah0s x1q0g3np x126z3so xdj266r x1tn5xpv\"\n          },\n          1: {\n            className: \"x78zum5 xdt5ytf x2lah0s xk4mfur x17v9ssf\"\n          },\n          3: {\n            className: \"x78zum5 x2lah0s x1q0g3np x126z3so x1tn5xpv x17v9ssf\"\n          }\n        }[!!inline << 1 | !!(!inline && variant === 'outlined') << 0]}>\n            {inline ? <>\n                <IconButton aria-label={decrementLabel} size=\"xs\" slot=\"decrement\">\n                  <MinusGlyph className=\"xlzyvqe x1lliihq x15vhz18\" />\n                </IconButton>\n                <IconButton aria-label={incrementLabel} size=\"xs\" slot=\"increment\">\n                  <PlusGlyph className=\"xlzyvqe x1lliihq x15vhz18\" />\n                </IconButton>\n              </> : <>\n                <StackedStepper label={incrementLabel} outlined={variant === 'outlined'} slot=\"increment\">\n                  <PlusGlyph className=\"x1qx5ct2 x1lliihq xw4jnvo\" />\n                </StackedStepper>\n                <StackedStepper label={decrementLabel} outlined={variant === 'outlined'} slot=\"decrement\">\n                  <MinusGlyph className=\"x1qx5ct2 x1lliihq xw4jnvo\" />\n                </StackedStepper>\n              </>}\n          </div>\n        </div>\n      </FieldBox>\n      <FieldMessage description={description} error={error} />\n    </RACNumberField>;\n}\nfunction StackedStepper({\n  children,\n  label,\n  outlined,\n  slot\n}: {\n  children: ReactNode;\n  label: string | undefined;\n  outlined: boolean;\n  slot: 'decrement' | 'increment';\n}) {\n  return <RACButton aria-label={label} slot={slot} {...mergeStatefulStyles(stepperStyles(slot === 'increment', outlined), {})}>\n      {children}\n    </RACButton>;\n}\n\n// A stacked stepper: React Aria's button with the slot the field's context\n// looks for, drawn from its render state. Built by a call rather than\n// written inline at the prop, which is what react-perf's\n// no-new-function-as-prop is after.\nfunction stepperStyles(top: boolean, outlined: boolean) {\n  return (state: ButtonRenderProps) => stylex.props(styles.stepper, outlined && styles.stepperOutlined, top && styles.stepperTop, !top && outlined && styles.stepperBottomOutlined, state.isHovered && !state.isDisabled && styles.stepperHovered, state.isPressed && !state.isDisabled && styles.stepperPressed, state.isFocusVisible && styles.stepperFocused, state.isDisabled && styles.stepperDisabled);\n}\nexport type { NumberFieldProps };\nexport default NumberField;"],"mappings":"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"}

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

@@ -123,5 +123,5 @@ type PopoverContentProps = Omit<DialogProps, 'children' | 'className' | 'style'>
 type PopoverDescriptionProps = TextProps;
 type PopoverTitleProps = HeadingProps;
 //#endregion
-export { type PopoverAlign, type PopoverContentProps, type PopoverDescriptionProps, type PopoverProps, type PopoverSide, type PopoverSize, type PopoverTitleProps, type PopoverTrigger, Popover$1 as default };
+export { type PopoverAlign, PopoverContent, type PopoverContentProps, PopoverDescription, type PopoverDescriptionProps, type PopoverProps, type PopoverSide, type PopoverSize, PopoverTitle, type PopoverTitleProps, type PopoverTrigger, Popover$1 as default };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/popover/index.js

@@ -391,6 +391,6 @@ Popover$1.Content = PopoverContent;
 Popover$1.Description = PopoverDescription;
 Popover$1.Title = PopoverTitle;
 //#endregion
-export { Popover$1 as default };
+export { PopoverContent, PopoverDescription, PopoverTitle, Popover$1 as default };
 
 //# sourceMappingURL=index.js.map

package/dist/components/popover/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","ReactNode","RefAttributes","RefObject","ClassNameOrFunction","DialogProps","DialogTriggerProps","HeadingProps","PopoverRenderProps","StyleOrFunction","TextProps","stylex","createContext","useCallback","useContext","useEffect","useId","useMemo","useState","Dialog","DialogTrigger","Heading","PreviewTrigger","Popover","RACPopover","Text","OverlayAlign","OverlaySide","focus","mergeStatefulStyles","mergeStyles","overlay","placementOf","popupOrigin","colors","spacing","typography","DEFAULT_SIDE_OFFSET","styles","content","kGO01o","kLKAdn","kg3NbH","$$css","description","kB7OPa","kMwMTN","kMv6JI","kGuDYH","k63SB2","kb6lSQ","kLWn49","kogj98","md","ks0D6T","sm","title","DEFAULT_HOVER_DELAY","DEFAULT_HOVER_CLOSE_DELAY","PopoverAlign","PopoverSide","PopoverSize","PopoverContext","modal","size","DescriptionContext","id","register","PopoverProps","Omit","children","closeDelay","delay","trigger","PopoverTrigger","t0","$","props","t1","t2","t3","t4","t5","undefined","t6","context","t7","t8","PopoverContent","alignOffset","className","container","ref","style","triggerRef","align","side","sideOffset","descriptionId","described","setDescribed","Symbol","for","state","popup","placement","t9","t10","t11","popupDialog","ring","t12","t13","t14","PopoverDescription","PopoverTitle","Content","Description","Title","PopoverContentProps","Element","PopoverDescriptionProps","PopoverTitleProps","Popover","_c","props","stylex.props","RACPopover"],"sources":["../../../src/components/popover/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode, RefAttributes, RefObject } from 'react';\nimport type { ClassNameOrFunction, DialogProps, DialogTriggerProps, HeadingProps, PopoverRenderProps, StyleOrFunction, TextProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { createContext, useCallback, useContext, useEffect, useId, useMemo, useState } from 'react';\nimport { Dialog, DialogTrigger, Heading, PreviewTrigger, Popover as RACPopover, Text } from 'react-aria-components';\nimport type { OverlayAlign, OverlaySide } from '../../styles/overlay';\nimport { focus } from '../../styles/focus';\nimport { mergeStatefulStyles, mergeStyles } from '../../styles/merge';\nimport { overlay, placementOf, popupOrigin } from '../../styles/overlay';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, spacing, typography } from '../../tokens/design.tokens.stylex';\n\n// The gap between the anchor and the panel, matching `spacing.sm`'s default.\n// A number rather than the token, because React Aria computes the position in\n// JavaScript and so cannot read a CSS custom property — this is the one place\n// in the component where a step of the spacing scale is spelled out. React\n// Aria's own default is 8 as well, but the value is this component's decision\n// rather than an inherited one.\nconst DEFAULT_SIDE_OFFSET = 8;\n\n// The surface, its entry and the dialog's focus ring are the overlay module's,\n// shared with every anchored overlay; what is here is Popover's own — its\n// inset, its two widths, and the type of its title and description.\n//\n// Popover has no page of its own, so the inset and the type follow the rich\n// tooltip, the nearest thing the Material Design pages draw: a plain rounded\n// panel offset from its anchor, with no caret drawn between the two, holding\n// a subhead over supporting text.\n//\n// React Aria's popover is two elements — the positioned panel and the dialog\n// inside it — so the styles are split the same way: the surface, `content`\n// and a size on the panel, the dialog style on the element that carries the\n// role.\nconst styles = {\n  content: {\n    kGO01o: \"xqf7pud\",\n    kLKAdn: \"x6gmt8y\",\n    kg3NbH: \"x790zyz\",\n    $$css: true\n  },\n  description: {\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1w5n3ug\",\n    kMv6JI: \"xpo2rfv\",\n    kGuDYH: \"x193rfdd\",\n    k63SB2: \"x1hews6w\",\n    kb6lSQ: \"xn43zvd\",\n    kLWn49: \"xv61bfh\",\n    kogj98: \"x1ghz6dp\",\n    $$css: true\n  },\n  md: {\n    ks0D6T: \"x10u2fgw\",\n    $$css: true\n  },\n  sm: {\n    ks0D6T: \"xjjheoa\",\n    $$css: true\n  },\n  title: {\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1w5n3ug\",\n    kMv6JI: \"xrgwony\",\n    kGuDYH: \"x12s497w\",\n    k63SB2: \"x1szcwkt\",\n    kb6lSQ: \"xo803ec\",\n    kLWn49: \"xyl1r0q\",\n    kogj98: \"x1ghz6dp\",\n    $$css: true\n  }\n};\n\n// How long a pointer rests on the trigger before a hovered popover opens,\n// and how long it has to leave before it closes. React Aria's own defaults,\n// spelled out because they are the whole feel of a hover trigger and worth\n// finding in the component rather than in a changelog.\nconst DEFAULT_HOVER_DELAY = 600;\nconst DEFAULT_HOVER_CLOSE_DELAY = 200;\n\n// The overlay module's, since which side a surface opens on is the same\n// question for every anchored overlay. Aliased rather than re-declared so\n// the names a call site imports stay this component's.\ntype PopoverAlign = OverlayAlign;\ntype PopoverSide = OverlaySide;\ntype PopoverSize = 'md' | 'sm';\n\n// `size` and `modal` are declared on the root, where a reader expects to set\n// the shape of the whole popover, but it is `Popover.Content` that has to\n// apply them. Through context rather than making the call site repeat them —\n// the same arrangement Sheet uses, and worth keeping identical between the\n// two panels a consumer is most likely to reach for in the same afternoon.\nconst PopoverContext = createContext<{\n  modal: boolean;\n  size: PopoverSize;\n}>({\n  modal: false,\n  size: 'md'\n});\n\n// React Aria points a dialog's `aria-describedby` at its description slot\n// only for an alert dialog, on the grounds that an ordinary dialog's content\n// is read anyway. A popover's description names what the panel is for, so it\n// is pointed at here: the content hands the description an id, and the\n// description reports that it is mounted, since an `aria-describedby` with\n// nothing at the other end is an invalid reference rather than a harmless one.\nconst DescriptionContext = createContext<{\n  id: string;\n  register: () => () => void;\n}>({\n  id: '',\n  register: () => () => {}\n});\ntype PopoverProps = Omit<DialogTriggerProps, 'children'> & {\n  children?: ReactNode;\n  /**\n   * How long the pointer has to leave a hovered popover before it closes, in\n   * milliseconds. Ignored by a pressed one.\n   * @default 200\n   */\n  closeDelay?: number;\n  /**\n   * How long the pointer has to rest on the trigger before a hovered popover\n   * opens, in milliseconds. Ignored by a pressed one.\n   * @default 600\n   */\n  delay?: number;\n  /**\n   * Blocks the page behind the panel while it is open, as a dialog would.\n   * Off by default: a popover leaves the page interactive, which is the\n   * difference from `Sheet`.\n   * @default false\n   */\n  modal?: boolean;\n  /**\n   * Panel width: `sm` caps at 240px, `md` at 320px. Either way the panel is\n   * only as wide as its contents, and never wider than the viewport.\n   * @default 'md'\n   */\n  size?: PopoverSize;\n  /**\n   * What opens the panel: a press, or a pointer resting on the trigger.\n   * `hover` is the tooltips page's rich tooltip — it opens on hover, focus\n   * or a long press, and stays open while the pointer is inside it, so the\n   * panel's own buttons and links can be reached.\n   * @default 'press'\n   */\n  trigger?: PopoverTrigger;\n};\ntype PopoverTrigger = 'hover' | 'press';\n\n// React Aria names a placement by the side and, along it, the end the panel\n// is aligned to — `bottom start`, or `left top` on the sides where the axis\n// runs the other way.\n/**\n * A panel anchored to the control that opened it. Open state is React Aria's:\n * pass `isOpen` with `onOpenChange` to control it, or `defaultOpen` to let it\n * keep its own.\n *\n * Non-modal by design — the page behind stays scrollable and clickable, which\n * is the difference from `Sheet`. Pass `modal` to change that.\n *\n * Composed rather than configured by props, because a popover's contents are\n * arbitrary — the parts are `Popover.Content`, `Popover.Title`, and\n * `Popover.Description`. A `Button` or `IconButton` placed directly inside\n * `Popover` opens it, and one given `slot=\"close\"` inside the content closes\n * it; neither needs a part of its own.\n */\nfunction Popover({\n  children,\n  closeDelay = DEFAULT_HOVER_CLOSE_DELAY,\n  delay = DEFAULT_HOVER_DELAY,\n  modal = false,\n  size = 'md',\n  trigger = 'press',\n  ...props\n}: PopoverProps) {\n  const context = useMemo(() => ({\n    modal,\n    size\n  }), [modal, size]);\n\n  // A hovered popover is React Aria's preview trigger, which is a different\n  // element around the same parts rather than a mode of the pressed one: it\n  // opens from hover, focus or a long press, and it is always non-modal,\n  // since a panel that blocked the page while the pointer merely rested on\n  // something would be a trap. `modal` is left alone rather than refused,\n  // and `Popover.Content` reads it as it always did — the two are simply\n  // never combined by anything the page draws.\n  if (trigger === 'hover') {\n    return <PopoverContext value={context}>\n        <PreviewTrigger closeDelay={closeDelay} delay={delay} {...props}>\n          {children}\n        </PreviewTrigger>\n      </PopoverContext>;\n  }\n  return <PopoverContext value={context}>\n      <DialogTrigger {...props}>{children}</DialogTrigger>\n    </PopoverContext>;\n}\n\n/**\n * The panel itself. Everything the popover shows goes in here; the trigger\n * stays outside it, since the trigger lives in the page while this is\n * portalled out to the end of the body.\n *\n * Placement is React Aria's anchor positioning, so the panel flips to the\n * opposite side and shifts along the edge of the viewport on its own rather\n * than being clipped by it.\n */\nfunction PopoverContent({\n  align = 'center',\n  alignOffset,\n  children,\n  className,\n  container,\n  ref,\n  side = 'bottom',\n  sideOffset = DEFAULT_SIDE_OFFSET,\n  style,\n  triggerRef,\n  ...props\n}: PopoverContentProps & RefAttributes<HTMLElement>) {\n  const {\n    modal,\n    size\n  } = useContext(PopoverContext);\n  const descriptionId = useId();\n  const [described, setDescribed] = useState(false);\n  const register = useCallback(() => {\n    setDescribed(true);\n    return () => {\n      setDescribed(false);\n    };\n  }, []);\n  const description = useMemo(() => ({\n    id: descriptionId,\n    register\n  }), [descriptionId, register]);\n  return <RACPopover crossOffset={alignOffset} isNonModal={!modal} offset={sideOffset} placement={placementOf(side, align)}\n  // The surface, where the call site's class and style land, rather than\n  // the dialog inside it, which takes the rest of the props.\n  ref={ref} triggerRef={triggerRef}\n  // oxlint-disable-next-line typescript/no-deprecated -- its replacement, UNSAFE_PortalProvider, is not exported by react-aria-components\n  UNSTABLE_portalContainer={container} {...mergeStatefulStyles((state: PopoverRenderProps) => stylex.props(overlay.popup, styles.content, styles[size], popupOrigin(state.placement)), {\n    className,\n    style\n  })}>\n      <Dialog aria-describedby={described ? descriptionId : undefined} {...props} {...stylex.props(overlay.popupDialog, focus.ring)}>\n        <DescriptionContext value={description}>{children}</DescriptionContext>\n      </Dialog>\n    </RACPopover>;\n}\n\n/**\n * Supporting copy under the title. The panel's `aria-describedby` points at\n * it — see DescriptionContext for why that is this component's doing.\n */\nfunction PopoverDescription(props: PopoverDescriptionProps) {\n  const {\n    id,\n    register\n  } = useContext(DescriptionContext);\n  useEffect(() => register(), [register]);\n  return <Text id={id} slot=\"description\" {...props} {...mergeStyles({\n    className: \"x9f619 x1w5n3ug xpo2rfv x193rfdd x1hews6w xn43zvd xv61bfh x1ghz6dp\"\n  }, props)} />;\n}\n\n/**\n * Names the popover. Rendered through React Aria's title slot, which is what\n * points the panel's `aria-labelledby` at it — a popover without one announces\n * itself unnamed.\n */\nfunction PopoverTitle(props: PopoverTitleProps) {\n  return <Heading slot=\"title\" {...props} {...mergeStyles({\n    className: \"x9f619 x1w5n3ug xrgwony x12s497w x1szcwkt xo803ec xyl1r0q x1ghz6dp\"\n  }, props)} />;\n}\nPopover.Content = PopoverContent;\nPopover.Description = PopoverDescription;\nPopover.Title = PopoverTitle;\n\n// The dialog's own props, plus the four that place the panel and its\n// styling. Those belong to the positioned panel rather than to the dialog,\n// but a call site has no reason to know there are two elements — `className`\n// and `style` reach the panel, which is the one worth restyling, and\n// everything else lands on the dialog.\ntype PopoverContentProps = Omit<DialogProps, 'children' | 'className' | 'style'> & {\n  /**\n   * Where the panel sits along the side it opens on.\n   * @default 'center'\n   */\n  align?: PopoverAlign;\n  /** Moves the panel along that side, in pixels. */\n  alignOffset?: number;\n  children?: ReactNode;\n  /** A function may compute the class from the panel's render state. */\n  className?: ClassNameOrFunction<PopoverRenderProps>;\n  /**\n   * Where to portal the panel. Defaults to the end of `<body>`, which is\n   * right for an app that sets its StyleX theme on `:root`. An app that\n   * scopes the theme to a subtree has to point this at an element inside it,\n   * or the popover renders outside the theme and falls back to the tokens'\n   * `prefers-color-scheme` default.\n   */\n  container?: Element;\n  /**\n   * Which side of the trigger the panel opens on. It flips to the opposite\n   * side when there is no room.\n   * @default 'bottom'\n   */\n  side?: PopoverSide;\n  /**\n   * The gap between the trigger and the panel, in pixels.\n   * @default 8\n   */\n  sideOffset?: number;\n  /** A function may compute the style from the panel's render state. */\n  style?: StyleOrFunction<PopoverRenderProps>;\n  /**\n   * An element to anchor the panel to other than the trigger that opened it.\n   */\n  triggerRef?: RefObject<Element | null>;\n};\ntype PopoverDescriptionProps = TextProps;\ntype PopoverTitleProps = HeadingProps;\nexport type { PopoverAlign, PopoverContentProps, PopoverDescriptionProps, PopoverProps, PopoverSide, PopoverSize, PopoverTitleProps, PopoverTrigger };\nexport default Popover;"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["c","_c","ReactNode","RefAttributes","RefObject","ClassNameOrFunction","DialogProps","DialogTriggerProps","HeadingProps","PopoverRenderProps","StyleOrFunction","TextProps","stylex","createContext","useCallback","useContext","useEffect","useId","useMemo","useState","Dialog","DialogTrigger","Heading","PreviewTrigger","Popover","RACPopover","Text","OverlayAlign","OverlaySide","focus","mergeStatefulStyles","mergeStyles","overlay","placementOf","popupOrigin","colors","spacing","typography","DEFAULT_SIDE_OFFSET","styles","content","kGO01o","kLKAdn","kg3NbH","$$css","description","kB7OPa","kMwMTN","kMv6JI","kGuDYH","k63SB2","kb6lSQ","kLWn49","kogj98","md","ks0D6T","sm","title","DEFAULT_HOVER_DELAY","DEFAULT_HOVER_CLOSE_DELAY","PopoverAlign","PopoverSide","PopoverSize","PopoverContext","modal","size","DescriptionContext","id","register","PopoverProps","Omit","children","closeDelay","delay","trigger","PopoverTrigger","t0","$","props","t1","t2","t3","t4","t5","undefined","t6","context","t7","t8","PopoverContent","alignOffset","className","container","ref","style","triggerRef","align","side","sideOffset","descriptionId","described","setDescribed","Symbol","for","state","popup","placement","t9","t10","t11","popupDialog","ring","t12","t13","t14","PopoverDescription","PopoverTitle","Content","Description","Title","PopoverContentProps","Element","PopoverDescriptionProps","PopoverTitleProps","Popover","_c","props","stylex.props","RACPopover"],"sources":["../../../src/components/popover/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode, RefAttributes, RefObject } from 'react';\nimport type { ClassNameOrFunction, DialogProps, DialogTriggerProps, HeadingProps, PopoverRenderProps, StyleOrFunction, TextProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { createContext, useCallback, useContext, useEffect, useId, useMemo, useState } from 'react';\nimport { Dialog, DialogTrigger, Heading, PreviewTrigger, Popover as RACPopover, Text } from 'react-aria-components';\nimport type { OverlayAlign, OverlaySide } from '../../styles/overlay';\nimport { focus } from '../../styles/focus';\nimport { mergeStatefulStyles, mergeStyles } from '../../styles/merge';\nimport { overlay, placementOf, popupOrigin } from '../../styles/overlay';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, spacing, typography } from '../../tokens/design.tokens.stylex';\n\n// The gap between the anchor and the panel, matching `spacing.sm`'s default.\n// A number rather than the token, because React Aria computes the position in\n// JavaScript and so cannot read a CSS custom property — this is the one place\n// in the component where a step of the spacing scale is spelled out. React\n// Aria's own default is 8 as well, but the value is this component's decision\n// rather than an inherited one.\nconst DEFAULT_SIDE_OFFSET = 8;\n\n// The surface, its entry and the dialog's focus ring are the overlay module's,\n// shared with every anchored overlay; what is here is Popover's own — its\n// inset, its two widths, and the type of its title and description.\n//\n// Popover has no page of its own, so the inset and the type follow the rich\n// tooltip, the nearest thing the Material Design pages draw: a plain rounded\n// panel offset from its anchor, with no caret drawn between the two, holding\n// a subhead over supporting text.\n//\n// React Aria's popover is two elements — the positioned panel and the dialog\n// inside it — so the styles are split the same way: the surface, `content`\n// and a size on the panel, the dialog style on the element that carries the\n// role.\nconst styles = {\n  content: {\n    kGO01o: \"xqf7pud\",\n    kLKAdn: \"x6gmt8y\",\n    kg3NbH: \"x790zyz\",\n    $$css: true\n  },\n  description: {\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1w5n3ug\",\n    kMv6JI: \"xpo2rfv\",\n    kGuDYH: \"x193rfdd\",\n    k63SB2: \"x1hews6w\",\n    kb6lSQ: \"xn43zvd\",\n    kLWn49: \"xv61bfh\",\n    kogj98: \"x1ghz6dp\",\n    $$css: true\n  },\n  md: {\n    ks0D6T: \"x10u2fgw\",\n    $$css: true\n  },\n  sm: {\n    ks0D6T: \"xjjheoa\",\n    $$css: true\n  },\n  title: {\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1w5n3ug\",\n    kMv6JI: \"xrgwony\",\n    kGuDYH: \"x12s497w\",\n    k63SB2: \"x1szcwkt\",\n    kb6lSQ: \"xo803ec\",\n    kLWn49: \"xyl1r0q\",\n    kogj98: \"x1ghz6dp\",\n    $$css: true\n  }\n};\n\n// How long a pointer rests on the trigger before a hovered popover opens,\n// and how long it has to leave before it closes. React Aria's own defaults,\n// spelled out because they are the whole feel of a hover trigger and worth\n// finding in the component rather than in a changelog.\nconst DEFAULT_HOVER_DELAY = 600;\nconst DEFAULT_HOVER_CLOSE_DELAY = 200;\n\n// The overlay module's, since which side a surface opens on is the same\n// question for every anchored overlay. Aliased rather than re-declared so\n// the names a call site imports stay this component's.\ntype PopoverAlign = OverlayAlign;\ntype PopoverSide = OverlaySide;\ntype PopoverSize = 'md' | 'sm';\n\n// `size` and `modal` are declared on the root, where a reader expects to set\n// the shape of the whole popover, but it is `Popover.Content` that has to\n// apply them. Through context rather than making the call site repeat them —\n// the same arrangement Sheet uses, and worth keeping identical between the\n// two panels a consumer is most likely to reach for in the same afternoon.\nconst PopoverContext = createContext<{\n  modal: boolean;\n  size: PopoverSize;\n}>({\n  modal: false,\n  size: 'md'\n});\n\n// React Aria points a dialog's `aria-describedby` at its description slot\n// only for an alert dialog, on the grounds that an ordinary dialog's content\n// is read anyway. A popover's description names what the panel is for, so it\n// is pointed at here: the content hands the description an id, and the\n// description reports that it is mounted, since an `aria-describedby` with\n// nothing at the other end is an invalid reference rather than a harmless one.\nconst DescriptionContext = createContext<{\n  id: string;\n  register: () => () => void;\n}>({\n  id: '',\n  register: () => () => {}\n});\ntype PopoverProps = Omit<DialogTriggerProps, 'children'> & {\n  children?: ReactNode;\n  /**\n   * How long the pointer has to leave a hovered popover before it closes, in\n   * milliseconds. Ignored by a pressed one.\n   * @default 200\n   */\n  closeDelay?: number;\n  /**\n   * How long the pointer has to rest on the trigger before a hovered popover\n   * opens, in milliseconds. Ignored by a pressed one.\n   * @default 600\n   */\n  delay?: number;\n  /**\n   * Blocks the page behind the panel while it is open, as a dialog would.\n   * Off by default: a popover leaves the page interactive, which is the\n   * difference from `Sheet`.\n   * @default false\n   */\n  modal?: boolean;\n  /**\n   * Panel width: `sm` caps at 240px, `md` at 320px. Either way the panel is\n   * only as wide as its contents, and never wider than the viewport.\n   * @default 'md'\n   */\n  size?: PopoverSize;\n  /**\n   * What opens the panel: a press, or a pointer resting on the trigger.\n   * `hover` is the tooltips page's rich tooltip — it opens on hover, focus\n   * or a long press, and stays open while the pointer is inside it, so the\n   * panel's own buttons and links can be reached.\n   * @default 'press'\n   */\n  trigger?: PopoverTrigger;\n};\ntype PopoverTrigger = 'hover' | 'press';\n\n// React Aria names a placement by the side and, along it, the end the panel\n// is aligned to — `bottom start`, or `left top` on the sides where the axis\n// runs the other way.\n/**\n * A panel anchored to the control that opened it. Open state is React Aria's:\n * pass `isOpen` with `onOpenChange` to control it, or `defaultOpen` to let it\n * keep its own.\n *\n * Non-modal by design — the page behind stays scrollable and clickable, which\n * is the difference from `Sheet`. Pass `modal` to change that.\n *\n * Composed rather than configured by props, because a popover's contents are\n * arbitrary — the parts are `Popover.Content`, `Popover.Title`, and\n * `Popover.Description`. A `Button` or `IconButton` placed directly inside\n * `Popover` opens it, and one given `slot=\"close\"` inside the content closes\n * it; neither needs a part of its own.\n */\nfunction Popover({\n  children,\n  closeDelay = DEFAULT_HOVER_CLOSE_DELAY,\n  delay = DEFAULT_HOVER_DELAY,\n  modal = false,\n  size = 'md',\n  trigger = 'press',\n  ...props\n}: PopoverProps) {\n  const context = useMemo(() => ({\n    modal,\n    size\n  }), [modal, size]);\n\n  // A hovered popover is React Aria's preview trigger, which is a different\n  // element around the same parts rather than a mode of the pressed one: it\n  // opens from hover, focus or a long press, and it is always non-modal,\n  // since a panel that blocked the page while the pointer merely rested on\n  // something would be a trap. `modal` is left alone rather than refused,\n  // and `Popover.Content` reads it as it always did — the two are simply\n  // never combined by anything the page draws.\n  if (trigger === 'hover') {\n    return <PopoverContext value={context}>\n        <PreviewTrigger closeDelay={closeDelay} delay={delay} {...props}>\n          {children}\n        </PreviewTrigger>\n      </PopoverContext>;\n  }\n  return <PopoverContext value={context}>\n      <DialogTrigger {...props}>{children}</DialogTrigger>\n    </PopoverContext>;\n}\n\n/**\n * The panel itself. Everything the popover shows goes in here; the trigger\n * stays outside it, since the trigger lives in the page while this is\n * portalled out to the end of the body.\n *\n * Placement is React Aria's anchor positioning, so the panel flips to the\n * opposite side and shifts along the edge of the viewport on its own rather\n * than being clipped by it.\n */\nfunction PopoverContent({\n  align = 'center',\n  alignOffset,\n  children,\n  className,\n  container,\n  ref,\n  side = 'bottom',\n  sideOffset = DEFAULT_SIDE_OFFSET,\n  style,\n  triggerRef,\n  ...props\n}: PopoverContentProps & RefAttributes<HTMLElement>) {\n  const {\n    modal,\n    size\n  } = useContext(PopoverContext);\n  const descriptionId = useId();\n  const [described, setDescribed] = useState(false);\n  const register = useCallback(() => {\n    setDescribed(true);\n    return () => {\n      setDescribed(false);\n    };\n  }, []);\n  const description = useMemo(() => ({\n    id: descriptionId,\n    register\n  }), [descriptionId, register]);\n  return <RACPopover crossOffset={alignOffset} isNonModal={!modal} offset={sideOffset} placement={placementOf(side, align)}\n  // The surface, where the call site's class and style land, rather than\n  // the dialog inside it, which takes the rest of the props.\n  ref={ref} triggerRef={triggerRef}\n  // oxlint-disable-next-line typescript/no-deprecated -- its replacement, UNSAFE_PortalProvider, is not exported by react-aria-components\n  UNSTABLE_portalContainer={container} {...mergeStatefulStyles((state: PopoverRenderProps) => stylex.props(overlay.popup, styles.content, styles[size], popupOrigin(state.placement)), {\n    className,\n    style\n  })}>\n      <Dialog aria-describedby={described ? descriptionId : undefined} {...props} {...stylex.props(overlay.popupDialog, focus.ring)}>\n        <DescriptionContext value={description}>{children}</DescriptionContext>\n      </Dialog>\n    </RACPopover>;\n}\n\n/**\n * Supporting copy under the title. The panel's `aria-describedby` points at\n * it — see DescriptionContext for why that is this component's doing.\n */\nfunction PopoverDescription(props: PopoverDescriptionProps) {\n  const {\n    id,\n    register\n  } = useContext(DescriptionContext);\n  useEffect(() => register(), [register]);\n  return <Text id={id} slot=\"description\" {...props} {...mergeStyles({\n    className: \"x9f619 x1w5n3ug xpo2rfv x193rfdd x1hews6w xn43zvd xv61bfh x1ghz6dp\"\n  }, props)} />;\n}\n\n/**\n * Names the popover. Rendered through React Aria's title slot, which is what\n * points the panel's `aria-labelledby` at it — a popover without one announces\n * itself unnamed.\n */\nfunction PopoverTitle(props: PopoverTitleProps) {\n  return <Heading slot=\"title\" {...props} {...mergeStyles({\n    className: \"x9f619 x1w5n3ug xrgwony x12s497w x1szcwkt xo803ec xyl1r0q x1ghz6dp\"\n  }, props)} />;\n}\nPopover.Content = PopoverContent;\nPopover.Description = PopoverDescription;\nPopover.Title = PopoverTitle;\n\n// The dialog's own props, plus the four that place the panel and its\n// styling. Those belong to the positioned panel rather than to the dialog,\n// but a call site has no reason to know there are two elements — `className`\n// and `style` reach the panel, which is the one worth restyling, and\n// everything else lands on the dialog.\ntype PopoverContentProps = Omit<DialogProps, 'children' | 'className' | 'style'> & {\n  /**\n   * Where the panel sits along the side it opens on.\n   * @default 'center'\n   */\n  align?: PopoverAlign;\n  /** Moves the panel along that side, in pixels. */\n  alignOffset?: number;\n  children?: ReactNode;\n  /** A function may compute the class from the panel's render state. */\n  className?: ClassNameOrFunction<PopoverRenderProps>;\n  /**\n   * Where to portal the panel. Defaults to the end of `<body>`, which is\n   * right for an app that sets its StyleX theme on `:root`. An app that\n   * scopes the theme to a subtree has to point this at an element inside it,\n   * or the popover renders outside the theme and falls back to the tokens'\n   * `prefers-color-scheme` default.\n   */\n  container?: Element;\n  /**\n   * Which side of the trigger the panel opens on. It flips to the opposite\n   * side when there is no room.\n   * @default 'bottom'\n   */\n  side?: PopoverSide;\n  /**\n   * The gap between the trigger and the panel, in pixels.\n   * @default 8\n   */\n  sideOffset?: number;\n  /** A function may compute the style from the panel's render state. */\n  style?: StyleOrFunction<PopoverRenderProps>;\n  /**\n   * An element to anchor the panel to other than the trigger that opened it.\n   */\n  triggerRef?: RefObject<Element | null>;\n};\ntype PopoverDescriptionProps = TextProps;\ntype PopoverTitleProps = HeadingProps;\nexport type { PopoverAlign, PopoverContentProps, PopoverDescriptionProps, PopoverProps, PopoverSide, PopoverSize, PopoverTitleProps, PopoverTrigger };\nexport { PopoverContent, PopoverDescription, PopoverTitle };\nexport default Popover;"],"mappings":"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"}

package/dist/components/radio-group/index.js

@@ -40,6 +40,16 @@ const hoverLayers = {
 		$$css: true
 	}
 };
+const focusLayers = {
+	selected: {
+		kWkggS: "x1sog3nf",
+		$$css: true
+	},
+	unselected: {
+		kWkggS: "xwqhyid",
+		$$css: true
+	}
+};
 const pressedLayers = {
 	selected: {
 		kWkggS: "xjeeohs",
@@ -57,7 +67,7 @@ function buttonContent(children, ripple) {
 		const active = state.isHovered || state.isPressed || state.isFocusVisible;
 		return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("span", {
 			...interactive ? ripple.handlers : {},
-			...props(controlStyles.disc, styles.control, state.isSelected && styles.toneSelected, !state.isSelected && interactive && active && styles.toneActive, state.isDisabled && styles.toneDisabled, state.isReadOnly && controlStyles.controlReadOnly, state.isDisabled && controlStyles.controlDisabled, interactive && state.isHovered && hoverLayers[tone], interactive && state.isPressed && pressedLayers[tone], state.isFocusVisible && focus.ringVisible),
+			...props(controlStyles.disc, styles.control, state.isSelected && styles.toneSelected, !state.isSelected && interactive && active && styles.toneActive, state.isDisabled && styles.toneDisabled, state.isReadOnly && controlStyles.controlReadOnly, state.isDisabled && controlStyles.controlDisabled, interactive && state.isHovered && hoverLayers[tone], interactive && state.isFocusVisible && focusLayers[tone], interactive && state.isPressed && pressedLayers[tone], state.isFocusVisible && focus.ringVisible),
 			children: [/* @__PURE__ */ jsx("span", {
 				className: "x12w9bfk x6s0dn4 x1qx5ct2 x1r7ld26 x16fbrrb x1y0btm7 xdh2fpr x9f619 x78zum5 xw4jnvo xl56j7k x1qno0dh xshfolx xpc4ca7",
 				children: state.isSelected ? /* @__PURE__ */ jsx("span", { ...{
@@ -74,6 +84,7 @@ function buttonContent(children, ripple) {
 function groupContent(label, children, description, error, horizontal) {
 	return (state) => /* @__PURE__ */ jsxs(Fragment, { children: [
 		/* @__PURE__ */ jsx(FieldLabel, {
+			isRequired: state.isRequired,
 			state,
 			variant: "group",
 			children: label
@@ -103,10 +114,10 @@ function groupContent(label, children, description, error, horizontal) {
 */
 function Radio(t0) {
 	const $ = c(14);
-	const { children, description, ...props$1 } = t0;
+	const { children, description, ...props$2 } = t0;
 	const ripple = useRipple();
 	const T0 = RadioField;
-	const t1 = mergeStatefulStyles(props(controlStyles.field), props$1);
+	const t1 = mergeStatefulStyles(props(controlStyles.field), props$2);
 	let t2;
 	if ($[0] !== children || $[1] !== ripple) {
 		t2 = buttonContent(children, ripple);
@@ -141,14 +152,14 @@ function Radio(t0) {
 		$[7] = t5;
 	} else t5 = $[7];
 	let t6;
-	if ($[8] !== T0 || $[9] !== props$1 || $[10] !== t1 || $[11] !== t3 || $[12] !== t5) {
+	if ($[8] !== T0 || $[9] !== props$2 || $[10] !== t1 || $[11] !== t3 || $[12] !== t5) {
 		t6 = /* @__PURE__ */ jsxs(T0, {
-			...props$1,
+			...props$2,
 			...t1,
 			children: [t3, t5]
 		});
 		$[8] = T0;
-		$[9] = props$1;
+		$[9] = props$2;
 		$[10] = t1;
 		$[11] = t3;
 		$[12] = t5;
@@ -169,7 +180,7 @@ function Radio(t0) {
 */
 function RadioGroup$1(t0) {
 	const $ = c(16);
-	const { children, description, error, label, orientation: t1, ...props$2 } = t0;
+	const { children, description, error, label, orientation: t1, ...props$1 } = t0;
 	const orientation = t1 === void 0 ? "vertical" : t1;
 	const validationBehavior = useFieldValidationBehavior();
 	const T0 = RadioGroup;
@@ -179,7 +190,7 @@ function RadioGroup$1(t0) {
 		$[0] = error;
 		$[1] = t2;
 	} else t2 = $[1];
-	const t3 = mergeStatefulStyles(props(groupStyles.root), props$2);
+	const t3 = mergeStatefulStyles(props(groupStyles.root), props$1);
 	const t4 = orientation === "horizontal";
 	let t5;
 	if ($[2] !== children || $[3] !== description || $[4] !== error || $[5] !== label || $[6] !== t4) {
@@ -192,18 +203,18 @@ function RadioGroup$1(t0) {
 		$[7] = t5;
 	} else t5 = $[7];
 	let t6;
-	if ($[8] !== T0 || $[9] !== orientation || $[10] !== props$2 || $[11] !== t2 || $[12] !== t3 || $[13] !== t5 || $[14] !== validationBehavior) {
+	if ($[8] !== T0 || $[9] !== orientation || $[10] !== props$1 || $[11] !== t2 || $[12] !== t3 || $[13] !== t5 || $[14] !== validationBehavior) {
 		t6 = /* @__PURE__ */ jsx(T0, {
 			isInvalid: t2,
 			orientation,
 			validationBehavior,
-			...props$2,
+			...props$1,
 			...t3,
 			children: t5
 		});
 		$[8] = T0;
 		$[9] = orientation;
-		$[10] = props$2;
+		$[10] = props$1;
 		$[11] = t2;
 		$[12] = t3;
 		$[13] = t5;