jj 2.5.0 → 2.6.0

package/lib/components.js

@@ -1,287 +0,0 @@
-var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
-    if (kind === "m") throw new TypeError("Private method is not writable");
-    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
-    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
-};
-var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
-    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
-};
-var _ShadowMaster_templateConfig, _ShadowMaster_stylesConfig, _ShadowMaster_normalizedConfig;
-import { hasProp, isA, isArr, isDef, isFn, isStr } from 'jty';
-import { JJHE } from './JJHE.js';
-import { cssToStyle } from './util.js';
-import { typeErr } from './internal.js';
-import { keb2cam } from './case.js';
-/**
- * Resolves a template configuration into a string suitable for Shadow DOM.
- *
- * Handles functions (sync/async), promises, strings, JJHE instances, and HTMLElements.
- *
- * @param templateConfig - The configuration to resolve.
- * @returns A promise resolving to the HTML string or undefined.
- * @throws {TypeError} If the resolved value is not a string, JJHE, or HTMLElement.
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Element/outerHTML | Element.outerHTML}
- */
-async function templatePromise(templateConfig) {
-    if (!isDef(templateConfig)) {
-        return undefined;
-    }
-    if (isFn(templateConfig)) {
-        templateConfig = await templateConfig();
-    }
-    templateConfig = await templateConfig;
-    if (isStr(templateConfig)) {
-        return templateConfig;
-    }
-    if (isA(templateConfig, JJHE)) {
-        return templateConfig.getHTML();
-    }
-    if (isA(templateConfig, HTMLElement)) {
-        return templateConfig.outerHTML;
-    }
-    throw new TypeError(`Expected template to be a string, JJHE, or HTMLElement. Got ${typeof templateConfig}`);
-}
-/**
- * Resolves a style configuration into a CSSStyleSheet.
- *
- * Handles functions (sync/async), promises, CSSStyleSheet instances, and strings.
- * Strings are converted to CSSStyleSheet using `cssToStyle`.
- *
- * @param styleConfig - The configuration to resolve.
- * @returns A promise resolving to a CSSStyleSheet.
- * @throws {TypeError} If the resolved value is not a string or CSSStyleSheet.
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet | CSSStyleSheet}
- */
-async function stylePromise(styleConfig) {
-    if (isFn(styleConfig)) {
-        styleConfig = await styleConfig();
-    }
-    styleConfig = await styleConfig;
-    if (isA(styleConfig, CSSStyleSheet)) {
-        return styleConfig;
-    }
-    if (isStr(styleConfig)) {
-        return await cssToStyle(styleConfig);
-    }
-    throw new TypeError(`Expected style to be a CSS string or CSSStyleSheet. Got ${typeof styleConfig}`);
-}
-/**
- * Maps an array of style configurations to an array of promises resolving to CSSStyleSheets.
- *
- * @param styleConfigs - Array of style configurations.
- * @returns Array of promises.
- */
-function stylePromises(styleConfigs) {
-    if (!isArr(styleConfigs)) {
-        return [];
-    }
-    return styleConfigs.map(stylePromise);
-}
-/**
- * Resolves both template and style configurations.
- *
- * @param templateConfig - The template configuration.
- * @param styleConfigs - The style configurations.
- * @returns A promise resolving to the final ShadowConfig.
- */
-async function resolveConfig(templateConfig, styleConfigs) {
-    const [template, ...styles] = await Promise.all([templatePromise(templateConfig), ...stylePromises(styleConfigs)]);
-    return { template, styles };
-}
-/**
- * Manages the resolution of Shadow DOM configuration (template and styles).
- *
- * Allows building up the configuration and resolving it lazily.
- *
- * @example
- * ```ts
- * const sm = ShadowMaster.create()
- *   .setTemplate('<div>Hello World</div>')
- *   .addStyles('div { color: red; }')
- *
- * class MyComponent extends HTMLElement {
- *   async connectedCallback() {
- *      // Resolves the config once and caches it
- *      const shadowConfig = await sm.getResolved()
- *      // ... init shadow root with shadowConfig
- *   }
- * }
- * ```
- */
-export class ShadowMaster {
-    /**
-     * Creates a new instance of ShadowMaster.
-     *
-     * @returns A new ShadowMaster instance.
-     */
-    static create() {
-        return new ShadowMaster();
-    }
-    constructor() {
-        _ShadowMaster_templateConfig.set(this, undefined);
-        _ShadowMaster_stylesConfig.set(this, []);
-        _ShadowMaster_normalizedConfig.set(this, undefined
-        /**
-         * Creates a new instance of ShadowMaster.
-         *
-         * @returns A new ShadowMaster instance.
-         */
-        );
-    }
-    /**
-     * Sets the template configuration.
-     *
-     * @param templateConfig - The template configuration.
-     * @returns The instance for chaining.
-     *
-     * @example
-     * ```ts
-     * // Accepts string, promise, or fetchHtml result
-     * sm.setTemplate(fetchHtml('./template.html'))
-     * ```
-     */
-    setTemplate(templateConfig) {
-        __classPrivateFieldSet(this, _ShadowMaster_templateConfig, templateConfig, "f");
-        return this;
-    }
-    /**
-     * Adds one or more style configurations.
-     *
-     * @param stylesConfig - Variable number of style configurations.
-     * @returns The instance for chaining.
-     *
-     * @example
-     * ```ts
-     * sm.addStyles(
-     *     'p { color: red; }',
-     *     fetchCss('./styles.css'),
-     *     () => fetchCss('../lazy-loaded-styles.css'),
-     * )
-     * ```
-     */
-    addStyles(...stylesConfig) {
-        __classPrivateFieldGet(this, _ShadowMaster_stylesConfig, "f").push(...stylesConfig);
-        return this;
-    }
-    /**
-     * Resolves the configuration to something that can be fed to `JJHE.initShadow()` function
-     *
-     * The result is cached, so subsequent calls return the same promise.
-     * Note: Any changes made to the ShadowMaster instance (via setTemplate/addStyles)
-     * after the first call to getResolved() will be ignored.
-     *
-     * @returns A promise resolving to the ShadowConfig.
-     */
-    async getResolved() {
-        if (!__classPrivateFieldGet(this, _ShadowMaster_normalizedConfig, "f")) {
-            __classPrivateFieldSet(this, _ShadowMaster_normalizedConfig, resolveConfig(__classPrivateFieldGet(this, _ShadowMaster_templateConfig, "f"), __classPrivateFieldGet(this, _ShadowMaster_stylesConfig, "f")), "f");
-        }
-        return await __classPrivateFieldGet(this, _ShadowMaster_normalizedConfig, "f");
-    }
-}
-_ShadowMaster_templateConfig = new WeakMap(), _ShadowMaster_stylesConfig = new WeakMap(), _ShadowMaster_normalizedConfig = new WeakMap();
-/**
- * A helper to bridge the attribute world (kebab-case) to the property world (camelCase).
- * It works in tandem with browser's `observedAttributes` feature which triggers
- * `attributeChangedCallback`.
- *
- * @remarks
- * Your custom component class MUST define `static observedAttributes[]` otherwise `attributeChangedCallback` won't trigger.
- * `observedAttributes` should contain kebab-based attribute names.
- *
- * @example
- * ```ts
- * class MyComponent extends HTMLElement {
- *     static observedAttributes = ['user-name', 'counter']
- *     userName = '' // Property MUST exist on the instance (or prototype setter)
- *     #counter = 0  // You can also use private properties together with getter/setters
- *
- *     attributeChangedCallback(name, oldValue, newValue) {
- *         attr2prop(this, name, oldValue, newValue)
- *     }
-
- *     get counter() {
- *         return this.#counter
- *     }
- *
- *     set counter(value) {
- *         this.#counter = value
- *         this.#render() // You can call your render function to update the DOM
- *     }
- *
- *     #render() {
- *         const shadow = JJHE.from(this).shadow
- *         if (shadow) {
- *             shadow.byId('user').setText(this.userName)
- *             shadow.byId('counter').setText(this.counter)
- *         }
- *     }
- * }
- * ```
- *
- * @param instance - A reference to the common component instance
- * @param name - kebab-case and in lower case exactly as it appears in `observedAttributes`.
- * @param oldValue - The previous value of the attribute.
- * @param newValue - The new value of the attribute.
- * @returns `true` if it tried to set the attribute; otherwise `false`.
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements#responding_to_attribute_changes | Responding to attribute changes}
- */
-export function attr2prop(instance, name, oldValue, newValue) {
-    if (!isA(instance, HTMLElement)) {
-        throw new TypeError(`Expected an HTMLElement or a custom element instance. Got ${instance} (${typeof instance})`);
-    }
-    // Called when observed attributes change.
-    if (oldValue !== newValue) {
-        const propName = keb2cam(name);
-        if (hasProp(instance, propName)) {
-            instance[propName] = newValue;
-            return true;
-        }
-    }
-    return false;
-}
-/**
- * Registers the custom element with the browser and waits till it is defined.
- *
- * @example
- * ```ts
- * class MyComponent extends HTMLElement {}
- * await registerComponent('my-component', MyComponent)
- * ```
- * Another convention is to have a `static async register()` function in the Custom Component.
- * ```ts
- * export class MyComponent extends HTMLElement {
- *     static async register() {
- *         return registerComponent('my-component', MyComponent)
- *     }
- * }
- * ```
- * That way, you can import multiple components and do a `Promise.all()` on all their `.register()`s.
- * ```ts
- * import { MyComponent, YourComponent, TheirComponent } ...
- * await Promise.all([
- *     MyComponent.register(),
- *     YourComponent.register(),
- *     TheirComponent.register(),
- * ])
- *
- * @throws {TypeError} If name is not a string or constructor is not a function
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/CustomElementRegistry/define | customElements.define}
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/CustomElementRegistry/whenDefined | customElements.whenDefined}
- */
-export async function registerComponent(name, constructor, options) {
-    if (!isStr(name)) {
-        throw typeErr('name', 'a string', name);
-    }
-    if (!isFn(constructor)) {
-        throw typeErr('constructor', 'a function', constructor);
-    }
-    if (!customElements.get(name)) {
-        customElements.define(name, constructor, options);
-        await customElements.whenDefined(name);
-    }
-}
-//# sourceMappingURL=components.js.map

