@hermes-ui/angular 0.1.5 → 0.1.6

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 (33) hide show
  1. package/fesm2022/hermes-ui-angular-addons-theme-builder.mjs +1 -1
  2. package/fesm2022/hermes-ui-angular-addons-theme-builder.mjs.map +1 -1
  3. package/fesm2022/hermes-ui-angular-card.mjs +48 -0
  4. package/fesm2022/hermes-ui-angular-card.mjs.map +1 -0
  5. package/fesm2022/hermes-ui-angular-divider.mjs +46 -0
  6. package/fesm2022/hermes-ui-angular-divider.mjs.map +1 -0
  7. package/fesm2022/hermes-ui-angular-forms-datepicker.mjs +1 -1
  8. package/fesm2022/hermes-ui-angular-forms-datepicker.mjs.map +1 -1
  9. package/fesm2022/hermes-ui-angular-layout-vertical-nav.mjs +31 -3
  10. package/fesm2022/hermes-ui-angular-layout-vertical-nav.mjs.map +1 -1
  11. package/fesm2022/hermes-ui-angular-pagination.mjs +116 -0
  12. package/fesm2022/hermes-ui-angular-pagination.mjs.map +1 -0
  13. package/fesm2022/hermes-ui-angular.mjs +16 -3
  14. package/fesm2022/hermes-ui-angular.mjs.map +1 -1
  15. package/layout/vertical-nav/_mixins.vertical-nav.scss +3 -7
  16. package/layout/vertical-nav/_properties.vertical-nav.scss +10 -5
  17. package/layout/vertical-nav/_variables.vertical-nav.scss +2 -0
  18. package/layout/vertical-nav/_vertical-nav.clarity.scss +14 -0
  19. package/package.json +13 -1
  20. package/popover/dropdown/_dropdown.clarity.scss +8 -7
  21. package/popover/dropdown/_menu-mixins.clarity.scss +22 -6
  22. package/popover/dropdown/_properties.dropdown.scss +20 -0
  23. package/popover/dropdown/_variables.dropdown.scss +7 -0
  24. package/types/hermes-ui-angular-card.d.ts +24 -0
  25. package/types/hermes-ui-angular-card.d.ts.map +1 -0
  26. package/types/hermes-ui-angular-divider.d.ts +20 -0
  27. package/types/hermes-ui-angular-divider.d.ts.map +1 -0
  28. package/types/hermes-ui-angular-layout-vertical-nav.d.ts +11 -1
  29. package/types/hermes-ui-angular-layout-vertical-nav.d.ts.map +1 -1
  30. package/types/hermes-ui-angular-pagination.d.ts +52 -0
  31. package/types/hermes-ui-angular-pagination.d.ts.map +1 -0
  32. package/types/hermes-ui-angular.d.ts +23 -17
  33. package/types/hermes-ui-angular.d.ts.map +1 -1
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hermes-ui-angular-card.mjs","sources":["../../../card/card.ts","../../../card/index.ts","../../../card/hermes-ui-angular-card.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.\n * The term \"Broadcom\" refers to Broadcom Inc. and/or its subsidiaries.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\n\nimport { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';\n\n/**\n * A styled container for grouping related content. Compose the inside with\n * `hermes-layout`, `hermes-text` and `hermes-divider` (with the\n * `hermes-card-remove-margin` attribute to bleed a divider edge-to-edge).\n *\n * ```html\n * <hermes-card aria-labelledby=\"my-card-title\">\n * <div hermes-layout=\"vertical gap:md\">\n * <h2 id=\"my-card-title\" hermes-text=\"section\">Card title</h2>\n * <hermes-divider hermes-card-remove-margin></hermes-divider>\n * <div hermes-text=\"body light\">Card content</div>\n * </div>\n * </hermes-card>\n * ```\n */\n@Component({\n selector: 'hermes-card',\n template: `<div class=\"private-host\"><ng-content></ng-content></div>`,\n styleUrls: ['./card.component.scss'],\n encapsulation: ViewEncapsulation.ExperimentalIsolatedShadowDom,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n role: 'region',\n },\n})\nexport class HermesCard {}\n","/*\n * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.\n * The term \"Broadcom\" refers to Broadcom Inc. and/or its subsidiaries.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\n\nexport * from './card';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAAA;;;;;AAKG;AAIH;;;;;;;;;;;;;;AAcG;MAWU,UAAU,CAAA;+GAAV,UAAU,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAV,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,UAAU,mHARX,CAAA,yDAAA,CAA2D,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,6iCAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,6BAAA,EAAA,CAAA,CAAA;;4FAQ1D,UAAU,EAAA,UAAA,EAAA,CAAA;kBAVtB,SAAS;+BACE,aAAa,EAAA,QAAA,EACb,CAAA,yDAAA,CAA2D,EAAA,aAAA,EAEtD,iBAAiB,CAAC,6BAA6B,EAAA,eAAA,EAC7C,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,IAAI,EAAE,QAAQ;AACf,qBAAA,EAAA,MAAA,EAAA,CAAA,6iCAAA,CAAA,EAAA;;;AChCH;;;;;AAKG;;ACLH;;AAEG;;"}
@@ -0,0 +1,46 @@
1
+ import * as i0 from '@angular/core';
2
+ import { Input, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
3
+
4
+ /*
5
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
6
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
7
+ * This software is released under MIT license.
8
+ * The full license information can be found in LICENSE in the root directory of this project.
9
+ */
10
+ /**
11
+ * Dividers are a convenient way to place lined dividers or "rules" between blocks of content.
12
+ *
13
+ * ```html
14
+ * <hermes-divider></hermes-divider>
15
+ * <hermes-divider orientation="vertical"></hermes-divider>
16
+ * ```
17
+ */
18
+ class HermesDivider {
19
+ constructor() {
20
+ this.orientation = 'horizontal';
21
+ }
22
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesDivider, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
23
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.22", type: HermesDivider, isStandalone: true, selector: "hermes-divider", inputs: { orientation: "orientation" }, host: { properties: { "attr.orientation": "orientation" } }, ngImport: i0, template: "<!--\n ~ Copyright (c) 2016-2026 Broadcom. All Rights Reserved.\n ~ The term \"Broadcom\" refers to Broadcom Inc. and/or its subsidiaries.\n ~ This software is released under MIT license.\n ~ The full license information can be found in LICENSE in the root directory of this project.\n -->\n\n<div class=\"private-host\" role=\"separator\" [attr.aria-orientation]=\"orientation\"></div>\n", styles: [":host{--color: var(--hermes-alias-object-border-color);--size: var(--hermes-alias-object-border-width-100);--padding: 0;display:block;width:100%;padding:var(--padding)}.private-host{height:var(--size);background:var(--color)}:host([orientation=vertical]){align-self:stretch;height:inherit;width:var(--size)}:host([orientation=vertical]) .private-host{height:100%;width:var(--size)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.ExperimentalIsolatedShadowDom }); }
24
+ }
25
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesDivider, decorators: [{
26
+ type: Component,
27
+ args: [{ selector: 'hermes-divider', encapsulation: ViewEncapsulation.ExperimentalIsolatedShadowDom, changeDetection: ChangeDetectionStrategy.OnPush, host: {
28
+ '[attr.orientation]': 'orientation',
29
+ }, template: "<!--\n ~ Copyright (c) 2016-2026 Broadcom. All Rights Reserved.\n ~ The term \"Broadcom\" refers to Broadcom Inc. and/or its subsidiaries.\n ~ This software is released under MIT license.\n ~ The full license information can be found in LICENSE in the root directory of this project.\n -->\n\n<div class=\"private-host\" role=\"separator\" [attr.aria-orientation]=\"orientation\"></div>\n", styles: [":host{--color: var(--hermes-alias-object-border-color);--size: var(--hermes-alias-object-border-width-100);--padding: 0;display:block;width:100%;padding:var(--padding)}.private-host{height:var(--size);background:var(--color)}:host([orientation=vertical]){align-self:stretch;height:inherit;width:var(--size)}:host([orientation=vertical]) .private-host{height:100%;width:var(--size)}\n"] }]
30
+ }], propDecorators: { orientation: [{
31
+ type: Input
32
+ }] } });
33
+
34
+ /*
35
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
36
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
37
+ * This software is released under MIT license.
38
+ * The full license information can be found in LICENSE in the root directory of this project.
39
+ */
40
+
41
+ /**
42
+ * Generated bundle index. Do not edit.
43
+ */
44
+
45
+ export { HermesDivider };
46
+ //# sourceMappingURL=hermes-ui-angular-divider.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hermes-ui-angular-divider.mjs","sources":["../../../divider/divider.ts","../../../divider/divider.component.html","../../../divider/index.ts","../../../divider/hermes-ui-angular-divider.ts"],"sourcesContent":["/*\n * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.\n * The term \"Broadcom\" refers to Broadcom Inc. and/or its subsidiaries.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\n\nimport { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core';\n\nexport type HermesDividerOrientation = 'horizontal' | 'vertical';\n\n/**\n * Dividers are a convenient way to place lined dividers or \"rules\" between blocks of content.\n *\n * ```html\n * <hermes-divider></hermes-divider>\n * <hermes-divider orientation=\"vertical\"></hermes-divider>\n * ```\n */\n@Component({\n selector: 'hermes-divider',\n templateUrl: './divider.component.html',\n styleUrls: ['./divider.component.scss'],\n encapsulation: ViewEncapsulation.ExperimentalIsolatedShadowDom,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n '[attr.orientation]': 'orientation',\n },\n})\nexport class HermesDivider {\n @Input() orientation: HermesDividerOrientation = 'horizontal';\n}\n","<!--\n ~ Copyright (c) 2016-2026 Broadcom. All Rights Reserved.\n ~ The term \"Broadcom\" refers to Broadcom Inc. and/or its subsidiaries.\n ~ This software is released under MIT license.\n ~ The full license information can be found in LICENSE in the root directory of this project.\n -->\n\n<div class=\"private-host\" role=\"separator\" [attr.aria-orientation]=\"orientation\"></div>\n","/*\n * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.\n * The term \"Broadcom\" refers to Broadcom Inc. and/or its subsidiaries.\n * This software is released under MIT license.\n * The full license information can be found in LICENSE in the root directory of this project.\n */\n\nexport * from './divider';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAAA;;;;;AAKG;AAMH;;;;;;;AAOG;MAWU,aAAa,CAAA;AAV1B,IAAA,WAAA,GAAA;QAWW,IAAA,CAAA,WAAW,GAA6B,YAAY;AAC9D,IAAA;+GAFY,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAb,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,aAAa,+KC7B1B,2YAQA,EAAA,MAAA,EAAA,CAAA,iYAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,6BAAA,EAAA,CAAA,CAAA;;4FDqBa,aAAa,EAAA,UAAA,EAAA,CAAA;kBAVzB,SAAS;+BACE,gBAAgB,EAAA,aAAA,EAGX,iBAAiB,CAAC,6BAA6B,mBAC7C,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,oBAAoB,EAAE,aAAa;AACpC,qBAAA,EAAA,QAAA,EAAA,2YAAA,EAAA,MAAA,EAAA,CAAA,iYAAA,CAAA,EAAA;;sBAGA;;;AE9BH;;;;;AAKG;;ACLH;;AAEG;;"}
@@ -2284,7 +2284,7 @@ class HermesDatepickerViewManager {
2284
2284
  this.dateNavigationService.moveToSpecificMonth(startDate);
2285
2285
  }
