npm - @updevs/components - Versions diffs - 1.0.0-alpha.50 → 1.0.0-alpha.52 - Mend

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

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 (26) hide show

package/fesm2022/updevs-components-paginator.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"updevs-components-paginator.mjs","sources":["../../../../libs/components/paginator/src/paginator.component.ts","../../../../libs/components/paginator/src/paginator.component.html","../../../../libs/components/paginator/src/upd-paginator.module.ts","../../../../libs/components/paginator/src/updevs-components-paginator.ts"],"sourcesContent":["import { Component, inject, HostBinding, effect, input, computed, Signal, model, Output, EventEmitter } from '@angular/core';\nimport { TextModel, TextService } from '@updevs/sdk';\nimport { SelectItem } from '@updevs/components/form-controls/select';\n\n@Component({\n selector: 'upd-paginator',\n templateUrl: './paginator.component.html',\n styleUrl: './paginator.component.scss'\n})\nexport class PaginatorComponent {\n @HostBinding('class') hostClasses = '';\n @Output() readonly changed = new EventEmitter<void>();\n\n startPageIndex = input<0 \| 1>(0);\n currentPage = model<number>(this.startPageIndex());\n wrapperClasses = input<string>('');\n availablePageSizes = input<number[]>([5, 10, 15, 25, 50]);\n defaultInitPageSize = input<number>(10);\n pageSize = model<number>(this.defaultInitPageSize());\n shouldDisplayFirstIcon = input<boolean>(true);\n shouldDisplayFirstText = input<boolean>(true);\n shouldDisplayPreviousIcon = input<boolean>(true);\n shouldDisplayPreviousText = input<boolean>(true);\n shouldDisplayNextIcon = input<boolean>(true);\n shouldDisplayNextText = input<boolean>(true);\n shouldDisplayLastIcon = input<boolean>(true);\n shouldDisplayLastText = input<boolean>(true);\n previousDescription = input<TextModel>();\n nextDescription = input<TextModel>();\n totalRecords = input<number>(0);\n isFirstDisabled = computed(() => this.currentPage() === this.startPageIndex() \|\| this.totalRecords() === 0);\n isPreviousDisabled = computed(() => this.currentPage() === this.startPageIndex() \|\| this.totalRecords() === 0);\n isNextDisabled = computed(() => this.currentPage() + 1 === this.totalPages() \|\| this.totalRecords() === 0);\n isLastDisabled = computed(() => this.currentPage() + 1 === this.totalPages() \|\| this.totalRecords() === 0);\n pageOptions: Signal<SelectItem[]> = computed(() => this.availablePageSizes().map(ps => ({ value: ps, text: ps.toString() })));\n selectedPageSize = computed(() => this.pageOptions().find(po => po.value === this.pageSize()));\n totalPages = computed(() => Math.ceil(this.totalRecords() / this.pageSize()));\n currentFirstDisplayed = computed(() => ((this.currentPage() - this.startPageIndex()) * this.pageSize()) + 1);\n currentLastDisplayed = computed(() => (this.expectedLast() > this.totalRecords() ? this.totalRecords() : this.expectedLast()));\n\n readonly textService = inject(TextService);\n\n private expectedLast = computed(() => (this.currentPage() + (this.startPageIndex() === 1 ? 0 : 1)) * this.pageSize());\n private readonly defaultWrapperClasses = 'd-flex align-items-center';\n\n constructor() {\n effect(() => {\n this.hostClasses = `${this.defaultWrapperClasses} ${this.wrapperClasses()}`;\n });\n }\n\n onSelectPageSize(page?: SelectItem): void {\n console.log('page', page);\n this.pageSize.set(page?.value \|\| 1);\n this.changed.emit();\n }\n\n selectPage(page: number): void {\n this.currentPage.set(page);\n this.changed.emit();\n }\n}\n","<ng-container transloco=\"let t; prefix: 'UpDevs.Paginator'\">\n <div class=\"d-flex m-0 ms-auto align-items-center\">\n <div class=\"text-secondary me-2\">\n {{ t('ItemsPerPage') }}\n </div>\n <upd-select [items]=\"pageOptions()\" [selected]=\"selectedPageSize()\" (selectedItem)=\"onSelectPageSize($event)\"\n [shouldShowClearButton]=\"false\" [isCompact]=\"true\" [useSystemStyle]=\"true\"></upd-select>\n <p class=\"m-0 text-secondary ms-4\">\n @if (totalRecords() > 0) {\n {{ t('FromToOf', { first: currentFirstDisplayed(), last: currentLastDisplayed(), totalRecords: totalRecords() }) }}\n } @else {\n {{ t('NoRecords') }}\n }\n </p>\n <ul class=\"pagination m-0 ms-4\">\n @if (!previousDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayFirstText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isFirstDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isFirstDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(startPageIndex())\">\n @if (shouldDisplayFirstIcon()) {\n <upd-icon tablerIcon=\"chevron-left-pipe\"></upd-icon>\n }\n @if (shouldDisplayFirstText()) {\n {{ t('First') }}\n }\n </upd-button>\n </li>\n }\n\n <li class=\"page-item\" [class.page-prev]=\"!!previousDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayPreviousText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isPreviousDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isPreviousDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(currentPage() - 1)\">\n @if (!!previousDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Previous') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(previousDescription()) }}</div>\n } @else {\n @if (shouldDisplayPreviousIcon()) {\n <upd-icon tablerIcon=\"chevron-left\"></upd-icon>\n }\n @if (shouldDisplayPreviousText()) {\n {{ t('PreviousShort') }}\n }\n }\n </upd-button>\n </li>\n\n <li class=\"page-item\" [class.page-next]=\"!!nextDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayNextText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isNextDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isNextDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(currentPage() + 1)\">\n @if (!!nextDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Next') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(nextDescription()) }}</div>\n } @else {\n @if (shouldDisplayNextText()) {\n {{ t('NextShort') }}\n }\n @if (shouldDisplayNextIcon()) {\n <upd-icon tablerIcon=\"chevron-right\"></upd-icon>\n }\n }\n </upd-button>\n </li>\n\n @if (!nextDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayLastText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isLastDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isLastDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(totalPages() - (startPageIndex() === 0 ? 1 : 0))\">\n @if (shouldDisplayLastText()) {\n {{ t('Last') }}\n }\n @if (shouldDisplayLastIcon()) {\n <upd-icon tablerIcon=\"chevron-right-pipe\"></upd-icon>\n }\n </upd-button>\n </li>\n }\n </ul>\n </div>\n</ng-container>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { UpdIconsModule } from '@updevs/icons';\nimport { UpdButtonModule } from '@updevs/components/button';\nimport { UpdSelectModule } from '@updevs/components/form-controls/select';\nimport { TranslocoDirective, TranslocoService } from '@jsverse/transloco';\n\nimport as en from './assets/i18n/en.json';\nimport * as pt from './assets/i18n/pt.json';\nimport { PaginatorComponent } from './paginator.component';\n\n@NgModule({\n imports: [\n CommonModule,\n UpdIconsModule,\n UpdButtonModule,\n UpdSelectModule,\n TranslocoDirective\n ],\n declarations: [\n PaginatorComponent\n ],\n exports: [\n PaginatorComponent\n ]\n})\nexport class UpdPaginatorModule {\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":["i4","en","pt","i1"],"mappings":"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"}
1	+ {"version":3,"file":"updevs-components-paginator.mjs","sources":["../../../../libs/components/paginator/src/paginator.component.ts","../../../../libs/components/paginator/src/paginator.component.html","../../../../libs/components/paginator/src/upd-paginator.module.ts","../../../../libs/components/paginator/src/updevs-components-paginator.ts"],"sourcesContent":["import { Component, inject, HostBinding, effect, input, computed, Signal, model, Output, EventEmitter } from '@angular/core';\nimport { TextModel, TextService } from '@updevs/sdk';\nimport { SelectItem } from '@updevs/components/form-controls/select';\n\n@Component({\n selector: 'upd-paginator',\n templateUrl: './paginator.component.html',\n styleUrl: './paginator.component.scss'\n})\nexport class PaginatorComponent {\n @HostBinding('class') hostClasses = '';\n @Output() readonly changed = new EventEmitter<void>();\n\n startPageIndex = input<0 \| 1>(0);\n currentPage = model<number>(this.startPageIndex());\n wrapperClasses = input<string>('');\n availablePageSizes = input<number[]>([5, 10, 15, 25, 50]);\n defaultInitPageSize = input<number>(10);\n pageSize = model<number>(this.defaultInitPageSize());\n shouldDisplayFirstIcon = input<boolean>(true);\n shouldDisplayFirstText = input<boolean>(true);\n shouldDisplayPreviousIcon = input<boolean>(true);\n shouldDisplayPreviousText = input<boolean>(true);\n shouldDisplayNextIcon = input<boolean>(true);\n shouldDisplayNextText = input<boolean>(true);\n shouldDisplayLastIcon = input<boolean>(true);\n shouldDisplayLastText = input<boolean>(true);\n previousDescription = input<TextModel>();\n nextDescription = input<TextModel>();\n totalRecords = input<number>(0);\n isFirstDisabled = computed(() => this.currentPage() === this.startPageIndex() \|\| this.totalRecords() === 0);\n isPreviousDisabled = computed(() => this.currentPage() === this.startPageIndex() \|\| this.totalRecords() === 0);\n isNextDisabled = computed(() => this.currentPage() + 1 === this.totalPages() \|\| this.totalRecords() === 0);\n isLastDisabled = computed(() => this.currentPage() + 1 === this.totalPages() \|\| this.totalRecords() === 0);\n pageOptions: Signal<SelectItem[]> = computed(() => this.availablePageSizes().map(ps => ({ value: ps, text: ps.toString() })));\n selectedPageSize = computed(() => this.pageOptions().find(po => po.value === this.pageSize()));\n totalPages = computed(() => Math.ceil(this.totalRecords() / this.pageSize()));\n currentFirstDisplayed = computed(() => ((this.currentPage() - this.startPageIndex()) * this.pageSize()) + 1);\n currentLastDisplayed = computed(() => (this.expectedLast() > this.totalRecords() ? this.totalRecords() : this.expectedLast()));\n\n readonly textService = inject(TextService);\n\n private expectedLast = computed(() => (this.currentPage() + (this.startPageIndex() === 1 ? 0 : 1)) * this.pageSize());\n private readonly defaultWrapperClasses = 'd-flex align-items-center';\n\n constructor() {\n effect(() => {\n this.hostClasses = `${this.defaultWrapperClasses} ${this.wrapperClasses()}`;\n });\n }\n\n onSelectPageSize(page?: SelectItem): void {\n console.log('page', page);\n this.pageSize.set(page?.value \|\| 1);\n this.changed.emit();\n }\n\n selectPage(page: number): void {\n this.currentPage.set(page);\n this.changed.emit();\n }\n}\n","<ng-container transloco=\"let t; prefix: 'UpDevs.Paginator'\">\n <div class=\"d-flex m-0 ms-auto align-items-center\">\n <div class=\"text-secondary me-2\">\n {{ t('ItemsPerPage') }}\n </div>\n <upd-select [items]=\"pageOptions()\" [selected]=\"selectedPageSize()\" (selectedItem)=\"onSelectPageSize($event)\"\n [shouldShowClearButton]=\"false\" [isCompact]=\"true\" [useSystemStyle]=\"true\"></upd-select>\n <p class=\"m-0 text-secondary ms-4\">\n @if (totalRecords() > 0) {\n {{ t('FromToOf', { first: currentFirstDisplayed(), last: currentLastDisplayed(), totalRecords: totalRecords() }) }}\n } @else {\n {{ t('NoRecords') }}\n }\n </p>\n <ul class=\"pagination m-0 ms-4\">\n @if (!previousDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayFirstText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isFirstDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isFirstDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(startPageIndex())\">\n @if (shouldDisplayFirstIcon()) {\n <upd-icon tablerIcon=\"chevron-left-pipe\"></upd-icon>\n }\n @if (shouldDisplayFirstText()) {\n {{ t('First') }}\n }\n </upd-button>\n </li>\n }\n\n <li class=\"page-item\" [class.page-prev]=\"!!previousDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayPreviousText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isPreviousDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isPreviousDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(currentPage() - 1)\">\n @if (!!previousDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Previous') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(previousDescription()) }}</div>\n } @else {\n @if (shouldDisplayPreviousIcon()) {\n <upd-icon tablerIcon=\"chevron-left\"></upd-icon>\n }\n @if (shouldDisplayPreviousText()) {\n {{ t('PreviousShort') }}\n }\n }\n </upd-button>\n </li>\n\n <li class=\"page-item\" [class.page-next]=\"!!nextDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayNextText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isNextDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isNextDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(currentPage() + 1)\">\n @if (!!nextDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Next') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(nextDescription()) }}</div>\n } @else {\n @if (shouldDisplayNextText()) {\n {{ t('NextShort') }}\n }\n @if (shouldDisplayNextIcon()) {\n <upd-icon tablerIcon=\"chevron-right\"></upd-icon>\n }\n }\n </upd-button>\n </li>\n\n @if (!nextDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayLastText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isLastDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isLastDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(totalPages() - (startPageIndex() === 0 ? 1 : 0))\">\n @if (shouldDisplayLastText()) {\n {{ t('Last') }}\n }\n @if (shouldDisplayLastIcon()) {\n <upd-icon tablerIcon=\"chevron-right-pipe\"></upd-icon>\n }\n </upd-button>\n </li>\n }\n </ul>\n </div>\n</ng-container>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { UpdIconsModule } from '@updevs/icons';\nimport { UpdButtonModule } from '@updevs/components/button';\nimport { UpdSelectModule } from '@updevs/components/form-controls/select';\nimport { TranslocoDirective, TranslocoService } from '@jsverse/transloco';\n\nimport as en from './assets/i18n/en.json';\nimport * as pt from './assets/i18n/pt.json';\nimport { PaginatorComponent } from './paginator.component';\n\n@NgModule({\n imports: [\n CommonModule,\n UpdIconsModule,\n UpdButtonModule,\n UpdSelectModule,\n TranslocoDirective\n ],\n declarations: [\n PaginatorComponent\n ],\n exports: [\n PaginatorComponent\n ]\n})\nexport class UpdPaginatorModule {\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":["i4","en","pt","i1"],"mappings":"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"}

package/fesm2022/updevs-components-pricing-cards.mjs CHANGED Viewed

@@ -22,11 +22,11 @@ class PricingCardsComponent {
         this.selected.emit(item);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: PricingCardsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: PricingCardsComponent, selector: "upd-pricing-cards", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selected: "selected" }, ngImport: i0, template: "<div class=\"row row-cards\">\n    @for (item of items(); track item.id) {\n        <div class=\"col\">\n            <upd-card [ribbonBackground]=\"!!item.ribbonIcon ? item.highlightColor : undefined\" [ribbonIcon]=\"item.ribbonIcon\"\n                [ribbonStyle]=\"item.ribbonStyle || 'top'\" [statusBackground]=\"item.highlightColor\" [useLightHeader]=\"true\">\n                <ng-template updCardHeader>\n                    <div class=\"text-uppercase text-secondary fw-bold\">{{ item.title }}</div>\n                    <div [class.me-6]=\"!!item.ribbonIcon\" class=\"ms-auto d-flex gap-1\">\n                        @for (tag of item.tags; track tag.text.text) {\n                            <upd-badge [bgColor]=\"tag.backgroundColor\" [text]=\"tag.text\"></upd-badge>\n                        }\n                    </div>\n                </ng-template>\n\n                <div class=\"display-5 fw-bold mb-3\">{{ item.price }}</div>\n\n                @if ((item.groupedFeatures?.length || 0) > 0) {\n                    @for (group of item.groupedFeatures; track group.name) {\n                        <div class=\"bg-surface-tertiary\">\n                            <span class=\"subheader\">{{ group.name }}</span>\n                        </div>\n                        <ng-container [ngTemplateOutlet]=\"featuresTpl\"\n                            [ngTemplateOutletContext]=\"{features: group.features}\"></ng-container>\n                    }\n                } @else {\n                    <ng-container [ngTemplateOutlet]=\"featuresTpl\" [ngTemplateOutletContext]=\"{features: item.features}\"></ng-container>\n                }\n\n                <div class=\"text-center mt-4\">\n                    <upd-button (clicked)=\"selectOption(item)\" customClasses=\"w-100\"\n                        [colorStyle]=\"!!item.highlightColor ? item.highlightColor : undefined\" [isDisabled]=\"!!item.currentText\">\n                        {{ textService.getText(!!item.currentText ? item.currentText : item.chooseThisText) }}\n                    </upd-button>\n                </div>\n            </upd-card>\n        </div>\n    }\n</div>\n\n<ng-template #featuresTpl let-features=\"features\">\n    <ul class=\"list-unstyled lh-lg\">\n        @for (feature of features; track feature.text) {\n            <li [class.fw-bold]=\"feature.isHighlighted\">\n                @if (feature.isIncluded) {\n                    <upd-icon tablerIcon=\"check\" colorClass=\"text-success\"></upd-icon>\n                } @else {\n                    <upd-icon tablerIcon=\"x\" colorClass=\"text-danger\"></upd-icon>\n                }\n                <span class=\"ms-2\">{{ feature.text }}</span>\n            </li>\n        }\n    </ul>\n</ng-template>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.CardComponent, selector: "upd-card", inputs: ["wrapperClasses", "title", "subtitle", "hoverEffect", "state", "type", "imagePosition", "bgColor", "stampIcon", "stampBackground", "statusBackground", "statusPosition", "ribbonBackground", "ribbonStyle", "ribbonIcon", "ribbonText", "rotate", "removeBorder", "useLightHeader", "showHeader", "isFooterTransparent", "footerText", "showProgressBar", "progress", "actions"] }, { kind: "directive", type: i2.CardHeaderDirective, selector: "ng-template[updCardHeader]" }, { kind: "component", type: i3.IconComponent, selector: "upd-icon", inputs: ["model", "wrapperClasses", "color", "colorClass", "removeDefaultClasses", "customClasses", "tablerIcon", "tablerIconWeight", "tablerIconType", "tablerIconSize", "heroIcon", "heroIconSize", "heroIconType"] }, { kind: "component", type: i4.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"] }, { kind: "component", type: i5.BadgeComponent, selector: "upd-badge", inputs: ["config", "bgColor", "textColor", "text", "isOutline", "isPill", "isNotification", "isBlinking", "customClasses"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: PricingCardsComponent, selector: "upd-pricing-cards", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selected: "selected" }, ngImport: i0, template: "<div class=\"row row-cards\">\n    @for (item of items(); track item.id) {\n        <div class=\"col-lg col-sm-6\">\n            <upd-card [ribbonBackground]=\"!!item.ribbonIcon ? item.highlightColor : undefined\" [ribbonIcon]=\"item.ribbonIcon\"\n                [ribbonStyle]=\"item.ribbonStyle || 'top'\" [statusBackground]=\"item.highlightColor\" [useLightHeader]=\"true\">\n                <ng-template updCardHeader>\n                    <div class=\"text-uppercase text-secondary fw-bold\">{{ item.title }}</div>\n                    <div [class.me-6]=\"!!item.ribbonIcon\" class=\"ms-auto d-flex gap-1\">\n                        @for (tag of item.tags; track tag.text.text) {\n                            <upd-badge [bgColor]=\"tag.backgroundColor\" [text]=\"tag.text\"></upd-badge>\n                        }\n                    </div>\n                </ng-template>\n\n                <div class=\"display-5 fw-bold mb-3\">{{ item.price }}</div>\n\n                @if ((item.groupedFeatures?.length || 0) > 0) {\n                    @for (group of item.groupedFeatures; track group.name) {\n                        <div class=\"bg-surface-tertiary\">\n                            <span class=\"subheader\">{{ group.name }}</span>\n                        </div>\n                        <ng-container [ngTemplateOutlet]=\"featuresTpl\"\n                            [ngTemplateOutletContext]=\"{features: group.features}\"></ng-container>\n                    }\n                } @else {\n                    <ng-container [ngTemplateOutlet]=\"featuresTpl\" [ngTemplateOutletContext]=\"{features: item.features}\"></ng-container>\n                }\n\n                <div class=\"text-center mt-4\">\n                    <upd-button (clicked)=\"selectOption(item)\" customClasses=\"w-100\"\n                        [colorStyle]=\"!!item.highlightColor ? item.highlightColor : undefined\" [isDisabled]=\"!!item.currentText\">\n                        {{ textService.getText(!!item.currentText ? item.currentText : item.chooseThisText) }}\n                    </upd-button>\n                </div>\n            </upd-card>\n        </div>\n    }\n</div>\n\n<ng-template #featuresTpl let-features=\"features\">\n    <ul class=\"list-unstyled lh-lg\">\n        @for (feature of features; track feature.text) {\n            <li [class.fw-bold]=\"feature.isHighlighted\">\n                @if (feature.isIncluded) {\n                    <upd-icon tablerIcon=\"check\" colorClass=\"text-success\"></upd-icon>\n                } @else {\n                    <upd-icon tablerIcon=\"x\" colorClass=\"text-danger\"></upd-icon>\n                }\n                <span class=\"ms-2\">{{ feature.text }}</span>\n            </li>\n        }\n    </ul>\n</ng-template>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.CardComponent, selector: "upd-card", inputs: ["wrapperClasses", "title", "subtitle", "hoverEffect", "state", "type", "imagePosition", "bgColor", "stampIcon", "stampBackground", "statusBackground", "statusPosition", "ribbonBackground", "ribbonStyle", "ribbonIcon", "ribbonText", "rotate", "removeBorder", "useLightHeader", "showHeader", "isFooterTransparent", "footerText", "showProgressBar", "progress", "actions"] }, { kind: "directive", type: i2.CardHeaderDirective, selector: "ng-template[updCardHeader]" }, { kind: "component", type: i3.IconComponent, selector: "upd-icon", inputs: ["model", "wrapperClasses", "color", "colorClass", "removeDefaultClasses", "customClasses", "tablerIcon", "tablerIconWeight", "tablerIconType", "tablerIconSize", "heroIcon", "heroIconSize", "heroIconType"] }, { kind: "component", type: i4.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"] }, { kind: "component", type: i5.BadgeComponent, selector: "upd-badge", inputs: ["config", "bgColor", "textColor", "text", "isOutline", "isPill", "isNotification", "isBlinking", "customClasses"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: PricingCardsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'upd-pricing-cards', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"row row-cards\">\n    @for (item of items(); track item.id) {\n        <div class=\"col\">\n            <upd-card [ribbonBackground]=\"!!item.ribbonIcon ? item.highlightColor : undefined\" [ribbonIcon]=\"item.ribbonIcon\"\n                [ribbonStyle]=\"item.ribbonStyle || 'top'\" [statusBackground]=\"item.highlightColor\" [useLightHeader]=\"true\">\n                <ng-template updCardHeader>\n                    <div class=\"text-uppercase text-secondary fw-bold\">{{ item.title }}</div>\n                    <div [class.me-6]=\"!!item.ribbonIcon\" class=\"ms-auto d-flex gap-1\">\n                        @for (tag of item.tags; track tag.text.text) {\n                            <upd-badge [bgColor]=\"tag.backgroundColor\" [text]=\"tag.text\"></upd-badge>\n                        }\n                    </div>\n                </ng-template>\n\n                <div class=\"display-5 fw-bold mb-3\">{{ item.price }}</div>\n\n                @if ((item.groupedFeatures?.length || 0) > 0) {\n                    @for (group of item.groupedFeatures; track group.name) {\n                        <div class=\"bg-surface-tertiary\">\n                            <span class=\"subheader\">{{ group.name }}</span>\n                        </div>\n                        <ng-container [ngTemplateOutlet]=\"featuresTpl\"\n                            [ngTemplateOutletContext]=\"{features: group.features}\"></ng-container>\n                    }\n                } @else {\n                    <ng-container [ngTemplateOutlet]=\"featuresTpl\" [ngTemplateOutletContext]=\"{features: item.features}\"></ng-container>\n                }\n\n                <div class=\"text-center mt-4\">\n                    <upd-button (clicked)=\"selectOption(item)\" customClasses=\"w-100\"\n                        [colorStyle]=\"!!item.highlightColor ? item.highlightColor : undefined\" [isDisabled]=\"!!item.currentText\">\n                        {{ textService.getText(!!item.currentText ? item.currentText : item.chooseThisText) }}\n                    </upd-button>\n                </div>\n            </upd-card>\n        </div>\n    }\n</div>\n\n<ng-template #featuresTpl let-features=\"features\">\n    <ul class=\"list-unstyled lh-lg\">\n        @for (feature of features; track feature.text) {\n            <li [class.fw-bold]=\"feature.isHighlighted\">\n                @if (feature.isIncluded) {\n                    <upd-icon tablerIcon=\"check\" colorClass=\"text-success\"></upd-icon>\n                } @else {\n                    <upd-icon tablerIcon=\"x\" colorClass=\"text-danger\"></upd-icon>\n                }\n                <span class=\"ms-2\">{{ feature.text }}</span>\n            </li>\n        }\n    </ul>\n</ng-template>\n", styles: [":host{display:block}\n"] }]
