@cdx-ui/primitives 0.0.1-beta.9 → 0.0.1-beta.90

package/README.md

@@ -1,8 +1,8 @@
 # @cdx-ui/primitives
 
-Unstyled, accessible behavioral components (headless) for the Candescent Design System.
+Unstyled, accessible behavioral components (headless) for the Forge Design System.
 
-Primitives provide interaction logic, focus management, and accessibility without imposing any visual styling. They serve as the foundation for [`@cdx-ui/components`](../components/).
+Primitives provide interaction logic, focus management, and accessibility without imposing any visual styling. They serve as the foundation for `@cdx-ui/components`.
 
 ## Installation
 
@@ -12,41 +12,76 @@ pnpm add @cdx-ui/primitives
 
 ### Peer dependencies
 
-- `react` >= 18.0.0
-- `react-native` >= 0.74.0 _(optional)_
+- `react` ^18.2.0 || ^19.0.0
+- `react-native` >= 0.76.0 _(optional)_
+- `react-native-reanimated` >= 3.0.0 _(optional)_
 - `react-native-web` >= 0.19.0 _(optional)_
 
-## Factory functions
-
-Each `create*` factory accepts a map of base React Native components and returns a compound component with built-in interaction state tracking, accessibility (roles, ARIA props, keyboard handling), and context propagation.
-
-| Factory          | Returns                                                                                                 |
-| ---------------- | ------------------------------------------------------------------------------------------------------- |
-| `createButton`   | `Button` + `.Text` `.Group` `.Spinner` `.Icon`                                                          |
-| `createInput`    | `Input` + `.Slot` `.Field`                                                                              |
-| `createSelect`   | `Select` + `.Trigger` `.Value` `.Icon` `.Content` `.Item` `.ItemLabel`                                  |
-| `createCheckbox` | `Checkbox` + `.Indicator` `.Icon` `.Label` `.Group`                                                     |
-| `createSwitch`   | `Switch`                                                                                                |
-| `createLink`     | `Link`                                                                                                  |
-| `createAvatar`   | `Avatar` + `.Image` `.Text` `.Icon` `.Badge`                                                            |
-| `createDialog`   | `Dialog` + `.Root` `.Trigger` `.Content` `.Header` `.Title` `.Description` `.Body` `.Footer` `.Close`   |
-| `createField`    | `Field` + `.Label` `.Helper` `.HelperText` `.Error` `.ErrorText` `.ErrorIcon`                           |
-| `createForm`     | `Form`                                                                                                  |
-| `createListItem` | `ListItem` + `.LeadingSlot` `.Content` `.Title` `.Description` `.Meta` `.TrailingSlot` `.SectionHeader` |
-| `createOtpInput` | `OtpInput` + `.Cell` `.Field`                                                                           |
-| `createProgress` | `Progress` + `.Indicator`                                                                               |
+## Primitives
+
+Concrete behavioral components with built-in interaction state tracking, accessibility (roles, ARIA props, keyboard handling), and context propagation. Each primitive owns behavior that the styled layer (`@cdx-ui/components`) cannot express with host elements alone.
+
+| Export                                                       | Description                                                                                                                                                                                                                     |
+| ------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `AvatarRoot`                                                 | Concrete root primitive (context provider for image load state; Image/Text/Icon/Badge live in `@cdx-ui/components`)                                                                                                             |
+| `ButtonRoot`                                                 | Concrete root primitive (no sub-slots — Label/Icon/Spinner/Group live in `@cdx-ui/components`)                                                                                                                                  |
+| `CheckboxRoot`, `CheckboxGroup`                              | Concrete checkbox primitives (Root owns controlled state + ARIA + `.web` split; Group owns group context. Indicator/Icon/Label live in `@cdx-ui/components`)                                                                    |
+| `ChipRoot`                                                   | Concrete root primitive (View/Pressable union with interaction state + context; Label/Icon/Avatar live in `@cdx-ui/components`)                                                                                                 |
+| `DialogRoot`, `DialogTrigger`, `DialogPopup`, `DialogClose`  | Concrete dialog primitives (Root owns open state + context; Trigger/Close use `Slot` for `asChild`; Popup owns portal/focus-scope. Header/Title/Description/Content/Footer live in `@cdx-ui/components`)                        |
+| `FieldRoot`, `FieldLabel`                                    | Concrete field primitives (Root provides `FormControlContext`; Label is platform-split: `Text` + focus-bridge on native, `<label htmlFor>` on web; Helper/Error/ErrorIcon live in `@cdx-ui/components`)                         |
+| `FormRoot`                                                   | Concrete form primitive (platform-split: `<form>` on web, `View` on native)                                                                                                                                                     |
+| `InputRoot`, `InputField`                                    | Concrete input primitives (Root owns input context; Field is platform-split: `.tsx`/`.web.tsx`/`.android.tsx`. Slot lives in `@cdx-ui/components`)                                                                              |
+| `LinkRoot`                                                   | Concrete link primitive (`useLink` press behavior + ARIA + cross-platform routing)                                                                                                                                              |
+| `ListItemRoot`                                               | Concrete root primitive (View/Pressable union with bespoke `asChild` merging — interaction state + context; LeadingSlot/Content/Title/Description/Meta/TrailingSlot/SectionHeader live in `@cdx-ui/components`)                 |
+| `useOtpInput`, `OtpInputField`                               | Headless hook for OTP state machine + concrete per-cell TextInput primitive (focus management, a11y, autofill; styled layer composes `Input`/`HStack` on top)                                                                   |
+| `ProgressBarRoot`, `ProgressBarIndicator`                    | Concrete progress primitives (Root owns percent context; Indicator maps percent to width)                                                                                                                                       |
+| `RadioRoot`, `RadioGroup`                                    | Concrete radio primitives (Root owns interaction + checked state + `.web` split; Group owns selection contract + group context. Indicator/Label live in `@cdx-ui/components`)                                                   |
+| `SelectRoot`, `SelectTrigger`, `SelectContent`, `SelectItem` | Concrete select primitives (Root owns controlled value/open state; Trigger is platform-split; Content owns FocusScope + keyboard nav; Item owns selection state. Value/Icon/ItemLabel live in `@cdx-ui/components`)             |
+| `useSwitch`                                                  | Headless hook for `Switch` (controlled state + ARIA + interaction tracking; styled layer renders the host element)                                                                                                              |
+| `TileRoot`, `TileGroup`                                      | Concrete tile primitives (Root owns interaction + selection state + per-tile context; Group owns selection contract + group context. LeadingSlot/Content/Title/Description/Indicator/TrailingSlot live in `@cdx-ui/components`) |
 
 ### Utility exports
 