package/lib/components.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"components.js","sourceRoot":"","sources":["../src/components.ts"],"names":[],"mappings":"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"}

package/lib/helpers.d.ts

@@ -1,159 +0,0 @@
-import { JJHE } from './JJHE.js';
-import { Wrappable } from './types.js';
-/**
- * Hyperscript helper to create JJHE instances.
- * The `h` function provides a concise way to create DOM wrappers with attributes and children,
- * similar to hyperscript helpers found in other libraries.
- *
- *
- * @remarks
- * It returns a `JJHE` instance which wraps the native HTMLElement.
- *
- * You may recognize it from other libraries:
- * - [React](https://react.dev/reference/react/createElement)
- * - [Vue](https://vuejs.org/guide/extras/render-function)
- * - [Hyperscript](https://github.com/hyperhype/hyperscript)
- * - [Angular](https://angular.dev/guide/components/programmatic-rendering)
- * - [Lit](https://lit.dev/docs/components/rendering/)
- *
- * This is not exactly a replacement, but it roughly follows the same idea.
- *
- * @example
- * ```ts
- * // Create a simple div
- * h('div', { id: 'app' }, 'Hello World')
- *
- * // Create a nested structure
- * h('ul', { class: 'list' },
- *   h('li', null, 'Item 1'),
- *   h('li', null, 'Item 2')
- * )
- * ```
- *
- * @param tagName - The HTML tag name.
- * @param attributes - Attributes to set on the element. Can be null or undefined.
- * @param children - Children to append (strings, nodes, or other JJHE instances).
- * @returns The created JJHE instance.
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Document/createElement | document.createElement}
- */
-export declare function h(tagName: string, attributes?: Record<string, string> | null, ...children: Wrappable[]): JJHE;
-/**
- * Creates a `<link>` element for prefetching or preloading resources.
- *
- * @remarks
- * This function validates the input arguments and returns a wrapped `JJHE` instance.
- * It does not append the element to the document.
- *
- * @param href - The URL of the resource.
- * @param rel - The relationship of the linked resource ('prefetch' or 'preload').
- * @param as - The type of content being loaded ('fetch' for HTML, 'style' for CSS, or 'script' for JavaScript files).
- * If it's not provided or set to a falsy value, it runs heuristics to find the best match from the href parameter.
- *
- * @returns The JJHE instance representing the link element. The `<link>` is accessible via `.ref`
- * @throws {TypeError} If `href` is not a string or URL.
- * @throws {RangeError} If `rel` or `as` are not valid values.
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preload | Link types: preload}
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/prefetch | Link types: prefetch}
- */
-export declare function createLinkPre(href: string | URL, rel: 'prefetch' | 'preload', as?: 'fetch' | 'style' | 'script'): JJHE;
-/**
- * Adds a `<link>` tag to the document head for prefetching or preloading resources.
- *
- * @remarks
- * This function helps in optimizing performance by telling the browser to fetch resources
- * that might be needed later (prefetch) or are needed immediately (preload).
- *
- * Please refer to {@link createLinkPre} for more details.
- *
- * @example
- * ```ts
- * // Preload a script
- * addLinkPre('https://example.com/script.js', 'preload', 'script')
- *
- * // Prefetch a future page's CSS
- * addLinkPre('/next-page.css', 'prefetch', 'style')
- * ```
- *
- * @param args - The arguments to be passed to {@link createLinkPre}.
- * @returns The JJHE instance representing the link element.
- * @throws {TypeError} If `href` is not a string or URL.
- * @throws {RangeError} If `rel` or `as` are not valid values.
- * @see {@link createLinkPre}
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preload | Link types: preload}
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/prefetch | Link types: prefetch}
- */
-export declare function addLinkPre(...args: Parameters<typeof createLinkPre>): JJHE<HTMLElement>;
-/**
- * Fetches a file and returns its contents as string.
- *
- * @remarks
- * This is a wrapper around the native `fetch` API that handles the response status check
- * and text extraction. It sets the `Accept` header based on the provided mime type.
- *
- * @example
- * ```ts
- * const text = await fetchText('https://example.com/data.txt')
- * ```
- *
- * @param url - The file location.
- * @param mime - The HTTP Request Accept header. Defaults to 'text/*'.
- * @returns The file contents as a string.
- * @throws {TypeError} If `mime` is not a string.
- * @throws {Error} If the fetch fails or the response status is not OK (200-299).
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API | Fetch API}
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Response/text | Response.text()}
- */
-export declare function fetchText(url: URL | string, mime?: string): Promise<string>;
-/**
- * Fetches the contents of a HTML file as string.
- *
- * @remarks
- * Useful for loading HTML templates dynamically.
- * You can use `import.meta.resolve('./relative-path-to.html')` to resolve paths relative to the current module.
- *
- * @example
- * ```ts
- * const template = await fetchHtml('./template.html')
- * ```
- *
- * @param url - The HTML file location.
- * @returns The file content as a string.
- * @throws {Error} If the response is not ok.
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types | MIME types}
- */
-export declare function fetchHtml(url: URL | string): Promise<string>;
-/**
- * Fetches the contents of a CSS file as string.
- *
- * @remarks
- * You can use `import.meta.resolve('./relative-path-to.css')` inside components to resolve relative paths.
- *
- * @example
- * ```ts
- * const css = await fetchCss('./style.css')
- * ```
- *
- * @param url - The CSS file location.
- * @returns The file content as a string.
- * @throws {Error} If the response is not ok.
- */
-export declare function fetchCss(url: URL | string): Promise<string>;
-/**
- * Fetches a CSS file and constructs a CSSStyleSheet.
- *
- * @remarks
- * This is particularly useful for Constructable Stylesheets, which can be shared across Shadow DOM boundaries.
- *
- * @example
- * ```ts
- * const sheet = await fetchStyle('./component.css')
- * shadowRoot.adoptedStyleSheets = [sheet]
- * ```
- *
- * @param url - The CSS file location.
- * @returns The CSSStyleSheet object constructed from the CSS contents.
- * @throws {Error} If the fetch fails.
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet | CSSStyleSheet}
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/ShadowRoot/adoptedStyleSheets | adoptedStyleSheets}
- */
-export declare function fetchStyle(url: URL | string): Promise<CSSStyleSheet>;

