@volverjs/ui-vue 0.0.3-beta.4 → 0.0.4

package/dist/props/index.d.ts

@@ -1,16 +1,65 @@
 import type { PropType } from 'vue';
 import type { Option } from '@/types/generic';
+import { Placement, Position, Side, AnchorTarget, ButtonType } from '@/constants';
+export declare const LinkProps: {
+    /**
+     * The router-link/nuxt-link property, if it is defined the button is rendered as a ruouter-link or nuxt-link.
+     * @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)[];
+    };
+    /**
+     * Anchor href
+     */
+    href: StringConstructor;
+    /**
+     * Anchor target
+     */
+    target: {
+        type: PropType<AnchorTarget>;
+        validator: (value: AnchorTarget) => boolean;
+    };
+    /**
+     * Anchor rel
+     */
+    rel: {
+        type: StringConstructor;
+        default: string;
+    };
+};
 export declare const ValidProps: {
+    /**
+     * Valid status
+     */
     valid: BooleanConstructor;
+    /**
+     * Valid label
+     */
     validLabel: (StringConstructor | ArrayConstructor)[];
 };
 export declare const InvalidProps: {
+    /**
+     * Invalid status
+     */
     invalid: BooleanConstructor;
+    /**
+     * Invalid label
+     */
     invalidLabel: (StringConstructor | ArrayConstructor)[];
 };
 export declare const LoadingProps: {
+    /**
+     * Loading status
+     */
     loading: BooleanConstructor;
-    loadingLabel: StringConstructor;
+    /**
+     * Loading label
+     */
+    loadingLabel: {
+        type: StringConstructor;
+        default: string;
+    };
 };
 export declare const DisabledProps: {
     /**
@@ -18,6 +67,30 @@ export declare const DisabledProps: {
      */
     disabled: BooleanConstructor;
 };
+export declare const SelectedProps: {
+    /**
+     * Whether the item is selected
+     */
+    selected: BooleanConstructor;
+};
+export declare const ActiveProps: {
+    /**
+     * Whether the item is active
+     */
+    active: BooleanConstructor;
+};
+export declare const PressedProps: {
+    /**
+     * Whether the item is pressed
+     */
+    pressed: BooleanConstructor;
+};
+export declare const LabelProps: {
+    /**
+     * The item label
+     */
+    label: (StringConstructor | NumberConstructor)[];
+};
 export declare const ReadonlyProps: {
     /**
      * The value is not editable
@@ -58,6 +131,13 @@ export declare const OptionsProps: {
         type: (StringConstructor | FunctionConstructor)[];
         default: string;
     };
+    /**
+     * Used when options are objects: key to use for option disabled
+     */
+    disabledKey: {
+        type: (StringConstructor | FunctionConstructor)[];
+        default: string;
+    };
 };
 export declare const CountProps: {
     /**
@@ -75,11 +155,6 @@ export declare const DebounceProps: {
      */
     debounce: (StringConstructor | NumberConstructor)[];
 };
-export declare const ICON_POSITIONS: {
-    readonly LEFT: "left";
-    readonly RIGHT: "right";
-};
-export type IconPosition = ValueOf<typeof ICON_POSITIONS>;
 export declare const IconProps: {
     /**
      * VvIcon name or props
@@ -92,9 +167,9 @@ export declare const IconProps: {
      * VvIcon position
      */
     iconPosition: {
-        type: PropType<IconPosition>;
-        validation: (value: IconPosition) => boolean;
-        default: "right";
+        type: PropType<Position>;
+        default: Position;
+        validation: (value: Position) => boolean;
     };
 };
 export declare const TabindexProps: {
@@ -107,7 +182,7 @@ export declare const TabindexProps: {
         default: number;
     };
 };
