@rivet-health/design-system 31.3.1 → 31.3.2

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.
@@ -18,10 +18,10 @@ export class ToastComponent {
18
18
  }
19
19
  ToastComponent.DURATION = 5000;
20
20
  ToastComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
21
- ToastComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ToastComponent, selector: "riv-toast", inputs: { variant: "variant", icon: "icon" }, outputs: { close: "close" }, ngImport: i0, template: "<div *riv-overlay class=\"wrapper\" [attr.data-animation-hook]=\"hook\">\n <div class=\"toast\" [ngClass]=\"variant\">\n <riv-icon *ngIf=\"icon\" [name]=\"icon\" [size]=\"16\"></riv-icon>\n <div class=\"content\"><ng-content></ng-content></div>\n </div>\n</div>\n", styles: [".wrapper{position:fixed;top:calc(var(--base-grid-size) * 20);left:50%}.toast{transform:translate(-50%);display:inline-flex;align-items:center;justify-content:center;gap:var(--size-small);padding:var(--size-xsmall) var(--size-large);border-radius:calc(var(--base-grid-size) * 8);box-shadow:var(--depth-1);font:var(--body-medium)}.toast.basic{background-color:var(--surface-dark-0);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--surface-dark-0)}.toast.danger{background-color:var(--danger-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--danger-main)}.toast.safety{background-color:var(--safety-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--safety-main)}.toast.safety-dark{background-color:var(--baja-blast-90);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--baja-blast-90)}.toast.safety-inverse{background-color:var(--surface-light-safety);color:var(--type-light-safety);border:var(--border-width) solid currentColor}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }, { kind: "directive", type: i3.OverlayDirective, selector: "[riv-overlay]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
21
+ ToastComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ToastComponent, selector: "riv-toast", inputs: { variant: "variant", icon: "icon" }, outputs: { close: "close" }, ngImport: i0, template: "<div *riv-overlay class=\"wrapper\" [attr.data-animation-hook]=\"hook\">\n <div class=\"toast\" [ngClass]=\"variant\">\n <riv-icon *ngIf=\"icon\" [name]=\"icon\" [size]=\"16\"></riv-icon>\n <div class=\"content\"><ng-content></ng-content></div>\n </div>\n</div>\n", styles: [".wrapper{position:fixed;top:calc(var(--base-grid-size) * 20);left:50%;z-index:var(--toast-z-index)}.toast{transform:translate(-50%);display:inline-flex;align-items:center;justify-content:center;gap:var(--size-small);padding:var(--size-xsmall) var(--size-large);border-radius:calc(var(--base-grid-size) * 8);box-shadow:var(--depth-1);font:var(--body-medium)}.toast.basic{background-color:var(--surface-dark-0);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--surface-dark-0)}.toast.danger{background-color:var(--danger-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--danger-main)}.toast.safety{background-color:var(--safety-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--safety-main)}.toast.safety-dark{background-color:var(--baja-blast-90);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--baja-blast-90)}.toast.safety-inverse{background-color:var(--surface-light-safety);color:var(--type-light-safety);border:var(--border-width) solid currentColor}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }, { kind: "directive", type: i3.OverlayDirective, selector: "[riv-overlay]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
22
22
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ToastComponent, decorators: [{
23
23
  type: Component,
24
- args: [{ selector: 'riv-toast', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *riv-overlay class=\"wrapper\" [attr.data-animation-hook]=\"hook\">\n <div class=\"toast\" [ngClass]=\"variant\">\n <riv-icon *ngIf=\"icon\" [name]=\"icon\" [size]=\"16\"></riv-icon>\n <div class=\"content\"><ng-content></ng-content></div>\n </div>\n</div>\n", styles: [".wrapper{position:fixed;top:calc(var(--base-grid-size) * 20);left:50%}.toast{transform:translate(-50%);display:inline-flex;align-items:center;justify-content:center;gap:var(--size-small);padding:var(--size-xsmall) var(--size-large);border-radius:calc(var(--base-grid-size) * 8);box-shadow:var(--depth-1);font:var(--body-medium)}.toast.basic{background-color:var(--surface-dark-0);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--surface-dark-0)}.toast.danger{background-color:var(--danger-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--danger-main)}.toast.safety{background-color:var(--safety-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--safety-main)}.toast.safety-dark{background-color:var(--baja-blast-90);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--baja-blast-90)}.toast.safety-inverse{background-color:var(--surface-light-safety);color:var(--type-light-safety);border:var(--border-width) solid currentColor}\n"] }]
24
+ args: [{ selector: 'riv-toast', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *riv-overlay class=\"wrapper\" [attr.data-animation-hook]=\"hook\">\n <div class=\"toast\" [ngClass]=\"variant\">\n <riv-icon *ngIf=\"icon\" [name]=\"icon\" [size]=\"16\"></riv-icon>\n <div class=\"content\"><ng-content></ng-content></div>\n </div>\n</div>\n", styles: [".wrapper{position:fixed;top:calc(var(--base-grid-size) * 20);left:50%;z-index:var(--toast-z-index)}.toast{transform:translate(-50%);display:inline-flex;align-items:center;justify-content:center;gap:var(--size-small);padding:var(--size-xsmall) var(--size-large);border-radius:calc(var(--base-grid-size) * 8);box-shadow:var(--depth-1);font:var(--body-medium)}.toast.basic{background-color:var(--surface-dark-0);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--surface-dark-0)}.toast.danger{background-color:var(--danger-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--danger-main)}.toast.safety{background-color:var(--safety-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--safety-main)}.toast.safety-dark{background-color:var(--baja-blast-90);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--baja-blast-90)}.toast.safety-inverse{background-color:var(--surface-light-safety);color:var(--type-light-safety);border:var(--border-width) solid currentColor}\n"] }]
25
25
  }], propDecorators: { variant: [{
26
26
  type: Input
27
27
  }], icon: [{
@@ -5043,10 +5043,10 @@ class ToastComponent {
5043
5043
  }
5044
5044
  ToastComponent.DURATION = 5000;
5045
5045
  ToastComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
5046
- ToastComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ToastComponent, selector: "riv-toast", inputs: { variant: "variant", icon: "icon" }, outputs: { close: "close" }, ngImport: i0, template: "<div *riv-overlay class=\"wrapper\" [attr.data-animation-hook]=\"hook\">\n <div class=\"toast\" [ngClass]=\"variant\">\n <riv-icon *ngIf=\"icon\" [name]=\"icon\" [size]=\"16\"></riv-icon>\n <div class=\"content\"><ng-content></ng-content></div>\n </div>\n</div>\n", styles: [".wrapper{position:fixed;top:calc(var(--base-grid-size) * 20);left:50%}.toast{transform:translate(-50%);display:inline-flex;align-items:center;justify-content:center;gap:var(--size-small);padding:var(--size-xsmall) var(--size-large);border-radius:calc(var(--base-grid-size) * 8);box-shadow:var(--depth-1);font:var(--body-medium)}.toast.basic{background-color:var(--surface-dark-0);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--surface-dark-0)}.toast.danger{background-color:var(--danger-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--danger-main)}.toast.safety{background-color:var(--safety-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--safety-main)}.toast.safety-dark{background-color:var(--baja-blast-90);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--baja-blast-90)}.toast.safety-inverse{background-color:var(--surface-light-safety);color:var(--type-light-safety);border:var(--border-width) solid currentColor}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }, { kind: "directive", type: OverlayDirective, selector: "[riv-overlay]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
5046
+ ToastComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ToastComponent, selector: "riv-toast", inputs: { variant: "variant", icon: "icon" }, outputs: { close: "close" }, ngImport: i0, template: "<div *riv-overlay class=\"wrapper\" [attr.data-animation-hook]=\"hook\">\n <div class=\"toast\" [ngClass]=\"variant\">\n <riv-icon *ngIf=\"icon\" [name]=\"icon\" [size]=\"16\"></riv-icon>\n <div class=\"content\"><ng-content></ng-content></div>\n </div>\n</div>\n", styles: [".wrapper{position:fixed;top:calc(var(--base-grid-size) * 20);left:50%;z-index:var(--toast-z-index)}.toast{transform:translate(-50%);display:inline-flex;align-items:center;justify-content:center;gap:var(--size-small);padding:var(--size-xsmall) var(--size-large);border-radius:calc(var(--base-grid-size) * 8);box-shadow:var(--depth-1);font:var(--body-medium)}.toast.basic{background-color:var(--surface-dark-0);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--surface-dark-0)}.toast.danger{background-color:var(--danger-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--danger-main)}.toast.safety{background-color:var(--safety-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--safety-main)}.toast.safety-dark{background-color:var(--baja-blast-90);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--baja-blast-90)}.toast.safety-inverse{background-color:var(--surface-light-safety);color:var(--type-light-safety);border:var(--border-width) solid currentColor}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }, { kind: "directive", type: OverlayDirective, selector: "[riv-overlay]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
5047
5047
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ToastComponent, decorators: [{
5048
5048
  type: Component,
5049
- args: [{ selector: 'riv-toast', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *riv-overlay class=\"wrapper\" [attr.data-animation-hook]=\"hook\">\n <div class=\"toast\" [ngClass]=\"variant\">\n <riv-icon *ngIf=\"icon\" [name]=\"icon\" [size]=\"16\"></riv-icon>\n <div class=\"content\"><ng-content></ng-content></div>\n </div>\n</div>\n", styles: [".wrapper{position:fixed;top:calc(var(--base-grid-size) * 20);left:50%}.toast{transform:translate(-50%);display:inline-flex;align-items:center;justify-content:center;gap:var(--size-small);padding:var(--size-xsmall) var(--size-large);border-radius:calc(var(--base-grid-size) * 8);box-shadow:var(--depth-1);font:var(--body-medium)}.toast.basic{background-color:var(--surface-dark-0);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--surface-dark-0)}.toast.danger{background-color:var(--danger-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--danger-main)}.toast.safety{background-color:var(--safety-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--safety-main)}.toast.safety-dark{background-color:var(--baja-blast-90);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--baja-blast-90)}.toast.safety-inverse{background-color:var(--surface-light-safety);color:var(--type-light-safety);border:var(--border-width) solid currentColor}\n"] }]
5049
+ args: [{ selector: 'riv-toast', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *riv-overlay class=\"wrapper\" [attr.data-animation-hook]=\"hook\">\n <div class=\"toast\" [ngClass]=\"variant\">\n <riv-icon *ngIf=\"icon\" [name]=\"icon\" [size]=\"16\"></riv-icon>\n <div class=\"content\"><ng-content></ng-content></div>\n </div>\n</div>\n", styles: [".wrapper{position:fixed;top:calc(var(--base-grid-size) * 20);left:50%;z-index:var(--toast-z-index)}.toast{transform:translate(-50%);display:inline-flex;align-items:center;justify-content:center;gap:var(--size-small);padding:var(--size-xsmall) var(--size-large);border-radius:calc(var(--base-grid-size) * 8);box-shadow:var(--depth-1);font:var(--body-medium)}.toast.basic{background-color:var(--surface-dark-0);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--surface-dark-0)}.toast.danger{background-color:var(--danger-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--danger-main)}.toast.safety{background-color:var(--safety-main);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--safety-main)}.toast.safety-dark{background-color:var(--baja-blast-90);color:var(--type-dark-high-contrast);border:var(--border-width) solid var(--baja-blast-90)}.toast.safety-inverse{background-color:var(--surface-light-safety);color:var(--type-light-safety);border:var(--border-width) solid currentColor}\n"] }]
5050
5050
  }], propDecorators: { variant: [{
5051
5051
  type: Input
5052
5052
  }], icon: [{