@volverjs/ui-vue 0.0.1-beta.12 → 0.0.1-beta.16

package/dist/components/VvButton/VvButton.umd.js

@@ -1 +1 @@
-(function(n,S){typeof exports=="object"&&typeof module<"u"?module.exports=S(require("vue"),require("uuid"),require("@iconify/vue")):typeof define=="function"&&define.amd?define(["vue","uuid","@iconify/vue"],S):(n=typeof globalThis<"u"?globalThis:n||self,n.VvButton=S(n.vue,n.uuid,n.vue$1))})(this,function(n,S,k){"use strict";const w={disabled:Boolean},$={modifiers:[String,Array]};var y=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(y||{}),h=(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(h||{}),A=(e=>(e._blank="_blank",e._self="_self",e._parent="_parent",e._top="_top",e))(A||{});const j={...$,...w,icon:String,iconPosition:{type:String,default:"left",validator:e=>e in y},label:String,loading:Boolean,loadingIcon:{type:String,default:"eos-icons:bubble-loading"},loadingLabel:{type:String,default:"Loading..."},to:{type:[String,Object]},href:String,target:{type:String,validator:e=>e in A},active:Boolean,selected:Boolean},p={equals(e,t,r){return r?this.resolveFieldData(e,r)===this.resolveFieldData(t,r):this.deepEquals(e,t)},deepEquals(e,t){if(e===t)return!0;if(e&&t&&typeof e=="object"&&typeof t=="object"){const r=Array.isArray(e),s=Array.isArray(t);let o,c,l;if(r&&s){if(c=e.length,c!=t.length)return!1;for(o=c;o--!==0;)if(!this.deepEquals(e[o],t[o]))return!1;return!0}if(r!=s)return!1;const a=e instanceof Date,u=t instanceof Date;if(a!=u)return!1;if(a&&u)return e.getTime()==t.getTime();const d=e instanceof RegExp,i=t instanceof RegExp;if(d!=i)return!1;if(d&&i)return e.toString()==t.toString();const f=Object.keys(e);if(c=f.length,c!==Object.keys(t).length)return!1;for(o=c;o--!==0;)if(!Object.prototype.hasOwnProperty.call(t,f[o]))return!1;for(o=c;o--!==0;)if(l=f[o],!this.deepEquals(e[l],t[l]))return!1;return!0}return e!==e&&t!==t},resolveFieldData(e,t){if(e&&Object.keys(e).length&&t){if(t.indexOf(".")===-1)return e[t];{const r=t.split(".");let s=e;for(let o=0,c=r.length;o<c;++o){if(e==null)return null;s=s[r[o]]}return s}}else return null},isFunction(e){return!!(e&&e.constructor&&e.call&&e.apply)},findIndexInList(e,t){let r=-1;if(t){for(let s=0;s<t.length;s++)if(this.equals(t[s],e)){r=s;break}}return r},contains(e,t){if(e!=null&&t&&t.length){for(const r of t)if(this.equals(e,r))return!0}return!1},isEmpty(e){return e==null||e===""||Array.isArray(e)&&e.length===0||!(e instanceof Date)&&typeof e=="object"&&Object.keys(e).length===0},isNotEmpty(e){return!this.isEmpty(e)},pickBy(e,t){return Object.fromEntries(Object.entries(e).filter(([r])=>t(r)))},removeFromList(e,t){const r=this.findIndexInList(e,t);return r>-1?t.filter((s,o)=>o!==r):t},isString(e){return typeof e=="string"||e instanceof String},propsToObject(e){return Object.keys(e).reduce((t,r)=>{var s,o,c,l,a;return this.isFunction(e[r])?t[r]=e[r]():Array.isArray(e[r])?t[r]=e[r][0]():(s=e[r])!=null&&s.type&&(Array.isArray(e[r].type)?t[r]=((o=e[r])==null?void 0:o.default)||((c=e[r])==null?void 0:c.type[0]()):t[r]=((l=e[r])==null?void 0:l.default)||((a=e[r])==null?void 0:a.type())),t},{})},filterArray(e,t,r){return e.filter(s=>t.some(o=>typeof o=="string"?s[r]==o:this.equals(s[r],o[r])))},kebabCase(e){var t,r;if(e)return(r=(t=e.match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g))==null?void 0:t.join("-"))==null?void 0:r.toLowerCase()}},L="ds",V={color:String,width:{type:[String,Number]},height:{type:[String,Number]},name:{type:String,required:!0},provider:{type:String},prefix:{type:String,default:"normal"},src:String,horizontalFlip:Boolean,verticalFlip:Boolean,flip:String,mode:String,inline:Boolean,rotate:[Number,String],onLoad:Function,svg:String,modifiers:{type:[String,Array]}};function B(e,t){const r={[`${e}`]:!0};return{bemCssClasses:n.computed(()=>Object.keys(t).reduce((o,c)=>{const l=n.unref(t[c])||!1;if(!l)return o;if(c==="modifiers"){const a=Array.isArray(l)?l:[l];return{...o,...a.reduce((u,d)=>({...u,[`${e}--${p.kebabCase(d)}`]:!0}),{})}}else return{...o,[`${e}--${p.kebabCase(c)}`]:l}},r)||{})}}const O=n.defineComponent({__name:"VvIcon",props:V,setup(e){const t=e,r=n.ref(!0),{modifiers:s}=n.toRefs(t),o=n.inject(L),{bemCssClasses:c}=B("vv-icon",{modifiers:s}),l=n.computed(()=>t.provider||(o==null?void 0:o.provider)),a=n.computed(()=>{const i=t.name||"",f=`@${l.value}:${t.prefix}:${t.name}`;return k.iconExists(i)?i:k.iconExists(f)?f:(o==null?void 0:o.iconsCollections.find(g=>{const b=`@${l.value}:${g.prefix}:${i}`;if(k.iconExists(b))return b}))||i});function u(i){let f=null;if(typeof window>"u"){const{JSDOM:_}=require("jsdom");f=new _().window}return(f?new f.DOMParser:new window.DOMParser).parseFromString(i,"text/html").querySelector("svg")}function d(i){const f=u(i),g=(f==null?void 0:f.innerHTML.trim())||"";f&&g&&k.addIcon(`@${l.value}:${t.prefix}:${t.name}`,{body:g,height:f.viewBox.baseVal.height,width:f.viewBox.baseVal.width})}return o&&(t.src?(r.value=!1,o.fetchIcon(t.src).then(i=>{i&&(d(i),r.value=!0)}).catch(i=>{throw new Error(`During fetch icon: ${i==null?void 0:i.message}`)})):t.svg&&d(t.svg)),(i,f)=>r.value?(n.openBlock(),n.createBlock(n.unref(k.Icon),n.mergeProps({key:0,class:n.unref(c)},{...i.$props,provider:n.unref(l),icon:n.unref(a)}),null,16,["class"])):n.createCommentVNode("",!0)}});function q(e){const t=n.inject(e,void 0),r=n.computed(()=>p.isNotEmpty(t));function s(o,c,l){if(t!=null&&t.value){const a=n.unref(t.value)[o];return n.computed({get(){return a==null?void 0:a.value},set(u){a.value=u}})}else{const a=n.toRef(c,o);return n.computed({get(){return a.value},set(u){l&&l(`update:${o}`,u)}})}}return{group:t,isInGroup:r,getGroupOrLocalRef:s}}const D=Symbol("VV_BUTTON_GROUP");function P(e){const{group:t,isInGroup:r,getGroupOrLocalRef:s}=q(D),{iconPosition:o,icon:c,label:l,selected:a}=n.toRefs(e),u=s("modelValue",e),d=s("disabled",e),i=s("toggle",e),f=s("modifiers",e);return{modelValue:u,disabled:d,toggle:i,isInGroup:r,group:t,modifiers:f,selected:a,iconPosition:o,icon:c,label:l}}const I={key:1,class:"vv-button__label"},R={key:1,class:"vv-button__label"};return n.defineComponent({__name:"VvButton",props:j,setup(e){const t=e,r=n.useAttrs(),s=n.useSlots(),o=(r==null?void 0:r.name)||S.v4(),{modifiers:c,iconPosition:l,icon:a,label:u,modelValue:d,disabled:i,toggle:f,isInGroup:g}=P(t),b=n.computed(()=>{switch(!0){case i.value:return h.button;case t.to!==void 0:return h.routerLink;case t.href!==void 0:return h.a;default:return h.button}}),E=n.computed(()=>f.value?Array.isArray(d.value)?p.contains(o,d.value):p.equals(o,d.value):t.active),_=n.computed(()=>f.value?Array.isArray(d.value)?p.contains(o,d.value):p.equals(o,d.value):t.selected),{bemCssClasses:x}=B("vv-button",{modifiers:c,active:E,selected:_,disabled:i,reverse:n.computed(()=>[y.right,y.bottom].includes(l.value)),column:n.computed(()=>[y.top,y.bottom].includes(l.value)),iconOnly:n.computed(()=>(a==null?void 0:a.value)&&!(u!=null&&u.value)&&!s.default)}),F=n.computed(()=>({...N.value,"aria-label":t.label||r["aria-label"],"aria-disabled":i.value,role:"button",class:x.value,to:t.to})),N=n.computed(()=>{const m=b.value===h.a;let C={};return m&&(C=i.value?{href:"javascript:;"}:{target:t.target,href:t.href}),C});function G(){g.value&&(d.value=o)}return(m,C)=>(n.openBlock(),n.createBlock(n.resolveDynamicComponent(n.unref(b)),n.mergeProps(n.unref(F),{onClickPassive:G}),{default:n.withCtx(()=>[n.renderSlot(m.$slots,"default",{},()=>[m.loading?n.renderSlot(m.$slots,"loading",{key:0},()=>[m.loadingIcon?(n.openBlock(),n.createBlock(O,{key:0,class:"vv-button__loading-icon",name:m.loadingIcon},null,8,["name"])):n.createCommentVNode("",!0),m.loadingLabel?(n.openBlock(),n.createElementBlock("span",I,n.toDisplayString(m.loadingLabel),1)):n.createCommentVNode("",!0)]):(n.openBlock(),n.createElementBlock(n.Fragment,{key:1},[n.renderSlot(m.$slots,"before"),n.unref(a)?(n.openBlock(),n.createBlock(O,{key:0,class:"vv-button__icon",name:n.unref(a)},null,8,["name"])):n.createCommentVNode("",!0),n.unref(u)?(n.openBlock(),n.createElementBlock("span",R,[n.renderSlot(m.$slots,"label",{},()=>[n.createTextVNode(n.toDisplayString(n.unref(u)),1)])])):n.createCommentVNode("",!0),n.renderSlot(m.$slots,"after")],64))])]),_:3},16))}})});
+(function(e,k){typeof exports=="object"&&typeof module<"u"?module.exports=k(require("vue"),require("nanoid"),require("@iconify/vue")):typeof define=="function"&&define.amd?define(["vue","nanoid","@iconify/vue"],k):(e=typeof globalThis<"u"?globalThis:e||self,e.VvButton=k(e.vue,e.nanoid,e.vue$1))})(this,function(e,k,b){"use strict";function $(n,t,o){return o?w(n,o)===w(t,o):_(n,t)}function _(n,t){if(n===t)return!0;if(n&&t&&typeof n=="object"&&typeof t=="object"){const o=Array.isArray(n),f=Array.isArray(t);let r,c,l;if(o&&f){if(c=n.length,c!=t.length)return!1;for(r=c;r--!==0;)if(!_(n[r],t[r]))return!1;return!0}if(o!=f)return!1;const i=n instanceof Date,u=t instanceof Date;if(i!=u)return!1;if(i&&u)return n.getTime()==t.getTime();const d=n instanceof RegExp,s=t instanceof RegExp;if(d!=s)return!1;if(d&&s)return n.toString()==t.toString();const a=Object.keys(n);if(c=a.length,c!==Object.keys(t).length)return!1;for(r=c;r--!==0;)if(!Object.prototype.hasOwnProperty.call(t,a[r]))return!1;for(r=c;r--!==0;)if(l=a[r],!_(n[l],t[l]))return!1;return!0}return n!==n&&t!==t}function w(n,t){if(n&&Object.keys(n).length&&t){if(t.indexOf(".")===-1)return n[t];{const o=t.split(".");let f=n;for(let r=0,c=o.length;r<c;++r){if(n==null)return null;f=f[o[r]]}return f}}else return null}function L(n,t){if(n!=null&&t&&t.length){for(const o of t)if($(n,o))return!0}return!1}function x(n){return(t=>t==null||t===""||Array.isArray(t)&&t.length===0||!(t instanceof Date)&&typeof t=="object"&&Object.keys(t).length===0)(e.unref(n))}function B(n){var t,o;if(n)return(o=(t=n.match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g))==null?void 0:t.join("-"))==null?void 0:o.toLowerCase()}const O="ds";function V(n,t){const o={[`${n}`]:!0};return{bemCssClasses:e.computed(()=>Object.keys(t).reduce((r,c)=>{const l=e.unref(t[c])||!1;if(!l)return r;if(c==="modifiers"){const i=Array.isArray(l)?l:l.split(" ");return{...r,...i.reduce((u,d)=>({...u,[`${n}--${B(d)}`]:!0}),{})}}else return{...r,[`${n}--${B(c)}`]:l}},o)||{})}}const E={color:String,width:{type:[String,Number]},height:{type:[String,Number]},name:{type:String,required:!0},provider:{type:String},prefix:{type:String,default:"normal"},src:String,horizontalFlip:Boolean,verticalFlip:Boolean,flip:String,mode:String,inline:Boolean,rotate:[Number,String],onLoad:Function,svg:String,modifiers:{type:[String,Array]}},D={name:"VvIcon"},A=e.defineComponent({...D,props:E,setup(n){const t=n,o=e.ref(!0),{modifiers:f}=e.toRefs(t),r=e.inject(O),{bemCssClasses:c}=V("vv-icon",{modifiers:f}),l=e.computed(()=>t.provider||(r==null?void 0:r.provider)),i=e.computed(()=>{const s=t.name||"",a=`@${l.value}:${t.prefix}:${t.name}`;return b.iconExists(s)?s:b.iconExists(a)?a:(r==null?void 0:r.iconsCollections.find(g=>{const y=`@${l.value}:${g.prefix}:${s}`;if(b.iconExists(y))return y}))||s});function u(s){let a=null;if(typeof window>"u"){const{JSDOM:S}=require("jsdom");a=new S().window}return(a?new a.DOMParser:new window.DOMParser).parseFromString(s,"text/html").querySelector("svg")}function d(s){const a=u(s),g=(a==null?void 0:a.innerHTML.trim())||"";a&&g&&b.addIcon(`@${l.value}:${t.prefix}:${t.name}`,{body:g,height:a.viewBox.baseVal.height,width:a.viewBox.baseVal.width})}return r&&(t.src&&!b.iconExists(`@${l.value}:${t.prefix}:${t.name}`)?(o.value=!1,r.fetchIcon(t.src).then(s=>{s&&(d(s),o.value=!0)}).catch(s=>{throw new Error(`During fetch icon: ${s==null?void 0:s.message}`)})):t.svg&&d(t.svg)),(s,a)=>o.value?(e.openBlock(),e.createBlock(e.unref(b.Icon),e.mergeProps({key:0,class:e.unref(c)},{...s.$props,provider:e.unref(l),icon:e.unref(i)}),null,16,["class"])):e.createCommentVNode("",!0)}}),R={disabled:Boolean},I={modifiers:[String,Array]};function N(n){const t=e.inject(n,void 0),o=e.computed(()=>!x(t));function f(r,c,l){if(t!=null&&t.value){const u=e.unref(t.value)[r];return e.computed({get(){return u==null?void 0:u.value},set(d){u.value=d}})}const i=e.toRef(c,r);return e.computed({get(){return i.value},set(u){l&&l(`update:${r}`,u)}})}return{group:t,isInGroup:o,getGroupOrLocalRef:f}}const G="VV_BUTTON_GROUP";var h=(n=>(n.left="left",n.right="right",n.top="top",n.bottom="bottom",n))(h||{}),P=(n=>(n.button="button",n.submit="submit",n.reset="reset",n))(P||{}),m=(n=>(n.nuxtLink="nuxt-link",n.routerLink="router-link",n.a="a",n.button="button",n))(m||{}),j=(n=>(n._blank="_blank",n._self="_self",n._parent="_parent",n._top="_top",n))(j||{});const q={...I,...R,icon:{type:[String,Object],default:""},iconPosition:{type:String,default:"left",validator:n=>n in h},label:[String,Number],loading:Boolean,loadingIcon:{type:String,default:"eos-icons:bubble-loading"},loadingLabel:{type:String,default:"Loading..."},to:{type:[String,Object]},href:String,target:{type:String,validator:n=>n in j},active:Boolean,pressed:Boolean,rel:{type:String,default:"noopener noreferrer"},type:{type:String,default:"button",validator:n=>n in P}};function v(n){const{group:t,isInGroup:o,getGroupOrLocalRef:f}=N(G),{iconPosition:r,icon:c,label:l,pressed:i}=e.toRefs(n),u=f("modelValue",n),d=f("disabled",n),s=f("toggle",n),a=f("modifiers",n);return{modelValue:u,disabled:d,toggle:s,isInGroup:o,group:t,modifiers:a,pressed:i,iconPosition:r,icon:c,label:l}}const F={key:1,class:"vv-button__label"},M={key:1,class:"vv-button__label"},U={name:"VvButton"};return e.defineComponent({...U,props:q,setup(n){const t=n,o=e.useAttrs(),f=e.useSlots(),r=(o==null?void 0:o.name)||k.nanoid(),{modifiers:c,iconPosition:l,icon:i,label:u,modelValue:d,disabled:s,toggle:a,isInGroup:g}=v(t),y=e.inject(O),C=e.computed(()=>{switch(!0){case s.value:return m.button;case t.to!==void 0:return y!=null&&y.nuxt?m.nuxtLink:m.routerLink;case t.href!==void 0:return m.a;default:return m.button}}),S=e.computed(()=>a.value?Array.isArray(d.value)?L(r,d.value):$(r,d.value):t.pressed),{bemCssClasses:Z}=V("vv-button",{modifiers:c,active:t.active,pressed:S,disabled:s,reverse:e.computed(()=>[h.right,h.bottom].includes(l.value)),column:e.computed(()=>[h.top,h.bottom].includes(l.value)),iconOnly:e.computed(()=>(i==null?void 0:i.value)&&!(u!=null&&u.value)&&!f.default)}),z=e.computed(()=>typeof(i==null?void 0:i.value)=="string"?{name:i==null?void 0:i.value}:i==null?void 0:i.value),T=e.computed(()=>{const p={class:Z.value,"aria-label":o["aria-label"],"aria-pressed":S.value?!0:void 0};switch(C.value){case m.a:return{...p,role:"button",href:t.href,target:t.target,rel:t.rel};case m.routerLink:case m.nuxtLink:return{...p,role:"button",to:t.to,target:t.target};default:return{...p,type:t.type,disabled:s.value}}});function H(){g.value&&(d.value=r)}return(p,X)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(C)),e.mergeProps(e.unref(T),{onClickPassive:H}),{default:e.withCtx(()=>[e.renderSlot(p.$slots,"default",{},()=>[p.loading?e.renderSlot(p.$slots,"loading",{key:0},()=>[p.loadingIcon?(e.openBlock(),e.createBlock(A,{key:0,class:"vv-button__loading-icon",name:p.loadingIcon},null,8,["name"])):e.createCommentVNode("",!0),p.loadingLabel?(e.openBlock(),e.createElementBlock("span",F,e.toDisplayString(p.loadingLabel),1)):e.createCommentVNode("",!0)]):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.renderSlot(p.$slots,"before"),e.unref(i)?(e.openBlock(),e.createBlock(A,e.mergeProps({key:0,class:"vv-button__icon"},e.unref(z)),null,16)):e.createCommentVNode("",!0),e.unref(u)?(e.openBlock(),e.createElementBlock("span",M,[e.renderSlot(p.$slots,"label",{},()=>[e.createTextVNode(e.toDisplayString(e.unref(u)),1)])])):e.createCommentVNode("",!0),e.renderSlot(p.$slots,"after")],64))])]),_:3},16))}})});

