[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10,"_11":12},"actionData","errors","root",{"_228":-5,"_231":232,"_233":234},"routes/shell",{"_41":42,"_227":-5,"_228":-5,"_229":230},"routes/repo",{"_34":-7,"_35":36,"_37":38,"_39":40,"_41":42,"_43":32,"_44":32,"_45":32,"_46":32,"_47":32,"_48":32,"_49":50,"_51":50,"_52":32,"_53":-7,"_54":-7,"_55":56,"_57":58,"_59":60,"_61":-5,"_62":63,"_64":65,"_66":67,"_68":69},"routes/repo.blob",{"_13":14,"_15":16,"_17":18,"_19":20,"_21":22,"_23":24,"_25":-5,"_26":27,"_28":29,"_29":30,"_31":32,"_33":14},"ref","main","path","apps/web/src/design-audit/specimens.test.tsx","oid","f120000b028457f53097b2ec36f96fe3f293f450","size",10551,"commit","2182c95de44a8f63fd86af1c5874ae0ca298f807","mounts",[],"source","plain",{"_13":14,"_15":16},"kind","text","import { describe, expect, it } from \"bun:test\";\nimport { SelectItem } from \"@chopin/visuals\";\nimport { Children, createElement, isValidElement } from \"react\";\nimport { renderToStaticMarkup } from \"react-dom/server\";\n\nimport { Controls } from \"./controls\";\nimport { AuthoredContent, callouts } from \"./authored-content\";\nimport { Foundations } from \"./foundations\";\nimport { InteractiveSpecimens } from \"./interactive\";\nimport { AUDIT_INVENTORY } from \"./inventory\";\nimport { Surfaces } from \"./surfaces\";\n\nimport type { ReactElement, ReactNode } from \"react\";\n\nfunction plate(markup: string, item: string): string {\n\tlet start = markup.indexOf(`

