@desktalk/miniapp-preference 0.1.0-alpha.1 → 0.1.0-alpha.2
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/frontend.js +31 -2994
- package/dist/frontend.js.map +1 -1
- package/package.json +5 -5
package/dist/frontend.js
CHANGED
|
@@ -1,451 +1,4 @@
|
|
|
1
|
-
(() => {
|
|
2
|
-
if (typeof document === 'undefined') return;
|
|
3
|
-
const styleId = "desktalk-style-desktalk-miniapp-preference-19q4gw2";
|
|
4
|
-
if (document.getElementById(styleId)) return;
|
|
5
|
-
const style = document.createElement('style');
|
|
6
|
-
style.id = styleId;
|
|
7
|
-
style.textContent = "/* src/styles/PreferenceApp.module.css */\n.PreferenceApp_root {\n display: flex;\n height: 100%;\n overflow: hidden;\n background: var(--dt-window-body);\n color: var(--dt-text);\n font-family: var(--font-ui, \"Work Sans\", system-ui, -apple-system, sans-serif);\n}\n.PreferenceApp_rootCompact {\n flex-direction: column;\n}\n.PreferenceApp_sidebar {\n width: 180px;\n min-width: 180px;\n display: flex;\n flex-direction: column;\n align-self: stretch;\n overflow-y: auto;\n padding: 8px 0;\n border-right: 1px solid var(--dt-border);\n}\n.PreferenceApp_sidebarHeader {\n padding: 12px 16px 8px;\n color: var(--dt-text-muted);\n font-size: 11px;\n font-weight: 600;\n font-family: var(--font-display, \"Sora\", system-ui, -apple-system, sans-serif);\n letter-spacing: 0.05em;\n text-transform: uppercase;\n}\n.PreferenceApp_categoryItem {\n display: flex;\n width: 100%;\n align-items: center;\n gap: 8px;\n padding: 8px 16px;\n border: none;\n background: none;\n color: var(--dt-text);\n cursor: pointer;\n font-family: inherit;\n font-size: 13px;\n text-align: left;\n transition: background 0.1s;\n}\n.PreferenceApp_categoryItem:hover {\n background: var(--dt-surface-hover);\n}\n.PreferenceApp_categoryItemActive {\n background: var(--dt-surface);\n border-left: 3px solid var(--dt-accent);\n color: var(--dt-accent);\n font-weight: 500;\n padding-left: 13px;\n}\n.PreferenceApp_categoryIcon {\n width: 20px;\n font-size: 15px;\n text-align: center;\n}\n.PreferenceApp_categoryText {\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.PreferenceApp_settingsPanel {\n flex: 1;\n min-width: 0;\n overflow-y: auto;\n padding: 0;\n}\n.PreferenceApp_section {\n padding: 20px 24px 8px;\n}\n.PreferenceApp_sectionTitle {\n margin-bottom: 4px;\n padding-bottom: 8px;\n border-bottom: 1px solid var(--dt-border);\n color: var(--dt-text-muted);\n font-size: 13px;\n font-weight: 600;\n font-family: var(--font-display, \"Sora\", system-ui, -apple-system, sans-serif);\n letter-spacing: 0.04em;\n text-transform: uppercase;\n}\n.PreferenceApp_row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n padding: 12px 0;\n border-bottom: 1px solid var(--dt-border-subtle);\n}\n.PreferenceApp_row:last-child {\n border-bottom: none;\n}\n.PreferenceApp_rowInfo {\n flex: 1;\n min-width: 0;\n}\n.PreferenceApp_rowLabel {\n margin-bottom: 2px;\n font-size: 14px;\n font-weight: 500;\n font-family: var(--font-ui, \"Work Sans\", system-ui, -apple-system, sans-serif);\n}\n.PreferenceApp_rowDescription {\n color: var(--dt-text-muted);\n font-size: 12px;\n line-height: 1.4;\n}\n.PreferenceApp_rowRestartBadge {\n display: inline-block;\n margin-left: 6px;\n padding: 1px 5px;\n border-radius: 3px;\n background: var(--dt-warning-subtle);\n color: var(--dt-warning);\n font-size: 10px;\n font-weight: 600;\n letter-spacing: 0.03em;\n text-transform: uppercase;\n}\n.PreferenceApp_rowControl {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 8px;\n}\n.PreferenceApp_providerGroup {\n display: flex;\n flex-direction: column;\n gap: 12px;\n padding: 12px 0 18px;\n border-bottom: 1px solid var(--dt-border-subtle);\n}\n.PreferenceApp_providerGroupHeader {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 12px;\n}\n.PreferenceApp_providerList {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n.PreferenceApp_providerCard {\n margin: 0;\n}\n.PreferenceApp_providerCard dt-card {\n display: block;\n margin: 0;\n}\n.PreferenceApp_providerCardBody {\n display: flex;\n flex-direction: column;\n gap: 14px;\n}\n.PreferenceApp_providerCardHeader {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 12px;\n}\n.PreferenceApp_providerCardTitleRow {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.PreferenceApp_providerCardTitle {\n font-size: 14px;\n font-weight: 600;\n font-family: var(--font-display, \"Sora\", system-ui, -apple-system, sans-serif);\n letter-spacing: -0.01em;\n}\n.PreferenceApp_providerDefaultBadge {\n display: inline-flex;\n align-items: center;\n padding: 2px 8px;\n border-radius: 999px;\n background: var(--dt-accent-ghost);\n color: var(--dt-accent);\n font-size: 11px;\n font-weight: 600;\n}\n.PreferenceApp_providerCardActions {\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-end;\n gap: 8px;\n}\n.PreferenceApp_providerActionButtonWrap,\n.PreferenceApp_providerButtonWrap {\n display: inline-flex;\n}\n.PreferenceApp_providerActionButtonWrap dt-button,\n.PreferenceApp_providerButtonWrap dt-button {\n display: inline-flex;\n}\n.PreferenceApp_providerFieldGrid {\n display: grid;\n grid-template-columns: repeat(2, minmax(0, 1fr));\n gap: 12px;\n}\n.PreferenceApp_providerField {\n display: flex;\n min-width: 0;\n flex-direction: column;\n gap: 6px;\n}\n.PreferenceApp_providerFieldLabel {\n color: var(--dt-text-muted);\n font-size: 11px;\n font-weight: 600;\n font-family: var(--font-display, \"Sora\", system-ui, -apple-system, sans-serif);\n letter-spacing: 0.04em;\n text-transform: uppercase;\n}\n.PreferenceApp_providerSelectWrap {\n width: 100%;\n}\n.PreferenceApp_providerSelectWrap dt-select {\n display: block;\n width: 100%;\n}\n.PreferenceApp_selectWrap {\n min-width: 120px;\n}\n.PreferenceApp_selectWrap dt-select {\n display: block;\n min-width: 120px;\n}\n.PreferenceApp_textInput,\n.PreferenceApp_numberInput,\n.PreferenceApp_dropdown {\n padding: 6px 10px;\n border: 1px solid var(--dt-border);\n border-radius: 6px;\n background: var(--dt-surface);\n color: var(--dt-text);\n font-family: var(--font-ui, \"Work Sans\", system-ui, -apple-system, sans-serif);\n font-size: 13px;\n outline: none;\n transition:\n border-color 0.15s,\n box-shadow 0.15s,\n background 0.15s;\n}\n.PreferenceApp_textInput:focus,\n.PreferenceApp_numberInput:focus,\n.PreferenceApp_dropdown:focus {\n border-color: var(--dt-accent);\n box-shadow: 0 0 0 3px var(--dt-accent-ghost);\n}\n.PreferenceApp_textInput {\n width: 220px;\n}\n.PreferenceApp_textInput::placeholder {\n color: var(--dt-text-muted);\n}\n.PreferenceApp_textInputSensitive {\n font-family: var(--font-mono);\n letter-spacing: 0.05em;\n}\n.PreferenceApp_numberInput {\n width: 100px;\n -moz-appearance: textfield;\n}\n.PreferenceApp_numberInput::-webkit-inner-spin-button,\n.PreferenceApp_numberInput::-webkit-outer-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n.PreferenceApp_dropdown {\n min-width: 120px;\n cursor: pointer;\n}\n.PreferenceApp_colorControl {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.PreferenceApp_colorInput {\n width: 40px;\n height: 36px;\n padding: 2px;\n border: 1px solid var(--dt-border);\n border-radius: 8px;\n background: var(--dt-surface);\n cursor: pointer;\n}\n.PreferenceApp_toggle {\n position: relative;\n width: 42px;\n height: 24px;\n flex-shrink: 0;\n cursor: pointer;\n}\n.PreferenceApp_toggleInput {\n position: absolute;\n width: 0;\n height: 0;\n opacity: 0;\n}\n.PreferenceApp_toggleTrack {\n position: absolute;\n inset: 0;\n border: 1px solid var(--dt-border);\n border-radius: 12px;\n background: var(--dt-surface);\n transition: background 0.2s, border-color 0.2s;\n}\n.PreferenceApp_toggleInput:checked + .PreferenceApp_toggleTrack {\n border-color: var(--dt-accent);\n background: var(--dt-accent);\n}\n.PreferenceApp_toggleKnob {\n position: absolute;\n top: 3px;\n left: 3px;\n width: 18px;\n height: 18px;\n border-radius: 50%;\n background: var(--dt-text-on-accent);\n transition: transform 0.2s;\n pointer-events: none;\n}\n.PreferenceApp_toggleInput:checked ~ .PreferenceApp_toggleKnob {\n transform: translateX(18px);\n}\n.PreferenceApp_notification {\n position: fixed;\n bottom: 80px;\n left: 50%;\n z-index: 1000;\n padding: 10px 20px;\n border: 1px solid color-mix(in oklab, var(--dt-warning) 40%, var(--dt-border));\n border-radius: 8px;\n background: color-mix(in oklab, var(--dt-warning) 20%, var(--dt-surface));\n box-shadow: 0 14px 28px var(--dt-shadow-color);\n color: var(--dt-text);\n font-size: 13px;\n font-weight: 500;\n transform: translateX(-50%);\n animation: PreferenceApp_slideUp 0.3s ease-out;\n}\n.PreferenceApp_rootCompact .PreferenceApp_sidebar {\n width: 100%;\n min-width: 0;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n overflow-x: auto;\n overflow-y: visible;\n padding: 10px 12px;\n border-right: none;\n border-bottom: 1px solid var(--dt-border);\n background: color-mix(in oklab, var(--dt-surface) 72%, transparent);\n}\n.PreferenceApp_rootCompact .PreferenceApp_sidebarHeader {\n flex: 0 0 auto;\n padding: 0 10px 0 0;\n border-right: 1px solid var(--dt-border-subtle);\n white-space: nowrap;\n}\n.PreferenceApp_rootCompact .PreferenceApp_categoryItem,\n.PreferenceApp_rootCompact .PreferenceApp_categoryItemActive {\n position: relative;\n width: 40px;\n min-width: 40px;\n height: 40px;\n justify-content: center;\n gap: 0;\n padding: 0;\n border: 1px solid transparent;\n border-radius: 10px;\n flex-shrink: 0;\n}\n.PreferenceApp_rootCompact .PreferenceApp_categoryItemActive {\n border-left: 1px solid color-mix(in oklab, var(--dt-accent) 45%, var(--dt-border));\n background: color-mix(in oklab, var(--dt-accent) 12%, var(--dt-surface));\n box-shadow: 0 0 0 1px var(--dt-accent-ghost) inset;\n padding-left: 0;\n}\n.PreferenceApp_rootCompact .PreferenceApp_settingsPanel {\n padding-bottom: 12px;\n}\n.PreferenceApp_rootCompact .PreferenceApp_section {\n padding: 16px 16px 8px;\n}\n.PreferenceApp_rootCompact .PreferenceApp_row {\n align-items: stretch;\n flex-direction: column;\n gap: 12px;\n}\n.PreferenceApp_rootCompact .PreferenceApp_rowControl {\n width: 100%;\n min-width: 0;\n}\n.PreferenceApp_rootCompact .PreferenceApp_providerGroupHeader,\n.PreferenceApp_rootCompact .PreferenceApp_providerCardHeader {\n flex-direction: column;\n}\n.PreferenceApp_rootCompact .PreferenceApp_providerCardActions {\n justify-content: flex-start;\n}\n.PreferenceApp_rootCompact .PreferenceApp_providerActionButtonWrap,\n.PreferenceApp_rootCompact .PreferenceApp_providerButtonWrap {\n width: 100%;\n}\n.PreferenceApp_rootCompact .PreferenceApp_providerFieldGrid {\n grid-template-columns: 1fr;\n}\n.PreferenceApp_rootCompact .PreferenceApp_textInput,\n.PreferenceApp_rootCompact .PreferenceApp_textInputSensitive,\n.PreferenceApp_rootCompact .PreferenceApp_numberInput,\n.PreferenceApp_rootCompact .PreferenceApp_dropdown,\n.PreferenceApp_rootCompact .PreferenceApp_providerActionButtonWrap dt-button,\n.PreferenceApp_rootCompact .PreferenceApp_providerButtonWrap dt-button {\n width: 100%;\n min-width: 0;\n}\n.PreferenceApp_rootCompact .PreferenceApp_colorControl {\n width: 100%;\n}\n.PreferenceApp_rootCompact .PreferenceApp_colorInput {\n flex: 0 0 44px;\n}\n@keyframes PreferenceApp_slideUp {\n from {\n opacity: 0;\n transform: translateX(-50%) translateY(10px);\n }\n to {\n opacity: 1;\n transform: translateX(-50%) translateY(0);\n }\n}\n/*# sourceMappingURL=frontend.css.map */\n";
|
|
8
|
-
document.head.appendChild(style);
|
|
9
|
-
})();
|
|
10
|
-
|
|
11
|
-
// src/frontend.tsx
|
|
12
|
-
import { __dtLocalize } from "@desktalk/sdk";
|
|
13
|
-
|
|
14
|
-
// desktalk-global:react
|
|
15
|
-
var _mod = window.React;
|
|
16
|
-
var Children = _mod.Children;
|
|
17
|
-
var Component = _mod.Component;
|
|
18
|
-
var Fragment = _mod.Fragment;
|
|
19
|
-
var Profiler = _mod.Profiler;
|
|
20
|
-
var PureComponent = _mod.PureComponent;
|
|
21
|
-
var StrictMode = _mod.StrictMode;
|
|
22
|
-
var Suspense = _mod.Suspense;
|
|
23
|
-
var cloneElement = _mod.cloneElement;
|
|
24
|
-
var createContext = _mod.createContext;
|
|
25
|
-
var createElement = _mod.createElement;
|
|
26
|
-
var createRef = _mod.createRef;
|
|
27
|
-
var forwardRef = _mod.forwardRef;
|
|
28
|
-
var isValidElement = _mod.isValidElement;
|
|
29
|
-
var lazy = _mod.lazy;
|
|
30
|
-
var memo = _mod.memo;
|
|
31
|
-
var startTransition = _mod.startTransition;
|
|
32
|
-
var useCallback = _mod.useCallback;
|
|
33
|
-
var useContext = _mod.useContext;
|
|
34
|
-
var useDebugValue = _mod.useDebugValue;
|
|
35
|
-
var useDeferredValue = _mod.useDeferredValue;
|
|
36
|
-
var useEffect = _mod.useEffect;
|
|
37
|
-
var useId = _mod.useId;
|
|
38
|
-
var useImperativeHandle = _mod.useImperativeHandle;
|
|
39
|
-
var useInsertionEffect = _mod.useInsertionEffect;
|
|
40
|
-
var useLayoutEffect = _mod.useLayoutEffect;
|
|
41
|
-
var useMemo = _mod.useMemo;
|
|
42
|
-
var useReducer = _mod.useReducer;
|
|
43
|
-
var useRef = _mod.useRef;
|
|
44
|
-
var useState = _mod.useState;
|
|
45
|
-
var useSyncExternalStore = _mod.useSyncExternalStore;
|
|
46
|
-
var useTransition = _mod.useTransition;
|
|
47
|
-
var version = _mod.version;
|
|
48
|
-
|
|
49
|
-
// desktalk-global:react-dom/client
|
|
50
|
-
var _mod2 = window.ReactDOM;
|
|
51
|
-
var createRoot = _mod2.createRoot;
|
|
52
|
-
var hydrateRoot = _mod2.hydrateRoot;
|
|
53
|
-
|
|
54
|
-
// src/frontend.tsx
|
|
55
|
-
import { useCommand as useCommand2, useEvent, MiniAppIdProvider, WindowIdProvider } from "@desktalk/sdk";
|
|
56
|
-
|
|
57
|
-
// src/schema.ts
|
|
58
|
-
var CATEGORIES = ["General", "Server", "AI", "Voice"];
|
|
59
|
-
var DEFAULT_AI_PROVIDER_ID = "openai";
|
|
60
|
-
var AI_PROVIDER_DEFINITIONS = [
|
|
61
|
-
{ id: "anthropic", label: "Anthropic", supportsApiKey: true, supportsBaseUrl: false },
|
|
62
|
-
{
|
|
63
|
-
id: "azure-openai-responses",
|
|
64
|
-
label: "Azure OpenAI",
|
|
65
|
-
supportsApiKey: true,
|
|
66
|
-
supportsBaseUrl: true
|
|
67
|
-
},
|
|
68
|
-
{ id: DEFAULT_AI_PROVIDER_ID, label: "OpenAI", supportsApiKey: true, supportsBaseUrl: true },
|
|
69
|
-
{ id: "google", label: "Google Gemini", supportsApiKey: true, supportsBaseUrl: false },
|
|
70
|
-
{
|
|
71
|
-
id: "mistral",
|
|
72
|
-
label: "Mistral",
|
|
73
|
-
supportsApiKey: true,
|
|
74
|
-
supportsBaseUrl: true
|
|
75
|
-
},
|
|
76
|
-
{ id: "groq", label: "Groq", supportsApiKey: true, supportsBaseUrl: true },
|
|
77
|
-
{
|
|
78
|
-
id: "cerebras",
|
|
79
|
-
label: "Cerebras",
|
|
80
|
-
supportsApiKey: true,
|
|
81
|
-
supportsBaseUrl: true
|
|
82
|
-
},
|
|
83
|
-
{ id: "xai", label: "xAI", supportsApiKey: true, supportsBaseUrl: true },
|
|
84
|
-
{
|
|
85
|
-
id: "openrouter",
|
|
86
|
-
label: "OpenRouter",
|
|
87
|
-
supportsApiKey: true,
|
|
88
|
-
supportsBaseUrl: true
|
|
89
|
-
},
|
|
90
|
-
{
|
|
91
|
-
id: "vercel-ai-gateway",
|
|
92
|
-
label: "Vercel AI Gateway",
|
|
93
|
-
supportsApiKey: true,
|
|
94
|
-
supportsBaseUrl: true
|
|
95
|
-
},
|
|
96
|
-
{ id: "zai", label: "ZAI", supportsApiKey: true, supportsBaseUrl: false },
|
|
97
|
-
{ id: "opencode", label: "OpenCode Zen", supportsApiKey: true, supportsBaseUrl: false },
|
|
98
|
-
{ id: "opencode-go", label: "OpenCode Go", supportsApiKey: true, supportsBaseUrl: false },
|
|
99
|
-
{
|
|
100
|
-
id: "huggingface",
|
|
101
|
-
label: "Hugging Face",
|
|
102
|
-
supportsApiKey: true,
|
|
103
|
-
supportsBaseUrl: true
|
|
104
|
-
},
|
|
105
|
-
{
|
|
106
|
-
id: "kimi-coding",
|
|
107
|
-
label: "Kimi For Coding",
|
|
108
|
-
supportsApiKey: true,
|
|
109
|
-
supportsBaseUrl: false
|
|
110
|
-
},
|
|
111
|
-
{ id: "minimax", label: "MiniMax", supportsApiKey: true, supportsBaseUrl: false },
|
|
112
|
-
{
|
|
113
|
-
id: "minimax-cn",
|
|
114
|
-
label: "MiniMax China",
|
|
115
|
-
supportsApiKey: true,
|
|
116
|
-
supportsBaseUrl: false
|
|
117
|
-
},
|
|
118
|
-
{ id: "ollama", label: "Ollama", supportsApiKey: false, supportsBaseUrl: true }
|
|
119
|
-
];
|
|
120
|
-
var DEFAULT_VOICE_PROVIDER_ID = "openai-whisper";
|
|
121
|
-
var VOICE_PROVIDER_DEFINITIONS = [
|
|
122
|
-
{
|
|
123
|
-
id: DEFAULT_VOICE_PROVIDER_ID,
|
|
124
|
-
label: "OpenAI Whisper",
|
|
125
|
-
supportsApiKey: true,
|
|
126
|
-
supportsBaseUrl: true,
|
|
127
|
-
supportsModel: true,
|
|
128
|
-
supportsAzureDeployment: false,
|
|
129
|
-
supportsAzureApiVersion: false
|
|
130
|
-
},
|
|
131
|
-
{
|
|
132
|
-
id: "azure-openai-whisper",
|
|
133
|
-
label: "Azure OpenAI Whisper",
|
|
134
|
-
supportsApiKey: true,
|
|
135
|
-
supportsBaseUrl: true,
|
|
136
|
-
supportsModel: false,
|
|
137
|
-
supportsAzureDeployment: true,
|
|
138
|
-
supportsAzureApiVersion: true
|
|
139
|
-
}
|
|
140
|
-
];
|
|
141
|
-
var AI_PROVIDER_IDS = new Set(AI_PROVIDER_DEFINITIONS.map((provider) => provider.id));
|
|
142
|
-
var VOICE_PROVIDER_IDS = new Set(VOICE_PROVIDER_DEFINITIONS.map((provider) => provider.id));
|
|
143
|
-
function getAiProviderDefinition(providerId) {
|
|
144
|
-
return AI_PROVIDER_DEFINITIONS.find((provider) => provider.id === providerId);
|
|
145
|
-
}
|
|
146
|
-
function getAiProviderConfigKeys(providerId) {
|
|
147
|
-
const definition = getAiProviderDefinition(providerId);
|
|
148
|
-
if (!definition) {
|
|
149
|
-
return [];
|
|
150
|
-
}
|
|
151
|
-
const keys = [`ai.providers.${providerId}.model`];
|
|
152
|
-
if (definition.supportsApiKey) {
|
|
153
|
-
keys.push(`ai.providers.${providerId}.apiKey`);
|
|
154
|
-
}
|
|
155
|
-
if (definition.supportsBaseUrl) {
|
|
156
|
-
keys.push(`ai.providers.${providerId}.baseUrl`);
|
|
157
|
-
}
|
|
158
|
-
return keys;
|
|
159
|
-
}
|
|
160
|
-
function parseAiEnabledProviders(value) {
|
|
161
|
-
if (typeof value !== "string") {
|
|
162
|
-
return [DEFAULT_AI_PROVIDER_ID];
|
|
163
|
-
}
|
|
164
|
-
const providers = value.split(",").map((item) => item.trim()).filter(
|
|
165
|
-
(item, index, items) => item && items.indexOf(item) === index && AI_PROVIDER_IDS.has(item)
|
|
166
|
-
);
|
|
167
|
-
return providers.length > 0 ? providers : [DEFAULT_AI_PROVIDER_ID];
|
|
168
|
-
}
|
|
169
|
-
function serializeAiEnabledProviders(providerIds) {
|
|
170
|
-
return parseAiEnabledProviders(providerIds.join(",")).join(",");
|
|
171
|
-
}
|
|
172
|
-
function getVoiceProviderDefinition(providerId) {
|
|
173
|
-
return VOICE_PROVIDER_DEFINITIONS.find((provider) => provider.id === providerId);
|
|
174
|
-
}
|
|
175
|
-
function getVoiceProviderConfigKeys(providerId) {
|
|
176
|
-
const definition = getVoiceProviderDefinition(providerId);
|
|
177
|
-
if (!definition) {
|
|
178
|
-
return [];
|
|
179
|
-
}
|
|
180
|
-
const keys = [];
|
|
181
|
-
if (definition.supportsApiKey) {
|
|
182
|
-
keys.push(`voice.providers.${providerId}.apiKey`);
|
|
183
|
-
}
|
|
184
|
-
if (definition.supportsModel) {
|
|
185
|
-
keys.push(`voice.providers.${providerId}.model`);
|
|
186
|
-
}
|
|
187
|
-
if (definition.supportsBaseUrl) {
|
|
188
|
-
keys.push(`voice.providers.${providerId}.baseUrl`);
|
|
189
|
-
}
|
|
190
|
-
if (definition.supportsAzureDeployment) {
|
|
191
|
-
keys.push(`voice.providers.${providerId}.azureDeployment`);
|
|
192
|
-
}
|
|
193
|
-
if (definition.supportsAzureApiVersion) {
|
|
194
|
-
keys.push(`voice.providers.${providerId}.azureApiVersion`);
|
|
195
|
-
}
|
|
196
|
-
return keys;
|
|
197
|
-
}
|
|
198
|
-
function parseVoiceEnabledProviders(value) {
|
|
199
|
-
if (typeof value !== "string") {
|
|
200
|
-
return [DEFAULT_VOICE_PROVIDER_ID];
|
|
201
|
-
}
|
|
202
|
-
const providers = value.split(",").map((item) => item.trim()).filter(
|
|
203
|
-
(item, index, items) => item && items.indexOf(item) === index && VOICE_PROVIDER_IDS.has(item)
|
|
204
|
-
);
|
|
205
|
-
return providers.length > 0 ? providers : [DEFAULT_VOICE_PROVIDER_ID];
|
|
206
|
-
}
|
|
207
|
-
function serializeVoiceEnabledProviders(providerIds) {
|
|
208
|
-
return parseVoiceEnabledProviders(providerIds.join(",")).join(",");
|
|
209
|
-
}
|
|
210
|
-
function getAiProviderPreferenceSchemas() {
|
|
211
|
-
const schemas = [
|
|
212
|
-
{
|
|
213
|
-
key: "ai.enabledProviders",
|
|
214
|
-
label: "Enabled Providers",
|
|
215
|
-
description: "Ordered list of configured AI providers.",
|
|
216
|
-
type: "string",
|
|
217
|
-
default: DEFAULT_AI_PROVIDER_ID,
|
|
218
|
-
category: "AI"
|
|
219
|
-
},
|
|
220
|
-
{
|
|
221
|
-
key: "ai.defaultProvider",
|
|
222
|
-
label: "Default Provider",
|
|
223
|
-
description: "Provider selected by default for chat and tool execution.",
|
|
224
|
-
type: "string",
|
|
225
|
-
default: DEFAULT_AI_PROVIDER_ID,
|
|
226
|
-
options: AI_PROVIDER_DEFINITIONS.map((provider) => provider.id),
|
|
227
|
-
category: "AI"
|
|
228
|
-
}
|
|
229
|
-
];
|
|
230
|
-
for (const provider of AI_PROVIDER_DEFINITIONS) {
|
|
231
|
-
schemas.push({
|
|
232
|
-
key: `ai.providers.${provider.id}.model`,
|
|
233
|
-
label: `${provider.label} Model`,
|
|
234
|
-
description: `Model identifier to use when ${provider.label} is selected.`,
|
|
235
|
-
type: "string",
|
|
236
|
-
default: "",
|
|
237
|
-
category: "AI"
|
|
238
|
-
});
|
|
239
|
-
if (provider.supportsApiKey) {
|
|
240
|
-
schemas.push({
|
|
241
|
-
key: `ai.providers.${provider.id}.apiKey`,
|
|
242
|
-
label: `${provider.label} API Key`,
|
|
243
|
-
description: `API key for ${provider.label}.`,
|
|
244
|
-
type: "string",
|
|
245
|
-
default: "",
|
|
246
|
-
category: "AI",
|
|
247
|
-
sensitive: true
|
|
248
|
-
});
|
|
249
|
-
}
|
|
250
|
-
if (provider.supportsBaseUrl) {
|
|
251
|
-
schemas.push({
|
|
252
|
-
key: `ai.providers.${provider.id}.baseUrl`,
|
|
253
|
-
label: `${provider.label} Base URL`,
|
|
254
|
-
description: `Optional custom API base URL for ${provider.label}.`,
|
|
255
|
-
type: "string",
|
|
256
|
-
default: "",
|
|
257
|
-
category: "AI"
|
|
258
|
-
});
|
|
259
|
-
}
|
|
260
|
-
}
|
|
261
|
-
schemas.push({
|
|
262
|
-
key: "ai.maxTokens",
|
|
263
|
-
label: "Max Tokens",
|
|
264
|
-
description: "Maximum tokens per AI response.",
|
|
265
|
-
type: "number",
|
|
266
|
-
default: 4096,
|
|
267
|
-
min: 256,
|
|
268
|
-
max: 128e3,
|
|
269
|
-
category: "AI"
|
|
270
|
-
});
|
|
271
|
-
return schemas;
|
|
272
|
-
}
|
|
273
|
-
var AI_PREFERENCE_SCHEMAS = getAiProviderPreferenceSchemas();
|
|
274
|
-
function getVoiceProviderPreferenceSchemas() {
|
|
275
|
-
const schemas = [
|
|
276
|
-
{
|
|
277
|
-
key: "voice.enabledProviders",
|
|
278
|
-
label: "Enabled Providers",
|
|
279
|
-
description: "Ordered list of configured STT providers.",
|
|
280
|
-
type: "string",
|
|
281
|
-
default: DEFAULT_VOICE_PROVIDER_ID,
|
|
282
|
-
category: "Voice"
|
|
283
|
-
},
|
|
284
|
-
{
|
|
285
|
-
key: "voice.defaultProvider",
|
|
286
|
-
label: "Default Provider",
|
|
287
|
-
description: "Provider selected by default for voice transcription.",
|
|
288
|
-
type: "string",
|
|
289
|
-
default: DEFAULT_VOICE_PROVIDER_ID,
|
|
290
|
-
options: VOICE_PROVIDER_DEFINITIONS.map((provider) => provider.id),
|
|
291
|
-
category: "Voice"
|
|
292
|
-
}
|
|
293
|
-
];
|
|
294
|
-
for (const provider of VOICE_PROVIDER_DEFINITIONS) {
|
|
295
|
-
if (provider.supportsApiKey) {
|
|
296
|
-
schemas.push({
|
|
297
|
-
key: `voice.providers.${provider.id}.apiKey`,
|
|
298
|
-
label: `${provider.label} API Key`,
|
|
299
|
-
description: `API key for ${provider.label}.`,
|
|
300
|
-
type: "string",
|
|
301
|
-
default: "",
|
|
302
|
-
category: "Voice",
|
|
303
|
-
sensitive: true
|
|
304
|
-
});
|
|
305
|
-
}
|
|
306
|
-
if (provider.supportsModel) {
|
|
307
|
-
schemas.push({
|
|
308
|
-
key: `voice.providers.${provider.id}.model`,
|
|
309
|
-
label: `${provider.label} Model`,
|
|
310
|
-
description: `Model identifier to use when ${provider.label} is selected.`,
|
|
311
|
-
type: "string",
|
|
312
|
-
default: "whisper-1",
|
|
313
|
-
category: "Voice"
|
|
314
|
-
});
|
|
315
|
-
}
|
|
316
|
-
if (provider.supportsBaseUrl) {
|
|
317
|
-
schemas.push({
|
|
318
|
-
key: `voice.providers.${provider.id}.baseUrl`,
|
|
319
|
-
label: `${provider.label} Base URL`,
|
|
320
|
-
description: provider.id === "azure-openai-whisper" ? "Base URL for Azure OpenAI Whisper requests." : `Optional custom API base URL for ${provider.label}.`,
|
|
321
|
-
type: "string",
|
|
322
|
-
default: provider.id === DEFAULT_VOICE_PROVIDER_ID ? "https://api.openai.com/v1" : "",
|
|
323
|
-
category: "Voice"
|
|
324
|
-
});
|
|
325
|
-
}
|
|
326
|
-
if (provider.supportsAzureDeployment) {
|
|
327
|
-
schemas.push({
|
|
328
|
-
key: `voice.providers.${provider.id}.azureDeployment`,
|
|
329
|
-
label: `${provider.label} Deployment`,
|
|
330
|
-
description: "Azure OpenAI deployment name for Whisper transcription.",
|
|
331
|
-
type: "string",
|
|
332
|
-
default: "",
|
|
333
|
-
category: "Voice"
|
|
334
|
-
});
|
|
335
|
-
}
|
|
336
|
-
if (provider.supportsAzureApiVersion) {
|
|
337
|
-
schemas.push({
|
|
338
|
-
key: `voice.providers.${provider.id}.azureApiVersion`,
|
|
339
|
-
label: `${provider.label} API Version`,
|
|
340
|
-
description: "Azure OpenAI API version used for transcription requests.",
|
|
341
|
-
type: "string",
|
|
342
|
-
default: "2024-06-01",
|
|
343
|
-
category: "Voice"
|
|
344
|
-
});
|
|
345
|
-
}
|
|
346
|
-
}
|
|
347
|
-
return schemas;
|
|
348
|
-
}
|
|
349
|
-
var VOICE_PREFERENCE_SCHEMAS = getVoiceProviderPreferenceSchemas();
|
|
350
|
-
var PREFERENCE_SCHEMAS = [
|
|
351
|
-
// ─── General ─────────────────────────────────────────────────────────────
|
|
352
|
-
{
|
|
353
|
-
key: "general.theme",
|
|
354
|
-
label: "Theme",
|
|
355
|
-
description: "UI theme: light or dark.",
|
|
356
|
-
type: "string",
|
|
357
|
-
default: "light",
|
|
358
|
-
options: ["light", "dark"],
|
|
359
|
-
category: "General"
|
|
360
|
-
},
|
|
361
|
-
{
|
|
362
|
-
key: "general.accentColor",
|
|
363
|
-
label: "Accent Color",
|
|
364
|
-
description: "Primary theme color. Accepts hex values or any CSS color string.",
|
|
365
|
-
type: "string",
|
|
366
|
-
default: "#7c6ff7",
|
|
367
|
-
category: "General"
|
|
368
|
-
},
|
|
369
|
-
{
|
|
370
|
-
key: "general.language",
|
|
371
|
-
label: "Language",
|
|
372
|
-
description: "UI language/locale.",
|
|
373
|
-
type: "string",
|
|
374
|
-
default: "en",
|
|
375
|
-
options: ["en", "zh", "ja", "ko", "es", "fr", "de"],
|
|
376
|
-
category: "General"
|
|
377
|
-
},
|
|
378
|
-
{
|
|
379
|
-
key: "general.dataDirectory",
|
|
380
|
-
label: "Data Directory",
|
|
381
|
-
description: "Override the base data directory. Leave empty for platform default (resolved via env-paths).",
|
|
382
|
-
type: "string",
|
|
383
|
-
default: "",
|
|
384
|
-
category: "General",
|
|
385
|
-
requiresRestart: true
|
|
386
|
-
},
|
|
387
|
-
// ─── Server ──────────────────────────────────────────────────────────────
|
|
388
|
-
{
|
|
389
|
-
key: "server.host",
|
|
390
|
-
label: "Host",
|
|
391
|
-
description: "Server bind address.",
|
|
392
|
-
type: "string",
|
|
393
|
-
default: "localhost",
|
|
394
|
-
category: "Server",
|
|
395
|
-
requiresRestart: true
|
|
396
|
-
},
|
|
397
|
-
{
|
|
398
|
-
key: "server.port",
|
|
399
|
-
label: "Port",
|
|
400
|
-
description: "Server listen port.",
|
|
401
|
-
type: "number",
|
|
402
|
-
default: 3e3,
|
|
403
|
-
min: 1,
|
|
404
|
-
max: 65535,
|
|
405
|
-
category: "Server",
|
|
406
|
-
requiresRestart: true
|
|
407
|
-
},
|
|
408
|
-
// ─── AI ──────────────────────────────────────────────────────────────────
|
|
409
|
-
...AI_PREFERENCE_SCHEMAS,
|
|
410
|
-
// ─── Voice ────────────────────────────────────────────────────────────
|
|
411
|
-
...VOICE_PREFERENCE_SCHEMAS,
|
|
412
|
-
{
|
|
413
|
-
key: "voice.silenceTimeoutMs",
|
|
414
|
-
label: "Silence Timeout",
|
|
415
|
-
description: "Silence duration (ms) before finalizing an utterance.",
|
|
416
|
-
type: "number",
|
|
417
|
-
default: 800,
|
|
418
|
-
min: 200,
|
|
419
|
-
max: 5e3,
|
|
420
|
-
category: "Voice"
|
|
421
|
-
},
|
|
422
|
-
{
|
|
423
|
-
key: "voice.energyThreshold",
|
|
424
|
-
label: "Energy Threshold",
|
|
425
|
-
description: "RMS energy threshold for voice activity detection (0\u201332767).",
|
|
426
|
-
type: "number",
|
|
427
|
-
default: 500,
|
|
428
|
-
min: 50,
|
|
429
|
-
max: 1e4,
|
|
430
|
-
category: "Voice"
|
|
431
|
-
}
|
|
432
|
-
];
|
|
433
|
-
function getDefaultConfig() {
|
|
434
|
-
const config = {};
|
|
435
|
-
for (const schema of PREFERENCE_SCHEMAS) {
|
|
436
|
-
config[schema.key] = schema.default;
|
|
437
|
-
}
|
|
438
|
-
return config;
|
|
439
|
-
}
|
|
440
|
-
function getSchema(key) {
|
|
441
|
-
return PREFERENCE_SCHEMAS.find((s) => s.key === key);
|
|
442
|
-
}
|
|
443
|
-
function getSchemasByCategory(category) {
|
|
444
|
-
return PREFERENCE_SCHEMAS.filter((s) => s.category === category);
|
|
445
|
-
}
|
|
446
|
-
|
|
447
|
-
// ../ui/dist/index.js
|
|
448
|
-
var J = `.dt-tooltip-popup {
|
|
1
|
+
import{__dtLocalize as X}from"@desktalk/sdk";var m=window.React,or=m.Children,dr=m.Component,lr=m.Fragment,cr=m.Profiler,ur=m.PureComponent,hr=m.StrictMode,pr=m.Suspense,mr=m.cloneElement,vr=m.createContext,br=m.createElement,gr=m.createRef,fr=m.forwardRef,_r=m.isValidElement,yr=m.lazy,xr=m.memo,wr=m.startTransition,v=m.useCallback,kr=m.useContext,Ar=m.useDebugValue,Cr=m.useDeferredValue,y=m.useEffect,Er=m.useId,Sr=m.useImperativeHandle,zr=m.useInsertionEffect,Pr=m.useLayoutEffect,Z=m.useMemo,Mr=m.useReducer,J=m.useRef,k=m.useState,Nr=m.useSyncExternalStore,Tr=m.useTransition,Lr=m.version,Q=window.ReactDOM,be=Q.createRoot,Rr=Q.hydrateRoot;import{useCommand as ee,useEvent as te,MiniAppIdProvider as ge,WindowIdProvider as fe}from"@desktalk/sdk";var D=["General","Server","AI","Voice"],z="openai",P=[{id:"anthropic",label:"Anthropic",supportsApiKey:!0,supportsBaseUrl:!1},{id:"azure-openai-responses",label:"Azure OpenAI",supportsApiKey:!0,supportsBaseUrl:!0},{id:z,label:"OpenAI",supportsApiKey:!0,supportsBaseUrl:!0},{id:"google",label:"Google Gemini",supportsApiKey:!0,supportsBaseUrl:!1},{id:"mistral",label:"Mistral",supportsApiKey:!0,supportsBaseUrl:!0},{id:"groq",label:"Groq",supportsApiKey:!0,supportsBaseUrl:!0},{id:"cerebras",label:"Cerebras",supportsApiKey:!0,supportsBaseUrl:!0},{id:"xai",label:"xAI",supportsApiKey:!0,supportsBaseUrl:!0},{id:"openrouter",label:"OpenRouter",supportsApiKey:!0,supportsBaseUrl:!0},{id:"vercel-ai-gateway",label:"Vercel AI Gateway",supportsApiKey:!0,supportsBaseUrl:!0},{id:"zai",label:"ZAI",supportsApiKey:!0,supportsBaseUrl:!1},{id:"opencode",label:"OpenCode Zen",supportsApiKey:!0,supportsBaseUrl:!1},{id:"opencode-go",label:"OpenCode Go",supportsApiKey:!0,supportsBaseUrl:!1},{id:"huggingface",label:"Hugging Face",supportsApiKey:!0,supportsBaseUrl:!0},{id:"kimi-coding",label:"Kimi For Coding",supportsApiKey:!0,supportsBaseUrl:!1},{id:"minimax",label:"MiniMax",supportsApiKey:!0,supportsBaseUrl:!1},{id:"minimax-cn",label:"MiniMax China",supportsApiKey:!0,supportsBaseUrl:!1},{id:"ollama",label:"Ollama",supportsApiKey:!1,supportsBaseUrl:!0}],C="openai-whisper",M=[{id:C,label:"OpenAI Whisper",supportsApiKey:!0,supportsBaseUrl:!0,supportsModel:!0,supportsAzureDeployment:!1,supportsAzureApiVersion:!1},{id:"azure-openai-whisper",label:"Azure OpenAI Whisper",supportsApiKey:!0,supportsBaseUrl:!0,supportsModel:!1,supportsAzureDeployment:!0,supportsAzureApiVersion:!0}],_e=new Set(P.map(e=>e.id)),ye=new Set(M.map(e=>e.id));function re(e){return P.find(t=>t.id===e)}function xe(e){const t=re(e);if(!t)return[];const r=[`ai.providers.${e}.model`];return t.supportsApiKey&&r.push(`ai.providers.${e}.apiKey`),t.supportsBaseUrl&&r.push(`ai.providers.${e}.baseUrl`),r}function ie(e){if(typeof e!="string")return[z];const t=e.split(",").map(r=>r.trim()).filter((r,i,n)=>r&&n.indexOf(r)===i&&_e.has(r));return t.length>0?t:[z]}function we(e){return ie(e.join(",")).join(",")}function ne(e){return M.find(t=>t.id===e)}function ke(e){const t=ne(e);if(!t)return[];const r=[];return t.supportsApiKey&&r.push(`voice.providers.${e}.apiKey`),t.supportsModel&&r.push(`voice.providers.${e}.model`),t.supportsBaseUrl&&r.push(`voice.providers.${e}.baseUrl`),t.supportsAzureDeployment&&r.push(`voice.providers.${e}.azureDeployment`),t.supportsAzureApiVersion&&r.push(`voice.providers.${e}.azureApiVersion`),r}function se(e){if(typeof e!="string")return[C];const t=e.split(",").map(r=>r.trim()).filter((r,i,n)=>r&&n.indexOf(r)===i&&ye.has(r));return t.length>0?t:[C]}function Ae(e){return se(e.join(",")).join(",")}function Ce(){const e=[{key:"ai.enabledProviders",label:"Enabled Providers",description:"Ordered list of configured AI providers.",type:"string",default:z,category:"AI"},{key:"ai.defaultProvider",label:"Default Provider",description:"Provider selected by default for chat and tool execution.",type:"string",default:z,options:P.map(t=>t.id),category:"AI"}];for(const t of P)e.push({key:`ai.providers.${t.id}.model`,label:`${t.label} Model`,description:`Model identifier to use when ${t.label} is selected.`,type:"string",default:"",category:"AI"}),t.supportsApiKey&&e.push({key:`ai.providers.${t.id}.apiKey`,label:`${t.label} API Key`,description:`API key for ${t.label}.`,type:"string",default:"",category:"AI",sensitive:!0}),t.supportsBaseUrl&&e.push({key:`ai.providers.${t.id}.baseUrl`,label:`${t.label} Base URL`,description:`Optional custom API base URL for ${t.label}.`,type:"string",default:"",category:"AI"});return e.push({key:"ai.maxTokens",label:"Max Tokens",description:"Maximum tokens per AI response.",type:"number",default:4096,min:256,max:128e3,category:"AI"}),e}var Ee=Ce();function Se(){const e=[{key:"voice.enabledProviders",label:"Enabled Providers",description:"Ordered list of configured STT providers.",type:"string",default:C,category:"Voice"},{key:"voice.defaultProvider",label:"Default Provider",description:"Provider selected by default for voice transcription.",type:"string",default:C,options:M.map(t=>t.id),category:"Voice"}];for(const t of M)t.supportsApiKey&&e.push({key:`voice.providers.${t.id}.apiKey`,label:`${t.label} API Key`,description:`API key for ${t.label}.`,type:"string",default:"",category:"Voice",sensitive:!0}),t.supportsModel&&e.push({key:`voice.providers.${t.id}.model`,label:`${t.label} Model`,description:`Model identifier to use when ${t.label} is selected.`,type:"string",default:"whisper-1",category:"Voice"}),t.supportsBaseUrl&&e.push({key:`voice.providers.${t.id}.baseUrl`,label:`${t.label} Base URL`,description:t.id==="azure-openai-whisper"?"Base URL for Azure OpenAI Whisper requests.":`Optional custom API base URL for ${t.label}.`,type:"string",default:t.id===C?"https://api.openai.com/v1":"",category:"Voice"}),t.supportsAzureDeployment&&e.push({key:`voice.providers.${t.id}.azureDeployment`,label:`${t.label} Deployment`,description:"Azure OpenAI deployment name for Whisper transcription.",type:"string",default:"",category:"Voice"}),t.supportsAzureApiVersion&&e.push({key:`voice.providers.${t.id}.azureApiVersion`,label:`${t.label} API Version`,description:"Azure OpenAI API version used for transcription requests.",type:"string",default:"2024-06-01",category:"Voice"});return e}var ze=Se(),$=[{key:"general.theme",label:"Theme",description:"UI theme: light or dark.",type:"string",default:"light",options:["light","dark"],category:"General"},{key:"general.accentColor",label:"Accent Color",description:"Primary theme color. Accepts hex values or any CSS color string.",type:"string",default:"#7c6ff7",category:"General"},{key:"general.language",label:"Language",description:"UI language/locale.",type:"string",default:"en",options:["en","zh","ja","ko","es","fr","de"],category:"General"},{key:"general.dataDirectory",label:"Data Directory",description:"Override the base data directory. Leave empty for platform default (resolved via env-paths).",type:"string",default:"",category:"General",requiresRestart:!0},{key:"server.host",label:"Host",description:"Server bind address.",type:"string",default:"localhost",category:"Server",requiresRestart:!0},{key:"server.port",label:"Port",description:"Server listen port.",type:"number",default:3e3,min:1,max:65535,category:"Server",requiresRestart:!0},...Ee,...ze,{key:"voice.silenceTimeoutMs",label:"Silence Timeout",description:"Silence duration (ms) before finalizing an utterance.",type:"number",default:800,min:200,max:5e3,category:"Voice"},{key:"voice.energyThreshold",label:"Energy Threshold",description:"RMS energy threshold for voice activity detection (0\u201332767).",type:"number",default:500,min:50,max:1e4,category:"Voice"}];function Pe(){const e={};for(const t of $)e[t.key]=t.default;return e}function Me(e){return $.find(t=>t.key===e)}function Ne(e){return $.filter(t=>t.category===e)}var Te=`.dt-tooltip-popup {
|
|
449
2
|
position: fixed;
|
|
450
3
|
z-index: 2147483647;
|
|
451
4
|
padding: 6px 10px;
|
|
@@ -554,115 +107,7 @@ var J = `.dt-tooltip-popup {
|
|
|
554
107
|
border-top: none;
|
|
555
108
|
border-bottom: none;
|
|
556
109
|
}
|
|
557
|
-
|
|
558
|
-
var vt = "dt-tooltip-popup";
|
|
559
|
-
var u = 8;
|
|
560
|
-
var W = false;
|
|
561
|
-
function ft() {
|
|
562
|
-
if (W) return;
|
|
563
|
-
let r = document.createElement("style");
|
|
564
|
-
r.setAttribute("data-dt-tooltip", ""), r.textContent = J, document.head.appendChild(r), W = true;
|
|
565
|
-
}
|
|
566
|
-
var x = class extends HTMLElement {
|
|
567
|
-
_popup = null;
|
|
568
|
-
_showTimeout = null;
|
|
569
|
-
_tooltipId = "";
|
|
570
|
-
_visible = false;
|
|
571
|
-
static get observedAttributes() {
|
|
572
|
-
return ["content", "placement", "delay", "disabled"];
|
|
573
|
-
}
|
|
574
|
-
get content() {
|
|
575
|
-
return this.getAttribute("content") ?? "";
|
|
576
|
-
}
|
|
577
|
-
set content(t) {
|
|
578
|
-
this.setAttribute("content", t);
|
|
579
|
-
}
|
|
580
|
-
get placement() {
|
|
581
|
-
let t = this.getAttribute("placement");
|
|
582
|
-
return t === "bottom" || t === "left" || t === "right" ? t : "top";
|
|
583
|
-
}
|
|
584
|
-
set placement(t) {
|
|
585
|
-
this.setAttribute("placement", t);
|
|
586
|
-
}
|
|
587
|
-
get delay() {
|
|
588
|
-
let t = Number(this.getAttribute("delay"));
|
|
589
|
-
return Number.isFinite(t) && t > 0 ? t : 0;
|
|
590
|
-
}
|
|
591
|
-
set delay(t) {
|
|
592
|
-
this.setAttribute("delay", String(t));
|
|
593
|
-
}
|
|
594
|
-
get disabled() {
|
|
595
|
-
return this.hasAttribute("disabled");
|
|
596
|
-
}
|
|
597
|
-
set disabled(t) {
|
|
598
|
-
t ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
|
|
599
|
-
}
|
|
600
|
-
constructor() {
|
|
601
|
-
super();
|
|
602
|
-
let t = this.attachShadow({ mode: "open" });
|
|
603
|
-
t.innerHTML = "<slot></slot>", this._tooltipId = `dt-tip-${Math.random().toString(36).slice(2, 9)}`;
|
|
604
|
-
}
|
|
605
|
-
connectedCallback() {
|
|
606
|
-
ft(), this.addEventListener("mouseenter", this._onEnter), this.addEventListener("mouseleave", this._onLeave), this.addEventListener("focusin", this._onEnter), this.addEventListener("focusout", this._onLeave);
|
|
607
|
-
}
|
|
608
|
-
disconnectedCallback() {
|
|
609
|
-
this.removeEventListener("mouseenter", this._onEnter), this.removeEventListener("mouseleave", this._onLeave), this.removeEventListener("focusin", this._onEnter), this.removeEventListener("focusout", this._onLeave), this._hide();
|
|
610
|
-
}
|
|
611
|
-
attributeChangedCallback(t, e, n) {
|
|
612
|
-
t === "disabled" && this.disabled && this._hide(), t === "content" && this._popup && (this._popup.textContent = this.content);
|
|
613
|
-
}
|
|
614
|
-
_onEnter = () => {
|
|
615
|
-
if (this.disabled || !this.content) return;
|
|
616
|
-
this._showTimeout !== null && clearTimeout(this._showTimeout);
|
|
617
|
-
let t = () => {
|
|
618
|
-
this._createPopup(), this._position(), this._visible = true;
|
|
619
|
-
};
|
|
620
|
-
this.delay > 0 ? this._showTimeout = setTimeout(t, this.delay) : t();
|
|
621
|
-
};
|
|
622
|
-
_onLeave = () => {
|
|
623
|
-
this._hide();
|
|
624
|
-
};
|
|
625
|
-
_createPopup() {
|
|
626
|
-
if (this._popup) return;
|
|
627
|
-
let t = document.createElement("div");
|
|
628
|
-
t.className = vt, t.id = this._tooltipId, t.setAttribute("role", "tooltip"), t.textContent = this.content, document.body.appendChild(t), this._popup = t;
|
|
629
|
-
let e = this._getTrigger();
|
|
630
|
-
e && e.setAttribute("aria-describedby", this._tooltipId);
|
|
631
|
-
}
|
|
632
|
-
_hide() {
|
|
633
|
-
if (this._showTimeout !== null && (clearTimeout(this._showTimeout), this._showTimeout = null), this._popup) {
|
|
634
|
-
let t = this._getTrigger();
|
|
635
|
-
t && t.removeAttribute("aria-describedby"), this._popup.remove(), this._popup = null, this._visible = false;
|
|
636
|
-
}
|
|
637
|
-
}
|
|
638
|
-
_getTrigger() {
|
|
639
|
-
let e = this.shadowRoot?.querySelector("slot")?.assignedElements();
|
|
640
|
-
return e && e.length > 0 ? e[0] : null;
|
|
641
|
-
}
|
|
642
|
-
_position() {
|
|
643
|
-
let t = this._popup;
|
|
644
|
-
if (!t) return;
|
|
645
|
-
let e = this.getBoundingClientRect(), n = t.getBoundingClientRect(), i = window.innerWidth, s = window.innerHeight, o = this.placement;
|
|
646
|
-
o === "top" && e.top - n.height - u < 0 ? o = "bottom" : o === "bottom" && e.bottom + n.height + u > s ? o = "top" : o === "left" && e.left - n.width - u < 0 ? o = "right" : o === "right" && e.right + n.width + u > i && (o = "left"), t.setAttribute("data-actual-placement", o);
|
|
647
|
-
let a, d;
|
|
648
|
-
switch (o) {
|
|
649
|
-
case "top":
|
|
650
|
-
d = e.left + e.width / 2, a = e.top - n.height - u;
|
|
651
|
-
break;
|
|
652
|
-
case "bottom":
|
|
653
|
-
d = e.left + e.width / 2, a = e.bottom + u;
|
|
654
|
-
break;
|
|
655
|
-
case "left":
|
|
656
|
-
d = e.left - n.width - u, a = e.top + e.height / 2;
|
|
657
|
-
break;
|
|
658
|
-
case "right":
|
|
659
|
-
d = e.right + u, a = e.top + e.height / 2;
|
|
660
|
-
break;
|
|
661
|
-
}
|
|
662
|
-
t.style.left = `${d}px`, t.style.top = `${a}px`;
|
|
663
|
-
}
|
|
664
|
-
};
|
|
665
|
-
var G = `:host {
|
|
110
|
+
`,Le="dt-tooltip-popup",E=8,ae=!1;function Re(){if(ae)return;let e=document.createElement("style");e.setAttribute("data-dt-tooltip",""),e.textContent=Te,document.head.appendChild(e),ae=!0}var Ie=class extends HTMLElement{_popup=null;_showTimeout=null;_tooltipId="";_visible=!1;static get observedAttributes(){return["content","placement","delay","disabled"]}get content(){return this.getAttribute("content")??""}set content(e){this.setAttribute("content",e)}get placement(){let e=this.getAttribute("placement");return e==="bottom"||e==="left"||e==="right"?e:"top"}set placement(e){this.setAttribute("placement",e)}get delay(){let e=Number(this.getAttribute("delay"));return Number.isFinite(e)&&e>0?e:0}set delay(e){this.setAttribute("delay",String(e))}get disabled(){return this.hasAttribute("disabled")}set disabled(e){e?this.setAttribute("disabled",""):this.removeAttribute("disabled")}constructor(){super();let e=this.attachShadow({mode:"open"});e.innerHTML="<slot></slot>",this._tooltipId=`dt-tip-${Math.random().toString(36).slice(2,9)}`}connectedCallback(){Re(),this.addEventListener("mouseenter",this._onEnter),this.addEventListener("mouseleave",this._onLeave),this.addEventListener("focusin",this._onEnter),this.addEventListener("focusout",this._onLeave)}disconnectedCallback(){this.removeEventListener("mouseenter",this._onEnter),this.removeEventListener("mouseleave",this._onLeave),this.removeEventListener("focusin",this._onEnter),this.removeEventListener("focusout",this._onLeave),this._hide()}attributeChangedCallback(e,t,r){e==="disabled"&&this.disabled&&this._hide(),e==="content"&&this._popup&&(this._popup.textContent=this.content)}_onEnter=()=>{if(this.disabled||!this.content)return;this._showTimeout!==null&&clearTimeout(this._showTimeout);let e=()=>{this._createPopup(),this._position(),this._visible=!0};this.delay>0?this._showTimeout=setTimeout(e,this.delay):e()};_onLeave=()=>{this._hide()};_createPopup(){if(this._popup)return;let e=document.createElement("div");e.className=Le,e.id=this._tooltipId,e.setAttribute("role","tooltip"),e.textContent=this.content,document.body.appendChild(e),this._popup=e;let t=this._getTrigger();t&&t.setAttribute("aria-describedby",this._tooltipId)}_hide(){if(this._showTimeout!==null&&(clearTimeout(this._showTimeout),this._showTimeout=null),this._popup){let e=this._getTrigger();e&&e.removeAttribute("aria-describedby"),this._popup.remove(),this._popup=null,this._visible=!1}}_getTrigger(){let e=this.shadowRoot?.querySelector("slot")?.assignedElements();return e&&e.length>0?e[0]:null}_position(){let e=this._popup;if(!e)return;let t=this.getBoundingClientRect(),r=e.getBoundingClientRect(),i=window.innerWidth,n=window.innerHeight,a=this.placement;a==="top"&&t.top-r.height-E<0?a="bottom":a==="bottom"&&t.bottom+r.height+E>n?a="top":a==="left"&&t.left-r.width-E<0?a="right":a==="right"&&t.right+r.width+E>i&&(a="left"),e.setAttribute("data-actual-placement",a);let c,d;switch(a){case"top":d=t.left+t.width/2,c=t.top-r.height-E;break;case"bottom":d=t.left+t.width/2,c=t.bottom+E;break;case"left":d=t.left-r.width-E,c=t.top+t.height/2;break;case"right":d=t.right+E,c=t.top+t.height/2;break}e.style.left=`${d}px`,e.style.top=`${c}px`}},Ve=`:host {
|
|
666
111
|
display: block;
|
|
667
112
|
margin-bottom: 12px;
|
|
668
113
|
}
|
|
@@ -738,28 +183,7 @@ var G = `:host {
|
|
|
738
183
|
::slotted(p:last-child) {
|
|
739
184
|
margin-bottom: 0;
|
|
740
185
|
}
|
|
741
|
-
|
|
742
|
-
var _t = "dt-card-inner";
|
|
743
|
-
var w = class extends HTMLElement {
|
|
744
|
-
static get observedAttributes() {
|
|
745
|
-
return ["variant"];
|
|
746
|
-
}
|
|
747
|
-
get variant() {
|
|
748
|
-
let t = this.getAttribute("variant");
|
|
749
|
-
return t === "outlined" || t === "filled" ? t : "default";
|
|
750
|
-
}
|
|
751
|
-
set variant(t) {
|
|
752
|
-
this.setAttribute("variant", t);
|
|
753
|
-
}
|
|
754
|
-
constructor() {
|
|
755
|
-
super();
|
|
756
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
757
|
-
e.textContent = G, t.appendChild(e);
|
|
758
|
-
let n = document.createElement("div");
|
|
759
|
-
n.className = _t, n.innerHTML = "<slot></slot>", t.appendChild(n);
|
|
760
|
-
}
|
|
761
|
-
};
|
|
762
|
-
var j = `.dt-select-menu {
|
|
186
|
+
`,He="dt-card-inner",Fe=class extends HTMLElement{static get observedAttributes(){return["variant"]}get variant(){let e=this.getAttribute("variant");return e==="outlined"||e==="filled"?e:"default"}set variant(e){this.setAttribute("variant",e)}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=Ve,e.appendChild(t);let r=document.createElement("div");r.className=He,r.innerHTML="<slot></slot>",e.appendChild(r)}},De=`.dt-select-menu {
|
|
763
187
|
position: fixed;
|
|
764
188
|
z-index: 2147483646;
|
|
765
189
|
display: flex;
|
|
@@ -829,8 +253,7 @@ var j = `.dt-select-menu {
|
|
|
829
253
|
text-overflow: ellipsis;
|
|
830
254
|
white-space: nowrap;
|
|
831
255
|
}
|
|
832
|
-
|
|
833
|
-
var q = `:host {
|
|
256
|
+
`,$e=`:host {
|
|
834
257
|
display: block;
|
|
835
258
|
width: 100%;
|
|
836
259
|
min-width: 0;
|
|
@@ -933,141 +356,7 @@ var q = `:host {
|
|
|
933
356
|
.dt-select-trigger[aria-expanded='true'] .dt-select-chevron {
|
|
934
357
|
transform: rotate(180deg);
|
|
935
358
|
}
|
|
936
|
-
|
|
937
|
-
var xt = "dt-select-trigger";
|
|
938
|
-
var K = "dt-select-label";
|
|
939
|
-
var wt = "dt-select-chevron";
|
|
940
|
-
var yt = "dt-select-menu";
|
|
941
|
-
var kt = "dt-select-option";
|
|
942
|
-
var Ct = "dt-select-option--active";
|
|
943
|
-
var U = false;
|
|
944
|
-
function Et() {
|
|
945
|
-
if (U) return;
|
|
946
|
-
let r = document.createElement("style");
|
|
947
|
-
r.setAttribute("data-dt-select", ""), r.textContent = j, document.head.appendChild(r), U = true;
|
|
948
|
-
}
|
|
949
|
-
var y = class extends HTMLElement {
|
|
950
|
-
_menu = null;
|
|
951
|
-
_trigger = null;
|
|
952
|
-
_options = [];
|
|
953
|
-
_open = false;
|
|
954
|
-
_menuId = "";
|
|
955
|
-
static get observedAttributes() {
|
|
956
|
-
return ["value", "placeholder", "disabled", "align"];
|
|
957
|
-
}
|
|
958
|
-
get value() {
|
|
959
|
-
return this.getAttribute("value") ?? "";
|
|
960
|
-
}
|
|
961
|
-
set value(t) {
|
|
962
|
-
this.setAttribute("value", t);
|
|
963
|
-
}
|
|
964
|
-
get placeholder() {
|
|
965
|
-
return this.getAttribute("placeholder") ?? "Select\u2026";
|
|
966
|
-
}
|
|
967
|
-
set placeholder(t) {
|
|
968
|
-
this.setAttribute("placeholder", t);
|
|
969
|
-
}
|
|
970
|
-
get disabled() {
|
|
971
|
-
return this.hasAttribute("disabled");
|
|
972
|
-
}
|
|
973
|
-
set disabled(t) {
|
|
974
|
-
t ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
|
|
975
|
-
}
|
|
976
|
-
get align() {
|
|
977
|
-
return this.getAttribute("align") === "right" ? "right" : "left";
|
|
978
|
-
}
|
|
979
|
-
set align(t) {
|
|
980
|
-
this.setAttribute("align", t);
|
|
981
|
-
}
|
|
982
|
-
get options() {
|
|
983
|
-
return this._options;
|
|
984
|
-
}
|
|
985
|
-
set options(t) {
|
|
986
|
-
this._options = t, this._updateLabel(), this._open && this._renderMenuItems();
|
|
987
|
-
}
|
|
988
|
-
constructor() {
|
|
989
|
-
super();
|
|
990
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
991
|
-
e.textContent = q, t.appendChild(e);
|
|
992
|
-
let n = document.createElement("button");
|
|
993
|
-
n.type = "button", n.className = xt, n.setAttribute("aria-haspopup", "listbox"), n.setAttribute("aria-expanded", "false");
|
|
994
|
-
let i = document.createElement("span");
|
|
995
|
-
i.className = K, n.appendChild(i);
|
|
996
|
-
let s = document.createElement("span");
|
|
997
|
-
s.className = wt, s.setAttribute("aria-hidden", "true"), s.textContent = "\u25BE", n.appendChild(s), t.appendChild(n), this._trigger = n, this._menuId = `dt-sel-${Math.random().toString(36).slice(2, 9)}`;
|
|
998
|
-
}
|
|
999
|
-
connectedCallback() {
|
|
1000
|
-
Et(), this._trigger.addEventListener("click", this._onTriggerClick), this._updateLabel();
|
|
1001
|
-
}
|
|
1002
|
-
disconnectedCallback() {
|
|
1003
|
-
this._trigger.removeEventListener("click", this._onTriggerClick), this._close();
|
|
1004
|
-
}
|
|
1005
|
-
attributeChangedCallback(t) {
|
|
1006
|
-
t === "value" && (this._updateLabel(), this._open && this._renderMenuItems()), t === "placeholder" && !this.value && this._updateLabel(), t === "disabled" && this.disabled && this._close();
|
|
1007
|
-
}
|
|
1008
|
-
_updateLabel() {
|
|
1009
|
-
let t = this._trigger.querySelector(`.${K}`), e = this._options.find((n) => n.value === this.value);
|
|
1010
|
-
t.textContent = e?.label ?? this.placeholder;
|
|
1011
|
-
}
|
|
1012
|
-
_onTriggerClick = () => {
|
|
1013
|
-
this.disabled || (this._open ? this._close() : this._openMenu());
|
|
1014
|
-
};
|
|
1015
|
-
_openMenu() {
|
|
1016
|
-
if (this._open) return;
|
|
1017
|
-
let t = document.createElement("div");
|
|
1018
|
-
t.className = yt, t.id = this._menuId, t.setAttribute("role", "listbox"), document.body.appendChild(t), this._menu = t, this._renderMenuItems(), this._position(), requestAnimationFrame(() => {
|
|
1019
|
-
t.setAttribute("data-open", "");
|
|
1020
|
-
}), this._open = true, this._trigger.setAttribute("aria-expanded", "true"), requestAnimationFrame(() => {
|
|
1021
|
-
document.addEventListener("mousedown", this._onOutsideClick), document.addEventListener("keydown", this._onKeyDown);
|
|
1022
|
-
});
|
|
1023
|
-
}
|
|
1024
|
-
_close() {
|
|
1025
|
-
if (this._open) {
|
|
1026
|
-
if (document.removeEventListener("mousedown", this._onOutsideClick), document.removeEventListener("keydown", this._onKeyDown), this._menu) {
|
|
1027
|
-
this._menu.removeAttribute("data-open");
|
|
1028
|
-
let t = this._menu;
|
|
1029
|
-
setTimeout(() => t.remove(), 140), this._menu = null;
|
|
1030
|
-
}
|
|
1031
|
-
this._open = false, this._trigger.setAttribute("aria-expanded", "false");
|
|
1032
|
-
}
|
|
1033
|
-
}
|
|
1034
|
-
_onOutsideClick = (t) => {
|
|
1035
|
-
let e = t.target;
|
|
1036
|
-
this._menu?.contains(e) || this.contains(e) || this._close();
|
|
1037
|
-
};
|
|
1038
|
-
_onKeyDown = (t) => {
|
|
1039
|
-
t.key === "Escape" && (this._close(), this._trigger.focus());
|
|
1040
|
-
};
|
|
1041
|
-
_renderMenuItems() {
|
|
1042
|
-
let t = this._menu;
|
|
1043
|
-
if (t) {
|
|
1044
|
-
t.innerHTML = "";
|
|
1045
|
-
for (let e of this._options) {
|
|
1046
|
-
let n = document.createElement("button");
|
|
1047
|
-
n.type = "button", n.className = kt, n.setAttribute("role", "option"), n.setAttribute("aria-selected", String(e.value === this.value)), e.value === this.value && n.classList.add(Ct);
|
|
1048
|
-
let i = document.createElement("span");
|
|
1049
|
-
i.textContent = e.label, n.appendChild(i), n.addEventListener("click", () => {
|
|
1050
|
-
this._selectValue(e.value);
|
|
1051
|
-
}), t.appendChild(n);
|
|
1052
|
-
}
|
|
1053
|
-
}
|
|
1054
|
-
}
|
|
1055
|
-
_selectValue(t) {
|
|
1056
|
-
let e = this.value;
|
|
1057
|
-
this.value = t, this._updateLabel(), this._close(), t !== e && this.dispatchEvent(new CustomEvent("dt-change", { detail: { value: t }, bubbles: true, composed: true }));
|
|
1058
|
-
}
|
|
1059
|
-
_position() {
|
|
1060
|
-
let t = this._menu;
|
|
1061
|
-
if (!t) return;
|
|
1062
|
-
let e = this.getBoundingClientRect(), n = 10, i = Math.max(e.width, 240), s = e.bottom + n, o = t.scrollHeight || 260, a = window.innerHeight;
|
|
1063
|
-
if (s + o > a && e.top - o - n > 0 && (s = e.top - o - n), t.style.minWidth = `${i}px`, this.align === "right") {
|
|
1064
|
-
let d = window.innerWidth;
|
|
1065
|
-
t.style.right = `${d - e.right}px`, t.style.left = "auto";
|
|
1066
|
-
} else t.style.left = `${e.left}px`, t.style.right = "auto";
|
|
1067
|
-
t.style.top = `${s}px`;
|
|
1068
|
-
}
|
|
1069
|
-
};
|
|
1070
|
-
var Y = `:host {
|
|
359
|
+
`,Oe="dt-select-trigger",oe="dt-select-label",Be="dt-select-chevron",Ke="dt-select-menu",Ue="dt-select-option",We="dt-select-option--active",de=!1;function qe(){if(de)return;let e=document.createElement("style");e.setAttribute("data-dt-select",""),e.textContent=De,document.head.appendChild(e),de=!0}var je=class extends HTMLElement{_menu=null;_trigger=null;_options=[];_open=!1;_menuId="";static get observedAttributes(){return["value","placeholder","disabled","align"]}get value(){return this.getAttribute("value")??""}set value(e){this.setAttribute("value",e)}get placeholder(){return this.getAttribute("placeholder")??"Select\u2026"}set placeholder(e){this.setAttribute("placeholder",e)}get disabled(){return this.hasAttribute("disabled")}set disabled(e){e?this.setAttribute("disabled",""):this.removeAttribute("disabled")}get align(){return this.getAttribute("align")==="right"?"right":"left"}set align(e){this.setAttribute("align",e)}get options(){return this._options}set options(e){this._options=e,this._updateLabel(),this._open&&this._renderMenuItems()}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=$e,e.appendChild(t);let r=document.createElement("button");r.type="button",r.className=Oe,r.setAttribute("aria-haspopup","listbox"),r.setAttribute("aria-expanded","false");let i=document.createElement("span");i.className=oe,r.appendChild(i);let n=document.createElement("span");n.className=Be,n.setAttribute("aria-hidden","true"),n.textContent="\u25BE",r.appendChild(n),e.appendChild(r),this._trigger=r,this._menuId=`dt-sel-${Math.random().toString(36).slice(2,9)}`}connectedCallback(){qe(),this._trigger.addEventListener("click",this._onTriggerClick),this._updateLabel()}disconnectedCallback(){this._trigger.removeEventListener("click",this._onTriggerClick),this._close()}attributeChangedCallback(e){e==="value"&&(this._updateLabel(),this._open&&this._renderMenuItems()),e==="placeholder"&&!this.value&&this._updateLabel(),e==="disabled"&&this.disabled&&this._close()}_updateLabel(){let e=this._trigger.querySelector(`.${oe}`),t=this._options.find(r=>r.value===this.value);e.textContent=t?.label??this.placeholder}_onTriggerClick=()=>{this.disabled||(this._open?this._close():this._openMenu())};_openMenu(){if(this._open)return;let e=document.createElement("div");e.className=Ke,e.id=this._menuId,e.setAttribute("role","listbox"),document.body.appendChild(e),this._menu=e,this._renderMenuItems(),this._position(),requestAnimationFrame(()=>{e.setAttribute("data-open","")}),this._open=!0,this._trigger.setAttribute("aria-expanded","true"),requestAnimationFrame(()=>{document.addEventListener("mousedown",this._onOutsideClick),document.addEventListener("keydown",this._onKeyDown)})}_close(){if(this._open){if(document.removeEventListener("mousedown",this._onOutsideClick),document.removeEventListener("keydown",this._onKeyDown),this._menu){this._menu.removeAttribute("data-open");let e=this._menu;setTimeout(()=>e.remove(),140),this._menu=null}this._open=!1,this._trigger.setAttribute("aria-expanded","false")}}_onOutsideClick=e=>{let t=e.target;this._menu?.contains(t)||this.contains(t)||this._close()};_onKeyDown=e=>{e.key==="Escape"&&(this._close(),this._trigger.focus())};_renderMenuItems(){let e=this._menu;if(e){e.innerHTML="";for(let t of this._options){let r=document.createElement("button");r.type="button",r.className=Ue,r.setAttribute("role","option"),r.setAttribute("aria-selected",String(t.value===this.value)),t.value===this.value&&r.classList.add(We);let i=document.createElement("span");i.textContent=t.label,r.appendChild(i),r.addEventListener("click",()=>{this._selectValue(t.value)}),e.appendChild(r)}}}_selectValue(e){let t=this.value;this.value=e,this._updateLabel(),this._close(),e!==t&&this.dispatchEvent(new CustomEvent("dt-change",{detail:{value:e},bubbles:!0,composed:!0}))}_position(){let e=this._menu;if(!e)return;let t=this.getBoundingClientRect(),r=10,i=Math.max(t.width,240),n=t.bottom+r,a=e.scrollHeight||260,c=window.innerHeight;if(n+a>c&&t.top-a-r>0&&(n=t.top-a-r),e.style.minWidth=`${i}px`,this.align==="right"){let d=window.innerWidth;e.style.right=`${d-t.right}px`,e.style.left="auto"}else e.style.left=`${t.left}px`,e.style.right="auto";e.style.top=`${n}px`}},Ge=`:host {
|
|
1071
360
|
display: block;
|
|
1072
361
|
margin-bottom: 12px;
|
|
1073
362
|
}
|
|
@@ -1159,42 +448,7 @@ var Y = `:host {
|
|
|
1159
448
|
::slotted(*) {
|
|
1160
449
|
min-width: 0;
|
|
1161
450
|
}
|
|
1162
|
-
|
|
1163
|
-
var St = "dt-grid-inner";
|
|
1164
|
-
var k = class extends HTMLElement {
|
|
1165
|
-
static get observedAttributes() {
|
|
1166
|
-
return ["cols", "gap", "min-width"];
|
|
1167
|
-
}
|
|
1168
|
-
get cols() {
|
|
1169
|
-
let t = this.getAttribute("cols");
|
|
1170
|
-
return t === "1" || t === "2" || t === "3" || t === "4" || t === "5" || t === "6" ? t : null;
|
|
1171
|
-
}
|
|
1172
|
-
set cols(t) {
|
|
1173
|
-
t === null ? this.removeAttribute("cols") : this.setAttribute("cols", t);
|
|
1174
|
-
}
|
|
1175
|
-
get gap() {
|
|
1176
|
-
let t = this.getAttribute("gap");
|
|
1177
|
-
return t === "0" || t === "4" || t === "8" || t === "12" || t === "20" || t === "24" || t === "32" ? t : "16";
|
|
1178
|
-
}
|
|
1179
|
-
set gap(t) {
|
|
1180
|
-
this.setAttribute("gap", t);
|
|
1181
|
-
}
|
|
1182
|
-
get minWidth() {
|
|
1183
|
-
let t = this.getAttribute("min-width");
|
|
1184
|
-
return t === "150" || t === "180" || t === "200" || t === "260" || t === "300" ? t : "220";
|
|
1185
|
-
}
|
|
1186
|
-
set minWidth(t) {
|
|
1187
|
-
this.setAttribute("min-width", t);
|
|
1188
|
-
}
|
|
1189
|
-
constructor() {
|
|
1190
|
-
super();
|
|
1191
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
1192
|
-
e.textContent = Y, t.appendChild(e);
|
|
1193
|
-
let n = document.createElement("div");
|
|
1194
|
-
n.className = St, n.innerHTML = "<slot></slot>", t.appendChild(n);
|
|
1195
|
-
}
|
|
1196
|
-
};
|
|
1197
|
-
var Z = `:host {
|
|
451
|
+
`,Ye="dt-grid-inner",Xe=class extends HTMLElement{static get observedAttributes(){return["cols","gap","min-width"]}get cols(){let e=this.getAttribute("cols");return e==="1"||e==="2"||e==="3"||e==="4"||e==="5"||e==="6"?e:null}set cols(e){e===null?this.removeAttribute("cols"):this.setAttribute("cols",e)}get gap(){let e=this.getAttribute("gap");return e==="0"||e==="4"||e==="8"||e==="12"||e==="20"||e==="24"||e==="32"?e:"16"}set gap(e){this.setAttribute("gap",e)}get minWidth(){let e=this.getAttribute("min-width");return e==="150"||e==="180"||e==="200"||e==="260"||e==="300"?e:"220"}set minWidth(e){this.setAttribute("min-width",e)}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=Ge,e.appendChild(t);let r=document.createElement("div");r.className=Ye,r.innerHTML="<slot></slot>",e.appendChild(r)}},Ze=`:host {
|
|
1198
452
|
display: block;
|
|
1199
453
|
margin-bottom: 12px;
|
|
1200
454
|
}
|
|
@@ -1260,54 +514,7 @@ var Z = `:host {
|
|
|
1260
514
|
::slotted(*) {
|
|
1261
515
|
min-width: 0;
|
|
1262
516
|
}
|
|
1263
|
-
|
|
1264
|
-
var Dt = "dt-stack-inner";
|
|
1265
|
-
function $(r) {
|
|
1266
|
-
return r === "row" || r === "horizontal" ? "row" : "column";
|
|
1267
|
-
}
|
|
1268
|
-
var C = class extends HTMLElement {
|
|
1269
|
-
static get observedAttributes() {
|
|
1270
|
-
return ["direction", "gap", "align"];
|
|
1271
|
-
}
|
|
1272
|
-
get direction() {
|
|
1273
|
-
return $(this.getAttribute("direction"));
|
|
1274
|
-
}
|
|
1275
|
-
set direction(t) {
|
|
1276
|
-
this.setAttribute("direction", $(t));
|
|
1277
|
-
}
|
|
1278
|
-
get gap() {
|
|
1279
|
-
let t = this.getAttribute("gap");
|
|
1280
|
-
return t === "0" || t === "4" || t === "8" || t === "12" || t === "20" || t === "24" || t === "32" ? t : "16";
|
|
1281
|
-
}
|
|
1282
|
-
set gap(t) {
|
|
1283
|
-
this.setAttribute("gap", t);
|
|
1284
|
-
}
|
|
1285
|
-
get align() {
|
|
1286
|
-
let t = this.getAttribute("align");
|
|
1287
|
-
return t === "start" || t === "center" || t === "end" ? t : "stretch";
|
|
1288
|
-
}
|
|
1289
|
-
set align(t) {
|
|
1290
|
-
this.setAttribute("align", t);
|
|
1291
|
-
}
|
|
1292
|
-
connectedCallback() {
|
|
1293
|
-
this.#t();
|
|
1294
|
-
}
|
|
1295
|
-
attributeChangedCallback(t) {
|
|
1296
|
-
t === "direction" && this.#t();
|
|
1297
|
-
}
|
|
1298
|
-
constructor() {
|
|
1299
|
-
super();
|
|
1300
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
1301
|
-
e.textContent = Z, t.appendChild(e);
|
|
1302
|
-
let n = document.createElement("div");
|
|
1303
|
-
n.className = Dt, n.innerHTML = "<slot></slot>", t.appendChild(n);
|
|
1304
|
-
}
|
|
1305
|
-
#t() {
|
|
1306
|
-
let t = this.getAttribute("direction"), e = $(t);
|
|
1307
|
-
t !== null && t !== e && this.setAttribute("direction", e);
|
|
1308
|
-
}
|
|
1309
|
-
};
|
|
1310
|
-
var Q = `:host {
|
|
517
|
+
`,Je="dt-stack-inner";function O(e){return e==="row"||e==="horizontal"?"row":"column"}var Qe=class extends HTMLElement{static get observedAttributes(){return["direction","gap","align"]}get direction(){return O(this.getAttribute("direction"))}set direction(e){this.setAttribute("direction",O(e))}get gap(){let e=this.getAttribute("gap");return e==="0"||e==="4"||e==="8"||e==="12"||e==="20"||e==="24"||e==="32"?e:"16"}set gap(e){this.setAttribute("gap",e)}get align(){let e=this.getAttribute("align");return e==="start"||e==="center"||e==="end"?e:"stretch"}set align(e){this.setAttribute("align",e)}connectedCallback(){this.#e()}attributeChangedCallback(e){e==="direction"&&this.#e()}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=Ze,e.appendChild(t);let r=document.createElement("div");r.className=Je,r.innerHTML="<slot></slot>",e.appendChild(r)}#e(){let e=this.getAttribute("direction"),t=O(e);e!==null&&e!==t&&this.setAttribute("direction",t)}},et=`:host {
|
|
1311
518
|
display: block;
|
|
1312
519
|
}
|
|
1313
520
|
|
|
@@ -1412,81 +619,7 @@ var Q = `:host {
|
|
|
1412
619
|
.dt-stat-inner .trend.neutral {
|
|
1413
620
|
color: var(--dt-text-muted);
|
|
1414
621
|
}
|
|
1415
|
-
`;
|
|
1416
|
-
var At = "dt-stat-inner";
|
|
1417
|
-
var E = class extends HTMLElement {
|
|
1418
|
-
static get observedAttributes() {
|
|
1419
|
-
return ["label", "value", "description", "size", "variant", "trend", "trend-value"];
|
|
1420
|
-
}
|
|
1421
|
-
_container;
|
|
1422
|
-
_labelEl;
|
|
1423
|
-
_valueEl;
|
|
1424
|
-
_descEl;
|
|
1425
|
-
_trendEl;
|
|
1426
|
-
get label() {
|
|
1427
|
-
return this.getAttribute("label");
|
|
1428
|
-
}
|
|
1429
|
-
set label(t) {
|
|
1430
|
-
t === null ? this.removeAttribute("label") : this.setAttribute("label", t);
|
|
1431
|
-
}
|
|
1432
|
-
get value() {
|
|
1433
|
-
return this.getAttribute("value");
|
|
1434
|
-
}
|
|
1435
|
-
set value(t) {
|
|
1436
|
-
t === null ? this.removeAttribute("value") : this.setAttribute("value", t);
|
|
1437
|
-
}
|
|
1438
|
-
get description() {
|
|
1439
|
-
return this.getAttribute("description");
|
|
1440
|
-
}
|
|
1441
|
-
set description(t) {
|
|
1442
|
-
t === null ? this.removeAttribute("description") : this.setAttribute("description", t);
|
|
1443
|
-
}
|
|
1444
|
-
get size() {
|
|
1445
|
-
let t = this.getAttribute("size");
|
|
1446
|
-
return t === "sm" || t === "lg" ? t : "md";
|
|
1447
|
-
}
|
|
1448
|
-
set size(t) {
|
|
1449
|
-
this.setAttribute("size", t);
|
|
1450
|
-
}
|
|
1451
|
-
get variant() {
|
|
1452
|
-
let t = this.getAttribute("variant");
|
|
1453
|
-
return t === "outlined" || t === "filled" ? t : "default";
|
|
1454
|
-
}
|
|
1455
|
-
set variant(t) {
|
|
1456
|
-
this.setAttribute("variant", t);
|
|
1457
|
-
}
|
|
1458
|
-
get trend() {
|
|
1459
|
-
let t = this.getAttribute("trend");
|
|
1460
|
-
return t === "up" || t === "down" || t === "neutral" ? t : null;
|
|
1461
|
-
}
|
|
1462
|
-
set trend(t) {
|
|
1463
|
-
t === null ? this.removeAttribute("trend") : this.setAttribute("trend", t);
|
|
1464
|
-
}
|
|
1465
|
-
get trendValue() {
|
|
1466
|
-
return this.getAttribute("trend-value");
|
|
1467
|
-
}
|
|
1468
|
-
set trendValue(t) {
|
|
1469
|
-
t === null ? this.removeAttribute("trend-value") : this.setAttribute("trend-value", t);
|
|
1470
|
-
}
|
|
1471
|
-
constructor() {
|
|
1472
|
-
super();
|
|
1473
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
1474
|
-
e.textContent = Q, t.appendChild(e), this._container = document.createElement("div"), this._container.className = At, this._labelEl = document.createElement("div"), this._labelEl.className = "label", this._container.appendChild(this._labelEl), this._valueEl = document.createElement("div"), this._valueEl.className = "value", this._container.appendChild(this._valueEl), this._descEl = document.createElement("div"), this._descEl.className = "description", this._container.appendChild(this._descEl), this._trendEl = document.createElement("div"), this._trendEl.className = "trend", this._container.appendChild(this._trendEl), t.appendChild(this._container), this._render();
|
|
1475
|
-
}
|
|
1476
|
-
attributeChangedCallback(t, e, n) {
|
|
1477
|
-
(t === "label" || t === "value" || t === "description" || t === "size" || t === "variant" || t === "trend" || t === "trend-value") && this._render();
|
|
1478
|
-
}
|
|
1479
|
-
_render() {
|
|
1480
|
-
this._labelEl.textContent = this.label ?? "", this._labelEl.style.display = this.label ? "block" : "none", this._valueEl.textContent = this.value ?? "", this._valueEl.style.display = this.value ? "block" : "none", this._descEl.textContent = this.description ?? "", this._descEl.style.display = this.description ? "block" : "none";
|
|
1481
|
-
let t = this.trend, e = this.trendValue;
|
|
1482
|
-
if (t && e) {
|
|
1483
|
-
this._trendEl.style.display = "inline-flex", this._trendEl.className = `trend ${t === "up" ? "positive" : t === "down" ? "negative" : "neutral"}`;
|
|
1484
|
-
let n = "";
|
|
1485
|
-
t === "up" ? n = "\u2191" : t === "down" ? n = "\u2193" : n = "\u2192", this._trendEl.textContent = `${n} ${e}`;
|
|
1486
|
-
} else this._trendEl.style.display = "none";
|
|
1487
|
-
}
|
|
1488
|
-
};
|
|
1489
|
-
var tt = `:host {
|
|
622
|
+
`,tt="dt-stat-inner",rt=class extends HTMLElement{static get observedAttributes(){return["label","value","description","size","variant","trend","trend-value"]}_container;_labelEl;_valueEl;_descEl;_trendEl;get label(){return this.getAttribute("label")}set label(e){e===null?this.removeAttribute("label"):this.setAttribute("label",e)}get value(){return this.getAttribute("value")}set value(e){e===null?this.removeAttribute("value"):this.setAttribute("value",e)}get description(){return this.getAttribute("description")}set description(e){e===null?this.removeAttribute("description"):this.setAttribute("description",e)}get size(){let e=this.getAttribute("size");return e==="sm"||e==="lg"?e:"md"}set size(e){this.setAttribute("size",e)}get variant(){let e=this.getAttribute("variant");return e==="outlined"||e==="filled"?e:"default"}set variant(e){this.setAttribute("variant",e)}get trend(){let e=this.getAttribute("trend");return e==="up"||e==="down"||e==="neutral"?e:null}set trend(e){e===null?this.removeAttribute("trend"):this.setAttribute("trend",e)}get trendValue(){return this.getAttribute("trend-value")}set trendValue(e){e===null?this.removeAttribute("trend-value"):this.setAttribute("trend-value",e)}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=et,e.appendChild(t),this._container=document.createElement("div"),this._container.className=tt,this._labelEl=document.createElement("div"),this._labelEl.className="label",this._container.appendChild(this._labelEl),this._valueEl=document.createElement("div"),this._valueEl.className="value",this._container.appendChild(this._valueEl),this._descEl=document.createElement("div"),this._descEl.className="description",this._container.appendChild(this._descEl),this._trendEl=document.createElement("div"),this._trendEl.className="trend",this._container.appendChild(this._trendEl),e.appendChild(this._container),this._render()}attributeChangedCallback(e,t,r){(e==="label"||e==="value"||e==="description"||e==="size"||e==="variant"||e==="trend"||e==="trend-value")&&this._render()}_render(){this._labelEl.textContent=this.label??"",this._labelEl.style.display=this.label?"block":"none",this._valueEl.textContent=this.value??"",this._valueEl.style.display=this.value?"block":"none",this._descEl.textContent=this.description??"",this._descEl.style.display=this.description?"block":"none";let e=this.trend,t=this.trendValue;if(e&&t){this._trendEl.style.display="inline-flex",this._trendEl.className=`trend ${e==="up"?"positive":e==="down"?"negative":"neutral"}`;let r="";e==="up"?r="\u2191":e==="down"?r="\u2193":r="\u2192",this._trendEl.textContent=`${r} ${t}`}else this._trendEl.style.display="none"}},it=`:host {
|
|
1490
623
|
display: inline-flex;
|
|
1491
624
|
vertical-align: middle;
|
|
1492
625
|
}
|
|
@@ -1568,50 +701,7 @@ var tt = `:host {
|
|
|
1568
701
|
padding: 3px 8px;
|
|
1569
702
|
font-size: 0.75rem;
|
|
1570
703
|
}
|
|
1571
|
-
|
|
1572
|
-
var Mt = "dt-badge-inner";
|
|
1573
|
-
var S = class extends HTMLElement {
|
|
1574
|
-
static get observedAttributes() {
|
|
1575
|
-
return ["variant", "size", "text"];
|
|
1576
|
-
}
|
|
1577
|
-
_container;
|
|
1578
|
-
_slot;
|
|
1579
|
-
get variant() {
|
|
1580
|
-
let t = this.getAttribute("variant");
|
|
1581
|
-
return t === "success" || t === "danger" || t === "warning" || t === "info" || t === "default" || t === "neutral" ? t : "accent";
|
|
1582
|
-
}
|
|
1583
|
-
set variant(t) {
|
|
1584
|
-
this.setAttribute("variant", t);
|
|
1585
|
-
}
|
|
1586
|
-
get size() {
|
|
1587
|
-
let t = this.getAttribute("size");
|
|
1588
|
-
return t === "sm" || t === "lg" ? t : "md";
|
|
1589
|
-
}
|
|
1590
|
-
set size(t) {
|
|
1591
|
-
this.setAttribute("size", t);
|
|
1592
|
-
}
|
|
1593
|
-
get text() {
|
|
1594
|
-
return this.getAttribute("text");
|
|
1595
|
-
}
|
|
1596
|
-
set text(t) {
|
|
1597
|
-
t === null ? this.removeAttribute("text") : this.setAttribute("text", t);
|
|
1598
|
-
}
|
|
1599
|
-
constructor() {
|
|
1600
|
-
super();
|
|
1601
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
1602
|
-
e.textContent = tt, t.appendChild(e), this._container = document.createElement("span"), this._container.className = Mt;
|
|
1603
|
-
let n = this.text;
|
|
1604
|
-
n !== null ? this._container.textContent = n : (this._slot = document.createElement("slot"), this._container.appendChild(this._slot)), t.appendChild(this._container);
|
|
1605
|
-
}
|
|
1606
|
-
attributeChangedCallback(t, e, n) {
|
|
1607
|
-
t === "text" && this._render();
|
|
1608
|
-
}
|
|
1609
|
-
_render() {
|
|
1610
|
-
let t = this.text;
|
|
1611
|
-
t !== null && (this._container.textContent = t);
|
|
1612
|
-
}
|
|
1613
|
-
};
|
|
1614
|
-
var et = `:host {
|
|
704
|
+
`,nt="dt-badge-inner",st=class extends HTMLElement{static get observedAttributes(){return["variant","size","text"]}_container;_slot;get variant(){let e=this.getAttribute("variant");return e==="success"||e==="danger"||e==="warning"||e==="info"||e==="default"||e==="neutral"?e:"accent"}set variant(e){this.setAttribute("variant",e)}get size(){let e=this.getAttribute("size");return e==="sm"||e==="lg"?e:"md"}set size(e){this.setAttribute("size",e)}get text(){return this.getAttribute("text")}set text(e){e===null?this.removeAttribute("text"):this.setAttribute("text",e)}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=it,e.appendChild(t),this._container=document.createElement("span"),this._container.className=nt;let r=this.text;r!==null?this._container.textContent=r:(this._slot=document.createElement("slot"),this._container.appendChild(this._slot)),e.appendChild(this._container)}attributeChangedCallback(e,t,r){e==="text"&&this._render()}_render(){let e=this.text;e!==null&&(this._container.textContent=e)}},at=`:host {
|
|
1615
705
|
display: inline-flex;
|
|
1616
706
|
vertical-align: middle;
|
|
1617
707
|
}
|
|
@@ -1770,64 +860,7 @@ var et = `:host {
|
|
|
1770
860
|
width: 1em;
|
|
1771
861
|
height: 1em;
|
|
1772
862
|
}
|
|
1773
|
-
|
|
1774
|
-
var Tt = "dt-button-inner";
|
|
1775
|
-
var D = class extends HTMLElement {
|
|
1776
|
-
static get observedAttributes() {
|
|
1777
|
-
return ["variant", "size", "disabled", "fullwidth", "type"];
|
|
1778
|
-
}
|
|
1779
|
-
_button;
|
|
1780
|
-
_slot;
|
|
1781
|
-
get variant() {
|
|
1782
|
-
let t = this.getAttribute("variant");
|
|
1783
|
-
return t === "secondary" || t === "ghost" || t === "danger" ? t : "primary";
|
|
1784
|
-
}
|
|
1785
|
-
set variant(t) {
|
|
1786
|
-
this.setAttribute("variant", t);
|
|
1787
|
-
}
|
|
1788
|
-
get size() {
|
|
1789
|
-
let t = this.getAttribute("size");
|
|
1790
|
-
return t === "sm" || t === "lg" ? t : "md";
|
|
1791
|
-
}
|
|
1792
|
-
set size(t) {
|
|
1793
|
-
this.setAttribute("size", t);
|
|
1794
|
-
}
|
|
1795
|
-
get disabled() {
|
|
1796
|
-
return this.hasAttribute("disabled");
|
|
1797
|
-
}
|
|
1798
|
-
set disabled(t) {
|
|
1799
|
-
t ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
|
|
1800
|
-
}
|
|
1801
|
-
get fullwidth() {
|
|
1802
|
-
return this.hasAttribute("fullwidth");
|
|
1803
|
-
}
|
|
1804
|
-
set fullwidth(t) {
|
|
1805
|
-
t ? this.setAttribute("fullwidth", "") : this.removeAttribute("fullwidth");
|
|
1806
|
-
}
|
|
1807
|
-
get type() {
|
|
1808
|
-
let t = this.getAttribute("type");
|
|
1809
|
-
return t === "submit" || t === "reset" ? t : "button";
|
|
1810
|
-
}
|
|
1811
|
-
set type(t) {
|
|
1812
|
-
this.setAttribute("type", t);
|
|
1813
|
-
}
|
|
1814
|
-
constructor() {
|
|
1815
|
-
super();
|
|
1816
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
1817
|
-
e.textContent = et, t.appendChild(e), this._button = document.createElement("button"), this._button.className = Tt, this._button.type = this.type, this._button.disabled = this.disabled, this._slot = document.createElement("slot"), this._button.appendChild(this._slot), t.appendChild(this._button);
|
|
1818
|
-
}
|
|
1819
|
-
attributeChangedCallback(t, e, n) {
|
|
1820
|
-
switch (t) {
|
|
1821
|
-
case "disabled":
|
|
1822
|
-
this._button.disabled = this.disabled;
|
|
1823
|
-
break;
|
|
1824
|
-
case "type":
|
|
1825
|
-
this._button.type = this.type;
|
|
1826
|
-
break;
|
|
1827
|
-
}
|
|
1828
|
-
}
|
|
1829
|
-
};
|
|
1830
|
-
var nt = `:host {
|
|
863
|
+
`,ot="dt-button-inner",dt=class extends HTMLElement{static get observedAttributes(){return["variant","size","disabled","fullwidth","type"]}_button;_slot;get variant(){let e=this.getAttribute("variant");return e==="secondary"||e==="ghost"||e==="danger"?e:"primary"}set variant(e){this.setAttribute("variant",e)}get size(){let e=this.getAttribute("size");return e==="sm"||e==="lg"?e:"md"}set size(e){this.setAttribute("size",e)}get disabled(){return this.hasAttribute("disabled")}set disabled(e){e?this.setAttribute("disabled",""):this.removeAttribute("disabled")}get fullwidth(){return this.hasAttribute("fullwidth")}set fullwidth(e){e?this.setAttribute("fullwidth",""):this.removeAttribute("fullwidth")}get type(){let e=this.getAttribute("type");return e==="submit"||e==="reset"?e:"button"}set type(e){this.setAttribute("type",e)}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=at,e.appendChild(t),this._button=document.createElement("button"),this._button.className=ot,this._button.type=this.type,this._button.disabled=this.disabled,this._slot=document.createElement("slot"),this._button.appendChild(this._slot),e.appendChild(this._button)}attributeChangedCallback(e,t,r){switch(e){case"disabled":this._button.disabled=this.disabled;break;case"type":this._button.type=this.type;break}}},lt=`:host {
|
|
1831
864
|
display: block;
|
|
1832
865
|
}
|
|
1833
866
|
|
|
@@ -1892,41 +925,7 @@ var nt = `:host {
|
|
|
1892
925
|
:host([direction='vertical'][spacing='lg']) .dt-divider-inner {
|
|
1893
926
|
margin: 0 18px;
|
|
1894
927
|
}
|
|
1895
|
-
|
|
1896
|
-
var zt = "dt-divider-inner";
|
|
1897
|
-
var A = class extends HTMLElement {
|
|
1898
|
-
static get observedAttributes() {
|
|
1899
|
-
return ["direction", "style-variant", "spacing"];
|
|
1900
|
-
}
|
|
1901
|
-
get direction() {
|
|
1902
|
-
return this.getAttribute("direction") === "vertical" ? "vertical" : "horizontal";
|
|
1903
|
-
}
|
|
1904
|
-
set direction(t) {
|
|
1905
|
-
this.setAttribute("direction", t);
|
|
1906
|
-
}
|
|
1907
|
-
get styleVariant() {
|
|
1908
|
-
let t = this.getAttribute("style-variant");
|
|
1909
|
-
return t === "subtle" || t === "strong" ? t : "default";
|
|
1910
|
-
}
|
|
1911
|
-
set styleVariant(t) {
|
|
1912
|
-
this.setAttribute("style-variant", t);
|
|
1913
|
-
}
|
|
1914
|
-
get spacing() {
|
|
1915
|
-
let t = this.getAttribute("spacing");
|
|
1916
|
-
return t === "sm" || t === "md" || t === "lg" ? t : null;
|
|
1917
|
-
}
|
|
1918
|
-
set spacing(t) {
|
|
1919
|
-
t === null ? this.removeAttribute("spacing") : this.setAttribute("spacing", t);
|
|
1920
|
-
}
|
|
1921
|
-
constructor() {
|
|
1922
|
-
super();
|
|
1923
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
1924
|
-
e.textContent = nt, t.appendChild(e);
|
|
1925
|
-
let n = document.createElement("hr");
|
|
1926
|
-
n.className = zt, t.appendChild(n);
|
|
1927
|
-
}
|
|
1928
|
-
};
|
|
1929
|
-
var rt = `:host {
|
|
928
|
+
`,ct="dt-divider-inner",ut=class extends HTMLElement{static get observedAttributes(){return["direction","style-variant","spacing"]}get direction(){return this.getAttribute("direction")==="vertical"?"vertical":"horizontal"}set direction(e){this.setAttribute("direction",e)}get styleVariant(){let e=this.getAttribute("style-variant");return e==="subtle"||e==="strong"?e:"default"}set styleVariant(e){this.setAttribute("style-variant",e)}get spacing(){let e=this.getAttribute("spacing");return e==="sm"||e==="md"||e==="lg"?e:null}set spacing(e){e===null?this.removeAttribute("spacing"):this.setAttribute("spacing",e)}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=lt,e.appendChild(t);let r=document.createElement("hr");r.className=ct,e.appendChild(r)}},ht=`:host {
|
|
1930
929
|
display: block;
|
|
1931
930
|
min-height: 180px;
|
|
1932
931
|
color: var(--dt-text);
|
|
@@ -2094,256 +1093,7 @@ var rt = `:host {
|
|
|
2094
1093
|
letter-spacing: 0.08em;
|
|
2095
1094
|
font-size: 0.75rem;
|
|
2096
1095
|
}
|
|
2097
|
-
`;
|
|
2098
|
-
function Lt(r) {
|
|
2099
|
-
return r == null || r === false ? null : r === true ? "" : String(r);
|
|
2100
|
-
}
|
|
2101
|
-
function Ht(r, t) {
|
|
2102
|
-
let e = r.querySelectorAll("*");
|
|
2103
|
-
for (let n of e) {
|
|
2104
|
-
let i = n.getAttribute("data-field");
|
|
2105
|
-
if (i) {
|
|
2106
|
-
let s = t[i];
|
|
2107
|
-
n.textContent = s == null ? "" : String(s);
|
|
2108
|
-
}
|
|
2109
|
-
for (let s of n.getAttributeNames()) {
|
|
2110
|
-
if (s === "data-field" || !s.startsWith("data-field-")) continue;
|
|
2111
|
-
let o = s.slice(11);
|
|
2112
|
-
if (!o) continue;
|
|
2113
|
-
let a = n.getAttribute(s);
|
|
2114
|
-
if (!a) continue;
|
|
2115
|
-
let d = Lt(t[a]);
|
|
2116
|
-
d === null ? n.removeAttribute(o) : n.setAttribute(o, d);
|
|
2117
|
-
}
|
|
2118
|
-
}
|
|
2119
|
-
}
|
|
2120
|
-
function M(r, t) {
|
|
2121
|
-
let e = r.content.cloneNode(true);
|
|
2122
|
-
return Ht(e, t), e;
|
|
2123
|
-
}
|
|
2124
|
-
var m = class {
|
|
2125
|
-
_count = 0;
|
|
2126
|
-
_estimateSize = 56;
|
|
2127
|
-
_overscan = 5;
|
|
2128
|
-
_fixedSize = null;
|
|
2129
|
-
_viewportHeight = 0;
|
|
2130
|
-
_scrollTop = 0;
|
|
2131
|
-
_sizes = /* @__PURE__ */ new Map();
|
|
2132
|
-
constructor(t = {}) {
|
|
2133
|
-
this._count = t.count ?? 0, this._estimateSize = t.estimateSize ?? 56, this._overscan = t.overscan ?? 5, this._fixedSize = t.fixedSize ?? null;
|
|
2134
|
-
}
|
|
2135
|
-
setCount(t) {
|
|
2136
|
-
this._count = Math.max(0, t);
|
|
2137
|
-
for (let e of this._sizes.keys()) e >= this._count && this._sizes.delete(e);
|
|
2138
|
-
}
|
|
2139
|
-
setViewportHeight(t) {
|
|
2140
|
-
this._viewportHeight = Math.max(0, t);
|
|
2141
|
-
}
|
|
2142
|
-
setScrollTop(t) {
|
|
2143
|
-
this._scrollTop = Math.max(0, t);
|
|
2144
|
-
}
|
|
2145
|
-
setEstimateSize(t) {
|
|
2146
|
-
this._estimateSize = Math.max(1, t);
|
|
2147
|
-
}
|
|
2148
|
-
setFixedSize(t) {
|
|
2149
|
-
this._fixedSize = t && t > 0 ? t : null;
|
|
2150
|
-
}
|
|
2151
|
-
resetMeasurements() {
|
|
2152
|
-
this._sizes.clear();
|
|
2153
|
-
}
|
|
2154
|
-
measure(t, e) {
|
|
2155
|
-
if (this._fixedSize !== null || t < 0 || t >= this._count) return 0;
|
|
2156
|
-
let n = Math.max(1, Math.round(e)), i = this._sizes.get(t);
|
|
2157
|
-
return i === n ? 0 : (this._sizes.set(t, n), this.getOffset(t + 1) <= this._scrollTop ? n - (i ?? this._estimateSize) : 0);
|
|
2158
|
-
}
|
|
2159
|
-
getOffset(t) {
|
|
2160
|
-
if (t <= 0) return 0;
|
|
2161
|
-
let e = Math.min(t, this._count);
|
|
2162
|
-
if (this._fixedSize !== null) return e * this._fixedSize;
|
|
2163
|
-
let n = 0;
|
|
2164
|
-
for (let i = 0; i < e; i += 1) n += this._sizes.get(i) ?? this._estimateSize;
|
|
2165
|
-
return n;
|
|
2166
|
-
}
|
|
2167
|
-
getTotalHeight() {
|
|
2168
|
-
return this.getOffset(this._count);
|
|
2169
|
-
}
|
|
2170
|
-
getRange() {
|
|
2171
|
-
if (this._count === 0) return { start: 0, end: 0, paddingTop: 0, paddingBottom: 0, totalHeight: 0 };
|
|
2172
|
-
if (this._fixedSize !== null) {
|
|
2173
|
-
let d = Math.max(1, Math.ceil(this._viewportHeight / this._fixedSize)), c = Math.max(0, Math.floor(this._scrollTop / this._fixedSize) - this._overscan), l = Math.min(this._count, c + d + this._overscan * 2), f = c * this._fixedSize, _ = this._count * this._fixedSize, h = Math.max(0, _ - f - (l - c) * this._fixedSize);
|
|
2174
|
-
return { start: c, end: l, paddingTop: f, paddingBottom: h, totalHeight: _ };
|
|
2175
|
-
}
|
|
2176
|
-
let t = 0, e = 0;
|
|
2177
|
-
for (; t < this._count; ) {
|
|
2178
|
-
let d = this._sizes.get(t) ?? this._estimateSize;
|
|
2179
|
-
if (e + d > this._scrollTop) break;
|
|
2180
|
-
e += d, t += 1;
|
|
2181
|
-
}
|
|
2182
|
-
t = Math.max(0, t - this._overscan);
|
|
2183
|
-
let n = this.getOffset(t), i = t, s = 0;
|
|
2184
|
-
for (; i < this._count && s < this._viewportHeight; ) s += this._sizes.get(i) ?? this._estimateSize, i += 1;
|
|
2185
|
-
i = Math.min(this._count, i + this._overscan);
|
|
2186
|
-
let o = this.getTotalHeight(), a = Math.max(0, o - this.getOffset(i));
|
|
2187
|
-
return { start: t, end: i, paddingTop: n, paddingBottom: a, totalHeight: o };
|
|
2188
|
-
}
|
|
2189
|
-
};
|
|
2190
|
-
function Rt(r) {
|
|
2191
|
-
return r && typeof r == "object" ? r : { value: r };
|
|
2192
|
-
}
|
|
2193
|
-
function Vt(r) {
|
|
2194
|
-
return r === "center" || r === "right" ? r : "left";
|
|
2195
|
-
}
|
|
2196
|
-
var b = class extends HTMLElement {
|
|
2197
|
-
static get observedAttributes() {
|
|
2198
|
-
return ["field", "header", "width", "min-width", "align"];
|
|
2199
|
-
}
|
|
2200
|
-
get field() {
|
|
2201
|
-
return this.getAttribute("field") ?? "";
|
|
2202
|
-
}
|
|
2203
|
-
get header() {
|
|
2204
|
-
return this.getAttribute("header") ?? this.field;
|
|
2205
|
-
}
|
|
2206
|
-
get width() {
|
|
2207
|
-
return this.getAttribute("width") ?? "auto";
|
|
2208
|
-
}
|
|
2209
|
-
get minWidth() {
|
|
2210
|
-
return this.getAttribute("min-width") ?? "0";
|
|
2211
|
-
}
|
|
2212
|
-
get align() {
|
|
2213
|
-
return Vt(this.getAttribute("align"));
|
|
2214
|
-
}
|
|
2215
|
-
connectedCallback() {
|
|
2216
|
-
this.hidden = true;
|
|
2217
|
-
}
|
|
2218
|
-
attributeChangedCallback() {
|
|
2219
|
-
this.dispatchEvent(new CustomEvent("dt-column-change", { bubbles: true, composed: true }));
|
|
2220
|
-
}
|
|
2221
|
-
};
|
|
2222
|
-
var T = class extends HTMLElement {
|
|
2223
|
-
_rows = [];
|
|
2224
|
-
_columns = [];
|
|
2225
|
-
_virtualizer = new m({ estimateSize: 40, overscan: 5, fixedSize: 40 });
|
|
2226
|
-
_root;
|
|
2227
|
-
_scroll;
|
|
2228
|
-
_header;
|
|
2229
|
-
_body;
|
|
2230
|
-
_canvas;
|
|
2231
|
-
_emptyState;
|
|
2232
|
-
_resizeObserver = null;
|
|
2233
|
-
_mutationObserver = null;
|
|
2234
|
-
_sortField = null;
|
|
2235
|
-
_sortDirection = "asc";
|
|
2236
|
-
static get observedAttributes() {
|
|
2237
|
-
return ["row-height", "sortable", "striped", "bordered", "empty-text"];
|
|
2238
|
-
}
|
|
2239
|
-
get rows() {
|
|
2240
|
-
return this._rows;
|
|
2241
|
-
}
|
|
2242
|
-
set rows(t) {
|
|
2243
|
-
this._rows = Array.isArray(t) ? t : [], this._virtualizer.setCount(this._rows.length), this._render();
|
|
2244
|
-
}
|
|
2245
|
-
get rowHeight() {
|
|
2246
|
-
let t = Number(this.getAttribute("row-height") ?? "40");
|
|
2247
|
-
return Number.isFinite(t) && t > 0 ? t : 40;
|
|
2248
|
-
}
|
|
2249
|
-
set rowHeight(t) {
|
|
2250
|
-
this.setAttribute("row-height", String(t));
|
|
2251
|
-
}
|
|
2252
|
-
get sortable() {
|
|
2253
|
-
return this.hasAttribute("sortable");
|
|
2254
|
-
}
|
|
2255
|
-
get emptyText() {
|
|
2256
|
-
return this.getAttribute("empty-text") ?? "No data";
|
|
2257
|
-
}
|
|
2258
|
-
constructor() {
|
|
2259
|
-
super();
|
|
2260
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
2261
|
-
e.textContent = rt, t.appendChild(e), this._root = document.createElement("div"), this._root.className = "dt-table-view", this._scroll = document.createElement("div"), this._scroll.className = "dt-table-scroll", this._scroll.addEventListener("scroll", this._onScroll, { passive: true }), this._header = document.createElement("div"), this._header.className = "dt-table-header", this._body = document.createElement("div"), this._body.className = "dt-table-body", this._canvas = document.createElement("div"), this._canvas.className = "dt-table-canvas", this._emptyState = document.createElement("div"), this._emptyState.className = "dt-table-empty", this._body.append(this._canvas, this._emptyState), this._scroll.append(this._header, this._body), this._root.appendChild(this._scroll), t.appendChild(this._root);
|
|
2262
|
-
}
|
|
2263
|
-
connectedCallback() {
|
|
2264
|
-
this._virtualizer.setFixedSize(this.rowHeight), this._virtualizer.setEstimateSize(this.rowHeight), this._syncColumns(), this._resizeObserver = new ResizeObserver((t) => {
|
|
2265
|
-
for (let e of t) if (e.target === this._scroll) {
|
|
2266
|
-
let n = this._header.offsetHeight;
|
|
2267
|
-
this._virtualizer.setViewportHeight(Math.max(0, e.contentRect.height - n)), this._render();
|
|
2268
|
-
}
|
|
2269
|
-
}), this._resizeObserver.observe(this._scroll), this._mutationObserver = new MutationObserver(() => {
|
|
2270
|
-
this._syncColumns(), this._render();
|
|
2271
|
-
}), this._mutationObserver.observe(this, { childList: true, subtree: true, attributes: true, attributeFilter: ["field", "header", "width", "min-width", "align"] }), this._virtualizer.setCount(this._rows.length), this._virtualizer.setViewportHeight(Math.max(0, this._scroll.clientHeight - this._header.offsetHeight)), this._render();
|
|
2272
|
-
}
|
|
2273
|
-
disconnectedCallback() {
|
|
2274
|
-
this._scroll.removeEventListener("scroll", this._onScroll), this._resizeObserver?.disconnect(), this._mutationObserver?.disconnect(), this._resizeObserver = null, this._mutationObserver = null;
|
|
2275
|
-
}
|
|
2276
|
-
attributeChangedCallback(t) {
|
|
2277
|
-
t === "row-height" && (this._virtualizer.setFixedSize(this.rowHeight), this._virtualizer.setEstimateSize(this.rowHeight)), this._render();
|
|
2278
|
-
}
|
|
2279
|
-
_onScroll = () => {
|
|
2280
|
-
this._virtualizer.setScrollTop(Math.max(0, this._scroll.scrollTop - this._header.offsetHeight)), this._renderBody();
|
|
2281
|
-
};
|
|
2282
|
-
_syncColumns() {
|
|
2283
|
-
this._columns = Array.from(this.children).filter((t) => t instanceof b).map((t) => ({ field: t.field, header: t.header, width: t.width, minWidth: t.minWidth, align: t.align, template: Array.from(t.children).find((e) => e instanceof HTMLTemplateElement) ?? null })).filter((t) => t.field);
|
|
2284
|
-
}
|
|
2285
|
-
_render() {
|
|
2286
|
-
if (!this.isConnected) return;
|
|
2287
|
-
this._emptyState.textContent = this.emptyText;
|
|
2288
|
-
let t = this._columns.length > 0 ? this._columns.map((e) => this._toGridColumn(e)).join(" ") : "minmax(0, 1fr)";
|
|
2289
|
-
this._header.style.setProperty("--dt-table-columns", t), this._canvas.style.setProperty("--dt-table-columns", t), this._renderHeader(), this._renderBody();
|
|
2290
|
-
}
|
|
2291
|
-
_renderHeader() {
|
|
2292
|
-
let t = document.createDocumentFragment();
|
|
2293
|
-
for (let e of this._columns) {
|
|
2294
|
-
let n = document.createElement("div");
|
|
2295
|
-
n.className = "dt-table-header-cell", n.dataset.align = e.align, this.sortable && (n.classList.add("dt-table-header-cell--sortable"), n.tabIndex = 0, n.setAttribute("role", "button"), n.setAttribute("aria-label", `Sort by ${e.header}`), n.addEventListener("click", () => this._requestSort(e.field)), n.addEventListener("keydown", (s) => {
|
|
2296
|
-
(s.key === "Enter" || s.key === " ") && (s.preventDefault(), this._requestSort(e.field));
|
|
2297
|
-
}));
|
|
2298
|
-
let i = document.createElement("span");
|
|
2299
|
-
if (i.className = "dt-table-header-label", i.textContent = e.header, this.sortable) {
|
|
2300
|
-
let s = document.createElement("span");
|
|
2301
|
-
s.className = "dt-table-sort-indicator", this._sortField === e.field ? s.textContent = this._sortDirection === "asc" ? "\u25B2" : "\u25BC" : s.textContent = "\u2195", i.appendChild(s);
|
|
2302
|
-
}
|
|
2303
|
-
n.appendChild(i), t.appendChild(n);
|
|
2304
|
-
}
|
|
2305
|
-
this._header.replaceChildren(t);
|
|
2306
|
-
}
|
|
2307
|
-
_renderBody() {
|
|
2308
|
-
if (this._rows.length === 0 || this._columns.length === 0) {
|
|
2309
|
-
this._emptyState.hidden = false, this._canvas.replaceChildren(), this._body.style.height = "140px", this._canvas.style.height = "0px";
|
|
2310
|
-
return;
|
|
2311
|
-
}
|
|
2312
|
-
this._emptyState.hidden = true, this._virtualizer.setCount(this._rows.length), this._virtualizer.setScrollTop(Math.max(0, this._scroll.scrollTop - this._header.offsetHeight)), this._virtualizer.setViewportHeight(Math.max(0, this._scroll.clientHeight - this._header.offsetHeight));
|
|
2313
|
-
let t = this._virtualizer.getRange();
|
|
2314
|
-
this._body.style.height = `${Math.max(t.totalHeight, this._scroll.clientHeight - this._header.offsetHeight)}px`, this._canvas.style.height = `${t.totalHeight}px`;
|
|
2315
|
-
let e = document.createDocumentFragment();
|
|
2316
|
-
for (let n = t.start; n < t.end; n += 1) e.appendChild(this._renderRow(n));
|
|
2317
|
-
this._canvas.replaceChildren(e);
|
|
2318
|
-
}
|
|
2319
|
-
_renderRow(t) {
|
|
2320
|
-
let e = this._rows[t], n = document.createElement("div");
|
|
2321
|
-
n.className = "dt-table-row dt-table-row--clickable", n.style.top = `${this._virtualizer.getOffset(t)}px`, n.style.height = `${this.rowHeight}px`, n.style.setProperty("--dt-table-columns", this._header.style.getPropertyValue("--dt-table-columns")), n.addEventListener("click", () => {
|
|
2322
|
-
this.dispatchEvent(new CustomEvent("dt-row-click", { detail: { row: e, index: t }, bubbles: true, composed: true }));
|
|
2323
|
-
});
|
|
2324
|
-
let i = Rt(e);
|
|
2325
|
-
for (let s of this._columns) {
|
|
2326
|
-
let o = document.createElement("div");
|
|
2327
|
-
if (o.className = "dt-table-cell", o.dataset.align = s.align, s.template) o.appendChild(M(s.template, i));
|
|
2328
|
-
else {
|
|
2329
|
-
let a = i[s.field];
|
|
2330
|
-
o.textContent = a == null ? "" : String(a);
|
|
2331
|
-
}
|
|
2332
|
-
n.appendChild(o);
|
|
2333
|
-
}
|
|
2334
|
-
return n;
|
|
2335
|
-
}
|
|
2336
|
-
_requestSort(t) {
|
|
2337
|
-
this._sortField === t ? this._sortDirection = this._sortDirection === "asc" ? "desc" : "asc" : (this._sortField = t, this._sortDirection = "asc"), this._renderHeader(), this.dispatchEvent(new CustomEvent("dt-sort", { detail: { field: t, direction: this._sortDirection }, bubbles: true, composed: true }));
|
|
2338
|
-
}
|
|
2339
|
-
_toGridColumn(t) {
|
|
2340
|
-
let e = /^\d+$/.test(t.minWidth) ? `${t.minWidth}px` : t.minWidth;
|
|
2341
|
-
if (t.width === "auto") return `minmax(${e}, 1fr)`;
|
|
2342
|
-
let n = /^\d+$/.test(t.width) ? `${t.width}px` : t.width;
|
|
2343
|
-
return `minmax(${e}, ${n})`;
|
|
2344
|
-
}
|
|
2345
|
-
};
|
|
2346
|
-
var it = `:host {
|
|
1096
|
+
`;function pt(e){return e==null||e===!1?null:e===!0?"":String(e)}function mt(e,t){let r=e.querySelectorAll("*");for(let i of r){let n=i.getAttribute("data-field");if(n){let a=t[n];i.textContent=a==null?"":String(a)}for(let a of i.getAttributeNames()){if(a==="data-field"||!a.startsWith("data-field-"))continue;let c=a.slice(11);if(!c)continue;let d=i.getAttribute(a);if(!d)continue;let s=pt(t[d]);s===null?i.removeAttribute(c):i.setAttribute(c,s)}}}function le(e,t){let r=e.content.cloneNode(!0);return mt(r,t),r}var ce=class{_count=0;_estimateSize=56;_overscan=5;_fixedSize=null;_viewportHeight=0;_scrollTop=0;_sizes=new Map;constructor(e={}){this._count=e.count??0,this._estimateSize=e.estimateSize??56,this._overscan=e.overscan??5,this._fixedSize=e.fixedSize??null}setCount(e){this._count=Math.max(0,e);for(let t of this._sizes.keys())t>=this._count&&this._sizes.delete(t)}setViewportHeight(e){this._viewportHeight=Math.max(0,e)}setScrollTop(e){this._scrollTop=Math.max(0,e)}setEstimateSize(e){this._estimateSize=Math.max(1,e)}setFixedSize(e){this._fixedSize=e&&e>0?e:null}resetMeasurements(){this._sizes.clear()}measure(e,t){if(this._fixedSize!==null||e<0||e>=this._count)return 0;let r=Math.max(1,Math.round(t)),i=this._sizes.get(e);return i===r?0:(this._sizes.set(e,r),this.getOffset(e+1)<=this._scrollTop?r-(i??this._estimateSize):0)}getOffset(e){if(e<=0)return 0;let t=Math.min(e,this._count);if(this._fixedSize!==null)return t*this._fixedSize;let r=0;for(let i=0;i<t;i+=1)r+=this._sizes.get(i)??this._estimateSize;return r}getTotalHeight(){return this.getOffset(this._count)}getRange(){if(this._count===0)return{start:0,end:0,paddingTop:0,paddingBottom:0,totalHeight:0};if(this._fixedSize!==null){let d=Math.max(1,Math.ceil(this._viewportHeight/this._fixedSize)),s=Math.max(0,Math.floor(this._scrollTop/this._fixedSize)-this._overscan),h=Math.min(this._count,s+d+this._overscan*2),p=s*this._fixedSize,f=this._count*this._fixedSize,u=Math.max(0,f-p-(h-s)*this._fixedSize);return{start:s,end:h,paddingTop:p,paddingBottom:u,totalHeight:f}}let e=0,t=0;for(;e<this._count;){let d=this._sizes.get(e)??this._estimateSize;if(t+d>this._scrollTop)break;t+=d,e+=1}e=Math.max(0,e-this._overscan);let r=this.getOffset(e),i=e,n=0;for(;i<this._count&&n<this._viewportHeight;)n+=this._sizes.get(i)??this._estimateSize,i+=1;i=Math.min(this._count,i+this._overscan);let a=this.getTotalHeight(),c=Math.max(0,a-this.getOffset(i));return{start:e,end:i,paddingTop:r,paddingBottom:c,totalHeight:a}}};function vt(e){return e&&typeof e=="object"?e:{value:e}}function bt(e){return e==="center"||e==="right"?e:"left"}var ue=class extends HTMLElement{static get observedAttributes(){return["field","header","width","min-width","align"]}get field(){return this.getAttribute("field")??""}get header(){return this.getAttribute("header")??this.field}get width(){return this.getAttribute("width")??"auto"}get minWidth(){return this.getAttribute("min-width")??"0"}get align(){return bt(this.getAttribute("align"))}connectedCallback(){this.hidden=!0}attributeChangedCallback(){this.dispatchEvent(new CustomEvent("dt-column-change",{bubbles:!0,composed:!0}))}},gt=class extends HTMLElement{_rows=[];_columns=[];_virtualizer=new ce({estimateSize:40,overscan:5,fixedSize:40});_root;_scroll;_header;_body;_canvas;_emptyState;_resizeObserver=null;_mutationObserver=null;_sortField=null;_sortDirection="asc";static get observedAttributes(){return["row-height","sortable","striped","bordered","empty-text"]}get rows(){return this._rows}set rows(e){this._rows=Array.isArray(e)?e:[],this._virtualizer.setCount(this._rows.length),this._render()}get rowHeight(){let e=Number(this.getAttribute("row-height")??"40");return Number.isFinite(e)&&e>0?e:40}set rowHeight(e){this.setAttribute("row-height",String(e))}get sortable(){return this.hasAttribute("sortable")}get emptyText(){return this.getAttribute("empty-text")??"No data"}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=ht,e.appendChild(t),this._root=document.createElement("div"),this._root.className="dt-table-view",this._scroll=document.createElement("div"),this._scroll.className="dt-table-scroll",this._scroll.addEventListener("scroll",this._onScroll,{passive:!0}),this._header=document.createElement("div"),this._header.className="dt-table-header",this._body=document.createElement("div"),this._body.className="dt-table-body",this._canvas=document.createElement("div"),this._canvas.className="dt-table-canvas",this._emptyState=document.createElement("div"),this._emptyState.className="dt-table-empty",this._body.append(this._canvas,this._emptyState),this._scroll.append(this._header,this._body),this._root.appendChild(this._scroll),e.appendChild(this._root)}connectedCallback(){this._virtualizer.setFixedSize(this.rowHeight),this._virtualizer.setEstimateSize(this.rowHeight),this._syncColumns(),this._resizeObserver=new ResizeObserver(e=>{for(let t of e)if(t.target===this._scroll){let r=this._header.offsetHeight;this._virtualizer.setViewportHeight(Math.max(0,t.contentRect.height-r)),this._render()}}),this._resizeObserver.observe(this._scroll),this._mutationObserver=new MutationObserver(()=>{this._syncColumns(),this._render()}),this._mutationObserver.observe(this,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["field","header","width","min-width","align"]}),this._virtualizer.setCount(this._rows.length),this._virtualizer.setViewportHeight(Math.max(0,this._scroll.clientHeight-this._header.offsetHeight)),this._render()}disconnectedCallback(){this._scroll.removeEventListener("scroll",this._onScroll),this._resizeObserver?.disconnect(),this._mutationObserver?.disconnect(),this._resizeObserver=null,this._mutationObserver=null}attributeChangedCallback(e){e==="row-height"&&(this._virtualizer.setFixedSize(this.rowHeight),this._virtualizer.setEstimateSize(this.rowHeight)),this._render()}_onScroll=()=>{this._virtualizer.setScrollTop(Math.max(0,this._scroll.scrollTop-this._header.offsetHeight)),this._renderBody()};_syncColumns(){this._columns=Array.from(this.children).filter(e=>e instanceof ue).map(e=>({field:e.field,header:e.header,width:e.width,minWidth:e.minWidth,align:e.align,template:Array.from(e.children).find(t=>t instanceof HTMLTemplateElement)??null})).filter(e=>e.field)}_render(){if(!this.isConnected)return;this._emptyState.textContent=this.emptyText;let e=this._columns.length>0?this._columns.map(t=>this._toGridColumn(t)).join(" "):"minmax(0, 1fr)";this._header.style.setProperty("--dt-table-columns",e),this._canvas.style.setProperty("--dt-table-columns",e),this._renderHeader(),this._renderBody()}_renderHeader(){let e=document.createDocumentFragment();for(let t of this._columns){let r=document.createElement("div");r.className="dt-table-header-cell",r.dataset.align=t.align,this.sortable&&(r.classList.add("dt-table-header-cell--sortable"),r.tabIndex=0,r.setAttribute("role","button"),r.setAttribute("aria-label",`Sort by ${t.header}`),r.addEventListener("click",()=>this._requestSort(t.field)),r.addEventListener("keydown",n=>{(n.key==="Enter"||n.key===" ")&&(n.preventDefault(),this._requestSort(t.field))}));let i=document.createElement("span");if(i.className="dt-table-header-label",i.textContent=t.header,this.sortable){let n=document.createElement("span");n.className="dt-table-sort-indicator",this._sortField===t.field?n.textContent=this._sortDirection==="asc"?"\u25B2":"\u25BC":n.textContent="\u2195",i.appendChild(n)}r.appendChild(i),e.appendChild(r)}this._header.replaceChildren(e)}_renderBody(){if(this._rows.length===0||this._columns.length===0){this._emptyState.hidden=!1,this._canvas.replaceChildren(),this._body.style.height="140px",this._canvas.style.height="0px";return}this._emptyState.hidden=!0,this._virtualizer.setCount(this._rows.length),this._virtualizer.setScrollTop(Math.max(0,this._scroll.scrollTop-this._header.offsetHeight)),this._virtualizer.setViewportHeight(Math.max(0,this._scroll.clientHeight-this._header.offsetHeight));let e=this._virtualizer.getRange();this._body.style.height=`${Math.max(e.totalHeight,this._scroll.clientHeight-this._header.offsetHeight)}px`,this._canvas.style.height=`${e.totalHeight}px`;let t=document.createDocumentFragment();for(let r=e.start;r<e.end;r+=1)t.appendChild(this._renderRow(r));this._canvas.replaceChildren(t)}_renderRow(e){let t=this._rows[e],r=document.createElement("div");r.className="dt-table-row dt-table-row--clickable",r.style.top=`${this._virtualizer.getOffset(e)}px`,r.style.height=`${this.rowHeight}px`,r.style.setProperty("--dt-table-columns",this._header.style.getPropertyValue("--dt-table-columns")),r.addEventListener("click",()=>{this.dispatchEvent(new CustomEvent("dt-row-click",{detail:{row:t,index:e},bubbles:!0,composed:!0}))});let i=vt(t);for(let n of this._columns){let a=document.createElement("div");if(a.className="dt-table-cell",a.dataset.align=n.align,n.template)a.appendChild(le(n.template,i));else{let c=i[n.field];a.textContent=c==null?"":String(c)}r.appendChild(a)}return r}_requestSort(e){this._sortField===e?this._sortDirection=this._sortDirection==="asc"?"desc":"asc":(this._sortField=e,this._sortDirection="asc"),this._renderHeader(),this.dispatchEvent(new CustomEvent("dt-sort",{detail:{field:e,direction:this._sortDirection},bubbles:!0,composed:!0}))}_toGridColumn(e){let t=/^\d+$/.test(e.minWidth)?`${e.minWidth}px`:e.minWidth;if(e.width==="auto")return`minmax(${t}, 1fr)`;let r=/^\d+$/.test(e.width)?`${e.width}px`:e.width;return`minmax(${t}, ${r})`}},ft=`:host {
|
|
2347
1097
|
display: block;
|
|
2348
1098
|
min-height: 120px;
|
|
2349
1099
|
color: var(--dt-text);
|
|
@@ -2442,133 +1192,7 @@ var it = `:host {
|
|
|
2442
1192
|
letter-spacing: 0.08em;
|
|
2443
1193
|
font-size: 0.75rem;
|
|
2444
1194
|
}
|
|
2445
|
-
`;
|
|
2446
|
-
var st = 56;
|
|
2447
|
-
function Pt(r) {
|
|
2448
|
-
return r && typeof r == "object" ? r : { value: r };
|
|
2449
|
-
}
|
|
2450
|
-
var z = class extends HTMLElement {
|
|
2451
|
-
_items = [];
|
|
2452
|
-
_selectedIndices = /* @__PURE__ */ new Set();
|
|
2453
|
-
_renderItem = null;
|
|
2454
|
-
_virtualizer = new m({ estimateSize: st, overscan: 5 });
|
|
2455
|
-
_viewport;
|
|
2456
|
-
_spacer;
|
|
2457
|
-
_itemsLayer;
|
|
2458
|
-
_emptyState;
|
|
2459
|
-
_resizeObserver = null;
|
|
2460
|
-
_itemResizeObserver = null;
|
|
2461
|
-
static get observedAttributes() {
|
|
2462
|
-
return ["item-height", "dividers", "selectable", "empty-text"];
|
|
2463
|
-
}
|
|
2464
|
-
get items() {
|
|
2465
|
-
return this._items;
|
|
2466
|
-
}
|
|
2467
|
-
set items(t) {
|
|
2468
|
-
this._items = Array.isArray(t) ? t : [], this._selectedIndices = new Set([...this._selectedIndices].filter((e) => e < this._items.length)), this._virtualizer.setCount(this._items.length), this._syncSizingMode(true), this._render();
|
|
2469
|
-
}
|
|
2470
|
-
get selectedItems() {
|
|
2471
|
-
return [...this._selectedIndices].sort((t, e) => t - e).map((t) => this._items[t]);
|
|
2472
|
-
}
|
|
2473
|
-
get renderItem() {
|
|
2474
|
-
return this._renderItem;
|
|
2475
|
-
}
|
|
2476
|
-
set renderItem(t) {
|
|
2477
|
-
this._renderItem = typeof t == "function" ? t : null, this._render();
|
|
2478
|
-
}
|
|
2479
|
-
get itemHeight() {
|
|
2480
|
-
let t = this.getAttribute("item-height");
|
|
2481
|
-
if (!t) return null;
|
|
2482
|
-
let e = Number(t);
|
|
2483
|
-
return Number.isFinite(e) && e > 0 ? e : null;
|
|
2484
|
-
}
|
|
2485
|
-
set itemHeight(t) {
|
|
2486
|
-
if (t === null || t <= 0) {
|
|
2487
|
-
this.removeAttribute("item-height");
|
|
2488
|
-
return;
|
|
2489
|
-
}
|
|
2490
|
-
this.setAttribute("item-height", String(t));
|
|
2491
|
-
}
|
|
2492
|
-
get selectable() {
|
|
2493
|
-
let t = this.getAttribute("selectable");
|
|
2494
|
-
return t === "single" || t === "multi" ? t : "none";
|
|
2495
|
-
}
|
|
2496
|
-
set selectable(t) {
|
|
2497
|
-
this.setAttribute("selectable", t);
|
|
2498
|
-
}
|
|
2499
|
-
get emptyText() {
|
|
2500
|
-
return this.getAttribute("empty-text") ?? "No items";
|
|
2501
|
-
}
|
|
2502
|
-
set emptyText(t) {
|
|
2503
|
-
this.setAttribute("empty-text", t);
|
|
2504
|
-
}
|
|
2505
|
-
constructor() {
|
|
2506
|
-
super();
|
|
2507
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
2508
|
-
e.textContent = it, t.appendChild(e), this._viewport = document.createElement("div"), this._viewport.className = "dt-list-view", this._viewport.addEventListener("scroll", this._onScroll, { passive: true }), this._spacer = document.createElement("div"), this._spacer.className = "dt-list-spacer", this._itemsLayer = document.createElement("div"), this._itemsLayer.className = "dt-list-items", this._emptyState = document.createElement("div"), this._emptyState.className = "dt-list-empty", this._spacer.append(this._itemsLayer, this._emptyState), this._viewport.appendChild(this._spacer), t.appendChild(this._viewport);
|
|
2509
|
-
}
|
|
2510
|
-
connectedCallback() {
|
|
2511
|
-
this._resizeObserver = new ResizeObserver((t) => {
|
|
2512
|
-
for (let e of t) e.target === this._viewport && (this._virtualizer.setViewportHeight(e.contentRect.height), this._render());
|
|
2513
|
-
}), this._resizeObserver.observe(this._viewport), this._itemResizeObserver = new ResizeObserver((t) => {
|
|
2514
|
-
let e = 0;
|
|
2515
|
-
for (let n of t) {
|
|
2516
|
-
let i = n.target, s = Number(i.dataset.index);
|
|
2517
|
-
Number.isFinite(s) && (e += this._virtualizer.measure(s, n.contentRect.height));
|
|
2518
|
-
}
|
|
2519
|
-
e !== 0 && (this._viewport.scrollTop += e), t.length > 0 && this._render();
|
|
2520
|
-
}), this._virtualizer.setCount(this._items.length), this._virtualizer.setViewportHeight(this._viewport.clientHeight), this._syncSizingMode(false), this._render();
|
|
2521
|
-
}
|
|
2522
|
-
disconnectedCallback() {
|
|
2523
|
-
this._viewport.removeEventListener("scroll", this._onScroll), this._resizeObserver?.disconnect(), this._itemResizeObserver?.disconnect(), this._resizeObserver = null, this._itemResizeObserver = null;
|
|
2524
|
-
}
|
|
2525
|
-
attributeChangedCallback(t) {
|
|
2526
|
-
t === "item-height" && this._syncSizingMode(true), t === "selectable" && this.selectable === "none" && this._selectedIndices.size > 0 && (this._selectedIndices.clear(), this._emitSelectionChange()), this._render();
|
|
2527
|
-
}
|
|
2528
|
-
_onScroll = () => {
|
|
2529
|
-
this._virtualizer.setScrollTop(this._viewport.scrollTop), this._render();
|
|
2530
|
-
};
|
|
2531
|
-
_syncSizingMode(t) {
|
|
2532
|
-
let e = this.itemHeight;
|
|
2533
|
-
this._virtualizer.setFixedSize(e), this._virtualizer.setEstimateSize(e ?? st), t && this._virtualizer.resetMeasurements();
|
|
2534
|
-
}
|
|
2535
|
-
_render() {
|
|
2536
|
-
if (!this.isConnected) return;
|
|
2537
|
-
if (this._emptyState.textContent = this.emptyText, this._emptyState.hidden = this._items.length > 0, this._items.length === 0) {
|
|
2538
|
-
this._itemsLayer.replaceChildren(), this._spacer.style.height = "100%";
|
|
2539
|
-
return;
|
|
2540
|
-
}
|
|
2541
|
-
this._virtualizer.setScrollTop(this._viewport.scrollTop), this._virtualizer.setViewportHeight(this._viewport.clientHeight), this._virtualizer.setCount(this._items.length);
|
|
2542
|
-
let t = this._virtualizer.getRange();
|
|
2543
|
-
this._spacer.style.height = `${Math.max(t.totalHeight, this._viewport.clientHeight)}px`, this._itemsLayer.style.transform = `translateY(${t.paddingTop}px)`;
|
|
2544
|
-
let e = document.createDocumentFragment();
|
|
2545
|
-
for (let n = t.start; n < t.end; n += 1) e.appendChild(this._renderVisibleItem(n));
|
|
2546
|
-
this._itemsLayer.replaceChildren(e);
|
|
2547
|
-
}
|
|
2548
|
-
_renderVisibleItem(t) {
|
|
2549
|
-
let e = this._items[t], n = document.createElement("div");
|
|
2550
|
-
if (n.className = "dt-list-item", n.dataset.index = String(t), this.selectable !== "none" && (n.classList.add("dt-list-item--interactive"), n.setAttribute("role", "option"), n.setAttribute("aria-selected", String(this._selectedIndices.has(t))), n.tabIndex = 0), this._selectedIndices.has(t) && n.classList.add("dt-list-item--selected"), this.itemHeight !== null && (n.style.minHeight = `${this.itemHeight}px`), this._renderItem) this._renderItem(e, n, t);
|
|
2551
|
-
else {
|
|
2552
|
-
let i = this._getTemplate();
|
|
2553
|
-
i ? n.appendChild(M(i, Pt(e))) : n.textContent = String(e ?? "");
|
|
2554
|
-
}
|
|
2555
|
-
return n.addEventListener("click", () => this._handleItemClick(t)), n.addEventListener("keydown", (i) => {
|
|
2556
|
-
(i.key === "Enter" || i.key === " ") && (i.preventDefault(), this._handleItemClick(t));
|
|
2557
|
-
}), this.itemHeight === null && this._itemResizeObserver?.observe(n), n;
|
|
2558
|
-
}
|
|
2559
|
-
_handleItemClick(t) {
|
|
2560
|
-
let e = this._items[t], n = this.selectable;
|
|
2561
|
-
n === "single" ? (this._selectedIndices = /* @__PURE__ */ new Set([t]), this._emitSelectionChange(), this._render()) : n === "multi" && (this._selectedIndices.has(t) ? this._selectedIndices.delete(t) : this._selectedIndices.add(t), this._emitSelectionChange(), this._render()), this.dispatchEvent(new CustomEvent("dt-item-click", { detail: { item: e, index: t }, bubbles: true, composed: true }));
|
|
2562
|
-
}
|
|
2563
|
-
_emitSelectionChange() {
|
|
2564
|
-
this.dispatchEvent(new CustomEvent("dt-selection-change", { detail: { selected: this.selectedItems }, bubbles: true, composed: true }));
|
|
2565
|
-
}
|
|
2566
|
-
_getTemplate() {
|
|
2567
|
-
for (let t of Array.from(this.children)) if (t instanceof HTMLTemplateElement) return t;
|
|
2568
|
-
return null;
|
|
2569
|
-
}
|
|
2570
|
-
};
|
|
2571
|
-
var ot = `:host {
|
|
1195
|
+
`,he=56;function _t(e){return e&&typeof e=="object"?e:{value:e}}var yt=class extends HTMLElement{_items=[];_selectedIndices=new Set;_renderItem=null;_virtualizer=new ce({estimateSize:he,overscan:5});_viewport;_spacer;_itemsLayer;_emptyState;_resizeObserver=null;_itemResizeObserver=null;static get observedAttributes(){return["item-height","dividers","selectable","empty-text"]}get items(){return this._items}set items(e){this._items=Array.isArray(e)?e:[],this._selectedIndices=new Set([...this._selectedIndices].filter(t=>t<this._items.length)),this._virtualizer.setCount(this._items.length),this._syncSizingMode(!0),this._render()}get selectedItems(){return[...this._selectedIndices].sort((e,t)=>e-t).map(e=>this._items[e])}get renderItem(){return this._renderItem}set renderItem(e){this._renderItem=typeof e=="function"?e:null,this._render()}get itemHeight(){let e=this.getAttribute("item-height");if(!e)return null;let t=Number(e);return Number.isFinite(t)&&t>0?t:null}set itemHeight(e){if(e===null||e<=0){this.removeAttribute("item-height");return}this.setAttribute("item-height",String(e))}get selectable(){let e=this.getAttribute("selectable");return e==="single"||e==="multi"?e:"none"}set selectable(e){this.setAttribute("selectable",e)}get emptyText(){return this.getAttribute("empty-text")??"No items"}set emptyText(e){this.setAttribute("empty-text",e)}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=ft,e.appendChild(t),this._viewport=document.createElement("div"),this._viewport.className="dt-list-view",this._viewport.addEventListener("scroll",this._onScroll,{passive:!0}),this._spacer=document.createElement("div"),this._spacer.className="dt-list-spacer",this._itemsLayer=document.createElement("div"),this._itemsLayer.className="dt-list-items",this._emptyState=document.createElement("div"),this._emptyState.className="dt-list-empty",this._spacer.append(this._itemsLayer,this._emptyState),this._viewport.appendChild(this._spacer),e.appendChild(this._viewport)}connectedCallback(){this._resizeObserver=new ResizeObserver(e=>{for(let t of e)t.target===this._viewport&&(this._virtualizer.setViewportHeight(t.contentRect.height),this._render())}),this._resizeObserver.observe(this._viewport),this._itemResizeObserver=new ResizeObserver(e=>{let t=0;for(let r of e){let i=r.target,n=Number(i.dataset.index);Number.isFinite(n)&&(t+=this._virtualizer.measure(n,r.contentRect.height))}t!==0&&(this._viewport.scrollTop+=t),e.length>0&&this._render()}),this._virtualizer.setCount(this._items.length),this._virtualizer.setViewportHeight(this._viewport.clientHeight),this._syncSizingMode(!1),this._render()}disconnectedCallback(){this._viewport.removeEventListener("scroll",this._onScroll),this._resizeObserver?.disconnect(),this._itemResizeObserver?.disconnect(),this._resizeObserver=null,this._itemResizeObserver=null}attributeChangedCallback(e){e==="item-height"&&this._syncSizingMode(!0),e==="selectable"&&this.selectable==="none"&&this._selectedIndices.size>0&&(this._selectedIndices.clear(),this._emitSelectionChange()),this._render()}_onScroll=()=>{this._virtualizer.setScrollTop(this._viewport.scrollTop),this._render()};_syncSizingMode(e){let t=this.itemHeight;this._virtualizer.setFixedSize(t),this._virtualizer.setEstimateSize(t??he),e&&this._virtualizer.resetMeasurements()}_render(){if(!this.isConnected)return;if(this._emptyState.textContent=this.emptyText,this._emptyState.hidden=this._items.length>0,this._items.length===0){this._itemsLayer.replaceChildren(),this._spacer.style.height="100%";return}this._virtualizer.setScrollTop(this._viewport.scrollTop),this._virtualizer.setViewportHeight(this._viewport.clientHeight),this._virtualizer.setCount(this._items.length);let e=this._virtualizer.getRange();this._spacer.style.height=`${Math.max(e.totalHeight,this._viewport.clientHeight)}px`,this._itemsLayer.style.transform=`translateY(${e.paddingTop}px)`;let t=document.createDocumentFragment();for(let r=e.start;r<e.end;r+=1)t.appendChild(this._renderVisibleItem(r));this._itemsLayer.replaceChildren(t)}_renderVisibleItem(e){let t=this._items[e],r=document.createElement("div");if(r.className="dt-list-item",r.dataset.index=String(e),this.selectable!=="none"&&(r.classList.add("dt-list-item--interactive"),r.setAttribute("role","option"),r.setAttribute("aria-selected",String(this._selectedIndices.has(e))),r.tabIndex=0),this._selectedIndices.has(e)&&r.classList.add("dt-list-item--selected"),this.itemHeight!==null&&(r.style.minHeight=`${this.itemHeight}px`),this._renderItem)this._renderItem(t,r,e);else{let i=this._getTemplate();i?r.appendChild(le(i,_t(t))):r.textContent=String(t??"")}return r.addEventListener("click",()=>this._handleItemClick(e)),r.addEventListener("keydown",i=>{(i.key==="Enter"||i.key===" ")&&(i.preventDefault(),this._handleItemClick(e))}),this.itemHeight===null&&this._itemResizeObserver?.observe(r),r}_handleItemClick(e){let t=this._items[e],r=this.selectable;r==="single"?(this._selectedIndices=new Set([e]),this._emitSelectionChange(),this._render()):r==="multi"&&(this._selectedIndices.has(e)?this._selectedIndices.delete(e):this._selectedIndices.add(e),this._emitSelectionChange(),this._render()),this.dispatchEvent(new CustomEvent("dt-item-click",{detail:{item:t,index:e},bubbles:!0,composed:!0}))}_emitSelectionChange(){this.dispatchEvent(new CustomEvent("dt-selection-change",{detail:{selected:this.selectedItems},bubbles:!0,composed:!0}))}_getTemplate(){for(let e of Array.from(this.children))if(e instanceof HTMLTemplateElement)return e;return null}},xt=`:host {
|
|
2572
1196
|
display: block;
|
|
2573
1197
|
min-height: 220px;
|
|
2574
1198
|
color: var(--dt-text);
|
|
@@ -2655,197 +1279,7 @@ var ot = `:host {
|
|
|
2655
1279
|
.dt-chart__status[hidden] {
|
|
2656
1280
|
display: none;
|
|
2657
1281
|
}
|
|
2658
|
-
|
|
2659
|
-
var L = null;
|
|
2660
|
-
function at() {
|
|
2661
|
-
return window.__DtChart ? Promise.resolve(window.__DtChart) : L || (L = new Promise((r, t) => {
|
|
2662
|
-
let e = document.createElement("script");
|
|
2663
|
-
e.src = "/api/ui/chart.umd.js", e.async = true, e.dataset.dtChart = "true", e.onload = () => {
|
|
2664
|
-
if (window.__DtChart) {
|
|
2665
|
-
r(window.__DtChart);
|
|
2666
|
-
return;
|
|
2667
|
-
}
|
|
2668
|
-
t(new Error("Chart runtime loaded without a __DtChart export."));
|
|
2669
|
-
}, e.onerror = () => t(new Error("Failed to load the Chart.js runtime bundle.")), document.head.appendChild(e);
|
|
2670
|
-
}), L);
|
|
2671
|
-
}
|
|
2672
|
-
function v(r, t, e) {
|
|
2673
|
-
return Math.min(e, Math.max(t, r));
|
|
2674
|
-
}
|
|
2675
|
-
function It(r) {
|
|
2676
|
-
return r ? r.split(",").map((t) => t.trim()).filter(Boolean) : [];
|
|
2677
|
-
}
|
|
2678
|
-
function X(r) {
|
|
2679
|
-
let t = r.trim().match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);
|
|
2680
|
-
if (t) {
|
|
2681
|
-
let i = t[1], s = i.length === 3 ? i.split("").map((c) => `${c}${c}`).join("") : i, o = parseInt(s.slice(0, 2), 16) / 255, a = parseInt(s.slice(2, 4), 16) / 255, d = parseInt(s.slice(4, 6), 16) / 255;
|
|
2682
|
-
return dt(o, a, d);
|
|
2683
|
-
}
|
|
2684
|
-
let e = r.trim().match(/^rgba?\((\d+(?:\.\d+)?)[,\s]+(\d+(?:\.\d+)?)[,\s]+(\d+(?:\.\d+)?)(?:[,/\s]+[\d.]+)?\)$/i);
|
|
2685
|
-
if (e) return dt(Number(e[1]) / 255, Number(e[2]) / 255, Number(e[3]) / 255);
|
|
2686
|
-
let n = r.trim().match(/^hsla?\(([-\d.]+)(?:deg)?[,\s]+([\d.]+)%[,\s]+([\d.]+)%(?:[,/\s]+[\d.]+)?\)$/i);
|
|
2687
|
-
return n ? { h: (Number(n[1]) % 360 + 360) % 360, s: v(Number(n[2]), 0, 100), l: v(Number(n[3]), 0, 100) } : null;
|
|
2688
|
-
}
|
|
2689
|
-
function dt(r, t, e) {
|
|
2690
|
-
let n = Math.max(r, t, e), i = Math.min(r, t, e), s = n - i, o = 0, a = (n + i) / 2, d = s === 0 ? 0 : s / (1 - Math.abs(2 * a - 1));
|
|
2691
|
-
if (s !== 0) switch (n) {
|
|
2692
|
-
case r:
|
|
2693
|
-
o = 60 * ((t - e) / s % 6);
|
|
2694
|
-
break;
|
|
2695
|
-
case t:
|
|
2696
|
-
o = 60 * ((e - r) / s + 2);
|
|
2697
|
-
break;
|
|
2698
|
-
default:
|
|
2699
|
-
o = 60 * ((r - t) / s + 4);
|
|
2700
|
-
break;
|
|
2701
|
-
}
|
|
2702
|
-
return { h: (o + 360) % 360, s: Math.round(d * 100), l: Math.round(a * 100) };
|
|
2703
|
-
}
|
|
2704
|
-
function g(r, t = 1) {
|
|
2705
|
-
return `hsla(${Math.round(r.h)} ${Math.round(r.s)}% ${Math.round(r.l)}% / ${t})`;
|
|
2706
|
-
}
|
|
2707
|
-
function Nt(r) {
|
|
2708
|
-
let t = X(r) ?? { h: 185, s: 88, l: 56 };
|
|
2709
|
-
return [0, 32, 68, 118, 164, 212, 258, 304].map((n, i) => ({ h: (t.h + n) % 360, s: v(t.s - i * 2, 55, 90), l: v(t.l + (i % 2 === 0 ? 0 : 6) - i, 38, 66) }));
|
|
2710
|
-
}
|
|
2711
|
-
function H(r) {
|
|
2712
|
-
return !!r && typeof r == "object" && !Array.isArray(r);
|
|
2713
|
-
}
|
|
2714
|
-
function lt(r, t) {
|
|
2715
|
-
if (!H(r) || !H(t)) return t ?? r;
|
|
2716
|
-
let e = { ...r };
|
|
2717
|
-
for (let [n, i] of Object.entries(t)) {
|
|
2718
|
-
let s = e[n];
|
|
2719
|
-
e[n] = H(s) && H(i) ? lt(s, i) : i;
|
|
2720
|
-
}
|
|
2721
|
-
return e;
|
|
2722
|
-
}
|
|
2723
|
-
function Ft(r) {
|
|
2724
|
-
return r === "top" || r === "bottom" || r === "left" || r === "right" ? r : "none";
|
|
2725
|
-
}
|
|
2726
|
-
function Ot(r) {
|
|
2727
|
-
return r === "bar" || r === "line" || r === "area" || r === "pie" || r === "doughnut" || r === "radar" || r === "scatter" || r === "bubble" ? r : "bar";
|
|
2728
|
-
}
|
|
2729
|
-
function Bt(r) {
|
|
2730
|
-
return r === "bar" || r === "line" || r === "area" || r === "scatter" || r === "bubble";
|
|
2731
|
-
}
|
|
2732
|
-
function $t(r) {
|
|
2733
|
-
return r.map((t) => t.trim()).filter(Boolean);
|
|
2734
|
-
}
|
|
2735
|
-
var R = class extends HTMLElement {
|
|
2736
|
-
_canvas;
|
|
2737
|
-
_status;
|
|
2738
|
-
_runtime = null;
|
|
2739
|
-
_loadPromise = null;
|
|
2740
|
-
_chart = null;
|
|
2741
|
-
_renderedType = null;
|
|
2742
|
-
_dataInput = null;
|
|
2743
|
-
_optionsOverride = null;
|
|
2744
|
-
_syncFrame = 0;
|
|
2745
|
-
static get observedAttributes() {
|
|
2746
|
-
return ["type", "legend", "stacked", "labels"];
|
|
2747
|
-
}
|
|
2748
|
-
get type() {
|
|
2749
|
-
return Ot(this.getAttribute("type"));
|
|
2750
|
-
}
|
|
2751
|
-
set type(t) {
|
|
2752
|
-
this.setAttribute("type", t);
|
|
2753
|
-
}
|
|
2754
|
-
get legend() {
|
|
2755
|
-
return Ft(this.getAttribute("legend"));
|
|
2756
|
-
}
|
|
2757
|
-
set legend(t) {
|
|
2758
|
-
this.setAttribute("legend", t);
|
|
2759
|
-
}
|
|
2760
|
-
get stacked() {
|
|
2761
|
-
return this.hasAttribute("stacked");
|
|
2762
|
-
}
|
|
2763
|
-
set stacked(t) {
|
|
2764
|
-
this.toggleAttribute("stacked", t);
|
|
2765
|
-
}
|
|
2766
|
-
get labels() {
|
|
2767
|
-
return $t(It(this.getAttribute("labels")));
|
|
2768
|
-
}
|
|
2769
|
-
set labels(t) {
|
|
2770
|
-
this.setAttribute("labels", t.join(","));
|
|
2771
|
-
}
|
|
2772
|
-
get data() {
|
|
2773
|
-
return this._dataInput;
|
|
2774
|
-
}
|
|
2775
|
-
set data(t) {
|
|
2776
|
-
this._dataInput = t ? structuredClone(t) : null, this._scheduleSync();
|
|
2777
|
-
}
|
|
2778
|
-
get options() {
|
|
2779
|
-
return this._optionsOverride;
|
|
2780
|
-
}
|
|
2781
|
-
set options(t) {
|
|
2782
|
-
this._optionsOverride = t ? structuredClone(t) : null, this._renderChart();
|
|
2783
|
-
}
|
|
2784
|
-
constructor() {
|
|
2785
|
-
super();
|
|
2786
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
2787
|
-
e.textContent = ot, t.appendChild(e);
|
|
2788
|
-
let n = document.createElement("div");
|
|
2789
|
-
n.className = "dt-chart", this._canvas = document.createElement("canvas"), this._canvas.className = "dt-chart__canvas", this._status = document.createElement("div"), this._status.className = "dt-chart__status", this._status.textContent = "Loading chart", n.append(this._canvas, this._status), t.appendChild(n);
|
|
2790
|
-
}
|
|
2791
|
-
connectedCallback() {
|
|
2792
|
-
this._canvas.addEventListener("click", this._handleCanvasClick), this._ensureRuntime().then(() => this._renderChart()), this._scheduleSync();
|
|
2793
|
-
}
|
|
2794
|
-
disconnectedCallback() {
|
|
2795
|
-
this._canvas.removeEventListener("click", this._handleCanvasClick), this._syncFrame !== 0 && (cancelAnimationFrame(this._syncFrame), this._syncFrame = 0), this._chart?.destroy(), this._chart = null, this._renderedType = null;
|
|
2796
|
-
}
|
|
2797
|
-
attributeChangedCallback() {
|
|
2798
|
-
this._scheduleSync();
|
|
2799
|
-
}
|
|
2800
|
-
_handleCanvasClick = (t) => {
|
|
2801
|
-
if (!this._chart) return;
|
|
2802
|
-
let n = this._chart.getElementsAtEventForMode(t, "nearest", { intersect: true }, true)[0];
|
|
2803
|
-
if (!n) return;
|
|
2804
|
-
let i = Array.isArray(this._chart.data.labels) ? this._chart.data.labels[n.index] ?? null : null, s = this._chart.data.datasets[n.datasetIndex], o = Array.isArray(s?.data) ? s.data[n.index] : void 0;
|
|
2805
|
-
this.dispatchEvent(new CustomEvent("dt-chart-click", { bubbles: true, composed: true, detail: { label: i, datasetIndex: n.datasetIndex, index: n.index, value: o } }));
|
|
2806
|
-
};
|
|
2807
|
-
_scheduleSync() {
|
|
2808
|
-
this._syncFrame === 0 && (this._syncFrame = requestAnimationFrame(() => {
|
|
2809
|
-
this._syncFrame = 0, this._syncFromCurrentSource();
|
|
2810
|
-
}));
|
|
2811
|
-
}
|
|
2812
|
-
_syncFromCurrentSource() {
|
|
2813
|
-
this._renderChart();
|
|
2814
|
-
}
|
|
2815
|
-
async _ensureRuntime() {
|
|
2816
|
-
return this._runtime ? this._runtime : (this._loadPromise || (this._loadPromise = at().then((t) => (this._runtime = t, t))), this._loadPromise);
|
|
2817
|
-
}
|
|
2818
|
-
async _renderChart() {
|
|
2819
|
-
let t = this._dataInput;
|
|
2820
|
-
if (!t) {
|
|
2821
|
-
this._setStatus("Waiting for data");
|
|
2822
|
-
return;
|
|
2823
|
-
}
|
|
2824
|
-
let e = await this._ensureRuntime(), n = this._buildConfig(e, t), i = n.type;
|
|
2825
|
-
!this._chart || this._renderedType !== i ? (this._chart?.destroy(), this._chart = new e.Chart(this._canvas, n), this._renderedType = i) : (this._chart.data = n.data, this._chart.options = n.options, this._chart.update()), this._setStatus(t.datasets.length > 0 ? null : "Waiting for data");
|
|
2826
|
-
}
|
|
2827
|
-
_buildConfig(t, e) {
|
|
2828
|
-
let n = getComputedStyle(this), i = n.getPropertyValue("--dt-accent").trim() || "#42d4ff", s = n.getPropertyValue("--dt-text").trim() || "#d6ebff", o = n.getPropertyValue("--dt-text-muted").trim() || "#7b93a6", a = n.getPropertyValue("--dt-border").trim() || "rgba(123, 147, 166, 0.3)", d = n.getPropertyValue("--font-mono").trim() || "'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, monospace", c = Nt(i), l = this.type === "area" ? "line" : this.type, f = { labels: e.labels ?? this.labels, datasets: e.datasets.map((h, gt) => {
|
|
2829
|
-
let F = c[gt % c.length], p = h.color ?? g(F, 1), O = { label: h.label ?? "", data: h.data, backgroundColor: l === "line" || l === "radar" || l === "scatter" ? g(F, l === "scatter" ? 0.95 : 0.24) : p, borderColor: p, pointBackgroundColor: p, pointBorderColor: p, pointHoverBackgroundColor: p, pointRadius: this.type === "line" || this.type === "area" ? 3 : 4, pointHoverRadius: this.type === "line" || this.type === "area" ? 5 : 6, borderWidth: 2, tension: l === "line" || this.type === "area" ? 0.32 : void 0, fill: this.type === "area" };
|
|
2830
|
-
return l === "pie" || l === "doughnut" ? { ...O, backgroundColor: Array.isArray(h.data) ? h.data.map((bt, B) => g(c[B % c.length], 0.86)) : p, borderColor: Array.isArray(h.data) ? h.data.map((bt, B) => g(c[B % c.length], 1)) : p, borderWidth: 1 } : l === "scatter" || l === "bubble" ? { ...O, showLine: false, backgroundColor: g(F, 0.78) } : O;
|
|
2831
|
-
}) }, _ = { responsive: true, maintainAspectRatio: false, animation: { duration: 320 }, interaction: { mode: "nearest", intersect: true }, plugins: { legend: { display: this.legend !== "none", position: this.legend === "none" ? "top" : this.legend, labels: { color: s, boxWidth: 12, boxHeight: 12, padding: 14, font: { family: d, size: 11 } } }, tooltip: { backgroundColor: "rgba(10, 18, 24, 0.92)", borderColor: Xt(a, i, 0.35), borderWidth: 1, titleColor: s, bodyColor: s, footerColor: o, titleFont: { family: d, size: 11 }, bodyFont: { family: d, size: 11 }, padding: 10 } }, scales: Bt(this.type) ? { x: { stacked: this.stacked, grid: { display: false, color: a }, border: { color: a }, ticks: { color: o, font: { family: d, size: 11 } } }, y: { stacked: this.stacked, beginAtZero: true, grid: { display: false, color: a }, border: { color: a }, ticks: { color: o, font: { family: d, size: 11 } } } } : l === "radar" ? { r: { angleLines: { color: a }, grid: { color: a }, pointLabels: { color: o, font: { family: d, size: 11 } }, ticks: { color: o, backdropColor: "transparent", font: { family: d, size: 10 } } } } : void 0 };
|
|
2832
|
-
return { type: l, data: f, options: lt(_, this._optionsOverride ?? {}) };
|
|
2833
|
-
}
|
|
2834
|
-
_setStatus(t) {
|
|
2835
|
-
if (!t) {
|
|
2836
|
-
this._status.hidden = true;
|
|
2837
|
-
return;
|
|
2838
|
-
}
|
|
2839
|
-
this._status.hidden = false, this._status.textContent = t;
|
|
2840
|
-
}
|
|
2841
|
-
};
|
|
2842
|
-
function Xt(r, t, e) {
|
|
2843
|
-
let n = X(r), i = X(t);
|
|
2844
|
-
if (!n || !i) return r;
|
|
2845
|
-
let s = v(e, 0, 1), o = ((i.h - n.h) % 360 + 540) % 360 - 180;
|
|
2846
|
-
return g({ h: (n.h + o * s + 360) % 360, s: n.s + (i.s - n.s) * s, l: n.l + (i.l - n.l) * s });
|
|
2847
|
-
}
|
|
2848
|
-
var ct = `:host {
|
|
1282
|
+
`,B=null;function wt(){return window.__DtChart?Promise.resolve(window.__DtChart):B||(B=new Promise((e,t)=>{let r=document.createElement("script");r.src="/api/ui/chart.umd.js",r.async=!0,r.dataset.dtChart="true",r.onload=()=>{if(window.__DtChart){e(window.__DtChart);return}t(new Error("Chart runtime loaded without a __DtChart export."))},r.onerror=()=>t(new Error("Failed to load the Chart.js runtime bundle.")),document.head.appendChild(r)}),B)}function L(e,t,r){return Math.min(r,Math.max(t,e))}function kt(e){return e?e.split(",").map(t=>t.trim()).filter(Boolean):[]}function K(e){let t=e.trim().match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);if(t){let n=t[1],a=n.length===3?n.split("").map(h=>`${h}${h}`).join(""):n,c=parseInt(a.slice(0,2),16)/255,d=parseInt(a.slice(2,4),16)/255,s=parseInt(a.slice(4,6),16)/255;return pe(c,d,s)}let r=e.trim().match(/^rgba?\((\d+(?:\.\d+)?)[,\s]+(\d+(?:\.\d+)?)[,\s]+(\d+(?:\.\d+)?)(?:[,/\s]+[\d.]+)?\)$/i);if(r)return pe(Number(r[1])/255,Number(r[2])/255,Number(r[3])/255);let i=e.trim().match(/^hsla?\(([-\d.]+)(?:deg)?[,\s]+([\d.]+)%[,\s]+([\d.]+)%(?:[,/\s]+[\d.]+)?\)$/i);return i?{h:(Number(i[1])%360+360)%360,s:L(Number(i[2]),0,100),l:L(Number(i[3]),0,100)}:null}function pe(e,t,r){let i=Math.max(e,t,r),n=Math.min(e,t,r),a=i-n,c=0,d=(i+n)/2,s=a===0?0:a/(1-Math.abs(2*d-1));if(a!==0)switch(i){case e:c=60*((t-r)/a%6);break;case t:c=60*((r-e)/a+2);break;default:c=60*((e-t)/a+4);break}return{h:(c+360)%360,s:Math.round(s*100),l:Math.round(d*100)}}function N(e,t=1){return`hsla(${Math.round(e.h)} ${Math.round(e.s)}% ${Math.round(e.l)}% / ${t})`}function At(e){let t=K(e)??{h:185,s:88,l:56};return[0,32,68,118,164,212,258,304].map((r,i)=>({h:(t.h+r)%360,s:L(t.s-i*2,55,90),l:L(t.l+(i%2===0?0:6)-i,38,66)}))}function I(e){return!!e&&typeof e=="object"&&!Array.isArray(e)}function me(e,t){if(!I(e)||!I(t))return t??e;let r={...e};for(let[i,n]of Object.entries(t)){let a=r[i];r[i]=I(a)&&I(n)?me(a,n):n}return r}function Ct(e){return e==="top"||e==="bottom"||e==="left"||e==="right"?e:"none"}function Et(e){return e==="bar"||e==="line"||e==="area"||e==="pie"||e==="doughnut"||e==="radar"||e==="scatter"||e==="bubble"?e:"bar"}function St(e){return e==="bar"||e==="line"||e==="area"||e==="scatter"||e==="bubble"}function zt(e){return e.map(t=>t.trim()).filter(Boolean)}var Pt=class extends HTMLElement{_canvas;_status;_runtime=null;_loadPromise=null;_chart=null;_renderedType=null;_dataInput=null;_optionsOverride=null;_syncFrame=0;static get observedAttributes(){return["type","legend","stacked","labels"]}get type(){return Et(this.getAttribute("type"))}set type(e){this.setAttribute("type",e)}get legend(){return Ct(this.getAttribute("legend"))}set legend(e){this.setAttribute("legend",e)}get stacked(){return this.hasAttribute("stacked")}set stacked(e){this.toggleAttribute("stacked",e)}get labels(){return zt(kt(this.getAttribute("labels")))}set labels(e){this.setAttribute("labels",e.join(","))}get data(){return this._dataInput}set data(e){this._dataInput=e?structuredClone(e):null,this._scheduleSync()}get options(){return this._optionsOverride}set options(e){this._optionsOverride=e?structuredClone(e):null,this._renderChart()}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=xt,e.appendChild(t);let r=document.createElement("div");r.className="dt-chart",this._canvas=document.createElement("canvas"),this._canvas.className="dt-chart__canvas",this._status=document.createElement("div"),this._status.className="dt-chart__status",this._status.textContent="Loading chart",r.append(this._canvas,this._status),e.appendChild(r)}connectedCallback(){this._canvas.addEventListener("click",this._handleCanvasClick),this._ensureRuntime().then(()=>this._renderChart()),this._scheduleSync()}disconnectedCallback(){this._canvas.removeEventListener("click",this._handleCanvasClick),this._syncFrame!==0&&(cancelAnimationFrame(this._syncFrame),this._syncFrame=0),this._chart?.destroy(),this._chart=null,this._renderedType=null}attributeChangedCallback(){this._scheduleSync()}_handleCanvasClick=e=>{if(!this._chart)return;let t=this._chart.getElementsAtEventForMode(e,"nearest",{intersect:!0},!0)[0];if(!t)return;let r=Array.isArray(this._chart.data.labels)?this._chart.data.labels[t.index]??null:null,i=this._chart.data.datasets[t.datasetIndex],n=Array.isArray(i?.data)?i.data[t.index]:void 0;this.dispatchEvent(new CustomEvent("dt-chart-click",{bubbles:!0,composed:!0,detail:{label:r,datasetIndex:t.datasetIndex,index:t.index,value:n}}))};_scheduleSync(){this._syncFrame===0&&(this._syncFrame=requestAnimationFrame(()=>{this._syncFrame=0,this._syncFromCurrentSource()}))}_syncFromCurrentSource(){this._renderChart()}async _ensureRuntime(){return this._runtime?this._runtime:(this._loadPromise||(this._loadPromise=wt().then(e=>(this._runtime=e,e))),this._loadPromise)}async _renderChart(){let e=this._dataInput;if(!e){this._setStatus("Waiting for data");return}let t=await this._ensureRuntime(),r=this._buildConfig(t,e),i=r.type;!this._chart||this._renderedType!==i?(this._chart?.destroy(),this._chart=new t.Chart(this._canvas,r),this._renderedType=i):(this._chart.data=r.data,this._chart.options=r.options,this._chart.update()),this._setStatus(e.datasets.length>0?null:"Waiting for data")}_buildConfig(e,t){let r=getComputedStyle(this),i=r.getPropertyValue("--dt-accent").trim()||"#42d4ff",n=r.getPropertyValue("--dt-text").trim()||"#d6ebff",a=r.getPropertyValue("--dt-text-muted").trim()||"#7b93a6",c=r.getPropertyValue("--dt-border").trim()||"rgba(123, 147, 166, 0.3)",d=r.getPropertyValue("--font-mono").trim()||"'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, monospace",s=At(i),h=this.type==="area"?"line":this.type,p={labels:t.labels??this.labels,datasets:t.datasets.map((u,w)=>{let S=s[w%s.length],A=u.color??N(S,1),T={label:u.label??"",data:u.data,backgroundColor:h==="line"||h==="radar"||h==="scatter"?N(S,h==="scatter"?.95:.24):A,borderColor:A,pointBackgroundColor:A,pointBorderColor:A,pointHoverBackgroundColor:A,pointRadius:this.type==="line"||this.type==="area"?3:4,pointHoverRadius:this.type==="line"||this.type==="area"?5:6,borderWidth:2,tension:h==="line"||this.type==="area"?.32:void 0,fill:this.type==="area"};return h==="pie"||h==="doughnut"?{...T,backgroundColor:Array.isArray(u.data)?u.data.map((b,x)=>N(s[x%s.length],.86)):A,borderColor:Array.isArray(u.data)?u.data.map((b,x)=>N(s[x%s.length],1)):A,borderWidth:1}:h==="scatter"||h==="bubble"?{...T,showLine:!1,backgroundColor:N(S,.78)}:T})},f={responsive:!0,maintainAspectRatio:!1,animation:{duration:320},interaction:{mode:"nearest",intersect:!0},plugins:{legend:{display:this.legend!=="none",position:this.legend==="none"?"top":this.legend,labels:{color:n,boxWidth:12,boxHeight:12,padding:14,font:{family:d,size:11}}},tooltip:{backgroundColor:"rgba(10, 18, 24, 0.92)",borderColor:Mt(c,i,.35),borderWidth:1,titleColor:n,bodyColor:n,footerColor:a,titleFont:{family:d,size:11},bodyFont:{family:d,size:11},padding:10}},scales:St(this.type)?{x:{stacked:this.stacked,grid:{display:!1,color:c},border:{color:c},ticks:{color:a,font:{family:d,size:11}}},y:{stacked:this.stacked,beginAtZero:!0,grid:{display:!1,color:c},border:{color:c},ticks:{color:a,font:{family:d,size:11}}}}:h==="radar"?{r:{angleLines:{color:c},grid:{color:c},pointLabels:{color:a,font:{family:d,size:11}},ticks:{color:a,backdropColor:"transparent",font:{family:d,size:10}}}}:void 0};return{type:h,data:p,options:me(f,this._optionsOverride??{})}}_setStatus(e){if(!e){this._status.hidden=!0;return}this._status.hidden=!1,this._status.textContent=e}};function Mt(e,t,r){let i=K(e),n=K(t);if(!i||!n)return e;let a=L(r,0,1),c=((n.h-i.h)%360+540)%360-180;return N({h:(i.h+c*a+360)%360,s:i.s+(n.s-i.s)*a,l:i.l+(n.l-i.l)*a})}var Nt=`:host {
|
|
2849
1283
|
display: block;
|
|
2850
1284
|
color: var(--dt-text);
|
|
2851
1285
|
font-family: var(--font-sans, 'Inter', sans-serif);
|
|
@@ -3017,108 +1451,13 @@ var ct = `:host {
|
|
|
3017
1451
|
opacity: 0;
|
|
3018
1452
|
}
|
|
3019
1453
|
}
|
|
3020
|
-
|
|
3021
|
-
|
|
3022
|
-
function
|
|
3023
|
-
|
|
3024
|
-
|
|
3025
|
-
|
|
3026
|
-
|
|
3027
|
-
r(window.__DtMarked);
|
|
3028
|
-
return;
|
|
3029
|
-
}
|
|
3030
|
-
t(new Error("Marked runtime loaded without a __DtMarked export."));
|
|
3031
|
-
}, e.onerror = () => t(new Error("Failed to load the marked runtime bundle.")), document.head.appendChild(e);
|
|
3032
|
-
}), V);
|
|
3033
|
-
}
|
|
3034
|
-
function ut(r) {
|
|
3035
|
-
return r.replaceAll(`\r
|
|
3036
|
-
`, `
|
|
3037
|
-
`);
|
|
3038
|
-
}
|
|
3039
|
-
function Jt(r) {
|
|
3040
|
-
let t = ut(r).split(`
|
|
3041
|
-
`);
|
|
3042
|
-
for (; t.length > 0 && t[0].trim() === ""; ) t.shift();
|
|
3043
|
-
for (; t.length > 0 && t[t.length - 1].trim() === ""; ) t.pop();
|
|
3044
|
-
let e = t.filter((i) => i.trim() !== "").map((i) => i.match(/^\s*/)?.[0].length ?? 0), n = e.length > 0 ? Math.min(...e) : 0;
|
|
3045
|
-
return n === 0 ? t.join(`
|
|
3046
|
-
`) : t.map((i) => i.slice(n)).join(`
|
|
3047
|
-
`);
|
|
3048
|
-
}
|
|
3049
|
-
function Wt(r) {
|
|
3050
|
-
let t = ut(r);
|
|
3051
|
-
if ((t.match(/(^|\n)(```|~~~)/g) ?? []).length % 2 === 0) return t;
|
|
3052
|
-
let n = t.includes("~~~") && !t.includes("```") ? "~~~" : "```";
|
|
3053
|
-
return `${t}
|
|
3054
|
-
${n}`;
|
|
3055
|
-
}
|
|
3056
|
-
var P = class extends HTMLElement {
|
|
3057
|
-
_body;
|
|
3058
|
-
_caret;
|
|
3059
|
-
_contentOverride = null;
|
|
3060
|
-
_runtime = null;
|
|
3061
|
-
_loadPromise = null;
|
|
3062
|
-
_observer = null;
|
|
3063
|
-
_renderFrame = 0;
|
|
3064
|
-
static get observedAttributes() {
|
|
3065
|
-
return ["streaming", "unsafe-html"];
|
|
3066
|
-
}
|
|
3067
|
-
get content() {
|
|
3068
|
-
return this._contentOverride ?? this._readInlineMarkdown();
|
|
3069
|
-
}
|
|
3070
|
-
set content(t) {
|
|
3071
|
-
this._contentOverride = String(t ?? ""), this._scheduleRender();
|
|
3072
|
-
}
|
|
3073
|
-
get streaming() {
|
|
3074
|
-
return this.hasAttribute("streaming");
|
|
3075
|
-
}
|
|
3076
|
-
set streaming(t) {
|
|
3077
|
-
this.toggleAttribute("streaming", t);
|
|
3078
|
-
}
|
|
3079
|
-
get unsafeHtml() {
|
|
3080
|
-
return this.hasAttribute("unsafe-html");
|
|
3081
|
-
}
|
|
3082
|
-
set unsafeHtml(t) {
|
|
3083
|
-
this.toggleAttribute("unsafe-html", t);
|
|
3084
|
-
}
|
|
3085
|
-
constructor() {
|
|
3086
|
-
super();
|
|
3087
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
3088
|
-
e.textContent = ct, t.appendChild(e), this._body = document.createElement("div"), this._body.className = "dt-markdown", this._body.addEventListener("click", this._onLinkClick), this._caret = document.createElement("span"), this._caret.className = "dt-markdown__caret", this._caret.textContent = "\u258C", this._caret.hidden = true, t.append(this._body, this._caret);
|
|
3089
|
-
}
|
|
3090
|
-
connectedCallback() {
|
|
3091
|
-
this._observer || (this._observer = new MutationObserver(() => {
|
|
3092
|
-
this._contentOverride === null && this._scheduleRender();
|
|
3093
|
-
}), this._observer.observe(this, { childList: true, characterData: true, subtree: true })), this._ensureRuntime(), this._scheduleRender();
|
|
3094
|
-
}
|
|
3095
|
-
disconnectedCallback() {
|
|
3096
|
-
this._observer?.disconnect(), this._observer = null, this._renderFrame !== 0 && (cancelAnimationFrame(this._renderFrame), this._renderFrame = 0);
|
|
3097
|
-
}
|
|
3098
|
-
attributeChangedCallback() {
|
|
3099
|
-
this._scheduleRender();
|
|
3100
|
-
}
|
|
3101
|
-
_onLinkClick = (t) => {
|
|
3102
|
-
let n = t.composedPath().find((i) => i instanceof HTMLAnchorElement);
|
|
3103
|
-
n && (t.preventDefault(), this.dispatchEvent(new CustomEvent("dt-link-click", { bubbles: true, composed: true, detail: { href: n.getAttribute("href") ?? "#" } })));
|
|
3104
|
-
};
|
|
3105
|
-
_readInlineMarkdown() {
|
|
3106
|
-
return Jt(this.textContent ?? "");
|
|
3107
|
-
}
|
|
3108
|
-
_scheduleRender() {
|
|
3109
|
-
this._renderFrame === 0 && (this._renderFrame = requestAnimationFrame(() => {
|
|
3110
|
-
this._renderFrame = 0, this._render();
|
|
3111
|
-
}));
|
|
3112
|
-
}
|
|
3113
|
-
async _ensureRuntime() {
|
|
3114
|
-
return this._runtime ? this._runtime : (this._loadPromise || (this._loadPromise = ht().then((t) => (this._runtime = t, t))), this._loadPromise);
|
|
3115
|
-
}
|
|
3116
|
-
async _render() {
|
|
3117
|
-
let t = await this._ensureRuntime(), e = this.content;
|
|
3118
|
-
this.streaming && (e = Wt(e)), this._body.innerHTML = t.render(e, { unsafeHtml: this.unsafeHtml }), this._caret.hidden = !this.streaming;
|
|
3119
|
-
}
|
|
3120
|
-
};
|
|
3121
|
-
var pt = `:host {
|
|
1454
|
+
`,U=null;function Tt(){return window.__DtMarked?Promise.resolve(window.__DtMarked):U||(U=new Promise((e,t)=>{let r=document.createElement("script");r.src="/api/ui/marked.js",r.async=!0,r.dataset.dtMarked="true",r.onload=()=>{if(window.__DtMarked){e(window.__DtMarked);return}t(new Error("Marked runtime loaded without a __DtMarked export."))},r.onerror=()=>t(new Error("Failed to load the marked runtime bundle.")),document.head.appendChild(r)}),U)}function ve(e){return e.replaceAll(`\r
|
|
1455
|
+
`,`
|
|
1456
|
+
`)}function Lt(e){let t=ve(e).split(`
|
|
1457
|
+
`);for(;t.length>0&&t[0].trim()==="";)t.shift();for(;t.length>0&&t[t.length-1].trim()==="";)t.pop();let r=t.filter(n=>n.trim()!=="").map(n=>n.match(/^\s*/)?.[0].length??0),i=r.length>0?Math.min(...r):0;return i===0?t.join(`
|
|
1458
|
+
`):t.map(n=>n.slice(i)).join(`
|
|
1459
|
+
`)}function Rt(e){let t=ve(e);if((t.match(/(^|\n)(```|~~~)/g)??[]).length%2===0)return t;let r=t.includes("~~~")&&!t.includes("```")?"~~~":"```";return`${t}
|
|
1460
|
+
${r}`}var It=class extends HTMLElement{_body;_caret;_contentOverride=null;_runtime=null;_loadPromise=null;_observer=null;_renderFrame=0;static get observedAttributes(){return["streaming","unsafe-html"]}get content(){return this._contentOverride??this._readInlineMarkdown()}set content(e){this._contentOverride=String(e??""),this._scheduleRender()}get streaming(){return this.hasAttribute("streaming")}set streaming(e){this.toggleAttribute("streaming",e)}get unsafeHtml(){return this.hasAttribute("unsafe-html")}set unsafeHtml(e){this.toggleAttribute("unsafe-html",e)}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=Nt,e.appendChild(t),this._body=document.createElement("div"),this._body.className="dt-markdown",this._body.addEventListener("click",this._onLinkClick),this._caret=document.createElement("span"),this._caret.className="dt-markdown__caret",this._caret.textContent="\u258C",this._caret.hidden=!0,e.append(this._body,this._caret)}connectedCallback(){this._observer||(this._observer=new MutationObserver(()=>{this._contentOverride===null&&this._scheduleRender()}),this._observer.observe(this,{childList:!0,characterData:!0,subtree:!0})),this._ensureRuntime(),this._scheduleRender()}disconnectedCallback(){this._observer?.disconnect(),this._observer=null,this._renderFrame!==0&&(cancelAnimationFrame(this._renderFrame),this._renderFrame=0)}attributeChangedCallback(){this._scheduleRender()}_onLinkClick=e=>{let t=e.composedPath().find(r=>r instanceof HTMLAnchorElement);t&&(e.preventDefault(),this.dispatchEvent(new CustomEvent("dt-link-click",{bubbles:!0,composed:!0,detail:{href:t.getAttribute("href")??"#"}})))};_readInlineMarkdown(){return Lt(this.textContent??"")}_scheduleRender(){this._renderFrame===0&&(this._renderFrame=requestAnimationFrame(()=>{this._renderFrame=0,this._render()}))}async _ensureRuntime(){return this._runtime?this._runtime:(this._loadPromise||(this._loadPromise=Tt().then(e=>(this._runtime=e,e))),this._loadPromise)}async _render(){let e=await this._ensureRuntime(),t=this.content;this.streaming&&(t=Rt(t)),this._body.innerHTML=e.render(t,{unsafeHtml:this.unsafeHtml}),this._caret.hidden=!this.streaming}},Vt=`:host {
|
|
3122
1461
|
display: block;
|
|
3123
1462
|
min-height: 240px;
|
|
3124
1463
|
color: var(--dt-text);
|
|
@@ -3338,1315 +1677,13 @@ var pt = `:host {
|
|
|
3338
1677
|
.milkdown .editor td {
|
|
3339
1678
|
border: 1px solid var(--dt-border);
|
|
3340
1679
|
}
|
|
3341
|
-
`;
|
|
3342
|
-
|
|
3343
|
-
|
|
3344
|
-
|
|
3345
|
-
|
|
3346
|
-
|
|
3347
|
-
|
|
3348
|
-
r(window.__DtMilkdown);
|
|
3349
|
-
|
|
3350
|
-
|
|
3351
|
-
t(new Error("Milkdown runtime loaded without a __DtMilkdown export."));
|
|
3352
|
-
}, e.onerror = () => t(new Error("Failed to load the Milkdown runtime bundle.")), document.head.appendChild(e);
|
|
3353
|
-
}), I);
|
|
3354
|
-
}
|
|
3355
|
-
var N = class extends HTMLElement {
|
|
3356
|
-
_runtimeStyle;
|
|
3357
|
-
_surface;
|
|
3358
|
-
_content;
|
|
3359
|
-
_status;
|
|
3360
|
-
_runtime = null;
|
|
3361
|
-
_loadPromise = null;
|
|
3362
|
-
_editor = null;
|
|
3363
|
-
_pendingValue = "";
|
|
3364
|
-
_changeTimer = null;
|
|
3365
|
-
_setupToken = 0;
|
|
3366
|
-
_suppressNextChange = false;
|
|
3367
|
-
static get observedAttributes() {
|
|
3368
|
-
return ["placeholder", "readonly"];
|
|
3369
|
-
}
|
|
3370
|
-
get placeholder() {
|
|
3371
|
-
return this.getAttribute("placeholder") ?? "";
|
|
3372
|
-
}
|
|
3373
|
-
set placeholder(t) {
|
|
3374
|
-
this.setAttribute("placeholder", t);
|
|
3375
|
-
}
|
|
3376
|
-
get readonly() {
|
|
3377
|
-
return this.hasAttribute("readonly");
|
|
3378
|
-
}
|
|
3379
|
-
set readonly(t) {
|
|
3380
|
-
this.toggleAttribute("readonly", t);
|
|
3381
|
-
}
|
|
3382
|
-
get value() {
|
|
3383
|
-
return this._editor && (this._pendingValue = this._editor.getMarkdown()), this._pendingValue;
|
|
3384
|
-
}
|
|
3385
|
-
set value(t) {
|
|
3386
|
-
let e = String(t ?? "");
|
|
3387
|
-
this._pendingValue = e, this._editor && this._runtime && this._editor.getMarkdown() !== e && (this._suppressNextChange = true, this._editor.editor.action(this._runtime.replaceAll(e)));
|
|
3388
|
-
}
|
|
3389
|
-
constructor() {
|
|
3390
|
-
super();
|
|
3391
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
3392
|
-
e.textContent = pt, t.appendChild(e), this._runtimeStyle = document.createElement("style"), t.appendChild(this._runtimeStyle), this._surface = document.createElement("div"), this._surface.className = "dt-markdown-editor", this._content = document.createElement("div"), this._content.className = "dt-markdown-editor__surface";
|
|
3393
|
-
let n = document.createElement("div");
|
|
3394
|
-
n.className = "dt-markdown-editor__content", this._content.appendChild(n), this._status = document.createElement("div"), this._status.className = "dt-markdown-editor__status", this._status.textContent = "Loading editor", this._surface.append(this._content, this._status), t.appendChild(this._surface);
|
|
3395
|
-
}
|
|
3396
|
-
connectedCallback() {
|
|
3397
|
-
this._initializeEditor();
|
|
3398
|
-
}
|
|
3399
|
-
disconnectedCallback() {
|
|
3400
|
-
this._setupToken += 1, this._clearChangeTimer(), this._destroyEditor();
|
|
3401
|
-
}
|
|
3402
|
-
attributeChangedCallback(t) {
|
|
3403
|
-
if (t === "readonly") {
|
|
3404
|
-
this._editor?.setReadonly(this.readonly);
|
|
3405
|
-
return;
|
|
3406
|
-
}
|
|
3407
|
-
t === "placeholder" && this.isConnected && this._initializeEditor(true);
|
|
3408
|
-
}
|
|
3409
|
-
async _ensureRuntime() {
|
|
3410
|
-
return this._runtime ? this._runtime : (this._loadPromise || (this._loadPromise = mt().then((t) => (this._runtime = t, this._runtimeStyle.textContent = t.cssText, t))), this._loadPromise);
|
|
3411
|
-
}
|
|
3412
|
-
async _initializeEditor(t = false) {
|
|
3413
|
-
let e = ++this._setupToken;
|
|
3414
|
-
if (this._setStatus("Loading editor"), t) await this._destroyEditor();
|
|
3415
|
-
else if (this._editor) {
|
|
3416
|
-
this._setStatus(null);
|
|
3417
|
-
return;
|
|
3418
|
-
}
|
|
3419
|
-
try {
|
|
3420
|
-
let n = await this._ensureRuntime();
|
|
3421
|
-
if (!this.isConnected || e !== this._setupToken) return;
|
|
3422
|
-
this._content.replaceChildren();
|
|
3423
|
-
let i = document.createElement("div");
|
|
3424
|
-
i.className = "dt-markdown-editor__content", this._content.appendChild(i);
|
|
3425
|
-
let s = new n.Crepe({ root: i, defaultValue: this._pendingValue, features: { [n.Crepe.Feature.CodeMirror]: false, [n.Crepe.Feature.ImageBlock]: false, [n.Crepe.Feature.Latex]: false }, featureConfigs: { [n.Crepe.Feature.Placeholder]: { text: this.placeholder, mode: "doc" } } });
|
|
3426
|
-
if (s.on((o) => {
|
|
3427
|
-
o.markdownUpdated((a, d) => {
|
|
3428
|
-
if (this._pendingValue = d, this._suppressNextChange) {
|
|
3429
|
-
this._suppressNextChange = false;
|
|
3430
|
-
return;
|
|
3431
|
-
}
|
|
3432
|
-
this._queueChange(d);
|
|
3433
|
-
}), o.focus(() => {
|
|
3434
|
-
this.dispatchEvent(new CustomEvent("dt-focus", { bubbles: true, composed: true }));
|
|
3435
|
-
}), o.blur(() => {
|
|
3436
|
-
this.dispatchEvent(new CustomEvent("dt-blur", { bubbles: true, composed: true }));
|
|
3437
|
-
});
|
|
3438
|
-
}), await s.create(), !this.isConnected || e !== this._setupToken) {
|
|
3439
|
-
await s.destroy();
|
|
3440
|
-
return;
|
|
3441
|
-
}
|
|
3442
|
-
this._editor = s, this._editor.setReadonly(this.readonly), this._pendingValue = this._editor.getMarkdown(), this._setStatus(null);
|
|
3443
|
-
} catch {
|
|
3444
|
-
e === this._setupToken && this._setStatus("Failed to load editor");
|
|
3445
|
-
}
|
|
3446
|
-
}
|
|
3447
|
-
async _destroyEditor() {
|
|
3448
|
-
let t = this._editor;
|
|
3449
|
-
if (this._editor = null, !!t) try {
|
|
3450
|
-
await t.destroy();
|
|
3451
|
-
} catch {
|
|
3452
|
-
}
|
|
3453
|
-
}
|
|
3454
|
-
_queueChange(t) {
|
|
3455
|
-
this._clearChangeTimer(), this._changeTimer = setTimeout(() => {
|
|
3456
|
-
this._changeTimer = null, this.dispatchEvent(new CustomEvent("dt-change", { bubbles: true, composed: true, detail: { value: t } }));
|
|
3457
|
-
}, 300);
|
|
3458
|
-
}
|
|
3459
|
-
_clearChangeTimer() {
|
|
3460
|
-
this._changeTimer && (clearTimeout(this._changeTimer), this._changeTimer = null);
|
|
3461
|
-
}
|
|
3462
|
-
_setStatus(t) {
|
|
3463
|
-
if (t) {
|
|
3464
|
-
this._status.hidden = false, this._status.textContent = t;
|
|
3465
|
-
return;
|
|
3466
|
-
}
|
|
3467
|
-
this._status.hidden = true;
|
|
3468
|
-
}
|
|
3469
|
-
};
|
|
3470
|
-
customElements.get("dt-tooltip") || customElements.define("dt-tooltip", x);
|
|
3471
|
-
customElements.get("dt-card") || customElements.define("dt-card", w);
|
|
3472
|
-
customElements.get("dt-select") || customElements.define("dt-select", y);
|
|
3473
|
-
customElements.get("dt-grid") || customElements.define("dt-grid", k);
|
|
3474
|
-
customElements.get("dt-stack") || customElements.define("dt-stack", C);
|
|
3475
|
-
customElements.get("dt-stat") || customElements.define("dt-stat", E);
|
|
3476
|
-
customElements.get("dt-badge") || customElements.define("dt-badge", S);
|
|
3477
|
-
customElements.get("dt-button") || customElements.define("dt-button", D);
|
|
3478
|
-
customElements.get("dt-divider") || customElements.define("dt-divider", A);
|
|
3479
|
-
customElements.get("dt-list-view") || customElements.define("dt-list-view", z);
|
|
3480
|
-
customElements.get("dt-table-view") || customElements.define("dt-table-view", T);
|
|
3481
|
-
customElements.get("dt-column") || customElements.define("dt-column", b);
|
|
3482
|
-
customElements.get("dt-chart") || customElements.define("dt-chart", R);
|
|
3483
|
-
customElements.get("dt-markdown") || customElements.define("dt-markdown", P);
|
|
3484
|
-
customElements.get("dt-markdown-editor") || customElements.define("dt-markdown-editor", N);
|
|
3485
|
-
|
|
3486
|
-
// src/styles/PreferenceApp.module.css
|
|
3487
|
-
var PreferenceApp_default = {
|
|
3488
|
-
root: "PreferenceApp_root",
|
|
3489
|
-
rootCompact: "PreferenceApp_rootCompact",
|
|
3490
|
-
sidebar: "PreferenceApp_sidebar",
|
|
3491
|
-
sidebarHeader: "PreferenceApp_sidebarHeader",
|
|
3492
|
-
categoryItem: "PreferenceApp_categoryItem",
|
|
3493
|
-
categoryItemActive: "PreferenceApp_categoryItem PreferenceApp_categoryItemActive",
|
|
3494
|
-
categoryIcon: "PreferenceApp_categoryIcon",
|
|
3495
|
-
categoryText: "PreferenceApp_categoryText",
|
|
3496
|
-
settingsPanel: "PreferenceApp_settingsPanel",
|
|
3497
|
-
section: "PreferenceApp_section",
|
|
3498
|
-
sectionTitle: "PreferenceApp_sectionTitle",
|
|
3499
|
-
row: "PreferenceApp_row",
|
|
3500
|
-
rowInfo: "PreferenceApp_rowInfo",
|
|
3501
|
-
rowLabel: "PreferenceApp_rowLabel",
|
|
3502
|
-
rowDescription: "PreferenceApp_rowDescription",
|
|
3503
|
-
rowRestartBadge: "PreferenceApp_rowRestartBadge",
|
|
3504
|
-
rowControl: "PreferenceApp_rowControl",
|
|
3505
|
-
providerGroup: "PreferenceApp_providerGroup",
|
|
3506
|
-
providerGroupHeader: "PreferenceApp_providerGroupHeader",
|
|
3507
|
-
providerList: "PreferenceApp_providerList",
|
|
3508
|
-
providerCard: "PreferenceApp_providerCard",
|
|
3509
|
-
providerCardBody: "PreferenceApp_providerCardBody",
|
|
3510
|
-
providerCardHeader: "PreferenceApp_providerCardHeader",
|
|
3511
|
-
providerCardTitleRow: "PreferenceApp_providerCardTitleRow",
|
|
3512
|
-
providerCardTitle: "PreferenceApp_providerCardTitle",
|
|
3513
|
-
providerDefaultBadge: "PreferenceApp_providerDefaultBadge",
|
|
3514
|
-
providerCardActions: "PreferenceApp_providerCardActions",
|
|
3515
|
-
providerActionButtonWrap: "PreferenceApp_providerActionButtonWrap",
|
|
3516
|
-
providerButtonWrap: "PreferenceApp_providerButtonWrap",
|
|
3517
|
-
providerFieldGrid: "PreferenceApp_providerFieldGrid",
|
|
3518
|
-
providerField: "PreferenceApp_providerField",
|
|
3519
|
-
providerFieldLabel: "PreferenceApp_providerFieldLabel",
|
|
3520
|
-
providerSelectWrap: "PreferenceApp_providerSelectWrap",
|
|
3521
|
-
selectWrap: "PreferenceApp_selectWrap",
|
|
3522
|
-
textInput: "PreferenceApp_textInput",
|
|
3523
|
-
numberInput: "PreferenceApp_numberInput",
|
|
3524
|
-
dropdown: "PreferenceApp_dropdown",
|
|
3525
|
-
textInputSensitive: "PreferenceApp_textInput PreferenceApp_textInputSensitive",
|
|
3526
|
-
colorControl: "PreferenceApp_colorControl",
|
|
3527
|
-
colorInput: "PreferenceApp_colorInput",
|
|
3528
|
-
toggle: "PreferenceApp_toggle",
|
|
3529
|
-
toggleInput: "PreferenceApp_toggleInput",
|
|
3530
|
-
toggleTrack: "PreferenceApp_toggleTrack",
|
|
3531
|
-
toggleKnob: "PreferenceApp_toggleKnob",
|
|
3532
|
-
notification: "PreferenceApp_notification",
|
|
3533
|
-
slideUp: "PreferenceApp_slideUp"
|
|
3534
|
-
};
|
|
3535
|
-
|
|
3536
|
-
// desktalk-global:react/jsx-runtime
|
|
3537
|
-
var _mod3 = window.__desktalk_jsx_runtime;
|
|
3538
|
-
var jsx = _mod3.jsx;
|
|
3539
|
-
var jsxs = _mod3.jsxs;
|
|
3540
|
-
var jsxDEV = _mod3.jsxDEV;
|
|
3541
|
-
var Fragment2 = _mod3.Fragment;
|
|
3542
|
-
|
|
3543
|
-
// src/components/PreferenceCategoryList.tsx
|
|
3544
|
-
var CATEGORY_ICONS = {
|
|
3545
|
-
General: "\u2699",
|
|
3546
|
-
Server: "\u{1F310}",
|
|
3547
|
-
AI: "\u{1F916}",
|
|
3548
|
-
Voice: "\u{1F399}"
|
|
3549
|
-
};
|
|
3550
|
-
function PreferenceCategoryList({
|
|
3551
|
-
activeCategory,
|
|
3552
|
-
onSelect,
|
|
3553
|
-
compact = false
|
|
3554
|
-
}) {
|
|
3555
|
-
return /* @__PURE__ */ jsxs("nav", { className: PreferenceApp_default.sidebar, children: [
|
|
3556
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.sidebarHeader, children: "Settings" }),
|
|
3557
|
-
CATEGORIES.map((category) => {
|
|
3558
|
-
const button = /* @__PURE__ */ jsxs(
|
|
3559
|
-
"button",
|
|
3560
|
-
{
|
|
3561
|
-
className: category === activeCategory ? PreferenceApp_default.categoryItemActive : PreferenceApp_default.categoryItem,
|
|
3562
|
-
onClick: () => onSelect(category),
|
|
3563
|
-
type: "button",
|
|
3564
|
-
"aria-label": compact ? category : void 0,
|
|
3565
|
-
children: [
|
|
3566
|
-
/* @__PURE__ */ jsx("span", { className: PreferenceApp_default.categoryIcon, children: CATEGORY_ICONS[category] }),
|
|
3567
|
-
!compact && /* @__PURE__ */ jsx("span", { className: PreferenceApp_default.categoryText, children: category })
|
|
3568
|
-
]
|
|
3569
|
-
},
|
|
3570
|
-
category
|
|
3571
|
-
);
|
|
3572
|
-
if (compact) {
|
|
3573
|
-
return /* @__PURE__ */ jsx("dt-tooltip", { content: category, placement: "bottom", children: button }, category);
|
|
3574
|
-
}
|
|
3575
|
-
return button;
|
|
3576
|
-
})
|
|
3577
|
-
] });
|
|
3578
|
-
}
|
|
3579
|
-
|
|
3580
|
-
// src/components/AiProviderList.tsx
|
|
3581
|
-
function AiProviderList({ config, onChange }) {
|
|
3582
|
-
const enabledProviders = useMemo(() => {
|
|
3583
|
-
const providers = parseAiEnabledProviders(config["ai.enabledProviders"]);
|
|
3584
|
-
const defaultProvider = typeof config["ai.defaultProvider"] === "string" && config["ai.defaultProvider"] ? String(config["ai.defaultProvider"]) : DEFAULT_AI_PROVIDER_ID;
|
|
3585
|
-
if (!providers.includes(defaultProvider)) {
|
|
3586
|
-
providers.unshift(defaultProvider);
|
|
3587
|
-
}
|
|
3588
|
-
return providers;
|
|
3589
|
-
}, [config]);
|
|
3590
|
-
const updateOrder = useCallback(
|
|
3591
|
-
async (providerIds) => {
|
|
3592
|
-
const nextProviders = providerIds.length > 0 ? providerIds : [DEFAULT_AI_PROVIDER_ID];
|
|
3593
|
-
await onChange("ai.enabledProviders", serializeAiEnabledProviders(nextProviders));
|
|
3594
|
-
await onChange("ai.defaultProvider", nextProviders[0]);
|
|
3595
|
-
},
|
|
3596
|
-
[onChange]
|
|
3597
|
-
);
|
|
3598
|
-
const handleAddProvider = useCallback(async () => {
|
|
3599
|
-
const nextProvider = AI_PROVIDER_DEFINITIONS.find(
|
|
3600
|
-
(provider) => !enabledProviders.includes(provider.id)
|
|
3601
|
-
);
|
|
3602
|
-
if (!nextProvider) {
|
|
3603
|
-
return;
|
|
3604
|
-
}
|
|
3605
|
-
await updateOrder([...enabledProviders, nextProvider.id]);
|
|
3606
|
-
}, [enabledProviders, updateOrder]);
|
|
3607
|
-
const handleProviderChange = useCallback(
|
|
3608
|
-
async (providerId, nextProviderId) => {
|
|
3609
|
-
if (providerId === nextProviderId || enabledProviders.includes(nextProviderId)) {
|
|
3610
|
-
return;
|
|
3611
|
-
}
|
|
3612
|
-
const nextProviders = enabledProviders.map(
|
|
3613
|
-
(currentProviderId) => currentProviderId === providerId ? nextProviderId : currentProviderId
|
|
3614
|
-
);
|
|
3615
|
-
await updateOrder(nextProviders);
|
|
3616
|
-
},
|
|
3617
|
-
[enabledProviders, updateOrder]
|
|
3618
|
-
);
|
|
3619
|
-
const handleDeleteProvider = useCallback(
|
|
3620
|
-
async (providerId) => {
|
|
3621
|
-
if (enabledProviders.length === 1) {
|
|
3622
|
-
return;
|
|
3623
|
-
}
|
|
3624
|
-
const nextProviders = enabledProviders.filter(
|
|
3625
|
-
(currentProviderId) => currentProviderId !== providerId
|
|
3626
|
-
);
|
|
3627
|
-
await updateOrder(nextProviders);
|
|
3628
|
-
for (const key of getAiProviderConfigKeys(providerId)) {
|
|
3629
|
-
await onChange(key, "");
|
|
3630
|
-
}
|
|
3631
|
-
},
|
|
3632
|
-
[enabledProviders, onChange, updateOrder]
|
|
3633
|
-
);
|
|
3634
|
-
const handleSetDefault = useCallback(
|
|
3635
|
-
async (providerId) => {
|
|
3636
|
-
if (enabledProviders[0] === providerId) {
|
|
3637
|
-
return;
|
|
3638
|
-
}
|
|
3639
|
-
const nextProviders = [
|
|
3640
|
-
providerId,
|
|
3641
|
-
...enabledProviders.filter((currentProviderId) => currentProviderId !== providerId)
|
|
3642
|
-
];
|
|
3643
|
-
await updateOrder(nextProviders);
|
|
3644
|
-
},
|
|
3645
|
-
[enabledProviders, updateOrder]
|
|
3646
|
-
);
|
|
3647
|
-
return /* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerGroup, children: [
|
|
3648
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerGroupHeader, children: [
|
|
3649
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
3650
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.rowLabel, children: "Providers" }),
|
|
3651
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.rowDescription, children: "Add providers, keep your default at the top, and remove anything you no longer use." })
|
|
3652
|
-
] }),
|
|
3653
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerActionButtonWrap, children: /* @__PURE__ */ jsx(
|
|
3654
|
-
ProviderButton,
|
|
3655
|
-
{
|
|
3656
|
-
onPress: handleAddProvider,
|
|
3657
|
-
disabled: enabledProviders.length >= AI_PROVIDER_DEFINITIONS.length,
|
|
3658
|
-
variant: "secondary",
|
|
3659
|
-
children: "Add provider"
|
|
3660
|
-
}
|
|
3661
|
-
) })
|
|
3662
|
-
] }),
|
|
3663
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerList, children: enabledProviders.map((providerId, index) => {
|
|
3664
|
-
const definition = getAiProviderDefinition(providerId);
|
|
3665
|
-
if (!definition) {
|
|
3666
|
-
return null;
|
|
3667
|
-
}
|
|
3668
|
-
const availableOptions = AI_PROVIDER_DEFINITIONS.filter(
|
|
3669
|
-
(provider) => provider.id === providerId || !enabledProviders.includes(provider.id)
|
|
3670
|
-
);
|
|
3671
|
-
return /* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerCard, children: /* @__PURE__ */ jsx("dt-card", { variant: "outlined", children: /* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerCardBody, children: [
|
|
3672
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerCardHeader, children: [
|
|
3673
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerCardTitleRow, children: [
|
|
3674
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerCardTitle, children: definition.label }),
|
|
3675
|
-
index === 0 && /* @__PURE__ */ jsx("span", { className: PreferenceApp_default.providerDefaultBadge, children: "Default" })
|
|
3676
|
-
] }),
|
|
3677
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerCardActions, children: [
|
|
3678
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerButtonWrap, children: /* @__PURE__ */ jsx(
|
|
3679
|
-
ProviderButton,
|
|
3680
|
-
{
|
|
3681
|
-
onPress: () => handleSetDefault(providerId),
|
|
3682
|
-
disabled: index === 0,
|
|
3683
|
-
variant: "secondary",
|
|
3684
|
-
size: "sm",
|
|
3685
|
-
children: "Set as default"
|
|
3686
|
-
}
|
|
3687
|
-
) }),
|
|
3688
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerButtonWrap, children: /* @__PURE__ */ jsx(
|
|
3689
|
-
ProviderButton,
|
|
3690
|
-
{
|
|
3691
|
-
onPress: () => handleDeleteProvider(providerId),
|
|
3692
|
-
disabled: enabledProviders.length === 1,
|
|
3693
|
-
variant: "danger",
|
|
3694
|
-
size: "sm",
|
|
3695
|
-
children: "Delete"
|
|
3696
|
-
}
|
|
3697
|
-
) })
|
|
3698
|
-
] })
|
|
3699
|
-
] }),
|
|
3700
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerFieldGrid, children: [
|
|
3701
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerField, children: [
|
|
3702
|
-
/* @__PURE__ */ jsx(
|
|
3703
|
-
"label",
|
|
3704
|
-
{
|
|
3705
|
-
className: PreferenceApp_default.providerFieldLabel,
|
|
3706
|
-
htmlFor: `ai-provider-${providerId}`,
|
|
3707
|
-
children: "Provider"
|
|
3708
|
-
}
|
|
3709
|
-
),
|
|
3710
|
-
/* @__PURE__ */ jsx(
|
|
3711
|
-
ProviderSelect,
|
|
3712
|
-
{
|
|
3713
|
-
value: providerId,
|
|
3714
|
-
options: availableOptions.map((provider) => ({
|
|
3715
|
-
value: provider.id,
|
|
3716
|
-
label: provider.label
|
|
3717
|
-
})),
|
|
3718
|
-
onChange: (nextValue) => handleProviderChange(providerId, nextValue)
|
|
3719
|
-
}
|
|
3720
|
-
)
|
|
3721
|
-
] }),
|
|
3722
|
-
definition.supportsApiKey && /* @__PURE__ */ jsx(
|
|
3723
|
-
ProviderTextField,
|
|
3724
|
-
{
|
|
3725
|
-
id: `ai-provider-key-${providerId}`,
|
|
3726
|
-
label: "API Key",
|
|
3727
|
-
value: String(config[`ai.providers.${providerId}.apiKey`] ?? ""),
|
|
3728
|
-
sensitive: true,
|
|
3729
|
-
onCommit: (value) => onChange(`ai.providers.${providerId}.apiKey`, value)
|
|
3730
|
-
}
|
|
3731
|
-
),
|
|
3732
|
-
/* @__PURE__ */ jsx(
|
|
3733
|
-
ProviderTextField,
|
|
3734
|
-
{
|
|
3735
|
-
id: `ai-provider-model-${providerId}`,
|
|
3736
|
-
label: "Model",
|
|
3737
|
-
value: String(config[`ai.providers.${providerId}.model`] ?? ""),
|
|
3738
|
-
onCommit: (value) => onChange(`ai.providers.${providerId}.model`, value)
|
|
3739
|
-
}
|
|
3740
|
-
),
|
|
3741
|
-
definition.supportsBaseUrl && /* @__PURE__ */ jsx(
|
|
3742
|
-
ProviderTextField,
|
|
3743
|
-
{
|
|
3744
|
-
id: `ai-provider-base-url-${providerId}`,
|
|
3745
|
-
label: "Base URL",
|
|
3746
|
-
value: String(config[`ai.providers.${providerId}.baseUrl`] ?? ""),
|
|
3747
|
-
onCommit: (value) => onChange(`ai.providers.${providerId}.baseUrl`, value)
|
|
3748
|
-
}
|
|
3749
|
-
)
|
|
3750
|
-
] })
|
|
3751
|
-
] }) }) }, providerId);
|
|
3752
|
-
}) })
|
|
3753
|
-
] });
|
|
3754
|
-
}
|
|
3755
|
-
function ProviderButton({
|
|
3756
|
-
children,
|
|
3757
|
-
disabled = false,
|
|
3758
|
-
variant = "primary",
|
|
3759
|
-
size = "md",
|
|
3760
|
-
onPress
|
|
3761
|
-
}) {
|
|
3762
|
-
const [buttonElement, setButtonElement] = useState(null);
|
|
3763
|
-
useEffect(() => {
|
|
3764
|
-
if (!buttonElement) {
|
|
3765
|
-
return;
|
|
3766
|
-
}
|
|
3767
|
-
const handleClick = () => {
|
|
3768
|
-
void onPress();
|
|
3769
|
-
};
|
|
3770
|
-
buttonElement.addEventListener("click", handleClick);
|
|
3771
|
-
return () => buttonElement.removeEventListener("click", handleClick);
|
|
3772
|
-
}, [buttonElement, onPress]);
|
|
3773
|
-
return /* @__PURE__ */ jsx(
|
|
3774
|
-
"dt-button",
|
|
3775
|
-
{
|
|
3776
|
-
ref: (element) => setButtonElement(element),
|
|
3777
|
-
disabled,
|
|
3778
|
-
variant,
|
|
3779
|
-
size,
|
|
3780
|
-
children
|
|
3781
|
-
}
|
|
3782
|
-
);
|
|
3783
|
-
}
|
|
3784
|
-
function ProviderSelect({ value, options, disabled = false, onChange }) {
|
|
3785
|
-
const [selectElement, setSelectElement] = useState(null);
|
|
3786
|
-
useEffect(() => {
|
|
3787
|
-
if (!selectElement) {
|
|
3788
|
-
return;
|
|
3789
|
-
}
|
|
3790
|
-
selectElement.options = options;
|
|
3791
|
-
}, [options, selectElement]);
|
|
3792
|
-
useEffect(() => {
|
|
3793
|
-
if (!selectElement) {
|
|
3794
|
-
return;
|
|
3795
|
-
}
|
|
3796
|
-
selectElement.value = value;
|
|
3797
|
-
}, [selectElement, value]);
|
|
3798
|
-
useEffect(() => {
|
|
3799
|
-
if (!selectElement) {
|
|
3800
|
-
return;
|
|
3801
|
-
}
|
|
3802
|
-
selectElement.disabled = disabled;
|
|
3803
|
-
}, [disabled, selectElement]);
|
|
3804
|
-
useEffect(() => {
|
|
3805
|
-
if (!selectElement) {
|
|
3806
|
-
return;
|
|
3807
|
-
}
|
|
3808
|
-
const handleChange = (event) => {
|
|
3809
|
-
void onChange(event.detail.value);
|
|
3810
|
-
};
|
|
3811
|
-
selectElement.addEventListener("dt-change", handleChange);
|
|
3812
|
-
return () => selectElement.removeEventListener("dt-change", handleChange);
|
|
3813
|
-
}, [onChange, selectElement]);
|
|
3814
|
-
return /* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerSelectWrap, children: /* @__PURE__ */ jsx("dt-select", { ref: (element) => setSelectElement(element) }) });
|
|
3815
|
-
}
|
|
3816
|
-
function ProviderTextField({
|
|
3817
|
-
id,
|
|
3818
|
-
label,
|
|
3819
|
-
value,
|
|
3820
|
-
sensitive = false,
|
|
3821
|
-
onCommit
|
|
3822
|
-
}) {
|
|
3823
|
-
const [localValue, setLocalValue] = useState(value);
|
|
3824
|
-
useEffect(() => {
|
|
3825
|
-
setLocalValue(value);
|
|
3826
|
-
}, [value]);
|
|
3827
|
-
const commit = useCallback(() => {
|
|
3828
|
-
if (localValue !== value) {
|
|
3829
|
-
void onCommit(localValue);
|
|
3830
|
-
}
|
|
3831
|
-
}, [localValue, onCommit, value]);
|
|
3832
|
-
return /* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerField, children: [
|
|
3833
|
-
/* @__PURE__ */ jsx("label", { className: PreferenceApp_default.providerFieldLabel, htmlFor: id, children: label }),
|
|
3834
|
-
/* @__PURE__ */ jsx(
|
|
3835
|
-
"input",
|
|
3836
|
-
{
|
|
3837
|
-
id,
|
|
3838
|
-
type: sensitive ? "password" : "text",
|
|
3839
|
-
className: sensitive ? PreferenceApp_default.textInputSensitive : PreferenceApp_default.textInput,
|
|
3840
|
-
value: localValue,
|
|
3841
|
-
onChange: (event) => setLocalValue(event.target.value),
|
|
3842
|
-
onBlur: commit,
|
|
3843
|
-
onKeyDown: (event) => {
|
|
3844
|
-
if (event.key === "Enter") {
|
|
3845
|
-
commit();
|
|
3846
|
-
}
|
|
3847
|
-
}
|
|
3848
|
-
}
|
|
3849
|
-
)
|
|
3850
|
-
] });
|
|
3851
|
-
}
|
|
3852
|
-
|
|
3853
|
-
// src/components/VoiceProviderList.tsx
|
|
3854
|
-
function VoiceProviderList({ config, onChange }) {
|
|
3855
|
-
const enabledProviders = useMemo(() => {
|
|
3856
|
-
const providers = parseVoiceEnabledProviders(config["voice.enabledProviders"]);
|
|
3857
|
-
const defaultProvider = typeof config["voice.defaultProvider"] === "string" && config["voice.defaultProvider"] ? String(config["voice.defaultProvider"]) : DEFAULT_VOICE_PROVIDER_ID;
|
|
3858
|
-
if (!providers.includes(defaultProvider)) {
|
|
3859
|
-
providers.unshift(defaultProvider);
|
|
3860
|
-
}
|
|
3861
|
-
return providers;
|
|
3862
|
-
}, [config]);
|
|
3863
|
-
const updateOrder = useCallback(
|
|
3864
|
-
async (providerIds) => {
|
|
3865
|
-
const nextProviders = providerIds.length > 0 ? providerIds : [DEFAULT_VOICE_PROVIDER_ID];
|
|
3866
|
-
await onChange("voice.enabledProviders", serializeVoiceEnabledProviders(nextProviders));
|
|
3867
|
-
await onChange("voice.defaultProvider", nextProviders[0]);
|
|
3868
|
-
},
|
|
3869
|
-
[onChange]
|
|
3870
|
-
);
|
|
3871
|
-
const handleAddProvider = useCallback(async () => {
|
|
3872
|
-
const nextProvider = VOICE_PROVIDER_DEFINITIONS.find(
|
|
3873
|
-
(provider) => !enabledProviders.includes(provider.id)
|
|
3874
|
-
);
|
|
3875
|
-
if (!nextProvider) {
|
|
3876
|
-
return;
|
|
3877
|
-
}
|
|
3878
|
-
await updateOrder([...enabledProviders, nextProvider.id]);
|
|
3879
|
-
}, [enabledProviders, updateOrder]);
|
|
3880
|
-
const handleProviderChange = useCallback(
|
|
3881
|
-
async (providerId, nextProviderId) => {
|
|
3882
|
-
if (providerId === nextProviderId || enabledProviders.includes(nextProviderId)) {
|
|
3883
|
-
return;
|
|
3884
|
-
}
|
|
3885
|
-
const nextProviders = enabledProviders.map(
|
|
3886
|
-
(currentProviderId) => currentProviderId === providerId ? nextProviderId : currentProviderId
|
|
3887
|
-
);
|
|
3888
|
-
await updateOrder(nextProviders);
|
|
3889
|
-
},
|
|
3890
|
-
[enabledProviders, updateOrder]
|
|
3891
|
-
);
|
|
3892
|
-
const handleDeleteProvider = useCallback(
|
|
3893
|
-
async (providerId) => {
|
|
3894
|
-
if (enabledProviders.length === 1) {
|
|
3895
|
-
return;
|
|
3896
|
-
}
|
|
3897
|
-
const nextProviders = enabledProviders.filter(
|
|
3898
|
-
(currentProviderId) => currentProviderId !== providerId
|
|
3899
|
-
);
|
|
3900
|
-
await updateOrder(nextProviders);
|
|
3901
|
-
for (const key of getVoiceProviderConfigKeys(providerId)) {
|
|
3902
|
-
await onChange(key, "");
|
|
3903
|
-
}
|
|
3904
|
-
},
|
|
3905
|
-
[enabledProviders, onChange, updateOrder]
|
|
3906
|
-
);
|
|
3907
|
-
const handleSetDefault = useCallback(
|
|
3908
|
-
async (providerId) => {
|
|
3909
|
-
if (enabledProviders[0] === providerId) {
|
|
3910
|
-
return;
|
|
3911
|
-
}
|
|
3912
|
-
const nextProviders = [
|
|
3913
|
-
providerId,
|
|
3914
|
-
...enabledProviders.filter((currentProviderId) => currentProviderId !== providerId)
|
|
3915
|
-
];
|
|
3916
|
-
await updateOrder(nextProviders);
|
|
3917
|
-
},
|
|
3918
|
-
[enabledProviders, updateOrder]
|
|
3919
|
-
);
|
|
3920
|
-
return /* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerGroup, children: [
|
|
3921
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerGroupHeader, children: [
|
|
3922
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
3923
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.rowLabel, children: "Providers" }),
|
|
3924
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.rowDescription, children: "Add STT providers, keep your default at the top, and remove unused items." })
|
|
3925
|
-
] }),
|
|
3926
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerActionButtonWrap, children: /* @__PURE__ */ jsx(
|
|
3927
|
-
ProviderButton2,
|
|
3928
|
-
{
|
|
3929
|
-
onPress: handleAddProvider,
|
|
3930
|
-
disabled: enabledProviders.length >= VOICE_PROVIDER_DEFINITIONS.length,
|
|
3931
|
-
variant: "secondary",
|
|
3932
|
-
children: "Add provider"
|
|
3933
|
-
}
|
|
3934
|
-
) })
|
|
3935
|
-
] }),
|
|
3936
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerList, children: enabledProviders.map((providerId, index) => {
|
|
3937
|
-
const definition = getVoiceProviderDefinition(providerId);
|
|
3938
|
-
if (!definition) {
|
|
3939
|
-
return null;
|
|
3940
|
-
}
|
|
3941
|
-
const availableOptions = VOICE_PROVIDER_DEFINITIONS.filter(
|
|
3942
|
-
(provider) => provider.id === providerId || !enabledProviders.includes(provider.id)
|
|
3943
|
-
);
|
|
3944
|
-
return /* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerCard, children: /* @__PURE__ */ jsx("dt-card", { variant: "outlined", children: /* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerCardBody, children: [
|
|
3945
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerCardHeader, children: [
|
|
3946
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerCardTitleRow, children: [
|
|
3947
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerCardTitle, children: definition.label }),
|
|
3948
|
-
index === 0 && /* @__PURE__ */ jsx("span", { className: PreferenceApp_default.providerDefaultBadge, children: "Default" })
|
|
3949
|
-
] }),
|
|
3950
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerCardActions, children: [
|
|
3951
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerButtonWrap, children: /* @__PURE__ */ jsx(
|
|
3952
|
-
ProviderButton2,
|
|
3953
|
-
{
|
|
3954
|
-
onPress: () => handleSetDefault(providerId),
|
|
3955
|
-
disabled: index === 0,
|
|
3956
|
-
variant: "secondary",
|
|
3957
|
-
size: "sm",
|
|
3958
|
-
children: "Set as default"
|
|
3959
|
-
}
|
|
3960
|
-
) }),
|
|
3961
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerButtonWrap, children: /* @__PURE__ */ jsx(
|
|
3962
|
-
ProviderButton2,
|
|
3963
|
-
{
|
|
3964
|
-
onPress: () => handleDeleteProvider(providerId),
|
|
3965
|
-
disabled: enabledProviders.length === 1,
|
|
3966
|
-
variant: "danger",
|
|
3967
|
-
size: "sm",
|
|
3968
|
-
children: "Delete"
|
|
3969
|
-
}
|
|
3970
|
-
) })
|
|
3971
|
-
] })
|
|
3972
|
-
] }),
|
|
3973
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerFieldGrid, children: [
|
|
3974
|
-
/* @__PURE__ */ jsx(
|
|
3975
|
-
ProviderSelectField,
|
|
3976
|
-
{
|
|
3977
|
-
label: "Provider",
|
|
3978
|
-
value: providerId,
|
|
3979
|
-
options: availableOptions.map((provider) => ({
|
|
3980
|
-
value: provider.id,
|
|
3981
|
-
label: provider.label
|
|
3982
|
-
})),
|
|
3983
|
-
onChange: (nextValue) => handleProviderChange(providerId, nextValue)
|
|
3984
|
-
}
|
|
3985
|
-
),
|
|
3986
|
-
definition.supportsApiKey && /* @__PURE__ */ jsx(
|
|
3987
|
-
ProviderTextField2,
|
|
3988
|
-
{
|
|
3989
|
-
id: `voice-provider-key-${providerId}`,
|
|
3990
|
-
label: "API Key",
|
|
3991
|
-
value: String(config[`voice.providers.${providerId}.apiKey`] ?? ""),
|
|
3992
|
-
sensitive: true,
|
|
3993
|
-
onCommit: (value) => onChange(`voice.providers.${providerId}.apiKey`, value)
|
|
3994
|
-
}
|
|
3995
|
-
),
|
|
3996
|
-
definition.supportsModel && /* @__PURE__ */ jsx(
|
|
3997
|
-
ProviderTextField2,
|
|
3998
|
-
{
|
|
3999
|
-
id: `voice-provider-model-${providerId}`,
|
|
4000
|
-
label: "Model",
|
|
4001
|
-
value: String(config[`voice.providers.${providerId}.model`] ?? ""),
|
|
4002
|
-
onCommit: (value) => onChange(`voice.providers.${providerId}.model`, value)
|
|
4003
|
-
}
|
|
4004
|
-
),
|
|
4005
|
-
definition.supportsBaseUrl && /* @__PURE__ */ jsx(
|
|
4006
|
-
ProviderTextField2,
|
|
4007
|
-
{
|
|
4008
|
-
id: `voice-provider-base-url-${providerId}`,
|
|
4009
|
-
label: "Base URL",
|
|
4010
|
-
value: String(config[`voice.providers.${providerId}.baseUrl`] ?? ""),
|
|
4011
|
-
onCommit: (value) => onChange(`voice.providers.${providerId}.baseUrl`, value)
|
|
4012
|
-
}
|
|
4013
|
-
),
|
|
4014
|
-
definition.supportsAzureDeployment && /* @__PURE__ */ jsx(
|
|
4015
|
-
ProviderTextField2,
|
|
4016
|
-
{
|
|
4017
|
-
id: `voice-provider-deployment-${providerId}`,
|
|
4018
|
-
label: "Azure Deployment",
|
|
4019
|
-
value: String(
|
|
4020
|
-
config[`voice.providers.${providerId}.azureDeployment`] ?? ""
|
|
4021
|
-
),
|
|
4022
|
-
onCommit: (value) => onChange(`voice.providers.${providerId}.azureDeployment`, value)
|
|
4023
|
-
}
|
|
4024
|
-
),
|
|
4025
|
-
definition.supportsAzureApiVersion && /* @__PURE__ */ jsx(
|
|
4026
|
-
ProviderTextField2,
|
|
4027
|
-
{
|
|
4028
|
-
id: `voice-provider-api-version-${providerId}`,
|
|
4029
|
-
label: "Azure API Version",
|
|
4030
|
-
value: String(
|
|
4031
|
-
config[`voice.providers.${providerId}.azureApiVersion`] ?? ""
|
|
4032
|
-
),
|
|
4033
|
-
onCommit: (value) => onChange(`voice.providers.${providerId}.azureApiVersion`, value)
|
|
4034
|
-
}
|
|
4035
|
-
)
|
|
4036
|
-
] })
|
|
4037
|
-
] }) }) }, providerId);
|
|
4038
|
-
}) })
|
|
4039
|
-
] });
|
|
4040
|
-
}
|
|
4041
|
-
function ProviderButton2({
|
|
4042
|
-
children,
|
|
4043
|
-
disabled = false,
|
|
4044
|
-
variant = "primary",
|
|
4045
|
-
size = "md",
|
|
4046
|
-
onPress
|
|
4047
|
-
}) {
|
|
4048
|
-
const [buttonElement, setButtonElement] = useState(null);
|
|
4049
|
-
useEffect(() => {
|
|
4050
|
-
if (!buttonElement) {
|
|
4051
|
-
return;
|
|
4052
|
-
}
|
|
4053
|
-
const handleClick = () => {
|
|
4054
|
-
void onPress();
|
|
4055
|
-
};
|
|
4056
|
-
buttonElement.addEventListener("click", handleClick);
|
|
4057
|
-
return () => buttonElement.removeEventListener("click", handleClick);
|
|
4058
|
-
}, [buttonElement, onPress]);
|
|
4059
|
-
return /* @__PURE__ */ jsx(
|
|
4060
|
-
"dt-button",
|
|
4061
|
-
{
|
|
4062
|
-
ref: (element) => setButtonElement(element),
|
|
4063
|
-
disabled,
|
|
4064
|
-
variant,
|
|
4065
|
-
size,
|
|
4066
|
-
children
|
|
4067
|
-
}
|
|
4068
|
-
);
|
|
4069
|
-
}
|
|
4070
|
-
function ProviderSelectField({
|
|
4071
|
-
label,
|
|
4072
|
-
value,
|
|
4073
|
-
options,
|
|
4074
|
-
onChange
|
|
4075
|
-
}) {
|
|
4076
|
-
const [selectElement, setSelectElement] = useState(null);
|
|
4077
|
-
useEffect(() => {
|
|
4078
|
-
if (!selectElement) {
|
|
4079
|
-
return;
|
|
4080
|
-
}
|
|
4081
|
-
selectElement.options = options;
|
|
4082
|
-
}, [options, selectElement]);
|
|
4083
|
-
useEffect(() => {
|
|
4084
|
-
if (!selectElement) {
|
|
4085
|
-
return;
|
|
4086
|
-
}
|
|
4087
|
-
selectElement.value = value;
|
|
4088
|
-
}, [selectElement, value]);
|
|
4089
|
-
useEffect(() => {
|
|
4090
|
-
if (!selectElement) {
|
|
4091
|
-
return;
|
|
4092
|
-
}
|
|
4093
|
-
const handleChange = (event) => {
|
|
4094
|
-
void onChange(event.detail.value);
|
|
4095
|
-
};
|
|
4096
|
-
selectElement.addEventListener("dt-change", handleChange);
|
|
4097
|
-
return () => selectElement.removeEventListener("dt-change", handleChange);
|
|
4098
|
-
}, [onChange, selectElement]);
|
|
4099
|
-
return /* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerField, children: [
|
|
4100
|
-
/* @__PURE__ */ jsx("label", { className: PreferenceApp_default.providerFieldLabel, children: label }),
|
|
4101
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.providerSelectWrap, children: /* @__PURE__ */ jsx("dt-select", { ref: (element) => setSelectElement(element) }) })
|
|
4102
|
-
] });
|
|
4103
|
-
}
|
|
4104
|
-
function ProviderTextField2({
|
|
4105
|
-
id,
|
|
4106
|
-
label,
|
|
4107
|
-
value,
|
|
4108
|
-
sensitive = false,
|
|
4109
|
-
onCommit
|
|
4110
|
-
}) {
|
|
4111
|
-
const [localValue, setLocalValue] = useState(value);
|
|
4112
|
-
useEffect(() => {
|
|
4113
|
-
setLocalValue(value);
|
|
4114
|
-
}, [value]);
|
|
4115
|
-
const commit = useCallback(() => {
|
|
4116
|
-
if (localValue !== value) {
|
|
4117
|
-
void onCommit(localValue);
|
|
4118
|
-
}
|
|
4119
|
-
}, [localValue, onCommit, value]);
|
|
4120
|
-
return /* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.providerField, children: [
|
|
4121
|
-
/* @__PURE__ */ jsx("label", { className: PreferenceApp_default.providerFieldLabel, htmlFor: id, children: label }),
|
|
4122
|
-
/* @__PURE__ */ jsx(
|
|
4123
|
-
"input",
|
|
4124
|
-
{
|
|
4125
|
-
id,
|
|
4126
|
-
type: sensitive ? "password" : "text",
|
|
4127
|
-
className: sensitive ? PreferenceApp_default.textInputSensitive : PreferenceApp_default.textInput,
|
|
4128
|
-
value: localValue,
|
|
4129
|
-
onChange: (event) => setLocalValue(event.target.value),
|
|
4130
|
-
onBlur: commit,
|
|
4131
|
-
onKeyDown: (event) => {
|
|
4132
|
-
if (event.key === "Enter") {
|
|
4133
|
-
commit();
|
|
4134
|
-
}
|
|
4135
|
-
}
|
|
4136
|
-
}
|
|
4137
|
-
)
|
|
4138
|
-
] });
|
|
4139
|
-
}
|
|
4140
|
-
|
|
4141
|
-
// src/components/PreferenceSection.tsx
|
|
4142
|
-
function PreferenceSection({ title, children }) {
|
|
4143
|
-
return /* @__PURE__ */ jsxs("section", { className: PreferenceApp_default.section, children: [
|
|
4144
|
-
/* @__PURE__ */ jsx("h3", { className: PreferenceApp_default.sectionTitle, children: title }),
|
|
4145
|
-
children
|
|
4146
|
-
] });
|
|
4147
|
-
}
|
|
4148
|
-
|
|
4149
|
-
// src/components/PreferenceRow.tsx
|
|
4150
|
-
function PreferenceRow({ schema, value, onChange }) {
|
|
4151
|
-
return /* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.row, children: [
|
|
4152
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.rowInfo, children: [
|
|
4153
|
-
/* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.rowLabel, children: [
|
|
4154
|
-
schema.label,
|
|
4155
|
-
schema.requiresRestart && /* @__PURE__ */ jsx("span", { className: PreferenceApp_default.rowRestartBadge, children: "restart" })
|
|
4156
|
-
] }),
|
|
4157
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.rowDescription, children: schema.description })
|
|
4158
|
-
] }),
|
|
4159
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.rowControl, children: /* @__PURE__ */ jsx(Control, { schema, value, onChange }) })
|
|
4160
|
-
] });
|
|
4161
|
-
}
|
|
4162
|
-
function Control({
|
|
4163
|
-
schema,
|
|
4164
|
-
value,
|
|
4165
|
-
onChange
|
|
4166
|
-
}) {
|
|
4167
|
-
if (schema.key === "general.accentColor" && schema.type === "string") {
|
|
4168
|
-
return /* @__PURE__ */ jsx(ColorControl, { schema, value, onChange });
|
|
4169
|
-
}
|
|
4170
|
-
if (schema.type === "boolean") {
|
|
4171
|
-
return /* @__PURE__ */ jsx(ToggleControl, { schema, value, onChange });
|
|
4172
|
-
}
|
|
4173
|
-
if (schema.type === "string" && schema.options) {
|
|
4174
|
-
return /* @__PURE__ */ jsx(DropdownControl, { schema, value, onChange });
|
|
4175
|
-
}
|
|
4176
|
-
if (schema.type === "string") {
|
|
4177
|
-
return /* @__PURE__ */ jsx(TextControl, { schema, value, onChange });
|
|
4178
|
-
}
|
|
4179
|
-
if (schema.type === "number") {
|
|
4180
|
-
return /* @__PURE__ */ jsx(NumberControl, { schema, value, onChange });
|
|
4181
|
-
}
|
|
4182
|
-
return null;
|
|
4183
|
-
}
|
|
4184
|
-
function isHexColor(value) {
|
|
4185
|
-
return /^#(?:[0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(value);
|
|
4186
|
-
}
|
|
4187
|
-
function ColorControl({
|
|
4188
|
-
schema,
|
|
4189
|
-
value,
|
|
4190
|
-
onChange
|
|
4191
|
-
}) {
|
|
4192
|
-
const [localValue, setLocalValue] = useState(value);
|
|
4193
|
-
useEffect(() => {
|
|
4194
|
-
setLocalValue(value);
|
|
4195
|
-
}, [value]);
|
|
4196
|
-
const commit = useCallback(
|
|
4197
|
-
(nextValue) => {
|
|
4198
|
-
const resolvedValue = (nextValue ?? localValue).trim();
|
|
4199
|
-
if (resolvedValue !== value) {
|
|
4200
|
-
onChange(schema.key, resolvedValue);
|
|
4201
|
-
}
|
|
4202
|
-
},
|
|
4203
|
-
[localValue, onChange, schema.key, value]
|
|
4204
|
-
);
|
|
4205
|
-
const handlePickerInput = useCallback((e) => {
|
|
4206
|
-
setLocalValue(e.currentTarget.value);
|
|
4207
|
-
}, []);
|
|
4208
|
-
const handlePickerChange = useCallback(
|
|
4209
|
-
(e) => {
|
|
4210
|
-
const nextValue = e.target.value;
|
|
4211
|
-
setLocalValue(nextValue);
|
|
4212
|
-
commit(nextValue);
|
|
4213
|
-
},
|
|
4214
|
-
[commit]
|
|
4215
|
-
);
|
|
4216
|
-
const handleTextChange = useCallback((e) => {
|
|
4217
|
-
setLocalValue(e.target.value);
|
|
4218
|
-
}, []);
|
|
4219
|
-
const handleTextKeyDown = useCallback(
|
|
4220
|
-
(e) => {
|
|
4221
|
-
if (e.key === "Enter") {
|
|
4222
|
-
commit();
|
|
4223
|
-
}
|
|
4224
|
-
},
|
|
4225
|
-
[commit]
|
|
4226
|
-
);
|
|
4227
|
-
const handleTextBlur = useCallback(() => {
|
|
4228
|
-
commit();
|
|
4229
|
-
}, [commit]);
|
|
4230
|
-
const pickerValue = isHexColor(localValue) ? localValue : "#7c6ff7";
|
|
4231
|
-
return /* @__PURE__ */ jsxs("div", { className: PreferenceApp_default.colorControl, children: [
|
|
4232
|
-
/* @__PURE__ */ jsx(
|
|
4233
|
-
"input",
|
|
4234
|
-
{
|
|
4235
|
-
type: "color",
|
|
4236
|
-
className: PreferenceApp_default.colorInput,
|
|
4237
|
-
value: pickerValue,
|
|
4238
|
-
onInput: handlePickerInput,
|
|
4239
|
-
onChange: handlePickerChange,
|
|
4240
|
-
"aria-label": `${schema.label} picker`
|
|
4241
|
-
}
|
|
4242
|
-
),
|
|
4243
|
-
/* @__PURE__ */ jsx(
|
|
4244
|
-
"input",
|
|
4245
|
-
{
|
|
4246
|
-
type: "text",
|
|
4247
|
-
className: PreferenceApp_default.textInput,
|
|
4248
|
-
value: localValue,
|
|
4249
|
-
onChange: handleTextChange,
|
|
4250
|
-
onBlur: handleTextBlur,
|
|
4251
|
-
onKeyDown: handleTextKeyDown,
|
|
4252
|
-
placeholder: "#7c6ff7"
|
|
4253
|
-
}
|
|
4254
|
-
)
|
|
4255
|
-
] });
|
|
4256
|
-
}
|
|
4257
|
-
function ToggleControl({
|
|
4258
|
-
schema,
|
|
4259
|
-
value,
|
|
4260
|
-
onChange
|
|
4261
|
-
}) {
|
|
4262
|
-
const handleChange = useCallback(() => {
|
|
4263
|
-
onChange(schema.key, !value);
|
|
4264
|
-
}, [schema.key, value, onChange]);
|
|
4265
|
-
return /* @__PURE__ */ jsxs("label", { className: PreferenceApp_default.toggle, children: [
|
|
4266
|
-
/* @__PURE__ */ jsx(
|
|
4267
|
-
"input",
|
|
4268
|
-
{
|
|
4269
|
-
type: "checkbox",
|
|
4270
|
-
className: PreferenceApp_default.toggleInput,
|
|
4271
|
-
checked: value,
|
|
4272
|
-
onChange: handleChange
|
|
4273
|
-
}
|
|
4274
|
-
),
|
|
4275
|
-
/* @__PURE__ */ jsx("span", { className: PreferenceApp_default.toggleTrack }),
|
|
4276
|
-
/* @__PURE__ */ jsx("span", { className: PreferenceApp_default.toggleKnob })
|
|
4277
|
-
] });
|
|
4278
|
-
}
|
|
4279
|
-
function DropdownControl({
|
|
4280
|
-
schema,
|
|
4281
|
-
value,
|
|
4282
|
-
onChange
|
|
4283
|
-
}) {
|
|
4284
|
-
const handleChange = useCallback(
|
|
4285
|
-
(nextValue) => {
|
|
4286
|
-
onChange(schema.key, nextValue);
|
|
4287
|
-
},
|
|
4288
|
-
[schema.key, onChange]
|
|
4289
|
-
);
|
|
4290
|
-
return /* @__PURE__ */ jsx(
|
|
4291
|
-
DtSelectControl,
|
|
4292
|
-
{
|
|
4293
|
-
value,
|
|
4294
|
-
options: (schema.options ?? []).map((opt) => ({ value: opt, label: opt })),
|
|
4295
|
-
onChange: handleChange
|
|
4296
|
-
}
|
|
4297
|
-
);
|
|
4298
|
-
}
|
|
4299
|
-
function DtSelectControl({
|
|
4300
|
-
value,
|
|
4301
|
-
options,
|
|
4302
|
-
disabled = false,
|
|
4303
|
-
onChange
|
|
4304
|
-
}) {
|
|
4305
|
-
const [selectElement, setSelectElement] = useState(null);
|
|
4306
|
-
useEffect(() => {
|
|
4307
|
-
if (!selectElement) {
|
|
4308
|
-
return;
|
|
4309
|
-
}
|
|
4310
|
-
selectElement.options = options;
|
|
4311
|
-
}, [options, selectElement]);
|
|
4312
|
-
useEffect(() => {
|
|
4313
|
-
if (!selectElement) {
|
|
4314
|
-
return;
|
|
4315
|
-
}
|
|
4316
|
-
selectElement.value = value;
|
|
4317
|
-
selectElement.disabled = disabled;
|
|
4318
|
-
}, [disabled, selectElement, value]);
|
|
4319
|
-
useEffect(() => {
|
|
4320
|
-
if (!selectElement) {
|
|
4321
|
-
return;
|
|
4322
|
-
}
|
|
4323
|
-
const handleSelectChange = (event) => {
|
|
4324
|
-
onChange(event.detail.value);
|
|
4325
|
-
};
|
|
4326
|
-
selectElement.addEventListener("dt-change", handleSelectChange);
|
|
4327
|
-
return () => selectElement.removeEventListener("dt-change", handleSelectChange);
|
|
4328
|
-
}, [onChange, selectElement]);
|
|
4329
|
-
return /* @__PURE__ */ jsx("div", { className: PreferenceApp_default.selectWrap, children: /* @__PURE__ */ jsx("dt-select", { ref: (element) => setSelectElement(element) }) });
|
|
4330
|
-
}
|
|
4331
|
-
function TextControl({
|
|
4332
|
-
schema,
|
|
4333
|
-
value,
|
|
4334
|
-
onChange
|
|
4335
|
-
}) {
|
|
4336
|
-
const [localValue, setLocalValue] = useState(value);
|
|
4337
|
-
useEffect(() => {
|
|
4338
|
-
setLocalValue(value);
|
|
4339
|
-
}, [value]);
|
|
4340
|
-
const handleBlur = useCallback(() => {
|
|
4341
|
-
if (localValue !== value) {
|
|
4342
|
-
onChange(schema.key, localValue);
|
|
4343
|
-
}
|
|
4344
|
-
}, [schema.key, localValue, value, onChange]);
|
|
4345
|
-
const handleKeyDown = useCallback(
|
|
4346
|
-
(e) => {
|
|
4347
|
-
if (e.key === "Enter") {
|
|
4348
|
-
onChange(schema.key, localValue);
|
|
4349
|
-
}
|
|
4350
|
-
},
|
|
4351
|
-
[schema.key, localValue, onChange]
|
|
4352
|
-
);
|
|
4353
|
-
return /* @__PURE__ */ jsx(
|
|
4354
|
-
"input",
|
|
4355
|
-
{
|
|
4356
|
-
type: schema.sensitive ? "password" : "text",
|
|
4357
|
-
className: schema.sensitive ? PreferenceApp_default.textInputSensitive : PreferenceApp_default.textInput,
|
|
4358
|
-
value: localValue,
|
|
4359
|
-
onChange: (e) => setLocalValue(e.target.value),
|
|
4360
|
-
onBlur: handleBlur,
|
|
4361
|
-
onKeyDown: handleKeyDown,
|
|
4362
|
-
placeholder: schema.sensitive ? "Enter API key..." : void 0
|
|
4363
|
-
}
|
|
4364
|
-
);
|
|
4365
|
-
}
|
|
4366
|
-
function NumberControl({
|
|
4367
|
-
schema,
|
|
4368
|
-
value,
|
|
4369
|
-
onChange
|
|
4370
|
-
}) {
|
|
4371
|
-
const [localValue, setLocalValue] = useState(String(value));
|
|
4372
|
-
useEffect(() => {
|
|
4373
|
-
setLocalValue(String(value));
|
|
4374
|
-
}, [value]);
|
|
4375
|
-
const commit = useCallback(() => {
|
|
4376
|
-
let num = Number(localValue);
|
|
4377
|
-
if (Number.isNaN(num)) {
|
|
4378
|
-
setLocalValue(String(value));
|
|
4379
|
-
return;
|
|
4380
|
-
}
|
|
4381
|
-
if (schema.min !== void 0) num = Math.max(schema.min, num);
|
|
4382
|
-
if (schema.max !== void 0) num = Math.min(schema.max, num);
|
|
4383
|
-
setLocalValue(String(num));
|
|
4384
|
-
if (num !== value) {
|
|
4385
|
-
onChange(schema.key, num);
|
|
4386
|
-
}
|
|
4387
|
-
}, [schema.key, schema.min, schema.max, localValue, value, onChange]);
|
|
4388
|
-
const handleKeyDown = useCallback(
|
|
4389
|
-
(e) => {
|
|
4390
|
-
if (e.key === "Enter") commit();
|
|
4391
|
-
},
|
|
4392
|
-
[commit]
|
|
4393
|
-
);
|
|
4394
|
-
return /* @__PURE__ */ jsx(
|
|
4395
|
-
"input",
|
|
4396
|
-
{
|
|
4397
|
-
type: "number",
|
|
4398
|
-
className: PreferenceApp_default.numberInput,
|
|
4399
|
-
value: localValue,
|
|
4400
|
-
min: schema.min,
|
|
4401
|
-
max: schema.max,
|
|
4402
|
-
onChange: (e) => setLocalValue(e.target.value),
|
|
4403
|
-
onBlur: commit,
|
|
4404
|
-
onKeyDown: handleKeyDown
|
|
4405
|
-
}
|
|
4406
|
-
);
|
|
4407
|
-
}
|
|
4408
|
-
|
|
4409
|
-
// src/components/PreferenceActions.tsx
|
|
4410
|
-
import { ActionsProvider, Action, useCommand } from "@desktalk/sdk";
|
|
4411
|
-
function PreferenceActions({ children, onConfigChanged }) {
|
|
4412
|
-
const getSetting = useCommand(
|
|
4413
|
-
"preferences.get"
|
|
4414
|
-
);
|
|
4415
|
-
const setSetting = useCommand(
|
|
4416
|
-
"preferences.set"
|
|
4417
|
-
);
|
|
4418
|
-
const resetSetting = useCommand("preferences.reset");
|
|
4419
|
-
const resetAllSettings = useCommand("preferences.resetAll");
|
|
4420
|
-
const handleGetSetting = useCallback(
|
|
4421
|
-
async (params) => {
|
|
4422
|
-
const key = params?.key;
|
|
4423
|
-
if (!key) throw new Error("Missing required parameter: key");
|
|
4424
|
-
const result = await getSetting({ key });
|
|
4425
|
-
return result;
|
|
4426
|
-
},
|
|
4427
|
-
[getSetting]
|
|
4428
|
-
);
|
|
4429
|
-
const handleSetSetting = useCallback(
|
|
4430
|
-
async (params) => {
|
|
4431
|
-
const key = params?.key;
|
|
4432
|
-
if (!key) throw new Error("Missing required parameter: key");
|
|
4433
|
-
let value = params?.value;
|
|
4434
|
-
if (value === void 0) throw new Error("Missing required parameter: value");
|
|
4435
|
-
const schema = getSchema(key);
|
|
4436
|
-
if (schema) {
|
|
4437
|
-
if (schema.type === "number" && typeof value === "string") {
|
|
4438
|
-
value = Number(value);
|
|
4439
|
-
} else if (schema.type === "boolean" && typeof value === "string") {
|
|
4440
|
-
value = value === "true";
|
|
4441
|
-
}
|
|
4442
|
-
}
|
|
4443
|
-
await setSetting({ key, value });
|
|
4444
|
-
onConfigChanged();
|
|
4445
|
-
return { success: true };
|
|
4446
|
-
},
|
|
4447
|
-
[setSetting, onConfigChanged]
|
|
4448
|
-
);
|
|
4449
|
-
const handleResetSetting = useCallback(
|
|
4450
|
-
async (params) => {
|
|
4451
|
-
const key = params?.key;
|
|
4452
|
-
if (!key) throw new Error("Missing required parameter: key");
|
|
4453
|
-
await resetSetting({ key });
|
|
4454
|
-
onConfigChanged();
|
|
4455
|
-
return { success: true };
|
|
4456
|
-
},
|
|
4457
|
-
[resetSetting, onConfigChanged]
|
|
4458
|
-
);
|
|
4459
|
-
const handleResetAll = useCallback(async () => {
|
|
4460
|
-
await resetAllSettings();
|
|
4461
|
-
onConfigChanged();
|
|
4462
|
-
return { success: true };
|
|
4463
|
-
}, [resetAllSettings, onConfigChanged]);
|
|
4464
|
-
return /* @__PURE__ */ jsxs(ActionsProvider, { children: [
|
|
4465
|
-
/* @__PURE__ */ jsx(
|
|
4466
|
-
Action,
|
|
4467
|
-
{
|
|
4468
|
-
name: "Get Setting",
|
|
4469
|
-
description: "Read the current value of a setting",
|
|
4470
|
-
params: {
|
|
4471
|
-
key: {
|
|
4472
|
-
type: "string",
|
|
4473
|
-
description: "Setting key (e.g. general.theme)",
|
|
4474
|
-
required: true
|
|
4475
|
-
}
|
|
4476
|
-
},
|
|
4477
|
-
handler: handleGetSetting
|
|
4478
|
-
}
|
|
4479
|
-
),
|
|
4480
|
-
/* @__PURE__ */ jsx(
|
|
4481
|
-
Action,
|
|
4482
|
-
{
|
|
4483
|
-
name: "Set Setting",
|
|
4484
|
-
description: "Update a setting value",
|
|
4485
|
-
params: {
|
|
4486
|
-
key: {
|
|
4487
|
-
type: "string",
|
|
4488
|
-
description: "Setting key (e.g. general.theme)",
|
|
4489
|
-
required: true
|
|
4490
|
-
},
|
|
4491
|
-
value: {
|
|
4492
|
-
type: "string",
|
|
4493
|
-
description: "New value for the setting",
|
|
4494
|
-
required: true
|
|
4495
|
-
}
|
|
4496
|
-
},
|
|
4497
|
-
handler: handleSetSetting
|
|
4498
|
-
}
|
|
4499
|
-
),
|
|
4500
|
-
/* @__PURE__ */ jsx(
|
|
4501
|
-
Action,
|
|
4502
|
-
{
|
|
4503
|
-
name: "Reset Setting",
|
|
4504
|
-
description: "Reset a setting to its default value",
|
|
4505
|
-
params: {
|
|
4506
|
-
key: {
|
|
4507
|
-
type: "string",
|
|
4508
|
-
description: "Setting key to reset",
|
|
4509
|
-
required: true
|
|
4510
|
-
}
|
|
4511
|
-
},
|
|
4512
|
-
handler: handleResetSetting
|
|
4513
|
-
}
|
|
4514
|
-
),
|
|
4515
|
-
/* @__PURE__ */ jsx(
|
|
4516
|
-
Action,
|
|
4517
|
-
{
|
|
4518
|
-
name: "Reset All",
|
|
4519
|
-
description: "Reset all settings to their default values",
|
|
4520
|
-
handler: handleResetAll
|
|
4521
|
-
}
|
|
4522
|
-
),
|
|
4523
|
-
children
|
|
4524
|
-
] });
|
|
4525
|
-
}
|
|
4526
|
-
|
|
4527
|
-
// src/frontend.tsx
|
|
4528
|
-
var COMPACT_NAV_WIDTH = 720;
|
|
4529
|
-
function PreferenceApp() {
|
|
4530
|
-
const [config, setConfig] = useState(getDefaultConfig());
|
|
4531
|
-
const [activeCategory, setActiveCategory] = useState(CATEGORIES[0]);
|
|
4532
|
-
const [notification, setNotification] = useState(null);
|
|
4533
|
-
const [compactNav, setCompactNav] = useState(false);
|
|
4534
|
-
const notificationTimer = useRef(null);
|
|
4535
|
-
const rootRef = useRef(null);
|
|
4536
|
-
const getAllSettings = useCommand2("preferences.getAll");
|
|
4537
|
-
const setSetting = useCommand2(
|
|
4538
|
-
"preferences.set"
|
|
4539
|
-
);
|
|
4540
|
-
const fetchConfig = useCallback(async () => {
|
|
4541
|
-
try {
|
|
4542
|
-
const result = await getAllSettings();
|
|
4543
|
-
setConfig(result);
|
|
4544
|
-
} catch (err) {
|
|
4545
|
-
console.error("Failed to load preferences:", err);
|
|
4546
|
-
}
|
|
4547
|
-
}, [getAllSettings]);
|
|
4548
|
-
useEffect(() => {
|
|
4549
|
-
fetchConfig();
|
|
4550
|
-
}, [fetchConfig]);
|
|
4551
|
-
useEffect(() => {
|
|
4552
|
-
if (!rootRef.current) return;
|
|
4553
|
-
const updateLayout = (width) => {
|
|
4554
|
-
setCompactNav(width <= COMPACT_NAV_WIDTH);
|
|
4555
|
-
};
|
|
4556
|
-
updateLayout(rootRef.current.clientWidth);
|
|
4557
|
-
const observer = new ResizeObserver((entries) => {
|
|
4558
|
-
const entry = entries[0];
|
|
4559
|
-
if (!entry) return;
|
|
4560
|
-
updateLayout(entry.contentRect.width);
|
|
4561
|
-
});
|
|
4562
|
-
observer.observe(rootRef.current);
|
|
4563
|
-
return () => observer.disconnect();
|
|
4564
|
-
}, []);
|
|
4565
|
-
useEvent(
|
|
4566
|
-
"preferences:changed",
|
|
4567
|
-
(change) => {
|
|
4568
|
-
setConfig((prev) => ({ ...prev, [change.key]: change.value }));
|
|
4569
|
-
if (change.requiresRestart) {
|
|
4570
|
-
showNotification(
|
|
4571
|
-
__dtLocalize({ scope: "preference", key: "notifications.restartRequired", defaultText: "This change requires a restart to take effect." })
|
|
4572
|
-
);
|
|
4573
|
-
}
|
|
4574
|
-
}
|
|
4575
|
-
);
|
|
4576
|
-
useEvent("preferences:resetAll", () => {
|
|
4577
|
-
fetchConfig();
|
|
4578
|
-
showNotification(__dtLocalize({ scope: "preference", key: "notifications.resetAll", defaultText: "All settings have been reset to defaults." }));
|
|
4579
|
-
});
|
|
4580
|
-
const showNotification = useCallback((message) => {
|
|
4581
|
-
setNotification(message);
|
|
4582
|
-
if (notificationTimer.current) clearTimeout(notificationTimer.current);
|
|
4583
|
-
notificationTimer.current = setTimeout(() => setNotification(null), 4e3);
|
|
4584
|
-
}, []);
|
|
4585
|
-
const handleChange = useCallback(
|
|
4586
|
-
async (key, value) => {
|
|
4587
|
-
setConfig((prev) => ({ ...prev, [key]: value }));
|
|
4588
|
-
try {
|
|
4589
|
-
await setSetting({ key, value });
|
|
4590
|
-
} catch (err) {
|
|
4591
|
-
console.error(`Failed to update ${key}:`, err);
|
|
4592
|
-
fetchConfig();
|
|
4593
|
-
}
|
|
4594
|
-
},
|
|
4595
|
-
[setSetting, fetchConfig]
|
|
4596
|
-
);
|
|
4597
|
-
const categoriesToShow = CATEGORIES.filter((c) => c === activeCategory);
|
|
4598
|
-
const getVisibleSchemas = useCallback((category) => {
|
|
4599
|
-
const schemas = getSchemasByCategory(category);
|
|
4600
|
-
if (category !== "AI" && category !== "Voice") {
|
|
4601
|
-
return schemas;
|
|
4602
|
-
}
|
|
4603
|
-
return schemas.filter((schema) => {
|
|
4604
|
-
if (category === "AI") {
|
|
4605
|
-
return !schema.key.startsWith("ai.providers.") && schema.key !== "ai.defaultProvider" && schema.key !== "ai.enabledProviders";
|
|
4606
|
-
}
|
|
4607
|
-
return !schema.key.startsWith("voice.providers.") && schema.key !== "voice.defaultProvider" && schema.key !== "voice.enabledProviders";
|
|
4608
|
-
});
|
|
4609
|
-
}, []);
|
|
4610
|
-
return /* @__PURE__ */ jsx(PreferenceActions, { onConfigChanged: fetchConfig, children: /* @__PURE__ */ jsxs("div", { ref: rootRef, className: `${PreferenceApp_default.root}${compactNav ? ` ${PreferenceApp_default.rootCompact}` : ""}`, children: [
|
|
4611
|
-
/* @__PURE__ */ jsx(
|
|
4612
|
-
PreferenceCategoryList,
|
|
4613
|
-
{
|
|
4614
|
-
activeCategory,
|
|
4615
|
-
onSelect: setActiveCategory,
|
|
4616
|
-
compact: compactNav
|
|
4617
|
-
}
|
|
4618
|
-
),
|
|
4619
|
-
/* @__PURE__ */ jsx("div", { className: PreferenceApp_default.settingsPanel, children: categoriesToShow.map((category) => {
|
|
4620
|
-
const schemas = getVisibleSchemas(category);
|
|
4621
|
-
return /* @__PURE__ */ jsxs(PreferenceSection, { title: category, children: [
|
|
4622
|
-
category === "AI" && /* @__PURE__ */ jsx(AiProviderList, { config, onChange: handleChange }),
|
|
4623
|
-
category === "Voice" && /* @__PURE__ */ jsx(VoiceProviderList, { config, onChange: handleChange }),
|
|
4624
|
-
schemas.map((schema) => /* @__PURE__ */ jsx(
|
|
4625
|
-
PreferenceRow,
|
|
4626
|
-
{
|
|
4627
|
-
schema,
|
|
4628
|
-
value: config[schema.key] ?? schema.default,
|
|
4629
|
-
onChange: handleChange
|
|
4630
|
-
},
|
|
4631
|
-
schema.key
|
|
4632
|
-
))
|
|
4633
|
-
] }, category);
|
|
4634
|
-
}) }),
|
|
4635
|
-
notification && /* @__PURE__ */ jsx("div", { className: PreferenceApp_default.notification, children: notification })
|
|
4636
|
-
] }) });
|
|
4637
|
-
}
|
|
4638
|
-
function activate(ctx) {
|
|
4639
|
-
const root = createRoot(ctx.root);
|
|
4640
|
-
root.render(
|
|
4641
|
-
/* @__PURE__ */ jsx(WindowIdProvider, { windowId: ctx.windowId, children: /* @__PURE__ */ jsx(MiniAppIdProvider, { miniAppId: ctx.miniAppId, children: /* @__PURE__ */ jsx(PreferenceApp, {}) }) })
|
|
4642
|
-
);
|
|
4643
|
-
return {
|
|
4644
|
-
deactivate() {
|
|
4645
|
-
root.unmount();
|
|
4646
|
-
}
|
|
4647
|
-
};
|
|
4648
|
-
}
|
|
4649
|
-
export {
|
|
4650
|
-
activate
|
|
4651
|
-
};
|
|
4652
|
-
//# sourceMappingURL=frontend.js.map
|
|
1680
|
+
`,W=null;function Ht(){return window.__DtMilkdown?Promise.resolve(window.__DtMilkdown):W||(W=new Promise((e,t)=>{let r=document.createElement("script");r.src="/api/ui/milkdown.umd.js",r.async=!0,r.dataset.dtMilkdown="true",r.onload=()=>{if(window.__DtMilkdown){e(window.__DtMilkdown);return}t(new Error("Milkdown runtime loaded without a __DtMilkdown export."))},r.onerror=()=>t(new Error("Failed to load the Milkdown runtime bundle.")),document.head.appendChild(r)}),W)}var Ft=class extends HTMLElement{_runtimeStyle;_surface;_content;_status;_runtime=null;_loadPromise=null;_editor=null;_pendingValue="";_changeTimer=null;_setupToken=0;_suppressNextChange=!1;static get observedAttributes(){return["placeholder","readonly"]}get placeholder(){return this.getAttribute("placeholder")??""}set placeholder(e){this.setAttribute("placeholder",e)}get readonly(){return this.hasAttribute("readonly")}set readonly(e){this.toggleAttribute("readonly",e)}get value(){return this._editor&&(this._pendingValue=this._editor.getMarkdown()),this._pendingValue}set value(e){let t=String(e??"");this._pendingValue=t,this._editor&&this._runtime&&this._editor.getMarkdown()!==t&&(this._suppressNextChange=!0,this._editor.editor.action(this._runtime.replaceAll(t)))}constructor(){super();let e=this.attachShadow({mode:"open"}),t=document.createElement("style");t.textContent=Vt,e.appendChild(t),this._runtimeStyle=document.createElement("style"),e.appendChild(this._runtimeStyle),this._surface=document.createElement("div"),this._surface.className="dt-markdown-editor",this._content=document.createElement("div"),this._content.className="dt-markdown-editor__surface";let r=document.createElement("div");r.className="dt-markdown-editor__content",this._content.appendChild(r),this._status=document.createElement("div"),this._status.className="dt-markdown-editor__status",this._status.textContent="Loading editor",this._surface.append(this._content,this._status),e.appendChild(this._surface)}connectedCallback(){this._initializeEditor()}disconnectedCallback(){this._setupToken+=1,this._clearChangeTimer(),this._destroyEditor()}attributeChangedCallback(e){if(e==="readonly"){this._editor?.setReadonly(this.readonly);return}e==="placeholder"&&this.isConnected&&this._initializeEditor(!0)}async _ensureRuntime(){return this._runtime?this._runtime:(this._loadPromise||(this._loadPromise=Ht().then(e=>(this._runtime=e,this._runtimeStyle.textContent=e.cssText,e))),this._loadPromise)}async _initializeEditor(e=!1){let t=++this._setupToken;if(this._setStatus("Loading editor"),e)await this._destroyEditor();else if(this._editor){this._setStatus(null);return}try{let r=await this._ensureRuntime();if(!this.isConnected||t!==this._setupToken)return;this._content.replaceChildren();let i=document.createElement("div");i.className="dt-markdown-editor__content",this._content.appendChild(i);let n=new r.Crepe({root:i,defaultValue:this._pendingValue,features:{[r.Crepe.Feature.CodeMirror]:!1,[r.Crepe.Feature.ImageBlock]:!1,[r.Crepe.Feature.Latex]:!1},featureConfigs:{[r.Crepe.Feature.Placeholder]:{text:this.placeholder,mode:"doc"}}});if(n.on(a=>{a.markdownUpdated((c,d)=>{if(this._pendingValue=d,this._suppressNextChange){this._suppressNextChange=!1;return}this._queueChange(d)}),a.focus(()=>{this.dispatchEvent(new CustomEvent("dt-focus",{bubbles:!0,composed:!0}))}),a.blur(()=>{this.dispatchEvent(new CustomEvent("dt-blur",{bubbles:!0,composed:!0}))})}),await n.create(),!this.isConnected||t!==this._setupToken){await n.destroy();return}this._editor=n,this._editor.setReadonly(this.readonly),this._pendingValue=this._editor.getMarkdown(),this._setStatus(null)}catch{t===this._setupToken&&this._setStatus("Failed to load editor")}}async _destroyEditor(){let e=this._editor;if(this._editor=null,!!e)try{await e.destroy()}catch{}}_queueChange(e){this._clearChangeTimer(),this._changeTimer=setTimeout(()=>{this._changeTimer=null,this.dispatchEvent(new CustomEvent("dt-change",{bubbles:!0,composed:!0,detail:{value:e}}))},300)}_clearChangeTimer(){this._changeTimer&&(clearTimeout(this._changeTimer),this._changeTimer=null)}_setStatus(e){if(e){this._status.hidden=!1,this._status.textContent=e;return}this._status.hidden=!0}};customElements.get("dt-tooltip")||customElements.define("dt-tooltip",Ie),customElements.get("dt-card")||customElements.define("dt-card",Fe),customElements.get("dt-select")||customElements.define("dt-select",je),customElements.get("dt-grid")||customElements.define("dt-grid",Xe),customElements.get("dt-stack")||customElements.define("dt-stack",Qe),customElements.get("dt-stat")||customElements.define("dt-stat",rt),customElements.get("dt-badge")||customElements.define("dt-badge",st),customElements.get("dt-button")||customElements.define("dt-button",dt),customElements.get("dt-divider")||customElements.define("dt-divider",ut),customElements.get("dt-list-view")||customElements.define("dt-list-view",yt),customElements.get("dt-table-view")||customElements.define("dt-table-view",gt),customElements.get("dt-column")||customElements.define("dt-column",ue),customElements.get("dt-chart")||customElements.define("dt-chart",Pt),customElements.get("dt-markdown")||customElements.define("dt-markdown",It),customElements.get("dt-markdown-editor")||customElements.define("dt-markdown-editor",Ft);var l={root:"PreferenceApp_root",rootCompact:"PreferenceApp_rootCompact",sidebar:"PreferenceApp_sidebar",sidebarHeader:"PreferenceApp_sidebarHeader",categoryItem:"PreferenceApp_categoryItem",categoryItemActive:"PreferenceApp_categoryItem PreferenceApp_categoryItemActive",categoryIcon:"PreferenceApp_categoryIcon",categoryText:"PreferenceApp_categoryText",settingsPanel:"PreferenceApp_settingsPanel",section:"PreferenceApp_section",sectionTitle:"PreferenceApp_sectionTitle",row:"PreferenceApp_row",rowInfo:"PreferenceApp_rowInfo",rowLabel:"PreferenceApp_rowLabel",rowDescription:"PreferenceApp_rowDescription",rowRestartBadge:"PreferenceApp_rowRestartBadge",rowControl:"PreferenceApp_rowControl",providerGroup:"PreferenceApp_providerGroup",providerGroupHeader:"PreferenceApp_providerGroupHeader",providerList:"PreferenceApp_providerList",providerCard:"PreferenceApp_providerCard",providerCardBody:"PreferenceApp_providerCardBody",providerCardHeader:"PreferenceApp_providerCardHeader",providerCardTitleRow:"PreferenceApp_providerCardTitleRow",providerCardTitle:"PreferenceApp_providerCardTitle",providerDefaultBadge:"PreferenceApp_providerDefaultBadge",providerCardActions:"PreferenceApp_providerCardActions",providerActionButtonWrap:"PreferenceApp_providerActionButtonWrap",providerButtonWrap:"PreferenceApp_providerButtonWrap",providerFieldGrid:"PreferenceApp_providerFieldGrid",providerField:"PreferenceApp_providerField",providerFieldLabel:"PreferenceApp_providerFieldLabel",providerSelectWrap:"PreferenceApp_providerSelectWrap",selectWrap:"PreferenceApp_selectWrap",textInput:"PreferenceApp_textInput",numberInput:"PreferenceApp_numberInput",dropdown:"PreferenceApp_dropdown",textInputSensitive:"PreferenceApp_textInput PreferenceApp_textInputSensitive",colorControl:"PreferenceApp_colorControl",colorInput:"PreferenceApp_colorInput",toggle:"PreferenceApp_toggle",toggleInput:"PreferenceApp_toggleInput",toggleTrack:"PreferenceApp_toggleTrack",toggleKnob:"PreferenceApp_toggleKnob",notification:"PreferenceApp_notification",slideUp:"PreferenceApp_slideUp"},V=window.__desktalk_jsx_runtime,o=V.jsx,g=V.jsxs,Vr=V.jsxDEV,Hr=V.Fragment,Dt={General:"\u2699",Server:"\u{1F310}",AI:"\u{1F916}",Voice:"\u{1F399}"};function $t({activeCategory:e,onSelect:t,compact:r=!1}){return g("nav",{className:l.sidebar,children:[o("div",{className:l.sidebarHeader,children:"Settings"}),D.map(i=>{const n=g("button",{className:i===e?l.categoryItemActive:l.categoryItem,onClick:()=>t(i),type:"button","aria-label":r?i:void 0,children:[o("span",{className:l.categoryIcon,children:Dt[i]}),!r&&o("span",{className:l.categoryText,children:i})]},i);return r?o("dt-tooltip",{content:i,placement:"bottom",children:n},i):n})]})}function Ot({config:e,onChange:t}){const r=Z(()=>{const s=ie(e["ai.enabledProviders"]),h=typeof e["ai.defaultProvider"]=="string"&&e["ai.defaultProvider"]?String(e["ai.defaultProvider"]):z;return s.includes(h)||s.unshift(h),s},[e]),i=v(async s=>{const h=s.length>0?s:[z];await t("ai.enabledProviders",we(h)),await t("ai.defaultProvider",h[0])},[t]),n=v(async()=>{const s=P.find(h=>!r.includes(h.id));s&&await i([...r,s.id])},[r,i]),a=v(async(s,h)=>{if(s===h||r.includes(h))return;const p=r.map(f=>f===s?h:f);await i(p)},[r,i]),c=v(async s=>{if(r.length===1)return;const h=r.filter(p=>p!==s);await i(h);for(const p of xe(s))await t(p,"")},[r,t,i]),d=v(async s=>{if(r[0]===s)return;const h=[s,...r.filter(p=>p!==s)];await i(h)},[r,i]);return g("div",{className:l.providerGroup,children:[g("div",{className:l.providerGroupHeader,children:[g("div",{children:[o("div",{className:l.rowLabel,children:"Providers"}),o("div",{className:l.rowDescription,children:"Add providers, keep your default at the top, and remove anything you no longer use."})]}),o("div",{className:l.providerActionButtonWrap,children:o(q,{onPress:n,disabled:r.length>=P.length,variant:"secondary",children:"Add provider"})})]}),o("div",{className:l.providerList,children:r.map((s,h)=>{const p=re(s);if(!p)return null;const f=P.filter(u=>u.id===s||!r.includes(u.id));return o("div",{className:l.providerCard,children:o("dt-card",{variant:"outlined",children:g("div",{className:l.providerCardBody,children:[g("div",{className:l.providerCardHeader,children:[g("div",{className:l.providerCardTitleRow,children:[o("div",{className:l.providerCardTitle,children:p.label}),h===0&&o("span",{className:l.providerDefaultBadge,children:"Default"})]}),g("div",{className:l.providerCardActions,children:[o("div",{className:l.providerButtonWrap,children:o(q,{onPress:()=>d(s),disabled:h===0,variant:"secondary",size:"sm",children:"Set as default"})}),o("div",{className:l.providerButtonWrap,children:o(q,{onPress:()=>c(s),disabled:r.length===1,variant:"danger",size:"sm",children:"Delete"})})]})]}),g("div",{className:l.providerFieldGrid,children:[g("div",{className:l.providerField,children:[o("label",{className:l.providerFieldLabel,htmlFor:`ai-provider-${s}`,children:"Provider"}),o(Bt,{value:s,options:f.map(u=>({value:u.id,label:u.label})),onChange:u=>a(s,u)})]}),p.supportsApiKey&&o(j,{id:`ai-provider-key-${s}`,label:"API Key",value:String(e[`ai.providers.${s}.apiKey`]??""),sensitive:!0,onCommit:u=>t(`ai.providers.${s}.apiKey`,u)}),o(j,{id:`ai-provider-model-${s}`,label:"Model",value:String(e[`ai.providers.${s}.model`]??""),onCommit:u=>t(`ai.providers.${s}.model`,u)}),p.supportsBaseUrl&&o(j,{id:`ai-provider-base-url-${s}`,label:"Base URL",value:String(e[`ai.providers.${s}.baseUrl`]??""),onCommit:u=>t(`ai.providers.${s}.baseUrl`,u)})]})]})})},s)})})]})}function q({children:e,disabled:t=!1,variant:r="primary",size:i="md",onPress:n}){const[a,c]=k(null);return y(()=>{if(!a)return;const d=()=>{n()};return a.addEventListener("click",d),()=>a.removeEventListener("click",d)},[a,n]),o("dt-button",{ref:d=>c(d),disabled:t,variant:r,size:i,children:e})}function Bt({value:e,options:t,disabled:r=!1,onChange:i}){const[n,a]=k(null);return y(()=>{n&&(n.options=t)},[t,n]),y(()=>{n&&(n.value=e)},[n,e]),y(()=>{n&&(n.disabled=r)},[r,n]),y(()=>{if(!n)return;const c=d=>{i(d.detail.value)};return n.addEventListener("dt-change",c),()=>n.removeEventListener("dt-change",c)},[i,n]),o("div",{className:l.providerSelectWrap,children:o("dt-select",{ref:c=>a(c)})})}function j({id:e,label:t,value:r,sensitive:i=!1,onCommit:n}){const[a,c]=k(r);y(()=>{c(r)},[r]);const d=v(()=>{a!==r&&n(a)},[a,n,r]);return g("div",{className:l.providerField,children:[o("label",{className:l.providerFieldLabel,htmlFor:e,children:t}),o("input",{id:e,type:i?"password":"text",className:i?l.textInputSensitive:l.textInput,value:a,onChange:s=>c(s.target.value),onBlur:d,onKeyDown:s=>{s.key==="Enter"&&d()}})]})}function Kt({config:e,onChange:t}){const r=Z(()=>{const s=se(e["voice.enabledProviders"]),h=typeof e["voice.defaultProvider"]=="string"&&e["voice.defaultProvider"]?String(e["voice.defaultProvider"]):C;return s.includes(h)||s.unshift(h),s},[e]),i=v(async s=>{const h=s.length>0?s:[C];await t("voice.enabledProviders",Ae(h)),await t("voice.defaultProvider",h[0])},[t]),n=v(async()=>{const s=M.find(h=>!r.includes(h.id));s&&await i([...r,s.id])},[r,i]),a=v(async(s,h)=>{if(s===h||r.includes(h))return;const p=r.map(f=>f===s?h:f);await i(p)},[r,i]),c=v(async s=>{if(r.length===1)return;const h=r.filter(p=>p!==s);await i(h);for(const p of ke(s))await t(p,"")},[r,t,i]),d=v(async s=>{if(r[0]===s)return;const h=[s,...r.filter(p=>p!==s)];await i(h)},[r,i]);return g("div",{className:l.providerGroup,children:[g("div",{className:l.providerGroupHeader,children:[g("div",{children:[o("div",{className:l.rowLabel,children:"Providers"}),o("div",{className:l.rowDescription,children:"Add STT providers, keep your default at the top, and remove unused items."})]}),o("div",{className:l.providerActionButtonWrap,children:o(G,{onPress:n,disabled:r.length>=M.length,variant:"secondary",children:"Add provider"})})]}),o("div",{className:l.providerList,children:r.map((s,h)=>{const p=ne(s);if(!p)return null;const f=M.filter(u=>u.id===s||!r.includes(u.id));return o("div",{className:l.providerCard,children:o("dt-card",{variant:"outlined",children:g("div",{className:l.providerCardBody,children:[g("div",{className:l.providerCardHeader,children:[g("div",{className:l.providerCardTitleRow,children:[o("div",{className:l.providerCardTitle,children:p.label}),h===0&&o("span",{className:l.providerDefaultBadge,children:"Default"})]}),g("div",{className:l.providerCardActions,children:[o("div",{className:l.providerButtonWrap,children:o(G,{onPress:()=>d(s),disabled:h===0,variant:"secondary",size:"sm",children:"Set as default"})}),o("div",{className:l.providerButtonWrap,children:o(G,{onPress:()=>c(s),disabled:r.length===1,variant:"danger",size:"sm",children:"Delete"})})]})]}),g("div",{className:l.providerFieldGrid,children:[o(Ut,{label:"Provider",value:s,options:f.map(u=>({value:u.id,label:u.label})),onChange:u=>a(s,u)}),p.supportsApiKey&&o(R,{id:`voice-provider-key-${s}`,label:"API Key",value:String(e[`voice.providers.${s}.apiKey`]??""),sensitive:!0,onCommit:u=>t(`voice.providers.${s}.apiKey`,u)}),p.supportsModel&&o(R,{id:`voice-provider-model-${s}`,label:"Model",value:String(e[`voice.providers.${s}.model`]??""),onCommit:u=>t(`voice.providers.${s}.model`,u)}),p.supportsBaseUrl&&o(R,{id:`voice-provider-base-url-${s}`,label:"Base URL",value:String(e[`voice.providers.${s}.baseUrl`]??""),onCommit:u=>t(`voice.providers.${s}.baseUrl`,u)}),p.supportsAzureDeployment&&o(R,{id:`voice-provider-deployment-${s}`,label:"Azure Deployment",value:String(e[`voice.providers.${s}.azureDeployment`]??""),onCommit:u=>t(`voice.providers.${s}.azureDeployment`,u)}),p.supportsAzureApiVersion&&o(R,{id:`voice-provider-api-version-${s}`,label:"Azure API Version",value:String(e[`voice.providers.${s}.azureApiVersion`]??""),onCommit:u=>t(`voice.providers.${s}.azureApiVersion`,u)})]})]})})},s)})})]})}function G({children:e,disabled:t=!1,variant:r="primary",size:i="md",onPress:n}){const[a,c]=k(null);return y(()=>{if(!a)return;const d=()=>{n()};return a.addEventListener("click",d),()=>a.removeEventListener("click",d)},[a,n]),o("dt-button",{ref:d=>c(d),disabled:t,variant:r,size:i,children:e})}function Ut({label:e,value:t,options:r,onChange:i}){const[n,a]=k(null);return y(()=>{n&&(n.options=r)},[r,n]),y(()=>{n&&(n.value=t)},[n,t]),y(()=>{if(!n)return;const c=d=>{i(d.detail.value)};return n.addEventListener("dt-change",c),()=>n.removeEventListener("dt-change",c)},[i,n]),g("div",{className:l.providerField,children:[o("label",{className:l.providerFieldLabel,children:e}),o("div",{className:l.providerSelectWrap,children:o("dt-select",{ref:c=>a(c)})})]})}function R({id:e,label:t,value:r,sensitive:i=!1,onCommit:n}){const[a,c]=k(r);y(()=>{c(r)},[r]);const d=v(()=>{a!==r&&n(a)},[a,n,r]);return g("div",{className:l.providerField,children:[o("label",{className:l.providerFieldLabel,htmlFor:e,children:t}),o("input",{id:e,type:i?"password":"text",className:i?l.textInputSensitive:l.textInput,value:a,onChange:s=>c(s.target.value),onBlur:d,onKeyDown:s=>{s.key==="Enter"&&d()}})]})}function Wt({title:e,children:t}){return g("section",{className:l.section,children:[o("h3",{className:l.sectionTitle,children:e}),t]})}function qt({schema:e,value:t,onChange:r}){return g("div",{className:l.row,children:[g("div",{className:l.rowInfo,children:[g("div",{className:l.rowLabel,children:[e.label,e.requiresRestart&&o("span",{className:l.rowRestartBadge,children:"restart"})]}),o("div",{className:l.rowDescription,children:e.description})]}),o("div",{className:l.rowControl,children:o(jt,{schema:e,value:t,onChange:r})})]})}function jt({schema:e,value:t,onChange:r}){return e.key==="general.accentColor"&&e.type==="string"?o(Yt,{schema:e,value:t,onChange:r}):e.type==="boolean"?o(Xt,{schema:e,value:t,onChange:r}):e.type==="string"&&e.options?o(Zt,{schema:e,value:t,onChange:r}):e.type==="string"?o(Qt,{schema:e,value:t,onChange:r}):e.type==="number"?o(er,{schema:e,value:t,onChange:r}):null}function Gt(e){return/^#(?:[0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(e)}function Yt({schema:e,value:t,onChange:r}){const[i,n]=k(t);y(()=>{n(t)},[t]);const a=v(u=>{const w=(u??i).trim();w!==t&&r(e.key,w)},[i,r,e.key,t]),c=v(u=>{n(u.currentTarget.value)},[]),d=v(u=>{const w=u.target.value;n(w),a(w)},[a]),s=v(u=>{n(u.target.value)},[]),h=v(u=>{u.key==="Enter"&&a()},[a]),p=v(()=>{a()},[a]),f=Gt(i)?i:"#7c6ff7";return g("div",{className:l.colorControl,children:[o("input",{type:"color",className:l.colorInput,value:f,onInput:c,onChange:d,"aria-label":`${e.label} picker`}),o("input",{type:"text",className:l.textInput,value:i,onChange:s,onBlur:p,onKeyDown:h,placeholder:"#7c6ff7"})]})}function Xt({schema:e,value:t,onChange:r}){const i=v(()=>{r(e.key,!t)},[e.key,t,r]);return g("label",{className:l.toggle,children:[o("input",{type:"checkbox",className:l.toggleInput,checked:t,onChange:i}),o("span",{className:l.toggleTrack}),o("span",{className:l.toggleKnob})]})}function Zt({schema:e,value:t,onChange:r}){const i=v(n=>{r(e.key,n)},[e.key,r]);return o(Jt,{value:t,options:(e.options??[]).map(n=>({value:n,label:n})),onChange:i})}function Jt({value:e,options:t,disabled:r=!1,onChange:i}){const[n,a]=k(null);return y(()=>{n&&(n.options=t)},[t,n]),y(()=>{n&&(n.value=e,n.disabled=r)},[r,n,e]),y(()=>{if(!n)return;const c=d=>{i(d.detail.value)};return n.addEventListener("dt-change",c),()=>n.removeEventListener("dt-change",c)},[i,n]),o("div",{className:l.selectWrap,children:o("dt-select",{ref:c=>a(c)})})}function Qt({schema:e,value:t,onChange:r}){const[i,n]=k(t);y(()=>{n(t)},[t]);const a=v(()=>{i!==t&&r(e.key,i)},[e.key,i,t,r]),c=v(d=>{d.key==="Enter"&&r(e.key,i)},[e.key,i,r]);return o("input",{type:e.sensitive?"password":"text",className:e.sensitive?l.textInputSensitive:l.textInput,value:i,onChange:d=>n(d.target.value),onBlur:a,onKeyDown:c,placeholder:e.sensitive?"Enter API key...":void 0})}function er({schema:e,value:t,onChange:r}){const[i,n]=k(String(t));y(()=>{n(String(t))},[t]);const a=v(()=>{let d=Number(i);if(Number.isNaN(d)){n(String(t));return}e.min!==void 0&&(d=Math.max(e.min,d)),e.max!==void 0&&(d=Math.min(e.max,d)),n(String(d)),d!==t&&r(e.key,d)},[e.key,e.min,e.max,i,t,r]),c=v(d=>{d.key==="Enter"&&a()},[a]);return o("input",{type:"number",className:l.numberInput,value:i,min:e.min,max:e.max,onChange:d=>n(d.target.value),onBlur:a,onKeyDown:c})}import{ActionsProvider as tr,Action as H,useCommand as F}from"@desktalk/sdk";function rr({children:e,onConfigChanged:t}){const r=F("preferences.get"),i=F("preferences.set"),n=F("preferences.reset"),a=F("preferences.resetAll"),c=v(async p=>{const f=p?.key;if(!f)throw new Error("Missing required parameter: key");return await r({key:f})},[r]),d=v(async p=>{const f=p?.key;if(!f)throw new Error("Missing required parameter: key");let u=p?.value;if(u===void 0)throw new Error("Missing required parameter: value");const w=Me(f);return w&&(w.type==="number"&&typeof u=="string"?u=Number(u):w.type==="boolean"&&typeof u=="string"&&(u=u==="true")),await i({key:f,value:u}),t(),{success:!0}},[i,t]),s=v(async p=>{const f=p?.key;if(!f)throw new Error("Missing required parameter: key");return await n({key:f}),t(),{success:!0}},[n,t]),h=v(async()=>(await a(),t(),{success:!0}),[a,t]);return g(tr,{children:[o(H,{name:"Get Setting",description:"Read the current value of a setting",params:{key:{type:"string",description:"Setting key (e.g. general.theme)",required:!0}},handler:c}),o(H,{name:"Set Setting",description:"Update a setting value",params:{key:{type:"string",description:"Setting key (e.g. general.theme)",required:!0},value:{type:"string",description:"New value for the setting",required:!0}},handler:d}),o(H,{name:"Reset Setting",description:"Reset a setting to its default value",params:{key:{type:"string",description:"Setting key to reset",required:!0}},handler:s}),o(H,{name:"Reset All",description:"Reset all settings to their default values",handler:h}),e]})}var ir=720;function nr(){const[e,t]=k(Pe()),[r,i]=k(D[0]),[n,a]=k(null),[c,d]=k(!1),s=J(null),h=J(null),p=ee("preferences.getAll"),f=ee("preferences.set"),u=v(async()=>{try{const b=await p();t(b)}catch(b){console.error("Failed to load preferences:",b)}},[p]);y(()=>{u()},[u]),y(()=>{if(!h.current)return;const b=_=>{d(_<=ir)};b(h.current.clientWidth);const x=new ResizeObserver(_=>{const Y=_[0];Y&&b(Y.contentRect.width)});return x.observe(h.current),()=>x.disconnect()},[]),te("preferences:changed",b=>{t(x=>({...x,[b.key]:b.value})),b.requiresRestart&&w(X({scope:"preference",key:"notifications.restartRequired",defaultText:"This change requires a restart to take effect."}))}),te("preferences:resetAll",()=>{u(),w(X({scope:"preference",key:"notifications.resetAll",defaultText:"All settings have been reset to defaults."}))});const w=v(b=>{a(b),s.current&&clearTimeout(s.current),s.current=setTimeout(()=>a(null),4e3)},[]),S=v(async(b,x)=>{t(_=>({..._,[b]:x}));try{await f({key:b,value:x})}catch(_){console.error(`Failed to update ${b}:`,_),u()}},[f,u]),A=D.filter(b=>b===r),T=v(b=>{const x=Ne(b);return b!=="AI"&&b!=="Voice"?x:x.filter(_=>b==="AI"?!_.key.startsWith("ai.providers.")&&_.key!=="ai.defaultProvider"&&_.key!=="ai.enabledProviders":!_.key.startsWith("voice.providers.")&&_.key!=="voice.defaultProvider"&&_.key!=="voice.enabledProviders")},[]);return o(rr,{onConfigChanged:u,children:g("div",{ref:h,className:`${l.root}${c?` ${l.rootCompact}`:""}`,children:[o($t,{activeCategory:r,onSelect:i,compact:c}),o("div",{className:l.settingsPanel,children:A.map(b=>{const x=T(b);return g(Wt,{title:b,children:[b==="AI"&&o(Ot,{config:e,onChange:S}),b==="Voice"&&o(Kt,{config:e,onChange:S}),x.map(_=>o(qt,{schema:_,value:e[_.key]??_.default,onChange:S},_.key))]},b)})}),n&&o("div",{className:l.notification,children:n})]})})}function sr(e){const t=be(e.root);return t.render(o(fe,{windowId:e.windowId,children:o(ge,{miniAppId:e.miniAppId,children:o(nr,{})})})),{deactivate(){t.unmount()}}}export{sr as activate};
|
|
1681
|
+
(() => {
|
|
1682
|
+
if (typeof document === 'undefined') return;
|
|
1683
|
+
const styleId = "desktalk-style-desktalk-miniapp-preference-19q4gw2";
|
|
1684
|
+
if (document.getElementById(styleId)) return;
|
|
1685
|
+
const style = document.createElement('style');
|
|
1686
|
+
style.id = styleId;
|
|
1687
|
+
style.textContent = "/* src/styles/PreferenceApp.module.css */\n.PreferenceApp_root {\n display: flex;\n height: 100%;\n overflow: hidden;\n background: var(--dt-window-body);\n color: var(--dt-text);\n font-family: var(--font-ui, \"Work Sans\", system-ui, -apple-system, sans-serif);\n}\n.PreferenceApp_rootCompact {\n flex-direction: column;\n}\n.PreferenceApp_sidebar {\n width: 180px;\n min-width: 180px;\n display: flex;\n flex-direction: column;\n align-self: stretch;\n overflow-y: auto;\n padding: 8px 0;\n border-right: 1px solid var(--dt-border);\n}\n.PreferenceApp_sidebarHeader {\n padding: 12px 16px 8px;\n color: var(--dt-text-muted);\n font-size: 11px;\n font-weight: 600;\n font-family: var(--font-display, \"Sora\", system-ui, -apple-system, sans-serif);\n letter-spacing: 0.05em;\n text-transform: uppercase;\n}\n.PreferenceApp_categoryItem {\n display: flex;\n width: 100%;\n align-items: center;\n gap: 8px;\n padding: 8px 16px;\n border: none;\n background: none;\n color: var(--dt-text);\n cursor: pointer;\n font-family: inherit;\n font-size: 13px;\n text-align: left;\n transition: background 0.1s;\n}\n.PreferenceApp_categoryItem:hover {\n background: var(--dt-surface-hover);\n}\n.PreferenceApp_categoryItemActive {\n background: var(--dt-surface);\n border-left: 3px solid var(--dt-accent);\n color: var(--dt-accent);\n font-weight: 500;\n padding-left: 13px;\n}\n.PreferenceApp_categoryIcon {\n width: 20px;\n font-size: 15px;\n text-align: center;\n}\n.PreferenceApp_categoryText {\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.PreferenceApp_settingsPanel {\n flex: 1;\n min-width: 0;\n overflow-y: auto;\n padding: 0;\n}\n.PreferenceApp_section {\n padding: 20px 24px 8px;\n}\n.PreferenceApp_sectionTitle {\n margin-bottom: 4px;\n padding-bottom: 8px;\n border-bottom: 1px solid var(--dt-border);\n color: var(--dt-text-muted);\n font-size: 13px;\n font-weight: 600;\n font-family: var(--font-display, \"Sora\", system-ui, -apple-system, sans-serif);\n letter-spacing: 0.04em;\n text-transform: uppercase;\n}\n.PreferenceApp_row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n padding: 12px 0;\n border-bottom: 1px solid var(--dt-border-subtle);\n}\n.PreferenceApp_row:last-child {\n border-bottom: none;\n}\n.PreferenceApp_rowInfo {\n flex: 1;\n min-width: 0;\n}\n.PreferenceApp_rowLabel {\n margin-bottom: 2px;\n font-size: 14px;\n font-weight: 500;\n font-family: var(--font-ui, \"Work Sans\", system-ui, -apple-system, sans-serif);\n}\n.PreferenceApp_rowDescription {\n color: var(--dt-text-muted);\n font-size: 12px;\n line-height: 1.4;\n}\n.PreferenceApp_rowRestartBadge {\n display: inline-block;\n margin-left: 6px;\n padding: 1px 5px;\n border-radius: 3px;\n background: var(--dt-warning-subtle);\n color: var(--dt-warning);\n font-size: 10px;\n font-weight: 600;\n letter-spacing: 0.03em;\n text-transform: uppercase;\n}\n.PreferenceApp_rowControl {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 8px;\n}\n.PreferenceApp_providerGroup {\n display: flex;\n flex-direction: column;\n gap: 12px;\n padding: 12px 0 18px;\n border-bottom: 1px solid var(--dt-border-subtle);\n}\n.PreferenceApp_providerGroupHeader {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 12px;\n}\n.PreferenceApp_providerList {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n.PreferenceApp_providerCard {\n margin: 0;\n}\n.PreferenceApp_providerCard dt-card {\n display: block;\n margin: 0;\n}\n.PreferenceApp_providerCardBody {\n display: flex;\n flex-direction: column;\n gap: 14px;\n}\n.PreferenceApp_providerCardHeader {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 12px;\n}\n.PreferenceApp_providerCardTitleRow {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.PreferenceApp_providerCardTitle {\n font-size: 14px;\n font-weight: 600;\n font-family: var(--font-display, \"Sora\", system-ui, -apple-system, sans-serif);\n letter-spacing: -0.01em;\n}\n.PreferenceApp_providerDefaultBadge {\n display: inline-flex;\n align-items: center;\n padding: 2px 8px;\n border-radius: 999px;\n background: var(--dt-accent-ghost);\n color: var(--dt-accent);\n font-size: 11px;\n font-weight: 600;\n}\n.PreferenceApp_providerCardActions {\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-end;\n gap: 8px;\n}\n.PreferenceApp_providerActionButtonWrap,\n.PreferenceApp_providerButtonWrap {\n display: inline-flex;\n}\n.PreferenceApp_providerActionButtonWrap dt-button,\n.PreferenceApp_providerButtonWrap dt-button {\n display: inline-flex;\n}\n.PreferenceApp_providerFieldGrid {\n display: grid;\n grid-template-columns: repeat(2, minmax(0, 1fr));\n gap: 12px;\n}\n.PreferenceApp_providerField {\n display: flex;\n min-width: 0;\n flex-direction: column;\n gap: 6px;\n}\n.PreferenceApp_providerFieldLabel {\n color: var(--dt-text-muted);\n font-size: 11px;\n font-weight: 600;\n font-family: var(--font-display, \"Sora\", system-ui, -apple-system, sans-serif);\n letter-spacing: 0.04em;\n text-transform: uppercase;\n}\n.PreferenceApp_providerSelectWrap {\n width: 100%;\n}\n.PreferenceApp_providerSelectWrap dt-select {\n display: block;\n width: 100%;\n}\n.PreferenceApp_selectWrap {\n min-width: 120px;\n}\n.PreferenceApp_selectWrap dt-select {\n display: block;\n min-width: 120px;\n}\n.PreferenceApp_textInput,\n.PreferenceApp_numberInput,\n.PreferenceApp_dropdown {\n padding: 6px 10px;\n border: 1px solid var(--dt-border);\n border-radius: 6px;\n background: var(--dt-surface);\n color: var(--dt-text);\n font-family: var(--font-ui, \"Work Sans\", system-ui, -apple-system, sans-serif);\n font-size: 13px;\n outline: none;\n transition:\n border-color 0.15s,\n box-shadow 0.15s,\n background 0.15s;\n}\n.PreferenceApp_textInput:focus,\n.PreferenceApp_numberInput:focus,\n.PreferenceApp_dropdown:focus {\n border-color: var(--dt-accent);\n box-shadow: 0 0 0 3px var(--dt-accent-ghost);\n}\n.PreferenceApp_textInput {\n width: 220px;\n}\n.PreferenceApp_textInput::placeholder {\n color: var(--dt-text-muted);\n}\n.PreferenceApp_textInputSensitive {\n font-family: var(--font-mono);\n letter-spacing: 0.05em;\n}\n.PreferenceApp_numberInput {\n width: 100px;\n -moz-appearance: textfield;\n}\n.PreferenceApp_numberInput::-webkit-inner-spin-button,\n.PreferenceApp_numberInput::-webkit-outer-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n.PreferenceApp_dropdown {\n min-width: 120px;\n cursor: pointer;\n}\n.PreferenceApp_colorControl {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.PreferenceApp_colorInput {\n width: 40px;\n height: 36px;\n padding: 2px;\n border: 1px solid var(--dt-border);\n border-radius: 8px;\n background: var(--dt-surface);\n cursor: pointer;\n}\n.PreferenceApp_toggle {\n position: relative;\n width: 42px;\n height: 24px;\n flex-shrink: 0;\n cursor: pointer;\n}\n.PreferenceApp_toggleInput {\n position: absolute;\n width: 0;\n height: 0;\n opacity: 0;\n}\n.PreferenceApp_toggleTrack {\n position: absolute;\n inset: 0;\n border: 1px solid var(--dt-border);\n border-radius: 12px;\n background: var(--dt-surface);\n transition: background 0.2s, border-color 0.2s;\n}\n.PreferenceApp_toggleInput:checked + .PreferenceApp_toggleTrack {\n border-color: var(--dt-accent);\n background: var(--dt-accent);\n}\n.PreferenceApp_toggleKnob {\n position: absolute;\n top: 3px;\n left: 3px;\n width: 18px;\n height: 18px;\n border-radius: 50%;\n background: var(--dt-text-on-accent);\n transition: transform 0.2s;\n pointer-events: none;\n}\n.PreferenceApp_toggleInput:checked ~ .PreferenceApp_toggleKnob {\n transform: translateX(18px);\n}\n.PreferenceApp_notification {\n position: fixed;\n bottom: 80px;\n left: 50%;\n z-index: 1000;\n padding: 10px 20px;\n border: 1px solid color-mix(in oklab, var(--dt-warning) 40%, var(--dt-border));\n border-radius: 8px;\n background: color-mix(in oklab, var(--dt-warning) 20%, var(--dt-surface));\n box-shadow: 0 14px 28px var(--dt-shadow-color);\n color: var(--dt-text);\n font-size: 13px;\n font-weight: 500;\n transform: translateX(-50%);\n animation: PreferenceApp_slideUp 0.3s ease-out;\n}\n.PreferenceApp_rootCompact .PreferenceApp_sidebar {\n width: 100%;\n min-width: 0;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n overflow-x: auto;\n overflow-y: visible;\n padding: 10px 12px;\n border-right: none;\n border-bottom: 1px solid var(--dt-border);\n background: color-mix(in oklab, var(--dt-surface) 72%, transparent);\n}\n.PreferenceApp_rootCompact .PreferenceApp_sidebarHeader {\n flex: 0 0 auto;\n padding: 0 10px 0 0;\n border-right: 1px solid var(--dt-border-subtle);\n white-space: nowrap;\n}\n.PreferenceApp_rootCompact .PreferenceApp_categoryItem,\n.PreferenceApp_rootCompact .PreferenceApp_categoryItemActive {\n position: relative;\n width: 40px;\n min-width: 40px;\n height: 40px;\n justify-content: center;\n gap: 0;\n padding: 0;\n border: 1px solid transparent;\n border-radius: 10px;\n flex-shrink: 0;\n}\n.PreferenceApp_rootCompact .PreferenceApp_categoryItemActive {\n border-left: 1px solid color-mix(in oklab, var(--dt-accent) 45%, var(--dt-border));\n background: color-mix(in oklab, var(--dt-accent) 12%, var(--dt-surface));\n box-shadow: 0 0 0 1px var(--dt-accent-ghost) inset;\n padding-left: 0;\n}\n.PreferenceApp_rootCompact .PreferenceApp_settingsPanel {\n padding-bottom: 12px;\n}\n.PreferenceApp_rootCompact .PreferenceApp_section {\n padding: 16px 16px 8px;\n}\n.PreferenceApp_rootCompact .PreferenceApp_row {\n align-items: stretch;\n flex-direction: column;\n gap: 12px;\n}\n.PreferenceApp_rootCompact .PreferenceApp_rowControl {\n width: 100%;\n min-width: 0;\n}\n.PreferenceApp_rootCompact .PreferenceApp_providerGroupHeader,\n.PreferenceApp_rootCompact .PreferenceApp_providerCardHeader {\n flex-direction: column;\n}\n.PreferenceApp_rootCompact .PreferenceApp_providerCardActions {\n justify-content: flex-start;\n}\n.PreferenceApp_rootCompact .PreferenceApp_providerActionButtonWrap,\n.PreferenceApp_rootCompact .PreferenceApp_providerButtonWrap {\n width: 100%;\n}\n.PreferenceApp_rootCompact .PreferenceApp_providerFieldGrid {\n grid-template-columns: 1fr;\n}\n.PreferenceApp_rootCompact .PreferenceApp_textInput,\n.PreferenceApp_rootCompact .PreferenceApp_textInputSensitive,\n.PreferenceApp_rootCompact .PreferenceApp_numberInput,\n.PreferenceApp_rootCompact .PreferenceApp_dropdown,\n.PreferenceApp_rootCompact .PreferenceApp_providerActionButtonWrap dt-button,\n.PreferenceApp_rootCompact .PreferenceApp_providerButtonWrap dt-button {\n width: 100%;\n min-width: 0;\n}\n.PreferenceApp_rootCompact .PreferenceApp_colorControl {\n width: 100%;\n}\n.PreferenceApp_rootCompact .PreferenceApp_colorInput {\n flex: 0 0 44px;\n}\n@keyframes PreferenceApp_slideUp {\n from {\n opacity: 0;\n transform: translateX(-50%) translateY(10px);\n }\n to {\n opacity: 1;\n transform: translateX(-50%) translateY(0);\n }\n}\n/*# sourceMappingURL=frontend.css.map */\n";
|
|
1688
|
+
document.head.appendChild(style);
|
|
1689
|
+
})();
|