cleek 2.4.2 → 2.4.5

package/dist/cleek.es.js

@@ -2339,10 +2339,10 @@ const _hoisted_2$1$1 = {
   class: "v-popper__inner"
 };
 const _hoisted_3$8 = /* @__PURE__ */ createElementVNode("div", { class: "v-popper__arrow-outer" }, null, -1);
-const _hoisted_4$5 = /* @__PURE__ */ createElementVNode("div", { class: "v-popper__arrow-inner" }, null, -1);
+const _hoisted_4$6 = /* @__PURE__ */ createElementVNode("div", { class: "v-popper__arrow-inner" }, null, -1);
 const _hoisted_5$3 = [
   _hoisted_3$8,
-  _hoisted_4$5
+  _hoisted_4$6
 ];
 function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_ResizeObserver = resolveComponent("ResizeObserver");
@@ -2889,16 +2889,22 @@ const plugin = {
   install: install$1,
   options: config$2
 };
-var defaultCleekOptions = {
+const cleekOptions = {
   colors: {
     primary: "#559933",
     secondary: "#559933"
   },
   button: {
-    type: "outlined"
+    type: "outlined",
+    rounded: false
   },
   img: {
     basePath: ""
+  },
+  styles: {
+    type: "outlined",
+    rounded: false,
+    borderColor: "#dae1e7"
   }
 };
 /*!
@@ -18802,6 +18808,18 @@ var functions = {
       classList2.push(`ck-component__group-vertical--${groupVertical}`);
     return classList2;
   },
+  getRoundedValue(propIsRounded, cleekOptions2) {
+    var _a, _b;
+    if (typeof propIsRounded !== "undefined")
+      return propIsRounded;
+    if (typeof ((_a = cleekOptions2 == null ? void 0 : cleekOptions2.styles) == null ? void 0 : _a.rounded) !== "undefined") {
+      return cleekOptions2.styles.rounded;
+    }
+    if (typeof ((_b = cleekOptions2 == null ? void 0 : cleekOptions2.button) == null ? void 0 : _b.rounded) !== "undefined") {
+      return cleekOptions2.button.rounded;
+    }
+    return false;
+  },
   getWidthByWidthBreaks(widthBreaks, windowWidth) {
     if (widthBreaks) {
       let realWidthBreaks = [...widthBreaks];
@@ -20882,15 +20900,12 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     const defaultButtonType = "outlined";
     const defaultColor = "primary";
     const defaultAlign = "left";
-    let $cleekOptions;
-    const isMounted = ref(false);
+    let cleekOptions2;
     const realButtonType = computed$2(() => {
       if (props.type)
         return props.type;
-      if (isMounted.value) {
-        if ($cleekOptions)
-          return $cleekOptions.button.type;
-      }
+      if (cleekOptions2)
+        return cleekOptions2.button.type;
       return defaultButtonType;
     });
     const computedClass = computed$2(() => {
@@ -20908,9 +20923,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
       if (align === "center" || align === "right") {
         list.push(`ck-button__align--${props.align}`);
       }
-      if (props.rounded)
-        console.log("rounded");
-      if (props.rounded)
+      if (functions.getRoundedValue(props.rounded, cleekOptions2))
         list.push("rounded");
       list.push(`type-${realButtonType.value}`);
       if (props.size)
@@ -20935,8 +20948,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
       emits("click", event);
     }
     onMounted(() => {
-      $cleekOptions = functions.getCleekOptions(getCurrentInstance);
-      isMounted.value = true;
+      cleekOptions2 = functions.getCleekOptions(getCurrentInstance);
     });
     functions.preventUnusedError([
       onClick2,
@@ -20970,7 +20982,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var CkButton = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-debd87be"]]);
+var CkButton = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-39c8f698"]]);
 var ckLabel_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _hoisted_1$h = ["for"];
 const _sfc_main$i = /* @__PURE__ */ defineComponent({
@@ -21024,6 +21036,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
     width: null,
     align: null,
     rounded: { type: Boolean },
+    borderColor: null,
     autoSelect: { type: Boolean },
     delayChangeTime: null
   },
@@ -21031,6 +21044,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
   setup(__props, { expose, emit: emits }) {
     const props = __props;
     expose({ setFocus, setSelect });
+    let cleekOptions2;
     const defaultType = "text";
     const defaultDelayChangeTime = 300;
     const realInput = ref(null);
@@ -21074,10 +21088,20 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
         list.push(`align--${props.align}`);
       if (props.hideBorder)
         list.push("no-border");
-      if (props.rounded)
+      if (functions.getRoundedValue(props.rounded, cleekOptions2))
         list.push("rounded");
       if (props.size)
         list.push(`ck-input-size__${props.size}`);
+      if (props.borderColor && functions.isColorTemplateVariable(props.borderColor)) {
+        list.push(`ck-input--border-color__${props.borderColor}`);
+      }
+      return list;
+    });
+    const computedStyleInput = computed$2(() => {
+      const list = [];
+      if (props.borderColor && !functions.isColorTemplateVariable(props.borderColor)) {
+        list.push({ "border-color": props.borderColor });
+      }
       return list;
     });
     const computedStyle = computed$2(() => {
@@ -21114,6 +21138,9 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
       onInput,
       onClick2
     ]);
+    onMounted(() => {
+      cleekOptions2 = functions.getCleekOptions(getCurrentInstance);
+    });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         class: "ck-input",
@@ -21145,11 +21172,12 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
           type: __props.type || defaultType,
           placeholder: __props.placeholder,
           class: normalizeClass(unref$1(computedClassInput)),
+          style: normalizeStyle(unref$1(computedStyleInput)),
           disabled: __props.disabled,
           onChange: _cache[1] || (_cache[1] = ($event) => onChange2($event)),
           onInput: _cache[2] || (_cache[2] = ($event) => onInput($event)),
           onClick: _cache[3] || (_cache[3] = ($event) => onClick2($event))
-        }, null, 42, _hoisted_1$g), [
+        }, null, 46, _hoisted_1$g), [
           [vModelDynamic, unref$1(value)]
         ]),
         __props.iconRight ? (openBlock(), createBlock(CkIcon, {
@@ -21163,7 +21191,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var CkInput = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-30f54a2c"]]);
+var CkInput = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-076ee92e"]]);
 var ckTable__headerItems_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _hoisted_1$f = { class: "ck-table__header-items" };
 const _sfc_main$g = /* @__PURE__ */ defineComponent({
@@ -22233,7 +22261,7 @@ const _hoisted_1$c = {
 };
 const _hoisted_2$8 = /* @__PURE__ */ createElementVNode("div", { class: "blackout" }, null, -1);
 const _hoisted_3$5 = { class: "ck-popup__slot-header" };
-const _hoisted_4$4 = {
+const _hoisted_4$5 = {
   key: 0,
   class: "ck-popup__title"
 };
@@ -22306,7 +22334,7 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
             style: normalizeStyle(unref$1(computedStyleContent))
           }, [
             createElementVNode("div", _hoisted_3$5, [
-              __props.title ? (openBlock(), createElementBlock("h3", _hoisted_4$4, toDisplayString(__props.title), 1)) : createCommentVNode("", true),
+              __props.title ? (openBlock(), createElementBlock("h3", _hoisted_4$5, toDisplayString(__props.title), 1)) : createCommentVNode("", true),
               renderSlot(_ctx.$slots, "header"),
               !(__props.notCloseBtn || __props.notClose) ? (openBlock(), createBlock(CkIcon, {
                 key: 1,
@@ -22419,7 +22447,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var TableColumnsManager = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-2d6fd542"]]);
+var TableColumnsManager = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-31e8c81c"]]);
 var ckTable_vue_vue_type_style_index_0_lang = "";
 var ckTable_vue_vue_type_style_index_1_scoped_true_lang = "";
 const _hoisted_1$a = { class: "ck-table" };
@@ -22431,7 +22459,7 @@ const _hoisted_3$4 = {
   key: 0,
   class: "ck-table__header--slot"
 };
-const _hoisted_4$3 = { key: 0 };
+const _hoisted_4$4 = { key: 0 };
 const _hoisted_5$1 = { key: 1 };
 const _hoisted_6$1 = {
   key: 2,
@@ -22578,7 +22606,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
             createElementVNode("table", {
               class: normalizeClass(["ck-table__table", unref$1(computedClassTable)])
             }, [
-              unref$1(filteredColumnsList).length && !(_ctx.$slots.mobile && unref$1(isMobileVisible)) ? (openBlock(), createElementBlock("thead", _hoisted_4$3, [
+              unref$1(filteredColumnsList).length && !(_ctx.$slots.mobile && unref$1(isMobileVisible)) ? (openBlock(), createElementBlock("thead", _hoisted_4$4, [
                 createVNode(CkTr, null, {
                   default: withCtx(() => [
                     (openBlock(true), createElementBlock(Fragment, null, renderList(unref$1(filteredColumnsList), (col) => {
@@ -22831,7 +22859,7 @@ const _withScopeId$2 = (n) => (pushScopeId("data-v-2e09b238"), n = n(), popScope
 const _hoisted_1$7 = ["onKeyup"];
 const _hoisted_2$5 = ["name", "value", "disabled"];
 const _hoisted_3$3 = /* @__PURE__ */ _withScopeId$2(() => /* @__PURE__ */ createElementVNode("div", { class: "c-Radio__element" }, null, -1));
-const _hoisted_4$2 = {
+const _hoisted_4$3 = {
   key: 0,
   class: "c-Radio__label"
 };
@@ -22888,7 +22916,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
             [vModelRadio, unref$1(value)]
           ]),
           _hoisted_3$3,
-          option.label ? (openBlock(), createElementBlock("span", _hoisted_4$2, toDisplayString(option.label), 1)) : createCommentVNode("", true)
+          option.label ? (openBlock(), createElementBlock("span", _hoisted_4$3, toDisplayString(option.label), 1)) : createCommentVNode("", true)
         ], 16, _hoisted_1$7);
       }), 128);
     };
@@ -22915,6 +22943,8 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     searchable: { type: [Boolean, String] },
     minWidth: null,
     noBorder: { type: Boolean },
+    rounded: { type: Boolean },
+    borderColor: null,
     bgTransparent: { type: Boolean },
     disabled: { type: Boolean },
     group: null,
@@ -22926,6 +22956,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
   emits: ["update:modelValue", "click", "change"],
   setup(__props, { expose, emit: emits }) {
     const props = __props;
+    let cleekOptions2;
     expose({
       setFocus
     });
@@ -22963,8 +22994,20 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     const computedClassSelect = computed$2(() => {
       const list = [];
       list.push(functions.getGroupClass(props, windowWidth.value));
+      if (functions.getRoundedValue(props.rounded, cleekOptions2))
+        list.push("rounded");
       if (isClearBtnVisible.value)
         list.push("clear-able");
+      if (props.borderColor && functions.isColorTemplateVariable(props.borderColor)) {
+        list.push(`ck-input--border-color__${props.borderColor}`);
+      }
+      return list;
+    });
+    const computedStyleSelect = computed$2(() => {
+      const list = [];
+      if (props.borderColor && !functions.isColorTemplateVariable(props.borderColor)) {
+        list.push({ "border-color": props.borderColor });
+      }
       return list;
     });
     const computedStyle = computed$2(() => {
@@ -23045,6 +23088,9 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     }
     function setFocus() {
     }
+    onMounted(() => {
+      cleekOptions2 = functions.getCleekOptions(getCurrentInstance);
+    });
     functions.preventUnusedError([
       computedStyle,
       computedClassSelect,
@@ -23078,6 +23124,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
         withDirectives(createElementVNode("select", {
           "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef$1(value) ? value.value = $event : null),
           class: normalizeClass(unref$1(computedClassSelect)),
+          style: normalizeStyle(unref$1(computedStyleSelect)),
           disabled: __props.disabled,
           onClick: _cache[2] || (_cache[2] = ($event) => onClick2($event)),
           onChange: _cache[3] || (_cache[3] = ($event) => onChange2($event))
@@ -23088,14 +23135,14 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
               key: option
             }, toDisplayString(getOptionName(option)), 9, _hoisted_2$4);
           }), 128))
-        ], 42, _hoisted_1$6), [
+        ], 46, _hoisted_1$6), [
           [vModelSelect, unref$1(value)]
         ])
       ], 4);
     };
   }
 });
-var ckSelect = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-37612997"]]);
+var ckSelect = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-1a65447e"]]);
 var ckSidebar_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _hoisted_1$5 = {
   key: 1,
@@ -23171,7 +23218,7 @@ const _withScopeId$1 = (n) => (pushScopeId("data-v-f66bfcc0"), n = n(), popScope
 const _hoisted_1$4 = ["disabled"];
 const _hoisted_2$3 = { class: "ck-switch__slider-container" };
 const _hoisted_3$2 = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ createElementVNode("div", { class: "ck-switch__slider" }, null, -1));
-const _hoisted_4$1 = {
+const _hoisted_4$2 = {
   key: 0,
   class: "ck-switch__content"
 };
@@ -23258,7 +23305,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
             "icon-pack": __props.iconPack
           }, null, 8, ["icon", "icon-pack", "class"])) : createCommentVNode("", true)
         ]),
-        _ctx.$slots.default ? (openBlock(), createElementBlock("span", _hoisted_4$1, [
+        _ctx.$slots.default ? (openBlock(), createElementBlock("span", _hoisted_4$2, [
           renderSlot(_ctx.$slots, "default", {}, void 0, true)
         ])) : createCommentVNode("", true)
       ], 16);
@@ -23399,7 +23446,7 @@ const _hoisted_3$1 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createEl
     height: "7rem"
   })
 ], -1));
-const _hoisted_4 = { class: "ck-confirm__title" };
+const _hoisted_4$1 = { class: "ck-confirm__title" };
 const _hoisted_5 = { class: "ck-confirm__message" };
 const _hoisted_6 = { class: "ck-confirm__buttons-container" };
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
@@ -23430,7 +23477,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", _hoisted_1$1, [
         createElementVNode("div", _hoisted_2$1, [
           _hoisted_3$1,
-          createElementVNode("div", _hoisted_4, toDisplayString(title.value), 1),
+          createElementVNode("div", _hoisted_4$1, toDisplayString(title.value), 1),
           createElementVNode("div", _hoisted_5, toDisplayString(msg.value), 1),
           createElementVNode("div", _hoisted_6, [
             createElementVNode("button", {
@@ -23449,43 +23496,59 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
 });
 var CkConfirmComponent = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-bc51fc7a"]]);
 var CkNotify_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1 = { class: "ck-notify__title" };
-const _hoisted_2 = { class: "close-btn" };
-const _hoisted_3 = { class: "ck-notify__text" };
+const _hoisted_1 = { class: "ck-notify__container" };
+const _hoisted_2 = { class: "ck-notify__title" };
+const _hoisted_3 = { class: "close-btn" };
+const _hoisted_4 = { class: "ck-notify__text" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { expose }) {
     const isActive = ref(true);
     const title = ref("");
     const text2 = ref("");
     const color = ref("");
+    const duration = ref(0);
+    const closeCallback = ref(() => {
+    });
     expose({
       title,
       text: text2,
-      color
+      color,
+      duration,
+      closeCallback
+    });
+    onMounted(() => {
+      setTimeout(() => {
+        closeCallback.value();
+      }, duration.value);
     });
     return (_ctx, _cache) => {
       return isActive.value ? (openBlock(), createBlock(Teleport, {
         key: 0,
         to: "body"
       }, [
-        createElementVNode("div", {
-          class: "ck-notify",
-          style: normalizeStyle({ "background-color": color.value }),
-          onClick: _cache[0] || (_cache[0] = ($event) => isActive.value = false)
-        }, [
-          createElementVNode("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_1, [
+          createElementVNode("div", {
+            class: "ck-notify",
+            style: normalizeStyle({ "background-color": color.value }),
+            onClick: _cache[0] || (_cache[0] = ($event) => {
+              isActive.value = false;
+              closeCallback.value();
+            })
+          }, [
             createElementVNode("div", _hoisted_2, [
-              createVNode(CkIcon, { icon: "times" })
+              createElementVNode("div", _hoisted_3, [
+                createVNode(CkIcon, { icon: "times" })
+              ]),
+              createTextVNode(toDisplayString(title.value), 1)
             ]),
-            createTextVNode(toDisplayString(title.value), 1)
-          ]),
-          createElementVNode("div", _hoisted_3, toDisplayString(text2.value), 1)
-        ], 4)
+            createElementVNode("div", _hoisted_4, toDisplayString(text2.value), 1)
+          ], 4)
+        ])
       ])) : createCommentVNode("", true);
     };
   }
 });
-var CkNotifyComponent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-286f3370"]]);
+var CkNotifyComponent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-667c806b"]]);
 const defaultDuration = 2e3;
 var ckNotify = {
   confirm({
@@ -23520,11 +23583,10 @@ var ckNotify = {
     instance.title = title;
     instance.text = text2;
     instance.color = color;
-    console.log("duration", duration);
-    setTimeout(() => {
+    instance.duration = duration;
+    instance.closeCallback = () => {
       instance.$el.remove();
-      console.log("cierro");
-    }, duration);
+    };
   },
   notifySuccess(text2 = "", title = "\xC9xito") {
     this.notify({ text: text2, title, color: "#66CC00" });
@@ -23573,8 +23635,8 @@ function setRootColors(colors) {
   }
 }
 function getCleekOptions(userOptions) {
-  const options = defaultCleekOptions;
-  for (const category in defaultCleekOptions) {
+  const options = cleekOptions;
+  for (const category in cleekOptions) {
     if (userOptions[category]) {
       for (const key in userOptions[category]) {
         const value = userOptions[category][key];