@vivix-labs/studio-asset-list 0.0.0-stage → 1.0.0-beta
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/UI-SYSTEM-LICENSE.txt +21 -0
- package/dist/assets/local-user-MIBWBA6X.png +0 -0
- package/dist/assets/nav-assets-35EAQZQX.svg +7 -0
- package/dist/assets/nav-home-BMDOUQGN.svg +5 -0
- package/dist/assets/nav-projects-N5UV3GAG.svg +6 -0
- package/dist/assets/nav-queue-2I5E65F4.svg +8 -0
- package/dist/client-code.css +896 -0
- package/dist/client-code.js +272 -0
- package/dist/client.js +3 -0
- package/package.json +18 -3
- package/studio-plugin.json +8 -0
- package/README.md +0 -3
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 VIVIX
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
|
Binary file
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g id="16*16/assets">
|
|
3
|
+
<path id="Vector" d="M2.5 2.5H17.5C17.9602 2.5 18.3333 2.8731 18.3333 3.33333V5.83333C18.3333 6.29357 17.9602 6.66667 17.5 6.66667H2.5C2.03976 6.66667 1.66667 6.29357 1.66667 5.83333V3.33333C1.66667 2.8731 2.03976 2.5 2.5 2.5Z" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke="#1C1C1C"/>
|
|
4
|
+
<path id="Vector_2" d="M3.33333 6.66667V15.8333C3.33333 16.2754 3.50893 16.6993 3.82149 17.0118C4.13405 17.3244 4.55797 17.5 5 17.5H15C15.442 17.5 15.866 17.3244 16.1785 17.0118C16.4911 16.6993 16.6667 16.2754 16.6667 15.8333V6.66667" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke="#1C1C1C"/>
|
|
5
|
+
<path id="Vector_3" d="M8.33333 10H11.6667" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke="#1C1C1C"/>
|
|
6
|
+
</g>
|
|
7
|
+
</svg>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g id="16*16/home">
|
|
3
|
+
<path id="Union" d="M9.99927 0.916097C10.5702 0.916097 11.1227 1.11891 11.5588 1.48739L11.5627 1.49032L17.3967 6.49032H17.3958C17.6625 6.71664 17.8773 6.99817 18.0247 7.31551C18.1726 7.63426 18.2493 7.98171 18.2493 8.33309V15.8331C18.2493 16.474 17.9945 17.0889 17.5413 17.5421C17.0881 17.9952 16.4731 18.2501 15.8323 18.2501H4.16626C3.5255 18.25 2.9104 17.9951 2.45728 17.5421C2.00423 17.0889 1.74927 16.4739 1.74927 15.8331V8.33309C1.74925 7.98171 1.82598 7.63426 1.97388 7.31551C2.12108 6.99833 2.33528 6.7166 2.60181 6.49032L8.43579 1.49032L8.4397 1.48739C8.8758 1.11883 9.42829 0.916174 9.99927 0.916097ZM9.99927 2.4161C9.78275 2.41617 9.57284 2.49313 9.40747 2.63289L9.40649 2.63192L3.57837 7.62899L3.57446 7.63289C3.47267 7.71894 3.39034 7.82644 3.33423 7.94735C3.27826 8.06813 3.24927 8.19997 3.24927 8.33309V15.8331C3.24927 16.0761 3.34608 16.3096 3.51782 16.4815C3.68964 16.6533 3.92332 16.75 4.16626 16.7501H6.74927V10.8331C6.74935 10.4134 6.91639 10.0108 7.21313 9.71395C7.50991 9.41717 7.91258 9.25025 8.33228 9.25008H11.6663C12.086 9.25017 12.4886 9.41719 12.7854 9.71395C13.0823 10.0108 13.2492 10.4133 13.2493 10.8331V16.7501H15.8323C16.0753 16.7501 16.3088 16.6533 16.4807 16.4815C16.6526 16.3096 16.7493 16.0762 16.7493 15.8331V8.33309L16.7434 8.23348C16.7326 8.13473 16.7063 8.03787 16.6643 7.94735C16.6082 7.82651 16.5258 7.7189 16.4241 7.63289L16.4202 7.62899L10.5911 2.63192V2.63289C10.4257 2.49322 10.2158 2.4161 9.99927 2.4161ZM8.33228 10.7501C8.31041 10.7503 8.28916 10.759 8.27368 10.7745C8.25824 10.79 8.24935 10.8112 8.24927 10.8331V16.7501H11.7493V10.8331C11.7492 10.8111 11.7404 10.79 11.7249 10.7745C11.7093 10.759 11.6882 10.7502 11.6663 10.7501H8.33228Z" fill="#0F0C0C"/>
|
|
4
|
+
</g>
|
|
5
|
+
</svg>
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g id="folder-management">
|
|
3
|
+
<path id="Vector" d="M6.66803 5.83333H10.0023M10.0023 5.83333H13.9617C15.7177 5.83333 16.5958 5.83333 17.2265 6.25466C17.4995 6.43706 17.734 6.67143 17.9164 6.94441C18.2448 7.43568 18.3173 8.07703 18.3333 9.16667M10.0023 5.83333L9.47426 4.7776C9.03683 3.90298 8.63709 3.0226 7.66768 2.65917C7.2431 2.5 6.75807 2.5 5.78802 2.5C4.27388 2.5 3.51681 2.5 2.94874 2.81693C2.54379 3.04285 2.20966 3.37689 1.98368 3.78172C1.66667 4.34964 1.66667 5.1065 1.66667 6.62023V9.16667C1.66667 13.095 1.66667 15.0592 2.88739 16.2796C4.10811 17.5 6.07283 17.5 10.0023 17.5" stroke-width="1.5" stroke-linecap="round" stroke="#0F0C0C"/>
|
|
4
|
+
<path id="Vector_2" d="M15 16.4773C16.4728 16.4773 17.6667 15.2562 17.6667 13.75C17.6667 12.2438 16.4728 11.0227 15 11.0227M15 16.4773C13.5272 16.4773 12.3333 15.2562 12.3333 13.75C12.3333 12.2438 13.5272 11.0227 15 11.0227M15 16.4773V17.5M15 11.0227V10M12.5761 12.2624L11.667 11.7045M18.3333 15.7955L17.4243 15.2376M17.4239 12.2624L18.333 11.7045M11.6667 15.7955L12.5757 15.2376" stroke-width="1.5" stroke-linecap="round" stroke="#0F0C0C"/>
|
|
5
|
+
</g>
|
|
6
|
+
</svg>
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="16.5" height="11.5" viewBox="0 0 16.5 11.5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g id="elements">
|
|
3
|
+
<path id="Vector 8035" d="M15.75 7.41667C15.75 8.58344 15.75 9.16683 15.5229 9.61248C15.3232 10.0045 15.0045 10.3232 14.6125 10.5229C14.1668 10.75 13.5834 10.75 12.4167 10.75H4.08333C2.91656 10.75 2.33317 10.75 1.88752 10.5229C1.49552 10.3232 1.17681 10.0045 0.977071 9.61248C0.750001 9.16683 0.750001 8.58344 0.750001 7.41667" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke="#0F0C0C"/>
|
|
4
|
+
<path id="Vector 8032" d="M3.25 7.41667H13.25" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke="#0F0C0C"/>
|
|
5
|
+
<path id="Vector 8033" d="M3.25 4.08333H13.25" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke="#0F0C0C"/>
|
|
6
|
+
<path id="Vector 8034" d="M3.25 0.75H13.25" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke="#0F0C0C"/>
|
|
7
|
+
</g>
|
|
8
|
+
</svg>
|
|
@@ -0,0 +1,896 @@
|
|
|
1
|
+
/* packages/studio-workbench/src/global-workbench.css */
|
|
2
|
+
body:has(.studio-global) {
|
|
3
|
+
margin: 0;
|
|
4
|
+
}
|
|
5
|
+
.studio-global {
|
|
6
|
+
min-height: 100dvh;
|
|
7
|
+
background: var(--vx-background-page);
|
|
8
|
+
}
|
|
9
|
+
.studio-global *,
|
|
10
|
+
.studio-global *::before,
|
|
11
|
+
.studio-global *::after {
|
|
12
|
+
box-sizing: border-box;
|
|
13
|
+
}
|
|
14
|
+
.studio-global h1,
|
|
15
|
+
.studio-global h2,
|
|
16
|
+
.studio-global p {
|
|
17
|
+
margin: 0;
|
|
18
|
+
}
|
|
19
|
+
.studio-shell {
|
|
20
|
+
display: flex;
|
|
21
|
+
height: 100dvh;
|
|
22
|
+
min-width: 0;
|
|
23
|
+
color: var(--vx-text-primary);
|
|
24
|
+
font: var(--vx-typography-inter-14-regular);
|
|
25
|
+
}
|
|
26
|
+
.studio-glyph {
|
|
27
|
+
flex: none;
|
|
28
|
+
width: 20px;
|
|
29
|
+
height: 20px;
|
|
30
|
+
}
|
|
31
|
+
.studio-sidebar {
|
|
32
|
+
display: flex;
|
|
33
|
+
flex-direction: column;
|
|
34
|
+
gap: 16px;
|
|
35
|
+
width: 240px;
|
|
36
|
+
flex: none;
|
|
37
|
+
border-right: var(--vx-divider-width) solid var(--vx-border-secondary);
|
|
38
|
+
background: var(--vx-background-page);
|
|
39
|
+
}
|
|
40
|
+
.studio-logo {
|
|
41
|
+
display: flex;
|
|
42
|
+
align-items: center;
|
|
43
|
+
justify-content: space-between;
|
|
44
|
+
gap: 4px;
|
|
45
|
+
padding: 16px 12px 0 16px;
|
|
46
|
+
white-space: nowrap;
|
|
47
|
+
}
|
|
48
|
+
.studio-logo strong {
|
|
49
|
+
font: var(--vx-typography-inter-16-semi-bold);
|
|
50
|
+
letter-spacing: -0.6px;
|
|
51
|
+
}
|
|
52
|
+
.studio-logo button,
|
|
53
|
+
.studio-sidebar :is(nav, .studio-project-row, .studio-project-pages) > button {
|
|
54
|
+
appearance: none;
|
|
55
|
+
border: 0;
|
|
56
|
+
background: transparent;
|
|
57
|
+
color: inherit;
|
|
58
|
+
cursor: pointer;
|
|
59
|
+
}
|
|
60
|
+
.studio-logo button {
|
|
61
|
+
display: grid;
|
|
62
|
+
place-items: center;
|
|
63
|
+
padding: 0;
|
|
64
|
+
width: 24px;
|
|
65
|
+
height: 24px;
|
|
66
|
+
color: var(--vx-icon-secondary);
|
|
67
|
+
}
|
|
68
|
+
.studio-sidebar nav {
|
|
69
|
+
display: flex;
|
|
70
|
+
flex-direction: column;
|
|
71
|
+
gap: 2px;
|
|
72
|
+
padding: 0 12px;
|
|
73
|
+
flex: 1;
|
|
74
|
+
min-height: 0;
|
|
75
|
+
overflow: auto;
|
|
76
|
+
}
|
|
77
|
+
.studio-sidebar :is(nav, .studio-project-row, .studio-project-pages) > button {
|
|
78
|
+
display: flex;
|
|
79
|
+
align-items: center;
|
|
80
|
+
gap: 8px;
|
|
81
|
+
min-height: 32px;
|
|
82
|
+
height: 32px;
|
|
83
|
+
flex: none;
|
|
84
|
+
padding: 4px;
|
|
85
|
+
border-radius: 8px;
|
|
86
|
+
text-align: left;
|
|
87
|
+
font: var(--vx-typography-inter-14-medium);
|
|
88
|
+
}
|
|
89
|
+
.studio-sidebar :is(nav, .studio-project-row, .studio-project-pages) > button > .studio-glyph {
|
|
90
|
+
margin: 2px;
|
|
91
|
+
}
|
|
92
|
+
.studio-sidebar :is(nav, .studio-project-row, .studio-project-pages) > button > span:last-child {
|
|
93
|
+
overflow: hidden;
|
|
94
|
+
white-space: nowrap;
|
|
95
|
+
text-overflow: ellipsis;
|
|
96
|
+
}
|
|
97
|
+
.studio-sidebar :is(nav, .studio-project-row, .studio-project-pages) > button[aria-current=page] {
|
|
98
|
+
background: var(--vx-surface-selected);
|
|
99
|
+
}
|
|
100
|
+
.studio-sidebar :is(nav, .studio-project-row, .studio-project-pages) > button:hover:not(:disabled) {
|
|
101
|
+
background: var(--vx-surface-hover);
|
|
102
|
+
}
|
|
103
|
+
.studio-sidebar :is(nav, .studio-project-row, .studio-project-pages) > button:disabled {
|
|
104
|
+
opacity: 0.5;
|
|
105
|
+
cursor: default;
|
|
106
|
+
}
|
|
107
|
+
.studio-sidebar h2 {
|
|
108
|
+
padding: 16px 4px 6px;
|
|
109
|
+
font: var(--vx-typography-inter-12-medium);
|
|
110
|
+
color: var(--vx-text-secondary-readable);
|
|
111
|
+
}
|
|
112
|
+
.studio-project-thumbnail {
|
|
113
|
+
display: grid;
|
|
114
|
+
place-items: center;
|
|
115
|
+
width: 24px;
|
|
116
|
+
height: 24px;
|
|
117
|
+
flex: none;
|
|
118
|
+
background: var(--vx-surface-input);
|
|
119
|
+
color: var(--vx-text-secondary-readable);
|
|
120
|
+
border-radius: 6px;
|
|
121
|
+
overflow: hidden;
|
|
122
|
+
}
|
|
123
|
+
.studio-project-thumbnail > svg {
|
|
124
|
+
width: 16px;
|
|
125
|
+
height: 16px;
|
|
126
|
+
}
|
|
127
|
+
.studio-project-thumbnail > :is(img, video) {
|
|
128
|
+
width: 100%;
|
|
129
|
+
height: 100%;
|
|
130
|
+
display: block;
|
|
131
|
+
object-fit: cover;
|
|
132
|
+
}
|
|
133
|
+
.studio-account {
|
|
134
|
+
display: flex;
|
|
135
|
+
align-items: center;
|
|
136
|
+
gap: 8px;
|
|
137
|
+
padding: 12px 16px;
|
|
138
|
+
min-height: 56px;
|
|
139
|
+
font: var(--vx-typography-inter-14-medium);
|
|
140
|
+
}
|
|
141
|
+
.studio-user-mark {
|
|
142
|
+
display: grid;
|
|
143
|
+
place-items: center;
|
|
144
|
+
width: 32px;
|
|
145
|
+
height: 32px;
|
|
146
|
+
border-radius: 50%;
|
|
147
|
+
background: var(--vx-surface-input) url("./assets/local-user-MIBWBA6X.png") center / cover no-repeat;
|
|
148
|
+
}
|
|
149
|
+
.studio-sidebar[data-collapsed=true] {
|
|
150
|
+
width: 56px;
|
|
151
|
+
}
|
|
152
|
+
.studio-sidebar[data-collapsed=true] .studio-logo {
|
|
153
|
+
justify-content: center;
|
|
154
|
+
padding-inline: 0;
|
|
155
|
+
}
|
|
156
|
+
.studio-sidebar[data-collapsed=true] :is(.studio-logo strong, nav > button > span:last-child, .studio-project-row > button > span:last-child, .studio-account > span:last-child) {
|
|
157
|
+
display: none;
|
|
158
|
+
}
|
|
159
|
+
.studio-sidebar[data-collapsed=true] nav h2 {
|
|
160
|
+
height: 24px;
|
|
161
|
+
padding: 4px;
|
|
162
|
+
font-size: 0;
|
|
163
|
+
border-bottom: var(--vx-divider-width) solid var(--vx-border-secondary);
|
|
164
|
+
}
|
|
165
|
+
.studio-sidebar[data-collapsed=true] .studio-account {
|
|
166
|
+
padding-inline: 12px;
|
|
167
|
+
}
|
|
168
|
+
.studio-content {
|
|
169
|
+
display: flex;
|
|
170
|
+
flex: 1;
|
|
171
|
+
flex-direction: column;
|
|
172
|
+
gap: 8px;
|
|
173
|
+
min-width: 0;
|
|
174
|
+
min-height: 0;
|
|
175
|
+
max-width: 1920px;
|
|
176
|
+
margin-inline: auto;
|
|
177
|
+
padding: 8px;
|
|
178
|
+
overflow: hidden;
|
|
179
|
+
}
|
|
180
|
+
.studio-page-header {
|
|
181
|
+
display: flex;
|
|
182
|
+
align-items: center;
|
|
183
|
+
gap: 10px;
|
|
184
|
+
height: 40px;
|
|
185
|
+
min-height: 40px;
|
|
186
|
+
padding: 4px 4px 4px 16px;
|
|
187
|
+
}
|
|
188
|
+
.studio-page-header h1 {
|
|
189
|
+
flex: 1;
|
|
190
|
+
min-width: 0;
|
|
191
|
+
overflow: hidden;
|
|
192
|
+
white-space: nowrap;
|
|
193
|
+
text-overflow: ellipsis;
|
|
194
|
+
font: var(--vx-typography-inter-18-semi-bold);
|
|
195
|
+
}
|
|
196
|
+
.studio-create-view.vx-button {
|
|
197
|
+
background: transparent;
|
|
198
|
+
color: var(--vx-state-success);
|
|
199
|
+
height: 28px;
|
|
200
|
+
padding: 4px 12px;
|
|
201
|
+
}
|
|
202
|
+
.studio-mobile-nav {
|
|
203
|
+
display: none;
|
|
204
|
+
}
|
|
205
|
+
.studio-page-panel {
|
|
206
|
+
display: flex;
|
|
207
|
+
flex-direction: column;
|
|
208
|
+
flex: 1;
|
|
209
|
+
min-height: 0;
|
|
210
|
+
min-width: 0;
|
|
211
|
+
border-radius: 16px;
|
|
212
|
+
overflow: hidden;
|
|
213
|
+
background: var(--vx-background-dialog);
|
|
214
|
+
}
|
|
215
|
+
.studio-toolbar {
|
|
216
|
+
display: flex;
|
|
217
|
+
align-items: center;
|
|
218
|
+
gap: 8px;
|
|
219
|
+
min-height: 56px;
|
|
220
|
+
padding: 0 16px;
|
|
221
|
+
border-bottom: var(--vx-divider-width) solid var(--vx-border-secondary);
|
|
222
|
+
flex: none;
|
|
223
|
+
}
|
|
224
|
+
.studio-view-tabs {
|
|
225
|
+
display: flex;
|
|
226
|
+
align-items: stretch;
|
|
227
|
+
flex: 1;
|
|
228
|
+
align-self: stretch;
|
|
229
|
+
min-width: 0;
|
|
230
|
+
overflow-x: auto;
|
|
231
|
+
gap: 4px;
|
|
232
|
+
}
|
|
233
|
+
.studio-view-tabs > .vx-button {
|
|
234
|
+
flex: none;
|
|
235
|
+
height: 100%;
|
|
236
|
+
padding: 0 12px;
|
|
237
|
+
border-radius: 0;
|
|
238
|
+
background: transparent;
|
|
239
|
+
border-bottom: 2px solid transparent;
|
|
240
|
+
color: var(--vx-text-secondary-readable);
|
|
241
|
+
}
|
|
242
|
+
.studio-view-tabs > .vx-button.active {
|
|
243
|
+
border-bottom-color: var(--vx-text-primary);
|
|
244
|
+
color: var(--vx-text-primary);
|
|
245
|
+
}
|
|
246
|
+
.studio-toolbar-controls,
|
|
247
|
+
.studio-bulk {
|
|
248
|
+
display: flex;
|
|
249
|
+
align-items: center;
|
|
250
|
+
gap: 8px;
|
|
251
|
+
flex: none;
|
|
252
|
+
}
|
|
253
|
+
.studio-toolbar-controls > .vx-button,
|
|
254
|
+
.studio-bulk > .vx-button {
|
|
255
|
+
background: transparent;
|
|
256
|
+
}
|
|
257
|
+
.studio-bulk > span {
|
|
258
|
+
color: var(--vx-text-secondary-readable);
|
|
259
|
+
white-space: nowrap;
|
|
260
|
+
}
|
|
261
|
+
.studio-results {
|
|
262
|
+
display: flex;
|
|
263
|
+
flex-direction: column;
|
|
264
|
+
flex: 1;
|
|
265
|
+
min-height: 0;
|
|
266
|
+
min-width: 0;
|
|
267
|
+
}
|
|
268
|
+
.studio-table-scroll {
|
|
269
|
+
display: flex;
|
|
270
|
+
flex-direction: column;
|
|
271
|
+
flex: 1;
|
|
272
|
+
overflow: auto;
|
|
273
|
+
min-height: 0;
|
|
274
|
+
}
|
|
275
|
+
.studio-table {
|
|
276
|
+
width: 100%;
|
|
277
|
+
min-width: 690px;
|
|
278
|
+
table-layout: fixed;
|
|
279
|
+
border-collapse: collapse;
|
|
280
|
+
}
|
|
281
|
+
.studio-table-assets {
|
|
282
|
+
min-width: 1200px;
|
|
283
|
+
}
|
|
284
|
+
.studio-table th,
|
|
285
|
+
.studio-table td {
|
|
286
|
+
padding: 12px 8px;
|
|
287
|
+
text-align: left;
|
|
288
|
+
border-bottom: var(--vx-divider-width) solid var(--vx-border-secondary);
|
|
289
|
+
vertical-align: middle;
|
|
290
|
+
overflow-wrap: anywhere;
|
|
291
|
+
}
|
|
292
|
+
.studio-table th {
|
|
293
|
+
height: 44px;
|
|
294
|
+
padding-block: 8px;
|
|
295
|
+
color: var(--vx-text-secondary-readable);
|
|
296
|
+
font: var(--vx-typography-inter-12-regular);
|
|
297
|
+
}
|
|
298
|
+
.studio-table :is(th, td):first-child {
|
|
299
|
+
padding-left: 16px;
|
|
300
|
+
}
|
|
301
|
+
.studio-table :is(th, td):last-child {
|
|
302
|
+
padding-right: 16px;
|
|
303
|
+
}
|
|
304
|
+
.studio-table tr:focus-within,
|
|
305
|
+
.studio-table tbody tr:hover {
|
|
306
|
+
background: var(--vx-surface-hover);
|
|
307
|
+
}
|
|
308
|
+
.studio-row-name.vx-button {
|
|
309
|
+
height: auto;
|
|
310
|
+
padding: 0;
|
|
311
|
+
background: transparent;
|
|
312
|
+
max-width: 100%;
|
|
313
|
+
text-align: left;
|
|
314
|
+
}
|
|
315
|
+
.studio-row-name .vx-button-label {
|
|
316
|
+
white-space: normal;
|
|
317
|
+
font: var(--vx-typography-inter-14-regular);
|
|
318
|
+
}
|
|
319
|
+
.studio-cell-text {
|
|
320
|
+
display: -webkit-box;
|
|
321
|
+
-webkit-line-clamp: 2;
|
|
322
|
+
-webkit-box-orient: vertical;
|
|
323
|
+
overflow: hidden;
|
|
324
|
+
}
|
|
325
|
+
.studio-cover {
|
|
326
|
+
position: relative;
|
|
327
|
+
}
|
|
328
|
+
.studio-table .studio-cover {
|
|
329
|
+
width: 114px;
|
|
330
|
+
height: 64px;
|
|
331
|
+
max-width: 100%;
|
|
332
|
+
}
|
|
333
|
+
.studio-cover > .vx-media {
|
|
334
|
+
width: 100%;
|
|
335
|
+
height: 100%;
|
|
336
|
+
border-radius: 8px;
|
|
337
|
+
}
|
|
338
|
+
.studio-cover-video {
|
|
339
|
+
position: absolute;
|
|
340
|
+
inset: 0;
|
|
341
|
+
width: 100%;
|
|
342
|
+
height: 100%;
|
|
343
|
+
object-fit: contain;
|
|
344
|
+
border-radius: 8px;
|
|
345
|
+
pointer-events: none;
|
|
346
|
+
}
|
|
347
|
+
.studio-cover[data-kind=video] > .vx-media {
|
|
348
|
+
position: relative;
|
|
349
|
+
z-index: 1;
|
|
350
|
+
background: transparent;
|
|
351
|
+
}
|
|
352
|
+
.studio-cover-placeholder {
|
|
353
|
+
position: absolute;
|
|
354
|
+
inset: 0;
|
|
355
|
+
display: grid;
|
|
356
|
+
place-items: center;
|
|
357
|
+
pointer-events: none;
|
|
358
|
+
color: var(--vx-icon-secondary);
|
|
359
|
+
}
|
|
360
|
+
.studio-cover-placeholder > .studio-glyph {
|
|
361
|
+
width: 24px;
|
|
362
|
+
height: 24px;
|
|
363
|
+
}
|
|
364
|
+
.studio-categories {
|
|
365
|
+
display: flex;
|
|
366
|
+
gap: 4px;
|
|
367
|
+
flex-wrap: wrap;
|
|
368
|
+
}
|
|
369
|
+
.studio-task-state {
|
|
370
|
+
display: inline-flex;
|
|
371
|
+
align-items: center;
|
|
372
|
+
gap: 4px;
|
|
373
|
+
white-space: nowrap;
|
|
374
|
+
}
|
|
375
|
+
.studio-task-state::before {
|
|
376
|
+
content: "";
|
|
377
|
+
width: 8px;
|
|
378
|
+
height: 8px;
|
|
379
|
+
border-radius: 50%;
|
|
380
|
+
background: var(--vx-text-secondary);
|
|
381
|
+
}
|
|
382
|
+
.studio-task-state[data-state=succeeded] {
|
|
383
|
+
color: var(--vx-state-success);
|
|
384
|
+
}
|
|
385
|
+
.studio-task-state[data-state=succeeded]::before {
|
|
386
|
+
background: var(--vx-state-success);
|
|
387
|
+
}
|
|
388
|
+
.studio-task-state:is([data-state=failed], [data-state=save_failed]) {
|
|
389
|
+
color: var(--vx-state-danger);
|
|
390
|
+
}
|
|
391
|
+
.studio-task-state:is([data-state=failed], [data-state=save_failed])::before {
|
|
392
|
+
background: var(--vx-state-danger);
|
|
393
|
+
}
|
|
394
|
+
.studio-task-state:is([data-state=running], [data-state=queued], [data-state=saving])::before {
|
|
395
|
+
background: var(--vx-state-assistance);
|
|
396
|
+
}
|
|
397
|
+
.studio-grid {
|
|
398
|
+
display: grid;
|
|
399
|
+
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
|
400
|
+
align-content: start;
|
|
401
|
+
gap: 16px;
|
|
402
|
+
padding: 16px;
|
|
403
|
+
overflow: auto;
|
|
404
|
+
min-height: 0;
|
|
405
|
+
flex: 1;
|
|
406
|
+
}
|
|
407
|
+
.studio-card {
|
|
408
|
+
display: flex;
|
|
409
|
+
flex-direction: column;
|
|
410
|
+
gap: 8px;
|
|
411
|
+
min-width: 0;
|
|
412
|
+
padding: 4px 4px 10px;
|
|
413
|
+
border-radius: 12px;
|
|
414
|
+
background: var(--vx-background-dialog);
|
|
415
|
+
}
|
|
416
|
+
.studio-card-heading {
|
|
417
|
+
display: flex;
|
|
418
|
+
align-items: center;
|
|
419
|
+
gap: 8px;
|
|
420
|
+
padding: 0 8px;
|
|
421
|
+
}
|
|
422
|
+
.studio-card-heading > .studio-row-name {
|
|
423
|
+
flex: 1;
|
|
424
|
+
min-width: 0;
|
|
425
|
+
}
|
|
426
|
+
.studio-card-heading .studio-row-name .vx-button-label {
|
|
427
|
+
font: var(--vx-typography-inter-14-semi-bold);
|
|
428
|
+
white-space: nowrap;
|
|
429
|
+
overflow: hidden;
|
|
430
|
+
text-overflow: ellipsis;
|
|
431
|
+
}
|
|
432
|
+
.studio-card-subtitle {
|
|
433
|
+
min-height: 16px;
|
|
434
|
+
padding: 0 8px;
|
|
435
|
+
margin-top: -6px;
|
|
436
|
+
color: var(--vx-text-secondary);
|
|
437
|
+
font: var(--vx-typography-inter-12-regular);
|
|
438
|
+
}
|
|
439
|
+
.studio-card-heading > .vx-action-menu > .vx-button,
|
|
440
|
+
.studio-table td:last-child > .vx-action-menu > .vx-button {
|
|
441
|
+
width: 24px;
|
|
442
|
+
height: 24px;
|
|
443
|
+
padding: 0;
|
|
444
|
+
background: transparent;
|
|
445
|
+
}
|
|
446
|
+
.studio-card-heading > .vx-action-menu > .vx-button .vx-button-label,
|
|
447
|
+
.studio-card-heading > .vx-action-menu > .vx-button .vx-button-trailing,
|
|
448
|
+
.studio-table td:last-child > .vx-action-menu > .vx-button .vx-button-label,
|
|
449
|
+
.studio-table td:last-child > .vx-action-menu > .vx-button .vx-button-trailing {
|
|
450
|
+
display: none;
|
|
451
|
+
}
|
|
452
|
+
.studio-card-heading > .vx-action-menu > .vx-button::after,
|
|
453
|
+
.studio-table td:last-child > .vx-action-menu > .vx-button::after {
|
|
454
|
+
content: "\b7\b7\b7";
|
|
455
|
+
position: absolute;
|
|
456
|
+
font-size: 18px;
|
|
457
|
+
line-height: 1;
|
|
458
|
+
}
|
|
459
|
+
.studio-table td:last-child {
|
|
460
|
+
text-align: right;
|
|
461
|
+
}
|
|
462
|
+
@media (hover: hover) {
|
|
463
|
+
.studio-card:not(:hover):not(:focus-within) .studio-card-heading > .vx-action-menu:not(:has([aria-expanded=true])) {
|
|
464
|
+
opacity: 0;
|
|
465
|
+
}
|
|
466
|
+
}
|
|
467
|
+
.studio-card > .studio-cover {
|
|
468
|
+
aspect-ratio: 16/9;
|
|
469
|
+
}
|
|
470
|
+
.studio-card dl {
|
|
471
|
+
display: flex;
|
|
472
|
+
flex-direction: column;
|
|
473
|
+
gap: 6px;
|
|
474
|
+
margin: 0;
|
|
475
|
+
}
|
|
476
|
+
.studio-card dl > div {
|
|
477
|
+
display: flex;
|
|
478
|
+
gap: 8px;
|
|
479
|
+
font: var(--vx-typography-inter-12-regular);
|
|
480
|
+
}
|
|
481
|
+
.studio-card dt {
|
|
482
|
+
color: var(--vx-text-secondary-readable);
|
|
483
|
+
flex: 0 0 34%;
|
|
484
|
+
}
|
|
485
|
+
.studio-card dd {
|
|
486
|
+
margin: 0;
|
|
487
|
+
overflow: hidden;
|
|
488
|
+
overflow-wrap: anywhere;
|
|
489
|
+
}
|
|
490
|
+
.studio-card > .vx-action-menu {
|
|
491
|
+
align-self: flex-end;
|
|
492
|
+
}
|
|
493
|
+
.studio-empty {
|
|
494
|
+
display: grid;
|
|
495
|
+
place-items: center;
|
|
496
|
+
flex: 1;
|
|
497
|
+
width: 100%;
|
|
498
|
+
min-height: 160px;
|
|
499
|
+
color: var(--vx-text-secondary-readable);
|
|
500
|
+
text-align: center;
|
|
501
|
+
}
|
|
502
|
+
.studio-grid > .studio-empty {
|
|
503
|
+
grid-column: 1/-1;
|
|
504
|
+
min-height: 200px;
|
|
505
|
+
}
|
|
506
|
+
.studio-feedback {
|
|
507
|
+
display: flex;
|
|
508
|
+
align-items: center;
|
|
509
|
+
justify-content: space-between;
|
|
510
|
+
gap: 12px;
|
|
511
|
+
padding: 8px 16px;
|
|
512
|
+
background: var(--vx-surface-input);
|
|
513
|
+
border-radius: 8px;
|
|
514
|
+
overflow-wrap: anywhere;
|
|
515
|
+
flex: none;
|
|
516
|
+
}
|
|
517
|
+
.studio-error {
|
|
518
|
+
color: var(--vx-state-danger);
|
|
519
|
+
}
|
|
520
|
+
.studio-pagination {
|
|
521
|
+
display: flex;
|
|
522
|
+
align-items: center;
|
|
523
|
+
justify-content: center;
|
|
524
|
+
gap: 16px;
|
|
525
|
+
border-top: var(--vx-divider-width) solid var(--vx-border-secondary);
|
|
526
|
+
padding: 8px;
|
|
527
|
+
flex: none;
|
|
528
|
+
}
|
|
529
|
+
.studio-shell[data-detail] > .studio-sidebar,
|
|
530
|
+
.studio-shell[data-detail] > .studio-content > .studio-page-header,
|
|
531
|
+
.studio-shell[data-detail] > .studio-content > .studio-mobile-nav {
|
|
532
|
+
display: none;
|
|
533
|
+
}
|
|
534
|
+
.studio-shell[data-detail] > .studio-content {
|
|
535
|
+
padding: 0;
|
|
536
|
+
gap: 0;
|
|
537
|
+
}
|
|
538
|
+
.studio-shell[data-detail] .studio-asset-detail {
|
|
539
|
+
border-radius: 0;
|
|
540
|
+
}
|
|
541
|
+
.studio-asset-detail {
|
|
542
|
+
display: flex;
|
|
543
|
+
flex: 1;
|
|
544
|
+
min-width: 0;
|
|
545
|
+
min-height: 0;
|
|
546
|
+
border-radius: 16px;
|
|
547
|
+
overflow: hidden;
|
|
548
|
+
background: var(--vx-background-dialog);
|
|
549
|
+
}
|
|
550
|
+
.studio-preview-stage {
|
|
551
|
+
display: flex;
|
|
552
|
+
flex: 1;
|
|
553
|
+
position: relative;
|
|
554
|
+
min-width: 0;
|
|
555
|
+
min-height: 0;
|
|
556
|
+
align-items: center;
|
|
557
|
+
justify-content: center;
|
|
558
|
+
padding: 64px 24px;
|
|
559
|
+
}
|
|
560
|
+
.studio-preview-stage > img,
|
|
561
|
+
.studio-preview-stage > video {
|
|
562
|
+
object-fit: contain;
|
|
563
|
+
max-width: 100%;
|
|
564
|
+
max-height: 100%;
|
|
565
|
+
width: min(960px, 100%);
|
|
566
|
+
border-radius: 4px;
|
|
567
|
+
}
|
|
568
|
+
.studio-preview-stage > audio {
|
|
569
|
+
max-width: 100%;
|
|
570
|
+
}
|
|
571
|
+
.studio-detail-back.vx-button {
|
|
572
|
+
position: absolute;
|
|
573
|
+
top: 12px;
|
|
574
|
+
left: 15px;
|
|
575
|
+
background: var(--vx-background-dialog);
|
|
576
|
+
color: var(--vx-text-primary);
|
|
577
|
+
}
|
|
578
|
+
.studio-preview-actions {
|
|
579
|
+
display: flex;
|
|
580
|
+
align-items: center;
|
|
581
|
+
gap: 8px;
|
|
582
|
+
position: absolute;
|
|
583
|
+
top: 12px;
|
|
584
|
+
right: 12px;
|
|
585
|
+
}
|
|
586
|
+
.studio-preview-actions > .vx-button {
|
|
587
|
+
background: var(--vx-background-dialog);
|
|
588
|
+
color: var(--vx-text-primary);
|
|
589
|
+
}
|
|
590
|
+
.studio-favorite {
|
|
591
|
+
display: grid;
|
|
592
|
+
place-items: center;
|
|
593
|
+
width: 32px;
|
|
594
|
+
height: 32px;
|
|
595
|
+
border: 0;
|
|
596
|
+
border-radius: 50%;
|
|
597
|
+
background: var(--vx-background-dialog);
|
|
598
|
+
color: var(--vx-text-primary);
|
|
599
|
+
cursor: pointer;
|
|
600
|
+
}
|
|
601
|
+
.studio-favorite .studio-glyph {
|
|
602
|
+
width: 14px;
|
|
603
|
+
height: 16px;
|
|
604
|
+
}
|
|
605
|
+
.studio-favorite[aria-pressed=true] {
|
|
606
|
+
color: var(--vx-state-success);
|
|
607
|
+
background: var(--vx-surface-selected);
|
|
608
|
+
}
|
|
609
|
+
.studio-preview-details {
|
|
610
|
+
width: 320px;
|
|
611
|
+
flex: none;
|
|
612
|
+
display: flex;
|
|
613
|
+
flex-direction: column;
|
|
614
|
+
gap: 24px;
|
|
615
|
+
padding: 24px 16px;
|
|
616
|
+
border-left: var(--vx-divider-width) solid var(--vx-border-secondary);
|
|
617
|
+
overflow-y: auto;
|
|
618
|
+
overflow-wrap: anywhere;
|
|
619
|
+
}
|
|
620
|
+
.studio-preview-details h2 {
|
|
621
|
+
font: var(--vx-typography-inter-16-semi-bold);
|
|
622
|
+
}
|
|
623
|
+
.studio-detail-group {
|
|
624
|
+
display: flex;
|
|
625
|
+
flex-direction: column;
|
|
626
|
+
gap: 8px;
|
|
627
|
+
}
|
|
628
|
+
.studio-detail-group > span:first-child {
|
|
629
|
+
color: var(--vx-text-secondary-readable);
|
|
630
|
+
}
|
|
631
|
+
.studio-detail-group p {
|
|
632
|
+
white-space: pre-wrap;
|
|
633
|
+
}
|
|
634
|
+
.studio-detail-group pre {
|
|
635
|
+
margin: 0;
|
|
636
|
+
white-space: pre-wrap;
|
|
637
|
+
overflow-wrap: anywhere;
|
|
638
|
+
font: var(--vx-typography-inter-12-regular);
|
|
639
|
+
}
|
|
640
|
+
.studio-detail-group > .vx-button {
|
|
641
|
+
align-self: flex-start;
|
|
642
|
+
padding: 0;
|
|
643
|
+
height: auto;
|
|
644
|
+
color: var(--vx-state-success);
|
|
645
|
+
}
|
|
646
|
+
.studio-prompt {
|
|
647
|
+
display: -webkit-box;
|
|
648
|
+
-webkit-line-clamp: 4;
|
|
649
|
+
-webkit-box-orient: vertical;
|
|
650
|
+
overflow: hidden;
|
|
651
|
+
}
|
|
652
|
+
.studio-prompt[data-expanded=true] {
|
|
653
|
+
display: block;
|
|
654
|
+
}
|
|
655
|
+
.studio-text-preview {
|
|
656
|
+
white-space: pre-wrap;
|
|
657
|
+
overflow-wrap: anywhere;
|
|
658
|
+
max-width: 100%;
|
|
659
|
+
max-height: 100%;
|
|
660
|
+
overflow: auto;
|
|
661
|
+
margin: 0;
|
|
662
|
+
}
|
|
663
|
+
.studio-reference-list {
|
|
664
|
+
display: flex;
|
|
665
|
+
flex-direction: column;
|
|
666
|
+
align-items: flex-start;
|
|
667
|
+
gap: 8px;
|
|
668
|
+
}
|
|
669
|
+
.studio-reference-list .vx-button {
|
|
670
|
+
max-width: 100%;
|
|
671
|
+
}
|
|
672
|
+
.studio-view-form {
|
|
673
|
+
display: flex;
|
|
674
|
+
flex-direction: column;
|
|
675
|
+
gap: 16px;
|
|
676
|
+
}
|
|
677
|
+
.studio-view-form fieldset {
|
|
678
|
+
display: grid;
|
|
679
|
+
grid-template-columns: repeat(auto-fit, minmax(min(100%, 132px), 1fr));
|
|
680
|
+
gap: 10px 16px;
|
|
681
|
+
margin: 0;
|
|
682
|
+
padding: 12px;
|
|
683
|
+
border: 1px solid var(--vx-border-secondary);
|
|
684
|
+
border-radius: 8px;
|
|
685
|
+
min-width: 0;
|
|
686
|
+
}
|
|
687
|
+
.studio-view-form legend {
|
|
688
|
+
padding-inline: 4px;
|
|
689
|
+
}
|
|
690
|
+
.studio-view-form p {
|
|
691
|
+
margin: 0;
|
|
692
|
+
color: var(--vx-text-secondary-readable);
|
|
693
|
+
}
|
|
694
|
+
.studio-view-form [role=alert] {
|
|
695
|
+
color: var(--vx-state-danger);
|
|
696
|
+
}
|
|
697
|
+
.studio-global :is(button, a, textarea, summary):focus-visible {
|
|
698
|
+
outline: 2px solid var(--vx-state-assistance);
|
|
699
|
+
outline-offset: 2px;
|
|
700
|
+
}
|
|
701
|
+
@media (max-width: 1100px) {
|
|
702
|
+
.studio-toolbar {
|
|
703
|
+
flex-wrap: wrap;
|
|
704
|
+
gap: 8px;
|
|
705
|
+
padding-block: 8px;
|
|
706
|
+
}
|
|
707
|
+
.studio-view-tabs {
|
|
708
|
+
min-height: 40px;
|
|
709
|
+
}
|
|
710
|
+
.studio-toolbar-controls,
|
|
711
|
+
.studio-bulk {
|
|
712
|
+
flex-wrap: wrap;
|
|
713
|
+
}
|
|
714
|
+
.studio-page-header h1 {
|
|
715
|
+
font: var(--vx-typography-inter-14-semi-bold);
|
|
716
|
+
}
|
|
717
|
+
}
|
|
718
|
+
@media (max-width: 760px) {
|
|
719
|
+
.studio-shell {
|
|
720
|
+
min-height: 100dvh;
|
|
721
|
+
height: auto;
|
|
722
|
+
}
|
|
723
|
+
.studio-sidebar {
|
|
724
|
+
display: none;
|
|
725
|
+
}
|
|
726
|
+
.studio-content {
|
|
727
|
+
overflow: visible;
|
|
728
|
+
padding: 8px 16px;
|
|
729
|
+
}
|
|
730
|
+
.studio-mobile-nav {
|
|
731
|
+
display: block;
|
|
732
|
+
}
|
|
733
|
+
.studio-page-header {
|
|
734
|
+
padding-left: 4px;
|
|
735
|
+
flex-wrap: wrap;
|
|
736
|
+
height: auto;
|
|
737
|
+
min-height: 40px;
|
|
738
|
+
}
|
|
739
|
+
.studio-page-header h1 {
|
|
740
|
+
flex: 1 1 120px;
|
|
741
|
+
}
|
|
742
|
+
.studio-create-view.vx-button {
|
|
743
|
+
padding-inline: 4px;
|
|
744
|
+
}
|
|
745
|
+
.studio-toolbar {
|
|
746
|
+
padding: 0 12px 8px;
|
|
747
|
+
}
|
|
748
|
+
.studio-view-tabs {
|
|
749
|
+
flex-basis: 100%;
|
|
750
|
+
min-height: 56px;
|
|
751
|
+
}
|
|
752
|
+
.studio-toolbar-controls,
|
|
753
|
+
.studio-bulk {
|
|
754
|
+
flex-wrap: wrap;
|
|
755
|
+
width: 100%;
|
|
756
|
+
gap: 6px;
|
|
757
|
+
}
|
|
758
|
+
.studio-page-panel {
|
|
759
|
+
min-height: 60dvh;
|
|
760
|
+
}
|
|
761
|
+
.studio-table-scroll {
|
|
762
|
+
max-height: 70dvh;
|
|
763
|
+
}
|
|
764
|
+
.studio-grid {
|
|
765
|
+
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
|
|
766
|
+
}
|
|
767
|
+
.studio-asset-detail {
|
|
768
|
+
flex-direction: column;
|
|
769
|
+
overflow: visible;
|
|
770
|
+
}
|
|
771
|
+
.studio-preview-stage {
|
|
772
|
+
height: 45dvh;
|
|
773
|
+
min-height: 280px;
|
|
774
|
+
padding: 64px 16px 24px;
|
|
775
|
+
flex: none;
|
|
776
|
+
}
|
|
777
|
+
.studio-preview-details {
|
|
778
|
+
width: 100%;
|
|
779
|
+
overflow: visible;
|
|
780
|
+
border-left: 0;
|
|
781
|
+
border-top: var(--vx-divider-width) solid var(--vx-border-secondary);
|
|
782
|
+
}
|
|
783
|
+
}
|
|
784
|
+
@media (prefers-reduced-motion: reduce) {
|
|
785
|
+
.studio-global * {
|
|
786
|
+
scroll-behavior: auto;
|
|
787
|
+
}
|
|
788
|
+
}
|
|
789
|
+
.studio-shell[data-project] > .studio-content {
|
|
790
|
+
padding: 0;
|
|
791
|
+
gap: 0;
|
|
792
|
+
}
|
|
793
|
+
.studio-project-frame {
|
|
794
|
+
flex: 1;
|
|
795
|
+
width: 100%;
|
|
796
|
+
min-height: 0;
|
|
797
|
+
border: 0;
|
|
798
|
+
color-scheme: normal;
|
|
799
|
+
}
|
|
800
|
+
.studio-project-group,
|
|
801
|
+
.studio-project-pages {
|
|
802
|
+
display: grid;
|
|
803
|
+
gap: 2px;
|
|
804
|
+
}
|
|
805
|
+
.studio-project-row {
|
|
806
|
+
position: relative;
|
|
807
|
+
display: grid;
|
|
808
|
+
grid-template-columns: minmax(0, 1fr);
|
|
809
|
+
}
|
|
810
|
+
.studio-sidebar .studio-project-row:has(.studio-project-actions) > button {
|
|
811
|
+
padding-inline-end: var(--vx-space-32);
|
|
812
|
+
}
|
|
813
|
+
.studio-project-actions {
|
|
814
|
+
position: absolute;
|
|
815
|
+
inset-inline-end: var(--vx-space-4);
|
|
816
|
+
inset-block-start: 50%;
|
|
817
|
+
translate: 0 -50%;
|
|
818
|
+
opacity: 0;
|
|
819
|
+
pointer-events: none;
|
|
820
|
+
}
|
|
821
|
+
.studio-project-row:is(:hover, :focus-within, [data-active]) .studio-project-actions {
|
|
822
|
+
opacity: 1;
|
|
823
|
+
pointer-events: auto;
|
|
824
|
+
}
|
|
825
|
+
@media (hover: none) {
|
|
826
|
+
.studio-project-actions {
|
|
827
|
+
opacity: 1;
|
|
828
|
+
pointer-events: auto;
|
|
829
|
+
}
|
|
830
|
+
}
|
|
831
|
+
.studio-project-pages {
|
|
832
|
+
margin-inline-start: var(--vx-space-16);
|
|
833
|
+
padding-inline-start: var(--vx-space-12);
|
|
834
|
+
border-inline-start: var(--vx-divider-width) solid var(--vx-border-secondary);
|
|
835
|
+
}
|
|
836
|
+
.studio-sidebar .studio-project-pages > .studio-project-tab {
|
|
837
|
+
padding-inline: var(--vx-space-8);
|
|
838
|
+
font: var(--vx-typography-inter-14-regular);
|
|
839
|
+
color: var(--vx-text-secondary-readable);
|
|
840
|
+
}
|
|
841
|
+
.studio-sidebar .studio-project-pages > .studio-project-tab[aria-current=page] {
|
|
842
|
+
color: var(--vx-text-primary);
|
|
843
|
+
font: var(--vx-typography-inter-14-medium);
|
|
844
|
+
}
|
|
845
|
+
@media (max-width: 760px) {
|
|
846
|
+
.studio-shell[data-project] {
|
|
847
|
+
height: 100dvh;
|
|
848
|
+
}
|
|
849
|
+
.studio-shell[data-project] .studio-mobile-nav {
|
|
850
|
+
padding: 8px 12px;
|
|
851
|
+
}
|
|
852
|
+
}
|
|
853
|
+
.studio-sidebar nav > button > .studio-nav-icon {
|
|
854
|
+
display: grid;
|
|
855
|
+
place-items: center;
|
|
856
|
+
flex: 0 0 24px;
|
|
857
|
+
inline-size: 24px;
|
|
858
|
+
block-size: 24px;
|
|
859
|
+
}
|
|
860
|
+
.studio-nav-icon::before {
|
|
861
|
+
content: "";
|
|
862
|
+
inline-size: 20px;
|
|
863
|
+
block-size: 20px;
|
|
864
|
+
background: currentColor;
|
|
865
|
+
mask: var(--studio-nav-mask) center / contain no-repeat;
|
|
866
|
+
}
|
|
867
|
+
.studio-nav-icon[data-icon=home] {
|
|
868
|
+
--studio-nav-mask: url("./assets/nav-home-BMDOUQGN.svg");
|
|
869
|
+
}
|
|
870
|
+
.studio-nav-icon[data-icon=projects] {
|
|
871
|
+
--studio-nav-mask: url("./assets/nav-projects-N5UV3GAG.svg");
|
|
872
|
+
}
|
|
873
|
+
.studio-nav-icon[data-icon=assets] {
|
|
874
|
+
--studio-nav-mask: url("./assets/nav-assets-35EAQZQX.svg");
|
|
875
|
+
}
|
|
876
|
+
.studio-nav-icon[data-icon=tasks] {
|
|
877
|
+
--studio-nav-mask: url("./assets/nav-queue-2I5E65F4.svg");
|
|
878
|
+
}
|
|
879
|
+
.studio-project-caption {
|
|
880
|
+
display: flex;
|
|
881
|
+
align-items: center;
|
|
882
|
+
gap: var(--vx-space-8);
|
|
883
|
+
min-inline-size: 0;
|
|
884
|
+
}
|
|
885
|
+
.studio-project-caption > span {
|
|
886
|
+
overflow: hidden;
|
|
887
|
+
text-overflow: ellipsis;
|
|
888
|
+
}
|
|
889
|
+
.studio-sample-label {
|
|
890
|
+
flex: none;
|
|
891
|
+
border-radius: 3px;
|
|
892
|
+
padding: 1px 4px;
|
|
893
|
+
background: var(--vx-surface-input);
|
|
894
|
+
color: var(--vx-text-secondary-readable);
|
|
895
|
+
font: var(--vx-typography-inter-12-medium);
|
|
896
|
+
}
|
|
@@ -0,0 +1,272 @@
|
|
|
1
|
+
// packages/studio-workbench/src/query-results.tsx
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
|
|
4
|
+
// packages/ui-system/dist/button.js
|
|
5
|
+
import { jsx as _jsx2, jsxs as _jsxs } from "react/jsx-runtime";
|
|
6
|
+
|
|
7
|
+
// packages/ui-system/dist/icon.js
|
|
8
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
|
+
function Icon({ name, size }) {
|
|
10
|
+
return _jsx("span", { "aria-hidden": "true", className: "vx-icon", "data-icon": name, style: size === void 0 ? void 0 : { "--vx-icon-size": `${size}px` } });
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
// packages/ui-system/dist/button-variants.js
|
|
14
|
+
var buttonVariants = {
|
|
15
|
+
"text-filled-sm": { size: 32, appearance: "filled", shape: "text", width: 215 },
|
|
16
|
+
"text-filled-leading-sm": { size: 32, appearance: "filled", shape: "text" },
|
|
17
|
+
"text-ghost-sm": { size: 32, appearance: "ghost", shape: "text" },
|
|
18
|
+
"text-on-content-sm": { size: 32, appearance: "on-content", shape: "text" },
|
|
19
|
+
"text-tonal-sm": { size: 32, appearance: "tonal", shape: "text" },
|
|
20
|
+
// The medium recipes are shared by all dialog footer actions.
|
|
21
|
+
"text-filled-md": { size: 40, appearance: "filled", shape: "text" },
|
|
22
|
+
"text-tonal-md": { size: 40, appearance: "tonal", shape: "text" },
|
|
23
|
+
"text-ghost-md": { size: 40, appearance: "ghost", shape: "text" },
|
|
24
|
+
"icon-ghost-md": { size: 40, appearance: "ghost", shape: "icon" },
|
|
25
|
+
"text-filled-lg": { size: 44, appearance: "filled", shape: "text", width: 412 },
|
|
26
|
+
"text-tonal-lg": { size: 44, appearance: "tonal", shape: "text", width: 412 },
|
|
27
|
+
"text-outline-lg": {
|
|
28
|
+
size: 44,
|
|
29
|
+
appearance: "outline",
|
|
30
|
+
shape: "text",
|
|
31
|
+
width: 412
|
|
32
|
+
},
|
|
33
|
+
"pill-filled": { size: 44, appearance: "filled", shape: "pill" },
|
|
34
|
+
"pill-plain": { size: 48, appearance: "plain", shape: "pill" },
|
|
35
|
+
"pill-small": { size: 32, appearance: "plain", shape: "pill" },
|
|
36
|
+
"icon-outline-sm": { size: 32, appearance: "outline", shape: "icon" },
|
|
37
|
+
"icon-on-content": { size: 24, appearance: "on-content", shape: "icon" },
|
|
38
|
+
"icon-outline-lg": { size: 48, appearance: "outline", shape: "icon" },
|
|
39
|
+
// Compact bare action: reuse the transparent/default and surface-hover ghost treatment.
|
|
40
|
+
"icon-bare-xs": { size: 24, appearance: "ghost", shape: "icon" },
|
|
41
|
+
"icon-ghost-sm": { size: 32, appearance: "ghost", shape: "icon" },
|
|
42
|
+
"icon-ghost-lg": { size: 48, appearance: "ghost", shape: "icon" },
|
|
43
|
+
"icon-circle-sm": { size: 32, appearance: "filled", shape: "circle" },
|
|
44
|
+
"icon-circle-lg": { size: 44, appearance: "filled", shape: "circle" }
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
// packages/ui-system/dist/button.js
|
|
48
|
+
function ButtonFrame({ label, variant, loading = false, width, children, disabled, type = "button", style, className, ...props }) {
|
|
49
|
+
const spec = buttonVariants[variant];
|
|
50
|
+
const buttonStyle = "width" in spec ? { ...style, "--vx-button-width": `${spec.width}px` } : style;
|
|
51
|
+
return _jsxs("button", { ...props, type, className: className ? `vx-button ${className}` : "vx-button", "data-variant": variant, "data-appearance": spec.appearance, "data-shape": spec.shape, "data-size": spec.size, "data-width": width, "data-state": loading ? "loading" : disabled ? "disabled" : "default", style: buttonStyle, disabled: disabled || loading, "aria-label": label, "aria-busy": loading || void 0, children: [_jsx2("span", { className: "vx-button-content", children }), loading && _jsx2("span", { className: "vx-button-loading", "aria-hidden": "true" })] });
|
|
52
|
+
}
|
|
53
|
+
function Button({ variant = "text-filled-sm", leadingIcon, trailingIcon, ...props }) {
|
|
54
|
+
return _jsxs(ButtonFrame, { ...props, variant, children: [leadingIcon && _jsx2(Icon, { name: leadingIcon }), _jsx2("span", { className: "vx-button-label", children: props.label }), trailingIcon && _jsx2("span", { className: "vx-button-trailing", children: _jsx2(Icon, { name: trailingIcon }) })] });
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
// packages/ui-system/dist/checkbox.js
|
|
58
|
+
import { jsx as _jsx3, jsxs as _jsxs2 } from "react/jsx-runtime";
|
|
59
|
+
function Checkbox({ label, checked, onCheckedChange, hideLabel = false, appearance = "default", ...props }) {
|
|
60
|
+
return _jsxs2("label", { className: "vx-checkbox", "data-appearance": appearance, "data-label-hidden": hideLabel || void 0, children: [_jsx3("input", { ...props, className: "vx-checkbox-input", type: "checkbox", "aria-label": hideLabel ? label : void 0, checked, onChange: (event) => onCheckedChange(event.currentTarget.checked) }), _jsx3("span", { className: "vx-checkbox-mark", "aria-hidden": "true", children: _jsx3(Icon, { name: appearance === "on-content" ? "check-on-content" : "check" }) }), !hideLabel && label] });
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
// packages/studio-workbench/src/query-view.ts
|
|
64
|
+
import { z } from "vivix-studio/sdk/shared";
|
|
65
|
+
var pageSources = ["projects", "assets", "tasks"];
|
|
66
|
+
var pageTitles = {
|
|
67
|
+
projects: "Manage Projects",
|
|
68
|
+
assets: "Global Asset",
|
|
69
|
+
tasks: "Generation Queue"
|
|
70
|
+
};
|
|
71
|
+
var columnName = z.string().min(1).max(200).refine((value) => !/[\u0000-\u001f]/.test(value));
|
|
72
|
+
var scalar = z.union([z.null(), z.string(), z.number().finite()]);
|
|
73
|
+
var customViewSchema = z.object({
|
|
74
|
+
source: z.enum(pageSources),
|
|
75
|
+
projectId: z.uuid().optional(),
|
|
76
|
+
name: z.string().trim().min(1).max(120),
|
|
77
|
+
sql: z.string().trim().min(1).max(32e3),
|
|
78
|
+
params: z.union([z.array(scalar), z.record(z.string(), scalar)]).default([]),
|
|
79
|
+
columns: z.array(
|
|
80
|
+
z.object({
|
|
81
|
+
path: columnName,
|
|
82
|
+
label: z.string().min(1).max(120).optional(),
|
|
83
|
+
width: z.number().int().min(80).max(600).default(140),
|
|
84
|
+
visible: z.boolean().default(true),
|
|
85
|
+
format: z.enum(["text", "categories", "date", "json"]).default("text"),
|
|
86
|
+
role: z.enum(["name", "preview", "state", "project"]).optional()
|
|
87
|
+
}).strict()
|
|
88
|
+
).min(1).max(60).refine(
|
|
89
|
+
(columns) => new Set(columns.map((c) => c.path)).size === columns.length,
|
|
90
|
+
"Column names must be unique."
|
|
91
|
+
),
|
|
92
|
+
identity: z.object({
|
|
93
|
+
row: columnName.default("rowId"),
|
|
94
|
+
project: columnName.default("projectId"),
|
|
95
|
+
ref: columnName.default("ref"),
|
|
96
|
+
outputs: columnName.default("outputRefs")
|
|
97
|
+
}).strict().default({ row: "rowId", project: "projectId", ref: "ref", outputs: "outputRefs" })
|
|
98
|
+
}).strict();
|
|
99
|
+
function decodeRef(value) {
|
|
100
|
+
let item = value;
|
|
101
|
+
if (typeof item === "string") {
|
|
102
|
+
try {
|
|
103
|
+
item = JSON.parse(item);
|
|
104
|
+
} catch {
|
|
105
|
+
return null;
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
if (!item || typeof item !== "object" || Array.isArray(item)) return null;
|
|
109
|
+
const ref = item;
|
|
110
|
+
return ["storeId", "objectId", "versionId"].every(
|
|
111
|
+
(key) => typeof ref[key] === "string" && /^[0-9a-f-]{36}$/i.test(ref[key])
|
|
112
|
+
) ? {
|
|
113
|
+
storeId: ref.storeId,
|
|
114
|
+
objectId: ref.objectId,
|
|
115
|
+
versionId: ref.versionId
|
|
116
|
+
} : null;
|
|
117
|
+
}
|
|
118
|
+
function rowRef(row, view) {
|
|
119
|
+
return decodeRef(row[view.identity.ref]);
|
|
120
|
+
}
|
|
121
|
+
function rowKey(row, view) {
|
|
122
|
+
const id = row[view.identity.row];
|
|
123
|
+
return (typeof id === "string" || typeof id === "number") && id !== "" ? JSON.stringify([view.source, id]) : null;
|
|
124
|
+
}
|
|
125
|
+
function presentationRows(rows, view) {
|
|
126
|
+
const occurrences = /* @__PURE__ */ new Map();
|
|
127
|
+
return rows.map((row) => {
|
|
128
|
+
const content = JSON.stringify(row);
|
|
129
|
+
const occurrence = occurrences.get(content) ?? 0;
|
|
130
|
+
occurrences.set(content, occurrence + 1);
|
|
131
|
+
return { row, renderKey: `${rowKey(row, view) ?? content}:${occurrence}` };
|
|
132
|
+
});
|
|
133
|
+
}
|
|
134
|
+
function rowTitle(row, view) {
|
|
135
|
+
const field = view.columns.find((c) => c.role === "name")?.path ?? "name";
|
|
136
|
+
return String(row[field] ?? row[view.identity.row] ?? "Untitled");
|
|
137
|
+
}
|
|
138
|
+
function columnText(value, format = "text") {
|
|
139
|
+
if (value === null || value === void 0) return "\u2014";
|
|
140
|
+
if (format === "date") {
|
|
141
|
+
const date = new Date(String(value));
|
|
142
|
+
return Number.isNaN(date.getTime()) ? String(value) : date.toLocaleString("en-US", {
|
|
143
|
+
year: "numeric",
|
|
144
|
+
month: "short",
|
|
145
|
+
day: "numeric",
|
|
146
|
+
hour: "2-digit",
|
|
147
|
+
minute: "2-digit"
|
|
148
|
+
});
|
|
149
|
+
}
|
|
150
|
+
return typeof value === "object" ? JSON.stringify(value) : String(value);
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
// packages/studio-workbench/src/query-results.tsx
|
|
154
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
155
|
+
function QueryResults({
|
|
156
|
+
route,
|
|
157
|
+
active,
|
|
158
|
+
rows,
|
|
159
|
+
queryLoading,
|
|
160
|
+
failure,
|
|
161
|
+
selecting,
|
|
162
|
+
visibleColumns,
|
|
163
|
+
annotationProject,
|
|
164
|
+
selectionKey,
|
|
165
|
+
isSelected,
|
|
166
|
+
toggle,
|
|
167
|
+
cover,
|
|
168
|
+
canOpen,
|
|
169
|
+
openRow,
|
|
170
|
+
renderCell,
|
|
171
|
+
rowActions
|
|
172
|
+
}) {
|
|
173
|
+
return /* @__PURE__ */ jsx("div", { className: "studio-results", "aria-busy": queryLoading, children: route.layout === "list" ? /* @__PURE__ */ jsxs("div", { className: "studio-table-scroll", children: [
|
|
174
|
+
/* @__PURE__ */ jsxs(
|
|
175
|
+
"table",
|
|
176
|
+
{
|
|
177
|
+
className: `studio-table studio-table-${route.page}`,
|
|
178
|
+
"aria-label": pageTitles[route.page],
|
|
179
|
+
children: [
|
|
180
|
+
/* @__PURE__ */ jsxs("colgroup", { children: [
|
|
181
|
+
selecting && /* @__PURE__ */ jsx("col", { style: { width: 48 } }),
|
|
182
|
+
visibleColumns.map((column) => /* @__PURE__ */ jsx("col", { style: { width: column.width } }, column.path)),
|
|
183
|
+
/* @__PURE__ */ jsx("col", { style: { width: 100 } })
|
|
184
|
+
] }),
|
|
185
|
+
/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
|
|
186
|
+
selecting && /* @__PURE__ */ jsx("th", { scope: "col", children: "Select" }),
|
|
187
|
+
visibleColumns.map((column) => /* @__PURE__ */ jsx("th", { scope: "col", children: column.label ?? column.path }, column.path)),
|
|
188
|
+
/* @__PURE__ */ jsx("th", { scope: "col", children: "Action" })
|
|
189
|
+
] }) }),
|
|
190
|
+
/* @__PURE__ */ jsx("tbody", { children: presentationRows(rows, active.view).map(({ row, renderKey }) => /* @__PURE__ */ jsxs(
|
|
191
|
+
"tr",
|
|
192
|
+
{
|
|
193
|
+
"data-row-id": rowKey(row, active.view) ?? void 0,
|
|
194
|
+
"data-magic-edit-project": annotationProject(row),
|
|
195
|
+
children: [
|
|
196
|
+
selecting && /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(
|
|
197
|
+
Checkbox,
|
|
198
|
+
{
|
|
199
|
+
label: `Select ${rowTitle(row, active.view)}`,
|
|
200
|
+
disabled: !selectionKey(row),
|
|
201
|
+
hideLabel: true,
|
|
202
|
+
checked: isSelected(row),
|
|
203
|
+
onCheckedChange: () => toggle(row)
|
|
204
|
+
}
|
|
205
|
+
) }),
|
|
206
|
+
visibleColumns.map((column) => /* @__PURE__ */ jsx("td", { children: column.role === "preview" ? cover(row) : column.role === "name" ? /* @__PURE__ */ jsx(
|
|
207
|
+
Button,
|
|
208
|
+
{
|
|
209
|
+
className: "studio-row-name",
|
|
210
|
+
label: rowTitle(row, active.view),
|
|
211
|
+
variant: "text-tonal-sm",
|
|
212
|
+
disabled: selecting ? !selectionKey(row) : !canOpen(row),
|
|
213
|
+
onClick: () => selecting ? toggle(row) : openRow(row)
|
|
214
|
+
}
|
|
215
|
+
) : renderCell(row, column) }, column.path)),
|
|
216
|
+
/* @__PURE__ */ jsx("td", { children: !selecting && rowActions(row) })
|
|
217
|
+
]
|
|
218
|
+
},
|
|
219
|
+
renderKey
|
|
220
|
+
)) })
|
|
221
|
+
]
|
|
222
|
+
}
|
|
223
|
+
),
|
|
224
|
+
!rows.length && /* @__PURE__ */ jsx("div", { className: "studio-empty", role: "status", children: queryLoading ? "Loading\u2026" : failure ? "The query could not be loaded." : route.page === "projects" ? "No matching projects." : route.page === "tasks" ? "No matching tasks." : "No assets." })
|
|
225
|
+
] }) : /* @__PURE__ */ jsxs("div", { className: "studio-grid", children: [
|
|
226
|
+
presentationRows(rows, active.view).map(({ row, renderKey }) => /* @__PURE__ */ jsxs(
|
|
227
|
+
"article",
|
|
228
|
+
{
|
|
229
|
+
"data-row-id": rowKey(row, active.view) ?? void 0,
|
|
230
|
+
"data-magic-edit-project": annotationProject(row),
|
|
231
|
+
className: "studio-card",
|
|
232
|
+
children: [
|
|
233
|
+
cover(row),
|
|
234
|
+
/* @__PURE__ */ jsxs("div", { className: "studio-card-heading", children: [
|
|
235
|
+
/* @__PURE__ */ jsx(
|
|
236
|
+
Button,
|
|
237
|
+
{
|
|
238
|
+
className: "studio-row-name",
|
|
239
|
+
label: rowTitle(row, active.view),
|
|
240
|
+
variant: "text-tonal-sm",
|
|
241
|
+
disabled: selecting ? !selectionKey(row) : !canOpen(row),
|
|
242
|
+
onClick: () => selecting ? toggle(row) : openRow(row)
|
|
243
|
+
}
|
|
244
|
+
),
|
|
245
|
+
!selecting && rowActions(row)
|
|
246
|
+
] }),
|
|
247
|
+
route.page === "assets" && rowRef(row, active.view) ? /* @__PURE__ */ jsx("div", { className: "studio-card-subtitle", children: visibleColumns.some((column) => column.format === "categories") ? visibleColumns.filter((column) => column.format === "categories").map((column) => /* @__PURE__ */ jsx(React.Fragment, { children: renderCell(row, column) }, column.path)) : columnText(row.kind) }) : /* @__PURE__ */ jsx("dl", { children: visibleColumns.filter(
|
|
248
|
+
(column) => !column.role || column.role === "state" || column.role === "project"
|
|
249
|
+
).map((column) => /* @__PURE__ */ jsxs("div", { children: [
|
|
250
|
+
/* @__PURE__ */ jsx("dt", { children: column.label ?? column.path }),
|
|
251
|
+
/* @__PURE__ */ jsx("dd", { children: renderCell(row, column) })
|
|
252
|
+
] }, column.path)) })
|
|
253
|
+
]
|
|
254
|
+
},
|
|
255
|
+
renderKey
|
|
256
|
+
)),
|
|
257
|
+
!rows.length && /* @__PURE__ */ jsx("div", { className: "studio-empty", role: "status", children: queryLoading ? "Loading\u2026" : failure ? "The query could not be loaded." : route.page === "projects" ? "No matching projects." : route.page === "tasks" ? "No matching tasks." : "No assets." })
|
|
258
|
+
] }) });
|
|
259
|
+
}
|
|
260
|
+
|
|
261
|
+
// packages/studio-asset-list/src/client.tsx
|
|
262
|
+
function activate(client) {
|
|
263
|
+
client.registerUI({
|
|
264
|
+
id: "asset-list",
|
|
265
|
+
title: "Asset List",
|
|
266
|
+
kind: "component",
|
|
267
|
+
component: QueryResults
|
|
268
|
+
});
|
|
269
|
+
}
|
|
270
|
+
export {
|
|
271
|
+
activate as default
|
|
272
|
+
};
|
package/dist/client.js
ADDED
package/package.json
CHANGED
|
@@ -1,6 +1,21 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vivix-labs/studio-asset-list",
|
|
3
|
-
"version": "
|
|
4
|
-
"
|
|
5
|
-
"
|
|
3
|
+
"version": "1.0.0-beta",
|
|
4
|
+
"type": "module",
|
|
5
|
+
"publishConfig": {
|
|
6
|
+
"access": "public",
|
|
7
|
+
"registry": "https://registry.npmjs.org/",
|
|
8
|
+
"tag": "beta"
|
|
9
|
+
},
|
|
10
|
+
"files": [
|
|
11
|
+
"dist",
|
|
12
|
+
"studio-plugin.json"
|
|
13
|
+
],
|
|
14
|
+
"exports": {
|
|
15
|
+
"./client": "./dist/client.js"
|
|
16
|
+
},
|
|
17
|
+
"peerDependencies": {
|
|
18
|
+
"react": "^19.0.0",
|
|
19
|
+
"react-dom": "^19.0.0"
|
|
20
|
+
}
|
|
6
21
|
}
|
package/README.md
DELETED