@underlayerdev/ui 0.18.1 → 0.20.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.
|
@@ -6916,6 +6916,7 @@ var PillComponent = class PillComponent {
|
|
|
6916
6916
|
theme = input("transparent-white", ...ngDevMode ? [{ debugName: "theme" }] : /* istanbul ignore next */ []);
|
|
6917
6917
|
size = input("md", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
|
|
6918
6918
|
disabled = input(false, ...ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []);
|
|
6919
|
+
pressed = input(void 0, ...ngDevMode ? [{ debugName: "pressed" }] : /* istanbul ignore next */ []);
|
|
6919
6920
|
dismiss = output();
|
|
6920
6921
|
dismissibleButtonTheme = computed(() => {
|
|
6921
6922
|
const t = this.theme();
|
|
@@ -6976,11 +6977,18 @@ var PillComponent = class PillComponent {
|
|
|
6976
6977
|
isSignal: true,
|
|
6977
6978
|
isRequired: false,
|
|
6978
6979
|
transformFunction: null
|
|
6980
|
+
},
|
|
6981
|
+
pressed: {
|
|
6982
|
+
classPropertyName: "pressed",
|
|
6983
|
+
publicName: "pressed",
|
|
6984
|
+
isSignal: true,
|
|
6985
|
+
isRequired: false,
|
|
6986
|
+
transformFunction: null
|
|
6979
6987
|
}
|
|
6980
6988
|
},
|
|
6981
6989
|
outputs: { dismiss: "dismiss" },
|
|
6982
6990
|
ngImport: i0,
|
|
6983
|
-
template: "@if (variant() === 'selectable') {\n <label [class]=\"modifierClass()\" [class.ul-pill--disabled]=\"disabled()\">\n <input type=\"checkbox\" class=\"ul-pill__checkbox\" />\n <ng-container *ngTemplateOutlet=\"content\" />\n </label>\n} @else if (['dismissible', 'read-only'].includes(variant())) {\n <div [class]=\"modifierClass()\" [class.ul-pill--disabled]=\"disabled()\">\n <ng-container *ngTemplateOutlet=\"content\" />\n @if (variant() === 'dismissible') {\n <ul-button\n [theme]=\"dismissibleButtonTheme()\"\n size=\"sm\"\n [iconOnly]=\"true\"\n [disabled]=\"disabled()\"\n (click)=\"dismiss.emit()\"\n >\n <ul-icon icon=\"close\" />\n </ul-button>\n }\n </div>\n} @else if (['interactive', 'interactive-rounded'].includes(variant())) {\n <button [class]=\"modifierClass()\" [disabled]=\"disabled()\">\n <ng-container *ngTemplateOutlet=\"content\" />\n </button>\n}\n\n<ng-template #content>\n <ng-content />\n</ng-template>\n",
|
|
6991
|
+
template: "@if (variant() === 'selectable') {\n <label [class]=\"modifierClass()\" [class.ul-pill--disabled]=\"disabled()\">\n <input type=\"checkbox\" class=\"ul-pill__checkbox\" />\n <ng-container *ngTemplateOutlet=\"content\" />\n </label>\n} @else if (['dismissible', 'read-only'].includes(variant())) {\n <div [class]=\"modifierClass()\" [class.ul-pill--disabled]=\"disabled()\">\n <ng-container *ngTemplateOutlet=\"content\" />\n @if (variant() === 'dismissible') {\n <ul-button\n [theme]=\"dismissibleButtonTheme()\"\n size=\"sm\"\n [iconOnly]=\"true\"\n [disabled]=\"disabled()\"\n (click)=\"dismiss.emit()\"\n >\n <ul-icon icon=\"close\" />\n </ul-button>\n }\n </div>\n} @else if (['interactive', 'interactive-rounded'].includes(variant())) {\n <button [class]=\"modifierClass()\" [disabled]=\"disabled()\" [attr.aria-pressed]=\"pressed() ?? null\">\n <ng-container *ngTemplateOutlet=\"content\" />\n </button>\n}\n\n<ng-template #content>\n <ng-content />\n</ng-template>\n",
|
|
6984
6992
|
styles: [".ul-pill{border:none;cursor:pointer;text-decoration-line:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;white-space:nowrap;box-sizing:border-box;background-color:transparent;gap:8px;color:#fff;border-radius:8px;padding:4px 12px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1)}.ul-pill--sm{font-family:Underlayer Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:500;gap:4px;padding:4px 8px}.ul-pill--md{font-family:Underlayer Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:500}.ul-pill--lg{font-family:Underlayer Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500}.ul-pill--interactive,.ul-pill--interactive-rounded,.ul-pill--selectable{cursor:pointer}.ul-pill--interactive:focus-visible,.ul-pill--interactive:focus,.ul-pill--interactive-rounded:focus-visible,.ul-pill--interactive-rounded:focus,.ul-pill--selectable:focus-visible,.ul-pill--selectable:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.ul-pill--interactive-rounded{cursor:pointer;border-radius:4096px}.ul-pill--read-only,.ul-pill--dismissible.ul-pill{cursor:default}.ul-pill--dismissible.ul-pill .ul-btn--sm:last-child .ul-icon{font-size:16px;line-height:16px}.ul-pill--dismissible.ul-pill--sm{padding:4px 4px 4px 8px;border-radius:8px}.ul-pill--dismissible.ul-pill--sm .ul-btn--sm:last-child{min-width:20px;height:20px}.ul-pill--dismissible.ul-pill--md{padding:4px 4px 4px 12px;border-radius:8px}.ul-pill--dismissible.ul-pill--md .ul-btn--sm:last-child{min-width:24px;height:24px}.ul-pill--dismissible.ul-pill--lg{padding:8px 4px 8px 16px;border-radius:12px}.ul-pill--interactive.ul-pill--fill-white,.ul-pill--interactive-rounded.ul-pill--fill-white{background-color:#fff;color:inherit}.ul-pill--interactive.ul-pill--fill-white:hover,.ul-pill--interactive-rounded.ul-pill--fill-white:hover{background-color:#e7e7e7}.ul-pill--interactive.ul-pill--fill-white:active,.ul-pill--interactive-rounded.ul-pill--fill-white:active{background-color:#fff}.ul-pill--interactive.ul-pill--fill-white:selected,.ul-pill--interactive-rounded.ul-pill--fill-white:selected{background-color:#fff}.ul-pill--interactive.ul-pill--fill-white:disabled,.ul-pill--interactive.ul-pill--fill-white[disabled],.ul-pill--interactive-rounded.ul-pill--fill-white:disabled,.ul-pill--interactive-rounded.ul-pill--fill-white[disabled]{background-color:#232323}.ul-pill--interactive.ul-pill--fill-white,.ul-pill--interactive-rounded.ul-pill--fill-white{color:#000}.ul-pill--interactive.ul-pill--fill-black:hover,.ul-pill--interactive-rounded.ul-pill--fill-black:hover{background-color:#3b3b3b}.ul-pill--interactive.ul-pill--fill-black:active,.ul-pill--interactive-rounded.ul-pill--fill-black:active{background-color:#232323}.ul-pill--interactive.ul-pill--fill-black:selected,.ul-pill--interactive-rounded.ul-pill--fill-black:selected{background-color:#3b3b3b}.ul-pill--interactive.ul-pill--fill-black:disabled,.ul-pill--interactive.ul-pill--fill-black[disabled],.ul-pill--interactive-rounded.ul-pill--fill-black:disabled,.ul-pill--interactive-rounded.ul-pill--fill-black[disabled]{background-color:#232323}.ul-pill--interactive.ul-pill--fill-black,.ul-pill--interactive-rounded.ul-pill--fill-black{background-color:#232323;color:inherit;color:#fff}.ul-pill--interactive.ul-pill--fill-purple,.ul-pill--interactive-rounded.ul-pill--fill-purple{background-color:#6f3de0;color:inherit}.ul-pill--interactive.ul-pill--fill-purple:hover,.ul-pill--interactive-rounded.ul-pill--fill-purple:hover{background-color:#7e4af7}.ul-pill--interactive.ul-pill--fill-purple:active,.ul-pill--interactive-rounded.ul-pill--fill-purple:active{background-color:#5935af}.ul-pill--interactive.ul-pill--fill-purple:selected,.ul-pill--interactive-rounded.ul-pill--fill-purple:selected{background-color:#7e4af7}.ul-pill--interactive.ul-pill--fill-purple:disabled,.ul-pill--interactive.ul-pill--fill-purple[disabled],.ul-pill--interactive-rounded.ul-pill--fill-purple:disabled,.ul-pill--interactive-rounded.ul-pill--fill-purple[disabled]{background-color:#232323}.ul-pill--interactive.ul-pill--fill-purple,.ul-pill--interactive-rounded.ul-pill--fill-purple{color:#fff}.ul-pill--interactive.ul-pill--fill-red,.ul-pill--interactive-rounded.ul-pill--fill-red{background-color:#c33a3a;color:inherit}.ul-pill--interactive.ul-pill--fill-red:hover,.ul-pill--interactive-rounded.ul-pill--fill-red:hover{background-color:#d64040}.ul-pill--interactive.ul-pill--fill-red:active,.ul-pill--interactive-rounded.ul-pill--fill-red:active{background-color:#982d2d}.ul-pill--interactive.ul-pill--fill-red:selected,.ul-pill--interactive-rounded.ul-pill--fill-red:selected{background-color:#d64040}.ul-pill--interactive.ul-pill--fill-red:disabled,.ul-pill--interactive.ul-pill--fill-red[disabled],.ul-pill--interactive-rounded.ul-pill--fill-red:disabled,.ul-pill--interactive-rounded.ul-pill--fill-red[disabled]{background-color:#232323}.ul-pill--interactive.ul-pill--fill-red,.ul-pill--interactive-rounded.ul-pill--fill-red{color:#fff}.ul-pill--interactive.ul-pill--fill-green,.ul-pill--interactive-rounded.ul-pill--fill-green{background-color:#0b7a27;color:inherit}.ul-pill--interactive.ul-pill--fill-green:hover,.ul-pill--interactive-rounded.ul-pill--fill-green:hover{background-color:#0e892d}.ul-pill--interactive.ul-pill--fill-green:active,.ul-pill--interactive-rounded.ul-pill--fill-green:active{background-color:#096620}.ul-pill--interactive.ul-pill--fill-green:selected,.ul-pill--interactive-rounded.ul-pill--fill-green:selected{background-color:#0e892d}.ul-pill--interactive.ul-pill--fill-green:disabled,.ul-pill--interactive.ul-pill--fill-green[disabled],.ul-pill--interactive-rounded.ul-pill--fill-green:disabled,.ul-pill--interactive-rounded.ul-pill--fill-green[disabled]{background-color:#232323}.ul-pill--interactive.ul-pill--fill-green,.ul-pill--interactive-rounded.ul-pill--fill-green{color:#fff}.ul-pill--interactive.ul-pill--transparent-white,.ul-pill--interactive-rounded.ul-pill--transparent-white{background-color:#ffffff1a;color:inherit}.ul-pill--interactive.ul-pill--transparent-white:hover,.ul-pill--interactive-rounded.ul-pill--transparent-white:hover{background-color:#fff3}.ul-pill--interactive.ul-pill--transparent-white:active,.ul-pill--interactive-rounded.ul-pill--transparent-white:active{background-color:#ffffff1a}.ul-pill--interactive.ul-pill--transparent-white:selected,.ul-pill--interactive-rounded.ul-pill--transparent-white:selected{background-color:#fff3}.ul-pill--interactive.ul-pill--transparent-white:disabled,.ul-pill--interactive.ul-pill--transparent-white[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-white:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-white[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-white,.ul-pill--interactive-rounded.ul-pill--transparent-white{color:#fff}.ul-pill--interactive.ul-pill--transparent-purple,.ul-pill--interactive-rounded.ul-pill--transparent-purple{background-color:#a781ff33;color:inherit}.ul-pill--interactive.ul-pill--transparent-purple:hover,.ul-pill--interactive-rounded.ul-pill--transparent-purple:hover{background-color:#a781ff4d}.ul-pill--interactive.ul-pill--transparent-purple:active,.ul-pill--interactive-rounded.ul-pill--transparent-purple:active{background-color:#a781ff33}.ul-pill--interactive.ul-pill--transparent-purple:selected,.ul-pill--interactive-rounded.ul-pill--transparent-purple:selected{background-color:#a781ff4d}.ul-pill--interactive.ul-pill--transparent-purple:disabled,.ul-pill--interactive.ul-pill--transparent-purple[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-purple:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-purple[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-purple,.ul-pill--interactive-rounded.ul-pill--transparent-purple{color:#c2a8ff}.ul-pill--interactive.ul-pill--transparent-red,.ul-pill--interactive-rounded.ul-pill--transparent-red{background-color:#f3707033;color:inherit}.ul-pill--interactive.ul-pill--transparent-red:hover,.ul-pill--interactive-rounded.ul-pill--transparent-red:hover{background-color:#f370704d}.ul-pill--interactive.ul-pill--transparent-red:active,.ul-pill--interactive-rounded.ul-pill--transparent-red:active{background-color:#f3707033}.ul-pill--interactive.ul-pill--transparent-red:selected,.ul-pill--interactive-rounded.ul-pill--transparent-red:selected{background-color:#f370704d}.ul-pill--interactive.ul-pill--transparent-red:disabled,.ul-pill--interactive.ul-pill--transparent-red[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-red:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-red[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-red,.ul-pill--interactive-rounded.ul-pill--transparent-red{color:#f69d9d}.ul-pill--interactive.ul-pill--transparent-green,.ul-pill--interactive-rounded.ul-pill--transparent-green{background-color:#50c06c33;color:inherit}.ul-pill--interactive.ul-pill--transparent-green:hover,.ul-pill--interactive-rounded.ul-pill--transparent-green:hover{background-color:#50c06c4d}.ul-pill--interactive.ul-pill--transparent-green:active,.ul-pill--interactive-rounded.ul-pill--transparent-green:active{background-color:#50c06c33}.ul-pill--interactive.ul-pill--transparent-green:selected,.ul-pill--interactive-rounded.ul-pill--transparent-green:selected{background-color:#50c06c4d}.ul-pill--interactive.ul-pill--transparent-green:disabled,.ul-pill--interactive.ul-pill--transparent-green[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-green:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-green[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-green,.ul-pill--interactive-rounded.ul-pill--transparent-green{color:#7edc96}.ul-pill--interactive.ul-pill--stroke-white,.ul-pill--interactive.ul-pill--outline-white,.ul-pill--interactive-rounded.ul-pill--stroke-white,.ul-pill--interactive-rounded.ul-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.ul-pill--interactive.ul-pill--stroke-white:hover:not(:disabled):not([disabled]),.ul-pill--interactive.ul-pill--outline-white:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--stroke-white:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.ul-pill--interactive.ul-pill--stroke-white:active:not(:disabled):not([disabled]),.ul-pill--interactive.ul-pill--outline-white:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--stroke-white:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.ul-pill--interactive.ul-pill--stroke-white:disabled,.ul-pill--interactive.ul-pill--stroke-white[disabled],.ul-pill--interactive.ul-pill--outline-white:disabled,.ul-pill--interactive.ul-pill--outline-white[disabled],.ul-pill--interactive-rounded.ul-pill--stroke-white:disabled,.ul-pill--interactive-rounded.ul-pill--stroke-white[disabled],.ul-pill--interactive-rounded.ul-pill--outline-white:disabled,.ul-pill--interactive-rounded.ul-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-purple,.ul-pill--interactive-rounded.ul-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:disabled,.ul-pill--interactive.ul-pill--outline-purple[disabled],.ul-pill--interactive-rounded.ul-pill--outline-purple:disabled,.ul-pill--interactive-rounded.ul-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-red,.ul-pill--interactive-rounded.ul-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:disabled,.ul-pill--interactive.ul-pill--outline-red[disabled],.ul-pill--interactive-rounded.ul-pill--outline-red:disabled,.ul-pill--interactive-rounded.ul-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-green,.ul-pill--interactive-rounded.ul-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:disabled,.ul-pill--interactive.ul-pill--outline-green[disabled],.ul-pill--interactive-rounded.ul-pill--outline-green:disabled,.ul-pill--interactive-rounded.ul-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--transparent-white,.ul-pill--interactive-rounded.ul-pill--transparent-white,.ul-pill--dismissible.ul-pill--transparent-white{background-color:#ffffff1a;color:inherit}.ul-pill--interactive.ul-pill--transparent-white:disabled,.ul-pill--interactive.ul-pill--transparent-white[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-white:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-white[disabled],.ul-pill--dismissible.ul-pill--transparent-white:disabled,.ul-pill--dismissible.ul-pill--transparent-white[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-white,.ul-pill--interactive-rounded.ul-pill--transparent-white,.ul-pill--dismissible.ul-pill--transparent-white{color:#fff}.ul-pill--interactive.ul-pill--transparent-purple,.ul-pill--interactive-rounded.ul-pill--transparent-purple,.ul-pill--dismissible.ul-pill--transparent-purple{background-color:#a781ff33;color:inherit}.ul-pill--interactive.ul-pill--transparent-purple:disabled,.ul-pill--interactive.ul-pill--transparent-purple[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-purple:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-purple[disabled],.ul-pill--dismissible.ul-pill--transparent-purple:disabled,.ul-pill--dismissible.ul-pill--transparent-purple[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-purple,.ul-pill--interactive-rounded.ul-pill--transparent-purple,.ul-pill--dismissible.ul-pill--transparent-purple{color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-white,.ul-pill--interactive-rounded.ul-pill--outline-white,.ul-pill--dismissible.ul-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.ul-pill--interactive.ul-pill--outline-white:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-white:hover:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.ul-pill--interactive.ul-pill--outline-white:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-white:active:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.ul-pill--interactive.ul-pill--outline-white:disabled,.ul-pill--interactive.ul-pill--outline-white[disabled],.ul-pill--interactive-rounded.ul-pill--outline-white:disabled,.ul-pill--interactive-rounded.ul-pill--outline-white[disabled],.ul-pill--dismissible.ul-pill--outline-white:disabled,.ul-pill--dismissible.ul-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-purple,.ul-pill--interactive-rounded.ul-pill--outline-purple,.ul-pill--dismissible.ul-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-purple:hover:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-purple:active:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:disabled,.ul-pill--interactive.ul-pill--outline-purple[disabled],.ul-pill--interactive-rounded.ul-pill--outline-purple:disabled,.ul-pill--interactive-rounded.ul-pill--outline-purple[disabled],.ul-pill--dismissible.ul-pill--outline-purple:disabled,.ul-pill--dismissible.ul-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-red,.ul-pill--interactive-rounded.ul-pill--outline-red,.ul-pill--dismissible.ul-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-red:hover:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-red:active:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:disabled,.ul-pill--interactive.ul-pill--outline-red[disabled],.ul-pill--interactive-rounded.ul-pill--outline-red:disabled,.ul-pill--interactive-rounded.ul-pill--outline-red[disabled],.ul-pill--dismissible.ul-pill--outline-red:disabled,.ul-pill--dismissible.ul-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-green,.ul-pill--interactive-rounded.ul-pill--outline-green,.ul-pill--dismissible.ul-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-green:hover:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-green:active:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:disabled,.ul-pill--interactive.ul-pill--outline-green[disabled],.ul-pill--interactive-rounded.ul-pill--outline-green:disabled,.ul-pill--interactive-rounded.ul-pill--outline-green[disabled],.ul-pill--dismissible.ul-pill--outline-green:disabled,.ul-pill--dismissible.ul-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--read-only.ul-pill--transparent-white{color:#ffffffb3;border:1px solid rgba(255,255,255,.3)}.ul-pill--read-only.ul-pill--transparent-purple{color:#c2a8ff;border:1px solid #c2a8ff}.ul-pill--read-only.ul-pill--transparent-red{color:#f69d9d;border:1px solid #f69d9d}.ul-pill--read-only.ul-pill--transparent-green{color:#7edc96;border:1px solid #7edc96}.ul-pill--read-only.ul-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.ul-pill--read-only.ul-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.ul-pill--read-only.ul-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.ul-pill--read-only.ul-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.ul-pill--selectable{position:relative}.ul-pill--selectable.ul-pill--transparent-white{color:#ffffffb3;border:1px solid rgba(255,255,255,.3)}.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#ffffff1a;color:inherit}.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked):hover{background-color:#fff3}.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked):active{background-color:#ffffff1a}.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked):selected{background-color:#fff3}.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable.ul-pill--transparent-purple{color:#c2a8ff;border:1px solid #c2a8ff}.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#a781ff33;color:inherit}.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked):hover{background-color:#a781ff4d}.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked):active{background-color:#a781ff33}.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked):selected{background-color:#a781ff4d}.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable.ul-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.ul-pill--selectable.ul-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.ul-pill--selectable.ul-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.ul-pill--selectable.ul-pill--outline-white:disabled,.ul-pill--selectable.ul-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#ffffff1a;color:inherit}.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked):hover{background-color:#fff3}.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked):active{background-color:#ffffff1a}.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked):selected{background-color:#fff3}.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable.ul-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.ul-pill--selectable.ul-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--selectable.ul-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--selectable.ul-pill--outline-purple:disabled,.ul-pill--selectable.ul-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#a781ff33;color:inherit}.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked):hover{background-color:#a781ff4d}.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked):active{background-color:#a781ff33}.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked):selected{background-color:#a781ff4d}.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable.ul-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.ul-pill--selectable.ul-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--selectable.ul-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--selectable.ul-pill--outline-red:disabled,.ul-pill--selectable.ul-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#f3707033;color:inherit}.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked):hover{background-color:#f370704d}.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked):active{background-color:#f3707033}.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked):selected{background-color:#f370704d}.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable.ul-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.ul-pill--selectable.ul-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--selectable.ul-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--selectable.ul-pill--outline-green:disabled,.ul-pill--selectable.ul-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#50c06c33;color:inherit}.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked):hover{background-color:#50c06c4d}.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked):active{background-color:#50c06c33}.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked):selected{background-color:#50c06c4d}.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable .ul-pill__checkbox{position:absolute;visibility:hidden;height:0;width:0;top:0;left:0}.ul-pill--disabled,.ul-pill[disabled],.ul-pill:disabled{cursor:not-allowed;color:#ffffff4d}.ul-pill--disabled.ul-pill--outline-white,.ul-pill--disabled.ul-pill--outline-purple,.ul-pill--disabled.ul-pill--outline-red,.ul-pill--disabled.ul-pill--outline-green,.ul-pill--disabled.ul-pill--stroke-white,.ul-pill[disabled].ul-pill--outline-white,.ul-pill[disabled].ul-pill--outline-purple,.ul-pill[disabled].ul-pill--outline-red,.ul-pill[disabled].ul-pill--outline-green,.ul-pill[disabled].ul-pill--stroke-white,.ul-pill:disabled.ul-pill--outline-white,.ul-pill:disabled.ul-pill--outline-purple,.ul-pill:disabled.ul-pill--outline-red,.ul-pill:disabled.ul-pill--outline-green,.ul-pill:disabled.ul-pill--stroke-white{border-color:#6c6c6c}.ul-pill .ul-icon{font-size:20px;line-height:20px}.ul-pill--sm .ul-icon{font-size:16px;line-height:16px}\n"],
|
|
6985
6993
|
dependencies: [
|
|
6986
6994
|
{
|
|
@@ -7039,7 +7047,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
7039
7047
|
ButtonComponent,
|
|
7040
7048
|
IconComponent
|
|
7041
7049
|
],
|
|
7042
|
-
template: "@if (variant() === 'selectable') {\n <label [class]=\"modifierClass()\" [class.ul-pill--disabled]=\"disabled()\">\n <input type=\"checkbox\" class=\"ul-pill__checkbox\" />\n <ng-container *ngTemplateOutlet=\"content\" />\n </label>\n} @else if (['dismissible', 'read-only'].includes(variant())) {\n <div [class]=\"modifierClass()\" [class.ul-pill--disabled]=\"disabled()\">\n <ng-container *ngTemplateOutlet=\"content\" />\n @if (variant() === 'dismissible') {\n <ul-button\n [theme]=\"dismissibleButtonTheme()\"\n size=\"sm\"\n [iconOnly]=\"true\"\n [disabled]=\"disabled()\"\n (click)=\"dismiss.emit()\"\n >\n <ul-icon icon=\"close\" />\n </ul-button>\n }\n </div>\n} @else if (['interactive', 'interactive-rounded'].includes(variant())) {\n <button [class]=\"modifierClass()\" [disabled]=\"disabled()\">\n <ng-container *ngTemplateOutlet=\"content\" />\n </button>\n}\n\n<ng-template #content>\n <ng-content />\n</ng-template>\n",
|
|
7050
|
+
template: "@if (variant() === 'selectable') {\n <label [class]=\"modifierClass()\" [class.ul-pill--disabled]=\"disabled()\">\n <input type=\"checkbox\" class=\"ul-pill__checkbox\" />\n <ng-container *ngTemplateOutlet=\"content\" />\n </label>\n} @else if (['dismissible', 'read-only'].includes(variant())) {\n <div [class]=\"modifierClass()\" [class.ul-pill--disabled]=\"disabled()\">\n <ng-container *ngTemplateOutlet=\"content\" />\n @if (variant() === 'dismissible') {\n <ul-button\n [theme]=\"dismissibleButtonTheme()\"\n size=\"sm\"\n [iconOnly]=\"true\"\n [disabled]=\"disabled()\"\n (click)=\"dismiss.emit()\"\n >\n <ul-icon icon=\"close\" />\n </ul-button>\n }\n </div>\n} @else if (['interactive', 'interactive-rounded'].includes(variant())) {\n <button [class]=\"modifierClass()\" [disabled]=\"disabled()\" [attr.aria-pressed]=\"pressed() ?? null\">\n <ng-container *ngTemplateOutlet=\"content\" />\n </button>\n}\n\n<ng-template #content>\n <ng-content />\n</ng-template>\n",
|
|
7043
7051
|
styles: [".ul-pill{border:none;cursor:pointer;text-decoration-line:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;white-space:nowrap;box-sizing:border-box;background-color:transparent;gap:8px;color:#fff;border-radius:8px;padding:4px 12px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:color .25s cubic-bezier(.4,0,.2,1),background-color .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1)}.ul-pill--sm{font-family:Underlayer Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:500;gap:4px;padding:4px 8px}.ul-pill--md{font-family:Underlayer Nunito Sans;line-height:20px;font-size:14px;letter-spacing:.14px;font-weight:500}.ul-pill--lg{font-family:Underlayer Nunito Sans;line-height:24px;font-size:16px;letter-spacing:0px;font-weight:500}.ul-pill--interactive,.ul-pill--interactive-rounded,.ul-pill--selectable{cursor:pointer}.ul-pill--interactive:focus-visible,.ul-pill--interactive:focus,.ul-pill--interactive-rounded:focus-visible,.ul-pill--interactive-rounded:focus,.ul-pill--selectable:focus-visible,.ul-pill--selectable:focus{outline-offset:2px;outline:rgba(255,255,255,.3) solid 2px}.ul-pill--interactive-rounded{cursor:pointer;border-radius:4096px}.ul-pill--read-only,.ul-pill--dismissible.ul-pill{cursor:default}.ul-pill--dismissible.ul-pill .ul-btn--sm:last-child .ul-icon{font-size:16px;line-height:16px}.ul-pill--dismissible.ul-pill--sm{padding:4px 4px 4px 8px;border-radius:8px}.ul-pill--dismissible.ul-pill--sm .ul-btn--sm:last-child{min-width:20px;height:20px}.ul-pill--dismissible.ul-pill--md{padding:4px 4px 4px 12px;border-radius:8px}.ul-pill--dismissible.ul-pill--md .ul-btn--sm:last-child{min-width:24px;height:24px}.ul-pill--dismissible.ul-pill--lg{padding:8px 4px 8px 16px;border-radius:12px}.ul-pill--interactive.ul-pill--fill-white,.ul-pill--interactive-rounded.ul-pill--fill-white{background-color:#fff;color:inherit}.ul-pill--interactive.ul-pill--fill-white:hover,.ul-pill--interactive-rounded.ul-pill--fill-white:hover{background-color:#e7e7e7}.ul-pill--interactive.ul-pill--fill-white:active,.ul-pill--interactive-rounded.ul-pill--fill-white:active{background-color:#fff}.ul-pill--interactive.ul-pill--fill-white:selected,.ul-pill--interactive-rounded.ul-pill--fill-white:selected{background-color:#fff}.ul-pill--interactive.ul-pill--fill-white:disabled,.ul-pill--interactive.ul-pill--fill-white[disabled],.ul-pill--interactive-rounded.ul-pill--fill-white:disabled,.ul-pill--interactive-rounded.ul-pill--fill-white[disabled]{background-color:#232323}.ul-pill--interactive.ul-pill--fill-white,.ul-pill--interactive-rounded.ul-pill--fill-white{color:#000}.ul-pill--interactive.ul-pill--fill-black:hover,.ul-pill--interactive-rounded.ul-pill--fill-black:hover{background-color:#3b3b3b}.ul-pill--interactive.ul-pill--fill-black:active,.ul-pill--interactive-rounded.ul-pill--fill-black:active{background-color:#232323}.ul-pill--interactive.ul-pill--fill-black:selected,.ul-pill--interactive-rounded.ul-pill--fill-black:selected{background-color:#3b3b3b}.ul-pill--interactive.ul-pill--fill-black:disabled,.ul-pill--interactive.ul-pill--fill-black[disabled],.ul-pill--interactive-rounded.ul-pill--fill-black:disabled,.ul-pill--interactive-rounded.ul-pill--fill-black[disabled]{background-color:#232323}.ul-pill--interactive.ul-pill--fill-black,.ul-pill--interactive-rounded.ul-pill--fill-black{background-color:#232323;color:inherit;color:#fff}.ul-pill--interactive.ul-pill--fill-purple,.ul-pill--interactive-rounded.ul-pill--fill-purple{background-color:#6f3de0;color:inherit}.ul-pill--interactive.ul-pill--fill-purple:hover,.ul-pill--interactive-rounded.ul-pill--fill-purple:hover{background-color:#7e4af7}.ul-pill--interactive.ul-pill--fill-purple:active,.ul-pill--interactive-rounded.ul-pill--fill-purple:active{background-color:#5935af}.ul-pill--interactive.ul-pill--fill-purple:selected,.ul-pill--interactive-rounded.ul-pill--fill-purple:selected{background-color:#7e4af7}.ul-pill--interactive.ul-pill--fill-purple:disabled,.ul-pill--interactive.ul-pill--fill-purple[disabled],.ul-pill--interactive-rounded.ul-pill--fill-purple:disabled,.ul-pill--interactive-rounded.ul-pill--fill-purple[disabled]{background-color:#232323}.ul-pill--interactive.ul-pill--fill-purple,.ul-pill--interactive-rounded.ul-pill--fill-purple{color:#fff}.ul-pill--interactive.ul-pill--fill-red,.ul-pill--interactive-rounded.ul-pill--fill-red{background-color:#c33a3a;color:inherit}.ul-pill--interactive.ul-pill--fill-red:hover,.ul-pill--interactive-rounded.ul-pill--fill-red:hover{background-color:#d64040}.ul-pill--interactive.ul-pill--fill-red:active,.ul-pill--interactive-rounded.ul-pill--fill-red:active{background-color:#982d2d}.ul-pill--interactive.ul-pill--fill-red:selected,.ul-pill--interactive-rounded.ul-pill--fill-red:selected{background-color:#d64040}.ul-pill--interactive.ul-pill--fill-red:disabled,.ul-pill--interactive.ul-pill--fill-red[disabled],.ul-pill--interactive-rounded.ul-pill--fill-red:disabled,.ul-pill--interactive-rounded.ul-pill--fill-red[disabled]{background-color:#232323}.ul-pill--interactive.ul-pill--fill-red,.ul-pill--interactive-rounded.ul-pill--fill-red{color:#fff}.ul-pill--interactive.ul-pill--fill-green,.ul-pill--interactive-rounded.ul-pill--fill-green{background-color:#0b7a27;color:inherit}.ul-pill--interactive.ul-pill--fill-green:hover,.ul-pill--interactive-rounded.ul-pill--fill-green:hover{background-color:#0e892d}.ul-pill--interactive.ul-pill--fill-green:active,.ul-pill--interactive-rounded.ul-pill--fill-green:active{background-color:#096620}.ul-pill--interactive.ul-pill--fill-green:selected,.ul-pill--interactive-rounded.ul-pill--fill-green:selected{background-color:#0e892d}.ul-pill--interactive.ul-pill--fill-green:disabled,.ul-pill--interactive.ul-pill--fill-green[disabled],.ul-pill--interactive-rounded.ul-pill--fill-green:disabled,.ul-pill--interactive-rounded.ul-pill--fill-green[disabled]{background-color:#232323}.ul-pill--interactive.ul-pill--fill-green,.ul-pill--interactive-rounded.ul-pill--fill-green{color:#fff}.ul-pill--interactive.ul-pill--transparent-white,.ul-pill--interactive-rounded.ul-pill--transparent-white{background-color:#ffffff1a;color:inherit}.ul-pill--interactive.ul-pill--transparent-white:hover,.ul-pill--interactive-rounded.ul-pill--transparent-white:hover{background-color:#fff3}.ul-pill--interactive.ul-pill--transparent-white:active,.ul-pill--interactive-rounded.ul-pill--transparent-white:active{background-color:#ffffff1a}.ul-pill--interactive.ul-pill--transparent-white:selected,.ul-pill--interactive-rounded.ul-pill--transparent-white:selected{background-color:#fff3}.ul-pill--interactive.ul-pill--transparent-white:disabled,.ul-pill--interactive.ul-pill--transparent-white[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-white:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-white[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-white,.ul-pill--interactive-rounded.ul-pill--transparent-white{color:#fff}.ul-pill--interactive.ul-pill--transparent-purple,.ul-pill--interactive-rounded.ul-pill--transparent-purple{background-color:#a781ff33;color:inherit}.ul-pill--interactive.ul-pill--transparent-purple:hover,.ul-pill--interactive-rounded.ul-pill--transparent-purple:hover{background-color:#a781ff4d}.ul-pill--interactive.ul-pill--transparent-purple:active,.ul-pill--interactive-rounded.ul-pill--transparent-purple:active{background-color:#a781ff33}.ul-pill--interactive.ul-pill--transparent-purple:selected,.ul-pill--interactive-rounded.ul-pill--transparent-purple:selected{background-color:#a781ff4d}.ul-pill--interactive.ul-pill--transparent-purple:disabled,.ul-pill--interactive.ul-pill--transparent-purple[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-purple:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-purple[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-purple,.ul-pill--interactive-rounded.ul-pill--transparent-purple{color:#c2a8ff}.ul-pill--interactive.ul-pill--transparent-red,.ul-pill--interactive-rounded.ul-pill--transparent-red{background-color:#f3707033;color:inherit}.ul-pill--interactive.ul-pill--transparent-red:hover,.ul-pill--interactive-rounded.ul-pill--transparent-red:hover{background-color:#f370704d}.ul-pill--interactive.ul-pill--transparent-red:active,.ul-pill--interactive-rounded.ul-pill--transparent-red:active{background-color:#f3707033}.ul-pill--interactive.ul-pill--transparent-red:selected,.ul-pill--interactive-rounded.ul-pill--transparent-red:selected{background-color:#f370704d}.ul-pill--interactive.ul-pill--transparent-red:disabled,.ul-pill--interactive.ul-pill--transparent-red[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-red:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-red[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-red,.ul-pill--interactive-rounded.ul-pill--transparent-red{color:#f69d9d}.ul-pill--interactive.ul-pill--transparent-green,.ul-pill--interactive-rounded.ul-pill--transparent-green{background-color:#50c06c33;color:inherit}.ul-pill--interactive.ul-pill--transparent-green:hover,.ul-pill--interactive-rounded.ul-pill--transparent-green:hover{background-color:#50c06c4d}.ul-pill--interactive.ul-pill--transparent-green:active,.ul-pill--interactive-rounded.ul-pill--transparent-green:active{background-color:#50c06c33}.ul-pill--interactive.ul-pill--transparent-green:selected,.ul-pill--interactive-rounded.ul-pill--transparent-green:selected{background-color:#50c06c4d}.ul-pill--interactive.ul-pill--transparent-green:disabled,.ul-pill--interactive.ul-pill--transparent-green[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-green:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-green[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-green,.ul-pill--interactive-rounded.ul-pill--transparent-green{color:#7edc96}.ul-pill--interactive.ul-pill--stroke-white,.ul-pill--interactive.ul-pill--outline-white,.ul-pill--interactive-rounded.ul-pill--stroke-white,.ul-pill--interactive-rounded.ul-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.ul-pill--interactive.ul-pill--stroke-white:hover:not(:disabled):not([disabled]),.ul-pill--interactive.ul-pill--outline-white:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--stroke-white:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.ul-pill--interactive.ul-pill--stroke-white:active:not(:disabled):not([disabled]),.ul-pill--interactive.ul-pill--outline-white:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--stroke-white:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.ul-pill--interactive.ul-pill--stroke-white:disabled,.ul-pill--interactive.ul-pill--stroke-white[disabled],.ul-pill--interactive.ul-pill--outline-white:disabled,.ul-pill--interactive.ul-pill--outline-white[disabled],.ul-pill--interactive-rounded.ul-pill--stroke-white:disabled,.ul-pill--interactive-rounded.ul-pill--stroke-white[disabled],.ul-pill--interactive-rounded.ul-pill--outline-white:disabled,.ul-pill--interactive-rounded.ul-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-purple,.ul-pill--interactive-rounded.ul-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:disabled,.ul-pill--interactive.ul-pill--outline-purple[disabled],.ul-pill--interactive-rounded.ul-pill--outline-purple:disabled,.ul-pill--interactive-rounded.ul-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-red,.ul-pill--interactive-rounded.ul-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:disabled,.ul-pill--interactive.ul-pill--outline-red[disabled],.ul-pill--interactive-rounded.ul-pill--outline-red:disabled,.ul-pill--interactive-rounded.ul-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-green,.ul-pill--interactive-rounded.ul-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:disabled,.ul-pill--interactive.ul-pill--outline-green[disabled],.ul-pill--interactive-rounded.ul-pill--outline-green:disabled,.ul-pill--interactive-rounded.ul-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--transparent-white,.ul-pill--interactive-rounded.ul-pill--transparent-white,.ul-pill--dismissible.ul-pill--transparent-white{background-color:#ffffff1a;color:inherit}.ul-pill--interactive.ul-pill--transparent-white:disabled,.ul-pill--interactive.ul-pill--transparent-white[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-white:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-white[disabled],.ul-pill--dismissible.ul-pill--transparent-white:disabled,.ul-pill--dismissible.ul-pill--transparent-white[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-white,.ul-pill--interactive-rounded.ul-pill--transparent-white,.ul-pill--dismissible.ul-pill--transparent-white{color:#fff}.ul-pill--interactive.ul-pill--transparent-purple,.ul-pill--interactive-rounded.ul-pill--transparent-purple,.ul-pill--dismissible.ul-pill--transparent-purple{background-color:#a781ff33;color:inherit}.ul-pill--interactive.ul-pill--transparent-purple:disabled,.ul-pill--interactive.ul-pill--transparent-purple[disabled],.ul-pill--interactive-rounded.ul-pill--transparent-purple:disabled,.ul-pill--interactive-rounded.ul-pill--transparent-purple[disabled],.ul-pill--dismissible.ul-pill--transparent-purple:disabled,.ul-pill--dismissible.ul-pill--transparent-purple[disabled]{background-color:#ffffff0d}.ul-pill--interactive.ul-pill--transparent-purple,.ul-pill--interactive-rounded.ul-pill--transparent-purple,.ul-pill--dismissible.ul-pill--transparent-purple{color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-white,.ul-pill--interactive-rounded.ul-pill--outline-white,.ul-pill--dismissible.ul-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.ul-pill--interactive.ul-pill--outline-white:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-white:hover:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.ul-pill--interactive.ul-pill--outline-white:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-white:active:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.ul-pill--interactive.ul-pill--outline-white:disabled,.ul-pill--interactive.ul-pill--outline-white[disabled],.ul-pill--interactive-rounded.ul-pill--outline-white:disabled,.ul-pill--interactive-rounded.ul-pill--outline-white[disabled],.ul-pill--dismissible.ul-pill--outline-white:disabled,.ul-pill--dismissible.ul-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-purple,.ul-pill--interactive-rounded.ul-pill--outline-purple,.ul-pill--dismissible.ul-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-purple:hover:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-purple:active:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--interactive.ul-pill--outline-purple:disabled,.ul-pill--interactive.ul-pill--outline-purple[disabled],.ul-pill--interactive-rounded.ul-pill--outline-purple:disabled,.ul-pill--interactive-rounded.ul-pill--outline-purple[disabled],.ul-pill--dismissible.ul-pill--outline-purple:disabled,.ul-pill--dismissible.ul-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-red,.ul-pill--interactive-rounded.ul-pill--outline-red,.ul-pill--dismissible.ul-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-red:hover:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-red:active:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--interactive.ul-pill--outline-red:disabled,.ul-pill--interactive.ul-pill--outline-red[disabled],.ul-pill--interactive-rounded.ul-pill--outline-red:disabled,.ul-pill--interactive-rounded.ul-pill--outline-red[disabled],.ul-pill--dismissible.ul-pill--outline-red:disabled,.ul-pill--dismissible.ul-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--interactive.ul-pill--outline-green,.ul-pill--interactive-rounded.ul-pill--outline-green,.ul-pill--dismissible.ul-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:hover:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-green:hover:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:active:not(:disabled):not([disabled]),.ul-pill--interactive-rounded.ul-pill--outline-green:active:not(:disabled):not([disabled]),.ul-pill--dismissible.ul-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--interactive.ul-pill--outline-green:disabled,.ul-pill--interactive.ul-pill--outline-green[disabled],.ul-pill--interactive-rounded.ul-pill--outline-green:disabled,.ul-pill--interactive-rounded.ul-pill--outline-green[disabled],.ul-pill--dismissible.ul-pill--outline-green:disabled,.ul-pill--dismissible.ul-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--read-only.ul-pill--transparent-white{color:#ffffffb3;border:1px solid rgba(255,255,255,.3)}.ul-pill--read-only.ul-pill--transparent-purple{color:#c2a8ff;border:1px solid #c2a8ff}.ul-pill--read-only.ul-pill--transparent-red{color:#f69d9d;border:1px solid #f69d9d}.ul-pill--read-only.ul-pill--transparent-green{color:#7edc96;border:1px solid #7edc96}.ul-pill--read-only.ul-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.ul-pill--read-only.ul-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.ul-pill--read-only.ul-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.ul-pill--read-only.ul-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.ul-pill--selectable{position:relative}.ul-pill--selectable.ul-pill--transparent-white{color:#ffffffb3;border:1px solid rgba(255,255,255,.3)}.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#ffffff1a;color:inherit}.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked):hover{background-color:#fff3}.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked):active{background-color:#ffffff1a}.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked):selected{background-color:#fff3}.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--transparent-white:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable.ul-pill--transparent-purple{color:#c2a8ff;border:1px solid #c2a8ff}.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#a781ff33;color:inherit}.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked):hover{background-color:#a781ff4d}.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked):active{background-color:#a781ff33}.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked):selected{background-color:#a781ff4d}.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--transparent-purple:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable.ul-pill--outline-white{background-color:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.ul-pill--selectable.ul-pill--outline-white:hover:not(:disabled):not([disabled]){border-color:#fff}.ul-pill--selectable.ul-pill--outline-white:active:not(:disabled):not([disabled]){border-color:#ffffff80}.ul-pill--selectable.ul-pill--outline-white:disabled,.ul-pill--selectable.ul-pill--outline-white[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#ffffff1a;color:inherit}.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked):hover{background-color:#fff3}.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked):active{background-color:#ffffff1a}.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked):selected{background-color:#fff3}.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--outline-white:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable.ul-pill--outline-purple{background-color:transparent;border:1px solid #c2a8ff;color:#c2a8ff}.ul-pill--selectable.ul-pill--outline-purple:hover:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--selectable.ul-pill--outline-purple:active:not(:disabled):not([disabled]){border-color:#c2a8ff}.ul-pill--selectable.ul-pill--outline-purple:disabled,.ul-pill--selectable.ul-pill--outline-purple[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#a781ff33;color:inherit}.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked):hover{background-color:#a781ff4d}.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked):active{background-color:#a781ff33}.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked):selected{background-color:#a781ff4d}.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--outline-purple:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable.ul-pill--outline-red{background-color:transparent;border:1px solid #f69d9d;color:#f69d9d}.ul-pill--selectable.ul-pill--outline-red:hover:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--selectable.ul-pill--outline-red:active:not(:disabled):not([disabled]){border-color:#f69d9d}.ul-pill--selectable.ul-pill--outline-red:disabled,.ul-pill--selectable.ul-pill--outline-red[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#f3707033;color:inherit}.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked):hover{background-color:#f370704d}.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked):active{background-color:#f3707033}.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked):selected{background-color:#f370704d}.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--outline-red:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable.ul-pill--outline-green{background-color:transparent;border:1px solid #7edc96;color:#7edc96}.ul-pill--selectable.ul-pill--outline-green:hover:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--selectable.ul-pill--outline-green:active:not(:disabled):not([disabled]){border-color:#7edc96}.ul-pill--selectable.ul-pill--outline-green:disabled,.ul-pill--selectable.ul-pill--outline-green[disabled]{border-color:#6c6c6c;color:#ffffff4d}.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked){border-color:transparent;background-color:#50c06c33;color:inherit}.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked):hover{background-color:#50c06c4d}.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked):active{background-color:#50c06c33}.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked):selected{background-color:#50c06c4d}.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked):disabled,.ul-pill--selectable.ul-pill--outline-green:has(.ul-pill__checkbox:checked)[disabled]{background-color:#ffffff0d}.ul-pill--selectable .ul-pill__checkbox{position:absolute;visibility:hidden;height:0;width:0;top:0;left:0}.ul-pill--disabled,.ul-pill[disabled],.ul-pill:disabled{cursor:not-allowed;color:#ffffff4d}.ul-pill--disabled.ul-pill--outline-white,.ul-pill--disabled.ul-pill--outline-purple,.ul-pill--disabled.ul-pill--outline-red,.ul-pill--disabled.ul-pill--outline-green,.ul-pill--disabled.ul-pill--stroke-white,.ul-pill[disabled].ul-pill--outline-white,.ul-pill[disabled].ul-pill--outline-purple,.ul-pill[disabled].ul-pill--outline-red,.ul-pill[disabled].ul-pill--outline-green,.ul-pill[disabled].ul-pill--stroke-white,.ul-pill:disabled.ul-pill--outline-white,.ul-pill:disabled.ul-pill--outline-purple,.ul-pill:disabled.ul-pill--outline-red,.ul-pill:disabled.ul-pill--outline-green,.ul-pill:disabled.ul-pill--stroke-white{border-color:#6c6c6c}.ul-pill .ul-icon{font-size:20px;line-height:20px}.ul-pill--sm .ul-icon{font-size:16px;line-height:16px}\n"]
|
|
7044
7052
|
}]
|
|
7045
7053
|
}],
|
|
@@ -7076,6 +7084,14 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
7076
7084
|
required: false
|
|
7077
7085
|
}]
|
|
7078
7086
|
}],
|
|
7087
|
+
pressed: [{
|
|
7088
|
+
type: i0.Input,
|
|
7089
|
+
args: [{
|
|
7090
|
+
isSignal: true,
|
|
7091
|
+
alias: "pressed",
|
|
7092
|
+
required: false
|
|
7093
|
+
}]
|
|
7094
|
+
}],
|
|
7079
7095
|
dismiss: [{
|
|
7080
7096
|
type: i0.Output,
|
|
7081
7097
|
args: ["dismiss"]
|
|
@@ -7411,7 +7427,8 @@ var HeroComponent = class HeroComponent {
|
|
|
7411
7427
|
"variant",
|
|
7412
7428
|
"theme",
|
|
7413
7429
|
"size",
|
|
7414
|
-
"disabled"
|
|
7430
|
+
"disabled",
|
|
7431
|
+
"pressed"
|
|
7415
7432
|
],
|
|
7416
7433
|
outputs: ["dismiss"]
|
|
7417
7434
|
},
|
|
@@ -12051,6 +12068,96 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
12051
12068
|
}]
|
|
12052
12069
|
}
|
|
12053
12070
|
});
|
|
12071
|
+
var ProgressBarComponent = class ProgressBarComponent {
|
|
12072
|
+
value = input(null, ...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
|
|
12073
|
+
fixed = input(false, ...ngDevMode ? [{ debugName: "fixed" }] : /* istanbul ignore next */ []);
|
|
12074
|
+
label = input("Loading", ...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
|
|
12075
|
+
clampedValue = computed(() => {
|
|
12076
|
+
const value = this.value();
|
|
12077
|
+
return value === null ? null : Math.min(100, Math.max(0, value));
|
|
12078
|
+
}, ...ngDevMode ? [{ debugName: "clampedValue" }] : /* istanbul ignore next */ []);
|
|
12079
|
+
static ɵfac = i0.ɵɵngDeclareFactory({
|
|
12080
|
+
minVersion: "12.0.0",
|
|
12081
|
+
version: "22.2.2",
|
|
12082
|
+
ngImport: i0,
|
|
12083
|
+
type: ProgressBarComponent,
|
|
12084
|
+
deps: [],
|
|
12085
|
+
target: i0.ɵɵFactoryTarget.Component
|
|
12086
|
+
});
|
|
12087
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({
|
|
12088
|
+
minVersion: "17.1.0",
|
|
12089
|
+
version: "22.2.2",
|
|
12090
|
+
type: ProgressBarComponent,
|
|
12091
|
+
isStandalone: true,
|
|
12092
|
+
selector: "ul-progress-bar",
|
|
12093
|
+
inputs: {
|
|
12094
|
+
value: {
|
|
12095
|
+
classPropertyName: "value",
|
|
12096
|
+
publicName: "value",
|
|
12097
|
+
isSignal: true,
|
|
12098
|
+
isRequired: false,
|
|
12099
|
+
transformFunction: null
|
|
12100
|
+
},
|
|
12101
|
+
fixed: {
|
|
12102
|
+
classPropertyName: "fixed",
|
|
12103
|
+
publicName: "fixed",
|
|
12104
|
+
isSignal: true,
|
|
12105
|
+
isRequired: false,
|
|
12106
|
+
transformFunction: null
|
|
12107
|
+
},
|
|
12108
|
+
label: {
|
|
12109
|
+
classPropertyName: "label",
|
|
12110
|
+
publicName: "label",
|
|
12111
|
+
isSignal: true,
|
|
12112
|
+
isRequired: false,
|
|
12113
|
+
transformFunction: null
|
|
12114
|
+
}
|
|
12115
|
+
},
|
|
12116
|
+
ngImport: i0,
|
|
12117
|
+
template: "<div\n class=\"ul-progress-bar\"\n [class.ul-progress-bar--fixed]=\"fixed()\"\n [class.ul-progress-bar--indeterminate]=\"clampedValue() === null\"\n role=\"progressbar\"\n [attr.aria-label]=\"label()\"\n [attr.aria-valuemin]=\"clampedValue() === null ? null : 0\"\n [attr.aria-valuemax]=\"clampedValue() === null ? null : 100\"\n [attr.aria-valuenow]=\"clampedValue()\"\n>\n <div\n class=\"ul-progress-bar__fill\"\n [style.transform]=\"clampedValue() === null ? null : 'scaleX(' + clampedValue()! / 100 + ')'\"\n ></div>\n</div>\n",
|
|
12118
|
+
styles: [":host{display:block}.ul-progress-bar{position:relative;width:100%;height:4px;overflow:hidden}.ul-progress-bar--fixed{position:fixed;inset-block-start:0;inset-inline:0;z-index:1200}.ul-progress-bar__fill{position:absolute;inset:0;background-color:#6f3de0;transform-origin:left;transition:transform .2s ease-out}.ul-progress-bar--indeterminate .ul-progress-bar__fill{animation:ul-progress-bar-indeterminate 1.2s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.ul-progress-bar--indeterminate .ul-progress-bar__fill{animation:none}}@keyframes ul-progress-bar-indeterminate{0%{transform:scaleX(0)}60%{transform:scaleX(.8)}to{transform:scaleX(1);opacity:0}}\n"]
|
|
12119
|
+
});
|
|
12120
|
+
};
|
|
12121
|
+
i0.ɵɵngDeclareClassMetadata({
|
|
12122
|
+
minVersion: "12.0.0",
|
|
12123
|
+
version: "22.2.2",
|
|
12124
|
+
ngImport: i0,
|
|
12125
|
+
type: ProgressBarComponent,
|
|
12126
|
+
decorators: [{
|
|
12127
|
+
type: Component,
|
|
12128
|
+
args: [{
|
|
12129
|
+
selector: "ul-progress-bar",
|
|
12130
|
+
template: "<div\n class=\"ul-progress-bar\"\n [class.ul-progress-bar--fixed]=\"fixed()\"\n [class.ul-progress-bar--indeterminate]=\"clampedValue() === null\"\n role=\"progressbar\"\n [attr.aria-label]=\"label()\"\n [attr.aria-valuemin]=\"clampedValue() === null ? null : 0\"\n [attr.aria-valuemax]=\"clampedValue() === null ? null : 100\"\n [attr.aria-valuenow]=\"clampedValue()\"\n>\n <div\n class=\"ul-progress-bar__fill\"\n [style.transform]=\"clampedValue() === null ? null : 'scaleX(' + clampedValue()! / 100 + ')'\"\n ></div>\n</div>\n",
|
|
12131
|
+
styles: [":host{display:block}.ul-progress-bar{position:relative;width:100%;height:4px;overflow:hidden}.ul-progress-bar--fixed{position:fixed;inset-block-start:0;inset-inline:0;z-index:1200}.ul-progress-bar__fill{position:absolute;inset:0;background-color:#6f3de0;transform-origin:left;transition:transform .2s ease-out}.ul-progress-bar--indeterminate .ul-progress-bar__fill{animation:ul-progress-bar-indeterminate 1.2s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.ul-progress-bar--indeterminate .ul-progress-bar__fill{animation:none}}@keyframes ul-progress-bar-indeterminate{0%{transform:scaleX(0)}60%{transform:scaleX(.8)}to{transform:scaleX(1);opacity:0}}\n"]
|
|
12132
|
+
}]
|
|
12133
|
+
}],
|
|
12134
|
+
propDecorators: {
|
|
12135
|
+
value: [{
|
|
12136
|
+
type: i0.Input,
|
|
12137
|
+
args: [{
|
|
12138
|
+
isSignal: true,
|
|
12139
|
+
alias: "value",
|
|
12140
|
+
required: false
|
|
12141
|
+
}]
|
|
12142
|
+
}],
|
|
12143
|
+
fixed: [{
|
|
12144
|
+
type: i0.Input,
|
|
12145
|
+
args: [{
|
|
12146
|
+
isSignal: true,
|
|
12147
|
+
alias: "fixed",
|
|
12148
|
+
required: false
|
|
12149
|
+
}]
|
|
12150
|
+
}],
|
|
12151
|
+
label: [{
|
|
12152
|
+
type: i0.Input,
|
|
12153
|
+
args: [{
|
|
12154
|
+
isSignal: true,
|
|
12155
|
+
alias: "label",
|
|
12156
|
+
required: false
|
|
12157
|
+
}]
|
|
12158
|
+
}]
|
|
12159
|
+
}
|
|
12160
|
+
});
|
|
12054
12161
|
var RadioComponent = class RadioComponent {
|
|
12055
12162
|
value = input.required(...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
|
|
12056
12163
|
name = input.required(...ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []);
|
|
@@ -16258,6 +16365,6 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
16258
16365
|
}]
|
|
16259
16366
|
}
|
|
16260
16367
|
});
|
|
16261
|
-
export { AccordionComponent, AccordionItemComponent, AreaCodeComponent, AvatarComponent, AvatarGroupComponent, BannerComponent, BreadcrumbComponent, ButtonComponent, CalendarComponent, CardComponent, CategoryPickerComponent, CheckboxComponent, CollapseComponent, CustomCurrencyPipe, DockComponent, DockItemComponent, DockItemContentSlotDirective, DropdownComponent, FileInputComponent, FooterComponent, FormFieldHelperComponent, FormFieldLabelComponent, HeroComponent, IconComponent, ImageCropperComponent, ImageNotFoundComponent, ImageNotFoundDirective, InputComponent, ListItemComponent, LoadMoreComponent, LongPressDirective, MenuComponent, MenuItemComponent, 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 };
|
|
16368
|
+
export { AccordionComponent, AccordionItemComponent, AreaCodeComponent, AvatarComponent, AvatarGroupComponent, BannerComponent, BreadcrumbComponent, ButtonComponent, CalendarComponent, CardComponent, CategoryPickerComponent, CheckboxComponent, CollapseComponent, CustomCurrencyPipe, DockComponent, DockItemComponent, DockItemContentSlotDirective, DropdownComponent, FileInputComponent, FooterComponent, FormFieldHelperComponent, FormFieldLabelComponent, HeroComponent, IconComponent, ImageCropperComponent, ImageNotFoundComponent, ImageNotFoundDirective, InputComponent, ListItemComponent, LoadMoreComponent, LongPressDirective, MenuComponent, MenuItemComponent, MenuItemsComponent, MenuTriggerComponent, ModalComponent, NavbarAppNameSlotDirective, NavbarAvatarSlotDirective, NavbarComponent, NavbarLogoSlotDirective, NavbarSearchSlotDirective, PeHeroActionsSlotDirective, PeHeroBadgesSlotDirective, PeHeroContentSlotDirective, PeHeroSubtitleSlotDirective, PeHeroTitleSlotDirective, PillComponent, PriceButtonComponent, ProgressBarComponent, RadialComponent, RadioComponent, RadioGroupComponent, RichTextComponent, SearchInputComponent, SearchSelectComponent, SelectComponent, SelectableRowComponent, SidebarComponent, SkeletonComponent, StatusComponent, StepperComponent, TableComponent, TextareaComponent, TextareaFieldDirective, ToastContainerComponent, ToastService, ToggleComponent, TooltipComponent, createFormFieldIds, getFormFieldDescribedBy, toastIcon };
|
|
16262
16369
|
|
|
16263
16370
|
//# sourceMappingURL=underlayerdev-ui.mjs.map
|