@primer/react 38.25.0-rc.d231face6 → 38.25.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.
Files changed (11) hide show
  1. package/CHANGELOG.md +2 -0
  2. package/dist/AnchoredOverlay/AnchoredOverlay-d483d670.css +2 -0
  3. package/dist/AnchoredOverlay/AnchoredOverlay-d483d670.css.map +1 -0
  4. package/dist/AnchoredOverlay/AnchoredOverlay.module.css.js +1 -1
  5. package/dist/Overlay/{Overlay-95cfd3c7.css → Overlay-214d10dd.css} +2 -2
  6. package/dist/Overlay/Overlay-214d10dd.css.map +1 -0
  7. package/dist/Overlay/Overlay.module.css.js +1 -1
  8. package/package.json +1 -1
  9. package/dist/AnchoredOverlay/AnchoredOverlay-ec9e15fc.css +0 -2
  10. package/dist/AnchoredOverlay/AnchoredOverlay-ec9e15fc.css.map +0 -1
  11. package/dist/Overlay/Overlay-95cfd3c7.css.map +0 -1
package/CHANGELOG.md CHANGED
@@ -8,6 +8,8 @@
8
8
 
9
9
  ### Patch Changes
10
10
 
11
+ - [#7858](https://github.com/primer/react/pull/7858) [`1ce2906`](https://github.com/primer/react/commit/1ce2906d1816ba443eacfede67d496d074b8d2fb) Thanks [@TylerJDev](https://github.com/TylerJDev)! - AnchoredOverlay: Add additional fallbacks for CSS Anchor Positioning
12
+
11
13
  - [#7843](https://github.com/primer/react/pull/7843) [`fc571fd`](https://github.com/primer/react/commit/fc571fd8c3899f19a1dd9e77b8a22f6528d776e2) Thanks [@joshblack](https://github.com/joshblack)! - Update useMergedRefs so that in React 18 no warning is emitted
12
14
 
13
15
  ## 38.24.0
package/dist/AnchoredOverlay/AnchoredOverlay-d483d670.css ADDED
@@ -0,0 +1,2 @@
1
+ .prc-AnchoredOverlay-ResponsiveCloseButtonContainer-nuium{position:relative}.prc-AnchoredOverlay-ResponsiveCloseButton-z-2rx{display:none;position:absolute;right:var(--base-size-8,.5rem);top:var(--base-size-8,.5rem)}@media screen and (max-width:calc(48rem - 0.02px)){.prc-AnchoredOverlay-ResponsiveCloseButton-z-2rx{display:inline-grid}}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z{position-try-fallbacks:flip-block,flip-inline,flip-block flip-inline,--inline-end-center,--inline-start-center,--fit-block-bottom,--fit-block-top;position-visibility:anchors-visible;position:fixed!important;z-index:100}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[popover]{border:0;inset:auto;margin:0;max-width:none;padding:0}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-bottom]{left:anchor(left);top:calc(anchor(bottom) + var(--base-size-4,.25rem))}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-bottom][data-align=left]{left:auto;right:calc(anchor(right) - var(--anchored-overlay-anchor-offset-left))}@media screen and (max-width:calc(48rem - 0.02px)){.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-bottom][data-align=left][data-responsive=fullscreen]{right:auto}}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-bottom][data-align=right]{left:calc(anchor(left) - var(--anchored-overlay-anchor-offset-right))}@media screen and (max-width:calc(48rem - 0.02px)){.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-bottom][data-align=right][data-responsive=fullscreen]{left:auto}}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-top]{bottom:anchor(top);left:anchor(left);margin-bottom:var(--base-size-4,.25rem)}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-top][data-align=left]{left:auto;right:anchor(right)}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-top][data-align=right]{left:calc(anchor(left) - var(--anchored-overlay-anchor-offset-right))}@media screen and (max-width:calc(48rem - 0.02px)){.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-top][data-align=right][data-responsive=fullscreen]{left:auto}}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-left]{margin-right:var(--base-size-4,.25rem);right:anchor(left);top:var(--anchored-overlay-top-override,anchor(top));position-try-fallbacks:flip-inline,flip-block,flip-start,--outside-left-to-bottom}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-right]{left:anchor(right);margin-left:var(--base-size-4,.25rem);top:var(--anchored-overlay-top-override,anchor(top));position-try-fallbacks:flip-inline,flip-block,flip-start,--outside-right-to-bottom}@position-try --outside-left-to-bottom{margin:0;right:anchor(right);top:calc(anchor(bottom) + var(--base-size-4,.25rem));width:auto}@position-try --outside-right-to-bottom{left:anchor(left);margin:0;top:calc(anchor(bottom) + var(--base-size-4,.25rem));width:auto}@position-try --inline-end-center{align-self:anchor-center;bottom:auto;left:anchor(right);margin-left:var(--base-size-4,.25rem);top:auto}@position-try --inline-start-center{align-self:anchor-center;bottom:auto;left:auto;margin-right:var(--base-size-4,.25rem);right:anchor(left);top:auto}@position-try --fit-block-bottom{bottom:var(--base-size-8,.5rem);height:auto;max-height:none;top:calc(anchor(bottom) + var(--base-size-4,.25rem))}@position-try --fit-block-top{bottom:calc(100vh - anchor(top) + var(--base-size-4,.25rem));height:auto;max-height:none;top:var(--base-size-8,.5rem)}
2
+ /*# sourceMappingURL=AnchoredOverlay-d483d670.css.map */
package/dist/AnchoredOverlay/AnchoredOverlay-d483d670.css.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/AnchoredOverlay/AnchoredOverlay.module.css.js"],"names":[],"mappings":"AAAA,0DACE,iBACF,CAEA,iDAIE,YAAa,CAHb,iBAAkB,CAElB,8BAAyB,CADzB,4BAOF,CAHE,mDANF,iDAOI,mBAEJ,CADE,CAGF,2CACE,iJAOiB,CACjB,mCAAoC,CAEpC,wBAA0B,CAD1B,WAgFF,CA7EE,oDAIE,QAAS,CAHT,UAAW,CACX,QAAS,CAGT,cAAe,CAFf,SAGF,CAEA,qEAGE,iBAAkB,CADlB,oDAuBF,CApBE,sFACE,SAAU,CACV,sEAOF,CAJI,mDADF,kHAEI,UAEJ,CADE,CAIJ,uFACE,qEAOF,CAJI,mDADF,mHAEI,SAEJ,CADE,CAKN,kEAEE,kBAAmB,CACnB,iBAAkB,CAFlB,uCAkBF,CAdE,mFACE,SAAU,CACV,mBACF,CAEA,oFACE,qEAOF,CAJI,mDADF,gHAEI,SAEJ,CADE,CAKN,mEAWE,sCAAgC,CAVhC,kBAAmB,CASnB,oDAAsD,CAEtD,iFACF,CAEA,oEACE,kBAAmB,CAEnB,qCAA+B,CAD/B,oDAAsD,CAEtD,kFACF,CAGF,uCAGE,QAAS,CAFT,mBAAoB,CACpB,oDAA8C,CAE9C,UACF,CAEA,wCACE,iBAAkB,CAElB,QAAS,CADT,oDAA8C,CAE9C,UACF,CAEA,kCAKE,wBAAyB,CAFzB,WAAY,CAFZ,kBAAmB,CAGnB,qCAA+B,CAF/B,QAIF,CAEA,oCAME,wBAAyB,CAFzB,WAAY,CAFZ,SAAU,CAGV,sCAAgC,CAJhC,kBAAmB,CAEnB,QAIF,CAEA,iCAEE,+BAA0B,CAC1B,WAAY,CACZ,eAAgB,CAHhB,oDAIF,CAEA,8BAEE,4DAAsD,CACtD,WAAY,CACZ,eAAgB,CAHhB,4BAIF","file":"AnchoredOverlay-d483d670.css","sourcesContent":[".ResponsiveCloseButtonContainer {\n position: relative;\n}\n\n.ResponsiveCloseButton {\n position: absolute;\n top: var(--base-size-8);\n right: var(--base-size-8);\n display: none;\n\n @media screen and (--viewportRange-narrow) {\n display: inline-grid;\n }\n}\n\n.AnchoredOverlay {\n position-try-fallbacks:\n flip-block,\n flip-inline,\n flip-block flip-inline,\n --inline-end-center,\n --inline-start-center,\n --fit-block-bottom,\n --fit-block-top;\n position-visibility: anchors-visible;\n z-index: 100;\n position: fixed !important;\n\n &[popover] {\n inset: auto;\n margin: 0;\n padding: 0;\n border: 0;\n max-width: none;\n }\n\n &[data-side='outside-bottom'] {\n /* stylelint-disable primer/spacing */\n top: calc(anchor(bottom) + var(--base-size-4));\n left: anchor(left);\n\n &[data-align='left'] {\n left: auto;\n right: calc(anchor(right) - var(--anchored-overlay-anchor-offset-left));\n /* stylelint-disable max-nesting-depth */\n &[data-responsive='fullscreen'] {\n @media screen and (--viewportRange-narrow) {\n right: auto;\n }\n }\n }\n\n &[data-align='right'] {\n left: calc(anchor(left) - var(--anchored-overlay-anchor-offset-right));\n\n &[data-responsive='fullscreen'] {\n @media screen and (--viewportRange-narrow) {\n left: auto;\n }\n }\n }\n }\n\n &[data-side='outside-top'] {\n margin-bottom: var(--base-size-4);\n bottom: anchor(top);\n left: anchor(left);\n\n &[data-align='left'] {\n left: auto;\n right: anchor(right);\n }\n\n &[data-align='right'] {\n left: calc(anchor(left) - var(--anchored-overlay-anchor-offset-right));\n\n &[data-responsive='fullscreen'] {\n @media screen and (--viewportRange-narrow) {\n left: auto;\n }\n }\n }\n }\n\n &[data-side='outside-left'] {\n right: anchor(left);\n /* Falls back to `anchor(top)` when JS hasn't overridden it. JS sets the\n override when the overlay's bottom would overflow the viewport so we\n can lift it up to keep the bottom edge on screen, mirroring the JS\n anchored-positioning code path.\n\n This override only applies when CSS cannot find space using the default position -\n or any of its defined fallbacks.\n */\n top: var(--anchored-overlay-top-override, anchor(top));\n margin-right: var(--base-size-4);\n position-try-fallbacks: flip-inline, flip-block, flip-start, --outside-left-to-bottom;\n }\n\n &[data-side='outside-right'] {\n left: anchor(right);\n top: var(--anchored-overlay-top-override, anchor(top));\n margin-left: var(--base-size-4);\n position-try-fallbacks: flip-inline, flip-block, flip-start, --outside-right-to-bottom;\n }\n}\n\n@position-try --outside-left-to-bottom {\n right: anchor(right);\n top: calc(anchor(bottom) + var(--base-size-4));\n margin: 0;\n width: auto;\n}\n\n@position-try --outside-right-to-bottom {\n left: anchor(left);\n top: calc(anchor(bottom) + var(--base-size-4));\n margin: 0;\n width: auto;\n}\n\n@position-try --inline-end-center {\n left: anchor(right);\n top: auto;\n bottom: auto;\n margin-left: var(--base-size-4);\n align-self: anchor-center;\n}\n\n@position-try --inline-start-center {\n right: anchor(left);\n left: auto;\n top: auto;\n bottom: auto;\n margin-right: var(--base-size-4);\n align-self: anchor-center;\n}\n\n@position-try --fit-block-bottom {\n top: calc(anchor(bottom) + var(--base-size-4));\n bottom: var(--base-size-8);\n height: auto;\n max-height: none;\n}\n\n@position-try --fit-block-top {\n top: var(--base-size-8);\n bottom: calc(100vh - anchor(top) + var(--base-size-4));\n height: auto;\n max-height: none;\n}\n"]}
package/dist/AnchoredOverlay/AnchoredOverlay.module.css.js CHANGED
@@ -1,4 +1,4 @@
1
- import './AnchoredOverlay-ec9e15fc.css';
1
+ import './AnchoredOverlay-d483d670.css';
2
2
 
