@astryxdesign/core 0.5.0-canary.7b60efa → 0.5.0-canary.7bd80db

package/dist/AlertDialog/AlertDialog.d.ts

@@ -1,6 +1,6 @@
 /**
  * @file AlertDialog.tsx
- * @input Uses React, Dialog, Layout, Heading, Text, Button
+ * @input Uses React, StyleX, Dialog, Layout, Heading, Text, Button
  * @output Exports AlertDialog component, AlertDialogProps type
  * @position Core implementation; consumed by index.ts, tested by AlertDialog.test.tsx
  *

package/dist/AlertDialog/AlertDialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../src/AlertDialog/AlertDialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAA2B,MAAM,OAAO,CAAC;AAQhD,OAAO,EAAS,KAAK,aAAa,EAAC,MAAM,WAAW,CAAC;AACrD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACpE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAC;IAE3C;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAE9B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;OAGG;IACH,QAAQ,EAAE,MAAM,OAAO,CAAC;IAExB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,KAAK,EACL,WAAW,EACX,WAAW,EAAE,oBAAoB,EACjC,WAAW,EACX,aAA6B,EAC7B,eAAe,EACf,QAAQ,EACR,KAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,gBAAgB,qBAkElB;yBApFe,WAAW"}
+{"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../src/AlertDialog/AlertDialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAA2B,MAAM,OAAO,CAAC;AAShD,OAAO,EAAS,KAAK,aAAa,EAAC,MAAM,WAAW,CAAC;AACrD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAkB5C,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACpE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAC;IAE3C;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAE9B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;OAGG;IACH,QAAQ,EAAE,MAAM,OAAO,CAAC;IAExB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,KAAK,EACL,WAAW,EACX,WAAW,EAAE,oBAAoB,EACjC,WAAW,EACX,aAA6B,EAC7B,eAAe,EACf,QAAQ,EACR,KAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,gBAAgB,qBA8FlB;yBAhHe,WAAW"}

package/dist/AlertDialog/AlertDialog.js

@@ -4,7 +4,7 @@
 
 /**
  * @file AlertDialog.tsx
- * @input Uses React, Dialog, Layout, Heading, Text, Button
+ * @input Uses React, StyleX, Dialog, Layout, Heading, Text, Button
  * @output Exports AlertDialog component, AlertDialogProps type
  * @position Core implementation; consumed by index.ts, tested by AlertDialog.test.tsx
  *
@@ -16,18 +16,32 @@
  * - /packages/cli/assets/templates/blocks/components/AlertDialog/ (showcase blocks)
  */
 import React, { useId, useCallback } from 'react';
+import * as stylex from '@stylexjs/stylex';
 import { Dialog } from "../Dialog/index.js";
 import { Layout } from "../Layout/Layout.js";
 import { LayoutContent } from "../Layout/LayoutContent.js";
 import { LayoutFooter } from "../Layout/LayoutFooter.js";
-import { HStack } from "../Stack/index.js";
+import { Stack } from "../Stack/index.js";
 import { Heading } from "../Heading/Heading.js";
 import { Text } from "../Text/Text.js";
 import { Button } from "../Button/index.js";
 import { mergeProps } from "../utils/index.js";
 import { themeProps } from "../utils/themeProps.js";
 import { useTranslator } from "../i18n/index.js";
