@12-apps/ui 6.19.1 → 6.21.0

package/dist/types-native/components/layout/Skeleton/Skeleton.native.d.ts

@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { type DimensionValue, type ViewStyle } from 'react-native';
+import type { SkeletonIntensity, SkeletonProps, SkeletonVariant } from './Skeleton.types.native';
+import type { UiTheme } from '../../../tokens/theme';
+/**
+ * A width or a height, as React Native accepts one. The web takes any CSS
+ * length; here a number is dp and a percentage is a percentage — anything else
+ * (`10rem`, `calc(...)`) has no equivalent and sizes the box from its content,
+ * which `NATIVE-NOTES.md` records.
+ */
+export declare function dimension(value: number | string | undefined): DimensionValue | undefined;
+/** The tint the web writes: the body ink at the intensity's alpha, white in dark mode. */
+export declare const skeletonTint: (theme: UiTheme, intensity: SkeletonIntensity) => string;
+/**
+ * The `text` variant's height. MUI gives it a `1.2em` line box and squashes the
+ * whole box to 60%; React Native's transforms do not change layout, so the two
+ * are multiplied out into the height the web actually shows.
+ */
+export declare function textBoxHeight(theme: UiTheme, height: number | string | undefined): DimensionValue | undefined;
+interface SkeletonBoxStyleArgs {
+    variant: SkeletonVariant;
+    intensity: SkeletonIntensity;
+    width?: number | string;
+    height?: number | string;
+    borderRadius?: number | string;
+    glassmorphism: boolean;
+    /** A box with a wash sliding over it clips, as MUI's `wave` and the shimmer do. */
+    clipped: boolean;
+}
+/** The box the web paints, in absolute numbers. */
+export declare function skeletonBoxStyle(theme: UiTheme, a: SkeletonBoxStyleArgs): ViewStyle;
+/**
+ * The native `Skeleton`: the same box, the same tint and the same default
+ * dimensions the MUI half draws, on a `View`.
+ */
+export declare const Skeleton: React.FC<SkeletonProps>;
+export {};
+//# sourceMappingURL=Skeleton.native.d.ts.map

package/dist/types-native/components/layout/Skeleton/Skeleton.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/Skeleton/Skeleton.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAKL,KAAK,cAAc,EAGnB,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAkBtB,OAAO,KAAK,EAEV,iBAAiB,EACjB,aAAa,EACb,eAAe,EAChB,MAAM,yBAAyB,CAAC;AAKjC,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAMrD;;;;;GAKG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,cAAc,GAAG,SAAS,CAGxF;AAED,0FAA0F;AAC1F,eAAO,MAAM,YAAY,GAAI,OAAO,OAAO,EAAE,WAAW,iBAAiB,KAAG,MAIzE,CAAC;AAQJ;;;;GAIG;AACH,wBAAgB,aAAa,CAC3B,KAAK,EAAE,OAAO,EACd,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,GAClC,cAAc,GAAG,SAAS,CAI5B;AAiBD,UAAU,oBAAoB;IAC5B,OAAO,EAAE,eAAe,CAAC;IACzB,SAAS,EAAE,iBAAiB,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,aAAa,EAAE,OAAO,CAAC;IACvB,mFAAmF;IACnF,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,mDAAmD;AACnD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,OAAO,EAAE,CAAC,EAAE,oBAAoB,GAAG,SAAS,CAWnF;AAmGD;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA6C3C,CAAC"}

package/dist/types-native/components/layout/Skeleton/Skeleton.types.native.d.ts

@@ -0,0 +1,8 @@
+import type { StyleProp, ViewProps, ViewStyle } from 'react-native';
+import type { SkeletonBaseProps } from './Skeleton.base';
+export type { SkeletonAnimation, SkeletonBaseProps, SkeletonIntensity, SkeletonVariant, } from './Skeleton.base';
+/** The native `Skeleton`: the shared contract, plus a `View`'s own props. */
+export type SkeletonProps = SkeletonBaseProps & Omit<ViewProps, keyof SkeletonBaseProps | 'style'> & {
+    style?: StyleProp<ViewStyle>;
+};
+//# sourceMappingURL=Skeleton.types.native.d.ts.map

