@12-apps/ui 6.18.0 → 6.19.0

package/dist/types-native/components/typography/Heading/Heading.metrics.d.ts

@@ -0,0 +1,52 @@
+import type { HeadingWeight } from './Heading.base';
+import { type HeadingLevel } from '../../../tokens/heading-scale';
+import { type UiTheme } from '../../../tokens/theme';
+import type { ColorValue } from '../../../tokens/vocabulary';
+/**
+ * THE NUMBERS BOTH `Heading` RENDERERS DRAW WITH.
+ *
+ * The type scale itself is `HEADING_SCALE` in `tokens/heading-scale.ts` (the
+ * web reads it through the MUI theme's `headingScale` overrides, native
+ * through `UiTheme.typography.heading`). What lives here is everything ELSE
+ * `Heading.styles.ts` used to declare inline: the weight table, the defaults,
+ * the rank each level announces, and the gradient's angle and stops.
+ */
+export declare const HEADING_WEIGHTS: Record<HeadingWeight, number>;
+export declare const HEADING_DEFAULT_LEVEL: HeadingLevel;
+export declare const HEADING_DEFAULT_WEIGHT: HeadingWeight;
+export declare const HEADING_DEFAULT_COLOR: ColorValue;
+export type HeadingRank = 1 | 2 | 3 | 4 | 5 | 6;
+/**
+ * The outline rank each level announces — the tag on the web, `aria-level` on
+ * native. `display` is a SIZE, not a rank, so it is an h1: the document still
+ * gets one level-one heading rather than an unnamed tag outside the outline.
+ */
+export declare const HEADING_RANK: Record<HeadingLevel, HeadingRank>;
+/** A step name the scale actually has, or the documented default (`h2`). */
+export declare const stepOf: (value: string | undefined) => HeadingLevel;
+/**
+ * The weight a heading draws: `normal` is the weight the step was designed to
+ * carry (heavier as the step gets larger), anything else its table entry, and
+ * a name outside the vocabulary the default — as `Heading.styles.ts` has
+ * always fallen back.
+ */
+export declare function headingWeight(weight: string, normalWeight: number): number;
+/** The gradient runs corner to corner. */
+export declare const HEADING_GRADIENT_ANGLE = 135;
+/**
+ * `neutral` has no light/dark pair, so its gradient runs between two steps of
+ * the grey ramp.
+ */
+export declare const NEUTRAL_GRADIENT_STEPS: {
+    readonly from: 500;
+    readonly to: 900;
+};
+/** The CSS the web paints the glyphs with, from the two stops. */
+export declare const headingGradient: (from: string, to: string) => string;
+/**
+ * The two stops each colour paints its glyphs with, read off a `UiTheme`. The
+ * web's `Heading.styles.ts` keeps its MUI-typed twin of this table; the pairs
+ * are the same, and `Heading.native.test.tsx` asserts as much.
+ */
+export declare function headingGradientStops(theme: UiTheme, color: ColorValue): [string, string];
+//# sourceMappingURL=Heading.metrics.d.ts.map

package/dist/types-native/components/typography/Heading/Heading.metrics.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Heading.metrics.d.ts","sourceRoot":"","sources":["../../../../../src/components/typography/Heading/Heading.metrics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACpD,OAAO,EAAiB,KAAK,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACjF,OAAO,EAAgB,KAAK,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACnE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAE7D;;;;;;;;GAQG;AACH,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,aAAa,EAAE,MAAM,CAAgB,CAAC;AAE3E,eAAO,MAAM,qBAAqB,EAAE,YAAmB,CAAC;AACxD,eAAO,MAAM,sBAAsB,EAAE,aAAsB,CAAC;AAC5D,eAAO,MAAM,qBAAqB,EAAE,UAAsB,CAAC;AAE3D,MAAM,MAAM,WAAW,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEhD;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,YAAY,EAAE,WAAW,CAQ1D,CAAC;AAEF,4EAA4E;AAC5E,eAAO,MAAM,MAAM,GAAI,OAAO,MAAM,GAAG,SAAS,KAAG,YAC8C,CAAC;AAIlG;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,GAAG,MAAM,CAG1E;AAED,0CAA0C;AAC1C,eAAO,MAAM,sBAAsB,MAAM,CAAC;AAE1C;;;GAGG;AACH,eAAO,MAAM,sBAAsB;;;CAAkC,CAAC;AAEtE,kEAAkE;AAClE,eAAO,MAAM,eAAe,GAAI,MAAM,MAAM,EAAE,IAAI,MAAM,KAAG,MACc,CAAC;AAE1E;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAWxF"}