package/dist/components/VvButton/VvButton.vue.d.ts

@@ -1,157 +1,67 @@
-import { ButtonIconPosition } from './VvButton';
-declare const _default: {
-    new (...args: any[]): {
-        $: import("vue").ComponentInternalInstance;
-        $data: {};
-        $props: Partial<{
-            disabled: boolean;
-            iconPosition: ButtonIconPosition;
-            loading: boolean;
-            loadingIcon: string;
-            loadingLabel: string;
-            active: boolean;
-            selected: boolean;
-        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
-            icon: StringConstructor;
-            iconPosition: {
-                type: import("vue").PropType<ButtonIconPosition>;
-                default: ButtonIconPosition;
-                validator: (value: string) => boolean;
-            };
-            label: StringConstructor;
-            loading: BooleanConstructor;
-            loadingIcon: {
-                type: StringConstructor;
-                default: string;
-            };
-            loadingLabel: {
-                type: StringConstructor;
-                default: string;
-            };
-            to: {
-                type: (StringConstructor | ObjectConstructor)[];
-            };
-            href: StringConstructor;
-            target: {
-                type: import("vue").PropType<import("./VvButton").ButtonTarget>;
-                validator: (value: string) => boolean;
-            };
-            active: BooleanConstructor;
-            selected: BooleanConstructor;
-            disabled: BooleanConstructor;
-            modifiers: import("vue").PropType<string | string[]>;
-        }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "disabled" | "iconPosition" | "loading" | "loadingIcon" | "loadingLabel" | "active" | "selected">;
-        $attrs: {
-            [x: string]: unknown;
-        };
-        $refs: {
-            [x: string]: unknown;
-        };
-        $slots: Readonly<{
-            [name: string]: import("vue").Slot | undefined;
-        }>;
-        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
-        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
-        $emit: (event: string, ...args: any[]) => void;
-        $el: any;
-        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
-            icon: StringConstructor;
-            iconPosition: {
-                type: import("vue").PropType<ButtonIconPosition>;
-                default: ButtonIconPosition;
-                validator: (value: string) => boolean;
-            };
-            label: StringConstructor;
-            loading: BooleanConstructor;
-            loadingIcon: {
-                type: StringConstructor;
-                default: string;
-            };
-            loadingLabel: {
-                type: StringConstructor;
-                default: string;
-            };
-            to: {
-                type: (StringConstructor | ObjectConstructor)[];
-            };
-            href: StringConstructor;
-            target: {
-                type: import("vue").PropType<import("./VvButton").ButtonTarget>;
-                validator: (value: string) => boolean;
-            };
-            active: BooleanConstructor;
-            selected: BooleanConstructor;
-            disabled: BooleanConstructor;
-            modifiers: import("vue").PropType<string | string[]>;
-        }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
-            disabled: boolean;
-            iconPosition: ButtonIconPosition;
-            loading: boolean;
-            loadingIcon: string;
-            loadingLabel: string;
-            active: boolean;
-            selected: boolean;
-        }, {}, string> & {
-            beforeCreate?: ((() => void) | (() => void)[]) | undefined;
-            created?: ((() => void) | (() => void)[]) | undefined;
-            beforeMount?: ((() => void) | (() => void)[]) | undefined;
-            mounted?: ((() => void) | (() => void)[]) | undefined;
-            beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
-            updated?: ((() => void) | (() => void)[]) | undefined;
-            activated?: ((() => void) | (() => void)[]) | undefined;
-            deactivated?: ((() => void) | (() => void)[]) | undefined;
-            beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
-            beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
-            destroyed?: ((() => void) | (() => void)[]) | undefined;
-            unmounted?: ((() => void) | (() => void)[]) | undefined;
-            renderTracked?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
-            renderTriggered?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
-            errorCaptured?: (((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null, info: string) => boolean | void)[]) | undefined;
-        };
-        $forceUpdate: () => void;
-        $nextTick: typeof import("vue").nextTick;
-        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
-    } & Readonly<import("vue").ExtractPropTypes<{
-        icon: StringConstructor;
-        iconPosition: {
-            type: import("vue").PropType<ButtonIconPosition>;
-            default: ButtonIconPosition;
-            validator: (value: string) => boolean;
-        };
-        label: StringConstructor;
-        loading: BooleanConstructor;
-        loadingIcon: {
-            type: StringConstructor;
-            default: string;
-        };
-        loadingLabel: {
-            type: StringConstructor;
-            default: string;
-        };
-        to: {
-            type: (StringConstructor | ObjectConstructor)[];
-        };
-        href: StringConstructor;
-        target: {
-            type: import("vue").PropType<import("./VvButton").ButtonTarget>;
-            validator: (value: string) => boolean;
-        };
-        active: BooleanConstructor;
-        selected: BooleanConstructor;
-        disabled: BooleanConstructor;
-        modifiers: import("vue").PropType<string | string[]>;
-    }>> & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {};
-    __isFragment?: undefined;
-    __isTeleport?: undefined;
-    __isSuspense?: undefined;
-} & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
-    icon: StringConstructor;
+import { ButtonIconPosition } from '@/components/VvButton';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+    icon: {
+        type: (ObjectConstructor | StringConstructor)[];
+        default: string;
+    };
+    iconPosition: {
+        type: import("vue").PropType<ButtonIconPosition>;
+        default: ButtonIconPosition;
+        validator: (value: string) => boolean;
+    };
+    label: (StringConstructor | NumberConstructor)[];
+    /**
+     * @description The component pressed state by prop or group.
+     * @returns {string} The component tag.
+     */
+    loading: BooleanConstructor;
+    loadingIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    loadingLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    to: {
+        type: (ObjectConstructor | StringConstructor)[];
+    };
+    href: StringConstructor;
+    target: {
+        type: import("vue").PropType<import("@/components/VvButton").ButtonTarget>;
+        validator: (value: string) => boolean;
+    };
+    active: BooleanConstructor;
+    pressed: BooleanConstructor;
+    rel: {
+        type: StringConstructor;
+        default: string; /**
+         * @description Define icon attributes.
+         * @returns {Object} The icon attributes.
+         */
+    };
+    type: {
+        type: StringConstructor;
+        default: import("@/components/VvButton").ButtonType;
+        validator: (value: string) => boolean;
+    };
+    disabled: BooleanConstructor;
+    modifiers: import("vue").PropType<string | string[]>;
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    icon: {
+        type: (ObjectConstructor | StringConstructor)[];
+        default: string;
+    };
     iconPosition: {
         type: import("vue").PropType<ButtonIconPosition>;
         default: ButtonIconPosition;
         validator: (value: string) => boolean;
     };
