@leanix/components 0.4.271 → 0.4.272

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.
@@ -1,12 +1,18 @@
1
1
  import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core';
2
2
  import * as i0 from "@angular/core";
3
3
  export class SkeletonComponent {
4
+ constructor() {
5
+ /**
6
+ * Color of the skeleton element. 'dark' or 'light' are supported. Default is 'light'.
7
+ */
8
+ this.color = 'light';
9
+ }
4
10
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SkeletonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: SkeletonComponent, isStandalone: true, selector: "lx-skeleton", inputs: { width: "width", height: "height", borderRadius: "borderRadius" }, host: { properties: { "style.width": "this.width", "style.height": "this.height", "style.border-radius": "this.borderRadius" } }, ngImport: i0, template: '', isInline: true, styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:18px;background-color:#eaedf1;border-radius:4px;animation:pulse 1.5s infinite;filter:drop-shadow(0px 0px 2px #fff)}:host:after{content:\"\";position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(194,201,214,.2) 20%,rgba(194,201,214,.5) 60%,rgba(255,255,255,0));animation:shimmer 1.5s cubic-bezier(.4,0,.2,1) infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@media (prefers-reduced-motion: reduce){:host:after{animation:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
11
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: SkeletonComponent, isStandalone: true, selector: "lx-skeleton", inputs: { width: "width", height: "height", borderRadius: "borderRadius", color: "color" }, host: { properties: { "style.width": "this.width", "style.height": "this.height", "style.border-radius": "this.borderRadius", "attr.color": "this.color" } }, ngImport: i0, template: '', isInline: true, styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:18px;border-radius:4px;animation:pulse 1.5s infinite;filter:drop-shadow(0px 0px 2px #fff)}:host[color=dark]{background-color:#e1e5eb}:host[color=light]{background-color:#eaedf1}:host:after{content:\"\";position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(194,201,214,.2) 20%,rgba(194,201,214,.5) 60%,rgba(255,255,255,0));animation:shimmer 1.5s cubic-bezier(.4,0,.2,1) infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@media (prefers-reduced-motion: reduce){:host:after{animation:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
6
12
  }
7
13
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SkeletonComponent, decorators: [{
8
14
  type: Component,
9
- args: [{ selector: 'lx-skeleton', template: '', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:18px;background-color:#eaedf1;border-radius:4px;animation:pulse 1.5s infinite;filter:drop-shadow(0px 0px 2px #fff)}:host:after{content:\"\";position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(194,201,214,.2) 20%,rgba(194,201,214,.5) 60%,rgba(255,255,255,0));animation:shimmer 1.5s cubic-bezier(.4,0,.2,1) infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@media (prefers-reduced-motion: reduce){:host:after{animation:none}}\n"] }]
15
+ args: [{ selector: 'lx-skeleton', template: '', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:18px;border-radius:4px;animation:pulse 1.5s infinite;filter:drop-shadow(0px 0px 2px #fff)}:host[color=dark]{background-color:#e1e5eb}:host[color=light]{background-color:#eaedf1}:host:after{content:\"\";position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(194,201,214,.2) 20%,rgba(194,201,214,.5) 60%,rgba(255,255,255,0));animation:shimmer 1.5s cubic-bezier(.4,0,.2,1) infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@media (prefers-reduced-motion: reduce){:host:after{animation:none}}\n"] }]
10
16
  }], propDecorators: { width: [{
11
17
  type: HostBinding,
12
18
  args: ['style.width']
@@ -22,5 +28,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
22
28
  args: ['style.border-radius']
23
29
  }, {
24
30
  type: Input
31
+ }], color: [{
32
+ type: HostBinding,
33
+ args: ['attr.color']
34
+ }, {
35
+ type: Input
25
36
  }] } });
26
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2tlbGV0b24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL3NyYy9saWIvY29yZS11aS9jb21wb25lbnRzL3NrZWxldG9uL3NrZWxldG9uLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBU3ZGLE1BQU0sT0FBTyxpQkFBaUI7OEdBQWpCLGlCQUFpQjtrR0FBakIsaUJBQWlCLHFSQUxsQixFQUFFOzsyRkFLRCxpQkFBaUI7a0JBUDdCLFNBQVM7K0JBQ0UsYUFBYSxZQUNiLEVBQUUsbUJBRUssdUJBQXVCLENBQUMsTUFBTSxjQUNuQyxJQUFJOzhCQU1xQixLQUFLO3NCQUF6QyxXQUFXO3VCQUFDLGFBQWE7O3NCQUFHLEtBQUs7Z0JBS0ksTUFBTTtzQkFBM0MsV0FBVzt1QkFBQyxjQUFjOztzQkFBRyxLQUFLO2dCQUtVLFlBQVk7c0JBQXhELFdBQVc7dUJBQUMscUJBQXFCOztzQkFBRyxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgSG9zdEJpbmRpbmcsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2x4LXNrZWxldG9uJyxcbiAgdGVtcGxhdGU6ICcnLFxuICBzdHlsZVVybDogJ3NrZWxldG9uLmNvbXBvbmVudC5zY3NzJyxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIHN0YW5kYWxvbmU6IHRydWVcbn0pXG5leHBvcnQgY2xhc3MgU2tlbGV0b25Db21wb25lbnQge1xuICAvKipcbiAgICogV2lkdGggb2YgdGhlIHNrZWxldG9uIGVsZW1lbnQuIFZhbGlkIENTUyB2YWx1ZXMgYXJlIHN1cHBvcnRlZC4gRGVmYXVsdCBpcyAxMDAlIHdpZHRoIG9mIHRoZSBwYXJlbnQuXG4gICAqL1xuICBASG9zdEJpbmRpbmcoJ3N0eWxlLndpZHRoJykgQElucHV0KCkgd2lkdGg/OiBzdHJpbmc7XG5cbiAgLyoqXG4gICAqIEhlaWdodCBvZiB0aGUgc2tlbGV0b24gZWxlbWVudC4gVmFsaWQgQ1NTIHZhbHVlcyBhcmUgc3VwcG9ydGVkLiBEZWZhdWx0IGlzIDEwMCUgaGVpZ2h0IG9mIHRoZSBwYXJlbnQuXG4gICAqL1xuICBASG9zdEJpbmRpbmcoJ3N0eWxlLmhlaWdodCcpIEBJbnB1dCgpIGhlaWdodD86IHN0cmluZztcblxuICAvKipcbiAgICogQm9yZGVyIHJhZGl1cyBvZiB0aGUgc2tlbGV0b24gZWxlbWVudC4gVmFsaWQgQ1NTIHZhbHVlcyBhcmUgc3VwcG9ydGVkLiBEZWZhdWx0IGlzIDRweC5cbiAgICovXG4gIEBIb3N0QmluZGluZygnc3R5bGUuYm9yZGVyLXJhZGl1cycpIEBJbnB1dCgpIGJvcmRlclJhZGl1cz86IHN0cmluZztcbn1cbiJdfQ==
37
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2tlbGV0b24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL3NyYy9saWIvY29yZS11aS9jb21wb25lbnRzL3NrZWxldG9uL3NrZWxldG9uLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBU3ZGLE1BQU0sT0FBTyxpQkFBaUI7SUFQOUI7UUF1QkU7O1dBRUc7UUFDaUMsVUFBSyxHQUFxQixPQUFPLENBQUM7S0FDdkU7OEdBcEJZLGlCQUFpQjtrR0FBakIsaUJBQWlCLGlVQUxsQixFQUFFOzsyRkFLRCxpQkFBaUI7a0JBUDdCLFNBQVM7K0JBQ0UsYUFBYSxZQUNiLEVBQUUsbUJBRUssdUJBQXVCLENBQUMsTUFBTSxjQUNuQyxJQUFJOzhCQU1xQixLQUFLO3NCQUF6QyxXQUFXO3VCQUFDLGFBQWE7O3NCQUFHLEtBQUs7Z0JBS0ksTUFBTTtzQkFBM0MsV0FBVzt1QkFBQyxjQUFjOztzQkFBRyxLQUFLO2dCQUtVLFlBQVk7c0JBQXhELFdBQVc7dUJBQUMscUJBQXFCOztzQkFBRyxLQUFLO2dCQUtOLEtBQUs7c0JBQXhDLFdBQVc7dUJBQUMsWUFBWTs7c0JBQUcsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIEhvc3RCaW5kaW5nLCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdseC1za2VsZXRvbicsXG4gIHRlbXBsYXRlOiAnJyxcbiAgc3R5bGVVcmw6ICdza2VsZXRvbi5jb21wb25lbnQuc2NzcycsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBzdGFuZGFsb25lOiB0cnVlXG59KVxuZXhwb3J0IGNsYXNzIFNrZWxldG9uQ29tcG9uZW50IHtcbiAgLyoqXG4gICAqIFdpZHRoIG9mIHRoZSBza2VsZXRvbiBlbGVtZW50LiBWYWxpZCBDU1MgdmFsdWVzIGFyZSBzdXBwb3J0ZWQuIERlZmF1bHQgaXMgMTAwJSB3aWR0aCBvZiB0aGUgcGFyZW50LlxuICAgKi9cbiAgQEhvc3RCaW5kaW5nKCdzdHlsZS53aWR0aCcpIEBJbnB1dCgpIHdpZHRoPzogc3RyaW5nO1xuXG4gIC8qKlxuICAgKiBIZWlnaHQgb2YgdGhlIHNrZWxldG9uIGVsZW1lbnQuIFZhbGlkIENTUyB2YWx1ZXMgYXJlIHN1cHBvcnRlZC4gRGVmYXVsdCBpcyAxMDAlIGhlaWdodCBvZiB0aGUgcGFyZW50LlxuICAgKi9cbiAgQEhvc3RCaW5kaW5nKCdzdHlsZS5oZWlnaHQnKSBASW5wdXQoKSBoZWlnaHQ/OiBzdHJpbmc7XG5cbiAgLyoqXG4gICAqIEJvcmRlciByYWRpdXMgb2YgdGhlIHNrZWxldG9uIGVsZW1lbnQuIFZhbGlkIENTUyB2YWx1ZXMgYXJlIHN1cHBvcnRlZC4gRGVmYXVsdCBpcyA0cHguXG4gICAqL1xuICBASG9zdEJpbmRpbmcoJ3N0eWxlLmJvcmRlci1yYWRpdXMnKSBASW5wdXQoKSBib3JkZXJSYWRpdXM/OiBzdHJpbmc7XG5cbiAgLyoqXG4gICAqIENvbG9yIG9mIHRoZSBza2VsZXRvbiBlbGVtZW50LiAnZGFyaycgb3IgJ2xpZ2h0JyBhcmUgc3VwcG9ydGVkLiBEZWZhdWx0IGlzICdsaWdodCcuXG4gICAqL1xuICBASG9zdEJpbmRpbmcoJ2F0dHIuY29sb3InKSBASW5wdXQoKSBjb2xvcjogJ2RhcmsnIHwgJ2xpZ2h0JyA9ICdsaWdodCc7XG59XG4iXX0=
@@ -2244,12 +2244,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
2244
2244
  }] });
2245
2245
 
2246
2246
  class SkeletonComponent {
2247
+ constructor() {
2248
+ /**
2249
+ * Color of the skeleton element. 'dark' or 'light' are supported. Default is 'light'.
2250
+ */
2251
+ this.color = 'light';
2252
+ }
2247
2253
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SkeletonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2248
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: SkeletonComponent, isStandalone: true, selector: "lx-skeleton", inputs: { width: "width", height: "height", borderRadius: "borderRadius" }, host: { properties: { "style.width": "this.width", "style.height": "this.height", "style.border-radius": "this.borderRadius" } }, ngImport: i0, template: '', isInline: true, styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:18px;background-color:#eaedf1;border-radius:4px;animation:pulse 1.5s infinite;filter:drop-shadow(0px 0px 2px #fff)}:host:after{content:\"\";position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(194,201,214,.2) 20%,rgba(194,201,214,.5) 60%,rgba(255,255,255,0));animation:shimmer 1.5s cubic-bezier(.4,0,.2,1) infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@media (prefers-reduced-motion: reduce){:host:after{animation:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2254
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: SkeletonComponent, isStandalone: true, selector: "lx-skeleton", inputs: { width: "width", height: "height", borderRadius: "borderRadius", color: "color" }, host: { properties: { "style.width": "this.width", "style.height": "this.height", "style.border-radius": "this.borderRadius", "attr.color": "this.color" } }, ngImport: i0, template: '', isInline: true, styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:18px;border-radius:4px;animation:pulse 1.5s infinite;filter:drop-shadow(0px 0px 2px #fff)}:host[color=dark]{background-color:#e1e5eb}:host[color=light]{background-color:#eaedf1}:host:after{content:\"\";position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(194,201,214,.2) 20%,rgba(194,201,214,.5) 60%,rgba(255,255,255,0));animation:shimmer 1.5s cubic-bezier(.4,0,.2,1) infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@media (prefers-reduced-motion: reduce){:host:after{animation:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2249
2255
  }
2250
2256
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SkeletonComponent, decorators: [{
2251
2257
  type: Component,
2252
- args: [{ selector: 'lx-skeleton', template: '', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:18px;background-color:#eaedf1;border-radius:4px;animation:pulse 1.5s infinite;filter:drop-shadow(0px 0px 2px #fff)}:host:after{content:\"\";position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(194,201,214,.2) 20%,rgba(194,201,214,.5) 60%,rgba(255,255,255,0));animation:shimmer 1.5s cubic-bezier(.4,0,.2,1) infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@media (prefers-reduced-motion: reduce){:host:after{animation:none}}\n"] }]
2258
+ args: [{ selector: 'lx-skeleton', template: '', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:18px;border-radius:4px;animation:pulse 1.5s infinite;filter:drop-shadow(0px 0px 2px #fff)}:host[color=dark]{background-color:#e1e5eb}:host[color=light]{background-color:#eaedf1}:host:after{content:\"\";position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(194,201,214,.2) 20%,rgba(194,201,214,.5) 60%,rgba(255,255,255,0));animation:shimmer 1.5s cubic-bezier(.4,0,.2,1) infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@media (prefers-reduced-motion: reduce){:host:after{animation:none}}\n"] }]
2253
2259
  }], propDecorators: { width: [{
2254
2260
  type: HostBinding,
2255
2261
  args: ['style.width']
@@ -2265,6 +2271,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
2265
2271
  args: ['style.border-radius']
2266
2272
  }, {
2267
2273
  type: Input
2274
+ }], color: [{
2275
+ type: HostBinding,
2276
+ args: ['attr.color']
2277
+ }, {
2278
+ type: Input
2268
2279
  }] } });
2269
2280
 
2270
2281
  class TokenComponent {