@kanso-labs/react-native-kanso-ui 0.7.0 → 0.8.0

package/dist/mark/index.js

@@ -1,6 +1,7 @@
 import { useTheme } from "../theme/scope.js";
 import { composeStyles } from "../theme/styles.js";
 import { useTypeRole } from "../typography/roles.js";
+import { useLocaleOf } from "../i18n/provider.js";
 import { PersonGlyph } from "../glyphs/index.js";
 import { useImageLoadingStatus } from "./image.js";
 import { initialOfThing, initialsOfPerson } from "./initials.js";
@@ -38,7 +39,7 @@ const CONTENT = {
 * exported from the package.
 */
 function Mark(t0) {
-	const $ = c(62);
+	const $ = c(40);
 	let imgProps;
 	let kind;
 	let name;
@@ -80,107 +81,66 @@ function Mark(t0) {
 	const theme = useTheme();
 	const label = useTypeRole("labelLarge");
 	const { handlersFor, previous, status } = useImageLoadingStatus(src);
-	let T0;
-	let initialsNode;
+	const own = markStylesOf(theme);
+	const text = initialsStylesOf(theme);
+	const locale = useLocaleOf(void 0);
 	let t3;
-	let t4;
-	let t5;
-	let t6;
-	let t7;
-	let t8;
-	if ($[11] !== decorative || $[12] !== initials || $[13] !== kind || $[14] !== label || $[15] !== name || $[16] !== previous || $[17] !== props || $[18] !== shape || $[19] !== showPersonIcon || $[20] !== size || $[21] !== status || $[22] !== style || $[23] !== theme || $[24] !== tintsFallback || $[25] !== tone) {
-		const own = markStylesOf(theme);
-		const text = initialsStylesOf(theme);
-		let t9;
-		if ($[34] !== initials || $[35] !== name) {
-			t9 = initials(name);
-			$[34] = initials;
-			$[35] = name;
-			$[36] = t9;
-		} else t9 = $[36];
-		const fallback = t9;
-		const named = !decorative && name.trim() !== "";
-		const showsPicture = status === "loaded" || previous !== void 0;
-		initialsNode = null;
-		if (!showsPicture && kind === "person" && fallback === "") {
-			let t10;
-			if ($[37] !== showPersonIcon || $[38] !== size || $[39] !== theme || $[40] !== tone) {
-				t10 = showPersonIcon ? /* @__PURE__ */ jsx(PersonGlyph, {
-					color: theme.colors[CONTENT[tone]],
-					size: DIAMETERS[size] * GLYPH_SHARE
-				}) : null;
-				$[37] = showPersonIcon;
-				$[38] = size;
-				$[39] = theme;
-				$[40] = tone;
-				$[41] = t10;
-			} else t10 = $[41];
-			initialsNode = t10;
-		} else if (!showsPicture) {
-			const initialsText = /* @__PURE__ */ jsx(Text, {
-				allowFontScaling: false,
-				style: composeStyles(label, text[size], text[tone]),
-				children: fallback
-			});
-			initialsNode = tintsFallback ? /* @__PURE__ */ jsx(View, {
-				style: composeStyles(markStyles.fallback, own[tone]),
-				children: initialsText
-			}) : initialsText;
-		}
-		T0 = View;
-		t3 = named ? true : void 0;
-		t4 = decorative ? true : void 0;
-		t5 = named ? name : void 0;
-		t6 = named ? "img" : void 0;
-		t7 = props;
-		t8 = composeStyles(own.base, own[shape], markStyles[size], tintsFallback ? void 0 : own[tone], style);
-		$[11] = decorative;
-		$[12] = initials;
-		$[13] = kind;
-		$[14] = label;
-		$[15] = name;
-		$[16] = previous;
-		$[17] = props;
-		$[18] = shape;
-		$[19] = showPersonIcon;
-		$[20] = size;
-		$[21] = status;
-		$[22] = style;
-		$[23] = theme;
-		$[24] = tintsFallback;
-		$[25] = tone;
-		$[26] = T0;
-		$[27] = initialsNode;
-		$[28] = t3;
-		$[29] = t4;
-		$[30] = t5;
-		$[31] = t6;
-		$[32] = t7;
-		$[33] = t8;
-	} else {
-		T0 = $[26];
-		initialsNode = $[27];
-		t3 = $[28];
-		t4 = $[29];
-		t5 = $[30];
-		t6 = $[31];
-		t7 = $[32];
-		t8 = $[33];
+	if ($[11] !== initials || $[12] !== locale || $[13] !== name) {
+		t3 = initials(name, locale);
+		$[11] = initials;
+		$[12] = locale;
+		$[13] = name;
+		$[14] = t3;
+	} else t3 = $[14];
+	const fallback = t3;
+	const named = !decorative && name.trim() !== "";
+	const showsPicture = status === "loaded" || previous !== void 0;
+	let initialsNode = null;
+	if (!showsPicture && kind === "person" && fallback === "") {
+		let t4;
+		if ($[15] !== showPersonIcon || $[16] !== size || $[17] !== theme || $[18] !== tone) {
+			t4 = showPersonIcon ? /* @__PURE__ */ jsx(PersonGlyph, {
+				color: theme.colors[CONTENT[tone]],
+				size: DIAMETERS[size] * GLYPH_SHARE
+			}) : null;
+			$[15] = showPersonIcon;
+			$[16] = size;
+			$[17] = theme;
+			$[18] = tone;
+			$[19] = t4;
+		} else t4 = $[19];
+		initialsNode = t4;
+	} else if (!showsPicture) {
+		const initialsText = /* @__PURE__ */ jsx(Text, {
+			allowFontScaling: false,
+			style: composeStyles(label, text[size], text[tone]),
+			children: fallback
+		});
+		initialsNode = tintsFallback ? /* @__PURE__ */ jsx(View, {
+			style: composeStyles(markStyles.fallback, own[tone]),
+			children: initialsText
+		}) : initialsText;
 	}
+	const T0 = View;
+	const t4 = named ? true : void 0;
+	const t5 = decorative ? true : void 0;
+	const t6 = named ? name : void 0;
+	const t7 = named ? "img" : void 0;
+	const t8 = composeStyles(own.base, own[shape], markStyles[size], tintsFallback ? void 0 : own[tone], style);
 	let t9;
-	if ($[42] !== previous || $[43] !== resizeMode) {
+	if ($[20] !== previous || $[21] !== resizeMode) {
 		t9 = previous === void 0 ? null : /* @__PURE__ */ jsx(Image, {
 			accessibilityIgnoresInvertColors: true,
 			resizeMode,
 			source: sourceOf(previous),
 			style: markStyles.image
 		}, previous);
-		$[42] = previous;
-		$[43] = resizeMode;
-		$[44] = t9;
-	} else t9 = $[44];
+		$[20] = previous;
+		$[21] = resizeMode;
+		$[22] = t9;
+	} else t9 = $[22];
 	let t10;
-	if ($[45] !== handlersFor || $[46] !== imgProps || $[47] !== resizeMode || $[48] !== src || $[49] !== status) {
+	if ($[23] !== handlersFor || $[24] !== imgProps || $[25] !== resizeMode || $[26] !== src || $[27] !== status) {
 		t10 = src === void 0 || status === "error" ? null : /* @__PURE__ */ jsx(Image, {
 			accessibilityIgnoresInvertColors: true,
 			...imgProps,
@@ -189,21 +149,21 @@ function Mark(t0) {
 			source: sourceOf(src),
 			style: composeStyles(markStyles.image, status === "loaded" ? void 0 : markStyles.imagePending)
 		}, src);
-		$[45] = handlersFor;
-		$[46] = imgProps;
-		$[47] = resizeMode;
-		$[48] = src;
-		$[49] = status;
-		$[50] = t10;
-	} else t10 = $[50];
+		$[23] = handlersFor;
+		$[24] = imgProps;
+		$[25] = resizeMode;
+		$[26] = src;
+		$[27] = status;
+		$[28] = t10;
+	} else t10 = $[28];
 	let t11;
-	if ($[51] !== T0 || $[52] !== initialsNode || $[53] !== t10 || $[54] !== t3 || $[55] !== t4 || $[56] !== t5 || $[57] !== t6 || $[58] !== t7 || $[59] !== t8 || $[60] !== t9) {
+	if ($[29] !== T0 || $[30] !== initialsNode || $[31] !== props || $[32] !== t10 || $[33] !== t4 || $[34] !== t5 || $[35] !== t6 || $[36] !== t7 || $[37] !== t8 || $[38] !== t9) {
 		t11 = /* @__PURE__ */ jsxs(T0, {
-			accessible: t3,
-			"aria-hidden": t4,
-			"aria-label": t5,
-			role: t6,
-			...t7,
+			accessible: t4,
+			"aria-hidden": t5,
+			"aria-label": t6,
+			role: t7,
+			...props,
 			style: t8,
 			children: [
 				initialsNode,
@@ -211,18 +171,18 @@ function Mark(t0) {
 				t10
 			]
 		});
-		$[51] = T0;
-		$[52] = initialsNode;
-		$[53] = t10;
-		$[54] = t3;
-		$[55] = t4;
-		$[56] = t5;
-		$[57] = t6;
-		$[58] = t7;
-		$[59] = t8;
-		$[60] = t9;
-		$[61] = t11;
-	} else t11 = $[61];
+		$[29] = T0;
+		$[30] = initialsNode;
+		$[31] = props;
+		$[32] = t10;
+		$[33] = t4;
+		$[34] = t5;
+		$[35] = t6;
+		$[36] = t7;
+		$[37] = t8;
+		$[38] = t9;
+		$[39] = t11;
+	} else t11 = $[39];
 	return t11;
 }
 function sourceOf(uri) {

package/dist/mark/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ComponentRef","Ref","ImageProps","ImageSourcePropType","ImageStyle","StyleProp","TextStyle","ViewProps","ViewStyle","Image","Text","NativeText","View","ResolvedTheme","MarkSize","MarkTone","PersonGlyph","useTheme","composeStyles","useTypeRole","useImageLoadingStatus","initialOfThing","initialsOfPerson","DIAMETERS","GLYPH_SHARE","initialsStylesOf","markStyles","markStylesOf","MarkImageProps","Pick","MarkProps","Omit","decorative","imgProps","kind","KINDS","name","ref","showPersonIcon","size","src","style","tone","person","initials","resizeMode","shape","tintsFallback","thing","const","CONTENT","Readonly","Record","negative","positive","primary","secondary","tertiary","Mark","t0","$","_c","props","t1","t2","undefined","theme","label","handlersFor","previous","status","T0","initialsNode","t3","t4","t5","t6","t7","t8","own","text","t9","fallback","named","trim","showsPicture","t10","colors","initialsText","base","sourceOf","image","imagePending","t11","uri","_c","NativeText"],"sources":["../../src/mark/index.tsx"],"sourcesContent":["import type { ComponentRef, Ref } from 'react'\nimport type {\n  ImageProps,\n  ImageSourcePropType,\n  ImageStyle,\n  StyleProp,\n  TextStyle,\n  ViewProps,\n  ViewStyle,\n} from 'react-native'\n\nimport { Image, Text as NativeText, View } from 'react-native'\n\nimport type { ResolvedTheme } from '../theme/scope'\nimport type { MarkSize, MarkTone } from './styles'\n\nimport { PersonGlyph } from '../glyphs'\nimport { useTheme } from '../theme/scope'\nimport { composeStyles } from '../theme/styles'\nimport { useTypeRole } from '../typography/roles'\nimport { useImageLoadingStatus } from './image'\nimport { initialOfThing, initialsOfPerson } from './initials'\nimport {\n  DIAMETERS,\n  GLYPH_SHARE,\n  initialsStylesOf,\n  markStyles,\n  markStylesOf,\n} from './styles'\n\n/** The native props a picture's own `Image` takes, as Avatar and ProductIcon take them. */\ntype MarkImageProps = Pick<\n  ImageProps,\n  | 'crossOrigin'\n  | 'fadeDuration'\n  | 'progressiveRenderingEnabled'\n  | 'referrerPolicy'\n  | 'resizeMethod'\n>\n\ntype MarkProps = Omit<ViewProps, 'children' | 'style'> & {\n  /**\n   * Hides the mark from screen readers, for one beside the name it stands\n   * for, which would otherwise be announced twice.\n   */\n  readonly decorative?: boolean\n  /** Props for the picture's own `Image`. */\n  readonly imgProps?: MarkImageProps\n  /** A person, which Avatar draws, or anything else, which ProductIcon does. */\n  readonly kind: keyof typeof KINDS\n  /** Supplies the fallback's initials, and the accessible name unless decorative. */\n  readonly name: string\n  readonly ref?: Ref<ComponentRef<typeof View>>\n  /**\n   * Whether a person with no initials to take, a blank name, draws the\n   * anonymous person, or an empty disc, as a loading skeleton wants.\n   */\n  readonly showPersonIcon?: boolean\n  readonly size: MarkSize\n  /** A picture to show in place of the initials once it has loaded. */\n  readonly src?: string\n  readonly style?: StyleProp<ViewStyle>\n  readonly tone: MarkTone\n}\n\n// What each kind of mark is drawn as. The header of `./styles` says why the\n// two differ where they do; everything not in this table is the same for\n// both.\nconst KINDS = {\n  person: {\n    initials: initialsOfPerson,\n    resizeMode: 'cover',\n    shape: 'circle',\n    tintsFallback: false,\n  },\n  thing: {\n    initials: initialOfThing,\n    resizeMode: 'contain',\n    shape: 'square',\n    tintsFallback: true,\n  },\n} as const\n\n// The role each tone draws the anonymous person in.\nconst CONTENT: Readonly<Record<MarkTone, keyof ResolvedTheme['colors']>> = {\n  negative: 'onNegativeContainer',\n  positive: 'onPositiveContainer',\n  primary: 'onPrimaryContainer',\n  secondary: 'onSecondaryContainer',\n  tertiary: 'onTertiaryContainer',\n}\n\n/**\n * The small identity mark Avatar and ProductIcon both render: a picture once\n * it has loaded, initials until then or if it fails, named for whoever or\n * whatever it stands for. Shared rather than written into each, so a fix to\n * one reaches both, as on web. Not a component of the library's own, and not\n * exported from the package.\n */\nfunction Mark({\n  decorative = false,\n  imgProps,\n  kind,\n  name,\n  showPersonIcon = true,\n  size,\n  src,\n  style,\n  tone,\n  ...props\n}: MarkProps) {\n  const { initials, resizeMode, shape, tintsFallback } = KINDS[kind]\n  const theme = useTheme()\n  const label = useTypeRole('labelLarge')\n  const { handlersFor, previous, status } = useImageLoadingStatus(src)\n\n  const own = markStylesOf(theme)\n  const text = initialsStylesOf(theme)\n  const fallback = initials(name)\n\n  // Announced as an image named for whoever or whatever it stands for,\n  // rather than letting the initials be read: \"AL\" is not what anyone means\n  // to announce. A blank name names nothing, so the mark is then a plain\n  // view, which a screen reader passes over rather than reading as an image\n  // with no name. A decorative mark is hidden outright, its initials with it.\n  const named = !decorative && name.trim() !== ''\n\n  // The initials while no picture shows: before the first loads, and once\n  // one fails. They are left out under a picture rather than kept beneath\n  // it, since a letterboxed logo would show them through its transparent\n  // parts.\n  const showsPicture = status === 'loaded' || previous !== undefined\n  let initialsNode = null\n  if (!showsPicture && kind === 'person' && fallback === '') {\n    // A person with no initials to take, a blank name or one still loading,\n    // draws Material Design's anonymous person in the tone's on-container\n    // colour. The glyph hides itself from screen readers.\n    initialsNode = showPersonIcon ? (\n      <PersonGlyph\n        color={theme.colors[CONTENT[tone]]}\n        size={DIAMETERS[size] * GLYPH_SHARE}\n      />\n    ) : null\n  } else if (!showsPicture) {\n    // The initials keep their size whatever the device's text size asks\n    // for: the mark is a fixed size and clips what runs past it, and the\n    // name a screen reader reads is what they stand for.\n    const initialsText = (\n      <NativeText\n        allowFontScaling={false}\n        style={composeStyles<TextStyle>(label, text[size], text[tone])}\n      >\n        {fallback}\n      </NativeText>\n    )\n    initialsNode = tintsFallback ? (\n      <View style={composeStyles<ViewStyle>(markStyles.fallback, own[tone])}>\n        {initialsText}\n      </View>\n    ) : (\n      initialsText\n    )\n  }\n\n  return (\n    <View\n      accessible={named ? true : undefined}\n      aria-hidden={decorative ? true : undefined}\n      aria-label={named ? name : undefined}\n      role={named ? 'img' : undefined}\n      {...props}\n      style={composeStyles<ViewStyle>(\n        own.base,\n        own[shape],\n        markStyles[size],\n        tintsFallback ? undefined : own[tone],\n        style,\n      )}\n    >\n      {initialsNode}\n      {/* Two pictures at most, laid over the initials. The one last loaded\n          stays while a new `src` loads, and the new one is drawn on top of\n          it from the start, hidden until it has loaded. Neither is inverted\n          by the iOS Smart Invert setting, which is meant for interface\n          colours rather than pictures. */}\n      {previous === undefined ? null : (\n        <Image\n          accessibilityIgnoresInvertColors\n          key={previous}\n          resizeMode={resizeMode}\n          source={sourceOf(previous)}\n          style={markStyles.image}\n        />\n      )}\n      {src === undefined || status === 'error' ? null : (\n        <Image\n          accessibilityIgnoresInvertColors\n          key={src}\n          {...imgProps}\n          {...handlersFor(src)}\n          resizeMode={resizeMode}\n          source={sourceOf(src)}\n          style={composeStyles<ImageStyle>(\n            markStyles.image,\n            status === 'loaded' ? undefined : markStyles.imagePending,\n          )}\n        />\n      )}\n    </View>\n  )\n}\n\n// An address as the source `Image` takes. The compiler keeps the one it made\n// for as long as the address is the same, so a re-render hands the image the\n// object it already had.\nfunction sourceOf(uri: string): ImageSourcePropType {\n  return { uri }\n}\n\nexport type { MarkImageProps, MarkProps }\n\nexport { Mark }\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["ComponentRef","Ref","ImageProps","ImageSourcePropType","ImageStyle","StyleProp","TextStyle","ViewProps","ViewStyle","Image","Text","NativeText","View","ResolvedTheme","MarkSize","MarkTone","PersonGlyph","useLocaleOf","useTheme","composeStyles","useTypeRole","useImageLoadingStatus","initialOfThing","initialsOfPerson","DIAMETERS","GLYPH_SHARE","initialsStylesOf","markStyles","markStylesOf","MarkImageProps","Pick","MarkProps","Omit","decorative","imgProps","kind","KINDS","name","ref","showPersonIcon","size","src","style","tone","person","initials","resizeMode","shape","tintsFallback","thing","const","CONTENT","Readonly","Record","negative","positive","primary","secondary","tertiary","Mark","t0","$","_c","props","t1","t2","undefined","theme","label","handlersFor","previous","status","own","text","locale","t3","fallback","named","trim","showsPicture","initialsNode","t4","colors","initialsText","T0","t5","t6","t7","t8","base","t9","sourceOf","image","t10","imagePending","t11","uri","_c","NativeText"],"sources":["../../src/mark/index.tsx"],"sourcesContent":["import type { ComponentRef, Ref } from 'react'\nimport type {\n  ImageProps,\n  ImageSourcePropType,\n  ImageStyle,\n  StyleProp,\n  TextStyle,\n  ViewProps,\n  ViewStyle,\n} from 'react-native'\n\nimport { Image, Text as NativeText, View } from 'react-native'\n\nimport type { ResolvedTheme } from '../theme/scope'\nimport type { MarkSize, MarkTone } from './styles'\n\nimport { PersonGlyph } from '../glyphs'\nimport { useLocaleOf } from '../i18n/provider'\nimport { useTheme } from '../theme/scope'\nimport { composeStyles } from '../theme/styles'\nimport { useTypeRole } from '../typography/roles'\nimport { useImageLoadingStatus } from './image'\nimport { initialOfThing, initialsOfPerson } from './initials'\nimport {\n  DIAMETERS,\n  GLYPH_SHARE,\n  initialsStylesOf,\n  markStyles,\n  markStylesOf,\n} from './styles'\n\n/** The native props a picture's own `Image` takes, as Avatar and ProductIcon take them. */\ntype MarkImageProps = Pick<\n  ImageProps,\n  | 'crossOrigin'\n  | 'fadeDuration'\n  | 'progressiveRenderingEnabled'\n  | 'referrerPolicy'\n  | 'resizeMethod'\n>\n\ntype MarkProps = Omit<ViewProps, 'children' | 'style'> & {\n  /**\n   * Hides the mark from screen readers, for one beside the name it stands\n   * for, which would otherwise be announced twice.\n   */\n  readonly decorative?: boolean\n  /** Props for the picture's own `Image`. */\n  readonly imgProps?: MarkImageProps\n  /** A person, which Avatar draws, or anything else, which ProductIcon does. */\n  readonly kind: keyof typeof KINDS\n  /** Supplies the fallback's initials, and the accessible name unless decorative. */\n  readonly name: string\n  readonly ref?: Ref<ComponentRef<typeof View>>\n  /**\n   * Whether a person with no initials to take, a blank name, draws the\n   * anonymous person, or an empty disc, as a loading skeleton wants.\n   */\n  readonly showPersonIcon?: boolean\n  readonly size: MarkSize\n  /** A picture to show in place of the initials once it has loaded. */\n  readonly src?: string\n  readonly style?: StyleProp<ViewStyle>\n  readonly tone: MarkTone\n}\n\n// What each kind of mark is drawn as. The header of `./styles` says why the\n// two differ where they do; everything not in this table is the same for\n// both.\nconst KINDS = {\n  person: {\n    initials: initialsOfPerson,\n    resizeMode: 'cover',\n    shape: 'circle',\n    tintsFallback: false,\n  },\n  thing: {\n    initials: initialOfThing,\n    resizeMode: 'contain',\n    shape: 'square',\n    tintsFallback: true,\n  },\n} as const\n\n// The role each tone draws the anonymous person in.\nconst CONTENT: Readonly<Record<MarkTone, keyof ResolvedTheme['colors']>> = {\n  negative: 'onNegativeContainer',\n  positive: 'onPositiveContainer',\n  primary: 'onPrimaryContainer',\n  secondary: 'onSecondaryContainer',\n  tertiary: 'onTertiaryContainer',\n}\n\n/**\n * The small identity mark Avatar and ProductIcon both render: a picture once\n * it has loaded, initials until then or if it fails, named for whoever or\n * whatever it stands for. Shared rather than written into each, so a fix to\n * one reaches both, as on web. Not a component of the library's own, and not\n * exported from the package.\n */\nfunction Mark({\n  decorative = false,\n  imgProps,\n  kind,\n  name,\n  showPersonIcon = true,\n  size,\n  src,\n  style,\n  tone,\n  ...props\n}: MarkProps) {\n  const { initials, resizeMode, shape, tintsFallback } = KINDS[kind]\n  const theme = useTheme()\n  const label = useTypeRole('labelLarge')\n  const { handlersFor, previous, status } = useImageLoadingStatus(src)\n\n  const own = markStylesOf(theme)\n  const text = initialsStylesOf(theme)\n  const locale = useLocaleOf(undefined)\n  const fallback = initials(name, locale)\n\n  // Announced as an image named for whoever or whatever it stands for,\n  // rather than letting the initials be read: \"AL\" is not what anyone means\n  // to announce. A blank name names nothing, so the mark is then a plain\n  // view, which a screen reader passes over rather than reading as an image\n  // with no name. A decorative mark is hidden outright, its initials with it.\n  const named = !decorative && name.trim() !== ''\n\n  // The initials while no picture shows: before the first loads, and once\n  // one fails. They are left out under a picture rather than kept beneath\n  // it, since a letterboxed logo would show them through its transparent\n  // parts.\n  const showsPicture = status === 'loaded' || previous !== undefined\n  let initialsNode = null\n  if (!showsPicture && kind === 'person' && fallback === '') {\n    // A person with no initials to take, a blank name or one still loading,\n    // draws Material Design's anonymous person in the tone's on-container\n    // colour. The glyph hides itself from screen readers.\n    initialsNode = showPersonIcon ? (\n      <PersonGlyph\n        color={theme.colors[CONTENT[tone]]}\n        size={DIAMETERS[size] * GLYPH_SHARE}\n      />\n    ) : null\n  } else if (!showsPicture) {\n    // The initials keep their size whatever the device's text size asks\n    // for: the mark is a fixed size and clips what runs past it, and the\n    // name a screen reader reads is what they stand for.\n    const initialsText = (\n      <NativeText\n        allowFontScaling={false}\n        style={composeStyles<TextStyle>(label, text[size], text[tone])}\n      >\n        {fallback}\n      </NativeText>\n    )\n    initialsNode = tintsFallback ? (\n      <View style={composeStyles<ViewStyle>(markStyles.fallback, own[tone])}>\n        {initialsText}\n      </View>\n    ) : (\n      initialsText\n    )\n  }\n\n  return (\n    <View\n      accessible={named ? true : undefined}\n      aria-hidden={decorative ? true : undefined}\n      aria-label={named ? name : undefined}\n      role={named ? 'img' : undefined}\n      {...props}\n      style={composeStyles<ViewStyle>(\n        own.base,\n        own[shape],\n        markStyles[size],\n        tintsFallback ? undefined : own[tone],\n        style,\n      )}\n    >\n      {initialsNode}\n      {/* Two pictures at most, laid over the initials. The one last loaded\n          stays while a new `src` loads, and the new one is drawn on top of\n          it from the start, hidden until it has loaded. Neither is inverted\n          by the iOS Smart Invert setting, which is meant for interface\n          colours rather than pictures. */}\n      {previous === undefined ? null : (\n        <Image\n          accessibilityIgnoresInvertColors\n          key={previous}\n          resizeMode={resizeMode}\n          source={sourceOf(previous)}\n          style={markStyles.image}\n        />\n      )}\n      {src === undefined || status === 'error' ? null : (\n        <Image\n          accessibilityIgnoresInvertColors\n          key={src}\n          {...imgProps}\n          {...handlersFor(src)}\n          resizeMode={resizeMode}\n          source={sourceOf(src)}\n          style={composeStyles<ImageStyle>(\n            markStyles.image,\n            status === 'loaded' ? undefined : markStyles.imagePending,\n          )}\n        />\n      )}\n    </View>\n  )\n}\n\n// An address as the source `Image` takes. The compiler keeps the one it made\n// for as long as the address is the same, so a re-render hands the image the\n// object it already had.\nfunction sourceOf(uri: string): ImageSourcePropType {\n  return { uri }\n}\n\nexport type { MarkImageProps, MarkProps }\n\nexport { Mark }\n"],"mappings":"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"}

package/dist/mark/initials.js.map

@@ -1 +1 @@
-{"version":3,"file":"initials.js","names":["INITIAL","JOINING","ZERO_WIDTH_NON_JOINER","TITLE","SUFFIX","TRAILING_ASIDE","GRAPHEME","segmenters","Map","Intl","Segmenter","graphemesOf","text","locale","match","key","segmenter","get","undefined","granularity","set","Array","from","segment","initialOf","word","graphemes","chosen","find","grapheme","test","at","toLocaleUpperCase","initialOfThing","name","trim","initialsOfPerson","words","replace","split","filter","Boolean","length","slice","first","last","between"],"sources":["../../src/mark/initials.ts"],"sourcesContent":["// What a mark shows while it has no picture: the initials of a person's\n// name, or the initial of a thing's. Copied from kanso-ui's\n// `src/mark/initials.ts` rather than shared through a package, so the two\n// read a name the same way and each can be read without the other.\n//\n// It works in graphemes, what a reader sees as one character, in the\n// device's locale. A code point drops an accent written as a combining mark,\n// splits an Indic conjunct and cuts a flag or a joined emoji in half;\n// upper-casing without the locale turns a Turkish \"i\" into \"I\" rather than\n// \"İ\".\n//\n// Graphemes come from `Intl.Segmenter` where the engine has it, as browsers\n// and Node do. Hermes's Intl has no Segmenter, only a collator and the date\n// and number formats, so on a device `GRAPHEME` stands in: a\n// character with the marks and emoji modifiers after it, a pair of regional\n// indicators as one flag, a sequence joined by a zero-width joiner, and the\n// consonants Unicode joins through a virama into one conjunct. It has no rule\n// for the rest of Unicode's, so it splits a Hangul syllable written as\n// separate jamo, which a name typed on a phone is not.\n\n// What a word's initial can be: a letter, a number, or a picture — an emoji,\n// or a flag, which is a pair of regional indicators. A word opening with\n// anything else — a bracket, a quote, the @ of a handle, the # of a channel\n// — is initialised by the first of these inside it.\nconst INITIAL = /^[\\p{L}\\p{N}\\p{Extended_Pictographic}\\p{Regional_Indicator}]/u\n\n// The scripts whose letters join to the next one. Two initials in one of\n// them, written side by side, shape into a single connected word rather than\n// two letters, so a zero-width non-joiner goes between them.\nconst JOINING =\n  /^[\\p{Script=Arabic}\\p{Script=Syriac}\\p{Script=Mongolian}\\p{Script=Nko}\\p{Script=Adlam}\\p{Script=Mandaic}\\p{Script=Manichaean}\\p{Script=Psalter_Pahlavi}\\p{Script=Hanifi_Rohingya}\\p{Script=Sogdian}\\p{Script=Old_Uyghur}]/u\n\nconst ZERO_WIDTH_NON_JOINER = '\\u200C'\n\n// A title before a name — \"Dr.\", \"Mrs.\", \"Prof.\" — which is not one of its\n// words. Two letters at least, so a first initial written \"J.\" is kept.\nconst TITLE = /^\\p{L}{2,4}\\.$/u\n\n// A generational suffix after a name — \"Jr.\", \"Sr\", \"III\", \"3rd\" — which is\n// not its last word either. The numerals are the generational ones only, so\n// a surname that reads as a numeral, \"Xi\" say, is kept.\nconst SUFFIX = /^(?:jr|sr|ii|iii|iv|\\d+(?:st|nd|rd|th))\\.?,?$/iu\n\n// Something said about the name rather than part of it, in brackets at its\n// end: \"(she/her)\", \"[away]\".\nconst TRAILING_ASIDE = /\\s*[([{][^)\\]}]*[)\\]}]\\s*$/u\n\n// One grapheme, where the engine has no `Intl.Segmenter`: a flag, or a\n// character followed by what attaches to it. The viramas are the six Unicode\n// joins the next consonant through, in Devanagari, Bengali, Gujarati, Oriya,\n// Telugu and Malayalam, and they are tried before the plain mark they also\n// are, so the consonant after one stays in the grapheme.\nconst GRAPHEME =\n  /\\p{Regional_Indicator}{2}|\\P{M}(?:[\\u094D\\u09CD\\u0ACD\\u0B4D\\u0C4D\\u0D4D]\\u200D?\\p{L}|[\\p{M}\\p{Emoji_Modifier}]|\\u200D\\P{M})*/gu\n\nconst segmenters = new Map<string, Intl.Segmenter>()\n\nfunction graphemesOf(text: string, locale: string | undefined) {\n  // Asked on every call rather than once, so a test can take it away.\n  if (typeof Intl.Segmenter !== 'function') {\n    return text.match(GRAPHEME) ?? []\n  }\n\n  const key = locale ?? ''\n  let segmenter = segmenters.get(key)\n  if (segmenter === undefined) {\n    segmenter = new Intl.Segmenter(locale, { granularity: 'grapheme' })\n    segmenters.set(key, segmenter)\n  }\n  return Array.from(segmenter.segment(text), ({ segment }) => segment)\n}\n\n/**\n * The character that stands for `word`: its first grapheme that is a letter,\n * a number or a picture, or its first grapheme where it has none of those,\n * so something always shows. Upper-cased in the locale, and then one\n * grapheme of that, since upper-casing can lengthen it: \"ß\" is \"SS\".\n */\nfunction initialOf(word: string, locale: string | undefined) {\n  const graphemes = graphemesOf(word, locale)\n  const chosen =\n    graphemes.find((grapheme) => INITIAL.test(grapheme)) ??\n    graphemes.at(0) ??\n    ''\n  return graphemesOf(chosen.toLocaleUpperCase(locale), locale).at(0) ?? ''\n}\n\n/**\n * One letter, where a person takes two. A person has a first name and a last\n * name to initialise; a thing usually has neither, so the same rule applied\n * to \"Second item\" would produce \"SI\", a pair of initials for something that\n * was never two words in that sense.\n *\n * `locale` is the device's when left out, which is what a product icon\n * passes.\n */\nfunction initialOfThing(name: string, locale?: string) {\n  return initialOf(name.trim(), locale)\n}\n\n/**\n * The initials of the first and the last word, which handles both \"Ada\" and\n * \"Ada Lovelace\" without a separate prop for how many to take. What a\n * display name carries around the name itself is left out first: a title\n * before it, a generational suffix after it, and an aside in brackets at its\n * end. A name written without spaces between its words — Japanese, Chinese —\n * is one word to this, and takes one initial.\n *\n * `locale` is the device's when left out, which is what an avatar passes.\n */\nfunction initialsOfPerson(name: string, locale?: string) {\n  let words = name.replace(TRAILING_ASIDE, '').split(/\\s+/u).filter(Boolean)\n  if (words.length > 1 && TITLE.test(words[0] ?? '')) {\n    words = words.slice(1)\n  }\n  if (words.length > 1 && SUFFIX.test(words.at(-1) ?? '')) {\n    words = words.slice(0, -1)\n  }\n  if (words.length === 0) {\n    return ''\n  }\n  const first = initialOf(words[0] ?? '', locale)\n  if (words.length === 1) {\n    return first\n  }\n  const last = initialOf(words.at(-1) ?? '', locale)\n  const between =\n    JOINING.test(first) && JOINING.test(last) ? ZERO_WIDTH_NON_JOINER : ''\n  return `${first}${between}${last}`\n}\n\nexport { initialOfThing, initialsOfPerson }\n"],"mappings":";AAwBA,MAAMA,UAAU;AAKhB,MAAMC,UACJ;AAEF,MAAMC,wBAAwB;AAI9B,MAAMC,QAAQ;AAKd,MAAMC,SAAS;AAIf,MAAMC,iBAAiB;AAOvB,MAAMC,WACJ;AAEF,MAAMC,6BAAa,IAAIC,IAA4B;AAEnD,SAASG,YAAYC,MAAcC,QAA4B;CAE7D,IAAI,OAAOJ,KAAKC,cAAc,YAC5B,OAAOE,KAAKE,MAAMR,QAAQ,KAAK,CAAA;CAGjC,MAAMS,MAAMF,UAAU;CACtB,IAAIG,YAAYT,WAAWU,IAAIF,GAAG;CAClC,IAAIC,cAAcE,KAAAA,GAAW;EAC3BF,YAAY,IAAIP,KAAKC,UAAUG,QAAQ,EAAEM,aAAa,WAAW,CAAC;EAClEZ,WAAWa,IAAIL,KAAKC,SAAS;CAC/B;CACA,OAAOK,MAAMC,KAAKN,UAAUO,QAAQX,IAAI,IAAI,EAAEW,cAAcA,OAAO;AACrE;;;;;;;AAQA,SAASC,UAAUC,MAAcZ,QAA4B;CAC3D,MAAMa,YAAYf,YAAYc,MAAMZ,MAAM;CAK1C,OAAOF,aAHLe,UAAUE,MAAMC,aAAa7B,QAAQ8B,KAAKD,QAAQ,CAAC,KACnDH,UAAUK,GAAG,CAAC,KACd,GAAA,CACwBC,kBAAkBnB,MAAM,GAAGA,MAAM,CAAC,CAACkB,GAAG,CAAC,KAAK;AACxE;;;;;;;;;;AAWA,SAASE,eAAeC,MAAcrB,QAAiB;CACrD,OAAOW,UAAUU,KAAKC,KAAK,GAAGtB,MAAM;AACtC;;;;;;;;;;;AAYA,SAASuB,iBAAiBF,MAAcrB,QAAiB;CACvD,IAAIwB,QAAQH,KAAKI,QAAQjC,gBAAgB,EAAE,CAAC,CAACkC,MAAM,MAAM,CAAC,CAACC,OAAOC,OAAO;CACzE,IAAIJ,MAAMK,SAAS,KAAKvC,MAAM2B,KAAKO,MAAM,MAAM,EAAE,GAC/CA,QAAQA,MAAMM,MAAM,CAAC;CAEvB,IAAIN,MAAMK,SAAS,KAAKtC,OAAO0B,KAAKO,MAAMN,GAAG,EAAE,KAAK,EAAE,GACpDM,QAAQA,MAAMM,MAAM,GAAG,EAAE;CAE3B,IAAIN,MAAMK,WAAW,GACnB,OAAO;CAET,MAAME,QAAQpB,UAAUa,MAAM,MAAM,IAAIxB,MAAM;CAC9C,IAAIwB,MAAMK,WAAW,GACnB,OAAOE;CAET,MAAMC,OAAOrB,UAAUa,MAAMN,GAAG,EAAE,KAAK,IAAIlB,MAAM;CAGjD,OAAO,GAAG+B,QADR3C,QAAQ6B,KAAKc,KAAK,KAAK3C,QAAQ6B,KAAKe,IAAI,IAAI3C,wBAAwB,KAC1C2C;AAC9B"}
+{"version":3,"file":"initials.js","names":["INITIAL","JOINING","ZERO_WIDTH_NON_JOINER","TITLE","SUFFIX","TRAILING_ASIDE","GRAPHEME","segmenters","Map","Intl","Segmenter","graphemesOf","text","locale","match","key","segmenter","get","undefined","granularity","set","Array","from","segment","initialOf","word","graphemes","chosen","find","grapheme","test","at","toLocaleUpperCase","initialOfThing","name","trim","initialsOfPerson","words","replace","split","filter","Boolean","length","slice","first","last","between"],"sources":["../../src/mark/initials.ts"],"sourcesContent":["// What a mark shows while it has no picture: the initials of a person's\n// name, or the initial of a thing's. Copied from kanso-ui's\n// `src/mark/initials.ts` rather than shared through a package, so the two\n// read a name the same way and each can be read without the other.\n//\n// It works in graphemes, what a reader sees as one character, in the locale\n// the mark is drawn in. A code point drops an accent written as a combining mark,\n// splits an Indic conjunct and cuts a flag or a joined emoji in half;\n// upper-casing without the locale turns a Turkish \"i\" into \"I\" rather than\n// \"İ\".\n//\n// Graphemes come from `Intl.Segmenter` where the engine has it, as browsers\n// and Node do. Hermes's Intl has no Segmenter, only a collator and the date\n// and number formats, so on a device `GRAPHEME` stands in: a\n// character with the marks and emoji modifiers after it, a pair of regional\n// indicators as one flag, a sequence joined by a zero-width joiner, and the\n// consonants Unicode joins through a virama into one conjunct. It has no rule\n// for the rest of Unicode's, so it splits a Hangul syllable written as\n// separate jamo, which a name typed on a phone is not.\n\n// What a word's initial can be: a letter, a number, or a picture — an emoji,\n// or a flag, which is a pair of regional indicators. A word opening with\n// anything else — a bracket, a quote, the @ of a handle, the # of a channel\n// — is initialised by the first of these inside it.\nconst INITIAL = /^[\\p{L}\\p{N}\\p{Extended_Pictographic}\\p{Regional_Indicator}]/u\n\n// The scripts whose letters join to the next one. Two initials in one of\n// them, written side by side, shape into a single connected word rather than\n// two letters, so a zero-width non-joiner goes between them.\nconst JOINING =\n  /^[\\p{Script=Arabic}\\p{Script=Syriac}\\p{Script=Mongolian}\\p{Script=Nko}\\p{Script=Adlam}\\p{Script=Mandaic}\\p{Script=Manichaean}\\p{Script=Psalter_Pahlavi}\\p{Script=Hanifi_Rohingya}\\p{Script=Sogdian}\\p{Script=Old_Uyghur}]/u\n\nconst ZERO_WIDTH_NON_JOINER = '\\u200C'\n\n// A title before a name — \"Dr.\", \"Mrs.\", \"Prof.\" — which is not one of its\n// words. Two letters at least, so a first initial written \"J.\" is kept.\nconst TITLE = /^\\p{L}{2,4}\\.$/u\n\n// A generational suffix after a name — \"Jr.\", \"Sr\", \"III\", \"3rd\" — which is\n// not its last word either. The numerals are the generational ones only, so\n// a surname that reads as a numeral, \"Xi\" say, is kept.\nconst SUFFIX = /^(?:jr|sr|ii|iii|iv|\\d+(?:st|nd|rd|th))\\.?,?$/iu\n\n// Something said about the name rather than part of it, in brackets at its\n// end: \"(she/her)\", \"[away]\".\nconst TRAILING_ASIDE = /\\s*[([{][^)\\]}]*[)\\]}]\\s*$/u\n\n// One grapheme, where the engine has no `Intl.Segmenter`: a flag, or a\n// character followed by what attaches to it. The viramas are the six Unicode\n// joins the next consonant through, in Devanagari, Bengali, Gujarati, Oriya,\n// Telugu and Malayalam, and they are tried before the plain mark they also\n// are, so the consonant after one stays in the grapheme.\nconst GRAPHEME =\n  /\\p{Regional_Indicator}{2}|\\P{M}(?:[\\u094D\\u09CD\\u0ACD\\u0B4D\\u0C4D\\u0D4D]\\u200D?\\p{L}|[\\p{M}\\p{Emoji_Modifier}]|\\u200D\\P{M})*/gu\n\nconst segmenters = new Map<string, Intl.Segmenter>()\n\nfunction graphemesOf(text: string, locale: string | undefined) {\n  // Asked on every call rather than once, so a test can take it away.\n  if (typeof Intl.Segmenter !== 'function') {\n    return text.match(GRAPHEME) ?? []\n  }\n\n  const key = locale ?? ''\n  let segmenter = segmenters.get(key)\n  if (segmenter === undefined) {\n    segmenter = new Intl.Segmenter(locale, { granularity: 'grapheme' })\n    segmenters.set(key, segmenter)\n  }\n  return Array.from(segmenter.segment(text), ({ segment }) => segment)\n}\n\n/**\n * The character that stands for `word`: its first grapheme that is a letter,\n * a number or a picture, or its first grapheme where it has none of those,\n * so something always shows. Upper-cased in the locale, and then one\n * grapheme of that, since upper-casing can lengthen it: \"ß\" is \"SS\".\n */\nfunction initialOf(word: string, locale: string | undefined) {\n  const graphemes = graphemesOf(word, locale)\n  const chosen =\n    graphemes.find((grapheme) => INITIAL.test(grapheme)) ??\n    graphemes.at(0) ??\n    ''\n  return graphemesOf(chosen.toLocaleUpperCase(locale), locale).at(0) ?? ''\n}\n\n/**\n * One letter, where a person takes two. A person has a first name and a last\n * name to initialise; a thing usually has neither, so the same rule applied\n * to \"Second item\" would produce \"SI\", a pair of initials for something that\n * was never two words in that sense.\n *\n * `locale` is the device's when left out, which is what a product icon\n * passes.\n */\nfunction initialOfThing(name: string, locale?: string) {\n  return initialOf(name.trim(), locale)\n}\n\n/**\n * The initials of the first and the last word, which handles both \"Ada\" and\n * \"Ada Lovelace\" without a separate prop for how many to take. What a\n * display name carries around the name itself is left out first: a title\n * before it, a generational suffix after it, and an aside in brackets at its\n * end. A name written without spaces between its words — Japanese, Chinese —\n * is one word to this, and takes one initial.\n *\n * `locale` is the device's when left out, which is what an avatar passes.\n */\nfunction initialsOfPerson(name: string, locale?: string) {\n  let words = name.replace(TRAILING_ASIDE, '').split(/\\s+/u).filter(Boolean)\n  if (words.length > 1 && TITLE.test(words[0] ?? '')) {\n    words = words.slice(1)\n  }\n  if (words.length > 1 && SUFFIX.test(words.at(-1) ?? '')) {\n    words = words.slice(0, -1)\n  }\n  if (words.length === 0) {\n    return ''\n  }\n  const first = initialOf(words[0] ?? '', locale)\n  if (words.length === 1) {\n    return first\n  }\n  const last = initialOf(words.at(-1) ?? '', locale)\n  const between =\n    JOINING.test(first) && JOINING.test(last) ? ZERO_WIDTH_NON_JOINER : ''\n  return `${first}${between}${last}`\n}\n\nexport { initialOfThing, initialsOfPerson }\n"],"mappings":";AAwBA,MAAMA,UAAU;AAKhB,MAAMC,UACJ;AAEF,MAAMC,wBAAwB;AAI9B,MAAMC,QAAQ;AAKd,MAAMC,SAAS;AAIf,MAAMC,iBAAiB;AAOvB,MAAMC,WACJ;AAEF,MAAMC,6BAAa,IAAIC,IAA4B;AAEnD,SAASG,YAAYC,MAAcC,QAA4B;CAE7D,IAAI,OAAOJ,KAAKC,cAAc,YAC5B,OAAOE,KAAKE,MAAMR,QAAQ,KAAK,CAAA;CAGjC,MAAMS,MAAMF,UAAU;CACtB,IAAIG,YAAYT,WAAWU,IAAIF,GAAG;CAClC,IAAIC,cAAcE,KAAAA,GAAW;EAC3BF,YAAY,IAAIP,KAAKC,UAAUG,QAAQ,EAAEM,aAAa,WAAW,CAAC;EAClEZ,WAAWa,IAAIL,KAAKC,SAAS;CAC/B;CACA,OAAOK,MAAMC,KAAKN,UAAUO,QAAQX,IAAI,IAAI,EAAEW,cAAcA,OAAO;AACrE;;;;;;;AAQA,SAASC,UAAUC,MAAcZ,QAA4B;CAC3D,MAAMa,YAAYf,YAAYc,MAAMZ,MAAM;CAK1C,OAAOF,aAHLe,UAAUE,MAAMC,aAAa7B,QAAQ8B,KAAKD,QAAQ,CAAC,KACnDH,UAAUK,GAAG,CAAC,KACd,GAAA,CACwBC,kBAAkBnB,MAAM,GAAGA,MAAM,CAAC,CAACkB,GAAG,CAAC,KAAK;AACxE;;;;;;;;;;AAWA,SAASE,eAAeC,MAAcrB,QAAiB;CACrD,OAAOW,UAAUU,KAAKC,KAAK,GAAGtB,MAAM;AACtC;;;;;;;;;;;AAYA,SAASuB,iBAAiBF,MAAcrB,QAAiB;CACvD,IAAIwB,QAAQH,KAAKI,QAAQjC,gBAAgB,EAAE,CAAC,CAACkC,MAAM,MAAM,CAAC,CAACC,OAAOC,OAAO;CACzE,IAAIJ,MAAMK,SAAS,KAAKvC,MAAM2B,KAAKO,MAAM,MAAM,EAAE,GAC/CA,QAAQA,MAAMM,MAAM,CAAC;CAEvB,IAAIN,MAAMK,SAAS,KAAKtC,OAAO0B,KAAKO,MAAMN,GAAG,EAAE,KAAK,EAAE,GACpDM,QAAQA,MAAMM,MAAM,GAAG,EAAE;CAE3B,IAAIN,MAAMK,WAAW,GACnB,OAAO;CAET,MAAME,QAAQpB,UAAUa,MAAM,MAAM,IAAIxB,MAAM;CAC9C,IAAIwB,MAAMK,WAAW,GACnB,OAAOE;CAET,MAAMC,OAAOrB,UAAUa,MAAMN,GAAG,EAAE,KAAK,IAAIlB,MAAM;CAGjD,OAAO,GAAG+B,QADR3C,QAAQ6B,KAAKc,KAAK,KAAK3C,QAAQ6B,KAAKe,IAAI,IAAI3C,wBAAwB,KAC1C2C;AAC9B"}

package/dist/number/count.js

@@ -0,0 +1,15 @@
+//#region src/number/count.ts
+const formats = /* @__PURE__ */ new Map();
+/** A count in `locale`'s digits and grouping. */
+function formatCount(count, locale) {
+	let format = formats.get(locale);
+	if (format === void 0) {
+		format = new Intl.NumberFormat(locale);
+		formats.set(locale, format);
+	}
+	return format.format(count);
+}
+//#endregion
+export { formatCount };
+
+//# sourceMappingURL=count.js.map

package/dist/number/count.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"count.js","names":["formats","Map","Intl","NumberFormat","formatCount","count","locale","format","get","undefined","set"],"sources":["../../src/number/count.ts"],"sourcesContent":["// One plain formatter per locale, for the counts a badge and a field's counter\n// write, which change often enough that building a formatter on each would\n// show. The keys are the locales an app renders in, so the map settles at that\n// size.\nconst formats = new Map<string, Intl.NumberFormat>()\n\n/** A count in `locale`'s digits and grouping. */\nfunction formatCount(count: number, locale: string) {\n  let format = formats.get(locale)\n\n  if (format === undefined) {\n    format = new Intl.NumberFormat(locale)\n    formats.set(locale, format)\n  }\n\n  return format.format(count)\n}\n\nexport { formatCount }\n"],"mappings":";AAIA,MAAMA,0BAAU,IAAIC,IAA+B;;AAGnD,SAASG,YAAYC,OAAeC,QAAgB;CAClD,IAAIC,SAASP,QAAQQ,IAAIF,MAAM;CAE/B,IAAIC,WAAWE,KAAAA,GAAW;EACxBF,SAAS,IAAIL,KAAKC,aAAaG,MAAM;EACrCN,QAAQU,IAAIJ,QAAQC,MAAM;CAC5B;CAEA,OAAOA,OAAOA,OAAOF,KAAK;AAC5B"}

package/dist/number/locale.js.map

@@ -1 +1 @@
-{"version":3,"file":"locale.js","names":["deviceLocale","localeOf","locale","undefined","Intl","NumberFormat","supportedLocalesOf","resolvedOptions"],"sources":["../../src/number/locale.ts"],"sourcesContent":["// The locale a component writes its numbers in, and src/i18n its words: the\n// one given, where the runtime takes it as a locale at all, or the device's.\n// Web reads the page's from React Aria's `I18nProvider`; React Native has no\n// such context, so a component that formats a number takes the locale as a\n// prop and falls back to this.\n\nlet deviceLocale: string | undefined\n\nfunction localeOf(locale: string | undefined) {\n  if (locale !== undefined) {\n    try {\n      Intl.NumberFormat.supportedLocalesOf(locale)\n      return locale\n    } catch {\n      // A malformed tag, which falls back to the device's.\n    }\n  }\n\n  deviceLocale ??= new Intl.NumberFormat().resolvedOptions().locale\n  return deviceLocale\n}\n\nexport { localeOf }\n"],"mappings":";AAMA,IAAIA;AAEJ,SAASC,SAASC,QAA4B;CAC5C,IAAIA,WAAWC,KAAAA,GACb,IAAI;EACFC,KAAKC,aAAaC,mBAAmBJ,MAAM;EAC3C,OAAOA;CACT,QAAQ,CACN;CAIJF,iBAAiB,IAAII,KAAKC,aAAa,CAAC,CAACE,gBAAgB,CAAC,CAACL;CAC3D,OAAOF;AACT"}
+{"version":3,"file":"locale.js","names":["deviceLocale","localeOf","locale","undefined","Intl","NumberFormat","supportedLocalesOf","resolvedOptions"],"sources":["../../src/number/locale.ts"],"sourcesContent":["// The locale a component writes its numbers in, and src/i18n its words: the\n// one given, where the runtime takes it as a locale at all, or the device's.\n// Which one is given is `useLocaleOf`'s in src/i18n/provider.tsx, the\n// component's own prop or the `I18nProvider`'s, as web reads the page's from\n// React Aria's provider.\n\nlet deviceLocale: string | undefined\n\nfunction localeOf(locale: string | undefined) {\n  if (locale !== undefined) {\n    try {\n      Intl.NumberFormat.supportedLocalesOf(locale)\n      return locale\n    } catch {\n      // A malformed tag, which falls back to the device's.\n    }\n  }\n\n  deviceLocale ??= new Intl.NumberFormat().resolvedOptions().locale\n  return deviceLocale\n}\n\nexport { localeOf }\n"],"mappings":";AAMA,IAAIA;AAEJ,SAASC,SAASC,QAA4B;CAC5C,IAAIA,WAAWC,KAAAA,GACb,IAAI;EACFC,KAAKC,aAAaC,mBAAmBJ,MAAM;EAC3C,OAAOA;CACT,QAAQ,CACN;CAIJF,iBAAiB,IAAII,KAAKC,aAAa,CAAC,CAACE,gBAAgB,CAAC,CAACL;CAC3D,OAAOF;AACT"}

package/dist/overlay/host.js

@@ -1,4 +1,5 @@
 import { ScopeContext, useScope } from "../theme/scope.js";
+import { I18nProvider, useProvidedLocale } from "../i18n/provider.js";
 import { c } from "react/compiler-runtime";
 import { StyleSheet, View } from "react-native";
 import { createContext, use, useId, useLayoutEffect, useState, useSyncExternalStore } from "react";
@@ -18,59 +19,67 @@ const styles = StyleSheet.create({ fill: {
 * outermost `ThemeScope`, for as long as it is mounted. A later overlay draws
 * above an earlier one.
 *
-* The content reads the `ThemeScope` around the `Overlay`, as anything else
-* there would. Other context set between the host and the `Overlay` does not
-* reach it: an overlay is a surface of its own, as web's `OverlayScope` makes
-* one, so it starts from what is around the app rather than from what is
-* around the control that opened it.
+* The content reads the `ThemeScope` and the `I18nProvider` around the
+* `Overlay`, as anything else there would, so a dialog writes in the locale
+* of the screen that opened it, as web's portal does. Other context set
+* between the host and the `Overlay` does not reach it: an overlay is a
+* surface of its own, as web's `OverlayScope` makes one, so it starts from
+* what is around the app rather than from what is around the control that
+* opened it.
 */
 function Overlay(t0) {
-	const $ = c(10);
+	const $ = c(11);
 	const { children } = t0;
 	const store = use(OverlayHostContext);
 	const scope = useScope();
+	const locale = useProvidedLocale();
 	const key = useId();
 	if (store === null) throw new Error("An overlay draws in the host of the outermost ThemeScope, and there is no ThemeScope around this one. Wrap the app in a ThemeScope.");
 	let t1;
 	let t2;
-	if ($[0] !== children || $[1] !== key || $[2] !== scope || $[3] !== store) {
+	if ($[0] !== children || $[1] !== key || $[2] !== locale || $[3] !== scope || $[4] !== store) {
 		t1 = () => {
 			store.set(key, /* @__PURE__ */ jsx(ScopeContext, {
 				value: scope,
-				children
+				children: /* @__PURE__ */ jsx(I18nProvider, {
+					locale,
+					children
+				})
 			}));
 		};
 		t2 = [
 			children,
 			key,
+			locale,
 			scope,
 			store
 		];
 		$[0] = children;
 		$[1] = key;
-		$[2] = scope;
-		$[3] = store;
-		$[4] = t1;
-		$[5] = t2;
+		$[2] = locale;
+		$[3] = scope;
+		$[4] = store;
+		$[5] = t1;
+		$[6] = t2;
 	} else {
-		t1 = $[4];
-		t2 = $[5];
+		t1 = $[5];
+		t2 = $[6];
 	}
 	useLayoutEffect(t1, t2);
 	let t3;
 	let t4;
-	if ($[6] !== key || $[7] !== store) {
+	if ($[7] !== key || $[8] !== store) {
 		t3 = () => () => {
 			store.remove(key);
 		};
 		t4 = [key, store];
-		$[6] = key;
-		$[7] = store;
-		$[8] = t3;
-		$[9] = t4;
+		$[7] = key;
+		$[8] = store;
+		$[9] = t3;
+		$[10] = t4;
 	} else {
-		t3 = $[8];
-		t4 = $[9];
+		t3 = $[9];
+		t4 = $[10];
 	}
 	useLayoutEffect(t3, t4);
 	return null;

package/dist/overlay/host.js.map

@@ -1 +1 @@
-{"version":3,"file":"host.js","names":["ComponentRef","ReactNode","createContext","use","useId","useLayoutEffect","useState","useSyncExternalStore","StyleSheet","View","ScopeContext","useScope","Entry","key","content","OverlayStore","attach","layer","entries","remove","set","subscribe","listener","OverlayHostContext","styles","create","fill","bottom","left","pointerEvents","position","right","top","Overlay","t0","$","_c","children","store","scope","Error","t1","t2","t3","t4","OverlayHost","storeFor","OverlayLayer","map","_temp","Map","listeners","Set","changed","view","delete","node","add","_c"],"sources":["../../src/overlay/host.tsx"],"sourcesContent":["import type { ComponentRef, ReactNode } from 'react'\n\nimport {\n  createContext,\n  use,\n  useId,\n  useLayoutEffect,\n  useState,\n  useSyncExternalStore,\n} from 'react'\nimport { StyleSheet, View } from 'react-native'\n\nimport { ScopeContext, useScope } from '../theme/scope'\n\ntype Entry = readonly [key: string, content: ReactNode]\n\n/** What an overlay reaches its host through. */\ntype OverlayStore = {\n  /** Takes the layer the host draws its overlays in, as its ref. */\n  readonly attach: (layer: ComponentRef<typeof View> | null) => void\n  readonly entries: () => readonly Entry[]\n  /** The layer the host draws its overlays in, for placing one in it. */\n  readonly layer: () => ComponentRef<typeof View> | null\n  readonly remove: (key: string) => void\n  readonly set: (key: string, content: ReactNode) => void\n  readonly subscribe: (listener: () => void) => () => void\n}\n\nconst OverlayHostContext = createContext<null | OverlayStore>(null)\n\nconst styles = StyleSheet.create({\n  // Each overlay fills the layer on a box of its own, so one laid out in the\n  // flow, as a bar along an edge is, is laid out against the screen rather\n  // than after the overlay before it.\n  fill: {\n    bottom: 0,\n    left: 0,\n    pointerEvents: 'box-none',\n    position: 'absolute',\n    right: 0,\n    top: 0,\n  },\n})\n\n/**\n * Draws its content above the screen, in the overlay host of the app's\n * outermost `ThemeScope`, for as long as it is mounted. A later overlay draws\n * above an earlier one.\n *\n * The content reads the `ThemeScope` around the `Overlay`, as anything else\n * there would. Other context set between the host and the `Overlay` does not\n * reach it: an overlay is a surface of its own, as web's `OverlayScope` makes\n * one, so it starts from what is around the app rather than from what is\n * around the control that opened it.\n */\nfunction Overlay({ children }: { readonly children?: ReactNode }) {\n  const store = use(OverlayHostContext)\n  const scope = useScope()\n  const key = useId()\n\n  if (store === null) {\n    throw new Error(\n      'An overlay draws in the host of the outermost ThemeScope, and there is no ThemeScope around this one. Wrap the app in a ThemeScope.',\n    )\n  }\n\n  // Set before paint, so an overlay opening never draws a frame without it,\n  // and replaced in place on an update, so it keeps its place in the stack.\n  useLayoutEffect(() => {\n    store.set(key, <ScopeContext value={scope}>{children}</ScopeContext>)\n  }, [children, key, scope, store])\n\n  useLayoutEffect(\n    () => () => {\n      store.remove(key)\n    },\n    [key, store],\n  )\n\n  return null\n}\n\n/**\n * Hosts the overlays drawn inside it: its children, then a layer over them\n * that fills the view around the host. Mounting or unmounting an overlay\n * renders the layer alone, so the screen under it keeps its state.\n *\n * The outermost `ThemeScope` renders one, so an app has one at its root.\n */\nfunction OverlayHost({ children }: { readonly children?: ReactNode }) {\n  const [store] = useState(storeFor)\n\n  return (\n    <OverlayHostContext value={store}>\n      {children}\n      <OverlayLayer attach={store.attach} store={store} />\n    </OverlayHostContext>\n  )\n}\n\n// The layer passes a touch through to the screen wherever no overlay is\n// drawn, so an open overlay leaves the screen around it usable. It takes its\n// ref apart from the store, since the compiler reads an object a ref is taken\n// from as a ref itself, and the store is read during render.\nfunction OverlayLayer({\n  attach,\n  store,\n}: {\n  readonly attach: OverlayStore['attach']\n  readonly store: OverlayStore\n}) {\n  const entries = useSyncExternalStore(store.subscribe, store.entries)\n\n  return (\n    <View ref={attach} style={styles.fill}>\n      {entries.map(([key, content]) => (\n        <View key={key} style={styles.fill}>\n          {content}\n        </View>\n      ))}\n    </View>\n  )\n}\n\nfunction storeFor(): OverlayStore {\n  const content = new Map<string, ReactNode>()\n  const listeners = new Set<() => void>()\n  let entries: readonly Entry[] = []\n  let layer: ComponentRef<typeof View> | null = null\n\n  const changed = () => {\n    entries = [...content]\n    for (const listener of listeners) {\n      listener()\n    }\n  }\n\n  return {\n    attach: (view) => {\n      layer = view\n    },\n    entries: () => entries,\n    layer: () => layer,\n    remove: (key) => {\n      if (content.delete(key)) {\n        changed()\n      }\n    },\n    set: (key, node) => {\n      content.set(key, node)\n      changed()\n    },\n    subscribe: (listener) => {\n      listeners.add(listener)\n      return () => {\n        listeners.delete(listener)\n      }\n    },\n  }\n}\n\nexport type { OverlayStore }\n\nexport { Overlay, OverlayHost, OverlayHostContext }\n"],"mappings":"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"}
+{"version":3,"file":"host.js","names":["ComponentRef","ReactNode","createContext","use","useId","useLayoutEffect","useState","useSyncExternalStore","StyleSheet","View","I18nProvider","useProvidedLocale","ScopeContext","useScope","Entry","key","content","OverlayStore","attach","layer","entries","remove","set","subscribe","listener","OverlayHostContext","styles","create","fill","bottom","left","pointerEvents","position","right","top","Overlay","t0","$","_c","children","store","scope","locale","Error","t1","t2","t3","t4","OverlayHost","storeFor","OverlayLayer","map","_temp","Map","listeners","Set","changed","view","delete","node","add","_c"],"sources":["../../src/overlay/host.tsx"],"sourcesContent":["import type { ComponentRef, ReactNode } from 'react'\n\nimport {\n  createContext,\n  use,\n  useId,\n  useLayoutEffect,\n  useState,\n  useSyncExternalStore,\n} from 'react'\nimport { StyleSheet, View } from 'react-native'\n\nimport { I18nProvider, useProvidedLocale } from '../i18n/provider'\nimport { ScopeContext, useScope } from '../theme/scope'\n\ntype Entry = readonly [key: string, content: ReactNode]\n\n/** What an overlay reaches its host through. */\ntype OverlayStore = {\n  /** Takes the layer the host draws its overlays in, as its ref. */\n  readonly attach: (layer: ComponentRef<typeof View> | null) => void\n  readonly entries: () => readonly Entry[]\n  /** The layer the host draws its overlays in, for placing one in it. */\n  readonly layer: () => ComponentRef<typeof View> | null\n  readonly remove: (key: string) => void\n  readonly set: (key: string, content: ReactNode) => void\n  readonly subscribe: (listener: () => void) => () => void\n}\n\nconst OverlayHostContext = createContext<null | OverlayStore>(null)\n\nconst styles = StyleSheet.create({\n  // Each overlay fills the layer on a box of its own, so one laid out in the\n  // flow, as a bar along an edge is, is laid out against the screen rather\n  // than after the overlay before it.\n  fill: {\n    bottom: 0,\n    left: 0,\n    pointerEvents: 'box-none',\n    position: 'absolute',\n    right: 0,\n    top: 0,\n  },\n})\n\n/**\n * Draws its content above the screen, in the overlay host of the app's\n * outermost `ThemeScope`, for as long as it is mounted. A later overlay draws\n * above an earlier one.\n *\n * The content reads the `ThemeScope` and the `I18nProvider` around the\n * `Overlay`, as anything else there would, so a dialog writes in the locale\n * of the screen that opened it, as web's portal does. Other context set\n * between the host and the `Overlay` does not reach it: an overlay is a\n * surface of its own, as web's `OverlayScope` makes one, so it starts from\n * what is around the app rather than from what is around the control that\n * opened it.\n */\nfunction Overlay({ children }: { readonly children?: ReactNode }) {\n  const store = use(OverlayHostContext)\n  const scope = useScope()\n  const locale = useProvidedLocale()\n  const key = useId()\n\n  if (store === null) {\n    throw new Error(\n      'An overlay draws in the host of the outermost ThemeScope, and there is no ThemeScope around this one. Wrap the app in a ThemeScope.',\n    )\n  }\n\n  // Set before paint, so an overlay opening never draws a frame without it,\n  // and replaced in place on an update, so it keeps its place in the stack.\n  useLayoutEffect(() => {\n    store.set(\n      key,\n      <ScopeContext value={scope}>\n        <I18nProvider locale={locale}>{children}</I18nProvider>\n      </ScopeContext>,\n    )\n  }, [children, key, locale, scope, store])\n\n  useLayoutEffect(\n    () => () => {\n      store.remove(key)\n    },\n    [key, store],\n  )\n\n  return null\n}\n\n/**\n * Hosts the overlays drawn inside it: its children, then a layer over them\n * that fills the view around the host. Mounting or unmounting an overlay\n * renders the layer alone, so the screen under it keeps its state.\n *\n * The outermost `ThemeScope` renders one, so an app has one at its root.\n */\nfunction OverlayHost({ children }: { readonly children?: ReactNode }) {\n  const [store] = useState(storeFor)\n\n  return (\n    <OverlayHostContext value={store}>\n      {children}\n      <OverlayLayer attach={store.attach} store={store} />\n    </OverlayHostContext>\n  )\n}\n\n// The layer passes a touch through to the screen wherever no overlay is\n// drawn, so an open overlay leaves the screen around it usable. It takes its\n// ref apart from the store, since the compiler reads an object a ref is taken\n// from as a ref itself, and the store is read during render.\nfunction OverlayLayer({\n  attach,\n  store,\n}: {\n  readonly attach: OverlayStore['attach']\n  readonly store: OverlayStore\n}) {\n  const entries = useSyncExternalStore(store.subscribe, store.entries)\n\n  return (\n    <View ref={attach} style={styles.fill}>\n      {entries.map(([key, content]) => (\n        <View key={key} style={styles.fill}>\n          {content}\n        </View>\n      ))}\n    </View>\n  )\n}\n\nfunction storeFor(): OverlayStore {\n  const content = new Map<string, ReactNode>()\n  const listeners = new Set<() => void>()\n  let entries: readonly Entry[] = []\n  let layer: ComponentRef<typeof View> | null = null\n\n  const changed = () => {\n    entries = [...content]\n    for (const listener of listeners) {\n      listener()\n    }\n  }\n\n  return {\n    attach: (view) => {\n      layer = view\n    },\n    entries: () => entries,\n    layer: () => layer,\n    remove: (key) => {\n      if (content.delete(key)) {\n        changed()\n      }\n    },\n    set: (key, node) => {\n      content.set(key, node)\n      changed()\n    },\n    subscribe: (listener) => {\n      listeners.add(listener)\n      return () => {\n        listeners.delete(listener)\n      }\n    },\n  }\n}\n\nexport type { OverlayStore }\n\nexport { Overlay, OverlayHost, OverlayHostContext }\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kanso-labs/react-native-kanso-ui",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "Kanso UI's Material Design components for React Native, themed through the same --kui-* design tokens as the web library",
   "keywords": [
     "react-native",