victory-core 37.0.2 → 37.1.0

package/lib/victory-portal/portal-context.js

@@ -3,12 +3,42 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.PortalContext = void 0;
+exports.usePortalContext = exports.PortalProvider = exports.PortalContext = void 0;
 var _react = _interopRequireDefault(require("react"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-/**
- * The React context object consumers may use to access the context of the
- * portal.
- */
-const PortalContext = exports.PortalContext = /*#__PURE__*/_react.default.createContext({});
-PortalContext.displayName = "PortalContext";
+const PortalContext = exports.PortalContext = /*#__PURE__*/_react.default.createContext(undefined);
+PortalContext.displayName = "PortalContext";
+const usePortalContext = () => {
+  const context = _react.default.useContext(PortalContext);
+  return context;
+};
+exports.usePortalContext = usePortalContext;
+const PortalProvider = _ref => {
+  let {
+    children
+  } = _ref;
+  const [portalChildren, setPortalChildren] = _react.default.useState(new Map());
+  const addChild = _react.default.useCallback((id, element) => {
+    setPortalChildren(prevChildren => {
+      const nextChildren = new Map(prevChildren);
+      nextChildren.set(id, element);
+      return nextChildren;
+    });
+  }, [setPortalChildren]);
+  const removeChild = _react.default.useCallback(id => {
+    setPortalChildren(prevChildren => {
+      const nextChildren = new Map(prevChildren);
+      nextChildren.delete(id);
+      return nextChildren;
+    });
+  }, [setPortalChildren]);
+  const contextValue = _react.default.useMemo(() => ({
+    addChild,
+    removeChild,
+    children: portalChildren
+  }), [addChild, removeChild, portalChildren]);
+  return /*#__PURE__*/_react.default.createElement(PortalContext.Provider, {
+    value: contextValue
+  }, children);
+};
+exports.PortalProvider = PortalProvider;

package/lib/victory-portal/portal-outlet.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+export interface PortalOutletProps {
+    as: React.ReactElement;
+    width?: number;
+    height?: number;
+    viewBox?: string;
+    preserveAspectRatio?: string;
+    style?: React.CSSProperties;
+    children?: (children: React.ReactElement[]) => React.ReactNode | undefined;
+}
+export declare const PortalOutlet: ({ as: portalComponent, ...props }: PortalOutletProps) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
+//# sourceMappingURL=portal-outlet.d.ts.map

package/lib/victory-portal/portal-outlet.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PortalOutlet = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _portalContext = require("./portal-context");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const PortalOutlet = _ref => {
+  let {
+    as: portalComponent,
+    ...props
+  } = _ref;
+  const portalContext = (0, _portalContext.usePortalContext)();
+  if (!portalContext) {
+    return null;
+  }
+  const children = Array.from(portalContext.children.values());
+  return /*#__PURE__*/_react.default.cloneElement(portalComponent, props, children);
+};
+exports.PortalOutlet = PortalOutlet;

package/lib/victory-portal/portal.d.ts

@@ -1,5 +1,4 @@
 import React from "react";
-import { PortalContextValue } from "./portal-context";
 export interface PortalProps {
     className?: string;
     height?: number;
@@ -7,15 +6,5 @@ export interface PortalProps {
     viewBox?: string;
     width?: number;
 }
-export declare class Portal extends React.Component<PortalProps> implements PortalContextValue {
-    static displayName: string;
-    private readonly map;
-    private index;
-    constructor(props: PortalProps);
-    portalRegister: () => number;
-    portalUpdate: (key: number, element: React.ReactElement) => void;
-    portalDeregister: (key: number) => void;
-    getChildren(): React.ReactElement<any, string | React.JSXElementConstructor<any>>[];
-    render(): JSX.Element;
-}
+export declare const Portal: React.ForwardRefExoticComponent<PortalProps & React.RefAttributes<SVGSVGElement>>;
 //# sourceMappingURL=portal.d.ts.map

package/lib/victory-portal/portal.js

@@ -6,36 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.Portal = void 0;
 var _react = _interopRequireDefault(require("react"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-class Portal extends _react.default.Component {
-  static displayName = "Portal";
-  constructor(props) {
-    super(props);
-    this.map = {};
-    this.index = 1;
-  }
-  portalRegister = () => {
-    return ++this.index;
-  };
-  portalUpdate = (key, element) => {
-    this.map[key] = element;
-    this.forceUpdate();
-  };
-  portalDeregister = key => {
-    delete this.map[key];
-    this.forceUpdate();
-  };
-  getChildren() {
-    return Object.keys(this.map).map(key => {
-      const el = this.map[key];
-      return el ? /*#__PURE__*/_react.default.cloneElement(el, {
-        key
-      }) : el;
-    });
-  }
-
-  // Overridden in victory-core-native
-  render() {
-    return /*#__PURE__*/_react.default.createElement("svg", this.props, this.getChildren());
-  }
-}
-exports.Portal = Portal;
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+const Portal = exports.Portal = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  return /*#__PURE__*/_react.default.createElement("svg", _extends({
+    ref: ref
+  }, props));
+});

package/lib/victory-portal/victory-portal.d.ts

@@ -1,27 +1,10 @@
 import React from "react";
-import { PortalContext } from "./portal-context";
 export interface VictoryPortalProps {
-    children?: React.ReactElement;
+    children: React.ReactElement;
     groupComponent?: React.ReactElement;
 }
-export interface VictoryPortal {
-    context: React.ContextType<typeof PortalContext>;
-}
-export declare class VictoryPortal extends React.Component<VictoryPortalProps> {
-    static displayName: string;
-    static role: string;
-    static defaultProps: {
-        groupComponent: JSX.Element;
-    };
-    static contextType: React.Context<import("./portal-context").PortalContextValue>;
-    private checkedContext;
-    private portalKey;
-    renderInPlace: boolean;
-    element: React.ReactElement;
-    componentDidMount(): void;
-    componentDidUpdate(): void;
-    componentWillUnmount(): void;
-    renderPortal(child: React.ReactElement): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
-    render(): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
-}
+export declare const VictoryPortal: {
+    (initialProps: VictoryPortalProps): any;
+    role: string;
+};
 //# sourceMappingURL=victory-portal.d.ts.map

package/lib/victory-portal/victory-portal.js

@@ -12,57 +12,42 @@ var _portalContext = require("./portal-context");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-class VictoryPortal extends _react.default.Component {
-  static displayName = "VictoryPortal";
-  static role = "portal";
-  static defaultProps = {
-    groupComponent: /*#__PURE__*/_react.default.createElement("g", null)
+const defaultProps = {
+  groupComponent: /*#__PURE__*/_react.default.createElement("g", null)
+};
+const VictoryPortal = initialProps => {
+  const props = {
+    ...defaultProps,
+    ...initialProps
   };
-  static contextType = _portalContext.PortalContext;
-  componentDidMount() {
-    if (!this.checkedContext) {
-      if (typeof this.context.portalUpdate !== "function") {
-        const msg = "`renderInPortal` is not supported outside of `VictoryContainer`. " + "Component will be rendered in place";
-        Log.warn(msg);
-        this.renderInPlace = true;
-      }
-      this.checkedContext = true;
-    }
-    this.forceUpdate();
+  const id = _react.default.useId();
+  const portalContext = (0, _portalContext.usePortalContext)();
+  if (!portalContext) {
+    const msg = "`renderInPortal` is not supported outside of `VictoryContainer`. " + "Component will be rendered in place";
+    Log.warn(msg);
   }
-  componentDidUpdate() {
-    if (!this.renderInPlace) {
-      this.portalKey = this.portalKey || this.context.portalRegister();
-      this.context.portalUpdate(this.portalKey, this.element);
-    }
-  }
-  componentWillUnmount() {
-    if (this.context && this.context.portalDeregister) {
-      this.context.portalDeregister(this.portalKey);
-    }
-  }
-
-  // Overridden in victory-core-native
-  renderPortal(child) {
-    if (this.renderInPlace) {
-      return child;
-    }
-    this.element = child;
-    return null;
-  }
-  render() {
-    const children = Array.isArray(this.props.children) ? this.props.children[0] : this.props.children;
-    const {
-      groupComponent
-    } = this.props;
-    const childProps = children && children.props || {};
-    const standardProps = childProps.groupComponent ? {
-      groupComponent,
-      standalone: false
-    } : {};
-    const newProps = (0, _defaults2.default)(standardProps, childProps, Helpers.omit(this.props, ["children", "groupComponent"]));
-    const child = children && /*#__PURE__*/_react.default.cloneElement(children, newProps);
-    return this.renderPortal(child);
-  }
-}
-exports.VictoryPortal = VictoryPortal;
+  const children = Array.isArray(props.children) ? props.children[0] : props.children;
+  const {
+    groupComponent
+  } = props;
+  const childProps = children && children.props || {};
+  const standardProps = childProps.groupComponent ? {
+    groupComponent,
+    standalone: false
+  } : {};
+  const newProps = (0, _defaults2.default)(standardProps, childProps, Helpers.omit(props, ["children", "groupComponent"]), {
+    key: childProps.key ?? id
+  });
+  const child = children && /*#__PURE__*/_react.default.cloneElement(children, newProps);
+  _react.default.useEffect(() => {
+    portalContext?.addChild(id, child);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [props.children]);
+  _react.default.useEffect(() => {
+    return () => portalContext?.removeChild(id);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  return portalContext ? null : child;
+};
+exports.VictoryPortal = VictoryPortal;
+VictoryPortal.role = "portal";

package/lib/victory-util/index.d.ts

@@ -1,4 +1,5 @@
 export * from "./add-events";
+export * from "./merge-refs";
 export * as Axis from "./axis";
 export * as Collection from "./collection";
 export * from "./common-props";

package/lib/victory-util/index.js

@@ -53,6 +53,18 @@ Object.keys(_addEvents).forEach(function (key) {
     }
   });
 });
+var _mergeRefs = require("./merge-refs");
+Object.keys(_mergeRefs).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _mergeRefs[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _mergeRefs[key];
+    }
+  });
+});
 var _Axis = _interopRequireWildcard(require("./axis"));
 exports.Axis = _Axis;
 var _Collection = _interopRequireWildcard(require("./collection"));

package/lib/victory-util/merge-refs.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+declare type Ref<T> = React.MutableRefObject<T> | React.LegacyRef<T> | undefined | null;
+/**
+ * Used to merge multiple React refs into a single callback ref.
+ *
+ * @example
+ * ```tsx
+ * <div ref={mergeRefs([ref, forwardedRef])} />
+ * ```
+ */
+export declare function mergeRefs<T>(refs: Ref<T>[]): React.RefCallback<T>;
+export {};
+//# sourceMappingURL=merge-refs.d.ts.map

package/lib/victory-util/merge-refs.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.mergeRefs = mergeRefs;
+var Helpers = _interopRequireWildcard(require("./helpers"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/**
+ * Used to merge multiple React refs into a single callback ref.
+ *
+ * @example
+ * ```tsx
+ * <div ref={mergeRefs([ref, forwardedRef])} />
+ * ```
+ */
+function mergeRefs(refs) {
+  return value => {
+    refs.forEach(ref => {
+      // If the ref is a function, it's a callback ref and we call it with the value.
+      if (Helpers.isFunction(ref)) {
+        ref(value);
+      } else if (ref !== null && ref !== undefined) {
+        // If the ref is an object (not null and not undefined), it's an object ref.
+        // We assign the value to its 'current' property.
+        ref.current = value;
+      }
+    });
+  };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "victory-core",
-  "version": "37.0.2",
+  "version": "37.1.0",
   "description": "Victory Core",
   "keywords": [
     "data visualization",
@@ -22,7 +22,7 @@
   "dependencies": {
     "lodash": "^4.17.21",
     "react-fast-compare": "^3.2.0",
-    "victory-vendor": "^37.0.2"
+    "victory-vendor": "37.1.0"
   },
   "peerDependencies": {
     "react": ">=16.6.0"

package/src/index.ts

@@ -9,8 +9,9 @@ export * from "./victory-clip-container/victory-clip-container";
 export * from "./victory-theme/types";
 export * from "./victory-theme/victory-theme";
 export * from "./victory-portal/portal";
-export * from "./victory-portal/portal-context";
 export * from "./victory-portal/victory-portal";
+export * from "./victory-portal/portal-context";
+export * from "./victory-portal/portal-outlet";
 export * from "./victory-primitives";
 export { Border as Box } from "./victory-primitives";
 export type { BorderProps as BoxProps } from "./victory-primitives";

package/src/types/prop-types.ts

@@ -194,3 +194,10 @@ export type CoordinatesPropType = {
   x: number;
   y: number;
 };
+
+export type VictoryEventHandler = (
+  event?: any,
+  targetProps?: any,
+  eventKey?: any,
+  context?: any,
+) => void;