@primer/components 0.0.0-2021103211630 → 0.0.0-202110322927

package/CHANGELOG.md

@@ -1,10 +1,10 @@
 # @primer/components
 
-## 0.0.0-2021103211630
+## 0.0.0-202110322927
 
 ### Major Changes
 
-- [#1569](https://github.com/primer/react/pull/1569) [`dc113234`](https://github.com/primer/react/commit/dc113234038b94ba635f0055b19b1cac4d29e17b) Thanks [@jfuchs](https://github.com/jfuchs)! - Pagination no longer accepts styled-system props. Please use the `sx` prop to extend Primer component styling instead. See also https://primer.style/react/overriding-styles for information about `sx` and https://primer.style/react/system-props for context on the removal.
+- [#1572](https://github.com/primer/react/pull/1572) [`7c63d566`](https://github.com/primer/react/commit/7c63d5666ee472c9eb8669a1f2138f788f8ea95e) Thanks [@jfuchs](https://github.com/jfuchs)! - SideNav no longer accepts styled-system props. Please use the `sx` prop to extend Primer component styling instead. See also https://primer.style/react/overriding-styles for information about `sx` and https://primer.style/react/system-props for context on the removal.
 
 ### Minor Changes
 

package/dist/browser.esm.js

@@ -1297,6 +1297,8 @@ import e,{useState as t,useRef as r,useCallback as o,useEffect as a,useMemo as n
       );
     }
   }
+
+  ${It};
 `;function Di({theme:t,pageCount:r,currentPage:o,onPageChange:a,hrefBuilder:n,marginPageCount:i,showPages:l,surroundingPageCount:d}){const s=e.useCallback((e=>t=>a(t,e)),[a]),c=e.useMemo((()=>function(e,t,r,o,a){const n=[];if(r){const r=[],i=t=>{t>=1&&t<=e&&r.push(t)};let l=t-a,d=t+a;if(l<1&&d>e)l=1,d=e;else if(l<1)for(;l<1;)l++,d++;else if(d>e)for(;d>e;)l--,d--;for(let t=1;t<=o;t++){const r=t,o=e-(t-1);r>=l?d++:i(r),o<=d?l--:i(o)}for(let e=l;e<=d;e++)i(e);const s=r.slice().sort(((e,t)=>e-t)).filter(((e,t,r)=>!t||e!==r[t-1]));for(let e=0;e<s.length;e++){const r=s[e],o=r===t;0===e?(1!==r&&n.push({type:"BREAK",num:1}),n.push({type:"NUM",num:r,selected:o})):(1==r-s[e-1]||n.push({type:"BREAK",num:r-1}),n.push({type:"NUM",num:r,selected:o}))}const c=n[n.length-1];"NUM"===c.type&&c.num!==e&&n.push({type:"BREAK",num:e})}const i={type:"NEXT",num:t+1,disabled:t===e};return[{type:"PREV",num:t-1,disabled:1===t},...n,i]}(r,o,!!l,i,d)),[r,o,l,i,d]);return e.useMemo((()=>c.map((r=>{const{props:o,key:a,content:i}=function(e,t,r){const o={};let a="",n="";switch(e.type){case"PREV":n="page-prev",a="Previous",e.disabled?Object.assign(o,{as:"span","aria-disabled":"true"}):Object.assign(o,{rel:"prev",href:t(e.num),"aria-label":"Previous Page",onClick:r});break;case"NEXT":n="page-next",a="Next",e.disabled?Object.assign(o,{as:"span","aria-disabled":"true"}):Object.assign(o,{rel:"next",href:t(e.num),"aria-label":"Next Page",onClick:r});break;case"NUM":n=`page-${e.num}`,a=String(e.num),e.selected?Object.assign(o,{as:"em","aria-current":"page"}):Object.assign(o,{href:t(e.num),"aria-label":`Page ${e.num}`,onClick:r});break;case"BREAK":n=`page-${e.num}-break`,a="…",Object.assign(o,{as:"span","aria-disabled":!0})}return{props:o,key:n,content:a}}(r,n,s(r.num));return e.createElement(Hi,Pt({},o,{key:a,theme:t}),i)}))),[c,n,s,t])}const Wi=f.nav`
   margin-top: 20px;
   margin-bottom: 15px;
