@ascentgl/ads-ui 0.0.1

package/fesm2022/ascentgl-ads-ui-src-lib-components-navigation-sub-navigation-items-container.mjs

@@ -0,0 +1,31 @@
+import * as i0 from '@angular/core';
+import { Component, NgModule } from '@angular/core';
+
+class AdsSubNavigationItemsContainerComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsSubNavigationItemsContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.1", type: AdsSubNavigationItemsContainerComponent, selector: "ads-sub-navigation-items-container", ngImport: i0, template: "<div class=\"sub-navigation-items-container\">\n  <ng-content></ng-content>\n</div>\n", styles: [""] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsSubNavigationItemsContainerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ads-sub-navigation-items-container', template: "<div class=\"sub-navigation-items-container\">\n  <ng-content></ng-content>\n</div>\n" }]
+        }] });
+
+class AdsSubNavigationItemsContainerModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsSubNavigationItemsContainerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.1", ngImport: i0, type: AdsSubNavigationItemsContainerModule, declarations: [AdsSubNavigationItemsContainerComponent], exports: [AdsSubNavigationItemsContainerComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsSubNavigationItemsContainerModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsSubNavigationItemsContainerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    exports: [AdsSubNavigationItemsContainerComponent],
+                    declarations: [AdsSubNavigationItemsContainerComponent],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AdsSubNavigationItemsContainerComponent, AdsSubNavigationItemsContainerModule };
+//# sourceMappingURL=ascentgl-ads-ui-src-lib-components-navigation-sub-navigation-items-container.mjs.map

package/fesm2022/ascentgl-ads-ui-src-lib-components-navigation-sub-navigation-items-container.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ascentgl-ads-ui-src-lib-components-navigation-sub-navigation-items-container.mjs","sources":["../../../../libs/ads-ui/src/lib/components/navigation/sub-navigation-items-container/sub-navigation-items-container.component.ts","../../../../libs/ads-ui/src/lib/components/navigation/sub-navigation-items-container/sub-navigation-items-container.component.html","../../../../libs/ads-ui/src/lib/components/navigation/sub-navigation-items-container/sub-navigation-items-container.module.ts","../../../../libs/ads-ui/src/lib/components/navigation/sub-navigation-items-container/ascentgl-ads-ui-src-lib-components-navigation-sub-navigation-items-container.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n  selector: 'ads-sub-navigation-items-container',\n  styleUrls: ['sub-navigation-items-container.component.scss'],\n  templateUrl: 'sub-navigation-items-container.component.html',\n})\nexport class AdsSubNavigationItemsContainerComponent {}\n","<div class=\"sub-navigation-items-container\">\n  <ng-content></ng-content>\n</div>\n","import { NgModule } from '@angular/core';\n\nimport { AdsSubNavigationItemsContainerComponent } from './sub-navigation-items-container.component';\n\n@NgModule({\n  exports: [AdsSubNavigationItemsContainerComponent],\n  declarations: [AdsSubNavigationItemsContainerComponent],\n})\nexport class AdsSubNavigationItemsContainerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MAOa,uCAAuC,CAAA;8GAAvC,uCAAuC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAvC,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uCAAuC,0ECPpD,uFAGA,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA,EAAA;;2FDIa,uCAAuC,EAAA,UAAA,EAAA,CAAA;kBALnD,SAAS;+BACE,oCAAoC,EAAA,QAAA,EAAA,uFAAA,EAAA,CAAA;;;MEKnC,oCAAoC,CAAA;8GAApC,oCAAoC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;+GAApC,oCAAoC,EAAA,YAAA,EAAA,CAFhC,uCAAuC,CAAA,EAAA,OAAA,EAAA,CAD5C,uCAAuC,CAAA,EAAA,CAAA,CAAA,EAAA;+GAGtC,oCAAoC,EAAA,CAAA,CAAA,EAAA;;2FAApC,oCAAoC,EAAA,UAAA,EAAA,CAAA;kBAJhD,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,uCAAuC,CAAC;oBAClD,YAAY,EAAE,CAAC,uCAAuC,CAAC;AACxD,iBAAA,CAAA;;;ACPD;;AAEG;;;;"}

package/fesm2022/ascentgl-ads-ui-src-lib-components-navigation.mjs

