tiny-essentials 1.24.0 → 1.24.1

package/dist/v1/libs/TinyHtml/TinyHtmlInput.mjs

@@ -0,0 +1,134 @@
+import TinyHtmlTemplate from './TinyHtmlTemplate.mjs';
+/**
+ * TinyHtmlInput is a helper class for managing <input> elements.
+ * It allows configuring all standard attributes such as type, value, placeholder,
+ * name, and form-related flags with validation.
+ *
+ * @example
+ * const input = new TinyHtmlInput({
+ *   type: 'text',
+ *   placeholder: 'Your name',
+ *   required: true
+ * });
+ *
+ * @extends TinyHtmlTemplate<HTMLInputElement>
+ */
+class TinyHtmlInput extends TinyHtmlTemplate {
+    /**
+     * Creates a new TinyHtmlInput instance.
+     * @param {Object} config - Configuration object.
+     * @param {string} [config.type="text"] - Input type (e.g., "text", "password", "email").
+     * @param {string} [config.placeholder] - Placeholder text.
+     * @param {string} [config.name] - Input name.
+     * @param {boolean} [config.disabled=false] - Whether input is disabled.
+     * @param {boolean} [config.readonly=false] - Whether input is readonly.
+     * @param {boolean} [config.required=false] - Whether input is required.
+     * @param {string} [config.form] - ID of a form element.
+     * @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({ type = 'text', placeholder, name, disabled = false, readonly = false, required = false, form, tags = [], mainClass = '', } = {}) {
+        super(document.createElement('input'), tags, mainClass);
+        this.type = type;
+        if (placeholder !== undefined)
+            this.placeholder = placeholder;
+        if (name !== undefined)
+            this.name = name;
+        this.disabled = disabled;
+        this.readonly = readonly;
+        this.required = required;
+        if (form !== undefined)
+            this.form = form;
+    }
+    /** @param {string} type */
+    set type(type) {
+        if (typeof type !== 'string' || !type.trim())
+            throw new TypeError('TinyHtmlInput: "type" must be a non-empty string.');
+        this.setAttr('type', type);
+    }
+    /** @returns {string|null} */
+    get type() {
+        return this.attrString('type');
+    }
+    /** @param {string} placeholder */
+    set placeholder(placeholder) {
+        if (typeof placeholder !== 'string')
+            throw new TypeError('TinyHtmlInput: "placeholder" must be a string.');
+        this.setAttr('placeholder', placeholder);
+    }
+    /** @returns {string|null} */
+    get placeholder() {
+        return this.attrString('placeholder');
+    }
+    /** @param {string} name */
+    set name(name) {
+        if (typeof name !== 'string')
+            throw new TypeError('TinyHtmlInput: "name" must be a string.');
+        this.setAttr('name', name);
+    }
+    /** @returns {string|null} */
+    get name() {
+        return this.attrString('name');
+    }
+    /** @param {boolean} disabled */
+    set disabled(disabled) {
+        if (typeof disabled !== 'boolean')
+            throw new TypeError('TinyHtmlInput: "disabled" must be a boolean.');
+        if (disabled)
+            this.addProp('disabled');
+        else
+            this.removeProp('disabled');
+    }
+    /** @returns {boolean} */
+    get disabled() {
+        return this.hasProp('disabled');
+    }
+    /** @param {boolean} readonly */
+    set readonly(readonly) {
+        if (typeof readonly !== 'boolean')
+            throw new TypeError('TinyHtmlInput: "readonly" must be a boolean.');
+        if (readonly)
+            this.addProp('readonly');
+        else
+            this.removeProp('readonly');
+    }
+    /** @returns {boolean} */
+    get readonly() {
+        return this.hasProp('readonly');
+    }
+    /** @param {boolean} required */
+    set required(required) {
+        if (typeof required !== 'boolean')
+            throw new TypeError('TinyHtmlInput: "required" must be a boolean.');
+        if (required)
+            this.addProp('required');
+        else
+            this.removeProp('required');
+    }
+    /** @returns {boolean} */
+    get required() {
+        return this.hasProp('required');
+    }
+    /** @param {string} form */
+    set form(form) {
+        if (typeof form !== 'string')
+            throw new TypeError('TinyHtmlInput: "form" must be a string.');
+        this.setAttr('form', form);
+    }
+    /** @returns {string|null} */
+    get form() {
+        return this.attrString('form');
+    }
+    /** @param {number} size */
+    set sizeEl(size) {
+        if (!Number.isInteger(size) || size < 1)
+            throw new TypeError('TinyHtmlUrlInput: "size" must be a positive integer.');
+        this.setAttr('size', size);
+    }
+    /** @returns {number|null} */
+    get sizeEl() {
+        return this.attrNumber('size');
+    }
+}
+export default TinyHtmlInput;

