ablok-components 0.0.7 → 0.0.8

package/dist/ablok-components.es.js

@@ -1,6 +1,6 @@
-import { defineComponent, resolveComponent, openBlock, createElementBlock, normalizeClass, createVNode, createElementVNode, renderSlot } from "vue";
+import { defineComponent, resolveComponent, openBlock, createElementBlock, normalizeClass, createVNode, createElementVNode, renderSlot, computed, createBlock, createCommentVNode, unref, toDisplayString, ref, watch, withDirectives, vModelText, createTextVNode } from "vue";
 var baseIcon_vue_vue_type_style_index_0_lang = /* @__PURE__ */ (() => ".base-icon{display:inline-block}.base-icon svg{display:block;stroke-width:0;stroke:currentColor;fill:currentColor;width:1.5em;height:1.5em}.base-icon--xxl svg{width:12rem;height:12rem}.base-icon--xl svg{width:8rem;height:8rem}.base-icon--large svg{width:4rem;height:4rem}\n")();
-const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   __name: "base-icon",
   props: {
     id: {
@@ -29,9 +29,9 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   }
 });
 var loadingSpinner_vue_vue_type_style_index_0_lang = /* @__PURE__ */ (() => ".loading-spinner{min-width:2rem}\n")();
-const _hoisted_1$1 = { class: "loading-spinner d-block" };
+const _hoisted_1$2 = { class: "loading-spinner d-block" };
 const _hoisted_2$1 = { class: "loading-spinner__animation" };
