@accelint/design-system 1.2.2 → 1.2.3

package/dist/components/tabs/index.js

@@ -31,9 +31,9 @@ var TEST_IDS = {
 };
 var TabsContext = createContext(null);
 var Tabs = forwardRef(function Tabs2(props, ref) {
-  [props, ref] = useContextProps(props, ref, TabsContext);
-  props = useDefaultProps(props, "Tabs");
-  const { classNames: classNamesProp, ...rest } = props;
+  const [contextProps, contextRef] = useContextProps(props, ref, TabsContext);
+  const finalProps = useDefaultProps(contextProps, "Tabs");
+  const { classNames: classNamesProp, ...rest } = finalProps;
   const theme = useTheme();
   const classNames = useMemo(
     () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),
@@ -50,7 +50,7 @@ var Tabs = forwardRef(function Tabs2(props, ref) {
     Tabs$1,
     {
       ...rest,
-      ref,
+      ref: contextRef,
       className: classNames?.tabs,
       "data-testid": TEST_IDS.tabs
     }
@@ -58,8 +58,12 @@ var Tabs = forwardRef(function Tabs2(props, ref) {
 });
 var TabListContext = createContext(null);
 var TabList = forwardRef(function TabList2(props, ref) {
-  [props, ref] = useContextProps(props, ref, TabListContext);
-  props = useDefaultProps(props, "TabList");
+  const [contextProps, contextRef] = useContextProps(
+    props,
+    ref,
+    TabListContext
+  );
+  const finalProps = useDefaultProps(contextProps, "TabList");
   const {
     children,
     classNames: classNamesProp,
@@ -70,7 +74,7 @@ var TabList = forwardRef(function TabList2(props, ref) {
     variant = "border",
     align = orientation === "horizontal" ? "center" : "start",
     ...rest
-  } = props;
+  } = finalProps;
   const theme = useTheme();
   const classNames = useMemo(
     () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),
@@ -101,7 +105,7 @@ var TabList = forwardRef(function TabList2(props, ref) {
         TabList$1,
         {
           ...rest,
-          ref,
+          ref: contextRef,
           className: classNames?.list?.list,
           items,
           "data-testid": TEST_IDS.list.list,
@@ -115,8 +119,8 @@ var TabContext = createContext(
   null
 );
 var Tab = forwardRef(function Tab2(props, ref) {
-  [props, ref] = useContextProps(props, ref, TabContext);
-  props = useDefaultProps(props, "Tab");
+  const [contextProps, contextRef] = useContextProps(props, ref, TabContext);
+  const finalProps = useDefaultProps(contextProps, "Tab");
   const {
     children: childrenProp,
     classNames: classNamesProp,
@@ -126,7 +130,7 @@ var Tab = forwardRef(function Tab2(props, ref) {
     onPressStart,
     onPressUp,
     ...rest
-  } = props;
+  } = finalProps;
   const { pressProps } = usePropagatingPress({
     onPress,
     onPressChange,
@@ -162,7 +166,7 @@ var Tab = forwardRef(function Tab2(props, ref) {
     Tab$1,
     {
       ...rest,
-      ref,
+      ref: contextRef,
       className: classNames?.tab?.container,
       style,
       "data-testid": TEST_IDS.tab.container,
@@ -172,13 +176,17 @@ var Tab = forwardRef(function Tab2(props, ref) {
 });
 var TabPanelsContext = createContext(null);
 var TabPanels = forwardRef(function TabPanels2(props, ref) {
-  [props, ref] = useContextProps(props, ref, TabPanelsContext);
-  props = useDefaultProps(props, "TabPanels");
+  const [contextProps, contextRef] = useContextProps(
+    props,
+    ref,
+    TabPanelsContext
+  );
+  const finalProps = useDefaultProps(contextProps, "TabPanels");
   const {
     children,
     classNames: classNamesProp,
     shouldForceMount = false
-  } = props;
+  } = finalProps;
   const theme = useTheme();
   const classNames = useMemo(
     () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),
@@ -195,7 +203,7 @@ var TabPanels = forwardRef(function TabPanels2(props, ref) {
   return /* @__PURE__ */ jsx(Provider, { values, children: /* @__PURE__ */ jsx(
     "div",
     {
-      ref,
+      ref: contextRef,
       className: classNames?.panels?.container,
       style,
       "data-testid": TEST_IDS.panels.container,
@@ -212,14 +220,18 @@ var TabPanels = forwardRef(function TabPanels2(props, ref) {
 });
 var TabPanelContext = createContext(null);
 var TabPanel = forwardRef(function TabPanel2(props, ref) {
-  [props, ref] = useContextProps(props, ref, TabPanelContext);
-  props = useDefaultProps(props, "TabPanel");
+  const [contextProps, contextRef] = useContextProps(
+    props,
+    ref,
+    TabPanelContext
+  );
+  const finalProps = useDefaultProps(contextProps, "TabPanel");
   const {
     children: childrenProp,
     classNames: classNamesProp,
     shouldForceMount = false,
     ...rest
-  } = props;
+  } = finalProps;
   const theme = useTheme();
   const classNames = useMemo(
     () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),
@@ -247,7 +259,7 @@ var TabPanel = forwardRef(function TabPanel2(props, ref) {
     TabPanel$1,
     {
       ...rest,
-      ref,
+      ref: contextRef,
       className: classNames?.panel?.container,
       shouldForceMount,
       style,

package/dist/components/tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/tabs/index.tsx"],"names":["Tabs","RACTabs","TabList","RACTabList","Tab","RACTab","TabPanels","TabPanel","RACTabPanel"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  Children,\n  type ForwardedRef,\n  createContext,\n  forwardRef,\n  useCallback,\n  useMemo,\n} from 'react';\nimport {\n  type ContextValue,\n  Provider,\n  Tab as RACTab,\n  TabList as RACTabList,\n  TabPanel as RACTabPanel,\n  Tabs as RACTabs,\n  type SlotProps,\n} from 'react-aria-components';\nimport type { RequiredDeep } from 'type-fest';\nimport { useContextProps } from '../../hooks/use-context-props';\nimport { useDefaultProps } from '../../hooks/use-defaults';\nimport { usePropagatingPress } from '../../hooks/use-propagating-press';\nimport { useTheme } from '../../hooks/use-theme';\nimport { inlineVars } from '../../utils/css';\nimport { callRenderProps, mergeClassNames } from '../../utils/props';\nimport {\n  tabListStateVars,\n  tabPanelStateVars,\n  tabPanelsStateVars,\n  tabStateVars,\n  tabsClassNames,\n} from './tabs.css';\nimport type {\n  TabListProps,\n  TabPanelProps,\n  TabPanelRenderProps,\n  TabPanelsProps,\n  TabProps,\n  TabRenderProps,\n  TabsClassNames,\n  TabsProps,\n} from './types';\n\nexport const TEST_IDS: RequiredDeep<TabsClassNames> = {\n  tabs: 'tabs',\n  list: {\n    container: 'tabs.list.container',\n    list: 'tabs.list',\n  },\n  tab: {\n    container: 'tabs.tab.container',\n    tab: 'tabs.tab',\n  },\n  panels: {\n    container: 'tabs.panels.container',\n    panels: 'tabs.panels',\n  },\n  panel: {\n    container: 'tabs.panel.container',\n    panel: 'tabs.panel',\n  },\n};\n\nexport const TabsContext =\n  createContext<ContextValue<TabsProps, HTMLDivElement>>(null);\n\n/**\n * A required wrapper for other Tabs components, which manages\n * and provides the state context. Other Tabs components will\n * throw an error if not wrapped with this component\n *\n * NOTE: TabList & TabPanels do not have to be direct children\n * of this component. Additional layout can be introduced around\n * this components children\n */\nexport const Tabs = forwardRef(function Tabs(\n  props: TabsProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  [props, ref] = useContextProps(props, ref, TabsContext);\n  props = useDefaultProps(props, 'Tabs');\n\n  const { classNames: classNamesProp, ...rest } = props;\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),\n    [theme.Tabs, classNamesProp],\n  );\n\n  const values = useMemo<\n    [\n      [\n        typeof TabListContext,\n        ContextValue<TabListProps<unknown>, HTMLDivElement>,\n      ],\n      [typeof TabPanelsContext, ContextValue<TabPanelsProps, HTMLDivElement>],\n    ]\n  >(\n    () => [\n      [TabListContext, { classNames }],\n      [TabPanelsContext, { classNames }],\n    ],\n    [classNames],\n  );\n\n  return (\n    <Provider values={values}>\n      <RACTabs\n        {...rest}\n        ref={ref}\n        className={classNames?.tabs}\n        data-testid={TEST_IDS.tabs}\n      />\n    </Provider>\n  );\n});\n\nexport const TabListContext =\n  createContext<ContextValue<TabListProps<unknown>, HTMLDivElement>>(null);\n\n/**\n * Parent of Tab\n */\nexport const TabList = forwardRef(function TabList<T extends object>(\n  props: TabListProps<T>,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  [props, ref] = useContextProps(props, ref, TabListContext);\n  props = useDefaultProps(props, 'TabList');\n\n  const {\n    children,\n    classNames: classNamesProp,\n    anchor = 'end',\n    items,\n    orientation = 'horizontal',\n    size = 'lg',\n    variant = 'border',\n    align = orientation === 'horizontal' ? 'center' : 'start',\n    ...rest\n  } = props;\n\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),\n    [theme.Tabs, classNamesProp],\n  );\n\n  const values = useMemo<[[typeof TabContext, Omit<TabProps, 'id'>]]>(\n    () => [[TabContext, { classNames }]],\n    [classNames],\n  );\n\n  const style = useMemo(\n    () =>\n      inlineVars(tabListStateVars, {\n        align,\n        anchor,\n        count: items ? Array.from(items).length : Children.count(children),\n        orientation,\n        size,\n        variant,\n      }),\n    [align, anchor, items, children, orientation, size, variant],\n  );\n\n  return (\n    <Provider values={values}>\n      <div\n        className={classNames?.list?.container}\n        style={style}\n        data-testid={TEST_IDS.list.container}\n      >\n        <RACTabList<T>\n          {...rest}\n          ref={ref}\n          className={classNames?.list?.list}\n          items={items}\n          data-testid={TEST_IDS.list.list}\n        >\n          {children}\n        </RACTabList>\n      </div>\n    </Provider>\n  );\n});\n\nexport const TabContext =\n  createContext<ContextValue<Omit<TabProps & SlotProps, 'id'>, HTMLDivElement>>(\n    null,\n  );\n\n/**\n * Must be a direct child of TabList\n */\nexport const Tab = forwardRef(function Tab(\n  props: TabProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  [props, ref] = useContextProps(props, ref, TabContext);\n  props = useDefaultProps(props, 'Tab');\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    onPress,\n    onPressChange,\n    onPressEnd,\n    onPressStart,\n    onPressUp,\n    ...rest\n  } = props;\n\n  const { pressProps } = usePropagatingPress({\n    onPress,\n    onPressChange,\n    onPressEnd,\n    onPressStart,\n    onPressUp,\n  });\n\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),\n    [theme.Tabs, classNamesProp],\n  );\n\n  const style = useCallback(\n    (renderProps: TabRenderProps) => inlineVars(tabStateVars, renderProps),\n    [],\n  );\n\n  const children = useCallback(\n    (renderProps: TabRenderProps) => (\n      <div\n        {...pressProps}\n        className={classNames?.tab?.tab}\n        data-testid={TEST_IDS.tab.tab}\n      >\n        {callRenderProps(childrenProp, {\n          ...renderProps,\n          defaultChildren: null,\n        })}\n      </div>\n    ),\n    [pressProps, classNames?.tab?.tab, childrenProp],\n  );\n\n  return (\n    <RACTab\n      {...rest}\n      ref={ref}\n      className={classNames?.tab?.container}\n      style={style}\n      data-testid={TEST_IDS.tab.container}\n    >\n      {children}\n    </RACTab>\n  );\n});\n\nexport const TabPanelsContext =\n  createContext<ContextValue<TabPanelsProps, HTMLDivElement>>(null);\n\n/**\n * Parent of TabPanel, but only required if using shouldForceMount=true\n */\nexport const TabPanels = forwardRef(function TabPanels(\n  props: TabPanelsProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  [props, ref] = useContextProps(props, ref, TabPanelsContext);\n  props = useDefaultProps(props, 'TabPanels');\n\n  const {\n    children,\n    classNames: classNamesProp,\n    shouldForceMount = false,\n  } = props;\n\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),\n    [theme.Tabs, classNamesProp],\n  );\n\n  const style = useMemo(\n    () => inlineVars(tabPanelsStateVars, { shouldForceMount }),\n    [shouldForceMount],\n  );\n\n  const values = useMemo<\n    [\n      [\n        typeof TabPanelContext,\n        ContextValue<Omit<TabPanelProps, 'id'>, HTMLDivElement>,\n      ],\n    ]\n  >(\n    () => [[TabPanelContext, { classNames, shouldForceMount }]],\n    [classNames, shouldForceMount],\n  );\n\n  return (\n    <Provider values={values}>\n      <div\n        ref={ref}\n        className={classNames?.panels?.container}\n        style={style}\n        data-testid={TEST_IDS.panels.container}\n      >\n        <div\n          className={classNames?.panels?.panels}\n          data-testid={TEST_IDS.panels.panels}\n        >\n          {children}\n        </div>\n      </div>\n    </Provider>\n  );\n});\n\nexport const TabPanelContext =\n  createContext<ContextValue<Omit<TabPanelProps, 'id'>, HTMLDivElement>>(null);\n\n/**\n * Must be direct child of TabPanels if TabPanel implements shouldForceMount=true\n *\n * Othewise can be used anywhere inside of Tabs. TabPanels may be desirable to use\n * if theme implements any styles that adjust layout\n */\nexport const TabPanel = forwardRef(function TabPanel(\n  props: TabPanelProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  [props, ref] = useContextProps(props, ref, TabPanelContext);\n  props = useDefaultProps(props, 'TabPanel');\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    shouldForceMount = false,\n    ...rest\n  } = props;\n\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),\n    [theme.Tabs, classNamesProp],\n  );\n\n  const style = useCallback(\n    (renderProps: TabPanelRenderProps) =>\n      inlineVars(tabPanelStateVars, { ...renderProps, shouldForceMount }),\n    [shouldForceMount],\n  );\n\n  const children = useCallback(\n    (renderProps: TabPanelRenderProps) => (\n      <div\n        className={classNames?.panel?.panel}\n        data-testid={TEST_IDS.panel.panel}\n      >\n        {callRenderProps(childrenProp, {\n          ...renderProps,\n          defaultChildren: null,\n        })}\n      </div>\n    ),\n    [childrenProp, classNames?.panel?.panel],\n  );\n\n  return (\n    <RACTabPanel\n      {...rest}\n      ref={ref}\n      className={classNames?.panel?.container}\n      shouldForceMount={shouldForceMount}\n      style={style}\n      data-testid={TEST_IDS.panel.container}\n    >\n      {children}\n    </RACTabPanel>\n  );\n});\n"]}
+{"version":3,"sources":["../../../src/components/tabs/index.tsx"],"names":["Tabs","RACTabs","TabList","RACTabList","Tab","RACTab","TabPanels","TabPanel","RACTabPanel"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  Children,\n  createContext,\n  type ForwardedRef,\n  forwardRef,\n  useCallback,\n  useMemo,\n} from 'react';\nimport {\n  type ContextValue,\n  Provider,\n  Tab as RACTab,\n  TabList as RACTabList,\n  TabPanel as RACTabPanel,\n  Tabs as RACTabs,\n  type SlotProps,\n} from 'react-aria-components';\nimport { useContextProps } from '../../hooks/use-context-props';\nimport { useDefaultProps } from '../../hooks/use-defaults';\nimport { usePropagatingPress } from '../../hooks/use-propagating-press';\nimport { useTheme } from '../../hooks/use-theme';\nimport { inlineVars } from '../../utils/css';\nimport { callRenderProps, mergeClassNames } from '../../utils/props';\nimport {\n  tabListStateVars,\n  tabPanelStateVars,\n  tabPanelsStateVars,\n  tabStateVars,\n  tabsClassNames,\n} from './tabs.css';\nimport type { RequiredDeep } from 'type-fest';\nimport type {\n  TabListProps,\n  TabPanelProps,\n  TabPanelRenderProps,\n  TabPanelsProps,\n  TabProps,\n  TabRenderProps,\n  TabsClassNames,\n  TabsProps,\n} from './types';\n\nexport const TEST_IDS: RequiredDeep<TabsClassNames> = {\n  tabs: 'tabs',\n  list: {\n    container: 'tabs.list.container',\n    list: 'tabs.list',\n  },\n  tab: {\n    container: 'tabs.tab.container',\n    tab: 'tabs.tab',\n  },\n  panels: {\n    container: 'tabs.panels.container',\n    panels: 'tabs.panels',\n  },\n  panel: {\n    container: 'tabs.panel.container',\n    panel: 'tabs.panel',\n  },\n};\n\nexport const TabsContext =\n  createContext<ContextValue<TabsProps, HTMLDivElement>>(null);\n\n/**\n * A required wrapper for other Tabs components, which manages\n * and provides the state context. Other Tabs components will\n * throw an error if not wrapped with this component\n *\n * NOTE: TabList & TabPanels do not have to be direct children\n * of this component. Additional layout can be introduced around\n * this components children\n */\nexport const Tabs = forwardRef(function Tabs(\n  props: TabsProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const [contextProps, contextRef] = useContextProps(props, ref, TabsContext);\n  const finalProps = useDefaultProps(contextProps, 'Tabs');\n\n  const { classNames: classNamesProp, ...rest } = finalProps;\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),\n    [theme.Tabs, classNamesProp],\n  );\n\n  const values = useMemo<\n    [\n      [\n        typeof TabListContext,\n        ContextValue<TabListProps<unknown>, HTMLDivElement>,\n      ],\n      [typeof TabPanelsContext, ContextValue<TabPanelsProps, HTMLDivElement>],\n    ]\n  >(\n    () => [\n      [TabListContext, { classNames }],\n      [TabPanelsContext, { classNames }],\n    ],\n    [classNames],\n  );\n\n  return (\n    <Provider values={values}>\n      <RACTabs\n        {...rest}\n        ref={contextRef}\n        className={classNames?.tabs}\n        data-testid={TEST_IDS.tabs}\n      />\n    </Provider>\n  );\n});\n\nexport const TabListContext =\n  createContext<ContextValue<TabListProps<unknown>, HTMLDivElement>>(null);\n\n/**\n * Parent of Tab\n */\nexport const TabList = forwardRef(function TabList<T extends object>(\n  props: TabListProps<T>,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const [contextProps, contextRef] = useContextProps(\n    props,\n    ref,\n    TabListContext,\n  );\n  const finalProps = useDefaultProps(contextProps, 'TabList');\n\n  const {\n    children,\n    classNames: classNamesProp,\n    anchor = 'end',\n    items,\n    orientation = 'horizontal',\n    size = 'lg',\n    variant = 'border',\n    align = orientation === 'horizontal' ? 'center' : 'start',\n    ...rest\n  } = finalProps;\n\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),\n    [theme.Tabs, classNamesProp],\n  );\n\n  const values = useMemo<[[typeof TabContext, Omit<TabProps, 'id'>]]>(\n    () => [[TabContext, { classNames }]],\n    [classNames],\n  );\n\n  const style = useMemo(\n    () =>\n      inlineVars(tabListStateVars, {\n        align,\n        anchor,\n        count: items ? Array.from(items).length : Children.count(children),\n        orientation,\n        size,\n        variant,\n      }),\n    [align, anchor, items, children, orientation, size, variant],\n  );\n\n  return (\n    <Provider values={values}>\n      <div\n        className={classNames?.list?.container}\n        style={style}\n        data-testid={TEST_IDS.list.container}\n      >\n        <RACTabList<T>\n          {...rest}\n          ref={contextRef}\n          className={classNames?.list?.list}\n          items={items}\n          data-testid={TEST_IDS.list.list}\n        >\n          {children}\n        </RACTabList>\n      </div>\n    </Provider>\n  );\n});\n\nexport const TabContext =\n  createContext<ContextValue<Omit<TabProps & SlotProps, 'id'>, HTMLDivElement>>(\n    null,\n  );\n\n/**\n * Must be a direct child of TabList\n */\nexport const Tab = forwardRef(function Tab(\n  props: TabProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const [contextProps, contextRef] = useContextProps(props, ref, TabContext);\n  const finalProps = useDefaultProps(contextProps, 'Tab');\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    onPress,\n    onPressChange,\n    onPressEnd,\n    onPressStart,\n    onPressUp,\n    ...rest\n  } = finalProps;\n\n  const { pressProps } = usePropagatingPress({\n    onPress,\n    onPressChange,\n    onPressEnd,\n    onPressStart,\n    onPressUp,\n  });\n\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),\n    [theme.Tabs, classNamesProp],\n  );\n\n  const style = useCallback(\n    (renderProps: TabRenderProps) => inlineVars(tabStateVars, renderProps),\n    [],\n  );\n\n  const children = useCallback(\n    (renderProps: TabRenderProps) => (\n      <div\n        {...pressProps}\n        className={classNames?.tab?.tab}\n        data-testid={TEST_IDS.tab.tab}\n      >\n        {callRenderProps(childrenProp, {\n          ...renderProps,\n          defaultChildren: null,\n        })}\n      </div>\n    ),\n    [pressProps, classNames?.tab?.tab, childrenProp],\n  );\n\n  return (\n    <RACTab\n      {...rest}\n      ref={contextRef}\n      className={classNames?.tab?.container}\n      style={style}\n      data-testid={TEST_IDS.tab.container}\n    >\n      {children}\n    </RACTab>\n  );\n});\n\nexport const TabPanelsContext =\n  createContext<ContextValue<TabPanelsProps, HTMLDivElement>>(null);\n\n/**\n * Parent of TabPanel, but only required if using shouldForceMount=true\n */\nexport const TabPanels = forwardRef(function TabPanels(\n  props: TabPanelsProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const [contextProps, contextRef] = useContextProps(\n    props,\n    ref,\n    TabPanelsContext,\n  );\n  const finalProps = useDefaultProps(contextProps, 'TabPanels');\n\n  const {\n    children,\n    classNames: classNamesProp,\n    shouldForceMount = false,\n  } = finalProps;\n\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),\n    [theme.Tabs, classNamesProp],\n  );\n\n  const style = useMemo(\n    () => inlineVars(tabPanelsStateVars, { shouldForceMount }),\n    [shouldForceMount],\n  );\n\n  const values = useMemo<\n    [\n      [\n        typeof TabPanelContext,\n        ContextValue<Omit<TabPanelProps, 'id'>, HTMLDivElement>,\n      ],\n    ]\n  >(\n    () => [[TabPanelContext, { classNames, shouldForceMount }]],\n    [classNames, shouldForceMount],\n  );\n\n  return (\n    <Provider values={values}>\n      <div\n        ref={contextRef}\n        className={classNames?.panels?.container}\n        style={style}\n        data-testid={TEST_IDS.panels.container}\n      >\n        <div\n          className={classNames?.panels?.panels}\n          data-testid={TEST_IDS.panels.panels}\n        >\n          {children}\n        </div>\n      </div>\n    </Provider>\n  );\n});\n\nexport const TabPanelContext =\n  createContext<ContextValue<Omit<TabPanelProps, 'id'>, HTMLDivElement>>(null);\n\n/**\n * Must be direct child of TabPanels if TabPanel implements shouldForceMount=true\n *\n * Othewise can be used anywhere inside of Tabs. TabPanels may be desirable to use\n * if theme implements any styles that adjust layout\n */\nexport const TabPanel = forwardRef(function TabPanel(\n  props: TabPanelProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const [contextProps, contextRef] = useContextProps(\n    props,\n    ref,\n    TabPanelContext,\n  );\n  const finalProps = useDefaultProps(contextProps, 'TabPanel');\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    shouldForceMount = false,\n    ...rest\n  } = finalProps;\n\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(tabsClassNames, theme.Tabs, classNamesProp),\n    [theme.Tabs, classNamesProp],\n  );\n\n  const style = useCallback(\n    (renderProps: TabPanelRenderProps) =>\n      inlineVars(tabPanelStateVars, { ...renderProps, shouldForceMount }),\n    [shouldForceMount],\n  );\n\n  const children = useCallback(\n    (renderProps: TabPanelRenderProps) => (\n      <div\n        className={classNames?.panel?.panel}\n        data-testid={TEST_IDS.panel.panel}\n      >\n        {callRenderProps(childrenProp, {\n          ...renderProps,\n          defaultChildren: null,\n        })}\n      </div>\n    ),\n    [childrenProp, classNames?.panel?.panel],\n  );\n\n  return (\n    <RACTabPanel\n      {...rest}\n      ref={contextRef}\n      className={classNames?.panel?.container}\n      shouldForceMount={shouldForceMount}\n      style={style}\n      data-testid={TEST_IDS.panel.container}\n    >\n      {children}\n    </RACTabPanel>\n  );\n});\n"]}

package/dist/components/tabs/tabs.css.d.ts

@@ -12,45 +12,45 @@ declare const tabsContainers: {
     panel: string;
 };
 declare const tabColorVars: {
-    background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    border: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    background: `var(--${string})`;
+    border: `var(--${string})`;
+    color: `var(--${string})`;
 };
 declare const tabSpaceVars: {
     list: {
-        gap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        gap: `var(--${string})`;
+        x: `var(--${string})`;
+        y: `var(--${string})`;
     };
     tab: {
-        x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        x: `var(--${string})`;
+        y: `var(--${string})`;
     };
 };
 declare const tabListStateVars: {
-    align: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    anchor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    count: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    orientation: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    size: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    variant: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    align: `var(--${string})`;
+    anchor: `var(--${string})`;
+    count: `var(--${string})`;
+    orientation: `var(--${string})`;
+    size: `var(--${string})`;
+    variant: `var(--${string})`;
 };
 declare const tabStateVars: {
-    isHovered: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isSelected: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isFocused: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isFocusVisible: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isDisabled: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isHovered: `var(--${string})`;
+    isPressed: `var(--${string})`;
+    isSelected: `var(--${string})`;
+    isFocused: `var(--${string})`;
+    isFocusVisible: `var(--${string})`;
+    isDisabled: `var(--${string})`;
 };
 declare const tabPanelsStateVars: {
-    shouldForceMount: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    shouldForceMount: `var(--${string})`;
 };
 declare const tabPanelStateVars: {
-    shouldForceMount: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isFocused: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isFocusVisible: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isInert: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    shouldForceMount: `var(--${string})`;
+    isFocused: `var(--${string})`;
+    isFocusVisible: `var(--${string})`;
+    isInert: `var(--${string})`;
 };
 declare const tabsClassNames: TabsClassNames;
 

package/dist/components/text-field/index.d.ts

@@ -1,136 +1,11 @@
-import { TextFieldClassNames, TextFieldMapping, TextFieldSizes, TextFieldProps } from './types.js';
-import * as _react_types_shared from '@react-types/shared';
 import * as react from 'react';
-import { TextFieldRenderProps, ContextValue } from 'react-aria-components';
+import { ContextValue } from 'react-aria-components';
+import { TextFieldProps } from './types.js';
 import 'type-fest';
 import '../../types/generic.js';
 import '../input/types.js';
 
 declare const TextFieldContext: react.Context<ContextValue<TextFieldProps, HTMLDivElement>>;
-declare const TextField: (props: {
-    children?: react.ReactNode | ((values: TextFieldRenderProps & {
-        defaultChildren: react.ReactNode | undefined;
-    }) => react.ReactNode);
-    slot?: string | null | undefined;
-    defaultValue?: string | undefined;
-    autoFocus?: boolean | undefined;
-    dir?: string | undefined | undefined;
-    enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
-    hidden?: boolean | undefined | undefined;
-    id?: string | undefined;
-    lang?: string | undefined | undefined;
-    spellCheck?: string | undefined;
-    translate?: "yes" | "no" | undefined | undefined;
-    autoCorrect?: string | undefined;
-    inert?: boolean | undefined | undefined;
-    inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
-    'aria-activedescendant'?: string | undefined;
-    'aria-autocomplete'?: "none" | "inline" | "list" | "both" | undefined;
-    'aria-controls'?: string | undefined;
-    'aria-describedby'?: string | undefined;
-    'aria-details'?: string | undefined;
-    'aria-errormessage'?: string | undefined;
-    'aria-haspopup'?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
-    'aria-label'?: string | undefined;
-    'aria-labelledby'?: string | undefined;
-    onCopy?: react.ClipboardEventHandler<HTMLInputElement> | undefined;
-    onCut?: react.ClipboardEventHandler<HTMLInputElement> | undefined;
-    onPaste?: react.ClipboardEventHandler<HTMLInputElement> | undefined;
-    onCompositionEnd?: react.CompositionEventHandler<HTMLInputElement> | undefined;
-    onCompositionStart?: react.CompositionEventHandler<HTMLInputElement> | undefined;
-    onCompositionUpdate?: react.CompositionEventHandler<HTMLInputElement> | undefined;
-    onFocus?: ((e: react.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
-    onBlur?: ((e: react.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
-    onChange?: ((value: string) => void) | undefined;
-    onBeforeInput?: react.FormEventHandler<HTMLInputElement> | undefined;
-    onInput?: react.FormEventHandler<HTMLInputElement> | undefined;
-    onKeyDown?: ((e: _react_types_shared.KeyboardEvent) => void) | undefined;
-    onKeyUp?: ((e: _react_types_shared.KeyboardEvent) => void) | undefined;
-    onAuxClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onAuxClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onContextMenu?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onContextMenuCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onDoubleClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onDoubleClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseDown?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseDownCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseEnter?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseLeave?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseMove?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseMoveCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseOut?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseOutCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseOver?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseOverCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseUp?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseUpCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
-    onSelect?: react.ReactEventHandler<HTMLInputElement> | undefined;
-    onTouchCancel?: react.TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchCancelCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchEnd?: react.TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchEndCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchMove?: react.TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchMoveCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchStart?: react.TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchStartCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
-    onPointerDown?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerDownCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerMove?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerMoveCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerUp?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerUpCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerCancel?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerCancelCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerEnter?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerLeave?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerOver?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerOverCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerOut?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerOutCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onGotPointerCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onGotPointerCaptureCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onLostPointerCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onLostPointerCaptureCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
-    onScroll?: react.UIEventHandler<HTMLDivElement> | undefined;
-    onScrollCapture?: react.UIEventHandler<HTMLDivElement> | undefined;
-    onWheel?: react.WheelEventHandler<HTMLDivElement> | undefined;
-    onWheelCapture?: react.WheelEventHandler<HTMLDivElement> | undefined;
-    onAnimationStart?: react.AnimationEventHandler<HTMLDivElement> | undefined;
-    onAnimationStartCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
-    onAnimationEnd?: react.AnimationEventHandler<HTMLDivElement> | undefined;
-    onAnimationEndCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
-    onAnimationIteration?: react.AnimationEventHandler<HTMLDivElement> | undefined;
-    onAnimationIterationCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
-    onTransitionCancel?: react.TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionCancelCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionEnd?: react.TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionEndCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionRun?: react.TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionRunCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionStart?: react.TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionStartCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
-    form?: string | undefined;
-    value?: string | undefined;
-    type?: "text" | "search" | "url" | "tel" | "email" | "password" | (string & {}) | undefined;
-    pattern?: string | undefined;
-    isDisabled?: boolean | undefined;
-    onFocusChange?: ((isFocused: boolean) => void) | undefined;
-    name?: string | undefined;
-    excludeFromTabOrder?: boolean | undefined;
-    isReadOnly?: boolean | undefined;
-    isInvalid?: boolean | undefined;
-    isRequired?: boolean | undefined;
-    validationBehavior?: "native" | "aria" | undefined;
-    validate?: ((value: string) => _react_types_shared.ValidationError | true | null | undefined) | undefined;
-    autoComplete?: string | undefined;
-    maxLength?: number | undefined;
-    minLength?: number | undefined;
-} & {
-    classNames?: TextFieldClassNames;
-    mapping?: Partial<TextFieldMapping>;
-    size?: TextFieldSizes;
-} & react.RefAttributes<HTMLDivElement>) => react.ReactElement | null;
+declare const TextField: (props: TextFieldProps, ref: React.Ref<HTMLDivElement>) => React.ReactElement;
 
 export { TextField, TextFieldContext };

package/dist/components/text-field/index.js

@@ -1,5 +1,5 @@
 import '../../chunk-PZ5AY32C.js';
-import { createContext, forwardRef, useMemo, useCallback } from 'react';
+import { createContext, useMemo, useCallback } from 'react';
 import { LabelContext, Provider, TextField as TextField$1 } from 'react-aria-components';
 import { useContextProps } from '../../hooks/use-context-props/index.js';
 import { useDefaultProps } from '../../hooks/use-defaults/index.js';
@@ -24,16 +24,20 @@ var defaultMapping = {
 };
 var defaultSize = "lg";
 var TextFieldContext = createContext(null);
-var TextField = forwardRef(function TextField2(props, ref) {
-  [props, ref] = useContextProps(props, ref, TextFieldContext);
-  props = useDefaultProps(props, "TextField");
+var TextField = (props, ref) => {
+  const [contextProps, contextRef] = useContextProps(
+    props,
+    ref,
+    TextFieldContext
+  );
+  const finalProps = useDefaultProps(contextProps, "TextField");
   const {
     children: childrenProp,
     classNames: classNamesProp,
     mapping: mappingProp,
     size = defaultSize,
     ...rest
-  } = props;
+  } = finalProps;
   const theme = useTheme();
   const mapping = useMemo(
     () => ({
@@ -83,13 +87,13 @@ var TextField = forwardRef(function TextField2(props, ref) {
     TextField$1,
     {
       ...rest,
-      ref,
+      ref: contextRef,
       className: classNames?.container,
       style,
       children
     }
   );
-});
+};
 
 export { TextField, TextFieldContext };
 //# sourceMappingURL=index.js.map

package/dist/components/text-field/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/text-field/index.tsx"],"names":["TextField","RACTextField"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  type ForwardedRef,\n  createContext,\n  forwardRef,\n  useCallback,\n  useMemo,\n} from 'react';\nimport {\n  type ContextValue,\n  type FieldErrorProps,\n  LabelContext,\n  type LabelProps,\n  Provider,\n  TextField as RACTextField,\n  type TextFieldRenderProps,\n  type TextProps,\n} from 'react-aria-components';\nimport { useContextProps } from '../../hooks/use-context-props';\nimport { useDefaultProps } from '../../hooks/use-defaults';\nimport { useTheme } from '../../hooks/use-theme';\nimport { bodies } from '../../styles/typography.css';\nimport { inlineVars } from '../../utils/css';\nimport { callRenderProps, mergeClassNames } from '../../utils/props';\nimport {\n  AriaFieldErrorContext,\n  type AriaLabelContext,\n  AriaTextContext,\n} from '../aria';\nimport { InputContext } from '../input';\nimport type { InputProps } from '../input/types';\nimport { textFieldClassNames, textFieldStateVars } from './text-field.css';\nimport type { TextFieldMapping, TextFieldProps } from './types';\n\nconst defaultMapping: TextFieldMapping = {\n  description: {\n    sm: bodies.xs,\n    lg: bodies.xs,\n  },\n  error: {\n    sm: bodies.xs,\n    lg: bodies.xs,\n  },\n};\n\nconst defaultSize = 'lg';\n\nexport const TextFieldContext =\n  createContext<ContextValue<TextFieldProps, HTMLDivElement>>(null);\n\nexport const TextField = forwardRef(function TextField(\n  props: TextFieldProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  [props, ref] = useContextProps(props, ref, TextFieldContext);\n\n  props = useDefaultProps(props, 'TextField');\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    mapping: mappingProp,\n    size = defaultSize,\n    ...rest\n  } = props;\n\n  const theme = useTheme();\n\n  const mapping = useMemo(\n    () => ({\n      ...defaultMapping,\n      ...mappingProp,\n    }),\n    [mappingProp],\n  );\n\n  const classNames = useMemo(\n    () =>\n      mergeClassNames(textFieldClassNames, theme.TextField, classNamesProp, {\n        description: mapping.description[size],\n        error: mapping.error[size],\n      }),\n    [theme.TextField, classNamesProp, mapping, size],\n  );\n\n  const style = useCallback(\n    (renderProps: TextFieldRenderProps) =>\n      inlineVars(textFieldStateVars, {\n        ...renderProps,\n        size,\n      }),\n    [size],\n  );\n  const values = useMemo<\n    [\n      [typeof InputContext, ContextValue<InputProps, HTMLInputElement>],\n      [typeof AriaLabelContext, ContextValue<LabelProps, HTMLLabelElement>],\n      [typeof AriaTextContext, ContextValue<TextProps, HTMLElement>],\n      [\n        typeof AriaFieldErrorContext,\n        ContextValue<FieldErrorProps, HTMLElement>,\n      ],\n    ]\n  >(\n    () => [\n      [InputContext, { classNames: classNames?.input, size }],\n      [LabelContext, { className: classNames?.label }],\n      [\n        AriaTextContext,\n        {\n          slots: {\n            description: { className: classNames?.description },\n          },\n        },\n      ],\n      [AriaFieldErrorContext, { className: classNames?.error }],\n    ],\n    [classNames, size],\n  );\n\n  const children = useCallback(\n    (renderProps: TextFieldRenderProps) => (\n      <Provider values={values}>\n        <div className={classNames?.textField}>\n          {callRenderProps(childrenProp, {\n            ...renderProps,\n            defaultChildren: null,\n          })}\n        </div>\n      </Provider>\n    ),\n    [childrenProp, classNames?.textField, values],\n  );\n  return (\n    <RACTextField\n      {...rest}\n      ref={ref}\n      className={classNames?.container}\n      style={style}\n    >\n      {children}\n    </RACTextField>\n  );\n});\n"]}
+{"version":3,"sources":["../../../src/components/text-field/index.tsx"],"names":["RACTextField"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { createContext, useCallback, useMemo } from 'react';\nimport {\n  type ContextValue,\n  type FieldErrorProps,\n  LabelContext,\n  type LabelProps,\n  Provider,\n  TextField as RACTextField,\n  type TextFieldRenderProps,\n  type TextProps,\n} from 'react-aria-components';\nimport { useContextProps } from '../../hooks/use-context-props';\nimport { useDefaultProps } from '../../hooks/use-defaults';\nimport { useTheme } from '../../hooks/use-theme';\nimport { bodies } from '../../styles/typography.css';\nimport { inlineVars } from '../../utils/css';\nimport { callRenderProps, mergeClassNames } from '../../utils/props';\nimport {\n  AriaFieldErrorContext,\n  type AriaLabelContext,\n  AriaTextContext,\n} from '../aria';\nimport { InputContext } from '../input';\nimport { textFieldClassNames, textFieldStateVars } from './text-field.css';\nimport type { InputProps } from '../input/types';\nimport type { TextFieldMapping, TextFieldProps } from './types';\n\nconst defaultMapping: TextFieldMapping = {\n  description: {\n    sm: bodies.xs,\n    lg: bodies.xs,\n  },\n  error: {\n    sm: bodies.xs,\n    lg: bodies.xs,\n  },\n};\n\nconst defaultSize = 'lg';\n\nexport const TextFieldContext =\n  createContext<ContextValue<TextFieldProps, HTMLDivElement>>(null);\n\nexport const TextField = (\n  props: TextFieldProps,\n  ref: React.Ref<HTMLDivElement>,\n): React.ReactElement => {\n  const [contextProps, contextRef] = useContextProps(\n    props,\n    ref,\n    TextFieldContext,\n  );\n\n  const finalProps = useDefaultProps(contextProps, 'TextField');\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    mapping: mappingProp,\n    size = defaultSize,\n    ...rest\n  } = finalProps;\n\n  const theme = useTheme();\n\n  const mapping = useMemo(\n    () => ({\n      ...defaultMapping,\n      ...mappingProp,\n    }),\n    [mappingProp],\n  );\n\n  const classNames = useMemo(\n    () =>\n      mergeClassNames(textFieldClassNames, theme.TextField, classNamesProp, {\n        description: mapping.description[size],\n        error: mapping.error[size],\n      }),\n    [theme.TextField, classNamesProp, mapping, size],\n  );\n\n  const style = useCallback(\n    (renderProps: TextFieldRenderProps) =>\n      inlineVars(textFieldStateVars, {\n        ...renderProps,\n        size,\n      }),\n    [size],\n  );\n  const values = useMemo<\n    [\n      [typeof InputContext, ContextValue<InputProps, HTMLInputElement>],\n      [typeof AriaLabelContext, ContextValue<LabelProps, HTMLLabelElement>],\n      [typeof AriaTextContext, ContextValue<TextProps, HTMLElement>],\n      [\n        typeof AriaFieldErrorContext,\n        ContextValue<FieldErrorProps, HTMLElement>,\n      ],\n    ]\n  >(\n    () => [\n      [InputContext, { classNames: classNames?.input, size }],\n      [LabelContext, { className: classNames?.label }],\n      [\n        AriaTextContext,\n        {\n          slots: {\n            description: { className: classNames?.description },\n          },\n        },\n      ],\n      [AriaFieldErrorContext, { className: classNames?.error }],\n    ],\n    [classNames, size],\n  );\n\n  const children = useCallback(\n    (renderProps: TextFieldRenderProps) => (\n      <Provider values={values}>\n        <div className={classNames?.textField}>\n          {callRenderProps(childrenProp, {\n            ...renderProps,\n            defaultChildren: null,\n          })}\n        </div>\n      </Provider>\n    ),\n    [childrenProp, classNames?.textField, values],\n  );\n  return (\n    <RACTextField\n      {...rest}\n      ref={contextRef}\n      className={classNames?.container}\n      style={style}\n    >\n      {children}\n    </RACTextField>\n  );\n};\n"]}

package/dist/components/text-field/text-field.css.d.ts

@@ -7,21 +7,21 @@ import '../input/types.js';
 declare const textFieldContainer: string;
 declare const textFieldColorVars: {
     description: {
-        color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        color: `var(--${string})`;
     };
     error: {
-        color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        color: `var(--${string})`;
     };
 };
 declare const textFieldSpaceVars: {
-    gap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    gap: `var(--${string})`;
 };
 declare const textFieldStateVars: {
-    size: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isDisabled: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isInvalid: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isReadOnly: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-    isRequired: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    size: `var(--${string})`;
+    isDisabled: `var(--${string})`;
+    isInvalid: `var(--${string})`;
+    isReadOnly: `var(--${string})`;
+    isRequired: `var(--${string})`;
 };
 declare const textFieldClassNames: TextFieldClassNames;
 

package/dist/components/textarea/index.js

@@ -18,11 +18,19 @@ var defaultMapping = {
 };
 var TextAreaContext = createContext(null);
 var TextArea = forwardRef(function TextArea2(props, ref) {
-  [props, ref] = useContextProps(props, ref, TextAreaContext$1);
-  props.className = void 0;
-  props.style = void 0;
-  [props, ref] = useContextProps(props, ref, TextAreaContext);
-  props = useDefaultProps(props, "TextArea");
+  const [contextProps1, contextRef1] = useContextProps(
+    props,
+    ref,
+    TextAreaContext$1
+  );
+  contextProps1.className = void 0;
+  contextProps1.style = void 0;
+  const [contextProps2, contextRef2] = useContextProps(
+    contextProps1,
+    contextRef1,
+    TextAreaContext
+  );
+  const defaultProps = useDefaultProps(contextProps2, "TextArea");
   const {
     classNames: classNamesProp,
     defaultValue = "",
@@ -40,7 +48,7 @@ var TextArea = forwardRef(function TextArea2(props, ref) {
     onHoverEnd,
     "aria-invalid": ariaInvalid,
     ...rest
-  } = props;
+  } = defaultProps;
   const [value, setValue] = useControlledState(valueProp, defaultValue);
   const isInvalid = !!ariaInvalid && ariaInvalid !== "false";
   const isPlaceholder = !!placeholder && !value;
@@ -71,6 +79,7 @@ var TextArea = forwardRef(function TextArea2(props, ref) {
   );
   const mergedProps = useMemo(
     () => mergeProps(rest, focusProps, hoverProps),
+    // biome-ignore lint/correctness/useExhaustiveDependencies: TODO: Verify this dependency array is correct.
     [focusProps, hoverProps, rest]
   );
   const style = useMemo(
@@ -120,7 +129,7 @@ var TextArea = forwardRef(function TextArea2(props, ref) {
     {
       ...mergedProps,
       ...hoverProps,
-      ref,
+      ref: contextRef2,
       className: classNames?.textarea,
       contentEditable: !(isDisabled || isReadOnly),
       role: "textbox",