@progressio_resources/gravity-design-system 3.4.11 → 3.5.0
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/esm2022/lib/components/gravity-header/gravity-header.component.mjs +87 -0
- package/esm2022/lib/components/gravity-push-notifications/gravity-push-notifications.component.mjs +55 -0
- package/esm2022/lib/components/gravity-segmented-button/gravity-segmented-button.component.mjs +1 -1
- package/esm2022/lib/gravity-design-system.module.mjs +14 -4
- package/esm2022/lib/model/gravity-push-notifications.model.mjs +2 -0
- package/esm2022/lib/services/gravity-push-notifications-service.service.mjs +70 -0
- package/esm2022/public-api.mjs +3 -1
- package/fesm2022/progressio_resources-gravity-design-system.mjs +210 -4
- package/fesm2022/progressio_resources-gravity-design-system.mjs.map +1 -1
- package/lib/components/gravity-header/gravity-header.component.d.ts +34 -0
- package/lib/components/gravity-push-notifications/gravity-push-notifications.component.d.ts +21 -0
- package/lib/components/gravity-segmented-button/gravity-segmented-button.component.d.ts +5 -1
- package/lib/gravity-design-system.module.d.ts +11 -9
- package/lib/model/gravity-push-notifications.model.d.ts +22 -0
- package/lib/services/gravity-push-notifications-service.service.d.ts +14 -0
- package/package.json +1 -1
- package/public-api.d.ts +2 -0
- package/esm2022/lib/components/gravity-segmented-button/segmented-button.model.mjs +0 -2
- package/lib/components/gravity-segmented-button/segmented-button.model.d.ts +0 -5
package/esm2022/public-api.mjs
CHANGED
|
@@ -20,6 +20,7 @@ export * from './lib/components/gravity-detail-container/gravity-detail-containe
|
|
|
20
20
|
export * from './lib/components/gravity-dialog/gravity-dialog.component';
|
|
21
21
|
export * from './lib/components/gravity-dropdown-list/gravity-dropdown-list.component';
|
|
22
22
|
export * from './lib/components/gravity-dropdown-list-display/gravity-dropdown-list-display.component';
|
|
23
|
+
export * from './lib/components/gravity-header/gravity-header.component';
|
|
23
24
|
export * from './lib/components/gravity-icon/gravity-icon.component';
|
|
24
25
|
export * from './lib/components/gravity-icon-button/gravity-icon-button.component';
|
|
25
26
|
export * from './lib/components/gravity-multi-language/gravity-multi-language.component';
|
|
@@ -49,6 +50,7 @@ export * from './lib/components/gravity-navigation-card/gravity-navigation-card.
|
|
|
49
50
|
export * from './lib/components/gravity-generic-avatar-secondary/gravity-generic-avatar-secondary.component';
|
|
50
51
|
export * from './lib/components/gravity-backdrop/gravity-backdrop.component';
|
|
51
52
|
export * from './lib/components/gravity-segmented-button/gravity-segmented-button.component';
|
|
53
|
+
export * from './lib/components/gravity-push-notifications/gravity-push-notifications.component';
|
|
52
54
|
//Services
|
|
53
55
|
export * from './lib/services/gravity-dialog-manager.service';
|
|
54
56
|
//Vendor
|
|
@@ -56,4 +58,4 @@ export * from './lib/vendor/gravity-tooltip';
|
|
|
56
58
|
//Models and interfaces
|
|
57
59
|
export * from './lib/components/gravity-notification/gravity-notification-content.interface';
|
|
58
60
|
export * from './lib/components/gravity-calendar-v2/datepicker/models';
|
|
59
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
61
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL2dyYXZpdHktZGVzaWduLXN5c3RlbS9zcmMvcHVibGljLWFwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsb0NBQW9DLENBQUM7QUFFbkQsWUFBWTtBQUNaLGNBQWMsb0VBQW9FLENBQUM7QUFDbkYsY0FBYyxzRUFBc0UsQ0FBQztBQUNyRixjQUFjLDBEQUEwRCxDQUFDO0FBQ3pFLGNBQWMsOERBQThELENBQUM7QUFDN0UsY0FBYyxvRUFBb0UsQ0FBQztBQUNuRixjQUFjLHdFQUF3RSxDQUFDO0FBQ3ZGLGNBQWMsZ0VBQWdFLENBQUM7QUFDL0UsY0FBYyw4REFBOEQsQ0FBQztBQUM3RSxjQUFjLDhEQUE4RCxDQUFDO0FBQzdFLGNBQWMsOEVBQThFLENBQUM7QUFDN0YsY0FBYyxvRkFBb0YsQ0FBQztBQUNuRyxjQUFjLGdFQUFnRSxDQUFDO0FBQy9FLGNBQWMsd0VBQXdFLENBQUM7QUFDdkYsY0FBYyw4RUFBOEUsQ0FBQztBQUM3RixjQUFjLDBEQUEwRCxDQUFDO0FBQ3pFLGNBQWMsd0VBQXdFLENBQUM7QUFDdkYsY0FBYyx3RkFBd0YsQ0FBQztBQUN2RyxjQUFjLDBEQUEwRCxDQUFDO0FBQ3pFLGNBQWMsc0RBQXNELENBQUM7QUFDckUsY0FBYyxvRUFBb0UsQ0FBQztBQUNuRixjQUFjLDBFQUEwRSxDQUFDO0FBQ3pGLGNBQWMsc0VBQXNFLENBQUM7QUFDckYsY0FBYyxnR0FBZ0csQ0FBQztBQUMvRyxjQUFjLDBEQUEwRCxDQUFDO0FBQ3pFLGNBQWMsc0VBQXNFLENBQUM7QUFDckYsY0FBYyw4RUFBOEUsQ0FBQztBQUM3RixjQUFjLDREQUE0RCxDQUFDO0FBQzNFLGNBQWMsMERBQTBELENBQUM7QUFDekUsY0FBYyx3REFBd0QsQ0FBQztBQUN2RSxjQUFjLGdFQUFnRSxDQUFDO0FBQy9FLGNBQWMsa0VBQWtFLENBQUM7QUFDakYsY0FBYywwRkFBMEYsQ0FBQztBQUN6RyxjQUFjLGdFQUFnRSxDQUFDO0FBQy9FLGNBQWMsMEVBQTBFLENBQUM7QUFDekYsY0FBYyx3REFBd0QsQ0FBQztBQUN2RSxjQUFjLHNEQUFzRCxDQUFDO0FBQ3JFLGNBQWMsb0VBQW9FLENBQUE7QUFDbEYsY0FBYyx3RUFBd0UsQ0FBQztBQUN2RixjQUFjLHNEQUFzRCxDQUFDO0FBQ3JFLGNBQWMsa0VBQWtFLENBQUM7QUFDakYsY0FBYywwRUFBMEUsQ0FBQztBQUN6RixjQUFjLG9FQUFvRSxDQUFDO0FBQ25GLGNBQWMsMEVBQTBFLENBQUM7QUFDekYsY0FBYyw0RUFBNEUsQ0FBQztBQUMzRixjQUFjLDhGQUE4RixDQUFBO0FBQzVHLGNBQWMsOERBQThELENBQUM7QUFDN0UsY0FBYyw4RUFBOEUsQ0FBQztBQUM3RixjQUFjLGtGQUFrRixDQUFDO0FBRWpHLFVBQVU7QUFDVixjQUFjLCtDQUErQyxDQUFDO0FBRTlELFFBQVE7QUFDUixjQUFjLDhCQUE4QixDQUFDO0FBRTdDLHVCQUF1QjtBQUN2QixjQUFjLDhFQUE4RSxDQUFDO0FBQzdGLGNBQWMsd0RBQXdELENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogUHVibGljIEFQSSBTdXJmYWNlIG9mIGdyYXZpdHktZGVzaWduLXN5c3RlbVxuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vbGliL2dyYXZpdHktZGVzaWduLXN5c3RlbS5tb2R1bGUnO1xuXG4vL0NvbXBvbmVudHNcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1hdHRhY2gtZmlsZS9ncmF2aXR5LWF0dGFjaC1maWxlLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktYXZhdGFyLXN0YWNrL2dyYXZpdHktYXZhdGFyLXN0YWNrLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktYnV0dG9uL2dyYXZpdHktYnV0dG9uLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktY2FsZW5kYXIvZ3Jhdml0eS1jYWxlbmRhci5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWNhbGVuZGFyLXYyL2dyYXZpdHktY2FsZW5kYXItdjIuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1jYWxlbmRhci1uZXh0L2dyYXZpdHktY2FsZW5kYXItbmV4dC5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWNhcmQtbGlzdC9ncmF2aXR5LWNhcmQtbGlzdC5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWNoZWNrYm94L2dyYXZpdHktY2hlY2tib3guY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1jdXJyZW5jeS9ncmF2aXR5LWN1cnJlbmN5LmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktY3VycmVuY3ktZGlzcGxheS9ncmF2aXR5LWN1cnJlbmN5LWRpc3BsYXkuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1jdXJyZW5jeS1kaXNwbGF5LXYyL2dyYXZpdHktY3VycmVuY3ktZGlzcGxheS12Mi5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWRhdGEtdmlldy9ncmF2aXR5LWRhdGEtdmlldy5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWRhdGEtdmlld3MtdjIvZ3Jhdml0eS1kYXRhLXZpZXdzLXYyLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktZGV0YWlsLWNvbnRhaW5lci9ncmF2aXR5LWRldGFpbC1jb250YWluZXIuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1kaWFsb2cvZ3Jhdml0eS1kaWFsb2cuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1kcm9wZG93bi1saXN0L2dyYXZpdHktZHJvcGRvd24tbGlzdC5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWRyb3Bkb3duLWxpc3QtZGlzcGxheS9ncmF2aXR5LWRyb3Bkb3duLWxpc3QtZGlzcGxheS5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWhlYWRlci9ncmF2aXR5LWhlYWRlci5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWljb24vZ3Jhdml0eS1pY29uLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktaWNvbi1idXR0b24vZ3Jhdml0eS1pY29uLWJ1dHRvbi5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LW11bHRpLWxhbmd1YWdlL2dyYXZpdHktbXVsdGktbGFuZ3VhZ2UuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1uZXR3b3JrLXBpbGwvZ3Jhdml0eS1uZXR3b3JrLXBpbGwuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1ub3RpZmljYXRpb24taW5zdGFudC9ncmF2aXR5LW5vdGlmaWNhdGlvbi1pbnN0YW50LWNvbnRhaW5lci5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWZseW91dC9ncmF2aXR5LWZseW91dC5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LXJhZGlvLWJ1dHRvbi9ncmF2aXR5LXJhZGlvLWJ1dHRvbi5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LXN0YXR1cy1pbmRpY2F0b3IvZ3Jhdml0eS1zdGF0dXMtaW5kaWNhdG9yLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktc3RlcHBlci9ncmF2aXR5LXN0ZXBwZXIuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1zd2l0Y2gvZ3Jhdml0eS1zd2l0Y2guY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS10YWJsZS9ncmF2aXR5LXRhYmxlLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktdGFibGVzLXYyL2dyYXZpdHktdGFibGVzLXYyLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktdGV4dC1maWVsZC9ncmF2aXR5LXRleHQtZmllbGQuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS10ZXh0LWZpZWxkLW51bWJlci1vbmx5L2dyYXZpdHktdGV4dC1maWVsZC1udW1iZXItb25seS5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LXRyZWUtdmlldy9ncmF2aXR5LXRyZWUtdmlldy5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWdlbmVyaWMtYXZhdGFyL2dyYXZpdHktZ2VuZXJpYy1hdmF0YXIuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1tb2RhbC9ncmF2aXR5LW1vZGFsLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktbGluay9ncmF2aXR5LWxpbmsuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS10YWItcHJpbWFyeS9ncmF2aXR5LXRhYi1wcmltYXJ5LmNvbXBvbmVudCdcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS10YWItc2Vjb25kYXJ5L2dyYXZpdHktdGFiLXNlY29uZGFyeS5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWNoaXAvZ3Jhdml0eS1jaGlwLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktY2hpcC1ncm91cC9ncmF2aXR5LWNoaXAtZ3JvdXAuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1lZGl0YWJsZS1pbnB1dC9ncmF2aXR5LWVkaXRhYmxlLWlucHV0LmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktY2FyZC1idXR0b24vZ3Jhdml0eS1jYXJkLWJ1dHRvbi5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWRyb3Bkb3duLWxhYmVsL2dyYXZpdHktZHJvcGRvd24tbGFiZWwuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1uYXZpZ2F0aW9uLWNhcmQvZ3Jhdml0eS1uYXZpZ2F0aW9uLWNhcmQuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1nZW5lcmljLWF2YXRhci1zZWNvbmRhcnkvZ3Jhdml0eS1nZW5lcmljLWF2YXRhci1zZWNvbmRhcnkuY29tcG9uZW50J1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LWJhY2tkcm9wL2dyYXZpdHktYmFja2Ryb3AuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1zZWdtZW50ZWQtYnV0dG9uL2dyYXZpdHktc2VnbWVudGVkLWJ1dHRvbi5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9ncmF2aXR5LXB1c2gtbm90aWZpY2F0aW9ucy9ncmF2aXR5LXB1c2gtbm90aWZpY2F0aW9ucy5jb21wb25lbnQnO1xuXG4vL1NlcnZpY2VzXG5leHBvcnQgKiBmcm9tICcuL2xpYi9zZXJ2aWNlcy9ncmF2aXR5LWRpYWxvZy1tYW5hZ2VyLnNlcnZpY2UnO1xuXG4vL1ZlbmRvclxuZXhwb3J0ICogZnJvbSAnLi9saWIvdmVuZG9yL2dyYXZpdHktdG9vbHRpcCc7XG5cbi8vTW9kZWxzIGFuZCBpbnRlcmZhY2VzXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL2dyYXZpdHktbm90aWZpY2F0aW9uL2dyYXZpdHktbm90aWZpY2F0aW9uLWNvbnRlbnQuaW50ZXJmYWNlJztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvZ3Jhdml0eS1jYWxlbmRhci12Mi9kYXRlcGlja2VyL21vZGVscyc7XG4iXX0=
|
|
@@ -7233,6 +7233,204 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
7233
7233
|
type: Output
|
|
7234
7234
|
}] } });
|
|
7235
7235
|
|
|
7236
|
+
class PushNotificationsService {
|
|
7237
|
+
constructor() {
|
|
7238
|
+
this.seenNotifications = [];
|
|
7239
|
+
this.pendingNotifications = [];
|
|
7240
|
+
}
|
|
7241
|
+
loadUserNotifications(user) {
|
|
7242
|
+
if (user) {
|
|
7243
|
+
this.userId = user.user_id;
|
|
7244
|
+
this.seenNotifications = user.seenNotifications;
|
|
7245
|
+
this.pendingNotifications = user.pendingNotifications;
|
|
7246
|
+
}
|
|
7247
|
+
}
|
|
7248
|
+
toggleNotificationsPanel(open) {
|
|
7249
|
+
if (!open) {
|
|
7250
|
+
let notificationsArray = [];
|
|
7251
|
+
const newSeenNotifications = [...this.seenNotifications];
|
|
7252
|
+
this.pendingNotifications.forEach((notification) => {
|
|
7253
|
+
if (notification.notification_tag !== 'TAG_WELCOME') {
|
|
7254
|
+
let pushNotificationUpdateStatusRequestFormatted = {};
|
|
7255
|
+
pushNotificationUpdateStatusRequestFormatted.tag = notification.notification_tag;
|
|
7256
|
+
pushNotificationUpdateStatusRequestFormatted.new_status = 'true';
|
|
7257
|
+
notificationsArray.push(pushNotificationUpdateStatusRequestFormatted);
|
|
7258
|
+
}
|
|
7259
|
+
const seenNotification = { ...notification, notification_viewed: true };
|
|
7260
|
+
newSeenNotifications.unshift(seenNotification);
|
|
7261
|
+
});
|
|
7262
|
+
this.pendingNotifications = [];
|
|
7263
|
+
this.seenNotifications = newSeenNotifications;
|
|
7264
|
+
if (notificationsArray.length > 0 && this.userId !== null) {
|
|
7265
|
+
let updatePushNotificationViewedStatusRequest = {};
|
|
7266
|
+
updatePushNotificationViewedStatusRequest.user_id = this.userId;
|
|
7267
|
+
updatePushNotificationViewedStatusRequest.push_notifications = notificationsArray;
|
|
7268
|
+
return updatePushNotificationViewedStatusRequest;
|
|
7269
|
+
}
|
|
7270
|
+
}
|
|
7271
|
+
}
|
|
7272
|
+
getNotificationContent(text, additionalText) {
|
|
7273
|
+
if (text.indexOf('{{replace}}') !== -1 && additionalText) {
|
|
7274
|
+
text = text.replace('{{replace}}', additionalText);
|
|
7275
|
+
}
|
|
7276
|
+
return text;
|
|
7277
|
+
}
|
|
7278
|
+
removeTextOverflow(elementId) {
|
|
7279
|
+
let element = document.querySelector(".notification#" + elementId + " .body");
|
|
7280
|
+
if (element?.classList.contains('white-space-nowrap')) {
|
|
7281
|
+
element.classList.remove('white-space-nowrap');
|
|
7282
|
+
}
|
|
7283
|
+
else if (element) {
|
|
7284
|
+
element.classList.add('white-space-nowrap');
|
|
7285
|
+
}
|
|
7286
|
+
}
|
|
7287
|
+
clearLoginNotification() {
|
|
7288
|
+
const welcomeTag = 'TAG_WELCOME';
|
|
7289
|
+
if (this.pendingNotifications?.length) {
|
|
7290
|
+
this.pendingNotifications = this.pendingNotifications.filter(notification => notification.notification_tag !== welcomeTag);
|
|
7291
|
+
}
|
|
7292
|
+
if (this.seenNotifications?.length) {
|
|
7293
|
+
this.seenNotifications = this.seenNotifications.filter(notification => notification.notification_tag !== welcomeTag);
|
|
7294
|
+
}
|
|
7295
|
+
}
|
|
7296
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PushNotificationsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
7297
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PushNotificationsService, providedIn: 'root' }); }
|
|
7298
|
+
}
|
|
7299
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PushNotificationsService, decorators: [{
|
|
7300
|
+
type: Injectable,
|
|
7301
|
+
args: [{ providedIn: 'root' }]
|
|
7302
|
+
}] });
|
|
7303
|
+
|
|
7304
|
+
class GravityPushNotificationsComponent {
|
|
7305
|
+
set userNotifications(value) {
|
|
7306
|
+
this._userNotifications = value;
|
|
7307
|
+
this.processData();
|
|
7308
|
+
}
|
|
7309
|
+
constructor(pushNotificationsService, elementRef) {
|
|
7310
|
+
this.pushNotificationsService = pushNotificationsService;
|
|
7311
|
+
this.elementRef = elementRef;
|
|
7312
|
+
this.viewedNotificationsResponse = new EventEmitter();
|
|
7313
|
+
this.isPanelOpen = false;
|
|
7314
|
+
}
|
|
7315
|
+
ngOnInit() {
|
|
7316
|
+
this.processData();
|
|
7317
|
+
}
|
|
7318
|
+
ngOnDestroy() {
|
|
7319
|
+
this.pushNotificationsService.clearLoginNotification();
|
|
7320
|
+
}
|
|
7321
|
+
processData() {
|
|
7322
|
+
this.pushNotificationsService.loadUserNotifications(this._userNotifications);
|
|
7323
|
+
}
|
|
7324
|
+
handleToggleNotificationsPanel() {
|
|
7325
|
+
this.isPanelOpen = !this.isPanelOpen;
|
|
7326
|
+
this.viewedNotifications = this.pushNotificationsService.toggleNotificationsPanel(this.isPanelOpen);
|
|
7327
|
+
if (this.viewedNotifications?.push_notifications?.length > 0) {
|
|
7328
|
+
this.viewedNotificationsResponse.emit(this.viewedNotifications);
|
|
7329
|
+
}
|
|
7330
|
+
}
|
|
7331
|
+
onClick(event) {
|
|
7332
|
+
if (this.isPanelOpen) {
|
|
7333
|
+
const clickedInside = this.elementRef.nativeElement.contains(event.target);
|
|
7334
|
+
if (!clickedInside) {
|
|
7335
|
+
this.handleToggleNotificationsPanel();
|
|
7336
|
+
}
|
|
7337
|
+
}
|
|
7338
|
+
}
|
|
7339
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityPushNotificationsComponent, deps: [{ token: PushNotificationsService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7340
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityPushNotificationsComponent, selector: "gravity-push-notifications", inputs: { userNotifications: "userNotifications" }, outputs: { viewedNotificationsResponse: "viewedNotificationsResponse" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"btn-group notifications-wrapper\" data-cy=\"PUSH_NOTIFICATIONS_wrapper\">\n <div class=\"notifications-toggle pointer\" [class.active]=\"isPanelOpen\" data-cy=\"PUSH_NOTIFICATIONS_toggle\"\n (click)=\"handleToggleNotificationsPanel()\">\n <gravity-icon class=\"bell\" [iconName]=\"'bell'\" [iconSize]=\"'md-16'\"></gravity-icon>\n <span *ngIf=\"pushNotificationsService.pendingNotifications.length > 0\" class=\"circle\"></span>\n </div>\n <div *ngIf=\"isPanelOpen\" class=\"dropdown-menu dropdown-menu-right\" data-cy=\"PUSH_NOTIFICATIONS_panel\">\n <div class=\"panel-header\" data-cy=\"PUSH_NOTIFICATIONS_panel_header\">\n <p class=\"hr-body md-regular\" data-cy=\"PUSH_NOTIFICATIONS_panel_title\"> Notifications </p>\n <p class=\"hr-body md-regular\" data-cy=\"PUSH_NOTIFICATIONS_panel_pending_counter\"\n *ngIf=\"pushNotificationsService.pendingNotifications.length > 0\">\n {{pushNotificationsService.pendingNotifications.length}}\n </p>\n </div>\n <div class=\"notifications\" data-cy=\"PUSH_NOTIFICATIONS_item\"\n *ngIf=\"pushNotificationsService.pendingNotifications?.length > 0\">\n <p> New </p>\n <ng-container *ngFor=\"let notification of pushNotificationsService.pendingNotifications, let index = index\">\n <div class=\"notification pending\" data-cy=\"PUSH_NOTIFICATIONS_new_notification\"\n (click)=\"$event.stopPropagation(); pushNotificationsService.removeTextOverflow('pending-' + index)\"\n id=\"pending-{{index}}\">\n <gravity-icon *ngIf=\"notification.iconName\" [iconName]=\"notification.iconName\" [hoverIcon]=\"false\" [iconSize]=\"'lg-24'\"></gravity-icon>\n <div class=\"notification-content\">\n <p class=\"hr-title sm-bold title\">\n <span class=\"pending-notification-circle\"></span>\n {{pushNotificationsService.getNotificationContent(notification.titleText, notification.titleAdditionalText)}}\n </p>\n <p class=\"body hr-body md-regular white-space-nowrap\" title=\"Click to expand\">\n {{pushNotificationsService.getNotificationContent(notification.bodyText, notification.bodyAdditionalText)}}\n </p>\n </div>\n </div>\n <hr *ngIf=\"index + 1 != pushNotificationsService.pendingNotifications.length\">\n </ng-container>\n </div>\n <hr *ngIf=\"pushNotificationsService.pendingNotifications?.length > 0 && pushNotificationsService.seenNotifications?.length > 0\">\n <div class=\"notifications\" *ngIf=\"pushNotificationsService.seenNotifications?.length > 0\">\n <p> Old </p>\n <ng-container *ngFor=\"let notification of pushNotificationsService.seenNotifications, let index = index\">\n <div class=\"notification\" data-cy=\"PUSH_NOTIFICATIONS_old_notification\"\n (click)=\"$event.stopPropagation(); pushNotificationsService.removeTextOverflow('seen-' + index)\"\n id=\"seen-{{index}}\">\n <gravity-icon *ngIf=\"notification.iconName\" [iconName]=\"notification.iconName\" [hoverIcon]=\"false\" [iconSize]=\"'lg-24'\"></gravity-icon>\n <div class=\"notification-content\">\n <p class=\"hr-title sm-bold title\">\n {{pushNotificationsService.getNotificationContent(notification.titleText, notification.titleAdditionalText)}}\n </p>\n <p class=\"body hr-body md-regular white-space-nowrap\" title=\"Click to expand\">\n {{pushNotificationsService.getNotificationContent(notification.bodyAdditionalText, notification.bodyAdditionalText)}}\n </p>\n </div>\n </div>\n <hr *ngIf=\"index + 1 != pushNotificationsService.seenNotifications.length\">\n </ng-container>\n </div>\n <div class=\"notifications\"\n *ngIf=\"pushNotificationsService.pendingNotifications?.length == 0 && pushNotificationsService.seenNotifications?.length == 0\">\n <p class=\"no-notification\"> No new notifications </p>\n </div>\n </div>\n</div>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}.notifications-wrapper{--circle-top: 3.25px;--circle-width: 8.67px;--circle-right: 6.13px;--circle-height: 8.67px;--notifications-wrapper-width: 29px;--notifications-wrapper-height: 29px;--notifications-toggle-padding: 6.5px;--circle-border-radius: 6.25rem;--notifications-wrapper-border-radius: 0;--notifications-toggle-border-radius: 6.25rem}.notifications-wrapper{width:var(--notifications-wrapper-width);height:var(--notifications-wrapper-height);border-radius:var(--notifications-wrapper-border-radius)}.notifications-toggle{width:100%;height:100%;display:flex;position:relative;align-items:center;justify-content:center;padding:var(--notifications-toggle-padding);border-radius:var(--notifications-toggle-border-radius)}.notifications-toggle:hover,.notifications-toggle.active{cursor:pointer;background-color:var(--bg-notification-button-hover)}.notifications-toggle:hover .bell,.notifications-toggle.active .bell{--icon-color: var(--on-bg-notification-button-hover)}.notifications-toggle .bell{--icon-color: var(--on-bg-notification-button-active)}.notifications-toggle .circle{position:absolute;top:var(--circle-top);right:var(--circle-right);width:var(--circle-width);height:var(--circle-height);border-radius:var(--circle-border-radius);background-color:var(--bg-notification-badge-button)}.dropdown-menu{z-index:2;position:absolute;padding:0 0 .5rem;right:0!important;top:35px!important;border-radius:.9375rem;border:1px solid rgba(0,0,0,.175);background-color:var(--bg-dialog-primary)}@media (min-width: 993px){.dropdown-menu{width:25rem}}@media (max-width: 992px){.dropdown-menu{width:19rem}}.panel-header{display:flex;padding:1rem 2rem;justify-content:space-between;border-radius:.9375rem .9375rem 0 0;background-color:var(--on-bg-highlight-neutro-primary)}.panel-header p{font-weight:600;letter-spacing:1.023px;color:var(--on-bg-notification-list-primary)}.notifications{padding:.75rem 2rem;color:var(--text-primary)}.notifications .notification:last-of-type{padding-bottom:0}.notification{display:flex;padding-block:1rem;align-items:flex-start}.notification .notification-content{margin-left:1.5rem}.notification .notification-content .title{margin-bottom:.25rem}.notification .notification-content .title span.pending-notification-circle{width:.625rem;height:.625rem;min-width:.625rem;min-height:.625rem;margin-right:.25rem;display:inline-block;border-radius:1.5625rem;background-color:var(--notification-success-highlight-primary)}.notification .notification-content .body{overflow:hidden;text-overflow:ellipsis}@media (min-width: 993px){.notification .notification-content .body{width:18rem}}@media (max-width: 992px){.notification .notification-content .body{width:10rem}}.notification .notification-content .body.white-space-nowrap{white-space:nowrap}hr{margin:0;border-top-color:var(--divider-primary)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
|
|
7341
|
+
}
|
|
7342
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityPushNotificationsComponent, decorators: [{
|
|
7343
|
+
type: Component,
|
|
7344
|
+
args: [{ selector: 'gravity-push-notifications', template: "<div class=\"btn-group notifications-wrapper\" data-cy=\"PUSH_NOTIFICATIONS_wrapper\">\n <div class=\"notifications-toggle pointer\" [class.active]=\"isPanelOpen\" data-cy=\"PUSH_NOTIFICATIONS_toggle\"\n (click)=\"handleToggleNotificationsPanel()\">\n <gravity-icon class=\"bell\" [iconName]=\"'bell'\" [iconSize]=\"'md-16'\"></gravity-icon>\n <span *ngIf=\"pushNotificationsService.pendingNotifications.length > 0\" class=\"circle\"></span>\n </div>\n <div *ngIf=\"isPanelOpen\" class=\"dropdown-menu dropdown-menu-right\" data-cy=\"PUSH_NOTIFICATIONS_panel\">\n <div class=\"panel-header\" data-cy=\"PUSH_NOTIFICATIONS_panel_header\">\n <p class=\"hr-body md-regular\" data-cy=\"PUSH_NOTIFICATIONS_panel_title\"> Notifications </p>\n <p class=\"hr-body md-regular\" data-cy=\"PUSH_NOTIFICATIONS_panel_pending_counter\"\n *ngIf=\"pushNotificationsService.pendingNotifications.length > 0\">\n {{pushNotificationsService.pendingNotifications.length}}\n </p>\n </div>\n <div class=\"notifications\" data-cy=\"PUSH_NOTIFICATIONS_item\"\n *ngIf=\"pushNotificationsService.pendingNotifications?.length > 0\">\n <p> New </p>\n <ng-container *ngFor=\"let notification of pushNotificationsService.pendingNotifications, let index = index\">\n <div class=\"notification pending\" data-cy=\"PUSH_NOTIFICATIONS_new_notification\"\n (click)=\"$event.stopPropagation(); pushNotificationsService.removeTextOverflow('pending-' + index)\"\n id=\"pending-{{index}}\">\n <gravity-icon *ngIf=\"notification.iconName\" [iconName]=\"notification.iconName\" [hoverIcon]=\"false\" [iconSize]=\"'lg-24'\"></gravity-icon>\n <div class=\"notification-content\">\n <p class=\"hr-title sm-bold title\">\n <span class=\"pending-notification-circle\"></span>\n {{pushNotificationsService.getNotificationContent(notification.titleText, notification.titleAdditionalText)}}\n </p>\n <p class=\"body hr-body md-regular white-space-nowrap\" title=\"Click to expand\">\n {{pushNotificationsService.getNotificationContent(notification.bodyText, notification.bodyAdditionalText)}}\n </p>\n </div>\n </div>\n <hr *ngIf=\"index + 1 != pushNotificationsService.pendingNotifications.length\">\n </ng-container>\n </div>\n <hr *ngIf=\"pushNotificationsService.pendingNotifications?.length > 0 && pushNotificationsService.seenNotifications?.length > 0\">\n <div class=\"notifications\" *ngIf=\"pushNotificationsService.seenNotifications?.length > 0\">\n <p> Old </p>\n <ng-container *ngFor=\"let notification of pushNotificationsService.seenNotifications, let index = index\">\n <div class=\"notification\" data-cy=\"PUSH_NOTIFICATIONS_old_notification\"\n (click)=\"$event.stopPropagation(); pushNotificationsService.removeTextOverflow('seen-' + index)\"\n id=\"seen-{{index}}\">\n <gravity-icon *ngIf=\"notification.iconName\" [iconName]=\"notification.iconName\" [hoverIcon]=\"false\" [iconSize]=\"'lg-24'\"></gravity-icon>\n <div class=\"notification-content\">\n <p class=\"hr-title sm-bold title\">\n {{pushNotificationsService.getNotificationContent(notification.titleText, notification.titleAdditionalText)}}\n </p>\n <p class=\"body hr-body md-regular white-space-nowrap\" title=\"Click to expand\">\n {{pushNotificationsService.getNotificationContent(notification.bodyAdditionalText, notification.bodyAdditionalText)}}\n </p>\n </div>\n </div>\n <hr *ngIf=\"index + 1 != pushNotificationsService.seenNotifications.length\">\n </ng-container>\n </div>\n <div class=\"notifications\"\n *ngIf=\"pushNotificationsService.pendingNotifications?.length == 0 && pushNotificationsService.seenNotifications?.length == 0\">\n <p class=\"no-notification\"> No new notifications </p>\n </div>\n </div>\n</div>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}.notifications-wrapper{--circle-top: 3.25px;--circle-width: 8.67px;--circle-right: 6.13px;--circle-height: 8.67px;--notifications-wrapper-width: 29px;--notifications-wrapper-height: 29px;--notifications-toggle-padding: 6.5px;--circle-border-radius: 6.25rem;--notifications-wrapper-border-radius: 0;--notifications-toggle-border-radius: 6.25rem}.notifications-wrapper{width:var(--notifications-wrapper-width);height:var(--notifications-wrapper-height);border-radius:var(--notifications-wrapper-border-radius)}.notifications-toggle{width:100%;height:100%;display:flex;position:relative;align-items:center;justify-content:center;padding:var(--notifications-toggle-padding);border-radius:var(--notifications-toggle-border-radius)}.notifications-toggle:hover,.notifications-toggle.active{cursor:pointer;background-color:var(--bg-notification-button-hover)}.notifications-toggle:hover .bell,.notifications-toggle.active .bell{--icon-color: var(--on-bg-notification-button-hover)}.notifications-toggle .bell{--icon-color: var(--on-bg-notification-button-active)}.notifications-toggle .circle{position:absolute;top:var(--circle-top);right:var(--circle-right);width:var(--circle-width);height:var(--circle-height);border-radius:var(--circle-border-radius);background-color:var(--bg-notification-badge-button)}.dropdown-menu{z-index:2;position:absolute;padding:0 0 .5rem;right:0!important;top:35px!important;border-radius:.9375rem;border:1px solid rgba(0,0,0,.175);background-color:var(--bg-dialog-primary)}@media (min-width: 993px){.dropdown-menu{width:25rem}}@media (max-width: 992px){.dropdown-menu{width:19rem}}.panel-header{display:flex;padding:1rem 2rem;justify-content:space-between;border-radius:.9375rem .9375rem 0 0;background-color:var(--on-bg-highlight-neutro-primary)}.panel-header p{font-weight:600;letter-spacing:1.023px;color:var(--on-bg-notification-list-primary)}.notifications{padding:.75rem 2rem;color:var(--text-primary)}.notifications .notification:last-of-type{padding-bottom:0}.notification{display:flex;padding-block:1rem;align-items:flex-start}.notification .notification-content{margin-left:1.5rem}.notification .notification-content .title{margin-bottom:.25rem}.notification .notification-content .title span.pending-notification-circle{width:.625rem;height:.625rem;min-width:.625rem;min-height:.625rem;margin-right:.25rem;display:inline-block;border-radius:1.5625rem;background-color:var(--notification-success-highlight-primary)}.notification .notification-content .body{overflow:hidden;text-overflow:ellipsis}@media (min-width: 993px){.notification .notification-content .body{width:18rem}}@media (max-width: 992px){.notification .notification-content .body{width:10rem}}.notification .notification-content .body.white-space-nowrap{white-space:nowrap}hr{margin:0;border-top-color:var(--divider-primary)}\n"] }]
|
|
7345
|
+
}], ctorParameters: function () { return [{ type: PushNotificationsService }, { type: i0.ElementRef }]; }, propDecorators: { userNotifications: [{
|
|
7346
|
+
type: Input
|
|
7347
|
+
}], viewedNotificationsResponse: [{
|
|
7348
|
+
type: Output
|
|
7349
|
+
}], onClick: [{
|
|
7350
|
+
type: HostListener,
|
|
7351
|
+
args: ['document:click', ['$event']]
|
|
7352
|
+
}] } });
|
|
7353
|
+
|
|
7354
|
+
class GravityHeaderComponent {
|
|
7355
|
+
constructor() {
|
|
7356
|
+
this.size = 'md';
|
|
7357
|
+
this.isMobile = false;
|
|
7358
|
+
this.isMenuOpen = false;
|
|
7359
|
+
this.language = 'en';
|
|
7360
|
+
this.notifications = false;
|
|
7361
|
+
this.backButtonResponse = new EventEmitter();
|
|
7362
|
+
this.toggleMenuResponse = new EventEmitter();
|
|
7363
|
+
this.viewedNotificationsResponse = new EventEmitter();
|
|
7364
|
+
this.iconToggle = false;
|
|
7365
|
+
this.isBackButtonPressed = false;
|
|
7366
|
+
}
|
|
7367
|
+
toggleMenu() {
|
|
7368
|
+
this.iconToggle = !this.iconToggle;
|
|
7369
|
+
setTimeout(function () {
|
|
7370
|
+
this.isMenuOpen = !this.isMenuOpen;
|
|
7371
|
+
this.toggleMenuResponse.emit(this.isMenuOpen);
|
|
7372
|
+
}.bind(this), 65);
|
|
7373
|
+
}
|
|
7374
|
+
backAction() {
|
|
7375
|
+
this.backButtonResponse.emit();
|
|
7376
|
+
}
|
|
7377
|
+
handleViewedNotificationsResponse($event) {
|
|
7378
|
+
this.viewedNotificationsResponse.emit($event);
|
|
7379
|
+
}
|
|
7380
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7381
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityHeaderComponent, selector: "gravity-header", inputs: { title: "title", logoUrl: "logoUrl", longTitle: "longTitle", backButton: "backButton", breadCrumb: "breadCrumb", size: "size", isMobile: "isMobile", isMenuOpen: "isMenuOpen", language: "language", notifications: "notifications", userNotifications: "userNotifications" }, outputs: { backButtonResponse: "backButtonResponse", toggleMenuResponse: "toggleMenuResponse", viewedNotificationsResponse: "viewedNotificationsResponse" }, ngImport: i0, template: "<div class=\"gravity-header\" [class.mobile]=\"isMobile\">\n <section class=\"first-level\">\n <svg-icon *ngIf=\"isMobile && logoUrl && !backButton\" class=\"logo-header\" [src]=\"logoUrl\"/>\n\n <div *ngIf=\"backButton && breadCrumb?.list?.length < 1\" class=\"back-bottom\" [class.pressed]=\"isBackButtonPressed\"\n (mousedown)=\"isBackButtonPressed = true\" (mouseup)=\"isBackButtonPressed = false\" (click)=\"backAction()\"\n (mouseleave)=\"isBackButtonPressed = false\" (touchstart)=\"isBackButtonPressed = true\">\n <gravity-icon [style.--icon-color]=\"'var(--back-button-color)'\" [iconSize]=\"'sm-12'\" [iconName]=\"'arrow-left'\"/>\n <span class=\"hr-label {{size}}-regular\">{{ language === 'en' ? 'Back' : 'Atr\u00E1s' }}</span>\n </div>\n\n <div *ngIf=\"breadCrumb?.list?.length > 0\" class=\"breadcrumb\">\n <gravity-icon *ngIf=\"breadCrumb.icon\" class=\"gravity-margin-right-xs\" [iconSize]=\"'md-16'\"\n [style.--icon-color]=\"'var(--breadcrumb-button-base-primary)'\" [iconName]=\"breadCrumb.icon\"/>\n\n <ng-container *ngFor=\"let item of breadCrumb.list; let last = last; let i = index\">\n <div class=\"breadcrumb-item\" [class.is-last]=\"last\" [class.has-prev]=\"i !== 0\"\n (mousedown)=\"item.isPressed = true\" (mouseup)=\"item.isPressed = false\"\n (mouseleave)=\"item.isPressed = false\" (touchstart)=\"item.isPressed = true\">\n <span class=\"hr-body {{size}}-regular\" [class.pressed]=\"item.isPressed\" (click)=\"!last && item.callback?.()\">{{ item.text }}</span>\n </div>\n </ng-container>\n </div>\n\n <h1 *ngIf=\"!backButton && !isMobile && breadCrumb?.list?.length < 1\" class=\"hr-headline md-bold\">{{ title }}</h1>\n\n <span *ngIf=\"isMobile && backButton\" class=\"hr-body md-bold\">{{ longTitle }}</span>\n\n <div class=\"main-actions\">\n <ng-content select=\"[main-actions]\"/>\n\n <gravity-push-notifications *ngIf=\"notifications\" [userNotifications]=\"userNotifications\"\n (viewedNotificationsResponse)=\"handleViewedNotificationsResponse($event)\"/>\n\n <gravity-icon *ngIf=\"isMobile\" [style.--icon-color]=\"'var(--back-button-color)'\" [iconSize]=\"'lg-24'\"\n [iconName]=\"isMenuOpen ? 'unsuccess' : 'menu'\" (click)=\"toggleMenu()\"\n [@iconToggle]=\"iconToggle ? 'open' : 'closed'\"/>\n </div>\n </section>\n\n <section *ngIf=\"!isMobile && (backButton || breadCrumb?.list?.length > 0)\" class=\"second-level\">\n <h1 class=\"hr-headline md-bold\">{{ title }}</h1>\n <ng-content select=\"[extra-actions]\"/>\n </section>\n\n <section *ngIf=\"isMobile && !backButton\" class=\"second-level\">\n <h1 class=\"hr-title lg-bold\">{{ title }}</h1>\n </section>\n\n</div>", styles: [".gravity-header{width:100%;display:flex;-webkit-user-select:none;user-select:none;align-items:center;flex-direction:column;color:var(--text-primary);justify-content:space-between;gap:var(--gravity-spacing-xs);padding:var(--gravity-spacing-md) var(--gravity-spacing-md) var(--gravity-spacing-xs) var(--gravity-spacing-md)}.gravity-header .first-level{display:flex;align-items:center;align-self:stretch;justify-content:space-between}.gravity-header .first-level .logo-header svg{max-width:55px;max-height:29px}.gravity-header .first-level .back-bottom{display:flex;cursor:pointer;align-items:center;gap:var(--gravity-spacing-xs);color:var(--back-button-color);padding:var(--gravity-spacing-xs) 6px;--back-button-color: var(--bg-button-active-primary)}.gravity-header .first-level .back-bottom:hover{border-radius:2px;color:var(--back-button-color);background:var(--surface-primary);--back-button-color: var(--on-bg-back-button-hover-primary)}.gravity-header .first-level .back-bottom.pressed{background:none;color:var(--back-button-color);--back-button-color: var(--back-button-pressed-primary)}.gravity-header .first-level .breadcrumb{display:flex;align-items:center;justify-content:flex-start}.gravity-header .first-level .breadcrumb .breadcrumb-item{display:flex;align-items:center;gap:var(--gravity-spacing-xxxs)}.gravity-header .first-level .breadcrumb .breadcrumb-item.has-prev:before{content:\"/\";gap:var(--gravity-spacing-xxxs);color:var(--breadcrumb-button-base-primary)}.gravity-header .first-level .breadcrumb .breadcrumb-item.is-last span{cursor:default;color:var(--breadcrumb-button-active-primary)}.gravity-header .first-level .breadcrumb .breadcrumb-item:not(.is-last) span{cursor:pointer;color:var(--breadcrumb-button-base-primary)}.gravity-header .first-level .breadcrumb .breadcrumb-item:not(.is-last) span:hover{background:var(--surface-primary);color:var(--on-bg-breadcrumb-button-hover-primary)}.gravity-header .first-level .breadcrumb .breadcrumb-item:not(.is-last) span.pressed{background:none;color:var(--breadcrumb-button-pressed-primary)}.gravity-header .first-level .main-actions{display:flex;align-items:center}.gravity-header .first-level .main-actions gravity-icon{cursor:pointer;margin-left:var(--gravity-spacing-sm);transition:transform .1s ease-in-out;--back-button-color: var(--bg-button-active-primary)}.gravity-header .first-level .main-actions gravity-push-notifications{position:relative;margin-left:var(--gravity-spacing-sm)}.gravity-header .second-level{display:flex;flex-direction:row;align-items:center;align-self:stretch;justify-content:space-between;gap:var(--gravity-spacing-xs)}.gravity-header.mobile{min-width:320px;max-width:1099px;padding:var(--gravity-spacing-sm)}\n"], dependencies: [{ kind: "component", type: i1.SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "applyCss", "svgClass", "class", "viewBox", "svgAriaLabel", "svgStyle"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }, { kind: "component", type: GravityPushNotificationsComponent, selector: "gravity-push-notifications", inputs: ["userNotifications"], outputs: ["viewedNotificationsResponse"] }], animations: [
|
|
7382
|
+
trigger('iconToggle', [
|
|
7383
|
+
state('open', style({ opacity: 1, transform: 'rotate(90deg)' })),
|
|
7384
|
+
state('closed', style({ opacity: 1, transform: 'rotate(0deg)' })),
|
|
7385
|
+
transition('* <=> *', [
|
|
7386
|
+
animate('65ms ease-out', style({ opacity: .25, transform: 'rotate(45deg)' })),
|
|
7387
|
+
animate('65ms ease-in')
|
|
7388
|
+
])
|
|
7389
|
+
])
|
|
7390
|
+
] }); }
|
|
7391
|
+
}
|
|
7392
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityHeaderComponent, decorators: [{
|
|
7393
|
+
type: Component,
|
|
7394
|
+
args: [{ selector: 'gravity-header', animations: [
|
|
7395
|
+
trigger('iconToggle', [
|
|
7396
|
+
state('open', style({ opacity: 1, transform: 'rotate(90deg)' })),
|
|
7397
|
+
state('closed', style({ opacity: 1, transform: 'rotate(0deg)' })),
|
|
7398
|
+
transition('* <=> *', [
|
|
7399
|
+
animate('65ms ease-out', style({ opacity: .25, transform: 'rotate(45deg)' })),
|
|
7400
|
+
animate('65ms ease-in')
|
|
7401
|
+
])
|
|
7402
|
+
])
|
|
7403
|
+
], template: "<div class=\"gravity-header\" [class.mobile]=\"isMobile\">\n <section class=\"first-level\">\n <svg-icon *ngIf=\"isMobile && logoUrl && !backButton\" class=\"logo-header\" [src]=\"logoUrl\"/>\n\n <div *ngIf=\"backButton && breadCrumb?.list?.length < 1\" class=\"back-bottom\" [class.pressed]=\"isBackButtonPressed\"\n (mousedown)=\"isBackButtonPressed = true\" (mouseup)=\"isBackButtonPressed = false\" (click)=\"backAction()\"\n (mouseleave)=\"isBackButtonPressed = false\" (touchstart)=\"isBackButtonPressed = true\">\n <gravity-icon [style.--icon-color]=\"'var(--back-button-color)'\" [iconSize]=\"'sm-12'\" [iconName]=\"'arrow-left'\"/>\n <span class=\"hr-label {{size}}-regular\">{{ language === 'en' ? 'Back' : 'Atr\u00E1s' }}</span>\n </div>\n\n <div *ngIf=\"breadCrumb?.list?.length > 0\" class=\"breadcrumb\">\n <gravity-icon *ngIf=\"breadCrumb.icon\" class=\"gravity-margin-right-xs\" [iconSize]=\"'md-16'\"\n [style.--icon-color]=\"'var(--breadcrumb-button-base-primary)'\" [iconName]=\"breadCrumb.icon\"/>\n\n <ng-container *ngFor=\"let item of breadCrumb.list; let last = last; let i = index\">\n <div class=\"breadcrumb-item\" [class.is-last]=\"last\" [class.has-prev]=\"i !== 0\"\n (mousedown)=\"item.isPressed = true\" (mouseup)=\"item.isPressed = false\"\n (mouseleave)=\"item.isPressed = false\" (touchstart)=\"item.isPressed = true\">\n <span class=\"hr-body {{size}}-regular\" [class.pressed]=\"item.isPressed\" (click)=\"!last && item.callback?.()\">{{ item.text }}</span>\n </div>\n </ng-container>\n </div>\n\n <h1 *ngIf=\"!backButton && !isMobile && breadCrumb?.list?.length < 1\" class=\"hr-headline md-bold\">{{ title }}</h1>\n\n <span *ngIf=\"isMobile && backButton\" class=\"hr-body md-bold\">{{ longTitle }}</span>\n\n <div class=\"main-actions\">\n <ng-content select=\"[main-actions]\"/>\n\n <gravity-push-notifications *ngIf=\"notifications\" [userNotifications]=\"userNotifications\"\n (viewedNotificationsResponse)=\"handleViewedNotificationsResponse($event)\"/>\n\n <gravity-icon *ngIf=\"isMobile\" [style.--icon-color]=\"'var(--back-button-color)'\" [iconSize]=\"'lg-24'\"\n [iconName]=\"isMenuOpen ? 'unsuccess' : 'menu'\" (click)=\"toggleMenu()\"\n [@iconToggle]=\"iconToggle ? 'open' : 'closed'\"/>\n </div>\n </section>\n\n <section *ngIf=\"!isMobile && (backButton || breadCrumb?.list?.length > 0)\" class=\"second-level\">\n <h1 class=\"hr-headline md-bold\">{{ title }}</h1>\n <ng-content select=\"[extra-actions]\"/>\n </section>\n\n <section *ngIf=\"isMobile && !backButton\" class=\"second-level\">\n <h1 class=\"hr-title lg-bold\">{{ title }}</h1>\n </section>\n\n</div>", styles: [".gravity-header{width:100%;display:flex;-webkit-user-select:none;user-select:none;align-items:center;flex-direction:column;color:var(--text-primary);justify-content:space-between;gap:var(--gravity-spacing-xs);padding:var(--gravity-spacing-md) var(--gravity-spacing-md) var(--gravity-spacing-xs) var(--gravity-spacing-md)}.gravity-header .first-level{display:flex;align-items:center;align-self:stretch;justify-content:space-between}.gravity-header .first-level .logo-header svg{max-width:55px;max-height:29px}.gravity-header .first-level .back-bottom{display:flex;cursor:pointer;align-items:center;gap:var(--gravity-spacing-xs);color:var(--back-button-color);padding:var(--gravity-spacing-xs) 6px;--back-button-color: var(--bg-button-active-primary)}.gravity-header .first-level .back-bottom:hover{border-radius:2px;color:var(--back-button-color);background:var(--surface-primary);--back-button-color: var(--on-bg-back-button-hover-primary)}.gravity-header .first-level .back-bottom.pressed{background:none;color:var(--back-button-color);--back-button-color: var(--back-button-pressed-primary)}.gravity-header .first-level .breadcrumb{display:flex;align-items:center;justify-content:flex-start}.gravity-header .first-level .breadcrumb .breadcrumb-item{display:flex;align-items:center;gap:var(--gravity-spacing-xxxs)}.gravity-header .first-level .breadcrumb .breadcrumb-item.has-prev:before{content:\"/\";gap:var(--gravity-spacing-xxxs);color:var(--breadcrumb-button-base-primary)}.gravity-header .first-level .breadcrumb .breadcrumb-item.is-last span{cursor:default;color:var(--breadcrumb-button-active-primary)}.gravity-header .first-level .breadcrumb .breadcrumb-item:not(.is-last) span{cursor:pointer;color:var(--breadcrumb-button-base-primary)}.gravity-header .first-level .breadcrumb .breadcrumb-item:not(.is-last) span:hover{background:var(--surface-primary);color:var(--on-bg-breadcrumb-button-hover-primary)}.gravity-header .first-level .breadcrumb .breadcrumb-item:not(.is-last) span.pressed{background:none;color:var(--breadcrumb-button-pressed-primary)}.gravity-header .first-level .main-actions{display:flex;align-items:center}.gravity-header .first-level .main-actions gravity-icon{cursor:pointer;margin-left:var(--gravity-spacing-sm);transition:transform .1s ease-in-out;--back-button-color: var(--bg-button-active-primary)}.gravity-header .first-level .main-actions gravity-push-notifications{position:relative;margin-left:var(--gravity-spacing-sm)}.gravity-header .second-level{display:flex;flex-direction:row;align-items:center;align-self:stretch;justify-content:space-between;gap:var(--gravity-spacing-xs)}.gravity-header.mobile{min-width:320px;max-width:1099px;padding:var(--gravity-spacing-sm)}\n"] }]
|
|
7404
|
+
}], propDecorators: { title: [{
|
|
7405
|
+
type: Input
|
|
7406
|
+
}], logoUrl: [{
|
|
7407
|
+
type: Input
|
|
7408
|
+
}], longTitle: [{
|
|
7409
|
+
type: Input
|
|
7410
|
+
}], backButton: [{
|
|
7411
|
+
type: Input
|
|
7412
|
+
}], breadCrumb: [{
|
|
7413
|
+
type: Input
|
|
7414
|
+
}], size: [{
|
|
7415
|
+
type: Input
|
|
7416
|
+
}], isMobile: [{
|
|
7417
|
+
type: Input
|
|
7418
|
+
}], isMenuOpen: [{
|
|
7419
|
+
type: Input
|
|
7420
|
+
}], language: [{
|
|
7421
|
+
type: Input
|
|
7422
|
+
}], notifications: [{
|
|
7423
|
+
type: Input
|
|
7424
|
+
}], userNotifications: [{
|
|
7425
|
+
type: Input
|
|
7426
|
+
}], backButtonResponse: [{
|
|
7427
|
+
type: Output
|
|
7428
|
+
}], toggleMenuResponse: [{
|
|
7429
|
+
type: Output
|
|
7430
|
+
}], viewedNotificationsResponse: [{
|
|
7431
|
+
type: Output
|
|
7432
|
+
}] } });
|
|
7433
|
+
|
|
7236
7434
|
class GravityDesignSystemModule {
|
|
7237
7435
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityDesignSystemModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
7238
7436
|
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: GravityDesignSystemModule, declarations: [GravityAttachFileComponent,
|
|
@@ -7304,7 +7502,9 @@ class GravityDesignSystemModule {
|
|
|
7304
7502
|
YearCalendarComponent,
|
|
7305
7503
|
DualMonthCalendarComponent,
|
|
7306
7504
|
GravitySegmentedButtonComponent,
|
|
7307
|
-
GravityCurrencyDisplayV2Component
|
|
7505
|
+
GravityCurrencyDisplayV2Component,
|
|
7506
|
+
GravityHeaderComponent,
|
|
7507
|
+
GravityPushNotificationsComponent], imports: [i1.AngularSvgIconModule, i2$3.AngularSvgIconPreloaderModule, BsDatepickerModule,
|
|
7308
7508
|
CommonModule,
|
|
7309
7509
|
FormsModule, GravityTooltipModule, NgbDatepickerModule,
|
|
7310
7510
|
NgbOffcanvasModule,
|
|
@@ -7356,7 +7556,9 @@ class GravityDesignSystemModule {
|
|
|
7356
7556
|
GravityGenericAvatarSecondaryComponent,
|
|
7357
7557
|
GravityBackdropComponent,
|
|
7358
7558
|
GravityCalendarNextComponent,
|
|
7359
|
-
GravitySegmentedButtonComponent
|
|
7559
|
+
GravitySegmentedButtonComponent,
|
|
7560
|
+
GravityHeaderComponent,
|
|
7561
|
+
GravityPushNotificationsComponent] }); }
|
|
7360
7562
|
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityDesignSystemModule, imports: [AngularSvgIconModule.forRoot(),
|
|
7361
7563
|
AngularSvgIconPreloaderModule.forRoot({
|
|
7362
7564
|
configUrl: './assets/gravity/json/icons.json',
|
|
@@ -7445,6 +7647,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
7445
7647
|
DualMonthCalendarComponent,
|
|
7446
7648
|
GravitySegmentedButtonComponent,
|
|
7447
7649
|
GravityCurrencyDisplayV2Component,
|
|
7650
|
+
GravityHeaderComponent,
|
|
7651
|
+
GravityPushNotificationsComponent,
|
|
7448
7652
|
],
|
|
7449
7653
|
imports: [
|
|
7450
7654
|
AngularSvgIconModule.forRoot(),
|
|
@@ -7508,7 +7712,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
7508
7712
|
GravityGenericAvatarSecondaryComponent,
|
|
7509
7713
|
GravityBackdropComponent,
|
|
7510
7714
|
GravityCalendarNextComponent,
|
|
7511
|
-
GravitySegmentedButtonComponent
|
|
7715
|
+
GravitySegmentedButtonComponent,
|
|
7716
|
+
GravityHeaderComponent,
|
|
7717
|
+
GravityPushNotificationsComponent,
|
|
7512
7718
|
]
|
|
7513
7719
|
}]
|
|
7514
7720
|
}] });
|
|
@@ -7563,5 +7769,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
7563
7769
|
* Generated bundle index. Do not edit.
|
|
7564
7770
|
*/
|
|
7565
7771
|
|
|
7566
|
-
export { BsNavigationDirection, GravityAttachFileComponent, GravityAvatarStackComponent, GravityBackdropComponent, GravityButtonComponent, GravityCalendarComponent, GravityCalendarNextComponent, GravityCalendarV2Component, GravityCardButtonComponent, GravityCardListComponent, GravityCheckboxComponent, GravityChipComponent, GravityChipGroupComponent, GravityCurrencyComponent, GravityCurrencyDisplayComponent, GravityCurrencyDisplayV2Component, GravityDataViewComponent, GravityDataViewsV2Component, GravityDesignSystemModule, GravityDetailContainerComponent, GravityDialogComponent, GravityDialogManagerService, GravityDropdownLabelComponent, GravityDropdownListComponent, GravityDropdownListDisplayComponent, GravityEditableInputComponent, GravityFlyoutComponent, GravityGenericAvatarComponent, GravityGenericAvatarSecondaryComponent, GravityIconButtonComponent, GravityIconComponent, GravityLinkComponent, GravityModalComponent, GravityMultiLanguageComponent, GravityNavigationCardComponent, GravityNetworkPillComponent, GravityNotificationInstantContainerComponent, GravityRadioButtonComponent, GravitySegmentedButtonComponent, GravityStatusIndicatorComponent, GravityStepperComponent, GravitySwitchComponent, GravityTabPrimaryComponent, GravityTabSecondaryComponent, GravityTableComponent, GravityTablesV2Component, GravityTextFieldComponent, GravityTextFieldNumberOnlyComponent, GravityTooltipComponent, GravityTooltipDirective, GravityTooltipModule, GravityTreeViewComponent, ICONS, OLD_ICONS };
|
|
7772
|
+
export { BsNavigationDirection, GravityAttachFileComponent, GravityAvatarStackComponent, GravityBackdropComponent, GravityButtonComponent, GravityCalendarComponent, GravityCalendarNextComponent, GravityCalendarV2Component, GravityCardButtonComponent, GravityCardListComponent, GravityCheckboxComponent, GravityChipComponent, GravityChipGroupComponent, GravityCurrencyComponent, GravityCurrencyDisplayComponent, GravityCurrencyDisplayV2Component, GravityDataViewComponent, GravityDataViewsV2Component, GravityDesignSystemModule, GravityDetailContainerComponent, GravityDialogComponent, GravityDialogManagerService, GravityDropdownLabelComponent, GravityDropdownListComponent, GravityDropdownListDisplayComponent, GravityEditableInputComponent, GravityFlyoutComponent, GravityGenericAvatarComponent, GravityGenericAvatarSecondaryComponent, GravityHeaderComponent, GravityIconButtonComponent, GravityIconComponent, GravityLinkComponent, GravityModalComponent, GravityMultiLanguageComponent, GravityNavigationCardComponent, GravityNetworkPillComponent, GravityNotificationInstantContainerComponent, GravityPushNotificationsComponent, GravityRadioButtonComponent, GravitySegmentedButtonComponent, GravityStatusIndicatorComponent, GravityStepperComponent, GravitySwitchComponent, GravityTabPrimaryComponent, GravityTabSecondaryComponent, GravityTableComponent, GravityTablesV2Component, GravityTextFieldComponent, GravityTextFieldNumberOnlyComponent, GravityTooltipComponent, GravityTooltipDirective, GravityTooltipModule, GravityTreeViewComponent, ICONS, OLD_ICONS };
|
|
7567
7773
|
//# sourceMappingURL=progressio_resources-gravity-design-system.mjs.map
|