rename combobox to dropdown
This commit is contained in:
parent
7f71f83a59
commit
7b3e7e9ca2
4 changed files with 8 additions and 8 deletions
|
@ -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">
|
||||
|
|
|
@ -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);
|
|
@ -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>
|
||||
};
|
Loading…
Add table
Add a link
Reference in a new issue