@vueland/ui 0.0.1 → 0.0.2

package/dist/components/CDatePicker/CDatePickerMonths.js

@@ -0,0 +1,114 @@
+import { defineComponent, computed, openBlock, createElementBlock, renderSlot, Fragment, renderList, mergeProps, normalizeClass, toDisplayString } from 'vue';
+
+const _hoisted_1 = { class: "c-date-picker-months" };
+const _hoisted_2 = ["onClick"];
+const CELLS_IN_ROW = 3;
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{ name: "CDatePickerMonths" },
+  __name: "CDatePickerMonths",
+  props: {
+    month: {},
+    year: {},
+    locale: {},
+    minDate: {},
+    maxDate: {}
+  },
+  emits: ["update:month", "update:year"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const MONTHS = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
+    const CURRENT_YEAR = (/* @__PURE__ */ new Date()).getFullYear();
+    const CURRENT_MONTH = (/* @__PURE__ */ new Date()).getMonth();
+    function isDisabled(m) {
+      if (props.minDate) {
+        if (props.year < props.minDate.year) return true;
+        if (props.year === props.minDate.year && m < props.minDate.month) return true;
+      }
+      if (props.maxDate) {
+        if (props.year > props.maxDate.year) return true;
+        if (props.year === props.maxDate.year && m > props.maxDate.month) return true;
+      }
+      return false;
+    }
+    const enrichedMonths = computed(
+      () => MONTHS.map((m) => {
+        var _a, _b;
+        return {
+          month: m,
+          label: (_b = (_a = props.locale) == null ? void 0 : _a[m]) != null ? _b : "",
+          disabled: isDisabled(m),
+          isSelected: m === props.month,
+          isCurrent: m === CURRENT_MONTH && props.year === CURRENT_YEAR,
+          onSelect: () => {
+            if (!isDisabled(m)) emit("update:month", m);
+          }
+        };
+      })
+    );
+    const rows = computed(() => {
+      const result = [];
+      for (let i = 0; i < enrichedMonths.value.length; i += CELLS_IN_ROW) {
+        result.push(enrichedMonths.value.slice(i, i + CELLS_IN_ROW));
+      }
+      return result;
+    });
+    __expose({
+      onNext: () => emit("update:year", props.year + 1),
+      onPrev: () => emit("update:year", props.year - 1)
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        _ctx.$slots.months ? renderSlot(_ctx.$slots, "months", {
+          key: 0,
+          months: enrichedMonths.value
+        }) : (openBlock(true), createElementBlock(
+          Fragment,
+          { key: 1 },
+          renderList(rows.value, (row, ri) => {
+            return openBlock(), createElementBlock("div", {
+              key: ri,
+              class: "c-date-picker-months__row"
+            }, [
+              (openBlock(true), createElementBlock(
+                Fragment,
+                null,
+                renderList(row, (item) => {
+                  return openBlock(), createElementBlock(
+                    Fragment,
+                    {
+                      key: item.month
+                    },
+                    [
+                      _ctx.$slots.month ? renderSlot(_ctx.$slots, "month", mergeProps({
+                        key: 0,
+                        ref_for: true
+                      }, item)) : (openBlock(), createElementBlock("div", {
+                        key: 1,
+                        class: normalizeClass([
+                          "c-date-picker-months__cell",
+                          item.isSelected && "c-date-picker-months__cell--selected",
+                          item.isCurrent && "c-date-picker-months__cell--current",
+                          item.disabled && "c-date-picker-months__cell--disabled"
+                        ]),
+                        onClick: item.onSelect
+                      }, toDisplayString(item.label), 11, _hoisted_2))
+                    ],
+                    64
+                    /* STABLE_FRAGMENT */
+                  );
+                }),
+                128
+                /* KEYED_FRAGMENT */
+              ))
+            ]);
+          }),
+          128
+          /* KEYED_FRAGMENT */
+        ))
+      ]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/components/CDatePicker/CDatePickerYears.js

@@ -0,0 +1,143 @@
+import { defineComponent, shallowRef, computed, openBlock, createElementBlock, renderSlot, createBlock, Transition, withCtx, Fragment, renderList, mergeProps, normalizeClass, toDisplayString } from 'vue';
+import { isDef } from '../../helpers/index.js';
+
+const _hoisted_1 = { class: "c-date-picker-years" };
+const _hoisted_2 = ["onClick"];
+const CELLS_IN_ROW = 4;
+const ON_TABLE = 20;
+const LIMIT = 100;
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{ name: "CDatePickerYears" },
+  __name: "CDatePickerYears",
+  props: {
+    year: {},
+    minYear: {},
+    maxYear: {}
+  },
+  emits: ["update:year"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    var _a;
+    const props = __props;
+    const emit = __emit;
+    const CURRENT_YEAR = (/* @__PURE__ */ new Date()).getFullYear();
+    const allPages = [];
+    const fromYear = CURRENT_YEAR - LIMIT;
+    let page = [];
+    for (let i = 0; i <= LIMIT * 2; i++) {
+      page.push(fromYear + i);
+      if (page.length === ON_TABLE) {
+        allPages.push(page);
+        page = [];
+      }
+    }
+    if (page.length) allPages.push(page);
+    const pageIndex = shallowRef((_a = allPages.findIndex((p) => p.includes(props.year))) != null ? _a : 0);
+    const transitionName = shallowRef("c-date-slide-left");
+    const enrichedYears = computed(
+      () => {
+        var _a2;
+        return ((_a2 = allPages[pageIndex.value]) != null ? _a2 : []).map((y) => {
+          const disabled = isDef(props.minYear) && y < props.minYear || isDef(props.maxYear) && y > props.maxYear;
+          return {
+            year: y,
+            disabled,
+            isSelected: y === props.year,
+            isCurrent: y === CURRENT_YEAR,
+            onSelect: () => {
+              if (!disabled) emit("update:year", y);
+            }
+          };
+        });
+      }
+    );
+    const rows = computed(() => {
+      const result = [];
+      for (let i = 0; i < enrichedYears.value.length; i += CELLS_IN_ROW) {
+        result.push(enrichedYears.value.slice(i, i + CELLS_IN_ROW));
+      }
+      return result;
+    });
+    __expose({
+      onNext() {
+        if (pageIndex.value < allPages.length - 1) {
+          transitionName.value = "c-date-slide-left";
+          pageIndex.value++;
+        }
+      },
+      onPrev() {
+        if (pageIndex.value > 0) {
+          transitionName.value = "c-date-slide-right";
+          pageIndex.value--;
+        }
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        _ctx.$slots.years ? renderSlot(_ctx.$slots, "years", {
+          key: 0,
+          years: enrichedYears.value
+        }) : (openBlock(), createBlock(Transition, {
+          key: 1,
+          name: transitionName.value,
+          mode: "out-in"
+        }, {
+          default: withCtx(() => [
+            (openBlock(), createElementBlock("div", {
+              key: pageIndex.value,
+              class: "c-date-picker-years__grid"
+            }, [
+              (openBlock(true), createElementBlock(
+                Fragment,
+                null,
+                renderList(rows.value, (row, ri) => {
+                  return openBlock(), createElementBlock("div", {
+                    key: ri,
+                    class: "c-date-picker-years__row"
+                  }, [
+                    (openBlock(true), createElementBlock(
+                      Fragment,
+                      null,
+                      renderList(row, (item) => {
+                        return openBlock(), createElementBlock(
+                          Fragment,
+                          {
+                            key: item.year
+                          },
+                          [
+                            _ctx.$slots.year ? renderSlot(_ctx.$slots, "year", mergeProps({
+                              key: 0,
+                              ref_for: true
+                            }, item)) : (openBlock(), createElementBlock("div", {
+                              key: 1,
+                              class: normalizeClass([
+                                "c-date-picker-years__cell",
+                                item.isSelected && "c-date-picker-years__cell--selected",
+                                item.isCurrent && "c-date-picker-years__cell--current",
+                                item.disabled && "c-date-picker-years__cell--disabled"
+                              ]),
+                              onClick: item.onSelect
+                            }, toDisplayString(item.year), 11, _hoisted_2))
+                          ],
+                          64
+                          /* STABLE_FRAGMENT */
+                        );
+                      }),
+                      128
+                      /* KEYED_FRAGMENT */
+                    ))
+                  ]);
+                }),
+                128
+                /* KEYED_FRAGMENT */
+              ))
+            ]))
+          ]),
+          _: 3
+          /* FORWARDED */
+        }, 8, ["name"]))
+      ]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/components/CDatePicker/helpers.js

@@ -0,0 +1,17 @@
+import { getDay, getDate, getMonth, getFullYear } from './utils.js';
+
+function toDateString(date) {
+  return new Date(date.year, date.month, date.date);
+}
+function parseDate(selectedDate) {
+  const date = new Date(selectedDate);
+  return {
+    year: getFullYear(date),
+    month: getMonth(date),
+    date: getDate(date),
+    mls: date.getTime(),
+    day: getDay(date)
+  };
+}
+
+export { parseDate, toDateString };

package/dist/components/CDatePicker/index.js

@@ -0,0 +1,14 @@
+import { LOCALE } from './locales/index.js';
+import { formatDate } from './utils.js';
+
+function datePickerValueToString(value, format, lang) {
+  var _a;
+  if (!value) return "";
+  try {
+    return formatDate(new Date(value), format, (_a = LOCALE[lang]) != null ? _a : LOCALE["en"]);
+  } catch (e) {
+    return "";
+  }
+}
+
+export { datePickerValueToString };

package/dist/components/CDatePicker/index2.js

@@ -0,0 +1,5 @@
+import _sfc_main from './CDatePicker.js';
+
+
+
+export { _sfc_main as default };

package/dist/components/CDatePicker/index3.js

@@ -0,0 +1,5 @@
+import _sfc_main from './CDatePickerYears.js';
+
+
+
+export { _sfc_main as default };

package/dist/components/CDatePicker/index4.js

@@ -0,0 +1,5 @@
+import _sfc_main from './CDatePickerHeader.js';
+
+
+
+export { _sfc_main as default };

package/dist/components/CDatePicker/index5.js

@@ -0,0 +1,5 @@
+import _sfc_main from './CDatePickerMonths.js';
+
+
+
+export { _sfc_main as default };

package/dist/components/CDatePicker/index6.js

@@ -0,0 +1,5 @@
+import _sfc_main from './CDatePickerDates.js';
+
+
+
+export { _sfc_main as default };

package/dist/components/CDatePicker/locales/en.json.js

@@ -0,0 +1,44 @@
+var months = [
+	"January",
+	"February",
+	"March",
+	"April",
+	"May",
+	"June",
+	"July",
+	"August",
+	"September",
+	"October",
+	"November",
+	"December"
+];
+var monthsAbbr = [
+	"Jan",
+	"Feb",
+	"Mar",
+	"Apr",
+	"May",
+	"Jun",
+	"Jul",
+	"Aug",
+	"Sep",
+	"Oct",
+	"Nov",
+	"Dec"
+];
+var week = [
+	"Sun",
+	"Mon",
+	"Tue",
+	"Wed",
+	"Thu",
+	"Fri",
+	"Sat"
+];
+var en = {
+	months: months,
+	monthsAbbr: monthsAbbr,
+	week: week
+};
+
+export { en as default, months, monthsAbbr, week };

package/dist/components/CDatePicker/locales/index.js

@@ -0,0 +1,9 @@
+import en from './en.json.js';
+import ru from './ru.json.js';
+
+const LOCALE = {
+  en,
+  ru
+};
+
+export { LOCALE };

package/dist/components/CDatePicker/locales/ru.json.js

@@ -0,0 +1,44 @@
+var months = [
+	"Январь",
+	"Февраль",
+	"Март",
+	"Апрель",
+	"Май",
+	"Июнь",
+	"Июль",
+	"Август",
+	"Сентябрь",
+	"Октябрь",
+	"Ноябрь",
+	"Декабрь"
+];
+var monthsAbbr = [
+	"Янв",
+	"Фев",
+	"Мар",
+	"Апр",
+	"Май",
+	"Июн",
+	"Июл",
+	"Авг",
+	"Сен",
+	"Окт",
+	"Ноя",
+	"Дек"
+];
+var week = [
+	"Вс",
+	"Пн",
+	"Вт",
+	"Ср",
+	"Чт",
+	"Пт",
+	"Сб"
+];
+var ru = {
+	months: months,
+	monthsAbbr: monthsAbbr,
+	week: week
+};
+
+export { ru as default, months, monthsAbbr, week };

package/dist/components/CDatePicker/utils.js

@@ -0,0 +1,20 @@
+function getMonth(date) {
+  return date.getMonth();
+}
+function getFullYear(date) {
+  return date.getFullYear();
+}
+function getDate(date) {
+  return date.getDate();
+}
+function getDay(date) {
+  return date.getDay();
+}
+function formatDate(date, format, locale) {
+  const year = getFullYear(date);
+  const month = getMonth(date) + 1;
+  const day = getDate(date);
+  return format.replace(/dd/, ("0" + day).slice(-2)).replace(/d/, `${day}`).replace(/yyyy/, `${year}`).replace(/yy/, String(year).slice(2)).replace(/MMMM/, locale.months[getMonth(date)]).replace(/MMM/, locale.monthsAbbr[getMonth(date)]).replace(/MM/, ("0" + month).slice(-2)).replace(/M(?!a|ä|e)/, `${month}`).replace(/D(?!e|é|i)/, locale.week[getDay(date)]);
+}
+
+export { formatDate, getDate, getDay, getFullYear, getMonth };

package/dist/components/CDialog/CDialog.js

@@ -5,9 +5,7 @@ import { vClickOutside } from '../../directives/v-click-outside.js';
 
 const _hoisted_1 = { class: "c-dialog__content" };
 var _sfc_main = /* @__PURE__ */ defineComponent({
-  ...{
-    name: "CDialog"
-  },
+  ...{ name: "CDialog" },
   __name: "CDialog",
   props: /* @__PURE__ */ mergeModels({
     modelValue: { type: Boolean },
@@ -20,8 +18,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   emits: ["update:modelValue"],
   setup(__props) {
     const props = __props;
-    const { blockScroll, unblockScroll } = useApplication();
     const model = useModel(__props, "modelValue");
+    const { blockScroll, unblockScroll } = useApplication();
     const onOutsideClick = () => {
       if (props.closeOnClickOutside) {
         model.value = false;

package/dist/components/CDialog/index.js

@@ -1,4 +1,4 @@
-import _sfc_main from './CDialog.js';
+import _sfc_main from './CDialogsStack.js';
 
 
 

package/dist/components/CDialog/index2.js

@@ -1,4 +1,4 @@
-import _sfc_main from './CDialogsStack.js';
+import _sfc_main from './CDialog.js';