solid-baseui 0.1.0-alpha.0 → 0.1.0-alpha.2

package/dist/lib/types/internals/form-context/FormContext.d.ts

@@ -4,6 +4,7 @@ export interface FormContextValue {
     errors: Accessor<Readonly<FormErrors>>;
     validationMode: Accessor<FormValidationMode>;
     submitAttempted: () => boolean;
+    submitCount: () => number;
     formElement: () => HTMLFormElement | null;
     clearError: (name: string | undefined) => void;
     registerField: (field: RegisteredFormField) => () => void;

package/dist/lib/types/internals/labelable-provider/LabelableContext.d.ts

@@ -1,5 +1,6 @@
 import { type Accessor } from 'solid-js';
 export interface LabelableContextValue {
+    defaultControlId?: string | undefined;
     controlId: Accessor<string | null | undefined>;
     labelId: Accessor<string | undefined>;
     messageIds: Accessor<readonly string[]>;

package/dist/lib/types/internals/labelable-provider/createLabelableId.d.ts

@@ -0,0 +1,3 @@
+import { type Accessor } from 'solid-js';
+/** Keep the server label/control pair associated until explicit IDs register on the client. */
+export declare function createLabelableId(id: Accessor<string | null | undefined>, fallback: string, enabled?: Accessor<boolean>): Accessor<string>;

package/dist/lib/types/internals/overlay/PopupPortal.d.ts

@@ -1,5 +1,6 @@
 import { type Accessor } from 'solid-js';
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import { type JSX } from '@solidjs/web';
+import type { ComponentRenderFn } from '../../types/index.js';
 import type { BaseUIChangeEventDetails } from '../createBaseUIEventDetails.js';
 export interface PortalFocusManagerState {
     modal: boolean;
@@ -29,9 +30,10 @@ type ContainerRef = {
 };
 export type PopupPortalContainer = HTMLElement | ShadowRoot | ContainerRef | Accessor<HTMLElement | ShadowRoot | null> | null;
 export interface PopupPortalProps extends JSX.HTMLAttributes<HTMLDivElement> {
-    as?: ValidComponent | undefined;
+    render?: ComponentRenderFn | undefined;
     container?: PopupPortalContainer | undefined;
     lite?: boolean | undefined;
+    portalOwnerRole?: 'group' | undefined;
 }
 export declare function PopupPortal(props: PopupPortalProps): JSX.Element;
 export {};

package/dist/lib/types/internals/overlay/createPopupPresence.d.ts

@@ -15,4 +15,5 @@ export interface PopupPresence {
 }
 export declare function createPopupPresence<Payload, Details extends BaseUIChangeEventDetails<string>>(store: PopupStore<Payload, Details>, element: Accessor<HTMLElement | null>, options?: {
     onUnmount?: (() => void) | undefined;
+    animateInitialOpen?: boolean | undefined;
 }): PopupPresence;

package/dist/lib/types/internals/overlay/dom.d.ts

@@ -4,6 +4,8 @@ export declare function ownerWindow(node?: Node | Document | null): Window;
 export declare function activeElement(documentNode: Document): Element | null;
 export declare function contains(parent?: Element | null, child?: Element | null): boolean;
 export declare function getEventTarget(event: Event): EventTarget | null;
+/** Solid RC.6 Portal exposes a live logical parent through each inserted root's _$host. */
+export declare function containsWithPortals(parent?: Node | null, child?: Node | null): boolean;
 export declare function isEventTargetWithin(event: Event, node?: Node | null): boolean;
 export declare function isElement(value: unknown): value is Element;
 export declare function isHTMLElement(value: unknown): value is HTMLElement;

package/dist/lib/types/menu/root/MenuRootContext.d.ts

@@ -6,6 +6,7 @@ export interface MenuRootContextValue<Payload = unknown> {
     store: MenuStore<Payload>;
     node: FloatingNode;
     nested: boolean;
+    portalOwnerRole: 'group' | undefined;
     presence: PopupPresence;
     contextMenu: ContextMenuRootContextValue | undefined;
     backdropElement: Accessor<HTMLElement | null>;

package/dist/lib/types/meter/indicator/MeterIndicator.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { MeterRootState } from '../root/MeterRoot.js';
 export interface MeterIndicatorState extends MeterRootState {

package/dist/lib/types/meter/label/MeterLabel.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { MeterRootState } from '../root/MeterRoot.js';
 export interface MeterLabelState extends MeterRootState {

package/dist/lib/types/meter/root/MeterRoot.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 export interface MeterRootState {
 }

package/dist/lib/types/meter/track/MeterTrack.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { MeterRootState } from '../root/MeterRoot.js';
 export interface MeterTrackState extends MeterRootState {

package/dist/lib/types/meter/value/MeterValue.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { MeterRootState } from '../root/MeterRoot.js';
 export interface MeterValueState extends MeterRootState {

package/dist/lib/types/navigation-menu/trigger/NavigationMenuTrigger.d.ts

@@ -3,6 +3,7 @@ import { type BaseUIEventHandlerUnion } from '../../internals/composeEventHandle
 import type { BaseUIComponentProps } from '../../types/index.js';
 export interface NavigationMenuTriggerState {
     open: boolean;
+    disabled: boolean;
 }
 type TriggerEventTarget<Component extends ValidComponent> = ComponentProps<Component> extends {
     onClick?: JSX.EventHandlerUnion<infer Target, MouseEvent> | undefined;

package/dist/lib/types/number-field/input/NumberFieldInput.d.ts

@@ -1,17 +1,17 @@
 import { type ComponentProps, type JSX, type ValidComponent } from '@solidjs/web';
 import { type BaseUIEventHandlerUnion } from '../../internals/composeEventHandlers.js';
-import type { BaseUIComponentProps } from '../../types/index.js';
+import type { BaseUIComponentProps, BaseUIEvent } from '../../types/index.js';
 import type { NumberFieldRootState } from '../root/NumberFieldRoot.js';
 export interface NumberFieldInputState extends NumberFieldRootState {
 }
 type NumberFieldInputEventTarget<Component extends ValidComponent> = ComponentProps<Component> extends {
-    onInput?: JSX.EventHandlerUnion<infer Target, InputEvent> | undefined;
+    onInput?: JSX.InputEventHandlerUnion<infer Target, InputEvent> | undefined;
 } ? Target extends HTMLElement ? Target : HTMLElement : HTMLElement;
 interface NumberFieldInputOwnProps<Component extends ValidComponent> {
     'aria-roledescription'?: string | undefined;
-    onBlur?: BaseUIEventHandlerUnion<NumberFieldInputEventTarget<Component>, FocusEvent> | undefined;
-    onFocus?: BaseUIEventHandlerUnion<NumberFieldInputEventTarget<Component>, FocusEvent> | undefined;
-    onInput?: BaseUIEventHandlerUnion<NumberFieldInputEventTarget<Component>, InputEvent> | undefined;
+    onBlur?: JSX.FocusEventHandlerUnion<NumberFieldInputEventTarget<Component>, BaseUIEvent<FocusEvent>> | undefined;
+    onFocus?: JSX.FocusEventHandlerUnion<NumberFieldInputEventTarget<Component>, BaseUIEvent<FocusEvent>> | undefined;
+    onInput?: JSX.InputEventHandlerUnion<NumberFieldInputEventTarget<Component>, BaseUIEvent<InputEvent>> | undefined;
     onKeyDown?: BaseUIEventHandlerUnion<NumberFieldInputEventTarget<Component>, KeyboardEvent> | undefined;
     onPaste?: BaseUIEventHandlerUnion<NumberFieldInputEventTarget<Component>, ClipboardEvent> | undefined;
 }

package/dist/lib/types/number-field/root/NumberFieldRootContext.d.ts

@@ -11,6 +11,7 @@ export interface NumberFieldRootContextValue {
     getStepAmount: (event?: EventWithOptionalKeyState) => number;
     incrementValue: (amount: number, params: IncrementValueParameters) => boolean;
     inputElement: Accessor<HTMLInputElement | undefined>;
+    focusInput: () => void;
     setInputElement: (element: HTMLInputElement | undefined) => void;
     allowInputSync: () => boolean;
     setAllowInputSync: (value: boolean) => void;

package/dist/lib/types/popover/arrow/PopoverArrow.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import { type AnchorAlign, type AnchorSide } from '../../internals/overlay/index.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 export interface PopoverArrowState {

package/dist/lib/types/popover/backdrop/PopoverBackdrop.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { TransitionStatus } from '../../internals/stateAttributesMapping.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 export interface PopoverBackdropState {

package/dist/lib/types/popover/description/PopoverDescription.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 export interface PopoverDescriptionState {
 }

package/dist/lib/types/popover/positioner/PopoverPositioner.d.ts

@@ -1,5 +1,5 @@
 import { type Accessor } from 'solid-js';
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { ReferenceElement, Strategy } from '@floating-ui/dom';
 import { type AnchorAlign, type AnchorBoundary, type AnchorSide, type CollisionAvoidance, type OffsetFunction } from '../../internals/overlay/index.js';
 import type { BaseUIComponentProps } from '../../types/index.js';

package/dist/lib/types/popover/title/PopoverTitle.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 export interface PopoverTitleState {
 }

package/dist/lib/types/preview-card/arrow/PreviewCardArrow.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { AnchorAlign, AnchorSide } from '../../internals/overlay/index.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 export interface PreviewCardArrowState {

package/dist/lib/types/preview-card/backdrop/PreviewCardBackdrop.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { TransitionStatus } from '../../internals/stateAttributesMapping.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 export interface PreviewCardBackdropState {

package/dist/lib/types/preview-card/positioner/PreviewCardPositioner.d.ts

@@ -1,5 +1,5 @@
 import { type Accessor } from 'solid-js';
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { ReferenceElement } from '@floating-ui/dom';
 import { type AnchorAlign, type AnchorBoundary, type AnchorSide, type CollisionAvoidance, type OffsetFunction } from '../../internals/overlay/index.js';
 import type { BaseUIComponentProps } from '../../types/index.js';

package/dist/lib/types/progress/indicator/ProgressIndicator.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { ProgressRootState } from '../root/ProgressRoot.js';
 export interface ProgressIndicatorState extends ProgressRootState {

package/dist/lib/types/progress/label/ProgressLabel.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { ProgressRootState } from '../root/ProgressRoot.js';
 export interface ProgressLabelState extends ProgressRootState {

package/dist/lib/types/progress/root/ProgressRoot.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 export type ProgressStatus = 'indeterminate' | 'progressing' | 'complete';
 export interface ProgressRootState {

package/dist/lib/types/progress/track/ProgressTrack.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { ProgressRootState } from '../root/ProgressRoot.js';
 export interface ProgressTrackState extends ProgressRootState {

package/dist/lib/types/progress/value/ProgressValue.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { ProgressRootState } from '../root/ProgressRoot.js';
 export interface ProgressValueState extends ProgressRootState {

package/dist/lib/types/radio/indicator/RadioIndicator.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import { type ValidComponent } from '@solidjs/web';
 import { type TransitionStatus } from '../../internals/stateAttributesMapping.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { RadioRootState } from '../root/RadioRoot.js';
@@ -12,7 +12,7 @@ interface RadioIndicatorOwnProps {
 }
 export type RadioIndicatorProps<Component extends ValidComponent = 'span'> = BaseUIComponentProps<Component, RadioIndicatorState, RadioIndicatorOwnProps>;
 /** Indicates whether the enclosing radio is selected. */
-export declare function RadioIndicator<Component extends ValidComponent = 'span'>(props: RadioIndicator.Props<Component>): JSX.Element;
+export declare function RadioIndicator<Component extends ValidComponent = 'span'>(props: RadioIndicator.Props<Component>): import("@solidjs/web").JSX.Element;
 export declare namespace RadioIndicator {
     type State = RadioIndicatorState;
     type Props<Component extends ValidComponent = 'span'> = RadioIndicatorProps<Component>;

package/dist/lib/types/scroll-area/content/ScrollAreaContent.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { ScrollAreaRootState } from '../root/ScrollAreaRoot.js';
 export interface ScrollAreaContentState extends ScrollAreaRootState {

package/dist/lib/types/scroll-area/corner/ScrollAreaCorner.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 export interface ScrollAreaCornerState {
 }

package/dist/lib/types/scroll-area/root/ScrollAreaRoot.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import { type BaseUIEventHandlerUnion } from '../../internals/composeEventHandlers.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { ScrollAreaEventTarget } from '../utils/eventTarget.js';

package/dist/lib/types/scroll-area/scrollbar/ScrollAreaScrollbar.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import { type BaseUIEventHandlerUnion } from '../../internals/composeEventHandlers.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { ScrollAreaRootState } from '../root/ScrollAreaRoot.js';
@@ -14,6 +14,7 @@ interface ScrollAreaScrollbarOwnProps<Component extends ValidComponent> {
     orientation?: ScrollAreaOrientation | undefined;
     /** Keeps the element mounted when its axis is not scrollable. @default false */
     keepMounted?: boolean | undefined;
+    onMouseDown?: BaseUIEventHandlerUnion<ScrollAreaEventTarget<Component, 'onMouseDown', MouseEvent>, MouseEvent> | undefined;
     onPointerCancel?: BaseUIEventHandlerUnion<ScrollAreaEventTarget<Component, 'onPointerCancel', PointerEvent>, PointerEvent> | undefined;
     onPointerDown?: BaseUIEventHandlerUnion<ScrollAreaEventTarget<Component, 'onPointerDown', PointerEvent>, PointerEvent> | undefined;
     onPointerUp?: BaseUIEventHandlerUnion<ScrollAreaEventTarget<Component, 'onPointerUp', PointerEvent>, PointerEvent> | undefined;

package/dist/lib/types/scroll-area/thumb/ScrollAreaThumb.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import { type BaseUIEventHandlerUnion } from '../../internals/composeEventHandlers.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { ScrollAreaEventTarget } from '../utils/eventTarget.js';

package/dist/lib/types/scroll-area/viewport/ScrollAreaViewport.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import { type BaseUIEventHandlerUnion } from '../../internals/composeEventHandlers.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { ScrollAreaRootState } from '../root/ScrollAreaRoot.js';

package/dist/lib/types/separator/Separator.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { Orientation } from '../internals/types.js';
 import type { BaseUIComponentProps } from '../types/index.js';
 export interface SeparatorState {

package/dist/lib/types/slider/track/SliderTrack.d.ts

@@ -1,11 +1,11 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import { type ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { SliderRootState } from '../root/SliderRoot.js';
 export interface SliderTrackState extends SliderRootState {
 }
 export type SliderTrackProps<Component extends ValidComponent = 'div'> = BaseUIComponentProps<Component, SliderTrackState>;
 /** Represents the full range of the slider. */
-export declare function SliderTrack<Component extends ValidComponent = 'div'>(props: SliderTrack.Props<Component>): JSX.Element;
+export declare function SliderTrack<Component extends ValidComponent = 'div'>(props: SliderTrack.Props<Component>): import("@solidjs/web").JSX.Element;
 export declare namespace SliderTrack {
     type State = SliderTrackState;
     type Props<Component extends ValidComponent = 'div'> = SliderTrackProps<Component>;

package/dist/lib/types/tabs/indicator/prehydrationScript.d.ts

@@ -1 +1 @@
-export declare const tabsIndicatorPrehydrationScript = "!function(){const t=document.currentScript.previousElementSibling;if(!t)return;const e=t.closest('[role=\"tablist\"]');if(!e)return;const i=e.querySelector(\"[data-active]\");if(!i)return;function o(t){const e=getComputedStyle(t);let i=parseFloat(e.width)||0,o=parseFloat(e.height)||0;return(Math.round(i)!==t.offsetWidth||Math.round(o)!==t.offsetHeight)&&(i=t.offsetWidth,o=t.offsetHeight),{width:i,height:o}}function n(){let n=0,r=0,s=0,h=0;const{width:c,height:f}=o(i),{width:l,height:u}=o(e),d=i.getBoundingClientRect(),a=e.getBoundingClientRect(),g=l>0?a.width/l:1,b=u>0?a.height/u:1;if(Math.abs(g)>Number.EPSILON&&Math.abs(b)>Number.EPSILON){const t=d.left-a.left,i=d.top-a.top;n=t/g+e.scrollLeft-e.clientLeft,s=i/b+e.scrollTop-e.clientTop}else n=i.offsetLeft,s=i.offsetTop;const p=c,m=f;function v(e,i){t.style.setProperty(`--active-tab-${e}`,`${i}px`)}return r=e.scrollWidth-n-p,h=e.scrollHeight-s-m,v(\"left\",n),v(\"right\",r),v(\"top\",s),v(\"bottom\",h),v(\"width\",p),v(\"height\",m),p>0&&m>0&&(t.removeAttribute(\"hidden\"),!0)}if(n()||\"undefined\"==typeof ResizeObserver)return;let r,s;function h(){s.disconnect(),clearTimeout(r)}s=new ResizeObserver(()=>{t.isConnected&&t.hasAttribute(\"hidden\")&&i.hasAttribute(\"data-active\")?n()&&h():h()}),s.observe(i),r=setTimeout(h,1e4)}();";
+export declare const tabsIndicatorPrehydrationScript = "(() => {\n  const indicator = document.currentScript.previousElementSibling;\n  const list = indicator?.closest('[role=\"tablist\"]');\n  const tab = list?.querySelector('[data-active]');\n  if (!tab) return;\n  const style = getComputedStyle(tab);\n  if (['transform', 'translate', 'rotate', 'scale'].some(key => style[key] && style[key] !== 'none')) return;\n  function cumulative(element) {\n    let left = 0, top = 0;\n    while (element) {\n      left += element.offsetLeft;\n      top += element.offsetTop;\n      element = element.offsetParent;\n      if (element) {\n        left += element.clientLeft;\n        top += element.clientTop;\n      }\n    }\n    return { left, top };\n  }\n  function update() {\n    const css = getComputedStyle(tab);\n    let width = parseFloat(css.width) || 0, height = parseFloat(css.height) || 0;\n    if (Math.round(width) !== tab.offsetWidth || Math.round(height) !== tab.offsetHeight) {\n      width = tab.offsetWidth;\n      height = tab.offsetHeight;\n    }\n    const tabOffset = cumulative(tab), listOffset = cumulative(list);\n    let left = tabOffset.left - listOffset.left - list.clientLeft;\n    let top = tabOffset.top - listOffset.top - list.clientTop;\n    for (let parent = tab.parentElement; parent && parent !== list; parent = parent.parentElement) {\n      left -= parent.scrollLeft;\n      top -= parent.scrollTop;\n    }\n    left = Math.min(left, list.scrollWidth - width);\n    top = Math.min(top, list.scrollHeight - height);\n    const values = { left, top, right: list.scrollWidth - left - width, bottom: list.scrollHeight - top - height, width, height };\n    for (const key in values) indicator.style.setProperty('--active-tab-' + key, values[key] + 'px');\n    if (width > 0 && height > 0) {\n      indicator.removeAttribute('hidden');\n      return true;\n    }\n    return false;\n  }\n  if (update() || typeof ResizeObserver === 'undefined') return;\n  let timer;\n  const observer = new ResizeObserver(() => {\n    if (!indicator.isConnected || !indicator.hasAttribute('hidden') || !tab.hasAttribute('data-active') || update()) {\n      observer.disconnect();\n      clearTimeout(timer);\n    }\n  });\n  observer.observe(tab);\n  timer = setTimeout(() => observer.disconnect(), 10000);\n})();";

package/dist/lib/types/tabs/list/TabsList.d.ts

@@ -1,4 +1,4 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { JSX, ValidComponent } from '@solidjs/web';
 import { type BaseUIEventHandlerUnion } from '../../internals/composeEventHandlers.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { TabsRootState } from '../root/TabsRoot.js';

package/dist/lib/types/tabs/panel/TabsPanel.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import { type TransitionStatus } from '../../internals/stateAttributesMapping.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { TabsRootState } from '../root/TabsRoot.js';

package/dist/lib/types/tabs/root/TabsRoot.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import { type BaseUIChangeEventDetails } from '../../internals/createBaseUIEventDetails.js';
 import { REASONS } from '../../internals/reasons.js';
 import type { Orientation } from '../../internals/types.js';

package/dist/lib/types/tabs/tab/TabsTab.d.ts

@@ -1,4 +1,4 @@
-import { type ComponentProps, type JSX, type ValidComponent } from '@solidjs/web';
+import type { ComponentProps, JSX, ValidComponent } from '@solidjs/web';
 import { type BaseUIEventHandlerUnion } from '../../internals/composeEventHandlers.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { TabsRootOrientation } from '../root/TabsRoot.js';

package/dist/lib/types/toast/createToastManager.d.ts

@@ -1,4 +1,4 @@
-import type { ToastManagerAddOptions, ToastManagerPromiseOptions, ToastManagerUpdateOptions } from './types.js';
+import type { ToastManagerAddOptions, ToastManagerPromiseOptions, ToastManagerUpdateOptions, ToastObject } from './types.js';
 export interface ToastManagerEvent {
     action: 'add' | 'close' | 'update' | 'promise';
     options: any;
@@ -8,7 +8,7 @@ export interface ToastManager<Data extends object = any> {
     ' subscribe': (listener: (data: ToastManagerEvent) => void) => () => void;
     add: <T extends Data = Data>(options: ToastManagerAddOptions<T>) => string;
     close: (id?: string) => void;
-    update: <T extends Data = Data>(id: string, updates: ToastManagerUpdateOptions<T>) => void;
+    update: <T extends Data = Data>(id: string, updates: ToastManagerUpdateOptions<T> | ((prevToast: ToastObject<T>) => ToastManagerUpdateOptions<T>)) => void;
     promise: <Value, T extends Data = Data>(promiseValue: Promise<Value>, options: ToastManagerPromiseOptions<Value, T>) => Promise<Value>;
 }
 /** Creates a toast manager usable outside of a component. */

package/dist/lib/types/toast/store/ToastStore.d.ts

@@ -40,7 +40,7 @@ export declare class ToastStore extends ReactiveStore<ToastState> {
     dispose: () => void;
     removeToast(toastId: string, skipOnRemove?: boolean): void;
     addToast: <Data extends object>(toast: ToastManagerAddOptions<Data>) => string;
-    updateToast: <Data extends object>(id: string, updates: ToastManagerUpdateOptions<Data>) => void;
+    updateToast: <Data extends object>(id: string, updates: ToastManagerUpdateOptions<Data> | ((prevToast: ToastObject<Data>) => ToastManagerUpdateOptions<Data>)) => void;
     updateToastInternal: <Data extends object>(id: string, updates: ToastInternalUpdateOptions<Data>, resetTimer?: boolean, markUpdated?: boolean) => void;
     closeToast: (toastId?: string) => void;
     promiseToast: <Value, Data extends object>(promiseValue: Promise<Value>, options: ToastManagerPromiseOptions<Value, Data>) => Promise<Value>;

package/dist/lib/types/toast/useToastManager.d.ts

@@ -4,7 +4,7 @@ export interface UseToastManagerReturnValue<Data extends object = any> {
     toasts: Accessor<ToastObject<Data>[]>;
     add: <T extends Data = Data>(options: ToastManagerAddOptions<T>) => string;
     close: (toastId?: string) => void;
-    update: <T extends Data = Data>(toastId: string, options: ToastManagerUpdateOptions<T>) => void;
+    update: <T extends Data = Data>(toastId: string, options: ToastManagerUpdateOptions<T> | ((prevToast: ToastObject<T>) => ToastManagerUpdateOptions<T>)) => void;
     promise: <Value, T extends Data = Data>(promiseValue: Promise<Value>, options: ToastManagerPromiseOptions<Value, T>) => Promise<Value>;
 }
 /** Returns an accessor for the toasts along with methods to manage them. */

package/dist/lib/types/toggle/Toggle.d.ts

@@ -1,4 +1,4 @@
-import { type ComponentProps, type JSX, type ValidComponent } from '@solidjs/web';
+import type { ComponentProps, JSX, ValidComponent } from '@solidjs/web';
 import { type BaseUIEventHandlerUnion } from '../internals/composeEventHandlers.js';
 import { createChangeEventDetails } from '../internals/createBaseUIEventDetails.js';
 import { REASONS } from '../internals/reasons.js';

package/dist/lib/types/toggle-group/ToggleGroup.d.ts

@@ -1,4 +1,4 @@
-import { type ComponentProps, type JSX, type ValidComponent } from '@solidjs/web';
+import type { ComponentProps, JSX, ValidComponent } from '@solidjs/web';
 import { type BaseUIEventHandlerUnion } from '../internals/composeEventHandlers.js';
 import type { BaseUIComponentProps } from '../types/index.js';
 import type { Orientation } from '../internals/types.js';

package/dist/lib/types/toolbar/group/ToolbarGroup.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { BaseUIComponentProps } from '../../types/index.js';
 import type { ToolbarRootState } from '../root/ToolbarRoot.js';
 export interface ToolbarGroupState extends ToolbarRootState {

package/dist/lib/types/toolbar/link/ToolbarLink.d.ts

@@ -1,14 +1,21 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
-import type { BaseUIComponentProps } from '../../types/index.js';
+import type { ComponentProps, JSX, ValidComponent } from '@solidjs/web';
+import type { BaseUIComponentProps, BaseUIEvent } from '../../types/index.js';
 import type { ToolbarRootOrientation } from '../root/ToolbarRoot.js';
 export interface ToolbarLinkState {
     /** The direction in which toolbar items are arranged. */
     orientation: ToolbarRootOrientation;
 }
-export type ToolbarLinkProps<Component extends ValidComponent = 'a'> = BaseUIComponentProps<Component, ToolbarLinkState>;
+type ToolbarLinkEventTarget<Component extends ValidComponent> = ComponentProps<Component> extends {
+    onFocus?: JSX.FocusEventHandlerUnion<infer Target, FocusEvent> | undefined;
+} ? Target extends HTMLElement ? Target : HTMLElement : HTMLElement;
+interface ToolbarLinkOwnProps<Component extends ValidComponent> {
+    onFocus?: JSX.FocusEventHandlerUnion<ToolbarLinkEventTarget<Component>, BaseUIEvent<FocusEvent>> | undefined;
+}
+export type ToolbarLinkProps<Component extends ValidComponent = 'a'> = BaseUIComponentProps<Component, ToolbarLinkState, ToolbarLinkOwnProps<Component>>;
 /** A native link that occupies one toolbar roving-focus slot. */
 export declare function ToolbarLink<Component extends ValidComponent = 'a'>(props: ToolbarLink.Props<Component>): JSX.Element;
 export declare namespace ToolbarLink {
     type State = ToolbarLinkState;
     type Props<Component extends ValidComponent = 'a'> = ToolbarLinkProps<Component>;
 }
+export {};

package/dist/lib/types/toolbar/root/ToolbarRoot.d.ts

@@ -1,6 +1,7 @@
-import { type JSX, type ValidComponent } from '@solidjs/web';
+import type { ComponentProps, JSX, ValidComponent } from '@solidjs/web';
+import { type BaseUIEventHandlerUnion } from '../../internals/composeEventHandlers.js';
 import type { Orientation } from '../../internals/types.js';
-import type { BaseUIComponentProps } from '../../types/index.js';
+import type { BaseUIComponentProps, BaseUIEvent } from '../../types/index.js';
 export interface ToolbarRootItemMetadata {
     disabled: boolean;
     focusableWhenDisabled: boolean;
@@ -12,12 +13,17 @@ export interface ToolbarRootState {
     /** The direction in which toolbar items are arranged. */
     orientation: ToolbarRootOrientation;
 }
-interface ToolbarRootOwnProps {
+type ToolbarRootEventTarget<Component extends ValidComponent> = ComponentProps<Component> extends {
+    onKeyDown?: JSX.EventHandlerUnion<infer Target, KeyboardEvent> | undefined;
+} ? Target extends HTMLElement ? Target : HTMLElement : HTMLElement;
+interface ToolbarRootOwnProps<Component extends ValidComponent> {
     disabled?: boolean | undefined;
     loopFocus?: boolean | undefined;
     orientation?: ToolbarRootOrientation | undefined;
+    onFocusIn?: JSX.FocusEventHandlerUnion<ToolbarRootEventTarget<Component>, BaseUIEvent<FocusEvent>> | undefined;
+    onKeyDown?: BaseUIEventHandlerUnion<ToolbarRootEventTarget<Component>, KeyboardEvent> | undefined;
 }
-export type ToolbarRootProps<Component extends ValidComponent = 'div'> = BaseUIComponentProps<Component, ToolbarRootState, ToolbarRootOwnProps>;
+export type ToolbarRootProps<Component extends ValidComponent = 'div'> = BaseUIComponentProps<Component, ToolbarRootState, ToolbarRootOwnProps<Component>>;
 /** A container for grouping a set of controls into one keyboard navigation scope. */
 export declare function ToolbarRoot<Component extends ValidComponent = 'div'>(props: ToolbarRoot.Props<Component>): JSX.Element;
 export declare namespace ToolbarRoot {

package/dist/lib/types/toolbar/separator/ToolbarSeparator.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { Orientation } from '../../internals/types.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 export interface ToolbarSeparatorState {

package/dist/lib/types/tooltip/arrow/TooltipArrow.d.ts

@@ -1,4 +1,4 @@
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { AnchorAlign, AnchorSide } from '../../internals/overlay/index.js';
 import type { BaseUIComponentProps } from '../../types/index.js';
 export interface TooltipArrowState {

package/dist/lib/types/tooltip/positioner/TooltipPositioner.d.ts

@@ -1,5 +1,5 @@
 import { type Accessor } from 'solid-js';
-import { type ValidComponent } from '@solidjs/web';
+import type { ValidComponent } from '@solidjs/web';
 import type { ReferenceElement, Strategy } from '@floating-ui/dom';
 import { type AnchorAlign, type AnchorBoundary, type AnchorSide, type CollisionAvoidance, type OffsetFunction } from '../../internals/overlay/index.js';
 import type { BaseUIComponentProps } from '../../types/index.js';

package/dist/lib/types/types/index.d.ts

@@ -9,14 +9,18 @@ export type StyleValue<State> = JSX.CSSProperties | string | false | undefined |
 export type Simplify<Value> = Value extends (...args: never[]) => unknown ? Value : {
     [Key in keyof Value]: Value[Key];
 };
-export type PolymorphicProps<Component extends ValidComponent, OwnProps extends object = Record<never, never>, State = Record<never, never>> = Simplify<OwnProps & Omit<ComponentProps<Component>, keyof OwnProps | 'as' | 'class' | 'style'> & {
-    /** Replaces the default root element or component. */
-    as?: Component | undefined;
+export type PolymorphicProps<Component extends ValidComponent, OwnProps extends object = Record<never, never>, State = Record<never, never>> = Simplify<OwnProps & Omit<ComponentProps<Component>, keyof OwnProps | 'render' | 'class' | 'style'> & {
+    /** Replaces the root. Forward the supplied props and ref to one element. */
+    render?: ComponentRenderFn<State> | undefined;
     /** CSS classes, optionally derived from the component state. */
     class?: ClassValue<State> | undefined;
     /** Inline styles, optionally derived from the component state. */
     style?: StyleValue<State> | undefined;
 }>;
+/** Props supplied to a render callback; the callback chooses the concrete DOM target. */
+export type ComponentRenderProps = JSX.HTMLAttributes<any> & Record<string, unknown>;
+/** Runs once per mount. Read props and state in JSX to retain reactivity. */
+export type ComponentRenderFn<State = Record<never, never>> = (props: ComponentRenderProps, state: State) => JSX.Element;
 export type BaseUIComponentProps<Component extends ValidComponent, State, OwnProps extends object = Record<never, never>> = PolymorphicProps<Component, OwnProps, State>;
 export type NativeComponentProps<Component extends ValidComponent, State, OwnProps extends object = Record<never, never>> = Simplify<OwnProps & Omit<ComponentProps<Component>, keyof OwnProps | 'class' | 'style'> & {
     /** CSS classes, optionally derived from the component state. */

package/dist/lib/types/use-render/index.d.ts

@@ -0,0 +1,2 @@
+export { useRender } from './useRender.js';
+export type { ComponentRenderFn, ComponentRenderProps } from '../types/index.js';

package/dist/lib/types/use-render/useRender.d.ts

@@ -0,0 +1,10 @@
+import { type Accessor } from 'solid-js';
+import type { JSX } from '@solidjs/web';
+import type { ComponentRenderFn, ComponentRenderProps } from '../types/index.js';
+/**
+ * Creates a root renderer with a native JSX fallback. The renderer is selected at
+ * mount; conditional roots belong inside the callback, using Solid control flow.
+ */
+export declare function useRender<State extends object>(props: {
+    render?: ComponentRenderFn<State> | undefined;
+}, state: Accessor<State>, fallback: (props: ComponentRenderProps) => JSX.Element): (props: ComponentRenderProps) => JSX.Element;