@accelint/design-toolkit 5.2.0 → 7.0.0

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

@@ -1,4 +1,4 @@
 'use client';
 
-import {jsx,jsxs}from'react/jsx-runtime';import'client-only';import {Search,Loop,CancelFill}from'@accelint/icons';import {createContext}from'react';import {useContextProps,SearchField,composeRenderProps,Input,Button}from'react-aria-components';import {Icon}from'../icon/index.js';import {SearchFieldStyles,SearchFieldStylesDefaults}from'./styles.js';const {field:I,input:g,search:L,loading:A,clear:B}=SearchFieldStyles(),c=createContext(null);function n({children:r,...a}){return jsx(c.Provider,{value:a,children:r})}n.displayName="SearchField.Provider";function d({ref:r,...a}){[a,r]=useContextProps(a,r??null,c);const{classNames:o,inputProps:p,isLoading:m=false,variant:i=SearchFieldStylesDefaults.variant,...h}=a;return jsx(Icon.Provider,{size:"small",children:jsxs(SearchField,{...h,ref:r,className:composeRenderProps(o?.field,l=>I({className:l,variant:i})),children:[jsx(Icon,{className:L({className:o?.search,variant:i}),children:jsx(Search,{})}),jsx(Input,{...p,className:composeRenderProps(o?.input,l=>g({className:l,variant:i})),type:"search"}),m?jsx(Icon,{className:A({className:o?.loading,variant:i}),children:jsx(Loop,{})}):jsx(Button,{className:composeRenderProps(o?.clear,l=>B({className:l,variant:i})),children:jsx(Icon,{children:jsx(CancelFill,{})})})]})})}d.displayName="SearchField",d.Provider=n;export{d as SearchField,c as SearchFieldContext};//# sourceMappingURL=index.js.map
+import {jsx,jsxs}from'react/jsx-runtime';import {Search,Loop,CancelFill}from'@accelint/icons';import'client-only';import {useContextProps,SearchField,composeRenderProps,Input,Button}from'react-aria-components';import {Icon}from'../icon/index.js';import {IconProvider}from'../icon/context.js';import {SearchFieldContext}from'./context.js';import {SearchFieldStyles,SearchFieldStylesDefaults}from'./styles.js';const{field:v,input:g,search:C,loading:x,clear:A}=SearchFieldStyles();function w({ref:s,...i}){[i,s]=useContextProps(i,s??null,SearchFieldContext);const{classNames:a,inputProps:t,isLoading:n=false,variant:r=SearchFieldStylesDefaults.variant,...m}=i;return jsx(IconProvider,{size:"small",children:jsxs(SearchField,{...m,ref:s,className:composeRenderProps(a?.field,o=>v({className:o,variant:r})),children:[jsx(Icon,{className:C({className:a?.search,variant:r}),children:jsx(Search,{})}),jsx(Input,{...t,className:composeRenderProps(a?.input,o=>g({className:o,variant:r})),type:"search"}),n?jsx(Icon,{className:x({className:a?.loading,variant:r}),children:jsx(Loop,{})}):jsx(Button,{className:composeRenderProps(a?.clear,o=>A({className:o,variant:r})),children:jsx(Icon,{children:jsx(CancelFill,{})})})]})})}export{w as SearchField};//# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/search-field/index.tsx"],"names":["input","SearchFieldContext","x","F","props","jsx","e","SearchFieldProvider","useContextProps","ref","N","inputProps","isLoading","variant","SearchFieldStylesDefaults","rest","C","Icon","t","v","composeRenderProps","classNames","className","field","search","Search","Input","u","y","loading","Loop","Button","S","clear","CancelFill","P","SearchField"],"mappings":"8VA6Be,MAAA,CAAAA,KAAO,CAAA,CAAA,CAAA,KAAQ,CAAA,CAAA,CAAA,MAAS,CAAA,CAAA,CAAA,OAA4B,CAAA,CAEtDC,CAAAA,KACmD,CAAA,CAAI,CAAA,CAEpEC,iBAAA,EAAA,CAAA,CAAA,CAAAC,aAAA,CAAA,IACE,EAAA,SACA,CAAA,CAAA,CAAGC,QAEH,CAAA,CAAA,CACEC,GAACJ,CAAmB,CAAA,CAAA,CAAA,OAASK,GAAA,CAAA,CAAA,CAAA,QAC1B,CAAA,CAAA,KACH,CAEJ,CACAC,CAAAA,QAAoB,CAAA,CAAA,CAAA,CAAA,CAAc,CAAA,CAAA,WAAA,CAAA,sBAsCJ,CAAA,SAAc,CAAqB,CAC/D,CAACH,GAAU,CAAA,CAAII,CAAAA,GAAuBC,CAAAA,CAAAA,CAAO,CAAA,CAAA,CAAA,CAAA,CAAMR,CAAkB,CAAAS,eAErE,CAAA,CAAA,CAAA,CAAA,EACE,IAAA,CAAA,CAAA,CAAA,CAAA,KACA,CAAA,UAAAC,CAAAA,CACA,CAAA,UAAAC,CAAY,CAAA,CAAA,SACZC,CAAAA,CAAUC,CAAAA,KAA0B,CAAA,OACpC,CAAA,CAAGC,CACLC,yBAAA,CAAIZ,OAEJ,CAAA,GACGa,CAAAA,CAAK,CAAA,CAAA,CAAA,OAASX,GAAA,CAAAY,IAAA,CAAA,QAAK,CAClB,CAAA,IAAA,CAAA,OAAC,CACE,QACD,CAAKT,IAAAA,CACLU,WAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAWC,CAAmBC,CAAAA,CAAAA,SAAoBC,CAChDC,kBAAAA,CAAM,CAAE,EAAA,KAAA,CAAA,CAAA,EAAAD,CAAW,CAAA,CAAA,SACrB,CAAA,CAEA,CAAA,OAAA,CAAA,CAAAjB,CAAAA,CAACY,CAAAA,CAAA,QAAK,CAAA,CAAAX,GAAWkB,CAAAA,IAAO,CAAE,CAAA,SAAWH,CAAAA,CAAAA,CAAY,CAAA,SAAQ,CAAA,CAAA,EAAA,MACvD,CAAA,OAAAhB,CAAAA,CAACoB,CAAAA,CAAA,CAAA,QAEFC,CAAApB,GACE,CAAAqB,MAAA,CAAGhB,EACJ,CAAA,CAAA,CAAA,CAAAL,GAAA,CAAAsB,KAAA,CAAA,CAAA,GAA8BP,CAAAA,CAAAA,SAAoBC,CAChDtB,kBAAAA,CAAM,CAAE,EAAA,KAAA,CAAA,CAAA,EAAAsB,CAAW,CAAA,CAAA,SACrB,CAAA,CACA,CAAA,OAAK,CAAA,CAAA,CAAA,CAAA,CAAA,CACP,IAEEjB,CAAAA,QACE,CAAA,CAAA,CAAA,CAAA,CAAAC,GAAWuB,CAAAA,IAAQ,CAAE,CAAA,SAAWR,CAAAA,CAAAA,CAAY,CAAA,SAAS,CAAA,CAAA,EAAA,OAErD,CAAA,OAAAhB,CAAAA,CAACyB,CAAAA,CAAA,CAAA,QAGFC,CAAAzB,GACC,CAAA0B,IAAA,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA1B,GAAWc,CAAAA,MAAmBC,CAAAA,CAAAA,SAAoBC,CAChDW,kBAAAA,CAAM,CAAE,EAAA,KAAA,CAAA,CAAA,EAAAX,CAAW,CAAA,CAAA,SACrB,CAAA,CAEA,CAAA,OAAA,CAAAjB,CAAAA,CAACY,CAAAA,CAAA,CACC,QAAA,CAAAZ,GAAAA,CAAC6B,IAAAA,CAAA,CAAA,QAIT,CAAA5B,GACF,CAEJ6B,UAEAC,CAAAA,EAAY,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAc,CAAA,CAAA,WAAA,CAC1BA,aAAuB7B,CAAAA,CAAAA,CAAAA,QAAAA,CAAAA,CAAAA","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'use client';\n\nimport 'client-only';\nimport { CancelFill, Loop, Search } from '@accelint/icons';\nimport { createContext } from 'react';\nimport {\n  SearchField as AriaSearchField,\n  Button,\n  type ContextValue,\n  composeRenderProps,\n  Input,\n  useContextProps,\n} from 'react-aria-components';\nimport { Icon } from '../icon';\nimport { SearchFieldStyles, SearchFieldStylesDefaults } from './styles';\nimport type { ProviderProps } from '@/lib/types';\nimport type { SearchFieldProps } from './types';\n\nconst { field, input, search, loading, clear } = SearchFieldStyles();\n\nexport const SearchFieldContext =\n  createContext<ContextValue<SearchFieldProps, HTMLDivElement>>(null);\n\nfunction SearchFieldProvider({\n  children,\n  ...props\n}: ProviderProps<SearchFieldProps>) {\n  return (\n    <SearchFieldContext.Provider value={props}>\n      {children}\n    </SearchFieldContext.Provider>\n  );\n}\nSearchFieldProvider.displayName = 'SearchField.Provider';\n\n/**\n * SearchField - A customizable search input component built on React Aria Components\n *\n * Provides a search input with integrated search icon, loading state, and clear functionality.\n * Supports two visual variants (filled/outlined), and granular styling control.\n *\n * @example\n * // Basic search field\n * <SearchField placeholder=\"Search...\" />\n *\n * @example\n * // Filled variant with custom styling\n * <SearchField\n *   variant=\"filled\"\n *   placeholder=\"Search products\"\n *   classNames={{\n *     input: \"bg-info-bold\",\n *     searchIcon: \"fg-accent-primary-bold\"\n *   }}\n * />\n *\n * @example\n * // With event handlers\n * <SearchField\n *   placeholder=\"Type to search\"\n *   onSubmit={(value) => console.log('Search:', value)}\n *   onChange={(value) => setQuery(value)}\n * />\n *\n * @example\n * // Using context provider for default props\n * <SearchField.Provider variant=\"filled\">\n *   <SearchField placeholder=\"Search 1\" />\n *   <SearchField placeholder=\"Search 2\" />\n * </SearchField.Provider>\n */\nexport function SearchField({ ref, ...props }: SearchFieldProps) {\n  [props, ref] = useContextProps(props, ref ?? null, SearchFieldContext);\n\n  const {\n    classNames,\n    inputProps,\n    isLoading = false,\n    variant = SearchFieldStylesDefaults.variant,\n    ...rest\n  } = props;\n\n  return (\n    <Icon.Provider size='small'>\n      <AriaSearchField\n        {...rest}\n        ref={ref}\n        className={composeRenderProps(classNames?.field, (className) =>\n          field({ className, variant }),\n        )}\n      >\n        <Icon className={search({ className: classNames?.search, variant })}>\n          <Search />\n        </Icon>\n        <Input\n          {...inputProps}\n          className={composeRenderProps(classNames?.input, (className) =>\n            input({ className, variant }),\n          )}\n          type='search'\n        />\n        {isLoading ? (\n          <Icon\n            className={loading({ className: classNames?.loading, variant })}\n          >\n            <Loop />\n          </Icon>\n        ) : (\n          <Button\n            className={composeRenderProps(classNames?.clear, (className) =>\n              clear({ className, variant }),\n            )}\n          >\n            <Icon>\n              <CancelFill />\n            </Icon>\n          </Button>\n        )}\n      </AriaSearchField>\n    </Icon.Provider>\n  );\n}\n\nSearchField.displayName = 'SearchField';\nSearchField.Provider = SearchFieldProvider;\n"]}
+{"version":3,"sources":["../../../src/components/search-field/index.tsx"],"names":["SearchFieldStyles","SearchField","ref","P","props","useContextProps","SearchFieldContext","F","classNames","I","y","e","N","jsxs","composeRenderProps","className","l","variant","c","jsx","Input","h","isLoading","Icon","Button","f","p"],"mappings":"wZA4BsB,KAAA,CAAA,KAAQ,CAAA,CAAA,CAAA,KAAS,SAAUA,EAAkB,CAAA,OA+B5D,CAAA,CAAA,CAASC,KAAc,CAAA,CAAAC,CAAAA,CAAKC,mBAAGC,CAAM,SAC3BC,CAAAA,CAAgBD,CAAAA,GAAOF,CAAO,CAAA,CAAA,GAAMI,CAAkB,CAAA,CAErE,KAAM,CACJ,CAAAC,eAAA,CAAA,CAAA,CAAA,CAAA,EAAA,IAAAC,CACAC,kBAAA,CAAA,CAAA,KAAA,CAAA,UACA,CAAA,CAAA,CAAA,UACA,CAAA,CAAA,CAAA,SAAoC,CAAA,CAAA,CAAA,KACpC,CAAA,OAGF,CAAA,CAAA,CAAAC,yBAAA,CAAA,WACqB,CAAA,CAAA,CAAA,CAAA,CAAA,OACjBC,GAAA,CAAAC,YAAA,CAAA,CAAAC,IAAC,CACE,OACD,CAAA,0BACWC,CAAAA,GAAmBN,CAAY,MAAQO,CAAAA,SACxC,CAAAC,kBAAA,CAAA,CAAA,EAAAD,KAAW,CAAA,CAAA,EAAA,CAAAE,CAAQ,CAAC,SAG9B,CAAA,CAAA,CAAA,OAAM,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,QAAoB,CAAA,CAAAN,GAAA,CAAAO,IAAA,CAAA,CAAA,SAAuB,CAAA,CAAQ,WAAS,CAChE,CAAA,EAAA,MAAAC,CAAAA,OACF,CAAA,CACAA,CAAAA,CAACC,CAAAA,QAEC,CAAAT,GAAA,CAAAU,MAAA,CAAA,EAAA,CAAA,CAAWP,CAAAA,CAAmBN,GAAAA,CAAAA,KAAY,CAAA,CAAA,GAAA,CAAQO,CAAAA,SACxC,CAAAC,kBAAA,CAAA,CAAA,EAAAD,KAAW,CAAA,CAAA,EAAA,CAAAE,CAAQ,CAAC,SAEzB,CAAA,CAAA,CAAA,OAENK,CAAAA,CACCH,CAAAA,CAACI,EAAA,IACC,CAAA,QAAmB,CAAE,CAAA,CAAA,CAAA,CAAAZ,GAAA,CAAAO,IAAA,CAAA,CAAA,YAAgC,CAAA,SAAS,CAAA,CAE9D,EAAA,OAAAC,CAAAA,OACF,CAAA,CAEAA,CAAAA,CAACK,CAAAA,iBACYV,CAAAA,EAAmBN,CAAAA,CAAY,CAAA,CAAAG,GAAA,CAAAc,MAAA,CAAQV,CAAAA,gCACxCA,KAAW,CAAA,CAAA,EAAA,CAAAE,CAAQ,CAAC,YAG9BE,OACE,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,QAAY,CACdR,GAAA,CACFO,IAAA,CAAA,CAEJ,QAGN,CAAAP,GAAA,CAAAe,UAAA,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA","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'use client';\n\nimport { CancelFill, Loop, Search } from '@accelint/icons';\nimport 'client-only';\nimport {\n  SearchField as AriaSearchField,\n  Button,\n  composeRenderProps,\n  Input,\n  useContextProps,\n} from 'react-aria-components';\nimport { Icon } from '../icon';\nimport { IconProvider } from '../icon/context';\nimport { SearchFieldContext } from './context';\nimport { SearchFieldStyles, SearchFieldStylesDefaults } from './styles';\nimport type { SearchFieldProps } from './types';\n\nconst { field, input, search, loading, clear } = SearchFieldStyles();\n\n/**\n * SearchField - A customizable search input component built on React Aria Components\n *\n * Provides a search input with integrated search icon, loading state, and clear functionality.\n * Supports two visual variants (filled/outlined), and granular styling control.\n *\n * @example\n * // Basic search field\n * <SearchField placeholder=\"Search...\" />\n *\n * @example\n * // Filled variant with custom styling\n * <SearchField\n *   variant=\"filled\"\n *   placeholder=\"Search products\"\n *   classNames={{\n *     input: \"bg-info-bold\",\n *     searchIcon: \"fg-accent-primary-bold\"\n *   }}\n * />\n *\n * @example\n * // With event handlers\n * <SearchField\n *   placeholder=\"Type to search\"\n *   onSubmit={(value) => console.log('Search:', value)}\n *   onChange={(value) => setQuery(value)}\n * />\n */\nexport function SearchField({ ref, ...props }: SearchFieldProps) {\n  [props, ref] = useContextProps(props, ref ?? null, SearchFieldContext);\n\n  const {\n    classNames,\n    inputProps,\n    isLoading = false,\n    variant = SearchFieldStylesDefaults.variant,\n    ...rest\n  } = props;\n\n  return (\n    <IconProvider size='small'>\n      <AriaSearchField\n        {...rest}\n        ref={ref}\n        className={composeRenderProps(classNames?.field, (className) =>\n          field({ className, variant }),\n        )}\n      >\n        <Icon className={search({ className: classNames?.search, variant })}>\n          <Search />\n        </Icon>\n        <Input\n          {...inputProps}\n          className={composeRenderProps(classNames?.input, (className) =>\n            input({ className, variant }),\n          )}\n          type='search'\n        />\n        {isLoading ? (\n          <Icon\n            className={loading({ className: classNames?.loading, variant })}\n          >\n            <Loop />\n          </Icon>\n        ) : (\n          <Button\n            className={composeRenderProps(classNames?.clear, (className) =>\n              clear({ className, variant }),\n            )}\n          >\n            <Icon>\n              <CancelFill />\n            </Icon>\n          </Button>\n        )}\n      </AriaSearchField>\n    </IconProvider>\n  );\n}\n"]}