@@ -0,0 +1,45 @@
+import * as i0 from '@angular/core';
+import { Component, Input, NgModule } from '@angular/core';
+
+class AdsNavigationComponent {
+    constructor() {
+        /**
+         * Whether the navigation is collapsed
+         */
+        this.isCollapsed = false;
+        /**
+         * Whether the viewport is mobile
+         */
+        this.isMobile = false;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.1", type: AdsNavigationComponent, selector: "ads-navigation", inputs: { isCollapsed: "isCollapsed", isMobile: "isMobile" }, ngImport: i0, template: "<nav [class.collapsed]=\"isCollapsed\" [class.mobile]=\"isMobile\">\n  <ng-content></ng-content>\n</nav>\n<div class=\"overlay\" [class.mobile]=\"isMobile\"></div>\n", styles: [":host{display:flex}nav{position:absolute;z-index:999;top:0;bottom:0;left:0;width:calc(100% - 55px);background-color:#fff;transition:.5s}nav:not(.mobile){position:relative;z-index:auto;display:inline;width:229px;height:20px}nav.collapsed{margin-left:-100%}nav.collapsed:not(.mobile){overflow:hidden;width:56px;margin-left:0}.overlay{position:fixed;z-index:990;top:70px;left:0;width:100%;height:100%;background-color:var(--color-medium);opacity:50%}.overlay:not(.mobile){display:none}nav.collapsed+.overlay{display:none}\n"] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsNavigationComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ads-navigation', template: "<nav [class.collapsed]=\"isCollapsed\" [class.mobile]=\"isMobile\">\n  <ng-content></ng-content>\n</nav>\n<div class=\"overlay\" [class.mobile]=\"isMobile\"></div>\n", styles: [":host{display:flex}nav{position:absolute;z-index:999;top:0;bottom:0;left:0;width:calc(100% - 55px);background-color:#fff;transition:.5s}nav:not(.mobile){position:relative;z-index:auto;display:inline;width:229px;height:20px}nav.collapsed{margin-left:-100%}nav.collapsed:not(.mobile){overflow:hidden;width:56px;margin-left:0}.overlay{position:fixed;z-index:990;top:70px;left:0;width:100%;height:100%;background-color:var(--color-medium);opacity:50%}.overlay:not(.mobile){display:none}nav.collapsed+.overlay{display:none}\n"] }]
+        }], propDecorators: { isCollapsed: [{
+                type: Input
+            }], isMobile: [{
+                type: Input
+            }] } });
+
+class AdsNavigationModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsNavigationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.1", ngImport: i0, type: AdsNavigationModule, declarations: [AdsNavigationComponent], exports: [AdsNavigationComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsNavigationModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsNavigationModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    exports: [AdsNavigationComponent],
+                    declarations: [AdsNavigationComponent],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AdsNavigationComponent, AdsNavigationModule };
+//# sourceMappingURL=ascentgl-ads-ui-src-lib-components-navigation.mjs.map

package/fesm2022/ascentgl-ads-ui-src-lib-components-navigation.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ascentgl-ads-ui-src-lib-components-navigation.mjs","sources":["../../../../libs/ads-ui/src/lib/components/navigation/navigation.component.ts","../../../../libs/ads-ui/src/lib/components/navigation/navigation.component.html","../../../../libs/ads-ui/src/lib/components/navigation/navigation.module.ts","../../../../libs/ads-ui/src/lib/components/navigation/ascentgl-ads-ui-src-lib-components-navigation.ts"],"sourcesContent":["import { Component, Input } from '@angular/core';\n\n@Component({\n  selector: 'ads-navigation',\n  styleUrls: ['./navigation.component.scss'],\n  templateUrl: 'navigation.component.html',\n})\nexport class AdsNavigationComponent {\n  /**\n   * Whether the navigation is collapsed\n   */\n  @Input() isCollapsed = false;\n\n  /**\n   * Whether the viewport is mobile\n   */\n  @Input() isMobile = false;\n}\n","<nav [class.collapsed]=\"isCollapsed\" [class.mobile]=\"isMobile\">\n  <ng-content></ng-content>\n</nav>\n<div class=\"overlay\" [class.mobile]=\"isMobile\"></div>\n","import { NgModule } from '@angular/core';\nimport { AdsNavigationComponent } from './navigation.component';\n\n@NgModule({\n  exports: [AdsNavigationComponent],\n  declarations: [AdsNavigationComponent],\n})\nexport class AdsNavigationModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MAOa,sBAAsB,CAAA;AALnC,IAAA,WAAA,GAAA;AAME;;AAEG;QACM,IAAW,CAAA,WAAA,GAAG,KAAK,CAAC;AAE7B;;AAEG;QACM,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC;AAC3B,KAAA;8GAVY,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAtB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,sBAAsB,oHCPnC,uKAIA,EAAA,MAAA,EAAA,CAAA,0gBAAA,CAAA,EAAA,CAAA,CAAA,EAAA;;2FDGa,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBALlC,SAAS;+BACE,gBAAgB,EAAA,QAAA,EAAA,uKAAA,EAAA,MAAA,EAAA,CAAA,0gBAAA,CAAA,EAAA,CAAA;8BAQjB,WAAW,EAAA,CAAA;sBAAnB,KAAK;gBAKG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;;;METK,mBAAmB,CAAA;8GAAnB,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;+GAAnB,mBAAmB,EAAA,YAAA,EAAA,CAFf,sBAAsB,CAAA,EAAA,OAAA,EAAA,CAD3B,sBAAsB,CAAA,EAAA,CAAA,CAAA,EAAA;+GAGrB,mBAAmB,EAAA,CAAA,CAAA,EAAA;;2FAAnB,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAJ/B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,sBAAsB,CAAC;oBACjC,YAAY,EAAE,CAAC,sBAAsB,CAAC;AACvC,iBAAA,CAAA;;;ACND;;AAEG;;;;"}