package/dist/types-native/components/typography/Heading/Heading.native.d.ts

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import { Text as RNText, type GestureResponderEvent, type TextStyle } from 'react-native';
+import type { HeadingWeight } from './Heading.base';
+import type { HeadingLevel } from '../../../tokens/heading-scale';
+import type { UiTheme } from '../../../tokens/theme';
+import type { ColorValue } from '../../../tokens/vocabulary';
+export interface HeadingStyleArgs {
+    /** The step to DRAW — `size ?? level`, already resolved to a name the scale has. */
+    size: HeadingLevel;
+    color: ColorValue;
+    weight: HeadingWeight;
+    gradient: boolean;
+}
+/**
+ * The style the web `headingSx` computes, in absolute numbers. The step comes
+ * from the theme's heading scale (`HEADING_SCALE` unless the host built its
+ * own), and its `lineHeight` ratio and `letterSpacing` em are multiplied out
+ * because React Native has neither unit.
+ *
+ * `gradient` is the one honest gap: React Native has no `background-clip:
+ * text` and no gradient fill in core, so the glyphs take the gradient's first
+ * stop as a flat colour — the same choice the native `Button` makes.
+ */
+export declare function headingStyle(theme: UiTheme, a: HeadingStyleArgs): TextStyle;
+export declare const Heading: React.ForwardRefExoticComponent<import("./Heading.base").HeadingBaseProps & Omit<import("react-native").TextProps, "style" | "onPress" | keyof import("./Heading.base").HeadingBaseProps> & {
+    onClick?: (event: GestureResponderEvent) => void;
+    onPress?: (event: GestureResponderEvent) => void;
+    style?: import("react-native").StyleProp<TextStyle>;
+} & React.RefAttributes<RNText>>;
+//# sourceMappingURL=Heading.native.d.ts.map

package/dist/types-native/components/typography/Heading/Heading.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Heading.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/typography/Heading/Heading.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,IAAI,MAAM,EAAE,KAAK,qBAAqB,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAE1F,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAapD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAM7D,MAAM,WAAW,gBAAgB;IAC/B,oFAAoF;IACpF,IAAI,EAAE,YAAY,CAAC;IACnB,KAAK,EAAE,UAAU,CAAC;IAClB,MAAM,EAAE,aAAa,CAAC;IACtB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,OAAO,EAAE,CAAC,EAAE,gBAAgB,GAAG,SAAS,CAU3E;AAED,eAAO,MAAM,OAAO;;;;gCAgDnB,CAAC"}

package/dist/types-native/components/typography/Heading/Heading.types.native.d.ts

@@ -0,0 +1,14 @@
+import type { GestureResponderEvent, StyleProp, TextProps as RNTextProps, TextStyle } from 'react-native';
+import type { HeadingBaseProps } from './Heading.base';
+export type { HeadingBaseProps, HeadingLevel, HeadingWeight } from './Heading.base';
+/**
+ * The native `Heading`: the shared contract, plus a react-native `Text`'s own
+ * props. `onClick` keeps its web name and `onPress` is accepted too, as on
+ * `Button`; both fire.
+ */
+export type HeadingProps = HeadingBaseProps & Omit<RNTextProps, keyof HeadingBaseProps | 'style' | 'onPress'> & {
+    onClick?: (event: GestureResponderEvent) => void;
+    onPress?: (event: GestureResponderEvent) => void;
+    style?: StyleProp<TextStyle>;
+};
+//# sourceMappingURL=Heading.types.native.d.ts.map

