@doist/reactist 17.6.0 → 17.7.0

package/dist/reactist.cjs.development.js

@@ -11,6 +11,7 @@ var flattenChildren = _interopDefault(require('react-keyed-flatten-children'));
 var tooltip = require('ariakit/tooltip');
 var portal = require('ariakit/portal');
 var ariakitUtils = require('ariakit-utils');
+var useCallbackRef = require('use-callback-ref');
 var FocusLock = _interopDefault(require('react-focus-lock'));
 var ariaHidden = require('aria-hidden');
 var dialog = require('ariakit/dialog');
@@ -1713,7 +1714,7 @@ function PasswordHiddenIcon(props) {
 
 var modules_3f03ead6 = {"inputWrapper":"_66b448b3"};
 
-var modules_aaf25250 = {"inputWrapper":"_9d172ece","bordered":"c59d0239","error":"_7e63ee20"};
+var modules_aaf25250 = {"inputWrapper":"fb09cd05","bordered":"f65f40dd","error":"_29118bf0","startIcon":"a40eb111"};
 
 const _excluded$j = ["variant", "label", "secondaryLabel", "auxiliaryLabel", "hint", "message", "tone", "maxWidth", "togglePasswordLabel", "hidden", "aria-describedby"];
 const PasswordField = /*#__PURE__*/React.forwardRef(function PasswordField(_ref, ref) {
@@ -1946,7 +1947,7 @@ function TextArea(_ref) {
   }, /*#__PURE__*/React.createElement("textarea", _objectSpread2(_objectSpread2({}, props), extraProps))));
 }
 
-const _excluded$n = ["variant", "id", "label", "secondaryLabel", "auxiliaryLabel", "hint", "message", "tone", "type", "maxWidth", "hidden", "aria-describedby"];
+const _excluded$n = ["variant", "id", "label", "secondaryLabel", "auxiliaryLabel", "hint", "message", "tone", "type", "maxWidth", "hidden", "aria-describedby", "startIcon"];
 const TextField = /*#__PURE__*/React.forwardRef(function TextField(_ref, ref) {
   let {
     variant = 'default',
@@ -1960,10 +1961,20 @@ const TextField = /*#__PURE__*/React.forwardRef(function TextField(_ref, ref) {
     type = 'text',
     maxWidth,
     hidden,
-    'aria-describedby': ariaDescribedBy
+    'aria-describedby': ariaDescribedBy,
+    startIcon
   } = _ref,
       props = _objectWithoutProperties(_ref, _excluded$n);
 
+  const internalRef = React.useRef(null);
+  const combinedRef = useCallbackRef.useMergeRefs([ref, internalRef]);
+
+  function focusOnIconClick() {
+    var _internalRef$current;
+
+    (_internalRef$current = internalRef.current) == null ? void 0 : _internalRef$current.focus();
+  }
+
   return /*#__PURE__*/React.createElement(BaseField, {
     variant: variant,
     id: id,
@@ -1977,10 +1988,19 @@ const TextField = /*#__PURE__*/React.forwardRef(function TextField(_ref, ref) {
     hidden: hidden,
     "aria-describedby": ariaDescribedBy
   }, extraProps => /*#__PURE__*/React.createElement(Box, {
+    display: "flex",
+    alignItems: "center",
     className: [modules_aaf25250.inputWrapper, tone === 'error' ? modules_aaf25250.error : null, variant === 'bordered' ? modules_aaf25250.bordered : null]
-  }, /*#__PURE__*/React.createElement("input", _objectSpread2(_objectSpread2(_objectSpread2({}, props), extraProps), {}, {
+  }, startIcon ? /*#__PURE__*/React.createElement(Box, {
+    display: "flex",
+    className: modules_aaf25250.startIcon,
+    onClick: focusOnIconClick,
+    marginRight: "-xsmall",
+    marginLeft: "small",
+    "aria-hidden": true
+  }, startIcon) : null, /*#__PURE__*/React.createElement("input", _objectSpread2(_objectSpread2(_objectSpread2({}, props), extraProps), {}, {
     type: type,
-    ref: ref
+    ref: combinedRef
   }))));
 });