@miliastry/quasar 1.0.0

package/src/Tests/StableNodeIds.test.ts

@@ -0,0 +1,210 @@
+import { describe, it, expect } from 'vitest'
+import { BBCodeDocumentModel } from '../BBCode/BBCodeDocumentModel'
+import { HTMLRenderer } from '../Visitors/HTMLRenderer'
+import { morphHTML } from '../Visitors/DOMMorpher'
+import type { RedNode } from '../Syntax/RedNode'
+
+/**
+ * Node ids must survive a reparse for every node that did not change.
+ *
+ * Ids are embedded in the rendered HTML as `data-node-id` (the preview→Monaco
+ * click mapping reads them), so regenerating them on every parse made the HTML
+ * of *unchanged* subtrees differ between keystrokes — which defeated the
+ * DOMMorpher's isEqualNode fast path and rewrote DOM the user was looking at.
+ *
+ * The last test is the end-to-end payoff: after a one-character edit, the DOM
+ * elements of untouched content must keep their object identity through a
+ * morph, because their HTML is now byte-identical.
+ */
+
+/** Map every text node's content to its id (text content identifies the leaf). */
+function textIds(root: RedNode): Map<string, string> {
+  const out = new Map<string, string>()
+  root.walk(n => {
+    if (n.kind === 'text' && n.text.trim() !== '') out.set(n.text, String(n.id))
+  })
+  return out
+}
+
+function subtreeText(node: RedNode): string {
+  let out = ''
+  node.walk(n => { if (n.kind === 'text') out += n.text })
+  return out
+}
+
+function allIds(root: RedNode): string[] {
+  const out: string[] = []
+  root.walk(n => { out.push(String(n.id)) })
+  return out
+}
+
+function mulberry32(seed: number): () => number {
+  let a = seed >>> 0
+  return () => {
+    a |= 0; a = (a + 0x6D2B79F5) | 0
+    let t = Math.imul(a ^ (a >>> 15), 1 | a)
+    t = (t + Math.imul(t ^ (t >>> 7), 61 | t)) ^ t
+    return ((t ^ (t >>> 14)) >>> 0) / 4294967296
+  }
+}
+
+describe('stable node ids across reparses', () => {
+  it('an edit in the middle keeps the ids of untouched content (incremental path)', () => {
+    const model = new BBCodeDocumentModel({
+      source: 'uno\n\ndos\n\ntres\n\n[b]cuatro[/b]',
+    })
+    const before = textIds(model.redRoot!)
+
+    model.applyTextUpdate('uno\n\ndos EDITADO\n\ntres\n\n[b]cuatro[/b]')
+    const after = textIds(model.redRoot!)
+
+    expect(after.get('uno')).toBe(before.get('uno'))
+    expect(after.get('tres')).toBe(before.get('tres'))
+    expect(after.get('cuatro')).toBe(before.get('cuatro'))
+  })
+
+  it('typing at the end keeps every previous id', () => {
+    const model = new BBCodeDocumentModel({
+      source: 'uno\n\n[i]dos[/i]\n\ntres',
+    })
+    const before = textIds(model.redRoot!)
+
+    model.applyTextUpdate('uno\n\n[i]dos[/i]\n\ntres y algo mas')
+    const after = textIds(model.redRoot!)
+
+    expect(after.get('uno')).toBe(before.get('uno'))
+    expect(after.get('dos')).toBe(before.get('dos'))
+  })
+
+  it('a full rebuild also preserves ids, via hash matching', () => {
+    const model = new BBCodeDocumentModel({
+      source: 'uno\n\ndos\n\n[b]tres[/b]',
+    })
+    const before = textIds(model.redRoot!)
+
+    // rebuild() reparses everything: no green is shared by reference, so this
+    // exercises the hash-verified tier.
+    model.rebuild('uno\n\ndos!\n\n[b]tres[/b]')
+    const after = textIds(model.redRoot!)
+
+    expect(after.get('uno')).toBe(before.get('uno'))
+    expect(after.get('tres')).toBe(before.get('tres'))
+  })
+
+  it('ids stay unique through seeded random edit sequences', () => {
+    const rand = mulberry32(1234)
+    const alphabet = ['a', ' ', '\n', '[', ']', 'b', '[b]', '[/b]', '[i]', '[/i]', '[list]', '[*]']
+
+    for (let doc = 0; doc < 8; doc++) {
+      let source = ''
+      const parts = 40 + Math.floor(rand() * 120)
+      for (let i = 0; i < parts; i++) {
+        source += alphabet[Math.floor(rand() * alphabet.length)]
+      }
+      const model = new BBCodeDocumentModel({ source })
+
+      for (let edit = 0; edit < 25; edit++) {
+        const pos = Math.floor(rand() * (model.source.length + 1))
+        const insert = alphabet[Math.floor(rand() * alphabet.length)]
+        const next = rand() < 0.75
+          ? model.source.slice(0, pos) + insert + model.source.slice(pos)
+          : model.source.slice(0, pos) + model.source.slice(Math.min(pos + 1, model.source.length))
+        model.applyTextUpdate(next)
+
+        const ids = allIds(model.redRoot!)
+        expect(new Set(ids).size).toBe(ids.length)
+        expect(model.redRoot!.green).toBe(model.greenRoot)
+      }
+    }
+  })
+
+  it('inserting a block does not renumber the blocks that survive it', () => {
+    // Regression. Identity is carried either by red-subtree REUSE (the nodes
+    // are the previous objects) or by the id walk (every node is fresh) —
+    // never both. When both ran, the walk paired positionally, so inserting a
+    // block made each survivor pair with its NEIGHBOUR: it overwrote a live
+    // node's id with a different node's, which both duplicated ids and
+    // changed `data-node-id` on blocks that had not changed — defeating the
+    // morpher's fast path exactly when it matters most.
+    let src = ''
+    for (let i = 0; i < 40; i++) src += `[notice]bloque ${i}[/notice]\n\n`
+    const model = new BBCodeDocumentModel({ source: src })
+
+    const idOf = (root: RedNode, text: string): string | null => {
+      let found: string | null = null
+      root.walk(n => {
+        if (!found && n.kind === 'notice' && n.text === '' && subtreeText(n).includes(text)) {
+          found = String(n.id)
+        }
+      })
+      return found
+    }
+    const before10 = idOf(model.redRoot!, 'bloque 10')
+    const before39 = idOf(model.redRoot!, 'bloque 39')
+    expect(before10).toBeTruthy()
+
+    // Insert a whole new block near the start: everything after it shifts.
+    model.applyTextUpdate('[notice]NUEVO[/notice]\n\n' + src)
+
+    expect(idOf(model.redRoot!, 'bloque 10')).toBe(before10)
+    expect(idOf(model.redRoot!, 'bloque 39')).toBe(before39)
+
+    const ids = allIds(model.redRoot!)
+    expect(new Set(ids).size).toBe(ids.length)
+  })
+
+  it('end to end: untouched id-bearing blocks keep DOM identity through a morph', () => {
+    // Only block containers carry data-node-id (see HTMLRenderer.ID_BEARING_KINDS),
+    // so blocks are where id churn used to break the morpher's fast path.
+    const model = new BBCodeDocumentModel({
+      source: '[notice]uno[/notice]\n\n[quote]dos[/quote]\n\n[notice]tres[/notice]',
+    })
+    const renderer = new HTMLRenderer()
+    const el = document.createElement('div')
+    el.innerHTML = renderer.render(model.redRoot!)
+
+    const findBlock = (text: string): Element | null => {
+      for (const block of Array.from(el.querySelectorAll('[data-node-id]'))) {
+        if (block.textContent?.includes(text)) return block
+      }
+      return null
+    }
+
+    const unoBefore = findBlock('uno')
+    const tresBefore = findBlock('tres')
+    expect(unoBefore).toBeTruthy()
+    expect(tresBefore).toBeTruthy()
+    const unoId = unoBefore!.getAttribute('data-node-id')
+    const tresId = tresBefore!.getAttribute('data-node-id')
+
+    model.applyTextUpdate('[notice]uno[/notice]\n\n[quote]dos EDITADO[/quote]\n\n[notice]tres[/notice]')
+    morphHTML(el, renderer.render(model.redRoot!))
+
+    // Same DOM objects, not equivalent ones: their HTML — ids included — did
+    // not change, so the morpher's isEqualNode fast path skipped them.
+    expect(findBlock('uno')).toBe(unoBefore)
+    expect(findBlock('tres')).toBe(tresBefore)
+    expect(unoBefore!.getAttribute('data-node-id')).toBe(unoId)
+    expect(tresBefore!.getAttribute('data-node-id')).toBe(tresId)
+    // And the edited block is actually updated.
+    expect(findBlock('dos EDITADO')).toBeTruthy()
+  })
+
+  it('every data-node-id in fresh HTML resolves to a node in the current tree', () => {
+    const model = new BBCodeDocumentModel({
+      source: '[notice]uno[/notice]\n\n[list][*]dos[*]tres[/list]',
+    })
+    model.applyTextUpdate('[notice]uno![/notice]\n\n[list][*]dos[*]tres[/list]')
+
+    const html = new HTMLRenderer().render(model.redRoot!)
+    const el = document.createElement('div')
+    el.innerHTML = html
+
+    const withIds = Array.from(el.querySelectorAll('[data-node-id]'))
+    expect(withIds.length).toBeGreaterThan(0)
+    for (const node of withIds) {
+      const id = node.getAttribute('data-node-id')!
+      expect(model.findNode(id as never)).toBeTruthy()
+    }
+  })
+})

