tosijs-ui 1.16.20 → 1.16.21

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## 1.16.21
+
+- **Expanding or collapsing a table row's detail no longer corrects `scrollTop` itself.**
+  tosijs 1.10.9's variable-height list keeps the row in place across the height change, so
+  `<tosi-table>` stopped measuring the row and nudging the scroll position up to three
+  times. closes board #3326
+- **tosijs peer floor raised to `^1.10.9`**, the release that anchors the list. On an older
+  tosijs the toggled row now jumps when its detail opens or closes; upgrade tosijs alongside
+  (`dist/iife.js` already bundles 1.10.9).
+- **The icons page points to [lucide](https://lucide.dev)** in its introduction and under
+  Icon Sources: a fork and expansion of Feather, and the place to start for more icons in
+  the same style.
+
+
 ## 1.16.20
 
 - **A registered icon with style suffixes wins over a composition rule.** `checkCircle90r`

package/dist/data-table.js

@@ -1770,24 +1770,11 @@ export class TosiTable extends withAttributes({
             this._detailEls.delete(key);
         }
         const rowEl = this.stampedRow(raw);
-        const top = rowEl?.getBoundingClientRect().top;
         if (rowEl)
             this.syncDetail(rowEl, raw);
+        // The list anchors itself across a height change (tosijs 1.10.9), so the toggled row
+        // keeps its place without a scrollTop correction here.
         this.remeasureRows();
-        /*
-        Keep the toggled row where it was. A variable-height list places its rows by
-        interpolation, so a row that changes height moves every row, itself included, by an
-        amount that depends on how far down the list is scrolled.
-        */
-        if (top !== undefined && this._scrollArea) {
-            for (let i = 0; i < 3; i += 1) {
-                const now = this.stampedRow(raw)?.getBoundingClientRect().top;
-                if (now === undefined || Math.abs(now - top) < 1)
-                    break;
-                this._scrollArea.scrollTop += now - top;
-                this.remeasureRows();
-            }
-        }
         this.dispatchEvent(new CustomEvent(want ? 'rowexpand' : 'rowcollapse', {
             bubbles: true,
             detail: { row: raw, element: element?.firstElementChild ?? null },

package/dist/icons.js

@@ -11,6 +11,11 @@
 e.g. `icons.chevronDown()` produces an `<svg>` element containing a downward-pointing chevron
 icon with the class `icon-chevron-down`.
 
+Most of the built-in icons come from [Feather](https://feathericons.com). If you want more
+icons in the same style, [lucide](https://lucide.dev) is a fork and expansion of Feather and a
+great place to start: its SVGs drop straight into `defineIcons()` (see
+[Need More Icons?](#need-more-icons)).
+
 ```js
 const  { tosi, elements } = tosijs
 import { icons, svgIcon, postNotification } from 'tosijs-ui'
@@ -202,8 +207,8 @@ probably be broken out as a standalone library to allow the use of whatever icon
 
 ### Need More Icons?
 
-[lucide](https://lucide.dev) is a fork of feather that maintains the style and adds a lot more
-options. Obviously it's completely compatible with this icon system and generously licensed. A
+[lucide](https://lucide.dev) is a fork and expansion of feather that maintains the style and
+adds a lot more options. Obviously it's completely compatible with this icon system and generously licensed. A
 good place to find more icons in a pinch.
 
 Concretely: lucide emits the same geometry feather does — `24×24` viewBox, `fill="none"`,
@@ -532,6 +537,7 @@ and render a `square` (in fact, `icons.square()`) as a fallback.
 
 Many of these icons are sourced from [Feather Icons](https://github.com/feathericons/feather), but
 all the icons have been processed to have integer coordinates in a `viewBox` typically scaled to 1024  &times; 1024.
+For more in the same style, [lucide](https://lucide.dev) is a fork and expansion of Feather.
 
 The corporate logos (Google, etc.) are from a variety of sources, in many cases ultimately from the
 organizations themselves. It's up to you to use them correctly.