@datum-cloud/datum-ui 0.2.0-alpha.3 → 0.2.0-alpha.5

package/dist/styles.mjs

@@ -0,0 +1 @@
+export {  };

package/dist/switch/index.mjs

@@ -0,0 +1,4 @@
+import "../utils-Bfgoe-Gm.mjs";
+import { t as Switch } from "../switch-Calk7Gyw.mjs";
+
+export { Switch };

package/dist/switch-Calk7Gyw.mjs

@@ -0,0 +1,32 @@
+import { t as cn } from "./cn-DWCc1QRE.mjs";
+import { t as cn$1 } from "./utils-Bfgoe-Gm.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import * as SwitchPrimitive from "@radix-ui/react-switch";
+
+//#region ../shadcn/ui/switch.tsx
+function Switch$1({ className, ...props }) {
+	return /* @__PURE__ */ jsx(SwitchPrimitive.Root, {
+		"data-slot": "switch",
+		className: cn$1("peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50", className),
+		...props,
+		children: /* @__PURE__ */ jsx(SwitchPrimitive.Thumb, {
+			"data-slot": "switch-thumb",
+			className: cn$1("bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0")
+		})
+	});
+}
+
+//#endregion
+//#region src/components/base/switch/switch.tsx
+function Switch({ ref, className, ...props }) {
+	return /* @__PURE__ */ jsx(Switch$1, {
+		ref,
+		className: cn(className),
+		...props
+	});
+}
+Switch.displayName = "Switch";
+
+//#endregion
+export { Switch as t };

package/dist/table/index.mjs

@@ -0,0 +1,4 @@
+import "../utils-Bfgoe-Gm.mjs";
+import { a as TableFooter, c as TableRow, i as TableCell, n as TableBody, o as TableHead, r as TableCaption, s as TableHeader, t as Table } from "../table-CsXBcQLI.mjs";
+
+export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow };

package/dist/table-CsXBcQLI.mjs

@@ -0,0 +1,68 @@
+import { t as cn } from "./utils-Bfgoe-Gm.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region ../shadcn/ui/table.tsx
+const Table = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "table-container",
+		className: "relative w-full overflow-x-auto",
+		children: /* @__PURE__ */ jsx("table", {
+			"data-slot": "table",
+			className: cn("w-full caption-bottom text-sm", className),
+			...props
+		})
+	});
+};
+const TableHeader = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("thead", {
+		"data-slot": "table-header",
+		className: cn("[&_tr]:border-b", className),
+		...props
+	});
+};
+const TableBody = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("tbody", {
+		"data-slot": "table-body",
+		className: cn("[&_tr:last-child]:border-0", className),
+		...props
+	});
+};
+const TableFooter = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("tfoot", {
+		"data-slot": "table-footer",
+		className: cn("bg-muted/50 border-t font-medium [&>tr]:last:border-b-0", className),
+		...props
+	});
+};
+const TableRow = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("tr", {
+		"data-slot": "table-row",
+		className: cn("hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors", className),
+		...props
+	});
+};
+const TableHead = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("th", {
+		"data-slot": "table-head",
+		className: cn("text-muted-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className),
+		...props
+	});
+};
+const TableCell = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("td", {
+		"data-slot": "table-cell",
+		className: cn("p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className),
+		...props
+	});
+};
+const TableCaption = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("caption", {
+		"data-slot": "table-caption",
+		className: cn("text-muted-foreground mt-4 text-sm", className),
+		...props
+	});
+};
+
+//#endregion
+export { TableFooter as a, TableRow as c, TableCell as i, TableBody as n, TableHead as o, TableCaption as r, TableHeader as s, Table as t };

package/dist/tabs/index.mjs

@@ -0,0 +1,3 @@
+import { a as TabsTrigger, i as TabsList, n as TabsContent, r as TabsLinkTrigger, t as Tabs } from "../tabs-D8n-dqnw.mjs";
+
+export { Tabs, TabsContent, TabsLinkTrigger, TabsList, TabsTrigger };

