@typesafe-html5/typescript 0.2.58

package/void/area/area.ts

@@ -0,0 +1,397 @@
+/**
+ * THIS FILE IS AUTOGENERATED. DO NOT EDIT IT.
+ *
+ * @generated December 28, 2025 12:26:31
+ * @component Area
+ * @description 
+ */
+
+export interface AreaProps {
+  /**
+   * specifies a shortcut key (or keys) to activate or focus an element
+   */
+  accesskey?: string | null | undefined;
+  /**
+   * Specifies alternative text to be displayed when the image cannot be rendered.
+   */
+  alt?: string | null | undefined;
+  /**
+   * Represents the autocapitalize behavior of the element
+   */
+  autocapitalize?: 'none' | 'sentences' | 'words' | 'characters' | null | undefined;
+  /**
+   * Indicates whether the element is hidden
+   */
+  autofocus?: boolean | null | undefined;
+  /**
+   * Indicates whether the element can be edited in place
+   */
+  contenteditable?: 'true' | 'false' | 'inherit' | boolean | null | undefined;
+  /**
+   * Specifies the coordinates of the shape in a rectangular area or a polygonal area on an image map.
+   */
+  coords?: string | null | undefined;
+  /**
+   * Represents the text direction of the element
+   */
+  dir?: 'ltr' | 'rtl' | 'auto' | null | undefined;
+  /**
+   * Indicates that the linked content should be downloaded rather than displayed.
+   */
+  download?: string | null | undefined;
+  /**
+   * Indicates whether the element is draggable
+   */
+  draggable?: boolean | null | undefined;
+  /**
+   * Indicates whether the element is hidden
+   */
+  hidden?: boolean | null | undefined;
+  /**
+   * Specifies the URL of the linked resource. Special protocols such as mailto: or tel: can be used.
+   */
+  href?: string | null | undefined;
+  /**
+   * Specifies the language of the linked resource.
+   */
+  hreflang?: string | null | undefined;
+  /**
+   * 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
+   */
+  inputmode?: 'none' | 'text' | 'decimal' | 'numeric' | 'email' | 'tel' | 'url' | 'search' | null | undefined;
+  /**
+   * Specifies the primary language for the element's content
+   */
+  lang?: string | null | undefined;
+  /**
+   * Specifies the relationship between the current document and the linked document.
+   */
+  rel?: 'alternate' | 'author' | 'bookmark' | 'canonical' | 'help' | 'icon' | 'license' | 'next' | 'nofollow' | 'noreferrer' | 'prefetch' | 'prev' | 'search' | 'stylesheet' | 'tag' | null | undefined;
+  /**
+   * 
+   */
+  shape?: 'circle' | 'default' | 'poly' | 'rect' | null | undefined;
+  /**
+   * Represents the spellchecking behavior of the element
+   */
+  spellcheck?: 'true' | 'false' | boolean | null | undefined;
+  /**
+   * Represents the CSS inline style of the element
+   */
+  style?: string | null | undefined;
+  /**
+   * Represents a tab order of the element
+   */
+  tabindex?: number | null | undefined;
+  /**
+   * Specifies where to open the linked document.
+   */
+  target?: '_blank' | '_parent' | '_self' | '_top' | null | undefined;
+  /**
+   * Represents a title or tooltip for the element
+   */
+  title?: string | null | undefined;
+  /**
+   * used to tell user agents whether the content should be translated.
+   */
+  translate?: 'yes' | 'no' | null | undefined;
+  /**
+   * Specifies the media type of the linked resource.
+   */
+  type?: string | null | undefined;
+}
+
+/**
+ * Area - 
+ */
+export class Area {
+  private element: HTMLElement;
+
+  constructor(props: AreaProps = {}) {
+    this.element = document.createElement('area');
+    this.applyProps(props);
+  }
+
+  private applyProps(props: AreaProps): void {
+    if (props.accesskey !== undefined) {
+      this.element.setAttribute('accesskey', String(props.accesskey));
+    }
+    if (props.alt !== undefined) {
+      this.element.setAttribute('alt', String(props.alt));
+    }
+    if (props.autocapitalize !== undefined) {
+      this.setAutocapitalize(props.autocapitalize);
+    }
+    if (props.autofocus !== undefined) {
+      this.element.setAttribute('autofocus', String(props.autofocus));
+    }
+    if (props.contenteditable !== undefined) {
+      this.setContenteditable(props.contenteditable);
+    }
+    if (props.coords !== undefined) {
+      this.element.setAttribute('coords', String(props.coords));
+    }
+    if (props.dir !== undefined) {
+      this.setDir(props.dir);
+    }
+    if (props.download !== undefined) {
+      this.element.setAttribute('download', String(props.download));
+    }
+    if (props.draggable !== undefined) {
+      this.element.setAttribute('draggable', String(props.draggable));
+    }
+    if (props.hidden !== undefined) {
+      this.element.setAttribute('hidden', String(props.hidden));
+    }
+    if (props.href !== undefined) {
+      this.element.setAttribute('href', String(props.href));
+    }
+    if (props.hreflang !== undefined) {
+      this.element.setAttribute('hreflang', String(props.hreflang));
+    }
+    if (props.inputmode !== undefined) {
+      this.setInputmode(props.inputmode);
+    }
+    if (props.lang !== undefined) {
+      this.element.setAttribute('lang', String(props.lang));
+    }
+    if (props.rel !== undefined) {
+      this.setRel(props.rel);
+    }
+    if (props.shape !== undefined) {
+      this.setShape(props.shape);
+    }
+    if (props.spellcheck !== undefined) {
+      this.setSpellcheck(props.spellcheck);
+    }
+    if (props.style !== undefined) {
+      this.element.setAttribute('style', String(props.style));
+    }
+    if (props.tabindex !== undefined) {
+      this.element.setAttribute('tabindex', String(props.tabindex));
+    }
+    if (props.target !== undefined) {
+      this.setTarget(props.target);
+    }
+    if (props.title !== undefined) {
+      this.element.setAttribute('title', String(props.title));
+    }
+    if (props.translate !== undefined) {
+      this.setTranslate(props.translate);
+    }
+    if (props.type !== undefined) {
+      this.element.setAttribute('type', String(props.type));
+    }
+  }
+
+  setAccesskey(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('accesskey');
+    } else {
+      this.element.setAttribute('accesskey', String(value));
+    }
+    return this;
+  }
+
+  setAlt(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('alt');
+    } else {
+      this.element.setAttribute('alt', String(value));
+    }
+    return this;
+  }
+
+  setAutocapitalize(value: 'none' | 'sentences' | 'words' | 'characters' | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('autocapitalize');
+    } else {
+      this.element.setAttribute('autocapitalize', String(value));
+    }
+    return this;
+  }
+
+  setAutofocus(value: boolean | null | undefined): this {
+    if (value === true) {
+      this.element.setAttribute('autofocus', '');
+    } else {
+      this.element.removeAttribute('autofocus');
+    }
+    return this;
+  }
+
+  setContenteditable(value: 'true' | 'false' | 'inherit' | boolean | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('contenteditable');
+    } else {
+      this.element.setAttribute('contenteditable', String(value));
+    }
+    return this;
+  }
+
+  setCoords(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('coords');
+    } else {
+      this.element.setAttribute('coords', String(value));
+    }
+    return this;
+  }
+
+  setDir(value: 'ltr' | 'rtl' | 'auto' | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('dir');
+    } else {
+      this.element.setAttribute('dir', String(value));
+    }
+    return this;
+  }
+
+  setDownload(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('download');
+    } else {
+      this.element.setAttribute('download', String(value));
+    }
+    return this;
+  }
+
+  setDraggable(value: boolean | null | undefined): this {
+    if (value === true) {
+      this.element.setAttribute('draggable', '');
+    } else {
+      this.element.removeAttribute('draggable');
+    }
+    return this;
+  }
+
+  setHidden(value: boolean | null | undefined): this {
+    if (value === true) {
+      this.element.setAttribute('hidden', '');
+    } else {
+      this.element.removeAttribute('hidden');
+    }
+    return this;
+  }
+
+  setHref(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('href');
+    } else {
+      this.element.setAttribute('href', String(value));
+    }
+    return this;
+  }
+
+  setHreflang(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('hreflang');
+    } else {
+      this.element.setAttribute('hreflang', 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');
+    } else {
+      this.element.setAttribute('inputmode', String(value));
+    }
+    return this;
+  }
+
+  setLang(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('lang');
+    } else {
+      this.element.setAttribute('lang', String(value));
+    }
+    return this;
+  }
+
+  setRel(value: 'alternate' | 'author' | 'bookmark' | 'canonical' | 'help' | 'icon' | 'license' | 'next' | 'nofollow' | 'noreferrer' | 'prefetch' | 'prev' | 'search' | 'stylesheet' | 'tag' | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('rel');
+    } else {
+      this.element.setAttribute('rel', String(value));
+    }
+    return this;
+  }
+
+  setShape(value: 'circle' | 'default' | 'poly' | 'rect' | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('shape');
+    } else {
+      this.element.setAttribute('shape', String(value));
+    }
+    return this;
+  }
+
+  setSpellcheck(value: 'true' | 'false' | boolean | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('spellcheck');
+    } else {
+      this.element.setAttribute('spellcheck', String(value));
+    }
+    return this;
+  }
+
+  setStyle(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('style');
+    } else {
+      this.element.setAttribute('style', String(value));
+    }
+    return this;
+  }
+
+  setTabindex(value: number | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('tabindex');
+    } else {
+      this.element.setAttribute('tabindex', String(value));
+    }
+    return this;
+  }
+
+  setTarget(value: '_blank' | '_parent' | '_self' | '_top' | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('target');
+    } else {
+      this.element.setAttribute('target', String(value));
+    }
+    return this;
+  }
+
+  setTitle(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('title');
+    } else {
+      this.element.setAttribute('title', String(value));
+    }
+    return this;
+  }
+
+  setTranslate(value: 'yes' | 'no' | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('translate');
+    } else {
+      this.element.setAttribute('translate', String(value));
+    }
+    return this;
+  }
+
+  setType(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('type');
+    } else {
+      this.element.setAttribute('type', String(value));
+    }
+    return this;
+  }
+
+  getElement(): HTMLElement {
+    return this.element;
+  }
+}

