@norwegian/core-components 7.4.2 → 7.4.4
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.
- package/esm2022/lib/components/accordion/accordion.component.mjs +2 -2
- package/esm2022/lib/components/airport-select/airport-select.component.mjs +2 -2
- package/esm2022/lib/components/autocomplete/autocomplete.component.mjs +2 -2
- package/esm2022/lib/components/box/box.component.mjs +2 -2
- package/esm2022/lib/components/button/button.component.mjs +2 -2
- package/esm2022/lib/components/campaign-header/campaign-header.component.mjs +2 -2
- package/esm2022/lib/components/checkbox/checkbox.component.mjs +10 -3
- package/esm2022/lib/components/cover/cover.component.mjs +2 -2
- package/esm2022/lib/components/datepicker/calendar/calendar.component.mjs +2 -2
- package/esm2022/lib/components/datepicker/datepicker.component.mjs +9 -4
- package/esm2022/lib/components/datepicker-combo/datepicker-combo.component.mjs +10 -3
- package/esm2022/lib/components/filter/filter.component.mjs +89 -90
- package/esm2022/lib/components/input/input.component.mjs +2 -2
- package/esm2022/lib/components/journey/journey.component.mjs +2 -2
- package/esm2022/lib/components/journey-availability/journey-availability.component.mjs +2 -2
- package/esm2022/lib/components/journey-availability-list/journey-availability-list.component.mjs +2 -2
- package/esm2022/lib/components/journey-selection/journey-selection.component.mjs +2 -2
- package/esm2022/lib/components/journey-stopover/journey-stopover.component.mjs +2 -2
- package/esm2022/lib/components/micro-button/micro-button.component.mjs +2 -2
- package/esm2022/lib/components/modal/modal.component.mjs +2 -2
- package/esm2022/lib/components/number-field/number-field.component.mjs +2 -2
- package/esm2022/lib/components/page-footer/page-footer.component.mjs +2 -2
- package/esm2022/lib/components/page-header/page-header.component.mjs +2 -2
- package/esm2022/lib/components/phone-number/phone-number.component.mjs +2 -2
- package/esm2022/lib/components/radio/radio.component.mjs +7 -4
- package/esm2022/lib/components/select/select.component.mjs +2 -2
- package/esm2022/lib/components/slider/slider.component.mjs +2 -2
- package/esm2022/lib/components/spinner/spinner.component.mjs +2 -2
- package/esm2022/lib/components/tab-group/tab/tab.component.mjs +2 -2
- package/esm2022/lib/components/textarea/textarea.component.mjs +2 -2
- package/esm2022/lib/components/toggle/toggle.component.mjs +2 -2
- package/esm2022/lib/components/trip-summary/trip-summary.component.mjs +2 -2
- package/fesm2022/norwegian-core-components.mjs +173 -152
- package/fesm2022/norwegian-core-components.mjs.map +1 -1
- package/lib/components/checkbox/checkbox.component.d.ts +2 -1
- package/lib/components/datepicker-combo/datepicker-combo.component.d.ts +1 -0
- package/lib/components/filter/filter.component.d.ts +3 -1
- package/lib/components/radio/radio.component.d.ts +2 -1
- package/package.json +1 -1
- package/styles/1__settings/_mixins.scss +2 -1
- package/styles/1__settings/_type.scss +1 -1
- package/styles/3__base/_body.scss +1 -4
- package/styles/3__base/_heading.scss +3 -3
|
@@ -100,11 +100,11 @@ export class SpinnerComponent extends NasComponentBase {
|
|
|
100
100
|
return classes;
|
|
101
101
|
}
|
|
102
102
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: SpinnerComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
103
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: SpinnerComponent, selector: "nas-spinner", inputs: { text: "text", refreshText: "refreshText", small: "small", overlay: "overlay", enable: "enable", refresh: "refresh", blockScrolling: "blockScrolling", rounded: "rounded", cssClass: "cssClass" }, usesInheritance: true, ngImport: i0, template: "<div [nasClass]=\"getClasses('', modifiers)\" *ngIf=\"enable\">\n <span [nasClass]=\"getClass('box')\">\n <span [nasClass]=\"getClass('border')\"></span>\n </span>\n <div *ngIf=\"text\" [nasClass]=\"getClass('text')\">\n <div>{{text}}</div>\n <div [nasClass]=\"getClass('refresh')\" *ngIf=\"showRefreshLink\" (click)=\"refreshPage()\">\n <a> {{refreshText}} </a>\n </div>\n </div>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-spinner{position:relative;text-align:center}.nas-spinner__box{position:relative;display:block;z-index:2;margin-left:auto;margin-right:auto;margin-bottom:8px;width:48px;height:48px;background-color:#e5212d}.nas-spinner__border{position:absolute;display:block;top:52px;left:0;width:48px;height:8px;background-color:#15273f;animation:spinner ease 1s;animation-iteration-count:infinite;animation-fill-mode:forwards;transform-origin:left}.nas-spinner__text{font-family:NorwegianTextPro,Arial,
|
|
103
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: SpinnerComponent, selector: "nas-spinner", inputs: { text: "text", refreshText: "refreshText", small: "small", overlay: "overlay", enable: "enable", refresh: "refresh", blockScrolling: "blockScrolling", rounded: "rounded", cssClass: "cssClass" }, usesInheritance: true, ngImport: i0, template: "<div [nasClass]=\"getClasses('', modifiers)\" *ngIf=\"enable\">\n <span [nasClass]=\"getClass('box')\">\n <span [nasClass]=\"getClass('border')\"></span>\n </span>\n <div *ngIf=\"text\" [nasClass]=\"getClass('text')\">\n <div>{{text}}</div>\n <div [nasClass]=\"getClass('refresh')\" *ngIf=\"showRefreshLink\" (click)=\"refreshPage()\">\n <a> {{refreshText}} </a>\n </div>\n </div>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-spinner{position:relative;text-align:center}.nas-spinner__box{position:relative;display:block;z-index:2;margin-left:auto;margin-right:auto;margin-bottom:8px;width:48px;height:48px;background-color:#e5212d}.nas-spinner__border{position:absolute;display:block;top:52px;left:0;width:48px;height:8px;background-color:#15273f;animation:spinner ease 1s;animation-iteration-count:infinite;animation-fill-mode:forwards;transform-origin:left}.nas-spinner__text{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:400;position:relative;z-index:2;margin-top:24px;text-align:center;width:100%}.nas-spinner--small .nas-spinner__box{width:24px;height:24px}.nas-spinner--small .nas-spinner__text{margin-top:16px}.nas-spinner--small .nas-spinner__border{position:absolute;top:27px;left:0;width:24px;height:3px;background-color:#15273f;animation:spinner ease 1s;animation-iteration-count:infinite;animation-fill-mode:forwards;transform-origin:left}.nas-spinner--overlay{position:fixed;display:flex;flex-direction:column;align-items:center;justify-content:center;top:0;left:0;width:100%;height:100%;z-index:40}.nas-spinner--overlay:before{content:\"\";display:block;position:fixed;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#ffffffb3;animation:fade-in .5s ease-out both}.nas-spinner--rounded .nas-spinner__box,.nas-spinner--rounded.nas-spinner--small .nas-spinner__box .nas-spinner__box{height:48px;width:48px;-webkit-mask:radial-gradient(circle 16px,transparent 99%,#1C1C1C 100%);mask:radial-gradient(circle 16px,transparent 99%,#1C1C1C 100%);background-image:conic-gradient(transparent 25%,#15273f);background-color:unset;animation:spin 1.5s linear infinite;border-radius:50%;position:relative;display:block;z-index:2;margin:0}.nas-spinner--rounded .nas-spinner__border,.nas-spinner--rounded.nas-spinner--small .nas-spinner__box .nas-spinner__border{display:none}.nas-spinner--rounded.nas-spinner--small .nas-spinner__box{height:16px;width:16px;-webkit-mask:radial-gradient(circle 16px,transparent 99%,#1C1C1C 100%);mask:radial-gradient(circle 6px,transparent 85%,#1C1C1C 100%);background-image:conic-gradient(transparent 15%,#15273f)}.nas-spinner--rounded.nas-spinner--small .nas-spinner__text{margin-top:16px}.nas-spinner--rounded.nas-spinner--small .nas-spinner__border{display:none}.nas-spinner__refresh{padding-left:5px;position:absolute;width:100%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spinner{0%{transform:translate(0) scaleX(0)}50%{transform:translate(0) scaleX(1)}to{transform:translate(100%) scaleX(0)}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
104
104
|
}
|
|
105
105
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: SpinnerComponent, decorators: [{
|
|
106
106
|
type: Component,
|
|
107
|
-
args: [{ selector: 'nas-spinner', encapsulation: ViewEncapsulation.None, template: "<div [nasClass]=\"getClasses('', modifiers)\" *ngIf=\"enable\">\n <span [nasClass]=\"getClass('box')\">\n <span [nasClass]=\"getClass('border')\"></span>\n </span>\n <div *ngIf=\"text\" [nasClass]=\"getClass('text')\">\n <div>{{text}}</div>\n <div [nasClass]=\"getClass('refresh')\" *ngIf=\"showRefreshLink\" (click)=\"refreshPage()\">\n <a> {{refreshText}} </a>\n </div>\n </div>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-spinner{position:relative;text-align:center}.nas-spinner__box{position:relative;display:block;z-index:2;margin-left:auto;margin-right:auto;margin-bottom:8px;width:48px;height:48px;background-color:#e5212d}.nas-spinner__border{position:absolute;display:block;top:52px;left:0;width:48px;height:8px;background-color:#15273f;animation:spinner ease 1s;animation-iteration-count:infinite;animation-fill-mode:forwards;transform-origin:left}.nas-spinner__text{font-family:NorwegianTextPro,Arial,
|
|
107
|
+
args: [{ selector: 'nas-spinner', encapsulation: ViewEncapsulation.None, template: "<div [nasClass]=\"getClasses('', modifiers)\" *ngIf=\"enable\">\n <span [nasClass]=\"getClass('box')\">\n <span [nasClass]=\"getClass('border')\"></span>\n </span>\n <div *ngIf=\"text\" [nasClass]=\"getClass('text')\">\n <div>{{text}}</div>\n <div [nasClass]=\"getClass('refresh')\" *ngIf=\"showRefreshLink\" (click)=\"refreshPage()\">\n <a> {{refreshText}} </a>\n </div>\n </div>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-spinner{position:relative;text-align:center}.nas-spinner__box{position:relative;display:block;z-index:2;margin-left:auto;margin-right:auto;margin-bottom:8px;width:48px;height:48px;background-color:#e5212d}.nas-spinner__border{position:absolute;display:block;top:52px;left:0;width:48px;height:8px;background-color:#15273f;animation:spinner ease 1s;animation-iteration-count:infinite;animation-fill-mode:forwards;transform-origin:left}.nas-spinner__text{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:400;position:relative;z-index:2;margin-top:24px;text-align:center;width:100%}.nas-spinner--small .nas-spinner__box{width:24px;height:24px}.nas-spinner--small .nas-spinner__text{margin-top:16px}.nas-spinner--small .nas-spinner__border{position:absolute;top:27px;left:0;width:24px;height:3px;background-color:#15273f;animation:spinner ease 1s;animation-iteration-count:infinite;animation-fill-mode:forwards;transform-origin:left}.nas-spinner--overlay{position:fixed;display:flex;flex-direction:column;align-items:center;justify-content:center;top:0;left:0;width:100%;height:100%;z-index:40}.nas-spinner--overlay:before{content:\"\";display:block;position:fixed;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#ffffffb3;animation:fade-in .5s ease-out both}.nas-spinner--rounded .nas-spinner__box,.nas-spinner--rounded.nas-spinner--small .nas-spinner__box .nas-spinner__box{height:48px;width:48px;-webkit-mask:radial-gradient(circle 16px,transparent 99%,#1C1C1C 100%);mask:radial-gradient(circle 16px,transparent 99%,#1C1C1C 100%);background-image:conic-gradient(transparent 25%,#15273f);background-color:unset;animation:spin 1.5s linear infinite;border-radius:50%;position:relative;display:block;z-index:2;margin:0}.nas-spinner--rounded .nas-spinner__border,.nas-spinner--rounded.nas-spinner--small .nas-spinner__box .nas-spinner__border{display:none}.nas-spinner--rounded.nas-spinner--small .nas-spinner__box{height:16px;width:16px;-webkit-mask:radial-gradient(circle 16px,transparent 99%,#1C1C1C 100%);mask:radial-gradient(circle 6px,transparent 85%,#1C1C1C 100%);background-image:conic-gradient(transparent 15%,#15273f)}.nas-spinner--rounded.nas-spinner--small .nas-spinner__text{margin-top:16px}.nas-spinner--rounded.nas-spinner--small .nas-spinner__border{display:none}.nas-spinner__refresh{padding-left:5px;position:absolute;width:100%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spinner{0%{transform:translate(0) scaleX(0)}50%{transform:translate(0) scaleX(1)}to{transform:translate(100%) scaleX(0)}}\n"] }]
|
|
108
108
|
}], ctorParameters: function () { return [{ type: i0.Renderer2 }]; }, propDecorators: { text: [{
|
|
109
109
|
type: Input
|
|
110
110
|
}], refreshText: [{
|
|
@@ -108,11 +108,11 @@ export class TabComponent extends NasComponentBase {
|
|
|
108
108
|
]);
|
|
109
109
|
}
|
|
110
110
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TabComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
111
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TabComponent, selector: "nas-tab", inputs: { icon: "icon", label: "label", shadowless: "shadowless", removeBackground: "removeBackground", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { tabClick: "tabClick", focusOnNext: "focusOnNext", focusOnPrevious: "focusOnPrevious" }, viewQueries: [{ propertyName: "tab", first: true, predicate: ["tab"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getLabelClass()\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#15273f;font-size:18px;line-height:24px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#15273f;background-color:#e9e7e4;font-family:NorwegianTextPro,Arial,
|
|
111
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TabComponent, selector: "nas-tab", inputs: { icon: "icon", label: "label", shadowless: "shadowless", removeBackground: "removeBackground", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { tabClick: "tabClick", focusOnNext: "focusOnNext", focusOnPrevious: "focusOnPrevious" }, viewQueries: [{ propertyName: "tab", first: true, predicate: ["tab"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getLabelClass()\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#15273f;font-size:18px;line-height:24px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#15273f;background-color:#e9e7e4;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700}@media (min-width: 1000px){.nas-tab__label--selected:before{content:\"\";display:block;position:absolute;height:3px;top:-6px;left:0;width:100%;background-color:#e5212d}}.nas-tab__label--remove-background{background-color:transparent;color:#15273f;font-weight:700}.nas-tab__label:focus{box-shadow:inset 0 0 2px #e9e7e4,inset 0 0 2px 3px #7ca4cd}.nas-tab__label:hover{background-color:#0f1b2c;color:#fff}@media (min-width: 1000px){.nas-tab__label{order:1;width:auto;margin-right:2px}}.nas-tab__content{display:none;padding:12px 12px 24px;background-color:#e9e7e4;width:100%;animation:fade-in .3s cubic-bezier(0,0,.1,1);outline:none;z-index:2}.nas-tab__content--selected{display:block}.nas-tab__content--remove-background{background-color:transparent}@media (min-width: 1000px){.nas-tab__content{order:99;padding:24px}.nas-tab__content:not(.nas-tab__content--shadowless){box-shadow:0 0 30px #002a3a80}}.nas-tab__dropdown::ng-deep span{display:block;position:absolute;width:24px;height:24px;top:0;right:12px;margin-top:14px;border-radius:50%;background-position:center center;background-color:#0f1b2c;transition:transform .3s cubic-bezier(0,0,.1,1)}@media (min-width: 1000px){.nas-tab__dropdown::ng-deep span{display:none}}.nas-tab__dropdown--selected::ng-deep span{transform:rotate(-180deg);background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: i3.IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
112
112
|
}
|
|
113
113
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TabComponent, decorators: [{
|
|
114
114
|
type: Component,
|
|
115
|
-
args: [{ selector: 'nas-tab', encapsulation: ViewEncapsulation.None, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getLabelClass()\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#15273f;font-size:18px;line-height:24px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#15273f;background-color:#e9e7e4;font-family:NorwegianTextPro,Arial,
|
|
115
|
+
args: [{ selector: 'nas-tab', encapsulation: ViewEncapsulation.None, template: "<a #tab\n role=\"tab\"\n [nasClass]=\"getLabelClass()\"\n [id]=\"getLabelId()\"\n [attr.tabIndex]=\"getTabIndex()\"\n [attr.aria-posinset]=\"index + 1\"\n [attr.aria-setsize]=\"size\"\n [attr.aria-controls]=\"getTabContentId()\"\n [attr.aria-selected]=\"selected\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"(!ariaLabel && ariaLabelledby) ? ariaLabelledby : null\"\n (click)=\"onTabClick()\"\n (keyup.arrowright)=\"onArrowRightClick()\"\n (keyup.arrowleft)=\"onArrowLeftClick()\">\n <nas-icon *ngIf=\"icon\"\n [icon]=\"getIcon()\"></nas-icon>\n {{label}}\n <ng-container *ngIf=\"displayDropdownIcon()\">\n <nas-icon [nasClass]=\"getDropdownClass()\"\n [type]=\"getDropdownIconType()\"></nas-icon>\n </ng-container>\n</a>\n<div [nasClass]=\"getContentClass()\"\n [id]=\"getTabContentId()\"\n [attr.aria-labelledby]=\"getLabelId()\">\n <ng-content></ng-content>\n</div>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-tab__label{color:#fff;background:#15273f;font-size:18px;line-height:24px;border-bottom:none;width:100%;position:relative;z-index:1;outline:none;padding:10px 24px 12px}.nas-tab__label:not(:first-child){margin-top:3px}@media (min-width: 1000px){.nas-tab__label:not(:first-child){margin-top:0}}.nas-tab__label--selected{pointer-events:none;color:#15273f;background-color:#e9e7e4;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700}@media (min-width: 1000px){.nas-tab__label--selected:before{content:\"\";display:block;position:absolute;height:3px;top:-6px;left:0;width:100%;background-color:#e5212d}}.nas-tab__label--remove-background{background-color:transparent;color:#15273f;font-weight:700}.nas-tab__label:focus{box-shadow:inset 0 0 2px #e9e7e4,inset 0 0 2px 3px #7ca4cd}.nas-tab__label:hover{background-color:#0f1b2c;color:#fff}@media (min-width: 1000px){.nas-tab__label{order:1;width:auto;margin-right:2px}}.nas-tab__content{display:none;padding:12px 12px 24px;background-color:#e9e7e4;width:100%;animation:fade-in .3s cubic-bezier(0,0,.1,1);outline:none;z-index:2}.nas-tab__content--selected{display:block}.nas-tab__content--remove-background{background-color:transparent}@media (min-width: 1000px){.nas-tab__content{order:99;padding:24px}.nas-tab__content:not(.nas-tab__content--shadowless){box-shadow:0 0 30px #002a3a80}}.nas-tab__dropdown::ng-deep span{display:block;position:absolute;width:24px;height:24px;top:0;right:12px;margin-top:14px;border-radius:50%;background-position:center center;background-color:#0f1b2c;transition:transform .3s cubic-bezier(0,0,.1,1)}@media (min-width: 1000px){.nas-tab__dropdown::ng-deep span{display:none}}.nas-tab__dropdown--selected::ng-deep span{transform:rotate(-180deg);background-color:#fff}\n"] }]
|
|
116
116
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { tab: [{
|
|
117
117
|
type: ViewChild,
|
|
118
118
|
args: ['tab']
|
|
@@ -50,11 +50,11 @@ export class TextareaComponent extends NasComponentBase {
|
|
|
50
50
|
return style;
|
|
51
51
|
}
|
|
52
52
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
53
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TextareaComponent, selector: "nas-textarea", inputs: { label: "label", resizable: "resizable", height: "height", maxHeight: "maxHeight", ariaDescribedby: ["aria-describedby", "ariaDescribedby"], disabled: "disabled", error: "error", errorMessage: "errorMessage", id: "id", info: "info", loading: "loading", maxLength: "maxLength", model: "model", nasFormControlName: "nasFormControlName", nasFormGroup: "nasFormGroup", readonly: "readonly", required: "required", spaceless: "spaceless" }, outputs: { modelChange: "modelChange" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!nasFormControlName; else reactiveForm\">\n <label [nasClass]=\"mainClass()\">\n <p [nasClass]=\"getClass('label')\"\n *ngIf=\"label\">{{label}}</p>\n <textarea [nasClass]=\"getClass('text')\"\n [ngStyle]=\"textareaStyle()\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"error\"\n [attr.disabled]=\"disabled\"\n [attr.id]=\"id\"\n [attr.maxlength]=\"maxLength\"\n [attr.readonly]=\"readonly\"\n [required]=\"required\"\n [(ngModel)]=\"model\"\n >\n </textarea>\n <span [nasClass]=\"getClass('line')\"></span>\n <p [nasClass]=\"getClass('error')\"\n *ngIf=\"exists(error) && errorMessage\">{{errorMessage}}</p>\n <span [nasClass]=\"getClass('info')\"\n *ngIf=\"info\">{{info}}</span>\n </label>\n</ng-container>\n<ng-template #reactiveForm>\n <label [nasClass]=\"mainClass()\" [formGroup]=\"nasFormGroup\">\n <p [nasClass]=\"getClass('label')\"\n *ngIf=\"label\">{{label}}</p>\n <textarea [nasClass]=\"getClass('text')\"\n [ngStyle]=\"textareaStyle()\"\n [formControlName]=\"nasFormControlName\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"error\"\n [attr.disabled]=\"disabled\"\n [attr.id]=\"id\"\n [attr.maxlength]=\"maxLength\"\n [attr.readonly]=\"readonly\"\n [required]=\"required\"\n >\n </textarea>\n <span [nasClass]=\"getClass('line')\"></span>\n <p [nasClass]=\"getClass('error')\"\n *ngIf=\"exists(error) && errorMessage\">{{errorMessage}}</p>\n <span [nasClass]=\"getClass('info')\"\n *ngIf=\"info\">{{info}}</span>\n </label>\n</ng-template>\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-textarea{display:block;margin-bottom:3px;position:relative}.nas-textarea__label{font-family:NorwegianTextPro,Arial,
|
|
53
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TextareaComponent, selector: "nas-textarea", inputs: { label: "label", resizable: "resizable", height: "height", maxHeight: "maxHeight", ariaDescribedby: ["aria-describedby", "ariaDescribedby"], disabled: "disabled", error: "error", errorMessage: "errorMessage", id: "id", info: "info", loading: "loading", maxLength: "maxLength", model: "model", nasFormControlName: "nasFormControlName", nasFormGroup: "nasFormGroup", readonly: "readonly", required: "required", spaceless: "spaceless" }, outputs: { modelChange: "modelChange" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!nasFormControlName; else reactiveForm\">\n <label [nasClass]=\"mainClass()\">\n <p [nasClass]=\"getClass('label')\"\n *ngIf=\"label\">{{label}}</p>\n <textarea [nasClass]=\"getClass('text')\"\n [ngStyle]=\"textareaStyle()\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"error\"\n [attr.disabled]=\"disabled\"\n [attr.id]=\"id\"\n [attr.maxlength]=\"maxLength\"\n [attr.readonly]=\"readonly\"\n [required]=\"required\"\n [(ngModel)]=\"model\"\n >\n </textarea>\n <span [nasClass]=\"getClass('line')\"></span>\n <p [nasClass]=\"getClass('error')\"\n *ngIf=\"exists(error) && errorMessage\">{{errorMessage}}</p>\n <span [nasClass]=\"getClass('info')\"\n *ngIf=\"info\">{{info}}</span>\n </label>\n</ng-container>\n<ng-template #reactiveForm>\n <label [nasClass]=\"mainClass()\" [formGroup]=\"nasFormGroup\">\n <p [nasClass]=\"getClass('label')\"\n *ngIf=\"label\">{{label}}</p>\n <textarea [nasClass]=\"getClass('text')\"\n [ngStyle]=\"textareaStyle()\"\n [formControlName]=\"nasFormControlName\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"error\"\n [attr.disabled]=\"disabled\"\n [attr.id]=\"id\"\n [attr.maxlength]=\"maxLength\"\n [attr.readonly]=\"readonly\"\n [required]=\"required\"\n >\n </textarea>\n <span [nasClass]=\"getClass('line')\"></span>\n <p [nasClass]=\"getClass('error')\"\n *ngIf=\"exists(error) && errorMessage\">{{errorMessage}}</p>\n <span [nasClass]=\"getClass('info')\"\n *ngIf=\"info\">{{info}}</span>\n </label>\n</ng-template>\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-textarea{display:block;margin-bottom:3px;position:relative}.nas-textarea__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;letter-spacing:-.025em;word-spacing:-.025em;display:block;margin-top:0;margin-bottom:6px}@media (min-width: 640px){.nas-textarea__label{letter-spacing:inherit;word-spacing:inherit}}.nas-textarea__label~.nas-textarea__icon{top:43px}.nas-textarea__label~.nas-textarea__icon--spinner{top:41px}.nas-textarea__text{position:relative;margin-bottom:3px}.nas-textarea__text:focus~.nas-textarea__line{background-color:#15273f}.nas-textarea__text[disabled]{opacity:.5}.nas-textarea--error .nas-textarea__text{padding-right:40px;background-repeat:no-repeat;background-position:right 9px center}.nas-textarea--error .nas-textarea__error{display:block;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:400;color:#b12a0b}.nas-textarea--error .nas-textarea__line{background-color:#e5212d}.nas-textarea--error .nas-textarea__text:focus~.nas-textarea__line{background-color:#15273f}.nas-textarea--resizeable .nas-textarea__text{resize:vertical}.nas-textarea--disabled .nas-textarea__text{opacity:.5}.nas-textarea__line{position:relative;display:block;height:3px;background-color:#e9e7e4;transition:background-color .15s cubic-bezier(0,0,.1,1)}.nas-textarea__info{display:block;margin-top:9px;margin-bottom:24px}.nas-textarea--loading .nas-textarea__line{background-color:#15273f;animation:input-loader ease 1.5s;animation-iteration-count:infinite;animation-fill-mode:forwards;transform-origin:left}.nas-textarea--spaceless{margin-bottom:0}@keyframes input-loader{0%{transform:translate(0) scaleX(0)}50%{transform:translate(0) scaleX(1)}to{transform:translate(100%) scaleX(0)}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
|
|
54
54
|
}
|
|
55
55
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TextareaComponent, decorators: [{
|
|
56
56
|
type: Component,
|
|
57
|
-
args: [{ selector: 'nas-textarea', template: "<ng-container *ngIf=\"!nasFormControlName; else reactiveForm\">\n <label [nasClass]=\"mainClass()\">\n <p [nasClass]=\"getClass('label')\"\n *ngIf=\"label\">{{label}}</p>\n <textarea [nasClass]=\"getClass('text')\"\n [ngStyle]=\"textareaStyle()\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"error\"\n [attr.disabled]=\"disabled\"\n [attr.id]=\"id\"\n [attr.maxlength]=\"maxLength\"\n [attr.readonly]=\"readonly\"\n [required]=\"required\"\n [(ngModel)]=\"model\"\n >\n </textarea>\n <span [nasClass]=\"getClass('line')\"></span>\n <p [nasClass]=\"getClass('error')\"\n *ngIf=\"exists(error) && errorMessage\">{{errorMessage}}</p>\n <span [nasClass]=\"getClass('info')\"\n *ngIf=\"info\">{{info}}</span>\n </label>\n</ng-container>\n<ng-template #reactiveForm>\n <label [nasClass]=\"mainClass()\" [formGroup]=\"nasFormGroup\">\n <p [nasClass]=\"getClass('label')\"\n *ngIf=\"label\">{{label}}</p>\n <textarea [nasClass]=\"getClass('text')\"\n [ngStyle]=\"textareaStyle()\"\n [formControlName]=\"nasFormControlName\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"error\"\n [attr.disabled]=\"disabled\"\n [attr.id]=\"id\"\n [attr.maxlength]=\"maxLength\"\n [attr.readonly]=\"readonly\"\n [required]=\"required\"\n >\n </textarea>\n <span [nasClass]=\"getClass('line')\"></span>\n <p [nasClass]=\"getClass('error')\"\n *ngIf=\"exists(error) && errorMessage\">{{errorMessage}}</p>\n <span [nasClass]=\"getClass('info')\"\n *ngIf=\"info\">{{info}}</span>\n </label>\n</ng-template>\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-textarea{display:block;margin-bottom:3px;position:relative}.nas-textarea__label{font-family:NorwegianTextPro,Arial,
|
|
57
|
+
args: [{ selector: 'nas-textarea', template: "<ng-container *ngIf=\"!nasFormControlName; else reactiveForm\">\n <label [nasClass]=\"mainClass()\">\n <p [nasClass]=\"getClass('label')\"\n *ngIf=\"label\">{{label}}</p>\n <textarea [nasClass]=\"getClass('text')\"\n [ngStyle]=\"textareaStyle()\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"error\"\n [attr.disabled]=\"disabled\"\n [attr.id]=\"id\"\n [attr.maxlength]=\"maxLength\"\n [attr.readonly]=\"readonly\"\n [required]=\"required\"\n [(ngModel)]=\"model\"\n >\n </textarea>\n <span [nasClass]=\"getClass('line')\"></span>\n <p [nasClass]=\"getClass('error')\"\n *ngIf=\"exists(error) && errorMessage\">{{errorMessage}}</p>\n <span [nasClass]=\"getClass('info')\"\n *ngIf=\"info\">{{info}}</span>\n </label>\n</ng-container>\n<ng-template #reactiveForm>\n <label [nasClass]=\"mainClass()\" [formGroup]=\"nasFormGroup\">\n <p [nasClass]=\"getClass('label')\"\n *ngIf=\"label\">{{label}}</p>\n <textarea [nasClass]=\"getClass('text')\"\n [ngStyle]=\"textareaStyle()\"\n [formControlName]=\"nasFormControlName\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"error\"\n [attr.disabled]=\"disabled\"\n [attr.id]=\"id\"\n [attr.maxlength]=\"maxLength\"\n [attr.readonly]=\"readonly\"\n [required]=\"required\"\n >\n </textarea>\n <span [nasClass]=\"getClass('line')\"></span>\n <p [nasClass]=\"getClass('error')\"\n *ngIf=\"exists(error) && errorMessage\">{{errorMessage}}</p>\n <span [nasClass]=\"getClass('info')\"\n *ngIf=\"info\">{{info}}</span>\n </label>\n</ng-template>\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-textarea{display:block;margin-bottom:3px;position:relative}.nas-textarea__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;letter-spacing:-.025em;word-spacing:-.025em;display:block;margin-top:0;margin-bottom:6px}@media (min-width: 640px){.nas-textarea__label{letter-spacing:inherit;word-spacing:inherit}}.nas-textarea__label~.nas-textarea__icon{top:43px}.nas-textarea__label~.nas-textarea__icon--spinner{top:41px}.nas-textarea__text{position:relative;margin-bottom:3px}.nas-textarea__text:focus~.nas-textarea__line{background-color:#15273f}.nas-textarea__text[disabled]{opacity:.5}.nas-textarea--error .nas-textarea__text{padding-right:40px;background-repeat:no-repeat;background-position:right 9px center}.nas-textarea--error .nas-textarea__error{display:block;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:400;color:#b12a0b}.nas-textarea--error .nas-textarea__line{background-color:#e5212d}.nas-textarea--error .nas-textarea__text:focus~.nas-textarea__line{background-color:#15273f}.nas-textarea--resizeable .nas-textarea__text{resize:vertical}.nas-textarea--disabled .nas-textarea__text{opacity:.5}.nas-textarea__line{position:relative;display:block;height:3px;background-color:#e9e7e4;transition:background-color .15s cubic-bezier(0,0,.1,1)}.nas-textarea__info{display:block;margin-top:9px;margin-bottom:24px}.nas-textarea--loading .nas-textarea__line{background-color:#15273f;animation:input-loader ease 1.5s;animation-iteration-count:infinite;animation-fill-mode:forwards;transform-origin:left}.nas-textarea--spaceless{margin-bottom:0}@keyframes input-loader{0%{transform:translate(0) scaleX(0)}50%{transform:translate(0) scaleX(1)}to{transform:translate(100%) scaleX(0)}}\n"] }]
|
|
58
58
|
}], ctorParameters: function () { return []; }, propDecorators: { label: [{
|
|
59
59
|
type: Input
|
|
60
60
|
}], resizable: [{
|
|
@@ -70,11 +70,11 @@ export class ToggleComponent extends NasComponentBase {
|
|
|
70
70
|
history.pushState(null, '', option.href);
|
|
71
71
|
}
|
|
72
72
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: ToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
73
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: ToggleComponent, selector: "nas-toggle", inputs: { options: "options", large: "large", compact: "compact", light: "light", rounded: "rounded", small: "small", big: "big", selectedValue: "selectedValue", label: "label", vertical: "vertical", grouped: "grouped", group: "group", nasFormControlName: "nasFormControlName", nasFormGroup: "nasFormGroup", scrollable: "scrollable" }, outputs: { handleChange: "handleChange" }, usesInheritance: true, ngImport: i0, template: "<div [nasClass]=\"mainClasses()\" *ngIf=\"!nasFormControlName; else reactiveForm\">\n <h3 [nasClass]=\"getClass('title')\">{{label}}</h3>\n <div [nasClass]=\"getClass('items')\">\n <span [nasClass]=\"getClass('item')\" *ngFor=\"let option of options\">\n <input [nasClass]=\"getClass('radio')\" [attr.id]=\"getOptionId(option)\" [checked]=\"option.value === selectedValue\" [attr.name]=\"group\" type=\"radio\" [attr.value]=\"option.value\" (change)=\"onChange(option)\">\n <label [nasClass]=\"getClass('label')\" [attr.for]=\"getOptionId(option)\">\n <ng-container *ngIf=\"option?.href; else noLink\">\n <a [nasClass]=\"getClass('link', selectedValue == option.value && 'selected')\" [href]=\"option.href\" (click)=\"onClickHref($event, option)\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </a>\n </ng-container>\n <ng-template #noLink>\n <div [nasClass]=\"getClass('label--content')\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </div>\n </ng-template>\n </label>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"isRounded\">{{option.text}}</span>\n </span>\n </div>\n</div>\n<ng-template #reactiveForm>\n <div [nasClass]=\"mainClasses()\" >\n <h3 [nasClass]=\"getClass('title')\">{{label}}</h3>\n <div [nasClass]=\"getClass('items')\" [formGroup]=\"nasFormGroup\">\n <span [nasClass]=\"getClass('item')\" *ngFor=\"let option of options\">\n <input [formControlName]=\"nasFormControlName\" [nasClass]=\"getClass('radio')\" [attr.id]=\"getOptionId(option)\" [checked]=\"option.value === selectedValue\" [name]=\"group\" type=\"radio\" [value]=\"option.value\" (change)=\"onChange(option)\">\n <label [nasClass]=\"getClass('label')\" [attr.for]=\"getOptionId(option)\">\n <ng-container *ngIf=\"option?.href; else noLink\">\n <a [nasClass]=\"getClass('link', selectedValue == option.value && 'selected')\" [href]=\"option.href\" (click)=\"onClickHref($event, option)\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </a>\n </ng-container>\n <ng-template #noLink>\n <div [nasClass]=\"getClass('label--content')\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </div>\n </ng-template>\n </label>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"isRounded\">{{option.text}}</span>\n </span>\n </div>\n</div>\n</ng-template>\n\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-toggle__items{display:flex;flex-grow:2;perspective:1000px}.nas-toggle__title{font-size:16px;line-height:24px}.nas-toggle .icon-small{display:none;margin-left:-3px;margin-right:9px}@media (min-width: 640px){.nas-toggle .icon-small{display:inline-block}}.nas-toggle__item{transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:flip-in .55s ease both;animation-delay:.42s;-webkit-user-select:none;user-select:none;width:100%}.nas-toggle__item:nth-child(1){animation-delay:60ms}.nas-toggle__item:nth-child(2){animation-delay:.12s}.nas-toggle__item:nth-child(3){animation-delay:.18s}.nas-toggle__item:nth-child(4){animation-delay:.24s}.nas-toggle__item:nth-child(5){animation-delay:.3s}.nas-toggle__item:nth-child(6){animation-delay:.36s}.nas-toggle__item:not(:first-child){margin-left:2px}.nas-toggle__item:not(:last-child){margin-right:2px}.nas-toggle__label{font-family:NorwegianTextPro,Arial,Apercu,Helvetica Neue,Helvetica,sans-serif;font-size:16px;line-height:24px;text-align:center;color:#15273f;white-space:nowrap;cursor:pointer;margin:0;border:3px solid #E9E7E4;background-color:#e9e7e4;transition:transform .15s cubic-bezier(0,0,.1,1)}.nas-toggle__label--content{padding:12px}.nas-toggle__label:hover,.nas-toggle__label:focus{border-color:#15273f}.nas-toggle__label:active{transform:translateY(3px)}.nas-toggle__price{display:block}@media (min-width: 640px){.nas-toggle__price{display:none}}.nas-toggle--compact .nas-toggle__label{font-size:14px;line-height:20px}.nas-toggle--compact .nas-toggle__label--content,.nas-toggle--compact .nas-toggle__link{padding:6px}.nas-toggle--large{align-items:stretch}.nas-toggle--large .icon-small{margin:0}.nas-toggle--large .nas-toggle__label{height:100%;border-color:#fff;background-color:#fff}.nas-toggle--large .nas-toggle__label--content{padding:24px}.nas-toggle--large .nas-toggle__label:hover,.nas-toggle--large .nas-toggle__label:focus{border-color:#15273f}.nas-toggle--large .nas-toggle__item:not(:first-child){margin-left:6px}.nas-toggle--large .nas-toggle__item:not(:last-child){margin-right:6px}.nas-toggle--large .nas-toggle__text{display:block}@media (min-width: 640px){.nas-toggle--large .nas-toggle__price{display:block;margin-bottom:-9px}}.nas-toggle--large .nas-toggle__link{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.nas-toggle--light .nas-toggle__label{border-color:#fff;background-color:#fff}.nas-toggle--light .nas-toggle__label:hover,.nas-toggle--light .nas-toggle__label:focus{border-color:#15273f}.nas-toggle--grouped{padding-bottom:3px;border-bottom:3px solid #15273F}.nas-toggle--vertical .nas-toggle__items{flex-direction:column;padding-bottom:0;border-bottom:0}.nas-toggle--vertical .nas-toggle__item,.nas-toggle--vertical .nas-toggle__item:not(:first-child),.nas-toggle--vertical .nas-toggle__item:not(:last-child){margin:0 0 3px}.nas-toggle--vertical .nas-toggle__label{text-align:left}.nas-toggle--vertical .nas-toggle__label--content,.nas-toggle--vertical .nas-toggle__link{padding:6px 24px}.nas-toggle--rounded .nas-toggle__label{margin:0 auto 6px;height:83px;width:83px;border-radius:100%}.nas-toggle--rounded .nas-toggle__label:hover,.nas-toggle--rounded .nas-toggle__label:focus{border-color:#fff;background-color:#fff}.nas-toggle--rounded .nas-toggle__item:not(:first-child){margin-left:12px}.nas-toggle--rounded .nas-toggle__item:not(:last-child){margin-right:12px}.nas-toggle--rounded .nas-toggle__text{display:block;text-align:center}.nas-toggle--big .nas-toggle__label{height:96px;width:96px;padding-top:9px}.nas-toggle--small .nas-toggle__label{padding-top:6px;height:65px;width:65px}.nas-toggle__radio{position:fixed;top:-99px;left:-99px;opacity:0}.nas-toggle__radio:checked~.nas-toggle__label{color:#fff;border-color:#15273f;background-color:#15273f}.nas-toggle__radio:focus~.nas-toggle__label{box-shadow:0 0 1px 2px #e9e7e4,0 0 2px 3px #7ca4cd}.nas-toggle__radio:disabled~.nas-toggle__label{opacity:.4;pointer-events:none}.nas-toggle--scrollable .nas-toggle__items{overflow-x:auto;overflow-y:hidden;padding-bottom:20px;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar{height:4px;width:4px}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar-thumb{background:#15273f;border-radius:2px}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar-track-piece:end{margin-right:100px;background:#fff}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar-track-piece:start{margin-left:100px;background:#fff}.nas-toggle--scrollable .nas-toggle__items::-moz-scrollbar{height:4px;width:4px}.nas-toggle__link{display:block;color:#15273f;border:0;padding:12px}.nas-toggle__link--selected{color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }, { kind: "directive", type: i3.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
|
|
73
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: ToggleComponent, selector: "nas-toggle", inputs: { options: "options", large: "large", compact: "compact", light: "light", rounded: "rounded", small: "small", big: "big", selectedValue: "selectedValue", label: "label", vertical: "vertical", grouped: "grouped", group: "group", nasFormControlName: "nasFormControlName", nasFormGroup: "nasFormGroup", scrollable: "scrollable" }, outputs: { handleChange: "handleChange" }, usesInheritance: true, ngImport: i0, template: "<div [nasClass]=\"mainClasses()\" *ngIf=\"!nasFormControlName; else reactiveForm\">\n <h3 [nasClass]=\"getClass('title')\">{{label}}</h3>\n <div [nasClass]=\"getClass('items')\">\n <span [nasClass]=\"getClass('item')\" *ngFor=\"let option of options\">\n <input [nasClass]=\"getClass('radio')\" [attr.id]=\"getOptionId(option)\" [checked]=\"option.value === selectedValue\" [attr.name]=\"group\" type=\"radio\" [attr.value]=\"option.value\" (change)=\"onChange(option)\">\n <label [nasClass]=\"getClass('label')\" [attr.for]=\"getOptionId(option)\">\n <ng-container *ngIf=\"option?.href; else noLink\">\n <a [nasClass]=\"getClass('link', selectedValue == option.value && 'selected')\" [href]=\"option.href\" (click)=\"onClickHref($event, option)\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </a>\n </ng-container>\n <ng-template #noLink>\n <div [nasClass]=\"getClass('label--content')\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </div>\n </ng-template>\n </label>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"isRounded\">{{option.text}}</span>\n </span>\n </div>\n</div>\n<ng-template #reactiveForm>\n <div [nasClass]=\"mainClasses()\" >\n <h3 [nasClass]=\"getClass('title')\">{{label}}</h3>\n <div [nasClass]=\"getClass('items')\" [formGroup]=\"nasFormGroup\">\n <span [nasClass]=\"getClass('item')\" *ngFor=\"let option of options\">\n <input [formControlName]=\"nasFormControlName\" [nasClass]=\"getClass('radio')\" [attr.id]=\"getOptionId(option)\" [checked]=\"option.value === selectedValue\" [name]=\"group\" type=\"radio\" [value]=\"option.value\" (change)=\"onChange(option)\">\n <label [nasClass]=\"getClass('label')\" [attr.for]=\"getOptionId(option)\">\n <ng-container *ngIf=\"option?.href; else noLink\">\n <a [nasClass]=\"getClass('link', selectedValue == option.value && 'selected')\" [href]=\"option.href\" (click)=\"onClickHref($event, option)\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </a>\n </ng-container>\n <ng-template #noLink>\n <div [nasClass]=\"getClass('label--content')\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </div>\n </ng-template>\n </label>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"isRounded\">{{option.text}}</span>\n </span>\n </div>\n</div>\n</ng-template>\n\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-toggle__items{display:flex;flex-grow:2;perspective:1000px}.nas-toggle__title{font-size:16px;line-height:24px}.nas-toggle .icon-small{display:none;margin-left:-3px;margin-right:9px}@media (min-width: 640px){.nas-toggle .icon-small{display:inline-block}}.nas-toggle__item{transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:flip-in .55s ease both;animation-delay:.42s;-webkit-user-select:none;user-select:none;width:100%}.nas-toggle__item:nth-child(1){animation-delay:60ms}.nas-toggle__item:nth-child(2){animation-delay:.12s}.nas-toggle__item:nth-child(3){animation-delay:.18s}.nas-toggle__item:nth-child(4){animation-delay:.24s}.nas-toggle__item:nth-child(5){animation-delay:.3s}.nas-toggle__item:nth-child(6){animation-delay:.36s}.nas-toggle__item:not(:first-child){margin-left:2px}.nas-toggle__item:not(:last-child){margin-right:2px}.nas-toggle__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-size:16px;line-height:24px;text-align:center;color:#15273f;white-space:nowrap;cursor:pointer;margin:0;border:3px solid #E9E7E4;background-color:#e9e7e4;transition:transform .15s cubic-bezier(0,0,.1,1)}.nas-toggle__label--content{padding:12px}.nas-toggle__label:hover,.nas-toggle__label:focus{border-color:#15273f}.nas-toggle__label:active{transform:translateY(3px)}.nas-toggle__price{display:block}@media (min-width: 640px){.nas-toggle__price{display:none}}.nas-toggle--compact .nas-toggle__label{font-size:14px;line-height:20px}.nas-toggle--compact .nas-toggle__label--content,.nas-toggle--compact .nas-toggle__link{padding:6px}.nas-toggle--large{align-items:stretch}.nas-toggle--large .icon-small{margin:0}.nas-toggle--large .nas-toggle__label{height:100%;border-color:#fff;background-color:#fff}.nas-toggle--large .nas-toggle__label--content{padding:24px}.nas-toggle--large .nas-toggle__label:hover,.nas-toggle--large .nas-toggle__label:focus{border-color:#15273f}.nas-toggle--large .nas-toggle__item:not(:first-child){margin-left:6px}.nas-toggle--large .nas-toggle__item:not(:last-child){margin-right:6px}.nas-toggle--large .nas-toggle__text{display:block}@media (min-width: 640px){.nas-toggle--large .nas-toggle__price{display:block;margin-bottom:-9px}}.nas-toggle--large .nas-toggle__link{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.nas-toggle--light .nas-toggle__label{border-color:#fff;background-color:#fff}.nas-toggle--light .nas-toggle__label:hover,.nas-toggle--light .nas-toggle__label:focus{border-color:#15273f}.nas-toggle--grouped{padding-bottom:3px;border-bottom:3px solid #15273F}.nas-toggle--vertical .nas-toggle__items{flex-direction:column;padding-bottom:0;border-bottom:0}.nas-toggle--vertical .nas-toggle__item,.nas-toggle--vertical .nas-toggle__item:not(:first-child),.nas-toggle--vertical .nas-toggle__item:not(:last-child){margin:0 0 3px}.nas-toggle--vertical .nas-toggle__label{text-align:left}.nas-toggle--vertical .nas-toggle__label--content,.nas-toggle--vertical .nas-toggle__link{padding:6px 24px}.nas-toggle--rounded .nas-toggle__label{margin:0 auto 6px;height:83px;width:83px;border-radius:100%}.nas-toggle--rounded .nas-toggle__label:hover,.nas-toggle--rounded .nas-toggle__label:focus{border-color:#fff;background-color:#fff}.nas-toggle--rounded .nas-toggle__item:not(:first-child){margin-left:12px}.nas-toggle--rounded .nas-toggle__item:not(:last-child){margin-right:12px}.nas-toggle--rounded .nas-toggle__text{display:block;text-align:center}.nas-toggle--big .nas-toggle__label{height:96px;width:96px;padding-top:9px}.nas-toggle--small .nas-toggle__label{padding-top:6px;height:65px;width:65px}.nas-toggle__radio{position:fixed;top:-99px;left:-99px;opacity:0}.nas-toggle__radio:checked~.nas-toggle__label{color:#fff;border-color:#15273f;background-color:#15273f}.nas-toggle__radio:focus~.nas-toggle__label{box-shadow:0 0 1px 2px #e9e7e4,0 0 2px 3px #7ca4cd}.nas-toggle__radio:disabled~.nas-toggle__label{opacity:.4;pointer-events:none}.nas-toggle--scrollable .nas-toggle__items{overflow-x:auto;overflow-y:hidden;padding-bottom:20px;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar{height:4px;width:4px}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar-thumb{background:#15273f;border-radius:2px}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar-track-piece:end{margin-right:100px;background:#fff}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar-track-piece:start{margin-left:100px;background:#fff}.nas-toggle--scrollable .nas-toggle__items::-moz-scrollbar{height:4px;width:4px}.nas-toggle__link{display:block;color:#15273f;border:0;padding:12px}.nas-toggle__link--selected{color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }, { kind: "directive", type: i3.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
|
|
74
74
|
}
|
|
75
75
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: ToggleComponent, decorators: [{
|
|
76
76
|
type: Component,
|
|
77
|
-
args: [{ selector: 'nas-toggle', template: "<div [nasClass]=\"mainClasses()\" *ngIf=\"!nasFormControlName; else reactiveForm\">\n <h3 [nasClass]=\"getClass('title')\">{{label}}</h3>\n <div [nasClass]=\"getClass('items')\">\n <span [nasClass]=\"getClass('item')\" *ngFor=\"let option of options\">\n <input [nasClass]=\"getClass('radio')\" [attr.id]=\"getOptionId(option)\" [checked]=\"option.value === selectedValue\" [attr.name]=\"group\" type=\"radio\" [attr.value]=\"option.value\" (change)=\"onChange(option)\">\n <label [nasClass]=\"getClass('label')\" [attr.for]=\"getOptionId(option)\">\n <ng-container *ngIf=\"option?.href; else noLink\">\n <a [nasClass]=\"getClass('link', selectedValue == option.value && 'selected')\" [href]=\"option.href\" (click)=\"onClickHref($event, option)\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </a>\n </ng-container>\n <ng-template #noLink>\n <div [nasClass]=\"getClass('label--content')\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </div>\n </ng-template>\n </label>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"isRounded\">{{option.text}}</span>\n </span>\n </div>\n</div>\n<ng-template #reactiveForm>\n <div [nasClass]=\"mainClasses()\" >\n <h3 [nasClass]=\"getClass('title')\">{{label}}</h3>\n <div [nasClass]=\"getClass('items')\" [formGroup]=\"nasFormGroup\">\n <span [nasClass]=\"getClass('item')\" *ngFor=\"let option of options\">\n <input [formControlName]=\"nasFormControlName\" [nasClass]=\"getClass('radio')\" [attr.id]=\"getOptionId(option)\" [checked]=\"option.value === selectedValue\" [name]=\"group\" type=\"radio\" [value]=\"option.value\" (change)=\"onChange(option)\">\n <label [nasClass]=\"getClass('label')\" [attr.for]=\"getOptionId(option)\">\n <ng-container *ngIf=\"option?.href; else noLink\">\n <a [nasClass]=\"getClass('link', selectedValue == option.value && 'selected')\" [href]=\"option.href\" (click)=\"onClickHref($event, option)\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </a>\n </ng-container>\n <ng-template #noLink>\n <div [nasClass]=\"getClass('label--content')\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </div>\n </ng-template>\n </label>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"isRounded\">{{option.text}}</span>\n </span>\n </div>\n</div>\n</ng-template>\n\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-toggle__items{display:flex;flex-grow:2;perspective:1000px}.nas-toggle__title{font-size:16px;line-height:24px}.nas-toggle .icon-small{display:none;margin-left:-3px;margin-right:9px}@media (min-width: 640px){.nas-toggle .icon-small{display:inline-block}}.nas-toggle__item{transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:flip-in .55s ease both;animation-delay:.42s;-webkit-user-select:none;user-select:none;width:100%}.nas-toggle__item:nth-child(1){animation-delay:60ms}.nas-toggle__item:nth-child(2){animation-delay:.12s}.nas-toggle__item:nth-child(3){animation-delay:.18s}.nas-toggle__item:nth-child(4){animation-delay:.24s}.nas-toggle__item:nth-child(5){animation-delay:.3s}.nas-toggle__item:nth-child(6){animation-delay:.36s}.nas-toggle__item:not(:first-child){margin-left:2px}.nas-toggle__item:not(:last-child){margin-right:2px}.nas-toggle__label{font-family:NorwegianTextPro,Arial,
|
|
77
|
+
args: [{ selector: 'nas-toggle', template: "<div [nasClass]=\"mainClasses()\" *ngIf=\"!nasFormControlName; else reactiveForm\">\n <h3 [nasClass]=\"getClass('title')\">{{label}}</h3>\n <div [nasClass]=\"getClass('items')\">\n <span [nasClass]=\"getClass('item')\" *ngFor=\"let option of options\">\n <input [nasClass]=\"getClass('radio')\" [attr.id]=\"getOptionId(option)\" [checked]=\"option.value === selectedValue\" [attr.name]=\"group\" type=\"radio\" [attr.value]=\"option.value\" (change)=\"onChange(option)\">\n <label [nasClass]=\"getClass('label')\" [attr.for]=\"getOptionId(option)\">\n <ng-container *ngIf=\"option?.href; else noLink\">\n <a [nasClass]=\"getClass('link', selectedValue == option.value && 'selected')\" [href]=\"option.href\" (click)=\"onClickHref($event, option)\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </a>\n </ng-container>\n <ng-template #noLink>\n <div [nasClass]=\"getClass('label--content')\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </div>\n </ng-template>\n </label>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"isRounded\">{{option.text}}</span>\n </span>\n </div>\n</div>\n<ng-template #reactiveForm>\n <div [nasClass]=\"mainClasses()\" >\n <h3 [nasClass]=\"getClass('title')\">{{label}}</h3>\n <div [nasClass]=\"getClass('items')\" [formGroup]=\"nasFormGroup\">\n <span [nasClass]=\"getClass('item')\" *ngFor=\"let option of options\">\n <input [formControlName]=\"nasFormControlName\" [nasClass]=\"getClass('radio')\" [attr.id]=\"getOptionId(option)\" [checked]=\"option.value === selectedValue\" [name]=\"group\" type=\"radio\" [value]=\"option.value\" (change)=\"onChange(option)\">\n <label [nasClass]=\"getClass('label')\" [attr.for]=\"getOptionId(option)\">\n <ng-container *ngIf=\"option?.href; else noLink\">\n <a [nasClass]=\"getClass('link', selectedValue == option.value && 'selected')\" [href]=\"option.href\" (click)=\"onClickHref($event, option)\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </a>\n </ng-container>\n <ng-template #noLink>\n <div [nasClass]=\"getClass('label--content')\">\n <nas-icon *ngIf=\"option.icon\" [icon]=\"getIcon(option)\" [type]=\"iconType\"></nas-icon>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"!isRounded\">{{ option.text }}</span>\n </div>\n </ng-template>\n </label>\n <span [nasClass]=\"getClass('text')\" *ngIf=\"isRounded\">{{option.text}}</span>\n </span>\n </div>\n</div>\n</ng-template>\n\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-toggle__items{display:flex;flex-grow:2;perspective:1000px}.nas-toggle__title{font-size:16px;line-height:24px}.nas-toggle .icon-small{display:none;margin-left:-3px;margin-right:9px}@media (min-width: 640px){.nas-toggle .icon-small{display:inline-block}}.nas-toggle__item{transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:flip-in .55s ease both;animation-delay:.42s;-webkit-user-select:none;user-select:none;width:100%}.nas-toggle__item:nth-child(1){animation-delay:60ms}.nas-toggle__item:nth-child(2){animation-delay:.12s}.nas-toggle__item:nth-child(3){animation-delay:.18s}.nas-toggle__item:nth-child(4){animation-delay:.24s}.nas-toggle__item:nth-child(5){animation-delay:.3s}.nas-toggle__item:nth-child(6){animation-delay:.36s}.nas-toggle__item:not(:first-child){margin-left:2px}.nas-toggle__item:not(:last-child){margin-right:2px}.nas-toggle__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-size:16px;line-height:24px;text-align:center;color:#15273f;white-space:nowrap;cursor:pointer;margin:0;border:3px solid #E9E7E4;background-color:#e9e7e4;transition:transform .15s cubic-bezier(0,0,.1,1)}.nas-toggle__label--content{padding:12px}.nas-toggle__label:hover,.nas-toggle__label:focus{border-color:#15273f}.nas-toggle__label:active{transform:translateY(3px)}.nas-toggle__price{display:block}@media (min-width: 640px){.nas-toggle__price{display:none}}.nas-toggle--compact .nas-toggle__label{font-size:14px;line-height:20px}.nas-toggle--compact .nas-toggle__label--content,.nas-toggle--compact .nas-toggle__link{padding:6px}.nas-toggle--large{align-items:stretch}.nas-toggle--large .icon-small{margin:0}.nas-toggle--large .nas-toggle__label{height:100%;border-color:#fff;background-color:#fff}.nas-toggle--large .nas-toggle__label--content{padding:24px}.nas-toggle--large .nas-toggle__label:hover,.nas-toggle--large .nas-toggle__label:focus{border-color:#15273f}.nas-toggle--large .nas-toggle__item:not(:first-child){margin-left:6px}.nas-toggle--large .nas-toggle__item:not(:last-child){margin-right:6px}.nas-toggle--large .nas-toggle__text{display:block}@media (min-width: 640px){.nas-toggle--large .nas-toggle__price{display:block;margin-bottom:-9px}}.nas-toggle--large .nas-toggle__link{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.nas-toggle--light .nas-toggle__label{border-color:#fff;background-color:#fff}.nas-toggle--light .nas-toggle__label:hover,.nas-toggle--light .nas-toggle__label:focus{border-color:#15273f}.nas-toggle--grouped{padding-bottom:3px;border-bottom:3px solid #15273F}.nas-toggle--vertical .nas-toggle__items{flex-direction:column;padding-bottom:0;border-bottom:0}.nas-toggle--vertical .nas-toggle__item,.nas-toggle--vertical .nas-toggle__item:not(:first-child),.nas-toggle--vertical .nas-toggle__item:not(:last-child){margin:0 0 3px}.nas-toggle--vertical .nas-toggle__label{text-align:left}.nas-toggle--vertical .nas-toggle__label--content,.nas-toggle--vertical .nas-toggle__link{padding:6px 24px}.nas-toggle--rounded .nas-toggle__label{margin:0 auto 6px;height:83px;width:83px;border-radius:100%}.nas-toggle--rounded .nas-toggle__label:hover,.nas-toggle--rounded .nas-toggle__label:focus{border-color:#fff;background-color:#fff}.nas-toggle--rounded .nas-toggle__item:not(:first-child){margin-left:12px}.nas-toggle--rounded .nas-toggle__item:not(:last-child){margin-right:12px}.nas-toggle--rounded .nas-toggle__text{display:block;text-align:center}.nas-toggle--big .nas-toggle__label{height:96px;width:96px;padding-top:9px}.nas-toggle--small .nas-toggle__label{padding-top:6px;height:65px;width:65px}.nas-toggle__radio{position:fixed;top:-99px;left:-99px;opacity:0}.nas-toggle__radio:checked~.nas-toggle__label{color:#fff;border-color:#15273f;background-color:#15273f}.nas-toggle__radio:focus~.nas-toggle__label{box-shadow:0 0 1px 2px #e9e7e4,0 0 2px 3px #7ca4cd}.nas-toggle__radio:disabled~.nas-toggle__label{opacity:.4;pointer-events:none}.nas-toggle--scrollable .nas-toggle__items{overflow-x:auto;overflow-y:hidden;padding-bottom:20px;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar{height:4px;width:4px}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar-thumb{background:#15273f;border-radius:2px}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar-track-piece:end{margin-right:100px;background:#fff}.nas-toggle--scrollable .nas-toggle__items::-webkit-scrollbar-track-piece:start{margin-left:100px;background:#fff}.nas-toggle--scrollable .nas-toggle__items::-moz-scrollbar{height:4px;width:4px}.nas-toggle__link{display:block;color:#15273f;border:0;padding:12px}.nas-toggle__link--selected{color:#fff}\n"] }]
|
|
78
78
|
}], ctorParameters: function () { return []; }, propDecorators: { options: [{
|
|
79
79
|
type: Input
|
|
80
80
|
}], large: [{
|
|
@@ -126,11 +126,11 @@ export class TripSummaryComponent extends NasComponentBase {
|
|
|
126
126
|
}
|
|
127
127
|
}
|
|
128
128
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TripSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
129
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TripSummaryComponent, selector: "nas-trip-summary", inputs: { tripSummaryModel: "tripSummaryModel", expanded: "expanded", collapsable: "collapsable", displayMinimumInfo: "displayMinimumInfo", expandTitle: "expandTitle", arrivalLabel: "arrivalLabel", departureLabel: "departureLabel", arrivalEstimatedLabel: "arrivalEstimatedLabel", departureEstimatedLabel: "departureEstimatedLabel", dateFormat: "dateFormat", timeFormat: "timeFormat", transitHoursIndicator: "transitHoursIndicator", transitMinutesIndicator: "transitMinutesIndicator", transitLabel: "transitLabel", locale: "locale", timeZone: "timeZone" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [nasClass]=\"getContainerClass()\" *ngIf=\"tripSummaryModel && journeyModel\">\n\n <nas-journey [timeZone]=\"timeZone\" [locale]=\"locale\" [journeyModel]=\"journeyModel\" [dateFormat]=\"dateFormat\" [timeFormat]=\"timeFormat\" [arrivalLabel]=\"arrivalLabel\"\n [departureLabel]=\"departureLabel\" [arrivalEstimatedLabel]=\"arrivalEstimatedLabel\" [departureEstimatedLabel]=\"departureEstimatedLabel\">\n\n <div *ngIf=\"exists(collapsable); else tripDetailsRef;\">\n <nas-accordion simple [title]=\"expandTitle\" [expanded]=\"expanded\">\n <ng-template [ngTemplateOutlet]=\"tripDetailsRef\"></ng-template>\n </nas-accordion>\n </div>\n\n <ng-template #tripDetailsRef>\n <div [nasClass]=\"getClass('details')\" *ngFor=\"let tripSummary of tripSummaryModel.flightList;\">\n\n <div [nasClass]=\"getClass('view')\" *ngFor=\"let detail of tripSummary.flightDetailList;index as flightDetailsIndex\">\n\n <div *ngIf=\"exists(displayMinimumInfo) && flightDetailsIndex < 2 || !exists(displayMinimumInfo)\">\n <div>\n\n <div [nasClass]=\"getClass('item')\">\n <div [nasClass]=\"getClass('',['title'])\">\n {{detail.header}}\n </div>\n <div [nasClass]=\"getClass('',['explanation'])\" *ngFor=\"let explanation of detail.itemDetailList\">\n <span [nasClass]=\"getClass('',['text'])\">\n {{explanation.text}}\n </span>\n <span [nasClass]=\"getClass('',['link'])\" *ngIf=\"explanation?.link?.text.length\">\n <a href=\"{{explanation?.link?.url}}\">{{explanation?.link?.text}}</a>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div *ngIf=\"tripSummary.stopover\" [nasClass]=\"getClass('stopover')\">\n <nas-journey-stopover [timeZone]=\"timeZone\" [locale]=\"locale\" \n [journeyStopoverModel]=\"tripSummary.stopover\" [dateFormat]=\"dateFormat\"\n [transitHoursIndicator]=\"transitHoursIndicator\" [transitMinutesIndicator]=\"transitMinutesIndicator\"\n [timeFormat]=\"timeFormat\" [transitLabel]=\"transitLabel\" [arrivalTimeLabel]=\"arrivalLabel\"\n [departureTimeLabel]=\"departureLabel\">\n </nas-journey-stopover>\n </div>\n\n </div>\n\n </ng-template>\n </nas-journey>\n</div>\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-trip-summary{position:relative}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item{border-bottom:2px solid #E9E7E4;padding:10px;color:#15273f}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item .nas-trip-summary--title{font-family:NorwegianTextPro,Arial,
|
|
129
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TripSummaryComponent, selector: "nas-trip-summary", inputs: { tripSummaryModel: "tripSummaryModel", expanded: "expanded", collapsable: "collapsable", displayMinimumInfo: "displayMinimumInfo", expandTitle: "expandTitle", arrivalLabel: "arrivalLabel", departureLabel: "departureLabel", arrivalEstimatedLabel: "arrivalEstimatedLabel", departureEstimatedLabel: "departureEstimatedLabel", dateFormat: "dateFormat", timeFormat: "timeFormat", transitHoursIndicator: "transitHoursIndicator", transitMinutesIndicator: "transitMinutesIndicator", transitLabel: "transitLabel", locale: "locale", timeZone: "timeZone" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [nasClass]=\"getContainerClass()\" *ngIf=\"tripSummaryModel && journeyModel\">\n\n <nas-journey [timeZone]=\"timeZone\" [locale]=\"locale\" [journeyModel]=\"journeyModel\" [dateFormat]=\"dateFormat\" [timeFormat]=\"timeFormat\" [arrivalLabel]=\"arrivalLabel\"\n [departureLabel]=\"departureLabel\" [arrivalEstimatedLabel]=\"arrivalEstimatedLabel\" [departureEstimatedLabel]=\"departureEstimatedLabel\">\n\n <div *ngIf=\"exists(collapsable); else tripDetailsRef;\">\n <nas-accordion simple [title]=\"expandTitle\" [expanded]=\"expanded\">\n <ng-template [ngTemplateOutlet]=\"tripDetailsRef\"></ng-template>\n </nas-accordion>\n </div>\n\n <ng-template #tripDetailsRef>\n <div [nasClass]=\"getClass('details')\" *ngFor=\"let tripSummary of tripSummaryModel.flightList;\">\n\n <div [nasClass]=\"getClass('view')\" *ngFor=\"let detail of tripSummary.flightDetailList;index as flightDetailsIndex\">\n\n <div *ngIf=\"exists(displayMinimumInfo) && flightDetailsIndex < 2 || !exists(displayMinimumInfo)\">\n <div>\n\n <div [nasClass]=\"getClass('item')\">\n <div [nasClass]=\"getClass('',['title'])\">\n {{detail.header}}\n </div>\n <div [nasClass]=\"getClass('',['explanation'])\" *ngFor=\"let explanation of detail.itemDetailList\">\n <span [nasClass]=\"getClass('',['text'])\">\n {{explanation.text}}\n </span>\n <span [nasClass]=\"getClass('',['link'])\" *ngIf=\"explanation?.link?.text.length\">\n <a href=\"{{explanation?.link?.url}}\">{{explanation?.link?.text}}</a>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div *ngIf=\"tripSummary.stopover\" [nasClass]=\"getClass('stopover')\">\n <nas-journey-stopover [timeZone]=\"timeZone\" [locale]=\"locale\" \n [journeyStopoverModel]=\"tripSummary.stopover\" [dateFormat]=\"dateFormat\"\n [transitHoursIndicator]=\"transitHoursIndicator\" [transitMinutesIndicator]=\"transitMinutesIndicator\"\n [timeFormat]=\"timeFormat\" [transitLabel]=\"transitLabel\" [arrivalTimeLabel]=\"arrivalLabel\"\n [departureTimeLabel]=\"departureLabel\">\n </nas-journey-stopover>\n </div>\n\n </div>\n\n </ng-template>\n </nas-journey>\n</div>\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-trip-summary{position:relative}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item{border-bottom:2px solid #E9E7E4;padding:10px;color:#15273f}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item .nas-trip-summary--title{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;line-height:24px}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item .nas-trip-summary--explanation{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:400;font-size:14px;line-height:20px;display:flex;place-content:space-between}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item .nas-trip-summary--explanation .nas-trip-summary--link{align-self:center}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__view:first-child .nas-trip-summary__item{border-top:2px solid #E9E7E4}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__stopover{margin:5px 0 20px}:host ::ng-deep .nas-trip-summary .nas-accordion--simple .nas-accordion__toggle{margin-bottom:0;background-color:transparent}:host ::ng-deep .nas-trip-summary .nas-accordion--simple .nas-accordion__content{background-color:transparent;padding-left:0}:host ::ng-deep .nas-trip-summary .nas-accordion{margin-bottom:0}:host ::ng-deep .nas-trip-summary .nas-journey__body .nas-journey__flight-details:first-child{padding-bottom:5px!important}:host ::ng-deep .nas-trip-summary .nas-journey__body .nas-journey__flight-details:last-child{padding-top:5px!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: i3.AccordionComponent, selector: "nas-accordion", inputs: ["expanded", "title", "badge", "icon", "simple", "spaced", "small", "inverted", "containerOnToggle", "nopadding", "transparent", "approve", "primary", "warning", "badgeInfo", "badgeSuccess", "badgeWarning", "badgeError", "cssClass", "cssStyle"], outputs: ["toggleChange"] }, { kind: "component", type: i4.JourneyComponent, selector: "nas-journey", inputs: ["journeyModel", "dateFormat", "timeFormat", "arrivalLabel", "departureLabel", "locale", "timeZone"] }, { kind: "component", type: i5.JourneyStopoverComponent, selector: "nas-journey-stopover", inputs: ["journeyStopoverModel", "transitLabel", "arrivalTimeLabel", "departureTimeLabel", "timeFormat", "dateFormat", "transitHoursIndicator", "transitMinutesIndicator", "locale", "timeZone"] }] }); }
|
|
130
130
|
}
|
|
131
131
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TripSummaryComponent, decorators: [{
|
|
132
132
|
type: Component,
|
|
133
|
-
args: [{ selector: 'nas-trip-summary', template: "<div [nasClass]=\"getContainerClass()\" *ngIf=\"tripSummaryModel && journeyModel\">\n\n <nas-journey [timeZone]=\"timeZone\" [locale]=\"locale\" [journeyModel]=\"journeyModel\" [dateFormat]=\"dateFormat\" [timeFormat]=\"timeFormat\" [arrivalLabel]=\"arrivalLabel\"\n [departureLabel]=\"departureLabel\" [arrivalEstimatedLabel]=\"arrivalEstimatedLabel\" [departureEstimatedLabel]=\"departureEstimatedLabel\">\n\n <div *ngIf=\"exists(collapsable); else tripDetailsRef;\">\n <nas-accordion simple [title]=\"expandTitle\" [expanded]=\"expanded\">\n <ng-template [ngTemplateOutlet]=\"tripDetailsRef\"></ng-template>\n </nas-accordion>\n </div>\n\n <ng-template #tripDetailsRef>\n <div [nasClass]=\"getClass('details')\" *ngFor=\"let tripSummary of tripSummaryModel.flightList;\">\n\n <div [nasClass]=\"getClass('view')\" *ngFor=\"let detail of tripSummary.flightDetailList;index as flightDetailsIndex\">\n\n <div *ngIf=\"exists(displayMinimumInfo) && flightDetailsIndex < 2 || !exists(displayMinimumInfo)\">\n <div>\n\n <div [nasClass]=\"getClass('item')\">\n <div [nasClass]=\"getClass('',['title'])\">\n {{detail.header}}\n </div>\n <div [nasClass]=\"getClass('',['explanation'])\" *ngFor=\"let explanation of detail.itemDetailList\">\n <span [nasClass]=\"getClass('',['text'])\">\n {{explanation.text}}\n </span>\n <span [nasClass]=\"getClass('',['link'])\" *ngIf=\"explanation?.link?.text.length\">\n <a href=\"{{explanation?.link?.url}}\">{{explanation?.link?.text}}</a>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div *ngIf=\"tripSummary.stopover\" [nasClass]=\"getClass('stopover')\">\n <nas-journey-stopover [timeZone]=\"timeZone\" [locale]=\"locale\" \n [journeyStopoverModel]=\"tripSummary.stopover\" [dateFormat]=\"dateFormat\"\n [transitHoursIndicator]=\"transitHoursIndicator\" [transitMinutesIndicator]=\"transitMinutesIndicator\"\n [timeFormat]=\"timeFormat\" [transitLabel]=\"transitLabel\" [arrivalTimeLabel]=\"arrivalLabel\"\n [departureTimeLabel]=\"departureLabel\">\n </nas-journey-stopover>\n </div>\n\n </div>\n\n </ng-template>\n </nas-journey>\n</div>\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-trip-summary{position:relative}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item{border-bottom:2px solid #E9E7E4;padding:10px;color:#15273f}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item .nas-trip-summary--title{font-family:NorwegianTextPro,Arial,
|
|
133
|
+
args: [{ selector: 'nas-trip-summary', template: "<div [nasClass]=\"getContainerClass()\" *ngIf=\"tripSummaryModel && journeyModel\">\n\n <nas-journey [timeZone]=\"timeZone\" [locale]=\"locale\" [journeyModel]=\"journeyModel\" [dateFormat]=\"dateFormat\" [timeFormat]=\"timeFormat\" [arrivalLabel]=\"arrivalLabel\"\n [departureLabel]=\"departureLabel\" [arrivalEstimatedLabel]=\"arrivalEstimatedLabel\" [departureEstimatedLabel]=\"departureEstimatedLabel\">\n\n <div *ngIf=\"exists(collapsable); else tripDetailsRef;\">\n <nas-accordion simple [title]=\"expandTitle\" [expanded]=\"expanded\">\n <ng-template [ngTemplateOutlet]=\"tripDetailsRef\"></ng-template>\n </nas-accordion>\n </div>\n\n <ng-template #tripDetailsRef>\n <div [nasClass]=\"getClass('details')\" *ngFor=\"let tripSummary of tripSummaryModel.flightList;\">\n\n <div [nasClass]=\"getClass('view')\" *ngFor=\"let detail of tripSummary.flightDetailList;index as flightDetailsIndex\">\n\n <div *ngIf=\"exists(displayMinimumInfo) && flightDetailsIndex < 2 || !exists(displayMinimumInfo)\">\n <div>\n\n <div [nasClass]=\"getClass('item')\">\n <div [nasClass]=\"getClass('',['title'])\">\n {{detail.header}}\n </div>\n <div [nasClass]=\"getClass('',['explanation'])\" *ngFor=\"let explanation of detail.itemDetailList\">\n <span [nasClass]=\"getClass('',['text'])\">\n {{explanation.text}}\n </span>\n <span [nasClass]=\"getClass('',['link'])\" *ngIf=\"explanation?.link?.text.length\">\n <a href=\"{{explanation?.link?.url}}\">{{explanation?.link?.text}}</a>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div *ngIf=\"tripSummary.stopover\" [nasClass]=\"getClass('stopover')\">\n <nas-journey-stopover [timeZone]=\"timeZone\" [locale]=\"locale\" \n [journeyStopoverModel]=\"tripSummary.stopover\" [dateFormat]=\"dateFormat\"\n [transitHoursIndicator]=\"transitHoursIndicator\" [transitMinutesIndicator]=\"transitMinutesIndicator\"\n [timeFormat]=\"timeFormat\" [transitLabel]=\"transitLabel\" [arrivalTimeLabel]=\"arrivalLabel\"\n [departureTimeLabel]=\"departureLabel\">\n </nas-journey-stopover>\n </div>\n\n </div>\n\n </ng-template>\n </nas-journey>\n</div>\n", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-trip-summary{position:relative}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item{border-bottom:2px solid #E9E7E4;padding:10px;color:#15273f}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item .nas-trip-summary--title{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;line-height:24px}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item .nas-trip-summary--explanation{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:400;font-size:14px;line-height:20px;display:flex;place-content:space-between}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__item .nas-trip-summary--explanation .nas-trip-summary--link{align-self:center}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__view:first-child .nas-trip-summary__item{border-top:2px solid #E9E7E4}.nas-trip-summary .nas-trip-summary__details .nas-trip-summary__stopover{margin:5px 0 20px}:host ::ng-deep .nas-trip-summary .nas-accordion--simple .nas-accordion__toggle{margin-bottom:0;background-color:transparent}:host ::ng-deep .nas-trip-summary .nas-accordion--simple .nas-accordion__content{background-color:transparent;padding-left:0}:host ::ng-deep .nas-trip-summary .nas-accordion{margin-bottom:0}:host ::ng-deep .nas-trip-summary .nas-journey__body .nas-journey__flight-details:first-child{padding-bottom:5px!important}:host ::ng-deep .nas-trip-summary .nas-journey__body .nas-journey__flight-details:last-child{padding-top:5px!important}\n"] }]
|
|
134
134
|
}], ctorParameters: function () { return []; }, propDecorators: { tripSummaryModel: [{
|
|
135
135
|
type: Input
|
|
136
136
|
}], expanded: [{
|