@accelint/design-system 0.1.0 → 0.1.1

package/dist/components/radio/radio.js

@@ -0,0 +1,63 @@
+import { jsx } from 'react/jsx-runtime';
+import { createContext, forwardRef, useMemo, useCallback } from 'react';
+import { Radio as Radio$1, Provider, RadioGroup as RadioGroup$1 } from 'react-aria-components';
+import { useContextProps } from '../../hooks/use-context-props/use-context-props.js';
+import { useDefaultProps } from '../../hooks/use-defaults/use-defaults.js';
+import { inlineVars } from '../../utils/css.js';
+import { mergeClassNames, callRenderProps } from '../../utils/props.js';
+import { useTheme } from '../../hooks/use-theme/use-theme.js';
+import { AriaLabelContext } from '../aria/aria.js';
+import { radioClassNames, radioStateVars, radioGroupStateVars } from './radio.vanilla.js';
+
+const RadioContext = createContext(null);
+const Radio = forwardRef(function Radio2(props, ref) {
+  [props, ref] = useContextProps(props, ref, RadioContext);
+  props = useDefaultProps(props, "Radio");
+  const { children: childrenProp, classNames: classNamesProp, alignInput = "end", ...rest } = props;
+  const theme = useTheme();
+  const classNames = useMemo(() => mergeClassNames(radioClassNames, theme.Radio, classNamesProp), [classNamesProp, theme.Radio]);
+  const style = useCallback((renderProps) => inlineVars(radioStateVars, {
+    ...renderProps,
+    alignInput
+  }), [alignInput]);
+  const children = useCallback((renderProps) => jsx("span", { className: classNames?.radio?.radio, children: callRenderProps(childrenProp, {
+    ...renderProps,
+    defaultChildren: null
+  }) }), [childrenProp, classNames?.radio]);
+  return jsx(Radio$1, { ...rest, ref, style, className: classNames?.radio?.container, children });
+});
+const RadioGroupContext = createContext(null);
+const RadioGroup = forwardRef(function RadioGroup2(props, ref) {
+  [props, ref] = useContextProps(props, ref, RadioGroupContext);
+  props = useDefaultProps(props, "RadioGroup");
+  const theme = useTheme();
+  const { children: childrenProp, classNames: classNamesProp, alignInput = "end", orientation = "vertical", ...rest } = props;
+  const classNames = useMemo(() => mergeClassNames(radioClassNames, theme.Radio, classNamesProp), [classNamesProp, theme.Radio]);
+  const style = useCallback((renderProps) => inlineVars(radioGroupStateVars, {
+    ...renderProps,
+    alignInput,
+    orientation
+  }), [alignInput, orientation]);
+  const values = useMemo(() => [
+    [
+      RadioContext,
+      {
+        classNames,
+        alignInput
+      }
+    ],
+    [
+      AriaLabelContext,
+      {
+        className: classNames?.label
+      }
+    ]
+  ], [alignInput, classNames]);
+  const children = useCallback((renderProps) => jsx(Provider, { values, children: jsx("div", { className: classNames?.group?.group, children: callRenderProps(childrenProp, {
+    ...renderProps,
+    defaultChildren: null
+  }) }) }), [childrenProp, classNames?.group, values]);
+  return jsx(RadioGroup$1, { ...rest, ref, className: classNames?.group?.container, style, orientation, children });
+});
+
+export { Radio, RadioContext, RadioGroup, RadioGroupContext };

package/dist/components/radio/radio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio.js","sources":["../../../src/components/radio/radio.tsx"],"sourcesContent":["import {\n  createContext,\n  type ForwardedRef,\n  forwardRef,\n  useMemo,\n  useCallback,\n} from 'react';\nimport {\n  RadioGroup as RACRadioGroup,\n  Radio as RACRadio,\n  type ContextValue,\n  Provider,\n  type LabelProps,\n} from 'react-aria-components';\nimport { useContextProps, useDefaultProps, useTheme } from '../../hooks';\nimport { callRenderProps, inlineVars, mergeClassNames } from '../../utils';\nimport { AriaLabelContext } from '../aria';\nimport {\n  radioClassNames,\n  radioGroupStateVars,\n  radioStateVars,\n} from './radio.css';\nimport type {\n  RadioGroupRenderProps,\n  RadioGroupProps,\n  RadioProps,\n  RadioRenderProps,\n  RadioContextProps,\n} from './types';\n\nexport const RadioContext =\n  createContext<ContextValue<RadioContextProps, HTMLLabelElement>>(null);\n\nexport const Radio = forwardRef(function Radio(\n  props: RadioProps,\n  ref: ForwardedRef<HTMLLabelElement>,\n) {\n  [props, ref] = useContextProps(props, ref, RadioContext);\n  props = useDefaultProps(props, 'Radio');\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    alignInput = 'end',\n    ...rest\n  } = props;\n\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(radioClassNames, theme.Radio, classNamesProp),\n    [classNamesProp, theme.Radio],\n  );\n\n  const style = useCallback(\n    (renderProps: RadioRenderProps) =>\n      inlineVars(radioStateVars, {\n        ...renderProps,\n        alignInput,\n      }),\n    [alignInput],\n  );\n\n  const children = useCallback(\n    (renderProps: RadioRenderProps) => (\n      <span className={classNames?.radio?.radio}>\n        {callRenderProps(childrenProp, {\n          ...renderProps,\n          defaultChildren: null,\n        })}\n      </span>\n    ),\n    [childrenProp, classNames?.radio],\n  );\n\n  return (\n    <RACRadio\n      {...rest}\n      ref={ref}\n      style={style}\n      className={classNames?.radio?.container}\n    >\n      {children}\n    </RACRadio>\n  );\n});\n\nexport const RadioGroupContext =\n  createContext<ContextValue<RadioGroupProps, HTMLDivElement>>(null);\n\nexport const RadioGroup = forwardRef(function RadioGroup(\n  props: RadioGroupProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  [props, ref] = useContextProps(props, ref, RadioGroupContext);\n\n  props = useDefaultProps(props, 'RadioGroup');\n\n  const theme = useTheme();\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    alignInput = 'end',\n    orientation = 'vertical',\n    ...rest\n  } = props;\n\n  const classNames = useMemo(\n    () => mergeClassNames(radioClassNames, theme.Radio, classNamesProp),\n    [classNamesProp, theme.Radio],\n  );\n\n  const style = useCallback(\n    (renderProps: RadioGroupRenderProps) =>\n      inlineVars(radioGroupStateVars, {\n        ...renderProps,\n        alignInput,\n        orientation,\n      }),\n    [alignInput, orientation],\n  );\n\n  const values = useMemo<\n    [\n      [typeof RadioContext, ContextValue<RadioContextProps, HTMLLabelElement>],\n      [typeof AriaLabelContext, ContextValue<LabelProps, HTMLLabelElement>],\n    ]\n  >(\n    () => [\n      [\n        RadioContext,\n        {\n          classNames,\n          alignInput,\n        },\n      ],\n      [\n        AriaLabelContext,\n        {\n          className: classNames?.label,\n        },\n      ],\n    ],\n    [alignInput, classNames],\n  );\n\n  const children = useCallback(\n    (renderProps: RadioGroupRenderProps) => (\n      <Provider values={values}>\n        <div className={classNames?.group?.group}>\n          {callRenderProps(childrenProp, {\n            ...renderProps,\n            defaultChildren: null,\n          })}\n        </div>\n      </Provider>\n    ),\n    [childrenProp, classNames?.group, values],\n  );\n\n  return (\n    <RACRadioGroup\n      {...rest}\n      ref={ref}\n      className={classNames?.group?.container}\n      style={style}\n      orientation={orientation}\n    >\n      {children}\n    </RACRadioGroup>\n  );\n});\n"],"names":["Radio","RACRadio","RadioGroup","RACRadioGroup"],"mappings":"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"}

