@explorer02/cfm-survey-sdk 0.2.3 → 0.2.5
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/cli/index.js +141 -33
- package/dist/cli/index.mjs +141 -33
- package/dist/index.js +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +3 -1
- package/postinstall.js +9 -5
- package/templates/AGENT.md +60 -19
- package/templates/deploy-wizard-to-s3.sh +52 -0
- package/templates/docs/00-integration/agent-execution-flow.md +293 -0
- package/templates/docs/00-integration/agent-operating-contract.md +268 -0
- package/templates/docs/00-integration/apply-ui-config.md +390 -0
- package/templates/docs/00-integration/aws-deploy.md +117 -3
- package/templates/docs/00-integration/canonical-survey-fixtures.md +94 -0
- package/templates/docs/00-integration/client-integration-guide.md +9 -7
- package/templates/docs/00-integration/client-lib-folder.md +115 -0
- package/templates/docs/00-integration/component-checklist.md +90 -62
- package/templates/docs/00-integration/constraints.md +14 -5
- package/templates/docs/00-integration/custom-field-logic-and-navigation.md +56 -0
- package/templates/docs/00-integration/mockup-ui-extraction.md +113 -0
- package/templates/docs/00-integration/placeholders-and-custom-fields-wiring.md +192 -0
- package/templates/docs/00-integration/placeholders-and-tokens.md +2 -1
- package/templates/docs/00-integration/progress.md +4 -2
- package/templates/docs/00-integration/setup.md +12 -0
- package/templates/docs/00-integration/ui-customization-wizard.md +123 -0
- package/templates/docs/00-integration/useSurveySDK.md +35 -1
- package/templates/docs/00-integration/wizard-api.md +126 -0
- package/templates/docs/00-integration/wizard-config-handoff.md +292 -0
- package/templates/docs/00-integration/wizard-preview-build-guide.md +405 -0
- package/templates/docs/00-integration/wizard-question-type-styling.md +197 -0
- package/templates/docs/00-integration/wizard-troubleshooting.md +80 -0
- package/templates/docs/01-components/01-survey-page.md +18 -8
- package/templates/docs/01-components/02-question.md +2 -2
- package/templates/docs/01-components/03-rating-scale.md +12 -18
- package/templates/docs/01-components/05-csat-matrix-scale.md +18 -26
- package/templates/docs/01-components/06-likert-matrix-scale.md +19 -39
- package/templates/docs/01-components/07-slider-matrix-scale.md +48 -33
- package/templates/docs/01-components/09-custom-slider-track.md +15 -25
- package/templates/docs/01-components/10-header-footer.md +23 -4
- package/templates/docs/01-components/11-progress-bar.md +14 -6
- package/templates/docs/01-components/19-survey-sticky-chrome.md +79 -0
- package/templates/docs/01-components/README.md +2 -2
- package/templates/docs/02-reference/question-types/10-slider-matrix.md +38 -26
- package/templates/docs/02-reference/routing-table.md +1 -0
- package/templates/docs/02-reference/value-derivation.md +1 -1
- package/templates/docs/03-ui-specs/00-question-shell.md +10 -0
- package/templates/docs/03-ui-specs/01-rating.md +18 -0
- package/templates/docs/03-ui-specs/02-radio.md +16 -1
- package/templates/docs/03-ui-specs/03-text.md +12 -1
- package/templates/docs/03-ui-specs/04-csat.md +84 -50
- package/templates/docs/03-ui-specs/06-slider.md +3 -1
- package/templates/docs/03-ui-specs/07-matrix-cfm.md +71 -48
- package/templates/docs/03-ui-specs/08-matrix-csat-rating.md +48 -18
- package/templates/docs/03-ui-specs/09-slider-matrix.md +59 -32
- package/templates/docs/03-ui-specs/10-file-upload.md +11 -0
- package/templates/docs/03-ui-specs/11-text-and-media.md +4 -0
- package/templates/docs/03-ui-specs/12-survey-chrome.md +54 -5
- package/templates/docs/03-ui-specs/13-heatmap.md +12 -1
- package/templates/docs/03-ui-specs/14-rank-order.md +11 -0
- package/templates/docs/03-ui-specs/README.md +4 -2
- package/templates/docs/03-ui-specs/shared/matrix-dropdown.md +1 -1
- package/templates/docs/MANIFEST.json +180 -7
- package/templates/docs/index.md +114 -117
- package/templates/docs/templates/CsatMatrixScale.tsx +637 -0
- package/templates/docs/templates/FileUploadScale.tsx +262 -0
- package/templates/docs/templates/HeatmapScale.tsx +114 -0
- package/templates/docs/templates/LikertMatrixScale.tsx +414 -0
- package/templates/docs/templates/Question.tsx +3 -0
- package/templates/docs/templates/RatingScale.tsx +129 -0
- package/templates/docs/templates/SliderMatrixScale.tsx +248 -0
- package/templates/docs/templates/SurveyStickyChrome.tsx +24 -0
- package/templates/docs/templates/customFieldValues.ts +36 -0
- package/templates/docs/templates/deploy-to-aws.sh +74 -0
- package/templates/docs/templates/implementation_plan.md +64 -10
- package/templates/docs/templates/labelStyles.ts +33 -0
- package/templates/docs/templates/selectionStyles.ts +100 -0
- package/templates/docs/templates/surveyUiIcons.tsx +11 -0
- package/templates/docs/templates/surveyUiScaleUtils.ts +51 -0
- package/templates/docs/templates/verify-agent-build.sh +119 -0
- package/templates/preview-harness/preview-bridge.inline.js +201 -0
- package/templates/preview-harness/previewPages.js +108 -0
- package/templates/preview-harness/previewPages.ts +298 -0
- package/templates/preview-harness/vite-app/src/PreviewConfigContext.tsx +67 -0
- package/templates/preview-harness/vite-app/src/QuestionPreview.tsx +122 -0
- package/templates/preview-harness/vite-app/src/SurveyPagePreview.tsx +75 -0
- package/templates/preview-harness/vite-app/src/fixtures/questions.ts +311 -0
- package/templates/preview-harness/vite-app/src/globals.css +16 -0
- package/templates/preview-harness/vite-app/src/mount.tsx +9 -0
- package/templates/preview-harness/vite-app/src/preview-live-overrides.css +101 -0
- package/templates/preview-harness/vite-app/stubs/next-dynamic.tsx +25 -0
- package/templates/preview-harness/vite-app/stubs/next-image.tsx +29 -0
- package/templates/previewBridge.ts +153 -0
- package/templates/survey-theme.css +295 -0
- package/templates/survey-ui-config.schema.json +213 -0
- package/templates/wizard-dist/assets/PreviewMock-AoZdAEPZ.js +1 -0
- package/templates/wizard-dist/assets/TypePanel-39FnbtvG.js +1 -0
- package/templates/wizard-dist/assets/index-BhWM50Yu.css +1 -0
- package/templates/wizard-dist/assets/index-CWKdsJOp.js +34 -0
- package/templates/wizard-dist/assets/vendor-BwkXDkd3.js +17 -0
- package/templates/wizard-dist/index.html +20 -0
- package/templates/wizard.html +13 -1129
|
@@ -0,0 +1,295 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Default CSS custom properties for survey UI theming.
|
|
3
|
+
* Agent copies to src/styles/survey-theme.css and imports in globals.css.
|
|
4
|
+
*/
|
|
5
|
+
:root {
|
|
6
|
+
--cfm-primary: #1a1f36;
|
|
7
|
+
--cfm-secondary: #e8f5fd;
|
|
8
|
+
--cfm-accent: #00b5ad;
|
|
9
|
+
--cfm-background: #ffffff;
|
|
10
|
+
--cfm-text: #1a1f36;
|
|
11
|
+
--cfm-button-text: #ffffff;
|
|
12
|
+
--cfm-max-width: 48rem;
|
|
13
|
+
--cfm-border-radius: 12px;
|
|
14
|
+
--cfm-font-family: Inter, sans-serif;
|
|
15
|
+
--cfm-heading-weight: 700;
|
|
16
|
+
--cfm-motion-duration: 200ms;
|
|
17
|
+
|
|
18
|
+
--cfm-header-height: 120px;
|
|
19
|
+
--cfm-header-logo-width: 120px;
|
|
20
|
+
--cfm-header-logo-height: 120px;
|
|
21
|
+
--cfm-header-logo-padding: 10px;
|
|
22
|
+
--cfm-header-bg: #ffffff;
|
|
23
|
+
--cfm-header-company-color: #1a1f36;
|
|
24
|
+
--cfm-header-company-size: 18px;
|
|
25
|
+
--cfm-header-company-weight: 600;
|
|
26
|
+
--cfm-header-border: #e5e7eb;
|
|
27
|
+
--cfm-header-padding-x: 40px;
|
|
28
|
+
--cfm-header-logo-col: 1;
|
|
29
|
+
--cfm-header-logo-justify: start;
|
|
30
|
+
--cfm-header-company-col: 1;
|
|
31
|
+
--cfm-header-company-justify: start;
|
|
32
|
+
--cfm-header-brand-gap: 16px;
|
|
33
|
+
--cfm-header-company-margin-top: 0;
|
|
34
|
+
--cfm-header-company-margin-left: 0;
|
|
35
|
+
--cfm-header-company-margin-right: 0;
|
|
36
|
+
|
|
37
|
+
--cfm-footer-bg: #262626;
|
|
38
|
+
--cfm-footer-text: #9ca3af;
|
|
39
|
+
--cfm-footer-link: #9ca3af;
|
|
40
|
+
--cfm-footer-link-hover: #ffffff;
|
|
41
|
+
--cfm-footer-logo-width: 120px;
|
|
42
|
+
--cfm-footer-logo-height: 32px;
|
|
43
|
+
--cfm-footer-padding-y: 24px;
|
|
44
|
+
--cfm-footer-padding-x: 40px;
|
|
45
|
+
--cfm-footer-inner-display: grid;
|
|
46
|
+
--cfm-footer-inner-direction: row;
|
|
47
|
+
--cfm-footer-inner-align: end;
|
|
48
|
+
--cfm-footer-logo-col: 1;
|
|
49
|
+
--cfm-footer-logo-justify: start;
|
|
50
|
+
--cfm-footer-links-col: 3;
|
|
51
|
+
--cfm-footer-links-justify: end;
|
|
52
|
+
|
|
53
|
+
--cfm-card-bg: #ffffff;
|
|
54
|
+
--cfm-card-border-color: #e5e7eb;
|
|
55
|
+
--cfm-card-padding: 24px;
|
|
56
|
+
--cfm-card-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
|
|
57
|
+
--cfm-selected-bg: #e8f5fd;
|
|
58
|
+
--cfm-zebra-row: rgba(249, 250, 251, 0.8);
|
|
59
|
+
--cfm-row-band: #f3f4f6;
|
|
60
|
+
--cfm-validation-border: #333333;
|
|
61
|
+
--cfm-validation-bg: #d9d9d9;
|
|
62
|
+
--cfm-tooltip-bg: #1f2937;
|
|
63
|
+
--cfm-progress-height: 12px;
|
|
64
|
+
--cfm-progress-track: #e5e7eb;
|
|
65
|
+
--cfm-progress-fill: #1a1f36;
|
|
66
|
+
--cfm-sticky-pt: 16px;
|
|
67
|
+
--cfm-sticky-pb: 20px;
|
|
68
|
+
|
|
69
|
+
--cfm-language-bg: #ffffff;
|
|
70
|
+
--cfm-language-text: #2563eb;
|
|
71
|
+
--cfm-language-border: #2563eb;
|
|
72
|
+
|
|
73
|
+
--cfm-mcq-selected-accent: var(--cfm-accent);
|
|
74
|
+
--cfm-mcq-border-radius: 8px;
|
|
75
|
+
--cfm-mcq-option-gap: 8px;
|
|
76
|
+
--cfm-mcq-card-padding: 12px;
|
|
77
|
+
--cfm-mcq-selected-bg: var(--cfm-secondary);
|
|
78
|
+
--cfm-mcq-hover-border: var(--cfm-accent);
|
|
79
|
+
|
|
80
|
+
--cfm-input-radius: 8px;
|
|
81
|
+
--cfm-input-focus-ring: var(--cfm-accent);
|
|
82
|
+
--cfm-input-border: #e5e7eb;
|
|
83
|
+
--cfm-input-padding: 12px;
|
|
84
|
+
--cfm-input-height: 44px;
|
|
85
|
+
--cfm-input-placeholder: #9ca3af;
|
|
86
|
+
|
|
87
|
+
--cfm-nps-selected-fill: var(--cfm-secondary);
|
|
88
|
+
--cfm-nps-label-color: var(--cfm-text);
|
|
89
|
+
--cfm-nps-track-bar: #f2f2f2;
|
|
90
|
+
--cfm-nps-track-highlight: #fbe8f3;
|
|
91
|
+
--cfm-nps-cell-size: 40px;
|
|
92
|
+
--cfm-nps-cell-gap: 4px;
|
|
93
|
+
|
|
94
|
+
--cfm-matrix-row-width: 180px;
|
|
95
|
+
--cfm-matrix-selected: var(--cfm-accent);
|
|
96
|
+
--cfm-matrix-bipolar-width: 25%;
|
|
97
|
+
--cfm-matrix-carousel-dot: #2563eb;
|
|
98
|
+
--cfm-matrix-cell-padding: 8px;
|
|
99
|
+
|
|
100
|
+
--cfm-csat-accent: var(--cfm-accent);
|
|
101
|
+
--cfm-csat-emoji-size: 24px;
|
|
102
|
+
--cfm-csat-unselected-opacity: 0.5;
|
|
103
|
+
--cfm-csat-ring-color: var(--cfm-accent);
|
|
104
|
+
--cfm-csat-cell-size: 40px;
|
|
105
|
+
|
|
106
|
+
--cfm-star-color: #f59e0b;
|
|
107
|
+
--cfm-badge-color: var(--cfm-primary);
|
|
108
|
+
--cfm-star-unselected-opacity: 0.5;
|
|
109
|
+
|
|
110
|
+
--cfm-slider-track: var(--cfm-accent);
|
|
111
|
+
--cfm-slider-thumb: var(--cfm-primary);
|
|
112
|
+
--cfm-slider-tick: #9ca3af;
|
|
113
|
+
--cfm-slider-row-band: #f3f4f6;
|
|
114
|
+
--cfm-slider-tick-size: 28px;
|
|
115
|
+
|
|
116
|
+
--cfm-upload-accent: var(--cfm-accent);
|
|
117
|
+
--cfm-upload-border-color: #d1d5db;
|
|
118
|
+
--cfm-upload-fill: var(--cfm-rank-item-bg);
|
|
119
|
+
--cfm-upload-padding: 24px;
|
|
120
|
+
|
|
121
|
+
--cfm-media-max-width: 100%;
|
|
122
|
+
--cfm-media-radius: 8px;
|
|
123
|
+
|
|
124
|
+
--cfm-heatmap-pin: var(--cfm-accent);
|
|
125
|
+
--cfm-heatmap-pin-size: 12px;
|
|
126
|
+
|
|
127
|
+
--cfm-rank-item-bg: #f9fafb;
|
|
128
|
+
--cfm-rank-badge: var(--cfm-primary);
|
|
129
|
+
--cfm-rank-handle: #9ca3af;
|
|
130
|
+
--cfm-rank-item-padding: 12px;
|
|
131
|
+
--cfm-rank-item-gap: 8px;
|
|
132
|
+
|
|
133
|
+
--cfm-hint-label-color: #6b7280;
|
|
134
|
+
--cfm-hint-label-bg: transparent;
|
|
135
|
+
--cfm-number-label-mode: traffic;
|
|
136
|
+
--cfm-number-mono-color: var(--cfm-primary);
|
|
137
|
+
--cfm-matrix-column-label-color: #4b5563;
|
|
138
|
+
--cfm-matrix-column-label-bg: transparent;
|
|
139
|
+
--cfm-csat-column-label-color: #4b5563;
|
|
140
|
+
--cfm-csat-column-label-bg: transparent;
|
|
141
|
+
--cfm-slider-tick-label-color: #4b5563;
|
|
142
|
+
--cfm-slider-tick-label-bg: transparent;
|
|
143
|
+
--cfm-upload-border-style: dashed;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
body {
|
|
147
|
+
margin: 0;
|
|
148
|
+
font-family: var(--cfm-font-family);
|
|
149
|
+
color: var(--cfm-text);
|
|
150
|
+
background: var(--cfm-background);
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
.cfm-preview-root {
|
|
154
|
+
max-width: var(--cfm-max-width);
|
|
155
|
+
margin: 0 auto;
|
|
156
|
+
padding: 16px;
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
.cfm-btn-primary {
|
|
160
|
+
background: var(--cfm-primary);
|
|
161
|
+
color: var(--cfm-button-text);
|
|
162
|
+
border: none;
|
|
163
|
+
border-radius: var(--cfm-border-radius);
|
|
164
|
+
padding: 10px 20px;
|
|
165
|
+
cursor: pointer;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
.cfm-btn-back {
|
|
169
|
+
background: transparent;
|
|
170
|
+
color: var(--cfm-primary);
|
|
171
|
+
border: 1px solid var(--cfm-primary);
|
|
172
|
+
border-radius: var(--cfm-border-radius);
|
|
173
|
+
padding: 10px 20px;
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
.cfm-header-inner {
|
|
177
|
+
display: grid;
|
|
178
|
+
grid-template-columns: 1fr auto 1fr;
|
|
179
|
+
align-items: center;
|
|
180
|
+
gap: var(--cfm-header-brand-gap, 16px);
|
|
181
|
+
padding-left: var(--cfm-header-padding-x);
|
|
182
|
+
padding-right: var(--cfm-header-padding-x);
|
|
183
|
+
padding-top: 12px;
|
|
184
|
+
padding-bottom: 12px;
|
|
185
|
+
min-height: var(--cfm-header-height);
|
|
186
|
+
box-sizing: border-box;
|
|
187
|
+
}
|
|
188
|
+
|
|
189
|
+
.cfm-header-logo-slot {
|
|
190
|
+
grid-column: var(--cfm-header-logo-col, 1);
|
|
191
|
+
grid-row: 1;
|
|
192
|
+
justify-self: var(--cfm-header-logo-justify, start);
|
|
193
|
+
width: var(--cfm-header-logo-width);
|
|
194
|
+
height: var(--cfm-header-logo-height);
|
|
195
|
+
}
|
|
196
|
+
|
|
197
|
+
.cfm-header-company-slot {
|
|
198
|
+
grid-column: var(--cfm-header-company-col, 1);
|
|
199
|
+
grid-row: 1;
|
|
200
|
+
justify-self: var(--cfm-header-company-justify, start);
|
|
201
|
+
align-self: center;
|
|
202
|
+
color: var(--cfm-header-company-color);
|
|
203
|
+
font-size: var(--cfm-header-company-size);
|
|
204
|
+
font-weight: var(--cfm-header-company-weight);
|
|
205
|
+
margin-top: var(--cfm-header-company-margin-top, 0);
|
|
206
|
+
margin-left: var(--cfm-header-company-margin-left, 0);
|
|
207
|
+
margin-right: var(--cfm-header-company-margin-right, 0);
|
|
208
|
+
line-height: 1.2;
|
|
209
|
+
}
|
|
210
|
+
|
|
211
|
+
.cfm-footer-inner {
|
|
212
|
+
display: var(--cfm-footer-inner-display, grid);
|
|
213
|
+
flex-direction: var(--cfm-footer-inner-direction, row);
|
|
214
|
+
grid-template-columns: 1fr auto 1fr;
|
|
215
|
+
grid-template-rows: auto auto;
|
|
216
|
+
align-items: end;
|
|
217
|
+
gap: 1rem 1.5rem;
|
|
218
|
+
width: 100%;
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
.cfm-footer-copyright {
|
|
222
|
+
grid-column: 1;
|
|
223
|
+
grid-row: 2;
|
|
224
|
+
justify-self: start;
|
|
225
|
+
align-self: end;
|
|
226
|
+
color: var(--cfm-footer-text);
|
|
227
|
+
margin: 0;
|
|
228
|
+
}
|
|
229
|
+
|
|
230
|
+
.cfm-footer-logo-slot {
|
|
231
|
+
grid-column: var(--cfm-footer-logo-col, 1);
|
|
232
|
+
grid-row: 1;
|
|
233
|
+
justify-self: var(--cfm-footer-logo-justify, start);
|
|
234
|
+
align-self: end;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
.cfm-footer-links {
|
|
238
|
+
grid-column: var(--cfm-footer-links-col, 3);
|
|
239
|
+
grid-row: 1 / -1;
|
|
240
|
+
justify-self: var(--cfm-footer-links-justify, end);
|
|
241
|
+
align-self: end;
|
|
242
|
+
}
|
|
243
|
+
|
|
244
|
+
.cfm-footer-link {
|
|
245
|
+
color: var(--cfm-footer-link);
|
|
246
|
+
text-decoration: none;
|
|
247
|
+
transition: color 0.15s ease;
|
|
248
|
+
}
|
|
249
|
+
|
|
250
|
+
.cfm-footer-link:hover {
|
|
251
|
+
color: var(--cfm-footer-link-hover);
|
|
252
|
+
}
|
|
253
|
+
|
|
254
|
+
.cfm-question-card {
|
|
255
|
+
background-color: var(--cfm-card-bg);
|
|
256
|
+
border: 1px solid var(--cfm-card-border-color);
|
|
257
|
+
border-radius: var(--cfm-border-radius);
|
|
258
|
+
padding: var(--cfm-card-padding);
|
|
259
|
+
box-shadow: var(--cfm-card-shadow);
|
|
260
|
+
}
|
|
261
|
+
|
|
262
|
+
.cfm-language-select {
|
|
263
|
+
background-color: var(--cfm-language-bg);
|
|
264
|
+
color: var(--cfm-language-text);
|
|
265
|
+
border-color: var(--cfm-language-border);
|
|
266
|
+
}
|
|
267
|
+
|
|
268
|
+
.cfm-language-select:focus {
|
|
269
|
+
--tw-ring-color: var(--cfm-language-border);
|
|
270
|
+
}
|
|
271
|
+
|
|
272
|
+
.cfm-language-chevron {
|
|
273
|
+
color: var(--cfm-language-text);
|
|
274
|
+
}
|
|
275
|
+
|
|
276
|
+
[data-cfm-mcq-style='filled'] .cfm-mcq-option {
|
|
277
|
+
background: var(--cfm-mcq-selected-bg);
|
|
278
|
+
}
|
|
279
|
+
|
|
280
|
+
[data-cfm-mcq-style='minimal'] .cfm-mcq-option {
|
|
281
|
+
border: none;
|
|
282
|
+
box-shadow: none;
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
[data-cfm-dropzone-style='dashed'] .cfm-dropzone {
|
|
286
|
+
border-style: dashed;
|
|
287
|
+
}
|
|
288
|
+
|
|
289
|
+
[data-cfm-dropzone-style='solid'] .cfm-dropzone {
|
|
290
|
+
border-style: solid;
|
|
291
|
+
}
|
|
292
|
+
|
|
293
|
+
.cfm-live-edit * {
|
|
294
|
+
transition: none !important;
|
|
295
|
+
}
|
|
@@ -0,0 +1,213 @@
|
|
|
1
|
+
{
|
|
2
|
+
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
3
|
+
"$id": "https://cfm-survey-sdk.dev/schemas/survey-ui-config.json",
|
|
4
|
+
"title": "Survey UI Configuration",
|
|
5
|
+
"description": "Presentation-only customization output from cfm-sdk customize wizard. Does not modify SDK survey data or question integration.",
|
|
6
|
+
"type": "object",
|
|
7
|
+
"required": ["version", "surveyTypes", "global", "questionTypes", "placeholders", "deploy"],
|
|
8
|
+
"properties": {
|
|
9
|
+
"version": { "type": "string", "const": "1.0" },
|
|
10
|
+
"configuredAt": { "type": "string", "format": "date-time" },
|
|
11
|
+
"instanceId": { "type": "string" },
|
|
12
|
+
"surveyTypes": {
|
|
13
|
+
"type": "array",
|
|
14
|
+
"items": {
|
|
15
|
+
"type": "string",
|
|
16
|
+
"enum": [
|
|
17
|
+
"MCQ",
|
|
18
|
+
"TEXTFIELD",
|
|
19
|
+
"NPS_SCALE",
|
|
20
|
+
"CFM_MATRIX",
|
|
21
|
+
"CSAT_MATRIX",
|
|
22
|
+
"RATING_MATRIX",
|
|
23
|
+
"SLIDER_MATRIX",
|
|
24
|
+
"FILE_UPLOAD",
|
|
25
|
+
"TEXT_AND_MEDIA",
|
|
26
|
+
"HEATMAP",
|
|
27
|
+
"RANK_ORDER"
|
|
28
|
+
]
|
|
29
|
+
}
|
|
30
|
+
},
|
|
31
|
+
"global": {
|
|
32
|
+
"type": "object",
|
|
33
|
+
"required": [
|
|
34
|
+
"surveyTitle",
|
|
35
|
+
"companyName",
|
|
36
|
+
"browserTabTitle",
|
|
37
|
+
"thankYouMessage",
|
|
38
|
+
"logo",
|
|
39
|
+
"layout",
|
|
40
|
+
"buttons",
|
|
41
|
+
"colorScheme",
|
|
42
|
+
"colorSource",
|
|
43
|
+
"typography",
|
|
44
|
+
"motion"
|
|
45
|
+
],
|
|
46
|
+
"properties": {
|
|
47
|
+
"surveyTitle": { "type": "string" },
|
|
48
|
+
"companyName": { "type": "string" },
|
|
49
|
+
"browserTabTitle": { "type": "string" },
|
|
50
|
+
"thankYouMessage": { "type": "string" },
|
|
51
|
+
"logo": {
|
|
52
|
+
"type": "object",
|
|
53
|
+
"properties": {
|
|
54
|
+
"fileName": { "type": ["string", "null"] },
|
|
55
|
+
"url": { "type": ["string", "null"] }
|
|
56
|
+
}
|
|
57
|
+
},
|
|
58
|
+
"layout": {
|
|
59
|
+
"type": "object",
|
|
60
|
+
"properties": {
|
|
61
|
+
"showHeader": { "type": "boolean" },
|
|
62
|
+
"showFooter": { "type": "boolean" },
|
|
63
|
+
"showProgressBar": { "type": "boolean" },
|
|
64
|
+
"showLanguageSwitcher": { "type": "boolean" },
|
|
65
|
+
"showNextButton": { "type": "boolean" },
|
|
66
|
+
"showBackButton": { "type": "boolean" },
|
|
67
|
+
"showQuestionNumbers": { "type": "boolean" },
|
|
68
|
+
"showRequiredAsterisk": { "type": "boolean" },
|
|
69
|
+
"width": { "enum": ["narrow", "standard", "wide"] },
|
|
70
|
+
"borderStyle": { "enum": ["sharp", "rounded", "pill"] },
|
|
71
|
+
"fontStyle": { "enum": ["system", "modern", "serif"] }
|
|
72
|
+
}
|
|
73
|
+
},
|
|
74
|
+
"buttons": {
|
|
75
|
+
"type": "object",
|
|
76
|
+
"properties": {
|
|
77
|
+
"next": { "type": "string" },
|
|
78
|
+
"back": { "type": "string" },
|
|
79
|
+
"submit": { "type": "string" }
|
|
80
|
+
}
|
|
81
|
+
},
|
|
82
|
+
"colorScheme": {
|
|
83
|
+
"type": "object",
|
|
84
|
+
"properties": {
|
|
85
|
+
"primary": { "type": "string", "pattern": "^#[0-9A-Fa-f]{6}$" },
|
|
86
|
+
"secondary": { "type": "string", "pattern": "^#[0-9A-Fa-f]{6}$" },
|
|
87
|
+
"accent": { "type": "string", "pattern": "^#[0-9A-Fa-f]{6}$" },
|
|
88
|
+
"background": { "type": "string", "pattern": "^#[0-9A-Fa-f]{6}$" },
|
|
89
|
+
"text": { "type": "string", "pattern": "^#[0-9A-Fa-f]{6}$" },
|
|
90
|
+
"buttonText": { "type": "string", "pattern": "^#[0-9A-Fa-f]{6}$" }
|
|
91
|
+
}
|
|
92
|
+
},
|
|
93
|
+
"colorSource": { "enum": ["auto", "logo", "custom", "prompt"] },
|
|
94
|
+
"typography": {
|
|
95
|
+
"type": "object",
|
|
96
|
+
"properties": {
|
|
97
|
+
"fontFamily": { "type": "string" },
|
|
98
|
+
"headingWeight": { "type": "number" }
|
|
99
|
+
}
|
|
100
|
+
},
|
|
101
|
+
"motion": {
|
|
102
|
+
"type": "object",
|
|
103
|
+
"properties": {
|
|
104
|
+
"enabled": { "type": "boolean" },
|
|
105
|
+
"durationMs": { "type": "number", "minimum": 0, "maximum": 1000 }
|
|
106
|
+
}
|
|
107
|
+
},
|
|
108
|
+
"header": {
|
|
109
|
+
"type": "object",
|
|
110
|
+
"properties": {
|
|
111
|
+
"height": { "type": "number" },
|
|
112
|
+
"logoBoxWidth": { "type": "number" },
|
|
113
|
+
"logoBoxHeight": { "type": "number" },
|
|
114
|
+
"logoPadding": { "type": "number" },
|
|
115
|
+
"logoPlacement": { "enum": ["left", "center", "right"] },
|
|
116
|
+
"showCompanyName": { "type": "boolean" },
|
|
117
|
+
"companyNamePlacement": { "enum": ["left", "center", "right"] },
|
|
118
|
+
"companyNameFontSize": { "type": "number" },
|
|
119
|
+
"companyNameFontWeight": { "type": "number" },
|
|
120
|
+
"companyNameColor": { "type": "string" },
|
|
121
|
+
"backgroundColor": { "type": "string" },
|
|
122
|
+
"shadowEnabled": { "type": "boolean" },
|
|
123
|
+
"borderBottomColor": { "type": "string" },
|
|
124
|
+
"contentPaddingX": { "type": "number" }
|
|
125
|
+
}
|
|
126
|
+
},
|
|
127
|
+
"footer": {
|
|
128
|
+
"type": "object",
|
|
129
|
+
"properties": {
|
|
130
|
+
"backgroundColor": { "type": "string" },
|
|
131
|
+
"textColor": { "type": "string" },
|
|
132
|
+
"linkColor": { "type": "string" },
|
|
133
|
+
"linkHoverColor": { "type": "string" },
|
|
134
|
+
"showLogo": { "type": "boolean" },
|
|
135
|
+
"logoWidth": { "type": "number" },
|
|
136
|
+
"logoHeight": { "type": "number" },
|
|
137
|
+
"logoPlacement": { "enum": ["left", "center", "right"] },
|
|
138
|
+
"copyrightText": { "type": "string" },
|
|
139
|
+
"layout": { "enum": ["stack", "row"] },
|
|
140
|
+
"paddingY": { "type": "number" },
|
|
141
|
+
"paddingX": { "type": "number" },
|
|
142
|
+
"links": {
|
|
143
|
+
"type": "array",
|
|
144
|
+
"items": {
|
|
145
|
+
"type": "object",
|
|
146
|
+
"properties": {
|
|
147
|
+
"label": { "type": "string" },
|
|
148
|
+
"url": { "type": "string" }
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
},
|
|
154
|
+
"theme": {
|
|
155
|
+
"type": "object",
|
|
156
|
+
"properties": {
|
|
157
|
+
"pageBackground": { "type": "string" },
|
|
158
|
+
"cardBackground": { "type": "string" },
|
|
159
|
+
"cardBorderColor": { "type": "string" },
|
|
160
|
+
"cardPadding": { "type": "number" },
|
|
161
|
+
"cardShadowEnabled": { "type": "boolean" },
|
|
162
|
+
"selectedBackground": { "type": "string" },
|
|
163
|
+
"zebraRowColor": { "type": "string" },
|
|
164
|
+
"rowBandColor": { "type": "string" },
|
|
165
|
+
"validationBorder": { "type": "string" },
|
|
166
|
+
"validationBackground": { "type": "string" },
|
|
167
|
+
"tooltipBackground": { "type": "string" },
|
|
168
|
+
"progressTrackHeight": { "type": "number" },
|
|
169
|
+
"progressTrackColor": { "type": "string" },
|
|
170
|
+
"progressFillColor": { "type": "string" },
|
|
171
|
+
"stickyChromePaddingTop": { "type": "number" },
|
|
172
|
+
"stickyChromePaddingBottom": { "type": "number" },
|
|
173
|
+
"languageSelectorBackground": { "type": "string" },
|
|
174
|
+
"languageSelectorTextColor": { "type": "string" },
|
|
175
|
+
"languageSelectorBorderColor": { "type": "string" }
|
|
176
|
+
}
|
|
177
|
+
}
|
|
178
|
+
}
|
|
179
|
+
},
|
|
180
|
+
"customFields": {
|
|
181
|
+
"type": "object",
|
|
182
|
+
"additionalProperties": { "type": "string" }
|
|
183
|
+
},
|
|
184
|
+
"debug": {
|
|
185
|
+
"type": "object",
|
|
186
|
+
"properties": {
|
|
187
|
+
"enabled": { "type": "boolean" },
|
|
188
|
+
"sampleAnswers": { "type": "object" }
|
|
189
|
+
}
|
|
190
|
+
},
|
|
191
|
+
"questionTypes": {
|
|
192
|
+
"type": "object",
|
|
193
|
+
"additionalProperties": true
|
|
194
|
+
},
|
|
195
|
+
"placeholders": {
|
|
196
|
+
"type": "object",
|
|
197
|
+
"properties": {
|
|
198
|
+
"firstName": { "type": "string" },
|
|
199
|
+
"lastName": { "type": "string" },
|
|
200
|
+
"email": { "type": "string" }
|
|
201
|
+
},
|
|
202
|
+
"additionalProperties": { "type": "string" }
|
|
203
|
+
},
|
|
204
|
+
"deploy": {
|
|
205
|
+
"type": "object",
|
|
206
|
+
"required": ["target", "autoDeploy"],
|
|
207
|
+
"properties": {
|
|
208
|
+
"target": { "enum": ["aws", "vercel"] },
|
|
209
|
+
"autoDeploy": { "type": "boolean" }
|
|
210
|
+
}
|
|
211
|
+
}
|
|
212
|
+
}
|
|
213
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{u as x,j as e}from"./index-CWKdsJOp.js";import{b as t}from"./vendor-BwkXDkd3.js";function p(d=150){const l=x(r=>r.config),[a,s]=t.useState(l);return t.useEffect(()=>{const r=window.setTimeout(()=>s(l),d);return()=>window.clearTimeout(r)},[l,d]),a}const h=t.memo(function(){const l=p(150),a=x(n=>n.logoPreviewDataUrl),{global:s}=l,{layout:r,colorScheme:o,buttons:c}=s,m=t.useMemo(()=>r.borderStyle==="sharp"?"rounded-none":r.borderStyle==="pill"?"rounded-[32px]":"rounded-2xl",[r.borderStyle]),i=t.useMemo(()=>r.fontStyle==="serif"?"Georgia, serif":r.fontStyle==="system"?"system-ui, sans-serif":"Inter, sans-serif",[r.fontStyle]),u=a??s.logo.url,f=t.useMemo(()=>({backgroundColor:o.background,color:o.text,borderColor:o.secondary,fontFamily:i}),[o,i]);return e.jsxs("div",{className:`overflow-hidden border shadow-md ${m}`,style:f,children:[r.showHeader&&e.jsxs("div",{className:"flex items-center gap-3 border-b px-5 py-4",style:{borderColor:o.secondary},children:[u&&e.jsx("img",{src:u,alt:"Logo",className:"max-h-6 w-auto object-contain",loading:"lazy"}),e.jsx("span",{className:"text-xs font-semibold tracking-wider",children:s.companyName})]}),e.jsxs("div",{className:"space-y-6 p-6",children:[r.showProgressBar&&e.jsxs("div",{className:"space-y-1.5",children:[e.jsxs("div",{className:"flex justify-between text-[10px] font-semibold text-slate-400",children:[e.jsx("span",{children:"Progress"}),e.jsx("span",{children:"35%"})]}),e.jsx("div",{className:"h-1.5 w-full overflow-hidden rounded-full bg-slate-100",children:e.jsx("div",{className:"h-full w-[35%] rounded-full",style:{backgroundColor:o.accent}})})]}),e.jsxs("div",{className:"space-y-3",children:[e.jsxs("h4",{className:"flex items-start gap-1.5 text-sm font-bold leading-snug",children:[r.showQuestionNumbers&&e.jsx("span",{className:"font-medium text-slate-400",children:"Q1."}),e.jsx("span",{children:s.surveyTitle}),r.showRequiredAsterisk&&e.jsx("span",{className:"text-red-500",children:"*"})]}),e.jsx("p",{className:"text-[11px] text-slate-400",children:"How would you rate your overall experience?"}),e.jsx("div",{className:"grid grid-cols-5 gap-2",children:[1,2,3,4,5].map(n=>e.jsx("div",{className:`flex h-9 items-center justify-center border text-xs font-semibold ${r.borderStyle==="pill"?"rounded-full":r.borderStyle==="sharp"?"rounded-none":"rounded-lg"}`,style:n===1?{backgroundColor:o.secondary,borderColor:o.primary,color:o.primary}:{backgroundColor:o.background,borderColor:o.secondary,color:o.text},children:n},n))})]})]}),e.jsxs("div",{className:"flex items-center justify-between border-t bg-slate-50/50 px-6 py-4",children:[r.showBackButton&&e.jsx("span",{className:`border px-3 py-1.5 text-[10px] font-semibold ${r.borderStyle==="pill"?"rounded-full":r.borderStyle==="sharp"?"rounded-none":"rounded-lg"}`,style:{borderColor:o.secondary,color:o.text},children:c.back}),e.jsx("div",{className:"flex-1"}),r.showNextButton&&e.jsx("span",{className:`px-4 py-1.5 text-[10px] font-bold ${r.borderStyle==="pill"?"rounded-full":r.borderStyle==="sharp"?"rounded-none":"rounded-lg"}`,style:{backgroundColor:o.primary,color:o.buttonText},children:c.next})]})]})});export{h as PreviewMock};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{u as g,j as e,T as f,S as j,R as u,N as t,C as i,a as M,M as L}from"./index-CWKdsJOp.js";import"./vendor-BwkXDkd3.js";function b({values:o,onPatch:r}){return e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsx(i,{label:"Label text color",value:o.columnLabelColor,onChange:a=>r({columnLabelColor:a})}),e.jsx(i,{label:"Label background",value:o.columnLabelBgColor,onChange:a=>r({columnLabelBgColor:a})})]})}function P({values:o,onPatch:r}){return e.jsxs("div",{className:"grid grid-cols-1 gap-3 sm:grid-cols-2",children:[e.jsxs("label",{className:"space-y-1 sm:col-span-2",children:[e.jsx("span",{className:"text-[10px] font-semibold uppercase tracking-wider text-slate-500",children:"Min hint label"}),e.jsx("input",{className:"w-full rounded-lg border border-white/10 bg-slate-950/50 px-3 py-2 text-sm text-white",value:o.hintMinText,onChange:a=>r({hintMinText:a.target.value})})]}),e.jsxs("label",{className:"space-y-1 sm:col-span-2",children:[e.jsx("span",{className:"text-[10px] font-semibold uppercase tracking-wider text-slate-500",children:"Max hint label"}),e.jsx("input",{className:"w-full rounded-lg border border-white/10 bg-slate-950/50 px-3 py-2 text-sm text-white",value:o.hintMaxText,onChange:a=>r({hintMaxText:a.target.value})})]}),e.jsx(i,{label:"Hint text color",value:o.hintLabelColor,onChange:a=>r({hintLabelColor:a})}),e.jsx(i,{label:"Hint label background",value:o.hintLabelBgColor,onChange:a=>r({hintLabelBgColor:a})})]})}function p({values:o,onPatch:r,count:a=11}){return e.jsxs("div",{className:"space-y-3",children:[e.jsx(j,{label:"Number label style",value:o.numberLabelMode,onChange:d=>r({numberLabelMode:d}),options:[{value:"traffic",label:"Traffic light (default)"},{value:"monochrome",label:"Monochrome (one color)"},{value:"individual",label:"Individual per number"}]}),o.numberLabelMode==="monochrome"&&e.jsx(i,{label:"Monochrome color",value:o.monochromeNumberColor,onChange:d=>r({monochromeNumberColor:d})}),o.numberLabelMode==="individual"&&e.jsx("div",{className:"grid grid-cols-2 gap-2 sm:grid-cols-3",children:Array.from({length:a},(d,c)=>e.jsx(i,{label:`#${c}`,value:o.individualNumberColors[c]??"#9CA3AF",onChange:C=>{const x=[...o.individualNumberColors];x[c]=C,r({individualNumberColors:x})}},c))})]})}function s({title:o,children:r}){return e.jsxs("div",{className:"space-y-3 rounded-xl border border-white/5 bg-slate-950/20 p-4",children:[e.jsx("h4",{className:"text-xs font-semibold uppercase tracking-wider text-slate-400",children:o}),r]})}function B({type:o,activeFormat:r}){const a=g(l=>l.config.questionTypes[o]),d=g(l=>l.updateQuestionType),c=g(l=>l.previewMultiStatement),C=g(l=>l.setPreviewMultiStatement),x=g(l=>l.heatmapPreviewPin);if(!a)return e.jsx("p",{className:"text-sm text-slate-500",children:"No configuration available for this type."});const n=l=>d(o,l),S=L.includes(o),T=r.includes("star"),h=r.includes("emoji"),v=r.includes("numbered"),N=r.includes("drag"),w=r.includes("dropdown"),k=r.includes("radio"),m=h||T||v||k;return e.jsxs("div",{className:"space-y-4",children:[S&&e.jsx(f,{label:"Preview multiple statements",checked:c,onChange:C}),o==="MCQ"&&"optionGap"in a&&e.jsx(s,{title:"Option style",children:e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsx(j,{label:"Option style",value:a.optionStyle??a.cardStyle??"outlined",onChange:l=>n({optionStyle:l}),options:[{value:"outlined",label:"Outlined"},{value:"filled",label:"Filled"},{value:"minimal",label:"Minimal"}]}),e.jsx(u,{label:"Option gap",value:a.optionGap,onChange:l=>n({optionGap:l}),min:0,max:32}),e.jsx(u,{label:"Border radius",value:a.borderRadius,onChange:l=>n({borderRadius:l}),min:0,max:24}),e.jsx(u,{label:"Option padding",value:a.optionPadding??12,onChange:l=>n({optionPadding:l}),min:4,max:24})]})}),o==="TEXTFIELD"&&"defaultPlaceholder"in a&&e.jsx(s,{title:"Text input",children:e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsxs("label",{className:"space-y-1 sm:col-span-2",children:[e.jsx("span",{className:"text-[10px] font-semibold uppercase tracking-wider text-slate-500",children:"Default placeholder"}),e.jsx("input",{className:"w-full rounded-lg border border-white/10 bg-slate-950/50 px-3 py-2 text-sm text-white",value:a.defaultPlaceholder,onChange:l=>n({defaultPlaceholder:l.target.value})})]}),e.jsx(t,{label:"Input radius (px)",value:a.inputRadius,onChange:l=>n({inputRadius:l}),min:0,max:24}),e.jsx(i,{label:"Border color",value:a.borderColor,onChange:l=>n({borderColor:l})}),e.jsx(i,{label:"Placeholder color",value:a.placeholderColor,onChange:l=>n({placeholderColor:l})})]})}),o==="NPS_SCALE"&&"buttonStyle"in a&&e.jsxs(e.Fragment,{children:[e.jsx(s,{title:"NPS buttons",children:e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsx(j,{label:"Button style",value:a.buttonStyle,onChange:l=>n({buttonStyle:l}),options:[{value:"standard",label:"Radio"},{value:"numbered",label:"Numbered badges"},{value:"pill",label:"Pill"}]}),e.jsx(i,{label:"Selected fill",value:a.selectedFill,onChange:l=>n({selectedFill:l})}),e.jsx(i,{label:"Track bar",value:a.trackBarColor,onChange:l=>n({trackBarColor:l})}),e.jsx(i,{label:"Track highlight",value:a.trackHighlightColor,onChange:l=>n({trackHighlightColor:l})})]})}),e.jsx(s,{title:"Hint labels",children:e.jsx(P,{values:a,onPatch:n})}),e.jsx(s,{title:"Number labels",children:e.jsx(p,{values:a,onPatch:n})})]}),o==="CFM_MATRIX"&&"rowLabelWidth"in a&&e.jsxs(e.Fragment,{children:[e.jsx(s,{title:"Matrix layout",children:e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsx(t,{label:"Row label width (px)",value:a.rowLabelWidth,onChange:l=>n({rowLabelWidth:l}),min:120,max:280}),e.jsx(t,{label:"Bipolar column width (%)",value:a.bipolarColumnWidthPercent,onChange:l=>n({bipolarColumnWidthPercent:l}),min:15,max:40})]})}),e.jsx(s,{title:"Label items",children:e.jsx(b,{values:a,onPatch:n})})]}),o==="CSAT_MATRIX"&&"emojiSize"in a&&e.jsxs(e.Fragment,{children:[(h||m)&&e.jsxs(s,{title:`${M.CSAT_MATRIX} — ${r.replace("CSAT_","")}`,children:[e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[h&&e.jsx(t,{label:"Emoji size (px)",value:a.emojiSize,onChange:l=>n({emojiSize:l}),min:16,max:40}),m&&e.jsx(u,{label:"Unselected opacity",value:Math.round(a.unselectedOpacity*100),onChange:l=>n({unselectedOpacity:l/100}),min:10,max:100})]}),e.jsx("p",{className:"text-xs text-slate-500",children:"Selected cell color and focus ring come from Theme → Question card."})]}),e.jsx(s,{title:"Label items",children:e.jsx(b,{values:a,onPatch:n})}),v&&e.jsx(s,{title:"Number labels",children:e.jsx(p,{values:a,onPatch:n,count:10})})]}),o==="RATING_MATRIX"&&"unselectedStarOpacity"in a&&e.jsxs(e.Fragment,{children:[(h||m)&&e.jsxs(s,{title:`Rating — ${r.replace("RATING_","")}`,children:[e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[h&&e.jsx(t,{label:"Emoji size (px)",value:a.emojiSize,onChange:l=>n({emojiSize:l}),min:16,max:40}),m&&e.jsx(u,{label:"Unselected opacity",value:Math.round(a.unselectedStarOpacity*100),onChange:l=>n({unselectedStarOpacity:l/100}),min:10,max:100})]}),e.jsx("p",{className:"text-xs text-slate-500",children:"Selected cell color and focus ring come from Theme → Question card."})]}),e.jsx(s,{title:"Label items",children:e.jsx(b,{values:a,onPatch:n})}),v&&e.jsx(s,{title:"Number labels",children:e.jsx(p,{values:a,onPatch:n,count:10})})]}),o==="SLIDER_MATRIX"&&"trackColor"in a&&e.jsxs(e.Fragment,{children:[e.jsx(s,{title:"Slider track",children:e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsx(i,{label:"Track",value:a.trackColor,onChange:l=>n({trackColor:l})}),e.jsx(i,{label:"Thumb",value:a.thumbColor,onChange:l=>n({thumbColor:l})}),e.jsx(i,{label:"Tick",value:a.tickColor,onChange:l=>n({tickColor:l})}),e.jsx(t,{label:"Row label width (px)",value:a.rowLabelWidth,onChange:l=>n({rowLabelWidth:l}),min:120,max:280})]})}),e.jsx(s,{title:"Tick label items",children:e.jsx(b,{values:a,onPatch:n})}),e.jsx(s,{title:"Tick number labels",children:e.jsx(p,{values:a,onPatch:n,count:11})})]}),o==="FILE_UPLOAD"&&"dropzoneStyle"in a&&e.jsx(s,{title:"Dropzone",children:e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsx(j,{label:"Dropzone border",value:a.dropzoneStyle,onChange:l=>n({dropzoneStyle:l}),options:[{value:"dashed",label:"Dashed"},{value:"solid",label:"Solid"}]}),e.jsx(i,{label:"Border color",value:a.borderColor??a.accentColor,onChange:l=>n({borderColor:l})}),e.jsx(i,{label:"Fill color",value:a.dropzoneFillColor,onChange:l=>n({dropzoneFillColor:l})}),e.jsx(t,{label:"Padding (px)",value:a.dropzonePadding,onChange:l=>n({dropzonePadding:l}),min:12,max:48})]})}),o==="HEATMAP"&&"pinColor"in a&&e.jsx(s,{title:"Heatmap pin",children:e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsx(i,{label:"Pin color",value:a.pinColor,onChange:l=>n({pinColor:l})}),e.jsx(i,{label:"Pin border",value:a.pinBorderColor,onChange:l=>n({pinBorderColor:l})}),e.jsx(u,{label:"Pin size",value:a.pinSize,onChange:l=>n({pinSize:l}),min:8,max:32}),e.jsxs("p",{className:"text-xs text-slate-500 sm:col-span-2",children:["Click the heatmap image in the preview to place a pin and see styling update live. Pin preview position: ",Math.round(x.x*100),"%, ",Math.round(x.y*100),"%"]})]})}),o==="RANK_ORDER"&&"drag"in a&&e.jsx(s,{title:N?"Drag & drop":w?"Dropdown rank":"Rank order",children:e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[N&&e.jsxs(e.Fragment,{children:[e.jsx(i,{label:"Item background",value:a.drag.itemBg,onChange:l=>n({drag:{...a.drag,itemBg:l}})}),e.jsx(i,{label:"Drag handle",value:a.drag.dragHandleColor,onChange:l=>n({drag:{...a.drag,dragHandleColor:l}})}),e.jsx(i,{label:"Rank badge",value:a.drag.rankBadgeColor,onChange:l=>n({drag:{...a.drag,rankBadgeColor:l}})})]}),w&&e.jsxs(e.Fragment,{children:[e.jsx(i,{label:"Item background",value:a.dropdown.itemBg,onChange:l=>n({dropdown:{...a.dropdown,itemBg:l}})}),e.jsx(i,{label:"Select border",value:a.dropdown.selectBorderColor,onChange:l=>n({dropdown:{...a.dropdown,selectBorderColor:l}})}),e.jsx(i,{label:"Rank badge",value:a.dropdown.rankBadgeColor,onChange:l=>n({dropdown:{...a.dropdown,rankBadgeColor:l}})})]})]})})]})}export{B as TypePanel};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:"Inter", system-ui, sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-400:oklch(70.4% .191 22.216);--color-red-500:oklch(63.7% .237 25.331);--color-orange-400:oklch(75% .183 55.934);--color-orange-500:oklch(70.5% .213 47.604);--color-amber-100:oklch(96.2% .059 95.617);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-300:oklch(87.9% .169 91.605);--color-amber-400:oklch(82.8% .189 84.429);--color-amber-500:oklch(76.9% .188 70.08);--color-emerald-300:oklch(84.5% .143 164.978);--color-emerald-400:oklch(76.5% .177 163.223);--color-emerald-500:oklch(69.6% .17 162.48);--color-cyan-500:oklch(71.5% .143 215.221);--color-indigo-200:oklch(87% .065 274.039);--color-indigo-300:oklch(78.5% .115 274.713);--color-indigo-400:oklch(67.3% .182 276.935);--color-indigo-500:oklch(58.5% .233 277.117);--color-indigo-600:oklch(51.1% .262 276.966);--color-slate-50:oklch(98.4% .003 247.858);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-slate-950:oklch(12.9% .042 264.695);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-md:28rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height: 1.2 ;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wide:.025em;--tracking-wider:.05em;--leading-tight:1.25;--leading-snug:1.375;--leading-normal:1.5;--leading-relaxed:1.625;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--font-display:"Outfit", system-ui, sans-serif}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-0{top:0;right:0;bottom:0;left:0}.inset-y-0{inset-block:0}.top-1\/2{top:50%}.left-1\/2{left:50%}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.col-span-2{grid-column:span 2/span 2}.container{width:100%}@media(min-width:40rem){.container{max-width:40rem}}@media(min-width:48rem){.container{max-width:48rem}}@media(min-width:64rem){.container{max-width:64rem}}@media(min-width:80rem){.container{max-width:80rem}}@media(min-width:96rem){.container{max-width:96rem}}.m-3{margin:calc(var(--spacing) * 3)}.mx-auto{margin-inline:auto}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.h-1{height:var(--spacing)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2{height:calc(var(--spacing) * 2)}.h-3{height:calc(var(--spacing) * 3)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-14{height:calc(var(--spacing) * 14)}.h-16{height:calc(var(--spacing) * 16)}.h-32{height:calc(var(--spacing) * 32)}.h-48{height:calc(var(--spacing) * 48)}.h-\[240px\]{height:240px}.h-full{height:100%}.max-h-6{max-height:calc(var(--spacing) * 6)}.max-h-12{max-height:calc(var(--spacing) * 12)}.min-h-0{min-height:0}.w-1{width:var(--spacing)}.w-1\.5{width:calc(var(--spacing) * 1.5)}.w-1\/3{width:33.3333%}.w-2{width:calc(var(--spacing) * 2)}.w-3{width:calc(var(--spacing) * 3)}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-7{width:calc(var(--spacing) * 7)}.w-10{width:calc(var(--spacing) * 10)}.w-12{width:calc(var(--spacing) * 12)}.w-16{width:calc(var(--spacing) * 16)}.w-20{width:calc(var(--spacing) * 20)}.w-64{width:calc(var(--spacing) * 64)}.w-\[35\%\]{width:35%}.w-auto{width:auto}.w-full{width:100%}.w-px{width:1px}.max-w-\[200px\]{max-width:200px}.max-w-md{max-width:var(--container-md)}.min-w-0{min-width:0}.min-w-\[320px\]{min-width:320px}.flex-1{flex:1}.shrink-0{flex-shrink:0}.-translate-x-1\/2{--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-0{--tw-translate-x:0;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-6{--tw-translate-x:calc(var(--spacing) * 6);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y)}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.resize{resize:both}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-cols-\[1fr_1fr_auto\]{grid-template-columns:1fr 1fr auto}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-8>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)))}.self-end{align-self:flex-end}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-\[32px\]{border-radius:32px}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-none{border-radius:0}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-l-2{border-left-style:var(--tw-border-style);border-left-width:2px}.border-l-4{border-left-style:var(--tw-border-style);border-left-width:4px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-amber-500\/30{border-color:#f99c004d}@supports (color:color-mix(in lab,red,red)){.border-amber-500\/30{border-color:color-mix(in oklab,var(--color-amber-500) 30%,transparent)}}.border-emerald-500\/20{border-color:#00bb7f33}@supports (color:color-mix(in lab,red,red)){.border-emerald-500\/20{border-color:color-mix(in oklab,var(--color-emerald-500) 20%,transparent)}}.border-indigo-500{border-color:var(--color-indigo-500)}.border-indigo-500\/20{border-color:#625fff33}@supports (color:color-mix(in lab,red,red)){.border-indigo-500\/20{border-color:color-mix(in oklab,var(--color-indigo-500) 20%,transparent)}}.border-indigo-500\/30{border-color:#625fff4d}@supports (color:color-mix(in lab,red,red)){.border-indigo-500\/30{border-color:color-mix(in oklab,var(--color-indigo-500) 30%,transparent)}}.border-indigo-500\/60{border-color:#625fff99}@supports (color:color-mix(in lab,red,red)){.border-indigo-500\/60{border-color:color-mix(in oklab,var(--color-indigo-500) 60%,transparent)}}.border-slate-700{border-color:var(--color-slate-700)}.border-transparent{border-color:#0000}.border-white\/5{border-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.border-white\/5{border-color:color-mix(in oklab,var(--color-white) 5%,transparent)}}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.border-white\/10{border-color:color-mix(in oklab,var(--color-white) 10%,transparent)}}.bg-amber-500\/10{background-color:#f99c001a}@supports (color:color-mix(in lab,red,red)){.bg-amber-500\/10{background-color:color-mix(in oklab,var(--color-amber-500) 10%,transparent)}}.bg-black\/30{background-color:#0000004d}@supports (color:color-mix(in lab,red,red)){.bg-black\/30{background-color:color-mix(in oklab,var(--color-black) 30%,transparent)}}.bg-black\/60{background-color:#0009}@supports (color:color-mix(in lab,red,red)){.bg-black\/60{background-color:color-mix(in oklab,var(--color-black) 60%,transparent)}}.bg-emerald-400{background-color:var(--color-emerald-400)}.bg-emerald-500{background-color:var(--color-emerald-500)}.bg-emerald-500\/5{background-color:#00bb7f0d}@supports (color:color-mix(in lab,red,red)){.bg-emerald-500\/5{background-color:color-mix(in oklab,var(--color-emerald-500) 5%,transparent)}}.bg-indigo-400{background-color:var(--color-indigo-400)}.bg-indigo-500{background-color:var(--color-indigo-500)}.bg-indigo-500\/10{background-color:#625fff1a}@supports (color:color-mix(in lab,red,red)){.bg-indigo-500\/10{background-color:color-mix(in oklab,var(--color-indigo-500) 10%,transparent)}}.bg-indigo-500\/15{background-color:#625fff26}@supports (color:color-mix(in lab,red,red)){.bg-indigo-500\/15{background-color:color-mix(in oklab,var(--color-indigo-500) 15%,transparent)}}.bg-indigo-500\/20{background-color:#625fff33}@supports (color:color-mix(in lab,red,red)){.bg-indigo-500\/20{background-color:color-mix(in oklab,var(--color-indigo-500) 20%,transparent)}}.bg-indigo-500\/30{background-color:#625fff4d}@supports (color:color-mix(in lab,red,red)){.bg-indigo-500\/30{background-color:color-mix(in oklab,var(--color-indigo-500) 30%,transparent)}}.bg-indigo-600{background-color:var(--color-indigo-600)}.bg-orange-500\/20{background-color:#fe6e0033}@supports (color:color-mix(in lab,red,red)){.bg-orange-500\/20{background-color:color-mix(in oklab,var(--color-orange-500) 20%,transparent)}}.bg-slate-50\/50{background-color:#f8fafc80}@supports (color:color-mix(in lab,red,red)){.bg-slate-50\/50{background-color:color-mix(in oklab,var(--color-slate-50) 50%,transparent)}}.bg-slate-100{background-color:var(--color-slate-100)}.bg-slate-400{background-color:var(--color-slate-400)}.bg-slate-600{background-color:var(--color-slate-600)}.bg-slate-700{background-color:var(--color-slate-700)}.bg-slate-800{background-color:var(--color-slate-800)}.bg-slate-800\/40{background-color:#1d293d66}@supports (color:color-mix(in lab,red,red)){.bg-slate-800\/40{background-color:color-mix(in oklab,var(--color-slate-800) 40%,transparent)}}.bg-slate-800\/50{background-color:#1d293d80}@supports (color:color-mix(in lab,red,red)){.bg-slate-800\/50{background-color:color-mix(in oklab,var(--color-slate-800) 50%,transparent)}}.bg-slate-800\/60{background-color:#1d293d99}@supports (color:color-mix(in lab,red,red)){.bg-slate-800\/60{background-color:color-mix(in oklab,var(--color-slate-800) 60%,transparent)}}.bg-slate-900{background-color:var(--color-slate-900)}.bg-slate-900\/30{background-color:#0f172b4d}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/30{background-color:color-mix(in oklab,var(--color-slate-900) 30%,transparent)}}.bg-slate-900\/40{background-color:#0f172b66}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/40{background-color:color-mix(in oklab,var(--color-slate-900) 40%,transparent)}}.bg-slate-900\/50{background-color:#0f172b80}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/50{background-color:color-mix(in oklab,var(--color-slate-900) 50%,transparent)}}.bg-slate-900\/80{background-color:#0f172bcc}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/80{background-color:color-mix(in oklab,var(--color-slate-900) 80%,transparent)}}.bg-slate-950{background-color:var(--color-slate-950)}.bg-slate-950\/20{background-color:#02061833}@supports (color:color-mix(in lab,red,red)){.bg-slate-950\/20{background-color:color-mix(in oklab,var(--color-slate-950) 20%,transparent)}}.bg-slate-950\/50{background-color:#02061880}@supports (color:color-mix(in lab,red,red)){.bg-slate-950\/50{background-color:color-mix(in oklab,var(--color-slate-950) 50%,transparent)}}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.bg-white\/5{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.bg-white\/5{background-color:color-mix(in oklab,var(--color-white) 5%,transparent)}}.bg-white\/10{background-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.bg-white\/10{background-color:color-mix(in oklab,var(--color-white) 10%,transparent)}}.bg-gradient-to-r{--tw-gradient-position:to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.bg-gradient-to-tr{--tw-gradient-position:to top right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-indigo-500{--tw-gradient-from:var(--color-indigo-500);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.from-white{--tw-gradient-from:var(--color-white);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.to-cyan-500{--tw-gradient-to:var(--color-cyan-500);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.to-slate-300{--tw-gradient-to:var(--color-slate-300);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.bg-clip-text{-webkit-background-clip:text;background-clip:text}.object-contain{object-fit:contain}.p-0{padding:0}.p-0\.5{padding:calc(var(--spacing) * .5)}.p-1{padding:var(--spacing)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.p-10{padding:calc(var(--spacing) * 10)}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pl-4{padding-left:calc(var(--spacing) * 4)}.text-center{text-align:center}.text-left{text-align:left}.font-display{font-family:var(--font-display)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.leading-normal{--tw-leading:var(--leading-normal);line-height:var(--leading-normal)}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.break-all{word-break:break-all}.text-amber-100{color:var(--color-amber-100)}.text-amber-200\/80{color:#fee685cc}@supports (color:color-mix(in lab,red,red)){.text-amber-200\/80{color:color-mix(in oklab,var(--color-amber-200) 80%,transparent)}}.text-amber-300{color:var(--color-amber-300)}.text-amber-400{color:var(--color-amber-400)}.text-amber-400\/90{color:#fcbb00e6}@supports (color:color-mix(in lab,red,red)){.text-amber-400\/90{color:color-mix(in oklab,var(--color-amber-400) 90%,transparent)}}.text-emerald-300{color:var(--color-emerald-300)}.text-emerald-400{color:var(--color-emerald-400)}.text-indigo-200{color:var(--color-indigo-200)}.text-indigo-300{color:var(--color-indigo-300)}.text-indigo-400{color:var(--color-indigo-400)}.text-orange-400{color:var(--color-orange-400)}.text-red-400{color:var(--color-red-400)}.text-red-500{color:var(--color-red-500)}.text-slate-200{color:var(--color-slate-200)}.text-slate-300{color:var(--color-slate-300)}.text-slate-400{color:var(--color-slate-400)}.text-slate-500{color:var(--color-slate-500)}.text-transparent{color:#0000}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.accent-indigo-500{accent-color:var(--color-indigo-500)}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring,.ring-1{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-indigo-500\/10{--tw-shadow-color:#625fff1a}@supports (color:color-mix(in lab,red,red)){.shadow-indigo-500\/10{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-indigo-500) 10%, transparent) var(--tw-shadow-alpha), transparent)}}.shadow-indigo-500\/20{--tw-shadow-color:#625fff33}@supports (color:color-mix(in lab,red,red)){.shadow-indigo-500\/20{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-indigo-500) 20%, transparent) var(--tw-shadow-alpha), transparent)}}.shadow-indigo-500\/30{--tw-shadow-color:#625fff4d}@supports (color:color-mix(in lab,red,red)){.shadow-indigo-500\/30{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-indigo-500) 30%, transparent) var(--tw-shadow-alpha), transparent)}}.ring-indigo-500\/40{--tw-ring-color:#625fff66}@supports (color:color-mix(in lab,red,red)){.ring-indigo-500\/40{--tw-ring-color:color-mix(in oklab, var(--color-indigo-500) 40%, transparent)}}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.select-none{-webkit-user-select:none;user-select:none}@media(hover:hover){.group-hover\:bg-indigo-200:is(:where(.group):hover *){background-color:var(--color-indigo-200)}.group-hover\:bg-indigo-500\/20:is(:where(.group):hover *){background-color:#625fff33}@supports (color:color-mix(in lab,red,red)){.group-hover\:bg-indigo-500\/20:is(:where(.group):hover *){background-color:color-mix(in oklab,var(--color-indigo-500) 20%,transparent)}}.group-hover\:bg-indigo-500\/50:is(:where(.group):hover *){background-color:#625fff80}@supports (color:color-mix(in lab,red,red)){.group-hover\:bg-indigo-500\/50:is(:where(.group):hover *){background-color:color-mix(in oklab,var(--color-indigo-500) 50%,transparent)}}.hover\:border-indigo-500\/50:hover{border-color:#625fff80}@supports (color:color-mix(in lab,red,red)){.hover\:border-indigo-500\/50:hover{border-color:color-mix(in oklab,var(--color-indigo-500) 50%,transparent)}}.hover\:border-white\/10:hover{border-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.hover\:border-white\/10:hover{border-color:color-mix(in oklab,var(--color-white) 10%,transparent)}}.hover\:border-white\/20:hover{border-color:#fff3}@supports (color:color-mix(in lab,red,red)){.hover\:border-white\/20:hover{border-color:color-mix(in oklab,var(--color-white) 20%,transparent)}}.hover\:bg-indigo-500:hover{background-color:var(--color-indigo-500)}.hover\:bg-red-500\/10:hover{background-color:#fb2c361a}@supports (color:color-mix(in lab,red,red)){.hover\:bg-red-500\/10:hover{background-color:color-mix(in oklab,var(--color-red-500) 10%,transparent)}}.hover\:bg-slate-900\/80:hover{background-color:#0f172bcc}@supports (color:color-mix(in lab,red,red)){.hover\:bg-slate-900\/80:hover{background-color:color-mix(in oklab,var(--color-slate-900) 80%,transparent)}}.hover\:bg-white\/5:hover{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/5:hover{background-color:color-mix(in oklab,var(--color-white) 5%,transparent)}}.hover\:bg-white\/\[0\.03\]:hover{background-color:#ffffff08}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/\[0\.03\]:hover{background-color:color-mix(in oklab,var(--color-white) 3%,transparent)}}.hover\:text-indigo-300:hover{color:var(--color-indigo-300)}.hover\:text-red-400:hover{color:var(--color-red-400)}.hover\:text-slate-200:hover{color:var(--color-slate-200)}.hover\:text-slate-300:hover{color:var(--color-slate-300)}.hover\:text-white:hover{color:var(--color-white)}.hover\:underline:hover{text-decoration-line:underline}}.focus\:border-indigo-500:focus{border-color:var(--color-indigo-500)}.focus\:ring-1:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:ring-indigo-500:focus{--tw-ring-color:var(--color-indigo-500)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-0:disabled{opacity:0}.disabled\:opacity-30:disabled{opacity:.3}.disabled\:opacity-60:disabled{opacity:.6}@media(min-width:40rem){.sm\:col-span-2{grid-column:span 2/span 2}.sm\:flex{display:flex}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(min-width:48rem){.md\:m-4{margin:calc(var(--spacing) * 4)}.md\:flex{display:flex}.md\:hidden{display:none}.md\:p-6{padding:calc(var(--spacing) * 6)}}@media(min-width:64rem){.lg\:m-6{margin:calc(var(--spacing) * 6)}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:hidden{display:none}.lg\:h-\[min\(720px\,calc\(100vh-220px\)\)\]{height:min(720px,100vh - 220px)}.lg\:w-52{width:calc(var(--spacing) * 52)}.lg\:flex-row{flex-direction:row}.lg\:gap-6{gap:calc(var(--spacing) * 6)}.lg\:p-8{padding:calc(var(--spacing) * 8)}.lg\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}}}html,body,#root{height:100%;margin:0}body{font-family:var(--font-sans);color:#f1f5f9;background:#020617;overflow:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#0f172a4d}::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:#fff3}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}
|