Socket
Socket
Sign inDemoInstall

uncontrollable

Package Overview
Dependencies
Maintainers
1
Versions
50
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

uncontrollable

Wrap a controlled react component, to allow specific prop/handler pairs to be uncontrolled


Version published
Weekly downloads
2M
decreased by-7.58%
Maintainers
1
Weekly downloads
 
Created

What is uncontrollable?

The 'uncontrollable' npm package is a utility for creating controlled components that can also be uncontrolled. It allows you to manage the state of a component internally while still providing the ability to control it externally via props.

What are uncontrollable's main functionalities?

Creating Uncontrolled Components

This feature allows you to create components that can manage their own state internally but can also be controlled externally via props. The `uncontrollable` function wraps your component and allows you to specify which props should be treated as controlled.

const { uncontrollable } = require('uncontrollable');

class MyComponent extends React.Component {
  render() {
    return <input value={this.props.value} onChange={this.props.onChange} />;
  }
}

const UncontrolledComponent = uncontrollable(MyComponent, { value: 'onChange' });

// Usage
<UncontrolledComponent defaultValue="initial value" />;

Handling Multiple Controlled Props

This feature allows you to handle multiple controlled props within a single component. You can specify multiple props that should be treated as controlled, and the `uncontrollable` function will manage them accordingly.

const { uncontrollable } = require('uncontrollable');

class MyComponent extends React.Component {
  render() {
    return (
      <div>
        <input value={this.props.value} onChange={this.props.onChange} />
        <input value={this.props.otherValue} onChange={this.props.onOtherChange} />
      </div>
    );
  }
}

const UncontrolledComponent = uncontrollable(MyComponent, { value: 'onChange', otherValue: 'onOtherChange' });

// Usage
<UncontrolledComponent defaultValue="initial value" defaultOtherValue="initial other value" />;

Other packages similar to uncontrollable

Keywords

FAQs

Package last updated on 28 Jul 2023

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc