cleek 2.2.4 → 2.3.2

package/dist/cleek.es.js

@@ -18,6 +18,20 @@ var __spreadValues = (a, b) => {
 };
 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, nextTick as nextTick$1, onBeforeUnmount, getCurrentInstance, withDirectives, isRef as isRef$1, vModelDynamic, Fragment, renderList, mergeProps, withKeys, withModifiers, pushScopeId, popScopeId, vModelRadio, vModelSelect, vModelCheckbox, vModelText } from "vue";
+var defaultCleekOptions = {
+  colors: {
+    primary: "#559933",
+    secondary: "#559933",
+    success: "#559933",
+    warning: "#559933",
+    danger: "#559933",
+    dark: "#559933",
+    light: "#559933"
+  },
+  button: {
+    type: "filled"
+  }
+};
 var ckDropdown_vue_vue_type_style_index_0_scoped_true_lang = "";
 var _export_sfc = (sfc, props) => {
   const target = sfc.__vccOpts || sfc;
@@ -11542,7 +11556,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
   props: {
     title: { type: String, default: void 0 },
     disabled: { type: Boolean, default: false },
-    type: { type: String, default: "outlined", validator: validators.buttonType },
+    type: { type: String, default: void 0, validator: validators.buttonType },
     color: { type: String, default: "primary" },
     align: { type: String, default: "left", validator: validators.align },
     size: { type: String, default: "m", validator: validators.size },
@@ -11560,12 +11574,24 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
   setup(__props, { emit: emits }) {
     const props = __props;
     const { windowWidth } = useWindowWidth();
+    const defaultButtonType = "outlined";
+    let $cleekOptions;
     const isMounted = ref(false);
+    const realButtonType = computed$2(() => {
+      if (props.type)
+        return props.type;
+      if (isMounted.value) {
+        console.log("$cleekOptions", $cleekOptions);
+        if ($cleekOptions)
+          return $cleekOptions.button.type;
+      }
+      return defaultButtonType;
+    });
     const computedClass = computed$2(() => {
       const classList2 = [];
       classList2.push(functions.getGroupClass(props));
       if (props.color !== "primary") {
-        if (props.type === "filled") {
+        if (realButtonType.value === "filled") {
           classList2.push(`ck-component__bg-color--${props.color}`);
         } else {
           classList2.push(`ck-component__border-color--${props.color}`);
@@ -11574,12 +11600,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
       if (props.align === "center" || props.align === "right") {
         classList2.push(`ck-button__align--${props.align}`);
       }
-      if (isMounted.value)
-        ;
-      let type = props.type;
-      if (!validators.buttonType(props.type))
-        type = "outlined";
-      classList2.push(`type-${type}`);
+      classList2.push(`type-${realButtonType.value}`);
       if (props.size)
         classList2.push(`rs-component-size__${props.size}`);
       return classList2;
@@ -11596,7 +11617,10 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
     }
     onMounted(() => {
       getCurrentInstance().ctx;
-      isMounted.value = true;
+      $cleekOptions = functions.getCleekOptions(getCurrentInstance);
+      setTimeout(() => {
+        isMounted.value = true;
+      }, 3e3);
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("button", {
@@ -11610,22 +11634,22 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
       }, [
         __props.icon ? (openBlock(), createBlock(ckIcon, {
           key: 0,
-          class: "ck-button__icon-left",
+          class: normalizeClass(["ck-button__icon-left", { "just-icon": !_ctx.$slots.default }]),
           icon: __props.icon,
           "icon-pack": __props.iconPack
-        }, null, 8, ["icon", "icon-pack"])) : createCommentVNode("", true),
+        }, null, 8, ["icon", "icon-pack", "class"])) : createCommentVNode("", true),
         renderSlot(_ctx.$slots, "default", {}, void 0, true),
         __props.iconRight ? (openBlock(), createBlock(ckIcon, {
           key: 1,
-          class: "ck-button__icon-right",
+          class: normalizeClass(["ck-button__icon-right", { "just-icon": !_ctx.$slots.default }]),
           icon: __props.iconRight,
           "icon-pack": __props.iconPack
-        }, null, 8, ["icon", "icon-pack"])) : createCommentVNode("", true)
+        }, null, 8, ["icon", "icon-pack", "class"])) : createCommentVNode("", true)
       ], 14, _hoisted_1$g);
     };
   }
 });
-var ckButton = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-6a5f73e9"]]);
+var ckButton = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-32d90b96"]]);
 var ckLabel_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _hoisted_1$f = ["for"];
 const _sfc_main$g = /* @__PURE__ */ defineComponent({
@@ -16781,33 +16805,31 @@ var components = /* @__PURE__ */ Object.freeze({
   lockScroll,
   unlockScroll
 });
-function setDefaultColors(options) {
-  if (!options)
-    return;
+function setRootColors(colors) {
   var r = document.querySelector(":root");
-  const colorList = [
-    "primary",
-    "secondary",
-    "primary",
-    "secondary",
-    "success",
-    "warning",
-    "danger",
-    "dark",
-    "light"
-  ];
-  if (options.colors) {
-    colorList.forEach((colorName) => {
-      const colorValue = options.colors[colorName];
-      if (colorValue)
-        r.style.setProperty(`--${colorName}`, colorValue);
-    });
+  for (const key in colors) {
+    const colorValue = colors[key];
+    r.style.setProperty(`--${key}`, colorValue);
+  }
+}
+function getCleekOptions(userOptions) {
+  console.log("userOptions", userOptions);
+  const options = defaultCleekOptions;
+  for (const category in defaultCleekOptions) {
+    if (userOptions[category]) {
+      for (const key in category) {
+        const value = userOptions[category][key];
+        if (value)
+          options[category][key] = value;
+      }
+    }
   }
+  setRootColors(options);
+  console.log("options", options);
+  return options;
 }
 const install = function installCleek(app, options) {
-  app.config.globalProperties.$cleekOptions = options;
-  console.log("arranco paquete", options);
-  setDefaultColors(options);
+  app.config.globalProperties.$cleekOptions = getCleekOptions(options);
   Object.entries(components).forEach(([componentName, component]) => {
     app.component(componentName, component);
   });