overgrid-vue 0.1.0
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/README.md +11 -0
- package/dist/favicon.ico +0 -0
- package/dist/overgrid-vue.css +1 -0
- package/dist/overgrid.es.js +24109 -0
- package/dist/overgrid.umd.js +151 -0
- package/package.json +82 -0
- package/src/components/OverGrid/themes/default.css +112 -0
- package/src/components/OverGrid/themes/pink.css +106 -0
package/package.json
ADDED
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "overgrid-vue",
|
|
3
|
+
"private": false,
|
|
4
|
+
"version": "0.1.0",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"license": "MIT",
|
|
7
|
+
"main": "./dist/overgrid.umd.js",
|
|
8
|
+
"module": "./dist/overgrid.es.js",
|
|
9
|
+
"types": "./dist/index.d.ts",
|
|
10
|
+
"keywords": [
|
|
11
|
+
"vue",
|
|
12
|
+
"grid",
|
|
13
|
+
"table",
|
|
14
|
+
"overgrid",
|
|
15
|
+
"datatable",
|
|
16
|
+
"datagrid"
|
|
17
|
+
],
|
|
18
|
+
"files": [
|
|
19
|
+
"dist",
|
|
20
|
+
"src/components/OverGrid/themes/default.css",
|
|
21
|
+
"src/components/OverGrid/themes/pink.css"
|
|
22
|
+
],
|
|
23
|
+
"exports": {
|
|
24
|
+
".": {
|
|
25
|
+
"import": "./dist/overgrid.es.js",
|
|
26
|
+
"require": "./dist/overgrid.umd.js"
|
|
27
|
+
},
|
|
28
|
+
"./dist/overgrid.css": {
|
|
29
|
+
"default": "./dist/overgrid.css"
|
|
30
|
+
}
|
|
31
|
+
},
|
|
32
|
+
"peerDependencies": {
|
|
33
|
+
"vue": "^3.0.0"
|
|
34
|
+
},
|
|
35
|
+
"scripts": {
|
|
36
|
+
"dev": "vite",
|
|
37
|
+
"build": "vite build && vue-tsc --declaration --emitDeclarationOnly --outDir dist",
|
|
38
|
+
"build-typecheck": "run-p type-check \"build-only {@}\" --",
|
|
39
|
+
"preview": "vite preview",
|
|
40
|
+
"test:unit": "vitest",
|
|
41
|
+
"test:component": "vitest",
|
|
42
|
+
"test:coverage": "vitest --coverage",
|
|
43
|
+
"build-only": "vite build",
|
|
44
|
+
"type-check": "vue-tsc --build",
|
|
45
|
+
"lint": "eslint . --fix",
|
|
46
|
+
"format": "prettier --write src/",
|
|
47
|
+
"npm-publish": "npm run build && npm publish --access=public"
|
|
48
|
+
},
|
|
49
|
+
"dependencies": {
|
|
50
|
+
"@coders-tm/vue-number-format": "^3.35.4",
|
|
51
|
+
"axios": "^1.10.0",
|
|
52
|
+
"moment": "^2.30.1",
|
|
53
|
+
"vue": "^3.5.17",
|
|
54
|
+
"vue-json-excel3": "^1.0.30"
|
|
55
|
+
},
|
|
56
|
+
"devDependencies": {
|
|
57
|
+
"@tailwindcss/vite": "^4.1.11",
|
|
58
|
+
"@tsconfig/node22": "^22.0.2",
|
|
59
|
+
"@types/jsdom": "^21.1.7",
|
|
60
|
+
"@types/node": "^22.15.32",
|
|
61
|
+
"@types/vue": "^1.0.31",
|
|
62
|
+
"@vitejs/plugin-vue": "^6.0.0",
|
|
63
|
+
"@vitest/coverage-v8": "^3.2.4",
|
|
64
|
+
"@vitest/eslint-plugin": "^1.2.7",
|
|
65
|
+
"@vue/eslint-config-prettier": "^10.2.0",
|
|
66
|
+
"@vue/eslint-config-typescript": "^14.5.1",
|
|
67
|
+
"@vue/test-utils": "^2.4.6",
|
|
68
|
+
"@vue/tsconfig": "^0.7.0",
|
|
69
|
+
"eslint": "^9.29.0",
|
|
70
|
+
"eslint-plugin-vue": "~10.2.0",
|
|
71
|
+
"jiti": "^2.4.2",
|
|
72
|
+
"jsdom": "^26.1.0",
|
|
73
|
+
"npm-run-all2": "^8.0.4",
|
|
74
|
+
"prettier": "3.5.3",
|
|
75
|
+
"tailwindcss": "^4.1.11",
|
|
76
|
+
"typescript": "~5.8.0",
|
|
77
|
+
"vite": "^6.3.5",
|
|
78
|
+
"vite-plugin-vue-devtools": "^7.7.7",
|
|
79
|
+
"vitest": "^3.2.4",
|
|
80
|
+
"vue-tsc": "^2.2.10"
|
|
81
|
+
}
|
|
82
|
+
}
|
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');
|
|
2
|
+
@import 'tailwindcss';
|
|
3
|
+
|
|
4
|
+
.overgrid[data-theme='default'] {
|
|
5
|
+
font-family: 'Ubuntu', sans-serif;
|
|
6
|
+
--overgrid-color-overcode-red: #d92228;
|
|
7
|
+
--overgrid-color-overcode-red-active: #972322;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.overgrid[data-theme='default'] .overgrid-header {
|
|
11
|
+
@apply bg-black/5;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.overgrid[data-theme='default'] .overgrid-column-title-container-hoverable {
|
|
15
|
+
@apply hover:bg-black/10;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.overgrid[data-theme='default'] .overgrid-header .overgrid-cell {
|
|
19
|
+
@apply border-r-[1px] border-black/5;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.overgrid[data-theme='default'] .overgrid-body .overgrid-cell {
|
|
23
|
+
@apply border-r-[1px] border-black/5;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.overgrid[data-theme='default'] .overgrid-body .overgrid-cell:first-child {
|
|
27
|
+
@apply border-l-[1px] border-black/5;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.overgrid[data-theme='default'] .overgrid-header .overgrid-cell:last-child {
|
|
31
|
+
@apply border-r-0;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.overgrid[data-theme='default'] .overgrid-body .overgrid-extra-row-cell {
|
|
35
|
+
@apply border-l-[1px] border-b-[1px] border-black/5 p-4 bg-black/5;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.overgrid[data-theme='default'] .overgrid-row {
|
|
39
|
+
@apply border-b-[1px] border-black/5;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
/* Button styles */
|
|
43
|
+
.overgrid[data-theme='default'] .overgrid-btn-primary {
|
|
44
|
+
@apply bg-(--overgrid-color-overcode-red) text-white hover:bg-(--overgrid-color-overcode-red-active) focus:ring-(--overgrid-color-overcode-red);
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.overgrid[data-theme='default'] .overgrid-btn-secondary {
|
|
48
|
+
@apply bg-slate-700 text-white hover:bg-slate-800 focus:ring-slate-700;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.overgrid[data-theme='default'] .overgrid-btn-danger {
|
|
52
|
+
@apply bg-red-600 text-white hover:bg-red-700 focus:ring-red-500;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.overgrid[data-theme='default'] .overgrid-btn-light {
|
|
56
|
+
@apply bg-black/10 text-black hover:bg-black/20;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.overgrid[data-theme='default'] .overgrid-btn-ghost {
|
|
60
|
+
@apply bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-300;
|
|
61
|
+
}
|
|
62
|
+
/* Button styles */
|
|
63
|
+
|
|
64
|
+
/* Input styles */
|
|
65
|
+
.overgrid[data-theme='default'] .overgrid-input-primary {
|
|
66
|
+
@apply border-[1px] border-black/20 focus:outline-1 outline-offset-1 outline-black/20;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.overgrid[data-theme='default'] .overgrid-input-secondary {
|
|
70
|
+
@apply bg-amber-400 text-black hover:bg-amber-600 focus:shadow-sm;
|
|
71
|
+
}
|
|
72
|
+
/* Input styles */
|
|
73
|
+
|
|
74
|
+
/* Checkbox styles */
|
|
75
|
+
.overgrid[data-theme='default'] .overgrid-checkbox {
|
|
76
|
+
@apply w-5 h-5 cursor-pointer;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.overgrid[data-theme='default'] .overgrid-checkbox-black {
|
|
80
|
+
@apply rounded-full text-black/70;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.overgrid[data-theme='default'] .overgrid-checkbox-black svg {
|
|
84
|
+
@apply w-3 h-3 text-black/70;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
.overgrid[data-theme='default'] .overgrid-checkbox-secondary {
|
|
88
|
+
@apply rounded-full border-black/70;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
.overgrid[data-theme='default'] .overgrid-checkbox-secondary svg {
|
|
92
|
+
@apply w-3 h-3 text-black/70;
|
|
93
|
+
}
|
|
94
|
+
/* Checkbox styles */
|
|
95
|
+
|
|
96
|
+
/* Radio styles */
|
|
97
|
+
.overgrid[data-theme='default'] .overgrid-radio-primary {
|
|
98
|
+
@apply rounded-full border-pink-700;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.overgrid[data-theme='default'] .overgrid-radio-primary svg {
|
|
102
|
+
@apply w-3 h-3 text-pink-700;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
.overgrid[data-theme='default'] .overgrid-radio-black {
|
|
106
|
+
@apply rounded-full border-black/70;
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
.overgrid[data-theme='default'] .overgrid-radio-black svg {
|
|
110
|
+
@apply w-3 h-3 text-black/70;
|
|
111
|
+
}
|
|
112
|
+
/* Radio styles */
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');
|
|
2
|
+
@import 'tailwindcss';
|
|
3
|
+
|
|
4
|
+
.overgrid[data-theme='pink'] {
|
|
5
|
+
font-family: 'Ubuntu', sans-serif;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
.overgrid[data-theme='pink'] .overgrid-header {
|
|
9
|
+
@apply bg-pink-800 text-white;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.overgrid[data-theme='pink'] .overgrid-column-title-container-hoverable {
|
|
13
|
+
@apply hover:bg-pink-950;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.overgrid[data-theme='pink'] .overgrid-row {
|
|
17
|
+
@apply bg-pink-700 text-white;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.overgrid[data-theme='pink'] .overgrid-header .overgrid-cell {
|
|
21
|
+
@apply border-r-[1px] border-pink-900/50;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.overgrid[data-theme='pink'] .overgrid-body .overgrid-cell {
|
|
25
|
+
@apply border-r-[1px] border-pink-800/50;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.overgrid[data-theme='pink'] .overgrid-header .overgrid-cell:last-child {
|
|
29
|
+
@apply border-r-0;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.overgrid[data-theme='pink'] .overgrid-row {
|
|
33
|
+
@apply border-b-[1px] border-black/5;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
/* Button styles */
|
|
37
|
+
.overgrid[data-theme='pink'] .overgrid-btn-primary {
|
|
38
|
+
@apply bg-pink-700 text-white hover:bg-pink-600 focus:ring-pink-600;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.overgrid[data-theme='pink'] .overgrid-btn-secondary {
|
|
42
|
+
@apply bg-amber-400 text-black hover:bg-amber-600 focus:ring-pink-600;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.overgrid[data-theme='pink'] .overgrid-btn-danger {
|
|
46
|
+
@apply bg-red-600 text-white hover:bg-red-700 focus:ring-red-500;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.overgrid[data-theme='pink'] .overgrid-btn-light {
|
|
50
|
+
@apply bg-white/20 text-white hover:bg-white/30;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.overgrid[data-theme='pink'] .overgrid-btn-ghost {
|
|
54
|
+
@apply bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-300;
|
|
55
|
+
}
|
|
56
|
+
/* Button styles */
|
|
57
|
+
|
|
58
|
+
/* Input styles */
|
|
59
|
+
.overgrid[data-theme='pink'] .overgrid-input-primary {
|
|
60
|
+
@apply border-[1px] border-black/20 focus:outline-1 outline-offset-1 outline-black/20;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.overgrid[data-theme='pink'] .overgrid-input-secondary {
|
|
64
|
+
@apply bg-amber-400 text-black hover:bg-amber-600 focus:shadow-sm;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.overgrid[data-theme='pink'] .overgrid-input-danger {
|
|
68
|
+
@apply bg-red-600 text-white hover:bg-red-700 focus:ring-red-500;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.overgrid[data-theme='pink'] .overgrid-input-light {
|
|
72
|
+
@apply bg-white/20 text-white hover:bg-white/30;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.overgrid[data-theme='pink'] .overgrid-input-ghost {
|
|
76
|
+
@apply bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-gray-300;
|
|
77
|
+
}
|
|
78
|
+
/* Input styles */
|
|
79
|
+
|
|
80
|
+
.overgrid[data-theme='pink'] .overgrid-checkbox-black {
|
|
81
|
+
@apply rounded-full text-black/70;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
.overgrid[data-theme='pink'] .overgrid-checkbox-black svg {
|
|
85
|
+
@apply w-3 h-3 text-black/70;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
.overgrid[data-theme='pink'] .overgrid-checkbox-secondary {
|
|
89
|
+
@apply rounded-full border-white/70;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
.overgrid[data-theme='pink'] .overgrid-checkbox-secondary svg {
|
|
93
|
+
@apply w-3 h-3 text-white;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
.overgrid[data-theme='pink'] .overgrid-radio-black {
|
|
97
|
+
@apply rounded-full border-black/70;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.overgrid[data-theme='pink'] .overgrid-radio-black svg {
|
|
101
|
+
@apply w-3 h-3 text-black/70;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
.overgrid[data-theme='pink'] .overgrid-checkbox {
|
|
105
|
+
@apply w-5 h-5 cursor-pointer;
|
|
106
|
+
}
|