-| Export                  | Description                                                                                       |
-| ----------------------- | ------------------------------------------------------------------------------------------------- |
-| `dataAttributes`        | Builds `data-hover`, `data-active`, `data-focus-visible`, etc. from an `InteractionState` object. |
-| `OverlayInsetsProvider` | Context provider for safe-area insets used by overlay/dialog positioning.                         |
-| `InteractionState`      | Type: `{ hover, focus, active, disabled, focusVisible }`.                                         |
-| `EdgeInsets`            | Type: `{ top, right, bottom, left }`.                                                             |
+| Export                   | Description                                                                                       |
+| ------------------------ | ------------------------------------------------------------------------------------------------- |
+| `dataAttributes`         | Builds `data-hover`, `data-active`, `data-focus-visible`, etc. from an `InteractionState` object. |
+| `mergeDataAttributes`    | Combines multiple data-attribute sources into one spread (prevents overwrites on web).            |
+| `domDataAttributes`      | Web-specific variant that converts data attributes to DOM-compatible format.                      |
+| `mergeDomDataAttributes` | Web-specific merge variant for combining DOM data attribute sources.                              |
+| `Slot`                   | Primitives-layer `asChild` implementation — merges props/ref onto the consumer's child element.   |
+| `FormControlContext`     | Re-exported from `@cdx-ui/utils`; shared context for field/form control state.                    |
+| `useFormControlContext`  | Re-exported from `@cdx-ui/utils`; reads `FormControlContext` in descendant components.            |
+| `OverlayInsetsProvider`  | Context provider for safe-area insets used by overlay/dialog positioning.                         |
+| `InteractionState`       | Type: `{ hover, focus, active, disabled, focusVisible }`.                                         |
+| `EdgeInsets`             | Type: `{ top, right, bottom, left }`.                                                             |
+
+### OTP input utilities
+
+Standalone helper functions re-exported from the otp-input module for custom OTP input implementations:
+
+| Export                                         | Description                                                                  |
+| ---------------------------------------------- | ---------------------------------------------------------------------------- |
+| `applyOtpInputChange(value, change, position)` | Applies a character change (insert, delete, replace) to an OTP value string. |
+| `filterDigits(text)`                           | Filters a string to digits only (0–9).                                       |
+| `filterAllowedCharacters(text, allowed)`       | Filters a string to characters matching a provided set.                      |
+| `filterByRegExp(text, pattern)`                | Filters a string to characters matching a regular expression.                |
 
-The dialog module also exports `DialogProvider` and `useDialog()` for imperative control, and the link module exports `LinkProvider` for router integration.
+### Context hooks and providers
 
-## Further reading
+Several modules export context providers and hooks for reading component state from descendant sub-components or for integrating with external systems (e.g., routing).
 
-- [Definitions](../../docs/internal/practices/definitions.md) — artifact taxonomy (primitive vs component vs utility)
+| Module    | Provider(s)                                | Hook(s)                                        | Context value type(s)                                   |
+| --------- | ------------------------------------------ | ---------------------------------------------- | ------------------------------------------------------- |
+| avatar    | —                                          | `useAvatarContext`                             | `IAvatarContextValue`                                   |
+| button    | —                                          | `useButtonContext`                             | `InteractionState`                                      |
+| checkbox  | —                                          | `useCheckboxContext`                           | `ICheckboxContextValue`                                 |
+| chip      | —                                          | `useChipContext`                               | `InteractionState`                                      |
+| dialog    | `DialogProvider`                           | `useDialog`                                    | `IDialogContextType`                                    |
+| input     | —                                          | `useInputContext`                              | `IInputContextValue`                                    |
+| link      | `LinkProvider`, `LinkInteractionProvider`  | `useLink`, `useLinkInteractionContext`         | `LinkConfig`, `LinkInteractionState`                    |
+| list-item | `ListItemProvider`                         | `useListItemContext`                           | `InteractionState`                                      |
+| otp-input | `OtpInputProvider`, `OtpCellIndexProvider` | `useOtpInputContext`, `useOtpCellIndexContext` | `OtpInputContextValue`, `OtpInputCellIndexContextValue` |
+| progress  | —                                          | `useProgressContext`                           | `ProgressContextValue`                                  |
+| radio     | `RadioProvider`                            | `useRadioContext`                              | `IRadioContextValue`                                    |
+| select    | —                                          | `useSelectContext`, `useSelectItemContext`     | `ISelectContextValue`, `ISelectItemContextValue`        |
+| tile      | `TileProvider`                             | `useTileContext`                               | `ITileContextValue`, `ITileGroupContextValue`           |

