@propbinder/mobile-design 0.2.48 → 0.2.52

package/index.d.ts

@@ -738,7 +738,7 @@ declare class DsMobilePageMainComponent extends MobilePageBase implements AfterV
     title: _angular_core.InputSignal<string>;
     headerTitle: _angular_core.InputSignal<string>;
     headerSubtitle: _angular_core.InputSignal<string>;
-    avatarType: _angular_core.InputSignal<"photo" | "initials" | "icon">;
+    avatarType: _angular_core.InputSignal<"initials" | "photo" | "icon">;
     avatarInitials: _angular_core.InputSignal<string>;
     avatarSrc: _angular_core.InputSignal<string>;
     avatarIconName: _angular_core.InputSignal<string>;
@@ -918,7 +918,7 @@ declare class WhitelabelService {
     readonly logoUrl: _angular_core.Signal<string>;
     readonly logoMarkUrl: _angular_core.Signal<string>;
     readonly logoAlt: _angular_core.Signal<string>;
-    readonly logoSize: _angular_core.Signal<"sm" | "md" | "lg" | "xl">;
+    readonly logoSize: _angular_core.Signal<"md" | "sm" | "lg" | "xl">;
     readonly logoHeight: _angular_core.Signal<number>;
     readonly appIconSurface: _angular_core.Signal<string>;
     readonly appIconContent: _angular_core.Signal<string>;
@@ -1584,7 +1584,7 @@ declare class DsMobileCommentComponent {
     /**
      * Avatar type
      */
-    avatarType: _angular_core.InputSignal<"photo" | "initials" | "icon">;
+    avatarType: _angular_core.InputSignal<"initials" | "photo" | "icon">;
     /**
      * Whether the comment is clickable
      */
@@ -1597,6 +1597,14 @@ declare class DsMobileCommentComponent {
      */
     moreActions: _angular_core.InputSignal<boolean | undefined>;
     shouldShowMoreButton: _angular_core.Signal<boolean>;
+    /**
+     * Label for the reply action button
+     */
+    replyLabel: _angular_core.InputSignal<string>;
+    /**
+     * Label for the edit action button
+     */
+    editLabel: _angular_core.InputSignal<string>;
     /**
      * Whether this comment belongs to the current user
      */
@@ -1683,7 +1691,7 @@ declare class DsMobileCommentComponent {
      */
     handleMoreButtonClick(event: Event): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileCommentComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileCommentComponent, "ds-mobile-comment", never, { "authorName": { "alias": "authorName"; "required": true; "isSignal": true; }; "authorRole": { "alias": "authorRole"; "required": true; "isSignal": true; }; "timestamp": { "alias": "timestamp"; "required": true; "isSignal": true; }; "content": { "alias": "content"; "required": true; "isSignal": true; }; "avatarInitials": { "alias": "avatarInitials"; "required": false; "isSignal": true; }; "avatarType": { "alias": "avatarType"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "moreActions": { "alias": "moreActions"; "required": false; "isSignal": true; }; "isOwnComment": { "alias": "isOwnComment"; "required": false; "isSignal": true; }; "isLiked": { "alias": "isLiked"; "required": false; "isSignal": true; }; "likeCount": { "alias": "likeCount"; "required": false; "isSignal": true; }; }, { "likeToggled": "likeToggled"; "commentClick": "commentClick"; "replyClick": "replyClick"; "editClick": "editClick"; "longPress": "longPress"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileCommentComponent, "ds-mobile-comment", never, { "authorName": { "alias": "authorName"; "required": true; "isSignal": true; }; "authorRole": { "alias": "authorRole"; "required": true; "isSignal": true; }; "timestamp": { "alias": "timestamp"; "required": true; "isSignal": true; }; "content": { "alias": "content"; "required": true; "isSignal": true; }; "avatarInitials": { "alias": "avatarInitials"; "required": false; "isSignal": true; }; "avatarType": { "alias": "avatarType"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "moreActions": { "alias": "moreActions"; "required": false; "isSignal": true; }; "replyLabel": { "alias": "replyLabel"; "required": false; "isSignal": true; }; "editLabel": { "alias": "editLabel"; "required": false; "isSignal": true; }; "isOwnComment": { "alias": "isOwnComment"; "required": false; "isSignal": true; }; "isLiked": { "alias": "isLiked"; "required": false; "isSignal": true; }; "likeCount": { "alias": "likeCount"; "required": false; "isSignal": true; }; }, { "likeToggled": "likeToggled"; "commentClick": "commentClick"; "replyClick": "replyClick"; "editClick": "editClick"; "longPress": "longPress"; }, never, never, true, never>;
 }
 
 /**
@@ -1711,7 +1719,7 @@ declare class DsMobilePostComposerComponent {
     /**
      * Avatar type
      */
-    avatarType: _angular_core.InputSignal<"photo" | "initials" | "icon">;
+    avatarType: _angular_core.InputSignal<"initials" | "photo" | "icon">;
     /**
      * Avatar photo source (for photo type)
      */
@@ -2003,7 +2011,7 @@ declare class DsMobileMessageComposerComponent implements AfterViewInit, OnDestr
     /**
      * Avatar type
      */
-    avatarType: _angular_core.InputSignal<"photo" | "initials" | "icon">;
+    avatarType: _angular_core.InputSignal<"initials" | "photo" | "icon">;
     /**
      * Avatar photo source (for photo type)
      */
@@ -2324,7 +2332,7 @@ declare class DsMobileMessageBubbleComponent {
     /**
      * Avatar type
      */
-    avatarType: _angular_core.InputSignal<"photo" | "initials" | "icon">;
+    avatarType: _angular_core.InputSignal<"initials" | "photo" | "icon">;
     /**
      * Avatar photo source (for photo type)
      */
@@ -2851,7 +2859,7 @@ declare class DsMobileInteractiveListItemPostComponent {
     /**
      * Avatar type
      */
-    avatarType: _angular_core.InputSignal<"photo" | "initials" | "icon">;
+    avatarType: _angular_core.InputSignal<"initials" | "photo" | "icon">;
     /**
      * Avatar photo source (for photo type)
      */
@@ -3189,7 +3197,7 @@ declare class DsMobileInteractiveListItemMessageComponent {
     /**
      * Avatar type
      */
-    avatarType: _angular_core.InputSignal<"photo" | "initials" | "icon">;
+    avatarType: _angular_core.InputSignal<"initials" | "photo" | "icon">;
     /**
      * Avatar photo source (for photo type)
      */
@@ -4582,7 +4590,7 @@ declare abstract class MobileModalBase implements OnInit, OnDestroy {
      * - 'overlay': keyboard/footer overlays lower content (no auto scroll push)
      * @default 'follow'
      */
-    keyboardContentBehavior: _angular_core.InputSignal<"overlay" | "follow">;
+    keyboardContentBehavior: _angular_core.InputSignal<"follow" | "overlay">;
     /**
      * Emitted when modal is closed
      */
@@ -5582,7 +5590,7 @@ declare class DsMobileChatModalComponent implements OnInit, AfterViewInit {
     participant: _angular_core.WritableSignal<ChatParticipant>;
     messages: _angular_core.WritableSignal<ChatMessage[]>;
     currentUserInitials: _angular_core.WritableSignal<string>;
-    currentUserAvatarType: _angular_core.WritableSignal<"photo" | "initials" | "icon">;
+    currentUserAvatarType: _angular_core.WritableSignal<"initials" | "photo" | "icon">;
     currentUserAvatarSrc: _angular_core.WritableSignal<string>;
     autoFocus: _angular_core.WritableSignal<boolean>;
     /**
@@ -6062,6 +6070,10 @@ declare class DsMobileBookingModalComponent implements AfterViewInit {
      * Defaults to 60 (2 months). Override via componentProps when opening the modal.
      */
     daysAhead: number;
+    selectFromCalendarText: string;
+    confirmBookingText: string;
+    availableDates?: DateOption[];
+    availableTimeSlots?: Record<string, TimeSlot[]>;
     swiperComponent?: DsMobileSwiperComponent;
     dateOptions: _angular_core.WritableSignal<DateOption[]>;
     timeSlots: _angular_core.WritableSignal<TimeSlot[]>;
@@ -6089,11 +6101,11 @@ declare class DsMobileBookingModalComponent implements AfterViewInit {
      */
     dateDisabledFn: _angular_core.Signal<(date: Date) => boolean>;
     /**
-     * Generate mock date and time data
+     * Generate mock date and time data or use provided available data
      */
     private generateMockData;
     /**
-     * Generate time slots based on selected date
+     * Generate time slots based on selected date and dynamic available timeslots
      */
     private generateTimeSlots;
     /**
@@ -6118,7 +6130,7 @@ declare class DsMobileBookingModalComponent implements AfterViewInit {
      */
     handleClose(): Promise<void>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileBookingModalComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileBookingModalComponent, "ds-mobile-booking-modal", never, { "facilityId": { "alias": "facilityId"; "required": false; }; "facilityTitle": { "alias": "facilityTitle"; "required": false; }; "daysAhead": { "alias": "daysAhead"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileBookingModalComponent, "ds-mobile-booking-modal", never, { "facilityId": { "alias": "facilityId"; "required": false; }; "facilityTitle": { "alias": "facilityTitle"; "required": false; }; "daysAhead": { "alias": "daysAhead"; "required": false; }; "selectFromCalendarText": { "alias": "selectFromCalendarText"; "required": false; }; "confirmBookingText": { "alias": "confirmBookingText"; "required": false; }; "availableDates": { "alias": "availableDates"; "required": false; }; "availableTimeSlots": { "alias": "availableTimeSlots"; "required": false; }; }, {}, never, never, true, never>;
 }
 
 /**
@@ -6133,22 +6145,34 @@ declare class DsMobileBookingModalComponent implements AfterViewInit {
  * constructor(private bookingModalService: DsMobileBookingModalService) {}
  *
  * async openBooking() {
- *   await this.bookingModalService.open('facility-1', 'Boremaskinen');
+ *   await this.bookingModalService.open({
+ *     facilityId: 'facility-1',
+ *     facilityTitle: 'Boremaskinen'
+ *   });
  * }
  * ```
  */
+interface BookingModalOptions {
+    facilityId: string;
+    facilityTitle: string;
+    facilityThumbnail?: string;
+    daysAhead?: number;
+    availableDates?: DateOption[];
+    availableTimeSlots?: Record<string, TimeSlot[]>;
+    labels?: {
+        selectFromCalendar?: string;
+        confirmBooking?: string;
+    };
+}
 declare class DsMobileBookingModalService extends BaseModalService {
     constructor(modalController: ModalController);
     /**
      * Open the booking modal for a facility
      *
-     * @param facilityId The ID of the facility to book
-     * @param facilityTitle The display name of the facility
-     * @param facilityThumbnail Optional thumbnail image URL
-     * @param daysAhead Number of days ahead available for selection (defaults to 14)
+     * @param options The booking modal options including dynamic data and texts
      * @returns Promise that resolves when the booking flow is complete
      */
-    open(facilityId: string, facilityTitle: string, facilityThumbnail?: string, daysAhead?: number): Promise<void>;
+    open(options: BookingModalOptions): Promise<void>;
     /**
      * Dismiss all open modals
      */
@@ -7191,7 +7215,7 @@ declare class DsMobileHandbookFolderMiniComponent {
  * ```
  */
 declare class DsTextInputComponent implements ControlValueAccessor {
-    type: _angular_core.InputSignal<"search" | "text" | "email" | "tel" | "url" | "password">;
+    type: _angular_core.InputSignal<"search" | "text" | "url" | "email" | "tel" | "password">;
     placeholder: _angular_core.InputSignal<string>;
     disabled: _angular_core.InputSignal<boolean>;
     readonly: _angular_core.InputSignal<boolean>;
@@ -7199,7 +7223,7 @@ declare class DsTextInputComponent implements ControlValueAccessor {
     hasError: _angular_core.InputSignal<boolean>;
     errorMessage: _angular_core.InputSignal<string>;
     autocomplete: _angular_core.InputSignal<string>;
-    inputmode: _angular_core.InputSignal<"search" | "text" | "email" | "tel" | "url" | "numeric" | undefined>;
+    inputmode: _angular_core.InputSignal<"search" | "text" | "url" | "numeric" | "email" | "tel" | undefined>;
     autoClearError: _angular_core.InputSignal<boolean>;
     validator: _angular_core.InputSignal<((value: string) => boolean) | null>;
     valueChange: _angular_core.OutputEmitterRef<string>;
@@ -7270,7 +7294,7 @@ declare class DsMobileFabComponent implements AfterViewInit, OnDestroy {
      * Note: FAB is always 56px circular, but this affects the icon size
      * @default 'md'
      */
-    size: _angular_core.InputSignal<"sm" | "md" | "lg">;
+    size: _angular_core.InputSignal<"md" | "sm" | "lg">;
     /**
      * ARIA label for accessibility
      * @required - Always provide a descriptive label
@@ -7564,7 +7588,7 @@ declare class UserService {
     private _avatarSrc;
     private _profileMenuItems;
     readonly avatarInitials: _angular_core.Signal<string>;
-    readonly avatarType: _angular_core.Signal<"photo" | "initials" | "icon">;
+    readonly avatarType: _angular_core.Signal<"initials" | "photo" | "icon">;
     readonly avatarSrc: _angular_core.Signal<string>;
     readonly profileMenuItems: _angular_core.Signal<ActionGroup[] | undefined>;
     private profileActionSelectedSubject;
@@ -8166,4 +8190,4 @@ declare const customPageTransition: (_: HTMLElement, opts: any) => Animation;
 declare const customBackTransition: (_: HTMLElement, opts: any) => Animation;
 
 export { ActionCommentComponent, ActionLikeComponent, BaseModalService, ContentRowComponent, DsAppIconComponent, DsAvatarWithBadgeComponent, DsLogoComponent, DsMobileAccessSheetComponent, DsMobileActionListItemComponent, DsMobileActionsBottomSheetComponent, DsMobileAttachmentPreviewComponent, DsMobileBookingConfirmationWrapperComponent, DsMobileBookingModalComponent, DsMobileBookingModalService, DsMobileBookingSummaryComponent, DsMobileBottomSheetHeaderComponent, DsMobileBottomSheetService, DsMobileBottomSheetWrapperComponent, DsMobileCardInlineBannerComponent, DsMobileCardInlineComponent, DsMobileCardInlineContactComponent, DsMobileCardInlineFileComponent, DsMobileChatModalComponent, DsMobileChatModalService, DsMobileActionsBottomSheetComponent as DsMobileCommentActionsBottomSheetComponent, DsMobileCommentComponent, DsMobileConfirmationSheetComponent, DsMobileContactListItemComponent, DsMobileContentComponent, DsMobileDropdownComponent, DsMobileEmptyStateComponent, DsMobileFabComponent, DsMobileFacilityCreationConfirmationWrapperComponent, DsMobileFacilityCreationModalComponent, DsMobileFacilityCreationModalService, DsMobileFacilityDetailModalComponent, DsMobileFacilityDetailModalService, DsMobileFileAttachmentComponent, DsMobileHandbookDetailModalComponent, DsMobileHandbookDetailModalService, DsMobileHandbookFolderComponent, DsMobileHandbookFolderMiniComponent, DsMobileHeaderContentComponent, DsMobileHeaderContentTileComponent, DsMobileIllustrationComponent, DsMobileInlinePhotoComponent, DsMobileInlineTabsComponent, DsMobileInteractiveListItemBookingComponent, DsMobileInteractiveListItemInquiryComponent, DsMobileInteractiveListItemMessageComponent, DsMobileInteractiveListItemPostComponent, DsMobileLightboxImageComponent as DsMobileLightboxComponent, DsMobileLightboxFooterComponent, DsMobileLightboxHeaderComponent, DsMobileLightboxImageComponent, DsMobileLightboxPdfComponent, DsMobileLightboxService, DsMobileListItemComponent, DsMobileListItemStaticComponent, DsMobileLoaderOverlayComponent, DsMobileLongPressDirective, DsMobileMessageBubbleComponent, DsMobileMessageComposerComponent, DsMobileModalBaseComponent, DsMobileModalService, DsMobileNewInquiryModalComponent, DsMobileNewInquiryModalService, DsMobileOfflineBannerComponent, DsMobilePageDetailsComponent, DsMobilePageMainComponent, DsMobileActionsBottomSheetComponent as DsMobilePostActionsBottomSheetComponent, DsMobilePostComposerComponent, DsMobilePostCreateBottomSheetComponent, DsMobilePostDetailModalComponent, DsMobilePostDetailModalService, DsMobilePriceSheetComponent, DsMobileProfileActionsSheetComponent, DsMobilePropertyBannerComponent, DsMobileSectionComponent, DsMobileSwiperComponent, DsMobileSwiperWithNavComponent, DsMobileSystemMessageBannerComponent, DsMobileTabBarComponent, DsMobileTabsComponent, DsMobileWhenCanBookSheetComponent, DsMobileWhoCanBookSheetComponent, DsTextInputComponent, MobileBookingPageComponent, MobileCommunityPageComponent, MobileHandbookPageComponent, MobileHomePageComponent, MobileInquiriesPageComponent, MobileInquiryDetailPageComponent, MobileModalBase, MobilePageBase, MobilePostDetailPageComponent, MobileTabsExampleComponent, PostActionsComponent, PostAttachmentsComponent, PostContentComponent, PostCreatePageComponent, PostMediaComponent, PostPdfAttachmentComponent, PostTextComponent, PostsService, SectionHeaderComponent, SignInPageComponent, TileContentComponent, TileIconComponent, TileLabelComponent, TileValueComponent, TrackingPermissionService, UserService, WhitelabelDemoModalComponent, WhitelabelDemoModalService, WhitelabelService, customBackTransition, customPageTransition };
-export type { ActionGroup, ActionItem, ActionResult, AppIconSize, AttachmentData, AttachmentFileType, AttachmentItem, AvatarSize, AvatarType, BadgePosition, BookingResult, BottomSheetOptions, ChatAttachment, ChatMessage, ChatModalData, ChatParticipant, Comment, ActionResult as CommentActionResult, CommentData, ContactItem, ContentWidth, DateOption, DropdownAlign, DropdownPosition, DsMobileDropdownItem, FacilityCreationModalOptions, FacilityDetailData, HandbookDetailData, HandbookItem, InlineTabItem, InquiryPhoto, Language, LightboxAuthor, LightboxImage, LightboxImageOptions, LightboxMediaFile, LightboxMediaType, LightboxOptions, LightboxPdf, LightboxPdfOptions, LogoSize, LogoVariant, ModalOptions, NetworkStatus, NewFacilityData, NewInquiryData, NewInquiryModalOptions, Post, ActionResult as PostActionResult, PostDetailData, TabConfig, TimeSlot, WhitelabelConfig };
+export type { ActionGroup, ActionItem, ActionResult, AppIconSize, AttachmentData, AttachmentFileType, AttachmentItem, AvatarSize, AvatarType, BadgePosition, BookingModalOptions, BookingResult, BottomSheetOptions, ChatAttachment, ChatMessage, ChatModalData, ChatParticipant, Comment, ActionResult as CommentActionResult, CommentData, ContactItem, ContentWidth, DateOption, DropdownAlign, DropdownPosition, DsMobileDropdownItem, FacilityCreationModalOptions, FacilityDetailData, HandbookDetailData, HandbookItem, InlineTabItem, InquiryPhoto, Language, LightboxAuthor, LightboxImage, LightboxImageOptions, LightboxMediaFile, LightboxMediaType, LightboxOptions, LightboxPdf, LightboxPdfOptions, LogoSize, LogoVariant, ModalOptions, NetworkStatus, NewFacilityData, NewInquiryData, NewInquiryModalOptions, Post, ActionResult as PostActionResult, PostDetailData, TabConfig, TimeSlot, WhitelabelConfig };

package/package.json

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

package/styles/ionic.css

@@ -18,6 +18,31 @@
 /* Mobile common styles */
 /* Note: mobile-common.css is included in @propbinder/design-system/styles/globals.css */
 
+/* Italic font faces (upright weights are declared in @propbinder/design-system/styles/globals.css) */
+@font-face {
+  font-family: "Brockmann";
+  src: url("/Brockmann/brockmann-regularitalic-webfont.woff2") format("woff2");
+  font-weight: 400;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Brockmann";
+  src: url("/Brockmann/brockmann-mediumitalic-webfont.woff2") format("woff2");
+  font-weight: 500;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Brockmann";
+  src: url("/Brockmann/brockmann-semibolditalic-webfont.woff2") format("woff2");
+  font-weight: 600;
+  font-style: italic;
+  font-display: swap;
+}
+
 /* Ionic-Specific CSS Variables */
 :root {
   /* Mobile-specific brand color for headers/backgrounds */