package/src/Tests/StudioColorBloat.test.ts

@@ -0,0 +1,25 @@
+import { describe, it, expect } from 'vitest'
+import { TagRegistry } from '../Model/TagRegistry'
+import { BBCodeExporter } from '../Visitors/BBCodeExporter'
+import { processStudioAST } from '@miliastry/quasar-studio'
+
+describe('Studio Effects Color Bloat', () => {
+  it('should remove redundant outer color tags when a gradient is applied', () => {
+    const text = "[color=#000000]Hello[/color]"
+
+    const layers = [
+      { id: 'grad', type: 'gradient', enabled: true, value: 100, properties: { color1: '#ff0000', color2: '#0000ff' }, colors: '#ff0000,#0000ff', opacity: 1.0, easing: 'linear' }
+    ]
+
+    const registry = new TagRegistry()
+    const { redRoot } = processStudioAST(text, layers as any, {})
+    
+    const exporter = new BBCodeExporter(registry)
+    const exportedBBCode = exporter.export(redRoot)
+
+    // The output should NOT contain [color=#000000]
+    expect(exportedBBCode).not.toContain('#000000')
+    // It should ONLY contain the gradient colors
+    expect(exportedBBCode).toContain('#ff0000')
+  })
+})

package/src/Tests/StudioDebugText.test.ts