package/lib/commonjs/CLAUDE.md

@@ -0,0 +1,84 @@
+# Primitive Authoring
+
+Auto-loaded when working in `packages/primitives/src/**`.
+
+Primitives in `@cdx-ui/primitives` are unstyled behavioral components that handle accessibility and interactions. Read the full guides before making changes:
+
+- `docs/internal/practices/composition.md` — compound component structure
+- `docs/internal/practices/types.md` — `I*Props` convention, extending RN base types
+- `docs/internal/practices/accessibility.md` — ARIA roles, keyboard nav, screen reader support
+- `docs/internal/practices/as-child.md` — `asChild` prop pattern
+- `docs/internal/practices/data-attributes.md` — `data-state` and `data-slot` conventions
+
+## Six standards
+
+Forge UI primitives and their styled counterparts follow six standards. The first three govern primitive-layer authoring; the last three govern the styled layer (see `packages/components/src/components/CLAUDE.md`).
+
+### Standard 1 — Data attributes for interaction states
+
+Root primitives emit `data-*` attributes for the interaction state they own and expose that state via context. Sub-slots **do not** subscribe to context and **do not** emit interaction `data-*` attributes — they opt in only when their own styling or behavior reacts to that state.
+
+- **Root** — emits + provides context. Always.
+- **Sub-slot** — does not subscribe, does not emit. Opt in only when the styled layer (or the slot's own behavior) demonstrably reacts to the state.
+
+Pointlessly emitting on every sub-slot multiplies bridge writes (native) and DOM attribute writes (web) for no consumer benefit. A sub-slot that calls `useButtonContext()` becomes a subscriber — every interaction re-renders it even when nothing visually changes.
+
+`useButtonContext()` stays exported so styled-layer slots and external consumers can opt in when they actually need it.
+
+### Standard 2 — `asChild` support
+
+Every public primitive supports `asChild` via `Slot` (re-exported from `packages/primitives/src/slot`). The runtime cost when `asChild` is `false` is a single boolean check; consumers who opt in pay the merge cost themselves.
+
+```tsx
+const Comp = asChild ? Slot : DefaultElement;
+```
+
+### Standard 3 — When to create a primitive (the primitive-existence test)
+
+Create a primitive **only** when the slot owns behavior. A slot earns a primitive if it has at least one of:
+
+1. **Behavioral state machinery** — interaction hooks (`useFocus`, `useFocusRing`, `useHover`, `usePress`), controlled/uncontrolled state, open/closed/checked/value management.
+2. **Non-host accessibility semantics** — ARIA role/state beyond what the host element provides natively, custom keyboard handling, screen-reader announcements, focus traps.
+3. **Cross-platform host abstraction** — different host element per platform (e.g., a `.web.tsx` / `.native.tsx` split).
+4. **Compound contract ownership** — defines the compound's state surface and is the context provider (i.e., the Root).
+
+A slot does **not** earn a primitive if it only:
+
+- Wraps a host element with `className`/`style`.
+- Reads context for styling (the styled layer reads it directly via `useButtonContext`, `useStyleContext`, etc.).
+- Wants `asChild` (the styled layer uses `Slot` directly — it is re-exported from `@cdx-ui/primitives`).
+
+This eliminates the "factory pass-through" anti-pattern (e.g., a `ButtonIcon` primitive whose body is `<View {...props} ref={ref} />`). Such wrappers add nothing and force every consumer through a useless layer.
+
+## Canonical reference
+
+`packages/primitives/src/button/ButtonRoot.tsx` is the canonical concrete primitive. It demonstrates every Standard 1–3 requirement: concrete `forwardRef` component over `Pressable`, `asChild` via `Slot`, `dataAttributes()` for interaction state, `ButtonProvider` for context, function-as-children, ARIA defaults, and composed event handlers.
+
+`packages/primitives/src/button/` only ships `ButtonRoot` + `useButtonContext` + types. There is intentionally no `ButtonLabel`/`ButtonIcon`/`ButtonSpinner`/`ButtonGroup` primitive — those slots fail the primitive-existence test, so they live in `@cdx-ui/components` only.
+
+The styled-layer Indicator inside `packages/components/src/components/QuickActionButton/index.tsx` is the canonical example of a sub-slot that legitimately opts into interaction state. When (and only when) its own styling reacts to hover/focus/press, it reads `useButtonContext()` and emits `data-*` via `mergeDataAttributes(props, dataAttributes({ ... }))` — the same pattern external consumers use.
+
+## Pattern summary
+
+Each concrete primitive is a `forwardRef` component that hardcodes its default RN base element and supports `asChild` via `Slot`:
+
+1. **Concrete component** — `export const ComponentRoot = forwardRef<View, Props>(...)` hardcodes `View`/`Pressable`/`Text` as the default; uses `const Comp = asChild ? Slot : View` for the escape hatch
+2. **Interaction hooks** — `useFocus`, `useFocusRing`, `useHover`, `usePress` from `@react-native-aria/*`
+3. **Data attributes** — `dataAttributes({ hover, focus, active, disabled, focusVisible })` emitted on the rendered element for Uniwind `data-[state]` selectors
+4. **Context provider** — interaction state exposed via context so sub-slots and external consumers can opt in
+5. **Barrel export** — `index.ts` re-exports the concrete components, context, and types
+6. **`displayName`** — set on every exported component
+
+## Key rules
+
+- **Unstyled** — no visual styling (no `className`, no color/spacing classes). Only behavioral and a11y concerns.
+- **`asChild` via `Slot`** — import `Slot` from `../slot`; use `const Comp = asChild ? Slot : DefaultElement`.
+- **`I*Props` convention** — public prop types are aliased with `I` prefix (e.g., `IButtonProps`), exported from `types.ts`.
+- **`Interface*Props` pattern** — the full interface (e.g., `InterfaceButtonProps`) extends the appropriate RN base type (`PressableProps`, `ViewProps`, etc.) with interaction state booleans (`isHovered`, `isActive`, `isFocused`, `isFocusVisible`, `isDisabled`); re-exported as `I*Props`.
+- **`dataAttributes()` helper** — always use the helper from `../utils/dataAttributes` to emit `data-*` props; it handles platform differences (native vs web).
+- **`mergeDataAttributes(...sources)` helper** — when a primitive Root receives data attrs through `props` from its styled layer (e.g. `data-slot`) AND emits its own data attrs (e.g. interaction state), combine them via `mergeDataAttributes(props, dataAttributes({...}))`. A plain `{...dataAttributes({...})} {...props}` spread chain wipes out one side on web — `dataAttributes` returns `{ dataSet }`, so back-to-back spreads replace each other. The merge helper preserves both. `ButtonRoot.tsx` shows the canonical pattern.
+- **`composeEventHandlers`** from `@cdx-ui/utils` — merge consumer handlers with internal handlers; never silently override.
+- **`forwardRef`** on every component — refs forwarded to the underlying host element.
+- **ARIA roles** — set `role` with a sensible default (e.g., `role={props?.role || 'button'}`).
+- **Render children as function** — support `children` as `(state: InteractionState) => ReactNode` for state-driven rendering where the Root exposes interaction state.
+- **Consumable independently** of `@cdx-ui/components` — no imports from the styled layer.

package/lib/commonjs/avatar/AvatarRoot.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AvatarRoot = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _slot = require("../slot");
+var _context = require("./context");
+var _jsxRuntime = require("react/jsx-runtime");
+const AvatarRoot = exports.AvatarRoot = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  children,
+  ...props
+}, ref) => {
+  const [imageLoaded, setImageLoaded] = (0, _react.useState)(false);
+  const [imageError, setImageError] = (0, _react.useState)(false);
+  const contextValue = (0, _react.useMemo)(() => ({
+    imageLoaded,
+    imageError,
+    setImageLoaded,
+    setImageError
+  }), [imageLoaded, imageError]);
+  const Comp = asChild ? _slot.Slot : _reactNative.View;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_context.AvatarProvider, {
+    value: contextValue,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
+      ref: ref,
+      role: props.role || 'img',
+      accessibilityRole: "image",
+      ...props,
+      children: children
+    })
+  });
+});
+AvatarRoot.displayName = 'AvatarRoot';
+//# sourceMappingURL=AvatarRoot.js.map

