@astryxdesign/core 0.7.4-canary.626f01e → 0.7.4-canary.720bb10

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.
@@ -28,6 +28,7 @@ export interface CommandPaletteItemProps extends Omit<BaseProps<HTMLDivElement>,
28
28
  isHighlighted?: boolean;
29
29
  /**
30
30
  * Whether this item is currently selected (picker mode).
31
+ * When omitted inside CommandPalette, derived from the palette value.
31
32
  * @default false
32
33
  */
33
34
  isSelected?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"CommandPaletteItem.d.ts","sourceRoot":"","sources":["../../src/CommandPalette/CommandPaletteItem.tsx"],"names":[],"mappings":"AAGA;;;;;;;;GAQG;AAEH,OAAO,EAA0C,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAqD5C,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CACnD,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,UAAU,CACxB;IACC,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iFAAiF;IACjF,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,QAAQ,EACR,aAAa,EAAE,qBAAqB,EACpC,UAAU,EAAE,kBAAkB,EAC9B,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,EAAE,EAAE,MAAM,EACV,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,gBAAgB,EAC9B,GAAG,KAAK,EACT,EAAE,uBAAuB,+BAoFzB;yBAnGe,kBAAkB"}
1
+ {"version":3,"file":"CommandPaletteItem.d.ts","sourceRoot":"","sources":["../../src/CommandPalette/CommandPaletteItem.tsx"],"names":[],"mappings":"AAGA;;;;;;;;GAQG;AAEH,OAAO,EAA0C,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAqD5C,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CACnD,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,UAAU,CACxB;IACC,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iFAAiF;IACjF,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,QAAQ,EACR,aAAa,EAAE,qBAAqB,EACpC,UAAU,EAAE,kBAAkB,EAC9B,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,EAAE,EAAE,MAAM,EACV,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,gBAAgB,EAC9B,GAAG,KAAK,EACT,EAAE,uBAAuB,+BAwFzB;yBAvGe,kBAAkB"}
@@ -148,7 +148,11 @@ export function CommandPaletteItem({
148
148
  ...pressable,
149
149
  onClick: isDisabled ? undefined : composeEventHandlers(onClickProp, handleClick),
150
150
  onMouseEnter: onMouseEnterProp,
151
- ...mergeProps(themeProps('command-palette-item'), stylex.props(styles.item, !isDisabled && interactionOverlayStyles.backgroundColor, isHighlighted && styles.itemHighlighted, isSelected && styles.itemSelected, isDisabled && styles.itemDisabled, xstyle), className, style),
151
+ ...mergeProps(themeProps('command-palette-item', {
152
+ highlighted: isHighlighted ? 'highlighted' : null,
153
+ selected: isSelected ? 'selected' : null,
154
+ disabled: isDisabled ? 'disabled' : null
155
+ }), stylex.props(styles.item, !isDisabled && interactionOverlayStyles.backgroundColor, isHighlighted && styles.itemHighlighted, isSelected && styles.itemSelected, isDisabled && styles.itemDisabled, xstyle), className, style),
152
156
  children: children
153
157
  });
154
158
  }
@@ -116,7 +116,9 @@ export interface DateInputProps extends Omit<FieldInputBaseProps<HTMLInputElemen
116
116
  */
117
117
  changeAction?: (value: ISODateString | undefined) => void | Promise<void>;
118
118
  /**
119
- * Whether the input is in a loading state.
119
+ * Whether the input is in a loading state. The field stays focusable and
120
+ * exposes `aria-busy` with a Spinner; typing, picking, and clearing are
121
+ * blocked until loading ends.
120
122
  * @default false
121
123
  */
122
124
  isLoading?: boolean;
@@ -138,9 +140,9 @@ export interface DateInputProps extends Omit<FieldInputBaseProps<HTMLInputElemen
138
140
  */
139
141
  placeholder?: string;