package/dist/tabs-D8n-dqnw.mjs

@@ -0,0 +1,52 @@
+import { t as cn } from "./cn-DWCc1QRE.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+
+//#region src/components/base/tabs/tabs.tsx
+/**
+* Datum Tabs Component
+* Extends shadcn Tabs with:
+* - TabsLinkTrigger for router-agnostic link integration
+* - Dark mode customizations
+*/
+function Tabs({ className, ...props }) {
+	return /* @__PURE__ */ jsx(TabsPrimitive.Root, {
+		className: cn("flex flex-col gap-2", className),
+		...props
+	});
+}
+function TabsList({ className, ...props }) {
+	return /* @__PURE__ */ jsx(TabsPrimitive.List, {
+		className: cn("bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-1", className),
+		...props
+	});
+}
+function TabsTrigger({ className, ...props }) {
+	return /* @__PURE__ */ jsx(TabsPrimitive.Trigger, {
+		className: cn("data-[state=active]:bg-background dark:data-[state=active]:text-foreground data-[state=active]:text-foreground dark:hover:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring inline-flex flex-1 items-center justify-center gap-1.5 rounded-md px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+		...props
+	});
+}
+function TabsContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx(TabsPrimitive.Content, {
+		className: cn("flex-1 outline-none", className),
+		...props
+	});
+}
+function TabsLinkTrigger({ value, href, linkComponent: LinkComp = "a", children, className, ...props }) {
+	const linkProps = LinkComp === "a" ? { href } : { to: href };
+	return /* @__PURE__ */ jsx(TabsTrigger, {
+		value,
+		asChild: true,
+		className,
+		...props,
+		children: /* @__PURE__ */ jsx(LinkComp, {
+			...linkProps,
+			children
+		})
+	});
+}
+
+//#endregion
+export { TabsTrigger as a, TabsList as i, TabsContent as n, TabsLinkTrigger as r, Tabs as t };

package/dist/tag-input/index.mjs

@@ -0,0 +1,5 @@
+import "../utils-Bfgoe-Gm.mjs";
+import "../input-DuyjEKEW.mjs";
+import { t as TagsInput } from "../tag-input-Di7SDNbK.mjs";
+
+export { TagsInput };

package/dist/tag-input-Di7SDNbK.mjs

