@breadstone/mosaik-elements-angular 0.1.31 → 0.1.33

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,11 @@
1
+ ## 0.1.33 (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.32 (2026-06-25)
6
+
7
+ This was a version bump only for mosaik-elements-angular to align it with other projects, there were no code changes.
8
+
1
9
  ## 0.1.31 (2026-06-24)
2
10
 
3
11
  ### 🚀 Features
@@ -19370,10 +19370,23 @@ class ToastPortalComponent extends PortalComponent$1 {
19370
19370
  get actionsTemplate() {
19371
19371
  return this._slots.actions();
19372
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
+ }
19373
19386
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: ToastPortalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
19374
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: [
19375
19388
  provideToastSlots()
19376
- ], 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)=\"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 });
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 });
19377
19390
  }
19378
19391
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: ToastPortalComponent, decorators: [{
19379
19392
  type: Component,
@@ -19390,7 +19403,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
19390
19403
  ToastActionsComponent,
19391
19404
  ButtonComponent,
19392
19405
  IconNameDirective
19393
- ], 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)=\"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"] }]
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"] }]
19394
19407
  }], ctorParameters: () => [], propDecorators: { _portal: [{
19395
19408
  type: ViewChild,
19396
19409
  args: [CdkPortalOutlet, { static: true }]