@primer/react 0.0.0-20260319051041 → 0.0.0-20260319132252
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 +1 -1
- package/dist/AnchoredOverlay/AnchoredOverlay-d785da7d.css +2 -0
- package/dist/AnchoredOverlay/AnchoredOverlay-d785da7d.css.map +1 -0
- package/dist/AnchoredOverlay/AnchoredOverlay.d.ts.map +1 -1
- package/dist/AnchoredOverlay/AnchoredOverlay.js +23 -1
- package/dist/AnchoredOverlay/AnchoredOverlay.module.css.js +2 -2
- package/dist/Overlay/Overlay.d.ts.map +1 -1
- package/dist/Overlay/Overlay.js +40 -28
- package/package.json +1 -1
- package/dist/AnchoredOverlay/AnchoredOverlay-0f6f45b5.css +0 -2
- package/dist/AnchoredOverlay/AnchoredOverlay-0f6f45b5.css.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -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-Wrapper-w6jU3{display:inline}.prc-AnchoredOverlay-Wrapper-w6jU3:not([data-external-anchor]){anchor-scope:--anchored-overlay-anchor}.prc-AnchoredOverlay-Wrapper-w6jU3 [data-anchor]{anchor-name:--anchored-overlay-anchor}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z{position-anchor:--anchored-overlay-anchor;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-height:none;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-top]{bottom:anchor(top);left:anchor(left);margin-bottom:var(--base-size-4,.25rem)}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-left]{margin-right:var(--base-size-4,.25rem);right:anchor(left);top:anchor(top)}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-right]{left:anchor(right);margin-left:var(--base-size-4,.25rem);top:anchor(top)}
|
|
2
|
+
/*# sourceMappingURL=AnchoredOverlay-d785da7d.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,mCACE,cAUF,CARE,+DACE,sCACF,CAEA,iDAEE,qCACF,CAGF,2CACE,yCAA0C,CAC1C,oEAGwB,CACxB,mCAAoC,CAEpC,wBAA0B,CAD1B,WAmCF,CAhCE,oDAIE,QAAS,CAHT,UAAW,CACX,QAAS,CAGT,eAAgB,CAChB,cAAe,CAHf,SAIF,CAEA,qEAGE,iBAAkB,CADlB,oDAEF,CAEA,kEAEE,kBAAmB,CACnB,iBAAkB,CAFlB,uCAGF,CAEA,mEAGE,sCAAgC,CAFhC,kBAAmB,CACnB,eAEF,CAEA,oEACE,kBAAmB,CAEnB,qCAA+B,CAD/B,eAEF","file":"AnchoredOverlay-d785da7d.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.Wrapper {\n display: inline;\n\n &:not([data-external-anchor]) {\n anchor-scope: --anchored-overlay-anchor;\n }\n\n & [data-anchor] {\n /* Anchor name, this is currently tied to `renderAnchor` */\n anchor-name: --anchored-overlay-anchor;\n }\n}\n\n.AnchoredOverlay {\n position-anchor: --anchored-overlay-anchor;\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-height: none;\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\n &[data-side='outside-top'] {\n margin-bottom: var(--base-size-4);\n bottom: anchor(top);\n left: anchor(left);\n }\n\n &[data-side='outside-left'] {\n right: anchor(left);\n top: anchor(top);\n margin-right: var(--base-size-4);\n }\n\n &[data-side='outside-right'] {\n left: anchor(right);\n top: anchor(top);\n margin-left: var(--base-size-4);\n }\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":"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"}
|
|
@@ -124,6 +124,24 @@ const AnchoredOverlay = ({
|
|
|
124
124
|
disabled: !open || !position_0,
|
|
125
125
|
...focusTrapSettings
|
|
126
126
|
});
|
|
127
|
+
const isExternalAnchor = cssAnchorPositioning && !renderAnchor;
|
|
128
|
+
useEffect(() => {
|
|
129
|
+
if (!isExternalAnchor || !anchorRef.current) return;
|
|
130
|
+
const anchor = anchorRef.current;
|
|
131
|
+
anchor.style.setProperty('anchor-name', '--anchored-overlay-anchor');
|
|
132
|
+
return () => {
|
|
133
|
+
anchor.style.removeProperty('anchor-name');
|
|
134
|
+
};
|
|
135
|
+
}, [isExternalAnchor, anchorRef]);
|
|
136
|
+
useEffect(() => {
|
|
137
|
+
if (!cssAnchorPositioning || !open || !overlayRef.current || renderAnchor) return;
|
|
138
|
+
const overlay = overlayRef.current;
|
|
139
|
+
try {
|
|
140
|
+
overlay.showPopover();
|
|
141
|
+
} catch {
|
|
142
|
+
// Ignore if popover is already showing or not supported
|
|
143
|
+
}
|
|
144
|
+
}, [cssAnchorPositioning, open, overlayRef, renderAnchor]);
|
|
127
145
|
const showXIcon = onClose && variant.narrow === 'fullscreen' && displayCloseButton;
|
|
128
146
|
const XButtonAriaLabelledBy = closeButtonProps['aria-labelledby'];
|
|
129
147
|
const XButtonAriaLabel = closeButtonProps['aria-label'];
|
|
@@ -131,6 +149,7 @@ const AnchoredOverlay = ({
|
|
|
131
149
|
className: overlayClassName,
|
|
132
150
|
...restOverlayProps
|
|
133
151
|
} = overlayProps || {};
|
|
152
|
+
const popoverId = useId();
|
|
134
153
|
const innerContent = /*#__PURE__*/jsxs(Fragment, {
|
|
135
154
|
children: [renderAnchor && renderAnchor({
|
|
136
155
|
ref: anchorRef,
|
|
@@ -141,7 +160,8 @@ const AnchoredOverlay = ({
|
|
|
141
160
|
onClick: onAnchorClick,
|
|
142
161
|
onKeyDown: onAnchorKeyDown,
|
|
143
162
|
...(cssAnchorPositioning ? {
|
|
144
|
-
|
|
163
|
+
'data-anchor': '',
|
|
164
|
+
popoverTarget: popoverId
|
|
145
165
|
} : {})
|
|
146
166
|
}), open ? /*#__PURE__*/jsxs(Overlay, {
|
|
147
167
|
returnFocusRef: anchorRef,
|
|
@@ -160,6 +180,7 @@ const AnchoredOverlay = ({
|
|
|
160
180
|
preventOverflow: preventOverflow,
|
|
161
181
|
"data-component": "AnchoredOverlay",
|
|
162
182
|
...restOverlayProps,
|
|
183
|
+
id: cssAnchorPositioning ? popoverId : undefined,
|
|
163
184
|
ref: node => {
|
|
164
185
|
if (overlayProps !== null && overlayProps !== void 0 && overlayProps.ref) {
|
|
165
186
|
assignRef(overlayProps.ref, node);
|
|
@@ -193,6 +214,7 @@ const AnchoredOverlay = ({
|
|
|
193
214
|
if (cssAnchorPositioning) {
|
|
194
215
|
return /*#__PURE__*/jsx("div", {
|
|
195
216
|
className: classes.Wrapper,
|
|
217
|
+
"data-external-anchor": isExternalAnchor ? '' : undefined,
|
|
196
218
|
children: innerContent
|
|
197
219
|
});
|
|
198
220
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import './AnchoredOverlay-
|
|
1
|
+
import './AnchoredOverlay-d785da7d.css';
|
|
2
2
|
|
|
3
|
-
var classes = {"ResponsiveCloseButtonContainer":"prc-AnchoredOverlay-ResponsiveCloseButtonContainer-nuium","ResponsiveCloseButton":"prc-AnchoredOverlay-ResponsiveCloseButton-z-2rx","Wrapper":"prc-AnchoredOverlay-Wrapper-w6jU3","
|
|
3
|
+
var classes = {"ResponsiveCloseButtonContainer":"prc-AnchoredOverlay-ResponsiveCloseButtonContainer-nuium","ResponsiveCloseButton":"prc-AnchoredOverlay-ResponsiveCloseButton-z-2rx","Wrapper":"prc-AnchoredOverlay-Wrapper-w6jU3","AnchoredOverlay":"prc-AnchoredOverlay-AnchoredOverlay-fYg9Z"};
|
|
4
4
|
|
|
5
5
|
export { classes as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Overlay.d.ts","sourceRoot":"","sources":["../../src/Overlay/Overlay.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Overlay.d.ts","sourceRoot":"","sources":["../../src/Overlay/Overlay.tsx"],"names":[],"mappings":"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"}
|
package/dist/Overlay/Overlay.js
CHANGED
|
@@ -116,7 +116,7 @@ const BaseOverlay = /*#__PURE__*/React.forwardRef(({
|
|
|
116
116
|
|
|
117
117
|
*/
|
|
118
118
|
const Overlay = /*#__PURE__*/React.forwardRef((t0, forwardedRef) => {
|
|
119
|
-
const $ = c(
|
|
119
|
+
const $ = c(51);
|
|
120
120
|
let anchorSide;
|
|
121
121
|
let ignoreClickRefs;
|
|
122
122
|
let initialFocusRef;
|
|
@@ -272,18 +272,28 @@ const Overlay = /*#__PURE__*/React.forwardRef((t0, forwardedRef) => {
|
|
|
272
272
|
const leftPosition = left === undefined && right === undefined ? 0 : left;
|
|
273
273
|
const t11 = !preventOverflow ? true : undefined;
|
|
274
274
|
let t12;
|
|
275
|
-
if ($[32] !==
|
|
276
|
-
t12 =
|
|
277
|
-
|
|
278
|
-
}
|
|
279
|
-
$[32] =
|
|
275
|
+
if ($[32] !== cssAnchorPositioning) {
|
|
276
|
+
t12 = cssAnchorPositioning && {
|
|
277
|
+
popover: "manual"
|
|
278
|
+
};
|
|
279
|
+
$[32] = cssAnchorPositioning;
|
|
280
280
|
$[33] = t12;
|
|
281
281
|
} else {
|
|
282
282
|
t12 = $[33];
|
|
283
283
|
}
|
|
284
284
|
let t13;
|
|
285
|
-
if ($[34] !==
|
|
286
|
-
t13 =
|
|
285
|
+
if ($[34] !== featureFlagMaxHeightClampToViewport) {
|
|
286
|
+
t13 = featureFlagMaxHeightClampToViewport ? {
|
|
287
|
+
"data-max-height-clamp-to-viewport": ""
|
|
288
|
+
} : {};
|
|
289
|
+
$[34] = featureFlagMaxHeightClampToViewport;
|
|
290
|
+
$[35] = t13;
|
|
291
|
+
} else {
|
|
292
|
+
t13 = $[35];
|
|
293
|
+
}
|
|
294
|
+
let t14;
|
|
295
|
+
if ($[36] !== height || $[37] !== leftPosition || $[38] !== props || $[39] !== responsiveVariant || $[40] !== right || $[41] !== role || $[42] !== t11 || $[43] !== t12 || $[44] !== t13 || $[45] !== visibility || $[46] !== width) {
|
|
296
|
+
t14 = /*#__PURE__*/jsx(BaseOverlay, {
|
|
287
297
|
role: role,
|
|
288
298
|
width: width,
|
|
289
299
|
"data-reflow-container": t11,
|
|
@@ -294,39 +304,41 @@ const Overlay = /*#__PURE__*/React.forwardRef((t0, forwardedRef) => {
|
|
|
294
304
|
visibility: visibility,
|
|
295
305
|
"data-responsive": responsiveVariant,
|
|
296
306
|
...t12,
|
|
307
|
+
...t13,
|
|
297
308
|
...props
|
|
298
309
|
});
|
|
299
|
-
$[
|
|
300
|
-
$[
|
|
301
|
-
$[
|
|
302
|
-
$[
|
|
303
|
-
$[
|
|
304
|
-
$[
|
|
305
|
-
$[
|
|
306
|
-
$[
|
|
307
|
-
$[42] = visibility;
|
|
308
|
-
$[43] = width;
|
|
310
|
+
$[36] = height;
|
|
311
|
+
$[37] = leftPosition;
|
|
312
|
+
$[38] = props;
|
|
313
|
+
$[39] = responsiveVariant;
|
|
314
|
+
$[40] = right;
|
|
315
|
+
$[41] = role;
|
|
316
|
+
$[42] = t11;
|
|
317
|
+
$[43] = t12;
|
|
309
318
|
$[44] = t13;
|
|
319
|
+
$[45] = visibility;
|
|
320
|
+
$[46] = width;
|
|
321
|
+
$[47] = t14;
|
|
310
322
|
} else {
|
|
311
|
-
|
|
323
|
+
t14 = $[47];
|
|
312
324
|
}
|
|
313
|
-
const overlayContent =
|
|
325
|
+
const overlayContent = t14;
|
|
314
326
|
if (cssAnchorPositioning) {
|
|
315
327
|
return overlayContent;
|
|
316
328
|
}
|
|
317
|
-
let
|
|
318
|
-
if ($[
|
|
319
|
-
|
|
329
|
+
let t15;
|
|
330
|
+
if ($[48] !== overlayContent || $[49] !== portalContainerName) {
|
|
331
|
+
t15 = /*#__PURE__*/jsx(Portal, {
|
|
320
332
|
containerName: portalContainerName,
|
|
321
333
|
children: overlayContent
|
|
322
334
|
});
|
|
323
|
-
$[
|
|
324
|
-
$[
|
|
325
|
-
$[
|
|
335
|
+
$[48] = overlayContent;
|
|
336
|
+
$[49] = portalContainerName;
|
|
337
|
+
$[50] = t15;
|
|
326
338
|
} else {
|
|
327
|
-
|
|
339
|
+
t15 = $[50];
|
|
328
340
|
}
|
|
329
|
-
return
|
|
341
|
+
return t15;
|
|
330
342
|
});
|
|
331
343
|
|
|
332
344
|
export { BaseOverlay, Overlay as default, heightMap };
|
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-Wrapper-w6jU3{anchor-scope:--anchored-overlay-anchor}.prc-AnchoredOverlay-Anchor-DWRfK{anchor-name:--anchored-overlay-anchor}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z{position-anchor:--anchored-overlay-anchor;position-try-fallbacks:flip-block,flip-inline,flip-block flip-inline;position-visibility:anchors-visible;position:fixed;z-index:100}.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-top]{bottom:anchor(top);left:anchor(left);margin-bottom:var(--base-size-4,.25rem)}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-left]{margin-right:var(--base-size-4,.25rem);right:anchor(left);top:anchor(top)}.prc-AnchoredOverlay-AnchoredOverlay-fYg9Z[data-side=outside-right]{left:anchor(right);margin-left:var(--base-size-4,.25rem);top:anchor(top)}
|
|
2
|
-
/*# sourceMappingURL=AnchoredOverlay-0f6f45b5.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,mCACE,sCACF,CAEA,kCAEE,qCACF,CAEA,2CAEE,yCAA0C,CAC1C,oEAGwB,CACxB,mCAAoC,CAEpC,cAAe,CADf,WA0BF,CAvBE,qEAGE,iBAAkB,CADlB,oDAEF,CAEA,kEAEE,kBAAmB,CACnB,iBAAkB,CAFlB,uCAGF,CAEA,mEAGE,sCAAgC,CAFhC,kBAAmB,CACnB,eAEF,CAEA,oEACE,kBAAmB,CAEnB,qCAA+B,CAD/B,eAEF","file":"AnchoredOverlay-0f6f45b5.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.Wrapper {\n anchor-scope: --anchored-overlay-anchor;\n}\n\n.Anchor {\n /* Anchor name, this is currently tied to `renderAnchor` */\n anchor-name: --anchored-overlay-anchor;\n}\n\n.AnchoredOverlay {\n /* Anchor position, this is currently tied to `<Overlay>` */\n position-anchor: --anchored-overlay-anchor;\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;\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\n &[data-side='outside-top'] {\n margin-bottom: var(--base-size-4);\n bottom: anchor(top);\n left: anchor(left);\n }\n\n &[data-side='outside-left'] {\n right: anchor(left);\n top: anchor(top);\n margin-right: var(--base-size-4);\n }\n\n &[data-side='outside-right'] {\n left: anchor(right);\n top: anchor(top);\n margin-left: var(--base-size-4);\n }\n}\n"]}
|