package/void/base/base.ts

@@ -0,0 +1,61 @@
+/**
+ * THIS FILE IS AUTOGENERATED. DO NOT EDIT IT.
+ *
+ * @generated December 28, 2025 12:26:31
+ * @component Base
+ * @description 
+ */
+
+export interface BaseProps {
+  /**
+   * Specifies the URL of the linked resource. Special protocols such as mailto: or tel: can be used.
+   */
+  href?: string | null | undefined;
+  /**
+   * Specifies where to open the linked document.
+   */
+  target?: '_blank' | '_parent' | '_self' | '_top' | null | undefined;
+}
+
+/**
+ * Base - 
+ */
+export class Base {
+  private element: HTMLElement;
+
+  constructor(props: BaseProps = {}) {
+    this.element = document.createElement('base');
+    this.applyProps(props);
+  }
+
+  private applyProps(props: BaseProps): void {
+    if (props.href !== undefined) {
+      this.element.setAttribute('href', String(props.href));
+    }
+    if (props.target !== undefined) {
+      this.setTarget(props.target);
+    }
+  }
+
+  setHref(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('href');
+    } else {
+      this.element.setAttribute('href', String(value));
+    }
+    return this;
+  }
+
+  setTarget(value: '_blank' | '_parent' | '_self' | '_top' | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('target');
+    } else {
+      this.element.setAttribute('target', String(value));
+    }
+    return this;
+  }
+
+  getElement(): HTMLElement {
+    return this.element;
+  }
+}

