@ankhorage/zora 1.0.3 → 1.0.5

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## 1.0.5
+
+### Patch Changes
+
+- 9d9f997: Add common UI primitives: `Avatar`, `AvatarGroup`, `Chip`, `ChipGroup`, `SearchBar`, and `FilterBar`. Also add `InputTrailingAction` / `trailingAction` support to `Input`.
+
+## 1.0.4
+
+### Patch Changes
+
+- ba7efff: update packages
+
 ## 1.0.3
 
 ### Patch Changes

package/README.md

@@ -306,6 +306,83 @@ Inherits behavior from Surface `IconButton` including `disabled`, `loading`,
 
 </details>
 
+### `Avatar`
+
+User/profile image with name-based initials and optional icon fallback.
+
+```tsx
+<Avatar name="Zora Kit" />
+<Avatar size="l" tone="primary" name="Fabio Gartenmann" />
+```
+
+<details>
+<summary>Props</summary>
+
+ZORA props:
+
+| Prop           | Type                  | Default     | Notes                                           |
+| -------------- | --------------------- | ----------- | ----------------------------------------------- |
+| `source`       | `ImageSourcePropType` | -           | React Native `Image` source for the avatar.     |
+| `name`         | `string`              | -           | Used to derive initials when `initials` absent. |
+| `initials`     | `string`              | -           | Explicit initials override.                     |
+| `iconFallback` | `ButtonIconSpec`      | -           | Optional icon spec when no source/initials.     |
+| `label`        | `string`              | -           | Accessibility label for the rendered content.   |
+| `size`         | `AvatarSize`          | `'m'`       | `xs`..`xl` size preset.                         |
+| `shape`        | `AvatarShape`         | `'circle'`  | `circle` or `rounded`.                          |
+| `tone`         | `ZoraTone`            | `'neutral'` | Drives background and fallback content tone.    |
+| `testID`       | `string`              | -           | Test id.                                        |
+
+Inherited props:
+
+No inherited props. `AvatarProps` is declared directly by ZORA.
+
+</details>
+
+### `AvatarGroup`
+
+Overlapping avatar stack with optional overflow label.
+
+```tsx
+<AvatarGroup
+  items={[
+    { id: '1', name: 'Ada Lovelace' },
+    { id: '2', name: 'Grace Hopper', tone: 'success' },
+  ]}
+/>
+```
+
+<details>
+<summary>Props</summary>
+
+ZORA props:
+
+| Prop            | Type                        | Default    | Notes                                |
+| --------------- | --------------------------- | ---------- | ------------------------------------ |
+| `items`         | `AvatarGroupItem[]`         | -          | Avatar sources and fallback fields.  |
+| `max`           | `number`                    | `4`        | Max visible avatars before overflow. |
+| `size`          | `AvatarSize`                | `'s'`      | Avatar size preset.                  |
+| `shape`         | `AvatarShape`               | `'circle'` | Avatar shape preset.                 |
+| `overflowLabel` | `(overflowCount) => string` | `+N`       | Overflow label formatter.            |
+| `testID`        | `string`                    | -          | Test id.                             |
+
+`AvatarGroupItem`:
+
+| Prop           | Type                  | Notes                           |
+| -------------- | --------------------- | ------------------------------- |
+| `id`           | `string`              | Optional stable key.            |
+| `source`       | `ImageSourcePropType` | Image source for the avatar.    |
+| `name`         | `string`              | Used to derive initials.        |
+| `initials`     | `string`              | Explicit initials override.     |
+| `iconFallback` | `ButtonIconSpec`      | Optional icon fallback.         |
+| `label`        | `string`              | Accessibility label.            |
+| `tone`         | `ZoraTone`            | Overrides avatar tone per item. |
+
+Inherited props:
+
+No inherited props. `AvatarGroupProps` is declared directly by ZORA.
+
+</details>
+
 ### `Badge`
 
 Small status label with ZORA tone, emphasis, and size defaults.
@@ -383,11 +460,12 @@ Text input wrapper with ZORA sizing and optional Surface icon specs.
 
 ZORA props:
 
