@oscarpalmer/toretto 0.39.1 → 0.40.0

package/dist/html/{index.js → index.mjs}

@@ -1,4 +1,4 @@
-import { sanitizeNodes } from "./sanitize.js";
+import { sanitizeNodes } from "./sanitize.mjs";
 import { isPlainObject } from "@oscarpalmer/atoms/is";
 //#region src/html/index.ts
 function createHtml(value) {
@@ -38,7 +38,7 @@ function getTemplate(value, options) {
 	const element = EXPRESSION_ID.test(value) ? document.querySelector(`#${value}`) : null;
 	return createTemplate(element instanceof HTMLTemplateElement ? element : value, options);
 }
-var html = ((value, options) => {
+const html = ((value, options) => {
 	return getNodes(value, getOptions(options));
 });
 html.clear = () => {
@@ -64,11 +64,11 @@ html.remove = (template) => {
 function sanitize(value) {
 	return sanitizeNodes(Array.isArray(value) ? value : [value], 0);
 }
-var EXPRESSION_ID = /^[a-z][\w-]*$/i;
-var PARSE_TYPE_HTML = "text/html";
-var TEMPLATE_TAG = "template";
-var TEMPORARY_ELEMENT = "<toretto-temporary></toretto-temporary>";
-var parser;
-var templates = {};
+const EXPRESSION_ID = /^[a-z][\w-]*$/i;
+const PARSE_TYPE_HTML = "text/html";
+const TEMPLATE_TAG = "template";
+const TEMPORARY_ELEMENT = "<toretto-temporary></toretto-temporary>";
+let parser;
+let templates = {};
 //#endregion
 export { html, sanitize };

package/dist/html/sanitize.d.mts

@@ -0,0 +1,5 @@
+//#region src/html/sanitize.d.ts
+declare function sanitizeAttributes(element: Element, attributes: Attr[]): void;
+declare function sanitizeNodes(nodes: Node[], depth: number): Node[];
+//#endregion
+export { sanitizeAttributes, sanitizeNodes };

package/dist/html/{sanitize.js → sanitize.mjs}

@@ -1,5 +1,5 @@
-import { _isBadAttribute, _isEmptyNonBooleanAttribute, _isInvalidBooleanAttribute } from "../internal/attribute.js";
-import { setAttribute } from "../attribute/set.js";
+import { _isBadAttribute, _isEmptyNonBooleanAttribute, _isInvalidBooleanAttribute } from "../internal/attribute.mjs";
+import { setAttribute } from "../attribute/set.mjs";
 //#region src/html/sanitize.ts
 function handleElement(element, depth) {
 	if (depth === 0) {
@@ -56,7 +56,7 @@ function sanitizeNodes(nodes, depth) {
 	}
 	return nodes;
 }
-var COMMENT_HARMFUL = /<[/\w]/g;
-var REMOVE_SELECTOR = "script, toretto-temporary";
+const COMMENT_HARMFUL = /<[/\w]/g;
+const REMOVE_SELECTOR = "script, toretto-temporary";
 //#endregion
 export { sanitizeAttributes, sanitizeNodes };

package/dist/index.d.mts

@@ -0,0 +1,531 @@
+//#region src/touch.d.ts
+type SupporsTouch = {
+  /**
+   * Are touch events supported?
+   */
+  readonly value: boolean;
+  /**
+   * Are touch events supported?
+   */
+  get(): boolean;
+  /**
+   * Re-evaluate if touch events are supported
+   */
+  update(): boolean;
+};
+/**
+ * Does the device support touch events?
+ */
+declare const supportsTouch: SupporsTouch;
+//#endregion
+//#region src/models.d.ts
+/**
+ * Attribute for an element
+ */
+type Attribute = {
+  name: string;
+  value: unknown;
+};
+/**
+ * Event listener for custom events
+ */
+type CustomEventListener = (event: CustomEvent) => void;
+/**
+ * The position of an event
+ */
+type EventPosition = {
+  x: number;
+  y: number;
+};
+/**
+ * Event listener that can be removed
+ */
+type RemovableEventListener = () => void;
+/**
+ * Selector that be searched for
+ */
+type Selector = string | Node | Node[] | NodeList;
+/**
+ * Text direction for an element
+ */
+type TextDirection = 'ltr' | 'rtl';
+//#endregion
+//#region src/internal/attribute.d.ts
+/**
+ * List of boolean attributes
+ */
+declare const booleanAttributes: readonly string[];
+//#endregion
+//#region src/attribute/get.d.ts
+/**
+ * Get the value of a specific attribute from an element
+ * @param element Element to get attribute from
+ * @param name Attribute name
+ * @param parse Parse value? _(defaults to `true`)_
+ * @returns Attribute value _(or `undefined`)_
+ */
+declare function getAttribute(element: Element, name: `data-${string}`, parse?: boolean): unknown;
+/**
+ * Get the value of a specific attribute from an element
+ * @param element Element to get attribute from
+ * @param name Attribute name
+ * @returns Attribute value _(or `undefined`)_
+ */
+declare function getAttribute(element: Element, name: string): unknown;
+/**
+ * Get specific attributes from an element
+ * @param element Element to get attributes from
+ * @param names Attribute names
+ * @param parseData Parse data values? _(defaults to `true`)_
+ * @returns Object of named attributes
+ */
+declare function getAttributes<Key extends string>(element: Element, names: Key[], parseData?: boolean): Record<Key, unknown>;
+//#endregion
+//#region src/attribute/set.d.ts
+type DispatchedAttribute = 'checked' | 'open' | 'value';
+/**
+ * Set an attribute on an element
+ *
+ * _(Or remove it, if value is `null` or `undefined`)_
+ * @param element Element for attribute
+ * @param name Attribute name
+ * @param value Attribute value
+ * @param dispatch Dispatch event for attribute? _(defaults to `true`)_
+ */
+declare function setAttribute<Name extends DispatchedAttribute>(element: Element, name: Name, value?: unknown, dispatch?: boolean): void;
+/**
+ * Set an attribute on an element
+ *
+ * _(Or remove it, if value is `null` or `undefined`)_
+ * @param element Element for attribute
+ * @param name Attribute name
+ * @param value Attribute value
+ */
+declare function setAttribute(element: Element, name: string, value?: unknown): void;
+/**
+ * Set an attribute on an element
+ *
+ * _(Or remove it, if value is `null` or `undefined`)_
+ * @param element Element for attribute
+ * @param attribute Attribute to set
+ * @param dispatch Dispatch event for attribute? _(defaults to `true`)_
+ */
+declare function setAttribute(element: Element, attribute: Attr | Attribute, dispatch?: boolean): void;
+/**
+ * Set one or more attributes on an element
+ *
+ * _(Or remove them, if their value is `null` or `undefined`)_
+ * @param element Element for attributes
+ * @param attributes Attributes to set
+ * @param dispatch Dispatch events for relevant attributes? _(defaults to `true`)_
+ */
+declare function setAttributes(element: Element, attributes: Array<Attr | Attribute>, dispatch?: boolean): void;
+/**
+ * Set one or more attributes on an element
+ *
+ * _(Or remove them, if their value is `null` or `undefined`)_
+ * @param element Element for attributes
+ * @param attributes Attributes to set
+ * @param dispatch Dispatch events for relevant attributes? _(defaults to `true`)_
+ */
+declare function setAttributes(element: Element, attributes: Record<string, unknown>, dispatch?: boolean): void;
+//#endregion
+//#region src/attribute/index.d.ts
+/**
+ * Is the attribute considered bad and potentially harmful?
+ * @param attribute Attribute to check
+ * @returns `true` if attribute is considered bad
+ */
+declare function isBadAttribute(attribute: Attr | Attribute): boolean;
+/**
+ * Is the attribute considered bad and potentially harmful?
+ * @param name Attribute name
+ * @param value Attribute value
+ * @returns `true` if attribute is considered bad
+ */
+declare function isBadAttribute(name: string, value: string): boolean;
+/**
+ * Is the attribute a boolean attribute?
+ * @param name Attribute to check
+ * @returns `true` if attribute is a boolean attribute
+ */
+declare function isBooleanAttribute(attribute: Attr | Attribute): boolean;
+/**
+ * Is the attribute a boolean attribute?
+ * @param name Attribute name
+ * @returns `true` if attribute is a boolean attribute
+ */
+declare function isBooleanAttribute(name: string): boolean;
+/**
+ * Is the attribute empty and not a boolean attribute?
+ * @param attribute Attribute to check
+ * @returns `true` if attribute is empty and not a boolean attribute
+ */
+declare function isEmptyNonBooleanAttribute(attribute: Attr | Attribute): boolean;
+/**
+ * Is the attribute empty and not a boolean attribute?
+ * @param name Attribute name
+ * @param value Attribute value
+ * @returns `true` if attribute is empty and not a boolean attribute
+ */
+declare function isEmptyNonBooleanAttribute(name: string, value: string): boolean;
+/**
+ * Is the attribute an invalid boolean attribute?
+ *
+ * _(I.e., its value is not empty or the same as its name)_
+ * @param attribute Attribute to check
+ * @returns `true` if attribute is an invalid boolean attribute
+ */
+declare function isInvalidBooleanAttribute(attribute: Attr | Attribute): boolean;
+/**
+ * Is the attribute an invalid boolean attribute?
+ *
+ * _(I.e., its value is not empty or the same as its name)_
+ * @param name Attribute name
+ * @param value Attribute value
+ * @returns `true` if attribute is an invalid boolean attribute
+ */
+declare function isInvalidBooleanAttribute(name: string, value: string): boolean;
+//#endregion
+//#region node_modules/@oscarpalmer/atoms/dist/index.d.mts
+/**
+ * A generic object
+ */
+type PlainObject = Record<PropertyKey, unknown>;
+/**
+ * A primitive value
+ *
+ * _(Thanks, type-fest!)_
+ */
+//#endregion
+//#region src/data.d.ts
+/**
+ * Get a keyed data value from an element
+ * @param element Element to get data from
+ * @param key Data key
+ * @param parse Parse values? _(defaults to `true`)_
+ * @returns Data value
+ */
+declare function getData(element: Element, key: string, parse?: boolean): unknown;
+/**
+ * Get keyed data values from an element
+ * @param element Element to get data from
+ * @param keys Keys of the data values to get
+ * @param parse Parse values? _(defaults to `true`)_
+ * @returns Keyed data values
+ */
+declare function getData<Key extends string>(element: Element, keys: Key[], parse?: boolean): Record<Key, unknown>;
+/**
+ * Set data values on an element
+ * @param element Element to set data on
+ * @param data Data to set
+ */
+declare function setData(element: Element, data: PlainObject): void;
+/**
+ * Set a data value on an element
+ * @param element Element to set data on
+ * @param key Data key
+ * @param value Data value
+ */
+declare function setData(element: Element, key: string, value: unknown): void;
+//#endregion
+//#region src/event/index.d.ts
+/**
+ * Dispatch an event for a target
+ * @param target Event target
+ * @param type Type of event
+ * @param options Options for event _(bubbles and is cancelable by default)_
+ */
+declare function dispatch<Type extends keyof HTMLElementEventMap>(target: EventTarget, type: Type, options?: CustomEventInit): void;
+/**
+ * Dispatch an event for a target
+ * @param target Event target
+ * @param type Type of event
+ * @param options Options for event _(bubbles and is cancelable by default)_
+ */
+declare function dispatch(target: EventTarget, type: string, options?: CustomEventInit): void;
+/**
+ * Get the X- and Y-coordinates from a pointer event
+ * @param event Pointer event
+ * @returns X- and Y-coordinates
+ */
+declare function getPosition(event: MouseEvent | TouchEvent): EventPosition | undefined;
+/**
+ * Remove an event listener
+ * @param target Event target
+ * @param type Type of event
+ * @param listener Event listener
+ * @param options Options for event
+ */
+declare function off(target: EventTarget, type: keyof HTMLElementEventMap, listener: EventListener | CustomEventListener, options?: EventListenerOptions): void;
+/**
+ * Remove an event listener
+ * @param target Event target
+ * @param type Type of event
+ * @param listener Event listener
+ * @param options Options for event
+ */
+declare function off(target: EventTarget, type: string, listener: EventListener | CustomEventListener, options?: EventListenerOptions): void;
+/**
+ * Add an event listener
+ * @param target Event target
+ * @param type Type of event
+ * @param listener Event listener
+ * @param options Options for event _(passive by default)_
+ */
+declare function on<Type extends keyof HTMLElementEventMap>(target: EventTarget, type: Type, listener: (event: HTMLElementEventMap[Type]) => void, options?: AddEventListenerOptions): RemovableEventListener;
+/**
+ * Add an event listener
+ * @param target Event target
+ * @param type Type of event
+ * @param listener Event listener
+ * @param options Options for event _(passive by default)_
+ */
+declare function on(target: EventTarget, type: string, listener: EventListener | CustomEventListener, options?: AddEventListenerOptions): RemovableEventListener;
+//#endregion
+//#region src/find/relative.d.ts
+/**
+ * Find the closest ancestor element that matches the tag name
+ *
+ * - If no match is found, `null` is returned
+ * - _(If you want to search upwards, downwards, and sideways, use {@link findRelatives})_
+ * @param origin Origin to start from
+ * @param tagName Tag name to match
+ * @returns Found ancestor or `null`
+ */
+declare function findAncestor<TagName extends keyof HTMLElementTagNameMap>(origin: Element | Event | EventTarget, tagName: TagName): HTMLElementTagNameMap[TagName] | null;
+/**
+ * Find the closest ancestor element that matches the selector _(string or callback)_
+ *
+ * - If no match is found, `null` is returned
+ * - _(If you want to search upwards, downwards, and sideways, use {@link findRelatives})_
+ * @param origin Origin to start from
+ * @param selector Selector to match
+ * @returns Found ancestor or `null`
+ */
+declare function findAncestor(origin: Element | Event | EventTarget, selector: string | ((element: Element) => boolean)): Element | null;
+/**
+ * Finds the closest elements to the origin element that matches the tag name
+ *
+ * Traverses up, down, and sideways in the _DOM_-tree. _(If you only want to traverse up, use {@link findAncestor})_
+ * @param origin Element to start from
+ * @param tagName Tag name to match
+ * @param context Context to search within
+ * @returns Found elements
+ */
+declare function findRelatives<TagName extends keyof HTMLElementTagNameMap>(origin: Element, tagName: TagName, context?: Document | Element): HTMLElementTagNameMap[TagName][];
+/**
+ * Finds the closest elements to the origin element that matches the selector
+ *
+ * Traverses up, down, and sideways in the _DOM_-tree. _(If you only want to traverse up, use {@link findAncestor})_
+ * @param origin Element to start from
+ * @param selector Selector to match
+ * @param context Context to search within
+ * @returns Found elements
+ */
+declare function findRelatives(origin: Element, selector: string, context?: Document | Element): Element[];
+/**
+ * Get the distance between two elements _(i.e., the amount of nodes of between them)_
+ * @param origin Origin element
+ * @param target Target element
+ * @returns Distance between elements, or `-1` if distance cannot be calculated
+ */
+declare function getDistance(origin: Element, target: Element): number;
+//#endregion
+//#region src/find/index.d.ts
+/**
+ * Find the first element that matches the tag name
+ * @param tagName Tag name of element to find
+ * @param context Context to search within _(defaults to `document`)_
+ * @returns Found element or `null`
+ */
+declare function findElement<TagName extends keyof HTMLElementTagNameMap>(tagName: TagName, context?: Selector | null): HTMLElementTagNameMap[TagName] | null;
+/**
+ * Find the first element that matches the selector
+ * @param selector Selector to find element for
+ * @param context Context to search within _(defaults to `document`)_
+ * @returns Found element or `null`
+ */
+declare function findElement(selector: string, context?: Selector | null): Element | null;
+/**
+ * Find elements that match the selector
+ * @param tagName tagName to find elements for
+ * @param context Context to search within _(defaults to `document`)_
+ * @returns Found elements
+ */
+declare function findElements(tagName: keyof HTMLElementTagNameMap, context?: Selector | null): HTMLElementTagNameMap[typeof tagName][];
+/**
+ * Find elements that match the selector
+ * @param selector Selector to find elements for
+ * @param context Context to search within _(defaults to `document`)_
+ * @returns Found elements
+ */
+declare function findElements(selector: Selector, context?: Selector | null): Element[];
+/**
+ * Get the most specific element under the pointer
+ *
+ * - Ignores elements with `pointer-events: none` and `visibility: hidden`
+ * - _(If `skipIgnore` is `true`, no elements are ignored)_
+ * @param skipIgnore Skip ignored elements?
+ * @returns Found element or `null`
+ */
+declare function getElementUnderPointer(skipIgnore?: boolean): Element | null;
+//#endregion
+//#region src/focusable.d.ts
+/**
+ * Get a list of focusable elements within a parent element
+ * @param parent Parent element
+ * @returns Focusable elements
+ */
+declare function getFocusable(parent: Element): Element[];
+/**
+ * Get a list of tabbable elements within a parent element
+ * @param parent Parent element
+ * @returns Tabbable elements
+ */
+declare function getTabbable(parent: Element): Element[];
+/**
+ * Is the element focusable?
+ * @param element Element to check
+ * @returns `true` if focusable, otherwise `false`
+ */
+declare function isFocusable(element: Element): boolean;
+/**
+ * Is the element tabbable?
+ * @param element Element to check
+ * @returns `true` if tabbable, otherwise `false`
+ */
+declare function isTabbable(element: Element): boolean;
+//#endregion
+//#region src/html/index.d.ts
+type Html = {
+  /**
+   * Create nodes from an HTML string or a template element
+   * @param value HTML string or id for a template element
+   * @param options Options for creating nodes
+   * @returns Created nodes
+   */
+  (value: string, options?: HtmlOptions): Node[];
+  /**
+   * Create nodes from a template element
+   * @param template Template element
+   * @param options Options for creating nodes
+   * @returns Created nodes
+   */
+  (template: HTMLTemplateElement, options?: HtmlOptions): Node[];
+  /**
+   * Clear cache of template elements
+   */
+  clear(): void;
+  /**
+   * Remove cached template element for an HTML string or id
+   * @param template HTML string or id for a template element
+   */
+  remove(template: string): void;
+};
+type HtmlOptions = {
+  /**
+   * Cache template element for the HTML string? _(defaults to `true`)_
+   */
+  cache?: boolean;
+};
+declare const html: Html;
+/**
+ * Sanitize one or more nodes, recursively
+ * @param value Node or nodes to sanitize
+ * @param options Sanitization options
+ * @returns Sanitized nodes
+ */
+declare function sanitize(value: Node | Node[]): Node[];
+//#endregion
+//#region src/internal/is.d.ts
+/**
+ * Is the value an event target?
+ * @param value Value to check
+ * @returns `true` if it's an event target, otherwise `false`
+ */
+declare function isEventTarget(value: unknown): value is EventTarget;
+/**
+ * Is the value an HTML or SVG element?
+ * @param value Value to check
+ * @returns `true` if it's an HTML or SVG element, otherwise `false`
+ */
+declare function isHTMLOrSVGElement(value: unknown): value is HTMLElement | SVGElement;
+//#endregion
+//#region src/is.d.ts
+/**
+ * Is the value a child node?
+ * @param value Value to check
+ * @returns `true` if it's a child node, otherwise `false`
+ */
+declare function isChildNode(value: unknown): value is ChildNode;
+/**
+ * Is the node inside a document?
+ * @param node Node to check
+ * @returns `true` if it's inside a document, otherwise `false`
+ */
+declare function isInDocument(node: Node): boolean;
+/**
+ * Is the node inside a specific document?
+ * @param node Node to check
+ * @param document Document to check within
+ * @returns `true` if it's inside the document, otherwise `false`
+ */
+declare function isInDocument(node: Node, document: Document): boolean;
+//#endregion
+//#region src/style.d.ts
+type StyleToggler = {
+  /**
+   * Set the provided styles on the element
+   */
+  set(): void;
+  /**
+   * Remove the provided styles from the element _(and sets any previous styles)_
+   */
+  remove(): void;
+};
+/**
+ * Get a style from an element
+ * @param element Element to get the style from
+ * @param property Style name
+ * @param computed Get the computed style? _(defaults to `false`)_
+ * @returns Style value
+ */
+declare function getStyle(element: Element, property: keyof CSSStyleDeclaration, computed?: boolean): string | undefined;
+/**
+ * Get styles from an element
+ * @param element Element to get the styles from
+ * @param properties Styles to get
+ * @param computed Get the computed styles? _(defaults to `false`)_
+ * @returns Style values
+ */
+declare function getStyles<Property extends keyof CSSStyleDeclaration>(element: Element, properties: Property[], computed?: boolean): Record<Property, string | undefined>;
+/**
+ * Get the text direction of an element
+ * @param element Element to get the text direction from
+ * @param computed Get the computed text direction? _(defaults to `false`)_
+ * @returns Text direction
+ */
+declare function getTextDirection(element: Element, computed?: boolean): TextDirection;
+/**
+ * Set a style on an element
+ * @param element Element to set the style on
+ * @param property Style name
+ * @param value Style value
+ */
+declare function setStyle(element: Element, property: keyof CSSStyleDeclaration, value?: string): void;
+/**
+ * Set styles on an element
+ * @param element Element to set the styles on
+ * @param styles Styles to set
+ */
+declare function setStyles(element: Element, styles: Partial<CSSStyleDeclaration>): void;
+/**
+ * Toggle styles for an element
+ * @param element Element to style
+ * @param styles Styles to be set or removed
+ * @returns Style toggler
+ */
+declare function toggleStyles(element: Element, styles: Partial<CSSStyleDeclaration>): StyleToggler;
+//#endregion
+export { findElement as $, findElement, findElements as $$, findElements, Attribute, CustomEventListener, EventPosition, RemovableEventListener, Selector, StyleToggler, TextDirection, booleanAttributes, dispatch, findAncestor, findRelatives, getAttribute, getAttributes, getData, getDistance, getElementUnderPointer, getFocusable, getPosition, getStyle, getStyles, getTabbable, getTextDirection, html, isBadAttribute, isBooleanAttribute, isChildNode, isEmptyNonBooleanAttribute, isEventTarget, isFocusable, isHTMLOrSVGElement, isInDocument, isInvalidBooleanAttribute, isTabbable, off, on, sanitize, setAttribute, setAttributes, setData, setStyle, setStyles, supportsTouch, toggleStyles };