package/fesm2022/ascentgl-ads-ui-src-lib-components-pagination-container.mjs

@@ -0,0 +1,31 @@
+import * as i0 from '@angular/core';
+import { Component, NgModule } from '@angular/core';
+
+class AdsPaginationContainerComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.1", type: AdsPaginationContainerComponent, selector: "ads-pagination-container", ngImport: i0, template: "<div class=\"pagination-container\">\n  <ng-content></ng-content>\n</div>\n", styles: [".pagination-container{display:flex;flex-direction:row-reverse;padding:24px 0}\n"] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationContainerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ads-pagination-container', template: "<div class=\"pagination-container\">\n  <ng-content></ng-content>\n</div>\n", styles: [".pagination-container{display:flex;flex-direction:row-reverse;padding:24px 0}\n"] }]
+        }] });
+
+class AdsPaginationContainerModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationContainerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationContainerModule, declarations: [AdsPaginationContainerComponent], exports: [AdsPaginationContainerComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationContainerModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationContainerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [AdsPaginationContainerComponent],
+                    exports: [AdsPaginationContainerComponent],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AdsPaginationContainerComponent, AdsPaginationContainerModule };
+//# sourceMappingURL=ascentgl-ads-ui-src-lib-components-pagination-container.mjs.map

package/fesm2022/ascentgl-ads-ui-src-lib-components-pagination-container.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ascentgl-ads-ui-src-lib-components-pagination-container.mjs","sources":["../../../../libs/ads-ui/src/lib/components/pagination/container/pagination-container.component.ts","../../../../libs/ads-ui/src/lib/components/pagination/container/pagination-container.component.html","../../../../libs/ads-ui/src/lib/components/pagination/container/pagination-container.module.ts","../../../../libs/ads-ui/src/lib/components/pagination/container/ascentgl-ads-ui-src-lib-components-pagination-container.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n  selector: 'ads-pagination-container',\n  styleUrls: ['pagination-container.component.scss'],\n  templateUrl: 'pagination-container.component.html',\n})\nexport class AdsPaginationContainerComponent {}\n","<div class=\"pagination-container\">\n  <ng-content></ng-content>\n</div>\n","import { NgModule } from '@angular/core';\n\nimport { AdsPaginationContainerComponent } from './pagination-container.component';\n\n@NgModule({\n  declarations: [AdsPaginationContainerComponent],\n  exports: [AdsPaginationContainerComponent],\n})\nexport class AdsPaginationContainerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MAOa,+BAA+B,CAAA;8GAA/B,+BAA+B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAA/B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,+BAA+B,gECP5C,6EAGA,EAAA,MAAA,EAAA,CAAA,iFAAA,CAAA,EAAA,CAAA,CAAA,EAAA;;2FDIa,+BAA+B,EAAA,UAAA,EAAA,CAAA;kBAL3C,SAAS;+BACE,0BAA0B,EAAA,QAAA,EAAA,6EAAA,EAAA,MAAA,EAAA,CAAA,iFAAA,CAAA,EAAA,CAAA;;;MEKzB,4BAA4B,CAAA;8GAA5B,4BAA4B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;+GAA5B,4BAA4B,EAAA,YAAA,EAAA,CAHxB,+BAA+B,CAAA,EAAA,OAAA,EAAA,CACpC,+BAA+B,CAAA,EAAA,CAAA,CAAA,EAAA;+GAE9B,4BAA4B,EAAA,CAAA,CAAA,EAAA;;2FAA5B,4BAA4B,EAAA,UAAA,EAAA,CAAA;kBAJxC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,+BAA+B,CAAC;oBAC/C,OAAO,EAAE,CAAC,+BAA+B,CAAC;AAC3C,iBAAA,CAAA;;;ACPD;;AAEG;;;;"}

package/fesm2022/ascentgl-ads-ui-src-lib-components-pagination.mjs

