@brickclay-org/ui 0.0.54 → 0.0.55

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,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Component, EventEmitter, HostListener, ViewChildren, Output, Input, Injectable, NgModule, forwardRef, ViewEncapsulation, Optional, Self, Directive, ViewChild, input, model, output, signal, computed, effect, inject, ElementRef, InjectionToken } from '@angular/core';
2
+ import { Component, EventEmitter, HostListener, ViewChildren, Output, Input, Injectable, NgModule, forwardRef, ViewEncapsulation, Optional, Self, Directive, ViewChild, input, model, output, signal, computed, effect, inject, ElementRef, InjectionToken, createComponent } from '@angular/core';
3
3
  import * as i1 from '@angular/common';
4
4
  import { CommonModule, NgClass } from '@angular/common';
5
5
  import * as i1$1 from '@angular/forms';
@@ -6084,10 +6084,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
6084
6084
  // ─── Service ─────────────────────────────────────────────────────────────────
6085
6085
  let _toastId = 0;
6086
6086
  class BkToastrService {
6087
+ appRef;
6088
+ injector;
6087
6089
  _toasts = signal([], ...(ngDevMode ? [{ debugName: "_toasts" }] : []));
6088
6090
  toasts = computed(() => this._toasts(), ...(ngDevMode ? [{ debugName: "toasts" }] : []));
6091
+ _position = signal('top-right', ...(ngDevMode ? [{ debugName: "_position" }] : []));
6092
+ position = computed(() => this._position(), ...(ngDevMode ? [{ debugName: "position" }] : []));
6093
+ componentRef = null;
6094
+ constructor(appRef, injector) {
6095
+ this.appRef = appRef;
6096
+ this.injector = injector;
6097
+ }
6098
+ initializeContainer() {
6099
+ if (this.componentRef)
6100
+ return;
6101
+ // Check if we're in browser environment
6102
+ if (typeof document === 'undefined' || !document.body) {
6103
+ // If document.body doesn't exist yet, wait for it
6104
+ setTimeout(() => this.initializeContainer(), 0);
6105
+ return;
6106
+ }
6107
+ // Create component dynamically
6108
+ this.componentRef = createComponent(BkToastr, {
6109
+ environmentInjector: this.injector,
6110
+ });
6111
+ // Attach to DOM
6112
+ document.body.appendChild(this.componentRef.location.nativeElement);
6113
+ // Register for change detection
6114
+ // Note: We don't call appRef.tick() here to avoid recursive tick calls
6115
+ // Angular will automatically detect changes for the attached view
6116
+ this.appRef.attachView(this.componentRef.hostView);
6117
+ }
6089
6118
  /** Show a toast with full config */
6090
6119
  show(config) {
6120
+ // Initialize container on first toast
6121
+ this.initializeContainer();
6091
6122
  const id = `toast-${++_toastId}`;
6092
6123
  const toast = {
6093
6124
  ...config,
@@ -6146,19 +6177,25 @@ class BkToastrService {
6146
6177
  this._toasts.update(list => list.map(t => ({ ...t, leaving: true })));
6147
6178
  setTimeout(() => this._toasts.set([]), 300);
6148
6179
  }
6149
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BkToastrService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
6180
+ /** Set the position for toast notifications */
6181
+ setPosition(position) {
6182
+ // Initialize container if not already created
6183
+ this.initializeContainer();
6184
+ this._position.set(position);
6185
+ }
6186
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BkToastrService, deps: [{ token: i0.ApplicationRef }, { token: i0.EnvironmentInjector }], target: i0.ɵɵFactoryTarget.Injectable });
6150
6187
  static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BkToastrService, providedIn: 'root' });
6151
6188
  }
6152
6189
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BkToastrService, decorators: [{
6153
6190
  type: Injectable,
6154
6191
  args: [{ providedIn: 'root' }]
6155
- }] });
6192
+ }], ctorParameters: () => [{ type: i0.ApplicationRef }, { type: i0.EnvironmentInjector }] });
6156
6193
 