package/dist/types-native/components/typography/Heading/Heading.types.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Heading.types.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/typography/Heading/Heading.types.native.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,SAAS,IAAI,WAAW,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE1G,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEvD,YAAY,EAAE,gBAAgB,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAEpF;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,gBAAgB,GACzC,IAAI,CAAC,WAAW,EAAE,MAAM,gBAAgB,GAAG,OAAO,GAAG,SAAS,CAAC,GAAG;IAChE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjD,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC"}

package/dist/types-native/components/typography/Heading/index.native.d.ts

@@ -0,0 +1,3 @@
+export { Heading, headingStyle } from './Heading.native';
+export type { HeadingBaseProps, HeadingLevel, HeadingProps, HeadingWeight } from './Heading.types.native';
+//# sourceMappingURL=index.native.d.ts.map

package/dist/types-native/components/typography/Heading/index.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/typography/Heading/index.native.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AACzD,YAAY,EAAE,gBAAgB,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/types-native/components/typography/Paragraph/Paragraph.base.d.ts

@@ -0,0 +1,23 @@
+import type React from 'react';
+import type { ColorValue, SizeValue } from '../../../tokens/vocabulary';
+/**
+ * THE CONTRACT BOTH `Paragraph` RENDERERS HONOUR — and nothing else.
+ *
+ * No MUI and no react-native here, on purpose: this file ships 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 web
+ * adds a `<p>`'s attributes in `Paragraph.types.ts`; the native side adds a
+ * react-native `Text`'s props in `Paragraph.types.native.ts`.
+ */
+export type ParagraphVariant = 'default' | 'lead' | 'muted' | 'small';
+export interface ParagraphBaseProps {
+    /** `lead` is larger and looser, `muted` faded, `small` a step down — all at the default size. */
+    variant?: ParagraphVariant;
+    /** Ignored by `muted` and `small`, which always paint the secondary ink. */
+    color?: ColorValue;
+    size?: SizeValue;
+    children: React.ReactNode;
+    testID?: string;
+    dataTestId?: string;
+}
+//# sourceMappingURL=Paragraph.base.d.ts.map

package/dist/types-native/components/typography/Paragraph/Paragraph.base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Paragraph.base.d.ts","sourceRoot":"","sources":["../../../../../src/components/typography/Paragraph/Paragraph.base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAExE;;;;;;;;GAQG;AACH,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,CAAC;AAEtE,MAAM,WAAW,kBAAkB;IACjC,iGAAiG;IACjG,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,4EAA4E;IAC5E,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB"}

package/dist/types-native/components/typography/Paragraph/Paragraph.metrics.d.ts

@@ -0,0 +1,30 @@
+import type { UiTypeStep } from '../../../tokens/theme';
+import type { SizeValue } from '../../../tokens/vocabulary';
+/**
+ * THE NUMBERS BOTH `Paragraph` RENDERERS DRAW WITH.
+ *
+ * `Paragraph.tsx` used to hold these as rem strings inside its styled
+ * callback, and `Paragraph.native.tsx` would have held them again as numbers.
+ * Now there is one table, in px, and the web derives its rem from it (`px()`
+ * in the theme). Ratios and `em` values stay relative; the native side
+ * multiplies them out because React Native's `lineHeight`, `letterSpacing` and
+ * margins are absolute.
+ *
+ * NOT `TYPE_SIZES`: a paragraph is set looser than `Text`'s body scale (1.6
+ * against 1.5 at `md`), because it is read in runs of lines rather than as a
+ * label. The font sizes are the same five steps.
+ */
+export declare const PARAGRAPH_SIZES: Record<SizeValue, UiTypeStep>;
+export declare const PARAGRAPH_FONT_WEIGHT = 400;
+/** `margin: 0 0 1em 0` — one line of its own type below each paragraph. */
+export declare const PARAGRAPH_MARGIN_BOTTOM_EM = 1;
+/** The `lead` variant: a step up at the default size, looser leading and tracking. */
+export declare const LEAD_FONT_SIZE = 18;
+export declare const LEAD_LINE_HEIGHT = 1.7;
+export declare const LEAD_LETTER_SPACING_EM = 0.01;
+/** The `muted` variant: the secondary ink, faded further. */
+export declare const MUTED_OPACITY = 0.8;
+/** The `small` variant: a step down at the default size, on the secondary ink. */
+export declare const SMALL_FONT_SIZE = 14;
+export declare const SMALL_LINE_HEIGHT = 1.5;
+//# sourceMappingURL=Paragraph.metrics.d.ts.map

