@12-apps/ui 6.20.0 → 6.21.0

package/src/components/form/field-pulse.native.tsx

@@ -0,0 +1,78 @@
+import * as React from 'react';
+import { Animated, Easing, Platform, StyleSheet } from 'react-native';
+
+import { INPUT_PULSE } from './Input/Input.metrics';
+
+/**
+ * THE BAR THAT PULSES BEHIND A FIELD.
+ *
+ * `Input.styles.ts` and `Select.tsx` declare the same `::after` — a 56px wash
+ * of the primary hue at 0.3, growing a 10px box-shadow ring and fading out
+ * every two seconds — so the native halves draw it from one component rather
+ * than one each. The numbers stay in `Input.metrics.ts`, which `Select.metrics`
+ * re-exports under its own name.
+ *
+ * React Native has no box-shadow spread, so the ring is a scale on the bar.
+ */
+export function FieldPulse({
+  color,
+  radius,
+  testID,
+}: {
+  color: string;
+  radius: number;
+  testID: string;
+}): React.JSX.Element {
+  const progress = React.useRef(new Animated.Value(0)).current;
+
+  React.useEffect(() => {
+    const loop = Animated.loop(
+      Animated.timing(progress, {
+        toValue: 1,
+        duration: INPUT_PULSE.ms,
+        easing: Easing.out(Easing.ease),
+        useNativeDriver: Platform.OS !== 'web',
+      }),
+    );
+    loop.start();
+    return () => loop.stop();
+  }, [progress]);
+
+  return (
+    <Animated.View
+      testID={testID}
+      aria-hidden
+      style={[
+        styles.pulse,
+        {
+          borderRadius: radius,
+          backgroundColor: color,
+          opacity: progress.interpolate({
+            inputRange: [0, 0.7, 1],
+            outputRange: [INPUT_PULSE.opacity, 0, 0],
+          }),
+          transform: [
+            { translateY: -INPUT_PULSE.height / 2 },
+            {
+              scale: progress.interpolate({
+                inputRange: [0, 0.7, 1],
+                outputRange: [1, 1 + INPUT_PULSE.spread / INPUT_PULSE.height, 1],
+              }),
+            },
+          ],
+        },
+      ]}
+    />
+  );
+}
+
+const styles = StyleSheet.create({
+  pulse: {
+    position: 'absolute',
+    top: '50%',
+    left: 0,
+    right: 0,
+    height: INPUT_PULSE.height,
+    pointerEvents: 'none',
+  },
+});

package/src/icons/glyphs.json

@@ -2,11 +2,14 @@
   "Add",
   "ArrowBack",
   "ArrowDownward",
+  "ArrowDropDown",
   "ArrowForward",
   "ArrowUpward",
   "BrokenImage",
   "Cancel",
   "Check",
+  "CheckBox",
+  "CheckBoxOutlineBlank",
   "CheckCircle",
   "ChevronLeft",
   "ChevronRight",
@@ -19,6 +22,7 @@
   "ExpandLess",
   "ExpandMore",
   "FilterList",
+  "IndeterminateCheckBox",
   "Info",
   "InfoOutlined",
   "KeyboardArrowDown",

package/src/icons/paths.generated.ts

@@ -10,11 +10,14 @@ export const ICON_PATHS = {
   Add: ["M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"],
   ArrowBack: ["M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20z"],
   ArrowDownward: ["m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z"],
+  ArrowDropDown: ["m7 10 5 5 5-5z"],
   ArrowForward: ["m12 4-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"],
   ArrowUpward: ["m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z"],
   BrokenImage: ["M21 5v6.59l-3-3.01-4 4.01-4-4-4 4-3-3.01V5c0-1.1.9-2 2-2h14c1.1 0 2 .9 2 2m-3 6.42 3 3.01V19c0 1.1-.9 2-2 2H5c-1.1 0-2-.9-2-2v-6.58l3 2.99 4-4 4 4z"],
   Cancel: ["M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2m5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12z"],
   Check: ["M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"],
+  CheckBox: ["M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2m-9 14-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8z"],
+  CheckBoxOutlineBlank: ["M19 5v14H5V5zm0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2"],
   CheckCircle: ["M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8z"],
   ChevronLeft: ["M15.41 7.41 14 6l-6 6 6 6 1.41-1.41L10.83 12z"],
   ChevronRight: ["M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"],
@@ -27,6 +30,7 @@ export const ICON_PATHS = {
   ExpandLess: ["m12 8-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z"],
   ExpandMore: ["M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"],
   FilterList: ["M10 18h4v-2h-4zM3 6v2h18V6zm3 7h12v-2H6z"],
+  IndeterminateCheckBox: ["M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2m-2 10H7v-2h10z"],
   Info: ["M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 15h-2v-6h2zm0-8h-2V7h2z"],
   InfoOutlined: ["M11 7h2v2h-2zm0 4h2v6h-2zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8"],
   KeyboardArrowDown: ["M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z"],

package/src/platform/aria.ts

@@ -1,5 +1,5 @@
 /**
- * ARIA ATTRIBUTES REACT NATIVE DOES NOT DECLARE.
+ * WEB ATTRIBUTES REACT NATIVE DOES NOT DECLARE.
  *
  * React Native's `ViewProps` (0.83) type a dozen `aria-*` props and stop:
  * `aria-level`, `aria-atomic` and `aria-describedby` are not among them.
@@ -13,6 +13,20 @@ export interface WebAria {
   'aria-level'?: 1 | 2 | 3 | 4 | 5 | 6;
   'aria-atomic'?: 'true' | 'false';
   'aria-describedby'?: string;
+  /**
+   * A field's validity and whether it must be filled. React Native's
+   * `accessibilityState` has neither — its five flags are disabled, selected,
+   * checked, busy and expanded — so these are web-only, and a device reads the
+   * error text instead. react-native-web forwards both.
+   */
+  'aria-invalid'?: boolean;
+  'aria-required'?: boolean;
+  /**
+   * What a control pops open. React Native has `aria-expanded` and no
+   * `aria-haspopup`, so a `combobox` needs this one from here to say the thing
+   * it expands is a listbox — which is what the web's own trigger carries.
+   */
+  'aria-haspopup'?: 'listbox' | 'menu' | 'dialog' | 'true';
 }
 
 /**
@@ -30,3 +44,60 @@ export function webAria(attrs: WebAria): object {
   const { 'aria-atomic': atomic, ...rest } = attrs;
   return atomic === undefined ? rest : { ...rest, accessibilityAtomic: atomic };
 }
+
+/**
+ * `disabled` for a react-native-web form control.
+ *
+ * React Native's `TextInput` has `editable` and no `disabled`, because a
+ * device has no disabled state to speak of — an uneditable field simply does
+ * not take the keyboard. The DOM does: only a real `disabled` attribute takes
+ * an `<input>` out of the tab order, and it is what `toBeDisabled()` reads. So
+ * a native field spreads this ALONGSIDE `editable={false}` and
+ * `aria-disabled`: react-native-web puts the attribute on the input, and a
+ * device ignores a prop it does not know.
+ */
+export function webDisabled(disabled: boolean): object {
+  return disabled ? { disabled: true } : {};
+}
+
+/**
+ * `onClick` for a react-native-web element whose React Native twin has no
+ * click of its own.
+ *
+ * react-native-web's `TextInput` forwards `onClick` to the DOM input and drops
+ * `onPressIn`; a device does the opposite. A field that must answer a press on
+ * both renderers spreads this ALONGSIDE `onPressIn`, and exactly one of the two
+ * fires on each side — never both.
+ */
+export function webClick<E>(handler: ((event: E) => void) | undefined): object {
+  return handler === undefined ? {} : { onClick: handler };
+}
+
+/**
+ * A `role` React Native's own union does not carry.
+ *
+ * `Role` (0.83) stops at `list` and `menu`: `listbox`, the role a dropdown's
+ * option list owes a screen reader, is not in it. react-native-web forwards
+ * whatever string it is given, and a device ignores a role it does not know —
+ * the same trade `webAria` makes for the attributes below it.
+ */
+export function webRole(role: string): object {
+  return { role };
+}
+
+/** The half of a DOM keyboard event a component needs, without the DOM lib. */
+export interface WebKeyEvent {
+  key: string;
+}
+
+/**
+ * `onKeyDown` for a react-native-web element.
+ *
+ * React Native has no key events on a `View` — a phone has no keyboard to
+ * press Escape on — so nothing here is typed by react-native and nothing here
+ * fires on a device. react-native-web forwards it to the DOM, which is what
+ * lets a native dropdown still answer Escape and the arrow keys in a browser.
+ */
+export function webKeyDown(handler: (event: WebKeyEvent) => void): object {
+  return { onKeyDown: handler };
+}

package/src/platform/test-id.ts

@@ -18,6 +18,19 @@ export function resolveTestId(props: TestIdProps, fallback?: string): string | u
   return props.testID ?? props.dataTestId ?? props['data-testid'] ?? fallback;
 }
 