6157
6194
  class BkToastr {
6158
- position = 'top-right';
6159
6195
  svc = inject(BkToastrService);
6160
6196
  /** Convert signal → Observable so AsyncPipe triggers change detection reliably */
6161
6197
  toasts$ = toObservable(this.svc.toasts);
6198
+ position$ = toObservable(this.svc.position);
6162
6199
  onClose(event, id) {
6163
6200
  event.stopPropagation();
6164
6201
  this.svc.close(id);
@@ -6168,14 +6205,12 @@ class BkToastr {
6168
6205
  t.actionCallback?.();
6169
6206
  }
6170
6207
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BkToastr, deps: [], target: i0.ɵɵFactoryTarget.Component });
6171
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: BkToastr, isStandalone: true, selector: "bk-toastr", inputs: { position: "position" }, ngImport: i0, template: "<!-- Toast Container \u2013 fixed overlay -->\r\n<div class=\"toast-container\" [attr.data-position]=\"position\">\r\n\r\n @for (toast of (toasts$ | async) ?? []; track toast.id) {\r\n <div\r\n class=\"toast-item\"\r\n [attr.data-severity]=\"toast.severity\"\r\n [class.toast-enter]=\"!toast.leaving\"\r\n [class.toast-leave]=\"toast.leaving\">\r\n\r\n <!-- \u2500\u2500 Icon \u2500\u2500 -->\r\n @if (toast.icon) {\r\n <svg class=\"toast-icon shrink-0\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g [attr.clip-path]=\"'url(#clip_' + toast.id + ')'\">\r\n <path\r\n d=\"M10.0001 13.3334V10M10.0001 6.66671H10.0084M18.3334 10C18.3334 5.39767 14.6025 1.66671 10.0001 1.66671C5.39771 1.66671 1.66675 5.39767 1.66675 10C1.66675 14.6024 5.39771 18.3334 10.0001 18.3334C14.6025 18.3334 18.3334 14.6024 18.3334 10Z\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath [attr.id]=\"'clip_' + toast.id\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n }\r\n\r\n <!-- \u2500\u2500 Content \u2500\u2500 -->\r\n <div class=\"flex-1 min-w-0\">\r\n <p class=\"toast-summary\">{{ toast.summary }}</p>\r\n @if (toast.detail) {\r\n <p class=\"toast-detail\">{{ toast.detail }}</p>\r\n }\r\n </div>\r\n\r\n <!-- \u2500\u2500 Action button \u2500\u2500 -->\r\n @if (toast.actionLabel) {\r\n <button type=\"button\" class=\"toast-action\" (click)=\"onAction($event, toast)\">\r\n {{ toast.actionLabel }}\r\n </button>\r\n }\r\n\r\n <!-- \u2500\u2500 Close button \u2500\u2500 -->\r\n <button type=\"button\" class=\"toast-close\" (click)=\"onClose($event, toast.id)\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M10.625 0.625L0.625 10.625M0.625 0.625L10.625 10.625\"\r\n stroke-width=\"1.25\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </button>\r\n\r\n </div>\r\n }\r\n\r\n</div>\r\n", styles: [".toast-container{@apply fixed flex flex-col gap-3 max-w-[100vw-2rem];z-index:2147483647!important;pointer-events:none}.toast-container[data-position=top-right]{@apply top-4 right-4;}.toast-container[data-position=top-left]{@apply top-4 left-4;}.toast-container[data-position=top-center]{@apply top-4 left-1/2 -translate-x-1/2;}.toast-container[data-position=bottom-right]{@apply bottom-4 right-4;}.toast-container[data-position=bottom-left]{@apply bottom-4 left-4;}.toast-container[data-position=bottom-center]{@apply bottom-4 left-1/2 -translate-x-1/2;}.toast-item{@apply flex items-center justify-start gap-3 py-2 px-4 rounded-lg border;box-shadow:0 4px 12px #00000014,0 1px 3px #0000000f;pointer-events:auto}.toast-item[data-severity=info]{@apply bg-[#E5F3FF] border-[#E5F3FF];}.toast-item[data-severity=info] .toast-icon path{stroke:#1434cb}.toast-item[data-severity=info] .toast-summary{@apply text-[#0D227F];}.toast-item[data-severity=info] .toast-action{@apply bg-[#1434CB] text-white border border-[#1434CB];}.toast-item[data-severity=info] .toast-close path{stroke:#2563eb}.toast-item[data-severity=default]{@apply bg-white border-gray-200;}.toast-item[data-severity=default] .toast-icon path{stroke:#6b7080}.toast-item[data-severity=default] .toast-summary{@apply text-[#363C51];}.toast-item[data-severity=default] .toast-action{@apply bg-[#A1A3AE] text-white;}.toast-item[data-severity=default] .toast-close path{stroke:#6b7080}.toast-item[data-severity=error]{@apply bg-[#FFF1F1] border-[#FFF1F1];}.toast-item[data-severity=error] .toast-icon path{stroke:#cb1432}.toast-item[data-severity=error] .toast-summary{@apply text-[#B41E32];}.toast-item[data-severity=error] .toast-action{@apply bg-[#CB1432] text-white;}.toast-item[data-severity=error] .toast-close path{stroke:#cb1432}.toast-item[data-severity=warn]{@apply bg-[#FFEED7] border-[#FFEED7];}.toast-item[data-severity=warn] .toast-icon path{stroke:#f97c00}.toast-item[data-severity=warn] .toast-summary{@apply text-[#A04C02];}.toast-item[data-severity=warn] .toast-action{@apply bg-[#CC6401] text-white;}.toast-item[data-severity=warn] .toast-close path{stroke:#f97c00}.toast-item[data-severity=success]{@apply bg-[#F1FCF3] border-[#F1FCF3];}.toast-item[data-severity=success] .toast-icon path{stroke:#22973f}.toast-item[data-severity=success] .toast-summary{@apply text-[#1E7735];}.toast-item[data-severity=success] .toast-action{@apply bg-[#22973F] text-white;}.toast-item[data-severity=success] .toast-action:hover{@apply bg-green-800;}.toast-item[data-severity=success] .toast-close path{stroke:#22973f}.toast-summary{@apply text-sm font-medium;}.toast-action{@apply shrink-0 py-1 px-2 text-xs font-medium leading-[18px] rounded-lg cursor-pointer border-none transition-colors;pointer-events:auto}.toast-close{@apply shrink-0 p-1 rounded cursor-pointer border-none bg-transparent transition-opacity;pointer-events:auto;position:relative;z-index:1}.toast-close:hover{@apply opacity-60;}.toast-close svg{display:block;pointer-events:none}.toast-close *{cursor:pointer}.toast-enter{animation:toastIn .3s ease-out forwards}.toast-leave{animation:toastOut .3s ease-in forwards}@keyframes toastIn{0%{opacity:0;transform:translateY(-10px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes toastOut{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-10px) scale(.96)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
6208
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: BkToastr, isStandalone: true, selector: "bk-toastr", ngImport: i0, template: "<!-- Toast Container \u2013 fixed overlay -->\r\n<div class=\"toast-container\" [attr.data-position]=\"position$ | async\">\r\n\r\n @for (toast of (toasts$ | async) ?? []; track toast.id) {\r\n <div\r\n class=\"toast-item\"\r\n [attr.data-severity]=\"toast.severity\"\r\n [class.toast-enter]=\"!toast.leaving\"\r\n [class.toast-leave]=\"toast.leaving\">\r\n\r\n <!-- \u2500\u2500 Icon \u2500\u2500 -->\r\n @if (toast.icon) {\r\n <svg class=\"toast-icon shrink-0\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g [attr.clip-path]=\"'url(#clip_' + toast.id + ')'\">\r\n <path\r\n d=\"M10.0001 13.3334V10M10.0001 6.66671H10.0084M18.3334 10C18.3334 5.39767 14.6025 1.66671 10.0001 1.66671C5.39771 1.66671 1.66675 5.39767 1.66675 10C1.66675 14.6024 5.39771 18.3334 10.0001 18.3334C14.6025 18.3334 18.3334 14.6024 18.3334 10Z\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath [attr.id]=\"'clip_' + toast.id\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n }\r\n\r\n <!-- \u2500\u2500 Content \u2500\u2500 -->\r\n <div class=\"flex-1 min-w-0\">\r\n <p class=\"toast-summary\">{{ toast.summary }}</p>\r\n @if (toast.detail) {\r\n <p class=\"toast-detail\">{{ toast.detail }}</p>\r\n }\r\n </div>\r\n\r\n <!-- \u2500\u2500 Action button \u2500\u2500 -->\r\n @if (toast.actionLabel) {\r\n <button type=\"button\" class=\"toast-action\" (click)=\"onAction($event, toast)\">\r\n {{ toast.actionLabel }}\r\n </button>\r\n }\r\n\r\n <!-- \u2500\u2500 Close button \u2500\u2500 -->\r\n <button type=\"button\" class=\"toast-close\" (click)=\"onClose($event, toast.id)\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M10.625 0.625L0.625 10.625M0.625 0.625L10.625 10.625\"\r\n stroke-width=\"1.25\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </button>\r\n\r\n </div>\r\n }\r\n\r\n</div>\r\n", styles: [".toast-container{@apply fixed flex flex-col gap-3 max-w-[100vw-2rem];z-index:2147483647!important;pointer-events:none}.toast-container[data-position=top-right]{@apply top-4 right-4;}.toast-container[data-position=top-left]{@apply top-4 left-4;}.toast-container[data-position=top-center]{@apply top-4 left-1/2 -translate-x-1/2;}.toast-container[data-position=bottom-right]{@apply bottom-4 right-4;}.toast-container[data-position=bottom-left]{@apply bottom-4 left-4;}.toast-container[data-position=bottom-center]{@apply bottom-4 left-1/2 -translate-x-1/2;}.toast-item{@apply flex items-center justify-start gap-3 py-2 px-4 rounded-lg border;box-shadow:0 4px 12px #00000014,0 1px 3px #0000000f;pointer-events:auto}.toast-item[data-severity=info]{@apply bg-[#E5F3FF] border-[#E5F3FF];}.toast-item[data-severity=info] .toast-icon path{stroke:#1434cb}.toast-item[data-severity=info] .toast-summary{@apply text-[#0D227F];}.toast-item[data-severity=info] .toast-action{@apply bg-[#1434CB] text-white border border-[#1434CB];}.toast-item[data-severity=info] .toast-close path{stroke:#2563eb}.toast-item[data-severity=default]{@apply bg-white border-gray-200;}.toast-item[data-severity=default] .toast-icon path{stroke:#6b7080}.toast-item[data-severity=default] .toast-summary{@apply text-[#363C51];}.toast-item[data-severity=default] .toast-action{@apply bg-[#A1A3AE] text-white;}.toast-item[data-severity=default] .toast-close path{stroke:#6b7080}.toast-item[data-severity=error]{@apply bg-[#FFF1F1] border-[#FFF1F1];}.toast-item[data-severity=error] .toast-icon path{stroke:#cb1432}.toast-item[data-severity=error] .toast-summary{@apply text-[#B41E32];}.toast-item[data-severity=error] .toast-action{@apply bg-[#CB1432] text-white;}.toast-item[data-severity=error] .toast-close path{stroke:#cb1432}.toast-item[data-severity=warn]{@apply bg-[#FFEED7] border-[#FFEED7];}.toast-item[data-severity=warn] .toast-icon path{stroke:#f97c00}.toast-item[data-severity=warn] .toast-summary{@apply text-[#A04C02];}.toast-item[data-severity=warn] .toast-action{@apply bg-[#CC6401] text-white;}.toast-item[data-severity=warn] .toast-close path{stroke:#f97c00}.toast-item[data-severity=success]{@apply bg-[#F1FCF3] border-[#F1FCF3];}.toast-item[data-severity=success] .toast-icon path{stroke:#22973f}.toast-item[data-severity=success] .toast-summary{@apply text-[#1E7735];}.toast-item[data-severity=success] .toast-action{@apply bg-[#22973F] text-white;}.toast-item[data-severity=success] .toast-action:hover{@apply bg-green-800;}.toast-item[data-severity=success] .toast-close path{stroke:#22973f}.toast-summary{@apply text-sm font-medium;}.toast-action{@apply shrink-0 py-1 px-2 text-xs font-medium leading-[18px] rounded-lg cursor-pointer border-none transition-colors;pointer-events:auto}.toast-close{@apply shrink-0 p-1 rounded cursor-pointer border-none bg-transparent transition-opacity;pointer-events:auto;position:relative;z-index:1}.toast-close:hover{@apply opacity-60;}.toast-close svg{display:block;pointer-events:none}.toast-close *{cursor:pointer}.toast-enter{animation:toastIn .3s ease-out forwards}.toast-leave{animation:toastOut .3s ease-in forwards}@keyframes toastIn{0%{opacity:0;transform:translateY(-10px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes toastOut{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-10px) scale(.96)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
6172
6209
  }
6173
6210
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BkToastr, decorators: [{
6174
6211
  type: Component,
6175
- args: [{ selector: 'bk-toastr', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<!-- Toast Container \u2013 fixed overlay -->\r\n<div class=\"toast-container\" [attr.data-position]=\"position\">\r\n\r\n @for (toast of (toasts$ | async) ?? []; track toast.id) {\r\n <div\r\n class=\"toast-item\"\r\n [attr.data-severity]=\"toast.severity\"\r\n [class.toast-enter]=\"!toast.leaving\"\r\n [class.toast-leave]=\"toast.leaving\">\r\n\r\n <!-- \u2500\u2500 Icon \u2500\u2500 -->\r\n @if (toast.icon) {\r\n <svg class=\"toast-icon shrink-0\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g [attr.clip-path]=\"'url(#clip_' + toast.id + ')'\">\r\n <path\r\n d=\"M10.0001 13.3334V10M10.0001 6.66671H10.0084M18.3334 10C18.3334 5.39767 14.6025 1.66671 10.0001 1.66671C5.39771 1.66671 1.66675 5.39767 1.66675 10C1.66675 14.6024 5.39771 18.3334 10.0001 18.3334C14.6025 18.3334 18.3334 14.6024 18.3334 10Z\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath [attr.id]=\"'clip_' + toast.id\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n }\r\n\r\n <!-- \u2500\u2500 Content \u2500\u2500 -->\r\n <div class=\"flex-1 min-w-0\">\r\n <p class=\"toast-summary\">{{ toast.summary }}</p>\r\n @if (toast.detail) {\r\n <p class=\"toast-detail\">{{ toast.detail }}</p>\r\n }\r\n </div>\r\n\r\n <!-- \u2500\u2500 Action button \u2500\u2500 -->\r\n @if (toast.actionLabel) {\r\n <button type=\"button\" class=\"toast-action\" (click)=\"onAction($event, toast)\">\r\n {{ toast.actionLabel }}\r\n </button>\r\n }\r\n\r\n <!-- \u2500\u2500 Close button \u2500\u2500 -->\r\n <button type=\"button\" class=\"toast-close\" (click)=\"onClose($event, toast.id)\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M10.625 0.625L0.625 10.625M0.625 0.625L10.625 10.625\"\r\n stroke-width=\"1.25\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </button>\r\n\r\n </div>\r\n }\r\n\r\n</div>\r\n", styles: [".toast-container{@apply fixed flex flex-col gap-3 max-w-[100vw-2rem];z-index:2147483647!important;pointer-events:none}.toast-container[data-position=top-right]{@apply top-4 right-4;}.toast-container[data-position=top-left]{@apply top-4 left-4;}.toast-container[data-position=top-center]{@apply top-4 left-1/2 -translate-x-1/2;}.toast-container[data-position=bottom-right]{@apply bottom-4 right-4;}.toast-container[data-position=bottom-left]{@apply bottom-4 left-4;}.toast-container[data-position=bottom-center]{@apply bottom-4 left-1/2 -translate-x-1/2;}.toast-item{@apply flex items-center justify-start gap-3 py-2 px-4 rounded-lg border;box-shadow:0 4px 12px #00000014,0 1px 3px #0000000f;pointer-events:auto}.toast-item[data-severity=info]{@apply bg-[#E5F3FF] border-[#E5F3FF];}.toast-item[data-severity=info] .toast-icon path{stroke:#1434cb}.toast-item[data-severity=info] .toast-summary{@apply text-[#0D227F];}.toast-item[data-severity=info] .toast-action{@apply bg-[#1434CB] text-white border border-[#1434CB];}.toast-item[data-severity=info] .toast-close path{stroke:#2563eb}.toast-item[data-severity=default]{@apply bg-white border-gray-200;}.toast-item[data-severity=default] .toast-icon path{stroke:#6b7080}.toast-item[data-severity=default] .toast-summary{@apply text-[#363C51];}.toast-item[data-severity=default] .toast-action{@apply bg-[#A1A3AE] text-white;}.toast-item[data-severity=default] .toast-close path{stroke:#6b7080}.toast-item[data-severity=error]{@apply bg-[#FFF1F1] border-[#FFF1F1];}.toast-item[data-severity=error] .toast-icon path{stroke:#cb1432}.toast-item[data-severity=error] .toast-summary{@apply text-[#B41E32];}.toast-item[data-severity=error] .toast-action{@apply bg-[#CB1432] text-white;}.toast-item[data-severity=error] .toast-close path{stroke:#cb1432}.toast-item[data-severity=warn]{@apply bg-[#FFEED7] border-[#FFEED7];}.toast-item[data-severity=warn] .toast-icon path{stroke:#f97c00}.toast-item[data-severity=warn] .toast-summary{@apply text-[#A04C02];}.toast-item[data-severity=warn] .toast-action{@apply bg-[#CC6401] text-white;}.toast-item[data-severity=warn] .toast-close path{stroke:#f97c00}.toast-item[data-severity=success]{@apply bg-[#F1FCF3] border-[#F1FCF3];}.toast-item[data-severity=success] .toast-icon path{stroke:#22973f}.toast-item[data-severity=success] .toast-summary{@apply text-[#1E7735];}.toast-item[data-severity=success] .toast-action{@apply bg-[#22973F] text-white;}.toast-item[data-severity=success] .toast-action:hover{@apply bg-green-800;}.toast-item[data-severity=success] .toast-close path{stroke:#22973f}.toast-summary{@apply text-sm font-medium;}.toast-action{@apply shrink-0 py-1 px-2 text-xs font-medium leading-[18px] rounded-lg cursor-pointer border-none transition-colors;pointer-events:auto}.toast-close{@apply shrink-0 p-1 rounded cursor-pointer border-none bg-transparent transition-opacity;pointer-events:auto;position:relative;z-index:1}.toast-close:hover{@apply opacity-60;}.toast-close svg{display:block;pointer-events:none}.toast-close *{cursor:pointer}.toast-enter{animation:toastIn .3s ease-out forwards}.toast-leave{animation:toastOut .3s ease-in forwards}@keyframes toastIn{0%{opacity:0;transform:translateY(-10px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes toastOut{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-10px) scale(.96)}}\n"] }]
6176
- }], propDecorators: { position: [{
6177
- type: Input
6178
- }] } });
6212
+ args: [{ selector: 'bk-toastr', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<!-- Toast Container \u2013 fixed overlay -->\r\n<div class=\"toast-container\" [attr.data-position]=\"position$ | async\">\r\n\r\n @for (toast of (toasts$ | async) ?? []; track toast.id) {\r\n <div\r\n class=\"toast-item\"\r\n [attr.data-severity]=\"toast.severity\"\r\n [class.toast-enter]=\"!toast.leaving\"\r\n [class.toast-leave]=\"toast.leaving\">\r\n\r\n <!-- \u2500\u2500 Icon \u2500\u2500 -->\r\n @if (toast.icon) {\r\n <svg class=\"toast-icon shrink-0\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g [attr.clip-path]=\"'url(#clip_' + toast.id + ')'\">\r\n <path\r\n d=\"M10.0001 13.3334V10M10.0001 6.66671H10.0084M18.3334 10C18.3334 5.39767 14.6025 1.66671 10.0001 1.66671C5.39771 1.66671 1.66675 5.39767 1.66675 10C1.66675 14.6024 5.39771 18.3334 10.0001 18.3334C14.6025 18.3334 18.3334 14.6024 18.3334 10Z\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath [attr.id]=\"'clip_' + toast.id\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n }\r\n\r\n <!-- \u2500\u2500 Content \u2500\u2500 -->\r\n <div class=\"flex-1 min-w-0\">\r\n <p class=\"toast-summary\">{{ toast.summary }}</p>\r\n @if (toast.detail) {\r\n <p class=\"toast-detail\">{{ toast.detail }}</p>\r\n }\r\n </div>\r\n\r\n <!-- \u2500\u2500 Action button \u2500\u2500 -->\r\n @if (toast.actionLabel) {\r\n <button type=\"button\" class=\"toast-action\" (click)=\"onAction($event, toast)\">\r\n {{ toast.actionLabel }}\r\n </button>\r\n }\r\n\r\n <!-- \u2500\u2500 Close button \u2500\u2500 -->\r\n <button type=\"button\" class=\"toast-close\" (click)=\"onClose($event, toast.id)\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M10.625 0.625L0.625 10.625M0.625 0.625L10.625 10.625\"\r\n stroke-width=\"1.25\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </button>\r\n\r\n </div>\r\n }\r\n\r\n</div>\r\n", styles: [".toast-container{@apply fixed flex flex-col gap-3 max-w-[100vw-2rem];z-index:2147483647!important;pointer-events:none}.toast-container[data-position=top-right]{@apply top-4 right-4;}.toast-container[data-position=top-left]{@apply top-4 left-4;}.toast-container[data-position=top-center]{@apply top-4 left-1/2 -translate-x-1/2;}.toast-container[data-position=bottom-right]{@apply bottom-4 right-4;}.toast-container[data-position=bottom-left]{@apply bottom-4 left-4;}.toast-container[data-position=bottom-center]{@apply bottom-4 left-1/2 -translate-x-1/2;}.toast-item{@apply flex items-center justify-start gap-3 py-2 px-4 rounded-lg border;box-shadow:0 4px 12px #00000014,0 1px 3px #0000000f;pointer-events:auto}.toast-item[data-severity=info]{@apply bg-[#E5F3FF] border-[#E5F3FF];}.toast-item[data-severity=info] .toast-icon path{stroke:#1434cb}.toast-item[data-severity=info] .toast-summary{@apply text-[#0D227F];}.toast-item[data-severity=info] .toast-action{@apply bg-[#1434CB] text-white border border-[#1434CB];}.toast-item[data-severity=info] .toast-close path{stroke:#2563eb}.toast-item[data-severity=default]{@apply bg-white border-gray-200;}.toast-item[data-severity=default] .toast-icon path{stroke:#6b7080}.toast-item[data-severity=default] .toast-summary{@apply text-[#363C51];}.toast-item[data-severity=default] .toast-action{@apply bg-[#A1A3AE] text-white;}.toast-item[data-severity=default] .toast-close path{stroke:#6b7080}.toast-item[data-severity=error]{@apply bg-[#FFF1F1] border-[#FFF1F1];}.toast-item[data-severity=error] .toast-icon path{stroke:#cb1432}.toast-item[data-severity=error] .toast-summary{@apply text-[#B41E32];}.toast-item[data-severity=error] .toast-action{@apply bg-[#CB1432] text-white;}.toast-item[data-severity=error] .toast-close path{stroke:#cb1432}.toast-item[data-severity=warn]{@apply bg-[#FFEED7] border-[#FFEED7];}.toast-item[data-severity=warn] .toast-icon path{stroke:#f97c00}.toast-item[data-severity=warn] .toast-summary{@apply text-[#A04C02];}.toast-item[data-severity=warn] .toast-action{@apply bg-[#CC6401] text-white;}.toast-item[data-severity=warn] .toast-close path{stroke:#f97c00}.toast-item[data-severity=success]{@apply bg-[#F1FCF3] border-[#F1FCF3];}.toast-item[data-severity=success] .toast-icon path{stroke:#22973f}.toast-item[data-severity=success] .toast-summary{@apply text-[#1E7735];}.toast-item[data-severity=success] .toast-action{@apply bg-[#22973F] text-white;}.toast-item[data-severity=success] .toast-action:hover{@apply bg-green-800;}.toast-item[data-severity=success] .toast-close path{stroke:#22973f}.toast-summary{@apply text-sm font-medium;}.toast-action{@apply shrink-0 py-1 px-2 text-xs font-medium leading-[18px] rounded-lg cursor-pointer border-none transition-colors;pointer-events:auto}.toast-close{@apply shrink-0 p-1 rounded cursor-pointer border-none bg-transparent transition-opacity;pointer-events:auto;position:relative;z-index:1}.toast-close:hover{@apply opacity-60;}.toast-close svg{display:block;pointer-events:none}.toast-close *{cursor:pointer}.toast-enter{animation:toastIn .3s ease-out forwards}.toast-leave{animation:toastOut .3s ease-in forwards}@keyframes toastIn{0%{opacity:0;transform:translateY(-10px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes toastOut{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-10px) scale(.96)}}\n"] }]
6213
+ }] });
6179
6214
 
6180
6215
  /*
6181
6216
  * Public API Surface of brickclay-lib