ZIP Imports: Added API examples, finished testing

[bookstack] / resources / js / wysiwyg / utils / dom.ts

diff --git a/resources/js/wysiwyg/utils/dom.ts b/resources/js/wysiwyg/utils/dom.ts
index dc0872e89c81c8c82d39f7f3f7ad8f5c7e1e3be8..8bacd100224f9daff21b6665332312e84dc58e44 100644 (file)
--- a/resources/js/wysiwyg/utils/dom.ts
+++ b/resources/js/wysiwyg/utils/dom.ts
@@ -21,4 +21,79 @@ export function el(tag: string, attrs: Record<string, string | null> = {}, child
 export function htmlToDom(html: string): Document {
     const parser = new DOMParser();
     return parser.parseFromString(html, 'text/html');
+}
+
+export function formatSizeValue(size: number | string, defaultSuffix: string = 'px'): string {
+    if (typeof size === 'number' || /^-?\d+$/.test(size)) {
+        return `${size}${defaultSuffix}`;
+    }
+
+    return size;
+}
+
+export function sizeToPixels(size: string): number {
+    if (/^-?\d+$/.test(size)) {
+        return Number(size);
+    }
+
+    if (/^-?\d+\.\d+$/.test(size)) {
+        return Math.round(Number(size));
+    }
+
+    if (/^-?\d+px\s*$/.test(size)) {
+        return Number(size.trim().replace('px', ''));
+    }
+
+    return 0;
+}
+
+export type StyleMap = Map<string, string>;
+
+/**
+ * Creates a map from an element's styles.
+ * Uses direct attribute value string handling since attempting to iterate
+ * over .style will expand out any shorthand properties (like 'padding')
+ * rather than being representative of the actual properties set.
+ */
+export function extractStyleMapFromElement(element: HTMLElement): StyleMap {
+    const styleText= element.getAttribute('style') || '';
+    return styleStringToStyleMap(styleText);
+}
+
+/**
+ * Convert string-formatted styles into a StyleMap.
+ */
+export function styleStringToStyleMap(styleText: string): StyleMap {
+    const map: StyleMap = new Map();
+
+    const rules = styleText.split(';');
+    for (const rule of rules) {
+        const [name, value] = rule.split(':');
+        if (!name || !value) {
+            continue;
+        }
+
+        map.set(name.trim().toLowerCase(), value.trim());
+    }
+
+    return map;
+}
+
+/**
+ * Convert a StyleMap into inline string style text.
+ */
+export function styleMapToStyleString(map: StyleMap): string {
+    const parts = [];
+    for (const [style, value] of map.entries()) {
+        parts.push(`${style}:${value}`);
+    }
+    return parts.join(';');
+}
+
+export function setOrRemoveAttribute(element: HTMLElement, name: string, value: string|null|undefined) {
+    if (value) {
+        element.setAttribute(name, value);
+    } else {
+        element.removeAttribute(name);
+    }
 }
\ No newline at end of file