package/dist/types-native/components/typography/Paragraph/Paragraph.metrics.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Paragraph.metrics.d.ts","sourceRoot":"","sources":["../../../../../src/components/typography/Paragraph/Paragraph.metrics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE5D;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,SAAS,EAAE,UAAU,CAMzD,CAAC;AAEF,eAAO,MAAM,qBAAqB,MAAM,CAAC;AAEzC,2EAA2E;AAC3E,eAAO,MAAM,0BAA0B,IAAI,CAAC;AAE5C,sFAAsF;AACtF,eAAO,MAAM,cAAc,KAAK,CAAC;AACjC,eAAO,MAAM,gBAAgB,MAAM,CAAC;AACpC,eAAO,MAAM,sBAAsB,OAAO,CAAC;AAE3C,6DAA6D;AAC7D,eAAO,MAAM,aAAa,MAAM,CAAC;AAEjC,kFAAkF;AAClF,eAAO,MAAM,eAAe,KAAK,CAAC;AAClC,eAAO,MAAM,iBAAiB,MAAM,CAAC"}

package/dist/types-native/components/typography/Paragraph/Paragraph.native.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { Text as RNText, type GestureResponderEvent, type TextStyle } from 'react-native';
+import type { ParagraphVariant } from './Paragraph.types.native';
+import type { UiTheme } from '../../../tokens/theme';
+import type { ColorValue, SizeValue } from '../../../tokens/vocabulary';
+export interface ParagraphStyleArgs {
+    variant: ParagraphVariant;
+    color: ColorValue;
+    size: SizeValue;
+}
+/**
+ * The style the web `Paragraph` computes, in absolute numbers. `lineHeight`,
+ * `letterSpacing` and the `1em` bottom margin are multiplied out here because
+ * React Native has no ratio or `em` unit — the web keeps them relative and the
+ * browser does this step.
+ */
+export declare function paragraphStyle(theme: UiTheme, a: ParagraphStyleArgs): TextStyle;
+export declare const Paragraph: React.ForwardRefExoticComponent<import("./Paragraph.base").ParagraphBaseProps & Omit<import("react-native").TextProps, "style" | "onPress" | keyof import("./Paragraph.base").ParagraphBaseProps> & {
+    onClick?: (event: GestureResponderEvent) => void;
+    onPress?: (event: GestureResponderEvent) => void;
+    style?: import("react-native").StyleProp<TextStyle>;
+} & React.RefAttributes<RNText>>;
+//# sourceMappingURL=Paragraph.native.d.ts.map

package/dist/types-native/components/typography/Paragraph/Paragraph.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Paragraph.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/typography/Paragraph/Paragraph.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,IAAI,MAAM,EAAE,KAAK,qBAAqB,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAa1F,OAAO,KAAK,EAAkB,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAGjF,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAaxE,MAAM,WAAW,kBAAkB;IACjC,OAAO,EAAE,gBAAgB,CAAC;IAC1B,KAAK,EAAE,UAAU,CAAC;IAClB,IAAI,EAAE,SAAS,CAAC;CACjB;AAED;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,OAAO,EAAE,CAAC,EAAE,kBAAkB,GAAG,SAAS,CAiC/E;AAED,eAAO,MAAM,SAAS;;;;gCAmBrB,CAAC"}

