@astryxdesign/core 0.7.8 → 0.7.9-canary.07992bb

package/dist/PowerSearch/PowerSearchBottomSheet.js

@@ -62,6 +62,7 @@ import { TextInput } from "../TextInput/TextInput.js";
 import { useAnnounce } from "../hooks/useAnnounce.js";
 import { useListFormatter } from "../i18n/useListFormatter.js";
 import { useLocale } from "../i18n/useLocale.js";
+import { useCalendarSystem } from "../i18n/useCalendarSystem.js";
 import { SheetConfirmation } from "../internal/SheetConfirmation.js";
 import { useDismissSearchOnTouchDrag } from "../internal/useDismissSearchOnTouchDrag.js";
 import "../theme/tokens.stylex.js";
@@ -609,6 +610,7 @@ export function PowerSearchBottomSheet({
   } = editors;
   const t = useComponentTranslator();
   const locale = useLocale();
+  const calendar = useCalendarSystem(undefined, 'PowerSearch');
   const formatList = useListFormatter();
   const isInteractive = !isDisabled && !isReadOnly;
 
@@ -1037,12 +1039,12 @@ export function PowerSearchBottomSheet({
     // as the value step's choice row does ("3 days ago"), through the
     // catalog's relative-date messages, so the sheet agrees with itself. The popover token
     // shows the stored key (a known gap of the record).
-    const value = operator.value.type === 'date_relative' && filter.value.type === 'date_relative' ? resolveRelativeDateLabel(operator.value, filter.value.value, t, editors.buildRelativeDateOptions) : formatTokenValueText(operator.value, filter.value, Number.MAX_SAFE_INTEGER, locale, t, formatList, timezoneID);
+    const value = operator.value.type === 'date_relative' && filter.value.type === 'date_relative' ? resolveRelativeDateLabel(operator.value, filter.value.value, t, editors.buildRelativeDateOptions) : formatTokenValueText(operator.value, filter.value, Number.MAX_SAFE_INTEGER, locale, calendar, t, formatList, timezoneID);
     return {
       label,
       value
     };
-  }, [config, editors, formatList, locale, t, timezoneID]);
+  }, [calendar, config, editors, formatList, locale, t, timezoneID]);
   const describeFilter = useCallback(filter => {
     const parts = describeFilterParts(filter);
     return parts.value ? t('@astryx.powersearch.sheet.labelValue', {

package/dist/PowerSearch/PowerSearchToken.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PowerSearchToken.d.ts","sourceRoot":"","sources":["../../src/PowerSearch/PowerSearchToken.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,SAAS,CAAC;AASnD;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EAAE,UAAU,EAClB,MAAM,EACN,KAAK,EACL,QAAQ,EACR,SAAS,EACT,OAAO,EACP,QAAQ,EACR,UAAU,EACV,UAAU,GACX,EAAE,qBAAqB,qBA+CvB;yBAzDe,gBAAgB"}
+{"version":3,"file":"PowerSearchToken.d.ts","sourceRoot":"","sources":["../../src/PowerSearch/PowerSearchToken.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,SAAS,CAAC;AASnD;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EAAE,UAAU,EAClB,MAAM,EACN,KAAK,EACL,QAAQ,EACR,SAAS,EACT,OAAO,EACP,QAAQ,EACR,UAAU,EACV,UAAU,GACX,EAAE,qBAAqB,qBAiDvB;yBA3De,gBAAgB"}

package/dist/PowerSearch/PowerSearchToken.js

@@ -12,6 +12,7 @@ import React from 'react';
 import * as stylex from '@stylexjs/stylex';
 import { Token } from "../Token/index.js";
 import { useLocale } from "../i18n/useLocale.js";
+import { useCalendarSystem } from "../i18n/useCalendarSystem.js";
 import "../theme/tokens.stylex.js";
 import { fontWeightVars } from "../theme/tokens.stylex.js";
 import { formatFilterValue } from "./formatFilterValue.js";
@@ -40,12 +41,13 @@ export function PowerSearchToken({
   const config = useInternalConfig(configProp);
   const t = useComponentTranslator();
   const locale = useLocale();
+  const calendar = useCalendarSystem(undefined, 'PowerSearchToken');
   const fieldLabel = field.label;
   const resolvedOperatorLabel = resolveOperatorLabel(operator, t);
   const operatorLabel = resolvedOperatorLabel ? `: ${resolvedOperatorLabel}` : '';
   const tokenLabel = `${fieldLabel}${operatorLabel}`;
   const adjustedMaxLength = Math.max(maxLength - fieldLabel.length - resolvedOperatorLabel.length, 10);
-  const valueStr = formatFilterValue(config, operator.value, filter.value, adjustedMaxLength, t, locale, timezoneID);
+  const valueStr = formatFilterValue(config, operator.value, filter.value, adjustedMaxLength, t, locale, timezoneID, calendar);
   const valueContent = valueStr ? /*#__PURE__*/_jsx("span", {
     ...{
       className: "x1lvx875"

package/dist/PowerSearch/formatFilterValue.d.ts

@@ -1,6 +1,6 @@
 /**
  * @file formatFilterValue.ts
- * @input OperatorValue, FilterValue, config
+ * @input OperatorValue, FilterValue, config, locale, time zone, calendar
  * @output Formatted display string for a filter value
  * @position Pure utility; consumed by PowerSearch token rendering
  *
@@ -10,6 +10,7 @@
 import type { OperatorValue, FilterValue } from './types.js';
 import type { InternalConfig } from './useInternalConfig.js';
 import type { Locale, TranslatorFn } from '../i18n/index.js';
+import { type CalendarSystem } from '../utils/calendarSystem.js';
 /**
  * A number in the provider locale's digits, decimal mark, and — unless the
  * options say otherwise — grouping. The shared number helper for
@@ -25,6 +26,11 @@ export declare function formatSharedNumber(value: number, locale: Locale, option
  * `isDateOnly: false` is an instant: its date and time in `timezoneID`,
  * else the viewer's zone, the time its editor reads and writes.
  */
-export declare function formatDateAbsolute(unixSeconds: number, locale: Locale, timezoneID: string | undefined, isDateOnly?: boolean): string;
-export declare function formatFilterValue(_config: InternalConfig, operatorValue: OperatorValue, filterValue: FilterValue, maxLength: number, t: TranslatorFn, locale: Locale, timezoneID?: string): string;
+export declare function formatDateAbsolute(unixSeconds: number, locale: Locale, timezoneID: string | undefined, isDateOnly?: boolean, calendar?: CalendarSystem): string;
+/**
+ * The display text of a filter value. A `date_absolute` value is written in
+ * `calendar`, which defaults to Gregorian; PowerSearch passes the calendar that
+ * its provider resolves.
+ */
+export declare function formatFilterValue(_config: InternalConfig, operatorValue: OperatorValue, filterValue: FilterValue, maxLength: number, t: TranslatorFn, locale: Locale, timezoneID?: string, calendar?: CalendarSystem): string;
 //# sourceMappingURL=formatFilterValue.d.ts.map

package/dist/PowerSearch/formatFilterValue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"formatFilterValue.d.ts","sourceRoot":"","sources":["../../src/PowerSearch/formatFilterValue.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAC,aAAa,EAAE,WAAW,EAAW,MAAM,SAAS,CAAC;AAClE,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,qBAAqB,CAAC;AACxD,OAAO,KAAK,EAAC,MAAM,EAAE,YAAY,EAAC,MAAM,SAAS,CAAC;AAyBlD;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,IAAI,CACZ,IAAI,CAAC,mBAAmB,EACxB,aAAa,GAAG,uBAAuB,CACxC,GACA,MAAM,CAER;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAChC,WAAW,EAAE,MAAM,EACnB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,MAAM,GAAG,SAAS,EAC9B,UAAU,UAAO,GAChB,MAAM,CAmBR;AAcD,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,cAAc,EACvB,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,MAAM,EACjB,CAAC,EAAE,YAAY,EACf,MAAM,EAAE,MAAM,EACd,UAAU,CAAC,EAAE,MAAM,GAClB,MAAM,CA8HR"}
+{"version":3,"file":"formatFilterValue.d.ts","sourceRoot":"","sources":["../../src/PowerSearch/formatFilterValue.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAC,aAAa,EAAE,WAAW,EAAW,MAAM,SAAS,CAAC;AAClE,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,qBAAqB,CAAC;AACxD,OAAO,KAAK,EAAC,MAAM,EAAE,YAAY,EAAC,MAAM,SAAS,CAAC;AAClD,OAAO,EAEL,KAAK,cAAc,EACpB,MAAM,yBAAyB,CAAC;AAyBjC;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,IAAI,CACZ,IAAI,CAAC,mBAAmB,EACxB,aAAa,GAAG,uBAAuB,CACxC,GACA,MAAM,CAER;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAChC,WAAW,EAAE,MAAM,EACnB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,MAAM,GAAG,SAAS,EAC9B,UAAU,UAAO,EACjB,QAAQ,GAAE,cAA0B,GACnC,MAAM,CAiBR;AAcD;;;;GAIG;AACH,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,cAAc,EACvB,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,MAAM,EACjB,CAAC,EAAE,YAAY,EACf,MAAM,EAAE,MAAM,EACd,UAAU,CAAC,EAAE,MAAM,EACnB,QAAQ,GAAE,cAA0B,GACnC,MAAM,CA+HR"}

package/dist/PowerSearch/formatFilterValue.js

@@ -2,7 +2,7 @@
 
 /**
  * @file formatFilterValue.ts
- * @input OperatorValue, FilterValue, config
+ * @input OperatorValue, FilterValue, config, locale, time zone, calendar
  * @output Formatted display string for a filter value
  * @position Pure utility; consumed by PowerSearch token rendering
  *
@@ -10,6 +10,7 @@
  * - /packages/core/src/PowerSearch/index.ts
  */
 
+import { formatCalendarInstant } from "../utils/calendarSystem.js";
 import { truncateCharacters } from "../utils/characters.js";
 import { registerEnglishFallback } from "../i18n/englishFallback.js";
 import english from "../i18n/generated-english/PowerSearch/formatFilterValue.generated.js";
@@ -45,23 +46,19 @@ export function formatSharedNumber(value, locale, options) {
  * `isDateOnly: false` is an instant: its date and time in `timezoneID`,
  * else the viewer's zone, the time its editor reads and writes.
  */
-export function formatDateAbsolute(unixSeconds, locale, timezoneID, isDateOnly = true) {
+export function formatDateAbsolute(unixSeconds, locale, timezoneID, isDateOnly = true, calendar = 'gregory') {
   const options = isDateOnly ? {
     year: 'numeric',
     month: 'short',
-    day: 'numeric',
-    timeZone: resolveDateZone(timezoneID, true),
-    calendar: 'gregory'
+    day: 'numeric'
   } : {
     year: 'numeric',
     month: 'short',
     day: 'numeric',
     hour: 'numeric',
-    minute: '2-digit',
-    timeZone: resolveDateZone(timezoneID, false),
-    calendar: 'gregory'
+    minute: '2-digit'
   };
-  return new Intl.DateTimeFormat(locale, options).format(unixSeconds * 1000);
+  return formatCalendarInstant(calendar, new Date(unixSeconds * 1000), options, locale, resolveDateZone(timezoneID, isDateOnly));
 }
 function formatRelativeDate(value) {
   // value is stored as a descriptive string like "7d" or "1w"
@@ -70,7 +67,13 @@ function formatRelativeDate(value) {
 function formatDateRange(_value, t) {
   return t('@astryx.powersearch.valueEditor.dateRange');
 }
-export function formatFilterValue(_config, operatorValue, filterValue, maxLength, t, locale, timezoneID) {
+
+/**
+ * The display text of a filter value. A `date_absolute` value is written in
+ * `calendar`, which defaults to Gregorian; PowerSearch passes the calendar that
+ * its provider resolves.
+ */
+export function formatFilterValue(_config, operatorValue, filterValue, maxLength, t, locale, timezoneID, calendar = 'gregory') {
   switch (filterValue.type) {
     case 'empty':
       return '';
@@ -148,7 +151,7 @@ export function formatFilterValue(_config, operatorValue, filterValue, maxLength
     case 'time':
       return filterValue.value;
     case 'date_absolute':
-      return truncate(formatDateAbsolute(filterValue.unixSeconds, locale, timezoneID, operatorValue.type !== 'date_absolute' || operatorValue.isDateOnly !== false), maxLength);
+      return truncate(formatDateAbsolute(filterValue.unixSeconds, locale, timezoneID, operatorValue.type !== 'date_absolute' || operatorValue.isDateOnly !== false, calendar), maxLength);
     case 'date_relative':
       return formatRelativeDate(filterValue.value);
     case 'date_range':

package/dist/PowerSearch/formatTokenValue.d.ts

@@ -1,7 +1,8 @@
 /**
  * @fileoverview The text a PowerSearch filter token shows for a value.
  *
- * @input `OperatorValue`, `FilterValue`, a width budget, and the locale.
+ * @input `OperatorValue`, `FilterValue`, a width budget, the locale, and the
+ * calendar.
  * @output `formatTokenValueText` — one string, or null for an empty value.
  * @position Shared by the token itself (`PowerSearch.tsx`) and the sheet
  * presentation's Filters rows and removal announcement
@@ -10,6 +11,7 @@
  */
 import type { OperatorValue, FilterValue } from './types.js';
 import type { Locale, TranslatorFn } from '../i18n/index.js';
+import type { CalendarSystem } from '../utils/calendarSystem.js';
 type ListFormatFn = (items: ReadonlyArray<string>) => string;
 /**
  * The text a filter token shows for a value: the one place that decides how
@@ -17,12 +19,14 @@ type ListFormatFn = (items: ReadonlyArray<string>) => string;
  * the sheet presentation's Filters rows and its removal announcement — can
  * use the same words and the same zone handling. `maxLength` is the token's
  * width budget; pass `Number.MAX_SAFE_INTEGER` for the untruncated text.
+ * A `date_absolute` value is written in `calendar`, the calendar that the
+ * provider resolves.
  * With `t`, the list, date-range and nested summaries resolve through the
  * catalog (`@astryx.powersearch.valueEditor.*`); without it they are the
  * token's own literals. With `formatList` (the provider's list formatter),
  * several labels join as a list in the locale; without it they join with
  * the token's literal ", ".
  */
-export declare function formatTokenValueText(operatorValue: OperatorValue, filterValue: FilterValue, maxLength: number, locale: Locale, t?: TranslatorFn, formatList?: ListFormatFn, timezoneID?: string): string | null;
+export declare function formatTokenValueText(operatorValue: OperatorValue, filterValue: FilterValue, maxLength: number, locale: Locale, calendar: CalendarSystem, t?: TranslatorFn, formatList?: ListFormatFn, timezoneID?: string): string | null;
 export {};
 //# sourceMappingURL=formatTokenValue.d.ts.map

package/dist/PowerSearch/formatTokenValue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"formatTokenValue.d.ts","sourceRoot":"","sources":["../../src/PowerSearch/formatTokenValue.ts"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,KAAK,EAAC,aAAa,EAAE,WAAW,EAAW,MAAM,SAAS,CAAC;AAClE,OAAO,KAAK,EAAC,MAAM,EAAE,YAAY,EAAC,MAAM,SAAS,CAAC;AAQlD,KAAK,YAAY,GAAG,CAAC,KAAK,EAAE,aAAa,CAAC,MAAM,CAAC,KAAK,MAAM,CAAC;AA6E7D;;;;;;;;;;;GAWG;AACH,wBAAgB,oBAAoB,CAClC,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,MAAM,EACd,CAAC,CAAC,EAAE,YAAY,EAChB,UAAU,CAAC,EAAE,YAAY,EACzB,UAAU,CAAC,EAAE,MAAM,GAClB,MAAM,GAAG,IAAI,CAoGf"}
+{"version":3,"file":"formatTokenValue.d.ts","sourceRoot":"","sources":["../../src/PowerSearch/formatTokenValue.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAC,aAAa,EAAE,WAAW,EAAW,MAAM,SAAS,CAAC;AAClE,OAAO,KAAK,EAAC,MAAM,EAAE,YAAY,EAAC,MAAM,SAAS,CAAC;AAClD,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,yBAAyB,CAAC;AAQ5D,KAAK,YAAY,GAAG,CAAC,KAAK,EAAE,aAAa,CAAC,MAAM,CAAC,KAAK,MAAM,CAAC;AA6E7D;;;;;;;;;;;;;GAaG;AACH,wBAAgB,oBAAoB,CAClC,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,cAAc,EACxB,CAAC,CAAC,EAAE,YAAY,EAChB,UAAU,CAAC,EAAE,YAAY,EACzB,UAAU,CAAC,EAAE,MAAM,GAClB,MAAM,GAAG,IAAI,CAqGf"}

package/dist/PowerSearch/formatTokenValue.js

@@ -3,7 +3,8 @@
 /**
  * @fileoverview The text a PowerSearch filter token shows for a value.
  *
- * @input `OperatorValue`, `FilterValue`, a width budget, and the locale.
+ * @input `OperatorValue`, `FilterValue`, a width budget, the locale, and the
+ * calendar.
  * @output `formatTokenValueText` — one string, or null for an empty value.
  * @position Shared by the token itself (`PowerSearch.tsx`) and the sheet
  * presentation's Filters rows and removal announcement
@@ -88,13 +89,15 @@ function formatListText(labels, maxLength, t, formatList) {
  * the sheet presentation's Filters rows and its removal announcement — can
  * use the same words and the same zone handling. `maxLength` is the token's
  * width budget; pass `Number.MAX_SAFE_INTEGER` for the untruncated text.
+ * A `date_absolute` value is written in `calendar`, the calendar that the
+ * provider resolves.
  * With `t`, the list, date-range and nested summaries resolve through the
  * catalog (`@astryx.powersearch.valueEditor.*`); without it they are the
  * token's own literals. With `formatList` (the provider's list formatter),
  * several labels join as a list in the locale; without it they join with
  * the token's literal ", ".
  */
-export function formatTokenValueText(operatorValue, filterValue, maxLength, locale, t, formatList, timezoneID) {
+export function formatTokenValueText(operatorValue, filterValue, maxLength, locale, calendar, t, formatList, timezoneID) {
   switch (filterValue.type) {
     case 'empty':
       return null;
@@ -130,7 +133,7 @@ export function formatTokenValueText(operatorValue, filterValue, maxLength, loca
       return filterValue.value;
     case 'date_absolute':
       // The token reads a value in the zone its editor uses.
-      return truncateString(formatDateAbsolute(filterValue.unixSeconds, locale, timezoneID, operatorValue.type !== 'date_absolute' || operatorValue.isDateOnly !== false), maxLength);
+      return truncateString(formatDateAbsolute(filterValue.unixSeconds, locale, timezoneID, operatorValue.type !== 'date_absolute' || operatorValue.isDateOnly !== false, calendar), maxLength);
     case 'date_relative':
       return truncateString(filterValue.value, maxLength);
     case 'date_range':

package/dist/RadioList/RadioListItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioListItem.d.ts","sourceRoot":"","sources":["../../src/RadioList/RadioListItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,EAAqB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAGhE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAY5C,OAAO,EAAO,KAAK,SAAS,EAAC,MAAM,cAAc,CAAC;AA0IlD,MAAM,WAAW,kBAAmB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACnE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;;;;OAUG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;;;;;;;;;;;;;OAcG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,aAAa,CAAC,EAC5B,GAAG,EACH,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,WAAW,EACX,UAAU,EAAE,cAAsB,EAClC,YAAY,EACZ,UAAU,EACV,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EACP,GAAG,IAAI,EACR,EAAE,kBAAkB,qBAoLpB;yBAnMe,aAAa"}
+{"version":3,"file":"RadioListItem.d.ts","sourceRoot":"","sources":["../../src/RadioList/RadioListItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,EAAkC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG7E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAe5C,OAAO,EAAO,KAAK,SAAS,EAAC,MAAM,cAAc,CAAC;AAsIlD,MAAM,WAAW,kBAAmB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACnE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;;;;OAUG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;;;;;;;;;;;;;OAcG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,aAAa,CAAC,EAC5B,GAAG,EACH,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,WAAW,EACX,UAAU,EAAE,cAAsB,EAClC,YAAY,EACZ,UAAU,EACV,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EACP,GAAG,IAAI,EACR,EAAE,kBAAkB,qBAuMpB;yBAtNe,aAAa"}

package/dist/RadioList/RadioListItem.js

@@ -17,7 +17,7 @@
  * - /apps/storybook/stories/RadioList.stories.tsx
  * - /packages/cli/assets/templates/blocks/components/RadioList/ (showcase blocks)
  */
-import React, { use, useId, useRef } from 'react';
+import React, { use, useCallback, useId, useRef } from 'react';
 import * as stylex from '@stylexjs/stylex';
 import { RadioListContext } from "./RadioList.js";
 import { RadioListReasonContext } from "./RadioListReasonContext.js";
@@ -31,9 +31,13 @@ import "../Indicator/indicator.markers.stylex.js";
 import { indicatorScope } from "../Indicator/indicator.markers.stylex.js";
 import { useIndicatorFocusRing } from "../hooks/useIndicatorFocusRing.js";
 import { usePressFeedback } from "../hooks/usePressFeedback.js";
+import { useMergedRefs } from "../hooks/useMergedRefs.js";
+import { watchHitArea, writeHitInsets } from "../utils/hitArea.js";
+import { touchHitAreaStyles } from "../utils/touchHitArea.stylex.js";
 import { useIndicator } from "../Indicator/useIndicator.js";
 import { Item } from "../Item/Item.js";
 import { themeProps } from "../utils/themeProps.js";
+import { rowPressLayerStyles } from "../privateAttributes/press.stylex.js";
 
 // The touch press's paint, declared by the shared overlay styles on the
 // element the controller writes to (`pressedAlpha`) at the press's strength,
@@ -104,7 +108,6 @@ const rowStyles = {
     kaIpWk: "x2u8bby",
     k7Eaqz: "xeuugli",
     kWkggS: "xjbqb8w",
-    kKwaWg: "x18o3ruo",
     $$css: true
   },
   press: {
@@ -186,6 +189,18 @@ export function RadioListItem({
   // since the visible label is now a plain (non-`<label>`) text node — a real
   // `<label htmlFor>` would double-fire under delegation.
   const radioRef = useRef(null);
+
+  // Under a coarse pointer an option's row grows toward 44 px through an
+  // invisible band, and the row keeps its size. A tap on the band lands on
+  // the row, which hands it to the radio. The watch lives as long as the row
+  // is attached: the ref's cleanup stops it.
+  const watchRowHitArea = useCallback(row => {
+    if (row == null || isDisabled) {
+      return;
+    }
+    return watchHitArea(row, insets => writeHitInsets(row, insets));
+  }, [isDisabled]);
+  const mergedRowRef = useMergedRefs(ref, watchRowHitArea);
   const radioCircle = /*#__PURE__*/_jsxs("div", {
     ...stylex.props(styles.radioWrapper, wrapperSizeStyles[size], !isDisabled && styles.indicatorPressOverlay),
     ...focusProps,
@@ -251,7 +266,7 @@ export function RadioListItem({
     children: [radioCircle, startContent]
   }) : radioCircle;
   return /*#__PURE__*/_jsx(Item, {
-    ref: ref,
+    ref: mergedRowRef,
     ...(isDisabled ? undefined : pressable),
     startContent: mediaContent
     // Delegate row-surface clicks (label text, description, and the empty
@@ -276,11 +291,14 @@ export function RadioListItem({
     // the painting row element (Item), the same element that carries the
     // theme target, so a theme's hover styling stays in step with the tint.
     !isDisabled && indicatorScope,
+    // The row keeps no press paint of its own: the circle paints, and
+    // reads the strength whose release the row keeps.
+    rowPressLayerStyles.cellWithoutLayer,
     // Restore the bare default look: zero Item's padding/radius and its
     // interactive hover/press background. Applied after Item's own base
     // styles so it wins within the base layer; a `radio-list-item` theme
     // still overrides it from the higher `astryx-theme` layer.
-    rowStyles.root, !isDisabled && rowStyles.press, xstyle],
+    rowStyles.root, !isDisabled && rowStyles.press, !isDisabled && touchHitAreaStyles.layer, xstyle],
     ...mergeProps(
     // One target for every row, carrying its size and runtime state so a
     // theme can express "selected option at large" or restyle disabled

package/dist/SelectableCard/SelectableCard.d.ts

@@ -104,7 +104,7 @@ export interface SelectableCardProps extends Omit<BaseProps, 'onChange'> {
  * </SelectableCard>
  * ```
  */
-export declare function SelectableCard({ label, isSelected, onChange, onClick: onClickProp, onMouseUp: onMouseUpProp, isDisabled, children, padding, variant, elevation, width, height, maxWidth, ref, xstyle: xstyleProp, className: classNameProp, style, ...props }: SelectableCardProps): import("react").JSX.Element;
+export declare function SelectableCard({ label, isSelected, onChange, onClick: onClickProp, onMouseUp: onMouseUpProp, onPointerDown: onPointerDownProp, isDisabled, children, padding, variant, elevation, width, height, maxWidth, ref, xstyle: xstyleProp, className: classNameProp, style, ...props }: SelectableCardProps): import("react").JSX.Element;
 export declare namespace SelectableCard {
     var displayName: string;
 }

package/dist/SelectableCard/SelectableCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectableCard.d.ts","sourceRoot":"","sources":["../../src/SelectableCard/SelectableCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,OAAO,EACL,KAAK,SAAS,EAMd,KAAK,GAAG,EACT,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAGtE,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,cAAc,CAAC;AAG9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAuN5C,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACtE,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAE1B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,UAAU,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,0BAA0B;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AA4CD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,UAAU,EACV,QAAQ,EACR,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAmB,EACnB,SAAkB,EAClB,KAAK,EACL,MAAM,EACN,QAAQ,EACR,GAAG,EACH,MAAM,EAAE,UAAU,EAClB,SAAS,EAAE,aAAa,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,+BA6JrB;yBAhLe,cAAc"}
+{"version":3,"file":"SelectableCard.d.ts","sourceRoot":"","sources":["../../src/SelectableCard/SelectableCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,OAAO,EACL,KAAK,SAAS,EAMd,KAAK,GAAG,EACT,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAItE,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,cAAc,CAAC;AAG9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAuN5C,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACtE,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAE1B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,UAAU,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,0BAA0B;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AA4CD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,UAAU,EACV,QAAQ,EACR,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,aAAa,EAAE,iBAAiB,EAChC,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAmB,EACnB,SAAkB,EAClB,KAAK,EACL,MAAM,EACN,QAAQ,EACR,GAAG,EACH,MAAM,EAAE,UAAU,EAClB,SAAS,EAAE,aAAa,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,+BAkKrB;yBAtLe,cAAc"}

package/dist/SelectableCard/SelectableCard.js

@@ -34,6 +34,7 @@ import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
 import { colorVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
 import { isImeKeyEvent, mergeProps } from "../utils/index.js";
+import { chainEventHandlers } from "../utils/chainEventHandlers.js";
 import { Card } from "../Card/Card.js";
 import { useClickableContainer } from "../hooks/useClickableContainer.js";
 import { closestLayerRoot } from "../privateAttributes/layerRoot.stylex.js";
@@ -257,6 +258,7 @@ export function SelectableCard({
   onChange,
   onClick: onClickProp,
   onMouseUp: onMouseUpProp,
+  onPointerDown: onPointerDownProp,
   isDisabled = false,
   children,
   padding,
@@ -311,7 +313,8 @@ export function SelectableCard({
   }, [isDisabled, requestChange]);
   const {
     onClick,
-    onMouseUp
+    onMouseUp,
+    onPointerDown
   } = useClickableContainer({
     containerRef,
     interactiveRef,
@@ -361,6 +364,7 @@ export function SelectableCard({
     !isDisabled && interactionOverlayStyles.pressedAlpha, isDisabled && styles.disabled, xstyleProp],
     onClick: !isDisabled ? composedOnClick : undefined,
     onMouseUp: !isDisabled ? composedOnMouseUp : undefined,
+    onPointerDown: !isDisabled ? chainEventHandlers(onPointerDown, onPointerDownProp) : onPointerDownProp,
     ...props,
     onClickCapture: !isDisabled && handleLayerClickCapture ? e => {
       handleLayerClickCapture(e);

package/dist/Spinner/Spinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/Spinner/Spinner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6B5C,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;CAKV,CAAC;AA8XF,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,KAAK,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAExE,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;;;;;;;;;;;;OAaG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;GAWG;AACH,wBAAgB,OAAO,CAAC,EACtB,IAAW,EACX,KAAiB,EACjB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,SAAS,EACb,EAAE,YAAY,+BAqId;yBAhJe,OAAO"}
+{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/Spinner/Spinner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA8B5C,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;CAKV,CAAC;AA2SF,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,KAAK,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAExE,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;;;;;;;;;;;;OAaG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;GAWG;AACH,wBAAgB,OAAO,CAAC,EACtB,IAAW,EACX,KAAiB,EACjB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,SAAS,EACb,EAAE,YAAY,+BAqId;yBAhJe,OAAO"}

package/dist/Spinner/Spinner.js

@@ -18,12 +18,13 @@
 import { useId } from 'react';
 import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
-import { colorVars, durationVars, spacingVars } from "../theme/tokens.stylex.js";
+import { colorVars, spacingVars } from "../theme/tokens.stylex.js";
 import { Text } from "../Text/Text.js";
 import { mergeProps } from "../utils/mergeProps.js";
 import { themeProps } from "../utils/themeProps.js";
 import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComponentTranslator.js";
 import english from "../i18n/generated-english/Spinner/Spinner.generated.js";
+import { spinnerRotorStyles, syncRotationPhase } from "./spinnerRotor.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 registerEnglishFallback(english);
 
@@ -32,13 +33,13 @@ registerEnglishFallback(english);
 // =============================================================================
 
 /**
- * Default fraction of the ring the moving arc covers. The canvas ring this
- * replaces swept 135deg, not the 270deg its constant's comment claimed.
+ * The fraction of the ring the arc covers: SPINNER_ARC_FRACTION. StyleX reads
+ * only a literal in this file, and a test pins the two together.
  *
  * Themeable via `--spinner-arc-fraction`, declared alongside the other public
  * vars in `sizeStyles` below. Only the inline `strokeDasharray` attribute
- * (the pre-stylesheet render — see its own comment) still reads this
- * constant directly; the CSS side composes the dash from the live var.
+ * (the pre-stylesheet render) still reads the constant directly; the CSS side
+ * composes the dash from the live var.
  */
 const ARC_FRACTION = 0.375;
 const PI = 3.141592653589793;
@@ -155,69 +156,6 @@ function registerSpinnerVars() {
 // elide.
 registerSpinnerVars();
 
-/**
- * Pin every ring's rotation to the document timeline's origin instead of its
- * own start time, so spinners mounted seconds apart stay in phase.
- *
- * Setting `startTime` is exact where arithmetic on a clock read is not. A
- * negative `animation-delay` computed at mount is only as good as the gap
- * between the clock read and the frame the animation starts in. At 10x CPU
- * throttling that gap measured 116 degrees of drift.
- *
- * Rotors are collected and pinned in one frame. `getAnimations()` resolves
- * style, and `startTime` dirties it again. So pinning them one at a time makes
- * each mount re-force what the previous one invalidated: 53 style recalcs for
- * 38 spinners, against 19 batched.
- */
-const pendingRotors = new Set();
-let flushScheduled = false;
-function pinRotorsToTimelineOrigin() {
-  flushScheduled = false;
-  const animations = [];
-  for (const rotor of pendingRotors) {
-    animations.push(...rotor.getAnimations());
-  }
-  pendingRotors.clear();
-  for (const animation of animations) {
-    animation.startTime = 0;
-  }
-}
-
-/**
- * Ref callback for the rotor: the one place a mounted ring touches the DOM.
- *
- * It reads nothing back — the geometry is resolved by the cascade, not in JS.
- */
-function syncRotationPhase(rotor) {
-  if (rotor == null) {
-    return undefined;
-  }
-  // jsdom implements no Web Animations, and this runs in every consumer's
-  // component tests.
-  if (typeof rotor.getAnimations !== 'function') {
-    return undefined;
-  }
-  pendingRotors.add(rotor);
-  if (!flushScheduled) {
-    flushScheduled = true;
-    requestAnimationFrame(pinRotorsToTimelineOrigin);
-  }
-  return () => {
-    pendingRotors.delete(rotor);
-  };
-}
-
-// =============================================================================
-// Animation
-// =============================================================================
-
-/**
- * A `transform` animation runs on the compositor, so the ring keeps turning
- * while a script runs. A `stroke-dashoffset` animation would repaint the arc
- * on the main thread every frame, so it would stop while a script runs.
- */
-const rotation = "xqng64z-B";
-
 // =============================================================================
 // Styles
 // =============================================================================
@@ -240,6 +178,13 @@ const styles = {
     kmuXW: "x2lah0s",
     $$css: true
   },
+  rotor: {
+    k1xSpc: "x1lliihq",
+    kJuA4N: "x15r89dc",
+    kzqmXN: "x6v0vjy",
+    kZKoxP: "x7yyq19",
+    $$css: true
+  },
   circle: {
     kDwRjp: "xbh8q5q",
     kR8GR0: "x1764fhq",
@@ -447,9 +392,7 @@ export function Spinner({
     }), /*#__PURE__*/_jsx("span", {
       ref: syncRotationPhase,
       "aria-hidden": "true",
-      ...{
-        className: "x1lliihq x15r89dc x6v0vjy x7yyq19 x1so62im x1qcljrn xnh0sag xa4qsjk x1ka1v4i x1esw782"
-      },
+      ...stylex.props(styles.rotor, spinnerRotorStyles.turn),
       children: /*#__PURE__*/_jsx("svg", {
         width: frameSize,
         height: frameSize,

package/dist/Spinner/index.d.ts

@@ -7,5 +7,5 @@
  * SYNC: When modified, update this header and /packages/core/src/Spinner/Spinner.doc.mjs
  */
 export { Spinner } from './Spinner.js';
-export type { SpinnerProps, SpinnerSize, SpinnerShade, } from './Spinner.js';
+export type { SpinnerProps, SpinnerSize, SpinnerShade } from './Spinner.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/Spinner/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Spinner/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,WAAW,CAAC;AAClC,YAAY,EACV,YAAY,EACZ,WAAW,EACX,YAAY,GACb,MAAM,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Spinner/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,WAAW,CAAC;AAClC,YAAY,EAAC,YAAY,EAAE,WAAW,EAAE,YAAY,EAAC,MAAM,WAAW,CAAC"}

package/dist/Spinner/spinnerRotor.d.ts

@@ -0,0 +1,28 @@
+/**
+ * @file spinnerRotor.ts
+ * @input StyleX keyframes and the slow-min duration token
+ * @output The one turning arc: SPINNER_ARC_FRACTION, spinnerRotorStyles.turn
+ *   and syncRotationPhase
+ * @position Spinner's rotor, shared by Spinner and Lab's indeterminate
+ *   CircularProgress (through `@astryxdesign/core/internal/spinner-rotor`), so
+ *   both rings turn the same way on the compositor.
+ */
+import * as stylex from '@stylexjs/stylex';
+/** The fraction of the ring the arc covers: 135°. */
+export declare const SPINNER_ARC_FRACTION = 0.375;
+export declare const spinnerRotorStyles: Readonly<{
+    readonly turn: Readonly<{
+        readonly willChange: stylex.StyleXClassNameFor<"willChange", "transform">;
+        readonly animationDuration: stylex.StyleXClassNameFor<"animationDuration", `calc(var(--_astryx-pre-tempo-duration-slow-min, ${stylex.StyleXVar<"730ms">}) * 100)` | "calc(3s * 100)">;
+        readonly animationIterationCount: stylex.StyleXClassNameFor<"animationIterationCount", "infinite">;
+        readonly animationName: stylex.StyleXClassNameFor<"animationName", string>;
+        readonly animationTimingFunction: stylex.StyleXClassNameFor<"animationTimingFunction", "linear">;
+    }>;
+}>;
+/**
+ * Ref callback for a rotor: the one place a mounted ring touches the DOM.
+ *
+ * It reads nothing back — the geometry is resolved by the cascade, not in JS.
+ */
+export declare function syncRotationPhase(rotor: Element | null): (() => void) | undefined;
+//# sourceMappingURL=spinnerRotor.d.ts.map

package/dist/Spinner/spinnerRotor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"spinnerRotor.d.ts","sourceRoot":"","sources":["../../src/Spinner/spinnerRotor.ts"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAG3C,qDAAqD;AACrD,eAAO,MAAM,oBAAoB,QAAQ,CAAC;AAsB1C,eAAO,MAAM,kBAAkB;;;;;;;;EAiB7B,CAAC;AA+BH;;;;GAIG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,OAAO,GAAG,IAAI,GACpB,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAiB1B"}