@educarehq/solaris-components 0.5.1 → 0.5.2
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.
|
@@ -3090,14 +3090,15 @@ class SolarisDialogStepsContainer {
|
|
|
3090
3090
|
dialogRef = inject(SolarisDialogRef);
|
|
3091
3091
|
loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
|
|
3092
3092
|
transitioning = signal(false, ...(ngDevMode ? [{ debugName: "transitioning" }] : []));
|
|
3093
|
-
steps = this.configuration.steps ?? [];
|
|
3094
3093
|
transitionHalfway = signal(false, ...(ngDevMode ? [{ debugName: "transitionHalfway" }] : []));
|
|
3095
3094
|
currentStepIndex = signal(this.resolveInitialStepIndex(), ...(ngDevMode ? [{ debugName: "currentStepIndex" }] : []));
|
|
3096
3095
|
showProgress = this.configuration.showProgress ?? true;
|
|
3097
|
-
transitionDurationMs = this.configuration.transitionDurationMs ?? 360;
|
|
3098
3096
|
transitionBlur = this.configuration.transitionBlur ?? true;
|
|
3099
|
-
|
|
3097
|
+
contentMinHeight = this.configuration.contentMinHeight ?? '0';
|
|
3098
|
+
steps = this.configuration.steps ?? [];
|
|
3099
|
+
transitionDurationMs = this.configuration.transitionDurationMs ?? 360;
|
|
3100
3100
|
halfwayTimer = 0;
|
|
3101
|
+
transitionTimer = 0;
|
|
3101
3102
|
stepInjectors = this.steps.map(step => Injector.create({
|
|
3102
3103
|
providers: [
|
|
3103
3104
|
{
|
|
@@ -3215,6 +3216,14 @@ class SolarisDialogStepsContainer {
|
|
|
3215
3216
|
this.dialogRef.updateActions([]);
|
|
3216
3217
|
return;
|
|
3217
3218
|
}
|
|
3219
|
+
const step = this.steps[this.currentStepIndex()];
|
|
3220
|
+
if (step?.actions?.length) {
|
|
3221
|
+
this.dialogRef.updateActions(step.actions.map(action => ({
|
|
3222
|
+
...action,
|
|
3223
|
+
disabled: action.disabled || this.loading(),
|
|
3224
|
+
})));
|
|
3225
|
+
return;
|
|
3226
|
+
}
|
|
3218
3227
|
const leftAction = this.isFirstStep()
|
|
3219
3228
|
? {
|
|
3220
3229
|
label: this.configuration.cancelLabel ?? 'Cancelar',
|
|
@@ -3292,13 +3301,13 @@ class SolarisDialogStepsContainer {
|
|
|
3292
3301
|
});
|
|
3293
3302
|
}
|
|
3294
3303
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SolarisDialogStepsContainer, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3295
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: SolarisDialogStepsContainer, isStandalone: true, selector: "solaris-dialog-steps-container", ngImport: i0, template: "<div class=\"solaris-dialog-steps\" [class.is-transitioning]=\"transitioning()\"
|
|
3304
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: SolarisDialogStepsContainer, isStandalone: true, selector: "solaris-dialog-steps-container", ngImport: i0, template: "<div class=\"solaris-dialog-steps\" [class.is-transitioning]=\"transitioning()\" [class.is-halfway]=\"transitionHalfway()\"\r\n [class.has-transition-blur]=\"transitionBlur\" [style.--solaris-dialog-steps-min-height]=\"contentMinHeight\">\r\n @if (showProgress) {\r\n <div class=\"solaris-dialog-steps__progress\" aria-hidden=\"true\">\r\n @for (step of steps; track step.key; let index = $index) {\r\n <span class=\"solaris-dialog-steps__dot\" [class.is-active]=\"index === currentStepIndex()\"\r\n [class.is-complete]=\"index < currentStepIndex()\"></span>\r\n }\r\n </div>\r\n }\r\n\r\n <div class=\"solaris-dialog-steps__viewport\">\r\n <div class=\"solaris-dialog-steps__track\" [style.transform]=\"trackTransform()\"\r\n [style.--solaris-dialog-steps-transition-duration]=\"transitionDuration()\">\r\n @for (step of steps; track step.key; let index = $index) {\r\n <section class=\"solaris-dialog-steps__step\" [class.is-active]=\"index === currentStepIndex()\"\r\n [class.is-before]=\"index < currentStepIndex()\" [class.is-after]=\"index > currentStepIndex()\">\r\n <div class=\"solaris-dialog-steps__step-inner\">\r\n <ng-container *ngComponentOutlet=\"step.component; injector: stepInjector(index)\"></ng-container>\r\n </div>\r\n </section>\r\n }\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [":host{display:block;min-inline-size:0}.solaris-dialog-steps{--solaris-dialog-steps-min-height: 0;--solaris-dialog-steps-transition-duration: .42s;display:grid;min-inline-size:0;gap:var(--solaris-space-5)}.solaris-dialog-steps__viewport{overflow:hidden;inline-size:100%;min-inline-size:0;min-block-size:var(--solaris-dialog-steps-min-height)}.solaris-dialog-steps__track{display:flex;inline-size:100%;min-inline-size:0;align-items:stretch;will-change:transform;transition:transform var(--solaris-dialog-steps-transition-duration) cubic-bezier(.22,1,.36,1)}.solaris-dialog-steps__step{flex:0 0 100%;inline-size:100%;min-inline-size:100%;min-block-size:var(--solaris-dialog-steps-min-height);display:grid;align-content:center;overflow:visible}.solaris-dialog-steps__progress{display:flex;justify-content:center;align-items:center;gap:var(--solaris-space-2)}.solaris-dialog-steps__dot{inline-size:.8rem;block-size:.8rem;border-radius:var(--solaris-radius-full);background:color-mix(in srgb,var(--solaris-color-text-muted) 35%,transparent);transition:background-color .18s ease,transform .18s ease}.solaris-dialog-steps__dot.is-active{background:var(--solaris-color-primary);transform:scale(1.2)}.solaris-dialog-steps__dot.is-complete{background:color-mix(in srgb,var(--solaris-color-primary) 72%,white)}.solaris-dialog-steps__step-inner{inline-size:100%;min-inline-size:0;transition:filter calc(var(--solaris-dialog-steps-transition-duration) * .45) ease,opacity calc(var(--solaris-dialog-steps-transition-duration) * .45) ease,transform calc(var(--solaris-dialog-steps-transition-duration) * .45) ease}.solaris-dialog-steps.has-transition-blur.is-transitioning.is-halfway .solaris-dialog-steps__step:not(.is-active) .solaris-dialog-steps__step-inner{filter:blur(.18rem);opacity:.58;transform:scale(.985)}.solaris-dialog-steps.has-transition-blur.is-transitioning.is-halfway .solaris-dialog-steps__step.is-active .solaris-dialog-steps__step-inner{filter:blur(0);opacity:1;transform:scale(1)}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3296
3305
|
}
|
|
3297
3306
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SolarisDialogStepsContainer, decorators: [{
|
|
3298
3307
|
type: Component,
|
|
3299
3308
|
args: [{ selector: 'solaris-dialog-steps-container', standalone: true, imports: [
|
|
3300
3309
|
NgComponentOutlet
|
|
3301
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"solaris-dialog-steps\" [class.is-transitioning]=\"transitioning()\"
|
|
3310
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"solaris-dialog-steps\" [class.is-transitioning]=\"transitioning()\" [class.is-halfway]=\"transitionHalfway()\"\r\n [class.has-transition-blur]=\"transitionBlur\" [style.--solaris-dialog-steps-min-height]=\"contentMinHeight\">\r\n @if (showProgress) {\r\n <div class=\"solaris-dialog-steps__progress\" aria-hidden=\"true\">\r\n @for (step of steps; track step.key; let index = $index) {\r\n <span class=\"solaris-dialog-steps__dot\" [class.is-active]=\"index === currentStepIndex()\"\r\n [class.is-complete]=\"index < currentStepIndex()\"></span>\r\n }\r\n </div>\r\n }\r\n\r\n <div class=\"solaris-dialog-steps__viewport\">\r\n <div class=\"solaris-dialog-steps__track\" [style.transform]=\"trackTransform()\"\r\n [style.--solaris-dialog-steps-transition-duration]=\"transitionDuration()\">\r\n @for (step of steps; track step.key; let index = $index) {\r\n <section class=\"solaris-dialog-steps__step\" [class.is-active]=\"index === currentStepIndex()\"\r\n [class.is-before]=\"index < currentStepIndex()\" [class.is-after]=\"index > currentStepIndex()\">\r\n <div class=\"solaris-dialog-steps__step-inner\">\r\n <ng-container *ngComponentOutlet=\"step.component; injector: stepInjector(index)\"></ng-container>\r\n </div>\r\n </section>\r\n }\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [":host{display:block;min-inline-size:0}.solaris-dialog-steps{--solaris-dialog-steps-min-height: 0;--solaris-dialog-steps-transition-duration: .42s;display:grid;min-inline-size:0;gap:var(--solaris-space-5)}.solaris-dialog-steps__viewport{overflow:hidden;inline-size:100%;min-inline-size:0;min-block-size:var(--solaris-dialog-steps-min-height)}.solaris-dialog-steps__track{display:flex;inline-size:100%;min-inline-size:0;align-items:stretch;will-change:transform;transition:transform var(--solaris-dialog-steps-transition-duration) cubic-bezier(.22,1,.36,1)}.solaris-dialog-steps__step{flex:0 0 100%;inline-size:100%;min-inline-size:100%;min-block-size:var(--solaris-dialog-steps-min-height);display:grid;align-content:center;overflow:visible}.solaris-dialog-steps__progress{display:flex;justify-content:center;align-items:center;gap:var(--solaris-space-2)}.solaris-dialog-steps__dot{inline-size:.8rem;block-size:.8rem;border-radius:var(--solaris-radius-full);background:color-mix(in srgb,var(--solaris-color-text-muted) 35%,transparent);transition:background-color .18s ease,transform .18s ease}.solaris-dialog-steps__dot.is-active{background:var(--solaris-color-primary);transform:scale(1.2)}.solaris-dialog-steps__dot.is-complete{background:color-mix(in srgb,var(--solaris-color-primary) 72%,white)}.solaris-dialog-steps__step-inner{inline-size:100%;min-inline-size:0;transition:filter calc(var(--solaris-dialog-steps-transition-duration) * .45) ease,opacity calc(var(--solaris-dialog-steps-transition-duration) * .45) ease,transform calc(var(--solaris-dialog-steps-transition-duration) * .45) ease}.solaris-dialog-steps.has-transition-blur.is-transitioning.is-halfway .solaris-dialog-steps__step:not(.is-active) .solaris-dialog-steps__step-inner{filter:blur(.18rem);opacity:.58;transform:scale(.985)}.solaris-dialog-steps.has-transition-blur.is-transitioning.is-halfway .solaris-dialog-steps__step.is-active .solaris-dialog-steps__step-inner{filter:blur(0);opacity:1;transform:scale(1)}\n"] }]
|
|
3302
3311
|
}], ctorParameters: () => [] });
|
|
3303
3312
|
|
|
3304
3313
|
class SolarisDialogContainer {
|