codexly-ui 0.13.1 → 0.13.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.
- package/fesm2022/codexly-ui.mjs +4 -29
- package/fesm2022/codexly-ui.mjs.map +1 -1
- package/package.json +1 -1
- package/types/codexly-ui.d.ts +1 -19
package/fesm2022/codexly-ui.mjs
CHANGED
|
@@ -10446,23 +10446,6 @@ class ClxWizardComponent {
|
|
|
10446
10446
|
prevLabel = input('Anterior', ...(ngDevMode ? [{ debugName: "prevLabel" }] : /* istanbul ignore next */ []));
|
|
10447
10447
|
nextLabel = input('Siguiente', ...(ngDevMode ? [{ debugName: "nextLabel" }] : /* istanbul ignore next */ []));
|
|
10448
10448
|
finishLabel = input('Finalizar', ...(ngDevMode ? [{ debugName: "finishLabel" }] : /* istanbul ignore next */ []));
|
|
10449
|
-
/** Which step to land on when the wizard first renders — for restoring an in-progress flow (e.g.
|
|
10450
|
-
* a saved draft, or state re-hydrated after an external redirect) rather than always starting
|
|
10451
|
-
* fresh at step 0. Applied once, in ngAfterContentInit, and clamped to a valid index; deliberately
|
|
10452
|
-
* bypasses the `linear` guard that goTo()/next() enforce for user-driven navigation — that guard
|
|
10453
|
-
* exists to stop a customer from skipping ahead of steps they haven't filled in yet, which doesn't
|
|
10454
|
-
* apply here: the caller is asserting those earlier steps are ALREADY valid (e.g. their own
|
|
10455
|
-
* signals were just re-prefilled from a backend order), not trying to skip past them. Consumers
|
|
10456
|
-
* are responsible for that guarantee — this input trusts it rather than re-validating each
|
|
10457
|
-
* skipped step, since isValid() reflects the CURRENT signal state, which the caller controls. */
|
|
10458
|
-
initialStep = input(undefined, ...(ngDevMode ? [{ debugName: "initialStep" }] : /* istanbul ignore next */ []));
|
|
10459
|
-
/** Hides the built-in "Finalizar" button on the LAST step only (every other step's own "Siguiente"
|
|
10460
|
-
* button is unaffected) — for a caller that needs its own custom action there instead (e.g. a
|
|
10461
|
-
* payment gateway's own branded button rendered inside that step's own projected content, which
|
|
10462
|
-
* must trigger the exact same submit logic the wizard's own (finish) output would have, so the
|
|
10463
|
-
* step's own isValid still gates whether that custom button is meaningful to show/enable — this
|
|
10464
|
-
* input only removes the wizard's OWN redundant generic button, nothing about validation). */
|
|
10465
|
-
hideFinishButton = input(false, ...(ngDevMode ? [{ debugName: "hideFinishButton" }] : /* istanbul ignore next */ []));
|
|
10466
10449
|
// ── Outputs ────────────────────────────────────────────────────────────────
|
|
10467
10450
|
stepChange = output();
|
|
10468
10451
|
finish = output();
|
|
@@ -10475,20 +10458,12 @@ class ClxWizardComponent {
|
|
|
10475
10458
|
// ── Lifecycle ──────────────────────────────────────────────────────────────
|
|
10476
10459
|
ngAfterContentInit() {
|
|
10477
10460
|
this._steps = this._stepQuery.toArray();
|
|
10478
|
-
this._applyInitialStep();
|
|
10479
10461
|
this._syncActiveAttrs();
|
|
10480
10462
|
this._stepQuery.changes.pipe(takeUntilDestroyed(this._destroyRef)).subscribe(() => {
|
|
10481
10463
|
this._steps = this._stepQuery.toArray();
|
|
10482
10464
|
this._syncActiveAttrs();
|
|
10483
10465
|
});
|
|
10484
10466
|
}
|
|
10485
|
-
_applyInitialStep() {
|
|
10486
|
-
const requested = this.initialStep();
|
|
10487
|
-
if (requested == null)
|
|
10488
|
-
return;
|
|
10489
|
-
const clamped = Math.min(Math.max(requested, 0), this._lastIndex());
|
|
10490
|
-
this._currentIndex.set(clamped);
|
|
10491
|
-
}
|
|
10492
10467
|
_syncActiveAttrs() {
|
|
10493
10468
|
this._steps.forEach((step, i) => {
|
|
10494
10469
|
step.nativeEl.setAttribute('data-active', String(i === this._currentIndex()));
|
|
@@ -10579,7 +10554,7 @@ class ClxWizardComponent {
|
|
|
10579
10554
|
return `${base} border-2 border-clx-border text-clx-text-subtle bg-clx-surface ${ptr}`;
|
|
10580
10555
|
}
|
|
10581
10556
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: ClxWizardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10582
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.15", type: ClxWizardComponent, isStandalone: true, selector: "clx-wizard", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, activeTextColor: { classPropertyName: "activeTextColor", publicName: "activeTextColor", isSignal: true, isRequired: false, transformFunction: null }, underlineColor: { classPropertyName: "underlineColor", publicName: "underlineColor", isSignal: true, isRequired: false, transformFunction: null }, stepColor: { classPropertyName: "stepColor", publicName: "stepColor", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null }, prevLabel: { classPropertyName: "prevLabel", publicName: "prevLabel", isSignal: true, isRequired: false, transformFunction: null }, nextLabel: { classPropertyName: "nextLabel", publicName: "nextLabel", isSignal: true, isRequired: false, transformFunction: null }, finishLabel: { classPropertyName: "finishLabel", publicName: "finishLabel", isSignal: true, isRequired: false, transformFunction: null }
|
|
10557
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.15", type: ClxWizardComponent, isStandalone: true, selector: "clx-wizard", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, activeTextColor: { classPropertyName: "activeTextColor", publicName: "activeTextColor", isSignal: true, isRequired: false, transformFunction: null }, underlineColor: { classPropertyName: "underlineColor", publicName: "underlineColor", isSignal: true, isRequired: false, transformFunction: null }, stepColor: { classPropertyName: "stepColor", publicName: "stepColor", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null }, prevLabel: { classPropertyName: "prevLabel", publicName: "prevLabel", isSignal: true, isRequired: false, transformFunction: null }, nextLabel: { classPropertyName: "nextLabel", publicName: "nextLabel", isSignal: true, isRequired: false, transformFunction: null }, finishLabel: { classPropertyName: "finishLabel", publicName: "finishLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { stepChange: "stepChange", finish: "finish" }, queries: [{ propertyName: "_stepQuery", predicate: ClxStepComponent }], ngImport: i0, template: `
|
|
10583
10558
|
<div [class]="_rootClass()">
|
|
10584
10559
|
|
|
10585
10560
|
<!-- ══ HORIZONTAL: clx-tabs indicator ═══════════════════════════════ -->
|
|
@@ -10668,7 +10643,7 @@ class ClxWizardComponent {
|
|
|
10668
10643
|
[disabled]="!_currentStepValid()"
|
|
10669
10644
|
(click)="next()"
|
|
10670
10645
|
>{{ nextLabel() }}</button>
|
|
10671
|
-
} @else
|
|
10646
|
+
} @else {
|
|
10672
10647
|
<button
|
|
10673
10648
|
clx-button
|
|
10674
10649
|
type="button"
|
|
@@ -10777,7 +10752,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
|
|
|
10777
10752
|
[disabled]="!_currentStepValid()"
|
|
10778
10753
|
(click)="next()"
|
|
10779
10754
|
>{{ nextLabel() }}</button>
|
|
10780
|
-
} @else
|
|
10755
|
+
} @else {
|
|
10781
10756
|
<button
|
|
10782
10757
|
clx-button
|
|
10783
10758
|
type="button"
|
|
@@ -10794,7 +10769,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
|
|
|
10794
10769
|
</div>
|
|
10795
10770
|
</div>
|
|
10796
10771
|
`, styles: ["@keyframes clx-wizard-fade-slide{0%{opacity:0;transform:translate(10px)}to{opacity:1;transform:translate(0)}}.clx-wizard-step-enter{animation:clx-wizard-fade-slide .22s cubic-bezier(.4,0,.2,1) both}@keyframes clx-wizard-fill{0%{width:0%}to{width:100%}}.clx-wizard-connector-fill{animation:clx-wizard-fill .3s ease both}clx-step[data-active=false]{display:none}\n"] }]
|
|
10797
|
-
}], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], activeTextColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeTextColor", required: false }] }], underlineColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "underlineColor", required: false }] }], stepColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepColor", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], linear: [{ type: i0.Input, args: [{ isSignal: true, alias: "linear", required: false }] }], prevLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "prevLabel", required: false }] }], nextLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextLabel", required: false }] }], finishLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "finishLabel", required: false }] }],
|
|
10772
|
+
}], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], activeTextColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeTextColor", required: false }] }], underlineColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "underlineColor", required: false }] }], stepColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepColor", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], linear: [{ type: i0.Input, args: [{ isSignal: true, alias: "linear", required: false }] }], prevLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "prevLabel", required: false }] }], nextLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextLabel", required: false }] }], finishLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "finishLabel", required: false }] }], stepChange: [{ type: i0.Output, args: ["stepChange"] }], finish: [{ type: i0.Output, args: ["finish"] }], _stepQuery: [{
|
|
10798
10773
|
type: ContentChildren,
|
|
10799
10774
|
args: [ClxStepComponent]
|
|
10800
10775
|
}] } });
|