uncontrollable
Advanced tools
Comparing version 1.1.3 to 1.1.4
@@ -6,3 +6,3 @@ "use strict"; | ||
function customPropType(handler, propType) { | ||
function customPropType(handler, propType, name) { | ||
@@ -12,5 +12,5 @@ return function (props, propName, componentName, location) { | ||
if (props[propName] !== undefined) { | ||
if (!props[handler]) return new Error("You have provided a `" + propName + "` prop to " + "`" + componentName + "` without an `" + handler + "` handler. This will render a read-only field. " + "If the field should be mutable use `" + defaultKey(propName) + "`. Otherwise, set `" + handler + "`"); | ||
if (!props[handler]) return new Error("You have provided a `" + propName + "` prop to " + "`" + name + "` without an `" + handler + "` handler. This will render a read-only field. " + "If the field should be mutable use `" + defaultKey(propName) + "`. Otherwise, set `" + handler + "`"); | ||
return propType && propType(props, propName, componentName, location); | ||
return propType && propType(props, propName, name, location); | ||
} | ||
@@ -29,3 +29,4 @@ }; | ||
module.exports = function (Component, controlledValues, taps) { | ||
var types = {}; | ||
var name = Component.displayName || Component.name || "Component", | ||
types = {}; | ||
@@ -38,3 +39,3 @@ if (process.env.NODE_ENV !== "production" && getType(Component).propTypes) { | ||
obj[prop] = customPropType(handler, type); | ||
obj[prop] = customPropType(handler, type, Component.displayName); | ||
if (type !== undefined) { | ||
@@ -46,2 +47,4 @@ obj[defaultKey(prop)] = type; | ||
name = name[0].toUpperCase() + name.substr(1); | ||
taps = taps || {}; | ||
@@ -51,3 +54,3 @@ | ||
displayName: Component.displayName, | ||
displayName: "Uncontrolled" + name, | ||
@@ -54,0 +57,0 @@ propTypes: types, |
{ | ||
"name": "uncontrollable", | ||
"version": "1.1.3", | ||
"version": "1.1.4", | ||
"description": "Wrap a controlled react component, to allow spcific prop/handler pairs to be uncontrolled", | ||
@@ -5,0 +5,0 @@ "author": { |
@@ -13,3 +13,3 @@ # uncontrollable | ||
If you are a bit unsure on the _why_ of this module read the next section first. If you just want to see some real-world example, check out [React Widgets](https://github.com/jquense/react-widgets) which makes [heavy use of this strategy](https://github.com/jquense/react-widgets/blob/master/src/Multiselect.jsx#L410). | ||
If you are a bit unsure on the _why_ of this module read the next section first. If you just want to see some real-world example, check out [React Widgets](https://github.com/jquense/react-widgets) which makes [heavy use of this strategy](https://github.com/jquense/react-widgets/blob/master/src/Multiselect.jsx#L418). | ||
@@ -97,5 +97,5 @@ require the module: `var uncontrollable = require('uncontrollable')` | ||
We want to just handle the open/onToggle case ourselves if the consumer doesn't provide a `open` prop (indicating that they want to control it). Rather than complicating our dropdown component will all that logic obsuring the business logic of our dropdown, we can add it later, by taking our dropdown and wrapping it inside another component that handles that for us. | ||
We want to just handle the open/onToggle case ourselves if the consumer doesn't provide a `open` prop (indicating that they want to control it). Rather than complicating our dropdown component with all that logic obsuring the business logic of our dropdown, we can add it later, by taking our dropdown and wrapping it inside another component that handles that for us. | ||
`uncontrollable` allows you seperate out the logic necessary to create controlled/uncontrolled inputs letting you focus on creating a completely controlled input and wrapping it later. This tends to be a lot simplier to reason about as well. | ||
`uncontrollable` allows you separate out the logic necessary to create controlled/uncontrolled inputs letting you focus on creating a completely controlled input and wrapping it later. This tends to be a lot simplier to reason about as well. | ||
@@ -102,0 +102,0 @@ ```js |
@@ -61,2 +61,8 @@ 'use strict'; | ||
Control.displayName.should.equal('UncontrolledBase') | ||
}) | ||
it('should adjust displayName', () => { | ||
var Control = uncontrol(Base, { value: 'onChange' }) | ||
Control.propTypes.should.have.property('defaultValue') | ||
@@ -66,2 +72,3 @@ .that.equals(Base.propTypes.value) | ||
it('should track state if no specified', () => { | ||
@@ -68,0 +75,0 @@ var Control = uncontrol(Base, { value: 'onChange' }) |
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
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
189834
4597