@reckona/mreact-compat 0.0.90 → 0.0.92

package/dist/dom-children.js

@@ -2,22 +2,124 @@ import { collectScopedNodes } from "./hydration.js";
 export function syncChildNodes(parent, nextNodes) {
     syncScopedChildNodes(parent, null, null, nextNodes);
 }
+export function syncOwnedChildNodes(parent, previousNodes, nextNodes) {
+    const nextSet = new Set(nextNodes);
+    for (const node of nextNodes) {
+        if (node.parentNode !== parent || node.nextSibling !== null) {
+            parent.appendChild(node);
+        }
+    }
+    for (const child of previousNodes) {
+        if (!nextSet.has(child)) {
+            removeChildIfPresent(parent, child);
+        }
+    }
+}
 export function syncScopedChildNodes(parent, before, after, nextNodes) {
+    if (replaceDisjointFullChildList(parent, before, after, nextNodes)) {
+        return;
+    }
+    if (nextNodes.length > 16 &&
+        hasSingleExtraScopedChild(parent, before, after, nextNodes.length) &&
+        removeSingleMissingChild(parent, before, after, nextNodes)) {
+        return;
+    }
     let cursor = parent.firstChild;
     if (before !== null) {
         cursor = before.nextSibling;
     }
+    let changed = false;
     for (const node of nextNodes) {
         if (node !== cursor) {
             parent.insertBefore(node, cursor === after ? after : cursor);
+            changed = true;
         }
         cursor = node.nextSibling;
     }
+    if (!changed && cursor === after) {
+        return;
+    }
+    if (!changed && after === null && cursor === null) {
+        return;
+    }
     const nextSet = new Set(nextNodes);
     for (const child of collectScopedNodes(parent, before, after)) {
         if (!nextSet.has(child)) {
-            parent.removeChild(child);
+            removeChildIfPresent(parent, child);
         }
     }
 }
+function replaceDisjointFullChildList(parent, before, after, nextNodes) {
+    if (before !== null || after !== null || nextNodes.length <= 16) {
+        return false;
+    }
+    const currentNodes = parent.childNodes;
+    if (currentNodes.length <= 16 || currentNodes.length !== nextNodes.length) {
+        return false;
+    }
+    const nextSet = new Set(nextNodes);
+    for (let index = 0; index < currentNodes.length; index += 1) {
+        if (nextSet.has(currentNodes[index])) {
+            return false;
+        }
+    }
+    parent.replaceChildren(...nextNodes);
+    return true;
+}
+function hasSingleExtraScopedChild(parent, before, after, nextCount) {
+    if (before === null && after === null) {
+        return parent.childNodes.length === nextCount + 1;
+    }
+    let cursor = before === null ? parent.firstChild : before.nextSibling;
+    let currentCount = 0;
+    while (cursor !== null && cursor !== after && currentCount <= nextCount + 1) {
+        currentCount += 1;
+        cursor = cursor.nextSibling;
+    }
+    return currentCount === nextCount + 1 && (cursor === null || cursor === after);
+}
+function removeSingleMissingChild(parent, before, after, nextNodes) {
+    let cursor = before === null ? parent.firstChild : before.nextSibling;
+    let removed = false;
+    for (const nextNode of nextNodes) {
+        if (cursor === nextNode) {
+            cursor = cursor.nextSibling;
+            continue;
+        }
+        if (removed || cursor === null || cursor === after || cursor.nextSibling !== nextNode) {
+            return false;
+        }
+        const missing = cursor;
+        cursor = nextNode.nextSibling;
+        removeChildIfPresent(parent, missing);
+        removed = true;
+    }
+    if (cursor === after || cursor === null) {
+        return removed;
+    }
+    if (removed || cursor.nextSibling !== after) {
+        return false;
+    }
+    removeChildIfPresent(parent, cursor);
+    return true;
+}
+export function removeChildIfPresent(parent, child) {
+    if (child.parentNode !== parent) {
+        return;
+    }
+    try {
+        parent.removeChild(child);
+    }
+    catch (error) {
+        if (child.parentNode !== parent && isNotFoundError(error)) {
+            return;
+        }
+        throw error;
+    }
+}
+function isNotFoundError(error) {
+    const maybeError = error;
+    return (maybeError.name === "NotFoundError" ||
+        (typeof maybeError.message === "string" && maybeError.message.includes("not a child")));
+}
 //# sourceMappingURL=dom-children.js.map

package/dist/dom-children.js.map

