@tempots/dom 31.5.0 → 31.6.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tempots/dom",
-  "version": "31.5.0",
+  "version": "31.6.0",
   "type": "module",
   "main": "./index.cjs",
   "module": "./index.js",

package/renderable/attribute.d.ts

@@ -119,6 +119,7 @@ export declare const attr: {
     popovertargetaction: (value: SplitNValue<"toggle" | "hide" | "show">) => Renderable;
     poster: (value: SplitNValue<string>) => Renderable;
     preload: (value: SplitNValue<string>) => Renderable;
+    property: (value: SplitNValue<string>) => Renderable;
     radiogroup: (value: SplitNValue<string>) => Renderable;
     readonly: (value: SplitNValue<boolean>) => Renderable;
     referrerpolicy: (value: SplitNValue<"no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url">) => Renderable;
@@ -161,6 +162,8 @@ export declare const attr: {
     innerText: (value: SplitNValue<string>) => Renderable;
     innerHTML: (value: SplitNValue<string>) => Renderable;
     outerHTML: (value: SplitNValue<string>) => Renderable;
+} & {
+    set: (name: string, value: SplitNValue<string>) => Renderable;
 };
 /**
  * The `data` object allows to create any `data-` attributes. Either a literal value
@@ -176,6 +179,8 @@ export declare const attr: {
  */
 export declare const dataAttr: {
     [x: string]: (value: Value<string>) => Renderable;
+} & {
+    set: (name: string, value: Value<string>) => Renderable;
 };
 /**
  * An object that provides a convenient way to create mountable attributes for ARIA properties.
@@ -246,6 +251,8 @@ export declare const aria: {
     valuemin: (value: SplitNValue<number>) => Renderable;
     valuenow: (value: SplitNValue<number>) => Renderable;
     valuetext: (value: SplitNValue<string>) => Renderable;
+} & {
+    set: (name: string, value: Value<string>) => Renderable;
 };
 /**
  * An object that provides a convenient way to create mountable attributes for
@@ -535,6 +542,8 @@ export declare const svgAttr: {
     yChannelSelector: (value: SplitNValue<"R" | "G" | "B" | "A">) => Renderable;
     z: (value: SplitNValue<string | number>) => Renderable;
     zoomAndPan: (value: SplitNValue<"disable" | "magnify">) => Renderable;
+} & {
+    set: (name: string, value: Value<string>) => Renderable;
 };
 /**
  * An object that provides attribute functions for MathML tags.

package/renderable/utils.d.ts

@@ -0,0 +1,30 @@
+import { Clear, TNode } from '../types/domain';
+import { DOMContext } from '../dom/dom-context';
+import { Signal } from '../std/signal';
+import { Value } from '../std/value';
+/**
+ * Helper function to handle a value that could be either a Signal or a static value.
+ * Delegates to the appropriate handler based on whether the value is a Signal.
+ *
+ * @param value - The value to check (could be Signal<T> or T)
+ * @param onSignal - Handler function to call if value is a Signal
+ * @param onStatic - Handler function to call if value is static
+ * @returns The result from the appropriate handler
+ * @internal
+ */
+export declare const handleValueOrSignal: <T, R>(value: Value<T>, onSignal: (signal: Signal<T>) => R, onStatic: (literal: T) => R) => R;
+/**
+ * Creates a reactive renderable that updates when a signal changes.
+ * This helper consolidates the common pattern of:
+ * - Creating a new context reference
+ * - Setting up a signal listener that re-renders on changes
+ * - Properly cleaning up the old render before creating a new one
+ * - Disposing the signal listener and context on cleanup
+ *
+ * @param ctx - The parent DOM context
+ * @param signal - The signal to watch for changes
+ * @param render - Function that takes the signal value and returns content to render
+ * @returns A Clear function that cleans up the reactive renderable
+ * @internal
+ */
+export declare const createReactiveRenderable: <T>(ctx: DOMContext, signal: Signal<T>, render: (value: T) => TNode) => Clear;

package/types/html-attributes.d.ts

@@ -107,6 +107,7 @@ export type HTMLAttributes = {
     popovertargetaction: 'hide' | 'show' | 'toggle';
     poster: string;
     preload: string;
+    property: string;
     radiogroup: string;
     readonly: boolean;
     referrerpolicy: 'no-referrer' | 'no-referrer-when-downgrade' | 'origin' | 'origin-when-cross-origin' | 'same-origin' | 'strict-origin' | 'strict-origin-when-cross-origin' | 'unsafe-url';