package/lib/commonjs/avatar/AvatarRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_slot","_context","_jsxRuntime","AvatarRoot","exports","forwardRef","asChild","children","props","ref","imageLoaded","setImageLoaded","useState","imageError","setImageError","contextValue","useMemo","Comp","Slot","View","jsx","AvatarProvider","value","role","accessibilityRole","displayName"],"sourceRoot":"../../../src","sources":["avatar/AvatarRoot.tsx"],"mappings":";;;;;;AACA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAA2C,IAAAI,WAAA,GAAAJ,OAAA;AAOpC,MAAMK,UAAU,GAAAC,OAAA,CAAAD,UAAA,gBAAG,IAAAE,iBAAU,EAClC,CAAC;EAAEC,OAAO;EAAEC,QAAQ;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EACxC,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAG,IAAAC,eAAQ,EAAC,KAAK,CAAC;EACrD,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAG,IAAAF,eAAQ,EAAC,KAAK,CAAC;EAEnD,MAAMG,YAAY,GAAG,IAAAC,cAAO,EAC1B,OAAO;IAAEN,WAAW;IAAEG,UAAU;IAAEF,cAAc;IAAEG;EAAc,CAAC,CAAC,EAClE,CAACJ,WAAW,EAAEG,UAAU,CAC1B,CAAC;EAED,MAAMI,IAAI,GAAGX,OAAO,GAAGY,UAAI,GAAGC,iBAAI;EAElC,oBACE,IAAAjB,WAAA,CAAAkB,GAAA,EAACnB,QAAA,CAAAoB,cAAc;IAACC,KAAK,EAAEP,YAAa;IAAAR,QAAA,eAClC,IAAAL,WAAA,CAAAkB,GAAA,EAACH,IAAI;MACHR,GAAG,EAAEA,GAAI;MACTc,IAAI,EAAEf,KAAK,CAACe,IAAI,IAAI,KAAM;MAC1BC,iBAAiB,EAAC,OAAO;MAAA,GACpBhB,KAAK;MAAAD,QAAA,EAETA;IAAQ,CACL;EAAC,CACO,CAAC;AAErB,CACF,CAAC;AAEDJ,UAAU,CAACsB,WAAW,GAAG,YAAY","ignoreList":[]}

package/lib/commonjs/avatar/index.js

