@botiverse/raft-ui 0.21.2 → 0.22.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 +51 -0
- package/dist/{inbox-item.recipe-CuJPcy-3.mjs → inbox-item.recipe-3j4DHKZ2.mjs} +1586 -288
- package/dist/{index-C1FHbVfH.d.mts → index-DT1Hg5N-.d.mts} +235 -9
- package/dist/index.d.mts +6 -77
- package/dist/index.mjs +47 -449
- package/dist/styles.css +7 -6
- package/dist/wip.d.mts +44 -3
- package/dist/wip.mjs +2 -2
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
import { cn } from "./cn.mjs";
|
|
2
|
-
import { $ as MessageReactionPickerStatic, $n as
|
|
2
|
+
import { $ as MessageReactionPickerStatic, $n as DropdownMenuRadioGroup, $r as DialogSheetReset, $t as PreviewCardContent, A as messageEmbed, An as PopoverPopup, Ar as Badge, At as MessageItemEmbedded, B as MessageReferenceIndicator, Bn as MobileNavRoot, Bt as AvatarFallback, C as MessageQuotedPreviewThread, Cn as PopoverArrow, Cr as CheckboxIndicator, Ct as MessageItemSenderButton, D as MessageEmbedContent, Dn as PopoverContent, Dr as TooltipPortal, Dt as MessageItemBody, E as MessageEmbed, En as PopoverClose, Er as TooltipContent, Et as MessageItemAttachments, F as MessageMultiSelectCheckbox, Fn as PopoverViewport, Fr as DialogBody, Ft as MessageItemGutter, G as MessageReferenceUnavailable, Gn as DropdownMenuFooter, H as MessageReferencePending, Hn as DropdownMenuCheckboxItem, Hr as DialogNav, Ht as AvatarGroupCount, I as MessageMultiSelectToolbar, In as useHoldThenMoveTouchSensor, Ir as DialogClose, It as MessageItem, J as MessageReactionChip, Jn as DropdownMenuItemLabel, Jr as DialogTrigger, K as inlineChip, Kn as DropdownMenuItem, Kr as DialogSurface, L as MessageMultiSelectToolbarActions, Ln as useMouseOnlyPointerSensor, Lr as DialogContent, Lt as searchHit, M as MessageTextSelectionToolbarButton, Mn as PopoverSeparator, Mt as MessageItemSearchMatch, N as MessageTextSelectionToolbarSeparator, Nn as PopoverTitle, Nr as useMobileViewport, Nt as MessageItemAvatarSlot, O as MessageEmbedFooter, On as PopoverDescription, Or as TooltipProvider, Ot as MessageItemContent, P as MessageMultiSelect, Pn as PopoverTrigger, Pr as Dialog, Pt as MessageItemContinuationTime, Q as MessageReactionPickerContent, Qn as DropdownMenuPortal, Qr as textLinkVariants, R as MessageReferenceChip, Rn as MobileNavItem, Rr as DialogDescription, Rt as Avatar, S as MessageQuotedPreviewText, Sr as Checkbox, St as MessageItemSenderBadges, T as MessageQuotedPreviewUnavailable, Tr as Tooltip, Tt as MessageItemTime, U as MessageReferenceSuffix, Un as DropdownMenuCheckboxItemIndicator, Ur as DialogOverlay, Ut as AvatarImage, V as MessageReferenceLabel, Vn as DropdownMenu, Vr as DialogHeader, Vt as AvatarGroup, W as MessageReferenceText, Wn as DropdownMenuContent, Wr as DialogPortal, Wt as useOverflowTitle, X as MessageReactionErrorIndicator, Xr as panelToggleAction, Y as MessageReactionCount, Yn as DropdownMenuLabel, Yr as PanelAction, Yt as PreviewCard, Z as MessageReactionGlyph, Zn as DropdownMenuPopup, Zr as TextLink, Zt as PreviewCardArrow, _ as MessageQuotedPreviewAuthorName, _r as ScrollAreaContent, ai as useParentOverlayKind, an as PreviewCardPopup, ar as DropdownMenuSubmenuTrigger, at as MessageReactionTooltipNameText, b as MessageQuotedPreviewHeader, br as ScrollAreaThumb, bt as MessageItemMeta, c as MessageListHistoryLimited, ci as useTheme, cn as PreviewCardTitle, cr as KbdGroup, ct as MessageItemBadge, d as MessageQuotedPreview, di as stackedActions, dr as PanelFooter, dt as MessageItemSavedIndicator, ei as Button, en as PreviewCardDescription, er as DropdownMenuRadioItem, et as MessageReactionQuickButton, f as MessageQuotedPreviewAttachment, fi as useStackedActions, fr as PanelHeaderRoot, ft as MessageItemToolbar, g as MessageQuotedPreviewAuthorMeta, gi as decisionWidth, gr as ScrollArea, hi as headEdges, hr as PanelSection, ir as DropdownMenuSubmenu, it as MessageReactionTooltipName, j as MessageTextSelectionToolbar, jn as PopoverPortal, jt as MessageItemFooter, k as MessageEmbedHeader, kn as PopoverHeader, kr as TooltipTrigger, kt as MessageItemEdited, l as MessageListNotice, li as ThemeStateContext, ln as PreviewCardTrigger, lr as Panel, lt as MessageItemBadgeSeparator, m as MessageQuotedPreviewAuthor, mi as headEdgePull, mr as PanelScrollViewport, ni as Spinner, nr as DropdownMenuSeparator, nt as MessageReactionTooltipContent, o as MessageListDateDivider, oi as withOverlayLayer, on as PreviewCardPortal, or as DropdownMenuTrigger, ot as MessageReactionTooltipNames, p as MessageQuotedPreviewAttachments, pi as controlIconInset, pr as PanelScrollContent, pt as MessageItemToolbarButton, q as MessageReactionAddButton, qn as DropdownMenuItemCount, qr as DialogTitle, ri as defaultNativeButton, rn as PreviewCardHeader, rr as DropdownMenuShortcut, rt as MessageReactionTooltipMeta, s as MessageListEndFade, si as useThemeScopeProps, sn as PreviewCardSeparator, sr as Kbd, st as MessageReactionTooltipSeparator, t as inboxItem, ti as buttonVariants, tr as DropdownMenuRadioItemIndicator, tt as MessageReactionQuickRow, u as MessageList, ui as tv, ur as PanelBody, ut as MessageItemReadReceipt, v as MessageQuotedPreviewChannel, vr as ScrollAreaCorner, vt as MessageItemHeader, w as MessageQuotedPreviewTimestamp, wn as PopoverBackdrop, wr as PRESENCE_COLOR, wt as MessageItemSenderGroup, x as MessageQuotedPreviewLoading, xn as Popover, xr as ScrollAreaViewport, xt as MessageItemSender, y as MessageQuotedPreviewContent, yr as ScrollAreaScrollbar, yt as MessageItemInlineStatus, zn as MobileNavLabel, zr as DialogFooter, zt as AvatarBadge } from "./inbox-item.recipe-3j4DHKZ2.mjs";
|
|
3
3
|
import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
|
|
4
|
-
import { AlertTriangle, Bell, Check, CheckCircle2, ChevronDown, ChevronLeft, ChevronRight, Copy, FileText, Image, Info, Upload, X, Zap } from "lucide-react";
|
|
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";
|
|
6
6
|
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
import { Button as Button$1 } from "@base-ui/react/button";
|
|
8
8
|
import { mergeProps } from "@base-ui/react/merge-props";
|
|
9
9
|
import { useRender } from "@base-ui/react/use-render";
|
|
10
|
+
import { flushSync } from "react-dom";
|
|
10
11
|
import { Drawer as Drawer$1 } from "@base-ui/react/drawer";
|
|
11
12
|
import { Collapsible } from "@base-ui/react/collapsible";
|
|
12
13
|
import { ContextMenu as ContextMenu$1 } from "@base-ui/react";
|
|
13
14
|
import { useHotkey } from "@tanstack/react-hotkeys";
|
|
14
15
|
import { Popover as Popover$1 } from "@base-ui/react/popover";
|
|
15
|
-
import {
|
|
16
|
+
import { DndContext, DragOverlay, KeyboardCode, KeyboardSensor, closestCenter, closestCorners, getFirstCollision, pointerWithin, useDraggable, useDroppable, useSensor, useSensors } from "@dnd-kit/core";
|
|
16
17
|
import { Input as Input$1 } from "@base-ui/react/input";
|
|
17
18
|
import { Field as Field$1 } from "@base-ui/react/field";
|
|
18
|
-
import { flushSync } from "react-dom";
|
|
19
19
|
import { Combobox as Combobox$1 } from "@base-ui/react/combobox";
|
|
20
20
|
import { Select as Select$1 } from "@base-ui/react/select";
|
|
21
21
|
import { Radio } from "@base-ui/react/radio";
|
|
@@ -24,7 +24,6 @@ import { Switch as Switch$1 } from "@base-ui/react/switch";
|
|
|
24
24
|
import { Toggle } from "@base-ui/react/toggle";
|
|
25
25
|
import { ToggleGroup as ToggleGroup$1 } from "@base-ui/react/toggle-group";
|
|
26
26
|
import { Progress as Progress$1 } from "@base-ui/react/progress";
|
|
27
|
-
import { DndContext, DragOverlay, KeyboardCode, KeyboardSensor, closestCenter, closestCorners, getFirstCollision, pointerWithin, useDraggable, useDroppable, useSensor, useSensors } from "@dnd-kit/core";
|
|
28
27
|
import { SortableContext, arrayMove, defaultAnimateLayoutChanges, horizontalListSortingStrategy, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy } from "@dnd-kit/sortable";
|
|
29
28
|
import { CSS } from "@dnd-kit/utilities";
|
|
30
29
|
import { Toast } from "@base-ui/react/toast";
|
|
@@ -51,7 +50,11 @@ const alertDialog = tv({
|
|
|
51
50
|
"px-5 pt-1.5 pb-5 first:pt-5",
|
|
52
51
|
"font-sans text-subhead text-foreground-muted"
|
|
53
52
|
],
|
|
54
|
-
footer: [
|
|
53
|
+
footer: [
|
|
54
|
+
"flex min-w-0 items-center justify-end",
|
|
55
|
+
...stackedActions,
|
|
56
|
+
"gap-2 px-5 pb-5 first:pt-5 [[data-slot=alert-dialog-header]+&]:pt-5"
|
|
57
|
+
],
|
|
55
58
|
title: ["m-0 min-w-0 text-foreground", "font-sans text-headline font-bold"],
|
|
56
59
|
description: ["m-0", "font-sans text-subhead text-foreground-muted"]
|
|
57
60
|
},
|
|
@@ -112,7 +115,7 @@ function AlertDialogContent({ className, children, portalProps, overlay, ...prop
|
|
|
112
115
|
className: content({ className }),
|
|
113
116
|
...props,
|
|
114
117
|
role: "alertdialog",
|
|
115
|
-
children
|
|
118
|
+
children: /* @__PURE__ */ jsx(DialogSheetReset, { children })
|
|
116
119
|
})]
|
|
117
120
|
});
|
|
118
121
|
}
|
|
@@ -132,11 +135,14 @@ function AlertDialogBody({ className, ...props }) {
|
|
|
132
135
|
...props
|
|
133
136
|
});
|
|
134
137
|
}
|
|
135
|
-
function AlertDialogFooter({ className, ...props }) {
|
|
138
|
+
function AlertDialogFooter({ className, ref, ...props }) {
|
|
136
139
|
const { footer } = alertDialog();
|
|
140
|
+
const [stacked, rowRef] = useStackedActions(ref);
|
|
137
141
|
return /* @__PURE__ */ jsx("div", {
|
|
138
142
|
"data-slot": "alert-dialog-footer",
|
|
143
|
+
ref: rowRef,
|
|
139
144
|
className: footer({ className }),
|
|
145
|
+
...stacked ? { "data-stacked": "" } : {},
|
|
140
146
|
...props
|
|
141
147
|
});
|
|
142
148
|
}
|
|
@@ -511,7 +517,7 @@ function DrawerContent({ className, children, portalProps, ...props }) {
|
|
|
511
517
|
children: [hasSnapPoints ? /* @__PURE__ */ jsx(DrawerSwipeHandle, {}) : null, /* @__PURE__ */ jsx(Drawer$1.Content, {
|
|
512
518
|
"data-slot": "drawer-content",
|
|
513
519
|
className: content(),
|
|
514
|
-
children
|
|
520
|
+
children: /* @__PURE__ */ jsx(DialogSheetReset, { children })
|
|
515
521
|
})]
|
|
516
522
|
})
|
|
517
523
|
})]
|
|
@@ -3231,70 +3237,6 @@ function RaftWordmarkArtwork() {
|
|
|
3231
3237
|
] });
|
|
3232
3238
|
}
|
|
3233
3239
|
//#endregion
|
|
3234
|
-
//#region src/components/mobile-nav/mobile-nav.tsx
|
|
3235
|
-
const mobileNav = tv({ slots: {
|
|
3236
|
-
root: [
|
|
3237
|
-
"grid w-full flex-none grid-flow-col auto-cols-fr items-start gap-0",
|
|
3238
|
-
"border-t border-line-seam bg-layer-card px-2 pt-1.5 text-foreground-hint",
|
|
3239
|
-
"pb-[max(8px,min(env(safe-area-inset-bottom,0px),34px))]"
|
|
3240
|
-
],
|
|
3241
|
-
item: [
|
|
3242
|
-
"relative inline-flex shrink-0 items-center outline-none",
|
|
3243
|
-
"disabled:pointer-events-none disabled:opacity-45",
|
|
3244
|
-
"[&_svg]:shrink-0",
|
|
3245
|
-
"isolate min-w-0 flex-col justify-start gap-[7px] border-0 px-0 pt-1 pb-0",
|
|
3246
|
-
"font-sans text-[10px]/3 font-semibold text-foreground-hint",
|
|
3247
|
-
"*:relative *:z-10 [&_svg]:size-[22px] [&_svg]:stroke-2",
|
|
3248
|
-
"before:pointer-events-none before:absolute before:top-0 before:left-1/2 before:z-0 before:-translate-x-1/2",
|
|
3249
|
-
"before:h-[30px] before:w-14 before:rounded-control before:border-[1.5px] before:border-transparent before:content-['']",
|
|
3250
|
-
"active:before:bg-fill-medium",
|
|
3251
|
-
"data-[selected=true]:font-bold data-[selected=true]:text-foreground",
|
|
3252
|
-
"data-[selected=true]:[&_svg]:text-sticker-ink",
|
|
3253
|
-
"data-[selected=true]:before:border-sticker-ink data-[selected=true]:before:bg-brand data-[selected=true]:before:ring-[1.5px] data-[selected=true]:before:ring-sticker-edge",
|
|
3254
|
-
"data-[selected=true]:active:before:overlay-sticker-medium",
|
|
3255
|
-
"rounded-control focus-visible:shadow-focus"
|
|
3256
|
-
],
|
|
3257
|
-
itemLabel: ["min-w-0 truncate", "max-w-full"]
|
|
3258
|
-
} });
|
|
3259
|
-
function MobileNavRoot({ className, render, ...props }) {
|
|
3260
|
-
const { root } = mobileNav();
|
|
3261
|
-
const defaultProps = {
|
|
3262
|
-
"data-slot": "mobile-nav-root",
|
|
3263
|
-
className: root({ className })
|
|
3264
|
-
};
|
|
3265
|
-
return useRender({
|
|
3266
|
-
defaultTagName: "nav",
|
|
3267
|
-
render,
|
|
3268
|
-
props: mergeProps(defaultProps, props)
|
|
3269
|
-
});
|
|
3270
|
-
}
|
|
3271
|
-
function MobileNavItem({ nativeButton = true, selected, className, render, ...props }) {
|
|
3272
|
-
const { item } = mobileNav();
|
|
3273
|
-
const defaultProps = {
|
|
3274
|
-
type: nativeButton ? "button" : void 0,
|
|
3275
|
-
"aria-pressed": nativeButton ? selected : void 0,
|
|
3276
|
-
"data-slot": "mobile-nav-item",
|
|
3277
|
-
"data-selected": selected ? "true" : void 0,
|
|
3278
|
-
className: item({ className })
|
|
3279
|
-
};
|
|
3280
|
-
return useRender({
|
|
3281
|
-
render: render ?? /* @__PURE__ */ jsx(Button$1, {}),
|
|
3282
|
-
props: mergeProps(defaultProps, props)
|
|
3283
|
-
});
|
|
3284
|
-
}
|
|
3285
|
-
function MobileNavLabel({ className, render, ...props }) {
|
|
3286
|
-
const { itemLabel } = mobileNav();
|
|
3287
|
-
const defaultProps = {
|
|
3288
|
-
"data-slot": "mobile-nav-item-label",
|
|
3289
|
-
className: itemLabel({ className })
|
|
3290
|
-
};
|
|
3291
|
-
return useRender({
|
|
3292
|
-
defaultTagName: "span",
|
|
3293
|
-
render,
|
|
3294
|
-
props: mergeProps(defaultProps, props)
|
|
3295
|
-
});
|
|
3296
|
-
}
|
|
3297
|
-
//#endregion
|
|
3298
3240
|
//#region src/components/workspace-button/workspace-button.tsx
|
|
3299
3241
|
function WorkspaceButton({ className, children, ...props }) {
|
|
3300
3242
|
return /* @__PURE__ */ jsxs(Button, {
|
|
@@ -3318,280 +3260,6 @@ function WorkspaceButtonName({ className, ...props }) {
|
|
|
3318
3260
|
});
|
|
3319
3261
|
}
|
|
3320
3262
|
//#endregion
|
|
3321
|
-
//#region src/components/popover/popover.tsx
|
|
3322
|
-
const popover = tv({ slots: {
|
|
3323
|
-
trigger: ["select-none"],
|
|
3324
|
-
positioner: ["isolate z-50 outline-none"],
|
|
3325
|
-
content: [
|
|
3326
|
-
"max-h-(--available-height) min-w-[220px] overflow-hidden",
|
|
3327
|
-
"outline-none",
|
|
3328
|
-
"rounded-container bg-layer-popover text-foreground",
|
|
3329
|
-
"shadow-float ring-1 ring-line-seam"
|
|
3330
|
-
],
|
|
3331
|
-
header: ["flex items-center justify-between px-3", "min-h-11 gap-2 py-1.5 pr-1.5 pl-4"],
|
|
3332
|
-
separator: ["border-t", "border-line-hairline"],
|
|
3333
|
-
title: ["m-0", "font-sans text-headline font-bold text-foreground"],
|
|
3334
|
-
description: ["m-0", "font-sans text-footnote text-foreground-muted"],
|
|
3335
|
-
close: [
|
|
3336
|
-
"inline-flex items-center justify-center",
|
|
3337
|
-
"outline-none transition-colors",
|
|
3338
|
-
"h-8 min-w-8 rounded-chip px-1.5",
|
|
3339
|
-
"font-sans text-footnote font-bold text-foreground",
|
|
3340
|
-
"hover:bg-fill-medium active:bg-fill-medium",
|
|
3341
|
-
"focus-visible:shadow-focus",
|
|
3342
|
-
"[&_svg]:size-4.5"
|
|
3343
|
-
],
|
|
3344
|
-
arrow: ["size-2 rotate-45", "border-l border-t border-line-seam bg-layer-popover"],
|
|
3345
|
-
backdrop: ["fixed inset-0", "bg-transparent"],
|
|
3346
|
-
viewport: ["block"]
|
|
3347
|
-
} });
|
|
3348
|
-
function Popover(props) {
|
|
3349
|
-
return /* @__PURE__ */ jsx(Popover$1.Root, {
|
|
3350
|
-
"data-slot": "popover",
|
|
3351
|
-
...props
|
|
3352
|
-
});
|
|
3353
|
-
}
|
|
3354
|
-
function PopoverTrigger({ className, ...props }) {
|
|
3355
|
-
const { trigger } = popover();
|
|
3356
|
-
return /* @__PURE__ */ jsx(Popover$1.Trigger, {
|
|
3357
|
-
"data-slot": "popover-trigger",
|
|
3358
|
-
className: trigger({ className }),
|
|
3359
|
-
...props
|
|
3360
|
-
});
|
|
3361
|
-
}
|
|
3362
|
-
function PopoverPortal(props) {
|
|
3363
|
-
return /* @__PURE__ */ jsx(Popover$1.Portal, {
|
|
3364
|
-
"data-slot": "popover-portal",
|
|
3365
|
-
...useThemeScopeProps(props)
|
|
3366
|
-
});
|
|
3367
|
-
}
|
|
3368
|
-
function PopoverPopup({ className, ...props }) {
|
|
3369
|
-
const { content } = popover();
|
|
3370
|
-
return /* @__PURE__ */ jsx("div", {
|
|
3371
|
-
"data-slot": "popover-content",
|
|
3372
|
-
className: content({ className }),
|
|
3373
|
-
...props
|
|
3374
|
-
});
|
|
3375
|
-
}
|
|
3376
|
-
function PopoverContent({ align = "start", alignOffset = 0, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "bottom", sideOffset = 4, sticky, container, portalProps, className, ...props }) {
|
|
3377
|
-
const { positioner, content } = popover();
|
|
3378
|
-
const portalContainer = container !== void 0 ? container : portalProps?.container;
|
|
3379
|
-
return /* @__PURE__ */ jsx(PopoverPortal, {
|
|
3380
|
-
...portalProps,
|
|
3381
|
-
container: portalContainer,
|
|
3382
|
-
children: /* @__PURE__ */ jsx(Popover$1.Positioner, {
|
|
3383
|
-
align,
|
|
3384
|
-
alignOffset,
|
|
3385
|
-
anchor,
|
|
3386
|
-
arrowPadding,
|
|
3387
|
-
collisionAvoidance,
|
|
3388
|
-
collisionBoundary,
|
|
3389
|
-
collisionPadding,
|
|
3390
|
-
disableAnchorTracking,
|
|
3391
|
-
positionMethod,
|
|
3392
|
-
side,
|
|
3393
|
-
sideOffset,
|
|
3394
|
-
sticky,
|
|
3395
|
-
className: positioner(),
|
|
3396
|
-
children: /* @__PURE__ */ jsx(Popover$1.Popup, {
|
|
3397
|
-
"data-slot": "popover-content",
|
|
3398
|
-
className: content({ className }),
|
|
3399
|
-
...props
|
|
3400
|
-
})
|
|
3401
|
-
})
|
|
3402
|
-
});
|
|
3403
|
-
}
|
|
3404
|
-
function PopoverViewport({ className, ...props }) {
|
|
3405
|
-
const { viewport } = popover();
|
|
3406
|
-
return /* @__PURE__ */ jsx(Popover$1.Viewport, {
|
|
3407
|
-
"data-slot": "popover-viewport",
|
|
3408
|
-
className: viewport({ className }),
|
|
3409
|
-
...props
|
|
3410
|
-
});
|
|
3411
|
-
}
|
|
3412
|
-
function PopoverHeader({ className, ...props }) {
|
|
3413
|
-
const { header } = popover();
|
|
3414
|
-
return /* @__PURE__ */ jsx("div", {
|
|
3415
|
-
"data-slot": "popover-header",
|
|
3416
|
-
className: header({ className }),
|
|
3417
|
-
...props
|
|
3418
|
-
});
|
|
3419
|
-
}
|
|
3420
|
-
function PopoverSeparator({ className, ...props }) {
|
|
3421
|
-
const { separator } = popover();
|
|
3422
|
-
return /* @__PURE__ */ jsx("div", {
|
|
3423
|
-
role: "separator",
|
|
3424
|
-
"aria-orientation": "horizontal",
|
|
3425
|
-
"data-slot": "popover-separator",
|
|
3426
|
-
className: separator({ className }),
|
|
3427
|
-
...props
|
|
3428
|
-
});
|
|
3429
|
-
}
|
|
3430
|
-
function PopoverTitle({ className, ...props }) {
|
|
3431
|
-
const { title } = popover();
|
|
3432
|
-
return /* @__PURE__ */ jsx(Popover$1.Title, {
|
|
3433
|
-
"data-slot": "popover-title",
|
|
3434
|
-
className: title({ className }),
|
|
3435
|
-
...props
|
|
3436
|
-
});
|
|
3437
|
-
}
|
|
3438
|
-
function PopoverDescription({ className, ...props }) {
|
|
3439
|
-
const { description } = popover();
|
|
3440
|
-
return /* @__PURE__ */ jsx(Popover$1.Description, {
|
|
3441
|
-
"data-slot": "popover-description",
|
|
3442
|
-
className: description({ className }),
|
|
3443
|
-
...props
|
|
3444
|
-
});
|
|
3445
|
-
}
|
|
3446
|
-
function PopoverClose({ className, ...props }) {
|
|
3447
|
-
const { close } = popover();
|
|
3448
|
-
return /* @__PURE__ */ jsx(Popover$1.Close, {
|
|
3449
|
-
"data-slot": "popover-close",
|
|
3450
|
-
className: close({ className }),
|
|
3451
|
-
...props
|
|
3452
|
-
});
|
|
3453
|
-
}
|
|
3454
|
-
function PopoverArrow({ className, ...props }) {
|
|
3455
|
-
const { arrow } = popover();
|
|
3456
|
-
return /* @__PURE__ */ jsx(Popover$1.Arrow, {
|
|
3457
|
-
"data-slot": "popover-arrow",
|
|
3458
|
-
className: arrow({ className }),
|
|
3459
|
-
...props
|
|
3460
|
-
});
|
|
3461
|
-
}
|
|
3462
|
-
function PopoverBackdrop({ className, ...props }) {
|
|
3463
|
-
const { backdrop } = popover();
|
|
3464
|
-
return /* @__PURE__ */ jsx(Popover$1.Backdrop, {
|
|
3465
|
-
"data-slot": "popover-backdrop",
|
|
3466
|
-
className: backdrop({ className }),
|
|
3467
|
-
...props
|
|
3468
|
-
});
|
|
3469
|
-
}
|
|
3470
|
-
//#endregion
|
|
3471
|
-
//#region src/components/preview-card/preview-card.tsx
|
|
3472
|
-
const previewCard = tv({ slots: {
|
|
3473
|
-
trigger: [],
|
|
3474
|
-
positioner: ["isolate z-50 outline-none"],
|
|
3475
|
-
popup: [
|
|
3476
|
-
"max-h-(--available-height) min-w-[220px] overflow-hidden",
|
|
3477
|
-
"outline-none",
|
|
3478
|
-
"origin-(--transform-origin) transform-gpu opacity-100 will-change-[transform,opacity]",
|
|
3479
|
-
"transition-[opacity,transform] duration-250 ease-[cubic-bezier(0.22,1,0.36,1)]",
|
|
3480
|
-
"data-starting-style:scale-[0.97] data-starting-style:opacity-0",
|
|
3481
|
-
"data-ending-style:scale-[0.99] data-ending-style:opacity-0 data-ending-style:duration-150",
|
|
3482
|
-
"data-instant:transition-none motion-reduce:transition-none",
|
|
3483
|
-
"w-[300px] rounded-container bg-layer-popover text-foreground",
|
|
3484
|
-
"shadow-float ring-1 ring-line-seam"
|
|
3485
|
-
],
|
|
3486
|
-
header: ["flex items-start gap-3", "px-4 pt-4 pb-3 last:pb-4"],
|
|
3487
|
-
separator: ["border-t", "border-line-hairline"],
|
|
3488
|
-
title: ["m-0 truncate", "font-sans text-headline font-bold text-foreground"],
|
|
3489
|
-
description: ["m-0 truncate", "px-4 py-3 last:pb-4 font-sans text-callout text-foreground-muted"],
|
|
3490
|
-
arrow: ["size-2 rotate-45", "border-l border-t border-line-seam bg-layer-popover"]
|
|
3491
|
-
} });
|
|
3492
|
-
function PreviewCard(props) {
|
|
3493
|
-
return /* @__PURE__ */ jsx(PreviewCard$1.Root, {
|
|
3494
|
-
"data-slot": "preview-card",
|
|
3495
|
-
...props
|
|
3496
|
-
});
|
|
3497
|
-
}
|
|
3498
|
-
function PreviewCardTrigger({ delay = 80, closeDelay = 40, className, ...props }) {
|
|
3499
|
-
const { trigger } = previewCard();
|
|
3500
|
-
return /* @__PURE__ */ jsx(PreviewCard$1.Trigger, {
|
|
3501
|
-
"data-slot": "preview-card-trigger",
|
|
3502
|
-
delay,
|
|
3503
|
-
closeDelay,
|
|
3504
|
-
className: trigger({ className }),
|
|
3505
|
-
...props
|
|
3506
|
-
});
|
|
3507
|
-
}
|
|
3508
|
-
function PreviewCardPortal(props) {
|
|
3509
|
-
return /* @__PURE__ */ jsx(PreviewCard$1.Portal, {
|
|
3510
|
-
"data-slot": "preview-card-portal",
|
|
3511
|
-
...useThemeScopeProps(props)
|
|
3512
|
-
});
|
|
3513
|
-
}
|
|
3514
|
-
function PreviewCardPopup({ className, ...props }) {
|
|
3515
|
-
const themeState = useTheme();
|
|
3516
|
-
const { popup } = previewCard();
|
|
3517
|
-
const scopeProps = resolveThemeScopeProps({
|
|
3518
|
-
...props,
|
|
3519
|
-
className: popup({ className })
|
|
3520
|
-
}, themeState);
|
|
3521
|
-
return /* @__PURE__ */ jsx("div", {
|
|
3522
|
-
"data-slot": "preview-card-content",
|
|
3523
|
-
...scopeProps
|
|
3524
|
-
});
|
|
3525
|
-
}
|
|
3526
|
-
function PreviewCardContent({ align = "start", alignOffset = 0, anchor, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, disableAnchorTracking, positionMethod = "fixed", side = "bottom", sideOffset = 6, sticky, portalProps, className, ...props }) {
|
|
3527
|
-
const { positioner, popup } = previewCard();
|
|
3528
|
-
return /* @__PURE__ */ jsx(PreviewCardPortal, {
|
|
3529
|
-
...portalProps,
|
|
3530
|
-
children: /* @__PURE__ */ jsx(PreviewCard$1.Positioner, {
|
|
3531
|
-
align,
|
|
3532
|
-
alignOffset,
|
|
3533
|
-
anchor,
|
|
3534
|
-
arrowPadding,
|
|
3535
|
-
collisionAvoidance,
|
|
3536
|
-
collisionBoundary,
|
|
3537
|
-
collisionPadding,
|
|
3538
|
-
disableAnchorTracking,
|
|
3539
|
-
positionMethod,
|
|
3540
|
-
side,
|
|
3541
|
-
sideOffset,
|
|
3542
|
-
sticky,
|
|
3543
|
-
className: positioner(),
|
|
3544
|
-
children: /* @__PURE__ */ jsx(PreviewCard$1.Popup, {
|
|
3545
|
-
"data-slot": "preview-card-content",
|
|
3546
|
-
className: popup({ className }),
|
|
3547
|
-
...props
|
|
3548
|
-
})
|
|
3549
|
-
})
|
|
3550
|
-
});
|
|
3551
|
-
}
|
|
3552
|
-
function PreviewCardHeader({ className, ...props }) {
|
|
3553
|
-
const { header } = previewCard();
|
|
3554
|
-
return /* @__PURE__ */ jsx("div", {
|
|
3555
|
-
"data-slot": "preview-card-header",
|
|
3556
|
-
className: header({ className }),
|
|
3557
|
-
...props
|
|
3558
|
-
});
|
|
3559
|
-
}
|
|
3560
|
-
function PreviewCardSeparator({ className, ...props }) {
|
|
3561
|
-
const { separator } = previewCard();
|
|
3562
|
-
return /* @__PURE__ */ jsx("div", {
|
|
3563
|
-
role: "separator",
|
|
3564
|
-
"aria-orientation": "horizontal",
|
|
3565
|
-
"data-slot": "preview-card-separator",
|
|
3566
|
-
className: separator({ className }),
|
|
3567
|
-
...props
|
|
3568
|
-
});
|
|
3569
|
-
}
|
|
3570
|
-
function PreviewCardTitle({ className, ...props }) {
|
|
3571
|
-
const { title } = previewCard();
|
|
3572
|
-
return /* @__PURE__ */ jsx("p", {
|
|
3573
|
-
"data-slot": "preview-card-title",
|
|
3574
|
-
className: title({ className }),
|
|
3575
|
-
...props
|
|
3576
|
-
});
|
|
3577
|
-
}
|
|
3578
|
-
function PreviewCardDescription({ className, ...props }) {
|
|
3579
|
-
const { description } = previewCard();
|
|
3580
|
-
return /* @__PURE__ */ jsx("p", {
|
|
3581
|
-
"data-slot": "preview-card-description",
|
|
3582
|
-
className: description({ className }),
|
|
3583
|
-
...props
|
|
3584
|
-
});
|
|
3585
|
-
}
|
|
3586
|
-
function PreviewCardArrow({ className, ...props }) {
|
|
3587
|
-
const { arrow } = previewCard();
|
|
3588
|
-
return /* @__PURE__ */ jsx(PreviewCard$1.Arrow, {
|
|
3589
|
-
"data-slot": "preview-card-arrow",
|
|
3590
|
-
className: arrow({ className }),
|
|
3591
|
-
...props
|
|
3592
|
-
});
|
|
3593
|
-
}
|
|
3594
|
-
//#endregion
|
|
3595
3263
|
//#region src/components/label/label.tsx
|
|
3596
3264
|
const label = tv({
|
|
3597
3265
|
slots: {
|
|
@@ -9748,16 +9416,16 @@ const banner = tv({
|
|
|
9748
9416
|
root: [
|
|
9749
9417
|
"group/banner @container grid gap-y-0",
|
|
9750
9418
|
"[&>svg]:col-start-1 [&>svg]:shrink-0",
|
|
9751
|
-
"*:data-[slot=
|
|
9419
|
+
"*:data-[slot=spinner]:col-start-1 *:data-[slot=spinner]:row-start-1",
|
|
9752
9420
|
"w-full grid-cols-[minmax(0,1fr)] items-start gap-x-2.5 rounded-container border-0",
|
|
9753
9421
|
"font-sans text-callout text-foreground ring-1 ring-line-hairline ring-inset",
|
|
9754
9422
|
"has-[>svg]:grid-cols-[20px_minmax(0,1fr)]",
|
|
9755
|
-
"has-[>[data-slot=
|
|
9423
|
+
"has-[>[data-slot=spinner]]:grid-cols-[20px_minmax(0,1fr)]",
|
|
9756
9424
|
"[&>svg]:row-start-1 [&>svg]:size-5 [&>svg]:text-foreground",
|
|
9757
9425
|
"[&>svg]:mt-[calc((1lh-20px)/2)]",
|
|
9758
|
-
"*:data-[slot=
|
|
9426
|
+
"*:data-[slot=spinner]:h-lh *:data-[slot=spinner]:leading-[inherit] *:data-[slot=spinner]:self-start *:data-[slot=spinner]:justify-self-center",
|
|
9759
9427
|
"has-[>svg]:[--banner-text-col:2]",
|
|
9760
|
-
"has-[>[data-slot=
|
|
9428
|
+
"has-[>[data-slot=spinner]]:[--banner-text-col:2]",
|
|
9761
9429
|
"has-[>[data-slot=banner-title]]:[--banner-desc-row:2]",
|
|
9762
9430
|
"has-[>[data-slot=banner-description]]:[--banner-last-row:var(--banner-desc-row,1)]",
|
|
9763
9431
|
"has-[>[data-banner-close]]:[--banner-action-end:span_2]"
|
|
@@ -9793,8 +9461,8 @@ const banner = tv({
|
|
|
9793
9461
|
},
|
|
9794
9462
|
size: {
|
|
9795
9463
|
sm: { root: [
|
|
9796
|
-
"gap-x-2 px-3 py-2
|
|
9797
|
-
"has-[>svg]:grid-cols-[16px_minmax(0,1fr)] has-[>[data-slot=
|
|
9464
|
+
"gap-x-2 px-3 py-2",
|
|
9465
|
+
"has-[>svg]:grid-cols-[16px_minmax(0,1fr)] has-[>[data-slot=spinner]]:grid-cols-[16px_minmax(0,1fr)]",
|
|
9798
9466
|
"[&>svg]:mt-[calc((1lh-16px)/2)] [&>svg]:size-4"
|
|
9799
9467
|
] },
|
|
9800
9468
|
md: { root: ["px-3.5 py-3"] },
|
|
@@ -10413,7 +10081,7 @@ const toastStyles = tv({
|
|
|
10413
10081
|
icon: [
|
|
10414
10082
|
"flex h-lh w-5 shrink-0 items-center justify-center",
|
|
10415
10083
|
"[&_svg]:shrink-0",
|
|
10416
|
-
"[&_svg]:size-4
|
|
10084
|
+
"[&_svg]:size-4"
|
|
10417
10085
|
],
|
|
10418
10086
|
body: ["min-w-0"],
|
|
10419
10087
|
title: ["m-0 truncate text-callout", "font-normal text-foreground-on-hud"],
|
|
@@ -10847,11 +10515,11 @@ function DefaultToastItem({ placement, toast: toastObject }) {
|
|
|
10847
10515
|
})
|
|
10848
10516
|
});
|
|
10849
10517
|
}
|
|
10850
|
-
const
|
|
10851
|
-
info:
|
|
10852
|
-
success:
|
|
10853
|
-
warning:
|
|
10854
|
-
error:
|
|
10518
|
+
const TOAST_ICON = {
|
|
10519
|
+
info: Info,
|
|
10520
|
+
success: CircleCheck,
|
|
10521
|
+
warning: TriangleAlert,
|
|
10522
|
+
error: TriangleAlert
|
|
10855
10523
|
};
|
|
10856
10524
|
function hasLeading(toastObject) {
|
|
10857
10525
|
const leading = toastObject.data?.leading;
|
|
@@ -10863,10 +10531,8 @@ function DefaultToastIcon({ toast: toastObject }) {
|
|
|
10863
10531
|
children: toastObject.data?.leading
|
|
10864
10532
|
});
|
|
10865
10533
|
const intent = toastObject.data?.intent ?? getToastTone(toastObject.type);
|
|
10866
|
-
|
|
10867
|
-
|
|
10868
|
-
variant: TOAST_PIXEL[intent]
|
|
10869
|
-
}) });
|
|
10534
|
+
const Icon = TOAST_ICON[intent];
|
|
10535
|
+
return /* @__PURE__ */ jsx(ToastIcon, { children: /* @__PURE__ */ jsx(Icon, { "aria-hidden": true }) });
|
|
10870
10536
|
}
|
|
10871
10537
|
function ToastArrowSvg(props) {
|
|
10872
10538
|
return /* @__PURE__ */ jsx("svg", {
|
|
@@ -11313,56 +10979,6 @@ function Separator({ children, className, orientation = "horizontal", ...props }
|
|
|
11313
10979
|
});
|
|
11314
10980
|
}
|
|
11315
10981
|
//#endregion
|
|
11316
|
-
//#region src/components/panel/panel-action.recipe.ts
|
|
11317
|
-
const panelActionBase = tv({ base: [
|
|
11318
|
-
"relative inline-flex w-auto shrink-0 items-center justify-center",
|
|
11319
|
-
"overflow-visible font-sans leading-none tabular-nums select-none outline-none",
|
|
11320
|
-
"transition-all duration-100",
|
|
11321
|
-
"[&>svg]:pointer-events-none [&>svg]:shrink-0",
|
|
11322
|
-
"h-control min-w-control rounded-control border-[1.5px] border-transparent bg-transparent py-0",
|
|
11323
|
-
"px-2 md:pointer-fine:px-[5px]",
|
|
11324
|
-
"after:absolute after:-inset-control-hit",
|
|
11325
|
-
"text-foreground",
|
|
11326
|
-
"hover:bg-fill-medium active:bg-fill-medium",
|
|
11327
|
-
"focus-visible:shadow-focus",
|
|
11328
|
-
"[&>svg]:size-control-icon",
|
|
11329
|
-
controlIconInset
|
|
11330
|
-
] });
|
|
11331
|
-
const panelAction = tv({
|
|
11332
|
-
extend: panelActionBase,
|
|
11333
|
-
base: [
|
|
11334
|
-
"whitespace-nowrap",
|
|
11335
|
-
"disabled:pointer-events-none disabled:transform-none",
|
|
11336
|
-
"gap-1.5 text-control font-bold",
|
|
11337
|
-
"disabled:bg-transparent disabled:text-foreground-disabled disabled:opacity-100",
|
|
11338
|
-
"aria-pressed:border-sticker-ink aria-pressed:bg-brand aria-pressed:text-sticker-ink aria-pressed:ring-[1.5px] aria-pressed:ring-sticker-edge",
|
|
11339
|
-
"aria-pressed:active:overlay-sticker-medium"
|
|
11340
|
-
]
|
|
11341
|
-
});
|
|
11342
|
-
const panelToggleAction = tv({
|
|
11343
|
-
extend: panelActionBase,
|
|
11344
|
-
base: [
|
|
11345
|
-
"data-disabled:pointer-events-none data-disabled:transform-none",
|
|
11346
|
-
"gap-1.5 text-control font-bold",
|
|
11347
|
-
"data-disabled:bg-transparent data-disabled:text-foreground-disabled data-disabled:opacity-100",
|
|
11348
|
-
"data-pressed:border-sticker-ink data-pressed:bg-brand data-pressed:text-sticker-ink data-pressed:ring-[1.5px] data-pressed:ring-sticker-edge",
|
|
11349
|
-
"data-pressed:active:overlay-sticker-medium"
|
|
11350
|
-
]
|
|
11351
|
-
});
|
|
11352
|
-
//#endregion
|
|
11353
|
-
//#region src/components/panel/panel-action.tsx
|
|
11354
|
-
function PanelAction({ className, render, nativeButton, ...props }) {
|
|
11355
|
-
return /* @__PURE__ */ jsx(Button$1, {
|
|
11356
|
-
...props,
|
|
11357
|
-
render,
|
|
11358
|
-
nativeButton: nativeButton ?? defaultNativeButton(render),
|
|
11359
|
-
type: "button",
|
|
11360
|
-
"data-slot": "panel-action",
|
|
11361
|
-
"data-icon-inset": "",
|
|
11362
|
-
className: panelAction({ className })
|
|
11363
|
-
});
|
|
11364
|
-
}
|
|
11365
|
-
//#endregion
|
|
11366
10982
|
//#region src/components/app-shell/app-shell.tsx
|
|
11367
10983
|
const appShell = tv({
|
|
11368
10984
|
slots: {
|
|
@@ -11838,7 +11454,7 @@ const panelNotice = tv({
|
|
|
11838
11454
|
"flex shrink-0 items-start",
|
|
11839
11455
|
"min-h-10 gap-2.5 border-b border-line-seam px-5 py-2.5 max-md:px-4",
|
|
11840
11456
|
"font-sans text-callout font-semibold text-foreground",
|
|
11841
|
-
"[&>svg]:lead-icon
|
|
11457
|
+
"[&>svg]:lead-icon"
|
|
11842
11458
|
],
|
|
11843
11459
|
content: ["min-w-0 flex-1"],
|
|
11844
11460
|
actions: ["flex shrink-0 items-center", "-my-1.5 gap-3"]
|
|
@@ -15686,7 +15302,7 @@ const taskChip = tv({
|
|
|
15686
15302
|
"no-underline select-text",
|
|
15687
15303
|
"transition-[filter,opacity] duration-100",
|
|
15688
15304
|
"focus-visible:keyboard:outline-2 focus-visible:keyboard:outline-offset-2 focus-visible:keyboard:outline-line-strong",
|
|
15689
|
-
"
|
|
15305
|
+
"border-0",
|
|
15690
15306
|
"font-sans font-semibold text-foreground",
|
|
15691
15307
|
"[&>svg:not([data-slot=task-status-icon])]:-mx-0.5 [&>svg[data-slot=task-status-icon]]:size-[9px]",
|
|
15692
15308
|
"[a,button]:cursor-pointer [a,button]:hover:overlay-medium [a,button]:active:overlay-medium",
|
|
@@ -15701,7 +15317,7 @@ const taskChip = tv({
|
|
|
15701
15317
|
closed: { root: ["bg-task-status-closed-soft"] }
|
|
15702
15318
|
},
|
|
15703
15319
|
variant: {
|
|
15704
|
-
default: { root: ["h-[22px] gap-1.5 px-[7px] py-0", "text-[12px] leading-4"] },
|
|
15320
|
+
default: { root: ["h-[22px] gap-1.5 rounded-chip px-[7px] py-0", "text-[12px] leading-4"] },
|
|
15705
15321
|
inline: {}
|
|
15706
15322
|
},
|
|
15707
15323
|
size: {
|
|
@@ -15709,39 +15325,21 @@ const taskChip = tv({
|
|
|
15709
15325
|
sm: {}
|
|
15710
15326
|
}
|
|
15711
15327
|
},
|
|
15712
|
-
compoundVariants: [
|
|
15713
|
-
|
|
15714
|
-
|
|
15715
|
-
|
|
15716
|
-
|
|
15717
|
-
|
|
15718
|
-
|
|
15719
|
-
|
|
15720
|
-
|
|
15721
|
-
|
|
15722
|
-
|
|
15723
|
-
|
|
15724
|
-
|
|
15725
|
-
|
|
15726
|
-
|
|
15727
|
-
},
|
|
15728
|
-
{
|
|
15729
|
-
variant: "default",
|
|
15730
|
-
size: "sm",
|
|
15731
|
-
class: { root: ["h-5 gap-1 px-[5px]"] }
|
|
15732
|
-
},
|
|
15733
|
-
{
|
|
15734
|
-
variant: "inline",
|
|
15735
|
-
status: [
|
|
15736
|
-
"todo",
|
|
15737
|
-
"in-progress",
|
|
15738
|
-
"in-review",
|
|
15739
|
-
"done",
|
|
15740
|
-
"closed"
|
|
15741
|
-
],
|
|
15742
|
-
class: { root: ["rounded-sticker border-0 px-[4.5px]", "font-semibold"] }
|
|
15743
|
-
}
|
|
15744
|
-
],
|
|
15328
|
+
compoundVariants: [{
|
|
15329
|
+
variant: "inline",
|
|
15330
|
+
status: [
|
|
15331
|
+
"todo",
|
|
15332
|
+
"in-progress",
|
|
15333
|
+
"in-review",
|
|
15334
|
+
"done",
|
|
15335
|
+
"closed"
|
|
15336
|
+
],
|
|
15337
|
+
class: { root: [...inlineChip, "[&>svg]:size-3.5 [&>svg]:self-center [&>svg:not([data-slot=task-status-icon])]:mx-0"] }
|
|
15338
|
+
}, {
|
|
15339
|
+
variant: "default",
|
|
15340
|
+
size: "sm",
|
|
15341
|
+
class: { root: ["h-5 gap-1 px-[5px]"] }
|
|
15342
|
+
}],
|
|
15745
15343
|
defaultVariants: {
|
|
15746
15344
|
variant: "default",
|
|
15747
15345
|
size: "default"
|