@lanaco/lnc-react-ui 4.0.97 → 4.0.98

package/dist/NumberInput.cjs

@@ -1,20 +1,20 @@
-"use strict";const c=require("react/jsx-runtime"),t=require("./index-BPVoEhTF.cjs"),a=require("react"),M=require("./index-DaiUAQVF.cjs"),p=require("./emotion-styled.browser.esm-BtEseadx.cjs"),n=require("./utils-BOtq2mcF.cjs"),v=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),K=p.styled.div`
+"use strict";const c=require("react/jsx-runtime"),r=require("./index-BPVoEhTF.cjs"),l=require("react"),K=require("./index-DaiUAQVF.cjs"),p=require("./emotion-styled.browser.esm-BtEseadx.cjs"),o=require("./utils-BOtq2mcF.cjs"),X=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),H=p.styled.div`
   display: flex;
   align-items: center;
 
-  min-height: ${e=>n.getSizeValueWithUnits(e.theme,e.size)};
-  max-height: ${e=>n.getSizeValueWithUnits(e.theme,e.size)};
-  background-color: ${e=>n.getColorRgbaValue(e.theme,"Input",e.color,"enabled","background")};
+  min-height: ${e=>o.getSizeValueWithUnits(e.theme,e.size)};
+  max-height: ${e=>o.getSizeValueWithUnits(e.theme,e.size)};
+  background-color: ${e=>o.getColorRgbaValue(e.theme,"Input",e.color,"enabled","background")};
   border: 1px solid
-    ${e=>n.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,e.disabled===!0?"disabled":"enabled","border")};
-  border-radius: ${e=>n.getBorderRadiusValueWithUnits(e.theme,"regular")};
+    ${e=>o.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,e.disabled===!0?"disabled":"enabled","border")};
+  border-radius: ${e=>o.getBorderRadiusValueWithUnits(e.theme,"regular")};
 
-  ${e=>e.focused&&e.readOnly!==!0?n.getOutlineCss(e.theme):""}
-  ${e=>e.disabled===!0?n.getDisabledStateCss(e.theme):""}
-`,I=p.styled.span`
+  ${e=>e.focused&&e.readOnly!==!0?o.getOutlineCss(e.theme):""}
+  ${e=>e.disabled===!0?o.getDisabledStateCss(e.theme):""}
+`,R=p.styled.span`
   padding: 0 12px;
-  color: ${e=>n.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,"enabled","prefix")};
-`,X=p.styled(I)``,H=p.styled.input`
+  color: ${e=>o.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,"enabled","prefix")};
+`,J=p.styled(R)``,L=p.styled.input`
   background: none;
   border: none;
   outline: none;
@@ -22,16 +22,16 @@
   padding-bottom: 0.625rem;
   width: 100%;
 
-  ${e=>n.getComponentTypographyCss(e.theme,"Input",e.size,"enabled")}
-  min-height: ${e=>n.getSizeValueWithUnits(e.theme,e.size)};
-  max-height: ${e=>n.getSizeValueWithUnits(e.theme,e.size)};
-  color: ${e=>n.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,"enabled","text")};
-  caret-color: ${e=>n.getColorRgbaValue(e.theme,"Input",e.color,"enabled","caret")};
+  ${e=>o.getComponentTypographyCss(e.theme,"Input",e.size,"enabled")}
+  min-height: ${e=>o.getSizeValueWithUnits(e.theme,e.size)};
+  max-height: ${e=>o.getSizeValueWithUnits(e.theme,e.size)};
+  color: ${e=>o.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,"enabled","text")};
+  caret-color: ${e=>o.getColorRgbaValue(e.theme,"Input",e.color,"enabled","caret")};
   padding-right: ${e=>e.suffix?"0":"0.75rem"};
   padding-left: ${e=>e.prefix?"0":"0.75rem"};
 
   &::placeholder {
-    color: ${e=>n.getColorRgbaValue(e.theme,"Input",e.color,"enabled","placeholder")};
+    color: ${e=>o.getColorRgbaValue(e.theme,"Input",e.color,"enabled","placeholder")};
   }
 
   &:read-only {
@@ -39,7 +39,7 @@
   }
 
   &:disabled {
-    ${e=>n.getDisabledStateCss(e.theme)}
+    ${e=>o.getDisabledStateCss(e.theme)}
     background: none;
   }
