@memberjunction/ng-form-toolbar 1.4.1

package/dist/lib/form-toolbar.d.ts

@@ -0,0 +1,43 @@
+import { OnInit } from '@angular/core';
+import { BaseFormComponent } from '@memberjunction/ng-base-forms';
+import { CompositeKey } from '@memberjunction/core';
+import { Router } from '@angular/router';
+import * as i0 from "@angular/core";
+export declare class FormToolbarComponent implements OnInit {
+    private router;
+    ShowSkipChatButton: boolean;
+    form: BaseFormComponent;
+    /**
+     * This property does not get modified by the toolbar as things change within its state, it is the global setting you can change to disable the toolbar
+     */
+    Disabled: boolean;
+    /**
+     * Determines if the toolbar is enabled or disabled.
+     */
+    get CurrentlyDisabled(): boolean;
+    /**
+     * Internal property that changes over time based on the state of the record being managed. Don't access this directly, use the CurrentlyDisabled property instead.
+     */
+    _currentlyDisabled: boolean;
+    /**
+     * Internal property used to determine if the delete record confirmation dialog is currently displayed or not
+     */
+    _deleteDialogVisible: boolean;
+    /**
+     * Internal property used to determine if the skip chat window is currently displayed or not
+     */
+    _skipChatDialogVisible: boolean;
+    get LinkedEntityPrimaryKey(): CompositeKey;
+    constructor(router: Router);
+    ngOnInit(): Promise<void>;
+    saveExistingRecord(event: MouseEvent): Promise<void>;
+    /**
+     * This method is called internally when the user clicks on the Skip button, and also can be invoked manually in code to show the Skip dialog.
+     */
+    ShowSkipChat(): void;
+    toggleDeleteDialog(show: boolean): void;
+    deleteRecord(): Promise<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormToolbarComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormToolbarComponent, "mj-form-toolbar", never, { "ShowSkipChatButton": { "alias": "ShowSkipChatButton"; "required": false; }; "form": { "alias": "form"; "required": false; }; }, {}, never, never, false, never>;
+}
+//# sourceMappingURL=form-toolbar.d.ts.map

package/dist/lib/form-toolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-toolbar.d.ts","sourceRoot":"","sources":["../../src/lib/form-toolbar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,MAAM,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,OAAO,EAAc,YAAY,EAA8B,MAAM,sBAAsB,CAAC;AAC5F,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;;AAIzC,qBAKa,oBAAqB,YAAW,MAAM;IAmC5B,OAAO,CAAC,MAAM;IAlCxB,kBAAkB,EAAE,OAAO,CAAQ;IACnC,IAAI,EAAG,iBAAiB,CAAC;IAGlC;;OAEG;IACI,QAAQ,EAAE,OAAO,CAAS;IAEjC;;OAEG;IACH,IAAW,iBAAiB,IAAI,OAAO,CAEtC;IAED;;OAEG;IACI,kBAAkB,EAAE,OAAO,CAAS;IAE3C;;OAEG;IACI,oBAAoB,EAAE,OAAO,CAAS;IAC7C;;OAEG;IACI,sBAAsB,EAAE,OAAO,CAAS;IAE/C,IAAW,sBAAsB,IAAI,YAAY,CAEhD;gBAE0B,MAAM,EAAE,MAAM;IAG5B,QAAQ,IAAI,OAAO,CAAC,IAAI,CAAC;IAGzB,kBAAkB,CAAC,KAAK,EAAE,UAAU;IAgEjD;;OAEG;IACI,YAAY,IAAI,IAAI;IAKpB,kBAAkB,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI;IAIjC,YAAY,IAAI,OAAO,CAAC,IAAI,CAAC;yCArHjC,oBAAoB;2CAApB,oBAAoB;CA6IhC"}

package/dist/lib/form-toolbar.js

