@vue-interface/btn-activity 2.0.0-beta.14 → 2.0.0-beta.16

package/dist/btn-activity.js

@@ -1,10 +1,10 @@
 import { ActivityIndicator as d } from "@vue-interface/activity-indicator";
-import { Btn as v } from "@vue-interface/btn";
-import { defineComponent as h, resolveComponent as n, openBlock as y, createBlock as p, mergeProps as b, withCtx as m, renderSlot as u, createTextVNode as f, toDisplayString as g, createVNode as A, normalizeProps as $, guardReactiveProps as k } from "vue";
+import { Btn as h } from "@vue-interface/btn";
+import { defineComponent as v, resolveComponent as a, openBlock as y, createBlock as p, mergeProps as b, withCtx as u, renderSlot as m, createTextVNode as f, toDisplayString as g, createVNode as A, normalizeProps as $, guardReactiveProps as k } from "vue";
 const w = function(t) {
-  const e = parseFloat(t || 0), i = t && t.match(/m?s/), a = i ? i[0] : !1;
+  const e = parseFloat(t || 0), i = t && t.match(/m?s/), o = i ? i[0] : !1;
   let s;
-  switch (a) {
+  switch (o) {
     case "s":
       s = e * 1e3;
       break;
@@ -14,7 +14,7 @@ const w = function(t) {
       break;
   }
   return s || 0;
-}, o = function(t, e) {
+}, n = function(t, e) {
   const i = (t.ownerDocument || document).defaultView;
   setTimeout(
     e,
@@ -22,10 +22,10 @@ const w = function(t) {
       i == null ? void 0 : i.getComputedStyle(t).animationDuration
     )
   );
-}, B = h({
+}, B = v({
   components: {
     ActivityIndicator: d,
-    Btn: v
+    Btn: h
   },
   inheritAttrs: !1,
   props: {
@@ -49,8 +49,8 @@ const w = function(t) {
     * The type of activity indicator inside the button.
     */
     indicator: {
-      type: [Object, String],
-      default: "spinner"
+      type: Object,
+      required: !0
     },
     /**
     * The button label.
@@ -67,25 +67,11 @@ const w = function(t) {
       default: "right"
     },
     /**
-    * The size of the button.
-    */
-    size: {
-      type: String,
-      default: "md"
-    },
-    /**
     * The HTML tag.
     */
     tag: {
       type: String,
       default: void 0
-    },
-    /**
-    * The variant of the button.
-    */
-    variant: {
-      type: String,
-      default: "primary"
     }
   },
   emits: ["click", "hide-activity", "show-activity"],
@@ -100,8 +86,6 @@ const w = function(t) {
     */
     classes() {
       return {
-        disabled: this.disabled,
-        active: this.active,
         "btn-activity": this.activity,
         [`btn-activity-${this.orientation.replace("btn-activity-", "")}`]: !!this.orientation,
         [`btn-activity-indicator-${this.indicatorProps.type.replace("btn-activity-indicator-", "")}`]: !!this.indicatorProps.type
@@ -143,7 +127,7 @@ const w = function(t) {
     * Hide the activity indicator inside the button.
     */
     hideActivity() {
-      this.$el.classList.add("btn-hide-activity"), o(this.$el, () => {
+      this.$el.classList.add("btn-hide-activity"), n(this.$el, () => {
         this.disabled || this.enable(), this.currentActivity = !1, this.$el.classList.remove("btn-activity", "btn-hide-activity"), this.$emit("hide-activity");
       });
     },
@@ -151,7 +135,7 @@ const w = function(t) {
     * Show the activity indicator inside the button.
     */
     showActivity() {
-      this.currentActivity = !0, this.disable(), o(this.$el, () => {
+      this.currentActivity = !0, this.disable(), n(this.$el, () => {
         this.$el.classList.add("btn-activity"), this.$emit("show-activity");
       });
     },
@@ -163,21 +147,19 @@ const w = function(t) {
     }
   }
 });
-const S = (t, e) => {
+const P = (t, e) => {
   const i = t.__vccOpts || t;
-  for (const [a, s] of e)
-    i[a] = s;
+  for (const [o, s] of e)
+    i[o] = s;
   return i;
 };
-function P(t, e, i, a, s, C) {
-  const c = n("ActivityIndicator"), r = n("Btn");
+function C(t, e, i, o, s, S) {
+  const c = a("ActivityIndicator"), r = a("Btn");
   return y(), p(r, b({
     active: t.active,
     block: t.block,
     disabled: t.disabled,
-    size: t.size,
     tag: t.tag,
-    variant: t.variant,
     class: t.classes
   }, Object.assign({}, t.$attrs, { onClick: void 0 }), {
     onClick: e[0] || (e[0] = (l) => !t.disabled && t.$emit("click", l, {
@@ -188,17 +170,17 @@ function P(t, e, i, a, s, C) {
       hideActivity: t.hideActivity
     }))
   }), {
-    default: m(() => [
-      u(t.$slots, "default", {}, () => [
+    default: u(() => [
+      m(t.$slots, "default", {}, () => [
         f(g(t.label), 1)
       ]),
       A(c, $(k(t.indicatorProps)), null, 16)
     ]),
     _: 3
-  }, 16, ["active", "block", "disabled", "size", "tag", "variant", "class"]);
+  }, 16, ["active", "block", "disabled", "tag", "class"]);
 }
-const I = /* @__PURE__ */ S(B, [["render", P]]);
+const O = /* @__PURE__ */ P(B, [["render", C]]);
 export {
-  I as BtnActivity
+  O as BtnActivity
 };
 //# sourceMappingURL=btn-activity.js.map

package/dist/btn-activity.js.map

@@ -1 +1 @@
-{"version":3,"file":"btn-activity.js","sources":["../src/BtnActivity.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { ActivityIndicator } from '@vue-interface/activity-indicator';\nimport { Btn } from '@vue-interface/btn';\nimport { defineComponent } from 'vue';\n\nconst convertAnimationDelayToInt = function (delay: any) {\n    const num = parseFloat(delay || 0);\n    const matches = delay && delay.match(/m?s/);\n    const unit = matches ? matches[0] : false;\n\n    let milliseconds;\n\n    switch (unit) {\n    case 's': // seconds\n        milliseconds = num * 1000;\n        break;\n    case 'ms':\n    default:\n        milliseconds = num;\n        break;\n    }\n\n    return milliseconds || 0;\n};\n\nconst animated = function (el: HTMLElement, callback: Function) {\n    const defaultView = (el.ownerDocument || document).defaultView;\n\n    setTimeout(\n        callback,\n        convertAnimationDelayToInt(\n            defaultView?.getComputedStyle(el).animationDuration\n        )\n    );\n};\n\nexport default defineComponent({\n\n    components: {\n        ActivityIndicator,\n        Btn,\n    },\n\n    inheritAttrs: false,\n\n    props: {\n        /**\n\t\t * Make the button appear with the active state.\n\t\t */\n        active: Boolean,\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        activity: Boolean,\n\n        /**\n\t\t * Display the button as block width.\n\t\t */\n        block: Boolean,\n\n        /**\n\t\t * Disable the button.\n\t\t */\n        disabled: Boolean,\n\n        /**\n\t\t * The type of activity indicator inside the button.\n\t\t */\n        indicator: {\n            type: [Object, String],\n            default: 'spinner',\n        },\n\n        /**\n\t\t * The button label.\n\t\t */\n        label: {\n            type: String,\n            default: undefined\n        },\n\n        /**\n\t\t * The orientation of the activity button inside the button.\n\t\t */\n        orientation: {\n            type: String,\n            default: 'right',\n        },\n\n        /**\n\t\t * The size of the button.\n\t\t */\n        size: {\n            type: String,\n            default: 'md',\n        },\n\n        /**\n\t\t * The HTML tag.\n\t\t */\n        tag: {\n            type: String,\n            default: undefined\n        },\n\n        /**\n\t\t * The variant of the button.\n\t\t */\n        variant: {\n            type: String,\n            default: 'primary',\n        },\n    },\n\n    emits: ['click', 'hide-activity', 'show-activity'],\n\n    data() {\n        return {\n            currentActivity: this.activity,\n        };\n    },\n\n    computed: {\n        /**\n\t\t * An object of classes to append to the button.\n\t\t */\n        classes() {\n            return {\n                disabled: this.disabled,\n                active: this.active,\n                'btn-activity': this.activity,\n                [`btn-activity-${this.orientation.replace('btn-activity-', '')}`]: !!this.orientation,\n                [`btn-activity-indicator-${this.indicatorProps.type.replace('btn-activity-indicator-', '')}`]: !!this.indicatorProps.type,\n            };\n        },\n\n        indicatorProps() {\n            return Object.assign(\n                {\n                    type: 'spinner',\n                },\n                (typeof this.indicator === 'string'\n                    ? {\n                        type: this.indicator,\n                    }\n                    : this.indicator) || {}\n            );\n        },\n    },\n\n    watch: {\n        activity(value: boolean) {\n            if(value) {\n                this.showActivity();\n            } else {\n                this.hideActivity();\n            }\n        },\n    },\n\n    mounted() {\n        if(this.activity) {\n            this.showActivity();\n        }\n    },\n\n    methods: {\n        /**\n\t\t * Disable the button.\n\t\t */\n        disable(): void {\n            this.$el.disabled = true;\n            this.$el.classList.add('disabled');\n        },\n\n        /**\n\t\t * Enable the button.\n\t\t */\n        enable(): void {\n            this.$el.disabled = false;\n            this.$el.classList.remove('disabled');\n        },\n\n        /**\n\t\t * Hide the activity indicator inside the button.\n\t\t */\n        hideActivity(): void {\n            this.$el.classList.add('btn-hide-activity');\n\n            animated(this.$el, () => {\n                if(!this.disabled) {\n                \tthis.enable();\n                }\n\t\t\t\t\n                this.currentActivity = false;\n                this.$el.classList.remove('btn-activity', 'btn-hide-activity');\n                this.$emit('hide-activity');\n            });\n        },\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        showActivity(): void {\n            this.currentActivity = true;\n            this.disable();\n\n            animated(this.$el, () => {\n                this.$el.classList.add('btn-activity');\n                this.$emit('show-activity');\n            });\n        },\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        toggle(): void {\n            if(!this.currentActivity) {\n                this.showActivity();\n            } else {\n                this.hideActivity();\n            }\n        },\n    },\n});\n</script>\n\n<template>\n    <Btn\n        :active=\"active\"\n        :block=\"block\"\n        :disabled=\"disabled\"\n        :size=\"size\"\n        :tag=\"tag\"\n        :variant=\"variant\"\n        :class=\"classes\"\n        v-bind=\"Object.assign({}, $attrs, { onClick: undefined })\"\n        @click=\"!disabled && $emit('click', $event, {\n            disable,\n            enable,\n            toggle,\n            showActivity,\n            hideActivity,\n        })\">\n        <slot>{{ label }}</slot>\n        <ActivityIndicator v-bind=\"indicatorProps\" />\n    </Btn>\n</template>\n\n<style>\n@keyframes btn-activity-in {\n\n\t0%,\n\t100% {\n\t\ttransform: scale(1);\n\t}\n\n\t30% {\n\t\ttransform: scale(0.98);\n\t}\n}\n\n@keyframes btn-activity-out {\n\n\t0%,\n\t100% {\n\t\ttransform: scale(1);\n\t}\n\n\t70% {\n\t\ttransform: scale(0.98);\n\t}\n}\n\n.btn-activity-top,\n.btn.btn-activity-top,\n.btn-activity-bottom,\n.btn.btn-activity-bottom,\n.btn-activity-left,\n.btn.btn-activity-left,\n.btn-activity-right,\n.btn.btn-activity-right {\n\tdisplay: inline-flex;\n\tposition: relative;\n\ttransition: all calc(333ms / 2) ease-in;\n}\n\n.btn-activity-top .activity-indicator,\n.btn-activity-bottom .activity-indicator,\n.btn-activity-left .activity-indicator,\n.btn-activity-right .activity-indicator {\n\topacity: 0;\n\tposition: absolute;\n\tvisibility: hidden;\n\ttransition: opacity 333ms ease-in;\n}\n\n.btn-activity-top,\n.btn-activity-bottom {\n\tflex-direction: column;\n\talign-items: center;\n}\n\n.btn-activity-top .activity-indicator,\n.btn-activity-bottom .activity-indicator {\n\tmargin-left: auto;\n\tmargin-right: auto;\n}\n\n.btn-activity-top {\n\tflex-direction: column-reverse;\n}\n\n.btn-activity-top .activity-indicator {\n\tpadding-bottom: 1em;\n}\n\n.btn-activity-bottom .activity-indicator {\n\tpadding-top: 1em;\n}\n\n.btn-activity-left,\n.btn-activity-right {\n\talign-items: center;\n\tjustify-content: center;\n}\n\n.btn-activity-left {\n\tflex-direction: row-reverse;\n}\n\n.btn-activity-left .activity-indicator {\n\tpadding-right: 1em;\n}\n\n.btn-activity-right .activity-indicator {\n\tpadding-left: 1em;\n}\n\n.btn-activity:not(.btn-link) {\n\tanimation: btn-activity-in 333ms;\n}\n\n.btn-hide-activity:not(.btn-link) {\n\tanimation: btn-activity-out 333ms;\n}\n\n.btn-activity.btn-hide-activity .activity-indicator {\n\topacity: 0;\n}\n\n.btn-activity .activity-indicator {\n\topacity: 1;\n\tvisibility: visible;\n\tposition: relative;\n\tfont-size: 0.55em;\n}\n</style>\n"],"names":["convertAnimationDelayToInt","delay","num","matches","unit","milliseconds","animated","el","callback","defaultView","_sfc_main","defineComponent","ActivityIndicator","Btn","value","_resolveComponent","_openBlock","_createBlock","_component_Btn","_mergeProps","_ctx","_cache","$event","_withCtx","_createTextVNode","_toDisplayString"],"mappings":"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"}
+{"version":3,"file":"btn-activity.js","sources":["../src/BtnActivity.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { ActivityIndicator } from '@vue-interface/activity-indicator';\nimport { Btn } from '@vue-interface/btn';\nimport { defineComponent } from 'vue';\n\nconst convertAnimationDelayToInt = function (delay: any) {\n    const num = parseFloat(delay || 0);\n    const matches = delay && delay.match(/m?s/);\n    const unit = matches ? matches[0] : false;\n\n    let milliseconds;\n\n    switch (unit) {\n    case 's': // seconds\n        milliseconds = num * 1000;\n        break;\n    case 'ms':\n    default:\n        milliseconds = num;\n        break;\n    }\n\n    return milliseconds || 0;\n};\n\nconst animated = function (el: HTMLElement, callback: Function) {\n    const defaultView = (el.ownerDocument || document).defaultView;\n\n    setTimeout(\n        callback,\n        convertAnimationDelayToInt(\n            defaultView?.getComputedStyle(el).animationDuration\n        )\n    );\n};\n\nexport default defineComponent({\n\n    components: {\n        ActivityIndicator,\n        Btn,\n    },\n\n    inheritAttrs: false,\n\n    props: {\n        /**\n\t\t * Make the button appear with the active state.\n\t\t */\n        active: Boolean,\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        activity: Boolean,\n\n        /**\n\t\t * Display the button as block width.\n\t\t */\n        block: Boolean,\n\n        /**\n\t\t * Disable the button.\n\t\t */\n        disabled: Boolean,\n\n        /**\n\t\t * The type of activity indicator inside the button.\n\t\t */\n        indicator: {\n            type: Object,\n            required: true\n        },\n\n        /**\n\t\t * The button label.\n\t\t */\n        label: {\n            type: String,\n            default: undefined\n        },\n\n        /**\n\t\t * The orientation of the activity button inside the button.\n\t\t */\n        orientation: {\n            type: String,\n            default: 'right',\n        },\n\n        /**\n\t\t * The HTML tag.\n\t\t */\n        tag: {\n            type: String,\n            default: undefined\n        },\n    },\n\n    emits: ['click', 'hide-activity', 'show-activity'],\n\n    data() {\n        return {\n            currentActivity: this.activity,\n        };\n    },\n\n    computed: {\n        /**\n\t\t * An object of classes to append to the button.\n\t\t */\n        classes() {\n            return {\n                'btn-activity': this.activity,\n                [`btn-activity-${this.orientation.replace('btn-activity-', '')}`]: !!this.orientation,\n                [`btn-activity-indicator-${this.indicatorProps.type.replace('btn-activity-indicator-', '')}`]: !!this.indicatorProps.type,\n            };\n        },\n\n        indicatorProps() {\n            return Object.assign(\n                {\n                    type: 'spinner',\n                },\n                (typeof this.indicator === 'string'\n                    ? {\n                        type: this.indicator,\n                    }\n                    : this.indicator) || {}\n            );\n        },\n    },\n\n    watch: {\n        activity(value: boolean) {\n            if(value) {\n                this.showActivity();\n            } else {\n                this.hideActivity();\n            }\n        },\n    },\n\n    mounted() {\n        if(this.activity) {\n            this.showActivity();\n        }\n    },\n\n    methods: {\n        /**\n\t\t * Disable the button.\n\t\t */\n        disable(): void {\n            this.$el.disabled = true;\n            this.$el.classList.add('disabled');\n        },\n\n        /**\n\t\t * Enable the button.\n\t\t */\n        enable(): void {\n            this.$el.disabled = false;\n            this.$el.classList.remove('disabled');\n        },\n\n        /**\n\t\t * Hide the activity indicator inside the button.\n\t\t */\n        hideActivity(): void {\n            this.$el.classList.add('btn-hide-activity');\n\n            animated(this.$el, () => {\n                if(!this.disabled) {\n                \tthis.enable();\n                }\n\t\t\t\t\n                this.currentActivity = false;\n                this.$el.classList.remove('btn-activity', 'btn-hide-activity');\n                this.$emit('hide-activity');\n            });\n        },\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        showActivity(): void {\n            this.currentActivity = true;\n            this.disable();\n\n            animated(this.$el, () => {\n                this.$el.classList.add('btn-activity');\n                this.$emit('show-activity');\n            });\n        },\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        toggle(): void {\n            if(!this.currentActivity) {\n                this.showActivity();\n            } else {\n                this.hideActivity();\n            }\n        },\n    },\n});\n</script>\n\n<template>\n    <Btn\n        :active=\"active\"\n        :block=\"block\"\n        :disabled=\"disabled\"\n        :tag=\"tag\"\n        :class=\"classes\"\n        v-bind=\"Object.assign({}, $attrs, { onClick: undefined })\"\n        @click=\"!disabled && $emit('click', $event, {\n            disable,\n            enable,\n            toggle,\n            showActivity,\n            hideActivity,\n        })\">\n        <slot>{{ label }}</slot>\n        <ActivityIndicator v-bind=\"indicatorProps\" />\n    </Btn>\n</template>\n\n<style>\n@keyframes btn-activity-in {\n\n\t0%,\n\t100% {\n\t\ttransform: scale(1);\n\t}\n\n\t30% {\n\t\ttransform: scale(0.98);\n\t}\n}\n\n@keyframes btn-activity-out {\n\n\t0%,\n\t100% {\n\t\ttransform: scale(1);\n\t}\n\n\t70% {\n\t\ttransform: scale(0.98);\n\t}\n}\n\n.btn-activity-top,\n.btn.btn-activity-top,\n.btn-activity-bottom,\n.btn.btn-activity-bottom,\n.btn-activity-left,\n.btn.btn-activity-left,\n.btn-activity-right,\n.btn.btn-activity-right {\n\tdisplay: inline-flex;\n\tposition: relative;\n\ttransition: all calc(333ms / 2) ease-in;\n}\n\n.btn-activity-top .activity-indicator,\n.btn-activity-bottom .activity-indicator,\n.btn-activity-left .activity-indicator,\n.btn-activity-right .activity-indicator {\n\topacity: 0;\n\tposition: absolute;\n\tvisibility: hidden;\n\ttransition: opacity 333ms ease-in;\n}\n\n.btn-activity-top,\n.btn-activity-bottom {\n\tflex-direction: column;\n\talign-items: center;\n}\n\n.btn-activity-top .activity-indicator,\n.btn-activity-bottom .activity-indicator {\n\tmargin-left: auto;\n\tmargin-right: auto;\n}\n\n.btn-activity-top {\n\tflex-direction: column-reverse;\n}\n\n.btn-activity-top .activity-indicator {\n\tpadding-bottom: 1em;\n}\n\n.btn-activity-bottom .activity-indicator {\n\tpadding-top: 1em;\n}\n\n.btn-activity-left,\n.btn-activity-right {\n\talign-items: center;\n\tjustify-content: center;\n}\n\n.btn-activity-left {\n\tflex-direction: row-reverse;\n}\n\n.btn-activity-left .activity-indicator {\n\tpadding-right: 1em;\n}\n\n.btn-activity-right .activity-indicator {\n\tpadding-left: 1em;\n}\n\n.btn-activity:not(.btn-link) {\n\tanimation: btn-activity-in 333ms;\n}\n\n.btn-hide-activity:not(.btn-link) {\n\tanimation: btn-activity-out 333ms;\n}\n\n.btn-activity.btn-hide-activity .activity-indicator {\n\topacity: 0;\n}\n\n.btn-activity .activity-indicator {\n\topacity: 1;\n\tvisibility: visible;\n\tposition: relative;\n\tfont-size: 0.55em;\n}\n</style>\n"],"names":["convertAnimationDelayToInt","delay","num","matches","unit","milliseconds","animated","el","callback","defaultView","_sfc_main","defineComponent","ActivityIndicator","Btn","value","_resolveComponent","_openBlock","_createBlock","_component_Btn","_mergeProps","_ctx","_cache","$event","_withCtx","_createTextVNode","_toDisplayString"],"mappings":";;;AAKA,MAAMA,IAA6B,SAAUC,GAAY;AAC/C,QAAAC,IAAM,WAAWD,KAAS,CAAC,GAC3BE,IAAUF,KAASA,EAAM,MAAM,KAAK,GACpCG,IAAOD,IAAUA,EAAQ,CAAC,IAAI;AAEhC,MAAAE;AAEJ,UAAQD,GAAM;AAAA,IACd,KAAK;AACD,MAAAC,IAAeH,IAAM;AACrB;AAAA,IACJ,KAAK;AAAA,IACL;AACmB,MAAAG,IAAAH;AACf;AAAA,EACJ;AAEA,SAAOG,KAAgB;AAC3B,GAEMC,IAAW,SAAUC,GAAiBC,GAAoB;AACtD,QAAAC,KAAeF,EAAG,iBAAiB,UAAU;AAEnD;AAAA,IACIC;AAAA,IACAR;AAAA,MACIS,KAAA,gBAAAA,EAAa,iBAAiBF,GAAI;AAAA,IACtC;AAAA,EAAA;AAER,GAEAG,IAAeC,EAAgB;AAAA,EAE3B,YAAY;AAAA,IACR,mBAAAC;AAAA,IACA,KAAAC;AAAA,EACJ;AAAA,EAEA,cAAc;AAAA,EAEd,OAAO;AAAA;AAAA;AAAA;AAAA,IAIH,QAAQ;AAAA;AAAA;AAAA;AAAA,IAKR,UAAU;AAAA;AAAA;AAAA;AAAA,IAKV,OAAO;AAAA;AAAA;AAAA;AAAA,IAKP,UAAU;AAAA;AAAA;AAAA;AAAA,IAKV,WAAW;AAAA,MACP,MAAM;AAAA,MACN,UAAU;AAAA,IACd;AAAA;AAAA;AAAA;AAAA,IAKA,OAAO;AAAA,MACH,MAAM;AAAA,MACN,SAAS;AAAA,IACb;AAAA;AAAA;AAAA;AAAA,IAKA,aAAa;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACb;AAAA;AAAA;AAAA;AAAA,IAKA,KAAK;AAAA,MACD,MAAM;AAAA,MACN,SAAS;AAAA,IACb;AAAA,EACJ;AAAA,EAEA,OAAO,CAAC,SAAS,iBAAiB,eAAe;AAAA,EAEjD,OAAO;AACI,WAAA;AAAA,MACH,iBAAiB,KAAK;AAAA,IAAA;AAAA,EAE9B;AAAA,EAEA,UAAU;AAAA;AAAA;AAAA;AAAA,IAIN,UAAU;AACC,aAAA;AAAA,QACH,gBAAgB,KAAK;AAAA,QACrB,CAAC,gBAAgB,KAAK,YAAY,QAAQ,iBAAiB,EAAE,CAAC,EAAE,GAAG,CAAC,CAAC,KAAK;AAAA,QAC1E,CAAC,0BAA0B,KAAK,eAAe,KAAK,QAAQ,2BAA2B,EAAE,CAAC,EAAE,GAAG,CAAC,CAAC,KAAK,eAAe;AAAA,MAAA;AAAA,IAE7H;AAAA,IAEA,iBAAiB;AACb,aAAO,OAAO;AAAA,QACV;AAAA,UACI,MAAM;AAAA,QACV;AAAA,SACC,OAAO,KAAK,aAAc,WACrB;AAAA,UACE,MAAM,KAAK;AAAA,QAAA,IAEb,KAAK,cAAc,CAAC;AAAA,MAAA;AAAA,IAElC;AAAA,EACJ;AAAA,EAEA,OAAO;AAAA,IACH,SAASC,GAAgB;AACrB,MAAGA,IACC,KAAK,aAAa,IAElB,KAAK,aAAa;AAAA,IAE1B;AAAA,EACJ;AAAA,EAEA,UAAU;AACN,IAAG,KAAK,YACJ,KAAK,aAAa;AAAA,EAE1B;AAAA,EAEA,SAAS;AAAA;AAAA;AAAA;AAAA,IAIL,UAAgB;AACZ,WAAK,IAAI,WAAW,IACf,KAAA,IAAI,UAAU,IAAI,UAAU;AAAA,IACrC;AAAA;AAAA;AAAA;AAAA,IAKA,SAAe;AACX,WAAK,IAAI,WAAW,IACf,KAAA,IAAI,UAAU,OAAO,UAAU;AAAA,IACxC;AAAA;AAAA;AAAA;AAAA,IAKA,eAAqB;AACZ,WAAA,IAAI,UAAU,IAAI,mBAAmB,GAEjCR,EAAA,KAAK,KAAK,MAAM;AAClB,QAAC,KAAK,YACR,KAAK,OAAO,GAGb,KAAK,kBAAkB,IACvB,KAAK,IAAI,UAAU,OAAO,gBAAgB,mBAAmB,GAC7D,KAAK,MAAM,eAAe;AAAA,MAAA,CAC7B;AAAA,IACL;AAAA;AAAA;AAAA;AAAA,IAKA,eAAqB;AACjB,WAAK,kBAAkB,IACvB,KAAK,QAAQ,GAEJA,EAAA,KAAK,KAAK,MAAM;AAChB,aAAA,IAAI,UAAU,IAAI,cAAc,GACrC,KAAK,MAAM,eAAe;AAAA,MAAA,CAC7B;AAAA,IACL;AAAA;AAAA;AAAA;AAAA,IAKA,SAAe;AACR,MAAC,KAAK,kBAGL,KAAK,aAAa,IAFlB,KAAK,aAAa;AAAA,IAI1B;AAAA,EACJ;AACJ,CAAC;;;;;;;;wCAIGS,EAgBM,KAAA;SAdIC,EAAO,GAAAC,EAAAC,GAAAC,EAAA;AAAA,IACZ,QAAQC,EAAE;AAAA,IACV,OAAKA,EAAA;AAAA,IACL,UAAOA,EAAA;AAAA,IAAA,KACAA,EAAO;AAAA,IACd,OAAKA,EAAA;AAAA,EAAA,GAAA,OAAA,OAAA,CAAA,GAAoDA,EAAO,QAAA,EAAA,SAAA,OAAA,CAAA,GAAA;AAAA,IAAA,SAAAC,EAAc,CAAM,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAA,CAAAF,EAAA,YAAAA,EAAA,MAAA,SAAAE,GAAA;AAAA,MAAc,SAAAF,EAAA;AAAA,MAAA,QAAAA,EAAA;AAAA;;;;EAOnG,CAAA,GAAA;AAAA,IAAA,SAAAG,EAAA,MAAA;AAAA;QACAC,EAA6CC,EAAAL,EAAA,KAAA,GAAA,CAAA;AAAA,MAAA,CAAA;AAAA;;;;;;"}

package/dist/btn-activity.umd.cjs

@@ -1,2 +1,2 @@
-(function(n,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("@vue-interface/activity-indicator"),require("@vue-interface/btn"),require("vue")):typeof define=="function"&&define.amd?define(["exports","@vue-interface/activity-indicator","@vue-interface/btn","vue"],o):(n=typeof globalThis<"u"?globalThis:n||self,o(n.BtnActivity={},n.VueInterfaceActivityIndicator,n.VueInterfaceBtn,n.Vue))})(this,function(n,o,d,i){"use strict";const l=function(t){const s=parseFloat(t||0),e=t&&t.match(/m?s/),c=e?e[0]:!1;let a;switch(c){case"s":a=s*1e3;break;case"ms":default:a=s;break}return a||0},r=function(t,s){const e=(t.ownerDocument||document).defaultView;setTimeout(s,l(e==null?void 0:e.getComputedStyle(t).animationDuration))},y=i.defineComponent({components:{ActivityIndicator:o.ActivityIndicator,Btn:d.Btn},inheritAttrs:!1,props:{active:Boolean,activity:Boolean,block:Boolean,disabled:Boolean,indicator:{type:[Object,String],default:"spinner"},label:{type:String,default:void 0},orientation:{type:String,default:"right"},size:{type:String,default:"md"},tag:{type:String,default:void 0},variant:{type:String,default:"primary"}},emits:["click","hide-activity","show-activity"],data(){return{currentActivity:this.activity}},computed:{classes(){return{disabled:this.disabled,active:this.active,"btn-activity":this.activity,[`btn-activity-${this.orientation.replace("btn-activity-","")}`]:!!this.orientation,[`btn-activity-indicator-${this.indicatorProps.type.replace("btn-activity-indicator-","")}`]:!!this.indicatorProps.type}},indicatorProps(){return Object.assign({type:"spinner"},(typeof this.indicator=="string"?{type:this.indicator}:this.indicator)||{})}},watch:{activity(t){t?this.showActivity():this.hideActivity()}},mounted(){this.activity&&this.showActivity()},methods:{disable(){this.$el.disabled=!0,this.$el.classList.add("disabled")},enable(){this.$el.disabled=!1,this.$el.classList.remove("disabled")},hideActivity(){this.$el.classList.add("btn-hide-activity"),r(this.$el,()=>{this.disabled||this.enable(),this.currentActivity=!1,this.$el.classList.remove("btn-activity","btn-hide-activity"),this.$emit("hide-activity")})},showActivity(){this.currentActivity=!0,this.disable(),r(this.$el,()=>{this.$el.classList.add("btn-activity"),this.$emit("show-activity")})},toggle(){this.currentActivity?this.hideActivity():this.showActivity()}}}),m="",v=(t,s)=>{const e=t.__vccOpts||t;for(const[c,a]of s)e[c]=a;return e};function h(t,s,e,c,a,A){const u=i.resolveComponent("ActivityIndicator"),f=i.resolveComponent("Btn");return i.openBlock(),i.createBlock(f,i.mergeProps({active:t.active,block:t.block,disabled:t.disabled,size:t.size,tag:t.tag,variant:t.variant,class:t.classes},Object.assign({},t.$attrs,{onClick:void 0}),{onClick:s[0]||(s[0]=b=>!t.disabled&&t.$emit("click",b,{disable:t.disable,enable:t.enable,toggle:t.toggle,showActivity:t.showActivity,hideActivity:t.hideActivity}))}),{default:i.withCtx(()=>[i.renderSlot(t.$slots,"default",{},()=>[i.createTextVNode(i.toDisplayString(t.label),1)]),i.createVNode(u,i.normalizeProps(i.guardReactiveProps(t.indicatorProps)),null,16)]),_:3},16,["active","block","disabled","size","tag","variant","class"])}const p=v(y,[["render",h]]);n.BtnActivity=p,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});
+(function(n,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("@vue-interface/activity-indicator"),require("@vue-interface/btn"),require("vue")):typeof define=="function"&&define.amd?define(["exports","@vue-interface/activity-indicator","@vue-interface/btn","vue"],a):(n=typeof globalThis<"u"?globalThis:n||self,a(n.BtnActivity={},n.VueInterfaceActivityIndicator,n.VueInterfaceBtn,n.Vue))})(this,function(n,a,d,i){"use strict";const l=function(t){const s=parseFloat(t||0),e=t&&t.match(/m?s/),c=e?e[0]:!1;let o;switch(c){case"s":o=s*1e3;break;case"ms":default:o=s;break}return o||0},r=function(t,s){const e=(t.ownerDocument||document).defaultView;setTimeout(s,l(e==null?void 0:e.getComputedStyle(t).animationDuration))},y=i.defineComponent({components:{ActivityIndicator:a.ActivityIndicator,Btn:d.Btn},inheritAttrs:!1,props:{active:Boolean,activity:Boolean,block:Boolean,disabled:Boolean,indicator:{type:Object,required:!0},label:{type:String,default:void 0},orientation:{type:String,default:"right"},tag:{type:String,default:void 0}},emits:["click","hide-activity","show-activity"],data(){return{currentActivity:this.activity}},computed:{classes(){return{"btn-activity":this.activity,[`btn-activity-${this.orientation.replace("btn-activity-","")}`]:!!this.orientation,[`btn-activity-indicator-${this.indicatorProps.type.replace("btn-activity-indicator-","")}`]:!!this.indicatorProps.type}},indicatorProps(){return Object.assign({type:"spinner"},(typeof this.indicator=="string"?{type:this.indicator}:this.indicator)||{})}},watch:{activity(t){t?this.showActivity():this.hideActivity()}},mounted(){this.activity&&this.showActivity()},methods:{disable(){this.$el.disabled=!0,this.$el.classList.add("disabled")},enable(){this.$el.disabled=!1,this.$el.classList.remove("disabled")},hideActivity(){this.$el.classList.add("btn-hide-activity"),r(this.$el,()=>{this.disabled||this.enable(),this.currentActivity=!1,this.$el.classList.remove("btn-activity","btn-hide-activity"),this.$emit("hide-activity")})},showActivity(){this.currentActivity=!0,this.disable(),r(this.$el,()=>{this.$el.classList.add("btn-activity"),this.$emit("show-activity")})},toggle(){this.currentActivity?this.hideActivity():this.showActivity()}}}),m="",h=(t,s)=>{const e=t.__vccOpts||t;for(const[c,o]of s)e[c]=o;return e};function v(t,s,e,c,o,A){const u=i.resolveComponent("ActivityIndicator"),f=i.resolveComponent("Btn");return i.openBlock(),i.createBlock(f,i.mergeProps({active:t.active,block:t.block,disabled:t.disabled,tag:t.tag,class:t.classes},Object.assign({},t.$attrs,{onClick:void 0}),{onClick:s[0]||(s[0]=b=>!t.disabled&&t.$emit("click",b,{disable:t.disable,enable:t.enable,toggle:t.toggle,showActivity:t.showActivity,hideActivity:t.hideActivity}))}),{default:i.withCtx(()=>[i.renderSlot(t.$slots,"default",{},()=>[i.createTextVNode(i.toDisplayString(t.label),1)]),i.createVNode(u,i.normalizeProps(i.guardReactiveProps(t.indicatorProps)),null,16)]),_:3},16,["active","block","disabled","tag","class"])}const p=h(y,[["render",v]]);n.BtnActivity=p,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});
 //# sourceMappingURL=btn-activity.umd.cjs.map

package/dist/btn-activity.umd.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"btn-activity.umd.cjs","sources":["../src/BtnActivity.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { ActivityIndicator } from '@vue-interface/activity-indicator';\nimport { Btn } from '@vue-interface/btn';\nimport { defineComponent } from 'vue';\n\nconst convertAnimationDelayToInt = function (delay: any) {\n    const num = parseFloat(delay || 0);\n    const matches = delay && delay.match(/m?s/);\n    const unit = matches ? matches[0] : false;\n\n    let milliseconds;\n\n    switch (unit) {\n    case 's': // seconds\n        milliseconds = num * 1000;\n        break;\n    case 'ms':\n    default:\n        milliseconds = num;\n        break;\n    }\n\n    return milliseconds || 0;\n};\n\nconst animated = function (el: HTMLElement, callback: Function) {\n    const defaultView = (el.ownerDocument || document).defaultView;\n\n    setTimeout(\n        callback,\n        convertAnimationDelayToInt(\n            defaultView?.getComputedStyle(el).animationDuration\n        )\n    );\n};\n\nexport default defineComponent({\n\n    components: {\n        ActivityIndicator,\n        Btn,\n    },\n\n    inheritAttrs: false,\n\n    props: {\n        /**\n\t\t * Make the button appear with the active state.\n\t\t */\n        active: Boolean,\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        activity: Boolean,\n\n        /**\n\t\t * Display the button as block width.\n\t\t */\n        block: Boolean,\n\n        /**\n\t\t * Disable the button.\n\t\t */\n        disabled: Boolean,\n\n        /**\n\t\t * The type of activity indicator inside the button.\n\t\t */\n        indicator: {\n            type: [Object, String],\n            default: 'spinner',\n        },\n\n        /**\n\t\t * The button label.\n\t\t */\n        label: {\n            type: String,\n            default: undefined\n        },\n\n        /**\n\t\t * The orientation of the activity button inside the button.\n\t\t */\n        orientation: {\n            type: String,\n            default: 'right',\n        },\n\n        /**\n\t\t * The size of the button.\n\t\t */\n        size: {\n            type: String,\n            default: 'md',\n        },\n\n        /**\n\t\t * The HTML tag.\n\t\t */\n        tag: {\n            type: String,\n            default: undefined\n        },\n\n        /**\n\t\t * The variant of the button.\n\t\t */\n        variant: {\n            type: String,\n            default: 'primary',\n        },\n    },\n\n    emits: ['click', 'hide-activity', 'show-activity'],\n\n    data() {\n        return {\n            currentActivity: this.activity,\n        };\n    },\n\n    computed: {\n        /**\n\t\t * An object of classes to append to the button.\n\t\t */\n        classes() {\n            return {\n                disabled: this.disabled,\n                active: this.active,\n                'btn-activity': this.activity,\n                [`btn-activity-${this.orientation.replace('btn-activity-', '')}`]: !!this.orientation,\n                [`btn-activity-indicator-${this.indicatorProps.type.replace('btn-activity-indicator-', '')}`]: !!this.indicatorProps.type,\n            };\n        },\n\n        indicatorProps() {\n            return Object.assign(\n                {\n                    type: 'spinner',\n                },\n                (typeof this.indicator === 'string'\n                    ? {\n                        type: this.indicator,\n                    }\n                    : this.indicator) || {}\n            );\n        },\n    },\n\n    watch: {\n        activity(value: boolean) {\n            if(value) {\n                this.showActivity();\n            } else {\n                this.hideActivity();\n            }\n        },\n    },\n\n    mounted() {\n        if(this.activity) {\n            this.showActivity();\n        }\n    },\n\n    methods: {\n        /**\n\t\t * Disable the button.\n\t\t */\n        disable(): void {\n            this.$el.disabled = true;\n            this.$el.classList.add('disabled');\n        },\n\n        /**\n\t\t * Enable the button.\n\t\t */\n        enable(): void {\n            this.$el.disabled = false;\n            this.$el.classList.remove('disabled');\n        },\n\n        /**\n\t\t * Hide the activity indicator inside the button.\n\t\t */\n        hideActivity(): void {\n            this.$el.classList.add('btn-hide-activity');\n\n            animated(this.$el, () => {\n                if(!this.disabled) {\n                \tthis.enable();\n                }\n\t\t\t\t\n                this.currentActivity = false;\n                this.$el.classList.remove('btn-activity', 'btn-hide-activity');\n                this.$emit('hide-activity');\n            });\n        },\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        showActivity(): void {\n            this.currentActivity = true;\n            this.disable();\n\n            animated(this.$el, () => {\n                this.$el.classList.add('btn-activity');\n                this.$emit('show-activity');\n            });\n        },\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        toggle(): void {\n            if(!this.currentActivity) {\n                this.showActivity();\n            } else {\n                this.hideActivity();\n            }\n        },\n    },\n});\n</script>\n\n<template>\n    <Btn\n        :active=\"active\"\n        :block=\"block\"\n        :disabled=\"disabled\"\n        :size=\"size\"\n        :tag=\"tag\"\n        :variant=\"variant\"\n        :class=\"classes\"\n        v-bind=\"Object.assign({}, $attrs, { onClick: undefined })\"\n        @click=\"!disabled && $emit('click', $event, {\n            disable,\n            enable,\n            toggle,\n            showActivity,\n            hideActivity,\n        })\">\n        <slot>{{ label }}</slot>\n        <ActivityIndicator v-bind=\"indicatorProps\" />\n    </Btn>\n</template>\n\n<style>\n@keyframes btn-activity-in {\n\n\t0%,\n\t100% {\n\t\ttransform: scale(1);\n\t}\n\n\t30% {\n\t\ttransform: scale(0.98);\n\t}\n}\n\n@keyframes btn-activity-out {\n\n\t0%,\n\t100% {\n\t\ttransform: scale(1);\n\t}\n\n\t70% {\n\t\ttransform: scale(0.98);\n\t}\n}\n\n.btn-activity-top,\n.btn.btn-activity-top,\n.btn-activity-bottom,\n.btn.btn-activity-bottom,\n.btn-activity-left,\n.btn.btn-activity-left,\n.btn-activity-right,\n.btn.btn-activity-right {\n\tdisplay: inline-flex;\n\tposition: relative;\n\ttransition: all calc(333ms / 2) ease-in;\n}\n\n.btn-activity-top .activity-indicator,\n.btn-activity-bottom .activity-indicator,\n.btn-activity-left .activity-indicator,\n.btn-activity-right .activity-indicator {\n\topacity: 0;\n\tposition: absolute;\n\tvisibility: hidden;\n\ttransition: opacity 333ms ease-in;\n}\n\n.btn-activity-top,\n.btn-activity-bottom {\n\tflex-direction: column;\n\talign-items: center;\n}\n\n.btn-activity-top .activity-indicator,\n.btn-activity-bottom .activity-indicator {\n\tmargin-left: auto;\n\tmargin-right: auto;\n}\n\n.btn-activity-top {\n\tflex-direction: column-reverse;\n}\n\n.btn-activity-top .activity-indicator {\n\tpadding-bottom: 1em;\n}\n\n.btn-activity-bottom .activity-indicator {\n\tpadding-top: 1em;\n}\n\n.btn-activity-left,\n.btn-activity-right {\n\talign-items: center;\n\tjustify-content: center;\n}\n\n.btn-activity-left {\n\tflex-direction: row-reverse;\n}\n\n.btn-activity-left .activity-indicator {\n\tpadding-right: 1em;\n}\n\n.btn-activity-right .activity-indicator {\n\tpadding-left: 1em;\n}\n\n.btn-activity:not(.btn-link) {\n\tanimation: btn-activity-in 333ms;\n}\n\n.btn-hide-activity:not(.btn-link) {\n\tanimation: btn-activity-out 333ms;\n}\n\n.btn-activity.btn-hide-activity .activity-indicator {\n\topacity: 0;\n}\n\n.btn-activity .activity-indicator {\n\topacity: 1;\n\tvisibility: visible;\n\tposition: relative;\n\tfont-size: 0.55em;\n}\n</style>\n"],"names":["convertAnimationDelayToInt","delay","num","matches","unit","milliseconds","animated","el","callback","defaultView","_sfc_main","defineComponent","ActivityIndicator","Btn","value","_resolveComponent","_openBlock","_createBlock","_component_Btn","_mergeProps","_ctx","_cache","$event","_withCtx","_createTextVNode","_toDisplayString"],"mappings":"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"}
+{"version":3,"file":"btn-activity.umd.cjs","sources":["../src/BtnActivity.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { ActivityIndicator } from '@vue-interface/activity-indicator';\nimport { Btn } from '@vue-interface/btn';\nimport { defineComponent } from 'vue';\n\nconst convertAnimationDelayToInt = function (delay: any) {\n    const num = parseFloat(delay || 0);\n    const matches = delay && delay.match(/m?s/);\n    const unit = matches ? matches[0] : false;\n\n    let milliseconds;\n\n    switch (unit) {\n    case 's': // seconds\n        milliseconds = num * 1000;\n        break;\n    case 'ms':\n    default:\n        milliseconds = num;\n        break;\n    }\n\n    return milliseconds || 0;\n};\n\nconst animated = function (el: HTMLElement, callback: Function) {\n    const defaultView = (el.ownerDocument || document).defaultView;\n\n    setTimeout(\n        callback,\n        convertAnimationDelayToInt(\n            defaultView?.getComputedStyle(el).animationDuration\n        )\n    );\n};\n\nexport default defineComponent({\n\n    components: {\n        ActivityIndicator,\n        Btn,\n    },\n\n    inheritAttrs: false,\n\n    props: {\n        /**\n\t\t * Make the button appear with the active state.\n\t\t */\n        active: Boolean,\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        activity: Boolean,\n\n        /**\n\t\t * Display the button as block width.\n\t\t */\n        block: Boolean,\n\n        /**\n\t\t * Disable the button.\n\t\t */\n        disabled: Boolean,\n\n        /**\n\t\t * The type of activity indicator inside the button.\n\t\t */\n        indicator: {\n            type: Object,\n            required: true\n        },\n\n        /**\n\t\t * The button label.\n\t\t */\n        label: {\n            type: String,\n            default: undefined\n        },\n\n        /**\n\t\t * The orientation of the activity button inside the button.\n\t\t */\n        orientation: {\n            type: String,\n            default: 'right',\n        },\n\n        /**\n\t\t * The HTML tag.\n\t\t */\n        tag: {\n            type: String,\n            default: undefined\n        },\n    },\n\n    emits: ['click', 'hide-activity', 'show-activity'],\n\n    data() {\n        return {\n            currentActivity: this.activity,\n        };\n    },\n\n    computed: {\n        /**\n\t\t * An object of classes to append to the button.\n\t\t */\n        classes() {\n            return {\n                'btn-activity': this.activity,\n                [`btn-activity-${this.orientation.replace('btn-activity-', '')}`]: !!this.orientation,\n                [`btn-activity-indicator-${this.indicatorProps.type.replace('btn-activity-indicator-', '')}`]: !!this.indicatorProps.type,\n            };\n        },\n\n        indicatorProps() {\n            return Object.assign(\n                {\n                    type: 'spinner',\n                },\n                (typeof this.indicator === 'string'\n                    ? {\n                        type: this.indicator,\n                    }\n                    : this.indicator) || {}\n            );\n        },\n    },\n\n    watch: {\n        activity(value: boolean) {\n            if(value) {\n                this.showActivity();\n            } else {\n                this.hideActivity();\n            }\n        },\n    },\n\n    mounted() {\n        if(this.activity) {\n            this.showActivity();\n        }\n    },\n\n    methods: {\n        /**\n\t\t * Disable the button.\n\t\t */\n        disable(): void {\n            this.$el.disabled = true;\n            this.$el.classList.add('disabled');\n        },\n\n        /**\n\t\t * Enable the button.\n\t\t */\n        enable(): void {\n            this.$el.disabled = false;\n            this.$el.classList.remove('disabled');\n        },\n\n        /**\n\t\t * Hide the activity indicator inside the button.\n\t\t */\n        hideActivity(): void {\n            this.$el.classList.add('btn-hide-activity');\n\n            animated(this.$el, () => {\n                if(!this.disabled) {\n                \tthis.enable();\n                }\n\t\t\t\t\n                this.currentActivity = false;\n                this.$el.classList.remove('btn-activity', 'btn-hide-activity');\n                this.$emit('hide-activity');\n            });\n        },\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        showActivity(): void {\n            this.currentActivity = true;\n            this.disable();\n\n            animated(this.$el, () => {\n                this.$el.classList.add('btn-activity');\n                this.$emit('show-activity');\n            });\n        },\n\n        /**\n\t\t * Show the activity indicator inside the button.\n\t\t */\n        toggle(): void {\n            if(!this.currentActivity) {\n                this.showActivity();\n            } else {\n                this.hideActivity();\n            }\n        },\n    },\n});\n</script>\n\n<template>\n    <Btn\n        :active=\"active\"\n        :block=\"block\"\n        :disabled=\"disabled\"\n        :tag=\"tag\"\n        :class=\"classes\"\n        v-bind=\"Object.assign({}, $attrs, { onClick: undefined })\"\n        @click=\"!disabled && $emit('click', $event, {\n            disable,\n            enable,\n            toggle,\n            showActivity,\n            hideActivity,\n        })\">\n        <slot>{{ label }}</slot>\n        <ActivityIndicator v-bind=\"indicatorProps\" />\n    </Btn>\n</template>\n\n<style>\n@keyframes btn-activity-in {\n\n\t0%,\n\t100% {\n\t\ttransform: scale(1);\n\t}\n\n\t30% {\n\t\ttransform: scale(0.98);\n\t}\n}\n\n@keyframes btn-activity-out {\n\n\t0%,\n\t100% {\n\t\ttransform: scale(1);\n\t}\n\n\t70% {\n\t\ttransform: scale(0.98);\n\t}\n}\n\n.btn-activity-top,\n.btn.btn-activity-top,\n.btn-activity-bottom,\n.btn.btn-activity-bottom,\n.btn-activity-left,\n.btn.btn-activity-left,\n.btn-activity-right,\n.btn.btn-activity-right {\n\tdisplay: inline-flex;\n\tposition: relative;\n\ttransition: all calc(333ms / 2) ease-in;\n}\n\n.btn-activity-top .activity-indicator,\n.btn-activity-bottom .activity-indicator,\n.btn-activity-left .activity-indicator,\n.btn-activity-right .activity-indicator {\n\topacity: 0;\n\tposition: absolute;\n\tvisibility: hidden;\n\ttransition: opacity 333ms ease-in;\n}\n\n.btn-activity-top,\n.btn-activity-bottom {\n\tflex-direction: column;\n\talign-items: center;\n}\n\n.btn-activity-top .activity-indicator,\n.btn-activity-bottom .activity-indicator {\n\tmargin-left: auto;\n\tmargin-right: auto;\n}\n\n.btn-activity-top {\n\tflex-direction: column-reverse;\n}\n\n.btn-activity-top .activity-indicator {\n\tpadding-bottom: 1em;\n}\n\n.btn-activity-bottom .activity-indicator {\n\tpadding-top: 1em;\n}\n\n.btn-activity-left,\n.btn-activity-right {\n\talign-items: center;\n\tjustify-content: center;\n}\n\n.btn-activity-left {\n\tflex-direction: row-reverse;\n}\n\n.btn-activity-left .activity-indicator {\n\tpadding-right: 1em;\n}\n\n.btn-activity-right .activity-indicator {\n\tpadding-left: 1em;\n}\n\n.btn-activity:not(.btn-link) {\n\tanimation: btn-activity-in 333ms;\n}\n\n.btn-hide-activity:not(.btn-link) {\n\tanimation: btn-activity-out 333ms;\n}\n\n.btn-activity.btn-hide-activity .activity-indicator {\n\topacity: 0;\n}\n\n.btn-activity .activity-indicator {\n\topacity: 1;\n\tvisibility: visible;\n\tposition: relative;\n\tfont-size: 0.55em;\n}\n</style>\n"],"names":["convertAnimationDelayToInt","delay","num","matches","unit","milliseconds","animated","el","callback","defaultView","_sfc_main","defineComponent","ActivityIndicator","Btn","value","_resolveComponent","_openBlock","_createBlock","_component_Btn","_mergeProps","_ctx","_cache","$event","_withCtx","_createTextVNode","_toDisplayString"],"mappings":"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"}

package/dist/src/BtnActivity.vue.d.ts

@@ -1,4 +1,4 @@
-declare const _sfc_main: import("vue").DefineComponent<{
+declare const _default: import("vue").DefineComponent<{
     /**
      * Make the button appear with the active state.
      */
@@ -19,15 +19,15 @@ declare const _sfc_main: import("vue").DefineComponent<{
      * The type of activity indicator inside the button.
      */
     indicator: {
-        type: (StringConstructor | ObjectConstructor)[];
-        default: string;
+        type: ObjectConstructor;
+        required: true;
     };
     /**
      * The button label.
      */
     label: {
         type: StringConstructor;
-        default: undefined;
+        default: any;
     };
     /**
      * The orientation of the activity button inside the button.
@@ -36,26 +36,12 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
-    /**
-     * The size of the button.
-     */
-    size: {
-        type: StringConstructor;
-        default: string;
-    };
     /**
      * The HTML tag.
      */
     tag: {
         type: StringConstructor;
-        default: undefined;
-    };
-    /**
-     * The variant of the button.
-     */
-    variant: {
-        type: StringConstructor;
-        default: string;
+        default: any;
     };
 }, unknown, {
     currentActivity: boolean;
@@ -65,8 +51,6 @@ declare const _sfc_main: import("vue").DefineComponent<{
      */
     classes(): {
         [x: string]: any;
-        disabled: any;
-        active: any;
         'btn-activity': any;
     };
     indicatorProps(): any;
@@ -112,15 +96,15 @@ declare const _sfc_main: import("vue").DefineComponent<{
      * The type of activity indicator inside the button.
      */
     indicator: {
-        type: (StringConstructor | ObjectConstructor)[];
-        default: string;
+        type: ObjectConstructor;
+        required: true;
     };
     /**
      * The button label.
      */
     label: {
         type: StringConstructor;
-        default: undefined;
+        default: any;
     };
     /**
      * The orientation of the activity button inside the button.
@@ -129,41 +113,24 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
-    /**
-     * The size of the button.
-     */
-    size: {
-        type: StringConstructor;
-        default: string;
-    };
     /**
      * The HTML tag.
      */
     tag: {
         type: StringConstructor;
-        default: undefined;
-    };
-    /**
-     * The variant of the button.
-     */
-    variant: {
-        type: StringConstructor;
-        default: string;
+        default: any;
     };
 }>> & {
-    onClick?: ((...args: any[]) => any) | undefined;
-    "onHide-activity"?: ((...args: any[]) => any) | undefined;
-    "onShow-activity"?: ((...args: any[]) => any) | undefined;
+    onClick?: (...args: any[]) => any;
+    "onHide-activity"?: (...args: any[]) => any;
+    "onShow-activity"?: (...args: any[]) => any;
 }, {
     label: string;
-    size: string;
     active: boolean;
     block: boolean;
     disabled: boolean;
     tag: string;
-    variant: string;
     activity: boolean;
-    indicator: string | Record<string, any>;
     orientation: string;
-}>;
-export default _sfc_main;
+}, {}>;
+export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue-interface/btn-activity",
-  "version": "2.0.0-beta.14",
+  "version": "2.0.0-beta.16",
   "description": "A Vue activity button component.",
   "type": "module",
   "files": [
@@ -21,7 +21,7 @@
   "browserslist": "last 2 versions, > 0.5%, ie >= 11",
   "scripts": {
     "dev": "vite",
-    "build": "vite build",
+    "build": "vite build && vue-tsc",
     "preview": "vite preview"
   },
   "repository": {
@@ -44,23 +44,31 @@
   "homepage": "https://github.com/vue-interface/btn-activity",
   "dependencies": {
     "@vue-interface/activity-indicator": "^2.0.0-beta.7",
-    "@vue-interface/btn": "^3.0.0-beta.4"
+    "@vue-interface/btn": "^3.0.0-beta.21"
   },
   "peerDependencies": {
-    "vue": "^3.0.0"
+    "vue": "^3.3.4"
   },
   "devDependencies": {
-    "@vitejs/plugin-vue": "^4.0.0",
+    "@commitlint/config-conventional": "^17.7.0",
+    "@semantic-release/changelog": "^6.0.3",
+    "@semantic-release/git": "^10.0.1",
+    "@semantic-release/npm": "^10.0.5",
+    "@vitejs/plugin-vue": "^4.3.2",
     "@vue-interface/eslint-config": "^1.0.0-beta.0",
     "autoprefixer": "^10.4.2",
     "change-case": "^4.1.2",
+    "commitlint": "^17.7.1",
+    "dotenv": "^16.3.1",
     "eslint": "^8.25.0",
+    "husky": "^8.0.3",
     "pascalcase": "^2.0.0",
     "postcss": "^8.4.6",
+    "semantic-release": "^21.0.7",
     "tailwindcss": "^3.0.18",
-    "typescript": "^4.9.5",
-    "vite": "^4.0.0",
-    "vite-plugin-dts": "^1.7.1",
-    "vue": "^3.2.40"
+    "typescript": "^5.2.2",
+    "vite": "^4.4.9",
+    "vue": "^3.3.4",
+    "vue-tsc": "^1.8.8"
   }
 }