package/dist/types-native/components/layout/Skeleton/Skeleton.types.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.types.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/Skeleton/Skeleton.types.native.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAEzD,YAAY,EACV,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,GAChB,MAAM,iBAAiB,CAAC;AAEzB,6EAA6E;AAC7E,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAC3C,IAAI,CAAC,SAAS,EAAE,MAAM,iBAAiB,GAAG,OAAO,CAAC,GAAG;IACnD,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC"}

package/dist/types-native/components/layout/Skeleton/index.native.d.ts

@@ -0,0 +1,3 @@
+export { Skeleton } from './Skeleton.native';
+export type { SkeletonAnimation, SkeletonBaseProps, SkeletonIntensity, SkeletonProps, SkeletonVariant, } from './Skeleton.types.native';
+//# sourceMappingURL=index.native.d.ts.map

package/dist/types-native/components/layout/Skeleton/index.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/Skeleton/index.native.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,YAAY,EACV,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,aAAa,EACb,eAAe,GAChB,MAAM,yBAAyB,CAAC"}

package/dist/types-native/icons/paths.generated.d.ts

@@ -3,9 +3,14 @@ export declare const ICON_PATHS: {
     readonly Add: readonly ["M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"];
     readonly ArrowBack: readonly ["M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20z"];
     readonly ArrowDownward: readonly ["m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z"];
+    readonly ArrowDropDown: readonly ["m7 10 5 5 5-5z"];
     readonly ArrowForward: readonly ["m12 4-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"];
     readonly ArrowUpward: readonly ["m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z"];
+    readonly BrokenImage: readonly ["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"];
+    readonly Cancel: readonly ["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"];
     readonly Check: readonly ["M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"];
+    readonly CheckBox: readonly ["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"];
+    readonly CheckBoxOutlineBlank: readonly ["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"];
     readonly CheckCircle: readonly ["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"];
     readonly ChevronLeft: readonly ["M15.41 7.41 14 6l-6 6 6 6 1.41-1.41L10.83 12z"];
     readonly ChevronRight: readonly ["M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"];
@@ -18,6 +23,7 @@ export declare const ICON_PATHS: {
     readonly ExpandLess: readonly ["m12 8-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z"];
     readonly ExpandMore: readonly ["M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"];
     readonly FilterList: readonly ["M10 18h4v-2h-4zM3 6v2h18V6zm3 7h12v-2H6z"];
+    readonly IndeterminateCheckBox: readonly ["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"];
     readonly Info: readonly ["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"];
     readonly InfoOutlined: readonly ["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"];
     readonly KeyboardArrowDown: readonly ["M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z"];

package/dist/types-native/icons/paths.generated.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"paths.generated.d.ts","sourceRoot":"","sources":["../../../src/icons/paths.generated.ts"],"names":[],"mappings":"AAOA,mDAAmD;AACnD,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsCb,CAAC;AAEX,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,UAAU,CAAC;AAE/C,eAAO,MAAM,UAAU,EAA8B,SAAS,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"paths.generated.d.ts","sourceRoot":"","sources":["../../../src/icons/paths.generated.ts"],"names":[],"mappings":"AAOA,mDAAmD;AACnD,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4Cb,CAAC;AAEX,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,UAAU,CAAC;AAE/C,eAAO,MAAM,UAAU,EAA8B,SAAS,QAAQ,EAAE,CAAC"}

package/dist/types-native/platform/animation.d.ts

@@ -0,0 +1,14 @@
+import { Animated } from 'react-native';
+export interface LoopOptions {
+    durationMs: number;
+    /** The CSS animation's delay, run once before the first lap. */
+    delayMs?: number;
+    easing?: (value: number) => number;
+    /**
+     * Layout properties (`left`, `width`, `height`) cannot be driven natively;
+     * `opacity` and `transform` can. Defaults to native everywhere but the web.
+     */
+    useNativeDriver?: boolean;
+}
+export declare function useLoopedProgress(enabled: boolean, options: LoopOptions): Animated.Value;
+//# sourceMappingURL=animation.d.ts.map

package/dist/types-native/platform/animation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"animation.d.ts","sourceRoot":"","sources":["../../../src/platform/animation.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAoB,MAAM,cAAc,CAAC;AAiB1D,MAAM,WAAW,WAAW;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACnC;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,GAAG,QAAQ,CAAC,KAAK,CAsBxF"}

package/dist/types-native/platform/aria.d.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';
 }
 /**
  * `attrs` as something JSX can spread onto a react-native element without
@@ -26,4 +40,48 @@ export interface WebAria {
  * Neither name exists on a device, so nothing is lost there.
  */
 export declare function webAria(attrs: WebAria): object;
+/**
+ * `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 declare function webDisabled(disabled: boolean): object;
+/**
+ * `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 declare function webClick<E>(handler: ((event: E) => void) | undefined): object;
+/**
+ * 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 declare function webRole(role: string): object;
+/** 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 declare function webKeyDown(handler: (event: WebKeyEvent) => void): object;
 //# sourceMappingURL=aria.d.ts.map

package/dist/types-native/platform/aria.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"aria.d.ts","sourceRoot":"","sources":["../../../src/platform/aria.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,MAAM,WAAW,OAAO;IACtB,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACrC,aAAa,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,CAG9C"}
+{"version":3,"file":"aria.d.ts","sourceRoot":"","sources":["../../../src/platform/aria.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,MAAM,WAAW,OAAO;IACtB,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACrC,aAAa,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;;;OAKG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;CAC1D;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,CAG9C;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,WAAW,CAAC,QAAQ,EAAE,OAAO,GAAG,MAAM,CAErD;AAED;;;;;;;;GAQG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC,GAAG,SAAS,GAAG,MAAM,CAE7E;AAED;;;;;;;GAOG;AACH,wBAAgB,OAAO,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAE5C;AAED,+EAA+E;AAC/E,MAAM,WAAW,WAAW;IAC1B,GAAG,EAAE,MAAM,CAAC;CACb;AAED;;;;;;;GAOG;AACH,wBAAgB,UAAU,CAAC,OAAO,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,GAAG,MAAM,CAExE"}

package/dist/types-native/platform/test-id.d.ts

@@ -14,6 +14,16 @@ export interface TestIdProps {
 }
 /** The id the caller asked for under any of the three names, else `fallback`. */
 export declare function resolveTestId(props: TestIdProps, fallback?: string): string | undefined;
+/**
+ * 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 declare function splitTestId<T extends TestIdProps>(props: T, fallback?: string): {
+    testId: string | undefined;
+    rest: Omit<T, keyof TestIdProps>;
+};
 /** `${id}-${suffix}` for a sub-element, or `${fallback}-${suffix}` when unnamed. */
 export declare function childTestId(props: TestIdProps, suffix: string, fallback: string): string;
 /** `props` without any of the three spellings, for spreading onto a native element. */

package/dist/types-native/platform/test-id.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"test-id.d.ts","sourceRoot":"","sources":["../../../src/platform/test-id.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,MAAM,WAAW,WAAW;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,iFAAiF;AACjF,wBAAgB,aAAa,CAAC,KAAK,EAAE,WAAW,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAEvF;AAED,oFAAoF;AACpF,wBAAgB,WAAW,CACzB,KAAK,EAAE,WAAW,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,MAAM,GACf,MAAM,CAER;AAED,uFAAuF;AACvF,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,WAAW,EAAE,KAAK,EAAE,CAAC,GAAG,IAAI,CAAC,CAAC,EAAE,MAAM,WAAW,CAAC,CAG9F"}
+{"version":3,"file":"test-id.d.ts","sourceRoot":"","sources":["../../../src/platform/test-id.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,MAAM,WAAW,WAAW;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,iFAAiF;AACjF,wBAAgB,aAAa,CAAC,KAAK,EAAE,WAAW,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAEvF;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,CAAC,SAAS,WAAW,EAC/C,KAAK,EAAE,CAAC,EACR,QAAQ,CAAC,EAAE,MAAM,GAChB;IAAE,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAAC,IAAI,EAAE,IAAI,CAAC,CAAC,EAAE,MAAM,WAAW,CAAC,CAAA;CAAE,CAElE;AAED,oFAAoF;AACpF,wBAAgB,WAAW,CACzB,KAAK,EAAE,WAAW,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,MAAM,GACf,MAAM,CAER;AAED,uFAAuF;AACvF,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,WAAW,EAAE,KAAK,EAAE,CAAC,GAAG,IAAI,CAAC,CAAC,EAAE,MAAM,WAAW,CAAC,CAG9F"}

package/dist/types-native/platform/web-keys.d.ts

@@ -0,0 +1,25 @@
+/**
+ * KEY EVENTS REACT NATIVE DOES NOT DECLARE.
+ *
+ * There is no `onKeyDown` on React Native's `ViewProps` or `PressableProps`,
+ * because there is no keyboard behind a `View` on a device. react-native-web
+ * DOES forward one to the DOM, and a component that stands in for a native
+ * control — a chip that removes on Delete, a listbox option that activates on
+ * Space — carries those conventions as part of its contract on the web.
+ *
+ * `webKeyDown` spreads the handler onto a react-native element without that
+ * element's props type having to know it, the way `./aria.ts` does for the
+ * `aria-*` attributes React Native leaves out. On a device it is simply never
+ * called, which is the honest outcome: the gesture is the input there.
+ *
+ * The event is typed structurally rather than as a DOM `KeyboardEvent`, because
+ * the native type program is checked WITHOUT the DOM lib.
+ */
+export interface WebKeyEvent {
+    key: string;
+    preventDefault: () => void;
+}
+export type WebKeyHandler = (event: WebKeyEvent) => void;
+/** `{ onKeyDown }` as something JSX can spread onto a react-native element. */
+export declare function webKeyDown(handler: WebKeyHandler | undefined): object;
+//# sourceMappingURL=web-keys.d.ts.map

package/dist/types-native/platform/web-keys.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"web-keys.d.ts","sourceRoot":"","sources":["../../../src/platform/web-keys.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,WAAW,WAAW;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,cAAc,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,MAAM,MAAM,aAAa,GAAG,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;AAEzD,+EAA+E;AAC/E,wBAAgB,UAAU,CAAC,OAAO,EAAE,aAAa,GAAG,SAAS,GAAG,MAAM,CAErE"}

package/dist/types-native/tokens/field-edge.core.d.ts

@@ -0,0 +1,27 @@
+/**
+ * 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 declare const MIN_UI_CONTRAST = 3;
+/**
+ * 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 declare function resolveFieldEdge(divider: string, surface: string): string;
+//# sourceMappingURL=field-edge.core.d.ts.map

package/dist/types-native/tokens/field-edge.core.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-edge.core.d.ts","sourceRoot":"","sources":["../../../src/tokens/field-edge.core.ts"],"names":[],"mappings":"AAUA;;;;;;;;;;;;;;GAcG;AAEH;;;GAGG;AACH,eAAO,MAAM,eAAe,IAAI,CAAC;AAiCjC;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAkBzE"}

package/dist/types-native/tokens/mui-type.d.ts

@@ -14,7 +14,7 @@ import type { UiTheme } from './theme';
  * halves and not these; each component that reads this records that as a
  * known gap in its `NATIVE-NOTES.md`.
  */
-export type MuiTypeVariantName = 'h6' | 'body1' | 'body2';
+export type MuiTypeVariantName = 'h6' | 'body1' | 'body2' | 'caption';
 export interface MuiTypeVariant {
     fontSize: number;
     lineHeight: number;

package/dist/types-native/tokens/mui-type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mui-type.d.ts","sourceRoot":"","sources":["../../../src/tokens/mui-type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAEvC;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,kBAAkB,GAAG,IAAI,GAAG,OAAO,GAAG,OAAO,CAAC;AAE1D,MAAM,WAAW,cAAc;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,GAAG,GAAG,GAAG,CAAC;IACtB,eAAe,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,QAAQ,EAAE,MAAM,CAAC,kBAAkB,EAAE,cAAc,CAI/D,CAAC;AAEF,yFAAyF;AACzF,eAAO,MAAM,sBAAsB,MAAM,CAAC;AAE1C,mGAAmG;AACnG,MAAM,WAAW,YAAY;IAC3B,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,GAAG,cAAc,CAAC,YAAY,CAAC,EAAE,CAAC;IAC9C,aAAa,EAAE,MAAM,CAAC;CACvB;AAED;;;;;GAKG;AACH,wBAAgB,YAAY,CAC1B,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,YAAY,CAAC,EAClC,OAAO,EAAE,kBAAkB,EAC3B,QAAQ,GAAE,MAAmC,GAC5C,YAAY,CASd"}
+{"version":3,"file":"mui-type.d.ts","sourceRoot":"","sources":["../../../src/tokens/mui-type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAEvC;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,kBAAkB,GAAG,IAAI,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,CAAC;AAEtE,MAAM,WAAW,cAAc;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,GAAG,GAAG,GAAG,CAAC;IACtB,eAAe,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,QAAQ,EAAE,MAAM,CAAC,kBAAkB,EAAE,cAAc,CAK/D,CAAC;AAEF,yFAAyF;AACzF,eAAO,MAAM,sBAAsB,MAAM,CAAC;AAE1C,mGAAmG;AACnG,MAAM,WAAW,YAAY;IAC3B,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,GAAG,cAAc,CAAC,YAAY,CAAC,EAAE,CAAC;IAC9C,aAAa,EAAE,MAAM,CAAC;CACvB;AAED;;;;;GAKG;AACH,wBAAgB,YAAY,CAC1B,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,YAAY,CAAC,EAClC,OAAO,EAAE,kBAAkB,EAC3B,QAAQ,GAAE,MAAmC,GAC5C,YAAY,CASd"}

package/dist/types-native/utils/withDefaults.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Fills in the defaults for props the caller left `undefined`.
+ *
+ * A table plus one loop, rather than a `= default` per destructured prop. Each
+ * of those defaults is a branch, and a component with fifteen of them is over
+ * the cyclomatic bar before it renders anything.
+ *
+ * Only `undefined` is replaced, so an explicit `prop={undefined}` still falls
+ * back to the default exactly as a destructuring default would, while an
+ * explicit `null`, `0`, `''` or `false` is preserved as the caller's choice.
+ */
+export declare function withDefaults<T extends object>(props: T, defaults: Partial<T>): T;
+//# sourceMappingURL=withDefaults.d.ts.map

package/dist/types-native/utils/withDefaults.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"withDefaults.d.ts","sourceRoot":"","sources":["../../../src/utils/withDefaults.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,wBAAgB,YAAY,CAAC,CAAC,SAAS,MAAM,EAAE,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAQhF"}

package/dist/typography/Heading.js

@@ -1,10 +1,10 @@
 import "../chunk-6GP2DOOO.js";
 import {
   Heading
-} from "../chunk-Z7JNCB5Q.js";
+} from "../chunk-426FTCMF.js";
 import "../chunk-PWR7K5OP.js";
 import "../chunk-3N6EK6K5.js";
-import "../chunk-QLWBQQW7.js";
+import "../chunk-6F5IKY32.js";
 import "../chunk-PT6TCWIW.js";
 import "../chunk-NQN5Z36J.js";
 import "../chunk-AG66JBNH.js";

package/dist/typography/Paragraph.js

@@ -1,8 +1,8 @@
 import {
   Paragraph
-} from "../chunk-V3SBJ3PB.js";
+} from "../chunk-Z5ABJLTM.js";
 import "../chunk-QKLGH3RZ.js";
-import "../chunk-QLWBQQW7.js";
+import "../chunk-6F5IKY32.js";
 import "../chunk-NQN5Z36J.js";
 import "../chunk-AG66JBNH.js";
 import "../chunk-6JAIFIPW.js";

package/dist/typography/Text.js

@@ -1,9 +1,9 @@
 import "../chunk-VUHLNYAE.js";
 import {
   Text
-} from "../chunk-2PCOC3PT.js";
+} from "../chunk-26Z7QWID.js";
 import "../chunk-V3PLFYKO.js";
-import "../chunk-QLWBQQW7.js";
+import "../chunk-6F5IKY32.js";
 import "../chunk-NQN5Z36J.js";
 import "../chunk-AG66JBNH.js";
 import "../chunk-6JAIFIPW.js";

package/dist/user-avatar.js

@@ -1,10 +1,12 @@
 import {
   UserAvatar,
   UserMenu
-} from "./chunk-HKZHEK3Z.js";
+} from "./chunk-SAHQLXNN.js";
 import "./chunk-UDQSIRAP.js";
