@propbinder/mobile-design 0.2.16 → 0.2.21

package/index.d.ts

@@ -1222,6 +1222,142 @@ declare class TileValueComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<TileValueComponent, "tile-value", never, {}, {}, never, ["*"], true, never>;
 }
 
+type LogoVariant = 'full' | 'mark';
+type LogoSize = 'sm' | 'md' | 'lg' | 'xl';
+/**
+ * DsLogoComponent
+ *
+ * Displays the whitelabeled logo or logomark based on current configuration.
+ * Automatically pulls logo assets from WhitelabelService.
+ *
+ * @example
+ * Full logo in header:
+ * ```html
+ * <ds-logo variant="full" size="md" />
+ * ```
+ *
+ * Logomark for compact spaces:
+ * ```html
+ * <ds-logo variant="mark" size="sm" />
+ * ```
+ */
+declare class DsLogoComponent {
+    whitelabelService: WhitelabelService;
+    variant: LogoVariant;
+    size: LogoSize;
+    customHeight?: number;
+    customWidth?: number;
+    get logoSrc(): string;
+    get logoAlt(): string;
+    /**
+     * Priority: customHeight input > whitelabel config logoHeight > default 32px
+     */
+    get effectiveHeight(): number;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsLogoComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsLogoComponent, "ds-logo", never, { "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "customHeight": { "alias": "customHeight"; "required": false; }; "customWidth": { "alias": "customWidth"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * DsMobileSystemMessageBannerComponent
+ *
+ * Full-width centered banner component for displaying system messages in chat conversations.
+ * Uses the same text styling as message bubbles for consistency.
+ *
+ * Features:
+ * - Full-width centered layout
+ * - Subtle background with theming support
+ * - Same typography as message bubbles
+ * - Optional icon support
+ *
+ * Common use cases:
+ * - Inquiry status updates ("Your inquiry has been assigned to...")
+ * - System notifications ("This inquiry is marked as resolved")
+ * - Auto-replies ("We aim to respond within 24 hours...")
+ * - Time/date separators
+ *
+ * @example
+ * ```html
+ * <!-- Simple system message -->
+ * <ds-mobile-system-message-banner
+ *   [message]="'Ricki Meihlen har overtaget din henvendelse og vil kontakte dig snart.'">
+ * </ds-mobile-system-message-banner>
+ *
+ * <!-- With icon -->
+ * <ds-mobile-system-message-banner
+ *   [message]="'Vi bestræber os på at svare inden for 24 timer på hverdage.'"
+ *   [iconName]="'remixInformationLine'">
+ * </ds-mobile-system-message-banner>
+ * ```
+ */
+declare class DsMobileSystemMessageBannerComponent {
+    /**
+     * System message text to display
+     */
+    message: _angular_core.InputSignal<string>;
+    /**
+     * Optional icon name (currently using inline SVG for info icon)
+     * Can be extended to support full icon library integration
+     */
+    iconName: _angular_core.InputSignal<string>;
+    /**
+     * Whether this system message appears directly after a timestamp
+     * When true, removes top padding to reduce spacing
+     */
+    afterTimestamp: _angular_core.InputSignal<boolean>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileSystemMessageBannerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileSystemMessageBannerComponent, "ds-mobile-system-message-banner", never, { "message": { "alias": "message"; "required": true; "isSignal": true; }; "iconName": { "alias": "iconName"; "required": false; "isSignal": true; }; "afterTimestamp": { "alias": "afterTimestamp"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * DsMobileFileAttachmentComponent
+ *
+ * File attachment display for various document types.
+ * Shows file info card with icon, filename, and file size.
+ * Supports PDF and generic document formats.
+ * Emits click event to open file in viewer.
+ *
+ * @example
+ * ```html
+ * <ds-mobile-file-attachment
+ *   [fileName]="'Document.pdf'"
+ *   [fileSize]="'1.2 MB'"
+ *   [variant]="'pdf'"
+ *   (fileClick)="openFile()">
+ * </ds-mobile-file-attachment>
+ * ```
+ */
+declare class DsMobileFileAttachmentComponent {
+    /**
+     * File name
+     */
+    fileName: _angular_core.InputSignal<string>;
+    /**
+     * File size display (e.g., "1.2 MB")
+     */
+    fileSize: _angular_core.InputSignal<string>;
+    /**
+     * File type variant
+     * - 'pdf' - PDF document (red icon)
+     * - 'doc' - Generic document (blue icon)
+     */
+    variant: _angular_core.InputSignal<"pdf" | "doc">;
+    /**
+     * Emits when the file attachment is clicked
+     */
+    fileClick: _angular_core.OutputEmitterRef<void>;
+    /**
+     * Get the appropriate icon name based on variant
+     */
+    getIconName(): string;
+    /**
+     * Get the file type label based on variant
+     */
+    getFileTypeLabel(): string;
+    handleClick(event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileFileAttachmentComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileFileAttachmentComponent, "ds-mobile-file-attachment", never, { "fileName": { "alias": "fileName"; "required": false; "isSignal": true; }; "fileSize": { "alias": "fileSize"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, { "fileClick": "fileClick"; }, never, never, true, never>;
+}
+
 /**
  * DsMobileCommentComponent
  *
@@ -2404,6 +2540,48 @@ declare class DsMobileListItemStaticComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileListItemStaticComponent, "ds-mobile-list-item-static", never, { "leadingSize": { "alias": "leadingSize"; "required": false; "isSignal": true; }; }, {}, never, ["[content-leading]", "[content-main]", "*", "[content-trailing]"], true, never>;
 }
 
+/**
+ * DsMobileActionListItemComponent
+ *
+ * Specialized list item for action sheets and menus.
+ * Wraps ds-mobile-list-item with action-specific styling:
+ * - Vertically centered content
+ * - Interactive by default
+ * - No dividers (controlled per-item)
+ *
+ * @example
+ * ```html
+ * <ds-mobile-action-list-item
+ *   title="Edit"
+ *   [showDivider]="true"
+ *   (itemClick)="handleEdit()">
+ *   <ds-icon content-leading name="remixEditLine" size="20px" />
+ * </ds-mobile-action-list-item>
+ * ```
+ */
+declare class DsMobileActionListItemComponent {
+    /**
+     * Action title text
+     */
+    title: _angular_core.InputSignal<string>;
+    /**
+     * Whether to show divider below item
+     * @default false
+     */
+    showDivider: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether the action is disabled
+     * @default false
+     */
+    disabled: _angular_core.InputSignal<boolean>;
+    /**
+     * Emits when the action item is clicked
+     */
+    itemClick: _angular_core.OutputEmitterRef<void>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileActionListItemComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileActionListItemComponent, "ds-mobile-action-list-item", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "showDivider": { "alias": "showDivider"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "itemClick": "itemClick"; }, never, ["[action-icon]", "[content-trailing]"], true, never>;
+}
+
 /**
  * DsMobileInteractiveListItemPostComponent
  *
@@ -3089,57 +3267,6 @@ declare class DsMobileSwiperComponent implements AfterViewInit, OnDestroy {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileSwiperComponent, "ds-mobile-swiper", never, { "slideWidth": { "alias": "slideWidth"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "pagination": { "alias": "pagination"; "required": false; "isSignal": true; }; "autoHeight": { "alias": "autoHeight"; "required": false; "isSignal": true; }; "progressiveOpacity": { "alias": "progressiveOpacity"; "required": false; "isSignal": true; }; "progressiveScale": { "alias": "progressiveScale"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
-/**
- * DsMobileSystemMessageBannerComponent
- *
- * Full-width centered banner component for displaying system messages in chat conversations.
- * Uses the same text styling as message bubbles for consistency.
- *
- * Features:
- * - Full-width centered layout
- * - Subtle background with theming support
- * - Same typography as message bubbles
- * - Optional icon support
- *
- * Common use cases:
- * - Inquiry status updates ("Your inquiry has been assigned to...")
- * - System notifications ("This inquiry is marked as resolved")
- * - Auto-replies ("We aim to respond within 24 hours...")
- * - Time/date separators
- *
- * @example
- * ```html
- * <!-- Simple system message -->
- * <ds-mobile-system-message-banner
- *   [message]="'Ricki Meihlen har overtaget din henvendelse og vil kontakte dig snart.'">
- * </ds-mobile-system-message-banner>
- *
- * <!-- With icon -->
- * <ds-mobile-system-message-banner
- *   [message]="'Vi bestræber os på at svare inden for 24 timer på hverdage.'"
- *   [iconName]="'remixInformationLine'">
- * </ds-mobile-system-message-banner>
- * ```
- */
-declare class DsMobileSystemMessageBannerComponent {
-    /**
-     * System message text to display
-     */
-    message: _angular_core.InputSignal<string>;
-    /**
-     * Optional icon name (currently using inline SVG for info icon)
-     * Can be extended to support full icon library integration
-     */
-    iconName: _angular_core.InputSignal<string>;
-    /**
-     * Whether this system message appears directly after a timestamp
-     * When true, removes top padding to reduce spacing
-     */
-    afterTimestamp: _angular_core.InputSignal<boolean>;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileSystemMessageBannerComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileSystemMessageBannerComponent, "ds-mobile-system-message-banner", never, { "message": { "alias": "message"; "required": true; "isSignal": true; }; "iconName": { "alias": "iconName"; "required": false; "isSignal": true; }; "afterTimestamp": { "alias": "afterTimestamp"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
-}
-
 /**
  * Media file types supported by the lightbox
  */
@@ -5811,56 +5938,6 @@ declare class DsTextInputComponent implements ControlValueAccessor {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsTextInputComponent, "ds-text-input", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "hasError": { "alias": "hasError"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "inputmode": { "alias": "inputmode"; "required": false; "isSignal": true; }; "autoClearError": { "alias": "autoClearError"; "required": false; "isSignal": true; }; "validator": { "alias": "validator"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "blur": "blur"; "focus": "focus"; "errorCleared": "errorCleared"; }, never, never, true, never>;
 }
 
-/**
- * DsMobileFileAttachmentComponent
- *
- * File attachment display for various document types.
- * Shows file info card with icon, filename, and file size.
- * Supports PDF and generic document formats.
- * Emits click event to open file in viewer.
- *
- * @example
- * ```html
- * <ds-mobile-file-attachment
- *   [fileName]="'Document.pdf'"
- *   [fileSize]="'1.2 MB'"
- *   [variant]="'pdf'"
- *   (fileClick)="openFile()">
- * </ds-mobile-file-attachment>
- * ```
- */
-declare class DsMobileFileAttachmentComponent {
-    /**
-     * File name
-     */
-    fileName: _angular_core.InputSignal<string>;
-    /**
-     * File size display (e.g., "1.2 MB")
-     */
-    fileSize: _angular_core.InputSignal<string>;
-    /**
-     * File type variant
-     * - 'pdf' - PDF document (red icon)
-     * - 'doc' - Generic document (blue icon)
-     */
-    variant: _angular_core.InputSignal<"pdf" | "doc">;
-    /**
-     * Emits when the file attachment is clicked
-     */
-    fileClick: _angular_core.OutputEmitterRef<void>;
-    /**
-     * Get the appropriate icon name based on variant
-     */
-    getIconName(): string;
-    /**
-     * Get the file type label based on variant
-     */
-    getFileTypeLabel(): string;
-    handleClick(event: Event): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileFileAttachmentComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileFileAttachmentComponent, "ds-mobile-file-attachment", never, { "fileName": { "alias": "fileName"; "required": false; "isSignal": true; }; "fileSize": { "alias": "fileSize"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, { "fileClick": "fileClick"; }, never, never, true, never>;
-}
-
 /**
  * DsMobileFabComponent
  *
@@ -6016,83 +6093,6 @@ declare class DsAvatarWithBadgeComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsAvatarWithBadgeComponent, "ds-avatar-with-badge", never, { "type": { "alias": "type"; "required": false; }; "size": { "alias": "size"; "required": false; }; "initials": { "alias": "initials"; "required": false; }; "src": { "alias": "src"; "required": false; }; "iconName": { "alias": "iconName"; "required": false; }; "showBadge": { "alias": "showBadge"; "required": false; }; "badgePosition": { "alias": "badgePosition"; "required": false; }; }, {}, never, never, true, never>;
 }
 
-/**
- * DsMobileActionListItemComponent
- *
- * Specialized list item for action sheets and menus.
- * Wraps ds-mobile-list-item with action-specific styling:
- * - Vertically centered content
- * - Interactive by default
- * - No dividers (controlled per-item)
- *
- * @example
- * ```html
- * <ds-mobile-action-list-item
- *   title="Edit"
- *   [showDivider]="true"
- *   (itemClick)="handleEdit()">
- *   <ds-icon content-leading name="remixEditLine" size="20px" />
- * </ds-mobile-action-list-item>
- * ```
- */
-declare class DsMobileActionListItemComponent {
-    /**
-     * Action title text
-     */
-    title: _angular_core.InputSignal<string>;
-    /**
-     * Whether to show divider below item
-     * @default false
-     */
-    showDivider: _angular_core.InputSignal<boolean>;
-    /**
-     * Whether the action is disabled
-     * @default false
-     */
-    disabled: _angular_core.InputSignal<boolean>;
-    /**
-     * Emits when the action item is clicked
-     */
-    itemClick: _angular_core.OutputEmitterRef<void>;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileActionListItemComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileActionListItemComponent, "ds-mobile-action-list-item", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "showDivider": { "alias": "showDivider"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "itemClick": "itemClick"; }, never, ["[action-icon]", "[content-trailing]"], true, never>;
-}
-
-type LogoVariant = 'full' | 'mark';
-type LogoSize = 'sm' | 'md' | 'lg' | 'xl';
-/**
- * DsLogoComponent
- *
- * Displays the whitelabeled logo or logomark based on current configuration.
- * Automatically pulls logo assets from WhitelabelService.
- *
- * @example
- * Full logo in header:
- * ```html
- * <ds-logo variant="full" size="md" />
- * ```
- *
- * Logomark for compact spaces:
- * ```html
- * <ds-logo variant="mark" size="sm" />
- * ```
- */
-declare class DsLogoComponent {
-    whitelabelService: WhitelabelService;
-    variant: LogoVariant;
-    size: LogoSize;
-    customHeight?: number;
-    customWidth?: number;
-    get logoSrc(): string;
-    get logoAlt(): string;
-    /**
-     * Priority: customHeight input > whitelabel config logoHeight > default 32px
-     */
-    get effectiveHeight(): number;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsLogoComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsLogoComponent, "ds-logo", never, { "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "customHeight": { "alias": "customHeight"; "required": false; }; "customWidth": { "alias": "customWidth"; "required": false; }; }, {}, never, never, true, never>;
-}
-
 /**
  * DsMobileEmptyStateComponent
  *

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@propbinder/mobile-design",
-  "version": "0.2.16",
+  "version": "0.2.21",
   "peerDependencies": {
     "@angular/common": "^20.3.0 || ^21.0.0",
     "@angular/core": "^20.3.0 || ^21.0.0"