@colijnit/configurator 1.0.16 → 1.0.17
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/bundles/colijnit-configurator.umd.js +6 -6
- package/bundles/colijnit-configurator.umd.js.map +1 -1
- package/bundles/colijnit-configurator.umd.min.js +2 -2
- package/bundles/colijnit-configurator.umd.min.js.map +1 -1
- package/colijnit-configurator.metadata.json +1 -1
- package/esm2015/app/components/answers/answer/answer.component.js +16 -11
- package/esm2015/app/components/answers/answers.component.js +16 -13
- package/esm2015/app/components/selections/selections.component.js +44 -24
- package/esm5/app/components/answers/answer/answer.component.js +3 -3
- package/esm5/app/components/answers/answers.component.js +3 -3
- package/esm5/app/components/selections/selections.component.js +3 -3
- package/fesm2015/colijnit-configurator.js +73 -45
- package/fesm2015/colijnit-configurator.js.map +1 -1
- package/fesm5/colijnit-configurator.js +6 -6
- package/fesm5/colijnit-configurator.js.map +1 -1
- package/package.json +1 -1
|
@@ -2102,8 +2102,8 @@ var AnswersComponent = /** @class */ (function () {
|
|
|
2102
2102
|
AnswersComponent = __decorate([
|
|
2103
2103
|
Component({
|
|
2104
2104
|
selector: "answers",
|
|
2105
|
-
template: "\n <
|
|
2106
|
-
styles: ["
|
|
2105
|
+
template: "\n <div class=\"ione-configurator\">\n <div class=\"rp-answers-slideout\">\n <h2 class=\"answers-title\" [textContent]=\"selectionTitle\"></h2>\n <div class=\"answers-container\" visibilityObserverMaster>\n <answer *ngFor=\"let answer of answers\"\n (click)=\"answerClick.emit(answer)\"\n [answer]=\"answer\"\n visibilityObserver\n #intersection=\"intersection\"\n [observerEnabled]=\"true\"\n [showing]=\"intersection.isIntersecting\"\n ></answer>\n </div>\n \n </div>\n </div>\n ",
|
|
2106
|
+
styles: [".ione-configurator .rp-answers-slideout{position:absolute;top:0;right:0;width:400px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.ione-configurator .answers-title{margin-left:10px;color:#1a1a1a}.ione-configurator .answers-container{height:100vh;overflow-y:scroll}.ione-configurator .answer-content{position:relative;overflow:hidden;cursor:pointer;font-size:12px;border:1px solid #d3d3d3;padding:10px;display:flex;flex-direction:row;border-radius:3px;margin-bottom:3px;box-shadow:2px 1px rgba(211,211,211,.5);background:#fff}.ione-configurator .thumbnail{width:54px;min-width:54px;height:54px;min-height:54px;border:1px solid #d3d3d3;border-radius:5px}.ione-configurator .img-size{width:54px;min-width:54px;height:54px;min-height:54px;border-radius:5px}.ione-configurator .answer-wrapper{display:block}.ione-configurator .answer-title{font-size:12px;position:relative;overflow:hidden;cursor:pointer}.ione-configurator .question{font-weight:700;color:#1a1a1a}.ione-configurator .answer{font-size:12px;font-style:italic;margin-top:3px}.ione-configurator .collapse-content,.ione-configurator .collapse-wrapper{display:block}.ione-configurator .collapse-handle{position:absolute;top:10px;right:12px;border:solid #000;border-width:0 3px 3px 0;display:inline-block;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.ione-configurator .collapse-handle.expanded{transform:rotate(-135deg);-webkit-transform:rotate(-135deg)}.ione-configurator .child-selection{margin-left:10px;display:flex;flex-direction:column;margin-top:5px}.ione-configurator .mat-title{margin-left:10px;color:#1a1a1a}.ione-configurator .drawer__header{height:48px}.ione-configurator .rp-selections-summary{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;background:0 0;overflow:auto;position:absolute;top:0;right:0;width:400px}.ione-configurator .selections-content{overflow-y:auto}.ione-configurator .co-summary-line{position:relative;overflow:hidden;cursor:pointer;font-size:12px;border:1px solid #d3d3d3;padding:10px;display:flex;flex-direction:row;border-radius:3px;margin-bottom:3px;box-shadow:2px 1px rgba(211,211,211,.5);background:#fff}.ione-configurator .selection-thumbnail{width:54px;min-width:54px;height:54px;min-height:54px;border:1px solid #d3d3d3;border-radius:5px}.ione-configurator .selection-img{width:54px;min-width:54px;height:54px;min-height:54px;border-radius:5px}.ione-configurator .answer-thumbnail{width:54px;min-width:54px;height:54px;min-height:54px;border:1px solid #d3d3d3;border-radius:5px}.ione-configurator .answer-img{width:54px;min-width:54px;height:54px;min-height:54px;border-radius:5px}.ione-configurator .unloaded{background-color:#d3d3d3}.ione-configurator .titles{margin-left:14px;-ms-grid-row-align:center;align-self:center}.ione-configurator .title-wrapper{display:flex;flex-direction:column}.ione-configurator .answer-title-wrapper{text-align:center;-ms-grid-row-align:center;align-self:center;margin-left:14px}"]
|
|
2107
2107
|
})
|
|
2108
2108
|
], AnswersComponent);
|
|
2109
2109
|
return AnswersComponent;
|
|
@@ -2216,7 +2216,7 @@ var AnswerComponent = /** @class */ (function () {
|
|
|
2216
2216
|
AnswerComponent = __decorate([
|
|
2217
2217
|
Component({
|
|
2218
2218
|
selector: 'answer',
|
|
2219
|
-
template: "\n <
|
|
2219
|
+
template: "\n <div class=\"ione-configurator\">\n <div class=\"answer-wrapper\">\n <div class=\"answer-content\" @answerAppear>\n <div class=\"answer-thumbnail\">\n <rp-loader *ngIf=\"answer.imageData === ''\"></rp-loader>\n <img *ngIf=\"answer.imageData !== '' && answer.imageData !== null\" class=\"answer-img\" [src]=\"answer.imageData\">\n </div>\n <div class=\"answer-title-wrapper\">\n <span class=\"answer-title\" [textContent]=\"answer.commercialAnswer\"></span>\n </div>\n <div class=\"price\">\n <span class=\"price-value\"></span>\n </div>\n </div>\n </div>\n </div>\n ",
|
|
2220
2220
|
animations: [
|
|
2221
2221
|
trigger('answerAppear', [
|
|
2222
2222
|
state('void', style({ 'background': '#dbdbdb' })),
|
|
@@ -2224,7 +2224,7 @@ var AnswerComponent = /** @class */ (function () {
|
|
|
2224
2224
|
transition('void <=> *', animate(500))
|
|
2225
2225
|
])
|
|
2226
2226
|
],
|
|
2227
|
-
styles: [".answer{font-size:12px;position:relative;overflow:hidden;cursor:pointer}
|
|
2227
|
+
styles: [".ione-configurator .rp-answers-slideout{position:absolute;top:0;right:0;width:400px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.ione-configurator .answers-title{margin-left:10px;color:#1a1a1a}.ione-configurator .answers-container{height:100vh;overflow-y:scroll}.ione-configurator .answer-content{position:relative;overflow:hidden;cursor:pointer;font-size:12px;border:1px solid #d3d3d3;padding:10px;display:flex;flex-direction:row;border-radius:3px;margin-bottom:3px;box-shadow:2px 1px rgba(211,211,211,.5);background:#fff}.ione-configurator .thumbnail{width:54px;min-width:54px;height:54px;min-height:54px;border:1px solid #d3d3d3;border-radius:5px}.ione-configurator .img-size{width:54px;min-width:54px;height:54px;min-height:54px;border-radius:5px}.ione-configurator .answer-wrapper{display:block}.ione-configurator .answer-title{font-size:12px;position:relative;overflow:hidden;cursor:pointer}.ione-configurator .question{font-weight:700;color:#1a1a1a}.ione-configurator .answer{font-size:12px;font-style:italic;margin-top:3px}.ione-configurator .collapse-content,.ione-configurator .collapse-wrapper{display:block}.ione-configurator .collapse-handle{position:absolute;top:10px;right:12px;border:solid #000;border-width:0 3px 3px 0;display:inline-block;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.ione-configurator .collapse-handle.expanded{transform:rotate(-135deg);-webkit-transform:rotate(-135deg)}.ione-configurator .child-selection{margin-left:10px;display:flex;flex-direction:column;margin-top:5px}.ione-configurator .mat-title{margin-left:10px;color:#1a1a1a}.ione-configurator .drawer__header{height:48px}.ione-configurator .rp-selections-summary{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;background:0 0;overflow:auto;position:absolute;top:0;right:0;width:400px}.ione-configurator .selections-content{overflow-y:auto}.ione-configurator .co-summary-line{position:relative;overflow:hidden;cursor:pointer;font-size:12px;border:1px solid #d3d3d3;padding:10px;display:flex;flex-direction:row;border-radius:3px;margin-bottom:3px;box-shadow:2px 1px rgba(211,211,211,.5);background:#fff}.ione-configurator .selection-thumbnail{width:54px;min-width:54px;height:54px;min-height:54px;border:1px solid #d3d3d3;border-radius:5px}.ione-configurator .selection-img{width:54px;min-width:54px;height:54px;min-height:54px;border-radius:5px}.ione-configurator .answer-thumbnail{width:54px;min-width:54px;height:54px;min-height:54px;border:1px solid #d3d3d3;border-radius:5px}.ione-configurator .answer-img{width:54px;min-width:54px;height:54px;min-height:54px;border-radius:5px}.ione-configurator .unloaded{background-color:#d3d3d3}.ione-configurator .titles{margin-left:14px;-ms-grid-row-align:center;align-self:center}.ione-configurator .title-wrapper{display:flex;flex-direction:column}.ione-configurator .answer-title-wrapper{text-align:center;-ms-grid-row-align:center;align-self:center;margin-left:14px}"]
|
|
2228
2228
|
})
|
|
2229
2229
|
], AnswerComponent);
|
|
2230
2230
|
return AnswerComponent;
|
|
@@ -2485,7 +2485,7 @@ var SelectionsComponent = /** @class */ (function () {
|
|
|
2485
2485
|
SelectionsComponent = __decorate([
|
|
2486
2486
|
Component({
|
|
2487
2487
|
selector: "selections",
|
|
2488
|
-
template: "\n <
|
|
2488
|
+
template: "\n <div class=\"ione-configurator\">\n <div class=\"rp-selections-summary\">\n <header class=\"drawer__header\">\n <h2 class=\"mat-title\" [textContent]=\"'Configuratie'\"></h2>\n <!--<button>-->\n <!---->\n <!--</button>-->\n </header>\n <div class=\"selections-content\">\n <ng-container *ngFor=\"let selectionViewModel of selectionViewModels\">\n\n <div class=\"co-summary-line\" (click)=\"selectSelection(selectionViewModel.selection, $event)\">\n <div class=\"selection-thumbnail\">\n <rp-loader *ngIf=\"selectionViewModel.thumbnail === ''\"></rp-loader>\n <img visibilityObserver *ngIf=\"selectionViewModel.thumbnail !== '' && selectionViewModel.thumbnail !== null\" class=\"selection-img\" [src]=\"selectionViewModel.thumbnail\">\n </div>\n <div class=\"titles\">\n <div class=\"title-wrapper\">\n <label class=\"question\" [textContent]=\"selectionViewModel.selection.question\"></label>\n <span class=\"answer\" [textContent]=\"selectionViewModel.selection.answer\"></span>\n <div *ngIf=\"selectionViewModel.children.length > 0 && selectionViewModel.expanded\" @showHideChildren>\n <div class=\"child-selection\" *ngFor=\"let selection of selectionViewModel.children\"\n (click)=\"selectSelection(selection, $event)\"\n >\n <label class=\"question\" [textContent]=\"selection.commercialQuestion\"></label>\n <span class=\"answer\" [textContent]=\"selection.answer\"></span>\n </div>\n </div>\n </div>\n </div>\n \n <div class=\"price-wrapper\">\n <span class=\"price-value\"></span>\n </div>\n\n <div class=\"collapse-wrapper\">\n <div class=\"collapse-content\">\n <div class=\"collapse-handle\" [class.expanded]=\"selectionViewModel.expanded\"\n *ngIf=\"selectionViewModel.children.length > 0\" (click)=\"expandClicked(selectionViewModel, $event)\"></div>\n </div>\n </div>\n </div>\n\n </ng-container>\n </div>\n </div>\n </div>\n ",
|
|
2489
2489
|
animations: [
|
|
2490
2490
|
trigger('showHideChildren', [
|
|
2491
2491
|
state('void', style({ 'height': '0' })),
|
|
@@ -2493,7 +2493,7 @@ var SelectionsComponent = /** @class */ (function () {
|
|
|
2493
2493
|
transition('void <=> *', animate(200))
|
|
2494
2494
|
])
|
|
2495
2495
|
],
|
|
2496
|
-
styles: ["
|
|
2496
|
+
styles: [".ione-configurator .rp-answers-slideout{position:absolute;top:0;right:0;width:400px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.ione-configurator .answers-title{margin-left:10px;color:#1a1a1a}.ione-configurator .answers-container{height:100vh;overflow-y:scroll}.ione-configurator .answer-content{position:relative;overflow:hidden;cursor:pointer;font-size:12px;border:1px solid #d3d3d3;padding:10px;display:flex;flex-direction:row;border-radius:3px;margin-bottom:3px;box-shadow:2px 1px rgba(211,211,211,.5);background:#fff}.ione-configurator .thumbnail{width:54px;min-width:54px;height:54px;min-height:54px;border:1px solid #d3d3d3;border-radius:5px}.ione-configurator .img-size{width:54px;min-width:54px;height:54px;min-height:54px;border-radius:5px}.ione-configurator .answer-wrapper{display:block}.ione-configurator .answer-title{font-size:12px;position:relative;overflow:hidden;cursor:pointer}.ione-configurator .question{font-weight:700;color:#1a1a1a}.ione-configurator .answer{font-size:12px;font-style:italic;margin-top:3px}.ione-configurator .collapse-content,.ione-configurator .collapse-wrapper{display:block}.ione-configurator .collapse-handle{position:absolute;top:10px;right:12px;border:solid #000;border-width:0 3px 3px 0;display:inline-block;padding:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.ione-configurator .collapse-handle.expanded{transform:rotate(-135deg);-webkit-transform:rotate(-135deg)}.ione-configurator .child-selection{margin-left:10px;display:flex;flex-direction:column;margin-top:5px}.ione-configurator .mat-title{margin-left:10px;color:#1a1a1a}.ione-configurator .drawer__header{height:48px}.ione-configurator .rp-selections-summary{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;background:0 0;overflow:auto;position:absolute;top:0;right:0;width:400px}.ione-configurator .selections-content{overflow-y:auto}.ione-configurator .co-summary-line{position:relative;overflow:hidden;cursor:pointer;font-size:12px;border:1px solid #d3d3d3;padding:10px;display:flex;flex-direction:row;border-radius:3px;margin-bottom:3px;box-shadow:2px 1px rgba(211,211,211,.5);background:#fff}.ione-configurator .selection-thumbnail{width:54px;min-width:54px;height:54px;min-height:54px;border:1px solid #d3d3d3;border-radius:5px}.ione-configurator .selection-img{width:54px;min-width:54px;height:54px;min-height:54px;border-radius:5px}.ione-configurator .answer-thumbnail{width:54px;min-width:54px;height:54px;min-height:54px;border:1px solid #d3d3d3;border-radius:5px}.ione-configurator .answer-img{width:54px;min-width:54px;height:54px;min-height:54px;border-radius:5px}.ione-configurator .unloaded{background-color:#d3d3d3}.ione-configurator .titles{margin-left:14px;-ms-grid-row-align:center;align-self:center}.ione-configurator .title-wrapper{display:flex;flex-direction:column}.ione-configurator .answer-title-wrapper{text-align:center;-ms-grid-row-align:center;align-self:center;margin-left:14px}"]
|
|
2497
2497
|
})
|
|
2498
2498
|
], SelectionsComponent);
|
|
2499
2499
|
return SelectionsComponent;
|