@7pmlabs/design-system 0.6.2 → 0.6.4

package/dist/design-system196.mjs

@@ -1,7 +1,21 @@
-import t from "./design-system197.mjs";
-var e = t(Object.getPrototypeOf, Object);
-const r = e;
+import r from "./design-system197.mjs";
+import m from "./design-system198.mjs";
+import h from "./design-system199.mjs";
+import l from "./design-system200.mjs";
+import c from "./design-system201.mjs";
+function e(t) {
+  var o = -1, a = t == null ? 0 : t.length;
+  for (this.clear(); ++o < a; ) {
+    var p = t[o];
+    this.set(p[0], p[1]);
+  }
+}
+e.prototype.clear = r;
+e.prototype.delete = m;
+e.prototype.get = h;
+e.prototype.has = l;
+e.prototype.set = c;
 export {
-  r as default
+  e as default
 };
 //# sourceMappingURL=design-system196.mjs.map

package/dist/design-system196.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system196.mjs","sources":["../node_modules/lodash-es/_getPrototype.js"],"sourcesContent":["import overArg from './_overArg.js';\n\n/** Built-in value references. */\nvar getPrototype = overArg(Object.getPrototypeOf, Object);\n\nexport default getPrototype;\n"],"names":["getPrototype","overArg","getPrototype$1"],"mappings":";AAGA,IAAIA,IAAeC,EAAQ,OAAO,gBAAgB,MAAM;AAExD,MAAAC,IAAeF;","x_google_ignoreList":[0]}
+{"version":3,"file":"design-system196.mjs","sources":["../node_modules/lodash-es/_MapCache.js"],"sourcesContent":["import mapCacheClear from './_mapCacheClear.js';\nimport mapCacheDelete from './_mapCacheDelete.js';\nimport mapCacheGet from './_mapCacheGet.js';\nimport mapCacheHas from './_mapCacheHas.js';\nimport mapCacheSet from './_mapCacheSet.js';\n\n/**\n * Creates a map cache object to store key-value pairs.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction MapCache(entries) {\n  var index = -1,\n      length = entries == null ? 0 : entries.length;\n\n  this.clear();\n  while (++index < length) {\n    var entry = entries[index];\n    this.set(entry[0], entry[1]);\n  }\n}\n\n// Add methods to `MapCache`.\nMapCache.prototype.clear = mapCacheClear;\nMapCache.prototype['delete'] = mapCacheDelete;\nMapCache.prototype.get = mapCacheGet;\nMapCache.prototype.has = mapCacheHas;\nMapCache.prototype.set = mapCacheSet;\n\nexport default MapCache;\n"],"names":["MapCache","entries","index","length","entry","mapCacheClear","mapCacheDelete","mapCacheGet","mapCacheHas","mapCacheSet"],"mappings":";;;;;AAaA,SAASA,EAASC,GAAS;AACzB,MAAIC,IAAQ,IACRC,IAASF,KAAW,OAAO,IAAIA,EAAQ;AAG3C,OADA,KAAK,MAAK,GACH,EAAEC,IAAQC,KAAQ;AACvB,QAAIC,IAAQH,EAAQC,CAAK;AACzB,SAAK,IAAIE,EAAM,CAAC,GAAGA,EAAM,CAAC,CAAC;AAAA,EAC5B;AACH;AAGAJ,EAAS,UAAU,QAAQK;AAC3BL,EAAS,UAAU,SAAYM;AAC/BN,EAAS,UAAU,MAAMO;AACzBP,EAAS,UAAU,MAAMQ;AACzBR,EAAS,UAAU,MAAMS;","x_google_ignoreList":[0]}

package/dist/design-system197.mjs

