feat(theme): curated inline-SVG icon set with select-constrained icon.name #100

Merged
dominik.polakovics merged 1 commit from afk/96 into main 2026-07-18 03:13:54 +02:00

Replaces the icon element's neutral placeholder with a real, dependency-free icon set and constrains icon.name to it.

What changed

  • Theme partial layouts/partials/icon.html (new): 24 original stroke-style glyphs (arrow-right … document, the full list proposed in the issue) on a 24×24 grid — stroke-width 2, round caps/joins, no external assets, fonts, or JS. The shortcode wraps {{ partial "icon.html" $name }} in the unchanged span shape.
  • Sidecar editor/elements/icon.yaml: name is now type: select with options listing exactly the shipped names, so the picker shows the list. Comment documents the fork-extension path (add to both the partial map and the options list) and the graceful-degradation rule.
  • CSS: the .ce-icon placeholder-square styles are replaced by SVG sizing — icons render at text size (1em), tinted by currentColor, aria-hidden="true" preserved.
  • Graceful degradation: a stored name outside the set emits the same ce-icon--<name> / data-icon span but empty — nothing visible, no broken square. The kitchen-sink fixture keeps its out-of-set sparkles chip as the living example.
  • Fork compatibility: ce-icon--<name> and data-icon output are unchanged in shape.
  • README (theme): icon row and prose updated for the built-in set.

Tests

  • TestIconSidecarPartialDrift (static, never skips): sidecar options set == partial glyph-name set, name is a select with ≥16 options.
  • TestIconSetInProduction (real Hugo build of the library site): every shipped name renders <svg … stroke="currentColor" viewBox="0 0 24 24"> inside its span on the kitchen-sink page (which now shows all 24 icons inline in a text body), sparkles degrades to an empty span, and every icon span is single-line so chips survive markdown splicing.
  • Full suite green locally: go vet ./..., go test ./... (with hugo on PATH, so the real-build tests ran), and all 792 web tests. Glyph quality was reviewed visually from a rendered screenshot of the full set.

scaffold/site/AGENTS.md needed no change: no schema vocabulary was added (select is already documented) and the agentsdoc drift test passes.

Closes #96

🤖 Generated with Claude Code

Replaces the icon element's neutral placeholder with a real, dependency-free icon set and constrains `icon.name` to it. ## What changed - **Theme partial** `layouts/partials/icon.html` (new): 24 original stroke-style glyphs (arrow-right … document, the full list proposed in the issue) on a 24×24 grid — stroke-width 2, round caps/joins, no external assets, fonts, or JS. The shortcode wraps `{{ partial "icon.html" $name }}` in the unchanged span shape. - **Sidecar** `editor/elements/icon.yaml`: `name` is now `type: select` with `options` listing exactly the shipped names, so the picker shows the list. Comment documents the fork-extension path (add to both the partial map and the options list) and the graceful-degradation rule. - **CSS**: the `.ce-icon` placeholder-square styles are replaced by SVG sizing — icons render at text size (`1em`), tinted by `currentColor`, `aria-hidden="true"` preserved. - **Graceful degradation**: a stored name outside the set emits the same `ce-icon--<name>` / `data-icon` span but empty — nothing visible, no broken square. The kitchen-sink fixture keeps its out-of-set `sparkles` chip as the living example. - **Fork compatibility**: `ce-icon--<name>` and `data-icon` output are unchanged in shape. - **README** (theme): icon row and prose updated for the built-in set. ## Tests - `TestIconSidecarPartialDrift` (static, never skips): sidecar options set == partial glyph-name set, `name` is a select with ≥16 options. - `TestIconSetInProduction` (real Hugo build of the library site): every shipped name renders `<svg … stroke="currentColor" viewBox="0 0 24 24">` inside its span on the kitchen-sink page (which now shows all 24 icons inline in a text body), `sparkles` degrades to an empty span, and every icon span is single-line so chips survive markdown splicing. - Full suite green locally: `go vet ./...`, `go test ./...` (with hugo on PATH, so the real-build tests ran), and all 792 web tests. Glyph quality was reviewed visually from a rendered screenshot of the full set. `scaffold/site/AGENTS.md` needed no change: no schema vocabulary was added (`select` is already documented) and the agentsdoc drift test passes. Closes #96 🤖 Generated with [Claude Code](https://claude.com/claude-code)
feat(theme): curated inline-SVG icon set with select-constrained icon.name
All checks were successful
ci / build-and-test (pull_request) Successful in 10m16s
e81fba67eb
Replace the icon element's neutral placeholder with a dependency-free set
of 24 original stroke-style glyphs, mapped name-to-SVG by the new theme
partial layouts/partials/icon.html. Icons render inline at text size,
tinted via currentColor, inside the unchanged aria-hidden span shape
(ce-icon--<name> / data-icon preserved for forks, which extend the set by
adding to both the partial map and the sidecar options list).

icon.yaml's name param becomes type: select over exactly the shipped
names, so the picker offers the list; a stored name outside the set
degrades gracefully to an invisible empty span at render time.

The kitchen-sink fixture now showcases all 24 icons inline in a text body
(keeping the out-of-set "sparkles" chip as the degradation case), a new
static drift test pins sidecar options == partial glyph names, and a
real-Hugo build test pins the rendered span/svg contract per shipped name.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Author
Owner

This was generated by AI while landing a PR.

Landing review — verdict: PASS.

  • CI: ci / build-and-test green (10m16s); relied on as the verification signal, not re-run.
  • AFK contract: Closes #96 present.
  • Convention: Conventional Commits title ✓; no AGENTS.md change needed (select already documented; drift test green).
  • Mergeable: no conflict against current main.
  • Diff vs issue #96: 24 dependency-free stroke SVGs ship in partials/icon.html matching the proposed name list; icon.name is now a select over exactly the shipped names; icons render at 1em, stroke="currentColor", aria-hidden="true"; an unknown stored name degrades to an empty span via with (index $icons .); ce-icon--<name> / data-icon output shape unchanged for fork compatibility. TestIconSidecarPartialDrift (static, never skips) pins sidecar↔partial agreement; the production render test ran under real Hugo in CI.

No blockers found. Awaiting the maintainer's free-text go-ahead to merge.

> *This was generated by AI while landing a PR.* **Landing review — verdict: PASS.** - **CI**: `ci / build-and-test` green (10m16s); relied on as the verification signal, not re-run. - **AFK contract**: `Closes #96` present. - **Convention**: Conventional Commits title ✓; no AGENTS.md change needed (`select` already documented; drift test green). - **Mergeable**: no conflict against current `main`. - **Diff vs issue #96**: 24 dependency-free stroke SVGs ship in `partials/icon.html` matching the proposed name list; `icon.name` is now a `select` over exactly the shipped names; icons render at `1em`, `stroke="currentColor"`, `aria-hidden="true"`; an unknown stored name degrades to an empty span via `with (index $icons .)`; `ce-icon--<name>` / `data-icon` output shape unchanged for fork compatibility. `TestIconSidecarPartialDrift` (static, never skips) pins sidecar↔partial agreement; the production render test ran under real Hugo in CI. No blockers found. Awaiting the maintainer's free-text go-ahead to merge.
Sign in to join this conversation.
No reviewers
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
Cloonar/deckle!100
No description provided.