@@ -1594,12 +1596,11 @@ import e,{useState as t,useRef as r,useCallback as o,useEffect as a,useMemo as n
   ${"\n  // Remove marker added by the display: list-item browser default\n  > summary {\n    list-style: none;\n  }\n  // Remove marker added by details polyfill\n  > summary::before {\n    display: none;\n  }\n  // Remove marker added by Chrome\n  > summary::-webkit-details-marker {\n    display: none;\n  }\n"}
   ${It}
   ${rr};
-`,Vl=e.forwardRef((({children:n,initialTab:i="",as:l,...d},s)=>{const c=r(null),f=null!=s?s:c,[g,u]=t(i),[p,b]=t(!1),m={selectedTab:g,setSelectedTab:u,setOpen:b,open:p,initialTab:i},h=o((e=>{"current"in f&&f.current&&!f.current.contains(e.target)&&(e.defaultPrevented||b(!1))}),[f,b]);return a((()=>{if(p)return document.addEventListener("click",h),()=>{document.removeEventListener("click",h)}}),[p,h]),Zi(f,p,b),e.createElement(Qi.Provider,{value:m},e.createElement(Gl,Pt({ref:f},d,{open:p,onToggle:function(e){b(e.target.open)}}),n))}));Vl.displayName="SelectMenu";var Kl=Object.assign(Vl,{MenuContext:Qi,List:xl,Divider:rl,Filter:nl,Footer:dl,Item:ml,Modal:Rl,Tabs:Ul,Tab:Pl,TabPanel:Wl,Header:gl,LoadingAnimation:Sl});function ql({variant:t,className:r,bordered:o,children:a,...n}){const i=en(r,`variant-${"lightweight"===t?"lightweight":"normal"}`);return o||(n={...n,borderWidth:0}),e.createElement(or,Pt({borderWidth:"1px",borderStyle:"solid",borderColor:"border.default",borderRadius:2,as:"nav",className:i},n),a)}ql.displayName="SideNavBase";const Xl=f(ql)`
+`,Vl=e.forwardRef((({children:n,initialTab:i="",as:l,...d},s)=>{const c=r(null),f=null!=s?s:c,[g,u]=t(i),[p,b]=t(!1),m={selectedTab:g,setSelectedTab:u,setOpen:b,open:p,initialTab:i},h=o((e=>{"current"in f&&f.current&&!f.current.contains(e.target)&&(e.defaultPrevented||b(!1))}),[f,b]);return a((()=>{if(p)return document.addEventListener("click",h),()=>{document.removeEventListener("click",h)}}),[p,h]),Zi(f,p,b),e.createElement(Qi.Provider,{value:m},e.createElement(Gl,Pt({ref:f},d,{open:p,onToggle:function(e){b(e.target.open)}}),n))}));Vl.displayName="SelectMenu";var Kl=Object.assign(Vl,{MenuContext:Qi,List:xl,Divider:rl,Filter:nl,Footer:dl,Item:ml,Modal:Rl,Tabs:Ul,Tab:Pl,TabPanel:Wl,Header:gl,LoadingAnimation:Sl});function ql({variant:t,className:r,bordered:o,children:a}){const n=en(r,`variant-${"lightweight"===t?"lightweight":"normal"}`);return e.createElement(or,{borderWidth:o?"1px":0,borderStyle:"solid",borderColor:"border.default",borderRadius:2,as:"nav",className:n},a)}ql.displayName="SideNavBase";const Xl=f(ql)`
   background-color: ${Nt("colors.canvas.subtle")};
 
   ${e=>e.bordered&&p(["& > &{border-left:0;border-right:0;border-bottom:0;}"])}
 
-  ${It};
   ${rr};
 `,Yl=p(["background-color:",";outline:none;text-decoration:none;"],Nt("colors.neutral.subtle")),Jl=p(["color:",";text-decoration:none;outline:none;"],Nt("colors.fg.default")),Zl=f(Mi).attrs((e=>"string"==typeof e.to||e.selected?{"aria-current":"page"}:{}))`
   position: relative;