Repository navigation
feat(tabs): add an icon prop, drawn by comark-icon from Iconify names or image URLs - #51
Conversation
🚀 Deploying Preview to Cloudflare 🚀Preview Deployments by commit
|
comark-annotate
comark-carousel
comark-charts
comark-code
comark-embed
comark-github-callouts
comark-icon
comark-include
lint-comark
comark-tabs
comark-zoom
commit: |
![pullfrog[bot]](https://avatars.githubusercontent.com/in/1768019?s=60&v=4){kind=small}
There was a problem hiding this comment.
Important
This PR has two concrete correctness issues in the new icon paths that should be addressed before merging.
Reviewed changes
Reviewed the parser, Iconify resolution and caching, HTML renderer, framework renderers, styles, documentation, and the new tabs tests.
- Icon inputs — adds Iconify names, image URLs, label defaults, local icon sets, and API fetching.
- Rendered output — adds inline CSS images to the HTML, React, Vue, and Svelte tab strips and captions.
- Validation and coverage — reports icon resolution failures through
meta.issuesand adds parser, renderer parity, and framework compilation tests.
gpt-5.6-sol ｜ 𝕏
Latest result Pull request merged. Final answersSession Pull request merged. Session Updated the branch with main because main changed pnpm-lock.yaml after its checks ran; waiting for checks on the new head. Session Updated the branch with main because main changed pnpm-lock.yaml after its checks ran; waiting for checks on the new head. Session Updated the branch with main because main changed pnpm-lock.yaml after its checks ran; waiting for checks on the new head. Session Updated the branch with main because main changed pnpm-lock.yaml after its checks ran; waiting for checks on the new head. Session Updated the branch with main because main changed pnpm-lock.yaml after its checks ran; waiting for checks on the new head. Session Updated the branch with main because main changed pnpm-lock.yaml after its checks ran; waiting for checks on the new head. Session Updated the branch with main because main changed pnpm-lock.yaml after its checks ran; waiting for checks on the new head. Session Updated the branch with main because main changed pnpm-lock.yaml after its checks ran; waiting for checks on the new head. Session Updated the branch with main because main changed pnpm-lock.yaml after its checks ran; waiting for checks on the new head. Session Updated the branch with main because main changed pnpm-lock.yaml after its checks ran; waiting for checks on the new head. |
|
Fixed both P1 findings in 2117daa: framework renderers sanitize quote, backslash, and whitespace characters in public icon URLs, and local Iconify alias resolution preserves chained hFlip, vFlip, and rotate transformations. |
There was a problem hiding this comment.
Important
The alias fix still does not match Iconify's transform contract, so valid local aliases can render the wrong geometry or be clipped.
Reviewed changes
Reviewed the changes since the prior Pullfrog review: shared CSS URL sanitization across framework renderers and local Iconify alias transform handling.
- Sanitized framework icon URLs — applied the parser's CSS
url()escaping to React, Vue, and Svelte output. - Rendered alias transforms — added
hFlip,vFlip, androtatedata to local aliases and wrapped transformed SVG bodies.
gpt-5.6-sol ｜ 𝕏
2117daa to
89e83e3
Compare
onmax
changed the title
There was a problem hiding this comment.
✅ No new issues found.
Reviewed changes
Reviewed the changes since the prior Pullfrog review: the tabs package now uses comark-icon as its shared resolver and rendering implementation across HTML, React, Vue, and Svelte.
- Delegated icon resolution — replaced the tabs-local resolver with
createIcons(), shared collections and fetch configuration, anddescribeIconProblem(). - Reused icon rendering — switched tab strips and captions to
iconHtml()/iconStyles()and the frameworkIconcomponents. - Updated tab parsing and documentation — preserved code-group metadata, label-based defaults, public types, examples, and renderer parity tests.
The new delta is behaviorally substantive but I found no additional actionable issues. The focused test command could not complete in this environment because pnpm's prepare step cannot lock .git/config on the read-only filesystem.
gpt-5.6-sol ｜ 𝕏
89e83e3 to
51f473a
Compare
51f473a to
f49afae
Compare
There was a problem hiding this comment.
✅ No new issues found.
Reviewed changes
Reviewed the current PR after the prior Pullfrog review, including the delegated comark-icon integration across the tabs parser and HTML, React, Vue, and Svelte renderers.
- Delegated icon resolution — replaced the tabs-local resolver with the shared
createIcons()resolver and shared icon problem descriptions. - Reused icon rendering — rendered tab strip and caption icons through
comark-icon's HTML and framework components, including shared URL sanitization and styles. - Preserved tab inputs — parsed code-block
icon=metadata, label-based defaults, public options, and renderer parity coverage.
gpt-5.6-sol ｜ 𝕏
There was a problem hiding this comment.
✅ No new issues found.
Reviewed changes
Reviewed the current synchronized tabs icon implementation and its shared comark-icon integration across parsing, HTML, React, Vue, and Svelte rendering.
- Shared icon resolution — routes Iconify names and image URLs through
createIcons(), including shared collections, API fetching, alias handling, and diagnostic messages. - Cross-renderer output — draws resolved icons in tab strips and captions with the shared HTML and framework components, while preserving style injection and CSS URL sanitization.
- Parser and coverage updates — extracts code-group icon metadata, applies label defaults, preserves existing metadata, documents the public options, and adds parser and renderer parity tests.
gpt-5.6-sol ｜ 𝕏
cdb5741 to
73e6bbf
Compare
There was a problem hiding this comment.
✅ No new issues found.
Reviewed changes
Reviewed the synchronized head 73e6bbf against the prior Pullfrog review. The branch now presents the same tabs and comark-icon integration previously reviewed, with no new behavioral changes to reassess.
- Rebased reviewed implementation — retained Iconify resolution, shared renderer output, label defaults, code-group metadata parsing, and issue reporting from the previously reviewed feature.
- Preserved renderer parity — retained the HTML, Vue, React, and Svelte icon paths and their existing test coverage.
The focused comark-tabs test command remains environment-blocked because pnpm's prepare step cannot lock .git/config on the read-only filesystem.
gpt-5.6-sol ｜ 𝕏
There was a problem hiding this comment.
✅ No new issues found.
Reviewed changes
Reviewed the synchronized head c14731f against the prior Pullfrog review at 73e6bbf, including the merge from main and its README metadata updates.
- Merged repository documentation updates — incorporated the ten README badge changes from
mainwithout altering tabs runtime behavior. - Retained reviewed icon integration — preserved the
comark-iconresolver, shared rendering, parser metadata, and HTML, Vue, React, and Svelte parity paths.
gpt-5.6-sol ｜ 𝕏
There was a problem hiding this comment.
✅ No new issues found.
Reviewed changes
Reviewed the synchronization delta since the prior Pullfrog review: the merge of main, including the repository-wide comark-lint to lint-comark rename and README badge updates. The package, CLI, workspace dependency, lockfile, build filter, Doctor import, exports, tests, and documentation are internally consistent; no tabs or icon runtime behavior changed.
- Renamed the lint package contract — changed the published package name, executable, workspace dependency, lockfile entry, prepack filter, and generated CLI name together.
- Updated repository references — changed documentation, Doctor configuration, source diagnostics, tests, and package skill examples without leaving stale
comark-lintreferences. - Preserved the reviewed tabs implementation — retained the shared
comark-iconresolver and HTML, Vue, React, and Svelte rendering paths from the prior review.
The focused build could not run because pnpm's prepare step cannot lock .git/config on this read-only filesystem.
gpt-5.6-sol ｜ 𝕏
1 participant
Stacked on #54 (
comark-icon). Tabs and code-group tabs can show an icon: an Iconify name or an image URL.comark-iconresolves and draws it.:icon. Tabs resolve icons withcomark-icon's resolver and draw them with itsiconHtml/iconStylesandIconcomponents. They look, size (--comark-icon-size), and handle forced colors the same as an:icon.iconResolvertakes thecreateIcons()the page's:iconuses, so tabs share itscollectionsandfetch.:icon.icons: { pnpm: "logos:pnpm" }gives every tab with that label an icon.comark-icon's words. The tab renders without the icon.This replaces the first version of this PR, which had its own resolver inside tabs. Its fixes carry over:
@iconify/utilsapplies them.comark-icon's components (feat(icon): add comark-icon, Iconify icons in Markdown drawn as CSS, and a resolver other plugins share #54), so every plugin gets it.iconSetsoption is gone; useiconResolver.The docs move to the split tabs pages: an Icons example, the
iconprop, and an Icons guide. The docs build fetches the example icons from the Iconify API.Checks: 200 tests passed.
vp checkreports 0 errors (its 2 warnings are already ine2e/annotate.e2e.ts). Vite Doctor reports no warnings, and the docs build passes.🤖 Generated with Claude Code