140
142
  /**
141
- * The size of the input.
142
- * - 'sm': Compact size (18px height)
143
- * - 'md': Default size (26px height)
143
+ * The size of the input. The field height follows the theme's element-size
144
+ * token for the chosen size (`--size-element-sm`, `--size-element-md`, or
145
+ * `--size-element-lg`).
144
146
  * @default 'md'
145
147
  */
146
148
  size?: DateInputSize;
@@ -1 +1 @@
1
- {"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../src/DateInput/DateInput.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../src/DateInput/DateInput.tsx"],"names":[],"mappings":"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"}
@@ -456,7 +456,11 @@ function PointerDateField({
456
456
  size,
457
457
  status: status?.type ?? null,
458
458
  disabled: isDisabled ? 'disabled' : null
459
- }), stylex.props(inputWrapperStyles.base, sizeStyles[size], isEffectivelyDisabled && inputWrapperStyles.disabled, isEffectivelyDisabled && styles.disabledFocusRing, status && inputStatusBorderStyles[status.type], status && !isEffectivelyDisabled && inputStatusHoverShadowStyles[status.type], status && inputStatusFocusWithinStyles[status.type], inputGroup && groupStyles.inGroup, controlXstyle), controlClassName, controlStyle),
459
+ }), stylex.props(inputWrapperStyles.base, sizeStyles[size],
460
+ // Disabled paint belongs to the disabled state only; a busy field
461
+ // keeps its ordinary paint and shows the Spinner (spec:AST-085
462
+ // FR6, family:buttons FR4).
463
+ isDisabled && inputWrapperStyles.disabled, isEffectivelyDisabled && styles.disabledFocusRing, status && inputStatusBorderStyles[status.type], status && !isEffectivelyDisabled && inputStatusHoverShadowStyles[status.type], status && inputStatusFocusWithinStyles[status.type], inputGroup && groupStyles.inGroup, controlXstyle), controlClassName, controlStyle),
460
464
  children: [inputGroup && /*#__PURE__*/_jsx(VisuallyHidden, {
461
465
  id: inputLabelID,
462
466
  children: label
@@ -1 +1 @@
1
- {"version":3,"file":"NativeDateField.d.ts","sourceRoot":"","sources":["../../src/DateInput/NativeDateField.tsx"],"names":[],"mappings":"AAuCA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AAyNhD;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,eAAe,EACf,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,eAAe,EACf,WAAW,EAAE,oBAAoB,EACjC,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,aAA0B,EAC1B,YAAY,EACZ,QAAgB,EAGhB,cAAc,EAAE,eAAe,EAC/B,YAAY,EAAE,aAAa,EAC3B,MAAoB,EACpB,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,GAAG,EACH,GAAG,SAAS,EACb,EAAE,cAAc,+BAobhB;yBAvde,eAAe"}
1
+ {"version":3,"file":"NativeDateField.d.ts","sourceRoot":"","sources":["../../src/DateInput/NativeDateField.tsx"],"names":[],"mappings":"AAuCA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AA0NhD;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,eAAe,EACf,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,eAAe,EACf,WAAW,EAAE,oBAAoB,EACjC,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,aAA0B,EAC1B,YAAY,EACZ,QAAgB,EAGhB,cAAc,EAAE,eAAe,EAC/B,YAAY,EAAE,aAAa,EAC3B,MAAoB,EACpB,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,GAAG,EACH,GAAG,SAAS,EACb,EAAE,cAAc,+BAubhB;yBA1de,eAAe"}
@@ -405,7 +405,11 @@ export function NativeDateField({
405
405
  size,
406
406
  status: status?.type ?? null,
407
407
  disabled: isDisabled ? 'disabled' : null
408
- }), stylex.props(inputWrapperStyles.base, sizeStyles[size], styles.wrapper, isEffectivelyDisabled && inputWrapperStyles.disabled, isEffectivelyDisabled && styles.disabledFocusRing, status && inputStatusBorderStyles[status.type], status && !isEffectivelyDisabled && inputStatusHoverShadowStyles[status.type], status && inputStatusFocusWithinStyles[status.type], inputGroup && groupStyles.inGroup, controlXstyle), controlClassName, controlStyle),
408
+ }), stylex.props(inputWrapperStyles.base, sizeStyles[size], styles.wrapper,
409
+ // Disabled paint belongs to the disabled state only; a busy field
410
+ // keeps its ordinary paint and shows the Spinner (spec:AST-085
411
+ // FR6, family:buttons FR4).
412
+ isDisabled && inputWrapperStyles.disabled, isEffectivelyDisabled && styles.disabledFocusRing, status && inputStatusBorderStyles[status.type], status && !isEffectivelyDisabled && inputStatusHoverShadowStyles[status.type], status && inputStatusFocusWithinStyles[status.type], inputGroup && groupStyles.inGroup, controlXstyle), controlClassName, controlStyle),
409
413
  children: [inputGroup && /*#__PURE__*/_jsx(VisuallyHidden, {
410
414
  id: inputLabelID,
411
415
  children: label
@@ -1 +1 @@
1
- {"version":3,"file":"TouchDateField.d.ts","sourceRoot":"","sources":["../../src/DateInput/TouchDateField.tsx"],"names":[],"mappings":"AAgEA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AA4ehD;;;GAGG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,eAAe,EACf,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,eAAe,EACf,WAAW,EAAE,oBAAoB,EACjC,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,aAA0B,EAC1B,YAAY,EACZ,QAAgB,EAIhB,cAAc,EAAE,eAAe,EAC/B,YAAY,EAAE,gBAAoB,EAClC,MAAoB,EACpB,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,GAAG,EACH,GAAG,SAAS,EACb,EAAE,cAAc,+BAkwBhB;yBAtyBe,cAAc"}
1
+ {"version":3,"file":"TouchDateField.d.ts","sourceRoot":"","sources":["../../src/DateInput/TouchDateField.tsx"],"names":[],"mappings":"AAgEA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AA6ehD;;;GAGG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,eAAe,EACf,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,eAAe,EACf,WAAW,EAAE,oBAAoB,EACjC,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,aAA0B,EAC1B,YAAY,EACZ,QAAgB,EAIhB,cAAc,EAAE,eAAe,EAC/B,YAAY,EAAE,gBAAoB,EAClC,MAAoB,EACpB,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,GAAG,EACH,GAAG,SAAS,EACb,EAAE,cAAc,+BAqwBhB;yBAzyBe,cAAc"}
@@ -802,7 +802,11 @@ export function TouchDateField({
802
802
  size,
803
803
  status: status?.type ?? null,
804
804
  disabled: isDisabled ? 'disabled' : null
805
- }), stylex.props(inputWrapperStyles.base, sizeStyles[size], styles.wrapper, isEffectivelyDisabled && inputWrapperStyles.disabled, isEffectivelyDisabled && styles.disabledFocusRing, status && inputStatusBorderStyles[status.type], status && !isEffectivelyDisabled && inputStatusHoverShadowStyles[status.type], status && inputStatusFocusWithinStyles[status.type], inputGroup && groupStyles.inGroup, controlXstyle), controlClassName, controlStyle),
805
+ }), stylex.props(inputWrapperStyles.base, sizeStyles[size], styles.wrapper,
806
+ // Disabled paint belongs to the disabled state only; a busy field
807
+ // keeps its ordinary paint and shows the Spinner (spec:AST-085
808
+ // FR6, family:buttons FR4).
809
+ isDisabled && inputWrapperStyles.disabled, isEffectivelyDisabled && styles.disabledFocusRing, status && inputStatusBorderStyles[status.type], status && !isEffectivelyDisabled && inputStatusHoverShadowStyles[status.type], status && inputStatusFocusWithinStyles[status.type], inputGroup && groupStyles.inGroup, controlXstyle), controlClassName, controlStyle),
806
810
  children: [inputGroup && /*#__PURE__*/_jsx(VisuallyHidden, {
807
811
  id: inputLabelID,
808
812
  children: label
@@ -1 +1 @@
1
- {"version":3,"file":"tokens.stylex.d.ts","sourceRoot":"","sources":["../../src/DateInput/tokens.stylex.ts"],"names":[],"mappings":"AA4BA;;;;;GAKG;AACH,eAAO,MAAM,cAAc,IAAI,CAAC;AAEhC;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,mBAAmB;IAC9B;;;OAGG;;IAEH;;;;;;;;;;;;;;OAcG;;CAEH,CAAC;AASH,0EAA0E;AAC1E,eAAO,MAAM,sBAAsB;IACjC,yEAAyE;;IAEzE,6CAA6C;;IAE7C;;;OAGG;;CAEH,CAAC"}
1
+ {"version":3,"file":"tokens.stylex.d.ts","sourceRoot":"","sources":["../../src/DateInput/tokens.stylex.ts"],"names":[],"mappings":"AA8BA;;;;;GAKG;AACH,eAAO,MAAM,cAAc,IAAI,CAAC;AAEhC;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,mBAAmB;IAC9B;;;OAGG;;IAEH;;;;;;;;;;;;;;OAcG;;CAEH,CAAC;AASH,0EAA0E;AAC1E,eAAO,MAAM,sBAAsB;IACjC,yEAAyE;;IAEzE,6CAA6C;;IAE7C;;;OAGG;;CAEH,CAAC"}
@@ -4,7 +4,9 @@
4
4
  * @file tokens.stylex.ts
5
5
  * @input StyleX variable and constant definitions
6
6
  * @output Exports DateInput layout constants and derived geometry
7
- * @position Lab component tokens consumed by DateInput.tsx, MonthScroller.tsx, Wheel.tsx, MonthYearWheels.tsx
7
+ * @position Core touch-picker geometry consumed by the DateInput touch surface
8
+ * (TouchDateField, MonthScroller, Wheel, MonthYearWheels) and by the
9
+ * DateTimeInput and TimeInput touch fields
8
10
  *
9
11
  * The picker's whole geometry derives from two numbers, which is what makes
10
12
  * the fixed height and the scroll snapping exact:
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@astryxdesign/core",
3
- "version": "0.7.4-canary.626f01e",
3
+ "version": "0.7.4-canary.720bb10",
4
4
  "displayName": "Astryx Core",
5
5
  "description": "The component library. Accessible, themeable React components with built-in spacing, dark mode, and StyleX styling.",
6
6
  "author": "Meta Open Source",
@@ -792,8 +792,8 @@
792
792
  "react-dom": ">=19.0.0"
793
793
  },
794
794
  "devDependencies": {
795
- "@astryxdesign/a11y-spec": "0.7.4-canary.626f01e",
796
- "@astryxdesign/cli": "0.7.4-canary.626f01e",
795
+ "@astryxdesign/a11y-spec": "0.7.4-canary.720bb10",
796
+ "@astryxdesign/cli": "0.7.4-canary.720bb10",
797
797
  "@babel/cli": "^7.29.7",
798
798
  "@babel/core": "^7.29.7",
799
799
  "@babel/preset-react": "^7.29.7",
@@ -225,7 +225,10 @@ export const docs = {
225
225
  {className: 'astryx-command-palette-group'},
226
226
  {className: 'astryx-command-palette-group-heading'},
227
227
  {className: 'astryx-command-palette-input'},
228
- {className: 'astryx-command-palette-item'},
228
+ {
229
+ className: 'astryx-command-palette-item',
230
+ states: ['highlighted', 'selected', 'disabled'],
231
+ },
229
232
  {className: 'astryx-command-palette-list'},
230
233
  ],
231
234
  },
@@ -21,7 +21,12 @@ export const docs = {
21
21
  {
22
22
  guidance: true,
23
23
  description:
24
- 'Use non-interactive child content such as icons, descriptions, and shortcut hints; activate the option itself instead of nesting buttons or links.',
24
+ 'Inside CommandPalette, each item is an option in the listbox popup of the WAI-ARIA combobox pattern: keyboard focus stays in the query field, arrow keys move the highlight through aria-activedescendant, and Enter selects the highlighted item.',
25
+ },
26
+ {
27
+ guidance: false,
28
+ description:
29
+ 'Nest buttons, links, or other interactive controls inside an item. Option semantics make descendants presentational, so use non-interactive content such as icons, descriptions, and shortcut hints, and activate the option itself.',
25
30
  },
26
31
  {
27
32
  guidance: false,
@@ -45,7 +50,12 @@ export const docs = {
45
50
  ],
46
51
  },
47
52
  theming: {
48
- targets: [{className: 'astryx-command-palette-item'}],
53
+ targets: [
54
+ {
55
+ className: 'astryx-command-palette-item',
56
+ states: ['highlighted', 'selected', 'disabled'],
57
+ },
58
+ ],
49
59
  },
50
60
  props: [
51
61
  {
@@ -79,7 +89,7 @@ export const docs = {
79
89
  name: 'isSelected',
80
90
  type: 'boolean',
81
91
  description:
82
- 'Whether this item represents the selected value in picker mode.',
92
+ 'Whether this item represents the selected value in picker mode. Derived from the CommandPalette value when omitted inside CommandPalette.',
83
93
  default: 'false',
84
94
  },
85
95
  {
@@ -117,7 +127,8 @@ export const docsZh = {
117
127
  '通过指针激活此条目后调用。CommandPalette 中的键盘选择通过根组件的 onValueChange 报告。',
118
128
  isHighlighted:
119
129
  '此条目是否为当前键盘结果。在 CommandPalette 内省略时从上下文派生。',
120
- isSelected: '此条目是否代表选择器模式中的已选值。',
130
+ isSelected:
131
+ '此条目是否代表选择器模式中的已选值。在 CommandPalette 内省略时从面板的值派生。',
121
132
  isDisabled: '条目是否不可用并禁止指针激活。',
122
133
  xstyle: 'StyleX 布局自定义样式。必须是 stylex.create() 的值。',
123
134
  },
@@ -135,7 +146,8 @@ export const docsDense = {
135
146
  onSelect:
136
147
  'called after pointer activation; palette keyboard selection uses root onValueChange',
137
148
  isHighlighted: 'active keyboard result; derived from context when omitted',
138
- isSelected: 'selected value in picker mode',
149
+ isSelected:
150
+ 'selected value in picker mode; derived from palette value when omitted',
139
151
  isDisabled: 'unavailable; suppresses pointer activation',
140
152
  xstyle: 'StyleX layout styles; must be stylex.create() value',
141
153
  },
@@ -195,17 +195,6 @@ describe('CommandPaletteItem', () => {
195
195
  expect(item).toHaveAttribute('aria-selected', 'true');
196
196
  });
197
197
 
198
- it('paints context-derived highlight when the item is not selected', () => {
199
- renderWithContext(
200
- <CommandPaletteItem value="test">Item</CommandPaletteItem>,
201
- {highlightedIndex: 0},
202
- );
203
-
204
- expect(getComputedStyle(screen.getByRole('option')).backgroundColor).toBe(
205
- 'var(--color-overlay-hover)',
206
- );
207
- });
208
-
209
198
  it('lets explicit visual state override context-derived state', () => {
210
199
  renderWithContext(
211
200
  <CommandPaletteItem value="test" isHighlighted={false} isSelected={false}>
@@ -216,7 +205,8 @@ describe('CommandPaletteItem', () => {
216
205
 
217
206
  const item = screen.getByRole('option');
218
207
  expect(item).toHaveAttribute('aria-selected', 'false');
219
- expect(getComputedStyle(item).backgroundColor).toBe('rgba(0, 0, 0, 0)');
208
+ expect(item).not.toHaveAttribute('data-selected');
209
+ expect(item).not.toHaveAttribute('data-highlighted');
220
210
  });
221
211
 
222
212
  it('protects owned option semantics from native passthrough props', () => {
@@ -354,6 +344,69 @@ describe('CommandPaletteItem', () => {
354
344
  expect(item).toHaveStyle({marginBlockStart: '8px'});
355
345
  });
356
346
 
347
+ it('reflects selected and disabled state on its theme target', () => {
348
+ render(
349
+ <>
350
+ <CommandPaletteItem value="rest">Rest</CommandPaletteItem>
351
+ <CommandPaletteItem value="selected" isSelected>
352
+ Selected
353
+ </CommandPaletteItem>
354
+ <CommandPaletteItem value="disabled" isDisabled>
355
+ Disabled
356
+ </CommandPaletteItem>
357
+ </>,
358
+ );
359
+
360
+ const rest = screen.getByRole('option', {name: 'Rest'});
361
+ expect(rest).not.toHaveAttribute('data-selected');
362
+ expect(rest).not.toHaveAttribute('data-disabled');
363
+ expect(screen.getByRole('option', {name: 'Selected'})).toHaveAttribute(
364
+ 'data-selected',
365
+ 'selected',
366
+ );
367
+ expect(screen.getByRole('option', {name: 'Disabled'})).toHaveAttribute(
368
+ 'data-disabled',
369
+ 'disabled',
370
+ );
371
+ });
372
+
373
+ it('reflects context-derived selection on its theme target', () => {
374
+ renderWithContext(
375
+ <CommandPaletteItem value="test">Item</CommandPaletteItem>,
376
+ {value: 'test'},
377
+ );
378
+
379
+ expect(screen.getByRole('option')).toHaveAttribute(
380
+ 'data-selected',
381
+ 'selected',
382
+ );
383
+ });
384
+
385
+ it('reflects explicit and context-derived highlight on its theme target', () => {
386
+ renderWithContext(
387
+ <>
388
+ <CommandPaletteItem value="test">
389
+ Context highlighted
390
+ </CommandPaletteItem>
391
+ <CommandPaletteItem value="other" isHighlighted>
392
+ Explicitly highlighted
393
+ </CommandPaletteItem>
394
+ <CommandPaletteItem value="rest">Rest</CommandPaletteItem>
395
+ </>,
396
+ {highlightedIndex: 0},
397
+ );
398
+
399
+ expect(
400
+ screen.getByRole('option', {name: 'Context highlighted'}),
401
+ ).toHaveAttribute('data-highlighted', 'highlighted');
402
+ expect(
403
+ screen.getByRole('option', {name: 'Explicitly highlighted'}),
404
+ ).toHaveAttribute('data-highlighted', 'highlighted');
405
+ expect(screen.getByRole('option', {name: 'Rest'})).not.toHaveAttribute(
406
+ 'data-highlighted',
407
+ );
408
+ });
409
+
357
410
  it('sets data-value attribute', () => {
358
411
  render(<CommandPaletteItem value="my-value">Item</CommandPaletteItem>);
359
412
  expect(screen.getByRole('option')).toHaveAttribute(
@@ -88,6 +88,7 @@ export interface CommandPaletteItemProps extends Omit<
88
88
  isHighlighted?: boolean;
89
89
  /**
90
90
  * Whether this item is currently selected (picker mode).
91
+ * When omitted inside CommandPalette, derived from the palette value.
91
92
  * @default false
92
93
  */
93
94
  isSelected?: boolean;
@@ -202,7 +203,11 @@ export function CommandPaletteItem({
202
203
  }
203
204
  onMouseEnter={onMouseEnterProp}
204
205
  {...mergeProps(
205
- themeProps('command-palette-item'),
206
+ themeProps('command-palette-item', {
207
+ highlighted: isHighlighted ? 'highlighted' : null,
208
+ selected: isSelected ? 'selected' : null,
209
+ disabled: isDisabled ? 'disabled' : null,
210
+ }),
206
211
  stylex.props(
207
212
  styles.item,
208
213
  !isDisabled && interactionOverlayStyles.backgroundColor,