package/void/br/br.ts

@@ -0,0 +1,77 @@
+/**
+ * THIS FILE IS AUTOGENERATED. DO NOT EDIT IT.
+ *
+ * @generated December 28, 2025 12:26:31
+ * @component Br
+ * @description 
+ */
+
+export interface BrProps {
+  /**
+   * Represents the text direction of the element
+   */
+  dir?: 'ltr' | 'rtl' | 'auto' | null | undefined;
+  /**
+   * Indicates whether the element is hidden
+   */
+  hidden?: boolean | null | undefined;
+  /**
+   * Represents the CSS inline style of the element
+   */
+  style?: string | null | undefined;
+}
+
+/**
+ * Br - 
+ */
+export class Br {
+  private element: HTMLElement;
+
+  constructor(props: BrProps = {}) {
+    this.element = document.createElement('br');
+    this.applyProps(props);
+  }
+
+  private applyProps(props: BrProps): void {
+    if (props.dir !== undefined) {
+      this.setDir(props.dir);
+    }
+    if (props.hidden !== undefined) {
+      this.element.setAttribute('hidden', String(props.hidden));
+    }
+    if (props.style !== undefined) {
+      this.element.setAttribute('style', String(props.style));
+    }
+  }
+
+  setDir(value: 'ltr' | 'rtl' | 'auto' | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('dir');
+    } else {
+      this.element.setAttribute('dir', String(value));
+    }
+    return this;
+  }
+
+  setHidden(value: boolean | null | undefined): this {
+    if (value === true) {
+      this.element.setAttribute('hidden', '');
+    } else {
+      this.element.removeAttribute('hidden');
+    }
+    return this;
+  }
+
+  setStyle(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('style');
+    } else {
+      this.element.setAttribute('style', String(value));
+    }
+    return this;
+  }
+
+  getElement(): HTMLElement {
+    return this.element;
+  }
+}

