@webitel/ui-sdk 3.1.35 → 3.1.37

package/dist/ui-sdk.umd.js

@@ -21824,12 +21824,23 @@ Object.entries(sl).forEach(([e, n]) => {
 
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/molecules/wt-datepicker/wt-datepicker.vue?vue&type=script&setup=true&lang=js
 
+const wt_datepickervue_type_script_setup_true_lang_js_withScopeId = n => (_pushScopeId("data-v-5e75000b"), n = n(), _popScopeId(), n);
+const wt_datepickervue_type_script_setup_true_lang_js_hoisted_1 = {
+  class: "datepicker__timepicker"
+};
+
 
 
+// import { useI18n } from 'vue-i18n';
 
 /* harmony default export */ var wt_datepickervue_type_script_setup_true_lang_js = ({
   __name: 'wt-datepicker',
   props: {
+    mode: {
+      type: String,
+      default: 'date',
+      options: ['date', 'datetime']
+    },
     value: {
       type: [String, Number],
       default: 'Date.now()'
@@ -21861,18 +21872,32 @@ Object.entries(sl).forEach(([e, n]) => {
       description: 'Object with props, passed down to wt-label as props'
     }
   },
-  emits: ['change'],
+  emits: ['input'],
   setup(__props, {
     emit
   }) {
     const props = __props;
+
+    // const i18n = useI18n();
+
     const isOpened = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(false);
     const datepicker = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(null); // template ref
 
+    const locale = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const {
+        locale
+      } = {
+        locale: 'ua'
+      };
+      if (locale === 'ua') return 'uk';
+      return locale;
+    });
+    const isDateTime = props.mode === 'datetime';
     return (_ctx, _cache) => {
       const _component_wt_label = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)("wt-label");
       const _component_wt_icon = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)("wt-icon");
       const _component_wt_icon_btn = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)("wt-icon-btn");
+      const _component_wt_time_input = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)("wt-time-input");
       const _component_wt_button = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)("wt-button");
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createElementBlock)("div", {
         class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_.normalizeClass)([{
@@ -21891,14 +21916,16 @@ Object.entries(sl).forEach(([e, n]) => {
       }, {
         ref_key: "datepicker",
         ref: datepicker,
+        locale: (0,external_commonjs_vue_commonjs2_vue_root_Vue_.unref)(locale),
         "model-value": +__props.value,
         placeholder: __props.label || __props.placeholder,
         class: "wt-datepicker__datepicker"
       }, {
+        format: isDateTime ? 'dd/MM/yyyy HH:mm' : 'dd/MM/yyyy',
         onClosed: _cache[2] || (_cache[2] = $event => isOpened.value = false),
         onOpen: _cache[3] || (_cache[3] = $event => isOpened.value = true),
-        "onUpdate:modelValue": _cache[4] || (_cache[4] = $event => emit('change', $event.getTime()))
-      }), {
+        "onUpdate:modelValue": _cache[4] || (_cache[4] = $event => emit('input', $event.getTime()))
+      }), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createSlots)({
         "input-icon": (0,external_commonjs_vue_commonjs2_vue_root_Vue_.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_icon, {
           color: __props.disabled ? 'disabled' : 'default',
           icon: "calendar"
@@ -21917,28 +21944,47 @@ Object.entries(sl).forEach(([e, n]) => {
           icon: "arrow-right"
         })]),
         "action-select": (0,external_commonjs_vue_commonjs2_vue_root_Vue_.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_button, {
+          wide: "",
           onClick: _cache[0] || (_cache[0] = $event => datepicker.value.selectDate())
         }, {
           default: (0,external_commonjs_vue_commonjs2_vue_root_Vue_.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createTextVNode)((0,external_commonjs_vue_commonjs2_vue_root_Vue_.toDisplayString)(_ctx.$t('reusable.ok')), 1)], undefined, true),
           _: 1
         }), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_button, {
           color: "secondary",
+          wide: "",
           onClick: _cache[1] || (_cache[1] = $event => datepicker.value.closeMenu())
         }, {
           default: (0,external_commonjs_vue_commonjs2_vue_root_Vue_.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createTextVNode)((0,external_commonjs_vue_commonjs2_vue_root_Vue_.toDisplayString)(_ctx.$t('reusable.cancel')), 1)], undefined, true),
           _: 1
         })]),
