@naptics/vue-collection 0.0.5 → 0.0.7

package/components/NCrudModal.d.ts

@@ -4,93 +4,104 @@ export declare const nCrudModalProps: {
     /**
      * The text of the remove-button.
      */
-    removeText: {
-        type: StringConstructor;
-        default: string;
+    readonly removeText: {
+        readonly type: StringConstructor;
+        readonly default: string;
     };
     /**
      * The color of the remove-button.
      */
-    removeColor: {
-        type: StringConstructor;
-        default: string;
+    readonly removeColor: {
+        readonly type: StringConstructor;
+        readonly default: "red";
     };
+    /**
+     * If set to `true` the remove-button is disabled.
+     */
+    readonly removeDisabled: BooleanConstructor;
+    /**
+     * If set to `true` the ok-button is hidden.
+     */
+    readonly hideRemove: BooleanConstructor;
+    /**
+     * If set to `true` the ok-button is disabled.
+     */
+    readonly okDisabled: BooleanConstructor;
     /**
      * The title of the dialog which appears when clicking on the remove-button.
      */
-    removeDialogTitle: StringConstructor;
+    readonly removeDialogTitle: StringConstructor;
     /**
      * The text of the dialog which appears when clicking on the remove-button.
      */
-    removeDialogText: StringConstructor;
+    readonly removeDialogText: StringConstructor;
     /**
      * The variant of the dialog which appears when clicking on the remove-button. Default is `remove`.
      */
-    removeDialogVariant: {
-        type: PropType<DialogVariant>;
-        default: string;
+    readonly removeDialogVariant: {
+        readonly type: PropType<DialogVariant>;
+        readonly default: "remove";
     };
     /**
      * The text of the dialog's ok-button. Is already set by the `removeDialogVariant` but can be overridden.
      */
-    removeDialogOkText: StringConstructor;
+    readonly removeDialogOkText: StringConstructor;
     /**
      * If set to `true` the modal will close itself when `onRemove` is called.
      */
-    closeOnRemove: {
-        type: BooleanConstructor;
-        default: boolean;
+    readonly closeOnRemove: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
     };
     /**
      * This is called, when the remove-button has been clicked and the dialog has been accepted.
      */
-    onRemove: PropType<() => void>;
-    maxWidth: {
-        type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        default: string;
-    };
-    closeOnBackground: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    form: PropType<import("./ValidatedForm").ValidatedForm>;
-    hideHeader: BooleanConstructor;
-    hideFooter: BooleanConstructor;
-    hideX: BooleanConstructor;
-    title: StringConstructor;
-    okText: {
-        type: StringConstructor;
-        default: string;
-    };
-    okColor: {
-        /**
-         * If set to `true` the modal will close itself when `onRemove` is called.
-         */
-        type: StringConstructor;
-        default: string;
-    };
-    closeOnOk: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    hideOk: BooleanConstructor;
-    okDisabled: BooleanConstructor;
-    cancelText: {
-        type: StringConstructor;
-        default: string;
-    };
-    cancelColor: {
-        type: StringConstructor;
-        default: string;
-    };
-    hideCancel: BooleanConstructor;
-    onOk: PropType<() => void>;
-    onCancel: PropType<() => void>;
-    modal: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
-    header: PropType<() => JSX.Element>;
-    footer: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
-    value: PropType<boolean>;
-    onUpdateValue: PropType<(newValue: boolean) => void>;
+    readonly onRemove: PropType<() => void>;
+    readonly maxWidth: {
+        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
+        readonly default: "max-w-lg";
+    };
+    readonly closeOnBackground: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly form: PropType<import("./ValidatedForm").ValidatedForm>;
+    readonly hideHeader: BooleanConstructor;
+    readonly hideFooter: BooleanConstructor;
+    readonly hideX: BooleanConstructor;
+    readonly title: StringConstructor;
+    readonly okText: {
+        readonly type: StringConstructor;
+        readonly default: string;
+    };
+    readonly okColor: {
+        readonly type: StringConstructor;
+        readonly default: "primary";
+    };
+    readonly closeOnOk: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly hideOk: BooleanConstructor;
+    readonly cancelText: {
+        readonly type: StringConstructor;
+        readonly default: string;
+    };
+    readonly cancelColor: {
+        readonly type: StringConstructor;
+        readonly default: "default";
+    };
+    readonly hideCancel: BooleanConstructor;
+    readonly onOk: PropType<() => void>;
+    readonly onCancel: PropType<() => void>;
+    readonly modal: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
+    readonly header: PropType<() => JSX.Element>;
+    readonly footer: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
+    /**
+     * The color of the remove-button.
+     */
+    readonly value: PropType<boolean>;
+    readonly onUpdateValue: PropType<(newValue: boolean) => void>;
 };
 /**
  * The `NCrudModal` is a {@link NFormModal} which has some convenience features for a CRUD-scenario.
@@ -101,201 +112,225 @@ declare const _default: import("vue").DefineComponent<{
     /**
      * The text of the remove-button.
      */
-    removeText: {
-        type: StringConstructor;
-        default: string;
+    readonly removeText: {
+        readonly type: StringConstructor;
+        readonly default: string;
     };
     /**
      * The color of the remove-button.
      */
-    removeColor: {
-        type: StringConstructor;
-        default: string;
+    readonly removeColor: {
+        readonly type: StringConstructor;
+        readonly default: "red";
     };
+    /**
+     * If set to `true` the remove-button is disabled.
+     */
+    readonly removeDisabled: BooleanConstructor;
+    /**
+     * If set to `true` the ok-button is hidden.
+     */
+    readonly hideRemove: BooleanConstructor;
+    /**
+     * If set to `true` the ok-button is disabled.
+     */
+    readonly okDisabled: BooleanConstructor;
     /**
      * The title of the dialog which appears when clicking on the remove-button.
      */
-    removeDialogTitle: StringConstructor;
+    readonly removeDialogTitle: StringConstructor;
     /**
      * The text of the dialog which appears when clicking on the remove-button.
      */
-    removeDialogText: StringConstructor;
+    readonly removeDialogText: StringConstructor;
     /**
      * The variant of the dialog which appears when clicking on the remove-button. Default is `remove`.
      */
-    removeDialogVariant: {
-        type: PropType<DialogVariant>;
-        default: string;
+    readonly removeDialogVariant: {
+        readonly type: PropType<DialogVariant>;
+        readonly default: "remove";
     };
     /**
      * The text of the dialog's ok-button. Is already set by the `removeDialogVariant` but can be overridden.
      */
-    removeDialogOkText: StringConstructor;
+    readonly removeDialogOkText: StringConstructor;
     /**
      * If set to `true` the modal will close itself when `onRemove` is called.
      */
-    closeOnRemove: {
-        type: BooleanConstructor;
-        default: boolean;
+    readonly closeOnRemove: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
     };
     /**
      * This is called, when the remove-button has been clicked and the dialog has been accepted.
      */
-    onRemove: PropType<() => void>;
-    maxWidth: {
-        type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        default: string;
-    };
-    closeOnBackground: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    form: PropType<import("./ValidatedForm").ValidatedForm>;
-    hideHeader: BooleanConstructor;
-    hideFooter: BooleanConstructor;
-    hideX: BooleanConstructor;
-    title: StringConstructor;
-    okText: {
-        type: StringConstructor;
-        default: string;
-    };
-    okColor: {
-        /**
-         * If set to `true` the modal will close itself when `onRemove` is called.
-         */
-        type: StringConstructor;
-        default: string;
-    };
-    closeOnOk: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    hideOk: BooleanConstructor;
-    okDisabled: BooleanConstructor;
-    cancelText: {
-        type: StringConstructor;
-        default: string;
-    };
-    cancelColor: {
-        type: StringConstructor;
-        default: string;
-    };
-    hideCancel: BooleanConstructor;
-    onOk: PropType<() => void>;
-    onCancel: PropType<() => void>;
-    modal: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
-    header: PropType<() => JSX.Element>;
-    footer: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
-    value: PropType<boolean>;
-    onUpdateValue: PropType<(newValue: boolean) => void>;
+    readonly onRemove: PropType<() => void>;
+    readonly maxWidth: {
+        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
+        readonly default: "max-w-lg";
+    };
+    readonly closeOnBackground: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly form: PropType<import("./ValidatedForm").ValidatedForm>;
+    readonly hideHeader: BooleanConstructor;
+    readonly hideFooter: BooleanConstructor;
+    readonly hideX: BooleanConstructor;
+    readonly title: StringConstructor;
+    readonly okText: {
+        readonly type: StringConstructor;
+        readonly default: string;
+    };
+    readonly okColor: {
+        readonly type: StringConstructor;
+        readonly default: "primary";
+    };
+    readonly closeOnOk: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly hideOk: BooleanConstructor;
+    readonly cancelText: {
+        readonly type: StringConstructor;
+        readonly default: string;
+    };
+    readonly cancelColor: {
+        readonly type: StringConstructor;
+        readonly default: "default";
+    };
+    readonly hideCancel: BooleanConstructor;
+    readonly onOk: PropType<() => void>;
+    readonly onCancel: PropType<() => void>;
+    readonly modal: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
+    readonly header: PropType<() => JSX.Element>;
+    readonly footer: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
+    /**
+     * The color of the remove-button.
+     */
+    readonly value: PropType<boolean>;
+    readonly onUpdateValue: PropType<(newValue: boolean) => 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<{
     /**
      * The text of the remove-button.
      */
-    removeText: {
-        type: StringConstructor;
-        default: string;
+    readonly removeText: {
+        readonly type: StringConstructor;
+        readonly default: string;
     };
     /**
      * The color of the remove-button.
      */
-    removeColor: {
-        type: StringConstructor;
-        default: string;
+    readonly removeColor: {
+        readonly type: StringConstructor;
+        readonly default: "red";
     };
+    /**
+     * If set to `true` the remove-button is disabled.
+     */
+    readonly removeDisabled: BooleanConstructor;
+    /**
+     * If set to `true` the ok-button is hidden.
+     */
+    readonly hideRemove: BooleanConstructor;
+    /**
+     * If set to `true` the ok-button is disabled.
+     */
+    readonly okDisabled: BooleanConstructor;
     /**
      * The title of the dialog which appears when clicking on the remove-button.
      */
-    removeDialogTitle: StringConstructor;
+    readonly removeDialogTitle: StringConstructor;
     /**
      * The text of the dialog which appears when clicking on the remove-button.
      */
-    removeDialogText: StringConstructor;
+    readonly removeDialogText: StringConstructor;
     /**
      * The variant of the dialog which appears when clicking on the remove-button. Default is `remove`.
      */
-    removeDialogVariant: {
-        type: PropType<DialogVariant>;
-        default: string;
+    readonly removeDialogVariant: {
+        readonly type: PropType<DialogVariant>;
+        readonly default: "remove";
     };
     /**
      * The text of the dialog's ok-button. Is already set by the `removeDialogVariant` but can be overridden.
      */
-    removeDialogOkText: StringConstructor;
+    readonly removeDialogOkText: StringConstructor;
     /**
      * If set to `true` the modal will close itself when `onRemove` is called.
      */
-    closeOnRemove: {
-        type: BooleanConstructor;
-        default: boolean;
+    readonly closeOnRemove: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
     };
     /**
      * This is called, when the remove-button has been clicked and the dialog has been accepted.
      */
-    onRemove: PropType<() => void>;
-    maxWidth: {
-        type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        default: string;
-    };
-    closeOnBackground: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    form: PropType<import("./ValidatedForm").ValidatedForm>;
-    hideHeader: BooleanConstructor;
-    hideFooter: BooleanConstructor;
-    hideX: BooleanConstructor;
-    title: StringConstructor;
-    okText: {
-        type: StringConstructor;
-        default: string;
-    };
-    okColor: {
-        /**
-         * If set to `true` the modal will close itself when `onRemove` is called.
-         */
-        type: StringConstructor;
-        default: string;
-    };
-    closeOnOk: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    hideOk: BooleanConstructor;
-    okDisabled: BooleanConstructor;
-    cancelText: {
-        type: StringConstructor;
-        default: string;
-    };
-    cancelColor: {
-        type: StringConstructor;
-        default: string;
-    };
-    hideCancel: BooleanConstructor;
-    onOk: PropType<() => void>;
-    onCancel: PropType<() => void>;
-    modal: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
-    header: PropType<() => JSX.Element>;
-    footer: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
-    value: PropType<boolean>;
-    onUpdateValue: PropType<(newValue: boolean) => void>;
+    readonly onRemove: PropType<() => void>;
+    readonly maxWidth: {
+        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
+        readonly default: "max-w-lg";
+    };
+    readonly closeOnBackground: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly form: PropType<import("./ValidatedForm").ValidatedForm>;
+    readonly hideHeader: BooleanConstructor;
+    readonly hideFooter: BooleanConstructor;
+    readonly hideX: BooleanConstructor;
+    readonly title: StringConstructor;
+    readonly okText: {
+        readonly type: StringConstructor;
+        readonly default: string;
+    };
+    readonly okColor: {
+        readonly type: StringConstructor;
+        readonly default: "primary";
+    };
+    readonly closeOnOk: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly hideOk: BooleanConstructor;
+    readonly cancelText: {
+        readonly type: StringConstructor;
+        readonly default: string;
+    };
+    readonly cancelColor: {
+        readonly type: StringConstructor;
+        readonly default: "default";
+    };
+    readonly hideCancel: BooleanConstructor;
+    readonly onOk: PropType<() => void>;
+    readonly onCancel: PropType<() => void>;
+    readonly modal: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
+    readonly header: PropType<() => JSX.Element>;
+    readonly footer: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
+    /**
+     * The color of the remove-button.
+     */
+    readonly value: PropType<boolean>;
+    readonly onUpdateValue: PropType<(newValue: boolean) => void>;
 }>> & {}, {
-    maxWidth: import("../utils/tailwind").TWMaxWidth;
-    hideX: boolean;
-    hideHeader: boolean;
-    hideFooter: boolean;
-    okText: string;
-    okColor: string;
-    closeOnOk: boolean;
-    hideOk: boolean;
-    okDisabled: boolean;
-    cancelText: string;
-    cancelColor: string;
-    closeOnBackground: boolean;
-    hideCancel: boolean;
-    removeText: string;
-    removeColor: string;
-    removeDialogVariant: DialogVariant;
-    closeOnRemove: boolean;
+    readonly maxWidth: import("../utils/tailwind").TWMaxWidth;
+    readonly hideX: boolean;
+    readonly hideHeader: boolean;
+    readonly hideFooter: boolean;
+    readonly okText: string;
+    readonly okColor: string;
+    readonly closeOnOk: boolean;
+    readonly hideOk: boolean;
+    readonly okDisabled: boolean;
+    readonly cancelText: string;
+    readonly cancelColor: string;
+    readonly closeOnBackground: boolean;
+    readonly hideCancel: boolean;
+    readonly removeText: string;
+    readonly removeColor: string;
+    readonly removeDisabled: boolean;
+    readonly hideRemove: boolean;
+    readonly removeDialogVariant: DialogVariant;
+    readonly closeOnRemove: boolean;
 }>;
 export default _default;

package/components/NCrudModal.js

@@ -1,11 +1,11 @@
 import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
 import { trsl } from '../i18n';
-import { createComponent, createProps } from '../utils/component';
+import { createComponent } from '../utils/component';
 import { ref } from 'vue';
 import NButton from './NButton';
 import NDialog from './NDialog';
 import NFormModal, { nFormModalProps } from './NFormModal';
-export const nCrudModalProps = createProps({
+export const nCrudModalProps = {
   ...nFormModalProps,
   /**
    * The text of the remove-button.
@@ -21,6 +21,18 @@ export const nCrudModalProps = createProps({
     type: String,
     default: 'red'
   },
+  /**
+   * If set to `true` the remove-button is disabled.
+   */
+  removeDisabled: Boolean,
+  /**
+   * If set to `true` the ok-button is hidden.
+   */
+  hideRemove: Boolean,
+  /**
+   * If set to `true` the ok-button is disabled.
+   */
+  okDisabled: Boolean,
   /**
    * The title of the dialog which appears when clicking on the remove-button.
    */
@@ -51,7 +63,7 @@ export const nCrudModalProps = createProps({
    * This is called, when the remove-button has been clicked and the dialog has been accepted.
    */
   onRemove: Function
-});
+};
 /**
  * The `NCrudModal` is a {@link NFormModal} which has some convenience features for a CRUD-scenario.
  * It has an integrated remove-button with a user-dialog to remove the editing element.
@@ -77,7 +89,8 @@ export default createComponent('NCrudModal', nCrudModalProps, (props, {
       "class": "flex justify-between"
     }, [_createVNode("div", null, [_createVNode(NButton, {
       "color": props.removeColor,
-      "onClick": remove
+      "onClick": remove,
+      "disabled": props.removeDisabled
     }, {
       default: () => [props.removeText]
     })]), _createVNode("div", null, [_createVNode(NButton, {

package/components/NDialog.d.ts

@@ -1,5 +1,5 @@
 import { type PropType } from 'vue';
-import type { HeroIcon } from '../utils/utils';
+import type { HeroIcon } from '../utils/tailwind';
 export type DialogVariant = 'success' | 'info' | 'warning' | 'danger' | 'remove';
 export declare const nDialogProps: {
     /**

package/components/NDialog.js

@@ -1,6 +1,6 @@
 import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
 import { deferred } from '../utils/deferred';
-import { createComponent, createProps, extractProps } from '../utils/component';
+import { createComponent, extractProps } from '../utils/component';
 import { CheckIcon, ExclamationTriangleIcon, LightBulbIcon, TrashIcon } from '@heroicons/vue/24/outline';
 import { computed, ref } from 'vue';
 import NIconCircle from './NIconCircle';
@@ -8,7 +8,7 @@ import NModal from './NModal';
 import { DialogTitle } from '@headlessui/vue';
 import { trsl } from '../i18n';
 import { vModelForRef } from '../utils/vModel';
-export const nDialogProps = createProps({
+export const nDialogProps = {
   /**
    * The title of the dialog.
    */
@@ -60,7 +60,7 @@ export const nDialogProps = createProps({
    * If set to `true` the cancel-button is hidden.
    */
   hideCancel: Boolean
-});
+};
 /**
  * A `NDialog` is an element to interact directly with the user.
  * It can be controlled via a ref to prompt the user and to receive their answer.