@@ -0,0 +1,284 @@
+import { t as cn } from "./cn-DWCc1QRE.mjs";
+import { t as Badge } from "./badge-bFgeYceE.mjs";
+import { t as Icon } from "./icon-wrapper-9ticVbRL.mjs";
+import { t as Input } from "./input-fzXBheCN.mjs";
+import { X } from "lucide-react";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { z } from "zod";
+
+//#region src/components/features/tag-input/tag-input.tsx
+/**
+* Used for identifying split characters when pasting
+* Splits on: newlines, tabs, semicolons, commas, and pipes
+* Does NOT split on dots (.) or slashes (/) to preserve email addresses and URLs
+*/
+const SPLITTER_REGEX = /[\n\t;,|]+/;
+/**
+* Used for trimming leading/trailing whitespace and special characters
+* Preserves alphanumeric characters, dots, @, hyphens, and underscores
+*/
+const FORMATTING_REGEX = /^[\s"'<>]+|[\s"'<>]+$/g;
+const TagInputContext = React.createContext(null);
+function TagsInput({ ref, value, onValueChange, placeholder, maxItems, minItems, className, dir, validator, onValidationError, error, showValidationErrors = true, name, key, ...props }) {
+	const [activeIndex, setActiveIndex] = React.useState(-1);
+	const [inputValue, setInputValue] = React.useState("");
+	const [disableInput, setDisableInput] = React.useState(false);
+	const [disableButton, setDisableButton] = React.useState(false);
+	const [isValueSelected, setIsValueSelected] = React.useState(false);
+	const [selectedValue, setSelectedValue] = React.useState("");
+	const [validationError, setValidationError] = React.useState(null);
+	const parseMinItems = minItems ?? 0;
+	const parseMaxItems = maxItems ?? Infinity;
+	const onValueChangeHandler = React.useCallback((val) => {
+		const setError = (errorMessage) => {
+			setValidationError(errorMessage);
+			if (onValidationError) onValidationError(errorMessage);
+		};
+		setError(null);
+		if (!val.trim()) return;
+		if (value.includes(val)) {
+			setError("This tag already exists");
+			return;
+		}
+		if (value.length >= parseMaxItems) {
+			setError(`Maximum of ${parseMaxItems} tags allowed`);
+			return;
+		}
+		if (validator) try {
+			validator.parse(val);
+			onValueChange([...value, val]);
+		} catch (error) {
+			if (error instanceof z.ZodError) setError(error.issues[0]?.message || "Invalid input");
+			else setError("Validation failed");
+		}
+		else onValueChange([...value, val]);
+	}, [
+		value,
+		validator,
+		parseMaxItems
+	]);
+	const RemoveValue = React.useCallback((val) => {
+		if (value.includes(val) && value.length > parseMinItems) onValueChange(value.filter((item) => item !== val));
+	}, [value]);
+	const handlePaste = React.useCallback((e) => {
+		e.preventDefault();
+		const pastedText = e.clipboardData.getData("text");
+		if (!pastedText) return;
+		const values = pastedText.split(SPLITTER_REGEX).map((val) => val.trim()).filter(Boolean).map((val) => val.replace(FORMATTING_REGEX, ""));
+		if (values.length === 0) return;
+		if (values.length === 1) {
+			onValueChangeHandler(values[0]);
+			return;
+		}
+		const validValues = [];
+		let hasError = false;
+		for (const val of values) {
+			if (value.includes(val) || validValues.includes(val)) continue;
+			if (value.length + validValues.length >= parseMaxItems) break;
+			if (validator) try {
+				validator.parse(val);
+				validValues.push(val);
+			} catch {
+				hasError = true;
+				continue;
+			}
+			else validValues.push(val);
+		}
+		if (validValues.length > 0) onValueChange([...value, ...validValues]);
+		if (hasError && validator) {
+			setValidationError("Some pasted values were invalid and skipped");
+			if (onValidationError) onValidationError("Some pasted values were invalid and skipped");
+			setTimeout(() => {
+				setValidationError(null);
+				if (onValidationError) onValidationError(null);
+			}, 3e3);
+		}
+	}, [
+		value,
+		onValueChangeHandler,
+		validator,
+		parseMaxItems,
+		onValidationError
+	]);
+	const handleSelect = React.useCallback((e) => {
+		const target = e.target;
+		const selection = inputValue.substring(target.selectionStart ?? 0, target.selectionEnd ?? 0);
+		setSelectedValue(selection);
+		setIsValueSelected(selection === inputValue);
+	}, [inputValue]);
+	React.useEffect(() => {
+		const VerifyDisable = () => {
+			if (value.length - 1 >= parseMinItems) setDisableButton(false);
+			else setDisableButton(true);
+			if (value.length + 1 <= parseMaxItems) setDisableInput(false);
+			else setDisableInput(true);
+		};
+		VerifyDisable();
+	}, [
+		value,
+		parseMinItems,
+		parseMaxItems
+	]);
+	const handleKeyDown = React.useCallback(async (e) => {
+		e.stopPropagation();
+		const moveNext = () => {
+			setActiveIndex(activeIndex + 1 > value.length - 1 ? -1 : activeIndex + 1);
+		};
+		const movePrev = () => {
+			setActiveIndex(activeIndex - 1 < 0 ? value.length - 1 : activeIndex - 1);
+		};
+		const moveCurrent = () => {
+			setActiveIndex(activeIndex - 1 <= 0 ? value.length - 1 === 0 ? -1 : 0 : activeIndex - 1);
+		};
+		const target = e.currentTarget;
+		switch (e.key) {
+			case "ArrowLeft":
+				if (dir === "rtl") {
+					if (value.length > 0 && activeIndex !== -1) moveNext();
+				} else if (value.length > 0 && target.selectionStart === 0) movePrev();
+				break;
+			case "ArrowRight":
+				if (dir === "rtl") {
+					if (value.length > 0 && target.selectionStart === 0) movePrev();
+				} else if (value.length > 0 && activeIndex !== -1) moveNext();
+				break;
+			case "Backspace":
+			case "Delete":
+				if (value.length > 0) {
+					if (activeIndex !== -1 && activeIndex < value.length) {
+						RemoveValue(value[activeIndex]);
+						moveCurrent();
+					} else if (target.selectionStart === 0) {
+						if (selectedValue === inputValue || isValueSelected) RemoveValue(value[value.length - 1]);
+					}
+				}
+				break;
+			case "Escape":
+				setActiveIndex(activeIndex === -1 ? value.length - 1 : -1);
+				break;
+			case "Enter":
+			case ",":
+				if (inputValue.trim() !== "") {
+					e.preventDefault();
+					onValueChangeHandler(inputValue);
+					setInputValue("");
+				}
+				break;
+		}
+	}, [
+		activeIndex,
+		value,
+		inputValue,
+		RemoveValue,
+		dir,
+		selectedValue,
+		isValueSelected,
+		onValueChangeHandler
+	]);
+	const mousePreventDefault = React.useCallback((e) => {
+		e.preventDefault();
+		e.stopPropagation();
+	}, []);
+	const handleChange = React.useCallback((e) => {
+		setInputValue(e.currentTarget.value);
+	}, []);
+	const handleBlur = React.useCallback((e) => {
+		const relatedTarget = e.relatedTarget;
+		if (!(relatedTarget?.tagName === "BUTTON" && (relatedTarget?.getAttribute("type") === "submit" || relatedTarget?.closest("button[type=\"submit\"]"))) && inputValue.trim() !== "") {
+			onValueChangeHandler(inputValue);
+			setInputValue("");
+		}
+	}, [inputValue, onValueChangeHandler]);
+	return /* @__PURE__ */ jsxs(TagInputContext, {
+		value: React.useMemo(() => ({
+			value,
+			onValueChange,
+			inputValue,
+			setInputValue,
+			activeIndex,
+			setActiveIndex,
+			validator,
+			validationError,
+			setValidationError
+		}), [
+			value,
+			onValueChange,
+			inputValue,
+			activeIndex,
+			validator,
+			validationError
+		]),
+		children: [/* @__PURE__ */ jsxs("div", {
+			...props,
+			ref,
+			dir,
+			className: cn("border-input-border bg-input-background/50 text-input-foreground flex min-h-10 flex-wrap items-center gap-1 overflow-hidden rounded-lg border px-3 py-2 transition-all", activeIndex === -1 ? "focus-within:border-input-focus-border focus-within:shadow-(--input-focus-shadow) focus-within:ring-0 focus-within:ring-offset-0 focus-within:outline-hidden" : "focus-within:ring-0 focus-within:ring-offset-0 focus-within:outline-hidden", className),
+			suppressHydrationWarning: true,
+			children: [
+				(showValidationErrors && validationError || error) && /* @__PURE__ */ jsx("div", {
+					className: "mb-1 w-full text-sm text-red-500",
+					children: error ? Array.isArray(error) ? error[0] : error : validationError
+				}),
+				value.map((item, index) => /* @__PURE__ */ jsxs(Badge, {
+					tabIndex: activeIndex !== -1 ? 0 : activeIndex,
+					"aria-disabled": disableButton,
+					"data-active": activeIndex === index,
+					className: cn("data-[active='true']:ring-muted-foreground relative flex items-center gap-1 truncate rounded px-1 aria-disabled:cursor-not-allowed aria-disabled:opacity-50 data-[active='true']:ring-2"),
+					type: "secondary",
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-xs",
+						children: item
+					}), /* @__PURE__ */ jsxs("button", {
+						type: "button",
+						"aria-label": `Remove ${item} option`,
+						"aria-roledescription": "button to remove option",
+						disabled: disableButton,
+						onMouseDown: mousePreventDefault,
+						onClick: () => RemoveValue(item),
+						className: "disabled:cursor-not-allowed",
+						children: [/* @__PURE__ */ jsxs("span", {
+							className: "sr-only",
+							children: [
+								"Remove",
+								item,
+								" ",
+								"option"
+							]
+						}), /* @__PURE__ */ jsx(Icon, {
+							icon: X,
+							className: "hover:stroke-destructive h-4 w-4"
+						})]
+					})]
+				}, item)),
+				/* @__PURE__ */ jsx(Input, {
+					tabIndex: 0,
+					"aria-label": "input tag",
+					disabled: disableInput,
+					onKeyDown: handleKeyDown,
+					onPaste: handlePaste,
+					onBlur: handleBlur,
+					value: inputValue,
+					onSelect: handleSelect,
+					onChange: activeIndex === -1 ? handleChange : void 0,
+					placeholder,
+					onClick: () => setActiveIndex(-1),
+					className: cn("text-input-foreground h-6 min-w-fit flex-1 border-0 bg-transparent p-0 py-1 shadow-none", "placeholder:text-input-placeholder", "focus-visible:border-transparent focus-visible:shadow-none focus-visible:ring-0 focus-visible:ring-offset-0", activeIndex !== -1 && "caret-transparent")
+				})
+			]
+		}), /* @__PURE__ */ jsxs("select", {
+			name,
+			id: props.id,
+			multiple: true,
+			value,
+			defaultValue: void 0,
+			className: "absolute top-0 left-0 h-0 w-0",
+			onChange: () => void 0,
+			children: [/* @__PURE__ */ jsx("option", { value: "" }), value.map((option, idx) => /* @__PURE__ */ jsx("option", { value: option }, `${option}-${idx}`))]
+		}, key)]
+	});
+}
+TagsInput.displayName = "TagsInput";
+
+//#endregion
+export { TagsInput as t };

