@instructure/ui-responsive 11.7.8 → 11.7.9-pr-snapshot-1792147648392

package/es/utils/v1/addMediaQueryMatchListener.js

@@ -1,108 +1,32 @@
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2015 - present Instructure, Inc.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- */
 import { matchMedia as defaultMatchMedia } from '@instructure/ui-dom-utils';
 import { jsonToMediaQuery } from './jsonToMediaQuery.js';
-
-/**
- * ---
- * category: utilities/layout
- * ---
- * Given an object of named queries, listens for changes in the
- * window size and notifies which queries match via a function
- * callback. The callback method is only called when the query
- * matches change, not on all window resizes.
- *
- * This function shares an interface with
- * [addElementQueryMatchListener](addElementQueryMatchListener)
- * so that they can be used interchangeably.
- *
- * The [Responsive](Responsive) component with the `match` prop
- * set to `media` utilizes this function. This is a low level utility
- * method and, in most cases, [Responsive](Responsive) should be
- * used instead.
- *
- * ```js-code
- * class MyComponent extends Component {
- *   state = {
- *     matches: []
- *   }
- *
- *   _listener = null
- *
- *   componentDidMount () {
- *     const query = {myFirstQuery: { minWidth: 100 }, mySecondQuery: { maxHeight: '30rem'}}
- *     const el = findDOMNode(this)
- *
- *     this._listener = addMediaQueryMatchListener(query, el, this.updateMatches)
- *   }
- *
- *   componentWillUnmount () {
- *     if (this._listener) {
- *       this._listener.remove()
- *     }
- *   }
- *
- *   updateMatches = (matches) => {
- *     this.setState({ matches })
- *   }
- *   ...
- * }
- * ```
- * @module addMediaQueryMatchListener
- * @param {Object} query - object consisting of names and query objects
- * @param {Node|Window|React.ReactElement|React.Component|function} el - a DOM node or a function returning a DOM node
- * @param {function} cb - called with an array of the names of the currently matching queries whenever a matching query changes
- * @param {object} matchMedia - called with an array of the names of the currently matching queries whenever a matching query changes
- * @returns {function} remove() function to call to remove the listener
- */
-const addMediaQueryMatchListener = (query, el, cb, matchMedia = defaultMatchMedia) => {
-  const node = typeof el === 'function' ? el() : el;
-  const updateMediaMatches = mediaQueryLists => {
-    const matches = Object.keys(mediaQueryLists).filter(key => mediaQueryLists[key].matches).map(key => key);
-    cb(matches);
-  };
-  const mediaQueryLists = {};
-  const listenerCallback = () => {
+const addMediaQueryMatchListener = (query, el, cb, matchMedia = defaultMatchMedia)=>{
+    const node = typeof el === 'function' ? el() : el;
+    const updateMediaMatches = (mediaQueryLists)=>{
+        const matches = Object.keys(mediaQueryLists).filter((key)=>mediaQueryLists[key].matches).map((key)=>key);
+        cb(matches);
+    };
+    const mediaQueryLists = {};
+    const listenerCallback = ()=>{
+        updateMediaMatches(mediaQueryLists);
+    };
+    Object.keys(query).forEach((key)=>{
+        const mediaQueryList = matchMedia(jsonToMediaQuery(query[key], node), node);
+        if (mediaQueryList) {
+            mediaQueryList.addListener(listenerCallback);
+            mediaQueryLists[key] = mediaQueryList;
+        }
+    });
     updateMediaMatches(mediaQueryLists);
-  };
-  Object.keys(query).forEach(key => {
-    const mediaQueryList = matchMedia(jsonToMediaQuery(query[key], node), node);
-    if (mediaQueryList) {
-      mediaQueryList.addListener(listenerCallback);
-      mediaQueryLists[key] = mediaQueryList;
-    }
-  });
-  updateMediaMatches(mediaQueryLists);
-  return {
-    remove() {
-      if (mediaQueryLists) {
-        Object.keys(mediaQueryLists).forEach(key => {
-          mediaQueryLists[key].removeListener(listenerCallback);
-        });
-      }
-    }
-  };
+    return {
+        remove () {
+            if (mediaQueryLists) {
+                Object.keys(mediaQueryLists).forEach((key)=>{
+                    mediaQueryLists[key].removeListener(listenerCallback);
+                });
+            }
+        }
+    };
 };
 export default addMediaQueryMatchListener;
-export { addMediaQueryMatchListener };
+export { addMediaQueryMatchListener };

package/es/utils/v1/jsonToMediaQuery.js

@@ -1,79 +1,35 @@
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2015 - present Instructure, Inc.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- */
 import { px } from '@instructure/ui-utils';
-/**
- * ---
- * category: utilities/layout
- * ---
- *
- * Given a valid json query object, converts it to a standard media query
- * string. Valid queries should be an object consisting of condition:breakpoint
- * pairs with the following condition types `minWidth`, `maxWidth`, `minHeight`,
- * or `maxHeight` where breakpoint value is either a string or a number.
- *
- * Example input
- * ```js-code
- * { minWidth: 350, maxWidth: 600 }
- * ```
- * Example output
- * ```js-code
- * '(min-width: 350px) and (max-Width: 600px)'
- * ```
- * @module jsonToMediaQuery
- * @param {Object} query - an object consisting of the query type and value
- * @param {Document | Window | Node | React.ReactElement | React.Component} el - component or DOM node which will be passed to the pixel conversion if the unit type is `em`
- * @returns {string} media query string
- */
 function jsonToMediaQuery(query, el) {
-  // Ensure the query is of the correct form
-  const keys = Object.keys(query);
-  if (keys.length > 4) {
-    throw new Error('Expected maximum 4 keys in query object.');
-  }
-  let mediaQuery = '';
-  const QUERY_SEPARATOR = 'and';
-  for (const key of keys) {
-    const validKeys = ['minHeight', 'maxHeight', 'minWidth', 'maxWidth'];
-    if (validKeys.indexOf(key) === -1) {
-      throw new Error(`Invalid key \`${key}\` in query object. Valid keys should consist of one of the following: ` + `${validKeys.join(', ')} (case sensitive)`);
+    const keys = Object.keys(query);
+    if (keys.length > 4) {
+        throw new Error('Expected maximum 4 keys in query object.');
     }
-    const value = query[key];
-
-    // TS catches this, but we want to throw error in runtime too
-    if (typeof value !== 'string' && typeof value !== 'number') {
-      throw new Error('The value of the query object must be a string or number.');
+    let mediaQuery = '';
+    const QUERY_SEPARATOR = 'and';
+    for (const key of keys){
+        const validKeys = [
+            'minHeight',
+            'maxHeight',
+            'minWidth',
+            'maxWidth'
+        ];
+        if (validKeys.indexOf(key) === -1) {
+            throw new Error(`Invalid key \`${key}\` in query object. Valid keys should consist of one of the following: ` + `${validKeys.join(', ')} (case sensitive)`);
+        }
+        const value = query[key];
+        if (typeof value !== 'string' && typeof value !== 'number') {
+            throw new Error('The value of the query object must be a string or number.');
+        }
+        if (!value) {
+            throw new Error('No value supplied for query object');
+        }
+        mediaQuery += `(${hyphenateQueryKey(key)}: ${px(value, el)}px) ${QUERY_SEPARATOR} `;
     }
-    if (!value) {
-      throw new Error('No value supplied for query object');
-    }
-    mediaQuery += `(${hyphenateQueryKey(key)}: ${px(value, el)}px) ${QUERY_SEPARATOR} `;
-  }
-  return mediaQuery.slice(0, -QUERY_SEPARATOR.length - 2);
+    return mediaQuery.slice(0, -QUERY_SEPARATOR.length - 2);
 }
 function hyphenateQueryKey(key) {
-  const lowerCaseKey = key.toLowerCase();
-  return lowerCaseKey.slice(0, 3) + '-' + lowerCaseKey.slice(3);
+    const lowerCaseKey = key.toLowerCase();
+    return lowerCaseKey.slice(0, 3) + '-' + lowerCaseKey.slice(3);
 }
 export default jsonToMediaQuery;
-export { jsonToMediaQuery };
+export { jsonToMediaQuery };

package/es/utils/v1/parseQuery.js

@@ -1,82 +1,23 @@
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2015 - present Instructure, Inc.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- */
 import { px } from '@instructure/ui-utils';
-
-/**
- * An object consisting of query names and boolean true false if it matches
- */
-
-/**
- * ---
- * category: utilities/layout
- * ---
- *
- * Given a query and an element, return a function that takes
- * size as an argument and returns an object consisting of
- * query names and a boolean true false if it matches.
- * @module parseQuery
- * @param {Object} query - an object consisting of query names
- *  mapped to individual queries
- * @param {Document | Window | Node | null} el - component or DOM node
- * @returns {function} takes size {width, height} as an argument
- *  and returns an object consisting of query names and boolean
- *  true false if it matches
- */
 function parseQuery(query, el) {
-  const rules = {};
-
-  // converting values to numerical values and adding initial values to all query keys
-  Object.keys(query).forEach(selectorName => {
-    const {
-      minWidth,
-      maxWidth,
-      minHeight,
-      maxHeight
-    } = query[selectorName];
-    rules[selectorName] = {
-      minWidth: minWidth && px(minWidth, el) || 0,
-      maxWidth: maxWidth && px(maxWidth, el) || Infinity,
-      minHeight: minHeight && px(minHeight, el) || 0,
-      maxHeight: maxHeight && px(maxHeight, el) || Infinity
-    };
-  });
-  return function ({
-    width,
-    height
-  }) {
-    const selectorMap = {};
-    Object.entries(rules).forEach(([selectorName, query]) => {
-      const {
-        minWidth,
-        maxWidth,
-        minHeight,
-        maxHeight
-      } = query;
-      selectorMap[selectorName] = minWidth <= width && width <= maxWidth && minHeight <= height && height <= maxHeight;
+    const rules = {};
+    Object.keys(query).forEach((selectorName)=>{
+        const { minWidth, maxWidth, minHeight, maxHeight } = query[selectorName];
+        rules[selectorName] = {
+            minWidth: minWidth && px(minWidth, el) || 0,
+            maxWidth: maxWidth && px(maxWidth, el) || Infinity,
+            minHeight: minHeight && px(minHeight, el) || 0,
+            maxHeight: maxHeight && px(maxHeight, el) || Infinity
+        };
     });
-    return selectorMap;
-  };
+    return function({ width, height }) {
+        const selectorMap = {};
+        Object.entries(rules).forEach(([selectorName, query])=>{
+            const { minWidth, maxWidth, minHeight, maxHeight } = query;
+            selectorMap[selectorName] = minWidth <= width && width <= maxWidth && minHeight <= height && height <= maxHeight;
+        });
+        return selectorMap;
+    };
 }
 export default parseQuery;
-export { parseQuery };
+export { parseQuery };

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@instructure/ui-responsive",
-  "version": "11.7.8",
+  "version": "11.7.9-pr-snapshot-1792147648392",
+  "type": "module",
   "description": "A component that allows for rendering a component differently based on either the element or the viewport size",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
-  "main": "./lib/index.js",
   "types": "./types/index.d.ts",
   "repository": {
     "type": "git",
@@ -14,18 +14,17 @@
   "bugs": "https://github.com/instructure/instructure-ui/issues",
   "license": "MIT",
   "dependencies": {
-    "@babel/runtime": "^7.29.7",
-    "@instructure/console": "11.7.8",
-    "@instructure/ui-dom-utils": "11.7.8",
-    "@instructure/debounce": "11.7.8",
-    "@instructure/shared-types": "11.7.8",
-    "@instructure/ui-react-utils": "11.7.8",
-    "@instructure/ui-utils": "11.7.8"
+    "@swc/helpers": "^0.5.23",
+    "@instructure/console": "11.7.9-pr-snapshot-1792147648392",
+    "@instructure/shared-types": "11.7.9-pr-snapshot-1792147648392",
+    "@instructure/ui-dom-utils": "11.7.9-pr-snapshot-1792147648392",
+    "@instructure/debounce": "11.7.9-pr-snapshot-1792147648392",
+    "@instructure/ui-react-utils": "11.7.9-pr-snapshot-1792147648392",
+    "@instructure/ui-utils": "11.7.9-pr-snapshot-1792147648392"
   },
   "devDependencies": {
     "vitest": "^5.0.0",
-    "@instructure/ui-babel-preset": "11.7.8",
-    "@instructure/ui-color-utils": "11.7.8"
+    "@instructure/ui-color-utils": "11.7.9-pr-snapshot-1792147648392"
   },
   "peerDependencies": {
     "react": ">=18 <=19"
@@ -35,7 +34,6 @@
   },
   "sideEffects": false,
   "exports": {
-    "./lib/*": "./lib/*",
     "./es/*": "./es/*",
     "./types/*": "./types/*",
     "./package.json": "./package.json",
@@ -44,28 +42,24 @@
       "src": "./src/exports/a.ts",
       "types": "./types/exports/a.d.ts",
       "import": "./es/exports/a.js",
-      "require": "./lib/exports/a.js",
       "default": "./es/exports/a.js"
     },
     "./v11_6": {
       "src": "./src/exports/a.ts",
       "types": "./types/exports/a.d.ts",
       "import": "./es/exports/a.js",
-      "require": "./lib/exports/a.js",
       "default": "./es/exports/a.js"
     },
     "./v11_7": {
       "src": "./src/exports/a.ts",
       "types": "./types/exports/a.d.ts",
       "import": "./es/exports/a.js",
-      "require": "./lib/exports/a.js",
       "default": "./es/exports/a.js"
     },
     "./latest": {
       "src": "./src/exports/a.ts",
       "types": "./types/exports/a.d.ts",
       "import": "./es/exports/a.js",
-      "require": "./lib/exports/a.js",
       "default": "./es/exports/a.js"
     }
   },
@@ -73,7 +67,7 @@
     "lint": "ui-scripts lint",
     "lint:fix": "ui-scripts lint --fix",
     "clean": "ui-scripts clean",
-    "build": "ui-scripts build --modules es,cjs",
+    "build": "ui-scripts build",
     "build:watch": "pnpm run ts:check -- --watch & ui-scripts build --watch",
     "build:types": "tsc -p tsconfig.build.json",
     "ts:check": "tsc -p tsconfig.build.json --noEmit --emitDeclarationOnly false"

package/tsconfig.build.json

@@ -13,7 +13,6 @@
     { "path": "../ui-dom-utils/tsconfig.build.json" },
     { "path": "../ui-react-utils/tsconfig.build.json" },
     { "path": "../ui-utils/tsconfig.build.json" },
-    { "path": "../ui-babel-preset/tsconfig.build.json" },
     { "path": "../ui-color-utils/tsconfig.build.json" }
   ]
 }

package/lib/Responsive/v1/index.js

@@ -1,167 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Responsive = void 0;
-var _react = require("react");
-var _deepEqual = require("@instructure/ui-utils/lib/deepEqual.js");
-var _console = require("@instructure/console");
-var _addElementQueryMatchListener = require("../../utils/v1/addElementQueryMatchListener.js");
-var _addMediaQueryMatchListener = require("../../utils/v1/addMediaQueryMatchListener.js");
-var _findDOMNode = require("@instructure/ui-dom-utils/lib/findDOMNode.js");
-var _props = require("./props.js");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2015 - present Instructure, Inc.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- */
-
-/**
----
-category: components
----
-
-**/class Responsive extends _react.Component {
-  static displayName = 'Responsive';
-  static allowedProps = _props.allowedProps;
-  static defaultProps = {
-    children: null,
-    match: 'element',
-    props: null
-  };
-  ref = null;
-  _matchListener = null;
-  state = {
-    matches: [],
-    hasRendered: false
-  };
-  handleRef = el => {
-    const {
-      elementRef
-    } = this.props;
-    this.ref = el;
-    if (typeof elementRef === 'function') {
-      elementRef(el);
-    }
-  };
-  componentDidMount() {
-    (0, _console.logError)(!!(this.props.render || this.props.children), `[Responsive] must have either a \`render\` prop or \`children\` prop.`);
-    if (this.props.match === 'element') {
-      // Because Responsive renders an empty div initially, it always needs to
-      // re-render with the children provided. If there are no matches the match
-      // listener won't trigger an update, so we handle this update explicitly.
-      const initialMatches = (0, _addElementQueryMatchListener.updateElementMatches)(this.props.query, this) || [];
-      this.setState({
-        matches: initialMatches,
-        hasRendered: true
-      });
-    } else {
-      this.setState({
-        hasRendered: true
-      });
-    }
-    this._matchListener = this.addMatchListener(this.props.query, this.updateMatches);
-  }
-  componentWillUnmount() {
-    this.removeMatchListener();
-  }
-  componentDidUpdate(prevProps) {
-    const {
-      match,
-      query
-    } = this.props;
-    if (match !== prevProps.match || !(0, _deepEqual.deepEqual)(query, prevProps.query)) {
-      this.removeMatchListener();
-      this._matchListener = this.addMatchListener(query, this.updateMatches, match);
-    }
-  }
-  addMatchListener(query, updateMatches, match = this.props.match) {
-    const matchListener = match === 'element' ? _addElementQueryMatchListener.addElementQueryMatchListener : _addMediaQueryMatchListener.addMediaQueryMatchListener;
-    return matchListener(query, () => (0, _findDOMNode.findDOMNode)(this), updateMatches);
-  }
-  removeMatchListener() {
-    if (this._matchListener) {
-      this._matchListener.remove();
-    }
-  }
-  updateMatches = (matches, cb) => {
-    this.setState({
-      matches
-    }, () => {
-      if (typeof cb === 'function') {
-        cb();
-      }
-    });
-  };
-  mergeProps(matches, props) {
-    if (!props) {
-      return null;
-    }
-    const mergedProps = {};
-    matches.forEach(match => {
-      const matchProps = props[match];
-
-      // Iterate over the props for the current match. If that the prop is
-      // already in `mergedProps` that means that the prop was defined for
-      // multiple breakpoints, and more than one of those breakpoints is being
-      // currently applied so we log a warning.
-      Object.keys(matchProps).forEach(prop => {
-        const currentValue = mergedProps[prop];
-        (0, _console.warn)(!(prop in mergedProps), [`[Responsive] The prop \`${prop}\` is defined at 2 or more breakpoints`, `which are currently applied at the same time. Its current value, \`${currentValue}\`,`, `will be overwritten as \`${matchProps[prop]}\`.`].join(' '));
-        mergedProps[prop] = matchProps[prop];
-      });
-    });
-    return mergedProps;
-  }
-  render() {
-    const {
-      matches,
-      hasRendered
-    } = this.state;
-    const {
-      props,
-      render,
-      children,
-      display
-    } = this.props;
-    let renderFunc;
-    // Responsive needs to render once to measure the dom and obtain matches.
-    // Calling the render prop on this initial render can cause visual side
-    // effects and is slower than rendering an empty div.
-    if (hasRendered) {
-      // Render via the children or render method, whichever is supplied. If
-      // both are supplied, give preference to children.
-      renderFunc = children || render;
-    }
-    return (0, _jsxRuntime.jsx)("div", {
-      ref: this.handleRef,
-      style: {
-        display
-      },
-      "data-cid": this.props['data-cid'],
-      children: renderFunc && renderFunc(this.mergeProps(matches, props), matches)
-    });
-  }
-}
-exports.Responsive = Responsive;
-var _default = exports.default = Responsive;

package/lib/Responsive/v1/props.js

@@ -1,35 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.allowedProps = void 0;
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2015 - present Instructure, Inc.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- */
-
-/**
- * Consists of an object where the keys match the breakpoint names used in the query. The values are objects with keys representing prop names and values representing prop values Ex. `{small: { myProp: 'fillscreen' }, large: { myProp: 'fillcontainer' }}`
- */
-
-const allowedProps = exports.allowedProps = ['match', 'query', 'props', 'render', 'children', 'display', 'elementRef'];