lkt-item-crud 2.0.34 → 2.0.36

package/dist/components/ButtonNav.vue.d.ts

@@ -1,4 +1,4 @@
-import { ButtonConfig, ItemCrudButtonNavVisibility, ItemCrudMode, ItemCrudView, LktObject, ModificationView } from 'lkt-vue-kernel';
+import { ButtonConfig, ItemCrudButtonNavVisibility, ItemCrudMode, ItemCrudSaveConfig, ItemCrudView, LktObject, ModificationView } from 'lkt-vue-kernel';
 type __VLS_Props = {
     item: LktObject;
     modifications: LktObject;
@@ -33,6 +33,7 @@ type __VLS_Props = {
     navStartButtonsEditing?: Array<ButtonConfig>;
     navEndButtons?: Array<ButtonConfig>;
     navEndButtonsEditing?: Array<ButtonConfig>;
+    updateConfig: ItemCrudSaveConfig;
 };
 declare var __VLS_13: {
     canUpdate: boolean | undefined;

package/dist/functions/modifications-functions.d.ts

@@ -1,4 +1,2 @@
-import { FormConfig, LktObject } from 'lkt-vue-kernel';
-import { DataState } from 'lkt-data-state';
-export declare const getModificationsDataState: (value: LktObject, modifications: LktObject, form: FormConfig) => DataState;
+import { FormConfig } from 'lkt-vue-kernel';
 export declare const detectFormFieldsKeys: (form: FormConfig) => string[];

package/dist/lib-components/LktItemCrud.vue.d.ts

@@ -21,7 +21,15 @@ declare var __VLS_17: {
     canUpdate: boolean | undefined;
     canDrop: boolean | undefined;
     perms: string[] | undefined;
-}, __VLS_59: string, __VLS_60: {}, __VLS_62: {
+}, __VLS_55: {
+    canUpdate: boolean | undefined;
+    canDrop: boolean | undefined;
+    perms: string[] | undefined;
+}, __VLS_57: {
+    canUpdate: boolean | undefined;
+    canDrop: boolean | undefined;
+    perms: string[] | undefined;
+}, __VLS_74: string, __VLS_75: {}, __VLS_77: {
     item: LktObject;
     loading: false;
     editMode: boolean;
@@ -30,9 +38,9 @@ declare var __VLS_17: {
     canDrop: boolean;
     itemBeingEdited: boolean;
     perms: string[];
-}, __VLS_83: {}, __VLS_85: {};
+}, __VLS_98: {}, __VLS_100: {};
 type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_59>]?: (props: typeof __VLS_60) => any;
+    [K in NonNullable<typeof __VLS_74>]?: (props: typeof __VLS_75) => any;
 } & {
     'prev-buttons-ever'?: (props: typeof __VLS_17) => any;
 } & {
@@ -46,11 +54,15 @@ type __VLS_Slots = {} & {
 } & {
     'prev-buttons'?: (props: typeof __VLS_42) => any;
 } & {
-    item?: (props: typeof __VLS_62) => any;
+    'prev-buttons-ever'?: (props: typeof __VLS_55) => any;
 } & {
-    'prev-buttons-ever'?: (props: typeof __VLS_83) => any;
+    'prev-buttons'?: (props: typeof __VLS_57) => any;
 } & {
-    'prev-buttons'?: (props: typeof __VLS_85) => any;
+    item?: (props: typeof __VLS_77) => any;
+} & {
+    'prev-buttons-ever'?: (props: typeof __VLS_98) => any;
+} & {
+    'prev-buttons'?: (props: typeof __VLS_100) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<ItemCrudConfig, {
     doDrop: () => void;
@@ -94,13 +106,10 @@ declare const __VLS_component: import("vue").DefineComponent<ItemCrudConfig, {
     header: import("lkt-vue-kernel").HeaderConfig;
     title: string;
     mode: ItemCrudMode;
+    modifications: LktObject;
     modelValue: LktObject;
     createButton: ButtonConfig | false;
-    events: {
-        httpStart?: undefined | Function;
-        httpEnd?: (data: import("lkt-vue-kernel").ClickEventArgs) => void | undefined;
-    };
-    modifications: LktObject;
+    events: import("lkt-vue-kernel").ItemCrudEvents;
     editing: boolean;
     perms: import("lkt-vue-kernel").ValidTablePermission[];
     customData: LktObject;
@@ -130,6 +139,7 @@ declare const __VLS_component: import("vue").DefineComponent<ItemCrudConfig, {
     navStartButtonsEditing: Array<ButtonConfig>;
     navEndButtons: Array<ButtonConfig>;
     navEndButtonsEditing: Array<ButtonConfig>;
+    updateConfig: import("lkt-vue-kernel").ItemCrudSaveConfig;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lkt-item-crud",
-  "version": "2.0.34",
+  "version": "2.0.36",
   "description": "",
   "type": "module",
   "module": "./dist/build.js",

package/src/components/ButtonNav.vue

@@ -4,7 +4,7 @@
         ButtonConfig,
         ButtonType,
         ItemCrudButtonNavVisibility,
-        ItemCrudMode,
+        ItemCrudMode, ItemCrudSaveConfig,
         ItemCrudView,
         LktObject,
         ModificationView,
@@ -61,6 +61,10 @@
         navStartButtonsEditing?: Array<ButtonConfig>
         navEndButtons?: Array<ButtonConfig>
         navEndButtonsEditing?: Array<ButtonConfig>
+
+        updateConfig: ItemCrudSaveConfig
+
+
     }>(), {
         item: () => ({}),
         modifications: () => ({}),
@@ -75,12 +79,18 @@
 
     const slots: SetupContext['slots'] = useSlots();
 
+    const createButtonRef = ref(<HTMLButtonElement | null>null);
+    const createAndNewButtonRef = ref(<HTMLButtonElement | null>null);
     const saveButtonRef = ref(<HTMLButtonElement | null>null);
     const dropButtonRef = ref(<HTMLButtonElement | null>null);
 
     const isLoading = ref(props.loading);
     watch(() => props.loading, v => isLoading.value = v);
-    watch(isLoading, v => emit('update:loading', v));
+    watch(isLoading, v => {
+        if (props.updateConfig.executionMode === 'blocking') {
+            emit('update:loading', v);
+        }
+    });
 
     const isEditing = ref(props.editing);
     watch(() => props.editing, v => isEditing.value = v);
@@ -111,7 +121,17 @@
     })
 
     const doSave = () => {
-            if (saveButtonRef.value && typeof saveButtonRef.value.click === 'function') saveButtonRef.value.click();
+            if (showSaveButton.value) {
+                switch (props.mode) {
+                    case ItemCrudMode.Update:
+                        if (saveButtonRef.value && typeof saveButtonRef.value.click === 'function') saveButtonRef.value.click();
+                        break;
+
+                    case ItemCrudMode.Create:
+                        if (createButtonRef.value && typeof createButtonRef.value.click === 'function') createButtonRef.value.click();
+                        break;
+                }
+            }
         },
         doDrop = () => {
             if (dropButtonRef.value && typeof dropButtonRef.value.click === 'function') dropButtonRef.value.click();
@@ -289,7 +309,7 @@
             />
 
             <lkt-button
-                ref="saveButtonRef"
+                ref="createButtonRef"
                 v-show="mode === ItemCrudMode.Create && showSaveButton"
                 v-bind="{
                     ...createButton,
@@ -305,7 +325,7 @@
             />
 
             <lkt-button
-                ref="saveButtonRef"
+                ref="createAndNewButtonRef"
                 v-show="mode === ItemCrudMode.Create && showSaveButton && ableToCreateAndNew"
                 v-bind="{
                     ...createAndNewButton,
@@ -401,7 +421,7 @@
                     />
 
                     <lkt-button
-                        ref="saveButtonRef"
+                        ref="createButtonRef"
                         v-show="mode === ItemCrudMode.Create && showSaveButton"
                         v-bind="{
                             ...createButton,
@@ -418,7 +438,7 @@
                     />
 
                     <lkt-button
-                        ref="saveButtonRef"
+                        ref="createAndNewButtonRef"
                         v-show="mode === ItemCrudMode.Create && showSaveButton && ableToCreateAndNew"
                         v-bind="{
                             ...createAndNewButton,
@@ -494,7 +514,7 @@
             />
 
             <lkt-button
-                ref="saveButtonRef"
+                ref="createButtonRef"
                 v-show="mode === ItemCrudMode.Create && showSaveButton"
                 v-bind="{
                     ...createButton,
@@ -510,7 +530,7 @@
             />
 
             <lkt-button
-                ref="saveButtonRef"
+                ref="createAndNewButtonRef"
                 v-show="mode === ItemCrudMode.Create && showSaveButton && ableToCreateAndNew"
                 v-bind="{
                     ...createAndNewButton,

package/src/lib-components/LktItemCrud.vue

@@ -5,7 +5,7 @@
     import { debug } from '../functions/debug';
     import {
         ButtonConfig,
-        ensureButtonConfig, FormUiConfig,
+        ensureButtonConfig, extractI18nValue, FormUiConfig,
         getDefaultValues,
         getFormDataState, getFormSlotKeys,
         ItemCrud,
@@ -23,7 +23,6 @@
         ToastPositionX,
     } from 'lkt-vue-kernel';
     import { closeModal, updateModalKey } from 'lkt-modal';
-    import { __ } from 'lkt-i18n';
     import ButtonNav from '../components/ButtonNav.vue';
     import { openToast } from 'lkt-toast';
     import { useRouter } from 'vue-router';
@@ -228,6 +227,7 @@
         dataState.value.increment(v);
         if (computedEditableView.value === ModificationView.Current) {
             dataChanged.value = dataState.value.changed();
+            debug('item updated -> dataState changed');
         }
         itemBeingEdited.value = true;
     }, { deep: true });
@@ -444,12 +444,7 @@
         }
     };
 