package/dist/types-native/components/typography/Paragraph/Paragraph.types.native.d.ts

@@ -0,0 +1,14 @@
+import type { GestureResponderEvent, StyleProp, TextProps as RNTextProps, TextStyle } from 'react-native';
+import type { ParagraphBaseProps } from './Paragraph.base';
+export type { ParagraphBaseProps, ParagraphVariant } from './Paragraph.base';
+/**
+ * The native `Paragraph`: the shared contract, plus a react-native `Text`'s
+ * own props. `onClick` keeps its web name and `onPress` is accepted too, as on
+ * `Button`; both fire.
+ */
+export type ParagraphProps = ParagraphBaseProps & Omit<RNTextProps, keyof ParagraphBaseProps | 'style' | 'onPress'> & {
+    onClick?: (event: GestureResponderEvent) => void;
+    onPress?: (event: GestureResponderEvent) => void;
+    style?: StyleProp<TextStyle>;
+};
+//# sourceMappingURL=Paragraph.types.native.d.ts.map

package/dist/types-native/components/typography/Paragraph/Paragraph.types.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Paragraph.types.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/typography/Paragraph/Paragraph.types.native.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,SAAS,IAAI,WAAW,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE1G,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAE3D,YAAY,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAE7E;;;;GAIG;AACH,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,IAAI,CAAC,WAAW,EAAE,MAAM,kBAAkB,GAAG,OAAO,GAAG,SAAS,CAAC,GAAG;IAClE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjD,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC"}

package/dist/types-native/components/typography/Paragraph/index.native.d.ts

@@ -0,0 +1,3 @@
+export { Paragraph, paragraphStyle } from './Paragraph.native';
+export type { ParagraphBaseProps, ParagraphProps, ParagraphVariant } from './Paragraph.types.native';
+//# sourceMappingURL=index.native.d.ts.map

package/dist/types-native/components/typography/Paragraph/index.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../../../src/components/typography/Paragraph/index.native.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAC/D,YAAY,EAAE,kBAAkB,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC"}

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

@@ -0,0 +1,29 @@
+/**
+ * ARIA 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.
+ * react-native-web forwards all three to the DOM — and `aria-level` also
+ * picks the heading tag, so a `role="heading"` at level 3 renders an `<h3>`
+ * exactly as the MUI half's `component="h3"` does — while a device ignores
+ * them. A native component spreads them through here rather than widening
+ * the element's props type or casting at every call site.
+ */
+export interface WebAria {
+    'aria-level'?: 1 | 2 | 3 | 4 | 5 | 6;
+    'aria-atomic'?: 'true' | 'false';
+    'aria-describedby'?: string;
+}
+/**
+ * `attrs` as something JSX can spread onto a react-native element without
+ * that element's props type having to know them.
+ *
+ * `aria-atomic` travels under react-native-web's own older name. Its
+ * `createDOMProps` (0.20.0) reads `aria-activedescendant` where it means
+ * `aria-atomic` — `_ariaAtomic = ariaAtomic != null ? ariaActiveDescendant :
+ * accessibilityAtomic` — so the modern spelling never reaches the DOM and
+ * the legacy one, still accepted and still emitted as `aria-atomic`, does.
+ * Neither name exists on a device, so nothing is lost there.
+ */
+export declare function webAria(attrs: WebAria): object;
+//# sourceMappingURL=aria.d.ts.map

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

@@ -0,0 +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"}

package/dist/types-native/platform/text-children.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import { type TextStyle } from 'react-native';
+export declare function renderTextChildren(children: React.ReactNode, style: TextStyle, 
+/** Passed to each run, for a surface that clips rather than wraps (a button label). */
+numberOfLines?: number): React.ReactNode;
+//# sourceMappingURL=text-children.d.ts.map