-| Prop           | Type              | Default | Notes                                    |
-| -------------- | ----------------- | ------- | ---------------------------------------- |
-| `size`         | `ZoraControlSize` | `'l'`   | Passed to Surface as `size`.             |
-| `leadingIcon`  | `ButtonIconSpec`  | -       | Rendered as Surface `leadingAccessory`.  |
-| `trailingIcon` | `ButtonIconSpec`  | -       | Rendered as Surface `trailingAccessory`. |
+| Prop             | Type                  | Default | Notes                                                                          |
+| ---------------- | --------------------- | ------- | ------------------------------------------------------------------------------ |
+| `size`           | `ZoraControlSize`     | `'l'`   | Passed to Surface as `size`.                                                   |
+| `leadingIcon`    | `ButtonIconSpec`      | -       | Rendered as Surface `leadingAccessory`.                                        |
+| `trailingIcon`   | `ButtonIconSpec`      | -       | Rendered as Surface `trailingAccessory`.                                       |
+| `trailingAction` | `InputTrailingAction` | -       | Renders an icon-only trailing action (mutually exclusive with `trailingIcon`). |
 
 Inherited props:
 
@@ -400,6 +478,38 @@ Inherits all Surface `TextInputProps` except `leadingAccessory`, `size`, and
 
 </details>
 
+### `SearchBar`
+
+Controlled search input with leading search icon and optional clear action.
+
+```tsx
+<SearchBar value={query} onValueChange={setQuery} onSubmit={(value) => console.log(value)} />
+```
+
+<details>
+<summary>Props</summary>
+
+ZORA props:
+
+| Prop            | Type                      | Default    | Notes                                         |
+| --------------- | ------------------------- | ---------- | --------------------------------------------- |
+| `value`         | `string`                  | -          | Current search query.                         |
+| `onValueChange` | `(value: string) => void` | -          | Called when the query changes.                |
+| `placeholder`   | `string`                  | `'Search'` | Placeholder text.                             |
+| `onSubmit`      | `(value: string) => void` | -          | Called on submit (`returnKeyType="search"`).  |
+| `onClear`       | `() => void`              | -          | Called after clearing the query.              |
+| `clearable`     | `boolean`                 | `true`     | Shows clear action when `value` is non-empty. |
+| `size`          | `ZoraControlSize`         | `'l'`      | Passed to the underlying `Input`.             |
+| `disabled`      | `boolean`                 | -          | Disables the underlying `Input`.              |
+| `readOnly`      | `boolean`                 | -          | Makes the underlying `Input` read-only.       |
+| `testID`        | `string`                  | -          | Test id.                                      |
+
+Inherited props:
+
+No inherited props. `SearchBarProps` is declared directly by ZORA.
+
+</details>
+
 ### `RadioGroup`
 
 Single-selection control built on top of Surface `Radio`, designed for use inside `FormField`.
@@ -498,6 +608,76 @@ to underlying Surface `Checkbox` components.
 
 </details>
 
+### `Chip`
+
+Compact filter/action token with optional icon and selected state.
+
+```tsx
+<Chip selected tone="primary" onPress={() => undefined}>
+  Selected
+</Chip>
+```
+
+<details>
+<summary>Props</summary>
+
+ZORA props:
+
+| Prop       | Type              | Default     | Notes                                |
+| ---------- | ----------------- | ----------- | ------------------------------------ |
+| `children` | `React.ReactNode` | -           | Chip label content.                  |
+| `icon`     | `ButtonIconSpec`  | -           | Optional leading icon spec.          |
+| `selected` | `boolean`         | `false`     | Selected styling state.              |
+| `tone`     | `ZoraTone`        | `'neutral'` | Selected tone.                       |
+| `size`     | `ZoraControlSize` | `'s'`       | Padding and icon sizing.             |
+| `disabled` | `boolean`         | `false`     | Disables interaction and mutes tone. |
+| `onPress`  | `() => void`      | -           | Optional press handler.              |
+| `testID`   | `string`          | -           | Test id.                             |
+
+Inherited props:
+
+No inherited props. `ChipProps` is declared directly by ZORA.
+
+</details>
+
+### `ChipGroup`
+
+Controlled single- or multi-select chip set for filters and facets.
+
+```tsx
+<ChipGroup
+  value="all"
+  onValueChange={setValue}
+  items={[
+    { value: 'all', label: 'All' },
+    { value: 'favorites', label: 'Favorites' },
+  ]}
+/>
+```
+
+<details>
+<summary>Props</summary>
+
+ZORA props:
+
+| Prop            | Type                 | Default     | Notes                          |
+| --------------- | -------------------- | ----------- | ------------------------------ |
+| `items`         | `ChipGroupItem[]`    | -           | Rendered chips.                |
+| `value`         | `string \| string[]` | -           | Selected value(s).             |
+| `onValueChange` | `(value) => void`    | -           | Selection change handler.      |
+| `multiple`      | `boolean`            | `false`     | Enables multi-select mode.     |
+| `tone`          | `ZoraTone`           | `'neutral'` | Tone for selected chips.       |
+| `size`          | `ZoraControlSize`    | `'s'`       | Chip size.                     |
+| `wrap`          | `boolean`            | `true`      | Wrap chips on smaller screens. |
+| `disabled`      | `boolean`            | -           | Disables all chips.            |
+| `testID`        | `string`             | -           | Test id.                       |
+
+Inherited props:
+
+No inherited props. `ChipGroupProps` is declared directly by ZORA.
+
+</details>
+
 ### `Textarea`
 
 Multiline text input wrapper with ZORA sizing and optional Surface icon specs.