-        _: 1
-      }, 16, ["model-value", "placeholder"])], 2);
+        _: 2
+      }, [isDateTime ? {
+        name: "time-picker",
+        fn: (0,external_commonjs_vue_commonjs2_vue_root_Vue_.withCtx)(({
+          time,
+          updateTime
+        }) => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createElementVNode)("div", wt_datepickervue_type_script_setup_true_lang_js_hoisted_1, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_time_input, {
+          label: _ctx.$t('webitelUI.timepicker.hour'),
+          value: time.hours,
+          "max-value": "23",
+          onInput: updateTime
+        }, null, 8, ["label", "value", "onInput"]), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_time_input, {
+          label: _ctx.$t('webitelUI.timepicker.min'),
+          value: time.minutes,
+          "max-value": "59",
+          onInput: $event => updateTime($event, false)
+        }, null, 8, ["label", "value", "onInput"])])]),
+        key: "0"
+      } : undefined]), 1040, ["locale", "model-value", "placeholder", "format"])], 2);
     };
   }
 });
 ;// CONCATENATED MODULE: ./src/components/molecules/wt-datepicker/wt-datepicker.vue?vue&type=script&setup=true&lang=js
  
-;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-65.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-65.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-65.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-65.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/molecules/wt-datepicker/wt-datepicker.vue?vue&type=style&index=0&id=c5bc37f8&lang=scss
+;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-65.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-65.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-65.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-65.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/molecules/wt-datepicker/wt-datepicker.vue?vue&type=style&index=0&id=5e75000b&lang=scss&scoped=true
 // extracted by mini-css-extract-plugin
 
-;// CONCATENATED MODULE: ./src/components/molecules/wt-datepicker/wt-datepicker.vue?vue&type=style&index=0&id=c5bc37f8&lang=scss
+;// CONCATENATED MODULE: ./src/components/molecules/wt-datepicker/wt-datepicker.vue?vue&type=style&index=0&id=5e75000b&lang=scss&scoped=true
 
 ;// CONCATENATED MODULE: ./src/components/molecules/wt-datepicker/wt-datepicker.vue
 