@@ -3,28 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.createAvatar = createAvatar;
-var _createAvatarBadge = require("./createAvatarBadge");
-var _createAvatarIcon = require("./createAvatarIcon");
-var _createAvatarText = require("./createAvatarText");
-var _createAvatarImage = require("./createAvatarImage");
-var _createAvatarRoot = require("./createAvatarRoot");
-function createAvatar(BaseComponents) {
-  const Avatar = (0, _createAvatarRoot.createAvatarRoot)(BaseComponents.Root);
-  const AvatarImage = (0, _createAvatarImage.createAvatarImage)(BaseComponents.Image);
-  const Text = (0, _createAvatarText.createAvatarText)(BaseComponents.Text);
-  const AvatarIcon = (0, _createAvatarIcon.createAvatarIcon)(BaseComponents.Icon);
-  const Badge = (0, _createAvatarBadge.createAvatarBadge)(BaseComponents.Badge);
-  Avatar.displayName = 'AvatarPrimitive';
-  AvatarImage.displayName = 'AvatarPrimitive.Image';
-  Text.displayName = 'AvatarPrimitive.Text';
-  AvatarIcon.displayName = 'AvatarPrimitive.Icon';
-  Badge.displayName = 'AvatarPrimitive.Badge';
-  return Object.assign(Avatar, {
-    Image: AvatarImage,
-    Text,
-    Icon: AvatarIcon,
-    Badge
-  });
-}
+Object.defineProperty(exports, "AvatarRoot", {
+  enumerable: true,
+  get: function () {
+    return _AvatarRoot.AvatarRoot;
+  }
+});
+Object.defineProperty(exports, "useAvatarContext", {
+  enumerable: true,
+  get: function () {
+    return _context.useAvatarContext;
+  }
+});
+var _context = require("./context");
+var _AvatarRoot = require("./AvatarRoot");
 //# sourceMappingURL=index.js.map

package/lib/commonjs/avatar/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_createAvatarBadge","require","_createAvatarIcon","_createAvatarText","_createAvatarImage","_createAvatarRoot","createAvatar","BaseComponents","Avatar","createAvatarRoot","Root","AvatarImage","createAvatarImage","Image","Text","createAvatarText","AvatarIcon","createAvatarIcon","Icon","Badge","createAvatarBadge","displayName","Object","assign"],"sourceRoot":"../../../src","sources":["avatar/index.ts"],"mappings":";;;;;;AACA,IAAAA,kBAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AACA,IAAAG,kBAAA,GAAAH,OAAA;AACA,IAAAI,iBAAA,GAAAJ,OAAA;AAYO,SAASK,YAAYA,CAAiCC,cAM5D,EAAE;EACD,MAAMC,MAAM,GAAG,IAAAC,kCAAgB,EAACF,cAAc,CAACG,IAAI,CAAC;EACpD,MAAMC,WAAW,GAAG,IAAAC,oCAAiB,EAACL,cAAc,CAACM,KAAK,CAAC;EAC3D,MAAMC,IAAI,GAAG,IAAAC,kCAAgB,EAACR,cAAc,CAACO,IAAI,CAAC;EAClD,MAAME,UAAU,GAAG,IAAAC,kCAAgB,EAACV,cAAc,CAACW,IAAI,CAAC;EACxD,MAAMC,KAAK,GAAG,IAAAC,oCAAiB,EAACb,cAAc,CAACY,KAAK,CAAC;EAErDX,MAAM,CAACa,WAAW,GAAG,iBAAiB;EACtCV,WAAW,CAACU,WAAW,GAAG,uBAAuB;EACjDP,IAAI,CAACO,WAAW,GAAG,sBAAsB;EACzCL,UAAU,CAACK,WAAW,GAAG,sBAAsB;EAC/CF,KAAK,CAACE,WAAW,GAAG,uBAAuB;EAE3C,OAAOC,MAAM,CAACC,MAAM,CAACf,MAAM,EAAE;IAC3BK,KAAK,EAAEF,WAAW;IAClBG,IAAI;IACJI,IAAI,EAAEF,UAAU;IAChBG;EACF,CAAC,CAAC;AACJ","ignoreList":[]}
+{"version":3,"names":["_context","require","_AvatarRoot"],"sourceRoot":"../../../src","sources":["avatar/index.ts"],"mappings":";;;;;;;;;;;;;;;;;AACA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA","ignoreList":[]}

package/lib/commonjs/button/ButtonRoot.js

