@latty-ds/react 0.10.3 → 1.0.0

package/README.md

@@ -45,12 +45,13 @@ function App() {
 
 ### Events
 
-React wrappers map custom events to `onEventName` props:
+React wrappers map custom events to `onEventName` props. Like any native handler they receive the event itself, typed with its payload on `e.detail`, so `stopPropagation()`, `preventDefault()` and `target` all work:
 
 ```tsx
 <Button onClick={handleClick}>Click me</Button>
-<Switch onChange={handleChange} />
-<Textfield onInput={handleInput} />
+<Switch onChange={(e) => setOn(e.detail.checked)} />
+<Textfield onInput={(e) => setQuery(e.detail.value)} />
+<Alert closable onClose={(e) => e.stopPropagation()}>Saved</Alert>
 ```
 
 ### All components

package/dist/components/Accordion/Accordion.d.ts

@@ -7,9 +7,9 @@ export type AccordionProps = Omit<HTMLAttributes<AccordionEl>, 'onToggle'> & {
     open?: boolean;
     disabled?: boolean;
     uppercase?: boolean;
-    onToggle?: (detail: {
+    onToggle?: (event: CustomEvent<{
         open: boolean;
-    }) => void;
+    }>) => void;
 };
 export declare const Accordion: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<AccordionEl>, "onToggle"> & {
     label?: string;
@@ -18,7 +18,7 @@ export declare const Accordion: import("react").ForwardRefExoticComponent<Omit<H
     open?: boolean;
     disabled?: boolean;
     uppercase?: boolean;
-    onToggle?: (detail: {
+    onToggle?: (event: CustomEvent<{
         open: boolean;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<AccordionEl>>;

package/dist/components/Alert/Alert.d.ts

@@ -3,20 +3,26 @@ import type { Alert as AlertEl, LattyIconName } from '@latty-ds/web';
 export type AlertProps = HTMLAttributes<AlertEl> & {
     variant?: AlertEl['variant'];
     appearance?: AlertEl['appearance'];
+    heading?: string;
     title?: string;
     icon?: LattyIconName;
     closable?: boolean;
+    open?: boolean;
     background?: string;
     uppercase?: boolean;
-    onClose?: () => void;
+    labels?: AlertEl['labels'];
+    onClose?: (event: CustomEvent) => void;
 };
 export declare const Alert: import("react").ForwardRefExoticComponent<HTMLAttributes<AlertEl> & {
     variant?: AlertEl["variant"];
     appearance?: AlertEl["appearance"];
+    heading?: string;
     title?: string;
     icon?: LattyIconName;
     closable?: boolean;
+    open?: boolean;
     background?: string;
     uppercase?: boolean;
-    onClose?: () => void;
+    labels?: AlertEl["labels"];
+    onClose?: (event: CustomEvent) => void;
 } & import("react").RefAttributes<AlertEl>>;

package/dist/components/Breadcrumb/Breadcrumb.d.ts

@@ -2,7 +2,9 @@ import { type HTMLAttributes } from 'react';
 import type { Breadcrumb as BreadcrumbEl } from '@latty-ds/web';
 export type BreadcrumbProps = HTMLAttributes<BreadcrumbEl> & {
     separator?: string;
+    labels?: BreadcrumbEl['labels'];
 };
 export declare const Breadcrumb: import("react").ForwardRefExoticComponent<HTMLAttributes<BreadcrumbEl> & {
     separator?: string;
+    labels?: BreadcrumbEl["labels"];
 } & import("react").RefAttributes<BreadcrumbEl>>;

package/dist/components/Button/Button.d.ts

@@ -16,6 +16,9 @@ export type ButtonProps = HTMLAttributes<ButtonEl> & {
     target?: string;
     rel?: string;
     type?: ButtonEl['type'];
+    name?: string;
+    value?: string;
+    formAction?: string;
 };
 export declare const Button: import("react").ForwardRefExoticComponent<HTMLAttributes<ButtonEl> & {
     formAssociated?: boolean;
@@ -33,4 +36,7 @@ export declare const Button: import("react").ForwardRefExoticComponent<HTMLAttri
     target?: string;
     rel?: string;
     type?: ButtonEl["type"];
+    name?: string;
+    value?: string;
+    formAction?: string;
 } & import("react").RefAttributes<ButtonEl>>;

package/dist/components/Calendar/Calendar.d.ts

@@ -13,14 +13,17 @@ export type CalendarProps = Omit<HTMLAttributes<CalendarEl>, 'onChange'> & {
     disabled?: boolean;
     months?: number;
     disabledDates?: CalendarEl['disabledDates'];
-    onChange?: (detail: {
+    labels?: CalendarEl['labels'];
+    onChange?: (event: CustomEvent<{
+        value: string;
+    } | {
         valueStart: string;
         valueEnd: string;
-    }) => void;
-    onMonthChange?: (detail: {
+    }>) => void;
+    onMonthChange?: (event: CustomEvent<{
         year: number;
         month: number;
-    }) => void;
+    }>) => void;
 };
 export declare const Calendar: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<CalendarEl>, "onChange"> & {
     mode?: CalendarEl["mode"];
@@ -35,12 +38,15 @@ export declare const Calendar: import("react").ForwardRefExoticComponent<Omit<HT
     disabled?: boolean;
     months?: number;
     disabledDates?: CalendarEl["disabledDates"];
-    onChange?: (detail: {
+    labels?: CalendarEl["labels"];
+    onChange?: (event: CustomEvent<{
+        value: string;
+    } | {
         valueStart: string;
         valueEnd: string;
-    }) => void;
-    onMonthChange?: (detail: {
+    }>) => void;
+    onMonthChange?: (event: CustomEvent<{
         year: number;
         month: number;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<CalendarEl>>;

package/dist/components/Checkbox/Checkbox.d.ts

@@ -12,9 +12,10 @@ export type CheckboxProps = Omit<HTMLAttributes<CheckboxEl>, 'onChange'> & {
     labelPosition?: CheckboxEl['labelPosition'];
     name?: string;
     value?: string;
-    onChange?: (detail: {
+    labels?: CheckboxEl['labels'];
+    onChange?: (event: CustomEvent<{
         checked: boolean;
-    }) => void;
+    }>) => void;
 };
 export declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<CheckboxEl>, "onChange"> & {
     formAssociated?: boolean;
@@ -28,7 +29,8 @@ export declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<HT
     labelPosition?: CheckboxEl["labelPosition"];
     name?: string;
     value?: string;
-    onChange?: (detail: {
+    labels?: CheckboxEl["labels"];
+    onChange?: (event: CustomEvent<{
         checked: boolean;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<CheckboxEl>>;

package/dist/components/Chip/Chip.d.ts

@@ -7,7 +7,8 @@ export type ChipProps = HTMLAttributes<ChipEl> & {
     disabled?: boolean;
     deletable?: boolean;
     background?: string;
-    onDelete?: () => void;
+    labels?: ChipEl['labels'];
+    onDelete?: (event: CustomEvent) => void;
 };
 export declare const Chip: import("react").ForwardRefExoticComponent<HTMLAttributes<ChipEl> & {
     appearance?: ChipEl["appearance"];
@@ -16,5 +17,6 @@ export declare const Chip: import("react").ForwardRefExoticComponent<HTMLAttribu
     disabled?: boolean;
     deletable?: boolean;
     background?: string;
-    onDelete?: () => void;
+    labels?: ChipEl["labels"];
+    onDelete?: (event: CustomEvent) => void;
 } & import("react").RefAttributes<ChipEl>>;

package/dist/components/ColorInput/ColorInput.d.ts

@@ -10,9 +10,10 @@ export type ColorInputProps = Omit<HTMLAttributes<ColorInputEl>, 'onChange'> & {
     required?: boolean;
     name?: string;
     size?: ColorInputEl['size'];
-    onChange?: (detail: {
+    labels?: ColorInputEl['labels'];
+    onChange?: (event: CustomEvent<{
         value: string;
-    }) => void;
+    }>) => void;
 };
 export declare const ColorInput: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<ColorInputEl>, "onChange"> & {
     formAssociated?: boolean;
@@ -24,7 +25,8 @@ export declare const ColorInput: import("react").ForwardRefExoticComponent<Omit<
     required?: boolean;
     name?: string;
     size?: ColorInputEl["size"];
-    onChange?: (detail: {
+    labels?: ColorInputEl["labels"];
+    onChange?: (event: CustomEvent<{
         value: string;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<ColorInputEl>>;

package/dist/components/Combobox/Combobox.d.ts

@@ -12,9 +12,10 @@ export type ComboboxProps = Omit<HTMLAttributes<ComboboxEl>, 'onChange'> & {
     disabled?: boolean;
     required?: boolean;
     name?: string;
-    onChange?: (detail: {
+    labels?: ComboboxEl['labels'];
+    onChange?: (event: CustomEvent<{
         value: string;
-    }) => void;
+    }>) => void;
 };
 export declare const Combobox: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<ComboboxEl>, "onChange"> & {
     formAssociated?: boolean;
@@ -28,7 +29,8 @@ export declare const Combobox: import("react").ForwardRefExoticComponent<Omit<HT
     disabled?: boolean;
     required?: boolean;
     name?: string;
-    onChange?: (detail: {
+    labels?: ComboboxEl["labels"];
+    onChange?: (event: CustomEvent<{
         value: string;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<ComboboxEl>>;

package/dist/components/DateInput/DateInput.d.ts

@@ -17,9 +17,10 @@ export type DateInputProps = Omit<HTMLAttributes<DateInputEl>, 'onChange'> & {
     required?: boolean;
     name?: string;
     disabledDates?: DateInputEl['disabledDates'];
-    onChange?: (detail: {
+    labels?: DateInputEl['labels'];
+    onChange?: (event: CustomEvent<{
         value: string;
-    }) => void;
+    }>) => void;
 };
 export declare const DateInput: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<DateInputEl>, "onChange"> & {
     formAssociated?: boolean;
@@ -38,7 +39,8 @@ export declare const DateInput: import("react").ForwardRefExoticComponent<Omit<H
     required?: boolean;
     name?: string;
     disabledDates?: DateInputEl["disabledDates"];
-    onChange?: (detail: {
+    labels?: DateInputEl["labels"];
+    onChange?: (event: CustomEvent<{
         value: string;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<DateInputEl>>;

package/dist/components/Datepicker/Datepicker.d.ts

@@ -14,12 +14,12 @@ export type DatepickerProps = Omit<HTMLAttributes<DatepickerEl>, 'onChange' | 'o
     required?: boolean;
     readonly?: boolean;
     name?: string;
-    onChange?: (detail: {
+    onChange?: (event: CustomEvent<{
         value: string;
-    }) => void;
-    onInput?: (detail: {
+    }>) => void;
+    onInput?: (event: CustomEvent<{
         value: string;
-    }) => void;
+    }>) => void;
 };
 export declare const Datepicker: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<DatepickerEl>, "onChange" | "onInput"> & {
     formAssociated?: boolean;
@@ -35,10 +35,10 @@ export declare const Datepicker: import("react").ForwardRefExoticComponent<Omit<
     required?: boolean;
     readonly?: boolean;
     name?: string;
-    onChange?: (detail: {
+    onChange?: (event: CustomEvent<{
         value: string;
-    }) => void;
-    onInput?: (detail: {
+    }>) => void;
+    onInput?: (event: CustomEvent<{
         value: string;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<DatepickerEl>>;

package/dist/components/Dialog/Dialog.d.ts

@@ -3,6 +3,7 @@ import type { Dialog as DialogEl } from '@latty-ds/web';
 export type DialogProps = HTMLAttributes<DialogEl> & {
     size?: DialogEl['size'];
     open?: boolean;
+    heading?: string;
     title?: string;
     noCloseButton?: boolean;
     closeOnBackdropClick?: boolean;
@@ -11,14 +12,14 @@ export type DialogProps = HTMLAttributes<DialogEl> & {
     backdropBlur?: boolean;
     elevation?: DialogEl['elevation'];
     appearance?: DialogEl['appearance'];
-    onDialogOpen?: () => void;
-    onClose?: () => void;
-    onDialogClose?: () => void;
-    onOpen?: () => void;
+    labels?: DialogEl['labels'];
+    onOpen?: (event: CustomEvent) => void;
+    onClose?: (event: CustomEvent) => void;
 };
 export declare const Dialog: import("react").ForwardRefExoticComponent<HTMLAttributes<DialogEl> & {
     size?: DialogEl["size"];
     open?: boolean;
+    heading?: string;
     title?: string;
     noCloseButton?: boolean;
     closeOnBackdropClick?: boolean;
@@ -27,8 +28,7 @@ export declare const Dialog: import("react").ForwardRefExoticComponent<HTMLAttri
     backdropBlur?: boolean;
     elevation?: DialogEl["elevation"];
     appearance?: DialogEl["appearance"];
-    onDialogOpen?: () => void;
-    onClose?: () => void;
-    onDialogClose?: () => void;
-    onOpen?: () => void;
+    labels?: DialogEl["labels"];
+    onOpen?: (event: CustomEvent) => void;
+    onClose?: (event: CustomEvent) => void;
 } & import("react").RefAttributes<DialogEl>>;

package/dist/components/Dropdown/Dropdown.d.ts

@@ -3,12 +3,12 @@ import type { Dropdown as DropdownEl } from '@latty-ds/web';
 export type DropdownProps = HTMLAttributes<DropdownEl> & {
     open?: boolean;
     placement?: DropdownEl['placement'];
-    onOpen?: () => void;
-    onClose?: () => void;
+    onOpen?: (event: CustomEvent) => void;
+    onClose?: (event: CustomEvent) => void;
 };
 export declare const Dropdown: import("react").ForwardRefExoticComponent<HTMLAttributes<DropdownEl> & {
     open?: boolean;
     placement?: DropdownEl["placement"];
-    onOpen?: () => void;
-    onClose?: () => void;
+    onOpen?: (event: CustomEvent) => void;
+    onClose?: (event: CustomEvent) => void;
 } & import("react").RefAttributes<DropdownEl>>;

package/dist/components/DropdownItem/DropdownItem.d.ts

@@ -1,14 +1,14 @@
 import { type HTMLAttributes } from 'react';
 import type { DropdownItem as DropdownItemEl } from '@latty-ds/web';
-export type DropdownItemProps = HTMLAttributes<DropdownItemEl> & {
+export type DropdownItemProps = Omit<HTMLAttributes<DropdownItemEl>, 'onSelect'> & {
     disabled?: boolean;
     selected?: boolean;
     href?: string;
-    onSelect?: () => void;
+    onSelect?: (event: CustomEvent) => void;
 };
-export declare const DropdownItem: import("react").ForwardRefExoticComponent<HTMLAttributes<DropdownItemEl> & {
+export declare const DropdownItem: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<DropdownItemEl>, "onSelect"> & {
     disabled?: boolean;
     selected?: boolean;
     href?: string;
-    onSelect?: () => void;
+    onSelect?: (event: CustomEvent) => void;
 } & import("react").RefAttributes<DropdownItemEl>>;

package/dist/components/Image/Image.d.ts

@@ -1,30 +1,28 @@
 import { type HTMLAttributes } from 'react';
 import type { Image as ImageEl } from '@latty-ds/web';
-export type ImageProps = HTMLAttributes<ImageEl> & {
+export type ImageProps = Omit<HTMLAttributes<ImageEl>, 'onLoad' | 'onError'> & {
     src?: string;
     alt?: string;
     rounded?: ImageEl['rounded'];
     responsive?: boolean;
     loading?: ImageEl['loading'];
-    onName?: () => void;
-    onLoad?: (detail: {
+    onLoad?: (event: CustomEvent<{
         src: string;
-    }) => void;
-    onError?: (detail: {
+    }>) => void;
+    onError?: (event: CustomEvent<{
         src: string;
-    }) => void;
+    }>) => void;
 };
-export declare const Image: import("react").ForwardRefExoticComponent<HTMLAttributes<ImageEl> & {
+export declare const Image: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<ImageEl>, "onLoad" | "onError"> & {
     src?: string;
     alt?: string;
     rounded?: ImageEl["rounded"];
     responsive?: boolean;
     loading?: ImageEl["loading"];
-    onName?: () => void;
-    onLoad?: (detail: {
+    onLoad?: (event: CustomEvent<{
         src: string;
-    }) => void;
-    onError?: (detail: {
+    }>) => void;
+    onError?: (event: CustomEvent<{
         src: string;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<ImageEl>>;

package/dist/components/NavItem/NavItem.d.ts

@@ -1,6 +1,6 @@
 import { type HTMLAttributes } from 'react';
 import type { NavItem as NavItemEl, LattyIconName } from '@latty-ds/web';
-export type NavItemProps = HTMLAttributes<NavItemEl> & {
+export type NavItemProps = Omit<HTMLAttributes<NavItemEl>, 'onToggle'> & {
     href?: string;
     label?: string;
     iconStart?: LattyIconName;
@@ -8,10 +8,11 @@ export type NavItemProps = HTMLAttributes<NavItemEl> & {
     disabled?: boolean;
     open?: boolean;
     orientation?: NavItemEl['orientation'];
-    onNavItemClick?: (event: CustomEvent) => void;
-    onNavCollapse?: (event: CustomEvent) => void;
+    onToggle?: (event: CustomEvent<{
+        open: boolean;
+    }>) => void;
 };
-export declare const NavItem: import("react").ForwardRefExoticComponent<HTMLAttributes<NavItemEl> & {
+export declare const NavItem: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<NavItemEl>, "onToggle"> & {
     href?: string;
     label?: string;
     iconStart?: LattyIconName;
@@ -19,6 +20,7 @@ export declare const NavItem: import("react").ForwardRefExoticComponent<HTMLAttr
     disabled?: boolean;
     open?: boolean;
     orientation?: NavItemEl["orientation"];
-    onNavItemClick?: (event: CustomEvent) => void;
-    onNavCollapse?: (event: CustomEvent) => void;
+    onToggle?: (event: CustomEvent<{
+        open: boolean;
+    }>) => void;
 } & import("react").RefAttributes<NavItemEl>>;

package/dist/components/Pagination/Pagination.d.ts

@@ -5,16 +5,18 @@ export type PaginationProps = Omit<HTMLAttributes<PaginationEl>, 'onChange'> & {
     totalPages?: number;
     size?: PaginationEl['size'];
     disabled?: boolean;
-    onChange?: (detail: {
+    labels?: PaginationEl['labels'];
+    onChange?: (event: CustomEvent<{
         page: number;
-    }) => void;
+    }>) => void;
 };
 export declare const Pagination: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<PaginationEl>, "onChange"> & {
     page?: number;
     totalPages?: number;
     size?: PaginationEl["size"];
     disabled?: boolean;
-    onChange?: (detail: {
+    labels?: PaginationEl["labels"];
+    onChange?: (event: CustomEvent<{
         page: number;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<PaginationEl>>;

package/dist/components/Progress/Progress.d.ts

@@ -5,6 +5,8 @@ export type ProgressProps = HTMLAttributes<ProgressEl> & {
     variant?: ProgressEl['variant'];
     size?: ProgressEl['size'];
     label?: string;
+    max?: number;
+    valueText?: string;
     indeterminate?: boolean;
 };
 export declare const Progress: import("react").ForwardRefExoticComponent<HTMLAttributes<ProgressEl> & {
@@ -12,5 +14,7 @@ export declare const Progress: import("react").ForwardRefExoticComponent<HTMLAtt
     variant?: ProgressEl["variant"];
     size?: ProgressEl["size"];
     label?: string;
+    max?: number;
+    valueText?: string;
     indeterminate?: boolean;
 } & import("react").RefAttributes<ProgressEl>>;

package/dist/components/Radio/Radio.d.ts

@@ -11,10 +11,12 @@ export type RadioProps = Omit<HTMLAttributes<RadioEl>, 'onChange'> & {
     labelPosition?: RadioEl['labelPosition'];
     name?: string;
     value?: string;
-    onChange?: (detail: {
+    tabbable?: boolean;
+    labels?: RadioEl['labels'];
+    onChange?: (event: CustomEvent<{
         value: string;
         checked: boolean;
-    }) => void;
+    }>) => void;
 };
 export declare const Radio: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<RadioEl>, "onChange"> & {
     formAssociated?: boolean;
@@ -27,8 +29,10 @@ export declare const Radio: import("react").ForwardRefExoticComponent<Omit<HTMLA
     labelPosition?: RadioEl["labelPosition"];
     name?: string;
     value?: string;
-    onChange?: (detail: {
+    tabbable?: boolean;
+    labels?: RadioEl["labels"];
+    onChange?: (event: CustomEvent<{
         value: string;
         checked: boolean;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<RadioEl>>;

package/dist/components/RadioGroup/RadioGroup.d.ts

@@ -8,9 +8,9 @@ export type RadioGroupProps = Omit<HTMLAttributes<RadioGroupEl>, 'onChange'> & {
     helperText?: string;
     error?: boolean;
     required?: boolean;
-    onChange?: (detail: {
+    onChange?: (event: CustomEvent<{
         value: string;
-    }) => void;
+    }>) => void;
 };
 export declare const RadioGroup: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<RadioGroupEl>, "onChange"> & {
     label?: string;
@@ -20,7 +20,7 @@ export declare const RadioGroup: import("react").ForwardRefExoticComponent<Omit<
     helperText?: string;
     error?: boolean;
     required?: boolean;
-    onChange?: (detail: {
+    onChange?: (event: CustomEvent<{
         value: string;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<RadioGroupEl>>;

package/dist/components/Select/Select.d.ts

@@ -4,7 +4,8 @@ export type SelectProps = Omit<HTMLAttributes<SelectEl>, 'onChange'> & {
     formAssociated?: boolean;
     variant?: SelectEl['variant'];
     size?: SelectEl['size'];
-    value?: string;
+    value?: SelectEl['value'];
+    multiple?: boolean;
     placeholder?: string;
     label?: string;
     name?: string;
@@ -12,15 +13,17 @@ export type SelectProps = Omit<HTMLAttributes<SelectEl>, 'onChange'> & {
     disabled?: boolean;
     required?: boolean;
     options?: SelectEl['options'];
-    onChange?: (detail: {
-        value: string;
-    }) => void;
+    labels?: SelectEl['labels'];
+    onChange?: (event: CustomEvent<{
+        value: string | string[];
+    }>) => void;
 };
 export declare const Select: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<SelectEl>, "onChange"> & {
     formAssociated?: boolean;
     variant?: SelectEl["variant"];
     size?: SelectEl["size"];
-    value?: string;
+    value?: SelectEl["value"];
+    multiple?: boolean;
     placeholder?: string;
     label?: string;
     name?: string;
@@ -28,7 +31,8 @@ export declare const Select: import("react").ForwardRefExoticComponent<Omit<HTML
     disabled?: boolean;
     required?: boolean;
     options?: SelectEl["options"];
-    onChange?: (detail: {
-        value: string;
-    }) => void;
+    labels?: SelectEl["labels"];
+    onChange?: (event: CustomEvent<{
+        value: string | string[];
+    }>) => void;
 } & import("react").RefAttributes<SelectEl>>;

package/dist/components/SidePanel/SidePanel.d.ts

@@ -8,6 +8,7 @@ export type SidePanelProps = HTMLAttributes<SidePanelEl> & {
     noCloseButton?: boolean;
     backdropBlur?: boolean;
     overlayOpacity?: number;
+    labels?: SidePanelEl['labels'];
     onClose?: (event: CustomEvent) => void;
 };
 export declare const SidePanel: import("react").ForwardRefExoticComponent<HTMLAttributes<SidePanelEl> & {
@@ -18,5 +19,6 @@ export declare const SidePanel: import("react").ForwardRefExoticComponent<HTMLAt
     noCloseButton?: boolean;
     backdropBlur?: boolean;
     overlayOpacity?: number;
+    labels?: SidePanelEl["labels"];
     onClose?: (event: CustomEvent) => void;
 } & import("react").RefAttributes<SidePanelEl>>;

package/dist/components/Slider/Slider.d.ts

@@ -11,12 +11,12 @@ export type SliderProps = Omit<HTMLAttributes<SliderEl>, 'onInput' | 'onChange'>
     value?: number;
     label?: string;
     name?: string;
-    onInput?: (detail: {
+    onInput?: (event: CustomEvent<{
         value: number;
-    }) => void;
-    onChange?: (detail: {
+    }>) => void;
+    onChange?: (event: CustomEvent<{
         value: number;
-    }) => void;
+    }>) => void;
 };
 export declare const Slider: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<SliderEl>, "onChange" | "onInput"> & {
     formAssociated?: boolean;
@@ -29,10 +29,10 @@ export declare const Slider: import("react").ForwardRefExoticComponent<Omit<HTML
     value?: number;
     label?: string;
     name?: string;
-    onInput?: (detail: {
+    onInput?: (event: CustomEvent<{
         value: number;
-    }) => void;
-    onChange?: (detail: {
+    }>) => void;
+    onChange?: (event: CustomEvent<{
         value: number;
-    }) => void;
+    }>) => void;
 } & import("react").RefAttributes<SliderEl>>;