@@ -1 +1 @@
-{"version":3,"file":"dom-children.js","sourceRoot":"","sources":["../src/dom-children.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAEpD,MAAM,UAAU,cAAc,CAAC,MAAkB,EAAE,SAA0B;IAC3E,oBAAoB,CAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC;AACtD,CAAC;AAED,MAAM,UAAU,oBAAoB,CAClC,MAAkB,EAClB,MAAwB,EACxB,KAAuB,EACvB,SAA0B;IAE1B,IAAI,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC;IAE/B,IAAI,MAAM,KAAK,IAAI,EAAE,CAAC;QACpB,MAAM,GAAG,MAAM,CAAC,WAAW,CAAC;IAC9B,CAAC;IAED,KAAK,MAAM,IAAI,IAAI,SAAS,EAAE,CAAC;QAC7B,IAAI,IAAI,KAAK,MAAM,EAAE,CAAC;YACpB,MAAM,CAAC,YAAY,CAAC,IAAI,EAAE,MAAM,KAAK,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;QAC/D,CAAC;QAED,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC;IAC5B,CAAC;IAED,MAAM,OAAO,GAAG,IAAI,GAAG,CAAC,SAAS,CAAC,CAAC;IAEnC,KAAK,MAAM,KAAK,IAAI,kBAAkB,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC;QAC9D,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC;YACxB,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QAC5B,CAAC;IACH,CAAC;AACH,CAAC","sourcesContent":["import { collectScopedNodes } from \"./hydration.js\";\n\nexport function syncChildNodes(parent: ParentNode, nextNodes: readonly Node[]): void {\n  syncScopedChildNodes(parent, null, null, nextNodes);\n}\n\nexport function syncScopedChildNodes(\n  parent: ParentNode,\n  before: ChildNode | null,\n  after: ChildNode | null,\n  nextNodes: readonly Node[],\n): void {\n  let cursor = parent.firstChild;\n\n  if (before !== null) {\n    cursor = before.nextSibling;\n  }\n\n  for (const node of nextNodes) {\n    if (node !== cursor) {\n      parent.insertBefore(node, cursor === after ? after : cursor);\n    }\n\n    cursor = node.nextSibling;\n  }\n\n  const nextSet = new Set(nextNodes);\n\n  for (const child of collectScopedNodes(parent, before, after)) {\n    if (!nextSet.has(child)) {\n      parent.removeChild(child);\n    }\n  }\n}\n"]}
+{"version":3,"file":"dom-children.js","sourceRoot":"","sources":["../src/dom-children.ts"],"names":[],"mappings":"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","sourcesContent":["import { collectScopedNodes } from \"./hydration.js\";\n\nexport function syncChildNodes(parent: ParentNode, nextNodes: readonly Node[]): void {\n  syncScopedChildNodes(parent, null, null, nextNodes);\n}\n\nexport function syncOwnedChildNodes(\n  parent: ParentNode,\n  previousNodes: readonly Node[],\n  nextNodes: readonly Node[],\n): void {\n  const nextSet = new Set(nextNodes);\n\n  for (const node of nextNodes) {\n    if (node.parentNode !== parent || node.nextSibling !== null) {\n      parent.appendChild(node);\n    }\n  }\n\n  for (const child of previousNodes) {\n    if (!nextSet.has(child)) {\n      removeChildIfPresent(parent, child);\n    }\n  }\n}\n\nexport function syncScopedChildNodes(\n  parent: ParentNode,\n  before: ChildNode | null,\n  after: ChildNode | null,\n  nextNodes: readonly Node[],\n): void {\n  if (replaceDisjointFullChildList(parent, before, after, nextNodes)) {\n    return;\n  }\n\n  if (\n    nextNodes.length > 16 &&\n    hasSingleExtraScopedChild(parent, before, after, nextNodes.length) &&\n    removeSingleMissingChild(parent, before, after, nextNodes)\n  ) {\n    return;\n  }\n\n  let cursor = parent.firstChild;\n\n  if (before !== null) {\n    cursor = before.nextSibling;\n  }\n\n  let changed = false;\n\n  for (const node of nextNodes) {\n    if (node !== cursor) {\n      parent.insertBefore(node, cursor === after ? after : cursor);\n      changed = true;\n    }\n\n    cursor = node.nextSibling;\n  }\n\n  if (!changed && cursor === after) {\n    return;\n  }\n\n  if (!changed && after === null && cursor === null) {\n    return;\n  }\n\n  const nextSet = new Set(nextNodes);\n\n  for (const child of collectScopedNodes(parent, before, after)) {\n    if (!nextSet.has(child)) {\n      removeChildIfPresent(parent, child);\n    }\n  }\n}\n\nfunction replaceDisjointFullChildList(\n  parent: ParentNode,\n  before: ChildNode | null,\n  after: ChildNode | null,\n  nextNodes: readonly Node[],\n): boolean {\n  if (before !== null || after !== null || nextNodes.length <= 16) {\n    return false;\n  }\n\n  const currentNodes = parent.childNodes;\n\n  if (currentNodes.length <= 16 || currentNodes.length !== nextNodes.length) {\n    return false;\n  }\n\n  const nextSet = new Set(nextNodes);\n\n  for (let index = 0; index < currentNodes.length; index += 1) {\n    if (nextSet.has(currentNodes[index]!)) {\n      return false;\n    }\n  }\n\n  parent.replaceChildren(...nextNodes);\n  return true;\n}\n\nfunction hasSingleExtraScopedChild(\n  parent: ParentNode,\n  before: ChildNode | null,\n  after: ChildNode | null,\n  nextCount: number,\n): boolean {\n  if (before === null && after === null) {\n    return parent.childNodes.length === nextCount + 1;\n  }\n\n  let cursor = before === null ? parent.firstChild : before.nextSibling;\n  let currentCount = 0;\n\n  while (cursor !== null && cursor !== after && currentCount <= nextCount + 1) {\n    currentCount += 1;\n    cursor = cursor.nextSibling;\n  }\n\n  return currentCount === nextCount + 1 && (cursor === null || cursor === after);\n}\n\nfunction removeSingleMissingChild(\n  parent: ParentNode,\n  before: ChildNode | null,\n  after: ChildNode | null,\n  nextNodes: readonly Node[],\n): boolean {\n  let cursor = before === null ? parent.firstChild : before.nextSibling;\n  let removed = false;\n\n  for (const nextNode of nextNodes) {\n    if (cursor === nextNode) {\n      cursor = cursor.nextSibling;\n      continue;\n    }\n\n    if (removed || cursor === null || cursor === after || cursor.nextSibling !== nextNode) {\n      return false;\n    }\n\n    const missing = cursor;\n    cursor = nextNode.nextSibling;\n    removeChildIfPresent(parent, missing);\n    removed = true;\n  }\n\n  if (cursor === after || cursor === null) {\n    return removed;\n  }\n\n  if (removed || cursor.nextSibling !== after) {\n    return false;\n  }\n\n  removeChildIfPresent(parent, cursor);\n  return true;\n}\n\nexport function removeChildIfPresent(parent: ParentNode, child: Node): void {\n  if (child.parentNode !== parent) {\n    return;\n  }\n\n  try {\n    parent.removeChild(child);\n  } catch (error) {\n    if (child.parentNode !== parent && isNotFoundError(error)) {\n      return;\n    }\n\n    throw error;\n  }\n}\n\nfunction isNotFoundError(error: unknown): boolean {\n  const maybeError = error as { message?: unknown; name?: unknown };\n\n  return (\n    maybeError.name === \"NotFoundError\" ||\n    (typeof maybeError.message === \"string\" && maybeError.message.includes(\"not a child\"))\n  );\n}\n"]}

package/dist/dom-host-rules.d.ts

@@ -0,0 +1,10 @@
+export type HostElement = HTMLElement | SVGElement;
+export type HostNamespace = "html" | "svg";
+export declare function createHostElement(documentRef: Document, tagName: string, namespace: HostNamespace): HostElement;
+export declare function isHostElement(value: unknown): value is HostElement;
+export declare function namespaceForHostElement(parentNamespace: HostNamespace, tagName: string): HostNamespace;
+export declare function namespaceForHostChildren(elementNamespace: HostNamespace, tagName: string): HostNamespace;
+export declare function hostElementMatches(element: HostElement, tagName: string, namespace: HostNamespace): boolean;
+export declare function serializeClientStyleValue(name: string, value: unknown): string;
+export declare function styleNameToCssName(name: string): string;
+//# sourceMappingURL=dom-host-rules.d.ts.map

package/dist/dom-host-rules.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dom-host-rules.d.ts","sourceRoot":"","sources":["../src/dom-host-rules.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG,WAAW,GAAG,UAAU,CAAC;AACnD,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,KAAK,CAAC;AAoD3C,wBAAgB,iBAAiB,CAC/B,WAAW,EAAE,QAAQ,EACrB,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,aAAa,GACvB,WAAW,CAMb;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,IAAI,WAAW,CAElE;AAED,wBAAgB,uBAAuB,CACrC,eAAe,EAAE,aAAa,EAC9B,OAAO,EAAE,MAAM,GACd,aAAa,CAMf;AAED,wBAAgB,wBAAwB,CACtC,gBAAgB,EAAE,aAAa,EAC/B,OAAO,EAAE,MAAM,GACd,aAAa,CAEf;AAED,wBAAgB,kBAAkB,CAChC,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,aAAa,GACvB,OAAO,CAET;AAED,wBAAgB,yBAAyB,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,GAAG,MAAM,CAM9E;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAOvD"}

package/dist/dom-host-rules.js

@@ -0,0 +1,86 @@
+const htmlNamespace = "http://www.w3.org/1999/xhtml";
+const svgNamespace = "http://www.w3.org/2000/svg";
+const isUnitlessNumberStyle = new Set([
+    "animationIterationCount",
+    "aspectRatio",
+    "borderImageOutset",
+    "borderImageSlice",
+    "borderImageWidth",
+    "boxFlex",
+    "boxFlexGroup",
+    "boxOrdinalGroup",
+    "columnCount",
+    "columns",
+    "flex",
+    "flexGrow",
+    "flexPositive",
+    "flexShrink",
+    "flexNegative",
+    "flexOrder",
+    "gridArea",
+    "gridRow",
+    "gridRowEnd",
+    "gridRowSpan",
+    "gridRowStart",
+    "gridColumn",
+    "gridColumnEnd",
+    "gridColumnSpan",
+    "gridColumnStart",
+    "fontWeight",
+    "lineClamp",
+    "lineHeight",
+    "opacity",
+    "order",
+    "orphans",
+    "scale",
+    "tabSize",
+    "widows",
+    "zIndex",
+    "zoom",
+    "fillOpacity",
+    "floodOpacity",
+    "stopOpacity",
+    "strokeDasharray",
+    "strokeDashoffset",
+    "strokeMiterlimit",
+    "strokeOpacity",
+    "strokeWidth",
+]);
+export function createHostElement(documentRef, tagName, namespace) {
+    if (namespaceForHostElement(namespace, tagName) === "svg") {
+        return documentRef.createElementNS(svgNamespace, tagName);
+    }
+    return documentRef.createElement(tagName);
+}
+export function isHostElement(value) {
+    return value instanceof HTMLElement || value instanceof SVGElement;
+}
+export function namespaceForHostElement(parentNamespace, tagName) {
+    if (tagName === "svg") {
+        return "svg";
+    }
+    return parentNamespace;
+}
+export function namespaceForHostChildren(elementNamespace, tagName) {
+    return elementNamespace === "svg" && tagName === "foreignObject" ? "html" : elementNamespace;
+}
+export function hostElementMatches(element, tagName, namespace) {
+    return element.tagName.toLowerCase() === tagName && element.namespaceURI === namespaceUri(namespace);
+}
+export function serializeClientStyleValue(name, value) {
+    if (typeof value === "number" && value !== 0 && !name.startsWith("--") && !isUnitlessNumberStyle.has(name)) {
+        return `${value}px`;
+    }
+    return String(value);
+}
+export function styleNameToCssName(name) {
+    if (name.startsWith("--")) {
+        return name;
+    }
+    const cssName = name.replace(/[A-Z]/g, (char) => `-${char.toLowerCase()}`);
+    return cssName.startsWith("ms-") ? `-${cssName}` : cssName;
+}
+function namespaceUri(namespace) {
+    return namespace === "svg" ? svgNamespace : htmlNamespace;
+}
+//# sourceMappingURL=dom-host-rules.js.map

package/dist/dom-host-rules.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dom-host-rules.js","sourceRoot":"","sources":["../src/dom-host-rules.ts"],"names":[],"mappings":"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","sourcesContent":["export type HostElement = HTMLElement | SVGElement;\nexport type HostNamespace = \"html\" | \"svg\";\n\nconst htmlNamespace = \"http://www.w3.org/1999/xhtml\";\nconst svgNamespace = \"http://www.w3.org/2000/svg\";\n\nconst isUnitlessNumberStyle = new Set([\n  \"animationIterationCount\",\n  \"aspectRatio\",\n  \"borderImageOutset\",\n  \"borderImageSlice\",\n  \"borderImageWidth\",\n  \"boxFlex\",\n  \"boxFlexGroup\",\n  \"boxOrdinalGroup\",\n  \"columnCount\",\n  \"columns\",\n  \"flex\",\n  \"flexGrow\",\n  \"flexPositive\",\n  \"flexShrink\",\n  \"flexNegative\",\n  \"flexOrder\",\n  \"gridArea\",\n  \"gridRow\",\n  \"gridRowEnd\",\n  \"gridRowSpan\",\n  \"gridRowStart\",\n  \"gridColumn\",\n  \"gridColumnEnd\",\n  \"gridColumnSpan\",\n  \"gridColumnStart\",\n  \"fontWeight\",\n  \"lineClamp\",\n  \"lineHeight\",\n  \"opacity\",\n  \"order\",\n  \"orphans\",\n  \"scale\",\n  \"tabSize\",\n  \"widows\",\n  \"zIndex\",\n  \"zoom\",\n  \"fillOpacity\",\n  \"floodOpacity\",\n  \"stopOpacity\",\n  \"strokeDasharray\",\n  \"strokeDashoffset\",\n  \"strokeMiterlimit\",\n  \"strokeOpacity\",\n  \"strokeWidth\",\n]);\n\nexport function createHostElement(\n  documentRef: Document,\n  tagName: string,\n  namespace: HostNamespace,\n): HostElement {\n  if (namespaceForHostElement(namespace, tagName) === \"svg\") {\n    return documentRef.createElementNS(svgNamespace, tagName);\n  }\n\n  return documentRef.createElement(tagName);\n}\n\nexport function isHostElement(value: unknown): value is HostElement {\n  return value instanceof HTMLElement || value instanceof SVGElement;\n}\n\nexport function namespaceForHostElement(\n  parentNamespace: HostNamespace,\n  tagName: string,\n): HostNamespace {\n  if (tagName === \"svg\") {\n    return \"svg\";\n  }\n\n  return parentNamespace;\n}\n\nexport function namespaceForHostChildren(\n  elementNamespace: HostNamespace,\n  tagName: string,\n): HostNamespace {\n  return elementNamespace === \"svg\" && tagName === \"foreignObject\" ? \"html\" : elementNamespace;\n}\n\nexport function hostElementMatches(\n  element: HostElement,\n  tagName: string,\n  namespace: HostNamespace,\n): boolean {\n  return element.tagName.toLowerCase() === tagName && element.namespaceURI === namespaceUri(namespace);\n}\n\nexport function serializeClientStyleValue(name: string, value: unknown): string {\n  if (typeof value === \"number\" && value !== 0 && !name.startsWith(\"--\") && !isUnitlessNumberStyle.has(name)) {\n    return `${value}px`;\n  }\n\n  return String(value);\n}\n\nexport function styleNameToCssName(name: string): string {\n  if (name.startsWith(\"--\")) {\n    return name;\n  }\n\n  const cssName = name.replace(/[A-Z]/g, (char) => `-${char.toLowerCase()}`);\n  return cssName.startsWith(\"ms-\") ? `-${cssName}` : cssName;\n}\n\nfunction namespaceUri(namespace: HostNamespace): string {\n  return namespace === \"svg\" ? svgNamespace : htmlNamespace;\n}\n"]}