@@ -0,0 +1,107 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
+import * as i1 from '@ascentgl/ads-icons';
+import { AdsIconModule } from '@ascentgl/ads-icons';
+import { adsIconChevronLeft, adsIconChevronRight, adsIconMenuMoreInfo } from '@ascentgl/ads-icons/icons';
+import * as i2 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+class AdsPaginationComponent {
+    constructor(registry) {
+        this.registry = registry;
+        /**
+         * Event emitted when a page button is clicked
+         */
+        this.goToPage = new EventEmitter();
+        /**
+         * Event emitted when the next page button is clicked
+         */
+        this.goToNextPage = new EventEmitter();
+        /**
+         * Event emitted when the previous page button is clicked
+         */
+        this.goToPreviousPage = new EventEmitter();
+        /** @ignore */
+        this.pages = [];
+        this.registry.register([adsIconChevronLeft, adsIconChevronRight, adsIconMenuMoreInfo]);
+    }
+    /** @ignore */
+    ngOnChanges(changes) {
+        if ((changes.currentPage && changes.currentPage.currentValue) ||
+            (changes.totalPages && changes.totalPages.currentValue)) {
+            this.pages = this.getPagesToDisplay();
+        }
+    }
+    /** @ignore */
+    onGoToPage(page) {
+        this.goToPage.emit(page);
+    }
+    /** @ignore */
+    onGoToNextPage() {
+        this.goToNextPage.emit();
+    }
+    /** @ignore */
+    onGoToPreviousPage() {
+        this.goToPreviousPage.emit();
+    }
+    /** @ignore */
+    getPagesToDisplay() {
+        if (this.totalPages <= 7) {
+            return [...Array(this.totalPages).keys()].map((x) => ++x);
+        }
+        if (this.currentPage > 5) {
+            if (this.currentPage >= this.totalPages - 4) {
+                return [
+                    1,
+                    -1,
+                    this.totalPages - 4,
+                    this.totalPages - 3,
+                    this.totalPages - 2,
+                    this.totalPages - 1,
+                    this.totalPages,
+                ];
+            }
+            else {
+                return [1, -1, this.currentPage - 1, this.currentPage, this.currentPage + 1, -1, this.totalPages];
+            }
+        }
+        return [1, 2, 3, 4, 5, -1, this.totalPages];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationComponent, deps: [{ token: i1.AdsIconRegistry }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.1", type: AdsPaginationComponent, selector: "ads-pagination", inputs: { totalPages: "totalPages", currentPage: "currentPage" }, outputs: { goToPage: "goToPage", goToNextPage: "goToNextPage", goToPreviousPage: "goToPreviousPage" }, usesOnChanges: true, ngImport: i0, template: "<nav aria-label=\"Pagination\">\n  <ul>\n    <li>\n      <button\n        aria-label=\"Go To Previous Page\"\n        [attr.aria-disabled]=\"currentPage === 1\"\n        [disabled]=\"currentPage === 1\"\n        id=\"paginationPrevious\"\n        (click)=\"onGoToPreviousPage()\"\n      >\n        <ads-icon name=\"chevron_left\" size=\"xs\" theme=\"primary\"></ads-icon>\n      </button>\n    </li>\n    <li *ngFor=\"let page of pages\">\n      <a\n        *ngIf=\"page !== -1; else more\"\n        class=\"internal\"\n        role=\"button\"\n        [attr.aria-current]=\"page === currentPage\"\n        [attr.aria-label]=\"page === currentPage ? 'Current Page, Page ' + page : 'Go to Page ' + page\"\n        [class.current]=\"page === currentPage\"\n        [id]=\"'paginationPage' + page\"\n        tabindex=\"0\"\n        (click)=\"onGoToPage(page)\"\n        (keyup.enter)=\"onGoToPage(page)\"\n        >{{ page }}</a\n      >\n      <ng-template #more>\n        <a class=\"more\">\n          <ads-icon name=\"menu_more_info\" size=\"xs\" theme=\"primary\"></ads-icon>\n        </a>\n      </ng-template>\n    </li>\n    <li>\n      <button\n        aria-label=\"Go To Next Page\"\n        [attr.aria-disabled]=\"currentPage === totalPages\"\n        [disabled]=\"currentPage === totalPages\"\n        id=\"paginationNext\"\n        (click)=\"onGoToNextPage()\"\n      >\n        <ads-icon name=\"chevron_right\" size=\"xs\" theme=\"primary\"></ads-icon>\n      </button>\n    </li>\n  </ul>\n</nav>\n", styles: ["nav{display:flex;max-height:30px;align-items:center}ul{display:flex;max-height:30px;justify-content:flex-end;padding:0;margin:0;list-style:none}li{display:flex;min-width:30px;flex-direction:column;align-items:center;justify-content:center;margin:0 4px;-webkit-user-select:none;user-select:none}a{display:grid;width:100%;cursor:pointer;place-items:center}a.more{padding-top:4px}a.more .ads-icon{padding-left:4px;transform:rotate(90deg)}a.more:hover,a:focus,a.current{cursor:default;text-decoration:none}a.current,a:focus,a:not(.more):hover{background-color:var(--color-light-30);border-radius:5px;outline:none}button{display:grid;height:30px;border:none;background-color:transparent;cursor:pointer;place-items:center}button[disabled]{cursor:default}button[disabled] .ads-icon{color:var(--color-light)!important}button:not([disabled]):hover,button:not([disabled]):focus{background-color:var(--color-light-30);border-radius:5px;cursor:pointer;outline:none}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ads-pagination', template: "<nav aria-label=\"Pagination\">\n  <ul>\n    <li>\n      <button\n        aria-label=\"Go To Previous Page\"\n        [attr.aria-disabled]=\"currentPage === 1\"\n        [disabled]=\"currentPage === 1\"\n        id=\"paginationPrevious\"\n        (click)=\"onGoToPreviousPage()\"\n      >\n        <ads-icon name=\"chevron_left\" size=\"xs\" theme=\"primary\"></ads-icon>\n      </button>\n    </li>\n    <li *ngFor=\"let page of pages\">\n      <a\n        *ngIf=\"page !== -1; else more\"\n        class=\"internal\"\n        role=\"button\"\n        [attr.aria-current]=\"page === currentPage\"\n        [attr.aria-label]=\"page === currentPage ? 'Current Page, Page ' + page : 'Go to Page ' + page\"\n        [class.current]=\"page === currentPage\"\n        [id]=\"'paginationPage' + page\"\n        tabindex=\"0\"\n        (click)=\"onGoToPage(page)\"\n        (keyup.enter)=\"onGoToPage(page)\"\n        >{{ page }}</a\n      >\n      <ng-template #more>\n        <a class=\"more\">\n          <ads-icon name=\"menu_more_info\" size=\"xs\" theme=\"primary\"></ads-icon>\n        </a>\n      </ng-template>\n    </li>\n    <li>\n      <button\n        aria-label=\"Go To Next Page\"\n        [attr.aria-disabled]=\"currentPage === totalPages\"\n        [disabled]=\"currentPage === totalPages\"\n        id=\"paginationNext\"\n        (click)=\"onGoToNextPage()\"\n      >\n        <ads-icon name=\"chevron_right\" size=\"xs\" theme=\"primary\"></ads-icon>\n      </button>\n    </li>\n  </ul>\n</nav>\n", styles: ["nav{display:flex;max-height:30px;align-items:center}ul{display:flex;max-height:30px;justify-content:flex-end;padding:0;margin:0;list-style:none}li{display:flex;min-width:30px;flex-direction:column;align-items:center;justify-content:center;margin:0 4px;-webkit-user-select:none;user-select:none}a{display:grid;width:100%;cursor:pointer;place-items:center}a.more{padding-top:4px}a.more .ads-icon{padding-left:4px;transform:rotate(90deg)}a.more:hover,a:focus,a.current{cursor:default;text-decoration:none}a.current,a:focus,a:not(.more):hover{background-color:var(--color-light-30);border-radius:5px;outline:none}button{display:grid;height:30px;border:none;background-color:transparent;cursor:pointer;place-items:center}button[disabled]{cursor:default}button[disabled] .ads-icon{color:var(--color-light)!important}button:not([disabled]):hover,button:not([disabled]):focus{background-color:var(--color-light-30);border-radius:5px;cursor:pointer;outline:none}\n"] }]
+        }], ctorParameters: () => [{ type: i1.AdsIconRegistry }], propDecorators: { totalPages: [{
+                type: Input
+            }], currentPage: [{
+                type: Input
+            }], goToPage: [{
+                type: Output
+            }], goToNextPage: [{
+                type: Output
+            }], goToPreviousPage: [{
+                type: Output
+            }] } });
+
+class AdsPaginationModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationModule, declarations: [AdsPaginationComponent], imports: [CommonModule, AdsIconModule], exports: [AdsPaginationComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationModule, imports: [CommonModule, AdsIconModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsPaginationModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, AdsIconModule],
+                    declarations: [AdsPaginationComponent],
+                    exports: [AdsPaginationComponent],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AdsPaginationComponent, AdsPaginationModule };
+//# sourceMappingURL=ascentgl-ads-ui-src-lib-components-pagination.mjs.map

