@amazon/vinyl-tsx 1.1.1 → 2.0.0

package/dist/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/domUtil.ts", "../src/extensions/connectedObserver.ts", "../src/extensions/applyStyles.ts", "../src/jsx.ts", "../src/ActiveText.ts", "../src/extensions/applyVisibility.ts", "../src/extensions/applyClassList.ts", "../src/extensions/applyPassiveHandler.ts"],
-  "sourcesContent": ["/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nexport function el<K extends keyof HTMLElementTagNameMap>(\n    selectors: K,\n    parentNode?: ParentNode\n): HTMLElementTagNameMap[K]\nexport function el(selectors: string, parentNode?: ParentNode): HTMLElement\nexport function el<E extends Element = Element>(\n    selectors: string,\n    parentNode: ParentNode = document\n): E {\n    const element = parentNode.querySelector(selectors)\n    if (!element) throw new Error(`${selectors} must be a DOM element`)\n    return element as E\n}\n\nexport interface QuerySelector {\n    <K extends keyof HTMLElementTagNameMap>(\n        selectors: K,\n        parentNode?: ParentNode\n    ): HTMLElementTagNameMap[K]\n    (selectors: string): HTMLElement\n}\n\nexport function bindQuerySelector(parentNode: ParentNode): QuerySelector {\n    return (selectors: string) => el(selectors, parentNode)\n}\n\nexport function hide(element: HTMLElement) {\n    element.style.display = 'none'\n}\n\nexport function show(element: HTMLElement) {\n    element.style.removeProperty('display')\n}\n\nexport function getVisible(element: HTMLElement): boolean {\n    return element.style.display !== 'none'\n}\n\nexport function setVisible(element: HTMLElement, value: boolean) {\n    if (getVisible(element) === value) return\n    if (value) show(element)\n    else hide(element)\n}\n\nexport function isHidden(element: HTMLElement) {\n    let node: HTMLElement | null = element\n    while (node) {\n        if (getComputedStyle(node).display === 'none') return true\n        node = node.parentElement\n    }\n    return false\n}\n\nexport function isInputElement(\n    value: Element | null\n): value is HTMLInputElement {\n    return value?.tagName.toLowerCase() === 'input'\n}\n\n/**\n * Adds or removes a class token to an element.\n *\n * @param value The element whose classList to modify.\n * @param token The class token.\n * @param toggled If true, the token is added, if false, removed.\n */\nexport function setClassToken(\n    value: HTMLElement,\n    token: string,\n    toggled: boolean\n) {\n    if (toggled) {\n        value.classList.add(token)\n    } else {\n        value.classList.remove(token)\n    }\n}\n\nexport type ElementInitOptions = {\n    readonly parent?: HTMLElement\n    readonly className?: string\n}\n\n/**\n * Recursively walks a node hierarchy, invoking a callback for every node, depth first.\n *\n * @param node\n * @param callback\n */\nexport function walkDomDepthFirst(\n    node: Node | undefined | null,\n    callback: (node: Node) => void\n) {\n    if (!node) return\n    let next = node.firstChild\n    while (next) {\n        walkDomDepthFirst(next, callback)\n        next = next.nextSibling\n    }\n    callback(node)\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport { walkDomDepthFirst } from '../domUtil'\nimport type { Maybe, Unsubscribe } from '@amazon/vinyl-util'\n\n/**\n * Dispatches a 'connected' event on nodes attached to the dom, dispatches 'disconnected' when removed.\n * Allows nodes to observe connected changes without creating a memory leak.\n */\nexport function initializeConnectedObserver(): Unsubscribe {\n    const observer = new MutationObserver((mutations) => {\n        const removed = new Set<Node>()\n        const added = new Set<Node>()\n\n        // First pass: flatten removed and added nodes so we can detect nodes re-ordered.\n        for (const mutation of mutations) {\n            mutation.removedNodes.forEach((node) => removed.add(node))\n            mutation.addedNodes.forEach((node) => added.add(node))\n        }\n\n        // Second pass: handle added/removed, skipping reorders\n        for (const mutation of mutations) {\n            for (const node of mutation.addedNodes) {\n                if (removed.has(node)) continue\n                walkDomDepthFirst(node, (iNode) => {\n                    iNode.dispatchEvent(\n                        new CustomEvent('connect', { bubbles: false })\n                    )\n                })\n            }\n\n            for (const node of mutation.removedNodes) {\n                if (added.has(node)) continue\n                walkDomDepthFirst(node, (iNode) => {\n                    iNode.dispatchEvent(\n                        new CustomEvent('disconnect', { bubbles: false })\n                    )\n                })\n            }\n        }\n    })\n\n    observer.observe(document, { childList: true, subtree: true })\n\n    return () => {\n        observer.disconnect()\n    }\n}\n\n/**\n * Invokes a callback when the given target is connected to the DOM.\n * If the callback returns a function, that function will be invoked when disconnected.\n *\n * @param target\n * @param callback\n */\nexport function onConnect<T extends Node>(\n    target: T,\n    callback: (node: T) => Maybe<Unsubscribe> | void\n): Unsubscribe {\n    let sub: Maybe<Unsubscribe> | void = null\n    let connected = false\n    const onConnect = () => {\n        if (connected) return\n        connected = true\n        sub = callback(target)\n    }\n    const onDisconnect = () => {\n        connected = false\n        sub?.()\n        sub = null\n    }\n    target.addEventListener('connect', onConnect)\n    target.addEventListener('disconnect', onDisconnect)\n    if (target.isConnected) onConnect()\n    return () => {\n        target.removeEventListener('connect', onConnect)\n        target.removeEventListener('disconnect', onDisconnect)\n        onDisconnect()\n    }\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport type { AllowBindable } from '../jsx'\nimport { onConnect } from './connectedObserver'\nimport { toKebabCase } from '@amazon/vinyl-util'\nimport {\n    isObservableValue,\n    type MaybeObservableValue,\n} from '@amazon/vinyl-observable'\nimport type { Maybe } from '@amazon/vinyl-util'\n\n/**\n * The shape accepted by the `style` jsx prop. Allows the typed CSSStyleDeclaration\n * fields plus any CSS custom property key (must start with `--`).\n */\nexport type StyleProp = AllowBindable<Partial<CSSStyleDeclaration>> & {\n    readonly [customProperty: `--${string}`]: MaybeObservableValue<\n        Maybe<string>\n    >\n}\n\nexport function applyStyles(element: HTMLElement, style: StyleProp) {\n    // noinspection SuspiciousTypeOfGuard\n    if (typeof style === 'string') {\n        // A Partial style declaration type does not prohibit a string type.\n        throw new Error('expected style property to be type object')\n    }\n    for (const k in style) {\n        const v = (style as Record<string, unknown>)[k]\n        // Custom properties (starting with `--`) are passed through as-is so\n        // they aren't kebab-cased a second time, and so they remain valid keys\n        // for setProperty.\n        const property = k.startsWith('--') ? k : toKebabCase(k)\n        if (isObservableValue(v)) {\n            onConnect(element, () => {\n                return v.onData((value) => {\n                    element.style.setProperty(\n                        property,\n                        (value ?? null) as string | null\n                    )\n                })\n            })\n        } else {\n            element.style.setProperty(property, (v ?? null) as string | null)\n        }\n    }\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport { onConnect } from './extensions/connectedObserver'\nimport type { Writable } from './type'\nimport { applyStyles } from './extensions/applyStyles'\nimport {\n    isObservableValue,\n    type MaybeObservableValue,\n    type ObservableValue,\n} from '@amazon/vinyl-observable'\nimport { ActiveText } from './ActiveText'\nimport { applyVisibility } from './extensions/applyVisibility'\nimport { applyClassList } from './extensions/applyClassList'\nimport type { HookExtension } from './extensions/HookExtension'\nimport { passiveEventHandlers } from './extensions/applyPassiveHandler'\nimport type { AnyRecord, Maybe } from '@amazon/vinyl-util'\n\n/**\n * Maps JS property names to their corresponding HTML attribute names where they differ.\n * Extensible \u2014 add entries for custom elements or non-standard properties.\n */\nexport const propToAttr: Record<string, string> = {\n    acceptCharset: 'accept-charset',\n    accessKey: 'accesskey',\n    className: 'class',\n    colSpan: 'colspan',\n    contentEditable: 'contenteditable',\n    crossOrigin: 'crossorigin',\n    dateTime: 'datetime',\n    dirName: 'dirname',\n    encType: 'enctype',\n    formAction: 'formaction',\n    formEnctype: 'formenctype',\n    formMethod: 'formmethod',\n    formNoValidate: 'formnovalidate',\n    formTarget: 'formtarget',\n    htmlFor: 'for',\n    httpEquiv: 'http-equiv',\n    inputMode: 'inputmode',\n    maxLength: 'maxlength',\n    minLength: 'minlength',\n    noModule: 'nomodule',\n    noValidate: 'novalidate',\n    readOnly: 'readonly',\n    referrerPolicy: 'referrerpolicy',\n    rowSpan: 'rowspan',\n    tabIndex: 'tabindex',\n    useMap: 'usemap',\n}\n\n/**\n * Sets a property on an element. When value is non-null, assigns directly via\n * property. When null, resets the property to '' and removes the HTML attribute\n * using the mapped name from {@link propToAttr}.\n */\nfunction setProp(element: HTMLElement, k: string, value: unknown): void {\n    if (value == null) {\n        ;(element as any)[k] = ''\n        const attr = propToAttr[k] ?? k\n        element.removeAttribute(attr)\n    } else {\n        ;(element as any)[k] = value\n    }\n}\n\nexport type JsxFactory = (props: any, children: any[]) => any\n\n/**\n * A map of custom jsx properties to be used in hook extensions.\n */\nexport const hookExtensions = {\n    onConnect: onConnect<HTMLElement>,\n    style: applyStyles,\n    visible: applyVisibility,\n    classList: applyClassList,\n    ...passiveEventHandlers,\n} as const satisfies Record<keyof any, HookExtension<any>>\n\nexport type AllowBindable<T> = {\n    [K in keyof T]: MaybeObservableValue<Maybe<T[K]>>\n}\n\n/**\n * A type map of the jsx extended properties to the type provided to the hook.\n */\nexport type HookExtensions = {\n    [p in keyof typeof hookExtensions]?: Parameters<\n        (typeof hookExtensions)[p]\n    >[1]\n}\n\nexport type ElementProps<K extends keyof HTMLElementTagNameMap> = Omit<\n    Partial<Writable<HTMLElementTagNameMap[K]>>,\n    keyof HookExtensions\n>\n\nexport type BindableElementProps<K extends keyof HTMLElementTagNameMap> =\n    AllowBindable<ElementProps<K>>\n\n/**\n * Allowed properties for intrinsic elements when writing jsx declarative markup.\n */\nexport type JsxElementProps<K extends keyof HTMLElementTagNameMap> =\n    BindableElementProps<K> & HookExtensions\n\nexport type DomIntrinsicElements = {\n    [K in keyof HTMLElementTagNameMap]: JsxElementProps<K>\n}\n\nexport type JsxChild = Node | string | ObservableValue<Node | string>\n\nexport function jsx<K extends keyof HTMLElementTagNameMap>(\n    type: K,\n    props: JsxElementProps<K>,\n    ...children: JsxChild[]\n): HTMLElementTagNameMap[K]\n\nexport function jsx<Factory extends JsxFactory>(\n    type: Factory,\n    props: Parameters<Factory>[0],\n    ...children: Parameters<Factory>[1]\n): ReturnType<Factory>\n\nexport function jsx(type: any, props: any, ...children: any) {\n    if (typeof type === 'string') {\n        const element = document.createElement(type)\n        for (const k in props) {\n            const v = props[k]\n            if (k in hookExtensions) {\n                hookExtensions[k as keyof typeof hookExtensions](element, v)\n                continue\n            }\n            if (isObservableValue(v)) {\n                onConnect(element, () => {\n                    return v.onData((data$) => setProp(element, k, data$))\n                })\n            } else {\n                setProp(element, k, v)\n            }\n        }\n        element.append(\n            ...children\n                .filter((child: JsxChild | null) => child != null)\n                .map((child: JsxChild) => {\n                    return isObservableValue(child) ? ActiveText(child) : child\n                })\n        )\n        return element\n    } else {\n        return type(props, children)\n    }\n}\n\nexport function Fragment(_props: AnyRecord, children: (Node | string)[]) {\n    return jsx(\n        'div',\n        {\n            style: {\n                display: 'contents',\n            },\n        },\n        ...children\n    )\n}\n\ndeclare global {\n    // eslint-disable-next-line @typescript-eslint/no-namespace\n    namespace JSX {\n        type IntrinsicElements = DomIntrinsicElements\n        type Element = HTMLElement\n        type Fragment = HTMLElement\n    }\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport type { ObservableValue } from '@amazon/vinyl-observable'\nimport { onConnect } from './extensions/connectedObserver'\n\n/**\n * A Text node bound to a data provider.\n * Created automatically when a child is a ObservableValue.\n * textContent will only be updated when the node is on the DOM.\n */\nexport function ActiveText<T>(data: ObservableValue<T>): Text {\n    const text = document.createTextNode(String(data.value ?? ''))\n    onConnect(text, () => {\n        return data.onData((value) => {\n            text.textContent = String(value ?? '')\n        })\n    })\n    return text\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport type { ObservableValue } from '@amazon/vinyl-observable'\nimport { onConnect } from './connectedObserver'\n\nexport function applyVisibility(\n    element: HTMLElement,\n    visible: boolean | ObservableValue<boolean>\n): void {\n    if (typeof visible === 'boolean') {\n        if (!visible) element.style.display = 'none'\n    } else {\n        onConnect(element, () => {\n            return visible.onData((value) => {\n                if (value) element.style.removeProperty('display')\n                else element.style.display = 'none'\n            })\n        })\n    }\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {\n    isObservableValue,\n    type ObservableValue,\n} from '@amazon/vinyl-observable'\nimport { onConnect } from './connectedObserver'\nimport type { Maybe, Unsubscribe } from '@amazon/vinyl-util'\n\nexport function applyClassList(\n    element: HTMLElement,\n    classList: readonly (Maybe<string> | ObservableValue<Maybe<string>>)[]\n): void {\n    const tokens = classList.filter((s) => typeof s === 'string')\n    element.classList.add(...tokens)\n    if (tokens.length < classList.length) {\n        onConnect(element, () => {\n            const subs: Unsubscribe[] = []\n            for (const dP of classList.filter(isObservableValue)) {\n                subs.push(bindClass(element, dP))\n            }\n            return () => {\n                subs.forEach((sub) => sub())\n            }\n        })\n    }\n}\n\nfunction bindClass(\n    element: HTMLElement,\n    tokenProvider: ObservableValue<Maybe<string>>\n): Unsubscribe {\n    let current: string | null = null\n    const dataSub = tokenProvider.onData((className) => {\n        if (current) element.classList.remove(current)\n        if (className) {\n            current = className\n            element.classList.add(className)\n        } else {\n            current = null\n        }\n    })\n    return () => {\n        if (current != null) element.classList.remove(current)\n        dataSub()\n    }\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport type { HookExtension } from './HookExtension'\n\nexport const passiveEventHandlers = {\n    ontouchstart: /* @__PURE__ */ applyPassiveHandler('ontouchstart'),\n    ontouchmove: /* @__PURE__ */ applyPassiveHandler('ontouchmove'),\n    onwheel: /* @__PURE__ */ applyPassiveHandler('onwheel'),\n} as const\n\nfunction applyPassiveHandler<K extends keyof GlobalEventHandlers>(\n    key: K\n): HookExtension<GlobalEventHandlers[K]> {\n    const eventName = key.substring(2)\n    return (element: HTMLElement, handler: GlobalEventHandlers[K]) => {\n        element.addEventListener(eventName, handler as any, { passive: true })\n    }\n}\n"],
-  "mappings": "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",
-  "names": ["onConnect", "isObservableValue", "isObservableValue", "isObservableValue", "isObservableValue"]
+  "sources": ["../src/domUtil.ts", "../src/extensions/connectedObserver.ts", "../src/ActiveText.ts", "../src/extensions/applyClassList.ts", "../src/extensions/applyPassiveHandler.ts", "../src/extensions/applyStyles.ts", "../src/extensions/applyVisibility.ts", "../src/jsx.ts"],
+  "sourcesContent": ["/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nexport function el<K extends keyof HTMLElementTagNameMap>(\n    selectors: K,\n    parentNode?: ParentNode\n): HTMLElementTagNameMap[K]\nexport function el(selectors: string, parentNode?: ParentNode): HTMLElement\nexport function el<E extends Element = Element>(\n    selectors: string,\n    parentNode: ParentNode = document\n): E {\n    const element = parentNode.querySelector(selectors)\n    if (!element) throw new Error(`${selectors} must be a DOM element`)\n    return element as E\n}\n\nexport interface QuerySelector {\n    <K extends keyof HTMLElementTagNameMap>(\n        selectors: K,\n        parentNode?: ParentNode\n    ): HTMLElementTagNameMap[K]\n    (selectors: string): HTMLElement\n}\n\nexport function bindQuerySelector(parentNode: ParentNode): QuerySelector {\n    return (selectors: string) => el(selectors, parentNode)\n}\n\nexport function hide(element: HTMLElement) {\n    element.style.display = 'none'\n}\n\nexport function show(element: HTMLElement) {\n    element.style.removeProperty('display')\n}\n\nexport function getVisible(element: HTMLElement): boolean {\n    return element.style.display !== 'none'\n}\n\nexport function setVisible(element: HTMLElement, value: boolean) {\n    if (getVisible(element) === value) return\n    if (value) show(element)\n    else hide(element)\n}\n\nexport function isHidden(element: HTMLElement) {\n    let node: HTMLElement | null = element\n    while (node) {\n        if (getComputedStyle(node).display === 'none') return true\n        node = node.parentElement\n    }\n    return false\n}\n\nexport function isInputElement(\n    value: Element | null\n): value is HTMLInputElement {\n    return value?.tagName.toLowerCase() === 'input'\n}\n\n/**\n * Adds or removes a class token to an element.\n *\n * @param value The element whose classList to modify.\n * @param token The class token.\n * @param toggled If true, the token is added, if false, removed.\n */\nexport function setClassToken(\n    value: HTMLElement,\n    token: string,\n    toggled: boolean\n) {\n    if (toggled) {\n        value.classList.add(token)\n    } else {\n        value.classList.remove(token)\n    }\n}\n\nexport type ElementInitOptions = {\n    readonly parent?: HTMLElement\n    readonly className?: string\n}\n\n/**\n * Recursively walks a node hierarchy, invoking a callback for every node, depth first.\n *\n * @param node\n * @param callback\n */\nexport function walkDomDepthFirst(\n    node: Node | undefined | null,\n    callback: (node: Node) => void\n) {\n    if (!node) return\n    let next = node.firstChild\n    while (next) {\n        // Snapshot the sibling before recursing so a callback that moves\n        // `next` can't sever the chain and skip the rest of the row.\n        const after = next.nextSibling\n        walkDomDepthFirst(next, callback)\n        next = after\n    }\n    callback(node)\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport { walkDomDepthFirst } from '../domUtil'\nimport type { Maybe, Unsubscribe } from '@amazon/vinyl-util'\n\n/**\n * Dispatches a 'connected' event on nodes attached to the dom, dispatches 'disconnected' when removed.\n * Allows nodes to observe connected changes without creating a memory leak.\n */\nexport function initializeConnectedObserver(): Unsubscribe {\n    const observer = new MutationObserver((mutations) => {\n        const removed = new Set<Node>()\n        const added = new Set<Node>()\n\n        // First pass: flatten removed and added nodes so we can detect nodes re-ordered.\n        for (const mutation of mutations) {\n            mutation.removedNodes.forEach((node) => removed.add(node))\n            mutation.addedNodes.forEach((node) => added.add(node))\n        }\n\n        // Second pass: handle added/removed, skipping reorders\n        for (const mutation of mutations) {\n            for (const node of mutation.addedNodes) {\n                if (removed.has(node)) continue\n                walkDomDepthFirst(node, (iNode) => {\n                    iNode.dispatchEvent(\n                        new CustomEvent('connect', { bubbles: false })\n                    )\n                })\n            }\n\n            for (const node of mutation.removedNodes) {\n                if (added.has(node)) continue\n                walkDomDepthFirst(node, (iNode) => {\n                    iNode.dispatchEvent(\n                        new CustomEvent('disconnect', { bubbles: false })\n                    )\n                })\n            }\n        }\n    })\n\n    observer.observe(document, { childList: true, subtree: true })\n\n    return () => {\n        observer.disconnect()\n    }\n}\n\n/**\n * Invokes a callback when the given target is connected to the DOM.\n * If the callback returns a function, that function will be invoked when disconnected.\n *\n * @param target\n * @param callback\n */\nexport function onConnect<T extends Node>(\n    target: T,\n    callback: (node: T) => Maybe<Unsubscribe> | void\n): Unsubscribe {\n    let sub: Maybe<Unsubscribe> | void = null\n    let connected = false\n    const onConnect = () => {\n        if (connected) return\n        connected = true\n        sub = callback(target)\n    }\n    const onDisconnect = () => {\n        connected = false\n        sub?.()\n        sub = null\n    }\n    target.addEventListener('connect', onConnect)\n    target.addEventListener('disconnect', onDisconnect)\n    if (target.isConnected) onConnect()\n    return () => {\n        target.removeEventListener('connect', onConnect)\n        target.removeEventListener('disconnect', onDisconnect)\n        onDisconnect()\n    }\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport type { ObservableValue } from '@amazon/vinyl-observable'\nimport { onConnect } from './extensions/connectedObserver'\n\n/**\n * A Text node bound to a data provider.\n * Created automatically when a child is a ObservableValue.\n * textContent will only be updated when the node is on the DOM.\n */\nexport function ActiveText<T>(data: ObservableValue<T>): Text {\n    const text = document.createTextNode(String(data.value ?? ''))\n    onConnect(text, () => {\n        return data.onData((value) => {\n            text.textContent = String(value ?? '')\n        })\n    })\n    return text\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {\n    isObservableValue,\n    type ObservableValue,\n} from '@amazon/vinyl-observable'\nimport { onConnect } from './connectedObserver'\nimport {\n    createDisposer,\n    noop,\n    type Maybe,\n    type Unsubscribe,\n} from '@amazon/vinyl-util'\n\nexport function applyClassList(\n    element: HTMLElement,\n    classList: readonly (Maybe<string> | ObservableValue<Maybe<string>>)[]\n): Unsubscribe {\n    const tokens = classList.filter((s) => typeof s === 'string')\n    element.classList.add(...tokens)\n    if (tokens.length < classList.length) {\n        return onConnect(element, () => {\n            const { add, dispose } = createDisposer()\n            for (const dP of classList.filter(isObservableValue)) {\n                add(bindClass(element, dP))\n            }\n            return dispose\n        })\n    }\n    return noop\n}\n\nfunction bindClass(\n    element: HTMLElement,\n    tokenProvider: ObservableValue<Maybe<string>>\n): Unsubscribe {\n    let current: string | null = null\n    const dataSub = tokenProvider.onData((className) => {\n        if (current) element.classList.remove(current)\n        if (className) {\n            current = className\n            element.classList.add(className)\n        } else {\n            current = null\n        }\n    })\n    return () => {\n        if (current != null) element.classList.remove(current)\n        dataSub()\n    }\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport type { HookExtension } from './HookExtension'\n\nexport const passiveEventHandlers = {\n    ontouchstart: /* @__PURE__ */ applyPassiveHandler('ontouchstart'),\n    ontouchmove: /* @__PURE__ */ applyPassiveHandler('ontouchmove'),\n    onwheel: /* @__PURE__ */ applyPassiveHandler('onwheel'),\n} as const\n\nfunction applyPassiveHandler<K extends keyof GlobalEventHandlers>(\n    key: K\n): HookExtension<GlobalEventHandlers[K]> {\n    const eventName = key.substring(2)\n    return (element: HTMLElement, handler: GlobalEventHandlers[K]) => {\n        element.addEventListener(eventName, handler as any, { passive: true })\n    }\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport { onConnect } from './connectedObserver'\nimport { toKebabCase } from '@amazon/vinyl-util'\nimport {\n    isObservableValue,\n    type MaybeObservableValue,\n} from '@amazon/vinyl-observable'\nimport type { Maybe } from '@amazon/vinyl-util'\n\n/**\n * The shape accepted by the `style` jsx prop. Allows the typed CSSStyleDeclaration\n * fields plus any CSS custom property key (must start with `--`). Null / undefined\n * clear the CSS property (via setProperty(name, null)), so values are Maybe-wrapped\n * here even though bindable IDL props reject null.\n */\nexport type StyleProp = {\n    [K in keyof Partial<CSSStyleDeclaration>]: MaybeObservableValue<\n        Maybe<CSSStyleDeclaration[K]>\n    >\n} & {\n    readonly [customProperty: `--${string}`]: MaybeObservableValue<\n        Maybe<string>\n    >\n}\n\nexport function applyStyles(element: HTMLElement, style: StyleProp) {\n    // noinspection SuspiciousTypeOfGuard\n    if (typeof style === 'string') {\n        // A Partial style declaration type does not prohibit a string type.\n        throw new Error('expected style property to be type object')\n    }\n    for (const k in style) {\n        const v = (style as Record<string, unknown>)[k]\n        // Custom properties (starting with `--`) are passed through as-is so\n        // they aren't kebab-cased a second time, and so they remain valid keys\n        // for setProperty.\n        const property = k.startsWith('--') ? k : toKebabCase(k)\n        if (isObservableValue(v)) {\n            onConnect(element, () => {\n                return v.onData((value) => {\n                    element.style.setProperty(\n                        property,\n                        (value ?? null) as string | null\n                    )\n                })\n            })\n        } else {\n            element.style.setProperty(property, (v ?? null) as string | null)\n        }\n    }\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport type { ObservableValue } from '@amazon/vinyl-observable'\nimport { onConnect } from './connectedObserver'\n\nexport function applyVisibility(\n    element: HTMLElement,\n    visible: boolean | ObservableValue<boolean>\n): void {\n    if (typeof visible === 'boolean') {\n        if (!visible) element.style.display = 'none'\n    } else {\n        onConnect(element, () => {\n            return visible.onData((value) => {\n                if (value) element.style.removeProperty('display')\n                else element.style.display = 'none'\n            })\n        })\n    }\n}\n", "/*\n * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport { onConnect } from './extensions/connectedObserver'\nimport type { Writable } from './type'\nimport { applyStyles } from './extensions/applyStyles'\nimport {\n    isObservableValue,\n    type MaybeObservableValue,\n    type ObservableValue,\n} from '@amazon/vinyl-observable'\nimport { ActiveText } from './ActiveText'\nimport { applyVisibility } from './extensions/applyVisibility'\nimport { applyClassList } from './extensions/applyClassList'\nimport type { HookExtension } from './extensions/HookExtension'\nimport { passiveEventHandlers } from './extensions/applyPassiveHandler'\nimport type { AnyRecord } from '@amazon/vinyl-util'\n\n/**\n * Names like `aria-label` / `role` / `data-*` / any hyphenated prop are DOM\n * attributes with no matching IDL property \u2014 assigning them via `element[k]`\n * creates an inert expando and the a11y tree / CSS attribute selectors never\n * see the value. Route those through setAttribute so JSX like\n * `<div aria-label=\"foo\" />` actually reaches the DOM.\n */\nfunction isAttributeOnlyName(k: string): boolean {\n    return k === 'role' || k.indexOf('-') >= 0\n}\n\n/**\n * Sets a property on an element. Hyphenated / aria / role / data names are\n * assigned as HTML attributes; everything else stays on the property path so\n * camelCase IDL props (className, tabIndex, onClick, \u2026) keep their existing\n * fast-path semantics.\n */\nfunction setProp(element: HTMLElement, k: string, value: unknown): void {\n    if (isAttributeOnlyName(k)) {\n        if (value == null) element.removeAttribute(k)\n        else element.setAttribute(k, String(value))\n    } else {\n        ;(element as any)[k] = value\n    }\n}\n\nexport type JsxFactory = (props: any, children: any[]) => any\n\n/**\n * A map of custom jsx properties to be used in hook extensions.\n */\nexport const hookExtensions = {\n    onConnect: onConnect<HTMLElement>,\n    style: applyStyles,\n    visible: applyVisibility,\n    classList: applyClassList,\n    ...passiveEventHandlers,\n} as const satisfies Record<keyof any, HookExtension<any>>\n\nexport type AllowBindable<T> = {\n    [K in keyof T]: MaybeObservableValue<T[K]>\n}\n\n/**\n * A type map of the jsx extended properties to the type provided to the hook.\n */\nexport type HookExtensions = {\n    [p in keyof typeof hookExtensions]?: Parameters<\n        (typeof hookExtensions)[p]\n    >[1]\n}\n\nexport type ElementProps<K extends keyof HTMLElementTagNameMap> = Omit<\n    Partial<Writable<HTMLElementTagNameMap[K]>>,\n    keyof HookExtensions\n>\n\nexport type BindableElementProps<K extends keyof HTMLElementTagNameMap> =\n    AllowBindable<ElementProps<K>>\n\n/**\n * Allowed properties for intrinsic elements when writing jsx declarative markup.\n */\nexport type JsxElementProps<K extends keyof HTMLElementTagNameMap> =\n    BindableElementProps<K> & HookExtensions\n\nexport type DomIntrinsicElements = {\n    [K in keyof HTMLElementTagNameMap]: JsxElementProps<K>\n}\n\nexport type JsxChild = Node | string | ObservableValue<Node | string>\n\nexport function jsx<K extends keyof HTMLElementTagNameMap>(\n    type: K,\n    props: JsxElementProps<K>,\n    ...children: JsxChild[]\n): HTMLElementTagNameMap[K]\n\nexport function jsx<Factory extends JsxFactory>(\n    type: Factory,\n    props: Parameters<Factory>[0],\n    ...children: Parameters<Factory>[1]\n): ReturnType<Factory>\n\nexport function jsx(type: any, props: any, ...children: any) {\n    if (typeof type === 'string') {\n        const element = document.createElement(type)\n        for (const k in props) {\n            const v = props[k]\n            if (k in hookExtensions) {\n                hookExtensions[k as keyof typeof hookExtensions](element, v)\n                continue\n            }\n            if (isObservableValue(v)) {\n                onConnect(element, () => {\n                    return v.onData((data$) => setProp(element, k, data$))\n                })\n            } else {\n                setProp(element, k, v)\n            }\n        }\n        element.append(\n            ...children\n                .filter((child: JsxChild | null) => child != null)\n                .map((child: JsxChild) => {\n                    return isObservableValue(child) ? ActiveText(child) : child\n                })\n        )\n        return element\n    } else {\n        return type(props ?? {}, children)\n    }\n}\n\nexport function Fragment(_props: AnyRecord, children: (Node | string)[]) {\n    return jsx(\n        'div',\n        {\n            style: {\n                display: 'contents',\n            },\n        },\n        ...children\n    )\n}\n\ndeclare global {\n    // eslint-disable-next-line @typescript-eslint/no-namespace\n    namespace JSX {\n        type IntrinsicElements = DomIntrinsicElements\n        type Element = HTMLElement\n        type Fragment = HTMLElement\n    }\n}\n"],
+  "mappings": "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",
+  "names": ["onConnect", "isObservableValue", "isObservableValue", "isObservableValue"]
 }