-    label: StringConstructor;
+    label: (StringConstructor | NumberConstructor)[];
+    /**
+     * @description The component pressed state by prop or group.
+     * @returns {string} The component tag.
+     */
     loading: BooleanConstructor;
     loadingIcon: {
         type: StringConstructor;
@@ -162,32 +72,50 @@ declare const _default: {
         default: string;
     };
     to: {
-        type: (StringConstructor | ObjectConstructor)[];
+        type: (ObjectConstructor | StringConstructor)[];
     };
     href: StringConstructor;
     target: {
-        type: import("vue").PropType<import("./VvButton").ButtonTarget>;
+        type: import("vue").PropType<import("@/components/VvButton").ButtonTarget>;
         validator: (value: string) => boolean;
     };
     active: BooleanConstructor;
-    selected: BooleanConstructor;
+    pressed: BooleanConstructor;
+    rel: {
+        type: StringConstructor;
+        default: string; /**
+         * @description Define icon attributes.
+         * @returns {Object} The icon attributes.
+         */
+    };
+    type: {
+        type: StringConstructor;
+        default: import("@/components/VvButton").ButtonType;
+        validator: (value: string) => boolean;
+    };
     disabled: BooleanConstructor;
     modifiers: import("vue").PropType<string | string[]>;
-}>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
+}>>, {
     disabled: boolean;
+    type: string;
+    icon: string | Record<string, any>;
     iconPosition: ButtonIconPosition;
     loading: boolean;
     loadingIcon: string;
     loadingLabel: string;
     active: boolean;
-    selected: boolean;
-}, {}, string> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
-    $slots: {
-        default: (_: {}) => any;
-        loading: (_: {}) => any;
-        before: (_: {}) => any;
-        label: (_: {}) => any;
-        after: (_: {}) => any;
-    };
-});
+    pressed: boolean;
+    rel: string;
+}>, {
+    default: (_: {}) => any;
+    loading: (_: {}) => any;
+    before: (_: {}) => any;
+    label: (_: {}) => any;
+    after: (_: {}) => any;
+}>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/VvButton/{VvButton.d.ts → index.d.ts}

