@ultraviolet/ui 3.24.2 → 3.25.0

package/dist/components/Data Entry/DateInput/helpersLocale.js

@@ -0,0 +1,62 @@
+import { __esmMin, __name } from "../../../_virtual/_rolldown/runtime.js";
+
+//#region src/components/Data Entry/DateInput/helpersLocale.ts
+var getLocalizedDays, getLocalizedMonths, getLocalizedShortMonths, getDays, getMonths;
+function init_helpersLocale() {
+	return (init_helpersLocale = __esmMin(() => {
+		getLocalizedDays = (locale) => {
+			const formatter = new Intl.DateTimeFormat(locale, { weekday: "long" });
+			const days = [];
+			for (let i = 0; i < 7; i += 1) {
+				const date = new Date(1970, 0, i + 4);
+				days.push(formatter.format(date));
+			}
+			return days;
+		};
+		getLocalizedMonths = (locale) => {
+			const computedLocale = typeof locale === "string" ? locale : locale.code;
+			const formatter = new Intl.DateTimeFormat(computedLocale, { month: "long" });
+			const months = [];
+			for (let i = 0; i < 12; i += 1) {
+				const date = new Date(1970, i);
+				months.push(formatter.format(date));
+			}
+			return months;
+		};
+		getLocalizedShortMonths = (locale) => {
+			const formatter = new Intl.DateTimeFormat(locale, { month: "short" });
+			const months = [];
+			for (let i = 0; i < 12; i += 1) {
+				const date = new Date(1970, i);
+				months.push(formatter.format(date));
+			}
+			return months;
+		};
+		getDays = (locale) => {
+			const computedLocale = typeof locale === "string" ? locale : locale.code;
+			const longDays = getLocalizedDays(computedLocale);
+			const days = {};
+			for (const longDay of longDays) days[longDay] = longDay.slice(0, 2);
+			const dayKeys = Object.keys(days);
+			const dayKeysShifted = dayKeys.shift();
+			if (dayKeysShifted) dayKeys.push(dayKeysShifted);
+			const orderedDaysMap = {};
+			for (const key of dayKeys) orderedDaysMap[key] = days[key];
+			return orderedDaysMap;
+		};
+		getMonths = (locale) => {
+			const computedLocale = typeof locale === "string" ? locale : locale.code;
+			const longMonths = getLocalizedMonths(locale);
+			const shortMonths = getLocalizedShortMonths(computedLocale);
+			const months = {};
+			longMonths.forEach((longMonth, index) => {
+				months[longMonth] = shortMonths[index];
+			});
+			return months;
+		};
+	}))();
+}
+
+//#endregion
+init_helpersLocale();
+export { getDays, getLocalizedMonths, getMonths, init_helpersLocale };

package/dist/components/Data Entry/DateInput/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Data Entry/DateInput/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/Data Entry/DateInput/index.js

