@naptics/vue-collection 0.2.15 → 0.3.1

package/components/NTextArea.d.ts

@@ -3,7 +3,7 @@ export declare const nTextAreaProps: {
     readonly disableValidation: BooleanConstructor;
     readonly optional: BooleanConstructor;
     readonly rules: {
-        readonly type: PropType<import("../utils/validation").ValidationRule | import("../utils/validation").ValidationRule[]>;
+        readonly type: PropType<import("../utils/validation").ValidationRule[] | import("../utils/validation").ValidationRule>;
         readonly default: () => never[];
     };
     readonly form: PropType<import("./ValidatedForm").ValidatedForm>;
@@ -88,184 +88,5 @@ export type NTextAreaExposed = {
      */
     focus(): void;
 };
-declare const Component: import("vue").DefineComponent<{
-    readonly disableValidation: BooleanConstructor;
-    readonly optional: BooleanConstructor;
-    readonly rules: {
-        readonly type: PropType<import("../utils/validation").ValidationRule | import("../utils/validation").ValidationRule[]>;
-        readonly default: () => never[];
-    };
-    readonly form: PropType<import("./ValidatedForm").ValidatedForm>;
-    readonly error: BooleanConstructor;
-    readonly errorMessage: StringConstructor;
-    readonly hideErrorMessage: BooleanConstructor;
-    readonly disableBlurValidation: BooleanConstructor;
-    readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => JSX.Element>;
-    readonly tooltipHide: BooleanConstructor;
-    readonly tooltipShow: BooleanConstructor;
-    readonly tooltipPlacement: {
-        readonly type: PropType<import("./NTooltip").TooltipPlacement>;
-        readonly default: "auto";
-    };
-    readonly tooltipMaxWidth: {
-        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        readonly default: "max-w-xs";
-    };
-    readonly tooltipWrapperClass: StringConstructor;
-    readonly tooltipContentClass: StringConstructor;
-    readonly tooltipArrowClass: StringConstructor;
-    /**
-     * The name of the text area. Is displayed as a label above the text area.
-     */
-    readonly name: StringConstructor;
-    /**
-     * The placeholder of the text area.
-     */
-    readonly placeholder: StringConstructor;
-    /**
-     * The html autocomplete attribute of the text area.
-     */
-    readonly autocomplete: {
-        readonly type: StringConstructor;
-        readonly default: "off";
-    };
-    /**
-     * If set to `true`, the text area is resizable in y-direction.
-     */
-    readonly resizable: {
-        readonly type: BooleanConstructor;
-        readonly default: true;
-    };
-    /**
-     * The initial height of the text area in terms of
-     * how many text rows fit inside the text area.
-     * The height can be change if {@link nTextAreaProps.resizable} is `true`
-     */
-    readonly rows: NumberConstructor;
-    /**
-     * The maximum length of the input string. Entering longer strings are simply
-     * prevented, but no error message is shown to the user.
-     */
-    readonly maxLength: NumberConstructor;
-    /**
-     * If set to `true` the text area is disabled and no interaction is possible.
-     */
-    readonly disabled: BooleanConstructor;
-    /**
-     * If set to `true` the text area's label is hidden.
-     */
-    readonly hideLabel: BooleanConstructor;
-    /**
-     * Adds the classes directly to the input (e.g. for shadow).
-     */
-    readonly inputClass: StringConstructor;
-    /**
-     * This is called when the text area reveices focus.
-     */
-    readonly onFocus: PropType<() => void>;
-    /**
-     * This is called when the text area looses focus.
-     */
-    readonly onBlur: PropType<() => void>;
-    readonly value: PropType<string>;
-    readonly onUpdateValue: PropType<(newValue: string) => void>;
-}, import("vue").RenderFunction, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    readonly disableValidation: BooleanConstructor;
-    readonly optional: BooleanConstructor;
-    readonly rules: {
-        readonly type: PropType<import("../utils/validation").ValidationRule | import("../utils/validation").ValidationRule[]>;
-        readonly default: () => never[];
-    };
-    readonly form: PropType<import("./ValidatedForm").ValidatedForm>;
-    readonly error: BooleanConstructor;
-    readonly errorMessage: StringConstructor;
-    readonly hideErrorMessage: BooleanConstructor;
-    readonly disableBlurValidation: BooleanConstructor;
-    readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => JSX.Element>;
-    readonly tooltipHide: BooleanConstructor;
-    readonly tooltipShow: BooleanConstructor;
-    readonly tooltipPlacement: {
-        readonly type: PropType<import("./NTooltip").TooltipPlacement>;
-        readonly default: "auto";
-    };
-    readonly tooltipMaxWidth: {
-        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        readonly default: "max-w-xs";
-    };
-    readonly tooltipWrapperClass: StringConstructor;
-    readonly tooltipContentClass: StringConstructor;
-    readonly tooltipArrowClass: StringConstructor;
-    /**
-     * The name of the text area. Is displayed as a label above the text area.
-     */
-    readonly name: StringConstructor;
-    /**
-     * The placeholder of the text area.
-     */
-    readonly placeholder: StringConstructor;
-    /**
-     * The html autocomplete attribute of the text area.
-     */
-    readonly autocomplete: {
-        readonly type: StringConstructor;
-        readonly default: "off";
-    };
-    /**
-     * If set to `true`, the text area is resizable in y-direction.
-     */
-    readonly resizable: {
-        readonly type: BooleanConstructor;
-        readonly default: true;
-    };
-    /**
-     * The initial height of the text area in terms of
-     * how many text rows fit inside the text area.
-     * The height can be change if {@link nTextAreaProps.resizable} is `true`
-     */
-    readonly rows: NumberConstructor;
-    /**
-     * The maximum length of the input string. Entering longer strings are simply
-     * prevented, but no error message is shown to the user.
-     */
-    readonly maxLength: NumberConstructor;
-    /**
-     * If set to `true` the text area is disabled and no interaction is possible.
-     */
-    readonly disabled: BooleanConstructor;
-    /**
-     * If set to `true` the text area's label is hidden.
-     */
-    readonly hideLabel: BooleanConstructor;
-    /**
-     * Adds the classes directly to the input (e.g. for shadow).
-     */
-    readonly inputClass: StringConstructor;
-    /**
-     * This is called when the text area reveices focus.
-     */
-    readonly onFocus: PropType<() => void>;
-    /**
-     * This is called when the text area looses focus.
-     */
-    readonly onBlur: PropType<() => void>;
-    readonly value: PropType<string>;
-    readonly onUpdateValue: PropType<(newValue: string) => void>;
-}>> & {}, {
-    readonly tooltipHide: boolean;
-    readonly tooltipShow: boolean;
-    readonly tooltipPlacement: import("./NTooltip").TooltipPlacement;
-    readonly tooltipMaxWidth: import("../utils/tailwind").TWMaxWidth;
-    readonly disabled: boolean;
-    readonly error: boolean;
-    readonly autocomplete: string;
-    readonly hideLabel: boolean;
-    readonly disableValidation: boolean;
-    readonly optional: boolean;
-    readonly rules: import("../utils/validation").ValidationRule | import("../utils/validation").ValidationRule[];
-    readonly hideErrorMessage: boolean;
-    readonly disableBlurValidation: boolean;
-    readonly resizable: boolean;
-}>;
+declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
 export { Component as NTextArea, Component as default };

