add triggerStyle prop to Select and use it for font selector
This commit is contained in:
@@ -100,6 +100,7 @@ export const SettingsGeneral: Component = () => {
|
|||||||
onSelect={(option) => option && settings.appearance.setFont(option.value)}
|
onSelect={(option) => option && settings.appearance.setFont(option.value)}
|
||||||
variant="secondary"
|
variant="secondary"
|
||||||
size="small"
|
size="small"
|
||||||
|
triggerStyle={{ "font-family": monoFontFamily(settings.appearance.font()) }}
|
||||||
>
|
>
|
||||||
{(option) => <span style={{ "font-family": monoFontFamily(option?.value) }}>{option?.label}</span>}
|
{(option) => <span style={{ "font-family": monoFontFamily(option?.value) }}>{option?.label}</span>}
|
||||||
</Select>
|
</Select>
|
||||||
|
|||||||
@@ -16,6 +16,7 @@ export type SelectProps<T> = Omit<ComponentProps<typeof Kobalte<T>>, "value" | "
|
|||||||
class?: ComponentProps<"div">["class"]
|
class?: ComponentProps<"div">["class"]
|
||||||
classList?: ComponentProps<"div">["classList"]
|
classList?: ComponentProps<"div">["classList"]
|
||||||
children?: (item: T | undefined) => JSX.Element
|
children?: (item: T | undefined) => JSX.Element
|
||||||
|
triggerStyle?: JSX.CSSProperties
|
||||||
}
|
}
|
||||||
|
|
||||||
export function Select<T>(props: SelectProps<T> & ButtonProps) {
|
export function Select<T>(props: SelectProps<T> & ButtonProps) {
|
||||||
@@ -32,6 +33,7 @@ export function Select<T>(props: SelectProps<T> & ButtonProps) {
|
|||||||
"onHighlight",
|
"onHighlight",
|
||||||
"onOpenChange",
|
"onOpenChange",
|
||||||
"children",
|
"children",
|
||||||
|
"triggerStyle",
|
||||||
])
|
])
|
||||||
|
|
||||||
const state = {
|
const state = {
|
||||||
@@ -127,6 +129,7 @@ export function Select<T>(props: SelectProps<T> & ButtonProps) {
|
|||||||
as={Button}
|
as={Button}
|
||||||
size={props.size}
|
size={props.size}
|
||||||
variant={props.variant}
|
variant={props.variant}
|
||||||
|
style={local.triggerStyle}
|
||||||
classList={{
|
classList={{
|
||||||
...(local.classList ?? {}),
|
...(local.classList ?? {}),
|
||||||
[local.class ?? ""]: !!local.class,
|
[local.class ?? ""]: !!local.class,
|
||||||
|
|||||||
Reference in New Issue
Block a user