@astryxdesign/core 0.0.15 → 0.1.0-canary.0b5b49f

package/dist/Chat/ChatLayout.js

@@ -30,7 +30,7 @@ import { useChatStreamScroll } from "./useChatStreamScroll.js";
 import { useChatNewMessages } from "./useChatNewMessages.js";
 import { ChatLayoutScrollButton } from "./ChatLayoutScrollButton.js";
 import { ChatLayoutContext } from "./ChatContext.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 
 // =============================================================================
 // Types
@@ -242,7 +242,7 @@ export function ChatLayout({
     children: /*#__PURE__*/_jsxs("div", {
       ref: mergeRefs(ref, rootRef),
       "data-testid": testId,
-      ...mergeProps(xdsThemeProps('chat-layout', {
+      ...mergeProps(themeProps('chat-layout', {
         density
       }), stylex.props(styles.root, isSelfScrolling && styles.rootScrollable, xstyle), className, style),
       children: [/*#__PURE__*/_jsx("div", {

package/dist/Chat/ChatMessage.js

@@ -24,7 +24,7 @@ import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, typeScaleVars, fontWeightVars } from "../theme/tokens.stylex.js";
 import { ChatMessageContext, useChatListContext } from "./ChatContext.js";
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const styles = {
   root: {
@@ -162,7 +162,7 @@ export function ChatMessage({
       "data-testid": testId,
       "aria-label": !hasName ? `Message from ${sender}` : undefined,
       "aria-labelledby": hasName ? nameId : undefined,
-      ...mergeProps(xdsThemeProps('chat-message', {
+      ...mergeProps(themeProps('chat-message', {
         sender,
         density
       }), stylex.props(styles.root, rootAlignment, hasAvatar && rootGap, xstyle), className, styleProp),

package/dist/Chat/ChatMessageBubble.js

@@ -29,7 +29,7 @@ import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, radiusVars, typeScaleVars, typographyVars } from "../theme/tokens.stylex.js";
 import { useChatMessageContext } from "./ChatContext.js";
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 // =============================================================================
 // Styles
@@ -193,7 +193,7 @@ export function ChatMessageBubble({
     }), /*#__PURE__*/_jsx("div", {
       ref: ref,
       "data-testid": testId,
-      ...mergeProps(xdsThemeProps('chat-message-bubble', {
+      ...mergeProps(themeProps('chat-message-bubble', {
         sender,
         variant,
         density

package/dist/Chat/ChatMessageList.js

@@ -28,7 +28,7 @@ import { spacingVars } from "../theme/tokens.stylex.js";
 import { ChatListContext, useChatLayoutContext } from "./ChatContext.js";
 import { mergeProps } from "../utils/index.js";
 import { Spinner } from "../Spinner/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // =============================================================================
 // Styles
@@ -197,7 +197,7 @@ export function ChatMessageList({
       "aria-live": "polite",
       tabIndex: 0,
       "data-testid": testId,
-      ...mergeProps(xdsThemeProps('chat-message-list', {
+      ...mergeProps(themeProps('chat-message-list', {
         density
       }), stylex.props(styles.root, xstyle), className, style),
       children: /*#__PURE__*/_jsxs("div", {

package/dist/Chat/ChatMessageMetadata.js

@@ -18,7 +18,7 @@ import { colorVars, spacingVars, typeScaleVars, fontWeightVars } from "../theme/
 import { useChatMessageContext } from "./ChatContext.js";
 import { Icon } from "../Icon/index.js";
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const STATUS_CONFIG = {
   sending: {
@@ -96,7 +96,7 @@ export function ChatMessageMetadata({
   }
   return /*#__PURE__*/_jsxs("div", {
     ref: ref,
-    ...mergeProps(xdsThemeProps('chat-message-metadata'), stylex.props(styles.meta, sender === 'user' ? styles.metaUser : styles.metaAssistant, xstyle), className, style),
+    ...mergeProps(themeProps('chat-message-metadata'), stylex.props(styles.meta, sender === 'user' ? styles.metaUser : styles.metaAssistant, xstyle), className, style),
     children: [timestamp != null && /*#__PURE__*/_jsx("span", {
       children: timestamp
     }), timestamp != null && (footer != null || statusConfig != null) && /*#__PURE__*/_jsx("span", {

package/dist/Chat/ChatSendButton.js

@@ -21,7 +21,7 @@ import * as stylex from '@stylexjs/stylex';
 import { Button } from "../Button/index.js";
 import { getIcon } from "../Icon/globalIconRegistry.js";
 import { useChatComposerContext } from "./ChatContext.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 
 // =============================================================================
 // Types
@@ -77,7 +77,7 @@ export function ChatSendButton(props) {
     isIconOnly: true,
     isDisabled: !isStopShown && isDisabled,
     onClick: isStopShown ? onStop : handleSend,
-    ...xdsThemeProps('chat-send-button'),
+    ...themeProps('chat-send-button'),
     xstyle: [styles.root, xstyle]
   });
 }

package/dist/Chat/ChatSystemMessage.js

@@ -23,7 +23,7 @@ import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, typeScaleVars, fontWeightVars, typographyVars } from "../theme/tokens.stylex.js";
 import { mergeProps } from "../utils/index.js";
 import { Divider } from "../Divider/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // =============================================================================
 // Styles
@@ -82,7 +82,7 @@ export function ChatSystemMessage({
       ref: ref,
       role: "status",
       "data-testid": testId,
-      ...mergeProps(xdsThemeProps('chat-system-message', {
+      ...mergeProps(themeProps('chat-system-message', {
         variant
       }), stylex.props(styles.dividerWrap, xstyle), className, styleProp),
       children: /*#__PURE__*/_jsx(Divider, {
@@ -94,7 +94,7 @@ export function ChatSystemMessage({
     ref: ref,
     role: "status",
     "data-testid": testId,
-    ...mergeProps(xdsThemeProps('chat-system-message', {
+    ...mergeProps(themeProps('chat-system-message', {
       variant
     }), stylex.props(styles.root, xstyle), className, styleProp),
     children: /*#__PURE__*/_jsxs("span", {

package/dist/Chat/ChatTokenizedText.js

@@ -20,7 +20,7 @@ import React from 'react';
 import * as stylex from '@stylexjs/stylex';
 import { Badge } from "../Badge/index.js";
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 
 // =============================================================================
 // Styles
@@ -59,7 +59,7 @@ export function ChatTokenizedText({
   if (!children || !tokens || tokens.length === 0) {
     return /*#__PURE__*/_jsx("span", {
       ref: ref,
-      ...mergeProps(xdsThemeProps('chat-tokenized-text'), {
+      ...mergeProps(themeProps('chat-tokenized-text'), {
         className: "xt0psk2"
       }),
       children: children ?? ''
@@ -68,7 +68,7 @@ export function ChatTokenizedText({
   const parts = renderTokens(children, tokens);
   return /*#__PURE__*/_jsx("span", {
     ref: ref,
-    ...mergeProps(xdsThemeProps('chat-tokenized-text'), {
+    ...mergeProps(themeProps('chat-tokenized-text'), {
       className: "xt0psk2"
     }),
     children: parts

package/dist/Chat/ChatToolCalls.js

@@ -25,7 +25,7 @@ import { getKey, mergeProps } from "../utils/index.js";
 import { Badge } from "../Badge/index.js";
 import { Icon } from "../Icon/index.js";
 import { Spinner } from "../Spinner/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 
 // =============================================================================
 // Types
@@ -270,7 +270,7 @@ export function ChatToolCalls(props) {
   if (calls.length === 1) {
     return /*#__PURE__*/_jsx("div", {
       ref: ref,
-      ...mergeProps(xdsThemeProps('chat-tool-calls'), stylex.props(styles.root, xstyle), className, style),
+      ...mergeProps(themeProps('chat-tool-calls'), stylex.props(styles.root, xstyle), className, style),
       ...rest,
       children: /*#__PURE__*/_jsx(CallRow, {
         call: calls[0]
@@ -283,7 +283,7 @@ export function ChatToolCalls(props) {
   const latestStatus = latestCall.status ?? 'complete';
   return /*#__PURE__*/_jsxs("div", {
     ref: ref,
-    ...mergeProps(xdsThemeProps('chat-tool-calls'), stylex.props(styles.root, xstyle), className, style),
+    ...mergeProps(themeProps('chat-tool-calls'), stylex.props(styles.root, xstyle), className, style),
     ...rest,
     children: [/*#__PURE__*/_jsxs("div", {
       role: "button",

package/dist/Chat/useTriggerMenu.js

@@ -25,7 +25,7 @@ import { usePopover } from "../Popover/usePopover.js";
 import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, radiusVars, typeScaleVars, typographyVars } from "../theme/tokens.stylex.js";
 import { mergeProps, groupItems } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 
 // =============================================================================
 // Types
@@ -486,7 +486,7 @@ export function useTriggerMenu(options) {
       id: listboxId,
       role: "listbox",
       "aria-label": trigger?.menuLabel ?? 'Suggestions',
-      ...mergeProps(xdsThemeProps('trigger-menu'), {
+      ...mergeProps(themeProps('trigger-menu'), {
         className: "x9f619 x1xiyphd x1odjw0f x9epnlk xfb3i0g"
       }),
       children: listContent

package/dist/CheckboxInput/CheckboxInput.js

@@ -25,7 +25,7 @@ import { Spinner } from "../Spinner/index.js";
 import { mergeProps, mergeRefs } from "../utils/index.js";
 import "./checkbox.markers.stylex.js";
 import { checkboxScope } from "./checkbox.markers.stylex.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 const styles = {
   container: {
@@ -245,7 +245,7 @@ export function CheckboxInput({
   }
   const ariaDescribedBy = describedByParts.length > 0 ? describedByParts.join(' ') : undefined;
   return /*#__PURE__*/_jsxs("div", {
-    ...mergeProps(xdsThemeProps('checkbox-input', {
+    ...mergeProps(themeProps('checkbox-input', {
       size
     }), stylex.props(width != null && dynamicWidthStyles.width(width), xstyle), className, style),
     children: [/*#__PURE__*/_jsxs("div", {
@@ -283,7 +283,7 @@ export function CheckboxInput({
           ...stylex.props(styles.input, wrapperSizeStyles[size], isDisabled && styles.inputDisabled)
         }), /*#__PURE__*/_jsx("div", {
           "aria-hidden": "true",
-          ...mergeProps(xdsThemeProps('checkbox', {
+          ...mergeProps(themeProps('checkbox', {
             size,
             checked: isChecked ? 'checked' : isIndeterminate ? 'indeterminate' : null,
             disabled: isDisabled ? 'disabled' : null

package/dist/CheckboxList/CheckboxList.js

@@ -19,7 +19,7 @@ import { useCallback, useId, useMemo, useOptimistic, useTransition } from 'react
 import { Field } from "../Field/Field.js";
 import { List } from "../List/List.js";
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { CheckboxListContext } from "./CheckboxListContext.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const EMPTY_ARRAY = [];
@@ -107,7 +107,7 @@ export function CheckboxList({
     statusVariant: "detached",
     width: width,
     xstyle: xstyle,
-    ...mergeProps(xdsThemeProps('checkbox-list'), {
+    ...mergeProps(themeProps('checkbox-list'), {
       className,
       style
     }),

package/dist/Citation/Citation.js

@@ -16,7 +16,7 @@ import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, radiusVars, typeScaleVars, fontWeightVars, borderVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const styles = {
   label: {
@@ -113,7 +113,7 @@ export function Citation({
       "aria-label": `Citation ${number}: ${title}`,
       "data-testid": testId,
       ...linkProps,
-      ...mergeProps(xdsThemeProps('citation', {
+      ...mergeProps(themeProps('citation', {
         variant
       }), stylex.props(styles.number, href != null && styles.numberHover, xstyle), className, style),
       children: number
@@ -126,7 +126,7 @@ export function Citation({
     "aria-label": `Citation ${number}: ${title}`,
     "data-testid": testId,
     ...linkProps,
-    ...mergeProps(xdsThemeProps('citation', {
+    ...mergeProps(themeProps('citation', {
       variant
     }), stylex.props(styles.label, icon != null && styles.labelWithIcon, href != null && styles.labelHover, xstyle), className, style),
     children: [icon && /*#__PURE__*/_jsx("span", {

package/dist/ClickableCard/ClickableCard.js

@@ -35,7 +35,7 @@ import { mergeProps, mergeRefs } from "../utils/index.js";
 import { Card } from "../Card/Card.js";
 import { useClickableContainer } from "../hooks/useClickableContainer.js";
 import { useLinkComponent } from "../Link/useLinkComponent.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 
 // =============================================================================
 // Styles — only the interactive layer, Card handles everything else
@@ -164,7 +164,7 @@ export function ClickableCard({
     maxWidth: maxWidth,
     padding: padding,
     variant: variant,
-    ...mergeProps(xdsThemeProps('clickable-card', {
+    ...mergeProps(themeProps('clickable-card', {
       variant
     }), {
       className: classNameProp,

package/dist/Code/Code.js

@@ -17,7 +17,7 @@ import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, radiusVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const styles = {
   base: {
@@ -56,7 +56,7 @@ export function Code({
 }) {
   return /*#__PURE__*/_jsx("code", {
     ref: ref,
-    ...mergeProps(xdsThemeProps('code'), stylex.props(styles.base, xstyle), className, style),
+    ...mergeProps(themeProps('code'), stylex.props(styles.base, xstyle), className, style),
     "data-testid": props['data-testid'],
     children: children
   });

package/dist/CodeBlock/CodeBlock.js

@@ -18,7 +18,7 @@ import { Icon } from "../Icon/index.js";
 import { tokenize, tokenizeAsync, flatTokensToLines, SYNC_TOKENIZE_THRESHOLD } from "./tokenizer.js";
 import { ensureHighlightStyles } from "./highlightStyles.js";
 import { applyHighlightRangesChunked } from "./highlightRanges.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 
 // ---------------------------------------------------------------------------
 // Styles
@@ -518,7 +518,7 @@ export function CodeBlock({
   });
   return /*#__PURE__*/_jsxs("pre", {
     ref: ref,
-    ...mergeProps(xdsThemeProps('codeblock', {
+    ...mergeProps(themeProps('codeblock', {
       size,
       language,
       container

package/dist/Collapsible/Collapsible.js

@@ -26,7 +26,7 @@ import { colorVars, typographyVars, fontWeightVars, spacingVars, typeScaleVars,
 import { useCollapsible } from "./useCollapsible.js";
 import { getIcon } from "../Icon/globalIconRegistry.js";
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const styles = {
   root: {
@@ -102,7 +102,7 @@ export function Collapsible({
   const chevronIcon = getIcon('chevronDown');
   return /*#__PURE__*/_jsxs("div", {
     ref: ref,
-    ...mergeProps(xdsThemeProps('collapsible'), stylex.props(styles.root, xstyle), className, style),
+    ...mergeProps(themeProps('collapsible'), stylex.props(styles.root, xstyle), className, style),
     ...props,
     children: [/*#__PURE__*/_jsxs("button", {
       type: "button",

package/dist/CommandPalette/CommandPaletteFooter.js

@@ -17,7 +17,7 @@ import { mergeProps } from "../utils/index.js";
 import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, typeScaleVars, typographyVars } from "../theme/tokens.stylex.js";
 import { Kbd } from "../Kbd/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const styles = {
   footer: {
@@ -63,7 +63,7 @@ export function CommandPaletteFooter({
 }) {
   return /*#__PURE__*/_jsx("div", {
     ref: ref,
-    ...mergeProps(xdsThemeProps('command-palette-footer'), stylex.props(styles.footer, xstyle), className, style),
+    ...mergeProps(themeProps('command-palette-footer'), stylex.props(styles.footer, xstyle), className, style),
     ...props,
     children: children ?? /*#__PURE__*/_jsxs(_Fragment, {
       children: [/*#__PURE__*/_jsxs("span", {

package/dist/CommandPalette/CommandPaletteGroup.js

@@ -14,7 +14,7 @@
 
 import * as stylex from '@stylexjs/stylex';
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, typeScaleVars, typographyVars } from "../theme/tokens.stylex.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -58,7 +58,7 @@ export function CommandPaletteGroup({
     ref: ref,
     role: "group",
     "aria-label": heading,
-    ...mergeProps(xdsThemeProps('command-palette-group'), stylex.props(styles.group, xstyle), className, style),
+    ...mergeProps(themeProps('command-palette-group'), stylex.props(styles.group, xstyle), className, style),
     ...props,
     children: [/*#__PURE__*/_jsx("div", {
       "aria-hidden": "true",

package/dist/CommandPalette/CommandPaletteInput.js

@@ -21,7 +21,7 @@ import "../theme/tokens.stylex.js";
 import { colorVars, typeScaleVars, spacingVars, typographyVars } from "../theme/tokens.stylex.js";
 import { useCommandPaletteContext } from "./CommandPaletteContext.js";
 import { useDialogContext } from "../Dialog/DialogContext.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const styles = {
   wrapper: {
@@ -96,7 +96,7 @@ export function CommandPaletteInput({
     ctx?.onKeyDown(e);
   }, [ctx, onKeyDown]);
   return /*#__PURE__*/_jsxs("div", {
-    ...mergeProps(xdsThemeProps('command-palette-input'), stylex.props(styles.wrapper, xstyle)),
+    ...mergeProps(themeProps('command-palette-input'), stylex.props(styles.wrapper, xstyle)),
     children: [/*#__PURE__*/_jsx("span", {
       ...{
         className: "x78zum5 x6s0dn4 x2lah0s xv1l7n4"

package/dist/CommandPalette/CommandPaletteItem.js

@@ -18,7 +18,7 @@ import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, radiusVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
 import { useCommandPaletteContext } from "./CommandPaletteContext.js";
 import { useDialogContext } from "../Dialog/DialogContext.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const HOVER_HOVER = '@media (hover: hover)';
 const styles = {
@@ -142,7 +142,7 @@ export function CommandPaletteItem({
     "data-value": value,
     onClick: handleClick,
     onMouseEnter: handleMouseEnter,
-    ...mergeProps(xdsThemeProps('command-palette-item'), stylex.props(styles.item, !isDisabled && styles.itemHover, isHighlighted && styles.itemHighlighted, isSelected && styles.itemSelected, isDisabled && styles.itemDisabled, xstyle), className, style),
+    ...mergeProps(themeProps('command-palette-item'), stylex.props(styles.item, !isDisabled && styles.itemHover, isHighlighted && styles.itemHighlighted, isSelected && styles.itemSelected, isDisabled && styles.itemDisabled, xstyle), className, style),
     ...props,
     children: children
   });

package/dist/CommandPalette/CommandPaletteList.js

@@ -18,7 +18,7 @@ import { mergeProps } from "../utils/index.js";
 import "../theme/tokens.stylex.js";
 import { spacingVars } from "../theme/tokens.stylex.js";
 import { useCommandPaletteContext } from "./CommandPaletteContext.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const styles = {
   list: {
@@ -66,7 +66,7 @@ export function CommandPaletteList({
     id: ctx?.listId,
     role: "listbox",
     "aria-label": label,
-    ...mergeProps(xdsThemeProps('command-palette-list'), stylex.props(styles.list, xstyle), className, style),
+    ...mergeProps(themeProps('command-palette-list'), stylex.props(styles.list, xstyle), className, style),
     ...props,
     children: children
   });

package/dist/ContextMenu/ContextMenu.js

@@ -34,7 +34,7 @@ import { layerAnimations } from "../Layer/layerAnimations.stylex.js";
 import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, radiusVars, durationVars, easeVars, shadowVars } from "../theme/tokens.stylex.js";
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 const styles = {
   menu: {
@@ -212,7 +212,7 @@ export function ContextMenu({
       id: menuId,
       role: "menu",
       onKeyDown: listKeyDown,
-      ...mergeProps(xdsThemeProps('context-menu'), stylex.props(styles.menu, xstyle), className, style),
+      ...mergeProps(themeProps('context-menu'), stylex.props(styles.menu, xstyle), className, style),
       children: /*#__PURE__*/_jsx(DropdownMenuContext, {
         value: contextValue,
         children: resolvedMenuContent

package/dist/DateInput/DateInput.js

@@ -48,7 +48,7 @@ const sizeStyles = {
 // Re-export shared types for convenience
 
 import { mergeProps, mergeRefs } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * A date picker component combining a text input with a calendar popover.
@@ -268,7 +268,7 @@ export function DateInput({
     children: [/*#__PURE__*/_jsxs("div", {
       ref: popover.triggerRef,
       ...rest,
-      ...mergeProps(xdsThemeProps('date-input', {
+      ...mergeProps(themeProps('date-input', {
         size,
         status: status?.type ?? null
       }), stylex.props(inputWrapperStyles.base, sizeStyles[size], isEffectivelyDisabled && inputWrapperStyles.disabled, status && inputStatusBorderStyles[status.type], status && inputStatusHoverShadowStyles[status.type], status && inputStatusFocusWithinStyles[status.type], xstyle), className, style),

package/dist/DateRangeInput/DateRangeInput.js

@@ -27,7 +27,7 @@ import { Calendar } from "../Calendar/index.js";
 import { usePopover } from "../Popover/index.js";
 import { mergeProps } from "../utils/index.js";
 import { useSize } from "../SizeContext/SizeContext.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const sizeStyles = {
   sm: {
@@ -187,7 +187,7 @@ export function DateRangeInput({
     children: [/*#__PURE__*/_jsxs("div", {
       ref: popover.triggerRef,
       ...rest,
-      ...mergeProps(xdsThemeProps('date-range-input', {
+      ...mergeProps(themeProps('date-range-input', {
         size,
         status: status?.type ?? null
       }), stylex.props(inputWrapperStyles.base, sizeStyles[size], isEffectivelyDisabled && inputWrapperStyles.disabled, status && inputStatusBorderStyles[status.type], status && inputStatusHoverShadowStyles[status.type], status && inputStatusFocusWithinStyles[status.type], xstyle), className, style),

package/dist/DateTimeInput/DateTimeInput.js

@@ -29,7 +29,7 @@ import { useInputContainer } from "../hooks/useInputContainer.js";
 import { parseDateInput, parseTimeInput, formatDisplayTime12h, formatDisplayTime24h, formatISOTime, isTimeInRange, adjustTime, mergeProps, mergeRefs } from "../utils/index.js";
 import { plainDateFromISO, plainDateToISO, plainDateFormat, DATE_FORMAT_LONG } from "../utils/plainDate.js";
 import { useSize } from "../SizeContext/SizeContext.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const styles = {
   row: {
@@ -435,7 +435,7 @@ export function DateTimeInput({
     width: width,
     children: [/*#__PURE__*/_jsxs("div", {
       ...rest,
-      ...mergeProps(xdsThemeProps('date-time-input', {
+      ...mergeProps(themeProps('date-time-input', {
         size,
         status: status?.type ?? null
       }), stylex.props(styles.row, xstyle), className, style),

package/dist/Dialog/Dialog.js

@@ -24,7 +24,7 @@ import { container } from "../Layout/container.stylex.js";
 import { paddingStyles, containerPaddingInlineVarStyles, containerPaddingBlockStartVarStyles, containerPaddingBlockEndVarStyles, spacingStepToToken } from "../Layout/padding.stylex.js";
 import { mergeProps, mergeRefs } from "../utils/index.js";
 import { DialogContext } from "./DialogContext.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 
 /**
  * Calculate a directional translate offset for dialog entry animation.
@@ -353,7 +353,7 @@ export function Dialog({
       return null;
     }
     return /*#__PURE__*/_jsx("div", {
-      ...mergeProps(xdsThemeProps('dialog', {
+      ...mergeProps(themeProps('dialog', {
         variant
       }), stylex.props(styles.inlineWrapper, !isFullscreen && dynamicStyles.sizing(width, maxHeight), isFullscreen && styles.fullscreen, xstyle), className, style),
       "data-testid": props['data-testid'],
@@ -375,7 +375,7 @@ export function Dialog({
     onCancel: handleCancel,
     "aria-modal": "true",
     role: purpose === 'required' ? 'alertdialog' : undefined,
-    ...mergeProps(xdsThemeProps('dialog', {
+    ...mergeProps(themeProps('dialog', {
       variant
     }), stylex.props(styles.dialog, isOpen && styles.open, styles.backdrop, !isFullscreen && dynamicStyles.sizing(width, maxHeight), hasPosition && dynamicStyles.position(position?.top, position?.right, position?.bottom, position?.left), isFullscreen && styles.fullscreen, xstyle), className, style),
     ...safeProps,

package/dist/Divider/Divider.js

@@ -18,7 +18,7 @@ import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, typeScaleVars, borderVars } from "../theme/tokens.stylex.js";
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 
 /**
  * Extensible variant map for Divider.
@@ -117,7 +117,7 @@ export function Divider({
     ref: ref,
     role: "separator",
     "aria-orientation": orientation,
-    ...mergeProps(xdsThemeProps('divider', {
+    ...mergeProps(themeProps('divider', {
       variant,
       orientation
     }), stylex.props(isHorizontal ? baseStyles.horizontal : baseStyles.vertical, isFullBleed && (isHorizontal ? fullBleedStyles.horizontal : fullBleedStyles.vertical), xstyle), className, style),

package/dist/DropdownMenu/DropdownMenu.js

@@ -33,7 +33,7 @@ import { layerAnimations } from "../Layer/layerAnimations.stylex.js";
 import "../theme/tokens.stylex.js";
 import { spacingVars, radiusVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
 import { mergeProps } from "../utils/index.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 const styles = {
   dropdown: {
@@ -294,7 +294,7 @@ export function DropdownMenu({
       id: menuId,
       role: "menu",
       onKeyDown: listKeyDown,
-      ...mergeProps(xdsThemeProps('dropdown-menu'), stylex.props(styles.dropdown, xstyle), className, style),
+      ...mergeProps(themeProps('dropdown-menu'), stylex.props(styles.dropdown, xstyle), className, style),
       children: /*#__PURE__*/_jsx(DropdownMenuContext, {
         value: contextValue,
         children: menuContent

package/dist/DropdownMenu/DropdownMenuItem.js

@@ -30,7 +30,7 @@ import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
 import { mergeProps } from "../utils/index.js";
 import { useDropdownMenuContext } from "./DropdownMenuContext.js";
-import { xdsThemeProps } from "../utils/xdsThemeProps.js";
+import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const menuItemStyles = {
   root: {
@@ -115,7 +115,7 @@ export function DropdownMenuItem({
     onClick: handleClick,
     isDisabled: isDisabled,
     xstyle: [menuItemStyles.root, itemSizeStyles[menuSize], isDisabled && menuItemStyles.disabled, xstyle],
-    ...mergeProps(xdsThemeProps('dropdown-menu-item', {
+    ...mergeProps(themeProps('dropdown-menu-item', {
       size: menuSize
     }), {
       className,