@breadstone/mosaik-elements-angular 0.1.30 → 0.1.32

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.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,13 @@
1
+ ## 0.1.32 (2026-06-25)
2
+
3
+ This was a version bump only for mosaik-elements-angular to align it with other projects, there were no code changes.
4
+
5
+ ## 0.1.31 (2026-06-24)
6
+
7
+ ### 🚀 Features
8
+
9
+ - **toast:** enhance toast component with icon and appearance variants ([e5fe7d2071](https://github.com/RueDeRennes/mosaik/commit/e5fe7d2071))
10
+
1
11
  ## 0.1.30 (2026-06-24)
2
12
 
3
13
  This was a version bump only for mosaik-elements-angular to align it with other projects, there were no code changes.
@@ -9472,7 +9472,7 @@ class IconNameDirective {
9472
9472
  }
9473
9473
  }
9474
9474
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IconNameDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
9475
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: IconNameDirective, isStandalone: true, selector: "\n mosaik-icon[iconName],\n mosaik-banner[iconName],\n mosaik-expander[iconName],\n mosaik-titlebar[iconName],\n mosaik-choice[iconName],\n mosaik-select-item[iconName],\n mosaik-avatar[iconName],\n mosaik-badge[iconName],\n mosaik-chat-marker[iconName],\n mosaik-chat-message-avatar[iconName],\n mosaik-chip[iconName],\n mosaik-sheet[iconName],\n mosaik-message-box[iconName],\n mosaik-ribbon[iconName],\n mosaik-combo-item[iconName],\n mosaik-menu-item[iconName],\n mosaik-segment-item[iconName],\n mosaik-empty-state[iconName],\n mosaik-error-state[iconName],\n mosaik-success-state[iconName],\n mosaik-button[iconName],\n mosaik-compound-button[iconName],\n mosaik-dropdown-button[iconName],\n mosaik-fab[iconName],\n mosaik-fab-group[iconName],\n mosaik-repeat-button[iconName],\n mosaik-split-button[iconName],\n mosaik-toggle-button[iconName],\n mosaik-tab-item[iconName],\n mosaik-tab-strip-item[iconName],\n ", inputs: { iconName: "iconName" }, usesOnChanges: true, ngImport: i0 });
9475
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: IconNameDirective, isStandalone: true, selector: "\n mosaik-icon[iconName],\n mosaik-banner[iconName],\n mosaik-expander[iconName],\n mosaik-titlebar[iconName],\n mosaik-choice[iconName],\n mosaik-select-item[iconName],\n mosaik-avatar[iconName],\n mosaik-badge[iconName],\n mosaik-chat-marker[iconName],\n mosaik-chat-message-avatar[iconName],\n mosaik-chip[iconName],\n mosaik-sheet[iconName],\n mosaik-message-box[iconName],\n mosaik-ribbon[iconName],\n mosaik-combo-item[iconName],\n mosaik-menu-item[iconName],\n mosaik-segment-item[iconName],\n mosaik-empty-state[iconName],\n mosaik-error-state[iconName],\n mosaik-success-state[iconName],\n mosaik-button[iconName],\n mosaik-compound-button[iconName],\n mosaik-dropdown-button[iconName],\n mosaik-fab[iconName],\n mosaik-fab-group[iconName],\n mosaik-repeat-button[iconName],\n mosaik-split-button[iconName],\n mosaik-toggle-button[iconName],\n mosaik-tab-item[iconName],\n mosaik-tab-strip-item[iconName],\n mosaik-toast[iconName],\n ", inputs: { iconName: "iconName" }, usesOnChanges: true, ngImport: i0 });
9476
9476
  }
