@ankjs/react-ui 1.0.21 → 1.0.23
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.
- package/dist/components/input/Input.d.ts +1 -1
- package/dist/constants/colors.d.ts +16 -0
- package/dist/index.cjs +23 -16
- package/dist/index.cjs.map +1 -1
- package/dist/index.esm.js +24 -17
- package/dist/index.esm.js.map +1 -1
- package/dist/types/inputTypes.d.ts +6 -0
- package/package.json +1 -1
- package/src/components/button/Button.tsx +6 -9
- package/src/components/input/Input.tsx +131 -0
- package/src/constants/colors.ts +18 -3
- package/dist/components/button/index.d.ts +0 -1
- package/dist/components/input/index.d.ts +0 -1
- /package/src/types/{InputTypes.ts → inputTypes.ts} +0 -0
|
@@ -11,6 +11,10 @@ export declare const light: {
|
|
|
11
11
|
buttonColorActive: string;
|
|
12
12
|
buttonBgDeactivate: string;
|
|
13
13
|
buttonColorDeactivate: string;
|
|
14
|
+
inputColorActive: string;
|
|
15
|
+
inputColorDeactivate: string;
|
|
16
|
+
inputBgActive: string;
|
|
17
|
+
inputBgDeactivate: string;
|
|
14
18
|
};
|
|
15
19
|
export declare const dark: {
|
|
16
20
|
primary: string;
|
|
@@ -25,6 +29,10 @@ export declare const dark: {
|
|
|
25
29
|
buttonColorActive: string;
|
|
26
30
|
buttonBgDeactivate: string;
|
|
27
31
|
buttonColorDeactivate: string;
|
|
32
|
+
inputBgActive: string;
|
|
33
|
+
inputColorActive: string;
|
|
34
|
+
inputBgDeactivate: string;
|
|
35
|
+
inputColorDeactivate: string;
|
|
28
36
|
};
|
|
29
37
|
declare const colors: {
|
|
30
38
|
light: {
|
|
@@ -40,6 +48,10 @@ declare const colors: {
|
|
|
40
48
|
buttonColorActive: string;
|
|
41
49
|
buttonBgDeactivate: string;
|
|
42
50
|
buttonColorDeactivate: string;
|
|
51
|
+
inputColorActive: string;
|
|
52
|
+
inputColorDeactivate: string;
|
|
53
|
+
inputBgActive: string;
|
|
54
|
+
inputBgDeactivate: string;
|
|
43
55
|
};
|
|
44
56
|
dark: {
|
|
45
57
|
primary: string;
|
|
@@ -54,6 +66,10 @@ declare const colors: {
|
|
|
54
66
|
buttonColorActive: string;
|
|
55
67
|
buttonBgDeactivate: string;
|
|
56
68
|
buttonColorDeactivate: string;
|
|
69
|
+
inputBgActive: string;
|
|
70
|
+
inputColorActive: string;
|
|
71
|
+
inputBgDeactivate: string;
|
|
72
|
+
inputColorDeactivate: string;
|
|
57
73
|
};
|
|
58
74
|
};
|
|
59
75
|
export default colors;
|
package/dist/index.cjs
CHANGED
|
@@ -40,7 +40,11 @@ const light = {
|
|
|
40
40
|
buttonBgActive: "red",
|
|
41
41
|
buttonColorActive: "#fdfdfd3b",
|
|
42
42
|
buttonBgDeactivate: "#8404043b",
|
|
43
|
-
buttonColorDeactivate: "#5d13133b"
|
|
43
|
+
buttonColorDeactivate: "#5d13133b",
|
|
44
|
+
inputColorActive: "#000",
|
|
45
|
+
inputColorDeactivate: "#5d13133b",
|
|
46
|
+
inputBgActive: "pink",
|
|
47
|
+
inputBgDeactivate: "#8404043b",
|
|
44
48
|
};
|
|
45
49
|
const dark = {
|
|
46
50
|
primary: 'red',
|
|
@@ -54,7 +58,11 @@ const dark = {
|
|
|
54
58
|
buttonBgActive: "red",
|
|
55
59
|
buttonColorActive: "#fdfdfd3b",
|
|
56
60
|
buttonBgDeactivate: "#8404043b",
|
|
57
|
-
buttonColorDeactivate: "#5d13133b"
|
|
61
|
+
buttonColorDeactivate: "#5d13133b",
|
|
62
|
+
inputBgActive: "red",
|
|
63
|
+
inputColorActive: "#fdfdfd3b",
|
|
64
|
+
inputBgDeactivate: "#8404043b",
|
|
65
|
+
inputColorDeactivate: "#5d13133b"
|
|
58
66
|
};
|
|
59
67
|
|
|
60
68
|
const defaultColorsObject = {
|
|
@@ -175,11 +183,10 @@ const AnkThemeProvider = (props) => {
|
|
|
175
183
|
const Button = (props) => {
|
|
176
184
|
const { children, name = "", label = "", onClick = () => { }, onSubmit = () => { }, disabled = false, style = {} } = props;
|
|
177
185
|
const btnName = name ? name : label;
|
|
178
|
-
const { width = "100%", height = "
|
|
186
|
+
const { width = "100%", height = "30px", borderWidth = "1px", cursor = "pointer", borderColor = "", outline = "none", borderStyle = "solid", color = "", fontSize = 14, fontWeight = 'bold', borderRadius = 5, backgroundColor = "", } = style;
|
|
179
187
|
const { buttonBgActive, buttonBgDeactivate, buttonColorActive, buttonColorDeactivate } = useThemeColors();
|
|
180
|
-
|
|
188
|
+
useThemeColors();
|
|
181
189
|
const defColor = disabled ? buttonColorDeactivate : buttonColorActive;
|
|
182
|
-
const defBrColor = disabled ? buttonColorDeactivate : buttonColorActive;
|
|
183
190
|
const defBgColot = disabled ? buttonBgDeactivate : buttonBgActive;
|
|
184
191
|
const styleContener = {
|
|
185
192
|
width,
|
|
@@ -191,20 +198,20 @@ const Button = (props) => {
|
|
|
191
198
|
fontWeight,
|
|
192
199
|
borderRadius,
|
|
193
200
|
cursor: disabled ? "none" : cursor,
|
|
201
|
+
borderColor: borderColor ? borderColor : defBgColot,
|
|
194
202
|
color: color ? color : defColor,
|
|
195
|
-
|
|
196
|
-
backgroundColpr: backgroundColor ? backgroundColor : defBgColot,
|
|
203
|
+
backgroundColor: backgroundColor ? backgroundColor : defBgColot,
|
|
197
204
|
...style
|
|
198
205
|
};
|
|
199
|
-
return (jsxRuntime.
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
206
|
+
return (jsxRuntime.jsx("button", { style: styleContener, onClick: () => {
|
|
207
|
+
if (disabled)
|
|
208
|
+
return;
|
|
209
|
+
onClick();
|
|
210
|
+
}, onSubmit: () => {
|
|
211
|
+
if (disabled)
|
|
212
|
+
return;
|
|
213
|
+
onSubmit();
|
|
214
|
+
}, disabled: disabled, children: btnName ? btnName : children }));
|
|
208
215
|
};
|
|
209
216
|
|
|
210
217
|
exports.Button = Button;
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../src/contexts/AnkThemeContext.ts","../src/hook/useSystemTheme.ts","../src/constants/colors.ts","../src/hook/useThemeColors.ts","../src/providers/MainUiView.tsx","../src/providers/AnkThemeProvider.tsx","../src/components/button/Button.tsx"],"sourcesContent":[null,null,null,null,null,null,null],"names":["createContext","useState","useEffect","defaultLight","defaultDark","useContext","light","dark","_jsx","useCallback","useMemo"
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../src/contexts/AnkThemeContext.ts","../src/hook/useSystemTheme.ts","../src/constants/colors.ts","../src/hook/useThemeColors.ts","../src/providers/MainUiView.tsx","../src/providers/AnkThemeProvider.tsx","../src/components/button/Button.tsx"],"sourcesContent":[null,null,null,null,null,null,null],"names":["createContext","useState","useEffect","defaultLight","defaultDark","useContext","light","dark","_jsx","useCallback","useMemo"],"mappings":";;;;;;;AAAA;;AAEG;AASI,MAAM,eAAe,GAAGA,mBAAa,CAA+B,SAAS,CAAC;AAG9E,MAAM,YAAY,GAAGA,mBAAa,CAA2B,SAAS,CAAC;;ACR9E,MAAM,cAAc,GAAG,MAAK;IAE1B,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC;AAC9D,UAAE;UACA,OAAO;IAEX,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAGC,cAAQ,CACtC,KAAK,CACN;IAEDC,eAAS,CAAC,MAAK;QACb,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC;QAC/D,MAAM,YAAY,GAAG,MAAK;AACxB,YAAA,WAAW,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;AAC/C,QAAA,CAAC;AACD,QAAA,YAAY,EAAE;AACd,QAAA,KAAK,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC;QAC9C,OAAO,MAAM,KAAK,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC;AAChE,IAAA,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC;AAExB,IAAA,OAAO,QAAQ;AACjB,CAAC;;ACxBM,MAAM,KAAK,GAAG;AACnB,IAAA,OAAO,EAAE,KAAK;AACd,IAAA,WAAW,EAAE,WAAW;AACxB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,MAAM,EAAE,SAAS;AACjB,IAAA,WAAW,EAAE,MAAM;AACnB,IAAA,eAAe,EAAE,SAAS;AAC1B,IAAA,eAAe,EAAE,SAAS;AAC1B,IAAA,KAAK,EAAE,MAAM;AAGb,IAAA,cAAc,EAAE,KAAK;AACrB,IAAA,iBAAiB,EAAE,WAAW;AAC9B,IAAA,kBAAkB,EAAE,WAAW;AAC/B,IAAA,qBAAqB,EAAE,WAAW;AAGlC,IAAA,gBAAgB,EAAE,MAAM;AACxB,IAAA,oBAAoB,EAAE,WAAW;AACjC,IAAA,aAAa,EAAE,MAAM;AACrB,IAAA,iBAAiB,EAAE,WAAW;CAE/B;AAEM,MAAM,IAAI,GAAG;AAClB,IAAA,OAAO,EAAE,KAAK;AACd,IAAA,WAAW,EAAE,WAAW;AACxB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,WAAW,EAAE,MAAM;AACnB,IAAA,MAAM,EAAE,MAAM;AACd,IAAA,eAAe,EAAE,MAAM;AACvB,IAAA,eAAe,EAAE,QAAQ;AACzB,IAAA,KAAK,EAAE,MAAM;AAEb,IAAA,cAAc,EAAE,KAAK;AACrB,IAAA,iBAAiB,EAAE,WAAW;AAC9B,IAAA,kBAAkB,EAAE,WAAW;AAC/B,IAAA,qBAAqB,EAAE,WAAW;AAElC,IAAA,aAAa,EAAE,KAAK;AACpB,IAAA,gBAAgB,EAAE,WAAW;AAC7B,IAAA,iBAAiB,EAAE,WAAW;AAC9B,IAAA,oBAAoB,EAAE;CACvB;;ACvCD,MAAM,mBAAmB,GAAG;AAC1B,IAAA,KAAK,EAAEC,KAAY;AACnB,IAAA,IAAI,EAAEC,IAAW;CAClB;AAID,MAAM,cAAc,GAAG,CAAC,KAAa,KAAI;AACvC,IAAA,MAAM,OAAO,GAAGC,gBAAU,CAAC,eAAe,CAAC;IAG3C,IAAI,CAAC,OAAO,EAAE;QACZ,MAAM,IAAI,KAAK,CAAC,CAAA;;;;;AAKf,IAAA,CAAA,CAAC;IACJ;AAGA,IAAA,MAAM,SAAEC,OAAK,QAAEC,MAAI,EAAE,GAAGF,gBAAU,CAAC,YAAY,CAAC,IAAI,mBAAmB;AAEvE,IAAA,MAAM,OAAO,GAAGC,OAAK,IAAIH,KAAY;AACrC,IAAA,MAAM,MAAM,GAAGI,MAAI,IAAIH,IAAW;AAElC,IAAA,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,IAAI,SAAS;AACxC,IAAA,MAAM,SAAS,GAAG,OAAO,CAAC,SAAS,IAAI,SAAS;IAKhD,IAAI,KAAK,KAAK,SAAS,IAAI,SAAS,KAAK,SAAS,EAAE;QAClD,MAAM,IAAI,KAAK,CAAC,CAAA;;;;;AAKf,IAAA,CAAA,CAAC;IACJ;AAAO,SAAA,IAAI,OAAO,CAAC,KAAK,KAAK,OAAO,EAAE;QACpC,OAAO;AACL,YAAA,GAAG,OAAO;YACV,SAAS;SACV;IACH;AAAO,SAAA,IAAI,OAAO,CAAC,KAAK,KAAK,MAAM,EAAE;QACnC,OAAO;AACL,YAAA,GAAG,MAAM;YACT,SAAS;SACV;IACH;IAEA,OAAO;AACL,QAAA,GAAG,OAAO;AACV,QAAA,SAAS,EAAE;KACZ;AAEH;;ACvDA,MAAM,UAAU,GAAG,CAAC,KAAoB,KAAI;AAC1C,IAAA,MAAM,EACJ,QAAQ,EACR,SAAS,EACT,KAAK,EACL,QAAQ,EACR,eAAe,EACf,QAAQ,EACT,GAAG,KAAK;AAET,IAAe,cAAc;IAC7B,MAAM,EACJ,WAAW,EAAE,KAAK,EACnB,GAAG,cAAc,EAAE;IAEpB,MAAM,EAAE,GAAG,SAAS,GAAG,WAAW,GAAG,eAAe;IACpD,MAAM,IAAI,GAAG,SAAS,GAAG,KAAK,GAAE,QAAQ;AAExC,IAAA,MAAM,aAAa,GAAG;AACpB,QAAA,eAAe,EAAE,EAAE;AACnB,QAAA,KAAK,EAAE,IAAI;AACX,QAAA,MAAM,EAAE,QAAQ;AAChB,QAAA,KAAK,EAAE,MAAM;QACb,QAAQ;AACR,QAAA,GAAG;KACJ;IAGD,QACEI,wBACE,KAAK,EAAE,aAAa,EAAA,QAAA,EAEnB,QAAQ,EAAA,CACL;AAEV,CAAC;;ACtBD,MAAM,gBAAgB,GAAG,CAAC,KAAyB,KAAI;;AAErD,IAAA,MAAM,EACJ,QAAQ,EACR,mBAAmB,GAAG,EAAE,EACxB,YAAY,GAAG,EAAE,EACjB,gBAAgB,GAAG,QAAQ,EAC3B,SAAS,GAAG,IAAI,EAChB,KAAK,GAAG,EAAE,EACV,QAAQ,GAAG,QAAQ,EACnB,eAAe,GAAG,MAAM,EACxB,KAAK,GAAG,OAAO,EAChB,GAAG,KAAK;;;AAKT,IAAA,MAAM,MAAM,GAAG,cAAc,EAAE;;AAG/B,IAAA,MAAM,kBAAkB,GAAG,gBAAgB,KAAK,QAAQ,GAAG,MAAM,GAAG,gBAAgB;;IAIpF,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAGP,cAAQ,CAAmB,kBAAkB,CAAC;;IAGxE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAGA,cAAQ,CAA8B,gBAAgB,CAAC;IAIzFC,eAAS,CAAC,MAAK;AACb,QAAA,IAAI,gBAAgB,KAAK,QAAQ,EAAE;YACjC,QAAQ,CAAC,kBAAkB,CAAC;AAC5B,YAAA,OAAO,YAAY,CAAC,QAAQ,CAAC;QAC/B;IACF,CAAC,EAAE,CAAC,gBAAgB,EAAE,kBAAkB,EAAE,QAAQ,EAAE,YAAY,CAAC,CAAC;AAIlE,IAAA,MAAM,YAAY,GAAGO,iBAAW,CAAC,MAAK;QACpC,IAAI,KAAK,KAAK,MAAM;YAAE;QACtB,YAAY,CAAC,MAAM,CAAC;AACpB,QAAA,OAAO,QAAQ,CAAC,MAAM,CAAC;IACzB,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,QAAQ,CAAC,CAAC;AAEnC,IAAA,MAAM,aAAa,GAAGA,iBAAW,CAAC,MAAK;QACrC,IAAI,KAAK,KAAK,OAAO;YAAE;QACvB,YAAY,CAAC,OAAO,CAAC;AACrB,QAAA,OAAO,QAAQ,CAAC,OAAO,CAAC;IAC1B,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,QAAQ,CAAC,CAAC;AAEnC,IAAA,MAAM,cAAc,GAAGA,iBAAW,CAAC,MAAK;QACtC,IAAI,SAAS,KAAK,QAAQ;YAAE;QAC5B,YAAY,CAAC,QAAQ,CAAC;AACtB,QAAA,OAAO,QAAQ,CAAC,MAAM,CAAC;IACzB,CAAC,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,YAAY,CAAC,CAAC;;AAK/C,IAAA,MAAM,YAAY,GAAGC,aAAO,CAC1B,OAAO;QACL,KAAK;QACL,SAAS;QACT,QAAQ;QACR,YAAY;QACZ,aAAa;QACb,cAAc;AACf,KAAA,CAAC,EACF,CAAC,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,YAAY,EAAE,aAAa,EAAE,cAAc,CAAC,CAC1E;;AAKD,IAAA,MAAM,QAAQ,GAAGA,aAAO,CAAC,OAAO;AAC9B,QAAA,GAAG,YAAY;AACf,QAAA,GAAG,mBAAmB;AACvB,KAAA,CAAC,EAAE,CAAC,YAAY,EAAE,mBAAmB,CAAC,CAAC;IAIxC,QACEF,eAAC,eAAe,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,YAAY,EAAA,QAAA,EAC3CA,eAAC,YAAY,CAAC,QAAQ,EAAA,EACpB,KAAK,EAAE,QAAQ,EAAA,QAAA,EAEfA,cAAA,CAAC,UAAU,EAAA,EACT,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,KAAK,EAAA,QAAA,EAEd,QAAQ,EAAA,CACE,EAAA,CACS,EAAA,CACC;AAE/B;;ACpHA,MAAM,MAAM,GAAG,CAAC,KAAkB,KAAI;AAEpC,IAAA,MAAM,EACJ,QAAQ,EACR,IAAI,GAAG,EAAE,EACT,KAAK,GAAG,EAAE,EACV,OAAO,GAAG,MAAK,EAAG,CAAC,EACnB,QAAQ,GAAG,MAAK,EAAG,CAAC,EACpB,QAAQ,GAAG,KAAK,EAChB,KAAK,GAAG,EAAE,EACX,GAAG,KAAK;IACT,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK;IAEnC,MAAM,EACJ,KAAK,GAAG,MAAM,EACd,MAAM,GAAG,MAAM,EACf,WAAW,GAAG,KAAK,EACnB,MAAM,GAAG,SAAS,EAClB,WAAW,GAAG,EAAE,EAChB,OAAO,GAAG,MAAM,EAChB,WAAW,GAAG,OAAO,EACrB,KAAK,GAAG,EAAE,EACV,QAAQ,GAAG,EAAE,EACb,UAAU,GAAG,MAAM,EACnB,YAAY,GAAG,CAAC,EAChB,eAAe,GAAG,EAAE,GACrB,GAAG,KAAK;AAKT,IAAA,MAAM,EACJ,cAAc,EACd,kBAAkB,EAClB,iBAAiB,EACjB,qBAAqB,EACtB,GAAG,cAAc,EAAE;AAEpB,IAAiB,cAAc;IAE/B,MAAM,QAAQ,GAAG,QAAQ,GAAG,qBAAqB,GAAG,iBAAiB;IAErE,MAAM,UAAU,GAAG,QAAQ,GAAG,kBAAkB,GAAG,cAAc;AAEjE,IAAA,MAAM,aAAa,GAAG;QACpB,KAAK;QACL,MAAM;QACN,WAAW;QACX,WAAW;QACX,OAAO;QACP,QAAQ;QACR,UAAU;QACV,YAAY;QACZ,MAAM,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM;QAClC,WAAW,EAAE,WAAW,GAAG,WAAW,GAAG,UAAU;QACnD,KAAK,EAAE,KAAK,GAAG,KAAK,GAAG,QAAQ;QAC/B,eAAe,EAAE,eAAe,GAAG,eAAe,GAAG,UAAU;AAC/D,QAAA,GAAG;KACJ;IAID,QACEA,2BACE,KAAK,EAAE,aAAa,EACpB,OAAO,EAAE,MAAK;AACZ,YAAA,IAAI,QAAQ;gBAAE;AACd,YAAA,OAAO,EAAE;AACX,QAAA,CAAC,EACD,QAAQ,EAAE,MAAK;AACb,YAAA,IAAI,QAAQ;gBAAE;AACd,YAAA,QAAQ,EAAE;AACZ,QAAA,CAAC,EACD,QAAQ,EAAE,QAAQ,EAAA,QAAA,EAEjB,OAAO,GAAG,OAAO,GAAG,QAAQ,EAAA,CACrB;AAGd;;;;;;"}
|
package/dist/index.esm.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { createContext, useState, useEffect, useContext, useCallback, useMemo } from 'react';
|
|
3
3
|
|
|
4
4
|
/**
|
|
@@ -36,7 +36,11 @@ const light = {
|
|
|
36
36
|
buttonBgActive: "red",
|
|
37
37
|
buttonColorActive: "#fdfdfd3b",
|
|
38
38
|
buttonBgDeactivate: "#8404043b",
|
|
39
|
-
buttonColorDeactivate: "#5d13133b"
|
|
39
|
+
buttonColorDeactivate: "#5d13133b",
|
|
40
|
+
inputColorActive: "#000",
|
|
41
|
+
inputColorDeactivate: "#5d13133b",
|
|
42
|
+
inputBgActive: "pink",
|
|
43
|
+
inputBgDeactivate: "#8404043b",
|
|
40
44
|
};
|
|
41
45
|
const dark = {
|
|
42
46
|
primary: 'red',
|
|
@@ -50,7 +54,11 @@ const dark = {
|
|
|
50
54
|
buttonBgActive: "red",
|
|
51
55
|
buttonColorActive: "#fdfdfd3b",
|
|
52
56
|
buttonBgDeactivate: "#8404043b",
|
|
53
|
-
buttonColorDeactivate: "#5d13133b"
|
|
57
|
+
buttonColorDeactivate: "#5d13133b",
|
|
58
|
+
inputBgActive: "red",
|
|
59
|
+
inputColorActive: "#fdfdfd3b",
|
|
60
|
+
inputBgDeactivate: "#8404043b",
|
|
61
|
+
inputColorDeactivate: "#5d13133b"
|
|
54
62
|
};
|
|
55
63
|
|
|
56
64
|
const defaultColorsObject = {
|
|
@@ -171,11 +179,10 @@ const AnkThemeProvider = (props) => {
|
|
|
171
179
|
const Button = (props) => {
|
|
172
180
|
const { children, name = "", label = "", onClick = () => { }, onSubmit = () => { }, disabled = false, style = {} } = props;
|
|
173
181
|
const btnName = name ? name : label;
|
|
174
|
-
const { width = "100%", height = "
|
|
182
|
+
const { width = "100%", height = "30px", borderWidth = "1px", cursor = "pointer", borderColor = "", outline = "none", borderStyle = "solid", color = "", fontSize = 14, fontWeight = 'bold', borderRadius = 5, backgroundColor = "", } = style;
|
|
175
183
|
const { buttonBgActive, buttonBgDeactivate, buttonColorActive, buttonColorDeactivate } = useThemeColors();
|
|
176
|
-
|
|
184
|
+
useThemeColors();
|
|
177
185
|
const defColor = disabled ? buttonColorDeactivate : buttonColorActive;
|
|
178
|
-
const defBrColor = disabled ? buttonColorDeactivate : buttonColorActive;
|
|
179
186
|
const defBgColot = disabled ? buttonBgDeactivate : buttonBgActive;
|
|
180
187
|
const styleContener = {
|
|
181
188
|
width,
|
|
@@ -187,20 +194,20 @@ const Button = (props) => {
|
|
|
187
194
|
fontWeight,
|
|
188
195
|
borderRadius,
|
|
189
196
|
cursor: disabled ? "none" : cursor,
|
|
197
|
+
borderColor: borderColor ? borderColor : defBgColot,
|
|
190
198
|
color: color ? color : defColor,
|
|
191
|
-
|
|
192
|
-
backgroundColpr: backgroundColor ? backgroundColor : defBgColot,
|
|
199
|
+
backgroundColor: backgroundColor ? backgroundColor : defBgColot,
|
|
193
200
|
...style
|
|
194
201
|
};
|
|
195
|
-
return (
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
202
|
+
return (jsx("button", { style: styleContener, onClick: () => {
|
|
203
|
+
if (disabled)
|
|
204
|
+
return;
|
|
205
|
+
onClick();
|
|
206
|
+
}, onSubmit: () => {
|
|
207
|
+
if (disabled)
|
|
208
|
+
return;
|
|
209
|
+
onSubmit();
|
|
210
|
+
}, disabled: disabled, children: btnName ? btnName : children }));
|
|
204
211
|
};
|
|
205
212
|
|
|
206
213
|
export { Button, AnkThemeProvider as default, useThemeColors };
|
package/dist/index.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.esm.js","sources":["../src/contexts/AnkThemeContext.ts","../src/hook/useSystemTheme.ts","../src/constants/colors.ts","../src/hook/useThemeColors.ts","../src/providers/MainUiView.tsx","../src/providers/AnkThemeProvider.tsx","../src/components/button/Button.tsx"],"sourcesContent":[null,null,null,null,null,null,null],"names":["defaultLight","defaultDark","light","dark","_jsx"
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":["../src/contexts/AnkThemeContext.ts","../src/hook/useSystemTheme.ts","../src/constants/colors.ts","../src/hook/useThemeColors.ts","../src/providers/MainUiView.tsx","../src/providers/AnkThemeProvider.tsx","../src/components/button/Button.tsx"],"sourcesContent":[null,null,null,null,null,null,null],"names":["defaultLight","defaultDark","light","dark","_jsx"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -18,18 +18,17 @@ const Button = (props: ButtonProps) => {
|
|
|
18
18
|
|
|
19
19
|
const {
|
|
20
20
|
width = "100%",
|
|
21
|
-
height = "
|
|
21
|
+
height = "30px",
|
|
22
22
|
borderWidth = "1px",
|
|
23
23
|
cursor = "pointer",
|
|
24
24
|
borderColor = "",
|
|
25
25
|
outline = "none",
|
|
26
26
|
borderStyle = "solid",
|
|
27
27
|
color = "",
|
|
28
|
-
fontSize =
|
|
28
|
+
fontSize = 14,
|
|
29
29
|
fontWeight = 'bold',
|
|
30
30
|
borderRadius = 5,
|
|
31
31
|
backgroundColor = "",
|
|
32
|
-
|
|
33
32
|
} = style;
|
|
34
33
|
|
|
35
34
|
|
|
@@ -41,7 +40,7 @@ const Button = (props: ButtonProps) => {
|
|
|
41
40
|
buttonColorActive,
|
|
42
41
|
buttonColorDeactivate
|
|
43
42
|
} = useThemeColors();
|
|
44
|
-
|
|
43
|
+
|
|
45
44
|
const btnColor = useThemeColors();
|
|
46
45
|
|
|
47
46
|
const defColor = disabled ? buttonColorDeactivate : buttonColorActive;
|
|
@@ -58,17 +57,15 @@ const Button = (props: ButtonProps) => {
|
|
|
58
57
|
fontWeight,
|
|
59
58
|
borderRadius,
|
|
60
59
|
cursor: disabled ? "none" : cursor,
|
|
60
|
+
borderColor: borderColor ? borderColor : defBgColot,
|
|
61
61
|
color: color ? color : defColor,
|
|
62
|
-
|
|
63
|
-
backgroundColpr: backgroundColor ? backgroundColor : defBgColot,
|
|
62
|
+
backgroundColor: backgroundColor ? backgroundColor : defBgColot,
|
|
64
63
|
...style
|
|
65
64
|
};
|
|
66
65
|
|
|
67
66
|
|
|
68
67
|
|
|
69
68
|
return (
|
|
70
|
-
<>
|
|
71
|
-
{JSON.stringify(btnColor)}
|
|
72
69
|
<button
|
|
73
70
|
style={styleContener}
|
|
74
71
|
onClick={() => {
|
|
@@ -83,7 +80,7 @@ const Button = (props: ButtonProps) => {
|
|
|
83
80
|
>
|
|
84
81
|
{btnName ? btnName : children}
|
|
85
82
|
</button >
|
|
86
|
-
|
|
83
|
+
|
|
87
84
|
);
|
|
88
85
|
};
|
|
89
86
|
export default Button;
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { InputProps } from '../../types/inputTypes'
|
|
3
|
+
import useThemeColors from '../../hook/useThemeColors';
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
const Input = (props: InputProps) => {
|
|
10
|
+
const {
|
|
11
|
+
name = "",
|
|
12
|
+
label = "",
|
|
13
|
+
placeholder = "",
|
|
14
|
+
value = "",
|
|
15
|
+
onChange = (val) => { },
|
|
16
|
+
onChangeEvent,
|
|
17
|
+
error = "",
|
|
18
|
+
disabled = false,
|
|
19
|
+
required = false,
|
|
20
|
+
children,
|
|
21
|
+
style = {},
|
|
22
|
+
} = props;
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
const inputName = name ? name : label;
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
const {
|
|
30
|
+
primary,
|
|
31
|
+
inputBgActive,
|
|
32
|
+
inputBgDeactivate,
|
|
33
|
+
inputColorActive,
|
|
34
|
+
inputColorDeactivate
|
|
35
|
+
} = useThemeColors();
|
|
36
|
+
|
|
37
|
+
const defColor = disabled ? inputColorDeactivate : inputColorActive;
|
|
38
|
+
const defBrColor = disabled ? inputColorDeactivate : inputColorActive;
|
|
39
|
+
const defBgColor = disabled ? inputBgDeactivate : inputBgActive;
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
const {
|
|
43
|
+
width = "94%",
|
|
44
|
+
height = "60px",
|
|
45
|
+
border = `1px solid`,
|
|
46
|
+
padding = 5,
|
|
47
|
+
margin = 5,
|
|
48
|
+
borderRadius = 10,
|
|
49
|
+
fontSize = 19,
|
|
50
|
+
fontWeight,
|
|
51
|
+
color,
|
|
52
|
+
backgroundColor,
|
|
53
|
+
borderColor
|
|
54
|
+
} = style;
|
|
55
|
+
|
|
56
|
+
|
|
57
|
+
|
|
58
|
+
|
|
59
|
+
const divStyleContener = {
|
|
60
|
+
width,
|
|
61
|
+
height,
|
|
62
|
+
padding,
|
|
63
|
+
fontWeight,
|
|
64
|
+
margin,
|
|
65
|
+
fontSize,
|
|
66
|
+
borderRadius,
|
|
67
|
+
border,
|
|
68
|
+
borderColor: borderColor ? borderColor : defBrColor,
|
|
69
|
+
backgroundColor: backgroundColor ? backgroundColor : defBgColor,
|
|
70
|
+
color: color ? color : defColor
|
|
71
|
+
};
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
const inputStyle = {
|
|
75
|
+
fontWeight,
|
|
76
|
+
border,
|
|
77
|
+
outline: 'none',
|
|
78
|
+
width: "95%",
|
|
79
|
+
fontSize,
|
|
80
|
+
marginTop: margin,
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
|
|
84
|
+
|
|
85
|
+
|
|
86
|
+
|
|
87
|
+
return (
|
|
88
|
+
<div>
|
|
89
|
+
<div
|
|
90
|
+
style={divStyleContener}
|
|
91
|
+
>
|
|
92
|
+
<div>
|
|
93
|
+
{inputName}
|
|
94
|
+
<span
|
|
95
|
+
style={{
|
|
96
|
+
color: "red"
|
|
97
|
+
}}
|
|
98
|
+
>
|
|
99
|
+
{
|
|
100
|
+
required && " *"
|
|
101
|
+
}
|
|
102
|
+
</span>
|
|
103
|
+
</div>
|
|
104
|
+
|
|
105
|
+
<input
|
|
106
|
+
style={inputStyle}
|
|
107
|
+
value={value}
|
|
108
|
+
onChangeEvent={onChangeEvent}
|
|
109
|
+
onChange={(e) => {
|
|
110
|
+
let val = e.target.value;
|
|
111
|
+
onChange(val);
|
|
112
|
+
}}
|
|
113
|
+
disabled={disabled}
|
|
114
|
+
/>
|
|
115
|
+
|
|
116
|
+
{children && children}
|
|
117
|
+
</div>
|
|
118
|
+
|
|
119
|
+
<div style={{
|
|
120
|
+
color: primary,
|
|
121
|
+
padding,
|
|
122
|
+
marginLeft: margin,
|
|
123
|
+
}}>
|
|
124
|
+
{
|
|
125
|
+
error && error
|
|
126
|
+
}
|
|
127
|
+
</div>
|
|
128
|
+
</div>
|
|
129
|
+
);
|
|
130
|
+
};
|
|
131
|
+
export default Input;
|
package/src/constants/colors.ts
CHANGED
|
@@ -10,11 +10,20 @@ export const light = {
|
|
|
10
10
|
backgroundColor: '#f0f0f0',
|
|
11
11
|
secondryBgColor: '#808080',
|
|
12
12
|
color: '#000',
|
|
13
|
+
|
|
14
|
+
|
|
13
15
|
buttonBgActive: "red",
|
|
14
16
|
buttonColorActive: "#fdfdfd3b",
|
|
15
17
|
buttonBgDeactivate: "#8404043b",
|
|
16
|
-
buttonColorDeactivate: "#5d13133b"
|
|
17
|
-
|
|
18
|
+
buttonColorDeactivate: "#5d13133b",
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
inputColorActive: "#000",
|
|
22
|
+
inputColorDeactivate: "#5d13133b",
|
|
23
|
+
inputBgActive: "pink",
|
|
24
|
+
inputBgDeactivate: "#8404043b",
|
|
25
|
+
|
|
26
|
+
};
|
|
18
27
|
|
|
19
28
|
export const dark = {
|
|
20
29
|
primary: 'red',
|
|
@@ -25,10 +34,16 @@ export const dark = {
|
|
|
25
34
|
backgroundColor: '#444',
|
|
26
35
|
secondryBgColor: '808080',
|
|
27
36
|
color: '#eee',
|
|
37
|
+
|
|
28
38
|
buttonBgActive: "red",
|
|
29
39
|
buttonColorActive: "#fdfdfd3b",
|
|
30
40
|
buttonBgDeactivate: "#8404043b",
|
|
31
|
-
buttonColorDeactivate: "#5d13133b"
|
|
41
|
+
buttonColorDeactivate: "#5d13133b",
|
|
42
|
+
|
|
43
|
+
inputBgActive: "red",
|
|
44
|
+
inputColorActive: "#fdfdfd3b",
|
|
45
|
+
inputBgDeactivate: "#8404043b",
|
|
46
|
+
inputColorDeactivate: "#5d13133b"
|
|
32
47
|
}
|
|
33
48
|
|
|
34
49
|
const colors = { light, dark }
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './Button';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './Input';
|
|
File without changes
|