@lanaco/lnc-react-ui 4.0.94 → 4.0.95

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- "use strict";const i=require("react/jsx-runtime"),t=require("./index-BPVoEhTF.cjs"),l=require("react"),U=require("./index-DaiUAQVF.cjs"),d=require("./emotion-styled.browser.esm-BtEseadx.cjs"),r=require("./utils-BOtq2mcF.cjs"),A=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),B=d.styled.div`
1
+ "use strict";const d=require("react/jsx-runtime"),t=require("./index-BPVoEhTF.cjs"),s=require("react"),A=require("./index-DaiUAQVF.cjs"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),r=require("./utils-BOtq2mcF.cjs"),B=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),D=c.styled.div`
2
2
  display: flex;
3
3
  align-items: center;
4
4
 
@@ -11,10 +11,10 @@
11
11
 
12
12
  ${e=>e.focused&&e.readOnly!==!0?r.getOutlineCss(e.theme):""}
13
13
  ${e=>e.disabled===!0?r.getDisabledStateCss(e.theme):""}
14
- `,$=d.styled.span`
14
+ `,C=c.styled.span`
15
15
  padding: 0 12px;
16
16
  color: ${e=>r.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,"enabled","prefix")};
17
- `,D=d.styled($)``,G=d.styled.input`
17
+ `,G=c.styled(C)``,M=c.styled.input`
18
18
  background: none;
19
19
  border: none;
20
20
  outline: none;
@@ -42,4 +42,4 @@
42
42
  ${e=>r.getDisabledStateCss(e.theme)}
43
43
  background: none;
44
44
  }
