cleek 2.1.22 → 2.1.23

package/dist/cleek.es.js

@@ -17,7 +17,7 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-import { defineComponent, ref, openBlock, createElementBlock, createElementVNode, renderSlot, normalizeClass, createCommentVNode, computed as computed$2, normalizeStyle, unref as unref$1, watch, h, createBlock, Teleport, createVNode, createTextVNode, toDisplayString, withCtx, onMounted, getCurrentInstance, withDirectives, isRef as isRef$1, vModelDynamic, Fragment, renderList, mergeProps, withKeys, withModifiers, pushScopeId, popScopeId, nextTick as nextTick$1, onBeforeUnmount, vModelRadio, vModelSelect, vModelCheckbox, vModelText } from "vue";
+import { defineComponent, ref, openBlock, createElementBlock, createElementVNode, renderSlot, normalizeClass, createCommentVNode, computed as computed$2, normalizeStyle, unref as unref$1, watch, h, createBlock, Teleport, createVNode, createTextVNode, toDisplayString, withCtx, onMounted, getCurrentInstance, nextTick as nextTick$1, onBeforeUnmount, withDirectives, isRef as isRef$1, vModelDynamic, Fragment, renderList, mergeProps, withKeys, withModifiers, pushScopeId, popScopeId, vModelRadio, vModelSelect, vModelCheckbox, vModelText } from "vue";
 var ckDropdown_vue_vue_type_style_index_0_scoped_true_lang = "";
 var _export_sfc = (sfc, props) => {
   const target = sfc.__vccOpts || sfc;
@@ -11292,7 +11292,7 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
 var ckIcon = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["__scopeId", "data-v-25801d7b"]]);
 var ckNotify_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _hoisted_1$j = { class: "ck-notify__container" };
-const _hoisted_2$9 = { class: "ck-notify__title" };
+const _hoisted_2$8 = { class: "ck-notify__title" };
 const _hoisted_3$6 = { class: "close-btn" };
 const _hoisted_4$4 = { class: "ck-notify__text" };
 const _sfc_main$l = /* @__PURE__ */ defineComponent({
@@ -11345,7 +11345,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
             style: normalizeStyle({ "background-color": globalColor.value }),
             onClick: _cache[0] || (_cache[0] = ($event) => closeNotification())
           }, [
-            createElementVNode("div", _hoisted_2$9, [
+            createElementVNode("div", _hoisted_2$8, [
               createElementVNode("div", _hoisted_3$6, [
                 createVNode(ckIcon, { icon: "times" })
               ]),
@@ -11450,16 +11450,43 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
 });
 var functions = {
   getGroupClass({ group = "", groupVertical = "", groupBreak = "" } = {}) {
-    const _screenSize = "";
-    if (groupBreak && groupBreak === _screenSize)
-      return [];
     const classList2 = [];
     if (group)
       classList2.push(`ck-component__group--${group}`);
     if (groupVertical)
       classList2.push(`ck-component__group-vertical--${groupVertical}`);
+    if (groupBreak) {
+      if (groupBreak === "s") {
+        classList2.push(`ck-component__group-break--${groupBreak}`);
+      }
+    }
+    return classList2;
+  },
+  getGroupClassContainer({ groupBreak = "" } = "") {
+    const classList2 = [];
+    if (groupBreak) {
+      if (groupBreak === "s") {
+        classList2.push(`ck-component__group-break-container--${groupBreak}`);
+      }
+    }
     return classList2;
   },
+  getGroupBreakStyleContainer({ groupBreak } = {}, windowWidth) {
+    if (windowWidth <= groupBreak) {
+      return [
+        { width: "100%" }
+      ];
+    }
+  },
+  getGroupBreakStyle({ groupBreak } = {}, windowWidth) {
+    if (windowWidth <= groupBreak) {
+      return [
+        { width: "100%" },
+        { borderRadius: "4px !important" },
+        { border: "1px solid #DAE1E7 !important" }
+      ];
+    }
+  },
   isColorTemplateVariable(color) {
     if (color === "primary")
       return true;
@@ -11488,7 +11515,6 @@ var functions = {
     return true;
   },
   getCleekOptions(getCurrentInstance2) {
-    console.log("getCurrentInstance", getCurrentInstance2);
     return getCurrentInstance2().appContext.app.config.globalProperties.$cleekOptions;
   }
 };
@@ -11600,9 +11626,26 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
   }
 });
 var ckLabel = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-ef74ea02"]]);
+function useWindowWidth() {
+  const windowWidth = ref(0);
+  function handleWindowResize(event) {
+    windowWidth.value = event.currentTarget.innerWidth;
+  }
+  onMounted(() => {
+    nextTick$1(() => {
+      window.addEventListener("resize", handleWindowResize);
+    });
+    windowWidth.value = window.innerWidth;
+  });
+  onBeforeUnmount(() => {
+    window.removeEventListener("resize", handleWindowResize);
+  });
+  return {
+    windowWidth
+  };
+}
 var ckInput_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1$e = { class: "ck-input" };
-const _hoisted_2$8 = ["autocomplete", "type", "placeholder", "id", "disabled"];
+const _hoisted_1$e = ["autocomplete", "type", "placeholder", "disabled"];
 const _sfc_main$f = /* @__PURE__ */ defineComponent({
   props: {
     modelValue: {},
@@ -11616,7 +11659,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
     iconPack: { type: String, default: void 0 },
     iconRight: { type: String, default: void 0 },
     group: { type: String, default: void 0 },
-    groupBreak: { type: String, default: "s" },
+    groupBreak: { type: String, default: "" },
     groupVertical: { type: String, default: void 0 },
     hideBorder: { type: Boolean, default: false },
     width: { type: String, default: void 0 },
@@ -11626,6 +11669,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
   emits: ["update:modelValue", "click", "input", "change"],
   setup(__props, { expose, emit: emits }) {
     const props = __props;
+    const { windowWidth } = useWindowWidth();
     expose({ setFocus, setSelect });
     const realInput = ref(null);
     const value = computed$2({
@@ -11647,10 +11691,9 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
     const onChange = (event) => {
       emits("change", event);
     };
-    const computedStyleInput = computed$2(() => {
+    const computedClass = computed$2(() => {
       const list = [];
-      if (props.width)
-        list.push({ width: props.width });
+      list.push(functions.getGroupClassContainer(props));
       return list;
     });
     const computedClassInput = computed$2(() => {
@@ -11666,6 +11709,18 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
         list.push("no-border");
       return list;
     });
+    const computedStyle = computed$2(() => {
+      const list = [];
+      list.push(functions.getGroupBreakStyleContainer(props, windowWidth.value));
+      return list;
+    });
+    const computedStyleInput = computed$2(() => {
+      const list = [];
+      list.push(functions.getGroupBreakStyle(props, windowWidth.value));
+      if (props.width)
+        list.push({ width: props.width });
+      return list;
+    });
     function setFocus() {
       realInput.value.focus();
     }
@@ -11673,7 +11728,10 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
       realInput.value.select();
     }
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$e, [
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["ck-input", unref$1(computedClass)]),
+        style: normalizeStyle(unref$1(computedStyle))
+      }, [
         __props.label ? (openBlock(), createBlock(ckLabel, {
           key: 0,
           align: __props.labelAlign,
@@ -11695,17 +11753,16 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
           ref_key: "realInput",
           ref: realInput,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef$1(value) ? value.value = $event : null),
-          autocomplete: __props.autocomplete,
+          autocomplete: __props.autocomplete ? "on" : "off",
           type: __props.type,
           placeholder: __props.placeholder,
           class: normalizeClass(unref$1(computedClassInput)),
           style: normalizeStyle(unref$1(computedStyleInput)),
-          id: __props.label ? "ck-input" : "",
           disabled: __props.disabled,
           onChange: _cache[1] || (_cache[1] = ($event) => onChange($event)),
           onInput: _cache[2] || (_cache[2] = ($event) => onInput($event)),
           onClick: _cache[3] || (_cache[3] = ($event) => onClick($event))
-        }, null, 46, _hoisted_2$8), [
+        }, null, 46, _hoisted_1$e), [
           [vModelDynamic, unref$1(value)]
         ]),
         __props.iconRight ? (openBlock(), createBlock(ckIcon, {
@@ -11715,11 +11772,11 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
           icon: __props.iconRight,
           "icon-pack": __props.iconPack
         }, null, 8, ["icon", "icon-pack"])) : createCommentVNode("", true)
-      ]);
+      ], 6);
     };
   }
 });