package/components/NTextArea.js

@@ -1,4 +1,4 @@
-import { withDirectives as _withDirectives, vShow as _vShow, createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
+import { mergeProps as _mergeProps, createVNode as _createVNode, vShow as _vShow, withDirectives as _withDirectives } from "vue";
 import { createComponent } from '../utils/component';
 import { ref } from 'vue';
 import { ExclamationCircleIcon } from '@heroicons/vue/24/solid';

package/components/NTooltip.d.ts

@@ -131,110 +131,6 @@ export declare function mapTooltipProps(props: ExtractedProps<typeof nToolTipPro
  *      <NButton />
  * </NTooltip>
  */
-declare const Component: import("vue").DefineComponent<{
-    /**
-     * The text content of the tooltip.
-     */
-    readonly text: StringConstructor;
-    /**
-     * A slot to replace the content of the tooltip. This will override the `text` prop.
-     */
-    readonly content: PropType<() => JSX.Element>;
-    /**
-     * If set to `true` the tooltip is shown constantly.
-     */
-    readonly show: BooleanConstructor;
-    /**
-     * If set to `true` the tooltip is hidden constantly.
-     */
-    readonly hide: BooleanConstructor;
-    /**
-     * If set to `true` the `block` class is applied to the tooltip.
-     * This should be set if the content in the default slot is also block.
-     */
-    readonly block: BooleanConstructor;
-    /**
-     * The placement of the tooltip.
-     */
-    readonly placement: {
-        readonly type: PropType<TooltipPlacement>;
-        readonly default: "auto";
-    };
-    /**
-     * The maximum width of the tooltip.
-     */
-    readonly maxWidth: {
-        readonly type: PropType<TWMaxWidth>;
-        readonly default: "max-w-xs";
-    };
-    /**
-     * Adds the classes to the (invisible) wrapper element.
-     */
-    readonly wrapperClass: StringConstructor;
-    /**
-     * Adds the classes to the container of the tooltips content.
-     */
-    readonly contentClass: StringConstructor;
-    /**
-     * Adds the classes to the tooltip arrow. Make sure to use `before:` classes
-     * to target the arrow (which is the before element).
-     */
-    readonly arrowClass: StringConstructor;
-}, import("vue").RenderFunction, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    /**
-     * The text content of the tooltip.
-     */
-    readonly text: StringConstructor;
-    /**
-     * A slot to replace the content of the tooltip. This will override the `text` prop.
-     */
-    readonly content: PropType<() => JSX.Element>;
-    /**
-     * If set to `true` the tooltip is shown constantly.
-     */
-    readonly show: BooleanConstructor;
-    /**
-     * If set to `true` the tooltip is hidden constantly.
-     */
-    readonly hide: BooleanConstructor;
-    /**
-     * If set to `true` the `block` class is applied to the tooltip.
-     * This should be set if the content in the default slot is also block.
-     */
-    readonly block: BooleanConstructor;
-    /**
-     * The placement of the tooltip.
-     */
-    readonly placement: {
-        readonly type: PropType<TooltipPlacement>;
-        readonly default: "auto";
-    };
-    /**
-     * The maximum width of the tooltip.
-     */
-    readonly maxWidth: {
-        readonly type: PropType<TWMaxWidth>;
-        readonly default: "max-w-xs";
-    };
-    /**
-     * Adds the classes to the (invisible) wrapper element.
-     */
-    readonly wrapperClass: StringConstructor;
-    /**
-     * Adds the classes to the container of the tooltips content.
-     */
-    readonly contentClass: StringConstructor;
-    /**
-     * Adds the classes to the tooltip arrow. Make sure to use `before:` classes
-     * to target the arrow (which is the before element).
-     */
-    readonly arrowClass: StringConstructor;
-}>> & {}, {
-    readonly show: boolean;
-    readonly hide: boolean;
-    readonly block: boolean;
-    readonly placement: TooltipPlacement;
-    readonly maxWidth: TWMaxWidth;
-}>;
+declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
 export { Component as NTooltip, Component as default };
 export type TooltipPlacement = 'auto' | 'auto-start' | 'auto-end' | 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'right' | 'right-start' | 'right-end' | 'left' | 'left-start' | 'left-end';

package/components/NTooltip.js

@@ -1,4 +1,4 @@
-import { withDirectives as _withDirectives, vShow as _vShow, Fragment as _Fragment, createVNode as _createVNode } from "vue";
+import { createVNode as _createVNode, Fragment as _Fragment, vShow as _vShow, withDirectives as _withDirectives } from "vue";
 import { createComponent } from '../utils/component';
 import { uniqueId } from '../utils/utils';
 import { computed, onMounted, ref, watch, onUnmounted, Transition } from 'vue';

package/components/NValInput.d.ts

@@ -19,7 +19,7 @@ export declare const validationProps: {
      * If `optional` is set to false, the rule {@link required} will be checked first.
      */
     readonly rules: {
-        readonly type: PropType<ValidationRule | ValidationRule[]>;
+        readonly type: PropType<ValidationRule[] | ValidationRule>;
         readonly default: () => never[];
     };
     /**
@@ -66,7 +66,7 @@ export declare const nValInputProps: {
      * If `optional` is set to false, the rule {@link required} will be checked first.
      */
     readonly rules: {
-        readonly type: PropType<ValidationRule | ValidationRule[]>;
+        readonly type: PropType<ValidationRule[] | ValidationRule>;
         readonly default: () => never[];
     };
     /**
@@ -92,7 +92,10 @@ export declare const nValInputProps: {
      */
     readonly disableBlurValidation: BooleanConstructor;
     readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => JSX.Element>;
+    readonly tooltipContent: PropType<() => JSX.Element /**
+     * If set to `true` this input is always valid when its value is empty.
+     * If set to `false` the input receives the {@link required} rule. Default is `false`.
+     */>;
     readonly tooltipHide: BooleanConstructor;
     readonly tooltipShow: BooleanConstructor;
     readonly tooltipPlacement: {
@@ -148,183 +151,5 @@ export type NValInputExposed = {
 /**
  * The `NValInput` is a `NInput` with custom validation.
  */
-declare const Component: import("vue").DefineComponent<{
-    /**
-     * A slot to replace the input.
-     */
-    readonly input: PropType<(props: InputSlotProps) => JSX.Element>;
-    /**
-     * If set to `true` this inputs validation will always succeed and all validation
-     * rules are ignored. Default is `false`.
-     */
-    readonly disableValidation: BooleanConstructor;
-    /**
-     * If set to `true` this input is always valid when its value is empty.
-     * If set to `false` the input receives the {@link required} rule. Default is `false`.
-     */
-    readonly optional: BooleanConstructor;
-    /**
-     * The rules which this input is checked with.
-     * The rules are checked sequentially and the error of the first failed rule is displayed.
-     * If `optional` is set to false, the rule {@link required} will be checked first.
-     */
-    readonly rules: {
-        readonly type: PropType<ValidationRule | ValidationRule[]>;
-        readonly default: () => never[];
-    };
-    /**
-     * The form, which this input will be added to.
-     * On initialization, this input will call {@link ValidatedForm.addInput} passing itself to the form.
-     */
-    readonly form: PropType<ValidatedForm>;
-    /**
-     * Overrides the internal error state. If set to true, it will always display an error.
-     */
-    readonly error: BooleanConstructor;
-    /**
-     * Overrides the internal error message. If set, this message is always displayed.
-     */
-    readonly errorMessage: StringConstructor;
-    /**
-     * If set to `true` the error message is not shown.
-     * However, the input is still marked red if it is in an error state.
-     */
-    readonly hideErrorMessage: BooleanConstructor;
-    /**
-     * Disables the validation on blur. Should only be used in special occasions.
-     */
-    readonly disableBlurValidation: BooleanConstructor;
-    readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => JSX.Element>;
-    readonly tooltipHide: BooleanConstructor;
-    readonly tooltipShow: BooleanConstructor;
-    readonly tooltipPlacement: {
-        readonly type: PropType<import("./NTooltip").TooltipPlacement>;
-        readonly default: "auto";
-    };
-    readonly tooltipMaxWidth: {
-        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        readonly default: "max-w-xs";
-    };
-    readonly tooltipWrapperClass: StringConstructor;
-    readonly tooltipContentClass: StringConstructor;
-    readonly tooltipArrowClass: StringConstructor;
-    readonly name: StringConstructor;
-    readonly placeholder: StringConstructor;
-    readonly autocomplete: {
-        readonly type: StringConstructor;
-        readonly default: "off";
-    };
-    readonly type: {
-        readonly type: StringConstructor;
-        readonly default: "text";
-    };
-    readonly max: StringConstructor;
-    readonly min: StringConstructor;
-    readonly disabled: BooleanConstructor;
-    readonly small: BooleanConstructor;
-    readonly hideLabel: BooleanConstructor;
-    readonly inputClass: StringConstructor;
-    readonly onFocus: PropType<() => void>;
-    readonly onBlur: PropType<() => void>;
-    readonly value: PropType<string>;
-    readonly onUpdateValue: PropType<(newValue: string) => void>;
-}, import("vue").RenderFunction, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    /**
-     * A slot to replace the input.
-     */
-    readonly input: PropType<(props: InputSlotProps) => JSX.Element>;
-    /**
-     * If set to `true` this inputs validation will always succeed and all validation
-     * rules are ignored. Default is `false`.
-     */
-    readonly disableValidation: BooleanConstructor;
-    /**
-     * If set to `true` this input is always valid when its value is empty.
-     * If set to `false` the input receives the {@link required} rule. Default is `false`.
-     */
-    readonly optional: BooleanConstructor;
-    /**
-     * The rules which this input is checked with.
-     * The rules are checked sequentially and the error of the first failed rule is displayed.
-     * If `optional` is set to false, the rule {@link required} will be checked first.
-     */
-    readonly rules: {
-        readonly type: PropType<ValidationRule | ValidationRule[]>;
-        readonly default: () => never[];
-    };
-    /**
-     * The form, which this input will be added to.
-     * On initialization, this input will call {@link ValidatedForm.addInput} passing itself to the form.
-     */
-    readonly form: PropType<ValidatedForm>;
-    /**
-     * Overrides the internal error state. If set to true, it will always display an error.
-     */
-    readonly error: BooleanConstructor;
-    /**
-     * Overrides the internal error message. If set, this message is always displayed.
-     */
-    readonly errorMessage: StringConstructor;
-    /**
-     * If set to `true` the error message is not shown.
-     * However, the input is still marked red if it is in an error state.
-     */
-    readonly hideErrorMessage: BooleanConstructor;
-    /**
-     * Disables the validation on blur. Should only be used in special occasions.
-     */
-    readonly disableBlurValidation: BooleanConstructor;
-    readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => JSX.Element>;
-    readonly tooltipHide: BooleanConstructor;
-    readonly tooltipShow: BooleanConstructor;
-    readonly tooltipPlacement: {
-        readonly type: PropType<import("./NTooltip").TooltipPlacement>;
-        readonly default: "auto";
-    };
-    readonly tooltipMaxWidth: {
-        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        readonly default: "max-w-xs";
-    };
-    readonly tooltipWrapperClass: StringConstructor;
-    readonly tooltipContentClass: StringConstructor;
-    readonly tooltipArrowClass: StringConstructor;
-    readonly name: StringConstructor;
-    readonly placeholder: StringConstructor;
-    readonly autocomplete: {
-        readonly type: StringConstructor;
-        readonly default: "off";
-    };
-    readonly type: {
-        readonly type: StringConstructor;
-        readonly default: "text";
-    };
-    readonly max: StringConstructor;
-    readonly min: StringConstructor;
-    readonly disabled: BooleanConstructor;
-    readonly small: BooleanConstructor;
-    readonly hideLabel: BooleanConstructor;
-    readonly inputClass: StringConstructor;
-    readonly onFocus: PropType<() => void>;
-    readonly onBlur: PropType<() => void>;
-    readonly value: PropType<string>;
-    readonly onUpdateValue: PropType<(newValue: string) => void>;
-}>> & {}, {
-    readonly small: boolean;
-    readonly type: string;
-    readonly tooltipHide: boolean;
-    readonly tooltipShow: boolean;
-    readonly tooltipPlacement: import("./NTooltip").TooltipPlacement;
-    readonly tooltipMaxWidth: import("../utils/tailwind").TWMaxWidth;
-    readonly disabled: boolean;
-    readonly error: boolean;
-    readonly autocomplete: string;
-    readonly hideLabel: boolean;
-    readonly disableValidation: boolean;
-    readonly optional: boolean;
-    readonly rules: ValidationRule | ValidationRule[];
-    readonly hideErrorMessage: boolean;
-    readonly disableBlurValidation: boolean;
-}>;
+declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
 export { Component as NValInput, Component as default };

package/components/NValInput.js

@@ -1,4 +1,4 @@
-import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
+import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
 import { createComponentWithSlots } from '../utils/component';
 import { computed, onMounted, onUnmounted } from 'vue';
 import { ref, reactive, watch } from 'vue';

package/env.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="vite/client" />
+
+import type { VNode } from 'vue'
+
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            [elem: string]: any
+        }
+        type Element = VNode
+    }
+}
+
+export {}

