@botiverse/raft-ui 0.69.0 → 0.70.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/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,12 @@
|
|
|
1
|
+
## [0.70.0](https://github.com/botiverse/raft-design/compare/v0.69.0...v0.70.0) (2026-11-06)
|
|
2
|
+
|
|
3
|
+
### Fixed
|
|
4
|
+
|
|
5
|
+
- **PickerTriggerButton** and **SegmentedControlItem**: on a phone and a touch screen they still look 32px but take a 44px tap area, as a Button at `md` does, through a transparent `::after` 6px past the box above and below. A segment's reaches up and down only (3px past its track), so the tap areas of segments 3px apart don't overlap; while the segments scroll inside the track (`data-overflowing`), the track scrolls sideways only and the tap area stops at its edge. ([#1041](https://github.com/botiverse/raft-design/pull/1041))
|
|
6
|
+
- Why: they were the two controls of a toolbar or filter row whose tap area stayed 32px by touch, beside an `md` Button and an `md` InputGroup that reach 44px.
|
|
7
|
+
- Affects: touch screens, and windows narrower than 768px; with a mouse on a desktop they are the control height, 34px, and take no taps past the box, as before. Keep 6px between them and the controls above and below, as with a Button at `md`.
|
|
8
|
+
- Docs: https://raft-design.botiverse.build/foundations/spacing/#heights
|
|
9
|
+
|
|
1
10
|
## [0.69.0](https://github.com/botiverse/raft-design/compare/v0.68.0...v0.69.0) (2026-11-06)
|
|
2
11
|
|
|
3
12
|
### Added
|
|
@@ -5,6 +5,7 @@ import { Button } from "@base-ui/react/button";
|
|
|
5
5
|
//#region src/components/picker-trigger-button/picker-trigger-button.tsx
|
|
6
6
|
const pickerTriggerButton = tv({ base: [
|
|
7
7
|
"relative inline-flex h-8 md:pointer-fine:h-control shrink-0 items-center justify-center",
|
|
8
|
+
"after:absolute after:inset-x-0 after:-inset-y-1.5 md:pointer-fine:after:hidden",
|
|
8
9
|
"whitespace-nowrap select-none",
|
|
9
10
|
"outline-[1px] outline-offset-2 outline-transparent transition-colors duration-100 focus-visible:outline-transparent",
|
|
10
11
|
"disabled:pointer-events-none disabled:transform-none",
|
|
@@ -13,13 +13,14 @@ const segmentedControl = tv({
|
|
|
13
13
|
"inline-flex min-w-0 items-center",
|
|
14
14
|
"w-fit max-w-full flex-nowrap gap-[3px] rounded-[11px] bg-fill-muted p-[3px]",
|
|
15
15
|
"[--segment-size:2rem] md:pointer-fine:[--segment-size:var(--control-height)]",
|
|
16
|
-
"data-overflowing:overflow-x-auto data-overflowing:overscroll-x-contain data-overflowing:scrollbar-none"
|
|
16
|
+
"data-overflowing:overflow-x-auto data-overflowing:overflow-y-hidden data-overflowing:overscroll-x-contain data-overflowing:scrollbar-none"
|
|
17
17
|
],
|
|
18
18
|
item: [
|
|
19
19
|
"inline-flex min-w-0 shrink-0 items-center gap-1.5",
|
|
20
20
|
"outline-none disabled:pointer-events-none",
|
|
21
21
|
"[&_svg]:pointer-events-none [&_svg]:shrink-0",
|
|
22
22
|
"h-(--segment-size) justify-center rounded-control border-[1.5px] border-transparent bg-transparent px-3",
|
|
23
|
+
"relative after:absolute after:inset-x-0 after:-inset-y-[calc(--spacing(1.5)+1.5px)] md:pointer-fine:after:hidden",
|
|
23
24
|
"font-sans text-callout font-semibold text-foreground-muted",
|
|
24
25
|
"[&_svg:not([class*='size-'])]:size-4",
|
|
25
26
|
"hover:bg-fill-medium active:bg-fill-medium",
|