package/dist/types/current/domUtil.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"domUtil.d.ts","sourceRoot":"","sources":["../../../src/domUtil.ts"],"names":[],"mappings":"AAKA,wBAAgB,EAAE,CAAC,CAAC,SAAS,MAAM,qBAAqB,EACpD,SAAS,EAAE,CAAC,EACZ,UAAU,CAAC,EAAE,UAAU,GACxB,qBAAqB,CAAC,CAAC,CAAC,CAAA;AAC3B,wBAAgB,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,UAAU,GAAG,WAAW,CAAA;AAU3E,MAAM,WAAW,aAAa;IAC1B,CAAC,CAAC,SAAS,MAAM,qBAAqB,EAClC,SAAS,EAAE,CAAC,EACZ,UAAU,CAAC,EAAE,UAAU,GACxB,qBAAqB,CAAC,CAAC,CAAC,CAAA;IAC3B,CAAC,SAAS,EAAE,MAAM,GAAG,WAAW,CAAA;CACnC;AAED,wBAAgB,iBAAiB,CAAC,UAAU,EAAE,UAAU,GAAG,aAAa,CAEvE;AAED,wBAAgB,IAAI,CAAC,OAAO,EAAE,WAAW,QAExC;AAED,wBAAgB,IAAI,CAAC,OAAO,EAAE,WAAW,QAExC;AAED,wBAAgB,UAAU,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAExD;AAED,wBAAgB,UAAU,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,QAI9D;AAED,wBAAgB,QAAQ,CAAC,OAAO,EAAE,WAAW,WAO5C;AAED,wBAAgB,cAAc,CAC1B,KAAK,EAAE,OAAO,GAAG,IAAI,GACtB,KAAK,IAAI,gBAAgB,CAE3B;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CACzB,KAAK,EAAE,WAAW,EAClB,KAAK,EAAE,MAAM,EACb,OAAO,EAAE,OAAO,QAOnB;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC7B,QAAQ,CAAC,MAAM,CAAC,EAAE,WAAW,CAAA;IAC7B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAC9B,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAC7B,IAAI,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,EAC7B,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,QASjC"}
+{"version":3,"file":"domUtil.d.ts","sourceRoot":"","sources":["../../../src/domUtil.ts"],"names":[],"mappings":"AAKA,wBAAgB,EAAE,CAAC,CAAC,SAAS,MAAM,qBAAqB,EACpD,SAAS,EAAE,CAAC,EACZ,UAAU,CAAC,EAAE,UAAU,GACxB,qBAAqB,CAAC,CAAC,CAAC,CAAA;AAC3B,wBAAgB,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,UAAU,GAAG,WAAW,CAAA;AAU3E,MAAM,WAAW,aAAa;IAC1B,CAAC,CAAC,SAAS,MAAM,qBAAqB,EAClC,SAAS,EAAE,CAAC,EACZ,UAAU,CAAC,EAAE,UAAU,GACxB,qBAAqB,CAAC,CAAC,CAAC,CAAA;IAC3B,CAAC,SAAS,EAAE,MAAM,GAAG,WAAW,CAAA;CACnC;AAED,wBAAgB,iBAAiB,CAAC,UAAU,EAAE,UAAU,GAAG,aAAa,CAEvE;AAED,wBAAgB,IAAI,CAAC,OAAO,EAAE,WAAW,QAExC;AAED,wBAAgB,IAAI,CAAC,OAAO,EAAE,WAAW,QAExC;AAED,wBAAgB,UAAU,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAExD;AAED,wBAAgB,UAAU,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,QAI9D;AAED,wBAAgB,QAAQ,CAAC,OAAO,EAAE,WAAW,WAO5C;AAED,wBAAgB,cAAc,CAC1B,KAAK,EAAE,OAAO,GAAG,IAAI,GACtB,KAAK,IAAI,gBAAgB,CAE3B;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CACzB,KAAK,EAAE,WAAW,EAClB,KAAK,EAAE,MAAM,EACb,OAAO,EAAE,OAAO,QAOnB;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC7B,QAAQ,CAAC,MAAM,CAAC,EAAE,WAAW,CAAA;IAC7B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAC9B,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAC7B,IAAI,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,EAC7B,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,QAYjC"}