@@ -0,0 +1,304 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { Component, Input } from '@angular/core';
+import { EventCodes, SharedService } from '@memberjunction/ng-shared';
+import { MJEventType, MJGlobal } from '@memberjunction/global';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/router";
+import * as i2 from "@angular/common";
+import * as i3 from "@memberjunction/ng-record-changes";
+import * as i4 from "@progress/kendo-angular-buttons";
+import * as i5 from "@progress/kendo-angular-dialog";
+import * as i6 from "@memberjunction/ng-ask-skip";
+function FormToolbarComponent_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 8);
+    i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_1_Conditional_0_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r11); const ctx_r10 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r10.form.StartEditMode()); });
+    i0.ɵɵelement(1, "span", 9);
+    i0.ɵɵelementStart(2, "span", 10);
+    i0.ɵɵtext(3, "Edit");
+    i0.ɵɵelementEnd()();
+} }
+function FormToolbarComponent_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r13 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 11);
+    i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_1_Conditional_1_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r13); const ctx_r12 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r12.toggleDeleteDialog(true)); });
+    i0.ɵɵelement(1, "span", 12);
+    i0.ɵɵelementEnd();
+} }
+function FormToolbarComponent_Conditional_1_Conditional_2_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 14);
+    i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_1_Conditional_2_Conditional_0_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r16 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r16.form.RemoveFavorite()); });
+    i0.ɵɵelement(1, "span", 15);
+    i0.ɵɵelementEnd();
+} }
+function FormToolbarComponent_Conditional_1_Conditional_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r19 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 16);
+    i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_1_Conditional_2_Conditional_1_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r18 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r18.form.MakeFavorite()); });
+    i0.ɵɵelement(1, "span", 17);
+    i0.ɵɵelementEnd();
+} }
+function FormToolbarComponent_Conditional_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, FormToolbarComponent_Conditional_1_Conditional_2_Conditional_0_Template, 2, 0, "button", 13)(1, FormToolbarComponent_Conditional_1_Conditional_2_Conditional_1_Template, 2, 0);
+} if (rf & 2) {
+    const ctx_r9 = i0.ɵɵnextContext(2);
+    i0.ɵɵconditional(0, ctx_r9.form.IsFavorite ? 0 : 1);
+} }
+function FormToolbarComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, FormToolbarComponent_Conditional_1_Conditional_0_Template, 4, 0, "button", 6)(1, FormToolbarComponent_Conditional_1_Conditional_1_Template, 2, 0, "button", 7)(2, FormToolbarComponent_Conditional_1_Conditional_2_Template, 2, 1);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵconditional(0, ctx_r0.form.UserCanEdit ? 0 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(1, ctx_r0.form.UserCanDelete ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(2, ctx_r0.form.FavoriteInitDone ? 2 : -1);
+} }
+function FormToolbarComponent_Conditional_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    const _r23 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 22);
+    i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_2_Conditional_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r23); const ctx_r22 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r22.form.CancelEdit()); });
+    i0.ɵɵelement(1, "span", 23);
+    i0.ɵɵelementStart(2, "span", 10);
+    i0.ɵɵtext(3, "Cancel");
+    i0.ɵɵelementEnd()();
+} }
+function FormToolbarComponent_Conditional_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    const _r25 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 24);
+    i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_2_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r25); const ctx_r24 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r24.form.ShowChanges()); });
+    i0.ɵɵelement(1, "span", 25);
+    i0.ɵɵelementStart(2, "span", 10);
+    i0.ɵɵtext(3, "Changes");
+    i0.ɵɵelementEnd()();
+} }
+function FormToolbarComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r27 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 18);
+    i0.ɵɵlistener("mouseup", function FormToolbarComponent_Conditional_2_Template_button_mouseup_0_listener($event) { i0.ɵɵrestoreView(_r27); const ctx_r26 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r26.saveExistingRecord($event)); });
+    i0.ɵɵelement(1, "span", 19);
+    i0.ɵɵelementStart(2, "span", 10);
+    i0.ɵɵtext(3, "Save");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(4, FormToolbarComponent_Conditional_2_Conditional_4_Template, 4, 0, "button", 20)(5, FormToolbarComponent_Conditional_2_Conditional_5_Template, 4, 0, "button", 21);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(4);
+    i0.ɵɵconditional(4, ctx_r1.form.record.IsSaved ? 4 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(5, ctx_r1.form.record.Dirty ? 5 : -1);
+} }
+function FormToolbarComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r29 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 26);
+    i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r29); const ctx_r28 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r28.form.handleHistoryDialog()); });
+    i0.ɵɵelement(1, "span", 27);
+    i0.ɵɵelementStart(2, "span", 10);
+    i0.ɵɵtext(3, "History");
+    i0.ɵɵelementEnd()();
+} }
+function FormToolbarComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    const _r31 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 28);
+    i0.ɵɵlistener("click", function FormToolbarComponent_Conditional_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r31); const ctx_r30 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r30.ShowSkipChat()); });
+    i0.ɵɵelement(1, "span", 29);
+    i0.ɵɵelementEnd();
+} }
+function FormToolbarComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    const _r34 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-skip-chat-with-record-window", 30, 31);
+    i0.ɵɵlistener("WindowClosed", function FormToolbarComponent_Conditional_5_Template_mj_skip_chat_with_record_window_WindowClosed_0_listener() { i0.ɵɵrestoreView(_r34); const ctx_r33 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r33.ShowSkipChat()); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r4 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("LinkedEntityID", ctx_r4.form.EntityInfo.ID)("LinkedEntityPrimaryKey", ctx_r4.LinkedEntityPrimaryKey)("WindowOpened", ctx_r4._skipChatDialogVisible);
+} }
+function FormToolbarComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    const _r36 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-record-changes", 32);
+    i0.ɵɵlistener("dialogClosed", function FormToolbarComponent_Conditional_6_Template_mj_record_changes_dialogClosed_0_listener() { i0.ɵɵrestoreView(_r36); const ctx_r35 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r35.form.handleHistoryDialog()); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("record", ctx_r5.form.record);
+} }
+function FormToolbarComponent_kendo_dialog_7_Template(rf, ctx) { if (rf & 1) {
+    const _r38 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-dialog", 33);
+    i0.ɵɵlistener("close", function FormToolbarComponent_kendo_dialog_7_Template_kendo_dialog_close_0_listener() { i0.ɵɵrestoreView(_r38); const ctx_r37 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r37.toggleDeleteDialog(false)); });
+    i0.ɵɵelementStart(1, "p", 34);
+    i0.ɵɵtext(2, " Are you sure you want to delete this record? ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "kendo-dialog-actions", 35)(4, "button", 36);
+    i0.ɵɵlistener("click", function FormToolbarComponent_kendo_dialog_7_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r38); const ctx_r39 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r39.deleteRecord()); });
+    i0.ɵɵtext(5, " Yes, Delete ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "button", 37);
+    i0.ɵɵlistener("click", function FormToolbarComponent_kendo_dialog_7_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r38); const ctx_r40 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r40.toggleDeleteDialog(false)); });
+    i0.ɵɵtext(7, " No, Cancel ");
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    i0.ɵɵproperty("minWidth", 450)("width", 650);
+} }
+export class FormToolbarComponent {
+    /**
+     * Determines if the toolbar is enabled or disabled.
+     */
+    get CurrentlyDisabled() {
+        return this.Disabled && this._currentlyDisabled;
+    }
+    get LinkedEntityPrimaryKey() {
+        return this.form.record.PrimaryKey;
+    }
+    constructor(router) {
+        this.router = router;
+        this.ShowSkipChatButton = true;
+        /**
+         * This property does not get modified by the toolbar as things change within its state, it is the global setting you can change to disable the toolbar
+         */
+        this.Disabled = false;
+        /**
+         * Internal property that changes over time based on the state of the record being managed. Don't access this directly, use the CurrentlyDisabled property instead.
+         */
+        this._currentlyDisabled = false;
+        /**
+         * Internal property used to determine if the delete record confirmation dialog is currently displayed or not
+         */
+        this._deleteDialogVisible = false;
+        /**
+         * Internal property used to determine if the skip chat window is currently displayed or not
+         */
+        this._skipChatDialogVisible = false;
+    }
+    ngOnInit() {
+        return __awaiter(this, void 0, void 0, function* () {
+        });
+    }
+    saveExistingRecord(event) {
+        return __awaiter(this, void 0, void 0, function* () {
+            // Ensure the button takes focus
+            const button = event.target;
+            button.focus();
+            // while we are saving the record we are editing, we need to apply a UX effect on our peer elements in the browser to ensure they are 
+            // not further edited and also disable all of the other stuff on this toolbar. So get the HTML reference to the toolbar, and disable it
+            // then get the HTML reference to the parent of the toolbar and opacity it out.
+            // Then create an HTML element that is centered horizaontall across the parent and is below the toolbar and show a status message of "Saving..." in it
+            // Disable the toolbar and apply the UX effect to the form parent
+            this._currentlyDisabled = true;
+            const toolbar = button.closest('.toolbar-container');
+            const formElement = toolbar.closest('form');
+            // Apply inline styles to disable interactions and set opacity
+            formElement.style.pointerEvents = 'none'; // This prevents interactions with the form
+            formElement.style.opacity = '0.75'; // This makes the form opaque
+            // Create and show the status message element
+            const statusMessage = document.createElement('div');
+            statusMessage.className = 'form-toolbar-status-message';
+            formElement.appendChild(statusMessage);
+            statusMessage.style.position = 'absolute';
+            statusMessage.style.top = `${100}px`;
+            // Timer variables
+            let elapsedTime = 0;
+            let serverUpdateMessage = "";
+            const timer = setInterval(() => {
+                elapsedTime += .1;
+                statusMessage.innerHTML = `<div>Saving...<span class="form-toolbar-elapsed-time">(${Math.floor(elapsedTime)} sec${elapsedTime === 0 || elapsedTime > 1 ? 's' : ''})</span></div>` + (serverUpdateMessage ? `<div class="form-toolbar-server-update-message">${serverUpdateMessage}</div>` : '');
+            }, 100);
+            try {
+                // listen for status updates from MJGlobal that come from the server
+                MJGlobal.Instance.GetEventListener(false).subscribe((event) => {
+                    var _a;
+                    if (event.eventCode === EventCodes.PushStatusUpdates) {
+                        serverUpdateMessage = (_a = event.args) === null || _a === void 0 ? void 0 : _a.message;
+                        console.log(event);
+                    }
+                });
+                // Save the record
+                const result = yield this.form.SaveRecord(true);
+                if (!result)
+                    alert(this.form.record.LatestResult.Message);
+            }
+            finally {
+                // Re-enable the toolbar and remove the UX effect
+                this._currentlyDisabled = false;
+                formElement.style.pointerEvents = 'auto'; // This re-enables interactions with the form
+                formElement.style.opacity = '1'; // This restores the form's opacity
+                // Remove the status message element
+                formElement.removeChild(statusMessage);
+                // Clear the timer
+                clearInterval(timer);
+            }
+        });
+    }
+    /**
+     * This method is called internally when the user clicks on the Skip button, and also can be invoked manually in code to show the Skip dialog.
+     */
+    ShowSkipChat() {
+        this._skipChatDialogVisible = !this._skipChatDialogVisible;
+        SharedService.Instance.InvokeManualResize();
+    }
+    toggleDeleteDialog(show) {
+        this._deleteDialogVisible = show;
+    }
+    deleteRecord() {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.toggleDeleteDialog(false);
+            let dependencies = yield this.form.GetRecordDependencies();
+            if (dependencies.length > 0) {
+                SharedService.Instance.CreateSimpleNotification(`This record cannot be deleted because it is being used by ${dependencies.length} other records.`, 'error', 2000);
+                return;
+            }
+            const deleteResult = yield this.form.record.Delete();
+            if (deleteResult) {
+                SharedService.Instance.CreateSimpleNotification('Record deleted succesfully', 'success', 2000);
+                let event = {
+                    event: MJEventType.ComponentEvent,
+                    eventCode: EventCodes.CloseCurrentTab,
+                    component: null,
+                    args: null
+                };
+                MJGlobal.Instance.RaiseEvent(event);
+            }
+            else {
+                SharedService.Instance.CreateSimpleNotification('Error deleting record', 'error', 2000);
+            }
+        });
+    }
+}
+FormToolbarComponent.ɵfac = function FormToolbarComponent_Factory(t) { return new (t || FormToolbarComponent)(i0.ɵɵdirectiveInject(i1.Router)); };
+FormToolbarComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FormToolbarComponent, selectors: [["mj-form-toolbar"]], inputs: { ShowSkipChatButton: "ShowSkipChatButton", form: "form" }, decls: 8, vars: 8, consts: [[1, "toolbar-container"], ["kendoButton", "", "title", "Show History"], ["kendoButton", "", "title", "Discuss this record with Skip"], [3, "LinkedEntityID", "LinkedEntityPrimaryKey", "WindowOpened"], [3, "record"], ["class", "dialog-wrapper", "title", "Confirm", 3, "minWidth", "width", "close", 4, "ngIf"], ["kendoButton", "", "title", "Edit this Record"], ["kendoButton", "", "title", "Delete this Record"], ["kendoButton", "", "title", "Edit this Record", 3, "click"], [1, "fa-solid", "fa-pen-to-square"], [1, "button-text"], ["kendoButton", "", "title", "Delete this Record", 3, "click"], [1, "fa-regular", "fa-trash-can"], ["kendoButton", "", "title", "Remove Favorite"], ["kendoButton", "", "title", "Remove Favorite", 3, "click"], [1, "fa-solid", "fa-star"], ["kendoButton", "", "title", "Make Favorite", 3, "click"], [1, "fa-regular", "fa-star"], ["kendoButton", "", "title", "Save Record", 3, "mouseup"], [1, "fa-solid", "fa-floppy-disk"], ["kendoButton", "", "title", "Cancel Edit"], ["kendoButton", "", "title", "Fields you have changed"], ["kendoButton", "", "title", "Cancel Edit", 3, "click"], [1, "fa-solid", "fa-rotate-left"], ["kendoButton", "", "title", "Fields you have changed", 3, "click"], [1, "fa-solid", "fa-clipboard-list"], ["kendoButton", "", "title", "Show History", 3, "click"], [1, "fa-solid", "fa-business-time"], ["kendoButton", "", "title", "Discuss this record with Skip", 3, "click"], [1, "fa-regular", "fa-comment-dots"], [3, "LinkedEntityID", "LinkedEntityPrimaryKey", "WindowOpened", "WindowClosed"], ["mjChat", ""], [3, "record", "dialogClosed"], ["title", "Confirm", 1, "dialog-wrapper", 3, "minWidth", "width", "close"], [1, "k-m-7.5", "k-text-center"], [1, "popup-actions-btn"], ["kendoButton", "", "themeColor", "info", 1, "cancel-btn", 3, "click"], ["kendoButton", "", "fillMode", "outline", "themeColor", "info", 1, "yes-btn", 3, "click"]], template: function FormToolbarComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "div", 0);
+        i0.ɵɵtemplate(1, FormToolbarComponent_Conditional_1_Template, 3, 3)(2, FormToolbarComponent_Conditional_2_Template, 6, 2)(3, FormToolbarComponent_Conditional_3_Template, 4, 0, "button", 1)(4, FormToolbarComponent_Conditional_4_Template, 2, 0, "button", 2)(5, FormToolbarComponent_Conditional_5_Template, 2, 3, "mj-skip-chat-with-record-window", 3)(6, FormToolbarComponent_Conditional_6_Template, 1, 1, "mj-record-changes", 4)(7, FormToolbarComponent_kendo_dialog_7_Template, 8, 2, "kendo-dialog", 5);
+        i0.ɵɵelementEnd();
+    } if (rf & 2) {
+        i0.ɵɵclassProp("disabled", ctx.CurrentlyDisabled);
+        i0.ɵɵadvance();
+        i0.ɵɵconditional(1, !ctx.form.EditMode ? 1 : 2);
+        i0.ɵɵadvance(2);
+        i0.ɵɵconditional(3, (ctx.form.EntityInfo == null ? null : ctx.form.EntityInfo.TrackRecordChanges) && !ctx.form.EditMode ? 3 : -1);
+        i0.ɵɵadvance();
+        i0.ɵɵconditional(4, ctx.ShowSkipChatButton && !ctx.form.EditMode ? 4 : -1);
+        i0.ɵɵadvance();
+        i0.ɵɵconditional(5, ctx.form.EntityInfo ? 5 : -1);
+        i0.ɵɵadvance();
+        i0.ɵɵconditional(6, ctx.form.isHistoryDialogOpen ? 6 : -1);
+        i0.ɵɵadvance();
+        i0.ɵɵproperty("ngIf", ctx._deleteDialogVisible);
+    } }, dependencies: [i2.NgIf, i3.RecordChangesComponent, i4.ButtonComponent, i5.DialogComponent, i5.DialogActionsComponent, i6.SkipChatWithRecordWindowComponent], styles: [".toolbar-container[_ngcontent-%COMP%] { \n    border-bottom: solid 1px lightgray; \n    padding-bottom: 10px; \n    margin-bottom: 5px; \n}\n\n.toolbar-container[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] { \n    margin-right: 7px; \n} \n.toolbar-container[_ngcontent-%COMP%]   .button-text[_ngcontent-%COMP%] { \n    margin-left: 7px; \n} \n\n.toolbar-container.disabled[_ngcontent-%COMP%] {\n    pointer-events: none;\n    opacity: 0.8;\n}\n\n.disabled[_ngcontent-%COMP%] {\n    pointer-events: none;\n}\n\n  .form-toolbar-status-message {\n    background: #f0f0f0;\n    padding: 15px;\n    border-radius: 5px;\n    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n    opacity: 1;\n    z-index: 1000;\n    color:#1d7032;\n    font: 16px;\n    font-weight: bold;\n    min-width: 100px;\n\n    text-align: center; \n\n}\n\n\n  .form-toolbar-elapsed-time {\n    \n\n\n\n    position: absolute;\n    top: 0;\n    right: 0;\n    color: darkgray;\n    font-size: smaller;\n    padding: 2px;\n    border-radius: 5px;\n    margin: 5px;\n    z-index: 1000;\n}\n\n  .form-toolbar-server-update-message {\n    margin-top: 7px;\n    font-size: smaller;\n    color: black;\n}"] });
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FormToolbarComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-form-toolbar', template: "\n<div class=\"toolbar-container\" [class.disabled]=\"CurrentlyDisabled\">\n    @if (!form.EditMode) {\n        @if (form.UserCanEdit) {\n            <button kendoButton (click)=\"form.StartEditMode()\" title=\"Edit this Record\">\n                <span class=\"fa-solid fa-pen-to-square\"></span>\n                <span class=\"button-text\">Edit</span>\n            </button> \n        }\n        @if(form.UserCanDelete){\n            <button kendoButton (click)=\"toggleDeleteDialog(true)\" title=\"Delete this Record\">\n                <span class=\"fa-regular fa-trash-can\"></span>\n            </button> \n        }\n        @if (form.FavoriteInitDone) {\n            @if (form.IsFavorite) {\n                <button kendoButton (click)=\"form.RemoveFavorite()\" title=\"Remove Favorite\">\n                    <span class=\"fa-solid fa-star\"></span>\n                </button> \n            }\n            @else {\n                <button kendoButton (click)=\"form.MakeFavorite()\" title=\"Make Favorite\">\n                    <span class=\"fa-regular fa-star\"></span>\n                </button> \n            }\n        }\n    }\n    @else {\n        <button kendoButton (mouseup)=\"saveExistingRecord($event)\" title=\"Save Record\">\n            <span class=\"fa-solid fa-floppy-disk\"></span>\n            <span class=\"button-text\">Save</span>\n        </button> \n        @if (form.record.IsSaved) {\n            <!-- Only show the cancel button if the record has already been saved - don't show for a new record. -->\n            <button kendoButton (click)=\"form.CancelEdit()\" title=\"Cancel Edit\">\n                <span class=\"fa-solid fa-rotate-left\"></span>\n                <span class=\"button-text\">Cancel</span>\n            </button>     \n        }\n        @if (form.record.Dirty) {\n            <button kendoButton (click)=\"form.ShowChanges()\" title=\"Fields you have changed\">\n                <span class=\"fa-solid fa-clipboard-list\"></span>\n                <span class=\"button-text\">Changes</span>\n            </button> \n        }\n    }\n    @if (form.EntityInfo?.TrackRecordChanges && !form.EditMode) {\n        <button kendoButton (click)=\"form.handleHistoryDialog()\" title=\"Show History\">\n            <span class=\"fa-solid fa-business-time\"></span>\n            <span class=\"button-text\">History</span>\n        </button> \n    }\n    @if (ShowSkipChatButton && !form.EditMode) {\n        <button kendoButton (click)=\"ShowSkipChat()\" title=\"Discuss this record with Skip\">\n            <span class=\"fa-regular fa-comment-dots\"></span>\n        </button> \n    }\n    @if (form.EntityInfo) {\n        <mj-skip-chat-with-record-window\n            [LinkedEntityID]=\"form.EntityInfo.ID\"\n            [LinkedEntityPrimaryKey]=\"LinkedEntityPrimaryKey\"            \n            #mjChat\n            [WindowOpened]=\"_skipChatDialogVisible\" \n            (WindowClosed)=\"ShowSkipChat()\"\n        >\n        </mj-skip-chat-with-record-window>\n    }\n    @if (form.isHistoryDialogOpen) {\n        <mj-record-changes [record]=\"form.record\" (dialogClosed)=\"form.handleHistoryDialog()\"></mj-record-changes>\n    }\n    <kendo-dialog \n    [minWidth]=\"450\"\n    [width]=\"650\"\n    class=\"dialog-wrapper\" \n    title=\"Confirm\" \n    *ngIf=\"_deleteDialogVisible\" \n    (close)=\"toggleDeleteDialog(false)\">\n      <p class=\"k-m-7.5 k-text-center\">\n        Are you sure you want to delete this record?\n      </p>\n      <kendo-dialog-actions class=\"popup-actions-btn\">\n        <button class=\"cancel-btn\" (click)=\"deleteRecord()\" kendoButton themeColor=\"info\">\n          Yes, Delete\n        </button>\n        <button class=\"yes-btn\" (click)=\"toggleDeleteDialog(false)\" kendoButton fillMode=\"outline\" themeColor=\"info\">\n          No, Cancel\n        </button>\n      </kendo-dialog-actions>\n    </kendo-dialog>\n</div>", styles: [".toolbar-container { \n    border-bottom: solid 1px lightgray; \n    padding-bottom: 10px; \n    margin-bottom: 5px; \n}\n\n.toolbar-container button { \n    margin-right: 7px; \n} \n.toolbar-container .button-text { \n    margin-left: 7px; \n} \n\n.toolbar-container.disabled {\n    pointer-events: none;\n    opacity: 0.8;\n}\n\n.disabled {\n    pointer-events: none;\n}\n\n::ng-deep .form-toolbar-status-message {\n    background: #f0f0f0;\n    padding: 15px;\n    border-radius: 5px;\n    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n    opacity: 1;\n    z-index: 1000;\n    color:#1d7032;\n    font: 16px;\n    font-weight: bold;\n    min-width: 100px;\n\n    text-align: center; /* Center the text horizontally */\n}\n\n\n::ng-deep .form-toolbar-elapsed-time {\n    /*\n    we want this littler timer to be small dark gray text in the top right corner with a white background\n*/\n    position: absolute;\n    top: 0;\n    right: 0;\n    color: darkgray;\n    font-size: smaller;\n    padding: 2px;\n    border-radius: 5px;\n    margin: 5px;\n    z-index: 1000;\n}\n\n::ng-deep .form-toolbar-server-update-message {\n    margin-top: 7px;\n    font-size: smaller;\n    color: black;\n}"] }]
+    }], () => [{ type: i1.Router }], { ShowSkipChatButton: [{
+            type: Input
+        }], form: [{
+            type: Input
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FormToolbarComponent, { className: "FormToolbarComponent", filePath: "src/lib/form-toolbar.ts", lineNumber: 14 }); })();

