@entake/particle 21.1.1 → 21.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9120,7 +9120,10 @@ class TemplatedDialog {
9120
9120
  showMaximize = input(true, ...(ngDevMode ? [{ debugName: "showMaximize" }] : []));
9121
9121
  subheaderTemplate = input(null, ...(ngDevMode ? [{ debugName: "subheaderTemplate" }] : []));
9122
9122
  contentTemplate = input(null, ...(ngDevMode ? [{ debugName: "contentTemplate" }] : []));
9123
+ leftSidebarTemplate = input(null, ...(ngDevMode ? [{ debugName: "leftSidebarTemplate" }] : []));
9124
+ mainAreaTemplate = input(null, ...(ngDevMode ? [{ debugName: "mainAreaTemplate" }] : []));
9123
9125
  footerTemplate = input(null, ...(ngDevMode ? [{ debugName: "footerTemplate" }] : []));
9126
+ leftSidebarClassList = input(null, ...(ngDevMode ? [{ debugName: "leftSidebarClassList" }] : []));
9124
9127
  closed = output();
9125
9128
  confirmationDialog = null;
9126
9129
  open() {
@@ -9139,22 +9142,66 @@ class TemplatedDialog {
9139
9142
  }
9140
9143
  }
9141
9144
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: TemplatedDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
9142
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: TemplatedDialog, isStandalone: true, selector: "particle-templated-dialog", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: false, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, checkUnsavedChanges: { classPropertyName: "checkUnsavedChanges", publicName: "checkUnsavedChanges", isSignal: true, isRequired: false, transformFunction: null }, showMaximize: { classPropertyName: "showMaximize", publicName: "showMaximize", isSignal: true, isRequired: false, transformFunction: null }, subheaderTemplate: { classPropertyName: "subheaderTemplate", publicName: "subheaderTemplate", isSignal: true, isRequired: false, transformFunction: null }, contentTemplate: { classPropertyName: "contentTemplate", publicName: "contentTemplate", isSignal: true, isRequired: false, transformFunction: null }, footerTemplate: { classPropertyName: "footerTemplate", publicName: "footerTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed" }, viewQueries: [{ propertyName: "confirmationDialog", first: true, predicate: ["confirmationDialog"], descendants: true }], ngImport: i0, template: "<particle-dialog\n [object]=\"dialogOpen\"\n [showTitle]=\"false\"\n [allowClose]=\"false\"\n [width]=\"width()\"\n [height]=\"height()\"\n (closed)=\"checkClose()\"\n (closeAttempt)=\"checkClose()\"\n #dialog\n>\n <div class=\"row_block width100 height100 body_color\">\n <div class=\"row column height100\">\n <div class=\"col\">\n <div class=\"row header_color ptl_brdr_color border_bottom min_h50 v_center pad_right10 pad_left5 hide_element\">\n <div class=\"col size_1 v_center pad_lr5\">\n <div class=\"square_40px\" innerHTML=\"<i class='{{icon()}}'></i>\"></div>\n <div class=\"row_block mar_lr5\">\n <div class=\"min_h10 min_w2 bg_logo_1\"></div>\n <div class=\"min_h10 min_w2 bg_logo_2\"></div>\n <div class=\"min_h10 min_w2 bg_logo_3\"></div>\n </div>\n <div class=\"text lg text_left text_wrap bold pad_lr5\">\n {{title()}}\n </div>\n </div>\n <div class=\"col row rc_gap min_w30 top_center\">\n @if (showMaximize()) {\n <button class=\"access btn clear\"\n [attr.aria-label]=\"text().maximize\"\n (click)=\"dialog.toggleMaximize()\"\n >\n <div class=\"circle_26px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-expand\"></i></div>\n </button>\n }\n <button class=\"access btn clear\" [attr.aria-label]=\"text().close\" (click)=\"checkClose()\" >\n <div class=\"circle_26px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-xmark\"></i></div>\n </button>\n </div>\n </div>\n <div class=\"row header_color min_h50 v_center pad_right10 pad_tb5 pad_left5 mobile_only_flex\">\n <div class=\"col size_1 v_center pad_lr5\">\n <div class=\"square_30px\" innerHTML=\"<i class='{{icon()}}'></i>\"></div>\n <div class=\"row_block mar_lr5\">\n <div class=\"min_h5 min_w2 bg_logo_1\"></div>\n <div class=\"min_h5 min_w2 bg_logo_2\"></div>\n <div class=\"min_h5 min_w2 bg_logo_3\"></div>\n </div>\n <div class=\"text md text_left text_wrap bold pad_lr5\">\n {{title()}}\n </div>\n </div>\n <div class=\"col row rc_gap min_w30 top_center\">\n <button class=\"access btn clear\" [attr.aria-label]=\"text().close\" (click)=\"checkClose()\" >\n <div class=\"circle_30px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-xmark\"></i></div>\n </button>\n </div>\n </div>\n </div>\n\n <!-- CONTENT -->\n <div class=\"col size_1 body_color\" style=\"height: calc(100% - 50px);\">\n <div class=\"row_block width100 height100\">\n <div class=\"row_block width100 body_color height100\">\n <div class=\"row column content_color height100\">\n <div class=\"col ptl_brdr_color border_bottom pad_10 body_color_dark_2 min_h25 v_center\">\n @if (subheaderTemplate()) {\n <ng-container *ngTemplateOutlet=\"subheaderTemplate()\"></ng-container>\n } @else {\n <div class=\"text md text_left text_wrap\">\n {{description()}}\n </div>\n }\n </div>\n <div class=\"col size_1 column scroll_yauto body_color pad_10\">\n <div class=\"col size_1 column rc_gap ptl_brdr_color ptl_brdr_radius ptl_brdr_size pad_10 content_color\">\n <ng-container *ngTemplateOutlet=\"contentTemplate()\"></ng-container>\n </div>\n </div>\n <div class=\"col min_h50 ptl_brdr_color border_top pad_tb5 pad_lr10 footer_color\">\n <ng-container *ngTemplateOutlet=\"footerTemplate()\"></ng-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</particle-dialog>\n\n<particle-confirmation-dialog (confirmed)=\"close()\" #confirmationDialog></particle-confirmation-dialog>\n", dependencies: [{ kind: "component", type: ConfirmationDialog, selector: "particle-confirmation-dialog", inputs: ["iconClass", "width", "height", "text"], outputs: ["confirmed", "closed"] }, { kind: "component", type: DialogComponent, selector: "particle-dialog", inputs: ["object", "title", "titleClass", "showTitle", "allowClose", "bodyClass", "height", "width", "borderRadius", "text"], outputs: ["closed", "closeAttempt", "opened"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
9145
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: TemplatedDialog, isStandalone: true, selector: "particle-templated-dialog", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: false, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, checkUnsavedChanges: { classPropertyName: "checkUnsavedChanges", publicName: "checkUnsavedChanges", isSignal: true, isRequired: false, transformFunction: null }, showMaximize: { classPropertyName: "showMaximize", publicName: "showMaximize", isSignal: true, isRequired: false, transformFunction: null }, subheaderTemplate: { classPropertyName: "subheaderTemplate", publicName: "subheaderTemplate", isSignal: true, isRequired: false, transformFunction: null }, contentTemplate: { classPropertyName: "contentTemplate", publicName: "contentTemplate", isSignal: true, isRequired: false, transformFunction: null }, leftSidebarTemplate: { classPropertyName: "leftSidebarTemplate", publicName: "leftSidebarTemplate", isSignal: true, isRequired: false, transformFunction: null }, mainAreaTemplate: { classPropertyName: "mainAreaTemplate", publicName: "mainAreaTemplate", isSignal: true, isRequired: false, transformFunction: null }, footerTemplate: { classPropertyName: "footerTemplate", publicName: "footerTemplate", isSignal: true, isRequired: false, transformFunction: null }, leftSidebarClassList: { classPropertyName: "leftSidebarClassList", publicName: "leftSidebarClassList", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed" }, viewQueries: [{ propertyName: "confirmationDialog", first: true, predicate: ["confirmationDialog"], descendants: true }], ngImport: i0, template: "<particle-dialog\n [object]=\"dialogOpen\"\n [showTitle]=\"false\"\n [allowClose]=\"false\"\n [width]=\"width()\"\n [height]=\"height()\"\n (closed)=\"checkClose()\"\n (closeAttempt)=\"checkClose()\"\n #dialog\n>\n <div class=\"row_block width100 height100 body_color\">\n <div class=\"row column height100\">\n <div class=\"col\">\n <div class=\"row header_color ptl_brdr_color border_bottom min_h50 v_center pad_right10 pad_left5 hide_element\">\n <div class=\"col size_1 v_center pad_lr5\">\n <div class=\"square_40px\" innerHTML=\"<i class='{{icon()}}'></i>\"></div>\n <div class=\"row_block mar_lr5\">\n <div class=\"min_h10 min_w2 bg_logo_1\"></div>\n <div class=\"min_h10 min_w2 bg_logo_2\"></div>\n <div class=\"min_h10 min_w2 bg_logo_3\"></div>\n </div>\n <div class=\"text lg text_left text_wrap bold pad_lr5\">\n {{title()}}\n </div>\n </div>\n <div class=\"col row rc_gap min_w30 top_center\">\n @if (showMaximize()) {\n <button class=\"access btn clear\"\n [attr.aria-label]=\"text().maximize\"\n (click)=\"dialog.toggleMaximize()\"\n >\n <div class=\"circle_26px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-expand\"></i></div>\n </button>\n }\n <button class=\"access btn clear\" [attr.aria-label]=\"text().close\" (click)=\"checkClose()\" >\n <div class=\"circle_26px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-xmark\"></i></div>\n </button>\n </div>\n </div>\n <div class=\"row header_color min_h50 v_center pad_right10 pad_tb5 pad_left5 mobile_only_flex\">\n <div class=\"col size_1 v_center pad_lr5\">\n <div class=\"square_30px\" innerHTML=\"<i class='{{icon()}}'></i>\"></div>\n <div class=\"row_block mar_lr5\">\n <div class=\"min_h5 min_w2 bg_logo_1\"></div>\n <div class=\"min_h5 min_w2 bg_logo_2\"></div>\n <div class=\"min_h5 min_w2 bg_logo_3\"></div>\n </div>\n <div class=\"text md text_left text_wrap bold pad_lr5\">\n {{title()}}\n </div>\n </div>\n <div class=\"col row rc_gap min_w30 top_center\">\n <button class=\"access btn clear\" [attr.aria-label]=\"text().close\" (click)=\"checkClose()\" >\n <div class=\"circle_30px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-xmark\"></i></div>\n </button>\n </div>\n </div>\n </div>\n\n <!-- CONTENT -->\n <div class=\"col size_1 body_color\" style=\"height: calc(100% - 50px);\">\n <div class=\"row_block width100 height100\">\n <div class=\"row_block width100 body_color height100\">\n <div class=\"row column content_color height100\">\n <div class=\"col ptl_brdr_color border_bottom pad_10 body_color_dark_2 min_h25 v_center\">\n @if (subheaderTemplate()) {\n <ng-container *ngTemplateOutlet=\"subheaderTemplate()\"></ng-container>\n } @else {\n <div class=\"text md text_left text_wrap\">\n {{description()}}\n </div>\n }\n </div>\n @if (!!contentTemplate()) {\n <div class=\"col size_1 column scroll_yauto body_color pad_10\">\n <div class=\"col size_1 column rc_gap ptl_brdr_color ptl_brdr_radius ptl_brdr_size pad_10 content_color\">\n <ng-container *ngTemplateOutlet=\"contentTemplate()\"></ng-container>\n </div>\n </div>\n } @else {\n <div class=\"col size_1 row scroll_yauto\">\n <div class=\"col ptl_brdr_color ptl_brdr_size border_right min_w200 scroll_yauto\">\n <div class=\"row_block width100 height_100\" [ngClass]=\"leftSidebarClassList()\">\n <ng-container *ngTemplateOutlet=\"leftSidebarTemplate()\"></ng-container>\n </div>\n </div>\n <div class=\"col size_1 column scroll_yauto body_color pad_10\">\n <div class=\"col size_1 column rc_gap ptl_brdr_color ptl_brdr_radius ptl_brdr_size pad_10 content_color\">\n <ng-container *ngTemplateOutlet=\"mainAreaTemplate()\"></ng-container>\n </div>\n </div>\n </div>\n }\n <div class=\"col min_h50 ptl_brdr_color border_top pad_tb5 pad_lr10 footer_color\">\n <ng-container *ngTemplateOutlet=\"footerTemplate()\"></ng-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</particle-dialog>\n\n<particle-confirmation-dialog (confirmed)=\"close()\" #confirmationDialog></particle-confirmation-dialog>\n", dependencies: [{ kind: "component", type: ConfirmationDialog, selector: "particle-confirmation-dialog", inputs: ["iconClass", "width", "height", "text"], outputs: ["confirmed", "closed"] }, { kind: "component", type: DialogComponent, selector: "particle-dialog", inputs: ["object", "title", "titleClass", "showTitle", "allowClose", "bodyClass", "height", "width", "borderRadius", "text"], outputs: ["closed", "closeAttempt", "opened"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
9143
9146
  }
9144
9147
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: TemplatedDialog, decorators: [{
9145
9148
  type: Component,
9146
9149
  args: [{ selector: 'particle-templated-dialog', imports: [
9147
9150
  ConfirmationDialog,
9148
9151
  DialogComponent,
9149
- NgTemplateOutlet
9150
- ], template: "<particle-dialog\n [object]=\"dialogOpen\"\n [showTitle]=\"false\"\n [allowClose]=\"false\"\n [width]=\"width()\"\n [height]=\"height()\"\n (closed)=\"checkClose()\"\n (closeAttempt)=\"checkClose()\"\n #dialog\n>\n <div class=\"row_block width100 height100 body_color\">\n <div class=\"row column height100\">\n <div class=\"col\">\n <div class=\"row header_color ptl_brdr_color border_bottom min_h50 v_center pad_right10 pad_left5 hide_element\">\n <div class=\"col size_1 v_center pad_lr5\">\n <div class=\"square_40px\" innerHTML=\"<i class='{{icon()}}'></i>\"></div>\n <div class=\"row_block mar_lr5\">\n <div class=\"min_h10 min_w2 bg_logo_1\"></div>\n <div class=\"min_h10 min_w2 bg_logo_2\"></div>\n <div class=\"min_h10 min_w2 bg_logo_3\"></div>\n </div>\n <div class=\"text lg text_left text_wrap bold pad_lr5\">\n {{title()}}\n </div>\n </div>\n <div class=\"col row rc_gap min_w30 top_center\">\n @if (showMaximize()) {\n <button class=\"access btn clear\"\n [attr.aria-label]=\"text().maximize\"\n (click)=\"dialog.toggleMaximize()\"\n >\n <div class=\"circle_26px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-expand\"></i></div>\n </button>\n }\n <button class=\"access btn clear\" [attr.aria-label]=\"text().close\" (click)=\"checkClose()\" >\n <div class=\"circle_26px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-xmark\"></i></div>\n </button>\n </div>\n </div>\n <div class=\"row header_color min_h50 v_center pad_right10 pad_tb5 pad_left5 mobile_only_flex\">\n <div class=\"col size_1 v_center pad_lr5\">\n <div class=\"square_30px\" innerHTML=\"<i class='{{icon()}}'></i>\"></div>\n <div class=\"row_block mar_lr5\">\n <div class=\"min_h5 min_w2 bg_logo_1\"></div>\n <div class=\"min_h5 min_w2 bg_logo_2\"></div>\n <div class=\"min_h5 min_w2 bg_logo_3\"></div>\n </div>\n <div class=\"text md text_left text_wrap bold pad_lr5\">\n {{title()}}\n </div>\n </div>\n <div class=\"col row rc_gap min_w30 top_center\">\n <button class=\"access btn clear\" [attr.aria-label]=\"text().close\" (click)=\"checkClose()\" >\n <div class=\"circle_30px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-xmark\"></i></div>\n </button>\n </div>\n </div>\n </div>\n\n <!-- CONTENT -->\n <div class=\"col size_1 body_color\" style=\"height: calc(100% - 50px);\">\n <div class=\"row_block width100 height100\">\n <div class=\"row_block width100 body_color height100\">\n <div class=\"row column content_color height100\">\n <div class=\"col ptl_brdr_color border_bottom pad_10 body_color_dark_2 min_h25 v_center\">\n @if (subheaderTemplate()) {\n <ng-container *ngTemplateOutlet=\"subheaderTemplate()\"></ng-container>\n } @else {\n <div class=\"text md text_left text_wrap\">\n {{description()}}\n </div>\n }\n </div>\n <div class=\"col size_1 column scroll_yauto body_color pad_10\">\n <div class=\"col size_1 column rc_gap ptl_brdr_color ptl_brdr_radius ptl_brdr_size pad_10 content_color\">\n <ng-container *ngTemplateOutlet=\"contentTemplate()\"></ng-container>\n </div>\n </div>\n <div class=\"col min_h50 ptl_brdr_color border_top pad_tb5 pad_lr10 footer_color\">\n <ng-container *ngTemplateOutlet=\"footerTemplate()\"></ng-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</particle-dialog>\n\n<particle-confirmation-dialog (confirmed)=\"close()\" #confirmationDialog></particle-confirmation-dialog>\n" }]
9152
+ NgTemplateOutlet,
9153
+ NgClass
9154
+ ], template: "<particle-dialog\n [object]=\"dialogOpen\"\n [showTitle]=\"false\"\n [allowClose]=\"false\"\n [width]=\"width()\"\n [height]=\"height()\"\n (closed)=\"checkClose()\"\n (closeAttempt)=\"checkClose()\"\n #dialog\n>\n <div class=\"row_block width100 height100 body_color\">\n <div class=\"row column height100\">\n <div class=\"col\">\n <div class=\"row header_color ptl_brdr_color border_bottom min_h50 v_center pad_right10 pad_left5 hide_element\">\n <div class=\"col size_1 v_center pad_lr5\">\n <div class=\"square_40px\" innerHTML=\"<i class='{{icon()}}'></i>\"></div>\n <div class=\"row_block mar_lr5\">\n <div class=\"min_h10 min_w2 bg_logo_1\"></div>\n <div class=\"min_h10 min_w2 bg_logo_2\"></div>\n <div class=\"min_h10 min_w2 bg_logo_3\"></div>\n </div>\n <div class=\"text lg text_left text_wrap bold pad_lr5\">\n {{title()}}\n </div>\n </div>\n <div class=\"col row rc_gap min_w30 top_center\">\n @if (showMaximize()) {\n <button class=\"access btn clear\"\n [attr.aria-label]=\"text().maximize\"\n (click)=\"dialog.toggleMaximize()\"\n >\n <div class=\"circle_26px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-expand\"></i></div>\n </button>\n }\n <button class=\"access btn clear\" [attr.aria-label]=\"text().close\" (click)=\"checkClose()\" >\n <div class=\"circle_26px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-xmark\"></i></div>\n </button>\n </div>\n </div>\n <div class=\"row header_color min_h50 v_center pad_right10 pad_tb5 pad_left5 mobile_only_flex\">\n <div class=\"col size_1 v_center pad_lr5\">\n <div class=\"square_30px\" innerHTML=\"<i class='{{icon()}}'></i>\"></div>\n <div class=\"row_block mar_lr5\">\n <div class=\"min_h5 min_w2 bg_logo_1\"></div>\n <div class=\"min_h5 min_w2 bg_logo_2\"></div>\n <div class=\"min_h5 min_w2 bg_logo_3\"></div>\n </div>\n <div class=\"text md text_left text_wrap bold pad_lr5\">\n {{title()}}\n </div>\n </div>\n <div class=\"col row rc_gap min_w30 top_center\">\n <button class=\"access btn clear\" [attr.aria-label]=\"text().close\" (click)=\"checkClose()\" >\n <div class=\"circle_30px cancel_button_color ptl_brdr_color ptl_brdr_size\"><i class=\"fas fa-xmark\"></i></div>\n </button>\n </div>\n </div>\n </div>\n\n <!-- CONTENT -->\n <div class=\"col size_1 body_color\" style=\"height: calc(100% - 50px);\">\n <div class=\"row_block width100 height100\">\n <div class=\"row_block width100 body_color height100\">\n <div class=\"row column content_color height100\">\n <div class=\"col ptl_brdr_color border_bottom pad_10 body_color_dark_2 min_h25 v_center\">\n @if (subheaderTemplate()) {\n <ng-container *ngTemplateOutlet=\"subheaderTemplate()\"></ng-container>\n } @else {\n <div class=\"text md text_left text_wrap\">\n {{description()}}\n </div>\n }\n </div>\n @if (!!contentTemplate()) {\n <div class=\"col size_1 column scroll_yauto body_color pad_10\">\n <div class=\"col size_1 column rc_gap ptl_brdr_color ptl_brdr_radius ptl_brdr_size pad_10 content_color\">\n <ng-container *ngTemplateOutlet=\"contentTemplate()\"></ng-container>\n </div>\n </div>\n } @else {\n <div class=\"col size_1 row scroll_yauto\">\n <div class=\"col ptl_brdr_color ptl_brdr_size border_right min_w200 scroll_yauto\">\n <div class=\"row_block width100 height_100\" [ngClass]=\"leftSidebarClassList()\">\n <ng-container *ngTemplateOutlet=\"leftSidebarTemplate()\"></ng-container>\n </div>\n </div>\n <div class=\"col size_1 column scroll_yauto body_color pad_10\">\n <div class=\"col size_1 column rc_gap ptl_brdr_color ptl_brdr_radius ptl_brdr_size pad_10 content_color\">\n <ng-container *ngTemplateOutlet=\"mainAreaTemplate()\"></ng-container>\n </div>\n </div>\n </div>\n }\n <div class=\"col min_h50 ptl_brdr_color border_top pad_tb5 pad_lr10 footer_color\">\n <ng-container *ngTemplateOutlet=\"footerTemplate()\"></ng-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</particle-dialog>\n\n<particle-confirmation-dialog (confirmed)=\"close()\" #confirmationDialog></particle-confirmation-dialog>\n" }]
9151
9155
  }], propDecorators: { data: [{
9152
9156
  type: Input
9153
- }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], checkUnsavedChanges: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkUnsavedChanges", required: false }] }], showMaximize: [{ type: i0.Input, args: [{ isSignal: true, alias: "showMaximize", required: false }] }], subheaderTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "subheaderTemplate", required: false }] }], contentTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentTemplate", required: false }] }], footerTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerTemplate", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }], confirmationDialog: [{
9157
+ }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], checkUnsavedChanges: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkUnsavedChanges", required: false }] }], showMaximize: [{ type: i0.Input, args: [{ isSignal: true, alias: "showMaximize", required: false }] }], subheaderTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "subheaderTemplate", required: false }] }], contentTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentTemplate", required: false }] }], leftSidebarTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "leftSidebarTemplate", required: false }] }], mainAreaTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "mainAreaTemplate", required: false }] }], footerTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerTemplate", required: false }] }], leftSidebarClassList: [{ type: i0.Input, args: [{ isSignal: true, alias: "leftSidebarClassList", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }], confirmationDialog: [{
9154
9158
  type: ViewChild,