45
- `,C=l.forwardRef((e,S)=>{const{disabled:h,readOnly:f,debounceTime:V=0,step:I=1,min:R=Number.MIN_SAFE_INTEGER,max:z=Number.MAX_SAFE_INTEGER,prefix:c,suffix:m,placeholder:N,value:o,defaultValue:O,onChange:s,onBlur:p,onFocus:y,className:E="",style:_={},size:T="small",color:a="primary",...q}=e,u=A.useTheme(),[v,x]=l.useState(o||O||""),[g,P]=l.useState(!1);l.useEffect(()=>{o!=null&&x(o)},[o]);const j=l.useCallback(U.debounce((n,b)=>F(n,b),V),[s]),F=(n,b)=>{s&&(s==null||s(n,b))},W=n=>{x(n.target.value),j(n,n.target.value)},k=n=>{P(!0),y==null||y(n)},w=n=>{P(!1),p==null||p(n)};return i.jsxs(B,{style:_,className:E,theme:u,color:a,size:T,focused:g,disabled:h,readOnly:f,children:[c&&i.jsx($,{theme:u,color:a,focused:g,className:"lnc-input-prefix",children:c}),i.jsx(G,{ref:S,type:"number",theme:u,color:a,size:T,placeholder:N,prefix:c,suffix:m,disabled:h,readOnly:f,step:I,min:R,max:z,value:v,onFocus:k,onBlur:w,onChange:W,...q}),m&&i.jsx(D,{theme:u,color:a,focused:g,className:"lnc-input-suffix",children:m})]})});C.propTypes={id:t.PropTypes.string,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=C;
45
+ `,S=s.forwardRef((e,I)=>{const{disabled:f,readOnly:T,debounceTime:R=0,step:z=1,min:N=Number.MIN_SAFE_INTEGER,max:O=Number.MAX_SAFE_INTEGER,prefix:m,suffix:p,placeholder:E,value:o,defaultValue:x,onChange:l,onBlur:y,onFocus:g,className:_="",style:q={},size:P="small",color:a="primary",...v}=e,u=B.useTheme(),i=s.useRef(o||x||""),[j,$]=s.useState(o||x||""),[b,V]=s.useState(!1);s.useEffect(()=>{o!=null&&(i.current=o,$(i.current))},[o]);const F=s.useCallback(A.debounce((n,h)=>W(n,h),R),[l]),W=(n,h)=>{l&&(l==null||l(n,h))},k=n=>{i.current=n.target.value,$(i.current),F(n,n.target.value)},w=n=>{V(!0),g==null||g(n)},U=n=>{V(!1),y==null||y(n)};return d.jsxs(D,{style:q,className:_,theme:u,color:a,size:P,focused:b,disabled:f,readOnly:T,children:[m&&d.jsx(C,{theme:u,color:a,focused:b,className:"lnc-input-prefix",children:m}),d.jsx(M,{ref:I,type:"number",theme:u,color:a,size:P,placeholder:E,prefix:m,suffix:p,disabled:f,readOnly:T,step:z,min:N,max:O,value:j,onFocus:w,onBlur:U,onChange:k,...v}),p&&d.jsx(G,{theme:u,color:a,focused:b,className:"lnc-input-suffix",children:p})]})});S.propTypes={id:t.PropTypes.string,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=S;
@@ -1,17 +1,17 @@
1
- import { jsxs as A, jsx as g } from "react/jsx-runtime";
1
+ import { jsxs as P, jsx as y } from "react/jsx-runtime";
2
2
  import { P as n } from "./index-S5Cd7WrG.js";
3
- import { forwardRef as P, useState as C, useEffect as W, useCallback as G } from "react";
4
- import { d as M } from "./index-CkWvbrVT.js";
3
+ import { forwardRef as W, useRef as G, useState as S, useEffect as M, useCallback as U } from "react";
4
+ import { d as D } from "./index-CkWvbrVT.js";
5
5
  import { s as i } from "./emotion-styled.browser.esm-BNN1dTl3.js";
6
- import { d, b as a, a as U, e as D, h as N, c as X } from "./utils-WHYrEnYF.js";
7
- import { u as q } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
8
- const H = i.div`
6
+ import { d as s, b as r, a as X, e as q, h as T, c as H } from "./utils-WHYrEnYF.js";
7
+ import { u as J } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
8
+ const K = i.div`
9
9
  display: flex;
10
10
  align-items: center;
11
11
 
12
- min-height: ${(e) => d(e.theme, e.size)};
13
- max-height: ${(e) => d(e.theme, e.size)};
14
- background-color: ${(e) => a(
12
+ min-height: ${(e) => s(e.theme, e.size)};
13
+ max-height: ${(e) => s(e.theme, e.size)};
14
+ background-color: ${(e) => r(
15
15
  e.theme,
16
16
  "Input",
17
17
  e.color,
@@ -19,27 +19,27 @@ const H = i.div`
19
19
  "background"
20
20
  )};
21
21
  border: 1px solid
22
- ${(e) => a(
22
+ ${(e) => r(
23
23
  e.theme,
24
24
  "Input",
25
25
  e.focused === !0 ? "primary" : e.color,
26
26
  e.disabled === !0 ? "disabled" : "enabled",
27
27
  "border"
28
28
  )};
29
- border-radius: ${(e) => U(e.theme, "regular")};
29
+ border-radius: ${(e) => X(e.theme, "regular")};
30
30
 
31
- ${(e) => e.focused && e.readOnly !== !0 ? D(e.theme) : ""}
32
- ${(e) => e.disabled === !0 ? N(e.theme) : ""}
33
- `, S = i.span`
31
+ ${(e) => e.focused && e.readOnly !== !0 ? q(e.theme) : ""}
32
+ ${(e) => e.disabled === !0 ? T(e.theme) : ""}
33
+ `, V = i.span`
34
34
  padding: 0 12px;
35
- color: ${(e) => a(
35
+ color: ${(e) => r(
36
36
  e.theme,
37
37
  "Input",
38
38
  e.focused === !0 ? "primary" : e.color,
39
39
  "enabled",
40
40
  "prefix"
41
41
  )};
42
- `, J = i(S)``, K = i.input`
42
+ `, L = i(V)``, Q = i.input`
43
43
  background: none;
44
44
  border: none;
45
45
  outline: none;
@@ -47,22 +47,22 @@ const H = i.div`
47
47
  padding-bottom: 0.625rem;
48
48
  width: 100%;
49
49
 
50
- ${(e) => X(e.theme, "Input", e.size, "enabled")}
51
- min-height: ${(e) => d(e.theme, e.size)};
52
- max-height: ${(e) => d(e.theme, e.size)};
53
- color: ${(e) => a(
50
+ ${(e) => H(e.theme, "Input", e.size, "enabled")}
51
+ min-height: ${(e) => s(e.theme, e.size)};
52
+ max-height: ${(e) => s(e.theme, e.size)};
53
+ color: ${(e) => r(
54
54
  e.theme,
55
55
  "Input",
56
56
  e.focused === !0 ? "primary" : e.color,
57
57
  "enabled",
58
58
  "text"
59
59
  )};
60
- caret-color: ${(e) => a(e.theme, "Input", e.color, "enabled", "caret")};
60
+ caret-color: ${(e) => r(e.theme, "Input", e.color, "enabled", "caret")};
61
61
  padding-right: ${(e) => e.suffix ? "0" : "0.75rem"};
62
62
  padding-left: ${(e) => e.prefix ? "0" : "0.75rem"};
63
63
 
64
64
  &::placeholder {
65
- color: ${(e) => a(
65
+ color: ${(e) => r(
66
66
  e.theme,
67
67
  "Input",
68
68
  e.color,
@@ -76,99 +76,99 @@ const H = i.div`
76
76
  }
77
77
 
78
78
  &:disabled {
79
- ${(e) => N(e.theme)}
79
+ ${(e) => T(e.theme)}
80
80
  background: none;
81
81
  }
82
- `, L = P((e, T) => {
82
+ `, Y = W((e, O) => {
83
83
  const {
84
- disabled: y,
85
- readOnly: p,
86
- debounceTime: O = 0,
87
- step: V = 1,
88
- min: z = Number.MIN_SAFE_INTEGER,
89
- max: v = Number.MAX_SAFE_INTEGER,
90
- prefix: s,
84
+ disabled: p,
85
+ readOnly: x,
86
+ debounceTime: z = 0,
87
+ step: v = 1,
88
+ min: E = Number.MIN_SAFE_INTEGER,
89
+ max: R = Number.MAX_SAFE_INTEGER,
90
+ prefix: c,
91
91
  suffix: m,
92
- placeholder: E,
93
- value: r,
94
- defaultValue: F,
92
+ placeholder: F,
93
+ value: a,
94
+ defaultValue: $,
95
95
  //----------------
96
96
  onChange: l,
97
- onBlur: c,
98
- onFocus: f,
97
+ onBlur: f,
98
+ onFocus: h,
99
99
  //----------------
100
100
  className: k = "",
101
- style: R = {},
102
- size: x = "small",
101
+ style: B = {},
102
+ size: I = "small",
103
103
  color: o = "primary",
104
- ...B
105
- } = e, u = q(), [_, $] = C(r || F || ""), [h, I] = C(!1);
106
- W(() => {
107
- r != null && $(r);
108
- }, [r]);
109
- const j = G(
110
- M((t, b) => w(t, b), O),
104
+ ..._
105
+ } = e, u = J(), d = G(a || $ || ""), [j, C] = S(a || $ || ""), [b, N] = S(!1);
106
+ M(() => {
107
+ a != null && (d.current = a, C(d.current));
108
+ }, [a]);
109
+ const w = U(
110
+ D((t, g) => A(t, g), z),
111
111
  [l]
112
- ), w = (t, b) => {
113
- l && (l == null || l(t, b));
112
+ ), A = (t, g) => {
113
+ l && (l == null || l(t, g));
114
114
  };
115
- return /* @__PURE__ */ A(
116
- H,
115
+ return /* @__PURE__ */ P(
116
+ K,
117
117
  {
118
- style: R,
118
+ style: B,
119
119
  className: k,
120
120
  theme: u,
121
121
  color: o,
122
- size: x,
123
- focused: h,
124
- disabled: y,
125
- readOnly: p,
122
+ size: I,
123
+ focused: b,
124
+ disabled: p,
125
+ readOnly: x,
126
126
  children: [
127
- s && /* @__PURE__ */ g(
128
- S,
127
+ c && /* @__PURE__ */ y(
128
+ V,
129
129
  {
130
130
  theme: u,
131
131
  color: o,
132
- focused: h,
132
+ focused: b,
133
133
  className: "lnc-input-prefix",
134
- children: s
134
+ children: c
135
135
  }
136
136
  ),
137
- /* @__PURE__ */ g(
138
- K,
137
+ /* @__PURE__ */ y(
138
+ Q,
139
139
  {
140
- ref: T,
140
+ ref: O,
141
141
  type: "number",
142
142
  theme: u,
143
143
  color: o,
144
- size: x,
145
- placeholder: E,
146
- prefix: s,
144
+ size: I,
145
+ placeholder: F,
146
+ prefix: c,
147
147
  suffix: m,
148
- disabled: y,
149
- readOnly: p,
150
- step: V,
151
- min: z,
152
- max: v,
153
- value: _,
148
+ disabled: p,
149
+ readOnly: x,
150
+ step: v,
151
+ min: E,
152
+ max: R,
153
+ value: j,
154
154
  onFocus: (t) => {
155
- I(!0), f == null || f(t);
155
+ N(!0), h == null || h(t);
156
156
  },
157
157
  onBlur: (t) => {
158
- I(!1), c == null || c(t);
158
+ N(!1), f == null || f(t);
159
159
  },
160
160
  onChange: (t) => {
161
- $(t.target.value), j(t, t.target.value);
161
+ d.current = t.target.value, C(d.current), w(t, t.target.value);
162
162
  },
163
- ...B
163
+ ..._
164
164
  }
165
165
  ),
166
- m && /* @__PURE__ */ g(
167
- J,
166
+ m && /* @__PURE__ */ y(
167
+ L,
168
168
  {
169
169
  theme: u,
170
170
  color: o,
171
- focused: h,
171
+ focused: b,
172
172
  className: "lnc-input-suffix",
173
173
  children: m
174
174
  }
@@ -177,7 +177,7 @@ const H = i.div`
177
177
  }
178
178
  );
179
179
  });
180
- L.propTypes = {
180
+ Y.propTypes = {
181
181
  id: n.string,
182
182
  value: n.any,
183
183
  defaultValue: n.any,
@@ -237,5 +237,5 @@ L.propTypes = {
237
237
  ])
238
238
  };
239
239
  export {
240
- L as default
240
+ Y as default
241
241
  };
@@ -1,20 +1,20 @@
1
- "use strict";const d=require("react/jsx-runtime"),t=require("./index-BPVoEhTF.cjs"),l=require("react"),_=require("./index-DaiUAQVF.cjs"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),n=require("./utils-BOtq2mcF.cjs"),B=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),D=c.styled.div`
1
+ "use strict";const c=require("react/jsx-runtime"),t=require("./index-BPVoEhTF.cjs"),s=require("react"),B=require("./index-DaiUAQVF.cjs"),p=require("./emotion-styled.browser.esm-BtEseadx.cjs"),r=require("./utils-BOtq2mcF.cjs"),D=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),E=p.styled.div`
2
2
  display: flex;
3
3
  align-items: center;
4
4
 
5
- min-height: ${e=>n.getSizeValueWithUnits(e.theme,e.size)};
6
- max-height: ${e=>n.getSizeValueWithUnits(e.theme,e.size)};
7
- background-color: ${e=>n.getColorRgbaValue(e.theme,"Input",e.color,"enabled","background")};
5
+ min-height: ${e=>r.getSizeValueWithUnits(e.theme,e.size)};
6
+ max-height: ${e=>r.getSizeValueWithUnits(e.theme,e.size)};
7
+ background-color: ${e=>r.getColorRgbaValue(e.theme,"Input",e.color,"enabled","background")};
8
8
  border: 1px solid
9
- ${e=>n.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,e.disabled===!0?"disabled":"enabled","border")};
10
- border-radius: ${e=>n.getBorderRadiusValueWithUnits(e.theme,"regular")};
9
+ ${e=>r.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,e.disabled===!0?"disabled":"enabled","border")};
10
+ border-radius: ${e=>r.getBorderRadiusValueWithUnits(e.theme,"regular")};
11
11
 
12
- ${e=>e.focused&&e.readOnly!==!0?n.getOutlineCss(e.theme):""}
13
- ${e=>e.disabled===!0?n.getDisabledStateCss(e.theme):""}
14
- `,$=c.styled.span`
12
+ ${e=>e.focused&&e.readOnly!==!0?r.getOutlineCss(e.theme):""}
13
+ ${e=>e.disabled===!0?r.getDisabledStateCss(e.theme):""}
14
+ `,C=p.styled.span`
15
15
  padding: 0 12px;
16
- color: ${e=>n.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,"enabled","prefix")};
17
- `,E=c.styled($)``,A=c.styled.input`
16
+ color: ${e=>r.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,"enabled","prefix")};
17
+ `,A=p.styled(C)``,G=p.styled.input`
18
18
  background: none;
19
19
  border: none;
20
20
  outline: none;
@@ -22,16 +22,16 @@
22
22
  padding-bottom: 0.625rem;
23
23
  width: 100%;
24
24
 
25
- ${e=>n.getComponentTypographyCss(e.theme,"Input",e.size,"enabled")}
26
- min-height: ${e=>n.getSizeValueWithUnits(e.theme,e.size)};
27
- max-height: ${e=>n.getSizeValueWithUnits(e.theme,e.size)};
28
- color: ${e=>n.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,"enabled","text")};
29
- caret-color: ${e=>n.getColorRgbaValue(e.theme,"Input",e.color,"enabled","caret")};
25
+ ${e=>r.getComponentTypographyCss(e.theme,"Input",e.size,"enabled")}
26
+ min-height: ${e=>r.getSizeValueWithUnits(e.theme,e.size)};
27
+ max-height: ${e=>r.getSizeValueWithUnits(e.theme,e.size)};
28
+ color: ${e=>r.getColorRgbaValue(e.theme,"Input",e.focused===!0?"primary":e.color,"enabled","text")};
29
+ caret-color: ${e=>r.getColorRgbaValue(e.theme,"Input",e.color,"enabled","caret")};
30
30
  padding-right: ${e=>e.suffix?"0":"0.75rem"};
31
31
  padding-left: ${e=>e.prefix?"0":"0.75rem"};
32
32
 
33
33
  &::placeholder {
34
- color: ${e=>n.getColorRgbaValue(e.theme,"Input",e.color,"enabled","placeholder")};
34
+ color: ${e=>r.getColorRgbaValue(e.theme,"Input",e.color,"enabled","placeholder")};
35
35
  }
36
36
 
37
37
  &:read-only {
@@ -39,7 +39,7 @@
39
39
  }
40
40
 
41
41
  &:disabled {
42
- ${e=>n.getDisabledStateCss(e.theme)}
42
+ ${e=>r.getDisabledStateCss(e.theme)}
43
43
  background: none;
44
44
  }
45
- `,C=l.forwardRef((e,V)=>{const{disabled:b,readOnly:f,defaultValue:S,value:o,debounceTime:I=0,type:z="text",placeholder:O,tabIndex:R,prefix:p,suffix:g,onChange:s,onBlur:m,onFocus:y,className:q="",style:v={},size:x="small",color:a="primary",...j}=e,i=B.useTheme(),[W,T]=l.useState(o||S||""),[u,P]=l.useState(!1);l.useEffect(()=>{o!=null&&T(o)},[o]);const k=l.useCallback(_.debounce((r,h)=>w(r,h),I),[s]),w=(r,h)=>{s&&(s==null||s(r,h))},U=r=>{T(r.target.value),k(r,r.target.value)},F=r=>{P(!0),y==null||y(r)},N=r=>{P(!1),m==null||m(r)};return d.jsxs(D,{style:v,className:q,theme:i,color:a,size:x,focused:u,disabled:b,readOnly:f,children:[p&&d.jsx($,{theme:i,color:a,focused:u,className:"lnc-input-prefix",children:p}),d.jsx(A,{ref:V,type:z,theme:i,color:a,size:x,placeholder:O,prefix:p,suffix:g,disabled:b,readOnly:f,focused:u,onFocus:F,onBlur:N,onChange:U,tabIndex:R,value:W,...j}),g&&d.jsx(E,{theme:i,color:a,focused:u,className:"lnc-input-suffix",children:g})]})});C.propTypes={id:t.PropTypes.string,defaultValue:t.PropTypes.string,value:t.PropTypes.string,disabled:t.PropTypes.bool,readOnly:t.PropTypes.bool,debounceTime:t.PropTypes.number,placeholder:t.PropTypes.string,type:t.PropTypes.oneOf(["text","email"]),tabIndex:t.PropTypes.number,prefix:t.PropTypes.oneOfType([t.PropTypes.string,t.PropTypes.element]),suffix:t.PropTypes.oneOfType([t.PropTypes.string,t.PropTypes.element]),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=C;
45
+ `,S=s.forwardRef((e,I)=>{const{disabled:b,readOnly:x,defaultValue:T,value:o,debounceTime:R=0,type:z="text",placeholder:O,tabIndex:q,prefix:g,suffix:m,onChange:l,onBlur:y,onFocus:h,className:v="",style:j={},size:P="small",color:a="primary",...W}=e,i=D.useTheme(),u=s.useRef(o||T||""),[k,$]=s.useState(o||T||""),[d,V]=s.useState(!1);s.useEffect(()=>{o!=null&&(u.current=o,$(u.current))},[o]);const w=s.useCallback(B.debounce((n,f)=>U(n,f),R),[l]),U=(n,f)=>{l&&(l==null||l(n,f))},F=n=>{u.current=n.target.value,$(u.current),w(n,n.target.value)},N=n=>{V(!0),h==null||h(n)},_=n=>{V(!1),y==null||y(n)};return c.jsxs(E,{style:j,className:v,theme:i,color:a,size:P,focused:d,disabled:b,readOnly:x,children:[g&&c.jsx(C,{theme:i,color:a,focused:d,className:"lnc-input-prefix",children:g}),c.jsx(G,{ref:I,type:z,theme:i,color:a,size:P,placeholder:O,prefix:g,suffix:m,disabled:b,readOnly:x,focused:d,onFocus:N,onBlur:_,onChange:F,tabIndex:q,value:k,...W}),m&&c.jsx(A,{theme:i,color:a,focused:d,className:"lnc-input-suffix",children:m})]})});S.propTypes={id:t.PropTypes.string,defaultValue:t.PropTypes.string,value:t.PropTypes.string,disabled:t.PropTypes.bool,readOnly:t.PropTypes.bool,debounceTime:t.PropTypes.number,placeholder:t.PropTypes.string,type:t.PropTypes.oneOf(["text","email"]),tabIndex:t.PropTypes.number,prefix:t.PropTypes.oneOfType([t.PropTypes.string,t.PropTypes.element]),suffix:t.PropTypes.oneOfType([t.PropTypes.string,t.PropTypes.element]),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=S;
package/dist/TextInput.js CHANGED
@@ -1,17 +1,17 @@
1
- import { jsxs as W, jsx as b } from "react/jsx-runtime";
1
+ import { jsxs as U, jsx as y } from "react/jsx-runtime";
2
2
  import { P as t } from "./index-S5Cd7WrG.js";
3
- import { forwardRef as U, useState as C, useEffect as D, useCallback as E } from "react";
4
- import { d as q } from "./index-CkWvbrVT.js";
5
- import { s as u } from "./emotion-styled.browser.esm-BNN1dTl3.js";
6
- import { d as s, b as a, a as A, e as G, h as O, c as H } from "./utils-WHYrEnYF.js";
7
- import { u as J } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
8
- const K = u.div`
3
+ import { forwardRef as D, useRef as E, useState as V, useEffect as q, useCallback as A } from "react";
4
+ import { d as G } from "./index-CkWvbrVT.js";
5
+ import { s as c } from "./emotion-styled.browser.esm-BNN1dTl3.js";
6
+ import { d as s, b as r, a as H, e as J, h as T, c as K } from "./utils-WHYrEnYF.js";
7
+ import { u as L } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
8
+ const M = c.div`
9
9
  display: flex;
10
10
  align-items: center;
11
11
 
12
12
  min-height: ${(e) => s(e.theme, e.size)};
13
13
  max-height: ${(e) => s(e.theme, e.size)};
14
- background-color: ${(e) => a(
14
+ background-color: ${(e) => r(
15
15
  e.theme,
16
16
  "Input",
17
17
  e.color,
@@ -19,27 +19,27 @@ const K = u.div`
19
19
  "background"
20
20
  )};
21
21
  border: 1px solid
22
- ${(e) => a(
22
+ ${(e) => r(
23
23
  e.theme,
24
24
  "Input",
25
25
  e.focused === !0 ? "primary" : e.color,
26
26
  e.disabled === !0 ? "disabled" : "enabled",
27
27
  "border"
28
28
  )};
29
- border-radius: ${(e) => A(e.theme, "regular")};
29
+ border-radius: ${(e) => H(e.theme, "regular")};
30
30
 
31
- ${(e) => e.focused && e.readOnly !== !0 ? G(e.theme) : ""}
32
- ${(e) => e.disabled === !0 ? O(e.theme) : ""}
33
- `, T = u.span`
31
+ ${(e) => e.focused && e.readOnly !== !0 ? J(e.theme) : ""}
32
+ ${(e) => e.disabled === !0 ? T(e.theme) : ""}
33
+ `, z = c.span`
34
34
  padding: 0 12px;
35
- color: ${(e) => a(
35
+ color: ${(e) => r(
36
36
  e.theme,
37
37
  "Input",
38
38
  e.focused === !0 ? "primary" : e.color,
39
39
  "enabled",
40
40
  "prefix"
41
41
  )};
42
- `, L = u(T)``, M = u.input`
42
+ `, Q = c(z)``, X = c.input`
43
43
  background: none;
44
44
  border: none;
45
45
  outline: none;
@@ -47,22 +47,22 @@ const K = u.div`
47
47
  padding-bottom: 0.625rem;
48
48
  width: 100%;
49
49
 
50
- ${(e) => H(e.theme, "Input", e.size, "enabled")}
50
+ ${(e) => K(e.theme, "Input", e.size, "enabled")}
51
51
  min-height: ${(e) => s(e.theme, e.size)};
52
52
  max-height: ${(e) => s(e.theme, e.size)};
53
- color: ${(e) => a(
53
+ color: ${(e) => r(
54
54
  e.theme,
55
55
  "Input",
56
56
  e.focused === !0 ? "primary" : e.color,
57
57
  "enabled",
58
58
  "text"
59
59
  )};
60
- caret-color: ${(e) => a(e.theme, "Input", e.color, "enabled", "caret")};
60
+ caret-color: ${(e) => r(e.theme, "Input", e.color, "enabled", "caret")};
61
61
  padding-right: ${(e) => e.suffix ? "0" : "0.75rem"};
62
62
  padding-left: ${(e) => e.prefix ? "0" : "0.75rem"};
63
63
 
64
64
  &::placeholder {
65
- color: ${(e) => a(
65
+ color: ${(e) => r(
66
66
  e.theme,
67
67
  "Input",
68
68
  e.color,
@@ -76,106 +76,106 @@ const K = u.div`
76
76
  }
77
77
 
78
78
  &:disabled {
79
- ${(e) => O(e.theme)}
79
+ ${(e) => T(e.theme)}
80
80
  background: none;
81
81
  }
82
- `, Q = U((e, V) => {
82
+ `, Y = D((e, S) => {
83
83
  const {
84
- disabled: y,
84
+ disabled: p,
85
85
  readOnly: x,
86
- defaultValue: z,
87
- value: l,
88
- debounceTime: S = 0,
89
- type: v = "text",
90
- placeholder: k,
86
+ defaultValue: $,
87
+ value: a,
88
+ debounceTime: v = 0,
89
+ type: k = "text",
90
+ placeholder: R,
91
91
  tabIndex: B,
92
- prefix: c,
93
- suffix: m,
92
+ prefix: m,
93
+ suffix: f,
94
94
  //----------------
95
- onChange: r,
96
- onBlur: f,
97
- onFocus: h,
95
+ onChange: l,
96
+ onBlur: h,
97
+ onFocus: g,
98
98
  //----------------
99
99
  className: F = "",
100
100
  style: N = {},
101
- size: p = "small",
101
+ size: I = "small",
102
102
  color: o = "primary",
103
103
  ...j
104
- } = e, d = J(), [w, $] = C(l || z || ""), [i, I] = C(!1);
105
- D(() => {
106
- l != null && $(l);
107
- }, [l]);
108
- const P = E(
109
- q((n, g) => R(n, g), S),
110
- [r]
111
- ), R = (n, g) => {
112
- r && (r == null || r(n, g));
104
+ } = e, u = L(), d = E(a || $ || ""), [w, C] = V(a || $ || ""), [i, O] = V(!1);
105
+ q(() => {
106
+ a != null && (d.current = a, C(d.current));
107
+ }, [a]);
108
+ const P = A(
109
+ G((n, b) => W(n, b), v),
110
+ [l]
111
+ ), W = (n, b) => {
112
+ l && (l == null || l(n, b));
113
113
  };
114
- return /* @__PURE__ */ W(
115
- K,
114
+ return /* @__PURE__ */ U(
115
+ M,
116
116
  {
117
117
  style: N,
118
118
  className: F,
119
- theme: d,
119
+ theme: u,
120
120
  color: o,
121
- size: p,
121
+ size: I,
122
122
  focused: i,
123
- disabled: y,
123
+ disabled: p,
124
124
  readOnly: x,
125
125
  children: [
126
- c && /* @__PURE__ */ b(
127
- T,
126
+ m && /* @__PURE__ */ y(
127
+ z,
128
128
  {
129
- theme: d,
129
+ theme: u,
130
130
  color: o,
131
131
  focused: i,
132
132
  className: "lnc-input-prefix",
133
- children: c
133
+ children: m
134
134
  }
135
135
  ),
136
- /* @__PURE__ */ b(
137
- M,
136
+ /* @__PURE__ */ y(
137
+ X,
138
138
  {
139
- ref: V,
140
- type: v,
141
- theme: d,
139
+ ref: S,
140
+ type: k,
141
+ theme: u,
142
142
  color: o,
143
- size: p,
144
- placeholder: k,
145
- prefix: c,
146
- suffix: m,
147
- disabled: y,
143
+ size: I,
144
+ placeholder: R,
145
+ prefix: m,
146
+ suffix: f,
147
+ disabled: p,
148
148
  readOnly: x,
149
149
  focused: i,
150
150
  onFocus: (n) => {
151
- I(!0), h == null || h(n);
151
+ O(!0), g == null || g(n);
152
152
  },
153
153
  onBlur: (n) => {
154
- I(!1), f == null || f(n);
154
+ O(!1), h == null || h(n);
155
155
  },
156
156
  onChange: (n) => {
157
- $(n.target.value), P(n, n.target.value);
157
+ d.current = n.target.value, C(d.current), P(n, n.target.value);
158
158
  },
159
159
  tabIndex: B,
160
160
  value: w,
161
161
  ...j
162
162
  }
163
163
  ),
164
- m && /* @__PURE__ */ b(
165
- L,
164
+ f && /* @__PURE__ */ y(
165
+ Q,
166
166
  {
167
- theme: d,
167
+ theme: u,
168
168
  color: o,
169
169
  focused: i,
170
170
  className: "lnc-input-suffix",
171
- children: m
171
+ children: f
172
172
  }
173
173
  )
174
174
  ]
175
175
  }
176
176
  );
177
177
  });
178
- Q.propTypes = {
178
+ Y.propTypes = {
179
179
  id: t.string,
180
180
  defaultValue: t.string,
181
181
  value: t.string,
@@ -223,5 +223,5 @@ Q.propTypes = {
223
223
  ])
224
224
  };
225
225
  export {
226
- Q as default
226
+ Y as default
227
227
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lanaco/lnc-react-ui",
3
- "version": "4.0.94",
3
+ "version": "4.0.95",
4
4
  "description": "React component library",
5
5
  "type": "module",
6
6
  "keywords": [