@pstdio/ui 0.43.0 → 0.43.1

package/dist/{theme-Bd_a7sU8.js → theme-CWDvF5Yn.js}

@@ -1,9 +1,9 @@
 import { n as e, t } from "./queued-follow-up-Bj_vtMgd.js";
 import { createSystem as n, defaultConfig as r, defineConfig as i, defineLayerStyles as a, defineRecipe as o, defineSlotRecipe as s, defineTextStyles as c } from "@chakra-ui/react";
-import { alertAnatomy as ee, colorPickerAnatomy as te, dialogAnatomy as ne, drawerAnatomy as l, fieldsetAnatomy as u, menuAnatomy as d, numberInputAnatomy as f, popoverAnatomy as p, switchAnatomy as re, tabsAnatomy as ie, tagAnatomy as ae, timelineAnatomy as oe, tooltipAnatomy as se } from "@chakra-ui/react/anatomy";
-import { progressCircleSlotRecipe as m } from "@chakra-ui/react/theme";
+import { alertAnatomy as l, colorPickerAnatomy as ee, dialogAnatomy as te, drawerAnatomy as ne, fieldsetAnatomy as re, menuAnatomy as u, numberInputAnatomy as d, popoverAnatomy as f, switchAnatomy as p, tabsAnatomy as m, tagAnatomy as ie, timelineAnatomy as ae, tooltipAnatomy as oe } from "@chakra-ui/react/anatomy";
+import { progressCircleSlotRecipe as h } from "@chakra-ui/react/theme";
 //#region src/theme/recipes/window-title-bar.ts
