@dynamicforms/vuetify-inputs 0.7.13 → 0.8.1

package/dist/index.d.ts

@@ -20,7 +20,6 @@ import { FormatPart } from 'date-fns';
 import { FormatRelativeFn } from 'date-fns';
 import { GlobalComponents } from 'vue';
 import { GlobalDirectives } from 'vue';
-import { IField } from '@dynamicforms/vue-forms';
 import { IFieldConstructorParams } from '@dynamicforms/vue-forms';
 import { Locale } from 'date-fns';
 import { LocaleDayPeriod } from 'date-fns';
@@ -180,7 +179,6 @@ declare type __VLS_WithTemplateSlots_2<T, S> = T & {
 };
 
 export declare class Action extends Action_2<ActionBreakpointOptions> {
-    static create<T extends ActionBreakpointOptions = ActionBreakpointOptions>(params?: Partial<IFieldConstructorParams<T>>): Action;
     getBreakpointValue(breakpoint: Ref<BreakpointNames>): ComputedRef<ActionRenderOptions>;
     /** @see ActionRenderOptions.name */
     get name(): string | undefined;
@@ -200,9 +198,9 @@ export declare class Action extends Action_2<ActionBreakpointOptions> {
     get defaultReject(): boolean | undefined;
     /** @see ActionRenderOptions.passthroughAttrs */
     get passthroughAttrs(): Record<string, any> | undefined;
-    static closeAction(data?: Partial<IField<ActionBreakpointOptions>>): Action;
-    static yesAction(data?: Partial<IField<ActionBreakpointOptions>>): Action;
-    static noAction(data?: Partial<IField<ActionBreakpointOptions>>): Action;
+    static closeAction(data?: Partial<IFieldConstructorParams<ActionBreakpointOptions>>): Action;
+    static yesAction(data?: Partial<IFieldConstructorParams<ActionBreakpointOptions>>): Action;
+    static noAction(data?: Partial<IFieldConstructorParams<ActionBreakpointOptions>>): Action;
 }
 
 export declare type ActionBreakpointOptions = BreakpointsJSON<ActionRenderOptions>;
@@ -261,7 +259,7 @@ export declare interface BaseEmits<T = any> {
 }
 
 export declare interface BaseProps<T = any> {
-    control?: default_2.IField<T>;
+    control?: default_2.FieldBase<T>;
     modelValue?: T;
     label?: string | Label | MdString;
     errors?: string[];
@@ -355,15 +353,6 @@ export declare const DateTimeLocaleConfig: {
     setDateTimeLocale(locale: Locale | Ref<Locale>): void;
 };
 
-declare const _default: DefineComponent<Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<Props> & Readonly<{}>, {
-errors: string | ValidationError[];
-message: string | ValidationError[];
-errorClasses: ClassTypes;
-messageClasses: ClassTypes;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
-export { _default as DFInputHint }
-export { _default as DfInputHint }
-
 export declare const defaultBaseProps: {
     enabled: undefined;
     clearable: boolean;
@@ -464,7 +453,7 @@ precision: number | null;
 step: number;
 min: number;
 max: number;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
 export declare namespace DfInputComponentProps {
     export {
@@ -488,13 +477,20 @@ export declare namespace DfInputComponents {
         DfDateTime,
         DfFile,
         DfInput,
-        _default as DFInputHint,
+        DfInputHint,
         DfRtfEditor,
         DfSelect,
         DfTextArea
     }
 }
 
+export declare const DfInputHint: DefineComponent<Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<Props> & Readonly<{}>, {
+errors: string | ValidationError[];
+message: string | ValidationError[];
+errorClasses: ClassTypes;
+messageClasses: ClassTypes;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+
 declare interface DfInputProps extends BaseProps {
     inputType?: 'text' | 'password' | 'email' | 'url' | 'number';
     precision?: number | null;
@@ -512,8 +508,8 @@ export declare const DfRtfEditor: DefineComponent<DfRtfEditorProps, {}, {}, {},
 "onUpdate:modelValue"?: ((value: any) => any) | undefined;
 "onClick:clear"?: (() => any) | undefined;
 }>, {
-enabled: boolean;
 minHeight: string;
+enabled: boolean;
 clearable: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {
 $editor: CreateComponentPublicInstanceWithMixins<Readonly<{
@@ -579,7 +575,7 @@ enabled: boolean;
 clearable: boolean;
 rows: number;
 maxRows: number;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
 declare interface DfTextAreaProps extends BaseProps {
     rows?: number;
@@ -655,6 +651,13 @@ export declare abstract class ResponsiveRenderOptions<T extends Record<string, a
     protected readonly _value: BreakpointsJSON<T>;
     constructor(data?: BreakpointsJSON<T>);
     getOptionsForBreakpoint(breakpoint: BreakpointNames): T;
+    /**
+     * Normalizes one breakpoint's options. The merge reads `null` and `undefined` as "this breakpoint says
+     * nothing about that field", so a field the breakpoint does not state has to come back as `undefined` rather
+     * than as an empty value - an empty array or string returned here reads as a breakpoint deliberately emptying
+     * what it inherited. The value returned for `defaultIfEmpty` carries every field the class merges, since the
+     * field set is taken from it.
+     */
     protected abstract cleanBreakpoint(bp?: T, defaultIfEmpty?: boolean): T | null;
 }
 
@@ -704,6 +707,11 @@ export declare function useInputBase<T = any>(props: BaseProps<T>, emit: BaseEmi
     errors: ComputedRef<default_2.ValidationError[]>;
     showErrors: ComputedRef<default_2.ValidationError[] | undefined>;
     visibility: ComputedRef<default_2.DisplayMode>;
+    isRendered: ComputedRef<boolean>;
+    visibilityClass: ComputedRef<    {
+    'd-none': boolean;
+    invisible: boolean;
+    }>;
     label: ComputedRef<Label>;
     touched: Ref<boolean, boolean>;
     density: FieldDensity;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dynamicforms/vuetify-inputs",
   "private": false,
-  "version": "0.7.13",
+  "version": "0.8.1",
   "type": "module",
   "description": "Vuetify input components with guaranteed visual consistency across all form fields — unified density/variant system, globally configurable, with inline mode for table cells. Built for @dynamicforms/vue-forms.",
   "author": "Jure Erznožnik",
@@ -24,6 +24,7 @@
     "build": "vite build",
     "test": "vitest run --coverage",
     "lint": "eslint src --fix && vue-tsc --noEmit",
+    "lint:ci": "eslint src && vue-tsc --noEmit",
     "docs:dev": "npm run docs:dev -w docs",
     "docs:build": "npm run docs:build -w docs",
     "docs:preview": "npm run docs:preview -w docs"
@@ -51,7 +52,7 @@
   },
   "peerDependencies": {
     "@ckeditor/ckeditor5-vue": "^7.0.0",
-    "@dynamicforms/vue-forms": "^0.5.0",
+    "@dynamicforms/vue-forms": "^0.6.0",
     "@mdi/font": "^7.4.47",
     "ckeditor5": "^43.0.0",
     "date-fns": "^4.1.0",

package/readme.md

@@ -91,9 +91,9 @@ import { DfSelect, DfTextArea, DfFile } from '@dynamicforms/vuetify-inputs';
 
 // Create a form with fields
 const form = new Group({
-  country: Field.create({ value: null }),
-  description: Field.create({ value: '' }),
-  document: Field.create({ value: null })
+  country: new Field({ value: null }),
+  description: new Field({ value: '' }),
+  document: new Field({ value: null })
 });
 
 // Define options for the select field
@@ -132,6 +132,7 @@ Detailed documentation is available at [https://docs.velis.si/dynamicforms/vueti
 - **df-date-time**: A date and time selection component with configurable format and type.
 - **df-file**: A file upload component with progress indication
 - **df-input**: A general value input.
+- **df-input-hint**: Renders a field's or a group's errors, falling back to its hint text.
 - **df-rtf-editor**: A RTF editor input.
 - **df-select**: A selection component supporting static or dynamic options, multiple selection, and tagging
 - **df-text-area**: A textarea component with configurable rows and validation