@@ -0,0 +1,267 @@
+'use client';
+import { __esmMin, __name } from "../../../_virtual/_rolldown/runtime.js";
+import { Stack, init_Stack } from "../../Layout/Stack/index.js";
+import { Text, init_Text } from "../../Typography/Text/index.js";
+import { TextInput, init_TextInput } from "../TextInput/index.js";
+import { dateInputStyle, init_styles_css } from "./styles.css.js";
+import { Card, init_Card } from "../../Layout/Card/index.js";
+import { DateInputContext, init_Context } from "./Context.js";
+import { createDate, createDateRange, formatValue, init_helpers } from "./helpers.js";
+import { CalendarContent, init_CalendarContent } from "./components/CalendarContent.js";
+import { CalendarPopup, init_Popup } from "./components/Popup.js";
+import { getDays, getLocalizedMonths, getMonths, init_helpersLocale } from "./helpersLocale.js";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { cn } from "@ultraviolet/utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { CalendarRangeIcon } from "@ultraviolet/icons/CalendarRangeIcon";
+
+//#region src/components/Data Entry/DateInput/index.tsx
+var DateInput;
+function init_DateInput() {
+	return (init_DateInput = __esmMin(() => {
+		init_Card();
+		init_Stack();
+		init_Text();
+		init_TextInput();
+		init_CalendarContent();
+		init_Popup();
+		init_Context();
+		init_helpers();
+		init_helpersLocale();
+		init_styles_css();
+		DateInput = ({ autoFocus = false, disabled = false, error, format, label, labelDescription, locale = "en-US", maxDate, minDate, startDate, endDate, name, onBlur, onChange, placeholder, onFocus, required = false, excludeDates, value, className, id, success, helper, size = "large", readOnly = false, tooltip, clearable, selectsRange = false, showMonthYearPicker = false, input = "text", "data-testid": dataTestId, style, "aria-describedBy": ariaDescribedBy }) => {
+			const defaultMonthToShow = useMemo(() => {
+				if (value) return new Date(value).getMonth() + 1;
+				if (startDate && selectsRange) return startDate.getMonth() + 1;
+				if (endDate && selectsRange) return endDate.getMonth() + 1;
+				return (/* @__PURE__ */ new Date()).getMonth() + 1;
+			}, [
+				endDate,
+				selectsRange,
+				startDate,
+				value
+			]);
+			const defaultYearToShow = useMemo(() => {
+				if (value) return new Date(value).getFullYear();
+				if (startDate && selectsRange) return startDate.getFullYear();
+				if (endDate && selectsRange) return endDate.getFullYear();
+				return (/* @__PURE__ */ new Date()).getFullYear();
+			}, [
+				endDate,
+				selectsRange,
+				startDate,
+				value
+			]);
+			const [computedValue, setValue] = useState(value && !selectsRange ? new Date(value) : null);
+			const [computedRange, setRange] = useState({
+				end: endDate !== null && endDate !== void 0 ? endDate : null,
+				start: startDate !== null && startDate !== void 0 ? startDate : null
+			});
+			const [isPopupVisible, setVisible] = useState(false);
+			const [monthToShow, setMonthToShow] = useState(defaultMonthToShow);
+			const [yearToShow, setYearToShow] = useState(defaultYearToShow);
+			const [inputValue, setInputValue] = useState(formatValue(computedValue, computedRange, showMonthYearPicker, selectsRange, format));
+			const [hoveredDate, setHoveredDate] = useState(null);
+			const refInput = useRef(null);
+			const popupRef = useRef(null);
+			const MONTHS = getMonths(locale);
+			const DAYS = getDays(locale);
+			const MONTHS_ARR = getLocalizedMonths(locale);
+			const valueContext = useMemo(() => ({
+				DAYS,
+				disabled,
+				excludeDates,
+				format,
+				hoveredDate,
+				MONTHS,
+				MONTHS_ARR,
+				maxDate,
+				minDate,
+				monthToShow,
+				onChange,
+				range: computedRange,
+				readOnly,
+				selectsRange,
+				setHoveredDate,
+				setInputValue,
+				setMonthToShow,
+				setRange,
+				setValue,
+				setVisible,
+				setYearToShow,
+				showMonthYearPicker,
+				value: computedValue,
+				yearToShow
+			}), [
+				showMonthYearPicker,
+				disabled,
+				readOnly,
+				selectsRange,
+				computedValue,
+				computedRange,
+				monthToShow,
+				yearToShow,
+				excludeDates,
+				maxDate,
+				minDate,
+				MONTHS,
+				MONTHS_ARR,
+				DAYS,
+				onChange,
+				format,
+				setInputValue,
+				setVisible,
+				hoveredDate,
+				setHoveredDate
+			]);
+			useEffect(() => {
+				if (!selectsRange) {
+					var _formatValue;
+					setValue(value !== null && value !== void 0 ? value : null);
+					setInputValue((_formatValue = formatValue(value ? new Date(value) : null, null, showMonthYearPicker, selectsRange, format)) !== null && _formatValue !== void 0 ? _formatValue : "");
+				}
+				if (selectsRange) {
+					setRange({
+						end: endDate !== null && endDate !== void 0 ? endDate : null,
+						start: startDate !== null && startDate !== void 0 ? startDate : null
+					});
+					setInputValue(formatValue(null, {
+						start: startDate !== null && startDate !== void 0 ? startDate : null,
+						end: endDate !== null && endDate !== void 0 ? endDate : null
+					}, showMonthYearPicker, true, format));
+				}
+			}, [
+				endDate,
+				startDate,
+				value,
+				selectsRange,
+				format,
+				showMonthYearPicker
+			]);
+			const manageOnChange = (event) => {
+				const newValue = event.currentTarget.value;
+				if (!newValue) onChange === null || onChange === void 0 || onChange(selectsRange ? [null, null] : null);
+				if (selectsRange) {
+					const computedNewRange = createDateRange(newValue, showMonthYearPicker);
+					setRange({
+						end: computedNewRange[1],
+						start: computedNewRange[0]
+					});
+					setInputValue(newValue);
+					if (computedNewRange[0]) {
+						setMonthToShow(computedNewRange[0].getMonth() + 1);
+						setYearToShow(computedNewRange[0].getFullYear());
+					}
+				} else {
+					const computedDate = createDate(newValue, showMonthYearPicker, minDate, maxDate);
+					if (computedDate) {
+						setMonthToShow(computedDate.getMonth() + 1);
+						setYearToShow(computedDate.getFullYear());
+						setValue(computedDate);
+					}
+				}
+				setInputValue(newValue);
+			};
+			const onBlurInput = () => {
+				if (inputValue) {
+					if (selectsRange) {
+						const computedNewRange = createDateRange(inputValue, showMonthYearPicker);
+						onChange === null || onChange === void 0 || onChange(computedNewRange, void 0);
+					} else {
+						const computedDate = createDate(inputValue, showMonthYearPicker, minDate, maxDate);
+						onChange === null || onChange === void 0 || onChange(computedDate, void 0);
+					}
+				}
+			};
+			return /* @__PURE__ */ jsx(DateInputContext.Provider, {
+				value: valueContext,
+				children: /* @__PURE__ */ jsx("div", {
+					className: cn(className, dateInputStyle.container),
+					"data-testid": dataTestId,
+					id,
+					onBlur,
+					onClick: () => {
+						if (!isPopupVisible) setVisible(true);
+					},
+					onFocus,
+					onKeyDown: (event) => {
+						if ([" ", "Enter"].includes(event.key) && !isPopupVisible) setVisible(true);
+					},
+					ref: popupRef,
+					style,
+					children: input === "text" ? /* @__PURE__ */ jsx(CalendarPopup, {
+						content: /* @__PURE__ */ jsx(CalendarContent, {}),
+						refInput,
+						setVisible,
+						visible: isPopupVisible,
+						children: /* @__PURE__ */ jsx(TextInput, {
+							"aria-describedBy": ariaDescribedBy,
+							autoComplete: "false",
+							autoFocus,
+							clearable,
+							disabled,
+							error,
+							helper,
+							label,
+							labelDescription,
+							name,
+							onBlur: (event) => {
+								var _popupRef$current;
+								if (!((_popupRef$current = popupRef.current) === null || _popupRef$current === void 0 ? void 0 : _popupRef$current.contains(event.relatedTarget))) onBlurInput();
+							},
+							onChange: manageOnChange,
+							onKeyDown: (event) => {
+								if (event.key === "Enter") {
+									setVisible(!isPopupVisible);
+									onBlurInput();
+								}
+							},
+							placeholder,
+							readOnly,
+							ref: refInput,
+							required,
+							size,
+							success,
+							suffix: /* @__PURE__ */ jsx(CalendarRangeIcon, {
+								disabled,
+								sentiment: "neutral",
+								prominence: "weak",
+								size: "small"
+							}),
+							tooltip,
+							value: inputValue
+						})
+					}) : /* @__PURE__ */ jsxs(Stack, {
+						gap: .5,
+						children: [labelDescription ? /* @__PURE__ */ jsxs(Stack, {
+							direction: "row",
+							gap: "1",
+							children: [/* @__PURE__ */ jsx(Text, {
+								as: "label",
+								prominence: "strong",
+								sentiment: "neutral",
+								variant: "bodyStrong",
+								children: label
+							}), labelDescription]
+						}) : /* @__PURE__ */ jsx(Text, {
+							as: "label",
+							prominence: "strong",
+							sentiment: "neutral",
+							variant: "bodyStrong",
+							children: label
+						}), /* @__PURE__ */ jsx(Card, {
+							className: dateInputStyle.calendarContentWrapper({ disabled }),
+							disabled,
+							children: /* @__PURE__ */ jsx(CalendarContent, {})
+						})]
+					})
+				})
+			});
+		};
+		DateInput.displayName = "DateInput";
+	}))();
+}
+
+//#endregion
+init_DateInput();
+export { DateInput, init_DateInput };

