tiny-essentials 1.24.0 → 1.24.2

package/dist/v1/libs/TinyHtml/input/date/TinyHtmlTimeInput.d.mts

@@ -0,0 +1,75 @@
+export default TinyHtmlTimeInput;
+/**
+ * TinyHtmlTimeInput is a helper class for managing `<input type="time">` elements.
+ * It provides validated getters and setters for all relevant attributes such as
+ * value, min, max, step, autocomplete, and more.
+ *
+ * @example
+ * const timeInput = new TinyHtmlTimeInput({
+ *   value: "12:30",
+ *   min: "08:00",
+ *   max: "18:00",
+ *   step: 60,
+ *   required: true,
+ *   name: "appointmentTime"
+ * });
+ */
+declare class TinyHtmlTimeInput extends TinyHtmlInput {
+    /**
+     * Creates a new TinyHtmlTimeInput instance.
+     * @param {Object} config - Configuration object.
+     * @param {string} [config.value] - Initial time value in "HH:MM" format.
+     * @param {string} [config.min] - Minimum allowed time (e.g., "08:00").
+     * @param {string} [config.max] - Maximum allowed time (e.g., "18:00").
+     * @param {number|string} [config.step] - Granularity in seconds (or "any").
+     * @param {string} [config.name] - The name of the control.
+     * @param {string} [config.placeholder] - Placeholder text.
+     * @param {string} [config.autocomplete] - Autocomplete hint ("on", "off", or token list).
+     * @param {string} [config.list] - The id of a `<datalist>`.
+     * @param {boolean} [config.readonly=false] - Whether the input is read-only.
+     * @param {boolean} [config.required=false] - Whether the input is required.
+     * @param {string|string[]|Set<string>} [config.tags=[]] - Initial CSS classes.
+     * @param {string} [config.mainClass=''] - Main CSS class.
+     * @throws {TypeError} If any attribute is of the wrong type.
+     */
+    constructor({ value, list, min, max, step, name, readonly, required, placeholder, autocomplete, tags, mainClass, }?: {
+        value?: string | undefined;
+        min?: string | undefined;
+        max?: string | undefined;
+        step?: string | number | undefined;
+        name?: string | undefined;
+        placeholder?: string | undefined;
+        autocomplete?: string | undefined;
+        list?: string | undefined;
+        readonly?: boolean | undefined;
+        required?: boolean | undefined;
+        tags?: string | string[] | Set<string> | undefined;
+        mainClass?: string | undefined;
+    });
+    /** @param {string|Date|number} value */
+    set value(value: string | Date | number);
+    /** @returns {string|null} */
+    get value(): string | null;
+    /** @param {string} min */
+    set min(min: string);
+    /** @returns {string|null} */
+    get min(): string | null;
+    /** @param {string} max */
+    set max(max: string);
+    /** @returns {string|null} */
+    get max(): string | null;
+    /** @param {number|string} step */
+    set step(step: number | string);
+    /** @returns {string|null} */
+    get step(): string | null;
+    /** @param {string} list */
+    set list(list: string);
+    /** @returns {string|null} */
+    get list(): string | null;
+    /** @param {string} autocomplete */
+    set autocomplete(autocomplete: string);
+    /** @returns {string|null} */
+    get autocomplete(): string | null;
+}
+import TinyHtmlInput from '../../TinyHtmlInput.mjs';
+//# sourceMappingURL=TinyHtmlTimeInput.d.mts.map

package/dist/v1/libs/TinyHtml/input/date/TinyHtmlTimeInput.mjs

