@justeattakeaway/pie-modal 0.29.0 → 0.30.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 +8 -62
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -14,10 +14,9 @@
|
|
|
14
14
|
2. [Installation](#installation)
|
|
15
15
|
3. [Importing the component](#importing-the-component)
|
|
16
16
|
4. [Peer Dependencies](#peer-dependencies)
|
|
17
|
-
5. [
|
|
18
|
-
6. [
|
|
19
|
-
7. [
|
|
20
|
-
8. [Legacy browser support](#legacy-browser-support)
|
|
17
|
+
5. [Props](#props)
|
|
18
|
+
6. [Legacy browser support](#legacy-browser-support)
|
|
19
|
+
7. [Contributing](#contributing)
|
|
21
20
|
|
|
22
21
|
|
|
23
22
|
## pie-modal
|
|
@@ -59,30 +58,6 @@ import { PieModal } from '@justeattakeaway/pie-modal/dist/react';
|
|
|
59
58
|
> When using `pie-modal`, you will also need to include a couple of dependencies to ensure the component renders as expected. See [the PIE Wiki](https://github.com/justeattakeaway/pie/wiki/Getting-started-with-PIE-Web-Components#expected-dependencies) for more information and how to include these in your application.
|
|
60
59
|
|
|
61
60
|
|
|
62
|
-
## Local development
|
|
63
|
-
|
|
64
|
-
Install the dependencies. Note that this, and the following commands below, should be run from the **root of the monorepo**:
|
|
65
|
-
|
|
66
|
-
```bash
|
|
67
|
-
yarn
|
|
68
|
-
```
|
|
69
|
-
|
|
70
|
-
To build the `pie-modal` package, run the following command:
|
|
71
|
-
|
|
72
|
-
```bash
|
|
73
|
-
yarn build --filter=pie-modal
|
|
74
|
-
```
|
|
75
|
-
|
|
76
|
-
If you'd like to develop using the component storybook, then you should build the component in `watch` mode, and run storybook in a separate terminal tab:
|
|
77
|
-
|
|
78
|
-
```bash
|
|
79
|
-
yarn watch --filter=pie-modal
|
|
80
|
-
|
|
81
|
-
# in a separate terminal tab, run
|
|
82
|
-
yarn dev --filter=pie-storybook
|
|
83
|
-
```
|
|
84
|
-
|
|
85
|
-
|
|
86
61
|
## Props
|
|
87
62
|
|
|
88
63
|
| Property | Type | Default | Description |
|
|
@@ -113,40 +88,6 @@ In your markup or JSX, you can then use these to set the properties for the `pie
|
|
|
113
88
|
<PieModal heading='My Awesome Heading' headingLevel='h3'>Click me!</PieModal>
|
|
114
89
|
```
|
|
115
90
|
|
|
116
|
-
## Testing
|
|
117
|
-
|
|
118
|
-
### Browser tests
|
|
119
|
-
|
|
120
|
-
To run the browser tests, run the following command from the root of the monorepo:
|
|
121
|
-
|
|
122
|
-
```bash
|
|
123
|
-
yarn test:browsers --filter=pie-modal
|
|
124
|
-
```
|
|
125
|
-
|
|
126
|
-
### Visual tests
|
|
127
|
-
|
|
128
|
-
To run the visual regression tests, run the following command from the root of the monorepo:
|
|
129
|
-
|
|
130
|
-
```bash
|
|
131
|
-
yarn test:visual --filter=pie-modal
|
|
132
|
-
```
|
|
133
|
-
|
|
134
|
-
Note: To run these locally, you will need to ensure that any environment variables required are set up on your machine to mirror those on CI (such as Percy tokens). How you achieve this will differ between operating systems.
|
|
135
|
-
|
|
136
|
-
#### Setup via bash
|
|
137
|
-
|
|
138
|
-
```bash
|
|
139
|
-
export PERCY_TOKEN_PIE_MODAL=abcde
|
|
140
|
-
```
|
|
141
|
-
|
|
142
|
-
#### Setup via package.json
|
|
143
|
-
|
|
144
|
-
Under scripts `test:visual` replace the environment variable with the below:
|
|
145
|
-
|
|
146
|
-
```bash
|
|
147
|
-
PERCY_TOKEN_PIE_MODAL=abcde
|
|
148
|
-
```
|
|
149
|
-
|
|
150
91
|
## Legacy browser support
|
|
151
92
|
|
|
152
93
|
`pie-modal` uses the Dialog element which might not be supported by legacy browsers.
|
|
@@ -159,3 +100,8 @@ The polyfill comes with a few limitations, as noted on its [documentation page](
|
|
|
159
100
|
- Changes to the CSS top/bottom values while open aren't retained
|
|
160
101
|
|
|
161
102
|
For more details, check the package documentation mentioned above.
|
|
103
|
+
|
|
104
|
+
|
|
105
|
+
## Contributing
|
|
106
|
+
|
|
107
|
+
Check out our [contributing guide](https://github.com/justeattakeaway/pie/wiki/Contributing-Guide) for more information on [local development](https://github.com/justeattakeaway/pie/wiki/Contributing-Guide#local-development) and how to run specific [component tests](https://github.com/justeattakeaway/pie/wiki/Contributing-Guide#testing).
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@justeattakeaway/pie-modal",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.30.0",
|
|
4
4
|
"description": "PIE design system modal built using web components",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -29,9 +29,9 @@
|
|
|
29
29
|
"license": "Apache-2.0",
|
|
30
30
|
"devDependencies": {
|
|
31
31
|
"@justeat/pie-design-tokens": "5.8.2",
|
|
32
|
-
"@justeattakeaway/pie-button": "0.
|
|
32
|
+
"@justeattakeaway/pie-button": "0.35.0",
|
|
33
33
|
"@justeattakeaway/pie-components-config": "0.4.0",
|
|
34
|
-
"@justeattakeaway/pie-icon-button": "0.
|
|
34
|
+
"@justeattakeaway/pie-icon-button": "0.19.0",
|
|
35
35
|
"@justeattakeaway/pie-icons-webc": "0.11.1",
|
|
36
36
|
"@justeattakeaway/pie-webc-core": "0.11.0",
|
|
37
37
|
"@types/body-scroll-lock": "3.1.1"
|