@@ -0,0 +1,85 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ButtonRoot = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _utils = require("@cdx-ui/utils");
+var _focus = require("@react-native-aria/focus");
+var _interactions = require("@react-native-aria/interactions");
+var _slot = require("../slot");
+var _dataAttributes = require("../utils/dataAttributes");
+var _context = require("./context");
+var _jsxRuntime = require("react/jsx-runtime");
+const ButtonRoot = exports.ButtonRoot = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  children,
+  isDisabled,
+  isHovered: isHoveredProp,
+  isActive: isActiveProp,
+  isFocused: isFocusedProp,
+  isFocusVisible: isFocusVisibleProp,
+  ...props
+}, ref) => {
+  const {
+    isFocused,
+    focusProps
+  } = (0, _focus.useFocus)();
+  const {
+    isFocusVisible,
+    focusProps: focusRingProps
+  } = (0, _focus.useFocusRing)();
+  const {
+    pressProps: pressableProps,
+    isPressed: isActive
+  } = (0, _interactions.usePress)({
+    isDisabled
+  });
+  const {
+    isHovered,
+    hoverProps
+  } = (0, _interactions.useHover)();
+  const contextValue = (0, _react.useMemo)(() => {
+    return {
+      hover: isHoveredProp || isHovered,
+      focus: isFocusedProp || isFocused,
+      active: isActiveProp || isActive,
+      disabled: !!isDisabled,
+      focusVisible: isFocusVisibleProp || isFocusVisible
+    };
+  }, [isHovered, isHoveredProp, isFocused, isFocusedProp, isActive, isActiveProp, isDisabled, isFocusVisible, isFocusVisibleProp]);
+  const Comp = asChild ? _slot.Slot : _reactNative.Pressable;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_context.ButtonProvider, {
+    value: contextValue,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
+      ref: ref,
+      role: props?.role || 'button',
+      disabled: isDisabled,
+      ...props,
+      ...(0, _dataAttributes.mergeDataAttributes)(props, (0, _dataAttributes.dataAttributes)({
+        hover: isHoveredProp || isHovered,
+        focus: isFocusedProp || isFocused,
+        active: isActiveProp || isActive,
+        disabled: !!isDisabled,
+        focusVisible: isFocusVisibleProp || isFocusVisible
+      })),
+      onPressIn: (0, _utils.composeEventHandlers)(props?.onPressIn, pressableProps.onPressIn),
+      onPressOut: (0, _utils.composeEventHandlers)(props?.onPressOut, pressableProps.onPressOut),
+      onHoverIn: (0, _utils.composeEventHandlers)(props?.onHoverIn, hoverProps.onHoverIn),
+      onHoverOut: (0, _utils.composeEventHandlers)(props?.onHoverOut, hoverProps.onHoverOut),
+      onFocus: (0, _utils.composeEventHandlers)((0, _utils.composeEventHandlers)(props?.onFocus, focusProps.onFocus), focusRingProps.onFocus),
+      onBlur: (0, _utils.composeEventHandlers)((0, _utils.composeEventHandlers)(props?.onBlur, focusProps.onBlur), focusRingProps.onBlur),
+      children: typeof children === 'function' ? children({
+        hover: isHoveredProp || isHovered,
+        focus: isFocusedProp || isFocused,
+        active: isActiveProp || isActive,
+        disabled: !!isDisabled,
+        focusVisible: isFocusVisibleProp || isFocusVisible
+      }) : children
+    })
+  });
+});
+ButtonRoot.displayName = 'ButtonRoot';
+//# sourceMappingURL=ButtonRoot.js.map

package/lib/commonjs/button/ButtonRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_utils","_focus","_interactions","_slot","_dataAttributes","_context","_jsxRuntime","ButtonRoot","exports","forwardRef","asChild","children","isDisabled","isHovered","isHoveredProp","isActive","isActiveProp","isFocused","isFocusedProp","isFocusVisible","isFocusVisibleProp","props","ref","focusProps","useFocus","focusRingProps","useFocusRing","pressProps","pressableProps","isPressed","usePress","hoverProps","useHover","contextValue","useMemo","hover","focus","active","disabled","focusVisible","Comp","Slot","Pressable","jsx","ButtonProvider","value","role","mergeDataAttributes","dataAttributes","onPressIn","composeEventHandlers","onPressOut","onHoverIn","onHoverOut","onFocus","onBlur","displayName"],"sourceRoot":"../../../src","sources":["button/ButtonRoot.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/button/index.js

@@ -3,35 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.createButton = createButton;
+Object.defineProperty(exports, "ButtonRoot", {
+  enumerable: true,
+  get: function () {
+    return _ButtonRoot.ButtonRoot;
+  }
+});
 Object.defineProperty(exports, "useButtonContext", {
   enumerable: true,
   get: function () {
     return _context.useButtonContext;
   }
 });
-var _createButtonGroup = require("./createButtonGroup");
-var _createButtonIcon = require("./createButtonIcon");
-var _createButtonRoot = require("./createButtonRoot");
-var _createButtonSpinner = require("./createButtonSpinner");
-var _createButtonText = require("./createButtonText");
 var _context = require("./context");
-function createButton(BaseComponents) {
-  const Button = (0, _createButtonRoot.createButtonRoot)(BaseComponents.Root);
-  const Text = (0, _createButtonText.createButtonText)(BaseComponents.Text);
-  const Group = (0, _createButtonGroup.createButtonGroup)(BaseComponents.Group);
-  const Spinner = (0, _createButtonSpinner.createButtonSpinner)(BaseComponents.Spinner);
-  const Icon = (0, _createButtonIcon.createButtonIcon)(BaseComponents.Icon);
-  Button.displayName = 'ButtonPrimitive';
-  Text.displayName = 'ButtonPrimitive.Text';
-  Group.displayName = 'ButtonPrimitive.Group';
-  Spinner.displayName = 'ButtonPrimitive.Spinner';
-  Icon.displayName = 'ButtonPrimitive.Icon';
-  return Object.assign(Button, {
-    Text,
-    Group,
-    Spinner,
-    Icon
-  });
-}
+var _ButtonRoot = require("./ButtonRoot");
 //# sourceMappingURL=index.js.map

