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

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

@@ -1 +1 @@
-(function(n,B){typeof exports=="object"&&typeof module<"u"?module.exports=B(require("vue"),require("uuid"),require("@iconify/vue")):typeof define=="function"&&define.amd?define(["vue","uuid","@iconify/vue"],B):(n=typeof globalThis<"u"?globalThis:n||self,n.VvButton=B(n.vue,n.uuid,n.vue$1))})(this,function(n,B,_){"use strict";var b=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(b||{}),k=(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(k||{}),O=(e=>(e._blank="_blank",e._self="_self",e._parent="_parent",e._top="_top",e))(O||{});const j={icon:String,iconPosition:{type:String,default:"left",validator:e=>e in b},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 O},block:Boolean,active:Boolean,rounded:Boolean,disabled:Boolean,fullBleed:Boolean,action:Boolean,actionQuiet:Boolean,selected:Boolean,modifiers:[Array,String]},y={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),i=Array.isArray(t);let o,c,a;if(r&&i){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!=i)return!1;const u=e instanceof Date,f=t instanceof Date;if(u!=f)return!1;if(u&&f)return e.getTime()==t.getTime();const p=e instanceof RegExp,l=t instanceof RegExp;if(p!=l)return!1;if(p&&l)return e.toString()==t.toString();const s=Object.keys(e);if(c=s.length,c!==Object.keys(t).length)return!1;for(o=c;o--!==0;)if(!Object.prototype.hasOwnProperty.call(t,s[o]))return!1;for(o=c;o--!==0;)if(a=s[o],!this.deepEquals(e[a],t[a]))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 i=e;for(let o=0,c=r.length;o<c;++o){if(e==null)return null;i=i[r[o]]}return i}}else return null},isFunction(e){return!!(e&&e.constructor&&e.call&&e.apply)},findIndexInList(e,t){let r=-1;if(t){for(let i=0;i<t.length;i++)if(this.equals(t[i],e)){r=i;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((i,o)=>o!==r):t},isString(e){return typeof e=="string"||e instanceof String},propsToObject(e){return Object.keys(e).reduce((t,r)=>{var i,o,c,a,u;return this.isFunction(e[r])?t[r]=e[r]():Array.isArray(e[r])?t[r]=e[r][0]():(i=e[r])!=null&&i.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]=((a=e[r])==null?void 0:a.default)||((u=e[r])==null?void 0:u.type())),t},{})},filterArray(e,t,r){return e.filter(i=>t.some(o=>typeof o=="string"?i[r]==o:this.equals(i[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 E(e,t){const r={[`${e}`]:!0};return{bemCssClasses:n.computed(()=>Object.keys(t).reduce((o,c)=>{const a=n.unref(t[c])||!1;if(!a)return o;if(c==="modifiers"){const u=Array.isArray(a)?a:[a];return{...o,...u.reduce((f,p)=>({...f,[`${e}--${y.kebabCase(p)}`]:!0}),{})}}else return{...o,[`${e}--${y.kebabCase(c)}`]:a}},r)||{})}}const w=n.defineComponent({__name:"VvIcon",props:V,setup(e){const t=e,r=n.ref(!0),{modifiers:i}=n.toRefs(t),o=n.inject(L),{bemCssClasses:c}=E("vv-icon",{modifiers:i}),a=n.computed(()=>t.provider||(o==null?void 0:o.provider)),u=n.computed(()=>{const l=t.name||"",s=`@${a.value}:${t.prefix}:${t.name}`;return _.iconExists(l)?l:_.iconExists(s)?s:(o==null?void 0:o.iconsCollections.find(d=>{const m=`@${a.value}:${d.prefix}:${l}`;if(_.iconExists(m))return m}))||l});function f(l){let s=null;if(typeof window>"u"){const{JSDOM:S}=require("jsdom");s=new S().window}return(s?new s.DOMParser:new window.DOMParser).parseFromString(l,"text/html").querySelector("svg")}function p(l){const s=f(l),d=(s==null?void 0:s.innerHTML.trim())||"";s&&d&&_.addIcon(`@${a.value}:${t.prefix}:${t.name}`,{body:d,height:s.viewBox.baseVal.height,width:s.viewBox.baseVal.width})}return o&&(t.src?(r.value=!1,o.fetchIcon(t.src).then(l=>{l&&(p(l),r.value=!0)}).catch(l=>{throw new Error(`During fetch icon: ${l==null?void 0:l.message}`)})):t.svg&&p(t.svg)),(l,s)=>r.value?(n.openBlock(),n.createBlock(n.unref(_.Icon),n.mergeProps({key:0,class:n.unref(c)},{...l.$props,provider:n.unref(a),icon:n.unref(u)}),null,16,["class"])):n.createCommentVNode("",!0)}});function q(e){const t=n.inject(e,void 0),r=n.computed(()=>y.isNotEmpty(t));function i(o,c,a){if(t!=null&&t.value){const u=n.unref(t.value)[o];return n.computed({get(){return u==null?void 0:u.value},set(f){u.value=f}})}else{const u=n.toRef(c,o);return n.computed({get(){return u.value},set(f){a&&a(`update:${o}`,f)}})}}return{group:t,isInGroup:r,getGroupOrLocalRef:i}}const D=Symbol("VV_BUTTON_GROUP");function I(e){const{group:t,isInGroup:r,getGroupOrLocalRef:i}=q(D),{modifiers:o,fullBleed:c,iconPosition:a,icon:u,label:f,block:p,selected:l}=n.toRefs(e),s=i("modelValue",e),d=i("disabled",e),m=i("toggle",e),h=i("rounded",e),S=i("action",e),C=i("actionQuiet",e);return{modelValue:s,disabled:d,toggle:m,isInGroup:r,group:t,modifiers:o,action:S,actionQuiet:C,selected:l,block:p,rounded:h,fullBleed:c,iconPosition:a,icon:u,label:f}}const R={key:1,class:"vv-button__label"},x={key:1,class:"vv-button__label"};return n.defineComponent({__name:"VvButton",props:j,setup(e){const t=e,r=n.useAttrs(),i=(r==null?void 0:r.name)||B.v4(),{modifiers:o,action:c,actionQuiet:a,block:u,rounded:f,fullBleed:p,iconPosition:l,icon:s,label:d,modelValue:m,disabled:h,toggle:S,isInGroup:C}=I(t),$=n.computed(()=>{switch(!0){case h.value:return k.button;case t.to!==void 0:return k.routerLink;case t.href!==void 0:return k.a;default:return k.button}}),P=n.computed(()=>S.value?Array.isArray(m.value)?y.contains(i,m.value):y.equals(i,m.value):t.active),F=n.computed(()=>S.value?Array.isArray(m.value)?y.contains(i,m.value):y.equals(i,m.value):t.selected),{bemCssClasses:N}=E("vv-button",{modifiers:o,active:P,action:c,actionQuiet:a,selected:F,block:u,rounded:f,fullBleed:p,disabled:h,reverse:n.computed(()=>[b.right,b.bottom].includes(l.value)),column:n.computed(()=>[b.top,b.bottom].includes(l.value)),iconOnly:n.computed(()=>(s==null?void 0:s.value)&&!(d!=null&&d.value))}),G=n.computed(()=>({...M.value,"aria-label":t.label||r["aria-label"],"aria-disabled":h.value,role:"button",class:N.value,to:t.to})),M=n.computed(()=>{const g=$.value===k.a;let A={};return g&&(A=h.value?{href:"javascript:;"}:{target:t.target,href:t.href}),A});function T(){C.value&&(m.value=i)}return(g,A)=>(n.openBlock(),n.createBlock(n.resolveDynamicComponent(n.unref($)),n.mergeProps(n.unref(G),{onClickPassive:T}),{default:n.withCtx(()=>[n.renderSlot(g.$slots,"default",{},()=>[g.loading?n.renderSlot(g.$slots,"loading",{key:0},()=>[g.loadingIcon?(n.openBlock(),n.createBlock(w,{key:0,class:"vv-button__loading-icon",name:g.loadingIcon},null,8,["name"])):n.createCommentVNode("",!0),g.loadingLabel?(n.openBlock(),n.createElementBlock("span",R,n.toDisplayString(g.loadingLabel),1)):n.createCommentVNode("",!0)]):(n.openBlock(),n.createElementBlock(n.Fragment,{key:1},[n.renderSlot(g.$slots,"before"),n.unref(s)?(n.openBlock(),n.createBlock(w,{key:0,class:"vv-button__icon",name:n.unref(s)},null,8,["name"])):n.createCommentVNode("",!0),n.unref(d)?(n.openBlock(),n.createElementBlock("span",x,[n.renderSlot(g.$slots,"label",{},()=>[n.createTextVNode(n.toDisplayString(n.unref(d)),1)])])):n.createCommentVNode("",!0),n.renderSlot(g.$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,182 +1,19 @@
-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;
-            block: boolean;
-            active: boolean;
-            rounded: boolean;
-            fullBleed: boolean;
-            action: boolean;
-            actionQuiet: 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;
-            };
-            block: BooleanConstructor;
-            active: BooleanConstructor;
-            rounded: BooleanConstructor;
-            disabled: BooleanConstructor;
-            fullBleed: BooleanConstructor;
-            action: BooleanConstructor;
-            actionQuiet: BooleanConstructor;
-            selected: BooleanConstructor;
-            modifiers: (StringConstructor | ArrayConstructor)[];
-        }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "disabled" | "iconPosition" | "loading" | "loadingIcon" | "loadingLabel" | "block" | "active" | "rounded" | "fullBleed" | "action" | "actionQuiet" | "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;
-            };
-            block: BooleanConstructor;
-            active: BooleanConstructor;
-            rounded: BooleanConstructor;
-            disabled: BooleanConstructor;
-            fullBleed: BooleanConstructor;
-            action: BooleanConstructor;
-            actionQuiet: BooleanConstructor;
-            selected: BooleanConstructor;
-            modifiers: (StringConstructor | ArrayConstructor)[];
-        }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
-            disabled: boolean;
-            iconPosition: ButtonIconPosition;
-            loading: boolean;
-            loadingIcon: string;
-            loadingLabel: string;
-            block: boolean;
-            active: boolean;
-            rounded: boolean;
-            fullBleed: boolean;
-            action: boolean;
-            actionQuiet: 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;
-        };
-        block: BooleanConstructor;
-        active: BooleanConstructor;
-        rounded: BooleanConstructor;
-        disabled: BooleanConstructor;
-        fullBleed: BooleanConstructor;
-        action: BooleanConstructor;
-        actionQuiet: BooleanConstructor;
-        selected: BooleanConstructor;
-        modifiers: (StringConstructor | ArrayConstructor)[];
-    }>> & 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;
+    label: (StringConstructor | NumberConstructor)[];
+    /**
+     * @description The component pressed state by prop or group.
+     * @returns {string} The component tag.
+     */
     loading: BooleanConstructor;
     loadingIcon: {
         type: StringConstructor;
@@ -187,42 +24,98 @@ 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;
     };
-    block: BooleanConstructor;
     active: BooleanConstructor;
-    rounded: 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;
-    fullBleed: BooleanConstructor;
-    action: BooleanConstructor;
-    actionQuiet: BooleanConstructor;
-    selected: BooleanConstructor;
-    modifiers: (StringConstructor | ArrayConstructor)[];
-}>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
+    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 | 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[]>;
+}>>, {
     disabled: boolean;
+    type: string;
+    icon: string | Record<string, any>;
     iconPosition: ButtonIconPosition;
     loading: boolean;
     loadingIcon: string;
     loadingLabel: string;
-    block: boolean;
     active: boolean;
-    rounded: boolean;
-    fullBleed: boolean;
-    action: boolean;
-    actionQuiet: 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
@@ -71,45 +80,42 @@ export declare const VvButtonProps: {
         type: PropType<ButtonTarget>;
         validator: (value: string) => boolean;
     };
-    /**
-     * Create block level button that span the full width of a parent.
-     */
-    block: BooleanConstructor;
-    /**
-     * Button active state.
-     */
     active: BooleanConstructor;
     /**
-     * Button rounded.
-     */
-    rounded: BooleanConstructor;
-    /**
-     * Button disabled
-     */
-    disabled: BooleanConstructor;
-    /**
-     * Button with min-width
+     * Button pressed mode
      */
-    fullBleed: BooleanConstructor;
+    pressed: BooleanConstructor;
     /**
-     * Button action mode
+     * Link rel
      */
-    action: BooleanConstructor;
-    /**
-     * Button action mode
-     */
-    actionQuiet: BooleanConstructor;
-    /**
-     * Button selected mode
-     */
-    selected: BooleanConstructor;
+    rel: {
+        type: StringConstructor;
+        default: string;
+    };
     /**
-     * The variant of the button
-     * @values
-     * @defaultvalue default
+     * Button type
      */
-    modifiers: (StringConstructor | ArrayConstructor)[];
+    type: {
+        type: StringConstructor;
+        default: ButtonType;
+        validator: (value: string) => boolean;
+    };
+    disabled: BooleanConstructor;
+    modifiers: PropType<string | string[]>;
+};
+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;
 };
-declare type _VvButtonPropsType = typeof VvButtonProps;
-export declare type VvButtonPropsTypes = ExtractPropTypes<_VvButtonPropsType>;
-export {};