package/dist/components/Data Entry/DateInput/styles.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../../src/components/Data Entry/DateInput/styles.css.ts"],"names":[],"mappings":"AAoCA,eAAO,MAAM,cAAc;;;;;;;;;;;;;CAO1B,CAAA"}

package/dist/components/Data Entry/DateInput/styles.css.js

@@ -0,0 +1,30 @@
+import { __esmMin } from "../../../_virtual/_rolldown/runtime.js";
+import { init_styles_css_ts_vanilla } from "./components/styles.css.ts.vanilla.js";
+import { init_styles_css_ts_vanilla as init_styles_css_ts_vanilla$1 } from "./styles.css.ts.vanilla.js";
+import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
+
+//#region src/components/Data Entry/DateInput/styles.css.ts
+var dateInputStyle;
+function init_styles_css() {
+	return (init_styles_css = __esmMin(() => {
+		/* @__PURE__ */ init_styles_css_ts_vanilla();
+		/* @__PURE__ */ init_styles_css_ts_vanilla$1();
+		dateInputStyle = {
+			container: "uv_n10pue0",
+			calendarContentWrapper: createRuntimeFn({
+				defaultClassName: "uv_n10pue1",
+				variantClassNames: { disabled: { true: "uv_n10pue2" } },
+				defaultVariants: {},
+				compoundVariants: []
+			}),
+			popup: "uv_n10pue3 uv_n10pue1",
+			capitalizedText: "uv_2bawed0",
+			capitalizedTextDay: "uv_2bawed1 uv_2bawed0",
+			dayMonth: "uv_2bawed2"
+		};
+	}))();
+}
+
+//#endregion
+init_styles_css();
+export { dateInputStyle, init_styles_css };