package/eslint.config.cjs

@@ -0,0 +1,29 @@
+const pluginVue = require('eslint-plugin-vue')
+const { defineConfigWithVueTs, vueTsConfigs } = require('@vue/eslint-config-typescript')
+const js = require('@eslint/js')
+const prettierConfig = require('@vue/eslint-config-prettier')
+
+require('@rushstack/eslint-patch/modern-module-resolution')
+
+module.exports = defineConfigWithVueTs(
+    {
+        ignores: ['node_modules/**', 'dist/**', 'dist-ssr/**', 'lib/**', 'coverage/**', 'scripts/*.js'],
+    },
+    js.configs.recommended,
+    pluginVue.configs['flat/essential'],
+    vueTsConfigs.recommended,
+    prettierConfig,
+    {
+        files: ['**/*.config.js', '**/*.config.cjs'],
+        languageOptions: {
+            globals: {
+                require: 'readonly',
+                module: 'readonly',
+                __dirname: 'readonly',
+            },
+        },
+        rules: {
+            '@typescript-eslint/no-require-imports': 'off',
+        },
+    }
+)

package/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <link rel="icon" href="/favicon.ico" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>Vue Collection</title>
+    </head>
+    <body>
+        <div id="app"></div>
+        <script type="module" src="/src/demo/main.ts"></script>
+    </body>
+</html>