@@ -1064,6 +1244,35 @@ No inherited props. `SectionHeaderProps` is declared directly by ZORA.
 
 </details>
 
+### `FilterBar`
+
+Composable row for search + chips + trailing actions.
+
+```tsx
+<FilterBar leading={<SearchBar value={query} onValueChange={setQuery} />}>
+  <ChipGroup value="all" onValueChange={setFilter} items={[{ value: 'all', label: 'All' }]} />
+</FilterBar>
+```
+
+<details>
+<summary>Props</summary>
+
+ZORA props:
+
+| Prop       | Type              | Default | Notes                          |
+| ---------- | ----------------- | ------- | ------------------------------ |
+| `leading`  | `React.ReactNode` | -       | Optional leading content.      |
+| `children` | `React.ReactNode` | -       | Main filter controls.          |
+| `trailing` | `React.ReactNode` | -       | Optional trailing content.     |
+| `wrap`     | `boolean`         | `true`  | Wraps content on small widths. |
+| `testID`   | `string`          | -       | Test id.                       |
+
+Inherited props:
+
+No inherited props. `FilterBarProps` is declared directly by ZORA.
+
+</details>
+
 ### `SettingsRow`
 
 Compact settings row with optional metadata, control, and press handling.

package/dist/components/avatar/Avatar.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { AvatarProps } from './types';
+export declare const Avatar: (props: AvatarProps) => React.ReactElement | null;
+//# sourceMappingURL=Avatar.d.ts.map

package/dist/components/avatar/Avatar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/Avatar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,OAAO,KAAK,EAAE,WAAW,EAA2B,MAAM,SAAS,CAAC;AAyHpE,eAAO,MAAM,MAAM,mDAAkC,CAAC"}

package/dist/components/avatar/Avatar.js