package/dist/module.d.ts

@@ -0,0 +1,19 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./lib/form-toolbar";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/forms";
+import * as i4 from "@memberjunction/ng-record-changes";
+import * as i5 from "@memberjunction/ng-base-forms";
+import * as i6 from "@progress/kendo-angular-buttons";
+import * as i7 from "@progress/kendo-angular-inputs";
+import * as i8 from "@progress/kendo-angular-dialog";
+import * as i9 from "@memberjunction/ng-ask-skip";
+import * as i10 from "@progress/kendo-angular-indicators";
+import * as i11 from "@memberjunction/ng-shared";
+import * as i12 from "ngx-markdown";
+export declare class FormToolbarModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormToolbarModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<FormToolbarModule, [typeof i1.FormToolbarComponent], [typeof i2.CommonModule, typeof i3.FormsModule, typeof i4.RecordChangesModule, typeof i5.BaseFormsModule, typeof i6.ButtonsModule, typeof i7.InputsModule, typeof i8.DialogsModule, typeof i9.AskSkipModule, typeof i10.IndicatorsModule, typeof i11.MemberJunctionSharedModule, typeof i12.MarkdownModule], [typeof i1.FormToolbarComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<FormToolbarModule>;
+}
+//# sourceMappingURL=module.d.ts.map

