veloce-vue 0.11.0 → 0.12.0

package/README.md

@@ -1,4 +1,4 @@
-# Vue-Components
+# Veloce Vue
 
 A modern Vue.js UI component library built with Vue, Typescript, Storybook and Tailwind CSS.
 
@@ -63,23 +63,6 @@ app.mount("#app");
 - Vue 3.5 or higher
 - Tailwind CSS v4 (for styling)
 
-## Development
-
-This library is built using:
-
-- Vue 3
-- Tailwind CSS v4
-- Vite
-- Storybook for component documentation
-- TypeScript
-
-## Production
-
-Run `pnpm build` to build the package.
-Run `pnpm run build-storybook` to build storybook only.
-
-To test the storybook locally, you can run `pnpm run preview-storybook`. This will start the storybook production build.
-
 ### Consuming application UI configuration
 
 Create `ui.config.ts` and add the following code:
@@ -112,3 +95,24 @@ Use the UI colors in your components/styles:
 ```html
 <div :style="{ backgroundColor: 'var(--ui-color-primary)' }">...</div>
 ```
+
+> **ℹ️ Developer Alert:**  
+> This library is in active development. APIs and styles may change between releases.  
+> Please consult the documentation and changelog for updates before production use.
+
+## Development
+
+This library is built using:
+
+- Vue 3
+- Tailwind CSS v4
+- Vite
+- Storybook for component documentation
+- TypeScript
+
+## Production
+
+Run `pnpm build` to build the package.
+Run `pnpm run build-storybook` to build storybook only.
+
+To test the storybook locally, you can run `pnpm run preview-storybook`. This will start the storybook production build.

package/components/{Button → button}/Index.vue.d.ts

@@ -72,7 +72,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
     readonly label: string;
     readonly loading: boolean;
     readonly disabled: boolean;
-    readonly variant: "outlined" | "text" | "ghost" | "solid";
+    readonly variant: "text" | "outlined" | "ghost" | "solid";
     readonly icon: string;
     readonly iconClass: string;
     readonly iconPosition: "left" | "right";

package/components/checkbox/Index.vue.d.ts