package/dist/v1/libs/TinyHtml/TinyHtmlLink.cjs

@@ -0,0 +1,282 @@
+'use strict';
+
+var TinyHtmlTemplate = require('./TinyHtmlTemplate.cjs');
+
+/**
+ * TinyHtmlLink is a lightweight helper class for managing <link> elements.
+ * It provides a strict API for configuring preload, stylesheets, icons,
+ * and other external resource references.
+ *
+ * @example
+ * const link = new TinyHtmlLink({
+ *   rel: 'stylesheet',
+ *   href: '/styles/main.css',
+ *   media: 'screen',
+ *   blocking: 'render',
+ * });
+ *
+ * document.head.appendChild(link.el);
+ *
+ * @extends TinyHtmlTemplate<HTMLLinkElement>
+ */
+class TinyHtmlLink extends TinyHtmlTemplate {
+  /**
+   * Creates a new TinyHtmlLink instance.
+   * @param {Object} config - Configuration object.
+   * @param {string} [config.as] - Type of content being loaded (valid only for preload/modulepreload).
+   * @param {'render'} [config.blocking] - Blocking behavior (only "render").
+   * @param {'anonymous'|'use-credentials'} [config.crossorigin] - CORS mode ("anonymous" or "use-credentials").
+   * @param {boolean} [config.disabled=false] - Whether the stylesheet is disabled (rel=stylesheet only).
+   * @param {'auto'|'high'|'low'} [config.fetchpriority="auto"] - Fetch priority ("high", "low", "auto").
+   * @param {string} [config.href] - URL of the linked resource.
+   * @param {string} [config.hreflang] - Language of the linked resource (RFC 5646).
+   * @param {string} [config.imagesizes] - Sizes attribute for preload images.
+   * @param {string} [config.imagesrcset] - Srcset attribute for preload images.
+   * @param {string} [config.integrity] - Subresource Integrity metadata.
+   * @param {string} [config.media="all"] - Media query (mainly for stylesheets).
+   * @param {string} [config.referrerpolicy] - Referrer policy ("no-referrer", etc.).
+   * @param {string} [config.rel] - Relationship (stylesheet, preload, icon, etc.).
+   * @param {string} [config.sizes] - Icon sizes.
+   * @param {string} [config.title] - Title (alternate stylesheet sets).
+   * @param {string} [config.type] - MIME type of the resource (e.g., "text/css").
+   * @param {string|string[]|Set<string>} [config.tags=[]] - Initial CSS classes.
+   * @param {string} [config.mainClass=""] - Main CSS class.
+   */
+  constructor({
+    as,
+    blocking,
+    crossorigin,
+    disabled = false,
+    fetchpriority = 'auto',
+    href,
+    hreflang,
+    imagesizes,
+    imagesrcset,
+    integrity,
+    media = 'all',
+    referrerpolicy,
+    rel,
+    sizes,
+    title,
+    type,
+    tags = [],
+    mainClass = '',
+  } = {}) {
+    super(document.createElement('link'), tags, mainClass);
+
+    if (rel !== undefined) this.rel = rel;
+    if (as !== undefined) this.as = as;
+    if (blocking !== undefined) this.blocking = blocking;
+    if (crossorigin !== undefined) this.crossorigin = crossorigin;
+    this.disabled = disabled;
+    if (fetchpriority !== undefined) this.fetchpriority = fetchpriority;
+    if (href !== undefined) this.href = href;
+    if (hreflang !== undefined) this.hreflang = hreflang;
+    if (imagesizes !== undefined) this.imagesizes = imagesizes;
+    if (imagesrcset !== undefined) this.imagesrcset = imagesrcset;
+    if (integrity !== undefined) this.integrity = integrity;
+    if (media !== undefined) this.media = media;
+    if (referrerpolicy !== undefined) this.referrerpolicy = referrerpolicy;
+    if (sizes !== undefined) this.sizes = sizes;
+    if (title !== undefined) this.title = title;
+    if (type !== undefined) this.type = type;
+  }
+
+  /** @param {string} rel */
+  set rel(rel) {
+    if (typeof rel !== 'string' || !rel.trim())
+      throw new TypeError('TinyHtmlLink: "rel" must be a non-empty string.');
+    this.setAttr('rel', rel.trim());
+  }
+  /** @returns {string|null} */
+  get rel() {
+    return this.attrString('rel');
+  }
+
+  /** @param {string} as */
+  set as(as) {
+    const validAs = [
+      'audio',
+      'document',
+      'embed',
+      'fetch',
+      'font',
+      'image',
+      'object',
+      'script',
+      'style',
+      'track',
+      'video',
+      'worker',
+    ];
+    if (!validAs.includes(as))
+      throw new TypeError(`TinyHtmlLink: "as" must be one of ${validAs.join(', ')}.`);
+    this.setAttr('as', as);
+  }
+  /** @returns {string|null} */
+  get as() {
+    return this.attrString('as');
+  }
+
+  /** @param {'render'} blocking */
+  set blocking(blocking) {
+    if (blocking !== 'render')
+      throw new TypeError('TinyHtmlLink: "blocking" only accepts "render".');
+    this.setAttr('blocking', blocking);
+  }
+  /** @returns {string|null} */
+  get blocking() {
+    return this.attrString('blocking');
+  }
+
+  /** @param {'anonymous'|'use-credentials'} crossorigin */
+  set crossorigin(crossorigin) {
+    const valid = ['anonymous', 'use-credentials'];
+    if (!valid.includes(crossorigin))
+      throw new TypeError(`TinyHtmlLink: "crossorigin" must be one of ${valid.join(', ')}.`);
+    this.setAttr('crossorigin', crossorigin);
+  }
+  /** @returns {string|null} */
+  get crossorigin() {
+    return this.attrString('crossorigin');
+  }
+
+  /** @param {boolean} disabled */
+  set disabled(disabled) {
+    if (typeof disabled !== 'boolean') throw new TypeError('"disabled" must be a boolean.');
+    if (disabled) this.addProp('disabled');
+    else this.removeProp('disabled');
+  }
+  /** @returns {boolean} */
+  get disabled() {
+    return this.hasProp('disabled');
+  }
+
+  /** @param {'auto'|'high'|'low'} fetchpriority */
+  set fetchpriority(fetchpriority) {
+    const valid = ['auto', 'high', 'low'];
+    if (!valid.includes(fetchpriority))
+      throw new TypeError(`TinyHtmlLink: "fetchpriority" must be one of ${valid.join(', ')}.`);
+    this.setAttr('fetchpriority', fetchpriority);
+  }
+  /** @returns {string|null} */
+  get fetchpriority() {
+    return this.attrString('fetchpriority');
+  }
+
+  /** @param {string} href */
+  set href(href) {
+    if (typeof href !== 'string') throw new TypeError('TinyHtmlLink: "href" must be a string.');
+    this.setAttr('href', href);
+  }
+  /** @returns {string|null} */
+  get href() {
+    return this.attrString('href');
+  }
+
+  /** @param {string} hreflang */
+  set hreflang(hreflang) {
+    if (typeof hreflang !== 'string')
+      throw new TypeError('TinyHtmlLink: "hreflang" must be a string.');
+    this.setAttr('hreflang', hreflang);
+  }
+  /** @returns {string|null} */
+  get hreflang() {
+    return this.attrString('hreflang');
+  }
+
+  /** @param {string} imagesizes */
+  set imagesizes(imagesizes) {
+    if (typeof imagesizes !== 'string')
+      throw new TypeError('TinyHtmlLink: "imagesizes" must be a string.');
+    this.setAttr('imagesizes', imagesizes);
+  }
+  /** @returns {string|null} */
+  get imagesizes() {
+    return this.attrString('imagesizes');
+  }
+
+  /** @param {string} imagesrcset */
+  set imagesrcset(imagesrcset) {
+    if (typeof imagesrcset !== 'string')
+      throw new TypeError('TinyHtmlLink: "imagesrcset" must be a string.');
+    this.setAttr('imagesrcset', imagesrcset);
+  }
+  /** @returns {string|null} */
+  get imagesrcset() {
+    return this.attrString('imagesrcset');
+  }
+
+  /** @param {string} integrity */
+  set integrity(integrity) {
+    if (typeof integrity !== 'string')
+      throw new TypeError('TinyHtmlLink: "integrity" must be a string.');
+    this.setAttr('integrity', integrity);
+  }
+  /** @returns {string|null} */
+  get integrity() {
+    return this.attrString('integrity');
+  }
+
+  /** @param {string} media */
+  set media(media) {
+    if (typeof media !== 'string') throw new TypeError('TinyHtmlLink: "media" must be a string.');
+    if (media.trim()) this.setAttr('media', media.trim());
+  }
+  /** @returns {string|null} */
+  get media() {
+    return this.attrString('media');
+  }
+
+  /** @param {string} referrerpolicy */
+  set referrerpolicy(referrerpolicy) {
+    const validPolicies = [
+      'no-referrer',
+      'no-referrer-when-downgrade',
+      'origin',
+      'origin-when-cross-origin',
+      'unsafe-url',
+    ];
+    if (!validPolicies.includes(referrerpolicy))
+      throw new TypeError(
+        `TinyHtmlLink: "referrerpolicy" must be one of ${validPolicies.join(', ')}.`,
+      );
+    this.setAttr('referrerpolicy', referrerpolicy);
+  }
+  /** @returns {string|null} */
+  get referrerpolicy() {
+    return this.attrString('referrerpolicy');
+  }
+
+  /** @param {string} sizes */
+  set sizes(sizes) {
+    if (typeof sizes !== 'string') throw new TypeError('TinyHtmlLink: "sizes" must be a string.');
+    this.setAttr('sizes', sizes);
+  }
+  /** @returns {string|null} */
+  get sizes() {
+    return this.attrString('sizes');
+  }
+
+  /** @param {string} title */
+  set title(title) {
+    if (typeof title !== 'string') throw new TypeError('TinyHtmlLink: "title" must be a string.');
+    this.setAttr('title', title);
+  }
+  /** @returns {string|null} */
+  get title() {
+    return this.attrString('title');
+  }
+
+  /** @param {string} type */
+  set type(type) {
+    if (typeof type !== 'string') throw new TypeError('TinyHtmlLink: "type" must be a string.');
+    this.setAttr('type', type);
+  }
+  /** @returns {string|null} */
+  get type() {
+    return this.attrString('type');
+  }
+}
+
+module.exports = TinyHtmlLink;

