Skip to content

feat(theme): allow replacing slot classes with a function#183

Open
IgorShevchik wants to merge 1 commit into
mainfrom
sync/nuxt-ea576e2f
Open

feat(theme): allow replacing slot classes with a function#183
IgorShevchik wants to merge 1 commit into
mainfrom
sync/nuxt-ea576e2f

Conversation

@IgorShevchik

Copy link
Copy Markdown
Collaborator

Port of upstream nuxt/ui ea576e2ffeat(theme): allow replacing slot classes with a function (#6562).

Changes

A slot class can now be a function (defaults) => classes that replaces the slot's default classes (instead of merging) — via :b24ui, the class prop, or app.config.b24ui.

  • types/tv.ts: add SlotClassReplacer + SlotClass; widen base/slots in TVConfig and ComponentSlots from ClassValueSlotClass.
  • useComponentProps.ts: ClassValueSlotClass.
  • utils/tv.ts: rewrite tv as a Proxy (findReplacer / plainClasses / applyReplacer / wrapSlots / extractDirectives + WideTV/Widen), preserving b24ui's own twMergeConfig (air class groups) and the b24ui?.tv config — the shared config is reused for createTV and the cnMerge(...)(config) calls.
  • tests: test/utils/tv.spec.ts (verbatim) + a Button :b24ui replacer case (+34 across nuxt/vue).
  • playgrounds: widening slots to SlotClass broke typecheck in Matrix.vue/PlaygroundPage.vue (they forward props.b24ui?.root|body inside a ClassValue array to B24Card's :b24ui). Cast those forwarded values to ClassValue in nuxt + demo (dev helpers only merge strings).
  • docs: function-form note + :b24ui example + theme.unstyled tip in the ### b24ui prop section.

Deviation

Skipped upstream's larger global-config / "Theme component" doc restructure in 3.components.md and the skills/nuxt-ui/...design-system.md edit — b24ui's theme doc and skills (skills/b24-ui-nuxt/) are structured differently. The runtime feature + per-component note are covered.

Verification (pnpm 11.5.2, gate ON)

dev:prepare · lint · typecheck (incl. docs + both playgrounds) · test (5086 passed, 6 skipped) · module build — all green.

Ledger: records the merge sha for the previous port (#182, 52367b1a) and advances the sync cursor to ea576e2f.

https://claude.ai/code/session_01Qz7EXMncvEGiCj4WbmYgJo


Generated by Claude Code

Port of nuxt/ui ea576e2f (#6562).

Let a slot class be a function `(defaults) => classes` that replaces a slot's
default classes (instead of merging) via :b24ui, the class prop, or
app.config.b24ui:
- types/tv.ts: add SlotClassReplacer/SlotClass; widen base/slots/ComponentSlots
  from ClassValue to SlotClass. useComponentProps.ts: same.
- utils/tv.ts: rewrite tv as a Proxy (findReplacer/plainClasses/applyReplacer/
  wrapSlots/extractDirectives + WideTV), preserving b24ui's twMergeConfig and
  b24ui?.tv config source.
- tests: tv.spec.ts (verbatim) + a Button :b24ui replacer case.
- playgrounds: cast forwarded props.b24ui?.root|body to ClassValue in
  Matrix/PlaygroundPage (nuxt+demo) now that slots accept the replacer fn.
- docs: function-form note in 3.components.md (b24ui-prop section). Skipped the
  larger global-config/Theme-component doc restructure + the skills file
  (b24ui's docs/skills are structured differently).

Also records the merge sha for the previous port (#182, 52367b1a) and
advances the sync cursor.

https://claude.ai/code/session_01Qz7EXMncvEGiCj4WbmYgJo
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants