@commercetools-uikit/password-input
Version:
A controlled password input component.
69 lines (65 loc) • 4.26 kB
JavaScript
import _Object$keys from '@babel/runtime-corejs3/core-js-stable/object/keys';
import _Object$getOwnPropertySymbols from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols';
import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
import _Object$getOwnPropertyDescriptor from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor';
import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/for-each';
import _Object$getOwnPropertyDescriptors from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors';
import _Object$defineProperties from '@babel/runtime-corejs3/core-js-stable/object/define-properties';
import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object/define-property';
import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
import _objectWithoutProperties from '@babel/runtime-corejs3/helpers/esm/objectWithoutProperties';
import _trimInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/trim';
import { warning, filterDataAttributes } from '@commercetools-uikit/utils';
import Constraints from '@commercetools-uikit/constraints';
import { getInputStyles } from '@commercetools-uikit/input-utils';
import { jsx } from '@emotion/react/jsx-runtime';
const _excluded = ["horizontalConstraint", "isDisabled", "isReadOnly", "isPasswordVisible"];
function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
const PasswordInput = _ref => {
let _ref$horizontalConstr = _ref.horizontalConstraint,
horizontalConstraint = _ref$horizontalConstr === void 0 ? 'scale' : _ref$horizontalConstr,
_ref$isDisabled = _ref.isDisabled,
isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
_ref$isReadOnly = _ref.isReadOnly,
isReadOnly = _ref$isReadOnly === void 0 ? false : _ref$isReadOnly,
_ref$isPasswordVisibl = _ref.isPasswordVisible,
isPasswordVisible = _ref$isPasswordVisibl === void 0 ? false : _ref$isPasswordVisibl,
props = _objectWithoutProperties(_ref, _excluded);
if (!isReadOnly) {
process.env.NODE_ENV !== "production" ? warning(Boolean(props.onChange), 'PasswordInput: `onChange` is required when is not read only.') : void 0;
}
return jsx(Constraints.Horizontal, {
max: horizontalConstraint,
children: jsx("input", _objectSpread(_objectSpread({
id: props.id,
name: props.name,
type: isPasswordVisible ? 'text' : 'password',
value: props.value,
onChange: props.onChange,
onBlur: props.onBlur,
onFocus: props.onFocus,
disabled: isDisabled,
placeholder: props.placeholder,
autoComplete: props.autoComplete,
css: getInputStyles(_objectSpread({
isDisabled,
isReadOnly
}, props)),
readOnly: isReadOnly,
autoFocus: props.isAutofocussed
}, filterDataAttributes(props)), {}, {
/* ARIA */
"aria-readonly": isReadOnly,
contentEditable: !isReadOnly,
"aria-invalid": props['aria-invalid'],
"aria-errormessage": props['aria-errormessage']
}))
});
};
PasswordInput.displayName = 'PasswordInput';
PasswordInput.isEmpty = value => !value || _trimInstanceProperty(value).call(value).length === 0;
var PasswordInput$1 = PasswordInput;
// NOTE: This string will be replaced on build time with the package version.
var version = "20.3.0";
export { PasswordInput$1 as default, version };