package/dist/components/Data Entry/DateInput/styles.css.ts.vanilla.js

@@ -0,0 +1,10 @@
+import { __esmMin } from "../../../_virtual/_rolldown/runtime.js";
+
+//#region src/components/Data Entry/DateInput/styles.css.ts.vanilla.css
+function init_styles_css_ts_vanilla() {
+	return (init_styles_css_ts_vanilla = __esmMin(() => {}))();
+}
+
+//#endregion
+init_styles_css_ts_vanilla();
+export { init_styles_css_ts_vanilla };

package/dist/components/Data Entry/FileInput/DropzoneContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropzoneContent.d.ts","sourceRoot":"","sources":["../../../../src/components/Data Entry/FileInput/DropzoneContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAG7C,eAAO,MAAM,eAAe,qDAMzB;IACD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,OAAO,CAAA;IAChB,OAAO,EAAE,MAAM,CAAA;IACf,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;IAC9B,QAAQ,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAA;CAC7C,gCAcA,CAAA"}

package/dist/components/Data Entry/FileInput/DropzoneContent.js

@@ -0,0 +1,31 @@
+import { __esmMin, __name } from "../../../_virtual/_rolldown/runtime.js";
+import { Text, init_Text } from "../../Typography/Text/index.js";
+import { fileInputStyle, init_styles_css } from "./styles.css.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { UploadIcon } from "@ultraviolet/icons/UploadIcon";
+
+//#region src/components/Data Entry/FileInput/DropzoneContent.tsx
+var DropzoneContent;
+function init_DropzoneContent() {
+	return (init_DropzoneContent = __esmMin(() => {
+		init_Text();
+		init_styles_css();
+		DropzoneContent = ({ disabled, isSmall, inputId, title, inputRef }) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(UploadIcon, {
+			disabled,
+			sentiment: isSmall ? "neutral" : "primary",
+			size: isSmall ? "small" : "xlarge"
+		}), /* @__PURE__ */ jsx(Text, {
+			as: isSmall ? "p" : "div",
+			className: isSmall ? fileInputStyle.titleSmall[disabled ? "disabled" : "default"] : void 0,
+			disabled,
+			placement: "left",
+			sentiment: "neutral",
+			variant: isSmall ? "bodySmallStrong" : "headingSmallStrong",
+			children: typeof title === "function" ? title(inputId, inputRef) : title
+		})] });
+	}))();
+}
+
+//#endregion
+init_DropzoneContent();
+export { DropzoneContent, init_DropzoneContent };