-`,R=a.forwardRef((e,z)=>{const{disabled:T,readOnly:x,debounceTime:N=0,step:O=1,min:E=Number.MIN_SAFE_INTEGER,max:_=Number.MAX_SAFE_INTEGER,prefix:m,suffix:y,placeholder:k,value:o,defaultValue:P,onChange:l,onBlur:g,onFocus:b,onKeyDown:h,className:q="",style:j={},size:$="small",color:u="primary",...w}=e,i=v.useTheme(),d=a.useRef(o||P||""),[F,V]=a.useState(o||P||""),[f,C]=a.useState(!1);a.useEffect(()=>{o!=null&&(d.current=o,V(d.current))},[o]);const W=a.useCallback(M.debounce((r,s)=>U(r,s),N),[l]),U=(r,s)=>{l&&(l==null||l(r,s))},D=r=>{d.current=r.target.value,V(d.current),W(r,r.target.value)},A=r=>{C(!0),b==null||b(r)},B=r=>{C(!1),g==null||g(r)},G=r=>{var s,S;((S=(s=r==null?void 0:r.target)==null?void 0:s.value)==null?void 0:S.length)>0&&(r.key==="+"||r.key==="-")&&r.preventDefault(),h==null||h(r)};return c.jsxs(K,{style:j,className:q,theme:i,color:u,size:$,focused:f,disabled:T,readOnly:x,children:[m&&c.jsx(I,{theme:i,color:u,focused:f,className:"lnc-input-prefix",children:m}),c.jsx(H,{ref:z,type:"number",theme:i,color:u,size:$,placeholder:k,prefix:m,suffix:y,disabled:T,readOnly:x,step:O,min:E,max:_,value:F,onFocus:A,onBlur:B,onChange:D,onKeyDown:G,...w}),y&&c.jsx(X,{theme:i,color:u,focused:f,className:"lnc-input-suffix",children:y})]})});R.propTypes={id:t.PropTypes.any,value:t.PropTypes.any,defaultValue:t.PropTypes.any,disabled:t.PropTypes.bool,readOnly:t.PropTypes.bool,debounceTime:t.PropTypes.number,step:t.PropTypes.number,min:t.PropTypes.number,max:t.PropTypes.number,prefix:t.PropTypes.oneOfType([t.PropTypes.string,t.PropTypes.element]),suffix:t.PropTypes.oneOfType([t.PropTypes.string,t.PropTypes.element]),placeholder:t.PropTypes.string,tabIndex:t.PropTypes.number,onChange:t.PropTypes.func,onBlur:t.PropTypes.func,onFocus:t.PropTypes.func,className:t.PropTypes.string,style:t.PropTypes.object,size:t.PropTypes.oneOf(["small","medium","large"]),color:t.PropTypes.oneOf(["primary","secondary","success","danger","warning","information","neutral","gray"])};module.exports=R;
+`,z=l.forwardRef((e,k)=>{const{disabled:T,readOnly:x,debounceTime:N=0,step:O=1,min:E=Number.MIN_SAFE_INTEGER,max:_=Number.MAX_SAFE_INTEGER,prefix:m,suffix:y,placeholder:q,value:n,defaultValue:P,onChange:s,onBlur:g,onFocus:b,onKeyDown:h,className:j="",style:w={},size:$="small",color:u="primary",...F}=e,i=X.useTheme(),d=l.useRef(n||P||""),[W,V]=l.useState(n||P||""),[f,C]=l.useState(!1);l.useEffect(()=>{n!=null&&(d.current=n,V(d.current))},[n]);const U=l.useCallback(K.debounce((t,a)=>D(t,a),N),[s]),D=(t,a)=>{s&&(s==null||s(t,a))},A=t=>{d.current=t.target.value,V(d.current),U(t,t.target.value)},B=t=>{C(!0),b==null||b(t)},G=t=>{C(!1),g==null||g(t)},M=t=>{var a,S,I;((S=(a=t==null?void 0:t.target)==null?void 0:a.value)==null?void 0:S.length)>0&&(t.key==="+"||t.key==="-")&&t.preventDefault(),((I=t==null?void 0:t.target)==null?void 0:I.value)===""&&(t.key==="+"||t.key==="-")&&(t.target.value=t.key),h==null||h(t)};return c.jsxs(H,{style:w,className:j,theme:i,color:u,size:$,focused:f,disabled:T,readOnly:x,children:[m&&c.jsx(R,{theme:i,color:u,focused:f,className:"lnc-input-prefix",children:m}),c.jsx(L,{ref:k,type:"number",theme:i,color:u,size:$,placeholder:q,prefix:m,suffix:y,disabled:T,readOnly:x,step:O,min:E,max:_,value:W,onFocus:B,onBlur:G,onChange:A,onKeyDown:M,...F}),y&&c.jsx(J,{theme:i,color:u,focused:f,className:"lnc-input-suffix",children:y})]})});z.propTypes={id:r.PropTypes.any,value:r.PropTypes.any,defaultValue:r.PropTypes.any,disabled:r.PropTypes.bool,readOnly:r.PropTypes.bool,debounceTime:r.PropTypes.number,step:r.PropTypes.number,min:r.PropTypes.number,max:r.PropTypes.number,prefix:r.PropTypes.oneOfType([r.PropTypes.string,r.PropTypes.element]),suffix:r.PropTypes.oneOfType([r.PropTypes.string,r.PropTypes.element]),placeholder:r.PropTypes.string,tabIndex:r.PropTypes.number,onChange:r.PropTypes.func,onBlur:r.PropTypes.func,onFocus:r.PropTypes.func,className:r.PropTypes.string,style:r.PropTypes.object,size:r.PropTypes.oneOf(["small","medium","large"]),color:r.PropTypes.oneOf(["primary","secondary","success","danger","warning","information","neutral","gray"])};module.exports=z;

