base-themes 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +174 -0
- package/dist/base-themes.css +2 -0
- package/dist/base-themes.js +918 -0
- package/dist/types/components/ui/Accordion.d.ts +15 -0
- package/dist/types/components/ui/AlertDialog.d.ts +16 -0
- package/dist/types/components/ui/Autocomplete.d.ts +20 -0
- package/dist/types/components/ui/Avatar.d.ts +16 -0
- package/dist/types/components/ui/Button.d.ts +9 -0
- package/dist/types/components/ui/Checkbox.d.ts +9 -0
- package/dist/types/components/ui/CheckboxGroup.d.ts +11 -0
- package/dist/types/components/ui/Collapsible.d.ts +12 -0
- package/dist/types/components/ui/Combobox.d.ts +13 -0
- package/dist/types/components/ui/ContextMenu.d.ts +17 -0
- package/dist/types/components/ui/CspProvider.d.ts +5 -0
- package/dist/types/components/ui/Dialog.d.ts +13 -0
- package/dist/types/components/ui/DirectionProvider.d.ts +6 -0
- package/dist/types/components/ui/Drawer.d.ts +14 -0
- package/dist/types/components/ui/Field.d.ts +11 -0
- package/dist/types/components/ui/Fieldset.d.ts +8 -0
- package/dist/types/components/ui/Form.d.ts +7 -0
- package/dist/types/components/ui/Input.d.ts +13 -0
- package/dist/types/components/ui/Menu.d.ts +17 -0
- package/dist/types/components/ui/Menubar.d.ts +18 -0
- package/dist/types/components/ui/Meter.d.ts +9 -0
- package/dist/types/components/ui/NavigationMenu.d.ts +16 -0
- package/dist/types/components/ui/NumberField.d.ts +8 -0
- package/dist/types/components/ui/OtpField.d.ts +9 -0
- package/dist/types/components/ui/Popover.d.ts +13 -0
- package/dist/types/components/ui/PreviewCard.d.ts +14 -0
- package/dist/types/components/ui/Progress.d.ts +9 -0
- package/dist/types/components/ui/Radio.d.ts +8 -0
- package/dist/types/components/ui/RadioGroup.d.ts +13 -0
- package/dist/types/components/ui/ScrollArea.d.ts +5 -0
- package/dist/types/components/ui/Select.d.ts +9 -0
- package/dist/types/components/ui/Separator.d.ts +5 -0
- package/dist/types/components/ui/Slider.d.ts +7 -0
- package/dist/types/components/ui/Switch.d.ts +9 -0
- package/dist/types/components/ui/Tabs.d.ts +16 -0
- package/dist/types/components/ui/Toast.d.ts +7 -0
- package/dist/types/components/ui/Toggle.d.ts +5 -0
- package/dist/types/components/ui/ToggleGroup.d.ts +13 -0
- package/dist/types/components/ui/Toolbar.d.ts +8 -0
- package/dist/types/components/ui/Tooltip.d.ts +14 -0
- package/dist/types/components/ui/index.d.ts +82 -0
- package/dist/types/components/ui/useDirection.d.ts +1 -0
- package/dist/types/components/ui/useToastManager.d.ts +4 -0
- package/dist/types/hooks/useTheme.d.ts +10 -0
- package/dist/types/lib.d.ts +3 -0
- package/package.json +68 -0
- package/public/previews/base-themes-bento.png +0 -0
- package/public/previews/base-themes-neo-brutalism.png +0 -0
- package/public/previews/base-themes-shadcn.png +0 -0
- package/registry/registry.json +64 -0
- package/skills/base-themes/SKILL.md +107 -0
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { Accordion as BaseAccordion } from '@base-ui/react/accordion';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Accordion.css';
|
|
4
|
+
type AccordionItem = {
|
|
5
|
+
value: string;
|
|
6
|
+
label: string;
|
|
7
|
+
content: string;
|
|
8
|
+
};
|
|
9
|
+
type AccordionProps = Omit<ComponentPropsWithoutRef<typeof BaseAccordion.Root>, 'defaultValue'> & {
|
|
10
|
+
items: AccordionItem[];
|
|
11
|
+
defaultValue?: string | string[];
|
|
12
|
+
};
|
|
13
|
+
export declare function Accordion({ items, defaultValue, className, ...rest }: AccordionProps): import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
export { BaseAccordion };
|
|
15
|
+
export type { AccordionProps, AccordionItem };
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';
|
|
2
|
+
import { type ReactElement } from 'react';
|
|
3
|
+
import './AlertDialog.css';
|
|
4
|
+
import './Button.css';
|
|
5
|
+
type AlertDialogProps = {
|
|
6
|
+
trigger: ReactElement;
|
|
7
|
+
title: string;
|
|
8
|
+
description: string;
|
|
9
|
+
confirmLabel?: string;
|
|
10
|
+
cancelLabel?: string;
|
|
11
|
+
onConfirm?: () => void;
|
|
12
|
+
className?: string;
|
|
13
|
+
};
|
|
14
|
+
export declare function AlertDialog({ trigger, title, description, confirmLabel, cancelLabel, onConfirm, className, }: AlertDialogProps): import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
export { BaseAlertDialog };
|
|
16
|
+
export type { AlertDialogProps };
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { Autocomplete as BaseAutocomplete } from '@base-ui/react/autocomplete';
|
|
2
|
+
import './Combobox.css';
|
|
3
|
+
import './Autocomplete.css';
|
|
4
|
+
export type AutocompleteOption = {
|
|
5
|
+
value: string;
|
|
6
|
+
label: string;
|
|
7
|
+
};
|
|
8
|
+
export type AutocompleteProps = {
|
|
9
|
+
options: AutocompleteOption[];
|
|
10
|
+
label?: string;
|
|
11
|
+
placeholder?: string;
|
|
12
|
+
className?: string;
|
|
13
|
+
defaultValue?: string;
|
|
14
|
+
value?: string;
|
|
15
|
+
onValueChange?: (value: string) => void;
|
|
16
|
+
openOnInputClick?: boolean;
|
|
17
|
+
disabled?: boolean;
|
|
18
|
+
};
|
|
19
|
+
export declare function Autocomplete({ options, label, placeholder, className, ...rest }: AutocompleteProps): import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
export { BaseAutocomplete };
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { Avatar as BaseAvatar } from '@base-ui/react/avatar';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Avatar.css';
|
|
4
|
+
export type AvatarProps = ComponentPropsWithoutRef<typeof BaseAvatar.Root> & {
|
|
5
|
+
src?: string;
|
|
6
|
+
alt?: string;
|
|
7
|
+
fallback?: string;
|
|
8
|
+
size?: 'sm' | 'md' | 'lg';
|
|
9
|
+
};
|
|
10
|
+
export declare const Avatar: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").AvatarRootProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>, "ref"> & {
|
|
11
|
+
src?: string;
|
|
12
|
+
alt?: string;
|
|
13
|
+
fallback?: string;
|
|
14
|
+
size?: "sm" | "md" | "lg";
|
|
15
|
+
} & import("react").RefAttributes<HTMLSpanElement>>;
|
|
16
|
+
export declare const AvatarGroup: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Button as BaseButton } from '@base-ui/react/button';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Button.css';
|
|
4
|
+
export type ButtonProps = ComponentPropsWithoutRef<typeof BaseButton> & {
|
|
5
|
+
variant?: 'primary' | 'outline' | 'ghost' | 'icon' | 'accent' | 'teal';
|
|
6
|
+
};
|
|
7
|
+
export declare const Button: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ButtonProps, "ref"> & import("react").RefAttributes<HTMLElement>, "ref"> & {
|
|
8
|
+
variant?: "primary" | "outline" | "ghost" | "icon" | "accent" | "teal";
|
|
9
|
+
} & import("react").RefAttributes<HTMLButtonElement>>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Checkbox as BaseCheckbox } from '@base-ui/react/checkbox';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Checkbox.css';
|
|
4
|
+
export type CheckboxProps = ComponentPropsWithoutRef<typeof BaseCheckbox.Root> & {
|
|
5
|
+
label?: string;
|
|
6
|
+
};
|
|
7
|
+
export declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").CheckboxRootProps, "ref"> & import("react").RefAttributes<HTMLElement>, "ref"> & {
|
|
8
|
+
label?: string;
|
|
9
|
+
} & import("react").RefAttributes<HTMLButtonElement>>;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { CheckboxGroup as BaseCheckboxGroup } from '@base-ui/react/checkbox-group';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Checkbox.css';
|
|
4
|
+
export type CheckboxGroupOption = {
|
|
5
|
+
value: string;
|
|
6
|
+
label: string;
|
|
7
|
+
};
|
|
8
|
+
export type CheckboxGroupProps = Omit<ComponentPropsWithoutRef<typeof BaseCheckboxGroup>, 'children'> & {
|
|
9
|
+
options: CheckboxGroupOption[];
|
|
10
|
+
};
|
|
11
|
+
export declare function CheckboxGroup({ options, className, defaultValue, ...rest }: CheckboxGroupProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { Collapsible as BaseCollapsible } from '@base-ui/react/collapsible';
|
|
2
|
+
import { type ReactNode } from 'react';
|
|
3
|
+
import './Collapsible.css';
|
|
4
|
+
type CollapsibleProps = {
|
|
5
|
+
label: string;
|
|
6
|
+
children: ReactNode;
|
|
7
|
+
defaultOpen?: boolean;
|
|
8
|
+
className?: string;
|
|
9
|
+
};
|
|
10
|
+
export declare function Collapsible({ label, children, defaultOpen, className }: CollapsibleProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export { BaseCollapsible };
|
|
12
|
+
export type { CollapsibleProps };
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import './Combobox.css';
|
|
2
|
+
type ComboboxOption = {
|
|
3
|
+
value: string;
|
|
4
|
+
label: string;
|
|
5
|
+
};
|
|
6
|
+
type ComboboxProps = {
|
|
7
|
+
options: ComboboxOption[];
|
|
8
|
+
placeholder?: string;
|
|
9
|
+
label?: string;
|
|
10
|
+
className?: string;
|
|
11
|
+
};
|
|
12
|
+
export declare function Combobox({ options, placeholder, label, className }: ComboboxProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export type { ComboboxProps, ComboboxOption };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { ContextMenu as BaseContextMenu } from '@base-ui/react/context-menu';
|
|
2
|
+
import { type ReactNode } from 'react';
|
|
3
|
+
import './Menu.css';
|
|
4
|
+
import './ContextMenu.css';
|
|
5
|
+
export type ContextMenuItemData = {
|
|
6
|
+
label: string;
|
|
7
|
+
icon?: ReactNode;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
onClick?: () => void;
|
|
10
|
+
};
|
|
11
|
+
export type ContextMenuProps = {
|
|
12
|
+
children: ReactNode;
|
|
13
|
+
items: (ContextMenuItemData | 'separator')[];
|
|
14
|
+
className?: string;
|
|
15
|
+
};
|
|
16
|
+
export declare function ContextMenu({ children, items, className }: ContextMenuProps): import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
export { BaseContextMenu };
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { CSPProvider as BaseCSPProvider } from '@base-ui/react/csp-provider';
|
|
2
|
+
import { type ComponentProps } from 'react';
|
|
3
|
+
export type CspProviderProps = ComponentProps<typeof BaseCSPProvider>;
|
|
4
|
+
export declare function CspProvider(props: CspProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export { BaseCSPProvider };
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { Dialog as BaseDialog } from '@base-ui/react/dialog';
|
|
2
|
+
import { type ReactElement, type ReactNode } from 'react';
|
|
3
|
+
import './Dialog.css';
|
|
4
|
+
type DialogProps = {
|
|
5
|
+
trigger: ReactElement;
|
|
6
|
+
title: string;
|
|
7
|
+
description?: string;
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
className?: string;
|
|
10
|
+
};
|
|
11
|
+
export declare function Dialog({ trigger, title, description, children, className }: DialogProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export { BaseDialog };
|
|
13
|
+
export type { DialogProps };
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { DirectionProvider as BaseDirectionProvider, type TextDirection } from '@base-ui/react/direction-provider';
|
|
2
|
+
import { type ComponentProps } from 'react';
|
|
3
|
+
export type DirectionProviderProps = ComponentProps<typeof BaseDirectionProvider>;
|
|
4
|
+
export declare function DirectionProvider({ children, direction }: DirectionProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export { BaseDirectionProvider };
|
|
6
|
+
export type { TextDirection };
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { Drawer as BaseDrawer } from '@base-ui/react/drawer';
|
|
2
|
+
import { type ReactElement, type ReactNode } from 'react';
|
|
3
|
+
import './Drawer.css';
|
|
4
|
+
type DrawerProps = {
|
|
5
|
+
trigger: ReactElement;
|
|
6
|
+
title: string;
|
|
7
|
+
description?: string;
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
side?: 'left' | 'right' | 'top' | 'bottom';
|
|
10
|
+
className?: string;
|
|
11
|
+
};
|
|
12
|
+
export declare function Drawer({ trigger, title, description, children, side, className, }: DrawerProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export { BaseDrawer };
|
|
14
|
+
export type { DrawerProps };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Field as BaseField } from '@base-ui/react/field';
|
|
2
|
+
import { type ComponentPropsWithoutRef, type ReactElement } from 'react';
|
|
3
|
+
import './Field.css';
|
|
4
|
+
export type FieldProps = ComponentPropsWithoutRef<typeof BaseField.Root> & {
|
|
5
|
+
label: string;
|
|
6
|
+
description?: string;
|
|
7
|
+
error?: string;
|
|
8
|
+
children: ReactElement;
|
|
9
|
+
};
|
|
10
|
+
export declare function Field({ label, description, error, children, className, ...rest }: FieldProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export { BaseField };
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Fieldset as BaseFieldset } from '@base-ui/react/fieldset';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Fieldset.css';
|
|
4
|
+
export type FieldsetProps = ComponentPropsWithoutRef<typeof BaseFieldset.Root> & {
|
|
5
|
+
legend: string;
|
|
6
|
+
};
|
|
7
|
+
export declare function Fieldset({ legend, children, className, ...rest }: FieldsetProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export { BaseFieldset };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Form as BaseForm } from '@base-ui/react/form';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Form.css';
|
|
4
|
+
export type FormProps = ComponentPropsWithoutRef<typeof BaseForm>;
|
|
5
|
+
export declare const Form: import("react").ForwardRefExoticComponent<Omit<BaseForm.Props<Record<string, any>> & {
|
|
6
|
+
ref?: React.Ref<HTMLFormElement> | undefined;
|
|
7
|
+
}, "ref"> & import("react").RefAttributes<HTMLFormElement>>;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { Input as BaseInput } from '@base-ui/react/input';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Input.css';
|
|
4
|
+
export type InputProps = ComponentPropsWithoutRef<typeof BaseInput> & {
|
|
5
|
+
label?: string;
|
|
6
|
+
};
|
|
7
|
+
export declare const Input: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").InputProps, "ref"> & import("react").RefAttributes<HTMLElement>, "ref"> & {
|
|
8
|
+
label?: string;
|
|
9
|
+
} & import("react").RefAttributes<HTMLInputElement>>;
|
|
10
|
+
export declare const Textarea: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & {
|
|
11
|
+
label?: string;
|
|
12
|
+
} & import("react").RefAttributes<HTMLTextAreaElement>>;
|
|
13
|
+
export { BaseInput };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { Menu as BaseMenu } from '@base-ui/react/menu';
|
|
2
|
+
import { type ReactElement, type ReactNode } from 'react';
|
|
3
|
+
import './Menu.css';
|
|
4
|
+
type MenuItemData = {
|
|
5
|
+
label: string;
|
|
6
|
+
icon?: ReactNode;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
onClick?: () => void;
|
|
9
|
+
};
|
|
10
|
+
type MenuProps = {
|
|
11
|
+
trigger: ReactElement;
|
|
12
|
+
items: (MenuItemData | 'separator')[];
|
|
13
|
+
className?: string;
|
|
14
|
+
};
|
|
15
|
+
export declare function Menu({ trigger, items, className }: MenuProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export { BaseMenu };
|
|
17
|
+
export type { MenuProps, MenuItemData };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { Menubar as BaseMenubar } from '@base-ui/react/menubar';
|
|
2
|
+
import { type ReactNode } from 'react';
|
|
3
|
+
import './Menu.css';
|
|
4
|
+
import './Menubar.css';
|
|
5
|
+
export type MenubarMenu = {
|
|
6
|
+
label: string;
|
|
7
|
+
items: {
|
|
8
|
+
label: string;
|
|
9
|
+
icon?: ReactNode;
|
|
10
|
+
disabled?: boolean;
|
|
11
|
+
}[];
|
|
12
|
+
};
|
|
13
|
+
export type MenubarProps = {
|
|
14
|
+
menus: MenubarMenu[];
|
|
15
|
+
className?: string;
|
|
16
|
+
};
|
|
17
|
+
export declare function Menubar({ menus, className }: MenubarProps): import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
export { BaseMenubar };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Meter as BaseMeter } from '@base-ui/react/meter';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Meter.css';
|
|
4
|
+
export type MeterProps = ComponentPropsWithoutRef<typeof BaseMeter.Root> & {
|
|
5
|
+
showValue?: boolean;
|
|
6
|
+
};
|
|
7
|
+
export declare const Meter: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").MeterRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
8
|
+
showValue?: boolean;
|
|
9
|
+
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import './NavigationMenu.css';
|
|
2
|
+
type NavMenuItem = {
|
|
3
|
+
label: string;
|
|
4
|
+
href?: string;
|
|
5
|
+
children?: {
|
|
6
|
+
label: string;
|
|
7
|
+
href: string;
|
|
8
|
+
description?: string;
|
|
9
|
+
}[];
|
|
10
|
+
};
|
|
11
|
+
type NavigationMenuProps = {
|
|
12
|
+
items: NavMenuItem[];
|
|
13
|
+
className?: string;
|
|
14
|
+
};
|
|
15
|
+
export declare function NavigationMenu({ items, className }: NavigationMenuProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export type { NavigationMenuProps, NavMenuItem };
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { NumberField as BaseNumberField } from '@base-ui/react/number-field';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './NumberField.css';
|
|
4
|
+
export type NumberFieldProps = ComponentPropsWithoutRef<typeof BaseNumberField.Root> & {
|
|
5
|
+
label?: string;
|
|
6
|
+
};
|
|
7
|
+
export declare function NumberField({ label, className, ...rest }: NumberFieldProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export { BaseNumberField };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { OTPFieldPreview as BaseOtpField } from '@base-ui/react/otp-field';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './OtpField.css';
|
|
4
|
+
export type OtpFieldProps = ComponentPropsWithoutRef<typeof BaseOtpField.Root> & {
|
|
5
|
+
length?: number;
|
|
6
|
+
label?: string;
|
|
7
|
+
};
|
|
8
|
+
export declare function OtpField({ length, label, className, ...rest }: OtpFieldProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export { BaseOtpField };
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { Popover as BasePopover } from '@base-ui/react/popover';
|
|
2
|
+
import { type ReactElement, type ReactNode } from 'react';
|
|
3
|
+
import './Popover.css';
|
|
4
|
+
type PopoverProps = {
|
|
5
|
+
trigger: ReactElement;
|
|
6
|
+
title?: string;
|
|
7
|
+
description?: string;
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
className?: string;
|
|
10
|
+
};
|
|
11
|
+
export declare function Popover({ trigger, title, description, children, className }: PopoverProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export { BasePopover };
|
|
13
|
+
export type { PopoverProps };
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { PreviewCard as BasePreviewCard } from '@base-ui/react/preview-card';
|
|
2
|
+
import { type ReactElement } from 'react';
|
|
3
|
+
import './PreviewCard.css';
|
|
4
|
+
type PreviewCardProps = {
|
|
5
|
+
trigger: ReactElement;
|
|
6
|
+
title: string;
|
|
7
|
+
description?: string;
|
|
8
|
+
imageUrl?: string;
|
|
9
|
+
imageAlt?: string;
|
|
10
|
+
className?: string;
|
|
11
|
+
};
|
|
12
|
+
export declare function PreviewCard({ trigger, title, description, imageUrl, imageAlt, className, }: PreviewCardProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export { BasePreviewCard };
|
|
14
|
+
export type { PreviewCardProps };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Progress as BaseProgress } from '@base-ui/react/progress';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Progress.css';
|
|
4
|
+
export type ProgressProps = ComponentPropsWithoutRef<typeof BaseProgress.Root> & {
|
|
5
|
+
showValue?: boolean;
|
|
6
|
+
};
|
|
7
|
+
export declare const Progress: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ProgressRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
8
|
+
showValue?: boolean;
|
|
9
|
+
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Radio as BaseRadio } from '@base-ui/react/radio';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './RadioGroup.css';
|
|
4
|
+
export type RadioProps = ComponentPropsWithoutRef<typeof BaseRadio.Root> & {
|
|
5
|
+
label?: string;
|
|
6
|
+
};
|
|
7
|
+
export declare function Radio({ label, className, ...rest }: RadioProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export { BaseRadio };
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { RadioGroup as BaseRadioGroup } from '@base-ui/react/radio-group';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './RadioGroup.css';
|
|
4
|
+
type RadioOption = {
|
|
5
|
+
value: string;
|
|
6
|
+
label: string;
|
|
7
|
+
};
|
|
8
|
+
type RadioGroupProps = Omit<ComponentPropsWithoutRef<typeof BaseRadioGroup>, 'defaultValue'> & {
|
|
9
|
+
options: RadioOption[];
|
|
10
|
+
defaultValue?: string;
|
|
11
|
+
};
|
|
12
|
+
export declare function RadioGroup({ options, defaultValue, className, ...rest }: RadioGroupProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export type { RadioGroupProps, RadioOption };
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { ScrollArea as BaseScrollArea } from '@base-ui/react/scroll-area';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './ScrollArea.css';
|
|
4
|
+
export type ScrollAreaProps = ComponentPropsWithoutRef<typeof BaseScrollArea.Root>;
|
|
5
|
+
export declare const ScrollArea: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ScrollAreaRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Select as BaseSelect } from '@base-ui/react/select';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Select.css';
|
|
4
|
+
export type SelectProps = Omit<ComponentPropsWithoutRef<typeof BaseSelect.Root>, 'items'> & {
|
|
5
|
+
items: Record<string, string>;
|
|
6
|
+
label?: string;
|
|
7
|
+
placeholder?: string;
|
|
8
|
+
};
|
|
9
|
+
export declare function Select({ items, label, placeholder, defaultValue, ...rest }: SelectProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { Separator as BaseSeparator } from '@base-ui/react/separator';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Separator.css';
|
|
4
|
+
export type SeparatorProps = ComponentPropsWithoutRef<typeof BaseSeparator>;
|
|
5
|
+
export declare const Separator: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").SeparatorProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Slider as BaseSlider } from '@base-ui/react/slider';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Slider.css';
|
|
4
|
+
export type SliderProps = ComponentPropsWithoutRef<typeof BaseSlider.Root>;
|
|
5
|
+
export declare const Slider: import("react").ForwardRefExoticComponent<Omit<BaseSlider.Root.Props<number | readonly number[]> & {
|
|
6
|
+
ref?: React.Ref<HTMLDivElement> | undefined;
|
|
7
|
+
}, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Switch as BaseSwitch } from '@base-ui/react/switch';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Switch.css';
|
|
4
|
+
export type SwitchProps = ComponentPropsWithoutRef<typeof BaseSwitch.Root> & {
|
|
5
|
+
label?: string;
|
|
6
|
+
};
|
|
7
|
+
export declare const Switch: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").SwitchRootProps, "ref"> & import("react").RefAttributes<HTMLElement>, "ref"> & {
|
|
8
|
+
label?: string;
|
|
9
|
+
} & import("react").RefAttributes<HTMLButtonElement>>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { Tabs as BaseTabs } from '@base-ui/react/tabs';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Tabs.css';
|
|
4
|
+
type TabPanel = {
|
|
5
|
+
value: string;
|
|
6
|
+
label: string;
|
|
7
|
+
title?: string;
|
|
8
|
+
content: string;
|
|
9
|
+
};
|
|
10
|
+
type TabsProps = Omit<ComponentPropsWithoutRef<typeof BaseTabs.Root>, 'defaultValue'> & {
|
|
11
|
+
panels: TabPanel[];
|
|
12
|
+
defaultValue?: string;
|
|
13
|
+
};
|
|
14
|
+
export declare function Tabs({ panels, defaultValue, className, ...rest }: TabsProps): import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
export { BaseTabs };
|
|
16
|
+
export type { TabsProps, TabPanel };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
2
|
+
import './Toast.css';
|
|
3
|
+
type ToastProviderProps = {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
};
|
|
6
|
+
export declare function ToastProvider({ children }: ToastProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export type { ToastProviderProps };
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { Toggle as BaseToggle } from '@base-ui/react/toggle';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './ToggleGroup.css';
|
|
4
|
+
export type ToggleProps = ComponentPropsWithoutRef<typeof BaseToggle>;
|
|
5
|
+
export declare const Toggle: import("react").ForwardRefExoticComponent<Omit<BaseToggle.Props<string> & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ToggleGroup as BaseToggleGroup } from '@base-ui/react/toggle-group';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './ToggleGroup.css';
|
|
4
|
+
type ToggleOption = {
|
|
5
|
+
value: string;
|
|
6
|
+
label: string;
|
|
7
|
+
};
|
|
8
|
+
type ToggleGroupProps = Omit<ComponentPropsWithoutRef<typeof BaseToggleGroup>, 'defaultValue'> & {
|
|
9
|
+
options: ToggleOption[];
|
|
10
|
+
defaultValue?: string[];
|
|
11
|
+
};
|
|
12
|
+
export declare function ToggleGroup({ options, defaultValue, className, ...rest }: ToggleGroupProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export type { ToggleGroupProps, ToggleOption };
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Toolbar as BaseToolbar } from '@base-ui/react/toolbar';
|
|
2
|
+
import { type ComponentPropsWithoutRef } from 'react';
|
|
3
|
+
import './Toolbar.css';
|
|
4
|
+
export type ToolbarProps = ComponentPropsWithoutRef<typeof BaseToolbar.Root> & {
|
|
5
|
+
showSearch?: boolean;
|
|
6
|
+
};
|
|
7
|
+
export declare function Toolbar({ className, showSearch, ...rest }: ToolbarProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export { BaseToolbar };
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { Tooltip as BaseTooltip } from '@base-ui/react/tooltip';
|
|
2
|
+
import { type ReactElement, type ReactNode } from 'react';
|
|
3
|
+
import './Tooltip.css';
|
|
4
|
+
type TooltipProps = {
|
|
5
|
+
content: ReactNode;
|
|
6
|
+
children: ReactElement;
|
|
7
|
+
className?: string;
|
|
8
|
+
};
|
|
9
|
+
export declare function Tooltip({ content, children, className }: TooltipProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare namespace Tooltip {
|
|
11
|
+
var Provider: import("react").FC<import("@base-ui/react").TooltipProviderProps>;
|
|
12
|
+
}
|
|
13
|
+
export { BaseTooltip };
|
|
14
|
+
export type { TooltipProps };
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
export { Accordion } from './Accordion';
|
|
2
|
+
export { AlertDialog } from './AlertDialog';
|
|
3
|
+
export { Autocomplete } from './Autocomplete';
|
|
4
|
+
export { Avatar, AvatarGroup } from './Avatar';
|
|
5
|
+
export { Button } from './Button';
|
|
6
|
+
export { Checkbox } from './Checkbox';
|
|
7
|
+
export { CheckboxGroup } from './CheckboxGroup';
|
|
8
|
+
export { Collapsible } from './Collapsible';
|
|
9
|
+
export { Combobox } from './Combobox';
|
|
10
|
+
export { ContextMenu } from './ContextMenu';
|
|
11
|
+
export { CspProvider } from './CspProvider';
|
|
12
|
+
export { Dialog } from './Dialog';
|
|
13
|
+
export { DirectionProvider } from './DirectionProvider';
|
|
14
|
+
export { useDirection } from './useDirection';
|
|
15
|
+
export { Drawer } from './Drawer';
|
|
16
|
+
export { Field } from './Field';
|
|
17
|
+
export { Fieldset } from './Fieldset';
|
|
18
|
+
export { Form } from './Form';
|
|
19
|
+
export { Input, Textarea } from './Input';
|
|
20
|
+
export { Menu } from './Menu';
|
|
21
|
+
export { Menubar } from './Menubar';
|
|
22
|
+
export { Meter } from './Meter';
|
|
23
|
+
export { NavigationMenu } from './NavigationMenu';
|
|
24
|
+
export { NumberField } from './NumberField';
|
|
25
|
+
export { OtpField } from './OtpField';
|
|
26
|
+
export { Popover } from './Popover';
|
|
27
|
+
export { PreviewCard } from './PreviewCard';
|
|
28
|
+
export { Progress } from './Progress';
|
|
29
|
+
export { Radio } from './Radio';
|
|
30
|
+
export { RadioGroup } from './RadioGroup';
|
|
31
|
+
export { ScrollArea } from './ScrollArea';
|
|
32
|
+
export { Select } from './Select';
|
|
33
|
+
export { Separator } from './Separator';
|
|
34
|
+
export { Slider } from './Slider';
|
|
35
|
+
export { Switch } from './Switch';
|
|
36
|
+
export { Tabs } from './Tabs';
|
|
37
|
+
export { Toggle } from './Toggle';
|
|
38
|
+
export { ToastProvider } from './Toast';
|
|
39
|
+
export { useToastManager } from './useToastManager';
|
|
40
|
+
export { ToggleGroup } from './ToggleGroup';
|
|
41
|
+
export { Toolbar } from './Toolbar';
|
|
42
|
+
export { Tooltip } from './Tooltip';
|
|
43
|
+
export type { AccordionItem, AccordionProps } from './Accordion';
|
|
44
|
+
export type { AlertDialogProps } from './AlertDialog';
|
|
45
|
+
export type { AutocompleteOption, AutocompleteProps } from './Autocomplete';
|
|
46
|
+
export type { AvatarProps } from './Avatar';
|
|
47
|
+
export type { ButtonProps } from './Button';
|
|
48
|
+
export type { CheckboxProps } from './Checkbox';
|
|
49
|
+
export type { CheckboxGroupOption, CheckboxGroupProps } from './CheckboxGroup';
|
|
50
|
+
export type { CollapsibleProps } from './Collapsible';
|
|
51
|
+
export type { ComboboxOption, ComboboxProps } from './Combobox';
|
|
52
|
+
export type { ContextMenuItemData, ContextMenuProps } from './ContextMenu';
|
|
53
|
+
export type { CspProviderProps } from './CspProvider';
|
|
54
|
+
export type { DialogProps } from './Dialog';
|
|
55
|
+
export type { DirectionProviderProps, TextDirection } from './DirectionProvider';
|
|
56
|
+
export type { DrawerProps } from './Drawer';
|
|
57
|
+
export type { FieldProps } from './Field';
|
|
58
|
+
export type { FieldsetProps } from './Fieldset';
|
|
59
|
+
export type { FormProps } from './Form';
|
|
60
|
+
export type { InputProps } from './Input';
|
|
61
|
+
export type { MenuItemData, MenuProps } from './Menu';
|
|
62
|
+
export type { MenubarMenu, MenubarProps } from './Menubar';
|
|
63
|
+
export type { MeterProps } from './Meter';
|
|
64
|
+
export type { NavMenuItem, NavigationMenuProps } from './NavigationMenu';
|
|
65
|
+
export type { NumberFieldProps } from './NumberField';
|
|
66
|
+
export type { OtpFieldProps } from './OtpField';
|
|
67
|
+
export type { PopoverProps } from './Popover';
|
|
68
|
+
export type { PreviewCardProps } from './PreviewCard';
|
|
69
|
+
export type { ProgressProps } from './Progress';
|
|
70
|
+
export type { RadioProps } from './Radio';
|
|
71
|
+
export type { RadioGroupProps, RadioOption } from './RadioGroup';
|
|
72
|
+
export type { ScrollAreaProps } from './ScrollArea';
|
|
73
|
+
export type { SelectProps } from './Select';
|
|
74
|
+
export type { SeparatorProps } from './Separator';
|
|
75
|
+
export type { SliderProps } from './Slider';
|
|
76
|
+
export type { SwitchProps } from './Switch';
|
|
77
|
+
export type { TabPanel, TabsProps } from './Tabs';
|
|
78
|
+
export type { ToggleProps } from './Toggle';
|
|
79
|
+
export type { ToastProviderProps } from './Toast';
|
|
80
|
+
export type { ToggleGroupProps, ToggleOption } from './ToggleGroup';
|
|
81
|
+
export type { ToolbarProps } from './Toolbar';
|
|
82
|
+
export type { TooltipProps } from './Tooltip';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { useDirection } from '@base-ui/react/direction-provider';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
type Theme = 'light' | 'dark' | 'system';
|
|
2
|
+
type ThemeStyle = 'bento' | 'shadcn' | 'neo-brutalism';
|
|
3
|
+
export declare function useTheme(): {
|
|
4
|
+
theme: Theme;
|
|
5
|
+
setTheme: (t: Theme) => void;
|
|
6
|
+
resolved: "light" | "dark";
|
|
7
|
+
style: ThemeStyle;
|
|
8
|
+
setStyle: (nextStyle: ThemeStyle) => void;
|
|
9
|
+
};
|
|
10
|
+
export type { Theme, ThemeStyle };
|