package/dist/components/radio/radio.vanilla.js

@@ -0,0 +1,8 @@
+
+var radioClassNames = { radio: { container: "radio_radioClassNames_radio_container__hweo8bo", radio: "radio_radioClassNames_radio_radio__hweo8bp" }, group: { container: "radio_radioClassNames_group_container__hweo8bq", group: "radio_radioClassNames_group_group__hweo8br" }, label: "typography_label__j8fgabg" };
+var radioColorVars = { border: "var(--border__hweo8b2)", background: "var(--background__hweo8b3)", color: "var(--color__hweo8b4)" };
+var radioGroupStateVars = { alignInput: "var(--alignInput__hweo8bi)", orientation: "var(--orientation__hweo8bj)", isDisabled: "var(--isDisabled__hweo8bk)", isReadOnly: "var(--isReadOnly__hweo8bl)", isInvalid: "var(--isInvalid__hweo8bm)", isRequired: "var(--isRequired__hweo8bn)" };
+var radioSpaceVars = { diameter: "var(--diameter__hweo8b5)", gap: "var(--gap__hweo8b6)", elementGap: "var(--elementGap__hweo8b7)" };
+var radioStateVars = { alignInput: "var(--alignInput__hweo8b8)", isDisabled: "var(--isDisabled__hweo8b9)", isFocused: "var(--isFocused__hweo8ba)", isFocusVisible: "var(--isFocusVisible__hweo8bb)", isHovered: "var(--isHovered__hweo8bc)", isPressed: "var(--isPressed__hweo8bd)", isReadOnly: "var(--isReadOnly__hweo8be)", isSelected: "var(--isSelected__hweo8bf)", isInvalid: "var(--isInvalid__hweo8bg)", isRequired: "var(--isRequired__hweo8bh)" };
+
+export { radioClassNames, radioColorVars, radioGroupStateVars, radioSpaceVars, radioStateVars };

package/dist/components/radio/radio.vanilla.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio.vanilla.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}

package/dist/components/radio/types.d.ts

@@ -0,0 +1,29 @@
+import type { RadioGroupProps as RACRadioGroupProps, RadioGroupRenderProps as RACRadioGroupRenderProps, RadioProps as RACRadioProps, RadioRenderProps as RACRadioRenderProps } from 'react-aria-components';
+import type { PartialDeep } from 'type-fest';
+import type { RenderPropsChildren } from '../../types';
+export type RadioAlignment = 'start' | 'end';
+export type RadioClassNames = PartialDeep<{
+    group: {
+        container: string;
+        group: string;
+    };
+    radio: {
+        container: string;
+        radio: string;
+    };
+    label: string;
+}>;
+export type RadioGroupRenderProps = RACRadioGroupRenderProps;
+export type RadioGroupProps = Omit<RACRadioGroupProps, 'className' | 'style'> & Pick<BaseRadioProps, 'alignInput' | 'classNames' | 'label'>;
+export type RadioGroupState = Omit<RadioGroupRenderProps, 'state'>;
+export type RadioRenderProps = Omit<RACRadioRenderProps, 'state'>;
+type BaseRadioProps = {
+    children?: RenderPropsChildren<RadioRenderProps>;
+    label?: string;
+    classNames?: RadioClassNames;
+    alignInput?: RadioAlignment;
+};
+export type RadioProps = Omit<RACRadioProps, 'children' | 'className' | 'style'> & BaseRadioProps;
+export type RadioContextProps = Omit<RadioProps, 'value'>;
+export type RadioState = RadioRenderProps & Pick<BaseRadioProps, 'alignInput'>;
+export {};

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

