@soul-refiner/design-system 2.14.72 → 2.14.73

package/dist/components/input/counter/counter.js

@@ -1,12 +1,12 @@
 "use client";
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),o=require("styled-components"),t=require("../../../icons/basic/plus.js"),l=require("../../../icons/basic/minus.js");const n=o.styled.div`
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),o=require("styled-components"),t=require("../../../icons/basic/plus.js"),l=require("../../../icons/basic/minus.js");const i=o.styled.div`
   display: flex;
   flex-direction: column;
   gap: 8px;
   width: fit-content;
 
   ${({$sx:e})=>e||""}
-`,i=o.styled.label`
+`,n=o.styled.label`
   font-family: var(--font-inter);
   font-size: ${({$size:e})=>"small"===e?12:"large"===e?16:14}px;
   font-weight: 500;
@@ -70,8 +70,8 @@
   border-right: 1px solid var(--color-grey-8);
   color: var(--color-grey-2);
   font-family: var(--font-inter);
-  font-size: ${({$size:e})=>"small"===e?14:16}px;
-  font-weight: 500;
+  font-size: ${({$size:e})=>"small"===e?14:"large"===e?18:16}px;
+  font-weight: 700;
   line-height: ${({$size:e})=>"small"===e?20:"large"===e?24:22}px;
   outline: none;
   text-align: center;
@@ -114,7 +114,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  background-color: var(--color-blue-3);
+  background-color: var(--color-primary-blue-2);
   border: none;
   border-radius: 0 8px 8px 0;
   cursor: pointer;
@@ -123,10 +123,6 @@
   min-width: ${({$size:e})=>{switch(e){case"small":return"32px";case"large":return"48px";default:return"40px"}}};
   height: 100%;
 
-  &:hover:not(:disabled) {
-    background-color: var(--color-blue-2);
-  }
-
   &:active:not(:disabled) {
     background-color: var(--color-blue-1);
   }
@@ -148,4 +144,4 @@
 
   ${({$error:e})=>e&&"color: var(--color-red-4);"}
   ${({$success:e})=>e&&"color: var(--color-green-3);"}
