@justeattakeaway/pie-modal 0.16.0 → 0.17.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/.eslintignore CHANGED
@@ -3,4 +3,3 @@ dist
3
3
  node_modules
4
4
  lit-browsers-report
5
5
  lit-visual-report
6
- test-results
@@ -1,14 +1,14 @@
1
- [3:36:05 PM] @custom-elements-manifest/analyzer: Created new manifest.
1
+ [3:19:34 PM] @custom-elements-manifest/analyzer: Created new manifest.
2
2
  react wrapper has been added!
3
3
  vite v4.3.9 building for production...
4
4
  transforming...
5
- ✓ 27 modules transformed.
5
+ ✓ 28 modules transformed.
6
6
  rendering chunks...
7
7
  computing gzip size...
8
- dist/index.js 54.46 kB │ gzip: 14.59 kB
9
8
  dist/react.js 59.27 kB │ gzip: 15.99 kB
9
+ dist/index.js 70.71 kB │ gzip: 19.04 kB
10
10
  
11
11
  [vite:dts] Start generate declaration files...
12
- ✓ built in 41.09s
13
- [vite:dts] Declaration files built in 35252ms.
12
+ ✓ built in 12.06s
13
+ [vite:dts] Declaration files built in 10809ms.
14
14
  
package/CHANGELOG.md CHANGED
@@ -1,5 +1,15 @@
1
1
  # @justeattakeaway/pie-modal
2
2
 
3
+ ## 0.17.0
4
+
5
+ ### Minor Changes
6
+
7
+ - - [Changed] - updated Modal component dependencies adding the `dialog-polyfill` package ([#678](https://github.com/justeattakeaway/pie/pull/678)) by [@fernandofranca](https://github.com/fernandofranca)
8
+
9
+ - [Changed] - updated Modal component to use `dialog-polyfill`
10
+ - [Changed] - updated Modal documentation regarding the legacy browser support for Dialog element and polyfill usage and limitations
11
+ - [Changed] - vanilla example app for testing Modal with `dialog-polyfill`
12
+
3
13
  ## 0.16.0
4
14
 
5
15
  ### Minor Changes
package/README.md CHANGED
@@ -15,6 +15,7 @@
15
15
  3. [Importing the component](#importing-the-component)
16
16
  4. [Props](#props)
17
17
  5. [Testing](#testing)
18
+ 5. [Legacy browser support](#legacy-browser-support)
18
19
 
19
20
  # pie-modal
20
21
 
@@ -118,3 +119,16 @@ Under scripts `test:visual` replace the environment variable with the below:
118
119
  ```bash
119
120
  PERCY_TOKEN_PIE_MODAL=abcde
120
121
  ```
122
+
123
+ ## Legacy browser support
124
+
125
+ `pie-modal` uses the Dialog element which might not be supported by legacy browsers.
126
+
127
+ To support them, `pie-modal` uses the [dialog-polyfill](https://github.com/GoogleChrome/dialog-polyfill) package. It works automatically and doesn't need any setup.
128
+
129
+ The polyfill comes with a few limitations, as noted on its [documentation page](https://github.com/GoogleChrome/dialog-polyfill#limitations):
130
+ - Dialogs should not be contained by parents that create a stacking context
131
+ - The browser's chrome may not always be accessible via the tab key
132
+ - Changes to the CSS top/bottom values while open aren't retained
133
+
134
+ For more details, check the package documentation mentioned above.