package/dist/types/current/domUtil.js

@@ -66,8 +66,11 @@ export function walkDomDepthFirst(node, callback) {
         return;
     let next = node.firstChild;
     while (next) {
+        // Snapshot the sibling before recursing so a callback that moves
+        // `next` can't sever the chain and skip the rest of the row.
+        const after = next.nextSibling;
         walkDomDepthFirst(next, callback);
-        next = next.nextSibling;
+        next = after;
     }
     callback(node);
 }

package/dist/types/current/extensions/applyClassList.d.ts

@@ -1,4 +1,4 @@
 import { type ObservableValue } from '@amazon/vinyl-observable';
-import type { Maybe } from '@amazon/vinyl-util';
-export declare function applyClassList(element: HTMLElement, classList: readonly (Maybe<string> | ObservableValue<Maybe<string>>)[]): void;
+import { type Maybe, type Unsubscribe } from '@amazon/vinyl-util';
+export declare function applyClassList(element: HTMLElement, classList: readonly (Maybe<string> | ObservableValue<Maybe<string>>)[]): Unsubscribe;
 //# sourceMappingURL=applyClassList.d.ts.map

package/dist/types/current/extensions/applyClassList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"applyClassList.d.ts","sourceRoot":"","sources":["../../../../src/extensions/applyClassList.ts"],"names":[],"mappings":"AAKA,OAAO,EAEH,KAAK,eAAe,EACvB,MAAM,0BAA0B,CAAA;AAEjC,OAAO,KAAK,EAAE,KAAK,EAAe,MAAM,oBAAoB,CAAA;AAE5D,wBAAgB,cAAc,CAC1B,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,GACvE,IAAI,CAcN"}
+{"version":3,"file":"applyClassList.d.ts","sourceRoot":"","sources":["../../../../src/extensions/applyClassList.ts"],"names":[],"mappings":"AAKA,OAAO,EAEH,KAAK,eAAe,EACvB,MAAM,0BAA0B,CAAA;AAEjC,OAAO,EAGH,KAAK,KAAK,EACV,KAAK,WAAW,EACnB,MAAM,oBAAoB,CAAA;AAE3B,wBAAgB,cAAc,CAC1B,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,GACvE,WAAW,CAab"}

