@owomark/view 0.1.5 → 0.1.7
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 +1 -1
- package/dist/.build-manifest.json +76 -0
- package/dist/{chunk-F3LG7AML.js → chunk-656BO747.js} +35 -13
- package/dist/{chunk-Y72HQJQI.js → chunk-BPOZMVU7.js} +2 -3
- package/dist/index.d.ts +29 -80
- package/dist/index.js +681 -54
- package/dist/internal/virtual/height-estimator.d.ts +2 -9
- package/dist/internal/virtual/height-estimator.js +1 -1
- package/dist/internal/virtual/viewport-manager.js +1 -1
- package/dist/preview-render.worker.js +369 -0
- package/dist/types-D4TVpyP7.d.ts +103 -0
- package/package.json +2 -2
- package/src/style.css +2 -0
- package/src/theme/cards.css +50 -0
- package/src/theme/dark.css +8 -0
- package/src/theme/light.css +8 -0
- package/src/theme/owomark.css +28 -2
- package/src/theme/preview.css +15 -0
- package/src/theme/toolbar.css +104 -0
package/src/theme/owomark.css
CHANGED
|
@@ -101,6 +101,12 @@
|
|
|
101
101
|
color: var(--owo-editor-text, #1f2937);
|
|
102
102
|
}
|
|
103
103
|
|
|
104
|
+
.owo-syntax-custom-inline {
|
|
105
|
+
color: var(--owo-syntax-custom-inline, var(--owo-editor-text, currentColor));
|
|
106
|
+
background-color: var(--owo-syntax-custom-inline-bg, rgba(250, 204, 21, 0.18));
|
|
107
|
+
border-radius: 0.2em;
|
|
108
|
+
}
|
|
109
|
+
|
|
104
110
|
.owo-syntax-inline-code {
|
|
105
111
|
color: var(--owo-syntax-inline-code, #0f766e);
|
|
106
112
|
background-color: var(--owo-syntax-inline-code-bg, rgba(148, 163, 184, 0.16));
|
|
@@ -126,6 +132,20 @@
|
|
|
126
132
|
font-weight: 600;
|
|
127
133
|
}
|
|
128
134
|
|
|
135
|
+
.owo-syntax-task-marker {
|
|
136
|
+
color: var(--owo-syntax-task-marker, var(--owo-syntax-list-marker, currentColor));
|
|
137
|
+
font-weight: 600;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
.owo-syntax-task-marker-checked {
|
|
141
|
+
color: var(--owo-syntax-task-marker-checked, var(--owo-success, currentColor));
|
|
142
|
+
font-weight: 700;
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.owo-syntax-table-separator {
|
|
146
|
+
color: var(--owo-syntax-table-separator, var(--owo-syntax-marker, currentColor));
|
|
147
|
+
}
|
|
148
|
+
|
|
129
149
|
.owo-syntax-blockquote-marker {
|
|
130
150
|
color: transparent;
|
|
131
151
|
font-size: inherit;
|
|
@@ -149,15 +169,21 @@
|
|
|
149
169
|
font-size: 0.9em;
|
|
150
170
|
}
|
|
151
171
|
|
|
172
|
+
.owo-syntax-strikethrough {
|
|
173
|
+
color: var(--owo-syntax-strikethrough, var(--owo-editor-text, currentColor));
|
|
174
|
+
text-decoration-line: line-through;
|
|
175
|
+
text-decoration-thickness: 0.08em;
|
|
176
|
+
}
|
|
177
|
+
|
|
152
178
|
.owo-syntax-hr {
|
|
153
179
|
color: var(--owo-syntax-hr, #d1d5db);
|
|
154
180
|
}
|
|
155
181
|
|
|
156
182
|
.owo-syntax-html {
|
|
157
|
-
color: var(--owo-syntax-keyword,
|
|
183
|
+
color: var(--owo-syntax-html, var(--owo-syntax-keyword, currentColor));
|
|
158
184
|
}
|
|
159
185
|
|
|
160
186
|
.owo-syntax-math {
|
|
161
|
-
color: var(--owo-syntax-string,
|
|
187
|
+
color: var(--owo-syntax-math, var(--owo-syntax-string, currentColor));
|
|
162
188
|
font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;
|
|
163
189
|
}
|
package/src/theme/preview.css
CHANGED
|
@@ -149,7 +149,22 @@
|
|
|
149
149
|
gap: 0;
|
|
150
150
|
}
|
|
151
151
|
|
|
152
|
+
.owomark-prose figure[data-rehype-pretty-code-figure] {
|
|
153
|
+
margin-top: var(--owo-preview-code-block-margin-top, 0.5rem);
|
|
154
|
+
margin-bottom: var(--owo-preview-code-block-margin-bottom, 0.5rem);
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
.owomark-prose figure[data-rehype-pretty-code-figure] pre {
|
|
158
|
+
margin-top: 0;
|
|
159
|
+
margin-bottom: 0;
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
.owomark-prose .owo-async-code-block[data-owo-code-block-state="loading"] pre {
|
|
163
|
+
opacity: 0.82;
|
|
164
|
+
}
|
|
165
|
+
|
|
152
166
|
.owomark-prose pre.shiki span[data-line] {
|
|
167
|
+
display: block;
|
|
153
168
|
min-height: var(--owo-preview-code-line-min-height, 1.5rem);
|
|
154
169
|
}
|
|
155
170
|
|
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
/* OwoMark Toolbar — Component quick-insert buttons */
|
|
2
|
+
|
|
3
|
+
.owo-toolbar__components-group {
|
|
4
|
+
display: flex;
|
|
5
|
+
flex-wrap: wrap;
|
|
6
|
+
align-items: center;
|
|
7
|
+
gap: 4px;
|
|
8
|
+
padding: 4px 6px;
|
|
9
|
+
background: var(--owo-toolbar-bg, #f8fafc);
|
|
10
|
+
border: 1px solid var(--owo-toolbar-border, #e2e8f0);
|
|
11
|
+
border-radius: 6px;
|
|
12
|
+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
13
|
+
font-size: 13px;
|
|
14
|
+
color: var(--owo-toolbar-text, #334155);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.owo-toolbar__component-button {
|
|
18
|
+
display: inline-flex;
|
|
19
|
+
align-items: center;
|
|
20
|
+
gap: 4px;
|
|
21
|
+
padding: 3px 8px;
|
|
22
|
+
border: none;
|
|
23
|
+
border-radius: 4px;
|
|
24
|
+
background: var(--owo-toolbar-button-bg, transparent);
|
|
25
|
+
color: var(--owo-toolbar-text, #334155);
|
|
26
|
+
font-size: 13px;
|
|
27
|
+
font-family: inherit;
|
|
28
|
+
line-height: 1.4;
|
|
29
|
+
cursor: pointer;
|
|
30
|
+
white-space: nowrap;
|
|
31
|
+
transition: background-color 0.1s, box-shadow 0.1s;
|
|
32
|
+
user-select: none;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
.owo-toolbar__component-button:hover {
|
|
36
|
+
background: var(--owo-toolbar-button-hover-bg, rgba(15, 23, 42, 0.06));
|
|
37
|
+
box-shadow: 0 0 0 1px var(--owo-toolbar-border, #e2e8f0);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.owo-toolbar__component-button:active {
|
|
41
|
+
background: var(--owo-toolbar-button-active-bg, rgba(37, 99, 235, 0.1));
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.owo-toolbar__component-icon {
|
|
45
|
+
flex-shrink: 0;
|
|
46
|
+
width: 16px;
|
|
47
|
+
height: 16px;
|
|
48
|
+
display: flex;
|
|
49
|
+
align-items: center;
|
|
50
|
+
justify-content: center;
|
|
51
|
+
color: var(--owo-toolbar-icon, #475569);
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.owo-toolbar__component-label {
|
|
55
|
+
font-weight: 500;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
/* --- Collapsed popover trigger (responsive) --- */
|
|
59
|
+
|
|
60
|
+
.owo-toolbar__collapse-trigger {
|
|
61
|
+
display: inline-flex;
|
|
62
|
+
align-items: center;
|
|
63
|
+
gap: 4px;
|
|
64
|
+
padding: 3px 8px;
|
|
65
|
+
border: none;
|
|
66
|
+
border-radius: 4px;
|
|
67
|
+
background: var(--owo-toolbar-button-bg, transparent);
|
|
68
|
+
color: var(--owo-toolbar-text, #334155);
|
|
69
|
+
font-size: 13px;
|
|
70
|
+
font-family: inherit;
|
|
71
|
+
line-height: 1.4;
|
|
72
|
+
cursor: pointer;
|
|
73
|
+
white-space: nowrap;
|
|
74
|
+
transition: background-color 0.1s;
|
|
75
|
+
user-select: none;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
.owo-toolbar__collapse-trigger:hover {
|
|
79
|
+
background: var(--owo-toolbar-button-hover-bg, rgba(15, 23, 42, 0.06));
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
/* --- Popover panel --- */
|
|
83
|
+
|
|
84
|
+
.owo-toolbar__popover {
|
|
85
|
+
position: absolute;
|
|
86
|
+
top: 100%;
|
|
87
|
+
left: 0;
|
|
88
|
+
z-index: 100;
|
|
89
|
+
display: flex;
|
|
90
|
+
flex-direction: column;
|
|
91
|
+
gap: 2px;
|
|
92
|
+
min-width: 140px;
|
|
93
|
+
padding: 4px;
|
|
94
|
+
margin-top: 4px;
|
|
95
|
+
background: var(--owo-toolbar-bg, #f8fafc);
|
|
96
|
+
border: 1px solid var(--owo-toolbar-border, #e2e8f0);
|
|
97
|
+
border-radius: 6px;
|
|
98
|
+
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.owo-toolbar__popover .owo-toolbar__component-button {
|
|
102
|
+
width: 100%;
|
|
103
|
+
justify-content: flex-start;
|
|
104
|
+
}
|