rename combobox to dropdown

This commit is contained in:
Chris Kruining 2025-01-07 07:34:46 +01:00
parent 7f71f83a59
commit 7b3e7e9ca2
No known key found for this signature in database
GPG key ID: EB894A3560CCCAD2
4 changed files with 8 additions and 8 deletions

View file

@ -2,7 +2,7 @@ import { Component, createContext, createEffect, createResource, Match, ParentCo
import { action, query, useAction } from "@solidjs/router";
import { useSession } from "vinxi/http";
import { createStore } from "solid-js/store";
import { ComboBox } from "./combobox";
import { Dropdown } from "./dropdown";
import { WiMoonAltFull, WiMoonAltNew, WiMoonAltFirstQuarter } from "solid-icons/wi";
import css from './colorschemepicker.module.css';
@ -90,7 +90,7 @@ export const ColorSchemePicker: Component = (props) => {
return <>
<label aria-label="Color scheme picker">
<ComboBox id="color-scheme-picker" class={css.picker} value={theme.colorScheme} setValue={(next) => setColorScheme(next())} values={colorSchemes}>{
<Dropdown id="color-scheme-picker" class={css.picker} value={theme.colorScheme} setValue={(next) => setColorScheme(next())} values={colorSchemes}>{
(k, v) => <>
<Switch>
<Match when={k === ColorScheme.Auto}><WiMoonAltFirstQuarter /></Match>
@ -99,7 +99,7 @@ export const ColorSchemePicker: Component = (props) => {
</Switch>
{v}
</>
}</ComboBox>
}</Dropdown>
</label>
<label class={css.hue} aria-label="Hue slider">

View file

@ -2,7 +2,7 @@ import { createMemo, createSignal, For, JSX, Setter, createEffect, Show } from "
import css from './index.module.css';
import { FaSolidAngleDown } from "solid-icons/fa";
interface ComboBoxProps<T, K extends string> {
interface DropdownProps<T, K extends string> {
id: string;
class?: string;
value: K;
@ -14,7 +14,7 @@ interface ComboBoxProps<T, K extends string> {
filter?: (query: string, key: K, value: T) => boolean;
}
export function ComboBox<T, K extends string>(props: ComboBoxProps<T, K>) {
export function Dropdown<T, K extends string>(props: DropdownProps<T, K>) {
const [dialog, setDialog] = createSignal<HTMLDialogElement>();
const [value, setValue] = createSignal<K>(props.value);
const [open, setOpen] = createSignal<boolean>(props.open ?? false);

View file

@ -1,7 +1,7 @@
import { Component } from "solid-js";
import { internal_useI18n } from "./context";
import { locales } from "./constants";
import { ComboBox } from "~/components/combobox";
import { Dropdown } from "~/components/dropdown";
import { Dynamic } from "solid-js/web";
import css from './picker.module.css';
@ -10,7 +10,7 @@ interface LocalePickerProps { }
export const LocalePicker: Component<LocalePickerProps> = (props) => {
const { locale, setLocale } = internal_useI18n();
return <ComboBox
return <Dropdown
id="locale-picker"
class={css.box}
value={locale()}
@ -19,5 +19,5 @@ export const LocalePicker: Component<LocalePickerProps> = (props) => {
showCaret={false}
>
{(locale, { flag, label }) => <Dynamic component={flag} lang={locale} aria-label={label} class={css.flag} />}
</ComboBox>
</Dropdown>
};