@volverjs/ui-vue 0.0.10-beta.2 → 0.0.10-beta.20

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

@@ -1,98 +1,8 @@
-import { inject, computed, unref, defineComponent, ref, toRefs, openBlock, createBlock, mergeProps, createCommentVNode } from "vue";
+import { inject, computed, unref, defineComponent, mergeDefaults, ref, toRefs, openBlock, createBlock, mergeProps, createCommentVNode } from "vue";
 import { iconExists, Icon, addIcon } from "@iconify/vue";
-const VvIconProps = {
-  /**
-   * Color
-   */
-  color: String,
-  /**
-   * Width
-   */
-  width: {
-    type: [String, Number]
-  },
-  /**
-   * Height
-   */
-  height: {
-    type: [String, Number]
-  },
-  /**
-   * Icon name
-   * Can be the full composition of iconify name "@{provider}:{prefix}:{name}" or "{prefix}:{name}" or "{name}"
-   * https://docs.iconify.design/api/providers.html#provider-in-icon-name
-   */
-  name: {
-    type: String,
-    required: true
-  },
-  /**
-   * By default 'vv'
-   * If custom collection is not added with "addCollection" DS class method, this prop could not be used
-   * Icon provider: https://docs.iconify.design/api/providers.html#provider-in-icon-name
-   */
-  provider: {
-    type: String
-  },
-  /**
-   * The name of icon set.
-   * Icon default options prefix: simple | normal | detailed
-   */
-  prefix: {
-    type: String,
-    default: "normal"
-  },
-  /**
-   * Url remote SVG icon
-   */
-  src: String,
-  /**
-   * Horizontal flip
-   */
-  horizontalFlip: Boolean,
-  /**
-   * Vertical flip
-   */
-  verticalFlip: Boolean,
-  /**
-   * String alternative to "horizontalFlip" and "verticalFlip".
-   * Example: https://docs.iconify.design/icon-components/vue/transform.html
-   */
-  flip: String,
-  /**
-   * Icon render mode
-   * 'style' = 'bg' or 'mask', depending on icon content
-   * 'bg' = span with style using `background`
-   * 'mask' = span with style using `mask`
-   * 'svg' = svg
-   * Iconify doc: https://docs.iconify.design/iconify-icon/modes.html
-   */
-  mode: String,
-  /**
-   * Toggles inline or block mode
-   * Example https://docs.iconify.design/icon-components/vue/inline.html
-   */
-  inline: Boolean,
-  /**
-   * rotates icon
-   * Example https://docs.iconify.design/icon-components/vue/transform.html
-   */
-  rotate: [Number, String],
-  /**
-   * A callback that is called when icon data has been loaded
-   */
-  onLoad: Function,
-  /**
-   * SVG icon string
-   */
-  svg: String,
-  /**
-   * Icon modifiers: vv-icon css helper classes, value/s are concatened with prefix 'vv-icon--'
-   * @values string | string[]
-   */
-  modifiers: {
-    type: [String, Array]
-  }
+const VvIconPropsDefaults = {
+  prefix: "normal"
+  /* normal */
 };
 const INJECTION_KEY_VOLVER = Symbol.for("volver");
 function useVolver() {
@@ -126,7 +36,24 @@ const __default__ = {
 };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...__default__,
-  props: VvIconProps,
+  props: /* @__PURE__ */ mergeDefaults({
+    name: {},
+    color: {},
+    width: {},
+    height: {},
+    provider: {},
+    prefix: {},
+    src: {},
+    horizontalFlip: { type: Boolean },
+    verticalFlip: { type: Boolean },
+    flip: {},
+    mode: {},
+    inline: { type: Boolean },
+    rotate: {},
+    onLoad: { type: Function },
+    svg: {},
+    modifiers: {}
+  }, VvIconPropsDefaults),
   setup(__props) {
     const props = __props;
     const hasRotate = computed(() => {
@@ -213,7 +140,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         color: _ctx.color,
         onLoad: _ctx.onLoad,
         icon: unref(icon)
-      }), null, 16, ["class"])) : createCommentVNode("", true);
+      }), null, 16, ["class"])) : createCommentVNode("v-if", true);
     };
   }
 });

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

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