@@ -0,0 +1,80 @@
+import React from 'react';
+import { Image } from 'react-native';
+import { Box } from '../../foundation';
+import { useZoraTheme } from '../../theme/useZoraTheme';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+import { Icon } from '../icon';
+import { Text } from '../text';
+import { resolveAvatarInitials } from './resolveAvatarInitials';
+const AVATAR_SIZES = {
+    xs: 24,
+    s: 32,
+    m: 40,
+    l: 48,
+    xl: 64,
+};
+function resolveRoleSemantics(theme, tone) {
+    switch (tone) {
+        case 'primary':
+            return theme.semantics.action.primary;
+        case 'danger':
+            return theme.semantics.action.danger;
+        case 'success':
+            return theme.semantics.success;
+        case 'warning':
+            return theme.semantics.warning;
+        case 'neutral':
+        default:
+            return theme.semantics.action.neutral;
+    }
+}
+function resolveTextTone(tone) {
+    return tone === 'neutral' ? 'default' : tone;
+}
+function resolveTextVariant(size) {
+    switch (size) {
+        case 'xs':
+        case 's':
+            return 'caption';
+        case 'l':
+            return 'bodySmall';
+        case 'xl':
+            return 'lead';
+        case 'm':
+        default:
+            return 'label';
+    }
+}
+function resolveRadius(shape) {
+    return shape === 'circle' ? 'full' : 'l';
+}
+function AvatarInner({ themeId: _themeId, mode: _mode, testID, source, name, initials, iconFallback, label, size = 'm', shape = 'circle', tone = 'neutral', }) {
+    const { theme } = useZoraTheme();
+    const resolvedSize = AVATAR_SIZES[size];
+    const resolvedInitials = initials ?? resolveAvatarInitials(name);
+    const role = resolveRoleSemantics(theme, tone);
+    const backgroundColor = tone === 'neutral' ? theme.semantics.neutral.surface : role.softBg;
+    const contentColor = tone === 'neutral' ? theme.semantics.content.default : role.base;
+    const radius = resolveRadius(shape);
+    const renderFallback = () => {
+        if (resolvedInitials) {
+            return (<Text tone={resolveTextTone(tone)} variant={resolveTextVariant(size)} weight="semiBold">
+          {resolvedInitials}
+        </Text>);
+        }
+        if (iconFallback) {
+            const iconSize = Math.max(16, Math.round(resolvedSize * 0.48));
+            return (<Icon color={contentColor} name={iconFallback.name} provider={iconFallback.provider} size={iconSize}/>);
+        }
+        return null;
+    };
+    return (<Box accessibilityLabel={label} bg={backgroundColor} height={resolvedSize} radius={radius} testID={testID} width={resolvedSize} style={{
+            alignItems: 'center',
+            justifyContent: 'center',
+            overflow: 'hidden',
+        }}>
+      {source ? (<Image accessibilityLabel={label} source={source} style={{ height: '100%', width: '100%' }}/>) : (renderFallback())}
+    </Box>);
+}
+export const Avatar = withZoraThemeScope(AvatarInner);
+//# sourceMappingURL=Avatar.js.map