3
3
  var classes = {"ResponsiveCloseButtonContainer":"prc-AnchoredOverlay-ResponsiveCloseButtonContainer-nuium","ResponsiveCloseButton":"prc-AnchoredOverlay-ResponsiveCloseButton-z-2rx","AnchoredOverlay":"prc-AnchoredOverlay-AnchoredOverlay-fYg9Z"};
4
4
 
package/dist/Overlay/{Overlay-95cfd3c7.css → Overlay-214d10dd.css} RENAMED
@@ -1,2 +1,2 @@
1
- @keyframes prc-Overlay-overlay-appear-JpFey{0%{opacity:0}to{opacity:1}}.prc-Overlay-Overlay-jfs-T{background-color:var(--overlay-bgColor,#fff);border-radius:var(--borderRadius-large,.75rem);box-shadow:var(--shadow-floating-small,0 0 0 1px #d1d9e080,0 6px 12px -3px #25292e0a,0 6px 18px 0 #25292e1f);height:auto;max-height:100vh;max-width:calc(100vw - 2rem);min-width:192px;overflow:auto;position:absolute;width:auto}.prc-Overlay-Overlay-jfs-T:not([data-anchor-position]):not([data-variant=modal]),.prc-Overlay-Overlay-jfs-T[data-anchor-position=false]{bottom:var(--bottom,auto);right:var(--right,auto)}@media screen and (max-width:calc(48rem - 0.02px)){[data-responsive=fullscreen]:is(.prc-Overlay-Overlay-jfs-T[data-anchor-position=false],.prc-Overlay-Overlay-jfs-T:not([data-anchor-position]):not([data-variant=modal])):not([data-variant]){left:0;top:0}}:is(.prc-Overlay-Overlay-jfs-T[data-anchor-position=false],.prc-Overlay-Overlay-jfs-T:not([data-anchor-position]):not([data-variant=modal])):not([data-variant]){left:var(--left,auto);top:var(--top,auto)}.prc-Overlay-Overlay-jfs-T:focus{outline:none}@media (forced-colors:active){.prc-Overlay-Overlay-jfs-T{outline:1px solid transparent}}.prc-Overlay-Overlay-jfs-T:where([data-reflow-container=true]){max-width:calc(100vw - 2rem)}.prc-Overlay-Overlay-jfs-T:where([data-overflow-auto]){overflow:auto}.prc-Overlay-Overlay-jfs-T:where([data-overflow-hidden]){overflow:hidden}.prc-Overlay-Overlay-jfs-T:where([data-overflow-scroll]){overflow:scroll}.prc-Overlay-Overlay-jfs-T:where([data-overflow-visible]){overflow:visible}.prc-Overlay-Overlay-jfs-T:where([data-height-xsmall]){height:192px}.prc-Overlay-Overlay-jfs-T:where([data-height-small]){height:256px}.prc-Overlay-Overlay-jfs-T:where([data-height-medium]){height:320px}.prc-Overlay-Overlay-jfs-T:where([data-height-large]){height:432px}.prc-Overlay-Overlay-jfs-T:where([data-height-xlarge]){height:600px}.prc-Overlay-Overlay-jfs-T:where([data-height-auto]),.prc-Overlay-Overlay-jfs-T:where([data-height-initial]){height:auto}.prc-Overlay-Overlay-jfs-T:where([data-height-fit-content]){height:-moz-fit-content;height:fit-content}.prc-Overlay-Overlay-jfs-T:where([data-max-height-xsmall]){max-height:min(192px,100vh)}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-max-height-xsmall]){max-height:min(192px,100dvh)}}.prc-Overlay-Overlay-jfs-T:where([data-max-height-small]){max-height:min(256px,100vh)}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-max-height-small]){max-height:min(256px,100dvh)}}.prc-Overlay-Overlay-jfs-T:where([data-max-height-medium]){max-height:min(320px,100vh)}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-max-height-medium]){max-height:min(320px,100dvh)}}.prc-Overlay-Overlay-jfs-T:where([data-max-height-large]){max-height:min(432px,100vh)}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-max-height-large]){max-height:min(432px,100dvh)}}.prc-Overlay-Overlay-jfs-T:where([data-max-height-xlarge]){max-height:min(600px,100vh)}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-max-height-xlarge]){max-height:min(600px,100dvh)}}.prc-Overlay-Overlay-jfs-T:where([data-max-height-fit-content]){max-height:-moz-fit-content;max-height:fit-content}.prc-Overlay-Overlay-jfs-T:where([data-width-small]){width:256px}.prc-Overlay-Overlay-jfs-T:where([data-width-medium]){width:320px}.prc-Overlay-Overlay-jfs-T:where([data-width-large]){width:480px}.prc-Overlay-Overlay-jfs-T:where([data-width-xlarge]){width:640px}.prc-Overlay-Overlay-jfs-T:where([data-width-xxlarge]){width:960px}.prc-Overlay-Overlay-jfs-T:where([data-width-auto]){width:auto}.prc-Overlay-Overlay-jfs-T:where([data-max-width-small]){max-width:256px}.prc-Overlay-Overlay-jfs-T:where([data-max-width-medium]){max-width:320px}.prc-Overlay-Overlay-jfs-T:where([data-max-width-large]){max-width:480px}.prc-Overlay-Overlay-jfs-T:where([data-max-width-xlarge]){max-width:640px}.prc-Overlay-Overlay-jfs-T:where([data-max-width-xxlarge]){max-width:960px}.prc-Overlay-Overlay-jfs-T:where([data-visibility-visible]){visibility:visible}.prc-Overlay-Overlay-jfs-T:where([data-visibility-hidden]){visibility:hidden}@media screen and (max-width:calc(48rem - 0.02px)){.prc-Overlay-Overlay-jfs-T:where([data-responsive=fullscreen]),.prc-Overlay-Overlay-jfs-T[data-responsive=fullscreen][data-anchor-position=true]{border-radius:unset;height:100vh;left:0;margin:0;max-height:none;max-width:none;padding-bottom:env(safe-area-inset-bottom);position:fixed;top:0;width:100vw}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-responsive=fullscreen]),.prc-Overlay-Overlay-jfs-T[data-responsive=fullscreen][data-anchor-position=true]{height:100dvh}}}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-variant=fullscreen]){height:100dvh}}@media (prefers-reduced-motion:no-preference){.prc-Overlay-Overlay-jfs-T{animation:prc-Overlay-overlay-appear-JpFey .2s cubic-bezier(.33,1,.68,1)}}
2
- /*# sourceMappingURL=Overlay-95cfd3c7.css.map */
1
+ @keyframes prc-Overlay-overlay-appear-JpFey{0%{opacity:0}to{opacity:1}}.prc-Overlay-Overlay-jfs-T{background-color:var(--overlay-bgColor,#fff);border-radius:var(--borderRadius-large,.75rem);box-shadow:var(--shadow-floating-small,0 0 0 1px #d1d9e080,0 6px 12px -3px #25292e0a,0 6px 18px 0 #25292e1f);height:auto;max-height:100vh;max-width:calc(100vw - 2rem);min-width:192px;overflow:auto;position:absolute;width:auto}.prc-Overlay-Overlay-jfs-T:not([data-anchor-position]):not([data-variant=modal]),.prc-Overlay-Overlay-jfs-T[data-anchor-position=false]{bottom:var(--bottom,auto);right:var(--right,auto)}@media screen and (max-width:calc(48rem - 0.02px)){[data-responsive=fullscreen]:is(.prc-Overlay-Overlay-jfs-T[data-anchor-position=false],.prc-Overlay-Overlay-jfs-T:not([data-anchor-position]):not([data-variant=modal])):not([data-variant]){left:0;top:0}}:is(.prc-Overlay-Overlay-jfs-T[data-anchor-position=false],.prc-Overlay-Overlay-jfs-T:not([data-anchor-position]):not([data-variant=modal])):not([data-variant]){left:var(--left,auto);top:var(--top,auto)}.prc-Overlay-Overlay-jfs-T:focus{outline:none}@media (forced-colors:active){.prc-Overlay-Overlay-jfs-T{outline:1px solid transparent}}.prc-Overlay-Overlay-jfs-T:where([data-reflow-container=true]){max-width:calc(100vw - 2rem)}.prc-Overlay-Overlay-jfs-T:where([data-overflow-auto]){overflow:auto}.prc-Overlay-Overlay-jfs-T:where([data-overflow-hidden]){overflow:hidden}.prc-Overlay-Overlay-jfs-T:where([data-overflow-scroll]){overflow:scroll}.prc-Overlay-Overlay-jfs-T:where([data-overflow-visible]){overflow:visible}.prc-Overlay-Overlay-jfs-T:where([data-height-xsmall]){height:192px}.prc-Overlay-Overlay-jfs-T:where([data-height-small]){height:256px}.prc-Overlay-Overlay-jfs-T:where([data-height-medium]){height:320px}.prc-Overlay-Overlay-jfs-T:where([data-height-large]){height:432px}.prc-Overlay-Overlay-jfs-T:where([data-height-xlarge]){height:600px}.prc-Overlay-Overlay-jfs-T:where([data-height-auto]),.prc-Overlay-Overlay-jfs-T:where([data-height-initial]){height:auto}.prc-Overlay-Overlay-jfs-T:where([data-height-fit-content]){height:-moz-fit-content;height:fit-content}.prc-Overlay-Overlay-jfs-T:where([data-max-height-xsmall]){max-height:min(192px,100vh)}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-max-height-xsmall]){max-height:min(192px,100dvh)}}.prc-Overlay-Overlay-jfs-T:where([data-max-height-small]){max-height:min(256px,100vh)}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-max-height-small]){max-height:min(256px,100dvh)}}.prc-Overlay-Overlay-jfs-T:where([data-max-height-medium]){max-height:min(320px,100vh)}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-max-height-medium]){max-height:min(320px,100dvh)}}.prc-Overlay-Overlay-jfs-T:where([data-max-height-large]){max-height:min(432px,100vh)}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-max-height-large]){max-height:min(432px,100dvh)}}.prc-Overlay-Overlay-jfs-T:where([data-max-height-xlarge]){max-height:min(600px,100vh)}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-max-height-xlarge]){max-height:min(600px,100dvh)}}.prc-Overlay-Overlay-jfs-T:where([data-max-height-fit-content]){max-height:-moz-fit-content;max-height:fit-content}.prc-Overlay-Overlay-jfs-T:where([data-width-small]){width:256px}.prc-Overlay-Overlay-jfs-T:where([data-width-medium]){width:320px}.prc-Overlay-Overlay-jfs-T:where([data-width-large]){width:480px}.prc-Overlay-Overlay-jfs-T:where([data-width-xlarge]){width:640px}.prc-Overlay-Overlay-jfs-T:where([data-width-xxlarge]){width:960px}.prc-Overlay-Overlay-jfs-T:where([data-width-auto]){width:auto}.prc-Overlay-Overlay-jfs-T:where([data-max-width-small]){max-width:256px}.prc-Overlay-Overlay-jfs-T:where([data-max-width-medium]){max-width:320px}.prc-Overlay-Overlay-jfs-T:where([data-max-width-large]){max-width:480px}.prc-Overlay-Overlay-jfs-T:where([data-max-width-xlarge]){max-width:640px}.prc-Overlay-Overlay-jfs-T:where([data-max-width-xxlarge]){max-width:960px}.prc-Overlay-Overlay-jfs-T:where([data-visibility-visible]){visibility:visible}.prc-Overlay-Overlay-jfs-T:where([data-visibility-hidden]){visibility:hidden}@media screen and (max-width:calc(48rem - 0.02px)){.prc-Overlay-Overlay-jfs-T:where([data-responsive=fullscreen]),.prc-Overlay-Overlay-jfs-T[data-component=AnchoredOverlay][data-responsive=fullscreen][data-anchor-position=true],.prc-Overlay-Overlay-jfs-T[data-responsive=fullscreen][data-anchor-position=true]{border-radius:unset;height:100vh;left:0;margin:0;max-height:none;max-width:none;padding-bottom:env(safe-area-inset-bottom);position:fixed;top:0;width:100vw}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-responsive=fullscreen]),.prc-Overlay-Overlay-jfs-T[data-component=AnchoredOverlay][data-responsive=fullscreen][data-anchor-position=true],.prc-Overlay-Overlay-jfs-T[data-responsive=fullscreen][data-anchor-position=true]{height:100dvh}}}@supports (height:100dvh){.prc-Overlay-Overlay-jfs-T:where([data-variant=fullscreen]){height:100dvh}}@media (prefers-reduced-motion:no-preference){.prc-Overlay-Overlay-jfs-T{animation:prc-Overlay-overlay-appear-JpFey .2s cubic-bezier(.33,1,.68,1)}}
2
+ /*# sourceMappingURL=Overlay-214d10dd.css.map */
package/dist/Overlay/Overlay-214d10dd.css.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Overlay/Overlay.module.css.js"],"names":[],"mappings":"AAAA,4CACE,GACE,SACF,CAEA,GACE,SACF,CACF,CAEA,2BAQE,4CAAwC,CACxC,8CAAwC,CACxC,4GAAwC,CALxC,WAAY,CACZ,gBAAiB,CAJjB,4BAA6B,CAE7B,eAAgB,CAGhB,aAAc,CANd,iBAAkB,CAElB,UA0NF,CAjNE,wIAKE,yBAA2B,CAF3B,uBAkBF,CAZI,mDADF,6LAGI,MAAO,CADP,KAGJ,CADE,CAGF,iKAIE,qBAAuB,CAFvB,mBAGF,CAGF,iCACE,YACF,CAEA,8BAvCF,2BAyCI,6BAoLJ,CAnLE,CAEA,+DACE,4BACF,CAEA,uDACE,aACF,CAEA,yDACE,eACF,CAEA,yDACE,eACF,CAEA,0DACE,gBACF,CAEA,uDACE,YACF,CAEA,sDACE,YACF,CAEA,uDACE,YACF,CAEA,sDACE,YACF,CAEA,uDACE,YACF,CAEA,6GAEE,WACF,CAEA,4DACE,uBAAmB,CAAnB,kBACF,CAEA,2DACE,2BAKF,CAHE,0BAHF,2DAII,4BAEJ,CADE,CAGF,0DACE,2BAKF,CAHE,0BAHF,0DAII,4BAEJ,CADE,CAGF,2DACE,2BAKF,CAHE,0BAHF,2DAII,4BAEJ,CADE,CAGF,0DACE,2BAKF,CAHE,0BAHF,0DAII,4BAEJ,CADE,CAGF,2DACE,2BAKF,CAHE,0BAHF,2DAII,4BAEJ,CADE,CAGF,gEACE,2BAAuB,CAAvB,sBACF,CAEA,qDACE,WACF,CAEA,sDACE,WACF,CAEA,qDAEE,WACF,CAEA,sDAEE,WACF,CAEA,uDAEE,WACF,CAEA,oDACE,UACF,CAEA,yDACE,eACF,CAEA,0DACE,eACF,CAEA,yDACE,eACF,CAEA,0DACE,eACF,CAEA,2DACE,eACF,CAEA,4DACE,kBACF,CAEA,2DACE,iBACF,CAKE,mDAHF,mQAYI,mBAAoB,CAHpB,YAAa,CAHb,MAAO,CAKP,QAAS,CADT,eAAgB,CAFhB,cAAe,CAMf,0CAA2C,CAV3C,cAAe,CACf,KAAM,CAEN,WAcJ,CALI,0BAhBJ,mQAkBM,aAGN,CAFI,CACF,CAGF,0BAEE,4DACE,aACF,CACF,CAGF,8CACE,2BACE,wEACF,CACF","file":"Overlay-214d10dd.css","sourcesContent":["@keyframes overlay-appear {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n}\n\n.Overlay {\n position: absolute;\n max-width: calc(100vw - 2rem);\n width: auto;\n min-width: 192px;\n height: auto;\n max-height: 100vh;\n overflow: auto;\n background-color: var(--overlay-bgColor);\n border-radius: var(--borderRadius-large);\n box-shadow: var(--shadow-floating-small);\n\n &[data-anchor-position='false'],\n &:not([data-anchor-position]):not([data-variant='modal']) {\n /* stylelint-disable-next-line primer/spacing */\n right: var(--right, auto);\n /* stylelint-disable-next-line primer/spacing */\n bottom: var(--bottom, auto);\n\n /* stylelint-disable-next-line selector-max-specificity */\n &[data-responsive='fullscreen']:not([data-variant]) {\n @media screen and (--viewportRange-narrow) {\n top: 0;\n left: 0;\n }\n }\n\n &:not([data-variant]) {\n /* stylelint-disable-next-line primer/spacing */\n top: var(--top, auto);\n /* stylelint-disable-next-line primer/spacing */\n left: var(--left, auto);\n }\n }\n\n &:focus {\n outline: none;\n }\n\n @media (forced-colors: active) {\n /* Support for Windows high contrast https://sarahmhigley.com/writing/whcm-quick-tips */\n outline: solid 1px transparent;\n }\n\n &:where([data-reflow-container='true']) {\n max-width: calc(100vw - 2rem);\n }\n\n &:where([data-overflow-auto]) {\n overflow: auto;\n }\n\n &:where([data-overflow-hidden]) {\n overflow: hidden;\n }\n\n &:where([data-overflow-scroll]) {\n overflow: scroll;\n }\n\n &:where([data-overflow-visible]) {\n overflow: visible;\n }\n\n &:where([data-height-xsmall]) {\n height: 192px;\n }\n\n &:where([data-height-small]) {\n height: 256px;\n }\n\n &:where([data-height-medium]) {\n height: 320px;\n }\n\n &:where([data-height-large]) {\n height: 432px;\n }\n\n &:where([data-height-xlarge]) {\n height: 600px;\n }\n\n &:where([data-height-auto]),\n &:where([data-height-initial]) {\n height: auto;\n }\n\n &:where([data-height-fit-content]) {\n height: fit-content;\n }\n\n &:where([data-max-height-xsmall]) {\n max-height: min(192px, 100vh);\n\n @supports (height: 100dvh) {\n max-height: min(192px, 100dvh);\n }\n }\n\n &:where([data-max-height-small]) {\n max-height: min(256px, 100vh);\n\n @supports (height: 100dvh) {\n max-height: min(256px, 100dvh);\n }\n }\n\n &:where([data-max-height-medium]) {\n max-height: min(320px, 100vh);\n\n @supports (height: 100dvh) {\n max-height: min(320px, 100dvh);\n }\n }\n\n &:where([data-max-height-large]) {\n max-height: min(432px, 100vh);\n\n @supports (height: 100dvh) {\n max-height: min(432px, 100dvh);\n }\n }\n\n &:where([data-max-height-xlarge]) {\n max-height: min(600px, 100vh);\n\n @supports (height: 100dvh) {\n max-height: min(600px, 100dvh);\n }\n }\n\n &:where([data-max-height-fit-content]) {\n max-height: fit-content;\n }\n\n &:where([data-width-small]) {\n width: 256px;\n }\n\n &:where([data-width-medium]) {\n width: 320px;\n }\n\n &:where([data-width-large]) {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 480px;\n }\n\n &:where([data-width-xlarge]) {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 640px;\n }\n\n &:where([data-width-xxlarge]) {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 960px;\n }\n\n &:where([data-width-auto]) {\n width: auto;\n }\n\n &:where([data-max-width-small]) {\n max-width: 256px;\n }\n\n &:where([data-max-width-medium]) {\n max-width: 320px;\n }\n\n &:where([data-max-width-large]) {\n max-width: 480px;\n }\n\n &:where([data-max-width-xlarge]) {\n max-width: 640px;\n }\n\n &:where([data-max-width-xxlarge]) {\n max-width: 960px;\n }\n\n &:where([data-visibility-visible]) {\n visibility: visible;\n }\n\n &:where([data-visibility-hidden]) {\n visibility: hidden;\n }\n\n &:where([data-responsive='fullscreen']),\n &[data-responsive='fullscreen'][data-anchor-position='true'],\n &[data-component='AnchoredOverlay'][data-responsive='fullscreen'][data-anchor-position='true'] {\n @media screen and (--viewportRange-narrow) {\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n max-width: none;\n height: 100vh;\n max-height: none;\n margin: 0;\n border-radius: unset;\n /* stylelint-disable-next-line primer/spacing */\n padding-bottom: env(safe-area-inset-bottom);\n\n @supports (height: 100dvh) {\n /* fix for mobile safari (100vh clips the screen with the toolbar) */\n height: 100dvh;\n }\n }\n }\n\n @supports (height: 100dvh) {\n /* fix for mobile safari (100vh clips the screen with the toolbar) */\n &:where([data-variant='fullscreen']) {\n height: 100dvh;\n }\n }\n}\n\n@media (prefers-reduced-motion: no-preference) {\n .Overlay {\n animation: overlay-appear 200ms cubic-bezier(0.33, 1, 0.68, 1);\n }\n}\n"]}
package/dist/Overlay/Overlay.module.css.js CHANGED
@@ -1,4 +1,4 @@
1
- import './Overlay-95cfd3c7.css';
1
+ import './Overlay-214d10dd.css';
2
2
 
3
3
  var classes = {"Overlay":"prc-Overlay-Overlay-jfs-T","overlay-appear":"prc-Overlay-overlay-appear-JpFey"};
4
4
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@primer/react",
3
3
  "type": "module",
4
- "version": "38.25.0-rc.d231face6",
4
+ "version": "38.25.0",
5
5
  "description": "An implementation of GitHub's Primer Design System using React",
6
6
  "main": "./dist/index.js",
7
7
  "module": "./dist/index.js",
package/dist/AnchoredOverlay/AnchoredOverlay-ec9e15fc.css DELETED
@@ -1,2 +0,0 @@
1
- .prc-AnchoredOverlay-ResponsiveCloseButtonContainer-nuium{position:relative}.prc-AnchoredOverlay-ResponsiveCloseButton-z-2rx{display:none;position:absolute;right:var(--base-size-8,.5rem);top:var(--base-size-8,.5rem)}@media screen and (max-width:calc(48rem - 0.02px)){.prc-AnchoredOverlay-ResponsiveCloseButton-z-2rx{display:inline-grid}}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z{position-try-fallbacks:flip-block,flip-inline,flip-block flip-inline;position-visibility:anchors-visible;position:fixed!important;z-index:100}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[popover]{border:0;inset:auto;margin:0;max-width:none;padding:0}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-bottom]{left:anchor(left);top:calc(anchor(bottom) + var(--base-size-4,.25rem))}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-bottom][data-align=left]{left:auto;right:calc(anchor(right) - var(--anchored-overlay-anchor-offset-left))}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-top]{bottom:anchor(top);left:anchor(left);margin-bottom:var(--base-size-4,.25rem)}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-top][data-align=left]{left:auto;right:anchor(right)}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-left]{margin-right:var(--base-size-4,.25rem);right:anchor(left);top:var(--anchored-overlay-top-override,anchor(top));position-try-fallbacks:flip-inline,flip-block,flip-start,--outside-left-to-bottom}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-right]{left:anchor(right);margin-left:var(--base-size-4,.25rem);top:var(--anchored-overlay-top-override,anchor(top));position-try-fallbacks:flip-inline,flip-block,flip-start,--outside-right-to-bottom}@position-try --outside-left-to-bottom{margin:0;right:anchor(right);top:calc(anchor(bottom) + var(--base-size-4,.25rem));width:auto}@position-try --outside-right-to-bottom{left:anchor(left);margin:0;top:calc(anchor(bottom) + var(--base-size-4,.25rem));width:auto}
2
- /*# sourceMappingURL=AnchoredOverlay-ec9e15fc.css.map */
package/dist/AnchoredOverlay/AnchoredOverlay-ec9e15fc.css.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/AnchoredOverlay/AnchoredOverlay.module.css.js"],"names":[],"mappings":"AAAA,0DACE,iBACF,CAEA,iDAIE,YAAa,CAHb,iBAAkB,CAElB,8BAAyB,CADzB,4BAOF,CAHE,mDANF,iDAOI,mBAEJ,CADE,CAGF,2CACE,oEAGwB,CACxB,mCAAoC,CAEpC,wBAA0B,CAD1B,WAsDF,CAnDE,oDAIE,QAAS,CAHT,UAAW,CACX,QAAS,CAGT,cAAe,CAFf,SAGF,CAEA,qEAGE,iBAAkB,CADlB,oDAOF,CAJE,sFACE,SAAU,CACV,sEACF,CAGF,kEAEE,kBAAmB,CACnB,iBAAkB,CAFlB,uCAQF,CAJE,mFACE,SAAU,CACV,mBACF,CAGF,mEAWE,sCAAgC,CAVhC,kBAAmB,CASnB,oDAAsD,CAEtD,iFACF,CAEA,oEACE,kBAAmB,CAEnB,qCAA+B,CAD/B,oDAAsD,CAEtD,kFACF,CAGF,uCAGE,QAAS,CAFT,mBAAoB,CACpB,oDAA8C,CAE9C,UACF,CAEA,wCACE,iBAAkB,CAElB,QAAS,CADT,oDAA8C,CAE9C,UACF","file":"AnchoredOverlay-ec9e15fc.css","sourcesContent":[".ResponsiveCloseButtonContainer {\n position: relative;\n}\n\n.ResponsiveCloseButton {\n position: absolute;\n top: var(--base-size-8);\n right: var(--base-size-8);\n display: none;\n\n @media screen and (--viewportRange-narrow) {\n display: inline-grid;\n }\n}\n\n.AnchoredOverlay {\n position-try-fallbacks:\n flip-block,\n flip-inline,\n flip-block flip-inline;\n position-visibility: anchors-visible;\n z-index: 100;\n position: fixed !important;\n\n &[popover] {\n inset: auto;\n margin: 0;\n padding: 0;\n border: 0;\n max-width: none;\n }\n\n &[data-side='outside-bottom'] {\n /* stylelint-disable primer/spacing */\n top: calc(anchor(bottom) + var(--base-size-4));\n left: anchor(left);\n\n &[data-align='left'] {\n left: auto;\n right: calc(anchor(right) - var(--anchored-overlay-anchor-offset-left));\n }\n }\n\n &[data-side='outside-top'] {\n margin-bottom: var(--base-size-4);\n bottom: anchor(top);\n left: anchor(left);\n\n &[data-align='left'] {\n left: auto;\n right: anchor(right);\n }\n }\n\n &[data-side='outside-left'] {\n right: anchor(left);\n /* Falls back to `anchor(top)` when JS hasn't overridden it. JS sets the\n override when the overlay's bottom would overflow the viewport so we\n can lift it up to keep the bottom edge on screen, mirroring the JS\n anchored-positioning code path.\n\n This override only applies when CSS cannot find space using the default position -\n or any of its defined fallbacks.\n */\n top: var(--anchored-overlay-top-override, anchor(top));\n margin-right: var(--base-size-4);\n position-try-fallbacks: flip-inline, flip-block, flip-start, --outside-left-to-bottom;\n }\n\n &[data-side='outside-right'] {\n left: anchor(right);\n top: var(--anchored-overlay-top-override, anchor(top));\n margin-left: var(--base-size-4);\n position-try-fallbacks: flip-inline, flip-block, flip-start, --outside-right-to-bottom;\n }\n}\n\n@position-try --outside-left-to-bottom {\n right: anchor(right);\n top: calc(anchor(bottom) + var(--base-size-4));\n margin: 0;\n width: auto;\n}\n\n@position-try --outside-right-to-bottom {\n left: anchor(left);\n top: calc(anchor(bottom) + var(--base-size-4));\n margin: 0;\n width: auto;\n}\n"]}
package/dist/Overlay/Overlay-95cfd3c7.css.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/Overlay/Overlay.module.css.js"],"names":[],"mappings":"AAAA,4CACE,GACE,SACF,CAEA,GACE,SACF,CACF,CAEA,2BAQE,4CAAwC,CACxC,8CAAwC,CACxC,4GAAwC,CALxC,WAAY,CACZ,gBAAiB,CAJjB,4BAA6B,CAE7B,eAAgB,CAGhB,aAAc,CANd,iBAAkB,CAElB,UAyNF,CAhNE,wIAKE,yBAA2B,CAF3B,uBAkBF,CAZI,mDADF,6LAGI,MAAO,CADP,KAGJ,CADE,CAGF,iKAIE,qBAAuB,CAFvB,mBAGF,CAGF,iCACE,YACF,CAEA,8BAvCF,2BAyCI,6BAmLJ,CAlLE,CAEA,+DACE,4BACF,CAEA,uDACE,aACF,CAEA,yDACE,eACF,CAEA,yDACE,eACF,CAEA,0DACE,gBACF,CAEA,uDACE,YACF,CAEA,sDACE,YACF,CAEA,uDACE,YACF,CAEA,sDACE,YACF,CAEA,uDACE,YACF,CAEA,6GAEE,WACF,CAEA,4DACE,uBAAmB,CAAnB,kBACF,CAEA,2DACE,2BAKF,CAHE,0BAHF,2DAII,4BAEJ,CADE,CAGF,0DACE,2BAKF,CAHE,0BAHF,0DAII,4BAEJ,CADE,CAGF,2DACE,2BAKF,CAHE,0BAHF,2DAII,4BAEJ,CADE,CAGF,0DACE,2BAKF,CAHE,0BAHF,0DAII,4BAEJ,CADE,CAGF,2DACE,2BAKF,CAHE,0BAHF,2DAII,4BAEJ,CADE,CAGF,gEACE,2BAAuB,CAAvB,sBACF,CAEA,qDACE,WACF,CAEA,sDACE,WACF,CAEA,qDAEE,WACF,CAEA,sDAEE,WACF,CAEA,uDAEE,WACF,CAEA,oDACE,UACF,CAEA,yDACE,eACF,CAEA,0DACE,eACF,CAEA,yDACE,eACF,CAEA,0DACE,eACF,CAEA,2DACE,eACF,CAEA,4DACE,kBACF,CAEA,2DACE,iBACF,CAIE,mDAFF,iJAWI,mBAAoB,CAHpB,YAAa,CAHb,MAAO,CAKP,QAAS,CADT,eAAgB,CAFhB,cAAe,CAMf,0CAA2C,CAV3C,cAAe,CACf,KAAM,CAEN,WAcJ,CALI,0BAfJ,iJAiBM,aAGN,CAFI,CACF,CAGF,0BAEE,4DACE,aACF,CACF,CAGF,8CACE,2BACE,wEACF,CACF","file":"Overlay-95cfd3c7.css","sourcesContent":["@keyframes overlay-appear {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n}\n\n.Overlay {\n position: absolute;\n max-width: calc(100vw - 2rem);\n width: auto;\n min-width: 192px;\n height: auto;\n max-height: 100vh;\n overflow: auto;\n background-color: var(--overlay-bgColor);\n border-radius: var(--borderRadius-large);\n box-shadow: var(--shadow-floating-small);\n\n &[data-anchor-position='false'],\n &:not([data-anchor-position]):not([data-variant='modal']) {\n /* stylelint-disable-next-line primer/spacing */\n right: var(--right, auto);\n /* stylelint-disable-next-line primer/spacing */\n bottom: var(--bottom, auto);\n\n /* stylelint-disable-next-line selector-max-specificity */\n &[data-responsive='fullscreen']:not([data-variant]) {\n @media screen and (--viewportRange-narrow) {\n top: 0;\n left: 0;\n }\n }\n\n &:not([data-variant]) {\n /* stylelint-disable-next-line primer/spacing */\n top: var(--top, auto);\n /* stylelint-disable-next-line primer/spacing */\n left: var(--left, auto);\n }\n }\n\n &:focus {\n outline: none;\n }\n\n @media (forced-colors: active) {\n /* Support for Windows high contrast https://sarahmhigley.com/writing/whcm-quick-tips */\n outline: solid 1px transparent;\n }\n\n &:where([data-reflow-container='true']) {\n max-width: calc(100vw - 2rem);\n }\n\n &:where([data-overflow-auto]) {\n overflow: auto;\n }\n\n &:where([data-overflow-hidden]) {\n overflow: hidden;\n }\n\n &:where([data-overflow-scroll]) {\n overflow: scroll;\n }\n\n &:where([data-overflow-visible]) {\n overflow: visible;\n }\n\n &:where([data-height-xsmall]) {\n height: 192px;\n }\n\n &:where([data-height-small]) {\n height: 256px;\n }\n\n &:where([data-height-medium]) {\n height: 320px;\n }\n\n &:where([data-height-large]) {\n height: 432px;\n }\n\n &:where([data-height-xlarge]) {\n height: 600px;\n }\n\n &:where([data-height-auto]),\n &:where([data-height-initial]) {\n height: auto;\n }\n\n &:where([data-height-fit-content]) {\n height: fit-content;\n }\n\n &:where([data-max-height-xsmall]) {\n max-height: min(192px, 100vh);\n\n @supports (height: 100dvh) {\n max-height: min(192px, 100dvh);\n }\n }\n\n &:where([data-max-height-small]) {\n max-height: min(256px, 100vh);\n\n @supports (height: 100dvh) {\n max-height: min(256px, 100dvh);\n }\n }\n\n &:where([data-max-height-medium]) {\n max-height: min(320px, 100vh);\n\n @supports (height: 100dvh) {\n max-height: min(320px, 100dvh);\n }\n }\n\n &:where([data-max-height-large]) {\n max-height: min(432px, 100vh);\n\n @supports (height: 100dvh) {\n max-height: min(432px, 100dvh);\n }\n }\n\n &:where([data-max-height-xlarge]) {\n max-height: min(600px, 100vh);\n\n @supports (height: 100dvh) {\n max-height: min(600px, 100dvh);\n }\n }\n\n &:where([data-max-height-fit-content]) {\n max-height: fit-content;\n }\n\n &:where([data-width-small]) {\n width: 256px;\n }\n\n &:where([data-width-medium]) {\n width: 320px;\n }\n\n &:where([data-width-large]) {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 480px;\n }\n\n &:where([data-width-xlarge]) {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 640px;\n }\n\n &:where([data-width-xxlarge]) {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 960px;\n }\n\n &:where([data-width-auto]) {\n width: auto;\n }\n\n &:where([data-max-width-small]) {\n max-width: 256px;\n }\n\n &:where([data-max-width-medium]) {\n max-width: 320px;\n }\n\n &:where([data-max-width-large]) {\n max-width: 480px;\n }\n\n &:where([data-max-width-xlarge]) {\n max-width: 640px;\n }\n\n &:where([data-max-width-xxlarge]) {\n max-width: 960px;\n }\n\n &:where([data-visibility-visible]) {\n visibility: visible;\n }\n\n &:where([data-visibility-hidden]) {\n visibility: hidden;\n }\n\n &:where([data-responsive='fullscreen']),\n &[data-responsive='fullscreen'][data-anchor-position='true'] {\n @media screen and (--viewportRange-narrow) {\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n max-width: none;\n height: 100vh;\n max-height: none;\n margin: 0;\n border-radius: unset;\n /* stylelint-disable-next-line primer/spacing */\n padding-bottom: env(safe-area-inset-bottom);\n\n @supports (height: 100dvh) {\n /* fix for mobile safari (100vh clips the screen with the toolbar) */\n height: 100dvh;\n }\n }\n }\n\n @supports (height: 100dvh) {\n /* fix for mobile safari (100vh clips the screen with the toolbar) */\n &:where([data-variant='fullscreen']) {\n height: 100dvh;\n }\n }\n}\n\n@media (prefers-reduced-motion: no-preference) {\n .Overlay {\n animation: overlay-appear 200ms cubic-bezier(0.33, 1, 0.68, 1);\n }\n}\n"]}