@@ -21946,197 +21992,10 @@ Object.entries(sl).forEach(([e, n]) => {
 
 ;
 
-const wt_datepicker_exports_ = wt_datepickervue_type_script_setup_true_lang_js;
 
-/* harmony default export */ var wt_datepicker = (wt_datepicker_exports_);
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/molecules/wt-datetimepicker/wt-datetimepicker.vue?vue&type=template&id=2e6c604c&scoped=true
+const wt_datepicker_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(wt_datepickervue_type_script_setup_true_lang_js, [['__scopeId',"data-v-5e75000b"]])
 
-const wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_withScopeId = n => (_pushScopeId("data-v-2e6c604c"), n = n(), _popScopeId(), n);
-const wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_hoisted_1 = ["value"];
-const wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_hoisted_2 = {
-  class: "wt-datetimepicker__form"
-};
-const wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_hoisted_3 = {
-  class: "wt-datetimepicker__quick-filters-wrapper"
-};
-const wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_hoisted_4 = {
-  class: "wt-datetimepicker__form-wrapper"
-};
-const wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_hoisted_5 = {
-  class: "wt-datetimepicker__actions"
-};
-function wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_wt_label = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)("wt-label");
-  const _component_wt_icon = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)("wt-icon");
-  const _component_wt_datepicker = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)("wt-datepicker");
-  const _component_wt_timepicker = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)("wt-timepicker");
-  const _component_wt_button = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)("wt-button");
-  const _component_v_dropdown = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)("v-dropdown");
-  return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createBlock)(_component_v_dropdown, {
-    class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_.normalizeClass)(["wt-datetimepicker", {
-      'wt-datetimepicker--active': _ctx.isOpened,
-      'wt-datetimepicker--disabled': $props.disabled
-    }]),
-    shown: _ctx.isOpened,
-    "onUpdate:shown": _cache[4] || (_cache[4] = $event => _ctx.isOpened = $event),
-    placement: "bottom-start"
-  }, {
-    popper: (0,external_commonjs_vue_commonjs2_vue_root_Vue_.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createElementVNode)("div", wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_hoisted_2, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createElementVNode)("div", wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_hoisted_3, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createElementVNode)("span", {
-      class: "wt-datetimepicker__quick-filter",
-      onClick: _cache[1] || (_cache[1] = (...args) => $options.setLastHour && $options.setLastHour(...args))
-    }, (0,external_commonjs_vue_commonjs2_vue_root_Vue_.toDisplayString)(_ctx.$t('webitelUI.datetimepicker.lastHour')), 1), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createElementVNode)("span", {
-      class: "wt-datetimepicker__quick-filter",
-      onClick: _cache[2] || (_cache[2] = (...args) => $options.setLastDay && $options.setLastDay(...args))
-    }, (0,external_commonjs_vue_commonjs2_vue_root_Vue_.toDisplayString)(_ctx.$t('webitelUI.datetimepicker.lastDay')), 1)]), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createElementVNode)("div", wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_hoisted_4, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_datepicker, {
-      class: "wt-datetimepicker__datepicker",
-      value: _ctx.draft,
-      "maximum-view": 'day',
-      "disabled-dates": $props.disabledDates,
-      "monday-first": "",
-      inline: "",
-      onChange: $options.setDraft
-    }, null, 8, ["value", "disabled-dates", "onChange"]), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_timepicker, {
-      class: "wt-datetimepicker__timepicker",
-      modelValue: _ctx.draft,
-      "onUpdate:modelValue": _cache[3] || (_cache[3] = $event => _ctx.draft = $event),
-      format: "hh:mm",
-      "date-mode": ""
-    }, null, 8, ["modelValue"])]), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createElementVNode)("div", wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_hoisted_5, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_button, {
-      onClick: $options.input
-    }, {
-      default: (0,external_commonjs_vue_commonjs2_vue_root_Vue_.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createTextVNode)((0,external_commonjs_vue_commonjs2_vue_root_Vue_.toDisplayString)(_ctx.$t('reusable.add')), 1)], undefined, true),
-      _: 1
-    }, 8, ["onClick"]), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_button, {
-      color: "secondary",
-      onClick: $options.close
-    }, {
-      default: (0,external_commonjs_vue_commonjs2_vue_root_Vue_.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createTextVNode)((0,external_commonjs_vue_commonjs2_vue_root_Vue_.toDisplayString)(_ctx.$t('reusable.cancel')), 1)], undefined, true),
-      _: 1
-    }, 8, ["onClick"])])])]),
-    default: (0,external_commonjs_vue_commonjs2_vue_root_Vue_.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_label, (0,external_commonjs_vue_commonjs2_vue_root_Vue_.mergeProps)($props.labelProps, {
-      disabled: $props.disabled
-    }), {
-      default: (0,external_commonjs_vue_commonjs2_vue_root_Vue_.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.renderSlot)(_ctx.$slots, "label", (0,external_commonjs_vue_commonjs2_vue_root_Vue_.normalizeProps)((0,external_commonjs_vue_commonjs2_vue_root_Vue_.guardReactiveProps)({
-        label: $props.label
-      })), () => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createTextVNode)((0,external_commonjs_vue_commonjs2_vue_root_Vue_.toDisplayString)($props.label), 1)], true)], undefined, true),
-      _: 3
-    }, 16, ["disabled"]), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createElementVNode)("div", {
-      class: "wt-datetimepicker__preview",
-      tabindex: "0",
-      onKeyup: _cache[0] || (_cache[0] = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.withKeys)($event => _ctx.isOpened = !_ctx.isOpened, ["enter"]))
-    }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_icon, {
-      class: "wt-datetimepicker__calendar-icon",
-      icon: "calendar"
-    }), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createElementVNode)("input", {
-      class: "wt-datetimepicker__preview__input",
-      value: $options.displayValue,
-      autocomplete: "off",
-      readonly: ""
-    }, null, 8, wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_hoisted_1), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createVNode)(_component_wt_icon, {
-      class: "wt-datetimepicker__arrow-icon",
-      icon: "arrow-down"
-    })], 32)], undefined, true),
-    _: 3
-  }, 8, ["class", "shown"]);
-}
-;// CONCATENATED MODULE: ./src/components/molecules/wt-datetimepicker/wt-datetimepicker.vue?vue&type=template&id=2e6c604c&scoped=true
-
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/molecules/wt-datetimepicker/wt-datetimepicker.vue?vue&type=script&lang=js
-// import Datepicker from 'vuejs-datepicker';
-
-/* harmony default export */ var wt_datetimepickervue_type_script_lang_js = ({
-  name: 'wt-datetimepicker',
-  components: {
-    // Datepicker,
-  },
-  props: {
-    value: {
-      type: [String, Number],
-      default: 0
-    },
-    label: {
-      type: String,
-      default: ''
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    disabledDates: {
-      type: Object
-    },
-    labelProps: {
-      type: Object,
-      description: 'Object with props, passed down to wt-label as props'
-    }
-  },
-  model: {
-    prop: 'value',
-    event: 'change'
-  },
-  watch: {
-    isOpened: {
-      handler() {
-        this.draft = this.value;
-      },
-      immediate: true
-    }
-  },
-  data: () => ({
-    isOpened: false,
-    draft: 0
-  }),
-  computed: {
-    // prop value representation on picker preview
-    displayValue() {
-      // const date = new Date(+this.value).toLocaleDateString();
-      // const time = new Date(+this.value).toLocaleTimeString() // https://stackoverflow.com/questions/17913681/how-do-i-use-tolocaletimestring-without-displaying-seconds
-      //   .slice(0, 5);
-      // return `${date} ${time}`;
-      return new Date(+this.value).toLocaleString();
-    }
-  },
-  methods: {
-    setLastHour() {
-      const value = Date.now() - 60 * 60 * 10 ** 3; // 60 min x 60 sec x 1000 ms
-      this.$emit('change', value);
-      this.close();
-    },
-    setLastDay() {
-      const value = Date.now() - 24 * 60 * 60 * 10 ** 3; // 24hour x 60 min x 60 sec x 1000 ms
-      this.$emit('change', value);
-      this.close();
-    },
-    input() {
-      this.$emit('change', this.draft);
-      this.close();
-    },
-    setDraft(value) {
-      this.draft = value;
-    },
-    close() {
-      this.isOpened = false;
-    }
-  }
-});
-;// CONCATENATED MODULE: ./src/components/molecules/wt-datetimepicker/wt-datetimepicker.vue?vue&type=script&lang=js
- 
-;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-65.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-65.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-65.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-65.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/molecules/wt-datetimepicker/wt-datetimepicker.vue?vue&type=style&index=0&id=2e6c604c&lang=scss&scoped=true
-// extracted by mini-css-extract-plugin
-
-;// CONCATENATED MODULE: ./src/components/molecules/wt-datetimepicker/wt-datetimepicker.vue?vue&type=style&index=0&id=2e6c604c&lang=scss&scoped=true
-
-;// CONCATENATED MODULE: ./src/components/molecules/wt-datetimepicker/wt-datetimepicker.vue
-
-
-
-
-;
-
-
-const wt_datetimepicker_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(wt_datetimepickervue_type_script_lang_js, [['render',wt_datetimepickervue_type_template_id_2e6c604c_scoped_true_render],['__scopeId',"data-v-2e6c604c"]])
-
-/* harmony default export */ var wt_datetimepicker = (wt_datetimepicker_exports_);
+/* harmony default export */ var wt_datepicker = (wt_datepicker_exports_);
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/molecules/wt-icon-btn/wt-icon-btn.vue?vue&type=template&id=72cf0ee8&scoped=true
 
 const wt_icon_btnvue_type_template_id_72cf0ee8_scoped_true_withScopeId = n => (_pushScopeId("data-v-72cf0ee8"), n = n(), _popScopeId(), n);
@@ -34209,7 +34068,6 @@ const wt_page_header_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(wt_
 
 
 
-
 
 
 const Components = {
@@ -34227,7 +34085,6 @@ const Components = {
   WtRoundedAction: wt_rounded_action,
   WtCheckbox: wt_checkbox,
   WtDatepicker: wt_datepicker,
-  WtDatetimepicker: wt_datetimepicker,
   WtIconBtn: wt_icon_btn,
   WtInput: wt_input,
   WtHint: wt_hint,