@typesafe-html5/typescript 0.2.61 → 0.2.72

package/{block → src/block}/li/li.ts

@@ -1,7 +1,7 @@
 /**
  * THIS FILE IS AUTOGENERATED. DO NOT EDIT IT.
  *
- * @generated December 28, 2025 12:26:31
+ * @generated January 2, 2026 15:45:45
  * @component Li
  * @description 
  */
@@ -11,6 +11,10 @@ export interface LiProps {
    * Child content or elements
    */
   children?: string | HTMLElement | (string | HTMLElement)[];
+  /**
+   * Keyboard shortcut to activate or focus the element
+   */
+  accessKey?: string;
   /**
    * specifies a shortcut key (or keys) to activate or focus an element
    */
@@ -87,10 +91,22 @@ export interface LiProps {
    * Indicates whether the element is hidden
    */
   autofocus?: boolean | null | undefined;
+  /**
+   * CSS class names
+   */
+  className?: string;
+  /**
+   * Whether the element is editable
+   */
+  contentEditable?: boolean | "true" | "false" | "inherit";
   /**
    * Indicates whether the element can be edited in place
    */
   contenteditable?: 'true' | 'false' | 'inherit' | boolean | null | undefined;
+  /**
+   * Mapping of data-* attributes to their values (e.g., {"test":"value"} -> data-test="value")
+   */
+  'data-attributes'?: Record<string, string> | null | undefined;
   /**
    * Represents the text direction of the element
    */
@@ -103,6 +119,10 @@ export interface LiProps {
    * Indicates whether the element is hidden
    */
   hidden?: boolean | null | undefined;
+  /**
+   * Unique identifier
+   */
+  id?: string;
   /**
    * used to specify the data entry mode for an input. It helps guide on-screen keyboards (especially on mobile devices) to show the appropriate layout for the expected input type
    */
@@ -131,6 +151,10 @@ export interface LiProps {
    * Represents the CSS inline style of the element
    */
   style?: string | null | undefined;
+  /**
+   * Tab order position
+   */
+  tabIndex?: number;
   /**
    * Represents a tab order of the element
    */
@@ -164,6 +188,9 @@ export class Li {
     if (props.children !== undefined) {
       this.setChildren(props.children);
     }
+    if (props.accessKey !== undefined) {
+      this.element.setAttribute('accessKey', String(props.accessKey));
+    }
     if (props.accesskey !== undefined) {
       this.element.setAttribute('accesskey', String(props.accesskey));
     }
@@ -221,9 +248,23 @@ export class Li {
     if (props.autofocus !== undefined) {
       this.element.setAttribute('autofocus', String(props.autofocus));
     }
+    if (props.className !== undefined) {
+      this.element.setAttribute('className', String(props.className));
+    }
+    if (props.contentEditable !== undefined) {
+      this.element.setAttribute('contentEditable', String(props.contentEditable));
+    }
     if (props.contenteditable !== undefined) {
       this.setContenteditable(props.contenteditable);
     }
+    if (props['data-attributes'] !== undefined) {
+      const __map = props['data-attributes'];
+      if (__map !== null && __map !== undefined) {
+        for (const __k in __map) {
+          this.element.setAttribute(`data-${__k}`, String((__map as any)[__k]));
+        }
+      }
+    }
     if (props.dir !== undefined) {
       this.setDir(props.dir);
     }
@@ -233,6 +274,9 @@ export class Li {
     if (props.hidden !== undefined) {
       this.element.setAttribute('hidden', String(props.hidden));
     }
+    if (props.id !== undefined) {
+      this.element.setAttribute('id', String(props.id));
+    }
     if (props.inputmode !== undefined) {
       this.setInputmode(props.inputmode);
     }
@@ -254,6 +298,9 @@ export class Li {
     if (props.style !== undefined) {
       this.element.setAttribute('style', String(props.style));
     }
+    if (props.tabIndex !== undefined) {
+      this.element.setAttribute('tabIndex', String(props.tabIndex));
+    }
     if (props.tabindex !== undefined) {
       this.element.setAttribute('tabindex', String(props.tabindex));
     }
@@ -268,6 +315,15 @@ export class Li {
     }
   }
 
+  setAccessKey(value: string): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('accessKey');
+    } else {
+      this.element.setAttribute('accessKey', String(value));
+    }
+    return this;
+  }
+
   setAccesskey(value: string | null | undefined): this {
     if (value === null || value === undefined) {
       this.element.removeAttribute('accesskey');
@@ -439,6 +495,24 @@ export class Li {
     return this;
   }
 
+  setClassName(value: string): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('className');
+    } else {
+      this.element.setAttribute('className', String(value));
+    }
+    return this;
+  }
+
+  setContentEditable(value: boolean | "true" | "false" | "inherit"): this {
+    if (value === true) {
+      this.element.setAttribute('contentEditable', '');
+    } else {
+      this.element.removeAttribute('contentEditable');
+    }
+    return this;
+  }
+
   setContenteditable(value: 'true' | 'false' | 'inherit' | boolean | null | undefined): this {
     if (value === null || value === undefined) {
       this.element.removeAttribute('contenteditable');
@@ -448,6 +522,20 @@ export class Li {
     return this;
   }
 
+  setDataAttributes(value: Record<string, string>): this {
+    if (value === null || value === undefined) {
+      // Remove all data-* attributes (best-effort)
+      for (const __a of Array.from(this.element.attributes)) {
+        if ((__a as Attr).name.startsWith('data-')) { (this.element as HTMLElement).removeAttribute((__a as Attr).name); }
+      }
+    } else {
+      for (const __k in value as Record<string, string>) {
+        this.element.setAttribute(`data-${__k}`, String((value as any)[__k]));
+      }
+    }
+    return this;
+  }
+
   setDir(value: 'ltr' | 'rtl' | 'auto' | null | undefined): this {
     if (value === null || value === undefined) {
       this.element.removeAttribute('dir');
@@ -475,6 +563,15 @@ export class Li {
     return this;
   }
 
+  setId(value: string): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('id');
+    } else {
+      this.element.setAttribute('id', String(value));
+    }
+    return this;
+  }
+
   setInputmode(value: 'none' | 'text' | 'decimal' | 'numeric' | 'email' | 'tel' | 'url' | 'search' | null | undefined): this {
     if (value === null || value === undefined) {
       this.element.removeAttribute('inputmode');
@@ -538,6 +635,15 @@ export class Li {
     return this;
   }
 
+  setTabIndex(value: number): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('tabIndex');
+    } else {
+      this.element.setAttribute('tabIndex', String(value));
+    }
+    return this;
+  }
+
   setTabindex(value: number | null | undefined): this {
     if (value === null || value === undefined) {
       this.element.removeAttribute('tabindex');

package/{block/div/div.ts → src/block/main/main.ts}

@@ -1,24 +1,24 @@
 /**
  * THIS FILE IS AUTOGENERATED. DO NOT EDIT IT.
  *
- * @generated December 28, 2025 12:26:31
- * @component Div
+ * @generated January 2, 2026 15:45:45
+ * @component Main
  * @description 
  */
 
-export interface DivProps {
+export interface MainProps {
   /**
    * Child content or elements
    */
   children?: string | HTMLElement | (string | HTMLElement)[];
   /**
-   * specifies a shortcut key (or keys) to activate or focus an element
+   * Keyboard shortcut to activate or focus the element
    */
-  accesskey?: string | null | undefined;
+  accessKey?: string;
   /**
-   * Identifies the currently active child element (e.g., for autocomplete suggestions or composite widgets).
+   * specifies a shortcut key (or keys) to activate or focus an element
    */
-  'aria-activedescendant'?: string | null | undefined;
+  accesskey?: string | null | undefined;
   /**
    * Indicates whether assistive technologies should present the entire region as a whole when changes occur.
    */
@@ -59,14 +59,6 @@ export interface DivProps {
    * Defines how updates to the element should be announced to screen readers.
    */
   'aria-live'?: 'off' | 'polite' | 'assertive' | null | undefined;
-  /**
-   * Defines whether multiple items can be selected in a listbox, grid, or tree.
-   */
-  'aria-multiselectable'?: 'false' | 'true' | boolean | null | undefined;
-  /**
-   * Specifies whether an element is horizontal or vertical.
-   */
-  'aria-orientation'?: 'horizontal' | 'vertical' | 'undefined' | null | undefined;
   /**
    * Establishes ownership relationships between elements. Value is a space-separated list of IDs.
    */
@@ -87,10 +79,22 @@ export interface DivProps {
    * Indicates whether the element is hidden
    */
   autofocus?: boolean | null | undefined;
+  /**
+   * CSS class names
+   */
+  className?: string;
+  /**
+   * Whether the element is editable
+   */
+  contentEditable?: boolean | "true" | "false" | "inherit";
   /**
    * Indicates whether the element can be edited in place
    */
   contenteditable?: 'true' | 'false' | 'inherit' | boolean | null | undefined;
+  /**
+   * Mapping of data-* attributes to their values (e.g., {"test":"value"} -> data-test="value")
+   */
+  'data-attributes'?: Record<string, string> | null | undefined;
   /**
    * Represents the text direction of the element
    */
@@ -103,6 +107,10 @@ export interface DivProps {
    * Indicates whether the element is hidden
    */
   hidden?: boolean | null | undefined;
+  /**
+   * Unique identifier
+   */
+  id?: string;
   /**
    * used to specify the data entry mode for an input. It helps guide on-screen keyboards (especially on mobile devices) to show the appropriate layout for the expected input type
    */
@@ -116,7 +124,7 @@ export interface DivProps {
    */
   popover?: 'auto' | 'hint' | 'manual' | null | undefined;
   /**
-   * The role attribute is used to define the purpose of an element.
+   * Defines the semantic purpose of an element for assistive technologies.
    */
   role?: 'alert' | 'application' | 'article' | 'banner' | 'button' | 'checkbox' | 'complementary' | 'contentinfo' | 'dialog' | 'form' | 'grid' | 'group' | 'heading' | 'img' | 'link' | 'list' | 'listbox' | 'listitem' | 'main' | 'menu' | 'menubar' | 'menuitem' | 'navigation' | 'none' | 'presentation' | 'radio' | 'region' | 'search' | 'status' | 'tab' | 'tablist' | 'tabpanel' | 'textbox' | 'toolbar' | 'tooltip' | null | undefined;
   /**
@@ -131,6 +139,10 @@ export interface DivProps {
    * Represents the CSS inline style of the element
    */
   style?: string | null | undefined;
+  /**
+   * Tab order position
+   */
+  tabIndex?: number;
   /**
    * Represents a tab order of the element
    */
@@ -146,26 +158,26 @@ export interface DivProps {
 }
 
 /**
- * Div - 
+ * Main - 
  */
-export class Div {
+export class Main {
   private element: HTMLElement;
 
-  constructor(props: DivProps = {}) {
-    this.element = document.createElement('div');
+  constructor(props: MainProps = {}) {
+    this.element = document.createElement('main');
     this.applyProps(props);
   }
 
-  private applyProps(props: DivProps): void {
+  private applyProps(props: MainProps): void {
     if (props.children !== undefined) {
       this.setChildren(props.children);
     }
+    if (props.accessKey !== undefined) {
+      this.element.setAttribute('accessKey', String(props.accessKey));
+    }
     if (props.accesskey !== undefined) {
       this.element.setAttribute('accesskey', String(props.accesskey));
     }
-    if (props['aria-activedescendant'] !== undefined) {
-      this.element.setAttribute('aria-activedescendant', String(props['aria-activedescendant']));
-    }
     if (props['aria-atomic'] !== undefined) {
       this.setAriaAtomic(props['aria-atomic']);
     }
@@ -196,12 +208,6 @@ export class Div {
     if (props['aria-live'] !== undefined) {
       this.setAriaLive(props['aria-live']);
     }
-    if (props['aria-multiselectable'] !== undefined) {
-      this.setAriaMultiselectable(props['aria-multiselectable']);
-    }
-    if (props['aria-orientation'] !== undefined) {
-      this.setAriaOrientation(props['aria-orientation']);
-    }
     if (props['aria-owns'] !== undefined) {
       this.element.setAttribute('aria-owns', String(props['aria-owns']));
     }
@@ -217,9 +223,23 @@ export class Div {
     if (props.autofocus !== undefined) {
       this.element.setAttribute('autofocus', String(props.autofocus));
     }
+    if (props.className !== undefined) {
+      this.element.setAttribute('className', String(props.className));
+    }
+    if (props.contentEditable !== undefined) {
+      this.element.setAttribute('contentEditable', String(props.contentEditable));
+    }
     if (props.contenteditable !== undefined) {
       this.setContenteditable(props.contenteditable);
     }
+    if (props['data-attributes'] !== undefined) {
+      const __map = props['data-attributes'];
+      if (__map !== null && __map !== undefined) {
+        for (const __k in __map) {
+          this.element.setAttribute(`data-${__k}`, String((__map as any)[__k]));
+        }
+      }
+    }
     if (props.dir !== undefined) {
       this.setDir(props.dir);
     }
@@ -229,6 +249,9 @@ export class Div {
     if (props.hidden !== undefined) {
       this.element.setAttribute('hidden', String(props.hidden));
     }
+    if (props.id !== undefined) {
+      this.element.setAttribute('id', String(props.id));
+    }
     if (props.inputmode !== undefined) {
       this.setInputmode(props.inputmode);
     }
@@ -250,6 +273,9 @@ export class Div {
     if (props.style !== undefined) {
       this.element.setAttribute('style', String(props.style));
     }
+    if (props.tabIndex !== undefined) {
+      this.element.setAttribute('tabIndex', String(props.tabIndex));
+    }
     if (props.tabindex !== undefined) {
       this.element.setAttribute('tabindex', String(props.tabindex));
     }
@@ -261,20 +287,20 @@ export class Div {
     }
   }
 
-  setAccesskey(value: string | null | undefined): this {
+  setAccessKey(value: string): this {
     if (value === null || value === undefined) {
-      this.element.removeAttribute('accesskey');
+      this.element.removeAttribute('accessKey');
     } else {
-      this.element.setAttribute('accesskey', String(value));
+      this.element.setAttribute('accessKey', String(value));
     }
     return this;
   }
 
-  setAriaActivedescendant(value: string | null | undefined): this {
+  setAccesskey(value: string | null | undefined): this {
     if (value === null || value === undefined) {
-      this.element.removeAttribute('aria-activedescendant');
+      this.element.removeAttribute('accesskey');
     } else {
-      this.element.setAttribute('aria-activedescendant', String(value));
+      this.element.setAttribute('accesskey', String(value));
     }
     return this;
   }
@@ -369,24 +395,6 @@ export class Div {
     return this;
   }
 
-  setAriaMultiselectable(value: 'false' | 'true' | boolean | null | undefined): this {
-    if (value === null || value === undefined) {
-      this.element.removeAttribute('aria-multiselectable');
-    } else {
-      this.element.setAttribute('aria-multiselectable', String(value));
-    }
-    return this;
-  }
-
-  setAriaOrientation(value: 'horizontal' | 'vertical' | 'undefined' | null | undefined): this {
-    if (value === null || value === undefined) {
-      this.element.removeAttribute('aria-orientation');
-    } else {
-      this.element.setAttribute('aria-orientation', String(value));
-    }
-    return this;
-  }
-
   setAriaOwns(value: string | null | undefined): this {
     if (value === null || value === undefined) {
       this.element.removeAttribute('aria-owns');
@@ -432,6 +440,24 @@ export class Div {
     return this;
   }
 
+  setClassName(value: string): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('className');
+    } else {
+      this.element.setAttribute('className', String(value));
+    }
+    return this;
+  }
+
+  setContentEditable(value: boolean | "true" | "false" | "inherit"): this {
+    if (value === true) {
+      this.element.setAttribute('contentEditable', '');
+    } else {
+      this.element.removeAttribute('contentEditable');
+    }
+    return this;
+  }
+
   setContenteditable(value: 'true' | 'false' | 'inherit' | boolean | null | undefined): this {
     if (value === null || value === undefined) {
       this.element.removeAttribute('contenteditable');
@@ -441,6 +467,20 @@ export class Div {
     return this;
   }
 
+  setDataAttributes(value: Record<string, string>): this {
+    if (value === null || value === undefined) {
+      // Remove all data-* attributes (best-effort)
+      for (const __a of Array.from(this.element.attributes)) {
+        if ((__a as Attr).name.startsWith('data-')) { (this.element as HTMLElement).removeAttribute((__a as Attr).name); }
+      }
+    } else {
+      for (const __k in value as Record<string, string>) {
+        this.element.setAttribute(`data-${__k}`, String((value as any)[__k]));
+      }
+    }
+    return this;
+  }
+
   setDir(value: 'ltr' | 'rtl' | 'auto' | null | undefined): this {
     if (value === null || value === undefined) {
       this.element.removeAttribute('dir');
@@ -468,6 +508,15 @@ export class Div {
     return this;
   }
 
+  setId(value: string): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('id');
+    } else {
+      this.element.setAttribute('id', String(value));
+    }
+    return this;
+  }
+
   setInputmode(value: 'none' | 'text' | 'decimal' | 'numeric' | 'email' | 'tel' | 'url' | 'search' | null | undefined): this {
     if (value === null || value === undefined) {
       this.element.removeAttribute('inputmode');
@@ -531,6 +580,15 @@ export class Div {
     return this;
   }
 
+  setTabIndex(value: number): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('tabIndex');
+    } else {
+      this.element.setAttribute('tabIndex', String(value));
+    }
+    return this;
+  }
+
   setTabindex(value: number | null | undefined): this {
     if (value === null || value === undefined) {
       this.element.removeAttribute('tabindex');