package/dist/module.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../src/module.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAwBA,qBAqBa,iBAAiB;yCAAjB,iBAAiB;0CAAjB,iBAAiB;0CAAjB,iBAAiB;CAAI"}

package/dist/module.js

@@ -0,0 +1,69 @@
+// Angular
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+// Markdown
+import { MarkdownModule } from 'ngx-markdown';
+// Kendo UI Angular imports
+import { ButtonsModule } from '@progress/kendo-angular-buttons';
+import { InputsModule } from '@progress/kendo-angular-inputs';
+import { IndicatorsModule } from '@progress/kendo-angular-indicators';
+import { DialogsModule } from '@progress/kendo-angular-dialog';
+// MJ
+import { RecordChangesModule } from '@memberjunction/ng-record-changes';
+import { AskSkipModule } from '@memberjunction/ng-ask-skip';
+import { MemberJunctionSharedModule } from '@memberjunction/ng-shared';
+// Local to package
+import { FormToolbarComponent } from './lib/form-toolbar';
+import { BaseFormsModule } from '@memberjunction/ng-base-forms';
+import * as i0 from "@angular/core";
+import * as i1 from "ngx-markdown";
+export class FormToolbarModule {
+}
+FormToolbarModule.ɵfac = function FormToolbarModule_Factory(t) { return new (t || FormToolbarModule)(); };
+FormToolbarModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: FormToolbarModule });
+FormToolbarModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonModule,
+        FormsModule,
+        RecordChangesModule,
+        BaseFormsModule,
+        ButtonsModule,
+        InputsModule,
+        DialogsModule,
+        AskSkipModule,
+        IndicatorsModule,
+        MemberJunctionSharedModule,
+        MarkdownModule.forRoot()] });
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FormToolbarModule, [{
+        type: NgModule,
+        args: [{
+                declarations: [
+                    FormToolbarComponent,
+                ],
+                imports: [
+                    CommonModule,
+                    FormsModule,
+                    RecordChangesModule,
+                    BaseFormsModule,
+                    ButtonsModule,
+                    InputsModule,
+                    DialogsModule,
+                    AskSkipModule,
+                    IndicatorsModule,
+                    MemberJunctionSharedModule,
+                    MarkdownModule.forRoot()
+                ],
+                exports: [
+                    FormToolbarComponent,
+                ]
+            }]
+    }], null, null); })();
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(FormToolbarModule, { declarations: [FormToolbarComponent], imports: [CommonModule,
+        FormsModule,
+        RecordChangesModule,
+        BaseFormsModule,
+        ButtonsModule,
+        InputsModule,
+        DialogsModule,
+        AskSkipModule,
+        IndicatorsModule,
+        MemberJunctionSharedModule, i1.MarkdownModule], exports: [FormToolbarComponent] }); })();