package/lib/commonjs/button/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_createButtonGroup","require","_createButtonIcon","_createButtonRoot","_createButtonSpinner","_createButtonText","_context","createButton","BaseComponents","Button","createButtonRoot","Root","Text","createButtonText","Group","createButtonGroup","Spinner","createButtonSpinner","Icon","createButtonIcon","displayName","Object","assign"],"sourceRoot":"../../../src","sources":["button/index.tsx"],"mappings":";;;;;;;;;;;;AACA,IAAAA,kBAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AACA,IAAAG,oBAAA,GAAAH,OAAA;AACA,IAAAI,iBAAA,GAAAJ,OAAA;AAIA,IAAAK,QAAA,GAAAL,OAAA;AAEO,SAASM,YAAYA,CAQ1BC,cAMD,EAAE;EACD,MAAMC,MAAM,GAAG,IAAAC,kCAAgB,EAACF,cAAc,CAACG,IAAI,CAAC;EACpD,MAAMC,IAAI,GAAG,IAAAC,kCAAgB,EAACL,cAAc,CAACI,IAAI,CAAC;EAClD,MAAME,KAAK,GAAG,IAAAC,oCAAiB,EAACP,cAAc,CAACM,KAAK,CAAC;EACrD,MAAME,OAAO,GAAG,IAAAC,wCAAmB,EAACT,cAAc,CAACQ,OAAO,CAAC;EAC3D,MAAME,IAAI,GAAG,IAAAC,kCAAgB,EAACX,cAAc,CAACU,IAAI,CAAC;EAElDT,MAAM,CAACW,WAAW,GAAG,iBAAiB;EACtCR,IAAI,CAACQ,WAAW,GAAG,sBAAsB;EACzCN,KAAK,CAACM,WAAW,GAAG,uBAAuB;EAC3CJ,OAAO,CAACI,WAAW,GAAG,yBAAyB;EAC/CF,IAAI,CAACE,WAAW,GAAG,sBAAsB;EAEzC,OAAOC,MAAM,CAACC,MAAM,CAACb,MAAM,EAAE;IAC3BG,IAAI;IACJE,KAAK;IACLE,OAAO;IACPE;EACF,CAAC,CAAC;AASJ","ignoreList":[]}
+{"version":3,"names":["_context","require","_ButtonRoot"],"sourceRoot":"../../../src","sources":["button/index.ts"],"mappings":";;;;;;;;;;;;;;;;;AACA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA","ignoreList":[]}

package/lib/commonjs/checkbox/CheckboxGroup.js

@@ -0,0 +1,52 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CheckboxGroup = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _utils = require("@cdx-ui/utils");
+var _checkbox = require("@react-native-aria/checkbox");
+var _checkbox2 = require("@react-stately/checkbox");
+var _slot = require("../slot");
+var _context = require("./context");
+var _jsxRuntime = require("react/jsx-runtime");
+const CheckboxGroup = exports.CheckboxGroup = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  children,
+  className,
+  style,
+  ...props
+}, ref) => {
+  const state = (0, _checkbox2.useCheckboxGroupState)({
+    ...props,
+    validationState: props.isInvalid ? 'invalid' : 'valid'
+  });
+  const {
+    groupProps
+  } = (0, _checkbox.useCheckboxGroup)({
+    ...props,
+    'aria-label': props['aria-label']
+  }, state);
+  const formControlContext = (0, _utils.useFormControlContext)();
+  const contextValue = (0, _react.useMemo)(() => ({
+    state: {
+      ...formControlContext,
+      ...state
+    }
+  }), [formControlContext, state]);
+  const Comp = asChild ? _slot.Slot : _reactNative.View;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_context.CheckboxGroupContext.Provider, {
+    value: contextValue,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
+      ...groupProps,
+      className: className,
+      style: style,
+      ref: ref,
+      children: children
+    })
+  });
+});
+CheckboxGroup.displayName = 'CheckboxGroup';
+//# sourceMappingURL=CheckboxGroup.js.map

package/lib/commonjs/checkbox/CheckboxGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_utils","_checkbox","_checkbox2","_slot","_context","_jsxRuntime","CheckboxGroup","exports","forwardRef","asChild","children","className","style","props","ref","state","useCheckboxGroupState","validationState","isInvalid","groupProps","useCheckboxGroup","formControlContext","useFormControlContext","contextValue","useMemo","Comp","Slot","View","jsx","CheckboxGroupContext","Provider","value","displayName"],"sourceRoot":"../../../src","sources":["checkbox/CheckboxGroup.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,SAAA,GAAAH,OAAA;AACA,IAAAI,UAAA,GAAAJ,OAAA;AACA,IAAAK,KAAA,GAAAL,OAAA;AACA,IAAAM,QAAA,GAAAN,OAAA;AAAiD,IAAAO,WAAA,GAAAP,OAAA;AAS1C,MAAMQ,aAAa,GAAAC,OAAA,CAAAD,aAAA,gBAAG,IAAAE,iBAAU,EACrC,CAAC;EAAEC,OAAO;EAAEC,QAAQ;EAAEC,SAAS;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EAC1D,MAAMC,KAAK,GAAG,IAAAC,gCAAqB,EAAC;IAClC,GAAGH,KAAK;IACRI,eAAe,EAAEJ,KAAK,CAACK,SAAS,GAAG,SAAS,GAAG;EACjD,CAAC,CAAC;EAEF,MAAM;IAAEC;EAAW,CAAC,GAAG,IAAAC,0BAAgB,EACrC;IACE,GAAGP,KAAK;IACR,YAAY,EAAEA,KAAK,CAAC,YAAY;EAClC,CAAC,EACDE,KACF,CAAC;EAED,MAAMM,kBAAkB,GAAG,IAAAC,4BAAqB,EAAC,CAAC;EAElD,MAAMC,YAAY,GAAG,IAAAC,cAAO,EAC1B,OAAO;IAAET,KAAK,EAAE;MAAE,GAAGM,kBAAkB;MAAE,GAAGN;IAAM;EAAE,CAAC,CAAC,EACtD,CAACM,kBAAkB,EAAEN,KAAK,CAC5B,CAAC;EAED,MAAMU,IAAI,GAAGhB,OAAO,GAAGiB,UAAI,GAAGC,iBAAI;EAElC,oBACE,IAAAtB,WAAA,CAAAuB,GAAA,EAACxB,QAAA,CAAAyB,oBAAoB,CAACC,QAAQ;IAACC,KAAK,EAAER,YAAa;IAAAb,QAAA,eACjD,IAAAL,WAAA,CAAAuB,GAAA,EAACH,IAAI;MAAA,GAAKN,UAAU;MAAER,SAAS,EAAEA,SAAU;MAACC,KAAK,EAAEA,KAAM;MAACE,GAAG,EAAEA,GAAI;MAAAJ,QAAA,EAChEA;IAAQ,CACL;EAAC,CACsB,CAAC;AAEpC,CACF,CAAC;AAEDJ,aAAa,CAAC0B,WAAW,GAAG,eAAe","ignoreList":[]}