9155
9159
  args: ['confirmationDialog']
9156
9160
  }] } });
9157
9161
 
9162
+ class ContextMenuComponent {
9163
+ title = model(null, ...(ngDevMode ? [{ debugName: "title" }] : []));
9164
+ entries = model(null, ...(ngDevMode ? [{ debugName: "entries" }] : []));
9165
+ width = input('175', ...(ngDevMode ? [{ debugName: "width" }] : []));
9166
+ height = input('auto', ...(ngDevMode ? [{ debugName: "height" }] : []));
9167
+ openDirection = input('below', ...(ngDevMode ? [{ debugName: "openDirection" }] : []));
9168
+ scaleForMobile = input(1.5, ...(ngDevMode ? [{ debugName: "scaleForMobile" }] : []));
9169
+ selected = output();
9170
+ closed = output();
9171
+ popover = null;
9172
+ window = window;
9173
+ get mobileWidth() {
9174
+ return (+this.width() * this.scaleForMobile()) + '';
9175
+ }
9176
+ get mobileHeight() {
9177
+ const height = this.height();
9178
+ if (height !== 'auto') {
9179
+ return (+height * this.scaleForMobile()) + '';
9180
+ }
9181
+ return height;
9182
+ }
9183
+ toggle(event) {
9184
+ this.popover.toggle(event);
9185
+ }
9186
+ close() {
9187
+ this.popover.close();
9188
+ }
9189
+ handleSelection(event, key) {
9190
+ event.stopImmediatePropagation();
9191
+ this.selected.emit(key);
9192
+ this.popover.close();
9193
+ }
9194
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
9195
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ContextMenuComponent, isStandalone: true, selector: "particle-context-menu", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, entries: { classPropertyName: "entries", publicName: "entries", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, openDirection: { classPropertyName: "openDirection", publicName: "openDirection", isSignal: true, isRequired: false, transformFunction: null }, scaleForMobile: { classPropertyName: "scaleForMobile", publicName: "scaleForMobile", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { title: "titleChange", entries: "entriesChange", selected: "selected", closed: "closed" }, viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true }], ngImport: i0, template: "<particle-popover\n [width]=\"window.innerWidth > 768 ? width() : mobileWidth\"\n [height]=\"window.innerWidth > 768 ? height() : mobileHeight\"\n classList=\"footer_color particle_popover_shadow\"\n [openDirection]=\"openDirection()\"\n alignment=\"center\"\n (closed)=\"closed.emit()\"\n #popover\n>\n <div class=\"row column rc_meta_gap width100 height100 footer_color pad_bot10\"\n style=\"cursor: default;user-select: none;\"\n >\n <div class=\"col\">\n <div class=\"row v_center header_color min_h30 ent_r2l_dir\">\n <div class=\"text bold text_wrap text_left ent_r2l_txt\"\n [ngClass]=\"window.innerWidth > 768 ? 'md pad_lr10' : 'lg pad_10'\">{{ title() }}\n </div>\n </div>\n </div>\n @if (entries()) {\n @for (entry of entries(); track $index) {\n <button class=\"access btnset clear width100 hov_glow\"\n [style.cursor]=\"entry.disabled ? 'not-allowed' : ''\"\n [disabled]=\"entry.disabled\"\n (click)=\"handleSelection($event, entry.key)\"\n >\n <div class=\"row rc_meta_gap min_h25 v_center ent_r2l_dir\">\n @if (entry.icon) {\n <div class=\"col square_20px mar_left5 ent_r2l_ico\"\n innerHTML=\"<i class='{{entry.icon}}'></i>\"\n ></div>\n }\n <div class=\"col size_1\" [ngClass]=\"!entry.icon ? 'mar_left5' : ''\">\n <div class=\"text text_left text_wrap ent_r2l_txt\"\n [ngClass]=\"window.innerWidth > 768 ? 'md' : 'lg pad_tb5'\"\n >\n {{ entry.text }}\n </div>\n </div>\n </div>\n </button>\n }\n }\n </div>\n</particle-popover>\n", dependencies: [{ kind: "component", type: PopoverComponent, selector: "particle-popover", inputs: ["offset", "width", "height", "classList", "targetOverride", "openDirection", "alignment", "scaleForMobile"], outputs: ["opened", "closed", "arrowDown", "arrowUp"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
9196
+ }
9197
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ContextMenuComponent, decorators: [{
9198
+ type: Component,
9199
+ args: [{ selector: 'particle-context-menu', imports: [PopoverComponent, NgClass], template: "<particle-popover\n [width]=\"window.innerWidth > 768 ? width() : mobileWidth\"\n [height]=\"window.innerWidth > 768 ? height() : mobileHeight\"\n classList=\"footer_color particle_popover_shadow\"\n [openDirection]=\"openDirection()\"\n alignment=\"center\"\n (closed)=\"closed.emit()\"\n #popover\n>\n <div class=\"row column rc_meta_gap width100 height100 footer_color pad_bot10\"\n style=\"cursor: default;user-select: none;\"\n >\n <div class=\"col\">\n <div class=\"row v_center header_color min_h30 ent_r2l_dir\">\n <div class=\"text bold text_wrap text_left ent_r2l_txt\"\n [ngClass]=\"window.innerWidth > 768 ? 'md pad_lr10' : 'lg pad_10'\">{{ title() }}\n </div>\n </div>\n </div>\n @if (entries()) {\n @for (entry of entries(); track $index) {\n <button class=\"access btnset clear width100 hov_glow\"\n [style.cursor]=\"entry.disabled ? 'not-allowed' : ''\"\n [disabled]=\"entry.disabled\"\n (click)=\"handleSelection($event, entry.key)\"\n >\n <div class=\"row rc_meta_gap min_h25 v_center ent_r2l_dir\">\n @if (entry.icon) {\n <div class=\"col square_20px mar_left5 ent_r2l_ico\"\n innerHTML=\"<i class='{{entry.icon}}'></i>\"\n ></div>\n }\n <div class=\"col size_1\" [ngClass]=\"!entry.icon ? 'mar_left5' : ''\">\n <div class=\"text text_left text_wrap ent_r2l_txt\"\n [ngClass]=\"window.innerWidth > 768 ? 'md' : 'lg pad_tb5'\"\n >\n {{ entry.text }}\n </div>\n </div>\n </div>\n </button>\n }\n }\n </div>\n</particle-popover>\n" }]
9200
+ }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }, { type: i0.Output, args: ["titleChange"] }], entries: [{ type: i0.Input, args: [{ isSignal: true, alias: "entries", required: false }] }, { type: i0.Output, args: ["entriesChange"] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], openDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "openDirection", required: false }] }], scaleForMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "scaleForMobile", required: false }] }], selected: [{ type: i0.Output, args: ["selected"] }], closed: [{ type: i0.Output, args: ["closed"] }], popover: [{
9201
+ type: ViewChild,
9202
+ args: ['popover']
9203
+ }] } });
9204
+
9158
9205
  /**
9159
9206
  * This interceptor will force the Content-Type header to application/json so that each http call doesn't have to.
9160
9207
  */
