@naptics/vue-collection 0.0.6 → 0.0.7

package/components/NTooltip.d.ts

@@ -6,37 +6,37 @@ export declare const nTooltipProps: {
     /**
      * The text content of the tooltip.
      */
-    text: StringConstructor;
+    readonly text: StringConstructor;
     /**
      * A slot to replace the content of the tooltip. This will override the `text` prop.
      */
-    content: PropType<() => void>;
+    readonly content: PropType<() => void>;
     /**
      * If set to `true` the tooltip is shown constantly.
      */
-    show: BooleanConstructor;
+    readonly show: BooleanConstructor;
     /**
      * If set to `true` the tooltip is hidden constantly.
      */
-    hide: BooleanConstructor;
+    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.
      */
-    block: BooleanConstructor;
+    readonly block: BooleanConstructor;
     /**
      * The placement of the tooltip.
      */
-    placement: {
-        type: PropType<TooltipPlacement>;
-        default: string;
+    readonly placement: {
+        readonly type: PropType<TooltipPlacement>;
+        readonly default: "auto";
     };
     /**
      * The maximum width of the tooltip.
      */
-    maxWidth: {
-        type: PropType<TWMaxWidth>;
-        default: string;
+    readonly maxWidth: {
+        readonly type: PropType<TWMaxWidth>;
+        readonly default: "max-w-xs";
     };
 };
 /**
@@ -69,15 +69,15 @@ export declare const nToolTipPropsForImplementor: {
      * @see {@link nTooltipProps.placement}
      */
     tooltipPlacement: {
-        type: PropType<TooltipPlacement>;
-        default: string;
+        readonly type: PropType<TooltipPlacement>;
+        readonly default: "auto";
     };
     /**
      * @see {@link nTooltipProps.maxWidth}
      */
     tooltipMaxWidth: {
-        type: PropType<TWMaxWidth>;
-        default: string;
+        readonly type: PropType<TWMaxWidth>;
+        readonly default: "max-w-xs";
     };
 };
 /**
@@ -107,80 +107,80 @@ declare const _default: import("vue").DefineComponent<{
     /**
      * The text content of the tooltip.
      */
-    text: StringConstructor;
+    readonly text: StringConstructor;
     /**
      * A slot to replace the content of the tooltip. This will override the `text` prop.
      */
-    content: PropType<() => void>;
+    readonly content: PropType<() => void>;
     /**
      * If set to `true` the tooltip is shown constantly.
      */
-    show: BooleanConstructor;
+    readonly show: BooleanConstructor;
     /**
      * If set to `true` the tooltip is hidden constantly.
      */
-    hide: BooleanConstructor;
+    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.
      */
-    block: BooleanConstructor;
+    readonly block: BooleanConstructor;
     /**
      * The placement of the tooltip.
      */
-    placement: {
-        type: PropType<TooltipPlacement>;
-        default: string;
+    readonly placement: {
+        readonly type: PropType<TooltipPlacement>;
+        readonly default: "auto";
     };
     /**
      * The maximum width of the tooltip.
      */
-    maxWidth: {
-        type: PropType<TWMaxWidth>;
-        default: string;
+    readonly maxWidth: {
+        readonly type: PropType<TWMaxWidth>;
+        readonly default: "max-w-xs";
     };
 }, 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.
      */
-    text: StringConstructor;
+    readonly text: StringConstructor;
     /**
      * A slot to replace the content of the tooltip. This will override the `text` prop.
      */
-    content: PropType<() => void>;
+    readonly content: PropType<() => void>;
     /**
      * If set to `true` the tooltip is shown constantly.
      */
-    show: BooleanConstructor;
+    readonly show: BooleanConstructor;
     /**
      * If set to `true` the tooltip is hidden constantly.
      */
-    hide: BooleanConstructor;
+    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.
      */
-    block: BooleanConstructor;
+    readonly block: BooleanConstructor;
     /**
      * The placement of the tooltip.
      */
-    placement: {
-        type: PropType<TooltipPlacement>;
-        default: string;
+    readonly placement: {
+        readonly type: PropType<TooltipPlacement>;
+        readonly default: "auto";
     };
     /**
      * The maximum width of the tooltip.
      */
-    maxWidth: {
-        type: PropType<TWMaxWidth>;
-        default: string;
+    readonly maxWidth: {
+        readonly type: PropType<TWMaxWidth>;
+        readonly default: "max-w-xs";
     };
 }>> & {}, {
-    show: boolean;
-    hide: boolean;
-    block: boolean;
-    placement: TooltipPlacement;
-    maxWidth: TWMaxWidth;
+    readonly show: boolean;
+    readonly hide: boolean;
+    readonly block: boolean;
+    readonly placement: TooltipPlacement;
+    readonly maxWidth: TWMaxWidth;
 }>;
 export default _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,11 +1,11 @@
 import { withDirectives as _withDirectives, vShow as _vShow, Fragment as _Fragment, createVNode as _createVNode } from "vue";
-import { createComponent, createProps } from '../utils/component';
+import { createComponent } from '../utils/component';
 import { uniqueId } from '../utils/utils';
 import { computed, onMounted, ref, watch, onUnmounted, Transition } from 'vue';
 import { createPopper } from '@popperjs/core';
 import { watchRef } from '../utils/vue';
 import './NTooltip.css';
-export const nTooltipProps = createProps({
+export const nTooltipProps = {
   /**
    * The text content of the tooltip.
    */
@@ -41,7 +41,7 @@ export const nTooltipProps = createProps({
     type: String,
     default: 'max-w-xs'
   }
-});
+};
 /**
  * These props are made to use on a component which implements the tooltip
  * and wants it to be controllable via the own props.

package/components/NValInput.d.ts

@@ -7,111 +7,111 @@ export declare const validationProps: {
      * 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`.
      */
-    optional: BooleanConstructor;
+    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.
      */
-    rules: {
-        type: PropType<ValidationRule | ValidationRule[]>;
-        default: () => never[];
+    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.
      */
-    form: PropType<ValidatedForm>;
+    readonly form: PropType<ValidatedForm>;
     /**
      * Overrides the internal error state. If set to true, it will always display an error.
      */
-    error: BooleanConstructor;
+    readonly error: BooleanConstructor;
     /**
      * Overrides the internal error message. If set, this message is always displayed.
      */
-    errorMessage: StringConstructor;
+    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.
      */
-    hideErrorMessage: BooleanConstructor;
+    readonly hideErrorMessage: BooleanConstructor;
     /**
      * Disables the validation on blur. Should only be used in special occasions.
      */
-    disableBlurValidation: BooleanConstructor;
+    readonly disableBlurValidation: BooleanConstructor;
 };
 export declare const nValInputProps: {
     /**
      * A slot to replace the input.
      */
-    input: PropType<(props: InputSlotProps) => JSX.Element>;
+    readonly input: PropType<(props: InputSlotProps) => 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`.
      */
-    optional: BooleanConstructor;
+    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.
      */
-    rules: {
-        type: PropType<ValidationRule | ValidationRule[]>;
-        default: () => never[];
+    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.
      */
-    form: PropType<ValidatedForm>;
+    readonly form: PropType<ValidatedForm>;
     /**
      * Overrides the internal error state. If set to true, it will always display an error.
      */
-    error: BooleanConstructor;
+    readonly error: BooleanConstructor;
     /**
      * Overrides the internal error message. If set, this message is always displayed.
      */
-    errorMessage: StringConstructor;
+    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.
      */
-    hideErrorMessage: BooleanConstructor;
+    readonly hideErrorMessage: BooleanConstructor;
     /**
      * Disables the validation on blur. Should only be used in special occasions.
      */
-    disableBlurValidation: BooleanConstructor;
-    tooltipText: StringConstructor;
-    tooltipContent: PropType<() => void>;
-    tooltipHide: BooleanConstructor;
-    tooltipShow: BooleanConstructor;
-    tooltipPlacement: {
-        type: PropType<import("./NTooltip").TooltipPlacement>;
-        default: string;
+    readonly disableBlurValidation: BooleanConstructor;
+    readonly tooltipText: StringConstructor;
+    readonly tooltipContent: PropType<() => void>;
+    readonly tooltipHide: BooleanConstructor;
+    readonly tooltipShow: BooleanConstructor;
+    readonly tooltipPlacement: {
+        readonly type: PropType<import("./NTooltip").TooltipPlacement>;
+        readonly default: "auto";
     };
-    tooltipMaxWidth: {
-        type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        default: string;
+    readonly tooltipMaxWidth: {
+        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
+        readonly default: "max-w-xs";
     };
-    name: StringConstructor;
-    placeholder: StringConstructor;
-    autocomplete: {
-        type: StringConstructor;
-        default: string;
+    readonly name: StringConstructor;
+    readonly placeholder: StringConstructor;
+    readonly autocomplete: {
+        readonly type: StringConstructor;
+        readonly default: "off";
     };
-    type: {
-        type: StringConstructor;
-        default: string;
+    readonly type: {
+        readonly type: StringConstructor;
+        readonly default: "text";
     };
-    max: StringConstructor;
-    min: StringConstructor;
-    disabled: BooleanConstructor;
-    small: BooleanConstructor;
-    hideLabel: BooleanConstructor;
-    onFocus: PropType<() => void>;
-    onBlur: PropType<() => void>;
-    value: PropType<string>;
-    onUpdateValue: PropType<(newValue: string) => void>;
+    readonly max: StringConstructor;
+    readonly min: StringConstructor;
+    readonly disabled: BooleanConstructor;
+    readonly small: BooleanConstructor;
+    readonly hideLabel: BooleanConstructor;
+    readonly onFocus: PropType<() => void>;
+    readonly onBlur: PropType<() => void>;
+    readonly value: PropType<string>;
+    readonly onUpdateValue: PropType<(newValue: string) => void>;
 };
 export type InputSlotProps = {
     onBlur(): void;
@@ -138,160 +138,160 @@ declare const _default: import("vue").DefineComponent<{
     /**
      * A slot to replace the input.
      */
-    input: PropType<(props: InputSlotProps) => JSX.Element>;
+    readonly input: PropType<(props: InputSlotProps) => 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`.
      */
-    optional: BooleanConstructor;
+    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.
      */
-    rules: {
-        type: PropType<ValidationRule | ValidationRule[]>;
-        default: () => never[];
+    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.
      */
-    form: PropType<ValidatedForm>;
+    readonly form: PropType<ValidatedForm>;
     /**
      * Overrides the internal error state. If set to true, it will always display an error.
      */
-    error: BooleanConstructor;
+    readonly error: BooleanConstructor;
     /**
      * Overrides the internal error message. If set, this message is always displayed.
      */
-    errorMessage: StringConstructor;
+    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.
      */
-    hideErrorMessage: BooleanConstructor;
+    readonly hideErrorMessage: BooleanConstructor;
     /**
      * Disables the validation on blur. Should only be used in special occasions.
      */
-    disableBlurValidation: BooleanConstructor;
-    tooltipText: StringConstructor;
-    tooltipContent: PropType<() => void>;
-    tooltipHide: BooleanConstructor;
-    tooltipShow: BooleanConstructor;
-    tooltipPlacement: {
-        type: PropType<import("./NTooltip").TooltipPlacement>;
-        default: string;
+    readonly disableBlurValidation: BooleanConstructor;
+    readonly tooltipText: StringConstructor;
+    readonly tooltipContent: PropType<() => void>;
+    readonly tooltipHide: BooleanConstructor;
+    readonly tooltipShow: BooleanConstructor;
+    readonly tooltipPlacement: {
+        readonly type: PropType<import("./NTooltip").TooltipPlacement>;
+        readonly default: "auto";
     };
-    tooltipMaxWidth: {
-        type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        default: string;
+    readonly tooltipMaxWidth: {
+        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
+        readonly default: "max-w-xs";
     };
-    name: StringConstructor;
-    placeholder: StringConstructor;
-    autocomplete: {
-        type: StringConstructor;
-        default: string;
+    readonly name: StringConstructor;
+    readonly placeholder: StringConstructor;
+    readonly autocomplete: {
+        readonly type: StringConstructor;
+        readonly default: "off";
     };
-    type: {
-        type: StringConstructor;
-        default: string;
+    readonly type: {
+        readonly type: StringConstructor;
+        readonly default: "text";
     };
-    max: StringConstructor;
-    min: StringConstructor;
-    disabled: BooleanConstructor;
-    small: BooleanConstructor;
-    hideLabel: BooleanConstructor;
-    onFocus: PropType<() => void>;
-    onBlur: PropType<() => void>;
-    value: PropType<string>;
-    onUpdateValue: PropType<(newValue: string) => void>;
+    readonly max: StringConstructor;
+    readonly min: StringConstructor;
+    readonly disabled: BooleanConstructor;
+    readonly small: BooleanConstructor;
+    readonly hideLabel: BooleanConstructor;
+    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.
      */
-    input: PropType<(props: InputSlotProps) => JSX.Element>;
+    readonly input: PropType<(props: InputSlotProps) => 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`.
      */
-    optional: BooleanConstructor;
+    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.
      */
-    rules: {
-        type: PropType<ValidationRule | ValidationRule[]>;
-        default: () => never[];
+    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.
      */
-    form: PropType<ValidatedForm>;
+    readonly form: PropType<ValidatedForm>;
     /**
      * Overrides the internal error state. If set to true, it will always display an error.
      */
-    error: BooleanConstructor;
+    readonly error: BooleanConstructor;
     /**
      * Overrides the internal error message. If set, this message is always displayed.
      */
-    errorMessage: StringConstructor;
+    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.
      */
-    hideErrorMessage: BooleanConstructor;
+    readonly hideErrorMessage: BooleanConstructor;
     /**
      * Disables the validation on blur. Should only be used in special occasions.
      */
-    disableBlurValidation: BooleanConstructor;
-    tooltipText: StringConstructor;
-    tooltipContent: PropType<() => void>;
-    tooltipHide: BooleanConstructor;
-    tooltipShow: BooleanConstructor;
-    tooltipPlacement: {
-        type: PropType<import("./NTooltip").TooltipPlacement>;
-        default: string;
+    readonly disableBlurValidation: BooleanConstructor;
+    readonly tooltipText: StringConstructor;
+    readonly tooltipContent: PropType<() => void>;
+    readonly tooltipHide: BooleanConstructor;
+    readonly tooltipShow: BooleanConstructor;
+    readonly tooltipPlacement: {
+        readonly type: PropType<import("./NTooltip").TooltipPlacement>;
+        readonly default: "auto";
     };
-    tooltipMaxWidth: {
-        type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        default: string;
+    readonly tooltipMaxWidth: {
+        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
+        readonly default: "max-w-xs";
     };
-    name: StringConstructor;
-    placeholder: StringConstructor;
-    autocomplete: {
-        type: StringConstructor;
-        default: string;
+    readonly name: StringConstructor;
+    readonly placeholder: StringConstructor;
+    readonly autocomplete: {
+        readonly type: StringConstructor;
+        readonly default: "off";
     };
-    type: {
-        type: StringConstructor;
-        default: string;
+    readonly type: {
+        readonly type: StringConstructor;
+        readonly default: "text";
     };
-    max: StringConstructor;
-    min: StringConstructor;
-    disabled: BooleanConstructor;
-    small: BooleanConstructor;
-    hideLabel: BooleanConstructor;
-    onFocus: PropType<() => void>;
-    onBlur: PropType<() => void>;
-    value: PropType<string>;
-    onUpdateValue: PropType<(newValue: string) => void>;
+    readonly max: StringConstructor;
+    readonly min: StringConstructor;
+    readonly disabled: BooleanConstructor;
+    readonly small: BooleanConstructor;
+    readonly hideLabel: BooleanConstructor;
+    readonly onFocus: PropType<() => void>;
+    readonly onBlur: PropType<() => void>;
+    readonly value: PropType<string>;
+    readonly onUpdateValue: PropType<(newValue: string) => void>;
 }>> & {}, {
-    small: boolean;
-    type: string;
-    tooltipHide: boolean;
-    tooltipShow: boolean;
-    tooltipPlacement: import("./NTooltip").TooltipPlacement;
-    tooltipMaxWidth: import("../utils/tailwind").TWMaxWidth;
-    disabled: boolean;
-    error: boolean;
-    autocomplete: string;
-    hideLabel: boolean;
-    optional: boolean;
-    rules: ValidationRule | ValidationRule[];
-    hideErrorMessage: boolean;
-    disableBlurValidation: boolean;
+    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 optional: boolean;
+    readonly rules: ValidationRule | ValidationRule[];
+    readonly hideErrorMessage: boolean;
+    readonly disableBlurValidation: boolean;
 }>;
 export default _default;

package/components/NValInput.js

@@ -1,10 +1,10 @@
 import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
-import { createComponent, createProps } from '../utils/component';
+import { createComponent } from '../utils/component';
 import { computed } from 'vue';
 import { ref, reactive, watch } from 'vue';
 import NInput, { nInputProps } from './NInput';
 import { validate, required } from '../utils/validation';
-export const validationProps = createProps({
+export const validationProps = {
   /**
    * 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`.
@@ -41,15 +41,15 @@ export const validationProps = createProps({
    * Disables the validation on blur. Should only be used in special occasions.
    */
   disableBlurValidation: Boolean
-});
-export const nValInputProps = createProps({
+};
+export const nValInputProps = {
   ...nInputProps,
   ...validationProps,
   /**
    * A slot to replace the input.
    */
   input: Function
-});
+};
 /**
  * The `NValInput` is a `NInput` with custom validation.
  */

package/index.d.ts

@@ -1,2 +1,2 @@
-import { createComponent, createView, createProps } from './utils/component';
-export { createComponent, createView, createProps };
+import { createComponent, createView } from './utils/component';
+export { createComponent, createView };

package/index.js

@@ -1,2 +1,2 @@
-import { createComponent, createView, createProps } from './utils/component';
-export { createComponent, createView, createProps };
+import { createComponent, createView } from './utils/component';
+export { createComponent, createView };

package/package.json

@@ -1,6 +1,8 @@
 {
     "name": "@naptics/vue-collection",
-    "version": "0.0.6",
+    "author": "Timo Siegenthaler",
+    "description": "Vue Collection is a collection of styled and fully functional Vue components which can easily be integrated into our projects.",
+    "version": "0.0.7",
     "main": "./index.js",
     "repository": {
         "type": "git",