nw-style-guide 9.1.2 → 9.1.3
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 +151 -151
- package/animations/defaults.d.ts +2 -2
- package/animations/defaults.js +2 -2
- package/animations/index.d.ts +1 -1
- package/animations/index.js +1 -1
- package/assets/images/branding/favicons/safari-pinned-tab.svg +27 -27
- package/autofocus/autofocus.directive.d.ts +9 -9
- package/autofocus/autofocus.directive.js +19 -19
- package/autofocus/autofocus.module.d.ts +8 -8
- package/autofocus/autofocus.module.js +20 -20
- package/autofocus/index.d.ts +2 -2
- package/autofocus/index.js +2 -2
- package/carousel/carousel-slide.directive.d.ts +6 -6
- package/carousel/carousel-slide.directive.js +23 -23
- package/carousel/carousel.component.d.ts +43 -43
- package/carousel/carousel.component.js +287 -287
- package/carousel/carousel.module.d.ts +9 -9
- package/carousel/carousel.module.js +21 -21
- package/carousel/index.d.ts +3 -3
- package/carousel/index.js +3 -3
- package/charts/area/area.directive.d.ts +42 -42
- package/charts/area/area.directive.js +101 -101
- package/charts/axis/axis-base.d.ts +42 -42
- package/charts/axis/axis-base.js +106 -106
- package/charts/axis/models/XAxisScale.d.ts +2 -2
- package/charts/axis/models/XAxisScale.js +1 -1
- package/charts/axis/x-axis.directive.d.ts +20 -20
- package/charts/axis/x-axis.directive.js +68 -68
- package/charts/axis/y-axis.directive.d.ts +20 -20
- package/charts/axis/y-axis.directive.js +69 -69
- package/charts/bar/bar.directive.d.ts +31 -31
- package/charts/bar/bar.directive.js +81 -81
- package/charts/brush/brush.directive.d.ts +27 -27
- package/charts/brush/brush.directive.js +93 -93
- package/charts/chart.component.d.ts +46 -46
- package/charts/chart.component.js +181 -181
- package/charts/chart.utils.d.ts +16 -16
- package/charts/chart.utils.js +34 -34
- package/charts/charts.module.d.ts +18 -18
- package/charts/charts.module.js +73 -73
- package/charts/circle/circle.directive.d.ts +34 -34
- package/charts/circle/circle.directive.js +88 -88
- package/charts/foreign-object/foreign-object.directive.d.ts +34 -34
- package/charts/foreign-object/foreign-object.directive.js +86 -86
- package/charts/index.d.ts +11 -11
- package/charts/index.js +11 -11
- package/charts/path/path.directive.d.ts +37 -37
- package/charts/path/path.directive.js +99 -99
- package/charts/tooltip/chart-tooltip.directive.d.ts +24 -24
- package/charts/tooltip/chart-tooltip.directive.js +50 -50
- package/dropdowns/dropdown-menu.directive.d.ts +17 -17
- package/dropdowns/dropdown-menu.directive.js +62 -62
- package/dropdowns/dropdown-toggle.directive.d.ts +22 -22
- package/dropdowns/dropdown-toggle.directive.js +72 -72
- package/dropdowns/dropdown.directive.d.ts +30 -30
- package/dropdowns/dropdown.directive.js +110 -110
- package/dropdowns/dropdown.service.d.ts +14 -14
- package/dropdowns/dropdown.service.js +40 -40
- package/dropdowns/dropdowns.module.d.ts +10 -10
- package/dropdowns/dropdowns.module.js +22 -22
- package/dropdowns/index.d.ts +4 -4
- package/dropdowns/index.js +4 -4
- package/email-input/email-input.component.d.ts +43 -43
- package/email-input/email-input.component.js +274 -274
- package/email-input/email-input.module.d.ts +9 -9
- package/email-input/email-input.module.js +24 -24
- package/email-input/index.d.ts +3 -3
- package/email-input/index.js +2 -2
- package/email-input/models/IValidationChange.d.ts +6 -6
- package/email-input/models/IValidationChange.js +1 -1
- package/feature-alerts/IFeatureAlertParams.d.ts +10 -10
- package/feature-alerts/IFeatureAlertParams.js +1 -1
- package/feature-alerts/feature-alerts.module.d.ts +10 -10
- package/feature-alerts/feature-alerts.module.js +29 -29
- package/feature-alerts/feature-alerts.service.d.ts +13 -13
- package/feature-alerts/feature-alerts.service.js +29 -29
- package/feature-alerts/hotspot.component.d.ts +14 -14
- package/feature-alerts/hotspot.component.js +61 -61
- package/feature-alerts/index.d.ts +4 -4
- package/feature-alerts/index.js +3 -3
- package/feature-alerts/windowref.d.ts +6 -6
- package/feature-alerts/windowref.js +16 -16
- package/loader/index.d.ts +2 -2
- package/loader/index.js +2 -2
- package/loader/loader.component.d.ts +17 -17
- package/loader/loader.component.js +101 -101
- package/loader/loader.module.d.ts +8 -8
- package/loader/loader.module.js +20 -20
- package/package.json +1 -1
- package/picker/IPickerItem.d.ts +11 -11
- package/picker/IPickerItem.js +1 -1
- package/picker/index.d.ts +3 -3
- package/picker/index.js +2 -2
- package/picker/picker.component.d.ts +70 -70
- package/picker/picker.component.js +710 -710
- package/picker/picker.module.d.ts +10 -10
- package/picker/picker.module.js +28 -28
- package/resize-observer/index.d.ts +2 -2
- package/resize-observer/index.js +2 -2
- package/resize-observer/resize-observer.directive.d.ts +20 -20
- package/resize-observer/resize-observer.directive.js +57 -57
- package/resize-observer/resize-observer.module.d.ts +8 -8
- package/resize-observer/resize-observer.module.js +20 -20
- package/sass/src/_alert.scss +71 -71
- package/sass/src/_button-groups.scss +49 -49
- package/sass/src/_buttons.scss +254 -254
- package/sass/src/_carousel.scss +67 -67
- package/sass/src/_close.scss +8 -8
- package/sass/src/_dropdowns.scss +298 -298
- package/sass/src/_email-input.scss +68 -68
- package/sass/src/_feature-alerts.scss +58 -58
- package/sass/src/_fonts.scss +23 -23
- package/sass/src/_forms.scss +736 -736
- package/sass/src/_labels.scss +52 -52
- package/sass/src/_list-group.scss +224 -224
- package/sass/src/_loader.scss +67 -67
- package/sass/src/_modals.scss +138 -138
- package/sass/src/_navs.scss +327 -327
- package/sass/src/_pagination.scss +10 -10
- package/sass/src/_picker.scss +143 -143
- package/sass/src/_pills.scss +81 -81
- package/sass/src/_popovers.scss +221 -221
- package/sass/src/_print.scss +93 -93
- package/sass/src/_relative-weight.scss +32 -32
- package/sass/src/_scaffolding.scss +162 -162
- package/sass/src/_shadows.scss +2 -2
- package/sass/src/_tables.scss +146 -146
- package/sass/src/_toasts.scss +68 -68
- package/sass/src/_tooltip.scss +120 -120
- package/sass/src/_type.scss +390 -390
- package/sass/src/_variables.scss +846 -846
- package/sass/src/functions/_colors.scss +55 -55
- package/sass/src/functions/_functions.scss +1 -1
- package/sass/src/mixins/_buttons.scss +91 -91
- package/sass/src/mixins/_dropdowns.scss +32 -32
- package/sass/src/mixins/_forms.scss +248 -248
- package/sass/src/mixins/_list-group.scss +32 -32
- package/sass/src/mixins/_mixins.scss +7 -7
- package/sass/src/mixins/_nav-size.scss +7 -7
- package/sass/src/mixins/_scrollbars.scss +27 -27
- package/sass/src/mixins/_tab-focus.scss +10 -10
- package/sass/styles.scss +106 -106
- package/styles.css +1 -1
- package/tabs/index.d.ts +3 -3
- package/tabs/index.js +3 -3
- package/tabs/tab.directive.d.ts +12 -12
- package/tabs/tab.directive.js +33 -33
- package/tabs/tabs.component.d.ts +43 -43
- package/tabs/tabs.component.js +237 -237
- package/tabs/tabs.module.d.ts +9 -9
- package/tabs/tabs.module.js +29 -29
- package/tabs/tabs.service.d.ts +10 -10
- package/tabs/tabs.service.js +17 -17
- package/toasts/IToast.d.ts +9 -9
- package/toasts/IToast.js +2 -2
- package/toasts/IToastConfig.d.ts +6 -6
- package/toasts/IToastConfig.js +1 -1
- package/toasts/Toast.d.ts +11 -11
- package/toasts/Toast.js +7 -7
- package/toasts/config.d.ts +2 -2
- package/toasts/config.js +3 -3
- package/toasts/index.d.ts +4 -4
- package/toasts/index.js +4 -4
- package/toasts/toasts.component.d.ts +21 -21
- package/toasts/toasts.component.js +186 -186
- package/toasts/toasts.module.d.ts +10 -10
- package/toasts/toasts.module.js +26 -26
- package/toasts/toasts.service.d.ts +29 -29
- package/toasts/toasts.service.js +61 -61
- package/tooltips/config/placement-flip-map.d.ts +2 -2
- package/tooltips/config/placement-flip-map.js +14 -14
- package/tooltips/config/tooltip-context-token.d.ts +3 -3
- package/tooltips/config/tooltip-context-token.js +2 -2
- package/tooltips/index.d.ts +3 -3
- package/tooltips/index.js +2 -2
- package/tooltips/models/ITooltipData.d.ts +8 -8
- package/tooltips/models/ITooltipData.js +1 -1
- package/tooltips/models/Placement.type.d.ts +1 -1
- package/tooltips/models/Placement.type.js +1 -1
- package/tooltips/models/PlacementFlipMap.type.d.ts +4 -4
- package/tooltips/models/PlacementFlipMap.type.js +1 -1
- package/tooltips/tooltip-container.component.d.ts +11 -11
- package/tooltips/tooltip-container.component.js +85 -85
- package/tooltips/tooltip.directive.d.ts +127 -127
- package/tooltips/tooltip.directive.js +392 -392
- package/tooltips/tooltip.module.d.ts +10 -10
- package/tooltips/tooltip.module.js +33 -33
package/README.md
CHANGED
|
@@ -1,151 +1,151 @@
|
|
|
1
|
-
# NewsWhip Style Guide
|
|
2
|
-
|
|
3
|
-
A library of components based on Bootstrap Sass 3.x
|
|
4
|
-
|
|
5
|
-
## Install
|
|
6
|
-
|
|
7
|
-
`npm i --save nw-style-guide`
|
|
8
|
-
|
|
9
|
-
Alternatively, the styles are available via cdn at
|
|
10
|
-
|
|
11
|
-
`https://cdn.jsdelivr.net/npm/nw-style-guide@{{version}}/styles.css`
|
|
12
|
-
|
|
13
|
-
or
|
|
14
|
-
|
|
15
|
-
`https://unpkg.com/nw-style-guide@{{version}}/styles.css`
|
|
16
|
-
|
|
17
|
-
## Usage
|
|
18
|
-
|
|
19
|
-
In your SASS file:
|
|
20
|
-
|
|
21
|
-
```scss
|
|
22
|
-
// Import your own app variables (if you have any)
|
|
23
|
-
@import './variables.scss';
|
|
24
|
-
|
|
25
|
-
// Import the entire NewsWhip style guide
|
|
26
|
-
@import "node_modules/nw-style-guide/sass/styles.scss";
|
|
27
|
-
```
|
|
28
|
-
|
|
29
|
-
> :warning: If you are importing the entire `styles.scss` file you do not need to import the individual functions, mixins and variables as outlined below. The `styles.scss` bundle already includes these
|
|
30
|
-
|
|
31
|
-
---
|
|
32
|
-
|
|
33
|
-
If you wish to import only specific parts of the style guide you first need to import the core library (functions, mixins and variables). The order of these imports is important
|
|
34
|
-
|
|
35
|
-
```scss
|
|
36
|
-
// Import the core (required) files in this order
|
|
37
|
-
@import "node_modules/nw-style-guide/sass/src/functions/functions";
|
|
38
|
-
@import "node_modules/nw-style-guide/sass/src/mixins/mixins";
|
|
39
|
-
@import "node_modules/nw-style-guide/sass/src/variables";
|
|
40
|
-
```
|
|
41
|
-
|
|
42
|
-
```scss
|
|
43
|
-
// Now you include the specific section of the style guide you require
|
|
44
|
-
@import "node_modules/nw-style-guide/sass/src/labels";
|
|
45
|
-
@import "node_modules/nw-style-guide/sass/src/forms";
|
|
46
|
-
```
|
|
47
|
-
|
|
48
|
-
In order to use the Proxima Nova font-family that comes bundled with the Style Guide, you will need to set the `$nw-font-path` variable in your own `variables.scss` file. This variable is a path that points to the fonts folder in the installed `nw-style-guide` package in your `node_modules` folder.
|
|
49
|
-
|
|
50
|
-
```scss
|
|
51
|
-
// your variables.scss file
|
|
52
|
-
$nw-font-path: '~nw-style-guide/assets/fonts';
|
|
53
|
-
```
|
|
54
|
-
|
|
55
|
-
---
|
|
56
|
-
|
|
57
|
-
## Development and release process
|
|
58
|
-
|
|
59
|
-
### Prerequisites
|
|
60
|
-
|
|
61
|
-
- If you don't have one, you'll need to [create an npm account](https://www.npmjs.com/signup)
|
|
62
|
-
- You'll need to [login](https://docs.npmjs.com/creating-a-new-npm-user-account#testing-your-new-account-with-npm-login) on a local command line
|
|
63
|
-
- Request to be added as a maintainer to the nw-style-guide [npm package](https://www.npmjs.com/package/nw-style-guide)
|
|
64
|
-
- [Enable 2FA](https://docs.npmjs.com/configuring-two-factor-authentication) on your npm account
|
|
65
|
-
|
|
66
|
-
### Features and fixes
|
|
67
|
-
|
|
68
|
-
1. Create a new feature branch off master
|
|
69
|
-
1. Implement feature / fix in feature branch
|
|
70
|
-
1. Create pull request
|
|
71
|
-
1. Build the Github Pages demo in the feature branch
|
|
72
|
-
- `npm run ghpages`
|
|
73
|
-
- Make sure to `git add --all` not to end up with untracked files
|
|
74
|
-
- Commit with message `build:ghpages`
|
|
75
|
-
- Push changes
|
|
76
|
-
|
|
77
|
-
1. Update the package version with the command `npm version {{version_type}}`. The version bump is automatically committed. See [here](https://docs.npmjs.com/cli/v6/commands/npm-version#synopsis) for further information on the `npm version` command
|
|
78
|
-
1. Push changes
|
|
79
|
-
1. PR is approved
|
|
80
|
-
1. Merge pull request to master
|
|
81
|
-
1. After merging to master, checkout master and pull the latest changes
|
|
82
|
-
1. Publish the new package version to npm with `npm run package:release`
|
|
83
|
-
- `npm run package:release` first runs the `package:build` script
|
|
84
|
-
- it then publishes the built files to npm
|
|
85
|
-
|
|
86
|
-
> :bulb: At the end of the `package:release` script you will be prompted for a one-time-password (OTP). You should get this OTP from whatever authenticator app you're using
|
|
87
|
-
|
|
88
|
-
### Development
|
|
89
|
-
|
|
90
|
-
We use several npm scripts to generate modules, components and directives. The following is an example of creating a tabs module, component, and directive.
|
|
91
|
-
|
|
92
|
-
`> npm run g:module tabs`
|
|
93
|
-
|
|
94
|
-
`> npm run g:component tabs`
|
|
95
|
-
|
|
96
|
-
`> npm run g:directive tabs`
|
|
97
|
-
|
|
98
|
-
This is now what our `src` directory looks like
|
|
99
|
-
|
|
100
|
-

|
|
101
|
-
|
|
102
|
-
### Further info on package release / publication
|
|
103
|
-
|
|
104
|
-
This final step in the release process above is
|
|
105
|
-
> Publish the new package version to npm
|
|
106
|
-
|
|
107
|
-
We don't want to publish all our assets to npm, only the assets required by the consumer. In order to achieve this we run our release script which builds the required files to the `distribution` folder.
|
|
108
|
-
|
|
109
|
-
```shell
|
|
110
|
-
> npm run package:release
|
|
111
|
-
```
|
|
112
|
-
|
|
113
|
-
This script does a few things:
|
|
114
|
-
|
|
115
|
-
1. It runs the `build.js` script which does the following
|
|
116
|
-
- Cleans the `distribution` folder
|
|
117
|
-
- Compiles each Angular module with `ngc` using the specific `tsconfig.build.json` for that module
|
|
118
|
-
- Copies the `sass` folder
|
|
119
|
-
- Copies the `README.md`
|
|
120
|
-
2. Copies the `package.json` file
|
|
121
|
-
3. Updates the copied `package.json` private property to `false`
|
|
122
|
-
4. Publishes the `distribution` folder to npm
|
|
123
|
-
|
|
124
|
-
> :warning: Publication will fail if the version in `package.json` has not been updated
|
|
125
|
-
|
|
126
|
-
### Github pages
|
|
127
|
-
|
|
128
|
-
We use Github pages to continuously deploy the application. When Github detects a change to the `/docs` folder in master, a redeployment takes place.
|
|
129
|
-
|
|
130
|
-
We can build the `/docs` folder for Github pages by running `npm run ghpages`.
|
|
131
|
-
|
|
132
|
-
**It's important to rebuild the `/docs` folder before branches are merged to master. Otherwise new features or fixes won't be visible on our demo site on Github Pages. As part of a pull request the `/docs` folder should be rebuilt using `npm run ghpages`**
|
|
133
|
-
|
|
134
|
-
### Local server
|
|
135
|
-
|
|
136
|
-
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
|
|
137
|
-
|
|
138
|
-
### Build
|
|
139
|
-
|
|
140
|
-
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `-prod` flag for a production build.
|
|
141
|
-
|
|
142
|
-
### Building local versions
|
|
143
|
-
|
|
144
|
-
Sometimes we won't want to release a beta version for testing changes, namely when making extensive changes that require continuous local testing inside the product. For this purpose we can run the `make-local-tgz` script and use it as follows:
|
|
145
|
-
- Make a `.tgz` package of Style Guide by running `npm run package:make-local-tgz`.
|
|
146
|
-
- Copy absolute path of newly built `.tgz` package from console logs.
|
|
147
|
-
- Paste it into the product's (e.g. Spike's) `package.json` file in place of the current `nw-style-guide` version to test your SG changes locally, without the need to publish a beta version.
|
|
148
|
-
|
|
149
|
-
### Heroku
|
|
150
|
-
|
|
151
|
-
Need more docs but we might move entirely to Heroku in favour of Github Pages. This will allow us to have a prod and staging environment. Come back to this.
|
|
1
|
+
# NewsWhip Style Guide
|
|
2
|
+
|
|
3
|
+
A library of components based on Bootstrap Sass 3.x
|
|
4
|
+
|
|
5
|
+
## Install
|
|
6
|
+
|
|
7
|
+
`npm i --save nw-style-guide`
|
|
8
|
+
|
|
9
|
+
Alternatively, the styles are available via cdn at
|
|
10
|
+
|
|
11
|
+
`https://cdn.jsdelivr.net/npm/nw-style-guide@{{version}}/styles.css`
|
|
12
|
+
|
|
13
|
+
or
|
|
14
|
+
|
|
15
|
+
`https://unpkg.com/nw-style-guide@{{version}}/styles.css`
|
|
16
|
+
|
|
17
|
+
## Usage
|
|
18
|
+
|
|
19
|
+
In your SASS file:
|
|
20
|
+
|
|
21
|
+
```scss
|
|
22
|
+
// Import your own app variables (if you have any)
|
|
23
|
+
@import './variables.scss';
|
|
24
|
+
|
|
25
|
+
// Import the entire NewsWhip style guide
|
|
26
|
+
@import "node_modules/nw-style-guide/sass/styles.scss";
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
> :warning: If you are importing the entire `styles.scss` file you do not need to import the individual functions, mixins and variables as outlined below. The `styles.scss` bundle already includes these
|
|
30
|
+
|
|
31
|
+
---
|
|
32
|
+
|
|
33
|
+
If you wish to import only specific parts of the style guide you first need to import the core library (functions, mixins and variables). The order of these imports is important
|
|
34
|
+
|
|
35
|
+
```scss
|
|
36
|
+
// Import the core (required) files in this order
|
|
37
|
+
@import "node_modules/nw-style-guide/sass/src/functions/functions";
|
|
38
|
+
@import "node_modules/nw-style-guide/sass/src/mixins/mixins";
|
|
39
|
+
@import "node_modules/nw-style-guide/sass/src/variables";
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
```scss
|
|
43
|
+
// Now you include the specific section of the style guide you require
|
|
44
|
+
@import "node_modules/nw-style-guide/sass/src/labels";
|
|
45
|
+
@import "node_modules/nw-style-guide/sass/src/forms";
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
In order to use the Proxima Nova font-family that comes bundled with the Style Guide, you will need to set the `$nw-font-path` variable in your own `variables.scss` file. This variable is a path that points to the fonts folder in the installed `nw-style-guide` package in your `node_modules` folder.
|
|
49
|
+
|
|
50
|
+
```scss
|
|
51
|
+
// your variables.scss file
|
|
52
|
+
$nw-font-path: '~nw-style-guide/assets/fonts';
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
---
|
|
56
|
+
|
|
57
|
+
## Development and release process
|
|
58
|
+
|
|
59
|
+
### Prerequisites
|
|
60
|
+
|
|
61
|
+
- If you don't have one, you'll need to [create an npm account](https://www.npmjs.com/signup)
|
|
62
|
+
- You'll need to [login](https://docs.npmjs.com/creating-a-new-npm-user-account#testing-your-new-account-with-npm-login) on a local command line
|
|
63
|
+
- Request to be added as a maintainer to the nw-style-guide [npm package](https://www.npmjs.com/package/nw-style-guide)
|
|
64
|
+
- [Enable 2FA](https://docs.npmjs.com/configuring-two-factor-authentication) on your npm account
|
|
65
|
+
|
|
66
|
+
### Features and fixes
|
|
67
|
+
|
|
68
|
+
1. Create a new feature branch off master
|
|
69
|
+
1. Implement feature / fix in feature branch
|
|
70
|
+
1. Create pull request
|
|
71
|
+
1. Build the Github Pages demo in the feature branch
|
|
72
|
+
- `npm run ghpages`
|
|
73
|
+
- Make sure to `git add --all` not to end up with untracked files
|
|
74
|
+
- Commit with message `build:ghpages`
|
|
75
|
+
- Push changes
|
|
76
|
+
|
|
77
|
+
1. Update the package version with the command `npm version {{version_type}}`. The version bump is automatically committed. See [here](https://docs.npmjs.com/cli/v6/commands/npm-version#synopsis) for further information on the `npm version` command
|
|
78
|
+
1. Push changes
|
|
79
|
+
1. PR is approved
|
|
80
|
+
1. Merge pull request to master
|
|
81
|
+
1. After merging to master, checkout master and pull the latest changes
|
|
82
|
+
1. Publish the new package version to npm with `npm run package:release`
|
|
83
|
+
- `npm run package:release` first runs the `package:build` script
|
|
84
|
+
- it then publishes the built files to npm
|
|
85
|
+
|
|
86
|
+
> :bulb: At the end of the `package:release` script you will be prompted for a one-time-password (OTP). You should get this OTP from whatever authenticator app you're using
|
|
87
|
+
|
|
88
|
+
### Development
|
|
89
|
+
|
|
90
|
+
We use several npm scripts to generate modules, components and directives. The following is an example of creating a tabs module, component, and directive.
|
|
91
|
+
|
|
92
|
+
`> npm run g:module tabs`
|
|
93
|
+
|
|
94
|
+
`> npm run g:component tabs`
|
|
95
|
+
|
|
96
|
+
`> npm run g:directive tabs`
|
|
97
|
+
|
|
98
|
+
This is now what our `src` directory looks like
|
|
99
|
+
|
|
100
|
+

|
|
101
|
+
|
|
102
|
+
### Further info on package release / publication
|
|
103
|
+
|
|
104
|
+
This final step in the release process above is
|
|
105
|
+
> Publish the new package version to npm
|
|
106
|
+
|
|
107
|
+
We don't want to publish all our assets to npm, only the assets required by the consumer. In order to achieve this we run our release script which builds the required files to the `distribution` folder.
|
|
108
|
+
|
|
109
|
+
```shell
|
|
110
|
+
> npm run package:release
|
|
111
|
+
```
|
|
112
|
+
|
|
113
|
+
This script does a few things:
|
|
114
|
+
|
|
115
|
+
1. It runs the `build.js` script which does the following
|
|
116
|
+
- Cleans the `distribution` folder
|
|
117
|
+
- Compiles each Angular module with `ngc` using the specific `tsconfig.build.json` for that module
|
|
118
|
+
- Copies the `sass` folder
|
|
119
|
+
- Copies the `README.md`
|
|
120
|
+
2. Copies the `package.json` file
|
|
121
|
+
3. Updates the copied `package.json` private property to `false`
|
|
122
|
+
4. Publishes the `distribution` folder to npm
|
|
123
|
+
|
|
124
|
+
> :warning: Publication will fail if the version in `package.json` has not been updated
|
|
125
|
+
|
|
126
|
+
### Github pages
|
|
127
|
+
|
|
128
|
+
We use Github pages to continuously deploy the application. When Github detects a change to the `/docs` folder in master, a redeployment takes place.
|
|
129
|
+
|
|
130
|
+
We can build the `/docs` folder for Github pages by running `npm run ghpages`.
|
|
131
|
+
|
|
132
|
+
**It's important to rebuild the `/docs` folder before branches are merged to master. Otherwise new features or fixes won't be visible on our demo site on Github Pages. As part of a pull request the `/docs` folder should be rebuilt using `npm run ghpages`**
|
|
133
|
+
|
|
134
|
+
### Local server
|
|
135
|
+
|
|
136
|
+
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
|
|
137
|
+
|
|
138
|
+
### Build
|
|
139
|
+
|
|
140
|
+
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `-prod` flag for a production build.
|
|
141
|
+
|
|
142
|
+
### Building local versions
|
|
143
|
+
|
|
144
|
+
Sometimes we won't want to release a beta version for testing changes, namely when making extensive changes that require continuous local testing inside the product. For this purpose we can run the `make-local-tgz` script and use it as follows:
|
|
145
|
+
- Make a `.tgz` package of Style Guide by running `npm run package:make-local-tgz`.
|
|
146
|
+
- Copy absolute path of newly built `.tgz` package from console logs.
|
|
147
|
+
- Paste it into the product's (e.g. Spike's) `package.json` file in place of the current `nw-style-guide` version to test your SG changes locally, without the need to publish a beta version.
|
|
148
|
+
|
|
149
|
+
### Heroku
|
|
150
|
+
|
|
151
|
+
Need more docs but we might move entirely to Heroku in favour of Github Pages. This will allow us to have a prod and staging environment. Come back to this.
|
package/animations/defaults.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export declare const NW_EASING: string;
|
|
2
|
-
export declare const NW_DURATION: string;
|
|
1
|
+
export declare const NW_EASING: string;
|
|
2
|
+
export declare const NW_DURATION: string;
|
package/animations/defaults.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export const NW_EASING = "cubic-bezier(0.49, 0.07, 0.2, 0.99)";
|
|
2
|
-
export const NW_DURATION = "300ms";
|
|
1
|
+
export const NW_EASING = "cubic-bezier(0.49, 0.07, 0.2, 0.99)";
|
|
2
|
+
export const NW_DURATION = "300ms";
|
package/animations/index.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export * from './defaults';
|
|
1
|
+
export * from './defaults';
|
package/animations/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export * from './defaults';
|
|
1
|
+
export * from './defaults';
|
|
@@ -1,27 +1,27 @@
|
|
|
1
|
-
<?xml version="1.0" standalone="no"?>
|
|
2
|
-
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
|
|
3
|
-
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
|
4
|
-
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
|
|
5
|
-
width="260.000000pt" height="260.000000pt" viewBox="0 0 260.000000 260.000000"
|
|
6
|
-
preserveAspectRatio="xMidYMid meet">
|
|
7
|
-
<metadata>
|
|
8
|
-
Created by potrace 1.11, written by Peter Selinger 2001-2013
|
|
9
|
-
</metadata>
|
|
10
|
-
<g transform="translate(0.000000,260.000000) scale(0.100000,-0.100000)"
|
|
11
|
-
fill="#000000" stroke="none">
|
|
12
|
-
<path d="M1170 2554 c-222 -33 -372 -84 -530 -181 -205 -126 -377 -318 -477
|
|
13
|
-
-531 -34 -71 -96 -242 -88 -242 2 0 -1 -15 -6 -32 -30 -105 -33 -384 -5 -518
|
|
14
|
-
101 -476 461 -855 921 -969 120 -30 138 -32 290 -36 143 -3 210 3 325 31 402
|
|
15
|
-
99 740 399 880 782 26 70 43 133 65 238 11 51 14 317 4 379 -44 281 -164 519
|
|
16
|
-
-359 715 -36 36 -83 79 -105 95 -22 17 -42 33 -45 36 -10 11 -120 79 -172 105
|
|
17
|
-
-97 49 -246 98 -368 119 -41 8 -294 14 -330 9z m257 -756 c37 -34 53 -72 134
|
|
18
|
-
-320 40 -125 76 -224 80 -220 4 4 41 113 83 242 42 129 84 249 95 266 28 46
|
|
19
|
-
101 78 158 70 25 -3 60 -15 79 -26 37 -24 74 -91 74 -138 0 -17 -45 -159 -101
|
|
20
|
-
-314 -56 -156 -105 -294 -109 -308 -39 -119 -104 -289 -121 -316 -43 -71 -135
|
|
21
|
-
-103 -221 -77 -90 26 -95 36 -228 426 -24 70 -47 127 -50 127 -3 0 -41 -103
|
|
22
|
-
-84 -230 -82 -237 -107 -284 -166 -315 -39 -20 -133 -19 -177 1 -70 34 -65 23
|
|
23
|
-
-297 677 -58 164 -106 311 -106 327 0 41 17 80 48 114 72 76 201 69 264 -15
|
|
24
|
-
21 -27 161 -431 174 -497 4 -21 13 -26 18 -11 3 8 39 117 80 243 78 237 99
|
|
25
|
-
282 151 312 65 39 170 31 222 -18z"/>
|
|
26
|
-
</g>
|
|
27
|
-
</svg>
|
|
1
|
+
<?xml version="1.0" standalone="no"?>
|
|
2
|
+
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
|
|
3
|
+
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
|
4
|
+
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
|
|
5
|
+
width="260.000000pt" height="260.000000pt" viewBox="0 0 260.000000 260.000000"
|
|
6
|
+
preserveAspectRatio="xMidYMid meet">
|
|
7
|
+
<metadata>
|
|
8
|
+
Created by potrace 1.11, written by Peter Selinger 2001-2013
|
|
9
|
+
</metadata>
|
|
10
|
+
<g transform="translate(0.000000,260.000000) scale(0.100000,-0.100000)"
|
|
11
|
+
fill="#000000" stroke="none">
|
|
12
|
+
<path d="M1170 2554 c-222 -33 -372 -84 -530 -181 -205 -126 -377 -318 -477
|
|
13
|
+
-531 -34 -71 -96 -242 -88 -242 2 0 -1 -15 -6 -32 -30 -105 -33 -384 -5 -518
|
|
14
|
+
101 -476 461 -855 921 -969 120 -30 138 -32 290 -36 143 -3 210 3 325 31 402
|
|
15
|
+
99 740 399 880 782 26 70 43 133 65 238 11 51 14 317 4 379 -44 281 -164 519
|
|
16
|
+
-359 715 -36 36 -83 79 -105 95 -22 17 -42 33 -45 36 -10 11 -120 79 -172 105
|
|
17
|
+
-97 49 -246 98 -368 119 -41 8 -294 14 -330 9z m257 -756 c37 -34 53 -72 134
|
|
18
|
+
-320 40 -125 76 -224 80 -220 4 4 41 113 83 242 42 129 84 249 95 266 28 46
|
|
19
|
+
101 78 158 70 25 -3 60 -15 79 -26 37 -24 74 -91 74 -138 0 -17 -45 -159 -101
|
|
20
|
+
-314 -56 -156 -105 -294 -109 -308 -39 -119 -104 -289 -121 -316 -43 -71 -135
|
|
21
|
+
-103 -221 -77 -90 26 -95 36 -228 426 -24 70 -47 127 -50 127 -3 0 -41 -103
|
|
22
|
+
-84 -230 -82 -237 -107 -284 -166 -315 -39 -20 -133 -19 -177 1 -70 34 -65 23
|
|
23
|
+
-297 677 -58 164 -106 311 -106 327 0 41 17 80 48 114 72 76 201 69 264 -15
|
|
24
|
+
21 -27 161 -431 174 -497 4 -21 13 -26 18 -11 3 8 39 117 80 243 78 237 99
|
|
25
|
+
282 151 312 65 39 170 31 222 -18z"/>
|
|
26
|
+
</g>
|
|
27
|
+
</svg>
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { OnInit, ElementRef } from "@angular/core";
|
|
2
|
-
import * as i0 from "@angular/core";
|
|
3
|
-
export declare class AutoFocusDirective implements OnInit {
|
|
4
|
-
private _elRef;
|
|
5
|
-
constructor(_elRef: ElementRef<HTMLElement>);
|
|
6
|
-
ngOnInit(): void;
|
|
7
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<AutoFocusDirective, never>;
|
|
8
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<AutoFocusDirective, "[nwAutofocus]", ["nw-autofocus"], {}, {}, never, never, false>;
|
|
9
|
-
}
|
|
1
|
+
import { OnInit, ElementRef } from "@angular/core";
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare class AutoFocusDirective implements OnInit {
|
|
4
|
+
private _elRef;
|
|
5
|
+
constructor(_elRef: ElementRef<HTMLElement>);
|
|
6
|
+
ngOnInit(): void;
|
|
7
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<AutoFocusDirective, never>;
|
|
8
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<AutoFocusDirective, "[nwAutofocus]", ["nw-autofocus"], {}, {}, never, never, false>;
|
|
9
|
+
}
|
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
import { Directive } from "@angular/core";
|
|
2
|
-
import * as i0 from "@angular/core";
|
|
3
|
-
export class AutoFocusDirective {
|
|
4
|
-
constructor(_elRef) {
|
|
5
|
-
this._elRef = _elRef;
|
|
6
|
-
}
|
|
7
|
-
ngOnInit() {
|
|
8
|
-
this._elRef.nativeElement.focus();
|
|
9
|
-
}
|
|
10
|
-
}
|
|
11
|
-
AutoFocusDirective.ɵfac = function AutoFocusDirective_Factory(t) { return new (t || AutoFocusDirective)(i0.ɵɵdirectiveInject(i0.ElementRef)); };
|
|
12
|
-
AutoFocusDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: AutoFocusDirective, selectors: [["", "nwAutofocus", ""]], exportAs: ["nw-autofocus"] });
|
|
13
|
-
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AutoFocusDirective, [{
|
|
14
|
-
type: Directive,
|
|
15
|
-
args: [{
|
|
16
|
-
selector: '[nwAutofocus]',
|
|
17
|
-
exportAs: 'nw-autofocus'
|
|
18
|
-
}]
|
|
19
|
-
}], function () { return [{ type: i0.ElementRef }]; }, null); })();
|
|
1
|
+
import { Directive } from "@angular/core";
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export class AutoFocusDirective {
|
|
4
|
+
constructor(_elRef) {
|
|
5
|
+
this._elRef = _elRef;
|
|
6
|
+
}
|
|
7
|
+
ngOnInit() {
|
|
8
|
+
this._elRef.nativeElement.focus();
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
AutoFocusDirective.ɵfac = function AutoFocusDirective_Factory(t) { return new (t || AutoFocusDirective)(i0.ɵɵdirectiveInject(i0.ElementRef)); };
|
|
12
|
+
AutoFocusDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: AutoFocusDirective, selectors: [["", "nwAutofocus", ""]], exportAs: ["nw-autofocus"] });
|
|
13
|
+
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AutoFocusDirective, [{
|
|
14
|
+
type: Directive,
|
|
15
|
+
args: [{
|
|
16
|
+
selector: '[nwAutofocus]',
|
|
17
|
+
exportAs: 'nw-autofocus'
|
|
18
|
+
}]
|
|
19
|
+
}], function () { return [{ type: i0.ElementRef }]; }, null); })();
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import * as i0 from "@angular/core";
|
|
2
|
-
import * as i1 from "./autofocus.directive";
|
|
3
|
-
import * as i2 from "@angular/common";
|
|
4
|
-
export declare class AutoFocusModule {
|
|
5
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<AutoFocusModule, never>;
|
|
6
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<AutoFocusModule, [typeof i1.AutoFocusDirective], [typeof i2.CommonModule], [typeof i1.AutoFocusDirective]>;
|
|
7
|
-
static ɵinj: i0.ɵɵInjectorDeclaration<AutoFocusModule>;
|
|
8
|
-
}
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
import * as i1 from "./autofocus.directive";
|
|
3
|
+
import * as i2 from "@angular/common";
|
|
4
|
+
export declare class AutoFocusModule {
|
|
5
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<AutoFocusModule, never>;
|
|
6
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<AutoFocusModule, [typeof i1.AutoFocusDirective], [typeof i2.CommonModule], [typeof i1.AutoFocusDirective]>;
|
|
7
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<AutoFocusModule>;
|
|
8
|
+
}
|
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
import { NgModule } from '@angular/core';
|
|
2
|
-
import { CommonModule } from '@angular/common';
|
|
3
|
-
import { AutoFocusDirective } from './autofocus.directive';
|
|
4
|
-
import * as i0 from "@angular/core";
|
|
5
|
-
export class AutoFocusModule {
|
|
6
|
-
}
|
|
7
|
-
AutoFocusModule.ɵfac = function AutoFocusModule_Factory(t) { return new (t || AutoFocusModule)(); };
|
|
8
|
-
AutoFocusModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: AutoFocusModule });
|
|
9
|
-
AutoFocusModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonModule] });
|
|
10
|
-
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AutoFocusModule, [{
|
|
11
|
-
type: NgModule,
|
|
12
|
-
args: [{
|
|
13
|
-
declarations: [AutoFocusDirective],
|
|
14
|
-
imports: [
|
|
15
|
-
CommonModule
|
|
16
|
-
],
|
|
17
|
-
exports: [AutoFocusDirective]
|
|
18
|
-
}]
|
|
19
|
-
}], null, null); })();
|
|
20
|
-
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(AutoFocusModule, { declarations: [AutoFocusDirective], imports: [CommonModule], exports: [AutoFocusDirective] }); })();
|
|
1
|
+
import { NgModule } from '@angular/core';
|
|
2
|
+
import { CommonModule } from '@angular/common';
|
|
3
|
+
import { AutoFocusDirective } from './autofocus.directive';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
export class AutoFocusModule {
|
|
6
|
+
}
|
|
7
|
+
AutoFocusModule.ɵfac = function AutoFocusModule_Factory(t) { return new (t || AutoFocusModule)(); };
|
|
8
|
+
AutoFocusModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: AutoFocusModule });
|
|
9
|
+
AutoFocusModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonModule] });
|
|
10
|
+
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AutoFocusModule, [{
|
|
11
|
+
type: NgModule,
|
|
12
|
+
args: [{
|
|
13
|
+
declarations: [AutoFocusDirective],
|
|
14
|
+
imports: [
|
|
15
|
+
CommonModule
|
|
16
|
+
],
|
|
17
|
+
exports: [AutoFocusDirective]
|
|
18
|
+
}]
|
|
19
|
+
}], null, null); })();
|
|
20
|
+
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(AutoFocusModule, { declarations: [AutoFocusDirective], imports: [CommonModule], exports: [AutoFocusDirective] }); })();
|
package/autofocus/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { AutoFocusDirective } from './autofocus.directive';
|
|
2
|
-
export { AutoFocusModule } from './autofocus.module';
|
|
1
|
+
export { AutoFocusDirective } from './autofocus.directive';
|
|
2
|
+
export { AutoFocusModule } from './autofocus.module';
|
package/autofocus/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { AutoFocusDirective } from './autofocus.directive';
|
|
2
|
-
export { AutoFocusModule } from './autofocus.module';
|
|
1
|
+
export { AutoFocusDirective } from './autofocus.directive';
|
|
2
|
+
export { AutoFocusModule } from './autofocus.module';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import * as i0 from "@angular/core";
|
|
2
|
-
export declare class CarouselSlideDirective {
|
|
3
|
-
snapAlign: 'none' | 'start' | 'end' | 'center';
|
|
4
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<CarouselSlideDirective, never>;
|
|
5
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<CarouselSlideDirective, "[nwCarouselSlide]", ["nw-carousel-slide"], { "snapAlign": "snapAlign"; }, {}, never, never, false>;
|
|
6
|
-
}
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
export declare class CarouselSlideDirective {
|
|
3
|
+
snapAlign: 'none' | 'start' | 'end' | 'center';
|
|
4
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<CarouselSlideDirective, never>;
|
|
5
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<CarouselSlideDirective, "[nwCarouselSlide]", ["nw-carousel-slide"], { "snapAlign": "snapAlign"; }, {}, never, never, false>;
|
|
6
|
+
}
|
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
import { Directive, Input, HostBinding } from '@angular/core';
|
|
2
|
-
import * as i0 from "@angular/core";
|
|
3
|
-
export class CarouselSlideDirective {
|
|
4
|
-
constructor() {
|
|
5
|
-
this.snapAlign = 'start';
|
|
6
|
-
}
|
|
7
|
-
}
|
|
8
|
-
CarouselSlideDirective.ɵfac = function CarouselSlideDirective_Factory(t) { return new (t || CarouselSlideDirective)(); };
|
|
9
|
-
CarouselSlideDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: CarouselSlideDirective, selectors: [["", "nwCarouselSlide", ""]], hostVars: 2, hostBindings: function CarouselSlideDirective_HostBindings(rf, ctx) { if (rf & 2) {
|
|
10
|
-
i0.ɵɵstyleProp("scroll-snap-align", ctx.snapAlign);
|
|
11
|
-
} }, inputs: { snapAlign: "snapAlign" }, exportAs: ["nw-carousel-slide"] });
|
|
12
|
-
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CarouselSlideDirective, [{
|
|
13
|
-
type: Directive,
|
|
14
|
-
args: [{
|
|
15
|
-
selector: '[nwCarouselSlide]',
|
|
16
|
-
exportAs: 'nw-carousel-slide'
|
|
17
|
-
}]
|
|
18
|
-
}], null, { snapAlign: [{
|
|
19
|
-
type: HostBinding,
|
|
20
|
-
args: ['style.scroll-snap-align']
|
|
21
|
-
}, {
|
|
22
|
-
type: Input
|
|
23
|
-
}] }); })();
|
|
1
|
+
import { Directive, Input, HostBinding } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export class CarouselSlideDirective {
|
|
4
|
+
constructor() {
|
|
5
|
+
this.snapAlign = 'start';
|
|
6
|
+
}
|
|
7
|
+
}
|
|
8
|
+
CarouselSlideDirective.ɵfac = function CarouselSlideDirective_Factory(t) { return new (t || CarouselSlideDirective)(); };
|
|
9
|
+
CarouselSlideDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: CarouselSlideDirective, selectors: [["", "nwCarouselSlide", ""]], hostVars: 2, hostBindings: function CarouselSlideDirective_HostBindings(rf, ctx) { if (rf & 2) {
|
|
10
|
+
i0.ɵɵstyleProp("scroll-snap-align", ctx.snapAlign);
|
|
11
|
+
} }, inputs: { snapAlign: "snapAlign" }, exportAs: ["nw-carousel-slide"] });
|
|
12
|
+
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CarouselSlideDirective, [{
|
|
13
|
+
type: Directive,
|
|
14
|
+
args: [{
|
|
15
|
+
selector: '[nwCarouselSlide]',
|
|
16
|
+
exportAs: 'nw-carousel-slide'
|
|
17
|
+
}]
|
|
18
|
+
}], null, { snapAlign: [{
|
|
19
|
+
type: HostBinding,
|
|
20
|
+
args: ['style.scroll-snap-align']
|
|
21
|
+
}, {
|
|
22
|
+
type: Input
|
|
23
|
+
}] }); })();
|