@propbinder/mobile-design 0.4.41 → 0.4.43

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.
Files changed (23) hide show
  1. package/README.md +63 -63
  2. package/assets/fonts/brockmann-medium-webfont.woff2 +0 -0
  3. package/assets/fonts/brockmann-mediumitalic-webfont.woff2 +0 -0
  4. package/assets/fonts/brockmann-regular-webfont.woff2 +0 -0
  5. package/assets/fonts/brockmann-regularitalic-webfont.woff2 +0 -0
  6. package/assets/fonts/brockmann-semibold-webfont.woff2 +0 -0
  7. package/assets/fonts/brockmann-semibolditalic-webfont.woff2 +0 -0
  8. package/fesm2022/{propbinder-mobile-design-ds-mobile-days-sheet-BsahIVaB.mjs → propbinder-mobile-design-ds-mobile-days-sheet-Bf7hxhB6.mjs} +51 -51
  9. package/fesm2022/propbinder-mobile-design-ds-mobile-days-sheet-Bf7hxhB6.mjs.map +1 -0
  10. package/fesm2022/{propbinder-mobile-design-ds-mobile-duration-sheet-Dun-o-dR.mjs → propbinder-mobile-design-ds-mobile-duration-sheet-BHTlCfU7.mjs} +173 -173
  11. package/fesm2022/propbinder-mobile-design-ds-mobile-duration-sheet-BHTlCfU7.mjs.map +1 -0
  12. package/fesm2022/{propbinder-mobile-design-ds-mobile-time-sheet-B9Ny4wM7.mjs → propbinder-mobile-design-ds-mobile-time-sheet-CrUB7zl-.mjs} +69 -69
  13. package/fesm2022/propbinder-mobile-design-ds-mobile-time-sheet-CrUB7zl-.mjs.map +1 -0
  14. package/fesm2022/propbinder-mobile-design.mjs +15073 -15061
  15. package/fesm2022/propbinder-mobile-design.mjs.map +1 -1
  16. package/index.d.ts +11 -4
  17. package/package.json +1 -1
  18. package/styles/ionic.css +989 -989
  19. package/styles/mobile-common.css +155 -155
  20. package/styles/mobile-page-base.css +338 -338
  21. package/fesm2022/propbinder-mobile-design-ds-mobile-days-sheet-BsahIVaB.mjs.map +0 -1
  22. package/fesm2022/propbinder-mobile-design-ds-mobile-duration-sheet-Dun-o-dR.mjs.map +0 -1
  23. package/fesm2022/propbinder-mobile-design-ds-mobile-time-sheet-B9Ny4wM7.mjs.map +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"file":"propbinder-mobile-design-ds-mobile-days-sheet-BsahIVaB.mjs","sources":["../../../projects/mobile-design-lib/src/components/facility-creation-modal/sheets/ds-mobile-days-sheet.ts"],"sourcesContent":["import { Component, signal, computed, Input, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';\r\nimport { ModalController } from '@ionic/angular/standalone';\r\nimport { DsMobileBottomSheetWrapperComponent } from '../../bottom-sheet/ds-mobile-bottom-sheet-wrapper';\r\nimport { DsMobileBottomSheetHeaderComponent } from '../../bottom-sheet/ds-mobile-bottom-sheet-header';\r\n\r\nconst ALL_DAYS = [\r\n { full: 'Mandag', short: 'Man', key: 'man' },\r\n { full: 'Tirsdag', short: 'Tir', key: 'tir' },\r\n { full: 'Onsdag', short: 'Ons', key: 'ons' },\r\n { full: 'Torsdag', short: 'Tor', key: 'tor' },\r\n { full: 'Fredag', short: 'Fre', key: 'fre' },\r\n { full: 'Lørdag', short: 'Lør', key: 'lør' },\r\n { full: 'Søndag', short: 'Søn', key: 'søn' },\r\n];\r\n\r\nconst WEEKDAY_KEYS = new Set(['man', 'tir', 'ons', 'tor', 'fre']);\r\nconst WEEKEND_KEYS = new Set(['lør', 'søn']);\r\n\r\n@Component({\r\n selector: 'ds-mobile-days-sheet',\r\n standalone: true,\r\n schemas: [CUSTOM_ELEMENTS_SCHEMA],\r\n imports: [\r\n DsMobileBottomSheetWrapperComponent,\r\n DsMobileBottomSheetHeaderComponent,\r\n ],\r\n template: `\r\n <ds-mobile-bottom-sheet-wrapper>\r\n <ds-mobile-bottom-sheet-header\r\n title=\"Dagene\"\r\n leftButtonLabel=\"Annuller\"\r\n rightButtonLabel=\"Gem\"\r\n [rightButtonDisabled]=\"!isValid()\"\r\n (leftButtonClick)=\"dismiss()\"\r\n (rightButtonClick)=\"confirmSelection()\">\r\n </ds-mobile-bottom-sheet-header>\r\n\r\n <div class=\"sheet-content\">\r\n <div class=\"day-grid\">\r\n @for (day of days; track day.full) {\r\n <button\r\n type=\"button\"\r\n class=\"day-chip\"\r\n [class.active]=\"selectedDays().has(day.full)\"\r\n (click)=\"toggleDay(day.full)\">\r\n {{ day.full }}\r\n </button>\r\n }\r\n </div>\r\n </div>\r\n </ds-mobile-bottom-sheet-wrapper>\r\n `,\r\n styles: [`\r\n .sheet-content {\r\n padding: 16px;\r\n }\r\n\r\n .day-grid {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: 8px;\r\n }\r\n\r\n .day-chip {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n height: 40px;\r\n padding: 0 16px;\r\n border-radius: 99px;\r\n border: none;\r\n background: var(--color-background-neutral-secondary, #f6f7f8);\r\n font-family: 'Brockmann', sans-serif;\r\n font-size: var(--font-size-sm, 14px);\r\n font-weight: 500;\r\n line-height: 18px;\r\n letter-spacing: -0.56px;\r\n color: var(--text-color-default-primary, #202227);\r\n cursor: pointer;\r\n -webkit-tap-highlight-color: transparent;\r\n transition: background 0.15s ease, color 0.15s ease;\r\n }\r\n\r\n .day-chip:hover:not(.active) {\r\n background: var(--color-background-neutral-secondary-hover, #ebebeb);\r\n }\r\n\r\n .day-chip:active {\r\n opacity: 0.7;\r\n }\r\n\r\n .day-chip:focus-visible {\r\n outline: 2px solid var(--color-brand-primary, #5d5fef);\r\n outline-offset: 2px;\r\n }\r\n\r\n .day-chip.active {\r\n background: var(--color-accent, #6b5ff5);\r\n color: white;\r\n }\r\n `],\r\n})\r\nexport class DsMobileDaysSheetComponent {\r\n @Input() initialDays?: string[];\r\n\r\n days = ALL_DAYS;\r\n selectedDays = signal<Set<string>>(new Set());\r\n\r\n isValid = computed(() => this.selectedDays().size > 0);\r\n\r\n constructor(private modalController: ModalController) {}\r\n\r\n ngOnInit(): void {\r\n if (this.initialDays?.length) {\r\n const fullNames = this.initialDays.map(\r\n (short) => ALL_DAYS.find((d) => d.short === short || d.full === short)?.full\r\n ).filter(Boolean) as string[];\r\n this.selectedDays.set(new Set(fullNames));\r\n } else {\r\n this.selectedDays.set(new Set(['Fredag', 'Lørdag', 'Søndag']));\r\n }\r\n }\r\n\r\n toggleDay(day: string): void {\r\n const current = new Set(this.selectedDays());\r\n current.has(day) ? current.delete(day) : current.add(day);\r\n this.selectedDays.set(current);\r\n }\r\n\r\n confirmSelection(): void {\r\n const selected = this.selectedDays();\r\n const days = ALL_DAYS.filter((d) => selected.has(d.full)).map((d) => d.short);\r\n const label = formatDaysLabel(days.map((s) => s.toLowerCase()));\r\n this.modalController.dismiss({ label, days }, 'select');\r\n }\r\n\r\n dismiss(): void {\r\n this.modalController.dismiss(null, 'cancel');\r\n }\r\n}\r\n\r\nconst CANONICAL_ORDER = ['man', 'tir', 'ons', 'tor', 'fre', 'lør', 'søn'];\r\n\r\nconst FULL_NAME: Record<string, string> = {\r\n man: 'Mandag', tir: 'Tirsdag', ons: 'Onsdag', tor: 'Torsdag',\r\n fre: 'Fredag', lør: 'Lørdag', søn: 'Søndag',\r\n};\r\n\r\nfunction capitalize(s: string): string {\r\n return s.charAt(0).toUpperCase() + s.slice(1);\r\n}\r\n\r\n/**\r\n * Given an array of lowercase weekday keys (e.g. [\"fre\",\"lør\",\"søn\"]),\r\n * returns a concise Danish label for display.\r\n */\r\nexport function formatDaysLabel(keys: string[]): string {\r\n const set = new Set(keys);\r\n\r\n if (set.size === 7) return 'Alle dage';\r\n\r\n if (set.size === 5 && [...WEEKDAY_KEYS].every((k) => set.has(k))) return 'Hverdage';\r\n\r\n if (set.size === 2 && [...WEEKEND_KEYS].every((k) => set.has(k))) return 'Weekend';\r\n\r\n if (set.size === 1) return FULL_NAME[keys[0]] ?? capitalize(keys[0]);\r\n\r\n const indices = CANONICAL_ORDER\r\n .map((d, i) => (set.has(d) ? i : -1))\r\n .filter((i) => i !== -1);\r\n\r\n if (indices.length >= 2) {\r\n const isConsecutive = indices.every(\r\n (val, i) => i === 0 || val === indices[i - 1] + 1\r\n );\r\n if (isConsecutive) {\r\n const start = capitalize(CANONICAL_ORDER[indices[0]]);\r\n const end = CANONICAL_ORDER[indices[indices.length - 1]];\r\n return `${start}\\u2013${end}`;\r\n }\r\n }\r\n\r\n return 'Udvalgte dage';\r\n}\r\n"],"names":[],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"propbinder-mobile-design-ds-mobile-duration-sheet-Dun-o-dR.mjs","sources":["../../../projects/mobile-design-lib/src/components/facility-creation-modal/sheets/ds-mobile-duration-sheet.ts"],"sourcesContent":["import { Component, signal, computed, Input, CUSTOM_ELEMENTS_SCHEMA, OnInit, PLATFORM_ID, inject } from '@angular/core';\r\nimport { CommonModule, isPlatformBrowser } from '@angular/common';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { ModalController, IonPicker, IonPickerColumn, IonPickerColumnOption } from '@ionic/angular/standalone';\r\nimport { DsMobileDropdownComponent } from '../../dropdown';\r\nimport { DsMobileBottomSheetWrapperComponent } from '../../bottom-sheet/ds-mobile-bottom-sheet-wrapper';\r\nimport { DsMobileBottomSheetHeaderComponent } from '../../bottom-sheet/ds-mobile-bottom-sheet-header';\r\n\r\n@Component({\r\n selector: 'ds-mobile-duration-sheet',\r\n standalone: true,\r\n schemas: [CUSTOM_ELEMENTS_SCHEMA],\r\n imports: [\r\n CommonModule,\r\n FormsModule,\r\n DsMobileBottomSheetWrapperComponent,\r\n DsMobileBottomSheetHeaderComponent,\r\n DsMobileDropdownComponent,\r\n IonPicker,\r\n IonPickerColumn,\r\n IonPickerColumnOption,\r\n ],\r\n template: `\r\n <ds-mobile-bottom-sheet-wrapper>\r\n <ds-mobile-bottom-sheet-header\r\n title=\"Varighed\"\r\n leftButtonLabel=\"Annuller\"\r\n rightButtonLabel=\"Gem\"\r\n [rightButtonDisabled]=\"!isValid()\"\r\n (leftButtonClick)=\"dismiss()\"\r\n (rightButtonClick)=\"confirmSelection()\">\r\n </ds-mobile-bottom-sheet-header>\r\n\r\n <div class=\"sheet-content\">\r\n <div class=\"chip-grid\">\r\n @for (option of options; track option.value) {\r\n <button\r\n type=\"button\"\r\n class=\"chip\"\r\n [id]=\"option.value === 'Vælg selv' ? 'vaelg-selv-chip' : null\"\r\n [class.active]=\"selectedDuration() === option.value\"\r\n (click)=\"selectDuration(option.value)\">\r\n @if (option.value === 'Vælg selv' && selectedDuration() === 'Vælg selv' && customLabel()) {\r\n {{ customLabel() }}\r\n } @else {\r\n {{ option.label }}\r\n }\r\n </button>\r\n }\r\n </div>\r\n\r\n @if (showInlineInputs()) {\r\n <div class=\"custom-inputs\">\r\n <input\r\n type=\"number\"\r\n class=\"number-input\"\r\n min=\"0\"\r\n [ngModel]=\"customHours()\"\r\n (ngModelChange)=\"customHours.set(+$event)\"\r\n (blur)=\"normalize()\"\r\n />\r\n <span class=\"unit\">timer</span>\r\n <input\r\n type=\"number\"\r\n class=\"number-input\"\r\n min=\"0\"\r\n max=\"59\"\r\n [ngModel]=\"customMinutes()\"\r\n (ngModelChange)=\"customMinutes.set(+$event)\"\r\n (blur)=\"normalize()\"\r\n />\r\n <span class=\"unit\">min</span>\r\n </div>\r\n }\r\n\r\n @if (!isDesktop()) {\r\n <ds-mobile-dropdown\r\n trigger=\"vaelg-selv-chip\"\r\n [isOpen]=\"pickerOpen()\"\r\n maxWidth=\"240px\"\r\n position=\"above\"\r\n (closed)=\"onPickerDismiss()\">\r\n <ng-template #customContent>\r\n <ion-picker style=\"--background: transparent; --fade-background-rgb: transparent; --highlight-background: rgba(0, 0, 0, 0.05); --highlight-border-radius: 9999px;\">\r\n <ion-picker-column\r\n [value]=\"customHours()\"\r\n style=\"--padding-start: 4px; --padding-end: 4px;\"\r\n (ionChange)=\"customHours.set(+($event.detail.value ?? customHours()))\">\r\n <div slot=\"suffix\" class=\"picker-suffix\">t</div>\r\n @for (h of hours; track h) {\r\n <ion-picker-column-option [value]=\"h\">{{ h }}</ion-picker-column-option>\r\n }\r\n </ion-picker-column>\r\n <ion-picker-column\r\n [value]=\"customMinutes()\"\r\n style=\"--padding-start: 4px; --padding-end: 4px;\"\r\n (ionChange)=\"customMinutes.set(+($event.detail.value ?? customMinutes()))\">\r\n <div slot=\"suffix\" class=\"picker-suffix\">min</div>\r\n @for (m of minuteOptions; track m) {\r\n <ion-picker-column-option [value]=\"m\">{{ m }}</ion-picker-column-option>\r\n }\r\n </ion-picker-column>\r\n </ion-picker>\r\n </ng-template>\r\n </ds-mobile-dropdown>\r\n }\r\n </div>\r\n </ds-mobile-bottom-sheet-wrapper>\r\n `,\r\n styles: [`\r\n .sheet-content {\r\n padding: 16px;\r\n }\r\n\r\n .chip-grid {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: 8px;\r\n }\r\n\r\n .chip {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n height: 40px;\r\n padding: 0 16px;\r\n border-radius: 99px;\r\n border: none;\r\n background: var(--color-background-neutral-secondary, #f6f7f8);\r\n font-family: 'Brockmann', sans-serif;\r\n font-size: var(--font-size-sm, 14px);\r\n font-weight: 500;\r\n line-height: 18px;\r\n letter-spacing: -0.56px;\r\n color: var(--text-color-default-primary, #202227);\r\n cursor: pointer;\r\n -webkit-tap-highlight-color: transparent;\r\n transition: background 0.15s ease, color 0.15s ease;\r\n }\r\n\r\n .chip:hover:not(.active) {\r\n background: var(--color-background-neutral-secondary-hover, #ebebeb);\r\n }\r\n\r\n .chip:active {\r\n opacity: 0.7;\r\n }\r\n\r\n .chip:focus-visible {\r\n outline: 2px solid var(--color-brand-primary, #5d5fef);\r\n outline-offset: 2px;\r\n }\r\n\r\n .chip.active {\r\n background: var(--color-accent, #6b5ff5);\r\n color: white;\r\n }\r\n\r\n .custom-inputs {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n margin-top: 12px;\r\n animation: fadeSlideIn 0.15s ease;\r\n }\r\n\r\n @keyframes fadeSlideIn {\r\n from { opacity: 0; transform: translateY(-4px); }\r\n to { opacity: 1; transform: translateY(0); }\r\n }\r\n\r\n .number-input {\r\n width: 64px;\r\n height: 40px;\r\n padding: 0 10px;\r\n border: 1px solid var(--border-color-default, #e3e6eb);\r\n border-radius: 99px;\r\n background: transparent;\r\n font-family: 'Brockmann', sans-serif;\r\n font-size: var(--font-size-sm, 14px);\r\n font-weight: 500;\r\n color: var(--text-color-default-primary, #202227);\r\n text-align: center;\r\n outline: none;\r\n transition: border-color 0.2s ease;\r\n }\r\n\r\n .number-input:focus {\r\n border-color: var(--color-accent, #6b5ff5);\r\n }\r\n\r\n .number-input::-webkit-inner-spin-button,\r\n .number-input::-webkit-outer-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n .number-input[type=number] {\r\n -moz-appearance: textfield;\r\n }\r\n\r\n .unit {\r\n font-family: 'Brockmann', sans-serif;\r\n font-size: var(--font-size-sm, 14px);\r\n font-weight: 500;\r\n color: var(--text-color-default-secondary, #626b78);\r\n }\r\n\r\n .picker-suffix {\r\n margin-left: -24px;\r\n font-size: 13px;\r\n color: var(--text-color-default-secondary, #626b78);\r\n }\r\n `],\r\n})\r\nexport class DsMobileDurationSheetComponent implements OnInit {\r\n private platformId = inject(PLATFORM_ID);\r\n\r\n @Input() initialDuration?: string;\r\n\r\n isDesktop = signal(false);\r\n selectedDuration = signal('1 time');\r\n pickerOpen = signal(false);\r\n customHours = signal(1);\r\n customMinutes = signal(0);\r\n\r\n options = [\r\n { value: '30 min', label: '30 min' },\r\n { value: '1 time', label: '1 time' },\r\n { value: '2 timer', label: '2 timer' },\r\n { value: 'Hele dagen', label: 'Hele dagen' },\r\n { value: 'Vælg selv', label: 'Vælg selv' },\r\n ];\r\n\r\n hours = Array.from({ length: 24 }, (_, i) => i);\r\n minuteOptions = [0, 5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 55];\r\n\r\n customLabel = computed(() => {\r\n const h = this.customHours();\r\n const m = this.customMinutes();\r\n const parts: string[] = [];\r\n if (h > 0) parts.push(`${h}t`);\r\n if (m > 0) parts.push(`${m}min`);\r\n return parts.join(' ');\r\n });\r\n\r\n showInlineInputs = computed(() =>\r\n this.selectedDuration() === 'Vælg selv' && this.isDesktop()\r\n );\r\n\r\n isValid = computed(() => {\r\n if (this.selectedDuration() === 'Vælg selv') {\r\n return this.customHours() > 0 || this.customMinutes() > 0;\r\n }\r\n return true;\r\n });\r\n\r\n constructor(private modalController: ModalController) {}\r\n\r\n ngOnInit(): void {\r\n if (isPlatformBrowser(this.platformId)) {\r\n this.isDesktop.set(window.innerWidth >= 768);\r\n }\r\n\r\n if (this.initialDuration) {\r\n const preset = this.options.find((o) => o.value === this.initialDuration);\r\n if (preset) {\r\n this.selectedDuration.set(preset.value);\r\n } else {\r\n this.selectedDuration.set('Vælg selv');\r\n this.parseCustomDuration(this.initialDuration);\r\n }\r\n }\r\n }\r\n\r\n selectDuration(value: string): void {\r\n this.selectedDuration.set(value);\r\n if (value === 'Vælg selv' && !this.isDesktop()) {\r\n this.pickerOpen.set(true);\r\n }\r\n }\r\n\r\n normalize(): void {\r\n const totalMinutes = this.customHours() * 60 + this.customMinutes();\r\n const clamped = Math.max(0, Math.min(totalMinutes, 23 * 60 + 55));\r\n this.customHours.set(Math.floor(clamped / 60));\r\n this.customMinutes.set(clamped % 60);\r\n }\r\n\r\n onPickerDismiss(): void {\r\n this.normalize();\r\n this.pickerOpen.set(false);\r\n }\r\n\r\n confirmSelection(): void {\r\n const value = this.selectedDuration() === 'Vælg selv'\r\n ? this.customLabel()\r\n : this.selectedDuration();\r\n this.modalController.dismiss({ value }, 'select');\r\n }\r\n\r\n dismiss(): void {\r\n this.modalController.dismiss(null, 'cancel');\r\n }\r\n\r\n private parseCustomDuration(str: string): void {\r\n const hMatch = str.match(/(\\d+)\\s*t/);\r\n const mMatch = str.match(/(\\d+)\\s*min/);\r\n if (hMatch) this.customHours.set(+hMatch[1]);\r\n if (mMatch) this.customMinutes.set(+mMatch[1]);\r\n }\r\n}\r\n"],"names":[],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"propbinder-mobile-design-ds-mobile-time-sheet-B9Ny4wM7.mjs","sources":["../../../projects/mobile-design-lib/src/components/facility-creation-modal/sheets/ds-mobile-time-sheet.ts"],"sourcesContent":["import { Component, signal, Input, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { ModalController } from '@ionic/angular/standalone';\r\nimport { DsMobileBottomSheetWrapperComponent } from '../../bottom-sheet/ds-mobile-bottom-sheet-wrapper';\r\nimport { DsMobileBottomSheetHeaderComponent } from '../../bottom-sheet/ds-mobile-bottom-sheet-header';\r\n\r\n@Component({\r\n selector: 'ds-mobile-time-sheet',\r\n standalone: true,\r\n schemas: [CUSTOM_ELEMENTS_SCHEMA],\r\n imports: [\r\n FormsModule,\r\n DsMobileBottomSheetWrapperComponent,\r\n DsMobileBottomSheetHeaderComponent,\r\n ],\r\n template: `\r\n <ds-mobile-bottom-sheet-wrapper>\r\n <ds-mobile-bottom-sheet-header\r\n title=\"I tidsrummet\"\r\n leftButtonLabel=\"Annuller\"\r\n rightButtonLabel=\"Gem\"\r\n (leftButtonClick)=\"dismiss()\"\r\n (rightButtonClick)=\"confirmSelection()\">\r\n </ds-mobile-bottom-sheet-header>\r\n\r\n <div class=\"sheet-content\">\r\n <div class=\"time-row\">\r\n <label class=\"time-pill\">\r\n <input\r\n type=\"time\"\r\n class=\"time-input\"\r\n [ngModel]=\"startTime()\"\r\n (ngModelChange)=\"startTime.set($event)\"\r\n />\r\n </label>\r\n\r\n <span class=\"separator\">til</span>\r\n\r\n <label class=\"time-pill\">\r\n <input\r\n type=\"time\"\r\n class=\"time-input\"\r\n [ngModel]=\"endTime()\"\r\n (ngModelChange)=\"endTime.set($event)\"\r\n />\r\n </label>\r\n </div>\r\n </div>\r\n </ds-mobile-bottom-sheet-wrapper>\r\n `,\r\n styles: [`\r\n .sheet-content {\r\n padding: 16px;\r\n }\r\n\r\n .time-row {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n }\r\n\r\n .time-pill {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex: 1;\r\n height: 40px;\r\n padding: 0 16px;\r\n border: 1px solid var(--border-color-default, #e3e6eb);\r\n border-radius: 99px;\r\n background: transparent;\r\n cursor: pointer;\r\n }\r\n\r\n .time-input {\r\n border: none;\r\n background: transparent;\r\n font-family: 'Brockmann', sans-serif;\r\n font-size: var(--font-size-sm, 14px);\r\n font-weight: 500;\r\n line-height: 18px;\r\n letter-spacing: -0.56px;\r\n color: var(--text-color-default-primary, #202227);\r\n outline: none;\r\n padding: 0;\r\n width: 100%;\r\n text-align: center;\r\n -webkit-appearance: none;\r\n appearance: none;\r\n }\r\n\r\n /* Hide the native clock icon in WebKit browsers */\r\n .time-input::-webkit-calendar-picker-indicator {\r\n display: none;\r\n -webkit-appearance: none;\r\n }\r\n\r\n .separator {\r\n font-family: 'Brockmann', sans-serif;\r\n font-size: var(--font-size-sm, 14px);\r\n font-weight: 500;\r\n line-height: 18px;\r\n letter-spacing: -0.56px;\r\n color: var(--text-color-default-secondary, #626b78);\r\n flex-shrink: 0;\r\n }\r\n `],\r\n})\r\nexport class DsMobileTimeSheetComponent {\r\n @Input() initialStart?: string;\r\n @Input() initialEnd?: string;\r\n\r\n startTime = signal('09:00');\r\n endTime = signal('17:30');\r\n\r\n constructor(private modalController: ModalController) {}\r\n\r\n ngOnInit(): void {\r\n if (this.initialStart) this.startTime.set(this.initialStart);\r\n if (this.initialEnd) this.endTime.set(this.initialEnd);\r\n }\r\n\r\n confirmSelection(): void {\r\n const value = `${this.startTime()}-${this.endTime()}`;\r\n this.modalController.dismiss({ value }, 'select');\r\n }\r\n\r\n dismiss(): void {\r\n this.modalController.dismiss(null, 'cancel');\r\n }\r\n}\r\n"],"names":[],"mappings":";;;;;;;MA4Ga,0BAA0B,CAAA;AAOjB,IAAA,eAAA;AANX,IAAA,YAAY;AACZ,IAAA,UAAU;AAEnB,IAAA,SAAS,GAAG,MAAM,CAAC,OAAO,qDAAC;AAC3B,IAAA,OAAO,GAAG,MAAM,CAAC,OAAO,mDAAC;AAEzB,IAAA,WAAA,CAAoB,eAAgC,EAAA;QAAhC,IAAA,CAAA,eAAe,GAAf,eAAe;IAAoB;IAEvD,QAAQ,GAAA;QACN,IAAI,IAAI,CAAC,YAAY;YAAE,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC;QAC5D,IAAI,IAAI,CAAC,UAAU;YAAE,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;IACxD;IAEA,gBAAgB,GAAA;AACd,QAAA,MAAM,KAAK,GAAG,CAAA,EAAG,IAAI,CAAC,SAAS,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,OAAO,EAAE,EAAE;QACrD,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,EAAE,QAAQ,CAAC;IACnD;IAEA,OAAO,GAAA;QACL,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC;IAC9C;wGArBW,0BAA0B,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,eAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAA1B,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,0BAA0B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,EAAA,YAAA,EAAA,cAAA,EAAA,UAAA,EAAA,YAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EA7F3B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,y3BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAtCC,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,8MAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,qDAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACX,mCAAmC,EAAA,QAAA,EAAA,gCAAA,EAAA,MAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACnC,kCAAkC,EAAA,QAAA,EAAA,+BAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,iBAAA,EAAA,kBAAA,EAAA,qBAAA,EAAA,oBAAA,EAAA,gBAAA,EAAA,iBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,iBAAA,EAAA,kBAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;4FA+FzB,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBAtGtC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,sBAAsB,cACpB,IAAI,EAAA,OAAA,EACP,CAAC,sBAAsB,CAAC,EAAA,OAAA,EACxB;wBACP,WAAW;wBACX,mCAAmC;wBACnC,kCAAkC;qBACnC,EAAA,QAAA,EACS,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCT,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,y3BAAA,CAAA,EAAA;;sBA4DA;;sBACA;;;;;"}