@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/dist/index.mjs CHANGED
@@ -1,21 +1,21 @@
1
1
  import { cn } from "./cn.mjs";
2
- import { $ as MessageReactionPickerStatic, $n as DialogTitle, $t as DropdownMenuFooter, A as MessageEmbedFooter, An as useMobileViewport, At as MessageItemEmbedded, B as MessageReferenceChip, Bn as textLinkVariants, Bt as AvatarFallback, C as MessageQuotedPreviewLoading, Cn as PanelSection, Ct as MessageItemSenderButton, D as MessageQuotedPreviewUnavailable, Dn as ScrollAreaScrollbar, Dt as MessageItemBody, E as MessageQuotedPreviewTimestamp, En as ScrollAreaCorner, Et as MessageItemAttachments, F as MessageTextSelectionToolbarSeparator, Fn as TooltipContent, Ft as MessageItemGutter, G as MessageReferenceText, Gn as DialogContent, H as MessageReferenceLabel, Hn as Dialog, Ht as AvatarGroupCount, I as MessageMultiSelect, In as TooltipPortal, It as MessageItem, J as MessageReactionChip, Jn as DialogHeader, K as MessageReferenceUnavailable, Kn as DialogDescription, L as MessageMultiSelectCheckbox, Ln as TooltipProvider, Lt as searchHit, M as messageEmbed, Mn as CheckboxIndicator, Mt as MessageItemSearchMatch, N as MessageTextSelectionToolbar, Nn as PRESENCE_COLOR, Nt as MessageItemAvatarSlot, O as MessageEmbed, On as ScrollAreaThumb, Ot as MessageItemContent, P as MessageTextSelectionToolbarButton, Pn as Tooltip, Pt as MessageItemContinuationTime, Q as MessageReactionPickerContent, Qn as DialogSurface, Qt as DropdownMenuContent, R as MessageMultiSelectToolbar, Rn as TooltipTrigger, Rt as Avatar, S as MessageQuotedPreviewHeader, Sn as PanelScrollViewport, St as MessageItemSenderBadges, T as MessageQuotedPreviewThread, Tn as ScrollAreaContent, Tt as MessageItemTime, U as MessageReferencePending, Un as DialogBody, Ut as AvatarImage, V as MessageReferenceIndicator, Vn as Badge, Vt as AvatarGroup, W as MessageReferenceSuffix, Wn as DialogClose, Wt as useOverflowTitle, X as MessageReactionErrorIndicator, Xn as DialogOverlay, Xt as DropdownMenuCheckboxItem, Y as MessageReactionCount, Yn as DialogNav, Yt as DropdownMenu, Z as MessageReactionGlyph, Zn as DialogPortal, Zt as DropdownMenuCheckboxItemIndicator, _n as Panel, an as DropdownMenuPopup, ar as useParentOverlayKind, at as MessageReactionTooltipNameText, b as MessageQuotedPreviewChannel, bn as PanelHeaderRoot, bt as MessageItemMeta, c as MessageListDateDivider, cn as DropdownMenuRadioItem, cr as useThemeScopeProps, ct as MessageItemBadge, d as MessageListNotice, dn as DropdownMenuShortcut, dr as tv, dt as MessageItemSavedIndicator, en as DropdownMenuItem, er as DialogTrigger, et as MessageReactionQuickButton, f as MessageList, fn as DropdownMenuSubmenu, fr as controlIconInset, ft as MessageItemToolbar, g as MessageQuotedPreviewAuthor, gn as KbdGroup, h as MessageQuotedPreviewAttachments, hn as Kbd, hr as decisionWidth, ir as defaultNativeButton, it as MessageReactionTooltipName, j as MessageEmbedHeader, jn as Checkbox, jt as MessageItemFooter, k as MessageEmbedContent, kn as ScrollAreaViewport, kt as MessageItemEdited, l as MessageListEndFade, ln as DropdownMenuRadioItemIndicator, lr as useTheme, lt as MessageItemBadgeSeparator, m as MessageQuotedPreviewAttachment, mn as DropdownMenuTrigger, mr as headEdges, n as useHoldThenMoveTouchSensor, nn as DropdownMenuItemLabel, nr as buttonVariants, nt as MessageReactionTooltipContent, on as DropdownMenuPortal, or as withOverlayLayer, ot as MessageReactionTooltipNames, p as MessageQuotedPreview, pn as DropdownMenuSubmenuTrigger, pr as headEdgePull, pt as MessageItemToolbarButton, q as MessageReactionAddButton, qn as DialogFooter, r as useMouseOnlyPointerSensor, rn as DropdownMenuLabel, rr as Spinner, rt as MessageReactionTooltipMeta, sn as DropdownMenuRadioGroup, sr as resolveThemeScopeProps, st as MessageReactionTooltipSeparator, t as inboxItem, tn as DropdownMenuItemCount, tr as Button, tt as MessageReactionQuickRow, u as MessageListHistoryLimited, un as DropdownMenuSeparator, ur as ThemeStateContext, ut as MessageItemReadReceipt, v as MessageQuotedPreviewAuthorMeta, vn as PanelBody, vt as MessageItemHeader, w as MessageQuotedPreviewText, wn as ScrollArea, wt as MessageItemSenderGroup, x as MessageQuotedPreviewContent, xn as PanelScrollContent, xt as MessageItemSender, y as MessageQuotedPreviewAuthorName, yn as PanelFooter, yt as MessageItemInlineStatus, z as MessageMultiSelectToolbarActions, zn as TextLink, zt as AvatarBadge } from "./inbox-item.recipe-CuJPcy-3.mjs";
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 { PreviewCard as PreviewCard$1 } from "@base-ui/react/preview-card";
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: ["flex items-center justify-end", "gap-2 px-5 pb-5 first:pt-5 [[data-slot=alert-dialog-header]+&]:pt-5"],
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=status]:col-start-1 *:data-[slot=status]:row-start-1",
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=status]]:grid-cols-[20px_minmax(0,1fr)]",
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=status]:lead-dot *:data-[slot=status]:self-start *:data-[slot=status]:justify-self-center",
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=status]]:[--banner-text-col:2]",
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 text-footnote",
9797
- "has-[>svg]:grid-cols-[16px_minmax(0,1fr)] has-[>[data-slot=status]]:grid-cols-[16px_minmax(0,1fr)]",
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 *:data-[slot=status]:lead-dot"
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 TOAST_PIXEL = {
10851
- info: "information",
10852
- success: "success",
10853
- warning: "warning",
10854
- error: "warning"
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
- return /* @__PURE__ */ jsx(ToastIcon, { children: /* @__PURE__ */ jsx(Status, {
10867
- "aria-hidden": true,
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 *:data-[slot=status]:lead-dot"
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
- "rounded-chip border-0",
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
- variant: "inline",
15715
- status: [
15716
- "todo",
15717
- "in-progress",
15718
- "in-review",
15719
- "done",
15720
- "closed"
15721
- ],
15722
- class: { root: [
15723
- "items-baseline gap-1.5 rounded-full border py-0 pr-2 pl-1 align-baseline",
15724
- "[font-size:inherit] leading-[1.2em] font-[450]",
15725
- "[&>svg]:size-[0.857em] [&>svg]:self-center"
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"