@propbinder/mobile-design 0.1.15 → 0.1.17

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/index.d.ts CHANGED
@@ -1,7 +1,8 @@
1
1
  import * as _angular_core from '@angular/core';
2
- import { AfterViewInit, ElementRef, OnDestroy, EventEmitter, OnInit, ApplicationRef, EnvironmentInjector, Type } from '@angular/core';
3
- import { IonContent, NavController, ModalController, GestureController } from '@ionic/angular/standalone';
2
+ import { AfterViewInit, OnInit, ElementRef, OnDestroy, EventEmitter, ApplicationRef, EnvironmentInjector, Type } from '@angular/core';
3
+ import { ModalController, IonContent, NavController, GestureController } from '@ionic/angular/standalone';
4
4
  import { ImpactStyle } from '@capacitor/haptics';
5
+ import { ControlValueAccessor } from '@angular/forms';
5
6
  import { Router, ActivatedRoute } from '@angular/router';
6
7
  import { Animation } from '@ionic/angular';
7
8
 
@@ -61,6 +62,237 @@ declare abstract class MobilePageBase {
61
62
  static ɵdir: _angular_core.ɵɵDirectiveDeclaration<MobilePageBase, never, never, { "contentWidth": { "alias": "contentWidth"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
62
63
  }
63
64
 
65
+ interface ActionResult {
66
+ action: string;
67
+ }
68
+ interface ActionItem {
69
+ action: string;
70
+ title: string;
71
+ icon: string;
72
+ destructive?: boolean;
73
+ }
74
+ interface ActionGroup {
75
+ actions: ActionItem[];
76
+ }
77
+ /**
78
+ * DsMobileActionsBottomSheetComponent
79
+ *
80
+ * Generic bottom sheet for displaying action lists.
81
+ * Supports custom action groups or preset content actions (posts/comments).
82
+ * Action groups are automatically separated by full-width dividers.
83
+ *
84
+ * @example Custom actions with auto-height (recommended to avoid cropping)
85
+ * ```typescript
86
+ * const sheet = await this.modalController.create({
87
+ * component: DsMobileActionsBottomSheetComponent,
88
+ * componentProps: {
89
+ * customActionGroups: [
90
+ * {
91
+ * actions: [
92
+ * { action: 'profile', title: 'Min profil', icon: 'remixUser3Line' },
93
+ * { action: 'settings', title: 'Indstillinger', icon: 'remixSettings3Line' }
94
+ * ]
95
+ * },
96
+ * {
97
+ * actions: [
98
+ * { action: 'logout', title: 'Log ud', icon: 'remixLogoutBoxLine', destructive: true }
99
+ * ]
100
+ * }
101
+ * ]
102
+ * },
103
+ * breakpoints: [0, 1],
104
+ * initialBreakpoint: 1,
105
+ * handle: true,
106
+ * cssClass: 'auto-height'
107
+ * });
108
+ *
109
+ * const result = await sheet.onWillDismiss();
110
+ * if (result.data?.action) {
111
+ * // Handle the action
112
+ * }
113
+ * ```
114
+ *
115
+ * @example Preset content actions
116
+ * ```typescript
117
+ * const sheet = await this.modalController.create({
118
+ * component: DsMobileActionsBottomSheetComponent,
119
+ * componentProps: {
120
+ * isOwnContent: false
121
+ * },
122
+ * breakpoints: [0, 1],
123
+ * initialBreakpoint: 1,
124
+ * handle: true,
125
+ * cssClass: 'auto-height'
126
+ * });
127
+ * ```
128
+ */
129
+ declare class DsMobileActionsBottomSheetComponent {
130
+ private modalController;
131
+ /**
132
+ * Custom action groups to display (overrides isOwnContent)
133
+ */
134
+ customActionGroups?: ActionGroup[];
135
+ /**
136
+ * Whether this content belongs to the current user (for preset content actions)
137
+ */
138
+ isOwnContent: boolean;
139
+ /**
140
+ * Computed action groups - uses custom groups if provided, otherwise falls back to preset content actions
141
+ */
142
+ actionGroups: _angular_core.Signal<ActionGroup[]>;
143
+ constructor(modalController: ModalController);
144
+ /**
145
+ * Handle action selection and dismiss with result
146
+ */
147
+ selectAction(action: string): void;
148
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileActionsBottomSheetComponent, never>;
149
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileActionsBottomSheetComponent, "ds-mobile-actions-bottom-sheet", never, { "customActionGroups": { "alias": "customActionGroups"; "required": false; }; "isOwnContent": { "alias": "isOwnContent"; "required": false; }; }, {}, never, never, true, never>;
150
+ }
151
+
152
+ /**
153
+ * Configuration options for the bottom sheet modal
154
+ */
155
+ interface BottomSheetOptions {
156
+ /** The component to display in the bottom sheet */
157
+ component: any;
158
+ /** Component props to pass to the modal content */
159
+ componentProps?: {
160
+ [key: string]: any;
161
+ };
162
+ /** Breakpoints for the bottom sheet (0-1 values representing percentage of screen) */
163
+ breakpoints?: number[];
164
+ /** Initial breakpoint to open the sheet at */
165
+ initialBreakpoint?: number;
166
+ /** Show/hide the drag handle */
167
+ handle?: boolean;
168
+ /** Custom CSS class for styling */
169
+ cssClass?: string | string[];
170
+ /** Whether backdrop dismisses the modal */
171
+ backdropDismiss?: boolean;
172
+ /** Backdrop opacity (0-1) */
173
+ backdropOpacity?: number;
174
+ /** Enable backdrop blur effect */
175
+ backdropBlur?: boolean;
176
+ /** Keyboard close behavior */
177
+ keyboardClose?: boolean;
178
+ /** Auto-height mode: sheet sizes to content instead of using fixed breakpoints */
179
+ autoHeight?: boolean;
180
+ }
181
+ /**
182
+ * DsMobileBottomSheetService
183
+ *
184
+ * Service for creating and managing Ionic 6 bottom sheet modals.
185
+ * Based on the Ionic blog article: https://ionic.io/blog/5-examples-of-the-new-ionic-6-bottom-sheet-modal
186
+ *
187
+ * Features:
188
+ * - Multiple breakpoints for snap-to positions
189
+ * - Customizable initial height
190
+ * - Optional drag handle
191
+ * - Backdrop blur effect
192
+ * - Custom styling support
193
+ *
194
+ * @example
195
+ * ```typescript
196
+ * constructor(private bottomSheet: DsMobileBottomSheetService) {}
197
+ *
198
+ * async openSheet() {
199
+ * const sheet = await this.bottomSheet.create({
200
+ * component: PostCreateComponent,
201
+ * breakpoints: [0, 0.5, 0.9],
202
+ * initialBreakpoint: 0.5,
203
+ * handle: true
204
+ * });
205
+ *
206
+ * const result = await sheet.onWillDismiss();
207
+ * console.log('Sheet dismissed with:', result.data);
208
+ * }
209
+ * ```
210
+ */
211
+ declare class DsMobileBottomSheetService {
212
+ private modalController;
213
+ constructor(modalController: ModalController);
214
+ /**
215
+ * Create and present a bottom sheet modal
216
+ *
217
+ * @param options Configuration options for the bottom sheet
218
+ * @returns Promise that resolves to the modal instance
219
+ */
220
+ create(options: BottomSheetOptions): Promise<HTMLIonModalElement>;
221
+ /**
222
+ * Dismiss all open modals
223
+ */
224
+ dismiss(data?: any, role?: string): Promise<boolean>;
225
+ /**
226
+ * Get the top-most modal overlay
227
+ */
228
+ getTop(): Promise<HTMLIonModalElement | undefined>;
229
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileBottomSheetService, never>;
230
+ static ɵprov: _angular_core.ɵɵInjectableDeclaration<DsMobileBottomSheetService>;
231
+ }
232
+
233
+ /**
234
+ * DsMobilePostCreateBottomSheetComponent
235
+ *
236
+ * Bottom sheet modal for creating new posts in the community feed.
237
+ * This is the modal content that gets displayed in the bottom sheet.
238
+ * Features Threads-inspired interface with rich text editing capabilities.
239
+ *
240
+ * Auto-focuses the textarea and brings up the keyboard when opened.
241
+ *
242
+ * Usage: Use with DsMobileBottomSheetService to present as a bottom sheet
243
+ */
244
+ declare class DsMobilePostCreateBottomSheetComponent implements AfterViewInit, OnInit {
245
+ private modalController;
246
+ private elementRef;
247
+ textareaInput?: ElementRef<HTMLTextAreaElement>;
248
+ fileInput?: ElementRef<HTMLInputElement>;
249
+ autoFocus: boolean;
250
+ isReadonly: boolean;
251
+ isEditMode: boolean;
252
+ postId?: string;
253
+ initialContent: string;
254
+ postContent: string;
255
+ selectedImages: _angular_core.WritableSignal<string[]>;
256
+ username: _angular_core.WritableSignal<string>;
257
+ placeholder: _angular_core.WritableSignal<string>;
258
+ modalTitle: _angular_core.WritableSignal<string>;
259
+ submitButtonLabel: _angular_core.WritableSignal<string>;
260
+ constructor(modalController: ModalController, elementRef: ElementRef);
261
+ /**
262
+ * Ensure toolbar doesn't have unnecessary padding
263
+ * Modal is already positioned below status bar, so no extra safe area needed
264
+ */
265
+ private applySafeAreaToToolbar;
266
+ ngOnInit(): void;
267
+ ngAfterViewInit(): void;
268
+ /**
269
+ * Ionic lifecycle hook - called when modal enters view
270
+ * At 95% height, this acts more like a page than a modal
271
+ * which might allow keyboard to open
272
+ */
273
+ ionViewDidEnter(): void;
274
+ handleFocus(): void;
275
+ handleInput(): void;
276
+ /**
277
+ * Auto-resize textarea based on content
278
+ */
279
+ private resizeTextarea;
280
+ canPost(): boolean;
281
+ handleCancel(): Promise<void>;
282
+ handlePost(): Promise<void>;
283
+ handleAddImage(): Promise<void>;
284
+ /**
285
+ * Restore StatusBar configuration (background task)
286
+ * Safe area padding is now handled preventively via applySafeAreaToToolbar()
287
+ */
288
+ private restoreStatusBar;
289
+ handleRemoveImage(index: number): void;
290
+ handleAddAttachment(): void;
291
+ handleFileSelect(event: Event): void;
292
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobilePostCreateBottomSheetComponent, never>;
293
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobilePostCreateBottomSheetComponent, "ds-mobile-post-create-bottom-sheet", never, {}, {}, never, never, true, never>;
294
+ }
295
+
64
296
  /**
65
297
  * DsMobilePageMainComponent
66
298
  *
@@ -105,7 +337,7 @@ declare class DsMobilePageMainComponent extends MobilePageBase implements AfterV
105
337
  private platform;
106
338
  private modalController;
107
339
  private router;
108
- private whitelabelDemoModal;
340
+ private userService;
109
341
  isNativePlatform: _angular_core.Signal<boolean>;
110
342
  title: _angular_core.InputSignal<string>;
111
343
  headerTitle: _angular_core.InputSignal<string>;
@@ -118,7 +350,34 @@ declare class DsMobilePageMainComponent extends MobilePageBase implements AfterV
118
350
  showCondensedHeader: _angular_core.InputSignal<boolean>;
119
351
  scrollThreshold: _angular_core.InputSignal<number>;
120
352
  headerFadeDistance: _angular_core.InputSignal<number>;
353
+ /**
354
+ * Profile menu action groups to display when avatar is clicked.
355
+ * If not provided, a default menu will be used (without Whitelabel Demo).
356
+ *
357
+ * @example
358
+ * ```typescript
359
+ * profileMenuItems: ActionGroup[] = [
360
+ * {
361
+ * actions: [
362
+ * { action: 'profile', title: 'Min profil', icon: 'remixUser3Line' },
363
+ * { action: 'settings', title: 'Indstillinger', icon: 'remixSettings3Line' }
364
+ * ]
365
+ * },
366
+ * {
367
+ * actions: [
368
+ * { action: 'logout', title: 'Log ud', icon: 'remixLogoutBoxLine', destructive: true }
369
+ * ]
370
+ * }
371
+ * ];
372
+ * ```
373
+ */
374
+ profileMenuItems: _angular_core.InputSignal<ActionGroup[] | undefined>;
121
375
  avatarClick: _angular_core.OutputEmitterRef<void>;
376
+ /**
377
+ * Emitted when a profile menu action is selected.
378
+ * Parent component should handle the action logic (navigation, logout, etc.).
379
+ */
380
+ profileActionSelected: _angular_core.OutputEmitterRef<ActionResult>;
122
381
  refresh: _angular_core.OutputEmitterRef<any>;
123
382
  scroll: _angular_core.OutputEmitterRef<any>;
124
383
  constructor(elementRef: ElementRef);
@@ -140,7 +399,7 @@ declare class DsMobilePageMainComponent extends MobilePageBase implements AfterV
140
399
  */
141
400
  handleRefresh(event: any): Promise<void>;
142
401
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobilePageMainComponent, never>;
143
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobilePageMainComponent, "ds-mobile-page-main", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "headerTitle": { "alias": "headerTitle"; "required": false; "isSignal": true; }; "headerSubtitle": { "alias": "headerSubtitle"; "required": false; "isSignal": true; }; "avatarType": { "alias": "avatarType"; "required": false; "isSignal": true; }; "avatarInitials": { "alias": "avatarInitials"; "required": false; "isSignal": true; }; "avatarSrc": { "alias": "avatarSrc"; "required": false; "isSignal": true; }; "avatarIconName": { "alias": "avatarIconName"; "required": false; "isSignal": true; }; "showRefresh": { "alias": "showRefresh"; "required": false; "isSignal": true; }; "showCondensedHeader": { "alias": "showCondensedHeader"; "required": false; "isSignal": true; }; "scrollThreshold": { "alias": "scrollThreshold"; "required": false; "isSignal": true; }; "headerFadeDistance": { "alias": "headerFadeDistance"; "required": false; "isSignal": true; }; }, { "avatarClick": "avatarClick"; "refresh": "refresh"; "scroll": "scroll"; }, never, ["[header-content]", "*"], true, never>;
402
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobilePageMainComponent, "ds-mobile-page-main", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "headerTitle": { "alias": "headerTitle"; "required": false; "isSignal": true; }; "headerSubtitle": { "alias": "headerSubtitle"; "required": false; "isSignal": true; }; "avatarType": { "alias": "avatarType"; "required": false; "isSignal": true; }; "avatarInitials": { "alias": "avatarInitials"; "required": false; "isSignal": true; }; "avatarSrc": { "alias": "avatarSrc"; "required": false; "isSignal": true; }; "avatarIconName": { "alias": "avatarIconName"; "required": false; "isSignal": true; }; "showRefresh": { "alias": "showRefresh"; "required": false; "isSignal": true; }; "showCondensedHeader": { "alias": "showCondensedHeader"; "required": false; "isSignal": true; }; "scrollThreshold": { "alias": "scrollThreshold"; "required": false; "isSignal": true; }; "headerFadeDistance": { "alias": "headerFadeDistance"; "required": false; "isSignal": true; }; "profileMenuItems": { "alias": "profileMenuItems"; "required": false; "isSignal": true; }; }, { "avatarClick": "avatarClick"; "profileActionSelected": "profileActionSelected"; "refresh": "refresh"; "scroll": "scroll"; }, never, ["[header-content]", "*"], true, never>;
144
403
  }