@@ -0,0 +1,128 @@
+import TinyHtmlInput from '../../TinyHtmlInput.mjs';
+/**
+ * TinyHtmlTimeInput is a helper class for managing `<input type="time">` elements.
+ * It provides validated getters and setters for all relevant attributes such as
+ * value, min, max, step, autocomplete, and more.
+ *
+ * @example
+ * const timeInput = new TinyHtmlTimeInput({
+ *   value: "12:30",
+ *   min: "08:00",
+ *   max: "18:00",
+ *   step: 60,
+ *   required: true,
+ *   name: "appointmentTime"
+ * });
+ */
+class TinyHtmlTimeInput extends TinyHtmlInput {
+    /**
+     * Creates a new TinyHtmlTimeInput instance.
+     * @param {Object} config - Configuration object.
+     * @param {string} [config.value] - Initial time value in "HH:MM" format.
+     * @param {string} [config.min] - Minimum allowed time (e.g., "08:00").
+     * @param {string} [config.max] - Maximum allowed time (e.g., "18:00").
+     * @param {number|string} [config.step] - Granularity in seconds (or "any").
+     * @param {string} [config.name] - The name of the control.
+     * @param {string} [config.placeholder] - Placeholder text.
+     * @param {string} [config.autocomplete] - Autocomplete hint ("on", "off", or token list).
+     * @param {string} [config.list] - The id of a `<datalist>`.
+     * @param {boolean} [config.readonly=false] - Whether the input is read-only.
+     * @param {boolean} [config.required=false] - Whether the input is required.
+     * @param {string|string[]|Set<string>} [config.tags=[]] - Initial CSS classes.
+     * @param {string} [config.mainClass=''] - Main CSS class.
+     * @throws {TypeError} If any attribute is of the wrong type.
+     */
+    constructor({ value, list, min, max, step, name, readonly = false, required = false, placeholder, autocomplete, tags = [], mainClass = '', } = {}) {
+        super({ name, placeholder, type: 'time', tags, mainClass });
+        // --- attributes initialization ---
+        if (value !== undefined)
+            this.value = value;
+        if (min !== undefined)
+            this.min = min;
+        if (max !== undefined)
+            this.max = max;
+        if (step !== undefined)
+            this.step = step;
+        if (list !== undefined)
+            this.list = list;
+        if (autocomplete !== undefined)
+            this.autocomplete = autocomplete;
+        // --- boolean props ---
+        this.readonly = readonly;
+        this.required = required;
+    }
+    /** @param {string|Date|number} value */
+    set value(value) {
+        if (typeof value !== 'string' && typeof value !== 'number' && !(value instanceof Date))
+            throw new TypeError('TinyHtmlTimeInput: "value" must be a string or date.');
+        if (value instanceof Date) {
+            const hours = String(value.getHours()).padStart(2, '0');
+            const minutes = String(value.getMinutes()).padStart(2, '0');
+            const formatted = `${hours}:${minutes}`;
+            this.setVal(formatted);
+            return;
+        }
+        this.setVal(value);
+    }
+    /** @returns {string|null} */
+    get value() {
+        return this.attrString('value');
+    }
+    /** @param {string} min */
+    set min(min) {
+        if (typeof min !== 'string')
+            throw new TypeError('TinyHtmlTimeInput: "min" must be a string.');
+        this.setAttr('min', min);
+    }
+    /** @returns {string|null} */
+    get min() {
+        return this.attrString('min');
+    }
+    /** @param {string} max */
+    set max(max) {
+        if (typeof max !== 'string')
+            throw new TypeError('TinyHtmlTimeInput: "max" must be a string.');
+        this.setAttr('max', max);
+    }
+    /** @returns {string|null} */
+    get max() {
+        return this.attrString('max');
+    }
+    /** @param {number|string} step */
+    set step(step) {
+        if (typeof step === 'number') {
+            if (!Number.isFinite(step) || step <= 0)
+                throw new TypeError('TinyHtmlTimeInput: "step" must be a positive number or "any".');
+            this.setAttr('step', String(step));
+            return;
+        }
+        if (step !== 'any')
+            throw new TypeError('TinyHtmlTimeInput: "step" must be a number or "any".');
+        this.setAttr('step', step);
+    }
+    /** @returns {string|null} */
+    get step() {
+        return this.attrString('step');
+    }
+    /** @param {string} list */
+    set list(list) {
+        if (typeof list !== 'string')
+            throw new TypeError('TinyHtmlTimeInput: "list" must be a string (datalist id).');
+        this.setAttr('list', list);
+    }
+    /** @returns {string|null} */
+    get list() {
+        return this.attrString('list');
+    }
+    /** @param {string} autocomplete */
+    set autocomplete(autocomplete) {
+        if (typeof autocomplete !== 'string')
+            throw new TypeError('TinyHtmlTimeInput: "autocomplete" must be a string.');
+        this.setAttr('autocomplete', autocomplete);
+    }
+    /** @returns {string|null} */
+    get autocomplete() {
+        return this.attrString('autocomplete');
+    }
+}
+export default TinyHtmlTimeInput;

