@updevs/components 1.0.0-alpha.5 → 1.0.0-alpha.50

package/fesm2022/updevs-components-calendar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"updevs-components-calendar.mjs","sources":["../../../../libs/components/calendar/src/models/date-range.model.ts","../../../../libs/components/calendar/src/models/enums/calendar-view.enum.ts","../../../../libs/components/calendar/src/services/calendar-range-strategy.service.ts","../../../../libs/components/calendar/src/calendar.component.ts","../../../../libs/components/calendar/src/calendar.component.html","../../../../libs/components/calendar/src/services/calendar-signals.service.ts","../../../../libs/components/calendar/src/upd-calendar.module.ts","../../../../libs/components/calendar/src/updevs-components-calendar.ts"],"sourcesContent":["/**\n * A class representing a range of dates.\n */\nexport class DateRangeModel {\n    constructor(\n        /**\n         * The start date of the range.\n         */\n        readonly start?: Date,\n        /**\n         * The end date of the range.\n         */\n        readonly end?: Date\n    ) {\n    }\n}\n","export enum CalendarViewEnum {\n    Days = 'days',\n    Months = 'months',\n    Years = 'years'\n}\n","import { Injectable, inject } from '@angular/core';\nimport { DateService } from '@updevs/sdk/core';\nimport { OptionalType } from '@updevs/sdk/types';\n\nimport { DateRangeModel } from '../models/date-range.model';\n\n/**\n * Provides the default date range selection behavior.\n */\n@Injectable()\nexport class CalendarRangeStrategyService {\n    private readonly dateService = inject(DateService);\n\n    /**\n     * Called when the user has finished selecting a value.\n     * @param date Date that was selected. Will be null if the user cleared the selection.\n     * @param currentRange Range that is currently show in the calendar.\n     */\n    selectionFinished(date: OptionalType<Date>, currentRange: DateRangeModel): DateRangeModel {\n        let { start, end } = currentRange;\n\n        if (start === undefined) {\n            start = date;\n        } else if (end === undefined && date && this.dateService.compare(date, start) >= 0) {\n            end = date;\n        } else {\n            start = date;\n            end = undefined;\n        }\n\n        return new DateRangeModel(start, end);\n    }\n\n    /**\n     * Called when the user has activated a new date (e.g. by hovering over\n     * it or moving focus) and the calendar tries to display a date range.\n     *\n     * @param activeDate Date that the user has activated. Will be null if the user moved\n     *    focus to an element that's no a calendar cell.\n     * @param currentRange Range that is currently shown in the calendar.\n     */\n    createPreview(activeDate: OptionalType<Date>, currentRange: DateRangeModel): DateRangeModel {\n        let start: OptionalType<Date>;\n        let end: OptionalType<Date>;\n\n        if (!!currentRange.start && !currentRange.end && !!activeDate) {\n            start = currentRange.start;\n            end = activeDate;\n        }\n\n        return new DateRangeModel(start, end);\n    }\n\n    /**\n     * Called when the user has dragged a date in the currently selected range to another\n     * date. Returns the date updated range that should result from this interaction.\n     *\n     * @param dragOrigin The date the user started dragging from.\n     * @param originalRange The originally selected date range.\n     * @param newDate The currently targeted date in the drag operation.\n     */\n    createDrag(dragOrigin: Date, originalRange: DateRangeModel, newDate: Date): OptionalType<DateRangeModel> {\n        let start = originalRange.start;\n        let end = originalRange.end;\n\n        if (!start || !end) {\n            // Can't drag from an incomplete range.\n            return undefined;\n        }\n\n        const isRange = this.dateService.compare(start, end) !== 0;\n        const diffYears = newDate.getFullYear() - dragOrigin.getFullYear();\n        const diffMonths = newDate.getMonth() - dragOrigin.getMonth();\n        const diffDays = newDate.getDate() - dragOrigin.getDate();\n\n        if (isRange && this.dateService.areEqual(dragOrigin, originalRange.start)) {\n            start = newDate;\n\n            if (this.dateService.compare(newDate, end) > 0) {\n                end = this.dateService.addYears(end, diffYears);\n                end = this.dateService.addMonths(end, diffMonths);\n                end = this.dateService.addDays(end, diffDays);\n            }\n        } else if (isRange && this.dateService.areEqual(dragOrigin, originalRange.end)) {\n            end = newDate;\n\n            if (this.dateService.compare(newDate, start) < 0) {\n                start = this.dateService.addYears(start, diffYears);\n                start = this.dateService.addMonths(start, diffMonths);\n                start = this.dateService.addDays(start, diffDays);\n            }\n        } else {\n            start = this.dateService.addYears(start, diffYears);\n            start = this.dateService.addMonths(start, diffMonths);\n            start = this.dateService.addDays(start, diffDays);\n            end = this.dateService.addYears(end, diffYears);\n            end = this.dateService.addMonths(end, diffMonths);\n            end = this.dateService.addDays(end, diffDays);\n        }\n\n        return new DateRangeModel(start, end);\n    }\n}\n","import { Component, OnInit, inject, signal, computed, input, output } from '@angular/core';\nimport { DateService } from '@updevs/sdk/core';\nimport { OptionalType } from '@updevs/sdk/types';\n\nimport { CalendarViewEnum } from './models/enums/calendar-view.enum';\nimport { CalendarDateModel } from './models/calendar-date.model';\nimport { CalendarMonthModel } from './models/calendar-month.model';\nimport { CalendarYearModel } from './models/calendar-year.model';\nimport { CalendarSelectedModel } from './models/calendar-selected.model';\n\n@Component({\n    selector: 'upd-calendar',\n    templateUrl: './calendar.component.html',\n    styleUrls: ['./calendar.component.scss']\n})\nexport class CalendarComponent implements OnInit {\n    readonly selectedDate = input<OptionalType<Date>>();\n    readonly selectedStartDate = input<OptionalType<Date>>();\n    readonly selectedEndDate = input<OptionalType<Date>>();\n    readonly minDate = input<OptionalType<Date>>();\n    readonly maxDate = input<OptionalType<Date>>();\n    readonly disabledDatesFilter = input<OptionalType<(date: Date) => boolean>>();\n    readonly isRange = input<boolean>(false);\n    readonly shouldRemoveExternalBorder = input<boolean>(false);\n\n    readonly selected = output<OptionalType<CalendarSelectedModel>>();\n    readonly monthChanged = output<Date>();\n\n    CalendarViewEnum = CalendarViewEnum;\n\n    readonly currentView = signal<CalendarViewEnum>(CalendarViewEnum.Days);\n    readonly currentDate = signal<Date>(new Date());\n    readonly yearRange = signal<{ start: number; end: number }>({ start: 2020, end: 2030 });\n    readonly currentYear = computed(() => this.currentDate().getFullYear());\n    readonly currentMonth = computed(() => this.currentDate().getMonth());\n    readonly currentMonthName = computed(() =>\n        this.dateService.format(this.currentDate(), { month: 'short', year: 'numeric' }).toUpperCase()\n    );\n    readonly calendarDays = computed(() => this.generateCalendarDays());\n    readonly calendarMonths = computed(() => this.generateCalendarMonths());\n    readonly calendarYears = computed(() => this.generateCalendarYears());\n    readonly weekDayNames = computed(() => this.dateService.getDayOfWeekNames('narrow'));\n\n    private readonly internalSelectedDate = signal<OptionalType<Date>>(undefined);\n    private readonly internalSelectedStartDate = signal<OptionalType<Date>>(undefined);\n    private readonly internalSelectedEndDate = signal<OptionalType<Date>>(undefined);\n    private readonly dateService = inject(DateService);\n    private rangeSelectionState: 'start' | 'end' = 'start';\n\n    ngOnInit(): void {\n        this.syncInternalState();\n\n        if (this.selectedDate()) {\n            this.currentDate.set(new Date(this.selectedDate()!));\n        } else if (this.selectedStartDate()) {\n            this.currentDate.set(new Date(this.selectedStartDate()!));\n        }\n\n        this.updateYearRange();\n    }\n\n    onHeaderClick(): void {\n        switch (this.currentView()) {\n            case CalendarViewEnum.Days:\n                this.currentView.set(CalendarViewEnum.Months);\n                break;\n            case CalendarViewEnum.Months:\n                this.currentView.set(CalendarViewEnum.Years);\n                break;\n        }\n    }\n\n    onPreviousClick(): void {\n        const current = this.currentDate();\n\n        switch (this.currentView()) {\n            case CalendarViewEnum.Days:\n                this.currentDate.set(this.dateService.addMonths(current, -1));\n                this.monthChanged.emit(this.currentDate());\n                break;\n            case CalendarViewEnum.Months:\n                this.currentDate.set(this.dateService.addYears(current, -1));\n                break;\n            case CalendarViewEnum.Years:\n                this.moveYearRange(-12);\n                break;\n        }\n    }\n\n    onNextClick(): void {\n        const current = this.currentDate();\n\n        switch (this.currentView()) {\n            case CalendarViewEnum.Days:\n                this.currentDate.set(this.dateService.addMonths(current, 1));\n                this.monthChanged.emit(this.currentDate());\n                break;\n            case CalendarViewEnum.Months:\n                this.currentDate.set(this.dateService.addYears(current, 1));\n                break;\n            case CalendarViewEnum.Years:\n                this.moveYearRange(12);\n                break;\n        }\n    }\n\n    onDateClick(dateModel: CalendarDateModel): void {\n        if (!dateModel.isCurrentMonth) {\n            return;\n        }\n\n        if (dateModel.isDisabled) {\n            return;\n        }\n\n        if (this.isRange()) {\n            this.handleRangeSelection(dateModel.date);\n        } else {\n            this.internalSelectedDate.set(dateModel.date);\n            this.selected.emit({ selectedDate: dateModel.date });\n        }\n    }\n\n    onMonthClick(monthModel: CalendarMonthModel): void {\n        if (monthModel.isDisabled) {\n            return;\n        }\n\n        const newDate = new Date(this.currentYear(), monthModel.monthIndex, 1);\n\n        this.currentDate.set(newDate);\n        this.currentView.set(CalendarViewEnum.Days);\n        this.monthChanged.emit(newDate);\n    }\n\n    onYearClick(yearModel: CalendarYearModel): void {\n        if (yearModel.isDisabled) {\n            return;\n        }\n\n        const newDate = new Date(yearModel.year, this.currentMonth(), 1);\n\n        this.currentDate.set(newDate);\n        this.currentView.set(CalendarViewEnum.Months);\n    }\n\n    clearSelection(): void {\n        this.internalSelectedDate.set(undefined);\n        this.internalSelectedStartDate.set(undefined);\n        this.internalSelectedEndDate.set(undefined);\n\n        this.rangeSelectionState = 'start';\n\n        this.selected.emit(undefined);\n    }\n\n    private syncInternalState(): void {\n        this.internalSelectedDate.set(this.selectedDate());\n        this.internalSelectedStartDate.set(this.selectedStartDate());\n        this.internalSelectedEndDate.set(this.selectedEndDate());\n    }\n\n    private handleRangeSelection(selectedDate: Date): void {\n        if (this.rangeSelectionState === 'start' || !this.internalSelectedStartDate()) {\n            this.internalSelectedStartDate.set(selectedDate);\n            this.internalSelectedEndDate.set(undefined);\n            this.rangeSelectionState = 'end';\n\n            this.selected.emit({ startDate: selectedDate });\n        } else {\n            const startDate = this.internalSelectedStartDate()!;\n            const endDate = selectedDate;\n\n            if (this.dateService.compare(selectedDate, startDate) < 0) {\n                this.internalSelectedStartDate.set(selectedDate);\n                this.internalSelectedEndDate.set(startDate);\n                this.selected.emit({\n                    startDate: selectedDate,\n                    endDate: startDate\n                });\n            } else {\n                this.internalSelectedEndDate.set(endDate);\n                this.selected.emit({\n                    startDate: startDate,\n                    endDate: endDate\n                });\n            }\n\n            this.rangeSelectionState = 'start';\n        }\n    }\n\n    private generateCalendarDays(): CalendarDateModel[] {\n        const current = this.currentDate();\n        const year = current.getFullYear();\n        const month = current.getMonth();\n        const firstDayOfMonth = new Date(year, month, 1);\n        const lastDayOfMonth = new Date(year, month + 1, 0);\n        const firstDayOfWeek = firstDayOfMonth.getDay();\n        const days: CalendarDateModel[] = [];\n        const today = new Date();\n\n        if (firstDayOfWeek > 0) {\n            const prevMonthLastDay = new Date(year, month, 0);\n            const startDate = prevMonthLastDay.getDate() - firstDayOfWeek + 1;\n\n            for (let day = startDate; day <= prevMonthLastDay.getDate(); day++) {\n                const date = new Date(year, month - 1, day);\n                days.push({\n                    date,\n                    isCurrentMonth: false,\n                    isToday: this.dateService.areEqual(date, today),\n                    isSelected: false,\n                    isDisabled: true,\n                    isInRange: false,\n                    isRangeStart: false,\n                    isRangeEnd: false\n                });\n            }\n        }\n\n        for (let day = 1; day <= lastDayOfMonth.getDate(); day++) {\n            const date = new Date(year, month, day);\n            days.push({\n                date,\n                isCurrentMonth: true,\n                isToday: this.dateService.areEqual(date, today),\n                isSelected: this.isDateSelected(date),\n                isDisabled: this.isDateDisabled(date),\n                isInRange: this.isDateInRange(date),\n                isRangeStart: this.isDateRangeStart(date),\n                isRangeEnd: this.isDateRangeEnd(date)\n            });\n        }\n\n        const totalCells = Math.ceil(days.length / 7) * 7;\n        const nextMonthDays = totalCells - days.length;\n\n        for (let day = 1; day <= nextMonthDays; day++) {\n            const date = new Date(year, month + 1, day);\n            days.push({\n                date,\n                isCurrentMonth: false,\n                isToday: this.dateService.areEqual(date, today),\n                isSelected: false,\n                isDisabled: true,\n                isInRange: false,\n                isRangeStart: false,\n                isRangeEnd: false\n            });\n        }\n\n        return days;\n    }\n\n    private generateCalendarMonths(): CalendarMonthModel[] {\n        const currentYear = this.currentYear();\n        const currentMonth = this.currentMonth();\n        const today = new Date();\n        const monthNames = this.dateService.getMonthNames('short');\n\n        return monthNames.map((name, index) => ({\n            monthIndex: index,\n            name: name.toUpperCase(),\n            isCurrentMonth: today.getFullYear() === currentYear && today.getMonth() === index,\n            isSelected: currentMonth === index,\n            isDisabled: this.isMonthDisabled(currentYear, index)\n        }));\n    }\n\n    private generateCalendarYears(): CalendarYearModel[] {\n        const range = this.yearRange();\n        const currentYear = this.currentYear();\n        const today = new Date();\n        const years: CalendarYearModel[] = [];\n\n        for (let year = range.start; year <= range.end; year++) {\n            years.push({\n                year,\n                isCurrentYear: today.getFullYear() === year,\n                isSelected: currentYear === year,\n                isDisabled: this.isYearDisabled(year)\n            });\n        }\n\n        return years;\n    }\n\n    private isDateSelected(date: Date): boolean {\n        if (this.isRange()) {\n            if (this.internalSelectedStartDate() && this.dateService.areEqual(date, this.internalSelectedStartDate()!)) {\n                return true;\n            }\n\n            return !!(this.internalSelectedEndDate() && this.dateService.areEqual(date, this.internalSelectedEndDate()!));\n        } else {\n            return this.internalSelectedDate() ? this.dateService.areEqual(date, this.internalSelectedDate()!) : false;\n        }\n    }\n\n    private isDateInRange(date: Date): boolean {\n        if (!this.isRange() || !this.internalSelectedStartDate() || !this.internalSelectedEndDate()) {\n            return false;\n        }\n\n        return this.dateService.compare(date, this.internalSelectedStartDate()!) > 0\n            && this.dateService.compare(date, this.internalSelectedEndDate()!) < 0;\n    }\n\n    private isDateRangeStart(date: Date): boolean {\n        return this.isRange() && this.internalSelectedStartDate()\n            ? this.dateService.areEqual(date, this.internalSelectedStartDate()!)\n            : false;\n    }\n\n    private isDateRangeEnd(date: Date): boolean {\n        return this.isRange() && this.internalSelectedEndDate()\n            ? this.dateService.areEqual(date, this.internalSelectedEndDate()!)\n            : false;\n    }\n\n    private isDateDisabled(date: Date): boolean {\n        if (this.minDate() && this.dateService.compare(date, this.minDate()!) < 0) {\n            return true;\n        }\n\n        if (this.maxDate() && this.dateService.compare(date, this.maxDate()!) > 0) {\n            return true;\n        }\n\n        const filterFn = this.disabledDatesFilter();\n\n        if (!!filterFn) {\n            return !filterFn(date);\n        }\n\n        return false;\n    }\n\n    private isMonthDisabled(year: number, month: number): boolean {\n        const firstDayOfMonth = new Date(year, month, 1);\n        const lastDayOfMonth = new Date(year, month + 1, 0);\n\n        if (this.minDate() && this.dateService.compare(lastDayOfMonth, this.minDate()!) < 0) {\n            return true;\n        }\n\n        return !!(this.maxDate() && this.dateService.compare(firstDayOfMonth, this.maxDate()!) > 0);\n    }\n\n    private isYearDisabled(year: number): boolean {\n        const firstDayOfYear = new Date(year, 0, 1);\n        const lastDayOfYear = new Date(year, 11, 31);\n\n        if (this.minDate() && this.dateService.compare(lastDayOfYear, this.minDate()!) < 0) {\n            return true;\n        }\n\n        return !!(this.maxDate() && this.dateService.compare(firstDayOfYear, this.maxDate()!) > 0);\n    }\n\n    private updateYearRange(): void {\n        const currentYear = this.currentYear();\n        this.yearRange.set({\n            start: currentYear - 6,\n            end: currentYear + 5\n        });\n    }\n\n    private moveYearRange(offset: number): void {\n        const current = this.yearRange();\n        this.yearRange.set({\n            start: current.start + offset,\n            end: current.end + offset\n        });\n    }\n}\n","<div class=\"calendar\" [class.calendar-border]=\"!shouldRemoveExternalBorder()\">\n    <div class=\"calendar-header\">\n        <button type=\"button\" class=\"btn btn-sm btn-ghost-secondary\" (click)=\"onPreviousClick()\">\n            <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" stroke-width=\"2\"\n                stroke=\"currentColor\" fill=\"none\">\n                <path stroke=\"none\" d=\"m0 0h24v24H0z\" fill=\"none\" />\n                <path d=\"m15 6-6 6 6 6\" />\n            </svg>\n        </button>\n\n        <button type=\"button\" class=\"btn btn-sm btn-ghost-secondary calendar-title\" (click)=\"onHeaderClick()\">\n            @switch (currentView()) {\n                @case (CalendarViewEnum.Days) {\n                    {{ currentMonthName() }}\n                }\n                @case (CalendarViewEnum.Months) {\n                    {{ currentYear() }}\n                }\n                @case (CalendarViewEnum.Years) {\n                    {{ yearRange().start }} - {{ yearRange().end }}\n                }\n            }\n            <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"icon ms-1\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" stroke-width=\"2\"\n                stroke=\"currentColor\" fill=\"none\">\n                <path stroke=\"none\" d=\"m0 0h24v24H0z\" fill=\"none\" />\n                <path d=\"m6 9 6 6 6-6\" />\n            </svg>\n        </button>\n\n        <button type=\"button\" class=\"btn btn-sm btn-ghost-secondary\" (click)=\"onNextClick()\">\n            <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"icon\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" stroke-width=\"2\"\n                stroke=\"currentColor\" fill=\"none\">\n                <path stroke=\"none\" d=\"m0 0h24v24H0z\" fill=\"none\" />\n                <path d=\"m9 6 6 6-6 6\" />\n            </svg>\n        </button>\n    </div>\n\n    @if (currentView() === CalendarViewEnum.Days) {\n        <div class=\"calendar-weekdays\">\n            @for (dayName of weekDayNames(); track dayName) {\n                <div class=\"calendar-weekday\">{{ dayName }}</div>\n            }\n        </div>\n\n        <div class=\"calendar-days\">\n            @for (day of calendarDays(); track day.date.getTime()) {\n                <button type=\"button\" class=\"calendar-day\" [class.calendar-day-other-month]=\"!day.isCurrentMonth\"\n                    [class.calendar-day-today]=\"day.isToday\" [class.calendar-day-selected]=\"day.isSelected\"\n                    [class.calendar-day-in-range]=\"day.isInRange\" [class.calendar-day-range-start]=\"day.isRangeStart\"\n                    [class.calendar-day-range-end]=\"day.isRangeEnd\" [disabled]=\"day.isDisabled\" (click)=\"onDateClick(day)\">\n                    {{ day.date.getDate() }}\n                </button>\n            }\n        </div>\n    }\n\n    @if (currentView() === CalendarViewEnum.Months) {\n        <div class=\"calendar-months\">\n            @for (month of calendarMonths(); track month.monthIndex) {\n                <button type=\"button\" class=\"calendar-month\" [class.calendar-month-current]=\"month.isCurrentMonth\"\n                    [class.calendar-month-selected]=\"month.isSelected\" [disabled]=\"month.isDisabled\" (click)=\"onMonthClick(month)\">\n                    {{ month.name }}\n                </button>\n            }\n        </div>\n    }\n\n    @if (currentView() === CalendarViewEnum.Years) {\n        <div class=\"calendar-years\">\n            @for (year of calendarYears(); track year.year) {\n                <button type=\"button\" class=\"calendar-year\" [class.calendar-year-current]=\"year.isCurrentYear\"\n                    [class.calendar-year-selected]=\"year.isSelected\" [disabled]=\"year.isDisabled\" (click)=\"onYearClick(year)\">\n                    {{ year.year }}\n                </button>\n            }\n        </div>\n    }\n</div>\n","import { Injectable, signal, Signal } from '@angular/core';\nimport { OptionalType } from '@updevs/sdk/types';\n\nimport { CalendarViewType } from '../types/calendar-view.type';\nimport { DateRangeModel } from '../models/date-range.model';\n\n@Injectable()\nexport class CalendarSignalsService {\n    get minDate(): Signal<OptionalType<Date>> {\n        return this.minDateSignal.asReadonly();\n    }\n    set minDate(value: OptionalType<Date>) {\n        this.minDateSignal.set(value);\n    }\n    get maxDate(): Signal<OptionalType<Date>> {\n        return this.maxDateSignal.asReadonly();\n    }\n    set maxDate(value: OptionalType<Date>) {\n        this.maxDateSignal.set(value);\n    }\n    get activeDate(): Signal<Date> {\n        return this.activeDateSignal.asReadonly();\n    }\n    set activeDate(value: Date) {\n        this.activeDateSignal.set(value);\n    }\n    get selectedDate(): Signal<DateRangeModel | OptionalType<Date>> {\n        return this.selectedDateSignal.asReadonly();\n    }\n    set selectedDate(value: OptionalType<DateRangeModel | OptionalType<Date>>) {\n        this.selectedDateSignal.set(value);\n    }\n    get currentView(): Signal<CalendarViewType> {\n        return this.currentViewSignal.asReadonly();\n    }\n    set currentView(value: CalendarViewType) {\n        this.currentViewSignal.set(value);\n    }\n\n    private readonly minDateSignal = signal<OptionalType<Date>>(undefined);\n    private readonly maxDateSignal = signal<OptionalType<Date>>(undefined);\n    private readonly activeDateSignal = signal<Date>(new Date());\n    private readonly selectedDateSignal = signal<DateRangeModel | OptionalType<Date>>(undefined);\n    private readonly currentViewSignal = signal<CalendarViewType>('month');\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { UpdButtonModule } from '@updevs/components/button';\nimport { UpdIconsModule } from '@updevs/icons';\nimport { TranslocoService, TranslocoDirective } from '@jsverse/transloco';\n\nimport * as en from './assets/i18n/en.json';\nimport * as pt from './assets/i18n/pt.json';\nimport { CalendarSignalsService } from './services/calendar-signals.service';\nimport { CalendarRangeStrategyService } from './services/calendar-range-strategy.service';\nimport { CalendarComponent } from './calendar.component';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        UpdButtonModule,\n        TranslocoDirective,\n        UpdIconsModule\n    ],\n    declarations: [\n        CalendarComponent\n    ],\n    exports: [\n        CalendarComponent\n    ],\n    providers: [\n        CalendarSignalsService,\n        CalendarRangeStrategyService\n    ]\n})\nexport class UpdCalendarModule {\n    constructor(translocoService: TranslocoService) {\n        translocoService.setFallbackLangForMissingTranslation({ fallbackLang: 'en' });\n        translocoService.setTranslation(en, 'en');\n        translocoService.setTranslation(pt, 'pt');\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["en","pt"],"mappings":"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"}

package/fesm2022/updevs-components-card.mjs

@@ -0,0 +1,238 @@
+import * as i0 from '@angular/core';
+import { inject, TemplateRef, Directive, Input, ContentChild, HostBinding, ViewEncapsulation, Component, NgModule } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i2 from '@updevs/icons';
+import { UpdIconsModule } from '@updevs/icons';
+import * as i3 from '@updevs/components/button';
+import { UpdButtonModule } from '@updevs/components/button';
+
+class CardActionsDirective {
+    constructor() {
+        this.templateRef = inject((TemplateRef));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: CardActionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.1.0", type: CardActionsDirective, selector: "ng-template[updCardActions]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: CardActionsDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[updCardActions]'
+                }]
+        }] });
+
+class CardFooterDirective {
+    constructor() {
+        this.templateRef = inject((TemplateRef));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: CardFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.1.0", type: CardFooterDirective, selector: "ng-template[updCardFooter]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: CardFooterDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[updCardFooter]'
+                }]
+        }] });
+
+class CardHeaderDirective {
+    constructor() {
+        this.templateRef = inject((TemplateRef));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: CardHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.1.0", type: CardHeaderDirective, selector: "ng-template[updCardHeader]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: CardHeaderDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[updCardHeader]'
+                }]
+        }] });
+
+class CardImageDirective {
+    constructor() {
+        this.templateRef = inject((TemplateRef));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: CardImageDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.1.0", type: CardImageDirective, selector: "ng-template[updCardImage]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: CardImageDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[updCardImage]'
+                }]
+        }] });
+
+class CardComponent {
+    constructor() {
+        this.wrapperClasses = '';
+        this.stampBackground = 'primary';
+        this.statusPosition = 'top';
+        this.ribbonStyle = 'default';
+        this.ribbonIcon = { tablerIcon: 'star' };
+        this.removeBorder = false;
+        this.useLightHeader = false;
+        /**
+         * Whether the header should be displayed.
+         */
+        this.showHeader = true;
+        this.isFooterTransparent = false;
+        this.showProgressBar = false;
+        this.actions = [];
+        this.classes = [];
+    }
+    ngOnInit() {
+        this.updateClasses();
+    }
+    ngOnChanges(changes) {
+        this.updateClasses();
+    }
+    updateClasses() {
+        const lClasses = [];
+        if (this.removeBorder) {
+            lClasses.push('card-borderless');
+        }
+        if (!!this.hoverEffect) {
+            lClasses.push('card-link');
+            if (this.hoverEffect !== 'default') {
+                lClasses.push(`card-link-${this.hoverEffect}`);
+            }
+        }
+        if (!!this.state) {
+            lClasses.push(`card-${this.state}`);
+        }
+        if (!!this.bgColor) {
+            lClasses.push(`bg-${this.bgColor}`);
+        }
+        if (!!this.rotate) {
+            lClasses.push(`card-rotate-${this.rotate}`);
+        }
+        if (!!this.type) {
+            lClasses.push(`card-${this.type}`);
+        }
+        if (!!this.hoverEffect) {
+            this.classes = [...lClasses];
+        }
+        else {
+            this.wrapperClasses = 'card ' + lClasses.join(' ');
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.0", type: CardComponent, selector: "upd-card", inputs: { wrapperClasses: "wrapperClasses", title: "title", subtitle: "subtitle", hoverEffect: "hoverEffect", state: "state", type: "type", imagePosition: "imagePosition", bgColor: "bgColor", stampIcon: "stampIcon", stampBackground: "stampBackground", statusBackground: "statusBackground", statusPosition: "statusPosition", ribbonBackground: "ribbonBackground", ribbonStyle: "ribbonStyle", ribbonIcon: "ribbonIcon", ribbonText: "ribbonText", rotate: "rotate", removeBorder: "removeBorder", useLightHeader: "useLightHeader", showHeader: "showHeader", isFooterTransparent: "isFooterTransparent", footerText: "footerText", showProgressBar: "showProgressBar", progress: "progress", actions: "actions" }, host: { properties: { "class": "this.wrapperClasses" } }, queries: [{ propertyName: "headerTemplate", first: true, predicate: CardHeaderDirective, descendants: true }, { propertyName: "footerTemplate", first: true, predicate: CardFooterDirective, descendants: true }, { propertyName: "imageTemplate", first: true, predicate: CardImageDirective, descendants: true }, { propertyName: "actionsTemplate", first: true, predicate: CardActionsDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template *ngIf=\"!hoverEffect; else linkTpl\" [ngTemplateOutlet]=\"structureTpl\"></ng-template>\n\n<!-- Template for cards that are links -->\n<ng-template #linkTpl>\n    <a href=\"#\" class=\"card\" [ngClass]=\"classes\">\n        <ng-template [ngTemplateOutlet]=\"structureTpl\"></ng-template>\n    </a>\n</ng-template>\n\n<ng-template #structureTpl>\n    <!-- Ribbon -->\n    <div *ngIf=\"!!ribbonBackground\" class=\"ribbon {{ribbonStyle === 'default' ? '' : 'ribbon-' + ribbonStyle}} bg-{{ribbonBackground}}\">\n        <span *ngIf=\"!!ribbonText; else ribbonIconTpl\">{{ribbonText}}</span>\n        <ng-template #ribbonIconTpl>\n            <upd-icon [model]=\"ribbonIcon\" wrapperClasses=\"icon\" [removeDefaultClasses]=\"true\"></upd-icon>\n        </ng-template>\n    </div>\n\n    <!-- Status -->\n    <div *ngIf=\"!!statusBackground\" class=\"card-status-{{statusPosition}} bg-{{statusBackground}}\"></div>\n\n    <!-- Stamp -->\n    <div *ngIf=\"!!stampIcon\" class=\"card-stamp\">\n        <div class=\"card-stamp-icon bg-{{stampBackground}}\">\n            <upd-icon [model]=\"stampIcon\" wrapperClasses=\"icon\" [removeDefaultClasses]=\"true\"></upd-icon>\n        </div>\n    </div>\n\n    <!-- Header section -->\n    <div *ngIf=\"showHeader && (!!title || !!headerTemplate?.templateRef)\" class=\"card-header\" [class.card-header-light]=\"useLightHeader\">\n        <ng-container *ngIf=\"!headerTemplate?.templateRef; else customHeaderTpl\">\n            <h3 class=\"card-title\">{{title}} <span *ngIf=\"!!subtitle\" class=\"card-subtitle\">{{subtitle}}</span></h3>\n        </ng-container>\n        <ng-template #customHeaderTpl [ngTemplateOutlet]=\"headerTemplate?.templateRef || null\"></ng-template>\n\n        <!-- Actions -->\n        <div *ngIf=\"!!actionsTemplate || actions.length > 0\" class=\"card-actions\">\n            <ng-container *ngIf=\"actions.length > 0; else customActionsTpl\">\n                <upd-button *ngFor=\"let btn of actions\" [model]=\"btn\" customClasses=\"me-1\"></upd-button>\n            </ng-container>\n            <ng-template #customActionsTpl [ngTemplateOutlet]=\"actionsTemplate?.templateRef || null\"></ng-template>\n        </div>\n    </div>\n\n    <!-- Body -->\n    <ng-container *ngIf=\"!!imageTemplate; else bodyTpl\">\n        <ng-template *ngIf=\"imagePosition === 'left' || imagePosition === 'right'; else bodyWithTopBottomImageTpl\"\n            [ngTemplateOutlet]=\"bodyWithSideImageTpl\"></ng-template>\n    </ng-container>\n\n    <!-- Footer -->\n    <div *ngIf=\"!!footerText || !!footerTemplate\" class=\"card-footer\" [class.card-footer-transparent]=\"isFooterTransparent\">\n        <ng-container *ngIf=\"!footerTemplate?.templateRef; else customFooterTpl\">\n            <span *ngIf=\"!!footerText\">{{footerText}}</span>\n        </ng-container>\n        <ng-template #customFooterTpl [ngTemplateOutlet]=\"footerTemplate?.templateRef || null\"></ng-template>\n    </div>\n\n    <!-- Progress bar -->\n    <div *ngIf=\"showProgressBar\" class=\"progress progress-sm card-progress\">\n        <div class=\"progress-bar\" [style.width.%]=\"progress\" role=\"progressbar\" [attr.aria-valuenow]=\"progress\" aria-valuemin=\"0\"\n            aria-valuemax=\"100\">\n        </div>\n    </div>\n</ng-template>\n\n<!-- Body with an image on either side -->\n<ng-template #bodyWithSideImageTpl>\n    <div class=\"row row-0\">\n        <div class=\"col-3\" [class.order-md-last]=\"imagePosition === 'right'\">\n            <div class=\"card-image-{{imagePosition}}\">\n                <ng-template [ngTemplateOutlet]=\"imageTemplate!.templateRef\"></ng-template>\n            </div>\n        </div>\n        <div class=\"col\">\n            <ng-template [ngTemplateOutlet]=\"bodyTpl\"></ng-template>\n        </div>\n    </div>\n</ng-template>\n\n<!-- Body with an image on top or bottom -->\n<ng-template #bodyWithTopBottomImageTpl>\n    <div *ngIf=\"imagePosition === 'top'\" class=\"img-responsive-21x9 card-img-top\">\n        <div class=\"card-image-{{imagePosition}}\">\n            <ng-template [ngTemplateOutlet]=\"imageTemplate!.templateRef\"></ng-template>\n        </div>\n    </div>\n    <ng-template [ngTemplateOutlet]=\"bodyTpl\"></ng-template>\n    <div *ngIf=\"imagePosition === 'bottom'\" class=\"img-responsive-21x9 card-img-bottom\">\n        <div class=\"card-image-{{imagePosition}}\">\n            <ng-template [ngTemplateOutlet]=\"imageTemplate!.templateRef\"></ng-template>\n        </div>\n    </div>\n</ng-template>\n\n<!-- Body -->\n<ng-template #bodyTpl>\n    <div class=\"card-body\">\n        <!-- If title was set, but the header section is hidden, we add the title to the body -->\n        <ng-container *ngIf=\"!showHeader && !!title\">\n            <h3 class=\"card-title\">{{title}} <span *ngIf=\"!!subtitle\" class=\"card-subtitle\">{{subtitle}}</span></h3>\n        </ng-container>\n        <ng-content></ng-content>\n    </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.IconComponent, selector: "upd-icon", inputs: ["model", "wrapperClasses", "color", "colorClass", "removeDefaultClasses", "customClasses", "tablerIcon", "tablerIconWeight", "tablerIconType", "tablerIconSize", "heroIcon", "heroIconSize", "heroIconType"] }, { kind: "component", type: i3.ButtonComponent, selector: "upd-button", inputs: ["model", "text", "brandColorStyle", "customClasses", "isOutline", "isGhost", "isSquare", "isPill", "isIcon", "isLoading", "isList", "isFloating", "isAction", "isNavigationLink", "isLink", "shouldIgnoreBtnClass", "iconModel", "iconPosition", "isDisabled", "isActive", "badgeConfig", "colorStyle", "size", "title"], outputs: ["clicked"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: CardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'upd-card', encapsulation: ViewEncapsulation.None, template: "<ng-template *ngIf=\"!hoverEffect; else linkTpl\" [ngTemplateOutlet]=\"structureTpl\"></ng-template>\n\n<!-- Template for cards that are links -->\n<ng-template #linkTpl>\n    <a href=\"#\" class=\"card\" [ngClass]=\"classes\">\n        <ng-template [ngTemplateOutlet]=\"structureTpl\"></ng-template>\n    </a>\n</ng-template>\n\n<ng-template #structureTpl>\n    <!-- Ribbon -->\n    <div *ngIf=\"!!ribbonBackground\" class=\"ribbon {{ribbonStyle === 'default' ? '' : 'ribbon-' + ribbonStyle}} bg-{{ribbonBackground}}\">\n        <span *ngIf=\"!!ribbonText; else ribbonIconTpl\">{{ribbonText}}</span>\n        <ng-template #ribbonIconTpl>\n            <upd-icon [model]=\"ribbonIcon\" wrapperClasses=\"icon\" [removeDefaultClasses]=\"true\"></upd-icon>\n        </ng-template>\n    </div>\n\n    <!-- Status -->\n    <div *ngIf=\"!!statusBackground\" class=\"card-status-{{statusPosition}} bg-{{statusBackground}}\"></div>\n\n    <!-- Stamp -->\n    <div *ngIf=\"!!stampIcon\" class=\"card-stamp\">\n        <div class=\"card-stamp-icon bg-{{stampBackground}}\">\n            <upd-icon [model]=\"stampIcon\" wrapperClasses=\"icon\" [removeDefaultClasses]=\"true\"></upd-icon>\n        </div>\n    </div>\n\n    <!-- Header section -->\n    <div *ngIf=\"showHeader && (!!title || !!headerTemplate?.templateRef)\" class=\"card-header\" [class.card-header-light]=\"useLightHeader\">\n        <ng-container *ngIf=\"!headerTemplate?.templateRef; else customHeaderTpl\">\n            <h3 class=\"card-title\">{{title}} <span *ngIf=\"!!subtitle\" class=\"card-subtitle\">{{subtitle}}</span></h3>\n        </ng-container>\n        <ng-template #customHeaderTpl [ngTemplateOutlet]=\"headerTemplate?.templateRef || null\"></ng-template>\n\n        <!-- Actions -->\n        <div *ngIf=\"!!actionsTemplate || actions.length > 0\" class=\"card-actions\">\n            <ng-container *ngIf=\"actions.length > 0; else customActionsTpl\">\n                <upd-button *ngFor=\"let btn of actions\" [model]=\"btn\" customClasses=\"me-1\"></upd-button>\n            </ng-container>\n            <ng-template #customActionsTpl [ngTemplateOutlet]=\"actionsTemplate?.templateRef || null\"></ng-template>\n        </div>\n    </div>\n\n    <!-- Body -->\n    <ng-container *ngIf=\"!!imageTemplate; else bodyTpl\">\n        <ng-template *ngIf=\"imagePosition === 'left' || imagePosition === 'right'; else bodyWithTopBottomImageTpl\"\n            [ngTemplateOutlet]=\"bodyWithSideImageTpl\"></ng-template>\n    </ng-container>\n\n    <!-- Footer -->\n    <div *ngIf=\"!!footerText || !!footerTemplate\" class=\"card-footer\" [class.card-footer-transparent]=\"isFooterTransparent\">\n        <ng-container *ngIf=\"!footerTemplate?.templateRef; else customFooterTpl\">\n            <span *ngIf=\"!!footerText\">{{footerText}}</span>\n        </ng-container>\n        <ng-template #customFooterTpl [ngTemplateOutlet]=\"footerTemplate?.templateRef || null\"></ng-template>\n    </div>\n\n    <!-- Progress bar -->\n    <div *ngIf=\"showProgressBar\" class=\"progress progress-sm card-progress\">\n        <div class=\"progress-bar\" [style.width.%]=\"progress\" role=\"progressbar\" [attr.aria-valuenow]=\"progress\" aria-valuemin=\"0\"\n            aria-valuemax=\"100\">\n        </div>\n    </div>\n</ng-template>\n\n<!-- Body with an image on either side -->\n<ng-template #bodyWithSideImageTpl>\n    <div class=\"row row-0\">\n        <div class=\"col-3\" [class.order-md-last]=\"imagePosition === 'right'\">\n            <div class=\"card-image-{{imagePosition}}\">\n                <ng-template [ngTemplateOutlet]=\"imageTemplate!.templateRef\"></ng-template>\n            </div>\n        </div>\n        <div class=\"col\">\n            <ng-template [ngTemplateOutlet]=\"bodyTpl\"></ng-template>\n        </div>\n    </div>\n</ng-template>\n\n<!-- Body with an image on top or bottom -->\n<ng-template #bodyWithTopBottomImageTpl>\n    <div *ngIf=\"imagePosition === 'top'\" class=\"img-responsive-21x9 card-img-top\">\n        <div class=\"card-image-{{imagePosition}}\">\n            <ng-template [ngTemplateOutlet]=\"imageTemplate!.templateRef\"></ng-template>\n        </div>\n    </div>\n    <ng-template [ngTemplateOutlet]=\"bodyTpl\"></ng-template>\n    <div *ngIf=\"imagePosition === 'bottom'\" class=\"img-responsive-21x9 card-img-bottom\">\n        <div class=\"card-image-{{imagePosition}}\">\n            <ng-template [ngTemplateOutlet]=\"imageTemplate!.templateRef\"></ng-template>\n        </div>\n    </div>\n</ng-template>\n\n<!-- Body -->\n<ng-template #bodyTpl>\n    <div class=\"card-body\">\n        <!-- If title was set, but the header section is hidden, we add the title to the body -->\n        <ng-container *ngIf=\"!showHeader && !!title\">\n            <h3 class=\"card-title\">{{title}} <span *ngIf=\"!!subtitle\" class=\"card-subtitle\">{{subtitle}}</span></h3>\n        </ng-container>\n        <ng-content></ng-content>\n    </div>\n</ng-template>\n" }]
+        }], propDecorators: { wrapperClasses: [{
+                type: HostBinding,
+                args: ['class']
+            }, {
+                type: Input
+            }], headerTemplate: [{
+                type: ContentChild,
+                args: [CardHeaderDirective]
+            }], footerTemplate: [{
+                type: ContentChild,
+                args: [CardFooterDirective]
+            }], imageTemplate: [{
+                type: ContentChild,
+                args: [CardImageDirective]
+            }], actionsTemplate: [{
+                type: ContentChild,
+                args: [CardActionsDirective]
+            }], title: [{
+                type: Input
+            }], subtitle: [{
+                type: Input
+            }], hoverEffect: [{
+                type: Input
+            }], state: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], imagePosition: [{
+                type: Input
+            }], bgColor: [{
+                type: Input
+            }], stampIcon: [{
+                type: Input
+            }], stampBackground: [{
+                type: Input
+            }], statusBackground: [{
+                type: Input
+            }], statusPosition: [{
+                type: Input
+            }], ribbonBackground: [{
+                type: Input
+            }], ribbonStyle: [{
+                type: Input
+            }], ribbonIcon: [{
+                type: Input
+            }], ribbonText: [{
+                type: Input
+            }], rotate: [{
+                type: Input
+            }], removeBorder: [{
+                type: Input
+            }], useLightHeader: [{
+                type: Input
+            }], showHeader: [{
+                type: Input
+            }], isFooterTransparent: [{
+                type: Input
+            }], footerText: [{
+                type: Input
+            }], showProgressBar: [{
+                type: Input
+            }], progress: [{
+                type: Input
+            }], actions: [{
+                type: Input
+            }] } });
+
+class UpdCardModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: UpdCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.0", ngImport: i0, type: UpdCardModule, declarations: [CardComponent,
+            CardHeaderDirective,
+            CardFooterDirective,
+            CardImageDirective,
+            CardActionsDirective], imports: [CommonModule,
+            UpdIconsModule,
+            UpdButtonModule], exports: [CardComponent,
+            CardHeaderDirective,
+            CardFooterDirective,
+            CardImageDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: UpdCardModule, imports: [CommonModule,
+            UpdIconsModule,
+            UpdButtonModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: UpdCardModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        UpdIconsModule,
+                        UpdButtonModule
+                    ],
+                    declarations: [
+                        CardComponent,
+                        CardHeaderDirective,
+                        CardFooterDirective,
+                        CardImageDirective,
+                        CardActionsDirective
+                    ],
+                    exports: [
+                        CardComponent,
+                        CardHeaderDirective,
+                        CardFooterDirective,
+                        CardImageDirective
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CardActionsDirective, CardComponent, CardFooterDirective, CardHeaderDirective, CardImageDirective, UpdCardModule };
+//# sourceMappingURL=updevs-components-card.mjs.map

package/fesm2022/updevs-components-card.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"updevs-components-card.mjs","sources":["../../../../libs/components/card/src/directives/card-actions.directive.ts","../../../../libs/components/card/src/directives/card-footer.directive.ts","../../../../libs/components/card/src/directives/card-header.directive.ts","../../../../libs/components/card/src/directives/card-image.directive.ts","../../../../libs/components/card/src/card.component.ts","../../../../libs/components/card/src/card.component.html","../../../../libs/components/card/src/upd-card.module.ts","../../../../libs/components/card/src/updevs-components-card.ts"],"sourcesContent":["import { Directive, TemplateRef, inject } from '@angular/core';\n\n@Directive({\n    selector: 'ng-template[updCardActions]'\n})\nexport class CardActionsDirective {\n    public readonly templateRef = inject(TemplateRef<any>);\n}\n","import { Directive, TemplateRef, inject } from '@angular/core';\n\n@Directive({\n    selector: 'ng-template[updCardFooter]'\n})\nexport class CardFooterDirective {\n    public readonly templateRef = inject(TemplateRef<any>);\n}\n","import { Directive, TemplateRef, inject } from '@angular/core';\n\n@Directive({\n    selector: 'ng-template[updCardHeader]'\n})\nexport class CardHeaderDirective {\n    public readonly templateRef = inject(TemplateRef<any>);\n}\n","import { Directive, TemplateRef, inject } from '@angular/core';\n\n@Directive({\n    selector: 'ng-template[updCardImage]'\n})\nexport class CardImageDirective {\n    public readonly templateRef = inject(TemplateRef<any>);\n}\n","import {\n    Component,\n    Input,\n    ContentChild,\n    SimpleChanges,\n    OnInit,\n    OnChanges,\n    ViewEncapsulation, HostBinding\n} from '@angular/core';\nimport { ButtonModel } from '@updevs/sdk/layout';\nimport { TopBottomLeftRightType, BgColorStyleType } from '@updevs/sdk/types';\nimport { IconModel } from '@updevs/icons';\n\nimport { CardFooterDirective } from './directives/card-footer.directive';\nimport { CardHeaderDirective } from './directives/card-header.directive';\nimport { HoverEffectType } from './types/hover-effect.type';\nimport { CardStateType } from './types/card-state.type';\nimport { StatusPositionType } from './types/status-position.type';\nimport { RibbonStyleType } from './types/ribbon-style.type';\nimport { CardStyleType } from './types/card-style.type';\nimport { CardImageDirective } from './directives/card-image.directive';\nimport { CardActionsDirective } from './directives/card-actions.directive';\n\n@Component({\n    selector: 'upd-card',\n    templateUrl: './card.component.html',\n    styleUrls: ['./card.component.scss'],\n    encapsulation: ViewEncapsulation.None\n})\nexport class CardComponent implements OnInit, OnChanges {\n    @HostBinding('class') @Input() wrapperClasses = '';\n    @ContentChild(CardHeaderDirective) headerTemplate?: CardHeaderDirective;\n    @ContentChild(CardFooterDirective) footerTemplate?: CardFooterDirective;\n    @ContentChild(CardImageDirective) imageTemplate?: CardImageDirective;\n    @ContentChild(CardActionsDirective) actionsTemplate?: CardActionsDirective;\n\n    @Input() title?: string;\n    @Input() subtitle?: string;\n    @Input() hoverEffect?: HoverEffectType;\n    @Input() state?: CardStateType;\n    @Input() type?: CardStyleType;\n    @Input() imagePosition?: TopBottomLeftRightType;\n    @Input() bgColor?: BgColorStyleType;\n    @Input() stampIcon?: IconModel;\n    @Input() stampBackground: BgColorStyleType = 'primary';\n    @Input() statusBackground?: BgColorStyleType;\n    @Input() statusPosition: StatusPositionType = 'top';\n    @Input() ribbonBackground?: BgColorStyleType;\n    @Input() ribbonStyle: RibbonStyleType = 'default';\n    @Input() ribbonIcon?: IconModel = { tablerIcon: 'star' };\n    @Input() ribbonText?: string;\n    @Input() rotate?: 'right' | 'left';\n    @Input() removeBorder = false;\n    @Input() useLightHeader = false;\n    /**\n     * Whether the header should be displayed.\n     */\n    @Input() showHeader = true;\n    @Input() isFooterTransparent = false;\n    @Input() footerText?: string;\n    @Input() showProgressBar = false;\n    @Input() progress?: number;\n    @Input() actions: ButtonModel[] = [];\n\n    classes: string[] = [];\n\n    ngOnInit(): void {\n        this.updateClasses();\n    }\n\n    ngOnChanges(changes: SimpleChanges): void {\n        this.updateClasses();\n    }\n\n    private updateClasses(): void {\n        const lClasses: string[] = [];\n\n        if (this.removeBorder) {\n            lClasses.push('card-borderless');\n        }\n\n        if (!!this.hoverEffect) {\n            lClasses.push('card-link');\n\n            if (this.hoverEffect !== 'default') {\n                lClasses.push(`card-link-${this.hoverEffect}`);\n            }\n        }\n\n        if (!!this.state) {\n            lClasses.push(`card-${this.state}`);\n        }\n\n        if (!!this.bgColor) {\n            lClasses.push(`bg-${this.bgColor}`);\n        }\n\n        if (!!this.rotate) {\n            lClasses.push(`card-rotate-${this.rotate}`);\n        }\n\n        if (!!this.type) {\n            lClasses.push(`card-${this.type}`);\n        }\n\n        if (!!this.hoverEffect) {\n            this.classes = [...lClasses];\n        } else {\n            this.wrapperClasses = 'card ' + lClasses.join(' ');\n        }\n    }\n}\n","<ng-template *ngIf=\"!hoverEffect; else linkTpl\" [ngTemplateOutlet]=\"structureTpl\"></ng-template>\n\n<!-- Template for cards that are links -->\n<ng-template #linkTpl>\n    <a href=\"#\" class=\"card\" [ngClass]=\"classes\">\n        <ng-template [ngTemplateOutlet]=\"structureTpl\"></ng-template>\n    </a>\n</ng-template>\n\n<ng-template #structureTpl>\n    <!-- Ribbon -->\n    <div *ngIf=\"!!ribbonBackground\" class=\"ribbon {{ribbonStyle === 'default' ? '' : 'ribbon-' + ribbonStyle}} bg-{{ribbonBackground}}\">\n        <span *ngIf=\"!!ribbonText; else ribbonIconTpl\">{{ribbonText}}</span>\n        <ng-template #ribbonIconTpl>\n            <upd-icon [model]=\"ribbonIcon\" wrapperClasses=\"icon\" [removeDefaultClasses]=\"true\"></upd-icon>\n        </ng-template>\n    </div>\n\n    <!-- Status -->\n    <div *ngIf=\"!!statusBackground\" class=\"card-status-{{statusPosition}} bg-{{statusBackground}}\"></div>\n\n    <!-- Stamp -->\n    <div *ngIf=\"!!stampIcon\" class=\"card-stamp\">\n        <div class=\"card-stamp-icon bg-{{stampBackground}}\">\n            <upd-icon [model]=\"stampIcon\" wrapperClasses=\"icon\" [removeDefaultClasses]=\"true\"></upd-icon>\n        </div>\n    </div>\n\n    <!-- Header section -->\n    <div *ngIf=\"showHeader && (!!title || !!headerTemplate?.templateRef)\" class=\"card-header\" [class.card-header-light]=\"useLightHeader\">\n        <ng-container *ngIf=\"!headerTemplate?.templateRef; else customHeaderTpl\">\n            <h3 class=\"card-title\">{{title}} <span *ngIf=\"!!subtitle\" class=\"card-subtitle\">{{subtitle}}</span></h3>\n        </ng-container>\n        <ng-template #customHeaderTpl [ngTemplateOutlet]=\"headerTemplate?.templateRef || null\"></ng-template>\n\n        <!-- Actions -->\n        <div *ngIf=\"!!actionsTemplate || actions.length > 0\" class=\"card-actions\">\n            <ng-container *ngIf=\"actions.length > 0; else customActionsTpl\">\n                <upd-button *ngFor=\"let btn of actions\" [model]=\"btn\" customClasses=\"me-1\"></upd-button>\n            </ng-container>\n            <ng-template #customActionsTpl [ngTemplateOutlet]=\"actionsTemplate?.templateRef || null\"></ng-template>\n        </div>\n    </div>\n\n    <!-- Body -->\n    <ng-container *ngIf=\"!!imageTemplate; else bodyTpl\">\n        <ng-template *ngIf=\"imagePosition === 'left' || imagePosition === 'right'; else bodyWithTopBottomImageTpl\"\n            [ngTemplateOutlet]=\"bodyWithSideImageTpl\"></ng-template>\n    </ng-container>\n\n    <!-- Footer -->\n    <div *ngIf=\"!!footerText || !!footerTemplate\" class=\"card-footer\" [class.card-footer-transparent]=\"isFooterTransparent\">\n        <ng-container *ngIf=\"!footerTemplate?.templateRef; else customFooterTpl\">\n            <span *ngIf=\"!!footerText\">{{footerText}}</span>\n        </ng-container>\n        <ng-template #customFooterTpl [ngTemplateOutlet]=\"footerTemplate?.templateRef || null\"></ng-template>\n    </div>\n\n    <!-- Progress bar -->\n    <div *ngIf=\"showProgressBar\" class=\"progress progress-sm card-progress\">\n        <div class=\"progress-bar\" [style.width.%]=\"progress\" role=\"progressbar\" [attr.aria-valuenow]=\"progress\" aria-valuemin=\"0\"\n            aria-valuemax=\"100\">\n        </div>\n    </div>\n</ng-template>\n\n<!-- Body with an image on either side -->\n<ng-template #bodyWithSideImageTpl>\n    <div class=\"row row-0\">\n        <div class=\"col-3\" [class.order-md-last]=\"imagePosition === 'right'\">\n            <div class=\"card-image-{{imagePosition}}\">\n                <ng-template [ngTemplateOutlet]=\"imageTemplate!.templateRef\"></ng-template>\n            </div>\n        </div>\n        <div class=\"col\">\n            <ng-template [ngTemplateOutlet]=\"bodyTpl\"></ng-template>\n        </div>\n    </div>\n</ng-template>\n\n<!-- Body with an image on top or bottom -->\n<ng-template #bodyWithTopBottomImageTpl>\n    <div *ngIf=\"imagePosition === 'top'\" class=\"img-responsive-21x9 card-img-top\">\n        <div class=\"card-image-{{imagePosition}}\">\n            <ng-template [ngTemplateOutlet]=\"imageTemplate!.templateRef\"></ng-template>\n        </div>\n    </div>\n    <ng-template [ngTemplateOutlet]=\"bodyTpl\"></ng-template>\n    <div *ngIf=\"imagePosition === 'bottom'\" class=\"img-responsive-21x9 card-img-bottom\">\n        <div class=\"card-image-{{imagePosition}}\">\n            <ng-template [ngTemplateOutlet]=\"imageTemplate!.templateRef\"></ng-template>\n        </div>\n    </div>\n</ng-template>\n\n<!-- Body -->\n<ng-template #bodyTpl>\n    <div class=\"card-body\">\n        <!-- If title was set, but the header section is hidden, we add the title to the body -->\n        <ng-container *ngIf=\"!showHeader && !!title\">\n            <h3 class=\"card-title\">{{title}} <span *ngIf=\"!!subtitle\" class=\"card-subtitle\">{{subtitle}}</span></h3>\n        </ng-container>\n        <ng-content></ng-content>\n    </div>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { UpdIconsModule } from '@updevs/icons';\nimport { UpdButtonModule } from '@updevs/components/button';\n\nimport { CardComponent } from './card.component';\nimport { CardHeaderDirective } from './directives/card-header.directive';\nimport { CardFooterDirective } from './directives/card-footer.directive';\nimport { CardImageDirective } from './directives/card-image.directive';\nimport { CardActionsDirective } from './directives/card-actions.directive';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        UpdIconsModule,\n        UpdButtonModule\n    ],\n    declarations: [\n        CardComponent,\n        CardHeaderDirective,\n        CardFooterDirective,\n        CardImageDirective,\n        CardActionsDirective\n    ],\n    exports: [\n        CardComponent,\n        CardHeaderDirective,\n        CardFooterDirective,\n        CardImageDirective\n    ]\n})\nexport class UpdCardModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/updevs-components-drag-and-drop.mjs

@@ -0,0 +1,185 @@
+import * as i0 from '@angular/core';
+import { signal, input, model, computed, inject, Component, NgModule } from '@angular/core';
+import { TextService } from '@updevs/sdk';
+import * as i1 from '@updevs/icons';
+import { UpdIconsModule } from '@updevs/icons';
+import { CommonModule } from '@angular/common';
+
+class DragAndDropItemModel {
+    get isDraggable() {
+        return this.canDrag && !this.isDisabled;
+    }
+    constructor(init) {
+        this.isDisabled = false;
+        this.canDrag = true;
+        this.canBeEmpty = true; // TODO: implement
+        this.isBeingDragged = signal(false);
+        Object.assign(this, init);
+    }
+}
+
+class DragAndDropColumnModel {
+    constructor(init) {
+        Object.assign(this, init);
+        this.items = signal(init.items.map(i => new DragAndDropItemModel(i)));
+    }
+}
+
+class DragAndDropComponent {
+    constructor() {
+        this.config = input.required();
+        this.columns = model([]);
+        this.showHandler = computed(() => this.config().showHandler || false);
+        this.canReorder = computed(() => this.config().canReorder || false);
+        this.textService = inject(TextService);
+        this.isReordering = signal(false);
+        this.draggedItem = signal(undefined);
+        this.dragEnterCounter = 0;
+    }
+    ngOnInit() {
+        this.columns.set(this.config().columns.map(c => new DragAndDropColumnModel(c)));
+    }
+    canShowHandler(item) {
+        return this.showHandler() && item.isDraggable;
+    }
+    startDrag(event, item, origin) {
+        item.origin = origin;
+        this.draggedItem.set(item);
+        item.isBeingDragged.set(true);
+        event.dataTransfer.effectAllowed = 'move';
+    }
+    endDrag(item) {
+        item.isBeingDragged.set(false);
+        this.draggedItem.set(undefined);
+    }
+    drop(event, destination) {
+        event.preventDefault();
+        this.dragEnterCounter = 0;
+        const dataTransfer = event.dataTransfer;
+        dataTransfer.dropEffect = 'move';
+        const itemName = this.draggedItem()?.name;
+        const origin = this.draggedItem()?.origin;
+        const item = this.columns().find(c => c.name === origin)?.items().find(i => i.name === itemName);
+        if (!!item && (this.canReorder() || destination !== origin)) {
+            const destinationColumn = this.columns().find(c => c.name === destination);
+            const originColumn = this.columns().find(c => c.name === origin);
+            if (!!destinationColumn) {
+                item.isBeingDragged.set(false);
+                this.draggedItem.set(undefined);
+                // We only move items if it's a move between containers, if it's a reorder, nothing needs to be done.
+                // The item was correctly replaced during dragOver.
+                if (destination !== origin) {
+                    const originIdx = originColumn.items().findIndex(i => i.name === itemName);
+                    const destinationIdx = destinationColumn.items().findIndex(i => i.name === itemName);
+                    originColumn.items().splice(originIdx, 1);
+                    // This is required, because the item may have been added during dragOver. TODO: check
+                    if (destinationIdx >= 0) {
+                        dataTransfer.clearData();
+                        return;
+                    }
+                    destinationColumn.items().push(item);
+                    const destinationColumnIdx = this.columns().findIndex(c => c.name === destination);
+                    this.columns.update(curr => {
+                        curr[destinationColumnIdx] = destinationColumn;
+                        return [...curr];
+                    });
+                }
+                dataTransfer.clearData();
+            }
+        }
+    }
+    dragOver(event, destination) {
+        event.preventDefault();
+        const destinationColumn = this.columns().find(c => c.name === destination);
+        if (this.isReordering() || destinationColumn.items().length === 0) {
+            return;
+        }
+        event.dataTransfer.dropEffect = 'move';
+        this.isReordering.set(true);
+        const element = event.target;
+        if (!!element.id && !!this.draggedItem() && element.id !== this.draggedItem().name) {
+            const destinationHoverIdx = destinationColumn.items().findIndex(i => i.name === element.id);
+            const rect = element.getBoundingClientRect();
+            const y = event.clientY - rect.top;
+            const newOverZone = y <= rect.height / 2 ? 'top' : 'bottom';
+            destinationColumn.items.update(curr => {
+                const originalArray = [...curr];
+                if (destinationHoverIdx >= 0) {
+                    if (destinationHoverIdx === 0 && newOverZone === 'top') {
+                        originalArray.unshift(this.draggedItem());
+                    }
+                    else if (destinationHoverIdx === curr.length - 1 && newOverZone === 'bottom') {
+                        originalArray.push(this.draggedItem());
+                    }
+                    else {
+                        const originalItem = curr[destinationHoverIdx];
+                        originalArray.splice(destinationHoverIdx, 1);
+                        originalArray.splice(destinationHoverIdx + (newOverZone === 'top' ? -1 : 1), 0, originalItem);
+                    }
+                }
+                else if (!!this.draggedItem()) {
+                    originalArray.push(this.draggedItem());
+                }
+                return originalArray;
+            });
+            const destinationColumnIdx = this.columns().findIndex(c => c.name === destination);
+            this.columns.update(curr => {
+                curr[destinationColumnIdx] = destinationColumn;
+                return [...curr];
+            });
+        }
+        this.isReordering.set(false);
+    }
+    dragEnter() {
+        this.dragEnterCounter++;
+    }
+    dragLeave(columnName) {
+        this.dragEnterCounter--;
+        if (this.dragEnterCounter === 0 && !!this.draggedItem()?.origin && this.draggedItem()?.origin !== columnName) {
+            const column = this.columns().find(c => c.name === columnName);
+            const idx = column.items().findIndex(i => i.name === this.draggedItem()?.name);
+            if (idx >= 0) {
+                column.items.update(curr => {
+                    curr.splice(idx, 1);
+                    return [...curr];
+                });
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: DragAndDropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: DragAndDropComponent, selector: "upd-drag-and-drop", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { columns: "columnsChange" }, ngImport: i0, template: "<div class=\"d-flex w-100\">\n    @for (col of columns(); track col.name) {\n        <div class=\"d-flex flex-column w-100 me-2 bg-body p-4 rounded\" (drop)=\"drop($event, col.name)\"\n            (dragover)=\"dragOver($event, col.name)\" (dragenter)=\"dragEnter()\" (dragleave)=\"dragLeave(col.name)\">\n            @if (!!col.title) {\n                <div class=\"mb-2\">\n                    <h1>{{ textService.getText(col.title) }}</h1>\n                </div>\n            }\n            @for (item of col.items(); track item.name) {\n                <div class=\"d-flex border p-2 mb-1 bg-muted-lt rounded\" [attr.draggable]=\"item.isDraggable\" [attr.id]=\"item.name\"\n                    [class.draggable]=\"item.isDraggable\" [class.opacity-25]=\"item.isBeingDragged()\"\n                    (dragstart)=\"startDrag($event, item, col.name)\" (dragend)=\"endDrag(item)\">\n                    @if (canShowHandler(item)) {\n                        <upd-icon tablerIcon=\"grip-vertical\" customClasses=\"me-2\"></upd-icon>\n                    }\n                    <div class=\"flex-grow-1 align-content-center\">\n                        <span>{{ textService.getText(item.text) }}</span>\n                    </div>\n                </div>\n            }\n        </div>\n    }\n</div>\n", styles: [".draggable{cursor:move;-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "component", type: i1.IconComponent, selector: "upd-icon", inputs: ["model", "wrapperClasses", "color", "colorClass", "removeDefaultClasses", "customClasses", "tablerIcon", "tablerIconWeight", "tablerIconType", "tablerIconSize", "heroIcon", "heroIconSize", "heroIconType"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: DragAndDropComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'upd-drag-and-drop', template: "<div class=\"d-flex w-100\">\n    @for (col of columns(); track col.name) {\n        <div class=\"d-flex flex-column w-100 me-2 bg-body p-4 rounded\" (drop)=\"drop($event, col.name)\"\n            (dragover)=\"dragOver($event, col.name)\" (dragenter)=\"dragEnter()\" (dragleave)=\"dragLeave(col.name)\">\n            @if (!!col.title) {\n                <div class=\"mb-2\">\n                    <h1>{{ textService.getText(col.title) }}</h1>\n                </div>\n            }\n            @for (item of col.items(); track item.name) {\n                <div class=\"d-flex border p-2 mb-1 bg-muted-lt rounded\" [attr.draggable]=\"item.isDraggable\" [attr.id]=\"item.name\"\n                    [class.draggable]=\"item.isDraggable\" [class.opacity-25]=\"item.isBeingDragged()\"\n                    (dragstart)=\"startDrag($event, item, col.name)\" (dragend)=\"endDrag(item)\">\n                    @if (canShowHandler(item)) {\n                        <upd-icon tablerIcon=\"grip-vertical\" customClasses=\"me-2\"></upd-icon>\n                    }\n                    <div class=\"flex-grow-1 align-content-center\">\n                        <span>{{ textService.getText(item.text) }}</span>\n                    </div>\n                </div>\n            }\n        </div>\n    }\n</div>\n", styles: [".draggable{cursor:move;-webkit-user-select:none;user-select:none}\n"] }]
+        }] });
+
+class UpdDragAndDropModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: UpdDragAndDropModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.0", ngImport: i0, type: UpdDragAndDropModule, declarations: [DragAndDropComponent], imports: [CommonModule,
+            UpdIconsModule], exports: [DragAndDropComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: UpdDragAndDropModule, imports: [CommonModule,
+            UpdIconsModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: UpdDragAndDropModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        UpdIconsModule
+                    ],
+                    declarations: [
+                        DragAndDropComponent
+                    ],
+                    exports: [
+                        DragAndDropComponent
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { DragAndDropColumnModel, DragAndDropComponent, UpdDragAndDropModule };
+//# sourceMappingURL=updevs-components-drag-and-drop.mjs.map