package/dist/components/Data Entry/FileInput/FileInputProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileInputProvider.d.ts","sourceRoot":"","sources":["../../../../src/components/Data Entry/FileInput/FileInputProvider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAChE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAExC,KAAK,oBAAoB,GACrB;IACE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAA;IAC5C,KAAK,EAAE,SAAS,EAAE,CAAA;IAClB,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,CAAA;IAC/C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,KAAK,IAAI,CAAA;IAC5C,KAAK,EAAE,OAAO,CAAA;CACf,GACD,SAAS,CAAA;AACb,eAAO,MAAM,gBAAgB,+CAAiD,CAAA;AAE9E,eAAO,MAAM,YAAY;eAVR,OAAO;cACR,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC;WACrC,SAAS,EAAE;cACR,QAAQ,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC;oBAC/B,CAAC,KAAK,EAAE,SAAS,EAAE,KAAK,IAAI;WACrC,OAAO;CAanB,CAAA"}

package/dist/components/Data Entry/FileInput/FileInputProvider.js

@@ -0,0 +1,19 @@
+import { __esmMin, __name } from "../../../_virtual/_rolldown/runtime.js";
+import { createContext, useContext } from "react";
+
+//#region src/components/Data Entry/FileInput/FileInputProvider.tsx
+var FileInputContext, useFileInput;
+function init_FileInputProvider() {
+	return (init_FileInputProvider = __esmMin(() => {
+		FileInputContext = createContext(void 0);
+		useFileInput = () => {
+			const context = useContext(FileInputContext);
+			if (!context) throw new Error("FileInputContext should be inside FileInput to work properly.");
+			return context;
+		};
+	}))();
+}
+
+//#endregion
+init_FileInputProvider();
+export { FileInputContext, init_FileInputProvider, useFileInput };

package/dist/components/Data Entry/FileInput/__mock__/mockFile.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mockFile.d.ts","sourceRoot":"","sources":["../../../../../src/components/Data Entry/FileInput/__mock__/mockFile.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAuBzC,eAAO,MAAM,YAAY,EAAE,SAAS,EAuCnC,CAAA"}

package/dist/components/Data Entry/FileInput/components/Button.d.ts

@@ -0,0 +1,7 @@
+import type { ComponentProps } from 'react';
+import { Button } from '../../../Action/Button';
+export declare function FileInputButton({ children, disabled, ...props }: ComponentProps<typeof Button>): import("react").JSX.Element;
+export declare namespace FileInputButton {
+    var displayName: string;
+}
+//# sourceMappingURL=Button.d.ts.map

package/dist/components/Data Entry/FileInput/components/Button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../../src/components/Data Entry/FileInput/components/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;wCAGf,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,OAAO,MAAM,CAAC"}

package/dist/components/Data Entry/FileInput/components/Button.js

@@ -0,0 +1,36 @@
+import { __esmMin, __name } from "../../../../_virtual/_rolldown/runtime.js";
+import _objectSpread2, { init_objectSpread2 } from "../../../../_virtual/_@oxc-project_runtime@0.146.0/helpers/esm/objectSpread2.js";
+import _objectWithoutProperties, { init_objectWithoutProperties } from "../../../../_virtual/_@oxc-project_runtime@0.146.0/helpers/esm/objectWithoutProperties.js";
+import { Button, init_Button as init_Button$1 } from "../../../Action/Button/index.js";
+import { init_FileInputProvider, useFileInput } from "../FileInputProvider.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/Data Entry/FileInput/components/Button.tsx
+var _excluded, FileInputButton;
+function init_Button() {
+	return (init_Button = __esmMin(() => {
+		init_Button$1();
+		init_FileInputProvider();
+		init_objectWithoutProperties();
+		init_objectSpread2();
+		_excluded = ["children", "disabled"];
+		FileInputButton = (_ref) => {
+			let { children, disabled } = _ref, props = _objectWithoutProperties(_ref, _excluded);
+			const context = useFileInput();
+			const isDisabled = disabled || context.disabled;
+			return /* @__PURE__ */ jsx(Button, _objectSpread2(_objectSpread2({}, props), {}, {
+				disabled: isDisabled,
+				onClick: () => {
+					var _context$inputRef$cur;
+					return (_context$inputRef$cur = context.inputRef.current) === null || _context$inputRef$cur === void 0 ? void 0 : _context$inputRef$cur.click();
+				},
+				children
+			}));
+		};
+		FileInputButton.displayName = "FileInput.Button";
+	}))();
+}
+
+//#endregion
+init_Button();
+export { FileInputButton, init_Button };

