@natec/mef-dev-ui-kit 16.2.4 → 16.2.48

package/lib/markup-kit/card/card/card.component.d.ts

@@ -17,7 +17,7 @@ import * as i0 from "@angular/core";
   * </mefdev-card>
   * ```
   *
-  * <example-url>https://mef.dev/ui_kit_demo/view/card</example-url>
+  * <example-url>https://mef.dev/ui_kit_demo/view/page_components/card/card</example-url>
   */
 export declare class CardComponent implements OnInit {
     private router;

package/lib/markup-kit/card/card-long/card-long.component.d.ts

@@ -33,7 +33,7 @@ import * as i0 from "@angular/core";
 * </mefdev-card-long>
 * ```
 *
-* <example-url>https://mef.dev/ui_kit_demo/view/card/card-long</example-url>
+* <example-url>https://mef.dev/ui_kit_demo/view/page_components/card/card_long</example-url>
 */
 export declare class CardLongComponent implements OnInit {
     private router;

package/lib/markup-kit/card/card-simple/card-simple.component.d.ts

@@ -12,7 +12,7 @@ import * as i0 from "@angular/core";
   * </mefdev-card-simple>
   *```
   *
-  * <example-url>https://mef.dev/ui_kit_demo/view/card/card-simple</example-url>
+  * <example-url>https://mef.dev/ui_kit_demo/view/page_components/card/card_simple</example-url>
   */
 export declare class CardSimpleComponent implements OnInit {
     /**

package/lib/markup-kit/card/card.module.d.ts

@@ -9,9 +9,9 @@ import * as i4 from "@angular/common";
 import * as i5 from "../collapse/collapse.module";
 import * as i6 from "../../pg-components/select/select.module";
 import * as i7 from "../../pg-components/card/card.module";
-export declare const mefDevCardComponents: (typeof CardLongComponent | typeof CardComponent | typeof CardSimpleComponent)[];
+export declare const mefDevCardComponents: (typeof CardComponent | typeof CardLongComponent | typeof CardSimpleComponent)[];
 export declare class MefDevCardModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<MefDevCardModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MefDevCardModule, [typeof i1.CardComponent, typeof i2.CardLongComponent, typeof i3.CardSimpleComponent], [typeof i4.CommonModule, typeof i5.MefDevCollapseModule, typeof i6.MefDevSelectModule, typeof i7.pgCardModule], [typeof i1.CardComponent, typeof i2.CardLongComponent, typeof i3.CardSimpleComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MefDevCardModule, [typeof i1.CardComponent, typeof i2.CardLongComponent, typeof i3.CardSimpleComponent], [typeof i4.CommonModule, typeof i5.MefDevCollapseModule, typeof i6.MefDevSelectModule, typeof i7.MefdevInnerCardModule], [typeof i1.CardComponent, typeof i2.CardLongComponent, typeof i3.CardSimpleComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<MefDevCardModule>;
 }

package/lib/markup-kit/collapse/collapse/collapse.component.d.ts

@@ -20,7 +20,7 @@ import * as i0 from "@angular/core";
   * </mefdev-collapse>
   *
   *```
-    * <example-url>https://mef.dev/ui_kit_demo/view/collapse/collapse</example-url>
+    * <example-url>https://mef.dev/ui_kit_demo/view/page_components/collapse</example-url>
 
   */
 export declare class CollapseComponent {

package/lib/markup-kit/executors/mefdev-executor-page/mefdev-executor-page.component.d.ts

@@ -1,12 +1,80 @@
 import { ElementRef, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
 import { StepExecutorComponent } from '../step-executor/step-executor.component';
 import * as i0 from "@angular/core";
+/**
+ * A component that allows us to create a content page - a step in our executor.
+ * Each individual step can have different styles, content and settings.
+ *
+ * Example of usage:
+ *
+ * ```
+ *  <mefdev-executor-page
+ *     [title]="'Executor title 1'"
+ *     [isActive]="mainExecutor.activePageInd === 0"
+ *     [isCompleted]="mainExecutor.activePageInd >= 0"
+ *     class="yourClass">
+ *      <!-- Content of the first executor step -->
+ *  </mefdev-executor-page>
+ *  <mefdev-executor-page
+ *     [title]="'Executor title 2'"
+ *     [isActive]="mainExecutor.activePageInd === 1"
+ *     [isCompleted]="mainExecutor.activePageInd >= 1"
+ *     class="yourClass">
+ *      <!-- Content of the second executor step -->
+ *  </mefdev-executor-page>
+ *  <mefdev-executor-page
+ *     [title]="'Executor title 3'"
+ *     [isActive]="mainExecutor.activePageInd === 2"
+ *     [isCompleted]="mainExecutor.activePageInd >= 2"
+ *     class="yourClass">
+ *      <!-- Content of the third executor step -->
+ *  </mefdev-executor-page>
+ * ```
+ *
+  */
 export declare class MefdevExecutorPageComponent implements OnChanges {
     private _mainExecutor;
     private _elementRef;
+    /**
+     * The title of the step
+     * @usageNotes
+     * ```
+     *  <mefdev-executor-page [title]="'Description of situation 1'"></mefdev-executor-page>
+     * ```
+     */
     title: string;
+    /**
+     * The input parameter that corresponds to whether the current step matches the respective page.
+     * The value of the active page is passed by reference from the specific component StepExecutorComponent.
+     *
+     * @usageNotes
+     * ```
+     *  <mefdev-step-executor #mainExecutor>
+     *    <mefdev-executor-page [isActive]="mainExecutor.activePageInd === 0">
+     *    <mefdev-executor-page [isActive]="mainExecutor.activePageInd === 1">
+     *    <mefdev-executor-page [isActive]="mainExecutor.activePageInd === 2">
+     *  </<mefdev-step-executor>
+     *
+     * ```
+     */
     isActive: boolean;
+    /**
+     * The input parameter that checks whether the step is completed.
+     *
+     * @usageNotes
+     * ```
+     *  <mefdev-executor-page [isCompleted]="mainExecutor.activePageInd >= 0"></mefdev-executor-page>
+     * ```
+     */
     isCompleted: boolean;
+    /**
+     * The output parameter that emits a boolean value indicating whether our completed step has changed.
+     *
+     * @usageNotes
+     * ```
+     *  <mefdev-executor-page (isCompletedChange)="onStepChanged($event)"></mefdev-executor-page>
+     * ```
+     */
     isCompletedChange: EventEmitter<boolean>;
     elRef: ElementRef;
     constructor(_mainExecutor: StepExecutorComponent, _elementRef: ElementRef);

package/lib/markup-kit/executors/stage/stage.component.d.ts

@@ -1,4 +1,7 @@
 import * as i0 from "@angular/core";
+/**
+ * @ignore
+ */
 export declare class StageComponent {
     currentExecutorStep: number;
     isRightModal: boolean;

package/lib/markup-kit/executors/step-executor/step-executor.component.d.ts

@@ -1,29 +1,186 @@
-import { AfterViewInit, ElementRef, EventEmitter, Renderer2, TemplateRef } from '@angular/core';
+import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, Renderer2, TemplateRef } from '@angular/core';
 import { MefdevExecutorPageComponent } from '../mefdev-executor-page/mefdev-executor-page.component';
 import * as i0 from "@angular/core";
+/**
+ * Wrapper component that represents a specific encapsulated executor.
+ *
+ * Example of usage:
+ *```
+ * <mefdev-step-executor #mainExecutor [view]="'regular'">
+ *
+ *  <ng-template #title>
+ *    <!-- Content for the executor title -->
+ *  </ng-template>
+ *  <ng-template #description>
+ *    <!-- Content for the executor description -->
+ *  </ng-template>
+ *
+ *  <mefdev-executor-page
+ *     [title]="'Description of situation 1'"
+ *     [isActive]="mainExecutor.activePageInd === 0"
+ *     [isCompleted]="mainExecutor.activePageInd >= 0">
+ *      <!-- Content of the first executor step -->
+ *  </mefdev-executor-page>
+ *  <mefdev-executor-page
+ *    [title]="'Description of situation 2'"
+ *    [isActive]="mainExecutor.activePageInd === 1"
+ *    [isCompleted]="mainExecutor.activePageInd >= 1">
+ *     <!-- Content of the second executor step -->
+ *  </mefdev-executor-page>
+ *  <mefdev-executor-page
+ *    [title]="'Description of situation 3'"
+ *    [isActive]="mainExecutor.activePageInd === 2"
+ *    [isCompleted]="mainExecutor.activePageInd >= 2">
+ *      <!-- Content of the third executor step -->
+ *  </mefdev-executor-page>
+ *
+ *  <ng-template #footer>
+ *    <!-- Content for the executor footer -->
+ *  <ng-template>
+ *
+ * </mefdev-step-executor>
+ *
+ *```
+ * <example-url>https://mef.dev/ui_kit_demo/view/utils/main_executor</example-url>
+ */
 export declare class StepExecutorComponent implements AfterViewInit {
     private renderer;
+    private changeDetectorRef;
+    /**
+     * Mandatory input parameter that specifies the type of the step-by-step wizard.
+     * It can have three options: regular, modal, right.
+     *
+     * @usageNotes
+     * ```
+     *  <mefdev-step-executor #mainExecutor [view]="'regular'"></mefdev-step-executor>
+     * ```
+     */
     view: string;
+    /**
+     * An optional input parameter that specifies whether to show your executor.
+     * Usually used when you have a slideup or right executor view
+     *
+     * @usageNotes
+     * ```
+     *  <mefdev-step-executor [show]="true" [view]="'right'" #mainExecutor></mefdev-step-executor>
+     * ```
+     */
+    show: boolean;
+    /**
+     * ViewChild reference to the host executor content.
+     */
     container: ElementRef<HTMLElement>;
+    /**
+     * Template for displaying the content of the executor title.
+     *
+     * @usageNotes
+     * ```
+     * <ng-template #title>
+     *   <!-- Content for the executor title -->
+     * </ng-template>
+     * ```
+     */
     title: TemplateRef<void>;
+    /**
+     * Template for displaying the content of the executor description.
+     *
+     * @usageNotes
+     * ```
+     * <ng-template #description>
+     *  <!-- Content for the executor description -->
+     * </ng-template>
+     * ```
+     */
     description: TemplateRef<void>;
+    /**
+     * Template for displaying the content of the executor footer.
+     *
+     * @usageNotes
+     * ```
+     * <ng-template #footer>
+     *    <!-- Content for the executor footer -->
+     * </ng-template>
+     * ```
+     */
     footer: TemplateRef<void>;
+    /**
+     * The output parameter that emits the class of the active page - active step.
+     *
+     * @usageNotes
+     * ```
+     *  <mefdev-step-executor #mainExecutor (onActivePageChange)="getActiveStep($event)"></mefdev-step-executor>
+     * ```
+     */
     onActivePageChange: EventEmitter<MefdevExecutorPageComponent>;
+    /**
+     * An output parameter that conveys the current state of the stepper in modal view
+     *
+     * @usageNotes
+     * ```
+     * <mefdev-step-executor [view]="'modal'" (modalStepExecutorStateChange)="getModalExecutorStateValue($event)" #modalExecutor></mefdev-step-executor>
+     * ```
+     */
+    modalStepExecutorStateChange: EventEmitter<boolean>;
+    /**
+     * An output parameter that conveys the current state of the stepper in right view
+     *
+     * @usageNotes
+     * ```
+     * <mefdev-step-executor [view]="'right'" (modalStepExecutorStateChange)="getModalExecutorStateValue($event)" #rightExecutor></mefdev-step-executor>
+     * ```
+     */
+    rightStepExecutorStateChange: EventEmitter<boolean>;
     _activePageInd: number;
     pages: MefdevExecutorPageComponent[];
-    constructor(renderer: Renderer2);
+    constructor(renderer: Renderer2, changeDetectorRef: ChangeDetectorRef);
     set activePageInd(activePageNumber: number);
     get activePageInd(): number;
     get activePage(): MefdevExecutorPageComponent | null;
     ngAfterViewInit(): void;
+    /**
+     * A function that is allows to track the status of your executor in the modal view
+     */
+    modalStepExecutorVisibleChange(value: boolean): void;
+    /**
+     * A function that is allows to track the status of your executor in the right view
+     */
+    rightStepExecutorVisibleChange(value: boolean): void;
+    /**
+     * A function that allows you to close your executor
+     */
+    closeExecutor(): void;
+    /**
+     * Check whether there is a next step of the executor. If we are at the last step - disable the 'next' button
+     */
     nextBtnIsDisabled(): boolean;
+    /**
+     * Check whether there is a next step of the executor. If we are at the last step - disable the 'next' button
+     */
     prev(): void;
+    /**
+     * Go back to the previous step
+     */
     cancel(): void;
+    /**
+     * Go to the next step
+     */
     next(): void;
+    /**
+     * Set a specific active page
+     */
     setActivePage(pageNumber: number): void;
+    /**
+     * Add new page
+     */
     addPage(page: MefdevExecutorPageComponent): void;
+    /**
+     * Delete a specific page
+     */
     removeSpecificPage(page: MefdevExecutorPageComponent): void;
+    /**
+     * Delete a page by its index
+     */
     removePageByIndex(index: number): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<StepExecutorComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<StepExecutorComponent, "mefdev-step-executor", never, { "view": { "alias": "view"; "required": true; }; }, { "onActivePageChange": "onActivePageChange"; }, ["title", "description", "footer"], never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<StepExecutorComponent, "mefdev-step-executor", never, { "view": { "alias": "view"; "required": true; }; "show": { "alias": "show"; "required": false; }; }, { "onActivePageChange": "onActivePageChange"; "modalStepExecutorStateChange": "modalStepExecutorStateChange"; "rightStepExecutorStateChange": "rightStepExecutorStateChange"; }, ["title", "description", "footer"], never, false, never>;
 }

package/lib/markup-kit/executors/step-executor.module.d.ts

@@ -2,10 +2,11 @@ import * as i0 from "@angular/core";
 import * as i1 from "./step-executor/step-executor.component";
 import * as i2 from "./mefdev-executor-page/mefdev-executor-page.component";
 import * as i3 from "./stage/stage.component";
-import * as i4 from "@angular/common";
-import * as i5 from "@angular/forms";
+import * as i4 from "../modals/markup-kit.module";
+import * as i5 from "@angular/common";
+import * as i6 from "@angular/forms";
 export declare class MefDevStepExecutorModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<MefDevStepExecutorModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MefDevStepExecutorModule, [typeof i1.StepExecutorComponent, typeof i2.MefdevExecutorPageComponent, typeof i3.StageComponent], [typeof i4.CommonModule, typeof i5.FormsModule], [typeof i1.StepExecutorComponent, typeof i2.MefdevExecutorPageComponent, typeof i3.StageComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MefDevStepExecutorModule, [typeof i1.StepExecutorComponent, typeof i2.MefdevExecutorPageComponent, typeof i3.StageComponent], [typeof i4.MefDevModalModule, typeof i5.CommonModule, typeof i6.FormsModule], [typeof i1.StepExecutorComponent, typeof i2.MefdevExecutorPageComponent, typeof i3.StageComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<MefDevStepExecutorModule>;
 }

package/lib/markup-kit/modals/fill/fill.component.d.ts

@@ -18,7 +18,7 @@ import * as i0 from "@angular/core";
   * </mefdev-fill-modal>
   * ```
   *
-  * <example-url>https://mef.dev/ui_kit_demo/view/modals/fill</example-url>
+  * <example-url>https://mef.dev/ui_kit_demo/view/page_components/modals/fill</example-url>
   */
 export declare class FillComponent implements OnInit {
     protected visible: boolean;

package/lib/markup-kit/modals/slide-right/slide-right.component.d.ts

@@ -19,7 +19,7 @@ import * as i0 from "@angular/core";
   *   </div>
   * </mefdev-slide-right-modal>
   * ```
-  * <example-url>https://mef.dev/ui_kit_demo/view/modals/slide-right</example-url>
+  * <example-url>https://mef.dev/ui_kit_demo/view/page_components/modals/slide_right</example-url>
   */
 export declare class SlideRightComponent implements OnInit {
     protected visible: boolean;

package/lib/markup-kit/modals/slide-up/slide-up.component.d.ts

@@ -18,7 +18,7 @@ import * as i0 from "@angular/core";
 *   </div>
 * </mefdev-slide-up-modal>
 * ```
-* <example-url>https://mef.dev/ui_kit_demo/view/modals/slide-up</example-url>
+* <example-url>https://mef.dev/ui_kit_demo/view/page_components/modals/slide_up</example-url>
 */
 export declare class SlideUpComponent implements OnInit {
     protected visible: boolean;

package/lib/markup-kit/page-layouts/central-page/central-page.component.d.ts

@@ -11,7 +11,7 @@ import * as i0 from "@angular/core";
   * </mefdev-central-page>
   * ```
   *
-  * <example-url>https://mef.dev/ui_kit_demo/view/page-layouts/central-page</example-url>
+  * <example-url>https://mef.dev/ui_kit_demo/view/page_layouts/central_page</example-url>
   */
 export declare class CentralPageComponent implements OnInit, OnDestroy, AfterViewChecked {
     constructor();

package/lib/markup-kit/page-layouts/manage-page/manage-page.component.d.ts

@@ -17,7 +17,7 @@ import * as i0 from "@angular/core";
 * ```
 *
 * Example of usage:
-* <example-url>https://mef.dev/ui_kit_demo/view/page-layouts/menage-page</example-url>
+* <example-url>https://mef.dev/ui_kit_demo/view/page_layouts/manage_page</example-url>
 */
 export declare class ManagePageComponent implements OnInit {
     /**

package/lib/markup-kit/page-layouts/profile/profile.component.d.ts

@@ -24,7 +24,7 @@ import * as i0 from "@angular/core";
  * </mefdev-profile>
  * ```
  *
-  * <example-url>https://mef.dev/ui_kit_demo/view/page-layouts/profile</example-url>
+  * <example-url>https://mef.dev/ui_kit_demo/view/page_layouts/profile</example-url>
   */
 export declare class ProfileComponent implements OnInit {
     /**

package/lib/markup-kit/page-layouts/table-page/table-page.component.d.ts

@@ -13,7 +13,7 @@ import * as i0 from "@angular/core";
 * </mefdev-table-page>
 * ```
 *
-* <example-url>https://mef.dev/ui_kit_demo/view/page-layouts/table-page</example-url>
+* <example-url>https://mef.dev/ui_kit_demo/view/page_layouts/table_page</example-url>
 */
 export declare class TablePageComponent implements OnInit {
     /**

package/lib/markup-kit/slider/slider/slider.component.d.ts

@@ -10,7 +10,7 @@ import * as i0 from "@angular/core";
  *  (valueChange)="onChildValueChange($event)"
  *  ></mefdev-slider>
  *
- * <example-url>https://mef.dev/ui_kit_demo/view/typography/slider</example-url>
+ * <example-url>https://mef.dev/ui_kit_demo/view/controls/slider</example-url>
 */
 export declare class MefDevSliderComponent {
     private _range;