package/dist/types-native/platform/text-children.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-children.d.ts","sourceRoot":"","sources":["../../../src/platform/text-children.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAkB,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAoC9D,wBAAgB,kBAAkB,CAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,EACzB,KAAK,EAAE,SAAS;AAChB,uFAAuF;AACvF,aAAa,CAAC,EAAE,MAAM,GACrB,KAAK,CAAC,SAAS,CAyBjB"}

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

@@ -0,0 +1,42 @@
+import type { UiTheme } from './theme';
+/**
+ * MUI'S DEFAULT `Typography` VARIANTS, AS NUMBERS.
+ *
+ * Several web components render a title or a message BY NAME —
+ * `<Typography variant="h6">` — and let MUI's theme turn the name into a
+ * size. The native halves have no MUI theme, so they need the numbers MUI's
+ * `createTypography` produces for those names. These are those numbers, for
+ * the variants the ported components use: `fontSize` in px, `lineHeight` as
+ * a ratio, `letterSpacing` in em exactly as MUI rounds it
+ * (`round(letterSpacing / size)`, five decimals).
+ *
+ * Only the DEFAULTS. A host that re-themes `typography.h6` moves the web
+ * 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 interface MuiTypeVariant {
+    fontSize: number;
+    lineHeight: number;
+    fontWeight: 400 | 500;
+    letterSpacingEm: number;
+}
+export declare const MUI_TYPE: Record<MuiTypeVariantName, MuiTypeVariant>;
+/** MUI's `theme.typography.fontWeightMedium`, which several web styles name outright. */
+export declare const MUI_FONT_WEIGHT_MEDIUM = 500;
+/** A variant multiplied out for a renderer whose `lineHeight` and `letterSpacing` are absolute. */
+export interface MuiTypeStyle {
+    fontFamily: string | undefined;
+    fontSize: number;
+    lineHeight: number;
+    fontWeight: `${MuiTypeVariant['fontWeight']}`;
+    letterSpacing: number;
+}
+/**
+ * The variant as absolute numbers, in the theme's font. `fontSize` may be
+ * overridden — the Alert's title is `body1` at 1.05rem — and the ratios
+ * follow it, which is what the browser does with `em` and a unitless
+ * line-height.
+ */
+export declare function muiTypeStyle(theme: Pick<UiTheme, 'typography'>, variant: MuiTypeVariantName, fontSize?: number): MuiTypeStyle;
+//# sourceMappingURL=mui-type.d.ts.map

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

@@ -0,0 +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"}

package/dist/typography/Heading.js

@@ -1,9 +1,14 @@
 import "../chunk-6GP2DOOO.js";
 import {
   Heading
-} from "../chunk-NYLXHOMR.js";
-import "../chunk-CGQI4XE5.js";
+} from "../chunk-Z7JNCB5Q.js";
+import "../chunk-PWR7K5OP.js";
+import "../chunk-3N6EK6K5.js";
+import "../chunk-QLWBQQW7.js";
 import "../chunk-PT6TCWIW.js";
+import "../chunk-NQN5Z36J.js";
+import "../chunk-AG66JBNH.js";
+import "../chunk-6JAIFIPW.js";
 import "../chunk-FZXKH2ZT.js";
 import "../chunk-PZ5AY32C.js";
 export {

package/dist/typography/Paragraph.js

@@ -1,6 +1,12 @@
 import {
   Paragraph
-} from "../chunk-A2GGT4OC.js";
+} from "../chunk-V3SBJ3PB.js";
+import "../chunk-QKLGH3RZ.js";
+import "../chunk-QLWBQQW7.js";
+import "../chunk-NQN5Z36J.js";
+import "../chunk-AG66JBNH.js";
+import "../chunk-6JAIFIPW.js";
+import "../chunk-FZXKH2ZT.js";
 import "../chunk-PZ5AY32C.js";
 export {
   Paragraph

package/dist/user-avatar.js

@@ -1,7 +1,7 @@
 import {
   UserAvatar,
   UserMenu
-} from "./chunk-L5ZZJ4XE.js";
+} from "./chunk-HKZHEK3Z.js";
 import "./chunk-UDQSIRAP.js";
 import "./chunk-QIV73V2X.js";
 import "./chunk-LYNJJV2X.js";
