Skip to content

v0.9.0

Choose a tag to compare

View all tags
@yasmro yasmro released this 25 May 19:14
· 177 commits to develop since this release
v0.9.0
1d7bbdc

Highlights

  • 「consumers do NOT need Tailwind」 が技術的に達成 — dist/schatten.css に全 18 lv1 コンポの .st-* セマンティッククラス API が同梱され、vanilla HTML / WordPress / Astro / Vue / Svelte から <button class="st-btn st-btn--primary"> だけで React と同じ見た目が得られるように (#154, sweep #282/#283/#290/#296/#298/#299/#300)
  • Per-component CSS subpath @yasmro/schatten/css/<component> を 18 lv1 全コンポに (#301)。.size-limit.json で 1 コンポ ≤ 1.5 KB / 集約 ≤ 20 KB / 統合 dist ≤ 50 KB が CI で gate
  • dist/schatten.manifest.json を新規 export (#279) — 公開 CSS surface (195 classes / 8 state attributes / 145 CSS variables) を機械可読 JSON として配布。pnpm check:manifest で diff が CI ログに直接出る
  • 新しい lv1 <Icon> (#255) + 新しい <ThemeProvider> / useTheme() (#260) — Mode × Special の宣言的 API、'system' / 'auto-seasonal' 対応 + localStorage 永続化 + cross-tab 同期
  • Lighthouse 100 を狙える consumer 向けレシピ (#293) と runnable な examples/lighthouse-100/{nextjs,vanilla}/

⚠️ Breaking Changes (pre-1.0 のため minor bump)

CSS class 出力が Tailwind utility から .st-* semantic class chain に変更されました。

Before (v0.8.0) After (v0.9.0)
<Button> renders class="inline-flex items-center ... bg-solid ..." <Button> renders class="st-btn st-btn--primary st-btn--md"
<Tooltip> content uses .tooltip-content .st-tooltip__content
Spinner internal classes .schatten-spinner-dot / .schatten-spinner-ripple-{1,2} .st-spinner__dot / .st-spinner__ripple-{1,2}
Selector .st-callout--success { background: ... } overrides every appearance Pattern B は double-class selector — .st-callout--success.st-callout--solid / .st-callout--success.st-callout--subtle 等を組合せで記述

影響を受けるケース

React 利用 (<Button> / <Input> 等 prop 経由) は 無影響。以下のいずれかに該当する場合のみ要対応:

  • cn(buttonVariants(...), 'h-12') のように CVA 出力に Tailwind utility を重ね打ち しているケース → 出力 class set の内訳が変わる(動作は等価)
  • .tooltip-content / .schatten-spinner-* など 古い内部クラスを CSS から直接参照 しているケース → .st-tooltip__content / .st-spinner__* に sed-migrate
  • VRT baseline を持つ消費者 → 再生成が必要

What's Changed

Minor Changes

  • build:css を @tailwindcss/cli に切替 + src/styles/entry.css 新設 (#275)
  • CSS API sweep-1 — Separator / Text / Icon (#282)
  • CSS API sweep-2 — Spinner / Badge / Callout (#283)
  • CSS API sweep-3 — Button / Checkbox / Switch (#290)
  • CSS API sweep-4 — Input / Textarea / Radio (#296)
  • CSS API sweep-5 — Select / Tooltip (#298)
  • CSS API sweep-6 — Toast / Dialog (#299)
  • CSS API sweep-7 — Field / FieldSet (#300)
  • 新 lv1 <Icon> + iconVariants (#255)
  • 新 <ThemeProvider> / useTheme() (#260)
  • dist/schatten.manifest.json 新規 export + CI diff check (#279)
  • manifest cssVariables を @layer theme 配下に限定 (#281)
  • per-component CSS subpath @yasmro/schatten/css/<component> (#301)

Patch Changes

  • /audit-coverage slash command + scripts/audit-coverage.mjs (#305)
  • Callout inner flex を .st-callout に昇格 + __content / __action sub-element (#288)
  • Foundation/CSS API vanilla-HTML 実機検証 VRT + dist/schatten.css cascade bug 修正 (#313)
  • DefaultSpinner の Tailwind 依存を raw CSS に置き換え (#289)
  • Button variant="link" icon 孤立を解消、text↔icon 間に 4px gap (#302)
  • Storybook STORYBOOK_CHANNEL を import.meta.env 経由に (#256)
  • Biome noRestrictedImports で core/variants/themes 境界を機械化 (#294)
  • /prepare-release skill 新設 (#309)

Full Changelog: v0.8.0...v0.9.0

Assets 2
Loading