-import "./chunk-QIV73V2X.js";
-import "./chunk-LYNJJV2X.js";
+import "./chunk-I7HYGIEJ.js";
+import "./chunk-4SQFO4GW.js";
+import "./chunk-FAITHWIO.js";
+import "./chunk-3ZVUNSFF.js";
 import "./chunk-XRMZMBE3.js";
 import "./chunk-VUHLNYAE.js";
 import "./chunk-2GSIEDGN.js";
@@ -12,13 +14,13 @@ import "./chunk-D2IASECY.js";
 import "./chunk-VMF3UXM4.js";
 import "./chunk-RI5JZLZL.js";
 import "./chunk-BA4RHQ3B.js";
-import "./chunk-SL4NFGOL.js";
+import "./chunk-BNNSO4MC.js";
 import "./chunk-TAMIZE4Q.js";
 import "./chunk-JT6TERQL.js";
 import "./chunk-ITGG5OKP.js";
-import "./chunk-2PCOC3PT.js";
+import "./chunk-26Z7QWID.js";
 import "./chunk-V3PLFYKO.js";
-import "./chunk-QLWBQQW7.js";
+import "./chunk-6F5IKY32.js";
 import "./chunk-NQN5Z36J.js";
 import "./chunk-AG66JBNH.js";
 import "./chunk-6JAIFIPW.js";

package/dist/utility/InfiniteScroll.js

@@ -1,9 +1,9 @@
 import "../chunk-H7NA4TXY.js";
 import {
   InfiniteScroll
-} from "../chunk-GSFNH4C5.js";
-import "../chunk-ATSHKSSD.js";
+} from "../chunk-WROCSDVL.js";
 import "../chunk-QF6LTUCE.js";
+import "../chunk-ATSHKSSD.js";
 import "../chunk-PZ5AY32C.js";
 export {
   InfiniteScroll

package/dist/utility/InstallPrompt.js

@@ -1,7 +1,8 @@
 import "../chunk-3QQVEYOR.js";
 import {
   InstallPrompt
-} from "../chunk-JE6RZ5L6.js";
+} from "../chunk-5ZOJLYD2.js";
+import "../chunk-GY62N32G.js";
 import {
   usePwaInstall
 } from "../chunk-5GMHJ7Y5.js";
@@ -13,7 +14,6 @@ import {
   readPwaInstallStash,
   resetPwaInstallStash
 } from "../chunk-UUL44SUX.js";
-import "../chunk-GY62N32G.js";
 import "../chunk-PZ5AY32C.js";
 export {
   InstallPrompt,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@12-apps/ui",
-  "version": "6.19.1",
+  "version": "6.21.0",
   "license": "MIT",
   "packageManager": "pnpm@10.34.5",
   "type": "module",
@@ -149,10 +149,18 @@
       "default": "./dist/data-display/AlertDialog.js"
     },
     "./data-display/Avatar": {
+      "react-native": {
+        "types": "./dist/types-native/components/data-display/Avatar/index.native.d.ts",
+        "default": "./dist/native/data-display/Avatar.js"
+      },
       "types": "./dist/types/components/data-display/Avatar/index.d.ts",
       "default": "./dist/data-display/Avatar.js"
     },
     "./data-display/Badge": {
+      "react-native": {
+        "types": "./dist/types-native/components/data-display/Badge/index.native.d.ts",
+        "default": "./dist/native/data-display/Badge.js"
+      },
       "types": "./dist/types/components/data-display/Badge/index.d.ts",
       "default": "./dist/data-display/Badge.js"
     },
