@vizejs/fresco 0.33.0 → 0.34.0

package/dist/components/index.d.mts

@@ -0,0 +1,2 @@
+import { $ as FormProps, A as TableColumn, At as Box, B as TimerProps, C as Menu, Ct as GridProps, D as TreeNode, Dt as VStack, E as Tree, Et as StackProps, F as Tooltip, G as AlertProps, H as BadgeProps, I as TooltipPosition, J as ProgressBarProps, K as AlertType, L as TooltipProps, M as List, N as ListItem, O as TreeProps, Ot as Divider, P as ListProps, Q as FormField, R as Timer, S as TabsProps, St as Grid, T as MenuProps, Tt as Stack, U as BadgeVariant, V as Badge, W as Alert, X as SpinnerProps, Y as Spinner, Z as Form, _ as Breadcrumb, _t as CodeProps, a as KeyHintProps, at as Checkbox, b as Tab, bt as Card, c as StatusBar, ct as SelectOption, d as Modal, dt as TextAreaProps, et as Confirm, f as ModalProps, ft as TextInput, g as StepperProps, gt as Code, h as Stepper, ht as LinkProps, i as KeyHint, it as RadioOption, j as TableProps, jt as BoxProps, k as Table, kt as DividerProps, l as StatusBarItem, lt as SelectProps, m as StepStatus, mt as Link, n as AvatarProps, nt as RadioGroup, o as Header, ot as CheckboxProps, p as Step, pt as TextInputProps, q as ProgressBar, r as KeyBinding, rt as RadioGroupProps, s as HeaderProps, st as Select, t as Avatar, tt as ConfirmProps, u as StatusBarProps, ut as TextArea, v as BreadcrumbItem, vt as Text, w as MenuItem, wt as HStack, x as Tabs, xt as CardProps, y as BreadcrumbProps, yt as TextProps, z as TimerMode } from "../index-BwN1A9rE.mjs";
+export { Alert, AlertProps, AlertType, Avatar, AvatarProps, Badge, BadgeProps, BadgeVariant, Box, BoxProps, Breadcrumb, BreadcrumbItem, BreadcrumbProps, Card, CardProps, Checkbox, CheckboxProps, Code, CodeProps, Confirm, ConfirmProps, Divider, DividerProps, Form, FormField, FormProps, Grid, GridProps, HStack, Header, HeaderProps, KeyBinding, KeyHint, KeyHintProps, Link, LinkProps, List, ListItem, ListProps, Menu, MenuItem, MenuProps, Modal, ModalProps, ProgressBar, ProgressBarProps, RadioGroup, RadioGroupProps, RadioOption, Select, SelectOption, SelectProps, Spinner, SpinnerProps, Stack, StackProps, StatusBar, StatusBarItem, StatusBarProps, Step, StepStatus, Stepper, StepperProps, Tab, Table, TableColumn, TableProps, Tabs, TabsProps, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, Timer, TimerMode, TimerProps, Tooltip, TooltipPosition, TooltipProps, Tree, TreeNode, TreeProps, VStack };

package/dist/components/index.mjs

@@ -0,0 +1,3 @@
+import "../useInput-CbggNZUF.mjs";
+import { A as Grid, C as Select, D as Code, E as Link, F as Box, M as Stack, N as VStack, O as Text, P as Divider, S as Checkbox, T as TextInput, _ as ProgressBar, a as Modal, b as Confirm, c as Tabs, d as Table, f as List, g as Alert, h as Badge, i as StatusBar, j as HStack, k as Card, l as Menu, m as Timer, n as KeyHint, o as Stepper, p as Tooltip, r as Header, s as Breadcrumb, t as Avatar, u as Tree, v as Spinner, w as TextArea, x as RadioGroup, y as Form } from "../components-B5VXjX9s.mjs";
+export { Alert, Avatar, Badge, Box, Breadcrumb, Card, Checkbox, Code, Confirm, Divider, Form, Grid, HStack, Header, KeyHint, Link, List, Menu, Modal, ProgressBar, RadioGroup, Select, Spinner, Stack, StatusBar, Stepper, Table, Tabs, Text, TextArea, TextInput, Timer, Tooltip, Tree, VStack };