package/dist/v1/libs/TinyHtml/input/date/TinyHtmlWeekInput.cjs

@@ -0,0 +1,150 @@
+'use strict';
+
+var TinyHtmlInput = require('../../TinyHtmlInput.cjs');
+
+/**
+ * TinyHtmlWeekInput is a helper class for managing `<input type="week">` elements.
+ * It provides getters and setters for all standard attributes, ensuring type safety
+ * and validation for each property.
+ *
+ * @example
+ * const weekInput = new TinyHtmlWeekInput({
+ *   value: '2023-W15',
+ *   min: '2023-W01',
+ *   max: '2023-W52',
+ *   step: 1,
+ *   required: true
+ * });
+ */
+class TinyHtmlWeekInput extends TinyHtmlInput {
+  /**
+   * Creates a new TinyHtmlWeekInput instance.
+   * @param {Object} config - Configuration object.
+   * @param {string} [config.value] - Initial value (`YYYY-Www` format).
+   * @param {string} [config.min] - Minimum allowed week (`YYYY-Www`).
+   * @param {string} [config.max] - Maximum allowed week (`YYYY-Www`).
+   * @param {number} [config.step] - Step interval in weeks.
+   * @param {string} [config.name] - The name of the input.
+   * @param {string} [config.placeholder] - Placeholder text.
+   * @param {string} [config.autocomplete] - Autocomplete hint (e.g., "on", "off").
+   * @param {string} [config.list] - ID of a `<datalist>`.
+   * @param {boolean} [config.readonly=false] - Whether the input is read-only.
+   * @param {boolean} [config.required=false] - Whether the input is required.
+   * @param {string|string[]|Set<string>} [config.tags=[]] - Initial CSS classes.
+   * @param {string} [config.mainClass=''] - Main CSS class.
+   * @throws {TypeError} If any attribute is of the wrong type.
+   */
+  constructor({
+    value,
+    min,
+    max,
+    step,
+    name,
+    placeholder,
+    autocomplete,
+    list,
+    readonly = false,
+    required = false,
+    tags = [],
+    mainClass = '',
+  } = {}) {
+    super({ type: 'week', name, placeholder, tags, mainClass, readonly, required });
+
+    if (value !== undefined) this.value = value;
+    if (min !== undefined) this.min = min;
+    if (max !== undefined) this.max = max;
+    if (step !== undefined) this.step = step;
+    if (list !== undefined) this.list = list;
+    if (autocomplete !== undefined) this.autocomplete = autocomplete;
+  }
+
+  /** @param {string|Date} value */
+  set value(value) {
+    if (typeof value !== 'string' && !(value instanceof Date))
+      throw new TypeError(
+        'TinyHtmlWeekInput: "value" must be a string (format: YYYY-Www) or date.',
+      );
+    if (value instanceof Date) {
+      // ISO week number calculation
+      const temp = new Date(value.getTime());
+      temp.setHours(0, 0, 0, 0);
+      // Thursday in current week decides the year
+      temp.setDate(temp.getDate() + 3 - ((temp.getDay() + 6) % 7));
+      const weekYear = temp.getFullYear();
+      const week1 = new Date(weekYear, 0, 4);
+      const weekNo = Math.ceil(
+        ((temp.valueOf() - week1.valueOf()) / 86400000 + ((week1.getDay() + 6) % 7) + 1) / 7,
+      );
+      this.setVal(`${weekYear}-W${String(weekNo).padStart(2, '0')}`);
+      return;
+    }
+    this.setVal(value);
+  }
+
+  /** @returns {string|null} */
+  get value() {
+    return this.attrString('value');
+  }
+
+  /** @param {string} min */
+  set min(min) {
+    if (typeof min !== 'string')
+      throw new TypeError('TinyHtmlWeekInput: "min" must be a string (format: YYYY-Www).');
+    this.setAttr('min', min);
+  }
+
+  /** @returns {string|null} */
+  get min() {
+    return this.attrString('min');
+  }
+
+  /** @param {string} max */
+  set max(max) {
+    if (typeof max !== 'string')
+      throw new TypeError('TinyHtmlWeekInput: "max" must be a string (format: YYYY-Www).');
+    this.setAttr('max', max);
+  }
+
+  /** @returns {string|null} */
+  get max() {
+    return this.attrString('max');
+  }
+
+  /** @param {number} step */
+  set step(step) {
+    if (!Number.isInteger(step) || step < 1)
+      throw new TypeError('TinyHtmlWeekInput: "step" must be a positive integer.');
+    this.setAttr('step', String(step));
+  }
+
+  /** @returns {number|null} */
+  get step() {
+    return this.attrNumber('step');
+  }
+
+  /** @param {string} list */
+  set list(list) {
+    if (typeof list !== 'string')
+      throw new TypeError('TinyHtmlWeekInput: "list" must be a string (datalist id).');
+    this.setAttr('list', list);
+  }
+
+  /** @returns {string|null} */
+  get list() {
+    return this.attrString('list');
+  }
+
+  /** @param {string} autocomplete */
+  set autocomplete(autocomplete) {
+    if (typeof autocomplete !== 'string')
+      throw new TypeError('TinyHtmlWeekInput: "autocomplete" must be a string.');
+    this.setAttr('autocomplete', autocomplete);
+  }
+
+  /** @returns {string|null} */
+  get autocomplete() {
+    return this.attrString('autocomplete');
+  }
+}
+
+module.exports = TinyHtmlWeekInput;

