@ikatec/nebula-react 1.0.15 → 1.0.17

package/dist/index.js

@@ -1150,16 +1150,23 @@ var messages4 = {
 };
 var time_picker_default = messages4;
 
+// src/i18n/messages/en/file-upload.ts
+var messages5 = {
+  deleteAll: "Remove all"
+};
+var file_upload_default = messages5;
+
 // src/i18n/messages/en/index.ts
 var enMessages = {
   pagination: pagination_default,
   inputSelect: input_select_default,
   inputPhone: input_phone_default,
-  timePicker: time_picker_default
+  timePicker: time_picker_default,
+  fileUpload: file_upload_default
 };
 
 // src/i18n/messages/es/pagination.ts
-var messages5 = {
+var messages6 = {
   totalResultsLabel(pagesSize, totalResults) {
     if (totalResults < pagesSize) {
       pagesSize = totalResults;
@@ -1170,16 +1177,16 @@ var messages5 = {
     return `P\xE1gina ${currentPage} de ${totalPages}`;
   }
 };
-var pagination_default2 = messages5;
+var pagination_default2 = messages6;
 
 // src/i18n/messages/es/input-select.ts
-var messages6 = {
+var messages7 = {
   noOptions: "No hay opciones disponibles"
 };
-var input_select_default2 = messages6;
+var input_select_default2 = messages7;
 
 // src/i18n/messages/es/input-phone.ts
-var messages7 = {
+var messages8 = {
   countries: {
     empty: "Seleccionar",
     AF: "Afganist\xE1n",
@@ -1429,24 +1436,31 @@ var messages7 = {
     ZW: "Zimbabue"
   }
 };
-var input_phone_default2 = messages7;
+var input_phone_default2 = messages8;
 
 // src/i18n/messages/es/time-picker.ts
-var messages8 = {
+var messages9 = {
   label: "Tiempo"
 };
-var time_picker_default2 = messages8;
+var time_picker_default2 = messages9;
+
+// src/i18n/messages/es/file-upload.ts
+var messages10 = {
+  deleteAll: "Remover todos"
+};
+var file_upload_default2 = messages10;
 
 // src/i18n/messages/es/index.ts
 var esMessages = {
   pagination: pagination_default2,
   inputSelect: input_select_default2,
   inputPhone: input_phone_default2,
-  timePicker: time_picker_default2
+  timePicker: time_picker_default2,
+  fileUpload: file_upload_default2
 };
 
 // src/i18n/messages/pt-br/pagination.ts
-var messages9 = {
+var messages11 = {
   totalResultsLabel(pagesSize, totalResults) {
     if (totalResults < pagesSize) {
       pagesSize = totalResults;
@@ -1457,16 +1471,16 @@ var messages9 = {
     return `P\xE1gina ${currentPage} de ${totalPages}`;
   }
 };
-var pagination_default3 = messages9;
+var pagination_default3 = messages11;
 
 // src/i18n/messages/pt-br/input-select.ts
-var messages10 = {
+var messages12 = {
   noOptions: "Nenhuma op\xE7\xE3o dispon\xEDvel"
 };
-var input_select_default3 = messages10;
+var input_select_default3 = messages12;
 
 // src/i18n/messages/pt-br/input-phone.ts
-var messages11 = {
+var messages13 = {
   countries: {
     empty: "Selecione",
     AF: "Afeganist\xE3o",
@@ -1716,20 +1730,27 @@ var messages11 = {
     ZW: "Zimb\xE1bue"
   }
 };
-var input_phone_default3 = messages11;
+var input_phone_default3 = messages13;
 
 // src/i18n/messages/pt-br/time-picker.ts
-var messages12 = {
+var messages14 = {
   label: "Hor\xE1rio"
 };
-var time_picker_default3 = messages12;
+var time_picker_default3 = messages14;
+
+// src/i18n/messages/pt-br/file-upload.ts
+var messages15 = {
+  deleteAll: "Remover todos"
+};
+var file_upload_default3 = messages15;
 
 // src/i18n/messages/pt-br/index.ts
 var ptBrMessages = {
   pagination: pagination_default3,
   inputSelect: input_select_default3,
   inputPhone: input_phone_default3,
-  timePicker: time_picker_default3
+  timePicker: time_picker_default3,
+  fileUpload: file_upload_default3
 };
 
 // src/i18n/message-storage-handler.ts
@@ -1754,7 +1775,7 @@ var setNebulaLanguage = (language) => {
   }
   localStorage.setItem(getNebulaI18nStorageKey(), language);
 };
-var messages13 = /* @__PURE__ */ new Map([
+var messages16 = /* @__PURE__ */ new Map([
   [null, enMessages],
   [void 0, enMessages],
   ["en-US", enMessages],
@@ -1772,14 +1793,14 @@ var NebulaI18nProvider = ({
     () => customI18nStorageKey ?? localStorageKey,
     [customI18nStorageKey]
   );
-  const [messages14, setMessages] = React8.useState(
-    messages13.get(getNebulaLanguage()) ?? messages13.get("en-US")
+  const [messages17, setMessages] = React8.useState(
+    messages16.get(getNebulaLanguage()) ?? messages16.get("en-US")
   );
   const handleStorageChange = React8.useCallback(
     ({ detail }) => {
       if (detail.key === storageKey) {
         setMessages(
-          messages13.get(detail.value) ?? messages13.get("en-US")
+          messages16.get(detail.value) ?? messages16.get("en-US")
         );
       }
     },
@@ -1823,7 +1844,7 @@ var NebulaI18nProvider = ({
     NebulaI18nContext.Provider,
     {
       value: {
-        messages: messages14,
+        messages: messages17,
         locale: getNebulaLanguage()
       },
       children
@@ -1845,7 +1866,7 @@ var Pagination = ({
   onChangePage,
   ...props
 }) => {
-  const { messages: messages14 } = useNebulaI18n();
+  const { messages: messages17 } = useNebulaI18n();
   const totalPages = React8.useMemo(() => {
     return Math.ceil(total / (pageSize || 1));
   }, [total, pageSize]);
@@ -1878,13 +1899,13 @@ var Pagination = ({
   }, [totalPages, pageSize, total]);
   const totalResultsLabel = React8.useMemo(() => {
     if (page === totalPages) {
-      return messages14.pagination.totalResultsLabel(lastPageSize, total);
+      return messages17.pagination.totalResultsLabel(lastPageSize, total);
     }
-    return messages14.pagination.totalResultsLabel(pageSize, total);
-  }, [messages14.pagination, pageSize, total, page, totalPages, lastPageSize]);
+    return messages17.pagination.totalResultsLabel(pageSize, total);
+  }, [messages17.pagination, pageSize, total, page, totalPages, lastPageSize]);
   const currentPageLabel = React8.useMemo(
-    () => messages14.pagination.currentPageLabel(normalizedPage, totalPages),
-    [messages14.pagination, normalizedPage, totalPages]
+    () => messages17.pagination.currentPageLabel(normalizedPage, totalPages),
+    [messages17.pagination, normalizedPage, totalPages]
   );
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "nav",
@@ -2157,7 +2178,7 @@ var createStyledSelect = (BaseSelect, displayName) => {
     isError = false,
     ...props
   }) => {
-    const { messages: messages14 } = useNebulaI18n();
+    const { messages: messages17 } = useNebulaI18n();
     const customClassNames = React8.useMemo(() => {
       return {
         control: (props2) => controlStyles(props2, isError),
@@ -2204,7 +2225,7 @@ var createStyledSelect = (BaseSelect, displayName) => {
         isDisabled: disabled,
         components: customComponents,
         classNames: customClassNames,
-        noOptionsMessage: () => /* @__PURE__ */ jsxRuntime.jsx("p", { children: messages14.inputSelect.noOptions }),
+        noOptionsMessage: () => /* @__PURE__ */ jsxRuntime.jsx("p", { children: messages17.inputSelect.noOptions }),
         ...props
       }
     );
@@ -3207,13 +3228,13 @@ function custom(message, options) {
     }
   );
 }
-async function promise(promise2, messages14, options) {
+async function promise(promise2, messages17, options) {
   const loadingToast = sonner.toast.custom(
     (t) => /* @__PURE__ */ jsxRuntime.jsx(
       ToastComponent,
       {
         type: "info",
-        message: messages14.loading,
+        message: messages17.loading,
         options,
         t
       }
@@ -3227,7 +3248,7 @@ async function promise(promise2, messages14, options) {
         ToastComponent,
         {
           type: "success",
-          message: messages14.success,
+          message: messages17.success,
           options,
           t
         }
@@ -3242,7 +3263,7 @@ async function promise(promise2, messages14, options) {
         ToastComponent,
         {
           type: "error",
-          message: messages14.error,
+          message: messages17.error,
           options,
           t
         }
@@ -3412,8 +3433,8 @@ var CountrySelect = ({
   const handleSelect = (event) => {
     onChange(event.target.value);
   };
-  const { messages: messages14 } = useNebulaI18n();
-  const { countries } = messages14.inputPhone;
+  const { messages: messages17 } = useNebulaI18n();
+  const { countries } = messages17.inputPhone;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "nebula-ds rounded-s-[20px] relative inline-flex items-center self-stretch py-2 ps-4 pe-2 transition-[color,box-shadow] outline-none has-disabled:pointer-events-none has-disabled:opacity-50", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "nebula-ds inline-flex items-center gap-1", "aria-hidden": "true", children: [
       /* @__PURE__ */ jsxRuntime.jsx(FlagComponent, { country: value, countryName: value, "aria-hidden": "true" }),
@@ -3625,6 +3646,7 @@ var Calendar = ({
           outside,
           today,
           selected,
+          disabled,
           range_middle: rangeMiddle,
           range_end: rangeEnd,
           range_start: rangeStart
@@ -3634,11 +3656,16 @@ var Calendar = ({
           {
             ...props2,
             tabIndex: 0,
-            className: cn(props2.className, "!w-9 !h-9", {
-              "!text-calendar-day-color": !outside,
-              "!text-calendar-outsideDay-color !opacity-1": outside,
-              "!bg-calendar-daySelected-background !border-calendar-daySelected-background !text-calendar-daySelected-color rounded-full": (selected || rangeEnd || rangeStart) && !rangeMiddle
-            }),
+            className: cn(
+              props2.className,
+              "!w-9 !h-9 hover:bg-button-ghost-background-hover hover:rounded-full",
+              {
+                "!text-calendar-day-color": !outside,
+                "!text-calendar-outsideDay-color !opacity-1": outside,
+                "!bg-calendar-daySelected-background !border-calendar-daySelected-background !text-calendar-daySelected-color rounded-full": (selected || rangeEnd || rangeStart) && !rangeMiddle,
+                "!text-neutral-200 dark:!text-neutral-900 pointer-events-none cursor-not-allowed": disabled
+              }
+            ),
             children: /* @__PURE__ */ jsxRuntime.jsxs(
               "div",
               {
@@ -3664,7 +3691,7 @@ var Calendar = ({
       MonthCaption({ calendarMonth, displayIndex, ...rest }) {
         const handleNextMonth = () => {
           const newMonth = dateFns.addMonths(
-            calendarMonth.date,
+            currentMonth,
             props.pagedNavigation || numberOfMonths === 1 ? 1 : 0
           );
           if (typeof month !== "undefined") {
@@ -3675,7 +3702,7 @@ var Calendar = ({
         };
         const handlePreviousMonth = () => {
           const newMonth = dateFns.addMonths(
-            calendarMonth.date,
+            currentMonth,
             props.pagedNavigation ? -2 : -1
           );
           if (typeof month !== "undefined") {
@@ -3690,8 +3717,9 @@ var Calendar = ({
         return /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
-            className: cn("flex justify-between items-center !h-9", {
-              "ps-3": numberOfMonths === 1
+            className: cn("flex justify-between items-center !h-9 mb-3", {
+              "ps-3": numberOfMonths === 1,
+              "mb-0": showMonthGridSelection
             }),
             children: [
               !hideNavigation && numberOfMonths > 1 && /* @__PURE__ */ jsxRuntime.jsx(
@@ -3874,7 +3902,7 @@ var Calendar = ({
           mode: "single",
           animate: false,
           ...props,
-          month: month ?? selectedMonth,
+          month: currentMonth,
           hideNavigation: true,
           numberOfMonths: Math.min(Math.max(numberOfMonths, 1), 2),
           components: components2,
@@ -3897,6 +3925,52 @@ function timeFormatIsValid(timeStr) {
   const regex = /^(?:[01]\d|2[0-3]):[0-5]\d$/;
   return regex.test(timeStr);
 }
+var dateIsAvailable = (inputDate, disabledDates) => {
+  if (!disabledDates || !inputDate) return true;
+  const dateIsDisabled = (d, matcher) => {
+    if (Array.isArray(matcher)) {
+      return matcher.some((date) => dateFns.isSameDay(date, d));
+    }
+    if (typeof matcher === "boolean") return matcher;
+    if (typeof matcher === "function") {
+      return matcher(d);
+    }
+    if ("from" in matcher) {
+      const { from, to } = matcher;
+      if (!from) return false;
+      if (from && to) {
+        return dateFns.isBefore(d, to) && dateFns.isAfter(d, from) || dateFns.isSameDay(d, from) || dateFns.isSameDay(d, to);
+      }
+      return dateFns.isSameDay(d, from);
+    }
+    if ("before" in matcher && !("after" in matcher)) {
+      const { before } = matcher;
+      return dateFns.isBefore(d, before) && !dateFns.isSameDay(d, before);
+    }
+    if ("after" in matcher && !("before" in matcher)) {
+      const { after } = matcher;
+      return dateFns.isAfter(d, after) && !dateFns.isSameDay(d, after);
+    }
+    if ("after" in matcher && "before" in matcher) {
+      const { after, before } = matcher;
+      return dateFns.isAfter(d, after) && !dateFns.isSameDay(d, after) || dateFns.isBefore(d, before) && !dateFns.isSameDay(d, before);
+    }
+    if ("dayOfWeek" in matcher) {
+      const { dayOfWeek } = matcher;
+      if (Array.isArray(dayOfWeek)) {
+        return dayOfWeek.includes(d.getDay());
+      }
+      return dayOfWeek === d.getDay();
+    }
+    return dateFns.isSameDay(d, matcher);
+  };
+  if (Array.isArray(disabledDates)) {
+    return disabledDates.every((matcher) => {
+      return dateIsDisabled(inputDate, matcher) === false;
+    });
+  }
+  return !dateIsDisabled(inputDate, disabledDates);
+};
 var InputDatePickerSingle = ({
   portal,
   placeholder,
@@ -3905,6 +3979,7 @@ var InputDatePickerSingle = ({
   onChange,
   numberOfMonths = 1,
   onClean,
+  disabledDates,
   ...rest
 }) => {
   const [popoverIsOpen, setPopoverIsOpen] = React8.useState(false);
@@ -3919,8 +3994,8 @@ var InputDatePickerSingle = ({
   };
   const handleInnerInputChange = (text) => {
     const dateSlice = text.substring(0, 10).trim();
-    onChange?.(text);
     if (!text) {
+      onChange?.(text);
       handleClearValue();
       return;
     }
@@ -3929,15 +4004,13 @@ var InputDatePickerSingle = ({
       locale === "en-US" ? dateSlice.substring(0, 2) : dateSlice.substring(3, 5),
       dateSlice.substring(6)
     ];
-    if ([day, month2, year].some((value2) => !value2) || !dateFormatIsValid(dateSlice, locale)) {
-      handleClearValue();
-      return;
-    }
     const date = new Date(Number(year), Number(month2) - 1, Number(day));
-    if (!dateFns.isValid(new Date(date))) {
+    if ([day, month2, year].some((value2) => !value2) || !dateFormatIsValid(dateSlice, locale) || !dateFns.isValid(new Date(date)) || !dateIsAvailable(date, disabledDates)) {
+      onChange?.(text);
       handleClearValue();
       return;
     }
+    onChange?.(text, date);
     setInnerDate(date);
   };
   const handleKeyDown = (e) => {
@@ -3963,7 +4036,7 @@ var InputDatePickerSingle = ({
       day: "2-digit"
     }).format(date);
     setInnerDate(date);
-    onChange?.(dateToStr);
+    onChange?.(dateToStr, date);
   };
   const normalizedCalendarDate = React8.useMemo(() => {
     return dateFns.isValid(innerDate) ? innerDate : void 0;
@@ -4032,7 +4105,8 @@ var InputDatePickerSingle = ({
             onSelect: handleCalendarSelect,
             month,
             onPrevClick: setMonth,
-            onNextClick: setMonth
+            onNextClick: setMonth,
+            disabled: disabledDates
           }
         )
       }
@@ -4113,6 +4187,7 @@ var InputDateTimePickerSingle = ({
   onChange,
   numberOfMonths = 1,
   onClean,
+  disabledDates,
   ...rest
 }) => {
   const [popoverIsOpen, setPopoverIsOpen] = React8.useState(false);
@@ -4120,7 +4195,7 @@ var InputDateTimePickerSingle = ({
   const [innerDate, setInnerDate] = React8.useState(
     value ? new Date(value) : void 0
   );
-  const { locale, messages: messages14 } = useNebulaI18n();
+  const { locale, messages: messages17 } = useNebulaI18n();
   const [month, setMonth] = React8.useState(/* @__PURE__ */ new Date());
   const inputTimeRef = React8.useRef(null);
   const handleClearValue = () => {
@@ -4130,9 +4205,9 @@ var InputDateTimePickerSingle = ({
   };
   const handleInnerInputChange = (text) => {
     const dateSlice = text.substring(0, 11).trim();
-    const hourSlice = text.substring(11).trim();
-    onChange?.(text);
+    let hourSlice = text.substring(11).trim();
     if (!text) {
+      onChange?.(text);
       handleClearValue();
       return;
     }
@@ -4141,20 +4216,19 @@ var InputDateTimePickerSingle = ({
       locale === "en-US" ? dateSlice.substring(0, 2) : dateSlice.substring(3, 5),
       dateSlice.substring(6)
     ];
-    if ([day, month2, year].some((value2) => !value2) || !dateFormatIsValid(dateSlice, locale)) {
+    const date = new Date(Number(year), Number(month2) - 1, Number(day));
+    if ([day, month2, year].some((value2) => !value2) || !dateFormatIsValid(dateSlice, locale) || !dateFns.isValid(new Date(date)) || !dateIsAvailable(date, disabledDates)) {
+      onChange?.(text);
       handleClearValue();
       return;
     }
     if (!timeFormatIsValid(hourSlice)) {
+      hourSlice = "";
       setInnerTimeValue("");
     } else {
       setInnerTimeValue(hourSlice);
     }
-    const date = new Date(Number(year), Number(month2) - 1, Number(day));
-    if (!dateFns.isValid(new Date(date))) {
-      handleClearValue();
-      return;
-    }
+    onChange?.(text, date, hourSlice);
     setInnerDate(date);
   };
   const handleOnChangeTime = (newTime) => {
@@ -4163,7 +4237,7 @@ var InputDateTimePickerSingle = ({
     if (date && !dateFormatIsValid(date, locale)) {
       handleClearValue();
     }
-    onChange?.(date + " " + newTime);
+    onChange?.(date + " " + newTime, innerDate, newTime);
   };
   const handleKeyDown = (e) => {
     if ((e.altKey || e.ctrlKey || e.metaKey) && e.key !== "z") return;
@@ -4190,7 +4264,11 @@ var InputDateTimePickerSingle = ({
       day: "2-digit"
     }).format(date);
     setInnerDate(date);
-    onChange?.([dateToStr, innerTimeValue].filter(Boolean).join(" "));
+    onChange?.(
+      [dateToStr, innerTimeValue].filter(Boolean).join(" "),
+      date,
+      innerTimeValue
+    );
     if (!innerTimeValue) {
       setTimeout(() => inputTimeRef.current?.focus(), 100);
     }
@@ -4263,9 +4341,10 @@ var InputDateTimePickerSingle = ({
             month,
             onPrevClick: setMonth,
             onNextClick: setMonth,
+            disabled: disabledDates,
             footer: /* @__PURE__ */ jsxRuntime.jsxs(Space, { className: "nebula-ds items-center", children: [
               /* @__PURE__ */ jsxRuntime.jsxs(Label, { children: [
-                messages14.timePicker.label,
+                messages17.timePicker.label,
                 ":"
               ] }),
               /* @__PURE__ */ jsxRuntime.jsx(
@@ -4274,7 +4353,8 @@ var InputDateTimePickerSingle = ({
                   placeholder: "00:00",
                   value: innerTimeValue,
                   onChange: handleOnChangeTime,
-                  ref: inputTimeRef
+                  ref: inputTimeRef,
+                  className: "nebula-ds max-w-[188px]"
                 }
               )
             ] })
@@ -4284,6 +4364,521 @@ var InputDateTimePickerSingle = ({
     )
   ] });
 };
+var FileUploadError = /* @__PURE__ */ ((FileUploadError2) => {
+  FileUploadError2["MAX_FILES_EXCEEDED"] = "MAX_FILES_EXCEEDED";
+  FileUploadError2["MAXIMUM_FILE_SIZE_EXCEEDED"] = "MAXIMUM_FILE_SIZE_EXCEEDED";
+  FileUploadError2["INVALID_FORMAT"] = "INVALID_FORMAT";
+  return FileUploadError2;
+})(FileUploadError || {});
+var useFileUpload = (options = {}) => {
+  const {
+    maxFiles = Infinity,
+    maxSize = Infinity,
+    accept = "*",
+    multiple = false,
+    initialFiles = [],
+    onFilesChange,
+    onFilesAdded
+  } = options;
+  const [state, setState] = React8.useState({
+    files: initialFiles.map((file) => ({
+      file,
+      id: file.id,
+      preview: file.url
+    })),
+    isDragging: false,
+    errors: []
+  });
+  const inputRef = React8.useRef(null);
+  const validateFile = React8.useCallback(
+    (file) => {
+      if (file instanceof File) {
+        if (file.size > maxSize) {
+          return {
+            file,
+            error: "MAXIMUM_FILE_SIZE_EXCEEDED" /* MAXIMUM_FILE_SIZE_EXCEEDED */
+          };
+        }
+      } else {
+        if (file.size > maxSize) {
+          return { error: "MAXIMUM_FILE_SIZE_EXCEEDED" /* MAXIMUM_FILE_SIZE_EXCEEDED */, file };
+        }
+      }
+      if (accept !== "*") {
+        const acceptedTypes = accept.split(",").map((type) => type.trim());
+        const fileType = file instanceof File ? file.type || "" : file.type;
+        const fileExtension = `.${file instanceof File ? file.name.split(".").pop() : file.name.split(".").pop()}`;
+        const isAccepted = acceptedTypes.some((type) => {
+          if (type.startsWith(".")) {
+            return fileExtension.toLowerCase() === type.toLowerCase();
+          }
+          if (type.endsWith("/*")) {
+            const baseType = type.split("/")[0];
+            return fileType.startsWith(`${baseType}/`);
+          }
+          return fileType === type;
+        });
+        if (!isAccepted) {
+          return {
+            file,
+            error: "INVALID_FORMAT" /* INVALID_FORMAT */
+          };
+        }
+      }
+      return null;
+    },
+    [accept, maxSize]
+  );
+  const createPreview = React8.useCallback(
+    (file) => {
+      if (file instanceof File) {
+        return URL.createObjectURL(file);
+      }
+      return file.url;
+    },
+    []
+  );
+  const generateUniqueId = React8.useCallback((file) => {
+    if (file instanceof File) {
+      return `${file.name}-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
+    }
+    return file.id;
+  }, []);
+  const clearFiles = React8.useCallback(() => {
+    setState((prev) => {
+      prev.files.forEach((file) => {
+        if (file.preview && file.file instanceof File && file.file.type.startsWith("image/")) {
+          URL.revokeObjectURL(file.preview);
+        }
+      });
+      if (inputRef.current) {
+        inputRef.current.value = "";
+      }
+      const newState = {
+        ...prev,
+        files: [],
+        errors: []
+      };
+      onFilesChange?.(newState.files);
+      return newState;
+    });
+  }, [onFilesChange]);
+  const addFiles = React8.useCallback(
+    (newFiles) => {
+      if (!newFiles || newFiles.length === 0) return;
+      const newFilesArray = Array.from(newFiles);
+      const errors = [];
+      setState((prev) => ({ ...prev, errors: [] }));
+      if (!multiple) {
+        clearFiles();
+      }
+      if (multiple && maxFiles !== Infinity && state.files.length + newFilesArray.length > maxFiles) {
+        errors.push({ error: "MAX_FILES_EXCEEDED" /* MAX_FILES_EXCEEDED */ });
+        setState((prev) => ({ ...prev, errors }));
+        return;
+      }
+      const validFiles = [];
+      newFilesArray.forEach((file) => {
+        if (multiple) {
+          const isDuplicate = state.files.some(
+            (existingFile) => existingFile.file.name === file.name && existingFile.file.size === file.size
+          );
+          if (isDuplicate) {
+            return;
+          }
+        }
+        if (file.size > maxSize) {
+          errors.push({
+            error: "MAXIMUM_FILE_SIZE_EXCEEDED" /* MAXIMUM_FILE_SIZE_EXCEEDED */,
+            file
+          });
+          return;
+        }
+        const error2 = validateFile(file);
+        if (error2) {
+          errors.push(error2);
+        } else {
+          validFiles.push({
+            file,
+            id: generateUniqueId(file),
+            preview: createPreview(file)
+          });
+        }
+      });
+      if (validFiles.length > 0) {
+        onFilesAdded?.(validFiles);
+        setState((prev) => {
+          const newFiles2 = !multiple ? validFiles : [...prev.files, ...validFiles];
+          onFilesChange?.(newFiles2);
+          return {
+            ...prev,
+            files: newFiles2,
+            errors
+          };
+        });
+      } else if (errors.length > 0) {
+        setState((prev) => ({
+          ...prev,
+          errors
+        }));
+      }
+      if (inputRef.current) {
+        inputRef.current.value = "";
+      }
+    },
+    [
+      state.files,
+      maxFiles,
+      multiple,
+      maxSize,
+      validateFile,
+      createPreview,
+      generateUniqueId,
+      clearFiles,
+      onFilesChange,
+      onFilesAdded
+    ]
+  );
+  const removeFile = React8.useCallback(
+    (id) => {
+      setState((prev) => {
+        const fileToRemove = prev.files.find((file) => file.id === id);
+        if (fileToRemove && fileToRemove.preview && fileToRemove.file instanceof File && fileToRemove.file.type.startsWith("image/")) {
+          URL.revokeObjectURL(fileToRemove.preview);
+        }
+        const newFiles = prev.files.filter((file) => file.id !== id);
+        onFilesChange?.(newFiles);
+        return {
+          ...prev,
+          files: newFiles,
+          errors: []
+        };
+      });
+    },
+    [onFilesChange]
+  );
+  const clearErrors = React8.useCallback(() => {
+    setState((prev) => ({
+      ...prev,
+      errors: []
+    }));
+  }, []);
+  const handleDragEnter = React8.useCallback((e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setState((prev) => ({ ...prev, isDragging: true }));
+  }, []);
+  const handleDragLeave = React8.useCallback((e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (e.currentTarget.contains(e.relatedTarget)) {
+      return;
+    }
+    setState((prev) => ({ ...prev, isDragging: false }));
+  }, []);
+  const handleDragOver = React8.useCallback((e) => {
+    e.preventDefault();
+    e.stopPropagation();
+  }, []);
+  const handleDrop = React8.useCallback(
+    (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      setState((prev) => ({ ...prev, isDragging: false }));
+      if (inputRef.current?.disabled) {
+        return;
+      }
+      if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {
+        if (!multiple) {
+          const file = e.dataTransfer.files[0];
+          if (file) {
+            addFiles([file]);
+          }
+        } else {
+          addFiles(e.dataTransfer.files);
+        }
+      }
+    },
+    [addFiles, multiple]
+  );
+  const handleFileChange = React8.useCallback(
+    (e) => {
+      if (e.target.files && e.target.files.length > 0) {
+        addFiles(e.target.files);
+      }
+    },
+    [addFiles]
+  );
+  const openFileDialog = React8.useCallback(() => {
+    if (inputRef.current) {
+      inputRef.current.click();
+    }
+  }, []);
+  const getInputProps = React8.useCallback(
+    (props = {}) => {
+      return {
+        ...props,
+        type: "file",
+        onChange: handleFileChange,
+        accept: props.accept || accept,
+        multiple: props.multiple !== void 0 ? props.multiple : multiple,
+        ref: inputRef
+      };
+    },
+    [accept, multiple, handleFileChange]
+  );
+  return [
+    state,
+    {
+      addFiles,
+      removeFile,
+      clearFiles,
+      clearErrors,
+      handleDragEnter,
+      handleDragLeave,
+      handleDragOver,
+      handleDrop,
+      handleFileChange,
+      openFileDialog,
+      getInputProps
+    }
+  ];
+};
+var formatBytes = (bytes, decimals = 2) => {
+  if (bytes === 0) return "0 Bytes";
+  const k = 1024;
+  const dm = decimals < 0 ? 0 : decimals;
+  const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return Number.parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + (sizes?.[i] || "");
+};
+var filePreviewByMimetype = (mimetype) => {
+  if (mimetype.match("text") || mimetype.match("application")) {
+    return /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileTextIcon, {});
+  }
+  if (mimetype.match("audio")) {
+    return /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileAudioIcon, {});
+  }
+  if (mimetype.match("video")) {
+    return /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileVideoIcon, {});
+  }
+  return null;
+};
+function FileUpload({
+  maxSizeMB = 2,
+  subtitle,
+  title,
+  imagePreview,
+  showPreview = true,
+  onError,
+  maxFiles = Infinity,
+  ...rest
+}) {
+  const { fileUpload } = useNebulaI18n().messages;
+  const maxSize = maxSizeMB * 1024 * 1024;
+  const [
+    { files, isDragging, errors },
+    {
+      handleDragEnter,
+      handleDragLeave,
+      handleDragOver,
+      handleDrop,
+      openFileDialog,
+      removeFile,
+      getInputProps,
+      clearFiles
+    }
+  ] = useFileUpload({
+    multiple: false,
+    maxSize: maxSize > 0 ? maxSize : void 0,
+    accept: "*",
+    ...rest,
+    maxFiles
+  });
+  React8.useEffect(() => {
+    onError?.(errors);
+  }, [errors, onError]);
+  const disabled = React8.useMemo(() => {
+    if (rest.disabled) return true;
+    if (rest.multiple) {
+      if (!Number.isFinite(maxFiles)) return false;
+      return files.length === maxFiles;
+    }
+    return files.length;
+  }, [rest.disabled, rest.multiple, files.length, maxFiles]);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "nebula-ds flex flex-col gap-2 w-full", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nebula-ds relative  w-full", children: /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        role: "button",
+        onClick: openFileDialog,
+        onDragEnter: handleDragEnter,
+        onDragLeave: handleDragLeave,
+        onDragOver: handleDragOver,
+        onDrop: handleDrop,
+        "data-dragging": isDragging || void 0,
+        className: cn(
+          "bg-fileUpload-background hover:bg-fileUpload-backgroundHover transition-colors",
+          "border border-dashed border-fileUpload-border rounded-2xl",
+          "py-14",
+          disabled && "pointer-events-none cursor-not-allowed"
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              ...getInputProps(),
+              className: "nebula-ds sr-only",
+              "aria-label": "Upload file"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              className: cn(
+                "flex flex-col items-center justify-center px-4 py-3 text-center w-full",
+                disabled && "opacity-60"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "div",
+                  {
+                    className: "nebula-ds mb-2 flex size-12 shrink-0 items-center justify-center rounded-full border border-fileUpload-border",
+                    "aria-hidden": "true",
+                    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ImageUpIcon, { className: "nebula-ds size-4 opacity-60 text-fileUpload-icon" })
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx(Heading, { level: "5", className: "nebula-ds mb-1", children: title }),
+                /* @__PURE__ */ jsxRuntime.jsx(Paragraph, { size: "sm", children: subtitle })
+              ]
+            }
+          )
+        ]
+      }
+    ) }),
+    files.length > 0 && showPreview && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nebula-ds space-y-2", children: files.map((file, idx) => /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: "nebula-ds bg-fileUpload-backgroundFile flex items-center justify-between gap-2 rounded-xl border border-fileUpload-borderFile p-2",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "nebula-ds flex items-center gap-3 overflow-hidden", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nebula-ds bg-[inherit] aspect-square shrink-0 rounded border border-fileUpload-borderFile size-10 [&>svg]:size-4 [&>svg]:text-fileUpload-icon flex items-center justify-center", children: imagePreview?.(file) || filePreviewByMimetype(file.file.type) || /* @__PURE__ */ jsxRuntime.jsx(
+              "img",
+              {
+                src: file.preview,
+                alt: file.file.name,
+                className: "nebula-ds rounded-[inherit] object-cover h-full w-full"
+              }
+            ) }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "nebula-ds flex min-w-0 flex-col gap-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Heading, { level: "5", className: "nebula-ds text-xs", children: file.file.name }),
+              /* @__PURE__ */ jsxRuntime.jsx(Paragraph, { size: "sm", children: formatBytes(file.file.size) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            Button,
+            {
+              icon: true,
+              variant: "ghost",
+              onClick: () => removeFile(file.id),
+              "aria-label": "Remove file",
+              "data-testid": `file-upload-remove-file-${idx}`,
+              children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XIcon, { "aria-hidden": "true" })
+            }
+          )
+        ]
+      },
+      file.id
+    )) }),
+    files.length > 1 && /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(
+      Button,
+      {
+        size: "md",
+        variant: "secondary",
+        onClick: clearFiles,
+        "data-testid": "file-upload-remove-all-files",
+        children: fileUpload.deleteAll
+      }
+    ) })
+  ] });
+}
+var TextArea = React8__namespace.forwardRef(
+  ({
+    className,
+    isError = false,
+    disabled,
+    resize = true,
+    showCount = false,
+    autoResize = true,
+    maxLength,
+    asInput,
+    ...props
+  }, ref) => {
+    const innerRef = React8__namespace.useRef(
+      null
+    );
+    const [count, setCount] = React8__namespace.useState(String(props.value ?? "").length);
+    const countParts = [count, maxLength].filter(
+      (part) => typeof part === "number"
+    );
+    React8__namespace.useEffect(() => {
+      const textarea = innerRef.current;
+      if (!textarea || !autoResize) return;
+      const adjustHeight = () => {
+        textarea.style.height = "auto";
+        textarea.style.height = asInput && !textarea.value || !textarea.value.match("\n") ? "22px" : `${textarea.scrollHeight}px`;
+      };
+      adjustHeight();
+      textarea.addEventListener("input", adjustHeight);
+      return () => {
+        textarea.removeEventListener("input", adjustHeight);
+      };
+    }, [asInput, autoResize, props.value]);
+    React8__namespace.useImperativeHandle(ref, () => innerRef.current);
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "nebula-ds relative w-full", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: cn(
+            "w-full pl-0 pr-2 py-2 overflow-hidden flex box-border",
+            "w-full outline-none rounded-textarea text-sm font-medium",
+            "bg-inputText-background-default",
+            "border border-inputText-border-default focus-within:ring-[3px] focus-within:ring-inputText-border-focus focus-within:border-inputText-border-focus",
+            "text-inputText-text-filled focus-within:text-inputText-text-focus ",
+            "disabled:cursor-not-allowed",
+            "[&>textarea]:bg-transparent [&>textarea]:w-full [&>textarea]:py-0 [&>textarea]:pr-2 [&>textarea]:pl-4 [&>textarea]:flex-1 [&>textarea]:min-h-[62px] [&>textarea]:box-border",
+            "[&>textarea]:focus:ring-0 [&>textarea]:focus:border-none [&>textarea]:border-none [&>textarea]:outline-none [&>textarea]:ring-0",
+            "[&>textarea]:bg-inputText-background-default disabled:[&>textarea]:bg-inputText-background-disabled",
+            "[&>textarea]:placeholder:text-inputText-text-default disabled:[&>textarea]:text-inputText-text-disabled",
+            {
+              "bg-inputText-background-disabled text-inputText-text-disabled [&>textarea]:ps-4 [&>textarea]:pr-2": disabled,
+              "border-inputText-border-danger focus-within:border-inputText-border-danger focus-within:ring-button-danger-border-focus": isError,
+              "[&>textarea]:resize-none": !resize,
+              "[&>textarea]:min-h-[22px] !rounded-input": asInput
+            },
+            className
+          ),
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "textarea",
+            {
+              ref: innerRef,
+              ...props,
+              disabled,
+              onChange: (e) => {
+                if (showCount) {
+                  setCount(e.target.value.length);
+                }
+                props.onChange?.(e);
+              }
+            }
+          )
+        }
+      ),
+      !!showCount && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nebula-ds absolute right-0 top-[100%] pt-1", children: /* @__PURE__ */ jsxRuntime.jsx(Paragraph, { size: "sm", children: countParts.join("/") }) })
+    ] });
+  }
+);
+TextArea.displayName = "TextArea";
 
 // src/tailwind.ts
 function content({ base = "./" } = {}) {
@@ -4371,6 +4966,8 @@ exports.DropdownMenuSub = DropdownMenuSub;
 exports.DropdownMenuSubContent = DropdownMenuSubContent;
 exports.DropdownMenuSubTrigger = DropdownMenuSubTrigger;
 exports.DropdownMenuTrigger = DropdownMenuTrigger;
+exports.FileUpload = FileUpload;
+exports.FileUploadError = FileUploadError;
 exports.Heading = Heading;
 exports.InputDatePickerSingle = InputDatePickerSingle;
 exports.InputDateTimePickerSingle = InputDateTimePickerSingle;
@@ -4405,6 +5002,7 @@ exports.TabsContent = TabsContent;
 exports.TabsList = TabsList;
 exports.TabsTrigger = TabsTrigger;
 exports.Tag = Tag;
+exports.TextArea = TextArea;
 exports.Toaster = Toaster;
 exports.Tooltip = Tooltip;
 exports.alertVariants = alertVariants;
@@ -4413,9 +5011,11 @@ exports.badgeVariantEnum = badgeVariantEnum;
 exports.buttonSizeEnum = buttonSizeEnum;
 exports.buttonVariantEnum = buttonVariantEnum;
 exports.buttonVariantsConfig = buttonVariantsConfig;
+exports.dateIsAvailable = dateIsAvailable;
+exports.formatBytes = formatBytes;
 exports.getNebulaLanguage = getNebulaLanguage;
 exports.localeByi18nKey = localeByi18nKey;
-exports.messages = messages13;
+exports.messages = messages16;
 exports.separatorVariants = separatorVariants;
 exports.setNebulaLanguage = setNebulaLanguage;
 exports.tagVariantsEnum = tagVariantsEnum;