package/lib/helpers.js

@@ -1,233 +0,0 @@
-import { isA, isStr } from 'jty';
-import { JJHE } from './JJHE.js';
-import { cssToStyle, fileExt } from './util.js';
-import { typeErr, errMsg } from './internal.js';
-/**
- * Hyperscript helper to create JJHE instances.
- * The `h` function provides a concise way to create DOM wrappers with attributes and children,
- * similar to hyperscript helpers found in other libraries.
- *
- *
- * @remarks
- * It returns a `JJHE` instance which wraps the native HTMLElement.
- *
- * You may recognize it from other libraries:
- * - [React](https://react.dev/reference/react/createElement)
- * - [Vue](https://vuejs.org/guide/extras/render-function)
- * - [Hyperscript](https://github.com/hyperhype/hyperscript)
- * - [Angular](https://angular.dev/guide/components/programmatic-rendering)
- * - [Lit](https://lit.dev/docs/components/rendering/)
- *
- * This is not exactly a replacement, but it roughly follows the same idea.
- *
- * @example
- * ```ts
- * // Create a simple div
- * h('div', { id: 'app' }, 'Hello World')
- *
- * // Create a nested structure
- * h('ul', { class: 'list' },
- *   h('li', null, 'Item 1'),
- *   h('li', null, 'Item 2')
- * )
- * ```
- *
- * @param tagName - The HTML tag name.
- * @param attributes - Attributes to set on the element. Can be null or undefined.
- * @param children - Children to append (strings, nodes, or other JJHE instances).
- * @returns The created JJHE instance.
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Document/createElement | document.createElement}
- */
-export function h(tagName, attributes, ...children) {
-    const ret = JJHE.fromTag(tagName).append(...children);
-    if (attributes) {
-        ret.setAttr(attributes);
-    }
-    return ret;
-}
-/**
- * Tries to find the best match for the link.as attribute when it's omitted
- * @param href a relative, absolute, or URL resource
- * @returns a valid value for the link.as attribute
- * @throws {TypeError} if it cannot guess a valid value for the 'link.as' attribute
- */
-function linkAs(href) {
-    switch (fileExt(href)) {
-        case 'html':
-        case 'htm':
-        case 'md':
-            return 'fetch';
-        case 'css':
-            return 'style';
-        case 'js':
-        case 'mjs':
-        case 'cjs':
-            return 'script';
-        default:
-            throw new Error(`No 'as' attribute was specified and we failed to guess it from the URL: ${href}`);
-    }
-}
-/**
- * Creates a `<link>` element for prefetching or preloading resources.
- *
- * @remarks
- * This function validates the input arguments and returns a wrapped `JJHE` instance.
- * It does not append the element to the document.
- *
- * @param href - The URL of the resource.
- * @param rel - The relationship of the linked resource ('prefetch' or 'preload').
- * @param as - The type of content being loaded ('fetch' for HTML, 'style' for CSS, or 'script' for JavaScript files).
- * If it's not provided or set to a falsy value, it runs heuristics to find the best match from the href parameter.
- *
- * @returns The JJHE instance representing the link element. The `<link>` is accessible via `.ref`
- * @throws {TypeError} If `href` is not a string or URL.
- * @throws {RangeError} If `rel` or `as` are not valid values.
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preload | Link types: preload}
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/prefetch | Link types: prefetch}
- */
-export function createLinkPre(href, rel, as) {
-    if (!isStr(href)) {
-        if (!isA(href, URL)) {
-            throw typeErr('href', 'a string or URL', href);
-        }
-        href = href.toString();
-    }
-    if (!['prefetch', 'preload'].includes(rel)) {
-        throw new RangeError(errMsg('rel', `'prefetch' or 'preload'`, rel));
-    }
-    if (!as) {
-        as = linkAs(href);
-        if (!as) {
-            throw new Error(`Could not guess 'as' attribute from URL: ${href}`);
-        }
-    }
-    if (!['fetch', 'style', 'script'].includes(as)) {
-        throw new RangeError(errMsg('as', `'fetch', 'style', or 'script'`, as));
-    }
-    return JJHE.fromTag('link').setAttr({
-        href,
-        rel,
-        as,
-    });
-}
-/**
- * Adds a `<link>` tag to the document head for prefetching or preloading resources.
- *
- * @remarks
- * This function helps in optimizing performance by telling the browser to fetch resources
- * that might be needed later (prefetch) or are needed immediately (preload).
- *
- * Please refer to {@link createLinkPre} for more details.
- *
- * @example
- * ```ts
- * // Preload a script
- * addLinkPre('https://example.com/script.js', 'preload', 'script')
- *
- * // Prefetch a future page's CSS
- * addLinkPre('/next-page.css', 'prefetch', 'style')
- * ```
- *
- * @param args - The arguments to be passed to {@link createLinkPre}.
- * @returns The JJHE instance representing the link element.
- * @throws {TypeError} If `href` is not a string or URL.
- * @throws {RangeError} If `rel` or `as` are not valid values.
- * @see {@link createLinkPre}
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preload | Link types: preload}
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/prefetch | Link types: prefetch}
- */
-export function addLinkPre(...args) {
-    const link = createLinkPre(...args);
-    document.head.append(link.ref);
-    return link;
-}
-/**
- * Fetches a file and returns its contents as string.
- *
- * @remarks
- * This is a wrapper around the native `fetch` API that handles the response status check
- * and text extraction. It sets the `Accept` header based on the provided mime type.
- *
- * @example
- * ```ts
- * const text = await fetchText('https://example.com/data.txt')
- * ```
- *
- * @param url - The file location.
- * @param mime - The HTTP Request Accept header. Defaults to 'text/*'.
- * @returns The file contents as a string.
- * @throws {TypeError} If `mime` is not a string.
- * @throws {Error} If the fetch fails or the response status is not OK (200-299).
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API | Fetch API}
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Response/text | Response.text()}
- */
-export async function fetchText(url, mime = 'text/*') {
-    if (!isStr(mime)) {
-        throw new TypeError(`Expected a string mime like 'text/html' or 'text/css'. Got ${mime} (${typeof mime})`);
-    }
-    const response = await fetch(url, { headers: { Accept: mime } });
-    if (!response.ok) {
-        throw new Error(`GET ${url} failed: ${response.status} ${response.statusText}`);
-    }
-    return response.text();
-}
-/**
- * Fetches the contents of a HTML file as string.
- *
- * @remarks
- * Useful for loading HTML templates dynamically.
- * You can use `import.meta.resolve('./relative-path-to.html')` to resolve paths relative to the current module.
- *
- * @example
- * ```ts
- * const template = await fetchHtml('./template.html')
- * ```
- *
- * @param url - The HTML file location.
- * @returns The file content as a string.
- * @throws {Error} If the response is not ok.
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types | MIME types}
- */
-export async function fetchHtml(url) {
-    return await fetchText(url, 'text/html');
-}
-/**
- * Fetches the contents of a CSS file as string.
- *
- * @remarks
- * You can use `import.meta.resolve('./relative-path-to.css')` inside components to resolve relative paths.
- *
- * @example
- * ```ts
- * const css = await fetchCss('./style.css')
- * ```
- *
- * @param url - The CSS file location.
- * @returns The file content as a string.
- * @throws {Error} If the response is not ok.
- */
-export async function fetchCss(url) {
-    return await fetchText(url, 'text/css');
-}
-/**
- * Fetches a CSS file and constructs a CSSStyleSheet.
- *
- * @remarks
- * This is particularly useful for Constructable Stylesheets, which can be shared across Shadow DOM boundaries.
- *
- * @example
- * ```ts
- * const sheet = await fetchStyle('./component.css')
- * shadowRoot.adoptedStyleSheets = [sheet]
- * ```
- *
- * @param url - The CSS file location.
- * @returns The CSSStyleSheet object constructed from the CSS contents.
- * @throws {Error} If the fetch fails.
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet | CSSStyleSheet}
- * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/ShadowRoot/adoptedStyleSheets | adoptedStyleSheets}
- */
-export async function fetchStyle(url) {
-    return await cssToStyle(await fetchCss(url));
-}
-//# sourceMappingURL=helpers.js.map