@@ -12,10 +12,10 @@ import "./chunk-D2IASECY.js";
 import "./chunk-VMF3UXM4.js";
 import "./chunk-RI5JZLZL.js";
 import "./chunk-BA4RHQ3B.js";
-import "./chunk-24BUCMQA.js";
+import "./chunk-SL4NFGOL.js";
+import "./chunk-TAMIZE4Q.js";
 import "./chunk-JT6TERQL.js";
 import "./chunk-ITGG5OKP.js";
-import "./chunk-TAMIZE4Q.js";
 import "./chunk-2PCOC3PT.js";
 import "./chunk-V3PLFYKO.js";
 import "./chunk-QLWBQQW7.js";

package/dist/utility/InstallPrompt.js

@@ -5,7 +5,6 @@ import {
 import {
   usePwaInstall
 } from "../chunk-5GMHJ7Y5.js";
-import "../chunk-GY62N32G.js";
 import "../chunk-WXYLH3QZ.js";
 import {
   PWA_INSTALL_AVAILABLE_EVENT,
@@ -14,6 +13,7 @@ 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.18.0",
+  "version": "6.19.0",
   "license": "MIT",
   "packageManager": "pnpm@10.34.5",
   "type": "module",
@@ -137,6 +137,10 @@
       "default": "./dist/mui/ListItemText.js"
     },
     "./data-display/Alert": {
+      "react-native": {
+        "types": "./dist/types-native/components/data-display/Alert/index.native.d.ts",
+        "default": "./dist/native/data-display/Alert.js"
+      },
       "types": "./dist/types/components/data-display/Alert/index.d.ts",
       "default": "./dist/data-display/Alert.js"
     },
@@ -181,6 +185,10 @@
       "default": "./dist/data-display/DescriptionItem.js"
     },
     "./data-display/EmptyState": {
+      "react-native": {
+        "types": "./dist/types-native/components/data-display/EmptyState/index.native.d.ts",
+        "default": "./dist/native/data-display/EmptyState.js"
+      },
       "types": "./dist/types/components/data-display/EmptyState/index.d.ts",
       "default": "./dist/data-display/EmptyState.js"
     },
@@ -249,10 +257,18 @@
       "default": "./dist/data-display/AsyncStateContainer.js"
     },
     "./data-display/ErrorState": {
+      "react-native": {
+        "types": "./dist/types-native/components/data-display/ErrorState/index.native.d.ts",
+        "default": "./dist/native/data-display/ErrorState.js"
+      },
       "types": "./dist/types/components/data-display/ErrorState/index.d.ts",
       "default": "./dist/data-display/ErrorState.js"
     },
     "./data-display/LoadingState": {
+      "react-native": {
+        "types": "./dist/types-native/components/data-display/LoadingState/index.native.d.ts",
+        "default": "./dist/native/data-display/LoadingState.js"
+      },
       "types": "./dist/types/components/data-display/LoadingState/index.d.ts",
       "default": "./dist/data-display/LoadingState.js"
     },
@@ -437,6 +453,10 @@
       "default": "./dist/layout/Collapsible.js"
     },
     "./layout/Container": {
+      "react-native": {
+        "types": "./dist/types-native/components/layout/Container/index.native.d.ts",
+        "default": "./dist/native/layout/Container.js"
+      },
       "types": "./dist/types/components/layout/Container/index.d.ts",
       "default": "./dist/layout/Container.js"
     },