@@ -169,6 +177,10 @@
       "default": "./dist/data-display/Chart.js"
     },
     "./data-display/Chip": {
+      "react-native": {
+        "types": "./dist/types-native/components/data-display/Chip/index.native.d.ts",
+        "default": "./dist/native/data-display/Chip.js"
+      },
       "types": "./dist/types/components/data-display/Chip/index.d.ts",
       "default": "./dist/data-display/Chip.js"
     },
@@ -225,6 +237,10 @@
       "default": "./dist/data-display/Popover.js"
     },
     "./data-display/Progress": {
+      "react-native": {
+        "types": "./dist/types-native/components/data-display/Progress/index.native.d.ts",
+        "default": "./dist/native/data-display/Progress.js"
+      },
       "types": "./dist/types/components/data-display/Progress/index.d.ts",
       "default": "./dist/data-display/Progress.js"
     },
@@ -329,6 +345,10 @@
       "default": "./dist/form/CepField.js"
     },
     "./form/Checkbox": {
+      "react-native": {
+        "types": "./dist/types-native/components/form/Checkbox/index.native.d.ts",
+        "default": "./dist/native/form/Checkbox.js"
+      },
       "types": "./dist/types/components/form/Checkbox/index.d.ts",
       "default": "./dist/form/Checkbox.js"
     },