package/fesm2022/ascentgl-ads-ui-src-lib-components-pagination.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ascentgl-ads-ui-src-lib-components-pagination.mjs","sources":["../../../../libs/ads-ui/src/lib/components/pagination/pagination.component.ts","../../../../libs/ads-ui/src/lib/components/pagination/pagination.component.html","../../../../libs/ads-ui/src/lib/components/pagination/pagination.module.ts","../../../../libs/ads-ui/src/lib/components/pagination/ascentgl-ads-ui-src-lib-components-pagination.ts"],"sourcesContent":["import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';\nimport { AdsIconRegistry } from '@ascentgl/ads-icons';\nimport { adsIconChevronLeft, adsIconChevronRight, adsIconMenuMoreInfo } from '@ascentgl/ads-icons/icons';\n\n@Component({\n  selector: 'ads-pagination',\n  templateUrl: './pagination.component.html',\n  styleUrls: ['./pagination.component.scss'],\n})\nexport class AdsPaginationComponent implements OnChanges {\n  constructor(private registry: AdsIconRegistry) {\n    this.registry.register([adsIconChevronLeft, adsIconChevronRight, adsIconMenuMoreInfo]);\n  }\n\n  /**\n   * The total number of pages\n   */\n  @Input() totalPages!: number;\n\n  /**\n   * The current page\n   */\n  @Input() currentPage!: number;\n\n  /**\n   * Event emitted when a page button is clicked\n   */\n  @Output() goToPage: EventEmitter<number> = new EventEmitter<number>();\n\n  /**\n   * Event emitted when the next page button is clicked\n   */\n  @Output() goToNextPage: EventEmitter<null> = new EventEmitter<null>();\n\n  /**\n   * Event emitted when the previous page button is clicked\n   */\n  @Output() goToPreviousPage: EventEmitter<null> = new EventEmitter<null>();\n\n  /** @ignore */\n  public pages: number[] = [];\n\n  /** @ignore */\n  ngOnChanges(changes: SimpleChanges): void {\n    if (\n      (changes.currentPage && changes.currentPage.currentValue) ||\n      (changes.totalPages && changes.totalPages.currentValue)\n    ) {\n      this.pages = this.getPagesToDisplay();\n    }\n  }\n\n  /** @ignore */\n  public onGoToPage(page: number): void {\n    this.goToPage.emit(page);\n  }\n\n  /** @ignore */\n  public onGoToNextPage(): void {\n    this.goToNextPage.emit();\n  }\n\n  /** @ignore */\n  public onGoToPreviousPage(): void {\n    this.goToPreviousPage.emit();\n  }\n\n  /** @ignore */\n  private getPagesToDisplay(): number[] {\n    if (this.totalPages <= 7) {\n      return [...Array(this.totalPages).keys()].map((x) => ++x);\n    }\n\n    if (this.currentPage > 5) {\n      if (this.currentPage >= this.totalPages - 4) {\n        return [\n          1,\n          -1,\n          this.totalPages - 4,\n          this.totalPages - 3,\n          this.totalPages - 2,\n          this.totalPages - 1,\n          this.totalPages,\n        ];\n      } else {\n        return [1, -1, this.currentPage - 1, this.currentPage, this.currentPage + 1, -1, this.totalPages];\n      }\n    }\n\n    return [1, 2, 3, 4, 5, -1, this.totalPages];\n  }\n}\n","<nav aria-label=\"Pagination\">\n  <ul>\n    <li>\n      <button\n        aria-label=\"Go To Previous Page\"\n        [attr.aria-disabled]=\"currentPage === 1\"\n        [disabled]=\"currentPage === 1\"\n        id=\"paginationPrevious\"\n        (click)=\"onGoToPreviousPage()\"\n      >\n        <ads-icon name=\"chevron_left\" size=\"xs\" theme=\"primary\"></ads-icon>\n      </button>\n    </li>\n    <li *ngFor=\"let page of pages\">\n      <a\n        *ngIf=\"page !== -1; else more\"\n        class=\"internal\"\n        role=\"button\"\n        [attr.aria-current]=\"page === currentPage\"\n        [attr.aria-label]=\"page === currentPage ? 'Current Page, Page ' + page : 'Go to Page ' + page\"\n        [class.current]=\"page === currentPage\"\n        [id]=\"'paginationPage' + page\"\n        tabindex=\"0\"\n        (click)=\"onGoToPage(page)\"\n        (keyup.enter)=\"onGoToPage(page)\"\n        >{{ page }}</a\n      >\n      <ng-template #more>\n        <a class=\"more\">\n          <ads-icon name=\"menu_more_info\" size=\"xs\" theme=\"primary\"></ads-icon>\n        </a>\n      </ng-template>\n    </li>\n    <li>\n      <button\n        aria-label=\"Go To Next Page\"\n        [attr.aria-disabled]=\"currentPage === totalPages\"\n        [disabled]=\"currentPage === totalPages\"\n        id=\"paginationNext\"\n        (click)=\"onGoToNextPage()\"\n      >\n        <ads-icon name=\"chevron_right\" size=\"xs\" theme=\"primary\"></ads-icon>\n      </button>\n    </li>\n  </ul>\n</nav>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AdsPaginationComponent } from './pagination.component';\nimport { AdsIconModule } from '@ascentgl/ads-icons';\n\n@NgModule({\n  imports: [CommonModule, AdsIconModule],\n  declarations: [AdsPaginationComponent],\n  exports: [AdsPaginationComponent],\n})\nexport class AdsPaginationModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ascentgl-ads-ui-src-lib-components-progress-indicators-progress-bar.mjs