@@ -9788,7 +9835,7 @@ class ThemingService {
9788
9835
  element.setAttribute('href', `https://use.typekit.net/${font.id}.css`);
9789
9836
  }
9790
9837
  else {
9791
- element.setAttribute('href', `https://fonts.googleapis.com/css?family=${font.name.replace(' ', '+')}&display=swap`);
9838
+ element.setAttribute('href', `https://fonts.googleapis.com/css2?family=${font.name.replace(' ', '+')}:ital,wght@0,100..900;1,100..900&display=swap`);
9792
9839
  }
9793
9840
  element.setAttribute('rel', 'stylesheet');
9794
9841
  head.appendChild(element);
@@ -9955,5 +10002,5 @@ class ObservableContainer {
9955
10002
  * Generated bundle index. Do not edit.
9956
10003
  */
9957
10004
 
9958
- export { AccordionComponent, AccordionContentDirective, AccordionHeaderDirective, AccordionItemDirective, AutoCompleteInput, BackgroundCarouselDirective, BaseDataService, CalendarComponent, CheckboxComponent, ColorPickerComponent, ConfirmationDialog, DatePickerComponent, DateRangePickerComponent, DialogComponent, DialogService, DropdownComponent, INPUTMASK_VALUE_ACCESSOR, IconSelectComponent, IdleTimeoutComponent, InputMaskComponent, JsonInterceptor, KeyfilterDirective, LayoutFullFramingComponent, LayoutFullwidthSidebarComponent, LoaderComponent, LocalStorageService, MultiSelectComponent, NotificationComponent, NotificationService, ObservableContainer, OrdinalNumberPipe, PaginatorComponent, ParticleIconsModule, PopoverComponent, ProfilePicComponent, ProgressBarComponent, RICH_TEXT_VALUE_ACCESSOR, RadioButtonsComponent, RichTextComponent, ScrollToTopComponent, SlideoverComponent, SliderComponent, TemplatedDialog, ThemeChangeDetectionService, ThemingService, ToggleSwitchComponent, TooltipDirective, WeekPickerComponent, Z_INDEX_LAYERS };
10005
+ export { AccordionComponent, AccordionContentDirective, AccordionHeaderDirective, AccordionItemDirective, AutoCompleteInput, BackgroundCarouselDirective, BaseDataService, CalendarComponent, CheckboxComponent, ColorPickerComponent, ConfirmationDialog, ContextMenuComponent, DatePickerComponent, DateRangePickerComponent, DialogComponent, DialogService, DropdownComponent, INPUTMASK_VALUE_ACCESSOR, IconSelectComponent, IdleTimeoutComponent, InputMaskComponent, JsonInterceptor, KeyfilterDirective, LayoutFullFramingComponent, LayoutFullwidthSidebarComponent, LoaderComponent, LocalStorageService, MultiSelectComponent, NotificationComponent, NotificationService, ObservableContainer, OrdinalNumberPipe, PaginatorComponent, ParticleIconsModule, PopoverComponent, ProfilePicComponent, ProgressBarComponent, RICH_TEXT_VALUE_ACCESSOR, RadioButtonsComponent, RichTextComponent, ScrollToTopComponent, SlideoverComponent, SliderComponent, TemplatedDialog, ThemeChangeDetectionService, ThemingService, ToggleSwitchComponent, TooltipDirective, WeekPickerComponent, Z_INDEX_LAYERS };
9959
10006
  //# sourceMappingURL=entake-particle.mjs.map