@12-apps/ui 6.78.4 → 6.80.0

package/dist/native/data-display/LoadingState.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/data-display/LoadingState/LoadingState.native.tsx","../../../src/components/data-display/LoadingState/LoadingState.metrics.ts","../../../src/components/data-display/LoadingState/LoadingState.helpers.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n  ActivityIndicator,\n  Platform,\n  StyleSheet,\n  Text as RNText,\n  View,\n  type StyleProp,\n  type TextStyle,\n  type ViewStyle,\n} from 'react-native';\n\nimport { type LoadingStateTestIds, makeTestIds, resolveLoadingStateProps } from './LoadingState.helpers';\nimport {\n  IOS_LARGE_SPINNER_FROM,\n  MESSAGE_TYPE,\n  SKELETON_FULL_ROW_WIDTH,\n  SKELETON_LAST_ROW_WIDTH,\n  SKELETON_MESSAGE_MARGIN_TOP_UNITS,\n  SKELETON_PADDING_UNITS,\n  SKELETON_RADIUS,\n  SKELETON_ROW_GAP_UNITS,\n  SKELETON_ROW_HEIGHT,\n  SKELETON_TINT_ALPHA,\n  SPINNER_GAP_UNITS,\n  SPINNER_MIN_HEIGHT,\n  SPINNER_PADDING_UNITS,\n  SPINNER_SIZES,\n} from './LoadingState.metrics';\nimport type { LoadingStateProps, LoadingStateSize } from './LoadingState.types.native';\nimport { resolveTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\nimport { alpha } from '../../../tokens/color';\nimport { muiTypeStyle } from '../../../tokens/mui-type';\nimport type { UiTheme } from '../../../tokens/theme';\n\n/** The message's type: MUI's `body2`/`body1`/`h6` per size, in the muted ink, as the web's `Typography` sets it. */\nexport function messageStyle(theme: UiTheme, size: LoadingStateSize): TextStyle {\n  return { ...muiTypeStyle(theme, MESSAGE_TYPE[size]), color: theme.palette.text.secondary };\n}\n\n/** The skeleton rows' tint: the house `Skeleton`'s `medium` intensity. */\nexport const skeletonTint = (theme: UiTheme): string =>\n  alpha(theme.palette.text.primary, SKELETON_TINT_ALPHA);\n\n/** iOS has two spinner sizes; everything else takes the px. */\nfunction spinnerSize(px: number): number | 'small' | 'large' {\n  if (Platform.OS !== 'ios') return px;\n  return px >= IOS_LARGE_SPINNER_FROM ? 'large' : 'small';\n}\n\ninterface ViewArgs {\n  message?: string;\n  size: LoadingStateSize;\n  skeletonRows: number;\n  testIds: LoadingStateTestIds;\n  style?: StyleProp<ViewStyle>;\n  rest: Omit<LoadingStateProps, keyof ViewArgs | 'variant' | 'testID' | 'dataTestId'>;\n}\n\nfunction LoadingMessage({\n  message,\n  size,\n  testIds,\n  style,\n}: Pick<ViewArgs, 'message' | 'size' | 'testIds'> & { style?: TextStyle }): React.JSX.Element | null {\n  const theme = useUiTheme();\n  if (!message) return null;\n  return (\n    <RNText style={[messageStyle(theme, size), style]} testID={testIds.named('message')}>\n      {message}\n    </RNText>\n  );\n}\n\nfunction SkeletonRows({ size, skeletonRows, testIds }: Pick<ViewArgs, 'size' | 'skeletonRows' | 'testIds'>): React.JSX.Element {\n  const theme = useUiTheme();\n  const tint = skeletonTint(theme);\n  return (\n    <View style={{ gap: theme.spacing(SKELETON_ROW_GAP_UNITS) }}>\n      {Array.from({ length: skeletonRows }, (_, index) => (\n        <View\n          key={`skeleton-row-${index}`}\n          aria-hidden\n          testID={testIds.optional(`skeleton-${index}`)}\n          style={{\n            height: SKELETON_ROW_HEIGHT[size],\n            // The last row is short, so the block reads as a paragraph of text.\n            width: index === skeletonRows - 1 ? SKELETON_LAST_ROW_WIDTH : SKELETON_FULL_ROW_WIDTH,\n            borderRadius: SKELETON_RADIUS,\n            backgroundColor: tint,\n          }}\n        />\n      ))}\n    </View>\n  );\n}\n\nfunction SkeletonView({ message, size, skeletonRows, testIds, style, rest }: ViewArgs): React.JSX.Element {\n  const theme = useUiTheme();\n  return (\n    <View\n      role=\"status\"\n      aria-busy\n      aria-label={message || 'Loading content'}\n      testID={testIds.base}\n      style={[styles.skeleton, { padding: theme.spacing(SKELETON_PADDING_UNITS) }, style]}\n      {...rest}\n    >\n      <SkeletonRows size={size} skeletonRows={skeletonRows} testIds={testIds} />\n      <LoadingMessage\n        message={message}\n        size={size}\n        testIds={testIds}\n        style={{ marginTop: theme.spacing(SKELETON_MESSAGE_MARGIN_TOP_UNITS), textAlign: 'center' }}\n      />\n    </View>\n  );\n}\n\nfunction SpinnerView({ message, size, testIds, style, rest }: ViewArgs): React.JSX.Element {\n  const theme = useUiTheme();\n  return (\n    <View\n      role=\"status\"\n      aria-busy\n      aria-label={message || 'Loading'}\n      testID={testIds.base}\n      style={[\n        styles.spinner,\n        {\n          padding: theme.spacing(SPINNER_PADDING_UNITS),\n          minHeight: SPINNER_MIN_HEIGHT,\n          gap: theme.spacing(SPINNER_GAP_UNITS),\n        },\n        style,\n      ]}\n      {...rest}\n    >\n      <ActivityIndicator\n        size={spinnerSize(SPINNER_SIZES[size])}\n        color={theme.palette.primary.main}\n        testID={testIds.named('spinner')}\n      />\n      <LoadingMessage message={message} size={size} testIds={testIds} />\n    </View>\n  );\n}\n\nexport const LoadingState: React.FC<LoadingStateProps> = React.memo(function LoadingState(rawProps) {\n  const resolved = resolveLoadingStateProps(rawProps);\n  const { variant, message, size, skeletonRows, style, ...others } = resolved;\n  const args: ViewArgs = {\n    message,\n    size,\n    skeletonRows,\n    style,\n    testIds: makeTestIds(resolveTestId(others)),\n    rest: withoutTestIdProps(others),\n  };\n\n  return variant === 'skeleton' ? <SkeletonView {...args} /> : <SpinnerView {...args} />;\n});\n\nLoadingState.displayName = 'LoadingState';\n\nconst styles = StyleSheet.create({\n  skeleton: {\n    width: '100%',\n  },\n  spinner: {\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n});\n","import type { MuiTypeVariantName } from '../../../tokens/mui-type';\nimport type { SizeValue } from '../../../tokens/vocabulary';\n\n/**\n * THE NUMBERS BOTH `LoadingState` RENDERERS DRAW WITH.\n *\n * `LoadingState.tsx` (MUI) and `LoadingState.native.tsx` (React Native) read\n * this one table. Spacing is in SPACING UNITS where the web writes\n * `theme.spacing(n)`, so a host with a different unit moves both renderers;\n * everything else is px.\n */\n\n/** MUI's `CircularProgress` diameter per size. */\nexport const SPINNER_SIZES: Record<SizeValue, number> = {\n  xs: 16,\n  sm: 24,\n  md: 40,\n  lg: 56,\n  xl: 64,\n};\n\n/** The MUI `Typography` variant the message is set in, per size. */\nexport const MESSAGE_TYPE: Record<SizeValue, MuiTypeVariantName> = {\n  xs: 'body2',\n  sm: 'body2',\n  md: 'body1',\n  lg: 'h6',\n  xl: 'h6',\n};\n\nexport const SKELETON_ROW_HEIGHT: Record<SizeValue, number> = {\n  xs: 14,\n  sm: 20,\n  md: 28,\n  lg: 36,\n  xl: 44,\n};\n\n/** The spinner view: a centred column, `theme.spacing(6)` of padding, at least 200px tall. */\nexport const SPINNER_PADDING_UNITS = 6;\nexport const SPINNER_MIN_HEIGHT = 200;\n/** Between the spinner and its message. */\nexport const SPINNER_GAP_UNITS = 2;\n\n/** The skeleton view: full width, `theme.spacing(3)` of padding. */\nexport const SKELETON_PADDING_UNITS = 3;\n/** Between rows (MUI `Stack spacing={2}`), and above the message (`mt: 2`). */\nexport const SKELETON_ROW_GAP_UNITS = 2;\nexport const SKELETON_MESSAGE_MARGIN_TOP_UNITS = 2;\nexport const SKELETON_RADIUS = 4;\n/** The last row is short, so the block reads as a paragraph of text. */\nexport const SKELETON_LAST_ROW_WIDTH = '60%';\nexport const SKELETON_FULL_ROW_WIDTH = '100%';\n/**\n * The house `Skeleton`'s `medium` intensity, which this component never\n * overrides: `alpha(text.primary, 0.13)` in light mode, `alpha(#fff, 0.13)`\n * in dark — and dark mode's `text.primary` IS `#fff`, so one expression\n * covers both.\n */\nexport const SKELETON_TINT_ALPHA = 0.13;\n\n/**\n * iOS's `ActivityIndicator` has two sizes, `small` (20pt) and `large`\n * (36pt); a diameter from this threshold up draws `large`. Android and the\n * web take the exact px.\n */\nexport const IOS_LARGE_SPINNER_FROM = 40;\n","import type { LoadingStateBaseProps, LoadingStateSize } from './LoadingState.base';\nimport { MESSAGE_TYPE, SKELETON_ROW_HEIGHT, SPINNER_SIZES } from './LoadingState.metrics';\nimport type { MuiTypeVariantName } from '../../../tokens/mui-type';\nimport { SIZE_VALUES } from '../../../tokens/vocabulary';\n\nexport { SKELETON_ROW_HEIGHT };\n\n// Derived from the shared metrics, not restated: the native `LoadingState`\n// reads the same two tables, so the renderers cannot disagree on a size.\nexport const SIZE_MAP: Record<LoadingStateSize, { spinner: number; text: MuiTypeVariantName }> =\n  Object.fromEntries(\n    SIZE_VALUES.map((size) => [size, { spinner: SPINNER_SIZES[size], text: MESSAGE_TYPE[size] }]),\n  ) as Record<LoadingStateSize, { spinner: number; text: MuiTypeVariantName }>;\n\ntype LoadingStateDefaultedKeys = 'variant' | 'size' | 'skeletonRows';\n\n/**\n * Generic over the renderer's own props: the web and the native `LoadingState`\n * pass different extras through, and both come back out untouched.\n */\ntype ResolvedLoadingStateProps<P extends LoadingStateBaseProps> = P &\n  Required<Pick<LoadingStateBaseProps, LoadingStateDefaultedKeys>>;\n\nconst LOADING_STATE_DEFAULTS: Required<Pick<LoadingStateBaseProps, LoadingStateDefaultedKeys>> = {\n  variant: 'spinner',\n  size: 'md',\n  skeletonRows: 3,\n};\n\n// Strips explicitly-undefined props before the merge, so `size={undefined}` still\n// falls back to the default exactly as a destructuring default would.\nconst definedProps = <P extends LoadingStateBaseProps>(props: P): Partial<P> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<P>;\n\nexport const resolveLoadingStateProps = <P extends LoadingStateBaseProps>(\n  props: P,\n): ResolvedLoadingStateProps<P> =>\n  ({ ...LOADING_STATE_DEFAULTS, ...definedProps(props) }) as ResolvedLoadingStateProps<P>;\n\n/**\n * Test ids come in three flavours here: the container falls back to a bare\n * `loading-state`, the labelled parts to `loading-state-<part>`, and the\n * skeleton rows to nothing at all when the caller supplied no base id.\n */\nexport const makeTestIds = (dataTestId?: string) => ({\n  base: dataTestId || 'loading-state',\n  optional: (suffix: string): string | undefined =>\n    dataTestId ? `${dataTestId}-${suffix}` : undefined,\n  named: (suffix: string): string =>\n    dataTestId ? `${dataTestId}-${suffix}` : `loading-state-${suffix}`,\n});\n\nexport type LoadingStateTestIds = ReturnType<typeof makeTestIds>;\n"],"mappings":"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","names":["LoadingState"]}
+{"version":3,"sources":["../../../src/components/data-display/LoadingState/LoadingState.native.tsx","../../../src/components/data-display/LoadingState/LoadingState.metrics.ts","../../../src/components/data-display/LoadingState/LoadingState.helpers.ts","../../../src/utils/resolve-labels.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n  ActivityIndicator,\n  Platform,\n  StyleSheet,\n  Text as RNText,\n  View,\n  type StyleProp,\n  type TextStyle,\n  type ViewStyle,\n} from 'react-native';\n\nimport { type LoadingStateTestIds, makeTestIds, resolveLoadingStateProps } from './LoadingState.helpers';\nimport {\n  IOS_LARGE_SPINNER_FROM,\n  MESSAGE_TYPE,\n  SKELETON_FULL_ROW_WIDTH,\n  SKELETON_LAST_ROW_WIDTH,\n  SKELETON_MESSAGE_MARGIN_TOP_UNITS,\n  SKELETON_PADDING_UNITS,\n  SKELETON_RADIUS,\n  SKELETON_ROW_GAP_UNITS,\n  SKELETON_ROW_HEIGHT,\n  SKELETON_TINT_ALPHA,\n  SPINNER_GAP_UNITS,\n  SPINNER_MIN_HEIGHT,\n  SPINNER_PADDING_UNITS,\n  SPINNER_SIZES,\n} from './LoadingState.metrics';\nimport type { LoadingStateProps, LoadingStateSize } from './LoadingState.types.native';\nimport type { LoadingStateLabels } from '../../../copy/labels';\nimport { EN_US_UI_LABELS } from '../../../en-US.labels';\nimport { resolveLabels } from '../../../utils/resolve-labels';\nimport { resolveTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\nimport { alpha } from '../../../tokens/color';\nimport { muiTypeStyle } from '../../../tokens/mui-type';\nimport type { UiTheme } from '../../../tokens/theme';\n\n/** The message's type: MUI's `body2`/`body1`/`h6` per size, in the muted ink, as the web's `Typography` sets it. */\nexport function messageStyle(theme: UiTheme, size: LoadingStateSize): TextStyle {\n  return { ...muiTypeStyle(theme, MESSAGE_TYPE[size]), color: theme.palette.text.secondary };\n}\n\n/** The skeleton rows' tint: the house `Skeleton`'s `medium` intensity. */\nexport const skeletonTint = (theme: UiTheme): string =>\n  alpha(theme.palette.text.primary, SKELETON_TINT_ALPHA);\n\n/** iOS has two spinner sizes; everything else takes the px. */\nfunction spinnerSize(px: number): number | 'small' | 'large' {\n  if (Platform.OS !== 'ios') return px;\n  return px >= IOS_LARGE_SPINNER_FROM ? 'large' : 'small';\n}\n\ninterface ViewArgs {\n  message?: string;\n  labels: LoadingStateLabels;\n  size: LoadingStateSize;\n  skeletonRows: number;\n  testIds: LoadingStateTestIds;\n  style?: StyleProp<ViewStyle>;\n  rest: Omit<LoadingStateProps, keyof ViewArgs | 'variant' | 'testID' | 'dataTestId'>;\n}\n\nfunction LoadingMessage({\n  message,\n  size,\n  testIds,\n  style,\n}: Pick<ViewArgs, 'message' | 'size' | 'testIds'> & { style?: TextStyle }): React.JSX.Element | null {\n  const theme = useUiTheme();\n  if (!message) return null;\n  return (\n    <RNText style={[messageStyle(theme, size), style]} testID={testIds.named('message')}>\n      {message}\n    </RNText>\n  );\n}\n\nfunction SkeletonRows({ size, skeletonRows, testIds }: Pick<ViewArgs, 'size' | 'skeletonRows' | 'testIds'>): React.JSX.Element {\n  const theme = useUiTheme();\n  const tint = skeletonTint(theme);\n  return (\n    <View style={{ gap: theme.spacing(SKELETON_ROW_GAP_UNITS) }}>\n      {Array.from({ length: skeletonRows }, (_, index) => (\n        <View\n          key={`skeleton-row-${index}`}\n          aria-hidden\n          testID={testIds.optional(`skeleton-${index}`)}\n          style={{\n            height: SKELETON_ROW_HEIGHT[size],\n            // The last row is short, so the block reads as a paragraph of text.\n            width: index === skeletonRows - 1 ? SKELETON_LAST_ROW_WIDTH : SKELETON_FULL_ROW_WIDTH,\n            borderRadius: SKELETON_RADIUS,\n            backgroundColor: tint,\n          }}\n        />\n      ))}\n    </View>\n  );\n}\n\nfunction SkeletonView({ message, labels, size, skeletonRows, testIds, style, rest }: ViewArgs): React.JSX.Element {\n  const theme = useUiTheme();\n  return (\n    <View\n      role=\"status\"\n      aria-busy\n      aria-label={message || labels.skeleton}\n      testID={testIds.base}\n      style={[styles.skeleton, { padding: theme.spacing(SKELETON_PADDING_UNITS) }, style]}\n      {...rest}\n    >\n      <SkeletonRows size={size} skeletonRows={skeletonRows} testIds={testIds} />\n      <LoadingMessage\n        message={message}\n        size={size}\n        testIds={testIds}\n        style={{ marginTop: theme.spacing(SKELETON_MESSAGE_MARGIN_TOP_UNITS), textAlign: 'center' }}\n      />\n    </View>\n  );\n}\n\nfunction SpinnerView({ message, labels, size, testIds, style, rest }: ViewArgs): React.JSX.Element {\n  const theme = useUiTheme();\n  return (\n    <View\n      role=\"status\"\n      aria-busy\n      aria-label={message || labels.spinner}\n      testID={testIds.base}\n      style={[\n        styles.spinner,\n        {\n          padding: theme.spacing(SPINNER_PADDING_UNITS),\n          minHeight: SPINNER_MIN_HEIGHT,\n          gap: theme.spacing(SPINNER_GAP_UNITS),\n        },\n        style,\n      ]}\n      {...rest}\n    >\n      <ActivityIndicator\n        size={spinnerSize(SPINNER_SIZES[size])}\n        color={theme.palette.primary.main}\n        testID={testIds.named('spinner')}\n      />\n      <LoadingMessage message={message} size={size} testIds={testIds} />\n    </View>\n  );\n}\n\nexport const LoadingState: React.FC<LoadingStateProps> = React.memo(function LoadingState(rawProps) {\n  const resolved = resolveLoadingStateProps(rawProps);\n  const { variant, message, labels, size, skeletonRows, style, ...others } = resolved;\n  const args: ViewArgs = {\n    message,\n    labels: resolveLabels(EN_US_UI_LABELS.loadingState, labels),\n    size,\n    skeletonRows,\n    style,\n    testIds: makeTestIds(resolveTestId(others)),\n    rest: withoutTestIdProps(others),\n  };\n\n  return variant === 'skeleton' ? <SkeletonView {...args} /> : <SpinnerView {...args} />;\n});\n\nLoadingState.displayName = 'LoadingState';\n\nconst styles = StyleSheet.create({\n  skeleton: {\n    width: '100%',\n  },\n  spinner: {\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n});\n","import type { MuiTypeVariantName } from '../../../tokens/mui-type';\nimport type { SizeValue } from '../../../tokens/vocabulary';\n\n/**\n * THE NUMBERS BOTH `LoadingState` RENDERERS DRAW WITH.\n *\n * `LoadingState.tsx` (MUI) and `LoadingState.native.tsx` (React Native) read\n * this one table. Spacing is in SPACING UNITS where the web writes\n * `theme.spacing(n)`, so a host with a different unit moves both renderers;\n * everything else is px.\n */\n\n/** MUI's `CircularProgress` diameter per size. */\nexport const SPINNER_SIZES: Record<SizeValue, number> = {\n  xs: 16,\n  sm: 24,\n  md: 40,\n  lg: 56,\n  xl: 64,\n};\n\n/** The MUI `Typography` variant the message is set in, per size. */\nexport const MESSAGE_TYPE: Record<SizeValue, MuiTypeVariantName> = {\n  xs: 'body2',\n  sm: 'body2',\n  md: 'body1',\n  lg: 'h6',\n  xl: 'h6',\n};\n\nexport const SKELETON_ROW_HEIGHT: Record<SizeValue, number> = {\n  xs: 14,\n  sm: 20,\n  md: 28,\n  lg: 36,\n  xl: 44,\n};\n\n/** The spinner view: a centred column, `theme.spacing(6)` of padding, at least 200px tall. */\nexport const SPINNER_PADDING_UNITS = 6;\nexport const SPINNER_MIN_HEIGHT = 200;\n/** Between the spinner and its message. */\nexport const SPINNER_GAP_UNITS = 2;\n\n/** The skeleton view: full width, `theme.spacing(3)` of padding. */\nexport const SKELETON_PADDING_UNITS = 3;\n/** Between rows (MUI `Stack spacing={2}`), and above the message (`mt: 2`). */\nexport const SKELETON_ROW_GAP_UNITS = 2;\nexport const SKELETON_MESSAGE_MARGIN_TOP_UNITS = 2;\nexport const SKELETON_RADIUS = 4;\n/** The last row is short, so the block reads as a paragraph of text. */\nexport const SKELETON_LAST_ROW_WIDTH = '60%';\nexport const SKELETON_FULL_ROW_WIDTH = '100%';\n/**\n * The house `Skeleton`'s `medium` intensity, which this component never\n * overrides: `alpha(text.primary, 0.13)` in light mode, `alpha(#fff, 0.13)`\n * in dark — and dark mode's `text.primary` IS `#fff`, so one expression\n * covers both.\n */\nexport const SKELETON_TINT_ALPHA = 0.13;\n\n/**\n * iOS's `ActivityIndicator` has two sizes, `small` (20pt) and `large`\n * (36pt); a diameter from this threshold up draws `large`. Android and the\n * web take the exact px.\n */\nexport const IOS_LARGE_SPINNER_FROM = 40;\n","import type { LoadingStateBaseProps, LoadingStateSize } from './LoadingState.base';\nimport { MESSAGE_TYPE, SKELETON_ROW_HEIGHT, SPINNER_SIZES } from './LoadingState.metrics';\nimport type { MuiTypeVariantName } from '../../../tokens/mui-type';\nimport { SIZE_VALUES } from '../../../tokens/vocabulary';\n\nexport { SKELETON_ROW_HEIGHT };\n\n// Derived from the shared metrics, not restated: the native `LoadingState`\n// reads the same two tables, so the renderers cannot disagree on a size.\nexport const SIZE_MAP: Record<LoadingStateSize, { spinner: number; text: MuiTypeVariantName }> =\n  Object.fromEntries(\n    SIZE_VALUES.map((size) => [size, { spinner: SPINNER_SIZES[size], text: MESSAGE_TYPE[size] }]),\n  ) as Record<LoadingStateSize, { spinner: number; text: MuiTypeVariantName }>;\n\ntype LoadingStateDefaultedKeys = 'variant' | 'size' | 'skeletonRows';\n\n/**\n * Generic over the renderer's own props: the web and the native `LoadingState`\n * pass different extras through, and both come back out untouched.\n */\ntype ResolvedLoadingStateProps<P extends LoadingStateBaseProps> = P &\n  Required<Pick<LoadingStateBaseProps, LoadingStateDefaultedKeys>>;\n\nconst LOADING_STATE_DEFAULTS: Required<Pick<LoadingStateBaseProps, LoadingStateDefaultedKeys>> = {\n  variant: 'spinner',\n  size: 'md',\n  skeletonRows: 3,\n};\n\n// Strips explicitly-undefined props before the merge, so `size={undefined}` still\n// falls back to the default exactly as a destructuring default would.\nconst definedProps = <P extends LoadingStateBaseProps>(props: P): Partial<P> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<P>;\n\nexport const resolveLoadingStateProps = <P extends LoadingStateBaseProps>(\n  props: P,\n): ResolvedLoadingStateProps<P> =>\n  ({ ...LOADING_STATE_DEFAULTS, ...definedProps(props) }) as ResolvedLoadingStateProps<P>;\n\n/**\n * Test ids come in three flavours here: the container falls back to a bare\n * `loading-state`, the labelled parts to `loading-state-<part>`, and the\n * skeleton rows to nothing at all when the caller supplied no base id.\n */\nexport const makeTestIds = (dataTestId?: string) => ({\n  base: dataTestId || 'loading-state',\n  optional: (suffix: string): string | undefined =>\n    dataTestId ? `${dataTestId}-${suffix}` : undefined,\n  named: (suffix: string): string =>\n    dataTestId ? `${dataTestId}-${suffix}` : `loading-state-${suffix}`,\n});\n\nexport type LoadingStateTestIds = ReturnType<typeof makeTestIds>;\n","/**\n * A component's labels: the caller's `labels` laid over the pack's defaults,\n * key by key, ignoring keys the caller left `undefined` (FUT-3860).\n *\n * `Partial<T>` is what keeps a new key non-breaking: every label prop is\n * optional, and the English pack answers for whatever a caller does not name.\n */\nexport function resolveLabels<T extends object>(defaults: T, overrides?: Partial<T>): T {\n  if (!overrides) return defaults;\n  const defined = Object.entries(overrides).filter(([, value]) => value !== undefined);\n  return { ...defaults, ...Object.fromEntries(defined) } as T;\n}\n"],"mappings":"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","names":["LoadingState"]}

package/dist/native/feedback/Dialog.js

@@ -15,6 +15,9 @@ import {
 import {
   muiTypeStyle
 } from "../chunks/chunk-2UFNPDYT.js";
+import {
+  EN_US_UI_LABELS
+} from "../chunks/chunk-DUELD4HY.js";
 import "../chunks/chunk-5WLOVHKK.js";
 import {
   childTestId,
@@ -240,13 +243,17 @@ var dialogSubtitleStyle = (theme) => ({
   color: theme.palette.text.secondary,
   marginTop: theme.spacing(DIALOG_TITLE.subtitleGapUnits)
 });
-function CloseButton({ onPress, testID }) {
+function CloseButton({
+  onPress,
+  testID,
+  label
+}) {
   const theme = useUiTheme();
   return /* @__PURE__ */ jsx(
     Pressable,
     {
       role: "button",
-      "aria-label": "close",
+      "aria-label": label,
       testID,
       onPress,
       style: ({ pressed }) => [
@@ -262,6 +269,7 @@ function DialogHeader({
   title,
   subtitle,
   showCloseButton = true,
+  closeLabel = EN_US_UI_LABELS.common.close,
   onClose,
   ...others
 }) {
@@ -300,7 +308,14 @@ function DialogHeader({
           /* @__PURE__ */ jsx(RNText, { role: "heading", "aria-level": 2, style: dialogTitleStyle(theme), children: title }),
           subtitle ? /* @__PURE__ */ jsx(RNText, { style: dialogSubtitleStyle(theme), children: subtitle }) : null
         ] }),
-        showCloseButton && onClose ? /* @__PURE__ */ jsx(CloseButton, { onPress: onClose, testID: childTestId(others, "close", "dialog") }) : null
+        showCloseButton && onClose ? /* @__PURE__ */ jsx(
+          CloseButton,
+          {
+            onPress: onClose,
+            label: closeLabel,
+            testID: childTestId(others, "close", "dialog")
+          }
+        ) : null
       ]
     }
   );
@@ -473,6 +488,7 @@ function Dialog(rawProps) {
     title,
     description,
     showCloseButton,
+    closeLabel,
     backdrop: _backdrop,
     persistent,
     glass,
@@ -525,6 +541,7 @@ function Dialog(rawProps) {
                 title,
                 subtitle: description,
                 showCloseButton,
+                closeLabel,
                 onClose,
                 dataTestId: testID
               }

package/dist/native/feedback/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/feedback/Dialog/Dialog.native.tsx","../../../src/components/feedback/Dialog/Dialog.helpers.ts","../../../src/components/feedback/Dialog/Dialog.metrics.ts","../../../src/components/feedback/Dialog/Dialog.look.native.ts","../../../src/components/feedback/Dialog/DialogParts.native.tsx","../../../src/platform/keyboard-overlap.native.ts"],"sourcesContent":["import * as React from 'react';\nimport { Modal, Pressable, ScrollView, StyleSheet, View } from 'react-native';\n\nimport { hasSpacingSlot, withDialogDefaults } from './Dialog.helpers';\nimport { dialogBackdrop, dialogKeyboardLift, dialogLook } from './Dialog.look.native';\nimport { DIALOG_BODY_PADDING_UNITS, DIALOG_PULSE } from './Dialog.metrics';\nimport type { DialogProps } from './Dialog.types.native';\nimport {\n  DialogActions,\n  DialogContent,\n  DialogHeader,\n  DialogTitledContext,\n  dialogBodyTextStyle,\n} from './DialogParts.native';\nimport { useKeyboardOverlap } from '../../../platform/keyboard-overlap.native';\nimport { PulseRing } from '../../../platform/pulse-ring.native';\nimport { resolveTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { renderTextChildren } from '../../../platform/text-children';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\nimport type { UiTheme } from '../../../tokens/theme';\n\n// The shared stories import all four names from `./Dialog`, which resolves here\n// under Metro and in the native Storybook; the slots live in their own file to\n// keep this one about the envelope, and are re-exported so that import works.\nexport { DialogActions, DialogContent, DialogHeader } from './DialogParts.native';\n\n/**\n * The dialog body. Consumers that pass raw children (no `DialogContent`) would\n * render them flush against the paper edges — give them comfortable default\n * padding; `DialogContent`/`DialogActions` users keep managing their own.\n *\n * The web can also catch a slot passed through a COMPONENT boundary, with a\n * `:has()` selector that asks the DOM one step after React could. React Native\n * has no such selector, so only the element-type check runs here — see\n * NATIVE-NOTES.md.\n */\nconst styles = StyleSheet.create({\n  /** Same sizing `DialogParts`' content slot uses, so a raw body behaves like one. */\n  rawBody: { flexGrow: 1, flexShrink: 1 },\n});\n\nfunction bodyOf(theme: UiTheme, children: React.ReactNode, hasTitle: boolean): React.ReactNode {\n  if (hasSpacingSlot(children, [DialogContent, DialogActions])) return children;\n  const top = hasTitle ? DIALOG_BODY_PADDING_UNITS.topUnderTitle : DIALOG_BODY_PADDING_UNITS.top;\n  // A `ScrollView`, not a `View`: MUI's paper is `overflow-y: auto`, so\n  // overlong raw children scroll on the web. The native paper is `maxHeight:\n  // '100%'` with its overflow hidden, so a plain wrapper clipped them with no\n  // way to reach the rest. `DialogContent` already gets this treatment; raw\n  // children were the one path that did not.\n  return (\n    <ScrollView\n      style={styles.rawBody}\n      contentContainerStyle={{\n        paddingHorizontal: theme.spacing(DIALOG_BODY_PADDING_UNITS.horizontal),\n        paddingBottom: theme.spacing(DIALOG_BODY_PADDING_UNITS.bottom),\n        paddingTop: theme.spacing(top),\n      }}\n    >\n      {renderTextChildren(children, dialogBodyTextStyle(theme))}\n    </ScrollView>\n  );\n}\n\n/**\n * Whether a `<DialogHeader>` arrived as a CHILD rather than through the `title`\n * prop.\n *\n * The web tightens a body under a title with\n * `.MuiDialogTitle-root + &.MuiDialogContent-root` — a CSS sibling selector, so\n * it fires however the title got there. Native reads a context instead, and the\n * context was set from the `title` prop alone, which is the composition nothing\n * uses: every story and `Dialog.md` write the header as a child, and those\n * bodies took the untitled 24px inset where the web gives them 12px.\n */\nfunction hasHeaderChild(children: React.ReactNode): boolean {\n  return React.Children.toArray(children).some(\n    (child) => React.isValidElement(child) && child.type === DialogHeader,\n  );\n}\n\nexport function Dialog(rawProps: DialogProps): React.JSX.Element {\n  const {\n    children,\n    open,\n    variant,\n    size,\n    title,\n    description,\n    showCloseButton,\n    backdrop: _backdrop,\n    persistent,\n    glass,\n    gradient: _gradient,\n    glow,\n    pulse,\n    borderRadius,\n    onClose,\n    ...others\n  } = withDialogDefaults(rawProps);\n\n  const theme = useUiTheme();\n  const look = dialogLook(theme, { variant, size, borderRadius, glass, glow, pulse });\n  const testID = resolveTestId(others, 'dialog');\n  const { style, ...modalProps } = withoutTestIdProps(others);\n\n  // A persistent dialog refuses both routes out that are not a button: the\n  // backdrop and Escape (which `Modal` routes through `onRequestClose`).\n  const dismiss = persistent ? undefined : onClose;\n\n  // Edge-to-edge defeats the `SOFT_INPUT_ADJUST_RESIZE` that `Modal` asks for,\n  // so the window never shrinks for the keyboard and nothing else moves the\n  // paper: the overlay measures how much of it the keyboard covers and takes\n  // that off the paper's room itself (FUT-3021).\n  const keyboard = useKeyboardOverlap();\n\n  return (\n    <Modal visible={open} transparent onRequestClose={dismiss} {...modalProps}>\n      <View\n        style={[look.overlay, dialogKeyboardLift(theme, variant, keyboard.overlap)]}\n        onLayout={keyboard.onLayout}\n      >\n        <Pressable\n          aria-hidden\n          tabIndex={-1}\n          testID={`${testID}-backdrop`}\n          onPress={dismiss}\n          style={[StyleSheet.absoluteFill, dialogBackdrop(glass)]}\n        />\n        <View testID={testID} style={[look.paper, style]}>\n          {pulse ? (\n            <PulseRing\n              color={theme.palette.primary.main}\n              radius={look.radius}\n              spread={DIALOG_PULSE.spread}\n              durationMs={DIALOG_PULSE.durationMs}\n              fadeAt={DIALOG_PULSE.fadeAt}\n              opacity={DIALOG_PULSE.alpha}\n              testID={`${testID}-pulse`}\n            />\n          ) : null}\n          <DialogTitledContext.Provider value={Boolean(title) || hasHeaderChild(children)}>\n            {title ? (\n              <DialogHeader\n                title={title}\n                subtitle={description}\n                showCloseButton={showCloseButton}\n                onClose={onClose}\n                dataTestId={testID}\n              />\n            ) : null}\n            {bodyOf(theme, children, Boolean(title))}\n          </DialogTitledContext.Provider>\n        </View>\n      </View>\n    </Modal>\n  );\n}\n\nDialog.displayName = 'Dialog';\n","import * as React from 'react';\n\nimport type { DialogBaseProps } from './Dialog.base';\n\n/**\n * The defaults, and the slot detection, BOTH renderers run.\n *\n * Neither imports a renderer: the defaults are plain values and the slot check\n * is told which component identities count, because `DialogContent` on the web\n * and `DialogContent` on React Native are different functions answering to the\n * same name.\n */\n\ntype DialogDefaultedKeys =\n  | 'variant'\n  | 'size'\n  | 'showCloseButton'\n  | 'backdrop'\n  | 'persistent'\n  | 'glass'\n  | 'gradient'\n  | 'glow'\n  | 'pulse'\n  | 'borderRadius';\n\nexport const DIALOG_DEFAULTS: Required<Pick<DialogBaseProps, DialogDefaultedKeys>> = {\n  variant: 'default',\n  size: 'md',\n  showCloseButton: true,\n  backdrop: true,\n  persistent: false,\n  glass: false,\n  gradient: false,\n  glow: false,\n  pulse: false,\n  borderRadius: 'lg',\n};\n\n/** The renderer's own props with every defaulted field guaranteed present. */\nexport type DialogPropsWithDefaults<P extends DialogBaseProps> = P &\n  Required<Pick<DialogBaseProps, DialogDefaultedKeys>>;\n\n/**\n * Apply {@link DIALOG_DEFAULTS} exactly like parameter defaults would: only a\n * missing/`undefined` prop falls back (a loop, so the component's cyclomatic\n * complexity doesn't pay one branch per defaulted prop).\n */\nexport function withDialogDefaults<P extends DialogBaseProps>(props: P): DialogPropsWithDefaults<P> {\n  const merged = { ...props } as Record<string, unknown>;\n  for (const [key, value] of Object.entries(DIALOG_DEFAULTS)) {\n    if (merged[key] === undefined) merged[key] = value;\n  }\n  return merged as unknown as DialogPropsWithDefaults<P>;\n}\n\n/**\n * Does this hand us a spacing slot? Fragments are transparent: `<>` is a way of\n * passing several children, not a child that owns them, and a consumer who\n * groups a `DialogContent` and a `DialogActions` in one has still passed both.\n *\n * Only the slots themselves count, and only at the top. A `DialogContent`\n * genuinely nested inside a `<div>` is that div's content, and the dialog\n * padding the div is right.\n *\n * `slots` is passed in rather than closed over so the two renderers can hand it\n * their own `DialogContent` / `DialogActions`.\n */\nexport function hasSpacingSlot(children: React.ReactNode, slots: readonly unknown[]): boolean {\n  return React.Children.toArray(children).some((child) => {\n    if (!React.isValidElement(child)) return false;\n    if (slots.includes(child.type)) return true;\n    if (child.type !== React.Fragment) return false;\n    return hasSpacingSlot((child.props as { children?: React.ReactNode }).children, slots);\n  });\n}\n","import type { DialogBorderRadius, DialogSize } from './Dialog.base';\nimport { alpha } from '../../../tokens/color';\nimport { ABSOLUTE_INK } from '../../../tokens/ink.core';\nimport type { UiShadow } from '../../../tokens/shadow';\n\n/**\n * THE NUMBERS BOTH `Dialog` RENDERERS DRAW WITH.\n *\n * `Dialog.styles.ts` / `Dialog.tsx` (MUI) and `Dialog.look.native.ts` /\n * `Dialog.native.tsx` (React Native) read this one table. Spacing is in\n * SPACING UNITS wherever the web writes `theme.spacing(n)`; everything else is\n * px, a ratio or an alpha. Shadows are `UiShadow`s — see `src/tokens/shadow.ts`\n * for why they have a shape rather than a string.\n */\n\n/* ── The paper ────────────────────────────────────────────────────────────── */\n\n/** `theme.spacing(n)` per named radius; `lg` is the default. */\nexport const DIALOG_RADIUS_UNITS: Record<DialogBorderRadius, number> = {\n  none: 0,\n  sm: 0.5,\n  md: 1,\n  lg: 2,\n  xl: 3,\n};\n\n/** How wide the paper may grow, per size, in px. Also the drawer's fixed width. */\nexport const DIALOG_MAX_WIDTH: Record<DialogSize, number> = {\n  xs: 400,\n  sm: 600,\n  md: 800,\n  lg: 1000,\n  xl: 1200,\n};\n\n/** The paper is 90% of the viewport up to its max width, `theme.spacing(2)` clear of the edge. */\nexport const DIALOG_WIDTH_PERCENT = 90;\nexport const DIALOG_MARGIN_UNITS = 2;\n\n/** The hairline `glass` draws. */\nexport const DIALOG_BORDER_WIDTH = 1;\n\n/**\n * MUI's `theme.shadows[24]` — the elevation a `Dialog`'s Paper paints.\n *\n * Restated rather than derived because the web never names it: `MuiDialog`\n * passes `elevation={24}` to its Paper, and React Native has no Paper to\n * inherit that from.\n */\nexport const DIALOG_PAPER_SHADOW: readonly UiShadow[] = [\n  { offsetX: 0, offsetY: 11, blurRadius: 15, spreadDistance: -7, color: alpha(ABSOLUTE_INK.black, 0.2) },\n  { offsetX: 0, offsetY: 24, blurRadius: 38, spreadDistance: 3, color: alpha(ABSOLUTE_INK.black, 0.14) },\n  { offsetX: 0, offsetY: 9, blurRadius: 46, spreadDistance: 8, color: alpha(ABSOLUTE_INK.black, 0.12) },\n];\n\n/* ── Variants and decorations ─────────────────────────────────────────────── */\n\n/** `glass`: a 0.1 wash of the paper behind a 20px blur, inside a primary hairline. */\nexport const DIALOG_GLASS = {\n  backgroundAlpha: 0.1,\n  blurPx: 20,\n  borderAlpha: 0.2,\n  shadow: { offsetY: 8, blurRadius: 32, alpha: 0.1 },\n} as const;\n\n/** `gradient`: a faint primary-into-secondary wash at 135°, over a 10px blur. */\nexport const DIALOG_GRADIENT = { angleDeg: 135, stopAlpha: 0.1, blurPx: 10 } as const;\n\n/** `glow`: a 40px halo of the primary hue. */\nexport const DIALOG_GLOW = { blurRadius: 40, alpha: 0.3 } as const;\n\n/**\n * `pulse`: a ring of the primary hue that grows 20px out of the paper's edge and\n * fades, every two seconds. The web draws it as an `::after` box-shadow spread\n * behind the paper (`z-index: -1`).\n */\nexport const DIALOG_PULSE = {\n  alpha: 0.3,\n  durationMs: 2000,\n  spread: 20,\n  /** The fraction of the cycle the ring is still visible for. */\n  fadeAt: 0.7,\n  zIndex: -1,\n} as const;\n\n/**\n * The scrim: half-black, or a fifth of it behind an 8px blur for `glass`.\n *\n * It paints on BOTH renderers whatever `backdrop` is set to. The web reads that\n * prop as `BackdropComponent={backdrop ? Backdrop : undefined}`, and `undefined`\n * is exactly what MUI falls back to `Backdrop` for — so the scrim is there\n * either way. Native mirrors that rather than inventing a difference; fixing it\n * is a web change, made once, for both.\n */\nexport const DIALOG_BACKDROP = { alpha: { plain: 0.5, glass: 0.2 }, blurPx: 8 } as const;\n\n/* ── The slots ────────────────────────────────────────────────────────────── */\n\n/** Raw children (no `DialogContent`/`DialogActions`) get this padding, in spacing units. */\nexport const DIALOG_BODY_PADDING_UNITS = {\n  horizontal: 3,\n  bottom: 2.5,\n  top: 2.5,\n  /** Tighter under a title, whose own bottom padding is most of the gap. */\n  topUnderTitle: 0.5,\n} as const;\n\n/** A `DialogHeader` given raw `children` is a padded box over a hairline instead. */\nexport const DIALOG_HEADER_CHILDREN_PADDING_UNITS = 2;\n\n/**\n * The title row: MUI's `DialogTitle` padding in px, and the bottom the web\n * overrides in spacing units — tighter when a subtitle follows it.\n */\nexport const DIALOG_TITLE = {\n  padding: { top: 16, horizontal: 24 },\n  paddingBottomUnits: { withSubtitle: 1, plain: 2 },\n  subtitleGapUnits: 0.5,\n} as const;\n\n/**\n * The close button: MUI's `IconButton` at its default 8px padding around a\n * 24px glyph, on a circular hover wash.\n */\nexport const DIALOG_CLOSE_BUTTON = { padding: 8, iconSize: 24 } as const;\n\n/** `DialogContent`: `theme.spacing(3)`, tightened by `dense`. */\nexport const DIALOG_CONTENT_PADDING_UNITS = { normal: 3, dense: 1.5 } as const;\n\n/**\n * Top padding for a body that sits directly under the title.\n *\n * MUI zeroes it there, assuming the title's own bottom padding is the whole\n * gap. That assumption breaks for a body opening with an outlined field: a\n * filled field floats its label ABOVE the input's border box, and the body is a\n * clipping box, so the label gets sliced in half (FUT-544). 12px clears the\n * shrunk label's 9px overhang and leaves the gap visually tight.\n */\nexport const DIALOG_TITLED_BODY_PADDING_TOP_UNITS = 1.5;\n\n/** `DialogActions`: `theme.spacing(2)` around, and one unit between by default. */\nexport const DIALOG_ACTIONS = { paddingUnits: 2, defaultSpacingUnits: 1 } as const;\n","import type { ViewStyle } from 'react-native';\n\nimport type { DialogBorderRadius, DialogSize, DialogVariant } from './Dialog.base';\nimport {\n  DIALOG_BACKDROP,\n  DIALOG_BORDER_WIDTH,\n  DIALOG_GLASS,\n  DIALOG_GLOW,\n  DIALOG_MARGIN_UNITS,\n  DIALOG_MAX_WIDTH,\n  DIALOG_PAPER_SHADOW,\n  DIALOG_RADIUS_UNITS,\n} from './Dialog.metrics';\nimport { alpha } from '../../../tokens/color';\nimport { BLACK, halo } from '../../../tokens/shadow';\nimport type { UiTheme } from '../../../tokens/theme';\n\n/**\n * WHAT THE NATIVE `Dialog` PAINTS — the arithmetic, with no JSX in sight.\n *\n * `variantStylesOf` builds one `sx` by spreading base, then the decorations\n * (`glow`, `pulse`), then the variant's own surface; whichever wrote a property\n * last wins. The composition here spreads the SAME things in the SAME order, so\n * `glow` survives on a `default` paper (whose surface declares no shadow) and is\n * buried by a `glass` one, on both renderers.\n */\n\n/** The named radius as a length. */\nexport function dialogRadius(theme: UiTheme, radius: DialogBorderRadius): number {\n  return theme.spacing(DIALOG_RADIUS_UNITS[radius] ?? DIALOG_RADIUS_UNITS.lg);\n}\n\n/** The scrim behind the paper: half-black, or a fifth of it for `glass`. */\nexport function dialogBackdrop(glass: boolean): ViewStyle {\n  return {\n    backgroundColor: alpha(BLACK, glass ? DIALOG_BACKDROP.alpha.glass : DIALOG_BACKDROP.alpha.plain),\n  };\n}\n\n/** The glass surface, shared by `variant=\"glass\"` and the `glass` flag. */\nfunction glassSurface(theme: UiTheme): ViewStyle {\n  return {\n    backgroundColor: alpha(theme.palette.background.paper, DIALOG_GLASS.backgroundAlpha),\n    borderWidth: DIALOG_BORDER_WIDTH,\n    borderStyle: 'solid',\n    borderColor: alpha(theme.palette.primary.main, DIALOG_GLASS.borderAlpha),\n  };\n}\n\nexport interface DialogLookArgs {\n  variant: DialogVariant;\n  size: DialogSize;\n  borderRadius: DialogBorderRadius;\n  glass: boolean;\n  glow: boolean;\n  pulse: boolean;\n}\n\nexport interface DialogLook {\n  /** Where the paper sits inside the modal, and how far in from the edges. */\n  overlay: ViewStyle;\n  paper: ViewStyle;\n  /** The paper's corner radius, for the pulse ring to follow. */\n  radius: number;\n}\n\n/** The centred paper of `default` and `glass`, before the variant paints over it. */\nfunction centredOverlay(theme: UiTheme): ViewStyle {\n  return {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n    // The web gives the PAPER `margin: theme.spacing(2)`; an inset on the\n    // overlay is the same gap and leaves the paper free to be `100%` wide.\n    padding: theme.spacing(DIALOG_MARGIN_UNITS),\n  };\n}\n\nfunction variantPaper(theme: UiTheme, a: DialogLookArgs, radius: number): ViewStyle {\n  switch (a.variant) {\n    case 'glass':\n      return {\n        ...glassSurface(theme),\n        boxShadow: [\n          {\n            offsetX: 0,\n            offsetY: DIALOG_GLASS.shadow.offsetY,\n            blurRadius: DIALOG_GLASS.shadow.blurRadius,\n            spreadDistance: 0,\n            color: alpha(BLACK, DIALOG_GLASS.shadow.alpha),\n          },\n        ],\n      };\n    case 'fullscreen':\n      return { borderRadius: 0, width: '100%', height: '100%', maxWidth: undefined };\n    case 'drawer':\n      return {\n        // SQUARE, because that is what the web paints. Two things have to fail\n        // for a drawer to have a corner there and both do: the `sx` builds\n        // `${radius}px 0 0 ${radius}px` out of `theme.spacing()`, which already\n        // returns a px string, so the declaration reads `16pxpx 0 0 16pxpx` and\n        // the browser drops it; and that `sx` lands on a plain `Box` INSIDE the\n        // Drawer, whose own Paper MUI renders with `square: true`. Nothing is\n        // left to round the corners. See NATIVE-NOTES.md.\n        borderRadius: 0,\n        width: DIALOG_MAX_WIDTH[a.size] ?? DIALOG_MAX_WIDTH.md,\n        maxWidth: '100%',\n        height: '100%',\n        maxHeight: undefined,\n      };\n    default:\n      return a.glass ? { ...glassSurface(theme), borderRadius: radius } : {};\n  }\n}\n\n/** `fullscreen` and `drawer` fill the screen, so neither is inset or centred. */\nfunction overlayFor(theme: UiTheme, variant: DialogVariant): ViewStyle {\n  if (variant === 'fullscreen') return { flex: 1 };\n  if (variant === 'drawer') return { flex: 1, alignItems: 'flex-end' };\n  if (variant === 'bottom-sheet') return { ...centredOverlay(theme), justifyContent: 'flex-end' };\n  return centredOverlay(theme);\n}\n\n/**\n * The overlay's bottom inset while the soft keyboard covers `overlap` dp of it\n * (FUT-3021), or nothing while it covers none.\n *\n * The inset grows by exactly the overlap, on top of the margin the variant\n * already keeps, so the space the paper may fill — its `maxHeight: '100%'`, or\n * the `height: '100%'` of `fullscreen` and `drawer` — shrinks by the same\n * amount and ends where the keyboard starts. A centred paper re-centres in what\n * is left, and a body taller than that scrolls inside `DialogContent` with the\n * actions still on screen.\n */\nexport function dialogKeyboardLift(theme: UiTheme, variant: DialogVariant, overlap: number): ViewStyle | null {\n  if (overlap <= 0) return null;\n  const margin = variant === 'fullscreen' || variant === 'drawer' ? 0 : theme.spacing(DIALOG_MARGIN_UNITS);\n  return { paddingBottom: margin + overlap };\n}\n\n/**\n * Everything the dialog paints, decided once per render.\n *\n * The base carries what MUI's `Paper` gives every dialog — the paper colour and\n * `shadows[24]` — because React Native has no Paper to inherit them from; a\n * `glow` or a variant shadow then overrides it exactly as the `sx` does.\n *\n * `overflow` clips the paper's children to its corners, as MUI's own\n * `overflow-y: auto` does — except under `pulse` or `glow`, which have to paint\n * OUTSIDE the paper and are clipped by the view's own overflow on a device.\n */\nexport function dialogLook(theme: UiTheme, a: DialogLookArgs): DialogLook {\n  const radius = dialogRadius(theme, a.borderRadius);\n\n  const base: ViewStyle = {\n    position: 'relative',\n    borderRadius: radius,\n    backgroundColor: theme.palette.background.paper,\n    boxShadow: DIALOG_PAPER_SHADOW,\n    width: '100%',\n    maxWidth: DIALOG_MAX_WIDTH[a.size] ?? DIALOG_MAX_WIDTH.md,\n    maxHeight: '100%',\n    overflow: a.pulse || a.glow ? 'visible' : 'hidden',\n  };\n\n  return {\n    radius,\n    overlay: overlayFor(theme, a.variant),\n    paper: {\n      ...base,\n      ...(a.glow\n        ? { boxShadow: halo(DIALOG_GLOW.blurRadius, alpha(theme.palette.primary.main, DIALOG_GLOW.alpha)) }\n        : null),\n      ...variantPaper(theme, a, radius),\n    },\n  };\n}\n","import * as React from 'react';\nimport {\n  Pressable,\n  ScrollView,\n  StyleSheet,\n  Text as RNText,\n  View,\n  type TextStyle,\n  type ViewStyle,\n} from 'react-native';\n\nimport {\n  DIALOG_ACTIONS,\n  DIALOG_CLOSE_BUTTON,\n  DIALOG_CONTENT_PADDING_UNITS,\n  DIALOG_HEADER_CHILDREN_PADDING_UNITS,\n  DIALOG_TITLE,\n  DIALOG_TITLED_BODY_PADDING_TOP_UNITS,\n} from './Dialog.metrics';\nimport type {\n  DialogActionsAlignment,\n  DialogActionsProps,\n  DialogContentProps,\n  DialogHeaderProps,\n} from './Dialog.types.native';\nimport { Icon } from '../../../icons/Icon.native';\nimport { childTestId, slotTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { renderTextChildren } from '../../../platform/text-children';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\nimport { muiTypeStyle } from '../../../tokens/mui-type';\nimport type { UiTheme } from '../../../tokens/theme';\n\n/**\n * THE THREE SLOTS A DIALOG IS BUILT OUT OF, ON REACT NATIVE.\n *\n * The web overrides only padding, alignment and the dividers, so the rest of\n * the numbers are MUI's own and are restated in `Dialog.metrics.ts` rather than\n * re-invented.\n */\n\n/**\n * Is there a title above this body?\n *\n * The web asks the DOM — `.MuiDialogTitle-root + &` — because only the CSS knows\n * which `DialogContent` actually FOLLOWS the title. React Native has no sibling\n * selector, so `Dialog` says so through context instead; the difference is that\n * a second `DialogContent` further down gets the tighter top padding too.\n */\nexport const DialogTitledContext = React.createContext(false);\n\n/** The body text of a slot, in MUI's `body1`, so a bare string is not unstyled. */\nexport const dialogBodyTextStyle = (theme: UiTheme): TextStyle => ({\n  ...muiTypeStyle(theme, 'body1'),\n  color: theme.palette.text.primary,\n});\n\n/** MUI's dialog title: `h6`, in the body ink. */\nexport const dialogTitleStyle = (theme: UiTheme): TextStyle => ({\n  ...muiTypeStyle(theme, 'h6'),\n  color: theme.palette.text.primary,\n});\n\n/** The subtitle under it: `body2`, muted, one half-unit down. */\nexport const dialogSubtitleStyle = (theme: UiTheme): TextStyle => ({\n  ...muiTypeStyle(theme, 'body2'),\n  color: theme.palette.text.secondary,\n  marginTop: theme.spacing(DIALOG_TITLE.subtitleGapUnits),\n});\n\nfunction CloseButton({ onPress, testID }: { onPress: () => void; testID: string }): React.JSX.Element {\n  const theme = useUiTheme();\n  return (\n    <Pressable\n      role=\"button\"\n      aria-label=\"close\"\n      testID={testID}\n      onPress={onPress}\n      style={({ pressed }) => [\n        styles.close,\n        pressed ? { backgroundColor: theme.palette.action.hover } : null,\n      ]}\n    >\n      <Icon name=\"Close\" size={DIALOG_CLOSE_BUTTON.iconSize} color={theme.palette.text.secondary} />\n    </Pressable>\n  );\n}\n\nexport function DialogHeader({\n  children,\n  title,\n  subtitle,\n  showCloseButton = true,\n  onClose,\n  ...others\n}: DialogHeaderProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const { style, ...viewProps } = withoutTestIdProps(others);\n\n  if (children) {\n    return (\n      <View\n        testID={slotTestId(others, 'header', 'dialog')}\n        style={[\n          {\n            padding: theme.spacing(DIALOG_HEADER_CHILDREN_PADDING_UNITS),\n            borderBottomWidth: 1,\n            borderBottomColor: theme.palette.divider,\n            borderStyle: 'solid',\n          },\n          style,\n        ]}\n        {...viewProps}\n      >\n        {renderTextChildren(children, dialogBodyTextStyle(theme))}\n      </View>\n    );\n  }\n\n  const paddingBottom = theme.spacing(\n    subtitle ? DIALOG_TITLE.paddingBottomUnits.withSubtitle : DIALOG_TITLE.paddingBottomUnits.plain,\n  );\n\n  return (\n    <View\n      testID={slotTestId(others, 'title', 'dialog')}\n      style={[styles.header, { paddingBottom }, style]}\n      {...viewProps}\n    >\n      <View style={styles.headerText}>\n        {/*\n          MUI's `DialogTitle` renders `component: \"h2\"`, so the web dialog has a\n          heading and the native one had none. `role`/`aria-level` are what\n          react-native-web maps to an `<h2>`; a device reads the same pair\n          through `accessibilityRole=\"header\"`, which RN derives from `role`.\n        */}\n        <RNText role=\"heading\" aria-level={2} style={dialogTitleStyle(theme)}>\n          {title}\n        </RNText>\n        {subtitle ? <RNText style={dialogSubtitleStyle(theme)}>{subtitle}</RNText> : null}\n      </View>\n      {showCloseButton && onClose ? (\n        <CloseButton onPress={onClose} testID={childTestId(others, 'close', 'dialog')} />\n      ) : null}\n    </View>\n  );\n}\n\nDialogHeader.displayName = 'DialogHeader';\n\nexport function DialogContent({\n  children,\n  dividers = false,\n  dense = false,\n  ...others\n}: DialogContentProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const titled = React.useContext(DialogTitledContext);\n  const { style, ...viewProps } = withoutTestIdProps(others);\n  const padding = theme.spacing(\n    dense ? DIALOG_CONTENT_PADDING_UNITS.dense : DIALOG_CONTENT_PADDING_UNITS.normal,\n  );\n  const paddingTop = titled\n    ? theme.spacing(DIALOG_TITLED_BODY_PADDING_TOP_UNITS)\n    : padding;\n\n  return (\n    <ScrollView\n      testID={slotTestId(others, 'content', 'dialog')}\n      style={[\n        styles.content,\n        dividers\n          ? {\n              borderTopWidth: 1,\n              borderBottomWidth: 1,\n              borderStyle: 'solid',\n              borderColor: theme.palette.divider,\n            }\n          : null,\n        style,\n      ]}\n      contentContainerStyle={{ padding, paddingTop }}\n      {...viewProps}\n    >\n      {renderTextChildren(children, dialogBodyTextStyle(theme))}\n    </ScrollView>\n  );\n}\n\nDialogContent.displayName = 'DialogContent';\n\nconst JUSTIFY: Record<DialogActionsAlignment, NonNullable<ViewStyle['justifyContent']>> = {\n  left: 'flex-start',\n  center: 'center',\n  right: 'flex-end',\n  'space-between': 'space-between',\n};\n\nexport function DialogActions({\n  children,\n  alignment = 'right',\n  spacing = DIALOG_ACTIONS.defaultSpacingUnits,\n  ...others\n}: DialogActionsProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const { style, ...viewProps } = withoutTestIdProps(others);\n\n  return (\n    <View\n      testID={slotTestId(others, 'actions', 'dialog')}\n      style={[\n        styles.actions,\n        {\n          padding: theme.spacing(DIALOG_ACTIONS.paddingUnits),\n          justifyContent: JUSTIFY[alignment],\n          gap: theme.spacing(spacing),\n        },\n        style,\n      ]}\n      {...viewProps}\n    >\n      {renderTextChildren(children, dialogBodyTextStyle(theme))}\n    </View>\n  );\n}\n\nDialogActions.displayName = 'DialogActions';\n\nconst styles = StyleSheet.create({\n  header: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    flexGrow: 0,\n    flexShrink: 0,\n    paddingTop: DIALOG_TITLE.padding.top,\n    paddingHorizontal: DIALOG_TITLE.padding.horizontal,\n  },\n  headerText: {\n    flexShrink: 1,\n  },\n  close: {\n    padding: DIALOG_CLOSE_BUTTON.padding,\n    borderRadius: 9999,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  content: {\n    flexGrow: 1,\n    flexShrink: 1,\n  },\n  actions: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    flexGrow: 0,\n    flexShrink: 0,\n  },\n});\n","import * as React from 'react';\nimport {\n  Keyboard,\n  Platform,\n  type KeyboardEvent,\n  type KeyboardEventName,\n  type LayoutChangeEvent,\n} from 'react-native';\n\n/**\n * HOW FAR THE SOFT KEYBOARD COVERS A FULL-WINDOW VIEW, AND NOTHING MORE.\n *\n * React Native's `Modal` asks Android for `SOFT_INPUT_ADJUST_RESIZE`, and under\n * edge-to-edge that asks for nothing: the window keeps its full height and the\n * keyboard is drawn over it. iOS never resized a modal at all. So an overlay\n * that fills the modal has its bottom under the keyboard, and whatever sits\n * there — a dialog's actions — is hidden until the keyboard goes away.\n *\n * This reads the keyboard's own top edge from the `Keyboard` events and the\n * view's own bottom edge from its layout, and answers the difference. Reading\n * the OVERLAP rather than the keyboard's height is what keeps it right when the\n * window DID resize (a host that is not edge-to-edge): the view then already\n * ends at the keyboard, the overlap is zero, and nothing is lifted twice. No\n * soft-input mode is set here, deliberately — a second one would fight the one\n * `Modal` already asks for.\n *\n * The view's layout `y` is relative to its parent, so the view is expected to\n * be the root of a window that starts at the top of the screen — which a\n * `transparent` modal is, on iOS and under Android edge-to-edge alike.\n */\nexport function keyboardOverlap(viewBottom: number | null, keyboardTop: number | null): number {\n  if (viewBottom === null || keyboardTop === null) return 0;\n  return Math.max(0, viewBottom - keyboardTop);\n}\n\n/** iOS announces the keyboard before it moves; Android only once it has. */\nconst KEYBOARD_EVENTS: { show: KeyboardEventName; hide: KeyboardEventName } =\n  Platform.OS === 'ios'\n    ? { show: 'keyboardWillShow', hide: 'keyboardWillHide' }\n    : { show: 'keyboardDidShow', hide: 'keyboardDidHide' };\n\nexport interface KeyboardOverlap {\n  /** How many dp of the view the keyboard covers; `0` while it is down. */\n  overlap: number;\n  /** Goes on the view being measured. */\n  onLayout: (event: LayoutChangeEvent) => void;\n}\n\n/**\n * The keyboard's overlap with the view `onLayout` is put on. Android re-sends\n * `keyboardDidShow` when the keyboard changes height while it stays up (an\n * emoji panel, a suggestion strip), so the overlap follows those too.\n */\nexport function useKeyboardOverlap(): KeyboardOverlap {\n  const [viewBottom, setViewBottom] = React.useState<number | null>(null);\n  const [keyboardTop, setKeyboardTop] = React.useState<number | null>(null);\n\n  React.useEffect(() => {\n    const shown = Keyboard.addListener(KEYBOARD_EVENTS.show, (event: KeyboardEvent) => {\n      setKeyboardTop(event.endCoordinates.screenY);\n    });\n    const hidden = Keyboard.addListener(KEYBOARD_EVENTS.hide, () => {\n      setKeyboardTop(null);\n    });\n    return () => {\n      shown.remove();\n      hidden.remove();\n    };\n  }, []);\n\n  const onLayout = React.useCallback((event: LayoutChangeEvent) => {\n    const { y, height } = event.nativeEvent.layout;\n    setViewBottom(y + height);\n  }, []);\n\n  return { overlap: keyboardOverlap(viewBottom, keyboardTop), onLayout };\n}\n"],"mappings":"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","names":["React","Pressable","ScrollView","StyleSheet","View","React","React","jsx","jsxs","styles","StyleSheet","ScrollView","View","Pressable"]}
+{"version":3,"sources":["../../../src/components/feedback/Dialog/Dialog.native.tsx","../../../src/components/feedback/Dialog/Dialog.helpers.ts","../../../src/components/feedback/Dialog/Dialog.metrics.ts","../../../src/components/feedback/Dialog/Dialog.look.native.ts","../../../src/components/feedback/Dialog/DialogParts.native.tsx","../../../src/platform/keyboard-overlap.native.ts"],"sourcesContent":["import * as React from 'react';\nimport { Modal, Pressable, ScrollView, StyleSheet, View } from 'react-native';\n\nimport { hasSpacingSlot, withDialogDefaults } from './Dialog.helpers';\nimport { dialogBackdrop, dialogKeyboardLift, dialogLook } from './Dialog.look.native';\nimport { DIALOG_BODY_PADDING_UNITS, DIALOG_PULSE } from './Dialog.metrics';\nimport type { DialogProps } from './Dialog.types.native';\nimport {\n  DialogActions,\n  DialogContent,\n  DialogHeader,\n  DialogTitledContext,\n  dialogBodyTextStyle,\n} from './DialogParts.native';\nimport { useKeyboardOverlap } from '../../../platform/keyboard-overlap.native';\nimport { PulseRing } from '../../../platform/pulse-ring.native';\nimport { resolveTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { renderTextChildren } from '../../../platform/text-children';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\nimport type { UiTheme } from '../../../tokens/theme';\n\n// The shared stories import all four names from `./Dialog`, which resolves here\n// under Metro and in the native Storybook; the slots live in their own file to\n// keep this one about the envelope, and are re-exported so that import works.\nexport { DialogActions, DialogContent, DialogHeader } from './DialogParts.native';\n\n/**\n * The dialog body. Consumers that pass raw children (no `DialogContent`) would\n * render them flush against the paper edges — give them comfortable default\n * padding; `DialogContent`/`DialogActions` users keep managing their own.\n *\n * The web can also catch a slot passed through a COMPONENT boundary, with a\n * `:has()` selector that asks the DOM one step after React could. React Native\n * has no such selector, so only the element-type check runs here — see\n * NATIVE-NOTES.md.\n */\nconst styles = StyleSheet.create({\n  /** Same sizing `DialogParts`' content slot uses, so a raw body behaves like one. */\n  rawBody: { flexGrow: 1, flexShrink: 1 },\n});\n\nfunction bodyOf(theme: UiTheme, children: React.ReactNode, hasTitle: boolean): React.ReactNode {\n  if (hasSpacingSlot(children, [DialogContent, DialogActions])) return children;\n  const top = hasTitle ? DIALOG_BODY_PADDING_UNITS.topUnderTitle : DIALOG_BODY_PADDING_UNITS.top;\n  // A `ScrollView`, not a `View`: MUI's paper is `overflow-y: auto`, so\n  // overlong raw children scroll on the web. The native paper is `maxHeight:\n  // '100%'` with its overflow hidden, so a plain wrapper clipped them with no\n  // way to reach the rest. `DialogContent` already gets this treatment; raw\n  // children were the one path that did not.\n  return (\n    <ScrollView\n      style={styles.rawBody}\n      contentContainerStyle={{\n        paddingHorizontal: theme.spacing(DIALOG_BODY_PADDING_UNITS.horizontal),\n        paddingBottom: theme.spacing(DIALOG_BODY_PADDING_UNITS.bottom),\n        paddingTop: theme.spacing(top),\n      }}\n    >\n      {renderTextChildren(children, dialogBodyTextStyle(theme))}\n    </ScrollView>\n  );\n}\n\n/**\n * Whether a `<DialogHeader>` arrived as a CHILD rather than through the `title`\n * prop.\n *\n * The web tightens a body under a title with\n * `.MuiDialogTitle-root + &.MuiDialogContent-root` — a CSS sibling selector, so\n * it fires however the title got there. Native reads a context instead, and the\n * context was set from the `title` prop alone, which is the composition nothing\n * uses: every story and `Dialog.md` write the header as a child, and those\n * bodies took the untitled 24px inset where the web gives them 12px.\n */\nfunction hasHeaderChild(children: React.ReactNode): boolean {\n  return React.Children.toArray(children).some(\n    (child) => React.isValidElement(child) && child.type === DialogHeader,\n  );\n}\n\nexport function Dialog(rawProps: DialogProps): React.JSX.Element {\n  const {\n    children,\n    open,\n    variant,\n    size,\n    title,\n    description,\n    showCloseButton,\n    closeLabel,\n    backdrop: _backdrop,\n    persistent,\n    glass,\n    gradient: _gradient,\n    glow,\n    pulse,\n    borderRadius,\n    onClose,\n    ...others\n  } = withDialogDefaults(rawProps);\n\n  const theme = useUiTheme();\n  const look = dialogLook(theme, { variant, size, borderRadius, glass, glow, pulse });\n  const testID = resolveTestId(others, 'dialog');\n  const { style, ...modalProps } = withoutTestIdProps(others);\n\n  // A persistent dialog refuses both routes out that are not a button: the\n  // backdrop and Escape (which `Modal` routes through `onRequestClose`).\n  const dismiss = persistent ? undefined : onClose;\n\n  // Edge-to-edge defeats the `SOFT_INPUT_ADJUST_RESIZE` that `Modal` asks for,\n  // so the window never shrinks for the keyboard and nothing else moves the\n  // paper: the overlay measures how much of it the keyboard covers and takes\n  // that off the paper's room itself (FUT-3021).\n  const keyboard = useKeyboardOverlap();\n\n  return (\n    <Modal visible={open} transparent onRequestClose={dismiss} {...modalProps}>\n      <View\n        style={[look.overlay, dialogKeyboardLift(theme, variant, keyboard.overlap)]}\n        onLayout={keyboard.onLayout}\n      >\n        <Pressable\n          aria-hidden\n          tabIndex={-1}\n          testID={`${testID}-backdrop`}\n          onPress={dismiss}\n          style={[StyleSheet.absoluteFill, dialogBackdrop(glass)]}\n        />\n        <View testID={testID} style={[look.paper, style]}>\n          {pulse ? (\n            <PulseRing\n              color={theme.palette.primary.main}\n              radius={look.radius}\n              spread={DIALOG_PULSE.spread}\n              durationMs={DIALOG_PULSE.durationMs}\n              fadeAt={DIALOG_PULSE.fadeAt}\n              opacity={DIALOG_PULSE.alpha}\n              testID={`${testID}-pulse`}\n            />\n          ) : null}\n          <DialogTitledContext.Provider value={Boolean(title) || hasHeaderChild(children)}>\n            {title ? (\n              <DialogHeader\n                title={title}\n                subtitle={description}\n                showCloseButton={showCloseButton}\n                closeLabel={closeLabel}\n                onClose={onClose}\n                dataTestId={testID}\n              />\n            ) : null}\n            {bodyOf(theme, children, Boolean(title))}\n          </DialogTitledContext.Provider>\n        </View>\n      </View>\n    </Modal>\n  );\n}\n\nDialog.displayName = 'Dialog';\n","import * as React from 'react';\n\nimport type { DialogBaseProps } from './Dialog.base';\n\n/**\n * The defaults, and the slot detection, BOTH renderers run.\n *\n * Neither imports a renderer: the defaults are plain values and the slot check\n * is told which component identities count, because `DialogContent` on the web\n * and `DialogContent` on React Native are different functions answering to the\n * same name.\n */\n\ntype DialogDefaultedKeys =\n  | 'variant'\n  | 'size'\n  | 'showCloseButton'\n  | 'backdrop'\n  | 'persistent'\n  | 'glass'\n  | 'gradient'\n  | 'glow'\n  | 'pulse'\n  | 'borderRadius';\n\nexport const DIALOG_DEFAULTS: Required<Pick<DialogBaseProps, DialogDefaultedKeys>> = {\n  variant: 'default',\n  size: 'md',\n  showCloseButton: true,\n  backdrop: true,\n  persistent: false,\n  glass: false,\n  gradient: false,\n  glow: false,\n  pulse: false,\n  borderRadius: 'lg',\n};\n\n/** The renderer's own props with every defaulted field guaranteed present. */\nexport type DialogPropsWithDefaults<P extends DialogBaseProps> = P &\n  Required<Pick<DialogBaseProps, DialogDefaultedKeys>>;\n\n/**\n * Apply {@link DIALOG_DEFAULTS} exactly like parameter defaults would: only a\n * missing/`undefined` prop falls back (a loop, so the component's cyclomatic\n * complexity doesn't pay one branch per defaulted prop).\n */\nexport function withDialogDefaults<P extends DialogBaseProps>(props: P): DialogPropsWithDefaults<P> {\n  const merged = { ...props } as Record<string, unknown>;\n  for (const [key, value] of Object.entries(DIALOG_DEFAULTS)) {\n    if (merged[key] === undefined) merged[key] = value;\n  }\n  return merged as unknown as DialogPropsWithDefaults<P>;\n}\n\n/**\n * Does this hand us a spacing slot? Fragments are transparent: `<>` is a way of\n * passing several children, not a child that owns them, and a consumer who\n * groups a `DialogContent` and a `DialogActions` in one has still passed both.\n *\n * Only the slots themselves count, and only at the top. A `DialogContent`\n * genuinely nested inside a `<div>` is that div's content, and the dialog\n * padding the div is right.\n *\n * `slots` is passed in rather than closed over so the two renderers can hand it\n * their own `DialogContent` / `DialogActions`.\n */\nexport function hasSpacingSlot(children: React.ReactNode, slots: readonly unknown[]): boolean {\n  return React.Children.toArray(children).some((child) => {\n    if (!React.isValidElement(child)) return false;\n    if (slots.includes(child.type)) return true;\n    if (child.type !== React.Fragment) return false;\n    return hasSpacingSlot((child.props as { children?: React.ReactNode }).children, slots);\n  });\n}\n","import type { DialogBorderRadius, DialogSize } from './Dialog.base';\nimport { alpha } from '../../../tokens/color';\nimport { ABSOLUTE_INK } from '../../../tokens/ink.core';\nimport type { UiShadow } from '../../../tokens/shadow';\n\n/**\n * THE NUMBERS BOTH `Dialog` RENDERERS DRAW WITH.\n *\n * `Dialog.styles.ts` / `Dialog.tsx` (MUI) and `Dialog.look.native.ts` /\n * `Dialog.native.tsx` (React Native) read this one table. Spacing is in\n * SPACING UNITS wherever the web writes `theme.spacing(n)`; everything else is\n * px, a ratio or an alpha. Shadows are `UiShadow`s — see `src/tokens/shadow.ts`\n * for why they have a shape rather than a string.\n */\n\n/* ── The paper ────────────────────────────────────────────────────────────── */\n\n/** `theme.spacing(n)` per named radius; `lg` is the default. */\nexport const DIALOG_RADIUS_UNITS: Record<DialogBorderRadius, number> = {\n  none: 0,\n  sm: 0.5,\n  md: 1,\n  lg: 2,\n  xl: 3,\n};\n\n/** How wide the paper may grow, per size, in px. Also the drawer's fixed width. */\nexport const DIALOG_MAX_WIDTH: Record<DialogSize, number> = {\n  xs: 400,\n  sm: 600,\n  md: 800,\n  lg: 1000,\n  xl: 1200,\n};\n\n/** The paper is 90% of the viewport up to its max width, `theme.spacing(2)` clear of the edge. */\nexport const DIALOG_WIDTH_PERCENT = 90;\nexport const DIALOG_MARGIN_UNITS = 2;\n\n/** The hairline `glass` draws. */\nexport const DIALOG_BORDER_WIDTH = 1;\n\n/**\n * MUI's `theme.shadows[24]` — the elevation a `Dialog`'s Paper paints.\n *\n * Restated rather than derived because the web never names it: `MuiDialog`\n * passes `elevation={24}` to its Paper, and React Native has no Paper to\n * inherit that from.\n */\nexport const DIALOG_PAPER_SHADOW: readonly UiShadow[] = [\n  { offsetX: 0, offsetY: 11, blurRadius: 15, spreadDistance: -7, color: alpha(ABSOLUTE_INK.black, 0.2) },\n  { offsetX: 0, offsetY: 24, blurRadius: 38, spreadDistance: 3, color: alpha(ABSOLUTE_INK.black, 0.14) },\n  { offsetX: 0, offsetY: 9, blurRadius: 46, spreadDistance: 8, color: alpha(ABSOLUTE_INK.black, 0.12) },\n];\n\n/* ── Variants and decorations ─────────────────────────────────────────────── */\n\n/** `glass`: a 0.1 wash of the paper behind a 20px blur, inside a primary hairline. */\nexport const DIALOG_GLASS = {\n  backgroundAlpha: 0.1,\n  blurPx: 20,\n  borderAlpha: 0.2,\n  shadow: { offsetY: 8, blurRadius: 32, alpha: 0.1 },\n} as const;\n\n/** `gradient`: a faint primary-into-secondary wash at 135°, over a 10px blur. */\nexport const DIALOG_GRADIENT = { angleDeg: 135, stopAlpha: 0.1, blurPx: 10 } as const;\n\n/** `glow`: a 40px halo of the primary hue. */\nexport const DIALOG_GLOW = { blurRadius: 40, alpha: 0.3 } as const;\n\n/**\n * `pulse`: a ring of the primary hue that grows 20px out of the paper's edge and\n * fades, every two seconds. The web draws it as an `::after` box-shadow spread\n * behind the paper (`z-index: -1`).\n */\nexport const DIALOG_PULSE = {\n  alpha: 0.3,\n  durationMs: 2000,\n  spread: 20,\n  /** The fraction of the cycle the ring is still visible for. */\n  fadeAt: 0.7,\n  zIndex: -1,\n} as const;\n\n/**\n * The scrim: half-black, or a fifth of it behind an 8px blur for `glass`.\n *\n * It paints on BOTH renderers whatever `backdrop` is set to. The web reads that\n * prop as `BackdropComponent={backdrop ? Backdrop : undefined}`, and `undefined`\n * is exactly what MUI falls back to `Backdrop` for — so the scrim is there\n * either way. Native mirrors that rather than inventing a difference; fixing it\n * is a web change, made once, for both.\n */\nexport const DIALOG_BACKDROP = { alpha: { plain: 0.5, glass: 0.2 }, blurPx: 8 } as const;\n\n/* ── The slots ────────────────────────────────────────────────────────────── */\n\n/** Raw children (no `DialogContent`/`DialogActions`) get this padding, in spacing units. */\nexport const DIALOG_BODY_PADDING_UNITS = {\n  horizontal: 3,\n  bottom: 2.5,\n  top: 2.5,\n  /** Tighter under a title, whose own bottom padding is most of the gap. */\n  topUnderTitle: 0.5,\n} as const;\n\n/** A `DialogHeader` given raw `children` is a padded box over a hairline instead. */\nexport const DIALOG_HEADER_CHILDREN_PADDING_UNITS = 2;\n\n/**\n * The title row: MUI's `DialogTitle` padding in px, and the bottom the web\n * overrides in spacing units — tighter when a subtitle follows it.\n */\nexport const DIALOG_TITLE = {\n  padding: { top: 16, horizontal: 24 },\n  paddingBottomUnits: { withSubtitle: 1, plain: 2 },\n  subtitleGapUnits: 0.5,\n} as const;\n\n/**\n * The close button: MUI's `IconButton` at its default 8px padding around a\n * 24px glyph, on a circular hover wash.\n */\nexport const DIALOG_CLOSE_BUTTON = { padding: 8, iconSize: 24 } as const;\n\n/** `DialogContent`: `theme.spacing(3)`, tightened by `dense`. */\nexport const DIALOG_CONTENT_PADDING_UNITS = { normal: 3, dense: 1.5 } as const;\n\n/**\n * Top padding for a body that sits directly under the title.\n *\n * MUI zeroes it there, assuming the title's own bottom padding is the whole\n * gap. That assumption breaks for a body opening with an outlined field: a\n * filled field floats its label ABOVE the input's border box, and the body is a\n * clipping box, so the label gets sliced in half (FUT-544). 12px clears the\n * shrunk label's 9px overhang and leaves the gap visually tight.\n */\nexport const DIALOG_TITLED_BODY_PADDING_TOP_UNITS = 1.5;\n\n/** `DialogActions`: `theme.spacing(2)` around, and one unit between by default. */\nexport const DIALOG_ACTIONS = { paddingUnits: 2, defaultSpacingUnits: 1 } as const;\n","import type { ViewStyle } from 'react-native';\n\nimport type { DialogBorderRadius, DialogSize, DialogVariant } from './Dialog.base';\nimport {\n  DIALOG_BACKDROP,\n  DIALOG_BORDER_WIDTH,\n  DIALOG_GLASS,\n  DIALOG_GLOW,\n  DIALOG_MARGIN_UNITS,\n  DIALOG_MAX_WIDTH,\n  DIALOG_PAPER_SHADOW,\n  DIALOG_RADIUS_UNITS,\n} from './Dialog.metrics';\nimport { alpha } from '../../../tokens/color';\nimport { BLACK, halo } from '../../../tokens/shadow';\nimport type { UiTheme } from '../../../tokens/theme';\n\n/**\n * WHAT THE NATIVE `Dialog` PAINTS — the arithmetic, with no JSX in sight.\n *\n * `variantStylesOf` builds one `sx` by spreading base, then the decorations\n * (`glow`, `pulse`), then the variant's own surface; whichever wrote a property\n * last wins. The composition here spreads the SAME things in the SAME order, so\n * `glow` survives on a `default` paper (whose surface declares no shadow) and is\n * buried by a `glass` one, on both renderers.\n */\n\n/** The named radius as a length. */\nexport function dialogRadius(theme: UiTheme, radius: DialogBorderRadius): number {\n  return theme.spacing(DIALOG_RADIUS_UNITS[radius] ?? DIALOG_RADIUS_UNITS.lg);\n}\n\n/** The scrim behind the paper: half-black, or a fifth of it for `glass`. */\nexport function dialogBackdrop(glass: boolean): ViewStyle {\n  return {\n    backgroundColor: alpha(BLACK, glass ? DIALOG_BACKDROP.alpha.glass : DIALOG_BACKDROP.alpha.plain),\n  };\n}\n\n/** The glass surface, shared by `variant=\"glass\"` and the `glass` flag. */\nfunction glassSurface(theme: UiTheme): ViewStyle {\n  return {\n    backgroundColor: alpha(theme.palette.background.paper, DIALOG_GLASS.backgroundAlpha),\n    borderWidth: DIALOG_BORDER_WIDTH,\n    borderStyle: 'solid',\n    borderColor: alpha(theme.palette.primary.main, DIALOG_GLASS.borderAlpha),\n  };\n}\n\nexport interface DialogLookArgs {\n  variant: DialogVariant;\n  size: DialogSize;\n  borderRadius: DialogBorderRadius;\n  glass: boolean;\n  glow: boolean;\n  pulse: boolean;\n}\n\nexport interface DialogLook {\n  /** Where the paper sits inside the modal, and how far in from the edges. */\n  overlay: ViewStyle;\n  paper: ViewStyle;\n  /** The paper's corner radius, for the pulse ring to follow. */\n  radius: number;\n}\n\n/** The centred paper of `default` and `glass`, before the variant paints over it. */\nfunction centredOverlay(theme: UiTheme): ViewStyle {\n  return {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n    // The web gives the PAPER `margin: theme.spacing(2)`; an inset on the\n    // overlay is the same gap and leaves the paper free to be `100%` wide.\n    padding: theme.spacing(DIALOG_MARGIN_UNITS),\n  };\n}\n\nfunction variantPaper(theme: UiTheme, a: DialogLookArgs, radius: number): ViewStyle {\n  switch (a.variant) {\n    case 'glass':\n      return {\n        ...glassSurface(theme),\n        boxShadow: [\n          {\n            offsetX: 0,\n            offsetY: DIALOG_GLASS.shadow.offsetY,\n            blurRadius: DIALOG_GLASS.shadow.blurRadius,\n            spreadDistance: 0,\n            color: alpha(BLACK, DIALOG_GLASS.shadow.alpha),\n          },\n        ],\n      };\n    case 'fullscreen':\n      return { borderRadius: 0, width: '100%', height: '100%', maxWidth: undefined };\n    case 'drawer':\n      return {\n        // SQUARE, because that is what the web paints. Two things have to fail\n        // for a drawer to have a corner there and both do: the `sx` builds\n        // `${radius}px 0 0 ${radius}px` out of `theme.spacing()`, which already\n        // returns a px string, so the declaration reads `16pxpx 0 0 16pxpx` and\n        // the browser drops it; and that `sx` lands on a plain `Box` INSIDE the\n        // Drawer, whose own Paper MUI renders with `square: true`. Nothing is\n        // left to round the corners. See NATIVE-NOTES.md.\n        borderRadius: 0,\n        width: DIALOG_MAX_WIDTH[a.size] ?? DIALOG_MAX_WIDTH.md,\n        maxWidth: '100%',\n        height: '100%',\n        maxHeight: undefined,\n      };\n    default:\n      return a.glass ? { ...glassSurface(theme), borderRadius: radius } : {};\n  }\n}\n\n/** `fullscreen` and `drawer` fill the screen, so neither is inset or centred. */\nfunction overlayFor(theme: UiTheme, variant: DialogVariant): ViewStyle {\n  if (variant === 'fullscreen') return { flex: 1 };\n  if (variant === 'drawer') return { flex: 1, alignItems: 'flex-end' };\n  if (variant === 'bottom-sheet') return { ...centredOverlay(theme), justifyContent: 'flex-end' };\n  return centredOverlay(theme);\n}\n\n/**\n * The overlay's bottom inset while the soft keyboard covers `overlap` dp of it\n * (FUT-3021), or nothing while it covers none.\n *\n * The inset grows by exactly the overlap, on top of the margin the variant\n * already keeps, so the space the paper may fill — its `maxHeight: '100%'`, or\n * the `height: '100%'` of `fullscreen` and `drawer` — shrinks by the same\n * amount and ends where the keyboard starts. A centred paper re-centres in what\n * is left, and a body taller than that scrolls inside `DialogContent` with the\n * actions still on screen.\n */\nexport function dialogKeyboardLift(theme: UiTheme, variant: DialogVariant, overlap: number): ViewStyle | null {\n  if (overlap <= 0) return null;\n  const margin = variant === 'fullscreen' || variant === 'drawer' ? 0 : theme.spacing(DIALOG_MARGIN_UNITS);\n  return { paddingBottom: margin + overlap };\n}\n\n/**\n * Everything the dialog paints, decided once per render.\n *\n * The base carries what MUI's `Paper` gives every dialog — the paper colour and\n * `shadows[24]` — because React Native has no Paper to inherit them from; a\n * `glow` or a variant shadow then overrides it exactly as the `sx` does.\n *\n * `overflow` clips the paper's children to its corners, as MUI's own\n * `overflow-y: auto` does — except under `pulse` or `glow`, which have to paint\n * OUTSIDE the paper and are clipped by the view's own overflow on a device.\n */\nexport function dialogLook(theme: UiTheme, a: DialogLookArgs): DialogLook {\n  const radius = dialogRadius(theme, a.borderRadius);\n\n  const base: ViewStyle = {\n    position: 'relative',\n    borderRadius: radius,\n    backgroundColor: theme.palette.background.paper,\n    boxShadow: DIALOG_PAPER_SHADOW,\n    width: '100%',\n    maxWidth: DIALOG_MAX_WIDTH[a.size] ?? DIALOG_MAX_WIDTH.md,\n    maxHeight: '100%',\n    overflow: a.pulse || a.glow ? 'visible' : 'hidden',\n  };\n\n  return {\n    radius,\n    overlay: overlayFor(theme, a.variant),\n    paper: {\n      ...base,\n      ...(a.glow\n        ? { boxShadow: halo(DIALOG_GLOW.blurRadius, alpha(theme.palette.primary.main, DIALOG_GLOW.alpha)) }\n        : null),\n      ...variantPaper(theme, a, radius),\n    },\n  };\n}\n","import * as React from 'react';\nimport {\n  Pressable,\n  ScrollView,\n  StyleSheet,\n  Text as RNText,\n  View,\n  type TextStyle,\n  type ViewStyle,\n} from 'react-native';\n\nimport {\n  DIALOG_ACTIONS,\n  DIALOG_CLOSE_BUTTON,\n  DIALOG_CONTENT_PADDING_UNITS,\n  DIALOG_HEADER_CHILDREN_PADDING_UNITS,\n  DIALOG_TITLE,\n  DIALOG_TITLED_BODY_PADDING_TOP_UNITS,\n} from './Dialog.metrics';\nimport type {\n  DialogActionsAlignment,\n  DialogActionsProps,\n  DialogContentProps,\n  DialogHeaderProps,\n} from './Dialog.types.native';\nimport { EN_US_UI_LABELS } from '../../../en-US.labels';\nimport { Icon } from '../../../icons/Icon.native';\nimport { childTestId, slotTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { renderTextChildren } from '../../../platform/text-children';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\nimport { muiTypeStyle } from '../../../tokens/mui-type';\nimport type { UiTheme } from '../../../tokens/theme';\n\n/**\n * THE THREE SLOTS A DIALOG IS BUILT OUT OF, ON REACT NATIVE.\n *\n * The web overrides only padding, alignment and the dividers, so the rest of\n * the numbers are MUI's own and are restated in `Dialog.metrics.ts` rather than\n * re-invented.\n */\n\n/**\n * Is there a title above this body?\n *\n * The web asks the DOM — `.MuiDialogTitle-root + &` — because only the CSS knows\n * which `DialogContent` actually FOLLOWS the title. React Native has no sibling\n * selector, so `Dialog` says so through context instead; the difference is that\n * a second `DialogContent` further down gets the tighter top padding too.\n */\nexport const DialogTitledContext = React.createContext(false);\n\n/** The body text of a slot, in MUI's `body1`, so a bare string is not unstyled. */\nexport const dialogBodyTextStyle = (theme: UiTheme): TextStyle => ({\n  ...muiTypeStyle(theme, 'body1'),\n  color: theme.palette.text.primary,\n});\n\n/** MUI's dialog title: `h6`, in the body ink. */\nexport const dialogTitleStyle = (theme: UiTheme): TextStyle => ({\n  ...muiTypeStyle(theme, 'h6'),\n  color: theme.palette.text.primary,\n});\n\n/** The subtitle under it: `body2`, muted, one half-unit down. */\nexport const dialogSubtitleStyle = (theme: UiTheme): TextStyle => ({\n  ...muiTypeStyle(theme, 'body2'),\n  color: theme.palette.text.secondary,\n  marginTop: theme.spacing(DIALOG_TITLE.subtitleGapUnits),\n});\n\nfunction CloseButton({\n  onPress,\n  testID,\n  label,\n}: {\n  onPress: () => void;\n  testID: string;\n  label: string;\n}): React.JSX.Element {\n  const theme = useUiTheme();\n  return (\n    <Pressable\n      role=\"button\"\n      aria-label={label}\n      testID={testID}\n      onPress={onPress}\n      style={({ pressed }) => [\n        styles.close,\n        pressed ? { backgroundColor: theme.palette.action.hover } : null,\n      ]}\n    >\n      <Icon name=\"Close\" size={DIALOG_CLOSE_BUTTON.iconSize} color={theme.palette.text.secondary} />\n    </Pressable>\n  );\n}\n\nexport function DialogHeader({\n  children,\n  title,\n  subtitle,\n  showCloseButton = true,\n  closeLabel = EN_US_UI_LABELS.common.close,\n  onClose,\n  ...others\n}: DialogHeaderProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const { style, ...viewProps } = withoutTestIdProps(others);\n\n  if (children) {\n    return (\n      <View\n        testID={slotTestId(others, 'header', 'dialog')}\n        style={[\n          {\n            padding: theme.spacing(DIALOG_HEADER_CHILDREN_PADDING_UNITS),\n            borderBottomWidth: 1,\n            borderBottomColor: theme.palette.divider,\n            borderStyle: 'solid',\n          },\n          style,\n        ]}\n        {...viewProps}\n      >\n        {renderTextChildren(children, dialogBodyTextStyle(theme))}\n      </View>\n    );\n  }\n\n  const paddingBottom = theme.spacing(\n    subtitle ? DIALOG_TITLE.paddingBottomUnits.withSubtitle : DIALOG_TITLE.paddingBottomUnits.plain,\n  );\n\n  return (\n    <View\n      testID={slotTestId(others, 'title', 'dialog')}\n      style={[styles.header, { paddingBottom }, style]}\n      {...viewProps}\n    >\n      <View style={styles.headerText}>\n        {/*\n          MUI's `DialogTitle` renders `component: \"h2\"`, so the web dialog has a\n          heading and the native one had none. `role`/`aria-level` are what\n          react-native-web maps to an `<h2>`; a device reads the same pair\n          through `accessibilityRole=\"header\"`, which RN derives from `role`.\n        */}\n        <RNText role=\"heading\" aria-level={2} style={dialogTitleStyle(theme)}>\n          {title}\n        </RNText>\n        {subtitle ? <RNText style={dialogSubtitleStyle(theme)}>{subtitle}</RNText> : null}\n      </View>\n      {showCloseButton && onClose ? (\n        <CloseButton\n          onPress={onClose}\n          label={closeLabel}\n          testID={childTestId(others, 'close', 'dialog')}\n        />\n      ) : null}\n    </View>\n  );\n}\n\nDialogHeader.displayName = 'DialogHeader';\n\nexport function DialogContent({\n  children,\n  dividers = false,\n  dense = false,\n  ...others\n}: DialogContentProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const titled = React.useContext(DialogTitledContext);\n  const { style, ...viewProps } = withoutTestIdProps(others);\n  const padding = theme.spacing(\n    dense ? DIALOG_CONTENT_PADDING_UNITS.dense : DIALOG_CONTENT_PADDING_UNITS.normal,\n  );\n  const paddingTop = titled\n    ? theme.spacing(DIALOG_TITLED_BODY_PADDING_TOP_UNITS)\n    : padding;\n\n  return (\n    <ScrollView\n      testID={slotTestId(others, 'content', 'dialog')}\n      style={[\n        styles.content,\n        dividers\n          ? {\n              borderTopWidth: 1,\n              borderBottomWidth: 1,\n              borderStyle: 'solid',\n              borderColor: theme.palette.divider,\n            }\n          : null,\n        style,\n      ]}\n      contentContainerStyle={{ padding, paddingTop }}\n      {...viewProps}\n    >\n      {renderTextChildren(children, dialogBodyTextStyle(theme))}\n    </ScrollView>\n  );\n}\n\nDialogContent.displayName = 'DialogContent';\n\nconst JUSTIFY: Record<DialogActionsAlignment, NonNullable<ViewStyle['justifyContent']>> = {\n  left: 'flex-start',\n  center: 'center',\n  right: 'flex-end',\n  'space-between': 'space-between',\n};\n\nexport function DialogActions({\n  children,\n  alignment = 'right',\n  spacing = DIALOG_ACTIONS.defaultSpacingUnits,\n  ...others\n}: DialogActionsProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const { style, ...viewProps } = withoutTestIdProps(others);\n\n  return (\n    <View\n      testID={slotTestId(others, 'actions', 'dialog')}\n      style={[\n        styles.actions,\n        {\n          padding: theme.spacing(DIALOG_ACTIONS.paddingUnits),\n          justifyContent: JUSTIFY[alignment],\n          gap: theme.spacing(spacing),\n        },\n        style,\n      ]}\n      {...viewProps}\n    >\n      {renderTextChildren(children, dialogBodyTextStyle(theme))}\n    </View>\n  );\n}\n\nDialogActions.displayName = 'DialogActions';\n\nconst styles = StyleSheet.create({\n  header: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    flexGrow: 0,\n    flexShrink: 0,\n    paddingTop: DIALOG_TITLE.padding.top,\n    paddingHorizontal: DIALOG_TITLE.padding.horizontal,\n  },\n  headerText: {\n    flexShrink: 1,\n  },\n  close: {\n    padding: DIALOG_CLOSE_BUTTON.padding,\n    borderRadius: 9999,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  content: {\n    flexGrow: 1,\n    flexShrink: 1,\n  },\n  actions: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    flexGrow: 0,\n    flexShrink: 0,\n  },\n});\n","import * as React from 'react';\nimport {\n  Keyboard,\n  Platform,\n  type KeyboardEvent,\n  type KeyboardEventName,\n  type LayoutChangeEvent,\n} from 'react-native';\n\n/**\n * HOW FAR THE SOFT KEYBOARD COVERS A FULL-WINDOW VIEW, AND NOTHING MORE.\n *\n * React Native's `Modal` asks Android for `SOFT_INPUT_ADJUST_RESIZE`, and under\n * edge-to-edge that asks for nothing: the window keeps its full height and the\n * keyboard is drawn over it. iOS never resized a modal at all. So an overlay\n * that fills the modal has its bottom under the keyboard, and whatever sits\n * there — a dialog's actions — is hidden until the keyboard goes away.\n *\n * This reads the keyboard's own top edge from the `Keyboard` events and the\n * view's own bottom edge from its layout, and answers the difference. Reading\n * the OVERLAP rather than the keyboard's height is what keeps it right when the\n * window DID resize (a host that is not edge-to-edge): the view then already\n * ends at the keyboard, the overlap is zero, and nothing is lifted twice. No\n * soft-input mode is set here, deliberately — a second one would fight the one\n * `Modal` already asks for.\n *\n * The view's layout `y` is relative to its parent, so the view is expected to\n * be the root of a window that starts at the top of the screen — which a\n * `transparent` modal is, on iOS and under Android edge-to-edge alike.\n */\nexport function keyboardOverlap(viewBottom: number | null, keyboardTop: number | null): number {\n  if (viewBottom === null || keyboardTop === null) return 0;\n  return Math.max(0, viewBottom - keyboardTop);\n}\n\n/** iOS announces the keyboard before it moves; Android only once it has. */\nconst KEYBOARD_EVENTS: { show: KeyboardEventName; hide: KeyboardEventName } =\n  Platform.OS === 'ios'\n    ? { show: 'keyboardWillShow', hide: 'keyboardWillHide' }\n    : { show: 'keyboardDidShow', hide: 'keyboardDidHide' };\n\nexport interface KeyboardOverlap {\n  /** How many dp of the view the keyboard covers; `0` while it is down. */\n  overlap: number;\n  /** Goes on the view being measured. */\n  onLayout: (event: LayoutChangeEvent) => void;\n}\n\n/**\n * The keyboard's overlap with the view `onLayout` is put on. Android re-sends\n * `keyboardDidShow` when the keyboard changes height while it stays up (an\n * emoji panel, a suggestion strip), so the overlap follows those too.\n */\nexport function useKeyboardOverlap(): KeyboardOverlap {\n  const [viewBottom, setViewBottom] = React.useState<number | null>(null);\n  const [keyboardTop, setKeyboardTop] = React.useState<number | null>(null);\n\n  React.useEffect(() => {\n    const shown = Keyboard.addListener(KEYBOARD_EVENTS.show, (event: KeyboardEvent) => {\n      setKeyboardTop(event.endCoordinates.screenY);\n    });\n    const hidden = Keyboard.addListener(KEYBOARD_EVENTS.hide, () => {\n      setKeyboardTop(null);\n    });\n    return () => {\n      shown.remove();\n      hidden.remove();\n    };\n  }, []);\n\n  const onLayout = React.useCallback((event: LayoutChangeEvent) => {\n    const { y, height } = event.nativeEvent.layout;\n    setViewBottom(y + height);\n  }, []);\n\n  return { overlap: keyboardOverlap(viewBottom, keyboardTop), onLayout };\n}\n"],"mappings":"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","names":["React","Pressable","ScrollView","StyleSheet","View","React","React","jsx","jsxs","styles","StyleSheet","ScrollView","View","Pressable"]}

package/dist/native/form/Button.js

@@ -1,9 +1,10 @@
 import {
   Button
-} from "../chunks/chunk-BXNZHDXK.js";
+} from "../chunks/chunk-67CYDCHZ.js";
 import "../chunks/chunk-3JBZE4I6.js";
 import "../chunks/chunk-ZRQHLTYG.js";
 import "../chunks/chunk-5GJ5OG5R.js";
+import "../chunks/chunk-DUELD4HY.js";
 import "../chunks/chunk-AR5O4BEY.js";
 import "../chunks/chunk-ZYSOBULX.js";
 import "../chunks/chunk-DNTO2D5M.js";

package/dist/native/form/Checkbox.js

@@ -10,6 +10,9 @@ import {
 import {
   Icon
 } from "../chunks/chunk-RHD3625Y.js";
+import {
+  EN_US_UI_LABELS
+} from "../chunks/chunk-DUELD4HY.js";
 import {
   muiSize
 } from "../chunks/chunk-5WLOVHKK.js";
@@ -130,7 +133,7 @@ function CheckboxBox(props) {
             style: styles.spinner,
             size: CHECKBOX_SPINNER.size,
             color: theme.palette.primary.main,
-            accessibilityLabel: "loading"
+            accessibilityLabel: props.loadingLabel
           }
         ) : null
       ]
@@ -162,6 +165,7 @@ var Checkbox = React.forwardRef((rawProps, ref) => {
     error,
     helperText,
     loading,
+    loadingLabel = EN_US_UI_LABELS.common.loading,
     ripple,
     glow,
     pulse: _pulse,
@@ -198,6 +202,7 @@ var Checkbox = React.forwardRef((rawProps, ref) => {
       indeterminate: Boolean(indeterminate),
       inactive,
       loading: Boolean(loading),
+      loadingLabel,
       glow,
       ripple,
       variant,

package/dist/native/form/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/form/Checkbox/Checkbox.native.tsx","../../../src/components/form/Checkbox/Checkbox.helpers.ts","../../../src/components/form/Checkbox/Checkbox.metrics.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n  ActivityIndicator,\n  Platform,\n  Pressable,\n  StyleSheet,\n  Text as RNText,\n  View,\n  type GestureResponderEvent,\n  type TextStyle,\n  type ViewStyle,\n} from 'react-native';\n\nimport { makeTestId, resolveCheckboxProps } from './Checkbox.helpers';\nimport {\n  CHECKBOX_GLOW,\n  CHECKBOX_GLYPH,\n  CHECKBOX_HELPER,\n  CHECKBOX_LABEL,\n  CHECKBOX_PADDING,\n  CHECKBOX_SPINNER,\n  CHECKBOX_VARIANT,\n  effectInk,\n  glyphSize,\n  resolveCheckboxSize,\n} from './Checkbox.metrics';\nimport type { CheckboxProps } from './Checkbox.types.native';\nimport { Icon } from '../../../icons/Icon.native';\nimport type { IconName } from '../../../icons/Icon.types';\nimport { webKeyDown } from '../../../platform/aria';\nimport { resolveTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\nimport { alpha } from '../../../tokens/color';\nimport type { UiTheme } from '../../../tokens/theme';\n\n/** Which of MUI's three glyphs the box is in right now. */\nfunction glyphFor(checked: boolean, indeterminate: boolean): IconName {\n  if (indeterminate) return CHECKBOX_GLYPH.indeterminate;\n  return checked ? CHECKBOX_GLYPH.checked : CHECKBOX_GLYPH.unchecked;\n}\n\n/**\n * The ink the box is drawn in.\n *\n * MUI's own rule paints a checked box in `palette[color].main`, but\n * `Checkbox.tsx` overrides `.Mui-checked` with `primary.main` and wins on\n * source order — so every colour checks blue on the web, and here too.\n */\nfunction glyphInk(theme: UiTheme, checked: boolean, indeterminate: boolean, disabled: boolean): string {\n  if (disabled) return theme.palette.action.disabled;\n  if (checked || indeterminate) return theme.palette.primary.main;\n  return theme.palette.text.secondary;\n}\n\n/** `glow` as a shadow; the web breathes it between two blurs, which needs keyframes. */\nfunction glowStyle(): ViewStyle {\n  return Platform.select<ViewStyle>({\n    android: { elevation: CHECKBOX_GLOW.blur.to / 2 },\n    default: {\n      shadowColor: effectInk(1),\n      shadowOpacity: CHECKBOX_GLOW.alpha.from,\n      shadowRadius: CHECKBOX_GLOW.blur.from,\n      shadowOffset: { width: 0, height: 0 },\n    },\n  });\n}\n\n/** The `rounded` and `toggle` variants' corner and scale, on the glyph's own box. */\nfunction variantStyle(variant: keyof typeof CHECKBOX_VARIANT, size: number): ViewStyle {\n  const treatment = CHECKBOX_VARIANT[variant];\n  if (treatment.radius === undefined) return {};\n  return {\n    overflow: 'hidden',\n    borderRadius: typeof treatment.radius === 'number' ? treatment.radius : size / 2,\n    ...(treatment.scale === undefined ? {} : { transform: [{ scale: treatment.scale }] }),\n  };\n}\n\ninterface BoxProps {\n  boxRef: React.ForwardedRef<View>;\n  testID: string;\n  checked: boolean;\n  indeterminate: boolean;\n  inactive: boolean;\n  loading: boolean;\n  glow: boolean;\n  ripple: boolean;\n  variant: keyof typeof CHECKBOX_VARIANT;\n  size: number;\n  label?: string;\n  onToggle: (event?: GestureResponderEvent) => void;\n  rest: Record<string, unknown>;\n}\n\n/** The box itself: MUI's glyph inside `SwitchBase`'s 9px of padding. */\nfunction CheckboxBox(props: BoxProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const { checked, indeterminate, inactive, size, variant } = props;\n  const ink = glyphInk(theme, checked, indeterminate, inactive);\n\n  return (\n    <Pressable\n      ref={props.boxRef}\n      testID={props.testID}\n      role=\"checkbox\"\n      aria-checked={indeterminate ? 'mixed' : checked}\n      aria-disabled={inactive}\n      aria-label={props.label}\n      disabled={inactive}\n      onPress={props.onToggle}\n      android_ripple={\n        props.ripple && !inactive\n          ? { color: alpha(theme.palette.primary.main, 0.2), borderless: true }\n          : undefined\n      }\n      {...webKeyDown((event) => {\n        if (event.key === ' ' || event.key === 'Spacebar') props.onToggle();\n      })}\n      style={[styles.box, props.glow ? glowStyle() : null]}\n      {...props.rest}\n    >\n      <View style={variantStyle(variant, size)}>\n        <Icon name={glyphFor(checked, indeterminate)} size={size} color={ink} />\n      </View>\n      {props.loading ? (\n        <ActivityIndicator\n          style={styles.spinner}\n          size={CHECKBOX_SPINNER.size}\n          color={theme.palette.primary.main}\n          accessibilityLabel=\"loading\"\n        />\n      ) : null}\n    </Pressable>\n  );\n}\n\n/** MUI's `FormControlLabel` label, in `body2` and the error hue when it errs. */\nfunction labelStyle(theme: UiTheme, error: boolean): TextStyle {\n  return {\n    color: error ? theme.palette.danger.main : theme.palette.text.primary,\n    fontFamily: theme.typography.fontFamily,\n    fontSize: CHECKBOX_LABEL.fontSize,\n    marginLeft: CHECKBOX_LABEL.marginLeft,\n  };\n}\n\n/** `FormHelperText`, four spacing units in and half a unit down. */\nfunction helperStyle(theme: UiTheme, error: boolean): TextStyle {\n  return {\n    color: error ? theme.palette.danger.main : theme.palette.text.secondary,\n    fontFamily: theme.typography.fontFamily,\n    fontSize: CHECKBOX_HELPER.fontSize,\n    lineHeight: CHECKBOX_HELPER.fontSize * CHECKBOX_HELPER.lineHeight,\n    marginLeft: theme.spacing(CHECKBOX_HELPER.marginLeftUnits),\n    marginTop: theme.spacing(CHECKBOX_HELPER.marginTopUnits),\n  };\n}\n\n/**\n * The native `Checkbox`.\n *\n * The box is the glyph MUI's own `Checkbox` draws — `@12-apps/ui/icons`\n * generates its path from the same `@mui/icons-material` — inside\n * `SwitchBase`'s 9px of padding, under a pressable carrying `role=\"checkbox\"`\n * and `aria-checked`: the state the web's hidden `<input type=\"checkbox\">`\n * carries. See `NATIVE-NOTES.md`.\n */\nexport const Checkbox = React.forwardRef<View, CheckboxProps>((rawProps, ref) => {\n  const {\n    variant, label, error, helperText, loading, ripple, glow, pulse: _pulse,\n    indeterminate, disabled, size, checked, defaultChecked,\n    onChange, onClick, onPress, style, ...others\n  } = resolveCheckboxProps(rawProps);\n\n  const theme = useUiTheme();\n  // `Boolean()` rather than a destructuring default for each: every `= false`\n  // is a branch, and there are enough of them here to cost the size gate.\n  const [own, setOwn] = React.useState(Boolean(defaultChecked));\n  const current = checked ?? own;\n  const inactive = Boolean(disabled) || Boolean(loading);\n  const testId = makeTestId(resolveTestId(others));\n\n  const toggle = (event?: GestureResponderEvent): void => {\n    const next = !current;\n    setOwn(next);\n    onChange?.({ target: { checked: next } }, next);\n    if (event === undefined) return;\n    onClick?.(event);\n    onPress?.(event);\n  };\n\n  const box = (\n    <CheckboxBox\n      boxRef={ref}\n      testID={resolveTestId(others, 'checkbox') ?? 'checkbox'}\n      checked={current}\n      indeterminate={Boolean(indeterminate)}\n      inactive={inactive}\n      loading={Boolean(loading)}\n      glow={glow}\n      ripple={ripple}\n      variant={variant}\n      size={glyphSize(resolveCheckboxSize(size))}\n      label={label}\n      onToggle={toggle}\n      rest={withoutTestIdProps(others) as Record<string, unknown>}\n    />\n  );\n\n  if (label === undefined) return box;\n\n  return (\n    <View testID={testId('container')} style={style}>\n      <View style={styles.row}>\n        {box}\n        <RNText style={labelStyle(theme, Boolean(error))}>{label}</RNText>\n      </View>\n      {helperText === undefined ? null : (\n        <RNText testID={testId('helper')} style={helperStyle(theme, Boolean(error))}>\n          {helperText}\n        </RNText>\n      )}\n    </View>\n  );\n});\n\nCheckbox.displayName = 'Checkbox';\n\nconst styles = StyleSheet.create({\n  box: {\n    padding: CHECKBOX_PADDING,\n    alignItems: 'center',\n    justifyContent: 'center',\n    position: 'relative',\n  },\n  row: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  spinner: {\n    position: 'absolute',\n    top: '50%',\n    left: '50%',\n    marginTop: CHECKBOX_SPINNER.offset,\n    marginLeft: CHECKBOX_SPINNER.offset,\n  },\n});\n","import type { CheckboxBaseProps } from './Checkbox.base';\nimport { withDefaults } from '../../../utils/withDefaults';\n\ntype CheckboxDefaultedKeys = 'variant' | 'ripple' | 'glow' | 'pulse';\n\n/**\n * Generic over the renderer's own props, as `resolveButtonProps` is: the web\n * and the native `Checkbox` pass different handler types through, and both come\n * back out untouched.\n */\nexport type ResolvedCheckboxProps<P extends CheckboxBaseProps = CheckboxBaseProps> = P &\n  Required<Pick<CheckboxBaseProps, CheckboxDefaultedKeys>>;\n\nconst CHECKBOX_DEFAULTS: Required<Pick<CheckboxBaseProps, CheckboxDefaultedKeys>> = {\n  variant: 'default',\n  ripple: true,\n  glow: false,\n  pulse: false,\n};\n\nexport const resolveCheckboxProps = <P extends CheckboxBaseProps>(props: P): ResolvedCheckboxProps<P> =>\n  withDefaults(props, CHECKBOX_DEFAULTS as Partial<P>) as ResolvedCheckboxProps<P>;\n\n/** `${dataTestId}-${suffix}`, or `checkbox-${suffix}` when the caller named nothing. */\nexport const makeTestId =\n  (dataTestId?: string) =>\n  (suffix: string): string =>\n    dataTestId ? `${dataTestId}-${suffix}` : `checkbox-${suffix}`;\n","import { alpha } from '../../../tokens/color';\nimport { EFFECT_GLOW } from '../../../tokens/ink.core';\nimport { muiSize } from '../../../tokens/vocabulary';\nimport type { SizeValue } from '../../../tokens/vocabulary';\n\nimport type { CheckboxSize, CheckboxVariant } from './Checkbox.base';\n\nexport type { CheckboxSize } from './Checkbox.base';\n\n/**\n * THE NUMBERS BOTH `Checkbox` RENDERERS DRAW WITH.\n *\n * `Checkbox.tsx` (web, emotion over MUI's `Checkbox`) and\n * `Checkbox.native.tsx` (React Native) read this one table. As with the other\n * fields, some of it is what the web writes itself — the two variants' corner\n * treatment, the glow and pulse keyframes, the helper text's inset — and some\n * is what MUI supplies underneath: `SwitchBase`'s 9px padding, `SvgIcon`'s\n * three sizes, and the ink a box is drawn in.\n */\n\n/** MUI's `SwitchBase`: 9px of padding around the glyph, at every size. */\nexport const CHECKBOX_PADDING = 9;\n\n/**\n * `SvgIcon`'s own three steps. MUI passes the `size` prop straight to the\n * glyph. Typed against {@link CheckboxSize} (declared in `Checkbox.base.ts`,\n * the contract file, since it is part of the public prop type) rather than the\n * other way around, so a step added to one and not the other fails here.\n */\nexport const CHECKBOX_GLYPH_SIZES: Record<CheckboxSize, number> = { small: 20, medium: 24, large: 35 };\n\nexport const glyphSize = (size: CheckboxSize | undefined): number =>\n  CHECKBOX_GLYPH_SIZES[size ?? 'medium'] ?? CHECKBOX_GLYPH_SIZES.medium;\n\n/**\n * `size` at the MUI boundary.\n *\n * A `SizeValue` is translated via `muiSize()` — the pattern `Chip`/`Button`/\n * `Carousel` already follow. MUI's own deprecated word (see\n * {@link CheckboxSize}) is passed through UNCHANGED rather than re-derived,\n * so a caller who has not migrated renders at exactly the size it always has —\n * translating it through `muiSize()` too would not change any of the three\n * words' own geometry, but passing it through untouched is the one route that\n * cannot drift from what \"unchanged\" already means. `undefined` stays\n * `undefined`, so a caller who names no size keeps MUI's own default.\n */\nexport const resolveCheckboxSize = (\n  size: SizeValue | CheckboxSize | undefined,\n): CheckboxSize | undefined => {\n  if (size === undefined) return undefined;\n  if (size === 'small' || size === 'medium' || size === 'large') return size;\n  return muiSize(size);\n};\n\n/**\n * The three glyphs MUI draws, by state.\n *\n * `@12-apps/ui/icons` generates their paths from the same\n * `@mui/icons-material` package MUI's own `Checkbox` imports them from, so the\n * native box is the web box rather than a hand-drawn square.\n */\nexport const CHECKBOX_GLYPH = {\n  checked: 'CheckBox',\n  unchecked: 'CheckBoxOutlineBlank',\n  indeterminate: 'IndeterminateCheckBox',\n} as const;\n\n/**\n * The corner each variant gives the glyph's box.\n *\n * `rounded` is a circle and `toggle` a 12px radius at 1.2 scale — both applied\n * to the SVG's own box on the web, where they show only through what the box\n * clips. Native gives them the same radius and the same scale.\n */\nexport const CHECKBOX_VARIANT: Record<CheckboxVariant, { radius?: number | string; scale?: number }> = {\n  default: {},\n  rounded: { radius: '50%' },\n  toggle: { radius: 12, scale: 1.2 },\n};\n\n/** The wash a hovered box takes, and the 0.3s every state change runs over. */\nexport const CHECKBOX_HOVER_ALPHA = 0.1;\nexport const CHECKBOX_TRANSITION_MS = 300;\n\n/** `loading`: MUI's 20px `CircularProgress`, centred over the box. */\nexport const CHECKBOX_SPINNER = { size: 20, offset: -10 } as const;\n\n/**\n * `glow` and `pulse` are keyed to MUI's DEFAULT blue rather than the theme's\n * primary — `EFFECT_GLOW.muiBlue` (`tokens/ink.core`) — on both renderers.\n */\nexport const CHECKBOX_GLOW = { blur: { from: 5, to: 20 }, alpha: { from: 0.5, to: 0.8 }, ms: 2000 } as const;\nexport const CHECKBOX_PULSE = { spread: 10, alpha: 0.7, ms: 2000 } as const;\n\n/** MUI's default blue at an alpha, as the web's keyframes spell it. */\nexport const effectInk = (alphaValue: number): string => alpha(EFFECT_GLOW.muiBlue, alphaValue);\n\n/** `FormControlLabel`: flush left, its label at MUI's `body2` size. */\nexport const CHECKBOX_LABEL = { marginLeft: 0, fontSize: 14 } as const;\n\n/** `FormHelperText`: four spacing units in, half a unit down. */\nexport const CHECKBOX_HELPER = { marginLeftUnits: 4, marginTopUnits: 0.5, fontSize: 12, lineHeight: 1.66 } as const;\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/form/Checkbox/Checkbox.native.tsx","../../../src/components/form/Checkbox/Checkbox.helpers.ts","../../../src/components/form/Checkbox/Checkbox.metrics.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n  ActivityIndicator,\n  Platform,\n  Pressable,\n  StyleSheet,\n  Text as RNText,\n  View,\n  type GestureResponderEvent,\n  type TextStyle,\n  type ViewStyle,\n} from 'react-native';\n\nimport { makeTestId, resolveCheckboxProps } from './Checkbox.helpers';\nimport {\n  CHECKBOX_GLOW,\n  CHECKBOX_GLYPH,\n  CHECKBOX_HELPER,\n  CHECKBOX_LABEL,\n  CHECKBOX_PADDING,\n  CHECKBOX_SPINNER,\n  CHECKBOX_VARIANT,\n  effectInk,\n  glyphSize,\n  resolveCheckboxSize,\n} from './Checkbox.metrics';\nimport type { CheckboxProps } from './Checkbox.types.native';\nimport { EN_US_UI_LABELS } from '../../../en-US.labels';\nimport { Icon } from '../../../icons/Icon.native';\nimport type { IconName } from '../../../icons/Icon.types';\nimport { webKeyDown } from '../../../platform/aria';\nimport { resolveTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\nimport { alpha } from '../../../tokens/color';\nimport type { UiTheme } from '../../../tokens/theme';\n\n/** Which of MUI's three glyphs the box is in right now. */\nfunction glyphFor(checked: boolean, indeterminate: boolean): IconName {\n  if (indeterminate) return CHECKBOX_GLYPH.indeterminate;\n  return checked ? CHECKBOX_GLYPH.checked : CHECKBOX_GLYPH.unchecked;\n}\n\n/**\n * The ink the box is drawn in.\n *\n * MUI's own rule paints a checked box in `palette[color].main`, but\n * `Checkbox.tsx` overrides `.Mui-checked` with `primary.main` and wins on\n * source order — so every colour checks blue on the web, and here too.\n */\nfunction glyphInk(theme: UiTheme, checked: boolean, indeterminate: boolean, disabled: boolean): string {\n  if (disabled) return theme.palette.action.disabled;\n  if (checked || indeterminate) return theme.palette.primary.main;\n  return theme.palette.text.secondary;\n}\n\n/** `glow` as a shadow; the web breathes it between two blurs, which needs keyframes. */\nfunction glowStyle(): ViewStyle {\n  return Platform.select<ViewStyle>({\n    android: { elevation: CHECKBOX_GLOW.blur.to / 2 },\n    default: {\n      shadowColor: effectInk(1),\n      shadowOpacity: CHECKBOX_GLOW.alpha.from,\n      shadowRadius: CHECKBOX_GLOW.blur.from,\n      shadowOffset: { width: 0, height: 0 },\n    },\n  });\n}\n\n/** The `rounded` and `toggle` variants' corner and scale, on the glyph's own box. */\nfunction variantStyle(variant: keyof typeof CHECKBOX_VARIANT, size: number): ViewStyle {\n  const treatment = CHECKBOX_VARIANT[variant];\n  if (treatment.radius === undefined) return {};\n  return {\n    overflow: 'hidden',\n    borderRadius: typeof treatment.radius === 'number' ? treatment.radius : size / 2,\n    ...(treatment.scale === undefined ? {} : { transform: [{ scale: treatment.scale }] }),\n  };\n}\n\ninterface BoxProps {\n  boxRef: React.ForwardedRef<View>;\n  testID: string;\n  checked: boolean;\n  indeterminate: boolean;\n  inactive: boolean;\n  loading: boolean;\n  loadingLabel: string;\n  glow: boolean;\n  ripple: boolean;\n  variant: keyof typeof CHECKBOX_VARIANT;\n  size: number;\n  label?: string;\n  onToggle: (event?: GestureResponderEvent) => void;\n  rest: Record<string, unknown>;\n}\n\n/** The box itself: MUI's glyph inside `SwitchBase`'s 9px of padding. */\nfunction CheckboxBox(props: BoxProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const { checked, indeterminate, inactive, size, variant } = props;\n  const ink = glyphInk(theme, checked, indeterminate, inactive);\n\n  return (\n    <Pressable\n      ref={props.boxRef}\n      testID={props.testID}\n      role=\"checkbox\"\n      aria-checked={indeterminate ? 'mixed' : checked}\n      aria-disabled={inactive}\n      aria-label={props.label}\n      disabled={inactive}\n      onPress={props.onToggle}\n      android_ripple={\n        props.ripple && !inactive\n          ? { color: alpha(theme.palette.primary.main, 0.2), borderless: true }\n          : undefined\n      }\n      {...webKeyDown((event) => {\n        if (event.key === ' ' || event.key === 'Spacebar') props.onToggle();\n      })}\n      style={[styles.box, props.glow ? glowStyle() : null]}\n      {...props.rest}\n    >\n      <View style={variantStyle(variant, size)}>\n        <Icon name={glyphFor(checked, indeterminate)} size={size} color={ink} />\n      </View>\n      {props.loading ? (\n        <ActivityIndicator\n          style={styles.spinner}\n          size={CHECKBOX_SPINNER.size}\n          color={theme.palette.primary.main}\n          accessibilityLabel={props.loadingLabel}\n        />\n      ) : null}\n    </Pressable>\n  );\n}\n\n/** MUI's `FormControlLabel` label, in `body2` and the error hue when it errs. */\nfunction labelStyle(theme: UiTheme, error: boolean): TextStyle {\n  return {\n    color: error ? theme.palette.danger.main : theme.palette.text.primary,\n    fontFamily: theme.typography.fontFamily,\n    fontSize: CHECKBOX_LABEL.fontSize,\n    marginLeft: CHECKBOX_LABEL.marginLeft,\n  };\n}\n\n/** `FormHelperText`, four spacing units in and half a unit down. */\nfunction helperStyle(theme: UiTheme, error: boolean): TextStyle {\n  return {\n    color: error ? theme.palette.danger.main : theme.palette.text.secondary,\n    fontFamily: theme.typography.fontFamily,\n    fontSize: CHECKBOX_HELPER.fontSize,\n    lineHeight: CHECKBOX_HELPER.fontSize * CHECKBOX_HELPER.lineHeight,\n    marginLeft: theme.spacing(CHECKBOX_HELPER.marginLeftUnits),\n    marginTop: theme.spacing(CHECKBOX_HELPER.marginTopUnits),\n  };\n}\n\n/**\n * The native `Checkbox`.\n *\n * The box is the glyph MUI's own `Checkbox` draws — `@12-apps/ui/icons`\n * generates its path from the same `@mui/icons-material` — inside\n * `SwitchBase`'s 9px of padding, under a pressable carrying `role=\"checkbox\"`\n * and `aria-checked`: the state the web's hidden `<input type=\"checkbox\">`\n * carries. See `NATIVE-NOTES.md`.\n */\nexport const Checkbox = React.forwardRef<View, CheckboxProps>((rawProps, ref) => {\n  const {\n    variant, label, error, helperText, loading, loadingLabel = EN_US_UI_LABELS.common.loading, ripple, glow, pulse: _pulse,\n    indeterminate, disabled, size, checked, defaultChecked,\n    onChange, onClick, onPress, style, ...others\n  } = resolveCheckboxProps(rawProps);\n\n  const theme = useUiTheme();\n  // `Boolean()` rather than a destructuring default for each: every `= false`\n  // is a branch, and there are enough of them here to cost the size gate.\n  const [own, setOwn] = React.useState(Boolean(defaultChecked));\n  const current = checked ?? own;\n  const inactive = Boolean(disabled) || Boolean(loading);\n  const testId = makeTestId(resolveTestId(others));\n\n  const toggle = (event?: GestureResponderEvent): void => {\n    const next = !current;\n    setOwn(next);\n    onChange?.({ target: { checked: next } }, next);\n    if (event === undefined) return;\n    onClick?.(event);\n    onPress?.(event);\n  };\n\n  const box = (\n    <CheckboxBox\n      boxRef={ref}\n      testID={resolveTestId(others, 'checkbox') ?? 'checkbox'}\n      checked={current}\n      indeterminate={Boolean(indeterminate)}\n      inactive={inactive}\n      loading={Boolean(loading)}\n      loadingLabel={loadingLabel}\n      glow={glow}\n      ripple={ripple}\n      variant={variant}\n      size={glyphSize(resolveCheckboxSize(size))}\n      label={label}\n      onToggle={toggle}\n      rest={withoutTestIdProps(others) as Record<string, unknown>}\n    />\n  );\n\n  if (label === undefined) return box;\n\n  return (\n    <View testID={testId('container')} style={style}>\n      <View style={styles.row}>\n        {box}\n        <RNText style={labelStyle(theme, Boolean(error))}>{label}</RNText>\n      </View>\n      {helperText === undefined ? null : (\n        <RNText testID={testId('helper')} style={helperStyle(theme, Boolean(error))}>\n          {helperText}\n        </RNText>\n      )}\n    </View>\n  );\n});\n\nCheckbox.displayName = 'Checkbox';\n\nconst styles = StyleSheet.create({\n  box: {\n    padding: CHECKBOX_PADDING,\n    alignItems: 'center',\n    justifyContent: 'center',\n    position: 'relative',\n  },\n  row: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  spinner: {\n    position: 'absolute',\n    top: '50%',\n    left: '50%',\n    marginTop: CHECKBOX_SPINNER.offset,\n    marginLeft: CHECKBOX_SPINNER.offset,\n  },\n});\n","import type { CheckboxBaseProps } from './Checkbox.base';\nimport { withDefaults } from '../../../utils/withDefaults';\n\ntype CheckboxDefaultedKeys = 'variant' | 'ripple' | 'glow' | 'pulse';\n\n/**\n * Generic over the renderer's own props, as `resolveButtonProps` is: the web\n * and the native `Checkbox` pass different handler types through, and both come\n * back out untouched.\n */\nexport type ResolvedCheckboxProps<P extends CheckboxBaseProps = CheckboxBaseProps> = P &\n  Required<Pick<CheckboxBaseProps, CheckboxDefaultedKeys>>;\n\nconst CHECKBOX_DEFAULTS: Required<Pick<CheckboxBaseProps, CheckboxDefaultedKeys>> = {\n  variant: 'default',\n  ripple: true,\n  glow: false,\n  pulse: false,\n};\n\nexport const resolveCheckboxProps = <P extends CheckboxBaseProps>(props: P): ResolvedCheckboxProps<P> =>\n  withDefaults(props, CHECKBOX_DEFAULTS as Partial<P>) as ResolvedCheckboxProps<P>;\n\n/** `${dataTestId}-${suffix}`, or `checkbox-${suffix}` when the caller named nothing. */\nexport const makeTestId =\n  (dataTestId?: string) =>\n  (suffix: string): string =>\n    dataTestId ? `${dataTestId}-${suffix}` : `checkbox-${suffix}`;\n","import { alpha } from '../../../tokens/color';\nimport { EFFECT_GLOW } from '../../../tokens/ink.core';\nimport { muiSize } from '../../../tokens/vocabulary';\nimport type { SizeValue } from '../../../tokens/vocabulary';\n\nimport type { CheckboxSize, CheckboxVariant } from './Checkbox.base';\n\nexport type { CheckboxSize } from './Checkbox.base';\n\n/**\n * THE NUMBERS BOTH `Checkbox` RENDERERS DRAW WITH.\n *\n * `Checkbox.tsx` (web, emotion over MUI's `Checkbox`) and\n * `Checkbox.native.tsx` (React Native) read this one table. As with the other\n * fields, some of it is what the web writes itself — the two variants' corner\n * treatment, the glow and pulse keyframes, the helper text's inset — and some\n * is what MUI supplies underneath: `SwitchBase`'s 9px padding, `SvgIcon`'s\n * three sizes, and the ink a box is drawn in.\n */\n\n/** MUI's `SwitchBase`: 9px of padding around the glyph, at every size. */\nexport const CHECKBOX_PADDING = 9;\n\n/**\n * `SvgIcon`'s own three steps. MUI passes the `size` prop straight to the\n * glyph. Typed against {@link CheckboxSize} (declared in `Checkbox.base.ts`,\n * the contract file, since it is part of the public prop type) rather than the\n * other way around, so a step added to one and not the other fails here.\n */\nexport const CHECKBOX_GLYPH_SIZES: Record<CheckboxSize, number> = { small: 20, medium: 24, large: 35 };\n\nexport const glyphSize = (size: CheckboxSize | undefined): number =>\n  CHECKBOX_GLYPH_SIZES[size ?? 'medium'] ?? CHECKBOX_GLYPH_SIZES.medium;\n\n/**\n * `size` at the MUI boundary.\n *\n * A `SizeValue` is translated via `muiSize()` — the pattern `Chip`/`Button`/\n * `Carousel` already follow. MUI's own deprecated word (see\n * {@link CheckboxSize}) is passed through UNCHANGED rather than re-derived,\n * so a caller who has not migrated renders at exactly the size it always has —\n * translating it through `muiSize()` too would not change any of the three\n * words' own geometry, but passing it through untouched is the one route that\n * cannot drift from what \"unchanged\" already means. `undefined` stays\n * `undefined`, so a caller who names no size keeps MUI's own default.\n */\nexport const resolveCheckboxSize = (\n  size: SizeValue | CheckboxSize | undefined,\n): CheckboxSize | undefined => {\n  if (size === undefined) return undefined;\n  if (size === 'small' || size === 'medium' || size === 'large') return size;\n  return muiSize(size);\n};\n\n/**\n * The three glyphs MUI draws, by state.\n *\n * `@12-apps/ui/icons` generates their paths from the same\n * `@mui/icons-material` package MUI's own `Checkbox` imports them from, so the\n * native box is the web box rather than a hand-drawn square.\n */\nexport const CHECKBOX_GLYPH = {\n  checked: 'CheckBox',\n  unchecked: 'CheckBoxOutlineBlank',\n  indeterminate: 'IndeterminateCheckBox',\n} as const;\n\n/**\n * The corner each variant gives the glyph's box.\n *\n * `rounded` is a circle and `toggle` a 12px radius at 1.2 scale — both applied\n * to the SVG's own box on the web, where they show only through what the box\n * clips. Native gives them the same radius and the same scale.\n */\nexport const CHECKBOX_VARIANT: Record<CheckboxVariant, { radius?: number | string; scale?: number }> = {\n  default: {},\n  rounded: { radius: '50%' },\n  toggle: { radius: 12, scale: 1.2 },\n};\n\n/** The wash a hovered box takes, and the 0.3s every state change runs over. */\nexport const CHECKBOX_HOVER_ALPHA = 0.1;\nexport const CHECKBOX_TRANSITION_MS = 300;\n\n/** `loading`: MUI's 20px `CircularProgress`, centred over the box. */\nexport const CHECKBOX_SPINNER = { size: 20, offset: -10 } as const;\n\n/**\n * `glow` and `pulse` are keyed to MUI's DEFAULT blue rather than the theme's\n * primary — `EFFECT_GLOW.muiBlue` (`tokens/ink.core`) — on both renderers.\n */\nexport const CHECKBOX_GLOW = { blur: { from: 5, to: 20 }, alpha: { from: 0.5, to: 0.8 }, ms: 2000 } as const;\nexport const CHECKBOX_PULSE = { spread: 10, alpha: 0.7, ms: 2000 } as const;\n\n/** MUI's default blue at an alpha, as the web's keyframes spell it. */\nexport const effectInk = (alphaValue: number): string => alpha(EFFECT_GLOW.muiBlue, alphaValue);\n\n/** `FormControlLabel`: flush left, its label at MUI's `body2` size. */\nexport const CHECKBOX_LABEL = { marginLeft: 0, fontSize: 14 } as const;\n\n/** `FormHelperText`: four spacing units in, half a unit down. */\nexport const CHECKBOX_HELPER = { marginLeftUnits: 4, marginTopUnits: 0.5, fontSize: 12, lineHeight: 1.66 } as const;\n"],"mappings":"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","names":[]}

package/dist/native/form/Input.js

@@ -17,6 +17,9 @@ import {
   webClick,
   webDisabled
 } from "../chunks/chunk-DN73KYIZ.js";
+import {
+  EN_US_UI_LABELS
+} from "../chunks/chunk-DUELD4HY.js";
 import "../chunks/chunk-5WLOVHKK.js";
 import {
   childTestId,
@@ -97,14 +100,18 @@ function Line({
   if (text === void 0) return null;
   return /* @__PURE__ */ jsx(RNText, { style, children: text });
 }
-function Spinner({ color, testID }) {
+function Spinner({
+  color,
+  testID,
+  label
+}) {
   return /* @__PURE__ */ jsx(
     ActivityIndicator,
     {
       testID,
       size: Platform.OS === "ios" ? "small" : INPUT_LOADING.spinnerSize,
       color,
-      accessibilityLabel: "loading"
+      accessibilityLabel: label
     }
   );
 }
@@ -141,6 +148,7 @@ var Input = React.forwardRef((rawProps, ref) => {
     glow,
     pulse,
     loading,
+    loadingLabel = EN_US_UI_LABELS.common.loading,
     disabled,
     required,
     style,
@@ -204,7 +212,7 @@ var Input = React.forwardRef((rawProps, ref) => {
               ...withoutTestIdProps(others)
             }
           ),
-          /* @__PURE__ */ jsx(Slot, { side: "end", children: loading ? /* @__PURE__ */ jsx(Spinner, { color: theme.palette.primary.main, testID: idFor("loading") }) : endAdornment })
+          /* @__PURE__ */ jsx(Slot, { side: "end", children: loading ? /* @__PURE__ */ jsx(Spinner, { color: theme.palette.primary.main, testID: idFor("loading"), label: loadingLabel }) : endAdornment })
         ] }),
         /* @__PURE__ */ jsx(Line, { text: helperText, style: helperStyle(theme, variant, size, state) })
       ]