victory-core 36.3.0 → 36.3.2

package/es/index.js

@@ -55,6 +55,8 @@ export { _TextSize as TextSize };
 export { default as Timer } from "./victory-util/timer";
 import * as _Transitions from "./victory-util/transitions";
 export { _Transitions as Transitions };
+import * as _UserProps from "./victory-util/user-props";
+export { _UserProps as UserProps };
 import * as _CommonProps from "./victory-util/common-props";
 export { _CommonProps as CommonProps };
 import * as _Wrapper from "./victory-util/wrapper";

package/es/victory-container/victory-container.js

@@ -29,6 +29,7 @@ import Portal from "../victory-portal/portal";
 import PortalContext from "../victory-portal/portal-context";
 import TimerContext from "../victory-util/timer-context";
 import * as Helpers from "../victory-util/helpers";
+import * as UserProps from "../victory-util/user-props";
 
 var VictoryContainer =
 /*#__PURE__*/
@@ -200,8 +201,9 @@ function (_React$Component) {
           preserveAspectRatio = _props.preserveAspectRatio,
           role = _props.role;
       var style = responsive ? this.props.style : Helpers.omit(this.props.style, ["height", "width"]);
+      var userProps = UserProps.getSafeUserProps(this.props);
 
-      var svgProps = _assign({
+      var svgProps = _assign(_objectSpread({
         width: width,
         height: height,
         tabIndex: tabIndex,
@@ -210,7 +212,7 @@ function (_React$Component) {
         "aria-describedby": [desc && this.getIdForElement("desc"), this.props["aria-describedby"]].filter(Boolean).join(" ") || undefined,
         viewBox: responsive ? "0 0 ".concat(width, " ").concat(height) : undefined,
         preserveAspectRatio: responsive ? preserveAspectRatio : undefined
-      }, events);
+      }, userProps), events);
 
       return this.renderContainer(this.props, svgProps, style);
     }

package/es/victory-util/add-events.js

@@ -33,6 +33,7 @@ import React from "react";
 import * as Events from "./events";
 import isEqual from "react-fast-compare";
 import VictoryTransition from "../victory-transition/victory-transition";
+import * as UserProps from "../victory-util/user-props";
 
 var datumHasXandY = function (datum) {
   return !_isNil(datum._x) && !_isNil(datum._y);
@@ -379,6 +380,7 @@ export default (function (WrappedComponent, options) {
           var dataComponent = props.dataComponent,
               labelComponent = props.labelComponent,
               groupComponent = props.groupComponent;
+          var userProps = UserProps.getSafeUserProps(props);
           var dataComponents = this.dataKeys.reduce(function (validDataComponents, _dataKey, index) {
             var dataProps = _this9.getComponentProps(dataComponent, "data", index);
 
@@ -400,7 +402,8 @@ export default (function (WrappedComponent, options) {
 
           var children = _toConsumableArray(dataComponents).concat(_toConsumableArray(labelComponents));
 
-          return this.renderContainer(groupComponent, children);
+          var group = React.cloneElement(groupComponent, userProps, children);
+          return this.renderContainer(group, children);
         }
       }]);
 

package/es/victory-util/user-props.js

@@ -0,0 +1,83 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
+
+function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+/*
+  USER_PROPS_SAFELIST is to contain any string deemed safe for user props.
+  The startsWidth array will contain the start of any accepted user-prop that 
+  starts with these characters.
+  The exactMatch will contain a list of exact prop names that are accepted.
+*/
+var USER_PROPS_SAFELIST = {
+  startsWith: ["data-", "aria-"],
+  exactMatch: []
+};
+/**
+ * doesPropStartWith: Function that takes a prop's key and runs it against all
+ * options in the USER_PROPS_SAFELIST and checks to see if it starts with any
+ * of those options.
+ * @param {string} key: prop key to be tested against whitelist
+ * @returns {Boolean}: returns true if the key starts with an option or false if
+ * otherwise
+ */
+
+var doesPropStartWith = function (key) {
+  var startsWith = false;
+  USER_PROPS_SAFELIST.startsWith.forEach(function (starterString) {
+    var regex = new RegExp("\\b(".concat(starterString, ")(\\w|-)+"), "g");
+    if (regex.test(key)) startsWith = true;
+  });
+  return startsWith;
+};
+/**
+ * isExactMatch: checks to see if the given key matches any of the 'exactMatch'
+ * items in the whitelist
+ * @param {String} key: prop key to be tested against the whitelist-exact match
+ * array.
+ * @returns {Boolean}: return true if whitelist contains that key, otherwise
+ * returns false.
+ */
+
+
+var isExactMatch = function (key) {
+  return USER_PROPS_SAFELIST.exactMatch.includes(key);
+};
+/**
+ * testIfSafeProp: tests prop's key against both startsWith and exactMatch values
+ * @param {String} key: prop key to be tested against the whitelist
+ * @returns {Boolean}: returns true if found in whitelist, otherwise returns false
+ */
+
+
+var testIfSafeProp = function (key) {
+  if (doesPropStartWith(key) || isExactMatch(key)) return true;
+  return false;
+};
+/**
+ * getSafeUserProps - function that takes in a props object and removes any
+ * key-value entries that do not match filter strings in the USER_PROPS_SAFELIST
+ * object.
+ *
+ * @param {Object} props: props to be filtered against USER_PROPS_SAFELIST
+ * @returns {Object}: object containing remaining acceptable props
+ */
+
+
+export var getSafeUserProps = function (props) {
+  var propsToFilter = _objectSpread({}, props);
+
+  return Object.fromEntries(Object.entries(propsToFilter).filter(function (_ref) {
+    var _ref2 = _slicedToArray(_ref, 1),
+        key = _ref2[0];
+
+    return testIfSafeProp(key);
+  }));
+};

package/lib/index.js

@@ -171,7 +171,7 @@ Object.defineProperty(exports, "PointPathHelpers", {
     return _pointPathHelpers.default;
   }
 });
-exports.LineHelpers = exports.Hooks = exports.Axis = exports.Wrapper = exports.CommonProps = exports.Transitions = exports.TextSize = exports.Style = exports.Selection = exports.Scale = exports.PropTypes = exports.Log = exports.LabelHelpers = exports.Immutable = exports.Helpers = exports.Events = exports.Domain = exports.DefaultTransitions = exports.Data = exports.Collection = void 0;
+exports.LineHelpers = exports.Hooks = exports.Axis = exports.Wrapper = exports.CommonProps = exports.UserProps = exports.Transitions = exports.TextSize = exports.Style = exports.Selection = exports.Scale = exports.PropTypes = exports.Log = exports.LabelHelpers = exports.Immutable = exports.Helpers = exports.Events = exports.Domain = exports.DefaultTransitions = exports.Data = exports.Collection = void 0;
 
 var _victoryAccessibleGroup = _interopRequireDefault(require("./victory-accessible-group/victory-accessible-group"));
 
@@ -281,6 +281,10 @@ var _Transitions = _interopRequireWildcard(require("./victory-util/transitions")
 
 exports.Transitions = _Transitions;
 
+var _UserProps = _interopRequireWildcard(require("./victory-util/user-props"));
+
+exports.UserProps = _UserProps;
+
 var _CommonProps = _interopRequireWildcard(require("./victory-util/common-props"));
 
 exports.CommonProps = _CommonProps;

package/lib/victory-container/victory-container.js

@@ -29,6 +29,8 @@ var _timerContext = _interopRequireDefault(require("../victory-util/timer-contex
 
 var Helpers = _interopRequireWildcard(require("../victory-util/helpers"));
 
+var UserProps = _interopRequireWildcard(require("../victory-util/user-props"));
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -216,7 +218,8 @@ function (_React$Component) {
           preserveAspectRatio = _props.preserveAspectRatio,
           role = _props.role;
       var style = responsive ? this.props.style : Helpers.omit(this.props.style, ["height", "width"]);
-      var svgProps = (0, _assign2.default)({
+      var userProps = UserProps.getSafeUserProps(this.props);
+      var svgProps = (0, _assign2.default)(_objectSpread({
         width: width,
         height: height,
         tabIndex: tabIndex,
@@ -225,7 +228,7 @@ function (_React$Component) {
         "aria-describedby": [desc && this.getIdForElement("desc"), this.props["aria-describedby"]].filter(Boolean).join(" ") || undefined,
         viewBox: responsive ? "0 0 ".concat(width, " ").concat(height) : undefined,
         preserveAspectRatio: responsive ? preserveAspectRatio : undefined
-      }, events);
+      }, userProps), events);
       return this.renderContainer(this.props, svgProps, style);
     }
   }]);

package/lib/victory-util/add-events.js

@@ -31,6 +31,8 @@ var _reactFastCompare = _interopRequireDefault(require("react-fast-compare"));
 
 var _victoryTransition = _interopRequireDefault(require("../victory-transition/victory-transition"));
 
+var UserProps = _interopRequireWildcard(require("../victory-util/user-props"));
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -383,6 +385,7 @@ var _default = function _default(WrappedComponent, options) {
           var dataComponent = props.dataComponent,
               labelComponent = props.labelComponent,
               groupComponent = props.groupComponent;
+          var userProps = UserProps.getSafeUserProps(props);
           var dataComponents = this.dataKeys.reduce(function (validDataComponents, _dataKey, index) {
             var dataProps = _this9.getComponentProps(dataComponent, "data", index);
 
@@ -404,7 +407,9 @@ var _default = function _default(WrappedComponent, options) {
 
           var children = _toConsumableArray(dataComponents).concat(_toConsumableArray(labelComponents));
 
-          return this.renderContainer(groupComponent, children);
+          var group = _react.default.cloneElement(groupComponent, userProps, children);
+
+          return this.renderContainer(group, children);
         }
       }]);
 

package/lib/victory-util/user-props.js

@@ -0,0 +1,92 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getSafeUserProps = void 0;
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
+
+function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+/*
+  USER_PROPS_SAFELIST is to contain any string deemed safe for user props.
+  The startsWidth array will contain the start of any accepted user-prop that 
+  starts with these characters.
+  The exactMatch will contain a list of exact prop names that are accepted.
+*/
+var USER_PROPS_SAFELIST = {
+  startsWith: ["data-", "aria-"],
+  exactMatch: []
+};
+/**
+ * doesPropStartWith: Function that takes a prop's key and runs it against all
+ * options in the USER_PROPS_SAFELIST and checks to see if it starts with any
+ * of those options.
+ * @param {string} key: prop key to be tested against whitelist
+ * @returns {Boolean}: returns true if the key starts with an option or false if
+ * otherwise
+ */
+
+var doesPropStartWith = function (key) {
+  var startsWith = false;
+  USER_PROPS_SAFELIST.startsWith.forEach(function (starterString) {
+    var regex = new RegExp("\\b(".concat(starterString, ")(\\w|-)+"), "g");
+    if (regex.test(key)) startsWith = true;
+  });
+  return startsWith;
+};
+/**
+ * isExactMatch: checks to see if the given key matches any of the 'exactMatch'
+ * items in the whitelist
+ * @param {String} key: prop key to be tested against the whitelist-exact match
+ * array.
+ * @returns {Boolean}: return true if whitelist contains that key, otherwise
+ * returns false.
+ */
+
+
+var isExactMatch = function (key) {
+  return USER_PROPS_SAFELIST.exactMatch.includes(key);
+};
+/**
+ * testIfSafeProp: tests prop's key against both startsWith and exactMatch values
+ * @param {String} key: prop key to be tested against the whitelist
+ * @returns {Boolean}: returns true if found in whitelist, otherwise returns false
+ */
+
+
+var testIfSafeProp = function (key) {
+  if (doesPropStartWith(key) || isExactMatch(key)) return true;
+  return false;
+};
+/**
+ * getSafeUserProps - function that takes in a props object and removes any
+ * key-value entries that do not match filter strings in the USER_PROPS_SAFELIST
+ * object.
+ *
+ * @param {Object} props: props to be filtered against USER_PROPS_SAFELIST
+ * @returns {Object}: object containing remaining acceptable props
+ */
+
+
+var getSafeUserProps = function (props) {
+  var propsToFilter = _objectSpread({}, props);
+
+  return Object.fromEntries(Object.entries(propsToFilter).filter(function (_ref) {
+    var _ref2 = _slicedToArray(_ref, 1),
+        key = _ref2[0];
+
+    return testIfSafeProp(key);
+  }));
+};
+
+exports.getSafeUserProps = getSafeUserProps;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "victory-core",
-  "version": "36.3.0",
+  "version": "36.3.2",
   "description": "Victory Core",
   "keywords": [
     "data visualization",
@@ -38,5 +38,5 @@
     "version": "yarn run nps build-libs && nps build-dists"
   },
   "sideEffects": false,
-  "gitHead": "ebafd849d2ded3f1d2aabf0d6e64dcbd48e4c9d6"
+  "gitHead": "18895d1290245732d14332bbbda10336032c9aab"
 }

package/src/index.js

@@ -39,6 +39,7 @@ export * as Style from "./victory-util/style";
 export * as TextSize from "./victory-util/textsize";
 export { default as Timer } from "./victory-util/timer";
 export * as Transitions from "./victory-util/transitions";
+export * as UserProps from "./victory-util/user-props";
 export * as CommonProps from "./victory-util/common-props";
 export * as Wrapper from "./victory-util/wrapper";
 export * as Axis from "./victory-util/axis";

package/src/victory-container/victory-container.js

@@ -6,6 +6,7 @@ import Portal from "../victory-portal/portal";
 import PortalContext from "../victory-portal/portal-context";
 import TimerContext from "../victory-util/timer-context";
 import * as Helpers from "../victory-util/helpers";
+import * as UserProps from "../victory-util/user-props";
 
 export default class VictoryContainer extends React.Component {
   static displayName = "VictoryContainer";
@@ -192,9 +193,13 @@ export default class VictoryContainer extends React.Component {
       preserveAspectRatio,
       role
     } = this.props;
+
     const style = responsive
       ? this.props.style
       : Helpers.omit(this.props.style, ["height", "width"]);
+
+    const userProps = UserProps.getSafeUserProps(this.props);
+
     const svgProps = assign(
       {
         width,
@@ -213,7 +218,8 @@ export default class VictoryContainer extends React.Component {
             .filter(Boolean)
             .join(" ") || undefined,
         viewBox: responsive ? `0 0 ${width} ${height}` : undefined,
-        preserveAspectRatio: responsive ? preserveAspectRatio : undefined
+        preserveAspectRatio: responsive ? preserveAspectRatio : undefined,
+        ...userProps
       },
       events
     );

package/src/victory-util/add-events.js

@@ -14,6 +14,7 @@ import {
 import * as Events from "./events";
 import isEqual from "react-fast-compare";
 import VictoryTransition from "../victory-transition/victory-transition";
+import * as UserProps from "../victory-util/user-props";
 
 const datumHasXandY = (datum) => {
   return !isNil(datum._x) && !isNil(datum._y);
@@ -274,10 +275,12 @@ export default (WrappedComponent, options) => {
       const parentProps = isContainer
         ? this.getComponentProps(component, "parent", "parent")
         : {};
+
       if (parentProps.events) {
         this.globalEvents = Events.getGlobalEvents(parentProps.events);
         parentProps.events = Events.omitGlobalEvents(parentProps.events);
       }
+
       return React.cloneElement(component, parentProps, children);
     }
 
@@ -327,7 +330,7 @@ export default (WrappedComponent, options) => {
 
     renderData(props, shouldRenderDatum = datumHasXandY) {
       const { dataComponent, labelComponent, groupComponent } = props;
-
+      const userProps = UserProps.getSafeUserProps(props);
       const dataComponents = this.dataKeys.reduce(
         (validDataComponents, _dataKey, index) => {
           const dataProps = this.getComponentProps(
@@ -360,7 +363,8 @@ export default (WrappedComponent, options) => {
         .filter(Boolean);
 
       const children = [...dataComponents, ...labelComponents];
-      return this.renderContainer(groupComponent, children);
+      const group = React.cloneElement(groupComponent, userProps, children);
+      return this.renderContainer(group, children);
     }
   };
 };

package/src/victory-util/user-props.js

@@ -0,0 +1,64 @@
+/*
+  USER_PROPS_SAFELIST is to contain any string deemed safe for user props.
+  The startsWidth array will contain the start of any accepted user-prop that 
+  starts with these characters.
+  The exactMatch will contain a list of exact prop names that are accepted.
+*/
+const USER_PROPS_SAFELIST = {
+  startsWith: ["data-", "aria-"],
+  exactMatch: []
+};
+
+/**
+ * doesPropStartWith: Function that takes a prop's key and runs it against all
+ * options in the USER_PROPS_SAFELIST and checks to see if it starts with any
+ * of those options.
+ * @param {string} key: prop key to be tested against whitelist
+ * @returns {Boolean}: returns true if the key starts with an option or false if
+ * otherwise
+ */
+const doesPropStartWith = (key) => {
+  let startsWith = false;
+
+  USER_PROPS_SAFELIST.startsWith.forEach((starterString) => {
+    const regex = new RegExp(`\\b(${starterString})(\\w|-)+`, "g");
+    if (regex.test(key)) startsWith = true;
+  });
+
+  return startsWith;
+};
+
+/**
+ * isExactMatch: checks to see if the given key matches any of the 'exactMatch'
+ * items in the whitelist
+ * @param {String} key: prop key to be tested against the whitelist-exact match
+ * array.
+ * @returns {Boolean}: return true if whitelist contains that key, otherwise
+ * returns false.
+ */
+const isExactMatch = (key) => USER_PROPS_SAFELIST.exactMatch.includes(key);
+
+/**
+ * testIfSafeProp: tests prop's key against both startsWith and exactMatch values
+ * @param {String} key: prop key to be tested against the whitelist
+ * @returns {Boolean}: returns true if found in whitelist, otherwise returns false
+ */
+const testIfSafeProp = (key) => {
+  if (doesPropStartWith(key) || isExactMatch(key)) return true;
+  return false;
+};
+
+/**
+ * getSafeUserProps - function that takes in a props object and removes any
+ * key-value entries that do not match filter strings in the USER_PROPS_SAFELIST
+ * object.
+ *
+ * @param {Object} props: props to be filtered against USER_PROPS_SAFELIST
+ * @returns {Object}: object containing remaining acceptable props
+ */
+export const getSafeUserProps = (props) => {
+  const propsToFilter = { ...props };
+  return Object.fromEntries(
+    Object.entries(propsToFilter).filter(([key]) => testIfSafeProp(key))
+  );
+};