+import { useMediaQuery } from "../hooks/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const SMALL_SCREEN_QUERY = '(max-width: 640px)';
+const styles = {
+  action: {
+    ks0D6T: "x193iq5w",
+    k7Eaqz: "xeuugli",
+    $$css: true
+  },
+  stackedAction: {
+    kzqmXN: "xh8yej3",
+    $$css: true
+  }
+};
 /**
  * A confirmation dialog for destructive or irreversible actions.
  *
@@ -77,9 +91,33 @@ export function AlertDialog({
   const cancelLabel = cancelLabelFromProps ?? t('@astryx.alertDialog.cancel');
   const titleId = useId();
   const descriptionId = useId();
+  // Width stays delegated to Dialog: this query exists only so AlertDialog can
+  // keep narrow visual, DOM, and tab order aligned for its destructive/cancel
+  // semantics without coupling action order to pointer or hover capability.
+  const isSmallScreen = useMediaQuery(SMALL_SCREEN_QUERY);
   const handleCancel = useCallback(() => {
     onOpenChange(false);
   }, [onOpenChange]);
+  const buttonActionStyle = [styles.action, isSmallScreen && styles.stackedAction];
+  const cancelButton = /*#__PURE__*/_jsx(Button, {
+    variant: "ghost",
+    label: cancelLabel,
+    onClick: handleCancel,
+    xstyle: buttonActionStyle
+    // Dialog focuses [data-autofocus] itself after showModal(), because
+    // React's autoFocus runs during commit while the dialog is invisible.
+    // Cancel is least destructive, so it remains the autofocus target even
+    // when small-screen visual order places the destructive action above it.
+    ,
+    "data-autofocus": true
+  }, "cancel");
+  const actionButton = /*#__PURE__*/_jsx(Button, {
+    variant: actionVariant,
+    label: actionLabel,
+    onClick: onAction,
+    isLoading: isActionLoading,
+    xstyle: buttonActionStyle
+  }, "action");
   return /*#__PURE__*/_jsx(Dialog, {
     ...rest,
     ref: ref,
@@ -117,25 +155,12 @@ export function AlertDialog({
         })]
       }),
       footer: /*#__PURE__*/_jsx(LayoutFooter, {
-        children: /*#__PURE__*/_jsxs(HStack, {
+        children: /*#__PURE__*/_jsx(Stack, {
+          direction: isSmallScreen ? 'vertical' : 'horizontal',
           gap: 2,
-          hAlign: "end",
-          children: [/*#__PURE__*/_jsx(Button, {
-            variant: "ghost",
-            label: cancelLabel,
-            onClick: handleCancel
-            // Dialog focuses [data-autofocus] itself after showModal(),
-            // because React's autoFocus runs during commit while the
-            // dialog is still invisible. Cancel is the least destructive
-            // choice, so it is the one that should be preselected.
-            ,
-            "data-autofocus": true
-          }), /*#__PURE__*/_jsx(Button, {
-            variant: actionVariant,
-            label: actionLabel,
-            onClick: onAction,
-            isLoading: isActionLoading
-          })]
+          hAlign: isSmallScreen ? 'stretch' : 'end',
+          wrap: isSmallScreen ? 'nowrap' : 'wrap',
+          children: isSmallScreen ? [actionButton, cancelButton] : [cancelButton, actionButton]
         })
       })
     })

package/dist/AspectRatio/AspectRatio.d.ts

