UEA-PRODEM
This commit is contained in:
+5
@@ -8,6 +8,11 @@ declare const SIDE_OPTIONS: readonly ["top", "right", "bottom", "left"];
|
||||
declare const ALIGN_OPTIONS: readonly ["start", "center", "end"];
|
||||
type Side = (typeof SIDE_OPTIONS)[number];
|
||||
type Align = (typeof ALIGN_OPTIONS)[number];
|
||||
declare module 'react' {
|
||||
interface CSSProperties {
|
||||
[varName: `--radix-${string}`]: string | number | undefined | null;
|
||||
}
|
||||
}
|
||||
declare const createPopperScope: _radix_ui_react_context.CreateScope;
|
||||
interface PopperProps {
|
||||
children?: React.ReactNode;
|
||||
|
||||
+5
@@ -8,6 +8,11 @@ declare const SIDE_OPTIONS: readonly ["top", "right", "bottom", "left"];
|
||||
declare const ALIGN_OPTIONS: readonly ["start", "center", "end"];
|
||||
type Side = (typeof SIDE_OPTIONS)[number];
|
||||
type Align = (typeof ALIGN_OPTIONS)[number];
|
||||
declare module 'react' {
|
||||
interface CSSProperties {
|
||||
[varName: `--radix-${string}`]: string | number | undefined | null;
|
||||
}
|
||||
}
|
||||
declare const createPopperScope: _radix_ui_react_context.CreateScope;
|
||||
interface PopperProps {
|
||||
children?: React.ReactNode;
|
||||
|
||||
+53
-10
@@ -64,7 +64,18 @@ var [PopperProvider, usePopperContext] = createPopperContext(POPPER_NAME);
|
||||
var Popper = (props) => {
|
||||
const { __scopePopper, children } = props;
|
||||
const [anchor, setAnchor] = React.useState(null);
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperProvider, { scope: __scopePopper, anchor, onAnchorChange: setAnchor, children });
|
||||
const [placementState, setPlacementState] = React.useState(void 0);
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
||||
PopperProvider,
|
||||
{
|
||||
scope: __scopePopper,
|
||||
anchor,
|
||||
onAnchorChange: setAnchor,
|
||||
placementState,
|
||||
setPlacementState,
|
||||
children
|
||||
}
|
||||
);
|
||||
};
|
||||
Popper.displayName = POPPER_NAME;
|
||||
var ANCHOR_NAME = "PopperAnchor";
|
||||
@@ -73,16 +84,40 @@ var PopperAnchor = React.forwardRef(
|
||||
const { __scopePopper, virtualRef, ...anchorProps } = props;
|
||||
const context = usePopperContext(ANCHOR_NAME, __scopePopper);
|
||||
const ref = React.useRef(null);
|
||||
const composedRefs = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, ref);
|
||||
const onAnchorChange = context.onAnchorChange;
|
||||
const callbackRef = React.useCallback(
|
||||
(node) => {
|
||||
ref.current = node;
|
||||
if (node) {
|
||||
onAnchorChange(node);
|
||||
}
|
||||
},
|
||||
[onAnchorChange]
|
||||
);
|
||||
const composedRefs = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, callbackRef);
|
||||
const anchorRef = React.useRef(null);
|
||||
React.useEffect(() => {
|
||||
if (!virtualRef) {
|
||||
return;
|
||||
}
|
||||
const previousAnchor = anchorRef.current;
|
||||
anchorRef.current = virtualRef?.current || ref.current;
|
||||
anchorRef.current = virtualRef.current;
|
||||
if (previousAnchor !== anchorRef.current) {
|
||||
context.onAnchorChange(anchorRef.current);
|
||||
onAnchorChange(anchorRef.current);
|
||||
}
|
||||
});
|
||||
return virtualRef ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_primitive.Primitive.div, { ...anchorProps, ref: composedRefs });
|
||||
const sideAndAlign = context.placementState && getSideAndAlignFromPlacement(context.placementState);
|
||||
const placedSide = sideAndAlign?.[0];
|
||||
const placedAlign = sideAndAlign?.[1];
|
||||
return virtualRef ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
||||
import_react_primitive.Primitive.div,
|
||||
{
|
||||
"data-radix-popper-side": placedSide,
|
||||
"data-radix-popper-align": placedAlign,
|
||||
...anchorProps,
|
||||
ref: composedRefs
|
||||
}
|
||||
);
|
||||
}
|
||||
);
|
||||
PopperAnchor.displayName = ANCHOR_NAME;
|
||||
@@ -98,7 +133,7 @@ var PopperContent = React.forwardRef(
|
||||
alignOffset = 0,
|
||||
arrowPadding = 0,
|
||||
avoidCollisions = true,
|
||||
collisionBoundary = [],
|
||||
collisionBoundary,
|
||||
collisionPadding: collisionPaddingProp = 0,
|
||||
sticky = "partial",
|
||||
hideWhenDetached = false,
|
||||
@@ -115,11 +150,11 @@ var PopperContent = React.forwardRef(
|
||||
const arrowHeight = arrowSize?.height ?? 0;
|
||||
const desiredPlacement = side + (align !== "center" ? "-" + align : "");
|
||||
const collisionPadding = typeof collisionPaddingProp === "number" ? collisionPaddingProp : { top: 0, right: 0, bottom: 0, left: 0, ...collisionPaddingProp };
|
||||
const boundary = Array.isArray(collisionBoundary) ? collisionBoundary : [collisionBoundary];
|
||||
const hasExplicitBoundaries = boundary.length > 0;
|
||||
const boundary = collisionBoundary ? Array.isArray(collisionBoundary) ? collisionBoundary : [collisionBoundary] : void 0;
|
||||
const hasExplicitBoundaries = boundary !== void 0 && boundary.length > 0;
|
||||
const detectOverflowOptions = {
|
||||
padding: collisionPadding,
|
||||
boundary: boundary.filter(isNotNull),
|
||||
boundary: boundary?.filter(isNotNull),
|
||||
// with `strategy: 'fixed'`, this is the only way to get it to respect boundaries
|
||||
altBoundary: hasExplicitBoundaries
|
||||
};
|
||||
@@ -161,6 +196,13 @@ var PopperContent = React.forwardRef(
|
||||
hideWhenDetached && (0, import_react_dom.hide)({ strategy: "referenceHidden", ...detectOverflowOptions })
|
||||
]
|
||||
});
|
||||
const setPlacementState = context.setPlacementState;
|
||||
(0, import_react_use_layout_effect.useLayoutEffect)(() => {
|
||||
setPlacementState(placement);
|
||||
return () => {
|
||||
setPlacementState(void 0);
|
||||
};
|
||||
}, [placement, setPlacementState]);
|
||||
const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
|
||||
const handlePlaced = (0, import_react_use_callback_ref.useCallbackRef)(onPlaced);
|
||||
(0, import_react_use_layout_effect.useLayoutEffect)(() => {
|
||||
@@ -186,7 +228,7 @@ var PopperContent = React.forwardRef(
|
||||
// keep off the page when measuring
|
||||
minWidth: "max-content",
|
||||
zIndex: contentZIndex,
|
||||
["--radix-popper-transform-origin"]: [
|
||||
"--radix-popper-transform-origin": [
|
||||
middlewareData.transformOrigin?.x,
|
||||
middlewareData.transformOrigin?.y
|
||||
].join(" "),
|
||||
@@ -204,6 +246,7 @@ var PopperContent = React.forwardRef(
|
||||
{
|
||||
scope: __scopePopper,
|
||||
placedSide,
|
||||
placedAlign,
|
||||
onArrowChange: setArrow,
|
||||
arrowX,
|
||||
arrowY,
|
||||
|
||||
+2
-2
File diff suppressed because one or more lines are too long
+53
-10
@@ -29,7 +29,18 @@ var [PopperProvider, usePopperContext] = createPopperContext(POPPER_NAME);
|
||||
var Popper = (props) => {
|
||||
const { __scopePopper, children } = props;
|
||||
const [anchor, setAnchor] = React.useState(null);
|
||||
return /* @__PURE__ */ jsx(PopperProvider, { scope: __scopePopper, anchor, onAnchorChange: setAnchor, children });
|
||||
const [placementState, setPlacementState] = React.useState(void 0);
|
||||
return /* @__PURE__ */ jsx(
|
||||
PopperProvider,
|
||||
{
|
||||
scope: __scopePopper,
|
||||
anchor,
|
||||
onAnchorChange: setAnchor,
|
||||
placementState,
|
||||
setPlacementState,
|
||||
children
|
||||
}
|
||||
);
|
||||
};
|
||||
Popper.displayName = POPPER_NAME;
|
||||
var ANCHOR_NAME = "PopperAnchor";
|
||||
@@ -38,16 +49,40 @@ var PopperAnchor = React.forwardRef(
|
||||
const { __scopePopper, virtualRef, ...anchorProps } = props;
|
||||
const context = usePopperContext(ANCHOR_NAME, __scopePopper);
|
||||
const ref = React.useRef(null);
|
||||
const composedRefs = useComposedRefs(forwardedRef, ref);
|
||||
const onAnchorChange = context.onAnchorChange;
|
||||
const callbackRef = React.useCallback(
|
||||
(node) => {
|
||||
ref.current = node;
|
||||
if (node) {
|
||||
onAnchorChange(node);
|
||||
}
|
||||
},
|
||||
[onAnchorChange]
|
||||
);
|
||||
const composedRefs = useComposedRefs(forwardedRef, callbackRef);
|
||||
const anchorRef = React.useRef(null);
|
||||
React.useEffect(() => {
|
||||
if (!virtualRef) {
|
||||
return;
|
||||
}
|
||||
const previousAnchor = anchorRef.current;
|
||||
anchorRef.current = virtualRef?.current || ref.current;
|
||||
anchorRef.current = virtualRef.current;
|
||||
if (previousAnchor !== anchorRef.current) {
|
||||
context.onAnchorChange(anchorRef.current);
|
||||
onAnchorChange(anchorRef.current);
|
||||
}
|
||||
});
|
||||
return virtualRef ? null : /* @__PURE__ */ jsx(Primitive.div, { ...anchorProps, ref: composedRefs });
|
||||
const sideAndAlign = context.placementState && getSideAndAlignFromPlacement(context.placementState);
|
||||
const placedSide = sideAndAlign?.[0];
|
||||
const placedAlign = sideAndAlign?.[1];
|
||||
return virtualRef ? null : /* @__PURE__ */ jsx(
|
||||
Primitive.div,
|
||||
{
|
||||
"data-radix-popper-side": placedSide,
|
||||
"data-radix-popper-align": placedAlign,
|
||||
...anchorProps,
|
||||
ref: composedRefs
|
||||
}
|
||||
);
|
||||
}
|
||||
);
|
||||
PopperAnchor.displayName = ANCHOR_NAME;
|
||||
@@ -63,7 +98,7 @@ var PopperContent = React.forwardRef(
|
||||
alignOffset = 0,
|
||||
arrowPadding = 0,
|
||||
avoidCollisions = true,
|
||||
collisionBoundary = [],
|
||||
collisionBoundary,
|
||||
collisionPadding: collisionPaddingProp = 0,
|
||||
sticky = "partial",
|
||||
hideWhenDetached = false,
|
||||
@@ -80,11 +115,11 @@ var PopperContent = React.forwardRef(
|
||||
const arrowHeight = arrowSize?.height ?? 0;
|
||||
const desiredPlacement = side + (align !== "center" ? "-" + align : "");
|
||||
const collisionPadding = typeof collisionPaddingProp === "number" ? collisionPaddingProp : { top: 0, right: 0, bottom: 0, left: 0, ...collisionPaddingProp };
|
||||
const boundary = Array.isArray(collisionBoundary) ? collisionBoundary : [collisionBoundary];
|
||||
const hasExplicitBoundaries = boundary.length > 0;
|
||||
const boundary = collisionBoundary ? Array.isArray(collisionBoundary) ? collisionBoundary : [collisionBoundary] : void 0;
|
||||
const hasExplicitBoundaries = boundary !== void 0 && boundary.length > 0;
|
||||
const detectOverflowOptions = {
|
||||
padding: collisionPadding,
|
||||
boundary: boundary.filter(isNotNull),
|
||||
boundary: boundary?.filter(isNotNull),
|
||||
// with `strategy: 'fixed'`, this is the only way to get it to respect boundaries
|
||||
altBoundary: hasExplicitBoundaries
|
||||
};
|
||||
@@ -126,6 +161,13 @@ var PopperContent = React.forwardRef(
|
||||
hideWhenDetached && hide({ strategy: "referenceHidden", ...detectOverflowOptions })
|
||||
]
|
||||
});
|
||||
const setPlacementState = context.setPlacementState;
|
||||
useLayoutEffect(() => {
|
||||
setPlacementState(placement);
|
||||
return () => {
|
||||
setPlacementState(void 0);
|
||||
};
|
||||
}, [placement, setPlacementState]);
|
||||
const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
|
||||
const handlePlaced = useCallbackRef(onPlaced);
|
||||
useLayoutEffect(() => {
|
||||
@@ -151,7 +193,7 @@ var PopperContent = React.forwardRef(
|
||||
// keep off the page when measuring
|
||||
minWidth: "max-content",
|
||||
zIndex: contentZIndex,
|
||||
["--radix-popper-transform-origin"]: [
|
||||
"--radix-popper-transform-origin": [
|
||||
middlewareData.transformOrigin?.x,
|
||||
middlewareData.transformOrigin?.y
|
||||
].join(" "),
|
||||
@@ -169,6 +211,7 @@ var PopperContent = React.forwardRef(
|
||||
{
|
||||
scope: __scopePopper,
|
||||
placedSide,
|
||||
placedAlign,
|
||||
onArrowChange: setArrow,
|
||||
arrowX,
|
||||
arrowY,
|
||||
|
||||
+2
-2
File diff suppressed because one or more lines are too long
+19
-19
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@radix-ui/react-popper",
|
||||
"version": "1.2.8",
|
||||
"version": "1.3.0",
|
||||
"license": "MIT",
|
||||
"source": "./src/index.ts",
|
||||
"main": "./dist/index.js",
|
||||
@@ -12,25 +12,23 @@
|
||||
"sideEffects": false,
|
||||
"dependencies": {
|
||||
"@floating-ui/react-dom": "^2.0.0",
|
||||
"@radix-ui/react-compose-refs": "1.1.2",
|
||||
"@radix-ui/react-arrow": "1.1.7",
|
||||
"@radix-ui/react-primitive": "2.1.3",
|
||||
"@radix-ui/react-context": "1.1.2",
|
||||
"@radix-ui/react-use-layout-effect": "1.1.1",
|
||||
"@radix-ui/react-use-rect": "1.1.1",
|
||||
"@radix-ui/react-use-size": "1.1.1",
|
||||
"@radix-ui/rect": "1.1.1",
|
||||
"@radix-ui/react-use-callback-ref": "1.1.1"
|
||||
"@radix-ui/react-arrow": "1.1.9",
|
||||
"@radix-ui/react-context": "1.1.4",
|
||||
"@radix-ui/react-compose-refs": "1.1.3",
|
||||
"@radix-ui/react-use-callback-ref": "1.1.2",
|
||||
"@radix-ui/react-primitive": "2.1.5",
|
||||
"@radix-ui/react-use-layout-effect": "1.1.2",
|
||||
"@radix-ui/react-use-rect": "1.1.2",
|
||||
"@radix-ui/react-use-size": "1.1.2",
|
||||
"@radix-ui/rect": "1.1.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^19.0.7",
|
||||
"@types/react-dom": "^19.0.3",
|
||||
"eslint": "^9.18.0",
|
||||
"react": "^19.1.0",
|
||||
"react-dom": "^19.1.0",
|
||||
"typescript": "^5.7.3",
|
||||
"@types/react": "^19.2.2",
|
||||
"@types/react-dom": "^19.2.2",
|
||||
"react": "^19.2.0",
|
||||
"react-dom": "^19.2.0",
|
||||
"typescript": "^5.9.3",
|
||||
"@repo/builder": "0.0.0",
|
||||
"@repo/eslint-config": "0.0.0",
|
||||
"@repo/typescript-config": "0.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
@@ -50,14 +48,16 @@
|
||||
"homepage": "https://radix-ui.com/primitives",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/radix-ui/primitives.git"
|
||||
"url": "git+https://github.com/radix-ui/primitives.git",
|
||||
"directory": "packages/react/popper"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/radix-ui/primitives/issues"
|
||||
},
|
||||
"scripts": {
|
||||
"lint": "eslint --max-warnings 0 src",
|
||||
"lint": "oxlint --max-warnings 0 src",
|
||||
"clean": "rm -rf dist",
|
||||
"reset": "rm -rf dist node_modules",
|
||||
"typecheck": "tsc --noEmit",
|
||||
"build": "radix-build"
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user