package/dist/components/Data Entry/FileInput/components/List.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../../../src/components/Data Entry/FileInput/components/List.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,SAAS,EAAY,MAAM,UAAU,CAAA;kCA6CzB,EAAE,KAAK,EAAE,SAAS,EAAE,UAAsB,EAAE,QAAQ,EAAE,EAAE,SAAS"}

package/dist/components/Data Entry/FileInput/components/List.js

@@ -0,0 +1,164 @@
+import { __esmMin, __name } from "../../../../_virtual/_rolldown/runtime.js";
+import { Stack, init_Stack } from "../../../Layout/Stack/index.js";
+import { Text, init_Text } from "../../../Typography/Text/index.js";
+import { Loader, init_Loader } from "../../../Feedback/Loader/index.js";
+import { Button, init_Button } from "../../../Action/Button/index.js";
+import { fileInputStyle, init_styles_css } from "../styles.css.js";
+import { init_FileInputProvider, useFileInput } from "../FileInputProvider.js";
+import { formatFileSize, getMimeTypeType, init_helpers } from "../helpers.js";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { CloseIcon } from "@ultraviolet/icons/CloseIcon";
+import { AudioIcon } from "@ultraviolet/icons/AudioIcon";
+import { DocIcon } from "@ultraviolet/icons/DocIcon";
+import { ImageIcon } from "@ultraviolet/icons/ImageIcon";
+import { VideoIcon } from "@ultraviolet/icons/VideoIcon";
+
+//#region src/components/Data Entry/FileInput/components/List.tsx
+var getIllustration, ListFiles;
+function init_List() {
+	return (init_List = __esmMin(() => {
+		init_Button();
+		init_Loader();
+		init_Stack();
+		init_Text();
+		init_FileInputProvider();
+		init_helpers();
+		init_styles_css();
+		getIllustration = (type, error, loading, file) => {
+			const state = error ? "error" : "default";
+			const sentiment = error ? "danger" : "primary";
+			if (loading) return /* @__PURE__ */ jsx("div", {
+				className: fileInputStyle.fileViewerImage[state],
+				children: /* @__PURE__ */ jsx(Loader, {
+					active: true,
+					sentiment: "primary",
+					size: "xsmall"
+				})
+			});
+			if (type === "audio") return /* @__PURE__ */ jsx("div", {
+				className: fileInputStyle.fileViewerImage[state],
+				children: /* @__PURE__ */ jsx(AudioIcon, {
+					sentiment,
+					size: "medium"
+				})
+			});
+			if (type === "video") return /* @__PURE__ */ jsx("div", {
+				className: fileInputStyle.fileViewerImage[state],
+				children: /* @__PURE__ */ jsx(VideoIcon, {
+					sentiment,
+					size: "medium"
+				})
+			});
+			if (type === "image") return !error && file ? /* @__PURE__ */ jsx("img", {
+				alt: "",
+				className: fileInputStyle.fileViewerImage.default,
+				height: "auto",
+				src: file,
+				width: "auto"
+			}) : /* @__PURE__ */ jsx("div", {
+				className: fileInputStyle.fileViewerImage[state],
+				children: /* @__PURE__ */ jsx(ImageIcon, {
+					sentiment,
+					size: "medium"
+				})
+			});
+			return /* @__PURE__ */ jsx("div", {
+				className: fileInputStyle.fileViewerImage[state],
+				children: /* @__PURE__ */ jsx(DocIcon, {
+					sentiment,
+					size: "medium"
+				})
+			});
+		};
+		ListFiles = ({ limit, textLimit, prominence = "default", onDelete }) => {
+			const [computedLimit, setLimit] = useState(limit);
+			const seeAllOnClick = () => {
+				setLimit(void 0);
+			};
+			const { files, setFiles, onChangeFiles, error } = useFileInput();
+			return files.length > 0 ? /* @__PURE__ */ jsxs(Stack, {
+				direction: "row",
+				gap: 1,
+				wrap: "wrap",
+				as: "ul",
+				className: fileInputStyle.fileListContainer,
+				children: [files.map((file, index) => {
+					if (!computedLimit || index < computedLimit) {
+						const fileType = getMimeTypeType(file.type);
+						const illustration = getIllustration(fileType, !!file.error || error, !!file.loading, file.file);
+						const sentiment = file.error ? "danger" : "neutral";
+						return /* @__PURE__ */ jsxs(Stack, {
+							"data-testid": file.name,
+							gap: .5,
+							as: "li",
+							children: [/* @__PURE__ */ jsxs(Stack, {
+								alignItems: "center",
+								className: fileInputStyle.fileViewerContainer[file.error || error ? "error" : prominence],
+								direction: "row",
+								gap: 2,
+								justifyContent: "center",
+								children: [/* @__PURE__ */ jsxs(Stack, {
+									alignItems: "center",
+									direction: "row",
+									gap: 1,
+									children: [illustration, /* @__PURE__ */ jsxs(Stack, {
+										className: fileInputStyle.fileInfo,
+										direction: "column",
+										children: [/* @__PURE__ */ jsx(Text, {
+											as: "p",
+											oneLine: true,
+											sentiment,
+											variant: "bodySmallStrong",
+											children: file.name
+										}), /* @__PURE__ */ jsx(Text, {
+											as: "p",
+											sentiment,
+											variant: "caption",
+											children: formatFileSize(file.size)
+										})]
+									})]
+								}), /* @__PURE__ */ jsx(Button, {
+									"data-testid": `remove-${file.name}`,
+									onClick: () => {
+										const newFiles = files.filter((oldFile) => file.file !== oldFile.file);
+										setFiles(newFiles);
+										onChangeFiles === null || onChangeFiles === void 0 || onChangeFiles(newFiles);
+										onDelete === null || onDelete === void 0 || onDelete(file.name);
+									},
+									sentiment,
+									size: "xsmall",
+									variant: "ghost",
+									children: /* @__PURE__ */ jsx(CloseIcon, {})
+								})]
+							}), file.error ? /* @__PURE__ */ jsx(Text, {
+								as: "p",
+								sentiment: "danger",
+								variant: "caption",
+								children: file.error
+							}) : null]
+						}, `${file.name}-${file.size}`);
+					}
+					return null;
+				}), computedLimit && files.length > computedLimit ? /* @__PURE__ */ jsxs(Button, {
+					"data-testid": "see-all",
+					onClick: seeAllOnClick,
+					sentiment: "primary",
+					size: "large",
+					variant: "ghost",
+					children: [
+						textLimit,
+						" (",
+						files.length - (limit !== null && limit !== void 0 ? limit : 0),
+						")"
+					]
+				}) : null]
+			}) : null;
+		};
+		ListFiles.displayName = "FileInput.List";
+	}))();
+}
+
+//#endregion
+init_List();
+export { ListFiles, init_List };

package/dist/components/Data Entry/FileInput/helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../src/components/Data Entry/FileInput/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEvC,eAAO,MAAM,eAAe,aAAc,MAAM,KAAG,QAEiB,CAAA;AAEpE,eAAO,MAAM,cAAc,UAAW,MAAM,KAAG,MAmB9C,CAAA;AAED,eAAO,MAAM,cAAc,SAAU,IAAI,WAAW,MAAM,YA6BzD,CAAA;AA+DD;;GAEG;AACH,eAAO,MAAM,oBAAoB,iBAAwB,YAAY,sBAUpE,CAAA"}