{"version":3,"file":"index.cjs","sources":["../../src/shared/inline-markup/parse-inline-markers.ts","../../src/shared/inline-markup/serialize-inline-markers.ts","../../src/shared/links/link-item.ts","../../src/shared/links/is-safe-href.ts","../../src/shared/links/resolve-link-attributes.ts","../../src/shared/span-styles/span-style-item.ts","../../src/shared/span-styles/resolve-class-names.ts","../../src/shared/span-styles/parse-style-declarations.ts","../../src/shared/span-styles/resolve-span-style-attributes.ts","../../src/shared/inline-markup/render-inline-markup.tsx","../../src/base-components/display/components/r-text/default-attribute-values.ts","../../src/base-components/display/components/r-text/enclosing-tags.ts","../../src/base-components/display/components/r-text/resolve-enclosing-tag.ts","../../src/base-components/display/components/r-text/RText.tsx","../../src/base-components/display/components/r-text/resolve-no-container.ts","../../src/component-identifiers.ts","../../src/base-components/display/components/r-text/display-card-entry.tsx","../../src/base-components/display/components/r-text/resolve-renders-own-element.ts","../../src/base-components/display/components/r-text/attribute-edit-mode-configs.ts","../../src/base-components/display/components/cloudinary-advanced-image/build-cloudinary-image-urls.ts","../../src/base-components/display/components/cloudinary-advanced-image/CloudinaryAdvancedImage.tsx","../../src/base-components/display/components/cloudinary-advanced-image/resolve-no-container.ts","../../src/base-components/display/components/cloudinary-advanced-image/display-card-entry.tsx","../../src/base-components/display/components/cloudinary-advanced-image/resolve-renders-own-element.ts","../../src/base-components/display/components/cloudinary-advanced-image/default-attribute-values.ts","../../src/base-components/display/components/cloudinary-advanced-image/attribute-edit-mode-configs.ts","../../src/base-components/display/components/r-video/build-video-delivery-urls.ts","../../src/base-components/display/components/r-video/RVideo.tsx","../../src/base-components/display/components/r-video/resolve-no-container.ts","../../src/base-components/display/components/r-video/display-card-entry.tsx","../../src/base-components/display/components/r-video/resolve-renders-own-element.ts","../../src/base-components/display/components/r-video/default-attribute-values.ts","../../src/base-components/display/components/r-video/attribute-edit-mode-configs.ts","../../src/shared/icons/render-icon-children.tsx","../../src/base-components/display/components/r-icon/icon-attribute-value.ts","../../src/base-components/display/components/r-icon/RIcon.tsx","../../src/base-components/display/components/r-icon/display-card-entry.tsx","../../src/base-components/display/components/r-icon/resolve-no-container.ts","../../src/base-components/display/components/r-icon/resolve-renders-own-element.ts","../../src/base-components/display/components/r-icon/default-attribute-values.ts","../../src/base-components/display/components/r-icon/attribute-edit-mode-configs.ts","../../src/shared/links/parse-inline-link-markers.ts","../../src/base-components/display/components/r-button/button-presets.ts","../../src/base-components/display/components/r-button/button-css-variables.ts","../../src/base-components/display/components/r-button/button-preset-styles.ts","../../src/base-components/display/components/r-button/button-instance-props.ts","../../src/base-components/display/components/r-button/resolve-button-preset.ts","../../src/base-components/display/components/r-button/button-attributes.ts","../../src/base-components/display/components/r-button/RButton.tsx","../../src/base-components/display/components/r-button/display-card-entry.tsx","../../src/base-components/display/components/r-button/resolve-no-container.ts","../../src/base-components/display/components/r-button/resolve-renders-own-element.ts","../../src/base-components/display/components/r-button/default-attribute-values.ts","../../src/base-components/display/components/r-button/attribute-edit-mode-configs.ts","../../src/base-components/display/components/r-divider/divider-attributes.ts","../../src/base-components/display/components/r-divider/divider-styles.ts","../../src/base-components/display/components/r-divider/RDivider.tsx","../../src/base-components/display/components/r-divider/resolve-no-container.ts","../../src/base-components/display/components/r-divider/display-card-entry.tsx","../../src/base-components/display/components/r-divider/resolve-renders-own-element.ts","../../src/base-components/display/components/r-divider/default-attribute-values.ts","../../src/base-components/display/components/r-divider/attribute-edit-mode-configs.ts","../../src/base-components/display/components/r-embed/embed-attributes.ts","../../src/base-components/display/components/r-embed/embed-providers.ts","../../src/base-components/display/components/r-embed/resolve-embed.ts","../../src/base-components/display/components/r-embed/REmbed.tsx","../../src/base-components/display/components/r-embed/resolve-no-container.ts","../../src/base-components/display/components/r-embed/display-card-entry.tsx","../../src/base-components/display/components/r-embed/resolve-renders-own-element.ts","../../src/base-components/display/components/r-embed/default-attribute-values.ts","../../src/base-components/display/components/r-embed/attribute-edit-mode-configs.ts","../../src/base-components/display/components/r-list/list-attributes.ts","../../src/base-components/display/components/r-list/RList.tsx","../../src/base-components/display/components/r-list/resolve-no-container.ts","../../src/base-components/display/components/r-list/display-card-entry.tsx","../../src/base-components/display/components/r-list/resolve-renders-own-element.ts","../../src/base-components/display/components/r-list/default-attribute-values.ts","../../src/base-components/display/components/r-list/attribute-edit-mode-configs.ts","../../src/base-components/display/components/r-accordion/accordion-attributes.ts","../../src/base-components/display/components/r-accordion/RAccordion.tsx","../../src/base-components/display/components/r-accordion/resolve-no-container.ts","../../src/base-components/display/components/r-accordion/display-card-entry.tsx","../../src/base-components/display/components/r-accordion/resolve-renders-own-element.ts","../../src/base-components/display/components/r-accordion/default-attribute-values.ts","../../src/base-components/display/components/r-accordion/attribute-edit-mode-configs.ts","../../src/base-components/display/components/r-mount/mount-attributes.ts","../../src/base-components/display/components/r-mount/RMount.tsx","../../src/base-components/display/components/r-mount/resolve-no-container.ts","../../src/base-components/display/card-groups.tsx","../../src/base-components/display/card-entries/card-entries.tsx","../../src/base-components/display/components/r-mount/display-card-entry.tsx","../../src/base-components/display/components/r-mount/resolve-renders-own-element.ts","../../src/base-components/display/components/r-mount/default-attribute-values.ts","../../src/base-components/display/components/r-mount/attribute-edit-mode-configs.ts","../../src/get-source-components-plugin.ts","../../src/base-components/display/component-attributes/component-name-to-modify-attribute.ts","../../src/base-components/display/component-attributes/attribute-list-for-component-types.ts","../../src/get-component-metadata-for-editing.ts","../../src/base-components/editor-preview/card-groups.tsx","../../src/base-components/editor-preview/card-entries/card-entries.tsx","../../src/base-components/editor-preview/components/r-text/preview-card-entry.tsx","../../src/base-components/editor-preview/components/cloudinary-advanced-image/preview-card-entry.tsx","../../src/base-components/editor-preview/components/r-video/preview-card-entry.tsx","../../src/base-components/editor-preview/components/r-icon/preview-card-entry.tsx","../../src/base-components/editor-preview/components/r-button/preview-card-entry.tsx","../../src/base-components/editor-preview/components/r-divider/preview-card-entry.tsx","../../src/base-components/editor-preview/components/r-embed/preview-card-entry.tsx","../../src/base-components/editor-preview/components/r-list/preview-card-entry.tsx","../../src/base-components/editor-preview/components/r-accordion/preview-card-entry.tsx","../../src/base-components/editor-preview/components/r-mount/preview-card-entry.tsx","../../src/get-preview-components.ts","../../src/base-components/display/components/r-button/button-library-stylesheet.ts","../../src/base-components/display/components/r-accordion/accordion-library-stylesheet.ts","../../src/component-library-module.ts"],"sourcesContent":["/**\n * The formatting one marker can carry. Independent flags rather than a union,\n * because a span can be bold and italic and struck at once.\n */\nexport type InlineMarks = { bold: boolean; italic: boolean; strike: boolean };\n\nexport type MarkupTextRun = { kind: 'text'; text: string };\n\nexport type MarkupSpanRun = {\n kind: 'span';\n text: string;\n /**\n * 1-based position in the link list, when the marker carried an index. A\n * span can be marked without linking (`{b|word}`) and linked without marks\n * (`{1|word}`), so this is optional and the marks are always present.\n */\n index?: number;\n /**\n * 1-based position in the styling list, when the marker carried a `.index`.\n * Independent of everything else on the span: `{.1|word}` is styled only,\n * `{b2.1|word}` is bold, linked, and styled.\n */\n styleIndex?: number;\n marks: InlineMarks;\n};\n\nexport type MarkupBreakRun = { kind: 'break' };\n\nexport type MarkupRun = MarkupTextRun | MarkupSpanRun | MarkupBreakRun;\n\n/**\n * `{` + optional mark letters + optional link index + optional `.` and styling\n * index + `|` + text + `}`.\n *\n * Sticky, so it can be tried at one position without slicing the string. The\n * text is everything up to the first `}`, which is what makes markers\n * non-nesting.\n *\n * The dot is what tells the two indexes apart, and it reads as the CSS class\n * selector it usually stands for. It cannot be confused with a link index,\n * because a link index is bare digits and always comes first.\n */\nconst MARKER = /\\{([a-z]*)(\\d*)(?:\\.(\\d+))?\\|([^}]*)\\}/y;\n\n/**\n * One letter per mark. Order is not significant (`{bi1|x}` and `{ib1|x}` are\n * the same span) and repeats are harmless, because the letters resolve to a\n * set.\n *\n * **`r` must never become a mark letter.** `br` is the line-break token below,\n * and it is only unambiguous while `r` cannot appear in a mark sequence.\n */\nconst MARK_LETTERS: Readonly> = {\n b: 'bold',\n i: 'italic',\n s: 'strike',\n};\n\n/** The one marker that carries no text: `{br|}`. */\nconst BREAK_TOKEN = 'br';\n\nconst NO_MARKS: InlineMarks = { bold: false, italic: false, strike: false };\n\n/**\n * Letters to a mark set, or `undefined` when any letter is not a mark. An\n * unknown letter makes the whole marker literal text rather than a span with\n * the bad letter ignored: an author who mistypes should see it.\n */\nconst resolveMarks = (letters: string): InlineMarks | undefined => {\n if (letters === '') {\n return { ...NO_MARKS };\n }\n\n const marks: InlineMarks = { ...NO_MARKS };\n for (const letter of letters) {\n const mark = MARK_LETTERS[letter];\n if (mark === undefined) {\n return undefined;\n }\n marks[mark] = true;\n }\n return marks;\n};\n\n/**\n * Splits authored text into plain runs, marked/linked spans, and line breaks.\n *\n * The grammar, and everything it deliberately leaves as literal text, is\n * specified in `rulecms/__docs__/__ARCHITECTURE__/INLINE_MARKUP_ARCHITECTURE.md`.\n * In short: a marker is `{`, then lowercase mark letters, then a link index,\n * then `.` and a styling index, then `|`, then its text, then `}`. At least one\n * of those three must be present, and everything that does not match that shape\n * stays verbatim — `{name}`, `{99}`, a lone `{`, JSON fragments, an unterminated\n * marker, an unknown mark letter, and empty span text.\n *\n * Indexes are 1-based and normalize through a base-10 parse, so `{01|x}` and\n * `{1|x}` point at the same entry. Resolving an index to an entry is the\n * caller's job; this stays pure and free of React.\n */\nexport function parseInlineMarkers(value: string): MarkupRun[] {\n if (typeof value !== 'string' || value === '') {\n return [];\n }\n\n const runs: MarkupRun[] = [];\n let pendingText = '';\n let cursor = 0;\n\n const flushPendingText = () => {\n if (pendingText !== '') {\n runs.push({ kind: 'text', text: pendingText });\n pendingText = '';\n }\n };\n\n while (cursor < value.length) {\n const open = value.indexOf('{', cursor);\n if (open === -1) {\n pendingText += value.slice(cursor);\n break;\n }\n\n MARKER.lastIndex = open;\n const match = MARKER.exec(value);\n const run = match ? resolveRun(match[1], match[2], match[3], match[4]) : undefined;\n\n if (run === undefined) {\n // Not a marker: keep the brace as text and look for the next one.\n pendingText += value.slice(cursor, open + 1);\n cursor = open + 1;\n continue;\n }\n\n pendingText += value.slice(cursor, open);\n flushPendingText();\n runs.push(run);\n cursor = open + (match as RegExpExecArray)[0].length;\n }\n\n flushPendingText();\n\n return runs;\n}\n\n/**\n * One matched `{…|…}` to the run it means, or `undefined` when the match is\n * not a marker after all and its opening brace is literal text.\n *\n * `styleDigits` is `undefined` when the marker carried no dot at all, which is\n * different from a dot with nothing after it — the regex does not match that,\n * so it never reaches here.\n */\nconst resolveRun = (\n letters: string,\n digits: string,\n styleDigits: string | undefined,\n text: string\n): MarkupRun | undefined => {\n if (letters === BREAK_TOKEN) {\n // A break carries nothing. `{br|x}` is a mistake, not a break with text.\n return digits === '' && styleDigits === undefined && text === ''\n ? { kind: 'break' }\n : undefined;\n }\n\n if (letters === '' && digits === '' && styleDigits === undefined) {\n return undefined;\n }\n\n // Empty text has no words to mark or link, and staying literal is what shows\n // the author the mistake instead of swallowing the marker.\n if (text === '') {\n return undefined;\n }\n\n const marks = resolveMarks(letters);\n if (marks === undefined) {\n return undefined;\n }\n\n return {\n kind: 'span',\n text,\n ...(digits === '' ? {} : { index: Number.parseInt(digits, 10) }),\n ...(styleDigits === undefined ? {} : { styleIndex: Number.parseInt(styleDigits, 10) }),\n marks,\n };\n};\n","import type { InlineMarks, MarkupRun, MarkupSpanRun } from './parse-inline-markers';\n\n/**\n * Canonical letter order, so the same span always serializes the same way and\n * a source-mode author sees `{bi1|…}` rather than whichever order an editor\n * happened to apply the marks in.\n */\nconst MARK_LETTERS: ReadonlyArray = [\n ['bold', 'b'],\n ['italic', 'i'],\n ['strike', 's'],\n];\n\nconst markLetters = (marks: InlineMarks): string =>\n MARK_LETTERS.filter(([mark]) => marks[mark])\n .map(([, letter]) => letter)\n .join('');\n\n/**\n * A span back to its marker. Text that carries no marks, no link and no styling\n * is emitted bare: a marker with nothing to say would only be noise an author\n * has to read past, and it round-trips to the same runs either way.\n */\nconst formatSpan = (run: MarkupSpanRun): string => {\n const letters = markLetters(run.marks);\n const index = run.index === undefined ? '' : `${run.index}`;\n const styleIndex = run.styleIndex === undefined ? '' : `.${run.styleIndex}`;\n\n if (letters === '' && index === '' && styleIndex === '') {\n return run.text;\n }\n return `{${letters}${index}${styleIndex}|${run.text}}`;\n};\n\n/** One run as authored text. */\nexport function formatInlineMarker(run: MarkupRun): string {\n switch (run.kind) {\n case 'text':\n return run.text;\n case 'break':\n return '{br|}';\n default:\n return formatSpan(run);\n }\n}\n\n/**\n * Runs back to the string they were parsed from.\n *\n * This is the writer half of the grammar, and it lives beside the parser so\n * that an editor never hand-assembles marker syntax. `parseInlineMarkers` and\n * this function are inverses for anything the parser produces, which is what\n * lets a rich editor round-trip through source mode without rewriting content\n * the author did not touch.\n */\nexport function serializeInlineMarkers(runs: readonly MarkupRun[]): string {\n return runs.map(formatInlineMarker).join('');\n}\n","/**\n * One link entry as the composer stores it. Shared by every component that\n * links (text markers today, icons next), so nothing here knows about text.\n */\nexport type LinkItem = {\n href?: string;\n /** Author-facing name for identifying the entry in the composer. Never rendered. */\n label?: string;\n target?: string;\n rel?: string;\n title?: string;\n ariaLabel?: string;\n /** `true` = bare download attribute; string = suggested filename. */\n download?: string | boolean;\n hreflang?: string;\n referrerPolicy?: string;\n};\n\n/**\n * Runtime guard for entries arriving through componentAttributes (untyped,\n * editor-authored data).\n *\n * Only object shape is checked. Field types are not: a single bad field must\n * cost that field, not the whole entry, so per-field validation belongs to\n * `resolveLinkAttributes` where each value is turned into an attribute.\n */\nexport function isLinkItem(value: unknown): value is LinkItem {\n return typeof value === 'object' && value !== null && !Array.isArray(value);\n}\n\n/**\n * True for a cleared slot. Clearing a link stores `{}` rather than removing\n * the array element, because marker indexes are 1-based positions: dropping an\n * element would silently repoint every later marker.\n */\nexport function isEmptyLinkItem(item: unknown): boolean {\n if (!isLinkItem(item)) {\n return true;\n }\n return Object.values(item).every(\n (value) =>\n value === undefined ||\n value === null ||\n (typeof value === 'string' && value.trim() === '')\n );\n}\n\n/**\n * The entry a `{n|…}` marker points at, by 1-based position. Tolerant of bad\n * data on every axis — a non-array list, a fractional or out-of-range index,\n * a hole in the array — because none of it may throw during a render.\n */\nexport function getLinkItemAt(links: unknown, oneBasedIndex: number): LinkItem | undefined {\n if (!Array.isArray(links)) {\n return undefined;\n }\n if (!Number.isInteger(oneBasedIndex) || oneBasedIndex < 1) {\n return undefined;\n }\n const entry = links[oneBasedIndex - 1];\n return isLinkItem(entry) ? entry : undefined;\n}\n","/**\n * Schemes that can execute or smuggle a payload. Mirrors the denylist in\n * RuleCMS `text-safety/validate-text-content.ts`; the two must stay in step,\n * because that one warns at save and this one is the guarantee at render.\n */\nexport const REJECTED_HREF_SCHEMES: readonly string[] = [\n 'javascript',\n // Netscape-era aliases for javascript:. No browser in use today runs them,\n // but RuleCMS refuses them in prose, and an href accepting what the text\n // field rejects is the kind of gap that outlives the reason for it.\n 'livescript',\n 'mocha',\n 'vbscript',\n 'data',\n 'file',\n 'blob',\n];\n\nconst SCHEME = /^([a-z][a-z0-9+.-]*):/;\n\n/**\n * Characters a browser ignores while reading a scheme. Stripped before the\n * scheme is matched so `java\\tscript:` and a leading NUL cannot hide one.\n */\nconst isIgnoredWhenReadingAScheme = (charCode: number): boolean =>\n charCode <= 0x20 || charCode === 0x7f;\n\nconst schemeProbe = (value: string): string => {\n let probe = '';\n for (let index = 0; index < value.length; index += 1) {\n if (!isIgnoredWhenReadingAScheme(value.charCodeAt(index))) {\n probe += value[index];\n }\n }\n return probe.toLowerCase();\n};\n\n/**\n * Whether a value is safe to put in an `href`.\n *\n * A denylist, not an allowlist. Customers link with git and ssh URLs, mobile\n * deep links, `mailto:`, `tel:`, `sms:`, custom app schemes, protocol-relative\n * `//host/path`, and bare `/path`, `#anchor`, `?q=1`, `./rel` — all of which\n * are accepted. A host is not required and neither is http/https. Only the\n * schemes that turn a link into code or an opaque payload are turned away.\n *\n * Rejection happens at render, never at save: the composer may use this for a\n * non-blocking warning, but stored content is not trusted content.\n */\nexport function isSafeHref(value: unknown): boolean {\n if (typeof value !== 'string' || value.trim() === '') {\n return false;\n }\n\n const match = SCHEME.exec(schemeProbe(value));\n // No scheme at all: relative, fragment, query, or protocol-relative.\n if (!match) {\n return true;\n }\n\n return !REJECTED_HREF_SCHEMES.includes(match[1]);\n}\n","import type { AnchorHTMLAttributes } from 'react';\nimport { isLinkItem } from './link-item';\nimport type { LinkItem } from './link-item';\nimport { isSafeHref } from './is-safe-href';\n\n/**\n * The props an `` receives, picked from React's own anchor attributes so\n * the object can be spread onto an element without a cast at the call site.\n * `href` is required: an anchor without one has no link role, is not\n * focusable, and is invisible to assistive technology while still looking\n * like a link.\n */\nexport type AnchorAttributes = Pick<\n AnchorHTMLAttributes,\n 'target' | 'rel' | 'title' | 'aria-label' | 'download' | 'hrefLang' | 'referrerPolicy'\n> & { href: string };\n\nconst BLANK_TARGET = '_blank';\n\n/** `target=\"_blank\"` opens a window that can reach back into this one without these. */\nconst IMPLIED_REL_FOR_BLANK_TARGET = ['noopener', 'noreferrer'];\n\nconst cleanString = (value: unknown): string | undefined => {\n if (typeof value !== 'string') {\n return undefined;\n }\n const trimmed = value.trim();\n return trimmed === '' ? undefined : trimmed;\n};\n\n/**\n * The author's tokens and their order are kept; only the missing implied ones\n * are appended. Deduping is case-insensitive because `rel` tokens are.\n */\nconst resolveRel = (authorRel: string | undefined, target: string | undefined): string | undefined => {\n const tokens = authorRel ? authorRel.split(/\\s+/) : [];\n\n if (target?.toLowerCase() !== BLANK_TARGET) {\n return tokens.length > 0 ? tokens.join(' ') : undefined;\n }\n\n const present = new Set(tokens.map((token) => token.toLowerCase()));\n const merged = [...tokens];\n IMPLIED_REL_FOR_BLANK_TARGET.forEach((token) => {\n if (!present.has(token)) {\n merged.push(token);\n }\n });\n return merged.join(' ');\n};\n\nconst resolveDownload = (download: LinkItem['download']): string | true | undefined => {\n if (download === true) {\n return true;\n }\n return cleanString(download);\n};\n\n/**\n * Turns a stored link entry into anchor props, or `undefined` when the entry\n * cannot produce a usable anchor — missing, cleared, blank `href`, or an\n * `href` the safety check rejects. Callers render the plain text in that case.\n *\n * Knows nothing about text, markers, or any one component: this is the piece\n * every linking component shares.\n */\nexport function resolveLinkAttributes(item: LinkItem | undefined): AnchorAttributes | undefined {\n if (!isLinkItem(item)) {\n return undefined;\n }\n\n const href = cleanString(item.href);\n if (!isSafeHref(href)) {\n return undefined;\n }\n\n const target = cleanString(item.target);\n const rel = resolveRel(cleanString(item.rel), target);\n const title = cleanString(item.title);\n const ariaLabel = cleanString(item.ariaLabel);\n const download = resolveDownload(item.download);\n const hrefLang = cleanString(item.hreflang);\n const referrerPolicy = cleanString(item.referrerPolicy);\n\n return {\n href: href as string,\n ...(target !== undefined ? { target } : {}),\n ...(rel !== undefined ? { rel } : {}),\n ...(title !== undefined ? { title } : {}),\n ...(ariaLabel !== undefined ? { 'aria-label': ariaLabel } : {}),\n ...(download !== undefined ? { download } : {}),\n ...(hrefLang !== undefined ? { hrefLang } : {}),\n // Stored values are untyped strings; React narrows this prop to a union.\n ...(referrerPolicy !== undefined\n ? { referrerPolicy: referrerPolicy as AnchorAttributes['referrerPolicy'] }\n : {}),\n };\n}\n","/**\n * One styling entry as the composer stores it. Shared by every component that\n * renders inline markup, so nothing here knows about text.\n *\n * Two fields rather than one because they fail differently. Class names are\n * names of rules the customer's own CSS owns, and this library can neither see\n * them nor be sure they exist. Declarations are CSS this library has to\n * understand well enough to hand to a platform that wants an object rather\n * than a string.\n */\nexport type SpanStyleItem = {\n /** Author-facing name for identifying the entry in the composer. Never rendered. */\n label?: string;\n /** Whitespace-separated class names, exactly as the author typed them. */\n classNames?: string;\n /** A CSS declaration list — `color: #c00; font-weight: 600` — without braces. */\n declarations?: string;\n};\n\n/**\n * Runtime guard for entries arriving through componentAttributes (untyped,\n * editor-authored data).\n *\n * Only object shape is checked, for the same reason as `isLinkItem`: one bad\n * field must cost that field rather than the whole entry, so per-field\n * validation belongs to `resolveSpanStyleAttributes` where each value is turned\n * into something a platform can apply.\n */\nexport function isSpanStyleItem(value: unknown): value is SpanStyleItem {\n return typeof value === 'object' && value !== null && !Array.isArray(value);\n}\n\n/**\n * True for a cleared slot. Clearing an entry stores `{}` rather than removing\n * the array element, because marker indexes are 1-based positions: dropping an\n * element would silently repoint every later marker.\n *\n * A `label` alone is a cleared slot. It is the author's note to themselves\n * about which entry this is, and an entry that only has a name applies nothing.\n */\nexport function isEmptySpanStyleItem(item: unknown): boolean {\n if (!isSpanStyleItem(item)) {\n return true;\n }\n return [item.classNames, item.declarations].every(\n (value) => typeof value !== 'string' || value.trim() === ''\n );\n}\n\n/**\n * The entry a `{.n|…}` marker points at, by 1-based position. Tolerant of bad\n * data on every axis — a non-array list, a fractional or out-of-range index, a\n * hole in the array — because none of it may throw during a render.\n */\nexport function getSpanStyleItemAt(\n spanStyles: unknown,\n oneBasedIndex: number\n): SpanStyleItem | undefined {\n if (!Array.isArray(spanStyles)) {\n return undefined;\n }\n if (!Number.isInteger(oneBasedIndex) || oneBasedIndex < 1) {\n return undefined;\n }\n const entry = spanStyles[oneBasedIndex - 1];\n return isSpanStyleItem(entry) ? entry : undefined;\n}\n","/**\n * A class name is a *selector* into CSS the customer already ships. This\n * library cannot see those rules, so it cannot validate a name against\n * anything — the only useful question is whether the token could damage the\n * document it lands in, and the answer is almost always no: every renderer sets\n * `class` through a DOM property or a framework binding, never by pasting into\n * markup.\n *\n * So the filter is deliberately permissive. Utility frameworks make class names\n * that look like code — `md:hover:text-lg`, `w-1/2`, `text-[#c00]`,\n * `[&>svg]:size-4` — and a tidier-looking allowlist would reject those and be\n * read as a bug.\n */\n\n/** Whitespace separates tokens, so it cannot appear inside one. */\nconst TOKEN_SEPARATOR = /\\s+/;\n\n/**\n * Control characters, and the two brace characters. Braces are not dangerous in\n * a class attribute; they are rejected because a token containing one is nearly\n * always an inline marker the author pasted into the wrong field, and silently\n * accepting it would style nothing and explain nothing.\n */\n// eslint-disable-next-line no-control-regex -- control characters are what this matches\nconst REJECTED_IN_TOKEN = /[\\u0000-\\u001f\\u007f{}]/;\n\n/**\n * Bounds, so a pathological value cannot become a pathological `class`\n * attribute. Both are far past anything a person types by hand.\n */\nconst MAX_TOKENS = 50;\nconst MAX_TOKEN_LENGTH = 120;\n\nconst isUsableToken = (token: string): boolean =>\n // Splitting a blank string yields one empty token, which is not a class name.\n token !== '' && token.length <= MAX_TOKEN_LENGTH && !REJECTED_IN_TOKEN.test(token);\n\n/**\n * The `class` value for a styling entry, or `undefined` when it has none worth\n * setting.\n *\n * Duplicates collapse and order is the author's. One bad token costs that\n * token: the rest of a mostly-fine list still applies, which is the same\n * per-field tolerance `resolveLinkAttributes` gives a link entry.\n */\nexport function resolveClassNames(value: unknown): string | undefined {\n if (typeof value !== 'string') {\n return undefined;\n }\n\n const tokens = value.trim().split(TOKEN_SEPARATOR).filter(isUsableToken);\n if (tokens.length === 0) {\n return undefined;\n }\n\n return Array.from(new Set(tokens)).slice(0, MAX_TOKENS).join(' ');\n}\n","/**\n * One CSS declaration, normalized: a property name this module accepted and the\n * value it accepted for it, both trimmed and with nothing dropped in between.\n */\nexport type StyleDeclaration = { property: string; value: string };\n\n/**\n * Declarations are split on `;` without tracking quotes, so a value containing\n * a semicolon inside a string — `content: \"a;b\"` — is cut in half and both\n * halves are then rejected as malformed. That is an acceptable trade: the\n * properties worth setting on a run of words do not take string values, and a\n * quote-aware splitter is a second CSS parser to keep correct.\n */\nconst DECLARATION_SEPARATOR = ';';\n\n/** `--custom-property`, or an ordinary property with an optional vendor prefix. */\nconst PROPERTY_NAME = /^(--[a-zA-Z0-9-]+|-?[a-zA-Z][a-zA-Z0-9-]*)$/;\n\n/**\n * Properties that do something other than style text, whatever their value.\n *\n * `behavior` and `-moz-binding` attach script to an element through CSS in old\n * engines. They are long dead, and they are named here anyway: the cost is one\n * line, and the alternative is relying on every reader of this file knowing\n * that CSS was once executable.\n */\nconst REJECTED_PROPERTIES = new Set(['behavior', '-moz-binding']);\n\n/**\n * Constructs that make a declaration do more than describe appearance.\n *\n * `url(` is rejected rather than filtered because every reason to allow it is\n * better served elsewhere: a background image is a component, and a `url()` in\n * authored text is either a tracking pixel, a `data:` payload, or a\n * `javascript:` scheme an older engine will still run. A backslash is rejected\n * for the same reason in one step: CSS escapes let `\\75 rl(` spell `url(`, so\n * allowing escapes would mean decoding them before every other check.\n */\nconst REJECTED_IN_VALUE = [\n 'url(',\n 'expression(',\n 'javascript:',\n 'vbscript:',\n '@',\n '\\\\',\n '<',\n '>',\n '/*',\n '*/',\n];\n\n/** Control characters, and the braces that would end a declaration list. */\n// eslint-disable-next-line no-control-regex -- control characters are what this matches\nconst REJECTED_CHARACTERS = /[\\u0000-\\u001f\\u007f{}]/;\n\n/**\n * React drops `!important` from a style object and warns about it, while the\n * string-based ports would honour it — one authored value behaving differently\n * per platform. It comes off everywhere instead, and the class-names field is\n * the supported way to win a specificity fight.\n */\nconst IMPORTANT_FLAG = /\\s*!\\s*important\\s*$/i;\n\n/** Bounds well past anything typed by hand, so a pasted stylesheet cannot land here. */\nconst MAX_DECLARATIONS = 40;\nconst MAX_VALUE_LENGTH = 400;\n\nconst isUsableProperty = (property: string): boolean =>\n PROPERTY_NAME.test(property) && !REJECTED_PROPERTIES.has(property.toLowerCase());\n\nconst isUsableValue = (value: string): boolean => {\n if (value === '' || value.length > MAX_VALUE_LENGTH) {\n return false;\n }\n if (REJECTED_CHARACTERS.test(value)) {\n return false;\n }\n const lowered = value.toLowerCase();\n return !REJECTED_IN_VALUE.some((rejected) => lowered.includes(rejected));\n};\n\n/**\n * A declaration to the pair it means, or `undefined` when it is malformed or\n * carries something this module will not apply.\n */\nconst parseDeclaration = (declaration: string): StyleDeclaration | undefined => {\n const separator = declaration.indexOf(':');\n if (separator === -1) {\n return undefined;\n }\n\n // Only the first colon splits: `background: linear-gradient(…)` keeps the rest.\n const property = declaration.slice(0, separator).trim();\n const value = declaration.slice(separator + 1).replace(IMPORTANT_FLAG, '').trim();\n\n if (!isUsableProperty(property) || !isUsableValue(value)) {\n return undefined;\n }\n return { property, value };\n};\n\n/**\n * An authored CSS declaration list to the declarations that will be applied.\n *\n * The list is a denylist over values and an allowlist over property names,\n * which is the same shape as `text-safety/validate-text-content.ts` in the\n * composer and for the same reason: a person writing `color: #c00` should never\n * have to think about this function, while the handful of constructs that turn\n * a declaration into a request or a script are named and refused.\n *\n * A rejected declaration costs only itself. `color: red; behavior: url(x)`\n * still sets the colour, because dropping the whole entry over one bad\n * declaration would lose work the author can see is fine.\n */\nexport function parseStyleDeclarations(value: unknown): StyleDeclaration[] {\n if (typeof value !== 'string') {\n return [];\n }\n\n const parsed: StyleDeclaration[] = [];\n const seen = new Set();\n\n for (const declaration of value.split(DECLARATION_SEPARATOR)) {\n if (declaration.trim() === '') {\n continue;\n }\n const pair = parseDeclaration(declaration);\n if (pair === undefined) {\n continue;\n }\n // Last one wins, as it would in a real declaration list.\n if (seen.has(pair.property)) {\n parsed[parsed.findIndex((existing) => existing.property === pair.property)] = pair;\n continue;\n }\n seen.add(pair.property);\n parsed.push(pair);\n if (parsed.length === MAX_DECLARATIONS) {\n break;\n }\n }\n\n return parsed;\n}\n\n/**\n * Declarations back to a CSS string, for the places that want a `style`\n * attribute rather than an object — the composer's editing surface, and the\n * ports whose templates bind a string.\n */\nexport function formatStyleDeclarations(declarations: readonly StyleDeclaration[]): string {\n return declarations.map(({ property, value }) => `${property}: ${value}`).join('; ');\n}\n","import type { CSSProperties } from 'react';\nimport { isSpanStyleItem } from './span-style-item';\nimport type { SpanStyleItem } from './span-style-item';\nimport { resolveClassNames } from './resolve-class-names';\nimport { parseStyleDeclarations } from './parse-style-declarations';\n\n/** The props a styled run's element receives, ready to spread. */\nexport type SpanStyleAttributes = { className?: string; style?: CSSProperties };\n\n/**\n * React wants `fontWeight`, authors write `font-weight`. Custom properties keep\n * their name — React passes `--brand` through untouched — and a vendor prefix\n * loses its leading dash and gains a capital, except `-ms-`, which React spells\n * lowercase.\n */\nconst toReactProperty = (property: string): string => {\n if (property.startsWith('--')) {\n return property;\n }\n\n const isVendorPrefixed = property.startsWith('-');\n const camelCased = (isVendorPrefixed ? property.slice(1) : property).replace(\n /-([a-z])/g,\n (_, letter: string) => letter.toUpperCase()\n );\n\n if (!isVendorPrefixed || camelCased.startsWith('ms')) {\n return camelCased;\n }\n return camelCased.charAt(0).toUpperCase() + camelCased.slice(1);\n};\n\n/**\n * Turns a stored styling entry into element props, or `undefined` when the\n * entry cannot produce any — missing, cleared, or holding nothing that survived\n * the checks in `resolveClassNames` and `parseStyleDeclarations`. Callers render\n * the plain text in that case, exactly as they do for a link that resolves to\n * nothing.\n *\n * Knows nothing about text, markers, or any one component: this is the piece\n * every component rendering inline markup shares.\n */\nexport function resolveSpanStyleAttributes(\n item: SpanStyleItem | undefined\n): SpanStyleAttributes | undefined {\n if (!isSpanStyleItem(item)) {\n return undefined;\n }\n\n const className = resolveClassNames(item.classNames);\n const declarations = parseStyleDeclarations(item.declarations);\n\n if (className === undefined && declarations.length === 0) {\n return undefined;\n }\n\n const style: Record = {};\n declarations.forEach(({ property, value }) => {\n style[toReactProperty(property)] = value;\n });\n\n return {\n ...(className !== undefined ? { className } : {}),\n ...(declarations.length > 0 ? { style: style as CSSProperties } : {}),\n };\n}\n","import { Fragment, createElement, type ReactNode } from 'react';\nimport { getLinkItemAt } from '../links/link-item';\nimport { resolveLinkAttributes } from '../links/resolve-link-attributes';\nimport type { AnchorAttributes } from '../links/resolve-link-attributes';\nimport { getSpanStyleItemAt } from '../span-styles/span-style-item';\nimport { resolveSpanStyleAttributes } from '../span-styles/resolve-span-style-attributes';\nimport type { SpanStyleAttributes } from '../span-styles/resolve-span-style-attributes';\nimport { parseInlineMarkers } from './parse-inline-markers';\nimport type { InlineMarks, MarkupRun, MarkupSpanRun } from './parse-inline-markers';\n\n/**\n * Which element each mark renders as, outermost first.\n *\n * `s` rather than `del`: struck CMS copy is text that no longer applies (an old\n * price), not an edit to the document.\n */\nconst MARK_TAGS: ReadonlyArray = [\n ['bold', 'strong'],\n ['italic', 'em'],\n ['strike', 's'],\n];\n\nconst hasMark = (marks: InlineMarks): boolean => marks.bold || marks.italic || marks.strike;\n\n/**\n * The anchor stays the innermost element, so marks wrap it rather than the\n * other way round — `…`. Keeps the one rule from\n * `INNER_LINK_TAGS_ARCHITECTURE.md` true no matter what else a span carries.\n *\n * A styling entry becomes the outermost element, outside the marks: the marks\n * say what these words *are*, and the styling says how this run of words looks,\n * which is the container of the other two. It also means an author who sets a\n * colour on bold words does not have to know which element the colour lands on.\n */\nconst renderSpan = (\n run: MarkupSpanRun,\n anchor: AnchorAttributes | undefined,\n spanStyle: SpanStyleAttributes | undefined\n): ReactNode => {\n let node: ReactNode = anchor === undefined ? run.text : createElement('a', anchor, run.text);\n\n for (let position = MARK_TAGS.length - 1; position >= 0; position -= 1) {\n const [mark, tag] = MARK_TAGS[position];\n if (run.marks[mark]) {\n node = createElement(tag, null, node);\n }\n }\n\n return spanStyle === undefined ? node : createElement('span', spanStyle, node);\n};\n\n/** What a run contributes when nothing about it needs an element. */\nconst plainTextOf = (run: MarkupRun): string => (run.kind === 'break' ? '' : run.text);\n\n/**\n * Renders authored text with its `{…|…}` markers resolved — marks as elements,\n * indexes against a link list, `.n` against a styling list, `{br|}` as a line\n * break.\n *\n * Every element is phrasing content and sits inside whatever tag the caller\n * wraps this in; nothing here ever becomes the caller's root element, so the\n * wrapper decisions in `MINIMAL_MARKUP_ARCHITECTURE.md` are unaffected.\n *\n * When no run needs an element the return value is a plain string: the same\n * React output as text with no markup support at all. A span whose link or\n * styling entry is missing, cleared, or rejected contributes its text, so a\n * broken reference degrades to prose rather than leaving a `{1|…}` shell,\n * emitting an `` without an `href`, or wrapping words in a `` that\n * carries nothing.\n */\nexport function renderInlineMarkup(\n text: string,\n links: unknown,\n spanStyles?: unknown\n): ReactNode {\n const runs = parseInlineMarkers(text);\n\n const anchors = runs.map((run) =>\n run.kind === 'span' && run.index !== undefined\n ? resolveLinkAttributes(getLinkItemAt(links, run.index))\n : undefined\n );\n\n const spanStyleAttributes = runs.map((run) =>\n run.kind === 'span' && run.styleIndex !== undefined\n ? resolveSpanStyleAttributes(getSpanStyleItemAt(spanStyles, run.styleIndex))\n : undefined\n );\n\n const needsElement = runs.some(\n (run, position) =>\n run.kind === 'break' ||\n (run.kind === 'span' &&\n (anchors[position] !== undefined ||\n spanStyleAttributes[position] !== undefined ||\n hasMark(run.marks)))\n );\n\n if (!needsElement) {\n return runs.map(plainTextOf).join('');\n }\n\n return runs.map((run, position) => {\n if (run.kind === 'text') {\n return run.text;\n }\n if (run.kind === 'break') {\n return
;\n }\n return (\n \n {renderSpan(run, anchors[position], spanStyleAttributes[position])}\n \n );\n });\n}\n","import { DefaultAttributeValue } from '@source-components-react/types';\n\nexport const DEFAULT_CONTENT_TEXT =\n 'This is a text block. Click to edit and add your own content.';\n\nexport const defaultAttributeValues: DefaultAttributeValue[] = [\n {\n name: 'content-text-3-resolutions',\n defaultValues: {\n all: DEFAULT_CONTENT_TEXT,\n },\n },\n {\n name: 'enclosing-tag-3-resolutions',\n defaultValues: {},\n },\n {\n name: 'links-3-resolutions',\n defaultValues: {},\n },\n {\n name: 'inline-styles-3-resolutions',\n defaultValues: {},\n },\n];\n","/**\n * HTML tags the RText component is allowed to enclose its text content in,\n * ordered from most common to least common.\n *\n * Every entry is a standard HTML element that can directly contain text\n * without changing how that text behaves. Deliberately excluded:\n * - Interactive / behavior-changing tags: a, button, label, summary, option,\n * textarea, select, details, dialog\n * - Void elements that cannot enclose text: br, wbr, hr, img, input\n * - Tags only valid inside a specific parent: li, dt, dd, td, th, caption,\n * legend, figcaption, rt, rp, optgroup\n * - Raw-text / metadata tags: script, style, title, template\n * - Live-region / form-output tags that alter assistive-technology behavior:\n * output\n */\nexport const ENCLOSING_TAGS = [\n // Common block-level text containers\n 'p',\n 'div',\n // Generic inline container\n 'span',\n // Headings\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'h5',\n 'h6',\n // Common inline emphasis and importance\n 'strong',\n 'em',\n 'b',\n 'i',\n 'u',\n // Common text presentation\n 'small',\n 'mark',\n // Preformatted and code text\n 'pre',\n 'code',\n // Quotations\n 'blockquote',\n 'q',\n // Subscript and superscript\n 'sub',\n 'sup',\n // Edits and strikethrough\n 's',\n 'del',\n 'ins',\n // Citations, definitions and abbreviations\n 'cite',\n 'abbr',\n 'dfn',\n // Computer I/O text\n 'kbd',\n 'samp',\n 'var',\n // Machine-readable text\n 'time',\n 'data',\n // Contact information\n 'address',\n // Bidirectional text\n 'bdi',\n 'bdo',\n // Sectioning and grouping containers\n 'figure',\n 'article',\n 'section',\n 'aside',\n 'header',\n 'footer',\n 'main',\n 'nav',\n] as const;\n\nexport type EnclosingTag = (typeof ENCLOSING_TAGS)[number];\n\n/**\n * The tags above whose default CSS display is block-level.\n *\n * Box styles — margin, padding, width, border — behave as authored on these\n * elements, so RText can carry the column's styles on the tag itself and\n * needs no wrapper div (see `resolve-no-container.ts`).\n */\nexport const BLOCK_ENCLOSING_TAGS: readonly EnclosingTag[] = [\n 'p',\n 'div',\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'h5',\n 'h6',\n 'pre',\n 'blockquote',\n 'address',\n 'figure',\n 'article',\n 'section',\n 'aside',\n 'header',\n 'footer',\n 'main',\n 'nav',\n];\n\n/**\n * The tags above that default to `display: inline`, where vertical\n * margin/padding and width/height are ignored by the layout engine. Column\n * box styles must go on a wrapper element instead of on the tag.\n *\n * Kept as an explicit list rather than derived from BLOCK_ENCLOSING_TAGS so\n * adding a tag to ENCLOSING_TAGS forces a deliberate block-or-inline call;\n * the coverage test in `__tests__/enclosing-tags.test.ts` fails otherwise.\n */\nexport const INLINE_ENCLOSING_TAGS: readonly EnclosingTag[] = [\n 'span',\n 'strong',\n 'em',\n 'b',\n 'i',\n 'u',\n 'small',\n 'mark',\n 'code',\n 'q',\n 'sub',\n 'sup',\n 's',\n 'del',\n 'ins',\n 'cite',\n 'abbr',\n 'dfn',\n 'kbd',\n 'samp',\n 'var',\n 'time',\n 'data',\n 'bdi',\n 'bdo',\n];\n\n/**\n * Runtime guard for values arriving through componentAttributes (untyped\n * editor-authored data). Unknown values are rejected so a bad persisted value\n * can never render an unexpected element.\n */\nexport function isEnclosingTag(value: unknown): value is EnclosingTag {\n return (\n typeof value === 'string' &&\n (ENCLOSING_TAGS as readonly string[]).includes(value)\n );\n}\n\n/**\n * True when the tag renders as a block-level box. Unknown values count as\n * non-block: the safe answer, because it routes box styles to a wrapper\n * element where they are guaranteed to apply.\n */\nexport function isBlockEnclosingTag(value: unknown): boolean {\n return (\n isEnclosingTag(value) &&\n (BLOCK_ENCLOSING_TAGS as readonly string[]).includes(value)\n );\n}\n","import { isEnclosingTag } from './enclosing-tags';\nimport type { EnclosingTag } from './enclosing-tags';\n\n/** Editor-authored attribute holding the tag, flattened per device resolution. */\nexport const ENCLOSING_TAG_ATTRIBUTE = 'enclosing-tag-3-resolutions';\n\n/**\n * The single source of truth for which tag RText will render.\n *\n * Both the component and `resolveNoContainer` go through here: if they\n * disagreed, widget-react would wrap a block element in a redundant div or\n * hand box styles to an inline element that ignores them.\n *\n * The editor-authored attribute wins over the caller's prop. Attribute values\n * are untyped, so an unrecognised value falls back to the prop, then to no\n * enclosing tag at all.\n */\nexport function resolveEnclosingTag(\n componentAttributes?: { [key: string]: any },\n fallback?: EnclosingTag\n): EnclosingTag | undefined {\n const userAssignedTag = componentAttributes?.[ENCLOSING_TAG_ATTRIBUTE];\n return isEnclosingTag(userAssignedTag) ? userAssignedTag : fallback;\n}\n","import React from 'react';\nimport { renderInlineMarkup } from '@source-components-react/shared/inline-markup';\nimport { DEFAULT_CONTENT_TEXT } from './default-attribute-values';\nimport { resolveEnclosingTag } from './resolve-enclosing-tag';\nimport type { EnclosingTag } from './enclosing-tags';\n\nexport function RText({\n enclosingTag,\n componentAttributes,\n styleProps,\n className,\n}: Readonly<{\n /**\n * HTML tag to enclose the text in (e.g. 'p', 'h1', 'span'). Restricted to\n * tags that hold text without changing its behavior. When omitted the text\n * renders bare, exactly as before this attribute existed.\n */\n enclosingTag?: EnclosingTag;\n componentAttributes?: { [key: string]: any };\n /**\n * Column styles from the widget pipeline. Applied to the enclosing tag when\n * there is one; bare text has no element to carry them, in which case\n * `resolveNoContainer` has already told widget-react to use a wrapper div.\n */\n styleProps?: { [key: string]: any };\n /**\n * Host-app classes for this column, when the renderer decided this card\n * carries them. Applied to the enclosing tag; ignored for bare text (the\n * renderer has already taken responsibility for the class).\n */\n className?: string;\n}>) {\n const contentVal =\n componentAttributes?.['content-text-3-resolutions'] ?? DEFAULT_CONTENT_TEXT;\n\n // Marks (`{b|word}`), line breaks (`{br|}`), and the two index markers —\n // `{n|…}` into the link list and `{.n|…}` into the styling list — both by\n // 1-based position. Everything the markup emits is phrasing content inside\n // the enclosing tag, never around it.\n const content =\n typeof contentVal === 'string'\n ? renderInlineMarkup(\n contentVal,\n componentAttributes?.['links-3-resolutions'],\n componentAttributes?.['inline-styles-3-resolutions']\n )\n : contentVal;\n\n const tag = resolveEnclosingTag(componentAttributes, enclosingTag);\n\n if (tag) {\n return React.createElement(\n tag,\n className !== undefined ? { style: styleProps, className } : { style: styleProps },\n content\n );\n }\n return content;\n}\n","import type { NoContainerResolverContext } from '@source-components-react/types';\nimport { isBlockEnclosingTag } from './enclosing-tags';\nimport { resolveEnclosingTag } from './resolve-enclosing-tag';\n\n/**\n * RText needs a wrapper div for the column's box styles unless it is about to\n * render a block-level element that can hold those styles itself.\n *\n * - No enclosing tag: bare text with no element to style → wrapper needed.\n * - Inline tag (`span`, `em`, `code`, …): vertical margin/padding and width\n * are ignored on inline boxes → wrapper needed.\n * - Block tag (`p`, `div`, `h1`, `section`, …): RText puts styleProps on the\n * tag itself → no wrapper, one less element in the DOM.\n */\nexport const resolveNoContainer = ({\n componentAttributes,\n}: NoContainerResolverContext): boolean =>\n !isBlockEnclosingTag(resolveEnclosingTag(componentAttributes));\n","type ComponentIdentifier =\n | 'r-text'\n | 'something-else'\n | 'cloudinary-advanced-image'\n | 'r-video'\n | 'r-icon'\n | 'r-button'\n | 'r-divider'\n | 'r-embed'\n | 'r-list'\n | 'r-accordion'\n | 'r-mount';\n\nexport const ComponentIdentifiers: Record = {\n rText: 'r-text',\n somethingElse: 'something-else',\n cloudinaryAdvancedImage: 'cloudinary-advanced-image',\n rVideo: 'r-video',\n rIcon: 'r-icon',\n rButton: 'r-button',\n rDivider: 'r-divider',\n rEmbed: 'r-embed',\n rList: 'r-list',\n rAccordion: 'r-accordion',\n rMount: 'r-mount',\n} as const;\n","import { RText } from './RText';\nimport { resolveNoContainer } from './resolve-no-container';\nimport { resolveRendersOwnElement } from './resolve-renders-own-element';\nimport { defaultAttributeValues } from './default-attribute-values';\nimport { attributeEditModeConfigs } from './attribute-edit-mode-configs';\nimport type { DisplayCardEntry } from '@source-components-react/types';\nimport { ComponentIdentifiers } from '@source-components-react/component-identifiers';\n\nexport const displayCardEntry: DisplayCardEntry = {\n id: ComponentIdentifiers.rText,\n resolveNoContainer,\n resolveRendersOwnElement,\n card: ({\n componentAttributes,\n styleProps,\n className,\n }: {\n componentAttributes?: { [key: string]: any };\n styleProps?: { [key: string]: any };\n className?: string;\n }) => (\n \n ),\n defaultAttributeValues,\n attributeEditModeConfigs,\n};\n","import type { NoContainerResolverContext } from '@source-components-react/types';\nimport { resolveEnclosingTag } from './resolve-enclosing-tag';\n\n/**\n * True when RText is about to render an element that can carry a className —\n * any enclosing tag, block or inline. Bare text has no element, so false.\n *\n * Shares `resolveEnclosingTag` with RText and `resolveNoContainer`: if this\n * disagreed with what the component renders, a class would either land on\n * nothing or force a redundant wrapper.\n */\nexport const resolveRendersOwnElement = ({\n componentAttributes,\n}: NoContainerResolverContext): boolean => !!resolveEnclosingTag(componentAttributes);\n","import { AttributeEditModeConfig } from '@source-components-react/types';\n\nexport const attributeEditModeConfigs: AttributeEditModeConfig[] = [\n {\n name: 'content-text-3-resolutions',\n defaultValues: {},\n },\n {\n name: 'enclosing-tag-3-resolutions',\n heading: 'Enclosing Tag',\n subHeading:\n 'HTML tag to enclose the text in (e.g. p, h1, span); see ENCLOSING_TAGS for the allowed values, for 3 different device resolutions',\n defaultValues: {},\n },\n {\n name: 'links-3-resolutions',\n heading: 'Links',\n subHeading:\n 'Links this text can point at. To link part of the text, wrap those words in {1|linked text}, where the number is the position of the entry in this list counting from 1; clearing an entry leaves its position in place so the other numbers keep pointing where they did, for 3 different device resolutions',\n defaultValues: {},\n },\n {\n name: 'inline-styles-3-resolutions',\n heading: 'Class Names & Styles',\n subHeading:\n 'Class names and CSS this text can apply to part of itself, e.g. to give a few words their own colour. To apply an entry, wrap those words in {.1|styled text}, where the number is the position of the entry in this list counting from 1; clearing an entry leaves its position in place so the other numbers keep pointing where they did, for 3 different device resolutions',\n defaultValues: {},\n },\n];\n","// Builds Cloudinary delivery URLs directly so the component renders a complete\n// during server rendering (no browser-only Cloudinary SDK).\n// `f_auto,q_auto` lets Cloudinary pick format/quality; `c_limit` scales down\n// but never upscales beyond the original asset.\n\n// A Cloudinary transformation component as an object, e.g.\n// { c: 'fill', g: 'auto', ar: '4:3' } serializes to \"c_fill,g_auto,ar_4:3\"\nexport type CloudinaryTransformations = { [key: string]: string | number };\n\n// Covers phone through large desktop displays, including 2x DPR on common\n// viewport widths. Upper bound keeps multi-thousand-pixel originals in check.\nexport const cloudinarySrcSetWidths = [480, 768, 1080, 1600, 2400];\n\n// Mid-size fallback for browsers/tools that ignore srcset.\nconst fallbackSrcWidth = 1080;\n\nconst defaultTransformations: CloudinaryTransformations = {\n f: 'auto',\n q: 'auto',\n c: 'limit',\n};\n\nfunction serializeTransformations(transformations: CloudinaryTransformations): string {\n return Object.entries(transformations)\n .map(([key, value]) => `${key}_${value}`)\n .join(',');\n}\n\n// Accepts the raw Cloudinary string form (\"c_fill,g_auto,ar_4:3\") and parses\n// it into an object so it merges over the defaults the same way object input\n// does (e.g. a user c_fill cleanly replaces the default c_limit)\nfunction parseTransformationString(value: string): CloudinaryTransformations {\n const result: CloudinaryTransformations = {};\n value.split(',').forEach((entry) => {\n const trimmed = entry.trim();\n if (!trimmed) {\n return;\n }\n const separatorIndex = trimmed.indexOf('_');\n if (separatorIndex <= 0) {\n return;\n }\n result[trimmed.slice(0, separatorIndex)] = trimmed.slice(separatorIndex + 1);\n });\n return result;\n}\n\nfunction buildCloudinaryImageUrl(\n cloudName: string,\n publicId: string,\n width: number,\n transformations?: CloudinaryTransformations | string\n): string {\n const userTransformations =\n typeof transformations === 'string'\n ? parseTransformationString(transformations)\n : transformations;\n\n // User keys override defaults (object spread = \"split the object onto the\n // configuration\"). `w` is always component-managed so srcset width variants\n // stay correct; combined with user ar/c/g values Cloudinary produces\n // consistent crops at every width.\n const merged: CloudinaryTransformations = {\n ...defaultTransformations,\n ...userTransformations,\n w: width,\n };\n\n // encodeURI preserves the slashes that are part of Cloudinary public IDs\n // (e.g. \"images//\") while escaping unsafe characters\n return encodeURI(\n `https://res.cloudinary.com/${cloudName}/image/upload/${serializeTransformations(merged)}/${publicId}`\n );\n}\n\nexport function buildCloudinarySrc(\n cloudName: string,\n publicId: string,\n transformations?: CloudinaryTransformations | string\n): string {\n return buildCloudinaryImageUrl(cloudName, publicId, fallbackSrcWidth, transformations);\n}\n\nexport function buildCloudinarySrcSet(\n cloudName: string,\n publicId: string,\n transformations?: CloudinaryTransformations | string\n): string {\n return cloudinarySrcSetWidths\n .map((width) => `${buildCloudinaryImageUrl(cloudName, publicId, width, transformations)} ${width}w`)\n .join(', ');\n}\n","import { buildCloudinarySrc, buildCloudinarySrcSet } from './build-cloudinary-image-urls';\nimport type { CloudinaryTransformations } from './build-cloudinary-image-urls';\n\nexport function CloudinaryAdvancedImage({\n cloudName = 'rulecms',\n publicId = 'main-sample',\n alt = 'RuleCMS Component',\n transformations,\n componentAttributes,\n styleProps = {},\n className,\n}: Readonly<{\n cloudName?: string;\n publicId?: string;\n alt?: string;\n // Extra Cloudinary transformations merged over the defaults (f_auto,q_auto,c_limit).\n // Object form { c: 'fill', g: 'auto' } or raw string form 'c_fill,g_auto'.\n transformations?: CloudinaryTransformations | string;\n componentAttributes?: { [key: string]: any };\n styleProps?: { [key: string]: any };\n /**\n * Host-app classes for this column, when the renderer decided this card\n * carries them. Concatenated after any pass-through-image-attributes-className.\n */\n className?: string;\n}>) {\n // Get values from component attributes if provided\n // Priority: media-selector-3-resolutions > cloudinary-public-id > default publicId prop\n const userCloudName = componentAttributes?.['cloudinary-cloud-name'];\n const mediaSelectorPublicId = componentAttributes?.['media-selector-3-resolutions'];\n const userPublicId = componentAttributes?.['cloudinary-public-id'];\n\n const finalCloudName = userCloudName || cloudName;\n const finalPublicId = mediaSelectorPublicId || userPublicId || publicId;\n\n // Editor-authored transformations (per-device, flattened by the widget\n // pipeline) take precedence over the prop from the calling component\n const componentTransformations = componentAttributes?.['cloudinary-transformations-3-resolutions'];\n const finalTransformations = componentTransformations || transformations;\n\n // Extract pass-through props for the img element\n // Convention:\n // - 'pass-through-image-attributes-style-' prefix for style properties\n // - 'pass-through-image-attributes-' prefix for other HTML attributes\n // alt priority: pass-through-image-attributes-alt (editor-authored, applied\n // in the loop below) > alt prop (calling component) > 'RuleCMS Component' default\n const imageAttributes: { [key: string]: any } = {\n alt,\n // Safe default; pass-through attributes can override. loading=\"lazy\" stays\n // opt-in via pass-through because lazy-loading an LCP image hurts paint.\n decoding: 'async',\n // Generic default so srcset has a baseline; editors/consumers should\n // override via 'pass-through-image-attributes-sizes' when the rendered\n // width is known.\n sizes: '100vw',\n };\n\n const imageStyles: { [key: string]: any } = {\n height: 'auto',\n };\n\n if (componentAttributes) {\n Object.keys(componentAttributes).forEach((keyWithDimensionSuffix) => {\n const value = componentAttributes[keyWithDimensionSuffix];\n\n // Unset attributes arrive as undefined entries (the device-type\n // flattening keeps the key); skip them so defaults are not clobbered.\n // Empty string is kept — alt=\"\" is meaningful for decorative images.\n if (value === undefined || value === null) {\n return;\n }\n\n // Remove the -3-resolutions suffix if it exists\n const key = keyWithDimensionSuffix.endsWith('-3-resolutions')\n ? keyWithDimensionSuffix.slice(0, -'-3-resolutions'.length)\n : keyWithDimensionSuffix;\n\n // Handle style attributes\n if (key.startsWith('pass-through-image-attributes-style-')) {\n const styleProp = key.slice('pass-through-image-attributes-style-'.length)\n imageStyles[styleProp] = value;\n }\n\n // Handle other HTML attributes (className, alt, id, loading, sizes, width, height, etc.)\n else if (key.startsWith('pass-through-image-attributes-')) {\n const attributeName = key.slice('pass-through-image-attributes-'.length);\n imageAttributes[attributeName] = value;\n }\n });\n }\n\n // Column className comes last so host utilities can override pass-through\n // classes from the editor. Omit the attribute entirely when neither is set.\n const { className: passThroughClassName, ...restImageAttributes } = imageAttributes;\n const mergedClassName = [passThroughClassName, className].filter(Boolean).join(' ') || undefined;\n\n // Plain with Cloudinary delivery URLs built directly: renders complete\n // markup (src + responsive srcset) on the server, so widget images appear in\n // server-generated HTML and each device downloads one right-sized asset\n return (\n \n );\n}\n","/**\n * The component spreads styleProps onto its ``, a replaced element that\n * honors min/max sizing, margin and padding directly — a wrapper div would\n * only add a redundant element. There is no configuration that changes this,\n * so the answer is the same for every render.\n */\nexport const resolveNoContainer = (): boolean => false;\n","import { CloudinaryAdvancedImage } from './CloudinaryAdvancedImage';\nimport { resolveNoContainer } from './resolve-no-container';\nimport { resolveRendersOwnElement } from './resolve-renders-own-element';\nimport { defaultAttributeValues } from './default-attribute-values';\nimport { attributeEditModeConfigs } from './attribute-edit-mode-configs';\nimport type { DisplayCardEntry } from '@source-components-react/types';\nimport { ComponentIdentifiers } from '@source-components-react/component-identifiers';\n\nexport const displayCardEntry: DisplayCardEntry = {\n id: ComponentIdentifiers.cloudinaryAdvancedImage,\n resolveNoContainer,\n resolveRendersOwnElement,\n card: ({\n componentAttributes,\n styleProps,\n className,\n }: {\n componentAttributes?: { [key: string]: any };\n styleProps?: { [key: string]: any };\n className?: string;\n }) => (\n \n ),\n defaultAttributeValues,\n attributeEditModeConfigs,\n};\n","/**\n * Always renders an ``, which can carry a className. There is no\n * configuration that changes this.\n */\nexport const resolveRendersOwnElement = (): boolean => true;\n","import { DefaultAttributeValue } from '@source-components-react/types';\n\nexport const defaultAttributeValues: DefaultAttributeValue[] = [\n {\n name: 'cloudinary-cloud-name',\n defaultValues: {},\n },\n {\n name: 'cloudinary-public-id',\n defaultValues: {},\n },\n {\n name: 'media-selector-3-resolutions',\n defaultValues: {\n all: 'main-sample',\n },\n },\n {\n name: 'pass-through-image-attributes-alt-3-resolutions',\n defaultValues: {},\n },\n {\n name: 'pass-through-image-attributes-width-3-resolutions',\n defaultValues: {},\n },\n {\n name: 'pass-through-image-attributes-height-3-resolutions',\n defaultValues: {},\n },\n {\n name: 'pass-through-image-attributes-sizes-3-resolutions',\n defaultValues: {},\n },\n {\n name: 'pass-through-image-attributes-loading-3-resolutions',\n defaultValues: {},\n },\n {\n name: 'pass-through-image-attributes-fetchpriority-3-resolutions',\n defaultValues: {},\n },\n {\n name: 'cloudinary-transformations-3-resolutions',\n defaultValues: {},\n },\n];\n","import { AttributeEditModeConfig } from '@source-components-react/types';\n\nexport const attributeEditModeConfigs: AttributeEditModeConfig[] = [\n {\n name: 'cloudinary-cloud-name',\n heading: 'Cloudinary Cloud Name',\n subHeading: 'Set the Cloudinary cloud name for 3 different device resolutions',\n defaultValues: {},\n // Filled by Media Selector / team defaults — not something marketers edit by hand.\n hiddenToUser: true,\n },\n {\n name: 'cloudinary-public-id',\n heading: 'Image Public ID',\n subHeading: 'Set the Cloudinary image public ID for 3 different device resolutions',\n defaultValues: {},\n // Filled by Media Selector — not something marketers edit by hand.\n hiddenToUser: true,\n },\n {\n name: 'media-selector-3-resolutions',\n heading: 'Media Selector',\n subHeading: 'Select media for 3 different device resolutions',\n defaultValues: {},\n },\n {\n name: 'pass-through-image-attributes-alt-3-resolutions',\n heading: 'Image Alt Text',\n subHeading: 'Set the image alt text for 3 different device resolutions',\n defaultValues: {},\n },\n {\n name: 'pass-through-image-attributes-width-3-resolutions',\n heading: 'Image Intrinsic Width',\n subHeading: 'Set the intrinsic pixel width (with height, reserves layout space before the image loads) for 3 different device resolutions',\n defaultValues: {},\n },\n {\n name: 'pass-through-image-attributes-height-3-resolutions',\n heading: 'Image Intrinsic Height',\n subHeading: 'Set the intrinsic pixel height (with width, reserves layout space before the image loads) for 3 different device resolutions',\n defaultValues: {},\n },\n {\n name: 'pass-through-image-attributes-sizes-3-resolutions',\n heading: 'Image Sizes',\n subHeading: 'Set the sizes attribute (e.g. \"(max-width: 600px) 100vw, 600px\") so the browser downloads the right srcset variant, for 3 different device resolutions',\n defaultValues: {},\n },\n {\n name: 'pass-through-image-attributes-loading-3-resolutions',\n heading: 'Image Loading',\n subHeading: 'Set to \"lazy\" for below-the-fold images (never for the main hero image), for 3 different device resolutions',\n defaultValues: {},\n },\n {\n name: 'pass-through-image-attributes-fetchpriority-3-resolutions',\n heading: 'Image Fetch Priority',\n subHeading: 'Set to \"high\" for the most important image on the page (e.g. the hero), for 3 different device resolutions',\n defaultValues: {},\n },\n {\n name: 'cloudinary-transformations-3-resolutions',\n heading: 'Cloudinary Transformations',\n subHeading: 'Set extra Cloudinary transformations (e.g. \"c_fill,g_auto,ar_4:3\"); merged over the defaults f_auto,q_auto,c_limit, for 3 different device resolutions',\n defaultValues: {},\n },\n];\n","// Builds media-host delivery URLs directly so the component renders a complete\n//