@jirawatpyk/aura-react 5.27.0 → 5.29.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +13 -0
- package/dist/aura.bundle.js +250 -191
- package/dist/cjs/index.cjs +250 -191
- package/dist/esm/DataTable.js +39 -8
- package/dist/esm/Tag.js +42 -15
- package/dist/index.d.cts +10 -0
- package/dist/index.d.ts +10 -0
- package/dist/styles.css +23 -0
- package/dist/styles.layer.css +23 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -186,6 +186,19 @@ DataTable with sort and page in the URL (4.17): `onStateChange={({ sort, page })
|
|
|
186
186
|
- **Time zone**: `timeZone` on AuraProvider, DatePicker, DateRangePicker and Calendar decides "today" (the marker, `min`/`max="today"`, the first month shown); or pass `today` as an ISO date. `todayIn('Asia/Bangkok')` is exported from the root and `/server`.
|
|
187
187
|
- **Toasts** queue past three instead of dropping: six in a row all show, in order, three at a time.
|
|
188
188
|
|
|
189
|
+
## 5.29 — Chamber-OS addendum 37
|
|
190
|
+
|
|
191
|
+
- **DataTable loading rows match the rows they stand in for** (item 134), so the layout doesn't jump when the rows arrive:
|
|
192
|
+
- **Height:** with `rowHeight="auto"` skeleton rows get the same `--auto` class and minimum height as real rows. A column's new **`skeletonLines`** (default 1, at most 10; a `pill` column keeps one pill) draws that many bars, one per text line — `skeletonLines: 2` for a reason and its evidence. On an `align: 'end'` column they line up at the end. Each bar sits on a 20px body line in the grid (a caption line is 16–18px, so a row can come out a few px taller than the real one) and on the 15px value line in a card.
|
|
193
|
+
- **Stacked cards:** skeleton cards keep each field's label (`data-label`) above its bar, as a real card does.
|
|
194
|
+
- **Row actions:** an `actions` cell draws one square and a `card: 'footer'` cell a bar across the cell (in a card, the full row, as a Button there fills it), at the small button's height (32px), in the grid as well as in cards. When the column's buttons use `touchHeight`, give the column the new **`skeletonTouch`**: its bars are then 44px below 640px and on a coarse pointer, as those buttons are. A footer that holds only an IconButton still gets the full-width bar; the heights match.
|
|
195
|
+
- **Unchanged:** skeleton rows stay `aria-hidden`, the pulse stops under reduced motion, `skeletonRows`, `bleed` / `bleedEnd`. Without `rowHeight="auto"` the grid's skeleton rows keep the fixed row height.
|
|
196
|
+
|
|
197
|
+
## 5.28 — Chamber-OS addenda 35–36
|
|
198
|
+
|
|
199
|
+
- **Applied-filter chips show their whole text** (item 132): in `FilterBar`'s chips row a chip takes its text's own width ("Submitted: 28 Aug – 3 Sept 2026", "Member: Midsommar Hospitality Co., Ltd."); only a chip wider than the row is cut, with an ellipsis, and a long chip never widens the FilterBar or its parents (the chips row takes its width from the bar; a bar holding only chips needs a width from its parent, as a block has). A Tag outside FilterBar keeps its 24ch cap. **Whenever a Tag's text is cut** — the 24ch cap or the row — the full text shows on hover (`title`) and, on a removable Tag, in a Tooltip on the remove button's hover and focus; the remove button's name already carries the full text for screen readers. On touch screens a cut chip can't be hovered — keep labels short enough for a phone row where you can.
|
|
200
|
+
- **"Clear all" has a touch height** (item 133): FilterBar's own "Clear all" is at least 44px tall below 640px and wherever the primary pointer is coarse, as Button's `touchHeight`; with a mouse from 640px up it stays the compact link. Its look (accent, underline) and place are unchanged.
|
|
201
|
+
|
|
189
202
|
## 5.27 — Chamber-OS addenda 33–34
|
|
190
203
|
|
|
191
204
|
- **`bleed` reaches through your own wrappers** (item 130): a bleeding DataTable or Table now spans the Card from anywhere in its content — inside a `flex flex-col gap-4` column, a container-query `div`, a `role="tabpanel"` — as long as those wrappers add no padding or frame and don't clip or scroll (`overflow` other than `visible`): a padded wrapper leaves the table short of the card's edge by that padding, and a clipping or scrolling one cuts it off or adds scrollbars. A nested Card resets the reach to its own padding. The last-content rule is unchanged: only a table that is the Card content's direct, last child drops its bottom rule automatically; inside wrappers pass **`bleedEnd`** when nothing follows the table in the card (and the Card has no `footer`), and the card's radius closes it. Without `bleedEnd`, a pager or link after the table keeps the rule; don't pass `bleedEnd` then, or what follows is pulled up over the table. Still nothing below `flushBelow` or outside a Card.
|