package/dist/v1/libs/TinyHtml/TinyHtmlLink.d.mts

@@ -0,0 +1,128 @@
+export default TinyHtmlLink;
+/**
+ * TinyHtmlLink is a lightweight helper class for managing <link> elements.
+ * It provides a strict API for configuring preload, stylesheets, icons,
+ * and other external resource references.
+ *
+ * @example
+ * const link = new TinyHtmlLink({
+ *   rel: 'stylesheet',
+ *   href: '/styles/main.css',
+ *   media: 'screen',
+ *   blocking: 'render',
+ * });
+ *
+ * document.head.appendChild(link.el);
+ *
+ * @extends TinyHtmlTemplate<HTMLLinkElement>
+ */
+declare class TinyHtmlLink extends TinyHtmlTemplate<HTMLLinkElement> {
+    /**
+     * Creates a new TinyHtmlLink instance.
+     * @param {Object} config - Configuration object.
+     * @param {string} [config.as] - Type of content being loaded (valid only for preload/modulepreload).
+     * @param {'render'} [config.blocking] - Blocking behavior (only "render").
+     * @param {'anonymous'|'use-credentials'} [config.crossorigin] - CORS mode ("anonymous" or "use-credentials").
+     * @param {boolean} [config.disabled=false] - Whether the stylesheet is disabled (rel=stylesheet only).
+     * @param {'auto'|'high'|'low'} [config.fetchpriority="auto"] - Fetch priority ("high", "low", "auto").
+     * @param {string} [config.href] - URL of the linked resource.
+     * @param {string} [config.hreflang] - Language of the linked resource (RFC 5646).
+     * @param {string} [config.imagesizes] - Sizes attribute for preload images.
+     * @param {string} [config.imagesrcset] - Srcset attribute for preload images.
+     * @param {string} [config.integrity] - Subresource Integrity metadata.
+     * @param {string} [config.media="all"] - Media query (mainly for stylesheets).
+     * @param {string} [config.referrerpolicy] - Referrer policy ("no-referrer", etc.).
+     * @param {string} [config.rel] - Relationship (stylesheet, preload, icon, etc.).
+     * @param {string} [config.sizes] - Icon sizes.
+     * @param {string} [config.title] - Title (alternate stylesheet sets).
+     * @param {string} [config.type] - MIME type of the resource (e.g., "text/css").
+     * @param {string|string[]|Set<string>} [config.tags=[]] - Initial CSS classes.
+     * @param {string} [config.mainClass=""] - Main CSS class.
+     */
+    constructor({ as, blocking, crossorigin, disabled, fetchpriority, href, hreflang, imagesizes, imagesrcset, integrity, media, referrerpolicy, rel, sizes, title, type, tags, mainClass, }?: {
+        as?: string | undefined;
+        blocking?: "render" | undefined;
+        crossorigin?: "anonymous" | "use-credentials" | undefined;
+        disabled?: boolean | undefined;
+        fetchpriority?: "auto" | "high" | "low" | undefined;
+        href?: string | undefined;
+        hreflang?: string | undefined;
+        imagesizes?: string | undefined;
+        imagesrcset?: string | undefined;
+        integrity?: string | undefined;
+        media?: string | undefined;
+        referrerpolicy?: string | undefined;
+        rel?: string | undefined;
+        sizes?: string | undefined;
+        title?: string | undefined;
+        type?: string | undefined;
+        tags?: string | string[] | Set<string> | undefined;
+        mainClass?: string | undefined;
+    });
+    /** @param {string} rel */
+    set rel(rel: string);
+    /** @returns {string|null} */
+    get rel(): string | null;
+    /** @param {string} as */
+    set as(as: string);
+    /** @returns {string|null} */
+    get as(): string | null;
+    /** @param {'render'} blocking */
+    set blocking(blocking: "render");
+    /** @returns {string|null} */
+    get blocking(): string | null;
+    /** @param {'anonymous'|'use-credentials'} crossorigin */
+    set crossorigin(crossorigin: "anonymous" | "use-credentials");
+    /** @returns {string|null} */
+    get crossorigin(): string | null;
+    /** @param {boolean} disabled */
+    set disabled(disabled: boolean);
+    /** @returns {boolean} */
+    get disabled(): boolean;
+    /** @param {'auto'|'high'|'low'} fetchpriority */
+    set fetchpriority(fetchpriority: "auto" | "high" | "low");
+    /** @returns {string|null} */
+    get fetchpriority(): string | null;
+    /** @param {string} href */
+    set href(href: string);
+    /** @returns {string|null} */
+    get href(): string | null;
+    /** @param {string} hreflang */
+    set hreflang(hreflang: string);
+    /** @returns {string|null} */
+    get hreflang(): string | null;
+    /** @param {string} imagesizes */
+    set imagesizes(imagesizes: string);
+    /** @returns {string|null} */
+    get imagesizes(): string | null;
+    /** @param {string} imagesrcset */
+    set imagesrcset(imagesrcset: string);
+    /** @returns {string|null} */
+    get imagesrcset(): string | null;
+    /** @param {string} integrity */
+    set integrity(integrity: string);
+    /** @returns {string|null} */
+    get integrity(): string | null;
+    /** @param {string} media */
+    set media(media: string);
+    /** @returns {string|null} */
+    get media(): string | null;
+    /** @param {string} referrerpolicy */
+    set referrerpolicy(referrerpolicy: string);
+    /** @returns {string|null} */
+    get referrerpolicy(): string | null;
+    /** @param {string} sizes */
+    set sizes(sizes: string);
+    /** @returns {string|null} */
+    get sizes(): string | null;
+    /** @param {string} title */
+    set title(title: string);
+    /** @returns {string|null} */
+    get title(): string | null;
+    /** @param {string} type */
+    set type(type: string);
+    /** @returns {string|null} */
+    get type(): string | null;
+}
+import TinyHtmlTemplate from './TinyHtmlTemplate.mjs';
+//# sourceMappingURL=TinyHtmlLink.d.mts.map