package/dist/v1/libs/TinyHtml/input/date/TinyHtmlWeekInput.d.mts

@@ -0,0 +1,74 @@
+export default TinyHtmlWeekInput;
+/**
+ * TinyHtmlWeekInput is a helper class for managing `<input type="week">` elements.
+ * It provides getters and setters for all standard attributes, ensuring type safety
+ * and validation for each property.
+ *
+ * @example
+ * const weekInput = new TinyHtmlWeekInput({
+ *   value: '2023-W15',
+ *   min: '2023-W01',
+ *   max: '2023-W52',
+ *   step: 1,
+ *   required: true
+ * });
+ */
+declare class TinyHtmlWeekInput extends TinyHtmlInput {
+    /**
+     * Creates a new TinyHtmlWeekInput instance.
+     * @param {Object} config - Configuration object.
+     * @param {string} [config.value] - Initial value (`YYYY-Www` format).
+     * @param {string} [config.min] - Minimum allowed week (`YYYY-Www`).
+     * @param {string} [config.max] - Maximum allowed week (`YYYY-Www`).
+     * @param {number} [config.step] - Step interval in weeks.
+     * @param {string} [config.name] - The name of the input.
+     * @param {string} [config.placeholder] - Placeholder text.
+     * @param {string} [config.autocomplete] - Autocomplete hint (e.g., "on", "off").
+     * @param {string} [config.list] - ID of a `<datalist>`.
+     * @param {boolean} [config.readonly=false] - Whether the input is read-only.
+     * @param {boolean} [config.required=false] - Whether the input is required.
+     * @param {string|string[]|Set<string>} [config.tags=[]] - Initial CSS classes.
+     * @param {string} [config.mainClass=''] - Main CSS class.
+     * @throws {TypeError} If any attribute is of the wrong type.
+     */
+    constructor({ value, min, max, step, name, placeholder, autocomplete, list, readonly, required, tags, mainClass, }?: {
+        value?: string | undefined;
+        min?: string | undefined;
+        max?: string | undefined;
+        step?: number | undefined;
+        name?: string | undefined;
+        placeholder?: string | undefined;
+        autocomplete?: string | undefined;
+        list?: string | undefined;
+        readonly?: boolean | undefined;
+        required?: boolean | undefined;
+        tags?: string | string[] | Set<string> | undefined;
+        mainClass?: string | undefined;
+    });
+    /** @param {string|Date} value */
+    set value(value: string | Date);
+    /** @returns {string|null} */
+    get value(): string | null;
+    /** @param {string} min */
+    set min(min: string);
+    /** @returns {string|null} */
+    get min(): string | null;
+    /** @param {string} max */
+    set max(max: string);
+    /** @returns {string|null} */
+    get max(): string | null;
+    /** @param {number} step */
+    set step(step: number);
+    /** @returns {number|null} */
+    get step(): number | null;
+    /** @param {string} list */
+    set list(list: string);
+    /** @returns {string|null} */
+    get list(): string | null;
+    /** @param {string} autocomplete */
+    set autocomplete(autocomplete: string);
+    /** @returns {string|null} */
+    get autocomplete(): string | null;
+}
+import TinyHtmlInput from '../../TinyHtmlInput.mjs';
+//# sourceMappingURL=TinyHtmlWeekInput.d.mts.map