-var h = s({
+var g = s({
 	className: "ps-window-title-bar",
 	slots: ["root", "content"],
 	base: {
@@ -38,7 +38,7 @@ var h = s({
 		} }
 	} },
 	defaultVariants: { controls: "overlay" }
-}), g = s({
+}), _ = s({
 	className: "ps-window-tabs",
 	slots: [
 		"list",
@@ -134,7 +134,7 @@ var h = s({
 			}
 		}
 	}
-}), _ = {
+}), se = {
 	"@property --split-size": {
 		syntax: "\"<length>\"",
 		inherits: "true",
@@ -536,6 +536,11 @@ var h = s({
 	"panel-gap": { value: w[50] },
 	"performance-bar-gap": { value: "1px" }
 }, E = {
+	"chat-user-preview": { value: w[1600] },
+	"chat-user-footer": { value: w[400] },
+	"chat-user-expanded": { value: "min(70dvh, calc(100dvh - 12rem), 22rem)" },
+	"scrollbar-thin": { value: w[25] },
+	"chat-content": { value: "52rem" },
 	"palette-width": { value: "44rem" },
 	"palette-results-height": { value: "24rem" },
 	"queue-send-now": { value: w[250] },
@@ -546,6 +551,7 @@ var h = s({
 	"performance-meter": { value: "0.625rem" },
 	"performance-chart": { value: "2.25rem" },
 	"performance-popover": { value: "23.75rem" },
+	"popover-panel": { value: "27.5rem" },
 	"folder-picker-width": { value: "36.5rem" },
 	"folder-picker-height": { value: "31rem" },
 	"folder-picker-header": { value: "3.25rem" },
@@ -597,7 +603,7 @@ var h = s({
 	full: { value: "100%" },
 	pill: { value: "9999px" }
 }, k = s({
-	slots: ee.keys(),
+	slots: l.keys(),
 	base: {
 		root: {
 			px: "xs",
@@ -964,7 +970,7 @@ var h = s({
 		label: { textStyle: "label/XS" }
 	} } }
 }), F = "border.accent-light", I = s({
-	slots: te.keys(),
+	slots: ee.keys(),
 	base: {
 		control: {
 			display: "flex",
@@ -1068,7 +1074,7 @@ var h = s({
 	} },
 	defaultVariants: { size: "sm" }
 }), L = s({
-	slots: ne.keys(),
+	slots: te.keys(),
 	base: {
 		title: { textStyle: "heading/dialog" },
 		content: {
@@ -1086,7 +1092,7 @@ var h = s({
 		justifyContent: "space-between"
 	} } } }
 }), R = o({ base: { borderColor: "border.subtle" } }), z = s({
-	slots: l.keys(),
+	slots: ne.keys(),
 	base: {
 		header: {
 			fontWeight: "medium",
@@ -1302,7 +1308,7 @@ var h = s({
 		}
 	}
 }), H = s({
-	slots: u.keys(),
+	slots: re.keys(),
 	base: { legend: { mb: "2xs" } }
 }), U = "border.accent-light", W = o({
 	base: {
@@ -1512,7 +1518,7 @@ var h = s({
 	} },
 	defaultVariants: { visibility: "always" }
 }), ce = s({
-	slots: d.keys(),
+	slots: u.keys(),
 	base: {
 		itemGroupLabel: {
 			ml: "{2xs}",
@@ -1663,7 +1669,7 @@ var h = s({
 	animation: "text-chunk {durations.text-chunk} {easings.enter}",
 	_motionReduce: { animation: "none" }
 } } }), me = "var(--chakra-colors-border)", q = "var(--chakra-colors-border-accent-light)", he = s({
-	slots: f.keys(),
+	slots: d.keys(),
 	base: {
 		root: {
 			position: "relative",
@@ -1883,7 +1889,7 @@ var h = s({
 		}
 	} } }
 }), _e = s({
-	slots: p.keys(),
+	slots: f.keys(),
 	base: {
 		positioner: { _focus: { outline: "none" } },
 		closeTrigger: {
@@ -1914,13 +1920,27 @@ var h = s({
 		footer: {}
 	},
 	variants: {
-		variant: { responsive: { content: { width: "unset" } } },
+		variant: {
+			panel: {
+				content: {
+					"--popover-size": "sizes.popover-panel",
+					padding: "md",
+					gap: "md",
+					borderColor: "border"
+				},
+				header: { padding: "0" },
+				title: { textStyle: "label/M/medium" },
+				body: { padding: "0" },
+				footer: { padding: "0" }
+			},
+			responsive: { content: { width: "unset" } }
+		},
 		size: { "2xl": { content: { width: "2xl" } } }
 	}
-}), ve = m.variants?.size ?? {}, ye = {
-	...m,
+}), ve = h.variants?.size ?? {}, ye = {
+	...h,
 	variants: {
-		...m.variants,
+		...h.variants,
 		size: {
 			...ve,
 			"2xs": {
@@ -2122,6 +2142,14 @@ var h = s({
 	],
 	base: {
 		viewport: { outline: "none" },
+		scrollbar: {
+			borderRadius: "2xs",
+			bg: "transparent",
+			"--thumb-bg": "colors.border",
+			"&:is(:hover, :active)": { "--thumb-bg": "colors.fg.subtle" },
+			_vertical: { "&::before": { insetInlineStart: "calc(var(--scrollbar-size) - var(--scrollbar-click-area))" } },
+			_horizontal: { "&::before": { top: "calc(var(--scrollbar-size) - var(--scrollbar-click-area))" } }
+		},
 		content: {
 			"--thumb-width": "initial",
 			"--thumb-height": "initial",
@@ -2132,12 +2160,84 @@ var h = s({
 			"--scroll-area-overflow-y-start": "initial",
 			"--scroll-area-overflow-y-end": "initial"
 		}
-	}
+	},
+	variants: { size: { xs: { root: {
+		"--scrollbar-size": "sizes.scrollbar-thin",
+		"--scrollbar-click-area": "spacing.xs"
+	} } } }
 }), Se = o({ base: {
 	"--start-color": "fg",
 	"--end-color": "fg.muted"
-} }), Ce = s({
-	slots: re.keys(),
+} }), Y = "calc({sizes.chat-user-preview} - {sizes.chat-user-footer})", Ce = s({
+	slots: [
+		"root",
+		"viewport",
+		"body",
+		"preview",
+		"footer",
+		"actions"
+	],
+	base: {
+		actions: {
+			px: "xs",
+			pb: "xs"
+		},
+		root: {
+			position: "relative",
+			padding: "0",
+			gap: "0",
+			overflow: "hidden"
+		},
+		viewport: {
+			maxHeight: Y,
+			overflowY: "hidden",
+			minHeight: "0"
+		},
+		body: {
+			display: "flex",
+			flexDirection: "column",
+			gap: "sm",
+			padding: "xs",
+			paddingBottom: "0"
+		},
+		preview: {
+			position: "absolute",
+			height: Y,
+			width: "0",
+			visibility: "hidden",
+			pointerEvents: "none"
+		},
+		footer: {
+			position: "relative",
+			flexShrink: "0",
+			minHeight: "chat-user-footer",
+			display: "flex",
+			justifyContent: "space-between",
+			alignItems: "center",
+			padding: "xs",
+			paddingTop: "0",
+			background: "var(--chat-message-bg)",
+			_before: {
+				content: "\"\"",
+				position: "absolute",
+				bottom: "100%",
+				left: "0",
+				right: "0",
+				height: "{spacing.3xl}",
+				backgroundImage: "linear-gradient(to bottom, transparent, var(--chat-message-bg) 75%, var(--chat-message-bg))",
+				pointerEvents: "none"
+			}
+		}
+	},
+	variants: { expanded: { true: {
+		viewport: {
+			maxHeight: "calc({sizes.chat-user-expanded} - {sizes.chat-user-footer})",
+			overflowY: "auto"
+		},
+		footer: { _before: { display: "none" } }
+	} } }
+}), we = s({
+	slots: p.keys(),
 	base: {
 		control: {
 			alignItems: "center",
@@ -2179,8 +2279,8 @@ var h = s({
 		},
 		thumb: { _checked: { bg: "fg.inverted" } }
 	} } }
-}), we = s({
-	slots: ie.keys(),
+}), Te = s({
+	slots: m.keys(),
 	base: {
 		root: { "--tabs-trigger-radius": "radii.xs" },
 		list: {
@@ -2192,6 +2292,11 @@ var h = s({
 			_horizontal: { _before: { borderBottomWidth: "0" } }
 		},
 		trigger: {
+			"&[data-reorderable]": {
+				cursor: "grab",
+				touchAction: "none"
+			},
+			"&[data-dragging]": { opacity: .5 },
 			flexShrink: "0",
 			overflow: "hidden",
 			"&:has([data-tab-close])": {
@@ -2305,8 +2410,8 @@ var h = s({
 		size: "xs",
 		variant: "subtle"
 	}
-}), Te = s({
-	slots: ae.keys(),
+}), Ee = s({
+	slots: ie.keys(),
 	base: {
 		root: {
 			display: "inline-flex",
@@ -2375,7 +2480,7 @@ var h = s({
 		variant: "ticket",
 		size: "composer"
 	}
-}), Y = "border.accent-light", Ee = o({
+}), X = "border.accent-light", De = o({
 	base: {
 		paddingX: "sm",
 		paddingY: "xs",
@@ -2389,21 +2494,21 @@ var h = s({
 		borderColor: "border",
 		"--focus-color": "var(--chakra-colors-border-accent-light)",
 		"--focus-ring-style": "none",
-		_hover: { borderColor: Y },
-		_active: { borderColor: Y },
+		_hover: { borderColor: X },
+		_active: { borderColor: X },
 		_focus: {
-			borderColor: Y,
+			borderColor: X,
 			outline: "none",
 			boxShadow: "none"
 		},
 		_focusVisible: {
-			borderColor: Y,
+			borderColor: X,
 			outline: "none",
 			boxShadow: "none"
 		},
 		_placeholder: { color: "fg.subtle" },
-		"&:is(:hover, [data-hover])": { borderColor: Y },
-		"&:is(:active, [data-active])": { borderColor: Y }
+		"&:is(:hover, [data-hover])": { borderColor: X },
+		"&:is(:active, [data-active])": { borderColor: X }
 	},
 	variants: {
 		variant: { outline: {
@@ -2414,20 +2519,20 @@ var h = s({
 			boxShadow: "none",
 			"--focus-color": "var(--chakra-colors-border-accent-light)",
 			"--focus-ring-style": "none",
-			_hover: { borderColor: Y },
-			_active: { borderColor: Y },
+			_hover: { borderColor: X },
+			_active: { borderColor: X },
 			_focus: {
-				borderColor: Y,
+				borderColor: X,
 				outline: "none",
 				boxShadow: "none"
 			},
 			_focusVisible: {
-				borderColor: Y,
+				borderColor: X,
 				outline: "none",
 				boxShadow: "none"
 			},
-			"&:is(:hover, [data-hover])": { borderColor: Y },
-			"&:is(:active, [data-active])": { borderColor: Y }
+			"&:is(:hover, [data-hover])": { borderColor: X },
+			"&:is(:active, [data-active])": { borderColor: X }
 		} },
 		size: {
 			"2xs": {
@@ -2461,8 +2566,8 @@ var h = s({
 		size: "sm",
 		variant: "outline"
 	}
-}), De = s({
-	slots: oe.keys(),
+}), Oe = s({
+	slots: ae.keys(),
 	base: {
 		root: {
 			display: "flex",
@@ -2593,8 +2698,8 @@ var h = s({
 		variant: "solid",
 		showLastSeparator: !1
 	}
-}), Oe = s({
-	slots: se.keys(),
+}), ke = s({
+	slots: oe.keys(),
 	base: { content: {
 		bg: "bg.inverted",
 		borderRadius: "xs",
@@ -2605,27 +2710,27 @@ var h = s({
 			borderColor: "border.inverted"
 		}
 	} }
-}), ke = /* @__PURE__ */ new Set([
+}), Ae = /* @__PURE__ */ new Set([
 	"boxShadow",
 	"boxShadowColor",
 	"textShadow"
-]), X = /shadow/i, Z = (e) => {
-	if (!X.test(e)) return e;
-	let t = e.split(",").map((e) => e.trim()).filter((e) => !X.test(e));
+]), Z = /shadow/i, je = (e) => {
+	if (!Z.test(e)) return e;
+	let t = e.split(",").map((e) => e.trim()).filter((e) => !Z.test(e));
 	if (t.length !== 0) return t.join(", ");
-}, Q = (e) => Array.isArray(e) ? e.map(Q).filter((e) => e !== void 0) : typeof e == "string" ? Z(e) : !e || typeof e != "object" ? e : Object.fromEntries(Object.entries(e).flatMap(([e, t]) => {
-	if (ke.has(e) || X.test(e)) return [];
+}, Q = (e) => Array.isArray(e) ? e.map(Q).filter((e) => e !== void 0) : typeof e == "string" ? je(e) : !e || typeof e != "object" ? e : Object.fromEntries(Object.entries(e).flatMap(([e, t]) => {
+	if (Ae.has(e) || Z.test(e)) return [];
 	let n = Q(t);
 	return n === void 0 ? [] : [[e, n]];
 })), $ = (e) => {
 	let { shadows: t, ...n } = e ?? {};
 	return n;
-}, Ae = {
+}, Me = {
 	badge: ["surface"],
 	button: ["secondary", "surface"]
-}, je = (e) => {
+}, Ne = (e) => {
 	let t = { ...e ?? {} };
-	for (let [e, n] of Object.entries(Ae)) {
+	for (let [e, n] of Object.entries(Me)) {
 		let r = t[e];
 		if (!r || typeof r != "object") continue;
 		let i = r, a = i.variants, o = a?.variant;
@@ -2640,24 +2745,24 @@ var h = s({
 		};
 	}
 	return t;
-}, Me = {
+}, Pe = {
 	...r,
 	theme: {
 		...r.theme,
 		tokens: $(r.theme?.tokens),
 		semanticTokens: $(r.theme?.semanticTokens),
-		recipes: je(Q(r.theme?.recipes)),
+		recipes: Ne(Q(r.theme?.recipes)),
 		slotRecipes: Q(r.theme?.slotRecipes),
 		layerStyles: Q(r.theme?.layerStyles),
 		animationStyles: Q(r.theme?.animationStyles)
 	}
-}, Ne = {
+}, Fe = {
 	DEFAULT: { value: "1px solid {colors.border}" },
 	subtle: { value: "1px solid {colors.border.subtle}" },
 	inverted: { value: "1px solid {colors.border.inverted}" },
 	accent: { value: "1px solid {colors.border.accent}" },
 	"accent-light": { value: "1px solid {colors.border.accent-light}" }
-}, Pe = {
+}, Ie = {
 	fg: {
 		DEFAULT: { value: {
 			_light: "{colors.blacks.800}",
@@ -3082,7 +3187,13 @@ var h = s({
 		_light: "{colors.blacks.800}",
 		_dark: "{colors.blacks.800}"
 	} } } }
-}, Fe = a({
+}, Le = a({
+	chatContent: { value: {
+		width: "full",
+		minWidth: "0",
+		maxWidth: "chat-content",
+		marginInline: "auto"
+	} },
 	settingsHeader: { value: {
 		padding: "lg",
 		bg: "bg",
@@ -3164,7 +3275,7 @@ var h = s({
 		border: "1px solid",
 		borderColor: "border"
 	} }
-}), Ie = c({
+}), Re = c({
 	"heading/dialog": { value: {
 		fontFamily: "heading",
 		fontSize: "0.9375rem",
@@ -3410,9 +3521,9 @@ var h = s({
 		color: "fg",
 		letterSpacing: "0.14px"
 	} }
-}), Le = i({
+}), ze = i({
 	conditions: { startingStyle: "@starting-style" },
-	globalCss: _,
+	globalCss: se,
 	utilities: { WebkitAppRegion: {
 		values: ["drag", "no-drag"],
 		transform: (e) => ({ WebkitAppRegion: e })
@@ -3422,8 +3533,8 @@ var h = s({
 			"3xl": "2560px",
 			"4xl": "3840px"
 		},
-		textStyles: Ie,
-		layerStyles: Fe,
+		textStyles: Re,
+		layerStyles: Le,
 		recipes: {
 			bubbleLauncher: fe,
 			bubblePanel: de,
@@ -3438,7 +3549,7 @@ var h = s({
 			kbd: G,
 			listRowAccessory: K,
 			skeleton: Se,
-			textarea: Ee
+			textarea: De
 		},
 		tokens: {
 			durations: S,
@@ -3453,21 +3564,22 @@ var h = s({
 			spacing: T
 		},
 		semanticTokens: {
-			colors: Pe,
-			borders: Ne
+			colors: Ie,
+			borders: Fe
 		},
 		slotRecipes: {
+			stickyUserMessage: Ce,
 			scrollArea: xe,
 			queuedFollowUp: t,
-			tag: Te,
+			tag: Ee,
 			checkbox: P,
-			windowTitleBar: h,
-			windowTabs: g,
+			windowTitleBar: g,
+			windowTabs: _,
 			resizableSplitLayout: be,
 			alert: k,
 			colorPicker: I,
 			drawer: z,
-			tooltip: Oe,
+			tooltip: ke,
 			popover: _e,
 			menu: ce,
 			numberInput: he,
@@ -3477,13 +3589,13 @@ var h = s({
 			dialog: L,
 			folderPicker: V,
 			progressCircle: ye,
-			switch: Ce,
-			tabs: we,
-			timeline: De
+			switch: we,
+			tabs: Te,
+			timeline: Oe
 		}
 	}
-}), Re = n(Me, Le);
+}), Be = n(Pe, ze);
 //#endregion
-export { g as n, h as r, Re as t };
+export { _ as n, g as r, Be as t };
 
-//# sourceMappingURL=theme-Bd_a7sU8.js.map
+//# sourceMappingURL=theme-CWDvF5Yn.js.map