+/**
+ * The id under whichever of the three spellings the caller used, together with
+ * the props stripped of all three — so a web component can put `data-testid`
+ * where the DOM wants it without React seeing `testID` or `dataTestId` and
+ * warning that it does not recognise them.
+ */
+export function splitTestId<T extends TestIdProps>(
+  props: T,
+  fallback?: string,
+): { testId: string | undefined; rest: Omit<T, keyof TestIdProps> } {
+  return { testId: resolveTestId(props, fallback), rest: withoutTestIdProps(props) };
+}
+
 /** `${id}-${suffix}` for a sub-element, or `${fallback}-${suffix}` when unnamed. */
 export function childTestId(
   props: TestIdProps,

package/src/tokens/field-edge.core.ts

@@ -0,0 +1,87 @@
+import {
+  darken,
+  decomposeColor,
+  getContrastRatio,
+  getLuminance,
+  hslToRgb,
+  lighten,
+  recomposeColor,
+} from './color';
+
+/**
+ * THE FIELD EDGE, WITH NO RENDERER BEHIND IT.
+ *
+ * The argument for why an outlined control cannot draw its resting boundary
+ * from `alpha(theme.palette.divider, 0.23)` is in `./field-edge.ts`, next to
+ * the MUI-typed `fieldEdge` the web components call. This file is the WALK
+ * itself, over two colour strings, so the native renderer can run it too:
+ * `Input.native.tsx` and `Select.native.tsx` have no MUI `Theme` to pass and no
+ * `@mui/material/styles` to import, and a second copy of the walk beside them
+ * is a second answer to "where is this field's border" waiting to drift.
+ *
+ * `./color` is a faithful port of MUI's colour manipulator (asserted equal to
+ * it in `./__tests__/color.test.ts`), so the string this returns is the string
+ * the web has always emitted.
+ */
+
+/**
+ * WCAG 2.1 SC 1.4.11 — the contrast a control's own boundary owes the surface
+ * behind it. See `./field-edge.ts` for why 3:1 and why it is a floor.
+ */
+export const MIN_UI_CONTRAST = 3;
+
+/** How far one step of the walk moves, and how many steps before it gives up. */
+const STEP = 0.05;
+const MAX_STEPS = 20;
+
+/** A colour's red, green, blue and alpha, with `hsl()` converted on the way. */
+function channels(colour: string): [number, number, number, number] {
+  const decomposed = decomposeColor(colour);
+  const rgb = decomposed.type.startsWith('hsl') ? decomposeColor(hslToRgb(colour)) : decomposed;
+  const [r, g, b, a] = rgb.values;
+  return [r ?? 0, g ?? 0, b ?? 0, a ?? 1];
+}
+
+/**
+ * A colour as an opaque `rgb()`, with any translucency resolved against
+ * `surface`.
+ *
+ * Needed because `getContrastRatio` reads the channels it is given and ignores
+ * the alpha, so handing it an `rgba()` measures a colour nobody sees.
+ */
+function flatten(colour: string, surface: string): string {
+  const [r, g, b, alpha] = channels(colour);
+  if (alpha >= 1) return recomposeColor({ type: 'rgb', values: [r, g, b] });
+
+  const [baseR, baseG, baseB] = channels(surface);
+  const blend = (fg: number, bg: number): number => Math.round(alpha * fg + (1 - alpha) * bg);
+  return recomposeColor({
+    type: 'rgb',
+    values: [blend(r, baseR), blend(g, baseG), blend(b, baseB)],
+  });
+}
+
+/**
+ * The resting boundary a control draws on `surface`, from the theme's own
+ * `divider` as the seed: the seed itself when it already clears
+ * {@link MIN_UI_CONTRAST}, otherwise the nearest tone of it that does.
+ */
+export function resolveFieldEdge(divider: string, surface: string): string {
+  const ground = flatten(surface, '#FFFFFF');
+  const seed = flatten(divider, ground);
+  if (getContrastRatio(seed, ground) >= MIN_UI_CONTRAST) return seed;
+
+  // Away from the surface, whichever way that is — so one rule serves both
+  // modes, and a dark card in a light theme is still handled by the pair rather
+  // than by `palette.mode`.
+  const away = getLuminance(ground) > 0.5 ? darken : lighten;
+  for (let step = 1; step <= MAX_STEPS; step += 1) {
+    // From the SEED each time rather than compounding the previous result, so
+    // the walk lands on the nearest passing tone instead of overshooting past it.
+    const candidate = away(seed, step * STEP);
+    if (getContrastRatio(candidate, ground) >= MIN_UI_CONTRAST) return candidate;
+  }
+  // Unreachable for any real surface — black clears 21:1 on white and white
+  // clears it on black — but a caller must never be handed `undefined`.
+  return getLuminance(ground) > 0.5 ? '#000000' : '#FFFFFF';
+}

package/src/tokens/field-edge.ts

@@ -1,14 +1,7 @@
-import {
-  darken,
-  decomposeColor,
-  getContrastRatio,
-  getLuminance,
-  hslToRgb,
-  lighten,
-  recomposeColor,
-} from '@mui/material/styles/index.js';
 import type { Theme } from '@mui/material/styles/index.js';
 
+import { resolveFieldEdge } from './field-edge.core';
+
 /**
  * THE EDGE THAT TELLS YOU WHERE A FIELD IS.
  *
@@ -66,50 +59,17 @@ import type { Theme } from '@mui/material/styles/index.js';
  * corrected brand colour that clears the floor by construction. The resting
  * state was the only one you could not see, and it is the one that matters,
  * because it is the state a field is in before anyone has found it.
- */
-
-/**
- * WCAG 2.1 SC 1.4.11 — the contrast a control's own boundary owes the surface
- * behind it.
  *
- * 3:1 rather than the 4.5:1 the same spec asks of body text: a border is a
- * shape, not a glyph, so it stays findable at a lower ratio. It is a FLOOR and
- * not a target — {@link fieldEdge} stops at the first tone that clears it, so a
- * theme with a stronger hairline keeps the stronger one.
- */
-export const MIN_UI_CONTRAST = 3;
-
-/** How far one step of the walk moves, and how many steps before it gives up. */
-const STEP = 0.05;
-const MAX_STEPS = 20;
-
-/**
- * A colour as an opaque `rgb()`, with any translucency resolved against
- * `surface`.
+ * ## Where the walk itself lives
  *
- * Needed because `getContrastRatio` reads the channels it is given and ignores
- * the alpha, so handing it an `rgba()` measures a colour nobody sees. Every
- * failing border above was translucent, so skipping this would compute the ratio
- * of the hairline itself — 1.26:1, still a failure, but the wrong number for the
- * wrong reason.
+ * `./field-edge.core.ts`, over two colour strings and this package's own
+ * colour arithmetic. The native `Input` and `Select` draw the same border and
+ * have neither a MUI `Theme` to pass nor `@mui/material/styles` to import, so
+ * the algorithm sits one file below this one and both renderers call it. This
+ * file is the MUI-typed door onto it, and the argument above.
  */
-function flatten(colour: string, surface: string): string {
-  const decomposed = decomposeColor(colour);
-  const rgb = decomposed.type.startsWith('hsl')
-    ? decomposeColor(hslToRgb(colour))
-    : decomposed;
-  const [r, g, b] = rgb.values;
-  const alpha = rgb.values[3] ?? 1;
-  if (alpha >= 1) return recomposeColor({ type: 'rgb', values: [r, g, b] });
 
-  const behind = decomposeColor(surface);
-  const base = behind.type.startsWith('hsl') ? decomposeColor(hslToRgb(surface)) : behind;
-  const blend = (fg: number, bg: number): number => Math.round(alpha * fg + (1 - alpha) * bg);
-  return recomposeColor({
-    type: 'rgb',
-    values: [blend(r, base.values[0]), blend(g, base.values[1]), blend(b, base.values[2])],
-  });
-}
+export { MIN_UI_CONTRAST } from './field-edge.core';
 
 /**
  * The resting boundary for a form control on `surface`.
@@ -121,21 +81,5 @@ function flatten(colour: string, surface: string): string {
  * as the pair it is given.
  */
 export function fieldEdge(theme: Theme, surface?: string): string {
-  const ground = flatten(surface ?? theme.palette.background.paper, '#FFFFFF');
-  const seed = flatten(theme.palette.divider, ground);
-  if (getContrastRatio(seed, ground) >= MIN_UI_CONTRAST) return seed;
-
-  // Away from the surface, whichever way that is — so one rule serves both
-  // modes, and a dark card in a light theme is still handled by the pair rather
-  // than by `palette.mode`.
-  const away = getLuminance(ground) > 0.5 ? darken : lighten;
-  for (let step = 1; step <= MAX_STEPS; step += 1) {
-    // From the SEED each time rather than compounding the previous result, so
-    // the walk lands on the nearest passing tone instead of overshooting past it.
-    const candidate = away(seed, step * STEP);
-    if (getContrastRatio(candidate, ground) >= MIN_UI_CONTRAST) return candidate;
-  }
-  // Unreachable for any real surface — black clears 21:1 on white and white
-  // clears it on black — but a caller must never be handed `undefined`.
-  return getLuminance(ground) > 0.5 ? '#000000' : '#FFFFFF';
+  return resolveFieldEdge(theme.palette.divider, surface ?? theme.palette.background.paper);
 }

package/dist/chunk-BJ3J6FTN.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/form/Checkbox/Checkbox.tsx"],"sourcesContent":["import MuiCheckbox from '@mui/material/Checkbox/index.js';\nimport CircularProgress from '@mui/material/CircularProgress/index.js';\nimport FormControlLabel from '@mui/material/FormControlLabel/index.js';\nimport FormHelperText from '@mui/material/FormHelperText/index.js';\nimport { alpha, keyframes, styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { makeTestId, resolveCheckboxProps } from './Checkbox.helpers';\nimport type { CheckboxProps } from './Checkbox.types';\n\nconst pulse = keyframes`\n  0% {\n    box-shadow: 0 0 0 0 rgba(25, 118, 210, 0.7);\n  }\n  70% {\n    box-shadow: 0 0 0 10px rgba(25, 118, 210, 0);\n  }\n  100% {\n    box-shadow: 0 0 0 0 rgba(25, 118, 210, 0);\n  }\n`;\n\nconst glow = keyframes`\n  0%, 100% {\n    box-shadow: 0 0 5px rgba(25, 118, 210, 0.5);\n  }\n  50% {\n    box-shadow: 0 0 20px rgba(25, 118, 210, 0.8);\n  }\n`;\n\nconst StyledCheckbox = styled(MuiCheckbox, {\n  shouldForwardProp: (prop) => !['customVariant', 'ripple', 'glow', 'pulse'].includes(prop as string),\n})<{ \n  customVariant?: CheckboxProps['variant'];\n  ripple?: boolean;\n  glow?: boolean;\n  pulse?: boolean;\n}>(\n  ({ theme, customVariant, ripple, glow: glowProp, pulse: pulseProp }) => ({\n    ...(customVariant === 'rounded' && {\n      '& .MuiSvgIcon-root': {\n        borderRadius: '50%',\n      },\n    }),\n    \n    ...(customVariant === 'toggle' && {\n      '& .MuiSvgIcon-root': {\n        borderRadius: '12px',\n        transform: 'scale(1.2)',\n      },\n    }),\n    \n    '&.MuiCheckbox-root': {\n      transition: 'all 0.3s ease',\n      ...(ripple === false && {\n        '& .MuiTouchRipple-root': {\n          display: 'none',\n        },\n      }),\n      ...(glowProp && {\n        animation: `${glow} 2s ease-in-out infinite`,\n      }),\n      ...(pulseProp && {\n        animation: `${pulse} 2s infinite`,\n      }),\n      '&:hover': {\n        backgroundColor: alpha(theme.palette.primary.main, 0.1),\n      },\n    },\n    \n    '&.Mui-checked': {\n      color: theme.palette.primary.main,\n    },\n    \n    '&.MuiCheckbox-indeterminate': {\n      color: theme.palette.primary.main,\n    },\n  })\n);\n\nconst StyledFormControlLabel = styled(FormControlLabel, {\n  shouldForwardProp: (prop) => prop !== 'error',\n})<{ error?: boolean }>(\n  ({ theme, error }) => ({\n    marginLeft: 0,\n    '& .MuiFormControlLabel-label': {\n      color: error ? theme.palette.error.main : theme.palette.text.primary,\n      fontSize: '0.875rem',\n    },\n  })\n);\n\nconst StyledFormHelperText = styled(FormHelperText)(({ theme }) => ({\n  marginLeft: theme.spacing(4),\n  marginTop: theme.spacing(0.5),\n}));\n\nexport const Checkbox = React.forwardRef<HTMLButtonElement, CheckboxProps>(\n  (rawProps, ref) => {\n    const {\n      variant,\n      label,\n      error,\n      helperText,\n      loading,\n      ripple,\n      glow,\n      pulse,\n      disabled,\n      'data-testid': dataTestId,\n      ...props\n    } = resolveCheckboxProps(rawProps);\n    const isDisabled = disabled || loading;\n    const testId = makeTestId(dataTestId);\n\n    const checkbox = (\n      <div style={{ position: 'relative', display: 'inline-flex' }}>\n        <StyledCheckbox\n          ref={ref}\n          customVariant={variant}\n          ripple={ripple}\n          glow={glow}\n          pulse={pulse}\n          disabled={isDisabled}\n          data-testid={dataTestId || 'checkbox'}\n          {...props}\n        />\n        {loading && (\n          <CircularProgress\n            size={20}\n            sx={{\n              position: 'absolute',\n              top: '50%',\n              left: '50%',\n              marginTop: '-10px',\n              marginLeft: '-10px',\n              color: 'primary.main',\n            }}\n          />\n        )}\n      </div>\n    );\n    \n    if (label) {\n      return (\n        <div data-testid={testId('container')}>\n          <StyledFormControlLabel\n            control={checkbox}\n            label={label}\n            error={error}\n            disabled={isDisabled}\n          />\n          {helperText && (\n            <StyledFormHelperText \n              error={error}\n              data-testid={testId('helper')}\n            >\n              {helperText}\n            </StyledFormHelperText>\n          )}\n        </div>\n      );\n    }\n    \n    return checkbox;\n  }\n);\n\nCheckbox.displayName = 'Checkbox';"],"mappings":"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","names":["glow","pulse"]}

package/dist/chunk-FX5DY6VR.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/form/Switch/Switch.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport React, { forwardRef } from 'react';\n\nimport { withDefaults } from '../../../utils/withDefaults';\n\nimport {\n  LabelContainer,\n  SwitchControl,\n  SwitchHelper,\n  SwitchLabel,\n} from './Switch.parts';\nimport type { SwitchProps } from './Switch.types';\n\nconst DEFAULTS = {\n  variant: 'default',\n  color: 'primary',\n  size: 'md',\n  glow: false,\n  glass: false,\n  gradient: false,\n  labelPosition: 'end',\n  error: false,\n  animated: true,\n  loading: false,\n  ripple: false,\n  pulse: false,\n} satisfies Partial<SwitchProps>;\n\ntype ResolvedProps = SwitchProps & Required<Pick<SwitchProps, keyof typeof DEFAULTS>>;\n\nexport const Switch = forwardRef<HTMLButtonElement, SwitchProps>((props, ref) => {\n  const {\n    variant, color, size, label, description, glow, glass, gradient, labelPosition,\n    onIcon, offIcon, onText, offText, error, helperText, trackWidth, trackHeight,\n    checked, onChange, animated, loading, ripple, pulse, dataTestId,\n    ...rest\n  } = withDefaults(props, DEFAULTS) as ResolvedProps;\n\n  const containerTestId = dataTestId ? `${dataTestId}-container` : 'switch-container';\n\n  const control = (\n    <SwitchControl\n      customVariant={variant}\n      customColor={color}\n      customSize={size}\n      glow={glow}\n      glass={glass}\n      gradient={gradient}\n      trackWidth={trackWidth}\n      trackHeight={trackHeight}\n      onText={onText}\n      offText={offText}\n      loading={loading}\n      ripple={ripple}\n      pulse={pulse}\n      checked={checked}\n      onChange={onChange}\n      onIcon={onIcon}\n      offIcon={offIcon}\n      animated={animated}\n      size={size}\n      dataTestId={dataTestId}\n      switchRef={ref}\n      rest={rest}\n    />\n  );\n\n  const helper = <SwitchHelper helperText={helperText} error={error} dataTestId={dataTestId} />;\n\n  if (!label) {\n    return (\n      <Box data-testid={containerTestId}>\n        {control}\n        {helper}\n      </Box>\n    );\n  }\n\n  return (\n    <Box data-testid={containerTestId}>\n      <LabelContainer labelPosition={labelPosition} error={error}>\n        {labelPosition === 'start' && control}\n\n        <SwitchLabel\n          label={label}\n          description={description}\n          error={error}\n          dataTestId={dataTestId}\n        />\n\n        {labelPosition !== 'start' && control}\n      </LabelContainer>\n\n      {helper}\n    </Box>\n  );\n});\n\nSwitch.displayName = 'Switch';\n"],"mappings":";;;;;;;;;;;AAAA,OAAO,SAAS;AAChB,SAAgB,kBAAkB;AAwC9B,cA8BE,YA9BF;AA5BJ,IAAM,WAAW;AAAA,EACf,SAAS;AAAA,EACT,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU;AAAA,EACV,eAAe;AAAA,EACf,OAAO;AAAA,EACP,UAAU;AAAA,EACV,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,OAAO;AACT;AAIO,IAAM,SAAS,WAA2C,CAAC,OAAO,QAAQ;AAC/E,QAAM;AAAA,IACJ;AAAA,IAAS;AAAA,IAAO;AAAA,IAAM;AAAA,IAAO;AAAA,IAAa;AAAA,IAAM;AAAA,IAAO;AAAA,IAAU;AAAA,IACjE;AAAA,IAAQ;AAAA,IAAS;AAAA,IAAQ;AAAA,IAAS;AAAA,IAAO;AAAA,IAAY;AAAA,IAAY;AAAA,IACjE;AAAA,IAAS;AAAA,IAAU;AAAA,IAAU;AAAA,IAAS;AAAA,IAAQ;AAAA,IAAO;AAAA,IACrD,GAAG;AAAA,EACL,IAAI,aAAa,OAAO,QAAQ;AAEhC,QAAM,kBAAkB,aAAa,GAAG,UAAU,eAAe;AAEjE,QAAM,UACJ;AAAA,IAAC;AAAA;AAAA,MACC,eAAe;AAAA,MACf,aAAa;AAAA,MACb,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX;AAAA;AAAA,EACF;AAGF,QAAM,SAAS,oBAAC,gBAAa,YAAwB,OAAc,YAAwB;AAE3F,MAAI,CAAC,OAAO;AACV,WACE,qBAAC,OAAI,eAAa,iBACf;AAAA;AAAA,MACA;AAAA,OACH;AAAA,EAEJ;AAEA,SACE,qBAAC,OAAI,eAAa,iBAChB;AAAA,yBAAC,kBAAe,eAA8B,OAC3C;AAAA,wBAAkB,WAAW;AAAA,MAE9B;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,MACF;AAAA,MAEC,kBAAkB,WAAW;AAAA,OAChC;AAAA,IAEC;AAAA,KACH;AAEJ,CAAC;AAED,OAAO,cAAc;","names":[]}

package/dist/chunk-JD364H3Y.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/form/Checkbox/Checkbox.helpers.ts"],"sourcesContent":["import type { CheckboxProps } from './Checkbox.types';\n\ntype CheckboxDefaultedKeys = 'variant' | 'ripple' | 'glow' | 'pulse';\n\ntype ResolvedCheckboxProps = CheckboxProps &\n  Required<Pick<CheckboxProps, CheckboxDefaultedKeys>>;\n\nconst CHECKBOX_DEFAULTS: Pick<CheckboxProps, CheckboxDefaultedKeys> = {\n  variant: 'default',\n  ripple: true,\n  glow: false,\n  pulse: false,\n};\n\n// Strips explicitly-undefined props before the merge, so `ripple={undefined}` still\n// falls back to the default exactly as a destructuring default would.\nconst definedProps = (props: CheckboxProps): Partial<CheckboxProps> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<CheckboxProps>;\n\nexport const resolveCheckboxProps = (props: CheckboxProps): ResolvedCheckboxProps =>\n  ({ ...CHECKBOX_DEFAULTS, ...definedProps(props) }) as ResolvedCheckboxProps;\n\nexport const makeTestId =\n  (dataTestId?: string) =>\n  (suffix: string): string =>\n    dataTestId ? `${dataTestId}-${suffix}` : `checkbox-${suffix}`;\n"],"mappings":";AAOA,IAAM,oBAAgE;AAAA,EACpE,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AACT;AAIA,IAAM,eAAe,CAAC,UACpB,OAAO;AAAA,EACL,OAAO,QAAQ,KAAK,EAAE,OAAO,CAAC,CAAC,EAAE,KAAK,MAAM,UAAU,MAAS;AACjE;AAEK,IAAM,uBAAuB,CAAC,WAClC,EAAE,GAAG,mBAAmB,GAAG,aAAa,KAAK,EAAE;AAE3C,IAAM,aACX,CAAC,eACD,CAAC,WACC,aAAa,GAAG,UAAU,IAAI,MAAM,KAAK,YAAY,MAAM;","names":[]}

package/dist/chunk-MLOWPVVW.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/tokens/field-edge.ts"],"sourcesContent":["import {\n  darken,\n  decomposeColor,\n  getContrastRatio,\n  getLuminance,\n  hslToRgb,\n  lighten,\n  recomposeColor,\n} from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\n\n/**\n * THE EDGE THAT TELLS YOU WHERE A FIELD IS.\n *\n * Every outlined control in this package drew its resting border from\n * `alpha(theme.palette.divider, 0.23)` — or 0.2, or 0.18, or 0.42 for the\n * underline. On the MUI default theme that expression is harmless, and that is\n * exactly why it survived: MUI's own light `divider` is `rgba(0, 0, 0, 0.12)`,\n * and `alpha()` REPLACES the alpha channel rather than multiplying it, so\n * `alpha(divider, 0.23)` resolves to `rgba(0, 0, 0, 0.23)` — byte for byte the\n * border MUI's own `OutlinedInput` ships. The line reads like a restatement of\n * the default because, against the default, it is one.\n *\n * Give it a theme whose `divider` is an OPAQUE hex and the same expression\n * collapses. A themed divider is already a hairline — a pale warm cream, a pale\n * green-grey — chosen to separate two rows INSIDE a card. Fading that to 23%\n * over the card it sits on leaves a border the same colour as the card:\n *\n * | theme                          | resolved border | ratio |\n * |--------------------------------|-----------------|-------|\n * | MUI default (`rgba(0,0,0,.12)`)| `#C4C4C4`       | 1.74:1|\n * | a warm hairline `#EBD9C7`      | `#FAF6F2`       | 1.08:1|\n * | a cool hairline `#D7DDD5`      | `#EDF0EC`       | 1.06:1|\n *\n * 1.06:1 is not a faint border, it is no border: the field is invisible until\n * you click into it. Both failing rows are real adopter themes, and neither\n * adopter did anything wrong — they set `palette.divider`, which is what a theme\n * is for.\n *\n * **So the fault is using `divider` for this at all**, not the alpha on top of\n * it. Even at FULL strength those hairlines are 1.26:1 and 1.27:1 against their\n * own paper. A row separator and a control boundary are different jobs with\n * different floors, and only one of them has a number in the spec.\n *\n * ## The floor, and why it is measured rather than picked\n *\n * WCAG 2.1 SC 1.4.11 (Non-text Contrast) puts a control's own boundary at\n * {@link MIN_UI_CONTRAST}. A hex cannot satisfy that on its own, because the\n * ratio is a fact about a PAIR — the same border is fine on white and gone on a\n * dark card. So {@link fieldEdge} takes the theme's hairline as a SEED and walks\n * it away from the surface until it clears, which means:\n *\n *  - a theme whose divider already clears keeps its own colour, untouched;\n *  - one that does not gets the nearest tone of ITS OWN hairline that does, so\n *    the border still looks like the theme's, just visible;\n *  - dark mode needs no second table — the walk lightens on a dark surface for\n *    the same reason it darkens on a light one.\n *\n * This is the argument `readableInk` makes for text in `@12-apps/app-shell`,\n * applied to the boundary rather than the ink. It is not imported from there:\n * that package depends on THIS one, so the edge would be a cycle.\n *\n * ## What this does NOT touch\n *\n * Hover and focus, which every control already draws in `primary.main` — a\n * corrected brand colour that clears the floor by construction. The resting\n * state was the only one you could not see, and it is the one that matters,\n * because it is the state a field is in before anyone has found it.\n */\n\n/**\n * WCAG 2.1 SC 1.4.11 — the contrast a control's own boundary owes the surface\n * behind it.\n *\n * 3:1 rather than the 4.5:1 the same spec asks of body text: a border is a\n * shape, not a glyph, so it stays findable at a lower ratio. It is a FLOOR and\n * not a target — {@link fieldEdge} stops at the first tone that clears it, so a\n * theme with a stronger hairline keeps the stronger one.\n */\nexport const MIN_UI_CONTRAST = 3;\n\n/** How far one step of the walk moves, and how many steps before it gives up. */\nconst STEP = 0.05;\nconst MAX_STEPS = 20;\n\n/**\n * A colour as an opaque `rgb()`, with any translucency resolved against\n * `surface`.\n *\n * Needed because `getContrastRatio` reads the channels it is given and ignores\n * the alpha, so handing it an `rgba()` measures a colour nobody sees. Every\n * failing border above was translucent, so skipping this would compute the ratio\n * of the hairline itself — 1.26:1, still a failure, but the wrong number for the\n * wrong reason.\n */\nfunction flatten(colour: string, surface: string): string {\n  const decomposed = decomposeColor(colour);\n  const rgb = decomposed.type.startsWith('hsl')\n    ? decomposeColor(hslToRgb(colour))\n    : decomposed;\n  const [r, g, b] = rgb.values;\n  const alpha = rgb.values[3] ?? 1;\n  if (alpha >= 1) return recomposeColor({ type: 'rgb', values: [r, g, b] });\n\n  const behind = decomposeColor(surface);\n  const base = behind.type.startsWith('hsl') ? decomposeColor(hslToRgb(surface)) : behind;\n  const blend = (fg: number, bg: number): number => Math.round(alpha * fg + (1 - alpha) * bg);\n  return recomposeColor({\n    type: 'rgb',\n    values: [blend(r, base.values[0]), blend(g, base.values[1]), blend(b, base.values[2])],\n  });\n}\n\n/**\n * The resting boundary for a form control on `surface`.\n *\n * `surface` defaults to `background.paper` because that is what a field sits on\n * in the overwhelming majority of cases — a dialog, a card, a form panel. A\n * control on a deliberately different ground (a tinted strip, a glass pane over\n * a photo) should pass the ground it is actually on; the answer is only as good\n * as the pair it is given.\n */\nexport function fieldEdge(theme: Theme, surface?: string): string {\n  const ground = flatten(surface ?? theme.palette.background.paper, '#FFFFFF');\n  const seed = flatten(theme.palette.divider, ground);\n  if (getContrastRatio(seed, ground) >= MIN_UI_CONTRAST) return seed;\n\n  // Away from the surface, whichever way that is — so one rule serves both\n  // modes, and a dark card in a light theme is still handled by the pair rather\n  // than by `palette.mode`.\n  const away = getLuminance(ground) > 0.5 ? darken : lighten;\n  for (let step = 1; step <= MAX_STEPS; step += 1) {\n    // From the SEED each time rather than compounding the previous result, so\n    // the walk lands on the nearest passing tone instead of overshooting past it.\n    const candidate = away(seed, step * STEP);\n    if (getContrastRatio(candidate, ground) >= MIN_UI_CONTRAST) return candidate;\n  }\n  // Unreachable for any real surface — black clears 21:1 on white and white\n  // clears it on black — but a caller must never be handed `undefined`.\n  return getLuminance(ground) > 0.5 ? '#000000' : '#FFFFFF';\n}\n"],"mappings":";AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAuEA,IAAM,kBAAkB;AAG/B,IAAM,OAAO;AACb,IAAM,YAAY;AAYlB,SAAS,QAAQ,QAAgB,SAAyB;AACxD,QAAM,aAAa,eAAe,MAAM;AACxC,QAAM,MAAM,WAAW,KAAK,WAAW,KAAK,IACxC,eAAe,SAAS,MAAM,CAAC,IAC/B;AACJ,QAAM,CAAC,GAAG,GAAG,CAAC,IAAI,IAAI;AACtB,QAAM,QAAQ,IAAI,OAAO,CAAC,KAAK;AAC/B,MAAI,SAAS,EAAG,QAAO,eAAe,EAAE,MAAM,OAAO,QAAQ,CAAC,GAAG,GAAG,CAAC,EAAE,CAAC;AAExE,QAAM,SAAS,eAAe,OAAO;AACrC,QAAM,OAAO,OAAO,KAAK,WAAW,KAAK,IAAI,eAAe,SAAS,OAAO,CAAC,IAAI;AACjF,QAAM,QAAQ,CAAC,IAAY,OAAuB,KAAK,MAAM,QAAQ,MAAM,IAAI,SAAS,EAAE;AAC1F,SAAO,eAAe;AAAA,IACpB,MAAM;AAAA,IACN,QAAQ,CAAC,MAAM,GAAG,KAAK,OAAO,CAAC,CAAC,GAAG,MAAM,GAAG,KAAK,OAAO,CAAC,CAAC,GAAG,MAAM,GAAG,KAAK,OAAO,CAAC,CAAC,CAAC;AAAA,EACvF,CAAC;AACH;AAWO,SAAS,UAAU,OAAc,SAA0B;AAChE,QAAM,SAAS,QAAQ,WAAW,MAAM,QAAQ,WAAW,OAAO,SAAS;AAC3E,QAAM,OAAO,QAAQ,MAAM,QAAQ,SAAS,MAAM;AAClD,MAAI,iBAAiB,MAAM,MAAM,KAAK,gBAAiB,QAAO;AAK9D,QAAM,OAAO,aAAa,MAAM,IAAI,MAAM,SAAS;AACnD,WAAS,OAAO,GAAG,QAAQ,WAAW,QAAQ,GAAG;AAG/C,UAAM,YAAY,KAAK,MAAM,OAAO,IAAI;AACxC,QAAI,iBAAiB,WAAW,MAAM,KAAK,gBAAiB,QAAO;AAAA,EACrE;AAGA,SAAO,aAAa,MAAM,IAAI,MAAM,YAAY;AAClD;","names":[]}

package/dist/chunk-OQXOYHIV.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/form/Input/Input.tsx"],"sourcesContent":["import CircularProgress from '@mui/material/CircularProgress/index.js';\nimport InputAdornment from '@mui/material/InputAdornment/index.js';\nimport { styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { TextFieldSlim } from './text-field-slim';\n\nimport {\n  filledStyles,\n  floatingLabelStyles,\n  glowStyles,\n  inputBaseStyles,\n  muiVariantFor,\n  outlinedStyles,\n  pulseStyles,\n  SIZE_MAP,\n} from './Input.styles';\nimport type { InputProps } from './Input.types';\n\n/**\n * `TextFieldSlim`, not `TextField` — see `text-field-slim.tsx`. MUI's own\n * `TextField` imports `Select` unconditionally, and through it `Menu`,\n * `Popover`, `Modal` and seven more component modules, so every screen with one\n * text box shipped a dropdown it can never render. Same composition, same DOM,\n * same prop routing; the select branch is the only thing missing.\n */\nconst StyledTextField = styled(TextFieldSlim, {\n  shouldForwardProp: (prop) =>\n    !['customVariant', 'floating', 'glow', 'pulse', 'loading'].includes(prop as string),\n})<{\n  customVariant?: InputProps['variant'];\n  floating?: boolean;\n  glow?: boolean;\n  pulse?: boolean;\n  loading?: boolean;\n}>(({ theme, customVariant, floating, glow, pulse, loading }) => ({\n  position: 'relative',\n  opacity: loading ? 0.7 : 1,\n\n  ...(glow ? glowStyles(theme) : {}),\n  ...(pulse ? pulseStyles(theme) : {}),\n  ...(floating ? floatingLabelStyles(theme) : {}),\n\n  '& .MuiInputBase-root': {\n    transition: 'all 0.3s ease',\n    ...inputBaseStyles(theme, customVariant),\n  },\n\n  '& .MuiOutlinedInput-root': outlinedStyles(theme),\n  '& .MuiFilledInput-root': filledStyles(theme),\n}));\n\n/** Only one adornment shows at a time: the spinner replaces the caller's while loading. */\nconst EndAdornment: React.FC<{ loading: boolean; endAdornment?: React.ReactNode }> = ({\n  loading,\n  endAdornment,\n}) => {\n  if (loading) {\n    return (\n      <InputAdornment position=\"end\">\n        <CircularProgress size={20} />\n      </InputAdornment>\n    );\n  }\n\n  if (!endAdornment) return null;\n\n  return <InputAdornment position=\"end\">{endAdornment}</InputAdornment>;\n};\n\n/** While loading the field is inert: no clicks, and disabled to assistive tech. */\nconst interactionProps = (\n  loading: boolean,\n  onClick: InputProps['onClick'],\n  disabled?: boolean,\n) => ({\n  disabled: loading || disabled,\n  onClick: loading ? undefined : onClick,\n});\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      variant = 'outlined',\n      size = 'md',\n      label,\n      error,\n      helperText,\n      startAdornment,\n      endAdornment,\n      fullWidth = true,\n      floating = false,\n      glow = false,\n      pulse = false,\n      loading = false,\n      onClick,\n      onFocus,\n      onBlur,\n      'data-testid': dataTestId,\n      'aria-label': ariaLabel,\n      ...props\n    },\n    ref,\n  ) => (\n    <StyledTextField\n      ref={ref}\n      variant={muiVariantFor(variant)}\n      customVariant={variant}\n      floating={floating}\n      glow={glow}\n      pulse={pulse}\n      loading={loading}\n      label={label}\n      error={error}\n      helperText={helperText}\n      fullWidth={fullWidth}\n      {...interactionProps(loading, onClick, props.disabled)}\n      onFocus={onFocus}\n      onBlur={onBlur}\n      /*\n       * `aria-label` has to ride `inputProps` to reach the `<input>` (FUT-755).\n       * Spread with the rest it lands on the FormControl DIV that the text\n       * field renders as its root, which carries no role — so the field kept\n       * no accessible name, and a source grep saying \"this input is labelled\"\n       * disagreed with the DOM. The reports search box and the block-title\n       * inputs were both named in source and anonymous to a screen reader.\n       */\n      inputProps={{\n        'data-testid': dataTestId,\n        ...(ariaLabel === undefined ? {} : { 'aria-label': ariaLabel }),\n      }}\n      InputProps={{\n        startAdornment: startAdornment && (\n          <InputAdornment position=\"start\">{startAdornment}</InputAdornment>\n        ),\n        endAdornment: <EndAdornment loading={loading} endAdornment={endAdornment} />,\n      }}\n      {...SIZE_MAP[size]}\n      {...props}\n    />\n  ),\n);\n\nInput.displayName = 'Input';\n"],"mappings":";;;;;;;;;;;;;;;AAAA,OAAO,sBAAsB;AAC7B,OAAO,oBAAoB;AAC3B,SAAS,cAAc;AACvB,OAAO,WAAW;AAyDV;AAlCR,IAAM,kBAAkB,OAAO,eAAe;AAAA,EAC5C,mBAAmB,CAAC,SAClB,CAAC,CAAC,iBAAiB,YAAY,QAAQ,SAAS,SAAS,EAAE,SAAS,IAAc;AACtF,CAAC,EAME,CAAC,EAAE,OAAO,eAAe,UAAU,MAAM,OAAO,QAAQ,OAAO;AAAA,EAChE,UAAU;AAAA,EACV,SAAS,UAAU,MAAM;AAAA,EAEzB,GAAI,OAAO,WAAW,KAAK,IAAI,CAAC;AAAA,EAChC,GAAI,QAAQ,YAAY,KAAK,IAAI,CAAC;AAAA,EAClC,GAAI,WAAW,oBAAoB,KAAK,IAAI,CAAC;AAAA,EAE7C,wBAAwB;AAAA,IACtB,YAAY;AAAA,IACZ,GAAG,gBAAgB,OAAO,aAAa;AAAA,EACzC;AAAA,EAEA,4BAA4B,eAAe,KAAK;AAAA,EAChD,0BAA0B,aAAa,KAAK;AAC9C,EAAE;AAGF,IAAM,eAA+E,CAAC;AAAA,EACpF;AAAA,EACA;AACF,MAAM;AACJ,MAAI,SAAS;AACX,WACE,oBAAC,kBAAe,UAAS,OACvB,8BAAC,oBAAiB,MAAM,IAAI,GAC9B;AAAA,EAEJ;AAEA,MAAI,CAAC,aAAc,QAAO;AAE1B,SAAO,oBAAC,kBAAe,UAAS,OAAO,wBAAa;AACtD;AAGA,IAAM,mBAAmB,CACvB,SACA,SACA,cACI;AAAA,EACJ,UAAU,WAAW;AAAA,EACrB,SAAS,UAAU,SAAY;AACjC;AAEO,IAAM,QAAQ,MAAM;AAAA,EACzB,CACE;AAAA,IACE,UAAU;AAAA,IACV,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,cAAc;AAAA,IACd,GAAG;AAAA,EACL,GACA,QAEA;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,SAAS,cAAc,OAAO;AAAA,MAC9B,eAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG,iBAAiB,SAAS,SAAS,MAAM,QAAQ;AAAA,MACrD;AAAA,MACA;AAAA,MASA,YAAY;AAAA,QACV,eAAe;AAAA,QACf,GAAI,cAAc,SAAY,CAAC,IAAI,EAAE,cAAc,UAAU;AAAA,MAC/D;AAAA,MACA,YAAY;AAAA,QACV,gBAAgB,kBACd,oBAAC,kBAAe,UAAS,SAAS,0BAAe;AAAA,QAEnD,cAAc,oBAAC,gBAAa,SAAkB,cAA4B;AAAA,MAC5E;AAAA,MACC,GAAG,SAAS,IAAI;AAAA,MAChB,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,MAAM,cAAc;","names":[]}

package/dist/chunk-Q5EQC7NL.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/form/Switch/Switch.parts.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport FormHelperText from '@mui/material/FormHelperText/index.js';\nimport MuiSwitch from '@mui/material/Switch/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { switchSx } from './Switch.styles';\nimport type { SwitchFlags } from './Switch.styles';\nimport type { SwitchProps } from './Switch.types';\n\nconst StyledSwitch = styled(MuiSwitch, {\n  shouldForwardProp: (prop) =>\n    ![\n      'customVariant',\n      'customColor',\n      'customSize',\n      'glow',\n      'glass',\n      'gradient',\n      'trackWidth',\n      'trackHeight',\n      'onText',\n      'offText',\n      'loading',\n      'ripple',\n      'pulse',\n    ].includes(prop as string),\n})<SwitchFlags>(({ theme, ...flags }) => ({ ...switchSx(theme, flags) }));\n\n/**\n * A top or bottom label stacks and aligns to the start; start/end sit the label\n * beside the control and centre it.\n */\nconst StyledLabelContainer = styled(Box, {\n  shouldForwardProp: (prop) => !['labelPosition', 'error'].includes(prop as string),\n})<{ labelPosition?: string; error?: boolean }>(({ theme, labelPosition, error }) => {\n  const stacked = labelPosition === 'top' || labelPosition === 'bottom';\n\n  return {\n    display: 'flex',\n    alignItems: stacked ? 'flex-start' : 'center',\n    flexDirection:\n      labelPosition === 'top' ? 'column' : labelPosition === 'bottom' ? 'column-reverse' : 'row',\n    gap: theme.spacing(stacked ? 1 : 2),\n    width: '100%',\n    ...(error && { '& .MuiTypography-root': { color: theme.palette.error.main } }),\n  };\n});\n\n/**\n * A plain wrapper over the styled row. Exporting the styled component itself\n * needs a @mui/system reference tsc calls unportable (TS2742).\n */\nexport const LabelContainer: React.FC<{\n  labelPosition?: string;\n  error?: boolean;\n  children: React.ReactNode;\n}> = ({ labelPosition, error, children }) => (\n  <StyledLabelContainer labelPosition={labelPosition} error={error}>\n    {children}\n  </StyledLabelContainer>\n);\n\nconst ICON_SIZES: Record<string, number> = { xs: 12, sm: 14, md: 16, lg: 18, xl: 20 };\n\nexport interface SwitchIconProps {\n  icon: React.ReactNode;\n  /** True when this icon is the one the current state should show. */\n  shown: boolean;\n  animated: boolean;\n  size: string;\n  side: 'on' | 'off';\n}\n\n/**\n * One of the two icons overlaid on the track. The on icon slides to the left\n * edge when checked and the off icon to the right when unchecked; they are\n * mirror images, so they share this component rather than being written twice.\n */\nexport const SwitchIcon: React.FC<SwitchIconProps> = ({ icon, shown, animated, size, side }) => {\n  const isOn = side === 'on';\n  const translate = isOn ? 'translate(-50%, -50%)' : 'translate(50%, -50%)';\n\n  return (\n    <Box\n      sx={{\n        position: 'absolute',\n        top: '50%',\n        ...(isOn ? { left: shown ? 4 : '50%' } : { right: shown ? 4 : '50%' }),\n        transition: 'all 0.3s cubic-bezier(0.4, 0, 0.2, 1)',\n        opacity: shown ? 1 : 0,\n        transform: `${translate} scale(${shown && animated ? 1 : 0.8})`,\n        pointerEvents: 'none',\n        zIndex: 2,\n        color: isOn ? '#fff' : 'text.secondary',\n        fontSize: ICON_SIZES[size] ?? ICON_SIZES.md,\n      }}\n    >\n      {icon}\n    </Box>\n  );\n};\n\nexport interface SwitchControlProps extends SwitchFlags {\n  checked?: boolean;\n  onChange?: SwitchProps['onChange'];\n  onIcon?: React.ReactNode;\n  offIcon?: React.ReactNode;\n  animated: boolean;\n  size: string;\n  dataTestId?: string;\n  switchRef?: React.Ref<HTMLButtonElement>;\n  rest: Record<string, unknown>;\n}\n\n/** The control itself: the track, and the two icons that may sit over it. */\nexport const SwitchControl: React.FC<SwitchControlProps> = ({\n  checked,\n  onChange,\n  onIcon,\n  offIcon,\n  animated,\n  size,\n  dataTestId,\n  switchRef,\n  rest,\n  ...flags\n}) => {\n  const props = rest as Record<string, unknown> & {\n    disabled?: boolean;\n    inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n  };\n\n  return (\n    <Box sx={{ position: 'relative', display: 'inline-flex' }}>\n      <StyledSwitch\n        ref={switchRef}\n        {...flags}\n        checked={checked}\n        onChange={onChange}\n        disabled={Boolean(flags.loading) || props.disabled}\n        inputProps={\n          {\n            'aria-label': props['aria-label'],\n            'aria-describedby': props['aria-describedby'],\n            ...props.inputProps,\n            'data-testid': dataTestId || 'switch',\n          } as React.InputHTMLAttributes<HTMLInputElement>\n        }\n        {...props}\n      />\n\n      {onIcon && (\n        <SwitchIcon\n          icon={onIcon}\n          shown={Boolean(checked)}\n          animated={animated}\n          size={size}\n          side=\"on\"\n        />\n      )}\n      {offIcon && (\n        <SwitchIcon\n          icon={offIcon}\n          shown={!checked}\n          animated={animated}\n          size={size}\n          side=\"off\"\n        />\n      )}\n    </Box>\n  );\n};\n\nexport const SwitchHelper: React.FC<{\n  helperText?: React.ReactNode;\n  error?: boolean;\n  dataTestId?: string;\n}> = ({ helperText, error, dataTestId }) =>\n  helperText ? (\n    <FormHelperText\n      error={error}\n      sx={{ mt: 1 }}\n      data-testid={dataTestId ? `${dataTestId}-helper` : 'switch-helper'}\n    >\n      {helperText}\n    </FormHelperText>\n  ) : null;\n\nexport const SwitchLabel: React.FC<{\n  label: React.ReactNode;\n  description?: React.ReactNode;\n  error?: boolean;\n  dataTestId?: string;\n}> = ({ label, description, error, dataTestId }) => (\n  <Box sx={{ flex: 1 }}>\n    <Typography\n      variant=\"body2\"\n      fontWeight={500}\n      color={error ? 'error.main' : 'text.primary'}\n      data-testid={dataTestId ? `${dataTestId}-label` : 'switch-label'}\n    >\n      {label}\n    </Typography>\n    {description && (\n      <Typography\n        variant=\"caption\"\n        color={error ? 'error.main' : 'text.secondary'}\n        sx={{ display: 'block', mt: 0.5 }}\n      >\n        {description}\n      </Typography>\n    )}\n  </Box>\n);\n"],"mappings":"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","names":[]}

package/dist/chunk-QLWBQQW7.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/platform/test-id.ts"],"sourcesContent":["/**\n * One test id, three spellings.\n *\n * The web components take `dataTestId` and forward it as `data-testid`; the\n * existing test stories pass `'data-testid'` straight through as an unknown\n * prop; React Native calls the same thing `testID`, and react-native-web turns\n * THAT back into `data-testid`. A native component that honoured only one of\n * the three would pass its own unit tests and fail the shared stories.\n */\nexport interface TestIdProps {\n  testID?: string;\n  dataTestId?: string;\n  'data-testid'?: string;\n}\n\n/** The id the caller asked for under any of the three names, else `fallback`. */\nexport function resolveTestId(props: TestIdProps, fallback?: string): string | undefined {\n  return props.testID ?? props.dataTestId ?? props['data-testid'] ?? fallback;\n}\n\n/** `${id}-${suffix}` for a sub-element, or `${fallback}-${suffix}` when unnamed. */\nexport function childTestId(\n  props: TestIdProps,\n  suffix: string,\n  fallback: string,\n): string {\n  return `${resolveTestId(props, fallback) ?? fallback}-${suffix}`;\n}\n\n/** `props` without any of the three spellings, for spreading onto a native element. */\nexport function withoutTestIdProps<P extends TestIdProps>(props: P): Omit<P, keyof TestIdProps> {\n  const { testID: _testID, dataTestId: _dataTestId, 'data-testid': _dataTestid, ...rest } = props;\n  return rest;\n}\n"],"mappings":";AAgBO,SAAS,cAAc,OAAoB,UAAuC;AACvF,SAAO,MAAM,UAAU,MAAM,cAAc,MAAM,aAAa,KAAK;AACrE;AAGO,SAAS,YACd,OACA,QACA,UACQ;AACR,SAAO,GAAG,cAAc,OAAO,QAAQ,KAAK,QAAQ,IAAI,MAAM;AAChE;AAGO,SAAS,mBAA0C,OAAsC;AAC9F,QAAM,EAAE,QAAQ,SAAS,YAAY,aAAa,eAAe,aAAa,GAAG,KAAK,IAAI;AAC1F,SAAO;AACT;","names":[]}

package/dist/chunk-RMSH2I3O.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/form/Input/Input.styles.ts"],"sourcesContent":["import { alpha, keyframes } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nimport type { InputProps } from './Input.types';\n\nimport { fieldEdge } from '../../../tokens/field-edge';\n\ntype InputVariant = NonNullable<InputProps['variant']>;\n\n// Define pulse animation\nconst pulseAnimation = keyframes`\n  0% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 1;\n  }\n  70% {\n    box-shadow: 0 0 0 10px currentColor;\n    opacity: 0;\n  }\n  100% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 0;\n  }\n`;\n\n/** Our four variants map onto MUI's three; `glass` and `gradient` restyle an outline. */\nexport const muiVariantFor = (variant: InputVariant): 'outlined' | 'filled' | 'standard' => {\n  switch (variant) {\n    case 'underline':\n      return 'standard';\n    case 'glass':\n    case 'gradient':\n      return 'outlined';\n    default:\n      return variant as 'outlined' | 'filled' | 'standard';\n  }\n};\n\n// MUI gives a text field two heights, so the five house stops are drawn as two\n// plus padding: `xs` tightens below small, `lg`/`xl` open up above medium.\nexport const SIZE_MAP = {\n  xs: { size: 'small' as const, sx: { '& .MuiInputBase-input': { padding: '6px 10px' } } },\n  sm: { size: 'small' as const },\n  md: { size: 'medium' as const },\n  lg: { size: 'medium' as const, sx: { '& .MuiInputBase-input': { padding: '16px 14px' } } },\n  xl: { size: 'medium' as const, sx: { '& .MuiInputBase-input': { padding: '20px 16px' } } },\n};\n\nexport const glowStyles = (theme: Theme): CSSObject => ({\n  '& .MuiInputBase-root': {\n    boxShadow: `0 0 15px ${alpha(theme.palette.primary.main, 0.3)}`,\n    '&.Mui-focused': {\n      boxShadow: `0 0 20px ${alpha(theme.palette.primary.main, 0.5)}`,\n    },\n  },\n});\n\n// A bar behind the field rather than a border on it, so it can pulse outward\n// without the input resizing.\nexport const pulseStyles = (theme: Theme): CSSObject => ({\n  '&::after': {\n    content: '\"\"',\n    position: 'absolute',\n    top: '50%',\n    left: '0',\n    right: '0',\n    height: '56px',\n    transform: 'translateY(-50%)',\n    borderRadius: theme.spacing(0.5),\n    backgroundColor: theme.palette.primary.main,\n    opacity: 0.3,\n    animation: `${pulseAnimation} 2s infinite`,\n    pointerEvents: 'none',\n    zIndex: -1,\n  },\n});\n\nexport const floatingLabelStyles = (theme: Theme): CSSObject => ({\n  '& .MuiInputLabel-root': {\n    transform: 'translate(14px, 16px) scale(1)',\n    '&.MuiInputLabel-shrink': {\n      transform: 'translate(14px, -9px) scale(0.75)',\n      backgroundColor: theme.palette.background.paper,\n      padding: '0 4px',\n    },\n  },\n});\n\nexport const inputBaseStyles = (theme: Theme, variant?: InputVariant): CSSObject => {\n  switch (variant) {\n    case 'glass':\n      return {\n        backgroundColor: alpha(theme.palette.background.paper, 0.1),\n        backdropFilter: 'blur(20px)',\n        border: `1px solid ${fieldEdge(theme)}`,\n        '&:hover': {\n          backgroundColor: alpha(theme.palette.background.paper, 0.15),\n          borderColor: alpha(theme.palette.primary.main, 0.3),\n        },\n        '&.Mui-focused': {\n          backgroundColor: alpha(theme.palette.background.paper, 0.2),\n          borderColor: theme.palette.primary.main,\n          boxShadow: `0 0 0 2px ${alpha(theme.palette.primary.main, 0.1)}`,\n        },\n      };\n    case 'underline':\n      return {\n        '&:before': {\n          borderBottomColor: fieldEdge(theme),\n        },\n        '&:hover:not(.Mui-disabled):before': {\n          borderBottomColor: theme.palette.primary.main,\n        },\n        '&:after': {\n          borderBottomColor: theme.palette.primary.main,\n        },\n      };\n    case 'gradient':\n      return gradientStyles(theme);\n    default:\n      return {};\n  }\n};\n\n// The border is a gradient painted behind the field and masked to a 2px ring,\n// since CSS cannot put a gradient on `border-color` directly.\nconst gradientStyles = (theme: Theme): CSSObject => ({\n  background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.1)}, ${alpha(theme.palette.secondary.main, 0.1)})`,\n  border: `2px solid transparent`,\n  backgroundOrigin: 'border-box',\n  backgroundClip: 'padding-box, border-box',\n  position: 'relative',\n  '&::before': {\n    content: '\"\"',\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n    borderRadius: 'inherit',\n    background: `linear-gradient(135deg, ${theme.palette.primary.main}, ${theme.palette.secondary.main})`,\n    mask: 'linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0)',\n    maskComposite: 'exclude',\n    padding: '2px',\n    zIndex: -1,\n  },\n  '&:hover': {\n    background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.15)}, ${alpha(theme.palette.secondary.main, 0.15)})`,\n  },\n  '&.Mui-focused': {\n    background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.2)}, ${alpha(theme.palette.secondary.main, 0.2)})`,\n    '&::before': {\n      background: `linear-gradient(135deg, ${theme.palette.primary.dark}, ${theme.palette.secondary.dark})`,\n    },\n  },\n});\n\nexport const outlinedStyles = (theme: Theme): CSSObject => ({\n  '& fieldset': {\n    borderColor: fieldEdge(theme),\n  },\n  '&:hover fieldset': {\n    borderColor: theme.palette.primary.main,\n  },\n  '&.Mui-focused fieldset': {\n    borderColor: theme.palette.primary.main,\n    borderWidth: 2,\n  },\n  '&.Mui-error fieldset': {\n    borderColor: theme.palette.error.main,\n  },\n});\n\nexport const filledStyles = (theme: Theme): CSSObject => ({\n  backgroundColor: alpha(theme.palette.action.hover, 0.04),\n  '&:hover': {\n    backgroundColor: alpha(theme.palette.action.hover, 0.08),\n  },\n  '&.Mui-focused': {\n    backgroundColor: alpha(theme.palette.action.hover, 0.12),\n  },\n});\n"],"mappings":"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","names":[]}