@rivet-health/design-system 4.4.0 → 4.5.0-hackathon.1

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.
Files changed (7) hide show
  1. package/esm2020/lib/load/loading/loading.component.mjs +19 -25
  2. package/fesm2015/rivet-health-design-system.mjs +19 -25
  3. package/fesm2015/rivet-health-design-system.mjs.map +1 -1
  4. package/fesm2020/rivet-health-design-system.mjs +19 -25
  5. package/fesm2020/rivet-health-design-system.mjs.map +1 -1
  6. package/lib/load/loading/loading.component.d.ts +2 -5
  7. package/package.json +1 -1
package/esm2020/lib/load/loading/loading.component.mjs CHANGED
@@ -5,38 +5,32 @@ export class LoadingComponent {
5
5
  constructor() {
6
6
  this.size = 40;
7
7
  this.variant = 'dark';
8
+ this.strokeWidth = LoadingComponent.STROKE_WIDTH;
8
9
  }
9
- getHalfSize() {
10
- return this.size / 2;
11
- }
12
- getStrokeWidth() {
13
- return LoadingComponent.STROKE_WIDTH;
14
- }
15
- getHalfStroke() {
16
- return LoadingComponent.STROKE_WIDTH / 2;
17
- }
18
- getRadius() {
19
- return this.getHalfSize() - this.getHalfStroke();
20
- }
21
- getArcData() {
22
- const halfSize = this.getHalfSize();
23
- const radius = this.getRadius();
24
- const mx = halfSize + radius * Math.sin(LoadingComponent.ARC_START_RADIANS);
25
- const my = halfSize - radius * Math.cos(LoadingComponent.ARC_START_RADIANS);
26
- const ax = halfSize;
27
- const ay = halfSize;
28
- const x = halfSize + radius;
29
- const y = halfSize;
30
- return `M${mx},${my} A${ax},${ay} 0 0,1 ${x},${y}`;
10
+ getPathData() {
11
+ const size = this.size;
12
+ const halfSize = size / 2;
13
+ const stroke = LoadingComponent.STROKE_WIDTH;
14
+ const halfStroke = stroke / 2;
15
+ const top = halfStroke;
16
+ const right = size - stroke;
17
+ const radius = (size - stroke * 2) / 2;
18
+ const commands = [
19
+ `M${halfSize},${top}`,
20
+ `L${right},${top}`,
21
+ `L${right},${halfSize}`,
22
+ `A ${radius} ${radius},0,1,1,${halfSize} ${top}`,
23
+ ];
24
+ return commands.join(' ');
31
25
  }
32
26
  }
33
27
  LoadingComponent.STROKE_WIDTH = 1.5;
34
28
  LoadingComponent.ARC_START_RADIANS = (Math.PI * 22.5) / 180;
35
29
  LoadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
36
- LoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LoadingComponent, selector: "riv-loading", inputs: { size: "size", variant: "variant" }, ngImport: i0, template: "<svg\n [ngClass]=\"{\n dark: variant === 'dark',\n light: variant === 'light',\n small: size === 16,\n medium: size === 40,\n large: size === 80\n }\"\n xmlns=\"http://www.w3.org/2000/svg\"\n [attr.width]=\"size\"\n [attr.height]=\"size\"\n [attr.viewBox]=\"'0 0 ' + size + ' ' + size\"\n fill=\"none\"\n>\n <circle\n [attr.cx]=\"getHalfSize()\"\n [attr.cy]=\"getHalfSize()\"\n [attr.r]=\"getRadius()\"\n [attr.stroke-width]=\"getStrokeWidth()\"\n opacity=\".1\"\n />\n <path [attr.stroke-width]=\"getStrokeWidth()\" [attr.d]=\"getArcData()\"></path>\n</svg>\n", styles: [":host{display:inline-block;font-size:0;line-height:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.dark path,.dark circle{stroke:var(--brand)}.light path,.light circle{stroke:var(--white-90)}.small{animation:.7s linear spin infinite}.medium{animation:.75s linear spin infinite}.large{animation:.9s linear spin infinite}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
30
+ LoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LoadingComponent, selector: "riv-loading", inputs: { size: "size", variant: "variant" }, ngImport: i0, template: "<svg\n [ngClass]=\"{\n dark: variant === 'dark',\n light: variant === 'light',\n small: size === 16,\n medium: size === 40,\n large: size === 80\n }\"\n xmlns=\"http://www.w3.org/2000/svg\"\n [attr.width]=\"size\"\n [attr.height]=\"size\"\n [attr.viewBox]=\"'0 0 ' + size + ' ' + size\"\n fill=\"none\"\n>\n <path [attr.stroke-width]=\"strokeWidth\" [attr.d]=\"getPathData()\"></path>\n</svg>\n", styles: [":host{display:inline-block;font-size:0;line-height:0}.dark path{stroke:var(--brand)}.light path{stroke:var(--white-90)}@keyframes stroke-small{0%{stroke-dasharray:1 43;stroke-dashoffset:0}50%{stroke-dasharray:43 1}to{stroke-dasharray:1 43;stroke-dashoffset:-44}}.small{animation:1.5s linear stroke-small infinite}@keyframes stroke-medium{0%{stroke-dasharray:1 121;stroke-dashoffset:0}50%{stroke-dasharray:121 1}to{stroke-dasharray:1 121;stroke-dashoffset:-122}}.medium{animation:1.67s linear stroke-medium infinite}@keyframes stroke-large{0%{stroke-dasharray:1 259;stroke-dashoffset:0}50%{stroke-dasharray:259 1}to{stroke-dasharray:1 259;stroke-dashoffset:-260}}.large{animation:2s linear stroke-large infinite}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
37
31
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LoadingComponent, decorators: [{
38
32
  type: Component,
39
- args: [{ selector: 'riv-loading', changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg\n [ngClass]=\"{\n dark: variant === 'dark',\n light: variant === 'light',\n small: size === 16,\n medium: size === 40,\n large: size === 80\n }\"\n xmlns=\"http://www.w3.org/2000/svg\"\n [attr.width]=\"size\"\n [attr.height]=\"size\"\n [attr.viewBox]=\"'0 0 ' + size + ' ' + size\"\n fill=\"none\"\n>\n <circle\n [attr.cx]=\"getHalfSize()\"\n [attr.cy]=\"getHalfSize()\"\n [attr.r]=\"getRadius()\"\n [attr.stroke-width]=\"getStrokeWidth()\"\n opacity=\".1\"\n />\n <path [attr.stroke-width]=\"getStrokeWidth()\" [attr.d]=\"getArcData()\"></path>\n</svg>\n", styles: [":host{display:inline-block;font-size:0;line-height:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.dark path,.dark circle{stroke:var(--brand)}.light path,.light circle{stroke:var(--white-90)}.small{animation:.7s linear spin infinite}.medium{animation:.75s linear spin infinite}.large{animation:.9s linear spin infinite}\n"] }]
33
+ args: [{ selector: 'riv-loading', changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg\n [ngClass]=\"{\n dark: variant === 'dark',\n light: variant === 'light',\n small: size === 16,\n medium: size === 40,\n large: size === 80\n }\"\n xmlns=\"http://www.w3.org/2000/svg\"\n [attr.width]=\"size\"\n [attr.height]=\"size\"\n [attr.viewBox]=\"'0 0 ' + size + ' ' + size\"\n fill=\"none\"\n>\n <path [attr.stroke-width]=\"strokeWidth\" [attr.d]=\"getPathData()\"></path>\n</svg>\n", styles: [":host{display:inline-block;font-size:0;line-height:0}.dark path{stroke:var(--brand)}.light path{stroke:var(--white-90)}@keyframes stroke-small{0%{stroke-dasharray:1 43;stroke-dashoffset:0}50%{stroke-dasharray:43 1}to{stroke-dasharray:1 43;stroke-dashoffset:-44}}.small{animation:1.5s linear stroke-small infinite}@keyframes stroke-medium{0%{stroke-dasharray:1 121;stroke-dashoffset:0}50%{stroke-dasharray:121 1}to{stroke-dasharray:1 121;stroke-dashoffset:-122}}.medium{animation:1.67s linear stroke-medium infinite}@keyframes stroke-large{0%{stroke-dasharray:1 259;stroke-dashoffset:0}50%{stroke-dasharray:259 1}to{stroke-dasharray:1 259;stroke-dashoffset:-260}}.large{animation:2s linear stroke-large infinite}\n"] }]
40
34
  }], propDecorators: { size: [{
41
35
  type: Input
42
36
  }], variant: [{
@@ -46,4 +40,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
46
40
  LoadingComponent.Sizes = [16, 40, 80];
47
41
  LoadingComponent.Variants = ['light', 'dark'];
48
42
  })(LoadingComponent || (LoadingComponent = {}));
49
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9yaXYvc3JjL2xpYi9sb2FkL2xvYWRpbmcvbG9hZGluZy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9yaXYvc3JjL2xpYi9sb2FkL2xvYWRpbmcvbG9hZGluZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBUTFFLE1BQU0sT0FBTyxnQkFBZ0I7SUFON0I7UUFXRSxTQUFJLEdBQTBCLEVBQUUsQ0FBQztRQUdqQyxZQUFPLEdBQTZCLE1BQU0sQ0FBQztLQTZCNUM7SUEzQkMsV0FBVztRQUNULE9BQU8sSUFBSSxDQUFDLElBQUksR0FBRyxDQUFDLENBQUM7SUFDdkIsQ0FBQztJQUVELGNBQWM7UUFDWixPQUFPLGdCQUFnQixDQUFDLFlBQVksQ0FBQztJQUN2QyxDQUFDO0lBRUQsYUFBYTtRQUNYLE9BQU8sZ0JBQWdCLENBQUMsWUFBWSxHQUFHLENBQUMsQ0FBQztJQUMzQyxDQUFDO0lBRUQsU0FBUztRQUNQLE9BQU8sSUFBSSxDQUFDLFdBQVcsRUFBRSxHQUFHLElBQUksQ0FBQyxhQUFhLEVBQUUsQ0FBQztJQUNuRCxDQUFDO0lBRUQsVUFBVTtRQUNSLE1BQU0sUUFBUSxHQUFHLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQztRQUNwQyxNQUFNLE1BQU0sR0FBRyxJQUFJLENBQUMsU0FBUyxFQUFFLENBQUM7UUFDaEMsTUFBTSxFQUFFLEdBQUcsUUFBUSxHQUFHLE1BQU0sR0FBRyxJQUFJLENBQUMsR0FBRyxDQUFDLGdCQUFnQixDQUFDLGlCQUFpQixDQUFDLENBQUM7UUFDNUUsTUFBTSxFQUFFLEdBQUcsUUFBUSxHQUFHLE1BQU0sR0FBRyxJQUFJLENBQUMsR0FBRyxDQUFDLGdCQUFnQixDQUFDLGlCQUFpQixDQUFDLENBQUM7UUFDNUUsTUFBTSxFQUFFLEdBQUcsUUFBUSxDQUFDO1FBQ3BCLE1BQU0sRUFBRSxHQUFHLFFBQVEsQ0FBQztRQUNwQixNQUFNLENBQUMsR0FBRyxRQUFRLEdBQUcsTUFBTSxDQUFDO1FBQzVCLE1BQU0sQ0FBQyxHQUFHLFFBQVEsQ0FBQztRQUNuQixPQUFPLElBQUksRUFBRSxJQUFJLEVBQUUsS0FBSyxFQUFFLElBQUksRUFBRSxVQUFVLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQztJQUNyRCxDQUFDOztBQW5DZSw2QkFBWSxHQUFHLEdBQUksQ0FBQTtBQUNuQixrQ0FBaUIsR0FBRyxDQUFDLElBQUksQ0FBQyxFQUFFLEdBQUcsSUFBSSxDQUFDLEdBQUcsR0FBSSxDQUFBOzZHQUZoRCxnQkFBZ0I7aUdBQWhCLGdCQUFnQixpR0NSN0IsMGxCQXVCQTsyRkRmYSxnQkFBZ0I7a0JBTjVCLFNBQVM7K0JBQ0UsYUFBYSxtQkFHTix1QkFBdUIsQ0FBQyxNQUFNOzhCQU8vQyxJQUFJO3NCQURILEtBQUs7Z0JBSU4sT0FBTztzQkFETixLQUFLOztBQWdDUixXQUFpQixnQkFBZ0I7SUFDbEIsc0JBQUssR0FBRyxDQUFDLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxDQUFVLENBQUM7SUFHOUIseUJBQVEsR0FBRyxDQUFDLE9BQU8sRUFBRSxNQUFNLENBQVUsQ0FBQztBQUVyRCxDQUFDLEVBTmdCLGdCQUFnQixLQUFoQixnQkFBZ0IsUUFNaEMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdyaXYtbG9hZGluZycsXG4gIHRlbXBsYXRlVXJsOiAnLi9sb2FkaW5nLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vbG9hZGluZy5jb21wb25lbnQuY3NzJ10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBMb2FkaW5nQ29tcG9uZW50IHtcbiAgc3RhdGljIHJlYWRvbmx5IFNUUk9LRV9XSURUSCA9IDEuNTtcbiAgc3RhdGljIHJlYWRvbmx5IEFSQ19TVEFSVF9SQURJQU5TID0gKE1hdGguUEkgKiAyMi41KSAvIDE4MDtcblxuICBASW5wdXQoKVxuICBzaXplOiBMb2FkaW5nQ29tcG9uZW50LlNpemUgPSA0MDtcblxuICBASW5wdXQoKVxuICB2YXJpYW50OiBMb2FkaW5nQ29tcG9uZW50LlZhcmlhbnQgPSAnZGFyayc7XG5cbiAgZ2V0SGFsZlNpemUoKSB7XG4gICAgcmV0dXJuIHRoaXMuc2l6ZSAvIDI7XG4gIH1cblxuICBnZXRTdHJva2VXaWR0aCgpIHtcbiAgICByZXR1cm4gTG9hZGluZ0NvbXBvbmVudC5TVFJPS0VfV0lEVEg7XG4gIH1cblxuICBnZXRIYWxmU3Ryb2tlKCkge1xuICAgIHJldHVybiBMb2FkaW5nQ29tcG9uZW50LlNUUk9LRV9XSURUSCAvIDI7XG4gIH1cblxuICBnZXRSYWRpdXMoKSB7XG4gICAgcmV0dXJuIHRoaXMuZ2V0SGFsZlNpemUoKSAtIHRoaXMuZ2V0SGFsZlN0cm9rZSgpO1xuICB9XG5cbiAgZ2V0QXJjRGF0YSgpIHtcbiAgICBjb25zdCBoYWxmU2l6ZSA9IHRoaXMuZ2V0SGFsZlNpemUoKTtcbiAgICBjb25zdCByYWRpdXMgPSB0aGlzLmdldFJhZGl1cygpO1xuICAgIGNvbnN0IG14ID0gaGFsZlNpemUgKyByYWRpdXMgKiBNYXRoLnNpbihMb2FkaW5nQ29tcG9uZW50LkFSQ19TVEFSVF9SQURJQU5TKTtcbiAgICBjb25zdCBteSA9IGhhbGZTaXplIC0gcmFkaXVzICogTWF0aC5jb3MoTG9hZGluZ0NvbXBvbmVudC5BUkNfU1RBUlRfUkFESUFOUyk7XG4gICAgY29uc3QgYXggPSBoYWxmU2l6ZTtcbiAgICBjb25zdCBheSA9IGhhbGZTaXplO1xuICAgIGNvbnN0IHggPSBoYWxmU2l6ZSArIHJhZGl1cztcbiAgICBjb25zdCB5ID0gaGFsZlNpemU7XG4gICAgcmV0dXJuIGBNJHtteH0sJHtteX0gQSR7YXh9LCR7YXl9IDAgMCwxICR7eH0sJHt5fWA7XG4gIH1cbn1cblxuZXhwb3J0IG5hbWVzcGFjZSBMb2FkaW5nQ29tcG9uZW50IHtcbiAgZXhwb3J0IGNvbnN0IFNpemVzID0gWzE2LCA0MCwgODBdIGFzIGNvbnN0O1xuICBleHBvcnQgdHlwZSBTaXplID0gKHR5cGVvZiBMb2FkaW5nQ29tcG9uZW50LlNpemVzKVtudW1iZXJdO1xuXG4gIGV4cG9ydCBjb25zdCBWYXJpYW50cyA9IFsnbGlnaHQnLCAnZGFyayddIGFzIGNvbnN0O1xuICBleHBvcnQgdHlwZSBWYXJpYW50ID0gKHR5cGVvZiBMb2FkaW5nQ29tcG9uZW50LlZhcmlhbnRzKVtudW1iZXJdO1xufVxuIiwiPHN2Z1xuICBbbmdDbGFzc109XCJ7XG4gICAgZGFyazogdmFyaWFudCA9PT0gJ2RhcmsnLFxuICAgIGxpZ2h0OiB2YXJpYW50ID09PSAnbGlnaHQnLFxuICAgIHNtYWxsOiBzaXplID09PSAxNixcbiAgICBtZWRpdW06IHNpemUgPT09IDQwLFxuICAgIGxhcmdlOiBzaXplID09PSA4MFxuICB9XCJcbiAgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiXG4gIFthdHRyLndpZHRoXT1cInNpemVcIlxuICBbYXR0ci5oZWlnaHRdPVwic2l6ZVwiXG4gIFthdHRyLnZpZXdCb3hdPVwiJzAgMCAnICsgc2l6ZSArICcgJyArIHNpemVcIlxuICBmaWxsPVwibm9uZVwiXG4+XG4gIDxjaXJjbGVcbiAgICBbYXR0ci5jeF09XCJnZXRIYWxmU2l6ZSgpXCJcbiAgICBbYXR0ci5jeV09XCJnZXRIYWxmU2l6ZSgpXCJcbiAgICBbYXR0ci5yXT1cImdldFJhZGl1cygpXCJcbiAgICBbYXR0ci5zdHJva2Utd2lkdGhdPVwiZ2V0U3Ryb2tlV2lkdGgoKVwiXG4gICAgb3BhY2l0eT1cIi4xXCJcbiAgLz5cbiAgPHBhdGggW2F0dHIuc3Ryb2tlLXdpZHRoXT1cImdldFN0cm9rZVdpZHRoKClcIiBbYXR0ci5kXT1cImdldEFyY0RhdGEoKVwiPjwvcGF0aD5cbjwvc3ZnPlxuIl19
43
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9yaXYvc3JjL2xpYi9sb2FkL2xvYWRpbmcvbG9hZGluZy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9yaXYvc3JjL2xpYi9sb2FkL2xvYWRpbmcvbG9hZGluZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBUTFFLE1BQU0sT0FBTyxnQkFBZ0I7SUFON0I7UUFXRSxTQUFJLEdBQTBCLEVBQUUsQ0FBQztRQUdqQyxZQUFPLEdBQTZCLE1BQU0sQ0FBQztRQXNCbEMsZ0JBQVcsR0FBRyxnQkFBZ0IsQ0FBQyxZQUFZLENBQUM7S0FDdEQ7SUFyQkMsV0FBVztRQUNULE1BQU0sSUFBSSxHQUFHLElBQUksQ0FBQyxJQUFJLENBQUM7UUFDdkIsTUFBTSxRQUFRLEdBQUcsSUFBSSxHQUFHLENBQUMsQ0FBQztRQUUxQixNQUFNLE1BQU0sR0FBRyxnQkFBZ0IsQ0FBQyxZQUFZLENBQUM7UUFDN0MsTUFBTSxVQUFVLEdBQUcsTUFBTSxHQUFHLENBQUMsQ0FBQztRQUU5QixNQUFNLEdBQUcsR0FBRyxVQUFVLENBQUM7UUFDdkIsTUFBTSxLQUFLLEdBQUcsSUFBSSxHQUFHLE1BQU0sQ0FBQztRQUM1QixNQUFNLE1BQU0sR0FBRyxDQUFDLElBQUksR0FBRyxNQUFNLEdBQUcsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDO1FBRXZDLE1BQU0sUUFBUSxHQUFHO1lBQ2YsSUFBSSxRQUFRLElBQUksR0FBRyxFQUFFO1lBQ3JCLElBQUksS0FBSyxJQUFJLEdBQUcsRUFBRTtZQUNsQixJQUFJLEtBQUssSUFBSSxRQUFRLEVBQUU7WUFDdkIsS0FBSyxNQUFNLElBQUksTUFBTSxVQUFVLFFBQVEsSUFBSSxHQUFHLEVBQUU7U0FDakQsQ0FBQztRQUNGLE9BQU8sUUFBUSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztJQUM1QixDQUFDOztBQTNCZSw2QkFBWSxHQUFHLEdBQUksQ0FBQTtBQUNuQixrQ0FBaUIsR0FBRyxDQUFDLElBQUksQ0FBQyxFQUFFLEdBQUcsSUFBSSxDQUFDLEdBQUcsR0FBSSxDQUFBOzZHQUZoRCxnQkFBZ0I7aUdBQWhCLGdCQUFnQixpR0NSN0IsbWFBZ0JBOzJGRFJhLGdCQUFnQjtrQkFONUIsU0FBUzsrQkFDRSxhQUFhLG1CQUdOLHVCQUF1QixDQUFDLE1BQU07OEJBTy9DLElBQUk7c0JBREgsS0FBSztnQkFJTixPQUFPO3NCQUROLEtBQUs7O0FBMEJSLFdBQWlCLGdCQUFnQjtJQUNsQixzQkFBSyxHQUFHLENBQUMsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLENBQVUsQ0FBQztJQUc5Qix5QkFBUSxHQUFHLENBQUMsT0FBTyxFQUFFLE1BQU0sQ0FBVSxDQUFDO0FBRXJELENBQUMsRUFOZ0IsZ0JBQWdCLEtBQWhCLGdCQUFnQixRQU1oQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3Jpdi1sb2FkaW5nJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2xvYWRpbmcuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9sb2FkaW5nLmNvbXBvbmVudC5jc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIExvYWRpbmdDb21wb25lbnQge1xuICBzdGF0aWMgcmVhZG9ubHkgU1RST0tFX1dJRFRIID0gMS41O1xuICBzdGF0aWMgcmVhZG9ubHkgQVJDX1NUQVJUX1JBRElBTlMgPSAoTWF0aC5QSSAqIDIyLjUpIC8gMTgwO1xuXG4gIEBJbnB1dCgpXG4gIHNpemU6IExvYWRpbmdDb21wb25lbnQuU2l6ZSA9IDQwO1xuXG4gIEBJbnB1dCgpXG4gIHZhcmlhbnQ6IExvYWRpbmdDb21wb25lbnQuVmFyaWFudCA9ICdkYXJrJztcblxuICBnZXRQYXRoRGF0YSgpIHtcbiAgICBjb25zdCBzaXplID0gdGhpcy5zaXplO1xuICAgIGNvbnN0IGhhbGZTaXplID0gc2l6ZSAvIDI7XG5cbiAgICBjb25zdCBzdHJva2UgPSBMb2FkaW5nQ29tcG9uZW50LlNUUk9LRV9XSURUSDtcbiAgICBjb25zdCBoYWxmU3Ryb2tlID0gc3Ryb2tlIC8gMjtcblxuICAgIGNvbnN0IHRvcCA9IGhhbGZTdHJva2U7XG4gICAgY29uc3QgcmlnaHQgPSBzaXplIC0gc3Ryb2tlO1xuICAgIGNvbnN0IHJhZGl1cyA9IChzaXplIC0gc3Ryb2tlICogMikgLyAyO1xuXG4gICAgY29uc3QgY29tbWFuZHMgPSBbXG4gICAgICBgTSR7aGFsZlNpemV9LCR7dG9wfWAsXG4gICAgICBgTCR7cmlnaHR9LCR7dG9wfWAsXG4gICAgICBgTCR7cmlnaHR9LCR7aGFsZlNpemV9YCxcbiAgICAgIGBBICR7cmFkaXVzfSAke3JhZGl1c30sMCwxLDEsJHtoYWxmU2l6ZX0gJHt0b3B9YCxcbiAgICBdO1xuICAgIHJldHVybiBjb21tYW5kcy5qb2luKCcgJyk7XG4gIH1cblxuICByZWFkb25seSBzdHJva2VXaWR0aCA9IExvYWRpbmdDb21wb25lbnQuU1RST0tFX1dJRFRIO1xufVxuXG5leHBvcnQgbmFtZXNwYWNlIExvYWRpbmdDb21wb25lbnQge1xuICBleHBvcnQgY29uc3QgU2l6ZXMgPSBbMTYsIDQwLCA4MF0gYXMgY29uc3Q7XG4gIGV4cG9ydCB0eXBlIFNpemUgPSAodHlwZW9mIExvYWRpbmdDb21wb25lbnQuU2l6ZXMpW251bWJlcl07XG5cbiAgZXhwb3J0IGNvbnN0IFZhcmlhbnRzID0gWydsaWdodCcsICdkYXJrJ10gYXMgY29uc3Q7XG4gIGV4cG9ydCB0eXBlIFZhcmlhbnQgPSAodHlwZW9mIExvYWRpbmdDb21wb25lbnQuVmFyaWFudHMpW251bWJlcl07XG59XG4iLCI8c3ZnXG4gIFtuZ0NsYXNzXT1cIntcbiAgICBkYXJrOiB2YXJpYW50ID09PSAnZGFyaycsXG4gICAgbGlnaHQ6IHZhcmlhbnQgPT09ICdsaWdodCcsXG4gICAgc21hbGw6IHNpemUgPT09IDE2LFxuICAgIG1lZGl1bTogc2l6ZSA9PT0gNDAsXG4gICAgbGFyZ2U6IHNpemUgPT09IDgwXG4gIH1cIlxuICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCJcbiAgW2F0dHIud2lkdGhdPVwic2l6ZVwiXG4gIFthdHRyLmhlaWdodF09XCJzaXplXCJcbiAgW2F0dHIudmlld0JveF09XCInMCAwICcgKyBzaXplICsgJyAnICsgc2l6ZVwiXG4gIGZpbGw9XCJub25lXCJcbj5cbiAgPHBhdGggW2F0dHIuc3Ryb2tlLXdpZHRoXT1cInN0cm9rZVdpZHRoXCIgW2F0dHIuZF09XCJnZXRQYXRoRGF0YSgpXCI+PC9wYXRoPlxuPC9zdmc+XG4iXX0=
package/fesm2015/rivet-health-design-system.mjs CHANGED
@@ -1010,38 +1010,32 @@ class LoadingComponent {
1010
1010
  constructor() {
1011
1011
  this.size = 40;
1012
1012
  this.variant = 'dark';
1013
- }
1014
- getHalfSize() {
1015
- return this.size / 2;
1016
- }
1017
- getStrokeWidth() {
1018
- return LoadingComponent.STROKE_WIDTH;
1019
- }
1020
- getHalfStroke() {
1021
- return LoadingComponent.STROKE_WIDTH / 2;
1022
- }
1023
- getRadius() {
1024
- return this.getHalfSize() - this.getHalfStroke();
1025
- }
1026
- getArcData() {
1027
- const halfSize = this.getHalfSize();
1028
- const radius = this.getRadius();
1029
- const mx = halfSize + radius * Math.sin(LoadingComponent.ARC_START_RADIANS);
1030
- const my = halfSize - radius * Math.cos(LoadingComponent.ARC_START_RADIANS);
1031
- const ax = halfSize;
1032
- const ay = halfSize;
1033
- const x = halfSize + radius;
1034
- const y = halfSize;
1035
- return `M${mx},${my} A${ax},${ay} 0 0,1 ${x},${y}`;
1013
+ this.strokeWidth = LoadingComponent.STROKE_WIDTH;
1014
+ }
1015
+ getPathData() {
1016
+ const size = this.size;
1017
+ const halfSize = size / 2;
1018
+ const stroke = LoadingComponent.STROKE_WIDTH;
1019
+ const halfStroke = stroke / 2;
1020
+ const top = halfStroke;
1021
+ const right = size - stroke;
1022
+ const radius = (size - stroke * 2) / 2;
1023
+ const commands = [
1024
+ `M${halfSize},${top}`,
1025
+ `L${right},${top}`,
1026
+ `L${right},${halfSize}`,
1027
+ `A ${radius} ${radius},0,1,1,${halfSize} ${top}`,
1028
+ ];
1029
+ return commands.join(' ');
1036
1030
  }
1037
1031
  }
1038
1032
  LoadingComponent.STROKE_WIDTH = 1.5;
1039
1033
  LoadingComponent.ARC_START_RADIANS = (Math.PI * 22.5) / 180;
1040
1034
  LoadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1041
- LoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LoadingComponent, selector: "riv-loading", inputs: { size: "size", variant: "variant" }, ngImport: i0, template: "<svg\n [ngClass]=\"{\n dark: variant === 'dark',\n light: variant === 'light',\n small: size === 16,\n medium: size === 40,\n large: size === 80\n }\"\n xmlns=\"http://www.w3.org/2000/svg\"\n [attr.width]=\"size\"\n [attr.height]=\"size\"\n [attr.viewBox]=\"'0 0 ' + size + ' ' + size\"\n fill=\"none\"\n>\n <circle\n [attr.cx]=\"getHalfSize()\"\n [attr.cy]=\"getHalfSize()\"\n [attr.r]=\"getRadius()\"\n [attr.stroke-width]=\"getStrokeWidth()\"\n opacity=\".1\"\n />\n <path [attr.stroke-width]=\"getStrokeWidth()\" [attr.d]=\"getArcData()\"></path>\n</svg>\n", styles: [":host{display:inline-block;font-size:0;line-height:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.dark path,.dark circle{stroke:var(--brand)}.light path,.light circle{stroke:var(--white-90)}.small{animation:.7s linear spin infinite}.medium{animation:.75s linear spin infinite}.large{animation:.9s linear spin infinite}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1035
+ LoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LoadingComponent, selector: "riv-loading", inputs: { size: "size", variant: "variant" }, ngImport: i0, template: "<svg\n [ngClass]=\"{\n dark: variant === 'dark',\n light: variant === 'light',\n small: size === 16,\n medium: size === 40,\n large: size === 80\n }\"\n xmlns=\"http://www.w3.org/2000/svg\"\n [attr.width]=\"size\"\n [attr.height]=\"size\"\n [attr.viewBox]=\"'0 0 ' + size + ' ' + size\"\n fill=\"none\"\n>\n <path [attr.stroke-width]=\"strokeWidth\" [attr.d]=\"getPathData()\"></path>\n</svg>\n", styles: [":host{display:inline-block;font-size:0;line-height:0}.dark path{stroke:var(--brand)}.light path{stroke:var(--white-90)}@keyframes stroke-small{0%{stroke-dasharray:1 43;stroke-dashoffset:0}50%{stroke-dasharray:43 1}to{stroke-dasharray:1 43;stroke-dashoffset:-44}}.small{animation:1.5s linear stroke-small infinite}@keyframes stroke-medium{0%{stroke-dasharray:1 121;stroke-dashoffset:0}50%{stroke-dasharray:121 1}to{stroke-dasharray:1 121;stroke-dashoffset:-122}}.medium{animation:1.67s linear stroke-medium infinite}@keyframes stroke-large{0%{stroke-dasharray:1 259;stroke-dashoffset:0}50%{stroke-dasharray:259 1}to{stroke-dasharray:1 259;stroke-dashoffset:-260}}.large{animation:2s linear stroke-large infinite}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1042
1036
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LoadingComponent, decorators: [{
1043
1037
  type: Component,
1044
- args: [{ selector: 'riv-loading', changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg\n [ngClass]=\"{\n dark: variant === 'dark',\n light: variant === 'light',\n small: size === 16,\n medium: size === 40,\n large: size === 80\n }\"\n xmlns=\"http://www.w3.org/2000/svg\"\n [attr.width]=\"size\"\n [attr.height]=\"size\"\n [attr.viewBox]=\"'0 0 ' + size + ' ' + size\"\n fill=\"none\"\n>\n <circle\n [attr.cx]=\"getHalfSize()\"\n [attr.cy]=\"getHalfSize()\"\n [attr.r]=\"getRadius()\"\n [attr.stroke-width]=\"getStrokeWidth()\"\n opacity=\".1\"\n />\n <path [attr.stroke-width]=\"getStrokeWidth()\" [attr.d]=\"getArcData()\"></path>\n</svg>\n", styles: [":host{display:inline-block;font-size:0;line-height:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.dark path,.dark circle{stroke:var(--brand)}.light path,.light circle{stroke:var(--white-90)}.small{animation:.7s linear spin infinite}.medium{animation:.75s linear spin infinite}.large{animation:.9s linear spin infinite}\n"] }]
1038
+ args: [{ selector: 'riv-loading', changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg\n [ngClass]=\"{\n dark: variant === 'dark',\n light: variant === 'light',\n small: size === 16,\n medium: size === 40,\n large: size === 80\n }\"\n xmlns=\"http://www.w3.org/2000/svg\"\n [attr.width]=\"size\"\n [attr.height]=\"size\"\n [attr.viewBox]=\"'0 0 ' + size + ' ' + size\"\n fill=\"none\"\n>\n <path [attr.stroke-width]=\"strokeWidth\" [attr.d]=\"getPathData()\"></path>\n</svg>\n", styles: [":host{display:inline-block;font-size:0;line-height:0}.dark path{stroke:var(--brand)}.light path{stroke:var(--white-90)}@keyframes stroke-small{0%{stroke-dasharray:1 43;stroke-dashoffset:0}50%{stroke-dasharray:43 1}to{stroke-dasharray:1 43;stroke-dashoffset:-44}}.small{animation:1.5s linear stroke-small infinite}@keyframes stroke-medium{0%{stroke-dasharray:1 121;stroke-dashoffset:0}50%{stroke-dasharray:121 1}to{stroke-dasharray:1 121;stroke-dashoffset:-122}}.medium{animation:1.67s linear stroke-medium infinite}@keyframes stroke-large{0%{stroke-dasharray:1 259;stroke-dashoffset:0}50%{stroke-dasharray:259 1}to{stroke-dasharray:1 259;stroke-dashoffset:-260}}.large{animation:2s linear stroke-large infinite}\n"] }]
1045
1039
  }], propDecorators: { size: [{
1046
1040
  type: Input
1047
1041
  }], variant: [{