@jsonup/vue 0.0.1

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/style.css ADDED
@@ -0,0 +1,144 @@
1
+ .jsonup-viewer {
2
+ --jsonup-color-background: var(--jv-background, #ffffff);
3
+ --jsonup-color-text: var(--jv-foreground, #24292e);
4
+ --jsonup-color-muted: var(--jv-line-number, #8b949e);
5
+ --jsonup-color-hover: #f6f8fa;
6
+ --jsonup-color-key: var(--jv-property, #0550ae);
7
+ --jsonup-color-string: var(--jv-string, #0a3069);
8
+ --jsonup-color-number: var(--jv-number, #953800);
9
+ --jsonup-color-boolean: var(--jv-boolean, #cf222e);
10
+ --jsonup-color-null: var(--jv-null, #8250df);
11
+ --jsonup-color-summary: var(--jv-summary, #656d76);
12
+ --jsonup-color-punctuation-key-quote: var(--jv-punctuation-quote-key, var(--jv-punctuation-quote, #57606a));
13
+ --jsonup-color-punctuation-string-quote: var(--jv-punctuation-quote-string, var(--jv-punctuation-quote, #57606a));
14
+ --jsonup-color-punctuation-quote: var(--jv-punctuation-quote, #57606a);
15
+ --jsonup-color-punctuation-colon: var(--jv-punctuation-colon, #57606a);
16
+ --jsonup-color-punctuation-comma: var(--jv-punctuation-comma, #57606a);
17
+ --jsonup-color-punctuation-bracket: var(--jv-punctuation-bracket, #57606a);
18
+ --jsonup-color-storage-object: var(--jv-storage-object, var(--jsonup-color-punctuation-bracket));
19
+ --jsonup-color-storage-array: var(--jv-storage-array, var(--jsonup-color-punctuation-bracket));
20
+ background: var(--jsonup-color-background);
21
+ color: var(--jsonup-color-text);
22
+ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
23
+ font-size: 13px;
24
+ line-height: 1.6;
25
+ display: flex;
26
+ flex-direction: column;
27
+ align-items: stretch;
28
+ width: 100%;
29
+ height: 100%;
30
+ overflow-x: hidden;
31
+ /* ===== Scrollbar ===== */
32
+ scrollbar-width: thin;
33
+ scrollbar-color: oklch(0.27 0.01 271.03 / 0.1) transparent;
34
+ }
35
+ .jsonup-viewer[data-word-wrap="off"] {
36
+ overflow-x: auto;
37
+ }
38
+ .jsonup-viewer::-webkit-scrollbar {
39
+ width: 0.25rem;
40
+ }
41
+ .jsonup-viewer::-webkit-scrollbar-thumb {
42
+ background-color: oklch(0.27 0.01 271.03 / 0.1);
43
+ border-radius: 9999px;
44
+ }
45
+ .jsonup-viewer::-webkit-scrollbar-track {
46
+ background: transparent;
47
+ }
48
+ .jsonup-viewer[data-theme-type="dark"] {
49
+ --jsonup-color-hover: rgba(255, 255, 255, 0.08);
50
+ }
51
+ .jsonup-viewer.line-numbers .line {
52
+ position: relative;
53
+ padding-left: 0;
54
+ grid-template-columns: 48px minmax(0, 1fr);
55
+ }
56
+ .jsonup-viewer .line {
57
+ display: grid;
58
+ grid-template-columns: minmax(0, 1fr);
59
+ align-items: start;
60
+ min-height: 24px;
61
+ padding: 0 8px;
62
+ border-radius: 4px;
63
+ white-space: pre-wrap;
64
+ }
65
+ .jsonup-viewer .line[data-interactive="true"] {
66
+ cursor: pointer;
67
+ }
68
+ .jsonup-viewer .line[data-interactive="true"]:hover {
69
+ background: var(--jsonup-color-hover);
70
+ }
71
+ .jsonup-viewer .line-number {
72
+ padding-right: 12px;
73
+ background-color: #eee;
74
+ position: sticky;
75
+ left: 0;
76
+ height: 100%;
77
+ color: var(--jsonup-color-muted);
78
+ text-align: right;
79
+ user-select: none;
80
+ }
81
+ .jsonup-viewer .content {
82
+ display: inline-block;
83
+ min-width: 0;
84
+ padding-left: calc(var(--jsonup-viewer-line-depth) * 16px);
85
+ word-break: break-all;
86
+ text-wrap-mode: nowrap;
87
+ }
88
+ .jsonup-viewer .content.word-wrap {
89
+ word-break: break-word;
90
+ text-wrap-mode: wrap;
91
+ }
92
+ .jsonup-viewer .key {
93
+ color: var(--jsonup-color-key);
94
+ }
95
+ .jsonup-viewer .value.string {
96
+ color: var(--jsonup-color-string);
97
+ }
98
+ .jsonup-viewer .value.number {
99
+ color: var(--jsonup-color-number);
100
+ }
101
+ .jsonup-viewer .value.boolean {
102
+ color: var(--jsonup-color-boolean);
103
+ }
104
+ .jsonup-viewer .value.null {
105
+ color: var(--jsonup-color-null);
106
+ }
107
+ .jsonup-viewer .quote,
108
+ .jsonup-viewer .punctuation.quote {
109
+ color: var(--jsonup-color-punctuation-quote);
110
+ }
111
+ .jsonup-viewer .key-quote,
112
+ .jsonup-viewer .quote-token.key {
113
+ color: var(--jsonup-color-punctuation-key-quote);
114
+ }
115
+ .jsonup-viewer .string-quote,
116
+ .jsonup-viewer .quote-token.string {
117
+ color: var(--jsonup-color-punctuation-string-quote);
118
+ }
119
+ .jsonup-viewer .colon,
120
+ .jsonup-viewer .punctuation.colon {
121
+ color: var(--jsonup-color-punctuation-colon);
122
+ }
123
+ .jsonup-viewer .comma,
124
+ .jsonup-viewer .punctuation.comma {
125
+ color: var(--jsonup-color-punctuation-comma);
126
+ }
127
+ .jsonup-viewer .symbol,
128
+ .jsonup-viewer .punctuation.bracket {
129
+ color: var(--jsonup-color-punctuation-bracket);
130
+ }
131
+ .jsonup-viewer .storage.object {
132
+ color: var(--jsonup-color-storage-object);
133
+ }
134
+ .jsonup-viewer .storage.array {
135
+ color: var(--jsonup-color-storage-array);
136
+ }
137
+ .jsonup-viewer .summary {
138
+ color: var(--jsonup-color-summary);
139
+ }
140
+ .jsonup-viewer .line[data-state="open"] .symbol,
141
+ .jsonup-viewer .line[data-state="close"] .symbol,
142
+ .jsonup-viewer .line[data-state="collapsed"] .symbol {
143
+ font-weight: 600;
144
+ }
package/package.json ADDED
@@ -0,0 +1,61 @@
1
+ {
2
+ "name": "@jsonup/vue",
3
+ "type": "module",
4
+ "version": "0.0.1",
5
+ "description": "Vue 3 adapter and component for rendering the jsonup JSON viewer.",
6
+ "author": {
7
+ "name": "Michael Cocova",
8
+ "email": "michael.cocova@gmail.com"
9
+ },
10
+ "license": "MIT",
11
+ "homepage": "https://github.com/michaelcocova/jsonup#readme",
12
+ "repository": {
13
+ "type": "git",
14
+ "url": "git+https://github.com/michaelcocova/jsonup.git"
15
+ },
16
+ "bugs": {
17
+ "url": "https://github.com/michaelcocova/jsonup/issues"
18
+ },
19
+ "exports": {
20
+ ".": "./dist/index.js",
21
+ "./package.json": "./package.json",
22
+ "./style.css": "./dist/style.css"
23
+ },
24
+ "files": [
25
+ "dist"
26
+ ],
27
+ "publishConfig": {
28
+ "access": "public"
29
+ },
30
+ "peerDependencies": {
31
+ "vue": "^3.0.0"
32
+ },
33
+ "dependencies": {
34
+ "@jsonup/core": "0.0.1",
35
+ "@jsonup/operation": "0.0.1",
36
+ "@jsonup/themes": "0.0.1"
37
+ },
38
+ "devDependencies": {
39
+ "@tsdown/css": "^0.22.0",
40
+ "@types/node": "^25.6.2",
41
+ "@vitejs/plugin-vue": "^6.0.6",
42
+ "@vitest/browser-playwright": "^4.1.5",
43
+ "playwright": "^1.59.1",
44
+ "tsdown": "^0.22.0",
45
+ "typescript": "^6.0.3",
46
+ "virtua": "0.49.1",
47
+ "vite": "^8.0.11",
48
+ "vitest": "^4.1.5",
49
+ "vitest-browser-vue": "^2.1.0",
50
+ "vue": "^3.5.34",
51
+ "vue-tsc": "^3.2.8"
52
+ },
53
+ "inlinedDependencies": {
54
+ "virtua": "0.49.1"
55
+ },
56
+ "scripts": {
57
+ "build": "tsdown",
58
+ "dev": "tsdown --watch",
59
+ "test": "vitest run"
60
+ }
61
+ }