chore(options/i18n): fix click on label not working on select

This commit is contained in:
Elian Doran 2025-10-14 18:15:45 +03:00
parent 0c2b186e50
commit 5693b59318
No known key found for this signature in database
2 changed files with 5 additions and 6 deletions

View File

@ -1,11 +1,10 @@
import { Dropdown as BootstrapDropdown } from "bootstrap"; import { Dropdown as BootstrapDropdown } from "bootstrap";
import { ComponentChildren } from "preact"; import { ComponentChildren } from "preact";
import { CSSProperties } from "preact/compat"; import { CSSProperties, HTMLProps } from "preact/compat";
import { useCallback, useEffect, useRef, useState } from "preact/hooks"; import { useCallback, useEffect, useRef, useState } from "preact/hooks";
import { useUniqueName } from "./hooks"; import { useUniqueName } from "./hooks";
export interface DropdownProps { export interface DropdownProps extends Pick<HTMLProps<HTMLDivElement>, "id" | "className"> {
className?: string;
buttonClassName?: string; buttonClassName?: string;
isStatic?: boolean; isStatic?: boolean;
children: ComponentChildren; children: ComponentChildren;
@ -22,7 +21,7 @@ export interface DropdownProps {
forceShown?: boolean; forceShown?: boolean;
} }
export default function Dropdown({ className, buttonClassName, isStatic, children, title, text, dropdownContainerStyle, dropdownContainerClassName, hideToggleArrow, iconAction, disabled, noSelectButtonStyle, noDropdownListStyle, forceShown }: DropdownProps) { export default function Dropdown({ id, className, buttonClassName, isStatic, children, title, text, dropdownContainerStyle, dropdownContainerClassName, hideToggleArrow, iconAction, disabled, noSelectButtonStyle, noDropdownListStyle, forceShown }: DropdownProps) {
const dropdownRef = useRef<HTMLDivElement | null>(null); const dropdownRef = useRef<HTMLDivElement | null>(null);
const triggerRef = useRef<HTMLButtonElement | null>(null); const triggerRef = useRef<HTMLButtonElement | null>(null);
@ -74,7 +73,7 @@ export default function Dropdown({ className, buttonClassName, isStatic, childre
aria-haspopup="true" aria-haspopup="true"
aria-expanded="false" aria-expanded="false"
title={title} title={title}
id={ariaId} id={id ?? ariaId}
disabled={disabled} disabled={disabled}
> >
{text} {text}

View File

@ -62,7 +62,7 @@ function LocalizationOptions() {
function LocaleSelector({ id, locales, currentValue, onChange }: { id?: string; locales: Locale[], currentValue: string, onChange: (newLocale: string) => void }) { function LocaleSelector({ id, locales, currentValue, onChange }: { id?: string; locales: Locale[], currentValue: string, onChange: (newLocale: string) => void }) {
const [ activeLocale, setActiveLocale ] = useState(locales.find(l => l.id === currentValue)); const [ activeLocale, setActiveLocale ] = useState(locales.find(l => l.id === currentValue));
return ( return (
<Dropdown text={activeLocale?.name}> <Dropdown id={id} text={activeLocale?.name}>
{locales.map(locale => ( {locales.map(locale => (
<FormListItem <FormListItem
checked={locale === activeLocale } checked={locale === activeLocale }