@underlayerdev/ui 0.9.4 → 0.9.6
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.
|
@@ -3559,6 +3559,63 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImpor
|
|
|
3559
3559
|
}]
|
|
3560
3560
|
}], propDecorators: { content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
3561
3561
|
|
|
3562
|
+
/**
|
|
3563
|
+
* Presentational step indicator for a multi-step flow (e.g. onboarding,
|
|
3564
|
+
* checkout) — dots connected by a line, current/completed/upcoming states.
|
|
3565
|
+
* Purely visual: it has no notion of step content or navigation, the
|
|
3566
|
+
* consumer owns that. `currentStep` is 1-indexed.
|
|
3567
|
+
*/
|
|
3568
|
+
class StepperComponent {
|
|
3569
|
+
totalSteps = input.required(/* @ts-ignore */
|
|
3570
|
+
...(ngDevMode ? [{ debugName: "totalSteps" }] : /* istanbul ignore next */ []));
|
|
3571
|
+
currentStep = input.required(/* @ts-ignore */
|
|
3572
|
+
...(ngDevMode ? [{ debugName: "currentStep" }] : /* istanbul ignore next */ []));
|
|
3573
|
+
labels = input([], /* @ts-ignore */
|
|
3574
|
+
...(ngDevMode ? [{ debugName: "labels" }] : /* istanbul ignore next */ []));
|
|
3575
|
+
ariaLabel = input(null, /* @ts-ignore */
|
|
3576
|
+
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
3577
|
+
stepIndexes = computed(() => Array.from({ length: this.totalSteps() }, (_, i) => i + 1), /* @ts-ignore */
|
|
3578
|
+
...(ngDevMode ? [{ debugName: "stepIndexes" }] : /* istanbul ignore next */ []));
|
|
3579
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: StepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3580
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: StepperComponent, isStandalone: true, selector: "ul-stepper", inputs: { totalSteps: { classPropertyName: "totalSteps", publicName: "totalSteps", isSignal: true, isRequired: true, transformFunction: null }, currentStep: { classPropertyName: "currentStep", publicName: "currentStep", isSignal: true, isRequired: true, transformFunction: null }, labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
3581
|
+
<ol class="ul-stepper" [attr.aria-label]="ariaLabel()">
|
|
3582
|
+
@for (step of stepIndexes(); track step) {
|
|
3583
|
+
<li
|
|
3584
|
+
class="ul-stepper__item"
|
|
3585
|
+
[class.ul-stepper__item--completed]="step < currentStep()"
|
|
3586
|
+
[class.ul-stepper__item--current]="step === currentStep()"
|
|
3587
|
+
[attr.aria-current]="step === currentStep() ? 'step' : null"
|
|
3588
|
+
>
|
|
3589
|
+
<span class="ul-stepper__dot"></span>
|
|
3590
|
+
@if (labels()[step - 1]) {
|
|
3591
|
+
<span class="ul-stepper__label">{{ labels()[step - 1] }}</span>
|
|
3592
|
+
}
|
|
3593
|
+
</li>
|
|
3594
|
+
}
|
|
3595
|
+
</ol>
|
|
3596
|
+
`, isInline: true, styles: [".ul-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.ul-rich-text p,.ul-rich-text ul,.ul-rich-text ol,.ul-rich-text blockquote,.ul-rich-text pre{margin-top:0;margin-bottom:16px}.ul-rich-text:last-child,.ul-rich-text p:last-child,.ul-rich-text ul:last-child,.ul-rich-text ol:last-child,.ul-rich-text blockquote:last-child,.ul-rich-text pre:last-child{margin-bottom:0}.ul-rich-text h1,.ul-rich-text h2,.ul-rich-text h3,.ul-rich-text h4,.ul-rich-text h5,.ul-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.ul-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.ul-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.ul-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.ul-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.ul-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.ul-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.ul-rich-text ul,.ul-rich-text ol{padding-left:24px}.ul-rich-text ul ul,.ul-rich-text ul ol,.ul-rich-text ol ul,.ul-rich-text ol ol{margin-top:8px;margin-bottom:8px}.ul-rich-text li{margin-top:4px;margin-bottom:4px}.ul-rich-text strong{font-weight:800}.ul-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.ul-rich-text em{font-style:italic}.ul-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.ul-rich-text a:hover{color:#d6c5ff}.ul-rich-text a:active{color:#a781ff}.ul-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.ul-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.ul-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.ul-rich-text--muted{color:#ffffffb3}.ul-rich-text--inverse,.ul-rich-text--inverse a{color:#000}.ul-rich-text--inverse a:hover,.ul-rich-text--inverse a:active{color:#000000b3}.ul-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.ul-rich-text--compact p,.ul-rich-text--compact ul,.ul-rich-text--compact ol,.ul-rich-text--compact blockquote,.ul-rich-text--compact pre{margin-bottom:8px}.ul-rich-text--compact h1,.ul-rich-text--compact h2,.ul-rich-text--compact h3,.ul-rich-text--compact h4,.ul-rich-text--compact h5,.ul-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.ul-stepper{display:flex;align-items:flex-start;list-style:none;margin:0;padding:0}.ul-stepper__item{display:flex;flex:1;flex-direction:column;align-items:center;position:relative}.ul-stepper__item:not(:last-child):after{content:\"\";position:absolute;top:6px;left:calc(50% + 8px);width:calc(100% - 16px);height:2px;background-color:#ffffff80;transition:background-color .25s cubic-bezier(.4,0,.2,1)}.ul-stepper__item--completed:not(:last-child):after{background-color:#6f3de0}.ul-stepper__dot{width:12px;height:12px;border-radius:4096px;background-color:#fff3;border:2px solid rgba(255,255,255,.5);position:relative;z-index:1;transition:background-color .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1),box-shadow .25s cubic-bezier(.4,0,.2,1)}.ul-stepper__item--completed .ul-stepper__dot{background-color:#6f3de0;border-color:#6f3de0}.ul-stepper__item--current .ul-stepper__dot{border-color:#6f3de0;box-shadow:0 0 0 3px #ffffff1a}.ul-stepper__label{margin-top:8px;color:#ffffffb3;text-align:center;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:1000}.ul-stepper__item--current .ul-stepper__label,.ul-stepper__item--completed .ul-stepper__label{color:#fff}\n"] });
|
|
3597
|
+
}
|
|
3598
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: StepperComponent, decorators: [{
|
|
3599
|
+
type: Component,
|
|
3600
|
+
args: [{ selector: 'ul-stepper', template: `
|
|
3601
|
+
<ol class="ul-stepper" [attr.aria-label]="ariaLabel()">
|
|
3602
|
+
@for (step of stepIndexes(); track step) {
|
|
3603
|
+
<li
|
|
3604
|
+
class="ul-stepper__item"
|
|
3605
|
+
[class.ul-stepper__item--completed]="step < currentStep()"
|
|
3606
|
+
[class.ul-stepper__item--current]="step === currentStep()"
|
|
3607
|
+
[attr.aria-current]="step === currentStep() ? 'step' : null"
|
|
3608
|
+
>
|
|
3609
|
+
<span class="ul-stepper__dot"></span>
|
|
3610
|
+
@if (labels()[step - 1]) {
|
|
3611
|
+
<span class="ul-stepper__label">{{ labels()[step - 1] }}</span>
|
|
3612
|
+
}
|
|
3613
|
+
</li>
|
|
3614
|
+
}
|
|
3615
|
+
</ol>
|
|
3616
|
+
`, styles: [".ul-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.ul-rich-text p,.ul-rich-text ul,.ul-rich-text ol,.ul-rich-text blockquote,.ul-rich-text pre{margin-top:0;margin-bottom:16px}.ul-rich-text:last-child,.ul-rich-text p:last-child,.ul-rich-text ul:last-child,.ul-rich-text ol:last-child,.ul-rich-text blockquote:last-child,.ul-rich-text pre:last-child{margin-bottom:0}.ul-rich-text h1,.ul-rich-text h2,.ul-rich-text h3,.ul-rich-text h4,.ul-rich-text h5,.ul-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.ul-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.ul-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.ul-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.ul-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.ul-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.ul-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.ul-rich-text ul,.ul-rich-text ol{padding-left:24px}.ul-rich-text ul ul,.ul-rich-text ul ol,.ul-rich-text ol ul,.ul-rich-text ol ol{margin-top:8px;margin-bottom:8px}.ul-rich-text li{margin-top:4px;margin-bottom:4px}.ul-rich-text strong{font-weight:800}.ul-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.ul-rich-text em{font-style:italic}.ul-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.ul-rich-text a:hover{color:#d6c5ff}.ul-rich-text a:active{color:#a781ff}.ul-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.ul-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.ul-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.ul-rich-text--muted{color:#ffffffb3}.ul-rich-text--inverse,.ul-rich-text--inverse a{color:#000}.ul-rich-text--inverse a:hover,.ul-rich-text--inverse a:active{color:#000000b3}.ul-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.ul-rich-text--compact p,.ul-rich-text--compact ul,.ul-rich-text--compact ol,.ul-rich-text--compact blockquote,.ul-rich-text--compact pre{margin-bottom:8px}.ul-rich-text--compact h1,.ul-rich-text--compact h2,.ul-rich-text--compact h3,.ul-rich-text--compact h4,.ul-rich-text--compact h5,.ul-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.ul-stepper{display:flex;align-items:flex-start;list-style:none;margin:0;padding:0}.ul-stepper__item{display:flex;flex:1;flex-direction:column;align-items:center;position:relative}.ul-stepper__item:not(:last-child):after{content:\"\";position:absolute;top:6px;left:calc(50% + 8px);width:calc(100% - 16px);height:2px;background-color:#ffffff80;transition:background-color .25s cubic-bezier(.4,0,.2,1)}.ul-stepper__item--completed:not(:last-child):after{background-color:#6f3de0}.ul-stepper__dot{width:12px;height:12px;border-radius:4096px;background-color:#fff3;border:2px solid rgba(255,255,255,.5);position:relative;z-index:1;transition:background-color .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1),box-shadow .25s cubic-bezier(.4,0,.2,1)}.ul-stepper__item--completed .ul-stepper__dot{background-color:#6f3de0;border-color:#6f3de0}.ul-stepper__item--current .ul-stepper__dot{border-color:#6f3de0;box-shadow:0 0 0 3px #ffffff1a}.ul-stepper__label{margin-top:8px;color:#ffffffb3;text-align:center;font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:1000}.ul-stepper__item--current .ul-stepper__label,.ul-stepper__item--completed .ul-stepper__label{color:#fff}\n"] }]
|
|
3617
|
+
}], propDecorators: { totalSteps: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalSteps", required: true }] }], currentStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentStep", required: true }] }], labels: [{ type: i0.Input, args: [{ isSignal: true, alias: "labels", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
|
|
3618
|
+
|
|
3562
3619
|
const toastIcon = (kind) => {
|
|
3563
3620
|
switch (kind) {
|
|
3564
3621
|
case 'success':
|
|
@@ -3670,6 +3727,7 @@ class ToggleComponent {
|
|
|
3670
3727
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
3671
3728
|
size = input('default', /* @ts-ignore */
|
|
3672
3729
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
3730
|
+
/** Rendered inline next to the switch (not stacked above it, unlike ul-input/ul-checkbox's form-field label). Use ng-content instead for richer projected content. */
|
|
3673
3731
|
label = input(null, /* @ts-ignore */
|
|
3674
3732
|
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
3675
3733
|
helperText = input(null, /* @ts-ignore */
|
|
@@ -3701,7 +3759,7 @@ class ToggleComponent {
|
|
|
3701
3759
|
this.checked.set(!this.checked());
|
|
3702
3760
|
}
|
|
3703
3761
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3704
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.
|
|
3762
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: ToggleComponent, isStandalone: true, selector: "ul-toggle", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, helperText: { classPropertyName: "helperText", publicName: "helperText", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, errorText: { classPropertyName: "errorText", publicName: "errorText", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", disabled: "disabledChange" }, ngImport: i0, template: `
|
|
3705
3763
|
<div
|
|
3706
3764
|
class="ul-toggle ul-toggle--{{ size() }}"
|
|
3707
3765
|
[class.ul-toggle--error]="hasError()"
|
|
@@ -3709,12 +3767,6 @@ class ToggleComponent {
|
|
|
3709
3767
|
[attr.aria-invalid]="hasError()"
|
|
3710
3768
|
[attr.aria-describedby]="describedBy()"
|
|
3711
3769
|
>
|
|
3712
|
-
<ul-form-field-label
|
|
3713
|
-
[label]="label()"
|
|
3714
|
-
[for]="ids.controlId"
|
|
3715
|
-
[size]="size() === 'sm' ? 'sm' : 'md'"
|
|
3716
|
-
/>
|
|
3717
|
-
|
|
3718
3770
|
<label
|
|
3719
3771
|
class="ul-toggle__row"
|
|
3720
3772
|
[class.ul-toggle__row--sm]="size() === 'sm'"
|
|
@@ -3739,6 +3791,9 @@ class ToggleComponent {
|
|
|
3739
3791
|
<span class="ul-toggle__thumb"></span>
|
|
3740
3792
|
</span>
|
|
3741
3793
|
<span class="ul-toggle__label">
|
|
3794
|
+
@if (label()) {
|
|
3795
|
+
{{ label() }}
|
|
3796
|
+
}
|
|
3742
3797
|
<ng-content />
|
|
3743
3798
|
</span>
|
|
3744
3799
|
</label>
|
|
@@ -3750,11 +3805,11 @@ class ToggleComponent {
|
|
|
3750
3805
|
[error]="hasError()"
|
|
3751
3806
|
/>
|
|
3752
3807
|
</div>
|
|
3753
|
-
`, isInline: true, styles: [".ul-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.ul-rich-text p,.ul-rich-text ul,.ul-rich-text ol,.ul-rich-text blockquote,.ul-rich-text pre{margin-top:0;margin-bottom:16px}.ul-rich-text:last-child,.ul-rich-text p:last-child,.ul-rich-text ul:last-child,.ul-rich-text ol:last-child,.ul-rich-text blockquote:last-child,.ul-rich-text pre:last-child{margin-bottom:0}.ul-rich-text h1,.ul-rich-text h2,.ul-rich-text h3,.ul-rich-text h4,.ul-rich-text h5,.ul-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.ul-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.ul-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.ul-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.ul-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.ul-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.ul-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.ul-rich-text ul,.ul-rich-text ol{padding-left:24px}.ul-rich-text ul ul,.ul-rich-text ul ol,.ul-rich-text ol ul,.ul-rich-text ol ol{margin-top:8px;margin-bottom:8px}.ul-rich-text li{margin-top:4px;margin-bottom:4px}.ul-rich-text strong{font-weight:800}.ul-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.ul-rich-text em{font-style:italic}.ul-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.ul-rich-text a:hover{color:#d6c5ff}.ul-rich-text a:active{color:#a781ff}.ul-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.ul-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.ul-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.ul-rich-text--muted{color:#ffffffb3}.ul-rich-text--inverse,.ul-rich-text--inverse a{color:#000}.ul-rich-text--inverse a:hover,.ul-rich-text--inverse a:active{color:#000000b3}.ul-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.ul-rich-text--compact p,.ul-rich-text--compact ul,.ul-rich-text--compact ol,.ul-rich-text--compact blockquote,.ul-rich-text--compact pre{margin-bottom:8px}.ul-rich-text--compact h1,.ul-rich-text--compact h2,.ul-rich-text--compact h3,.ul-rich-text--compact h4,.ul-rich-text--compact h5,.ul-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.ul-toggle{display:flex;flex-direction:column;align-items:flex-start}.ul-toggle__row{display:inline-flex;align-items:center;cursor:pointer}.ul-toggle__row:has(.ul-toggle__input:disabled){cursor:not-allowed}.ul-toggle__row:hover .ul-toggle__input:not([disabled])+.ul-toggle__track{box-shadow:0 0 0 2px #ffffff1a;border-color:#fff}.ul-toggle__row:hover .ul-toggle__input:not([disabled]):checked+.ul-toggle__track{background-color:#6f3de0;border-color:#6f3de0}.ul-toggle__row--error .ul-toggle__track{border-color:#f69d9d}.ul-toggle__row--error .ul-toggle__input:checked+.ul-toggle__track{background-color:#c33a3a;border-color:#c33a3a}.ul-toggle__row--error .ul-toggle__input:focus-visible+.ul-toggle__track{border-color:#f69d9d}.ul-toggle__row--error:hover .ul-toggle__input:not([disabled])+.ul-toggle__track{border-color:#f69d9d}.ul-toggle__row--sm .ul-toggle__track{width:32px;height:18px}.ul-toggle__row--sm .ul-toggle__thumb{width:14px;height:14px}.ul-toggle__row--sm .ul-toggle__input:checked+.ul-toggle__track .ul-toggle__thumb{transform:translate(14px)}.ul-toggle__row--sm .ul-toggle__label{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.ul-toggle__row--lg .ul-toggle__track{width:48px;height:28px}.ul-toggle__row--lg .ul-toggle__thumb{width:22px;height:22px}.ul-toggle__row--lg .ul-toggle__input:checked+.ul-toggle__track .ul-toggle__thumb{transform:translate(22px)}.ul-toggle__input{position:absolute;opacity:0;width:1px;height:1px}.ul-toggle__input:focus-visible+.ul-toggle__track{border-color:#ffffff80;box-shadow:0 0 0 2px #ffffff1a}.ul-toggle__input:checked+.ul-toggle__track{background-color:#6f3de0;border-color:#6f3de0}.ul-toggle__input:checked+.ul-toggle__track .ul-toggle__thumb{transform:translate(18px)}.ul-toggle__input:disabled+.ul-toggle__track{border-color:#ffffff1a;background-color:#ffffff0d}.ul-toggle__input:disabled+.ul-toggle__track .ul-toggle__thumb{background-color:#ffffff4d}.ul-toggle__input:disabled:checked+.ul-toggle__track{background-color:#ffffff0d;border-color:transparent}.ul-toggle__input:disabled~.ul-toggle__label{color:#ffffff4d}.ul-toggle__track{position:relative;flex-shrink:0;width:40px;height:22px;border-radius:4096px;border:1px solid rgba(255,255,255,.5);background-color:#fff3;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1)}.ul-toggle__thumb{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:4096px;background-color:#fff;transition:transform .25s cubic-bezier(.4,0,.2,1)}.ul-toggle__label{margin-left:8px;color:#fff;transition:color .25s cubic-bezier(.4,0,.2,1);font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.ul-toggle__label:empty{display:none}\n"], dependencies: [{ kind: "component", type:
|
|
3808
|
+
`, isInline: true, styles: [".ul-rich-text{font-family:Ultra Nunito Sans;line-height:28px;font-size:18px;letter-spacing:0px;font-weight:400;color:#fff}.ul-rich-text p,.ul-rich-text ul,.ul-rich-text ol,.ul-rich-text blockquote,.ul-rich-text pre{margin-top:0;margin-bottom:16px}.ul-rich-text:last-child,.ul-rich-text p:last-child,.ul-rich-text ul:last-child,.ul-rich-text ol:last-child,.ul-rich-text blockquote:last-child,.ul-rich-text pre:last-child{margin-bottom:0}.ul-rich-text h1,.ul-rich-text h2,.ul-rich-text h3,.ul-rich-text h4,.ul-rich-text h5,.ul-rich-text h6{margin-top:32px;margin-bottom:12px;font-weight:1000}.ul-rich-text h1{font-family:Ultra Nunito Sans;line-height:48px;font-size:48px;letter-spacing:-.48px;font-weight:1000}.ul-rich-text h2{font-family:Ultra Nunito Sans;line-height:48px;font-size:40px;letter-spacing:-.4px;font-weight:1000}.ul-rich-text h3{font-family:Ultra Nunito Sans;line-height:44px;font-size:36px;letter-spacing:-.36px;font-weight:1000}.ul-rich-text h4{font-family:Ultra Nunito Sans;line-height:40px;font-size:32px;letter-spacing:-.32px;font-weight:1000}.ul-rich-text h5{font-family:Ultra Nunito Sans;line-height:36px;font-size:28px;letter-spacing:-.28px;font-weight:1000}.ul-rich-text h6{font-family:Ultra Nunito Sans;line-height:36px;font-size:24px;letter-spacing:-.24px;font-weight:1000}.ul-rich-text ul,.ul-rich-text ol{padding-left:24px}.ul-rich-text ul ul,.ul-rich-text ul ol,.ul-rich-text ol ul,.ul-rich-text ol ol{margin-top:8px;margin-bottom:8px}.ul-rich-text li{margin-top:4px;margin-bottom:4px}.ul-rich-text strong{font-weight:800}.ul-rich-text code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.ul-rich-text em{font-style:italic}.ul-rich-text a{color:#c2a8ff;text-decoration:underline;text-decoration-thickness:1px}.ul-rich-text a:hover{color:#d6c5ff}.ul-rich-text a:active{color:#a781ff}.ul-rich-text pre{padding:16px;border-radius:8px;background-color:#3b3b3b;overflow-x:auto}.ul-rich-text pre code{font-family:Roboto Mono;line-height:20px;font-size:14px;letter-spacing:0px;font-weight:400}.ul-rich-text blockquote{margin-left:0;padding-left:16px;border-left-width:2px;border-left-style:solid;border-left-color:#ffffff1a;color:#ffffffb3}.ul-rich-text--muted{color:#ffffffb3}.ul-rich-text--inverse,.ul-rich-text--inverse a{color:#000}.ul-rich-text--inverse a:hover,.ul-rich-text--inverse a:active{color:#000000b3}.ul-rich-text--body-m{font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.ul-rich-text--compact p,.ul-rich-text--compact ul,.ul-rich-text--compact ol,.ul-rich-text--compact blockquote,.ul-rich-text--compact pre{margin-bottom:8px}.ul-rich-text--compact h1,.ul-rich-text--compact h2,.ul-rich-text--compact h3,.ul-rich-text--compact h4,.ul-rich-text--compact h5,.ul-rich-text--compact h6{margin-top:16px;margin-bottom:8px}.ul-toggle{display:flex;flex-direction:column;align-items:flex-start}.ul-toggle__row{display:inline-flex;align-items:center;cursor:pointer}.ul-toggle__row:has(.ul-toggle__input:disabled){cursor:not-allowed}.ul-toggle__row:hover .ul-toggle__input:not([disabled])+.ul-toggle__track{box-shadow:0 0 0 2px #ffffff1a;border-color:#fff}.ul-toggle__row:hover .ul-toggle__input:not([disabled]):checked+.ul-toggle__track{background-color:#6f3de0;border-color:#6f3de0}.ul-toggle__row--error .ul-toggle__track{border-color:#f69d9d}.ul-toggle__row--error .ul-toggle__input:checked+.ul-toggle__track{background-color:#c33a3a;border-color:#c33a3a}.ul-toggle__row--error .ul-toggle__input:focus-visible+.ul-toggle__track{border-color:#f69d9d}.ul-toggle__row--error:hover .ul-toggle__input:not([disabled])+.ul-toggle__track{border-color:#f69d9d}.ul-toggle__row--sm .ul-toggle__track{width:32px;height:18px}.ul-toggle__row--sm .ul-toggle__thumb{width:14px;height:14px}.ul-toggle__row--sm .ul-toggle__input:checked+.ul-toggle__track .ul-toggle__thumb{transform:translate(14px)}.ul-toggle__row--sm .ul-toggle__label{font-family:Ultra Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:400}.ul-toggle__row--lg .ul-toggle__track{width:48px;height:28px}.ul-toggle__row--lg .ul-toggle__thumb{width:22px;height:22px}.ul-toggle__row--lg .ul-toggle__input:checked+.ul-toggle__track .ul-toggle__thumb{transform:translate(22px)}.ul-toggle__input{position:absolute;opacity:0;width:1px;height:1px}.ul-toggle__input:focus-visible+.ul-toggle__track{border-color:#ffffff80;box-shadow:0 0 0 2px #ffffff1a}.ul-toggle__input:checked+.ul-toggle__track{background-color:#6f3de0;border-color:#6f3de0}.ul-toggle__input:checked+.ul-toggle__track .ul-toggle__thumb{transform:translate(18px)}.ul-toggle__input:disabled+.ul-toggle__track{border-color:#ffffff1a;background-color:#ffffff0d}.ul-toggle__input:disabled+.ul-toggle__track .ul-toggle__thumb{background-color:#ffffff4d}.ul-toggle__input:disabled:checked+.ul-toggle__track{background-color:#ffffff0d;border-color:transparent}.ul-toggle__input:disabled~.ul-toggle__label{color:#ffffff4d}.ul-toggle__track{position:relative;flex-shrink:0;width:40px;height:22px;border-radius:4096px;border:1px solid rgba(255,255,255,.5);background-color:#fff3;transition:border-color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1)}.ul-toggle__thumb{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:4096px;background-color:#fff;transition:transform .25s cubic-bezier(.4,0,.2,1)}.ul-toggle__label{margin-left:8px;color:#fff;transition:color .25s cubic-bezier(.4,0,.2,1);font-family:Ultra Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:400}.ul-toggle__label:empty{display:none}\n"], dependencies: [{ kind: "component", type: FormFieldHelperComponent, selector: "ul-form-field-helper", inputs: ["id", "helperText", "errorText", "error"] }] });
|
|
3754
3809
|
}
|
|
3755
3810
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: ToggleComponent, decorators: [{
|
|
3756
3811
|
type: Component,
|
|
3757
|
-
args: [{ selector: 'ul-toggle', imports: [
|
|
3812
|
+
args: [{ selector: 'ul-toggle', imports: [FormFieldHelperComponent], template: `
|
|
3758
3813
|
<div
|
|
3759
3814
|
class="ul-toggle ul-toggle--{{ size() }}"
|
|
3760
3815
|
[class.ul-toggle--error]="hasError()"
|
|
@@ -3762,12 +3817,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImpor
|
|
|
3762
3817
|
[attr.aria-invalid]="hasError()"
|
|
3763
3818
|
[attr.aria-describedby]="describedBy()"
|
|
3764
3819
|
>
|
|
3765
|
-
<ul-form-field-label
|
|
3766
|
-
[label]="label()"
|
|
3767
|
-
[for]="ids.controlId"
|
|
3768
|
-
[size]="size() === 'sm' ? 'sm' : 'md'"
|
|
3769
|
-
/>
|
|
3770
|
-
|
|
3771
3820
|
<label
|
|
3772
3821
|
class="ul-toggle__row"
|
|
3773
3822
|
[class.ul-toggle__row--sm]="size() === 'sm'"
|
|
@@ -3792,6 +3841,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImpor
|
|
|
3792
3841
|
<span class="ul-toggle__thumb"></span>
|
|
3793
3842
|
</span>
|
|
3794
3843
|
<span class="ul-toggle__label">
|
|
3844
|
+
@if (label()) {
|
|
3845
|
+
{{ label() }}
|
|
3846
|
+
}
|
|
3795
3847
|
<ng-content />
|
|
3796
3848
|
</span>
|
|
3797
3849
|
</label>
|
|
@@ -4835,5 +4887,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImpor
|
|
|
4835
4887
|
* Generated bundle index. Do not edit.
|
|
4836
4888
|
*/
|
|
4837
4889
|
|
|
4838
|
-
export { AccordionComponent, AccordionItemComponent, AreaCodeComponent, AvatarComponent, AvatarGroupComponent, BreadcrumbComponent, ButtonComponent, CalendarComponent, CardComponent, CarouselComponent, CarouselItemComponent, CheckboxComponent, CollapseComponent, CustomCurrencyPipe, DockComponent, DockItemComponent, DockItemContentSlotDirective, DropdownComponent, FileInputComponent, FooterComponent, FormFieldHelperComponent, FormFieldLabelComponent, HeroComponent, IconComponent, ImageNotFoundDirective, InputComponent, ListItemComponent, LongPressDirective, MenuComponent, MenuItemsComponent, MenuTriggerComponent, ModalComponent, NavbarAppNameSlotDirective, NavbarAvatarSlotDirective, NavbarComponent, NavbarLogoSlotDirective, NavbarSearchSlotDirective, PeHeroActionsSlotDirective, PeHeroBadgesSlotDirective, PeHeroContentSlotDirective, PeHeroSubtitleSlotDirective, PeHeroTitleSlotDirective, PillComponent, PriceButtonComponent, RadialComponent, RadioComponent, RadioGroupComponent, RichTextComponent, SearchInputComponent, SearchSelectComponent, SelectComponent, SelectableRowComponent, SidebarComponent, SkeletonComponent, StatusComponent, TableComponent, TextareaComponent, TextareaFieldDirective, ToastContainerComponent, ToastService, ToggleComponent, TooltipComponent, createFormFieldIds, getFormFieldDescribedBy, toastIcon };
|
|
4890
|
+
export { AccordionComponent, AccordionItemComponent, AreaCodeComponent, AvatarComponent, AvatarGroupComponent, BreadcrumbComponent, ButtonComponent, CalendarComponent, CardComponent, CarouselComponent, CarouselItemComponent, CheckboxComponent, CollapseComponent, CustomCurrencyPipe, DockComponent, DockItemComponent, DockItemContentSlotDirective, DropdownComponent, FileInputComponent, FooterComponent, FormFieldHelperComponent, FormFieldLabelComponent, HeroComponent, IconComponent, ImageNotFoundDirective, InputComponent, ListItemComponent, LongPressDirective, MenuComponent, MenuItemsComponent, MenuTriggerComponent, ModalComponent, NavbarAppNameSlotDirective, NavbarAvatarSlotDirective, NavbarComponent, NavbarLogoSlotDirective, NavbarSearchSlotDirective, PeHeroActionsSlotDirective, PeHeroBadgesSlotDirective, PeHeroContentSlotDirective, PeHeroSubtitleSlotDirective, PeHeroTitleSlotDirective, PillComponent, PriceButtonComponent, RadialComponent, RadioComponent, RadioGroupComponent, RichTextComponent, SearchInputComponent, SearchSelectComponent, SelectComponent, SelectableRowComponent, SidebarComponent, SkeletonComponent, StatusComponent, StepperComponent, TableComponent, TextareaComponent, TextareaFieldDirective, ToastContainerComponent, ToastService, ToggleComponent, TooltipComponent, createFormFieldIds, getFormFieldDescribedBy, toastIcon };
|
|
4839
4891
|
//# sourceMappingURL=underlayerdev-ui.mjs.map
|