@@ -44,14 +44,14 @@ export interface AspectRatioProps extends BaseProps<HTMLDivElement> {
      *   `astryx-base` cascade layer, and unlayered CSS wins over layered
      *   rules regardless of specificity.
      *
+     * A responsive ratio is set in CSS, not on the component. For example, a 3:1
+     * hero can become 3:2 when its container narrows by targeting the element's
+     * class from a container query:
+     * `@container gallery (max-width: 720px) { .gallery-hero { aspect-ratio: 3 / 2; } }`.
+     *
      * @example
      * ```
-     * // 3:1 hero that becomes 3:2 when its container stacks
-     * <AspectRatio ratio={3 / 1} className="gallery-hero">…</AspectRatio>
-     *
-     * // CSS: @container gallery (max-width: 720px) {
-     * //   .gallery-hero { aspect-ratio: 3 / 2; }
-     * // }
+     * <AspectRatio ratio={3 / 1} className="gallery-hero">...</AspectRatio>
      * ```
      */
     ratio: number;

package/dist/Avatar/Avatar.d.ts

@@ -16,6 +16,7 @@
  */
 import { type ReactNode } from 'react';
 import type { BaseProps } from '../BaseProps';
+import * as stylex from '@stylexjs/stylex';
 import type { LinkComponentType } from '../Link/types';
 /**
  * Named size options.
@@ -33,10 +34,25 @@ type AvatarNumericSize = 16 | 20 | 24 | 32 | 36 | 40 | 48 | 60 | 64 | 72 | 96 |
  * Avatar size - can be a named size or a specific pixel value
  */
 export type AvatarSize = AvatarNamedSize | AvatarNumericSize;
+/**
+ * Avatar shape options
+ */
+export type AvatarShape = 'circle' | 'rounded' | 'square';
 /**
  * Resolves named sizes to their numeric pixel values
  */
 export declare function resolveSize(size: AvatarSize): number;
+export declare const shapeStyles: Readonly<{
+    readonly circle: Readonly<{
+        readonly '--_avatar-radius': stylex.StyleXClassNameFor<"--_avatar-radius", "9999px">;
+    }>;
+    readonly rounded: Readonly<{
+        readonly '--_avatar-radius': stylex.StyleXClassNameFor<"--_avatar-radius", "8px">;
+    }>;
+    readonly square: Readonly<{
+        readonly '--_avatar-radius': stylex.StyleXClassNameFor<"--_avatar-radius", "0px">;
+    }>;
+}>;
 export interface AvatarProps extends BaseProps<HTMLDivElement> {
     /** Ref forwarded to the root element */
     ref?: React.Ref<HTMLDivElement>;
@@ -69,6 +85,14 @@ export interface AvatarProps extends BaseProps<HTMLDivElement> {
      * @default 'md'
      */
     size?: AvatarSize;
+    /**
+     * Shape variant of the avatar.
+     * - 'circle': Full circle (default)
+     * - 'rounded': Rounded square
+     * - 'square': Sharp square
+     * @default 'circle'
+     */
+    shape?: AvatarShape;
     /**
      * The primary image source for the avatar.
      */
@@ -147,7 +171,7 @@ export interface AvatarProps extends BaseProps<HTMLDivElement> {
  * <Avatar src="/user.jpg" name="John Doe" onClick={() => openProfile()} />
  * ```
  */
-export declare function Avatar({ alt, 'data-testid': testId, fallbackSrc, name, size, src, status, tooltip, href, as, target, rel, onClick, xstyle, className, style, ref, ...props }: AvatarProps): import("react").JSX.Element;
+export declare function Avatar({ alt, 'data-testid': testId, fallbackSrc, name, size, shape, src, status, tooltip, href, as, target, rel, onClick, xstyle, className, style, ref, ...props }: AvatarProps): import("react").JSX.Element;
 export declare namespace Avatar {
     var displayName: string;
 }

package/dist/Avatar/Avatar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAsB5C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AA4BrD;;;;;;GAMG;AACH,KAAK,eAAe,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEzD;;GAEG;AACH,KAAK,iBAAiB,GACpB,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEzE;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,eAAe,GAAG,iBAAiB,CAAC;AAE7D;;GAEG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CAgBpD;AAgID,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;;;;;;;;OAYG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;;;;;;;;;OAWG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC3B;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;CAChD;AAwHD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,MAAM,CAAC,EACrB,GAAG,EACH,aAAa,EAAE,MAAM,EACrB,WAAW,EACX,IAAI,EACJ,IAAW,EACX,GAAG,EACH,MAAM,EACN,OAAc,EACd,IAAI,EACJ,EAAE,EACF,MAAM,EACN,GAAG,EACH,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,+BAkVb;yBArWe,MAAM"}
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAqB3C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AA4BrD;;;;;;GAMG;AACH,KAAK,eAAe,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEzD;;GAEG;AACH,KAAK,iBAAiB,GACpB,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEzE;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,eAAe,GAAG,iBAAiB,CAAC;AAE7D;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE1D;;GAEG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CAgBpD;AASD,eAAO,MAAM,WAAW;;;;;;;;;;EAUtB,CAAC;AA6IH,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;;;;;;;;;OAYG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;;;;;;;;;OAWG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC3B;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;CAChD;AAwHD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,MAAM,CAAC,EACrB,GAAG,EACH,aAAa,EAAE,MAAM,EACrB,WAAW,EACX,IAAI,EACJ,IAAW,EACX,KAAgB,EAChB,GAAG,EACH,MAAM,EACN,OAAc,EACd,IAAI,EACJ,EAAE,EACF,MAAM,EACN,GAAG,EACH,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,+BAsVb;yBA1We,MAAM"}

package/dist/Avatar/Avatar.js

@@ -77,6 +77,10 @@ const INITIALS_FONT_SIZE_RATIO = 0.4;
  * Avatar size - can be a named size or a specific pixel value
  */
 
+/**
+ * Avatar shape options
+ */
+
 /**
  * Resolves named sizes to their numeric pixel values
  */
@@ -98,6 +102,28 @@ export function resolveSize(size) {
   }
 }
 
+// Sets one local custom property rather than `borderRadius` directly, so
+// every clipping/ring surface that needs the shape's radius (the wrapper,
+// the interactive focus ring, the content div that actually clips via
+// `overflow: hidden`, and AvatarGroupOverflow's "+N" indicator) reads the
+// same value instead of each hardcoding its own borderRadius independently.
+// A theme override only has to reach this one property, not fight the
+// per-surface StyleX class order to change the shape everywhere at once.
+export const shapeStyles = {
+  circle: {
+    "--_avatar-radius": "xeincmr",
+    $$css: true
+  },
+  rounded: {
+    "--_avatar-radius": "xdarwi0",
+    $$css: true
+  },
+  square: {
+    "--_avatar-radius": "x877142",
+    $$css: true
+  }
+};
+
 /**
  * Base styles for the avatar
  * Uses a wrapper/content structure so status isn't clipped by overflow:hidden
@@ -107,7 +133,7 @@ const styles = {
     kVAEAm: "x1n2onr6",
     k1xSpc: "x3nfvp2",
     kmuXW: "x2lah0s",
-    kaIpWk: "xjspbzw",
+    kaIpWk: "xbc78cj",
     $$css: true
   },
   fallback: {
@@ -138,7 +164,7 @@ const styles = {
     kVVagm: "xln7xf2",
     kybGjl: "x1hl2dhg",
     kkrTdU: "x1ypdohk x16khyan",
-    kaIpWk: "xjspbzw",
+    kaIpWk: "xbc78cj",
     $$css: true
   }
 };
@@ -168,15 +194,20 @@ const dynamicStyles = {
   fontSize: size => [_temp, {
     "--x-fontSize": (val => typeof val === "number" ? val + "px" : val != null ? val : undefined)(`${size * INITIALS_FONT_SIZE_RATIO}px`)
   }],
-  statusPosition: size => [_temp2, {
+  statusPositionCircle: size => [_temp2, {
     "--x-bottom": (val => typeof val === "number" ? val + "px" : val != null ? val : undefined)(size * CIRCLE_EDGE_OFFSET_RATIO),
     "--x-insetInlineEnd": (val => typeof val === "number" ? val + "px" : val != null ? val : undefined)(size * CIRCLE_EDGE_OFFSET_RATIO)
-  }]
+  }],
+  statusPositionCorner: {
+    krVfgx: "x1ey2m1c",
+    kt4wiu: "xtijo5x",
+    k3aq6I: "xv8yid9 x10fxb7p",
+    $$css: true
+  }
 };
 const BORDER_WIDTH = 2;
 const groupStyles = {
   ring: {
-    kaIpWk: "xjspbzw",
     kMzoRj: "xdh2fpr",
     ksu8eU: "x1y0btm7",
     kVAM5u: "x1touxvs",
@@ -333,6 +364,7 @@ export function Avatar({
   fallbackSrc,
   name,
   size = 'md',
+  shape = 'circle',
   src,
   status,
   tooltip = true,
@@ -384,6 +416,7 @@ export function Avatar({
   } : undefined;
   const avatarGroup = useAvatarGroup();
   const resolvedSize = avatarGroup?.size ?? size;
+  const resolvedShape = avatarGroup?.shape ?? shape;
   const numericSize = useMemo(() => resolveSize(resolvedSize), [resolvedSize]);
 
   // Resolve the tooltip content:
@@ -487,7 +520,7 @@ export function Avatar({
   const visualContent = /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsxs("div", {
       ...{
-        className: "x78zum5 x6s0dn4 xl56j7k xh8yej3 x5yr21d xjspbzw xb3r6kr x87ps6o"
+        className: "x78zum5 x6s0dn4 xl56j7k xh8yej3 x5yr21d xb3r6kr x87ps6o xbc78cj"
       },
       children: [showImage && /*#__PURE__*/_jsx("img", {
         src: src,
@@ -519,7 +552,7 @@ export function Avatar({
         })
       })]
     }), status && /*#__PURE__*/_jsx("div", {
-      ...stylex.props(styles.status, dynamicStyles.statusPosition(numericSize)),
+      ...stylex.props(styles.status, resolvedShape === 'circle' ? dynamicStyles.statusPositionCircle(numericSize) : dynamicStyles.statusPositionCorner),
       children: status
     })]
   });
@@ -529,8 +562,9 @@ export function Avatar({
   // tooltip tab-stop focus ring all live here so the interactive
   // `<a>`/`<button>` and the static `<div>` carry the exact same box.
   const rootStylexProps = mergeProps(themeProps('avatar', {
-    size: resolvedSize
-  }), focusOutlineProps.focusVisible(styles.wrapper, dynamicStyles.size(numericSize), isInteractive && styles.interactive, avatarGroup && groupStyles.ring, avatarGroup && groupStyles.overlap, avatarGroup && groupDynamicStyles.overlap(-avatarGroup.overlap), xstyle), className, style);
+    size: resolvedSize,
+    shape: resolvedShape
+  }), focusOutlineProps.focusVisible(styles.wrapper, dynamicStyles.size(numericSize), isInteractive && styles.interactive, avatarGroup && groupStyles.ring, avatarGroup && groupStyles.overlap, avatarGroup && groupDynamicStyles.overlap(-avatarGroup.overlap), shapeStyles[resolvedShape], xstyle), className, style);
   let rootElement;
 
   // `props` is typed for the default `<div>` root (its event handlers are

package/dist/Avatar/index.d.ts

@@ -1,7 +1,7 @@
 /**
  * @file index.ts
  * @input Imports Avatar component and types from Avatar.tsx, AvatarStatusDot from AvatarStatusDot.tsx
- * @output Exports Avatar, AvatarProps, AvatarSize, AvatarStatusDot, AvatarStatusDotProps, AvatarStatusDotVariant
+ * @output Exports Avatar, AvatarProps, AvatarSize, AvatarShape, resolveSize, AvatarStatusDot, AvatarStatusDotProps, AvatarStatusDotVariant
  * @position Component entry point; re-exported by /packages/core/src/index.ts
  *
  * SYNC: When modified, update this header and /packages/core/src/Avatar/Avatar.doc.mjs
@@ -32,7 +32,7 @@ export interface AvatarStatusDotVariantMap {
     error: true;
 }
 export { Avatar, resolveSize } from './Avatar';
-export type { AvatarProps, AvatarSize } from './Avatar';
+export type { AvatarProps, AvatarSize, AvatarShape } from './Avatar';
 export { AvatarStatusDot } from './AvatarStatusDot';
 export type { AvatarStatusDotProps, AvatarStatusDotVariant, } from './AvatarStatusDot';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Avatar/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAEH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,IAAI,CAAC;IACd,OAAO,EAAE,IAAI,CAAC;IACd,KAAK,EAAE,IAAI,CAAC;CACb;AAED,OAAO,EAAC,MAAM,EAAE,WAAW,EAAC,MAAM,UAAU,CAAC;AAC7C,YAAY,EAAC,WAAW,EAAE,UAAU,EAAC,MAAM,UAAU,CAAC;AACtD,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAClD,YAAY,EACV,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Avatar/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAEH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,IAAI,CAAC;IACd,OAAO,EAAE,IAAI,CAAC;IACd,KAAK,EAAE,IAAI,CAAC;CACb;AAED,OAAO,EAAC,MAAM,EAAE,WAAW,EAAC,MAAM,UAAU,CAAC;AAC7C,YAAY,EAAC,WAAW,EAAE,UAAU,EAAE,WAAW,EAAC,MAAM,UAAU,CAAC;AACnE,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAClD,YAAY,EACV,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,mBAAmB,CAAC"}

package/dist/Avatar/index.js

@@ -5,7 +5,7 @@
 /**
  * @file index.ts
  * @input Imports Avatar component and types from Avatar.tsx, AvatarStatusDot from AvatarStatusDot.tsx
- * @output Exports Avatar, AvatarProps, AvatarSize, AvatarStatusDot, AvatarStatusDotProps, AvatarStatusDotVariant
+ * @output Exports Avatar, AvatarProps, AvatarSize, AvatarShape, resolveSize, AvatarStatusDot, AvatarStatusDotProps, AvatarStatusDotVariant
  * @position Component entry point; re-exported by /packages/core/src/index.ts
  *
  * SYNC: When modified, update this header and /packages/core/src/Avatar/Avatar.doc.mjs

package/dist/AvatarGroup/AvatarGroup.d.ts

@@ -22,7 +22,7 @@
  */
 import { type ReactNode } from 'react';
 import type { BaseProps } from '../BaseProps';
-import { type AvatarSize } from '../Avatar';
+import { type AvatarShape, type AvatarSize } from '../Avatar';
 export interface AvatarGroupProps extends BaseProps<HTMLDivElement> {
     /** Ref forwarded to the root element. */
     ref?: React.Ref<HTMLDivElement>;
@@ -38,6 +38,13 @@ export interface AvatarGroupProps extends BaseProps<HTMLDivElement> {
      * @default 'md'
      */
     size?: AvatarSize;
+    /**
+     * Shape applied to all avatars via context, overriding each avatar's own
+     * `shape` prop so a group stays visually uniform. Also applied to the
+     * `AvatarGroupOverflow` "+N" indicator, so it matches the group.
+     * @default 'circle'
+     */
+    shape?: AvatarShape;
     /**
      * Test ID for integration testing.
      */
@@ -61,7 +68,7 @@ export interface AvatarGroupProps extends BaseProps<HTMLDivElement> {
  * </AvatarGroup>
  * ```
  */
-export declare function AvatarGroup({ children, size, 'data-testid': testId, 'aria-label': ariaLabelFromProps, 'aria-describedby': ariaDescribedByFromProps, onKeyDown, onFocus, xstyle, className, style, ref, ...props }: AvatarGroupProps): ReactNode;
+export declare function AvatarGroup({ children, size, shape, 'data-testid': testId, 'aria-label': ariaLabelFromProps, 'aria-describedby': ariaDescribedByFromProps, onKeyDown, onFocus, xstyle, className, style, ref, ...props }: AvatarGroupProps): ReactNode;
 export declare namespace AvatarGroup {
     var displayName: string;
 }

package/dist/AvatarGroup/AvatarGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.d.ts","sourceRoot":"","sources":["../../src/AvatarGroup/AvatarGroup.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,EAA2B,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAc,KAAK,UAAU,EAAC,MAAM,WAAW,CAAC;AAcvD,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACjE,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AASD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,IAAW,EACX,aAAa,EAAE,MAAM,EACrB,YAAY,EAAE,kBAAkB,EAChC,kBAAkB,EAAE,wBAAwB,EAC5C,SAAS,EACT,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,gBAAgB,GAAG,SAAS,CAmE9B;yBAhFe,WAAW"}
+{"version":3,"file":"AvatarGroup.d.ts","sourceRoot":"","sources":["../../src/AvatarGroup/AvatarGroup.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,EAA2B,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAc,KAAK,WAAW,EAAE,KAAK,UAAU,EAAC,MAAM,WAAW,CAAC;AAczE,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACjE,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AASD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,IAAW,EACX,KAAgB,EAChB,aAAa,EAAE,MAAM,EACrB,YAAY,EAAE,kBAAkB,EAChC,kBAAkB,EAAE,wBAAwB,EAC5C,SAAS,EACT,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,gBAAgB,GAAG,SAAS,CAmE9B;yBAjFe,WAAW"}

package/dist/AvatarGroup/AvatarGroup.js

@@ -66,6 +66,7 @@ const styles = {
 export function AvatarGroup({
   children,
   size = 'md',
+  shape = 'circle',
   'data-testid': testId,
   'aria-label': ariaLabelFromProps,
   'aria-describedby': ariaDescribedByFromProps,
@@ -83,9 +84,10 @@ export function AvatarGroup({
   const overlap = Math.round(numericSize * OVERLAP_RATIO);
   const contextValue = useMemo(() => ({
     size,
+    shape,
     overlap,
     numericSize
-  }), [size, overlap, numericSize]);
+  }), [size, shape, overlap, numericSize]);
 
   // The keyboard hint and roving tab stop only make sense once the group has
   // interactive children. Detect their presence from the rendered DOM after
@@ -127,7 +129,8 @@ export function AvatarGroup({
       onKeyDown: composeEventHandlers(onKeyDown, handleKeyDown),
       onFocus: composeEventHandlers(onFocus, handleFocus),
       ...mergeProps(themeProps('avatar-group', {
-        size
+        size,
+        shape
       }), stylex.props(styles.root, xstyle), className, style),
       children: [children, hasInteractiveItems && /*#__PURE__*/_jsx(VisuallyHidden, {
         id: hintId,

package/dist/AvatarGroup/AvatarGroupContext.d.ts

@@ -1,6 +1,7 @@
-import type { AvatarSize } from '../Avatar';
+import type { AvatarShape, AvatarSize } from '../Avatar';
 export interface AvatarGroupContextValue {
     size: AvatarSize;
+    shape: AvatarShape;
     overlap: number;
     numericSize: number;
 }

package/dist/AvatarGroup/AvatarGroupContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroupContext.d.ts","sourceRoot":"","sources":["../../src/AvatarGroup/AvatarGroupContext.ts"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,WAAW,CAAC;AAE1C,MAAM,WAAW,uBAAuB;IACtC,IAAI,EAAE,UAAU,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,kBAAkB,yDACsB,CAAC;AAGtD,wBAAgB,cAAc,IAAI,uBAAuB,GAAG,IAAI,CAE/D"}
+{"version":3,"file":"AvatarGroupContext.d.ts","sourceRoot":"","sources":["../../src/AvatarGroup/AvatarGroupContext.ts"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAC,WAAW,EAAE,UAAU,EAAC,MAAM,WAAW,CAAC;AAEvD,MAAM,WAAW,uBAAuB;IACtC,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,EAAE,WAAW,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,kBAAkB,yDAE9B,CAAC;AAGF,wBAAgB,cAAc,IAAI,uBAAuB,GAAG,IAAI,CAE/D"}

package/dist/AvatarGroup/AvatarGroupOverflow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroupOverflow.d.ts","sourceRoot":"","sources":["../../src/AvatarGroup/AvatarGroupOverflow.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAa5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CACpD,SAAS,CAAC,WAAW,CAAC,EACtB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAqFD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,GAAG,EACH,KAAK,EACL,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,wBAAwB,GAAG,SAAS,CA+DtC;yBAxEe,mBAAmB"}
+{"version":3,"file":"AvatarGroupOverflow.d.ts","sourceRoot":"","sources":["../../src/AvatarGroup/AvatarGroupOverflow.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAa5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CACpD,SAAS,CAAC,WAAW,CAAC,EACtB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAwFD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,GAAG,EACH,KAAK,EACL,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,wBAAwB,GAAG,SAAS,CAkEtC;yBA3Ee,mBAAmB"}

package/dist/AvatarGroup/AvatarGroupOverflow.js

@@ -15,7 +15,8 @@
 import React from 'react';
 import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
-import { colorVars, typographyVars, typeScaleVars, fontWeightVars, radiusVars, spacingVars } from "../theme/tokens.stylex.js";
+import { colorVars, typographyVars, typeScaleVars, fontWeightVars, spacingVars } from "../theme/tokens.stylex.js";
+import { shapeStyles } from "../Avatar/Avatar.js";
 import { mergeProps } from "../utils/index.js";
 import { resolveSize } from "../Avatar/index.js";
 import { useAvatarGroup } from "./AvatarGroupContext.js";
@@ -31,7 +32,7 @@ const styles = {
     k1xSpc: "x3nfvp2",
     kGNEyG: "x6s0dn4",
     kjj79g: "xl56j7k",
-    kaIpWk: "xjspbzw",
+    kaIpWk: "xbc78cj",
     kWkggS: "x10xzikg",
     kMwMTN: "xv1l7n4",
     kMv6JI: "x9ynric",
@@ -109,6 +110,7 @@ export function AvatarGroupOverflow({
   const t = useTranslator();
   const group = useAvatarGroup();
   const size = group?.size ?? 'md';
+  const shape = group?.shape ?? 'circle';
   const numericSize = group?.numericSize ?? resolveSize('md');
   const overlap = group?.overlap ?? 0;
 
@@ -129,8 +131,9 @@ export function AvatarGroupOverflow({
       "aria-label": label,
       "data-avatar-item": "",
       ...mergeProps(themeProps('avatar-group-overflow', {
-        size
-      }), focusOutlineProps.focusVisible(styles.base, styles.button, styles.overlap, dynamicStyles.size(numericSize), dynamicStyles.fontSize(numericSize), dynamicStyles.overlap(-overlap), xstyle), className, style),
+        size,
+        shape
+      }), focusOutlineProps.focusVisible(styles.base, styles.button, styles.overlap, dynamicStyles.size(numericSize), dynamicStyles.fontSize(numericSize), dynamicStyles.overlap(-overlap), shapeStyles[shape], xstyle), className, style),
       children: content
     });
   }
@@ -139,8 +142,9 @@ export function AvatarGroupOverflow({
     ...rest,
     "aria-label": label,
     ...mergeProps(themeProps('avatar-group-overflow', {
-      size
-    }), stylex.props(styles.base, styles.overlap, dynamicStyles.size(numericSize), dynamicStyles.fontSize(numericSize), dynamicStyles.overlap(-overlap), xstyle), className, style),
+      size,
+      shape
+    }), stylex.props(styles.base, styles.overlap, dynamicStyles.size(numericSize), dynamicStyles.fontSize(numericSize), dynamicStyles.overlap(-overlap), shapeStyles[shape], xstyle), className, style),
     children: content
   });
 }

package/dist/Button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}

package/dist/Button/Button.js

@@ -445,9 +445,13 @@ export function Button({
   // for every variant, and `destructive` re-colors just the ring to match
   // its own surface. Ordering is the mechanism — StyleX is last-wins.
   variants[variant], xstyle);
-  const sharedMergedProps = mergeProps(themeProps('button', {
+  const sharedMergedProps = mergeProps(
+  // Inside a group the group owns the surface's elevation, so the button
+  // reflects the tier it actually paints rather than the prop it was handed.
+  themeProps('button', {
     variant,
-    size
+    size,
+    elevation: buttonGroup ? 'none' : elevation
   }), sharedStylexProps, className, style);
   const buttonContent = /*#__PURE__*/_jsxs(_Fragment, {
     children: [isLoadingState && /*#__PURE__*/_jsx("span", {

package/dist/Calendar/Calendar.js

@@ -261,7 +261,7 @@ export function Calendar({
         if (plainDateIsEqual(date, startPd)) {
           setRangeSelectionStart(null);
           announce(t('@astryx.calendar.rangeClearedAnnounce', {
-            date: plainDateFormat(date, DATE_FORMAT_WITH_WEEKDAY)
+            date: plainDateFormat(date, DATE_FORMAT_WITH_WEEKDAY, locale)
           }));
           return;
         }

package/dist/Calendar/styles.d.ts

@@ -33,19 +33,9 @@ export declare const calendarStyles: Readonly<{
     }>;
     readonly monthsContainer: Readonly<{
         readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly flexWrap: stylex.StyleXClassNameFor<"flexWrap", "wrap">;
         readonly gap: stylex.StyleXClassNameFor<"gap", "16px">;
     }>;
-    readonly srOnly: Readonly<{
-        readonly position: stylex.StyleXClassNameFor<"position", "absolute">;
-        readonly width: stylex.StyleXClassNameFor<"width", "1px">;
-        readonly height: stylex.StyleXClassNameFor<"height", "1px">;
-        readonly padding: stylex.StyleXClassNameFor<"padding", 0>;
-        readonly margin: stylex.StyleXClassNameFor<"margin", "-1px">;
-        readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
-        readonly clip: stylex.StyleXClassNameFor<"clip", "rect(0, 0, 0, 0)">;
-        readonly whiteSpace: stylex.StyleXClassNameFor<"whiteSpace", "nowrap">;
-        readonly borderWidth: stylex.StyleXClassNameFor<"borderWidth", 0>;
-    }>;
     readonly navIcon: Readonly<{
         readonly display: stylex.StyleXClassNameFor<"display", "inline-flex">;
     }>;
@@ -154,7 +144,7 @@ export declare const dayCellStyles: Readonly<{
         readonly display: stylex.StyleXClassNameFor<"display", "flex">;
         readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
         readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "center">;
-        readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", "50%">;
+        readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", "9999px">;
         readonly borderWidth: stylex.StyleXClassNameFor<"borderWidth", 0>;
         readonly borderStyle: stylex.StyleXClassNameFor<"borderStyle", "none">;
         readonly cursor: stylex.StyleXClassNameFor<"cursor", "default" | "pointer">;
@@ -209,8 +199,9 @@ export declare const dayCellTheme: Readonly<{
         readonly boxShadow: stylex.StyleXClassNameFor<"boxShadow", `inset 0 0 0 1px ${stylex.StyleXVar<"light-dark(#0A1317, #DFE2E5)">}`>;
     }>;
     readonly daySelected: Readonly<{
-        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0064E0, #2694FE)">;
-        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#FFFFFF, #FFFFFF)">;
+        readonly forcedColorAdjust: stylex.StyleXClassNameFor<"forcedColorAdjust", "none">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0064E0, #2694FE)" | "Highlight">;
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#FFFFFF, #FFFFFF)" | "HighlightText">;
         readonly backgroundImage: stylex.StyleXClassNameFor<"backgroundImage", {
             readonly '@media (hover: hover)': `linear-gradient(${stylex.StyleXVar<"light-dark(#0536590C, #FFFFFF0C)">}, ${stylex.StyleXVar<"light-dark(#0536590C, #FFFFFF0C)">})`;
         } | null>;

package/dist/Calendar/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/Calendar/styles.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAgB3C,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2CzB,CAAC;AAMH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuC1B,CAAC;AAMH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+GxB,CAAC;AAMH,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4DvB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/Calendar/styles.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAgB3C,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoCzB,CAAC;AAMH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuC1B,CAAC;AAiBH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+GxB,CAAC;AAMH,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0EvB,CAAC"}