package/dist/{components-DtI-O8Cr.js → components-B5VXjX9s.mjs}

@@ -1,7 +1,9 @@
-import { useInput$1 as useInput } from "./useInput-CvEslk0z.js";
+import { t as useInput } from "./useInput-CbggNZUF.mjs";
 import { computed, defineComponent, h, onMounted, onUnmounted, ref, watch } from "@vue/runtime-core";
-
 //#region src/components/Box.ts
+/**
+* Box Component - Container with flexbox layout
+*/
 const Box = defineComponent({
 	name: "Box",
 	props: {
@@ -72,9 +74,11 @@ const Box = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Divider.ts
+/**
+* Divider Component - Horizontal or vertical divider line
+*/
 const Divider = defineComponent({
 	name: "Divider",
 	props: {
@@ -109,9 +113,11 @@ const Divider = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Stack.ts
+/**
+* Stack Component - Horizontal/Vertical stack layout helper
+*/
 const ALIGN_MAP = {
 	start: "flex-start",
 	center: "center",
@@ -196,9 +202,11 @@ const VStack = defineComponent({
 		}, slots.default);
 	}
 });
-
 //#endregion
 //#region src/components/Grid.ts
+/**
+* Grid Component - Grid layout helper
+*/
 const Grid = defineComponent({
 	name: "Grid",
 	props: {
@@ -244,9 +252,11 @@ const Grid = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Card.ts
+/**
+* Card Component - Container card with optional header and footer
+*/
 const Card = defineComponent({
 	name: "Card",
 	props: {
@@ -306,9 +316,11 @@ const Card = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Text.ts
+/**
+* Text Component - Text display
+*/
 const Text = defineComponent({
 	name: "Text",
 	props: {
@@ -324,12 +336,11 @@ const Text = defineComponent({
 	},
 	setup(props, { slots }) {
 		return () => {
-			const text = props.content ?? slots.default?.()?.map((vnode) => {
-				if (typeof vnode.children === "string") return vnode.children;
-				return "";
-			}).join("") ?? "";
 			return h("text", {
-				text,
+				text: props.content ?? slots.default?.()?.map((vnode) => {
+					if (typeof vnode.children === "string") return vnode.children;
+					return "";
+				}).join("") ?? "",
 				wrap: props.wrap,
 				fg: props.fg,
 				bg: props.bg,
@@ -342,10 +353,7 @@ const Text = defineComponent({
 		};
 	}
 });
-/**
-* Convenience components for common text styles
-*/
-const ErrorText = defineComponent({
+defineComponent({
 	name: "ErrorText",
 	props: { content: String },
 	setup(props, { slots }) {
@@ -355,7 +363,7 @@ const ErrorText = defineComponent({
 		}, slots);
 	}
 });
-const WarningText = defineComponent({
+defineComponent({
 	name: "WarningText",
 	props: { content: String },
 	setup(props, { slots }) {
@@ -365,7 +373,7 @@ const WarningText = defineComponent({
 		}, slots);
 	}
 });
-const SuccessText = defineComponent({
+defineComponent({
 	name: "SuccessText",
 	props: { content: String },
 	setup(props, { slots }) {
@@ -375,7 +383,7 @@ const SuccessText = defineComponent({
 		}, slots);
 	}
 });
-const InfoText = defineComponent({
+defineComponent({
 	name: "InfoText",
 	props: { content: String },
 	setup(props, { slots }) {
@@ -385,7 +393,7 @@ const InfoText = defineComponent({
 		}, slots);
 	}
 });
-const MutedText = defineComponent({
+defineComponent({
 	name: "MutedText",
 	props: { content: String },
 	setup(props, { slots }) {
@@ -395,9 +403,11 @@ const MutedText = defineComponent({
 		}, slots);
 	}
 });
-
 //#endregion
 //#region src/components/Code.ts
+/**
+* Code Component - Code block display
+*/
 const Code = defineComponent({
 	name: "Code",
 	props: {
@@ -473,9 +483,11 @@ const Code = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Link.ts
+/**
+* Link Component - Clickable/styled link
+*/
 const Link = defineComponent({
 	name: "Link",
 	props: {
@@ -509,9 +521,11 @@ const Link = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/TextInput.ts
+/**
+* TextInput Component - Text input with builtin cursor management and IME support
+*/
 const TextInput = defineComponent({
 	name: "TextInput",
 	props: {
@@ -563,18 +577,12 @@ const TextInput = defineComponent({
 		};
 		const deleteBack = () => {
 			if (cursorPos.value > 0) {
-				const before = internalValue.value.slice(0, cursorPos.value - 1);
-				const after = internalValue.value.slice(cursorPos.value);
-				updateValue(before + after);
+				updateValue(internalValue.value.slice(0, cursorPos.value - 1) + internalValue.value.slice(cursorPos.value));
 				cursorPos.value--;
 			}
 		};
 		const deleteForward = () => {
-			if (cursorPos.value < internalValue.value.length) {
-				const before = internalValue.value.slice(0, cursorPos.value);
-				const after = internalValue.value.slice(cursorPos.value + 1);
-				updateValue(before + after);
-			}
+			if (cursorPos.value < internalValue.value.length) updateValue(internalValue.value.slice(0, cursorPos.value) + internalValue.value.slice(cursorPos.value + 1));
 		};
 		const moveLeft = () => {
 			if (cursorPos.value > 0) cursorPos.value--;
@@ -588,9 +596,8 @@ const TextInput = defineComponent({
 		const moveToEnd = () => {
 			cursorPos.value = internalValue.value.length;
 		};
-		const isActive = computed(() => props.focus);
 		useInput({
-			isActive,
+			isActive: computed(() => props.focus),
 			onChar: (char) => {
 				insertText(char);
 			},
@@ -629,10 +636,7 @@ const TextInput = defineComponent({
 		};
 	}
 });
-/**
-* Password input variant
-*/
-const PasswordInput = defineComponent({
+defineComponent({
 	name: "PasswordInput",
 	props: {
 		modelValue: {
@@ -663,9 +667,11 @@ const PasswordInput = defineComponent({
 		});
 	}
 });
-
 //#endregion
 //#region src/components/TextArea.ts
+/**
+* TextArea Component - Multiline text input
+*/
 const TextArea = defineComponent({
 	name: "TextArea",
 	props: {
@@ -715,8 +721,7 @@ const TextArea = defineComponent({
 	emits: ["update:modelValue"],
 	setup(props) {
 		const lines = computed(() => {
-			const text = props.modelValue || "";
-			const textLines = text.split("\n");
+			const textLines = (props.modelValue || "").split("\n");
 			while (textLines.length < props.rows) textLines.push("");
 			return textLines.slice(0, props.rows);
 		});
@@ -755,9 +760,11 @@ const TextArea = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Select.ts
+/**
+* Select Component - Dropdown/menu selection
+*/
 const Select = defineComponent({
 	name: "Select",
 	props: {
@@ -821,9 +828,11 @@ const Select = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Checkbox.ts
+/**
+* Checkbox Component - Toggle checkbox
+*/
 const Checkbox = defineComponent({
 	name: "Checkbox",
 	props: {
@@ -858,18 +867,19 @@ const Checkbox = defineComponent({
 	setup(props, { emit: _emit }) {
 		return () => {
 			const indicator = props.modelValue ? props.checked : props.unchecked;
-			const color = props.modelValue ? props.checkedFg : props.fg;
 			return h("box", { style: { flex_direction: "row" } }, [h("text", {
-				fg: color,
+				fg: props.modelValue ? props.checkedFg : props.fg,
 				dim: props.disabled,
 				bold: props.focused
 			}, `${indicator} ${props.label ?? ""}`)]);
 		};
 	}
 });
-
 //#endregion
 //#region src/components/RadioGroup.ts
+/**
+* RadioGroup Component - Radio button group selection
+*/
 const RadioGroup = defineComponent({
 	name: "RadioGroup",
 	props: {
@@ -918,9 +928,11 @@ const RadioGroup = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Confirm.ts
+/**
+* Confirm Component - Confirmation dialog
+*/
 const Confirm = defineComponent({
 	name: "Confirm",
 	props: {
@@ -980,9 +992,11 @@ const Confirm = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Form.ts
+/**
+* Form Component - Form container with labels
+*/
 const Form = defineComponent({
 	name: "Form",
 	props: {
@@ -1060,10 +1074,12 @@ const Form = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Spinner.ts
 /**
+* Spinner Component - Loading indicator
+*/
+/**
 * Spinner frame sets
 */
 const spinnerTypes = {
@@ -1199,9 +1215,11 @@ const Spinner = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/ProgressBar.ts
+/**
+* ProgressBar Component - Progress indicator
+*/
 const ProgressBar = defineComponent({
 	name: "ProgressBar",
 	props: {
@@ -1272,7 +1290,6 @@ const ProgressBar = defineComponent({
 					flexDirection: "row",
 					gap: 1
 				}, () => [...barContent, labelElement]);
-				case "right":
 				default: return h(Box, {
 					flexDirection: "row",
 					gap: 1
@@ -1281,10 +1298,7 @@ const ProgressBar = defineComponent({
 		};
 	}
 });
-/**
-* Indeterminate progress bar (animated)
-*/
-const IndeterminateProgressBar = defineComponent({
+defineComponent({
 	name: "IndeterminateProgressBar",
 	props: {
 		width: {
@@ -1298,15 +1312,16 @@ const IndeterminateProgressBar = defineComponent({
 	},
 	setup(props) {
 		return () => {
-			const pattern = "▓▒░░░░░░░░░░░░░░░░░░";
-			const display = pattern.slice(0, props.width);
+			const display = "▓▒░░░░░░░░░░░░░░░░░░".slice(0, props.width);
 			return h(Text, { fg: props.fg }, () => display);
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Alert.ts
+/**
+* Alert Component - Alert/notification box
+*/
 const ALERT_CONFIG = {
 	info: {
 		icon: "ℹ",
@@ -1380,9 +1395,11 @@ const Alert = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Badge.ts
+/**
+* Badge Component - Status badge/tag
+*/
 const VARIANT_COLORS = {
 	default: { fg: "white" },
 	success: { fg: "green" },
@@ -1433,9 +1450,11 @@ const Badge = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Timer.ts
+/**
+* Timer Component - Countdown/stopwatch timer
+*/
 const Timer = defineComponent({
 	name: "Timer",
 	props: {
@@ -1549,9 +1568,11 @@ const Timer = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Tooltip.ts
+/**
+* Tooltip Component - Tooltip overlay
+*/
 const Tooltip = defineComponent({
 	name: "Tooltip",
 	props: {
@@ -1614,9 +1635,11 @@ const Tooltip = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/List.ts
+/**
+* List Component - Scrollable list of items
+*/
 const List = defineComponent({
 	name: "List",
 	props: {
@@ -1672,8 +1695,7 @@ const List = defineComponent({
 				dim: true
 			}, "  ..."));
 			visibleItems.value.forEach((item, visibleIndex) => {
-				const actualIndex = scrollOffset.value + visibleIndex;
-				const isHighlighted = actualIndex === highlightedIndex.value;
+				const isHighlighted = scrollOffset.value + visibleIndex === highlightedIndex.value;
 				const isSelected = item.key === props.modelValue;
 				const indicator = isHighlighted ? props.indicator : props.indicatorEmpty;
 				children.push(h("text", {
@@ -1695,9 +1717,11 @@ const List = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Table.ts
+/**
+* Table Component - Display tabular data
+*/
 const Table = defineComponent({
 	name: "Table",
 	props: {
@@ -1754,8 +1778,7 @@ const Table = defineComponent({
 				if (props.border !== "none") {
 					const sepChar = props.border === "double" ? "=" : "-";
 					const totalWidth = props.columns.reduce((acc, col) => {
-						const w = typeof col.width === "number" ? col.width : 10;
-						return acc + w + (props.cellPadding ?? 1);
+						return acc + (typeof col.width === "number" ? col.width : 10) + (props.cellPadding ?? 1);
 					}, 0);
 					rows.push(h("text", {
 						key: "separator",
@@ -1784,9 +1807,11 @@ const Table = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Tree.ts
+/**
+* Tree Component - Tree view for hierarchical data
+*/
 const Tree = defineComponent({
 	name: "Tree",
 	props: {
@@ -1862,9 +1887,11 @@ const Tree = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Menu.ts
+/**
+* Menu Component - Command menu/palette
+*/
 const Menu = defineComponent({
 	name: "Menu",
 	props: {
@@ -1942,9 +1969,11 @@ const Menu = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Tabs.ts
+/**
+* Tabs Component - Tab navigation
+*/
 const Tabs = defineComponent({
 	name: "Tabs",
 	props: {
@@ -2003,17 +2032,18 @@ const Tabs = defineComponent({
 				key: "content",
 				style: { flex_grow: 1 }
 			}, slots.default?.());
-			const children = props.position === "top" ? [tabBar, content] : [content, tabBar];
 			return h("box", { style: {
 				flex_direction: "column",
 				flex_grow: 1
-			} }, children);
+			} }, props.position === "top" ? [tabBar, content] : [content, tabBar]);
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Breadcrumb.ts
+/**
+* Breadcrumb Component - Navigation breadcrumb
+*/
 const Breadcrumb = defineComponent({
 	name: "Breadcrumb",
 	props: {
@@ -2041,7 +2071,7 @@ const Breadcrumb = defineComponent({
 	emits: ["select"],
 	setup(props, { emit: _emit }) {
 		return () => {
-			const children = props.items.flatMap((item, index) => {
+			return h("box", { style: { flex_direction: "row" } }, props.items.flatMap((item, index) => {
 				const isLast = index === props.items.length - 1;
 				const result = [];
 				if (item.icon) result.push(h("text", {
@@ -2059,14 +2089,15 @@ const Breadcrumb = defineComponent({
 					fg: props.separatorFg
 				}, props.separator));
 				return result;
-			});
-			return h("box", { style: { flex_direction: "row" } }, children);
+			}));
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Stepper.ts
+/**
+* Stepper Component - Step indicator for wizards
+*/
 const Stepper = defineComponent({
 	name: "Stepper",
 	props: {
@@ -2178,9 +2209,11 @@ const Stepper = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Modal.ts
+/**
+* Modal Component - Overlay dialog
+*/
 const Modal = defineComponent({
 	name: "Modal",
 	props: {
@@ -2247,9 +2280,11 @@ const Modal = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/StatusBar.ts
+/**
+* StatusBar Component - Status bar (typically at bottom of screen)
+*/
 const StatusBar = defineComponent({
 	name: "StatusBar",
 	props: {
@@ -2311,9 +2346,11 @@ const StatusBar = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Header.ts
+/**
+* Header Component - Application header
+*/
 const Header = defineComponent({
 	name: "Header",
 	props: {
@@ -2382,9 +2419,11 @@ const Header = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/KeyHint.ts
+/**
+* KeyHint Component - Display keyboard shortcut hints
+*/
 const KeyHint = defineComponent({
 	name: "KeyHint",
 	props: {
@@ -2441,9 +2480,11 @@ const KeyHint = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/Avatar.ts
+/**
+* Avatar Component - User avatar display
+*/
 const STATUS_COLORS = {
 	online: "green",
 	offline: "gray",
@@ -2515,7 +2556,7 @@ const Avatar = defineComponent({
 		};
 	}
 });
-
 //#endregion
-export { Alert, Avatar, Badge, Box, Breadcrumb, Card, Checkbox, Code, Confirm, Divider, Form, Grid, HStack, Header, KeyHint, Link, List, Menu, Modal, ProgressBar, RadioGroup, Select, Spinner, Stack, StatusBar, Stepper, Table, Tabs, Text, TextArea, TextInput, Timer, Tooltip, Tree, VStack };
-//# sourceMappingURL=components-DtI-O8Cr.js.map
+export { Grid as A, Select as C, Code as D, Link as E, Box as F, Stack as M, VStack as N, Text as O, Divider as P, Checkbox as S, TextInput as T, ProgressBar as _, Modal as a, Confirm as b, Tabs as c, Table as d, List as f, Alert as g, Badge as h, StatusBar as i, HStack as j, Card as k, Menu as l, Timer as m, KeyHint as n, Stepper as o, Tooltip as p, Header as r, Breadcrumb as s, Avatar as t, Tree as u, Spinner as v, TextArea as w, RadioGroup as x, Form as y };
+
+//# sourceMappingURL=components-B5VXjX9s.mjs.map