package/dist/task-queue/index.mjs

@@ -0,0 +1,7 @@
+import "../utils-Bfgoe-Gm.mjs";
+import "../dialog-DXBaT9gA.mjs";
+import "../table-CsXBcQLI.mjs";
+import "../tooltip-Dd3ActSS.mjs";
+import { _ as RedisTaskStorage, a as TaskPanelItem, b as createProjectMetadata, c as TaskPanelHeader, d as useCurrentScope, f as useTasksWithLabels, g as detectStorage, h as TaskQueue, i as TaskPanel, l as getContextLabel, m as TaskQueueProvider, n as TaskSummaryDialog, o as TaskPanelCounter, p as useTaskQueue, r as TaskQueueTrigger, s as TaskPanelActions, t as TaskQueueDropdown, u as matchesCurrentScope, v as LocalTaskStorage, x as createUserMetadata, y as createOrgMetadata } from "../task-queue-dropdown-DW72ikDH.mjs";
+
+export { LocalTaskStorage, RedisTaskStorage, TaskPanel, TaskPanelActions, TaskPanelCounter, TaskPanelHeader, TaskPanelItem, TaskQueue, TaskQueueDropdown, TaskQueueProvider, TaskQueueTrigger, TaskSummaryDialog, createOrgMetadata, createProjectMetadata, createUserMetadata, detectStorage, getContextLabel, matchesCurrentScope, useCurrentScope, useTaskQueue, useTasksWithLabels };