@design-factory/design-factory 18.0.4 → 18.1.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/README.md +5 -62
- package/design-factory-initial-branding.css +1 -1
- package/design-factory.css +1 -1
- package/esm2022/lib/angular/accessibility/accessibility.module.mjs +4 -4
- package/esm2022/lib/angular/accessibility/components/skip-links-container/skip-links-container.component.mjs +3 -3
- package/esm2022/lib/angular/accessibility/directives/skip-link.directive.mjs +3 -3
- package/esm2022/lib/angular/alert/alert.module.mjs +4 -4
- package/esm2022/lib/angular/card/card-advanced.module.mjs +4 -4
- package/esm2022/lib/angular/card/manage-card-selection.directive.mjs +3 -3
- package/esm2022/lib/angular/datepicker/closedatepicker.directive.mjs +3 -3
- package/esm2022/lib/angular/datepicker/datepicker-keyboard-nav.service.mjs +3 -3
- package/esm2022/lib/angular/datepicker/datepicker-range.directive.mjs +3 -3
- package/esm2022/lib/angular/datepicker/datepicker-range.service.mjs +3 -3
- package/esm2022/lib/angular/datepicker/datepicker.module.mjs +4 -4
- package/esm2022/lib/angular/df.module.mjs +4 -4
- package/esm2022/lib/angular/footer/footer.module.mjs +4 -4
- package/esm2022/lib/angular/icon/amadeus-icon.mjs +3 -3
- package/esm2022/lib/angular/icon/icon.module.mjs +4 -4
- package/esm2022/lib/angular/icon/insert/insert-icon.directive.mjs +3 -3
- package/esm2022/lib/angular/icon/insert/insert-icon.module.mjs +4 -4
- package/esm2022/lib/angular/inputs/click/trigger-click.directive.mjs +3 -3
- package/esm2022/lib/angular/inputs/icon/inputicon.directive.mjs +3 -3
- package/esm2022/lib/angular/inputs/input-advanced.module.mjs +4 -4
- package/esm2022/lib/angular/mediaqueries/ifMedia.directive.mjs +3 -3
- package/esm2022/lib/angular/mediaqueries/media.module.mjs +4 -4
- package/esm2022/lib/angular/mediaqueries/media.service.mjs +3 -3
- package/esm2022/lib/angular/mediaqueries/mediaUtils.service.mjs +9 -9
- package/esm2022/lib/angular/modal/modal.service.mjs +3 -3
- package/esm2022/lib/angular/popover/config/popover.config.mjs +3 -3
- package/esm2022/lib/angular/popover/popover.module.mjs +4 -4
- package/esm2022/lib/angular/progressbar/progressbar.component.mjs +3 -3
- package/esm2022/lib/angular/progressbar/progressbar.module.mjs +4 -4
- package/esm2022/lib/angular/progressindicator/default/default-spinner.component.mjs +3 -3
- package/esm2022/lib/angular/progressindicator/progressindicator-backdrop.component.mjs +3 -3
- package/esm2022/lib/angular/progressindicator/progressindicator-container.component.mjs +3 -3
- package/esm2022/lib/angular/progressindicator/progressindicator.directive.mjs +3 -3
- package/esm2022/lib/angular/progressindicator/progressindicator.module.mjs +4 -4
- package/esm2022/lib/angular/progressindicator/progressindicator.service.mjs +3 -3
- package/esm2022/lib/angular/right-to-left/directionDetection.service.mjs +3 -3
- package/esm2022/lib/angular/selects/events/manage-badge-events.directive.mjs +3 -3
- package/esm2022/lib/angular/selects/nav/manage-nav-select.directive.mjs +3 -3
- package/esm2022/lib/angular/selects/option-highlight.directive.mjs +3 -3
- package/esm2022/lib/angular/selects/select.module.mjs +4 -4
- package/esm2022/lib/angular/sidenav/dfSideNavCollapse.mjs +3 -3
- package/esm2022/lib/angular/sidenav/dfSideNavCollapse.module.mjs +4 -4
- package/esm2022/lib/angular/sidenav/dfSideNavCollapse.service.mjs +3 -3
- package/esm2022/lib/angular/sidenav/dfSideNavCollapseConfig.mjs +3 -3
- package/esm2022/lib/angular/sidenav/excludeTrap.directive.mjs +3 -3
- package/esm2022/lib/angular/sidenav/manage-sidenav.directive.mjs +3 -3
- package/esm2022/lib/angular/sidenav/sidenav-config.mjs +3 -3
- package/esm2022/lib/angular/sidenav/sidenav.component.mjs +12 -12
- package/esm2022/lib/angular/sidenav/sidenav.module.mjs +4 -4
- package/esm2022/lib/angular/sidenav/sidenav.service.mjs +3 -3
- package/esm2022/lib/angular/sidenav/sidenavlist.component.mjs +3 -3
- package/esm2022/lib/angular/slider/direction/sliderdirection.directive.mjs +3 -3
- package/esm2022/lib/angular/slider/lib/slider-element.directive.mjs +3 -3
- package/esm2022/lib/angular/slider/lib/slider-handle.directive.mjs +3 -3
- package/esm2022/lib/angular/slider/lib/slider-label.directive.mjs +3 -3
- package/esm2022/lib/angular/slider/lib/slider.component.mjs +3 -3
- package/esm2022/lib/angular/slider/lib/tooltip-wrapper.component.mjs +3 -3
- package/esm2022/lib/angular/slider/slider.module.mjs +4 -4
- package/esm2022/lib/angular/stepper/stepper.component.mjs +6 -6
- package/esm2022/lib/angular/stepper/stepper.directive.mjs +6 -6
- package/esm2022/lib/angular/stepper/stepper.module.mjs +4 -4
- package/esm2022/lib/angular/stepper/stepper.service.mjs +3 -3
- package/esm2022/lib/angular/toast/toast.module.mjs +4 -4
- package/esm2022/lib/angular/tooltip/tooltip.module.mjs +4 -4
- package/esm2022/lib/angular/tooltip/truncate/tooltipTruncate.directive.mjs +3 -3
- package/esm2022/lib/angular/utils/scrollbar.service.mjs +3 -3
- package/esm2022/lib/angular/utils/titleTruncate.directive.mjs +3 -3
- package/esm2022/lib/angular/waves-of-progress/waves.directive.mjs +3 -3
- package/esm2022/lib/angular/waves-of-progress/waves.module.mjs +4 -4
- package/fesm2022/design-factory.mjs +249 -249
- package/package.json +1 -1
- package/styles/scss/components/dropdown/_dropdown.scss +1 -1
- package/styles/scss/components/dropdown/_dropdown.variables.scss +1 -0
- package/styles/scss/components/modal/_modal.scss +4 -2
- package/styles/scss/components/table/_advancedtables.scss +1 -1
- package/styles/scss/themes/brand2023/_variables.scss +1 -2
- package/assets/readme.png +0 -0
package/README.md
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
1
|
<h1 align="center">Amadeus Design Factory</h1>
|
|
2
|
-
<p align="center">
|
|
3
|
-
<img src="./assets/readme.png" alt="Design Factory banner"/>
|
|
4
|
-
</p>
|
|
5
2
|
|
|
6
3
|
## Description
|
|
7
4
|
|
|
@@ -11,8 +8,7 @@ Design Factory is an InnerSource design system made of:
|
|
|
11
8
|
- A set of design and coding best practices
|
|
12
9
|
- A cross-functional community from all Amadeus business units
|
|
13
10
|
|
|
14
|
-
If you want to get more information about Design Factory, please
|
|
15
|
-
[Design Factory](https://amadeus.atlassian.net/wiki/spaces/UFSCD/overview?homepageId=1690992651).
|
|
11
|
+
If you want to get more information about Design Factory, please contact [Design Factory team](mailto:DFQuestions@amadeusworkplace.onmicrosoft.com).
|
|
16
12
|
|
|
17
13
|
## Getting started
|
|
18
14
|
|
|
@@ -51,7 +47,9 @@ in your styles.scss
|
|
|
51
47
|
|
|
52
48
|
## Dependencies
|
|
53
49
|
|
|
54
|
-
|
|
50
|
+
## Dependencies
|
|
51
|
+
|
|
52
|
+
The dependencies are [Angular](https://angular.io), [Bootstrap 5](https://getbootstrap.com), [Ng-bootstrap](https://ng-bootstrap.github.io), [AgnosUI](https://amadeusitgroup.github.io/AgnosUI/latest/), [Ng-select](https://ng-select.github.io/ng-select#/data-sources), [Ag-grid](https://www.ag-grid.com/) and [ngx-slider](https://angular-slider.github.io/ngx-slider/).
|
|
55
53
|
The supported versions are:
|
|
56
54
|
|
|
57
55
|
| Design Factory | Angular | Bootstrap CSS | Ng-Bootstrap | Ng-select | Ag-grid | ngx-slider | AgnosUI |
|
|
@@ -66,65 +64,10 @@ The supported versions are:
|
|
|
66
64
|
| 16.x.x | 16.x.x | 5.2.0 | 15.1.0 | 11.2.0 | 30.2.x | | |
|
|
67
65
|
| 17.0.x | 17.x.x | 5.3.2 | 16.0.x | 12.0.x | 31.0.x | | 0.0.1-alpha.10 |
|
|
68
66
|
| 17.1.x | 17.x.x | 5.3.3 | 16.0.x | 12.0.x | 31.1.x | | 0.2.0 |
|
|
69
|
-
| 18.0.x | 18.x.x | 5.3.3 | 17.0.x | 13.2.x | 31.3.x | | 0.4.
|
|
70
|
-
|
|
71
|
-
## Design Factory Webportal
|
|
72
|
-
|
|
73
|
-
To view latest Design Factory components, please go to our [Web portal](https://design-factory.app.net6.paas.westeurope.rnd.az.amadeus.net). You need Amadeus intranet access to access this webportal.
|
|
74
|
-
|
|
75
|
-
## To use an existing component
|
|
76
|
-
|
|
77
|
-
To use an existing component, please follow the following process and tutorials: [How to use an existing component](https://amadeus.atlassian.net/wiki/spaces/UFSCD/pages/1691021723/How+to+use).
|
|
78
|
-
|
|
79
|
-
## To contribute to a component
|
|
80
|
-
|
|
81
|
-
To contribute to an existing or new component, please follow the following guideline: [How to contribute to an existing or new component](https://amadeus.atlassian.net/wiki/spaces/UFSCD/pages/1690994038/How+to+contribute).
|
|
82
|
-
|
|
83
|
-
## Release guide
|
|
84
|
-
|
|
85
|
-
### Webportal version generation
|
|
86
|
-
|
|
87
|
-
The Webportal versions are stored in [Artifactory generic storage](https://repository.rnd.amadeus.net/artifactory/DF-generic-validated-df-nce/).
|
|
88
|
-
|
|
89
|
-
In order to publish a new version you need to follow these steps:
|
|
90
|
-
|
|
91
|
-
1. Change the version in package.json to the version you want to publish (always follow the Major.minor~~.patch~~ convention, e.g. 18.1)
|
|
92
|
-
2. Change the app.component.ts fetch versions path from '../assets/versions.json' to '../../../versions.json'
|
|
93
|
-
3. Build the demo webportal: npm run build:demo
|
|
94
|
-
4. Generate zip and deploy to artifactory: npm run generate-demo-zip <artifactory_user> <artifactory_password>
|
|
67
|
+
| 18.0.x | 18.x.x | 5.3.3 | 17.0.x | 13.2.x | 31.3.x | | 0.4.x |
|
|
95
68
|
|
|
96
69
|
## How to work with the icons
|
|
97
70
|
|
|
98
71
|
[Icons](https://design-factory.app.net6.paas.westeurope.rnd.az.amadeus.net/#/components/icon/examples) are a mix of [Font Awesome](https://fontawesome.com/) (FW) and in-house produced pictograms.
|
|
99
72
|
|
|
100
73
|
Since DF 18.0.0 release in-house icons and FW icons are split into different fonts.
|
|
101
|
-
|
|
102
|
-
### How to update the FW icons
|
|
103
|
-
|
|
104
|
-
1. Download the FW Pro version distribution zip. You need to have an account with Pro version - ask the DF core team.
|
|
105
|
-
2. Select font styles that you need (currently only Solid, Light, Brands are used)
|
|
106
|
-
3. Copy the woff2 font files into the assets folder (projects/design-factory/src/assets/fonts/font-awesome)
|
|
107
|
-
4. [Only when adding a new font style] Copy custom FontAwesome @font-face into projects/design-factory/src/styles/scss/components/fonts/\_fonts-family.scss and modify the source to target the proper woff2 in assets folder
|
|
108
|
-
5. Run the font-awesome-extract script with the all.css file located in the FW-distrubution.zip/css folder as an input.
|
|
109
|
-
This will generate the respective ts files with list of icons in src/app/components/handmade/icon/demos/font/ and respective css files with content in projects/design-factory/src/styles/scss/components/fonts.
|
|
110
|
-
[When adding a new font style] The script currently extracts only base and brand icons, for the new ones it needs to be modified with proper regex and logic.
|
|
111
|
-
6. [Only when adding a new font style] Update the /src/app/components/handmade/icon/demos/font/icon-font.ts with the references to the list of icons to create a new tab in the portal.
|
|
112
|
-
|
|
113
|
-
### How to update the in-house fonts
|
|
114
|
-
|
|
115
|
-
1. Go to the [Icomoon](https://icomoon.io/app/#/)
|
|
116
|
-
2. Select "New Empty Set"
|
|
117
|
-
3. Click "Import Icons"
|
|
118
|
-
4. Open the latest release zip file and select "selection.json"
|
|
119
|
-
5. Select "Yes" for the font's metrics and metadata
|
|
120
|
-
6. Click "Import to Set"
|
|
121
|
-
7. Select the new icon SVG that you want to add.
|
|
122
|
-
8. Make sure to prefix the new icon name with 'df-'
|
|
123
|
-
9. Make sure that the order of the icons in light and solid sets is the same as Icomoon will assing the same glyph codes.
|
|
124
|
-
10. Click "Select all"
|
|
125
|
-
11. Click "Generate Font"
|
|
126
|
-
12. In the Preferences change the Font Name to reflect the contents (df-light-300) and Class Prefix to 'icon-'
|
|
127
|
-
13. Download the font zip (contains the woff file)
|
|
128
|
-
14. Generate the woff2 with a converter of your choice
|
|
129
|
-
15. Update the respective list of icons in src/app/components/handmade/icon/demos/font/icon-list.ts
|
|
130
|
-
16. Update the respective font.scss file with content attribute in fonts folder (projects/design-factory/src/styles/scss/components/fonts/\_icon-font.scss)
|