@@ -0,0 +1,27 @@
+import { describe, it } from 'vitest'
+import { TagRegistry } from '../Model/TagRegistry'
+import { BBCodeExporter } from '../Visitors/BBCodeExporter'
+import { processStudioAST } from '@miliastry/quasar-studio'
+
+describe('Studio Effects Debug Text', () => {
+  it('should print exported BBCode for debugging', () => {
+    const text = "Hello World\nTest\n\nDouble newline."
+
+    const layers = [
+      { id: 'grad', type: 'gradient', active: true, value: 100, properties: { color1: '#ff0000', color2: '#0000ff' } }
+    ]
+
+    const registry = new TagRegistry()
+    const { redRoot } = processStudioAST(text, layers as any, {})
+    
+    const exporter = new BBCodeExporter(registry)
+    const exportedBBCode = exporter.export(redRoot)
+
+    console.log("================================")
+    console.log("ORIGINAL TEXT:")
+    console.log(JSON.stringify(text))
+    console.log("EXPORTED BBCODE:")
+    console.log(JSON.stringify(exportedBBCode))
+    console.log("================================")
+  })
+})

package/src/Tests/StudioTrailingChar.test.ts

@@ -0,0 +1,25 @@
+import { describe, it, expect } from 'vitest'
+import { TagRegistry } from '../Model/TagRegistry'
+import { BBCodeExporter } from '../Visitors/BBCodeExporter'
+import { processStudioAST } from '@miliastry/quasar-studio'
+
+describe('Studio Effects Trailing Char Bug', () => {
+  it('should not duplicate trailing braille blanks', () => {
+    const text = "[notice]Hello⠀[/notice]"
+
+    const layers = [
+      { id: 'grad', type: 'gradient', enabled: true, value: 100, properties: { color1: '#ff0000', color2: '#0000ff' }, colors: '#ff0000,#0000ff', opacity: 1.0, easing: 'linear' }
+    ]
+
+    const registry = new TagRegistry()
+    const { redRoot } = processStudioAST(text, layers as any, {})
+    
+    const exporter = new BBCodeExporter(registry)
+    const exportedBBCode = exporter.export(redRoot)
+
+    console.log("EXPORTED:", JSON.stringify(exportedBBCode))
+    
+    // Ensure we don't have an extra braille blank at the end
+    expect(exportedBBCode.match(/⠀/g)?.length).toBe(1)
+  })
+})