package/dist/NumberInput.js

@@ -1,16 +1,16 @@
-import { jsxs as G, jsx as p } from "react/jsx-runtime";
-import { P as n } from "./index-S5Cd7WrG.js";
-import { forwardRef as K, useRef as M, useState as V, useEffect as U, useCallback as v } from "react";
-import { d as X } from "./index-CkWvbrVT.js";
+import { jsxs as K, jsx as p } from "react/jsx-runtime";
+import { P as t } from "./index-S5Cd7WrG.js";
+import { forwardRef as M, useRef as U, useState as V, useEffect as X, useCallback as q } from "react";
+import { d as H } from "./index-CkWvbrVT.js";
 import { s as c } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { d as i, b as l, a as q, e as H, h as O, c as J } from "./utils-WHYrEnYF.js";
-import { u as L } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-const Q = c.div`
+import { d as s, b as l, a as J, e as L, h as O, c as Q } from "./utils-WHYrEnYF.js";
+import { u as Y } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+const Z = c.div`
   display: flex;
   align-items: center;
 
-  min-height: ${(e) => i(e.theme, e.size)};
-  max-height: ${(e) => i(e.theme, e.size)};
+  min-height: ${(e) => s(e.theme, e.size)};
+  max-height: ${(e) => s(e.theme, e.size)};
   background-color: ${(e) => l(
   e.theme,
   "Input",
@@ -26,9 +26,9 @@ const Q = c.div`
   e.disabled === !0 ? "disabled" : "enabled",
   "border"
 )};
-  border-radius: ${(e) => q(e.theme, "regular")};
+  border-radius: ${(e) => J(e.theme, "regular")};
 
-  ${(e) => e.focused && e.readOnly !== !0 ? H(e.theme) : ""}
+  ${(e) => e.focused && e.readOnly !== !0 ? L(e.theme) : ""}
   ${(e) => e.disabled === !0 ? O(e.theme) : ""}
 `, z = c.span`
   padding: 0 12px;
@@ -39,7 +39,7 @@ const Q = c.div`
   "enabled",
   "prefix"
 )};
