@citruslime/ui 4.1.0-beta.21 → 4.1.0-beta.23

package/dist/citrus-lime-ui.es.js

@@ -3376,13 +3376,21 @@ function getClampedDateValue(minDate, maxDate, currentDate, timeZone, calendarTy
   value = getMinDateValue(minDate, timeZone, value, calendarType);
   return value.toJSDate();
 }
+function is24HourFormat(locale2) {
+  const date = DateTime.fromObject({
+    hour: 14,
+    minute: 30
+  }).setLocale(locale2);
+  const formattedTime = date.toFormat("t");
+  return !/\s?(AM|PM|am|pm|a\.m\.|p\.m\.)/i.test(formattedTime);
+}
 function generateDatePickerMask(locale2, type) {
   const date = DateTime.fromObject({
-    day: 3,
-    month: 4,
-    year: 2e3,
-    hour: 5,
-    minute: 6
+    day: 13,
+    month: 7,
+    year: 1999,
+    hour: 17,
+    minute: 59
   }).setLocale(locale2);
   let formattedDate;
   if (type === "date") {
@@ -3392,12 +3400,31 @@ function generateDatePickerMask(locale2, type) {
   } else {
     formattedDate = date.toFormat("t");
   }
-  if (locale2 === "en-US") {
-    formattedDate = formattedDate.replace("05", "hh").replace("5", "h");
+  const uses12Hour = !is24HourFormat(locale2);
+  const replacements = /* @__PURE__ */ new Map();
+  replacements.set("1999", "§YYYY§");
+  replacements.set("99", "§YY§");
+  replacements.set("07", "§MM§");
+  replacements.set("7", "§M§");
+  replacements.set("13", "§DD§");
+  if (uses12Hour) {
+    replacements.set("05", "§hh§");
+    replacements.set("5", "§h§");
   } else {
-    formattedDate = formattedDate.replace("05", "HH").replace("5", "H");
+    replacements.set("17", "§HH§");
   }
-  return formattedDate.replace("2000", "YYYY").replace("20", "YY").replace("04", "MM").replace("4", "M").replace("03", "DD").replace("3", "D").replace("06", "mm").replace("6", "m").replace("AM", "A").trim();
+  replacements.set("59", "§mm§");
+  formattedDate = formattedDate.replace(/\s?PM/g, " §A§").replace(/\s?AM/g, " §A§").replace(/\s?pm/g, " §A§").replace(/\s?am/g, " §A§").replace(/\s?p\.m\./gi, " §A§").replace(/\s?a\.m\./gi, " §A§");
+  const sortedReplacements = Array.from(replacements.entries()).sort((a, b) => b[0].length - a[0].length);
+  for (const [
+    searchValue,
+    placeholder
+  ] of sortedReplacements) {
+    const regex = new RegExp(`(?<!§)\\b${searchValue}\\b(?!§)`, "g");
+    formattedDate = formattedDate.replace(regex, placeholder);
+  }
+  formattedDate = formattedDate.replace(/§YYYY§/g, "YYYY").replace(/§YY§/g, "YY").replace(/§MM§/g, "MM").replace(/§M§/g, "M").replace(/§DD§/g, "DD").replace(/§D§/g, "D").replace(/§HH§/g, "HH").replace(/§H§/g, "H").replace(/§hh§/g, "hh").replace(/§h§/g, "h").replace(/§mm§/g, "mm").replace(/§m§/g, "m").replace(/§A§/g, "A");
+  return formattedDate.trim();
 }
 function getPopoverOptions(isNotVisible, popoverPlacement) {
   return isNotVisible ? false : {
@@ -4230,6 +4257,9 @@ const _sfc_main$M = /* @__PURE__ */ defineComponent({
     const mask = computed(() => {
       return generateDatePickerMask(internalLocale.value, props.type);
     });
+    const is24Hr = computed(() => {
+      return is24HourFormat(internalLocale.value);
+    });
     const input = ref(null);
     const currentInitialDate = computed(() => {
       return getInitialCalendarDate(model.value, props.initialCalendarDate, internalTimeZone.value, props.type);
@@ -4289,7 +4319,7 @@ const _sfc_main$M = /* @__PURE__ */ defineComponent({
             "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => internalCurrentDateTime.value = $event),
             modelModifiers: { string: true },
             locale: unref(locale2),
-            is24hr: unref(locale2) !== "en-US",
+            is24hr: is24Hr.value,
             mode: _ctx.type,
             "is-required": _ctx.required,
             "update-on-input": false,
@@ -4333,7 +4363,7 @@ const _sfc_main$M = /* @__PURE__ */ defineComponent({
             modelValue: internalCurrentDateTime.value,
             "onUpdate:modelValue": _cache[8] || (_cache[8] = ($event) => internalCurrentDateTime.value = $event),
             locale: unref(locale2),
-            is24hr: unref(locale2) !== "en-US",
+            is24hr: is24Hr.value,
             timezone: internalTimeZone.value,
             mode: _ctx.type,
             "min-date": _ctx.minDate,
@@ -4423,6 +4453,7 @@ const _sfc_main$L = /* @__PURE__ */ defineComponent({
     const props = __props;
     const model = useModel(__props, "modelValue");
     const internalTimeZone = computed(() => props.timeZone ?? "UTC");
+    const is24Hr = computed(() => is24HourFormat(internalLocale.value));
     const internalCurrentDateRange = computed({
       get() {
         let result = null;
@@ -4534,6 +4565,7 @@ const _sfc_main$L = /* @__PURE__ */ defineComponent({
             mode: "date",
             color: "primary",
             "title-position": "left",
+            is24hr: is24Hr.value,
             "show-weeknumbers": _ctx.showWeekNumbers,
             locale: internalLocale.value,
             timezone: internalTimeZone.value,
@@ -4623,7 +4655,7 @@ const _sfc_main$L = /* @__PURE__ */ defineComponent({
               ])) : createCommentVNode("", true)
             ]),
             _: 1
-          }, 8, ["modelValue", "show-weeknumbers", "locale", "timezone", "columns", "popover", "min-date", "max-date", "initial-page"])
+          }, 8, ["modelValue", "is24hr", "show-weeknumbers", "locale", "timezone", "columns", "popover", "min-date", "max-date", "initial-page"])
         ]),
         _: 2
       }, [
@@ -4948,7 +4980,6 @@ const _sfc_main$I = /* @__PURE__ */ defineComponent({
       focus
     });
     return (_ctx, _cache) => {
-      const _component_icon = resolveComponent("icon");
       return openBlock(), createElementBlock("div", {
         ref_key: "outsideRef",
         ref: outsideRef,
@@ -5009,7 +5040,7 @@ const _sfc_main$I = /* @__PURE__ */ defineComponent({
                       class: "cl:cursor-pointer cl:flex cl:items-center cl:px-2 cl:py-1 cl:relative cl:text-grey-3 cl:z-10",
                       onClick: _cache[5] || (_cache[5] = withModifiers(($event) => isCurrentlySearchable.value ? toggleSelectModalState(false) : onInputClick(), ["stop", "prevent"]))
                     }, [
-                      createVNode(_component_icon, {
+                      createVNode(unref(Icon), {
                         icon: selectModalVisible.value ? "ph:caret-up-bold" : "ph:caret-down-bold"
                       }, null, 8, ["icon"])
                     ])
@@ -9862,6 +9893,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
     });
     const { locale: locale2 } = useI18n();
     const internalLocale = computed(() => props.dateFormatLocale ?? locale2.value);
+    const is24Hr = computed(() => is24HourFormat(internalLocale.value));
     const popover = computed(() => {
       return getPopoverOptions(props.disabled, "auto");
     });
@@ -9899,7 +9931,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
         "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => currentDate.value = $event),
         modelModifiers: { string: true },
         locale: unref(locale2),
-        is24hr: unref(locale2) !== "en-US",
+        is24hr: is24Hr.value,
         mode: _ctx.type,
         "is-required": _ctx.required,
         "update-on-input": false,
@@ -9934,7 +9966,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
         color: "primary",
         "title-position": "left",
         locale: unref(locale2),
-        is24hr: unref(locale2) !== "en-US",
+        is24hr: is24Hr.value,
         timezone: internalTimeZone.value,
         columns: dateRangeColumns.value,
         popover: popover.value,
@@ -9977,7 +10009,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
         modelValue: currentDate.value,
         "onUpdate:modelValue": _cache[7] || (_cache[7] = ($event) => currentDate.value = $event),
         locale: unref(locale2),
-        is24hr: unref(locale2) !== "en-US",
+        is24hr: is24Hr.value,
         timezone: internalTimeZone.value,
         mode: _ctx.type,
         "min-date": _ctx.min,