`);\n\tlet end = markup.indexOf(\"

\", start);\n\treturn start === -1 || end === -1 ? \"\" : markup.slice(start, end + \"\".length);\n}\n\nfunction elementsOfType(\n\tnode: ReactNode,\n\ttype: ReactElement[\"type\"],\n\tfound: ReactElement<{ children?: ReactNode; value?: unknown }>[] = [],\n) {\n\tChildren.forEach(node, child => {\n\t\tif (!isValidElement<{ children?: ReactNode; value?: unknown }>(child)) return;\n\t\tif (child.type === type) found.push(child);\n\t\telementsOfType(child.props.children, type, found);\n\t});\n\treturn found;\n}\n\ndescribe(\"design audit specimens\", () => {\n\tit(\"renders every foundation family with a visible label\", () => {\n\t\tlet markup = renderToStaticMarkup(createElement(Foundations));\n\n\t\tfor (let id of [\"colours\", \"typography\", \"spacing\", \"radii\", \"shadows\", \"icons\"]) {\n\t\t\texpect(markup).toContain(`data-audit-item=\"${id}\"`);\n\t\t}\n\t\texpect(markup).toContain(\"Panel close\");\n\t\texpect(markup).not.toContain(\"Consolidated exact duplicate\");\n\t\texpect(markup).toContain(\"Strong resting\");\n\t\texpect(markup).toContain(\"--button-edge-width\");\n\t\tfor (\n\t\t\tlet token of [\n\t\t\t\t\"--text-2xs\",\n\t\t\t\t\"--text-xs\",\n\t\t\t\t\"--text-sm\",\n\t\t\t\t\"--text-base\",\n\t\t\t\t\"--text-lg\",\n\t\t\t\t\"--text-xl\",\n\t\t\t\t\"--text-2xl\",\n\t\t\t]\n\t\t) {\n\t\t\texpect(markup).toContain(`var(${token})`);\n\t\t}\n\t});\n\n\tit(\"inventories and renders every IconLabel tone\", () => {\n\t\tlet item = AUDIT_INVENTORY.flatMap(group => group.items).find(\n\t\t\tcandidate => candidate.id === \"icon-label\",\n\t\t);\n\t\texpect(item).toEqual({\n\t\t\tid: \"icon-label\",\n\t\t\tlabel: \"Icon labels\",\n\t\t\tsource: \"packages/visuals/src/ui/icon-label.tsx\",\n\t\t\tstates: [\"neutral\", \"success\", \"warning\", \"danger\"],\n\t\t});\n\n\t\tlet markup = renderToStaticMarkup(createElement(Foundations));\n\t\texpect(markup).toContain('data-audit-item=\"icon-label\"');\n\t\tfor (let tone of [\"neutral\", \"success\", \"warning\", \"danger\"]) {\n\t\t\texpect(markup).toContain(`data-tone=\"${tone}\"`);\n\t\t\texpect(markup).toContain(`>${tone[0]?.toUpperCase()}${tone.slice(1)}`);\n\t\t}\n\t});\n\n\tit(\"inventories and renders every Badge tone\", () => {\n\t\tlet item = AUDIT_INVENTORY.flatMap(group => group.items).find(\n\t\t\tcandidate => candidate.id === \"badge\",\n\t\t);\n\t\texpect(item).toEqual({\n\t\t\tid: \"badge\",\n\t\t\tlabel: \"Badges\",\n\t\t\tsource: \"packages/visuals/src/ui/badge.tsx\",\n\t\t\tstates: [\"neutral\", \"success\", \"warning\", \"danger\"],\n\t\t});\n\n\t\tlet markup = renderToStaticMarkup(createElement(Foundations));\n\t\tlet specimen = plate(markup, \"badge\");\n\t\texpect(specimen).toContain('data-audit-item=\"badge\"');\n\t\texpect(specimen.match(/data-slot=\"badge\"/g)).toHaveLength(4);\n\t\tfor (let tone of [\"neutral\", \"success\", \"warning\", \"danger\"]) {\n\t\t\texpect(specimen).toContain(`data-tone=\"${tone}\"`);\n\t\t\texpect(specimen).toContain(`>${tone[0]?.toUpperCase()}${tone.slice(1)}`);\n\t\t}\n\t});\n\n\tit(\"inventories and renders representative Sparkline tones and series\", () => {\n\t\tlet item = AUDIT_INVENTORY.flatMap(group => group.items).find(\n\t\t\tcandidate => candidate.id === \"sparkline\",\n\t\t);\n\t\texpect(item).toEqual({\n\t\t\tid: \"sparkline\",\n\t\t\tlabel: \"Sparklines\",\n\t\t\tsource: \"packages/visuals/src/ui/sparkline.tsx\",\n\t\t\tstates: [\"neutral\", \"success\", \"warning\", \"danger\"],\n\t\t});\n\n\t\tlet markup = renderToStaticMarkup(createElement(Foundations));\n\t\texpect(markup).toContain('data-audit-item=\"sparkline\"');\n\t\tfor (let tone of [\"neutral\", \"success\", \"warning\", \"danger\"]) {\n\t\t\texpect(markup).toContain(`data-tone=\"${tone}\"`);\n\t\t}\n\t\texpect(markup).toContain('aria-label=\"Neutral activity\"');\n\t\texpect(markup).toContain('aria-label=\"Successful activity\"');\n\t\texpect(markup).toContain(' {\n\t\tlet item = AUDIT_INVENTORY.flatMap(group => group.items).find(\n\t\t\tcandidate => candidate.id === \"mini-bars\",\n\t\t);\n\t\texpect(item).toEqual({\n\t\t\tid: \"mini-bars\",\n\t\t\tlabel: \"Mini bars\",\n\t\t\tsource: \"packages/visuals/src/ui/mini-bars.tsx\",\n\t\t\tstates: [\"neutral\", \"success\", \"warning\", \"danger\"],\n\t\t});\n\n\t\tlet markup = renderToStaticMarkup(createElement(Foundations));\n\t\tlet specimen = plate(markup, \"mini-bars\");\n\t\texpect(specimen).toContain('data-audit-item=\"mini-bars\"');\n\t\tfor (let tone of [\"neutral\", \"success\", \"warning\", \"danger\"]) {\n\t\t\texpect(specimen).toContain(`aria-label=\"${tone} volume\"`);\n\t\t\texpect(specimen).toContain(`data-tone=\"${tone}\"`);\n\t\t}\n\t\texpect(specimen.match(/data-slot=\"mini-bars\"/g)).toHaveLength(4);\n\t\texpect(specimen.match(/ {\n\t\tlet item = AUDIT_INVENTORY.flatMap(group => group.items).find(\n\t\t\tcandidate => candidate.id === \"progress-bar\",\n\t\t);\n\t\texpect(item).toEqual({\n\t\t\tid: \"progress-bar\",\n\t\t\tlabel: \"Progress bars\",\n\t\t\tsource: \"packages/visuals/src/ui/progress-bar.tsx\",\n\t\t\tstates: [\"zero\", \"in-progress\", \"complete\"],\n\t\t});\n\n\t\tlet markup = renderToStaticMarkup(createElement(Foundations));\n\t\tlet specimen = plate(markup, \"progress-bar\");\n\t\texpect(specimen).toContain('data-audit-item=\"progress-bar\"');\n\t\tfor (\n\t\t\tlet [label, value] of [\n\t\t\t\t[\"Not started\", 0],\n\t\t\t\t[\"In progress\", 62.5],\n\t\t\t\t[\"Complete\", 100],\n\t\t\t] as const\n\t\t) {\n\t\t\texpect(specimen).toContain(`aria-label=\"${label}\"`);\n\t\t\texpect(specimen).toContain(`aria-valuenow=\"${value}\"`);\n\t\t\texpect(specimen).toContain(`>${value}%`);\n\t\t}\n\t\texpect(specimen.match(/role=\"progressbar\"/g)).toHaveLength(3);\n\t});\n\n\tit(\"adds presentation tables without replacing the authored editor table\", () => {\n\t\tlet items = AUDIT_INVENTORY.flatMap(group => group.items);\n\t\tlet presentationTable = items.find(candidate => candidate.id === \"presentation-table\");\n\t\tlet authoredTable = items.find(candidate => candidate.id === \"table\");\n\n\t\texpect(presentationTable).toEqual({\n\t\t\tid: \"presentation-table\",\n\t\t\tlabel: \"Presentation tables\",\n\t\t\tsource: \"packages/visuals/src/ui/table.tsx\",\n\t\t\tstates: [\"plain\", \"contained\", \"narrow-overflow\"],\n\t\t});\n\t\texpect(authoredTable).toEqual({\n\t\t\tid: \"table\",\n\t\t\tlabel: \"Tables\",\n\t\t\tsource: \"packages/editor/src/table/chrome.tsx\",\n\t\t\tstates: [\"default\", \"selected-cell\", \"toolbar\", \"overflow\"],\n\t\t});\n\n\t\tlet markup = renderToStaticMarkup(createElement(Foundations));\n\t\tlet specimen = plate(markup, \"presentation-table\");\n\t\texpect(specimen).toContain('data-audit-item=\"presentation-table\"');\n\t\texpect(specimen).toContain('data-table-example=\"plain\"');\n\t\texpect(specimen).toContain('data-table-example=\"contained-overflow\"');\n\t\texpect(specimen).toContain('data-variant=\"plain\"');\n\t\texpect(specimen).toContain('data-variant=\"contained\"');\n\t\texpect(specimen.match(/data-slot=\"table\"/g)).toHaveLength(2);\n\t\texpect(specimen.match(/aria-label=\"Deployment activity\"/g)).toHaveLength(2);\n\t\texpect(specimen).not.toContain(\" {\n\t\tlet markup = renderToStaticMarkup(createElement(Controls));\n\n\t\tfor (\n\t\t\tlet id of [\n\t\t\t\t\"buttons\",\n\t\t\t\t\"icon-buttons\",\n\t\t\t\t\"links\",\n\t\t\t\t\"fields\",\n\t\t\t\t\"selections\",\n\t\t\t\t\"tabs\",\n\t\t\t\t\"menus\",\n\t\t\t\t\"dropdowns\",\n\t\t\t]\n\t\t) {\n\t\t\texpect(markup).toContain(`data-audit-item=\"${id}\"`);\n\t\t}\n\t\texpect(markup).toContain('aria-label=\"Add document\"');\n\t\texpect(markup).toContain(\"disabled\");\n\t\texpect(markup).toContain('aria-selected=\"true\"');\n\t\texpect(markup).toContain('role=\"menu\"');\n\t\texpect(markup).toContain('data-slot=\"select-trigger\"');\n\t\texpect(markup).toContain('data-slot=\"select-value\"');\n\t\texpect(markup).not.toContain('