145
404
 
146
405
  /**
@@ -1303,237 +1562,6 @@ declare class DsMobileContactListItemComponent {
1303
1562
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileContactListItemComponent, "ds-mobile-contact-list-item", never, { "name": { "alias": "name"; "required": true; "isSignal": true; }; "initials": { "alias": "initials"; "required": true; "isSignal": true; }; "contactPerson": { "alias": "contactPerson"; "required": false; "isSignal": true; }; "phoneNumber": { "alias": "phoneNumber"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "showChevron": { "alias": "showChevron"; "required": false; "isSignal": true; }; }, { "contactClick": "contactClick"; }, never, never, true, never>;
1304
1563
  }
1305
1564
 
1306
- interface ActionResult {
1307
- action: string;
1308
- }
1309
- interface ActionItem {
1310
- action: string;
1311
- title: string;
1312
- icon: string;
1313
- destructive?: boolean;
1314
- }
1315
- interface ActionGroup {
1316
- actions: ActionItem[];
1317
- }
1318
- /**
1319
- * DsMobileActionsBottomSheetComponent
1320
- *
1321
- * Generic bottom sheet for displaying action lists.
1322
- * Supports custom action groups or preset content actions (posts/comments).
1323
- * Action groups are automatically separated by full-width dividers.
1324
- *
1325
- * @example Custom actions with auto-height (recommended to avoid cropping)
1326
- * ```typescript
1327
- * const sheet = await this.modalController.create({
1328
- * component: DsMobileActionsBottomSheetComponent,
1329
- * componentProps: {
1330
- * customActionGroups: [
1331
- * {
1332
- * actions: [
1333
- * { action: 'profile', title: 'Min profil', icon: 'remixUser3Line' },
1334
- * { action: 'settings', title: 'Indstillinger', icon: 'remixSettings3Line' }
1335
- * ]
1336
- * },
1337
- * {
1338
- * actions: [
1339
- * { action: 'logout', title: 'Log ud', icon: 'remixLogoutBoxLine', destructive: true }
1340
- * ]
1341
- * }
1342
- * ]
1343
- * },
1344
- * breakpoints: [0, 1],
1345
- * initialBreakpoint: 1,
1346
- * handle: true,
1347
- * cssClass: 'auto-height'
1348
- * });
1349
- *
1350
- * const result = await sheet.onWillDismiss();
1351
- * if (result.data?.action) {
1352
- * // Handle the action
1353
- * }
1354
- * ```
1355
- *
1356
- * @example Preset content actions
1357
- * ```typescript
1358
- * const sheet = await this.modalController.create({
1359
- * component: DsMobileActionsBottomSheetComponent,
1360
- * componentProps: {
1361
- * isOwnContent: false
1362
- * },
1363
- * breakpoints: [0, 1],
1364
- * initialBreakpoint: 1,
1365
- * handle: true,
1366
- * cssClass: 'auto-height'
1367
- * });
1368
- * ```
1369
- */
1370
- declare class DsMobileActionsBottomSheetComponent {
1371
- private modalController;
1372
- /**
1373
- * Custom action groups to display (overrides isOwnContent)
1374
- */
1375
- customActionGroups?: ActionGroup[];
1376
- /**
1377
- * Whether this content belongs to the current user (for preset content actions)
1378
- */
1379
- isOwnContent: boolean;
1380
- /**
1381
- * Computed action groups - uses custom groups if provided, otherwise falls back to preset content actions
1382
- */
1383
- actionGroups: _angular_core.Signal<ActionGroup[]>;
1384
- constructor(modalController: ModalController);
1385
- /**
1386
- * Handle action selection and dismiss with result
1387
- */
1388
- selectAction(action: string): void;
1389
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileActionsBottomSheetComponent, never>;
1390
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileActionsBottomSheetComponent, "ds-mobile-actions-bottom-sheet", never, { "customActionGroups": { "alias": "customActionGroups"; "required": false; }; "isOwnContent": { "alias": "isOwnContent"; "required": false; }; }, {}, never, never, true, never>;
1391
- }
1392
-
1393
- /**
1394
- * Configuration options for the bottom sheet modal
1395
- */
1396
- interface BottomSheetOptions {
1397
- /** The component to display in the bottom sheet */
1398
- component: any;
1399
- /** Component props to pass to the modal content */
1400
- componentProps?: {
1401
- [key: string]: any;
1402
- };
1403
- /** Breakpoints for the bottom sheet (0-1 values representing percentage of screen) */
1404
- breakpoints?: number[];
1405
- /** Initial breakpoint to open the sheet at */
1406
- initialBreakpoint?: number;
1407
- /** Show/hide the drag handle */
1408
- handle?: boolean;
1409
- /** Custom CSS class for styling */
1410
- cssClass?: string | string[];
1411
- /** Whether backdrop dismisses the modal */
1412
- backdropDismiss?: boolean;
1413
- /** Backdrop opacity (0-1) */
1414
- backdropOpacity?: number;
1415
- /** Enable backdrop blur effect */
1416
- backdropBlur?: boolean;
1417
- /** Keyboard close behavior */
1418
- keyboardClose?: boolean;
1419
- /** Auto-height mode: sheet sizes to content instead of using fixed breakpoints */
1420
- autoHeight?: boolean;
1421
- }
1422
- /**
1423
- * DsMobileBottomSheetService
1424
- *
1425
- * Service for creating and managing Ionic 6 bottom sheet modals.
1426
- * Based on the Ionic blog article: https://ionic.io/blog/5-examples-of-the-new-ionic-6-bottom-sheet-modal
1427
- *
1428
- * Features:
1429
- * - Multiple breakpoints for snap-to positions
1430
- * - Customizable initial height
1431
- * - Optional drag handle
1432
- * - Backdrop blur effect
1433
- * - Custom styling support
1434
- *
1435
- * @example
1436
- * ```typescript
1437
- * constructor(private bottomSheet: DsMobileBottomSheetService) {}
1438
- *
1439
- * async openSheet() {
1440
- * const sheet = await this.bottomSheet.create({
1441
- * component: PostCreateComponent,
1442
- * breakpoints: [0, 0.5, 0.9],
1443
- * initialBreakpoint: 0.5,
1444
- * handle: true
1445
- * });
1446
- *
1447
- * const result = await sheet.onWillDismiss();
1448
- * console.log('Sheet dismissed with:', result.data);
1449
- * }
1450
- * ```
1451
- */
1452
- declare class DsMobileBottomSheetService {
1453
- private modalController;
1454
- constructor(modalController: ModalController);
1455
- /**
1456
- * Create and present a bottom sheet modal
1457
- *
1458
- * @param options Configuration options for the bottom sheet
1459
- * @returns Promise that resolves to the modal instance
1460
- */
1461
- create(options: BottomSheetOptions): Promise<HTMLIonModalElement>;
1462
- /**
1463
- * Dismiss all open modals
1464
- */
1465
- dismiss(data?: any, role?: string): Promise<boolean>;
1466
- /**
1467
- * Get the top-most modal overlay
1468
- */
1469
- getTop(): Promise<HTMLIonModalElement | undefined>;
1470
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobileBottomSheetService, never>;
1471
- static ɵprov: _angular_core.ɵɵInjectableDeclaration<DsMobileBottomSheetService>;
1472
- }
1473
-
1474
- /**
1475
- * DsMobilePostCreateBottomSheetComponent
1476
- *
1477
- * Bottom sheet modal for creating new posts in the community feed.
1478
- * This is the modal content that gets displayed in the bottom sheet.
1479
- * Features Threads-inspired interface with rich text editing capabilities.
1480
- *
1481
- * Auto-focuses the textarea and brings up the keyboard when opened.
1482
- *
1483
- * Usage: Use with DsMobileBottomSheetService to present as a bottom sheet
1484
- */
1485
- declare class DsMobilePostCreateBottomSheetComponent implements AfterViewInit, OnInit {
1486
- private modalController;
1487
- private elementRef;
1488
- textareaInput?: ElementRef<HTMLTextAreaElement>;
1489
- fileInput?: ElementRef<HTMLInputElement>;
1490
- autoFocus: boolean;
1491
- isReadonly: boolean;
1492
- isEditMode: boolean;
1493
- postId?: string;
1494
- initialContent: string;
1495
- postContent: string;
1496
- selectedImages: _angular_core.WritableSignal<string[]>;
1497
- username: _angular_core.WritableSignal<string>;
1498
- placeholder: _angular_core.WritableSignal<string>;
1499
- modalTitle: _angular_core.WritableSignal<string>;
1500
- submitButtonLabel: _angular_core.WritableSignal<string>;
1501
- constructor(modalController: ModalController, elementRef: ElementRef);
1502
- /**
1503
- * Ensure toolbar doesn't have unnecessary padding
1504
- * Modal is already positioned below status bar, so no extra safe area needed
1505
- */
1506
- private applySafeAreaToToolbar;
1507
- ngOnInit(): void;
1508
- ngAfterViewInit(): void;
1509
- /**
1510
- * Ionic lifecycle hook - called when modal enters view
1511
- * At 95% height, this acts more like a page than a modal
1512
- * which might allow keyboard to open
1513
- */
1514
- ionViewDidEnter(): void;
1515
- handleFocus(): void;
1516
- handleInput(): void;
1517
- /**
1518
- * Auto-resize textarea based on content
1519
- */
1520
- private resizeTextarea;
1521
- canPost(): boolean;
1522
- handleCancel(): Promise<void>;
1523
- handlePost(): Promise<void>;
1524
- handleAddImage(): Promise<void>;
1525
- /**
1526
- * Restore StatusBar configuration (background task)
1527
- * Safe area padding is now handled preventively via applySafeAreaToToolbar()
1528
- */
1529
- private restoreStatusBar;
1530
- handleRemoveImage(index: number): void;
1531
- handleAddAttachment(): void;
1532
- handleFileSelect(event: Event): void;
1533
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsMobilePostCreateBottomSheetComponent, never>;
1534
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobilePostCreateBottomSheetComponent, "ds-mobile-post-create-bottom-sheet", never, {}, {}, never, never, true, never>;
1535
- }
1536
-
1537
1565
  interface TabConfig {
1538
1566
  id: string;
1539
1567
  label: string;
@@ -1638,6 +1666,7 @@ declare class DsMobileTabBarComponent implements OnInit, AfterViewInit, OnDestro
1638
1666
  private routerSubscription?;
1639
1667
  private router?;
1640
1668
  private modalController;
1669
+ private userService;
1641
1670
  constructor(elementRef: ElementRef);
1642
1671
  ngOnInit(): void;
1643
1672
  ngAfterViewInit(): void;
@@ -3110,6 +3139,87 @@ declare class DsMobileHandbookFolderMiniComponent {
3110
3139
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMobileHandbookFolderMiniComponent, "ds-mobile-handbook-folder-mini", never, { "variant": { "alias": "variant"; "required": false; }; "iconName": { "alias": "iconName"; "required": false; }; }, {}, never, never, true, never>;
3111
3140
  }
3112
3141
 
3142
+ /**
3143
+ * DsTextInputComponent
3144
+ *
3145
+ * Mobile-first text input field component following the design system.
3146
+ * Supports email, phone, text, and other input types.
3147
+ *
3148
+ * Features:
3149
+ * - All design system states (default, hover, focus, error, disabled)
3150
+ * - Validation error state with destructive border color
3151
+ * - Automatic error clearing when input becomes valid (configurable)
3152
+ * - Built-in validation based on input type or custom validator function
3153
+ * - Accessible with proper ARIA attributes
3154
+ * - ControlValueAccessor for Angular forms integration
3155
+ *
3156
+ * @example
3157
+ * ```html
3158
+ * <!-- Basic usage -->
3159
+ * <ds-text-input
3160
+ * type="email"
3161
+ * placeholder="Enter your email"
3162
+ * [(ngModel)]="email">
3163
+ * </ds-text-input>
3164
+ *
3165
+ * <!-- With validation error and auto-clear -->
3166
+ * <ds-text-input
3167
+ * type="email"
3168
+ * placeholder="Enter your email"
3169
+ * [hasError]="emailInvalid"
3170
+ * errorMessage="Please enter a valid email"
3171
+ * [autoClearError]="true"
3172
+ * (errorCleared)="emailInvalid = false"
3173
+ * [(ngModel)]="email">
3174
+ * </ds-text-input>
3175
+ *
3176
+ * <!-- With custom validator -->
3177
+ * <ds-text-input
3178
+ * type="text"
3179
+ * placeholder="Enter phone number"
3180
+ * [validator]="phoneValidator"
3181
+ * [hasError]="phoneInvalid"
3182
+ * (errorCleared)="phoneInvalid = false"
3183
+ * [(ngModel)]="phone">
3184
+ * </ds-text-input>
3185
+ * ```
3186
+ */
3187
+ declare class DsTextInputComponent implements ControlValueAccessor {
3188
+ type: _angular_core.InputSignal<"search" | "text" | "email" | "tel" | "password" | "url">;
3189
+ placeholder: _angular_core.InputSignal<string>;
3190
+ disabled: _angular_core.InputSignal<boolean>;
3191
+ readonly: _angular_core.InputSignal<boolean>;
3192
+ required: _angular_core.InputSignal<boolean>;
3193
+ hasError: _angular_core.InputSignal<boolean>;
3194
+ errorMessage: _angular_core.InputSignal<string>;
3195
+ autocomplete: _angular_core.InputSignal<string>;
3196
+ inputmode: _angular_core.InputSignal<"search" | "text" | "email" | "tel" | "url" | "numeric" | undefined>;
3197
+ autoClearError: _angular_core.InputSignal<boolean>;
3198
+ validator: _angular_core.InputSignal<((value: string) => boolean) | null>;
3199
+ valueChange: _angular_core.OutputEmitterRef<string>;
3200
+ blur: _angular_core.OutputEmitterRef<FocusEvent>;
3201
+ focus: _angular_core.OutputEmitterRef<FocusEvent>;
3202
+ errorCleared: _angular_core.OutputEmitterRef<void>;
3203
+ private _value;
3204
+ value: _angular_core.Signal<string>;
3205
+ inputId: string;
3206
+ private onChange;
3207
+ private onTouched;
3208
+ onInput(event: Event): void;
3209
+ /**
3210
+ * Validates the input value based on type or custom validator
3211
+ */
3212
+ private validateInput;
3213
+ onBlur(): void;
3214
+ onFocus(): void;
3215
+ writeValue(value: string): void;
3216
+ registerOnChange(fn: (value: string) => void): void;
3217
+ registerOnTouched(fn: () => void): void;
3218
+ setDisabledState(isDisabled: boolean): void;
3219
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsTextInputComponent, never>;
3220
+ 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>;
3221
+ }
3222
+
3113
3223
  /**
3114
3224
  * User service for managing current user data globally
3115
3225
  */
@@ -3117,15 +3227,23 @@ declare class UserService {
3117
3227
  private _avatarInitials;
3118
3228
  private _avatarType;
3119
3229
  private _avatarSrc;
3230
+ private _profileMenuItems;
3120
3231
  readonly avatarInitials: _angular_core.Signal<string>;
3121
3232
  readonly avatarType: _angular_core.Signal<"initials" | "photo" | "icon">;
3122
3233
  readonly avatarSrc: _angular_core.Signal<string>;
3234
+ readonly profileMenuItems: _angular_core.Signal<ActionGroup[] | undefined>;
3123
3235
  /**
3124
3236
  * Update avatar configuration
3125
3237
  */
3126
3238
  setAvatarInitials(initials: string): void;
3127
3239
  setAvatarType(type: 'initials' | 'photo' | 'icon'): void;
3128
3240
  setAvatarSrc(src: string): void;
3241
+ /**
3242
+ * Set profile menu items globally.
3243
+ * This will be used by both ds-mobile-tab-bar and ds-mobile-page-main
3244
+ * if they don't receive profileMenuItems as an input.
3245
+ */
3246
+ setProfileMenuItems(items: ActionGroup[]): void;
3129
3247
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<UserService, never>;
3130
3248
  static ɵprov: _angular_core.ɵɵInjectableDeclaration<UserService>;
3131
3249
  }
@@ -3281,7 +3399,9 @@ declare class MobileTabsExampleComponent implements OnInit {
3281
3399
  tabs: TabConfig[];
3282
3400
  /**
3283
3401
  * Profile menu items configuration.
3284
- * Define once here, and the tab bar component handles opening/closing the menu.
3402
+ * Define once here - this is set globally in UserService in ngOnInit(),
3403
+ * so it will be used by both ds-mobile-tab-bar and ds-mobile-page-main components
3404
+ * throughout the entire application.
3285
3405
  */
3286
3406
  profileMenuItems: ActionGroup[];
3287
3407
  /**
@@ -3485,5 +3605,5 @@ declare const customPageTransition: (_: HTMLElement, opts: any) => Animation;
3485
3605
  */
3486
3606
  declare const customBackTransition: (_: HTMLElement, opts: any) => Animation;
3487
3607
 
3488
- export { ActionCommentComponent, ActionLikeComponent, ContentRowComponent, DsMobileActionsBottomSheetComponent, DsMobileBottomSheetService, DsMobileActionsBottomSheetComponent as DsMobileCommentActionsBottomSheetComponent, DsMobileCommentComponent, DsMobileContactListItemComponent, DsMobileContentComponent, DsMobileContentSectionComponent, DsMobileHandbookDetailModalComponent, DsMobileHandbookDetailModalService, DsMobileHandbookFolderComponent, DsMobileHandbookFolderMiniComponent, DsMobileHeaderContentComponent, DsMobileHeaderContentTileComponent, DsMobileInlinePhotoComponent, DsMobileInlineTabsComponent, DsMobileInteractiveListItemInquiryComponent, DsMobileInteractiveListItemMessageComponent, DsMobileInteractiveListItemPostComponent, DsMobileLightboxImageComponent as DsMobileLightboxComponent, DsMobileLightboxFooterComponent, DsMobileLightboxHeaderComponent, DsMobileLightboxImageComponent, DsMobileLightboxPdfComponent, DsMobileLightboxService, DsMobileListItemComponent, DsMobileListItemStaticComponent, DsMobileLongPressDirective, DsMobileModalService, DsMobilePageDetailsComponent, DsMobilePageMainComponent, DsMobileActionsBottomSheetComponent as DsMobilePostActionsBottomSheetComponent, DsMobilePostComposerComponent, DsMobilePostCreateBottomSheetComponent, DsMobilePostDetailModalComponent, DsMobilePostDetailModalService, DsMobileTabBarComponent, DsMobileTabsComponent, MobileCommunityPageComponent, MobileHandbookPageComponent, MobileHomePageComponent, MobileInquiriesPageComponent, MobileInquiryDetailPageComponent, MobilePageBase, MobilePostDetailPageComponent, MobileTabsExampleComponent, PostActionsComponent, PostAttachmentsComponent, PostContentComponent, PostCreatePageComponent, PostMediaComponent, PostPdfAttachmentComponent, PostTextComponent, SectionHeaderComponent, TileContentComponent, TileIconComponent, TileLabelComponent, TileValueComponent, UserService, WhitelabelDemoPage, WhitelabelService, customBackTransition, customPageTransition };
3608
+ export { ActionCommentComponent, ActionLikeComponent, ContentRowComponent, DsMobileActionsBottomSheetComponent, DsMobileBottomSheetService, DsMobileActionsBottomSheetComponent as DsMobileCommentActionsBottomSheetComponent, DsMobileCommentComponent, DsMobileContactListItemComponent, DsMobileContentComponent, DsMobileContentSectionComponent, DsMobileHandbookDetailModalComponent, DsMobileHandbookDetailModalService, DsMobileHandbookFolderComponent, DsMobileHandbookFolderMiniComponent, DsMobileHeaderContentComponent, DsMobileHeaderContentTileComponent, DsMobileInlinePhotoComponent, DsMobileInlineTabsComponent, DsMobileInteractiveListItemInquiryComponent, DsMobileInteractiveListItemMessageComponent, DsMobileInteractiveListItemPostComponent, DsMobileLightboxImageComponent as DsMobileLightboxComponent, DsMobileLightboxFooterComponent, DsMobileLightboxHeaderComponent, DsMobileLightboxImageComponent, DsMobileLightboxPdfComponent, DsMobileLightboxService, DsMobileListItemComponent, DsMobileListItemStaticComponent, DsMobileLongPressDirective, DsMobileModalService, DsMobilePageDetailsComponent, DsMobilePageMainComponent, DsMobileActionsBottomSheetComponent as DsMobilePostActionsBottomSheetComponent, DsMobilePostComposerComponent, DsMobilePostCreateBottomSheetComponent, DsMobilePostDetailModalComponent, DsMobilePostDetailModalService, DsMobileTabBarComponent, DsMobileTabsComponent, DsTextInputComponent, MobileCommunityPageComponent, MobileHandbookPageComponent, MobileHomePageComponent, MobileInquiriesPageComponent, MobileInquiryDetailPageComponent, MobilePageBase, MobilePostDetailPageComponent, MobileTabsExampleComponent, PostActionsComponent, PostAttachmentsComponent, PostContentComponent, PostCreatePageComponent, PostMediaComponent, PostPdfAttachmentComponent, PostTextComponent, SectionHeaderComponent, TileContentComponent, TileIconComponent, TileLabelComponent, TileValueComponent, UserService, WhitelabelDemoPage, WhitelabelService, customBackTransition, customPageTransition };
3489
3609
  export type { ActionGroup, ActionItem, ActionResult, AttachmentItem, BottomSheetOptions, ActionResult as CommentActionResult, CommentData, ContactItem, ContentWidth, HandbookDetailData, HandbookItem, InlineTabItem, LightboxAuthor, LightboxImage, LightboxImageOptions, LightboxMediaFile, LightboxMediaType, LightboxOptions, LightboxPdf, LightboxPdfOptions, ModalOptions, ActionResult as PostActionResult, PostDetailData, TabConfig, WhitelabelConfig };