9477
9477
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IconNameDirective, decorators: [{
9478
9478
  type: Directive,
@@ -9508,6 +9508,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
9508
9508
  mosaik-toggle-button[iconName],
9509
9509
  mosaik-tab-item[iconName],
9510
9510
  mosaik-tab-strip-item[iconName],
9511
+ mosaik-toast[iconName],
9511
9512
  `
9512
9513
  }]
9513
9514
  }], ctorParameters: () => [], propDecorators: { iconName: [{
@@ -18922,6 +18923,20 @@ let ToastComponent = class ToastComponent {
18922
18923
  */
18923
18924
  content = input(/* @ts-ignore */
18924
18925
  ...(ngDevMode ? [undefined, { debugName: "content" }] : /* istanbul ignore next */ []));
18926
+ /**
18927
+ * Signal input for the `icon` property.
18928
+ *
18929
+ * @public
18930
+ */
18931
+ icon = input(/* @ts-ignore */
18932
+ ...(ngDevMode ? [undefined, { debugName: "icon" }] : /* istanbul ignore next */ []));
18933
+ /**
18934
+ * Signal input for the `iconSize` property.
18935
+ *
18936
+ * @public
18937
+ */
18938
+ iconSize = input(/* @ts-ignore */
18939
+ ...(ngDevMode ? [undefined, { debugName: "iconSize" }] : /* istanbul ignore next */ []));
18925
18940
  /**
18926
18941
  * Signal input for the `timeout` property.
18927
18942
  *
@@ -18978,6 +18993,13 @@ let ToastComponent = class ToastComponent {
18978
18993
  */
18979
18994
  variant = input(/* @ts-ignore */
18980
18995
  ...(ngDevMode ? [undefined, { debugName: "variant" }] : /* istanbul ignore next */ []));
18996
+ /**
18997
+ * Signal input for the `appearance` property.
18998
+ *
18999
+ * @public
19000
+ */
19001
+ appearance = input(/* @ts-ignore */
19002
+ ...(ngDevMode ? [undefined, { debugName: "appearance" }] : /* istanbul ignore next */ []));
18981
19003
  /**
18982
19004
  * Signal input for the `formatter` property.
18983
19005
  *
@@ -19058,6 +19080,14 @@ let ToastComponent = class ToastComponent {
19058
19080
  if (contentValue !== undefined) {
19059
19081
  this._elementRef.nativeElement.content = contentValue;
19060
19082
  }
19083
+ const iconValue = this.icon();
19084
+ if (iconValue !== undefined) {
19085
+ this._elementRef.nativeElement.icon = iconValue;
19086
+ }
19087
+ const iconSizeValue = this.iconSize();
19088
+ if (iconSizeValue !== undefined) {
19089
+ this._elementRef.nativeElement.iconSize = iconSizeValue;
19090
+ }
19061
19091
  const timeoutValue = this.timeout();
19062
19092
  if (timeoutValue !== undefined) {
19063
19093
  this._elementRef.nativeElement.timeout = timeoutValue;
@@ -19086,6 +19116,10 @@ let ToastComponent = class ToastComponent {
19086
19116
  if (variantValue !== undefined) {
19087
19117
  this._elementRef.nativeElement.variant = variantValue;
19088
19118
  }
19119
+ const appearanceValue = this.appearance();
19120
+ if (appearanceValue !== undefined) {
19121
+ this._elementRef.nativeElement.appearance = appearanceValue;
19122
+ }
19089
19123
  const formatterValue = this.formatter();
19090
19124
  if (formatterValue !== undefined) {
19091
19125
  this._elementRef.nativeElement.formatter = formatterValue;
@@ -19182,12 +19216,12 @@ let ToastComponent = class ToastComponent {
19182
19216
  this._elementRef.nativeElement[property] = value;
19183
19217
  }
19184
19218
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
19185
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.2", type: ToastComponent, isStandalone: true, selector: "mosaik-toast", inputs: { header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, timeout: { classPropertyName: "timeout", publicName: "timeout", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, showProgress: { classPropertyName: "showProgress", publicName: "showProgress", isSignal: true, isRequired: false, transformFunction: null }, themeName: { classPropertyName: "themeName", publicName: "themeName", isSignal: true, isRequired: false, transformFunction: null }, animationTarget: { classPropertyName: "animationTarget", publicName: "animationTarget", isSignal: true, isRequired: false, transformFunction: null }, enter: { classPropertyName: "enter", publicName: "enter", isSignal: true, isRequired: false, transformFunction: null }, exit: { classPropertyName: "exit", publicName: "exit", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, formatter: { classPropertyName: "formatter", publicName: "formatter", isSignal: true, isRequired: false, transformFunction: null }, isBusy: { classPropertyName: "isBusy", publicName: "isBusy", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, hasBackdrop: { classPropertyName: "hasBackdrop", publicName: "hasBackdrop", isSignal: true, isRequired: false, transformFunction: null }, pressEscapeToClose: { classPropertyName: "pressEscapeToClose", publicName: "pressEscapeToClose", isSignal: true, isRequired: false, transformFunction: null }, clickOutsideToClose: { classPropertyName: "clickOutsideToClose", publicName: "clickOutsideToClose", isSignal: true, isRequired: false, transformFunction: null }, closeable: { classPropertyName: "closeable", publicName: "closeable", isSignal: true, isRequired: false, transformFunction: null }, dir: { classPropertyName: "dir", publicName: "dir", isSignal: true, isRequired: false, transformFunction: null }, lang: { classPropertyName: "lang", publicName: "lang", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opened: "opened", closed: "closed", connected: "connected", disconnected: "disconnected", changed: "changed" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
19219
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.2", type: ToastComponent, isStandalone: true, selector: "mosaik-toast", inputs: { header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, timeout: { classPropertyName: "timeout", publicName: "timeout", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, showProgress: { classPropertyName: "showProgress", publicName: "showProgress", isSignal: true, isRequired: false, transformFunction: null }, themeName: { classPropertyName: "themeName", publicName: "themeName", isSignal: true, isRequired: false, transformFunction: null }, animationTarget: { classPropertyName: "animationTarget", publicName: "animationTarget", isSignal: true, isRequired: false, transformFunction: null }, enter: { classPropertyName: "enter", publicName: "enter", isSignal: true, isRequired: false, transformFunction: null }, exit: { classPropertyName: "exit", publicName: "exit", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, formatter: { classPropertyName: "formatter", publicName: "formatter", isSignal: true, isRequired: false, transformFunction: null }, isBusy: { classPropertyName: "isBusy", publicName: "isBusy", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, hasBackdrop: { classPropertyName: "hasBackdrop", publicName: "hasBackdrop", isSignal: true, isRequired: false, transformFunction: null }, pressEscapeToClose: { classPropertyName: "pressEscapeToClose", publicName: "pressEscapeToClose", isSignal: true, isRequired: false, transformFunction: null }, clickOutsideToClose: { classPropertyName: "clickOutsideToClose", publicName: "clickOutsideToClose", isSignal: true, isRequired: false, transformFunction: null }, closeable: { classPropertyName: "closeable", publicName: "closeable", isSignal: true, isRequired: false, transformFunction: null }, dir: { classPropertyName: "dir", publicName: "dir", isSignal: true, isRequired: false, transformFunction: null }, lang: { classPropertyName: "lang", publicName: "lang", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opened: "opened", closed: "closed", connected: "connected", disconnected: "disconnected", changed: "changed" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
19186
19220
  };
19187
19221
  ToastComponent = __decorate$49([
19188
19222
  ProxyCmp({
19189
19223
  defineCustomElementFn: () => defineCustomElement('mosaik-toast', ToastElement),
19190
- inputs: ['header', 'content', 'timeout', 'position', 'showProgress', 'themeName', 'animationTarget', 'enter', 'exit', 'variant', 'formatter', 'isBusy', 'isOpen', 'hasBackdrop', 'pressEscapeToClose', 'clickOutsideToClose', 'closeable', 'dir', 'lang'],
19224
+ inputs: ['header', 'content', 'icon', 'iconSize', 'timeout', 'position', 'showProgress', 'themeName', 'animationTarget', 'enter', 'exit', 'variant', 'appearance', 'formatter', 'isBusy', 'isOpen', 'hasBackdrop', 'pressEscapeToClose', 'clickOutsideToClose', 'closeable', 'dir', 'lang'],
19191
19225
  methods: ['close', 'play', 'onEnterAnimation', 'onExitAnimation', 'open']
19192
19226
  }),
19193
19227
  __metadata$49("design:paramtypes", [])
@@ -19200,7 +19234,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
19200
19234
  changeDetection: ChangeDetectionStrategy.OnPush,
19201
19235
  template: '<ng-content></ng-content>'
19202
19236
  }]
19203
- }], ctorParameters: () => [], propDecorators: { header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], timeout: [{ type: i0.Input, args: [{ isSignal: true, alias: "timeout", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], showProgress: [{ type: i0.Input, args: [{ isSignal: true, alias: "showProgress", required: false }] }], themeName: [{ type: i0.Input, args: [{ isSignal: true, alias: "themeName", required: false }] }], animationTarget: [{ type: i0.Input, args: [{ isSignal: true, alias: "animationTarget", required: false }] }], enter: [{ type: i0.Input, args: [{ isSignal: true, alias: "enter", required: false }] }], exit: [{ type: i0.Input, args: [{ isSignal: true, alias: "exit", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], formatter: [{ type: i0.Input, args: [{ isSignal: true, alias: "formatter", required: false }] }], isBusy: [{ type: i0.Input, args: [{ isSignal: true, alias: "isBusy", required: false }] }], isOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOpen", required: false }] }], hasBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasBackdrop", required: false }] }], pressEscapeToClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "pressEscapeToClose", required: false }] }], clickOutsideToClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickOutsideToClose", required: false }] }], closeable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeable", required: false }] }], dir: [{ type: i0.Input, args: [{ isSignal: true, alias: "dir", required: false }] }], lang: [{ type: i0.Input, args: [{ isSignal: true, alias: "lang", required: false }] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], connected: [{ type: i0.Output, args: ["connected"] }], disconnected: [{ type: i0.Output, args: ["disconnected"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
19237
+ }], ctorParameters: () => [], propDecorators: { header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconSize", required: false }] }], timeout: [{ type: i0.Input, args: [{ isSignal: true, alias: "timeout", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], showProgress: [{ type: i0.Input, args: [{ isSignal: true, alias: "showProgress", required: false }] }], themeName: [{ type: i0.Input, args: [{ isSignal: true, alias: "themeName", required: false }] }], animationTarget: [{ type: i0.Input, args: [{ isSignal: true, alias: "animationTarget", required: false }] }], enter: [{ type: i0.Input, args: [{ isSignal: true, alias: "enter", required: false }] }], exit: [{ type: i0.Input, args: [{ isSignal: true, alias: "exit", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], formatter: [{ type: i0.Input, args: [{ isSignal: true, alias: "formatter", required: false }] }], isBusy: [{ type: i0.Input, args: [{ isSignal: true, alias: "isBusy", required: false }] }], isOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOpen", required: false }] }], hasBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasBackdrop", required: false }] }], pressEscapeToClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "pressEscapeToClose", required: false }] }], clickOutsideToClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickOutsideToClose", required: false }] }], closeable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeable", required: false }] }], dir: [{ type: i0.Input, args: [{ isSignal: true, alias: "dir", required: false }] }], lang: [{ type: i0.Input, args: [{ isSignal: true, alias: "lang", required: false }] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], connected: [{ type: i0.Output, args: ["connected"] }], disconnected: [{ type: i0.Output, args: ["disconnected"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
19204
19238
  /**
19205
19239
  * @public
19206
19240
  */
@@ -19336,10 +19370,23 @@ class ToastPortalComponent extends PortalComponent$1 {
19336
19370
  get actionsTemplate() {
19337
19371
  return this._slots.actions();
19338
19372
  }
19373
+ // #endregion
19374
+ // #region Methods
19375
+ /**
19376
+ * Handles an action button click.
19377
+ * Executes the action handler and closes the toast.
19378
+ *
19379
+ * @protected
19380
+ * @param handler - The action handler to execute.
19381
+ */
19382
+ onActionClick(handler) {
19383
+ handler?.();
19384
+ this._component.invoke('close');
19385
+ }
19339
19386
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: ToastPortalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
19340
19387
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: ToastPortalComponent, isStandalone: true, selector: "mosaik-toast-portal", host: { classAttribute: "toast-portal" }, providers: [
19341
19388
  provideToastSlots()
19342
- ], viewQueries: [{ propertyName: "_portal", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }, { propertyName: "_component", first: true, predicate: ToastComponent, descendants: true, static: true }], exportAs: ["mosaikToastPortal"], usesInheritance: true, ngImport: i0, template: "<mosaik-toast [variant]=\"this.config?.variant ?? 'default'\"\n [closeable]=\"this.config?.closeable ?? false\"\n [enter]=\"this.config?.enter ?? null\"\n [exit]=\"this.config?.exit ?? null\">\n <ng-template cdkPortalOutlet></ng-template>\n @if (this.actionsTemplate) {\n <ng-container [ngTemplateOutlet]=\"this.actionsTemplate\" />\n } @else if (this.config?.actions) {\n <mosaik-toast-actions>\n @for (action of this.config?.actions; track action.label) {\n @if ((action?.visible | of | async) ?? true) {\n <mosaik-button [appearance]=\"action?.kind === 'primary' ? 'solid' : 'plain'\"\n [label]=\"(action?.label | of | async) ?? ''\"\n [disabled]=\"(action?.disabled | of | async) ?? false\"\n [variant]=\"'primary'\"\n (click)=\"action?.handler()\" />\n }\n }\n </mosaik-toast-actions>\n }\n</mosaik-toast>", styles: [".cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--joy-scheme-semi-transparent);--backdrop-blur: 4px;--backdrop-transition-duration: var(--mosaik-duration-short);--backdrop-transition-mode: ease;--backdrop-transition-property: opacity, backdrop-filter;background:var(--backdrop-background-color);-webkit-backdrop-filter:blur(var(--backdrop-blur));backdrop-filter:blur(var(--backdrop-blur));opacity:1;transition-duration:var(--backdrop-transition-duration);transition-timing-function:var(--backdrop-transition-mode);transition-property:var(--backdrop-transition-property)}:root[theme=joy] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--joy-scheme-semi-transparent);--backdrop-blur: 4px;--backdrop-transition-duration: var(--mosaik-duration-short);--backdrop-transition-mode: ease;--backdrop-transition-property: opacity, backdrop-filter}:root[theme=memphis] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--memphis-scheme-semi-transparent);--backdrop-blur: none;--backdrop-transition-duration: .2s;--backdrop-transition-mode: ease;--backdrop-transition-property: opacity}:root[theme=cosmopolitan] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--cosmopolitan-scheme-semi-transparent);--backdrop-blur: none;--backdrop-transition-duration: .2s;--backdrop-transition-mode: ease;--backdrop-transition-property: opacity}@media screen and (prefers-reduced-motion:reduce){.cdk-overlay-backdrop.mosaik-cdk-backdrop{transition-duration:.01ms}}.cdk-overlay-pane.mosaik-cdk-overlay-pane{pointer-events:none}.mosaik-cdk-overlay-pane mosaik-dialog::part(backdrop),.mosaik-cdk-overlay-pane mosaik-drawer::part(backdrop),.mosaik-cdk-overlay-pane mosaik-message-box::part(backdrop),.mosaik-cdk-overlay-pane mosaik-sheet::part(backdrop),.mosaik-cdk-overlay-pane mosaik-toast::part(backdrop){opacity:0;pointer-events:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: ToastComponent, selector: "mosaik-toast", inputs: ["header", "content", "timeout", "position", "showProgress", "themeName", "animationTarget", "enter", "exit", "variant", "formatter", "isBusy", "isOpen", "hasBackdrop", "pressEscapeToClose", "clickOutsideToClose", "closeable", "dir", "lang"], outputs: ["opened", "closed", "connected", "disconnected", "changed"] }, { kind: "component", type: ToastActionsComponent, selector: "mosaik-toast-actions", inputs: ["themeName", "dir", "lang"], outputs: ["connected", "disconnected", "changed"] }, { kind: "component", type: ButtonComponent, selector: "mosaik-button", inputs: ["download", "href", "rel", "target", "themeName", "reverse", "orientation", "horizontalContentAlignment", "verticalContentAlignment", "fit", "isBusy", "label", "icon", "iconPosition", "iconSize", "type", "ripple", "variant", "appearance", "size", "value", "disabled", "isFocused", "dir", "lang"], outputs: ["connected", "disconnected", "changed"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: OfPipe, name: "of" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
19389
+ ], viewQueries: [{ propertyName: "_portal", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }, { propertyName: "_component", first: true, predicate: ToastComponent, descendants: true, static: true }], exportAs: ["mosaikToastPortal"], usesInheritance: true, ngImport: i0, template: "<mosaik-toast [variant]=\"this.config?.variant ?? 'default'\"\n [appearance]=\"this.config?.appearance ?? 'default'\"\n [closeable]=\"this.config?.closeable ?? false\"\n [enter]=\"this.config?.enter ?? null\"\n [exit]=\"this.config?.exit ?? null\"\n [iconName]=\"(this.config?.iconName | of | async) ?? undefined\">\n <ng-template cdkPortalOutlet></ng-template>\n @if (this.actionsTemplate) {\n <ng-container [ngTemplateOutlet]=\"this.actionsTemplate\" />\n } @else if (this.config?.actions) {\n <mosaik-toast-actions>\n @for (action of this.config.actions; track action.label) {\n @if ((action?.visible | of | async) ?? true) {\n <mosaik-button [appearance]=\"action?.kind === 'primary' ? 'solid' : 'plain'\"\n [label]=\"(action?.label | of | async) ?? ''\"\n [disabled]=\"(action?.disabled | of | async) ?? false\"\n [variant]=\"'primary'\"\n (click)=\"onActionClick(action?.handler)\" />\n }\n }\n </mosaik-toast-actions>\n }\n</mosaik-toast>", styles: [".cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--joy-scheme-semi-transparent);--backdrop-blur: 4px;--backdrop-transition-duration: var(--mosaik-duration-short);--backdrop-transition-mode: ease;--backdrop-transition-property: opacity, backdrop-filter;background:var(--backdrop-background-color);-webkit-backdrop-filter:blur(var(--backdrop-blur));backdrop-filter:blur(var(--backdrop-blur));opacity:1;transition-duration:var(--backdrop-transition-duration);transition-timing-function:var(--backdrop-transition-mode);transition-property:var(--backdrop-transition-property)}:root[theme=joy] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--joy-scheme-semi-transparent);--backdrop-blur: 4px;--backdrop-transition-duration: var(--mosaik-duration-short);--backdrop-transition-mode: ease;--backdrop-transition-property: opacity, backdrop-filter}:root[theme=memphis] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--memphis-scheme-semi-transparent);--backdrop-blur: none;--backdrop-transition-duration: .2s;--backdrop-transition-mode: ease;--backdrop-transition-property: opacity}:root[theme=cosmopolitan] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--cosmopolitan-scheme-semi-transparent);--backdrop-blur: none;--backdrop-transition-duration: .2s;--backdrop-transition-mode: ease;--backdrop-transition-property: opacity}@media screen and (prefers-reduced-motion:reduce){.cdk-overlay-backdrop.mosaik-cdk-backdrop{transition-duration:.01ms}}.cdk-overlay-pane.mosaik-cdk-overlay-pane{pointer-events:none}.mosaik-cdk-overlay-pane mosaik-dialog::part(backdrop),.mosaik-cdk-overlay-pane mosaik-drawer::part(backdrop),.mosaik-cdk-overlay-pane mosaik-message-box::part(backdrop),.mosaik-cdk-overlay-pane mosaik-sheet::part(backdrop),.mosaik-cdk-overlay-pane mosaik-toast::part(backdrop){opacity:0;pointer-events:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: ToastComponent, selector: "mosaik-toast", inputs: ["header", "content", "icon", "iconSize", "timeout", "position", "showProgress", "themeName", "animationTarget", "enter", "exit", "variant", "appearance", "formatter", "isBusy", "isOpen", "hasBackdrop", "pressEscapeToClose", "clickOutsideToClose", "closeable", "dir", "lang"], outputs: ["opened", "closed", "connected", "disconnected", "changed"] }, { kind: "component", type: ToastActionsComponent, selector: "mosaik-toast-actions", inputs: ["themeName", "dir", "lang"], outputs: ["connected", "disconnected", "changed"] }, { kind: "component", type: ButtonComponent, selector: "mosaik-button", inputs: ["download", "href", "rel", "target", "themeName", "reverse", "orientation", "horizontalContentAlignment", "verticalContentAlignment", "fit", "isBusy", "label", "icon", "iconPosition", "iconSize", "type", "ripple", "variant", "appearance", "size", "value", "disabled", "isFocused", "dir", "lang"], outputs: ["connected", "disconnected", "changed"] }, { kind: "directive", type: IconNameDirective, selector: "\n mosaik-icon[iconName],\n mosaik-banner[iconName],\n mosaik-expander[iconName],\n mosaik-titlebar[iconName],\n mosaik-choice[iconName],\n mosaik-select-item[iconName],\n mosaik-avatar[iconName],\n mosaik-badge[iconName],\n mosaik-chat-marker[iconName],\n mosaik-chat-message-avatar[iconName],\n mosaik-chip[iconName],\n mosaik-sheet[iconName],\n mosaik-message-box[iconName],\n mosaik-ribbon[iconName],\n mosaik-combo-item[iconName],\n mosaik-menu-item[iconName],\n mosaik-segment-item[iconName],\n mosaik-empty-state[iconName],\n mosaik-error-state[iconName],\n mosaik-success-state[iconName],\n mosaik-button[iconName],\n mosaik-compound-button[iconName],\n mosaik-dropdown-button[iconName],\n mosaik-fab[iconName],\n mosaik-fab-group[iconName],\n mosaik-repeat-button[iconName],\n mosaik-split-button[iconName],\n mosaik-toggle-button[iconName],\n mosaik-tab-item[iconName],\n mosaik-tab-strip-item[iconName],\n mosaik-toast[iconName],\n ", inputs: ["iconName"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: OfPipe, name: "of" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
19343
19390
  }
19344
19391
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: ToastPortalComponent, decorators: [{
19345
19392
  type: Component,
@@ -19354,8 +19401,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
19354
19401
  CdkPortalOutlet,
19355
19402
  ToastComponent,
19356
19403
  ToastActionsComponent,
19357
- ButtonComponent
19358
- ], template: "<mosaik-toast [variant]=\"this.config?.variant ?? 'default'\"\n [closeable]=\"this.config?.closeable ?? false\"\n [enter]=\"this.config?.enter ?? null\"\n [exit]=\"this.config?.exit ?? null\">\n <ng-template cdkPortalOutlet></ng-template>\n @if (this.actionsTemplate) {\n <ng-container [ngTemplateOutlet]=\"this.actionsTemplate\" />\n } @else if (this.config?.actions) {\n <mosaik-toast-actions>\n @for (action of this.config?.actions; track action.label) {\n @if ((action?.visible | of | async) ?? true) {\n <mosaik-button [appearance]=\"action?.kind === 'primary' ? 'solid' : 'plain'\"\n [label]=\"(action?.label | of | async) ?? ''\"\n [disabled]=\"(action?.disabled | of | async) ?? false\"\n [variant]=\"'primary'\"\n (click)=\"action?.handler()\" />\n }\n }\n </mosaik-toast-actions>\n }\n</mosaik-toast>", styles: [".cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--joy-scheme-semi-transparent);--backdrop-blur: 4px;--backdrop-transition-duration: var(--mosaik-duration-short);--backdrop-transition-mode: ease;--backdrop-transition-property: opacity, backdrop-filter;background:var(--backdrop-background-color);-webkit-backdrop-filter:blur(var(--backdrop-blur));backdrop-filter:blur(var(--backdrop-blur));opacity:1;transition-duration:var(--backdrop-transition-duration);transition-timing-function:var(--backdrop-transition-mode);transition-property:var(--backdrop-transition-property)}:root[theme=joy] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--joy-scheme-semi-transparent);--backdrop-blur: 4px;--backdrop-transition-duration: var(--mosaik-duration-short);--backdrop-transition-mode: ease;--backdrop-transition-property: opacity, backdrop-filter}:root[theme=memphis] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--memphis-scheme-semi-transparent);--backdrop-blur: none;--backdrop-transition-duration: .2s;--backdrop-transition-mode: ease;--backdrop-transition-property: opacity}:root[theme=cosmopolitan] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--cosmopolitan-scheme-semi-transparent);--backdrop-blur: none;--backdrop-transition-duration: .2s;--backdrop-transition-mode: ease;--backdrop-transition-property: opacity}@media screen and (prefers-reduced-motion:reduce){.cdk-overlay-backdrop.mosaik-cdk-backdrop{transition-duration:.01ms}}.cdk-overlay-pane.mosaik-cdk-overlay-pane{pointer-events:none}.mosaik-cdk-overlay-pane mosaik-dialog::part(backdrop),.mosaik-cdk-overlay-pane mosaik-drawer::part(backdrop),.mosaik-cdk-overlay-pane mosaik-message-box::part(backdrop),.mosaik-cdk-overlay-pane mosaik-sheet::part(backdrop),.mosaik-cdk-overlay-pane mosaik-toast::part(backdrop){opacity:0;pointer-events:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}\n"] }]
19404
+ ButtonComponent,
19405
+ IconNameDirective
19406
+ ], template: "<mosaik-toast [variant]=\"this.config?.variant ?? 'default'\"\n [appearance]=\"this.config?.appearance ?? 'default'\"\n [closeable]=\"this.config?.closeable ?? false\"\n [enter]=\"this.config?.enter ?? null\"\n [exit]=\"this.config?.exit ?? null\"\n [iconName]=\"(this.config?.iconName | of | async) ?? undefined\">\n <ng-template cdkPortalOutlet></ng-template>\n @if (this.actionsTemplate) {\n <ng-container [ngTemplateOutlet]=\"this.actionsTemplate\" />\n } @else if (this.config?.actions) {\n <mosaik-toast-actions>\n @for (action of this.config.actions; track action.label) {\n @if ((action?.visible | of | async) ?? true) {\n <mosaik-button [appearance]=\"action?.kind === 'primary' ? 'solid' : 'plain'\"\n [label]=\"(action?.label | of | async) ?? ''\"\n [disabled]=\"(action?.disabled | of | async) ?? false\"\n [variant]=\"'primary'\"\n (click)=\"onActionClick(action?.handler)\" />\n }\n }\n </mosaik-toast-actions>\n }\n</mosaik-toast>", styles: [".cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--joy-scheme-semi-transparent);--backdrop-blur: 4px;--backdrop-transition-duration: var(--mosaik-duration-short);--backdrop-transition-mode: ease;--backdrop-transition-property: opacity, backdrop-filter;background:var(--backdrop-background-color);-webkit-backdrop-filter:blur(var(--backdrop-blur));backdrop-filter:blur(var(--backdrop-blur));opacity:1;transition-duration:var(--backdrop-transition-duration);transition-timing-function:var(--backdrop-transition-mode);transition-property:var(--backdrop-transition-property)}:root[theme=joy] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--joy-scheme-semi-transparent);--backdrop-blur: 4px;--backdrop-transition-duration: var(--mosaik-duration-short);--backdrop-transition-mode: ease;--backdrop-transition-property: opacity, backdrop-filter}:root[theme=memphis] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--memphis-scheme-semi-transparent);--backdrop-blur: none;--backdrop-transition-duration: .2s;--backdrop-transition-mode: ease;--backdrop-transition-property: opacity}:root[theme=cosmopolitan] .cdk-overlay-backdrop.mosaik-cdk-backdrop{--backdrop-background-color: var(--cosmopolitan-scheme-semi-transparent);--backdrop-blur: none;--backdrop-transition-duration: .2s;--backdrop-transition-mode: ease;--backdrop-transition-property: opacity}@media screen and (prefers-reduced-motion:reduce){.cdk-overlay-backdrop.mosaik-cdk-backdrop{transition-duration:.01ms}}.cdk-overlay-pane.mosaik-cdk-overlay-pane{pointer-events:none}.mosaik-cdk-overlay-pane mosaik-dialog::part(backdrop),.mosaik-cdk-overlay-pane mosaik-drawer::part(backdrop),.mosaik-cdk-overlay-pane mosaik-message-box::part(backdrop),.mosaik-cdk-overlay-pane mosaik-sheet::part(backdrop),.mosaik-cdk-overlay-pane mosaik-toast::part(backdrop){opacity:0;pointer-events:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}\n"] }]
19359
19407
  }], ctorParameters: () => [], propDecorators: { _portal: [{
19360
19408
  type: ViewChild,
19361
19409
  args: [CdkPortalOutlet, { static: true }]