Skip to content

feat(apollo-wind): add shadow DOM CSS injection utilities#855

Closed
david-rios-uipath wants to merge 3 commits into
rios/shadow-dom-property-registrationfrom
rios/shadow-dom-css-injection
Closed

feat(apollo-wind): add shadow DOM CSS injection utilities#855
david-rios-uipath wants to merge 3 commits into
rios/shadow-dom-property-registrationfrom
rios/shadow-dom-css-injection

Conversation

@david-rios-uipath

Copy link
Copy Markdown
Contributor

Summary

Builds on #830 to consolidate the shadow DOM CSS injection pattern into reusable apollo-wind exports. Every shadow DOM consumer of apollo-wind currently reimplements the same three steps: detect existing CSS, inject a <style> tag, and call registerCssPropertyRules. This PR extracts that into shared utilities.

New exports

  • injectTailwindIntoShadowRoot(root, css) — injects a <style data-tailwind-inject> into the shadow root, calls registerCssPropertyRules internally. Idempotent; returns the created element (or null if skipped) so callers can clean up on unmount.
  • hasApolloWindCss(root) — two-level detection: fast-path tag check + computed-style probes (grid/flex/hidden/relative). Deliberately avoids probing custom properties (they inherit across the shadow boundary and would false-positive).
  • TAILWIND_INJECT_ATTR — the sentinel attribute constant (data-tailwind-inject).

Backward compatibility

registerCssPropertyRules is unchanged. The new functions are additive exports only.

Test plan

  • pnpm --filter @uipath/apollo-wind test — 923 tests pass (11 new)
  • pnpm --filter @uipath/apollo-wind build — new exports appear in dist/index.d.ts
  • Publish dev version, install in traceview-ui2, replace local injectTailwindIntoShadowRoot and hasApolloWindCss with imports from @uipath/apollo-wind

🤖 Generated with Claude Code

- Fix ReDoS: remove capturing group and use [^}]* instead of [^}]+
- Add idempotency test to verify only one style element is injected
…Css utilities

Consolidate the shadow DOM CSS injection pattern into reusable exports so
consumers don't need to reimplement the inject + @Property registration dance.
@github-actions

github-actions Bot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Review Updated (PT)
apollo-design 🟢 Ready Preview, Logs Jun 25, 2026, 12:10:10 PM
apollo-docs 🟢 Ready Preview, Logs Jun 25, 2026, 12:10:10 PM
apollo-landing 🟢 Ready Preview, Logs Jun 25, 2026, 12:10:10 PM
apollo-vertex 🟢 Ready Preview, Logs Jun 25, 2026, 12:10:10 PM

@github-actions

Copy link
Copy Markdown
Contributor

Dependency License Review

  • 1922 package(s) scanned
  • ✅ No license issues found
  • ⚠️ 2 package(s) excluded (see details below)
License distribution
License Packages
MIT 1692
ISC 89
Apache-2.0 55
BSD-3-Clause 27
BSD-2-Clause 23
BlueOak-1.0.0 8
MPL-2.0 4
MIT-0 3
CC0-1.0 3
MIT OR Apache-2.0 2
(MIT OR Apache-2.0) 2
Unlicense 2
LGPL-3.0-or-later 1
Python-2.0 1
CC-BY-4.0 1
(MPL-2.0 OR Apache-2.0) 1
Unknown 1
Artistic-2.0 1
(WTFPL OR MIT) 1
(BSD-2-Clause OR MIT OR Apache-2.0) 1
CC-BY-3.0 1
0BSD 1
(MIT OR CC0-1.0) 1
MIT AND ISC 1
Excluded packages
Package Version License Reason
@img/sharp-libvips-linux-x64 1.2.4 LGPL-3.0-or-later LGPL pre-built binary, not linked
khroma 2.1.0 Unknown MIT per GitHub repo, missing license field in package.json

@david-rios-uipath david-rios-uipath force-pushed the rios/shadow-dom-property-registration branch from 9d18f76 to 074dd34 Compare June 25, 2026 19:08
@david-rios-uipath

Copy link
Copy Markdown
Contributor Author

Merged into #830 — single PR now ships the full shadow DOM injection API.

@david-rios-uipath david-rios-uipath deleted the rios/shadow-dom-css-injection branch June 25, 2026 19:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant