@breadstone/mosaik-elements-angular 0.0.243 → 0.0.245

package/CHANGELOG.md

@@ -1,3 +1,14 @@
+## 0.0.245 (2026-04-30)
+
+### 🚀 Features
+
+- **layouts:** enhance layout components with CSS custom properties and slot adjustments ([d72d6116bb](https://github.com/RueDeRennes/mosaik/commit/d72d6116bb))
+- **page-header:** enhance typography and layout for headers and subheaders ([824031a02a](https://github.com/RueDeRennes/mosaik/commit/824031a02a))
+
+## 0.0.244 (2026-04-30)
+
+This was a version bump only for mosaik-elements-angular to align it with other projects, there were no code changes.
+
 ## 0.0.243 (2026-04-30)
 
 ### 🚀 Features

package/fesm2022/mosaik-elements-angular.mjs

@@ -17222,6 +17222,10 @@ let ToastComponent = class ToastComponent {
             if (headerValue !== undefined) {
                 this._element.header = headerValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const timeoutValue = this.timeout();
             if (timeoutValue !== undefined) {
                 this._element.timeout = timeoutValue;
@@ -22234,6 +22238,10 @@ let BusyStateComponent = class BusyStateComponent {
             if (themeNameValue !== undefined) {
                 this._element.themeName = themeNameValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const formatterValue = this.formatter();
             if (formatterValue !== undefined) {
                 this._element.formatter = formatterValue;
@@ -25296,6 +25304,10 @@ let CardComponent = class CardComponent {
             if (subHeaderValue !== undefined) {
                 this._element.subHeader = subHeaderValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const inlineMediaValue = this.inlineMedia();
             if (inlineMediaValue !== undefined) {
                 this._element.inlineMedia = inlineMediaValue;
@@ -37366,6 +37378,10 @@ let CommentComponent = class CommentComponent {
             if (atValue !== undefined) {
                 this._element.at = atValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const themeNameValue = this.themeName();
             if (themeNameValue !== undefined) {
                 this._element.themeName = themeNameValue;
@@ -39710,8 +39726,8 @@ const DESIGNER_CONTENT_DEFAULT_PROPS = new InjectionToken('MOSAIK_DESIGNER_CONTE
  * @public
  *
  * @slot  - Default slot for the canvas (mosaik-designer-canvas)
- * @slot before-canvas - Generic extension slot before the canvas
  * @slot after-canvas - Generic extension slot after the canvas
+ * @slot before-canvas - Generic extension slot before the canvas
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let DesignerContentComponent = class DesignerContentComponent {
@@ -40056,10 +40072,10 @@ const DESIGNER_DEFAULT_PROPS = new InjectionToken('MOSAIK_DESIGNER_DEFAULT_PROPS
  * @public
  *
  * @slot  - Default slot for the primary workspace structure (mosaik-designer-content)
- * @slot header - Generic extension slot for header content such as toolbars
- * @slot before-content - Generic extension slot before the main content area
  * @slot after-content - Generic extension slot after the main content area
+ * @slot before-content - Generic extension slot before the main content area
  * @slot footer - Generic extension slot for footer content such as status bars
+ * @slot header - Generic extension slot for header content such as toolbars
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let DesignerComponent = class DesignerComponent {
@@ -41537,6 +41553,10 @@ let DrawerContainerComponent = class DrawerContainerComponent {
             if (hasBackdropValue !== undefined) {
                 this._element.hasBackdrop = hasBackdropValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const themeNameValue = this.themeName();
             if (themeNameValue !== undefined) {
                 this._element.themeName = themeNameValue;
@@ -43186,6 +43206,10 @@ let EmptyStateComponent = class EmptyStateComponent {
             if (themeNameValue !== undefined) {
                 this._element.themeName = themeNameValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const formatterValue = this.formatter();
             if (formatterValue !== undefined) {
                 this._element.formatter = formatterValue;
@@ -44218,6 +44242,10 @@ let ErrorStateComponent = class ErrorStateComponent {
             if (themeNameValue !== undefined) {
                 this._element.themeName = themeNameValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const formatterValue = this.formatter();
             if (formatterValue !== undefined) {
                 this._element.formatter = formatterValue;
@@ -47653,8 +47681,8 @@ const FLOW_BOARD_COLUMN_COMPOSER_DEFAULT_PROPS = new InjectionToken('MOSAIK_FLOW
 /**
  * @public
  *
- * @slot trigger - The trigger element that opens the form (e.g., "Add another list" button)
  * @slot form - The form content for creating new columns (completely user-defined)
+ * @slot trigger - The trigger element that opens the form (e.g., "Add another list" button)
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let FlowBoardColumnComposerComponent = class FlowBoardColumnComposerComponent {
@@ -47840,8 +47868,8 @@ const FLOW_BOARD_COLUMN_ITEM_COMPOSER_DEFAULT_PROPS = new InjectionToken('MOSAIK
 /**
  * @public
  *
- * @slot trigger - The trigger element that opens the form (e.g., "Add another item" button)
  * @slot form - The form content for creating new items (completely user-defined)
+ * @slot trigger - The trigger element that opens the form (e.g., "Add another item" button)
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let FlowBoardColumnItemComposerComponent = class FlowBoardColumnItemComposerComponent {
@@ -48037,11 +48065,11 @@ const FLOW_BOARD_COLUMN_ITEM_DEFAULT_PROPS = new InjectionToken('MOSAIK_FLOW_BOA
 /**
  * @public
  *
- * @slot title - The title content of the item
- * @slot subtitle - The subtitle content of the item
  * @slot actions - Action buttons or links related to the item
- * @slot meta - Additional metadata like price or status
  * @slot footer - Footer content with actions or avatars
+ * @slot meta - Additional metadata like price or status
+ * @slot subtitle - The subtitle content of the item
+ * @slot title - The title content of the item
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let FlowBoardColumnItemComponent = class FlowBoardColumnItemComponent {
@@ -48352,11 +48380,11 @@ const FLOW_BOARD_COLUMN_DEFAULT_PROPS = new InjectionToken('MOSAIK_FLOW_BOARD_CO
  * @public
  *
  * @slot  - Default slot for FlowBoardColumnItem elements
- * @slot title - The title content of the column header
- * @slot meta - Metadata content (badges, counts, KPIs)
  * @slot actions - Action buttons for the column
- * @slot footer - Footer content (usually contains a composer)
  * @slot empty - Content to show when the column has no items
+ * @slot footer - Footer content (usually contains a composer)
+ * @slot meta - Metadata content (badges, counts, KPIs)
+ * @slot title - The title content of the column header
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let FlowBoardColumnComponent = class FlowBoardColumnComponent {
@@ -54572,6 +54600,10 @@ let ListingItemComponent = class ListingItemComponent {
             if (headerValue !== undefined) {
                 this._element.header = headerValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const valueValue = this.value();
             if (valueValue !== undefined) {
                 this._element.value = valueValue;
@@ -56707,6 +56739,10 @@ let MessageComponent = class MessageComponent {
             if (headerValue !== undefined) {
                 this._element.header = headerValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const expandableValue = this.expandable();
             if (expandableValue !== undefined) {
                 this._element.expandable = expandableValue;
@@ -58669,7 +58705,12 @@ const PAGE_HEADER_DEFAULT_PROPS = new InjectionToken('MOSAIK_PAGE_HEADER_DEFAULT
 /**
  * @public
  *
+ * @slot  - The default slot.
+ * @slot additionalHeader - The additionalHeader slot.
  * @slot header - The header content.
+ * @slot prefix - The prefix slot.
+ * @slot subHeader - The subHeader slot.
+ * @slot suffix - The suffix slot.
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let PageHeaderComponent = class PageHeaderComponent {
@@ -58698,6 +58739,18 @@ let PageHeaderComponent = class PageHeaderComponent {
      * @public
      */
     text = input(...(ngDevMode ? [undefined, { debugName: "text" }] : /* istanbul ignore next */ []));
+    /**
+     * Signal input for the `subText` property.
+     *
+     * @public
+     */
+    subText = input(...(ngDevMode ? [undefined, { debugName: "subText" }] : /* istanbul ignore next */ []));
+    /**
+     * Signal input for the `additionalText` property.
+     *
+     * @public
+     */
+    additionalText = input(...(ngDevMode ? [undefined, { debugName: "additionalText" }] : /* istanbul ignore next */ []));
     /**
      * Signal input for the `themeName` property.
      *
@@ -58735,6 +58788,14 @@ let PageHeaderComponent = class PageHeaderComponent {
             if (textValue !== undefined) {
                 this._element.text = textValue;
             }
+            const subTextValue = this.subText();
+            if (subTextValue !== undefined) {
+                this._element.subText = subTextValue;
+            }
+            const additionalTextValue = this.additionalText();
+            if (additionalTextValue !== undefined) {
+                this._element.additionalText = additionalTextValue;
+            }
             const themeNameValue = this.themeName();
             if (themeNameValue !== undefined) {
                 this._element.themeName = themeNameValue;
@@ -58799,13 +58860,13 @@ let PageHeaderComponent = class PageHeaderComponent {
         this._element[property] = value;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: PageHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.10", type: PageHeaderComponent, isStandalone: true, selector: "mosaik-page-header", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, themeName: { classPropertyName: "themeName", publicName: "themeName", isSignal: true, isRequired: false, transformFunction: null }, inset: { classPropertyName: "inset", publicName: "inset", 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: { connected: "connected", disconnected: "disconnected", changed: "changed" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.10", type: PageHeaderComponent, isStandalone: true, selector: "mosaik-page-header", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, subText: { classPropertyName: "subText", publicName: "subText", isSignal: true, isRequired: false, transformFunction: null }, additionalText: { classPropertyName: "additionalText", publicName: "additionalText", isSignal: true, isRequired: false, transformFunction: null }, themeName: { classPropertyName: "themeName", publicName: "themeName", isSignal: true, isRequired: false, transformFunction: null }, inset: { classPropertyName: "inset", publicName: "inset", 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: { connected: "connected", disconnected: "disconnected", changed: "changed" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 PageHeaderComponent = __decorate$1I([
     ProxyCmp({
         defineCustomElementFn: () => customElements.define('mosaik-page-header', PageHeaderElement),
-        inputs: ['text', 'themeName', 'inset', 'dir', 'lang'],
-        methods: ['adoptStyle', 'on', 'off', 'emit', 'requestUpdate']
+        inputs: ['text', 'subText', 'additionalText', 'themeName', 'inset', 'dir', 'lang'],
+        methods: ['assignToSlot', 'getSlotAssignments', 'getSlotAssignmentsOf', 'getSlotContent', 'hasSlotContent', 'hasSlot', 'onSlotChanges', 'adoptStyle', 'on', 'off', 'emit', 'requestUpdate']
     }),
     __metadata$1I("design:paramtypes", [])
 ], PageHeaderComponent);
@@ -58817,7 +58878,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>'
                 }]
-        }], ctorParameters: () => [], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], themeName: [{ type: i0.Input, args: [{ isSignal: true, alias: "themeName", required: false }] }], inset: [{ type: i0.Input, args: [{ isSignal: true, alias: "inset", required: false }] }], dir: [{ type: i0.Input, args: [{ isSignal: true, alias: "dir", required: false }] }], lang: [{ type: i0.Input, args: [{ isSignal: true, alias: "lang", required: false }] }], connected: [{ type: i0.Output, args: ["connected"] }], disconnected: [{ type: i0.Output, args: ["disconnected"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
+        }], ctorParameters: () => [], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], subText: [{ type: i0.Input, args: [{ isSignal: true, alias: "subText", required: false }] }], additionalText: [{ type: i0.Input, args: [{ isSignal: true, alias: "additionalText", required: false }] }], themeName: [{ type: i0.Input, args: [{ isSignal: true, alias: "themeName", required: false }] }], inset: [{ type: i0.Input, args: [{ isSignal: true, alias: "inset", required: false }] }], dir: [{ type: i0.Input, args: [{ isSignal: true, alias: "dir", required: false }] }], lang: [{ type: i0.Input, args: [{ isSignal: true, alias: "lang", required: false }] }], connected: [{ type: i0.Output, args: ["connected"] }], disconnected: [{ type: i0.Output, args: ["disconnected"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
 /**
  * @public
  */
@@ -58851,6 +58912,7 @@ const PAGE_PRE_CONTENT_DEFAULT_PROPS = new InjectionToken('MOSAIK_PAGE_PRE_CONTE
 /**
  * @public
  *
+ * @slot  - The default slot.
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let PagePreContentComponent = class PagePreContentComponent {
@@ -59022,6 +59084,7 @@ const PAGE_PRE_HEADER_DEFAULT_PROPS = new InjectionToken('MOSAIK_PAGE_PRE_HEADER
 /**
  * @public
  *
+ * @slot  - The default slot.
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let PagePreHeaderComponent = class PagePreHeaderComponent {
@@ -59193,11 +59256,11 @@ const PAGE_DEFAULT_PROPS = new InjectionToken('MOSAIK_PAGE_DEFAULT_PROPS');
 /**
  * @public
  *
- * @slot preHeader - Content displayed before the main header (e.g., notifications, alerts)
- * @slot header - Primary page header content (e.g., navigation, title, actions)
- * @slot preContent - Content between header and main content (e.g., breadcrumbs, filters)
  * @slot content - Main page content area
  * @slot footer - Page footer content (e.g., copyright, links)
+ * @slot header - Primary page header content (e.g., navigation, title, actions)
+ * @slot preContent - Content between header and main content (e.g., breadcrumbs, filters)
+ * @slot preHeader - Content displayed before the main header (e.g., notifications, alerts)
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let PageComponent = class PageComponent {
@@ -59370,8 +59433,8 @@ const PAGE_MENU_DEFAULT_PROPS = new InjectionToken('MOSAIK_PAGE_MENU_DEFAULT_PRO
  * @public
  *
  * @slot  - The content of the page menu.
- * @slot start - The start content of the page menu.
  * @slot end - The end content of the page menu.
+ * @slot start - The start content of the page menu.
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let PageMenuComponent = class PageMenuComponent {
@@ -72999,8 +73062,7 @@ const SPLIT_DEFAULT_PROPS = new InjectionToken('MOSAIK_SPLIT_DEFAULT_PROPS');
 /**
  * @public
  *
- * @slot start - The primary content panel positioned at the beginning of the split
- * @slot end - The secondary content panel positioned at the end of the split
+ * @slot  - ${e.reverse ? 'end' : 'start'} - The ${e.reverse ? 'end' : 'start'} slot.
  * @slot thumb - Custom grip icon for the draggable divider (defaults to three dots icon)
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
@@ -74160,6 +74222,10 @@ let SuccessStateComponent = class SuccessStateComponent {
             if (themeNameValue !== undefined) {
                 this._element.themeName = themeNameValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const formatterValue = this.formatter();
             if (formatterValue !== undefined) {
                 this._element.formatter = formatterValue;
@@ -74341,6 +74407,10 @@ let SummaryComponent = class SummaryComponent {
             if (headerValue !== undefined) {
                 this._element.header = headerValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const themeNameValue = this.themeName();
             if (themeNameValue !== undefined) {
                 this._element.themeName = themeNameValue;
@@ -80054,6 +80124,7 @@ const TILE_LIST_ITEM_DEFAULT_PROPS = new InjectionToken('MOSAIK_TILE_LIST_ITEM_D
 /**
  * @public
  *
+ * @slot  - The default slot.
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let TileListItemComponent = class TileListItemComponent {
@@ -80285,6 +80356,7 @@ const TILE_LIST_DEFAULT_PROPS = new InjectionToken('MOSAIK_TILE_LIST_DEFAULT_PRO
 /**
  * @public
  *
+ * @slot  - The default slot.
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let TileListComponent = class TileListComponent {
@@ -80487,13 +80559,13 @@ const TILE_MANAGER_TILE_DEFAULT_PROPS = new InjectionToken('MOSAIK_TILE_MANAGER_
  * @public
  *
  * @slot  - Default slot for the tile's content.
- * @slot title - Renders the title of the tile header.
- * @slot maximize-action - Renders the maximize action element of the tile header.
- * @slot fullscreen-action - Renders the fullscreen action element of the tile header.
  * @slot actions - Renders items after the default actions in the tile header.
- * @slot side-adorner - Renders the side resize handle of the tile.
- * @slot corner-adorner - Renders the corner resize handle of the tile.
  * @slot bottom-adorner - Renders the bottom resize handle of the tile.
+ * @slot corner-adorner - Renders the corner resize handle of the tile.
+ * @slot fullscreen-action - Renders the fullscreen action element of the tile header.
+ * @slot maximize-action - Renders the maximize action element of the tile header.
+ * @slot side-adorner - Renders the side resize handle of the tile.
+ * @slot title - Renders the title of the tile header.
  * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
  */
 let TileManagerTileComponent = class TileManagerTileComponent {
@@ -84007,6 +84079,10 @@ let ToggleTipComponent = class ToggleTipComponent {
      */
     initInputSyncEffect() {
         effect(() => {
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const placementValue = this.placement();
             if (placementValue !== undefined) {
                 this._element.placement = placementValue;
@@ -84604,6 +84680,10 @@ let TooltipComponent = class TooltipComponent {
             if (isFloatingActiveValue !== undefined) {
                 this._element.isFloatingActive = isFloatingActiveValue;
             }
+            const contentValue = this.content();
+            if (contentValue !== undefined) {
+                this._element.content = contentValue;
+            }
             const placementValue = this.placement();
             if (placementValue !== undefined) {
                 this._element.placement = placementValue;