package/dist/components/select-field/context.d.ts

@@ -0,0 +1,15 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import { ProviderProps } from '../../lib/types.js';
+import { ContextValue } from 'react-aria-components';
+import { SelectFieldProps } from './types.js';
+import '../button/types.js';
+import 'tailwind-variants';
+import '../button/styles.js';
+import 'tailwind-merge';
+import '../label/types.js';
+
+declare const SelectFieldContext: react.Context<ContextValue<SelectFieldProps, HTMLDivElement>>;
+declare function SelectFieldProvider({ children, ...props }: ProviderProps<SelectFieldProps>): react_jsx_runtime.JSX.Element;
+
+export { SelectFieldContext, SelectFieldProvider };

package/dist/components/select-field/context.js

@@ -0,0 +1,4 @@
+'use client';
+
+import {jsx}from'react/jsx-runtime';import'client-only';import {createContext}from'react';const r=createContext(null);function n({children:e,...t}){return jsx(r.Provider,{value:t,children:e})}export{r as SelectFieldContext,n as SelectFieldProvider};//# sourceMappingURL=context.js.map
+//# sourceMappingURL=context.js.map

package/dist/components/select-field/context.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/select-field/context.tsx"],"names":["SelectFieldContext","createContext","SelectFieldProvider","children","props","jsx"],"mappings":"0FAmBO,MAAMA,CAAAA,CACXC,aAAAA,CAA8D,IAAI,EAE7D,SAASC,CAAAA,CAAoB,CAClC,QAAA,CAAAC,CAAAA,CACA,GAAGC,CACL,CAAA,CAAoC,CAClC,OACEC,GAAAA,CAACL,CAAAA,CAAmB,QAAA,CAAnB,CAA4B,KAAA,CAAOI,CAAAA,CACjC,QAAA,CAAAD,EACH,CAEJ","file":"context.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'use client';\n\nimport type { ProviderProps } from '@/lib/types';\nimport 'client-only';\nimport { createContext } from 'react';\nimport type { ContextValue } from 'react-aria-components';\nimport type { SelectFieldProps } from './types';\n\nexport const SelectFieldContext =\n  createContext<ContextValue<SelectFieldProps, HTMLDivElement>>(null);\n\nexport function SelectFieldProvider({\n  children,\n  ...props\n}: ProviderProps<SelectFieldProps>) {\n  return (\n    <SelectFieldContext.Provider value={props}>\n      {children}\n    </SelectFieldContext.Provider>\n  );\n}\n"]}

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