-    const computedTitle = computed(() => {
-            if (props.title.startsWith('__:')) {
-                return String(__(props.title.substring(3)));
-            }
-            return props.title;
-        }),
+    const computedTitle = computed(() => extractI18nValue(props.title)),
         displayHeader = computed(() => {
             if (isLoading.value) return false;
 
@@ -469,8 +464,16 @@
         }),
         ableToUpdate = computed(() => {
             if (props.mode !== ItemCrudMode.Update || !canUpdate.value) return false;
-            if (!props.enabledSaveWithoutChanges && !dataChanged.value) return false;
-            if (computedHasForm.value && (!validForm.value || (!props.enabledSaveWithoutChanges && !changedForm.value))) return false;
+            if (computedHasForm.value) {
+                if (!validForm.value) return false;
+            }
+            if (!props.enabledSaveWithoutChanges) {
+                if (computedHasForm.value) {
+                    if (!changedForm.value) return false;
+                } else if (!dataChanged.value) {
+                    return false;
+                }
+            }
 
             if (typeof safeUpdateButton.value?.disabled === 'function') return !safeUpdateButton.value.disabled({
                 prop: item.value
@@ -481,8 +484,18 @@
         }),
         ableToCreate = computed(() => {
             if (props.mode !== ItemCrudMode.Create || !canCreate.value) return false;
-            if (!props.enabledSaveWithoutChanges && !dataChanged.value) return false;
-            if (computedHasForm.value && (!validForm.value || (!props.enabledSaveWithoutChanges && !changedForm.value))) return false;
+            if (computedHasForm.value) {
+                if (!validForm.value) return false;
+            }
+            if (!props.enabledSaveWithoutChanges) {
+                if (computedHasForm.value) {
+                    if (!changedForm.value) return false;
+                } else if (!dataChanged.value) {
+                    return false;
+                }
+            }
+            // if (!props.enabledSaveWithoutChanges && !computedHasForm.value && !dataChanged.value) return false;
+            // if (computedHasForm.value && (!validForm.value || (!props.enabledSaveWithoutChanges && !changedForm.value))) return false;
 
             if (typeof safeCreateButton.value?.disabled === 'function') return !safeCreateButton.value.disabled({
                 prop: item.value
@@ -604,6 +617,7 @@
                 :nav-start-buttons-editing="navStartButtonsEditing"
                 :nav-end-buttons="navEndButtons"
                 :nav-end-buttons-editing="navEndButtonsEditing"
+                :update-config="updateConfig"
                 @create="onCreate"
                 @save="onUpdate"
                 @drop="onDrop"
@@ -672,6 +686,7 @@
             :nav-start-buttons-editing="navStartButtonsEditing"
             :nav-end-buttons="navEndButtons"
             :nav-end-buttons-editing="navEndButtonsEditing"
+            :update-config="updateConfig"
             @create="onCreate"
             @save="onUpdate"
             @drop="onDrop"
@@ -691,6 +706,63 @@
                 />
             </template>
         </button-nav>
+        <template v-else-if="computedHasButtons && buttonNavPosition === ItemCrudButtonNavPosition.Hidden">
+            <button-nav
+                ref="buttonNav"
+                v-show="false"
+                v-model:loading="isLoading"
+                v-model:editing="editMode"
+                v-model:picked-modification-view="pickedModificationView"
+                :item="item"
+                :modifications="itemModifications"
+                :mode="mode"
+                :view="view"
+                :button-nav-visibility="buttonNavVisibility"
+                :create-button="safeCreateButton"
+                :create-and-new-button="safeCreateAndNewButton"
+                :update-button="safeUpdateButton"
+                :drop-button="safeDropButton"
+                :edit-mode-button="safeEditModeButton"
+                :group-button="safeGroupButton"
+                :data-changed="dataChanged"
+                :http-success-read="httpSuccessRead"
+                :can-create="canCreate"
+                :can-update="canUpdate"
+                :can-drop="canDrop"
+                :can-switch-edit-mode="canSwitchEditMode"
+                :group-button-as-modal-actions="groupButtonAsModalActions"
+                :able-to-create="ableToCreate"
+                :able-to-create-and-new="ableToCreateAndNew"
+                :able-to-update="ableToUpdate"
+                :able-to-drop="ableToDrop"
+                :perms="permissions"
+                :modification-view="computedModificationViews"
+                :editable-view="computedEditableView"
+                :nav-start-buttons="navStartButtons"
+                :nav-start-buttons-editing="navStartButtonsEditing"
+                :nav-end-buttons="navEndButtons"
+                :nav-end-buttons-editing="navEndButtonsEditing"
+                :update-config="updateConfig"
+                @create="onCreate"
+                @save="onUpdate"
+                @drop="onDrop"
+            >
+                <template #prev-buttons-ever="{canUpdate, canDrop, perms}" v-if="slots['prev-buttons-ever']">
+                    <slot name="prev-buttons-ever"
+                          :can-update="canUpdate"
+                          :can-drop="canDrop"
+                          :perms="perms"
+                    />
+                </template>
+                <template #prev-buttons="{canUpdate, canDrop, perms}" v-if="slots['prev-buttons']">
+                    <slot name="prev-buttons"
+                          :can-update="canUpdate"
+                          :can-drop="canDrop"
+                          :perms="perms"
+                    />
+                </template>
+            </button-nav>
+        </template>
 
         <div class="lkt-item-crud_content" v-if="!isLoading">
             <div v-if="httpSuccessRead" class="lkt-grid-1">
@@ -778,6 +850,7 @@
             :nav-start-buttons-editing="navStartButtonsEditing"
             :nav-end-buttons="navEndButtons"
             :nav-end-buttons-editing="navEndButtonsEditing"
+            :update-config="updateConfig"
             @create="onCreate"
             @save="onUpdate"
             @drop="onDrop"