@@ -1,69 +1,26 @@
-declare const _default: import("vue").DefineComponent<{
-    color: StringConstructor;
-    width: {
-        type: (StringConstructor | NumberConstructor)[];
-    };
-    height: {
-        type: (StringConstructor | NumberConstructor)[];
-    };
-    name: {
-        type: StringConstructor;
-        required: boolean;
-    };
-    provider: {
-        type: StringConstructor;
-    };
-    prefix: {
-        type: globalThis.PropType<string>;
-        default: string;
-    };
-    src: StringConstructor;
-    horizontalFlip: BooleanConstructor;
-    verticalFlip: BooleanConstructor;
-    flip: StringConstructor;
-    mode: globalThis.PropType<import("@iconify/vue").IconifyRenderMode>;
-    inline: BooleanConstructor;
-    rotate: (StringConstructor | NumberConstructor)[];
-    onLoad: globalThis.PropType<import("@iconify/vue").IconifyIconOnLoad>;
-    svg: StringConstructor;
-    modifiers: {
-        type: globalThis.PropType<string | string[]>;
-    };
-}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    color: StringConstructor;
-    width: {
-        type: (StringConstructor | NumberConstructor)[];
-    };
-    height: {
-        type: (StringConstructor | NumberConstructor)[];
-    };
-    name: {
-        type: StringConstructor;
-        required: boolean;
-    };
-    provider: {
-        type: StringConstructor;
-    };
-    prefix: {
-        type: globalThis.PropType<string>;
-        default: string;
-    };
-    src: StringConstructor;
-    horizontalFlip: BooleanConstructor;
-    verticalFlip: BooleanConstructor;
-    flip: StringConstructor;
-    mode: globalThis.PropType<import("@iconify/vue").IconifyRenderMode>;
-    inline: BooleanConstructor;
-    rotate: (StringConstructor | NumberConstructor)[];
-    onLoad: globalThis.PropType<import("@iconify/vue").IconifyIconOnLoad>;
-    svg: StringConstructor;
-    modifiers: {
-        type: globalThis.PropType<string | string[]>;
-    };
-}>>, {
+import { type VvIconProps } from '.';
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<VvIconProps>, {
+    prefix: import(".").IconPrefix;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<globalThis.ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<VvIconProps>, {
+    prefix: import(".").IconPrefix;
+}>>>, {
     prefix: string;
-    horizontalFlip: boolean;
-    verticalFlip: boolean;
-    inline: boolean;
 }, {}>;
 export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+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;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

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

@@ -1,69 +1,41 @@
-import type { PropType } from 'vue';
 import type { IconifyIconOnLoad, IconifyRenderMode } from '@iconify/vue';
 export declare enum IconPrefix {
     simple = "simple",
     normal = "normal",
     detailed = "detailed"
 }
-export declare const VvIconProps: {
-    /**
-     * Color
-     */
-    color: StringConstructor;
-    /**
-     * Width
-     */
-    width: {
-        type: (StringConstructor | NumberConstructor)[];
-    };
-    /**
-     * Height
-     */
-    height: {
-        type: (StringConstructor | NumberConstructor)[];
-    };
+export type VvIconProps = {
     /**
      * Icon name
      * Can be the full composition of iconify name "@{provider}:{prefix}:{name}" or "{prefix}:{name}" or "{name}"
      * https://docs.iconify.design/api/providers.html#provider-in-icon-name
      */
-    name: {
-        type: StringConstructor;
-        required: boolean;
-    };
+    name: string;
+    color?: string;
+    width?: string | number;
+    height?: string | number;
     /**
-     * By default 'vv'
      * If custom collection is not added with "addCollection" DS class method, this prop could not be used
      * Icon provider: https://docs.iconify.design/api/providers.html#provider-in-icon-name
      */
-    provider: {
-        type: StringConstructor;
-    };
+    provider?: string;
     /**
+     * @default 'normal'
      * The name of icon set.
      * Icon default options prefix: simple | normal | detailed
      */
-    prefix: {
-        type: PropType<string>;
-        default: string;
-    };
+    prefix?: IconPrefix | string;
     /**
      * Url remote SVG icon
      */
-    src: StringConstructor;
-    /**
-     * Horizontal flip
-     */
-    horizontalFlip: BooleanConstructor;
-    /**
-     * Vertical flip
-     */
-    verticalFlip: BooleanConstructor;
+    src?: string;
+    horizontalFlip?: boolean;
+    verticalFlip?: boolean;
     /**
      * String alternative to "horizontalFlip" and "verticalFlip".
      * Example: https://docs.iconify.design/icon-components/vue/transform.html
      */
-    flip: StringConstructor;
+    flip?: string;
     /**
      * Icon render mode
      * 'style' = 'bg' or 'mask', depending on icon content
@@ -72,30 +44,31 @@ export declare const VvIconProps: {
      * 'svg' = svg
      * Iconify doc: https://docs.iconify.design/iconify-icon/modes.html
      */
-    mode: PropType<IconifyRenderMode>;
+    mode?: IconifyRenderMode;
     /**
      * Toggles inline or block mode
      * Example https://docs.iconify.design/icon-components/vue/inline.html
      */
-    inline: BooleanConstructor;
+    inline?: boolean;
     /**
      * rotates icon
      * Example https://docs.iconify.design/icon-components/vue/transform.html
      */
-    rotate: (StringConstructor | NumberConstructor)[];
+    rotate?: number | string;
     /**
      * A callback that is called when icon data has been loaded
      */
-    onLoad: PropType<IconifyIconOnLoad>;
+    onLoad?: IconifyIconOnLoad;
     /**
      * SVG icon string
      */
-    svg: StringConstructor;
+    svg?: string;
     /**
      * Icon modifiers: vv-icon css helper classes, value/s are concatened with prefix 'vv-icon--'
      * @values string | string[]
      */
-    modifiers: {
-        type: PropType<string | string[]>;
-    };
+    modifiers?: string | string[];
+};
+export declare const VvIconPropsDefaults: {
+    prefix: IconPrefix;
 };