@particle-academy/react-fancy 5.42.0 → 5.43.0

package/CHANGELOG.md

@@ -11,6 +11,68 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [5.43.0] - 2026-10-17
+
+### Fixed
+
+- **A click in a big `TreeNav` no longer re-renders the whole tree.** Selection,
+  expansion and drag state lived in one context that every row read, so one click
+  re-rendered every row. Measured in a real browser on Genie 2's file browser
+  shape (5,000 nodes, 6 levels, all expanded): **175–267 ms per click before,
+  17–20 ms after**, with no change to your code. Rows now subscribe to their own
+  slice (am I selected / expanded / the drop target?), handlers are stable, and
+  expansion is a Set lookup instead of an array scan per row.
+
+  `useTreeNav()` is unchanged and still live: a component that reads it gets
+  current `selectedId` / `expandedIds` exactly as before.
+
+### Added
+
+- **`<TreeNav virtualize height={600}>` renders only the rows in view.** The
+  visible rows (expanded folders only) are flattened and windowed by
+  `VirtualList`; selection, expansion, context menus and drag-and-drop behave as
+  in the nested tree. Same tree, all expanded: **33 rows in the DOM instead of
+  5,000, and 30 ms to mount instead of 614 ms.** `rowHeight` seeds the row
+  estimate (default 26). The nested DOM wrapper
+  `data-react-fancy-tree-node-children` does not exist in this mode — rows are
+  flat, indented by `paddingLeft`.
+
+- **`TreeNav` has tests.** It had none, which is why a refactor this size starts
+  with them: selection, toggling, lazy mounting, `useTreeNav`, virtual rows and
+  drag-and-drop in both modes.
+
+**What you must DO: nothing.** `virtualize` is off by default and the nested tree
+renders the same DOM as before. Collapsed folders were already cheap — their
+children are not mounted until expanded — and still are.
+
+## [5.42.1] - 2026-10-17
+
+### Fixed
+
+- **A filled `Button`'s icon and badge now take the label's colour** (react-fancy#34,
+  from the MOIC estate). They were hard-coded `text-white`, so on
+  `color="brand"` with a host's per-mode pair (pale blue `#BFD7EA` with navy
+  `#003057` contrast) the label turned navy and the icon stayed WHITE on pale
+  blue — nearly invisible. The same bug hit **every host** on `amber`, `yellow`
+  and `lime`, whose labels are dark: white icons on yellow. The icon is now
+  `text-current` and the badge `bg-current/20 text-current`, following the
+  colour's own text class. White-label colours (`blue`, `red`, …) look exactly
+  as before.
+- **A `badge` or `avatar` no longer renders twice.** With `badgeTrailing` /
+  `avatarTrailing` unset, the check `badgeTrailing ?? trailing` was true in BOTH
+  the leading and trailing passes, so every badge appeared before and after the
+  label. They now render once, leading unless the `…Trailing` prop says
+  otherwise, as the docs and `alertIconTrailing` already had it.
+
+### Added
+
+- `data-action-icon` (`leading` / `trailing`) on a Button's icon wrapper, beside
+  the existing `data-action-badge` / `data-action-avatar` handles.
+
+**What you must DO: nothing.** If you had added a `className` to force a dark
+icon onto a light-filled button, you can remove it; if you had hidden one of
+the two duplicate badges with CSS, remove that too.
+
 ## [5.42.0] - 2026-10-17
 
 ### Fixed

package/dist/button.cjs

@@ -1,7 +1,7 @@
 'use strict';
 
 require('./chunk-M5MUGSON.cjs');
-var chunkRMJGF7MN_cjs = require('./chunk-RMJGF7MN.cjs');
+var chunkICQJ6475_cjs = require('./chunk-ICQJ6475.cjs');
 require('./chunk-BFKCVSNK.cjs');
 require('./chunk-XCZZVRBY.cjs');
 require('./chunk-QKFOJKVE.cjs');
@@ -11,11 +11,11 @@ require('./chunk-ZU5Q77OT.cjs');
 
 Object.defineProperty(exports, "Action", {
   enumerable: true,
-  get: function () { return chunkRMJGF7MN_cjs.Action; }
+  get: function () { return chunkICQJ6475_cjs.Action; }
 });
 Object.defineProperty(exports, "Button", {
   enumerable: true,
-  get: function () { return chunkRMJGF7MN_cjs.Button; }
+  get: function () { return chunkICQJ6475_cjs.Button; }
 });
 //# sourceMappingURL=button.cjs.map
 //# sourceMappingURL=button.cjs.map

package/dist/button.js

@@ -1,5 +1,5 @@
 import './chunk-LQ4ICCN2.js';
-export { Action, Button } from './chunk-46IPQEUP.js';
+export { Action, Button } from './chunk-JJRD3WX3.js';
 import './chunk-XJXQG34J.js';
 import './chunk-45BBNJQD.js';
 import './chunk-IVRYSSM7.js';

package/dist/{chunk-FQLL2JI7.js → chunk-G4WYCWIQ.js}

@@ -7,7 +7,7 @@ import { DisplayValue } from './chunk-KKWNKBKR.js';
 import { resolveOption } from './chunk-GFYSELJF.js';
 import { ColorPicker } from './chunk-F2GAZZVS.js';
 import { Badge } from './chunk-6FCQD2KQ.js';
-import { Button } from './chunk-46IPQEUP.js';
+import { Button } from './chunk-JJRD3WX3.js';
 import { Callout } from './chunk-ZXZJYVWP.js';
 import { Text } from './chunk-5RLP77KK.js';
 import { useInlineEdit } from './chunk-OL53XYHF.js';
@@ -1337,5 +1337,5 @@ function buildItems({
 }
 
 export { JSON_FIELD_TYPES, JsonEditor, applyJsonEdit, describeEdit, findJsonConflicts, getAtPath, inferType, parseKeyMap, parsePath, pathToString, resolveKeyRule, typeMatches };
-//# sourceMappingURL=chunk-FQLL2JI7.js.map
-//# sourceMappingURL=chunk-FQLL2JI7.js.map
+//# sourceMappingURL=chunk-G4WYCWIQ.js.map
+//# sourceMappingURL=chunk-G4WYCWIQ.js.map