@@ -365,6 +385,10 @@
       "default": "./dist/form/total-form.js"
     },
     "./form/Input": {
+      "react-native": {
+        "types": "./dist/types-native/components/form/Input/index.native.d.ts",
+        "default": "./dist/native/form/Input.js"
+      },
       "types": "./dist/types/components/form/Input/index.d.ts",
       "default": "./dist/form/Input.js"
     },
@@ -401,6 +425,10 @@
       "default": "./dist/form/SearchPalette.js"
     },
     "./form/Select": {
+      "react-native": {
+        "types": "./dist/types-native/components/form/Select/index.native.d.ts",
+        "default": "./dist/native/form/Select.js"
+      },
       "types": "./dist/types/components/form/Select/index.d.ts",
       "default": "./dist/form/Select.js"
     },
@@ -409,6 +437,10 @@
       "default": "./dist/form/Slider.js"
     },
     "./form/Switch": {
+      "react-native": {
+        "types": "./dist/types-native/components/form/Switch/index.native.d.ts",
+        "default": "./dist/native/form/Switch.js"
+      },
       "types": "./dist/types/components/form/Switch/index.d.ts",
       "default": "./dist/form/Switch.js"
     },
@@ -493,6 +525,10 @@
       "default": "./dist/layout/Sidebar.js"
     },
     "./layout/Skeleton": {
+      "react-native": {
+        "types": "./dist/types-native/components/layout/Skeleton/index.native.d.ts",
+        "default": "./dist/native/layout/Skeleton.js"
+      },
       "types": "./dist/types/components/layout/Skeleton/index.d.ts",
       "default": "./dist/layout/Skeleton.js"
     },

