@dereekb/dbx-form 13.43.0 → 14.0.0
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/fesm2022/dereekb-dbx-form-calendar.mjs +156 -196
- package/fesm2022/dereekb-dbx-form-calendar.mjs.map +1 -1
- package/fesm2022/dereekb-dbx-form-expand.field.component-BO_8nxHg.mjs +70 -0
- package/fesm2022/dereekb-dbx-form-expand.field.component-BO_8nxHg.mjs.map +1 -0
- package/fesm2022/dereekb-dbx-form-flex.wrapper.component-C54ACtzt.mjs +40 -0
- package/fesm2022/dereekb-dbx-form-flex.wrapper.component-C54ACtzt.mjs.map +1 -0
- package/fesm2022/dereekb-dbx-form-info.field.component-CImBKYE7.mjs +61 -0
- package/fesm2022/dereekb-dbx-form-info.field.component-CImBKYE7.mjs.map +1 -0
- package/fesm2022/{dereekb-dbx-form-info.wrapper.component-ChSBMxgm.mjs → dereekb-dbx-form-info.wrapper.component-DdDCQ47C.mjs} +14 -13
- package/fesm2022/dereekb-dbx-form-info.wrapper.component-DdDCQ47C.mjs.map +1 -0
- package/fesm2022/dereekb-dbx-form-mapbox.mjs +100 -60
- package/fesm2022/dereekb-dbx-form-mapbox.mjs.map +1 -1
- package/fesm2022/dereekb-dbx-form-quiz.mjs +106 -73
- package/fesm2022/dereekb-dbx-form-quiz.mjs.map +1 -1
- package/fesm2022/{dereekb-dbx-form-section.wrapper.component-BoR5-a8A.mjs → dereekb-dbx-form-section.wrapper.component-CpXSvC5e.mjs} +14 -13
- package/fesm2022/dereekb-dbx-form-section.wrapper.component-CpXSvC5e.mjs.map +1 -0
- package/fesm2022/dereekb-dbx-form-style-demo.mjs +30 -39
- package/fesm2022/dereekb-dbx-form-style-demo.mjs.map +1 -1
- package/fesm2022/{dereekb-dbx-form-style.wrapper.component-C4dVNND_.mjs → dereekb-dbx-form-style.wrapper.component-CPzzgQXk.mjs} +12 -12
- package/fesm2022/dereekb-dbx-form-style.wrapper.component-CPzzgQXk.mjs.map +1 -0
- package/fesm2022/dereekb-dbx-form.mjs +949 -635
- package/fesm2022/dereekb-dbx-form.mjs.map +1 -1
- package/package.json +24 -24
- package/types/dereekb-dbx-form-calendar.d.ts +55 -64
- package/types/dereekb-dbx-form.d.ts +51 -293
- package/fesm2022/dereekb-dbx-form-expand.field.component-uqVNtX2s.mjs +0 -56
- package/fesm2022/dereekb-dbx-form-expand.field.component-uqVNtX2s.mjs.map +0 -1
- package/fesm2022/dereekb-dbx-form-flex.wrapper.component-C2nN1Oi1.mjs +0 -39
- package/fesm2022/dereekb-dbx-form-flex.wrapper.component-C2nN1Oi1.mjs.map +0 -1
- package/fesm2022/dereekb-dbx-form-info.field.component-CBAXCDdO.mjs +0 -50
- package/fesm2022/dereekb-dbx-form-info.field.component-CBAXCDdO.mjs.map +0 -1
- package/fesm2022/dereekb-dbx-form-info.wrapper.component-ChSBMxgm.mjs.map +0 -1
- package/fesm2022/dereekb-dbx-form-section.wrapper.component-BoR5-a8A.mjs.map +0 -1
- package/fesm2022/dereekb-dbx-form-style.wrapper.component-C4dVNND_.mjs.map +0 -1
|
@@ -134,10 +134,10 @@ class QuizStore extends ComponentStore {
|
|
|
134
134
|
goToPreviousQuestion = this.updater((state) => advanceQuestionOnState(state, -1));
|
|
135
135
|
setLockQuizNavigation = this.updater((state, lockQuizNavigation) => ({ ...state, lockQuizNavigation }));
|
|
136
136
|
setSubmittedQuiz = this.updater((state, submittedQuiz) => ({ ...state, submittedQuiz }));
|
|
137
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
138
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
137
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
138
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizStore });
|
|
139
139
|
}
|
|
140
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
140
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizStore, decorators: [{
|
|
141
141
|
type: Injectable
|
|
142
142
|
}], ctorParameters: () => [] });
|
|
143
143
|
function computeAdvanceIndexOnState(state, advancement) {
|
|
@@ -294,19 +294,23 @@ function provideCurrentQuestionQuizQuestionAccessor() {
|
|
|
294
294
|
*/
|
|
295
295
|
class QuizComponent {
|
|
296
296
|
quizStore = inject(QuizStore);
|
|
297
|
-
quiz = input.required(
|
|
297
|
+
quiz = input.required(/* @ts-ignore */
|
|
298
|
+
...(ngDevMode ? [{ debugName: "quiz" }] : /* istanbul ignore next */ []));
|
|
298
299
|
keysFilter = ['Enter', 'ArrowLeft', 'ArrowRight'];
|
|
299
300
|
quizEffect = effect(() => {
|
|
300
301
|
const quiz = this.quiz();
|
|
301
302
|
this.quizStore.setQuiz(quiz);
|
|
302
|
-
},
|
|
303
|
+
}, /* @ts-ignore */
|
|
304
|
+
...(ngDevMode ? [{ debugName: "quizEffect" }] : /* istanbul ignore next */ []));
|
|
303
305
|
quiz$ = toObservable(this.quiz);
|
|
304
|
-
quizTitleSignal = computed(() => this.quiz()?.titleDetails.title,
|
|
306
|
+
quizTitleSignal = computed(() => this.quiz()?.titleDetails.title, /* @ts-ignore */
|
|
307
|
+
...(ngDevMode ? [{ debugName: "quizTitleSignal" }] : /* istanbul ignore next */ []));
|
|
305
308
|
currentQuestionSignal = toSignal(this.quizStore.currentQuestion$);
|
|
306
309
|
questionTitleSignal = computed(() => {
|
|
307
310
|
const currentQuestion = this.currentQuestionSignal();
|
|
308
311
|
return currentQuestion ? `Question ${currentQuestion.index + 1}` : '';
|
|
309
|
-
},
|
|
312
|
+
}, /* @ts-ignore */
|
|
313
|
+
...(ngDevMode ? [{ debugName: "questionTitleSignal" }] : /* istanbul ignore next */ []));
|
|
310
314
|
startedQuiz$ = this.quizStore.startedQuiz$;
|
|
311
315
|
currentQuestion$ = this.quizStore.currentQuestion$;
|
|
312
316
|
canGoToPreviousQuestionSignal = toSignal(this.quizStore.canGoToPreviousQuestion$, { initialValue: false });
|
|
@@ -344,11 +348,16 @@ class QuizComponent {
|
|
|
344
348
|
return result;
|
|
345
349
|
}));
|
|
346
350
|
viewConfigSignal = toSignal(this.viewConfig$, { initialValue: { state: 'init' } });
|
|
347
|
-
viewStateSignal = computed(() => this.viewConfigSignal()?.state ?? 'init',
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
351
|
+
viewStateSignal = computed(() => this.viewConfigSignal()?.state ?? 'init', /* @ts-ignore */
|
|
352
|
+
...(ngDevMode ? [{ debugName: "viewStateSignal" }] : /* istanbul ignore next */ []));
|
|
353
|
+
preQuizComponentConfigSignal = computed(() => this.viewConfigSignal()?.preQuizComponent, /* @ts-ignore */
|
|
354
|
+
...(ngDevMode ? [{ debugName: "preQuizComponentConfigSignal" }] : /* istanbul ignore next */ []));
|
|
355
|
+
questionComponentConfigSignal = computed(() => this.viewConfigSignal()?.questionComponent, /* @ts-ignore */
|
|
356
|
+
...(ngDevMode ? [{ debugName: "questionComponentConfigSignal" }] : /* istanbul ignore next */ []));
|
|
357
|
+
answerComponentConfigSignal = computed(() => this.viewConfigSignal()?.answerComponent, /* @ts-ignore */
|
|
358
|
+
...(ngDevMode ? [{ debugName: "answerComponentConfigSignal" }] : /* istanbul ignore next */ []));
|
|
359
|
+
resultsComponentConfigSignal = computed(() => this.viewConfigSignal()?.resultsComponent, /* @ts-ignore */
|
|
360
|
+
...(ngDevMode ? [{ debugName: "resultsComponentConfigSignal" }] : /* istanbul ignore next */ []));
|
|
352
361
|
handleKeyDown(event) {
|
|
353
362
|
const code = event.code;
|
|
354
363
|
switch (code) {
|
|
@@ -376,12 +385,12 @@ class QuizComponent {
|
|
|
376
385
|
clickNextQuestion() {
|
|
377
386
|
this.quizStore.goToNextQuestion();
|
|
378
387
|
}
|
|
379
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
380
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
388
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
389
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: QuizComponent, isStandalone: true, selector: "dbx-quiz", inputs: { quiz: { classPropertyName: "quiz", publicName: "quiz", isSignal: true, isRequired: true, transformFunction: null } }, providers: [QuizStore, provideCurrentQuestionQuizQuestionAccessor()], ngImport: i0, template: "<div class=\"dbx-quiz\" (dbxWindowKeyDownListener)=\"handleKeyDown($event)\" [dbxWindowKeyDownFilter]=\"keysFilter\">\n @switch (viewStateSignal()) {\n @case ('pre-quiz') {\n <ng-container *ngTemplateOutlet=\"preQuizTemplate\"></ng-container>\n }\n @case ('quiz') {\n <ng-container *ngTemplateOutlet=\"quizTemplate\"></ng-container>\n }\n @case ('post-quiz') {\n <ng-container *ngTemplateOutlet=\"postQuizTemplate\"></ng-container>\n }\n }\n</div>\n\n<!-- Pre-Quiz -->\n<ng-template #preQuizTemplate>\n <div class=\"dbx-quiz-pre-quiz\">\n <dbx-injection [config]=\"preQuizComponentConfigSignal()\"></dbx-injection>\n </div>\n</ng-template>\n\n<!-- Quiz -->\n<ng-template #quizTemplate>\n <div class=\"dbx-quiz-quiz\">\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <div class=\"dbx-quiz-question dbx-pb3\">\n <h4 class=\"dbx-quiz-question-title\">{{ questionTitleSignal() }}</h4>\n <dbx-injection [config]=\"questionComponentConfigSignal()\"></dbx-injection>\n </div>\n <div class=\"dbx-quiz-answer dbx-pt3\">\n <dbx-injection [config]=\"answerComponentConfigSignal()\"></dbx-injection>\n </div>\n </div>\n</ng-template>\n\n<!-- Post-Quiz -->\n<ng-template #postQuizTemplate>\n <div class=\"dbx-quiz-post-quiz\">\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <dbx-injection [config]=\"resultsComponentConfigSignal()\"></dbx-injection>\n </div>\n</ng-template>\n\n<!-- Header Template -->\n<ng-template #headerTemplate>\n <div class=\"dbx-quiz-header\">\n <div class=\"dbx-flex-group\">\n <dbx-button [disabled]=\"!canGoToPreviousQuestionSignal()\" icon=\"arrow_back\" (buttonClick)=\"clickPreviousQuestion()\"></dbx-button>\n <span class=\"spacer\"></span>\n <span class=\"mat-h2\">{{ quizTitleSignal() }}</span>\n <span class=\"spacer\"></span>\n <dbx-button [disabled]=\"!canGoToNextQuestionSignal()\" icon=\"arrow_forward\" (buttonClick)=\"clickNextQuestion()\"></dbx-button>\n </div>\n </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }, { kind: "ngmodule", type: DbxButtonModule }, { kind: "component", type: i1.DbxButtonComponent, selector: "dbx-button", inputs: ["bar", "type", "buttonStyle", "color", "spinnerColor", "customTextColor", "customSpinnerColor", "basic", "tonal", "raised", "stroked", "flat", "iconOnly", "fab", "customContent", "allowClickPropagation", "mode"] }, { kind: "directive", type: DbxWindowKeyDownListenerDirective, selector: "[dbxWindowKeyDownListener]", inputs: ["dbxWindowKeyDownEnabled", "dbxWindowKeyDownFilter"], outputs: ["dbxWindowKeyDownListener"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
381
390
|
}
|
|
382
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
391
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizComponent, decorators: [{
|
|
383
392
|
type: Component,
|
|
384
|
-
args: [{ selector: 'dbx-quiz', imports: [DbxInjectionComponent, DbxButtonModule, DbxWindowKeyDownListenerDirective, NgTemplateOutlet], providers: [QuizStore, provideCurrentQuestionQuizQuestionAccessor()],
|
|
393
|
+
args: [{ selector: 'dbx-quiz', imports: [DbxInjectionComponent, DbxButtonModule, DbxWindowKeyDownListenerDirective, NgTemplateOutlet], providers: [QuizStore, provideCurrentQuestionQuizQuestionAccessor()], template: "<div class=\"dbx-quiz\" (dbxWindowKeyDownListener)=\"handleKeyDown($event)\" [dbxWindowKeyDownFilter]=\"keysFilter\">\n @switch (viewStateSignal()) {\n @case ('pre-quiz') {\n <ng-container *ngTemplateOutlet=\"preQuizTemplate\"></ng-container>\n }\n @case ('quiz') {\n <ng-container *ngTemplateOutlet=\"quizTemplate\"></ng-container>\n }\n @case ('post-quiz') {\n <ng-container *ngTemplateOutlet=\"postQuizTemplate\"></ng-container>\n }\n }\n</div>\n\n<!-- Pre-Quiz -->\n<ng-template #preQuizTemplate>\n <div class=\"dbx-quiz-pre-quiz\">\n <dbx-injection [config]=\"preQuizComponentConfigSignal()\"></dbx-injection>\n </div>\n</ng-template>\n\n<!-- Quiz -->\n<ng-template #quizTemplate>\n <div class=\"dbx-quiz-quiz\">\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <div class=\"dbx-quiz-question dbx-pb3\">\n <h4 class=\"dbx-quiz-question-title\">{{ questionTitleSignal() }}</h4>\n <dbx-injection [config]=\"questionComponentConfigSignal()\"></dbx-injection>\n </div>\n <div class=\"dbx-quiz-answer dbx-pt3\">\n <dbx-injection [config]=\"answerComponentConfigSignal()\"></dbx-injection>\n </div>\n </div>\n</ng-template>\n\n<!-- Post-Quiz -->\n<ng-template #postQuizTemplate>\n <div class=\"dbx-quiz-post-quiz\">\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <dbx-injection [config]=\"resultsComponentConfigSignal()\"></dbx-injection>\n </div>\n</ng-template>\n\n<!-- Header Template -->\n<ng-template #headerTemplate>\n <div class=\"dbx-quiz-header\">\n <div class=\"dbx-flex-group\">\n <dbx-button [disabled]=\"!canGoToPreviousQuestionSignal()\" icon=\"arrow_back\" (buttonClick)=\"clickPreviousQuestion()\"></dbx-button>\n <span class=\"spacer\"></span>\n <span class=\"mat-h2\">{{ quizTitleSignal() }}</span>\n <span class=\"spacer\"></span>\n <dbx-button [disabled]=\"!canGoToNextQuestionSignal()\" icon=\"arrow_forward\" (buttonClick)=\"clickNextQuestion()\"></dbx-button>\n </div>\n </div>\n</ng-template>\n" }]
|
|
385
394
|
}], propDecorators: { quiz: [{ type: i0.Input, args: [{ isSignal: true, alias: "quiz", required: true }] }] } });
|
|
386
395
|
|
|
387
396
|
/**
|
|
@@ -402,9 +411,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
|
|
|
402
411
|
*/
|
|
403
412
|
class QuizAnswerNumberComponent {
|
|
404
413
|
questionAccessor = inject(QuizQuestionAccessor);
|
|
405
|
-
config = model(
|
|
414
|
+
config = model(/* @ts-ignore */
|
|
415
|
+
...(ngDevMode ? [undefined, { debugName: "config" }] : /* istanbul ignore next */ []));
|
|
406
416
|
currentAnswerSignal = toSignal(this.questionAccessor.answer$);
|
|
407
|
-
currentAnswerValueSignal = computed(() => this.currentAnswerSignal()?.data,
|
|
417
|
+
currentAnswerValueSignal = computed(() => this.currentAnswerSignal()?.data, /* @ts-ignore */
|
|
418
|
+
...(ngDevMode ? [{ debugName: "currentAnswerValueSignal" }] : /* istanbul ignore next */ []));
|
|
408
419
|
choicesSignal = computed(() => {
|
|
409
420
|
const { range: inputRange, numbers: inputNumbers, preset } = this.config() ?? { preset: 'oneToFive' };
|
|
410
421
|
const currentAnswer = this.currentAnswerValueSignal();
|
|
@@ -441,11 +452,13 @@ class QuizAnswerNumberComponent {
|
|
|
441
452
|
};
|
|
442
453
|
});
|
|
443
454
|
return choices;
|
|
444
|
-
},
|
|
455
|
+
}, /* @ts-ignore */
|
|
456
|
+
...(ngDevMode ? [{ debugName: "choicesSignal" }] : /* istanbul ignore next */ []));
|
|
445
457
|
relevantKeysSignal = computed(() => {
|
|
446
458
|
const choices = this.choicesSignal();
|
|
447
459
|
return choices.map((choice) => choice.number.toString());
|
|
448
|
-
},
|
|
460
|
+
}, /* @ts-ignore */
|
|
461
|
+
...(ngDevMode ? [{ debugName: "relevantKeysSignal" }] : /* istanbul ignore next */ []));
|
|
449
462
|
clickedAnswer(answer) {
|
|
450
463
|
this.questionAccessor.setAnswer(answer);
|
|
451
464
|
}
|
|
@@ -455,12 +468,12 @@ class QuizAnswerNumberComponent {
|
|
|
455
468
|
this.clickedAnswer(number);
|
|
456
469
|
}
|
|
457
470
|
}
|
|
458
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
459
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
471
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizAnswerNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
472
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: QuizAnswerNumberComponent, isStandalone: true, selector: "ng-component", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { config: "configChange" }, ngImport: i0, template: "<div class=\"dbx-quiz-answer-number\" (dbxWindowKeyDownListener)=\"handleKeyDown($event)\" [dbxWindowKeyDownFilter]=\"relevantKeysSignal()\">\n <div class=\"dbx-quiz-answer-number-buttons dbx-button-wrap-group\" role=\"radiogroup\" aria-label=\"Answer choices\">\n @for (choice of choicesSignal(); track choice.number) {\n <dbx-button role=\"radio\" [attr.aria-checked]=\"choice.selected\" [attr.aria-label]=\"'' + choice.number\" [color]=\"choice.selected ? 'accent' : 'primary'\" [raised]=\"true\" (buttonClick)=\"clickedAnswer(choice.number)\">{{ choice.number }}</dbx-button>\n }\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: DbxButtonModule }, { kind: "component", type: i1.DbxButtonComponent, selector: "dbx-button", inputs: ["bar", "type", "buttonStyle", "color", "spinnerColor", "customTextColor", "customSpinnerColor", "basic", "tonal", "raised", "stroked", "flat", "iconOnly", "fab", "customContent", "allowClickPropagation", "mode"] }, { kind: "directive", type: DbxWindowKeyDownListenerDirective, selector: "[dbxWindowKeyDownListener]", inputs: ["dbxWindowKeyDownEnabled", "dbxWindowKeyDownFilter"], outputs: ["dbxWindowKeyDownListener"] }] });
|
|
460
473
|
}
|
|
461
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
474
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizAnswerNumberComponent, decorators: [{
|
|
462
475
|
type: Component,
|
|
463
|
-
args: [{ imports: [DbxButtonModule, DbxWindowKeyDownListenerDirective],
|
|
476
|
+
args: [{ imports: [DbxButtonModule, DbxWindowKeyDownListenerDirective], template: "<div class=\"dbx-quiz-answer-number\" (dbxWindowKeyDownListener)=\"handleKeyDown($event)\" [dbxWindowKeyDownFilter]=\"relevantKeysSignal()\">\n <div class=\"dbx-quiz-answer-number-buttons dbx-button-wrap-group\" role=\"radiogroup\" aria-label=\"Answer choices\">\n @for (choice of choicesSignal(); track choice.number) {\n <dbx-button role=\"radio\" [attr.aria-checked]=\"choice.selected\" [attr.aria-label]=\"'' + choice.number\" [color]=\"choice.selected ? 'accent' : 'primary'\" [raised]=\"true\" (buttonClick)=\"clickedAnswer(choice.number)\">{{ choice.number }}</dbx-button>\n }\n </div>\n</div>\n" }]
|
|
464
477
|
}], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }, { type: i0.Output, args: ["configChange"] }] } });
|
|
465
478
|
|
|
466
479
|
const MULTIPLE_CHOICE_LETTERS = `abcdefghijklmnopqrstuvwxyz`;
|
|
@@ -485,9 +498,11 @@ const MULTIPLE_CHOICE_LETTERS = `abcdefghijklmnopqrstuvwxyz`;
|
|
|
485
498
|
*/
|
|
486
499
|
class QuizAnswerMultipleChoiceComponent {
|
|
487
500
|
questionAccessor = inject(QuizQuestionAccessor);
|
|
488
|
-
config = model(
|
|
501
|
+
config = model(/* @ts-ignore */
|
|
502
|
+
...(ngDevMode ? [undefined, { debugName: "config" }] : /* istanbul ignore next */ []));
|
|
489
503
|
currentAnswerSignal = toSignal(this.questionAccessor.answer$);
|
|
490
|
-
currentAnswerValueSignal = computed(() => this.currentAnswerSignal()?.data,
|
|
504
|
+
currentAnswerValueSignal = computed(() => this.currentAnswerSignal()?.data, /* @ts-ignore */
|
|
505
|
+
...(ngDevMode ? [{ debugName: "currentAnswerValueSignal" }] : /* istanbul ignore next */ []));
|
|
491
506
|
choicesSignal = computed(() => {
|
|
492
507
|
const config = this.config();
|
|
493
508
|
const currentAnswer = this.currentAnswerValueSignal();
|
|
@@ -503,7 +518,8 @@ class QuizAnswerMultipleChoiceComponent {
|
|
|
503
518
|
};
|
|
504
519
|
});
|
|
505
520
|
return choices;
|
|
506
|
-
},
|
|
521
|
+
}, /* @ts-ignore */
|
|
522
|
+
...(ngDevMode ? [{ debugName: "choicesSignal" }] : /* istanbul ignore next */ []));
|
|
507
523
|
relevantKeysSignal = computed(() => {
|
|
508
524
|
const answersCount = this.config()?.answerText.length ?? 0;
|
|
509
525
|
const relevantKeys = [];
|
|
@@ -513,7 +529,8 @@ class QuizAnswerMultipleChoiceComponent {
|
|
|
513
529
|
relevantKeys.push(answerLetter);
|
|
514
530
|
}
|
|
515
531
|
return relevantKeys;
|
|
516
|
-
},
|
|
532
|
+
}, /* @ts-ignore */
|
|
533
|
+
...(ngDevMode ? [{ debugName: "relevantKeysSignal" }] : /* istanbul ignore next */ []));
|
|
517
534
|
clickedAnswer(answer) {
|
|
518
535
|
this.questionAccessor.setAnswer(answer);
|
|
519
536
|
}
|
|
@@ -527,12 +544,12 @@ class QuizAnswerMultipleChoiceComponent {
|
|
|
527
544
|
}
|
|
528
545
|
}
|
|
529
546
|
}
|
|
530
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
531
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
547
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizAnswerMultipleChoiceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
548
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: QuizAnswerMultipleChoiceComponent, isStandalone: true, selector: "ng-component", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { config: "configChange" }, ngImport: i0, template: "<div class=\"dbx-quiz-answer-multiplechoice\" (dbxWindowKeyDownListener)=\"handleKeyDown($event)\" [dbxWindowKeyDownFilter]=\"relevantKeysSignal()\">\n <div class=\"dbx-quiz-answer-multiplechoice-buttons dbx-button-column dbx-button-wide\" role=\"radiogroup\" aria-label=\"Answer choices\">\n @for (choice of choicesSignal(); track choice.letter) {\n <dbx-button class=\"dbx-w100\" role=\"radio\" [attr.aria-checked]=\"choice.selected\" [attr.aria-label]=\"choice.letter + ') ' + choice.text\" [color]=\"choice.selected ? 'accent' : 'primary'\" [raised]=\"true\" (buttonClick)=\"clickedAnswer(choice)\">\n <div class=\"dbx-quiz-answer-multiplechoice-button-content\">\n <span class=\"dbx-quiz-answer-multiplechoice-button-letter\">{{ choice.letter }})</span>\n <span class=\"dbx-quiz-answer-multiplechoice-button-text\">{{ choice.text }}</span>\n </div>\n </dbx-button>\n }\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: DbxButtonModule }, { kind: "component", type: i1.DbxButtonComponent, selector: "dbx-button", inputs: ["bar", "type", "buttonStyle", "color", "spinnerColor", "customTextColor", "customSpinnerColor", "basic", "tonal", "raised", "stroked", "flat", "iconOnly", "fab", "customContent", "allowClickPropagation", "mode"] }, { kind: "directive", type: DbxWindowKeyDownListenerDirective, selector: "[dbxWindowKeyDownListener]", inputs: ["dbxWindowKeyDownEnabled", "dbxWindowKeyDownFilter"], outputs: ["dbxWindowKeyDownListener"] }] });
|
|
532
549
|
}
|
|
533
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
550
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizAnswerMultipleChoiceComponent, decorators: [{
|
|
534
551
|
type: Component,
|
|
535
|
-
args: [{ imports: [DbxButtonModule, DbxWindowKeyDownListenerDirective],
|
|
552
|
+
args: [{ imports: [DbxButtonModule, DbxWindowKeyDownListenerDirective], template: "<div class=\"dbx-quiz-answer-multiplechoice\" (dbxWindowKeyDownListener)=\"handleKeyDown($event)\" [dbxWindowKeyDownFilter]=\"relevantKeysSignal()\">\n <div class=\"dbx-quiz-answer-multiplechoice-buttons dbx-button-column dbx-button-wide\" role=\"radiogroup\" aria-label=\"Answer choices\">\n @for (choice of choicesSignal(); track choice.letter) {\n <dbx-button class=\"dbx-w100\" role=\"radio\" [attr.aria-checked]=\"choice.selected\" [attr.aria-label]=\"choice.letter + ') ' + choice.text\" [color]=\"choice.selected ? 'accent' : 'primary'\" [raised]=\"true\" (buttonClick)=\"clickedAnswer(choice)\">\n <div class=\"dbx-quiz-answer-multiplechoice-button-content\">\n <span class=\"dbx-quiz-answer-multiplechoice-button-letter\">{{ choice.letter }})</span>\n <span class=\"dbx-quiz-answer-multiplechoice-button-text\">{{ choice.text }}</span>\n </div>\n </dbx-button>\n }\n </div>\n</div>\n" }]
|
|
536
553
|
}], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }, { type: i0.Output, args: ["configChange"] }] } });
|
|
537
554
|
|
|
538
555
|
/**
|
|
@@ -553,7 +570,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
|
|
|
553
570
|
*/
|
|
554
571
|
class QuizPreQuizIntroComponent {
|
|
555
572
|
quizStore = inject(QuizStore);
|
|
556
|
-
config = model(
|
|
573
|
+
config = model(/* @ts-ignore */
|
|
574
|
+
...(ngDevMode ? [undefined, { debugName: "config" }] : /* istanbul ignore next */ []));
|
|
557
575
|
quizTitleDetailsSignal = toSignal(this.quizStore.titleDetails$);
|
|
558
576
|
configSignal = computed(() => {
|
|
559
577
|
const config = this.config();
|
|
@@ -563,16 +581,20 @@ class QuizPreQuizIntroComponent {
|
|
|
563
581
|
subtitle: config?.subtitle ?? titleDetails?.subtitle,
|
|
564
582
|
description: config?.description ?? titleDetails?.description
|
|
565
583
|
};
|
|
566
|
-
},
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
584
|
+
}, /* @ts-ignore */
|
|
585
|
+
...(ngDevMode ? [{ debugName: "configSignal" }] : /* istanbul ignore next */ []));
|
|
586
|
+
titleSignal = computed(() => this.configSignal()?.title, /* @ts-ignore */
|
|
587
|
+
...(ngDevMode ? [{ debugName: "titleSignal" }] : /* istanbul ignore next */ []));
|
|
588
|
+
subtitleSignal = computed(() => this.configSignal()?.subtitle, /* @ts-ignore */
|
|
589
|
+
...(ngDevMode ? [{ debugName: "subtitleSignal" }] : /* istanbul ignore next */ []));
|
|
590
|
+
descriptionSignal = computed(() => this.configSignal()?.description, /* @ts-ignore */
|
|
591
|
+
...(ngDevMode ? [{ debugName: "descriptionSignal" }] : /* istanbul ignore next */ []));
|
|
592
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizPreQuizIntroComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
593
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: QuizPreQuizIntroComponent, isStandalone: true, selector: "ng-component", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { config: "configChange" }, ngImport: i0, template: "<div>\n <div>\n <h1>{{ titleSignal() }}</h1>\n <h2>{{ subtitleSignal() }}</h2>\n <p>{{ descriptionSignal() }}</p>\n </div>\n <div>\n <dbx-button [raised]=\"true\" (buttonClick)=\"quizStore.startQuiz()\" text=\"Start Quiz\"></dbx-button>\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: DbxButtonModule }, { kind: "component", type: i1.DbxButtonComponent, selector: "dbx-button", inputs: ["bar", "type", "buttonStyle", "color", "spinnerColor", "customTextColor", "customSpinnerColor", "basic", "tonal", "raised", "stroked", "flat", "iconOnly", "fab", "customContent", "allowClickPropagation", "mode"] }] });
|
|
572
594
|
}
|
|
573
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
595
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizPreQuizIntroComponent, decorators: [{
|
|
574
596
|
type: Component,
|
|
575
|
-
args: [{ imports: [DbxButtonModule],
|
|
597
|
+
args: [{ imports: [DbxButtonModule], template: "<div>\n <div>\n <h1>{{ titleSignal() }}</h1>\n <h2>{{ subtitleSignal() }}</h2>\n <p>{{ descriptionSignal() }}</p>\n </div>\n <div>\n <dbx-button [raised]=\"true\" (buttonClick)=\"quizStore.startQuiz()\" text=\"Start Quiz\"></dbx-button>\n </div>\n</div>\n" }]
|
|
576
598
|
}], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }, { type: i0.Output, args: ["configChange"] }] } });
|
|
577
599
|
|
|
578
600
|
/**
|
|
@@ -591,16 +613,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
|
|
|
591
613
|
* ```
|
|
592
614
|
*/
|
|
593
615
|
class QuizQuestionTextComponent {
|
|
594
|
-
config = model(
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
616
|
+
config = model(/* @ts-ignore */
|
|
617
|
+
...(ngDevMode ? [undefined, { debugName: "config" }] : /* istanbul ignore next */ []));
|
|
618
|
+
promptSignal = computed(() => this.config()?.prompt, /* @ts-ignore */
|
|
619
|
+
...(ngDevMode ? [{ debugName: "promptSignal" }] : /* istanbul ignore next */ []));
|
|
620
|
+
textSignal = computed(() => this.config()?.text, /* @ts-ignore */
|
|
621
|
+
...(ngDevMode ? [{ debugName: "textSignal" }] : /* istanbul ignore next */ []));
|
|
622
|
+
guidanceSignal = computed(() => this.config()?.guidance, /* @ts-ignore */
|
|
623
|
+
...(ngDevMode ? [{ debugName: "guidanceSignal" }] : /* istanbul ignore next */ []));
|
|
624
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizQuestionTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
625
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: QuizQuestionTextComponent, isStandalone: true, selector: "ng-component", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { config: "configChange" }, ngImport: i0, template: "<div class=\"dbx-quiz-question-text\" role=\"group\" aria-label=\"Question\">\n <div class=\"dbx-quiz-question-text-content\">\n @if (promptSignal() !== null) {\n <div class=\"dbx-hint dbx-pb3\" aria-label=\"Prompt\">{{ promptSignal() }}</div>\n }\n <div class=\"dbx-pb3\">{{ textSignal() }}</div>\n @if (guidanceSignal() !== null) {\n <div class=\"dbx-small dbx-hint\" role=\"note\">{{ guidanceSignal() }}</div>\n }\n </div>\n</div>\n" });
|
|
600
626
|
}
|
|
601
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
627
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: QuizQuestionTextComponent, decorators: [{
|
|
602
628
|
type: Component,
|
|
603
|
-
args: [{
|
|
629
|
+
args: [{ template: "<div class=\"dbx-quiz-question-text\" role=\"group\" aria-label=\"Question\">\n <div class=\"dbx-quiz-question-text-content\">\n @if (promptSignal() !== null) {\n <div class=\"dbx-hint dbx-pb3\" aria-label=\"Prompt\">{{ promptSignal() }}</div>\n }\n <div class=\"dbx-pb3\">{{ textSignal() }}</div>\n @if (guidanceSignal() !== null) {\n <div class=\"dbx-small dbx-hint\" role=\"note\">{{ guidanceSignal() }}</div>\n }\n </div>\n</div>\n" }]
|
|
604
630
|
}], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }, { type: i0.Output, args: ["configChange"] }] } });
|
|
605
631
|
|
|
606
632
|
/**
|
|
@@ -622,8 +648,10 @@ class DbxQuizPostQuizComponent {
|
|
|
622
648
|
stateSignal = computed(() => {
|
|
623
649
|
const submitted = this.quizSubmittedSignal();
|
|
624
650
|
return submitted ? 'postsubmit' : 'presubmit';
|
|
625
|
-
},
|
|
626
|
-
|
|
651
|
+
}, /* @ts-ignore */
|
|
652
|
+
...(ngDevMode ? [{ debugName: "stateSignal" }] : /* istanbul ignore next */ []));
|
|
653
|
+
handleSubmitQuiz = input(/* @ts-ignore */
|
|
654
|
+
...(ngDevMode ? [undefined, { debugName: "handleSubmitQuiz" }] : /* istanbul ignore next */ []));
|
|
627
655
|
handleSubmitQuizButton = (_, context) => {
|
|
628
656
|
this.quizStore.setLockQuizNavigation(true);
|
|
629
657
|
const handler = this.handleSubmitQuiz();
|
|
@@ -635,12 +663,12 @@ class DbxQuizPostQuizComponent {
|
|
|
635
663
|
handleSubmitQuizSuccess = () => {
|
|
636
664
|
this.quizStore.setSubmittedQuiz(true);
|
|
637
665
|
};
|
|
638
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
639
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
666
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DbxQuizPostQuizComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
667
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: DbxQuizPostQuizComponent, isStandalone: true, selector: "dbx-quiz-post-quiz", inputs: { handleSubmitQuiz: { classPropertyName: "handleSubmitQuiz", publicName: "handleSubmitQuiz", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"dbx-post-quiz text-center\" role=\"status\" aria-live=\"polite\">\n <h3>Quiz Completed</h3>\n <div>\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n @if (stateSignal() === 'presubmit') {\n <ng-container *ngTemplateOutlet=\"preSubmitTemplate\"></ng-container>\n } @else {\n <ng-container *ngTemplateOutlet=\"postSubmitTemplate\"></ng-container>\n }\n </div>\n</div>\n\n<!-- Pre-Submit -->\n<ng-template #preSubmitTemplate>\n <ng-content select=\"[presubmit]\"></ng-content>\n @if (handleSubmitQuiz()) {\n <div class=\"dbx-post-quiz-submit\">\n <div dbxAction dbxActionLogger dbxActionValue dbxActionSnackbarError [dbxActionHandler]=\"handleSubmitQuizButton\" [dbxActionSuccessHandler]=\"handleSubmitQuizSuccess\">\n <dbx-button [disabled]=\"quizSubmittedSignal()\" [raised]=\"true\" dbxActionButton>Submit Quiz</dbx-button>\n </div>\n </div>\n }\n</ng-template>\n\n<!-- Post-Submit -->\n<ng-template #postSubmitTemplate>\n <ng-content select=\"[postsubmit]\"></ng-content>\n</ng-template>\n\n<!-- Content -->\n<ng-template #contentTemplate>\n <ng-content></ng-content>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: DbxButtonModule }, { kind: "directive", type: i1$1.DbxActionButtonDirective, selector: "[dbxActionButton]", inputs: ["dbxActionButtonEcho"] }, { kind: "component", type: i1.DbxButtonComponent, selector: "dbx-button", inputs: ["bar", "type", "buttonStyle", "color", "spinnerColor", "customTextColor", "customSpinnerColor", "basic", "tonal", "raised", "stroked", "flat", "iconOnly", "fab", "customContent", "allowClickPropagation", "mode"] }, { kind: "ngmodule", type: DbxActionModule }, { kind: "directive", type: i1$1.DbxActionDirective, selector: "dbx-action,[dbxAction]", exportAs: ["action", "dbxAction"] }, { kind: "directive", type: i1$1.DbxActionHandlerDirective, selector: "[dbxActionHandler]", inputs: ["dbxActionHandler"] }, { kind: "directive", type: i1$1.DbxActionValueDirective, selector: "dbxActionValue,[dbxActionValue]", inputs: ["dbxActionValue"] }, { kind: "directive", type: i1$1.DbxActionContextLoggerDirective, selector: "[dbxActionLogger],[dbxActionContextLogger]" }, { kind: "directive", type: i1$1.DbxActionSuccessHandlerDirective, selector: "[dbxActionSuccessHandler]", inputs: ["dbxActionSuccessHandler"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
640
668
|
}
|
|
641
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
669
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DbxQuizPostQuizComponent, decorators: [{
|
|
642
670
|
type: Component,
|
|
643
|
-
args: [{ selector: 'dbx-quiz-post-quiz', imports: [DbxButtonModule, DbxActionModule, NgTemplateOutlet],
|
|
671
|
+
args: [{ selector: 'dbx-quiz-post-quiz', imports: [DbxButtonModule, DbxActionModule, NgTemplateOutlet], template: "<div class=\"dbx-post-quiz text-center\" role=\"status\" aria-live=\"polite\">\n <h3>Quiz Completed</h3>\n <div>\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n @if (stateSignal() === 'presubmit') {\n <ng-container *ngTemplateOutlet=\"preSubmitTemplate\"></ng-container>\n } @else {\n <ng-container *ngTemplateOutlet=\"postSubmitTemplate\"></ng-container>\n }\n </div>\n</div>\n\n<!-- Pre-Submit -->\n<ng-template #preSubmitTemplate>\n <ng-content select=\"[presubmit]\"></ng-content>\n @if (handleSubmitQuiz()) {\n <div class=\"dbx-post-quiz-submit\">\n <div dbxAction dbxActionLogger dbxActionValue dbxActionSnackbarError [dbxActionHandler]=\"handleSubmitQuizButton\" [dbxActionSuccessHandler]=\"handleSubmitQuizSuccess\">\n <dbx-button [disabled]=\"quizSubmittedSignal()\" [raised]=\"true\" dbxActionButton>Submit Quiz</dbx-button>\n </div>\n </div>\n }\n</ng-template>\n\n<!-- Post-Submit -->\n<ng-template #postSubmitTemplate>\n <ng-content select=\"[postsubmit]\"></ng-content>\n</ng-template>\n\n<!-- Content -->\n<ng-template #contentTemplate>\n <ng-content></ng-content>\n</ng-template>\n" }]
|
|
644
672
|
}], propDecorators: { handleSubmitQuiz: [{ type: i0.Input, args: [{ isSignal: true, alias: "handleSubmitQuiz", required: false }] }] } });
|
|
645
673
|
|
|
646
674
|
/**
|
|
@@ -653,21 +681,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
|
|
|
653
681
|
*/
|
|
654
682
|
class DbxQuizResetButtonComponent {
|
|
655
683
|
quizStore = inject(QuizStore);
|
|
656
|
-
buttonText = input(`Restart Quiz`,
|
|
684
|
+
buttonText = input(`Restart Quiz`, /* @ts-ignore */
|
|
685
|
+
...(ngDevMode ? [{ debugName: "buttonText" }] : /* istanbul ignore next */ []));
|
|
657
686
|
handleResetQuizButton = (_, context) => {
|
|
658
687
|
this.quizStore.restartQuizToFirstQuestion();
|
|
659
688
|
context.success();
|
|
660
689
|
};
|
|
661
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
662
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
690
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DbxQuizResetButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
691
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: DbxQuizResetButtonComponent, isStandalone: true, selector: "dbx-quiz-reset-button", inputs: { buttonText: { classPropertyName: "buttonText", publicName: "buttonText", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
663
692
|
<div class="dbx-quiz-reset-button">
|
|
664
693
|
<div dbxAction dbxActionLogger dbxActionValue dbxActionSnackbarError [dbxActionHandler]="handleResetQuizButton">
|
|
665
694
|
<dbx-button [raised]="true" [text]="buttonText()" dbxActionButton></dbx-button>
|
|
666
695
|
</div>
|
|
667
696
|
</div>
|
|
668
|
-
`, isInline: true, dependencies: [{ kind: "ngmodule", type: DbxButtonModule }, { kind: "directive", type: i1$1.DbxActionButtonDirective, selector: "[dbxActionButton]", inputs: ["dbxActionButtonEcho"] }, { kind: "component", type: i1.DbxButtonComponent, selector: "dbx-button", inputs: ["bar", "type", "buttonStyle", "color", "spinnerColor", "
|
|
697
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: DbxButtonModule }, { kind: "directive", type: i1$1.DbxActionButtonDirective, selector: "[dbxActionButton]", inputs: ["dbxActionButtonEcho"] }, { kind: "component", type: i1.DbxButtonComponent, selector: "dbx-button", inputs: ["bar", "type", "buttonStyle", "color", "spinnerColor", "customTextColor", "customSpinnerColor", "basic", "tonal", "raised", "stroked", "flat", "iconOnly", "fab", "customContent", "allowClickPropagation", "mode"] }, { kind: "ngmodule", type: DbxActionModule }, { kind: "directive", type: i1$1.DbxActionDirective, selector: "dbx-action,[dbxAction]", exportAs: ["action", "dbxAction"] }, { kind: "directive", type: i1$1.DbxActionHandlerDirective, selector: "[dbxActionHandler]", inputs: ["dbxActionHandler"] }, { kind: "directive", type: i1$1.DbxActionValueDirective, selector: "dbxActionValue,[dbxActionValue]", inputs: ["dbxActionValue"] }, { kind: "directive", type: i1$1.DbxActionContextLoggerDirective, selector: "[dbxActionLogger],[dbxActionContextLogger]" }] });
|
|
669
698
|
}
|
|
670
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
699
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DbxQuizResetButtonComponent, decorators: [{
|
|
671
700
|
type: Component,
|
|
672
701
|
args: [{
|
|
673
702
|
selector: 'dbx-quiz-reset-button',
|
|
@@ -678,8 +707,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
|
|
|
678
707
|
</div>
|
|
679
708
|
</div>
|
|
680
709
|
`,
|
|
681
|
-
imports: [DbxButtonModule, DbxActionModule]
|
|
682
|
-
standalone: true
|
|
710
|
+
imports: [DbxButtonModule, DbxActionModule]
|
|
683
711
|
}]
|
|
684
712
|
}], propDecorators: { buttonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonText", required: false }] }] } });
|
|
685
713
|
|
|
@@ -692,14 +720,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
|
|
|
692
720
|
* ```
|
|
693
721
|
*/
|
|
694
722
|
class DbxQuizScoreComponent {
|
|
695
|
-
input = input(
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
723
|
+
input = input(/* @ts-ignore */
|
|
724
|
+
...(ngDevMode ? [undefined, { debugName: "input" }] : /* istanbul ignore next */ []));
|
|
725
|
+
scoreSignal = computed(() => this.input()?.score, /* @ts-ignore */
|
|
726
|
+
...(ngDevMode ? [{ debugName: "scoreSignal" }] : /* istanbul ignore next */ []));
|
|
727
|
+
maxScoreSignal = computed(() => this.input()?.maxScore, /* @ts-ignore */
|
|
728
|
+
...(ngDevMode ? [{ debugName: "maxScoreSignal" }] : /* istanbul ignore next */ []));
|
|
729
|
+
feedbackTextSignal = computed(() => this.input()?.feedbackText ?? '', /* @ts-ignore */
|
|
730
|
+
...(ngDevMode ? [{ debugName: "feedbackTextSignal" }] : /* istanbul ignore next */ []));
|
|
731
|
+
subtitleSignal = computed(() => this.input()?.subtitle, /* @ts-ignore */
|
|
732
|
+
...(ngDevMode ? [{ debugName: "subtitleSignal" }] : /* istanbul ignore next */ []));
|
|
733
|
+
showRetakeButtonSignal = computed(() => this.input()?.showRetakeButton, /* @ts-ignore */
|
|
734
|
+
...(ngDevMode ? [{ debugName: "showRetakeButtonSignal" }] : /* istanbul ignore next */ []));
|
|
735
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DbxQuizScoreComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
736
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: DbxQuizScoreComponent, isStandalone: true, selector: "dbx-quiz-score", inputs: { input: { classPropertyName: "input", publicName: "input", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
703
737
|
<div class="dbx-quiz-score">
|
|
704
738
|
<h3 class="dbx-quiz-score-score">{{ scoreSignal() }}/{{ maxScoreSignal() }}</h3>
|
|
705
739
|
<p class="dbx-quiz-score-text">{{ feedbackTextSignal() }}</p>
|
|
@@ -712,7 +746,7 @@ class DbxQuizScoreComponent {
|
|
|
712
746
|
</div>
|
|
713
747
|
`, isInline: true, dependencies: [{ kind: "component", type: DbxQuizResetButtonComponent, selector: "dbx-quiz-reset-button", inputs: ["buttonText"] }] });
|
|
714
748
|
}
|
|
715
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
749
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DbxQuizScoreComponent, decorators: [{
|
|
716
750
|
type: Component,
|
|
717
751
|
args: [{
|
|
718
752
|
selector: 'dbx-quiz-score',
|
|
@@ -728,8 +762,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
|
|
|
728
762
|
}
|
|
729
763
|
</div>
|
|
730
764
|
`,
|
|
731
|
-
imports: [DbxQuizResetButtonComponent]
|
|
732
|
-
standalone: true
|
|
765
|
+
imports: [DbxQuizResetButtonComponent]
|
|
733
766
|
}]
|
|
734
767
|
}], propDecorators: { input: [{ type: i0.Input, args: [{ isSignal: true, alias: "input", required: false }] }] } });
|
|
735
768
|
|