+            args: [{ selector: 'upd-pricing-cards', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"row row-cards\">\n    @for (item of items(); track item.id) {\n        <div class=\"col-lg col-sm-6\">\n            <upd-card [ribbonBackground]=\"!!item.ribbonIcon ? item.highlightColor : undefined\" [ribbonIcon]=\"item.ribbonIcon\"\n                [ribbonStyle]=\"item.ribbonStyle || 'top'\" [statusBackground]=\"item.highlightColor\" [useLightHeader]=\"true\">\n                <ng-template updCardHeader>\n                    <div class=\"text-uppercase text-secondary fw-bold\">{{ item.title }}</div>\n                    <div [class.me-6]=\"!!item.ribbonIcon\" class=\"ms-auto d-flex gap-1\">\n                        @for (tag of item.tags; track tag.text.text) {\n                            <upd-badge [bgColor]=\"tag.backgroundColor\" [text]=\"tag.text\"></upd-badge>\n                        }\n                    </div>\n                </ng-template>\n\n                <div class=\"display-5 fw-bold mb-3\">{{ item.price }}</div>\n\n                @if ((item.groupedFeatures?.length || 0) > 0) {\n                    @for (group of item.groupedFeatures; track group.name) {\n                        <div class=\"bg-surface-tertiary\">\n                            <span class=\"subheader\">{{ group.name }}</span>\n                        </div>\n                        <ng-container [ngTemplateOutlet]=\"featuresTpl\"\n                            [ngTemplateOutletContext]=\"{features: group.features}\"></ng-container>\n                    }\n                } @else {\n                    <ng-container [ngTemplateOutlet]=\"featuresTpl\" [ngTemplateOutletContext]=\"{features: item.features}\"></ng-container>\n                }\n\n                <div class=\"text-center mt-4\">\n                    <upd-button (clicked)=\"selectOption(item)\" customClasses=\"w-100\"\n                        [colorStyle]=\"!!item.highlightColor ? item.highlightColor : undefined\" [isDisabled]=\"!!item.currentText\">\n                        {{ textService.getText(!!item.currentText ? item.currentText : item.chooseThisText) }}\n                    </upd-button>\n                </div>\n            </upd-card>\n        </div>\n    }\n</div>\n\n<ng-template #featuresTpl let-features=\"features\">\n    <ul class=\"list-unstyled lh-lg\">\n        @for (feature of features; track feature.text) {\n            <li [class.fw-bold]=\"feature.isHighlighted\">\n                @if (feature.isIncluded) {\n                    <upd-icon tablerIcon=\"check\" colorClass=\"text-success\"></upd-icon>\n                } @else {\n                    <upd-icon tablerIcon=\"x\" colorClass=\"text-danger\"></upd-icon>\n                }\n                <span class=\"ms-2\">{{ feature.text }}</span>\n            </li>\n        }\n    </ul>\n</ng-template>\n", styles: [":host{display:block}\n"] }]
         }] });
 class UpdPricingCardsModule {

package/fesm2022/updevs-components-pricing-cards.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"updevs-components-pricing-cards.mjs","sources":["../../../../libs/components/pricing-cards/src/pricing-cards.component.ts","../../../../libs/components/pricing-cards/src/pricing-cards.component.html","../../../../libs/components/pricing-cards/src/upd-pricing-cards.module.ts","../../../../libs/components/pricing-cards/src/updevs-components-pricing-cards.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, inject, input, output } from '@angular/core';\nimport { TextService } from '@updevs/sdk';\n\nimport { PriceItemModel } from './models/price-item.model';\n\n@Component({\n selector: 'upd-pricing-cards',\n templateUrl: './pricing-cards.component.html',\n styleUrl: './pricing-cards.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class PricingCardsComponent {\n readonly items = input.required<PriceItemModel[]>();\n readonly selected = output<PriceItemModel>();\n\n readonly textService = inject(TextService);\n\n selectOption(item: PriceItemModel): void {\n this.selected.emit(item);\n }\n}\n","<div class=\"row row-cards\">\n @for (item of items(); track item.id) {\n <div class=\"col\">\n <upd-card [ribbonBackground]=\"!!item.ribbonIcon ? item.highlightColor : undefined\" [ribbonIcon]=\"item.ribbonIcon\"\n [ribbonStyle]=\"item.ribbonStyle \|\| 'top'\" [statusBackground]=\"item.highlightColor\" [useLightHeader]=\"true\">\n <ng-template updCardHeader>\n <div class=\"text-uppercase text-secondary fw-bold\">{{ item.title }}</div>\n <div [class.me-6]=\"!!item.ribbonIcon\" class=\"ms-auto d-flex gap-1\">\n @for (tag of item.tags; track tag.text.text) {\n <upd-badge [bgColor]=\"tag.backgroundColor\" [text]=\"tag.text\"></upd-badge>\n }\n </div>\n </ng-template>\n\n <div class=\"display-5 fw-bold mb-3\">{{ item.price }}</div>\n\n @if ((item.groupedFeatures?.length \|\| 0) > 0) {\n @for (group of item.groupedFeatures; track group.name) {\n <div class=\"bg-surface-tertiary\">\n <span class=\"subheader\">{{ group.name }}</span>\n </div>\n <ng-container [ngTemplateOutlet]=\"featuresTpl\"\n [ngTemplateOutletContext]=\"{features: group.features}\"></ng-container>\n }\n } @else {\n <ng-container [ngTemplateOutlet]=\"featuresTpl\" [ngTemplateOutletContext]=\"{features: item.features}\"></ng-container>\n }\n\n <div class=\"text-center mt-4\">\n <upd-button (clicked)=\"selectOption(item)\" customClasses=\"w-100\"\n [colorStyle]=\"!!item.highlightColor ? item.highlightColor : undefined\" [isDisabled]=\"!!item.currentText\">\n {{ textService.getText(!!item.currentText ? item.currentText : item.chooseThisText) }}\n </upd-button>\n </div>\n </upd-card>\n </div>\n }\n</div>\n\n<ng-template #featuresTpl let-features=\"features\">\n <ul class=\"list-unstyled lh-lg\">\n @for (feature of features; track feature.text) {\n <li [class.fw-bold]=\"feature.isHighlighted\">\n @if (feature.isIncluded) {\n <upd-icon tablerIcon=\"check\" colorClass=\"text-success\"></upd-icon>\n } @else {\n <upd-icon tablerIcon=\"x\" colorClass=\"text-danger\"></upd-icon>\n }\n <span class=\"ms-2\">{{ feature.text }}</span>\n </li>\n }\n </ul>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { UpdIconsModule } from '@updevs/icons';\nimport { UpdCardModule } from '@updevs/components/card';\nimport { UpdButtonModule } from '@updevs/components/button';\nimport { UpdBadgeModule } from '@updevs/components/badge';\n\nimport { PricingCardsComponent } from './pricing-cards.component';\n\n@NgModule({\n imports: [\n CommonModule,\n UpdCardModule,\n UpdIconsModule,\n UpdButtonModule,\n UpdBadgeModule\n ],\n declarations: [\n PricingCardsComponent\n ],\n exports: [\n PricingCardsComponent\n ]\n})\nexport class UpdPricingCardsModule {}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;MAWa,qBAAqB,CAAA;AANlC,IAAA,WAAA,GAAA;AAOa,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,EAAoB;QAC1C,IAAQ,CAAA,QAAA,GAAG,MAAM,EAAkB;AAEnC,QAAA,IAAA,CAAA,WAAW,GAAG,MAAM,CAAC,WAAW,CAAC;AAK7C;AAHG,IAAA,YAAY,CAAC,IAAoB,EAAA;AAC7B,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;;8GAPnB,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,+NCXlC,~~0sFAqDA~~,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,aAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,gBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,aAAA,EAAA,OAAA,EAAA,MAAA,EAAA,eAAA,EAAA,SAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,kBAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,aAAA,EAAA,YAAA,EAAA,YAAA,EAAA,QAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,YAAA,EAAA,qBAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,QAAA,EAAA,4BAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,aAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,gBAAA,EAAA,OAAA,EAAA,YAAA,EAAA,sBAAA,EAAA,eAAA,EAAA,YAAA,EAAA,kBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,cAAA,EAAA,cAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,MAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,WAAA,EAAA,SAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,WAAA,EAAA,QAAA,EAAA,YAAA,EAAA,UAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,YAAA,EAAA,UAAA,EAAA,aAAA,EAAA,YAAA,EAAA,MAAA,EAAA,OAAA,CAAA,EAAA,OAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,cAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,SAAA,EAAA,WAAA,EAAA,MAAA,EAAA,WAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,YAAA,EAAA,eAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FD1Ca,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBANjC,SAAS;+BACI,mBAAmB,EAAA,eAAA,EAGZ,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,~~0sFAAA~~,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA;;;MEetC,qBAAqB,CAAA;8GAArB,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;+GAArB,qBAAqB,EAAA,YAAA,EAAA,CAN1B,qBAAqB,CAAA,EAAA,OAAA,EAAA,CAPrB,YAAY;YACZ,aAAa;YACb,cAAc;YACd,eAAe;AACf,YAAA,cAAc,aAMd,qBAAqB,CAAA,EAAA,CAAA,CAAA;AAGhB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,YAb1B,YAAY;YACZ,aAAa;YACb,cAAc;YACd,eAAe;YACf,cAAc,CAAA,EAAA,CAAA,CAAA;;2FAST,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAfjC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE;wBACL,YAAY;wBACZ,aAAa;wBACb,cAAc;wBACd,eAAe;wBACf;AACH,qBAAA;AACD,oBAAA,YAAY,EAAE;wBACV;AACH,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACL;AACH;AACJ,iBAAA;;;ACvBD;;AAEG;;;;"}
1	+ {"version":3,"file":"updevs-components-pricing-cards.mjs","sources":["../../../../libs/components/pricing-cards/src/pricing-cards.component.ts","../../../../libs/components/pricing-cards/src/pricing-cards.component.html","../../../../libs/components/pricing-cards/src/upd-pricing-cards.module.ts","../../../../libs/components/pricing-cards/src/updevs-components-pricing-cards.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, inject, input, output } from '@angular/core';\nimport { TextService } from '@updevs/sdk';\n\nimport { PriceItemModel } from './models/price-item.model';\n\n@Component({\n selector: 'upd-pricing-cards',\n templateUrl: './pricing-cards.component.html',\n styleUrl: './pricing-cards.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class PricingCardsComponent {\n readonly items = input.required<PriceItemModel[]>();\n readonly selected = output<PriceItemModel>();\n\n readonly textService = inject(TextService);\n\n selectOption(item: PriceItemModel): void {\n this.selected.emit(item);\n }\n}\n","<div class=\"row row-cards\">\n @for (item of items(); track item.id) {\n <div class=\"col-lg col-sm-6\">\n <upd-card [ribbonBackground]=\"!!item.ribbonIcon ? item.highlightColor : undefined\" [ribbonIcon]=\"item.ribbonIcon\"\n [ribbonStyle]=\"item.ribbonStyle \|\| 'top'\" [statusBackground]=\"item.highlightColor\" [useLightHeader]=\"true\">\n <ng-template updCardHeader>\n <div class=\"text-uppercase text-secondary fw-bold\">{{ item.title }}</div>\n <div [class.me-6]=\"!!item.ribbonIcon\" class=\"ms-auto d-flex gap-1\">\n @for (tag of item.tags; track tag.text.text) {\n <upd-badge [bgColor]=\"tag.backgroundColor\" [text]=\"tag.text\"></upd-badge>\n }\n </div>\n </ng-template>\n\n <div class=\"display-5 fw-bold mb-3\">{{ item.price }}</div>\n\n @if ((item.groupedFeatures?.length \|\| 0) > 0) {\n @for (group of item.groupedFeatures; track group.name) {\n <div class=\"bg-surface-tertiary\">\n <span class=\"subheader\">{{ group.name }}</span>\n </div>\n <ng-container [ngTemplateOutlet]=\"featuresTpl\"\n [ngTemplateOutletContext]=\"{features: group.features}\"></ng-container>\n }\n } @else {\n <ng-container [ngTemplateOutlet]=\"featuresTpl\" [ngTemplateOutletContext]=\"{features: item.features}\"></ng-container>\n }\n\n <div class=\"text-center mt-4\">\n <upd-button (clicked)=\"selectOption(item)\" customClasses=\"w-100\"\n [colorStyle]=\"!!item.highlightColor ? item.highlightColor : undefined\" [isDisabled]=\"!!item.currentText\">\n {{ textService.getText(!!item.currentText ? item.currentText : item.chooseThisText) }}\n </upd-button>\n </div>\n </upd-card>\n </div>\n }\n</div>\n\n<ng-template #featuresTpl let-features=\"features\">\n <ul class=\"list-unstyled lh-lg\">\n @for (feature of features; track feature.text) {\n <li [class.fw-bold]=\"feature.isHighlighted\">\n @if (feature.isIncluded) {\n <upd-icon tablerIcon=\"check\" colorClass=\"text-success\"></upd-icon>\n } @else {\n <upd-icon tablerIcon=\"x\" colorClass=\"text-danger\"></upd-icon>\n }\n <span class=\"ms-2\">{{ feature.text }}</span>\n </li>\n }\n </ul>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { UpdIconsModule } from '@updevs/icons';\nimport { UpdCardModule } from '@updevs/components/card';\nimport { UpdButtonModule } from '@updevs/components/button';\nimport { UpdBadgeModule } from '@updevs/components/badge';\n\nimport { PricingCardsComponent } from './pricing-cards.component';\n\n@NgModule({\n imports: [\n CommonModule,\n UpdCardModule,\n UpdIconsModule,\n UpdButtonModule,\n UpdBadgeModule\n ],\n declarations: [\n PricingCardsComponent\n ],\n exports: [\n PricingCardsComponent\n ]\n})\nexport class UpdPricingCardsModule {}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/updevs-components-table.mjs CHANGED Viewed

@@ -721,7 +721,7 @@ class FilterRowComponent extends BaseComponent {
         this.removed.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: FilterRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: FilterRowComponent, selector: "upd-filter-row", inputs: { activeFilters: { classPropertyName: "activeFilters", publicName: "activeFilters", isSignal: true, isRequired: true, transformFunction: null }, rowIndex: { classPropertyName: "rowIndex", publicName: "rowIndex", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: true, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, currentFilter: { classPropertyName: "currentFilter", publicName: "currentFilter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removed: "removed", activeFilters: "activeFiltersChange" }, host: { properties: { "class": "this.wrapperClasses" } }, usesInheritance: true, ngImport: i0, template: "<upd-select class=\"w-100\" [isDisabled]=\"isDisabled()\" [items]=\"fieldsOptions()\" (selectedItem)=\"onSelectField($event)\"\n    [selected]=\"selectedField\">\n</upd-select>\n<upd-select class=\"w-100\" [isDisabled]=\"isDisabled()\" [items]=\"comparisonOperatorOptions()\" (selectedItem)=\"onSelectOperand($event)\"\n    [selected]=\"selectedOperand\">\n</upd-select>\n\n@if (isValueSectionEnabled()) {\n    @switch (fieldType) {\n        @case (DataTypeEnum.Number) {\n            <upd-input wrapperClasses=\"w-100\" customClasses=\"h-100\" type=\"number\" (valueChange)=\"updateValue($event)\"\n                [value]=\"selectedValue\"></upd-input>\n        }\n        @case (DataTypeEnum.Date) {\n\n        }\n        @default {\n            <upd-input wrapperClasses=\"w-100\" customClasses=\"h-100\" type=\"text\" (valueChange)=\"updateValue($event)\"\n                [value]=\"selectedValue\"></upd-input>\n        }\n    }\n} @else {\n    <div class=\"w-100\">\n        <input type=\"text\" class=\"form-control h-100\" disabled>\n    </div>\n}\n\n<upd-button class=\"flex-shrink-1\" colorStyle=\"danger\" [isDisabled]=\"isDisabled()\" [isOutline]=\"true\" [isIcon]=\"true\"\n    [iconModel]=\"{tablerIcon:'x'}\" (clicked)=\"removeFilterItem()\"></upd-button>\n", styles: [""], dependencies: [{ kind: "component", type: i4.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"] }, { kind: "component", type: i5.InputComponent, selector: "upd-input", inputs: ["type", "mask", "maskConfig", "value", "size", "customClasses", "wrapperClasses", "maxLength", "isPlainText", "isReadOnly", "isLoading", "isRound", "isFlush", "isInputGroupFlat", "isPrependButton", "isAppendButton", "isFloating", "loaderPosition", "prependIconModel", "appendIconModel", "isValidationStatusLight", "layout"], outputs: ["valueChange", "blurred", "keyDown", "keyDownEsc", "keyUpEnter"] }, { kind: "component", type: i3$2.SelectComponent, selector: "upd-select", inputs: ["useSystemStyle", "shouldShowClearButton", "isCompact", "selected"], outputs: ["selectedItem"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: FilterRowComponent, selector: "upd-filter-row", inputs: { activeFilters: { classPropertyName: "activeFilters", publicName: "activeFilters", isSignal: true, isRequired: true, transformFunction: null }, rowIndex: { classPropertyName: "rowIndex", publicName: "rowIndex", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: true, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, currentFilter: { classPropertyName: "currentFilter", publicName: "currentFilter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removed: "removed", activeFilters: "activeFiltersChange" }, host: { properties: { "class": "this.wrapperClasses" } }, usesInheritance: true, ngImport: i0, template: "<upd-select class=\"w-100\" [isDisabled]=\"isDisabled()\" [items]=\"fieldsOptions()\" (selectedItem)=\"onSelectField($event)\"\n    [selected]=\"selectedField\">\n</upd-select>\n<upd-select class=\"w-100\" [isDisabled]=\"isDisabled()\" [items]=\"comparisonOperatorOptions()\" (selectedItem)=\"onSelectOperand($event)\"\n    [selected]=\"selectedOperand\">\n</upd-select>\n\n@if (isValueSectionEnabled()) {\n    @switch (fieldType) {\n        @case (DataTypeEnum.Number) {\n            <upd-input wrapperClasses=\"w-100\" customClasses=\"h-100\" type=\"number\" (valueChange)=\"updateValue($event)\"\n                [value]=\"selectedValue\"></upd-input>\n        }\n        @case (DataTypeEnum.Date) {\n\n        }\n        @default {\n            <upd-input wrapperClasses=\"w-100\" customClasses=\"h-100\" type=\"text\" (valueChange)=\"updateValue($event)\"\n                [value]=\"selectedValue\"></upd-input>\n        }\n    }\n} @else {\n    <div class=\"w-100\">\n        <input type=\"text\" class=\"form-control h-100\" disabled>\n    </div>\n}\n\n<upd-button class=\"flex-shrink-1\" colorStyle=\"danger\" [isDisabled]=\"isDisabled()\" [isOutline]=\"true\" [isIcon]=\"true\"\n    [iconModel]=\"{tablerIcon:'x'}\" (clicked)=\"removeFilterItem()\"></upd-button>\n", styles: [""], dependencies: [{ kind: "component", type: i4.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"] }, { kind: "component", type: i5.InputComponent, selector: "upd-input", inputs: ["type", "mask", "maskConfig", "value", "size", "customClasses", "wrapperClasses", "maxLength", "isPlainText", "isReadOnly", "isLoading", "isRound", "isFlush", "isInputGroupFlat", "isPrependButton", "isAppendButton", "isFloating", "loaderPosition", "prependIconModel", "appendIconModel", "isValidationStatusLight", "layout"], outputs: ["valueChange", "blurred", "keyDown", "keyDownEsc", "keyUpEnter"] }, { kind: "component", type: i3$2.SelectComponent, selector: "upd-select", inputs: ["useSystemStyle", "shouldShowClearButton", "shouldTruncateSelectedText", "isCompact", "selected"], outputs: ["selectedItem"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: FilterRowComponent, decorators: [{
             type: Component,