@zenkigen-inc/component-ui 1.14.4 → 1.14.5

package/dist/index.js

@@ -18,7 +18,7 @@ function _objectWithoutPropertiesLoose(r, e) {
   if (null == r) return {};
   var t = {};
   for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
-    if (e.includes(n)) continue;
+    if (-1 !== e.indexOf(n)) continue;
     t[n] = r[n];
   }
   return t;
@@ -679,7 +679,7 @@ function Modal({
   useEffect(() => {
     setIsMounted(true);
   }, []);
-  return isMounted && isOpen ? /*#__PURE__*/createPortal( /*#__PURE__*/jsx(ModalContext.Provider, {
+  return isMounted && isOpen ? /*#__PURE__*/createPortal(/*#__PURE__*/jsx(ModalContext.Provider, {
     value: {
       onClose
     },
@@ -1552,19 +1552,23 @@ const TextInput = /*#__PURE__*/forwardRef((_ref, ref) => {
       onClickClearButton
     } = _ref,
     props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  const isShowClearButton = !!onClickClearButton && props.value.length !== 0 && !disabled;
   const inputWrapClasses = clsx('relative flex items-center gap-2 overflow-hidden rounded border', {
     'border-uiBorder02': !isError && !disabled,
     'border-supportError': isError && !disabled,
     'hover:border-hoverInput': !disabled && !isError,
     'hover:focus-within:border-activeInput': !isError,
     'focus-within:border-activeInput': !isError,
-    'bg-disabled02 border-disabled01': disabled
+    'bg-disabled02 border-disabled01': disabled,
+    'pr-2': size === 'medium' && isShowClearButton,
+    'pr-3': size === 'large' && isShowClearButton
   });
-  const inputClasses = clsx('flex-1 pl-2 pr-3 outline-0 placeholder:text-textPlaceholder disabled:text-textPlaceholder', {
-    ['typography-label14regular min-h-8']: size === 'medium',
-    ['typography-label16regular min-h-10']: size === 'large',
+  const inputClasses = clsx('flex-1 outline-0 placeholder:text-textPlaceholder disabled:text-textPlaceholder', {
+    ['typography-label14regular min-h-8 px-2']: size === 'medium',
+    ['typography-label16regular min-h-10 px-3']: size === 'large',
     'text-text01': !isError,
-    'text-supportError': isError
+    'text-supportError': isError,
+    'pr-0': isShowClearButton
   });
   return /*#__PURE__*/jsxs("div", {
     className: inputWrapClasses,
@@ -1574,15 +1578,11 @@ const TextInput = /*#__PURE__*/forwardRef((_ref, ref) => {
       className: inputClasses,
       disabled: disabled,
       onChange: props.onChange
-    }, props)), onClickClearButton && props.value.length !== 0 && !disabled && /*#__PURE__*/jsx("div", {
-      className: "absolute right-3",
-      children: /*#__PURE__*/jsx(IconButton, {
-        variant: "text",
-        icon: "close",
-        size: "small",
-        isNoPadding: true,
-        onClick: onClickClearButton
-      })
+    }, props)), isShowClearButton && /*#__PURE__*/jsx(IconButton, {
+      variant: "text",
+      icon: "close",
+      size: "small",
+      onClick: onClickClearButton
     })]
   });
 });
@@ -1685,7 +1685,7 @@ const ToastProvider = ({
       addToast,
       removeToast
     },
-    children: [children, isClientRender && /*#__PURE__*/createPortal( /*#__PURE__*/jsx("div", {
+    children: [children, isClientRender && /*#__PURE__*/createPortal(/*#__PURE__*/jsx("div", {
       className: "pointer-events-none fixed bottom-0 left-0 z-toast mb-4 ml-4 flex w-full flex-col-reverse gap-[16px]",
       children: toasts.map(({
         id,
@@ -1961,7 +1961,7 @@ function Tooltip({
       verticalPosition: verticalPosition,
       horizontalAlign: horizontalAlign,
       tooltipPosition: tooltipPosition
-    }) : ( /*#__PURE__*/createPortal( /*#__PURE__*/jsx(TooltipContent, {
+    }) : (/*#__PURE__*/createPortal(/*#__PURE__*/jsx(TooltipContent, {
       isPortal: true,
       content: content,
       size: size,