@@ -477,6 +497,10 @@
       "default": "./dist/layout/Skeleton.js"
     },
     "./layout/Spacer": {
+      "react-native": {
+        "types": "./dist/types-native/components/layout/Spacer/index.native.d.ts",
+        "default": "./dist/native/layout/Spacer.js"
+      },
       "types": "./dist/types/components/layout/Spacer/index.d.ts",
       "default": "./dist/layout/Spacer.js"
     },
@@ -533,10 +557,18 @@
       "default": "./dist/typography/Code.js"
     },
     "./typography/Heading": {
+      "react-native": {
+        "types": "./dist/types-native/components/typography/Heading/index.native.d.ts",
+        "default": "./dist/native/typography/Heading.js"
+      },
       "types": "./dist/types/components/typography/Heading/index.d.ts",
       "default": "./dist/typography/Heading.js"
     },
     "./typography/Paragraph": {
+      "react-native": {
+        "types": "./dist/types-native/components/typography/Paragraph/index.native.d.ts",
+        "default": "./dist/native/typography/Paragraph.js"
+      },
       "types": "./dist/types/components/typography/Paragraph/index.d.ts",
       "default": "./dist/typography/Paragraph.js"
     },

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

@@ -0,0 +1,105 @@
+import type * as React from 'react';
+
+import type { ColorValue } from '../../../tokens/vocabulary';
+
+/**
+ * THE CONTRACT BOTH RENDERERS HONOUR — and nothing else.
+ *
+ * Imports no MUI and no react-native, on purpose: it ships in both
+ * declaration outputs. The web adds MUI's `AlertProps` extras in
+ * `Alert.types.ts`; the native side adds a `View`'s own props in
+ * `Alert.types.native.ts`.
+ */
+export type AlertVariant = 'info' | 'success' | 'warning' | 'danger' | 'glass' | 'gradient';
+
+/**
+ * The dismissible half, as a UNION rather than one more optional field.
+ *
+ * `closeLabel` is the dismiss button's only accessible name — it renders a
+ * glyph and nothing else — so it must be REQUIRED wherever that button exists.
+ * But most alerts are not closable, and making it required on all of them
+ * would ask a dozen call sites across five packages to name a control they
+ * never render. A word invented to satisfy a type is worse than no word: the
+ * next reader cannot tell which button it belongs to.
+ *
+ * So the type says what is actually true — the label is required exactly when
+ * the button is.
+ */
+export type AlertDismiss =
+  | { closable?: false; onClose?: () => void; closeLabel?: never }
+  | { closable: true; onClose?: () => void; closeLabel: string };
+
+export interface AlertBaseFields {
+  /**
+   * The variant of the alert
+   */
+  variant?: AlertVariant;
+
+  /**
+   * The color of the alert (when not using variant-specific colors)
+   */
+  color?: ColorValue;
+
+  /**
+   * Whether the alert should have a glow effect
+   */
+  glow?: boolean;
+
+  /**
+   * Whether the alert should have a pulse animation
+   */
+  pulse?: boolean;
+
+  /**
+   * Custom icon to display
+   */
+  icon?: React.ReactNode;
+
+  /**
+   * Whether to show the default severity icon
+   */
+  showIcon?: boolean;
+
+  /**
+   * Title for the alert
+   */
+  title?: string;
+
+  /**
+   * Description text
+   */
+  description?: string;
+
+  /**
+   * Whether to animate the alert on mount
+   */
+  animate?: boolean;
+
+  /**
+   * ARIA role for the alert
+   */
+  role?: string;
+
+  /**
+   * ARIA live region setting
+   */
+  'aria-live'?: 'polite' | 'assertive' | 'off';
+
+  /**
+   * ARIA atomic setting
+   */
+  'aria-atomic'?: 'true' | 'false';
+
+  children?: React.ReactNode;
+
+  /**
+   * Optional data-testid for testing
+   */
+  'data-testid'?: string;
+
+  dataTestId?: string;
+
+  testID?: string;
+}
+
+export type AlertBaseProps = AlertBaseFields & AlertDismiss;