@hzblj/kara-components 0.9.0 → 0.11.0

package/lib/module/organisms/swipe-actions/swipe-actions.android.js.map

@@ -1 +1 @@
-{"version":3,"names":["FilledIconButton","size","SwipeActionsBox","spacing","useAppTheme","useCallback","useEffect","useId","useState","useSyncExternalStore","HStack","Icon","Text","VStack","useHostGuard","jsx","_jsx","jsxs","_jsxs","BUTTON","openRow","listeners","Set","setOpenRow","row","listener","subscribe","add","delete","getOpenRow","ActionButton","action","onDone","theme","fill","tint","destructive","content","onClick","onPress","align","children","colors","containerColor","color","contentColor","modifiers","accessibilityLabel","label","name","icon","variant","Actions","actions","map","close","SwipeActions","leading","trailing","isOpenRow","edge","setEdge","onOpenChange","next","actionsSpacing","s12","openEdge","length","Leading","Trailing","reverse"],"sourceRoot":"../../../../src","sources":["organisms/swipe-actions/swipe-actions.android.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["FilledIconButton","size","SwipeActionsBox","spacing","useAppTheme","useCallback","useEffect","useId","useState","useSyncExternalStore","HStack","Icon","Text","VStack","useHostGuard","jsx","_jsx","jsxs","_jsxs","BUTTON","openRow","listeners","Set","setOpenRow","row","listener","subscribe","add","delete","getOpenRow","ActionButton","action","onDone","theme","fill","tint","destructive","content","onClick","onPress","align","children","colors","containerColor","color","contentColor","modifiers","accessibilityLabel","label","name","icon","variant","Actions","actions","map","close","SwipeActions","leading","trailing","isOpenRow","edge","setEdge","onOpenChange","next","actionsSpacing","s12","openEdge","length","Leading","Trailing","reverse"],"sourceRoot":"../../../../src","sources":["organisms/swipe-actions/swipe-actions.android.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/use-stack-modifiers.js

@@ -1,16 +1,17 @@
 "use strict";
 
 import { clickable, testID as testIdModifier } from '@expo/ui/jetpack-compose/modifiers';
-import { useSxModifiers } from '@hzblj/kara-sx';
+import { splitAccessibility, useAccessibilityModifiers, useSxModifiers } from '@hzblj/kara-sx';
 import { useMemo } from 'react';
 
 /**
- * A Compose stack's modifiers in the order a pressable one needs: its frame, shape and background, then the press,
- * then its padding. Compose clips a `clickable` to what comes after it, so with the padding first the ripple would stop
- * at the padding and a row pressed by its edge would light up only in the middle.
+ * A Compose stack's modifiers in the order a pressable one needs: its frame, shape and background, then the press, its
+ * semantics, then its padding. Compose clips a `clickable` to what comes after it, so with the padding first the ripple
+ * would stop at the padding and a row pressed by its edge would light up only in the middle. The semantics come after
+ * the click, because a label that replaces the children's clears whatever semantics are inside it.
  */
-export const useStackModifiers = (sx, onPress, testID) => {
-  const {
+export const useStackModifiers = (props, onPress, testID) => {
+  const [accessibility, {
     p,
     pb,
     pl,
@@ -19,7 +20,7 @@ export const useStackModifiers = (sx, onPress, testID) => {
     px,
     py,
     ...frame
-  } = sx;
+  }] = splitAccessibility(props);
   const frameModifiers = useSxModifiers(frame);
   const paddingModifiers = useSxModifiers({
     p,
@@ -30,6 +31,7 @@ export const useStackModifiers = (sx, onPress, testID) => {
     px,
     py
   });
-  return useMemo(() => [...frameModifiers, ...(testID ? [testIdModifier(testID)] : []), ...(onPress ? [clickable(onPress)] : []), ...paddingModifiers], [frameModifiers, onPress, paddingModifiers, testID]);
+  const accessibilityModifiers = useAccessibilityModifiers(accessibility, onPress !== undefined);
+  return useMemo(() => [...frameModifiers, ...(testID ? [testIdModifier(testID)] : []), ...(onPress ? [clickable(onPress)] : []), ...accessibilityModifiers, ...paddingModifiers], [accessibilityModifiers, frameModifiers, onPress, paddingModifiers, testID]);
 };
 //# sourceMappingURL=use-stack-modifiers.js.map

package/lib/module/use-stack-modifiers.js.map

@@ -1 +1 @@
-{"version":3,"names":["clickable","testID","testIdModifier","useSxModifiers","useMemo","useStackModifiers","sx","onPress","p","pb","pl","pr","pt","px","py","frame","frameModifiers","paddingModifiers"],"sourceRoot":"../../src","sources":["use-stack-modifiers.ts"],"mappings":";;AAAA,SAAQA,SAAS,EAAuBC,MAAM,IAAIC,cAAc,QAAO,oCAAoC;AAC3G,SAA2BC,cAAc,QAAO,gBAAgB;AAChE,SAAQC,OAAO,QAAO,OAAO;;AAE7B;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,iBAAiB,GAAGA,CAACC,EAAgB,EAAEC,OAAoB,EAAEN,MAAe,KAAuB;EAC9G,MAAM;IAACO,CAAC;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAE,GAAGC;EAAK,CAAC,GAAGT,EAAE;EAChD,MAAMU,cAAc,GAAGb,cAAc,CAACY,KAAK,CAAC;EAC5C,MAAME,gBAAgB,GAAGd,cAAc,CAAC;IAACK,CAAC;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC;EAAE,CAAC,CAAC;EAEpE,OAAOV,OAAO,CACZ,MAAM,CACJ,GAAGY,cAAc,EACjB,IAAIf,MAAM,GAAG,CAACC,cAAc,CAACD,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,EAC3C,IAAIM,OAAO,GAAG,CAACP,SAAS,CAACO,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,EACxC,GAAGU,gBAAgB,CACpB,EACD,CAACD,cAAc,EAAET,OAAO,EAAEU,gBAAgB,EAAEhB,MAAM,CACpD,CAAC;AACH,CAAC","ignoreList":[]}
+{"version":3,"names":["clickable","testID","testIdModifier","splitAccessibility","useAccessibilityModifiers","useSxModifiers","useMemo","useStackModifiers","props","onPress","accessibility","p","pb","pl","pr","pt","px","py","frame","frameModifiers","paddingModifiers","accessibilityModifiers","undefined"],"sourceRoot":"../../src","sources":["use-stack-modifiers.ts"],"mappings":";;AAAA,SAAQA,SAAS,EAAuBC,MAAM,IAAIC,cAAc,QAAO,oCAAoC;AAC3G,SAGEC,kBAAkB,EAClBC,yBAAyB,EACzBC,cAAc,QACT,gBAAgB;AACvB,SAAQC,OAAO,QAAO,OAAO;;AAE7B;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,iBAAiB,GAAGA,CAC/BC,KAAwC,EACxCC,OAAoB,EACpBR,MAAe,KACM;EACrB,MAAM,CAACS,aAAa,EAAE;IAACC,CAAC;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAE,GAAGC;EAAK,CAAC,CAAC,GAAGf,kBAAkB,CAACK,KAAK,CAAC;EACxF,MAAMW,cAAc,GAAGd,cAAc,CAACa,KAAK,CAAC;EAC5C,MAAME,gBAAgB,GAAGf,cAAc,CAAC;IAACM,CAAC;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC,EAAE;IAAEC;EAAE,CAAC,CAAC;EACpE,MAAMI,sBAAsB,GAAGjB,yBAAyB,CAACM,aAAa,EAAED,OAAO,KAAKa,SAAS,CAAC;EAE9F,OAAOhB,OAAO,CACZ,MAAM,CACJ,GAAGa,cAAc,EACjB,IAAIlB,MAAM,GAAG,CAACC,cAAc,CAACD,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,EAC3C,IAAIQ,OAAO,GAAG,CAACT,SAAS,CAACS,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,EACxC,GAAGY,sBAAsB,EACzB,GAAGD,gBAAgB,CACpB,EACD,CAACC,sBAAsB,EAAEF,cAAc,EAAEV,OAAO,EAAEW,gBAAgB,EAAEnB,MAAM,CAC5E,CAAC;AACH,CAAC","ignoreList":[]}

package/lib/typescript/atoms/activity-indicator/activity-indicator.types.d.ts

@@ -2,11 +2,13 @@ import type { ColorToken } from '@hzblj/kara-theme';
 import type { ReactNode } from 'react';
 export type ActivityIndicatorSize = 'large' | 'small';
 /**
- * That something is loading, for as long as it takes — UIKit's spinner on iOS, Material 3's expressive
+ * That something is loading, for as long as it takes: UIKit's spinner on iOS, Material 3's expressive
  * `LoadingIndicator` on Android, its shapes morphing as it turns. A React Native view on iOS and a host of its own on
  * Android, so it renders anywhere. For how far along something is, use `Progress`.
  */
 export type ActivityIndicatorProps = {
+    /** What is loading, for VoiceOver and TalkBack: "Loading photos". Unset, the platform's own word ("In progress"). */
+    accessibilityLabel?: string;
     /** Its colour. `fill.accent.primary` by default. */
     color?: ColorToken;
     /** `small` sits in a row or a button, `large` holds a screen that is loading. `small` by default. */

package/lib/typescript/atoms/avatar/avatar.types.d.ts

@@ -1,11 +1,16 @@
 import type { ReactNode } from 'react';
 import type { ImageSourcePropType } from 'react-native';
 export type AvatarSize = 'lg' | 'md' | 'sm';
-/** A round avatar: the image in `source`, or `initials` without one. The React Native tier — it needs no host. */
+/** A round avatar: the image in `source`, or `initials` without one. The React Native tier: it needs no host. */
 export type AvatarProps = {
+    /**
+     * Who it is, for VoiceOver and TalkBack: "Jan Blazej". Unset, the avatar is decorative and hidden from them, as one
+     * beside the person's name should be.
+     */
+    accessibilityLabel?: string;
     /** Shown in place of the image when there is no `source`. */
     initials?: string;
-    /** The diameter — `sm` is `s24`, `md` `s40`, `lg` `s64`. `md` by default. */
+    /** The diameter: `sm` is `s24`, `md` `s40`, `lg` `s64`. `md` by default. */
     size?: AvatarSize;
     /** The image, cropped to the circle. */
     source?: ImageSourcePropType;

package/lib/typescript/atoms/badge/badge.types.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
 export type BadgeTone = 'accent' | 'destructive' | 'neutral' | 'success';
-/** A small status label in a capsule — a SwiftUI `HStack` in the tone's fill on iOS, Material's `Badge` on Android. */
+/** A small status label in a capsule: a SwiftUI `HStack` in the tone's fill on iOS, Material's `Badge` on Android. */
 export type BadgeProps = {
     /** The text inside. */
     label: string;

package/lib/typescript/atoms/blur-view/blur-view.types.d.ts

@@ -3,16 +3,16 @@ import type { ResponsiveViewSx } from '@hzblj/kara-sx';
 import type { ReactNode } from 'react';
 export type { BlurMaterial, BlurVibrancy } from '@hzblj/kara-native/swift-ui';
 /**
- * One of the system's materials behind React Native content — what sheets, bars, menus and HUDs are made of, in
+ * One of the system's materials (what sheets, bars, menus and HUDs are made of) behind React Native content, in
  * SwiftUI's five thicknesses. iOS: UIKit's `system*Material` blur, with optional vibrancy for the content. Android:
- * what lies behind, blurred and saturated (Android 12+), under a Material tonal surface as thick as the material —
- * `surface` at `ultraThin` up to `surfaceContainerHighest` at `ultraThick`; below Android 12 the surface alone. The
+ * what lies behind, blurred and saturated (Android 12+), under a Material tonal surface as thick as the material
+ * (`surface` at `ultraThin` up to `surfaceContainerHighest` at `ultraThick`); below Android 12 the surface alone. The
  * React Native tier: it needs no host, so it suits a list cell. Shape it with `borderRadius`; it clips its children.
  */
 export type BlurViewProps = ResponsiveViewSx & {
     /**
-     * Pins the material to light or dark whatever the app's appearance — a dark HUD over a light screen. Unset, it follows
-     * the app theme. Android draws the opposite appearance with Material's inverse surface.
+     * Pins the material to light or dark whatever the app's appearance (a dark HUD over a light screen). Unset, it
+     * follows the app theme. Android draws the opposite appearance with Material's inverse surface.
      */
     appearance?: 'dark' | 'light';
     /** React Native content, over the material. */
@@ -22,7 +22,7 @@ export type BlurViewProps = ResponsiveViewSx & {
     /** Test identifier, forwarded to the view. */
     testID?: string;
     /**
-     * iOS: draws the children vibrant at this level, the way iOS draws its own labels and fills on a material — their
+     * iOS: draws the children vibrant at this level, the way iOS draws its own labels and fills on a material. Their
      * colour becomes the material's vibrant one and their alpha the mask. Android has no vibrancy: the children keep
      * their colours there.
      */

package/lib/typescript/atoms/button/button-tokens.d.ts

@@ -1,7 +1,7 @@
 import type { ColorToken, Theme } from '@hzblj/kara-theme';
 import type { ButtonVariant } from './button.types';
 export declare const buttonTokens: (variant: ButtonVariant, disabled: boolean, theme: Theme) => {
-    readonly content: 'content.on.bg';
+    readonly content: 'content.on.accent';
     readonly fill: 'fill.accent.primary';
     readonly shadow: 'btn.accent';
 } | {

package/lib/typescript/atoms/button/button.types.d.ts

@@ -2,23 +2,25 @@ import type { ColorToken } from '@hzblj/kara-theme';
 import type { ReactNode } from 'react';
 export type ButtonVariant = 'accent' | 'destructive' | 'glass' | 'secondary';
 /**
- * SwiftUI `ButtonStyle`. iOS only — Compose has no equivalent, so Android ignores it and keeps
+ * SwiftUI `ButtonStyle`. iOS only: Compose has no equivalent, so Android ignores it and keeps
  * rendering the variant's tokens.
  */
 export type ButtonStyleName = 'automatic' | 'bordered' | 'borderedProminent' | 'borderless' | 'glass' | 'glassProminent' | 'plain';
 /**
- * SwiftUI `ControlSize`. iOS only, and it has no `automatic` member — leave it unset to inherit
+ * SwiftUI `ControlSize`. iOS only, and it has no `automatic` member: leave it unset to inherit
  * whatever the surrounding SwiftUI environment provides.
  */
 export type ButtonControlSize = 'extraLarge' | 'large' | 'mini' | 'regular' | 'small';
-/** A text button — SwiftUI `Button` on iOS, Material's filled button (outlined for `glass`) on Android. */
+/** A text button: SwiftUI `Button` on iOS, Material's filled button (outlined for `glass`) on Android. */
 export type ButtonProps = {
+    /** What pressing it does, when the label alone does not say. See `AccessibilityProps`. */
+    accessibilityHint?: string;
     /**
-     * Replaces the style the variant picks — `borderedProminent` for `accent` and `destructive`, `bordered` for
-     * `secondary`, `glass` for `glass`. iOS only — Android ignores it.
+     * Replaces the style the variant picks: `borderedProminent` for `accent` and `destructive`, `bordered` for
+     * `secondary`, `glass` for `glass`. iOS only. Android ignores it.
      */
     buttonStyle?: ButtonStyleName;
-    /** SwiftUI's control size. `large` by default. iOS only — Android ignores it. */
+    /** SwiftUI's control size. `large` by default. iOS only. Android ignores it. */
     controlSize?: ButtonControlSize;
     /** Draws the button in its disabled colours and stops it responding to presses. */
     disabled?: boolean;
@@ -31,7 +33,7 @@ export type ButtonProps = {
     /**
      * Overrides the variant's own tint. A prominent style takes it as the fill and picks a contrasting
      * label. `glass` has to reach the material through `glassEffect` instead, so tinting one costs it
-     * the stock `.glass` style — see the iOS implementation.
+     * the stock `.glass` style (see the iOS implementation).
      */
     tint?: ColorToken;
     /** The look. `accent` by default. Material has no glass, so on Android `glass` is an outlined button. */

package/lib/typescript/atoms/card/card.types.d.ts

@@ -1,10 +1,10 @@
-import type { ResponsiveSx } from '@hzblj/kara-sx';
+import type { AccessibilityProps, ResponsiveSx } from '@hzblj/kara-sx';
 import type { ReactNode } from 'react';
 /**
- * A raised container — SwiftUI `VStack` / Compose `Column` on `surface.primary`, with a large radius, `s16` padding and
+ * A raised container: SwiftUI `VStack` / Compose `Column` on `surface.primary`, with a large radius, `s16` padding and
  * the `card` shadow. Any `sx` prop overrides its default.
  */
-export type CardProps = ResponsiveSx & {
+export type CardProps = ResponsiveSx & AccessibilityProps & {
     /** Native views, stacked vertically from the leading edge. */
     children?: ReactNode;
     /** Test identifier, forwarded to the native view. */

package/lib/typescript/atoms/checkbox/checkbox.types.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from 'react';
-/** Material's `Checkbox` on Android. iOS has none, so there it is a SwiftUI `Toggle` — the same switch as `Switch`. */
+/** Material's `Checkbox` on Android. iOS has none, so there it is a SwiftUI `Toggle`, the same switch as `Switch`. */
 export type CheckboxProps = {
     /** Dims the control and ignores taps. */
     disabled?: boolean;
@@ -7,7 +7,7 @@ export type CheckboxProps = {
     label?: string;
     /** Called with the new value when the user toggles it. */
     onValueChange?: (value: boolean) => void;
-    /** Whether it is checked. Controlled — update it from `onValueChange`. */
+    /** Whether it is checked. Controlled: update it from `onValueChange`. */
     value: boolean;
 };
 export type CheckboxComponent = (props: CheckboxProps) => ReactNode;

package/lib/typescript/atoms/chip/chip.types.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from 'react';
-/** A filter pill on a `Pressable`, not a native control — the React Native tier, so it needs no host. */
+/** A filter pill on a `Pressable`, not a native control. It belongs to the React Native tier, so it needs no host. */
 export type ChipProps = {
     /** The text in the pill. */
     label: string;

package/lib/typescript/atoms/color-picker/color-picker.types.d.ts

@@ -1,10 +1,11 @@
 import type { ReactNode } from 'react';
 /**
- * The system colour picker. iOS only — Compose ships no equivalent, so on Android this
- * renders nothing and says so in dev. Branch on `Platform.OS` if the screen needs a fallback.
+ * A row with a label and a colour well that opens a picker: SwiftUI's `ColorPicker` on iOS. Compose ships none, so on
+ * Android it is kara's own, in the same shape: a well with a rainbow ring, and a sheet with a grid of swatches, a
+ * spectrum and RGB sliders.
  */
 export type ColorPickerProps = {
-    /** Text beside the colour well. */
+    /** Text beside the colour well, and the Android sheet's title. */
     label?: string;
     /** Called with the colour the user picks. */
     onValueChange?: (color: string) => void;

package/lib/typescript/atoms/date-picker/date-picker.types.d.ts

@@ -1,7 +1,7 @@
 import type { ReactNode } from 'react';
 export type DatePickerMode = 'date' | 'datetime' | 'time';
 /**
- * A date or time picker — SwiftUI's compact `DatePicker` on iOS, a field that opens Material's picker dialog on a tap
+ * A date or time picker: SwiftUI's compact `DatePicker` on iOS, a field that opens Material's picker dialog on a tap
  * on Android. The React Native tier: it brings its own host and sizes itself to the value, so it sits in a row beside
  * its label like a `Text`.
  */
@@ -15,11 +15,11 @@ export type DatePickerProps = {
      * `value`'s time of day.
      */
     mode?: DatePickerMode;
-    /** Called with the new date — on iOS as it changes, on Android when the dialog is confirmed. */
+    /** Called with the new date: on iOS as it changes, on Android when the dialog is confirmed. */
     onValueChange?: (date: Date) => void;
-    /** Test identifier — on the native picker on iOS, on the tappable field on Android. */
+    /** Test identifier, on the native picker on iOS and on the tappable field on Android. */
     testID?: string;
-    /** The selected date. Controlled — update it from `onValueChange`. */
+    /** The selected date. Controlled: update it from `onValueChange`. */
     value: Date;
 };
 export type DatePickerComponent = (props: DatePickerProps) => ReactNode;

package/lib/typescript/atoms/divider/divider.types.d.ts

@@ -1,10 +1,10 @@
 import type { ColorToken } from '@hzblj/kara-theme';
 import type { ReactNode } from 'react';
-/** A horizontal hairline — SwiftUI `Divider` / Compose `HorizontalDivider`. */
+/** A horizontal hairline: SwiftUI `Divider` / Compose `HorizontalDivider`. */
 export type DividerProps = {
     /** The line's colour. `border.tertiary` by default. */
     color?: ColorToken;
-    /** Test identifier, forwarded to the native view on iOS — Android ignores it. */
+    /** Test identifier, forwarded to the native view on iOS. Android ignores it. */
     testID?: string;
 };
 export type DividerComponent = (props: DividerProps) => ReactNode;

package/lib/typescript/atoms/fab/fab.types.d.ts

@@ -1,15 +1,22 @@
 import type { ReactNode } from 'react';
 import type { IconName } from '../icon';
 /**
- * A floating action button — Material's `FloatingActionButton` on Android, a 56pt accent circle (a plain SwiftUI
+ * A floating action button: Material's `FloatingActionButton` on Android, a 56pt accent circle (a plain SwiftUI
  * `Button`) on iOS. It renders inline; pinning it to a corner is up to the screen.
  */
 export type FabProps = {
-    /** The icon, one of the app's, drawn in `content.on.bg`. */
+    /**
+     * What VoiceOver and TalkBack say for the button, since an icon has no words of its own: "Share", "Add to
+     * favourites". Required for that reason.
+     */
+    accessibilityLabel: string;
+    /** What pressing it does, when the label alone does not say. See `AccessibilityProps`. */
+    accessibilityHint?: string;
+    /** The icon, one of the app's, drawn in `content.on.accent`. */
     name: IconName;
     /** Called when the button is pressed. */
     onPress?: () => void;
-    /** Test identifier, forwarded to the native view on iOS — Android ignores it. */
+    /** Test identifier, forwarded to the native view on iOS. Android ignores it. */
     testID?: string;
 };
 export type FabComponent = (props: FabProps) => ReactNode;

package/lib/typescript/atoms/glass-view/glass-view.types.d.ts

@@ -2,13 +2,13 @@ import type { ResponsiveViewSx } from '@hzblj/kara-sx';
 import type { ColorToken } from '@hzblj/kara-theme';
 import type { ReactNode } from 'react';
 /**
- * Glass around a React Native subtree, shaped as a capsule — the React Native tier, so it needs no host. iOS 26:
- * Liquid Glass. Android: frosted glass — what lies behind, blurred on Android 12+, under a translucent tonal surface
- * (or `tint`) and a hairline. iOS before 26 has no Liquid Glass and draws a capsule of `tint` instead, or of the glass
- * buttons' translucent fill (`btn.bg.glass.base`) when there is none.
+ * Glass around a React Native subtree, shaped as a capsule. It belongs to the React Native tier, so it needs no host.
+ * iOS 26: Liquid Glass. Android: frosted glass, made of what lies behind, blurred on Android 12+, under a translucent
+ * tonal surface (or `tint`) and a hairline. iOS before 26 has no Liquid Glass and draws a capsule of `tint` instead, or
+ * of the glass buttons' translucent fill (`btn.bg.glass.base`) when there is none.
  *
  * On Android each glass re-records what lies behind it before every frame: a few buttons cost nothing, but keep it out
- * of the cells of a long list — a plain `tint` reads as well there.
+ * of the cells of a long list. A plain `tint` reads as well there.
  */
 export type GlassViewProps = ResponsiveViewSx & {
     /** React Native views. Give them `pointerEvents="none"` when `interactive`, so the press reaches the `Pressable`. */

package/lib/typescript/atoms/h-stack/h-stack.types.d.ts

@@ -1,14 +1,17 @@
-import type { ResponsiveSx } from '@hzblj/kara-sx';
+import type { AccessibilityProps, ResponsiveSx } from '@hzblj/kara-sx';
 import type { SpaceSize } from '@hzblj/kara-theme';
 import type { ReactNode } from 'react';
 export type HStackAlign = 'center' | 'end' | 'start';
-/** A horizontal stack — SwiftUI `HStack` / Compose `Row`. */
-export type HStackProps = ResponsiveSx & {
-    /** How the children line up vertically — `start` is the top, `end` the bottom. `start` by default. */
+/** A horizontal stack: SwiftUI `HStack` / Compose `Row`. */
+export type HStackProps = ResponsiveSx & AccessibilityProps & {
+    /** How the children line up vertically: `start` is the top, `end` the bottom. `start` by default. */
     align?: HStackAlign;
     /** Native views, laid out from the leading edge. */
     children?: ReactNode;
-    /** Makes the stack pressable — a tap gesture on iOS, a `clickable` with Material's ripple on Android. */
+    /**
+     * Makes the stack pressable: a tap gesture on iOS, a `clickable` with Material's ripple on Android. Screen readers
+     * then read the stack as one button.
+     */
     onPress?: () => void;
     /** The gap between children. Unset, SwiftUI puts its default spacing between them and Compose none. */
     spacing?: SpaceSize;

package/lib/typescript/atoms/icon/icon.types.d.ts

@@ -11,12 +11,12 @@ declare global {
 }
 type DeclaredIconName = keyof KaraIcons & string;
 /**
- * One of the app's icons. Once the plugin has written `kara-icons.d.ts` only those names type-check — an icon removed
+ * One of the app's icons. Once the plugin has written `kara-icons.d.ts` only those names type-check: an icon removed
  * from the folder fails at every call site. Before that, any string, so a project can adopt icons gradually.
  */
 export type IconName = [DeclaredIconName] extends [never] ? string : DeclaredIconName;
 /**
- * One of the app's icons, in a host — SwiftUI `Image` from the asset catalog on iOS, Material's `Icon` with the vector
+ * One of the app's icons, in a host: SwiftUI `Image` from the asset catalog on iOS, Material's `Icon` with the vector
  * drawable on Android. `RnIcon` draws the same asset outside one.
  */
 export type IconProps = {
@@ -24,11 +24,11 @@ export type IconProps = {
     accessibilityLabel?: string;
     /** The icon's tint. `content.primary` by default. */
     color?: ColorToken;
-    /** Which of the app's icons — a key of `KaraIcons`. */
+    /** Which of the app's icons, a key of `KaraIcons`. */
     name: IconName;
     /** Its width and height, a spacing token. `s24` by default. */
     size?: SpaceSize;
-    /** Test identifier, forwarded to the native view on iOS — Android ignores it. */
+    /** Test identifier, forwarded to the native view on iOS. Android ignores it. */
     testID?: string;
 };
 export type IconComponent = (props: IconProps) => ReactNode;

package/lib/typescript/atoms/icon-button/icon-button.types.d.ts

@@ -1,14 +1,25 @@
 import type { ReactNode } from 'react';
 import type { IconName } from '../icon';
-/** A button that is just an icon — a plain SwiftUI `Button` on iOS, Material's `IconButton` on Android. */
+/**
+ * A button that is just an icon: a plain SwiftUI `Button` on iOS, Material's `IconButton` on Android. The icon sits
+ * centred in a tap target the size each platform asks for, 44pt on iOS and 48dp on Android, so a row of them spaces
+ * itself the same way on both.
+ */
 export type IconButtonProps = {
-    /** Draws the icon in `btn.content.disabled` and stops the button responding to presses. */
+    /**
+     * What VoiceOver and TalkBack say for the button, since an icon has no words of its own: "Share", "Add to
+     * favourites". Required for that reason.
+     */
+    accessibilityLabel: string;
+    /** What pressing it does, when the label alone does not say. See `AccessibilityProps`. */
+    accessibilityHint?: string;
+    /** Dims the icon (iOS's own disabled look, `btn.content.disabled` on Android) and stops the button responding. */
     disabled?: boolean;
     /** The icon, one of the app's. */
     name: IconName;
     /** Called when the button is pressed. */
     onPress?: () => void;
-    /** Test identifier, forwarded to the native view on iOS — Android ignores it. */
+    /** Test identifier, forwarded to the native view on iOS. Android ignores it. */
     testID?: string;
 };
 export type IconButtonComponent = (props: IconButtonProps) => ReactNode;

package/lib/typescript/atoms/image/image.d.ts

@@ -1,8 +1,8 @@
 import { Image as ExpoImage, type ImageProps as ExpoImageProps } from 'expo-image';
 import type { Ref } from 'react';
 /**
- * `expo-image` with the `sx` props, the way `Box` is a `View` with them, and the design system's 100 ms linear fade
- * already applied, so a loaded image never pops in. An explicit `transition` wins, and so does an explicit `style`.
+ * `expo-image` with the `sx` props, the way `Box` is a `View` with them, and the design system's fade (`quick`,
+ * eased out) already applied, so a loaded image never pops in. An explicit `transition` wins, and so does an explicit `style`.
  */
 export declare const Image: import("react").MemoExoticComponent<{
     ({ style, ...props }: import("@hzblj/kara-sx").SxProps<ExpoImageProps & {

package/lib/typescript/atoms/island/island.types.d.ts

@@ -2,7 +2,7 @@ import type { ResponsiveViewSx } from '@hzblj/kara-sx';
 import type { ReactNode } from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
 /**
- * A host for native atoms in a React Native layout — the SwiftUI / Compose `Host` an `@expo/ui` tree mounts into. It
+ * A host for native atoms in a React Native layout: the SwiftUI / Compose `Host` an `@expo/ui` tree mounts into. It
  * sits in that layout like a `Box`, and takes `Box`'s `sx` props for it: `h`, `flex`, margins.
  */
 export type IslandProps = ResponsiveViewSx & {
@@ -14,15 +14,15 @@ export type IslandProps = ResponsiveViewSx & {
      * width maps to `fixedSize(horizontal: true)`, so the native side ignores the proposed width and
      * resolves a `wide` stack's ideal width as unbounded.
      *
-     * Turn it off — and give the island an explicit height, `h` — when the subtree contains an
+     * Turn it off (and give the island an explicit height, `h`) when the subtree contains an
      * `RnView`: that host drives its SwiftUI frame from the child's Yoga-laid-out bounds while this one
      * writes its measured size back into the Yoga style, and the two together spin a layout loop that
      * hangs the main thread as soon as the views lay out on screen.
      */
     matchContents?: boolean;
-    /** A React Native style for the host view, merged over the `sx` props — for what they cannot say. */
+    /** A React Native style for the host view, merged over the `sx` props, for what they cannot say. */
     style?: StyleProp<ViewStyle>;
-    /** Test identifier, forwarded to the host view on iOS — Android ignores it. */
+    /** Test identifier, forwarded to the host view on iOS. Android ignores it. */
     testID?: string;
 };
 export type IslandComponent = (props: IslandProps) => ReactNode;

package/lib/typescript/atoms/list/list.types.d.ts

@@ -1,22 +1,22 @@
 import type { ReactNode } from 'react';
 /**
- * A scrolling list — SwiftUI `List`, Compose `LazyColumn`. It has no height of its own, so it needs one from outside:
+ * A scrolling list: SwiftUI `List`, Compose `LazyColumn`. It has no height of its own, so it needs one from outside:
  * a `Screen`, or an `Island` with `matchContents={false}` and a height. In an island that sizes itself to its content
  * Compose measures it against an infinite height and throws ("Vertically scrollable component was measured with an
  * infinity maximum height"); SwiftUI shows nothing. For a handful of rows that should not scroll, use a `VStack`.
  *
- * Rows are separated for you — SwiftUI's own separators, a `Divider` between rows on Android — so a `Divider` among
+ * Rows are separated for you (SwiftUI's own separators, a `Divider` between rows on Android), so a `Divider` among
  * the children is one too many: on iOS it becomes an empty row of its own.
  */
 export type ListProps = {
-    /** The rows — native views, one row each. */
+    /** The rows: native views, one row each. */
     children: ReactNode;
     /**
-     * Enables pull-to-refresh. Async on purpose — see `ScrollViewProps.onRefresh`: the spinner runs
+     * Enables pull-to-refresh. Async on purpose (see `ScrollViewProps.onRefresh`): the spinner runs
      * until the promise settles, so neither platform needs a `refreshing` flag kept in sync by hand.
      */
     onRefresh?: () => Promise<void>;
-    /** Test identifier, forwarded to the native view on iOS — Android ignores it. */
+    /** Test identifier, forwarded to the native view on iOS. Android ignores it. */
     testID?: string;
 };
 export type ListComponent = (props: ListProps) => ReactNode;

package/lib/typescript/atoms/picker/picker.types.d.ts

@@ -7,7 +7,7 @@ export type PickerOption = {
     value: string;
 };
 /**
- * A single choice from a list — a SwiftUI wheel picker on iOS, Material's exposed dropdown on Android. It brings its
+ * A single choice from a list: a SwiftUI wheel picker on iOS, Material's exposed dropdown on Android. It brings its
  * own host, so it renders outside `Screen` and `Island` as well.
  */
 export type PickerProps = {

package/lib/typescript/atoms/pressable/pressable.types.d.ts

@@ -1,21 +1,37 @@
-import type { ResponsiveViewSx } from '@hzblj/kara-sx';
+import type { AccessibilityProps, ResponsiveViewSx } from '@hzblj/kara-sx';
+import type { OpacitySize } from '@hzblj/kara-theme';
 import type { ReactNode } from 'react';
 import type { Haptic } from '../../haptics';
+/** How the content answers a press: it eases down, it dims, or it stays still. */
+export type PressEffect = 'none' | 'opacity' | 'scale';
 /**
- * React Native's `Pressable`, styled through `sx` like a `Box`, taking touches 8 points past its edges. The press is
- * each platform's own: iOS springs it down to 96%; Android draws Material's ripple over the content, clipped to the
- * pressable's shape — give it the `borderRadius` of what it wraps (`full` around a `GlassView`). The React Native
- * tier — it needs no host.
+ * React Native's `Pressable`, styled through `sx` like a `Box`, taking touches 8 points past its edges. Each platform
+ * presses its own way by default: iOS eases the content down to 96%, Android draws Material's ripple over it,
+ * clipped to the pressable's shape. `pressEffect` picks the same answer on both, and Android keeps its ripple on top
+ * unless `ripple` is off. Give it the `borderRadius` of what it wraps (`full` around a `GlassView`). Screen readers read
+ * it as a button unless `accessibilityRole` names another role. The React Native tier: it needs no host.
  */
-export type PressableProps = ResponsiveViewSx & {
+export type PressableProps = ResponsiveViewSx & AccessibilityProps & {
     /** The pressable content. */
     children?: ReactNode;
-    /** Ignores presses — no `onPress`, no haptic, no spring or ripple. */
+    /** Ignores presses: no `onPress`, no haptic, no press effect or ripple. */
     disabled?: boolean;
     /** Played on press. `true` is a `light` impact; a name picks the haptic, e.g. `selection` for a choice. */
     haptic?: boolean | Haptic;
     /** Called when the press is released, after the `haptic` plays. */
     onPress?: () => void;
+    /**
+     * How the content answers while it is held. `scale` eases it down to `pressedScale`, `opacity` dims it to
+     * `pressedOpacity`, `none` leaves it still. `scale` on iOS and `none` on Android by default, where the ripple is the
+     * press. With motion reduced, `scale` dims instead: the press still shows, and nothing moves.
+     */
+    pressEffect?: PressEffect;
+    /** What `opacity` dims to, an opacity token. `o60` by default. */
+    pressedOpacity?: OpacitySize;
+    /** What `scale` eases down to. `0.96` by default: lower reads as a squash, not a press. */
+    pressedScale?: number;
+    /** Android's ripple: Material's pressed state layer over the content, clipped to the shape. On by default. iOS has none. */
+    ripple?: boolean;
     /** Test identifier, forwarded to the view. */
     testID?: string;
 };

package/lib/typescript/atoms/progress/progress.types.d.ts

@@ -1,9 +1,11 @@
 import type { ReactNode } from 'react';
 /**
- * A progress bar or ring, tinted `fill.accent.primary` — SwiftUI `ProgressView` (a capacity `Gauge` for a ring with a
+ * A progress bar or ring, tinted `fill.accent.primary`: SwiftUI `ProgressView` (a capacity `Gauge` for a ring with a
  * value, which `ProgressView` cannot draw on iOS) / Compose's `LinearProgressIndicator` and `CircularProgressIndicator`.
  */
 export type ProgressProps = {
+    /** What is in progress, for VoiceOver and TalkBack: "Uploading". They read how far along it is themselves. */
+    accessibilityLabel?: string;
     /** A circular indicator instead of a bar. Off by default. */
     circular?: boolean;
     /** Between `0` and `1`. Leave it unset for an indeterminate indicator. */

package/lib/typescript/atoms/rn-flat-list/rn-flat-list.types.d.ts

@@ -2,10 +2,10 @@ import type { ResponsiveViewSx } from '@hzblj/kara-sx';
 import type { FlatListProps as RNFlatListProps } from 'react-native';
 /**
  * Top-level `sx` styles the viewport; `content` styles the scrolling content container, so padding and
- * gap belong there — the same split as `RnScrollView`. `removeClippedSubviews` is off unless you turn it on:
+ * gap belong there (the same split as `RnScrollView`). `removeClippedSubviews` is off unless you turn it on:
  * Android's default would detach a row's host before it has measured itself, and the row would stay empty.
  */
 export type RnFlatListProps<TItem> = ResponsiveViewSx & Omit<RNFlatListProps<TItem>, 'contentContainerStyle' | 'style'> & {
-    /** Styles the scrolling content container — padding and gap belong here. */
+    /** Styles the scrolling content container; padding and gap belong here. */
     content?: ResponsiveViewSx;
 };

package/lib/typescript/atoms/rn-icon/rn-icon.types.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from 'react';
 import type { IconProps } from '../icon';
-/** The same contract as `Icon`, for the React Native tier — anywhere, no `Screen` or `Island` needed. */
+/** The same contract as `Icon`, for the React Native tier: anywhere, no `Screen` or `Island` needed. */
 export type RnIconProps = IconProps;
 export type RnIconComponent = (props: RnIconProps) => ReactNode;