@@ -1,10 +1,16 @@
-import type { PropType, ExtractPropTypes } from 'vue';
+import { type PropType, type ExtractPropTypes, type Ref } from 'vue';
+import type IButtonGroupState from '@/composables/group/types/IButtonGroupState';
 export declare enum ButtonIconPosition {
     left = "left",
     right = "right",
     top = "top",
     bottom = "bottom"
 }
+export declare enum ButtonType {
+    button = "button",
+    submit = "submit",
+    reset = "reset"
+}
 export declare enum ButtonTag {
     nuxtLink = "nuxt-link",
     routerLink = "router-link",
@@ -22,7 +28,10 @@ export declare const VvButtonProps: {
     /**
      * Button icon
      */
-    icon: StringConstructor;
+    icon: {
+        type: (ObjectConstructor | StringConstructor)[];
+        default: string;
+    };
     /**
      * Button icon position
      */
@@ -34,7 +43,7 @@ export declare const VvButtonProps: {
     /**
      * Button label
      */
-    label: StringConstructor;
+    label: (StringConstructor | NumberConstructor)[];
     /**
      * Loading status
      */
@@ -58,7 +67,7 @@ export declare const VvButtonProps: {
      * @see Documentation of [router-link](https://router.vuejs.org/api/#router-link) and [nuxt-link](https://nuxtjs.org/api/components-nuxt-link/)
      */
     to: {
-        type: (StringConstructor | ObjectConstructor)[];
+        type: (ObjectConstructor | StringConstructor)[];
     };
     /**
      * Link href
@@ -73,12 +82,40 @@ export declare const VvButtonProps: {
     };
     active: BooleanConstructor;
     /**
-     * Button selected mode
+     * Button pressed mode
+     */
+    pressed: BooleanConstructor;
+    /**
+     * Link rel
+     */
+    rel: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Button type
      */
-    selected: BooleanConstructor;
+    type: {
+        type: StringConstructor;
+        default: ButtonType;
+        validator: (value: string) => boolean;
+    };
     disabled: BooleanConstructor;
     modifiers: PropType<string | string[]>;
 };
-declare type _VvButtonPropsType = typeof VvButtonProps;
-export declare type VvButtonPropsTypes = ExtractPropTypes<_VvButtonPropsType>;
-export {};
+export type VvButtonPropsTypes = ExtractPropTypes<typeof VvButtonProps>;
+/**
+ * Merges local and group props
+ */
+export declare function useGroupProps(props: VvButtonPropsTypes): {
+    modelValue: import("vue").WritableComputedRef<unknown>;
+    disabled: Ref<boolean>;
+    toggle: Ref<boolean>;
+    isInGroup: import("vue").ComputedRef<boolean>;
+    group: Ref<IButtonGroupState> | undefined;
+    modifiers: Ref<string | string[]>;
+    pressed: Ref<boolean>;
+    iconPosition: Ref<ButtonIconPosition>;
+    icon: Ref<string | Record<string, any>>;
+    label: Ref<string | number | undefined> | undefined;
+};