package/src/Tests/StudioValidText.test.ts

@@ -0,0 +1,25 @@
+import { describe, it, expect } from 'vitest'
+import { TagRegistry } from '../Model/TagRegistry'
+import { BBCodeExporter } from '../Visitors/BBCodeExporter'
+import { processStudioAST } from '@miliastry/quasar-studio'
+
+describe('Studio Effects Valid Structure', () => {
+  it('should not alter structure of valid bbcode', () => {
+    const text = "[notice]\n  [box=Hello]\n    [centre]Content[/centre]\n  [/box]\n[/notice]"
+
+    const layers = [
+      { id: 'grad', type: 'gradient', active: true, value: 100, properties: { color1: '#ff0000', color2: '#0000ff' } }
+    ]
+
+    const registry = new TagRegistry()
+    const { redRoot } = processStudioAST(text, layers as any, {})
+    
+    const exporter = new BBCodeExporter(registry)
+    const exportedBBCode = exporter.export(redRoot)
+
+    // Strip colors to verify exact match
+    const stripped = exportedBBCode.replace(/\[\/?color[^\]]*\]/g, '')
+    
+    expect(stripped).toEqual(text)
+  })
+})

package/src/Tests/UrlImgBug.test.ts

@@ -0,0 +1,23 @@
+import { describe, it, expect } from 'vitest'
+import { TagRegistry } from '../Model/TagRegistry'
+import { HTMLRenderer } from '../Visitors/HTMLRenderer'
+import { processStudioAST } from '@miliastry/quasar-studio'
+import { BBCodeExporter } from '../Visitors/BBCodeExporter'
+import fs from 'fs'
+
+describe('URL IMG bug', () => {
+  it('should render URL with IMG inside correctly', () => {
+    const text = '[notice][centre][url=https://osekai.net/profiles?user=11624101][img]https://osekai.net/profiles/img/banner.svg?id=11624101[/img][/url][/centre][/notice]'
+
+    const registry = new TagRegistry()
+    const htmlRenderer = new HTMLRenderer({ registry })
+    const exporter = new BBCodeExporter(registry)
+
+    const { redRoot } = processStudioAST(text, [], {})
+    const html = htmlRenderer.render(redRoot)
+    const exported = exporter.export(redRoot)
+
+    console.log('HTML:\n', html)
+    console.log('Exported BBCode:\n', exported)
+  })
+})

package/src/Tests/VisualBuilderFidelity.test.ts