-`;exports.Counter=({value:o,onChange:g,min:h=0,max:x=999,step:$=1,disabled:b=!1,size:v="medium",variant:f="default",allowDirectInput:y=!0,placeholder:m="0",label:w,helperText:z,error:k=!1,errorText:j,success:S=!1,successText:M,width:N,maxWidth:q,height:C,className:D,sx:W})=>{const[I,T]=r.useState(o.toString()),[A,E]=r.useState(!1),[B,F]=r.useState(!1);r.useEffect(()=>{A||T(o.toString())},[o,A]);const K=e=>{const r=Math.max(h,Math.min(x,e));r!==o&&g(r),F(!1)},P=()=>{if(b)return;const e=Math.max(h,o-$);K(e)},U=()=>{if(b)return;const e=Math.min(x,o+$);K(e)},G=()=>{if(E(!1),""===I)return void T(o.toString());const e=parseInt(I,10);if(isNaN(e)||e<h||e>x)return T(o.toString()),void F(!1);K(e)},H=b||o<=h,J=b||o>=x,L=k||B,O=S&&!L;return e.jsxs(n,{className:D,$sx:W,children:[w&&e.jsx(i,{$size:v,$disabled:b,children:w}),e.jsxs(a,{$size:v,$variant:f,$disabled:b,$error:L,$success:O,$width:N,$maxWidth:q,$height:C,children:[e.jsx(s,{onClick:P,disabled:H,$size:v,$variant:f,type:"button",children:e.jsx(l.Minus,{color:"grey-3",size:"small"===v?16:"large"===v?20:16})}),y?e.jsx(c,{type:"text",inputMode:"numeric",pattern:"[0-9]*",value:I,onChange:e=>{const r=e.target.value;if(T(r),""===r)return void F(!1);const o=parseInt(r,10);isNaN(o)?F(!0):F(o<h||o>x)},onFocus:()=>{E(!0),F(!1)},onBlur:G,onKeyDown:e=>{"Enter"===e.key&&G(),"ArrowUp"===e.key&&(e.preventDefault(),U()),"ArrowDown"===e.key&&(e.preventDefault(),P())},disabled:b,placeholder:m,$size:v,$error:L,$success:O,$variant:f}):e.jsx(d,{$size:v,$variant:f,children:e.jsx("span",{style:{fontSize:"small"===v?14:16,fontWeight:500,color:"var(--color-grey-2)",margin:0},children:o})}),e.jsx(u,{onClick:U,disabled:J,$size:v,$variant:f,type:"button",children:e.jsx(t.Plus,{color:"white",size:"small"===v?16:"large"===v?20:16})})]}),(z||j||M)&&e.jsxs(p,{$size:v,$error:L,$success:O,children:[L&&j,O&&M,!L&&!O&&z]})]})};
+`;exports.Counter=({value:o,onChange:g,min:x=0,max:h=999,step:$=1,disabled:v=!1,size:b="medium",variant:y="default",allowDirectInput:f=!0,placeholder:m="0",label:w,helperText:z,error:k=!1,errorText:j,success:S=!1,successText:M,width:N,maxWidth:q,height:C,className:D,sx:W})=>{const[I,T]=r.useState(o.toString()),[A,E]=r.useState(!1),[B,F]=r.useState(!1);r.useEffect(()=>{A||T(o.toString())},[o,A]);const K=e=>{const r=Math.max(x,Math.min(h,e));r!==o&&g(r),F(!1)},P=()=>{if(v)return;const e=Math.max(x,o-$);K(e)},U=()=>{if(v)return;const e=Math.min(h,o+$);K(e)},G=()=>{if(E(!1),""===I)return void T(o.toString());const e=parseInt(I,10);if(isNaN(e)||e<x||e>h)return T(o.toString()),void F(!1);K(e)},H=v||o<=x,J=v||o>=h,L=k||B,O=S&&!L;return e.jsxs(i,{className:D,$sx:W,children:[w&&e.jsx(n,{$size:b,$disabled:v,children:w}),e.jsxs(a,{$size:b,$variant:y,$disabled:v,$error:L,$success:O,$width:N,$maxWidth:q,$height:C,children:[e.jsx(s,{onClick:P,disabled:H,$size:b,$variant:y,type:"button",children:e.jsx(l.Minus,{color:"grey-3",size:"small"===b?16:"large"===b?24:16})}),f?e.jsx(c,{type:"text",inputMode:"numeric",pattern:"[0-9]*",value:I,onChange:e=>{const r=e.target.value;if(T(r),""===r)return void F(!1);const o=parseInt(r,10);isNaN(o)?F(!0):F(o<x||o>h)},onFocus:()=>{E(!0),F(!1)},onBlur:G,onKeyDown:e=>{"Enter"===e.key&&G(),"ArrowUp"===e.key&&(e.preventDefault(),U()),"ArrowDown"===e.key&&(e.preventDefault(),P())},disabled:v,placeholder:m,$size:b,$error:L,$success:O,$variant:y}):e.jsx(d,{$size:b,$variant:y,children:e.jsx("span",{style:{fontSize:"small"===b?14:16,fontWeight:500,color:"var(--color-grey-2)",margin:0},children:o})}),e.jsx(u,{onClick:U,disabled:J,$size:b,$variant:y,type:"button",children:e.jsx(t.Plus,{color:"white",size:"small"===b?16:"large"===b?24:16})})]}),(z||j||M)&&e.jsxs(p,{$size:b,$error:L,$success:O,children:[L&&j,O&&M,!L&&!O&&z]})]})};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soul-refiner/design-system",
-  "version": "2.14.72",
+  "version": "2.14.73",
   "main": "dist/index.js",
   "types": "dist/src/index.d.ts",
   "license": "MIT",