-export declare const FloatingProps: {
+export declare const FloatingLabelProps: {
     /**
      * If true the label will be floating
      */
@@ -122,12 +197,115 @@ export declare const UnselectableProps: {
         default: boolean;
     };
 };
-export declare const IdNameProps: {
+export declare const IdProps: {
     /**
      * Global attribute id
      * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
      */
     id: (StringConstructor | NumberConstructor)[];
+};
+export declare const DropdownProps: {
+    /**
+     * Dropdown placement
+     */
+    placement: {
+        type: PropType<Side | Placement>;
+        default: Side;
+        validator: (value: Side & Placement) => boolean;
+    };
+    /**
+     * Dropdown show / hide transition name
+     */
+    transitionName: {
+        type: StringConstructor;
+    };
+    /**
+     * Offset of the dropdown from the trigger
+     * @see https://floating-ui.com/docs/offset
+     */
+    offset: {
+        type: PropType<string | import("@floating-ui/core").OffsetOptions | undefined>;
+        default: number;
+    };
+    /**
+     * Move dropdown to the side if there is no space in the default position
+     * @see https://floating-ui.com/docs/shift
+     */
+    shift: {
+        type: PropType<boolean | Partial<import("@floating-ui/core").ShiftOptions & Omit<import("@floating-ui/core").DetectOverflowOptions, "boundary"> & {
+            boundary: import("@floating-ui/dom").Boundary;
+        }> | undefined>;
+        default: boolean;
+    };
+    /**
+     * Flip dropdown position if there is no space in the default position
+     * @see https://floating-ui.com/docs/flip
+     */
+    flip: {
+        type: PropType<boolean | Partial<import("@floating-ui/core").FlipOptions & Omit<import("@floating-ui/core").DetectOverflowOptions, "boundary"> & {
+            boundary: import("@floating-ui/dom").Boundary;
+        }> | undefined>;
+        default: boolean;
+    };
+    /**
+     * Size of the dropdown
+     * @see https://floating-ui.com/docs/size
+     */
+    size: {
+        type: PropType<boolean | Partial<Omit<import("@floating-ui/core").SizeOptions, "apply"> & {
+            apply(args: Omit<import("@floating-ui/core").MiddlewareArguments, "elements"> & {
+                elements: import("@floating-ui/dom").Elements;
+            } & {
+                availableWidth: number;
+                availableHeight: number;
+            }): void | Promise<void>;
+        } & Omit<import("@floating-ui/core").DetectOverflowOptions, "boundary"> & {
+            boundary: import("@floating-ui/dom").Boundary;
+        }> | undefined>;
+        default: () => {
+            padding: number;
+        };
+    };
+    /**
+     * Automatically change the position of the dropdown
+     * @see https://floating-ui.com/docs/autoPlacement
+     */
+    autoPlacement: {
+        type: PropType<boolean | Partial<import("@floating-ui/core").AutoPlacementOptions & Omit<import("@floating-ui/core").DetectOverflowOptions, "boundary"> & {
+            boundary: import("@floating-ui/dom").Boundary;
+        }> | undefined>;
+        default: boolean;
+    };
+    /**
+     * Add arrow to the dropdown
+     * @see https://floating-ui.com/docs/arrow
+     */
+    arrow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Close dropdown on click outside
+     */
+    autoClose: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Autofocus first item on dropdown open
+     */
+    autofocusFirst: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Set dropdown width to the same as the trigger
+     */
+    triggerWidth: {
+        type: BooleanConstructor;
+    };
+};
+export declare const IdNameProps: {
     /**
      * Input / Textarea name
      * Name of the form control. Submitted with the form as part of a name/value pair
@@ -137,6 +315,11 @@ export declare const IdNameProps: {
         type: StringConstructor;
         required: boolean;
     };
+    /**
+     * Global attribute id
+     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
+     */
+    id: (StringConstructor | NumberConstructor)[];
 };
 export declare const AutofocusProps: {
     /**
@@ -185,9 +368,9 @@ export declare const InputTextareaProps: {
      */
     required: BooleanConstructor;
     /**
-     * <label> value for the Input / Textarea
+     * The item label
      */
-    label: StringConstructor;
+    label: (StringConstructor | NumberConstructor)[];
     /**
      * If true the label will be floating
      */
@@ -203,9 +386,9 @@ export declare const InputTextareaProps: {
      * VvIcon position
      */
     iconPosition: {
-        type: PropType<IconPosition>;
-        validation: (value: IconPosition) => boolean;
-        default: "right";
+        type: PropType<Position>;
+        default: Position;
+        validation: (value: Position) => boolean;
     };
     /**
      * Milliseconds to wait before emitting the input event
@@ -223,15 +406,36 @@ export declare const InputTextareaProps: {
      * Component BEM modifiers
      */
     modifiers: PropType<string | string[]>;
+    /**
+     * Loading status
+     */
     loading: BooleanConstructor;
-    loadingLabel: StringConstructor;
+    /**
+     * Loading label
+     */
+    loadingLabel: {
+        type: StringConstructor;
+        default: string;
+    };
     hintLabel: {
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Invalid status
+     */
     invalid: BooleanConstructor;
+    /**
+     * Invalid label
+     */
     invalidLabel: (StringConstructor | ArrayConstructor)[];
+    /**
+     * Valid status
+     */
     valid: BooleanConstructor;
+    /**
+     * Valid label
+     */
     validLabel: (StringConstructor | ArrayConstructor)[];
     /**
      * The value is not editable
@@ -262,11 +466,6 @@ export declare const InputTextareaProps: {
      * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus
      */
     autofocus: BooleanConstructor;
-    /**
-     * Global attribute id
-     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
-     */
-    id: (StringConstructor | NumberConstructor)[];
     /**
      * Input / Textarea name
      * Name of the form control. Submitted with the form as part of a name/value pair
@@ -276,6 +475,11 @@ export declare const InputTextareaProps: {
         type: StringConstructor;
         required: boolean;
     };
+    /**
+     * Global attribute id
+     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
+     */
+    id: (StringConstructor | NumberConstructor)[];
 };
 export declare const CheckboxRadioProps: {
     /**
@@ -288,9 +492,13 @@ export declare const CheckboxRadioProps: {
      */
     modelValue: (StringConstructor | BooleanConstructor | ObjectConstructor | NumberConstructor)[];
     /**
-     * <label> for input
+     * The item label
      */
-    label: StringConstructor;
+    label: (StringConstructor | NumberConstructor)[];
+    /**
+     * Component BEM modifiers
+     */
+    modifiers: PropType<string | string[]>;
     /**
      * The value is not editable
      */
@@ -303,9 +511,21 @@ export declare const CheckboxRadioProps: {
         type: StringConstructor;
         default: string;
     };
+    /**
+     * Invalid status
+     */
     invalid: BooleanConstructor;
+    /**
+     * Invalid label
+     */
     invalidLabel: (StringConstructor | ArrayConstructor)[];
+    /**
+     * Valid status
+     */
     valid: BooleanConstructor;
+    /**
+     * Valid label
+     */
     validLabel: (StringConstructor | ArrayConstructor)[];
     /**
      * Global attribute tabindex
@@ -315,11 +535,6 @@ export declare const CheckboxRadioProps: {
         type: (StringConstructor | NumberConstructor)[];
         default: number;
     };
-    /**
-     * Global attribute id
-     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
-     */
-    id: (StringConstructor | NumberConstructor)[];
     /**
      * Input / Textarea name
      * Name of the form control. Submitted with the form as part of a name/value pair
@@ -329,16 +544,17 @@ export declare const CheckboxRadioProps: {
         type: StringConstructor;
         required: boolean;
     };
+    /**
+     * Global attribute id
+     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
+     */
+    id: (StringConstructor | NumberConstructor)[];
 };
 export declare const CheckboxRadioGroupProps: {
     /**
      * Input value
      */
     modelValue: (StringConstructor | ArrayConstructor)[];
-    /**
-     * Input label
-     */
-    label: StringConstructor;
     /**
      * Input name
      */
@@ -350,6 +566,14 @@ export declare const CheckboxRadioGroupProps: {
      * If true, the group will be displayed in a vertical column
      */
     vertical: BooleanConstructor;
+    /**
+     * The item label
+     */
+    label: (StringConstructor | NumberConstructor)[];
+    /**
+     * Component BEM modifiers
+     */
+    modifiers: PropType<string | string[]>;
     /**
      * The value is not editable
      */
@@ -383,8 +607,78 @@ export declare const CheckboxRadioGroupProps: {
         type: (StringConstructor | FunctionConstructor)[];
         default: string;
     };
+    /**
+     * Used when options are objects: key to use for option disabled
+     */
+    disabledKey: {
+        type: (StringConstructor | FunctionConstructor)[];
+        default: string;
+    };
+    /**
+     * Invalid status
+     */
     invalid: BooleanConstructor;
+    /**
+     * Invalid label
+     */
     invalidLabel: (StringConstructor | ArrayConstructor)[];
+    /**
+     * Valid status
+     */
     valid: BooleanConstructor;
+    /**
+     * Valid label
+     */
     validLabel: (StringConstructor | ArrayConstructor)[];
 };
+export declare const ActionProps: {
+    /**
+     * Button type
+     */
+    type: {
+        type: StringConstructor;
+        default: ButtonType;
+        validator: (value: ButtonType) => boolean;
+    };
+    /**
+     * The router-link/nuxt-link property, if it is defined the button is rendered as a ruouter-link or nuxt-link.
+     * @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)[];
+    };
+    /**
+     * Anchor href
+     */
+    href: StringConstructor;
+    /**
+     * Anchor target
+     */
+    target: {
+        type: PropType<AnchorTarget>;
+        validator: (value: AnchorTarget) => boolean;
+    };
+    /**
+     * Anchor rel
+     */
+    rel: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Whether the item is active
+     */
+    active: BooleanConstructor;
+    /**
+     * Whether the item is pressed
+     */
+    pressed: BooleanConstructor;
+    /**
+     * The item label
+     */
+    label: (StringConstructor | NumberConstructor)[];
+    /**
+     * Whether the form control is disabled
+     */
+    disabled: BooleanConstructor;
+};

package/dist/resolvers/unplugin.d.ts

@@ -1,17 +1,16 @@
 import type { ComponentResolver } from 'unplugin-vue-components/types';
+type ImportStyle = boolean | 'css' | 'scss';
 export interface VolverResolverOptions {
     /**
      * import style along with components
-     *
-     * @default 'css'
+     * @default undefined
      */
-    importStyle?: boolean | 'css' | 'scss';
+    importStyle?: ImportStyle;
     /**
-     * import custom style path
-     *
-     * @default ''
+     * enable/disable directives
+     * @default undefined
      */
-    customStylePath?: string;
+    directives?: boolean;
     /**
      * prefix for components (e.g. 'vv' to resolve Button from VvButton)
      *
@@ -24,4 +23,5 @@ export interface VolverResolverOptions {
  *
  * @link https://github.com/volverjs/ui-vue
  */
-export declare function VolverResolver({ prefix, importStyle, customStylePath, }?: VolverResolverOptions): ComponentResolver;
+export declare function VolverResolver({ prefix, importStyle, directives, }?: VolverResolverOptions): ComponentResolver[];
+export {};

package/dist/resolvers/unplugin.es.js

@@ -1,42 +1,63 @@
-function i(r, o) {
-  if (typeof r != "string")
+function n(o, e) {
+  if (typeof o != "string")
     throw new TypeError("expected a string");
-  return r.trim().replace(/([a-z])([A-Z])/g, "$1-$2").replace(/\W/g, (e) => /[À-ž]/.test(e) ? e : "-").replace(/^-+|-+$/g, "").replace(/-{2,}/g, (e) => o != null && o.condense ? "-" : e).toLowerCase();
+  return o.trim().replace(/([a-z])([A-Z])/g, "$1-$2").replace(/\W/g, (r) => /[À-ž]/.test(r) ? r : "-").replace(/^-+|-+$/g, "").replace(/-{2,}/g, (r) => e != null && e.condense ? "-" : r).toLowerCase();
 }
-const f = ["vv-icon"], s = "vv", p = function(r) {
-  if (!f.includes(r))
-    return r === "vv-combobox" ? ["vv-select", "vv-dropdown"] : r === "vv-accordion-group" ? ["vv-accordion-group", "vv-accordion"] : r === "vv-checkbox-group" ? ["vv-checkbox-group", "vv-checkbox"] : r === "vv-radio-group" ? ["vv-radio-group", "vv-radio"] : [r];
+const i = ["vv-icon", "vv-action"], c = "vv", u = ["v-tooltip"], d = function(o) {
+  if (!i.includes(o))
+    return o === "vv-dropdown" ? ["vv-dropdown", "vv-dropdown-option", "vv-dropdown-action"] : o === "vv-combobox" ? [
+      "vv-select",
+      "vv-dropdown",
+      "vv-dropdown-option",
+      "vv-dropdown-action"
+    ] : o === "vv-accordion-group" ? ["vv-accordion-group", "vv-accordion"] : o === "vv-checkbox-group" ? ["vv-checkbox-group", "vv-checkbox"] : o === "vv-radio-group" ? ["vv-radio-group", "vv-radio"] : o === "v-tooltip" ? ["vv-tooltip"] : [o];
+}, s = function(o, e) {
+  const r = [];
+  if (!e)
+    return r;
+  const v = d(o);
+  return v && v.forEach((t) => {
+    r.push(
+      `@volverjs/style/${e === "scss" ? "scss/" : ""}components/${t}`
+    );
+  }), r;
 };
-function d({
-  prefix: r = s,
-  importStyle: o,
-  customStylePath: e
+function f({
+  prefix: o = c,
+  importStyle: e,
+  directives: r
 } = {}) {
-  return {
-    type: "component",
-    resolve: (v) => {
-      if (!r || !v.toLowerCase().startsWith(r.toLowerCase()))
-        return;
-      const c = [], t = i(v).replace(
-        `${r}-`,
-        `${s}-`
-      );
-      if (o) {
-        e && c.push(e);
-        const n = p(t);
-        n && n.forEach((u) => {
-          c.push(
-            `@volverjs/style/${o === "scss" ? "scss/" : ""}components/${u}`
-          );
-        });
+  return [
+    {
+      type: "component",
+      resolve: (v) => {
+        if (!o || !v.toLowerCase().startsWith(o.toLowerCase()))
+          return;
+        const t = n(v).replace(
+          `${o}-`,
+          `${c}-`
+        );
+        return {
+          from: `@volverjs/ui-vue/${t}`,
+          sideEffects: s(t, e)
+        };
+      }
+    },
+    {
+      type: "directive",
+      resolve: (v) => {
+        if (!r)
+          return;
+        const t = `v-${n(v)}`;
+        if (u.includes(t))
+          return {
+            from: `@volverjs/ui-vue/${t}`,
+            sideEffects: s(t, e)
+          };
       }
-      return {
-        from: `@volverjs/ui-vue/${t}`,
-        sideEffects: c
-      };
     }
-  };
+  ];
 }
 export {
-  d as VolverResolver
+  f as VolverResolver
 };

package/dist/resolvers/unplugin.umd.js

@@ -1 +1 @@
-(function(r,t){typeof exports=="object"&&typeof module<"u"?t(exports):typeof define=="function"&&define.amd?define(["exports"],t):(r=typeof globalThis<"u"?globalThis:r||self,t(r.components={}))})(this,function(r){"use strict";function t(e,n){if(typeof e!="string")throw new TypeError("expected a string");return e.trim().replace(/([a-z])([A-Z])/g,"$1-$2").replace(/\W/g,o=>/[À-ž]/.test(o)?o:"-").replace(/^-+|-+$/g,"").replace(/-{2,}/g,o=>n!=null&&n.condense?"-":o).toLowerCase()}const f=["vv-icon"],s="vv",d=function(e){if(!f.includes(e))return e==="vv-combobox"?["vv-select","vv-dropdown"]:e==="vv-accordion-group"?["vv-accordion-group","vv-accordion"]:e==="vv-checkbox-group"?["vv-checkbox-group","vv-checkbox"]:e==="vv-radio-group"?["vv-radio-group","vv-radio"]:[e]};function p({prefix:e=s,importStyle:n,customStylePath:o}={}){return{type:"component",resolve:v=>{if(!e||!v.toLowerCase().startsWith(e.toLowerCase()))return;const c=[],i=t(v).replace(`${e}-`,`${s}-`);if(n){o&&c.push(o);const u=d(i);u&&u.forEach(l=>{c.push(`@volverjs/style/${n==="scss"?"scss/":""}components/${l}`)})}return{from:`@volverjs/ui-vue/${i}`,sideEffects:c}}}}r.VolverResolver=p,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});
+(function(v,c){typeof exports=="object"&&typeof module<"u"?c(exports):typeof define=="function"&&define.amd?define(["exports"],c):(v=typeof globalThis<"u"?globalThis:v||self,c(v.components={}))})(this,function(v){"use strict";function c(e,r){if(typeof e!="string")throw new TypeError("expected a string");return e.trim().replace(/([a-z])([A-Z])/g,"$1-$2").replace(/\W/g,o=>/[À-ž]/.test(o)?o:"-").replace(/^-+|-+$/g,"").replace(/-{2,}/g,o=>r!=null&&r.condense?"-":o).toLowerCase()}const u=["vv-icon","vv-action"],i="vv",d=["v-tooltip"],f=function(e){if(!u.includes(e))return e==="vv-dropdown"?["vv-dropdown","vv-dropdown-option","vv-dropdown-action"]:e==="vv-combobox"?["vv-select","vv-dropdown","vv-dropdown-option","vv-dropdown-action"]:e==="vv-accordion-group"?["vv-accordion-group","vv-accordion"]:e==="vv-checkbox-group"?["vv-checkbox-group","vv-checkbox"]:e==="vv-radio-group"?["vv-radio-group","vv-radio"]:e==="v-tooltip"?["vv-tooltip"]:[e]},s=function(e,r){const o=[];if(!r)return o;const n=f(e);return n&&n.forEach(t=>{o.push(`@volverjs/style/${r==="scss"?"scss/":""}components/${t}`)}),o};function p({prefix:e=i,importStyle:r,directives:o}={}){return[{type:"component",resolve:n=>{if(!e||!n.toLowerCase().startsWith(e.toLowerCase()))return;const t=c(n).replace(`${e}-`,`${i}-`);return{from:`@volverjs/ui-vue/${t}`,sideEffects:s(t,r)}}},{type:"directive",resolve:n=>{if(!o)return;const t=`v-${c(n)}`;if(d.includes(t))return{from:`@volverjs/ui-vue/${t}`,sideEffects:s(t,r)}}}]}v.VolverResolver=p,Object.defineProperty(v,Symbol.toStringTag,{value:"Module"})});

package/dist/stories/CheckboxGroup/CheckboxGroup.settings.d.ts

@@ -125,6 +125,20 @@ export declare const argTypes: {
             };
         };
     };
+    disabledKey: {
+        type: {
+            summary: string[];
+        };
+        description: string;
+        control: {
+            type: string;
+        };
+        table: {
+            defaultValue: {
+                summary: string;
+            };
+        };
+    };
     invalid: {
         type: string;
         description: string;