package/lib/commonjs/checkbox/CheckboxRoot.js

@@ -0,0 +1,103 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CheckboxRoot = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _utils = require("@cdx-ui/utils");
+var _focus = require("@react-native-aria/focus");
+var _interactions = require("@react-native-aria/interactions");
+var _slot = require("../slot");
+var _dataAttributes = require("../utils/dataAttributes");
+var _context = require("./context");
+var _useCheckboxRoot = require("./useCheckboxRoot");
+var _jsxRuntime = require("react/jsx-runtime");
+const CheckboxRoot = exports.CheckboxRoot = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild,
+  onPressIn,
+  onPressOut,
+  onHoverIn,
+  onHoverOut,
+  onFocus,
+  onBlur,
+  children,
+  ...props
+}, ref) => {
+  const {
+    isHovered: isHoveredProp,
+    isChecked: isCheckedProp,
+    isDisabled: isDisabledProp,
+    isInvalid: isInvalidProp,
+    isReadOnly: isReadOnlyProp,
+    isPressed: isPressedProp,
+    isFocused: isFocusedProp,
+    isIndeterminate: isIndeterminateProp,
+    isFocusVisible: isFocusVisibleProp
+  } = props;
+  const {
+    combinedProps,
+    isInvalid,
+    isReadOnly,
+    isIndeterminate,
+    groupItemInputProps,
+    isChecked,
+    isDisabled,
+    isHovered,
+    hoverProps,
+    mergedRef
+  } = (0, _useCheckboxRoot.useCheckboxRoot)(props, ref);
+  const {
+    focusProps,
+    isFocused
+  } = (0, _focus.useFocus)();
+  const {
+    pressProps,
+    isPressed
+  } = (0, _interactions.usePress)({
+    isDisabled: isDisabled || isDisabledProp
+  });
+  const contextValue = {
+    isChecked: isChecked || isCheckedProp,
+    isDisabled: isDisabled || isDisabledProp,
+    isHovered: isHovered || isHoveredProp,
+    isInvalid: isInvalid || isInvalidProp,
+    isReadOnly: isReadOnly || isReadOnlyProp,
+    isPressed: isPressed || isPressedProp,
+    isFocused: isFocused || isFocusedProp,
+    isIndeterminate: isIndeterminate || isIndeterminateProp,
+    isFocusVisible: isFocusVisibleProp
+  };
+  const Comp = asChild ? _slot.Slot : _reactNative.Pressable;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_context.CheckboxProvider, {
+    value: contextValue,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
+      disabled: isDisabled || isDisabledProp,
+      ...combinedProps,
+      ...groupItemInputProps,
+      ref: mergedRef,
+      role: "checkbox",
+      ...(0, _dataAttributes.mergeDataAttributes)(props, (0, _dataAttributes.dataAttributes)({
+        checked: isChecked || isCheckedProp,
+        disabled: isDisabled || isDisabledProp,
+        hover: isHovered || isHoveredProp,
+        invalid: isInvalid || isInvalidProp,
+        readonly: isReadOnly || isReadOnlyProp,
+        active: isPressed,
+        focus: isFocused,
+        indeterminate: isIndeterminate || isIndeterminateProp,
+        focusVisible: isFocusVisibleProp
+      })),
+      onPressIn: (0, _utils.composeEventHandlers)(onPressIn, pressProps.onPressIn),
+      onPressOut: (0, _utils.composeEventHandlers)(onPressOut, pressProps.onPressOut),
+      onHoverIn: (0, _utils.composeEventHandlers)(onHoverIn, hoverProps.onHoverIn),
+      onHoverOut: (0, _utils.composeEventHandlers)(onHoverOut, hoverProps.onHoverOut),
+      onFocus: (0, _utils.composeEventHandlers)((0, _utils.composeEventHandlers)(onFocus, focusProps.onFocus)),
+      onBlur: (0, _utils.composeEventHandlers)((0, _utils.composeEventHandlers)(onBlur, focusProps.onBlur)),
+      children: children
+    })
+  });
+});
+CheckboxRoot.displayName = 'CheckboxRoot';
+//# sourceMappingURL=CheckboxRoot.js.map