@vue-interface/btn-activity 2.0.0-beta.13 → 2.0.0-beta.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/btn-activity.js
CHANGED
|
@@ -0,0 +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":";;;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,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IACb;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,MAAM;AAAA,MACF,MAAM;AAAA,MACN,SAAS;AAAA,IACb;AAAA;AAAA;AAAA;AAAA,IAKA,KAAK;AAAA,MACD,MAAM;AAAA,MACN,SAAS;AAAA,IACb;AAAA;AAAA;AAAA;AAAA,IAKA,SAAS;AAAA,MACL,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,UAAU,KAAK;AAAA,QACf,QAAQ,KAAK;AAAA,QACb,gBAAgB,KAAK;AAAA,QACrB,CAAC,gBAAgB,KAAK,YAAY,QAAQ,iBAAiB,EAAE,GAAG,GAAG,CAAC,CAAC,KAAK;AAAA,QAC1E,CAAC,0BAA0B,KAAK,eAAe,KAAK,QAAQ,2BAA2B,EAAE,GAAG,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,EAkBM,KAAA;SAhBIC,EAAO,GAAAC,EAAAC,GAAAC,EAAA;AAAA,IACZ,QAAQC,EAAE;AAAA,IACV,OAAMA,EAAA;AAAA,IACN,UAAKA,EAAG;AAAA,IACR,MAASA,EAAA;AAAA,IACT,KAAKA,EAAE;AAAA,IAAA,SACOA,EAAM;AAAA,IACpB,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;;;;;;"}
|
|
@@ -1 +1,2 @@
|
|
|
1
1
|
(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"})});
|
|
2
|
+
//# sourceMappingURL=btn-activity.umd.cjs.map
|
|
@@ -0,0 +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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"}
|