@@ -0,0 +1,105 @@
+import { describe, it, expect } from 'vitest'
+import { TagRegistry } from '../Model/TagRegistry'
+import { HTMLRenderer } from '../Visitors/HTMLRenderer'
+import { processStudioAST } from '@miliastry/quasar-studio'
+
+/**
+ * Every tag the visual builder can produce must reach the HTML with the
+ * element the preview's stylesheet expects.
+ *
+ * This file used to hold a 6 KB hardcoded "expected HTML" that was never
+ * compared against anything — it was written to `visual-builder-expected.html`
+ * and `visual-builder-actual.html` in the repo root (tracked files, dirtied on
+ * every run) for a human to eyeball. The only assertions were that the output
+ * contained `class="bb-text"` and `data-node-id`. The first stopped being true
+ * when text leaves lost their wrapper span, which is what prompted writing
+ * real assertions instead.
+ */
+describe('Visual Builder HTML Fidelity', () => {
+  const bbcode = `[heading]Quasar Engine Test[/heading]
+
+[b]Bold[/b], [i]Italic[/i], [u]Underline[/u], [s]Strikethrough[/s]
+
+[color=#61afef]Colored text[/color] and [size=150]Large text[/size]
+
+[quote="Author"]This is a quote block with [b]formatting[/b] inside[/quote]
+
+[code]
+function hello() {
+  console.log("Hello World!")
+}
+[/code]
+
+[list]
+[*]Item one
+[*]Item two
+[*]Item three
+[/list]
+
+[centre][b]Centered content[/b][/centre]
+
+[notice]This is an important notice![/notice]
+
+[spoiler]Hidden content revealed on hover[/spoiler]
+
+[url=https://osu.ppy.sh]osu! website[/url]
+
+Esto
+
+Y esto`
+
+  const render = () => {
+    const registry = new TagRegistry()
+    const renderer = new HTMLRenderer({ registry })
+    const { redRoot } = processStudioAST(bbcode, [], {})
+    return renderer.render(redRoot)
+  }
+
+  it('maps every tag to its expected element', () => {
+    const html = render()
+
+    const cases: Array<[string, RegExp]> = [
+      ['heading', /<h2[^>]*>Quasar Engine Test<\/h2>/],
+      ['bold', /<strong[^>]*>Bold<\/strong>/],
+      ['italic', /<em[^>]*>Italic<\/em>/],
+      ['underline', /<u[^>]*>Underline<\/u>/],
+      ['strikethrough', /<s[^>]*>Strikethrough<\/s>/],
+      ['color', /<span[^>]*style="color:#61afef;"[^>]*>Colored text<\/span>/],
+      ['size', /<span[^>]*style="font-size:150%;"[^>]*>Large text<\/span>/],
+      ['quote', /<blockquote[^>]*>/],
+      ['code', /<pre[^>]*><code>/],
+      ['list', /<ul[^>]*>/],
+      ['list item', /<li[^>]*>Item one/],
+      ['centre', /<div[^>]*style="text-align:center;"[^>]*>/],
+      ['notice', /<div[^>]*class="notice"[^>]*>/],
+      ['spoiler', /<span[^>]*class="spoiler"[^>]*>/],
+      ['url', /<a[^>]*href="https:\/\/osu\.ppy\.sh"[^>]*>osu! website<\/a>/],
+    ]
+
+    for (const [label, pattern] of cases) {
+      expect(pattern.test(html), `${label} — no encontrado en el HTML`).toBe(true)
+    }
+  })
+
+  it('keeps the quote author and the raw code content', () => {
+    const html = render()
+    expect(html).toContain('Author')
+    expect(html).toContain('function hello()')
+    // Code content is raw text, so its quotes must be escaped, not parsed.
+    expect(html).toContain('&quot;Hello World!&quot;')
+  })
+
+  it('carries data-node-id on blocks, so preview clicks map back to nodes', () => {
+    const html = render()
+    // Blocks are id-bearing; text leaves deliberately are not.
+    expect(html).toMatch(/<h2 data-node-id="[^"]+"/)
+    expect(html).toMatch(/<blockquote data-node-id="[^"]+"/)
+    expect(html).toMatch(/<div data-node-id="[^"]+" class="notice"/)
+  })
+
+  it('renders trailing prose after the last tag', () => {
+    const html = render()
+    expect(html).toContain('Esto')
+    expect(html).toContain('Y esto')
+  })
+})

package/src/Tests/referenceDocument.ts

