@carefirst/library 2.0.7 → 2.0.8

Sign up to get free protection for your applications and to get access to all the features.
Files changed (4) hide show
  1. package/esm2022/lib/components/page/page.component.mjs +2 -2
  2. package/fesm2022/carefirst-library.mjs +2 -2
  3. package/fesm2022/carefirst-library.mjs.map +1 -1
  4. package/package.json +1 -1
package/esm2022/lib/components/page/page.component.mjs CHANGED
@@ -22,11 +22,11 @@ export class PageComponent {
22
22
  this.inputDevMode = checkTruthAttribute(changes, 'devMode', this.inputDevMode);
23
23
  }
24
24
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
25
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: PageComponent, selector: "cf-page", inputs: { centerH: "centerH", centerV: "centerV", dark: "dark", noScroll: "noScroll", devMode: "devMode" }, usesOnChanges: true, ngImport: i0, template: "<ion-content class=\"ion-page cf-page\" [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <div id=\"page-container\">\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;display:flex}ion-content.cf-page #page-setup #page-container{width:100%}ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:32px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{align-items:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #page-container{background-color:pink}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"], dependencies: [{ kind: "component", type: i1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
25
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: PageComponent, selector: "cf-page", inputs: { centerH: "centerH", centerV: "centerV", dark: "dark", noScroll: "noScroll", devMode: "devMode" }, usesOnChanges: true, ngImport: i0, template: "<ion-content class=\"ion-page cf-page\" [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <div id=\"page-container\">\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;display:flex}ion-content.cf-page #page-setup #page-container{width:100%}ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:32px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{align-items:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #page-container{background-color:pink}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"], dependencies: [{ kind: "component", type: i1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
26
26
  }
27
27
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PageComponent, decorators: [{
28
28
  type: Component,
29
- args: [{ selector: 'cf-page', template: "<ion-content class=\"ion-page cf-page\" [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <div id=\"page-container\">\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;display:flex}ion-content.cf-page #page-setup #page-container{width:100%}ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:32px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{align-items:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #page-container{background-color:pink}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"] }]
29
+ args: [{ selector: 'cf-page', template: "<ion-content class=\"ion-page cf-page\" [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <div id=\"page-container\">\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;display:flex}ion-content.cf-page #page-setup #page-container{width:100%}ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:32px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{align-items:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #page-container{background-color:pink}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"] }]
30
30
  }], propDecorators: { centerH: [{
31
31
  type: Input
32
32
  }], centerV: [{
package/fesm2022/carefirst-library.mjs CHANGED
@@ -102,11 +102,11 @@ class PageComponent {
102
102
  this.inputDevMode = checkTruthAttribute(changes, 'devMode', this.inputDevMode);
103
103
  }
104
104
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
105
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: PageComponent, selector: "cf-page", inputs: { centerH: "centerH", centerV: "centerV", dark: "dark", noScroll: "noScroll", devMode: "devMode" }, usesOnChanges: true, ngImport: i0, template: "<ion-content class=\"ion-page cf-page\" [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <div id=\"page-container\">\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;display:flex}ion-content.cf-page #page-setup #page-container{width:100%}ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:32px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{align-items:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #page-container{background-color:pink}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"], dependencies: [{ kind: "component", type: i1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
105
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: PageComponent, selector: "cf-page", inputs: { centerH: "centerH", centerV: "centerV", dark: "dark", noScroll: "noScroll", devMode: "devMode" }, usesOnChanges: true, ngImport: i0, template: "<ion-content class=\"ion-page cf-page\" [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <div id=\"page-container\">\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;display:flex}ion-content.cf-page #page-setup #page-container{width:100%}ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:32px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{align-items:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #page-container{background-color:pink}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"], dependencies: [{ kind: "component", type: i1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
106
106
  }
107
107
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: PageComponent, decorators: [{
108
108
  type: Component,
109
- args: [{ selector: 'cf-page', template: "<ion-content class=\"ion-page cf-page\" [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <div id=\"page-container\">\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;display:flex}ion-content.cf-page #page-setup #page-container{width:100%}ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:32px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{align-items:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #page-container{background-color:pink}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"] }]
109
+ args: [{ selector: 'cf-page', template: "<ion-content class=\"ion-page cf-page\" [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <div id=\"page-container\">\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;display:flex}ion-content.cf-page #page-setup #page-container{width:100%}ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup #page-container>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:32px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{align-items:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #page-container{background-color:pink}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"] }]
110
110
  }], propDecorators: { centerH: [{
111
111
  type: Input
112
112
  }], centerV: [{