ecabs-components 2.0.0-alpha.11 → 2.0.0-alpha.13
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.
- package/README.md +4 -0
- package/fesm2022/ecabs-components.mjs +61 -1
- package/fesm2022/ecabs-components.mjs.map +1 -1
- package/lib/base/models/sidebar.models.d.ts +5 -7
- package/lib/base/utils/menu-utils.d.ts +10 -1
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
- package/src/assets/styles/material/overrides/_dialog.scss +7 -0
- package/src/assets/styles/scss/modules/_button.scss +16 -2
- package/src/assets/styles/scss/utilities/_breakpoints.scss +47 -43
- package/src/assets/styles/tailwind/index.scss +1 -1
package/README.md
CHANGED
|
@@ -25,6 +25,10 @@ To get more help on the Angular CLI use `ng help` or go check out the [Angular C
|
|
|
25
25
|
|
|
26
26
|
## Version History
|
|
27
27
|
|
|
28
|
+
- **v2.0.0-alpha.13**: Add `filterMenuItems`, which hides sidebar items by permission and by each item's `isVisible` rule, removes groups left empty, and lets `isBadgeVisible` show or hide an item's badge per tenant.
|
|
29
|
+
- **v2.0.0-alpha.12**: Stack button groups and stretch their buttons only on phones (below 576px) instead of below 768px, so buttons stay side by side at their own size on tablets.
|
|
30
|
+
- Stacked buttons now fill the group on every screen, including dialogs, and groups wrap onto a second row when they don't fit. Adds an `x-small` case to `media-q`.
|
|
31
|
+
- A group placed directly inside another group keeps buttons together, such as Cancel and Save beside a Delete: it sizes to its buttons beside other items and fills the row when alone.
|
|
28
32
|
- **v2.0.0-alpha.11**: Switch button groups and table padding to the desktop layout at 768px instead of 769px, and share the breakpoints: apps can `@use "ecabs-components/breakpoints"` for `$breakpoints` and `media-q`, and import `PHONE_MEDIA_QUERY`.
|
|
29
33
|
- **v2.0.0-alpha.10**: Sync v1.1.96–v1.1.98 from `develop`: content beside and below `ecabs-segment`'s title (`ecabsSegmentHeaderEnd`, `ecabsSegmentHeaderBottom`), the `compact` size, `.card__header-action`, 12px `ecabs-table` panel padding up to 768px wide, and the phone paginator layout (two full-width rows up to 767px wide: page size on top, the item range with previous and next below).
|
|
30
34
|
- On this line the card and table styles use the `@use`/`@forward` module system, and the Tailwind utilities the segment template uses are compiled by Tailwind v4.
|
|
@@ -8292,6 +8292,66 @@ function matchMenuToUrl(url, menu) {
|
|
|
8292
8292
|
}
|
|
8293
8293
|
return undefined;
|
|
8294
8294
|
}
|
|
8295
|
+
/**
|
|
8296
|
+
* Returns copies of the menu items the user should see, never changing `menu`.
|
|
8297
|
+
*
|
|
8298
|
+
* Permissions are checked only when `permissions` is given: `undefined` skips the
|
|
8299
|
+
* check, while `[]` checks against a user with no claims. An item shows when it has
|
|
8300
|
+
* no `permissions`, includes `'allow'`, or the user holds any one of them.
|
|
8301
|
+
* Then each item's `isVisible` and `isBadgeVisible` run, and groups left empty are removed.
|
|
8302
|
+
*/
|
|
8303
|
+
function filterMenuItems(menu, context, permissions) {
|
|
8304
|
+
const permittedItems = permissions
|
|
8305
|
+
? applyPermissions(menu, permissions)
|
|
8306
|
+
: menu;
|
|
8307
|
+
const visibleItems = applyVisibility(permittedItems, context);
|
|
8308
|
+
return removeEmptyGroups(visibleItems);
|
|
8309
|
+
}
|
|
8310
|
+
function applyPermissions(menu, permissions) {
|
|
8311
|
+
const permittedItems = menu.filter((item) => hasPermission(item, permissions));
|
|
8312
|
+
return permittedItems.map((item) => {
|
|
8313
|
+
if (!item.subItems) {
|
|
8314
|
+
return { ...item };
|
|
8315
|
+
}
|
|
8316
|
+
return { ...item, subItems: applyPermissions(item.subItems, permissions) };
|
|
8317
|
+
});
|
|
8318
|
+
}
|
|
8319
|
+
function applyVisibility(menu, context) {
|
|
8320
|
+
const visibleItems = menu.filter((item) => !item.isVisible || item.isVisible(context));
|
|
8321
|
+
return visibleItems.map((item) => {
|
|
8322
|
+
const visibleItem = { ...item };
|
|
8323
|
+
if (item.isBadgeVisible && !item.isBadgeVisible(context)) {
|
|
8324
|
+
visibleItem.badge = undefined;
|
|
8325
|
+
}
|
|
8326
|
+
if (item.subItems) {
|
|
8327
|
+
visibleItem.subItems = applyVisibility(item.subItems, context);
|
|
8328
|
+
}
|
|
8329
|
+
return visibleItem;
|
|
8330
|
+
});
|
|
8331
|
+
}
|
|
8332
|
+
function removeEmptyGroups(menu) {
|
|
8333
|
+
const result = [];
|
|
8334
|
+
for (const item of menu) {
|
|
8335
|
+
if (!item.subItems) {
|
|
8336
|
+
result.push({ ...item });
|
|
8337
|
+
continue;
|
|
8338
|
+
}
|
|
8339
|
+
const subItems = removeEmptyGroups(item.subItems);
|
|
8340
|
+
if (subItems.length > 0 || !!item.url) {
|
|
8341
|
+
result.push({ ...item, subItems });
|
|
8342
|
+
}
|
|
8343
|
+
}
|
|
8344
|
+
return result;
|
|
8345
|
+
}
|
|
8346
|
+
function hasPermission(item, permissions) {
|
|
8347
|
+
if (!item.permissions?.length) {
|
|
8348
|
+
return true;
|
|
8349
|
+
}
|
|
8350
|
+
if (item.permissions.includes('allow')) {
|
|
8351
|
+
return true;
|
|
8352
|
+
}
|
|
8353
|
+
return item.permissions.some((permission) => permissions.includes(permission));
|
|
8354
|
+
}
|
|
8295
8355
|
|
|
8296
8356
|
class EcabsMenuItemsComponent {
|
|
8297
8357
|
unsubscribeService;
|
|
@@ -10307,5 +10367,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
|
|
|
10307
10367
|
* Generated bundle index. Do not edit.
|
|
10308
10368
|
*/
|
|
10309
10369
|
|
|
10310
|
-
export { ButtonsComponent, ButtonsV2Component, CHIP_LABEL_CLASS, EcabsActionMenuComponent, EcabsActionMenuModule, EcabsActionMenuTriggerDirective, EcabsActiveStatusFilterComponent, EcabsActiveStatusFilterModule, EcabsAttachEmbeddedViewDirective, EcabsAttachEmbeddedViewDirectiveModule, EcabsBadgeComponent, EcabsBadgeDirective, EcabsBadgeDirectiveModule, EcabsBadgeModule, EcabsBasePhoneComponent, EcabsBasePhoneModule, EcabsBreadcrumbComponent, EcabsBreadcrumbModule, EcabsButtonToggleComponent, EcabsButtonToggleModule, EcabsButtonsModule, EcabsButtonsV2Module, EcabsCheckPermissionDirectiveModule, EcabsCheckPermissionsDirective, EcabsCheckboxToggleComponent, EcabsCheckboxToggleModule, EcabsCheckboxV2Component, EcabsCheckboxV2Module, EcabsChipAutocompleteComponent, EcabsChipGroupComponent, EcabsChipGroupModule, EcabsComponentsService, EcabsDateAdapter, EcabsDatePickerComponent, EcabsDatePickerHeaderComponent, EcabsDatePickerHeaderService, EcabsDatePickerModule, EcabsDateRangeModule, EcabsDateRangeModuleV2, EcabsDateRangePickerComponent, EcabsDateRangePickerComponentV2, EcabsDateRangePickerHeaderComponent, EcabsDateRangePickerHeaderComponentV2, EcabsDateTimePickerComponent, EcabsDateTimePickerHeaderComponent, EcabsDateTimeRangePickerComponent, EcabsDateTimeRangePickerHeaderComponent, EcabsDatetimePickerModule, EcabsDatetimeRangePickerModule, EcabsDialogConfirmComponent, EcabsDialogConfirmDeletionModule, EcabsDialogConfirmModule, EcabsDialogConfirmationDeletionComponent, EcabsDialogMessageComponent, EcabsDialogMessageModule, EcabsDigitsOnlyDirective, EcabsDigitsOnlyDirectivesModule, EcabsDomObserverDirective, EcabsDomObserverDirectiveModule, EcabsDynamicBgColorDirective, EcabsDynamicBgColorDirectiveModule, EcabsElementMultiplierDirective, EcabsElementMultiplierDirectiveModule, EcabsEmptyPlaceholderComponent, EcabsEmptyPlaceholderModule, EcabsExpansionPanelComponent, EcabsExpansionPanelModule, EcabsFileDropDirective, EcabsFileDropDirectiveModule, EcabsHeaderComponent, EcabsHeaderModule, EcabsHintComponent, EcabsHintModule, EcabsIncrementComponent, EcabsIncrementModule, EcabsInputComponent, EcabsInputModule, EcabsInputRangeComponent, EcabsInputRangeModule, EcabsLanguageSelectorComponent, EcabsLanguageSelectorModule, EcabsLoadingComponent, EcabsLoadingModule, EcabsLogoComponent, EcabsLogoModule, EcabsMaskDateDirective, EcabsMaskDateDirectiveModule, EcabsMaskTimeDirective, EcabsMaskTimeDirectiveModule, EcabsMaxDirective, EcabsMenuItemsComponent, EcabsMenuItemsModule, EcabsMinDirective, EcabsMinMaxDirectiveModule, EcabsMultipleDatesPickerComponent, EcabsMultipleDatesPickerModule, EcabsNoteComponent, EcabsNoteModule, EcabsNumberBorderDirective, EcabsNumberBorderDirectiveModule, EcabsPaginatorDirective, EcabsPaginatorDirectiveModule, EcabsPhoneComponent, EcabsPhoneModule, EcabsPipesModule, EcabsPlaceAutocompleteComponent, EcabsPlaceAutocompleteModule, EcabsPlaceAutocompleteV2Component, EcabsPlaceAutocompleteV2Module, EcabsProfileComponent, EcabsProfileModule, EcabsRadioButtonListComponent, EcabsRadioButtonListModule, EcabsSegmentComponent, EcabsSelectComponent, EcabsSelectModule, EcabsSelectV2Component, EcabsSelectV2Module, EcabsShowOnTruncatedDirective, EcabsShowOnTruncatedDirectiveModule, EcabsSidebarComponent, EcabsSidebarModule, EcabsSliderComponent, EcabsSliderModule, EcabsSpinnerComponent, EcabsStatusBadgeVariantPipe, EcabsTableFilterWrapperComponent, EcabsTableFilterWrapperModule, EcabsTableModule, EcabsTextAreaModule, EcabsTextareaComponent, EcabsTimeListPanelComponent, EcabsTimeRangeDirective, EcabsTimeRangeDirectiveModule, EcabsTimeRangeInputV2Component, EcabsTimeRangeInputV2Module, EcabsTimepickerComponent, EcabsTimepickerModule, EcabsTooltipIfTruncatedDirective, EcabsTooltipIfTruncatedDirectiveModule, EcabsTruncatePipe, EcabsUppercaseMaskDirective, EcabsUppercaseMaskDirectiveModule, EcabsValidationComponent, EcabsValidationModule, EcabsValidationViewModule, FormTimePickerService, FormTimePickerServiceV2, GenericComponentConfig, HeaderService, MATERIAL_DATETIMEPICKER_FORMATS, NumberToCountryCodePipe, PHONE_MEDIA_QUERY, STATUS_BADGE_VARIANTS, SeparatorAppendPipe, TableComponent, UnsubscribeService, ValidationComponent, WAYPOINT_SUGGESTIONS, WAYPOINT_SUGGESTIONS2, WaypointTypeEnum, buildPhosphorSvgIcon, extractCallingCodeFromIso, extractCountryFromIso, extractCountryPrefixFromNumber, extractDialingCode, extractPhoneNumberCode, getPhosphorSvgIcon, getRandomItems, getSupportedCountryIsoCodes, removeEmpty, removeNullUndefineds, resolveStatusBadgeVariant, scrollFactory, sortGeneric };
|
|
10370
|
+
export { ButtonsComponent, ButtonsV2Component, CHIP_LABEL_CLASS, EcabsActionMenuComponent, EcabsActionMenuModule, EcabsActionMenuTriggerDirective, EcabsActiveStatusFilterComponent, EcabsActiveStatusFilterModule, EcabsAttachEmbeddedViewDirective, EcabsAttachEmbeddedViewDirectiveModule, EcabsBadgeComponent, EcabsBadgeDirective, EcabsBadgeDirectiveModule, EcabsBadgeModule, EcabsBasePhoneComponent, EcabsBasePhoneModule, EcabsBreadcrumbComponent, EcabsBreadcrumbModule, EcabsButtonToggleComponent, EcabsButtonToggleModule, EcabsButtonsModule, EcabsButtonsV2Module, EcabsCheckPermissionDirectiveModule, EcabsCheckPermissionsDirective, EcabsCheckboxToggleComponent, EcabsCheckboxToggleModule, EcabsCheckboxV2Component, EcabsCheckboxV2Module, EcabsChipAutocompleteComponent, EcabsChipGroupComponent, EcabsChipGroupModule, EcabsComponentsService, EcabsDateAdapter, EcabsDatePickerComponent, EcabsDatePickerHeaderComponent, EcabsDatePickerHeaderService, EcabsDatePickerModule, EcabsDateRangeModule, EcabsDateRangeModuleV2, EcabsDateRangePickerComponent, EcabsDateRangePickerComponentV2, EcabsDateRangePickerHeaderComponent, EcabsDateRangePickerHeaderComponentV2, EcabsDateTimePickerComponent, EcabsDateTimePickerHeaderComponent, EcabsDateTimeRangePickerComponent, EcabsDateTimeRangePickerHeaderComponent, EcabsDatetimePickerModule, EcabsDatetimeRangePickerModule, EcabsDialogConfirmComponent, EcabsDialogConfirmDeletionModule, EcabsDialogConfirmModule, EcabsDialogConfirmationDeletionComponent, EcabsDialogMessageComponent, EcabsDialogMessageModule, EcabsDigitsOnlyDirective, EcabsDigitsOnlyDirectivesModule, EcabsDomObserverDirective, EcabsDomObserverDirectiveModule, EcabsDynamicBgColorDirective, EcabsDynamicBgColorDirectiveModule, EcabsElementMultiplierDirective, EcabsElementMultiplierDirectiveModule, EcabsEmptyPlaceholderComponent, EcabsEmptyPlaceholderModule, EcabsExpansionPanelComponent, EcabsExpansionPanelModule, EcabsFileDropDirective, EcabsFileDropDirectiveModule, EcabsHeaderComponent, EcabsHeaderModule, EcabsHintComponent, EcabsHintModule, EcabsIncrementComponent, EcabsIncrementModule, EcabsInputComponent, EcabsInputModule, EcabsInputRangeComponent, EcabsInputRangeModule, EcabsLanguageSelectorComponent, EcabsLanguageSelectorModule, EcabsLoadingComponent, EcabsLoadingModule, EcabsLogoComponent, EcabsLogoModule, EcabsMaskDateDirective, EcabsMaskDateDirectiveModule, EcabsMaskTimeDirective, EcabsMaskTimeDirectiveModule, EcabsMaxDirective, EcabsMenuItemsComponent, EcabsMenuItemsModule, EcabsMinDirective, EcabsMinMaxDirectiveModule, EcabsMultipleDatesPickerComponent, EcabsMultipleDatesPickerModule, EcabsNoteComponent, EcabsNoteModule, EcabsNumberBorderDirective, EcabsNumberBorderDirectiveModule, EcabsPaginatorDirective, EcabsPaginatorDirectiveModule, EcabsPhoneComponent, EcabsPhoneModule, EcabsPipesModule, EcabsPlaceAutocompleteComponent, EcabsPlaceAutocompleteModule, EcabsPlaceAutocompleteV2Component, EcabsPlaceAutocompleteV2Module, EcabsProfileComponent, EcabsProfileModule, EcabsRadioButtonListComponent, EcabsRadioButtonListModule, EcabsSegmentComponent, EcabsSelectComponent, EcabsSelectModule, EcabsSelectV2Component, EcabsSelectV2Module, EcabsShowOnTruncatedDirective, EcabsShowOnTruncatedDirectiveModule, EcabsSidebarComponent, EcabsSidebarModule, EcabsSliderComponent, EcabsSliderModule, EcabsSpinnerComponent, EcabsStatusBadgeVariantPipe, EcabsTableFilterWrapperComponent, EcabsTableFilterWrapperModule, EcabsTableModule, EcabsTextAreaModule, EcabsTextareaComponent, EcabsTimeListPanelComponent, EcabsTimeRangeDirective, EcabsTimeRangeDirectiveModule, EcabsTimeRangeInputV2Component, EcabsTimeRangeInputV2Module, EcabsTimepickerComponent, EcabsTimepickerModule, EcabsTooltipIfTruncatedDirective, EcabsTooltipIfTruncatedDirectiveModule, EcabsTruncatePipe, EcabsUppercaseMaskDirective, EcabsUppercaseMaskDirectiveModule, EcabsValidationComponent, EcabsValidationModule, EcabsValidationViewModule, FormTimePickerService, FormTimePickerServiceV2, GenericComponentConfig, HeaderService, MATERIAL_DATETIMEPICKER_FORMATS, NumberToCountryCodePipe, PHONE_MEDIA_QUERY, STATUS_BADGE_VARIANTS, SeparatorAppendPipe, TableComponent, UnsubscribeService, ValidationComponent, WAYPOINT_SUGGESTIONS, WAYPOINT_SUGGESTIONS2, WaypointTypeEnum, buildPhosphorSvgIcon, extractCallingCodeFromIso, extractCountryFromIso, extractCountryPrefixFromNumber, extractDialingCode, extractPhoneNumberCode, filterMenuItems, getPhosphorSvgIcon, getRandomItems, getSupportedCountryIsoCodes, matchMenuToUrl, removeEmpty, removeNullUndefineds, resolveStatusBadgeVariant, scrollFactory, sortGeneric };
|
|
10311
10371
|
//# sourceMappingURL=ecabs-components.mjs.map
|