package/dist/components/avatar/Avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/components/avatar/Avatar.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { RoleSemantics, SurfaceTheme } from '@ankhorage/surface';\nimport React from 'react';\nimport { Image } from 'react-native';\n\nimport { Box } from '../../foundation';\nimport type { ZoraTone } from '../../internal/recipes';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { Icon } from '../icon';\nimport { Text, type TextTone, type TextVariant } from '../text';\nimport { resolveAvatarInitials } from './resolveAvatarInitials';\nimport type { AvatarProps, AvatarShape, AvatarSize } from './types';\n\nconst AVATAR_SIZES: Record<AvatarSize, number> = {\n  xs: 24,\n  s: 32,\n  m: 40,\n  l: 48,\n  xl: 64,\n};\n\nfunction resolveRoleSemantics(theme: SurfaceTheme, tone: ZoraTone): RoleSemantics {\n  switch (tone) {\n    case 'primary':\n      return theme.semantics.action.primary;\n    case 'danger':\n      return theme.semantics.action.danger;\n    case 'success':\n      return theme.semantics.success;\n    case 'warning':\n      return theme.semantics.warning;\n    case 'neutral':\n    default:\n      return theme.semantics.action.neutral;\n  }\n}\n\nfunction resolveTextTone(tone: ZoraTone): TextTone {\n  return tone === 'neutral' ? 'default' : tone;\n}\n\nfunction resolveTextVariant(size: AvatarSize): TextVariant {\n  switch (size) {\n    case 'xs':\n    case 's':\n      return 'caption';\n    case 'l':\n      return 'bodySmall';\n    case 'xl':\n      return 'lead';\n    case 'm':\n    default:\n      return 'label';\n  }\n}\n\nfunction resolveRadius(shape: AvatarShape): 'full' | 'l' {\n  return shape === 'circle' ? 'full' : 'l';\n}\n\nfunction AvatarInner({\n  themeId: _themeId,\n  mode: _mode,\n  testID,\n  source,\n  name,\n  initials,\n  iconFallback,\n  label,\n  size = 'm',\n  shape = 'circle',\n  tone = 'neutral',\n}: AvatarProps) {\n  const { theme } = useZoraTheme();\n  const resolvedSize = AVATAR_SIZES[size];\n  const resolvedInitials = initials ?? resolveAvatarInitials(name);\n  const role = resolveRoleSemantics(theme, tone);\n  const backgroundColor = tone === 'neutral' ? theme.semantics.neutral.surface : role.softBg;\n  const contentColor = tone === 'neutral' ? theme.semantics.content.default : role.base;\n  const radius = resolveRadius(shape);\n\n  const renderFallback = () => {\n    if (resolvedInitials) {\n      return (\n        <Text tone={resolveTextTone(tone)} variant={resolveTextVariant(size)} weight=\"semiBold\">\n          {resolvedInitials}\n        </Text>\n      );\n    }\n\n    if (iconFallback) {\n      const iconSize = Math.max(16, Math.round(resolvedSize * 0.48));\n      return (\n        <Icon\n          color={contentColor}\n          name={iconFallback.name}\n          provider={iconFallback.provider}\n          size={iconSize}\n        />\n      );\n    }\n\n    return null;\n  };\n\n  return (\n    <Box\n      accessibilityLabel={label}\n      bg={backgroundColor}\n      height={resolvedSize}\n      radius={radius}\n      testID={testID}\n      width={resolvedSize}\n      style={{\n        alignItems: 'center',\n        justifyContent: 'center',\n        overflow: 'hidden',\n      }}\n    >\n      {source ? (\n        <Image\n          accessibilityLabel={label}\n          source={source}\n          style={{ height: '100%', width: '100%' }}\n        />\n      ) : (\n        renderFallback()\n      )}\n    </Box>\n  );\n}\n\nexport const Avatar = withZoraThemeScope(AvatarInner);\n"]}

package/dist/components/avatar/index.d.ts

@@ -0,0 +1,4 @@
+export { Avatar } from './Avatar';
+export { resolveAvatarInitials } from './resolveAvatarInitials';
+export type { AvatarProps, AvatarShape, AvatarSize } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/avatar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC"}

package/dist/components/avatar/index.js

@@ -0,0 +1,3 @@
+export { Avatar } from './Avatar';
+export { resolveAvatarInitials } from './resolveAvatarInitials';
+//# sourceMappingURL=index.js.map

package/dist/components/avatar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/avatar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC","sourcesContent":["export { Avatar } from './Avatar';\nexport { resolveAvatarInitials } from './resolveAvatarInitials';\nexport type { AvatarProps, AvatarShape, AvatarSize } from './types';\n"]}

package/dist/components/avatar/resolveAvatarInitials.d.ts

@@ -0,0 +1,2 @@
+export declare function resolveAvatarInitials(name: string | undefined): string | null;
+//# sourceMappingURL=resolveAvatarInitials.d.ts.map

package/dist/components/avatar/resolveAvatarInitials.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveAvatarInitials.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/resolveAvatarInitials.ts"],"names":[],"mappings":"AAmBA,wBAAgB,qBAAqB,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,GAAG,IAAI,CA0B7E"}

package/dist/components/avatar/resolveAvatarInitials.js

@@ -0,0 +1,44 @@
+function takeFirstCharacter(value) {
+    const trimmed = value.trim();
+    if (!trimmed)
+        return null;
+    const chars = Array.from(trimmed);
+    return chars[0] ? chars[0].toUpperCase() : null;
+}
+function takeFirstTwoCharacters(value) {
+    const trimmed = value.trim();
+    if (!trimmed)
+        return null;
+    const chars = Array.from(trimmed);
+    const [first, second] = chars;
+    if (!first)
+        return null;
+    return `${first}${second ?? ''}`.toUpperCase();
+}
+export function resolveAvatarInitials(name) {
+    if (!name)
+        return null;
+    const parts = name
+        .trim()
+        .split(/\s+/)
+        .map((part) => part.trim())
+        .filter(Boolean);
+    if (parts.length === 0)
+        return null;
+    if (parts.length === 1) {
+        const [part] = parts;
+        return part ? takeFirstTwoCharacters(part) : null;
+    }
+    const [firstPart] = parts;
+    const [lastPart] = parts.slice(-1);
+    const first = firstPart ? takeFirstCharacter(firstPart) : null;
+    const last = lastPart ? takeFirstCharacter(lastPart) : null;
+    if (!first && !last)
+        return null;
+    if (!last)
+        return first;
+    if (!first)
+        return last;
+    return `${first}${last}`;
+}
+//# sourceMappingURL=resolveAvatarInitials.js.map

package/dist/components/avatar/resolveAvatarInitials.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveAvatarInitials.js","sourceRoot":"","sources":["../../../src/components/avatar/resolveAvatarInitials.ts"],"names":[],"mappings":"AAAA,SAAS,kBAAkB,CAAC,KAAa;IACvC,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,EAAE,CAAC;IAC7B,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAC;IAE1B,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAClC,OAAO,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;AAClD,CAAC;AAED,SAAS,sBAAsB,CAAC,KAAa;IAC3C,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,EAAE,CAAC;IAC7B,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAC;IAE1B,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAClC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,KAAK,CAAC;IAC9B,IAAI,CAAC,KAAK;QAAE,OAAO,IAAI,CAAC;IAExB,OAAO,GAAG,KAAK,GAAG,MAAM,IAAI,EAAE,EAAE,CAAC,WAAW,EAAE,CAAC;AACjD,CAAC;AAED,MAAM,UAAU,qBAAqB,CAAC,IAAwB;IAC5D,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IAEvB,MAAM,KAAK,GAAG,IAAI;SACf,IAAI,EAAE;SACN,KAAK,CAAC,KAAK,CAAC;SACZ,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;SAC1B,MAAM,CAAC,OAAO,CAAC,CAAC;IAEnB,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,IAAI,CAAC;IAEpC,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QACvB,MAAM,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC;QACrB,OAAO,IAAI,CAAC,CAAC,CAAC,sBAAsB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IACpD,CAAC;IAED,MAAM,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC;IAC1B,MAAM,CAAC,QAAQ,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IACnC,MAAM,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,kBAAkB,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAC/D,MAAM,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAE5D,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IACjC,IAAI,CAAC,IAAI;QAAE,OAAO,KAAK,CAAC;IACxB,IAAI,CAAC,KAAK;QAAE,OAAO,IAAI,CAAC;IAExB,OAAO,GAAG,KAAK,GAAG,IAAI,EAAE,CAAC;AAC3B,CAAC","sourcesContent":["function takeFirstCharacter(value: string): string | null {\n  const trimmed = value.trim();\n  if (!trimmed) return null;\n\n  const chars = Array.from(trimmed);\n  return chars[0] ? chars[0].toUpperCase() : null;\n}\n\nfunction takeFirstTwoCharacters(value: string): string | null {\n  const trimmed = value.trim();\n  if (!trimmed) return null;\n\n  const chars = Array.from(trimmed);\n  const [first, second] = chars;\n  if (!first) return null;\n\n  return `${first}${second ?? ''}`.toUpperCase();\n}\n\nexport function resolveAvatarInitials(name: string | undefined): string | null {\n  if (!name) return null;\n\n  const parts = name\n    .trim()\n    .split(/\\s+/)\n    .map((part) => part.trim())\n    .filter(Boolean);\n\n  if (parts.length === 0) return null;\n\n  if (parts.length === 1) {\n    const [part] = parts;\n    return part ? takeFirstTwoCharacters(part) : null;\n  }\n\n  const [firstPart] = parts;\n  const [lastPart] = parts.slice(-1);\n  const first = firstPart ? takeFirstCharacter(firstPart) : null;\n  const last = lastPart ? takeFirstCharacter(lastPart) : null;\n\n  if (!first && !last) return null;\n  if (!last) return first;\n  if (!first) return last;\n\n  return `${first}${last}`;\n}\n"]}

package/dist/components/avatar/types.d.ts

@@ -0,0 +1,17 @@
+import type { ButtonIconSpec } from '@ankhorage/surface';
+import type { ImageSourcePropType } from 'react-native';
+import type { ZoraTone } from '../../internal/recipes';
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+export type AvatarSize = 'xs' | 's' | 'm' | 'l' | 'xl';
+export type AvatarShape = 'circle' | 'rounded';
+export interface AvatarProps extends ZoraBaseProps {
+    source?: ImageSourcePropType;
+    name?: string;
+    initials?: string;
+    iconFallback?: ButtonIconSpec;
+    label?: string;
+    size?: AvatarSize;
+    shape?: AvatarShape;
+    tone?: ZoraTone;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/components/avatar/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAExD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;AAEvD,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE/C,MAAM,WAAW,WAAY,SAAQ,aAAa;IAChD,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,cAAc,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB"}

package/dist/components/avatar/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/avatar/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/avatar/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconSpec } from '@ankhorage/surface';\nimport type { ImageSourcePropType } from 'react-native';\n\nimport type { ZoraTone } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport type AvatarSize = 'xs' | 's' | 'm' | 'l' | 'xl';\n\nexport type AvatarShape = 'circle' | 'rounded';\n\nexport interface AvatarProps extends ZoraBaseProps {\n  source?: ImageSourcePropType;\n  name?: string;\n  initials?: string;\n  iconFallback?: ButtonIconSpec;\n  label?: string;\n  size?: AvatarSize;\n  shape?: AvatarShape;\n  tone?: ZoraTone;\n}\n"]}

package/dist/components/avatar-group/AvatarGroup.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { AvatarGroupProps } from './types';
+export declare const AvatarGroup: (props: AvatarGroupProps) => React.ReactElement | null;
+//# sourceMappingURL=AvatarGroup.d.ts.map

package/dist/components/avatar-group/AvatarGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarGroup.d.ts","sourceRoot":"","sources":["../../../src/components/avatar-group/AvatarGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAmB,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAmEjE,eAAO,MAAM,WAAW,wDAAuC,CAAC"}

package/dist/components/avatar-group/AvatarGroup.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { Box, Stack } from '../../foundation';
+import { useZoraTheme } from '../../theme/useZoraTheme';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+import { Avatar } from '../avatar';
+function defaultOverflowLabel(overflowCount) {
+    return `+${overflowCount}`;
+}
+function AvatarGroupInner({ themeId: _themeId, mode: _mode, testID, items, max = 4, size = 's', shape = 'circle', overflowLabel = defaultOverflowLabel, }) {
+    const { theme } = useZoraTheme();
+    const visibleItems = items.slice(0, max);
+    const overflowCount = Math.max(0, items.length - visibleItems.length);
+    const overlap = size === 'xs' ? 8 : size === 's' ? 10 : size === 'm' ? 12 : size === 'l' ? 14 : 16;
+    const borderColor = theme.semantics.surface.default;
+    const renderItem = (item, index) => (<Box key={item.id ?? `${index}`} ml={index === 0 ? 0 : -overlap} radius="full" borderWidth={2} borderColor={borderColor}>
+      <Avatar iconFallback={item.iconFallback} initials={item.initials} label={item.label} name={item.name} shape={shape} size={size} source={item.source} tone={item.tone}/>
+    </Box>);
+    return (<Stack align="center" direction="row" testID={testID} wrap="nowrap">
+      {visibleItems.map(renderItem)}
+      {overflowCount > 0 ? (<Box ml={visibleItems.length === 0 ? 0 : -overlap} radius="full" borderWidth={2} borderColor={borderColor}>
+          <Avatar initials={overflowLabel(overflowCount)} size={size} shape={shape} tone="neutral"/>
+        </Box>) : null}
+    </Stack>);
+}
+export const AvatarGroup = withZoraThemeScope(AvatarGroupInner);
+//# sourceMappingURL=AvatarGroup.js.map

package/dist/components/avatar-group/AvatarGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarGroup.js","sourceRoot":"","sources":["../../../src/components/avatar-group/AvatarGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Box, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { Avatar } from '../avatar';\nimport type { AvatarGroupItem, AvatarGroupProps } from './types';\n\nfunction defaultOverflowLabel(overflowCount: number): string {\n  return `+${overflowCount}`;\n}\n\nfunction AvatarGroupInner({\n  themeId: _themeId,\n  mode: _mode,\n  testID,\n  items,\n  max = 4,\n  size = 's',\n  shape = 'circle',\n  overflowLabel = defaultOverflowLabel,\n}: AvatarGroupProps) {\n  const { theme } = useZoraTheme();\n\n  const visibleItems = items.slice(0, max);\n  const overflowCount = Math.max(0, items.length - visibleItems.length);\n  const overlap =\n    size === 'xs' ? 8 : size === 's' ? 10 : size === 'm' ? 12 : size === 'l' ? 14 : 16;\n  const borderColor = theme.semantics.surface.default;\n\n  const renderItem = (item: AvatarGroupItem, index: number) => (\n    <Box\n      key={item.id ?? `${index}`}\n      ml={index === 0 ? 0 : -overlap}\n      radius=\"full\"\n      borderWidth={2}\n      borderColor={borderColor}\n    >\n      <Avatar\n        iconFallback={item.iconFallback}\n        initials={item.initials}\n        label={item.label}\n        name={item.name}\n        shape={shape}\n        size={size}\n        source={item.source}\n        tone={item.tone}\n      />\n    </Box>\n  );\n\n  return (\n    <Stack align=\"center\" direction=\"row\" testID={testID} wrap=\"nowrap\">\n      {visibleItems.map(renderItem)}\n      {overflowCount > 0 ? (\n        <Box\n          ml={visibleItems.length === 0 ? 0 : -overlap}\n          radius=\"full\"\n          borderWidth={2}\n          borderColor={borderColor}\n        >\n          <Avatar\n            initials={overflowLabel(overflowCount)}\n            size={size}\n            shape={shape}\n            tone=\"neutral\"\n          />\n        </Box>\n      ) : null}\n    </Stack>\n  );\n}\n\nexport const AvatarGroup = withZoraThemeScope(AvatarGroupInner);\n"]}

package/dist/components/avatar-group/index.d.ts

@@ -0,0 +1,3 @@
+export { AvatarGroup } from './AvatarGroup';
+export type { AvatarGroupItem, AvatarGroupProps } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/avatar-group/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/avatar-group/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC"}

package/dist/components/avatar-group/index.js

@@ -0,0 +1,2 @@
+export { AvatarGroup } from './AvatarGroup';
+//# sourceMappingURL=index.js.map

package/dist/components/avatar-group/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/avatar-group/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC","sourcesContent":["export { AvatarGroup } from './AvatarGroup';\nexport type { AvatarGroupItem, AvatarGroupProps } from './types';\n"]}

package/dist/components/avatar-group/types.d.ts

@@ -0,0 +1,22 @@
+import type { ButtonIconSpec } from '@ankhorage/surface';
+import type { ImageSourcePropType } from 'react-native';
+import type { ZoraTone } from '../../internal/recipes';
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+import type { AvatarShape, AvatarSize } from '../avatar';
+export interface AvatarGroupItem {
+    id?: string;
+    source?: ImageSourcePropType;
+    name?: string;
+    initials?: string;
+    iconFallback?: ButtonIconSpec;
+    label?: string;
+    tone?: ZoraTone;
+}
+export interface AvatarGroupProps extends ZoraBaseProps {
+    items: readonly AvatarGroupItem[];
+    max?: number;
+    size?: AvatarSize;
+    shape?: AvatarShape;
+    overflowLabel?: (overflowCount: number) => string;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/components/avatar-group/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/avatar-group/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAExD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAEzD,MAAM,WAAW,eAAe;IAC9B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,cAAc,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB;AAED,MAAM,WAAW,gBAAiB,SAAQ,aAAa;IACrD,KAAK,EAAE,SAAS,eAAe,EAAE,CAAC;IAClC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,aAAa,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,MAAM,CAAC;CACnD"}

package/dist/components/avatar-group/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/avatar-group/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/avatar-group/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconSpec } from '@ankhorage/surface';\nimport type { ImageSourcePropType } from 'react-native';\n\nimport type { ZoraTone } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\nimport type { AvatarShape, AvatarSize } from '../avatar';\n\nexport interface AvatarGroupItem {\n  id?: string;\n  source?: ImageSourcePropType;\n  name?: string;\n  initials?: string;\n  iconFallback?: ButtonIconSpec;\n  label?: string;\n  tone?: ZoraTone;\n}\n\nexport interface AvatarGroupProps extends ZoraBaseProps {\n  items: readonly AvatarGroupItem[];\n  max?: number;\n  size?: AvatarSize;\n  shape?: AvatarShape;\n  overflowLabel?: (overflowCount: number) => string;\n}\n"]}

package/dist/components/chip/Chip.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { ChipProps } from './types';
+export declare const Chip: (props: ChipProps) => React.ReactElement | null;
+//# sourceMappingURL=Chip.d.ts.map

package/dist/components/chip/Chip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../src/components/chip/Chip.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,KAAK,EAAwB,SAAS,EAAE,MAAM,SAAS,CAAC;AAoF/D,eAAO,MAAM,IAAI,iDAAgC,CAAC"}