package/dist/v1/libs/TinyHtml/input/date/TinyHtmlWeekInput.mjs

@@ -0,0 +1,122 @@
+import TinyHtmlInput from '../../TinyHtmlInput.mjs';
+/**
+ * TinyHtmlWeekInput is a helper class for managing `<input type="week">` elements.
+ * It provides getters and setters for all standard attributes, ensuring type safety
+ * and validation for each property.
+ *
+ * @example
+ * const weekInput = new TinyHtmlWeekInput({
+ *   value: '2023-W15',
+ *   min: '2023-W01',
+ *   max: '2023-W52',
+ *   step: 1,
+ *   required: true
+ * });
+ */
+class TinyHtmlWeekInput extends TinyHtmlInput {
+    /**
+     * Creates a new TinyHtmlWeekInput instance.
+     * @param {Object} config - Configuration object.
+     * @param {string} [config.value] - Initial value (`YYYY-Www` format).
+     * @param {string} [config.min] - Minimum allowed week (`YYYY-Www`).
+     * @param {string} [config.max] - Maximum allowed week (`YYYY-Www`).
+     * @param {number} [config.step] - Step interval in weeks.
+     * @param {string} [config.name] - The name of the input.
+     * @param {string} [config.placeholder] - Placeholder text.
+     * @param {string} [config.autocomplete] - Autocomplete hint (e.g., "on", "off").
+     * @param {string} [config.list] - ID of a `<datalist>`.
+     * @param {boolean} [config.readonly=false] - Whether the input is read-only.
+     * @param {boolean} [config.required=false] - Whether the input is required.
+     * @param {string|string[]|Set<string>} [config.tags=[]] - Initial CSS classes.
+     * @param {string} [config.mainClass=''] - Main CSS class.
+     * @throws {TypeError} If any attribute is of the wrong type.
+     */
+    constructor({ value, min, max, step, name, placeholder, autocomplete, list, readonly = false, required = false, tags = [], mainClass = '', } = {}) {
+        super({ type: 'week', name, placeholder, tags, mainClass, readonly, required });
+        if (value !== undefined)
+            this.value = value;
+        if (min !== undefined)
+            this.min = min;
+        if (max !== undefined)
+            this.max = max;
+        if (step !== undefined)
+            this.step = step;
+        if (list !== undefined)
+            this.list = list;
+        if (autocomplete !== undefined)
+            this.autocomplete = autocomplete;
+    }
+    /** @param {string|Date} value */
+    set value(value) {
+        if (typeof value !== 'string' && !(value instanceof Date))
+            throw new TypeError('TinyHtmlWeekInput: "value" must be a string (format: YYYY-Www) or date.');
+        if (value instanceof Date) {
+            // ISO week number calculation
+            const temp = new Date(value.getTime());
+            temp.setHours(0, 0, 0, 0);
+            // Thursday in current week decides the year
+            temp.setDate(temp.getDate() + 3 - ((temp.getDay() + 6) % 7));
+            const weekYear = temp.getFullYear();
+            const week1 = new Date(weekYear, 0, 4);
+            const weekNo = Math.ceil(((temp.valueOf() - week1.valueOf()) / 86400000 + ((week1.getDay() + 6) % 7) + 1) / 7);
+            this.setVal(`${weekYear}-W${String(weekNo).padStart(2, '0')}`);
+            return;
+        }
+        this.setVal(value);
+    }
+    /** @returns {string|null} */
+    get value() {
+        return this.attrString('value');
+    }
+    /** @param {string} min */
+    set min(min) {
+        if (typeof min !== 'string')
+            throw new TypeError('TinyHtmlWeekInput: "min" must be a string (format: YYYY-Www).');
+        this.setAttr('min', min);
+    }
+    /** @returns {string|null} */
+    get min() {
+        return this.attrString('min');
+    }
+    /** @param {string} max */
+    set max(max) {
+        if (typeof max !== 'string')
+            throw new TypeError('TinyHtmlWeekInput: "max" must be a string (format: YYYY-Www).');
+        this.setAttr('max', max);
+    }
+    /** @returns {string|null} */
+    get max() {
+        return this.attrString('max');
+    }
+    /** @param {number} step */
+    set step(step) {
+        if (!Number.isInteger(step) || step < 1)
+            throw new TypeError('TinyHtmlWeekInput: "step" must be a positive integer.');
+        this.setAttr('step', String(step));
+    }
+    /** @returns {number|null} */
+    get step() {
+        return this.attrNumber('step');
+    }
+    /** @param {string} list */
+    set list(list) {
+        if (typeof list !== 'string')
+            throw new TypeError('TinyHtmlWeekInput: "list" must be a string (datalist id).');
+        this.setAttr('list', list);
+    }
+    /** @returns {string|null} */
+    get list() {
+        return this.attrString('list');
+    }
+    /** @param {string} autocomplete */
+    set autocomplete(autocomplete) {
+        if (typeof autocomplete !== 'string')
+            throw new TypeError('TinyHtmlWeekInput: "autocomplete" must be a string.');
+        this.setAttr('autocomplete', autocomplete);
+    }
+    /** @returns {string|null} */
+    get autocomplete() {
+        return this.attrString('autocomplete');
+    }
+}
+export default TinyHtmlWeekInput;