-const _hoisted_3 = {
+const _hoisted_3$1 = {
   class: "d-block",
   version: "1.1",
   id: "L9",
@@ -56,7 +56,7 @@ const _hoisted_5 = /* @__PURE__ */ createElementVNode("animateTransform", {
 const _hoisted_6 = [
   _hoisted_5
 ];
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   __name: "loading-spinner",
   props: {
     color: {
@@ -66,9 +66,9 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("span", _hoisted_1$1, [
+      return openBlock(), createElementBlock("span", _hoisted_1$2, [
         createElementVNode("span", _hoisted_2$1, [
-          (openBlock(), createElementBlock("svg", _hoisted_3, [
+          (openBlock(), createElementBlock("svg", _hoisted_3$1, [
             createElementVNode("path", {
               fill: __props.color,
               d: "M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50"
@@ -80,30 +80,147 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var baseButton_vue_vue_type_style_index_0_lang = /* @__PURE__ */ (() => ".btn{appearance:none;background:none;border:none}\n")();
-const _hoisted_1 = { class: "btn" };
-const _hoisted_2 = ["innerHTML"];
-const _sfc_main = /* @__PURE__ */ defineComponent({
+var baseButton_vue_vue_type_style_index_0_lang = /* @__PURE__ */ (() => ".base-button{display:flex;justify-content:center;align-items:center;box-sizing:border-box;transition:all .2s ease;text-decoration:none;width:100%;margin:0;padding:1.036em 1.625em;appearance:none;outline:none;border:none;border-radius:.4375em;font-size:.875em;line-height:1.125em;text-transform:uppercase;font-weight:700}@media screen and (min-width: 600px){.base-button{width:auto}}.base-button .icon{width:16px;height:16px;margin-top:-1px}.base-button.s-collapsed>.caption{display:none}.base-button.s-pending{background-repeat:no-repeat;background-position:center center}.base-button.s-pending .caption{margin-left:25px;visibility:hidden}@media screen and (min-width: 600px){.base-button.s-pending{background-position:1.625em center}.base-button.s-pending .caption{visibility:visible}}.base-button[readonly],.base-button[disabled]{cursor:not-allowed}\n")();
+const _hoisted_1$1 = ["type", "disabled", "href", "to"];
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   __name: "base-button",
   props: {
-    caption: {
+    type: null,
+    caption: null,
+    variant: null,
+    size: null,
+    icon: null,
+    href: null,
+    to: null,
+    disabled: { type: Boolean },
+    pending: { type: Boolean },
+    outlined: { type: Boolean },
+    rounded: { type: Boolean },
+    fab: { type: Boolean }
+  },
+  setup(__props) {
+    const props = __props;
+    const showCaption = computed(() => {
+      return props.caption && !props.fab;
+    });
+    return (_ctx, _cache) => {
+      const _component_base_icon = resolveComponent("base-icon");
+      return openBlock(), createElementBlock("button", {
+        type: __props.type,
+        disabled: __props.disabled,
+        href: __props.href,
+        to: __props.to,
+        class: normalizeClass({
+          disabled: __props.disabled,
+          pending: __props.pending,
+          rounded: __props.rounded,
+          outlined: __props.outlined,
+          fab: __props.fab,
+          "x-large": __props.size === "x-large",
+          "large": __props.size === "large",
+          "small": __props.size === "small",
+          "x-small": __props.size === "x-small"
+        })
+      }, [
+        renderSlot(_ctx.$slots, "default", {}, () => [
+          __props.icon ? (openBlock(), createBlock(_component_base_icon, {
+            key: 0,
+            id: __props.icon,
+            class: "base-button__caption"
+          }, null, 8, ["id"])) : createCommentVNode("", true),
+          unref(showCaption) ? (openBlock(), createElementBlock("span", {
+            key: 1,
+            class: normalizeClass(["base-button__caption", { "icon-padding": __props.icon }])
+          }, toDisplayString(__props.caption), 3)) : createCommentVNode("", true)
+        ])
+      ], 10, _hoisted_1$1);
+    };
+  }
+});
+function uniqueId() {
+  return (new Date().valueOf() + Math.random()).toString(36);
+}
+const _hoisted_1 = { class: "base-input" };
+const _hoisted_2 = ["name", "id", "label", "placeholder", "pattern", "disabled", "read-only", "required", "maxlength"];
+const _hoisted_3 = ["for"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "base-input",
+  props: {
+    modelValue: {
       type: String,
-      default: "Base Button"
+      default: ""
     },
-    size: {
+    name: {
       type: String,
-      default: "default"
+      default: () => uniqueId()
+    },
+    id: {
+      type: String,
+      default: () => uniqueId()
+    },
+    label: {
+      type: String,
+      default: ""
+    },
+    placeholder: {
+      type: String,
+      default: ""
+    },
+    variant: {
+      type: String,
+      default: ""
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    readOnly: {
+      type: Boolean,
+      default: false
+    },
+    required: {
+      type: Boolean,
+      default: false
+    },
+    maxlength: {
+      type: Number
+    },
+    pattern: {
+      type: String,
+      default: null
     }
   },
-  setup(__props) {
+  emits: ["update:modelValue"],
+  setup(__props, { emit }) {
+    const value = ref();
+    watch(value, async (update, before) => {
+      if (update !== before) {
+        emit("update:modelValue", update);
+      }
+    });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("button", _hoisted_1, [
-        createElementVNode("span", {
-          class: "caption",
-          innerHTML: __props.caption
-        }, null, 8, _hoisted_2)
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        withDirectives(createElementVNode("input", {
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => value.value = $event),
+          name: __props.name,
+          id: __props.id,
+          label: `${__props.label}${__props.required ? " *" : ""}`,
+          placeholder: __props.placeholder,
+          pattern: __props.pattern,
+          disabled: __props.disabled,
+          "read-only": __props.readOnly,
+          required: __props.required,
+          maxlength: __props.maxlength
+        }, null, 8, _hoisted_2), [
+          [vModelText, value.value]
+        ]),
+        createElementVNode("label", { for: __props.id }, [
+          renderSlot(_ctx.$slots, "label", {}, () => [
+            createTextVNode(toDisplayString(__props.label), 1)
+          ])
+        ], 8, _hoisted_3)
       ]);
     };
   }
 });
-export { _sfc_main as BaseButton, _sfc_main$2 as BaseIcon, _sfc_main$1 as LoadingSpinner };
+export { _sfc_main$1 as BaseButton, _sfc_main$3 as BaseIcon, _sfc_main as BaseInput, _sfc_main$2 as LoadingSpinner };

package/dist/ablok-components.umd.js

@@ -1,4 +1,4 @@
-(function(n,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis!="undefined"?globalThis:n||self,e(n.AblokComponents={},n.Vue))})(this,function(n,e){"use strict";var g=(()=>`.base-icon{display:inline-block}.base-icon svg{display:block;stroke-width:0;stroke:currentColor;fill:currentColor;width:1.5em;height:1.5em}.base-icon--xxl svg{width:12rem;height:12rem}.base-icon--xl svg{width:8rem;height:8rem}.base-icon--large svg{width:4rem;height:4rem}
-`)();const s=e.defineComponent({__name:"base-icon",props:{id:{type:String,default:""},size:{type:String,default:"default"}},setup(t){return(o,i)=>{const f=e.resolveComponent("SvgSprite");return e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(["base-icon",{[`base-icon--${t.size}`]:t.size}])},[e.createVNode(f,{symbol:`icon-${t.id}`,role:"presentation"},null,8,["symbol"])],2)}}});var h=(()=>`.loading-spinner{min-width:2rem}
-`)();const a={class:"loading-spinner d-block"},r={class:"loading-spinner__animation"},l={class:"d-block",version:"1.1",id:"L9",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 100 100","enable-background":"new 0 0 0 0","xml:space":"preserve"},c=["fill"],d=[e.createElementVNode("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"1s",from:"0 50 50",to:"360 50 50",repeatCount:"indefinite"},null,-1)],p=e.defineComponent({__name:"loading-spinner",props:{color:{type:String,default:"#fff"}},setup(t){return(o,i)=>(e.openBlock(),e.createElementBlock("span",a,[e.createElementVNode("span",r,[(e.openBlock(),e.createElementBlock("svg",l,[e.createElementVNode("path",{fill:t.color,d:"M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50"},d,8,c)]))]),e.renderSlot(o.$slots,"default")]))}});var y=(()=>`.btn{appearance:none;background:none;border:none}
-`)();const _={class:"btn"},m=["innerHTML"],u=e.defineComponent({__name:"base-button",props:{caption:{type:String,default:"Base Button"},size:{type:String,default:"default"}},setup(t){return(o,i)=>(e.openBlock(),e.createElementBlock("button",_,[e.createElementVNode("span",{class:"caption",innerHTML:t.caption},null,8,m)]))}});n.BaseButton=u,n.BaseIcon=s,n.LoadingSpinner=p,Object.defineProperties(n,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(t,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(t=typeof globalThis!="undefined"?globalThis:t||self,e(t.AblokComponents={},t.Vue))})(this,function(t,e){"use strict";var w=(()=>`.base-icon{display:inline-block}.base-icon svg{display:block;stroke-width:0;stroke:currentColor;fill:currentColor;width:1.5em;height:1.5em}.base-icon--xxl svg{width:12rem;height:12rem}.base-icon--xl svg{width:8rem;height:8rem}.base-icon--large svg{width:4rem;height:4rem}
+`)();const r=e.defineComponent({__name:"base-icon",props:{id:{type:String,default:""},size:{type:String,default:"default"}},setup(n){return(o,l)=>{const a=e.resolveComponent("SvgSprite");return e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(["base-icon",{[`base-icon--${n.size}`]:n.size}])},[e.createVNode(a,{symbol:`icon-${n.id}`,role:"presentation"},null,8,["symbol"])],2)}}});var S=(()=>`.loading-spinner{min-width:2rem}
+`)();const c={class:"loading-spinner d-block"},m={class:"loading-spinner__animation"},b={class:"d-block",version:"1.1",id:"L9",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 100 100","enable-background":"new 0 0 0 0","xml:space":"preserve"},u=["fill"],p=[e.createElementVNode("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"1s",from:"0 50 50",to:"360 50 50",repeatCount:"indefinite"},null,-1)],f=e.defineComponent({__name:"loading-spinner",props:{color:{type:String,default:"#fff"}},setup(n){return(o,l)=>(e.openBlock(),e.createElementBlock("span",c,[e.createElementVNode("span",m,[(e.openBlock(),e.createElementBlock("svg",b,[e.createElementVNode("path",{fill:n.color,d:"M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50"},p,8,u)]))]),e.renderSlot(o.$slots,"default")]))}});var _=(()=>`.base-button{display:flex;justify-content:center;align-items:center;box-sizing:border-box;transition:all .2s ease;text-decoration:none;width:100%;margin:0;padding:1.036em 1.625em;appearance:none;outline:none;border:none;border-radius:.4375em;font-size:.875em;line-height:1.125em;text-transform:uppercase;font-weight:700}@media screen and (min-width: 600px){.base-button{width:auto}}.base-button .icon{width:16px;height:16px;margin-top:-1px}.base-button.s-collapsed>.caption{display:none}.base-button.s-pending{background-repeat:no-repeat;background-position:center center}.base-button.s-pending .caption{margin-left:25px;visibility:hidden}@media screen and (min-width: 600px){.base-button.s-pending{background-position:1.625em center}.base-button.s-pending .caption{visibility:visible}}.base-button[readonly],.base-button[disabled]{cursor:not-allowed}
+`)();const g=["type","disabled","href","to"],h=e.defineComponent({__name:"base-button",props:{type:null,caption:null,variant:null,size:null,icon:null,href:null,to:null,disabled:{type:Boolean},pending:{type:Boolean},outlined:{type:Boolean},rounded:{type:Boolean},fab:{type:Boolean}},setup(n){const o=n,l=e.computed(()=>o.caption&&!o.fab);return(a,i)=>{const d=e.resolveComponent("base-icon");return e.openBlock(),e.createElementBlock("button",{type:n.type,disabled:n.disabled,href:n.href,to:n.to,class:e.normalizeClass({disabled:n.disabled,pending:n.pending,rounded:n.rounded,outlined:n.outlined,fab:n.fab,"x-large":n.size==="x-large",large:n.size==="large",small:n.size==="small","x-small":n.size==="x-small"})},[e.renderSlot(a.$slots,"default",{},()=>[n.icon?(e.openBlock(),e.createBlock(d,{key:0,id:n.icon,class:"base-button__caption"},null,8,["id"])):e.createCommentVNode("",!0),e.unref(l)?(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(["base-button__caption",{"icon-padding":n.icon}])},e.toDisplayString(n.caption),3)):e.createCommentVNode("",!0)])],10,g)}}});function s(){return(new Date().valueOf()+Math.random()).toString(36)}const y={class:"base-input"},x=["name","id","label","placeholder","pattern","disabled","read-only","required","maxlength"],k=["for"],B=e.defineComponent({__name:"base-input",props:{modelValue:{type:String,default:""},name:{type:String,default:()=>s()},id:{type:String,default:()=>s()},label:{type:String,default:""},placeholder:{type:String,default:""},variant:{type:String,default:""},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},required:{type:Boolean,default:!1},maxlength:{type:Number},pattern:{type:String,default:null}},emits:["update:modelValue"],setup(n,{emit:o}){const l=e.ref();return e.watch(l,async(a,i)=>{a!==i&&o("update:modelValue",a)}),(a,i)=>(e.openBlock(),e.createElementBlock("div",y,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":i[0]||(i[0]=d=>l.value=d),name:n.name,id:n.id,label:`${n.label}${n.required?" *":""}`,placeholder:n.placeholder,pattern:n.pattern,disabled:n.disabled,"read-only":n.readOnly,required:n.required,maxlength:n.maxlength},null,8,x),[[e.vModelText,l.value]]),e.createElementVNode("label",{for:n.id},[e.renderSlot(a.$slots,"label",{},()=>[e.createTextVNode(e.toDisplayString(n.label),1)])],8,k)]))}});t.BaseButton=h,t.BaseIcon=r,t.BaseInput=B,t.LoadingSpinner=f,Object.defineProperties(t,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/dist/components/base-button.vue.d.ts

@@ -1,23 +1,37 @@
-declare const _default: import("vue").DefineComponent<{
-    caption: {
-        type: StringConstructor;
-        default: string;
-    };
-    size: {
-        type: StringConstructor;
-        default: string;
-    };
-}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    caption: {
-        type: StringConstructor;
-        default: string;
-    };
-    size: {
-        type: StringConstructor;
-        default: string;
-    };
-}>>, {
-    caption: string;
-    size: string;
-}>;
+declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
+    type?: "button" | "submit" | "reset" | undefined;
+    caption?: string | undefined;
+    variant?: string | undefined;
+    size?: string | undefined;
+    icon?: string | undefined;
+    href?: string | undefined;
+    to?: any;
+    disabled?: boolean | undefined;
+    pending?: boolean | undefined;
+    outlined?: boolean | undefined;
+    rounded?: boolean | undefined;
+    fab?: boolean | undefined;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
+    type?: "button" | "submit" | "reset" | undefined;
+    caption?: string | undefined;
+    variant?: string | undefined;
+    size?: string | undefined;
+    icon?: string | undefined;
+    href?: string | undefined;
+    to?: any;
+    disabled?: boolean | undefined;
+    pending?: boolean | undefined;
+    outlined?: boolean | undefined;
+    rounded?: boolean | undefined;
+    fab?: boolean | undefined;
+}>>>, {}>;
 export default _default;
+declare type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+declare type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/dist/components/base-input.vue.d.ts

@@ -0,0 +1,103 @@
+declare const _default: import("vue").DefineComponent<{
+    modelValue: {
+        type: StringConstructor;
+        default: string;
+    };
+    name: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    id: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    variant: {
+        type: StringConstructor;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    readOnly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maxlength: {
+        type: NumberConstructor;
+    };
+    pattern: {
+        type: StringConstructor;
+        default: null;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: StringConstructor;
+        default: string;
+    };
+    name: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    id: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    variant: {
+        type: StringConstructor;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    readOnly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maxlength: {
+        type: NumberConstructor;
+    };
+    pattern: {
+        type: StringConstructor;
+        default: null;
+    };
+}>> & {
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}, {
+    required: boolean;
+    label: string;
+    pattern: string;
+    id: string;
+    modelValue: string;
+    variant: string;
+    disabled: boolean;
+    name: string;
+    placeholder: string;
+    readOnly: boolean;
+}>;
+export default _default;

package/dist/components/helpers.d.ts

@@ -0,0 +1 @@
+export declare function uniqueId(): string;

package/dist/index.d.ts

@@ -1,3 +1,4 @@
 export { default as BaseIcon } from "./components/base-icon.vue";
 export { default as LoadingSpinner } from "./components/loading-spinner.vue";
 export { default as BaseButton } from "./components/base-button.vue";
+export { default as BaseInput } from "./components/base-input.vue";

package/dist/style.css

@@ -1 +1 @@
-.base-icon{display:inline-block}.base-icon svg{display:block;stroke-width:0;stroke:currentColor;fill:currentColor;width:1.5em;height:1.5em}.base-icon--xxl svg{width:12rem;height:12rem}.base-icon--xl svg{width:8rem;height:8rem}.base-icon--large svg{width:4rem;height:4rem}.loading-spinner{min-width:2rem}.btn{appearance:none;background:none;border:none}
+.base-icon{display:inline-block}.base-icon svg{display:block;stroke-width:0;stroke:currentColor;fill:currentColor;width:1.5em;height:1.5em}.base-icon--xxl svg{width:12rem;height:12rem}.base-icon--xl svg{width:8rem;height:8rem}.base-icon--large svg{width:4rem;height:4rem}.loading-spinner{min-width:2rem}.base-button{display:flex;justify-content:center;align-items:center;box-sizing:border-box;transition:all .2s ease;text-decoration:none;width:100%;margin:0;padding:1.036em 1.625em;appearance:none;outline:none;border:none;border-radius:.4375em;font-size:.875em;line-height:1.125em;text-transform:uppercase;font-weight:700}@media screen and (min-width: 600px){.base-button{width:auto}}.base-button .icon{width:16px;height:16px;margin-top:-1px}.base-button.s-collapsed>.caption{display:none}.base-button.s-pending{background-repeat:no-repeat;background-position:center center}.base-button.s-pending .caption{margin-left:25px;visibility:hidden}@media screen and (min-width: 600px){.base-button.s-pending{background-position:1.625em center}.base-button.s-pending .caption{visibility:visible}}.base-button[readonly],.base-button[disabled]{cursor:not-allowed}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ablok-components",
   "private": false,
-  "version": "0.0.7",
+  "version": "0.0.8",
   "scripts": {
     "dev": "vite",
     "build": "vue-tsc --noEmit && vite build",