@@ -1,19 +1,14 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as react from 'react';
-import { ContextValue } from 'react-aria-components';
-import { ProviderProps } from '../../lib/types.js';
 import { SelectFieldProps } from './types.js';
+import 'react';
+import 'react-aria-components';
 import '../button/types.js';
 import 'tailwind-variants';
+import '../../lib/types.js';
 import '../button/styles.js';
 import 'tailwind-merge';
 import '../label/types.js';
 
-declare const SelectFieldContext: react.Context<ContextValue<SelectFieldProps, HTMLDivElement>>;
-declare function SelectFieldProvider({ children, ...props }: ProviderProps<SelectFieldProps>): react_jsx_runtime.JSX.Element;
-declare namespace SelectFieldProvider {
-    var displayName: string;
-}
 /**
  * SelectField - A dropdown selection component with comprehensive form field features
  *
@@ -25,9 +20,9 @@ declare namespace SelectFieldProvider {
  * @example
  * // Basic select field
  * <SelectField label='Country' placeholder='Select a country'>
- *   <Options.Item textValue='us'>United States</Options.Item>
- *   <Options.Item textValue='ca'>Canada</Options.Item>
- *   <Options.Item textValue='uk'>United Kingdom</Options.Item>
+ *   <OptionsItem textValue='us'>United States</OptionsItem>
+ *   <OptionsItem textValue='ca'>Canada</OptionsItem>
+ *   <OptionsItem textValue='uk'>United Kingdom</OptionsItem>
  * </SelectField>
  *
  * @example
@@ -39,9 +34,9 @@ declare namespace SelectFieldProvider {
  *   isRequired
  *   isInvalid={!!errors.priority}
  * >
- *   <Options.Item textValue="low">Low</Options.Item>
- *   <Options.Item textValue="medium">Medium</Options.Item>
- *   <Options.Item textValue="high">High</Options.Item>
+ *   <OptionsItem textValue="low">Low</OptionsItem>
+ *   <OptionsItem textValue="medium">Medium</OptionsItem>
+ *   <OptionsItem textValue="high">High</OptionsItem>
  * </SelectField>
  *
  * @example
@@ -54,14 +49,10 @@ declare namespace SelectFieldProvider {
  *     trigger: "custom-trigger-styles"
  *   }}
  * >
- *   <Options.Item textValue="option1">Option 1</Options.Item>
- *   <Options.Item textValue="option2">Option 2</Options.Item>
+ *   <OptionsItem textValue="option1">Option 1</OptionsItem>
+ *   <OptionsItem textValue="option2">Option 2</OptionsItem>
  * </SelectField>
  */
 declare function SelectField({ ref, ...props }: SelectFieldProps): react_jsx_runtime.JSX.Element;
-declare namespace SelectField {
-    var displayName: string;
-    var Provider: typeof SelectFieldProvider;
-}
 
-export { SelectField, SelectFieldContext };
+export { SelectField };

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

@@ -1,4 +1,4 @@
 'use client';
 