package/dist/v1/libs/TinyHtml/input/number/TinyHtmlNumberInput.cjs

@@ -0,0 +1,134 @@
+'use strict';
+
+var TinyHtmlInput = require('../../TinyHtmlInput.cjs');
+
+/**
+ * TinyHtmlNumberInput is a helper class for managing <input type="number"> elements.
+ * It provides typed getters and setters for standard number input attributes
+ * such as min, max, step, value, and more.
+ *
+ * @example
+ * const numberInput = new TinyHtmlNumberInput({
+ *   min: 0,
+ *   max: 100,
+ *   step: 5,
+ *   value: 10,
+ *   required: true
+ * });
+ */
+class TinyHtmlNumberInput extends TinyHtmlInput {
+  /**
+   * Creates a new TinyHtmlNumberInput instance.
+   * @param {Object} config - Configuration object.
+   * @param {number} [config.value] - Initial numeric value.
+   * @param {number} [config.min] - Minimum allowed value.
+   * @param {number} [config.max] - Maximum allowed value.
+   * @param {number} [config.step] - Step size.
+   * @param {string} [config.name] - Name of the control.
+   * @param {string} [config.placeholder] - Placeholder text.
+   * @param {string} [config.autocomplete] - Autocomplete hint (e.g., "on", "off", "email").
+   * @param {string} [config.list] - ID of a <datalist>.
+   * @param {boolean} [config.readonly=false] - Whether the input is read-only.
+   * @param {boolean} [config.required=false] - Whether the input is required.
+   * @param {string|string[]|Set<string>} [config.tags=[]] - Initial CSS classes.
+   * @param {string} [config.mainClass=''] - Main CSS class.
+   * @throws {TypeError} If any attribute is of the wrong type.
+   */
+  constructor({
+    value,
+    list,
+    min,
+    max,
+    step,
+    readonly = false,
+    required = false,
+    name,
+    placeholder,
+    autocomplete,
+    tags = [],
+    mainClass = '',
+  } = {}) {
+    super({ name, placeholder, type: 'number', tags, mainClass, readonly, required });
+
+    if (value !== undefined) this.value = value;
+    if (min !== undefined) this.min = min;
+    if (max !== undefined) this.max = max;
+    if (step !== undefined) this.step = step;
+    if (list !== undefined) this.list = list;
+    if (autocomplete !== undefined) this.autocomplete = autocomplete;
+  }
+
+  /** @param {number} value */
+  set value(value) {
+    if (typeof value !== 'number')
+      throw new TypeError('TinyHtmlNumberInput: "value" must be a number.');
+    this.setVal(value);
+  }
+
+  /** @returns {number} */
+  get value() {
+    return this.valNb();
+  }
+
+  /** @param {number} min */
+  set min(min) {
+    if (typeof min !== 'number')
+      throw new TypeError('TinyHtmlNumberInput: "min" must be a number.');
+    this.setAttr('min', String(min));
+  }
+
+  /** @returns {number|null} */
+  get min() {
+    return this.attrNumber('min');
+  }
+
+  /** @param {number} max */
+  set max(max) {
+    if (typeof max !== 'number')
+      throw new TypeError('TinyHtmlNumberInput: "max" must be a number.');
+    this.setAttr('max', String(max));
+  }
+
+  /** @returns {number|null} */
+  get max() {
+    return this.attrNumber('max');
+  }
+
+  /** @param {number} step */
+  set step(step) {
+    if (typeof step !== 'number')
+      throw new TypeError('TinyHtmlNumberInput: "step" must be a number.');
+    this.setAttr('step', String(step));
+  }
+
+  /** @returns {number|null} */
+  get step() {
+    return this.attrNumber('step');
+  }
+
+  /** @param {string} list */
+  set list(list) {
+    if (typeof list !== 'string')
+      throw new TypeError('TinyHtmlNumberInput: "list" must be a string (datalist id).');
+    this.setAttr('list', list);
+  }
+
+  /** @returns {string|null} */
+  get list() {
+    return this.attrString('list');
+  }
+
+  /** @param {string} autocomplete */
+  set autocomplete(autocomplete) {
+    if (typeof autocomplete !== 'string')
+      throw new TypeError('TinyHtmlNumberInput: "autocomplete" must be a string.');
+    this.setAttr('autocomplete', autocomplete);
+  }
+
+  /** @returns {string|null} */
+  get autocomplete() {
+    return this.attrString('autocomplete');
+  }
+}
+
+module.exports = TinyHtmlNumberInput;