josenanodev-react-components-library 0.2.0 → 0.2.2

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.
@@ -40,11 +40,9 @@ function styleObjectParser(styleObject) {
40
40
  if (styleObject.bold)
41
41
  restultantStyleObject.s.font = Object.assign(Object.assign({}, restultantStyleObject.s.font), { bold: styleObject.bold });
42
42
  if (styleObject.backgroundColor)
43
- restultantStyleObject.s.fill = Object.assign(Object.assign({}, restultantStyleObject.s.fill), { fgColor: { rgb: styleObject.backgroundColor } });
43
+ restultantStyleObject.s.fill = Object.assign(Object.assign({}, restultantStyleObject.s.fill), { fgColor: { rgb: styleObject.foregroundColor }, bgColor: { rgb: styleObject.backgroundColor } });
44
44
  if (styleObject.borders)
45
- restultantStyleObject.s.border = {
46
- bgColor: styleObject.borders,
47
- };
45
+ restultantStyleObject.s.border = Object.assign({}, styleObject.borders);
48
46
  return restultantStyleObject;
49
47
  }
50
48
  function downloadExcel(fileName, data, headers) {
@@ -17,11 +17,12 @@ export interface StyleObjectXlsxType {
17
17
  fontColor?: string;
18
18
  bold?: boolean;
19
19
  backgroundColor?: string;
20
+ foregroundColor?: string;
20
21
  borders?: {
21
- top: BorderStyleType;
22
- bottom: BorderStyleType;
23
- left: BorderStyleType;
24
- right: BorderStyleType;
22
+ top?: { style: BorderStyleType; color: string };
23
+ bottom?: { style: BorderStyleType; color: string };
24
+ left?: { style: BorderStyleType; color: string };
25
+ right?: { style: BorderStyleType; color: string };
25
26
  };
26
27
  }
27
28
  export interface DataObjectXlsxType extends StyleObjectXlsxType {
@@ -51,6 +51,35 @@ const InputBoxWithConfirmation = ({ onConfirmAction, inputType = "text", adition
51
51
  setCachedValue(event.target.value);
52
52
  setCurrentValue(event.target.value);
53
53
  setFocused(true);
54
+ }, onKeyDown: (event) => {
55
+ console.log(event.key);
56
+ if (event.key === "Enter") {
57
+ if (currentValue) {
58
+ onConfirmAction(currentValue);
59
+ setCachedValue(currentValue);
60
+ }
61
+ setFocused(false);
62
+ if (inputRef.current) {
63
+ inputRef.current.blur();
64
+ }
65
+ }
66
+ else if (event.key === "Tab") {
67
+ if (currentValue) {
68
+ onConfirmAction(currentValue);
69
+ setCachedValue(currentValue);
70
+ }
71
+ setFocused(false);
72
+ if (inputRef.current) {
73
+ inputRef.current.blur();
74
+ }
75
+ }
76
+ else if (event.key === "Escape") {
77
+ setCurrentValue(cachedValue);
78
+ setFocused(false);
79
+ if (inputRef.current) {
80
+ inputRef.current.blur();
81
+ }
82
+ }
54
83
  } }),
55
84
  focused ? (react_1.default.createElement("button", { className: "button-for-input-box-with-confirmation", onClick: () => {
56
85
  if (currentValue) {
@@ -14,11 +14,9 @@ function styleObjectParser(styleObject) {
14
14
  if (styleObject.bold)
15
15
  restultantStyleObject.s.font = Object.assign(Object.assign({}, restultantStyleObject.s.font), { bold: styleObject.bold });
16
16
  if (styleObject.backgroundColor)
17
- restultantStyleObject.s.fill = Object.assign(Object.assign({}, restultantStyleObject.s.fill), { fgColor: { rgb: styleObject.backgroundColor } });
17
+ restultantStyleObject.s.fill = Object.assign(Object.assign({}, restultantStyleObject.s.fill), { fgColor: { rgb: styleObject.foregroundColor }, bgColor: { rgb: styleObject.backgroundColor } });
18
18
  if (styleObject.borders)
19
- restultantStyleObject.s.border = {
20
- bgColor: styleObject.borders,
21
- };
19
+ restultantStyleObject.s.border = Object.assign({}, styleObject.borders);
22
20
  return restultantStyleObject;
23
21
  }
24
22
  export function downloadExcel(fileName, data, headers) {
@@ -17,11 +17,12 @@ export interface StyleObjectXlsxType {
17
17
  fontColor?: string;
18
18
  bold?: boolean;
19
19
  backgroundColor?: string;
20
+ foregroundColor?: string;
20
21
  borders?: {
21
- top: BorderStyleType;
22
- bottom: BorderStyleType;
23
- left: BorderStyleType;
24
- right: BorderStyleType;
22
+ top?: { style: BorderStyleType; color: string };
23
+ bottom?: { style: BorderStyleType; color: string };
24
+ left?: { style: BorderStyleType; color: string };
25
+ right?: { style: BorderStyleType; color: string };
25
26
  };
26
27
  }
27
28
  export interface DataObjectXlsxType extends StyleObjectXlsxType {
@@ -23,6 +23,35 @@ const InputBoxWithConfirmation = ({ onConfirmAction, inputType = "text", adition
23
23
  setCachedValue(event.target.value);
24
24
  setCurrentValue(event.target.value);
25
25
  setFocused(true);
26
+ }, onKeyDown: (event) => {
27
+ console.log(event.key);
28
+ if (event.key === "Enter") {
29
+ if (currentValue) {
30
+ onConfirmAction(currentValue);
31
+ setCachedValue(currentValue);
32
+ }
33
+ setFocused(false);
34
+ if (inputRef.current) {
35
+ inputRef.current.blur();
36
+ }
37
+ }
38
+ else if (event.key === "Tab") {
39
+ if (currentValue) {
40
+ onConfirmAction(currentValue);
41
+ setCachedValue(currentValue);
42
+ }
43
+ setFocused(false);
44
+ if (inputRef.current) {
45
+ inputRef.current.blur();
46
+ }
47
+ }
48
+ else if (event.key === "Escape") {
49
+ setCurrentValue(cachedValue);
50
+ setFocused(false);
51
+ if (inputRef.current) {
52
+ inputRef.current.blur();
53
+ }
54
+ }
26
55
  } }),
27
56
  focused ? (React.createElement("button", { className: "button-for-input-box-with-confirmation", onClick: () => {
28
57
  if (currentValue) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "josenanodev-react-components-library",
3
- "version": "0.2.0",
3
+ "version": "0.2.2",
4
4
  "author": {
5
5
  "name": "Jose Carlos Cardenas Martinez"
6
6
  },