package/dist/public-api.d.ts

@@ -0,0 +1,3 @@
+export * from './module';
+export * from './lib/form-toolbar';
+//# sourceMappingURL=public-api.d.ts.map

package/dist/public-api.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../src/public-api.ts"],"names":[],"mappings":"AAIA,cAAc,UAAU,CAAC;AACzB,cAAc,oBAAoB,CAAC"}

package/dist/public-api.js

@@ -0,0 +1,5 @@
+/*
+ * Public API Surface
+ */
+export * from './module';
+export * from './lib/form-toolbar';

package/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "@memberjunction/ng-form-toolbar",
+  "version": "1.4.1",
+  "description": "MemberJunction: Angular Form Toolbar",
+  "main": "./dist/public-api.js",
+  "typings": "./dist/public-api.d.ts",
+  "files": [
+    "/dist"
+  ],
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build": "ngc"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "@angular/compiler": "~17.2.2",
+    "@angular/compiler-cli": "~17.2.2"
+  },
+  "peerDependencies": {
+    "@angular/common": "~17.2.2",
+    "@angular/core": "~17.2.2",
+    "@angular/forms": "~17.2.2",
+    "@angular/router": "~17.2.2"
+  },
+  "dependencies": {
+    "@memberjunction/global": "~1.4.1",
+    "@memberjunction/core": "~1.4.1",
+    "@memberjunction/ng-shared": "~1.4.1",
+    "@memberjunction/ng-base-forms": "~1.4.1",
+    "@memberjunction/ng-ask-skip": "~1.4.1",
+    "@memberjunction/ng-record-changes": "~1.4.1",
+    "@memberjunction/ng-container-directives": "~1.4.1",
+    "@progress/kendo-angular-buttons": "~15.1.0",
+    "@progress/kendo-angular-dialog": "~15.1.0",
+    "tslib": "^2.3.0"
+  },
+  "sideEffects": false
+}