Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
reakit-system
Advanced tools
reakit-system - npm Package Compare versions
Comparing version 0.12.1 to 0.12.2
@@ -6,2 +6,18 @@ # Change Log | ||
| ## [0.12.2](https://github.com/reakit/reakit/tree/master/packages/reakit-system/compare/reakit-system@0.12.1...reakit-system@0.12.2) (2020-06-04) | ||
| ### Bug Fixes | ||
| * **reakit-system:** Fix forwardRef TypeScript types ([2d96447](https://github.com/reakit/reakit/tree/master/packages/reakit-system/commit/2d9644704f8e9e1f14ecf726ad8d4f7b401817c9)) | ||
| ### Performance Improvements | ||
| * Improve `Composite` performance ([#660](https://github.com/reakit/reakit/tree/master/packages/reakit-system/issues/660)) ([f6656b6](https://github.com/reakit/reakit/tree/master/packages/reakit-system/commit/f6656b6b765bbec639754aa96a2f08b717413068)) | ||
| ## [0.12.1](https://github.com/reakit/reakit/tree/master/packages/reakit-system/compare/reakit-system@0.12.0...reakit-system@0.12.1) (2020-05-12) | ||
@@ -8,0 +24,0 @@ |
@@ -1,1 +0,1 @@ | ||
| !function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],r):r((e=e||self).ReakitSystem={},e.React)}(this,(function(e,r){"use strict";function t(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function n(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function o(e){for(var r=1;r<arguments.length;r++){var o=null!=arguments[r]?arguments[r]:{};r%2?n(Object(o),!0).forEach((function(r){t(e,r,o[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):n(Object(o)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(o,r))}))}return e}function u(e,r){if(null==e)return{};var t,n,o={},u=Object.keys(e);for(n=0;n<u.length;n++)t=u[n],r.indexOf(t)>=0||(o[t]=e[t]);return o}function i(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,n=new Array(r);t<r;t++)n[t]=e[t];return n}function a(e){var r=0;if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(e=function(e,r){if(e){if("string"==typeof e)return i(e,r);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?i(e,r):void 0}}(e)))return function(){return r>=e.length?{done:!0}:{done:!1,value:e[r++]}};throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}return(r=e[Symbol.iterator]()).next.bind(r)}function c(e,r){for(var t={},n={},o=0,u=Object.keys(e);o<u.length;o++){var i=u[o];r.indexOf(i)>=0?t[i]=e[i]:n[i]=e[i]}return[t,n]}function s(e){return r.forwardRef(e)}var f=r.createContext({}),l=function(e,t,n){void 0===n&&(n=t.children);var o=r.useContext(f);if(o.useCreateElement)return o.useCreateElement(e,t,n);if(function(e){return"function"==typeof e}(n)){t.children;return n(u(t,["children"]))}return r.createElement(e,t,n)};function p(e,t){r.useDebugValue(e);var n=r.useContext(f);return null!=n[e]?n[e]:t}function v(e,t,n){void 0===t&&(t={}),void 0===n&&(n={});var u="use"+e+"Options";r.useDebugValue(u);var i=p(u);return i?o(o({},t),i(t,n)):t}function y(e,t,n){void 0===t&&(t={}),void 0===n&&(n={});var o="use"+e+"Props";r.useDebugValue(o);var u=p(o);return u?u(t,n):n}function d(e){return"object"==typeof e&&null!=e}function m(e,r){for(var t,n={},o=a(e);!(t=o()).done;)for(var u=t.value,i=0,c=Object.keys(u);i<c.length;i++){var s=c[i];if(!r||r(u[s],s)){var f=n[s]||[];n[s]=[].concat(f,[u[s]])}}return n}function b(e){for(var r=m(e,(function(e){return"function"==typeof e})),t={},n=0,o=Object.keys(r);n<o.length;n++){var u=o[n],i=r[u];t[u]=1===i.length?i[0]:i.reduce((function(e,r){return function(){for(var t=arguments.length,n=new Array(t),o=0;o<t;o++)n[o]=arguments[o];return r.apply(void 0,n.slice(0,-1).concat([e.apply(void 0,n)]))}}))}return t}function O(e){for(var r=m(e,d),t={},n=0,o=Object.keys(r);n<o.length;n++){var u=o[n],i=r[u];t[u]=Object.assign.apply(Object,[{}].concat(i))}return t}e.SystemContext=f,e.SystemProvider=function(e){var t=e.children,n=e.unstable_system;return r.createElement(f.Provider,{value:n},t)},e.createComponent=function(e){var t,n,i=e.as,a=e.useHook,f=e.keys,p=void 0===f?(null==a?void 0:a.__keys)||[]:f,v=e.useCreateElement,y=void 0===v?l:v,d=e.memo,m=function(e,r){var t=e.as,n=void 0===t?i:t,s=u(e,["as"]);if(a){var f,l=c(s,p),v=l[0],d=l[1],m=a(v,o({ref:r},d)),b=m.wrapElement,O=u(m,["wrapElement"]),g=(null===(f=n.render)||void 0===f?void 0:f.__keys)||n.__keys,j=g&&c(s,g)[0],h=j?o(o({},O),j):O,_=y(n,h);return b?b(_):_}return y(n,s)};return m.__keys=p,d?(t=s(m),r.memo(t,n)):s(m)},e.createHook=function(e){var r,t,n=(t=e.compose,Array.isArray(t)?t:void 0!==t?[t]:[]),o=function(r,t){if(e.useOptions&&(r=e.useOptions(r,t)),e.name&&(r=v(e.name,r,t)),e.compose)for(var o,u=a(n);!(o=u()).done;){r=o.value.__useOptions(r,t)}return r},u=function(r,t,u){if(void 0===r&&(r={}),void 0===t&&(t={}),void 0===u&&(u=!1),u||(r=o(r,t)),e.useProps&&(t=e.useProps(r,t)),e.name&&(t=y(e.name,r,t)),e.compose)if(e.useComposeOptions&&(r=e.useComposeOptions(r,t)),e.useComposeProps)t=e.useComposeProps(r,t);else for(var i,c=a(n);!(i=c()).done;){t=(0,i.value)(r,t,!0)}var s={},f=t||{};for(var l in f)void 0!==f[l]&&(s[l]=f[l]);return s};u.__useOptions=o;var i=n.reduce((function(e,r){return e.push.apply(e,r.__keys||[]),e}),[]);return u.__keys=[].concat(i,(null===(r=e.useState)||void 0===r?void 0:r.__keys)||[],e.keys||[]),u},e.mergeSystem=function(){for(var e=arguments.length,r=new Array(e),t=0;t<e;t++)r[t]=arguments[t];return Object.assign.apply(Object,[{}].concat(r,[O(r),b(r)]))},e.useCreateElement=l,e.useOptions=v,e.useProps=y,e.useToken=p,Object.defineProperty(e,"__esModule",{value:!0})})); | ||
| !function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],r):r((e=e||self).ReakitSystem={},e.React)}(this,(function(e,r){"use strict";function t(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function n(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function o(e){for(var r=1;r<arguments.length;r++){var o=null!=arguments[r]?arguments[r]:{};r%2?n(Object(o),!0).forEach((function(r){t(e,r,o[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):n(Object(o)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(o,r))}))}return e}function u(e,r){if(null==e)return{};var t,n,o={},u=Object.keys(e);for(n=0;n<u.length;n++)t=u[n],r.indexOf(t)>=0||(o[t]=e[t]);return o}function i(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,n=new Array(r);t<r;t++)n[t]=e[t];return n}function a(e){var r=0;if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(e=function(e,r){if(e){if("string"==typeof e)return i(e,r);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?i(e,r):void 0}}(e)))return function(){return r>=e.length?{done:!0}:{done:!1,value:e[r++]}};throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}return(r=e[Symbol.iterator]()).next.bind(r)}function s(e,r){for(var t={},n={},o=0,u=Object.keys(e);o<u.length;o++){var i=u[o];r.indexOf(i)>=0?t[i]=e[i]:n[i]=e[i]}return[t,n]}function c(e,r){if(e===r)return!0;if(!e)return!1;if(!r)return!1;if("object"!=typeof e)return!1;if("object"!=typeof r)return!1;var t=Object.keys(e),n=Object.keys(r),o=t.length;if(n.length!==o)return!1;for(var u=0,i=t;u<i.length;u++){var a=i[u];if(e[a]!==r[a])return!1}return!0}var f=r.createContext({}),l=function(e,t,n){void 0===n&&(n=t.children);var o=r.useContext(f);if(o.useCreateElement)return o.useCreateElement(e,t,n);if(function(e){return"function"==typeof e}(n)){t.children;return n(u(t,["children"]))}return r.createElement(e,t,n)};function p(e,t){r.useDebugValue(e);var n=r.useContext(f);return null!=n[e]?n[e]:t}function v(e,t,n){void 0===t&&(t={}),void 0===n&&(n={});var u="use"+e+"Options";r.useDebugValue(u);var i=p(u);return i?o(o({},t),i(t,n)):t}function y(e,t,n){void 0===t&&(t={}),void 0===n&&(n={});var o="use"+e+"Props";r.useDebugValue(o);var u=p(o);return u?u(t,n):n}function d(e){return"object"==typeof e&&null!=e}function b(e,r){for(var t,n={},o=a(e);!(t=o()).done;)for(var u=t.value,i=0,s=Object.keys(u);i<s.length;i++){var c=s[i];if(!r||r(u[c],c)){var f=n[c]||[];n[c]=[].concat(f,[u[c]])}}return n}function m(e){for(var r=b(e,(function(e){return"function"==typeof e})),t={},n=0,o=Object.keys(r);n<o.length;n++){var u=o[n],i=r[u];t[u]=1===i.length?i[0]:i.reduce((function(e,r){return function(){for(var t=arguments.length,n=new Array(t),o=0;o<t;o++)n[o]=arguments[o];return r.apply(void 0,n.slice(0,-1).concat([e.apply(void 0,n)]))}}))}return t}function O(e){for(var r=b(e,d),t={},n=0,o=Object.keys(r);n<o.length;n++){var u=o[n],i=r[u];t[u]=Object.assign.apply(Object,[{}].concat(i))}return t}e.SystemContext=f,e.SystemProvider=function(e){var t=e.children,n=e.unstable_system;return r.createElement(f.Provider,{value:n},t)},e.createComponent=function(e){var t,n=e.as,i=e.useHook,a=e.memo,f=e.propsAreEqual,p=void 0===f?null==i?void 0:i.unstable_propsAreEqual:f,v=e.keys,y=void 0===v?(null==i?void 0:i.__keys)||[]:v,d=e.useCreateElement,b=void 0===d?l:d,m=function(e,r){var t=e.as,a=void 0===t?n:t,c=u(e,["as"]);if(i){var f,l=s(c,y),p=l[0],v=l[1],d=i(p,o({ref:r},v)),m=d.wrapElement,O=u(d,["wrapElement"]),g=(null===(f=a.render)||void 0===f?void 0:f.__keys)||a.__keys,j=g&&s(c,g)[0],h=j?o(o({},O),j):O,_=b(a,h);return m?m(_):_}return b(a,o({ref:r},c))};return t=m,m=r.forwardRef(t),a&&(m=function(e,t){return r.memo(e,t)}(m,p)),m.__keys=y,m.unstable_propsAreEqual=p||c,m},e.createHook=function(e){var r,t,n,o=(n=e.compose,Array.isArray(n)?n:void 0!==n?[n]:[]),u=function(r,t){if(e.useOptions&&(r=e.useOptions(r,t)),e.name&&(r=v(e.name,r,t)),e.compose)for(var n,u=a(o);!(n=u()).done;){r=n.value.__useOptions(r,t)}return r},i=function(r,t,n){if(void 0===r&&(r={}),void 0===t&&(t={}),void 0===n&&(n=!1),n||(r=u(r,t)),e.useProps&&(t=e.useProps(r,t)),e.name&&(t=y(e.name,r,t)),e.compose)if(e.useComposeOptions&&(r=e.useComposeOptions(r,t)),e.useComposeProps)t=e.useComposeProps(r,t);else for(var i,s=a(o);!(i=s()).done;){t=(0,i.value)(r,t,!0)}var c={},f=t||{};for(var l in f)void 0!==f[l]&&(c[l]=f[l]);return c};i.__useOptions=u;var s=o.reduce((function(e,r){return e.push.apply(e,r.__keys||[]),e}),[]);return i.__keys=[].concat(s,(null===(r=e.useState)||void 0===r?void 0:r.__keys)||[],e.keys||[]),i.unstable_propsAreEqual=e.propsAreEqual||(null===(t=o[0])||void 0===t?void 0:t.unstable_propsAreEqual)||c,i},e.mergeSystem=function(){for(var e=arguments.length,r=new Array(e),t=0;t<e;t++)r[t]=arguments[t];return Object.assign.apply(Object,[{}].concat(r,[O(r),m(r)]))},e.useCreateElement=l,e.useOptions=v,e.useProps=y,e.useToken=p,Object.defineProperty(e,"__esModule",{value:!0})})); |
@@ -6,2 +6,3 @@ import { forwardRef as forwardRef$1, memo as memo$1 } from 'react'; | ||
| import { splitProps } from 'reakit-utils/splitProps'; | ||
| import { shallowEqual } from 'reakit-utils/shallowEqual'; | ||
@@ -29,7 +30,9 @@ function forwardRef(component) { | ||
| useHook = _ref.useHook, | ||
| shouldMemo = _ref.memo, | ||
| _ref$propsAreEqual = _ref.propsAreEqual, | ||
| propsAreEqual = _ref$propsAreEqual === void 0 ? useHook === null || useHook === void 0 ? void 0 : useHook.unstable_propsAreEqual : _ref$propsAreEqual, | ||
| _ref$keys = _ref.keys, | ||
| keys = _ref$keys === void 0 ? (useHook === null || useHook === void 0 ? void 0 : useHook.__keys) || [] : _ref$keys, | ||
| _ref$useCreateElement = _ref.useCreateElement, | ||
| useCreateElement$1 = _ref$useCreateElement === void 0 ? useCreateElement : _ref$useCreateElement, | ||
| shouldMemo = _ref.memo; | ||
| useCreateElement$1 = _ref$useCreateElement === void 0 ? useCreateElement : _ref$useCreateElement; | ||
@@ -68,7 +71,7 @@ var Comp = function Comp(_ref2, ref) { | ||
| return useCreateElement$1(as, props); | ||
| return useCreateElement$1(as, _objectSpread2({ | ||
| ref: ref | ||
| }, props)); | ||
| }; | ||
| Comp.__keys = keys; | ||
| if (process.env.NODE_ENV !== "production" && useHook) { | ||
@@ -78,9 +81,13 @@ Comp.displayName = useHook.name.replace(/^(unstable_)?use/, ""); | ||
| Comp = forwardRef(Comp); | ||
| if (shouldMemo) { | ||
| return memo(forwardRef(Comp)); | ||
| Comp = memo(Comp, propsAreEqual); | ||
| } | ||
| return forwardRef(Comp); | ||
| Comp.__keys = keys; | ||
| Comp.unstable_propsAreEqual = propsAreEqual || shallowEqual; | ||
| return Comp; | ||
| } | ||
| export { createComponent }; |
@@ -7,2 +7,3 @@ import 'react'; | ||
| import { useOptions } from './useOptions.js'; | ||
| import { shallowEqual } from 'reakit-utils/shallowEqual'; | ||
| import { toArray } from 'reakit-utils/toArray'; | ||
@@ -35,3 +36,3 @@ | ||
| function createHook(options) { | ||
| var _options$useState; | ||
| var _options$useState, _composedHooks$; | ||
@@ -125,2 +126,3 @@ var composedHooks = toArray(options.compose); | ||
| useHook.__keys = [].concat(composedKeys, ((_options$useState = options.useState) === null || _options$useState === void 0 ? void 0 : _options$useState.__keys) || [], options.keys || []); | ||
| useHook.unstable_propsAreEqual = options.propsAreEqual || ((_composedHooks$ = composedHooks[0]) === null || _composedHooks$ === void 0 ? void 0 : _composedHooks$.unstable_propsAreEqual) || shallowEqual; | ||
@@ -127,0 +129,0 @@ if (process.env.NODE_ENV !== "production" && options.name) { |
@@ -11,2 +11,3 @@ import 'react'; | ||
| import 'reakit-utils/splitProps'; | ||
| import 'reakit-utils/shallowEqual'; | ||
| export { createComponent } from './createComponent.js'; | ||
@@ -13,0 +14,0 @@ import 'reakit-utils/toArray'; |
@@ -10,2 +10,3 @@ 'use strict'; | ||
| var splitProps = require('reakit-utils/splitProps'); | ||
| var shallowEqual = require('reakit-utils/shallowEqual'); | ||
@@ -33,7 +34,9 @@ function forwardRef(component) { | ||
| useHook = _ref.useHook, | ||
| shouldMemo = _ref.memo, | ||
| _ref$propsAreEqual = _ref.propsAreEqual, | ||
| propsAreEqual = _ref$propsAreEqual === void 0 ? useHook === null || useHook === void 0 ? void 0 : useHook.unstable_propsAreEqual : _ref$propsAreEqual, | ||
| _ref$keys = _ref.keys, | ||
| keys = _ref$keys === void 0 ? (useHook === null || useHook === void 0 ? void 0 : useHook.__keys) || [] : _ref$keys, | ||
| _ref$useCreateElement = _ref.useCreateElement, | ||
| useCreateElement$1 = _ref$useCreateElement === void 0 ? useCreateElement.useCreateElement : _ref$useCreateElement, | ||
| shouldMemo = _ref.memo; | ||
| useCreateElement$1 = _ref$useCreateElement === void 0 ? useCreateElement.useCreateElement : _ref$useCreateElement; | ||
@@ -72,7 +75,7 @@ var Comp = function Comp(_ref2, ref) { | ||
| return useCreateElement$1(as, props); | ||
| return useCreateElement$1(as, _rollupPluginBabelHelpers._objectSpread2({ | ||
| ref: ref | ||
| }, props)); | ||
| }; | ||
| Comp.__keys = keys; | ||
| if (process.env.NODE_ENV !== "production" && useHook) { | ||
@@ -82,9 +85,13 @@ Comp.displayName = useHook.name.replace(/^(unstable_)?use/, ""); | ||
| Comp = forwardRef(Comp); | ||
| if (shouldMemo) { | ||
| return memo(forwardRef(Comp)); | ||
| Comp = memo(Comp, propsAreEqual); | ||
| } | ||
| return forwardRef(Comp); | ||
| Comp.__keys = keys; | ||
| Comp.unstable_propsAreEqual = propsAreEqual || shallowEqual.shallowEqual; | ||
| return Comp; | ||
| } | ||
| exports.createComponent = createComponent; |
@@ -11,2 +11,3 @@ 'use strict'; | ||
| var useOptions = require('./useOptions.js'); | ||
| var shallowEqual = require('reakit-utils/shallowEqual'); | ||
| var toArray = require('reakit-utils/toArray'); | ||
@@ -39,3 +40,3 @@ | ||
| function createHook(options) { | ||
| var _options$useState; | ||
| var _options$useState, _composedHooks$; | ||
@@ -129,2 +130,3 @@ var composedHooks = toArray.toArray(options.compose); | ||
| useHook.__keys = [].concat(composedKeys, ((_options$useState = options.useState) === null || _options$useState === void 0 ? void 0 : _options$useState.__keys) || [], options.keys || []); | ||
| useHook.unstable_propsAreEqual = options.propsAreEqual || ((_composedHooks$ = composedHooks[0]) === null || _composedHooks$ === void 0 ? void 0 : _composedHooks$.unstable_propsAreEqual) || shallowEqual.shallowEqual; | ||
@@ -131,0 +133,0 @@ if (process.env.NODE_ENV !== "production" && options.name) { |
@@ -15,2 +15,3 @@ 'use strict'; | ||
| require('reakit-utils/splitProps'); | ||
| require('reakit-utils/shallowEqual'); | ||
| var createComponent = require('./createComponent.js'); | ||
@@ -17,0 +18,0 @@ require('reakit-utils/toArray'); |
| { | ||
| "name": "reakit-system", | ||
| "version": "0.12.1", | ||
| "version": "0.12.2", | ||
| "description": "Reakit System utils", | ||
@@ -34,3 +34,3 @@ "sideEffects": false, | ||
| "dependencies": { | ||
| "reakit-utils": "^0.12.0" | ||
| "reakit-utils": "^0.12.1" | ||
| }, | ||
@@ -41,3 +41,3 @@ "peerDependencies": { | ||
| }, | ||
| "gitHead": "60c04a70e5c774fa749f6e291f3f0bbfde8bfc7c" | ||
| "gitHead": "97e45c667fbb04f81fdae700d8f3e8d9736946e0" | ||
| } |
@@ -54,5 +54,6 @@ # reakit-system | ||
| - `options.useHook` | ||
| - `options.memo` | ||
| - `options.propsAreEqual` (optional, default `useHook?.unstable_propsAreEqual`) | ||
| - `options.keys` (optional, default `useHook?.__keys||[]`) | ||
| - `options.useCreateElement` (optional, default `defaultUseCreateElement`) | ||
| - `options.memo` | ||
@@ -59,0 +60,0 @@ #### Examples |
| import * as React from "react"; | ||
| export function forwardRef<T extends React.RefForwardingComponent<any, any>>( | ||
| export function forwardRef<T extends React.ForwardRefRenderFunction<any, any>>( | ||
| component: T | ||
@@ -5,0 +5,0 @@ ) { |
| import * as React from "react"; | ||
| import { As, PropsWithAs } from "reakit-utils/types"; | ||
| import { splitProps } from "reakit-utils/splitProps"; | ||
| import { shallowEqual } from "reakit-utils/shallowEqual"; | ||
| import { forwardRef } from "./__utils/forwardRef"; | ||
@@ -15,2 +16,3 @@ import { useCreateElement as defaultUseCreateElement } from "./useCreateElement"; | ||
| (options?: O, props?: BoxHTMLProps): BoxHTMLProps; | ||
| unstable_propsAreEqual?: (prev: O, next: O) => boolean; | ||
| __keys?: ReadonlyArray<any>; | ||
@@ -24,14 +26,19 @@ }; | ||
| memo?: boolean; | ||
| useCreateElement?: typeof defaultUseCreateElement; | ||
| propsAreEqual?: (prev: O, next: O) => boolean; | ||
| useCreateElement?: ( | ||
| type: T, | ||
| props: Omit<PropsWithAs<O, T>, "as">, | ||
| children?: React.ReactNode | ||
| ) => JSX.Element; | ||
| }; | ||
| export type Component<T extends As, O> = { | ||
| // This is the desired type | ||
| // <TT extends As = T>(props: PropsWithAs<O, TT>): JSX.Element; | ||
| // Unfortunately, TypeScript doesn't like it. It works for string elements | ||
| // and functional components without generics, but it breaks on generics. | ||
| // See ./__tests__/createComponent-test.tsx | ||
| // The following two types are a workaround. | ||
| <TT extends As>(props: PropsWithAs<O, TT> & { as: TT }): JSX.Element; | ||
| (props: PropsWithAs<O, T>): JSX.Element; | ||
| displayName?: string; | ||
| unstable_propsAreEqual: ( | ||
| prev: PropsWithAs<O, T>, | ||
| next: PropsWithAs<O, T> | ||
| ) => boolean; | ||
| __keys?: ReadonlyArray<any>; | ||
| }; | ||
@@ -52,7 +59,8 @@ | ||
| useHook, | ||
| memo: shouldMemo, | ||
| propsAreEqual = useHook?.unstable_propsAreEqual, | ||
| keys = useHook?.__keys || [], | ||
| useCreateElement = defaultUseCreateElement, | ||
| memo: shouldMemo, | ||
| }: Options<T, O>) { | ||
| const Comp = ( | ||
| let Comp = (( | ||
| { as = type, ...props }: PropsWithAs<O, T>, | ||
@@ -73,3 +81,3 @@ ref: React.Ref<T> | ||
| : elementProps; | ||
| const element = useCreateElement(as, allProps); | ||
| const element = useCreateElement(as, allProps as typeof props); | ||
| if (wrapElement) { | ||
@@ -80,16 +88,20 @@ return wrapElement(element); | ||
| } | ||
| return useCreateElement(as, props); | ||
| }; | ||
| return useCreateElement(as, { ref, ...props }); | ||
| }) as Component<T, O>; | ||
| (Comp as any).__keys = keys; | ||
| if (process.env.NODE_ENV !== "production" && useHook) { | ||
| (Comp as any).displayName = useHook.name.replace(/^(unstable_)?use/, ""); | ||
| Comp.displayName = useHook.name.replace(/^(unstable_)?use/, ""); | ||
| } | ||
| Comp = forwardRef(Comp); | ||
| if (shouldMemo) { | ||
| return memo(forwardRef(Comp as Component<T, O>)); | ||
| Comp = memo(Comp, propsAreEqual); | ||
| } | ||
| return forwardRef(Comp as Component<T, O>); | ||
| Comp.__keys = keys; | ||
| Comp.unstable_propsAreEqual = propsAreEqual || shallowEqual; | ||
| return Comp; | ||
| } |
| import { toArray } from "reakit-utils/toArray"; | ||
| import { shallowEqual } from "reakit-utils/shallowEqual"; | ||
| import { useOptions } from "./useOptions"; | ||
@@ -7,2 +8,3 @@ import { useProps } from "./useProps"; | ||
| (options?: O, htmlProps?: P, unstable_ignoreUseOptions?: boolean): P; | ||
| unstable_propsAreEqual: (prev: O & P, next: O & P) => boolean; | ||
| __keys: ReadonlyArray<any>; | ||
@@ -20,2 +22,3 @@ __useOptions: (options: O, htmlProps: P) => O; | ||
| useComposeProps?: (options: O, htmlProps: P) => P; | ||
| propsAreEqual?: (prev: O & P, next: O & P) => boolean; | ||
| keys?: ReadonlyArray<keyof O>; | ||
@@ -123,2 +126,7 @@ }; | ||
| useHook.unstable_propsAreEqual = | ||
| options.propsAreEqual || | ||
| composedHooks[0]?.unstable_propsAreEqual || | ||
| shallowEqual; | ||
| if (process.env.NODE_ENV !== "production" && options.name) { | ||
@@ -125,0 +133,0 @@ Object.defineProperty(useHook, "name", { |
| import * as React from "react"; | ||
| export declare function forwardRef<T extends React.RefForwardingComponent<any, any>>(component: T): T; | ||
| export declare function forwardRef<T extends React.ForwardRefRenderFunction<any, any>>(component: T): T; |
| import * as React from "react"; | ||
| import { As, PropsWithAs } from "reakit-utils/types"; | ||
| import { useCreateElement as defaultUseCreateElement } from "./useCreateElement"; | ||
| declare type BoxHTMLProps = React.HTMLAttributes<any> & React.RefAttributes<any> & { | ||
@@ -9,2 +8,3 @@ wrapElement?: (element: React.ReactNode) => React.ReactNode; | ||
| (options?: O, props?: BoxHTMLProps): BoxHTMLProps; | ||
| unstable_propsAreEqual?: (prev: O, next: O) => boolean; | ||
| __keys?: ReadonlyArray<any>; | ||
@@ -17,3 +17,4 @@ }; | ||
| memo?: boolean; | ||
| useCreateElement?: typeof defaultUseCreateElement; | ||
| propsAreEqual?: (prev: O, next: O) => boolean; | ||
| useCreateElement?: (type: T, props: Omit<PropsWithAs<O, T>, "as">, children?: React.ReactNode) => JSX.Element; | ||
| }; | ||
@@ -25,2 +26,5 @@ export declare type Component<T extends As, O> = { | ||
| (props: PropsWithAs<O, T>): JSX.Element; | ||
| displayName?: string; | ||
| unstable_propsAreEqual: (prev: PropsWithAs<O, T>, next: PropsWithAs<O, T>) => boolean; | ||
| __keys?: ReadonlyArray<any>; | ||
| }; | ||
@@ -37,3 +41,3 @@ /** | ||
| */ | ||
| export declare function createComponent<T extends As, O>({ as: type, useHook, keys, useCreateElement, memo: shouldMemo, }: Options<T, O>): Component<T, O>; | ||
| export declare function createComponent<T extends As, O>({ as: type, useHook, memo: shouldMemo, propsAreEqual, keys, useCreateElement, }: Options<T, O>): Component<T, O>; | ||
| export {}; |
| declare type Hook<O = any, P = any> = { | ||
| (options?: O, htmlProps?: P, unstable_ignoreUseOptions?: boolean): P; | ||
| unstable_propsAreEqual: (prev: O & P, next: O & P) => boolean; | ||
| __keys: ReadonlyArray<any>; | ||
@@ -17,2 +18,3 @@ __useOptions: (options: O, htmlProps: P) => O; | ||
| useComposeProps?: (options: O, htmlProps: P) => P; | ||
| propsAreEqual?: (prev: O & P, next: O & P) => boolean; | ||
| keys?: ReadonlyArray<keyof O>; | ||
@@ -19,0 +21,0 @@ }; |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by3.62%
104410
- Lines of code
- increased by2.02%
2575
- Number of lines in readme file
- increased by0.31%
323
Dependency changes
Updatedreakit-utils@^0.12.1