@@ -0,0 +1,119 @@
+/**
+ * The reference document the heavier suites parse.
+ *
+ * This replaces two `.milia` fixtures that used to sit next to `src/` and were
+ * read with `fs.readFileSync`. They were never committed, so the moment they
+ * were gone seven tests failed with `ENOENT` and nothing in the repository
+ * could bring them back. A fixture a test cannot survive without belongs in the
+ * repository, and the cheapest way to guarantee that is to make it code.
+ *
+ * Honest limitation: the originals were real posts from the wild, ~12 KB each.
+ * This is a reconstruction. It reproduces the *shapes* that made those files
+ * worth parsing — the ones listed below — but it cannot reproduce the surprise
+ * of real user input. Anything found in a real document that this misses should
+ * be added here rather than kept in an untracked file.
+ *
+ * What it deliberately contains:
+ *
+ *  - Deep nesting, and tags closed out of order by ordinary authors
+ *  - Braille blanks (`⠀`) used as layout padding, which the exporter must not
+ *    invent or drop
+ *  - CRLF alongside LF, and runs of blank lines
+ *  - Bracketed prose that is *not* a tag — `[90 misses]`, `[Gateron]` — which
+ *    the parser renders literally and the validators must stay quiet about
+ *  - Non-ASCII text and emoji, so offsets are exercised beyond one byte
+ *  - Attribute values that themselves contain markup (`[box=[b]t[/b]]`)
+ *  - Long stretches of plain text, so a gradient has characters to colour
+ *
+ * It must stay **valid**: `SemanticValidators` asserts zero errors and zero
+ * warnings on it, on the grounds that a checker crying wolf on an ordinary
+ * document is worse than a silent one. Adding a deprecated tag here would break
+ * that on purpose, so don't.
+ */
+
+const SECTION_PAD = '⠀'.repeat(8)
+
+export const REFERENCE_DOCUMENT = [
+  '[centre]',
+  `${SECTION_PAD}[size=150][b]perfil de ejemplo[/b][/size]${SECTION_PAD}`,
+  '[/centre]',
+  '',
+  '[box=[b]sobre mí[/b]]',
+  'Llevo jugando desde 2017 y sigo fallando los mismos patrones.',
+  'Mi mejor racha this season fue un [90 misses] limpio — sí, limpio.',
+  'Teclado [Gateron] rojo, tableta pequeña, mucha paciencia. 🎵',
+  '[/box]',
+  '',
+  '[centre]',
+  // Author colours must stay OUTSIDE `REFERENCE_GRADIENT_COLORS`: the HTML
+  // suite proves a gradient's stops are absent without a gradient layer, and a
+  // collision here would make that assertion unprovable.
+  '[color=#7aa2f7]━━━━━━━━━━━━━━━━━━━━━━━━━━━━[/color]',
+  '[/centre]',
+  '',
+  '[b]Cosas que me gustan[/b]',
+  '[list]',
+  '[*]Mapas de stream largos, aunque no los pase',
+  '[*]Skins minimalistas con hitsounds fuertes',
+  '[*]Los mapas de [i]Sotarks[/i] cuando está inspirado',
+  '[/list]',
+  '',
+  // Deliberate CRLF island: the lexer folds line endings and the partition
+  // invariant has to keep covering both bytes of a `\r\n`.
+  'Una sección con saltos de Windows:\r\nsegunda línea\r\ntercera línea',
+  '',
+  '',
+  '',
+  '[quote]',
+  '"El ritmo no se piensa, se siente." — alguien en el chat, 3 AM',
+  '[/quote]',
+  '',
+  '[b][i]Texto anidado[/i] que cierra en otro orden[/b]',
+  '',
+  'Un enlace normal: [url=https://osu.ppy.sh]mi perfil[/url]',
+  'Y otro suelto: [url]https://osu.ppy.sh/beatmapsets[/url]',
+  '',
+  '[centre]',
+  `${SECTION_PAD}[color=#9ece6a]gracias por leer[/color]${SECTION_PAD}`,
+  '',
+  'Texto largo para que un degradado tenga suficientes caracteres que colorear ',
+  'y el render produzca un nodo por carácter sin quedarse corto en la prueba: ',
+  'áéíóú ñ ü € — signos que ocupan más de un byte y mueven los offsets.',
+  '[/centre]',
+  '',
+  `${SECTION_PAD}`,
+].join('\n')
+
+/**
+ * The same document under a Studio gradient layer.
+ *
+ * The second fixture was the first one after the visual builder had run over
+ * it, so the two differed in exactly this: colour spans wrapped around
+ * individual characters. Kept as a separate export because several suites parse
+ * both and a difference between them is the point.
+ */
+export const REFERENCE_DOCUMENT_WITH_GRADIENT = [
+  '[centre]',
+  '[color=#e8b04b]p[/color][color=#e8ae4b]e[/color][color=#e7ad4b]r[/color]',
+  '[color=#e7aa4b]f[/color][color=#e7a84b]i[/color][color=#e6a64b]l[/color]',
+  '[/centre]',
+  '',
+  REFERENCE_DOCUMENT,
+].join('\n')
+
+/** The gradient stops the Studio layer tests colour with. */
+export const REFERENCE_GRADIENT_COLORS =
+  '#e8b04b,#e8ae4b,#e7ad4b,#e7aa4b,#e7a84b,#e6a64b,#e6a14c,#e59f4c,#e4994c,'
+  + '#e3914c,#e28b4d,#e1854d,#e07c4d,#df754d,#de6f4e,#dd684e,#dc614e,#db5b4f,#da564f'
+
+/** The Studio layer shape those suites feed to `processStudioAST`. */
+export const REFERENCE_GRADIENT_LAYER = {
+  id: 'grad',
+  type: 'gradient',
+  enabled: true,
+  value: 100,
+  properties: { color1: '#ff0000', color2: '#0000ff' },
+  colors: REFERENCE_GRADIENT_COLORS,
+  opacity: 1.0,
+  easing: 'linear',
+}