-`, Y = c(z)``, Z = c.input`
+`, v = c(z)``, ee = c.input`
   background: none;
   border: none;
   outline: none;
@@ -47,9 +47,9 @@ const Q = c.div`
   padding-bottom: 0.625rem;
   width: 100%;
 
-  ${(e) => J(e.theme, "Input", e.size, "enabled")}
-  min-height: ${(e) => i(e.theme, e.size)};
-  max-height: ${(e) => i(e.theme, e.size)};
+  ${(e) => Q(e.theme, "Input", e.size, "enabled")}
+  min-height: ${(e) => s(e.theme, e.size)};
+  max-height: ${(e) => s(e.theme, e.size)};
   color: ${(e) => l(
   e.theme,
   "Input",
@@ -79,18 +79,18 @@ const Q = c.div`
     ${(e) => O(e.theme)}
     background: none;
   }
-`, ee = K((e, k) => {
+`, ae = M((e, E) => {
   const {
     disabled: x,
     readOnly: $,
-    debounceTime: E = 0,
-    step: R = 1,
-    min: F = Number.MIN_SAFE_INTEGER,
-    max: w = Number.MAX_SAFE_INTEGER,
+    debounceTime: R = 0,
+    step: F = 1,
+    min: w = Number.MIN_SAFE_INTEGER,
+    max: B = Number.MAX_SAFE_INTEGER,
     prefix: m,
     suffix: f,
-    placeholder: B,
-    value: a,
+    placeholder: D,
+    value: n,
     defaultValue: I,
     //----------------
     onChange: o,
@@ -98,26 +98,26 @@ const Q = c.div`
     onFocus: b,
     onKeyDown: g,
     //----------------
-    className: D = "",
-    style: _ = {},
+    className: _ = "",
+    style: j = {},
     size: C = "small",
     color: u = "primary",
-    ...j
-  } = e, d = L(), s = M(a || I || ""), [A, N] = V(a || I || ""), [y, S] = V(!1);
-  U(() => {
-    a != null && (s.current = a, N(s.current));
-  }, [a]);
-  const P = v(
-    X((t, r) => W(t, r), E),
+    ...A
+  } = e, d = Y(), i = U(n || I || ""), [P, k] = V(n || I || ""), [y, N] = V(!1);
+  X(() => {
+    n != null && (i.current = n, k(i.current));
+  }, [n]);
+  const W = q(
+    H((a, r) => G(a, r), R),
     [o]
-  ), W = (t, r) => {
-    o && (o == null || o(t, r));
+  ), G = (a, r) => {
+    o && (o == null || o(a, r));
   };
-  return /* @__PURE__ */ G(
-    Q,
+  return /* @__PURE__ */ K(
+    Z,
     {
-      style: _,
-      className: D,
+      style: j,
+      className: _,
       theme: d,
       color: u,
       size: C,
@@ -136,40 +136,40 @@ const Q = c.div`
           }
         ),
         /* @__PURE__ */ p(
-          Z,
+          ee,
           {
-            ref: k,
+            ref: E,
             type: "number",
             theme: d,
             color: u,
             size: C,
-            placeholder: B,
+            placeholder: D,
             prefix: m,
             suffix: f,
             disabled: x,
             readOnly: $,
-            step: R,
-            min: F,
-            max: w,
-            value: A,
-            onFocus: (t) => {
-              S(!0), b == null || b(t);
+            step: F,
+            min: w,
+            max: B,
+            value: P,
+            onFocus: (a) => {
+              N(!0), b == null || b(a);
             },
-            onBlur: (t) => {
-              S(!1), h == null || h(t);
+            onBlur: (a) => {
+              N(!1), h == null || h(a);
             },
-            onChange: (t) => {
-              s.current = t.target.value, N(s.current), P(t, t.target.value);
+            onChange: (a) => {
+              i.current = a.target.value, k(i.current), W(a, a.target.value);
             },
-            onKeyDown: (t) => {
-              var r, T;
-              ((T = (r = t == null ? void 0 : t.target) == null ? void 0 : r.value) == null ? void 0 : T.length) > 0 && (t.key === "+" || t.key === "-") && t.preventDefault(), g == null || g(t);
+            onKeyDown: (a) => {
+              var r, S, T;
+              ((S = (r = a == null ? void 0 : a.target) == null ? void 0 : r.value) == null ? void 0 : S.length) > 0 && (a.key === "+" || a.key === "-") && a.preventDefault(), ((T = a == null ? void 0 : a.target) == null ? void 0 : T.value) === "" && (a.key === "+" || a.key === "-") && (a.target.value = a.key), g == null || g(a);
             },
-            ...j
+            ...A
           }
         ),
         f && /* @__PURE__ */ p(
-          Y,
+          v,
           {
             theme: d,
             color: u,
@@ -182,55 +182,55 @@ const Q = c.div`
     }
   );
 });
-ee.propTypes = {
-  id: n.any,
-  value: n.any,
-  defaultValue: n.any,
-  disabled: n.bool,
-  readOnly: n.bool,
+ae.propTypes = {
+  id: t.any,
+  value: t.any,
+  defaultValue: t.any,
+  disabled: t.bool,
+  readOnly: t.bool,
   /**
    * Time in miliseconds before onChange event fires after it has been triggered.
    */
-  debounceTime: n.number,
+  debounceTime: t.number,
   /**
    * The amount that is added to the current value in the input if its incremented using the arrows/spinners.
    */
-  step: n.number,
+  step: t.number,
   /**
    * Minimum number value user can input.
    */
-  min: n.number,
+  min: t.number,
   /**
    * Maximum number value user can input.
    */
-  max: n.number,
+  max: t.number,
   /**
    * Reserved space before input. Intented to be used with plain text or `Icon` component.
    */
-  prefix: n.oneOfType([n.string, n.element]),
+  prefix: t.oneOfType([t.string, t.element]),
   /**
    * Reserved space after input. Intented to be used with plain text or `Icon` component.
    */
-  suffix: n.oneOfType([n.string, n.element]),
-  placeholder: n.string,
-  tabIndex: n.number,
+  suffix: t.oneOfType([t.string, t.element]),
+  placeholder: t.string,
+  tabIndex: t.number,
   /**
    * `(event, value) => void`
    */
-  onChange: n.func,
+  onChange: t.func,
   /**
    * `(event) => void`
    */
-  onBlur: n.func,
+  onBlur: t.func,
   /**
    * `(event) => void`
    */
-  onFocus: n.func,
+  onFocus: t.func,
   //----------------
-  className: n.string,
-  style: n.object,
-  size: n.oneOf(["small", "medium", "large"]),
-  color: n.oneOf([
+  className: t.string,
+  style: t.object,
+  size: t.oneOf(["small", "medium", "large"]),
+  color: t.oneOf([
     "primary",
     "secondary",
     "success",
@@ -242,5 +242,5 @@ ee.propTypes = {
   ])
 };
 export {
-  ee as default
+  ae as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lanaco/lnc-react-ui",
-  "version": "4.0.97",
+  "version": "4.0.98",
   "description": "React component library",
   "type": "module",
   "keywords": [