@botiverse/raft-ui 0.41.0 → 0.43.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 +25 -0
- package/dist/{inbox-item-IkU1PDsA.mjs → inbox-item-BkhqEaUM.mjs} +169 -5
- package/dist/index.d.mts +24 -3
- package/dist/index.mjs +42 -9
- package/dist/styles.css +12 -4
- package/dist/wip.mjs +10 -3
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,28 @@
|
|
|
1
|
+
## [0.43.0](https://github.com/botiverse/raft-design/compare/v0.42.0...v0.43.0) (2026-10-28)
|
|
2
|
+
|
|
3
|
+
### Design System
|
|
4
|
+
|
|
5
|
+
- **Frame insets:** tooltips flip away from every frame inset (`--raft-frame-inset-top`, `-start`, `-end`), and popups stay 8px clear of one. Start and end follow the popup's text direction. With no inset set, which is every web page, nothing moves. ([#860](https://github.com/botiverse/raft-design/pull/860))
|
|
6
|
+
- Docs: https://raft-design.botiverse.build/patterns/page-structure/#frame-insets
|
|
7
|
+
|
|
8
|
+
### Changed
|
|
9
|
+
|
|
10
|
+
- **Tooltip:** keeps at least 5px, or the inset, from the top, left and right. ([#860](https://github.com/botiverse/raft-design/pull/860))
|
|
11
|
+
- **Popover, DropdownMenu, PreviewCard:** keep the inset plus 8px from each side that has an inset. ([#860](https://github.com/botiverse/raft-design/pull/860))
|
|
12
|
+
- **ContextMenu, Select, Combobox, ComboboxSelect, NotificationCenter:** keep the larger of their default and the inset plus 8px. A `collisionPadding` you pass still wins. ([#860](https://github.com/botiverse/raft-design/pull/860))
|
|
13
|
+
|
|
14
|
+
## [0.42.0](https://github.com/botiverse/raft-design/compare/v0.41.0...v0.42.0) (2026-10-28)
|
|
15
|
+
|
|
16
|
+
### Design System
|
|
17
|
+
|
|
18
|
+
- **Frame insets:** a host shell that draws native window controls over the page (the desktop app's macOS traffic lights, Windows' caption buttons) publishes them on the root element as `--raft-frame-inset-start`, `--raft-frame-inset-end` and `--raft-frame-inset-top`; the web sets none. ([#856](https://github.com/botiverse/raft-design/pull/856))
|
|
19
|
+
- Docs: https://raft-design.botiverse.build/components/tooltip/
|
|
20
|
+
|
|
21
|
+
### Changed
|
|
22
|
+
|
|
23
|
+
- **Tooltip:** one that would open into `--raft-frame-inset-top` flips below its trigger; one beside its trigger moves down out of it. ([#856](https://github.com/botiverse/raft-design/pull/856))
|
|
24
|
+
- **frame-decor-top** (the top bar's theme strip) is placed from the bar's end plus `--raft-frame-inset-end`, and a bar drops it when the whole strip can't fit clear of its trailing actions. ([#856](https://github.com/botiverse/raft-design/pull/856))
|
|
25
|
+
|
|
1
26
|
## [0.41.0](https://github.com/botiverse/raft-design/compare/v0.40.0...v0.41.0) (2026-10-28)
|
|
2
27
|
|
|
3
28
|
### Design System
|
|
@@ -1652,6 +1652,131 @@ function Experimental(props) {
|
|
|
1652
1652
|
}
|
|
1653
1653
|
const Badge = Object.assign(BadgeRoot, { Experimental });
|
|
1654
1654
|
//#endregion
|
|
1655
|
+
//#region src/lib/frame-insets.ts
|
|
1656
|
+
const NO_FRAME_INSETS = Object.freeze({
|
|
1657
|
+
top: 0,
|
|
1658
|
+
right: 0,
|
|
1659
|
+
bottom: 0,
|
|
1660
|
+
left: 0
|
|
1661
|
+
});
|
|
1662
|
+
const PX_LENGTH = /^-?(\d+\.?\d*|\.\d+)px$/;
|
|
1663
|
+
/**
|
|
1664
|
+
* Turns the variables' values into physical px insets. An unset value is 0, a
|
|
1665
|
+
* px value is read as written, and any other CSS length (a calc() is kept as
|
|
1666
|
+
* written in the computed value of an unregistered custom property) is
|
|
1667
|
+
* measured. In left to right -start is the left side and -end the right; in
|
|
1668
|
+
* right to left they swap.
|
|
1669
|
+
*/
|
|
1670
|
+
function frameInsetsFrom(values, rtl, measure) {
|
|
1671
|
+
const read = (raw, axis) => {
|
|
1672
|
+
const value = raw.trim();
|
|
1673
|
+
if (value === "") return 0;
|
|
1674
|
+
const px = PX_LENGTH.test(value) ? Number.parseFloat(value) : measure(value, axis);
|
|
1675
|
+
return Number.isFinite(px) ? Math.max(0, px) : 0;
|
|
1676
|
+
};
|
|
1677
|
+
const top = read(values.top, "block");
|
|
1678
|
+
const start = read(values.start, "inline");
|
|
1679
|
+
const end = read(values.end, "inline");
|
|
1680
|
+
if (top === 0 && start === 0 && end === 0) return NO_FRAME_INSETS;
|
|
1681
|
+
return {
|
|
1682
|
+
top,
|
|
1683
|
+
right: rtl ? start : end,
|
|
1684
|
+
bottom: 0,
|
|
1685
|
+
left: rtl ? end : start
|
|
1686
|
+
};
|
|
1687
|
+
}
|
|
1688
|
+
function contextElement(container) {
|
|
1689
|
+
const node = container && "current" in container ? container.current : container;
|
|
1690
|
+
if (node instanceof Element) return node;
|
|
1691
|
+
if (node && "host" in node) return node.host;
|
|
1692
|
+
return document.body ?? document.documentElement;
|
|
1693
|
+
}
|
|
1694
|
+
function measureWithProbe(root) {
|
|
1695
|
+
let probe = null;
|
|
1696
|
+
const measure = (value, axis) => {
|
|
1697
|
+
if (!probe) {
|
|
1698
|
+
probe = document.createElement("div");
|
|
1699
|
+
probe.style.cssText = "position:fixed;top:0;left:0;width:0;height:0;visibility:hidden;pointer-events:none";
|
|
1700
|
+
root.append(probe);
|
|
1701
|
+
}
|
|
1702
|
+
probe.style.width = "0";
|
|
1703
|
+
probe.style.height = "0";
|
|
1704
|
+
probe.style.setProperty(axis === "block" ? "height" : "width", value);
|
|
1705
|
+
const box = probe.getBoundingClientRect();
|
|
1706
|
+
return axis === "block" ? box.height : box.width;
|
|
1707
|
+
};
|
|
1708
|
+
return Object.assign(measure, { done: () => probe?.remove() });
|
|
1709
|
+
}
|
|
1710
|
+
/**
|
|
1711
|
+
* Reads the frame insets once, as physical px. The direction is the one the
|
|
1712
|
+
* popup renders in: the computed `direction` of its portal container (the
|
|
1713
|
+
* body by default), so `dir="rtl"` on the document or on the nearest ancestor
|
|
1714
|
+
* of the container counts.
|
|
1715
|
+
*/
|
|
1716
|
+
function readFrameInsets(container) {
|
|
1717
|
+
if (typeof document === "undefined") return NO_FRAME_INSETS;
|
|
1718
|
+
const root = document.documentElement;
|
|
1719
|
+
const style = getComputedStyle(root);
|
|
1720
|
+
const values = {
|
|
1721
|
+
top: style.getPropertyValue("--raft-frame-inset-top"),
|
|
1722
|
+
start: style.getPropertyValue("--raft-frame-inset-start"),
|
|
1723
|
+
end: style.getPropertyValue("--raft-frame-inset-end")
|
|
1724
|
+
};
|
|
1725
|
+
if (values.top.trim() === "" && values.start.trim() === "" && values.end.trim() === "") return NO_FRAME_INSETS;
|
|
1726
|
+
const rtl = getComputedStyle(contextElement(container)).direction === "rtl";
|
|
1727
|
+
const measure = measureWithProbe(root);
|
|
1728
|
+
try {
|
|
1729
|
+
return frameInsetsFrom(values, rtl, measure);
|
|
1730
|
+
} finally {
|
|
1731
|
+
measure.done();
|
|
1732
|
+
}
|
|
1733
|
+
}
|
|
1734
|
+
/**
|
|
1735
|
+
* The collision padding with the insets added: on each side with an inset,
|
|
1736
|
+
* at least the inset plus `gap`; elsewhere `padding` as it is. With no inset
|
|
1737
|
+
* the padding comes back unchanged, so nothing moves on the web.
|
|
1738
|
+
*/
|
|
1739
|
+
function frameCollisionPadding(padding, insets, gap) {
|
|
1740
|
+
if (insets.top === 0 && insets.right === 0 && insets.bottom === 0 && insets.left === 0) return padding;
|
|
1741
|
+
const base = typeof padding === "number" ? {
|
|
1742
|
+
top: padding,
|
|
1743
|
+
right: padding,
|
|
1744
|
+
bottom: padding,
|
|
1745
|
+
left: padding
|
|
1746
|
+
} : padding;
|
|
1747
|
+
const side = (key) => {
|
|
1748
|
+
const own = base[key] ?? 0;
|
|
1749
|
+
return insets[key] > 0 ? Math.max(own, insets[key] + gap) : own;
|
|
1750
|
+
};
|
|
1751
|
+
return {
|
|
1752
|
+
top: side("top"),
|
|
1753
|
+
right: side("right"),
|
|
1754
|
+
bottom: side("bottom"),
|
|
1755
|
+
left: side("left")
|
|
1756
|
+
};
|
|
1757
|
+
}
|
|
1758
|
+
/**
|
|
1759
|
+
* The frame insets, read when the calling component mounts. Call it from a
|
|
1760
|
+
* part inside the popup's portal, which mounts each time the popup opens.
|
|
1761
|
+
*/
|
|
1762
|
+
function useFrameInsets(container) {
|
|
1763
|
+
const [insets] = useState(() => readFrameInsets(container));
|
|
1764
|
+
return insets;
|
|
1765
|
+
}
|
|
1766
|
+
/**
|
|
1767
|
+
* A popup's collision padding (a popover, a menu, a select or combobox list,
|
|
1768
|
+
* a preview card): `defaultPadding` where there is no inset, and 8px inside
|
|
1769
|
+
* each inset. A `collisionPadding` the caller passes wins as it is.
|
|
1770
|
+
*/
|
|
1771
|
+
function usePopupCollisionPadding(collisionPadding, defaultPadding, container) {
|
|
1772
|
+
const insets = useFrameInsets(container);
|
|
1773
|
+
return useMemo(() => collisionPadding ?? frameCollisionPadding(defaultPadding, insets, 8), [
|
|
1774
|
+
collisionPadding,
|
|
1775
|
+
defaultPadding,
|
|
1776
|
+
insets
|
|
1777
|
+
]);
|
|
1778
|
+
}
|
|
1779
|
+
//#endregion
|
|
1655
1780
|
//#region src/components/tooltip/tooltip.tsx
|
|
1656
1781
|
const tooltip = tv$1({
|
|
1657
1782
|
slots: {
|
|
@@ -1797,13 +1922,27 @@ const CONTENT_COLLISION_AVOIDANCE = {
|
|
|
1797
1922
|
align: "shift",
|
|
1798
1923
|
fallbackAxisSide: "none"
|
|
1799
1924
|
};
|
|
1925
|
+
/**
|
|
1926
|
+
* Inside the portal, so it mounts each time the tooltip opens and reads the
|
|
1927
|
+
* frame insets then (lib/frame-insets.ts): a tooltip that would open into
|
|
1928
|
+
* one flips away from it, and one that would overlap it along its trigger
|
|
1929
|
+
* shifts out of it. Its padding grows to the inset itself, not past it.
|
|
1930
|
+
*/
|
|
1931
|
+
function TooltipFramePositioner({ collisionPadding, container, ...props }) {
|
|
1932
|
+
const insets = useFrameInsets(container);
|
|
1933
|
+
const padding = useMemo(() => frameCollisionPadding(collisionPadding ?? 5, insets, 0), [collisionPadding, insets]);
|
|
1934
|
+
return /* @__PURE__ */ jsx(Tooltip.Positioner, {
|
|
1935
|
+
collisionPadding: padding,
|
|
1936
|
+
...props
|
|
1937
|
+
});
|
|
1938
|
+
}
|
|
1800
1939
|
function TooltipContent({ align = "center", alignOffset = 0, anchor, arrowPadding, collisionAvoidance = CONTENT_COLLISION_AVOIDANCE, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "top", sideOffset, sticky, container, portalProps, className, children, ...props }) {
|
|
1801
1940
|
const { positioner, content } = tooltip();
|
|
1802
1941
|
const portalContainer = container !== void 0 ? container : portalProps?.container;
|
|
1803
1942
|
return /* @__PURE__ */ jsx(TooltipPortal, {
|
|
1804
1943
|
...portalProps,
|
|
1805
1944
|
container: portalContainer,
|
|
1806
|
-
children: /* @__PURE__ */ jsx(
|
|
1945
|
+
children: /* @__PURE__ */ jsx(TooltipFramePositioner, {
|
|
1807
1946
|
align,
|
|
1808
1947
|
alignOffset,
|
|
1809
1948
|
anchor,
|
|
@@ -1811,6 +1950,7 @@ function TooltipContent({ align = "center", alignOffset = 0, anchor, arrowPaddin
|
|
|
1811
1950
|
collisionAvoidance,
|
|
1812
1951
|
collisionBoundary,
|
|
1813
1952
|
collisionPadding,
|
|
1953
|
+
container: portalContainer,
|
|
1814
1954
|
disableAnchorTracking,
|
|
1815
1955
|
positionMethod,
|
|
1816
1956
|
side,
|
|
@@ -2468,12 +2608,19 @@ function DropdownMenuPopup({ className, ...props }) {
|
|
|
2468
2608
|
...props
|
|
2469
2609
|
});
|
|
2470
2610
|
}
|
|
2611
|
+
function DropdownMenuFramePositioner({ collisionPadding, container, ...props }) {
|
|
2612
|
+
const padding = usePopupCollisionPadding(collisionPadding, 5, container);
|
|
2613
|
+
return /* @__PURE__ */ jsx(Menu.Positioner, {
|
|
2614
|
+
collisionPadding: padding,
|
|
2615
|
+
...props
|
|
2616
|
+
});
|
|
2617
|
+
}
|
|
2471
2618
|
function DropdownMenuContent({ align = "start", alignOffset = 0, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "bottom", sideOffset, sticky, portalProps, className, ...props }) {
|
|
2472
2619
|
const resolvedSideOffset = sideOffset ?? 6;
|
|
2473
2620
|
const { positioner, content } = dropdownMenu();
|
|
2474
2621
|
return /* @__PURE__ */ jsx(DropdownMenuPortal, {
|
|
2475
2622
|
...portalProps,
|
|
2476
|
-
children: /* @__PURE__ */ jsx(
|
|
2623
|
+
children: /* @__PURE__ */ jsx(DropdownMenuFramePositioner, {
|
|
2477
2624
|
align,
|
|
2478
2625
|
alignOffset,
|
|
2479
2626
|
anchor,
|
|
@@ -2481,6 +2628,7 @@ function DropdownMenuContent({ align = "start", alignOffset = 0, anchor, arrowPa
|
|
|
2481
2628
|
collisionAvoidance,
|
|
2482
2629
|
collisionBoundary,
|
|
2483
2630
|
collisionPadding,
|
|
2631
|
+
container: portalProps?.container,
|
|
2484
2632
|
disableAnchorTracking,
|
|
2485
2633
|
positionMethod,
|
|
2486
2634
|
side,
|
|
@@ -2982,13 +3130,20 @@ function PopoverPopup({ className, ...props }) {
|
|
|
2982
3130
|
...props
|
|
2983
3131
|
});
|
|
2984
3132
|
}
|
|
3133
|
+
function PopoverFramePositioner({ collisionPadding, container, ...props }) {
|
|
3134
|
+
const padding = usePopupCollisionPadding(collisionPadding, 5, container);
|
|
3135
|
+
return /* @__PURE__ */ jsx(Popover.Positioner, {
|
|
3136
|
+
collisionPadding: padding,
|
|
3137
|
+
...props
|
|
3138
|
+
});
|
|
3139
|
+
}
|
|
2985
3140
|
function PopoverContent({ align = "start", alignOffset = 0, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "bottom", sideOffset = 4, sticky, container, portalProps, className, ...props }) {
|
|
2986
3141
|
const { positioner, content } = popover();
|
|
2987
3142
|
const portalContainer = container !== void 0 ? container : portalProps?.container;
|
|
2988
3143
|
return /* @__PURE__ */ jsx(PopoverPortal, {
|
|
2989
3144
|
...portalProps,
|
|
2990
3145
|
container: portalContainer,
|
|
2991
|
-
children: /* @__PURE__ */ jsx(
|
|
3146
|
+
children: /* @__PURE__ */ jsx(PopoverFramePositioner, {
|
|
2992
3147
|
align,
|
|
2993
3148
|
alignOffset,
|
|
2994
3149
|
anchor,
|
|
@@ -2996,6 +3151,7 @@ function PopoverContent({ align = "start", alignOffset = 0, anchor, arrowPadding
|
|
|
2996
3151
|
collisionAvoidance,
|
|
2997
3152
|
collisionBoundary,
|
|
2998
3153
|
collisionPadding,
|
|
3154
|
+
container: portalContainer,
|
|
2999
3155
|
disableAnchorTracking,
|
|
3000
3156
|
positionMethod,
|
|
3001
3157
|
side,
|
|
@@ -3442,11 +3598,18 @@ function PreviewCardPopup({ className, ...props }) {
|
|
|
3442
3598
|
...scopeProps
|
|
3443
3599
|
});
|
|
3444
3600
|
}
|
|
3601
|
+
function PreviewCardFramePositioner({ collisionPadding, container, ...props }) {
|
|
3602
|
+
const padding = usePopupCollisionPadding(collisionPadding, 5, container);
|
|
3603
|
+
return /* @__PURE__ */ jsx(PreviewCard.Positioner, {
|
|
3604
|
+
collisionPadding: padding,
|
|
3605
|
+
...props
|
|
3606
|
+
});
|
|
3607
|
+
}
|
|
3445
3608
|
function PreviewCardContent({ align = "start", alignOffset = 0, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "bottom", sideOffset = 6, sticky, portalProps, className, ...props }) {
|
|
3446
3609
|
const { positioner, popup } = previewCard();
|
|
3447
3610
|
return /* @__PURE__ */ jsx(PreviewCardPortal, {
|
|
3448
3611
|
...portalProps,
|
|
3449
|
-
children: /* @__PURE__ */ jsx(
|
|
3612
|
+
children: /* @__PURE__ */ jsx(PreviewCardFramePositioner, {
|
|
3450
3613
|
align,
|
|
3451
3614
|
alignOffset,
|
|
3452
3615
|
anchor,
|
|
@@ -3454,6 +3617,7 @@ function PreviewCardContent({ align = "start", alignOffset = 0, anchor, arrowPad
|
|
|
3454
3617
|
collisionAvoidance,
|
|
3455
3618
|
collisionBoundary,
|
|
3456
3619
|
collisionPadding,
|
|
3620
|
+
container: portalProps?.container,
|
|
3457
3621
|
disableAnchorTracking,
|
|
3458
3622
|
positionMethod,
|
|
3459
3623
|
side,
|
|
@@ -7222,4 +7386,4 @@ function InboxItemActions({ className, render, reveal, ...props }) {
|
|
|
7222
7386
|
});
|
|
7223
7387
|
}
|
|
7224
7388
|
//#endregion
|
|
7225
|
-
export { MessageListDateDivider as $,
|
|
7389
|
+
export { MessageListDateDivider as $, Dialog$1 as $i, PreviewCardArrow as $n, DropdownMenuItem as $r, MessageReactionTooltipNameText as $t, DRAG_AUTO_SCROLL_ZONE_PX as A, useTheme as Aa, CheckboxIndicator as Ai, MessageItem as An, PopoverDescription as Ar, MessageMultiSelectToolbarActions as At, useDragSiblingTransition as B, ListRowTitle as Bi, RadioGroupIndicator as Bn, TOUCH_DRAG_DISTANCE_PX as Br, inlineChip as Bt, DropPlaceholder as C, buttonVariants as Ca, ScrollArea$1 as Ci, MessageItemEdited as Cn, Popover$1 as Cr, messageEmbed as Ct, listKeyboardCoordinates as D, useParentOverlayKind as Da, ScrollAreaThumb as Di, MessageItemAvatarSlot as Dn, PopoverBody as Dr, MessageMultiSelect as Dt, MOUSE_DRAG_DISTANCE_PX as E, OverlayLayerProvider as Ea, ScrollAreaScrollbar as Ei, MessageItemSearchMatch as En, PopoverBackdrop as Er, MessageTextSelectionToolbarSeparator as Et, DROP_GLIDE as F, controlIconInset as Fa, ListRowChevron as Fi, AvatarGroup as Fn, PopoverTitle as Fr, MessageReferencePending as Ft, SILENT_DRAG_ANNOUNCEMENTS as G, TooltipPortal as Gi, InputGroupInput as Gn, MobileNavItem as Gr, MessageReactionGlyph as Gt, LIFT_CLASS as H, ListRowValue as Hi, chipRemoveBase as Hn, TOUCH_DRAG_TOLERANCE_PX as Hr, MessageReactionChip as Ht, DragLift as I, headEdgePull as Ia, ListRowDescription as Ii, AvatarGroupButton as In, PopoverTrigger as Ir, MessageReferenceReadMark as It, dragMessages as J, usePopupCollisionPadding as Ji, measureElement as Jn, DropdownMenu as Jr, MessageReactionQuickButton as Jt, createDragAnnouncements as K, TooltipProvider as Ki, useOverflowTitle as Kn, MobileNavLabel as Kr, MessageReactionPickerContent as Kt, ORIGIN_OPACITY as L, headEdges as La, ListRowGroup as Li, AvatarGroupCount as Ln, PopoverViewport as Lr, MessageReferenceSuffix as Lt, DRAG_LIFT_Z_INDEX as M, tv$1 as Ma, ListRow as Mi, Avatar$1 as Mn, PopoverPopup as Mr, MessageReferenceIcon as Mt, DRAG_SETTLE as N, stackedActions as Na, ListRowBody as Ni, AvatarBadge as Nn, PopoverPortal as Nr, MessageReferenceIndicator as Nt, useDragAcrossLists as O, withOverlayLayer as Oa, ScrollAreaViewport as Oi, MessageItemContinuationTime as On, PopoverClose as Or, MessageMultiSelectCheckbox as Ot, DRAG_SIBLING_TRANSITION as P, useStackedActions as Pa, ListRowBottom as Pi, AvatarFallback as Pn, PopoverSeparator as Pr, MessageReferenceLabel as Pt, MessageListJumpPillGroup as Q, useMobileViewport as Qi, PreviewCardActions as Qn, DropdownMenuFooter as Qr, MessageReactionTooltipName as Qt, cancelDrag as R, decisionWidth as Ra, ListRowIcon as Ri, AvatarImage as Rn, HoldThenMoveTouchSensor as Rr, MessageReferenceText as Rt, DragRefusalHint as S, Button$1 as Sa, PanelSection as Si, MessageItemContent as Sn, MobileNavServerPopoverRowLabel as Sr, MessageEmbedHeader as St, DragRemeasure as T, defaultNativeButton as Ta, ScrollAreaCorner as Ti, MessageItemFooter as Tn, PopoverArrow as Tr, MessageTextSelectionToolbarButton as Tt, drag as U, Tooltip$1 as Ui, InputGroup as Un, useHoldThenMoveTouchSensor as Ur, MessageReactionCount as Ut, useLiftContainer as V, ListRowTop as Vi, RadioGroupItem as Vn, TOUCH_DRAG_HOLD_MS as Vr, MessageReactionAddButton as Vt, DEFAULT_DRAG_MESSAGES as W, TooltipContent as Wi, InputGroupAddon as Wn, useMouseOnlyPointerSensor as Wr, MessageReactionErrorIndicator as Wt, MessageListJumpPill as X, DialogCommit as Xi, readNow as Xn, DropdownMenuCheckboxItemIndicator as Xr, MessageReactionTooltipContent as Xt, MessageListJumpControls as Y, Badge as Yi, observeTruncation as Yn, DropdownMenuCheckboxItem as Yr, MessageReactionQuickRow as Yt, MessageListJumpPillDismiss as Z, DialogSheetContent as Zi, PreviewCard$1 as Zn, DropdownMenuContent as Zr, MessageReactionTooltipMeta as Zt, InboxItemTrailing as _, useTapActivation as _a, PanelBody as _i, MessageItemSenderButton as _n, MobileNavServerPopoverGroup as _r, MessageQuotedPreviewTimestamp as _t, InboxItemContext as a, DialogFooterNote as aa, DropdownMenuPortal as ai, MessageItemSavedIndicator as an, PreviewCardHeader as ar, MessageQuotedPreviewAttachment as at, useLatestRef as b, textLinkVariants as ba, PanelScrollContent as bi, MessageItemAttachments as bn, MobileNavServerPopoverRowBody as br, MessageEmbedContent as bt, InboxItemLeading as c, DialogOverlay as ca, DropdownMenuRadioItemIndicator as ci, MessageItemDelegatedAvatar as cn, PreviewCardPortal as cr, MessageQuotedPreviewAuthorDelegatedBy as ct, InboxItemMetadata as d, DialogSurface as da, DropdownMenuSubmenu as di, MessageItemDelegatedByName as dn, PreviewCardTrigger as dr, MessageQuotedPreviewChannel as dt, DialogBody as ea, DropdownMenuItemCount as ei, MessageReactionTooltipNames as en, PreviewCardBody as er, MessageListEndFade as et, InboxItemSelection as f, DialogTitle as fa, DropdownMenuSubmenuTrigger as fi, MessageItemHeader as fn, MobileNavServerItem as fr, MessageQuotedPreviewContent as ft, InboxItemTitle as g, useMergedRef as ga, Panel as gi, MessageItemSenderBadges as gn, MobileNavServerPopoverDestinations as gr, MessageQuotedPreviewThread as gt, InboxItemTimestamp as h, panelToggleAction as ha, KbdGroup as hi, MessageItemSender as hn, MobileNavServerPopoverDestination as hr, MessageQuotedPreviewText as ht, InboxItemContent as i, DialogFooter as ia, DropdownMenuPopup as ii, MessageItemReadReceipt as in, PreviewCardFooter as ir, MessageQuotedPreview as it, DRAG_KEYBOARD_OFFSET_PX as j, ThemeStateContext as ja, PRESENCE_COLOR as ji, searchHit as jn, PopoverHeader as jr, MessageReferenceChip as jt, useDragSensors as k, useThemeScopeProps as ka, Checkbox$1 as ki, MessageItemGutter as kn, PopoverContent as kr, MessageMultiSelectToolbar as kt, InboxItemMarks as l, DialogPortal as la, DropdownMenuSeparator as li, MessageItemDelegatedBy as ln, PreviewCardSeparator as lr, MessageQuotedPreviewAuthorMeta as lt, InboxItemSubtitle as m, PanelAction as ma, Kbd as mi, MessageItemMeta as mn, MobileNavServerPopoverContent as mr, MessageQuotedPreviewLoading as mt, InboxItemActions as n, DialogContent as na, DropdownMenuLabel as ni, MessageItemBadge as nn, PreviewCardDescription as nr, MessageListNotice as nt, InboxItemHeading as o, DialogHeader as oa, DropdownMenuRadioGroup as oi, MessageItemToolbar as on, PreviewCardMeta as or, MessageQuotedPreviewAttachments as ot, InboxItemSender as p, DialogTrigger as pa, DropdownMenuTrigger as pi, MessageItemInlineStatus as pn, MobileNavServerPopover as pr, MessageQuotedPreviewHeader as pt, dragInstructions as q, TooltipTrigger as qi, measureContent as qn, MobileNavRoot as qr, MessageReactionPickerStatic as qt, InboxItemBody as r, DialogDescription as ra, DropdownMenuLinkItem as ri, MessageItemBadgeSeparator as rn, PreviewCardEyebrow as rr, MessageList as rt, InboxItemHoverTarget as s, DialogNav as sa, DropdownMenuRadioItem as si, MessageItemToolbarButton as sn, PreviewCardPopup as sr, MessageQuotedPreviewAuthor as st, InboxItem as t, DialogClose as ta, DropdownMenuItemLabel as ti, MessageReactionTooltipSeparator as tn, PreviewCardContent as tr, MessageListHistoryLimited as tt, InboxItemMessage as u, DialogSheetBack as ua, DropdownMenuShortcut as ui, MessageItemDelegatedByButton as un, PreviewCardTitle as ur, MessageQuotedPreviewAuthorName as ut, InboxItemTrigger as v, TextLink as va, PanelFooter as vi, MessageItemSenderGroup as vn, MobileNavServerPopoverList as vr, MessageQuotedPreviewUnavailable as vt, DRAG_KEYBOARD_CODES as w, Spinner as wa, ScrollAreaContent as wi, MessageItemEmbedded as wn, PopoverActions as wr, MessageTextSelectionToolbar as wt, Skeleton as x, DialogSheetReset as xa, PanelScrollViewport as xi, MessageItemBody as xn, MobileNavServerPopoverRowDescription as xr, MessageEmbedFooter as xt, inboxItem as y, TextLinkExternalIcon as ya, PanelHeaderRoot as yi, MessageItemTime as yn, MobileNavServerPopoverRow as yr, MessageEmbed as yt, keepGrabInside as z, ListRowMeta as zi, RadioGroup$1 as zn, MouseOnlyPointerSensor as zr, MessageReferenceUnavailable as zt };
|
package/dist/index.d.mts
CHANGED
|
@@ -679,7 +679,14 @@ type ContextMenuTriggerProps = StyledProps<ContextMenu$1.Trigger.Props>;
|
|
|
679
679
|
export declare function ContextMenuTrigger({ className, ...props }: ContextMenuTriggerProps): import("react").JSX.Element;
|
|
680
680
|
type ContextMenuPortalProps = ContextMenu$1.Portal.Props;
|
|
681
681
|
export declare function ContextMenuPortal(props: ContextMenuPortalProps): import("react").JSX.Element;
|
|
682
|
-
type ContextMenuContentProps = StyledProps<ContextMenu$1.Popup.Props> & Partial<Pick<ContextMenu$1.Positioner.Props, "align" | "alignOffset" | "anchor" | "arrowPadding" | "collisionAvoidance" | "collisionBoundary" | "
|
|
682
|
+
type ContextMenuContentProps = StyledProps<ContextMenu$1.Popup.Props> & Partial<Pick<ContextMenu$1.Positioner.Props, "align" | "alignOffset" | "anchor" | "arrowPadding" | "collisionAvoidance" | "collisionBoundary" | "disableAnchorTracking" | "positionMethod" | "side" | "sideOffset" | "sticky">> & {
|
|
683
|
+
/**
|
|
684
|
+
* Additional space to maintain from the edge of the collision boundary: 8px
|
|
685
|
+
* from the window's edge, and 8px from a frame inset where a shell keeps one.
|
|
686
|
+
* A value you pass is kept as it is.
|
|
687
|
+
* @default 8
|
|
688
|
+
*/
|
|
689
|
+
collisionPadding?: ContextMenu$1.Positioner.Props["collisionPadding"];
|
|
683
690
|
portalProps?: ContextMenuPortalProps;
|
|
684
691
|
};
|
|
685
692
|
export declare function ContextMenuContent({ align, alignOffset, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod, side, sideOffset, sticky, portalProps, className, ...props }: ContextMenuContentProps): import("react").JSX.Element;
|
|
@@ -1040,7 +1047,14 @@ type ComboboxHeaderProps = ComponentPropsWithRef<"div">;
|
|
|
1040
1047
|
export declare function ComboboxHeader({ className, ...props }: ComboboxHeaderProps): import("react").JSX.Element;
|
|
1041
1048
|
type ComboboxSeparatorProps = StyledProps<ComponentPropsWithRef<"div">>;
|
|
1042
1049
|
export declare function ComboboxSeparator({ className, ...props }: ComboboxSeparatorProps): import("react").JSX.Element;
|
|
1043
|
-
type ComboboxContentProps = StyledProps<Combobox$1.Popup.Props> & Pick<Combobox$1.Positioner.Props, "align" | "alignOffset" | "anchor" | "arrowPadding" | "collisionAvoidance" | "collisionBoundary" | "
|
|
1050
|
+
type ComboboxContentProps = StyledProps<Combobox$1.Popup.Props> & Pick<Combobox$1.Positioner.Props, "align" | "alignOffset" | "anchor" | "arrowPadding" | "collisionAvoidance" | "collisionBoundary" | "disableAnchorTracking" | "positionMethod" | "side" | "sideOffset" | "sticky"> & {
|
|
1051
|
+
/**
|
|
1052
|
+
* Additional space to maintain from the edge of the collision boundary: 8px
|
|
1053
|
+
* from the window's edge, and 8px from a frame inset where a shell keeps one.
|
|
1054
|
+
* A value you pass is kept as it is.
|
|
1055
|
+
* @default 8
|
|
1056
|
+
*/
|
|
1057
|
+
collisionPadding?: Combobox$1.Positioner.Props["collisionPadding"];
|
|
1044
1058
|
portalProps?: ComboboxPortalProps;
|
|
1045
1059
|
};
|
|
1046
1060
|
export declare function ComboboxContent({ align, alignOffset, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod, side, sideOffset, sticky, portalProps, className, initialFocus, finalFocus, ...props }: ComboboxContentProps): import("react").JSX.Element;
|
|
@@ -1094,7 +1108,14 @@ type SelectPortalProps = Select$1.Portal.Props;
|
|
|
1094
1108
|
export declare function SelectPortal(props: SelectPortalProps): import("react").JSX.Element;
|
|
1095
1109
|
type SelectPopupProps = ComponentPropsWithRef<"div">;
|
|
1096
1110
|
export declare function SelectPopup({ className, ...props }: SelectPopupProps): import("react").JSX.Element;
|
|
1097
|
-
type SelectContentProps = StyledProps<Select$1.Popup.Props> & Pick<Select$1.Positioner.Props, "align" | "alignItemWithTrigger" | "alignOffset" | "anchor" | "arrowPadding" | "collisionAvoidance" | "collisionBoundary" | "
|
|
1111
|
+
type SelectContentProps = StyledProps<Select$1.Popup.Props> & Pick<Select$1.Positioner.Props, "align" | "alignItemWithTrigger" | "alignOffset" | "anchor" | "arrowPadding" | "collisionAvoidance" | "collisionBoundary" | "disableAnchorTracking" | "positionMethod" | "side" | "sideOffset" | "sticky"> & {
|
|
1112
|
+
/**
|
|
1113
|
+
* Additional space to maintain from the edge of the collision boundary: 8px
|
|
1114
|
+
* from the window's edge, and 8px from a frame inset where a shell keeps one.
|
|
1115
|
+
* A value you pass is kept as it is.
|
|
1116
|
+
* @default 8
|
|
1117
|
+
*/
|
|
1118
|
+
collisionPadding?: Select$1.Positioner.Props["collisionPadding"];
|
|
1098
1119
|
portalProps?: SelectPortalProps;
|
|
1099
1120
|
};
|
|
1100
1121
|
export declare function SelectContent({ align, alignItemWithTrigger, alignOffset, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod, side, sideOffset, sticky, portalProps, className, ...props }: SelectContentProps): import("react").JSX.Element;
|
package/dist/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { cn } from "./cn.mjs";
|
|
2
|
-
import { $ as MessageListDateDivider, $i as
|
|
2
|
+
import { $ as MessageListDateDivider, $i as Dialog, $n as PreviewCardArrow, $r as DropdownMenuItem, $t as MessageReactionTooltipNameText, Aa as useTheme, Ai as CheckboxIndicator, An as MessageItem, Ar as PopoverDescription, At as MessageMultiSelectToolbarActions, B as useDragSiblingTransition, Bi as ListRowTitle, Bn as RadioGroupIndicator, Bt as inlineChip, C as DropPlaceholder, Ca as buttonVariants, Ci as ScrollArea, Cn as MessageItemEdited, Cr as Popover, Ct as messageEmbed, Da as useParentOverlayKind, Di as ScrollAreaThumb, Dn as MessageItemAvatarSlot, Dt as MessageMultiSelect, Ei as ScrollAreaScrollbar, En as MessageItemSearchMatch, Er as PopoverBackdrop, Et as MessageTextSelectionToolbarSeparator, Fa as controlIconInset, Fi as ListRowChevron, Fn as AvatarGroup, Fr as PopoverTitle, Ft as MessageReferencePending, G as SILENT_DRAG_ANNOUNCEMENTS, Gi as TooltipPortal, Gn as InputGroupInput, Gr as MobileNavItem, Gt as MessageReactionGlyph, Hi as ListRowValue, Hn as chipRemoveBase, Ht as MessageReactionChip, I as DragLift, Ia as headEdgePull, Ii as ListRowDescription, Ir as PopoverTrigger, It as MessageReferenceReadMark, Ji as usePopupCollisionPadding, Jr as DropdownMenu, Jt as MessageReactionQuickButton, K as createDragAnnouncements, Ki as TooltipProvider, Kn as useOverflowTitle, Kr as MobileNavLabel, Kt as MessageReactionPickerContent, La as headEdges, Li as ListRowGroup, Ln as AvatarGroupCount, Lr as PopoverViewport, Lt as MessageReferenceSuffix, Ma as tv, Mi as ListRow, Mn as Avatar, Mr as PopoverPopup, Na as stackedActions, Ni as ListRowBody, Nn as AvatarBadge, Nr as PopoverPortal, Nt as MessageReferenceIndicator, Oa as withOverlayLayer, Oi as ScrollAreaViewport, On as MessageItemContinuationTime, Or as PopoverClose, Ot as MessageMultiSelectCheckbox, Pa as useStackedActions, Pi as ListRowBottom, Pn as AvatarFallback, Pr as PopoverSeparator, Pt as MessageReferenceLabel, Qi as useMobileViewport, Qr as DropdownMenuFooter, Qt as MessageReactionTooltipName, Ra as decisionWidth, Ri as ListRowIcon, Rn as AvatarImage, Rt as MessageReferenceText, Sa as Button, Si as PanelSection, Sn as MessageItemContent, St as MessageEmbedHeader, Ta as defaultNativeButton, Ti as ScrollAreaCorner, Tn as MessageItemFooter, Tr as PopoverArrow, Tt as MessageTextSelectionToolbarButton, U as drag, Ui as Tooltip, Un as InputGroup, Ut as MessageReactionCount, V as useLiftContainer, Vi as ListRowTop, Vn as RadioGroupItem, Vt as MessageReactionAddButton, Wi as TooltipContent, Wn as InputGroupAddon, Wt as MessageReactionErrorIndicator, Xr as DropdownMenuCheckboxItemIndicator, Xt as MessageReactionTooltipContent, Yi as Badge, Yr as DropdownMenuCheckboxItem, Yt as MessageReactionQuickRow, Zn as PreviewCard, Zr as DropdownMenuContent, Zt as MessageReactionTooltipMeta, _ as InboxItemTrailing, _a as useTapActivation, _i as PanelBody, _n as MessageItemSenderButton, _t as MessageQuotedPreviewTimestamp, a as InboxItemContext, ai as DropdownMenuPortal, an as MessageItemSavedIndicator, ar as PreviewCardHeader, at as MessageQuotedPreviewAttachment, b as useLatestRef, ba as textLinkVariants, bi as PanelScrollContent, bn as MessageItemAttachments, bt as MessageEmbedContent, c as InboxItemLeading, ca as DialogOverlay, ci as DropdownMenuRadioItemIndicator, cr as PreviewCardPortal, d as InboxItemMetadata, da as DialogSurface, di as DropdownMenuSubmenu, dr as PreviewCardTrigger, dt as MessageQuotedPreviewChannel, ea as DialogBody, ei as DropdownMenuItemCount, en as MessageReactionTooltipNames, et as MessageListEndFade, f as InboxItemSelection, fa as DialogTitle, fi as DropdownMenuSubmenuTrigger, fn as MessageItemHeader, ft as MessageQuotedPreviewContent, g as InboxItemTitle, ga as useMergedRef, gi as Panel, gn as MessageItemSenderBadges, gt as MessageQuotedPreviewThread, h as InboxItemTimestamp, ha as panelToggleAction, hi as KbdGroup, hn as MessageItemSender, ht as MessageQuotedPreviewText, i as InboxItemContent, ia as DialogFooter, ii as DropdownMenuPopup, in as MessageItemReadReceipt, it as MessageQuotedPreview, ja as ThemeStateContext, ji as PRESENCE_COLOR, jn as searchHit, jr as PopoverHeader, jt as MessageReferenceChip, k as useDragSensors, ka as useThemeScopeProps, ki as Checkbox, kn as MessageItemGutter, kr as PopoverContent, kt as MessageMultiSelectToolbar, l as InboxItemMarks, la as DialogPortal, li as DropdownMenuSeparator, lr as PreviewCardSeparator, lt as MessageQuotedPreviewAuthorMeta, m as InboxItemSubtitle, ma as PanelAction, mi as Kbd, mn as MessageItemMeta, mt as MessageQuotedPreviewLoading, n as InboxItemActions, na as DialogContent, ni as DropdownMenuLabel, nn as MessageItemBadge, nr as PreviewCardDescription, nt as MessageListNotice, o as InboxItemHeading, oa as DialogHeader, oi as DropdownMenuRadioGroup, on as MessageItemToolbar, ot as MessageQuotedPreviewAttachments, p as InboxItemSender, pa as DialogTrigger, pi as DropdownMenuTrigger, pn as MessageItemInlineStatus, pt as MessageQuotedPreviewHeader, q as dragInstructions, qi as TooltipTrigger, qr as MobileNavRoot, qt as MessageReactionPickerStatic, r as InboxItemBody, ra as DialogDescription, rn as MessageItemBadgeSeparator, rt as MessageList, s as InboxItemHoverTarget, sa as DialogNav, si as DropdownMenuRadioItem, sn as MessageItemToolbarButton, sr as PreviewCardPopup, st as MessageQuotedPreviewAuthor, t as InboxItem, ta as DialogClose, ti as DropdownMenuItemLabel, tn as MessageReactionTooltipSeparator, tr as PreviewCardContent, tt as MessageListHistoryLimited, u as InboxItemMessage, ui as DropdownMenuShortcut, ur as PreviewCardTitle, ut as MessageQuotedPreviewAuthorName, v as InboxItemTrigger, va as TextLink, vi as PanelFooter, vn as MessageItemSenderGroup, vt as MessageQuotedPreviewUnavailable, wa as Spinner, wi as ScrollAreaContent, wn as MessageItemEmbedded, wt as MessageTextSelectionToolbar, x as Skeleton, xa as DialogSheetReset, xi as PanelScrollViewport, xn as MessageItemBody, xt as MessageEmbedFooter, ya as TextLinkExternalIcon, yi as PanelHeaderRoot, yn as MessageItemTime, yt as MessageEmbed, zi as ListRowMeta, zn as RadioGroup, zt as MessageReferenceUnavailable } from "./inbox-item-BkhqEaUM.mjs";
|
|
3
3
|
import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
|
|
4
4
|
import { AlertTriangle, Bell, Check, CheckCircle2, ChevronDown, ChevronLeft, ChevronRight, CircleCheck, Copy, FileText, Image, Info, TriangleAlert, Upload, X, Zap } from "lucide-react";
|
|
5
5
|
import { Children, cloneElement, createContext, createElement, isValidElement, use, useCallback, useContext, useEffect, useId, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
|
|
@@ -2881,16 +2881,23 @@ function ContextMenuPortal(props) {
|
|
|
2881
2881
|
...useThemeScopeProps(props)
|
|
2882
2882
|
});
|
|
2883
2883
|
}
|
|
2884
|
+
function ContextMenuFramePositioner({ collisionPadding, container, ...props }) {
|
|
2885
|
+
const padding = usePopupCollisionPadding(collisionPadding, 8, container);
|
|
2886
|
+
return /* @__PURE__ */ jsx(ContextMenu$1.Positioner, {
|
|
2887
|
+
collisionPadding: padding,
|
|
2888
|
+
...props
|
|
2889
|
+
});
|
|
2890
|
+
}
|
|
2884
2891
|
const CONTENT_COLLISION_AVOIDANCE = {
|
|
2885
2892
|
side: "shift",
|
|
2886
2893
|
align: "shift",
|
|
2887
2894
|
fallbackAxisSide: "none"
|
|
2888
2895
|
};
|
|
2889
|
-
function ContextMenuContent({ align = "start", alignOffset = 0, anchor, arrowPadding, collisionAvoidance = CONTENT_COLLISION_AVOIDANCE, collisionBoundary, collisionPadding
|
|
2896
|
+
function ContextMenuContent({ align = "start", alignOffset = 0, anchor, arrowPadding, collisionAvoidance = CONTENT_COLLISION_AVOIDANCE, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "right", sideOffset = 0, sticky, portalProps, className, ...props }) {
|
|
2890
2897
|
const { positioner, content } = contextMenu();
|
|
2891
2898
|
return /* @__PURE__ */ jsx(ContextMenuPortal, {
|
|
2892
2899
|
...portalProps,
|
|
2893
|
-
children: /* @__PURE__ */ jsx(
|
|
2900
|
+
children: /* @__PURE__ */ jsx(ContextMenuFramePositioner, {
|
|
2894
2901
|
align,
|
|
2895
2902
|
alignOffset,
|
|
2896
2903
|
anchor,
|
|
@@ -2898,6 +2905,7 @@ function ContextMenuContent({ align = "start", alignOffset = 0, anchor, arrowPad
|
|
|
2898
2905
|
collisionAvoidance,
|
|
2899
2906
|
collisionBoundary,
|
|
2900
2907
|
collisionPadding,
|
|
2908
|
+
container: portalProps?.container,
|
|
2901
2909
|
disableAnchorTracking,
|
|
2902
2910
|
positionMethod,
|
|
2903
2911
|
side,
|
|
@@ -3935,11 +3943,18 @@ function ComboboxSeparator({ className, ...props }) {
|
|
|
3935
3943
|
...props
|
|
3936
3944
|
});
|
|
3937
3945
|
}
|
|
3938
|
-
function
|
|
3946
|
+
function ComboboxFramePositioner({ collisionPadding, container, ...props }) {
|
|
3947
|
+
const padding = usePopupCollisionPadding(collisionPadding, 8, container);
|
|
3948
|
+
return /* @__PURE__ */ jsx(Combobox$1.Positioner, {
|
|
3949
|
+
collisionPadding: padding,
|
|
3950
|
+
...props
|
|
3951
|
+
});
|
|
3952
|
+
}
|
|
3953
|
+
function ComboboxContent({ align = "start", alignOffset = 0, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "bottom", sideOffset, sticky, portalProps, className, initialFocus = false, finalFocus = false, ...props }) {
|
|
3939
3954
|
const { positioner, content } = combobox();
|
|
3940
3955
|
return /* @__PURE__ */ jsx(ComboboxPortal, {
|
|
3941
3956
|
...portalProps,
|
|
3942
|
-
children: /* @__PURE__ */ jsx(
|
|
3957
|
+
children: /* @__PURE__ */ jsx(ComboboxFramePositioner, {
|
|
3943
3958
|
align,
|
|
3944
3959
|
alignOffset,
|
|
3945
3960
|
anchor,
|
|
@@ -3947,6 +3962,7 @@ function ComboboxContent({ align = "start", alignOffset = 0, anchor, arrowPaddin
|
|
|
3947
3962
|
collisionAvoidance,
|
|
3948
3963
|
collisionBoundary,
|
|
3949
3964
|
collisionPadding,
|
|
3965
|
+
container: portalProps?.container,
|
|
3950
3966
|
disableAnchorTracking,
|
|
3951
3967
|
positionMethod,
|
|
3952
3968
|
side,
|
|
@@ -4286,9 +4302,16 @@ function SelectPopup({ className, ...props }) {
|
|
|
4286
4302
|
...props
|
|
4287
4303
|
});
|
|
4288
4304
|
}
|
|
4289
|
-
function
|
|
4305
|
+
function SelectFramePositioner({ collisionPadding, container, ...props }) {
|
|
4306
|
+
const padding = usePopupCollisionPadding(collisionPadding, 8, container);
|
|
4307
|
+
return /* @__PURE__ */ jsx(Select$1.Positioner, {
|
|
4308
|
+
collisionPadding: padding,
|
|
4309
|
+
...props
|
|
4310
|
+
});
|
|
4311
|
+
}
|
|
4312
|
+
function SelectContent({ align = "start", alignItemWithTrigger = false, alignOffset = 0, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "bottom", sideOffset, sticky, portalProps, className, ...props }) {
|
|
4290
4313
|
const { positioner, content } = select();
|
|
4291
|
-
const positionerNode = /* @__PURE__ */ jsx(
|
|
4314
|
+
const positionerNode = /* @__PURE__ */ jsx(SelectFramePositioner, {
|
|
4292
4315
|
align,
|
|
4293
4316
|
alignItemWithTrigger,
|
|
4294
4317
|
alignOffset,
|
|
@@ -4297,6 +4320,7 @@ function SelectContent({ align = "start", alignItemWithTrigger = false, alignOff
|
|
|
4297
4320
|
collisionAvoidance,
|
|
4298
4321
|
collisionBoundary,
|
|
4299
4322
|
collisionPadding,
|
|
4323
|
+
container: portalProps?.container,
|
|
4300
4324
|
disableAnchorTracking,
|
|
4301
4325
|
positionMethod,
|
|
4302
4326
|
side,
|
|
@@ -10051,6 +10075,13 @@ function NotificationCenterTrigger({ className, children, ...props }) {
|
|
|
10051
10075
|
function NotificationCenterPortal(props) {
|
|
10052
10076
|
return /* @__PURE__ */ jsx(Popover$1.Portal, { ...useThemeScopeProps(props) });
|
|
10053
10077
|
}
|
|
10078
|
+
function NotificationCenterFramePositioner({ collisionPadding, container, defaultCollisionPadding, ...props }) {
|
|
10079
|
+
const padding = usePopupCollisionPadding(collisionPadding, defaultCollisionPadding, container);
|
|
10080
|
+
return /* @__PURE__ */ jsx(Popover$1.Positioner, {
|
|
10081
|
+
collisionPadding: padding,
|
|
10082
|
+
...props
|
|
10083
|
+
});
|
|
10084
|
+
}
|
|
10054
10085
|
function NotificationCenterPopup({ viewport = "desktop", size = "md", className, initialFocus = false, align = "center", alignOffset = 0, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "bottom", sideOffset = 4, sticky, portalProps, ...props }) {
|
|
10055
10086
|
const { popup } = notificationCenter({
|
|
10056
10087
|
viewport,
|
|
@@ -10058,14 +10089,16 @@ function NotificationCenterPopup({ viewport = "desktop", size = "md", className,
|
|
|
10058
10089
|
});
|
|
10059
10090
|
return /* @__PURE__ */ jsx(NotificationCenterPortal, {
|
|
10060
10091
|
...portalProps,
|
|
10061
|
-
children: /* @__PURE__ */ jsx(
|
|
10092
|
+
children: /* @__PURE__ */ jsx(NotificationCenterFramePositioner, {
|
|
10062
10093
|
align,
|
|
10063
10094
|
alignOffset,
|
|
10064
10095
|
anchor,
|
|
10065
10096
|
arrowPadding,
|
|
10066
10097
|
collisionAvoidance,
|
|
10067
10098
|
collisionBoundary,
|
|
10068
|
-
collisionPadding
|
|
10099
|
+
collisionPadding,
|
|
10100
|
+
container: portalProps?.container,
|
|
10101
|
+
defaultCollisionPadding: viewport === "mobile" ? PHONE_INSET : 5,
|
|
10069
10102
|
disableAnchorTracking,
|
|
10070
10103
|
positionMethod,
|
|
10071
10104
|
side,
|
package/dist/styles.css
CHANGED
|
@@ -771,12 +771,20 @@ textarea:-webkit-autofill:disabled {
|
|
|
771
771
|
in with transition-colors. */
|
|
772
772
|
/* Theme decorations on the frame (themes.css): the theme's sprites on the top
|
|
773
773
|
bar's right and above the rail's foot; none without a decorated theme. */
|
|
774
|
-
/* The top bar's strip (190px)
|
|
775
|
-
right-hand controls
|
|
776
|
-
(
|
|
774
|
+
/* The top bar's strip (190px) ends --frame-decor-top-end (72px if unset)
|
|
775
|
+
left of the bar's right-hand controls' safe area, --raft-frame-inset-end
|
|
776
|
+
(the window's caption buttons on a desktop shell; 0 on the web). The bar
|
|
777
|
+
must reach the window's right edge: the position counts from its padding
|
|
778
|
+
box, so padding that reserves the same corner is not counted twice. The
|
|
779
|
+
consumer sets --frame-decor-top-end to its trailing actions' width plus
|
|
780
|
+
16px, measured from inside the safe area, and sets --frame-decor-top: none
|
|
781
|
+
on the bar when the room between the search field and those actions can't
|
|
782
|
+
hold the whole strip with 16px on each side; never half a strip. Only from
|
|
783
|
+
1024px, where the centred search field leaves room for it. */
|
|
777
784
|
@utility frame-decor-top {
|
|
778
785
|
background-repeat: no-repeat;
|
|
779
|
-
background-position: right
|
|
786
|
+
background-position: right
|
|
787
|
+
calc(var(--frame-decor-top-end, 72px) + var(--raft-frame-inset-end, 0px)) center;
|
|
780
788
|
@media (width >= 1024px) {
|
|
781
789
|
background-image: var(--frame-decor-top, none);
|
|
782
790
|
}
|
package/dist/wip.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { cn } from "./cn.mjs";
|
|
2
|
-
import { A as DRAG_AUTO_SCROLL_ZONE_PX, B as useDragSiblingTransition, Bi as ListRowTitle, Br as TOUCH_DRAG_DISTANCE_PX, C as DropPlaceholder,
|
|
2
|
+
import { $i as Dialog, A as DRAG_AUTO_SCROLL_ZONE_PX, Aa as useTheme, B as useDragSiblingTransition, Bi as ListRowTitle, Br as TOUCH_DRAG_DISTANCE_PX, C as DropPlaceholder, D as listKeyboardCoordinates, Da as useParentOverlayKind, Dr as PopoverBody, E as MOUSE_DRAG_DISTANCE_PX, Ea as OverlayLayerProvider, F as DROP_GLIDE, G as SILENT_DRAG_ANNOUNCEMENTS, Gn as InputGroupInput, H as LIFT_CLASS, Hn as chipRemoveBase, Hr as TOUCH_DRAG_TOLERANCE_PX, I as DragLift, Ii as ListRowDescription, In as AvatarGroupButton, It as MessageReferenceReadMark, J as dragMessages, Ji as usePopupCollisionPadding, Jn as measureElement, K as createDragAnnouncements, Kn as useOverflowTitle, L as ORIGIN_OPACITY, M as DRAG_LIFT_Z_INDEX, Ma as tv, Mi as ListRow, Mt as MessageReferenceIcon, N as DRAG_SETTLE, Ni as ListRowBody, O as useDragAcrossLists, P as DRAG_SIBLING_TRANSITION, Pi as ListRowBottom, Q as MessageListJumpPillGroup, Qn as PreviewCardActions, R as cancelDrag, Rr as HoldThenMoveTouchSensor, S as DragRefusalHint, Sa as Button$1, Sr as MobileNavServerPopoverRowLabel, T as DragRemeasure, Ta as defaultNativeButton, Ui as Tooltip, Un as InputGroup, Ur as useHoldThenMoveTouchSensor, Vi as ListRowTop, Vn as RadioGroupItem, Vr as TOUCH_DRAG_HOLD_MS, W as DEFAULT_DRAG_MESSAGES, Wi as TooltipContent, Wn as InputGroupAddon, Wr as useMouseOnlyPointerSensor, X as MessageListJumpPill, Xi as DialogCommit, Xn as readNow, Y as MessageListJumpControls, Yn as observeTruncation, Z as MessageListJumpPillDismiss, Zi as DialogSheetContent, _ as InboxItemTrailing, _r as MobileNavServerPopoverGroup, a as InboxItemContext, aa as DialogFooterNote, b as useLatestRef, br as MobileNavServerPopoverRowBody, c as InboxItemLeading, cn as MessageItemDelegatedAvatar, ct as MessageQuotedPreviewAuthorDelegatedBy, dn as MessageItemDelegatedByName, er as PreviewCardBody, fa as DialogTitle, fr as MobileNavServerItem, g as InboxItemTitle, gr as MobileNavServerPopoverDestinations, h as InboxItemTimestamp, hr as MobileNavServerPopoverDestination, i as InboxItemContent, ir as PreviewCardFooter, j as DRAG_KEYBOARD_OFFSET_PX, k as useDragSensors, ka as useThemeScopeProps, ki as Checkbox, ln as MessageItemDelegatedBy, mr as MobileNavServerPopoverContent, na as DialogContent, o as InboxItemHeading, or as PreviewCardMeta, pa as DialogTrigger, pr as MobileNavServerPopover, q as dragInstructions, qi as TooltipTrigger, qn as measureContent, r as InboxItemBody, ri as DropdownMenuLinkItem, rr as PreviewCardEyebrow, t as InboxItem, ta as DialogClose, ua as DialogSheetBack, un as MessageItemDelegatedByButton, va as TextLink, vr as MobileNavServerPopoverList, w as DRAG_KEYBOARD_CODES, wa as Spinner, wr as PopoverActions, x as Skeleton, xr as MobileNavServerPopoverRowDescription, y as inboxItem, yr as MobileNavServerPopoverRow, z as keepGrabInside, zi as ListRowMeta, zn as RadioGroup, zr as MouseOnlyPointerSensor } from "./inbox-item-BkhqEaUM.mjs";
|
|
3
3
|
import { Check, ChevronDown, LoaderCircle, Plus, Search, X } from "lucide-react";
|
|
4
4
|
import { createContext, use, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
|
|
5
5
|
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -123,6 +123,13 @@ const PHONE_LIST_COLLISION = {
|
|
|
123
123
|
align: "shift",
|
|
124
124
|
fallbackAxisSide: "none"
|
|
125
125
|
};
|
|
126
|
+
function ComboboxSelectFramePositioner({ collisionPadding, container, ...props }) {
|
|
127
|
+
const padding = usePopupCollisionPadding(collisionPadding, 8, container);
|
|
128
|
+
return /* @__PURE__ */ jsx(Combobox.Positioner, {
|
|
129
|
+
collisionPadding: padding,
|
|
130
|
+
...props
|
|
131
|
+
});
|
|
132
|
+
}
|
|
126
133
|
/**
|
|
127
134
|
* Keeps room for the list below the field on a phone: when fewer than three
|
|
128
135
|
* rows fit between the field and the bottom of the visual viewport (the
|
|
@@ -489,15 +496,15 @@ function ComboboxSelect({ options, multiple, value, defaultValue, onValueChange,
|
|
|
489
496
|
children: [controlContent, actions]
|
|
490
497
|
}), /* @__PURE__ */ jsx(Combobox.Portal, {
|
|
491
498
|
...scopedPortalProps,
|
|
492
|
-
children: /* @__PURE__ */ jsx(
|
|
499
|
+
children: /* @__PURE__ */ jsx(ComboboxSelectFramePositioner, {
|
|
493
500
|
sideOffset: 4,
|
|
494
501
|
align: "start",
|
|
495
|
-
collisionPadding: 8,
|
|
496
502
|
...phone ? {
|
|
497
503
|
side: "bottom",
|
|
498
504
|
collisionAvoidance: PHONE_LIST_COLLISION
|
|
499
505
|
} : null,
|
|
500
506
|
...positionerProps,
|
|
507
|
+
container: portalProps?.container,
|
|
501
508
|
className: positionerClassName,
|
|
502
509
|
children: /* @__PURE__ */ jsxs(Combobox.Popup, {
|
|
503
510
|
initialFocus: false,
|