@@ -0,0 +1,3 @@
+export { SearchField, SearchFieldContext } from './search-field';
+export { searchFieldClassNames, searchFieldContainer, searchFieldSpaceVars, searchFieldStateVars, } from './search-field.css';
+export { type SearchFieldClassNames, type SearchFieldMapping, type SearchFieldProps, type SearchFieldRenderProps, type SearchFieldState, } from './types';

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

@@ -0,0 +1,16 @@
+import type { SearchFieldClassNames } from './types';
+export declare const searchFieldContainer: string;
+export declare const searchFieldSpaceVars: {
+    x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const searchFieldStateVars: {
+    size: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    variant: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isEmpty: `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})`;
+};
+export declare const searchFieldClassNames: SearchFieldClassNames;

package/dist/components/search-field/search-field.d.ts

@@ -0,0 +1,9 @@
+import { type ContextValue } from 'react-aria-components';
+import type { SearchFieldMapping, SearchFieldProps } from './types';
+export declare const SearchFieldContext: import("react").Context<ContextValue<SearchFieldProps, HTMLDivElement>>;
+export declare const SearchField: (props: Omit<import("react-aria-components").SearchFieldProps, "className" | "style" | "type"> & {
+    classNames?: import("./types").SearchFieldClassNames;
+    mapping?: Partial<SearchFieldMapping>;
+    size?: import("../input").InputSize;
+    variant?: import("./types").SearchFieldVariants;
+} & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;

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

@@ -0,0 +1,60 @@
+import { jsx } from 'react/jsx-runtime';
+import { createContext, forwardRef, useMemo, useCallback } from 'react';
+import { Provider, SearchField as SearchField$1 } from 'react-aria-components';
+import { useContextProps } from '../../hooks/use-context-props/use-context-props.js';
+import { useDefaultProps } from '../../hooks/use-defaults/use-defaults.js';
+import { inlineVars } from '../../utils/css.js';
+import { mergeClassNames, callRenderProps } from '../../utils/props.js';
+import { useTheme } from '../../hooks/use-theme/use-theme.js';
+import { AriaGroupContext } from '../aria/aria.js';
+import { ButtonContext } from '../button/button.js';
+import { IconContext } from '../icon/icon.js';
+import { InputContext } from '../input/input.js';
+import { searchFieldClassNames, searchFieldStateVars } from './search-field.vanilla.js';
+
+const defaultMapping = {
+  icon: {
+    sm: { size: "xs" },
+    lg: { size: "sm" }
+  },
+  clear: {
+    sm: { size: "xs", variant: "icon" },
+    lg: { size: "sm", variant: "icon" }
+  }
+};
+const SearchFieldContext = createContext(null);
+const SearchField = forwardRef(function SearchField2(props, ref) {
+  [props, ref] = useContextProps(props, ref, SearchFieldContext);
+  props = useDefaultProps(props, "SearchField");
+  const { children: childrenProp, classNames: classNamesProp, mapping: mappingProp, size = "lg", variant = "solid", isDisabled, isReadOnly } = props;
+  const theme = useTheme();
+  const mapping = useMemo(() => ({
+    ...defaultMapping,
+    ...mappingProp
+  }), [mappingProp]);
+  const classNames = useMemo(() => mergeClassNames(searchFieldClassNames, theme.SearchField, classNamesProp), [theme.SearchField, classNamesProp]);
+  const values = useMemo(() => [
+    [AriaGroupContext, { className: classNames?.group }],
+    [IconContext, { ...mapping.icon[size], classNames: classNames?.icon }],
+    [InputContext, { classNames: classNames?.input, size }],
+    [
+      ButtonContext,
+      {
+        ...mapping.clear[size],
+        classNames: classNames?.clear,
+        isDisabled: isDisabled ?? isReadOnly
+      }
+    ]
+  ], [classNames, mapping, isDisabled, isReadOnly, size]);
+  const style = useCallback(({ state, ...renderProps }) => inlineVars(searchFieldStateVars, {
+    ...renderProps,
+    variant
+  }), [variant]);
+  const children = useCallback((renderProps) => jsx(Provider, { values, children: callRenderProps(childrenProp, {
+    ...renderProps,
+    defaultChildren: null
+  }) }), [childrenProp, values]);
+  return jsx(SearchField$1, { ...props, ref, className: classNames?.container, style, children });
+});
+
+export { SearchField, SearchFieldContext };

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

@@ -0,0 +1 @@
+{"version":3,"file":"search-field.js","sources":["../../../src/components/search-field/search-field.tsx"],"sourcesContent":["import {\n  type ForwardedRef,\n  createContext,\n  forwardRef,\n  useCallback,\n  useMemo,\n} from 'react';\nimport {\n  type ContextValue,\n  Provider,\n  type GroupProps as RACGroupProps,\n  SearchField as RACSearchField,\n  type SearchFieldRenderProps,\n} from 'react-aria-components';\nimport { useContextProps, useDefaultProps, useTheme } from '../../hooks';\nimport { callRenderProps, inlineVars, mergeClassNames } from '../../utils';\nimport { AriaGroupContext } from '../aria';\nimport { ButtonContext, type ButtonProps } from '../button';\nimport { IconContext, type IconProps } from '../icon';\nimport { InputContext, type InputProps } from '../input';\nimport {\n  searchFieldClassNames,\n  searchFieldStateVars,\n} from './search-field.css';\nimport type { SearchFieldMapping, SearchFieldProps } from './types';\n\nconst defaultMapping: SearchFieldMapping = {\n  icon: {\n    sm: { size: 'xs' },\n    lg: { size: 'sm' },\n  },\n  clear: {\n    sm: { size: 'xs', variant: 'icon' },\n    lg: { size: 'sm', variant: 'icon' },\n  },\n};\n\nexport const SearchFieldContext =\n  createContext<ContextValue<SearchFieldProps, HTMLDivElement>>(null);\n\nexport const SearchField = forwardRef(function SearchField(\n  props: SearchFieldProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  [props, ref] = useContextProps(props, ref, SearchFieldContext);\n  props = useDefaultProps(props, 'SearchField');\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    mapping: mappingProp,\n    size = 'lg',\n    variant = 'solid',\n    isDisabled,\n    isReadOnly,\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(searchFieldClassNames, theme.SearchField, classNamesProp),\n    [theme.SearchField, classNamesProp],\n  );\n\n  const values = useMemo<\n    [\n      [typeof AriaGroupContext, ContextValue<RACGroupProps, HTMLDivElement>],\n      [typeof IconContext, ContextValue<IconProps, HTMLDivElement>],\n      [typeof InputContext, ContextValue<InputProps, HTMLInputElement>],\n      [typeof ButtonContext, ContextValue<ButtonProps, HTMLButtonElement>],\n    ]\n  >(\n    () => [\n      [AriaGroupContext, { className: classNames?.group }],\n      [IconContext, { ...mapping.icon[size], classNames: classNames?.icon }],\n      [InputContext, { classNames: classNames?.input, size }],\n      [\n        ButtonContext,\n        {\n          ...mapping.clear[size],\n          classNames: classNames?.clear,\n          isDisabled: isDisabled ?? isReadOnly,\n        },\n      ],\n    ],\n    [classNames, mapping, isDisabled, isReadOnly, size],\n  );\n\n  const style = useCallback(\n    ({ state, ...renderProps }: SearchFieldRenderProps) =>\n      inlineVars(searchFieldStateVars, {\n        ...renderProps,\n        variant,\n      }),\n    [variant],\n  );\n\n  const children = useCallback(\n    (renderProps: SearchFieldRenderProps) => (\n      <Provider values={values}>\n        {callRenderProps(childrenProp, {\n          ...renderProps,\n          defaultChildren: null,\n        })}\n      </Provider>\n    ),\n    [childrenProp, values],\n  );\n\n  return (\n    <RACSearchField\n      {...props}\n      ref={ref}\n      className={classNames?.container}\n      style={style}\n    >\n      {children}\n    </RACSearchField>\n  );\n});\n"],"names":["SearchField","RACSearchField"],"mappings":"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"}

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

@@ -0,0 +1,7 @@
+
+var searchFieldClassNames = { container: "search-field_searchFieldClassNames_container__1exq9w6a", group: "search-field_searchFieldClassNames_group__1exq9w6b", icon: { icon: "search-field_searchFieldClassNames_icon_icon__1exq9w6c" }, input: { sizer: "search-field_searchFieldClassNames_input_sizer__1exq9w6d", input: "search-field_searchFieldClassNames_input_input__1exq9w6e" }, clear: { button: "search-field_searchFieldClassNames_clear_button__1exq9w6f" } };
+var searchFieldContainer = "search-field_searchFieldContainer__1exq9w60";
+var searchFieldSpaceVars = { x: "var(--x__1exq9w61)", y: "var(--y__1exq9w62)" };
+var searchFieldStateVars = { size: "var(--size__1exq9w63)", variant: "var(--variant__1exq9w64)", isEmpty: "var(--isEmpty__1exq9w65)", isDisabled: "var(--isDisabled__1exq9w66)", isInvalid: "var(--isInvalid__1exq9w67)", isReadOnly: "var(--isReadOnly__1exq9w68)", isRequired: "var(--isRequired__1exq9w69)" };
+
+export { searchFieldClassNames, searchFieldContainer, searchFieldSpaceVars, searchFieldStateVars };

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

@@ -0,0 +1 @@
+{"version":3,"file":"search-field.vanilla.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}

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

@@ -0,0 +1,29 @@
+import type { SearchFieldProps as RACSearchFieldProps, SearchFieldRenderProps as RACSearchFieldRenderProps } from 'react-aria-components';
+import type { PartialDeep } from 'type-fest';
+import type { AsType, OmitProtectedProps } from '../../types';
+import type { ButtonClassNames, ButtonProps } from '../button/types';
+import type { IconClassNames, IconProps } from '../icon/types';
+import type { InputClassNames, InputSize } from '../input/types';
+export type SearchFieldClassNames = PartialDeep<{
+    container: string;
+    group: string;
+    icon: IconClassNames;
+    input: InputClassNames;
+    clear: ButtonClassNames;
+}>;
+export type SearchFieldSizes = 'sm' | 'lg';
+export type SearchFieldVariants = 'solid' | 'hollow';
+export type SearchFieldMapping = {
+    icon: Partial<Record<SearchFieldSizes, OmitProtectedProps<IconProps>>>;
+    clear: Partial<Record<SearchFieldSizes, OmitProtectedProps<ButtonProps>>>;
+};
+type BaseSearchFieldProps = {
+    classNames?: SearchFieldClassNames;
+    mapping?: Partial<SearchFieldMapping>;
+    size?: InputSize;
+    variant?: SearchFieldVariants;
+};
+export type SearchFieldRenderProps = AsType<RACSearchFieldRenderProps>;
+export type SearchFieldState = Omit<SearchFieldRenderProps, 'state'> & Required<Pick<BaseSearchFieldProps, 'variant' | 'size'>>;
+export type SearchFieldProps = Omit<RACSearchFieldProps, 'className' | 'style' | 'type'> & BaseSearchFieldProps;
+export {};

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

@@ -0,0 +1,3 @@
+export { Select, SelectContext } from './select';
+export { selectClassNames, selectColorVars, selectContainer, selectSpaceVars, selectStateVars, } from './select.css';
+export { type SelectClassNames, type SelectMapping, type SelectProps, type SelectRenderProps, type SelectSizes, type SelectState, } from './types';

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

@@ -0,0 +1,25 @@
+import type { SelectClassNames } from './types';
+export declare const selectContainer: string;
+export declare const selectColorVars: {
+    description: {
+        color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    };
+    error: {
+        color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    };
+};
+export declare const selectSpaceVars: {
+    width: `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})`;
+};
+export declare const selectStateVars: {
+    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})`;
+    isOpen: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isRequired: `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})`;
+};
+export declare const selectClassNames: SelectClassNames;

package/dist/components/select/select.d.ts

@@ -0,0 +1,8 @@
+import { type ContextValue } from 'react-aria-components';
+import type { SelectMapping, SelectProps } from './types';
+export declare const SelectContext: import("react").Context<ContextValue<SelectProps<object>, HTMLDivElement>>;
+export declare const Select: <T extends object>(props: Omit<import("react-aria-components").SelectProps<T>, "className" | "style"> & {
+    classNames?: import("./types").SelectClassNames;
+    mapping?: Partial<SelectMapping>;
+    size?: import("./types").SelectSizes;
+} & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;

package/dist/components/select/select.js

@@ -0,0 +1,80 @@
+import { jsx } from 'react/jsx-runtime';
+import { createContext, forwardRef, useMemo, useCallback } from 'react';
+import { Provider, Select as Select$1 } from 'react-aria-components';
+import { useContextProps } from '../../hooks/use-context-props/use-context-props.js';
+import { useDefaultProps } from '../../hooks/use-defaults/use-defaults.js';
+import { inlineVars } from '../../utils/css.js';
+import { mergeClassNames, callRenderProps } from '../../utils/props.js';
+import { useTheme } from '../../hooks/use-theme/use-theme.js';
+import { bodies } from '../../styles/typography.vanilla.js';
+import { AriaLabelContext, AriaSelectValueContext, AriaTextContext, AriaFieldErrorContext } from '../aria/aria.js';
+import { ButtonContext } from '../button/button.js';
+import { OptionsContext } from '../options/options.js';
+import { selectClassNames, selectStateVars } from './select.vanilla.js';
+
+const defaultMapping = {
+  description: {
+    sm: bodies.xs,
+    lg: bodies.xs
+  },
+  error: {
+    sm: bodies.xs,
+    lg: bodies.xs
+  },
+  toggle: {
+    sm: { size: "sm", variant: "hollow" },
+    lg: { size: "md", variant: "hollow" }
+  }
+};
+const SelectContext = createContext(null);
+const Select = forwardRef(function Select2(props, ref) {
+  [props, ref] = useContextProps(props, ref, SelectContext);
+  props = useDefaultProps(props, "Select");
+  const { children: childrenProp, classNames: classNamesProp, mapping: mappingProp, size = "lg" } = props;
+  const theme = useTheme();
+  const mapping = useMemo(() => ({
+    ...defaultMapping,
+    ...mappingProp
+  }), [mappingProp]);
+  const classNames = useMemo(() => mergeClassNames(selectClassNames, theme.Select, classNamesProp, {
+    description: mapping.description[size],
+    error: mapping.error[size]
+  }), [classNamesProp, theme.Select, mapping, size]);
+  const values = useMemo(() => [
+    [AriaLabelContext, { className: classNames?.label }],
+    [
+      ButtonContext,
+      {
+        ...mapping.toggle[size],
+        classNames: classNames?.toggle
+      }
+    ],
+    [
+      AriaSelectValueContext,
+      {
+        className: classNames?.value
+      }
+    ],
+    [
+      AriaTextContext,
+      {
+        slots: {
+          description: { className: classNames?.description }
+        }
+      }
+    ],
+    [AriaFieldErrorContext, { className: classNames?.error }],
+    [OptionsContext, { classNames: classNames?.options, size }]
+  ], [classNames, mapping, size]);
+  const style = useCallback((renderProps) => inlineVars(selectStateVars, {
+    ...renderProps,
+    size
+  }), [size]);
+  const children = useCallback((renderProps) => jsx("div", { className: classNames?.select, children: jsx(Provider, { values, children: callRenderProps(childrenProp, {
+    ...renderProps,
+    defaultChildren: null
+  }) }) }), [childrenProp, values, classNames?.select]);
+  return jsx(Select$1, { ...props, ref, className: classNames?.container, style, children });
+});
+
+export { Select, SelectContext };

package/dist/components/select/select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","sources":["../../../src/components/select/select.tsx"],"sourcesContent":["import {\n  createContext,\n  forwardRef,\n  useCallback,\n  useMemo,\n  type ForwardedRef,\n} from 'react';\nimport {\n  Select as AriaSelect,\n  Provider,\n  type ContextValue,\n  type FieldErrorProps,\n  type LabelProps,\n  type SelectRenderProps as RACSelectRenderProps,\n  type SelectValueProps,\n  type TextProps,\n} from 'react-aria-components';\nimport { useContextProps, useDefaultProps, useTheme } from '../../hooks';\nimport { bodies } from '../../styles';\nimport { callRenderProps, inlineVars, mergeClassNames } from '../../utils';\nimport {\n  AriaFieldErrorContext,\n  AriaLabelContext,\n  AriaSelectValueContext,\n  AriaTextContext,\n} from '../aria';\nimport { ButtonContext, type ButtonProps } from '../button';\nimport { OptionsContext, type OptionsProps } from '../options';\nimport { selectClassNames, selectStateVars } from './select.css';\nimport type { SelectMapping, SelectProps } from './types';\n\nconst defaultMapping: SelectMapping = {\n  description: {\n    sm: bodies.xs,\n    lg: bodies.xs,\n  },\n  error: {\n    sm: bodies.xs,\n    lg: bodies.xs,\n  },\n  toggle: {\n    sm: { size: 'sm', variant: 'hollow' },\n    lg: { size: 'md', variant: 'hollow' },\n  },\n};\n\nexport const SelectContext =\n  createContext<ContextValue<SelectProps<object>, HTMLDivElement>>(null);\n\nexport const Select = forwardRef(function Select<T extends object>(\n  props: SelectProps<T>,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  [props, ref] = useContextProps(props, ref, SelectContext);\n  props = useDefaultProps(props, 'Select');\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    mapping: mappingProp,\n    size = 'lg',\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(selectClassNames, theme.Select, classNamesProp, {\n        description: mapping.description[size],\n        error: mapping.error[size],\n      }),\n    [classNamesProp, theme.Select, mapping, size],\n  );\n\n  const values = useMemo<\n    [\n      [typeof AriaLabelContext, ContextValue<LabelProps, HTMLLabelElement>],\n      [typeof ButtonContext, ContextValue<ButtonProps, HTMLButtonElement>],\n      [\n        typeof AriaSelectValueContext,\n        ContextValue<SelectValueProps<object>, HTMLSpanElement>,\n      ],\n      [typeof AriaTextContext, ContextValue<TextProps, HTMLElement>],\n      [\n        typeof AriaFieldErrorContext,\n        ContextValue<FieldErrorProps, HTMLElement>,\n      ],\n      [typeof OptionsContext, ContextValue<OptionsProps, HTMLElement>],\n    ]\n  >(\n    () => [\n      [AriaLabelContext, { className: classNames?.label }],\n      [\n        ButtonContext,\n        {\n          ...mapping.toggle[size],\n          classNames: classNames?.toggle,\n        },\n      ],\n      [\n        AriaSelectValueContext,\n        {\n          className: classNames?.value,\n        },\n      ],\n      [\n        AriaTextContext,\n        {\n          slots: {\n            description: { className: classNames?.description },\n          },\n        },\n      ],\n      [AriaFieldErrorContext, { className: classNames?.error }],\n      [OptionsContext, { classNames: classNames?.options, size }],\n    ],\n    [classNames, mapping, size],\n  );\n\n  const style = useCallback(\n    (renderProps: RACSelectRenderProps) =>\n      inlineVars(selectStateVars, {\n        ...renderProps,\n        size,\n      }),\n    [size],\n  );\n\n  const children = useCallback(\n    (renderProps: RACSelectRenderProps) => (\n      <div className={classNames?.select}>\n        <Provider values={values}>\n          {callRenderProps(childrenProp, {\n            ...renderProps,\n            defaultChildren: null,\n          })}\n        </Provider>\n      </div>\n    ),\n    [childrenProp, values, classNames?.select],\n  );\n\n  return (\n    <AriaSelect\n      {...props}\n      ref={ref}\n      className={classNames?.container}\n      style={style}\n    >\n      {children}\n    </AriaSelect>\n  );\n});\n"],"names":["Select","AriaSelect"],"mappings":"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"}

package/dist/components/select/select.vanilla.js

@@ -0,0 +1,8 @@
+
+var selectClassNames = { container: "select_selectClassNames_container__1j26mgud", select: "select_selectClassNames_select__1j26mgue", label: "select_selectClassNames_label__1j26mguf typography_label__j8fgabg", toggle: { button: "select_selectClassNames_toggle_button__1j26mgug" }, description: "select_selectClassNames_description__1j26mguh", error: "select_selectClassNames_error__1j26mgui", value: "select_selectClassNames_value__1j26mguj" };
+var selectColorVars = { description: { color: "var(--description-color__1j26mgu1)" }, error: { color: "var(--error-color__1j26mgu2)" } };
+var selectContainer = "select_selectContainer__1j26mgu0";
+var selectSpaceVars = { width: "var(--width__1j26mgu3)", x: "var(--x__1j26mgu4)", y: "var(--y__1j26mgu5)" };
+var selectStateVars = { size: "var(--size__1j26mgu6)", isDisabled: "var(--isDisabled__1j26mgu7)", isInvalid: "var(--isInvalid__1j26mgu8)", isOpen: "var(--isOpen__1j26mgu9)", isRequired: "var(--isRequired__1j26mgua)", isFocused: "var(--isFocused__1j26mgub)", isFocusVisible: "var(--isFocusVisible__1j26mguc)" };
+
+export { selectClassNames, selectColorVars, selectContainer, selectSpaceVars, selectStateVars };

package/dist/components/select/select.vanilla.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.vanilla.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;"}

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

@@ -0,0 +1,30 @@
+import type { SelectProps as RACSelectProps, SelectRenderProps as RACSelectRenderProps } from 'react-aria-components';
+import type { PartialDeep } from 'type-fest';
+import type { AsType, OmitProtectedProps } from '../../types';
+import type { ButtonClassNames, ButtonProps } from '../button/types';
+import type { OptionsClassNames } from '../options/types';
+export type SelectClassNames = PartialDeep<{
+    container: string;
+    select: string;
+    label: string;
+    toggle: ButtonClassNames;
+    value: string;
+    description: string;
+    error: string;
+    options: OptionsClassNames;
+}>;
+export type SelectSizes = 'sm' | 'lg';
+export type SelectMapping = {
+    description: Partial<Record<SelectSizes, string>>;
+    error: Partial<Record<SelectSizes, string>>;
+    toggle: Partial<Record<SelectSizes, OmitProtectedProps<ButtonProps>>>;
+};
+type BaseSelectProps = {
+    classNames?: SelectClassNames;
+    mapping?: Partial<SelectMapping>;
+    size?: SelectSizes;
+};
+export type SelectRenderProps = AsType<RACSelectRenderProps>;
+export type SelectState = SelectRenderProps & Required<Pick<BaseSelectProps, 'size'>>;
+export type SelectProps<T extends object> = Omit<RACSelectProps<T>, 'className' | 'style'> & BaseSelectProps;
+export {};

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

@@ -0,0 +1,3 @@
+export { Switch, SwitchContext } from './switch';
+export { switchClassNames, switchColorVars, switchContainer, switchSpaceVars, switchStateVars, } from './switch.css';
+export { type SwitchClassNames, type SwitchAlignment, type SwitchProps, type SwitchRenderProps, type SwitchState, } from './types';

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

@@ -0,0 +1,25 @@
+import type { SwitchClassNames } from './types';
+export declare const switchContainer: string;
+export declare const switchColorVars: {
+    border: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    indicator: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const switchSpaceVars: {
+    diameter: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    gutter: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    gap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    travel: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const switchStateVars: {
+    alignInput: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isDisabled: `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})`;
+    isHovered: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isReadOnly: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isSelected: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const switchClassNames: SwitchClassNames;

package/dist/components/switch/switch.d.ts

@@ -0,0 +1,4 @@
+import { type ContextValue } from 'react-aria-components';
+import type { SwitchProps } from './types';
+export declare const SwitchContext: import("react").Context<ContextValue<SwitchProps, HTMLLabelElement>>;
+export declare const Switch: (props: Omit<import("react-aria-components").SwitchProps, "children" | "className" | "style"> & import("./types").BaseSwitchProps & import("react").RefAttributes<HTMLLabelElement>) => import("react").ReactElement | null;

package/dist/components/switch/switch.js

@@ -0,0 +1,34 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { createContext, forwardRef, useMemo, useCallback } from 'react';
+import { Switch as Switch$1 } from 'react-aria-components';
+import { useContextProps } from '../../hooks/use-context-props/use-context-props.js';
+import { useDefaultProps } from '../../hooks/use-defaults/use-defaults.js';
+import { inlineVars } from '../../utils/css.js';
+import { mergeClassNames, callRenderProps } from '../../utils/props.js';
+import { useTheme } from '../../hooks/use-theme/use-theme.js';
+import { switchClassNames, switchStateVars } from './switch.vanilla.js';
+
+const SwitchContext = createContext(null);
+const Switch = forwardRef(function Switch2(props, ref) {
+  [props, ref] = useContextProps(props, ref, SwitchContext);
+  props = useDefaultProps(props, "Switch");
+  const { children: childrenProp, classNames: classNamesProp, alignInput, ...rest } = props;
+  const theme = useTheme();
+  const classNames = useMemo(() => mergeClassNames(switchClassNames, theme.Switch, classNamesProp), [theme.Switch, classNamesProp]);
+  const style = useCallback(({ state, ...renderProps }) => inlineVars(switchStateVars, {
+    ...renderProps,
+    alignInput
+  }), [alignInput]);
+  const children = useCallback((renderProps) => {
+    const child = callRenderProps(childrenProp, renderProps);
+    return jsxs("span", { className: classNames?.switch, children: [child && jsx("span", { className: classNames?.label, children: child }), jsx("span", { className: classNames?.indicator })] });
+  }, [
+    childrenProp,
+    classNames?.switch,
+    classNames?.label,
+    classNames?.indicator
+  ]);
+  return jsx(Switch$1, { ...rest, ref, className: classNames?.container, style, children });
+});
+
+export { Switch, SwitchContext };

package/dist/components/switch/switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.js","sources":["../../../src/components/switch/switch.tsx"],"sourcesContent":["import {\n  type ForwardedRef,\n  createContext,\n  forwardRef,\n  useCallback,\n  useMemo,\n} from 'react';\nimport { type ContextValue, Switch as RACSwitch } from 'react-aria-components';\nimport { useContextProps, useDefaultProps, useTheme } from '../../hooks';\nimport { callRenderProps, inlineVars, mergeClassNames } from '../../utils';\nimport { switchClassNames, switchStateVars } from './switch.css';\nimport type { SwitchProps, SwitchRenderProps } from './types';\n\nexport const SwitchContext =\n  createContext<ContextValue<SwitchProps, HTMLLabelElement>>(null);\n\nexport const Switch = forwardRef(function Switch(\n  props: SwitchProps,\n  ref: ForwardedRef<HTMLLabelElement>,\n) {\n  [props, ref] = useContextProps(props, ref, SwitchContext);\n\n  props = useDefaultProps(props, 'Switch');\n\n  const {\n    children: childrenProp,\n    classNames: classNamesProp,\n    alignInput,\n    ...rest\n  } = props;\n\n  const theme = useTheme();\n\n  const classNames = useMemo(\n    () => mergeClassNames(switchClassNames, theme.Switch, classNamesProp),\n    [theme.Switch, classNamesProp],\n  );\n\n  const style = useCallback(\n    ({ state, ...renderProps }: SwitchRenderProps) =>\n      inlineVars(switchStateVars, {\n        ...renderProps,\n        alignInput,\n      }),\n    [alignInput],\n  );\n\n  const children = useCallback(\n    (renderProps: SwitchRenderProps) => {\n      const child = callRenderProps(childrenProp, renderProps);\n\n      return (\n        <span className={classNames?.switch}>\n          {child && <span className={classNames?.label}>{child}</span>}\n          <span className={classNames?.indicator} />\n        </span>\n      );\n    },\n    [\n      childrenProp,\n      classNames?.switch,\n      classNames?.label,\n      classNames?.indicator,\n    ],\n  );\n\n  return (\n    <RACSwitch\n      {...rest}\n      ref={ref}\n      className={classNames?.container}\n      style={style}\n    >\n      {children}\n    </RACSwitch>\n  );\n});\n"],"names":["Switch","RACSwitch"],"mappings":";;;;;;;;;;;;;;;;AAaa,MAAA,aAAA,GACX,cAA2D,IAAI,EAAA;AAE1D,MAAM,MAAS,GAAA,UAAA,CAAW,SAASA,OAAAA,CACxC,OACA,GACA,EAAA;AACA,EAAA,CAAC,OAAO,GAAG,CAAA,GAAI,eAAgB,CAAA,KAAA,EAAO,KAAK,aAAa,CAAA,CAAA;AAExD,EAAQ,KAAA,GAAA,eAAA,CAAgB,OAAO,QAAQ,CAAA,CAAA;AAEvC,EAAM,MAAA;AAAA,IACJ,QAAU,EAAA,YAAA;AAAA,IACV,UAAY,EAAA,cAAA;AAAA,IACZ,UAAA;AAAA,IACA,GAAG,IAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,QAAQ,QAAS,EAAA,CAAA;AAEvB,EAAA,MAAM,UAAa,GAAA,OAAA;AAAA,IACjB,MAAM,eAAA,CAAgB,gBAAkB,EAAA,KAAA,CAAM,QAAQ,cAAc,CAAA;AAAA,IACpE,CAAC,KAAM,CAAA,MAAA,EAAQ,cAAc,CAAA;AAAA,GAC/B,CAAA;AAEA,EAAA,MAAM,KAAQ,GAAA,WAAA;AAAA,IACZ,CAAC,EAAE,KAAA,EAAO,GAAG,WAAY,EAAA,KACvB,WAAW,eAAiB,EAAA;AAAA,MAC1B,GAAG,WAAA;AAAA,MACH,UAAA;AAAA,KACD,CAAA;AAAA,IACH,CAAC,UAAU,CAAA;AAAA,GACb,CAAA;AAEA,EAAA,MAAM,QAAW,GAAA,WAAA;AAAA,IACf,CAAC,WAAmC,KAAA;AAClC,MAAM,MAAA,KAAA,GAAQ,eAAgB,CAAA,YAAA,EAAc,WAAW,CAAA,CAAA;AAEvD,MAAA,uBACG,IAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,UAAA,EAAY,MAC1B,EAAA,QAAA,EAAA;AAAA,QAAA,KAAA,oBAAU,GAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,UAAA,EAAY,OAAQ,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,wBACpD,GAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,UAAA,EAAY,SAAW,EAAA,CAAA;AAAA,OAC1C,EAAA,CAAA,CAAA;AAAA,KAEJ;AAAA,IACA;AAAA,MACE,YAAA;AAAA,MACA,UAAY,EAAA,MAAA;AAAA,MACZ,UAAY,EAAA,KAAA;AAAA,MACZ,UAAY,EAAA,SAAA;AAAA,KACd;AAAA,GACF,CAAA;AAEA,EACE,uBAAA,GAAA;AAAA,IAACC,QAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MACA,WAAW,UAAY,EAAA,SAAA;AAAA,MACvB,KAAA;AAAA,MAEC,QAAA;AAAA,KAAA;AAAA,GACH,CAAA;AAEJ,CAAC;;;;"}

package/dist/components/switch/switch.vanilla.js

@@ -0,0 +1,8 @@
+
+var switchClassNames = { container: "switch_switchClassNames_container__1j8i4wgh", "switch": "switch_switchClassNames_switch__1j8i4wgi", label: "typography_label__j8fgabg", indicator: "switch_switchClassNames_indicator__1j8i4wgk" };
+var switchColorVars = { border: "var(--border__1j8i4wg1)", background: "var(--background__1j8i4wg2)", color: "var(--color__1j8i4wg3)", indicator: "var(--indicator__1j8i4wg4)" };
+var switchContainer = "switch_switchContainer__1j8i4wg0";
+var switchSpaceVars = { diameter: "var(--diameter__1j8i4wg5)", gutter: "var(--gutter__1j8i4wg6)", gap: "var(--gap__1j8i4wg7)", travel: "var(--travel__1j8i4wg8)" };
+var switchStateVars = { alignInput: "var(--alignInput__1j8i4wg9)", isDisabled: "var(--isDisabled__1j8i4wga)", isFocused: "var(--isFocused__1j8i4wgb)", isFocusVisible: "var(--isFocusVisible__1j8i4wgc)", isHovered: "var(--isHovered__1j8i4wgd)", isPressed: "var(--isPressed__1j8i4wge)", isReadOnly: "var(--isReadOnly__1j8i4wgf)", isSelected: "var(--isSelected__1j8i4wgg)" };
+
+export { switchClassNames, switchColorVars, switchContainer, switchSpaceVars, switchStateVars };

package/dist/components/switch/switch.vanilla.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.vanilla.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}

package/dist/components/switch/types.d.ts

@@ -0,0 +1,17 @@
+import type { SwitchProps as RACSwitchProps, SwitchRenderProps as RACSwitchRenderProps } from 'react-aria-components';
+import type { RenderPropsChildren } from '../../types';
+export type SwitchClassNames = Partial<{
+    container: string;
+    switch: string;
+    label: string;
+    indicator: string;
+}>;
+export type SwitchAlignment = 'start' | 'end';
+export type SwitchRenderProps = RACSwitchRenderProps;
+export type BaseSwitchProps = {
+    children?: RenderPropsChildren<SwitchRenderProps>;
+    classNames?: SwitchClassNames;
+    alignInput?: SwitchAlignment;
+};
+export type SwitchState = Omit<SwitchRenderProps, 'state'> & Required<Pick<BaseSwitchProps, 'alignInput'>>;
+export type SwitchProps = Omit<RACSwitchProps, 'children' | 'className' | 'style'> & BaseSwitchProps;

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

@@ -0,0 +1,3 @@
+export { Tab, TabContext, TabList, TabListContext, TabPanel, TabPanelContext, TabPanels, TabPanelsContext, Tabs, TabsContext, } from './tabs';
+export { tabColorVars, tabListStateVars, tabPanelStateVars, tabPanelsStateVars, tabSpaceVars, tabStateVars, tabsClassNames, tabsContainers, } from './tabs.css';
+export { type TabListAnchor, type TabListAlignment, type TabListProps, type TabListState, type TabListVariants, type TabPanelProps, type TabPanelRenderProps, type TabPanelState, type TabPanelsProps, type TabPanelsState, type TabProps, type TabRenderProps, type TabState, type TabsClassNames, type TabsProps, } from './types';