-import {jsx,jsxs,Fragment}from'react/jsx-runtime';import'client-only';import V from'@accelint/icons/chevron-down';import {createContext}from'react';import {useContextProps,Select,composeRenderProps,SelectValue,Text,FieldError,Popover,Virtualizer,ListLayout}from'react-aria-components';import {Button}from'../button/index.js';import {Icon}from'../icon/index.js';import {Label}from'../label/index.js';import {Options}from'../options/index.js';import {SelectFieldStyles}from'./styles.js';const {description:k,error:G,trigger:J,label:d,field:K,value:Q}=SelectFieldStyles(),m=createContext(null);function u({children:o,...t}){return jsx(m.Provider,{value:t,children:o})}u.displayName="SelectField.Provider";function P({ref:o,...t}){[t,o]=useContextProps(t,o??null,m);const{size:i="medium",children:S,classNames:r,description:n,errorMessage:f,label:N,layoutOptions:F,isInvalid:y,...g}=t,c=f||null,p=i==="small",b=!p&&!!d;return jsx(Select,{...g,ref:o,className:composeRenderProps(r?.field,s=>K({className:s})),isInvalid:y||(c?true:void 0),"data-size":i,children:composeRenderProps(S,(s,{isRequired:x,isDisabled:C,isInvalid:L})=>jsxs(Fragment,{children:[b&&jsx(Label,{className:d({className:r?.label}),isRequired:x,isDisabled:C,children:N}),jsxs(Button,{className:composeRenderProps(r?.trigger,a=>J({className:a})),variant:"outline",size:i,children:[jsx(SelectValue,{className:Q({className:r?.value})}),jsx(Icon,{children:jsx(V,{className:"transform group-open/select-field:rotate-180"})})]}),!!n&&!(p||L)&&jsx(Text,{className:k({className:r?.description}),slot:"description",children:n}),jsx(FieldError,{className:composeRenderProps(r?.error,a=>G({className:a})),children:c}),jsx(Popover,{className:"min-w-(--trigger-width)",children:jsx(Virtualizer,{layout:ListLayout,layoutOptions:F,children:jsx(Options,{children:s})})})]}))})}P.displayName="SelectField",P.Provider=u;export{P as SelectField,m as SelectFieldContext};//# sourceMappingURL=index.js.map
+import {jsx,jsxs,Fragment}from'react/jsx-runtime';import I from'@accelint/icons/chevron-down';import'client-only';import {useContextProps,Select,composeRenderProps,SelectValue,Text,FieldError,Popover,Virtualizer,ListLayout}from'react-aria-components';import {Button}from'../button/index.js';import {Icon}from'../icon/index.js';import {Label}from'../label/index.js';import {Options}from'../options/index.js';import {SelectFieldContext}from'./context.js';import {SelectFieldStyles}from'./styles.js';const{description:T,error:q,trigger:k,label:G,field:H,value:J,popover:K}=SelectFieldStyles();function oe({ref:l,...t}){[t,l]=useContextProps(t,l??null,SelectFieldContext);const{size:i="medium",children:u,classNames:r,description:c,errorMessage:f,label:n,layoutOptions:v,isInvalid:N,...S}=t,m=f?.trim()??null,P=N??!!m,p=i==="small",b=!p&&!!n;return jsx(Select,{...S,ref:l,className:composeRenderProps(r?.field,a=>H({className:a})),isInvalid:P,"data-size":i,children:composeRenderProps(u,(a,{isRequired:g,isDisabled:y,isInvalid:F})=>jsxs(Fragment,{children:[b&&jsx(Label,{className:G({className:r?.label}),isRequired:g,isDisabled:y,children:n}),jsxs(Button,{className:composeRenderProps(r?.trigger,o=>k({className:o})),variant:"outline",size:i,children:[jsx(SelectValue,{className:J({className:r?.value})}),jsx(Icon,{children:jsx(I,{className:"transform group-open/select-field:rotate-180"})})]}),!!c&&!(p||F)&&jsx(Text,{className:T({className:r?.description}),slot:"description",children:c}),jsx(FieldError,{className:composeRenderProps(r?.error,o=>q({className:o})),children:m}),jsx(Popover,{className:composeRenderProps(r?.popover,o=>K({className:o})),children:jsx(Virtualizer,{layout:ListLayout,layoutOptions:v,children:jsx(Options,{children:a})})})]}))})}export{oe as SelectField};//# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/select-field/index.tsx"],"names":["SelectFieldStyles","createContext","children","props","H","z","jsx","SelectFieldProvider","e","SelectField","SelectFieldContext","D","classNames","errorMessageProp","errorMessage","showLabel","label","AriaSelect","rest","ref","composeRenderProps","className","I","isInvalidProp","size","isRequired","isDisabled","isInvalid","jsxs","Fragment","v","R","labelProp","Button","trigger","T","l","AriaSelectValue","value","Icon","h","ChevronDown","B","O","descriptionProp","error","w","AriaPopover","E","M","q"],"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'use client';\n\nimport 'client-only';\nimport ChevronDown from '@accelint/icons/chevron-down';\nimport { createContext } from 'react';\nimport {\n  Popover as AriaPopover,\n  Select as AriaSelect,\n  SelectValue as AriaSelectValue,\n  type ContextValue,\n  composeRenderProps,\n  FieldError,\n  ListLayout,\n  Text,\n  useContextProps,\n  Virtualizer,\n} from 'react-aria-components';\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport { Label } from '../label';\nimport { Options } from '../options';\nimport { SelectFieldStyles } from './styles';\nimport type { ProviderProps } from '@/lib/types';\nimport type { SelectFieldProps } from './types';\n\nconst { description, error, trigger, label, field, value } =\n  SelectFieldStyles();\n\nexport const SelectFieldContext =\n  createContext<ContextValue<SelectFieldProps, HTMLDivElement>>(null);\n\nfunction SelectFieldProvider({\n  children,\n  ...props\n}: ProviderProps<SelectFieldProps>) {\n  return (\n    <SelectFieldContext.Provider value={props}>\n      {children}\n    </SelectFieldContext.Provider>\n  );\n}\nSelectFieldProvider.displayName = 'SelectField.Provider';\n\n/**\n * SelectField - A dropdown selection component with comprehensive form field features\n *\n * Provides an accessible and feature-rich select dropdown with built-in validation,\n * multiple sizing options, virtualization support for large datasets, and seamless\n * integration with form libraries. Includes label, description, and error messaging\n * capabilities with customizable styling through className props.\n *\n * @example\n * // Basic select field\n * <SelectField label='Country' placeholder='Select a country'>\n *   <Options.Item textValue='us'>United States</Options.Item>\n *   <Options.Item textValue='ca'>Canada</Options.Item>\n *   <Options.Item textValue='uk'>United Kingdom</Options.Item>\n * </SelectField>\n *\n * @example\n * // Select field with validation and description\n * <SelectField\n *   label=\"Priority Level\"\n *   description=\"Choose the urgency level for this task\"\n *   errorMessage={errors.priority}\n *   isRequired\n *   isInvalid={!!errors.priority}\n * >\n *   <Options.Item textValue=\"low\">Low</Options.Item>\n *   <Options.Item textValue=\"medium\">Medium</Options.Item>\n *   <Options.Item textValue=\"high\">High</Options.Item>\n * </SelectField>\n *\n * @example\n * // Small size select field with custom styling\n * <SelectField\n *   size=\"small\"\n *   placeholder=\"Quick select\"\n *   classNames={{\n *     field: \"custom-field-styles\",\n *     trigger: \"custom-trigger-styles\"\n *   }}\n * >\n *   <Options.Item textValue=\"option1\">Option 1</Options.Item>\n *   <Options.Item textValue=\"option2\">Option 2</Options.Item>\n * </SelectField>\n */\nexport function SelectField({ ref, ...props }: SelectFieldProps) {\n  [props, ref] = useContextProps(props, ref ?? null, SelectFieldContext);\n\n  const {\n    size = 'medium',\n    children,\n    classNames,\n    description: descriptionProp,\n    errorMessage: errorMessageProp,\n    label: labelProp,\n    layoutOptions,\n    isInvalid: isInvalidProp,\n    ...rest\n  } = props;\n  const errorMessage = errorMessageProp || null; // Protect against empty string\n  const isSmall = size === 'small';\n  const showLabel = !isSmall && !!label;\n\n  return (\n    <AriaSelect\n      {...rest}\n      ref={ref}\n      className={composeRenderProps(classNames?.field, (className) =>\n        field({ className }),\n      )}\n      isInvalid={isInvalidProp || (errorMessage ? true : undefined)}\n      data-size={size}\n    >\n      {composeRenderProps(\n        children,\n        (children, { isRequired, isDisabled, isInvalid }) => (\n          <>\n            {showLabel && (\n              <Label\n                className={label({ className: classNames?.label })}\n                isRequired={isRequired}\n                isDisabled={isDisabled}\n              >\n                {labelProp}\n              </Label>\n            )}\n            <Button\n              className={composeRenderProps(classNames?.trigger, (className) =>\n                trigger({ className }),\n              )}\n              variant='outline'\n              size={size}\n            >\n              <AriaSelectValue\n                className={value({ className: classNames?.value })}\n              />\n              <Icon>\n                <ChevronDown className='transform group-open/select-field:rotate-180' />\n              </Icon>\n            </Button>\n            {!!descriptionProp && !(isSmall || isInvalid) && (\n              <Text\n                className={description({ className: classNames?.description })}\n                slot='description'\n              >\n                {descriptionProp}\n              </Text>\n            )}\n            <FieldError\n              className={composeRenderProps(classNames?.error, (className) =>\n                error({ className }),\n              )}\n            >\n              {errorMessage}\n            </FieldError>\n            <AriaPopover className='min-w-(--trigger-width)'>\n              <Virtualizer layout={ListLayout} layoutOptions={layoutOptions}>\n                <Options>{children}</Options>\n              </Virtualizer>\n            </AriaPopover>\n          </>\n        ),\n      )}\n    </AriaSelect>\n  );\n}\nSelectField.displayName = 'SelectField';\nSelectField.Provider = SelectFieldProvider;\n"]}
+{"version":3,"sources":["../../../src/components/select-field/index.tsx"],"names":["field","SelectFieldStyles","SelectField","ref","props","useContextProps","SelectFieldContext","size","children","O","classNames","descriptionProp","labelProp","errorMessage","errorMessageProp","isSmall","jsx","AriaSelect","rest","className","e","z","s","jsxs","Fragment","showLabel","Label","label","Q","isRequired","isDisabled","trigger","d","C","A","M","E","FieldError","composeRenderProps","L","AriaPopover","popover","h","V","x","B"],"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'use client';\n\nimport ChevronDown from '@accelint/icons/chevron-down';\nimport 'client-only';\nimport {\n  Popover as AriaPopover,\n  Select as AriaSelect,\n  SelectValue as AriaSelectValue,\n  composeRenderProps,\n  FieldError,\n  ListLayout,\n  Text,\n  useContextProps,\n  Virtualizer,\n} from 'react-aria-components';\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport { Label } from '../label';\nimport { Options } from '../options';\nimport { SelectFieldContext } from './context';\nimport { SelectFieldStyles } from './styles';\nimport type { SelectFieldProps } from './types';\n\nconst { description, error, trigger, label, field, value, popover } =\n  SelectFieldStyles();\n\n/**\n * SelectField - A dropdown selection component with comprehensive form field features\n *\n * Provides an accessible and feature-rich select dropdown with built-in validation,\n * multiple sizing options, virtualization support for large datasets, and seamless\n * integration with form libraries. Includes label, description, and error messaging\n * capabilities with customizable styling through className props.\n *\n * @example\n * // Basic select field\n * <SelectField label='Country' placeholder='Select a country'>\n *   <OptionsItem textValue='us'>United States</OptionsItem>\n *   <OptionsItem textValue='ca'>Canada</OptionsItem>\n *   <OptionsItem textValue='uk'>United Kingdom</OptionsItem>\n * </SelectField>\n *\n * @example\n * // Select field with validation and description\n * <SelectField\n *   label=\"Priority Level\"\n *   description=\"Choose the urgency level for this task\"\n *   errorMessage={errors.priority}\n *   isRequired\n *   isInvalid={!!errors.priority}\n * >\n *   <OptionsItem textValue=\"low\">Low</OptionsItem>\n *   <OptionsItem textValue=\"medium\">Medium</OptionsItem>\n *   <OptionsItem textValue=\"high\">High</OptionsItem>\n * </SelectField>\n *\n * @example\n * // Small size select field with custom styling\n * <SelectField\n *   size=\"small\"\n *   placeholder=\"Quick select\"\n *   classNames={{\n *     field: \"custom-field-styles\",\n *     trigger: \"custom-trigger-styles\"\n *   }}\n * >\n *   <OptionsItem textValue=\"option1\">Option 1</OptionsItem>\n *   <OptionsItem textValue=\"option2\">Option 2</OptionsItem>\n * </SelectField>\n */\nexport function SelectField({ ref, ...props }: SelectFieldProps) {\n  [props, ref] = useContextProps(props, ref ?? null, SelectFieldContext);\n\n  const {\n    size = 'medium',\n    children,\n    classNames,\n    description: descriptionProp,\n    errorMessage: errorMessageProp,\n    label: labelProp,\n    layoutOptions,\n    isInvalid: isInvalidProp,\n    ...rest\n  } = props;\n\n  const errorMessage = errorMessageProp?.trim() ?? null;\n  const hasError = !!errorMessage;\n  const isInvalid = isInvalidProp ?? hasError;\n  const isSmall = size === 'small';\n  const showLabel = !isSmall && !!labelProp;\n\n  return (\n    <AriaSelect\n      {...rest}\n      ref={ref}\n      className={composeRenderProps(classNames?.field, (className) =>\n        field({ className }),\n      )}\n      isInvalid={isInvalid}\n      data-size={size}\n    >\n      {composeRenderProps(\n        children,\n        (children, { isRequired, isDisabled, isInvalid }) => (\n          <>\n            {showLabel && (\n              <Label\n                className={label({ className: classNames?.label })}\n                isRequired={isRequired}\n                isDisabled={isDisabled}\n              >\n                {labelProp}\n              </Label>\n            )}\n            <Button\n              className={composeRenderProps(classNames?.trigger, (className) =>\n                trigger({ className }),\n              )}\n              variant='outline'\n              size={size}\n            >\n              <AriaSelectValue\n                className={value({ className: classNames?.value })}\n              />\n              <Icon>\n                <ChevronDown className='transform group-open/select-field:rotate-180' />\n              </Icon>\n            </Button>\n            {!!descriptionProp && !(isSmall || isInvalid) && (\n              <Text\n                className={description({ className: classNames?.description })}\n                slot='description'\n              >\n                {descriptionProp}\n              </Text>\n            )}\n            <FieldError\n              className={composeRenderProps(classNames?.error, (className) =>\n                error({ className }),\n              )}\n            >\n              {errorMessage}\n            </FieldError>\n            <AriaPopover\n              className={composeRenderProps(classNames?.popover, (className) =>\n                popover({ className }),\n              )}\n            >\n              <Virtualizer layout={ListLayout} layoutOptions={layoutOptions}>\n                <Options>{children}</Options>\n              </Virtualizer>\n            </AriaPopover>\n          </>\n        ),\n      )}\n    </AriaSelect>\n  );\n}\n"]}

