@kudzujs/core 0.16.29 → 0.16.30

package/README.md

@@ -14,7 +14,7 @@ Kudzu compiles ordinary React-shaped TypeScript and TSX into complete static HTM
 
 > Experimental `0.16.x`: the compiler API and supported TSX surface may change.
 
-**Current release: [0.16.29](https://github.com/kudzujs/kudzu/releases/tag/v0.16.29).** Write reusable components, native event handlers, and pure collection expressions; Kudzu specializes supported source into static content and direct browser updates, excluding unused style and conditional capabilities.
+**Current release: [0.16.30](https://github.com/kudzujs/kudzu/releases/tag/v0.16.30).** Write reusable components, native event handlers, and pure collection expressions; Kudzu specializes supported source into static content and direct browser updates, retaining only required binding targets and capabilities.
 
 - [Documentation](https://kudzujs.cloud/docs)
 - [Installation guide](https://kudzujs.cloud/docs#install)

package/framework/binding-runtime.js

@@ -16,25 +16,25 @@ const bindingSelector = [...bindingTypes.map(target => `[data-k-bind-${target}]`
 export function patchBinding(node, target, value) {
   if (globalThis.__KUDZU_TEXT_BINDINGS__ && target === "text") {
     patchText(node, value)
-  } else if (target === "disabled") {
+  } else if (globalThis.__KUDZU_DISABLED_BINDINGS__ !== false && target === "disabled") {
     node.toggleAttribute("disabled", Boolean(value))
-  } else if (target === "checked") {
+  } else if (globalThis.__KUDZU_CHECKED_BINDINGS__ !== false && target === "checked") {
     node.checked = Boolean(value)
-  } else if (target === "value") {
+  } else if (globalThis.__KUDZU_VALUE_BINDINGS__ !== false && target === "value") {
     const next = value == null ? "" : String(value)
     if (node.value !== next) node.value = next
   } else if (target === "style") {
     const style = serializeStyle(value)
     if (style) node.setAttribute("style", style)
     else node.removeAttribute("style")
-  } else if (target === "class" && (value == null || value === false)) {
+  } else if (globalThis.__KUDZU_CLASS_BINDINGS__ !== false && target === "class" && (value == null || value === false)) {
     node.removeAttribute("class")
-  } else if (target === "class") {
+  } else if (globalThis.__KUDZU_CLASS_BINDINGS__ !== false && target === "class") {
     if (node.namespaceURI === "http://www.w3.org/1999/xhtml") node.className = String(value)
     else node.setAttribute("class", String(value))
-  } else if (value == null || (value === false && !isStringBooleanAttribute(target))) {
+  } else if (globalThis.__KUDZU_ATTRIBUTE_BINDINGS__ !== false && (value == null || (value === false && !isStringBooleanAttribute(target)))) {
     node.removeAttribute(target)
-  } else {
+  } else if (globalThis.__KUDZU_ATTRIBUTE_BINDINGS__ !== false) {
     node.setAttribute(target, value === true && !isStringBooleanAttribute(target) ? "" : String(value))
   }
 }
@@ -66,15 +66,15 @@ registerStateReleaseHook(releaseBindings)
 if (typeof document !== "undefined") mountDom(document)
 
 function mountBindings(root) {
-  for (const node of matching(root, bindingSelector)) {
+  if (globalThis.__KUDZU_ELEMENT_BINDINGS__ !== false) for (const node of matching(root, bindingSelector)) {
     if (mountedBindings.has(node)) continue
     mountedBindings.add(node)
     const registrations = []
     bindingRegistrations.set(node, registrations)
-    const descriptors = bindingTypes.flatMap(target => node.hasAttribute(`data-k-bind-${target}`)
+    const descriptors = globalThis.__KUDZU_PROPERTY_BINDINGS__ !== false ? bindingTypes.flatMap(target => node.hasAttribute(`data-k-bind-${target}`)
       ? [[target, JSON.parse(node.dataset[`kBind${capitalize(target)}`])]]
-      : [])
-    if (node.dataset.kBindAttrs) descriptors.push(...JSON.parse(node.dataset.kBindAttrs).map(({ target, ...descriptor }) => [target, descriptor]))
+      : []) : []
+    if (globalThis.__KUDZU_ATTRIBUTE_BINDINGS__ !== false && node.dataset.kBindAttrs) descriptors.push(...JSON.parse(node.dataset.kBindAttrs).map(({ target, ...descriptor }) => [target, descriptor]))
     for (const [target, descriptor] of descriptors) {
       if (descriptor.state) {
         const binding = { node, target, read: Object.hasOwn(descriptor, "truthy") ? () => browserState.get(descriptor.state) ? descriptor.truthy : descriptor.falsy : () => browserState.get(descriptor.state) }
@@ -168,7 +168,7 @@ function updateCondition(condition) {
   condition.end.parentNode.insertBefore(fragment, condition.end)
   condition.current = next
   if (condition.mount) for (const node of nodes) mountDom(node)
-  const select = condition.start.closest("select[data-k-bind-value]")
+  const select = globalThis.__KUDZU_VALUE_BINDINGS__ !== false && condition.start.closest("select[data-k-bind-value]")
   if (select) {
     for (const binding of new Set((bindingRegistrations.get(select) ?? []).map(([, entry]) => entry))) {
       patchBinding(binding.node, binding.target, binding.read())
@@ -177,7 +177,7 @@ function updateCondition(condition) {
 }
 
 function unmountBindings(root) {
-  for (const node of matching(root, bindingSelector)) {
+  if (globalThis.__KUDZU_ELEMENT_BINDINGS__ !== false) for (const node of matching(root, bindingSelector)) {
     for (const [id, binding] of bindingRegistrations.get(node) ?? []) bindingTargets.get(id)?.delete(binding)
     bindingRegistrations.delete(node)
     mountedBindings.delete(node)

package/framework/compiler/route-capability-planner.mjs

@@ -1,6 +1,8 @@
 import { assertRouteBuildRecord } from "./route-build-record.mjs"
 import { assertJsonSafe, assertRouteIR } from "./route-ir.mjs"
 
+const propertyBindings = ["class", "disabled", "value", "checked", "style"]
+
 export function usesRouteDependencyRuntime({ plan, navigable, hasBindings, hasLists }, validate = true) {
   if (validate) assertRouteIR(plan)
   const hasDependencies = plan.effects.some(effect => effect.dependencies?.length)
@@ -92,6 +94,9 @@ export function planRouteCapabilities(records, { navigationRouteCount = 0 } = {}
     dependencyStateSeeds: routeEntries.filter(route => route.hasStateSeed && route.usesDependencyRuntime).length
   }
   bindings.count = routeEntries.filter(route => route.hasBindings).length
+  const bindingTargets = new Set(plans.flatMap(plan => plan.bindings.map(binding => binding.target)))
+  bindings.properties = propertyBindings.filter(target => bindingTargets.has(target))
+  bindings.attributes = [...bindingTargets].some(target => target !== "text" && !propertyBindings.includes(target))
   lists.count = routeEntries.filter(route => route.hasLists).length
   lists.styleCount = routeEntries.filter(route => route.hasListStyles).length
   lists.generalRowHooks ||= lists.rowRefs || lists.complexRowState
@@ -120,7 +125,9 @@ export function assertCapabilityIR(capabilityIR, records, options = {}) {
   if (!sections.every(name => isRecord(capabilityIR[name]))) throw new Error("Invalid CapabilityIR v1 structure")
   if (!["behaviors", "regularBehaviors", "regularStateSeeds", "dependencyStateSeeds"].every(name => isCount(capabilityIR.routes[name]))) throw new Error("Invalid CapabilityIR v1 route counts")
   if (!["command", "native"].every(name => Array.isArray(capabilityIR.events[name]) && capabilityIR.events[name].every(event => typeof event === "string")) || typeof capabilityIR.events.hasNativeHandlers !== "boolean") throw new Error("Invalid CapabilityIR v1 events")
-  if (!isCount(capabilityIR.bindings.count) || !["text", "style", "conditions", "svgConditions"].every(name => typeof capabilityIR.bindings[name] === "boolean")) throw new Error("Invalid CapabilityIR v1 bindings")
+  if (!isCount(capabilityIR.bindings.count) || !["text", "style", "conditions", "svgConditions", "attributes"].every(name => typeof capabilityIR.bindings[name] === "boolean")) throw new Error("Invalid CapabilityIR v1 bindings")
+  if (!Array.isArray(capabilityIR.bindings.properties) || capabilityIR.bindings.properties.some(target => !propertyBindings.includes(target)) || new Set(capabilityIR.bindings.properties).size !== capabilityIR.bindings.properties.length) throw new Error("Invalid CapabilityIR v1 binding properties")
+  if (capabilityIR.bindings.style !== capabilityIR.bindings.properties.includes("style")) throw new Error("CapabilityIR binding style flag does not match its properties")
   const listFlags = ["conditions", "svg", "deepConditions", "textRanges", "attributes", "events", "expressions", "expressionAttributes", "seeds", "effects", "rowHooks", "rowRefs", "complexRowState", "nested", "selectors", "calculated", "static", "indexes", "stableFastPaths", "generalRowHooks", "asyncParts", "mounts"]
   if (!isCount(capabilityIR.lists.count) || !isCount(capabilityIR.lists.styleCount) || !listFlags.every(name => typeof capabilityIR.lists[name] === "boolean")) throw new Error("Invalid CapabilityIR v1 lists")
   if (!["any", "derivedDependencies", "itemDependencies", "captures", "navigable", "navigableOwners"].every(name => typeof capabilityIR.effects[name] === "boolean") || !["nestedState", "setter"].every(name => typeof capabilityIR.captures[name] === "boolean") || !["shared", "dependency"].every(name => typeof capabilityIR.runtime[name] === "boolean")) throw new Error("Invalid CapabilityIR v1 effect, capture, or runtime flags")

package/framework/compiler/runtime-codegen.mjs

@@ -27,8 +27,13 @@ export function generateEffectRuntime(source, capabilityIR) {
 
 export function generateBindingRuntime(source, capabilityIR, navigable) {
   assertCapabilityIR(capabilityIR)
+  const { properties, attributes } = capabilityIR.bindings
   let runtime = replaceRequired(source, '"./shared-runtime.js"', '"./kudzu.js"', "shared runtime import", "binding-runtime.js")
   runtime = replaceRequired(runtime, '"./serialization.js"', '"./kudzu-serialization.js"', "serialization import", "binding-runtime.js")
+  runtime = replaceRequired(runtime, /const bindingTypes = \[[^\n]+\]/, `const bindingTypes = ${JSON.stringify(properties)}`, "binding properties", "binding-runtime.js")
+  const selectors = [...properties.map(target => `[data-k-bind-${target}]`), ...(attributes ? ["[data-k-bind-attrs]"] : [])]
+  // The existing generic selector is smaller when all five property kinds are used.
+  if (properties.length !== 5 || !attributes) runtime = replaceRequired(runtime, /^const bindingSelector = .*$/m, `const bindingSelector = ${JSON.stringify(selectors.join(","))}`, "binding selectors", "binding-runtime.js")
   runtime = capabilityIR.bindings.style
     ? replaceRequired(runtime, '"./style.js"', '"./kudzu-style.js"', "style import", "binding-runtime.js")
     : replaceSequenceRequired(runtime, [
@@ -40,6 +45,13 @@ export function generateBindingRuntime(source, capabilityIR, navigable) {
     source: runtime,
     define: {
       "globalThis.__KUDZU_TEXT_BINDINGS__": String(capabilityIR.bindings.text),
+      "globalThis.__KUDZU_ELEMENT_BINDINGS__": String(selectors.length > 0),
+      "globalThis.__KUDZU_PROPERTY_BINDINGS__": String(properties.length > 0),
+      "globalThis.__KUDZU_ATTRIBUTE_BINDINGS__": String(attributes),
+      "globalThis.__KUDZU_CLASS_BINDINGS__": String(properties.includes("class")),
+      "globalThis.__KUDZU_DISABLED_BINDINGS__": String(properties.includes("disabled")),
+      "globalThis.__KUDZU_CHECKED_BINDINGS__": String(properties.includes("checked")),
+      "globalThis.__KUDZU_VALUE_BINDINGS__": String(properties.includes("value")),
       "globalThis.__KUDZU_CONDITIONS__": String(capabilityIR.bindings.conditions),
       "globalThis.__KUDZU_SVG_CONDITIONS__": String(capabilityIR.bindings.svgConditions),
       "globalThis.__KUDZU_CAPTURE_STATE__": String(capabilityIR.captures.nestedState)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kudzujs/core",
-  "version": "0.16.29",
+  "version": "0.16.30",
   "description": "HTML-first TSX framework with synchronous state semantics and no virtual DOM",
   "type": "module",
   "license": "MIT",