@astryxdesign/core 0.7.4-canary.28b1cd4 → 0.7.4-canary.31e54e4
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxInput.d.ts","sourceRoot":"","sources":["../../src/CheckboxInput/CheckboxInput.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAML,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAS3C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AACtC,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"CheckboxInput.d.ts","sourceRoot":"","sources":["../../src/CheckboxInput/CheckboxInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -27,7 +27,9 @@ import { mergeProps, rtlStyles } from "../utils/index.js";
|
|
|
27
27
|
import "../Indicator/indicator.markers.stylex.js";
|
|
28
28
|
import { indicatorScope } from "../Indicator/indicator.markers.stylex.js";
|
|
29
29
|
import { interactionOverlayStyles } from "../utils/interactionOverlay.stylex.js";
|
|
30
|
+
import { useTranslator } from "../i18n/index.js";
|
|
30
31
|
import { useIndicatorFocusRing } from "../hooks/useIndicatorFocusRing.js";
|
|
32
|
+
import { useBusyAnnouncement } from "../hooks/useBusyAnnouncement.js";
|
|
31
33
|
import { usePressFeedback } from "../hooks/usePressFeedback.js";
|
|
32
34
|
import { useResolvedRequired } from "../hooks/useResolvedRequired.js";
|
|
33
35
|
import { useIndicator } from "../Indicator/index.js";
|
|
@@ -195,6 +197,10 @@ export function CheckboxInput({
|
|
|
195
197
|
// `opacity: 0`, and only the indicator's own element can shape the outline
|
|
196
198
|
// to match it. See useIndicatorFocusRing.
|
|
197
199
|
const indicatorRef = useRef(null);
|
|
200
|
+
const t = useTranslator();
|
|
201
|
+
// The busy Spinner sits in the decorative, aria-hidden indicator, so this
|
|
202
|
+
// control announces its busy start itself (spec:AST-086 FR8).
|
|
203
|
+
useBusyAnnouncement(isBusy, t('@astryx.spinner.loading'), indicatorRef);
|
|
198
204
|
const {
|
|
199
205
|
focusProps
|
|
200
206
|
} = useIndicatorFocusRing(indicatorRef);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@astryxdesign/core",
|
|
3
|
-
"version": "0.7.4-canary.
|
|
3
|
+
"version": "0.7.4-canary.31e54e4",
|
|
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.
|
|
796
|
-
"@astryxdesign/cli": "0.7.4-canary.
|
|
795
|
+
"@astryxdesign/a11y-spec": "0.7.4-canary.31e54e4",
|
|
796
|
+
"@astryxdesign/cli": "0.7.4-canary.31e54e4",
|
|
797
797
|
"@babel/cli": "^7.29.7",
|
|
798
798
|
"@babel/core": "^7.29.7",
|
|
799
799
|
"@babel/preset-react": "^7.29.7",
|
|
@@ -46,7 +46,9 @@ import {useTooltip} from '../Tooltip';
|
|
|
46
46
|
import {mergeProps, rtlStyles} from '../utils';
|
|
47
47
|
import {indicatorScope} from '../Indicator/indicator.markers.stylex';
|
|
48
48
|
import {interactionOverlayStyles} from '../utils/interactionOverlay.stylex';
|
|
49
|
+
import {useTranslator} from '../i18n';
|
|
49
50
|
import {useIndicatorFocusRing} from '../hooks/useIndicatorFocusRing';
|
|
51
|
+
import {useBusyAnnouncement} from '../hooks/useBusyAnnouncement';
|
|
50
52
|
import {usePressFeedback} from '../hooks/usePressFeedback';
|
|
51
53
|
import {useResolvedRequired} from '../hooks/useResolvedRequired';
|
|
52
54
|
import {useIndicator} from '../Indicator';
|
|
@@ -371,6 +373,10 @@ export function CheckboxInput({
|
|
|
371
373
|
// `opacity: 0`, and only the indicator's own element can shape the outline
|
|
372
374
|
// to match it. See useIndicatorFocusRing.
|
|
373
375
|
const indicatorRef = useRef<HTMLSpanElement>(null);
|
|
376
|
+
const t = useTranslator();
|
|
377
|
+
// The busy Spinner sits in the decorative, aria-hidden indicator, so this
|
|
378
|
+
// control announces its busy start itself (spec:AST-086 FR8).
|
|
379
|
+
useBusyAnnouncement(isBusy, t('@astryx.spinner.loading'), indicatorRef);
|
|
374
380
|
const {focusProps} = useIndicatorFocusRing(indicatorRef);
|
|
375
381
|
|
|
376
382
|
const isIndeterminate = optimisticValue === 'indeterminate';
|
|
@@ -29,6 +29,7 @@ import {DateInput} from '../DateInput';
|
|
|
29
29
|
import {DateRangeInput} from '../DateRangeInput';
|
|
30
30
|
import {DateTimeInput} from '../DateTimeInput';
|
|
31
31
|
import {TimeInput} from '../TimeInput';
|
|
32
|
+
import {CheckboxInput} from '../CheckboxInput';
|
|
32
33
|
import {BaseTypeahead, Typeahead} from '../Typeahead';
|
|
33
34
|
import type {SearchableItem, SearchSource} from '../Typeahead';
|
|
34
35
|
import type {ISOTimeString} from '../utils';
|
|
@@ -131,6 +132,17 @@ const OWNERS: ReadonlyArray<
|
|
|
131
132
|
),
|
|
132
133
|
] as const,
|
|
133
134
|
]),
|
|
135
|
+
[
|
|
136
|
+
'CheckboxInput',
|
|
137
|
+
isLoading => (
|
|
138
|
+
<CheckboxInput
|
|
139
|
+
label="Subscribe"
|
|
140
|
+
value={false}
|
|
141
|
+
onChange={() => {}}
|
|
142
|
+
isLoading={isLoading}
|
|
143
|
+
/>
|
|
144
|
+
),
|
|
145
|
+
],
|
|
134
146
|
[
|
|
135
147
|
'DateRangeInput',
|
|
136
148
|
isLoading => (
|
|
@@ -242,7 +254,8 @@ describe.each(OWNERS)('%s busy state (spec:AST-086)', (_name, renderOwner) => {
|
|
|
242
254
|
const {container} = render(renderOwner(true));
|
|
243
255
|
const spinner = container.querySelector('.astryx-spinner');
|
|
244
256
|
expect(spinner).not.toBeNull();
|
|
245
|
-
|
|
257
|
+
// Hidden itself, or inside a decorative hidden indicator (CheckboxInput).
|
|
258
|
+
expect(spinner!.closest('[aria-hidden="true"]')).not.toBeNull();
|
|
246
259
|
expect(screen.queryByRole('status', {name: 'Loading'})).toBeNull();
|
|
247
260
|
});
|
|
248
261
|
|