@@ -0,0 +1,100 @@
+import * as i0 from '@angular/core';
+import { Component, Input, NgModule } from '@angular/core';
+import * as i1 from '@ascentgl/ads-icons';
+import { AdsIconModule } from '@ascentgl/ads-icons';
+import { adsIconSortDescending } from '@ascentgl/ads-icons/icons';
+import * as i2 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+class AdsProgressBarComponent {
+    constructor(registry) {
+        this.registry = registry;
+        /**
+         * Whether or not the progress bar is disabled
+         */
+        this.disabled = false;
+        /**
+         * The max value of the progress bar
+         */
+        this.max = 100;
+        /**
+         * The value of the progress bar
+         */
+        this.value = 0;
+        /** @ignore */
+        this.color = 'primary';
+        this.registry.register(adsIconSortDescending);
+    }
+    /**
+     * @ignore
+     * Only show the marker if the bar has progress and is not completed
+     */
+    get showMarker() {
+        return this.value > 0 && this.value < this.max;
+    }
+    /** @ignore */
+    ngOnChanges(changes) {
+        if (this.value > this.max) {
+            console.warn(`The current value (${this.value}) of the progress bar is greater than the max (${this.max}). Did you forget to add the 'max' attribute?`);
+        }
+        if (changes.value || changes.max) {
+            this.color = this.getColor(this.value, this.max, this.disabled);
+            this.markerPosition = this.getMarkerPosition(this.value, this.max);
+        }
+        if (changes.disabled) {
+            this.color = this.getColor(this.value, this.max, this.disabled);
+        }
+        if (changes.ariaLabel) {
+            this.ariaLabel = this.getLabel(this.max);
+        }
+    }
+    /** @ignore */
+    getColor(value, max, disabled) {
+        return disabled ? 'medium' : value >= max ? 'success' : 'primary';
+    }
+    /** @ignore */
+    getLabel(max) {
+        return this.ariaLabel ?? `A bounded progress bar from 0 to ${max}`;
+    }
+    /** @ignore */
+    getMarkerPosition(value, max) {
+        return `calc(${(value / max) * 100}% + 5.5px)`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsProgressBarComponent, deps: [{ token: i1.AdsIconRegistry }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.1", type: AdsProgressBarComponent, selector: "ads-progress-bar", inputs: { id: "id", disabled: "disabled", ariaLabel: "ariaLabel", max: "max", value: "value" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"progress-container\" [ngClass]=\"color\" [class.completed]=\"value >= max\">\n  <div class=\"progress-marker\" [ngStyle]=\"{ width: markerPosition }\">\n    <ads-icon *ngIf=\"showMarker\" name=\"sort_descending\" size=\"xxxs\"></ads-icon>\n  </div>\n  <progress\n    role=\"progressbar\"\n    aria-valuemin=\"0\"\n    [attr.aria-valuemax]=\"max\"\n    [attr.aria-label]=\"ariaLabel\"\n    [value]=\"value\"\n    [max]=\"max\"\n    [id]=\"id\"\n  ></progress>\n</div>\n", styles: ["progress[value]{width:100%;height:4px;border:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--color-light);border-radius:2px}progress[value]::-webkit-progress-bar{background-color:var(--color-light);border-radius:2px}progress[value]::-moz-progress-bar{border-radius:2px}progress[value]::-webkit-progress-value{border-bottom-left-radius:2px;border-top-left-radius:2px}.progress-container.completed progress[value]::-webkit-progress-value{border-radius:2px}.progress-container{display:flex;flex-direction:column}.progress-marker{position:relative;display:flex;min-height:11px;max-height:11px;justify-content:flex-end;padding-bottom:2px}.progress-container.primary progress[value]::-webkit-progress-value{background-color:var(--color-primary)}.progress-container.primary progress[value]::-moz-progress-bar{background-color:var(--color-primary)}.progress-container.success progress[value]::-webkit-progress-value{background-color:var(--color-success)}.progress-container.success progress[value]::-moz-progress-bar{background-color:var(--color-success)}.progress-container.medium progress[value]::-webkit-progress-value{background-color:var(--color-medium-50)}.progress-container.medium progress[value]::-moz-progress-bar{background-color:var(--color-medium-50)}::ng-deep .progress-container.primary .ads-icon{color:var(--color-primary)}::ng-deep .progress-container.success .ads-icon{color:var(--color-success)}::ng-deep .progress-container.medium .ads-icon{color:var(--color-medium-50)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsProgressBarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ads-progress-bar', template: "<div class=\"progress-container\" [ngClass]=\"color\" [class.completed]=\"value >= max\">\n  <div class=\"progress-marker\" [ngStyle]=\"{ width: markerPosition }\">\n    <ads-icon *ngIf=\"showMarker\" name=\"sort_descending\" size=\"xxxs\"></ads-icon>\n  </div>\n  <progress\n    role=\"progressbar\"\n    aria-valuemin=\"0\"\n    [attr.aria-valuemax]=\"max\"\n    [attr.aria-label]=\"ariaLabel\"\n    [value]=\"value\"\n    [max]=\"max\"\n    [id]=\"id\"\n  ></progress>\n</div>\n", styles: ["progress[value]{width:100%;height:4px;border:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--color-light);border-radius:2px}progress[value]::-webkit-progress-bar{background-color:var(--color-light);border-radius:2px}progress[value]::-moz-progress-bar{border-radius:2px}progress[value]::-webkit-progress-value{border-bottom-left-radius:2px;border-top-left-radius:2px}.progress-container.completed progress[value]::-webkit-progress-value{border-radius:2px}.progress-container{display:flex;flex-direction:column}.progress-marker{position:relative;display:flex;min-height:11px;max-height:11px;justify-content:flex-end;padding-bottom:2px}.progress-container.primary progress[value]::-webkit-progress-value{background-color:var(--color-primary)}.progress-container.primary progress[value]::-moz-progress-bar{background-color:var(--color-primary)}.progress-container.success progress[value]::-webkit-progress-value{background-color:var(--color-success)}.progress-container.success progress[value]::-moz-progress-bar{background-color:var(--color-success)}.progress-container.medium progress[value]::-webkit-progress-value{background-color:var(--color-medium-50)}.progress-container.medium progress[value]::-moz-progress-bar{background-color:var(--color-medium-50)}::ng-deep .progress-container.primary .ads-icon{color:var(--color-primary)}::ng-deep .progress-container.success .ads-icon{color:var(--color-success)}::ng-deep .progress-container.medium .ads-icon{color:var(--color-medium-50)}\n"] }]
+        }], ctorParameters: () => [{ type: i1.AdsIconRegistry }], propDecorators: { id: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], ariaLabel: [{
+                type: Input
+            }], max: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }] } });
+
+class AdsProgressBarModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.1.1", ngImport: i0, type: AdsProgressBarModule, declarations: [AdsProgressBarComponent], imports: [CommonModule, AdsIconModule], exports: [AdsProgressBarComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsProgressBarModule, imports: [CommonModule, AdsIconModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImport: i0, type: AdsProgressBarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, AdsIconModule],
+                    declarations: [AdsProgressBarComponent],
+                    exports: [AdsProgressBarComponent],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AdsProgressBarComponent, AdsProgressBarModule };
+//# sourceMappingURL=ascentgl-ads-ui-src-lib-components-progress-indicators-progress-bar.mjs.map

package/fesm2022/ascentgl-ads-ui-src-lib-components-progress-indicators-progress-bar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ascentgl-ads-ui-src-lib-components-progress-indicators-progress-bar.mjs","sources":["../../../../libs/ads-ui/src/lib/components/progress-indicators/progress-bar/progress-bar.component.ts","../../../../libs/ads-ui/src/lib/components/progress-indicators/progress-bar/progress-bar.component.html","../../../../libs/ads-ui/src/lib/components/progress-indicators/progress-bar/progress-bar.module.ts","../../../../libs/ads-ui/src/lib/components/progress-indicators/progress-bar/ascentgl-ads-ui-src-lib-components-progress-indicators-progress-bar.ts"],"sourcesContent":["import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';\nimport { AdsIconRegistry } from '@ascentgl/ads-icons';\nimport { adsIconSortDescending } from '@ascentgl/ads-icons/icons';\n\ntype Theme = 'primary' | 'success' | 'medium';\n\n@Component({\n  selector: 'ads-progress-bar',\n  templateUrl: './progress-bar.component.html',\n  styleUrls: ['./progress-bar.component.scss'],\n})\nexport class AdsProgressBarComponent implements OnChanges {\n  constructor(private registry: AdsIconRegistry) {\n    this.registry.register(adsIconSortDescending);\n  }\n\n  /**\n   * The unique ID for the progress bar\n   */\n  @Input() id!: string;\n\n  /**\n   * Whether or not the progress bar is disabled\n   */\n  @Input() disabled = false;\n\n  /**\n   * Aria label for the progress element\n   */\n  @Input() ariaLabel!: string;\n\n  /**\n   * The max value of the progress bar\n   */\n  @Input() max = 100;\n\n  /**\n   * The value of the progress bar\n   */\n  @Input() value = 0;\n\n  /**\n   * @ignore\n   * Only show the marker if the bar has progress and is not completed\n   */\n  get showMarker(): boolean {\n    return this.value > 0 && this.value < this.max;\n  }\n\n  /** @ignore */\n  public color: Theme = 'primary';\n\n  /** @ignore */\n  public markerPosition!: string;\n\n  /** @ignore */\n  ngOnChanges(changes: SimpleChanges): void {\n    if (this.value > this.max) {\n      console.warn(\n        `The current value (${this.value}) of the progress bar is greater than the max (${this.max}). Did you forget to add the 'max' attribute?`,\n      );\n    }\n\n    if (changes.value || changes.max) {\n      this.color = this.getColor(this.value, this.max, this.disabled);\n      this.markerPosition = this.getMarkerPosition(this.value, this.max);\n    }\n\n    if (changes.disabled) {\n      this.color = this.getColor(this.value, this.max, this.disabled);\n    }\n\n    if (changes.ariaLabel) {\n      this.ariaLabel = this.getLabel(this.max);\n    }\n  }\n\n  /** @ignore */\n  private getColor(value: number, max: number, disabled: boolean): Theme {\n    return disabled ? 'medium' : value >= max ? 'success' : 'primary';\n  }\n\n  /** @ignore */\n  private getLabel(max: number): string {\n    return this.ariaLabel ?? `A bounded progress bar from 0 to ${max}`;\n  }\n\n  /** @ignore */\n  private getMarkerPosition(value: number, max: number): string {\n    return `calc(${(value / max) * 100}% + 5.5px)`;\n  }\n}\n","<div class=\"progress-container\" [ngClass]=\"color\" [class.completed]=\"value >= max\">\n  <div class=\"progress-marker\" [ngStyle]=\"{ width: markerPosition }\">\n    <ads-icon *ngIf=\"showMarker\" name=\"sort_descending\" size=\"xxxs\"></ads-icon>\n  </div>\n  <progress\n    role=\"progressbar\"\n    aria-valuemin=\"0\"\n    [attr.aria-valuemax]=\"max\"\n    [attr.aria-label]=\"ariaLabel\"\n    [value]=\"value\"\n    [max]=\"max\"\n    [id]=\"id\"\n  ></progress>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AdsProgressBarComponent } from './progress-bar.component';\nimport { AdsIconModule } from '@ascentgl/ads-icons';\n\n@NgModule({\n  imports: [CommonModule, AdsIconModule],\n  declarations: [AdsProgressBarComponent],\n  exports: [AdsProgressBarComponent],\n})\nexport class AdsProgressBarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}