@cdx-ui/primitives 0.0.1-beta.72 → 0.0.1-beta.73

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -45,7 +45,12 @@ Concrete behavioral components with built-in interaction state tracking, accessi
45
45
  | Export | Description |
46
46
  | ----------------------- | ------------------------------------------------------------------------------------------------- |
47
47
  | `dataAttributes` | Builds `data-hover`, `data-active`, `data-focus-visible`, etc. from an `InteractionState` object. |
48
+ | `mergeDataAttributes` | Combines multiple data-attribute sources into one spread (prevents overwrites on web). |
48
49
  | `domDataAttributes` | Web-specific variant that converts data attributes to DOM-compatible format. |
50
+ | `mergeDomDataAttributes`| Web-specific merge variant for combining DOM data attribute sources. |
51
+ | `Slot` | Primitives-layer `asChild` implementation — merges props/ref onto the consumer's child element. |
52
+ | `FormControlContext` | Re-exported from `@cdx-ui/utils`; shared context for field/form control state. |
53
+ | `useFormControlContext` | Re-exported from `@cdx-ui/utils`; reads `FormControlContext` in descendant components. |
49
54
  | `OverlayInsetsProvider` | Context provider for safe-area insets used by overlay/dialog positioning. |
50
55
  | `InteractionState` | Type: `{ hover, focus, active, disabled, focusVisible }`. |
51
56
  | `EdgeInsets` | Type: `{ top, right, bottom, left }`. |
@@ -67,12 +72,16 @@ Several modules export context providers and hooks for reading component state f
67
72
 
68
73
  | Module | Provider(s) | Hook(s) | Context value type(s) |
69
74
  | --------- | ------------------------------------------ | ---------------------------------------------- | ------------------------------------------------------- |
75
+ | avatar | — | `useAvatarContext` | `IAvatarContextValue` |
76
+ | button | — | `useButtonContext` | `InteractionState` |
77
+ | checkbox | — | `useCheckboxContext` | `ICheckboxContextValue` |
78
+ | chip | — | `useChipContext` | `InteractionState` |
70
79
  | dialog | `DialogProvider` | `useDialog` | `IDialogContextType` |
80
+ | input | — | `useInputContext` | `IInputContextValue` |
71
81
  | link | `LinkProvider`, `LinkInteractionProvider` | `useLink`, `useLinkInteractionContext` | `LinkConfig`, `LinkInteractionState` |
72
- | tile | `TileProvider` | `useTileContext` | `ITileContextValue`, `ITileGroupContextValue` |
73
82
  | list-item | `ListItemProvider` | `useListItemContext` | `InteractionState` |
74
- | button | — | `useButtonContext` | `InteractionState` |
75
- | chip | — | `useChipContext` | `InteractionState` |
76
83
  | otp-input | `OtpInputProvider`, `OtpCellIndexProvider` | `useOtpInputContext`, `useOtpCellIndexContext` | `OtpInputContextValue`, `OtpInputCellIndexContextValue` |
77
84
  | progress | — | `useProgressContext` | `ProgressContextValue` |
78
85
  | radio | `RadioProvider` | `useRadioContext` | `IRadioContextValue` |
86
+ | select | — | `useSelectContext`, `useSelectItemContext` | `ISelectContextValue`, `ISelectItemContextValue` |
87
+ | tile | `TileProvider` | `useTileContext` | `ITileContextValue`, `ITileGroupContextValue` |
@@ -56,7 +56,7 @@ This eliminates the "factory pass-through" anti-pattern (e.g., a `ButtonIcon` pr
56
56
 
57
57
  `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.
58
58
 
59
- The styled-layer glyph inside `packages/components/src/components/IconButton/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 `dataAttributes()` — the same pattern external consumers use.
59
+ 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.
60
60
 
61
61
  ## Pattern summary
62
62
 
@@ -56,7 +56,7 @@ This eliminates the "factory pass-through" anti-pattern (e.g., a `ButtonIcon` pr
56
56
 
57
57
  `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.
58
58
 
59
- The styled-layer glyph inside `packages/components/src/components/IconButton/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 `dataAttributes()` — the same pattern external consumers use.
59
+ 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.
60
60
 
61
61
  ## Pattern summary
62
62
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cdx-ui/primitives",
3
- "version": "0.0.1-beta.72",
3
+ "version": "0.0.1-beta.73",
4
4
  "main": "lib/commonjs/index.js",
5
5
  "module": "lib/module/index.js",
6
6
  "react-native": "src/index.ts",
@@ -61,7 +61,7 @@
61
61
  "@react-stately/radio": "3.12.0",
62
62
  "@react-stately/toggle": "3.9.4",
63
63
  "@rn-primitives/slot": "1.4.0",
64
- "@cdx-ui/utils": "0.0.1-beta.72"
64
+ "@cdx-ui/utils": "0.0.1-beta.73"
65
65
  },
66
66
  "devDependencies": {
67
67
  "@types/react": "*",
package/src/CLAUDE.md CHANGED
@@ -56,7 +56,7 @@ This eliminates the "factory pass-through" anti-pattern (e.g., a `ButtonIcon` pr
56
56
 
57
57
  `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.
58
58
 
59
- The styled-layer glyph inside `packages/components/src/components/IconButton/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 `dataAttributes()` — the same pattern external consumers use.
59
+ 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.
60
60
 
61
61
  ## Pattern summary
62
62