@primer/react 38.25.0-rc.d231face6 → 38.25.1-rc.5a14e1af3
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 +33 -0
- package/dist/AnchoredOverlay/AnchoredOverlay-d483d670.css +2 -0
- package/dist/AnchoredOverlay/AnchoredOverlay-d483d670.css.map +1 -0
- package/dist/AnchoredOverlay/AnchoredOverlay.d.ts.map +1 -1
- package/dist/AnchoredOverlay/AnchoredOverlay.js +7 -4
- package/dist/AnchoredOverlay/AnchoredOverlay.module.css.js +1 -1
- package/dist/Banner/Banner.d.ts.map +1 -1
- package/dist/Banner/Banner.js +17 -20
- package/dist/Heading/Heading.d.ts.map +1 -1
- package/dist/Heading/Heading.js +8 -16
- package/dist/Link/Link.d.ts.map +1 -1
- package/dist/Link/Link.js +8 -16
- package/dist/Overlay/{Overlay-95cfd3c7.css → Overlay-214d10dd.css} +2 -2
- package/dist/Overlay/Overlay-214d10dd.css.map +1 -0
- package/dist/Overlay/Overlay.module.css.js +1 -1
- package/dist/PageLayout/usePaneWidth.d.ts.map +1 -1
- package/dist/PageLayout/usePaneWidth.js +3 -1
- package/dist/UnderlineNav/UnderlineNav.d.ts.map +1 -1
- package/dist/UnderlineNav/UnderlineNav.js +9 -12
- package/dist/internal/hooks/useDevOnlyEffect.d.ts +16 -0
- package/dist/internal/hooks/useDevOnlyEffect.d.ts.map +1 -0
- package/dist/internal/hooks/useDevOnlyEffect.js +25 -0
- package/dist/internal/hooks/useFocus.d.ts +9 -1
- package/dist/internal/hooks/useFocus.d.ts.map +1 -1
- package/dist/utils/testing/profiler.d.ts +35 -0
- package/dist/utils/testing/profiler.d.ts.map +1 -0
- package/package.json +1 -1
- package/dist/AnchoredOverlay/AnchoredOverlay-ec9e15fc.css +0 -2
- package/dist/AnchoredOverlay/AnchoredOverlay-ec9e15fc.css.map +0 -1
- package/dist/Overlay/Overlay-95cfd3c7.css.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,36 @@
|
|
|
1
1
|
# @primer/react
|
|
2
2
|
|
|
3
|
+
## 38.25.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#7864](https://github.com/primer/react/pull/7864) [`e7205ea`](https://github.com/primer/react/commit/e7205ea51b02fb1b7ac9de2df122f7ba67ebe078) Thanks [@mattcosta7](https://github.com/mattcosta7)! - Eliminate nested-update cascades in `useFocus`, `PageLayout.Pane`, and
|
|
8
|
+
`AnchoredOverlay`:
|
|
9
|
+
|
|
10
|
+
- `useFocus` no longer produces a second re-render after focusing; one
|
|
11
|
+
`focus()` call now results in exactly one render instead of two.
|
|
12
|
+
- `PageLayout.Pane` (resizable) no longer triggers a forced re-render
|
|
13
|
+
before paint on mount. The CSS variable and ARIA attributes are still
|
|
14
|
+
updated synchronously in the layout effect; the React state sync is
|
|
15
|
+
wrapped in `startTransition` so it runs in the transition lane rather
|
|
16
|
+
than as part of the layout-effect commit.
|
|
17
|
+
- `AnchoredOverlay` no longer keeps `useAnchoredPosition`'s scroll
|
|
18
|
+
listeners and `ResizeObserver` attached while it is closed. After an
|
|
19
|
+
open→close cycle, the first scroll/resize event no longer fires a
|
|
20
|
+
spurious `setPosition(undefined)` that re-renders the closed overlay.
|
|
21
|
+
|
|
22
|
+
Also adds a profiler-based test harness at
|
|
23
|
+
`src/utils/testing/profiler.tsx` so future regressions can be pinned with
|
|
24
|
+
`counter.updateCount` and `counter.nestedUpdateCount` assertions.
|
|
25
|
+
|
|
26
|
+
- [#7874](https://github.com/primer/react/pull/7874) [`8cc7e99`](https://github.com/primer/react/commit/8cc7e998d2dbde1fb927b598755810b534702a6a) Thanks [@mattcosta7](https://github.com/mattcosta7)! - Dev-only effects (the `if (__DEV__) { useEffect(...) }` pattern with an
|
|
27
|
+
`eslint-disable react-hooks/rules-of-hooks` comment at every call site) are
|
|
28
|
+
now expressed via a new internal `useDevOnlyEffect` hook. The lint
|
|
29
|
+
suppression lives in the wrapper, the effect is dropped from production by
|
|
30
|
+
the consumer's `process.env.NODE_ENV` replacement, and call sites get
|
|
31
|
+
`react-hooks/exhaustive-deps` lint via `additionalEffectHooks`. No public
|
|
32
|
+
API changes.
|
|
33
|
+
|
|
3
34
|
## 38.25.0
|
|
4
35
|
|
|
5
36
|
### Minor Changes
|
|
@@ -8,6 +39,8 @@
|
|
|
8
39
|
|
|
9
40
|
### Patch Changes
|
|
10
41
|
|
|
42
|
+
- [#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
|
|
43
|
+
|
|
11
44
|
- [#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
45
|
|
|
13
46
|
## 38.24.0
|
|
@@ -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 */
|
|
@@ -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"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AnchoredOverlay.d.ts","sourceRoot":"","sources":["../../src/AnchoredOverlay/AnchoredOverlay.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"AnchoredOverlay.d.ts","sourceRoot":"","sources":["../../src/AnchoredOverlay/AnchoredOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAmC,KAAK,GAAG,EAAC,MAAM,OAAO,CAAA;AAChE,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,YAAY,CAAA;AAE5C,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,uBAAuB,CAAA;AAEhE,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,uBAAuB,CAAA;AAIhE,OAAO,KAAK,EAAC,cAAc,EAAE,gBAAgB,EAAC,MAAM,mBAAmB,CAAA;AACvE,OAAO,EAAC,KAAK,eAAe,EAAC,MAAM,6BAA6B,CAAA;AAChE,OAAO,EAAa,KAAK,eAAe,EAAC,MAAM,WAAW,CAAA;AAO1D,UAAU,8BAA8B;IACtC;;;OAGG;IACH,YAAY,EAAE,CAAC,CAAC,SAAS,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,YAAY,GAAG,iBAAiB,CAAC,EAChG,KAAK,EAAE,CAAC,KACL,GAAG,CAAC,OAAO,CAAA;IAEhB;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAE/C;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAED,UAAU,iCAAiC;IACzC;;;OAGG;IACH,YAAY,EAAE,IAAI,CAAA;IAElB;;;OAGG;IACH,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAC9C;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAED,MAAM,MAAM,iCAAiC,GACzC,OAAO,CAAC,8BAA8B,CAAC,GACvC,iCAAiC,CAAA;AAErC,UAAU,wBAAyB,SAAQ,IAAI,CAAC,YAAY,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC/E;;OAEG;IACH,IAAI,EAAE,OAAO,CAAA;IAEb;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,kBAAkB,EAAE,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,OAAO,CAAA;IAE5G;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,eAAe,GAAG,QAAQ,GAAG,OAAO,KAAK,OAAO,CAAA;IAErF;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;IAEpC;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC,qBAAqB,CAAC,CAAA;IAElD;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC,qBAAqB,CAAC,CAAA;IAElD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC,UAAU,EAAE,UAAU,GAAG,YAAY,CAAC,CAAA;IAChE;;OAEG;IACH,gBAAgB,CAAC,EAAE,CAAC,EAAC,QAAQ,EAAC,EAAE;QAAC,QAAQ,EAAE,cAAc,CAAA;KAAC,KAAK,IAAI,CAAA;IACnE;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAA;IAC3C;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;CAChC;AAED,MAAM,MAAM,oBAAoB,GAAG,wBAAwB,GACzD,CAAC,8BAA8B,GAAG,iCAAiC,CAAC,GACpE,OAAO,CAAC,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,MAAM,GAAG,cAAc,GAAG,iBAAiB,GAAG,mBAAmB,CAAC,CAAC,CAAA;AAS9G;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,CAuRnF,CAAA"}
|
|
@@ -110,10 +110,13 @@ const AnchoredOverlay = ({
|
|
|
110
110
|
anchorOffset,
|
|
111
111
|
displayInViewport,
|
|
112
112
|
onPositionChange: positionChange,
|
|
113
|
-
//
|
|
114
|
-
//
|
|
115
|
-
// handles
|
|
116
|
-
|
|
113
|
+
// Disable position computation, scroll listeners, and resize observers
|
|
114
|
+
// when the overlay is closed (no floating element to position) or when
|
|
115
|
+
// native CSS anchor positioning is active (the browser handles it).
|
|
116
|
+
// Skipping the listeners while closed avoids a wasted re-render on the
|
|
117
|
+
// first scroll/resize after a close (where `setPosition(undefined)`
|
|
118
|
+
// would otherwise clear the stale open-position state).
|
|
119
|
+
enabled: open && !cssAnchorPositioning
|
|
117
120
|
}, [overlayElement]);
|
|
118
121
|
useEffect(() => {
|
|
119
122
|
// ensure overlay ref gets cleared when closed, so position can reset between closing/re-opening
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './AnchoredOverlay-
|
|
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
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/Banner/Banner.tsx"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/Banner/Banner.tsx"],"names":[],"mappings":"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"}
|
package/dist/Banner/Banner.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { clsx } from 'clsx';
|
|
2
|
-
import React, {
|
|
2
|
+
import React, { forwardRef } from 'react';
|
|
3
|
+
import { useDevOnlyEffect } from '../internal/hooks/useDevOnlyEffect.js';
|
|
3
4
|
import { XIcon, AlertIcon, InfoIcon, CheckCircleIcon, StopIcon } from '@primer/octicons-react';
|
|
4
5
|
import { IconButton } from '../Button/IconButton.js';
|
|
5
6
|
import { ButtonComponent } from '../Button/Button.js';
|
|
@@ -42,25 +43,21 @@ const Banner = /*#__PURE__*/React.forwardRef(function Banner({
|
|
|
42
43
|
const supportsCustomIcon = variant === 'info' || variant === 'upsell';
|
|
43
44
|
const titleId = useId();
|
|
44
45
|
const visual = leadingVisual !== null && leadingVisual !== void 0 ? leadingVisual : icon;
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
throw new Error('Expected a title to be provided to the <Banner> component with the `title` prop or through `<Banner.Title>` but no title was found');
|
|
61
|
-
}
|
|
62
|
-
}, [title]);
|
|
63
|
-
}
|
|
46
|
+
useDevOnlyEffect(() => {
|
|
47
|
+
if (title) {
|
|
48
|
+
return;
|
|
49
|
+
}
|
|
50
|
+
const {
|
|
51
|
+
current: banner
|
|
52
|
+
} = bannerRef;
|
|
53
|
+
if (!banner) {
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
const hasTitle = banner.querySelector('[data-banner-title]');
|
|
57
|
+
if (!hasTitle) {
|
|
58
|
+
throw new Error('Expected a title to be provided to the <Banner> component with the `title` prop or through `<Banner.Title>` but no title was found');
|
|
59
|
+
}
|
|
60
|
+
}, [title]);
|
|
64
61
|
return /*#__PURE__*/jsx(BannerContext.Provider, {
|
|
65
62
|
value: {
|
|
66
63
|
titleId
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../src/Heading/Heading.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../src/Heading/Heading.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAClD,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAG/F,KAAK,aAAa,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAE5D,KAAK,kBAAkB,GAAG;IACxB,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;CACvC,CAAA;AAED,QAAA,MAAM,OAAO,EAoBP,8BAA8B,CAAC,aAAa,EAAE,kBAAkB,CAAC,CAAA;AAIvE,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,CAAA;AACzD,eAAe,OAAO,CAAA"}
|
package/dist/Heading/Heading.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { clsx } from 'clsx';
|
|
2
|
-
import React, { forwardRef
|
|
2
|
+
import React, { forwardRef } from 'react';
|
|
3
|
+
import { useDevOnlyEffect } from '../internal/hooks/useDevOnlyEffect.js';
|
|
3
4
|
import classes from './Heading.module.css.js';
|
|
4
5
|
import { jsx } from 'react/jsx-runtime';
|
|
5
6
|
import { useMergedRefs } from '../hooks/useMergedRefs.js';
|
|
@@ -12,21 +13,12 @@ const Heading = /*#__PURE__*/forwardRef(({
|
|
|
12
13
|
}, forwardedRef) => {
|
|
13
14
|
const innerRef = React.useRef(null);
|
|
14
15
|
const mergedRef = useMergedRefs(forwardedRef, innerRef);
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
*/
|
|
22
|
-
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
23
|
-
useEffect(() => {
|
|
24
|
-
if (innerRef.current && !(innerRef.current instanceof HTMLHeadingElement)) {
|
|
25
|
-
// eslint-disable-next-line no-console
|
|
26
|
-
console.warn('This Heading component should be an instanceof of h1-h6');
|
|
27
|
-
}
|
|
28
|
-
}, [innerRef]);
|
|
29
|
-
}
|
|
16
|
+
useDevOnlyEffect(() => {
|
|
17
|
+
if (innerRef.current && !(innerRef.current instanceof HTMLHeadingElement)) {
|
|
18
|
+
// eslint-disable-next-line no-console
|
|
19
|
+
console.warn('This Heading component should be an instanceof of h1-h6');
|
|
20
|
+
}
|
|
21
|
+
}, [innerRef]);
|
|
30
22
|
return /*#__PURE__*/jsx(Component, {
|
|
31
23
|
className: clsx(className, classes.Heading),
|
|
32
24
|
"data-variant": variant,
|
package/dist/Link/Link.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/Link/Link.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/Link/Link.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAC,KAAK,YAAY,EAAkB,MAAM,OAAO,CAAA;AAI/D,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAClD,OAAO,EAAC,KAAK,gBAAgB,EAAkB,MAAM,6BAA6B,CAAA;AAElF,KAAK,eAAe,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,GAAG,GAAG,IAAI;IACzD,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,uDAAuD;IACvD,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,KAAK,CAAC,EAAE,OAAO,CAAA;IAEf,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,EAAE,SAAS,KAAK,CAAC,WAAW,GAAG,GAAG,EAC9D,OAAO,gBAAgB,CAAC,EAAE,EAAE,GAAG,EAAE,eAAe,CAAC,EACjD,KAAK,YAAY,CAAC,OAAO,CAAC,sBAiC3B,CAAA;AAID,QAAA,MAAM,IAAI,IAvCoB,EAAE,SAAS,KAAK,CAAC,WAAW;;;;CAuCM,CAAA;AAEhE,MAAM,MAAM,SAAS,GAAG,cAAc,CAAC,OAAO,IAAI,CAAC,CAAA;AACnD,eAAe,IAAI,CAAA"}
|
package/dist/Link/Link.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { clsx } from 'clsx';
|
|
2
|
-
import React
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { useDevOnlyEffect } from '../internal/hooks/useDevOnlyEffect.js';
|
|
3
4
|
import classes from './Link.module.css.js';
|
|
4
5
|
import { fixedForwardRef } from '../utils/modern-polymorphic.js';
|
|
5
6
|
import { jsx } from 'react/jsx-runtime';
|
|
@@ -16,21 +17,12 @@ const UnwrappedLink = (props, ref) => {
|
|
|
16
17
|
} = props;
|
|
17
18
|
const innerRef = React.useRef(null);
|
|
18
19
|
const mergedRef = useMergedRefs(ref, innerRef);
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
*/
|
|
26
|
-
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
27
|
-
useEffect(() => {
|
|
28
|
-
if (innerRef.current && !(innerRef.current instanceof HTMLButtonElement) && !(innerRef.current instanceof HTMLAnchorElement)) {
|
|
29
|
-
// eslint-disable-next-line no-console
|
|
30
|
-
console.error('Error: Found `Link` component that renders an inaccessible element', innerRef.current, 'Please ensure `Link` always renders as <a> or <button>');
|
|
31
|
-
}
|
|
32
|
-
}, [innerRef]);
|
|
33
|
-
}
|
|
20
|
+
useDevOnlyEffect(() => {
|
|
21
|
+
if (innerRef.current && !(innerRef.current instanceof HTMLButtonElement) && !(innerRef.current instanceof HTMLAnchorElement)) {
|
|
22
|
+
// eslint-disable-next-line no-console
|
|
23
|
+
console.error('Error: Found `Link` component that renders an inaccessible element', innerRef.current, 'Please ensure `Link` always renders as <a> or <button>');
|
|
24
|
+
}
|
|
25
|
+
}, [innerRef]);
|
|
34
26
|
return /*#__PURE__*/jsx(Component, {
|
|
35
27
|
className: clsx(className, classes.Link),
|
|
36
28
|
"data-component": "Link",
|
|
@@ -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-
|
|
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 */
|
|
@@ -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"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePaneWidth.d.ts","sourceRoot":"","sources":["../../src/PageLayout/usePaneWidth.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"usePaneWidth.d.ts","sourceRoot":"","sources":["../../src/PageLayout/usePaneWidth.ts"],"names":[],"mappings":"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"}
|
|
@@ -350,13 +350,15 @@ function usePaneWidth(t0) {
|
|
|
350
350
|
maxWidthDiffRef.current = getMaxWidthDiffFromViewport();
|
|
351
351
|
const initialMax = getMaxPaneWidthRef.current();
|
|
352
352
|
maxPaneWidthRef.current = initialMax;
|
|
353
|
-
setMaxPaneWidth(initialMax);
|
|
354
353
|
(_paneRef$current3 = paneRef.current) === null || _paneRef$current3 === void 0 ? void 0 : _paneRef$current3.style.setProperty("--pane-max-width", `${initialMax}px`);
|
|
355
354
|
updateAriaValues(handleRef.current, {
|
|
356
355
|
min: minPaneWidth,
|
|
357
356
|
max: initialMax,
|
|
358
357
|
current: currentWidthRef.current
|
|
359
358
|
});
|
|
359
|
+
startTransition(() => {
|
|
360
|
+
setMaxPaneWidth(initialMax);
|
|
361
|
+
});
|
|
360
362
|
if (customMaxWidth !== null && !constrainToViewport) {
|
|
361
363
|
return;
|
|
362
364
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UnderlineNav.d.ts","sourceRoot":"","sources":["../../src/UnderlineNav/UnderlineNav.tsx"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"UnderlineNav.d.ts","sourceRoot":"","sources":["../../src/UnderlineNav/UnderlineNav.tsx"],"names":[],"mappings":"AACA,OAAO,KAAkD,MAAM,OAAO,CAAA;AAoBtE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,YAAY,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAA;IACjD,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,CAAA;CAC5B,CAAA;AAGD,eAAO,MAAM,cAAc,KAAK,CAAA;AAwEhC,eAAO,MAAM,gBAAgB,GAAI,UAAU,KAAK,CAAC,SAAS,KAEgC,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,EAChH,CAAA;AAgCD,eAAO,MAAM,YAAY,mFA0SxB,CAAA"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import React, { forwardRef, useRef, useState,
|
|
1
|
+
import React, { forwardRef, useRef, useState, useCallback } from 'react';
|
|
2
|
+
import { useDevOnlyEffect } from '../internal/hooks/useDevOnlyEffect.js';
|
|
2
3
|
import { UnderlineNavContext } from './UnderlineNavContext.js';
|
|
3
4
|
import { useResizeObserver } from '../hooks/useResizeObserver.js';
|
|
4
5
|
import VisuallyHidden from '../_VisuallyHidden.js';
|
|
@@ -157,18 +158,14 @@ const UnderlineNav = /*#__PURE__*/forwardRef(({
|
|
|
157
158
|
});
|
|
158
159
|
// This is the case where the viewport is too narrow to show any list item with the more menu. In this case, we only show the dropdown
|
|
159
160
|
const onlyMenuVisible = responsiveProps.items.length === 0;
|
|
160
|
-
|
|
161
|
-
//
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
// Address illegal state where there are multiple items that have `aria-current='page'` attribute
|
|
165
|
-
const activeElements = validChildren.filter(child => {
|
|
166
|
-
return child.props['aria-current'] !== undefined;
|
|
167
|
-
});
|
|
168
|
-
!(activeElements.length <= 1) ? process.env.NODE_ENV !== "production" ? invariant(false, 'Only one current element is allowed') : invariant(false) : void 0;
|
|
169
|
-
!ariaLabel ? process.env.NODE_ENV !== "production" ? invariant(false, 'Use the `aria-label` prop to provide an accessible label for assistive technology') : invariant(false) : void 0;
|
|
161
|
+
useDevOnlyEffect(() => {
|
|
162
|
+
// Address illegal state where there are multiple items that have `aria-current='page'` attribute
|
|
163
|
+
const activeElements = validChildren.filter(child => {
|
|
164
|
+
return child.props['aria-current'] !== undefined;
|
|
170
165
|
});
|
|
171
|
-
|
|
166
|
+
!(activeElements.length <= 1) ? process.env.NODE_ENV !== "production" ? invariant(false, 'Only one current element is allowed') : invariant(false) : void 0;
|
|
167
|
+
!ariaLabel ? process.env.NODE_ENV !== "production" ? invariant(false, 'Use the `aria-label` prop to provide an accessible label for assistive technology') : invariant(false) : void 0;
|
|
168
|
+
}, [validChildren, ariaLabel]);
|
|
172
169
|
function getItemsWidth(itemText) {
|
|
173
170
|
var _noIconChildWidthArra, _noIconChildWidthArra2;
|
|
174
171
|
return (_noIconChildWidthArra = (_noIconChildWidthArra2 = noIconChildWidthArray.find(item => item.text === itemText)) === null || _noIconChildWidthArra2 === void 0 ? void 0 : _noIconChildWidthArra2.width) !== null && _noIconChildWidthArra !== void 0 ? _noIconChildWidthArra : 0;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Runs an effect only in development. Wrapping `useEffect` in a regular hook
|
|
3
|
+
* with an outer `__DEV__` guard keeps the production cost to zero (the entire
|
|
4
|
+
* call is dropped by the consumer's `process.env.NODE_ENV` replacement) while
|
|
5
|
+
* centralising the `eslint-disable react-hooks/rules-of-hooks` to one place
|
|
6
|
+
* instead of every call site.
|
|
7
|
+
*
|
|
8
|
+
* `exhaustive-deps` is wired up to also check call sites of this hook via
|
|
9
|
+
* `additionalEffectHooks` in `eslint.config.mjs`, so callers get the same
|
|
10
|
+
* deps lint they would for a plain `useEffect`.
|
|
11
|
+
*
|
|
12
|
+
* @param effect The effect callback to run in development.
|
|
13
|
+
* @param deps Dependency list, same semantics as `useEffect`.
|
|
14
|
+
*/
|
|
15
|
+
export declare const useDevOnlyEffect: (effect: React.EffectCallback, deps?: React.DependencyList) => void;
|
|
16
|
+
//# sourceMappingURL=useDevOnlyEffect.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDevOnlyEffect.d.ts","sourceRoot":"","sources":["../../../src/internal/hooks/useDevOnlyEffect.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,gBAAgB,GAAI,QAAQ,KAAK,CAAC,cAAc,EAAE,OAAO,KAAK,CAAC,cAAc,SAMzF,CAAA"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { useEffect } from 'react';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Runs an effect only in development. Wrapping `useEffect` in a regular hook
|
|
5
|
+
* with an outer `__DEV__` guard keeps the production cost to zero (the entire
|
|
6
|
+
* call is dropped by the consumer's `process.env.NODE_ENV` replacement) while
|
|
7
|
+
* centralising the `eslint-disable react-hooks/rules-of-hooks` to one place
|
|
8
|
+
* instead of every call site.
|
|
9
|
+
*
|
|
10
|
+
* `exhaustive-deps` is wired up to also check call sites of this hook via
|
|
11
|
+
* `additionalEffectHooks` in `eslint.config.mjs`, so callers get the same
|
|
12
|
+
* deps lint they would for a plain `useEffect`.
|
|
13
|
+
*
|
|
14
|
+
* @param effect The effect callback to run in development.
|
|
15
|
+
* @param deps Dependency list, same semantics as `useEffect`.
|
|
16
|
+
*/
|
|
17
|
+
const useDevOnlyEffect = (effect, deps) => {
|
|
18
|
+
if (process.env.NODE_ENV !== "production") {
|
|
19
|
+
// Forwarding wrapper; deps lint applies at call sites.
|
|
20
|
+
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
21
|
+
useEffect(effect, deps);
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
export { useDevOnlyEffect };
|
|
@@ -1,3 +1,11 @@
|
|
|
1
1
|
import { type RefObject } from 'react';
|
|
2
|
-
|
|
2
|
+
/**
|
|
3
|
+
* Returns a function that focuses the given element on the next render commit.
|
|
4
|
+
*
|
|
5
|
+
* The target is stored in a ref (not state) and the effect is gated by a
|
|
6
|
+
* version counter, so calling `focus()` produces exactly one render — never
|
|
7
|
+
* the two-render cascade you'd get from `setState(target)` followed by
|
|
8
|
+
* `setState(null)` inside the effect.
|
|
9
|
+
*/
|
|
10
|
+
export declare function useFocus(): (target: HTMLElement | RefObject<HTMLElement>) => void;
|
|
3
11
|
//# sourceMappingURL=useFocus.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFocus.d.ts","sourceRoot":"","sources":["../../../src/internal/hooks/useFocus.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,SAAS,
|
|
1
|
+
{"version":3,"file":"useFocus.d.ts","sourceRoot":"","sources":["../../../src/internal/hooks/useFocus.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,SAAS,EAA2C,MAAM,OAAO,CAAA;AAE9E;;;;;;;GAOG;AACH,wBAAgB,QAAQ,aAgBM,WAAW,GAAG,SAAS,CAAC,WAAW,CAAC,UAIjE"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { type ReactElement } from 'react';
|
|
2
|
+
export type RenderCounter = {
|
|
3
|
+
/** Total number of times the wrapped subtree has rendered (mount + updates). */
|
|
4
|
+
readonly count: number;
|
|
5
|
+
/** Number of mount renders. */
|
|
6
|
+
readonly mountCount: number;
|
|
7
|
+
/** Number of update renders (any cause). */
|
|
8
|
+
readonly updateCount: number;
|
|
9
|
+
/**
|
|
10
|
+
* Number of updates triggered inside the same commit cycle that produced the
|
|
11
|
+
* original render — i.e., a `setState` call from inside a `useLayoutEffect`
|
|
12
|
+
* that forced a synchronous re-render before paint. This is the canonical
|
|
13
|
+
* "nested update" / cascade signal; assert `nestedUpdateCount === 0` to pin
|
|
14
|
+
* that a component never forces a double-commit.
|
|
15
|
+
*/
|
|
16
|
+
readonly nestedUpdateCount: number;
|
|
17
|
+
/** Reset the counter. */
|
|
18
|
+
reset(): void;
|
|
19
|
+
};
|
|
20
|
+
/**
|
|
21
|
+
* Returns a `[Wrap, counter]` pair. Wrap the component under test with `Wrap`
|
|
22
|
+
* to count how many times its subtree renders. Useful for asserting that a
|
|
23
|
+
* single user interaction (or a stable prop) does not cause cascading renders.
|
|
24
|
+
*
|
|
25
|
+
* @example
|
|
26
|
+
* const [Wrap, counter] = createRenderCounter()
|
|
27
|
+
* render(<Wrap><MyComponent /></Wrap>)
|
|
28
|
+
* // ... interaction ...
|
|
29
|
+
* expect(counter.updateCount).toBe(1)
|
|
30
|
+
* expect(counter.nestedUpdateCount).toBe(0)
|
|
31
|
+
*/
|
|
32
|
+
export declare function createRenderCounter(id?: string): [(props: {
|
|
33
|
+
children: ReactElement | ReactElement[];
|
|
34
|
+
}) => ReactElement, RenderCounter];
|
|
35
|
+
//# sourceMappingURL=profiler.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"profiler.d.ts","sourceRoot":"","sources":["../../../src/utils/testing/profiler.tsx"],"names":[],"mappings":"AAAA,OAAc,EAA0C,KAAK,YAAY,EAAC,MAAM,OAAO,CAAA;AAEvF,MAAM,MAAM,aAAa,GAAG;IAC1B,gFAAgF;IAChF,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,+BAA+B;IAC/B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;IAC3B,4CAA4C;IAC5C,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAA;IAC5B;;;;;;OAMG;IACH,QAAQ,CAAC,iBAAiB,EAAE,MAAM,CAAA;IAClC,yBAAyB;IACzB,KAAK,IAAI,IAAI,CAAA;CACd,CAAA;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,mBAAmB,CACjC,EAAE,SAAkB,GACnB,CAAC,CAAC,KAAK,EAAE;IAAC,QAAQ,EAAE,YAAY,GAAG,YAAY,EAAE,CAAA;CAAC,KAAK,YAAY,EAAE,aAAa,CAAC,CAsCrF"}
|
package/package.json
CHANGED
|
@@ -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 */
|
|
@@ -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"]}
|
|
@@ -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"]}
|