@@ -0,0 +1,43 @@
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    label: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    labelClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    checkboxClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    label: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    labelClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    checkboxClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {
+    label: string;
+    labelClass: string;
+    checkboxClass: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/components/checkbox/props.d.ts

@@ -0,0 +1,14 @@
+export declare const props: {
+    readonly label: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly labelClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly checkboxClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+};

package/components/checkbox/stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from "@storybook/vue3-vite";
+import Checkbox from "./Index.vue";
+declare const meta: Meta<typeof Checkbox>;
+export default meta;
+type Story = StoryObj<typeof Checkbox>;
+export declare const Default: Story;
+export declare const Checked: Story;
+export declare const LabelClass: Story;
+export declare const CheckboxClass: Story;

package/components/drawer/Index.vue.d.ts

@@ -0,0 +1,77 @@
+declare var __VLS_1: {}, __VLS_10: {}, __VLS_12: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+} & {
+    content?: (props: typeof __VLS_10) => any;
+} & {
+    footer?: (props: typeof __VLS_12) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    direction: {
+        readonly type: () => "left" | "bottom" | "right";
+        readonly default: "bottom";
+        readonly options: readonly ["left", "bottom", "right"];
+    };
+    title: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    description: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    showFooter: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    show: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    direction: {
+        readonly type: () => "left" | "bottom" | "right";
+        readonly default: "bottom";
+        readonly options: readonly ["left", "bottom", "right"];
+    };
+    title: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    description: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    showFooter: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    show: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {
+    title: string;
+    direction: "left" | "right" | "bottom";
+    description: string;
+    showFooter: boolean;
+    show: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/drawer/props.d.ts

@@ -0,0 +1,23 @@
+export declare const props: {
+    readonly direction: {
+        readonly type: () => "left" | "bottom" | "right";
+        readonly default: "bottom";
+        readonly options: readonly ["left", "bottom", "right"];
+    };
+    readonly title: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly description: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly showFooter: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly show: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+};

package/components/drawer/stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from "@storybook/vue3-vite";
+import Drawer from "./Index.vue";
+declare const meta: Meta<typeof Drawer>;
+export default meta;
+type Story = StoryObj<typeof Drawer>;
+export declare const Default: Story;
+export declare const Left: Story;
+export declare const Bottom: Story;
+export declare const Right: Story;

package/components/input/Index.vue.d.ts

@@ -0,0 +1,54 @@
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    icon: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    placeholder: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    helpText: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    type: {
+        readonly type: StringConstructor;
+        readonly default: "text";
+        readonly options: readonly ["text", "password"];
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    icon: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    placeholder: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    helpText: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    type: {
+        readonly type: StringConstructor;
+        readonly default: "text";
+        readonly options: readonly ["text", "password"];
+    };
+    modelValue: {
+        type: import("vue").PropType<any>;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {
+    type: string;
+    icon: string;
+    placeholder: string;
+    helpText: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/components/input/props.d.ts

@@ -0,0 +1,19 @@
+export declare const props: {
+    readonly icon: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly placeholder: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly helpText: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly type: {
+        readonly type: StringConstructor;
+        readonly default: "text";
+        readonly options: readonly ["text", "password"];
+    };
+};

package/components/input/stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from "@storybook/vue3-vite";
+import Input from "./Index.vue";
+declare const meta: Meta<typeof Input>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Placeholder: Story;
+export declare const HelpText: Story;
+export declare const Prefilled: Story;

package/components/modal/Index.vue.d.ts

@@ -0,0 +1,29 @@
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    readonly show: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:show": (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly show: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{
+    "onUpdate:show"?: ((...args: any[]) => any) | undefined;
+}>, {
+    readonly show: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/modal/props.d.ts

@@ -0,0 +1,6 @@
+export declare const props: {
+    readonly show: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+};

package/components/modal/stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from "@storybook/vue3-vite";
+import Modal from "./Index.vue";
+declare const meta: Meta<typeof Modal>;
+export default meta;
+type Story = StoryObj<typeof Modal>;
+export declare const Default: Story;

package/components/popover/Index.vue.d.ts

@@ -0,0 +1,47 @@
+declare var __VLS_1: {}, __VLS_3: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+} & {
+    body?: (props: typeof __VLS_3) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    readonly position: {
+        readonly type: () => "top" | "bottom";
+        readonly default: "bottom";
+        readonly options: readonly ["top", "bottom"];
+    };
+    readonly bodyClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly contentClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly position: {
+        readonly type: () => "top" | "bottom";
+        readonly default: "bottom";
+        readonly options: readonly ["top", "bottom"];
+    };
+    readonly bodyClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly contentClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+}>> & Readonly<{}>, {
+    readonly position: "bottom" | "top";
+    readonly bodyClass: string;
+    readonly contentClass: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/popover/props.d.ts

@@ -0,0 +1,15 @@
+export declare const props: {
+    readonly position: {
+        readonly type: () => "top" | "bottom";
+        readonly default: "bottom";
+        readonly options: readonly ["top", "bottom"];
+    };
+    readonly bodyClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly contentClass: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+};

package/components/popover/stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from "@storybook/vue3-vite";
+import Popover from "./Index.vue";
+declare const meta: Meta<typeof Popover>;
+export default meta;
+type Story = StoryObj<typeof Popover>;
+export declare const Bottom: Story;
+export declare const Top: Story;

package/components/range-slider/Index.vue.d.ts

@@ -0,0 +1,28 @@
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    readonly showTooltip: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly value: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:value": (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly showTooltip: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly value: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+}>> & Readonly<{
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
+}>, {
+    readonly showTooltip: boolean;
+    readonly value: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/components/range-slider/props.d.ts

@@ -0,0 +1,10 @@
+export declare const props: {
+    readonly showTooltip: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly value: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+};

package/components/range-slider/stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from "@storybook/vue3-vite";
+import RangeSlider from "./Index.vue";
+declare const meta: Meta<typeof RangeSlider>;
+export default meta;
+type Story = StoryObj<typeof RangeSlider>;
+export declare const Default: Story;
+export declare const WithTooltip: Story;

package/components/select/Index.vue.d.ts

@@ -0,0 +1,58 @@
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    readonly modelValue: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly options: {
+        readonly type: () => string[];
+        readonly required: true;
+    };
+    readonly variant: {
+        readonly type: () => "outlined" | "text" | "ghost" | "solid";
+        readonly default: "solid";
+        readonly options: readonly ["outlined", "text", "ghost", "solid"];
+    };
+    readonly showFilter: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly isOpen: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (...args: any[]) => void;
+    "update:isOpen": (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly modelValue: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly options: {
+        readonly type: () => string[];
+        readonly required: true;
+    };
+    readonly variant: {
+        readonly type: () => "outlined" | "text" | "ghost" | "solid";
+        readonly default: "solid";
+        readonly options: readonly ["outlined", "text", "ghost", "solid"];
+    };
+    readonly showFilter: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly isOpen: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:isOpen"?: ((...args: any[]) => any) | undefined;
+}>, {
+    readonly variant: "text" | "outlined" | "ghost" | "solid";
+    readonly modelValue: string;
+    readonly isOpen: boolean;
+    readonly showFilter: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/components/select/props.d.ts

@@ -0,0 +1,23 @@
+export declare const props: {
+    readonly modelValue: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly options: {
+        readonly type: () => string[];
+        readonly required: true;
+    };
+    readonly variant: {
+        readonly type: () => "outlined" | "text" | "ghost" | "solid";
+        readonly default: "solid";
+        readonly options: readonly ["outlined", "text", "ghost", "solid"];
+    };
+    readonly showFilter: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly isOpen: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+};

package/components/select/stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from "@storybook/vue3-vite";
+import Select from "./Index.vue";
+declare const meta: Meta<typeof Select>;
+export default meta;
+type Story = StoryObj<typeof Select>;
+export declare const Default: Story;
+export declare const ShowFilter: Story;
+export declare const Solid: Story;
+export declare const Outlined: Story;
+export declare const Text: Story;
+export declare const Ghost: Story;

package/components/separator/Index.vue.d.ts

@@ -0,0 +1,44 @@
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    readonly direction: {
+        readonly type: () => "horizontal" | "vertical";
+        readonly default: "horizontal";
+        readonly options: readonly ["horizontal", "vertical"];
+    };
+    readonly color: {
+        readonly type: StringConstructor;
+        readonly default: "#16476A";
+    };
+    readonly label: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly icon: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly direction: {
+        readonly type: () => "horizontal" | "vertical";
+        readonly default: "horizontal";
+        readonly options: readonly ["horizontal", "vertical"];
+    };
+    readonly color: {
+        readonly type: StringConstructor;
+        readonly default: "#16476A";
+    };
+    readonly label: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly icon: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+}>> & Readonly<{}>, {
+    readonly label: string;
+    readonly icon: string;
+    readonly direction: "horizontal" | "vertical";
+    readonly color: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/components/separator/props.d.ts

@@ -0,0 +1,19 @@
+export declare const props: {
+    readonly direction: {
+        readonly type: () => "horizontal" | "vertical";
+        readonly default: "horizontal";
+        readonly options: readonly ["horizontal", "vertical"];
+    };
+    readonly color: {
+        readonly type: StringConstructor;
+        readonly default: "#16476A";
+    };
+    readonly label: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly icon: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+};

package/components/separator/stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from "@storybook/vue3-vite";
+import Separator from "./Index.vue";
+declare const meta: Meta<typeof Separator>;
+export default meta;
+type Story = StoryObj<typeof Separator>;
+export declare const Horizontal: Story;
+export declare const Vertical: Story;