@s-ui/react-atom-input - npm Package Compare versions

Comparing version 5.27.0 to 5.28.0

lib/config.js

@@ -13,5 +13,3 @@ import cx from 'classnames';
   DATE: 'date',
-  EMAIL: 'email',
   MASK: 'mask',
-  NONE: 'none',
   NUMBER: 'number',
@@ -21,3 +19,5 @@ PASSWORD: 'password',
   TEXT: 'text',
-  TEL: 'tel'
+  TEL: 'tel',
+  EMAIL: 'email',
+  NONE: 'none'
 };
@@ -24,0 +24,0 @@ export var SIZES = {

lib/Input/Wrappers/Addons/config.js

 import cx from 'classnames';
-import { BASE } from '../../../config.js';
+import { BASE, BASE_CLASS_ITEM } from '../../../config.js';
 export var BASE_CLASS_ADDON = BASE + "--withAddon";
-export var BASE_CLASS_ADDON_WRAPPER = BASE_CLASS_ADDON + "Wrapper";
 export var ADDON_TYPES = {
@@ -11,3 +10,3 @@ LEFT: 'left',
   var type = _ref.type;
-  return cx(BASE_CLASS_ADDON, BASE_CLASS_ADDON + "--" + type);
+  return cx(BASE_CLASS_ITEM, BASE_CLASS_ADDON, BASE_CLASS_ADDON + "--" + type);
 };

lib/Input/Wrappers/Addons/InputAddons.js

@@ -1,6 +0,6 @@
-import cx from 'classnames';
 import PropTypes from 'prop-types';
 import { INPUT_SHAPES, SIZES } from '../../../config.js';
-import { ADDON_TYPES, BASE_CLASS_ADDON_WRAPPER, getClassName } from './config.js';
+import { ADDON_TYPES, getClassName } from './config.js';
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -16,4 +16,3 @@ var InputAddon = function InputAddon(_ref) {
   }
-  return /*#__PURE__*/_jsxs("div", {
-    className: cx(BASE_CLASS_ADDON_WRAPPER, shape && BASE_CLASS_ADDON_WRAPPER + "-shape-" + shape, size && BASE_CLASS_ADDON_WRAPPER + "-size-" + size),
+  return /*#__PURE__*/_jsxs(_Fragment, {
     children: [leftAddon && /*#__PURE__*/_jsx("span", {
@@ -20,0 +19,0 @@ className: getClassName({

lib/Input/Wrappers/Button/config.js

@@ -1,2 +0,3 @@
-import { BASE } from '../../../config.js';
+import { BASE, BASE_CLASS_ITEM } from '../../../config.js';
+export { BASE_CLASS_ITEM };
 export var BASE_CLASS_BUTTON = BASE + "--withButton";

lib/Input/Wrappers/Button/InputButton.js

@@ -0,4 +1,6 @@
+import cx from 'classnames';
 import PropTypes from 'prop-types';
-import { BASE_CLASS_BUTTON } from './config.js';
+import { BASE_CLASS_BUTTON, BASE_CLASS_ITEM } from './config.js';
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -11,9 +13,5 @@ var InputButton = function InputButton(_ref) {
   }
-  return /*#__PURE__*/_jsxs("div", {
-    className: BASE_CLASS_BUTTON,
-    children: [/*#__PURE__*/_jsx("div", {
-      className: BASE_CLASS_BUTTON + "-input",
-      children: children
-    }), /*#__PURE__*/_jsx("div", {
-      className: BASE_CLASS_BUTTON + "-button",
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [children, /*#__PURE__*/_jsx("span", {
+      className: cx(BASE_CLASS_ITEM, BASE_CLASS_BUTTON + "-button"),
       children: button
@@ -20,0 +18,0 @@ })]

lib/Input/Wrappers/Icons/config.js

@@ -1,2 +0,2 @@
-import { BASE } from '../../../config.js';
+import { BASE, BASE_CLASS_AREA_FOCUSABLE, BASE_CLASS_ITEM } from '../../../config.js';
 export var ICON_TYPES = {
@@ -6,8 +6,8 @@ LEFT: 'left',
 };
+export { BASE_CLASS_ITEM, BASE_CLASS_AREA_FOCUSABLE };
 export var BASE_CLASS_ICON = BASE + "--withIcon";
-export var BASE_CLASS_ICON_LEFT = BASE_CLASS_ICON + "--" + ICON_TYPES.LEFT;
-export var BASE_CLASS_ICON_RIGHT = BASE_CLASS_ICON + "--" + ICON_TYPES.RIGHT;
 export var BASE_CLASS_ICON_COMPONENT = BASE_CLASS_ICON + "-icon";
+export var BASE_CLASS_ICON_CONTENT_COMPONENT = BASE_CLASS_ICON_COMPONENT + "--content";
 export var BASE_CLASS_ICON_COMPONENT_HANDLER = BASE_CLASS_ICON_COMPONENT + "--withHandler";
 export var BASE_CLASS_ICON_COMPONENT_LEFT = BASE_CLASS_ICON_COMPONENT + "--" + ICON_TYPES.LEFT;
 export var BASE_CLASS_ICON_COMPONENT_RIGHT = BASE_CLASS_ICON_COMPONENT + "--" + ICON_TYPES.RIGHT;

lib/Input/Wrappers/Icons/InputIcons.js

 import cx from 'classnames';
 import PropTypes from 'prop-types';
-import { BASE_CLASS_ICON, BASE_CLASS_ICON_COMPONENT, BASE_CLASS_ICON_COMPONENT_HANDLER, BASE_CLASS_ICON_COMPONENT_LEFT, BASE_CLASS_ICON_COMPONENT_RIGHT, BASE_CLASS_ICON_LEFT, BASE_CLASS_ICON_RIGHT } from './config.js';
+import { BASE_CLASS_ICON_COMPONENT, BASE_CLASS_ICON_COMPONENT_HANDLER, BASE_CLASS_ICON_COMPONENT_LEFT, BASE_CLASS_ICON_COMPONENT_RIGHT, BASE_CLASS_ICON_CONTENT_COMPONENT } from './config.js';
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var InputIcons = function InputIcons(_ref) {
-  var _cx, _cx2, _cx3;
+  var _cx, _cx2;
   var leftIcon = _ref.leftIcon,
@@ -13,5 +14,2 @@ rightIcon = _ref.rightIcon,
     children = _ref.children;
-  if (!(leftIcon || rightIcon)) {
-    return children;
-  }
   var handleLeftClick = function handleLeftClick(event) {
@@ -23,12 +21,17 @@ onClickLeftIcon && onClickLeftIcon(event);
   };
-  return /*#__PURE__*/_jsxs("div", {
-    className: cx(BASE_CLASS_ICON, (_cx = {}, _cx[BASE_CLASS_ICON_LEFT] = leftIcon, _cx[BASE_CLASS_ICON_RIGHT] = rightIcon, _cx)),
+  return /*#__PURE__*/_jsxs(_Fragment, {
     children: [leftIcon && /*#__PURE__*/_jsx("span", {
-      className: cx(BASE_CLASS_ICON_COMPONENT, BASE_CLASS_ICON_COMPONENT_LEFT, (_cx2 = {}, _cx2[BASE_CLASS_ICON_COMPONENT_HANDLER] = onClickLeftIcon, _cx2)),
+      className: cx(BASE_CLASS_ICON_COMPONENT, BASE_CLASS_ICON_COMPONENT_LEFT),
       onClick: handleLeftClick,
-      children: leftIcon
+      children: /*#__PURE__*/_jsx("span", {
+        className: cx(BASE_CLASS_ICON_CONTENT_COMPONENT, (_cx = {}, _cx[BASE_CLASS_ICON_COMPONENT_HANDLER] = onClickLeftIcon, _cx)),
+        children: leftIcon
+      })
     }), children, rightIcon && /*#__PURE__*/_jsx("span", {
-      className: cx(BASE_CLASS_ICON_COMPONENT, BASE_CLASS_ICON_COMPONENT_RIGHT, (_cx3 = {}, _cx3[BASE_CLASS_ICON_COMPONENT_HANDLER] = onClickRightIcon, _cx3)),
+      className: cx(BASE_CLASS_ICON_COMPONENT, BASE_CLASS_ICON_COMPONENT_RIGHT),
       onClick: handleRightClick,
-      children: rightIcon
+      children: /*#__PURE__*/_jsx("span", {
+        className: cx(BASE_CLASS_ICON_CONTENT_COMPONENT, (_cx2 = {}, _cx2[BASE_CLASS_ICON_COMPONENT_HANDLER] = onClickRightIcon, _cx2)),
+        children: rightIcon
+      })
     })]
@@ -35,0 +38,0 @@ });

lib/Password/config.js

@@ -1,5 +0,6 @@
-import { BASE_CLASS } from '../config.js';
-export var BASE_CLASS_PASSWORD = BASE_CLASS + "-password";
+import { BASE, BASE_CLASS_ITEM } from '../config.js';
+export { BASE_CLASS_ITEM };
+export var BASE_CLASS_PASSWORD = BASE + "-password";
 export var BASE_CLASS_PASSWORD_TOGGLE_BUTTON = BASE_CLASS_PASSWORD + "--toggleButton";
 export var TEXT = 'text';
 export var PASSWORD = 'password';

lib/Password/index.js

@@ -5,7 +5,9 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import { forwardRef, useState } from 'react';
+import cx from 'classnames';
 import PropTypes from 'prop-types';
 import useControlledState from '@s-ui/react-hooks/lib/useControlledState';
-import Input from '../Input/index.js';
-import { BASE_CLASS_PASSWORD, BASE_CLASS_PASSWORD_TOGGLE_BUTTON, PASSWORD, TEXT } from './config.js';
+import Input from '../Input/Component/index.js';
+import { BASE_CLASS_PASSWORD_TOGGLE_BUTTON, PASSWORD, TEXT } from './config.js';
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -39,4 +41,3 @@ var Password = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
   };
-  return /*#__PURE__*/_jsxs("div", {
-    className: BASE_CLASS_PASSWORD,
+  return /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsx(Input, _extends({
@@ -48,5 +49,5 @@ ref: forwardedRef
       type: type
-    })), /*#__PURE__*/_jsx("div", {
+    })), /*#__PURE__*/_jsx("span", {
       onClick: toggle,
-      className: BASE_CLASS_PASSWORD_TOGGLE_BUTTON,
+      className: cx(BASE_CLASS_PASSWORD_TOGGLE_BUTTON),
       children: type === PASSWORD ? pwShowLabel : pwHideLabel
@@ -53,0 +54,0 @@ })]

package.json

 {
   "name": "@s-ui/react-atom-input",
-  "version": "5.27.0",
+  "version": "5.28.0",
   "description": "",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

No alert changes

Improved metrics

Total package byte prevSize

39702

increased by6.21%

Lines of code

577

increased by0.35%

No dependency changes