@eagami/ui 5.61.2 → 5.62.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/eagami-ui.mjs
CHANGED
|
@@ -11492,7 +11492,7 @@ var CheckboxComponent = class CheckboxComponent {
|
|
|
11492
11492
|
}],
|
|
11493
11493
|
ngImport: i0,
|
|
11494
11494
|
template: "<div\n class=\"ea-checkbox-field ea-checkbox-field--{{ size() }}\"\n [class.ea-checkbox-field--truncate]=\"truncate()\">\n <label\n class=\"ea-checkbox\"\n [ngClass]=\"hostClasses()\"\n [for]=\"id()\">\n <input\n #inputEl\n type=\"checkbox\"\n class=\"ea-checkbox__input\"\n [id]=\"id()\"\n [checked]=\"checked()\"\n [disabled]=\"isDisabled()\"\n [required]=\"required()\"\n [indeterminate]=\"indeterminate()\"\n [attr.aria-checked]=\"indeterminate() ? 'mixed' : checked()\"\n [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \"\n (change)=\"handleChange()\"\n (keydown)=\"handleKeydown($event)\" />\n\n <span\n class=\"ea-checkbox__box\"\n aria-hidden=\"true\">\n @if (indeterminate()) {\n <svg\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M4 8h8\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\" />\n </svg>\n } @else if (checked()) {\n <svg\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M3.5 8.5L6.5 11.5L12.5 4.5\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n }\n </span>\n\n @if (label()) {\n <span\n class=\"ea-checkbox__label\"\n [class.ea-checkbox__label--required]=\"required()\"\n [eaTooltip]=\"clampedText()\"\n [whenClipped]=\"true\">\n {{ label() }}\n @if (count() !== undefined && count() !== null) {\n <span class=\"ea-checkbox__count\">{{ count() }}</span>\n }\n </span>\n }\n </label>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"errorText()\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n",
|
|
11495
|
-
styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}:host(.ea-checkbox-host--truncate){max-width:100%}.ea-checkbox-field{display:inline-flex;flex-direction:column;gap:.375em}.ea-checkbox-field--truncate{min-width:0}.ea-checkbox-field{--ea-field-messages-size: .8125em}.ea-checkbox-field--2xs{font-size:var(--font-size-2xs)}.ea-checkbox-field--xs{font-size:var(--font-size-xs)}.ea-checkbox-field--sm{font-size:var(--font-size-sm)}.ea-checkbox-field--md{font-size:var(--font-size-md)}.ea-checkbox-field--lg{font-size:var(--font-size-lg)}.ea-checkbox-field--xl{font-size:var(--font-size-xl)}.ea-checkbox{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-checkbox--disabled{opacity:.45;cursor:default}.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:var(--color-brand-default);border-color:var(--color-brand-default);color:var(--color-text-inverse)}@media(forced-colors:active){.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-checkbox:hover:not(.ea-checkbox--disabled) .ea-checkbox__box{border-color:var(--color-
|
|
11495
|
+
styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}:host(.ea-checkbox-host--truncate){max-width:100%}.ea-checkbox-field{display:inline-flex;flex-direction:column;gap:.375em}.ea-checkbox-field--truncate{min-width:0}.ea-checkbox-field{--ea-field-messages-size: .8125em}.ea-checkbox-field--2xs{font-size:var(--font-size-2xs)}.ea-checkbox-field--xs{font-size:var(--font-size-xs)}.ea-checkbox-field--sm{font-size:var(--font-size-sm)}.ea-checkbox-field--md{font-size:var(--font-size-md)}.ea-checkbox-field--lg{font-size:var(--font-size-lg)}.ea-checkbox-field--xl{font-size:var(--font-size-xl)}.ea-checkbox{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-checkbox--disabled{opacity:.45;cursor:default}.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:var(--color-brand-default);border-color:var(--color-brand-default);color:var(--color-text-inverse)}@media(forced-colors:active){.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-checkbox:hover:not(.ea-checkbox--disabled,.ea-checkbox--checked,.ea-checkbox--indeterminate,.ea-checkbox--error) .ea-checkbox__box{border-color:var(--color-border-emphasis)}.ea-checkbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-checkbox__input:focus-visible+.ea-checkbox__box{box-shadow:var(--shadow-focus-ring)}@media(forced-colors:active){.ea-checkbox__input:focus-visible+.ea-checkbox__box{outline:2px solid Highlight;outline-offset:2px}}.ea-checkbox__box{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box;width:1.25em;height:1.25em;border:var(--border-width-thin) solid var(--color-border-strong);border-radius:var(--radius-sm);background-color:var(--color-bg-base);transition:var(--transition-colors),var(--transition-shadow)}.ea-checkbox__box svg{position:absolute;width:65%;height:65%}.ea-checkbox--truncate{min-width:0}.ea-checkbox--truncate .ea-checkbox__label{overflow:hidden;min-width:0;white-space:nowrap;text-overflow:ellipsis}.ea-checkbox__label{font-weight:var(--font-weight-regular);color:var(--ea-checkbox-label-color, inherit);transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox__label--required:after{color:var(--color-error-text);content:\" *\"}.ea-checkbox__count{margin-inline-start:.25em;color:var(--ea-checkbox-count-color, var(--color-text-tertiary));transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox--error .ea-checkbox__box{border-color:var(--color-error-default)}\n"],
|
|
11496
11496
|
dependencies: [
|
|
11497
11497
|
{
|
|
11498
11498
|
kind: "component",
|
|
@@ -11551,7 +11551,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
11551
11551
|
multi: true
|
|
11552
11552
|
}],
|
|
11553
11553
|
template: "<div\n class=\"ea-checkbox-field ea-checkbox-field--{{ size() }}\"\n [class.ea-checkbox-field--truncate]=\"truncate()\">\n <label\n class=\"ea-checkbox\"\n [ngClass]=\"hostClasses()\"\n [for]=\"id()\">\n <input\n #inputEl\n type=\"checkbox\"\n class=\"ea-checkbox__input\"\n [id]=\"id()\"\n [checked]=\"checked()\"\n [disabled]=\"isDisabled()\"\n [required]=\"required()\"\n [indeterminate]=\"indeterminate()\"\n [attr.aria-checked]=\"indeterminate() ? 'mixed' : checked()\"\n [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \"\n (change)=\"handleChange()\"\n (keydown)=\"handleKeydown($event)\" />\n\n <span\n class=\"ea-checkbox__box\"\n aria-hidden=\"true\">\n @if (indeterminate()) {\n <svg\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M4 8h8\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\" />\n </svg>\n } @else if (checked()) {\n <svg\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M3.5 8.5L6.5 11.5L12.5 4.5\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n }\n </span>\n\n @if (label()) {\n <span\n class=\"ea-checkbox__label\"\n [class.ea-checkbox__label--required]=\"required()\"\n [eaTooltip]=\"clampedText()\"\n [whenClipped]=\"true\">\n {{ label() }}\n @if (count() !== undefined && count() !== null) {\n <span class=\"ea-checkbox__count\">{{ count() }}</span>\n }\n </span>\n }\n </label>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"errorText()\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n",
|
|
11554
|
-
styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}:host(.ea-checkbox-host--truncate){max-width:100%}.ea-checkbox-field{display:inline-flex;flex-direction:column;gap:.375em}.ea-checkbox-field--truncate{min-width:0}.ea-checkbox-field{--ea-field-messages-size: .8125em}.ea-checkbox-field--2xs{font-size:var(--font-size-2xs)}.ea-checkbox-field--xs{font-size:var(--font-size-xs)}.ea-checkbox-field--sm{font-size:var(--font-size-sm)}.ea-checkbox-field--md{font-size:var(--font-size-md)}.ea-checkbox-field--lg{font-size:var(--font-size-lg)}.ea-checkbox-field--xl{font-size:var(--font-size-xl)}.ea-checkbox{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-checkbox--disabled{opacity:.45;cursor:default}.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:var(--color-brand-default);border-color:var(--color-brand-default);color:var(--color-text-inverse)}@media(forced-colors:active){.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-checkbox:hover:not(.ea-checkbox--disabled) .ea-checkbox__box{border-color:var(--color-
|
|
11554
|
+
styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}:host(.ea-checkbox-host--truncate){max-width:100%}.ea-checkbox-field{display:inline-flex;flex-direction:column;gap:.375em}.ea-checkbox-field--truncate{min-width:0}.ea-checkbox-field{--ea-field-messages-size: .8125em}.ea-checkbox-field--2xs{font-size:var(--font-size-2xs)}.ea-checkbox-field--xs{font-size:var(--font-size-xs)}.ea-checkbox-field--sm{font-size:var(--font-size-sm)}.ea-checkbox-field--md{font-size:var(--font-size-md)}.ea-checkbox-field--lg{font-size:var(--font-size-lg)}.ea-checkbox-field--xl{font-size:var(--font-size-xl)}.ea-checkbox{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-checkbox--disabled{opacity:.45;cursor:default}.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:var(--color-brand-default);border-color:var(--color-brand-default);color:var(--color-text-inverse)}@media(forced-colors:active){.ea-checkbox--checked .ea-checkbox__box,.ea-checkbox--indeterminate .ea-checkbox__box{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-checkbox:hover:not(.ea-checkbox--disabled,.ea-checkbox--checked,.ea-checkbox--indeterminate,.ea-checkbox--error) .ea-checkbox__box{border-color:var(--color-border-emphasis)}.ea-checkbox__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-checkbox__input:focus-visible+.ea-checkbox__box{box-shadow:var(--shadow-focus-ring)}@media(forced-colors:active){.ea-checkbox__input:focus-visible+.ea-checkbox__box{outline:2px solid Highlight;outline-offset:2px}}.ea-checkbox__box{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box;width:1.25em;height:1.25em;border:var(--border-width-thin) solid var(--color-border-strong);border-radius:var(--radius-sm);background-color:var(--color-bg-base);transition:var(--transition-colors),var(--transition-shadow)}.ea-checkbox__box svg{position:absolute;width:65%;height:65%}.ea-checkbox--truncate{min-width:0}.ea-checkbox--truncate .ea-checkbox__label{overflow:hidden;min-width:0;white-space:nowrap;text-overflow:ellipsis}.ea-checkbox__label{font-weight:var(--font-weight-regular);color:var(--ea-checkbox-label-color, inherit);transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox__label--required:after{color:var(--color-error-text);content:\" *\"}.ea-checkbox__count{margin-inline-start:.25em;color:var(--ea-checkbox-count-color, var(--color-text-tertiary));transition:color var(--duration-fast) var(--ease-out)}.ea-checkbox--error .ea-checkbox__box{border-color:var(--color-error-default)}\n"]
|
|
11555
11555
|
}]
|
|
11556
11556
|
}],
|
|
11557
11557
|
propDecorators: {
|
|
@@ -26149,7 +26149,7 @@ var RadioComponent = class RadioComponent {
|
|
|
26149
26149
|
},
|
|
26150
26150
|
ngImport: i0,
|
|
26151
26151
|
template: "<label\n class=\"ea-radio\"\n [ngClass]=\"hostClasses()\"\n [for]=\"id()\">\n <input\n type=\"radio\"\n class=\"ea-radio__input\"\n [id]=\"id()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [checked]=\"isChecked()\"\n [disabled]=\"isDisabled()\"\n (change)=\"handleChange()\" />\n\n <span\n class=\"ea-radio__circle\"\n aria-hidden=\"true\">\n </span>\n\n @if (label()) {\n <span class=\"ea-radio__label\">{{ label() }}</span>\n }\n</label>\n",
|
|
26152
|
-
styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.ea-radio{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-radio--2xs{font-size:var(--font-size-2xs)}.ea-radio--xs{font-size:var(--font-size-xs)}.ea-radio--sm{font-size:var(--font-size-sm)}.ea-radio--md{font-size:var(--font-size-md)}.ea-radio--lg{font-size:var(--font-size-lg)}.ea-radio--xl{font-size:var(--font-size-xl)}.ea-radio--disabled{opacity:.45;cursor:default}.ea-radio--checked .ea-radio__circle{border-color:var(--color-brand-default)}.ea-radio--checked .ea-radio__circle:after{transform:scale(1)}@media(forced-colors:active){.ea-radio--checked .ea-radio__circle{border-color:Highlight}.ea-radio--checked .ea-radio__circle:after{background-color:Highlight}}.ea-radio:hover:not(.ea-radio--disabled) .ea-radio__circle{border-color:var(--color-
|
|
26152
|
+
styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.ea-radio{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-radio--2xs{font-size:var(--font-size-2xs)}.ea-radio--xs{font-size:var(--font-size-xs)}.ea-radio--sm{font-size:var(--font-size-sm)}.ea-radio--md{font-size:var(--font-size-md)}.ea-radio--lg{font-size:var(--font-size-lg)}.ea-radio--xl{font-size:var(--font-size-xl)}.ea-radio--disabled{opacity:.45;cursor:default}.ea-radio--checked .ea-radio__circle{border-color:var(--color-brand-default)}.ea-radio--checked .ea-radio__circle:after{transform:scale(1)}@media(forced-colors:active){.ea-radio--checked .ea-radio__circle{border-color:Highlight}.ea-radio--checked .ea-radio__circle:after{background-color:Highlight}}.ea-radio:hover:not(.ea-radio--disabled,.ea-radio--checked) .ea-radio__circle{border-color:var(--color-border-emphasis)}.ea-radio__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-radio__input:focus-visible+.ea-radio__circle{box-shadow:var(--shadow-focus-ring)}@media(forced-colors:active){.ea-radio__input:focus-visible+.ea-radio__circle{outline:2px solid Highlight;outline-offset:2px}}.ea-radio__circle{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.25em;height:1.25em;border-radius:var(--radius-full);background-color:var(--color-bg-base);border:var(--border-width-medium) solid var(--color-border-strong);transition:var(--transition-colors),var(--transition-shadow)}.ea-radio__circle:after{content:\"\";display:block;width:45%;height:45%;border-radius:var(--radius-full);background-color:var(--color-brand-default);transform:scale(0);transition:var(--transition-transform)}.ea-radio__label{line-height:1.25em;font-weight:var(--font-weight-regular)}\n"],
|
|
26153
26153
|
dependencies: [{
|
|
26154
26154
|
kind: "directive",
|
|
26155
26155
|
type: NgClass,
|
|
@@ -26171,7 +26171,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
26171
26171
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
26172
26172
|
imports: [NgClass],
|
|
26173
26173
|
template: "<label\n class=\"ea-radio\"\n [ngClass]=\"hostClasses()\"\n [for]=\"id()\">\n <input\n type=\"radio\"\n class=\"ea-radio__input\"\n [id]=\"id()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [checked]=\"isChecked()\"\n [disabled]=\"isDisabled()\"\n (change)=\"handleChange()\" />\n\n <span\n class=\"ea-radio__circle\"\n aria-hidden=\"true\">\n </span>\n\n @if (label()) {\n <span class=\"ea-radio__label\">{{ label() }}</span>\n }\n</label>\n",
|
|
26174
|
-
styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.ea-radio{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-radio--2xs{font-size:var(--font-size-2xs)}.ea-radio--xs{font-size:var(--font-size-xs)}.ea-radio--sm{font-size:var(--font-size-sm)}.ea-radio--md{font-size:var(--font-size-md)}.ea-radio--lg{font-size:var(--font-size-lg)}.ea-radio--xl{font-size:var(--font-size-xl)}.ea-radio--disabled{opacity:.45;cursor:default}.ea-radio--checked .ea-radio__circle{border-color:var(--color-brand-default)}.ea-radio--checked .ea-radio__circle:after{transform:scale(1)}@media(forced-colors:active){.ea-radio--checked .ea-radio__circle{border-color:Highlight}.ea-radio--checked .ea-radio__circle:after{background-color:Highlight}}.ea-radio:hover:not(.ea-radio--disabled) .ea-radio__circle{border-color:var(--color-
|
|
26174
|
+
styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.ea-radio{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans);color:var(--color-text-primary)}.ea-radio--2xs{font-size:var(--font-size-2xs)}.ea-radio--xs{font-size:var(--font-size-xs)}.ea-radio--sm{font-size:var(--font-size-sm)}.ea-radio--md{font-size:var(--font-size-md)}.ea-radio--lg{font-size:var(--font-size-lg)}.ea-radio--xl{font-size:var(--font-size-xl)}.ea-radio--disabled{opacity:.45;cursor:default}.ea-radio--checked .ea-radio__circle{border-color:var(--color-brand-default)}.ea-radio--checked .ea-radio__circle:after{transform:scale(1)}@media(forced-colors:active){.ea-radio--checked .ea-radio__circle{border-color:Highlight}.ea-radio--checked .ea-radio__circle:after{background-color:Highlight}}.ea-radio:hover:not(.ea-radio--disabled,.ea-radio--checked) .ea-radio__circle{border-color:var(--color-border-emphasis)}.ea-radio__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-radio__input:focus-visible+.ea-radio__circle{box-shadow:var(--shadow-focus-ring)}@media(forced-colors:active){.ea-radio__input:focus-visible+.ea-radio__circle{outline:2px solid Highlight;outline-offset:2px}}.ea-radio__circle{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.25em;height:1.25em;border-radius:var(--radius-full);background-color:var(--color-bg-base);border:var(--border-width-medium) solid var(--color-border-strong);transition:var(--transition-colors),var(--transition-shadow)}.ea-radio__circle:after{content:\"\";display:block;width:45%;height:45%;border-radius:var(--radius-full);background-color:var(--color-brand-default);transform:scale(0);transition:var(--transition-transform)}.ea-radio__label{line-height:1.25em;font-weight:var(--font-weight-regular)}\n"]
|
|
26175
26175
|
}]
|
|
26176
26176
|
}],
|
|
26177
26177
|
propDecorators: {
|
|
@@ -29306,7 +29306,7 @@ var SwitchComponent = class SwitchComponent {
|
|
|
29306
29306
|
}],
|
|
29307
29307
|
ngImport: i0,
|
|
29308
29308
|
template: "<div class=\"ea-switch-field ea-switch-field--{{ size() }}\">\n <label\n class=\"ea-switch\"\n [ngClass]=\"hostClasses()\"\n [for]=\"id()\">\n <input\n class=\"ea-switch__input\"\n type=\"checkbox\"\n role=\"switch\"\n [id]=\"id()\"\n [checked]=\"checked()\"\n [disabled]=\"isDisabled()\"\n [required]=\"required()\"\n [attr.aria-checked]=\"checked()\"\n [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \"\n (change)=\"handleChange()\" />\n <span class=\"ea-switch__track\">\n <span class=\"ea-switch__thumb\">\n @if (thumbIcon(); as icon) {\n <span\n class=\"ea-switch__thumb-icon\"\n aria-hidden=\"true\">\n <ng-container *ngComponentOutlet=\"icon\" />\n </span>\n }\n </span>\n </span>\n @if (label()) {\n <span\n class=\"ea-switch__label\"\n [class.ea-switch__label--required]=\"required()\">\n {{ label() }}\n </span>\n }\n </label>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"errorText()\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n",
|
|
29309
|
-
styles: [".ea-switch-field{display:inline-flex;flex-direction:column;gap:.375em;--ea-field-messages-size: .8125em}.ea-switch-field--2xs{font-size:var(--font-size-2xs)}.ea-switch-field--xs{font-size:var(--font-size-xs)}.ea-switch-field--sm{font-size:var(--font-size-sm)}.ea-switch-field--md{font-size:var(--font-size-md)}.ea-switch-field--lg{font-size:var(--font-size-lg)}.ea-switch-field--xl{font-size:var(--font-size-xl)}.ea-switch{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans)}.ea-switch--tone-success{--ea-switch-tone: var(--color-success-default);--ea-switch-tone-wash: var(--color-success-muted)}.ea-switch--tone-warning{--ea-switch-tone: var(--color-warning-default);--ea-switch-tone-wash: var(--color-warning-muted)}.ea-switch--tone-error{--ea-switch-tone: var(--color-error-default);--ea-switch-tone-wash: var(--color-error-muted)}.ea-switch--tone-info{--ea-switch-tone: var(--color-info-default);--ea-switch-tone-wash: var(--color-info-muted)}.ea-switch--checked .ea-switch__track{background-color:var(--ea-switch-tone, var(--color-brand-default));border-color:var(--ea-switch-tone, var(--color-brand-default))}@media(forced-colors:active){.ea-switch--checked .ea-switch__track{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-switch--checked .ea-switch__thumb{transform:translate(calc(100% * var(--ea-rtl-sign)))}.ea-switch--checked .ea-switch__thumb-icon{color:var(--ea-switch-tone, var(--color-brand-default))}.ea-switch--disabled{opacity:.45;cursor:default}.ea-switch:hover:not(.ea-switch--disabled) .ea-switch__track{border-color:var(--ea-switch-tone, var(--color-
|
|
29309
|
+
styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.ea-switch-field{display:inline-flex;flex-direction:column;gap:.375em;--ea-field-messages-size: .8125em}.ea-switch-field--2xs{font-size:var(--font-size-2xs)}.ea-switch-field--xs{font-size:var(--font-size-xs)}.ea-switch-field--sm{font-size:var(--font-size-sm)}.ea-switch-field--md{font-size:var(--font-size-md)}.ea-switch-field--lg{font-size:var(--font-size-lg)}.ea-switch-field--xl{font-size:var(--font-size-xl)}.ea-switch{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans)}.ea-switch--tone-success{--ea-switch-tone: var(--color-success-default);--ea-switch-tone-wash: var(--color-success-muted)}.ea-switch--tone-warning{--ea-switch-tone: var(--color-warning-default);--ea-switch-tone-wash: var(--color-warning-muted)}.ea-switch--tone-error{--ea-switch-tone: var(--color-error-default);--ea-switch-tone-wash: var(--color-error-muted)}.ea-switch--tone-info{--ea-switch-tone: var(--color-info-default);--ea-switch-tone-wash: var(--color-info-muted)}.ea-switch--checked .ea-switch__track{background-color:var(--ea-switch-tone, var(--color-brand-default));border-color:var(--ea-switch-tone, var(--color-brand-default))}@media(forced-colors:active){.ea-switch--checked .ea-switch__track{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-switch--checked .ea-switch__thumb{transform:translate(calc(100% * var(--ea-rtl-sign)))}.ea-switch--checked .ea-switch__thumb-icon{color:var(--ea-switch-tone, var(--color-brand-default))}.ea-switch--disabled{opacity:.45;cursor:default}.ea-switch:hover:not(.ea-switch--disabled,.ea-switch--checked) .ea-switch__track{border-color:var(--ea-switch-tone, var(--color-border-strong))}.ea-switch__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-switch__input:focus-visible+.ea-switch__track{box-shadow:var(--shadow-focus-ring)}@media(forced-colors:active){.ea-switch__input:focus-visible+.ea-switch__track{outline:2px solid Highlight;outline-offset:2px}}.ea-switch__track{position:relative;display:flex;align-items:center;flex-shrink:0;width:calc(var(--ea-switch-size, 1.25em) * 1.8);height:var(--ea-switch-size, 1.25em);padding:calc(var(--ea-switch-size, 1.25em) * .1);background-color:var(--ea-switch-tone-wash, var(--color-bg-muted));border:var(--border-width-thin) solid var(--ea-switch-track-border-color, var(--ea-switch-tone, var(--color-border-default)));border-radius:var(--radius-full);transition:var(--transition-colors)}.ea-switch__thumb{display:flex;align-items:center;justify-content:center;width:calc(var(--ea-switch-size, 1.25em) * .8);height:calc(var(--ea-switch-size, 1.25em) * .8);background-color:var(--color-neutral-0);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);transition:transform var(--duration-fast) var(--ease-out)}.ea-switch__thumb-icon{display:inline-flex;font-size:calc(var(--ea-switch-size, 1.25em) * .5);color:var(--ea-switch-tone, var(--color-neutral-600))}.ea-switch__label{font-weight:var(--font-weight-regular);line-height:var(--line-height-normal);color:var(--color-text-primary)}.ea-switch__label--required:after{color:var(--color-error-text);content:\" *\"}.ea-switch--error .ea-switch__track{border-color:var(--color-error-default)}\n"],
|
|
29310
29310
|
dependencies: [
|
|
29311
29311
|
{
|
|
29312
29312
|
kind: "component",
|
|
@@ -29363,7 +29363,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
29363
29363
|
multi: true
|
|
29364
29364
|
}],
|
|
29365
29365
|
template: "<div class=\"ea-switch-field ea-switch-field--{{ size() }}\">\n <label\n class=\"ea-switch\"\n [ngClass]=\"hostClasses()\"\n [for]=\"id()\">\n <input\n class=\"ea-switch__input\"\n type=\"checkbox\"\n role=\"switch\"\n [id]=\"id()\"\n [checked]=\"checked()\"\n [disabled]=\"isDisabled()\"\n [required]=\"required()\"\n [attr.aria-checked]=\"checked()\"\n [attr.aria-label]=\"!label() ? (ariaLabel() ?? null) : null\"\n [attr.aria-required]=\"required() || null\"\n [attr.aria-invalid]=\"hasError() || null\"\n [attr.aria-describedby]=\"\n showError() ? id() + '-error' : showHint() ? id() + '-hint' : null\n \"\n (change)=\"handleChange()\" />\n <span class=\"ea-switch__track\">\n <span class=\"ea-switch__thumb\">\n @if (thumbIcon(); as icon) {\n <span\n class=\"ea-switch__thumb-icon\"\n aria-hidden=\"true\">\n <ng-container *ngComponentOutlet=\"icon\" />\n </span>\n }\n </span>\n </span>\n @if (label()) {\n <span\n class=\"ea-switch__label\"\n [class.ea-switch__label--required]=\"required()\">\n {{ label() }}\n </span>\n }\n </label>\n\n <ea-field-messages\n [id]=\"id()\"\n [error]=\"errorText()\"\n [hint]=\"showHint() ? hint() : null\" />\n</div>\n",
|
|
29366
|
-
styles: [".ea-switch-field{display:inline-flex;flex-direction:column;gap:.375em;--ea-field-messages-size: .8125em}.ea-switch-field--2xs{font-size:var(--font-size-2xs)}.ea-switch-field--xs{font-size:var(--font-size-xs)}.ea-switch-field--sm{font-size:var(--font-size-sm)}.ea-switch-field--md{font-size:var(--font-size-md)}.ea-switch-field--lg{font-size:var(--font-size-lg)}.ea-switch-field--xl{font-size:var(--font-size-xl)}.ea-switch{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans)}.ea-switch--tone-success{--ea-switch-tone: var(--color-success-default);--ea-switch-tone-wash: var(--color-success-muted)}.ea-switch--tone-warning{--ea-switch-tone: var(--color-warning-default);--ea-switch-tone-wash: var(--color-warning-muted)}.ea-switch--tone-error{--ea-switch-tone: var(--color-error-default);--ea-switch-tone-wash: var(--color-error-muted)}.ea-switch--tone-info{--ea-switch-tone: var(--color-info-default);--ea-switch-tone-wash: var(--color-info-muted)}.ea-switch--checked .ea-switch__track{background-color:var(--ea-switch-tone, var(--color-brand-default));border-color:var(--ea-switch-tone, var(--color-brand-default))}@media(forced-colors:active){.ea-switch--checked .ea-switch__track{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-switch--checked .ea-switch__thumb{transform:translate(calc(100% * var(--ea-rtl-sign)))}.ea-switch--checked .ea-switch__thumb-icon{color:var(--ea-switch-tone, var(--color-brand-default))}.ea-switch--disabled{opacity:.45;cursor:default}.ea-switch:hover:not(.ea-switch--disabled) .ea-switch__track{border-color:var(--ea-switch-tone, var(--color-
|
|
29366
|
+
styles: [":host{display:inline-flex;vertical-align:middle;line-height:1}.ea-switch-field{display:inline-flex;flex-direction:column;gap:.375em;--ea-field-messages-size: .8125em}.ea-switch-field--2xs{font-size:var(--font-size-2xs)}.ea-switch-field--xs{font-size:var(--font-size-xs)}.ea-switch-field--sm{font-size:var(--font-size-sm)}.ea-switch-field--md{font-size:var(--font-size-md)}.ea-switch-field--lg{font-size:var(--font-size-lg)}.ea-switch-field--xl{font-size:var(--font-size-xl)}.ea-switch{display:inline-flex;align-items:center;gap:.5em;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-family-sans)}.ea-switch--tone-success{--ea-switch-tone: var(--color-success-default);--ea-switch-tone-wash: var(--color-success-muted)}.ea-switch--tone-warning{--ea-switch-tone: var(--color-warning-default);--ea-switch-tone-wash: var(--color-warning-muted)}.ea-switch--tone-error{--ea-switch-tone: var(--color-error-default);--ea-switch-tone-wash: var(--color-error-muted)}.ea-switch--tone-info{--ea-switch-tone: var(--color-info-default);--ea-switch-tone-wash: var(--color-info-muted)}.ea-switch--checked .ea-switch__track{background-color:var(--ea-switch-tone, var(--color-brand-default));border-color:var(--ea-switch-tone, var(--color-brand-default))}@media(forced-colors:active){.ea-switch--checked .ea-switch__track{background-color:Highlight;border-color:Highlight;color:HighlightText}}.ea-switch--checked .ea-switch__thumb{transform:translate(calc(100% * var(--ea-rtl-sign)))}.ea-switch--checked .ea-switch__thumb-icon{color:var(--ea-switch-tone, var(--color-brand-default))}.ea-switch--disabled{opacity:.45;cursor:default}.ea-switch:hover:not(.ea-switch--disabled,.ea-switch--checked) .ea-switch__track{border-color:var(--ea-switch-tone, var(--color-border-strong))}.ea-switch__input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ea-switch__input:focus-visible+.ea-switch__track{box-shadow:var(--shadow-focus-ring)}@media(forced-colors:active){.ea-switch__input:focus-visible+.ea-switch__track{outline:2px solid Highlight;outline-offset:2px}}.ea-switch__track{position:relative;display:flex;align-items:center;flex-shrink:0;width:calc(var(--ea-switch-size, 1.25em) * 1.8);height:var(--ea-switch-size, 1.25em);padding:calc(var(--ea-switch-size, 1.25em) * .1);background-color:var(--ea-switch-tone-wash, var(--color-bg-muted));border:var(--border-width-thin) solid var(--ea-switch-track-border-color, var(--ea-switch-tone, var(--color-border-default)));border-radius:var(--radius-full);transition:var(--transition-colors)}.ea-switch__thumb{display:flex;align-items:center;justify-content:center;width:calc(var(--ea-switch-size, 1.25em) * .8);height:calc(var(--ea-switch-size, 1.25em) * .8);background-color:var(--color-neutral-0);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);transition:transform var(--duration-fast) var(--ease-out)}.ea-switch__thumb-icon{display:inline-flex;font-size:calc(var(--ea-switch-size, 1.25em) * .5);color:var(--ea-switch-tone, var(--color-neutral-600))}.ea-switch__label{font-weight:var(--font-weight-regular);line-height:var(--line-height-normal);color:var(--color-text-primary)}.ea-switch__label--required:after{color:var(--color-error-text);content:\" *\"}.ea-switch--error .ea-switch__track{border-color:var(--color-error-default)}\n"]
|
|
29367
29367
|
}]
|
|
29368
29368
|
}],
|
|
29369
29369
|
propDecorators: {
|