@ecopages/radiant-ui 0.1.0-rc.1 → 0.1.0-rc.2

package/dist/components/ui/alert/alert.d.ts

@@ -1,10 +1,10 @@
-import type { JsxHtmlPropsWithChildren } from '@ecopages/jsx';
+import type { JsxElementProps } from '@ecopages/jsx';
 import type { RuiAlertProps, RuiAlertVariant } from './alert.script';
 /** Registers `<rui-alert>` when the JSX helpers are imported. */
 import './alert.script';
-export type RuiAlertIconProps = JsxHtmlPropsWithChildren<{
+export type RuiAlertIconProps = JsxElementProps<HTMLSpanElement> & {
     variant?: RuiAlertVariant;
-}>;
+};
 /**
  * Default variant icon for `layout="inline"`. Pass `children` to override.
  *
@@ -14,23 +14,21 @@ export type RuiAlertIconProps = JsxHtmlPropsWithChildren<{
  * text, not by icon alone.
  */
 export declare function RuiAlertIcon({ variant, class: className, children, ...props }: RuiAlertIconProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiAlertTitleProps = JsxHtmlPropsWithChildren;
+export type RuiAlertTitleProps = JsxElementProps<HTMLParagraphElement>;
 /**
  * Heading for `layout="banner"` alerts.
  *
  * @cssclass rui-alert__title - Banner headline.
  */
 export declare function RuiAlertTitle({ children, class: className, ...props }: RuiAlertTitleProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiAlertDescriptionProps = JsxHtmlPropsWithChildren;
+export type RuiAlertDescriptionProps = JsxElementProps<HTMLDivElement>;
 /**
  * Body copy for `layout="banner"` alerts.
  *
  * @cssclass rui-alert__description - Banner body.
  */
 export declare function RuiAlertDescription({ children, class: className, ...props }: RuiAlertDescriptionProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiAlertComponentProps = JsxHtmlPropsWithChildren<RuiAlertProps & {
-    slot?: string;
-}>;
+export type RuiAlertComponentProps = JsxElementProps<HTMLDivElement> & RuiAlertProps;
 /**
  * Status alert with optional dismiss control.
  *
@@ -51,4 +49,4 @@ export type RuiAlertComponentProps = JsxHtmlPropsWithChildren<RuiAlertProps & {
  * @cssclass rui-alert--dismissible - Layout adjustments for the dismiss control.
  * @cssclass rui-alert__close - Dismiss button when `dismissible` is set.
  */
-export declare function RuiAlert({ children, variant, layout, dismissible, closeLabel, class: className, ...props }: RuiAlertComponentProps): import("@ecopages/jsx").JsxRenderable;
+export declare function RuiAlert({ children, variant, layout, dismissible, closeLabel, class: className, slot, ...props }: RuiAlertComponentProps): import("@ecopages/jsx").JsxRenderable;

package/dist/components/ui/autocomplete/autocomplete.d.ts

@@ -1,31 +1,25 @@
-import type { JsxHtmlProps, JsxHtmlPropsWithChildren } from '@ecopages/jsx';
-import type { RuiAutocompleteProps } from './autocomplete.script';
+import type { JsxCustomElementAttributes, JsxElementProps } from '@ecopages/jsx';
+import type { RuiAutocomplete as RuiAutocompleteElement, RuiAutocompleteProps } from './autocomplete.script';
 import './autocomplete.script';
-export type RuiAutocompleteInputProps = JsxHtmlProps<{
-    slot?: string;
+export type RuiAutocompleteInputProps = JsxElementProps<HTMLInputElement> & {
     placeholder?: string;
-    'aria-label'?: string;
     disabled?: boolean;
-}>;
+};
 /** Search field slotted into `RuiAutocomplete`. Also pairs with combobox inputs via `data-autocomplete-input`.
  *
  * @cssclass rui-autocomplete__input - Bordered search input.
  */
 export declare function RuiAutocompleteInput({ placeholder, slot, class: className, disabled, ...props }: RuiAutocompleteInputProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiAutocompleteCollectionProps = JsxHtmlPropsWithChildren<{
-    slot?: string;
-}>;
+export type RuiAutocompleteCollectionProps = JsxElementProps<HTMLDivElement>;
 /** Wrapper around the filterable collection inside `RuiAutocomplete`.
  *
  * @cssclass rui-autocomplete__collection - Scrollable filterable region.
  */
 export declare function RuiAutocompleteCollection({ children, class: className, ...props }: RuiAutocompleteCollectionProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiAutocompleteEmptyProps = JsxHtmlPropsWithChildren;
+export type RuiAutocompleteEmptyProps = JsxElementProps<HTMLDivElement>;
 /** Shown when filtering yields no visible items.
  *
  * @cssclass rui-autocomplete__empty - No-results state.
  */
 export declare function RuiAutocompleteEmpty({ children, class: className, ...props }: RuiAutocompleteEmptyProps): import("@ecopages/jsx").JsxRenderable;
-export declare function RuiAutocomplete({ children, ...props }: JsxHtmlPropsWithChildren<RuiAutocompleteProps & {
-    slot?: string;
-}>): import("@ecopages/jsx").JsxRenderable;
+export declare function RuiAutocomplete({ children, ...props }: JsxCustomElementAttributes<RuiAutocompleteElement, RuiAutocompleteProps>): import("@ecopages/jsx").JsxRenderable;

package/dist/components/ui/avatar/avatar.d.ts

@@ -1,6 +1,6 @@
-import type { JsxHtmlPropsWithChildren } from '@ecopages/jsx';
+import type { JsxElementProps } from '@ecopages/jsx';
 export type RuiAvatarSize = 'sm' | 'md' | 'lg';
-export type RuiAvatarProps = JsxHtmlPropsWithChildren<{
+export type RuiAvatarProps = JsxElementProps<HTMLSpanElement> & {
     /** Image URL. When omitted or broken, initials from `alt` / `fallback` are shown. */
     src?: string;
     /** Accessible name for the image. Also used to derive initials when `fallback` is omitted. */
@@ -8,7 +8,7 @@ export type RuiAvatarProps = JsxHtmlPropsWithChildren<{
     /** Explicit fallback initials / text when there is no image. */
     fallback?: string;
     size?: RuiAvatarSize;
-}>;
+};
 /**
  * Image avatar with initials fallback.
  *
@@ -24,4 +24,4 @@ export type RuiAvatarProps = JsxHtmlPropsWithChildren<{
  * @cssclass rui-avatar__image - `<img>` fill.
  * @cssclass rui-avatar__fallback - Initials / text fallback.
  */
-export declare function RuiAvatar({ src, alt, fallback, size, class: className, children, ...props }: RuiAvatarProps): import("@ecopages/jsx").JsxRenderable;
+export declare function RuiAvatar({ src, alt, fallback, size, class: className, children, role, aria, ...props }: RuiAvatarProps): import("@ecopages/jsx").JsxRenderable;

package/dist/components/ui/breadcrumb/breadcrumb.d.ts

@@ -1,9 +1,7 @@
-import type { JsxHtmlProps, JsxHtmlPropsWithChildren } from '@ecopages/jsx';
-import type { RuiBreadcrumbProps } from './breadcrumb.script';
+import type { JsxCustomElementAttributes, JsxElementProps } from '@ecopages/jsx';
+import type { RuiBreadcrumb as RuiBreadcrumbElement, RuiBreadcrumbProps } from './breadcrumb.script';
 import './breadcrumb.script';
-export type RuiBreadcrumbViewProps = JsxHtmlPropsWithChildren<RuiBreadcrumbProps & {
-    slot?: string;
-}>;
+export type RuiBreadcrumbViewProps = JsxCustomElementAttributes<RuiBreadcrumbElement, RuiBreadcrumbProps>;
 /**
  * Landmark wrapper for a breadcrumb trail. Set `separator` once here (e.g. `/`
  * or `>`); empty `RuiBreadcrumbSeparator` nodes pick it up via CSS — no context.
@@ -12,39 +10,37 @@ export type RuiBreadcrumbViewProps = JsxHtmlPropsWithChildren<RuiBreadcrumbProps
  * @cssclass rui-breadcrumb - `<nav>` landmark root.
  */
 export declare function RuiBreadcrumb({ children, ...props }: RuiBreadcrumbViewProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiBreadcrumbListProps = JsxHtmlPropsWithChildren;
+export type RuiBreadcrumbListProps = JsxElementProps<HTMLOListElement>;
 /**
  * Ordered list of breadcrumb items and separators.
  *
  * @cssclass rui-breadcrumb__list - Ordered list row.
  */
 export declare function RuiBreadcrumbList({ children, class: className, ...props }: RuiBreadcrumbListProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiBreadcrumbItemProps = JsxHtmlPropsWithChildren;
+export type RuiBreadcrumbItemProps = JsxElementProps<HTMLLIElement>;
 /**
  * Single crumb (`<li>`).
  *
  * @cssclass rui-breadcrumb__item - List item wrapping a crumb link/page.
  */
 export declare function RuiBreadcrumbItem({ children, class: className, ...props }: RuiBreadcrumbItemProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiBreadcrumbLinkProps = JsxHtmlPropsWithChildren<{
+export type RuiBreadcrumbLinkProps = JsxElementProps<HTMLAnchorElement> & {
     href: string;
-    /** Accessible name when the link content is non-text (e.g. an icon). */
-    'aria-label'?: string;
-}>;
+};
 /**
  * Linked ancestor page.
  *
  * @cssclass rui-breadcrumb__link - Crumb link.
  */
-export declare function RuiBreadcrumbLink({ children, href, class: className, 'aria-label': ariaLabel, ...props }: RuiBreadcrumbLinkProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiBreadcrumbPageProps = JsxHtmlPropsWithChildren;
+export declare function RuiBreadcrumbLink({ children, href, class: className, ...props }: RuiBreadcrumbLinkProps): import("@ecopages/jsx").JsxRenderable;
+export type RuiBreadcrumbPageProps = JsxElementProps<HTMLSpanElement>;
 /**
  * Current page (non-link).
  *
  * @cssclass rui-breadcrumb__page - Current page span (`aria-current="page"`).
  */
 export declare function RuiBreadcrumbPage({ children, class: className, ...props }: RuiBreadcrumbPageProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiBreadcrumbSeparatorProps = JsxHtmlPropsWithChildren;
+export type RuiBreadcrumbSeparatorProps = JsxElementProps<HTMLLIElement>;
 /**
  * Visual separator between crumbs. Renders as a presentational list item.
  * With no children, uses the glyph from `RuiBreadcrumb`’s `separator` prop
@@ -53,10 +49,10 @@ export type RuiBreadcrumbSeparatorProps = JsxHtmlPropsWithChildren;
  * @cssclass rui-breadcrumb__separator - Presentational separator (`aria-hidden`).
  */
 export declare function RuiBreadcrumbSeparator({ children, class: className, ...props }: RuiBreadcrumbSeparatorProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiBreadcrumbEllipsisProps = JsxHtmlProps<{
+export type RuiBreadcrumbEllipsisProps = JsxElementProps<HTMLSpanElement> & {
     /** Accessible label announced for the collapsed segment. Default: `More`. */
     label?: string;
-}>;
+};
 /**
  * Collapsed middle segment indicator.
  *

package/dist/components/ui/button/button.d.ts

@@ -1,17 +1,13 @@
-import type { JsxAriaAttributes, JsxHtmlPropsWithChildren } from '@ecopages/jsx';
+import type { JsxElementProps } from '@ecopages/jsx';
 export type RuiButtonVariant = 'filled' | 'outline' | 'destructive' | 'ghost' | 'link';
 export type RuiButtonSize = 'none' | 'sm' | 'md' | 'lg';
-type RuiButtonCommonProps = JsxHtmlPropsWithChildren<{
+type RuiButtonChrome = {
     /** Visual style. Default: `filled`. */
     variant?: RuiButtonVariant;
     /** Control size. Default: `md` (Default in docs). Use `none` for inline `link` chrome. */
     size?: RuiButtonSize;
-    /** Accessible name when the button has no visible text. */
-    'aria-label'?: string;
-    /** Optional light-DOM slot when composing into a parent custom element. */
-    slot?: string;
-}>;
-export type RuiButtonControlProps = RuiButtonCommonProps & {
+};
+export type RuiButtonControlProps = JsxElementProps<HTMLButtonElement> & RuiButtonChrome & {
     /** Native button type. Default: `button`. */
     type?: 'button' | 'submit' | 'reset';
     /** Disabled state. */
@@ -23,16 +19,13 @@ export type RuiButtonControlProps = RuiButtonCommonProps & {
     /** Toggle `aria-pressed` on click when `pressed` is not controlled. */
     toggle?: boolean;
     href?: never;
-    'on:click'?: (event: Event) => void;
 };
-export type RuiButtonLinkProps = RuiButtonCommonProps & {
+export type RuiButtonLinkProps = JsxElementProps<HTMLAnchorElement> & RuiButtonChrome & {
     /** Destination for the button-styled link. */
     href: string;
     target?: '_self' | '_blank' | '_parent' | '_top';
     rel?: string;
     download?: boolean | string;
-    'aria-current'?: JsxAriaAttributes['aria-current'];
-    'on:click'?: (event: Event) => void;
 };
 export type RuiButtonProps = RuiButtonControlProps | RuiButtonLinkProps;
 /**

package/dist/components/ui/button-group/button-group.d.ts

@@ -1,11 +1,9 @@
-import type { JsxHtmlPropsWithChildren } from '@ecopages/jsx';
+import type { JsxElementProps } from '@ecopages/jsx';
 export type RuiButtonGroupOrientation = 'horizontal' | 'vertical';
-export type RuiButtonGroupProps = JsxHtmlPropsWithChildren<{
+export type RuiButtonGroupProps = JsxElementProps<HTMLDivElement> & {
     /** Layout direction. Default: `horizontal`. */
     orientation?: RuiButtonGroupOrientation;
-    /** Accessible name when the group has no visible label. */
-    'aria-label'?: string;
-}>;
+};
 /**
  * Related buttons / links in a horizontal or vertical group.
  *
@@ -13,4 +11,4 @@ export type RuiButtonGroupProps = JsxHtmlPropsWithChildren<{
  * @cssclass rui-button-group--horizontal - Side-by-side layout (default).
  * @cssclass rui-button-group--vertical - Stacked layout.
  */
-export declare function RuiButtonGroup({ children, orientation, class: className, 'aria-label': ariaLabel, ...props }: RuiButtonGroupProps): import("@ecopages/jsx").JsxRenderable;
+export declare function RuiButtonGroup({ children, orientation, class: className, ...props }: RuiButtonGroupProps): import("@ecopages/jsx").JsxRenderable;

package/dist/components/ui/calendar/calendar.d.ts

@@ -1,6 +1,4 @@
-import type { JsxHtmlPropsWithChildren } from '@ecopages/jsx';
-import type { RuiCalendarProps } from './calendar.script';
+import type { JsxCustomElementAttributes } from '@ecopages/jsx';
+import type { RuiCalendar as RuiCalendarElement, RuiCalendarProps } from './calendar.script';
 import './calendar.script';
-export declare function RuiCalendar({ children, ...props }: JsxHtmlPropsWithChildren<RuiCalendarProps & {
-    slot?: string;
-}>): import("@ecopages/jsx").JsxRenderable;
+export declare function RuiCalendar({ children, ...props }: JsxCustomElementAttributes<RuiCalendarElement, RuiCalendarProps>): import("@ecopages/jsx").JsxRenderable;

package/dist/components/ui/carousel/carousel.d.ts

@@ -1,25 +1,24 @@
-import type { JsxHtmlPropsWithChildren, JsxRenderable } from '@ecopages/jsx';
-import type { RuiCarouselProps } from './carousel.script';
+import { type JsxCustomElementAttributes, type JsxElementProps, type JsxRenderable } from '@ecopages/jsx';
+import type { RuiCarousel as RuiCarouselElement, RuiCarouselProps } from './carousel.script';
 import './carousel.script';
 export type RuiCarouselSlideData = {
     id: string;
     children: JsxRenderable;
 };
-export type RuiCarouselSlideProps = JsxHtmlPropsWithChildren<{
+export type RuiCarouselSlideProps = Omit<JsxElementProps<HTMLDivElement>, 'id'> & {
     id: string;
-}>;
+};
 /**
  * Slide in the default carousel slot (APG `group` / `tabpanel` roles are applied by the host).
  *
  * @cssclass rui-carousel__slide - Slide surface.
  */
 export declare function RuiCarouselSlide({ id, children, class: className, ...props }: RuiCarouselSlideProps): JsxRenderable;
-export type RuiCarouselControlProps = JsxHtmlPropsWithChildren<{
-    slot?: string;
+export type RuiCarouselControlProps = JsxElementProps<HTMLButtonElement> & {
     disabled?: boolean;
     /** Match `controls-variant="overlay"` on the carousel for circular on-slide chrome. */
     overlay?: boolean;
-}>;
+};
 /**
  * Previous control slotted into `prev` by default.
  *
@@ -29,7 +28,7 @@ export type RuiCarouselControlProps = JsxHtmlPropsWithChildren<{
  * @cssclass rui-carousel__nav-label - Icon + label row (toolbar variant).
  * @cssclass rui-carousel__nav-icon - Decorative chevron glyph.
  */
-export declare function RuiCarouselPrev({ children, slot, class: className, disabled, overlay, ...props }: RuiCarouselControlProps): JsxRenderable;
+export declare function RuiCarouselPrev({ children, slot, class: className, disabled, overlay, aria, ...props }: RuiCarouselControlProps): JsxRenderable;
 /**
  * Next control slotted into `next` by default.
  *
@@ -39,19 +38,17 @@ export declare function RuiCarouselPrev({ children, slot, class: className, disa
  * @cssclass rui-carousel__nav-label - Icon + label row (toolbar variant).
  * @cssclass rui-carousel__nav-icon - Decorative chevron glyph.
  */
-export declare function RuiCarouselNext({ children, slot, class: className, disabled, overlay, ...props }: RuiCarouselControlProps): JsxRenderable;
-export type RuiCarouselRotationProps = JsxHtmlPropsWithChildren<{
-    slot?: string;
+export declare function RuiCarouselNext({ children, slot, class: className, disabled, overlay, aria, ...props }: RuiCarouselControlProps): JsxRenderable;
+export type RuiCarouselRotationProps = JsxElementProps<HTMLButtonElement> & {
     overlay?: boolean;
-}>;
+};
 /**
  * Play/pause rotation control slotted into `rotation` by default.
  *
  * @cssclass rui-carousel__rotation - Rotation toggle button (composed with `rui-button`).
  * @cssclass rui-carousel__rotation--overlay - Overlay pill chrome.
  */
-export declare function RuiCarouselRotation({ children, slot, class: className, overlay, ...props }: RuiCarouselRotationProps): JsxRenderable;
-export declare function RuiCarousel({ slides, children, ...props }: JsxHtmlPropsWithChildren<RuiCarouselProps & {
-    slot?: string;
+export declare function RuiCarouselRotation({ children, slot, class: className, overlay, aria, ...props }: RuiCarouselRotationProps): JsxRenderable;
+export declare function RuiCarousel({ slides, children, ...props }: JsxCustomElementAttributes<RuiCarouselElement, RuiCarouselProps> & {
     slides?: RuiCarouselSlideData[];
-}>): JsxRenderable;
+}): JsxRenderable;

package/dist/components/ui/checkbox/checkbox.d.ts

@@ -1,6 +1,4 @@
-import type { JsxHtmlPropsWithChildren } from '@ecopages/jsx';
-import type { RuiCheckboxProps } from './checkbox.script';
+import type { JsxCustomElementAttributes } from '@ecopages/jsx';
+import type { RuiCheckbox as RuiCheckboxElement, RuiCheckboxProps } from './checkbox.script';
 import './checkbox.script';
-export declare function RuiCheckbox({ children, ...props }: JsxHtmlPropsWithChildren<RuiCheckboxProps & {
-    slot?: string;
-}>): import("@ecopages/jsx").JsxRenderable;
+export declare function RuiCheckbox({ children, ...props }: JsxCustomElementAttributes<RuiCheckboxElement, RuiCheckboxProps>): import("@ecopages/jsx").JsxRenderable;

package/dist/components/ui/chip/chip.d.ts

@@ -1,8 +1,8 @@
-import type { JsxHtmlPropsWithChildren } from '@ecopages/jsx';
+import type { JsxElementProps } from '@ecopages/jsx';
 export type RuiChipVariant = 'default' | 'muted' | 'primary';
-export type RuiChipProps = JsxHtmlPropsWithChildren<{
+export type RuiChipProps = JsxElementProps<HTMLSpanElement> & {
     variant?: RuiChipVariant;
-}>;
+};
 /**
  * Presentational category chip.
  *

package/dist/components/ui/chip-list/chip-list.d.ts

@@ -1,15 +1,12 @@
-import type { JsxHtmlPropsWithChildren } from '@ecopages/jsx';
-export type RuiChipListProps = JsxHtmlPropsWithChildren<{
-    'aria-label'?: string;
-    id?: string;
-}>;
+import type { JsxElementProps } from '@ecopages/jsx';
+export type RuiChipListProps = JsxElementProps<HTMLUListElement>;
 /**
  * Horizontal wrap list for presentational chips.
  *
  * @cssclass rui-chip-list - List container (`<ul>`).
  */
-export declare function RuiChipList({ children, class: className, 'aria-label': ariaLabel, ...props }: RuiChipListProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiChipListItemProps = JsxHtmlPropsWithChildren;
+export declare function RuiChipList({ children, class: className, ...props }: RuiChipListProps): import("@ecopages/jsx").JsxRenderable;
+export type RuiChipListItemProps = JsxElementProps<HTMLLIElement>;
 /**
  * List item wrapper for a chip.
  *

package/dist/components/ui/combobox/combobox.d.ts

@@ -1,46 +1,38 @@
-import type { JsxHtmlProps, JsxHtmlPropsWithChildren } from '@ecopages/jsx';
-import { RuiListboxOption, type RuiListboxOptionData } from '../listbox';
-import type { RuiComboboxProps } from './combobox.script';
+import type { JsxCustomElementAttributes, JsxElementProps } from '@ecopages/jsx';
+import { type RuiListboxOptionData } from '../listbox';
+import type { RuiCombobox as RuiComboboxElement, RuiComboboxProps } from './combobox.script';
 import './combobox.script';
-export type RuiComboboxControlProps = JsxHtmlPropsWithChildren<{
-    slot?: string;
-}>;
+export type RuiComboboxControlProps = JsxElementProps<HTMLDivElement>;
 /** Input row wrapper for the combobox input and toggle button.
  *
  * @cssclass rui-combobox__control - Bordered control-height row.
  */
 export declare function RuiComboboxControl({ children, slot, class: className, ...props }: RuiComboboxControlProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiComboboxInputProps = JsxHtmlProps<{
+export type RuiComboboxInputProps = JsxElementProps<HTMLInputElement> & {
     placeholder?: string;
     disabled?: boolean;
-}>;
+};
 /** Text input with `role="combobox"`. Place inside `RuiComboboxControl`.
  *
  * @cssclass rui-combobox__input - Combobox text input.
  */
 export declare function RuiComboboxInput({ placeholder, disabled, class: className, ...props }: RuiComboboxInputProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiComboboxTriggerProps = JsxHtmlPropsWithChildren<{
-    'aria-label'?: string;
+export type RuiComboboxTriggerProps = JsxElementProps<HTMLButtonElement> & {
     disabled?: boolean;
-}>;
+};
 /** Toggle button for opening the listbox popup. */
-export declare function RuiComboboxTrigger({ children, class: className, 'aria-label': ariaLabel, disabled, ...props }: RuiComboboxTriggerProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiComboboxListboxProps = JsxHtmlPropsWithChildren<{
-    slot?: string;
-}>;
+export declare function RuiComboboxTrigger({ children, class: className, aria, disabled, ...props }: RuiComboboxTriggerProps): import("@ecopages/jsx").JsxRenderable;
+export type RuiComboboxListboxProps = JsxElementProps<HTMLDivElement>;
 /** Popup shell slotted into `listbox`. Place an embedded `RuiListbox` inside.
  *
  * @cssclass rui-combobox__listbox - Popup shell (adds `rui-popover rui-popover--listbox rui-floating`).
  */
 export declare function RuiComboboxListbox({ children, slot, class: className, ...props }: RuiComboboxListboxProps): import("@ecopages/jsx").JsxRenderable;
 export type RuiComboboxOptionData = RuiListboxOptionData;
-/** @deprecated Use `RuiListboxOption` */
-export declare const RuiComboboxOption: typeof RuiListboxOption;
 /**
  * Combobox view. Pair with `RuiLabel` (sibling or via `RuiField`) for the visible name —
  * do not nest a combobox-specific label.
  */
-export declare function RuiCombobox({ options, children, ...props }: JsxHtmlPropsWithChildren<RuiComboboxProps & {
-    slot?: string;
+export declare function RuiCombobox({ options, children, ...props }: JsxCustomElementAttributes<RuiComboboxElement, RuiComboboxProps & {
     options?: RuiComboboxOptionData[];
 }>): import("@ecopages/jsx").JsxRenderable;

package/dist/components/ui/combobox/index.d.ts

@@ -1,3 +1,3 @@
 export { RuiCombobox as RuiComboboxElement, type RuiComboboxProps, type RuiComboboxChangeDetail, } from './combobox.script';
-export { RuiCombobox, RuiComboboxControl, RuiComboboxInput, RuiComboboxListbox, RuiComboboxTrigger, RuiComboboxOption, type RuiComboboxOptionData, } from './combobox';
+export { RuiCombobox, RuiComboboxControl, RuiComboboxInput, RuiComboboxListbox, RuiComboboxTrigger, type RuiComboboxOptionData, } from './combobox';
 export { RuiListbox, RuiListboxOption } from '../listbox';

package/dist/components/ui/cycle-toggle/cycle-toggle.d.ts

@@ -1,21 +1,19 @@
-import type { JsxHtmlPropsWithChildren, JsxRenderable } from '@ecopages/jsx';
-import type { RuiCycleToggleProps } from './cycle-toggle.script';
+import type { JsxCustomElementAttributes, JsxElementProps } from '@ecopages/jsx';
+import type { RuiCycleToggle as RuiCycleToggleElement, RuiCycleToggleProps } from './cycle-toggle.script';
 import './cycle-toggle.script';
-export type RuiCycleToggleItemProps = {
+export type RuiCycleToggleItemProps = Omit<JsxElementProps<HTMLSpanElement>, 'id'> & {
     id: string;
-    children: JsxRenderable;
-    class?: string;
     disabled?: boolean;
     /** Whether this item is selected in the initial document. */
     selected?: boolean;
 };
-export type RuiCycleToggleButtonProps = JsxHtmlPropsWithChildren<Pick<RuiCycleToggleProps, 'disabled' | 'label' | 'size' | 'variant'>>;
+export type RuiCycleToggleButtonProps = JsxElementProps<HTMLButtonElement> & Pick<RuiCycleToggleProps, 'disabled' | 'label' | 'size' | 'variant'>;
 /**
  * One cycle option. Only the active item is visible inside the button.
  *
  * @cssclass rui-cycle-toggle__item - Cycle option row (icon + label).
  */
-export declare function RuiCycleToggleItem({ id, children, class: className, disabled, selected }: RuiCycleToggleItemProps): JsxRenderable;
+export declare function RuiCycleToggleItem({ id, children, class: className, disabled, selected, ...props }: RuiCycleToggleItemProps): import("@ecopages/jsx").JsxRenderable;
 /**
  * Button chrome shared by cycle-toggle custom-element views.
  *
@@ -23,7 +21,5 @@ export declare function RuiCycleToggleItem({ id, children, class: className, dis
  *
  * @cssclass rui-cycle-toggle__button - Cycle toggle button root.
  */
-export declare function RuiCycleToggleButton({ children, variant, size, disabled, }: RuiCycleToggleButtonProps): JsxRenderable;
-export declare function RuiCycleToggle({ children, value, variant, size, label, disabled, ...props }: JsxHtmlPropsWithChildren<RuiCycleToggleProps & {
-    slot?: string;
-}>): JsxRenderable;
+export declare function RuiCycleToggleButton({ children, variant, size, disabled, class: className, ...props }: RuiCycleToggleButtonProps): import("@ecopages/jsx").JsxRenderable;
+export declare function RuiCycleToggle({ children, variant, size, disabled, ...props }: JsxCustomElementAttributes<RuiCycleToggleElement, RuiCycleToggleProps>): import("@ecopages/jsx").JsxRenderable;

package/dist/components/ui/date-field/date-field.d.ts

@@ -1,22 +1,20 @@
-import type { JsxHtmlProps, JsxHtmlPropsWithChildren } from '@ecopages/jsx';
-import { type RuiCalendarProps } from '../calendar';
-import type { RuiDateFieldProps } from './date-field.script';
+import type { JsxCustomElementAttributes, JsxElementProps } from '@ecopages/jsx';
+import { type RuiCalendarElement, type RuiCalendarProps } from '../calendar';
+import type { RuiDateField as RuiDateFieldElement, RuiDateFieldProps } from './date-field.script';
 import './date-field.script';
-export type RuiDateFieldControlProps = JsxHtmlPropsWithChildren;
+export type RuiDateFieldControlProps = JsxElementProps<HTMLDivElement>;
 /** Bordered control row containing the date input and calendar toggle. */
 export declare function RuiDateFieldControl({ children, class: className, ...props }: RuiDateFieldControlProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateFieldInputProps = JsxHtmlProps;
+export type RuiDateFieldInputProps = JsxElementProps<HTMLInputElement>;
 /** Text input controlled by the date-field host. */
 export declare function RuiDateFieldInput({ class: className, ...props }: RuiDateFieldInputProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateFieldToggleProps = JsxHtmlPropsWithChildren<{
-    'aria-label'?: string;
-}>;
+export type RuiDateFieldToggleProps = JsxElementProps<HTMLButtonElement>;
 /** Toggle button for the date calendar. */
-export declare function RuiDateFieldToggle({ children, class: className, 'aria-label': ariaLabel, ...props }: RuiDateFieldToggleProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateFieldPopoverProps = JsxHtmlPropsWithChildren;
+export declare function RuiDateFieldToggle({ children, class: className, aria, ...props }: RuiDateFieldToggleProps): import("@ecopages/jsx").JsxRenderable;
+export type RuiDateFieldPopoverProps = JsxElementProps<HTMLDivElement>;
 /** Floating shell for a `RuiDateFieldCalendar`. */
 export declare function RuiDateFieldPopover({ children, class: className, ...props }: RuiDateFieldPopoverProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateFieldCalendarProps = JsxHtmlProps<RuiCalendarProps>;
+export type RuiDateFieldCalendarProps = JsxCustomElementAttributes<RuiCalendarElement, RuiCalendarProps>;
 /** Calendar whose value and constraints are synchronized by the date-field host. */
 export declare function RuiDateFieldCalendar(props: RuiDateFieldCalendarProps): import("@ecopages/jsx").JsxRenderable;
 /**
@@ -24,6 +22,4 @@ export declare function RuiDateFieldCalendar(props: RuiDateFieldCalendarProps):
  *
  * Pair with `RuiLabel` / `RuiField` for labeling and validation.
  */
-export declare function RuiDateField({ children, ...props }: JsxHtmlPropsWithChildren<RuiDateFieldProps & {
-    slot?: string;
-}>): import("@ecopages/jsx").JsxRenderable;
+export declare function RuiDateField({ children, ...props }: JsxCustomElementAttributes<RuiDateFieldElement, RuiDateFieldProps>): import("@ecopages/jsx").JsxRenderable;

package/dist/components/ui/date-range-picker/date-range-picker.d.ts

@@ -1,35 +1,32 @@
-import type { JsxHtmlProps, JsxHtmlPropsWithChildren } from '@ecopages/jsx';
-import { type RuiCalendarProps } from '../calendar';
-import type { RuiDateRangePickerProps } from './date-range-picker.script';
+import type { JsxCustomElementAttributes, JsxElementProps } from '@ecopages/jsx';
+import { type RuiCalendarElement, type RuiCalendarProps } from '../calendar';
+import type { RuiDateRangePicker as RuiDateRangePickerElement, RuiDateRangePickerProps } from './date-range-picker.script';
 import './date-range-picker.script';
-export type RuiDateRangePickerControlProps = JsxHtmlPropsWithChildren;
+export type RuiDateRangePickerControlProps = JsxElementProps<HTMLDivElement>;
 /** Bordered control row containing the date inputs and calendar toggle. */
 export declare function RuiDateRangePickerControl({ children, class: className, ...props }: RuiDateRangePickerControlProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateRangePickerInputsProps = JsxHtmlPropsWithChildren;
+export type RuiDateRangePickerInputsProps = JsxElementProps<HTMLDivElement>;
 /** Input row for `RuiDateRangePickerStartInput` and `RuiDateRangePickerEndInput`. */
 export declare function RuiDateRangePickerInputs({ children, class: className, ...props }: RuiDateRangePickerInputsProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateRangePickerStartInputProps = JsxHtmlProps;
+export type RuiDateRangePickerStartInputProps = JsxElementProps<HTMLInputElement>;
 /** Start-date text input controlled by the range-picker host. */
 export declare function RuiDateRangePickerStartInput({ class: className, ...props }: RuiDateRangePickerStartInputProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateRangePickerEndInputProps = JsxHtmlProps;
+export type RuiDateRangePickerEndInputProps = JsxElementProps<HTMLInputElement>;
 /** End-date text input controlled by the range-picker host. */
 export declare function RuiDateRangePickerEndInput({ class: className, ...props }: RuiDateRangePickerEndInputProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateRangePickerSeparatorProps = JsxHtmlPropsWithChildren;
+export type RuiDateRangePickerSeparatorProps = JsxElementProps<HTMLSpanElement>;
 /** Visual separator between the start and end inputs. */
 export declare function RuiDateRangePickerSeparator({ children, class: className, ...props }: RuiDateRangePickerSeparatorProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateRangePickerToggleProps = JsxHtmlPropsWithChildren<{
-    'aria-label'?: string;
-}>;
+export type RuiDateRangePickerToggleProps = JsxElementProps<HTMLButtonElement>;
 /** Toggle button for the range calendar. */
-export declare function RuiDateRangePickerToggle({ children, class: className, 'aria-label': ariaLabel, ...props }: RuiDateRangePickerToggleProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateRangePickerPopoverProps = JsxHtmlPropsWithChildren;
+export declare function RuiDateRangePickerToggle({ children, class: className, aria, ...props }: RuiDateRangePickerToggleProps): import("@ecopages/jsx").JsxRenderable;
+export type RuiDateRangePickerPopoverProps = JsxElementProps<HTMLDivElement>;
 /** Floating shell for a `RuiDateRangePickerCalendar`. */
 export declare function RuiDateRangePickerPopover({ children, class: className, ...props }: RuiDateRangePickerPopoverProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateRangePickerCalendarProps = JsxHtmlProps<RuiCalendarProps>;
+export type RuiDateRangePickerCalendarProps = JsxCustomElementAttributes<RuiCalendarElement, RuiCalendarProps>;
 /** Calendar whose range value and constraints are synchronized by the range-picker host. */
 export declare function RuiDateRangePickerCalendar(props: RuiDateRangePickerCalendarProps): import("@ecopages/jsx").JsxRenderable;
-export type RuiDateRangePickerViewProps = RuiDateRangePickerProps & {
-    slot?: string;
+export type RuiDateRangePickerViewProps = JsxCustomElementAttributes<RuiDateRangePickerElement, RuiDateRangePickerProps> & {
     /** Accessible name for the default start-date input. */
     startLabel?: string;
     /** Accessible name for the default end-date input. */
@@ -40,4 +37,4 @@ export type RuiDateRangePickerViewProps = RuiDateRangePickerProps & {
  *
  * Pair with `RuiLabel` / `RuiField` for labeling and validation.
  */
-export declare function RuiDateRangePicker({ children, startLabel, endLabel, ...props }: JsxHtmlPropsWithChildren<RuiDateRangePickerViewProps>): import("@ecopages/jsx").JsxRenderable;
+export declare function RuiDateRangePicker({ children, startLabel, endLabel, ...props }: RuiDateRangePickerViewProps): import("@ecopages/jsx").JsxRenderable;