Repository navigation
Releases: kazuemon/ui
Releases · kazuemon/ui
Release list
v0.4.0
Immutable
release. Only release title and notes can be modified.
0.4.0 (2026-10-08)
⚠ BREAKING CHANGES
- Select・Combobox・TagsInput の popoverMoreCue を外しました。影を消す指定（'none'）はなくなり、続きがある端にはいつも内側の影を出します。つまみをいつも出すときは、新しい popoverScrollbar に "always" を渡します (#162) (a01a4ad)
- useToast は知らせの一覧（toasts）を返さなくなりました。一覧は新しい useToasts で読みます。useToast を呼んだ部品は、知らせが出入りしても描き直されません (#159) (b8b2e57)
新しいコンポーネント
- CommandPalette: 打って探し、その場で実行する面。⌘K などで開く (#164) (d9987c0)
- ContextMenu: 右クリック・長押しで、ポインタの位置に開く操作の一覧 (#161) (c2e151a, 072dced, adbd88d)
- DateRangePicker: 期間（始まりと終わりの日）を選ぶ欄 (#164) (d9987c0)
- Editable: ふだんは文字として見え、押すとその場で書き換えられる欄 (#164) (d9987c0)
- FileInput: フォームの 1 行に収まる、ファイルを選ぶ欄 (#164) (d9987c0)
- LoadingOverlay: 領域の上に重ねて読み込み中を示し、下の操作を止める幕 (#164) (d9987c0)
- Menubar: アプリの上に並ぶ、メニューの帯 (#161) (c2e151a, b0ff049, 5bd38c0)
- NavigationMenu: Navbar の帯から、行き先の一覧を下に開くメニュー (#161) (c2e151a, e122851, e5579ad)
- Popconfirm: ボタンのそばに出る、小さな確かめの面 (#164) (d9987c0)
- PreviewCard: リンクに載せる・フォーカスすると出る、行き先のプレビュー。画像の置き方は Card と同じ cardVariant で選ぶ (#161) (c2e151a, 6a36f3b, bdf907f)
- Toolbar: ボタン・トグル・欄を 1 本に並べ、矢印キーで移る帯 (#161) (c2e151a, 7239964, 41b98d0)
新しくできること
- Calendar に、月を 2 つ並べる numberOfMonths を足す (#164) (d9987c0)
- Menu の項目に、アイコンを箱に入れる iconVariant を足す。止まった行では箱を 1 段濃いグレーにする (a85d64d, aa0b29c)
- Table は外観ごと横にスクロールし、マウスで引っぱって動かせる。CodeBlock の横のスクロールも ScrollArea の見た目にする (#162) (4d986c6, c35b1b7, 344d5f6)
- Toggle と ToggleGroup に size を足す (#163) (7c8ea8e)
直したこと
- hover などで色が移り変わるとき、終わりに元の色が一瞬見えてちらつくのを、Slider・Toggle・Dropzone・Chip・Navbar・Progress など 13 か所で直す (#168) (37a3e88)
- Inspector の autoFocus が、開いた直後の描き直しで取りやめられないようにする (#157) (19b08ca)
- Toast の残り時間の線が、面の角丸からはみ出さないようにする (#155) (af4a477)
- 浮かぶ一覧の余白や見出しを押しても、フォーカスが欄から抜けないようにする (#162) (e9bf4e4)
見た目
v0.3.0
Immutable
release. Only release title and notes can be modified.
0.3.0 (2026-10-04)
⚠ BREAKING CHANGES
- PinField の inputProps から id と ref を外す (#129) (494f028)
- 表示・レイアウトの部品に、props の穴のトリアージで見つけた口を足す (#108) (f08601a)
- Card にリンクにするかを決める link を、Link に ↗ を上書きする newTabIcon を足す (#106) (8c478fd)
- Select・Combobox の型引数に、値の型 Value を先頭に足した。
SelectValue<Multiple>・SelectProps<Multiple>・SelectBaseProps<Multiple>・SelectControlProps<Multiple>・ComboboxValue<Multiple>・ComboboxProps<Multiple>・ComboboxBaseProps<Multiple>・ComboboxControlProps<Multiple>、<Combobox<boolean>>のように 型引数を直に書いていたところは、<string, boolean>のように値の型を先に書く。 ListboxItems・ListboxGroup の items は読み取り専用の配列（readonly）になった。 Storybook でMeta<typeof Select>から args の型を読むときは、component: Select<string, boolean>のように 値の型を決めて渡す。 - TagsInput の validate（タグ 1 つずつを確かめる関数）は validateTag に名前を変えた。validate は欄全体（string[]）を確かめる関数になった。
- Navbar の children に NavbarLink を直に並べる書き方は使えなくなりました。NavbarLink は NavbarLinks の中に並べます（<NavbarLink …/>）。
- 重なる面・ナビゲーションの部品に、外から開閉する props や状態の上書きを足す (#101) (119ca2d)
- CodeGroup のタブを名前で決め、Dialog・Drawer の題の省略、SegmentedControl の未選択、DataTable の列の幅を足す (#100) (96b9c3e)
- TextField・MaskField の size は、input の文字数（数値）ではなく大きさの段（'md' | 'sm'）になりました。文字数は inputProps={{ size }} で渡します。
- DropzoneFileList の onRemove・removeName は File ではなく DropzoneFileEntry を受ける
新しいコンポーネント
- DatePicker: 日付を選ぶ欄 (#95) (03af00f, df9e11d)
- MeterGroup: 内訳を分けて塗るバー (#112)
- SegmentedControl: 少ない選択肢から 1 つを選ぶ切り替え (#95) (03af00f, df9e11d)
- TimePicker: 時刻を選ぶ欄 (#95) (03af00f, df9e11d)
新しくできること
- AlertDialog に size・scrollBehavior を足す (713c7b7)
- Button の size="sm"・focusableWhenDisabled、Tooltip の showArrow、Avatar の xs、Stepper の size と dot を足す (#115) (b86cb8d, e4e0e63, f2fb844)
- Calendar の日ごとの印の意味を、getDayContentLabel で日のボタンの読み上げに入れる (785715a)
- Calendar の日ごとの印は、月のすべての日の数字を印の分ずらし、今日の下線を数字と印のあいだに引く (ea0adf7)
- Calendar の週の始まり・期間の制約・日ごとの印、Form の formErrorText、ListItem の status・icon・trailing を足す (#116) (f563762, 3f07e42, aa4e7ee, 77fb4e3, 1a1df19)
- Card に余白の段・押すカード・選んでいる見た目・頭の帯と題・強調の形を、Collapsible・Accordion に枠付きのカードの形を足す (#109) (6bfe263, 0e4a8c9, 7474672, e3f28a0, 1635ed8)
- Carousel の自動の送り・端でつなぐ・複数枚・Thumbnails を横に置く形、Thumbnails の縦向き、Tree の子をあとから読み込む行、Timeline の点のアイコンと状態の色を足す (#114) (fa2b46e, 6b6421e, 9ea39c9, e822295)
- CodeBlock の言語のラベル・最大の高さ・折り返し、Callout の畳める形と見出しの段、Figure のキャプションの寄せ、Text の意味の色、Link の下線の出し方と周りの色、Badge の 0 と右下に重ねる形を足す (#111) (2fa9b63, 554c1c0, fee413b)
- DatePicker に組み立て用の DatePickerControl と positionerProps を足し、開けない欄では開かない (bc42f45)
- Dialog の幅の段・中身だけのスクロール、上から出す Drawer、幅を変えるつまみを Inspector・表の列に足す (#120) (4e9b2d2, 285c576, ec5558e, c58d7de)
- Dialog・AlertDialog・Drawer・Inspector の下の操作を、中身に置ける帯（DialogActions など）にする (#102) (18ce89a)
- DropzoneFileList に保存済みのファイル（name・size・url）を並べられるようにし、Image に仮画像（placeholder）と代わりの画像（fallbackSrc）を足す (41b9f19)
- DropzoneFileList の onRemove・removeName が受け取る値を、File から項目（DropzoneFileEntry）に変えたことを JSDoc に書く (0099c81)
- Gallery の画像に loading・decoding・fetchPriority を渡せるようにする (eb4115f)
- Gallery の項目に、Image の仮画像（placeholder・placeholderBlur）と代わりの画像（fallbackSrc）を渡せるようにする (f3135d9)
- Image と DropzoneFileList のストーリーに、仮画像・代わりの画像・保存済みのファイルの使い方を足す (2afa197)
- ListItem に、印のアイコンの色（iconColor）と文の色（color）を足す (b4431ac)
- Navbar にスクロールで隠す（stickyBehavior）と、いちばん上では透かす面（transparent-until-scroll）を足す (#119) (b83e58f, dcbdd14)
- Navbar の中身を自由にし、行き先を NavbarLinks、ほかのものを NavbarGroup に入れて、狭いときの行き先を narrowPlacement で選べるようにする (#103) (65b1ff3)
- Navbar の隠し方をスクロールに付いてくる形に決め、透かす帯の文字の守り方を transparentVariant で選べるようにする (e19502e)
- RadioGroup・CheckboxGroup の横並び、Divider のラベルと縦線、Gallery の読み込み中を足す (#107) (ed6a16e, ad2da8c, 65b1c8f, 65da03e)
- Select・Combobox・Autocomplete の値を型引数で受け、items に値だけ（文字か数）も渡せるようにする (#105) (aa22c6a)
- Sortable で表の行を並べ替え（SortableItem の render・SortableTableBody）、動かさない行（SortableSeparator）、︙ のメニューに足す項目・ほかのリストへの移動・入れ替えを足す (#117) (4d081b2, c5fa0ff, 5b3b0a1)
- Stat の読み込み中・Progress と Meter の成功と失敗の色・Spinner の大きさと読み上げの名前・Notice の操作を右に置く形を足す (#112) (3630056, ff34c61, [d91d94d](https://github.com/kazuemon/ui/com...
v0.2.0
Immutable
release. Only release title and notes can be modified.
0.2.0 (2026-09-29)
⚠ BREAKING CHANGES
- Heading の size は数字（1〜4）から md〜5xl の名前に変わる（size={2} は size="xl"）。 Stat の size の値も変わる。トークン --text-heading-1〜4 は --text-heading-2xl・xl・lg・md になる。
新しいコンポーネント
- AvatarGroup (#71) (52b673c)
- ButtonGroup (#72) (032ec89)
- DataTable: データの表。TanStack Table でつなぐレシピ付き (#85) (c2f33ee, 6dab745)
- Dropzone: ファイルを落として選ぶ欄と、選んだファイルの一覧 (3a1ff10)
- Fieldset: 欄のまとまり (#91) (4137781, 2383f80)
- Inspector (#77) (b33bde7, 176cf8d)
- SearchFieldControl・PasswordFieldControl (bdeaccb)
- Sidebar: 押しのける列・rail・Drawer／Menu のシート (19daaab)
- Slider: 横向き・単一値 (#70) (5bbf173, d633c70)
- Sortable: 並べ替えられるリスト。dnd-kit でつなぐレシピ付き (435d0ab)
- StatusPanel (#78) (be8c3ca)
- Stepper (#76) (5b11e73, faddd0a)
新しくできること
- docs: 見本のページを追加・細かい不具合を修正 (#87) (5c33924)
- fieldset: 見出しの大きさを Heading の段で選べる labelSize を足す (b0beb74)
- sidebar: 上下に固定する行・件数・行ごとの操作・列の地・幅を変えるつまみ・畳める節・Menu のシートを足す (93d44f5)
- 入力欄のラベルを横に置く・出さない形と、Field で組み立てる形を足す (#89) (6665fe5, 3309cf4)
- 文字の大きさの段を xs〜5xl にし、見出しの大きい 3 段（Hero）を足す (f7ae802)
直したこと
- data-table: レシピの「N 件を選択中」の読み上げの領域をいつも置く（CodeRabbit） (23f08f5)
- dropzone: 1 つしか選べない欄の超過を知らせ、サムネイルの URL を effect の中で作る（CodeRabbit） (d60d6fd)
- dropzone: 値が外から変わったときも input.files を値に合わせる（CodeRabbit） (8e00d3a)
- dropzone: 制御モードでは、受け取った直後も input.files を今の value に合わせる（CodeRabbit） (3cc16a4)
- fieldset: サーバーで描いた HTML でもまとまりに名前を付け、隠れた欄にフォーカスを移さない（CodeRabbit） (28dffb3)
- fieldset: まとまりのエラーを Form の一覧・フォーカスと、1 つだけの Checkbox・Switch に届ける (b9612ae)
- fieldset: まとまりのエラーを中の欄の説明の先頭にもつなぐ (29ad90e)
- inspector: width の割合指定と、はじめから開いているときの autoFocus を直す (71b6a4c)
- PR 前のレビューの指摘を直す（Stat の大きい段の字間・Time などの size・見本） (6cd164a)
- sidebar: SidebarLayout の placement の値を under-header・full-height にする (2cdf457)
- sidebar: レビューの指摘を直す (30502a3)
- sidebar: 狭い画面の Drawer を閉じたら開閉のボタンへ焦点を戻し、見本の試合をキーボードでも開けるようにする (1429d58)
- sidebar: 畳んだ列から引き出して開き、アイコンの行を正方形にし、シートの区切り線と入れ子の題を足す (42b5cc8)
- sidebar: 畳んでも行の縦の位置をそろえ、入れ子の行の塗りを案内線から離し、上下の行の props 名をそろえる (ed86bb7)
- sidebar: 行の札を badge オブジェクトにまとめ、行ごとに畳んだときの形を変えられるようにする (ec0ea71)
- sortable: 動かせない項目をキーボードで動かさない、レシピの項目は初めの 1 回だけ読むと明示する（CodeRabbit） (adf7781)
- sortable: 純正のレシピでは、ドラッグしない並べ替えの ︙ メニューを置く（CodeRabbit） (370bbe4)
- stepper: CodeRabbit の指摘4件を直す（子要素の検証・状態の読み上げ・フォーカス・偽のボタン） (1dd8b7a)
- stepper: value を制御専用にし、クリックの通知を onStepClick に分ける (6e31ddd)
- stepper: フォーカスの戻りを「押した」フラグで判定する（CodeRabbit） (1fe9bf6)
- toggle: connected の見た目の2つの不具合を直す (#74) (40a9bfd)
- セルフレビューの指摘を直す（横のラベルの欄の潰れ・FieldGroup の子・型・部位の置き忘れ） (dc012ba)
- 組み立てた TagsInput で validate の文も読み上げ、ストーリーと JSDoc の説明を直す（CodeRabbit） (7ab8108)
見た目
- Field のラベルの置き場所・組み立て方・横のラベルの既定の比較（軸 385・386・388） (341bb8d)
- Fieldset の囲み方・見出しの強さ・まとまりのエラーの比較（軸 389・390・391） (5132b4b)
- inspector: 軸 350〜355 の決定を反映する（ADR-0320〜0325） (1b66f17)
- Sidebar の比較ストーリー（軸 379〜384）と、比べるための部品の機能を置く (2caa320)
- slider: 押しているあいだの手応えを pressEffect で選べるようにする（ADR-0321） (2e89942)
- slider: 軸 321 を押しているあいだの手応えの比較に作り直す (2ef1963)
- stepper: マーカーと向きの比較ストーリーを置く（軸340・341） (7bb3cc1)
- 見出しの大きい段の比較（軸 387） (fbc1e5c)