package/dist/components/select-field/styles.d.ts

@@ -5,9 +5,10 @@ declare const SelectFieldStyles: tailwind_variants.TVReturnType<{
     [key: string]: {
         [key: string]: tailwind_merge.ClassNameValue | {
             description?: tailwind_merge.ClassNameValue;
+            trigger?: tailwind_merge.ClassNameValue;
             label?: tailwind_merge.ClassNameValue;
+            popover?: tailwind_merge.ClassNameValue;
             value?: tailwind_merge.ClassNameValue;
-            trigger?: tailwind_merge.ClassNameValue;
             field?: tailwind_merge.ClassNameValue;
             error?: tailwind_merge.ClassNameValue;
         };
@@ -16,9 +17,10 @@ declare const SelectFieldStyles: tailwind_variants.TVReturnType<{
     [x: string]: {
         [x: string]: tailwind_merge.ClassNameValue | {
             description?: tailwind_merge.ClassNameValue;
+            trigger?: tailwind_merge.ClassNameValue;
             label?: tailwind_merge.ClassNameValue;
+            popover?: tailwind_merge.ClassNameValue;
             value?: tailwind_merge.ClassNameValue;
-            trigger?: tailwind_merge.ClassNameValue;
             field?: tailwind_merge.ClassNameValue;
             error?: tailwind_merge.ClassNameValue;
         };
@@ -30,13 +32,15 @@ declare const SelectFieldStyles: tailwind_variants.TVReturnType<{
     description: string;
     error: string;
     value: string[];
+    popover: string;
 }, undefined, {
     [key: string]: {
         [key: string]: tailwind_merge.ClassNameValue | {
             description?: tailwind_merge.ClassNameValue;
+            trigger?: tailwind_merge.ClassNameValue;
             label?: tailwind_merge.ClassNameValue;
+            popover?: tailwind_merge.ClassNameValue;
             value?: tailwind_merge.ClassNameValue;
-            trigger?: tailwind_merge.ClassNameValue;
             field?: tailwind_merge.ClassNameValue;
             error?: tailwind_merge.ClassNameValue;
         };
@@ -48,6 +52,7 @@ declare const SelectFieldStyles: tailwind_variants.TVReturnType<{
     description: string;
     error: string;
     value: string[];
+    popover: string;
 }, tailwind_variants.TVReturnType<unknown, {
     field: string;
     trigger: string[];
@@ -55,6 +60,7 @@ declare const SelectFieldStyles: tailwind_variants.TVReturnType<{
     description: string;
     error: string;
     value: string[];
+    popover: string;
 }, undefined, unknown, unknown>>;
 
 export { SelectFieldStyles };

package/dist/components/select-field/styles.js

@@ -1,2 +1,2 @@
-import {tv}from'./../../lib/utils.js';const s=tv({slots:{field:"group/select-field",trigger:["justify-between","size-medium:py-xs group-size-medium/select-field:min-w-[220px]","group-size-small/select-field:fit-content size-small:py-xxs","group-invalid/select-field:enabled:outline-serious-bold","group-focus-visible/select-field:enabled:outline-accent-primary-bold"],label:"",description:"fg-primary-muted group-disabled/select-field:fg-disabled text-body-xs",error:"fg-serious-bold text-body-xs",value:["flex grow items-center font-display","group-size-small/select-field:gap-xs group-size-small/select-field:text-body-xs","group-size-medium/select-field:gap-s group-size-medium/select-field:text-body-s"]}});export{s as SelectFieldStyles};//# sourceMappingURL=styles.js.map
+import {tv}from'./../../lib/utils.js';const l=tv({slots:{field:"group/select-field",trigger:["justify-between","size-medium:min-w-[220px] size-medium:py-xs","group-size-small/select-field:fit-content size-small:py-xxs","group-invalid/select-field:enabled:outline-serious-bold","group-focus-visible/select-field:enabled:outline-accent-primary-bold","enabled:hover:color-mono-muted:bg-transparent enabled:hover:color-mono-muted:outline-1","enabled:focus-visible:color-mono-muted:bg-transparent enabled:focus-visible:color-mono-muted:outline-1","enabled:pressed:color-mono-muted:bg-transparent enabled:pressed:color-mono-muted:outline-1 enabled:pressed:color-mono-muted:outline-accent-primary-bold"],label:"",description:"fg-primary-muted group-disabled/select-field:fg-disabled text-body-xs",error:"fg-serious-bold text-body-xs",value:["flex grow items-center font-display","group-size-small/select-field:gap-xs group-size-small/select-field:text-body-xs","group-size-medium/select-field:gap-s group-size-medium/select-field:text-body-s"],popover:"min-w-(--trigger-width)"}});export{l as SelectFieldStyles};//# sourceMappingURL=styles.js.map
 //# sourceMappingURL=styles.js.map

package/dist/components/select-field/styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/select-field/styles.ts"],"names":["e"],"mappings":"sCAeE,MAAA,CAAO,CACLA,EAAA,CAAA,CAAA,KAAO,CAAA,CAAA,KAAA,CAAA,oBAEL,2BACA,CAAA,gEACA,CAAA,6DACA,CAAA,yDACA,CAAA,sEAEK,CACP,CAAA,KAAA,CAAA,EAAA,CAAA,mFAEO,CAAA,KAAA,CAAA,8BAEL,CAAA,KAAA,CAAA,CAAA,qCACA,CAAA,iFACA,CAAA,iFAGL,CAAA,CAAA,CAAA","file":"styles.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 { tv } from '@/lib/utils';\n\nexport const SelectFieldStyles = tv({\n  slots: {\n    field: 'group/select-field',\n    trigger: [\n      'justify-between',\n      'size-medium:py-xs group-size-medium/select-field:min-w-[220px]',\n      'group-size-small/select-field:fit-content size-small:py-xxs',\n      'group-invalid/select-field:enabled:outline-serious-bold',\n      'group-focus-visible/select-field:enabled:outline-accent-primary-bold',\n    ],\n    label: '',\n    description:\n      'fg-primary-muted group-disabled/select-field:fg-disabled text-body-xs',\n    error: 'fg-serious-bold text-body-xs',\n    value: [\n      'flex grow items-center font-display',\n      'group-size-small/select-field:gap-xs group-size-small/select-field:text-body-xs',\n      'group-size-medium/select-field:gap-s group-size-medium/select-field:text-body-s',\n    ],\n  },\n});\n"]}
+{"version":3,"sources":["../../../src/components/select-field/styles.ts"],"names":["e"],"mappings":"sCAeE,MAAA,CAAO,CACLA,EAAA,CAAA,CAAA,iCAEE,CAAA,OAAA,CAAA,CAAA,iBACA,CAAA,2GAEA,CAAA,yDACA,CAAA,sEACA,CAAA,wFACA,CAAA,kQAGK,CACP,CAAA,KAAA,CAAA,EAAA,CAAA,mFAEO,CAAA,KAAA,CAAA,2EAGL,CAAA,iFACA,CAAA,iFAEO,CAAA,CAAA,OAAA,CAAA,yBAEZ,CAAA,CAAA","file":"styles.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 { tv } from '@/lib/utils';\n\nexport const SelectFieldStyles = tv({\n  slots: {\n    field: 'group/select-field',\n    trigger: [\n      'justify-between',\n      'size-medium:min-w-[220px] size-medium:py-xs',\n      'group-size-small/select-field:fit-content size-small:py-xxs',\n      'group-invalid/select-field:enabled:outline-serious-bold',\n      'group-focus-visible/select-field:enabled:outline-accent-primary-bold',\n      'enabled:hover:color-mono-muted:bg-transparent enabled:hover:color-mono-muted:outline-1',\n      'enabled:focus-visible:color-mono-muted:bg-transparent enabled:focus-visible:color-mono-muted:outline-1',\n      'enabled:pressed:color-mono-muted:bg-transparent enabled:pressed:color-mono-muted:outline-1 enabled:pressed:color-mono-muted:outline-accent-primary-bold',\n    ],\n    label: '',\n    description:\n      'fg-primary-muted group-disabled/select-field:fg-disabled text-body-xs',\n    error: 'fg-serious-bold text-body-xs',\n    value: [\n      'flex grow items-center font-display',\n      'group-size-small/select-field:gap-xs group-size-small/select-field:text-body-xs',\n      'group-size-medium/select-field:gap-s group-size-medium/select-field:text-body-s',\n    ],\n    popover: 'min-w-(--trigger-width)',\n  },\n});\n"]}

package/dist/components/select-field/types.d.ts

@@ -1,5 +1,5 @@
 import { RefAttributes } from 'react';
-import { SelectProps, VirtualizerProps, ListLayoutOptions, FieldErrorProps } from 'react-aria-components';
+import { SelectProps, VirtualizerProps, ListLayoutOptions, FieldErrorProps, PopoverProps } from 'react-aria-components';
 import { ButtonProps } from '../button/types.js';
 import { LabelProps } from '../label/types.js';
 import 'tailwind-variants';
@@ -15,8 +15,8 @@ type SelectFieldProps = Omit<SelectProps, 'className'> & Pick<VirtualizerProps<L
         label?: LabelProps['className'];
         trigger?: ButtonProps['className'];
         value?: string;
+        popover?: PopoverProps['className'];
     };
-} & {
     label?: string;
     description?: string;
     errorMessage?: string;

package/dist/components/sidenav/avatar.d.ts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { SidenavAvatarProps } from './types.js';
+import '@accelint/bus';
+import '@accelint/core';
+import 'react';
+import 'react-aria-components';
+import './events.js';
+
+/**
+ * SidenavAvatar - Avatar component for sidenav
+ *
+ * Provides an avatar container with proper styling for the sidenav
+ */
+declare function SidenavAvatar({ children, className, ...rest }: SidenavAvatarProps): react_jsx_runtime.JSX.Element;
+
+export { SidenavAvatar };

package/dist/components/sidenav/avatar.js

@@ -0,0 +1,4 @@
+'use client';
+
+import {jsx}from'react/jsx-runtime';import'client-only';import {Provider,HeadingContext,TextContext}from'react-aria-components';import {AvatarContext}from'../avatar/context.js';import {IconContext}from'../icon/context.js';import {SidenavStyles}from'./styles.js';const{avatar:p,avatarHeading:d,avatarIcon:a,avatarText:N,transient:t}=SidenavStyles();function P({children:r,className:o,...s}){return jsx(Provider,{values:[[IconContext,{size:"large",className:a()}],[HeadingContext,{className:d({className:t()})}],[TextContext,{className:N({className:t()})}],[AvatarContext,{classNames:{avatar:a()}}]],children:jsx("div",{...s,className:p({className:o}),children:r})})}export{P as SidenavAvatar};//# sourceMappingURL=avatar.js.map
+//# sourceMappingURL=avatar.js.map

package/dist/components/sidenav/avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/sidenav/avatar.tsx"],"names":["avatarIcon","avatarText","transient","l","SidenavAvatar","children","className","jsx","Provider","e","IconContext","c","i","avatarHeading","v","m","rest","avatar"],"mappings":"sQAoBQ,4BAAuB,CAAA,CAAAA,CAAAA,UAAY,CAAA,CAAAC,CAAAA,UAAY,CAAAC,CAAU,CAAA,SAQ1D,CAAA,CAAA,CAAA,CAAAC,aAASC,EAAc,CAC5B,SAAAC,CAAAA,CACA,CAAA,QAAA,CAAAC,CAAAA,CACA,SAEA,CAAA,CAAA,CAAA,GACEC,CAACC,CAAAA,CAAA,CACC,OAAQC,GACN,CAACC,QAAAA,CAAa,CAAE,MAAM,CAAA,CAAA,CAAAC,WAAA,CAAA,CAAA,IAAS,CAAA,OAAWX,CAAW,SAGjD,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA,CAAAY,cAAWC,CAAAA,CAAc,SAAE,CAAA,CAAWX,CAAAA,CAAU,SAEtC,CAAE,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAAY,WAAWb,CAAAA,CAAW,SAAE,CAAA,CAAWC,CAAAA,CAAU,SAC7C,CAAE,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAAa,aAAA,CAAY,CAAE,UAAqB,CAAE,CAAC,MAG1D,CAAA,CAAA,EAAA,CAAA,CAAAR,CAAAA,CAAC,CAAA,QAAK,CAAGS,GAAAA,CAAM,KAAA,CAAA,CAAA,GAAWC,CAAAA,CAAO,SAAE,CAAA,CAAAX,CAAU,CAAC,SAC3C,CAAA,CAAAD,CAAAA,CACH,CAAA,QAGN,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA","file":"avatar.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'use client';\n\nimport 'client-only';\nimport { HeadingContext, Provider, TextContext } from 'react-aria-components';\nimport { AvatarContext } from '../avatar/context';\nimport { IconContext } from '../icon/context';\nimport { SidenavStyles } from './styles';\nimport type { SidenavAvatarProps } from './types';\n\nconst { avatar, avatarHeading, avatarIcon, avatarText, transient } =\n  SidenavStyles();\n\n/**\n * SidenavAvatar - Avatar component for sidenav\n *\n * Provides an avatar container with proper styling for the sidenav\n */\nexport function SidenavAvatar({\n  children,\n  className,\n  ...rest\n}: SidenavAvatarProps) {\n  return (\n    <Provider\n      values={[\n        [IconContext, { size: 'large', className: avatarIcon() }],\n        [\n          HeadingContext,\n          { className: avatarHeading({ className: transient() }) },\n        ],\n        [TextContext, { className: avatarText({ className: transient() }) }],\n        [AvatarContext, { classNames: { avatar: avatarIcon() } }],\n      ]}\n    >\n      <div {...rest} className={avatar({ className })}>\n        {children}\n      </div>\n    </Provider>\n  );\n}\n"]}

package/dist/components/sidenav/content.d.ts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { SidenavContentProps } from './types.js';
+import '@accelint/bus';
+import '@accelint/core';
+import 'react';
+import 'react-aria-components';
+import './events.js';
+
+/**
+ * SidenavContent - Container for sidenav content
+ *
+ * Provides a container for sidenav content with proper styling
+ */
+declare function SidenavContent({ className, children, ...rest }: SidenavContentProps): react_jsx_runtime.JSX.Element;
+
+export { SidenavContent };

package/dist/components/sidenav/content.js

@@ -0,0 +1,2 @@
+import {jsx}from'react/jsx-runtime';import'client-only';import {Provider}from'react-aria-components';import {DividerContext}from'../divider/context.js';import {SidenavStyles}from'./styles.js';const{content:v,divider:m}=SidenavStyles();function f({className:o,children:t,...i}){return jsx(Provider,{values:[[DividerContext,{className:m()}]],children:jsx("div",{...i,className:v({className:o}),children:t})})}export{f as SidenavContent};//# sourceMappingURL=content.js.map
+//# sourceMappingURL=content.js.map

package/dist/components/sidenav/content.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/sidenav/content.tsx"],"names":["content","divider","d","jsx","e","r","n"],"mappings":"gMAmBQ,KAAA,CAAAA,OAAS,CAAA,CAAA,CAAAC,OAOV,CAAA,CAAA,CAAA,CAAAC,aAAA,EAAA,CAAA,SACL,CAAA,CAAA,CAAA,oBAGF,CAAwB,CACtB,CAAA,GAAA,CAAA,CAAA,CACEC,CAAAA,OAAUC,GAAA,CAAAC,QAAA,CAAQ,CAAC,MAAmB,CAAA,CAAA,CAAAC,cAAA,CAAA,CAAA,SACpC,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,QAAC,CAAAF,GAAK,CAAA,qBAA8B,CAAA,CAAA,CAAA,CAAA,SACjC,CAAA,CAAA,CAAA,CAAA,CAAA,QAIT,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA","file":"content.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'use client';\n\nimport 'client-only';\nimport { Provider } from 'react-aria-components';\nimport { DividerContext } from '../divider/context';\nimport { SidenavStyles } from './styles';\nimport type { SidenavContentProps } from './types';\n\nconst { content, divider } = SidenavStyles();\n\n/**\n * SidenavContent - Container for sidenav content\n *\n * Provides a container for sidenav content with proper styling\n */\nexport function SidenavContent({\n  className,\n  children,\n  ...rest\n}: SidenavContentProps) {\n  return (\n    <Provider values={[[DividerContext, { className: divider() }]]}>\n      <div {...rest} className={content({ className })}>\n        {children}\n      </div>\n    </Provider>\n  );\n}\n"]}

package/dist/components/sidenav/context.d.ts

@@ -0,0 +1,10 @@
+import * as react from 'react';
+import { SidenavContextValue } from './types.js';
+import '@accelint/bus';
+import '@accelint/core';
+import 'react-aria-components';
+import './events.js';
+
+declare const SidenavContext: react.Context<SidenavContextValue>;
+
+export { SidenavContext };

package/dist/components/sidenav/context.js

@@ -0,0 +1,4 @@
+'use client';
+
+import {uuid}from'@accelint/core';import'client-only';import {createContext}from'react';const r=createContext({id:uuid(),isOpen:false});export{r as SidenavContext};//# sourceMappingURL=context.js.map
+//# sourceMappingURL=context.js.map

package/dist/components/sidenav/context.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/sidenav/context.ts"],"names":["SidenavContext","createContext","uuid"],"mappings":"wFAmBO,MAAMA,CAAAA,CAAiBC,cAAmC,CAC/D,EAAA,CAAIC,MAAK,CACT,MAAA,CAAQ,KACV,CAAC","file":"context.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\n'use client';\n\nimport { uuid } from '@accelint/core';\nimport 'client-only';\nimport { createContext } from 'react';\nimport type { SidenavContextValue } from './types';\n\nexport const SidenavContext = createContext<SidenavContextValue>({\n  id: uuid(),\n  isOpen: false,\n});\n"]}

package/dist/components/sidenav/footer.d.ts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { SidenavFooterProps } from './types.js';
+import '@accelint/bus';
+import '@accelint/core';
+import 'react';
+import 'react-aria-components';
+import './events.js';
+
+/**
+ * SidenavFooter - Footer component for sidenav
+ *
+ * Provides a footer container for the sidenav
+ */
+declare function SidenavFooter(props: SidenavFooterProps): react_jsx_runtime.JSX.Element;
+
+export { SidenavFooter };

package/dist/components/sidenav/footer.js

@@ -0,0 +1,4 @@
+'use client';
+
+import {jsx}from'react/jsx-runtime';import'client-only';function t(o){return jsx("footer",{...o})}export{t as SidenavFooter};//# sourceMappingURL=footer.js.map
+//# sourceMappingURL=footer.js.map

package/dist/components/sidenav/footer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/sidenav/footer.tsx"],"names":["SidenavFooter","props","jsx"],"mappings":"wDAqBO,SAASA,CAAAA,CAAcC,CAAAA,CAA2B,CACvD,OAAOC,GAAAA,CAAC,QAAA,CAAA,CAAQ,GAAGD,EAAO,CAC5B","file":"footer.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'use client';\n\nimport 'client-only';\nimport type { SidenavFooterProps } from './types';\n\n/**\n * SidenavFooter - Footer component for sidenav\n *\n * Provides a footer container for the sidenav\n */\nexport function SidenavFooter(props: SidenavFooterProps) {\n  return <footer {...props} />;\n}\n"]}

package/dist/components/sidenav/header.d.ts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { SidenavHeaderProps } from './types.js';
+import '@accelint/bus';
+import '@accelint/core';
+import 'react';
+import 'react-aria-components';
+import './events.js';
+
+/**
+ * SidenavHeader - Header component for sidenav
+ *
+ * Provides a header with toggle button for the sidenav
+ */
+declare function SidenavHeader({ children, classNames, ...rest }: SidenavHeaderProps): react_jsx_runtime.JSX.Element;
+
+export { SidenavHeader };

package/dist/components/sidenav/header.js

@@ -0,0 +1,4 @@
+'use client';
+
+import {jsx,jsxs}from'react/jsx-runtime';import {useEmit}from'@accelint/bus/react';import {ChevronLeft}from'@accelint/icons';import'client-only';import {useContext}from'react';import {Header,Button,composeRenderProps}from'react-aria-components';import {Icon}from'../icon/index.js';import {SidenavContext}from'./context.js';import {SidenavEventTypes}from'./events.js';import {SidenavStyles}from'./styles.js';const{header:u,toggle:H,transient:y}=SidenavStyles();function L({children:t,classNames:o,...r}){const n=useEmit(SidenavEventTypes.toggle),{id:m}=useContext(SidenavContext);return jsx(Header,{...r,className:u({className:o?.header}),children:jsxs(Button,{className:composeRenderProps(o?.button,i=>H({className:i})),onPress:()=>n({id:m}),children:[t,jsx(Icon,{className:y(),children:jsx(ChevronLeft,{})})]})})}export{L as SidenavHeader};//# sourceMappingURL=header.js.map
+//# sourceMappingURL=header.js.map

package/dist/components/sidenav/header.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/sidenav/header.tsx"],"names":["toggle","transient","SidenavStyles","g","children","classNames","useContext","SidenavContext","a","S","Header","rest","p","l","e","f","jsxs","Button","E","d","className","v","id","jsx","Icon","c","s"],"mappings":"uZAwBgBA,KAAQ,CAAA,MAAAC,CAAU,CAAA,CAAIC,MAO/B,CAAA,CAAA,CAAA,SACL,CAAA,CAAA,CAAA,CAAAC,aAAA,EAAAC,CAAAA,SACA,CAAA,CAAA,CAAAC,QAEqB,CACrB,CAAA,CAAA,UAA2D,CAAA,CAAA,CAAA,GAAM,CAAA,CAC3D,CAAE,CAAA,MAAOC,CAAWC,CAAcC,OAAA,CAExCC,iBAAA,CAAA,OACGC,CAAAA,CAAA,EAAQ,CAAA,CAAGC,CAAAA,CAAMC,UAAA,CAAAC,cAAA,CAAA,CAAA,OAAkBC,GAAE,CAAAC,MAAA,CAAA,CAAA,GAAA,CAAA,CAAA,SAAuB,CAAO,CAAC,CAAA,CACnE,SAAAC,CAAAA,CAACC,EAAA,iBAC2C,CAAAC,IAAA,CAAAC,MAAA,CAAA,CAASC,SACxC,CAAAC,kBAAA,CAAA,CAAA,EAAA,MAEX,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA,SAAsB,CAAA,CAAAC,CAAG,CAAC,CAAA,CAEzB,OAAA,CAAA,IACDC,CAAAA,CAACC,CAAAA,EAAK,CAAA,CAAA,CAAA,CAAA,CAAA,QAAqB,CACzB,CAAA,CAAA,CAAAV,GAAA,CAAAW,IAAA,CAAA,CAAA,SACF,CAAA,CAAA,GAEJ,QAEJ,CAAAX,GAAA,CAAAY,WAAA,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA","file":"header.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'use client';\n\nimport { useEmit } from '@accelint/bus/react';\nimport { ChevronLeft } from '@accelint/icons';\nimport 'client-only';\nimport { useContext } from 'react';\nimport { Button, composeRenderProps, Header } from 'react-aria-components';\nimport { Icon } from '../icon';\nimport { SidenavContext } from './context';\nimport { SidenavEventTypes } from './events';\nimport { SidenavStyles } from './styles';\nimport type { SidenavHeaderProps, SidenavToggleEvent } from './types';\n\nconst { header, toggle, transient } = SidenavStyles();\n\n/**\n * SidenavHeader - Header component for sidenav\n *\n * Provides a header with toggle button for the sidenav\n */\nexport function SidenavHeader({\n  children,\n  classNames,\n  ...rest\n}: SidenavHeaderProps) {\n  const emit = useEmit<SidenavToggleEvent>(SidenavEventTypes.toggle);\n  const { id } = useContext(SidenavContext);\n\n  return (\n    <Header {...rest} className={header({ className: classNames?.header })}>\n      <Button\n        className={composeRenderProps(classNames?.button, (className) =>\n          toggle({ className }),\n        )}\n        onPress={() => emit({ id })}\n      >\n        {children}\n        <Icon className={transient()}>\n          <ChevronLeft />\n        </Icon>\n      </Button>\n    </Header>\n  );\n}\n"]}

package/dist/components/sidenav/index.d.ts

@@ -1,59 +1,67 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { SidenavProps, SidenavTriggerProps, SidenavHeaderProps, SidenavItemProps, SidenavLinkProps, SidenavAvatarProps, SidenavFooterProps, SidenavContentProps, SidenavMenuProps, SidenavMenuItemProps } from './types.js';
+import { SidenavProps } from './types.js';
 import '@accelint/bus';
 import '@accelint/core';
 import 'react';
 import 'react-aria-components';
 import './events.js';
 
+/**
+ * Sidenav - Collapsible side navigation panel
+ *
+ * Provides a hierarchical collapsible side navigation intended to be used
+ * inside a DrawerLayout. Supports headers, avatars, nested menus, and items.
+ *
+ * @example
+ * <DrawerLayout push="left">
+ *   <DrawerLayoutMain className="col-start-2">
+ *     <SidenavTrigger>
+ *       <Button variant="icon" size="large">
+ *         <Icon>
+ *           <MenuIcon />
+ *         </Icon>
+ *       </Button>
+ *     </SidenavTrigger>
+ *   </DrawerLayoutMain>
+ *   <Sidenav>
+ *     <SidenavHeader>
+ *       <SidenavAvatar>
+ *         <Icon><AppLogo /></Icon>
+ *         <Heading>Application Header</Heading>
+ *         <Text>subheader</Text>
+ *       </SidenavAvatar>
+ *     </SidenavHeader>
+ *     <SidenavContent>
+ *       <Heading>Navigation</Heading>
+ *       <SidenavItem>
+ *         <Icon><HomeIcon /></Icon>
+ *         <Text>Home</Text>
+ *       </SidenavItem>
+ *       <Divider />
+ *       <SidenavItem isSelected>
+ *         <Icon><SettingsIcon /></Icon>
+ *         <Text>Settings</Text>
+ *       </SidenavItem>
+ *       <Divider />
+ *       <SidenavMenu title="More Options" icon={<Icon><MenuIcon /></Icon>}>
+ *         <SidenavMenuItem>
+ *           <Text>Sub Item 1</Text>
+ *         </SidenavMenuItem>
+ *         <SidenavMenuItem>
+ *           <Text>Sub Item 2</Text>
+ *         </SidenavMenuItem>
+ *       </SidenavMenu>
+ *     </SidenavContent>
+ *     <SidenavFooter>
+ *       <SidenavAvatar>
+ *         <Icon><UserIcon /></Icon>
+ *         <Heading>User Name</Heading>
+ *         <Text>john@example.com</Text>
+ *       </SidenavAvatar>
+ *     </SidenavFooter>
+ *   </Sidenav>
+ * </DrawerLayout>
+ */
 declare function Sidenav({ id, className, isHiddenWhenClosed, children, ...rest }: SidenavProps): react_jsx_runtime.JSX.Element | null;
-declare namespace Sidenav {
-    var displayName: string;
-    var Trigger: typeof SidenavTrigger;
-    var Header: typeof SidenavHeader;
-    var Item: typeof SidenavItem;
-    var Link: typeof SidenavLink;
-    var Avatar: typeof SidenavAvatar;
-    var Footer: typeof SidenavFooter;
-    var Content: typeof SidenavContent;
-    var Menu: typeof SidenavMenu;
-}
-declare function SidenavContent({ className, children, ...rest }: SidenavContentProps): react_jsx_runtime.JSX.Element;
-declare namespace SidenavContent {
-    var displayName: string;
-}
-declare function SidenavHeader({ children, classNames, ...rest }: SidenavHeaderProps): react_jsx_runtime.JSX.Element;
-declare namespace SidenavHeader {
-    var displayName: string;
-}
-declare function SidenavFooter(props: SidenavFooterProps): react_jsx_runtime.JSX.Element;
-declare namespace SidenavFooter {
-    var displayName: string;
-}
-declare function SidenavTrigger({ children, for: type, ...rest }: SidenavTriggerProps): react_jsx_runtime.JSX.Element;
-declare namespace SidenavTrigger {
-    var displayName: string;
-}
-declare function SidenavItem({ children, classNames, textValue, ...rest }: SidenavItemProps): react_jsx_runtime.JSX.Element;
-declare namespace SidenavItem {
-    var displayName: string;
-}
-declare function SidenavLink({ children, classNames, textValue, ...rest }: SidenavLinkProps): react_jsx_runtime.JSX.Element;
-declare namespace SidenavLink {
-    var displayName: string;
-}
-declare function SidenavAvatar({ children, className, ...rest }: SidenavAvatarProps): react_jsx_runtime.JSX.Element;
-declare namespace SidenavAvatar {
-    var displayName: string;
-}
-declare function SidenavMenu({ icon, title, classNames, children, ...rest }: SidenavMenuProps): react_jsx_runtime.JSX.Element;
-declare namespace SidenavMenu {
-    var displayName: string;
-    var Item: typeof SidenavMenuItem;
-}
-declare function SidenavMenuItem({ className, children, ...rest }: SidenavMenuItemProps): react_jsx_runtime.JSX.Element;
-declare namespace SidenavMenuItem {
-    var displayName: string;
-}
 
 export { Sidenav };