package/src/components/data-display/Avatar/Avatar.base.ts

@@ -0,0 +1,108 @@
+import type React from 'react';
+
+import type { ColorValue, SizeValue } from '../../../tokens/vocabulary';
+
+/**
+ * THE CONTRACT BOTH RENDERERS HONOUR — and nothing else.
+ *
+ * This file imports no MUI and no react-native, on purpose: it is in BOTH
+ * declaration outputs (`dist/types` and `dist/types-native`), and a native
+ * consumer has no `@mui/material` to resolve a type import against.
+ */
+
+/**
+ * The house scale, EXTENDED by one stop rather than replacing it.
+ *
+ * `xxl` is real — an avatar is the one component with a portrait size above the
+ * scale's top — so it is added to `SizeValue` instead of the union being
+ * rewritten by hand. Spelling all six out again is how the copy drifts.
+ */
+export type AvatarSize = SizeValue | 'xxl';
+export type AvatarVariant = 'circle' | 'square' | 'rounded' | 'status';
+export type AvatarStatus = 'online' | 'offline' | 'away' | 'busy';
+
+/** Which of the four content sources won, and therefore which slot id it takes. */
+export type ContentType = 'children' | 'fallback' | 'icon' | 'default';
+
+export interface AvatarBaseProps {
+  /**
+   * The variant of the avatar
+   */
+  variant?: AvatarVariant;
+
+  /**
+   * The size of the avatar
+   */
+  size?: AvatarSize;
+
+  /**
+   * Whether the avatar should have a glow effect
+   */
+  glow?: boolean;
+
+  /**
+   * Whether the avatar should have a pulse animation
+   */
+  pulse?: boolean;
+
+  /**
+   * Status indicator (only applies when variant is 'status')
+   */
+  status?: AvatarStatus;
+
+  /**
+   * Fallback text when no src is provided (typically initials)
+   */
+  fallback?: string;
+
+  /**
+   * Custom icon to display
+   */
+  icon?: React.ReactNode;
+
+  /**
+   * Whether to show a border around the avatar
+   */
+  bordered?: boolean;
+
+  /**
+   * Color of the avatar background when no image is provided
+   */
+  color?: ColorValue;
+
+  /**
+   * Whether the avatar is in a loading state
+   */
+  loading?: boolean;
+
+  /**
+   * Whether the avatar should be interactive (show hover effects)
+   */
+  interactive?: boolean;
+
+  /**
+   * Whether to show fallback content on image error
+   */
+  showFallbackOnError?: boolean;
+
+  /**
+   * Animation delay in milliseconds
+   */
+  animationDelay?: number;
+
+  /** The portrait itself. */
+  src?: string;
+
+  /** The portrait's description, and the avatar's accessible name. */
+  alt?: string;
+
+  children?: React.ReactNode;
+
+  /**
+   * Test ID for automated testing
+   */
+  dataTestId?: string;
+
+  /** React Native's spelling of {@link AvatarBaseProps.dataTestId}. */
+  testID?: string;
+}