diff options
Diffstat (limited to 'packages/ui/src/components/select.tsx')
| -rw-r--r-- | packages/ui/src/components/select.tsx | 18 |
1 files changed, 4 insertions, 14 deletions
diff --git a/packages/ui/src/components/select.tsx b/packages/ui/src/components/select.tsx index fef00500a..0386c329e 100644 --- a/packages/ui/src/components/select.tsx +++ b/packages/ui/src/components/select.tsx @@ -1,10 +1,8 @@ import { Select as Kobalte } from "@kobalte/core/select" -import { createMemo, createSignal, onCleanup, splitProps, type ComponentProps, type JSX } from "solid-js" +import { createMemo, onCleanup, splitProps, type ComponentProps, type JSX } from "solid-js" import { pipe, groupBy, entries, map } from "remeda" -import { Show } from "solid-js" import { Button, ButtonProps } from "./button" import { Icon } from "./icon" -import { MorphChevron } from "./morph-chevron" export type SelectProps<T> = Omit<ComponentProps<typeof Kobalte<T>>, "value" | "onSelect" | "children"> & { placeholder?: string @@ -40,8 +38,6 @@ export function Select<T>(props: SelectProps<T> & Omit<ButtonProps, "children">) "triggerVariant", ]) - const [isOpen, setIsOpen] = createSignal(false) - const state = { key: undefined as string | undefined, cleanup: undefined as (() => void) | void, @@ -89,7 +85,7 @@ export function Select<T>(props: SelectProps<T> & Omit<ButtonProps, "children">) data-component="select" data-trigger-style={local.triggerVariant} placement={local.triggerVariant === "settings" ? "bottom-end" : "bottom-start"} - gutter={8} + gutter={4} value={local.current} options={grouped()} optionValue={(x) => (local.value ? local.value(x) : (x as string))} @@ -119,7 +115,7 @@ export function Select<T>(props: SelectProps<T> & Omit<ButtonProps, "children">) : (itemProps.item.rawValue as string)} </Kobalte.ItemLabel> <Kobalte.ItemIndicator data-slot="select-select-item-indicator"> - <Icon name="check" size="small" /> + <Icon name="check-small" size="small" /> </Kobalte.ItemIndicator> </Kobalte.Item> )} @@ -128,7 +124,6 @@ export function Select<T>(props: SelectProps<T> & Omit<ButtonProps, "children">) stop() }} onOpenChange={(open) => { - setIsOpen(open) local.onOpenChange?.(open) if (!open) stop() }} @@ -154,12 +149,7 @@ export function Select<T>(props: SelectProps<T> & Omit<ButtonProps, "children">) }} </Kobalte.Value> <Kobalte.Icon data-slot="select-select-trigger-icon"> - <Show when={local.triggerVariant === "settings"}> - <Icon name="selector" size="small" /> - </Show> - <Show when={local.triggerVariant !== "settings"}> - <MorphChevron expanded={isOpen()} /> - </Show> + <Icon name={local.triggerVariant === "settings" ? "selector" : "chevron-down"} size="small" /> </Kobalte.Icon> </Kobalte.Trigger> <Kobalte.Portal> |