@@ -1,9 +1,14 @@
-function e(r, n) {
-  return function(t) {
-    return r(n(t));
+import a from "./design-system218.mjs";
+import t from "./design-system205.mjs";
+import e from "./design-system184.mjs";
+function o() {
+  this.size = 0, this.__data__ = {
+    hash: new a(),
+    map: new (e || t)(),
+    string: new a()
   };
 }
 export {
-  e as default
+  o as default
 };
 //# sourceMappingURL=design-system197.mjs.map

package/dist/design-system197.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system197.mjs","sources":["../node_modules/lodash-es/_overArg.js"],"sourcesContent":["/**\n * Creates a unary function that invokes `func` with its argument transformed.\n *\n * @private\n * @param {Function} func The function to wrap.\n * @param {Function} transform The argument transform.\n * @returns {Function} Returns the new function.\n */\nfunction overArg(func, transform) {\n  return function(arg) {\n    return func(transform(arg));\n  };\n}\n\nexport default overArg;\n"],"names":["overArg","func","transform","arg"],"mappings":"AAQA,SAASA,EAAQC,GAAMC,GAAW;AAChC,SAAO,SAASC,GAAK;AACnB,WAAOF,EAAKC,EAAUC,CAAG,CAAC;AAAA,EAC9B;AACA;","x_google_ignoreList":[0]}
+{"version":3,"file":"design-system197.mjs","sources":["../node_modules/lodash-es/_mapCacheClear.js"],"sourcesContent":["import Hash from './_Hash.js';\nimport ListCache from './_ListCache.js';\nimport Map from './_Map.js';\n\n/**\n * Removes all key-value entries from the map.\n *\n * @private\n * @name clear\n * @memberOf MapCache\n */\nfunction mapCacheClear() {\n  this.size = 0;\n  this.__data__ = {\n    'hash': new Hash,\n    'map': new (Map || ListCache),\n    'string': new Hash\n  };\n}\n\nexport default mapCacheClear;\n"],"names":["mapCacheClear","Hash","Map","ListCache"],"mappings":";;;AAWA,SAASA,IAAgB;AACvB,OAAK,OAAO,GACZ,KAAK,WAAW;AAAA,IACd,MAAQ,IAAIC;AAAA,IACZ,KAAO,KAAKC,KAAOC;AAAA,IACnB,QAAU,IAAIF;AAAA,EAClB;AACA;","x_google_ignoreList":[0]}

package/dist/design-system198.mjs

@@ -1,7 +1,7 @@
-function i(r, t) {
-  for (var e = -1, a = Array(r); ++e < r; )
-    a[e] = t(e);
-  return a;
+import a from "./design-system219.mjs";
+function i(e) {
+  var t = a(this, e).delete(e);
+  return this.size -= t ? 1 : 0, t;
 }
 export {
   i as default

package/dist/design-system198.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system198.mjs","sources":["../node_modules/lodash-es/_baseTimes.js"],"sourcesContent":["/**\n * The base implementation of `_.times` without support for iteratee shorthands\n * or max array length checks.\n *\n * @private\n * @param {number} n The number of times to invoke `iteratee`.\n * @param {Function} iteratee The function invoked per iteration.\n * @returns {Array} Returns the array of results.\n */\nfunction baseTimes(n, iteratee) {\n  var index = -1,\n      result = Array(n);\n\n  while (++index < n) {\n    result[index] = iteratee(index);\n  }\n  return result;\n}\n\nexport default baseTimes;\n"],"names":["baseTimes","n","iteratee","index","result"],"mappings":"AASA,SAASA,EAAUC,GAAGC,GAAU;AAI9B,WAHIC,IAAQ,IACRC,IAAS,MAAMH,CAAC,GAEb,EAAEE,IAAQF;AACf,IAAAG,EAAOD,CAAK,IAAID,EAASC,CAAK;AAEhC,SAAOC;AACT;","x_google_ignoreList":[0]}
+{"version":3,"file":"design-system198.mjs","sources":["../node_modules/lodash-es/_mapCacheDelete.js"],"sourcesContent":["import getMapData from './_getMapData.js';\n\n/**\n * Removes `key` and its value from the map.\n *\n * @private\n * @name delete\n * @memberOf MapCache\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction mapCacheDelete(key) {\n  var result = getMapData(this, key)['delete'](key);\n  this.size -= result ? 1 : 0;\n  return result;\n}\n\nexport default mapCacheDelete;\n"],"names":["mapCacheDelete","key","result","getMapData"],"mappings":";AAWA,SAASA,EAAeC,GAAK;AAC3B,MAAIC,IAASC,EAAW,MAAMF,CAAG,EAAE,OAAUA,CAAG;AAChD,cAAK,QAAQC,IAAS,IAAI,GACnBA;AACT;","x_google_ignoreList":[0]}

package/dist/design-system199.mjs

@@ -1,9 +1,8 @@
-var o = 9007199254740991, d = /^(?:0|[1-9]\d*)$/;
-function f(r, s) {
-  var t = typeof r;
-  return s = s ?? o, !!s && (t == "number" || t != "symbol" && d.test(r)) && r > -1 && r % 1 == 0 && r < s;
+import a from "./design-system219.mjs";
+function r(t) {
+  return a(this, t).get(t);
 }
 export {
-  f as default
+  r as default
 };
 //# sourceMappingURL=design-system199.mjs.map

package/dist/design-system199.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system199.mjs","sources":["../node_modules/lodash-es/_isIndex.js"],"sourcesContent":["/** Used as references for various `Number` constants. */\nvar MAX_SAFE_INTEGER = 9007199254740991;\n\n/** Used to detect unsigned integer values. */\nvar reIsUint = /^(?:0|[1-9]\\d*)$/;\n\n/**\n * Checks if `value` is a valid array-like index.\n *\n * @private\n * @param {*} value The value to check.\n * @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.\n * @returns {boolean} Returns `true` if `value` is a valid index, else `false`.\n */\nfunction isIndex(value, length) {\n  var type = typeof value;\n  length = length == null ? MAX_SAFE_INTEGER : length;\n\n  return !!length &&\n    (type == 'number' ||\n      (type != 'symbol' && reIsUint.test(value))) &&\n        (value > -1 && value % 1 == 0 && value < length);\n}\n\nexport default isIndex;\n"],"names":["MAX_SAFE_INTEGER","reIsUint","isIndex","value","length","type"],"mappings":"AACA,IAAIA,IAAmB,kBAGnBC,IAAW;AAUf,SAASC,EAAQC,GAAOC,GAAQ;AAC9B,MAAIC,IAAO,OAAOF;AAClB,SAAAC,IAASA,KAAiBJ,GAEnB,CAAC,CAACI,MACNC,KAAQ,YACNA,KAAQ,YAAYJ,EAAS,KAAKE,CAAK,MACrCA,IAAQ,MAAMA,IAAQ,KAAK,KAAKA,IAAQC;AACjD;","x_google_ignoreList":[0]}
+{"version":3,"file":"design-system199.mjs","sources":["../node_modules/lodash-es/_mapCacheGet.js"],"sourcesContent":["import getMapData from './_getMapData.js';\n\n/**\n * Gets the map value for `key`.\n *\n * @private\n * @name get\n * @memberOf MapCache\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction mapCacheGet(key) {\n  return getMapData(this, key).get(key);\n}\n\nexport default mapCacheGet;\n"],"names":["mapCacheGet","key","getMapData"],"mappings":";AAWA,SAASA,EAAYC,GAAK;AACxB,SAAOC,EAAW,MAAMD,CAAG,EAAE,IAAIA,CAAG;AACtC;","x_google_ignoreList":[0]}

package/dist/design-system2.mjs

@@ -1,8 +1,12 @@
-import { padStartZero as a } from "./design-system49.mjs";
+import { padStartZero as o } from "./design-system48.mjs";
 import { computed as m } from "vue";
-import { useI18n as g } from "./design-system50.mjs";
-function D() {
-  const { t: e, locale: d } = g(), u = m(() => ({
+import { useI18n as v } from "./design-system49.mjs";
+import { DateDelimiter as d } from "./design-system4.mjs";
+function S() {
+  const { t: e, locale: r } = v(), h = m(() => ({
+    "en-US": `MM${d}DD${d}YYYY`,
+    "vi-VN": `DD${d}MM${d}YYYY`
+  })[r.value]), _ = m(() => ({
     0: e("ds.components.base.date_picker.days.sunday"),
     1: e("ds.components.base.date_picker.days.monday"),
     2: e("ds.components.base.date_picker.days.tuesday"),
@@ -10,7 +14,7 @@ function D() {
     4: e("ds.components.base.date_picker.days.thursday"),
     5: e("ds.components.base.date_picker.days.friday"),
     6: e("ds.components.base.date_picker.days.saturday")
-  })), p = m(() => ({
+  })), u = m(() => ({
     0: e("ds.components.base.date_picker.months.january"),
     1: e("ds.components.base.date_picker.months.february"),
     2: e("ds.components.base.date_picker.months.march"),
@@ -23,7 +27,7 @@ function D() {
     9: e("ds.components.base.date_picker.months.october"),
     10: e("ds.components.base.date_picker.months.november"),
     11: e("ds.components.base.date_picker.months.december")
-  })), h = m(() => ({
+  })), i = m(() => ({
     0: e("ds.components.base.date_picker.months_short.january"),
     1: e("ds.components.base.date_picker.months_short.february"),
     2: e("ds.components.base.date_picker.months_short.march"),
@@ -36,7 +40,7 @@ function D() {
     9: e("ds.components.base.date_picker.months_short.october"),
     10: e("ds.components.base.date_picker.months_short.november"),
     11: e("ds.components.base.date_picker.months_short.december")
-  })), i = m(() => ({
+  })), b = m(() => ({
     0: e("ds.components.base.date_picker.days_short.sunday"),
     1: e("ds.components.base.date_picker.days_short.monday"),
     2: e("ds.components.base.date_picker.days_short.tuesday"),
@@ -44,37 +48,43 @@ function D() {
     4: e("ds.components.base.date_picker.days_short.thursday"),
     5: e("ds.components.base.date_picker.days_short.friday"),
     6: e("ds.components.base.date_picker.days_short.saturday")
-  })), _ = (s) => {
-    if (!r(s))
+  })), l = (s) => {
+    const t = s.split(d);
+    return {
+      "en-US": new Date(+t[2], +t[0] - 1, +t[1]),
+      "vi-VN": new Date(+t[2], +t[1] - 1, +t[0])
+    }[r.value];
+  }, y = (s) => {
+    if (!p(s))
       return s;
-    const t = u.value[s.getDay()], c = p.value[s.getMonth()], o = `${t}, ${c} ${s.getDate()}, ${s.getFullYear()}`, n = `${t}, ${s.getDate()}/${s.getMonth() + 1}/${s.getFullYear()}`;
+    const t = _.value[s.getDay()], c = u.value[s.getMonth()], n = `${t}, ${c} ${s.getDate()}, ${s.getFullYear()}`, a = `${t}, ${s.getDate()}/${s.getMonth() + 1}/${s.getFullYear()}`;
     return {
-      "en-US": o,
-      "vi-VN": n
-    }[d.value] || o;
-  }, b = (s) => r(s) ? {
-    "vi-VN": `${a(s.getDate(), 2)}/${a(
+      "en-US": n,
+      "vi-VN": a
+    }[r.value] || n;
+  }, k = (s) => p(s) ? {
+    "vi-VN": `${o(s.getDate(), 2)}/${o(
       s.getMonth() + 1,
       2
-    )}/${a(s.getFullYear(), 4)}`,
-    "en-US": `${p.value[s.getMonth()]} ${a(
-      s.getDate(),
+    )}/${o(s.getFullYear(), 4)}`,
+    "en-US": `${o(
+      s.getMonth() + 1,
       2
-    )}, ${s.getFullYear()}`
-  }[d.value] : s, y = (s) => {
-    if (!r(s))
+    )}/${o(s.getDate(), 2)}/${o(s.getFullYear(), 4)}`
+  }[r.value] : s, $ = (s) => {
+    if (!p(s))
       return s;
-    const t = new Date(s), c = t.getHours(), o = t.getMinutes(), n = `${a(c, 2)}:${a(o, 2)}`;
+    const t = new Date(s), c = t.getHours(), n = t.getMinutes(), a = `${o(c, 2)}:${o(n, 2)}`;
     return {
-      "vi-VN": n,
-      "en-US": n
-    }[d.value];
-  }, l = (s, t = "full") => {
-    if (!r(s))
+      "vi-VN": a,
+      "en-US": a
+    }[r.value];
+  }, f = (s, t = "full") => {
+    if (!p(s))
       return s;
-    const o = {
-      full: p.value,
-      short: h.value,
+    const n = {
+      full: u.value,
+      short: i.value,
       number: [
         "01",
         "02",
@@ -89,19 +99,21 @@ function D() {
         "11",
         "12"
       ]
-    }[t][s.getMonth()], n = s.getFullYear();
-    return `${t === "number" ? `${o}/` : `${o} `}${n}`;
-  }, r = (s) => s ? s.toString() !== "Invalid Date" : !1;
+    }[t][s.getMonth()], a = s.getFullYear();
+    return `${t === "number" ? `${n}/` : `${n} `}${a}`;
+  }, p = (s) => s ? s.toString() !== "Invalid Date" : !1;
   return {
-    formatTime: y,
-    formatDate: b,
-    formatDateHuge: _,
-    formatMonthYear: l,
-    dayShortNames: i,
-    monthShortNames: h
+    formatTime: $,
+    formatDate: k,
+    formatDateHuge: y,
+    formatMonthYear: f,
+    dayShortNames: b,
+    monthShortNames: i,
+    dateFormat: h,
+    convertToDate: l
   };
 }
 export {
-  D as useDate
+  S as useDate
 };
 //# sourceMappingURL=design-system2.mjs.map

package/dist/design-system2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system2.mjs","sources":["../src/composables/Date.ts"],"sourcesContent":["import { padStartZero } from '@/helpers/DateHelper';\nimport { computed } from 'vue';\nimport { useI18n } from 'vue-i18n';\n\nexport function useDate() {\n  /**\n   * Data\n   */\n  const { t, locale } = useI18n();\n  const dayNames = computed<Record<number, string>>(() => ({\n    0: t('ds.components.base.date_picker.days.sunday'),\n    1: t('ds.components.base.date_picker.days.monday'),\n    2: t('ds.components.base.date_picker.days.tuesday'),\n    3: t('ds.components.base.date_picker.days.wednesday'),\n    4: t('ds.components.base.date_picker.days.thursday'),\n    5: t('ds.components.base.date_picker.days.friday'),\n    6: t('ds.components.base.date_picker.days.saturday'),\n  }));\n  const monthNames = computed<Record<number, string>>(() => ({\n    0: t('ds.components.base.date_picker.months.january'),\n    1: t('ds.components.base.date_picker.months.february'),\n    2: t('ds.components.base.date_picker.months.march'),\n    3: t('ds.components.base.date_picker.months.april'),\n    4: t('ds.components.base.date_picker.months.may'),\n    5: t('ds.components.base.date_picker.months.june'),\n    6: t('ds.components.base.date_picker.months.july'),\n    7: t('ds.components.base.date_picker.months.august'),\n    8: t('ds.components.base.date_picker.months.september'),\n    9: t('ds.components.base.date_picker.months.october'),\n    10: t('ds.components.base.date_picker.months.november'),\n    11: t('ds.components.base.date_picker.months.december'),\n  }));\n  const monthShortNames = computed<Record<number, string>>(() => ({\n    0: t('ds.components.base.date_picker.months_short.january'),\n    1: t('ds.components.base.date_picker.months_short.february'),\n    2: t('ds.components.base.date_picker.months_short.march'),\n    3: t('ds.components.base.date_picker.months_short.april'),\n    4: t('ds.components.base.date_picker.months_short.may'),\n    5: t('ds.components.base.date_picker.months_short.june'),\n    6: t('ds.components.base.date_picker.months_short.july'),\n    7: t('ds.components.base.date_picker.months_short.august'),\n    8: t('ds.components.base.date_picker.months_short.september'),\n    9: t('ds.components.base.date_picker.months_short.october'),\n    10: t('ds.components.base.date_picker.months_short.november'),\n    11: t('ds.components.base.date_picker.months_short.december'),\n  }));\n  const dayShortNames = computed<Record<number, string>>(() => ({\n    0: t('ds.components.base.date_picker.days_short.sunday'),\n    1: t('ds.components.base.date_picker.days_short.monday'),\n    2: t('ds.components.base.date_picker.days_short.tuesday'),\n    3: t('ds.components.base.date_picker.days_short.wednesday'),\n    4: t('ds.components.base.date_picker.days_short.thursday'),\n    5: t('ds.components.base.date_picker.days_short.friday'),\n    6: t('ds.components.base.date_picker.days_short.saturday'),\n  }));\n\n  /**\n   * Methods\n   */\n  const formatDateHuge = (date: Date) => {\n    if (!validateDate(date)) {\n      return date;\n    }\n\n    const dayName = dayNames.value[date.getDay()];\n    const monthName = monthNames.value[date.getMonth()];\n    const enUSResult = `${dayName}, ${monthName} ${date.getDate()}, ${date.getFullYear()}`;\n    const viVNResult = `${dayName}, ${date.getDate()}/${\n      date.getMonth() + 1\n    }/${date.getFullYear()}`;\n\n    const result: Record<string, string> = {\n      'en-US': enUSResult,\n      'vi-VN': viVNResult,\n    };\n\n    return result[locale.value] || enUSResult;\n  };\n  const formatDate = (date: Date) => {\n    if (!validateDate(date)) {\n      return date;\n    }\n\n    const result: Record<string, string> = {\n      'vi-VN': `${padStartZero(date.getDate(), 2)}/${padStartZero(\n        date.getMonth() + 1,\n        2,\n      )}/${padStartZero(date.getFullYear(), 4)}`,\n      'en-US': `${monthNames.value[date.getMonth()]} ${padStartZero(\n        date.getDate(),\n        2,\n      )}, ${date.getFullYear()}`,\n    };\n\n    return result[locale.value];\n  };\n  const formatTime = (date: Date) => {\n    if (!validateDate(date)) {\n      return date;\n    }\n\n    const d = new Date(date);\n    const h = d.getHours();\n    const m = d.getMinutes();\n    const formattedStr = `${padStartZero(h, 2)}:${padStartZero(m, 2)}`;\n\n    const result: Record<string, string> = {\n      'vi-VN': formattedStr,\n      'en-US': formattedStr,\n    };\n\n    return result[locale.value];\n  };\n  const formatMonthYear = (\n    date: Date,\n    type: 'full' | 'short' | 'number' = 'full',\n  ) => {\n    if (!validateDate(date)) {\n      return date;\n    }\n\n    const months = {\n      full: monthNames.value,\n      short: monthShortNames.value,\n      number: [\n        '01',\n        '02',\n        '03',\n        '04',\n        '05',\n        '06',\n        '07',\n        '08',\n        '09',\n        '10',\n        '11',\n        '12',\n      ],\n    };\n\n    const monthName = months[type][date.getMonth()];\n    const year = date.getFullYear();\n    return `${type === 'number' ? `${monthName}/` : `${monthName} `}${year}`;\n  };\n  const validateDate = (date: Date) =>\n    date ? date.toString() !== 'Invalid Date' : false;\n\n  return {\n    formatTime,\n    formatDate,\n    formatDateHuge,\n    formatMonthYear,\n    dayShortNames,\n    monthShortNames,\n  };\n}\n"],"names":["useDate","t","locale","useI18n","dayNames","computed","monthNames","monthShortNames","dayShortNames","formatDateHuge","date","validateDate","dayName","monthName","enUSResult","viVNResult","formatDate","padStartZero","formatTime","d","h","m","formattedStr","formatMonthYear","type","year"],"mappings":"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"}
+{"version":3,"file":"design-system2.mjs","sources":["../src/composables/Date.ts"],"sourcesContent":["import { padStartZero } from '@/helpers/DateHelper';\nimport { computed } from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport { DateDelimiter } from '@/constants/Common';\n\nexport function useDate() {\n  /**\n   * Data\n   */\n  const { t, locale } = useI18n();\n  const dateFormat = computed(() => {\n    const result: Record<string, string> = {\n      'en-US': `MM${DateDelimiter}DD${DateDelimiter}YYYY`,\n      'vi-VN': `DD${DateDelimiter}MM${DateDelimiter}YYYY`,\n    };\n    return result[locale.value];\n  });\n  const dayNames = computed<Record<number, string>>(() => ({\n    0: t('ds.components.base.date_picker.days.sunday'),\n    1: t('ds.components.base.date_picker.days.monday'),\n    2: t('ds.components.base.date_picker.days.tuesday'),\n    3: t('ds.components.base.date_picker.days.wednesday'),\n    4: t('ds.components.base.date_picker.days.thursday'),\n    5: t('ds.components.base.date_picker.days.friday'),\n    6: t('ds.components.base.date_picker.days.saturday'),\n  }));\n  const monthNames = computed<Record<number, string>>(() => ({\n    0: t('ds.components.base.date_picker.months.january'),\n    1: t('ds.components.base.date_picker.months.february'),\n    2: t('ds.components.base.date_picker.months.march'),\n    3: t('ds.components.base.date_picker.months.april'),\n    4: t('ds.components.base.date_picker.months.may'),\n    5: t('ds.components.base.date_picker.months.june'),\n    6: t('ds.components.base.date_picker.months.july'),\n    7: t('ds.components.base.date_picker.months.august'),\n    8: t('ds.components.base.date_picker.months.september'),\n    9: t('ds.components.base.date_picker.months.october'),\n    10: t('ds.components.base.date_picker.months.november'),\n    11: t('ds.components.base.date_picker.months.december'),\n  }));\n  const monthShortNames = computed<Record<number, string>>(() => ({\n    0: t('ds.components.base.date_picker.months_short.january'),\n    1: t('ds.components.base.date_picker.months_short.february'),\n    2: t('ds.components.base.date_picker.months_short.march'),\n    3: t('ds.components.base.date_picker.months_short.april'),\n    4: t('ds.components.base.date_picker.months_short.may'),\n    5: t('ds.components.base.date_picker.months_short.june'),\n    6: t('ds.components.base.date_picker.months_short.july'),\n    7: t('ds.components.base.date_picker.months_short.august'),\n    8: t('ds.components.base.date_picker.months_short.september'),\n    9: t('ds.components.base.date_picker.months_short.october'),\n    10: t('ds.components.base.date_picker.months_short.november'),\n    11: t('ds.components.base.date_picker.months_short.december'),\n  }));\n  const dayShortNames = computed<Record<number, string>>(() => ({\n    0: t('ds.components.base.date_picker.days_short.sunday'),\n    1: t('ds.components.base.date_picker.days_short.monday'),\n    2: t('ds.components.base.date_picker.days_short.tuesday'),\n    3: t('ds.components.base.date_picker.days_short.wednesday'),\n    4: t('ds.components.base.date_picker.days_short.thursday'),\n    5: t('ds.components.base.date_picker.days_short.friday'),\n    6: t('ds.components.base.date_picker.days_short.saturday'),\n  }));\n\n  /**\n   * Methods\n   */\n  const convertToDate = (val: string) => {\n    const arr = val.split(DateDelimiter);\n    const result: Record<string, Date> = {\n      'en-US': new Date(+arr[2], +arr[0] - 1, +arr[1]),\n      'vi-VN': new Date(+arr[2], +arr[1] - 1, +arr[0]),\n    };\n    return result[locale.value];\n  };\n  const formatDateHuge = (date: Date) => {\n    if (!validateDate(date)) {\n      return date;\n    }\n\n    const dayName = dayNames.value[date.getDay()];\n    const monthName = monthNames.value[date.getMonth()];\n    const enUSResult = `${dayName}, ${monthName} ${date.getDate()}, ${date.getFullYear()}`;\n    const viVNResult = `${dayName}, ${date.getDate()}/${\n      date.getMonth() + 1\n    }/${date.getFullYear()}`;\n\n    const result: Record<string, string> = {\n      'en-US': enUSResult,\n      'vi-VN': viVNResult,\n    };\n\n    return result[locale.value] || enUSResult;\n  };\n  const formatDate = (date: Date) => {\n    if (!validateDate(date)) {\n      return date;\n    }\n\n    const result: Record<string, string> = {\n      'vi-VN': `${padStartZero(date.getDate(), 2)}/${padStartZero(\n        date.getMonth() + 1,\n        2,\n      )}/${padStartZero(date.getFullYear(), 4)}`,\n      'en-US': `${padStartZero(\n        date.getMonth() + 1,\n        2,\n      )}/${padStartZero(date.getDate(), 2)}/${padStartZero(date.getFullYear(), 4)}`,\n    };\n\n    return result[locale.value];\n  };\n  const formatTime = (date: Date) => {\n    if (!validateDate(date)) {\n      return date;\n    }\n\n    const d = new Date(date);\n    const h = d.getHours();\n    const m = d.getMinutes();\n    const formattedStr = `${padStartZero(h, 2)}:${padStartZero(m, 2)}`;\n\n    const result: Record<string, string> = {\n      'vi-VN': formattedStr,\n      'en-US': formattedStr,\n    };\n\n    return result[locale.value];\n  };\n  const formatMonthYear = (\n    date: Date,\n    type: 'full' | 'short' | 'number' = 'full',\n  ) => {\n    if (!validateDate(date)) {\n      return date;\n    }\n\n    const months = {\n      full: monthNames.value,\n      short: monthShortNames.value,\n      number: [\n        '01',\n        '02',\n        '03',\n        '04',\n        '05',\n        '06',\n        '07',\n        '08',\n        '09',\n        '10',\n        '11',\n        '12',\n      ],\n    };\n\n    const monthName = months[type][date.getMonth()];\n    const year = date.getFullYear();\n    return `${type === 'number' ? `${monthName}/` : `${monthName} `}${year}`;\n  };\n  const validateDate = (date: Date) =>\n    date ? date.toString() !== 'Invalid Date' : false;\n\n  return {\n    formatTime,\n    formatDate,\n    formatDateHuge,\n    formatMonthYear,\n    dayShortNames,\n    monthShortNames,\n    dateFormat,\n    convertToDate,\n  };\n}\n"],"names":["useDate","t","locale","useI18n","dateFormat","computed","DateDelimiter","dayNames","monthNames","monthShortNames","dayShortNames","convertToDate","val","arr","formatDateHuge","date","validateDate","dayName","monthName","enUSResult","viVNResult","formatDate","padStartZero","formatTime","d","h","m","formattedStr","formatMonthYear","type","year"],"mappings":"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"}

package/dist/design-system20.mjs

@@ -1,127 +1,207 @@
-import { defineComponent as P, computed as f, openBlock as C, createElementBlock as O, createElementVNode as s, normalizeClass as n, toDisplayString as u, withDirectives as o, vShow as i } from "vue";
-import { BPaginationSize as p } from "./design-system5.mjs";
-const B = { class: "ds-inline-flex ds-space-x-1" }, y = /* @__PURE__ */ s("svg", {
-  class: "ds-h-4 ds-w-4 ds-fill-black/80",
-  viewBox: "0 0 320 512",
-  xmlns: "http://www.w3.org/2000/svg"
-}, [
-  /* @__PURE__ */ s("path", { d: "M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z" })
-], -1), x = [
-  y
-], z = /* @__PURE__ */ s("svg", {
-  class: "ds-h-4 ds-w-4 ds-fill-black/80",
-  viewBox: "0 0 320 512",
-  xmlns: "http://www.w3.org/2000/svg"
-}, [
-  /* @__PURE__ */ s("path", { d: "M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" })
-], -1), $ = [
-  z
-], V = 1, g = "...", E = /* @__PURE__ */ P({
-  __name: "BPagination",
+import { defineComponent as J, ref as i, computed as k, watch as E, nextTick as L, onMounted as K, onBeforeUnmount as Q, openBlock as o, createElementBlock as d, createElementVNode as n, createVNode as X, createBlock as R, withCtx as Y, normalizeClass as r, toDisplayString as M, createTextVNode as Z, withDirectives as ee, Fragment as se, renderList as te, vShow as le, unref as oe, createCommentVNode as ae } from "vue";
+import { useValidationField as de } from "./design-system3.mjs";
+import { lockScrollBody as ne, unlockScrollBody as P, ensureVisiblePosition as ue, resetPosition as ie } from "./design-system6.mjs";
+import { useI18n as re } from "./design-system49.mjs";
+import ce from "./design-system14.mjs";
+import ve from "./design-system15.mjs";
+import pe from "./design-system39.mjs";
+import fe from "./design-system98.mjs";
+const me = /* @__PURE__ */ n("path", { d: "M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z" }, null, -1), he = [
+  me
+], be = ["id", "disabled"], ge = { key: 0 }, ke = {
+  key: 1,
+  class: "ds-text-black/[0.4]"
+}, we = /* @__PURE__ */ n("path", { d: "M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z" }, null, -1), ye = [
+  we
+], Ce = ["id", "data-cy", "data-ut"], xe = { class: "ds-max-h-72 ds-overflow-y-auto ds-rounded-lg ds-bg-white ds-shadow" }, _e = { class: "ds-py-1 ds-text-sm ds-text-black/[0.85]" }, Ee = ["onClick"], Te = /* @__PURE__ */ J({
+  __name: "BSelect",
   props: {
+    inputId: { default: "" },
     modelValue: {},
-    numberOfPages: {},
-    border: { type: Boolean, default: !1 },
-    transparent: { type: Boolean, default: !1 },
-    size: { default: p.Medium }
+    label: { default: "" },
+    items: {},
+    disabled: { type: Boolean, default: !1 },
+    placeholder: { default: "" },
+    valueCssClass: { default: "" },
+    menuCssClass: { default: "" },
+    validationRules: { default: void 0 },
+    required: { type: Boolean, default: !1 },
+    requiredErrorMessage: { default: "" },
+    hideDetails: { type: Boolean, default: !1 },
+    allowInput: { type: Boolean, default: !1 }
   },
-  emits: ["change", "update:modelValue"],
-  setup(b, { emit: w }) {
-    const d = b, v = w, e = f({
+  emits: ["change", "open", "close", "change:input", "update:modelValue"],
+  setup(S, { expose: T, emit: z }) {
+    const s = S, c = z, v = i(null), w = i(null), p = i(null), a = i(!1), { t: D } = re(), F = {
+      validateRule: (e) => !!e,
+      errorMessage: () => s.requiredErrorMessage || D("ds.global.field_required")
+    }, y = i(""), f = i(), m = k(() => s.inputId || `id-${fe()}`), u = k({
       get() {
-        return d.modelValue + 1;
+        return s.modelValue;
       },
-      set(l) {
-        v("update:modelValue", l - 1);
+      set(e) {
+        c("update:modelValue", e);
       }
-    }), t = f(() => {
-      let l = `
-  ds-flex ds-items-center ds-justify-center
-  ds-rounded-lg `;
-      switch (d.border && (l += "ds-border ds-border-gray-300 "), d.size) {
-        case p.Small:
-          l += "ds-w-8 ds-h-8 ";
-          break;
-        case p.Medium:
-        default:
-          l += "ds-w-10 ds-h-10 ";
-          break;
+    }), N = k(() => {
+      let e = "ds-border ds-drop-shadow-light ds-text-sm ds-h-[40px] ds-px-3 ds-rounded-lg ds-block ds-w-full ds-inline-flex ds-items-center ds-justify-between ";
+      return e += s.disabled ? "ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/[0.4] " : "ds-bg-white ds-text-black/[0.85] ", e += B.value.valid ? "ds-border-black/10 focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus " : "ds-border-error focus:ds-ring-1 focus:ds-ring-error ", e;
+    }), O = k(() => {
+      let e = [];
+      return s.required && e.push(F), s.validationRules && (e = e.concat(s.validationRules)), e.length ? e : void 0;
+    }), { validate: $, validationResult: B } = de(
+      m.value,
+      u,
+      O.value
+    );
+    E(a, (e) => {
+      e ? (ne(), G(), c("open")) : (P(), q(), c("close"));
+    }), E(u, () => {
+      C(), h();
+    }), E(
+      () => s.items,
+      () => {
+        var e;
+        u.value && !((e = f.value) != null && e.value) && (C(), h());
+      },
+      {
+        deep: !0
       }
-      return l;
-    }), c = (l) => {
-      e.value = l, v("change", e.value);
-    }, k = () => {
-      e.value > 1 && (e.value--, v("change", e.value));
+    );
+    const C = () => {
+      var e;
+      f.value = (e = s.items) == null ? void 0 : e.find((t) => t.value === u.value);
     }, h = () => {
-      e.value < d.numberOfPages && (e.value++, v("change", e.value));
-    }, r = (l = !0) => l ? "ds-text-white ds-bg-primary-t " : `ds-text-black/80 hover:ds-bg-primary-t/10 ${d.transparent ? "ds-bg-transparent" : "ds-bg-white"}`;
-    return (l, a) => (C(), O("nav", null, [
-      s("ul", B, [
-        s("li", {
-          class: n([[t.value, r(!1)], "ds-ml-0 ds-cursor-pointer"]),
-          onClick: k
-        }, x, 2),
-        s("li", {
-          class: n([[r(e.value === 1), t.value], "ds-cursor-pointer"]),
-          onClick: a[0] || (a[0] = (m) => c(1))
-        }, [
-          s("a", null, u(V))
-        ], 2),
-        o(s("li", {
-          class: n([[t.value], "ds-cursor-default"])
-        }, [
-          s("a", null, u(g))
-        ], 2), [
-          [i, e.value > 3]
-        ]),
-        o(s("li", {
-          class: n([[t.value, r(!1)], "ds-cursor-pointer"]),
-          onClick: a[1] || (a[1] = (m) => c(e.value - 1))
-        }, [
-          s("a", null, u(e.value - 1), 1)
-        ], 2), [
-          [i, e.value > 2]
-        ]),
-        o(s("li", {
-          class: n([[t.value, r()], "ds-cursor-pointer"]),
-          onClick: a[2] || (a[2] = (m) => c(e.value))
-        }, [
-          s("a", null, u(e.value), 1)
-        ], 2), [
-          [i, e.value !== 1 && e.value !== l.numberOfPages]
-        ]),
-        o(s("li", {
-          class: n([[t.value, r(!1)], "ds-cursor-pointer"]),
-          onClick: a[3] || (a[3] = (m) => c(e.value + 1))
-        }, [
-          s("a", null, u(e.value + 1), 1)
-        ], 2), [
-          [i, e.value < l.numberOfPages - 1]
-        ]),
-        o(s("li", {
-          class: n([[t.value], "ds-cursor-default"])
-        }, [
-          s("a", null, u(g))
-        ], 2), [
-          [i, e.value < l.numberOfPages - 2]
-        ]),
-        o(s("li", {
-          class: n([[t.value, r(e.value === l.numberOfPages)], "ds-cursor-pointer"]),
-          onClick: a[4] || (a[4] = (m) => c(l.numberOfPages))
+      var e;
+      s.allowInput && (y.value = ((e = f.value) == null ? void 0 : e.text) || "");
+    }, U = () => {
+      document.addEventListener("keydown", V);
+    }, V = (e) => {
+      e.key === "Escape" && x();
+    }, W = () => {
+      document.addEventListener("click", I);
+    }, I = (e) => {
+      [v.value, p.value].some((b) => e.composedPath().includes(b)) || x();
+    }, j = (e) => {
+      u.value = e.value, x(), c("change", e.value), L(() => {
+        $();
+      });
+    }, A = (e, t) => {
+      t.style.width = `${e.offsetWidth}px`;
+    }, G = () => {
+      L(() => {
+        ue(v.value, p.value), A(v.value, p.value);
+      });
+    }, q = () => {
+      ie(v.value, p.value);
+    }, H = (e) => {
+      c("change:input", e);
+    }, x = () => {
+      var e;
+      a.value = !1, (e = w.value) == null || e.blur(), h();
+    };
+    return (() => {
+      C(), h();
+    })(), K(() => {
+      U(), W();
+    }), Q(() => {
+      document.removeEventListener("keydown", V), document.removeEventListener("click", I), P(), q();
+    }), T({ validate: $, selectMenu: a }), (e, t) => {
+      var _, b;
+      return o(), d("div", null, [
+        n("div", {
+          ref_key: "selectEl",
+          ref: v
         }, [
-          s("a", null, u(l.numberOfPages), 1)
-        ], 2), [
-          [i, l.numberOfPages > 1]
-        ]),
-        s("li", {
-          class: n([[t.value, r(!1)], "ds-cursor-pointer"]),
-          onClick: h
-        }, $, 2)
-      ])
-    ]));
+          X(ve, {
+            id: m.value,
+            label: e.label,
+            required: e.required
+          }, null, 8, ["id", "label", "required"]),
+          s.allowInput ? (o(), R(pe, {
+            key: 0,
+            id: m.value,
+            ref_key: "inputRef",
+            ref: w,
+            modelValue: y.value,
+            "onUpdate:modelValue": [
+              t[0] || (t[0] = (l) => y.value = l),
+              H
+            ],
+            disabled: s.disabled,
+            placeholder: s.placeholder,
+            "hide-details": "",
+            onFocus: t[1] || (t[1] = (l) => a.value = !0),
+            "onClick:append": t[2] || (t[2] = (l) => {
+              var g;
+              return (g = w.value) == null ? void 0 : g.focus();
+            })
+          }, {
+            appendIcon: Y(() => [
+              (o(), d("svg", {
+                class: r([[a.value ? "ds-rotate-180" : ""], "ds-h-4 ds-w-4 ds-transition-transform"]),
+                viewBox: "0 0 320 512",
+                xmlns: "http://www.w3.org/2000/svg"
+              }, he, 2))
+            ]),
+            _: 1
+          }, 8, ["id", "modelValue", "disabled", "placeholder"])) : (o(), d("button", {
+            key: 1,
+            id: m.value,
+            class: r(N.value),
+            disabled: s.disabled,
+            type: "button",
+            onClick: t[3] || (t[3] = (l) => a.value = !a.value)
+          }, [
+            n("span", {
+              class: r([e.valueCssClass, "ds-truncate"])
+            }, [
+              (_ = f.value) != null && _.text ? (o(), d("span", ge, M((b = f.value) == null ? void 0 : b.text), 1)) : (o(), d("span", ke, M(s.placeholder), 1))
+            ], 2),
+            Z("   "),
+            (o(), d("svg", {
+              class: r([[a.value ? "ds-rotate-180" : ""], "ds-h-4 ds-w-4 ds-transition-transform"]),
+              viewBox: "0 0 320 512",
+              xmlns: "http://www.w3.org/2000/svg"
+            }, ye, 2))
+          ], 10, be)),
+          ee(n("div", {
+            id: `${m.value}Menu`,
+            ref_key: "selectMenuEl",
+            ref: p,
+            class: r([e.menuCssClass, "ds-absolute ds-z-50 ds-min-w-[8rem] ds-py-1"]),
+            "data-cy": e.$attrs["data-cy"] ? `${e.$attrs["data-cy"]}Menu` : void 0,
+            "data-ut": e.$attrs["data-ut"] ? `${e.$attrs["data-ut"]}Menu` : void 0
+          }, [
+            n("div", xe, [
+              n("ul", _e, [
+                (o(!0), d(se, null, te(e.items, (l, g) => (o(), d("li", {
+                  key: `item${g}`,
+                  class: "ds-cursor-pointer",
+                  onClick: ($e) => j(l)
+                }, [
+                  n("a", {
+                    class: r([
+                      l.cssClass + `${l.value === u.value ? " ds-bg-gray-150" : ""}`,
+                      "ds-block ds-px-4 ds-py-2 hover:ds-bg-gray-150"
+                    ])
+                  }, M(l == null ? void 0 : l.text), 3)
+                ], 8, Ee))), 128))
+              ])
+            ])
+          ], 10, Ce), [
+            [le, a.value]
+          ])
+        ], 512),
+        e.hideDetails ? ae("", !0) : (o(), R(ce, {
+          key: 0,
+          "error-message": oe(B).errorMessage(),
+          class: "ds-mt-1"
+        }, null, 8, ["error-message"]))
+      ]);
+    };
   }
 });
 export {
-  E as default
+  Te as default
 };
 //# sourceMappingURL=design-system20.mjs.map