package/dist/dom-props.d.ts

@@ -1,4 +1,5 @@
 import { type RenderOptions } from "./hydration.js";
-export declare function applyProps(element: HTMLElement, props: Record<string, unknown>, path: string, options: RenderOptions): void;
-export declare function applyPostChildFormProps(element: HTMLElement, props: Record<string, unknown>): void;
+import { type HostElement } from "./dom-host-rules.js";
+export declare function applyProps(element: HostElement, props: Record<string, unknown>, path: string, options: RenderOptions): void;
+export declare function applyPostChildFormProps(element: Element, props: Record<string, unknown>): void;
 //# sourceMappingURL=dom-props.d.ts.map

package/dist/dom-props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dom-props.d.ts","sourceRoot":"","sources":["../src/dom-props.ts"],"names":[],"mappings":"AAQA,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,gBAAgB,CAAC;AASvE,wBAAgB,UAAU,CACxB,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC9B,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,aAAa,GACrB,IAAI,CAkGN;AAED,wBAAgB,uBAAuB,CACrC,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAC7B,IAAI,CAyBN"}
+{"version":3,"file":"dom-props.d.ts","sourceRoot":"","sources":["../src/dom-props.ts"],"names":[],"mappings":"AASA,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAQvE,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,qBAAqB,CAAC;AAE7B,wBAAgB,UAAU,CACxB,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC9B,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,aAAa,GACrB,IAAI,CAuIN;AA6GD,wBAAgB,uBAAuB,CACrC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAC7B,IAAI,CAyBN"}

