@shoplflow/base 0.24.21 → 0.24.23

package/dist/index.cjs

@@ -546,6 +546,7 @@ var setEllipsis = (maxLines) => {
     -webkit-line-clamp: ${maxLines};
     -webkit-box-orient: vertical;
     overflow: hidden;
+    word-break: break-all;
     text-overflow: ellipsis;
   `;
 };
@@ -1398,7 +1399,8 @@ var Button = React2.forwardRef(
       as,
       children,
       leftSource,
-      rightSource
+      rightSource,
+      lineClamp
     } = _b, rest = __objRest(_b, [
       "styleVar",
       "sizeVar",
@@ -1407,7 +1409,8 @@ var Button = React2.forwardRef(
       "as",
       "children",
       "leftSource",
-      "rightSource"
+      "rightSource",
+      "lineClamp"
     ]);
     return /* @__PURE__ */ jsxRuntime.jsxs(
       StyledButton,
@@ -1426,8 +1429,7 @@ var Button = React2.forwardRef(
           /* @__PURE__ */ jsxRuntime.jsx(
             exports.Text,
             {
-              wordBreak: "keep-all",
-              whiteSpace: "nowrap",
+              lineClamp,
               color: styleVar === "PRIMARY" ? "neutral0" : "neutral700",
               typography: sizeVar === "M" ? "body1_400" : "body2_400",
               children
@@ -1860,11 +1862,12 @@ var getBorderColorByStatus = ({ isFocused, isError, isHovered, disabled }) => {
 var InputWrapper = styled5__default.default.label`
   display: flex;
   align-items: center;
-  width: ${({ width }) => width != null ? width : "100%"};
-  height: fit-content;
+  width: ${({ width }) => width != null ? width : "calc(100% - 2px)"};
+  min-width: ${({ minWidth }) => minWidth != null ? minWidth : "fit-content"};
+  height: ${({ height }) => height != null ? height : "fit-content"};
   flex-direction: ${({ direction }) => direction || "row"};
   justify-content: space-between;
-  min-height: ${({ height }) => height != null ? height : "40px"};
+  min-height: ${({ minHeight }) => minHeight != null ? minHeight : "38px"};
   margin: 1px;
   gap: 8px;
   box-shadow: 0 0 0 1px ${(props) => getBorderColorByStatus(props)};
@@ -2936,7 +2939,7 @@ var StyledTextarea = styled5__default.default.textarea`
   background-color: transparent;
   resize: none;
   width: 100%;
-  height: ${({ minHeight }) => minHeight ? `${minHeight}px` : "300px"};
+  height: 100%;
   flex: 1;
   word-break: break-all;
   ${({ disabled }) => getDisabledStyle(disabled)};
@@ -2957,8 +2960,9 @@ var TextArea = React2.forwardRef(
       defaultValue,
       onBlur,
       onFocus,
-      minHeight = 100,
+      minHeight = "100px",
       width,
+      height,
       className
     } = _b, rest = __objRest(_b, [
       "name",
@@ -2973,6 +2977,7 @@ var TextArea = React2.forwardRef(
       "onFocus",
       "minHeight",
       "width",
+      "height",
       "className"
     ]);
     const [text, setText] = React2.useState("");
@@ -3032,6 +3037,8 @@ var TextArea = React2.forwardRef(
         direction: "column",
         onMouseEnter: handleOnMouseEnter,
         onMouseLeave: handleOnMouseLeave,
+        height,
+        minHeight,
         width,
         "data-shoplflow": "text-area",
         children: [
@@ -3048,8 +3055,7 @@ var TextArea = React2.forwardRef(
               value,
               ref,
               maxLength,
-              disabled,
-              minHeight
+              disabled
             }, rest)
           ),
           /* @__PURE__ */ jsxRuntime.jsx(BottomElementWrapper, { children: maxLength && /* @__PURE__ */ jsxRuntime.jsx(TextCounter_default, { currentLength: String(text).length, maxLength }) })