@navinc/base-react-components/dist/password-input.js

Nav's Pattern Library

var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx } from "react/jsx-runtime";
import { useState } from 'react';
import { styled } from 'styled-components';
import { InputWithSensitivityButton } from './form-elements/input-with-sensitivity-button.js';
const UnstyledPasswordInput = (_a) => {
    var { className = '' } = _a, props = __rest(_a, ["className"]);
    const [isPasswordShownState, setIsPasswordShownState] = useState(false);
    return (_jsx(InputWithSensitivityButton, Object.assign({ className: className, type: isPasswordShownState ? 'text' : 'password', isVisible: isPasswordShownState, onToggle: () => setIsPasswordShownState((prevIsPasswordShownState) => !prevIsPasswordShownState) }, props)));
};
/**
This input works just like the other input, but it adds a show/hide button.

```
<PasswordInput
  name="my-input"
  required
  isInvalid={this.state['my-input'].isInvalid}
  onChange={this.handleChange}
  value={this.state['my-input'].value}
/>
```
 *
 * @deprecated This component is deprecated and will be removed in a future release. Avoid using it in new code.
 */
export const PasswordInput = styled(UnstyledPasswordInput).withConfig({ displayName: "brc-sc-PasswordInput", componentId: "brc-sc-1flyoho" }) ``;
//# sourceMappingURL=password-input.js.map