2286
2286
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesDatepickerViewManager, deps: [{ token: i4.HermesCommonStringsService }, { token: ViewManagerService }, { token: DateNavigationService }, { token: DateIOService }], target: i0.ɵɵFactoryTarget.Component }); }
2287
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.22", type: HermesDatepickerViewManager, isStandalone: false, selector: "hermes-datepicker-view-manager", host: { attributes: { "role": "dialog" }, properties: { "class.datepicker": "true", "class.has-range-option": "hasRangeOptions", "class.has-action-buttons": "hasActionButtons", "attr.aria-modal": "true", "attr.aria-label": "commonStrings.keys.datepickerDialogLabel" } }, providers: [DatepickerFocusService], ngImport: i0, template: "<!--\r\n ~ Copyright (c) 2016-2026 Broadcom. All Rights Reserved.\r\n ~ The term \"Broadcom\" refers to Broadcom Inc. and/or its subsidiaries.\r\n ~ This software is released under MIT license.\r\n ~ The full license information can be found in LICENSE in the root directory of this project.\r\n -->\r\n\r\n@if (hasRangeOptions) {\r\n<hermes-vertical-nav class=\"hermes-date-range-picker-nav\">\r\n @for (option of dateRangeOptions; track option) {\r\n <a\r\n hermesVerticalNavLink\r\n href=\"javascript:void(0)\"\r\n [attr.aria-label]=\"option?.label\"\r\n tabindex=\"0\"\r\n (keyup.enter)=\"onRangeOptionSelect(option)\"\r\n (click)=\"onRangeOptionSelect(option)\"\r\n >\r\n {{option.label}}\r\n </a>\r\n }\r\n</hermes-vertical-nav>\r\n<ng-container *ngTemplateOutlet=\"calendarView\"></ng-container>\r\n} @else {\r\n<div class=\"datepicker-view-manager\">\r\n @if (isMonthView) {\r\n <hermes-monthpicker></hermes-monthpicker>\r\n } @if (isYearView) {\r\n <hermes-yearpicker></hermes-yearpicker>\r\n } @if (isDayView) {\r\n <hermes-daypicker></hermes-daypicker>\r\n } @if (hasActionButtons) {\r\n <hermes-datepicker-actions></hermes-datepicker-actions>\r\n }\r\n</div>\r\n}\r\n\r\n<ng-template #calendarView>\r\n <div class=\"datepicker-view-manager\">\r\n @if (isMonthView) {\r\n <hermes-monthpicker></hermes-monthpicker>\r\n } @if (isYearView) {\r\n <hermes-yearpicker></hermes-yearpicker>\r\n } @if (isDayView) {\r\n <hermes-daypicker></hermes-daypicker>\r\n } @if (hasActionButtons) {\r\n <hermes-datepicker-actions></hermes-datepicker-actions>\r\n }\r\n </div>\r\n</ng-template>\r\n", dependencies: [{ kind: "directive", type: i5$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6.HermesVerticalNav, selector: "hermes-vertical-nav", inputs: ["hermesVerticalNavToggleLabel", "hermesVerticalNavCollapsible", "hermesVerticalNavCollapsed"], outputs: ["hermesVerticalNavCollapsedChange"] }, { kind: "component", type: i6.HermesVerticalNavLink, selector: "[hermesVerticalNavLink]" }, { kind: "component", type: HermesMonthpicker, selector: "hermes-monthpicker" }, { kind: "component", type: HermesYearpicker, selector: "hermes-yearpicker" }, { kind: "component", type: HermesDaypicker, selector: "hermes-daypicker" }, { kind: "component", type: HermesDatepickerActions, selector: "hermes-datepicker-actions" }] }); }
2287
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.22", type: HermesDatepickerViewManager, isStandalone: false, selector: "hermes-datepicker-view-manager", host: { attributes: { "role": "dialog" }, properties: { "class.datepicker": "true", "class.has-range-option": "hasRangeOptions", "class.has-action-buttons": "hasActionButtons", "attr.aria-modal": "true", "attr.aria-label": "commonStrings.keys.datepickerDialogLabel" } }, providers: [DatepickerFocusService], ngImport: i0, template: "<!--\r\n ~ Copyright (c) 2016-2026 Broadcom. All Rights Reserved.\r\n ~ The term \"Broadcom\" refers to Broadcom Inc. and/or its subsidiaries.\r\n ~ This software is released under MIT license.\r\n ~ The full license information can be found in LICENSE in the root directory of this project.\r\n -->\r\n\r\n@if (hasRangeOptions) {\r\n<hermes-vertical-nav class=\"hermes-date-range-picker-nav\">\r\n @for (option of dateRangeOptions; track option) {\r\n <a\r\n hermesVerticalNavLink\r\n href=\"javascript:void(0)\"\r\n [attr.aria-label]=\"option?.label\"\r\n tabindex=\"0\"\r\n (keyup.enter)=\"onRangeOptionSelect(option)\"\r\n (click)=\"onRangeOptionSelect(option)\"\r\n >\r\n {{option.label}}\r\n </a>\r\n }\r\n</hermes-vertical-nav>\r\n<ng-container *ngTemplateOutlet=\"calendarView\"></ng-container>\r\n} @else {\r\n<div class=\"datepicker-view-manager\">\r\n @if (isMonthView) {\r\n <hermes-monthpicker></hermes-monthpicker>\r\n } @if (isYearView) {\r\n <hermes-yearpicker></hermes-yearpicker>\r\n } @if (isDayView) {\r\n <hermes-daypicker></hermes-daypicker>\r\n } @if (hasActionButtons) {\r\n <hermes-datepicker-actions></hermes-datepicker-actions>\r\n }\r\n</div>\r\n}\r\n\r\n<ng-template #calendarView>\r\n <div class=\"datepicker-view-manager\">\r\n @if (isMonthView) {\r\n <hermes-monthpicker></hermes-monthpicker>\r\n } @if (isYearView) {\r\n <hermes-yearpicker></hermes-yearpicker>\r\n } @if (isDayView) {\r\n <hermes-daypicker></hermes-daypicker>\r\n } @if (hasActionButtons) {\r\n <hermes-datepicker-actions></hermes-datepicker-actions>\r\n }\r\n </div>\r\n</ng-template>\r\n", dependencies: [{ kind: "directive", type: i5$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6.HermesVerticalNav, selector: "hermes-vertical-nav", inputs: ["hermesVerticalNavToggleLabel", "hermesVerticalNavPinnable", "hermesVerticalNavCollapsible", "hermesVerticalNavCollapsed"], outputs: ["hermesVerticalNavCollapsedChange"] }, { kind: "component", type: i6.HermesVerticalNavLink, selector: "[hermesVerticalNavLink]" }, { kind: "component", type: HermesMonthpicker, selector: "hermes-monthpicker" }, { kind: "component", type: HermesYearpicker, selector: "hermes-yearpicker" }, { kind: "component", type: HermesDaypicker, selector: "hermes-daypicker" }, { kind: "component", type: HermesDatepickerActions, selector: "hermes-datepicker-actions" }] }); }
2288
2288
  }
2289
2289
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: HermesDatepickerViewManager, decorators: [{
2290
2290
  type: Component,