# Types: ButtonProps to SheetTitleProps (/themes/sdk/reference/ui/types-1)

```ts
import { … } from '@poltura/theme-sdk/ui';
```

## `ButtonProps` [#buttonprops]

Props of [`Button`](/themes/sdk/reference/ui/parts-1#button).

```ts
type ButtonProps = ComponentPropsWithoutRef<'button'> & {
    variant?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link';
    size?: 'default' | 'sm' | 'lg' | 'icon';
    asChild?: boolean;
}
```

## `BadgeProps` [#badgeprops]

Props of [`Badge`](/themes/sdk/reference/ui/parts-1#badge).

<TypeTable type={{"variant":{"description":"The look of the badge; defaults to `default`.","type":"'default' | 'secondary' | 'destructive' | 'outline'","required":false}}} />

## `CardProps` [#cardprops]

Props of [`Card`](/themes/sdk/reference/ui/parts-1#card).

```ts
type CardProps = HTMLAttributes<HTMLDivElement>
```

## `CardHeaderProps` [#cardheaderprops]

Props of [`CardHeader`](/themes/sdk/reference/ui/parts-1#cardheader).

```ts
type CardHeaderProps = HTMLAttributes<HTMLDivElement>
```

## `CardTitleProps` [#cardtitleprops]

Props of [`CardTitle`](/themes/sdk/reference/ui/parts-1#cardtitle).

```ts
type CardTitleProps = HTMLAttributes<HTMLHeadingElement>
```

## `CardDescriptionProps` [#carddescriptionprops]

Props of [`CardDescription`](/themes/sdk/reference/ui/parts-1#carddescription).

```ts
type CardDescriptionProps = HTMLAttributes<HTMLParagraphElement>
```

## `CardContentProps` [#cardcontentprops]

Props of [`CardContent`](/themes/sdk/reference/ui/parts-1#cardcontent).

```ts
type CardContentProps = HTMLAttributes<HTMLDivElement>
```

## `CardFooterProps` [#cardfooterprops]

Props of [`CardFooter`](/themes/sdk/reference/ui/parts-1#cardfooter).

```ts
type CardFooterProps = HTMLAttributes<HTMLDivElement>
```

## `InputProps` [#inputprops]

Props of [`Input`](/themes/sdk/reference/ui/parts-1#input).

```ts
type InputProps = ComponentPropsWithoutRef<'input'>
```

## `LabelProps` [#labelprops]

Props of [`Label`](/themes/sdk/reference/ui/parts-1#label).

```ts
type LabelProps = ComponentPropsWithoutRef<'label'>
```

## `TextareaProps` [#textareaprops]

Props of [`Textarea`](/themes/sdk/reference/ui/parts-1#textarea).

```ts
type TextareaProps = ComponentPropsWithoutRef<'textarea'>
```

## `CheckboxProps` [#checkboxprops]

Props of [`Checkbox`](/themes/sdk/reference/ui/parts-1#checkbox).

```ts
type CheckboxProps = Omit<ComponentPropsWithoutRef<'button'>, 'checked' | 'defaultChecked' | 'onChange' | 'value'> & {
    checked?: boolean;
    defaultChecked?: boolean;
    onCheckedChange?: (checked: boolean) => void;
    required?: boolean;
}
```

## `SelectProps` [#selectprops]

Props of [`Select`](/themes/sdk/reference/ui/parts-1#select).

<TypeTable type={{"value":{"description":"The chosen value, when the parent controls it.","type":"string","required":false},"defaultValue":{"description":"The value chosen at first, when the select keeps its own state.","type":"string","required":false},"onValueChange":{"description":"Called with the new value when the shopper picks an item.","type":"(value: string) => void","required":false},"open":{"description":"Whether the select is open, when the parent controls it.","type":"boolean","required":false},"defaultOpen":{"description":"Whether the select starts open.","type":"boolean","required":false},"onOpenChange":{"description":"Called when the list opens or closes.","type":"(open: boolean) => void","required":false},"disabled":{"description":"Stops the shopper from changing the value.","type":"boolean","required":false},"name":{"description":"The field name submitted with a form.","type":"string","required":false},"required":{"description":"Marks the field as required in a form.","type":"boolean","required":false},"children":{"description":"The trigger and the list of items.","type":"ReactNode","required":false}}} />

## `SelectTriggerProps` [#selecttriggerprops]

Props of [`SelectTrigger`](/themes/sdk/reference/ui/parts-2#selecttrigger).

```ts
type SelectTriggerProps = ComponentPropsWithoutRef<'button'>
```

## `SelectValueProps` [#selectvalueprops]

Props of [`SelectValue`](/themes/sdk/reference/ui/parts-2#selectvalue).

<TypeTable type={{"placeholder":{"description":"The text shown while nothing is chosen.","type":"ReactNode","required":false},"className":{"description":"Classes added to the value.","type":"string","required":false},"children":{"description":"Replaces the chosen item's text.","type":"ReactNode","required":false}}} />

## `SelectContentProps` [#selectcontentprops]

Props of [`SelectContent`](/themes/sdk/reference/ui/parts-2#selectcontent).

<TypeTable type={{"className":{"description":"Classes added to the list.","type":"string","required":false},"position":{"description":"Opens the list over the trigger (`item-aligned`) or beside it (`popper`, the default).","type":"'item-aligned' | 'popper'","required":false},"side":{"description":"The preferred side of the trigger to open on.","type":"'top' | 'right' | 'bottom' | 'left'","required":false},"align":{"description":"The alignment against the trigger.","type":"'start' | 'center' | 'end'","required":false},"children":{"description":"The {@link SelectItem} elements.","type":"ReactNode","required":false}}} />

## `SelectItemProps` [#selectitemprops]

Props of [`SelectItem`](/themes/sdk/reference/ui/parts-2#selectitem).

<TypeTable type={{"value":{"description":"The value the select takes when this item is picked; never an empty string.","type":"string","required":true},"disabled":{"description":"Stops the shopper from picking the item.","type":"boolean","required":false},"textValue":{"description":"The text used for typeahead and shown in the trigger, when the children are not plain text.","type":"string","required":false},"className":{"description":"Classes added to the item.","type":"string","required":false},"children":{"description":"The item's label.","type":"ReactNode","required":false}}} />

## `DialogProps` [#dialogprops]

Props of [`Dialog`](/themes/sdk/reference/ui/parts-2#dialog).

<TypeTable type={{"open":{"description":"Whether it is open, when you hold that state.","type":"boolean","required":false},"defaultOpen":{"description":"Whether it starts open, when it holds that state itself.","type":"boolean","required":false},"onOpenChange":{"description":"Called with the new state when the shopper opens or closes it.","type":"(open: boolean) => void","required":false},"children":{"description":"Its {@link DialogContent}.","type":"ReactNode","required":false}}} />

## `DialogContentProps` [#dialogcontentprops]

Props of [`DialogContent`](/themes/sdk/reference/ui/parts-2#dialogcontent).

<TypeTable type={{"showCloseButton":{"description":"Whether the close button sits in the corner; true when omitted.","type":"boolean","required":false}}} />

## `DialogHeaderProps` [#dialogheaderprops]

Props of [`DialogHeader`](/themes/sdk/reference/ui/parts-2#dialogheader).

```ts
type DialogHeaderProps = HTMLAttributes<HTMLDivElement>
```

## `DialogFooterProps` [#dialogfooterprops]

Props of [`DialogFooter`](/themes/sdk/reference/ui/parts-2#dialogfooter).

```ts
type DialogFooterProps = HTMLAttributes<HTMLDivElement>
```

## `DialogTitleProps` [#dialogtitleprops]

Props of [`DialogTitle`](/themes/sdk/reference/ui/parts-2#dialogtitle).

```ts
type DialogTitleProps = HTMLAttributes<HTMLHeadingElement>
```

## `DialogDescriptionProps` [#dialogdescriptionprops]

Props of [`DialogDescription`](/themes/sdk/reference/ui/parts-2#dialogdescription).

```ts
type DialogDescriptionProps = HTMLAttributes<HTMLParagraphElement>
```

## `DropdownMenuProps` [#dropdownmenuprops]

Props of [`DropdownMenu`](/themes/sdk/reference/ui/parts-3#dropdownmenu).

<TypeTable type={{"open":{"description":"Whether it is open, when you hold that state.","type":"boolean","required":false},"defaultOpen":{"description":"Whether it starts open, when it holds that state itself.","type":"boolean","required":false},"onOpenChange":{"description":"Called with the new state when the shopper opens or closes it.","type":"(open: boolean) => void","required":false},"children":{"description":"Its {@link DropdownMenuTrigger} and {@link DropdownMenuContent}.","type":"ReactNode","required":false}}} />

## `DropdownMenuTriggerProps` [#dropdownmenutriggerprops]

Props of [`DropdownMenuTrigger`](/themes/sdk/reference/ui/parts-3#dropdownmenutrigger).

<TypeTable type={{"asChild":{"description":"Makes its one child, such as your own `<button>`, the trigger instead of a button around it.","type":"boolean","required":false}}} />

## `DropdownMenuContentProps` [#dropdownmenucontentprops]

Props of [`DropdownMenuContent`](/themes/sdk/reference/ui/parts-3#dropdownmenucontent).

<TypeTable type={{"align":{"description":"Which edge of the button it lines up with; defaults to `center`.","type":"'start' | 'center' | 'end'","required":false},"sideOffset":{"description":"The gap from the button in pixels; defaults to 4.","type":"number","required":false}}} />

## `DropdownMenuItemProps` [#dropdownmenuitemprops]

Props of [`DropdownMenuItem`](/themes/sdk/reference/ui/parts-3#dropdownmenuitem).

```ts
type DropdownMenuItemProps = Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'> & {
    onSelect?: (event: Event) => void;
    disabled?: boolean;
    asChild?: boolean;
}
```

## `SheetProps` [#sheetprops]

Props of [`Sheet`](/themes/sdk/reference/ui/parts-3#sheet).

<TypeTable type={{"open":{"description":"Whether it is open, when you hold that state.","type":"boolean","required":false},"defaultOpen":{"description":"Whether it starts open, when it holds that state itself.","type":"boolean","required":false},"onOpenChange":{"description":"Called with the new state when the shopper opens or closes it.","type":"(open: boolean) => void","required":false},"modal":{"description":"Keeps focus inside and dims the page while open; true when omitted.","type":"boolean","required":false},"children":{"description":"Its {@link SheetContent}.","type":"ReactNode","required":false}}} />

## `SheetContentProps` [#sheetcontentprops]

Props of [`SheetContent`](/themes/sdk/reference/ui/parts-3#sheetcontent).

<TypeTable type={{"side":{"description":"The edge it slides in from; defaults to `right`.","type":"'top' | 'right' | 'bottom' | 'left'","required":false},"showCloseButton":{"description":"Whether the close button sits in the corner; true when omitted.","type":"boolean","required":false}}} />

## `SheetHeaderProps` [#sheetheaderprops]

Props of [`SheetHeader`](/themes/sdk/reference/ui/parts-3#sheetheader).

```ts
type SheetHeaderProps = HTMLAttributes<HTMLDivElement>
```

## `SheetTitleProps` [#sheettitleprops]

Props of [`SheetTitle`](/themes/sdk/reference/ui/parts-3#sheettitle).

```ts
type SheetTitleProps = HTMLAttributes<HTMLHeadingElement>
```