package/void/col/col.ts

@@ -0,0 +1,77 @@
+/**
+ * THIS FILE IS AUTOGENERATED. DO NOT EDIT IT.
+ *
+ * @generated December 28, 2025 12:26:31
+ * @component Col
+ * @description 
+ */
+
+export interface ColProps {
+  /**
+   * Specifies the number of columns the <col> element should span in a table.
+   */
+  span?: number | null | undefined;
+  /**
+   * Represents the CSS inline style of the element
+   */
+  style?: string | null | undefined;
+  /**
+   * Specifies the width of the element. The meaning may vary depending on the element type. Accepts integers, pixels (px), and percentages (%).
+   */
+  width?: string | null | undefined;
+}
+
+/**
+ * Col - 
+ */
+export class Col {
+  private element: HTMLElement;
+
+  constructor(props: ColProps = {}) {
+    this.element = document.createElement('col');
+    this.applyProps(props);
+  }
+
+  private applyProps(props: ColProps): void {
+    if (props.span !== undefined) {
+      this.element.setAttribute('span', String(props.span));
+    }
+    if (props.style !== undefined) {
+      this.element.setAttribute('style', String(props.style));
+    }
+    if (props.width !== undefined) {
+      this.element.setAttribute('width', String(props.width));
+    }
+  }
+
+  setSpan(value: number | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('span');
+    } else {
+      this.element.setAttribute('span', String(value));
+    }
+    return this;
+  }
+
+  setStyle(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('style');
+    } else {
+      this.element.setAttribute('style', String(value));
+    }
+    return this;
+  }
+
+  setWidth(value: string | null | undefined): this {
+    if (value === null || value === undefined) {
+      this.element.removeAttribute('width');
+    } else {
+      this.element.setAttribute('width', String(value));
+    }
+    return this;
+  }
+
+  getElement(): HTMLElement {
+    return this.element;
+  }
+}

package/void/head/head.ts

@@ -0,0 +1,58 @@
+/**
+ * THIS FILE IS AUTOGENERATED. DO NOT EDIT IT.
+ *
+ * @generated December 28, 2025 12:26:31
+ * @component Head
+ * @description 
+ */
+
+export interface HeadProps {
+  /**
+   * Child content or elements
+   */
+  children?: string | HTMLElement | (string | HTMLElement)[];
+}
+
+/**
+ * Head - 
+ */
+export class Head {
+  private element: HTMLElement;
+
+  constructor(props: HeadProps = {}) {
+    this.element = document.createElement('head');
+    this.applyProps(props);
+  }
+
+  private applyProps(props: HeadProps): void {
+    if (props.children !== undefined) {
+      this.setChildren(props.children);
+    }
+  }
+
+  setChildren(children: string | HTMLElement | (string | HTMLElement)[]): this {
+    // Clear existing children
+    while (this.element.firstChild) {
+      this.element.removeChild(this.element.firstChild);
+    }
+    
+    if (typeof children === 'string') {
+      this.element.textContent = children;
+    } else if (Array.isArray(children)) {
+      children.forEach(child => {
+        if (typeof child === 'string') {
+          this.element.appendChild(document.createTextNode(child));
+        } else {
+          this.element.appendChild(child);
+        }
+      });
+    } else {
+      this.element.appendChild(children);
+    }
+    return this;
+  }
+
+  getElement(): HTMLElement {
+    return this.element;
+  }
+}