package/dist/types/current/extensions/applyClassList.js

@@ -4,20 +4,20 @@
  */
 import { isObservableValue, } from '@amazon/vinyl-observable';
 import { onConnect } from './connectedObserver';
+import { createDisposer, noop, } from '@amazon/vinyl-util';
 export function applyClassList(element, classList) {
     const tokens = classList.filter((s) => typeof s === 'string');
     element.classList.add(...tokens);
     if (tokens.length < classList.length) {
-        onConnect(element, () => {
-            const subs = [];
+        return onConnect(element, () => {
+            const { add, dispose } = createDisposer();
             for (const dP of classList.filter(isObservableValue)) {
-                subs.push(bindClass(element, dP));
+                add(bindClass(element, dP));
             }
-            return () => {
-                subs.forEach((sub) => sub());
-            };
+            return dispose;
         });
     }
+    return noop;
 }
 function bindClass(element, tokenProvider) {
     let current = null;

package/dist/types/current/extensions/applyStyles.d.ts

@@ -1,11 +1,14 @@
-import type { AllowBindable } from '../jsx';
 import { type MaybeObservableValue } from '@amazon/vinyl-observable';
 import type { Maybe } from '@amazon/vinyl-util';
 /**
  * The shape accepted by the `style` jsx prop. Allows the typed CSSStyleDeclaration
- * fields plus any CSS custom property key (must start with `--`).
+ * fields plus any CSS custom property key (must start with `--`). Null / undefined
+ * clear the CSS property (via setProperty(name, null)), so values are Maybe-wrapped
+ * here even though bindable IDL props reject null.
  */
-export type StyleProp = AllowBindable<Partial<CSSStyleDeclaration>> & {
+export type StyleProp = {
+    [K in keyof Partial<CSSStyleDeclaration>]: MaybeObservableValue<Maybe<CSSStyleDeclaration[K]>>;
+} & {
     readonly [customProperty: `--${string}`]: MaybeObservableValue<Maybe<string>>;
 };
 export declare function applyStyles(element: HTMLElement, style: StyleProp): void;

package/dist/types/current/extensions/applyStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"applyStyles.d.ts","sourceRoot":"","sources":["../../../../src/extensions/applyStyles.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAA;AAG3C,OAAO,EAEH,KAAK,oBAAoB,EAC5B,MAAM,0BAA0B,CAAA;AACjC,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAA;AAE/C;;;GAGG;AACH,MAAM,MAAM,SAAS,GAAG,aAAa,CAAC,OAAO,CAAC,mBAAmB,CAAC,CAAC,GAAG;IAClE,QAAQ,EAAE,cAAc,EAAE,KAAK,MAAM,EAAE,GAAG,oBAAoB,CAC1D,KAAK,CAAC,MAAM,CAAC,CAChB,CAAA;CACJ,CAAA;AAED,wBAAgB,WAAW,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,QAyBjE"}
+{"version":3,"file":"applyStyles.d.ts","sourceRoot":"","sources":["../../../../src/extensions/applyStyles.ts"],"names":[],"mappings":"AAOA,OAAO,EAEH,KAAK,oBAAoB,EAC5B,MAAM,0BAA0B,CAAA;AACjC,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAA;AAE/C;;;;;GAKG;AACH,MAAM,MAAM,SAAS,GAAG;KACnB,CAAC,IAAI,MAAM,OAAO,CAAC,mBAAmB,CAAC,GAAG,oBAAoB,CAC3D,KAAK,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAC,CAChC;CACJ,GAAG;IACA,QAAQ,EAAE,cAAc,EAAE,KAAK,MAAM,EAAE,GAAG,oBAAoB,CAC1D,KAAK,CAAC,MAAM,CAAC,CAChB,CAAA;CACJ,CAAA;AAED,wBAAgB,WAAW,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,QAyBjE"}

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

@@ -1,12 +1,12 @@
 /** Auto-generated from build scripts */
-export * from './type';
-export * from './jsx';
-export * from './domUtil';
 export * from './ActiveText';
-export * from './extensions/connectedObserver';
-export * from './extensions/applyVisibility';
-export * from './extensions/applyStyles';
-export * from './extensions/applyPassiveHandler';
+export * from './domUtil';
 export * from './extensions/applyClassList';
+export * from './extensions/applyPassiveHandler';
+export * from './extensions/applyStyles';
+export * from './extensions/applyVisibility';
+export * from './extensions/connectedObserver';
 export * from './extensions/HookExtension';
+export * from './jsx';
+export * from './type';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/current/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,wCAAwC;AACxC,cAAc,QAAQ,CAAA;AACtB,cAAc,OAAO,CAAA;AACrB,cAAc,WAAW,CAAA;AACzB,cAAc,cAAc,CAAA;AAC5B,cAAc,gCAAgC,CAAA;AAC9C,cAAc,8BAA8B,CAAA;AAC5C,cAAc,0BAA0B,CAAA;AACxC,cAAc,kCAAkC,CAAA;AAChD,cAAc,6BAA6B,CAAA;AAC3C,cAAc,4BAA4B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,wCAAwC;AACxC,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kCAAkC,CAAA;AAChD,cAAc,0BAA0B,CAAA;AACxC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,OAAO,CAAA;AACrB,cAAc,QAAQ,CAAA"}

package/dist/types/current/index.js

@@ -1,11 +1,11 @@
 /** Auto-generated from build scripts */
-export * from './type';
-export * from './jsx';
-export * from './domUtil';
 export * from './ActiveText';
-export * from './extensions/connectedObserver';
-export * from './extensions/applyVisibility';
-export * from './extensions/applyStyles';
-export * from './extensions/applyPassiveHandler';
+export * from './domUtil';
 export * from './extensions/applyClassList';
+export * from './extensions/applyPassiveHandler';
+export * from './extensions/applyStyles';
+export * from './extensions/applyVisibility';
+export * from './extensions/connectedObserver';
 export * from './extensions/HookExtension';
+export * from './jsx';
+export * from './type';

package/dist/types/current/jsx.d.ts

@@ -4,12 +4,7 @@ import { type MaybeObservableValue, type ObservableValue } from '@amazon/vinyl-o
 import { applyVisibility } from './extensions/applyVisibility';
 import { applyClassList } from './extensions/applyClassList';
 import type { HookExtension } from './extensions/HookExtension';
-import type { AnyRecord, Maybe } from '@amazon/vinyl-util';
-/**
- * Maps JS property names to their corresponding HTML attribute names where they differ.
- * Extensible — add entries for custom elements or non-standard properties.
- */
-export declare const propToAttr: Record<string, string>;
+import type { AnyRecord } from '@amazon/vinyl-util';
 export type JsxFactory = (props: any, children: any[]) => any;
 /**
  * A map of custom jsx properties to be used in hook extensions.
@@ -18,13 +13,13 @@ export declare const hookExtensions: {
     readonly ontouchstart: HookExtension<((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined>;
     readonly ontouchmove: HookExtension<((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined>;
     readonly onwheel: HookExtension<((this: GlobalEventHandlers, ev: WheelEvent) => any) | null>;
-    readonly onConnect: (target: HTMLElement, callback: (node: HTMLElement) => Maybe<import("@amazon/vinyl-util").Unsubscribe> | void) => import("@amazon/vinyl-util").Unsubscribe;
+    readonly onConnect: (target: HTMLElement, callback: (node: HTMLElement) => import("@amazon/vinyl-util").Maybe<import("@amazon/vinyl-util").Unsubscribe> | void) => import("@amazon/vinyl-util").Unsubscribe;
     readonly style: typeof applyStyles;
     readonly visible: typeof applyVisibility;
     readonly classList: typeof applyClassList;
 };
 export type AllowBindable<T> = {
-    [K in keyof T]: MaybeObservableValue<Maybe<T[K]>>;
+    [K in keyof T]: MaybeObservableValue<T[K]>;
 };
 /**
  * A type map of the jsx extended properties to the type provided to the hook.

package/dist/types/current/jsx.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"jsx.d.ts","sourceRoot":"","sources":["../../../src/jsx.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAEH,KAAK,oBAAoB,EACzB,KAAK,eAAe,EACvB,MAAM,0BAA0B,CAAA;AAEjC,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAA;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAE/D,OAAO,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAA;AAE1D;;;GAGG;AACH,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CA2B7C,CAAA;AAiBD,MAAM,MAAM,UAAU,GAAG,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;AAE7D;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;;CAM+B,CAAA;AAE1D,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI;KAC1B,CAAC,IAAI,MAAM,CAAC,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;CACpD,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG;KACxB,CAAC,IAAI,MAAM,OAAO,cAAc,CAAC,CAAC,EAAE,UAAU,CAC3C,CAAC,OAAO,cAAc,CAAC,CAAC,CAAC,CAAC,CAC7B,CAAC,CAAC,CAAC;CACP,CAAA;AAED,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,MAAM,qBAAqB,IAAI,IAAI,CAClE,OAAO,CAAC,QAAQ,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,CAAC,EAC3C,MAAM,cAAc,CACvB,CAAA;AAED,MAAM,MAAM,oBAAoB,CAAC,CAAC,SAAS,MAAM,qBAAqB,IAClE,aAAa,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAA;AAElC;;GAEG;AACH,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,MAAM,qBAAqB,IAC7D,oBAAoB,CAAC,CAAC,CAAC,GAAG,cAAc,CAAA;AAE5C,MAAM,MAAM,oBAAoB,GAAG;KAC9B,CAAC,IAAI,MAAM,qBAAqB,GAAG,eAAe,CAAC,CAAC,CAAC;CACzD,CAAA;AAED,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,MAAM,GAAG,eAAe,CAAC,IAAI,GAAG,MAAM,CAAC,CAAA;AAErE,wBAAgB,GAAG,CAAC,CAAC,SAAS,MAAM,qBAAqB,EACrD,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,EACzB,GAAG,QAAQ,EAAE,QAAQ,EAAE,GACxB,qBAAqB,CAAC,CAAC,CAAC,CAAA;AAE3B,wBAAgB,GAAG,CAAC,OAAO,SAAS,UAAU,EAC1C,IAAI,EAAE,OAAO,EACb,KAAK,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAC7B,GAAG,QAAQ,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GACpC,UAAU,CAAC,OAAO,CAAC,CAAA;AAgCtB,wBAAgB,QAAQ,CAAC,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC,IAAI,GAAG,MAAM,CAAC,EAAE,kBAUtE;AAED,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,GAAG,CAAC;QACV,KAAK,iBAAiB,GAAG,oBAAoB,CAAA;QAC7C,KAAK,OAAO,GAAG,WAAW,CAAA;QAC1B,KAAK,QAAQ,GAAG,WAAW,CAAA;KAC9B;CACJ"}
+{"version":3,"file":"jsx.d.ts","sourceRoot":"","sources":["../../../src/jsx.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAEH,KAAK,oBAAoB,EACzB,KAAK,eAAe,EACvB,MAAM,0BAA0B,CAAA;AAEjC,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAA;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAE/D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AA4BnD,MAAM,MAAM,UAAU,GAAG,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;AAE7D;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;;CAM+B,CAAA;AAE1D,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI;KAC1B,CAAC,IAAI,MAAM,CAAC,GAAG,oBAAoB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;CAC7C,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG;KACxB,CAAC,IAAI,MAAM,OAAO,cAAc,CAAC,CAAC,EAAE,UAAU,CAC3C,CAAC,OAAO,cAAc,CAAC,CAAC,CAAC,CAAC,CAC7B,CAAC,CAAC,CAAC;CACP,CAAA;AAED,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,MAAM,qBAAqB,IAAI,IAAI,CAClE,OAAO,CAAC,QAAQ,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,CAAC,EAC3C,MAAM,cAAc,CACvB,CAAA;AAED,MAAM,MAAM,oBAAoB,CAAC,CAAC,SAAS,MAAM,qBAAqB,IAClE,aAAa,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAA;AAElC;;GAEG;AACH,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,MAAM,qBAAqB,IAC7D,oBAAoB,CAAC,CAAC,CAAC,GAAG,cAAc,CAAA;AAE5C,MAAM,MAAM,oBAAoB,GAAG;KAC9B,CAAC,IAAI,MAAM,qBAAqB,GAAG,eAAe,CAAC,CAAC,CAAC;CACzD,CAAA;AAED,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,MAAM,GAAG,eAAe,CAAC,IAAI,GAAG,MAAM,CAAC,CAAA;AAErE,wBAAgB,GAAG,CAAC,CAAC,SAAS,MAAM,qBAAqB,EACrD,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,EACzB,GAAG,QAAQ,EAAE,QAAQ,EAAE,GACxB,qBAAqB,CAAC,CAAC,CAAC,CAAA;AAE3B,wBAAgB,GAAG,CAAC,OAAO,SAAS,UAAU,EAC1C,IAAI,EAAE,OAAO,EACb,KAAK,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAC7B,GAAG,QAAQ,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GACpC,UAAU,CAAC,OAAO,CAAC,CAAA;AAgCtB,wBAAgB,QAAQ,CAAC,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC,IAAI,GAAG,MAAM,CAAC,EAAE,kBAUtE;AAED,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,GAAG,CAAC;QACV,KAAK,iBAAiB,GAAG,oBAAoB,CAAA;QAC7C,KAAK,OAAO,GAAG,WAAW,CAAA;QAC1B,KAAK,QAAQ,GAAG,WAAW,CAAA;KAC9B;CACJ"}

package/dist/types/current/jsx.js

@@ -10,48 +10,27 @@ import { applyVisibility } from './extensions/applyVisibility';
 import { applyClassList } from './extensions/applyClassList';
 import { passiveEventHandlers } from './extensions/applyPassiveHandler';
 /**
- * Maps JS property names to their corresponding HTML attribute names where they differ.
- * Extensible — add entries for custom elements or non-standard properties.
+ * Names like `aria-label` / `role` / `data-*` / any hyphenated prop are DOM
+ * attributes with no matching IDL property — assigning them via `element[k]`
+ * creates an inert expando and the a11y tree / CSS attribute selectors never
+ * see the value. Route those through setAttribute so JSX like
+ * `<div aria-label="foo" />` actually reaches the DOM.
  */
-export const propToAttr = {
-    acceptCharset: 'accept-charset',
-    accessKey: 'accesskey',
-    className: 'class',
-    colSpan: 'colspan',
-    contentEditable: 'contenteditable',
-    crossOrigin: 'crossorigin',
-    dateTime: 'datetime',
-    dirName: 'dirname',
-    encType: 'enctype',
-    formAction: 'formaction',
-    formEnctype: 'formenctype',
-    formMethod: 'formmethod',
-    formNoValidate: 'formnovalidate',
-    formTarget: 'formtarget',
-    htmlFor: 'for',
-    httpEquiv: 'http-equiv',
-    inputMode: 'inputmode',
-    maxLength: 'maxlength',
-    minLength: 'minlength',
-    noModule: 'nomodule',
-    noValidate: 'novalidate',
-    readOnly: 'readonly',
-    referrerPolicy: 'referrerpolicy',
-    rowSpan: 'rowspan',
-    tabIndex: 'tabindex',
-    useMap: 'usemap',
-};
+function isAttributeOnlyName(k) {
+    return k === 'role' || k.indexOf('-') >= 0;
+}
 /**
- * Sets a property on an element. When value is non-null, assigns directly via
- * property. When null, resets the property to '' and removes the HTML attribute
- * using the mapped name from {@link propToAttr}.
+ * Sets a property on an element. Hyphenated / aria / role / data names are
+ * assigned as HTML attributes; everything else stays on the property path so
+ * camelCase IDL props (className, tabIndex, onClick, …) keep their existing
+ * fast-path semantics.
  */
 function setProp(element, k, value) {
-    if (value == null) {
-        ;
-        element[k] = '';
-        const attr = propToAttr[k] ?? k;
-        element.removeAttribute(attr);
+    if (isAttributeOnlyName(k)) {
+        if (value == null)
+            element.removeAttribute(k);
+        else
+            element.setAttribute(k, String(value));
     }
     else {
         ;
@@ -94,7 +73,7 @@ export function jsx(type, props, ...children) {
         return element;
     }
     else {
-        return type(props, children);
+        return type(props ?? {}, children);
     }
 }
 export function Fragment(_props, children) {