@primer/components 0.0.0-2021816225350 → 0.0.0-202181723821
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/CHANGELOG.md +3 -3
- package/dist/browser.esm.js +2 -2
- package/dist/browser.esm.js.map +1 -1
- package/dist/browser.umd.js +2 -2
- package/dist/browser.umd.js.map +1 -1
- package/lib/Dialog.js +2 -2
- package/lib-esm/Dialog.js +2 -2
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
# @primer/components
|
|
2
2
|
|
|
3
|
-
## 0.0.0-
|
|
3
|
+
## 0.0.0-202181723821
|
|
4
4
|
|
|
5
5
|
### Minor Changes
|
|
6
6
|
|
|
7
|
-
- [#1412](https://github.com/primer/react/pull/1412) [`
|
|
7
|
+
- [#1412](https://github.com/primer/react/pull/1412) [`627cd3e9`](https://github.com/primer/react/commit/627cd3e95614ab4347e5acf456dd23588196ec87) Thanks [@colebemis](https://github.com/colebemis)! - Add `dark_high_contrast` color scheme
|
|
8
8
|
|
|
9
|
-
* [#1412](https://github.com/primer/react/pull/1412) [`
|
|
9
|
+
* [#1412](https://github.com/primer/react/pull/1412) [`627cd3e9`](https://github.com/primer/react/commit/627cd3e95614ab4347e5acf456dd23588196ec87) Thanks [@colebemis](https://github.com/colebemis)! - Add new [functional color variables](https://primer.style/primitives/colors) to the theme object.
|
|
10
10
|
|
|
11
11
|
**Tip:** Install [`eslint-plugin-primer-react`](https://primer.style/react/linting) to ensure that you're not using any deprecated color variables.
|
|
12
12
|
|
package/dist/browser.esm.js
CHANGED
|
@@ -819,7 +819,7 @@ Za=en,function(){var e={}.hasOwnProperty;function r(){for(var t=[],o=0;o<argumen
|
|
|
819
819
|
max-height: 80vh;
|
|
820
820
|
z-index: 999;
|
|
821
821
|
margin: 10vh auto;
|
|
822
|
-
background-color: ${Cr("colors.
|
|
822
|
+
background-color: ${Cr("colors.canvas.default")};
|
|
823
823
|
width: ${e=>e.narrow?"320px":e.wide?"640px":"440px"};
|
|
824
824
|
outline: none;
|
|
825
825
|
|
|
@@ -855,7 +855,7 @@ Za=en,function(){var e={}.hasOwnProperty;function r(){for(var t=[],o=0;o<argumen
|
|
|
855
855
|
content: ' ';
|
|
856
856
|
background: transparent;
|
|
857
857
|
z-index: 99;
|
|
858
|
-
background: ${Cr("colors.
|
|
858
|
+
background: ${Cr("colors.primer.canvas.backdrop")};
|
|
859
859
|
}
|
|
860
860
|
`,Hn=i((({children:r,onDismiss:n=Nn,isOpen:i,initialFocusRef:d,returnFocusRef:l,...c},s)=>{const f=t(null),b=Oo(s),g=t(null),p=()=>{n(),l&&l.current&&l.current.focus()},{getDialogProps:u}=function({modalRef:e,overlayRef:r,isOpen:t,onDismiss:n=En,initialFocusRef:i,closeButtonRef:d}){const l=o((t=>{e.current&&r.current&&!e.current.contains(t.target)&&r.current.contains(t.target)&&n()}),[n,e,r]);a((()=>{if(t)return document.addEventListener("click",l),()=>{document.removeEventListener("click",l)}}),[t,l]),a((()=>{t&&(i&&i.current?i.current.focus():d&&d.current&&d.current.focus())}),[t,i,d]);const c=o(((r,t)=>{if(e.current){const o=Array.from(e.current.querySelectorAll("*")).filter(In);if(0===o.length)return;r.preventDefault();const a=document.activeElement;if(!a)return;const n=o.indexOf(a)+t,i=1===t?0:o.length-1;return o[n]||o[i]}}),[e]),s=o((e=>{const r=e.shiftKey?-1:1,t=c(e,r);t&&t.focus()}),[c]),f=o((e=>{switch(e.key){case"Tab":s(e);break;case"Escape":n(),e.stopPropagation()}}),[s,n]);return{getDialogProps:()=>({onKeyDown:f})}}({modalRef:b,onDismiss:p,isOpen:i,initialFocusRef:d,closeButtonRef:g,returnFocusRef:l,overlayRef:f});return i?e.createElement(e.Fragment,null,e.createElement(Rn,{ref:f}),e.createElement(An,Or({tabIndex:-1,ref:b,role:"dialog","aria-modal":"true"},c,u()),e.createElement(go,{ref:g,onClick:p,sx:{position:"absolute",top:"16px",right:"16px"}}),r)):null}));Ln.defaultProps={backgroundColor:"bg.tertiary"},Ln.propTypes={...tt.propTypes},Ln.displayName="Dialog.Header",Hn.displayName="Dialog";var On=Object.assign(Hn,{Header:Ln});var Pn=(e,r)=>({w:`\n top: 0;\n right: 100%;\n left: auto;\n width: auto;\n margin-top: 0;\n margin-right: 10px;\n\n &::before {\n top: 10px;\n right: -16px;\n left: auto;\n border-color: transparent;\n border-left-color: ${Cr("colors.border.default")(e)};\n }\n\n &::after {\n top: 11px;\n right: -14px;\n left: auto;\n border-color: transparent;\n border-left-color: ${Cr("colors.border.default")(e)};\n }\n `,e:`\n top: 0;\n left: 100%;\n width: auto;\n margin-top: 0;\n margin-left: 10px;\n\n &::before {\n top: 10px;\n left: -16px;\n border-color: transparent;\n border-right-color: ${Cr("colors.border.default")(e)};\n }\n\n &::after {\n top: 11px;\n left: -14px;\n border-color: transparent;\n border-right-color: ${Cr("colors.border.default")(e)};\n }\n `,ne:`\n top: auto;\n bottom: 100%;\n left: 0;\n margin-bottom: 3px;\n\n &::before,\n &::after {\n top: auto;\n right: auto;\n }\n\n &::before {\n bottom: -8px;\n left: 9px;\n border-top: 8px solid ${Cr("colors.border.default")(e)};\n border-bottom: 0;\n border-left: 8px solid transparent;\n }\n\n &::after {\n bottom: -7px;\n left: 10px;\n border-top: 7px solid ${Cr("colors.border.default")(e)};\n border-right: 7px solid transparent;\n border-bottom: 0;\n border-left: 7px solid transparent;\n }\n `,s:"\n right: 50%;\n left: auto;\n transform: translateX(50%);\n\n &::before {\n top: -16px;\n right: 50%;\n transform: translateX(50%);\n }\n\n &::after {\n top: -14px;\n right: 50%;\n transform: translateX(50%);\n }\n ",sw:"\n right: 0;\n left: auto;\n\n &::before {\n top: -16px;\n right: 9px;\n left: auto;\n }\n\n &::after {\n top: -14px;\n right: 10px;\n left: auto;\n }\n ",se:"\n &::before {\n top: -16px;\n left: 9px;\n }\n\n &::after {\n top: -14px;\n left: 10px;\n }\n "}[r]);const Mn=s(Tn)`
|
|
861
861
|
position: relative;
|