@lionrapid/core 0.2.0 → 0.3.0-beta.0

package/dist/browser/lionrapid.umd.js

@@ -38,7 +38,6 @@ __export(index_exports, {
   CacheStorageRepository: () => CacheStorageRepository,
   Colors: () => Colors,
   ContentValidator: () => ContentValidator,
-  DefaultStyleMapper: () => DefaultStyleMapper,
   EventEmitter: () => EventEmitter,
   HTMLSerializer: () => HTMLSerializer,
   HandlerChain: () => HandlerChain,
@@ -57,7 +56,9 @@ __export(index_exports, {
   TranslationLockedError: () => TranslationLockedError,
   TranslationNotFoundError: () => TranslationNotFoundError,
   VERSION: () => VERSION,
+  VOID_TAGS: () => VOID_TAGS,
   createPackageLogger: () => createPackageLogger,
+  extractTagName: () => extractTagName,
   isClientError: () => isClientError,
   isRetryableError: () => isRetryableError,
   isTranslationError: () => isTranslationError,
@@ -65,7 +66,9 @@ __export(index_exports, {
   measure: () => measure,
   parseKeyPath: () => parseKeyPath,
   prepareTranslationRequest: () => prepareTranslationRequest,
-  resolveNestedKey: () => resolveNestedKey
+  readRawStyle: () => readRawStyle,
+  resolveNestedKey: () => resolveNestedKey,
+  serializeOpeningTag: () => serializeOpeningTag
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -2225,153 +2228,51 @@ var NetworkHandler = class {
   }
 };
 
-// src/content/safe-href.ts
-var SAFE_SCHEME = /^[a-z][a-z0-9+.-]*:/i;
-var ALLOWED_SCHEMES = /* @__PURE__ */ new Set(["http:", "https:", "mailto:", "tel:", "sms:"]);
-function safeHref(href) {
-  if (!href) return "#";
-  const trimmed = href.trim();
-  if (!trimmed) return "#";
-  if (trimmed.startsWith("//")) {
-    return "#";
-  }
-  if (trimmed.startsWith("/") || trimmed.startsWith("?") || trimmed.startsWith("#") || trimmed.startsWith("./") || trimmed.startsWith("../")) {
-    return trimmed;
-  }
-  const schemeMatch = SAFE_SCHEME.exec(trimmed);
-  if (schemeMatch) {
-    const scheme = schemeMatch[0].toLowerCase();
-    return ALLOWED_SCHEMES.has(scheme) ? trimmed : "#";
-  }
-  return trimmed;
+// src/content/canonical-tag.ts
+var VOID_TAGS = /* @__PURE__ */ new Set([
+  "area",
+  "base",
+  "br",
+  "col",
+  "embed",
+  "hr",
+  "img",
+  "input",
+  "link",
+  "meta",
+  "param",
+  "source",
+  "track",
+  "wbr"
+]);
+function escapeAttrValue(value) {
+  return value.replace(/"/g, """);
 }
-
-// src/content/style-mapper/DefaultStyleMapper.ts
-var DefaultStyleMapper = class {
-  constructor() {
-    /**
-     * Element → Style mapping
-     * Maps HTML element names to their style property
-     */
-    __publicField(this, "elementToStyles", {
-      b: "bold",
-      strong: "bold",
-      i: "italic",
-      em: "italic",
-      u: "underline",
-      s: "strikethrough",
-      del: "strikethrough",
-      strike: "strikethrough",
-      code: "code",
-      mark: "highlight",
-      sub: "subscript",
-      sup: "superscript"
-    });
-    /**
-     * Style → Element mapping (reverse)
-     * Uses simple, familiar elements for developer convenience
-     * Also accepts element names directly (strong, em, etc.)
-     */
-    __publicField(this, "styleToElement", {
-      // Semantic style names → simple elements
-      bold: "b",
-      italic: "i",
-      underline: "u",
-      strikethrough: "s",
-      code: "code",
-      highlight: "mark",
-      subscript: "sub",
-      superscript: "sup",
-      // Element names (for servers that store styles as element names)
-      strong: "b",
-      b: "b",
-      em: "i",
-      i: "i",
-      u: "u",
-      s: "s",
-      del: "s",
-      strike: "s",
-      mark: "mark",
-      sub: "sub",
-      sup: "sup"
-    });
-  }
-  /**
-   * Convert HTML element to style properties
-   *
-   * @param element - Tag name (e.g., "b", "a", "strong")
-   * @param attrs - Element attributes (e.g., { href: "/url" })
-   * @returns Array of style strings
-   */
-  mapElementToStyles(element, attrs) {
-    const styles = [];
-    const tag = element.toLowerCase();
-    const mappedStyle = this.elementToStyles[tag];
-    if (mappedStyle) {
-      styles.push(mappedStyle);
-    }
-    if (tag === "a" && attrs.href) {
-      styles.push(`hyperlink:${attrs.href}`);
-    }
-    return styles;
-  }
-  /**
-   * Convert style properties to HTML element
-   *
-   * Priority order:
-   * 1. Hyperlink (becomes wrapper element with href)
-   * 2. First recognized style property
-   * 3. Fallback to span
-   *
-   * @param styles - Array of style strings
-   * @returns Element info for serialization
-   */
-  mapStylesToElement(styles) {
-    for (const style of styles) {
-      if (style.startsWith("hyperlink:")) {
-        return {
-          element: "a",
-          attrs: { href: safeHref(style.slice("hyperlink:".length)) }
-        };
-      }
-    }
-    for (const style of styles) {
-      const element = this.styleToElement[style];
-      if (element) {
-        return {
-          element,
-          attrs: {}
-        };
-      }
-    }
-    return { element: "span", attrs: {} };
+function serializeOpeningTag(tagName, attrs) {
+  const tag = tagName.toLowerCase();
+  let result = `<${tag}`;
+  for (const [name, value] of Object.entries(attrs)) {
+    result += ` ${name.toLowerCase()}="${escapeAttrValue(value)}"`;
+  }
+  result += ">";
+  return result;
+}
+function extractTagName(rawOpenTag) {
+  const end = rawOpenTag.search(/[\s>]/);
+  return rawOpenTag.slice(1, end === -1 ? rawOpenTag.length : end).toLowerCase();
+}
+function readRawStyle(styles) {
+  for (const s of styles) {
+    if (s.startsWith("raw:")) return s.slice(4);
   }
-};
+  return null;
+}
 
 // src/content/parser/MarkupParser.ts
 var MarkupParser = class {
-  constructor(options = {}) {
-    __publicField(this, "styleMapper");
-    this.styleMapper = options.styleMapper ?? new DefaultStyleMapper();
-  }
-  /**
-   * Parse HTML string into ContentUnit
-   *
-   * Handles two input formats:
-   * 1. HTML tags: `<b>text</b>` → converts to indexed `<1>text</1>` with styles
-   * 2. Already indexed: `<1>text</1>` → passes through as-is (from server)
-   *
-   * @param input - HTML string with inline elements or already indexed
-   * @returns ContentUnit with indexed tags and styles
-   */
   parse(input) {
-    const hasIndexedTags = /<\/?[0-9]+>/.test(input);
-    if (hasIndexedTags) {
-      return {
-        text: input,
-        styles: {}
-        // Empty - styles determined by children
-      };
+    if (/<\/?[0-9]+>/.test(input)) {
+      return { text: input, styles: {} };
     }
     const styles = {};
     let tagIndex = 0;
@@ -2379,88 +2280,45 @@ var MarkupParser = class {
     let result = "";
     let pos = 0;
     while (pos < input.length) {
-      const tagMatch = this.matchTag(input, pos);
-      if (!tagMatch) {
+      const tag = this.matchTag(input, pos);
+      if (!tag) {
         result += input.slice(pos);
         break;
       }
-      result += input.slice(pos, tagMatch.startIndex);
-      if (tagMatch.isClosing) {
-        const matchingOpen = this.findMatchingOpenTag(
-          tagStack,
-          tagMatch.tag.toLowerCase()
-        );
-        if (matchingOpen !== null) {
-          result += `</${matchingOpen}>`;
-          const stackIndex = tagStack.findIndex(
-            (t) => t.index === matchingOpen
-          );
-          if (stackIndex !== -1) {
-            tagStack.splice(stackIndex, 1);
+      result += input.slice(pos, tag.startIndex);
+      if (tag.isClosing) {
+        let matchIdx = null;
+        for (let i = tagStack.length - 1; i >= 0; i--) {
+          if (tagStack[i].tag === tag.tag.toLowerCase()) {
+            matchIdx = tagStack[i].index;
+            tagStack.splice(i, 1);
+            break;
           }
-        } else {
-          result += input.slice(tagMatch.startIndex, tagMatch.endIndex);
         }
-      } else if (tagMatch.isSelfClosing) {
-        tagIndex++;
-        const styleList = this.styleMapper.mapElementToStyles(
-          tagMatch.tag,
-          tagMatch.attrs
-        );
-        if (styleList.length > 0) {
-          styles[String(tagIndex)] = styleList;
-          result += `<${tagIndex}/>`;
+        if (matchIdx !== null) {
+          result += `</${matchIdx}>`;
         }
       } else {
-        const styleList = this.styleMapper.mapElementToStyles(
-          tagMatch.tag,
-          tagMatch.attrs
-        );
-        if (styleList.length > 0) {
-          tagIndex++;
-          styles[String(tagIndex)] = styleList;
-          result += `<${tagIndex}>`;
-          tagStack.push({ tag: tagMatch.tag.toLowerCase(), index: tagIndex });
+        const tagName = tag.tag.toLowerCase();
+        const isVoid = VOID_TAGS.has(tagName);
+        const isSelfClosing = tag.isSelfClosing || isVoid;
+        tagIndex++;
+        styles[String(tagIndex)] = [`raw:${serializeOpeningTag(tagName, tag.attrs)}`];
+        if (isSelfClosing) {
+          result += `<${tagIndex}/>`;
         } else {
-          const closingIndex = this.findClosingTagIndex(
-            input,
-            tagMatch.endIndex,
-            tagMatch.tag
-          );
-          if (closingIndex !== -1) {
-            const innerContent = input.slice(tagMatch.endIndex, closingIndex);
-            const innerUnit = this.parse(innerContent);
-            const baseIndex = tagIndex;
-            for (const [key, value] of Object.entries(innerUnit.styles)) {
-              const adjustedKey = String(baseIndex + parseInt(key, 10));
-              styles[adjustedKey] = value;
-            }
-            result += innerUnit.text.replace(/<(\/?)\d+>/g, (match, slash) => {
-              const num = parseInt(match.replace(/[</>]/g, ""), 10);
-              return `<${slash}${baseIndex + num}>`;
-            });
-            const closingMatch = this.matchTag(input, closingIndex);
-            pos = closingMatch ? closingMatch.endIndex : closingIndex;
-            const maxInnerIndex = Object.keys(innerUnit.styles).length > 0 ? Math.max(...Object.keys(innerUnit.styles).map(Number)) : 0;
-            tagIndex = baseIndex + maxInnerIndex;
-            continue;
-          }
+          result += `<${tagIndex}>`;
+          tagStack.push({ tag: tagName, index: tagIndex });
         }
       }
-      pos = tagMatch.endIndex;
+      pos = tag.endIndex;
     }
     while (tagStack.length > 0) {
       const unclosed = tagStack.pop();
       result += `</${unclosed.index}>`;
     }
-    return {
-      text: result,
-      styles
-    };
+    return { text: result, styles };
   }
-  /**
-   * Match an HTML tag at the given position
-   */
   matchTag(input, startPos) {
     const tagStart = input.indexOf("<", startPos);
     if (tagStart === -1) return null;
@@ -2483,9 +2341,6 @@ var MarkupParser = class {
       endIndex: tagStart + fullMatch.length
     };
   }
-  /**
-   * Parse HTML attributes string into key-value pairs
-   */
   parseAttributes(attrsString) {
     const attrs = {};
     if (!attrsString.trim()) return attrs;
@@ -2493,60 +2348,14 @@ var MarkupParser = class {
     let match;
     while ((match = attrPattern.exec(attrsString)) !== null) {
       const [, name, doubleQuoted, singleQuoted, unquoted] = match;
-      const value = doubleQuoted ?? singleQuoted ?? unquoted ?? "";
-      attrs[name.toLowerCase()] = value;
+      attrs[name.toLowerCase()] = doubleQuoted ?? singleQuoted ?? unquoted ?? "";
     }
     return attrs;
   }
-  /**
-   * Find matching opening tag in the stack
-   */
-  findMatchingOpenTag(stack, tagName) {
-    for (let i = stack.length - 1; i >= 0; i--) {
-      if (stack[i].tag === tagName) {
-        return stack[i].index;
-      }
-    }
-    return null;
-  }
-  /**
-   * Find the closing tag index for a given opening tag
-   */
-  findClosingTagIndex(input, startPos, tagName) {
-    const lowerTag = tagName.toLowerCase();
-    let depth = 1;
-    let pos = startPos;
-    while (pos < input.length && depth > 0) {
-      const tagMatch = this.matchTag(input, pos);
-      if (!tagMatch) break;
-      if (tagMatch.tag.toLowerCase() === lowerTag) {
-        if (tagMatch.isClosing) {
-          depth--;
-          if (depth === 0) {
-            return tagMatch.startIndex;
-          }
-        } else if (!tagMatch.isSelfClosing) {
-          depth++;
-        }
-      }
-      pos = tagMatch.endIndex;
-    }
-    return -1;
-  }
 };
 
 // src/content/serializer/HTMLSerializer.ts
 var HTMLSerializer = class {
-  constructor(options = {}) {
-    __publicField(this, "styleMapper");
-    this.styleMapper = options.styleMapper ?? new DefaultStyleMapper();
-  }
-  /**
-   * Serialize ContentUnit to HTML string
-   *
-   * @param unit - ContentUnit with indexed tags and styles
-   * @returns HTML string with semantic elements
-   */
   serialize(unit) {
     const { text, styles } = unit;
     const tagPattern = /<(\/?)?(\d+)(\/)?>/g;
@@ -2555,40 +2364,25 @@ var HTMLSerializer = class {
     let match;
     while ((match = tagPattern.exec(text)) !== null) {
       result += text.slice(lastIndex, match.index);
-      const [fullMatch, closingSlash, indexStr, selfClosingSlash] = match;
-      const tagIndex = indexStr;
-      const styleList = styles[tagIndex] || [];
-      if (closingSlash) {
-        const mapping = this.styleMapper.mapStylesToElement(styleList);
-        result += `</${mapping.element}>`;
-      } else if (selfClosingSlash) {
-        const mapping = this.styleMapper.mapStylesToElement(styleList);
-        const attrs = this.formatAttributes(mapping.attrs);
-        result += `<${mapping.element}${attrs} />`;
+      const [fullMatch, closingSlash, indexStr] = match;
+      const styleList = styles[indexStr] ?? [];
+      const rawOpen = readRawStyle(styleList);
+      if (rawOpen) {
+        const tagName = extractTagName(rawOpen);
+        const isVoid = VOID_TAGS.has(tagName);
+        if (closingSlash) {
+          if (!isVoid) result += `</${tagName}>`;
+        } else {
+          result += rawOpen;
+        }
       } else {
-        const mapping = this.styleMapper.mapStylesToElement(styleList);
-        const attrs = this.formatAttributes(mapping.attrs);
-        result += `<${mapping.element}${attrs}>`;
+        result += fullMatch;
       }
       lastIndex = match.index + fullMatch.length;
     }
     result += text.slice(lastIndex);
     return result;
   }
-  /**
-   * Format attributes object into HTML attribute string
-   */
-  formatAttributes(attrs) {
-    const entries = Object.entries(attrs);
-    if (entries.length === 0) return "";
-    return " " + entries.map(([key, value]) => `${key}="${this.escapeAttributeValue(value)}"`).join(" ");
-  }
-  /**
-   * Escape special characters in attribute values
-   */
-  escapeAttributeValue(value) {
-    return value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
-  }
 };
 
 // src/cache/CacheManager.ts
@@ -2822,7 +2616,7 @@ var CacheManager = class {
 };
 
 // src/lionRapid.ts
-var INDEXED_TAG_REGEX = /<\/?[0-9]+>/;
+var INDEXED_TAG_REGEX = /<\/?[0-9]+\/?>/;
 var HTML_TAG_REGEX = /<[a-z][a-z0-9]*(?:\s+[^>]*)?\/?>/i;
 var LionRapidCore = class {
   constructor(eventEmitter, handlerChain, defaultLocale = "en", fallbackLocale = "en", defaultNamespace) {
@@ -3047,7 +2841,7 @@ var LionRapidCore = class {
    */
   processIndexedValue(value, request) {
     const processedText = this.processTranslationValue(value, request);
-    return processedText.replace(/<\/?[0-9]+>/g, "");
+    return processedText.replace(/<\/?[0-9]+\/?>/g, "");
   }
   /**
    * 📦 Get styles for a translation key from namespace cache (fallback)
@@ -3093,7 +2887,7 @@ var LionRapidCore = class {
     try {
       const unit = this.markupParser.parse(value);
       const processedText = this.processTranslationValue(unit.text, request);
-      return processedText.replace(/<\/?[0-9]+>/g, "");
+      return processedText.replace(/<\/?[0-9]+\/?>/g, "");
     } catch (error) {
       logger.warn(`ContentUnit processing failed for "${value}":`, error);
       return this.processTranslationValue(value, request);
@@ -3162,7 +2956,7 @@ var LionRapidCore = class {
    * @example
    * ```typescript
    * const unit = i18n.getContentUnit('terms', {}, 'Read our <b>Terms</b>.');
-   * // → { text: "Read our <1>Terms</1>.", styles: {"1": ["bold"]} }
+   * // → { text: "Read our <1>Terms</1>.", styles: {"1": ["raw:<b>"]} }
    * ```
    */
   getContentUnit(key, params, defaultValue) {
@@ -3771,7 +3565,7 @@ var _NetworkRepository = class _NetworkRepository {
       logger.debug("API base URL is not set");
       throw new NetworkError("API base URL is not set");
     }
-    const url = this.buildUrl("getTranslation", { key });
+    const url = this.withDraftsParam(this.buildUrl("getTranslation", { key }));
     logger.debug(`API GET: ${url}`);
     try {
       const response = await this.makeRequest(url, "GET");
@@ -3807,7 +3601,7 @@ var _NetworkRepository = class _NetworkRepository {
       logger.debug("API base URL is not set");
       throw new NetworkError("API base URL is not set");
     }
-    const url = this.buildUrl("getTranslation", { key });
+    const url = this.withDraftsParam(this.buildUrl("getTranslation", { key }));
     logger.debug(`API GET ContentUnit: ${url}`);
     try {
       const response = await this.makeRequest(url, "GET");
@@ -3848,7 +3642,7 @@ var _NetworkRepository = class _NetworkRepository {
       logger.debug("API base URL is not set");
       throw new NetworkError("API base URL is not set");
     }
-    const url = this.buildUrl("getNamespace", { locale, namespace });
+    const url = this.withDraftsParam(this.buildUrl("getNamespace", { locale, namespace }));
     logger.debug(`API GET Namespace: ${url}`);
     const namespaceKey = `${locale}:${namespace}`;
     try {
@@ -3962,7 +3756,7 @@ var _NetworkRepository = class _NetworkRepository {
       logger.debug("API base URL is not set");
       throw new NetworkError("API base URL is not set");
     }
-    const url = this.buildUrl("getNamespace", { locale, namespace });
+    const url = this.withDraftsParam(this.buildUrl("getNamespace", { locale, namespace }));
     logger.debug(`API GET Namespace ContentUnits: ${url}`);
     const namespaceKey = `${locale}:${namespace}`;
     try {
@@ -4174,6 +3968,26 @@ var _NetworkRepository = class _NetworkRepository {
     }
     return `${baseUrl}${path}`;
   }
+  /**
+   * Check whether the current page is running inside an active visual-editor
+   * session. The editor JS sets `__lr_editor_active=1` as a session cookie
+   * when its JWT is established; we read it here so client-side translation
+   * fetches request draft content too, matching what the edge proxy does
+   * server-side. Outside a browser (Node/SSR) this is always false.
+   */
+  isEditorPreviewSession() {
+    if (typeof document === "undefined") return false;
+    return document.cookie.split("; ").some((c) => c === "__lr_editor_active=1");
+  }
+  /**
+   * Append `include_drafts=true` to a built URL when an editor session is
+   * active. Leaves the URL unchanged for normal visitors so the delivery
+   * gate continues to apply in production.
+   */
+  withDraftsParam(url) {
+    if (!this.isEditorPreviewSession()) return url;
+    return url + (url.includes("?") ? "&" : "?") + "include_drafts=true";
+  }
   /**
    * Make HTTP request with timeout and headers
    */