@volverjs/ui-vue 0.0.5 → 0.0.6-beta.15

package/dist/components/VvDropdownOption/VvDropdownOption.es.js

@@ -1,4 +1,4 @@
-import { inject, provide, defineComponent, ref, watch, openBlock, createElementBlock, mergeProps, unref, renderSlot, computed, toRefs, createBlock, normalizeClass, withCtx, createElementVNode, normalizeProps, guardReactiveProps, createTextVNode, toDisplayString } from "vue";
+import { inject, provide, ref, defineComponent, watch, openBlock, createElementBlock, mergeProps, unref, renderSlot, computed, toRefs, createBlock, normalizeClass, withCtx, createElementVNode, normalizeProps, guardReactiveProps, createTextVNode, toDisplayString } from "vue";
 import "mitt";
 import { useElementHover, useFocus, useFocusWithin } from "@vueuse/core";
 var Side = /* @__PURE__ */ ((Side2) => {
@@ -43,8 +43,12 @@ var AnchorTarget = /* @__PURE__ */ ((AnchorTarget2) => {
   AnchorTarget2["_top"] = "_top";
   return AnchorTarget2;
 })(AnchorTarget || {});
-const INJECTION_KEY_DROPDOWN_ITEM = Symbol.for("dropdownItem");
-const INJECTION_KEY_DROPDOWN_ACTION = Symbol.for("dropdownAction");
+const INJECTION_KEY_DROPDOWN_ITEM = Symbol.for(
+  "dropdownItem"
+);
+const INJECTION_KEY_DROPDOWN_ACTION = Symbol.for(
+  "dropdownAction"
+);
 function useInjectedDropdownItem() {
   return inject(INJECTION_KEY_DROPDOWN_ITEM, {});
 }
@@ -52,7 +56,7 @@ function useProvideDropdownAction({
   expanded
 }) {
   provide(INJECTION_KEY_DROPDOWN_ACTION, {
-    role: ActionRoles.menuitem,
+    role: ref(ActionRoles.menuitem),
     expanded
   });
 }
@@ -74,7 +78,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       }
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("li", mergeProps({ role: unref(role) }, {
+      return openBlock(), createElementBlock("div", mergeProps({ role: unref(role) }, {
         ref_key: "element",
         ref: element,
         class: ["vv-dropdown__item", { "focus-visible": unref(focused) || unref(focusedWithin) }]
@@ -244,11 +248,11 @@ const UnselectableProps = {
     default: false
   },
   /**
-   * Close dropdown on click outside
+   * Keep open dropdown on click outside
    */
-  autoClose: {
+  keepOpen: {
     type: Boolean,
-    default: true
+    default: false
   },
   /**
    * Autofocus first item on dropdown open

package/dist/components/VvDropdownOption/VvDropdownOption.umd.js

@@ -1 +1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue"),require("mitt"),require("@vueuse/core")):"function"==typeof define&&define.amd?define(["vue","mitt","@vueuse/core"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).VvDropdownOption=t(e.vue,null,e.core)}(this,(function(e,t,o){"use strict";var n=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(n||{}),l=(e=>(e.before="before",e.after="after",e))(l||{}),r=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(r||{}),s=(e=>(e.button="button",e.link="link",e.menuitem="menuitem",e))(s||{});const d=Symbol.for("dropdownItem"),i=Symbol.for("dropdownAction");const a=e.defineComponent({name:"VvDropdownItem",setup(t){const{role:n,expanded:l}=e.inject(d,{}),r=e.ref(null);!function({expanded:t}){e.provide(i,{role:s.menuitem,expanded:t})}({expanded:l});const a=o.useElementHover(r),{focused:u}=o.useFocus(r),{focused:c}=o.useFocusWithin(r);return e.watch(a,(e=>{e&&(u.value=!0)})),(t,o)=>(e.openBlock(),e.createElementBlock("li",e.mergeProps({role:e.unref(n)},{ref_key:"element",ref:r,class:["vv-dropdown__item",{"focus-visible":e.unref(u)||e.unref(c)}]}),[e.renderSlot(t.$slots,"default")],16))}}),u={disabled:Boolean},c={selected:Boolean},f=(Boolean,Boolean,{modifiers:[String,Array]});l.before;const p={unselectable:{type:Boolean,default:!0}};n.bottom,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,r.button;const b=["title"];return e.defineComponent({name:"VvDropdownOption",props:{...u,...c,...p,...f,deselectHintLabel:{type:String},selectHintLabel:{type:String},selectedHintLabel:{type:String}},setup(t){const o=t,{modifiers:n}=e.toRefs(o),l=function(t,o,n){return e.computed((()=>{const l={[t]:!0},r="string"==typeof(null==o?void 0:o.value)?o.value.split(" "):null==o?void 0:o.value;return r&&Array.isArray(r)&&r.forEach((e=>{e&&(l[`${t}--${e}`]=!0)})),n&&Object.keys(n.value).forEach((o=>{l[`${t}--${o}`]=e.unref(n.value[o])})),l}))}("vv-dropdown-option",n,e.computed((()=>({disabled:o.disabled,selected:o.selected,unselectable:o.unselectable&&o.selected})))),r=e.computed((()=>o.selected?o.unselectable?o.deselectHintLabel:o.selectedHintLabel:o.disabled?void 0:o.selectHintLabel));return(t,o)=>(e.openBlock(),e.createBlock(a,{class:e.normalizeClass(e.unref(l)),tabindex:t.disabled?-1:0,"aria-selected":t.selected,"aria-disabled":t.disabled},{default:e.withCtx((()=>[e.renderSlot(t.$slots,"default"),e.createElementVNode("span",{class:"vv-dropdown-option__hint",title:e.unref(r)},[e.renderSlot(t.$slots,"hint",e.normalizeProps(e.guardReactiveProps({disabled:t.disabled,selected:t.selected,unselectable:t.unselectable})),(()=>[e.createTextVNode(e.toDisplayString(e.unref(r)),1)]))],8,b)])),_:3},8,["class","tabindex","aria-selected","aria-disabled"]))}})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue"),require("mitt"),require("@vueuse/core")):"function"==typeof define&&define.amd?define(["vue","mitt","@vueuse/core"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).VvDropdownOption=t(e.vue,null,e.core)}(this,(function(e,t,o){"use strict";var n=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(n||{}),l=(e=>(e.before="before",e.after="after",e))(l||{}),r=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(r||{}),s=(e=>(e.button="button",e.link="link",e.menuitem="menuitem",e))(s||{});const d=Symbol.for("dropdownItem"),i=Symbol.for("dropdownAction");const a=e.defineComponent({name:"VvDropdownItem",setup(t){const{role:n,expanded:l}=e.inject(d,{}),r=e.ref(null);!function({expanded:t}){e.provide(i,{role:e.ref(s.menuitem),expanded:t})}({expanded:l});const a=o.useElementHover(r),{focused:u}=o.useFocus(r),{focused:c}=o.useFocusWithin(r);return e.watch(a,(e=>{e&&(u.value=!0)})),(t,o)=>(e.openBlock(),e.createElementBlock("div",e.mergeProps({role:e.unref(n)},{ref_key:"element",ref:r,class:["vv-dropdown__item",{"focus-visible":e.unref(u)||e.unref(c)}]}),[e.renderSlot(t.$slots,"default")],16))}}),u={disabled:Boolean},c={selected:Boolean},f=(Boolean,Boolean,{modifiers:[String,Array]});l.before;const p={unselectable:{type:Boolean,default:!0}};n.bottom,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,Boolean,r.button;const b=["title"];return e.defineComponent({name:"VvDropdownOption",props:{...u,...c,...p,...f,deselectHintLabel:{type:String},selectHintLabel:{type:String},selectedHintLabel:{type:String}},setup(t){const o=t,{modifiers:n}=e.toRefs(o),l=function(t,o,n){return e.computed((()=>{const l={[t]:!0},r="string"==typeof(null==o?void 0:o.value)?o.value.split(" "):null==o?void 0:o.value;return r&&Array.isArray(r)&&r.forEach((e=>{e&&(l[`${t}--${e}`]=!0)})),n&&Object.keys(n.value).forEach((o=>{l[`${t}--${o}`]=e.unref(n.value[o])})),l}))}("vv-dropdown-option",n,e.computed((()=>({disabled:o.disabled,selected:o.selected,unselectable:o.unselectable&&o.selected})))),r=e.computed((()=>o.selected?o.unselectable?o.deselectHintLabel:o.selectedHintLabel:o.disabled?void 0:o.selectHintLabel));return(t,o)=>(e.openBlock(),e.createBlock(a,{class:e.normalizeClass(e.unref(l)),tabindex:t.disabled?-1:0,"aria-selected":t.selected,"aria-disabled":t.disabled},{default:e.withCtx((()=>[e.renderSlot(t.$slots,"default"),e.createElementVNode("span",{class:"vv-dropdown-option__hint",title:e.unref(r)},[e.renderSlot(t.$slots,"hint",e.normalizeProps(e.guardReactiveProps({disabled:t.disabled,selected:t.selected,unselectable:t.unselectable})),(()=>[e.createTextVNode(e.toDisplayString(e.unref(r)),1)]))],8,b)])),_:3},8,["class","tabindex","aria-selected","aria-disabled"]))}})}));

package/dist/components/VvIcon/VvIcon.es.js

@@ -88,7 +88,7 @@ const VvIconProps = {
   svg: String,
   /**
    * Icon modifiers: vv-icon css helper classes, value/s are concatened with prefix 'vv-icon--'
-   * @values string | Array<string>
+   * @values string | string[]
    */
   modifiers: {
     type: [String, Array]
@@ -129,6 +129,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   props: VvIconProps,
   setup(__props) {
     const props = __props;
+    const hasRotate = computed(() => {
+      if (typeof props.rotate === "string") {
+        return parseFloat(props.rotate);
+      }
+      return props.rotate;
+    });
     const show = ref(true);
     const volver = useVolver();
     const { modifiers } = toRefs(props);
@@ -137,25 +143,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return props.provider || (volver == null ? void 0 : volver.iconsProvider);
     });
     const icon = computed(() => {
-      const _name = props.name ?? "";
-      const iconName = `@${provider.value}:${props.prefix}:${props.name}`;
-      if (iconExists(_name)) {
-        return _name;
-      } else if (iconExists(iconName)) {
+      const name = props.name ?? "";
+      const iconName = `@${provider.value}:${props.prefix}:${name}`;
+      if (iconExists(iconName)) {
         return iconName;
-      } else {
-        return (volver == null ? void 0 : volver.iconsCollections.find(
-          (iconsCollection) => {
-            const icon2 = `@${provider.value}:${iconsCollection.prefix}:${_name}`;
-            if (iconExists(icon2)) {
-              return icon2;
-            }
-          }
-        )) || _name;
       }
+      const iconsCollection = volver == null ? void 0 : volver.iconsCollections.find(
+        (iconsCollection2) => {
+          const icon2 = `@${provider.value}:${iconsCollection2.prefix}:${name}`;
+          return iconExists(icon2);
+        }
+      );
+      if (iconsCollection) {
+        return `@${provider.value}:${iconsCollection.prefix}:${name}`;
+      }
+      return name;
     });
     function getSvgContent(svg) {
-      let dom = null;
+      let dom;
       if (typeof window === "undefined") {
         const { JSDOM } = require("jsdom");
         dom = new JSDOM().window;
@@ -186,12 +191,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             show.value = true;
           }
         }).catch((e) => {
-          throw new Error(`During fetch icon: ${e == null ? void 0 : e.message}`);
+          throw new Error(`Error during fetch icon: ${e == null ? void 0 : e.message}`);
         });
-      } else if (props.svg) {
-        addIconFromSvg(props.svg);
       }
     }
+    if (props.svg) {
+      addIconFromSvg(props.svg);
+    }
     return (_ctx, _cache) => {
       return unref(show) ? (openBlock(), createBlock(unref(Icon), mergeProps({
         key: 0,
@@ -203,7 +209,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         horizontalFlip: _ctx.horizontalFlip,
         verticalFlip: _ctx.verticalFlip,
         flip: _ctx.flip,
-        rotate: _ctx.rotate,
+        rotate: unref(hasRotate),
         color: _ctx.color,
         onLoad: _ctx.onLoad,
         icon: unref(icon)

package/dist/components/VvIcon/VvIcon.umd.js

@@ -1 +1 @@
-!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n(require("vue"),require("@iconify/vue")):"function"==typeof define&&define.amd?define(["vue","@iconify/vue"],n):(e="undefined"!=typeof globalThis?globalThis:e||self).VvIcon=n(e.vue,e.vue$1)}(this,(function(e,n){"use strict";const i={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]}},o=Symbol.for("volver");return e.defineComponent({name:"VvIcon",props:i,setup(i){const r=i,t=e.ref(!0),l=e.inject(o),{modifiers:u}=e.toRefs(r),c=function(n,i,o){return e.computed((()=>{const r={[n]:!0},t="string"==typeof(null==i?void 0:i.value)?i.value.split(" "):null==i?void 0:i.value;return t&&Array.isArray(t)&&t.forEach((e=>{e&&(r[`${n}--${e}`]=!0)})),o&&Object.keys(o.value).forEach((i=>{r[`${n}--${i}`]=e.unref(o.value[i])})),r}))}("vv-icon",u),a=e.computed((()=>r.provider||(null==l?void 0:l.iconsProvider))),s=e.computed((()=>{const e=r.name??"",i=`@${a.value}:${r.prefix}:${r.name}`;return n.iconExists(e)?e:n.iconExists(i)?i:(null==l?void 0:l.iconsCollections.find((i=>{const o=`@${a.value}:${i.prefix}:${e}`;if(n.iconExists(o))return o})))||e}));function f(e){const i=function(e){let n=null;if("undefined"==typeof window){const{JSDOM:e}=require("jsdom");n=(new e).window}return(n?new n.DOMParser:new window.DOMParser).parseFromString(e,"text/html").querySelector("svg")}(e),o=(null==i?void 0:i.innerHTML.trim())||"";i&&o&&n.addIcon(`@${a.value}:${r.prefix}:${r.name}`,{body:o,height:i.viewBox.baseVal.height,width:i.viewBox.baseVal.width})}return l&&(r.src&&!n.iconExists(`@${a.value}:${r.prefix}:${r.name}`)?(t.value=!1,l.fetchIcon(r.src).then((e=>{e&&(f(e),t.value=!0)})).catch((e=>{throw new Error(`During fetch icon: ${null==e?void 0:e.message}`)}))):r.svg&&f(r.svg)),(i,o)=>e.unref(t)?(e.openBlock(),e.createBlock(e.unref(n.Icon),e.mergeProps({key:0,class:e.unref(c)},{inline:i.inline,width:i.width,height:i.height,horizontalFlip:i.horizontalFlip,verticalFlip:i.verticalFlip,flip:i.flip,rotate:i.rotate,color:i.color,onLoad:i.onLoad,icon:e.unref(s)}),null,16,["class"])):e.createCommentVNode("",!0)}})}));
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n(require("vue"),require("@iconify/vue")):"function"==typeof define&&define.amd?define(["vue","@iconify/vue"],n):(e="undefined"!=typeof globalThis?globalThis:e||self).VvIcon=n(e.vue,e.vue$1)}(this,(function(e,n){"use strict";const o={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]}},r=Symbol.for("volver");return e.defineComponent({name:"VvIcon",props:o,setup(o){const i=o,t=e.computed((()=>"string"==typeof i.rotate?parseFloat(i.rotate):i.rotate)),l=e.ref(!0),u=e.inject(r),{modifiers:c}=e.toRefs(i),a=function(n,o,r){return e.computed((()=>{const i={[n]:!0},t="string"==typeof(null==o?void 0:o.value)?o.value.split(" "):null==o?void 0:o.value;return t&&Array.isArray(t)&&t.forEach((e=>{e&&(i[`${n}--${e}`]=!0)})),r&&Object.keys(r.value).forEach((o=>{i[`${n}--${o}`]=e.unref(r.value[o])})),i}))}("vv-icon",c),s=e.computed((()=>i.provider||(null==u?void 0:u.iconsProvider))),f=e.computed((()=>{const e=i.name??"",o=`@${s.value}:${i.prefix}:${e}`;if(n.iconExists(o))return o;const r=null==u?void 0:u.iconsCollections.find((o=>{const r=`@${s.value}:${o.prefix}:${e}`;return n.iconExists(r)}));return r?`@${s.value}:${r.prefix}:${e}`:e}));function d(e){const o=function(e){let n;if("undefined"==typeof window){const{JSDOM:e}=require("jsdom");n=(new e).window}return(n?new n.DOMParser:new window.DOMParser).parseFromString(e,"text/html").querySelector("svg")}(e),r=(null==o?void 0:o.innerHTML.trim())||"";o&&r&&n.addIcon(`@${s.value}:${i.prefix}:${i.name}`,{body:r,height:o.viewBox.baseVal.height,width:o.viewBox.baseVal.width})}return u&&i.src&&!n.iconExists(`@${s.value}:${i.prefix}:${i.name}`)&&(l.value=!1,u.fetchIcon(i.src).then((e=>{e&&(d(e),l.value=!0)})).catch((e=>{throw new Error(`Error during fetch icon: ${null==e?void 0:e.message}`)}))),i.svg&&d(i.svg),(o,r)=>e.unref(l)?(e.openBlock(),e.createBlock(e.unref(n.Icon),e.mergeProps({key:0,class:e.unref(a)},{inline:o.inline,width:o.width,height:o.height,horizontalFlip:o.horizontalFlip,verticalFlip:o.verticalFlip,flip:o.flip,rotate:e.unref(t),color:o.color,onLoad:o.onLoad,icon:e.unref(f)}),null,16,["class"])):e.createCommentVNode("",!0)}})}));

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

@@ -24,7 +24,7 @@ declare const _default: import("vue").DefineComponent<{
     mode: globalThis.PropType<import("@iconify/vue").IconifyRenderMode>;
     inline: BooleanConstructor;
     rotate: (StringConstructor | NumberConstructor)[];
-    onLoad: FunctionConstructor;
+    onLoad: globalThis.PropType<import("@iconify/vue").IconifyIconOnLoad>;
     svg: StringConstructor;
     modifiers: {
         type: globalThis.PropType<string | string[]>;
@@ -55,7 +55,7 @@ declare const _default: import("vue").DefineComponent<{
     mode: globalThis.PropType<import("@iconify/vue").IconifyRenderMode>;
     inline: BooleanConstructor;
     rotate: (StringConstructor | NumberConstructor)[];
-    onLoad: FunctionConstructor;
+    onLoad: globalThis.PropType<import("@iconify/vue").IconifyIconOnLoad>;
     svg: StringConstructor;
     modifiers: {
         type: globalThis.PropType<string | string[]>;
@@ -65,5 +65,5 @@ declare const _default: import("vue").DefineComponent<{
     horizontalFlip: boolean;
     verticalFlip: boolean;
     inline: boolean;
-}>;
+}, {}>;
 export default _default;

package/dist/components/VvIcon/index.d.ts

@@ -1,5 +1,5 @@
 import type { PropType } from 'vue';
-import type { IconifyRenderMode } from '@iconify/vue';
+import type { IconifyIconOnLoad, IconifyRenderMode } from '@iconify/vue';
 export declare enum IconPrefix {
     simple = "simple",
     normal = "normal",
@@ -86,14 +86,14 @@ export declare const VvIconProps: {
     /**
      * A callback that is called when icon data has been loaded
      */
-    onLoad: FunctionConstructor;
+    onLoad: PropType<IconifyIconOnLoad>;
     /**
      * SVG icon string
      */
     svg: StringConstructor;
     /**
      * Icon modifiers: vv-icon css helper classes, value/s are concatened with prefix 'vv-icon--'
-     * @values string | Array<string>
+     * @values string | string[]
      */
     modifiers: {
         type: PropType<string | string[]>;

package/dist/components/VvInputText/VvInputClearAction.d.ts

@@ -29,8 +29,8 @@ declare const _default: import("vue").DefineComponent<{
 }>> & {
     onClear?: ((...args: any[]) => any) | undefined;
 }, {
-    disabled: boolean;
     label: string;
+    disabled: boolean;
     icon: string;
-}>;
+}, {}>;
 export default _default;

package/dist/components/VvInputText/VvInputPasswordAction.d.ts

@@ -52,5 +52,5 @@ declare const _default: import("vue").DefineComponent<{
     labelHide: string;
     iconShow: string;
     iconHide: string;
-}>;
+}, {}>;
 export default _default;

package/dist/components/VvInputText/VvInputStepAction.d.ts

@@ -33,5 +33,5 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     disabled: boolean;
     mode: string;
-}>;
+}, {}>;
 export default _default;