-var ckInput = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-6773af39"]]);
+var ckInput = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-459e2aaf"]]);
 var ckTable__headerItems_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _hoisted_1$d = { class: "ck-table__header-items" };
 const _sfc_main$e = /* @__PURE__ */ defineComponent({
@@ -11813,7 +11870,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var TableHeaderItems = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-5638f498"]]);
+var TableHeaderItems = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-be0cc8e8"]]);
 var ckTable__pagination_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _hoisted_1$c = { class: "ck-table__pagination" };
 const _hoisted_2$7 = ["onClick"];
@@ -13282,6 +13339,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
   setup(__props, { emit: emits }) {
     const props = __props;
     const { qmObj: qmObj2 } = main$1;
+    const { windowWidth } = useWindowWidth();
     const IsPopupActive = ref({
       columnsManager: false
     });
@@ -13317,7 +13375,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
       }
     });
     const isMobileVisible = computed$2(() => {
-      return realWindowWidth.value <= +props.mobileMaxWidth;
+      return windowWidth.value <= +props.mobileMaxWidth;
     });
     function refreshList(pageChange = false) {
       emits("refreshList", pageChange);
@@ -13329,19 +13387,6 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
         console.log("ERROR ck-table", "The columns list should be an object");
       }
     }
-    const realWindowWidth = ref(0);
-    function handleWindowResize(event) {
-      realWindowWidth.value = event.currentTarget.innerWidth;
-    }
-    onMounted(() => {
-      nextTick$1(() => {
-        window.addEventListener("resize", handleWindowResize);
-      });
-      realWindowWidth.value = window.innerWidth;
-    });
-    onBeforeUnmount(() => {
-      window.removeEventListener("resize", handleWindowResize);
-    });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(Fragment, null, [
         __props.hasColumnsManager && unref$1(columnsAreObj) ? (openBlock(), createBlock(TableColumnsManager, {
@@ -13411,7 +13456,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var ckTable = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-6ea45185"]]);
+var ckTable = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-79775e25"]]);
 var ckTd_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _sfc_main$8 = /* @__PURE__ */ defineComponent({
   props: {