package/dist/dom-props.js

@@ -1,25 +1,46 @@
 import { getAppliedProps, setAppliedProps, ensureDelegatedEventListener, toEventNames, } from "./host-event-binder.js";
+import { HOST_OWN_PROPS_META } from "./element.js";
 import { reportRecoverable } from "./hydration.js";
 import { isDangerousHtmlAttribute, isDangerousHtmlOptIn, isUnsafeUrlAttribute, isUrlAttribute, } from "./url-safety.js";
+import { serializeClientStyleValue, styleNameToCssName, } from "./dom-host-rules.js";
 export function applyProps(element, props, path, options) {
-    const previous = getAppliedProps(element) ?? {
-        props: {},
-        listeners: new Map(),
-    };
-    const nextAttributeNames = collectAttributeNames(props);
     const preserveHydrationAttributes = options.preserveHydrationAttributes === true;
+    const previous = getAppliedProps(element);
+    if (previous === undefined && !preserveHydrationAttributes) {
+        if (applyInitialRowProps(element, props)) {
+            setAppliedProps(element, { props });
+            return;
+        }
+        setAppliedProps(element, {
+            props,
+            ...applyInitialProps(element, props, path, options),
+        });
+        return;
+    }
+    const previousProps = previous?.props ?? {};
+    let listeners = previous?.listeners;
+    const previousAttributeNames = collectAttributeNames(previousProps);
+    const nextAttributeNames = collectAttributeNames(props);
     if (!preserveHydrationAttributes) {
-        for (const attribute of Array.from(element.attributes)) {
-            if (!nextAttributeNames.has(attribute.name)) {
-                reportRecoverable(options, "attribute", path, new Error(`Hydration attribute mismatch: ${attribute.name}.`));
-                element.removeAttribute(attribute.name);
+        for (const attributeName of previousAttributeNames) {
+            if (!nextAttributeNames.has(attributeName)) {
+                if (attributeName === "style") {
+                    removePreviousStyle(element, previousProps.style, path, options);
+                    continue;
+                }
+                if (element.hasAttribute(attributeName)) {
+                    reportRecoverable(options, "attribute", path, new Error(`Hydration attribute mismatch: ${attributeName}.`));
+                    element.removeAttribute(attributeName);
+                }
             }
         }
     }
-    for (const [name, appliedListener] of previous.listeners) {
-        const nextValue = props[name];
-        if (nextValue !== appliedListener.handler) {
-            previous.listeners.delete(name);
+    if (listeners !== undefined) {
+        for (const [name, appliedListener] of listeners) {
+            const nextValue = props[name];
+            if (nextValue !== appliedListener.handler) {
+                listeners.delete(name);
+            }
         }
     }
     for (const [name, value] of Object.entries(props)) {
@@ -38,22 +59,27 @@ export function applyProps(element, props, path, options) {
             continue;
         }
         if (name === "style") {
-            applyStyle(element, previous.props[name], value, path, options);
+            applyStyle(element, previousProps[name], value, path, options);
             continue;
         }
         if (/^on[A-Z]/.test(name) && typeof value === "function") {
-            if (previous.listeners.get(name)?.handler === value) {
+            if (listeners?.get(name)?.handler === value) {
                 continue;
             }
             const handler = value;
             for (const eventName of toEventNames(name)) {
                 ensureDelegatedEventListener(options.eventRoot ?? element, eventName);
             }
-            previous.listeners.set(name, { handler });
+            listeners ??= new Map();
+            listeners.set(name, { handler });
+            continue;
+        }
+        const attributeName = toDomAttributeName(name);
+        if (typeof value === "boolean" && isBooleanishStringAttribute(attributeName)) {
+            applyAttribute(element, attributeName, value ? "true" : "false", path, options);
             continue;
         }
         if (typeof value === "boolean") {
-            const attributeName = toDomAttributeName(name);
             if (element.hasAttribute(attributeName) !== value) {
                 if (!preserveHydrationAttributes) {
                     reportRecoverable(options, "attribute", path, new Error(`Hydration attribute mismatch: ${attributeName}.`));
@@ -62,18 +88,102 @@ export function applyProps(element, props, path, options) {
             if (preserveHydrationAttributes) {
                 continue;
             }
-            element[name] = value;
+            if (element[name] !== value) {
+                element[name] = value;
+            }
             if (value) {
-                element.setAttribute(attributeName, "");
+                if (!element.hasAttribute(attributeName)) {
+                    element.setAttribute(attributeName, "");
+                }
             }
-            else {
+            else if (element.hasAttribute(attributeName)) {
                 element.removeAttribute(attributeName);
             }
             continue;
         }
         applyAttribute(element, toDomAttributeName(name), value, path, options);
     }
-    setAppliedProps(element, { props: { ...props }, listeners: previous.listeners });
+    setAppliedProps(element, {
+        props,
+        ...(listeners === undefined ? {} : { listeners }),
+    });
+}
+function applyInitialProps(element, props, path, options) {
+    let listeners;
+    for (const name in props) {
+        if (!Object.prototype.hasOwnProperty.call(props, name)) {
+            continue;
+        }
+        const value = props[name];
+        if (name === "children" || name === "ref" || name === "key") {
+            continue;
+        }
+        if (applyFormValueProp(element, name, value, path, options)) {
+            continue;
+        }
+        if (value === null || value === undefined) {
+            continue;
+        }
+        if (name === "className") {
+            applyAttribute(element, "class", value, path, options);
+            continue;
+        }
+        if (name === "htmlFor") {
+            applyAttribute(element, "for", value, path, options);
+            continue;
+        }
+        if (name === "style") {
+            applyStyle(element, undefined, value, path, options);
+            continue;
+        }
+        if (/^on[A-Z]/.test(name) && typeof value === "function") {
+            const handler = value;
+            for (const eventName of toEventNames(name)) {
+                ensureDelegatedEventListener(options.eventRoot ?? element, eventName);
+            }
+            listeners ??= new Map();
+            listeners.set(name, { handler });
+            continue;
+        }
+        const attributeName = toDomAttributeName(name);
+        if (typeof value === "boolean" && isBooleanishStringAttribute(attributeName)) {
+            applyAttribute(element, attributeName, value ? "true" : "false", path, options);
+            continue;
+        }
+        if (value === false) {
+            continue;
+        }
+        if (typeof value === "boolean") {
+            if (element[name] !== value) {
+                element[name] = value;
+            }
+            if (value) {
+                if (!element.hasAttribute(attributeName)) {
+                    element.setAttribute(attributeName, "");
+                }
+            }
+            else if (element.hasAttribute(attributeName)) {
+                element.removeAttribute(attributeName);
+            }
+            continue;
+        }
+        applyAttribute(element, attributeName, value, path, options);
+    }
+    return listeners === undefined ? {} : { listeners };
+}
+function applyInitialRowProps(element, props) {
+    const meta = props[HOST_OWN_PROPS_META];
+    if (meta === undefined) {
+        return false;
+    }
+    element.setAttribute("data-key", String(props["data-key"]));
+    if ((meta & 1) !== 0) {
+        element.setAttribute("class", "selected");
+    }
+    if ((meta & 2) !== 0) {
+        element.setAttribute("data-selected", "true");
+    }
+    return true;
 }
 export function applyPostChildFormProps(element, props) {
     const value = props.value ?? props.defaultValue;
@@ -138,12 +248,16 @@ function applyAttribute(element, name, value, path, options) {
         }
         return;
     }
-    if (element.getAttribute(name) !== stringValue && !preserveHydrationAttributes) {
+    const currentValue = element.getAttribute(name);
+    if (currentValue !== stringValue && !preserveHydrationAttributes) {
         reportRecoverable(options, "attribute", path, new Error(`Hydration attribute mismatch: ${name}.`));
     }
     if (preserveHydrationAttributes) {
         return;
     }
+    if (currentValue === stringValue) {
+        return;
+    }
     element.setAttribute(name, stringValue);
 }
 function applyFormValueProp(element, name, value, path, options) {
@@ -188,23 +302,37 @@ function applyFormValueProp(element, name, value, path, options) {
     return false;
 }
 function applyStyle(element, previousStyle, nextStyle, path, options) {
+    if (options.preserveHydrationAttributes === true) {
+        return;
+    }
+    removePreviousStyle(element, previousStyle, path, options);
+    if (isStyleObject(nextStyle)) {
+        for (const [name, value] of Object.entries(nextStyle)) {
+            if (value === null || value === undefined || value === false) {
+                continue;
+            }
+            element.style.setProperty(styleNameToCssName(name), serializeClientStyleValue(name, value));
+        }
+        return;
+    }
+    if (nextStyle !== undefined && nextStyle !== null && nextStyle !== false) {
+        element.removeAttribute("style");
+    }
+}
+function removePreviousStyle(element, previousStyle, path, options) {
     if (options.preserveHydrationAttributes === true) {
         return;
     }
     if (isStyleObject(previousStyle)) {
         for (const name of Object.keys(previousStyle)) {
-            element.style.removeProperty(name);
+            element.style.removeProperty(styleNameToCssName(name));
         }
+        return;
     }
-    else if (element.hasAttribute("style")) {
+    if (previousStyle !== undefined && element.hasAttribute("style")) {
         reportRecoverable(options, "attribute", path, new Error("Hydration attribute mismatch: style."));
         element.removeAttribute("style");
     }
-    if (isStyleObject(nextStyle)) {
-        Object.assign(element.style, nextStyle);
-        return;
-    }
-    element.removeAttribute("style");
 }
 function collectAttributeNames(props) {
     const names = new Set();
@@ -213,11 +341,14 @@ function collectAttributeNames(props) {
             name === "ref" ||
             name === "key" ||
             /^on[A-Z]/.test(name) ||
-            value === false ||
             value === null ||
             value === undefined) {
             continue;
         }
+        const attributeName = toDomAttributeName(name);
+        if (value === false && !isBooleanishStringAttribute(attributeName)) {
+            continue;
+        }
         if (name === "defaultValue") {
             names.add("value");
             continue;
@@ -226,14 +357,23 @@ function collectAttributeNames(props) {
             names.add("checked");
             continue;
         }
-        names.add(toDomAttributeName(name));
+        names.add(attributeName);
     }
     return names;
 }
+function isBooleanishStringAttribute(name) {
+    const attributeName = toDomAttributeName(name).toLowerCase();
+    return attributeName.startsWith("aria-") || BOOLEANISH_STRING_ATTRIBUTES.has(attributeName);
+}
+const BOOLEANISH_STRING_ATTRIBUTES = new Set([
+    "contenteditable",
+    "draggable",
+    "spellcheck",
+]);
 function toDomAttributeName(name) {
-    return HTML_ATTRIBUTE_ALIASES[name] ?? name;
+    return DOM_ATTRIBUTE_ALIASES[name] ?? name;
 }
-const HTML_ATTRIBUTE_ALIASES = {
+const DOM_ATTRIBUTE_ALIASES = {
     acceptCharset: "accept-charset",
     autoFocus: "autofocus",
     autoPlay: "autoplay",
@@ -258,6 +398,62 @@ const HTML_ATTRIBUTE_ALIASES = {
     srcSet: "srcset",
     tabIndex: "tabindex",
     useMap: "usemap",
+    alignmentBaseline: "alignment-baseline",
+    baselineShift: "baseline-shift",
+    clipPath: "clip-path",
+    clipRule: "clip-rule",
+    colorInterpolation: "color-interpolation",
+    colorInterpolationFilters: "color-interpolation-filters",
+    colorProfile: "color-profile",
+    colorRendering: "color-rendering",
+    dominantBaseline: "dominant-baseline",
+    enableBackground: "enable-background",
+    fillOpacity: "fill-opacity",
+    fillRule: "fill-rule",
+    floodColor: "flood-color",
+    floodOpacity: "flood-opacity",
+    fontFamily: "font-family",
+    fontSize: "font-size",
+    fontSizeAdjust: "font-size-adjust",
+    fontStretch: "font-stretch",
+    fontStyle: "font-style",
+    fontVariant: "font-variant",
+    fontWeight: "font-weight",
+    glyphOrientationHorizontal: "glyph-orientation-horizontal",
+    glyphOrientationVertical: "glyph-orientation-vertical",
+    imageRendering: "image-rendering",
+    letterSpacing: "letter-spacing",
+    lightingColor: "lighting-color",
+    markerEnd: "marker-end",
+    markerMid: "marker-mid",
+    markerStart: "marker-start",
+    overlinePosition: "overline-position",
+    overlineThickness: "overline-thickness",
+    paintOrder: "paint-order",
+    pointerEvents: "pointer-events",
+    shapeRendering: "shape-rendering",
+    stopColor: "stop-color",
+    stopOpacity: "stop-opacity",
+    strikethroughPosition: "strikethrough-position",
+    strikethroughThickness: "strikethrough-thickness",
+    strokeDasharray: "stroke-dasharray",
+    strokeDashoffset: "stroke-dashoffset",
+    strokeLinecap: "stroke-linecap",
+    strokeLinejoin: "stroke-linejoin",
+    strokeMiterlimit: "stroke-miterlimit",
+    strokeOpacity: "stroke-opacity",
+    strokeWidth: "stroke-width",
+    textAnchor: "text-anchor",
+    textDecoration: "text-decoration",
+    textRendering: "text-rendering",
+    transformOrigin: "transform-origin",
+    underlinePosition: "underline-position",
+    underlineThickness: "underline-thickness",
+    unicodeBidi: "unicode-bidi",
+    vectorEffect: "vector-effect",
+    wordSpacing: "word-spacing",
+    writingMode: "writing-mode",
+    xHeight: "x-height",
 };
 function isStyleObject(value) {
     return typeof value === "object" && value !== null;