Skip to content

Commit 055130c

Browse files
Merge pull request #19 from webdevnerdstuff/dev
Dev
2 parents dcba996 + 3d8b43d commit 055130c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

54 files changed

+3461
-2354
lines changed

.editorconfig

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ trim_trailing_whitespace = false
1414
[*.{yml,yaml}]
1515
indent_size = 2
1616

17-
[*.{js,ts,vue}]
17+
[*.{js,ts,mts,vue}]
1818
indent_size = 2
1919
indent_style = tab
2020

.eslintrc.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@ module.exports = {
1313
],
1414
ignorePatterns: [
1515
'.eslintrc.js',
16-
'vite.build.config.ts',
17-
'vite.config.ts',
16+
'vite.build.config.mts',
17+
'vite.config.mts',
1818
'*.bk.vue',
1919
],
2020
overrides: [

.npmrc

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
node-version=20.10.0

.nvmrc

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
20.10.0

CHANGELOG.md

+8
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,14 @@
11
# Change Log
22
All notable changes to the "vuetify-color-field" plugin will be documented in this file.
33

4+
## v1.1.0
5+
01-05-24
6+
[main] (@webdevnerdstuff)
7+
* Fix typescript issues
8+
* Reorganizing
9+
* Add vitest
10+
* Update node version to v20.10.0
11+
412
## v1.0.1
513
11-09-23
614
[main] (@webdevnerdstuff)

dist/plugin/VColorField.vue.d.ts

+41-37
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Props } from '../types';
1+
import { Props } from './types';
22
declare function toggleColorPicker(trigger?: string | Event): void;
33
declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
44
appendIcon: undefined;
@@ -8,6 +8,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
88
cardOffsetY: number;
99
cardPadding: number;
1010
cardProps: () => {};
11+
clearable: boolean;
1112
color: undefined;
1213
colorPickerProps: () => {};
1314
density: string;
@@ -31,18 +32,20 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
3132
readonly: boolean;
3233
readonlyInput: boolean;
3334
required: boolean;
35+
variant: string;
3436
}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
35-
"update:modelValue": (...args: any[]) => void;
3637
update: (...args: any[]) => void;
3738
"update:mode": (...args: any[]) => void;
38-
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
39+
"update:modelValue": (...args: any[]) => void;
40+
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
3941
appendIcon: undefined;
4042
appendInnerIcon: undefined;
4143
cardFieldWidth: boolean;
4244
cardOffsetX: number;
4345
cardOffsetY: number;
4446
cardPadding: number;
4547
cardProps: () => {};
48+
clearable: boolean;
4649
color: undefined;
4750
colorPickerProps: () => {};
4851
density: string;
@@ -66,58 +69,52 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
6669
readonly: boolean;
6770
readonlyInput: boolean;
6871
required: boolean;
72+
variant: string;
6973
}>>> & {
70-
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
71-
"onUpdate:mode"?: ((...args: any[]) => any) | undefined;
7274
onUpdate?: ((...args: any[]) => any) | undefined;
75+
"onUpdate:mode"?: ((...args: any[]) => any) | undefined;
76+
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
7377
}, {
7478
color: string;
75-
density: "default" | "comfortable" | "compact" | null;
7679
appendIcon: string | (string | [path: string, opacity: number])[] | import("vue").JSXComponent;
77-
prependIcon: string | (string | [path: string, opacity: number])[] | import("vue").JSXComponent;
7880
appendInnerIcon: string | (string | [path: string, opacity: number])[] | import("vue").JSXComponent;
7981
cardFieldWidth: boolean;
8082
cardOffsetX: string | number;
8183
cardOffsetY: string | number;
8284
cardPadding: string | number;
83-
cardProps: import('../types').VCardProps;
85+
cardProps: import('./types').VCardProps;
86+
clearable: boolean;
8487
colorPickerProps: Partial<{
8588
width: NonNullable<string | number>;
8689
style: globalThis.StyleValue;
8790
disabled: boolean;
8891
tag: string;
89-
mode: "rgb" | "rgba" | "hsl" | "hsla" | "hex" | "hexa";
92+
mode: "rgba" | "rgb" | "hsl" | "hsla" | "hex" | "hexa";
9093
rounded: string | number | boolean;
9194
dotSize: string | number;
92-
modes: readonly ("rgb" | "rgba" | "hsl" | "hsla" | "hex" | "hexa")[];
95+
modes: readonly ("rgba" | "rgb" | "hsl" | "hsla" | "hex" | "hexa")[];
9396
canvasHeight: string | number;
9497
hideCanvas: boolean;
9598
hideSliders: boolean;
9699
hideInputs: boolean;
97100
showSwatches: boolean;
98101
swatchesMaxHeight: string | number;
99102
}> & Omit<{
100-
readonly width: NonNullable<string | number>;
101-
readonly style: globalThis.StyleValue;
102-
readonly disabled: boolean;
103-
readonly tag: string;
104-
readonly mode: "rgb" | "rgba" | "hsl" | "hsla" | "hex" | "hexa";
105-
readonly dotSize: string | number;
106-
readonly modes: readonly ("rgb" | "rgba" | "hsl" | "hsla" | "hex" | "hexa")[];
107103
readonly canvasHeight: string | number;
104+
readonly dotSize: string | number;
108105
readonly hideCanvas: boolean;
109-
readonly hideSliders: boolean;
110106
readonly hideInputs: boolean;
107+
readonly hideSliders: boolean;
108+
readonly mode: "rgba" | "rgb" | "hsl" | "hsla" | "hex" | "hexa";
109+
readonly modes: readonly ("rgba" | "rgb" | "hsl" | "hsla" | "hex" | "hexa")[];
111110
readonly showSwatches: boolean;
112111
readonly swatchesMaxHeight: string | number;
113-
readonly border?: string | number | boolean | undefined;
112+
readonly tag: string;
113+
readonly style: globalThis.StyleValue;
114+
readonly width: NonNullable<string | number>;
115+
readonly disabled: boolean;
114116
readonly color?: string | undefined;
115-
readonly position?: "fixed" | "absolute" | "static" | "relative" | "sticky" | undefined;
116-
readonly class?: any;
117-
readonly elevation?: string | number | undefined;
118117
readonly theme?: string | undefined;
119-
readonly rounded?: string | number | boolean | undefined;
120-
readonly modelValue?: string | Record<string, unknown> | null | undefined;
121118
readonly swatches?: readonly (readonly (string | number | {
122119
readonly r: number;
123120
readonly g: number;
@@ -134,8 +131,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
134131
readonly l: number;
135132
readonly a?: number | undefined;
136133
})[])[] | undefined;
134+
readonly class?: any;
135+
readonly rounded?: string | number | boolean | undefined;
136+
readonly position?: "fixed" | "absolute" | "static" | "sticky" | "relative" | undefined;
137+
readonly elevation?: string | number | undefined;
138+
readonly border?: string | number | boolean | undefined;
139+
readonly modelValue?: string | Record<string, unknown> | null | undefined;
137140
"onUpdate:modelValue"?: ((color: any) => any) | undefined;
138-
"onUpdate:mode"?: ((mode: "rgb" | "rgba" | "hsl" | "hsla" | "hex" | "hexa") => any) | undefined;
141+
"onUpdate:mode"?: ((mode: "rgba" | "rgb" | "hsl" | "hsla" | "hex" | "hexa") => any) | undefined;
139142
} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{
140143
width: {
141144
type: globalThis.PropType<NonNullable<string | number>>;
@@ -144,7 +147,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
144147
border: (BooleanConstructor | StringConstructor | NumberConstructor)[];
145148
color: StringConstructor;
146149
position: {
147-
type: globalThis.PropType<"fixed" | "absolute" | "static" | "relative" | "sticky">;
150+
type: globalThis.PropType<"fixed" | "absolute" | "static" | "sticky" | "relative">;
148151
validator: (v: any) => boolean;
149152
};
150153
style: {
@@ -178,12 +181,12 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
178181
hideSliders: BooleanConstructor;
179182
hideInputs: BooleanConstructor;
180183
mode: {
181-
type: globalThis.PropType<"rgb" | "rgba" | "hsl" | "hsla" | "hex" | "hexa">;
184+
type: globalThis.PropType<"rgba" | "rgb" | "hsl" | "hsla" | "hex" | "hexa">;
182185
default: string;
183186
validator: (v: string) => boolean;
184187
};
185188
modes: {
186-
type: globalThis.PropType<readonly ("rgb" | "rgba" | "hsl" | "hsla" | "hex" | "hexa")[]>;
189+
type: globalThis.PropType<readonly ("rgba" | "rgb" | "hsl" | "hsla" | "hex" | "hexa")[]>;
187190
default: () => string[];
188191
validator: (v: any) => boolean;
189192
};
@@ -213,10 +216,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
213216
};
214217
}>> & {
215218
"onUpdate:modelValue"?: ((color: any) => any) | undefined;
216-
"onUpdate:mode"?: ((mode: "rgb" | "rgba" | "hsl" | "hsla" | "hex" | "hexa") => any) | undefined;
217-
}, "width" | "style" | "tag" | "rounded" | "canvasHeight" | "disabled" | "dotSize" | "hideCanvas" | "hideSliders" | "hideInputs" | "mode" | "modes" | "showSwatches" | "swatchesMaxHeight"> & {
218-
hideModeSwitch?: boolean | undefined;
219-
};
219+
"onUpdate:mode"?: ((mode: "rgba" | "rgb" | "hsl" | "hsla" | "hex" | "hexa") => any) | undefined;
220+
}, "canvasHeight" | "dotSize" | "hideCanvas" | "hideInputs" | "hideSliders" | "mode" | "modes" | "showSwatches" | "swatchesMaxHeight" | "tag" | "style" | "rounded" | "width" | "disabled">;
221+
density: "default" | "comfortable" | "compact" | null;
220222
hint: string;
221223
iconHoverColor: string | boolean;
222224
iconSize: string | number;
@@ -226,16 +228,18 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
226228
open: string;
227229
persistentHint: boolean;
228230
persistentPlaceholder: boolean;
231+
pip: boolean;
232+
pipBorder: string | null;
233+
pipBorderRadius: string;
234+
pipIcon: boolean | (string | (string | [path: string, opacity: number])[] | import("vue").JSXComponent) | null;
235+
pipSlot: string;
229236
placeholder: string;
237+
prependIcon: string | (string | [path: string, opacity: number])[] | import("vue").JSXComponent;
230238
prependInnerIcon: boolean | (string | (string | [path: string, opacity: number])[] | import("vue").JSXComponent) | null;
231239
readonly: boolean | null;
232240
readonlyInput: boolean | null;
233241
required: boolean;
234-
pipIcon: boolean | (string | (string | [path: string, opacity: number])[] | import("vue").JSXComponent) | null;
235-
pipBorder: string | null;
236-
pipBorderRadius: string;
237-
pip: boolean;
238-
pipSlot: string;
242+
variant: "filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled";
239243
}, {}>, Partial<Record<NonNullable<string | number>, (_: any) => any>> & {
240244
prepend?(_: {
241245
toggleColorPicker: typeof toggleColorPicker;

dist/plugin/components/ColorPickerIcon.vue.d.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import { ColorPickerIconProps } from '../../types';
1+
import { ColorPickerIconProps } from '../types';
22
declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ColorPickerIconProps>, {
33
icon: string;
44
}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
55
click: (...args: any[]) => void;
6-
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ColorPickerIconProps>, {
6+
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ColorPickerIconProps>, {
77
icon: string;
88
}>>> & {
99
onClick?: ((...args: any[]) => any) | undefined;

dist/plugin/components/PipComponent.vue.d.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import type { PipComponentProps } from '../../types';
1+
import type { PipComponentProps } from '../types';
22
declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PipComponentProps>, {}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
33
click: (...args: any[]) => void;
4-
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PipComponentProps>, {}>>> & {
4+
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PipComponentProps>, {}>>> & {
55
onClick?: ((...args: any[]) => any) | undefined;
66
}, {}, {}>;
77
export default _default;

dist/plugin/composables/classes.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { UseCardClasses, UseHintClasses, UsePipClasses, UseTextFieldClasses } from '../../types';
1+
import { UseCardClasses, UseHintClasses, UsePipClasses, UseTextFieldClasses } from '../types';
22
export declare const usePipClasses: UsePipClasses;
33
export declare const useTextFieldClasses: UseTextFieldClasses;
44
export declare const useHintClasses: UseHintClasses;

dist/plugin/composables/helpers.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { UseConvertToUnit } from '../../types';
1+
import { UseConvertToUnit } from '../types';
22
/**
33
* Converts a string to a number with a unit.
44
*/

dist/plugin/composables/icons.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
1-
import { UseGetIcon } from '../../types';
1+
import { UseGetIcon } from '../types';
22
export declare const useGetIcon: UseGetIcon;

dist/plugin/composables/styles.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
1-
import { UsePipStyle } from '../../types';
1+
import { UsePipStyle } from '../types';
22
export declare const usePipStyles: UsePipStyle;

dist/plugin/index.d.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1+
import type { App } from 'vue';
2+
import type { GlobalOptions } from './types';
13
import VColorField from './VColorField.vue';
2-
export { VColorField };
4+
export declare const globalOptions: unique symbol;
5+
export declare function createVColorField(options?: GlobalOptions): {
6+
install: (app: App) => void;
7+
};
38
export default VColorField;
9+
export { VColorField, };

dist/types/index.d.ts renamed to dist/plugin/types/index.d.ts

+14-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
import { CSSProperties } from 'vue';
22
import type { IconOptions } from 'vuetify';
3+
import VColorField from '../VColorField.vue';
34
import type { VCard, VColorPicker, VIcon, VTextField } from 'vuetify/components';
5+
export * from '../index';
46
export type Mode = VColorPicker['$props']['mode'];
57
export interface KeyStringAny<T = any> {
68
[key: string]: T;
@@ -25,10 +27,9 @@ export interface Props extends PipProps {
2527
cardOffsetY?: number | string;
2628
cardPadding?: number | string;
2729
cardProps?: VCardProps;
30+
clearable?: VTextField['$props']['clearable'];
2831
color?: VTextField['$props']['color'];
29-
colorPickerProps?: VColorPicker['$props'] & {
30-
hideModeSwitch?: boolean;
31-
};
32+
colorPickerProps?: VColorPicker['$props'];
3233
density?: VTextField['$props']['density'];
3334
hint?: string;
3435
iconHoverColor?: VIcon['$props']['color'] | boolean;
@@ -56,6 +57,9 @@ export interface Props extends PipProps {
5657
showSwatches?: VColorPicker['$props']['showSwatches'];
5758
swatches?: VColorPicker['$props']['swatches'];
5859
swatchesMaxHeight?: VColorPicker['$props']['swatchesMaxHeight'];
60+
variant?: VTextField['$props']['variant'];
61+
}
62+
export interface GlobalOptions extends Props {
5963
}
6064
export interface PipComponentProps extends PipProps {
6165
modelValue?: any;
@@ -129,3 +133,10 @@ export interface CardStylesObject extends CSSProperties {
129133
top?: string | number;
130134
width?: string | number;
131135
}
136+
declare module "vue" {
137+
interface ComponentCustomProperties {
138+
}
139+
interface GlobalComponents {
140+
VColorField: typeof VColorField;
141+
}
142+
}

dist/scss/main.scss

+1-2
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,12 @@
1212

1313
&--card {
1414
display: none;
15-
position: absolute;
15+
position: absolute !important;
1616
z-index: 999999;
1717

1818
.v-color-picker {
1919
width: 100% !important;
2020

21-
2221
&-canvas {
2322
canvas {
2423
width: 100%;

0 commit comments

Comments
 (0)