@charlesgomes/leafcode-shared-lib-react 1.0.56 → 1.0.58

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.
@@ -0,0 +1,128 @@
1
+ * {
2
+ box-sizing: border-box;
3
+ }
4
+
5
+ /* LABEL */
6
+ .label-input {
7
+ font-family: var(--label-font-family, "Roboto", sans-serif);
8
+ font-weight: var(--label-font-weight, 400);
9
+ font-size: 13px;
10
+ line-height: 14px;
11
+ color: var(--label-color, #070707);
12
+ position: absolute;
13
+ z-index: 1;
14
+ left: 0.5rem;
15
+ top: -8px;
16
+ display: inline-block;
17
+ padding: 0 0.25rem;
18
+ }
19
+
20
+ .label-input::before {
21
+ content: "";
22
+ position: absolute;
23
+ background-color: var(--label-bg, #f9fafb);
24
+ width: 100%;
25
+ height: 4px;
26
+ left: 0;
27
+ top: 6px;
28
+ z-index: -10;
29
+ }
30
+
31
+ .label-input::after {
32
+ content: "";
33
+ position: absolute;
34
+ background-color: var(--label-bg, #f9fafb);
35
+ width: 100%;
36
+ height: 2px;
37
+ left: 0;
38
+ top: 9px;
39
+ z-index: -10;
40
+ }
41
+
42
+ /* INPUT */
43
+ .input {
44
+ font-family: var(--input-font-family, "Roboto", sans-serif);
45
+ font-weight: var(--input-font-weight, 400);
46
+ font-size: 13.5px;
47
+ width: 100%;
48
+ border: 1px solid var(--input-border, #d1d5db);
49
+ border-radius: 6px;
50
+ height: 2.5rem;
51
+ padding: 0.75rem;
52
+ background-color: var(--input-bg, #ffffff);
53
+ color: var(--input-text, #070707);
54
+ position: relative;
55
+ }
56
+
57
+ .input:focus {
58
+ outline: none;
59
+ border-color: var(--input-focus-border, #60a5fa);
60
+ }
61
+
62
+ .input::placeholder {
63
+ color: var(--input-placeholder, #a5a5a5);
64
+ }
65
+
66
+ .input-wrapper {
67
+ position: relative;
68
+ }
69
+
70
+ .input-wrapper.is-disabled {
71
+ opacity: 0.5;
72
+ }
73
+
74
+ .input:disabled {
75
+ cursor: not-allowed;
76
+ border-color: var(--input-disabled-border, #d1d5db);
77
+ background-color: var(--input-disabled-bg, #f3f4f6);
78
+ }
79
+
80
+ .input-error {
81
+ border-color: var(--input-error-border, #f87171);
82
+ }
83
+
84
+ .input-error:focus {
85
+ border-color: var(--input-error-border, #f87171);
86
+ }
87
+
88
+ input:-webkit-autofill {
89
+ -webkit-box-shadow: 0 0 0 30px
90
+ light-dark(var(--autofill-box-shadow, --autofill-box-shadow)) inset !important;
91
+ -webkit-text-fill-color: var(--autofill-text-color, #070707) !important;
92
+ border: 1px solid var(--autofill-border, #ffffff);
93
+ }
94
+
95
+ input:-webkit-autofill:focus {
96
+ -webkit-box-shadow: 0 0 0 30px
97
+ light-dark(var(--autofill-focus, --autofill-focus)) inset !important;
98
+ -webkit-text-fill-color: var(--autofill-text-color, #070707) !important;
99
+ border: 1px solid var(--autofill-border, #ffffff);
100
+ }
101
+
102
+ .is-uppercase {
103
+ text-transform: uppercase;
104
+ }
105
+
106
+ .password-toggle {
107
+ position: absolute;
108
+ bottom: 0.75rem;
109
+ color: var(--color-password-toggle, #a5a5a5);
110
+ cursor: pointer;
111
+ width: 1.25rem;
112
+ height: 1.25rem;
113
+ }
114
+
115
+ /* PASSWORD */
116
+ .password-toggle.no-error {
117
+ right: 1rem;
118
+ }
119
+
120
+ .password-toggle.error {
121
+ right: 2.5rem;
122
+ }
123
+
124
+ /* TEXTAREA */
125
+ .textArea {
126
+ resize: none;
127
+ height: var(--height-text-area, 6rem);
128
+ }
@@ -639,3 +639,28 @@ th {
639
639
  > .p-datatable-thead {
640
640
  top: 0;
641
641
  }
642
+
643
+ .input-search {
644
+ padding-right: 2rem;
645
+ height: 2.25rem;
646
+ padding-left: 14px;
647
+ }
648
+
649
+ .close-search {
650
+ position: absolute;
651
+ top: 50%;
652
+ right: 10px;
653
+ transform: translateY(-50%);
654
+ cursor: pointer;
655
+ color: #bf1717;
656
+ width: 1.25rem;
657
+ height: 1.25rem;
658
+ padding: 3px;
659
+ transition: all 0.3s ease-in-out;
660
+ }
661
+
662
+ .close-search:hover {
663
+ background-color: #bf1717;
664
+ color: #fff;
665
+ border-radius: 5rem;
666
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@charlesgomes/leafcode-shared-lib-react",
3
- "version": "1.0.56",
3
+ "version": "1.0.58",
4
4
  "description": "Lib de componentes react",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.mjs",
@@ -12,7 +12,8 @@
12
12
  "require": "./dist/index.cjs"
13
13
  },
14
14
  "./table.css": "./dist/styles/table.css",
15
- "./button.css": "./dist/styles/button.css"
15
+ "./button.css": "./dist/styles/button.css",
16
+ "./input.css": "./dist/styles/input.css"
16
17
  },
17
18
  "files": [
18
19
  "dist"
@@ -52,10 +53,12 @@
52
53
  "vite": "^7.1.4"
53
54
  },
54
55
  "dependencies": {
56
+ "@charlesgomes/leafcode-shared-lib-react": "^1.0.57",
55
57
  "@phosphor-icons/react": "^2.1.10",
56
58
  "clsx": "^2.1.1",
57
59
  "moment": "^2.30.1",
58
60
  "primereact": "^10.9.7",
61
+ "react-hook-form": "^7.70.0",
59
62
  "react-select": "^5.10.2",
60
63
  "react-tooltip": "^5.29.1",
61
64
  "tailwind-merge": "^3.3.1"