@dmsi/wedgekit-react 0.0.854 → 0.0.856

package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.cjs

@@ -476,30 +476,10 @@ function formatCurrencyDisplay(value) {
 }
 
 // src/utils/date.ts
-function parseInputDate(input) {
-  const match = input.match(/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/);
-  if (!match) {
-    return null;
-  }
-  const [, month, day, year] = match;
-  const paddedMonth = month.padStart(2, "0");
-  const paddedDay = day.padStart(2, "0");
-  return `${year}-${paddedMonth}-${paddedDay}`;
-}
 function isValidDate(dateString) {
   const date = new Date(dateString);
   return date instanceof Date && !isNaN(date.getTime()) && dateString === date.toISOString().split("T")[0];
 }
-function formatInputValue(value) {
-  const digits = value.replace(/\D/g, "");
-  if (digits.length < 2) {
-    return digits;
-  }
-  if (digits.length >= 4) {
-    return `${digits.slice(0, 2)}/${digits.slice(2, 4)}/${digits.slice(4, 8)}`;
-  }
-  return `${digits.slice(0, 2)}/${digits.slice(2)}`;
-}
 function isDigit(character) {
   return /\d/.test(character);
 }
@@ -3387,6 +3367,10 @@ function DataGrid({
     (0, import_core.useSensor)(import_core.KeyboardSensor)
   );
   const visibleColumns = table.getVisibleLeafColumns();
+  const nonPinnedColumnIds = table.getCenterLeafColumns().map((col) => col.id);
+  const sortableColumnOrder = columnOrder.filter(
+    (id2) => nonPinnedColumnIds.includes(id2)
+  );
   const columnVirtualizer = (0, import_react_virtual2.useVirtualizer)({
     count: visibleColumns.length,
     estimateSize: (index) => visibleColumns[index].getSize(),
@@ -3415,7 +3399,7 @@ function DataGrid({
       children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
         import_sortable2.SortableContext,
         {
-          items: columnOrder,
+          items: sortableColumnOrder,
           strategy: import_sortable2.horizontalListSortingStrategy,
           children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
             "div",
@@ -4774,6 +4758,60 @@ function CalendarPane({
   ] }, month.name + month.year);
 }
 
+// src/utils/date-patch-dashes.ts
+function formatInputValueWithDashes(value, dateInDashes) {
+  const digits = value.replace(/\D/g, "");
+  if (dateInDashes) {
+    if (digits.length <= 4) return digits;
+    if (digits.length <= 6) return `${digits.slice(0, 4)}-${digits.slice(4)}`;
+    return `${digits.slice(4, 6)}-${digits.slice(6, 8)}-${digits.slice(0, 4)}`;
+  } else {
+    if (digits.length <= 2) return digits;
+    if (digits.length <= 4) return `${digits.slice(0, 2)}/${digits.slice(2)}`;
+    return `${digits.slice(0, 2)}/${digits.slice(2, 4)}/${digits.slice(4, 8)}`;
+  }
+}
+function formatDateWithDashes(value, dateInDashes) {
+  if (!value) return "";
+  let year = "", month = "", day = "";
+  if (/^\d{4}-\d{2}-\d{2}$/.test(value)) {
+    [year, month, day] = value.split("-");
+  } else if (/^\d{2}-\d{2}-\d{4}$/.test(value)) {
+    [month, day, year] = value.split("-");
+  } else if (/^\d{2}\/\d{2}\/\d{4}$/.test(value)) {
+    [month, day, year] = value.split("/");
+  } else {
+    return value;
+  }
+  if (!year || !month || !day) return value;
+  if (dateInDashes) {
+    return `${month}-${day}-${year}`;
+  }
+  return `${month}/${day}/${year}`;
+}
+function parseInputDateWithDashes(value, dateInDashes) {
+  if (!value) return "";
+  let year = "", month = "", day = "";
+  if (dateInDashes) {
+    let match = value.match(/^(\d{2})-(\d{2})-(\d{4})$/);
+    if (match) {
+      [, month, day, year] = match;
+    } else {
+      match = value.match(/^(\d{4})-(\d{2})-(\d{2})$/);
+      if (match) {
+        [, year, month, day] = match;
+      }
+    }
+  } else {
+    const match = value.match(/^(\d{2})\/(\d{2})\/(\d{4})$/);
+    if (match) {
+      [, month, day, year] = match;
+    }
+  }
+  if (!year || !month || !day) return "";
+  return `${month}-${day}-${year}`;
+}
+
 // src/components/DateInput.tsx
 var import_jsx_runtime23 = require("react/jsx-runtime");
 var DateInput = (_a) => {
@@ -4787,7 +4825,8 @@ var DateInput = (_a) => {
     readOnly = false,
     label,
     isDateAvailable,
-    disableManualInput
+    disableManualInput,
+    dateInDashes = false
   } = _b, props = __objRest(_b, [
     "id",
     "testid",
@@ -4798,7 +4837,8 @@ var DateInput = (_a) => {
     "readOnly",
     "label",
     "isDateAvailable",
-    "disableManualInput"
+    "disableManualInput",
+    "dateInDashes"
   ]);
   const [visible, setVisible] = (0, import_react19.useState)(false);
   const [inputValue, setInputValue] = (0, import_react19.useState)("");
@@ -4814,9 +4854,9 @@ var DateInput = (_a) => {
   const [from, to] = [value, ""];
   (0, import_react19.useEffect)(() => {
     if (!isTyping) {
-      setInputValue(formatDisplayValue(from));
+      setInputValue(formatDisplayValue(from, dateInDashes));
     }
-  }, [from, isTyping]);
+  }, [from, isTyping, dateInDashes]);
   (0, import_react19.useLayoutEffect)(() => {
     if (visible) {
       updatePosition();
@@ -4879,7 +4919,7 @@ var DateInput = (_a) => {
     const rawValue = event.target.value;
     const cursorPosition = event.target.selectionStart || 0;
     setIsTyping(true);
-    const formattedValue = formatInputValue(rawValue);
+    const formattedValue = formatInputValueWithDashes(rawValue, dateInDashes);
     setInputValue(formattedValue);
     requestAnimationFrame(() => {
       if (triggerRef.current) {
@@ -4891,16 +4931,16 @@ var DateInput = (_a) => {
         triggerRef.current.setSelectionRange(newPosition, newPosition);
       }
     });
-    const parsedDate = parseInputDate(formattedValue);
+    const parsedDate = parseInputDateWithDashes(formattedValue, dateInDashes);
     if (parsedDate && isValidDate(parsedDate)) {
       onChange(parsedDate);
     }
   };
   const handleBlur = () => {
     setIsTyping(false);
-    const parsedDate = parseInputDate(inputValue);
+    const parsedDate = parseInputDateWithDashes(inputValue, dateInDashes);
     if (!parsedDate || !isValidDate(parsedDate)) {
-      setInputValue(formatDisplayValue(from));
+      setInputValue(formatDisplayValue(from, dateInDashes));
     }
   };
   const handleKeyDown = (event) => {
@@ -4908,10 +4948,11 @@ var DateInput = (_a) => {
       const input = event.target;
       const cursorPosition = input.selectionStart || 0;
       const value2 = input.value;
-      if (cursorPosition > 0 && value2[cursorPosition - 1] === "/") {
+      const sep = dateInDashes ? "-" : "/";
+      if (cursorPosition > 0 && value2[cursorPosition - 1] === sep) {
         event.preventDefault();
         const newValue = value2.slice(0, cursorPosition - 2) + value2.slice(cursorPosition);
-        const formattedValue = formatInputValue(newValue);
+        const formattedValue = formatInputValueWithDashes(newValue, dateInDashes);
         setInputValue(formattedValue);
         requestAnimationFrame(() => {
           if (triggerRef.current) {
@@ -4924,7 +4965,7 @@ var DateInput = (_a) => {
       }
     }
     if (event.key === "Enter") {
-      const parsedDate = parseInputDate(inputValue);
+      const parsedDate = parseInputDateWithDashes(inputValue, dateInDashes);
       if (parsedDate && isValidDate(parsedDate)) {
         onChange(parsedDate);
         setVisible(false);
@@ -5013,14 +5054,14 @@ var DateInput = (_a) => {
   ] });
 };
 DateInput.displayName = "DateInput";
-function formatDisplayValue(from) {
+function formatDisplayValue(from, dateInDashes) {
   if (!from) {
     return "";
   }
   if (!isValidDate(from)) {
     return "";
   }
-  return formatDate(from);
+  return formatDateWithDashes(from, dateInDashes);
 }
 
 // src/components/Accordion.tsx

package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.js

@@ -1,16 +1,16 @@
 import {
   ColumnSelectorHeaderCell
-} from "../../../chunk-T7NSOCGM.js";
+} from "../../../chunk-RESDUVMA.js";
 import "../../../chunk-WJJB7IJZ.js";
 import "../../../chunk-Q4YDNW7N.js";
 import "../../../chunk-M7INAUAJ.js";
-import "../../../chunk-C5DKGJ4E.js";
+import "../../../chunk-Y75MQKNY.js";
+import "../../../chunk-MBZ55T2D.js";
 import "../../../chunk-2IKT6IHB.js";
 import "../../../chunk-YCDDBSVU.js";
 import "../../../chunk-3X3Y4TMS.js";
 import "../../../chunk-BQNPOGD5.js";
 import "../../../chunk-Y5GD2FJA.js";
-import "../../../chunk-MBZ55T2D.js";
 import "../../../chunk-SZ47M32R.js";
 import "../../../chunk-B4AE3DCA.js";
 import "../../../chunk-FP3Y5JJN.js";

package/dist/components/DataGrid/PinnedColumns.cjs

@@ -476,30 +476,10 @@ function formatCurrencyDisplay(value) {
 }
 
 // src/utils/date.ts
-function parseInputDate(input) {
-  const match = input.match(/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/);
-  if (!match) {
-    return null;
-  }
-  const [, month, day, year] = match;
-  const paddedMonth = month.padStart(2, "0");
-  const paddedDay = day.padStart(2, "0");
-  return `${year}-${paddedMonth}-${paddedDay}`;
-}
 function isValidDate(dateString) {
   const date = new Date(dateString);
   return date instanceof Date && !isNaN(date.getTime()) && dateString === date.toISOString().split("T")[0];
 }
-function formatInputValue(value) {
-  const digits = value.replace(/\D/g, "");
-  if (digits.length < 2) {
-    return digits;
-  }
-  if (digits.length >= 4) {
-    return `${digits.slice(0, 2)}/${digits.slice(2, 4)}/${digits.slice(4, 8)}`;
-  }
-  return `${digits.slice(0, 2)}/${digits.slice(2)}`;
-}
 function isDigit(character) {
   return /\d/.test(character);
 }
@@ -3232,6 +3212,10 @@ function DataGrid({
     (0, import_core.useSensor)(import_core.KeyboardSensor)
   );
   const visibleColumns = table.getVisibleLeafColumns();
+  const nonPinnedColumnIds = table.getCenterLeafColumns().map((col) => col.id);
+  const sortableColumnOrder = columnOrder.filter(
+    (id2) => nonPinnedColumnIds.includes(id2)
+  );
   const columnVirtualizer = (0, import_react_virtual2.useVirtualizer)({
     count: visibleColumns.length,
     estimateSize: (index) => visibleColumns[index].getSize(),
@@ -3260,7 +3244,7 @@ function DataGrid({
       children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         import_sortable2.SortableContext,
         {
-          items: columnOrder,
+          items: sortableColumnOrder,
           strategy: import_sortable2.horizontalListSortingStrategy,
           children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
             "div",
@@ -4619,6 +4603,60 @@ function CalendarPane({
   ] }, month.name + month.year);
 }
 
+// src/utils/date-patch-dashes.ts
+function formatInputValueWithDashes(value, dateInDashes) {
+  const digits = value.replace(/\D/g, "");
+  if (dateInDashes) {
+    if (digits.length <= 4) return digits;
+    if (digits.length <= 6) return `${digits.slice(0, 4)}-${digits.slice(4)}`;
+    return `${digits.slice(4, 6)}-${digits.slice(6, 8)}-${digits.slice(0, 4)}`;
+  } else {
+    if (digits.length <= 2) return digits;
+    if (digits.length <= 4) return `${digits.slice(0, 2)}/${digits.slice(2)}`;
+    return `${digits.slice(0, 2)}/${digits.slice(2, 4)}/${digits.slice(4, 8)}`;
+  }
+}
+function formatDateWithDashes(value, dateInDashes) {
+  if (!value) return "";
+  let year = "", month = "", day = "";
+  if (/^\d{4}-\d{2}-\d{2}$/.test(value)) {
+    [year, month, day] = value.split("-");
+  } else if (/^\d{2}-\d{2}-\d{4}$/.test(value)) {
+    [month, day, year] = value.split("-");
+  } else if (/^\d{2}\/\d{2}\/\d{4}$/.test(value)) {
+    [month, day, year] = value.split("/");
+  } else {
+    return value;
+  }
+  if (!year || !month || !day) return value;
+  if (dateInDashes) {
+    return `${month}-${day}-${year}`;
+  }
+  return `${month}/${day}/${year}`;
+}
+function parseInputDateWithDashes(value, dateInDashes) {
+  if (!value) return "";
+  let year = "", month = "", day = "";
+  if (dateInDashes) {
+    let match = value.match(/^(\d{2})-(\d{2})-(\d{4})$/);
+    if (match) {
+      [, month, day, year] = match;
+    } else {
+      match = value.match(/^(\d{4})-(\d{2})-(\d{2})$/);
+      if (match) {
+        [, year, month, day] = match;
+      }
+    }
+  } else {
+    const match = value.match(/^(\d{2})\/(\d{2})\/(\d{4})$/);
+    if (match) {
+      [, month, day, year] = match;
+    }
+  }
+  if (!year || !month || !day) return "";
+  return `${month}-${day}-${year}`;
+}
+
 // src/components/DateInput.tsx
 var import_jsx_runtime22 = require("react/jsx-runtime");
 var DateInput = (_a) => {
@@ -4632,7 +4670,8 @@ var DateInput = (_a) => {
     readOnly = false,
     label,
     isDateAvailable,
-    disableManualInput
+    disableManualInput,
+    dateInDashes = false
   } = _b, props = __objRest(_b, [
     "id",
     "testid",
@@ -4643,7 +4682,8 @@ var DateInput = (_a) => {
     "readOnly",
     "label",
     "isDateAvailable",
-    "disableManualInput"
+    "disableManualInput",
+    "dateInDashes"
   ]);
   const [visible, setVisible] = (0, import_react18.useState)(false);
   const [inputValue, setInputValue] = (0, import_react18.useState)("");
@@ -4659,9 +4699,9 @@ var DateInput = (_a) => {
   const [from, to] = [value, ""];
   (0, import_react18.useEffect)(() => {
     if (!isTyping) {
-      setInputValue(formatDisplayValue(from));
+      setInputValue(formatDisplayValue(from, dateInDashes));
     }
-  }, [from, isTyping]);
+  }, [from, isTyping, dateInDashes]);
   (0, import_react18.useLayoutEffect)(() => {
     if (visible) {
       updatePosition();
@@ -4724,7 +4764,7 @@ var DateInput = (_a) => {
     const rawValue = event.target.value;
     const cursorPosition = event.target.selectionStart || 0;
     setIsTyping(true);
-    const formattedValue = formatInputValue(rawValue);
+    const formattedValue = formatInputValueWithDashes(rawValue, dateInDashes);
     setInputValue(formattedValue);
     requestAnimationFrame(() => {
       if (triggerRef.current) {
@@ -4736,16 +4776,16 @@ var DateInput = (_a) => {
         triggerRef.current.setSelectionRange(newPosition, newPosition);
       }
     });
-    const parsedDate = parseInputDate(formattedValue);
+    const parsedDate = parseInputDateWithDashes(formattedValue, dateInDashes);
     if (parsedDate && isValidDate(parsedDate)) {
       onChange(parsedDate);
     }
   };
   const handleBlur = () => {
     setIsTyping(false);
-    const parsedDate = parseInputDate(inputValue);
+    const parsedDate = parseInputDateWithDashes(inputValue, dateInDashes);
     if (!parsedDate || !isValidDate(parsedDate)) {
-      setInputValue(formatDisplayValue(from));
+      setInputValue(formatDisplayValue(from, dateInDashes));
     }
   };
   const handleKeyDown = (event) => {
@@ -4753,10 +4793,11 @@ var DateInput = (_a) => {
       const input = event.target;
       const cursorPosition = input.selectionStart || 0;
       const value2 = input.value;
-      if (cursorPosition > 0 && value2[cursorPosition - 1] === "/") {
+      const sep = dateInDashes ? "-" : "/";
+      if (cursorPosition > 0 && value2[cursorPosition - 1] === sep) {
         event.preventDefault();
         const newValue = value2.slice(0, cursorPosition - 2) + value2.slice(cursorPosition);
-        const formattedValue = formatInputValue(newValue);
+        const formattedValue = formatInputValueWithDashes(newValue, dateInDashes);
         setInputValue(formattedValue);
         requestAnimationFrame(() => {
           if (triggerRef.current) {
@@ -4769,7 +4810,7 @@ var DateInput = (_a) => {
       }
     }
     if (event.key === "Enter") {
-      const parsedDate = parseInputDate(inputValue);
+      const parsedDate = parseInputDateWithDashes(inputValue, dateInDashes);
       if (parsedDate && isValidDate(parsedDate)) {
         onChange(parsedDate);
         setVisible(false);
@@ -4858,14 +4899,14 @@ var DateInput = (_a) => {
   ] });
 };
 DateInput.displayName = "DateInput";
-function formatDisplayValue(from) {
+function formatDisplayValue(from, dateInDashes) {
   if (!from) {
     return "";
   }
   if (!isValidDate(from)) {
     return "";
   }
-  return formatDate(from);
+  return formatDateWithDashes(from, dateInDashes);
 }
 
 // src/components/Accordion.tsx

package/dist/components/DataGrid/PinnedColumns.js

@@ -1,16 +1,16 @@
 import {
   PinnedColumns
-} from "../../chunk-T7NSOCGM.js";
+} from "../../chunk-RESDUVMA.js";
 import "../../chunk-WJJB7IJZ.js";
 import "../../chunk-Q4YDNW7N.js";
 import "../../chunk-M7INAUAJ.js";
-import "../../chunk-C5DKGJ4E.js";
+import "../../chunk-Y75MQKNY.js";
+import "../../chunk-MBZ55T2D.js";
 import "../../chunk-2IKT6IHB.js";
 import "../../chunk-YCDDBSVU.js";
 import "../../chunk-3X3Y4TMS.js";
 import "../../chunk-BQNPOGD5.js";
 import "../../chunk-Y5GD2FJA.js";
-import "../../chunk-MBZ55T2D.js";
 import "../../chunk-SZ47M32R.js";
 import "../../chunk-B4AE3DCA.js";
 import "../../chunk-FP3Y5JJN.js";

package/dist/components/DataGrid/TableBody/LoadingCell.cjs

@@ -475,30 +475,10 @@ function formatCurrencyDisplay(value) {
 }
 
 // src/utils/date.ts
-function parseInputDate(input) {
-  const match = input.match(/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/);
-  if (!match) {
-    return null;
-  }
-  const [, month, day, year] = match;
-  const paddedMonth = month.padStart(2, "0");
-  const paddedDay = day.padStart(2, "0");
-  return `${year}-${paddedMonth}-${paddedDay}`;
-}
 function isValidDate(dateString) {
   const date = new Date(dateString);
   return date instanceof Date && !isNaN(date.getTime()) && dateString === date.toISOString().split("T")[0];
 }
-function formatInputValue(value) {
-  const digits = value.replace(/\D/g, "");
-  if (digits.length < 2) {
-    return digits;
-  }
-  if (digits.length >= 4) {
-    return `${digits.slice(0, 2)}/${digits.slice(2, 4)}/${digits.slice(4, 8)}`;
-  }
-  return `${digits.slice(0, 2)}/${digits.slice(2)}`;
-}
 function isDigit(character) {
   return /\d/.test(character);
 }
@@ -3457,6 +3437,10 @@ function DataGrid({
     (0, import_core.useSensor)(import_core.KeyboardSensor)
   );
   const visibleColumns = table.getVisibleLeafColumns();
+  const nonPinnedColumnIds = table.getCenterLeafColumns().map((col) => col.id);
+  const sortableColumnOrder = columnOrder.filter(
+    (id2) => nonPinnedColumnIds.includes(id2)
+  );
   const columnVirtualizer = (0, import_react_virtual2.useVirtualizer)({
     count: visibleColumns.length,
     estimateSize: (index) => visibleColumns[index].getSize(),
@@ -3485,7 +3469,7 @@ function DataGrid({
       children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
         import_sortable2.SortableContext,
         {
-          items: columnOrder,
+          items: sortableColumnOrder,
           strategy: import_sortable2.horizontalListSortingStrategy,
           children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
             "div",
@@ -4844,6 +4828,60 @@ function CalendarPane({
   ] }, month.name + month.year);
 }
 
+// src/utils/date-patch-dashes.ts
+function formatInputValueWithDashes(value, dateInDashes) {
+  const digits = value.replace(/\D/g, "");
+  if (dateInDashes) {
+    if (digits.length <= 4) return digits;
+    if (digits.length <= 6) return `${digits.slice(0, 4)}-${digits.slice(4)}`;
+    return `${digits.slice(4, 6)}-${digits.slice(6, 8)}-${digits.slice(0, 4)}`;
+  } else {
+    if (digits.length <= 2) return digits;
+    if (digits.length <= 4) return `${digits.slice(0, 2)}/${digits.slice(2)}`;
+    return `${digits.slice(0, 2)}/${digits.slice(2, 4)}/${digits.slice(4, 8)}`;
+  }
+}
+function formatDateWithDashes(value, dateInDashes) {
+  if (!value) return "";
+  let year = "", month = "", day = "";
+  if (/^\d{4}-\d{2}-\d{2}$/.test(value)) {
+    [year, month, day] = value.split("-");
+  } else if (/^\d{2}-\d{2}-\d{4}$/.test(value)) {
+    [month, day, year] = value.split("-");
+  } else if (/^\d{2}\/\d{2}\/\d{4}$/.test(value)) {
+    [month, day, year] = value.split("/");
+  } else {
+    return value;
+  }
+  if (!year || !month || !day) return value;
+  if (dateInDashes) {
+    return `${month}-${day}-${year}`;
+  }
+  return `${month}/${day}/${year}`;
+}
+function parseInputDateWithDashes(value, dateInDashes) {
+  if (!value) return "";
+  let year = "", month = "", day = "";
+  if (dateInDashes) {
+    let match = value.match(/^(\d{2})-(\d{2})-(\d{4})$/);
+    if (match) {
+      [, month, day, year] = match;
+    } else {
+      match = value.match(/^(\d{4})-(\d{2})-(\d{2})$/);
+      if (match) {
+        [, year, month, day] = match;
+      }
+    }
+  } else {
+    const match = value.match(/^(\d{2})\/(\d{2})\/(\d{4})$/);
+    if (match) {
+      [, month, day, year] = match;
+    }
+  }
+  if (!year || !month || !day) return "";
+  return `${month}-${day}-${year}`;
+}
+
 // src/components/DateInput.tsx
 var import_jsx_runtime24 = require("react/jsx-runtime");
 var DateInput = (_a) => {
@@ -4857,7 +4895,8 @@ var DateInput = (_a) => {
     readOnly = false,
     label,
     isDateAvailable,
-    disableManualInput
+    disableManualInput,
+    dateInDashes = false
   } = _b, props = __objRest(_b, [
     "id",
     "testid",
@@ -4868,7 +4907,8 @@ var DateInput = (_a) => {
     "readOnly",
     "label",
     "isDateAvailable",
-    "disableManualInput"
+    "disableManualInput",
+    "dateInDashes"
   ]);
   const [visible, setVisible] = (0, import_react21.useState)(false);
   const [inputValue, setInputValue] = (0, import_react21.useState)("");
@@ -4884,9 +4924,9 @@ var DateInput = (_a) => {
   const [from, to] = [value, ""];
   (0, import_react21.useEffect)(() => {
     if (!isTyping) {
-      setInputValue(formatDisplayValue(from));
+      setInputValue(formatDisplayValue(from, dateInDashes));
     }
-  }, [from, isTyping]);
+  }, [from, isTyping, dateInDashes]);
   (0, import_react21.useLayoutEffect)(() => {
     if (visible) {
       updatePosition();
@@ -4949,7 +4989,7 @@ var DateInput = (_a) => {
     const rawValue = event.target.value;
     const cursorPosition = event.target.selectionStart || 0;
     setIsTyping(true);
-    const formattedValue = formatInputValue(rawValue);
+    const formattedValue = formatInputValueWithDashes(rawValue, dateInDashes);
     setInputValue(formattedValue);
     requestAnimationFrame(() => {
       if (triggerRef.current) {
@@ -4961,16 +5001,16 @@ var DateInput = (_a) => {
         triggerRef.current.setSelectionRange(newPosition, newPosition);
       }
     });
-    const parsedDate = parseInputDate(formattedValue);
+    const parsedDate = parseInputDateWithDashes(formattedValue, dateInDashes);
     if (parsedDate && isValidDate(parsedDate)) {
       onChange(parsedDate);
     }
   };
   const handleBlur = () => {
     setIsTyping(false);
-    const parsedDate = parseInputDate(inputValue);
+    const parsedDate = parseInputDateWithDashes(inputValue, dateInDashes);
     if (!parsedDate || !isValidDate(parsedDate)) {
-      setInputValue(formatDisplayValue(from));
+      setInputValue(formatDisplayValue(from, dateInDashes));
     }
   };
   const handleKeyDown = (event) => {
@@ -4978,10 +5018,11 @@ var DateInput = (_a) => {
       const input = event.target;
       const cursorPosition = input.selectionStart || 0;
       const value2 = input.value;
-      if (cursorPosition > 0 && value2[cursorPosition - 1] === "/") {
+      const sep = dateInDashes ? "-" : "/";
+      if (cursorPosition > 0 && value2[cursorPosition - 1] === sep) {
         event.preventDefault();
         const newValue = value2.slice(0, cursorPosition - 2) + value2.slice(cursorPosition);
-        const formattedValue = formatInputValue(newValue);
+        const formattedValue = formatInputValueWithDashes(newValue, dateInDashes);
         setInputValue(formattedValue);
         requestAnimationFrame(() => {
           if (triggerRef.current) {
@@ -4994,7 +5035,7 @@ var DateInput = (_a) => {
       }
     }
     if (event.key === "Enter") {
-      const parsedDate = parseInputDate(inputValue);
+      const parsedDate = parseInputDateWithDashes(inputValue, dateInDashes);
       if (parsedDate && isValidDate(parsedDate)) {
         onChange(parsedDate);
         setVisible(false);
@@ -5083,14 +5124,14 @@ var DateInput = (_a) => {
   ] });
 };
 DateInput.displayName = "DateInput";
-function formatDisplayValue(from) {
+function formatDisplayValue(from, dateInDashes) {
   if (!from) {
     return "";
   }
   if (!isValidDate(from)) {
     return "";
   }
-  return formatDate(from);
+  return formatDateWithDashes(from, dateInDashes);
 }
 
 // src/components/Accordion.tsx