@desktalk/miniapp-note 0.1.0-alpha.1 → 0.1.0-alpha.3
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 +39 -2137
- package/dist/frontend.js.map +3 -3
- package/package.json +6 -6
package/dist/frontend.js
CHANGED
|
@@ -1,149 +1,4 @@
|
|
|
1
|
-
(() => {
|
|
2
|
-
if (typeof document === 'undefined') return;
|
|
3
|
-
const styleId = "desktalk-style-desktalk-miniapp-note-emi3yz";
|
|
4
|
-
if (document.getElementById(styleId)) return;
|
|
5
|
-
const style = document.createElement('style');
|
|
6
|
-
style.id = styleId;
|
|
7
|
-
style.textContent = "/* src/styles/NoteApp.module.css */\n.NoteApp_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-sans);\n}\n.NoteApp_rootCompact {\n flex-direction: column;\n}\n.NoteApp_rootCompact .NoteApp_listPanel {\n width: 100%;\n min-width: 0;\n max-height: 180px;\n flex-direction: row;\n border-right: none;\n border-bottom: 1px solid var(--dt-border);\n}\n.NoteApp_rootCompact .NoteApp_listHeader {\n width: 140px;\n min-width: 140px;\n flex-direction: column;\n padding: 10px;\n gap: 8px;\n border-bottom: none;\n border-right: 1px solid var(--dt-border-subtle);\n}\n.NoteApp_rootCompact .NoteApp_searchInput {\n width: 100%;\n}\n.NoteApp_rootCompact .NoteApp_newNoteBtn {\n width: 100%;\n}\n.NoteApp_rootCompact .NoteApp_noteList {\n flex: 1;\n overflow-x: auto;\n overflow-y: hidden;\n display: flex;\n padding: 8px;\n gap: 8px;\n}\n.NoteApp_rootCompact .NoteApp_noteItem,\n.NoteApp_rootCompact .NoteApp_noteItemActive {\n min-width: 160px;\n max-width: 200px;\n flex-shrink: 0;\n border-bottom: none;\n border-radius: 6px;\n background: var(--dt-surface);\n}\n.NoteApp_rootCompact .NoteApp_noteItemActive {\n border-left: none;\n padding-left: 10px;\n border: 1px solid var(--dt-accent);\n background: color-mix(in oklab, var(--dt-accent) 8%, var(--dt-surface));\n}\n.NoteApp_rootCompact .NoteApp_emptyState {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n}\n.NoteApp_listPanel {\n display: flex;\n width: 260px;\n min-width: 200px;\n flex-direction: column;\n overflow: hidden;\n border-right: 1px solid var(--dt-border);\n}\n.NoteApp_listHeader {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 10px 14px;\n border-bottom: 1px solid var(--dt-border);\n}\n.NoteApp_searchInput {\n flex: 1;\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: inherit;\n font-size: 13px;\n outline: none;\n transition: border-color 0.15s;\n}\n.NoteApp_searchInput::placeholder {\n color: var(--dt-text-muted);\n}\n.NoteApp_searchInput:focus {\n border-color: var(--dt-accent);\n}\n.NoteApp_newNoteBtn {\n display: flex;\n width: 30px;\n height: 30px;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n border: 1px solid var(--dt-border);\n border-radius: 6px;\n background: var(--dt-surface);\n color: var(--dt-text);\n cursor: pointer;\n font-size: 18px;\n line-height: 1;\n transition:\n background 0.15s,\n border-color 0.15s,\n color 0.15s;\n}\n.NoteApp_newNoteBtn:hover {\n border-color: var(--dt-accent);\n background: var(--dt-surface-hover);\n color: var(--dt-accent);\n}\n.NoteApp_noteList {\n flex: 1;\n overflow-y: auto;\n}\n.NoteApp_noteItem {\n padding: 10px 14px;\n border-bottom: 1px solid var(--dt-border);\n cursor: pointer;\n transition: background 0.1s;\n}\n.NoteApp_noteItem:hover {\n background: var(--dt-surface-hover);\n}\n.NoteApp_noteItemActive {\n padding-left: 11px;\n border-left: 3px solid var(--dt-accent);\n background: var(--dt-surface);\n}\n.NoteApp_noteTitle {\n overflow: hidden;\n margin-bottom: 4px;\n font-size: 14px;\n font-weight: 500;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.NoteApp_notePreview {\n overflow: hidden;\n margin-bottom: 4px;\n color: var(--dt-text-muted);\n font-size: 12px;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.NoteApp_noteDate {\n color: var(--dt-text-muted);\n opacity: 0.7;\n font-size: 11px;\n}\n.NoteApp_emptyState {\n padding: 24px 14px;\n color: var(--dt-text-muted);\n font-size: 13px;\n text-align: center;\n}\n.NoteApp_editorPanel {\n display: flex;\n min-width: 0;\n flex: 1;\n flex-direction: column;\n overflow: hidden;\n}\n.NoteApp_editorHeader {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: space-between;\n padding: 10px 16px;\n border-bottom: 1px solid var(--dt-border);\n}\n.NoteApp_editorTitle {\n font-size: 16px;\n font-weight: 600;\n}\n.NoteApp_editorTags {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n}\n.NoteApp_editorTag {\n padding: 2px 8px;\n border: 1px solid var(--dt-border);\n border-radius: 4px;\n background: var(--dt-surface);\n color: var(--dt-accent);\n font-size: 11px;\n}\n.NoteApp_editorBody {\n position: relative;\n flex: 1;\n overflow-y: auto;\n}\n.NoteApp_editorPlaceholder {\n display: flex;\n height: 100%;\n align-items: center;\n justify-content: center;\n color: var(--dt-text-muted);\n font-size: 14px;\n}\n.NoteApp_editorBody .milkdown {\n height: 100%;\n background: transparent;\n color: var(--dt-text);\n}\n.NoteApp_editorBody .milkdown .editor {\n min-height: 100%;\n padding: 16px 20px;\n outline: none;\n font-family: var(--font-sans);\n font-size: 14px;\n line-height: 1.65;\n}\n.NoteApp_editorBody .milkdown .editor h1 {\n margin: 0.8em 0 0.4em;\n font-size: 1.6em;\n}\n.NoteApp_editorBody .milkdown .editor h2 {\n margin: 0.7em 0 0.35em;\n font-size: 1.35em;\n}\n.NoteApp_editorBody .milkdown .editor h3 {\n margin: 0.6em 0 0.3em;\n font-size: 1.15em;\n}\n.NoteApp_editorBody .milkdown .editor p {\n margin: 0.5em 0;\n}\n.NoteApp_editorBody .milkdown .editor code {\n padding: 2px 5px;\n border-radius: 3px;\n background: var(--dt-surface);\n font-family: var(--font-mono);\n font-size: 0.9em;\n}\n.NoteApp_editorBody .milkdown .editor pre {\n overflow-x: auto;\n margin: 0.8em 0;\n padding: 12px 16px;\n border: 1px solid var(--dt-border);\n border-radius: 6px;\n background: var(--dt-surface);\n}\n.NoteApp_editorBody .milkdown .editor pre code {\n padding: 0;\n border-radius: 0;\n background: transparent;\n}\n.NoteApp_editorBody .milkdown .editor blockquote {\n margin: 0.8em 0;\n padding-left: 14px;\n border-left: 3px solid var(--dt-accent);\n color: var(--dt-text-muted);\n}\n.NoteApp_editorBody .milkdown .editor a {\n color: var(--dt-accent);\n text-decoration: none;\n}\n.NoteApp_editorBody .milkdown .editor a:hover {\n text-decoration: underline;\n}\n.NoteApp_editorBody .milkdown .editor hr {\n margin: 1.5em 0;\n border: none;\n border-top: 1px solid var(--dt-border);\n}\n.NoteApp_editorBody .milkdown .editor ul,\n.NoteApp_editorBody .milkdown .editor ol {\n margin: 0.5em 0;\n padding-left: 24px;\n}\n.NoteApp_editorBody .milkdown .editor li {\n margin: 0.2em 0;\n}\n.NoteApp_editorBody .milkdown .editor img {\n max-width: 100%;\n border-radius: 6px;\n}\n.NoteApp_editorBody dt-markdown-editor {\n display: block;\n height: 100%;\n}\n.NoteApp_saveStatus {\n color: var(--dt-text-muted);\n opacity: 0.7;\n font-size: 11px;\n}\n.NoteApp_saveStatusSaving {\n color: var(--dt-warning);\n}\n/*# sourceMappingURL=frontend.css.map */\n";
|
|
8
|
-
document.head.appendChild(style);
|
|
9
|
-
})();
|
|
10
|
-
|
|
11
|
-
// desktalk-global:react
|
|
12
|
-
var _mod = window.React;
|
|
13
|
-
var Children = _mod.Children;
|
|
14
|
-
var Component = _mod.Component;
|
|
15
|
-
var Fragment = _mod.Fragment;
|
|
16
|
-
var Profiler = _mod.Profiler;
|
|
17
|
-
var PureComponent = _mod.PureComponent;
|
|
18
|
-
var StrictMode = _mod.StrictMode;
|
|
19
|
-
var Suspense = _mod.Suspense;
|
|
20
|
-
var cloneElement = _mod.cloneElement;
|
|
21
|
-
var createContext = _mod.createContext;
|
|
22
|
-
var createElement = _mod.createElement;
|
|
23
|
-
var createRef = _mod.createRef;
|
|
24
|
-
var forwardRef = _mod.forwardRef;
|
|
25
|
-
var isValidElement = _mod.isValidElement;
|
|
26
|
-
var lazy = _mod.lazy;
|
|
27
|
-
var memo = _mod.memo;
|
|
28
|
-
var startTransition = _mod.startTransition;
|
|
29
|
-
var useCallback = _mod.useCallback;
|
|
30
|
-
var useContext = _mod.useContext;
|
|
31
|
-
var useDebugValue = _mod.useDebugValue;
|
|
32
|
-
var useDeferredValue = _mod.useDeferredValue;
|
|
33
|
-
var useEffect = _mod.useEffect;
|
|
34
|
-
var useId = _mod.useId;
|
|
35
|
-
var useImperativeHandle = _mod.useImperativeHandle;
|
|
36
|
-
var useInsertionEffect = _mod.useInsertionEffect;
|
|
37
|
-
var useLayoutEffect = _mod.useLayoutEffect;
|
|
38
|
-
var useMemo = _mod.useMemo;
|
|
39
|
-
var useReducer = _mod.useReducer;
|
|
40
|
-
var useRef = _mod.useRef;
|
|
41
|
-
var useState = _mod.useState;
|
|
42
|
-
var useSyncExternalStore = _mod.useSyncExternalStore;
|
|
43
|
-
var useTransition = _mod.useTransition;
|
|
44
|
-
var version = _mod.version;
|
|
45
|
-
|
|
46
|
-
// desktalk-global:react-dom/client
|
|
47
|
-
var _mod2 = window.ReactDOM;
|
|
48
|
-
var createRoot = _mod2.createRoot;
|
|
49
|
-
var hydrateRoot = _mod2.hydrateRoot;
|
|
50
|
-
|
|
51
|
-
// src/frontend.tsx
|
|
52
|
-
import { useCommand as useCommand2, MiniAppIdProvider, WindowIdProvider } from "@desktalk/sdk";
|
|
53
|
-
|
|
54
|
-
// src/styles/NoteApp.module.css
|
|
55
|
-
var NoteApp_default = {
|
|
56
|
-
root: "NoteApp_root",
|
|
57
|
-
rootCompact: "NoteApp_rootCompact",
|
|
58
|
-
listPanel: "NoteApp_listPanel",
|
|
59
|
-
listHeader: "NoteApp_listHeader",
|
|
60
|
-
searchInput: "NoteApp_searchInput",
|
|
61
|
-
newNoteBtn: "NoteApp_newNoteBtn",
|
|
62
|
-
noteList: "NoteApp_noteList",
|
|
63
|
-
noteItem: "NoteApp_noteItem",
|
|
64
|
-
noteItemActive: "NoteApp_noteItem NoteApp_noteItemActive",
|
|
65
|
-
emptyState: "NoteApp_emptyState",
|
|
66
|
-
noteTitle: "NoteApp_noteTitle",
|
|
67
|
-
notePreview: "NoteApp_notePreview",
|
|
68
|
-
noteDate: "NoteApp_noteDate",
|
|
69
|
-
editorPanel: "NoteApp_editorPanel",
|
|
70
|
-
editorHeader: "NoteApp_editorHeader",
|
|
71
|
-
editorTitle: "NoteApp_editorTitle",
|
|
72
|
-
editorTags: "NoteApp_editorTags",
|
|
73
|
-
editorTag: "NoteApp_editorTag",
|
|
74
|
-
editorBody: "NoteApp_editorBody",
|
|
75
|
-
editorPlaceholder: "NoteApp_editorPlaceholder",
|
|
76
|
-
saveStatus: "NoteApp_saveStatus",
|
|
77
|
-
saveStatusSaving: "NoteApp_saveStatus NoteApp_saveStatusSaving"
|
|
78
|
-
};
|
|
79
|
-
|
|
80
|
-
// desktalk-global:react/jsx-runtime
|
|
81
|
-
var _mod3 = window.__desktalk_jsx_runtime;
|
|
82
|
-
var jsx = _mod3.jsx;
|
|
83
|
-
var jsxs = _mod3.jsxs;
|
|
84
|
-
var jsxDEV = _mod3.jsxDEV;
|
|
85
|
-
var Fragment2 = _mod3.Fragment;
|
|
86
|
-
|
|
87
|
-
// src/components/NoteList.tsx
|
|
88
|
-
function formatDate(iso) {
|
|
89
|
-
try {
|
|
90
|
-
const d = new Date(iso);
|
|
91
|
-
const now = /* @__PURE__ */ new Date();
|
|
92
|
-
const diffMs = now.getTime() - d.getTime();
|
|
93
|
-
const diffMins = Math.floor(diffMs / 6e4);
|
|
94
|
-
if (diffMins < 1) return "just now";
|
|
95
|
-
if (diffMins < 60) return `${diffMins}m ago`;
|
|
96
|
-
const diffHours = Math.floor(diffMins / 60);
|
|
97
|
-
if (diffHours < 24) return `${diffHours}h ago`;
|
|
98
|
-
const diffDays = Math.floor(diffHours / 24);
|
|
99
|
-
if (diffDays < 7) return `${diffDays}d ago`;
|
|
100
|
-
return d.toLocaleDateString(void 0, { month: "short", day: "numeric" });
|
|
101
|
-
} catch {
|
|
102
|
-
return "";
|
|
103
|
-
}
|
|
104
|
-
}
|
|
105
|
-
function NoteList({
|
|
106
|
-
notes,
|
|
107
|
-
selectedId,
|
|
108
|
-
onSelect,
|
|
109
|
-
onCreate,
|
|
110
|
-
searchQuery,
|
|
111
|
-
onSearchChange
|
|
112
|
-
}) {
|
|
113
|
-
const inputRef = useRef(null);
|
|
114
|
-
return /* @__PURE__ */ jsxs("div", { className: NoteApp_default.listPanel, children: [
|
|
115
|
-
/* @__PURE__ */ jsxs("div", { className: NoteApp_default.listHeader, children: [
|
|
116
|
-
/* @__PURE__ */ jsx(
|
|
117
|
-
"input",
|
|
118
|
-
{
|
|
119
|
-
ref: inputRef,
|
|
120
|
-
type: "text",
|
|
121
|
-
className: NoteApp_default.searchInput,
|
|
122
|
-
placeholder: "Search notes...",
|
|
123
|
-
value: searchQuery,
|
|
124
|
-
onChange: (e) => onSearchChange(e.target.value)
|
|
125
|
-
}
|
|
126
|
-
),
|
|
127
|
-
/* @__PURE__ */ jsx("button", { className: NoteApp_default.newNoteBtn, onClick: onCreate, title: "New note", children: "+" })
|
|
128
|
-
] }),
|
|
129
|
-
/* @__PURE__ */ jsx("div", { className: NoteApp_default.noteList, children: notes.length === 0 ? /* @__PURE__ */ jsx("div", { className: NoteApp_default.emptyState, children: searchQuery ? "No notes match your search" : "No notes yet" }) : notes.map((note) => /* @__PURE__ */ jsxs(
|
|
130
|
-
"div",
|
|
131
|
-
{
|
|
132
|
-
className: note.id === selectedId ? NoteApp_default.noteItemActive : NoteApp_default.noteItem,
|
|
133
|
-
onClick: () => onSelect(note.id),
|
|
134
|
-
children: [
|
|
135
|
-
/* @__PURE__ */ jsx("div", { className: NoteApp_default.noteTitle, children: note.title }),
|
|
136
|
-
/* @__PURE__ */ jsx("div", { className: NoteApp_default.notePreview, children: note.preview }),
|
|
137
|
-
/* @__PURE__ */ jsx("div", { className: NoteApp_default.noteDate, children: formatDate(note.updatedAt) })
|
|
138
|
-
]
|
|
139
|
-
},
|
|
140
|
-
note.id
|
|
141
|
-
)) })
|
|
142
|
-
] });
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
// ../ui/dist/index.js
|
|
146
|
-
var J = `.dt-tooltip-popup {
|
|
1
|
+
var h=window.React,We=h.Children,Be=h.Component,je=h.Fragment,Ue=h.Profiler,Ye=h.PureComponent,Xe=h.StrictMode,Ge=h.Suspense,Ke=h.cloneElement,Je=h.createContext,Qe=h.createElement,Ze=h.createRef,ft=h.forwardRef,tr=h.isValidElement,er=h.lazy,rr=h.memo,ir=h.startTransition,x=h.useCallback,nr=h.useContext,sr=h.useDebugValue,ar=h.useDeferredValue,W=h.useEffect,or=h.useId,_t=h.useImperativeHandle,dr=h.useInsertionEffect,lr=h.useLayoutEffect,cr=h.useMemo,hr=h.useReducer,H=h.useRef,I=h.useState,ur=h.useSyncExternalStore,pr=h.useTransition,mr=h.version,at=window.ReactDOM,xt=at.createRoot,gr=at.hydrateRoot;import{useCommand as B,MiniAppIdProvider as wt,WindowIdProvider as yt}from"@desktalk/sdk";var v={root:"NoteApp_root",rootCompact:"NoteApp_rootCompact",listPanel:"NoteApp_listPanel",listHeader:"NoteApp_listHeader",searchInput:"NoteApp_searchInput",newNoteBtn:"NoteApp_newNoteBtn",noteList:"NoteApp_noteList",noteItem:"NoteApp_noteItem",noteItemActive:"NoteApp_noteItem NoteApp_noteItemActive",emptyState:"NoteApp_emptyState",noteTitle:"NoteApp_noteTitle",notePreview:"NoteApp_notePreview",noteDate:"NoteApp_noteDate",editorPanel:"NoteApp_editorPanel",editorHeader:"NoteApp_editorHeader",editorTitle:"NoteApp_editorTitle",editorTags:"NoteApp_editorTags",editorTag:"NoteApp_editorTag",editorBody:"NoteApp_editorBody",editorPlaceholder:"NoteApp_editorPlaceholder",saveStatus:"NoteApp_saveStatus",saveStatusSaving:"NoteApp_saveStatus NoteApp_saveStatusSaving"},G=window.__desktalk_jsx_runtime,u=G.jsx,T=G.jsxs,vr=G.jsxDEV,fr=G.Fragment;function kt(t){try{const e=new Date(t),i=new Date().getTime()-e.getTime(),n=Math.floor(i/6e4);if(n<1)return"just now";if(n<60)return`${n}m ago`;const s=Math.floor(n/60);if(s<24)return`${s}h ago`;const a=Math.floor(s/24);return a<7?`${a}d ago`:e.toLocaleDateString(void 0,{month:"short",day:"numeric"})}catch{return""}}function Ct({notes:t,selectedId:e,onSelect:r,onCreate:i,searchQuery:n,onSearchChange:s}){const a=H(null);return T("div",{className:v.listPanel,children:[T("div",{className:v.listHeader,children:[u("input",{ref:a,type:"text",className:v.searchInput,placeholder:"Search notes...",value:n,onChange:o=>s(o.target.value)}),u("button",{className:v.newNoteBtn,onClick:i,title:"New note",children:"+"})]}),u("div",{className:v.noteList,children:t.length===0?u("div",{className:v.emptyState,children:n?"No notes match your search":"No notes yet"}):t.map(o=>T("div",{className:o.id===e?v.noteItemActive:v.noteItem,onClick:()=>r(o.id),children:[u("div",{className:v.noteTitle,children:o.title}),u("div",{className:v.notePreview,children:o.preview}),u("div",{className:v.noteDate,children:kt(o.updatedAt)})]},o.id))})]})}var Et=`.dt-tooltip-popup {
|
|
147
2
|
position: fixed;
|
|
148
3
|
z-index: 2147483647;
|
|
149
4
|
padding: 6px 10px;
|
|
@@ -252,115 +107,7 @@ var J = `.dt-tooltip-popup {
|
|
|
252
107
|
border-top: none;
|
|
253
108
|
border-bottom: none;
|
|
254
109
|
}
|
|
255
|
-
|
|
256
|
-
var vt = "dt-tooltip-popup";
|
|
257
|
-
var u = 8;
|
|
258
|
-
var W = false;
|
|
259
|
-
function ft() {
|
|
260
|
-
if (W) return;
|
|
261
|
-
let r = document.createElement("style");
|
|
262
|
-
r.setAttribute("data-dt-tooltip", ""), r.textContent = J, document.head.appendChild(r), W = true;
|
|
263
|
-
}
|
|
264
|
-
var x = class extends HTMLElement {
|
|
265
|
-
_popup = null;
|
|
266
|
-
_showTimeout = null;
|
|
267
|
-
_tooltipId = "";
|
|
268
|
-
_visible = false;
|
|
269
|
-
static get observedAttributes() {
|
|
270
|
-
return ["content", "placement", "delay", "disabled"];
|
|
271
|
-
}
|
|
272
|
-
get content() {
|
|
273
|
-
return this.getAttribute("content") ?? "";
|
|
274
|
-
}
|
|
275
|
-
set content(t) {
|
|
276
|
-
this.setAttribute("content", t);
|
|
277
|
-
}
|
|
278
|
-
get placement() {
|
|
279
|
-
let t = this.getAttribute("placement");
|
|
280
|
-
return t === "bottom" || t === "left" || t === "right" ? t : "top";
|
|
281
|
-
}
|
|
282
|
-
set placement(t) {
|
|
283
|
-
this.setAttribute("placement", t);
|
|
284
|
-
}
|
|
285
|
-
get delay() {
|
|
286
|
-
let t = Number(this.getAttribute("delay"));
|
|
287
|
-
return Number.isFinite(t) && t > 0 ? t : 0;
|
|
288
|
-
}
|
|
289
|
-
set delay(t) {
|
|
290
|
-
this.setAttribute("delay", String(t));
|
|
291
|
-
}
|
|
292
|
-
get disabled() {
|
|
293
|
-
return this.hasAttribute("disabled");
|
|
294
|
-
}
|
|
295
|
-
set disabled(t) {
|
|
296
|
-
t ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
|
|
297
|
-
}
|
|
298
|
-
constructor() {
|
|
299
|
-
super();
|
|
300
|
-
let t = this.attachShadow({ mode: "open" });
|
|
301
|
-
t.innerHTML = "<slot></slot>", this._tooltipId = `dt-tip-${Math.random().toString(36).slice(2, 9)}`;
|
|
302
|
-
}
|
|
303
|
-
connectedCallback() {
|
|
304
|
-
ft(), this.addEventListener("mouseenter", this._onEnter), this.addEventListener("mouseleave", this._onLeave), this.addEventListener("focusin", this._onEnter), this.addEventListener("focusout", this._onLeave);
|
|
305
|
-
}
|
|
306
|
-
disconnectedCallback() {
|
|
307
|
-
this.removeEventListener("mouseenter", this._onEnter), this.removeEventListener("mouseleave", this._onLeave), this.removeEventListener("focusin", this._onEnter), this.removeEventListener("focusout", this._onLeave), this._hide();
|
|
308
|
-
}
|
|
309
|
-
attributeChangedCallback(t, e, n) {
|
|
310
|
-
t === "disabled" && this.disabled && this._hide(), t === "content" && this._popup && (this._popup.textContent = this.content);
|
|
311
|
-
}
|
|
312
|
-
_onEnter = () => {
|
|
313
|
-
if (this.disabled || !this.content) return;
|
|
314
|
-
this._showTimeout !== null && clearTimeout(this._showTimeout);
|
|
315
|
-
let t = () => {
|
|
316
|
-
this._createPopup(), this._position(), this._visible = true;
|
|
317
|
-
};
|
|
318
|
-
this.delay > 0 ? this._showTimeout = setTimeout(t, this.delay) : t();
|
|
319
|
-
};
|
|
320
|
-
_onLeave = () => {
|
|
321
|
-
this._hide();
|
|
322
|
-
};
|
|
323
|
-
_createPopup() {
|
|
324
|
-
if (this._popup) return;
|
|
325
|
-
let t = document.createElement("div");
|
|
326
|
-
t.className = vt, t.id = this._tooltipId, t.setAttribute("role", "tooltip"), t.textContent = this.content, document.body.appendChild(t), this._popup = t;
|
|
327
|
-
let e = this._getTrigger();
|
|
328
|
-
e && e.setAttribute("aria-describedby", this._tooltipId);
|
|
329
|
-
}
|
|
330
|
-
_hide() {
|
|
331
|
-
if (this._showTimeout !== null && (clearTimeout(this._showTimeout), this._showTimeout = null), this._popup) {
|
|
332
|
-
let t = this._getTrigger();
|
|
333
|
-
t && t.removeAttribute("aria-describedby"), this._popup.remove(), this._popup = null, this._visible = false;
|
|
334
|
-
}
|
|
335
|
-
}
|
|
336
|
-
_getTrigger() {
|
|
337
|
-
let e = this.shadowRoot?.querySelector("slot")?.assignedElements();
|
|
338
|
-
return e && e.length > 0 ? e[0] : null;
|
|
339
|
-
}
|
|
340
|
-
_position() {
|
|
341
|
-
let t = this._popup;
|
|
342
|
-
if (!t) return;
|
|
343
|
-
let e = this.getBoundingClientRect(), n = t.getBoundingClientRect(), i = window.innerWidth, s = window.innerHeight, o = this.placement;
|
|
344
|
-
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);
|
|
345
|
-
let a, d;
|
|
346
|
-
switch (o) {
|
|
347
|
-
case "top":
|
|
348
|
-
d = e.left + e.width / 2, a = e.top - n.height - u;
|
|
349
|
-
break;
|
|
350
|
-
case "bottom":
|
|
351
|
-
d = e.left + e.width / 2, a = e.bottom + u;
|
|
352
|
-
break;
|
|
353
|
-
case "left":
|
|
354
|
-
d = e.left - n.width - u, a = e.top + e.height / 2;
|
|
355
|
-
break;
|
|
356
|
-
case "right":
|
|
357
|
-
d = e.right + u, a = e.top + e.height / 2;
|
|
358
|
-
break;
|
|
359
|
-
}
|
|
360
|
-
t.style.left = `${d}px`, t.style.top = `${a}px`;
|
|
361
|
-
}
|
|
362
|
-
};
|
|
363
|
-
var G = `:host {
|
|
110
|
+
`,At="dt-tooltip-popup",L=8,ot=!1;function St(){if(ot)return;let t=document.createElement("style");t.setAttribute("data-dt-tooltip",""),t.textContent=Et,document.head.appendChild(t),ot=!0}var zt=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(t){this.setAttribute("content",t)}get placement(){let t=this.getAttribute("placement");return t==="bottom"||t==="left"||t==="right"?t:"top"}set placement(t){this.setAttribute("placement",t)}get delay(){let t=Number(this.getAttribute("delay"));return Number.isFinite(t)&&t>0?t:0}set delay(t){this.setAttribute("delay",String(t))}get disabled(){return this.hasAttribute("disabled")}set disabled(t){t?this.setAttribute("disabled",""):this.removeAttribute("disabled")}constructor(){super();let t=this.attachShadow({mode:"open"});t.innerHTML="<slot></slot>",this._tooltipId=`dt-tip-${Math.random().toString(36).slice(2,9)}`}connectedCallback(){St(),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(t,e,r){t==="disabled"&&this.disabled&&this._hide(),t==="content"&&this._popup&&(this._popup.textContent=this.content)}_onEnter=()=>{if(this.disabled||!this.content)return;this._showTimeout!==null&&clearTimeout(this._showTimeout);let t=()=>{this._createPopup(),this._position(),this._visible=!0};this.delay>0?this._showTimeout=setTimeout(t,this.delay):t()};_onLeave=()=>{this._hide()};_createPopup(){if(this._popup)return;let t=document.createElement("div");t.className=At,t.id=this._tooltipId,t.setAttribute("role","tooltip"),t.textContent=this.content,document.body.appendChild(t),this._popup=t;let e=this._getTrigger();e&&e.setAttribute("aria-describedby",this._tooltipId)}_hide(){if(this._showTimeout!==null&&(clearTimeout(this._showTimeout),this._showTimeout=null),this._popup){let t=this._getTrigger();t&&t.removeAttribute("aria-describedby"),this._popup.remove(),this._popup=null,this._visible=!1}}_getTrigger(){let t=this.shadowRoot?.querySelector("slot")?.assignedElements();return t&&t.length>0?t[0]:null}_position(){let t=this._popup;if(!t)return;let e=this.getBoundingClientRect(),r=t.getBoundingClientRect(),i=window.innerWidth,n=window.innerHeight,s=this.placement;s==="top"&&e.top-r.height-L<0?s="bottom":s==="bottom"&&e.bottom+r.height+L>n?s="top":s==="left"&&e.left-r.width-L<0?s="right":s==="right"&&e.right+r.width+L>i&&(s="left"),t.setAttribute("data-actual-placement",s);let a,o;switch(s){case"top":o=e.left+e.width/2,a=e.top-r.height-L;break;case"bottom":o=e.left+e.width/2,a=e.bottom+L;break;case"left":o=e.left-r.width-L,a=e.top+e.height/2;break;case"right":o=e.right+L,a=e.top+e.height/2;break}t.style.left=`${o}px`,t.style.top=`${a}px`}},Mt=`:host {
|
|
364
111
|
display: block;
|
|
365
112
|
margin-bottom: 12px;
|
|
366
113
|
}
|
|
@@ -436,28 +183,7 @@ var G = `:host {
|
|
|
436
183
|
::slotted(p:last-child) {
|
|
437
184
|
margin-bottom: 0;
|
|
438
185
|
}
|
|
439
|
-
|
|
440
|
-
var _t = "dt-card-inner";
|
|
441
|
-
var w = class extends HTMLElement {
|
|
442
|
-
static get observedAttributes() {
|
|
443
|
-
return ["variant"];
|
|
444
|
-
}
|
|
445
|
-
get variant() {
|
|
446
|
-
let t = this.getAttribute("variant");
|
|
447
|
-
return t === "outlined" || t === "filled" ? t : "default";
|
|
448
|
-
}
|
|
449
|
-
set variant(t) {
|
|
450
|
-
this.setAttribute("variant", t);
|
|
451
|
-
}
|
|
452
|
-
constructor() {
|
|
453
|
-
super();
|
|
454
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
455
|
-
e.textContent = G, t.appendChild(e);
|
|
456
|
-
let n = document.createElement("div");
|
|
457
|
-
n.className = _t, n.innerHTML = "<slot></slot>", t.appendChild(n);
|
|
458
|
-
}
|
|
459
|
-
};
|
|
460
|
-
var j = `.dt-select-menu {
|
|
186
|
+
`,Nt="dt-card-inner",Tt=class extends HTMLElement{static get observedAttributes(){return["variant"]}get variant(){let t=this.getAttribute("variant");return t==="outlined"||t==="filled"?t:"default"}set variant(t){this.setAttribute("variant",t)}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=Mt,t.appendChild(e);let r=document.createElement("div");r.className=Nt,r.innerHTML="<slot></slot>",t.appendChild(r)}},Lt=`.dt-select-menu {
|
|
461
187
|
position: fixed;
|
|
462
188
|
z-index: 2147483646;
|
|
463
189
|
display: flex;
|
|
@@ -527,8 +253,7 @@ var j = `.dt-select-menu {
|
|
|
527
253
|
text-overflow: ellipsis;
|
|
528
254
|
white-space: nowrap;
|
|
529
255
|
}
|
|
530
|
-
|
|
531
|
-
var q = `:host {
|
|
256
|
+
`,Ht=`:host {
|
|
532
257
|
display: block;
|
|
533
258
|
width: 100%;
|
|
534
259
|
min-width: 0;
|
|
@@ -631,141 +356,7 @@ var q = `:host {
|
|
|
631
356
|
.dt-select-trigger[aria-expanded='true'] .dt-select-chevron {
|
|
632
357
|
transform: rotate(180deg);
|
|
633
358
|
}
|
|
634
|
-
|
|
635
|
-
var xt = "dt-select-trigger";
|
|
636
|
-
var K = "dt-select-label";
|
|
637
|
-
var wt = "dt-select-chevron";
|
|
638
|
-
var yt = "dt-select-menu";
|
|
639
|
-
var kt = "dt-select-option";
|
|
640
|
-
var Ct = "dt-select-option--active";
|
|
641
|
-
var U = false;
|
|
642
|
-
function Et() {
|
|
643
|
-
if (U) return;
|
|
644
|
-
let r = document.createElement("style");
|
|
645
|
-
r.setAttribute("data-dt-select", ""), r.textContent = j, document.head.appendChild(r), U = true;
|
|
646
|
-
}
|
|
647
|
-
var y = class extends HTMLElement {
|
|
648
|
-
_menu = null;
|
|
649
|
-
_trigger = null;
|
|
650
|
-
_options = [];
|
|
651
|
-
_open = false;
|
|
652
|
-
_menuId = "";
|
|
653
|
-
static get observedAttributes() {
|
|
654
|
-
return ["value", "placeholder", "disabled", "align"];
|
|
655
|
-
}
|
|
656
|
-
get value() {
|
|
657
|
-
return this.getAttribute("value") ?? "";
|
|
658
|
-
}
|
|
659
|
-
set value(t) {
|
|
660
|
-
this.setAttribute("value", t);
|
|
661
|
-
}
|
|
662
|
-
get placeholder() {
|
|
663
|
-
return this.getAttribute("placeholder") ?? "Select\u2026";
|
|
664
|
-
}
|
|
665
|
-
set placeholder(t) {
|
|
666
|
-
this.setAttribute("placeholder", t);
|
|
667
|
-
}
|
|
668
|
-
get disabled() {
|
|
669
|
-
return this.hasAttribute("disabled");
|
|
670
|
-
}
|
|
671
|
-
set disabled(t) {
|
|
672
|
-
t ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
|
|
673
|
-
}
|
|
674
|
-
get align() {
|
|
675
|
-
return this.getAttribute("align") === "right" ? "right" : "left";
|
|
676
|
-
}
|
|
677
|
-
set align(t) {
|
|
678
|
-
this.setAttribute("align", t);
|
|
679
|
-
}
|
|
680
|
-
get options() {
|
|
681
|
-
return this._options;
|
|
682
|
-
}
|
|
683
|
-
set options(t) {
|
|
684
|
-
this._options = t, this._updateLabel(), this._open && this._renderMenuItems();
|
|
685
|
-
}
|
|
686
|
-
constructor() {
|
|
687
|
-
super();
|
|
688
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
689
|
-
e.textContent = q, t.appendChild(e);
|
|
690
|
-
let n = document.createElement("button");
|
|
691
|
-
n.type = "button", n.className = xt, n.setAttribute("aria-haspopup", "listbox"), n.setAttribute("aria-expanded", "false");
|
|
692
|
-
let i = document.createElement("span");
|
|
693
|
-
i.className = K, n.appendChild(i);
|
|
694
|
-
let s = document.createElement("span");
|
|
695
|
-
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)}`;
|
|
696
|
-
}
|
|
697
|
-
connectedCallback() {
|
|
698
|
-
Et(), this._trigger.addEventListener("click", this._onTriggerClick), this._updateLabel();
|
|
699
|
-
}
|
|
700
|
-
disconnectedCallback() {
|
|
701
|
-
this._trigger.removeEventListener("click", this._onTriggerClick), this._close();
|
|
702
|
-
}
|
|
703
|
-
attributeChangedCallback(t) {
|
|
704
|
-
t === "value" && (this._updateLabel(), this._open && this._renderMenuItems()), t === "placeholder" && !this.value && this._updateLabel(), t === "disabled" && this.disabled && this._close();
|
|
705
|
-
}
|
|
706
|
-
_updateLabel() {
|
|
707
|
-
let t = this._trigger.querySelector(`.${K}`), e = this._options.find((n) => n.value === this.value);
|
|
708
|
-
t.textContent = e?.label ?? this.placeholder;
|
|
709
|
-
}
|
|
710
|
-
_onTriggerClick = () => {
|
|
711
|
-
this.disabled || (this._open ? this._close() : this._openMenu());
|
|
712
|
-
};
|
|
713
|
-
_openMenu() {
|
|
714
|
-
if (this._open) return;
|
|
715
|
-
let t = document.createElement("div");
|
|
716
|
-
t.className = yt, t.id = this._menuId, t.setAttribute("role", "listbox"), document.body.appendChild(t), this._menu = t, this._renderMenuItems(), this._position(), requestAnimationFrame(() => {
|
|
717
|
-
t.setAttribute("data-open", "");
|
|
718
|
-
}), this._open = true, this._trigger.setAttribute("aria-expanded", "true"), requestAnimationFrame(() => {
|
|
719
|
-
document.addEventListener("mousedown", this._onOutsideClick), document.addEventListener("keydown", this._onKeyDown);
|
|
720
|
-
});
|
|
721
|
-
}
|
|
722
|
-
_close() {
|
|
723
|
-
if (this._open) {
|
|
724
|
-
if (document.removeEventListener("mousedown", this._onOutsideClick), document.removeEventListener("keydown", this._onKeyDown), this._menu) {
|
|
725
|
-
this._menu.removeAttribute("data-open");
|
|
726
|
-
let t = this._menu;
|
|
727
|
-
setTimeout(() => t.remove(), 140), this._menu = null;
|
|
728
|
-
}
|
|
729
|
-
this._open = false, this._trigger.setAttribute("aria-expanded", "false");
|
|
730
|
-
}
|
|
731
|
-
}
|
|
732
|
-
_onOutsideClick = (t) => {
|
|
733
|
-
let e = t.target;
|
|
734
|
-
this._menu?.contains(e) || this.contains(e) || this._close();
|
|
735
|
-
};
|
|
736
|
-
_onKeyDown = (t) => {
|
|
737
|
-
t.key === "Escape" && (this._close(), this._trigger.focus());
|
|
738
|
-
};
|
|
739
|
-
_renderMenuItems() {
|
|
740
|
-
let t = this._menu;
|
|
741
|
-
if (t) {
|
|
742
|
-
t.innerHTML = "";
|
|
743
|
-
for (let e of this._options) {
|
|
744
|
-
let n = document.createElement("button");
|
|
745
|
-
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);
|
|
746
|
-
let i = document.createElement("span");
|
|
747
|
-
i.textContent = e.label, n.appendChild(i), n.addEventListener("click", () => {
|
|
748
|
-
this._selectValue(e.value);
|
|
749
|
-
}), t.appendChild(n);
|
|
750
|
-
}
|
|
751
|
-
}
|
|
752
|
-
}
|
|
753
|
-
_selectValue(t) {
|
|
754
|
-
let e = this.value;
|
|
755
|
-
this.value = t, this._updateLabel(), this._close(), t !== e && this.dispatchEvent(new CustomEvent("dt-change", { detail: { value: t }, bubbles: true, composed: true }));
|
|
756
|
-
}
|
|
757
|
-
_position() {
|
|
758
|
-
let t = this._menu;
|
|
759
|
-
if (!t) return;
|
|
760
|
-
let e = this.getBoundingClientRect(), n = 10, i = Math.max(e.width, 240), s = e.bottom + n, o = t.scrollHeight || 260, a = window.innerHeight;
|
|
761
|
-
if (s + o > a && e.top - o - n > 0 && (s = e.top - o - n), t.style.minWidth = `${i}px`, this.align === "right") {
|
|
762
|
-
let d = window.innerWidth;
|
|
763
|
-
t.style.right = `${d - e.right}px`, t.style.left = "auto";
|
|
764
|
-
} else t.style.left = `${e.left}px`, t.style.right = "auto";
|
|
765
|
-
t.style.top = `${s}px`;
|
|
766
|
-
}
|
|
767
|
-
};
|
|
768
|
-
var Y = `:host {
|
|
359
|
+
`,It="dt-select-trigger",dt="dt-select-label",Rt="dt-select-chevron",Ft="dt-select-menu",$t="dt-select-option",Dt="dt-select-option--active",lt=!1;function Pt(){if(lt)return;let t=document.createElement("style");t.setAttribute("data-dt-select",""),t.textContent=Lt,document.head.appendChild(t),lt=!0}var Vt=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(t){this.setAttribute("value",t)}get placeholder(){return this.getAttribute("placeholder")??"Select\u2026"}set placeholder(t){this.setAttribute("placeholder",t)}get disabled(){return this.hasAttribute("disabled")}set disabled(t){t?this.setAttribute("disabled",""):this.removeAttribute("disabled")}get align(){return this.getAttribute("align")==="right"?"right":"left"}set align(t){this.setAttribute("align",t)}get options(){return this._options}set options(t){this._options=t,this._updateLabel(),this._open&&this._renderMenuItems()}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=Ht,t.appendChild(e);let r=document.createElement("button");r.type="button",r.className=It,r.setAttribute("aria-haspopup","listbox"),r.setAttribute("aria-expanded","false");let i=document.createElement("span");i.className=dt,r.appendChild(i);let n=document.createElement("span");n.className=Rt,n.setAttribute("aria-hidden","true"),n.textContent="\u25BE",r.appendChild(n),t.appendChild(r),this._trigger=r,this._menuId=`dt-sel-${Math.random().toString(36).slice(2,9)}`}connectedCallback(){Pt(),this._trigger.addEventListener("click",this._onTriggerClick),this._updateLabel()}disconnectedCallback(){this._trigger.removeEventListener("click",this._onTriggerClick),this._close()}attributeChangedCallback(t){t==="value"&&(this._updateLabel(),this._open&&this._renderMenuItems()),t==="placeholder"&&!this.value&&this._updateLabel(),t==="disabled"&&this.disabled&&this._close()}_updateLabel(){let t=this._trigger.querySelector(`.${dt}`),e=this._options.find(r=>r.value===this.value);t.textContent=e?.label??this.placeholder}_onTriggerClick=()=>{this.disabled||(this._open?this._close():this._openMenu())};_openMenu(){if(this._open)return;let t=document.createElement("div");t.className=Ft,t.id=this._menuId,t.setAttribute("role","listbox"),document.body.appendChild(t),this._menu=t,this._renderMenuItems(),this._position(),requestAnimationFrame(()=>{t.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 t=this._menu;setTimeout(()=>t.remove(),140),this._menu=null}this._open=!1,this._trigger.setAttribute("aria-expanded","false")}}_onOutsideClick=t=>{let e=t.target;this._menu?.contains(e)||this.contains(e)||this._close()};_onKeyDown=t=>{t.key==="Escape"&&(this._close(),this._trigger.focus())};_renderMenuItems(){let t=this._menu;if(t){t.innerHTML="";for(let e of this._options){let r=document.createElement("button");r.type="button",r.className=$t,r.setAttribute("role","option"),r.setAttribute("aria-selected",String(e.value===this.value)),e.value===this.value&&r.classList.add(Dt);let i=document.createElement("span");i.textContent=e.label,r.appendChild(i),r.addEventListener("click",()=>{this._selectValue(e.value)}),t.appendChild(r)}}}_selectValue(t){let e=this.value;this.value=t,this._updateLabel(),this._close(),t!==e&&this.dispatchEvent(new CustomEvent("dt-change",{detail:{value:t},bubbles:!0,composed:!0}))}_position(){let t=this._menu;if(!t)return;let e=this.getBoundingClientRect(),r=10,i=Math.max(e.width,240),n=e.bottom+r,s=t.scrollHeight||260,a=window.innerHeight;if(n+s>a&&e.top-s-r>0&&(n=e.top-s-r),t.style.minWidth=`${i}px`,this.align==="right"){let o=window.innerWidth;t.style.right=`${o-e.right}px`,t.style.left="auto"}else t.style.left=`${e.left}px`,t.style.right="auto";t.style.top=`${n}px`}},Ot=`:host {
|
|
769
360
|
display: block;
|
|
770
361
|
margin-bottom: 12px;
|
|
771
362
|
}
|
|
@@ -857,42 +448,7 @@ var Y = `:host {
|
|
|
857
448
|
::slotted(*) {
|
|
858
449
|
min-width: 0;
|
|
859
450
|
}
|
|
860
|
-
|
|
861
|
-
var St = "dt-grid-inner";
|
|
862
|
-
var k = class extends HTMLElement {
|
|
863
|
-
static get observedAttributes() {
|
|
864
|
-
return ["cols", "gap", "min-width"];
|
|
865
|
-
}
|
|
866
|
-
get cols() {
|
|
867
|
-
let t = this.getAttribute("cols");
|
|
868
|
-
return t === "1" || t === "2" || t === "3" || t === "4" || t === "5" || t === "6" ? t : null;
|
|
869
|
-
}
|
|
870
|
-
set cols(t) {
|
|
871
|
-
t === null ? this.removeAttribute("cols") : this.setAttribute("cols", t);
|
|
872
|
-
}
|
|
873
|
-
get gap() {
|
|
874
|
-
let t = this.getAttribute("gap");
|
|
875
|
-
return t === "0" || t === "4" || t === "8" || t === "12" || t === "20" || t === "24" || t === "32" ? t : "16";
|
|
876
|
-
}
|
|
877
|
-
set gap(t) {
|
|
878
|
-
this.setAttribute("gap", t);
|
|
879
|
-
}
|
|
880
|
-
get minWidth() {
|
|
881
|
-
let t = this.getAttribute("min-width");
|
|
882
|
-
return t === "150" || t === "180" || t === "200" || t === "260" || t === "300" ? t : "220";
|
|
883
|
-
}
|
|
884
|
-
set minWidth(t) {
|
|
885
|
-
this.setAttribute("min-width", t);
|
|
886
|
-
}
|
|
887
|
-
constructor() {
|
|
888
|
-
super();
|
|
889
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
890
|
-
e.textContent = Y, t.appendChild(e);
|
|
891
|
-
let n = document.createElement("div");
|
|
892
|
-
n.className = St, n.innerHTML = "<slot></slot>", t.appendChild(n);
|
|
893
|
-
}
|
|
894
|
-
};
|
|
895
|
-
var Z = `:host {
|
|
451
|
+
`,qt="dt-grid-inner",Wt=class extends HTMLElement{static get observedAttributes(){return["cols","gap","min-width"]}get cols(){let t=this.getAttribute("cols");return t==="1"||t==="2"||t==="3"||t==="4"||t==="5"||t==="6"?t:null}set cols(t){t===null?this.removeAttribute("cols"):this.setAttribute("cols",t)}get gap(){let t=this.getAttribute("gap");return t==="0"||t==="4"||t==="8"||t==="12"||t==="20"||t==="24"||t==="32"?t:"16"}set gap(t){this.setAttribute("gap",t)}get minWidth(){let t=this.getAttribute("min-width");return t==="150"||t==="180"||t==="200"||t==="260"||t==="300"?t:"220"}set minWidth(t){this.setAttribute("min-width",t)}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=Ot,t.appendChild(e);let r=document.createElement("div");r.className=qt,r.innerHTML="<slot></slot>",t.appendChild(r)}},Bt=`:host {
|
|
896
452
|
display: block;
|
|
897
453
|
margin-bottom: 12px;
|
|
898
454
|
}
|
|
@@ -958,54 +514,7 @@ var Z = `:host {
|
|
|
958
514
|
::slotted(*) {
|
|
959
515
|
min-width: 0;
|
|
960
516
|
}
|
|
961
|
-
|
|
962
|
-
var Dt = "dt-stack-inner";
|
|
963
|
-
function $(r) {
|
|
964
|
-
return r === "row" || r === "horizontal" ? "row" : "column";
|
|
965
|
-
}
|
|
966
|
-
var C = class extends HTMLElement {
|
|
967
|
-
static get observedAttributes() {
|
|
968
|
-
return ["direction", "gap", "align"];
|
|
969
|
-
}
|
|
970
|
-
get direction() {
|
|
971
|
-
return $(this.getAttribute("direction"));
|
|
972
|
-
}
|
|
973
|
-
set direction(t) {
|
|
974
|
-
this.setAttribute("direction", $(t));
|
|
975
|
-
}
|
|
976
|
-
get gap() {
|
|
977
|
-
let t = this.getAttribute("gap");
|
|
978
|
-
return t === "0" || t === "4" || t === "8" || t === "12" || t === "20" || t === "24" || t === "32" ? t : "16";
|
|
979
|
-
}
|
|
980
|
-
set gap(t) {
|
|
981
|
-
this.setAttribute("gap", t);
|
|
982
|
-
}
|
|
983
|
-
get align() {
|
|
984
|
-
let t = this.getAttribute("align");
|
|
985
|
-
return t === "start" || t === "center" || t === "end" ? t : "stretch";
|
|
986
|
-
}
|
|
987
|
-
set align(t) {
|
|
988
|
-
this.setAttribute("align", t);
|
|
989
|
-
}
|
|
990
|
-
connectedCallback() {
|
|
991
|
-
this.#t();
|
|
992
|
-
}
|
|
993
|
-
attributeChangedCallback(t) {
|
|
994
|
-
t === "direction" && this.#t();
|
|
995
|
-
}
|
|
996
|
-
constructor() {
|
|
997
|
-
super();
|
|
998
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
999
|
-
e.textContent = Z, t.appendChild(e);
|
|
1000
|
-
let n = document.createElement("div");
|
|
1001
|
-
n.className = Dt, n.innerHTML = "<slot></slot>", t.appendChild(n);
|
|
1002
|
-
}
|
|
1003
|
-
#t() {
|
|
1004
|
-
let t = this.getAttribute("direction"), e = $(t);
|
|
1005
|
-
t !== null && t !== e && this.setAttribute("direction", e);
|
|
1006
|
-
}
|
|
1007
|
-
};
|
|
1008
|
-
var Q = `:host {
|
|
517
|
+
`,jt="dt-stack-inner";function Q(t){return t==="row"||t==="horizontal"?"row":"column"}var Ut=class extends HTMLElement{static get observedAttributes(){return["direction","gap","align"]}get direction(){return Q(this.getAttribute("direction"))}set direction(t){this.setAttribute("direction",Q(t))}get gap(){let t=this.getAttribute("gap");return t==="0"||t==="4"||t==="8"||t==="12"||t==="20"||t==="24"||t==="32"?t:"16"}set gap(t){this.setAttribute("gap",t)}get align(){let t=this.getAttribute("align");return t==="start"||t==="center"||t==="end"?t:"stretch"}set align(t){this.setAttribute("align",t)}connectedCallback(){this.#t()}attributeChangedCallback(t){t==="direction"&&this.#t()}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=Bt,t.appendChild(e);let r=document.createElement("div");r.className=jt,r.innerHTML="<slot></slot>",t.appendChild(r)}#t(){let t=this.getAttribute("direction"),e=Q(t);t!==null&&t!==e&&this.setAttribute("direction",e)}},Yt=`:host {
|
|
1009
518
|
display: block;
|
|
1010
519
|
}
|
|
1011
520
|
|
|
@@ -1110,81 +619,7 @@ var Q = `:host {
|
|
|
1110
619
|
.dt-stat-inner .trend.neutral {
|
|
1111
620
|
color: var(--dt-text-muted);
|
|
1112
621
|
}
|
|
1113
|
-
`;
|
|
1114
|
-
var At = "dt-stat-inner";
|
|
1115
|
-
var E = class extends HTMLElement {
|
|
1116
|
-
static get observedAttributes() {
|
|
1117
|
-
return ["label", "value", "description", "size", "variant", "trend", "trend-value"];
|
|
1118
|
-
}
|
|
1119
|
-
_container;
|
|
1120
|
-
_labelEl;
|
|
1121
|
-
_valueEl;
|
|
1122
|
-
_descEl;
|
|
1123
|
-
_trendEl;
|
|
1124
|
-
get label() {
|
|
1125
|
-
return this.getAttribute("label");
|
|
1126
|
-
}
|
|
1127
|
-
set label(t) {
|
|
1128
|
-
t === null ? this.removeAttribute("label") : this.setAttribute("label", t);
|
|
1129
|
-
}
|
|
1130
|
-
get value() {
|
|
1131
|
-
return this.getAttribute("value");
|
|
1132
|
-
}
|
|
1133
|
-
set value(t) {
|
|
1134
|
-
t === null ? this.removeAttribute("value") : this.setAttribute("value", t);
|
|
1135
|
-
}
|
|
1136
|
-
get description() {
|
|
1137
|
-
return this.getAttribute("description");
|
|
1138
|
-
}
|
|
1139
|
-
set description(t) {
|
|
1140
|
-
t === null ? this.removeAttribute("description") : this.setAttribute("description", t);
|
|
1141
|
-
}
|
|
1142
|
-
get size() {
|
|
1143
|
-
let t = this.getAttribute("size");
|
|
1144
|
-
return t === "sm" || t === "lg" ? t : "md";
|
|
1145
|
-
}
|
|
1146
|
-
set size(t) {
|
|
1147
|
-
this.setAttribute("size", t);
|
|
1148
|
-
}
|
|
1149
|
-
get variant() {
|
|
1150
|
-
let t = this.getAttribute("variant");
|
|
1151
|
-
return t === "outlined" || t === "filled" ? t : "default";
|
|
1152
|
-
}
|
|
1153
|
-
set variant(t) {
|
|
1154
|
-
this.setAttribute("variant", t);
|
|
1155
|
-
}
|
|
1156
|
-
get trend() {
|
|
1157
|
-
let t = this.getAttribute("trend");
|
|
1158
|
-
return t === "up" || t === "down" || t === "neutral" ? t : null;
|
|
1159
|
-
}
|
|
1160
|
-
set trend(t) {
|
|
1161
|
-
t === null ? this.removeAttribute("trend") : this.setAttribute("trend", t);
|
|
1162
|
-
}
|
|
1163
|
-
get trendValue() {
|
|
1164
|
-
return this.getAttribute("trend-value");
|
|
1165
|
-
}
|
|
1166
|
-
set trendValue(t) {
|
|
1167
|
-
t === null ? this.removeAttribute("trend-value") : this.setAttribute("trend-value", t);
|
|
1168
|
-
}
|
|
1169
|
-
constructor() {
|
|
1170
|
-
super();
|
|
1171
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
1172
|
-
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();
|
|
1173
|
-
}
|
|
1174
|
-
attributeChangedCallback(t, e, n) {
|
|
1175
|
-
(t === "label" || t === "value" || t === "description" || t === "size" || t === "variant" || t === "trend" || t === "trend-value") && this._render();
|
|
1176
|
-
}
|
|
1177
|
-
_render() {
|
|
1178
|
-
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";
|
|
1179
|
-
let t = this.trend, e = this.trendValue;
|
|
1180
|
-
if (t && e) {
|
|
1181
|
-
this._trendEl.style.display = "inline-flex", this._trendEl.className = `trend ${t === "up" ? "positive" : t === "down" ? "negative" : "neutral"}`;
|
|
1182
|
-
let n = "";
|
|
1183
|
-
t === "up" ? n = "\u2191" : t === "down" ? n = "\u2193" : n = "\u2192", this._trendEl.textContent = `${n} ${e}`;
|
|
1184
|
-
} else this._trendEl.style.display = "none";
|
|
1185
|
-
}
|
|
1186
|
-
};
|
|
1187
|
-
var tt = `:host {
|
|
622
|
+
`,Xt="dt-stat-inner",Gt=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(t){t===null?this.removeAttribute("label"):this.setAttribute("label",t)}get value(){return this.getAttribute("value")}set value(t){t===null?this.removeAttribute("value"):this.setAttribute("value",t)}get description(){return this.getAttribute("description")}set description(t){t===null?this.removeAttribute("description"):this.setAttribute("description",t)}get size(){let t=this.getAttribute("size");return t==="sm"||t==="lg"?t:"md"}set size(t){this.setAttribute("size",t)}get variant(){let t=this.getAttribute("variant");return t==="outlined"||t==="filled"?t:"default"}set variant(t){this.setAttribute("variant",t)}get trend(){let t=this.getAttribute("trend");return t==="up"||t==="down"||t==="neutral"?t:null}set trend(t){t===null?this.removeAttribute("trend"):this.setAttribute("trend",t)}get trendValue(){return this.getAttribute("trend-value")}set trendValue(t){t===null?this.removeAttribute("trend-value"):this.setAttribute("trend-value",t)}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=Yt,t.appendChild(e),this._container=document.createElement("div"),this._container.className=Xt,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()}attributeChangedCallback(t,e,r){(t==="label"||t==="value"||t==="description"||t==="size"||t==="variant"||t==="trend"||t==="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 t=this.trend,e=this.trendValue;if(t&&e){this._trendEl.style.display="inline-flex",this._trendEl.className=`trend ${t==="up"?"positive":t==="down"?"negative":"neutral"}`;let r="";t==="up"?r="\u2191":t==="down"?r="\u2193":r="\u2192",this._trendEl.textContent=`${r} ${e}`}else this._trendEl.style.display="none"}},Kt=`:host {
|
|
1188
623
|
display: inline-flex;
|
|
1189
624
|
vertical-align: middle;
|
|
1190
625
|
}
|
|
@@ -1266,50 +701,7 @@ var tt = `:host {
|
|
|
1266
701
|
padding: 3px 8px;
|
|
1267
702
|
font-size: 0.75rem;
|
|
1268
703
|
}
|
|
1269
|
-
|
|
1270
|
-
var Mt = "dt-badge-inner";
|
|
1271
|
-
var S = class extends HTMLElement {
|
|
1272
|
-
static get observedAttributes() {
|
|
1273
|
-
return ["variant", "size", "text"];
|
|
1274
|
-
}
|
|
1275
|
-
_container;
|
|
1276
|
-
_slot;
|
|
1277
|
-
get variant() {
|
|
1278
|
-
let t = this.getAttribute("variant");
|
|
1279
|
-
return t === "success" || t === "danger" || t === "warning" || t === "info" || t === "default" || t === "neutral" ? t : "accent";
|
|
1280
|
-
}
|
|
1281
|
-
set variant(t) {
|
|
1282
|
-
this.setAttribute("variant", t);
|
|
1283
|
-
}
|
|
1284
|
-
get size() {
|
|
1285
|
-
let t = this.getAttribute("size");
|
|
1286
|
-
return t === "sm" || t === "lg" ? t : "md";
|
|
1287
|
-
}
|
|
1288
|
-
set size(t) {
|
|
1289
|
-
this.setAttribute("size", t);
|
|
1290
|
-
}
|
|
1291
|
-
get text() {
|
|
1292
|
-
return this.getAttribute("text");
|
|
1293
|
-
}
|
|
1294
|
-
set text(t) {
|
|
1295
|
-
t === null ? this.removeAttribute("text") : this.setAttribute("text", t);
|
|
1296
|
-
}
|
|
1297
|
-
constructor() {
|
|
1298
|
-
super();
|
|
1299
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
1300
|
-
e.textContent = tt, t.appendChild(e), this._container = document.createElement("span"), this._container.className = Mt;
|
|
1301
|
-
let n = this.text;
|
|
1302
|
-
n !== null ? this._container.textContent = n : (this._slot = document.createElement("slot"), this._container.appendChild(this._slot)), t.appendChild(this._container);
|
|
1303
|
-
}
|
|
1304
|
-
attributeChangedCallback(t, e, n) {
|
|
1305
|
-
t === "text" && this._render();
|
|
1306
|
-
}
|
|
1307
|
-
_render() {
|
|
1308
|
-
let t = this.text;
|
|
1309
|
-
t !== null && (this._container.textContent = t);
|
|
1310
|
-
}
|
|
1311
|
-
};
|
|
1312
|
-
var et = `:host {
|
|
704
|
+
`,Jt="dt-badge-inner",Qt=class extends HTMLElement{static get observedAttributes(){return["variant","size","text"]}_container;_slot;get variant(){let t=this.getAttribute("variant");return t==="success"||t==="danger"||t==="warning"||t==="info"||t==="default"||t==="neutral"?t:"accent"}set variant(t){this.setAttribute("variant",t)}get size(){let t=this.getAttribute("size");return t==="sm"||t==="lg"?t:"md"}set size(t){this.setAttribute("size",t)}get text(){return this.getAttribute("text")}set text(t){t===null?this.removeAttribute("text"):this.setAttribute("text",t)}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=Kt,t.appendChild(e),this._container=document.createElement("span"),this._container.className=Jt;let r=this.text;r!==null?this._container.textContent=r:(this._slot=document.createElement("slot"),this._container.appendChild(this._slot)),t.appendChild(this._container)}attributeChangedCallback(t,e,r){t==="text"&&this._render()}_render(){let t=this.text;t!==null&&(this._container.textContent=t)}},Zt=`:host {
|
|
1313
705
|
display: inline-flex;
|
|
1314
706
|
vertical-align: middle;
|
|
1315
707
|
}
|
|
@@ -1468,64 +860,7 @@ var et = `:host {
|
|
|
1468
860
|
width: 1em;
|
|
1469
861
|
height: 1em;
|
|
1470
862
|
}
|
|
1471
|
-
|
|
1472
|
-
var Tt = "dt-button-inner";
|
|
1473
|
-
var D = class extends HTMLElement {
|
|
1474
|
-
static get observedAttributes() {
|
|
1475
|
-
return ["variant", "size", "disabled", "fullwidth", "type"];
|
|
1476
|
-
}
|
|
1477
|
-
_button;
|
|
1478
|
-
_slot;
|
|
1479
|
-
get variant() {
|
|
1480
|
-
let t = this.getAttribute("variant");
|
|
1481
|
-
return t === "secondary" || t === "ghost" || t === "danger" ? t : "primary";
|
|
1482
|
-
}
|
|
1483
|
-
set variant(t) {
|
|
1484
|
-
this.setAttribute("variant", t);
|
|
1485
|
-
}
|
|
1486
|
-
get size() {
|
|
1487
|
-
let t = this.getAttribute("size");
|
|
1488
|
-
return t === "sm" || t === "lg" ? t : "md";
|
|
1489
|
-
}
|
|
1490
|
-
set size(t) {
|
|
1491
|
-
this.setAttribute("size", t);
|
|
1492
|
-
}
|
|
1493
|
-
get disabled() {
|
|
1494
|
-
return this.hasAttribute("disabled");
|
|
1495
|
-
}
|
|
1496
|
-
set disabled(t) {
|
|
1497
|
-
t ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
|
|
1498
|
-
}
|
|
1499
|
-
get fullwidth() {
|
|
1500
|
-
return this.hasAttribute("fullwidth");
|
|
1501
|
-
}
|
|
1502
|
-
set fullwidth(t) {
|
|
1503
|
-
t ? this.setAttribute("fullwidth", "") : this.removeAttribute("fullwidth");
|
|
1504
|
-
}
|
|
1505
|
-
get type() {
|
|
1506
|
-
let t = this.getAttribute("type");
|
|
1507
|
-
return t === "submit" || t === "reset" ? t : "button";
|
|
1508
|
-
}
|
|
1509
|
-
set type(t) {
|
|
1510
|
-
this.setAttribute("type", t);
|
|
1511
|
-
}
|
|
1512
|
-
constructor() {
|
|
1513
|
-
super();
|
|
1514
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
1515
|
-
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);
|
|
1516
|
-
}
|
|
1517
|
-
attributeChangedCallback(t, e, n) {
|
|
1518
|
-
switch (t) {
|
|
1519
|
-
case "disabled":
|
|
1520
|
-
this._button.disabled = this.disabled;
|
|
1521
|
-
break;
|
|
1522
|
-
case "type":
|
|
1523
|
-
this._button.type = this.type;
|
|
1524
|
-
break;
|
|
1525
|
-
}
|
|
1526
|
-
}
|
|
1527
|
-
};
|
|
1528
|
-
var nt = `:host {
|
|
863
|
+
`,te="dt-button-inner",ee=class extends HTMLElement{static get observedAttributes(){return["variant","size","disabled","fullwidth","type"]}_button;_slot;get variant(){let t=this.getAttribute("variant");return t==="secondary"||t==="ghost"||t==="danger"?t:"primary"}set variant(t){this.setAttribute("variant",t)}get size(){let t=this.getAttribute("size");return t==="sm"||t==="lg"?t:"md"}set size(t){this.setAttribute("size",t)}get disabled(){return this.hasAttribute("disabled")}set disabled(t){t?this.setAttribute("disabled",""):this.removeAttribute("disabled")}get fullwidth(){return this.hasAttribute("fullwidth")}set fullwidth(t){t?this.setAttribute("fullwidth",""):this.removeAttribute("fullwidth")}get type(){let t=this.getAttribute("type");return t==="submit"||t==="reset"?t:"button"}set type(t){this.setAttribute("type",t)}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=Zt,t.appendChild(e),this._button=document.createElement("button"),this._button.className=te,this._button.type=this.type,this._button.disabled=this.disabled,this._slot=document.createElement("slot"),this._button.appendChild(this._slot),this._button.addEventListener("click",()=>{if(this.type==="submit"&&!this.disabled){let r=this.closest("form");r&&r.requestSubmit()}}),t.appendChild(this._button)}attributeChangedCallback(t,e,r){switch(t){case"disabled":this._button.disabled=this.disabled;break;case"type":this._button.type=this.type;break}}},re=`:host {
|
|
1529
864
|
display: block;
|
|
1530
865
|
}
|
|
1531
866
|
|
|
@@ -1590,41 +925,7 @@ var nt = `:host {
|
|
|
1590
925
|
:host([direction='vertical'][spacing='lg']) .dt-divider-inner {
|
|
1591
926
|
margin: 0 18px;
|
|
1592
927
|
}
|
|
1593
|
-
|
|
1594
|
-
var zt = "dt-divider-inner";
|
|
1595
|
-
var A = class extends HTMLElement {
|
|
1596
|
-
static get observedAttributes() {
|
|
1597
|
-
return ["direction", "style-variant", "spacing"];
|
|
1598
|
-
}
|
|
1599
|
-
get direction() {
|
|
1600
|
-
return this.getAttribute("direction") === "vertical" ? "vertical" : "horizontal";
|
|
1601
|
-
}
|
|
1602
|
-
set direction(t) {
|
|
1603
|
-
this.setAttribute("direction", t);
|
|
1604
|
-
}
|
|
1605
|
-
get styleVariant() {
|
|
1606
|
-
let t = this.getAttribute("style-variant");
|
|
1607
|
-
return t === "subtle" || t === "strong" ? t : "default";
|
|
1608
|
-
}
|
|
1609
|
-
set styleVariant(t) {
|
|
1610
|
-
this.setAttribute("style-variant", t);
|
|
1611
|
-
}
|
|
1612
|
-
get spacing() {
|
|
1613
|
-
let t = this.getAttribute("spacing");
|
|
1614
|
-
return t === "sm" || t === "md" || t === "lg" ? t : null;
|
|
1615
|
-
}
|
|
1616
|
-
set spacing(t) {
|
|
1617
|
-
t === null ? this.removeAttribute("spacing") : this.setAttribute("spacing", t);
|
|
1618
|
-
}
|
|
1619
|
-
constructor() {
|
|
1620
|
-
super();
|
|
1621
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
1622
|
-
e.textContent = nt, t.appendChild(e);
|
|
1623
|
-
let n = document.createElement("hr");
|
|
1624
|
-
n.className = zt, t.appendChild(n);
|
|
1625
|
-
}
|
|
1626
|
-
};
|
|
1627
|
-
var rt = `:host {
|
|
928
|
+
`,ie="dt-divider-inner",ne=class extends HTMLElement{static get observedAttributes(){return["direction","style-variant","spacing"]}get direction(){return this.getAttribute("direction")==="vertical"?"vertical":"horizontal"}set direction(t){this.setAttribute("direction",t)}get styleVariant(){let t=this.getAttribute("style-variant");return t==="subtle"||t==="strong"?t:"default"}set styleVariant(t){this.setAttribute("style-variant",t)}get spacing(){let t=this.getAttribute("spacing");return t==="sm"||t==="md"||t==="lg"?t:null}set spacing(t){t===null?this.removeAttribute("spacing"):this.setAttribute("spacing",t)}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=re,t.appendChild(e);let r=document.createElement("hr");r.className=ie,t.appendChild(r)}},se=`:host {
|
|
1628
929
|
display: block;
|
|
1629
930
|
min-height: 180px;
|
|
1630
931
|
color: var(--dt-text);
|
|
@@ -1792,256 +1093,7 @@ var rt = `:host {
|
|
|
1792
1093
|
letter-spacing: 0.08em;
|
|
1793
1094
|
font-size: 0.75rem;
|
|
1794
1095
|
}
|
|
1795
|
-
`;
|
|
1796
|
-
function Lt(r) {
|
|
1797
|
-
return r == null || r === false ? null : r === true ? "" : String(r);
|
|
1798
|
-
}
|
|
1799
|
-
function Ht(r, t) {
|
|
1800
|
-
let e = r.querySelectorAll("*");
|
|
1801
|
-
for (let n of e) {
|
|
1802
|
-
let i = n.getAttribute("data-field");
|
|
1803
|
-
if (i) {
|
|
1804
|
-
let s = t[i];
|
|
1805
|
-
n.textContent = s == null ? "" : String(s);
|
|
1806
|
-
}
|
|
1807
|
-
for (let s of n.getAttributeNames()) {
|
|
1808
|
-
if (s === "data-field" || !s.startsWith("data-field-")) continue;
|
|
1809
|
-
let o = s.slice(11);
|
|
1810
|
-
if (!o) continue;
|
|
1811
|
-
let a = n.getAttribute(s);
|
|
1812
|
-
if (!a) continue;
|
|
1813
|
-
let d = Lt(t[a]);
|
|
1814
|
-
d === null ? n.removeAttribute(o) : n.setAttribute(o, d);
|
|
1815
|
-
}
|
|
1816
|
-
}
|
|
1817
|
-
}
|
|
1818
|
-
function M(r, t) {
|
|
1819
|
-
let e = r.content.cloneNode(true);
|
|
1820
|
-
return Ht(e, t), e;
|
|
1821
|
-
}
|
|
1822
|
-
var m = class {
|
|
1823
|
-
_count = 0;
|
|
1824
|
-
_estimateSize = 56;
|
|
1825
|
-
_overscan = 5;
|
|
1826
|
-
_fixedSize = null;
|
|
1827
|
-
_viewportHeight = 0;
|
|
1828
|
-
_scrollTop = 0;
|
|
1829
|
-
_sizes = /* @__PURE__ */ new Map();
|
|
1830
|
-
constructor(t = {}) {
|
|
1831
|
-
this._count = t.count ?? 0, this._estimateSize = t.estimateSize ?? 56, this._overscan = t.overscan ?? 5, this._fixedSize = t.fixedSize ?? null;
|
|
1832
|
-
}
|
|
1833
|
-
setCount(t) {
|
|
1834
|
-
this._count = Math.max(0, t);
|
|
1835
|
-
for (let e of this._sizes.keys()) e >= this._count && this._sizes.delete(e);
|
|
1836
|
-
}
|
|
1837
|
-
setViewportHeight(t) {
|
|
1838
|
-
this._viewportHeight = Math.max(0, t);
|
|
1839
|
-
}
|
|
1840
|
-
setScrollTop(t) {
|
|
1841
|
-
this._scrollTop = Math.max(0, t);
|
|
1842
|
-
}
|
|
1843
|
-
setEstimateSize(t) {
|
|
1844
|
-
this._estimateSize = Math.max(1, t);
|
|
1845
|
-
}
|
|
1846
|
-
setFixedSize(t) {
|
|
1847
|
-
this._fixedSize = t && t > 0 ? t : null;
|
|
1848
|
-
}
|
|
1849
|
-
resetMeasurements() {
|
|
1850
|
-
this._sizes.clear();
|
|
1851
|
-
}
|
|
1852
|
-
measure(t, e) {
|
|
1853
|
-
if (this._fixedSize !== null || t < 0 || t >= this._count) return 0;
|
|
1854
|
-
let n = Math.max(1, Math.round(e)), i = this._sizes.get(t);
|
|
1855
|
-
return i === n ? 0 : (this._sizes.set(t, n), this.getOffset(t + 1) <= this._scrollTop ? n - (i ?? this._estimateSize) : 0);
|
|
1856
|
-
}
|
|
1857
|
-
getOffset(t) {
|
|
1858
|
-
if (t <= 0) return 0;
|
|
1859
|
-
let e = Math.min(t, this._count);
|
|
1860
|
-
if (this._fixedSize !== null) return e * this._fixedSize;
|
|
1861
|
-
let n = 0;
|
|
1862
|
-
for (let i = 0; i < e; i += 1) n += this._sizes.get(i) ?? this._estimateSize;
|
|
1863
|
-
return n;
|
|
1864
|
-
}
|
|
1865
|
-
getTotalHeight() {
|
|
1866
|
-
return this.getOffset(this._count);
|
|
1867
|
-
}
|
|
1868
|
-
getRange() {
|
|
1869
|
-
if (this._count === 0) return { start: 0, end: 0, paddingTop: 0, paddingBottom: 0, totalHeight: 0 };
|
|
1870
|
-
if (this._fixedSize !== null) {
|
|
1871
|
-
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);
|
|
1872
|
-
return { start: c, end: l, paddingTop: f, paddingBottom: h, totalHeight: _ };
|
|
1873
|
-
}
|
|
1874
|
-
let t = 0, e = 0;
|
|
1875
|
-
for (; t < this._count; ) {
|
|
1876
|
-
let d = this._sizes.get(t) ?? this._estimateSize;
|
|
1877
|
-
if (e + d > this._scrollTop) break;
|
|
1878
|
-
e += d, t += 1;
|
|
1879
|
-
}
|
|
1880
|
-
t = Math.max(0, t - this._overscan);
|
|
1881
|
-
let n = this.getOffset(t), i = t, s = 0;
|
|
1882
|
-
for (; i < this._count && s < this._viewportHeight; ) s += this._sizes.get(i) ?? this._estimateSize, i += 1;
|
|
1883
|
-
i = Math.min(this._count, i + this._overscan);
|
|
1884
|
-
let o = this.getTotalHeight(), a = Math.max(0, o - this.getOffset(i));
|
|
1885
|
-
return { start: t, end: i, paddingTop: n, paddingBottom: a, totalHeight: o };
|
|
1886
|
-
}
|
|
1887
|
-
};
|
|
1888
|
-
function Rt(r) {
|
|
1889
|
-
return r && typeof r == "object" ? r : { value: r };
|
|
1890
|
-
}
|
|
1891
|
-
function Vt(r) {
|
|
1892
|
-
return r === "center" || r === "right" ? r : "left";
|
|
1893
|
-
}
|
|
1894
|
-
var b = class extends HTMLElement {
|
|
1895
|
-
static get observedAttributes() {
|
|
1896
|
-
return ["field", "header", "width", "min-width", "align"];
|
|
1897
|
-
}
|
|
1898
|
-
get field() {
|
|
1899
|
-
return this.getAttribute("field") ?? "";
|
|
1900
|
-
}
|
|
1901
|
-
get header() {
|
|
1902
|
-
return this.getAttribute("header") ?? this.field;
|
|
1903
|
-
}
|
|
1904
|
-
get width() {
|
|
1905
|
-
return this.getAttribute("width") ?? "auto";
|
|
1906
|
-
}
|
|
1907
|
-
get minWidth() {
|
|
1908
|
-
return this.getAttribute("min-width") ?? "0";
|
|
1909
|
-
}
|
|
1910
|
-
get align() {
|
|
1911
|
-
return Vt(this.getAttribute("align"));
|
|
1912
|
-
}
|
|
1913
|
-
connectedCallback() {
|
|
1914
|
-
this.hidden = true;
|
|
1915
|
-
}
|
|
1916
|
-
attributeChangedCallback() {
|
|
1917
|
-
this.dispatchEvent(new CustomEvent("dt-column-change", { bubbles: true, composed: true }));
|
|
1918
|
-
}
|
|
1919
|
-
};
|
|
1920
|
-
var T = class extends HTMLElement {
|
|
1921
|
-
_rows = [];
|
|
1922
|
-
_columns = [];
|
|
1923
|
-
_virtualizer = new m({ estimateSize: 40, overscan: 5, fixedSize: 40 });
|
|
1924
|
-
_root;
|
|
1925
|
-
_scroll;
|
|
1926
|
-
_header;
|
|
1927
|
-
_body;
|
|
1928
|
-
_canvas;
|
|
1929
|
-
_emptyState;
|
|
1930
|
-
_resizeObserver = null;
|
|
1931
|
-
_mutationObserver = null;
|
|
1932
|
-
_sortField = null;
|
|
1933
|
-
_sortDirection = "asc";
|
|
1934
|
-
static get observedAttributes() {
|
|
1935
|
-
return ["row-height", "sortable", "striped", "bordered", "empty-text"];
|
|
1936
|
-
}
|
|
1937
|
-
get rows() {
|
|
1938
|
-
return this._rows;
|
|
1939
|
-
}
|
|
1940
|
-
set rows(t) {
|
|
1941
|
-
this._rows = Array.isArray(t) ? t : [], this._virtualizer.setCount(this._rows.length), this._render();
|
|
1942
|
-
}
|
|
1943
|
-
get rowHeight() {
|
|
1944
|
-
let t = Number(this.getAttribute("row-height") ?? "40");
|
|
1945
|
-
return Number.isFinite(t) && t > 0 ? t : 40;
|
|
1946
|
-
}
|
|
1947
|
-
set rowHeight(t) {
|
|
1948
|
-
this.setAttribute("row-height", String(t));
|
|
1949
|
-
}
|
|
1950
|
-
get sortable() {
|
|
1951
|
-
return this.hasAttribute("sortable");
|
|
1952
|
-
}
|
|
1953
|
-
get emptyText() {
|
|
1954
|
-
return this.getAttribute("empty-text") ?? "No data";
|
|
1955
|
-
}
|
|
1956
|
-
constructor() {
|
|
1957
|
-
super();
|
|
1958
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
1959
|
-
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);
|
|
1960
|
-
}
|
|
1961
|
-
connectedCallback() {
|
|
1962
|
-
this._virtualizer.setFixedSize(this.rowHeight), this._virtualizer.setEstimateSize(this.rowHeight), this._syncColumns(), this._resizeObserver = new ResizeObserver((t) => {
|
|
1963
|
-
for (let e of t) if (e.target === this._scroll) {
|
|
1964
|
-
let n = this._header.offsetHeight;
|
|
1965
|
-
this._virtualizer.setViewportHeight(Math.max(0, e.contentRect.height - n)), this._render();
|
|
1966
|
-
}
|
|
1967
|
-
}), this._resizeObserver.observe(this._scroll), this._mutationObserver = new MutationObserver(() => {
|
|
1968
|
-
this._syncColumns(), this._render();
|
|
1969
|
-
}), 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();
|
|
1970
|
-
}
|
|
1971
|
-
disconnectedCallback() {
|
|
1972
|
-
this._scroll.removeEventListener("scroll", this._onScroll), this._resizeObserver?.disconnect(), this._mutationObserver?.disconnect(), this._resizeObserver = null, this._mutationObserver = null;
|
|
1973
|
-
}
|
|
1974
|
-
attributeChangedCallback(t) {
|
|
1975
|
-
t === "row-height" && (this._virtualizer.setFixedSize(this.rowHeight), this._virtualizer.setEstimateSize(this.rowHeight)), this._render();
|
|
1976
|
-
}
|
|
1977
|
-
_onScroll = () => {
|
|
1978
|
-
this._virtualizer.setScrollTop(Math.max(0, this._scroll.scrollTop - this._header.offsetHeight)), this._renderBody();
|
|
1979
|
-
};
|
|
1980
|
-
_syncColumns() {
|
|
1981
|
-
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);
|
|
1982
|
-
}
|
|
1983
|
-
_render() {
|
|
1984
|
-
if (!this.isConnected) return;
|
|
1985
|
-
this._emptyState.textContent = this.emptyText;
|
|
1986
|
-
let t = this._columns.length > 0 ? this._columns.map((e) => this._toGridColumn(e)).join(" ") : "minmax(0, 1fr)";
|
|
1987
|
-
this._header.style.setProperty("--dt-table-columns", t), this._canvas.style.setProperty("--dt-table-columns", t), this._renderHeader(), this._renderBody();
|
|
1988
|
-
}
|
|
1989
|
-
_renderHeader() {
|
|
1990
|
-
let t = document.createDocumentFragment();
|
|
1991
|
-
for (let e of this._columns) {
|
|
1992
|
-
let n = document.createElement("div");
|
|
1993
|
-
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) => {
|
|
1994
|
-
(s.key === "Enter" || s.key === " ") && (s.preventDefault(), this._requestSort(e.field));
|
|
1995
|
-
}));
|
|
1996
|
-
let i = document.createElement("span");
|
|
1997
|
-
if (i.className = "dt-table-header-label", i.textContent = e.header, this.sortable) {
|
|
1998
|
-
let s = document.createElement("span");
|
|
1999
|
-
s.className = "dt-table-sort-indicator", this._sortField === e.field ? s.textContent = this._sortDirection === "asc" ? "\u25B2" : "\u25BC" : s.textContent = "\u2195", i.appendChild(s);
|
|
2000
|
-
}
|
|
2001
|
-
n.appendChild(i), t.appendChild(n);
|
|
2002
|
-
}
|
|
2003
|
-
this._header.replaceChildren(t);
|
|
2004
|
-
}
|
|
2005
|
-
_renderBody() {
|
|
2006
|
-
if (this._rows.length === 0 || this._columns.length === 0) {
|
|
2007
|
-
this._emptyState.hidden = false, this._canvas.replaceChildren(), this._body.style.height = "140px", this._canvas.style.height = "0px";
|
|
2008
|
-
return;
|
|
2009
|
-
}
|
|
2010
|
-
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));
|
|
2011
|
-
let t = this._virtualizer.getRange();
|
|
2012
|
-
this._body.style.height = `${Math.max(t.totalHeight, this._scroll.clientHeight - this._header.offsetHeight)}px`, this._canvas.style.height = `${t.totalHeight}px`;
|
|
2013
|
-
let e = document.createDocumentFragment();
|
|
2014
|
-
for (let n = t.start; n < t.end; n += 1) e.appendChild(this._renderRow(n));
|
|
2015
|
-
this._canvas.replaceChildren(e);
|
|
2016
|
-
}
|
|
2017
|
-
_renderRow(t) {
|
|
2018
|
-
let e = this._rows[t], n = document.createElement("div");
|
|
2019
|
-
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", () => {
|
|
2020
|
-
this.dispatchEvent(new CustomEvent("dt-row-click", { detail: { row: e, index: t }, bubbles: true, composed: true }));
|
|
2021
|
-
});
|
|
2022
|
-
let i = Rt(e);
|
|
2023
|
-
for (let s of this._columns) {
|
|
2024
|
-
let o = document.createElement("div");
|
|
2025
|
-
if (o.className = "dt-table-cell", o.dataset.align = s.align, s.template) o.appendChild(M(s.template, i));
|
|
2026
|
-
else {
|
|
2027
|
-
let a = i[s.field];
|
|
2028
|
-
o.textContent = a == null ? "" : String(a);
|
|
2029
|
-
}
|
|
2030
|
-
n.appendChild(o);
|
|
2031
|
-
}
|
|
2032
|
-
return n;
|
|
2033
|
-
}
|
|
2034
|
-
_requestSort(t) {
|
|
2035
|
-
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 }));
|
|
2036
|
-
}
|
|
2037
|
-
_toGridColumn(t) {
|
|
2038
|
-
let e = /^\d+$/.test(t.minWidth) ? `${t.minWidth}px` : t.minWidth;
|
|
2039
|
-
if (t.width === "auto") return `minmax(${e}, 1fr)`;
|
|
2040
|
-
let n = /^\d+$/.test(t.width) ? `${t.width}px` : t.width;
|
|
2041
|
-
return `minmax(${e}, ${n})`;
|
|
2042
|
-
}
|
|
2043
|
-
};
|
|
2044
|
-
var it = `:host {
|
|
1096
|
+
`;function ae(t){return t==null||t===!1?null:t===!0?"":String(t)}function oe(t,e){let r=t.querySelectorAll("*");for(let i of r){let n=i.getAttribute("data-field");if(n){let s=e[n];i.textContent=s==null?"":String(s)}for(let s of i.getAttributeNames()){if(s==="data-field"||!s.startsWith("data-field-"))continue;let a=s.slice(11);if(!a)continue;let o=i.getAttribute(s);if(!o)continue;let d=ae(e[o]);d===null?i.removeAttribute(a):i.setAttribute(a,d)}}}function ct(t,e){let r=t.content.cloneNode(!0);return oe(r,e),r}var ht=class{_count=0;_estimateSize=56;_overscan=5;_fixedSize=null;_viewportHeight=0;_scrollTop=0;_sizes=new Map;constructor(t={}){this._count=t.count??0,this._estimateSize=t.estimateSize??56,this._overscan=t.overscan??5,this._fixedSize=t.fixedSize??null}setCount(t){this._count=Math.max(0,t);for(let e of this._sizes.keys())e>=this._count&&this._sizes.delete(e)}setViewportHeight(t){this._viewportHeight=Math.max(0,t)}setScrollTop(t){this._scrollTop=Math.max(0,t)}setEstimateSize(t){this._estimateSize=Math.max(1,t)}setFixedSize(t){this._fixedSize=t&&t>0?t:null}resetMeasurements(){this._sizes.clear()}measure(t,e){if(this._fixedSize!==null||t<0||t>=this._count)return 0;let r=Math.max(1,Math.round(e)),i=this._sizes.get(t);return i===r?0:(this._sizes.set(t,r),this.getOffset(t+1)<=this._scrollTop?r-(i??this._estimateSize):0)}getOffset(t){if(t<=0)return 0;let e=Math.min(t,this._count);if(this._fixedSize!==null)return e*this._fixedSize;let r=0;for(let i=0;i<e;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 o=Math.max(1,Math.ceil(this._viewportHeight/this._fixedSize)),d=Math.max(0,Math.floor(this._scrollTop/this._fixedSize)-this._overscan),l=Math.min(this._count,d+o+this._overscan*2),g=d*this._fixedSize,_=this._count*this._fixedSize,b=Math.max(0,_-g-(l-d)*this._fixedSize);return{start:d,end:l,paddingTop:g,paddingBottom:b,totalHeight:_}}let t=0,e=0;for(;t<this._count;){let o=this._sizes.get(t)??this._estimateSize;if(e+o>this._scrollTop)break;e+=o,t+=1}t=Math.max(0,t-this._overscan);let r=this.getOffset(t),i=t,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 s=this.getTotalHeight(),a=Math.max(0,s-this.getOffset(i));return{start:t,end:i,paddingTop:r,paddingBottom:a,totalHeight:s}}};function de(t){return t&&typeof t=="object"?t:{value:t}}function le(t){return t==="center"||t==="right"?t:"left"}var ut=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 le(this.getAttribute("align"))}connectedCallback(){this.hidden=!0}attributeChangedCallback(){this.dispatchEvent(new CustomEvent("dt-column-change",{bubbles:!0,composed:!0}))}},ce=class extends HTMLElement{_rows=[];_columns=[];_virtualizer=new ht({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(t){this._rows=Array.isArray(t)?t:[],this._virtualizer.setCount(this._rows.length),this._render()}get rowHeight(){let t=Number(this.getAttribute("row-height")??"40");return Number.isFinite(t)&&t>0?t:40}set rowHeight(t){this.setAttribute("row-height",String(t))}get sortable(){return this.hasAttribute("sortable")}get emptyText(){return this.getAttribute("empty-text")??"No data"}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=se,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:!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),t.appendChild(this._root)}connectedCallback(){this._virtualizer.setFixedSize(this.rowHeight),this._virtualizer.setEstimateSize(this.rowHeight),this._syncColumns(),this._resizeObserver=new ResizeObserver(t=>{for(let e of t)if(e.target===this._scroll){let r=this._header.offsetHeight;this._virtualizer.setViewportHeight(Math.max(0,e.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(t){t==="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(t=>t instanceof ut).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)}_render(){if(!this.isConnected)return;this._emptyState.textContent=this.emptyText;let t=this._columns.length>0?this._columns.map(e=>this._toGridColumn(e)).join(" "):"minmax(0, 1fr)";this._header.style.setProperty("--dt-table-columns",t),this._canvas.style.setProperty("--dt-table-columns",t),this._renderHeader(),this._renderBody()}_renderHeader(){let t=document.createDocumentFragment();for(let e of this._columns){let r=document.createElement("div");r.className="dt-table-header-cell",r.dataset.align=e.align,this.sortable&&(r.classList.add("dt-table-header-cell--sortable"),r.tabIndex=0,r.setAttribute("role","button"),r.setAttribute("aria-label",`Sort by ${e.header}`),r.addEventListener("click",()=>this._requestSort(e.field)),r.addEventListener("keydown",n=>{(n.key==="Enter"||n.key===" ")&&(n.preventDefault(),this._requestSort(e.field))}));let i=document.createElement("span");if(i.className="dt-table-header-label",i.textContent=e.header,this.sortable){let n=document.createElement("span");n.className="dt-table-sort-indicator",this._sortField===e.field?n.textContent=this._sortDirection==="asc"?"\u25B2":"\u25BC":n.textContent="\u2195",i.appendChild(n)}r.appendChild(i),t.appendChild(r)}this._header.replaceChildren(t)}_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 t=this._virtualizer.getRange();this._body.style.height=`${Math.max(t.totalHeight,this._scroll.clientHeight-this._header.offsetHeight)}px`,this._canvas.style.height=`${t.totalHeight}px`;let e=document.createDocumentFragment();for(let r=t.start;r<t.end;r+=1)e.appendChild(this._renderRow(r));this._canvas.replaceChildren(e)}_renderRow(t){let e=this._rows[t],r=document.createElement("div");r.className="dt-table-row dt-table-row--clickable",r.style.top=`${this._virtualizer.getOffset(t)}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:e,index:t},bubbles:!0,composed:!0}))});let i=de(e);for(let n of this._columns){let s=document.createElement("div");if(s.className="dt-table-cell",s.dataset.align=n.align,n.template)s.appendChild(ct(n.template,i));else{let a=i[n.field];s.textContent=a==null?"":String(a)}r.appendChild(s)}return r}_requestSort(t){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:!0,composed:!0}))}_toGridColumn(t){let e=/^\d+$/.test(t.minWidth)?`${t.minWidth}px`:t.minWidth;if(t.width==="auto")return`minmax(${e}, 1fr)`;let r=/^\d+$/.test(t.width)?`${t.width}px`:t.width;return`minmax(${e}, ${r})`}},he=`:host {
|
|
2045
1097
|
display: block;
|
|
2046
1098
|
min-height: 120px;
|
|
2047
1099
|
color: var(--dt-text);
|
|
@@ -2140,133 +1192,7 @@ var it = `:host {
|
|
|
2140
1192
|
letter-spacing: 0.08em;
|
|
2141
1193
|
font-size: 0.75rem;
|
|
2142
1194
|
}
|
|
2143
|
-
`;
|
|
2144
|
-
var st = 56;
|
|
2145
|
-
function Pt(r) {
|
|
2146
|
-
return r && typeof r == "object" ? r : { value: r };
|
|
2147
|
-
}
|
|
2148
|
-
var z = class extends HTMLElement {
|
|
2149
|
-
_items = [];
|
|
2150
|
-
_selectedIndices = /* @__PURE__ */ new Set();
|
|
2151
|
-
_renderItem = null;
|
|
2152
|
-
_virtualizer = new m({ estimateSize: st, overscan: 5 });
|
|
2153
|
-
_viewport;
|
|
2154
|
-
_spacer;
|
|
2155
|
-
_itemsLayer;
|
|
2156
|
-
_emptyState;
|
|
2157
|
-
_resizeObserver = null;
|
|
2158
|
-
_itemResizeObserver = null;
|
|
2159
|
-
static get observedAttributes() {
|
|
2160
|
-
return ["item-height", "dividers", "selectable", "empty-text"];
|
|
2161
|
-
}
|
|
2162
|
-
get items() {
|
|
2163
|
-
return this._items;
|
|
2164
|
-
}
|
|
2165
|
-
set items(t) {
|
|
2166
|
-
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();
|
|
2167
|
-
}
|
|
2168
|
-
get selectedItems() {
|
|
2169
|
-
return [...this._selectedIndices].sort((t, e) => t - e).map((t) => this._items[t]);
|
|
2170
|
-
}
|
|
2171
|
-
get renderItem() {
|
|
2172
|
-
return this._renderItem;
|
|
2173
|
-
}
|
|
2174
|
-
set renderItem(t) {
|
|
2175
|
-
this._renderItem = typeof t == "function" ? t : null, this._render();
|
|
2176
|
-
}
|
|
2177
|
-
get itemHeight() {
|
|
2178
|
-
let t = this.getAttribute("item-height");
|
|
2179
|
-
if (!t) return null;
|
|
2180
|
-
let e = Number(t);
|
|
2181
|
-
return Number.isFinite(e) && e > 0 ? e : null;
|
|
2182
|
-
}
|
|
2183
|
-
set itemHeight(t) {
|
|
2184
|
-
if (t === null || t <= 0) {
|
|
2185
|
-
this.removeAttribute("item-height");
|
|
2186
|
-
return;
|
|
2187
|
-
}
|
|
2188
|
-
this.setAttribute("item-height", String(t));
|
|
2189
|
-
}
|
|
2190
|
-
get selectable() {
|
|
2191
|
-
let t = this.getAttribute("selectable");
|
|
2192
|
-
return t === "single" || t === "multi" ? t : "none";
|
|
2193
|
-
}
|
|
2194
|
-
set selectable(t) {
|
|
2195
|
-
this.setAttribute("selectable", t);
|
|
2196
|
-
}
|
|
2197
|
-
get emptyText() {
|
|
2198
|
-
return this.getAttribute("empty-text") ?? "No items";
|
|
2199
|
-
}
|
|
2200
|
-
set emptyText(t) {
|
|
2201
|
-
this.setAttribute("empty-text", t);
|
|
2202
|
-
}
|
|
2203
|
-
constructor() {
|
|
2204
|
-
super();
|
|
2205
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
2206
|
-
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);
|
|
2207
|
-
}
|
|
2208
|
-
connectedCallback() {
|
|
2209
|
-
this._resizeObserver = new ResizeObserver((t) => {
|
|
2210
|
-
for (let e of t) e.target === this._viewport && (this._virtualizer.setViewportHeight(e.contentRect.height), this._render());
|
|
2211
|
-
}), this._resizeObserver.observe(this._viewport), this._itemResizeObserver = new ResizeObserver((t) => {
|
|
2212
|
-
let e = 0;
|
|
2213
|
-
for (let n of t) {
|
|
2214
|
-
let i = n.target, s = Number(i.dataset.index);
|
|
2215
|
-
Number.isFinite(s) && (e += this._virtualizer.measure(s, n.contentRect.height));
|
|
2216
|
-
}
|
|
2217
|
-
e !== 0 && (this._viewport.scrollTop += e), t.length > 0 && this._render();
|
|
2218
|
-
}), this._virtualizer.setCount(this._items.length), this._virtualizer.setViewportHeight(this._viewport.clientHeight), this._syncSizingMode(false), this._render();
|
|
2219
|
-
}
|
|
2220
|
-
disconnectedCallback() {
|
|
2221
|
-
this._viewport.removeEventListener("scroll", this._onScroll), this._resizeObserver?.disconnect(), this._itemResizeObserver?.disconnect(), this._resizeObserver = null, this._itemResizeObserver = null;
|
|
2222
|
-
}
|
|
2223
|
-
attributeChangedCallback(t) {
|
|
2224
|
-
t === "item-height" && this._syncSizingMode(true), t === "selectable" && this.selectable === "none" && this._selectedIndices.size > 0 && (this._selectedIndices.clear(), this._emitSelectionChange()), this._render();
|
|
2225
|
-
}
|
|
2226
|
-
_onScroll = () => {
|
|
2227
|
-
this._virtualizer.setScrollTop(this._viewport.scrollTop), this._render();
|
|
2228
|
-
};
|
|
2229
|
-
_syncSizingMode(t) {
|
|
2230
|
-
let e = this.itemHeight;
|
|
2231
|
-
this._virtualizer.setFixedSize(e), this._virtualizer.setEstimateSize(e ?? st), t && this._virtualizer.resetMeasurements();
|
|
2232
|
-
}
|
|
2233
|
-
_render() {
|
|
2234
|
-
if (!this.isConnected) return;
|
|
2235
|
-
if (this._emptyState.textContent = this.emptyText, this._emptyState.hidden = this._items.length > 0, this._items.length === 0) {
|
|
2236
|
-
this._itemsLayer.replaceChildren(), this._spacer.style.height = "100%";
|
|
2237
|
-
return;
|
|
2238
|
-
}
|
|
2239
|
-
this._virtualizer.setScrollTop(this._viewport.scrollTop), this._virtualizer.setViewportHeight(this._viewport.clientHeight), this._virtualizer.setCount(this._items.length);
|
|
2240
|
-
let t = this._virtualizer.getRange();
|
|
2241
|
-
this._spacer.style.height = `${Math.max(t.totalHeight, this._viewport.clientHeight)}px`, this._itemsLayer.style.transform = `translateY(${t.paddingTop}px)`;
|
|
2242
|
-
let e = document.createDocumentFragment();
|
|
2243
|
-
for (let n = t.start; n < t.end; n += 1) e.appendChild(this._renderVisibleItem(n));
|
|
2244
|
-
this._itemsLayer.replaceChildren(e);
|
|
2245
|
-
}
|
|
2246
|
-
_renderVisibleItem(t) {
|
|
2247
|
-
let e = this._items[t], n = document.createElement("div");
|
|
2248
|
-
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);
|
|
2249
|
-
else {
|
|
2250
|
-
let i = this._getTemplate();
|
|
2251
|
-
i ? n.appendChild(M(i, Pt(e))) : n.textContent = String(e ?? "");
|
|
2252
|
-
}
|
|
2253
|
-
return n.addEventListener("click", () => this._handleItemClick(t)), n.addEventListener("keydown", (i) => {
|
|
2254
|
-
(i.key === "Enter" || i.key === " ") && (i.preventDefault(), this._handleItemClick(t));
|
|
2255
|
-
}), this.itemHeight === null && this._itemResizeObserver?.observe(n), n;
|
|
2256
|
-
}
|
|
2257
|
-
_handleItemClick(t) {
|
|
2258
|
-
let e = this._items[t], n = this.selectable;
|
|
2259
|
-
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 }));
|
|
2260
|
-
}
|
|
2261
|
-
_emitSelectionChange() {
|
|
2262
|
-
this.dispatchEvent(new CustomEvent("dt-selection-change", { detail: { selected: this.selectedItems }, bubbles: true, composed: true }));
|
|
2263
|
-
}
|
|
2264
|
-
_getTemplate() {
|
|
2265
|
-
for (let t of Array.from(this.children)) if (t instanceof HTMLTemplateElement) return t;
|
|
2266
|
-
return null;
|
|
2267
|
-
}
|
|
2268
|
-
};
|
|
2269
|
-
var ot = `:host {
|
|
1195
|
+
`,pt=56;function ue(t){return t&&typeof t=="object"?t:{value:t}}var pe=class extends HTMLElement{_items=[];_selectedIndices=new Set;_renderItem=null;_virtualizer=new ht({estimateSize:pt,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(t){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(!0),this._render()}get selectedItems(){return[...this._selectedIndices].sort((t,e)=>t-e).map(t=>this._items[t])}get renderItem(){return this._renderItem}set renderItem(t){this._renderItem=typeof t=="function"?t:null,this._render()}get itemHeight(){let t=this.getAttribute("item-height");if(!t)return null;let e=Number(t);return Number.isFinite(e)&&e>0?e:null}set itemHeight(t){if(t===null||t<=0){this.removeAttribute("item-height");return}this.setAttribute("item-height",String(t))}get selectable(){let t=this.getAttribute("selectable");return t==="single"||t==="multi"?t:"none"}set selectable(t){this.setAttribute("selectable",t)}get emptyText(){return this.getAttribute("empty-text")??"No items"}set emptyText(t){this.setAttribute("empty-text",t)}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=he,t.appendChild(e),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),t.appendChild(this._viewport)}connectedCallback(){this._resizeObserver=new ResizeObserver(t=>{for(let e of t)e.target===this._viewport&&(this._virtualizer.setViewportHeight(e.contentRect.height),this._render())}),this._resizeObserver.observe(this._viewport),this._itemResizeObserver=new ResizeObserver(t=>{let e=0;for(let r of t){let i=r.target,n=Number(i.dataset.index);Number.isFinite(n)&&(e+=this._virtualizer.measure(n,r.contentRect.height))}e!==0&&(this._viewport.scrollTop+=e),t.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(t){t==="item-height"&&this._syncSizingMode(!0),t==="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(t){let e=this.itemHeight;this._virtualizer.setFixedSize(e),this._virtualizer.setEstimateSize(e??pt),t&&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 t=this._virtualizer.getRange();this._spacer.style.height=`${Math.max(t.totalHeight,this._viewport.clientHeight)}px`,this._itemsLayer.style.transform=`translateY(${t.paddingTop}px)`;let e=document.createDocumentFragment();for(let r=t.start;r<t.end;r+=1)e.appendChild(this._renderVisibleItem(r));this._itemsLayer.replaceChildren(e)}_renderVisibleItem(t){let e=this._items[t],r=document.createElement("div");if(r.className="dt-list-item",r.dataset.index=String(t),this.selectable!=="none"&&(r.classList.add("dt-list-item--interactive"),r.setAttribute("role","option"),r.setAttribute("aria-selected",String(this._selectedIndices.has(t))),r.tabIndex=0),this._selectedIndices.has(t)&&r.classList.add("dt-list-item--selected"),this.itemHeight!==null&&(r.style.minHeight=`${this.itemHeight}px`),this._renderItem)this._renderItem(e,r,t);else{let i=this._getTemplate();i?r.appendChild(ct(i,ue(e))):r.textContent=String(e??"")}return r.addEventListener("click",()=>this._handleItemClick(t)),r.addEventListener("keydown",i=>{(i.key==="Enter"||i.key===" ")&&(i.preventDefault(),this._handleItemClick(t))}),this.itemHeight===null&&this._itemResizeObserver?.observe(r),r}_handleItemClick(t){let e=this._items[t],r=this.selectable;r==="single"?(this._selectedIndices=new Set([t]),this._emitSelectionChange(),this._render()):r==="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:!0,composed:!0}))}_emitSelectionChange(){this.dispatchEvent(new CustomEvent("dt-selection-change",{detail:{selected:this.selectedItems},bubbles:!0,composed:!0}))}_getTemplate(){for(let t of Array.from(this.children))if(t instanceof HTMLTemplateElement)return t;return null}},me=`:host {
|
|
2270
1196
|
display: block;
|
|
2271
1197
|
min-height: 220px;
|
|
2272
1198
|
color: var(--dt-text);
|
|
@@ -2353,197 +1279,7 @@ var ot = `:host {
|
|
|
2353
1279
|
.dt-chart__status[hidden] {
|
|
2354
1280
|
display: none;
|
|
2355
1281
|
}
|
|
2356
|
-
|
|
2357
|
-
var L = null;
|
|
2358
|
-
function at() {
|
|
2359
|
-
return window.__DtChart ? Promise.resolve(window.__DtChart) : L || (L = new Promise((r, t) => {
|
|
2360
|
-
let e = document.createElement("script");
|
|
2361
|
-
e.src = "/api/ui/chart.umd.js", e.async = true, e.dataset.dtChart = "true", e.onload = () => {
|
|
2362
|
-
if (window.__DtChart) {
|
|
2363
|
-
r(window.__DtChart);
|
|
2364
|
-
return;
|
|
2365
|
-
}
|
|
2366
|
-
t(new Error("Chart runtime loaded without a __DtChart export."));
|
|
2367
|
-
}, e.onerror = () => t(new Error("Failed to load the Chart.js runtime bundle.")), document.head.appendChild(e);
|
|
2368
|
-
}), L);
|
|
2369
|
-
}
|
|
2370
|
-
function v(r, t, e) {
|
|
2371
|
-
return Math.min(e, Math.max(t, r));
|
|
2372
|
-
}
|
|
2373
|
-
function It(r) {
|
|
2374
|
-
return r ? r.split(",").map((t) => t.trim()).filter(Boolean) : [];
|
|
2375
|
-
}
|
|
2376
|
-
function X(r) {
|
|
2377
|
-
let t = r.trim().match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);
|
|
2378
|
-
if (t) {
|
|
2379
|
-
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;
|
|
2380
|
-
return dt(o, a, d);
|
|
2381
|
-
}
|
|
2382
|
-
let e = r.trim().match(/^rgba?\((\d+(?:\.\d+)?)[,\s]+(\d+(?:\.\d+)?)[,\s]+(\d+(?:\.\d+)?)(?:[,/\s]+[\d.]+)?\)$/i);
|
|
2383
|
-
if (e) return dt(Number(e[1]) / 255, Number(e[2]) / 255, Number(e[3]) / 255);
|
|
2384
|
-
let n = r.trim().match(/^hsla?\(([-\d.]+)(?:deg)?[,\s]+([\d.]+)%[,\s]+([\d.]+)%(?:[,/\s]+[\d.]+)?\)$/i);
|
|
2385
|
-
return n ? { h: (Number(n[1]) % 360 + 360) % 360, s: v(Number(n[2]), 0, 100), l: v(Number(n[3]), 0, 100) } : null;
|
|
2386
|
-
}
|
|
2387
|
-
function dt(r, t, e) {
|
|
2388
|
-
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));
|
|
2389
|
-
if (s !== 0) switch (n) {
|
|
2390
|
-
case r:
|
|
2391
|
-
o = 60 * ((t - e) / s % 6);
|
|
2392
|
-
break;
|
|
2393
|
-
case t:
|
|
2394
|
-
o = 60 * ((e - r) / s + 2);
|
|
2395
|
-
break;
|
|
2396
|
-
default:
|
|
2397
|
-
o = 60 * ((r - t) / s + 4);
|
|
2398
|
-
break;
|
|
2399
|
-
}
|
|
2400
|
-
return { h: (o + 360) % 360, s: Math.round(d * 100), l: Math.round(a * 100) };
|
|
2401
|
-
}
|
|
2402
|
-
function g(r, t = 1) {
|
|
2403
|
-
return `hsla(${Math.round(r.h)} ${Math.round(r.s)}% ${Math.round(r.l)}% / ${t})`;
|
|
2404
|
-
}
|
|
2405
|
-
function Nt(r) {
|
|
2406
|
-
let t = X(r) ?? { h: 185, s: 88, l: 56 };
|
|
2407
|
-
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) }));
|
|
2408
|
-
}
|
|
2409
|
-
function H(r) {
|
|
2410
|
-
return !!r && typeof r == "object" && !Array.isArray(r);
|
|
2411
|
-
}
|
|
2412
|
-
function lt(r, t) {
|
|
2413
|
-
if (!H(r) || !H(t)) return t ?? r;
|
|
2414
|
-
let e = { ...r };
|
|
2415
|
-
for (let [n, i] of Object.entries(t)) {
|
|
2416
|
-
let s = e[n];
|
|
2417
|
-
e[n] = H(s) && H(i) ? lt(s, i) : i;
|
|
2418
|
-
}
|
|
2419
|
-
return e;
|
|
2420
|
-
}
|
|
2421
|
-
function Ft(r) {
|
|
2422
|
-
return r === "top" || r === "bottom" || r === "left" || r === "right" ? r : "none";
|
|
2423
|
-
}
|
|
2424
|
-
function Ot(r) {
|
|
2425
|
-
return r === "bar" || r === "line" || r === "area" || r === "pie" || r === "doughnut" || r === "radar" || r === "scatter" || r === "bubble" ? r : "bar";
|
|
2426
|
-
}
|
|
2427
|
-
function Bt(r) {
|
|
2428
|
-
return r === "bar" || r === "line" || r === "area" || r === "scatter" || r === "bubble";
|
|
2429
|
-
}
|
|
2430
|
-
function $t(r) {
|
|
2431
|
-
return r.map((t) => t.trim()).filter(Boolean);
|
|
2432
|
-
}
|
|
2433
|
-
var R = class extends HTMLElement {
|
|
2434
|
-
_canvas;
|
|
2435
|
-
_status;
|
|
2436
|
-
_runtime = null;
|
|
2437
|
-
_loadPromise = null;
|
|
2438
|
-
_chart = null;
|
|
2439
|
-
_renderedType = null;
|
|
2440
|
-
_dataInput = null;
|
|
2441
|
-
_optionsOverride = null;
|
|
2442
|
-
_syncFrame = 0;
|
|
2443
|
-
static get observedAttributes() {
|
|
2444
|
-
return ["type", "legend", "stacked", "labels"];
|
|
2445
|
-
}
|
|
2446
|
-
get type() {
|
|
2447
|
-
return Ot(this.getAttribute("type"));
|
|
2448
|
-
}
|
|
2449
|
-
set type(t) {
|
|
2450
|
-
this.setAttribute("type", t);
|
|
2451
|
-
}
|
|
2452
|
-
get legend() {
|
|
2453
|
-
return Ft(this.getAttribute("legend"));
|
|
2454
|
-
}
|
|
2455
|
-
set legend(t) {
|
|
2456
|
-
this.setAttribute("legend", t);
|
|
2457
|
-
}
|
|
2458
|
-
get stacked() {
|
|
2459
|
-
return this.hasAttribute("stacked");
|
|
2460
|
-
}
|
|
2461
|
-
set stacked(t) {
|
|
2462
|
-
this.toggleAttribute("stacked", t);
|
|
2463
|
-
}
|
|
2464
|
-
get labels() {
|
|
2465
|
-
return $t(It(this.getAttribute("labels")));
|
|
2466
|
-
}
|
|
2467
|
-
set labels(t) {
|
|
2468
|
-
this.setAttribute("labels", t.join(","));
|
|
2469
|
-
}
|
|
2470
|
-
get data() {
|
|
2471
|
-
return this._dataInput;
|
|
2472
|
-
}
|
|
2473
|
-
set data(t) {
|
|
2474
|
-
this._dataInput = t ? structuredClone(t) : null, this._scheduleSync();
|
|
2475
|
-
}
|
|
2476
|
-
get options() {
|
|
2477
|
-
return this._optionsOverride;
|
|
2478
|
-
}
|
|
2479
|
-
set options(t) {
|
|
2480
|
-
this._optionsOverride = t ? structuredClone(t) : null, this._renderChart();
|
|
2481
|
-
}
|
|
2482
|
-
constructor() {
|
|
2483
|
-
super();
|
|
2484
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
2485
|
-
e.textContent = ot, t.appendChild(e);
|
|
2486
|
-
let n = document.createElement("div");
|
|
2487
|
-
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);
|
|
2488
|
-
}
|
|
2489
|
-
connectedCallback() {
|
|
2490
|
-
this._canvas.addEventListener("click", this._handleCanvasClick), this._ensureRuntime().then(() => this._renderChart()), this._scheduleSync();
|
|
2491
|
-
}
|
|
2492
|
-
disconnectedCallback() {
|
|
2493
|
-
this._canvas.removeEventListener("click", this._handleCanvasClick), this._syncFrame !== 0 && (cancelAnimationFrame(this._syncFrame), this._syncFrame = 0), this._chart?.destroy(), this._chart = null, this._renderedType = null;
|
|
2494
|
-
}
|
|
2495
|
-
attributeChangedCallback() {
|
|
2496
|
-
this._scheduleSync();
|
|
2497
|
-
}
|
|
2498
|
-
_handleCanvasClick = (t) => {
|
|
2499
|
-
if (!this._chart) return;
|
|
2500
|
-
let n = this._chart.getElementsAtEventForMode(t, "nearest", { intersect: true }, true)[0];
|
|
2501
|
-
if (!n) return;
|
|
2502
|
-
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;
|
|
2503
|
-
this.dispatchEvent(new CustomEvent("dt-chart-click", { bubbles: true, composed: true, detail: { label: i, datasetIndex: n.datasetIndex, index: n.index, value: o } }));
|
|
2504
|
-
};
|
|
2505
|
-
_scheduleSync() {
|
|
2506
|
-
this._syncFrame === 0 && (this._syncFrame = requestAnimationFrame(() => {
|
|
2507
|
-
this._syncFrame = 0, this._syncFromCurrentSource();
|
|
2508
|
-
}));
|
|
2509
|
-
}
|
|
2510
|
-
_syncFromCurrentSource() {
|
|
2511
|
-
this._renderChart();
|
|
2512
|
-
}
|
|
2513
|
-
async _ensureRuntime() {
|
|
2514
|
-
return this._runtime ? this._runtime : (this._loadPromise || (this._loadPromise = at().then((t) => (this._runtime = t, t))), this._loadPromise);
|
|
2515
|
-
}
|
|
2516
|
-
async _renderChart() {
|
|
2517
|
-
let t = this._dataInput;
|
|
2518
|
-
if (!t) {
|
|
2519
|
-
this._setStatus("Waiting for data");
|
|
2520
|
-
return;
|
|
2521
|
-
}
|
|
2522
|
-
let e = await this._ensureRuntime(), n = this._buildConfig(e, t), i = n.type;
|
|
2523
|
-
!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");
|
|
2524
|
-
}
|
|
2525
|
-
_buildConfig(t, e) {
|
|
2526
|
-
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) => {
|
|
2527
|
-
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" };
|
|
2528
|
-
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;
|
|
2529
|
-
}) }, _ = { 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 };
|
|
2530
|
-
return { type: l, data: f, options: lt(_, this._optionsOverride ?? {}) };
|
|
2531
|
-
}
|
|
2532
|
-
_setStatus(t) {
|
|
2533
|
-
if (!t) {
|
|
2534
|
-
this._status.hidden = true;
|
|
2535
|
-
return;
|
|
2536
|
-
}
|
|
2537
|
-
this._status.hidden = false, this._status.textContent = t;
|
|
2538
|
-
}
|
|
2539
|
-
};
|
|
2540
|
-
function Xt(r, t, e) {
|
|
2541
|
-
let n = X(r), i = X(t);
|
|
2542
|
-
if (!n || !i) return r;
|
|
2543
|
-
let s = v(e, 0, 1), o = ((i.h - n.h) % 360 + 540) % 360 - 180;
|
|
2544
|
-
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 });
|
|
2545
|
-
}
|
|
2546
|
-
var ct = `:host {
|
|
1282
|
+
`,Z=null;function ge(){return window.__DtChart?Promise.resolve(window.__DtChart):Z||(Z=new Promise((t,e)=>{let r=document.createElement("script");r.src="/api/ui/chart.umd.js",r.async=!0,r.dataset.dtChart="true",r.onload=()=>{if(window.__DtChart){t(window.__DtChart);return}e(new Error("Chart runtime loaded without a __DtChart export."))},r.onerror=()=>e(new Error("Failed to load the Chart.js runtime bundle.")),document.head.appendChild(r)}),Z)}function j(t,e,r){return Math.min(r,Math.max(e,t))}function be(t){return t?t.split(",").map(e=>e.trim()).filter(Boolean):[]}function tt(t){let e=t.trim().match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);if(e){let n=e[1],s=n.length===3?n.split("").map(l=>`${l}${l}`).join(""):n,a=parseInt(s.slice(0,2),16)/255,o=parseInt(s.slice(2,4),16)/255,d=parseInt(s.slice(4,6),16)/255;return mt(a,o,d)}let r=t.trim().match(/^rgba?\((\d+(?:\.\d+)?)[,\s]+(\d+(?:\.\d+)?)[,\s]+(\d+(?:\.\d+)?)(?:[,/\s]+[\d.]+)?\)$/i);if(r)return mt(Number(r[1])/255,Number(r[2])/255,Number(r[3])/255);let i=t.trim().match(/^hsla?\(([-\d.]+)(?:deg)?[,\s]+([\d.]+)%[,\s]+([\d.]+)%(?:[,/\s]+[\d.]+)?\)$/i);return i?{h:(Number(i[1])%360+360)%360,s:j(Number(i[2]),0,100),l:j(Number(i[3]),0,100)}:null}function mt(t,e,r){let i=Math.max(t,e,r),n=Math.min(t,e,r),s=i-n,a=0,o=(i+n)/2,d=s===0?0:s/(1-Math.abs(2*o-1));if(s!==0)switch(i){case t:a=60*((e-r)/s%6);break;case e:a=60*((r-t)/s+2);break;default:a=60*((t-e)/s+4);break}return{h:(a+360)%360,s:Math.round(d*100),l:Math.round(o*100)}}function P(t,e=1){return`hsla(${Math.round(t.h)} ${Math.round(t.s)}% ${Math.round(t.l)}% / ${e})`}function ve(t){let e=tt(t)??{h:185,s:88,l:56};return[0,32,68,118,164,212,258,304].map((r,i)=>({h:(e.h+r)%360,s:j(e.s-i*2,55,90),l:j(e.l+(i%2===0?0:6)-i,38,66)}))}function K(t){return!!t&&typeof t=="object"&&!Array.isArray(t)}function gt(t,e){if(!K(t)||!K(e))return e??t;let r={...t};for(let[i,n]of Object.entries(e)){let s=r[i];r[i]=K(s)&&K(n)?gt(s,n):n}return r}function fe(t){return t==="top"||t==="bottom"||t==="left"||t==="right"?t:"none"}function _e(t){return t==="bar"||t==="line"||t==="area"||t==="pie"||t==="doughnut"||t==="radar"||t==="scatter"||t==="bubble"?t:"bar"}function xe(t){return t==="bar"||t==="line"||t==="area"||t==="scatter"||t==="bubble"}function we(t){return t.map(e=>e.trim()).filter(Boolean)}var ye=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 _e(this.getAttribute("type"))}set type(t){this.setAttribute("type",t)}get legend(){return fe(this.getAttribute("legend"))}set legend(t){this.setAttribute("legend",t)}get stacked(){return this.hasAttribute("stacked")}set stacked(t){this.toggleAttribute("stacked",t)}get labels(){return we(be(this.getAttribute("labels")))}set labels(t){this.setAttribute("labels",t.join(","))}get data(){return this._dataInput}set data(t){this._dataInput=t?structuredClone(t):null,this._scheduleSync()}get options(){return this._optionsOverride}set options(t){this._optionsOverride=t?structuredClone(t):null,this._renderChart()}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=me,t.appendChild(e);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),t.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=t=>{if(!this._chart)return;let e=this._chart.getElementsAtEventForMode(t,"nearest",{intersect:!0},!0)[0];if(!e)return;let r=Array.isArray(this._chart.data.labels)?this._chart.data.labels[e.index]??null:null,i=this._chart.data.datasets[e.datasetIndex],n=Array.isArray(i?.data)?i.data[e.index]:void 0;this.dispatchEvent(new CustomEvent("dt-chart-click",{bubbles:!0,composed:!0,detail:{label:r,datasetIndex:e.datasetIndex,index:e.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=ge().then(t=>(this._runtime=t,t))),this._loadPromise)}async _renderChart(){let t=this._dataInput;if(!t){this._setStatus("Waiting for data");return}let e=await this._ensureRuntime(),r=this._buildConfig(e,t),i=r.type;!this._chart||this._renderedType!==i?(this._chart?.destroy(),this._chart=new e.Chart(this._canvas,r),this._renderedType=i):(this._chart.data=r.data,this._chart.options=r.options,this._chart.update()),this._setStatus(t.datasets.length>0?null:"Waiting for data")}_buildConfig(t,e){let r=getComputedStyle(this),i=r.getPropertyValue("--dt-accent").trim()||"#42d4ff",n=r.getPropertyValue("--dt-text").trim()||"#d6ebff",s=r.getPropertyValue("--dt-text-muted").trim()||"#7b93a6",a=r.getPropertyValue("--dt-border").trim()||"rgba(123, 147, 166, 0.3)",o=r.getPropertyValue("--font-mono").trim()||"'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, monospace",d=ve(i),l=this.type==="area"?"line":this.type,g={labels:e.labels??this.labels,datasets:e.datasets.map((b,w)=>{let C=d[w%d.length],m=b.color??P(C,1),M={label:b.label??"",data:b.data,backgroundColor:l==="line"||l==="radar"||l==="scatter"?P(C,l==="scatter"?.95:.24):m,borderColor:m,pointBackgroundColor:m,pointBorderColor:m,pointHoverBackgroundColor:m,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"?.32:void 0,fill:this.type==="area"};return l==="pie"||l==="doughnut"?{...M,backgroundColor:Array.isArray(b.data)?b.data.map((F,E)=>P(d[E%d.length],.86)):m,borderColor:Array.isArray(b.data)?b.data.map((F,E)=>P(d[E%d.length],1)):m,borderWidth:1}:l==="scatter"||l==="bubble"?{...M,showLine:!1,backgroundColor:P(C,.78)}:M})},_={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:o,size:11}}},tooltip:{backgroundColor:"rgba(10, 18, 24, 0.92)",borderColor:ke(a,i,.35),borderWidth:1,titleColor:n,bodyColor:n,footerColor:s,titleFont:{family:o,size:11},bodyFont:{family:o,size:11},padding:10}},scales:xe(this.type)?{x:{stacked:this.stacked,grid:{display:!1,color:a},border:{color:a},ticks:{color:s,font:{family:o,size:11}}},y:{stacked:this.stacked,beginAtZero:!0,grid:{display:!1,color:a},border:{color:a},ticks:{color:s,font:{family:o,size:11}}}}:l==="radar"?{r:{angleLines:{color:a},grid:{color:a},pointLabels:{color:s,font:{family:o,size:11}},ticks:{color:s,backdropColor:"transparent",font:{family:o,size:10}}}}:void 0};return{type:l,data:g,options:gt(_,this._optionsOverride??{})}}_setStatus(t){if(!t){this._status.hidden=!0;return}this._status.hidden=!1,this._status.textContent=t}};function ke(t,e,r){let i=tt(t),n=tt(e);if(!i||!n)return t;let s=j(r,0,1),a=((n.h-i.h)%360+540)%360-180;return P({h:(i.h+a*s+360)%360,s:i.s+(n.s-i.s)*s,l:i.l+(n.l-i.l)*s})}var Ce=`:host {
|
|
2547
1283
|
display: block;
|
|
2548
1284
|
color: var(--dt-text);
|
|
2549
1285
|
font-family: var(--font-sans, 'Inter', sans-serif);
|
|
@@ -2715,108 +1451,13 @@ var ct = `:host {
|
|
|
2715
1451
|
opacity: 0;
|
|
2716
1452
|
}
|
|
2717
1453
|
}
|
|
2718
|
-
|
|
2719
|
-
|
|
2720
|
-
function
|
|
2721
|
-
|
|
2722
|
-
|
|
2723
|
-
|
|
2724
|
-
|
|
2725
|
-
r(window.__DtMarked);
|
|
2726
|
-
return;
|
|
2727
|
-
}
|
|
2728
|
-
t(new Error("Marked runtime loaded without a __DtMarked export."));
|
|
2729
|
-
}, e.onerror = () => t(new Error("Failed to load the marked runtime bundle.")), document.head.appendChild(e);
|
|
2730
|
-
}), V);
|
|
2731
|
-
}
|
|
2732
|
-
function ut(r) {
|
|
2733
|
-
return r.replaceAll(`\r
|
|
2734
|
-
`, `
|
|
2735
|
-
`);
|
|
2736
|
-
}
|
|
2737
|
-
function Jt(r) {
|
|
2738
|
-
let t = ut(r).split(`
|
|
2739
|
-
`);
|
|
2740
|
-
for (; t.length > 0 && t[0].trim() === ""; ) t.shift();
|
|
2741
|
-
for (; t.length > 0 && t[t.length - 1].trim() === ""; ) t.pop();
|
|
2742
|
-
let e = t.filter((i) => i.trim() !== "").map((i) => i.match(/^\s*/)?.[0].length ?? 0), n = e.length > 0 ? Math.min(...e) : 0;
|
|
2743
|
-
return n === 0 ? t.join(`
|
|
2744
|
-
`) : t.map((i) => i.slice(n)).join(`
|
|
2745
|
-
`);
|
|
2746
|
-
}
|
|
2747
|
-
function Wt(r) {
|
|
2748
|
-
let t = ut(r);
|
|
2749
|
-
if ((t.match(/(^|\n)(```|~~~)/g) ?? []).length % 2 === 0) return t;
|
|
2750
|
-
let n = t.includes("~~~") && !t.includes("```") ? "~~~" : "```";
|
|
2751
|
-
return `${t}
|
|
2752
|
-
${n}`;
|
|
2753
|
-
}
|
|
2754
|
-
var P = class extends HTMLElement {
|
|
2755
|
-
_body;
|
|
2756
|
-
_caret;
|
|
2757
|
-
_contentOverride = null;
|
|
2758
|
-
_runtime = null;
|
|
2759
|
-
_loadPromise = null;
|
|
2760
|
-
_observer = null;
|
|
2761
|
-
_renderFrame = 0;
|
|
2762
|
-
static get observedAttributes() {
|
|
2763
|
-
return ["streaming", "unsafe-html"];
|
|
2764
|
-
}
|
|
2765
|
-
get content() {
|
|
2766
|
-
return this._contentOverride ?? this._readInlineMarkdown();
|
|
2767
|
-
}
|
|
2768
|
-
set content(t) {
|
|
2769
|
-
this._contentOverride = String(t ?? ""), this._scheduleRender();
|
|
2770
|
-
}
|
|
2771
|
-
get streaming() {
|
|
2772
|
-
return this.hasAttribute("streaming");
|
|
2773
|
-
}
|
|
2774
|
-
set streaming(t) {
|
|
2775
|
-
this.toggleAttribute("streaming", t);
|
|
2776
|
-
}
|
|
2777
|
-
get unsafeHtml() {
|
|
2778
|
-
return this.hasAttribute("unsafe-html");
|
|
2779
|
-
}
|
|
2780
|
-
set unsafeHtml(t) {
|
|
2781
|
-
this.toggleAttribute("unsafe-html", t);
|
|
2782
|
-
}
|
|
2783
|
-
constructor() {
|
|
2784
|
-
super();
|
|
2785
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
2786
|
-
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);
|
|
2787
|
-
}
|
|
2788
|
-
connectedCallback() {
|
|
2789
|
-
this._observer || (this._observer = new MutationObserver(() => {
|
|
2790
|
-
this._contentOverride === null && this._scheduleRender();
|
|
2791
|
-
}), this._observer.observe(this, { childList: true, characterData: true, subtree: true })), this._ensureRuntime(), this._scheduleRender();
|
|
2792
|
-
}
|
|
2793
|
-
disconnectedCallback() {
|
|
2794
|
-
this._observer?.disconnect(), this._observer = null, this._renderFrame !== 0 && (cancelAnimationFrame(this._renderFrame), this._renderFrame = 0);
|
|
2795
|
-
}
|
|
2796
|
-
attributeChangedCallback() {
|
|
2797
|
-
this._scheduleRender();
|
|
2798
|
-
}
|
|
2799
|
-
_onLinkClick = (t) => {
|
|
2800
|
-
let n = t.composedPath().find((i) => i instanceof HTMLAnchorElement);
|
|
2801
|
-
n && (t.preventDefault(), this.dispatchEvent(new CustomEvent("dt-link-click", { bubbles: true, composed: true, detail: { href: n.getAttribute("href") ?? "#" } })));
|
|
2802
|
-
};
|
|
2803
|
-
_readInlineMarkdown() {
|
|
2804
|
-
return Jt(this.textContent ?? "");
|
|
2805
|
-
}
|
|
2806
|
-
_scheduleRender() {
|
|
2807
|
-
this._renderFrame === 0 && (this._renderFrame = requestAnimationFrame(() => {
|
|
2808
|
-
this._renderFrame = 0, this._render();
|
|
2809
|
-
}));
|
|
2810
|
-
}
|
|
2811
|
-
async _ensureRuntime() {
|
|
2812
|
-
return this._runtime ? this._runtime : (this._loadPromise || (this._loadPromise = ht().then((t) => (this._runtime = t, t))), this._loadPromise);
|
|
2813
|
-
}
|
|
2814
|
-
async _render() {
|
|
2815
|
-
let t = await this._ensureRuntime(), e = this.content;
|
|
2816
|
-
this.streaming && (e = Wt(e)), this._body.innerHTML = t.render(e, { unsafeHtml: this.unsafeHtml }), this._caret.hidden = !this.streaming;
|
|
2817
|
-
}
|
|
2818
|
-
};
|
|
2819
|
-
var pt = `:host {
|
|
1454
|
+
`,et=null;function Ee(){return window.__DtMarked?Promise.resolve(window.__DtMarked):et||(et=new Promise((t,e)=>{let r=document.createElement("script");r.src="/api/ui/marked.js",r.async=!0,r.dataset.dtMarked="true",r.onload=()=>{if(window.__DtMarked){t(window.__DtMarked);return}e(new Error("Marked runtime loaded without a __DtMarked export."))},r.onerror=()=>e(new Error("Failed to load the marked runtime bundle.")),document.head.appendChild(r)}),et)}function bt(t){return t.replaceAll(`\r
|
|
1455
|
+
`,`
|
|
1456
|
+
`)}function Ae(t){let e=bt(t).split(`
|
|
1457
|
+
`);for(;e.length>0&&e[0].trim()==="";)e.shift();for(;e.length>0&&e[e.length-1].trim()==="";)e.pop();let r=e.filter(n=>n.trim()!=="").map(n=>n.match(/^\s*/)?.[0].length??0),i=r.length>0?Math.min(...r):0;return i===0?e.join(`
|
|
1458
|
+
`):e.map(n=>n.slice(i)).join(`
|
|
1459
|
+
`)}function Se(t){let e=bt(t);if((e.match(/(^|\n)(```|~~~)/g)??[]).length%2===0)return e;let r=e.includes("~~~")&&!e.includes("```")?"~~~":"```";return`${e}
|
|
1460
|
+
${r}`}var ze=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(t){this._contentOverride=String(t??""),this._scheduleRender()}get streaming(){return this.hasAttribute("streaming")}set streaming(t){this.toggleAttribute("streaming",t)}get unsafeHtml(){return this.hasAttribute("unsafe-html")}set unsafeHtml(t){this.toggleAttribute("unsafe-html",t)}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=Ce,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=!0,t.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=t=>{let e=t.composedPath().find(r=>r instanceof HTMLAnchorElement);e&&(t.preventDefault(),this.dispatchEvent(new CustomEvent("dt-link-click",{bubbles:!0,composed:!0,detail:{href:e.getAttribute("href")??"#"}})))};_readInlineMarkdown(){return Ae(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=Ee().then(t=>(this._runtime=t,t))),this._loadPromise)}async _render(){let t=await this._ensureRuntime(),e=this.content;this.streaming&&(e=Se(e)),this._body.innerHTML=t.render(e,{unsafeHtml:this.unsafeHtml}),this._caret.hidden=!this.streaming}},Me=`:host {
|
|
2820
1461
|
display: block;
|
|
2821
1462
|
min-height: 240px;
|
|
2822
1463
|
color: var(--dt-text);
|
|
@@ -3036,760 +1677,21 @@ var pt = `:host {
|
|
|
3036
1677
|
.milkdown .editor td {
|
|
3037
1678
|
border: 1px solid var(--dt-border);
|
|
3038
1679
|
}
|
|
3039
|
-
|
|
3040
|
-
|
|
3041
|
-
function
|
|
3042
|
-
|
|
3043
|
-
|
|
3044
|
-
|
|
3045
|
-
|
|
3046
|
-
|
|
3047
|
-
|
|
3048
|
-
|
|
3049
|
-
|
|
3050
|
-
|
|
3051
|
-
|
|
3052
|
-
|
|
3053
|
-
|
|
3054
|
-
|
|
3055
|
-
|
|
3056
|
-
|
|
3057
|
-
_status;
|
|
3058
|
-
_runtime = null;
|
|
3059
|
-
_loadPromise = null;
|
|
3060
|
-
_editor = null;
|
|
3061
|
-
_pendingValue = "";
|
|
3062
|
-
_changeTimer = null;
|
|
3063
|
-
_setupToken = 0;
|
|
3064
|
-
_suppressNextChange = false;
|
|
3065
|
-
static get observedAttributes() {
|
|
3066
|
-
return ["placeholder", "readonly"];
|
|
3067
|
-
}
|
|
3068
|
-
get placeholder() {
|
|
3069
|
-
return this.getAttribute("placeholder") ?? "";
|
|
3070
|
-
}
|
|
3071
|
-
set placeholder(t) {
|
|
3072
|
-
this.setAttribute("placeholder", t);
|
|
3073
|
-
}
|
|
3074
|
-
get readonly() {
|
|
3075
|
-
return this.hasAttribute("readonly");
|
|
3076
|
-
}
|
|
3077
|
-
set readonly(t) {
|
|
3078
|
-
this.toggleAttribute("readonly", t);
|
|
3079
|
-
}
|
|
3080
|
-
get value() {
|
|
3081
|
-
return this._editor && (this._pendingValue = this._editor.getMarkdown()), this._pendingValue;
|
|
3082
|
-
}
|
|
3083
|
-
set value(t) {
|
|
3084
|
-
let e = String(t ?? "");
|
|
3085
|
-
this._pendingValue = e, this._editor && this._runtime && this._editor.getMarkdown() !== e && (this._suppressNextChange = true, this._editor.editor.action(this._runtime.replaceAll(e)));
|
|
3086
|
-
}
|
|
3087
|
-
constructor() {
|
|
3088
|
-
super();
|
|
3089
|
-
let t = this.attachShadow({ mode: "open" }), e = document.createElement("style");
|
|
3090
|
-
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";
|
|
3091
|
-
let n = document.createElement("div");
|
|
3092
|
-
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);
|
|
3093
|
-
}
|
|
3094
|
-
connectedCallback() {
|
|
3095
|
-
this._initializeEditor();
|
|
3096
|
-
}
|
|
3097
|
-
disconnectedCallback() {
|
|
3098
|
-
this._setupToken += 1, this._clearChangeTimer(), this._destroyEditor();
|
|
3099
|
-
}
|
|
3100
|
-
attributeChangedCallback(t) {
|
|
3101
|
-
if (t === "readonly") {
|
|
3102
|
-
this._editor?.setReadonly(this.readonly);
|
|
3103
|
-
return;
|
|
3104
|
-
}
|
|
3105
|
-
t === "placeholder" && this.isConnected && this._initializeEditor(true);
|
|
3106
|
-
}
|
|
3107
|
-
async _ensureRuntime() {
|
|
3108
|
-
return this._runtime ? this._runtime : (this._loadPromise || (this._loadPromise = mt().then((t) => (this._runtime = t, this._runtimeStyle.textContent = t.cssText, t))), this._loadPromise);
|
|
3109
|
-
}
|
|
3110
|
-
async _initializeEditor(t = false) {
|
|
3111
|
-
let e = ++this._setupToken;
|
|
3112
|
-
if (this._setStatus("Loading editor"), t) await this._destroyEditor();
|
|
3113
|
-
else if (this._editor) {
|
|
3114
|
-
this._setStatus(null);
|
|
3115
|
-
return;
|
|
3116
|
-
}
|
|
3117
|
-
try {
|
|
3118
|
-
let n = await this._ensureRuntime();
|
|
3119
|
-
if (!this.isConnected || e !== this._setupToken) return;
|
|
3120
|
-
this._content.replaceChildren();
|
|
3121
|
-
let i = document.createElement("div");
|
|
3122
|
-
i.className = "dt-markdown-editor__content", this._content.appendChild(i);
|
|
3123
|
-
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" } } });
|
|
3124
|
-
if (s.on((o) => {
|
|
3125
|
-
o.markdownUpdated((a, d) => {
|
|
3126
|
-
if (this._pendingValue = d, this._suppressNextChange) {
|
|
3127
|
-
this._suppressNextChange = false;
|
|
3128
|
-
return;
|
|
3129
|
-
}
|
|
3130
|
-
this._queueChange(d);
|
|
3131
|
-
}), o.focus(() => {
|
|
3132
|
-
this.dispatchEvent(new CustomEvent("dt-focus", { bubbles: true, composed: true }));
|
|
3133
|
-
}), o.blur(() => {
|
|
3134
|
-
this.dispatchEvent(new CustomEvent("dt-blur", { bubbles: true, composed: true }));
|
|
3135
|
-
});
|
|
3136
|
-
}), await s.create(), !this.isConnected || e !== this._setupToken) {
|
|
3137
|
-
await s.destroy();
|
|
3138
|
-
return;
|
|
3139
|
-
}
|
|
3140
|
-
this._editor = s, this._editor.setReadonly(this.readonly), this._pendingValue = this._editor.getMarkdown(), this._setStatus(null);
|
|
3141
|
-
} catch {
|
|
3142
|
-
e === this._setupToken && this._setStatus("Failed to load editor");
|
|
3143
|
-
}
|
|
3144
|
-
}
|
|
3145
|
-
async _destroyEditor() {
|
|
3146
|
-
let t = this._editor;
|
|
3147
|
-
if (this._editor = null, !!t) try {
|
|
3148
|
-
await t.destroy();
|
|
3149
|
-
} catch {
|
|
3150
|
-
}
|
|
3151
|
-
}
|
|
3152
|
-
_queueChange(t) {
|
|
3153
|
-
this._clearChangeTimer(), this._changeTimer = setTimeout(() => {
|
|
3154
|
-
this._changeTimer = null, this.dispatchEvent(new CustomEvent("dt-change", { bubbles: true, composed: true, detail: { value: t } }));
|
|
3155
|
-
}, 300);
|
|
3156
|
-
}
|
|
3157
|
-
_clearChangeTimer() {
|
|
3158
|
-
this._changeTimer && (clearTimeout(this._changeTimer), this._changeTimer = null);
|
|
3159
|
-
}
|
|
3160
|
-
_setStatus(t) {
|
|
3161
|
-
if (t) {
|
|
3162
|
-
this._status.hidden = false, this._status.textContent = t;
|
|
3163
|
-
return;
|
|
3164
|
-
}
|
|
3165
|
-
this._status.hidden = true;
|
|
3166
|
-
}
|
|
3167
|
-
};
|
|
3168
|
-
customElements.get("dt-tooltip") || customElements.define("dt-tooltip", x);
|
|
3169
|
-
customElements.get("dt-card") || customElements.define("dt-card", w);
|
|
3170
|
-
customElements.get("dt-select") || customElements.define("dt-select", y);
|
|
3171
|
-
customElements.get("dt-grid") || customElements.define("dt-grid", k);
|
|
3172
|
-
customElements.get("dt-stack") || customElements.define("dt-stack", C);
|
|
3173
|
-
customElements.get("dt-stat") || customElements.define("dt-stat", E);
|
|
3174
|
-
customElements.get("dt-badge") || customElements.define("dt-badge", S);
|
|
3175
|
-
customElements.get("dt-button") || customElements.define("dt-button", D);
|
|
3176
|
-
customElements.get("dt-divider") || customElements.define("dt-divider", A);
|
|
3177
|
-
customElements.get("dt-list-view") || customElements.define("dt-list-view", z);
|
|
3178
|
-
customElements.get("dt-table-view") || customElements.define("dt-table-view", T);
|
|
3179
|
-
customElements.get("dt-column") || customElements.define("dt-column", b);
|
|
3180
|
-
customElements.get("dt-chart") || customElements.define("dt-chart", R);
|
|
3181
|
-
customElements.get("dt-markdown") || customElements.define("dt-markdown", P);
|
|
3182
|
-
customElements.get("dt-markdown-editor") || customElements.define("dt-markdown-editor", N);
|
|
3183
|
-
|
|
3184
|
-
// src/components/NoteEditor.tsx
|
|
3185
|
-
function stripFrontMatter(raw) {
|
|
3186
|
-
const match = raw.match(/^---\r?\n[\s\S]*?\r?\n---\r?\n?([\s\S]*)$/);
|
|
3187
|
-
return match ? match[1] : raw;
|
|
3188
|
-
}
|
|
3189
|
-
var NoteEditor = forwardRef(function NoteEditor2({ note, loading, onSave }, ref) {
|
|
3190
|
-
const editorRef = useRef(null);
|
|
3191
|
-
const [saveStatus, setSaveStatus] = useState("idle");
|
|
3192
|
-
const saveTimerRef = useRef(null);
|
|
3193
|
-
const onSaveRef = useRef(onSave);
|
|
3194
|
-
onSaveRef.current = onSave;
|
|
3195
|
-
useEffect(() => {
|
|
3196
|
-
if (editorRef.current && note) {
|
|
3197
|
-
const bodyContent = stripFrontMatter(note.content);
|
|
3198
|
-
editorRef.current.value = bodyContent;
|
|
3199
|
-
}
|
|
3200
|
-
}, [note?.id]);
|
|
3201
|
-
useEffect(() => {
|
|
3202
|
-
const editor = editorRef.current;
|
|
3203
|
-
if (!editor) return;
|
|
3204
|
-
const handleChange = (e) => {
|
|
3205
|
-
const detail = e.detail;
|
|
3206
|
-
if (!detail) return;
|
|
3207
|
-
if (saveTimerRef.current) clearTimeout(saveTimerRef.current);
|
|
3208
|
-
setSaveStatus("saving");
|
|
3209
|
-
saveTimerRef.current = setTimeout(() => {
|
|
3210
|
-
onSaveRef.current(detail.value);
|
|
3211
|
-
setSaveStatus("saved");
|
|
3212
|
-
}, 500);
|
|
3213
|
-
};
|
|
3214
|
-
editor.addEventListener("dt-change", handleChange);
|
|
3215
|
-
return () => editor.removeEventListener("dt-change", handleChange);
|
|
3216
|
-
}, []);
|
|
3217
|
-
useEffect(() => {
|
|
3218
|
-
return () => {
|
|
3219
|
-
if (saveTimerRef.current) clearTimeout(saveTimerRef.current);
|
|
3220
|
-
};
|
|
3221
|
-
}, []);
|
|
3222
|
-
useImperativeHandle(
|
|
3223
|
-
ref,
|
|
3224
|
-
() => ({
|
|
3225
|
-
getMarkdown() {
|
|
3226
|
-
return editorRef.current?.value ?? null;
|
|
3227
|
-
},
|
|
3228
|
-
setMarkdown(markdown) {
|
|
3229
|
-
if (editorRef.current) {
|
|
3230
|
-
editorRef.current.value = markdown;
|
|
3231
|
-
}
|
|
3232
|
-
},
|
|
3233
|
-
getCursorLine() {
|
|
3234
|
-
return 1;
|
|
3235
|
-
},
|
|
3236
|
-
getSelectedText() {
|
|
3237
|
-
return "";
|
|
3238
|
-
}
|
|
3239
|
-
}),
|
|
3240
|
-
[]
|
|
3241
|
-
);
|
|
3242
|
-
if (!note) {
|
|
3243
|
-
return /* @__PURE__ */ jsx("div", { className: NoteApp_default.editorPanel, children: /* @__PURE__ */ jsx("div", { className: NoteApp_default.editorPlaceholder, children: loading ? "Loading..." : "Select a note or create a new one" }) });
|
|
3244
|
-
}
|
|
3245
|
-
return /* @__PURE__ */ jsxs("div", { className: NoteApp_default.editorPanel, children: [
|
|
3246
|
-
/* @__PURE__ */ jsxs("div", { className: NoteApp_default.editorHeader, children: [
|
|
3247
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
3248
|
-
/* @__PURE__ */ jsx("div", { className: NoteApp_default.editorTitle, children: note.title }),
|
|
3249
|
-
note.tags.length > 0 && /* @__PURE__ */ jsx("div", { className: NoteApp_default.editorTags, children: note.tags.map((tag) => /* @__PURE__ */ jsx("span", { className: NoteApp_default.editorTag, children: tag }, tag)) })
|
|
3250
|
-
] }),
|
|
3251
|
-
/* @__PURE__ */ jsx("span", { className: saveStatus === "saving" ? NoteApp_default.saveStatusSaving : NoteApp_default.saveStatus, children: saveStatus === "saving" ? "Saving..." : saveStatus === "saved" ? "Saved" : "" })
|
|
3252
|
-
] }),
|
|
3253
|
-
/* @__PURE__ */ jsx("div", { className: NoteApp_default.editorBody, children: /* @__PURE__ */ jsx(
|
|
3254
|
-
"dt-markdown-editor",
|
|
3255
|
-
{
|
|
3256
|
-
ref: editorRef,
|
|
3257
|
-
placeholder: "Start writing...",
|
|
3258
|
-
style: { height: "100%" }
|
|
3259
|
-
}
|
|
3260
|
-
) })
|
|
3261
|
-
] });
|
|
3262
|
-
});
|
|
3263
|
-
|
|
3264
|
-
// src/components/NoteActions.tsx
|
|
3265
|
-
import { ActionsProvider, Action, useCommand } from "@desktalk/sdk";
|
|
3266
|
-
|
|
3267
|
-
// src/lib/frontmatter.ts
|
|
3268
|
-
var FM_REGEX = /^---\r?\n([\s\S]*?)\r?\n---\r?\n?([\s\S]*)$/;
|
|
3269
|
-
function parseFrontMatter(raw) {
|
|
3270
|
-
const match = raw.match(FM_REGEX);
|
|
3271
|
-
if (!match) {
|
|
3272
|
-
const heading = raw.match(/^#\s+(.+)$/m);
|
|
3273
|
-
return { title: heading ? heading[1].trim() : "Untitled", tags: [], created: null, body: raw };
|
|
3274
|
-
}
|
|
3275
|
-
const yaml = match[1];
|
|
3276
|
-
const body = match[2];
|
|
3277
|
-
let title = "Untitled";
|
|
3278
|
-
let tags = [];
|
|
3279
|
-
let created = null;
|
|
3280
|
-
let inTags = false;
|
|
3281
|
-
for (const line of yaml.split("\n")) {
|
|
3282
|
-
const trimmed = line.trim();
|
|
3283
|
-
if (trimmed.startsWith("title:")) {
|
|
3284
|
-
title = trimmed.slice(6).trim().replace(/^["']|["']$/g, "");
|
|
3285
|
-
inTags = false;
|
|
3286
|
-
} else if (trimmed.startsWith("created:")) {
|
|
3287
|
-
created = trimmed.slice(8).trim();
|
|
3288
|
-
inTags = false;
|
|
3289
|
-
} else if (trimmed.startsWith("tags:")) {
|
|
3290
|
-
inTags = true;
|
|
3291
|
-
const inline = trimmed.slice(5).trim();
|
|
3292
|
-
if (inline.startsWith("[") && inline.endsWith("]")) {
|
|
3293
|
-
tags = inline.slice(1, -1).split(",").map((t) => t.trim().replace(/^["']|["']$/g, "")).filter(Boolean);
|
|
3294
|
-
inTags = false;
|
|
3295
|
-
}
|
|
3296
|
-
} else if (inTags && trimmed.startsWith("- ")) {
|
|
3297
|
-
tags.push(
|
|
3298
|
-
trimmed.slice(2).trim().replace(/^["']|["']$/g, "")
|
|
3299
|
-
);
|
|
3300
|
-
} else {
|
|
3301
|
-
inTags = false;
|
|
3302
|
-
}
|
|
3303
|
-
}
|
|
3304
|
-
return { title, tags, created, body };
|
|
3305
|
-
}
|
|
3306
|
-
function serializeFrontMatter(title, tags, created, body) {
|
|
3307
|
-
const lines = ["---", `title: "${title.replace(/"/g, '\\"')}"`];
|
|
3308
|
-
if (tags.length > 0) {
|
|
3309
|
-
lines.push("tags:");
|
|
3310
|
-
for (const tag of tags) lines.push(` - ${tag}`);
|
|
3311
|
-
}
|
|
3312
|
-
lines.push(`created: ${created}`, "---", "", body);
|
|
3313
|
-
return lines.join("\n");
|
|
3314
|
-
}
|
|
3315
|
-
|
|
3316
|
-
// src/components/NoteActions.tsx
|
|
3317
|
-
function computeDiff(oldContent, newContent, oldText, newText, matchIndex) {
|
|
3318
|
-
const linesBefore = oldContent.substring(0, matchIndex).split("\n");
|
|
3319
|
-
const firstChangedLine = linesBefore.length;
|
|
3320
|
-
const oldLines = oldText.split("\n");
|
|
3321
|
-
const newLines = newText.split("\n");
|
|
3322
|
-
const contextStart = Math.max(0, firstChangedLine - 4);
|
|
3323
|
-
const allOldLines = oldContent.split("\n");
|
|
3324
|
-
const allNewLines = newContent.split("\n");
|
|
3325
|
-
const lines = [];
|
|
3326
|
-
lines.push(
|
|
3327
|
-
`@@ -${firstChangedLine},${oldLines.length} +${firstChangedLine},${newLines.length} @@`
|
|
3328
|
-
);
|
|
3329
|
-
for (let i = contextStart; i < firstChangedLine - 1; i++) {
|
|
3330
|
-
lines.push(` ${allOldLines[i]}`);
|
|
3331
|
-
}
|
|
3332
|
-
for (const l of oldLines) {
|
|
3333
|
-
lines.push(`-${l}`);
|
|
3334
|
-
}
|
|
3335
|
-
for (const l of newLines) {
|
|
3336
|
-
lines.push(`+${l}`);
|
|
3337
|
-
}
|
|
3338
|
-
const afterStart = firstChangedLine - 1 + oldLines.length;
|
|
3339
|
-
const afterEnd = Math.min(allNewLines.length, afterStart + 3);
|
|
3340
|
-
for (let i = afterStart; i < afterEnd; i++) {
|
|
3341
|
-
if (allNewLines[i] !== void 0) {
|
|
3342
|
-
lines.push(` ${allNewLines[i]}`);
|
|
3343
|
-
}
|
|
3344
|
-
}
|
|
3345
|
-
return { diff: lines.join("\n"), firstChangedLine };
|
|
3346
|
-
}
|
|
3347
|
-
function NoteActions({
|
|
3348
|
-
children,
|
|
3349
|
-
selectedNoteId,
|
|
3350
|
-
selectedNote,
|
|
3351
|
-
notes,
|
|
3352
|
-
editorRef,
|
|
3353
|
-
onNoteCreated,
|
|
3354
|
-
onNoteDeleted,
|
|
3355
|
-
onSearch,
|
|
3356
|
-
onNoteUpdated,
|
|
3357
|
-
onSelectNote,
|
|
3358
|
-
onRefresh: _onRefresh
|
|
3359
|
-
}) {
|
|
3360
|
-
const createNote = useCommand("notes.create");
|
|
3361
|
-
const deleteNote = useCommand("notes.delete");
|
|
3362
|
-
const searchNotes = useCommand("notes.search");
|
|
3363
|
-
const updateNote = useCommand(
|
|
3364
|
-
"notes.update"
|
|
3365
|
-
);
|
|
3366
|
-
const handleCreate = useCallback(
|
|
3367
|
-
async (params) => {
|
|
3368
|
-
const note = await createNote({
|
|
3369
|
-
title: params?.title || void 0,
|
|
3370
|
-
content: params?.content || void 0,
|
|
3371
|
-
tags: params?.tags || void 0,
|
|
3372
|
-
path: params?.path || void 0
|
|
3373
|
-
});
|
|
3374
|
-
onNoteCreated(note);
|
|
3375
|
-
return note;
|
|
3376
|
-
},
|
|
3377
|
-
[createNote, onNoteCreated]
|
|
3378
|
-
);
|
|
3379
|
-
const handleDelete = useCallback(async () => {
|
|
3380
|
-
if (!selectedNoteId) return;
|
|
3381
|
-
await deleteNote({ id: selectedNoteId });
|
|
3382
|
-
onNoteDeleted(selectedNoteId);
|
|
3383
|
-
}, [deleteNote, selectedNoteId, onNoteDeleted]);
|
|
3384
|
-
const handleSearch = useCallback(
|
|
3385
|
-
async (params) => {
|
|
3386
|
-
const query = params?.query || "";
|
|
3387
|
-
onSearch(query);
|
|
3388
|
-
const results = await searchNotes({ query });
|
|
3389
|
-
return results;
|
|
3390
|
-
},
|
|
3391
|
-
[searchNotes, onSearch]
|
|
3392
|
-
);
|
|
3393
|
-
const getRawContent = useCallback(() => {
|
|
3394
|
-
if (!selectedNote) return null;
|
|
3395
|
-
const handle = editorRef.current;
|
|
3396
|
-
if (!handle) return null;
|
|
3397
|
-
const body = handle.getMarkdown();
|
|
3398
|
-
if (body === null) return null;
|
|
3399
|
-
return serializeFrontMatter(
|
|
3400
|
-
selectedNote.title,
|
|
3401
|
-
selectedNote.tags,
|
|
3402
|
-
selectedNote.createdAt,
|
|
3403
|
-
body
|
|
3404
|
-
);
|
|
3405
|
-
}, [selectedNote, editorRef]);
|
|
3406
|
-
const handleListNotes = useCallback(async () => {
|
|
3407
|
-
const listed = notes.slice(0, 20).map((n) => ({
|
|
3408
|
-
id: n.id,
|
|
3409
|
-
title: n.title,
|
|
3410
|
-
updatedAt: n.updatedAt,
|
|
3411
|
-
selected: n.id === selectedNoteId
|
|
3412
|
-
}));
|
|
3413
|
-
return { notes: listed };
|
|
3414
|
-
}, [notes, selectedNoteId]);
|
|
3415
|
-
const handleSelectNote = useCallback(
|
|
3416
|
-
async (params) => {
|
|
3417
|
-
const id = params?.id;
|
|
3418
|
-
if (!id) {
|
|
3419
|
-
return { success: false, error: "id parameter is required" };
|
|
3420
|
-
}
|
|
3421
|
-
const found = notes.find((n) => n.id === id);
|
|
3422
|
-
if (!found) {
|
|
3423
|
-
return { success: false, error: `Note not found: ${id}` };
|
|
3424
|
-
}
|
|
3425
|
-
await onSelectNote(id);
|
|
3426
|
-
return { success: true };
|
|
3427
|
-
},
|
|
3428
|
-
[notes, onSelectNote]
|
|
3429
|
-
);
|
|
3430
|
-
const handleGetEditingContext = useCallback(async () => {
|
|
3431
|
-
if (!selectedNoteId || !selectedNote) {
|
|
3432
|
-
return { error: "No note is currently open" };
|
|
3433
|
-
}
|
|
3434
|
-
const handle = editorRef.current;
|
|
3435
|
-
if (!handle) {
|
|
3436
|
-
return { error: "Editor is not ready" };
|
|
3437
|
-
}
|
|
3438
|
-
const content = getRawContent();
|
|
3439
|
-
if (content === null) {
|
|
3440
|
-
return { error: "Editor is not ready" };
|
|
3441
|
-
}
|
|
3442
|
-
return {
|
|
3443
|
-
id: selectedNote.id,
|
|
3444
|
-
title: selectedNote.title,
|
|
3445
|
-
content,
|
|
3446
|
-
cursorLine: handle.getCursorLine(),
|
|
3447
|
-
selectedText: handle.getSelectedText()
|
|
3448
|
-
};
|
|
3449
|
-
}, [selectedNoteId, selectedNote, editorRef, getRawContent]);
|
|
3450
|
-
const handleEditNote = useCallback(
|
|
3451
|
-
async (params) => {
|
|
3452
|
-
if (!selectedNoteId || !selectedNote) {
|
|
3453
|
-
return { success: false, error: "No note is currently open" };
|
|
3454
|
-
}
|
|
3455
|
-
const handle = editorRef.current;
|
|
3456
|
-
if (!handle) {
|
|
3457
|
-
return { success: false, error: "Editor is not ready" };
|
|
3458
|
-
}
|
|
3459
|
-
const oldText = params?.old_text;
|
|
3460
|
-
const newText = params?.new_text;
|
|
3461
|
-
if (oldText === void 0 || newText === void 0) {
|
|
3462
|
-
return { success: false, error: "Both old_text and new_text are required" };
|
|
3463
|
-
}
|
|
3464
|
-
const currentRaw = getRawContent();
|
|
3465
|
-
if (currentRaw === null) {
|
|
3466
|
-
return { success: false, error: "Editor is not ready" };
|
|
3467
|
-
}
|
|
3468
|
-
let newRaw;
|
|
3469
|
-
let matchIndex;
|
|
3470
|
-
if (oldText === "") {
|
|
3471
|
-
newRaw = newText + currentRaw;
|
|
3472
|
-
matchIndex = 0;
|
|
3473
|
-
} else {
|
|
3474
|
-
const firstIndex = currentRaw.indexOf(oldText);
|
|
3475
|
-
if (firstIndex === -1) {
|
|
3476
|
-
return { success: false, error: "Text not found in note" };
|
|
3477
|
-
}
|
|
3478
|
-
const secondIndex = currentRaw.indexOf(oldText, firstIndex + 1);
|
|
3479
|
-
if (secondIndex !== -1) {
|
|
3480
|
-
let count = 2;
|
|
3481
|
-
let searchFrom = secondIndex + 1;
|
|
3482
|
-
while (true) {
|
|
3483
|
-
const idx = currentRaw.indexOf(oldText, searchFrom);
|
|
3484
|
-
if (idx === -1) break;
|
|
3485
|
-
count++;
|
|
3486
|
-
searchFrom = idx + 1;
|
|
3487
|
-
}
|
|
3488
|
-
return {
|
|
3489
|
-
success: false,
|
|
3490
|
-
error: `Text appears ${count} times; provide more surrounding context to make it unique`
|
|
3491
|
-
};
|
|
3492
|
-
}
|
|
3493
|
-
newRaw = currentRaw.substring(0, firstIndex) + newText + currentRaw.substring(firstIndex + oldText.length);
|
|
3494
|
-
matchIndex = firstIndex;
|
|
3495
|
-
}
|
|
3496
|
-
const parsed = parseFrontMatter(newRaw);
|
|
3497
|
-
handle.setMarkdown(parsed.body);
|
|
3498
|
-
const tagsChanged = parsed.tags.length !== selectedNote.tags.length || parsed.tags.some((t, i) => t !== selectedNote.tags[i]);
|
|
3499
|
-
const titleChanged = parsed.title !== selectedNote.title;
|
|
3500
|
-
if (tagsChanged || titleChanged) {
|
|
3501
|
-
const updated = await updateNote({
|
|
3502
|
-
id: selectedNoteId,
|
|
3503
|
-
tags: parsed.tags,
|
|
3504
|
-
// Send the full content so backend can parse the new title
|
|
3505
|
-
content: parsed.body
|
|
3506
|
-
});
|
|
3507
|
-
onNoteUpdated(updated);
|
|
3508
|
-
}
|
|
3509
|
-
const { diff, firstChangedLine } = computeDiff(
|
|
3510
|
-
currentRaw,
|
|
3511
|
-
newRaw,
|
|
3512
|
-
oldText,
|
|
3513
|
-
newText,
|
|
3514
|
-
matchIndex
|
|
3515
|
-
);
|
|
3516
|
-
return { success: true, diff, firstChangedLine };
|
|
3517
|
-
},
|
|
3518
|
-
[selectedNoteId, selectedNote, editorRef, getRawContent, updateNote, onNoteUpdated]
|
|
3519
|
-
);
|
|
3520
|
-
return /* @__PURE__ */ jsxs(ActionsProvider, { children: [
|
|
3521
|
-
/* @__PURE__ */ jsx(
|
|
3522
|
-
Action,
|
|
3523
|
-
{
|
|
3524
|
-
name: "Create Note",
|
|
3525
|
-
description: "Create a new note with optional title, content, and path",
|
|
3526
|
-
params: {
|
|
3527
|
-
title: { type: "string", description: "Note title", required: false },
|
|
3528
|
-
content: { type: "string", description: "Note content in Markdown", required: false },
|
|
3529
|
-
tags: { type: "string", description: "Comma-separated tags", required: false },
|
|
3530
|
-
path: {
|
|
3531
|
-
type: "string",
|
|
3532
|
-
description: 'Relative path for the note (e.g. "work/meeting-notes"). Becomes the note ID. Auto-generated if omitted.',
|
|
3533
|
-
required: false
|
|
3534
|
-
}
|
|
3535
|
-
},
|
|
3536
|
-
handler: handleCreate
|
|
3537
|
-
}
|
|
3538
|
-
),
|
|
3539
|
-
/* @__PURE__ */ jsx(
|
|
3540
|
-
Action,
|
|
3541
|
-
{
|
|
3542
|
-
name: "Delete Note",
|
|
3543
|
-
description: "Delete the currently selected note",
|
|
3544
|
-
handler: handleDelete
|
|
3545
|
-
}
|
|
3546
|
-
),
|
|
3547
|
-
/* @__PURE__ */ jsx(
|
|
3548
|
-
Action,
|
|
3549
|
-
{
|
|
3550
|
-
name: "Search Notes",
|
|
3551
|
-
description: "Search notes by keyword",
|
|
3552
|
-
params: {
|
|
3553
|
-
query: { type: "string", description: "Search query", required: true }
|
|
3554
|
-
},
|
|
3555
|
-
handler: handleSearch
|
|
3556
|
-
}
|
|
3557
|
-
),
|
|
3558
|
-
/* @__PURE__ */ jsx(
|
|
3559
|
-
Action,
|
|
3560
|
-
{
|
|
3561
|
-
name: "List Notes",
|
|
3562
|
-
description: "Return the 20 most recent notes with selection status",
|
|
3563
|
-
handler: handleListNotes
|
|
3564
|
-
}
|
|
3565
|
-
),
|
|
3566
|
-
/* @__PURE__ */ jsx(
|
|
3567
|
-
Action,
|
|
3568
|
-
{
|
|
3569
|
-
name: "Select Note",
|
|
3570
|
-
description: "Select a note by ID and open it in the editor",
|
|
3571
|
-
params: {
|
|
3572
|
-
id: {
|
|
3573
|
-
type: "string",
|
|
3574
|
-
description: "Note ID (relative path without .md)",
|
|
3575
|
-
required: true
|
|
3576
|
-
}
|
|
3577
|
-
},
|
|
3578
|
-
handler: handleSelectNote
|
|
3579
|
-
}
|
|
3580
|
-
),
|
|
3581
|
-
/* @__PURE__ */ jsx(
|
|
3582
|
-
Action,
|
|
3583
|
-
{
|
|
3584
|
-
name: "Get Editing Context",
|
|
3585
|
-
description: "Return the current editor state for the selected note including content, cursor position, and selected text",
|
|
3586
|
-
handler: handleGetEditingContext
|
|
3587
|
-
}
|
|
3588
|
-
),
|
|
3589
|
-
/* @__PURE__ */ jsx(
|
|
3590
|
-
Action,
|
|
3591
|
-
{
|
|
3592
|
-
name: "Edit Note",
|
|
3593
|
-
description: "Apply a text replacement to the current note content including front matter. Use old_text to find exact text and new_text to replace it. To edit tags or title, modify the YAML front matter directly.",
|
|
3594
|
-
params: {
|
|
3595
|
-
old_text: {
|
|
3596
|
-
type: "string",
|
|
3597
|
-
description: "Exact text to find in the note content (must appear exactly once). Searches the full content including YAML front matter. Use empty string to insert at beginning.",
|
|
3598
|
-
required: true
|
|
3599
|
-
},
|
|
3600
|
-
new_text: {
|
|
3601
|
-
type: "string",
|
|
3602
|
-
description: "Replacement text",
|
|
3603
|
-
required: true
|
|
3604
|
-
}
|
|
3605
|
-
},
|
|
3606
|
-
handler: handleEditNote
|
|
3607
|
-
}
|
|
3608
|
-
),
|
|
3609
|
-
children
|
|
3610
|
-
] });
|
|
3611
|
-
}
|
|
3612
|
-
|
|
3613
|
-
// src/frontend.tsx
|
|
3614
|
-
var COMPACT_WIDTH = 720;
|
|
3615
|
-
function NoteApp() {
|
|
3616
|
-
const [notes, setNotes] = useState([]);
|
|
3617
|
-
const [selectedId, setSelectedId] = useState(null);
|
|
3618
|
-
const [currentNote, setCurrentNote] = useState(null);
|
|
3619
|
-
const [searchQuery, setSearchQuery] = useState("");
|
|
3620
|
-
const [loadingNote, setLoadingNote] = useState(false);
|
|
3621
|
-
const [compact, setCompact] = useState(false);
|
|
3622
|
-
const editorRef = useRef(null);
|
|
3623
|
-
const rootRef = useRef(null);
|
|
3624
|
-
const listNotes = useCommand2("notes.list");
|
|
3625
|
-
const getNote = useCommand2("notes.get");
|
|
3626
|
-
const updateNote = useCommand2(
|
|
3627
|
-
"notes.update"
|
|
3628
|
-
);
|
|
3629
|
-
const searchNotes = useCommand2("notes.search");
|
|
3630
|
-
const createNote = useCommand2(
|
|
3631
|
-
"notes.create"
|
|
3632
|
-
);
|
|
3633
|
-
const fetchNotes = useCallback(async () => {
|
|
3634
|
-
try {
|
|
3635
|
-
let result;
|
|
3636
|
-
if (searchQuery) {
|
|
3637
|
-
result = await searchNotes({ query: searchQuery });
|
|
3638
|
-
} else {
|
|
3639
|
-
result = await listNotes();
|
|
3640
|
-
}
|
|
3641
|
-
setNotes(result);
|
|
3642
|
-
} catch (err) {
|
|
3643
|
-
console.error("Failed to fetch notes:", err);
|
|
3644
|
-
}
|
|
3645
|
-
}, [listNotes, searchNotes, searchQuery]);
|
|
3646
|
-
const refresh = useCallback(() => {
|
|
3647
|
-
fetchNotes();
|
|
3648
|
-
}, [fetchNotes]);
|
|
3649
|
-
useEffect(() => {
|
|
3650
|
-
refresh();
|
|
3651
|
-
}, [refresh]);
|
|
3652
|
-
useEffect(() => {
|
|
3653
|
-
if (!rootRef.current) return;
|
|
3654
|
-
const updateLayout = (width) => {
|
|
3655
|
-
setCompact(width <= COMPACT_WIDTH);
|
|
3656
|
-
};
|
|
3657
|
-
updateLayout(rootRef.current.clientWidth);
|
|
3658
|
-
const observer = new ResizeObserver((entries) => {
|
|
3659
|
-
const entry = entries[0];
|
|
3660
|
-
if (!entry) return;
|
|
3661
|
-
updateLayout(entry.contentRect.width);
|
|
3662
|
-
});
|
|
3663
|
-
observer.observe(rootRef.current);
|
|
3664
|
-
return () => observer.disconnect();
|
|
3665
|
-
}, []);
|
|
3666
|
-
const selectNote = useCallback(
|
|
3667
|
-
async (id) => {
|
|
3668
|
-
setSelectedId(id);
|
|
3669
|
-
setLoadingNote(true);
|
|
3670
|
-
try {
|
|
3671
|
-
const note = await getNote({ id });
|
|
3672
|
-
setCurrentNote(note);
|
|
3673
|
-
} catch (err) {
|
|
3674
|
-
console.error("Failed to load note:", err);
|
|
3675
|
-
setCurrentNote(null);
|
|
3676
|
-
} finally {
|
|
3677
|
-
setLoadingNote(false);
|
|
3678
|
-
}
|
|
3679
|
-
},
|
|
3680
|
-
[getNote]
|
|
3681
|
-
);
|
|
3682
|
-
const searchTimerRef = useRef(null);
|
|
3683
|
-
const handleSearchChange = useCallback((query) => {
|
|
3684
|
-
setSearchQuery(query);
|
|
3685
|
-
if (searchTimerRef.current) clearTimeout(searchTimerRef.current);
|
|
3686
|
-
searchTimerRef.current = setTimeout(() => {
|
|
3687
|
-
}, 300);
|
|
3688
|
-
}, []);
|
|
3689
|
-
const handleEditorSave = useCallback(
|
|
3690
|
-
async (markdown) => {
|
|
3691
|
-
if (!selectedId || !currentNote) return;
|
|
3692
|
-
try {
|
|
3693
|
-
const updated = await updateNote({
|
|
3694
|
-
id: selectedId,
|
|
3695
|
-
content: markdown
|
|
3696
|
-
});
|
|
3697
|
-
setCurrentNote(updated);
|
|
3698
|
-
fetchNotes();
|
|
3699
|
-
} catch (err) {
|
|
3700
|
-
console.error("Failed to save note:", err);
|
|
3701
|
-
}
|
|
3702
|
-
},
|
|
3703
|
-
[selectedId, currentNote, updateNote, fetchNotes]
|
|
3704
|
-
);
|
|
3705
|
-
const handleNoteCreated = useCallback(
|
|
3706
|
-
(note) => {
|
|
3707
|
-
refresh();
|
|
3708
|
-
setSelectedId(note.id);
|
|
3709
|
-
setCurrentNote(note);
|
|
3710
|
-
},
|
|
3711
|
-
[refresh]
|
|
3712
|
-
);
|
|
3713
|
-
const handleNoteDeleted = useCallback(
|
|
3714
|
-
(id) => {
|
|
3715
|
-
if (selectedId === id) {
|
|
3716
|
-
setSelectedId(null);
|
|
3717
|
-
setCurrentNote(null);
|
|
3718
|
-
}
|
|
3719
|
-
refresh();
|
|
3720
|
-
},
|
|
3721
|
-
[selectedId, refresh]
|
|
3722
|
-
);
|
|
3723
|
-
const handleNoteUpdated = useCallback(
|
|
3724
|
-
(note) => {
|
|
3725
|
-
if (selectedId === note.id) {
|
|
3726
|
-
setCurrentNote(note);
|
|
3727
|
-
}
|
|
3728
|
-
refresh();
|
|
3729
|
-
},
|
|
3730
|
-
[selectedId, refresh]
|
|
3731
|
-
);
|
|
3732
|
-
const handleSearch = useCallback((query) => {
|
|
3733
|
-
setSearchQuery(query);
|
|
3734
|
-
}, []);
|
|
3735
|
-
const handleCreate = useCallback(async () => {
|
|
3736
|
-
try {
|
|
3737
|
-
const note = await createNote({});
|
|
3738
|
-
handleNoteCreated(note);
|
|
3739
|
-
} catch (err) {
|
|
3740
|
-
console.error("Failed to create note:", err);
|
|
3741
|
-
}
|
|
3742
|
-
}, [createNote, handleNoteCreated]);
|
|
3743
|
-
return /* @__PURE__ */ jsx(
|
|
3744
|
-
NoteActions,
|
|
3745
|
-
{
|
|
3746
|
-
selectedNoteId: selectedId,
|
|
3747
|
-
selectedNote: currentNote,
|
|
3748
|
-
notes,
|
|
3749
|
-
editorRef,
|
|
3750
|
-
onNoteCreated: handleNoteCreated,
|
|
3751
|
-
onNoteDeleted: handleNoteDeleted,
|
|
3752
|
-
onSearch: handleSearch,
|
|
3753
|
-
onNoteUpdated: handleNoteUpdated,
|
|
3754
|
-
onSelectNote: selectNote,
|
|
3755
|
-
onRefresh: refresh,
|
|
3756
|
-
children: /* @__PURE__ */ jsxs("div", { ref: rootRef, className: `${NoteApp_default.root}${compact ? ` ${NoteApp_default.rootCompact}` : ""}`, children: [
|
|
3757
|
-
/* @__PURE__ */ jsx(
|
|
3758
|
-
NoteList,
|
|
3759
|
-
{
|
|
3760
|
-
notes,
|
|
3761
|
-
selectedId,
|
|
3762
|
-
onSelect: selectNote,
|
|
3763
|
-
onCreate: handleCreate,
|
|
3764
|
-
searchQuery,
|
|
3765
|
-
onSearchChange: handleSearchChange
|
|
3766
|
-
}
|
|
3767
|
-
),
|
|
3768
|
-
/* @__PURE__ */ jsx(
|
|
3769
|
-
NoteEditor,
|
|
3770
|
-
{
|
|
3771
|
-
ref: editorRef,
|
|
3772
|
-
note: currentNote,
|
|
3773
|
-
loading: loadingNote,
|
|
3774
|
-
onSave: handleEditorSave
|
|
3775
|
-
}
|
|
3776
|
-
)
|
|
3777
|
-
] })
|
|
3778
|
-
}
|
|
3779
|
-
);
|
|
3780
|
-
}
|
|
3781
|
-
function activate(ctx) {
|
|
3782
|
-
const root = createRoot(ctx.root);
|
|
3783
|
-
root.render(
|
|
3784
|
-
/* @__PURE__ */ jsx(WindowIdProvider, { windowId: ctx.windowId, children: /* @__PURE__ */ jsx(MiniAppIdProvider, { miniAppId: ctx.miniAppId, children: /* @__PURE__ */ jsx(NoteApp, {}) }) })
|
|
3785
|
-
);
|
|
3786
|
-
return {
|
|
3787
|
-
deactivate() {
|
|
3788
|
-
root.unmount();
|
|
3789
|
-
}
|
|
3790
|
-
};
|
|
3791
|
-
}
|
|
3792
|
-
export {
|
|
3793
|
-
activate
|
|
3794
|
-
};
|
|
3795
|
-
//# sourceMappingURL=frontend.js.map
|
|
1680
|
+
`,rt=null;function Ne(){return window.__DtMilkdown?Promise.resolve(window.__DtMilkdown):rt||(rt=new Promise((t,e)=>{let r=document.createElement("script");r.src="/api/ui/milkdown.umd.js",r.async=!0,r.dataset.dtMilkdown="true",r.onload=()=>{if(window.__DtMilkdown){t(window.__DtMilkdown);return}e(new Error("Milkdown runtime loaded without a __DtMilkdown export."))},r.onerror=()=>e(new Error("Failed to load the Milkdown runtime bundle.")),document.head.appendChild(r)}),rt)}var Te=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(t){this.setAttribute("placeholder",t)}get readonly(){return this.hasAttribute("readonly")}set readonly(t){this.toggleAttribute("readonly",t)}get value(){return this._editor&&(this._pendingValue=this._editor.getMarkdown()),this._pendingValue}set value(t){let e=String(t??"");this._pendingValue=e,this._editor&&this._runtime&&this._editor.getMarkdown()!==e&&(this._suppressNextChange=!0,this._editor.editor.action(this._runtime.replaceAll(e)))}constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=Me,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";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),t.appendChild(this._surface)}connectedCallback(){this._initializeEditor()}disconnectedCallback(){this._setupToken+=1,this._clearChangeTimer(),this._destroyEditor()}attributeChangedCallback(t){if(t==="readonly"){this._editor?.setReadonly(this.readonly);return}t==="placeholder"&&this.isConnected&&this._initializeEditor(!0)}async _ensureRuntime(){return this._runtime?this._runtime:(this._loadPromise||(this._loadPromise=Ne().then(t=>(this._runtime=t,this._runtimeStyle.textContent=t.cssText,t))),this._loadPromise)}async _initializeEditor(t=!1){let e=++this._setupToken;if(this._setStatus("Loading editor"),t)await this._destroyEditor();else if(this._editor){this._setStatus(null);return}try{let r=await this._ensureRuntime();if(!this.isConnected||e!==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(s=>{s.markdownUpdated((a,o)=>{if(this._pendingValue=o,this._suppressNextChange){this._suppressNextChange=!1;return}this._queueChange(o)}),s.focus(()=>{this.dispatchEvent(new CustomEvent("dt-focus",{bubbles:!0,composed:!0}))}),s.blur(()=>{this.dispatchEvent(new CustomEvent("dt-blur",{bubbles:!0,composed:!0}))})}),await n.create(),!this.isConnected||e!==this._setupToken){await n.destroy();return}this._editor=n,this._editor.setReadonly(this.readonly),this._pendingValue=this._editor.getMarkdown(),this._setStatus(null)}catch{e===this._setupToken&&this._setStatus("Failed to load editor")}}async _destroyEditor(){let t=this._editor;if(this._editor=null,!!t)try{await t.destroy()}catch{}}_queueChange(t){this._clearChangeTimer(),this._changeTimer=setTimeout(()=>{this._changeTimer=null,this.dispatchEvent(new CustomEvent("dt-change",{bubbles:!0,composed:!0,detail:{value:t}}))},300)}_clearChangeTimer(){this._changeTimer&&(clearTimeout(this._changeTimer),this._changeTimer=null)}_setStatus(t){if(t){this._status.hidden=!1,this._status.textContent=t;return}this._status.hidden=!0}};customElements.get("dt-tooltip")||customElements.define("dt-tooltip",zt),customElements.get("dt-card")||customElements.define("dt-card",Tt),customElements.get("dt-select")||customElements.define("dt-select",Vt),customElements.get("dt-grid")||customElements.define("dt-grid",Wt),customElements.get("dt-stack")||customElements.define("dt-stack",Ut),customElements.get("dt-stat")||customElements.define("dt-stat",Gt),customElements.get("dt-badge")||customElements.define("dt-badge",Qt),customElements.get("dt-button")||customElements.define("dt-button",ee),customElements.get("dt-divider")||customElements.define("dt-divider",ne),customElements.get("dt-list-view")||customElements.define("dt-list-view",pe),customElements.get("dt-table-view")||customElements.define("dt-table-view",ce),customElements.get("dt-column")||customElements.define("dt-column",ut),customElements.get("dt-chart")||customElements.define("dt-chart",ye),customElements.get("dt-markdown")||customElements.define("dt-markdown",ze),customElements.get("dt-markdown-editor")||customElements.define("dt-markdown-editor",Te);function Le(t){const e=t.match(/^---\r?\n[\s\S]*?\r?\n---\r?\n?([\s\S]*)$/);return e?e[1]:t}var He=ft(function({note:e,loading:r,onSave:i},n){const s=H(null),[a,o]=I("idle"),d=H(null),l=H(i);return l.current=i,W(()=>{if(s.current&&e){const g=Le(e.content);s.current.value=g}},[e?.id]),W(()=>{const g=s.current;if(!g)return;const _=b=>{const w=b.detail;w&&(d.current&&clearTimeout(d.current),o("saving"),d.current=setTimeout(()=>{l.current(w.value),o("saved")},500))};return g.addEventListener("dt-change",_),()=>g.removeEventListener("dt-change",_)},[]),W(()=>()=>{d.current&&clearTimeout(d.current)},[]),_t(n,()=>({getMarkdown(){return s.current?.value??null},setMarkdown(g){s.current&&(s.current.value=g)},getCursorLine(){return 1},getSelectedText(){return""}}),[]),e?T("div",{className:v.editorPanel,children:[T("div",{className:v.editorHeader,children:[T("div",{children:[u("div",{className:v.editorTitle,children:e.title}),e.tags.length>0&&u("div",{className:v.editorTags,children:e.tags.map(g=>u("span",{className:v.editorTag,children:g},g))})]}),u("span",{className:a==="saving"?v.saveStatusSaving:v.saveStatus,children:a==="saving"?"Saving...":a==="saved"?"Saved":""})]}),u("div",{className:v.editorBody,children:u("dt-markdown-editor",{ref:s,placeholder:"Start writing...",style:{height:"100%"}})})]}):u("div",{className:v.editorPanel,children:u("div",{className:v.editorPlaceholder,children:r?"Loading...":"Select a note or create a new one"})})});import{ActionsProvider as Ie,Action as R,useCommand as J}from"@desktalk/sdk";var Re=/^---\r?\n([\s\S]*?)\r?\n---\r?\n?([\s\S]*)$/;function Fe(t){const e=t.match(Re);if(!e){const d=t.match(/^#\s+(.+)$/m);return{title:d?d[1].trim():"Untitled",tags:[],created:null,body:t}}const r=e[1],i=e[2];let n="Untitled",s=[],a=null,o=!1;for(const d of r.split(`
|
|
1681
|
+
`)){const l=d.trim();if(l.startsWith("title:"))n=l.slice(6).trim().replace(/^["']|["']$/g,""),o=!1;else if(l.startsWith("created:"))a=l.slice(8).trim(),o=!1;else if(l.startsWith("tags:")){o=!0;const g=l.slice(5).trim();g.startsWith("[")&&g.endsWith("]")&&(s=g.slice(1,-1).split(",").map(_=>_.trim().replace(/^["']|["']$/g,"")).filter(Boolean),o=!1)}else o&&l.startsWith("- ")?s.push(l.slice(2).trim().replace(/^["']|["']$/g,"")):o=!1}return{title:n,tags:s,created:a,body:i}}function $e(t,e,r,i){const n=["---",`title: "${t.replace(/"/g,'\\"')}"`];if(e.length>0){n.push("tags:");for(const s of e)n.push(` - ${s}`)}return n.push(`created: ${r}`,"---","",i),n.join(`
|
|
1682
|
+
`)}function De(t,e,r,i,n){const a=t.substring(0,n).split(`
|
|
1683
|
+
`).length,o=r.split(`
|
|
1684
|
+
`),d=i.split(`
|
|
1685
|
+
`),l=Math.max(0,a-4),g=t.split(`
|
|
1686
|
+
`),_=e.split(`
|
|
1687
|
+
`),b=[];b.push(`@@ -${a},${o.length} +${a},${d.length} @@`);for(let m=l;m<a-1;m++)b.push(` ${g[m]}`);for(const m of o)b.push(`-${m}`);for(const m of d)b.push(`+${m}`);const w=a-1+o.length,C=Math.min(_.length,w+3);for(let m=w;m<C;m++)_[m]!==void 0&&b.push(` ${_[m]}`);return{diff:b.join(`
|
|
1688
|
+
`),firstChangedLine:a}}function Pe({children:t,selectedNoteId:e,selectedNote:r,notes:i,editorRef:n,onNoteCreated:s,onNoteDeleted:a,onSearch:o,onNoteUpdated:d,onSelectNote:l,onRefresh:g}){const _=J("notes.create"),b=J("notes.delete"),w=J("notes.search"),C=J("notes.update"),m=x(async f=>{const p=await _({title:f?.title||void 0,content:f?.content||void 0,tags:f?.tags||void 0,path:f?.path||void 0});return s(p),p},[_,s]),M=x(async()=>{e&&(await b({id:e}),a(e))},[b,e,a]),F=x(async f=>{const p=f?.query||"";return o(p),await w({query:p})},[w,o]),E=x(()=>{if(!r)return null;const f=n.current;if(!f)return null;const p=f.getMarkdown();return p===null?null:$e(r.title,r.tags,r.createdAt,p)},[r,n]),$=x(async()=>({notes:i.slice(0,20).map(p=>({id:p.id,title:p.title,updatedAt:p.updatedAt,selected:p.id===e}))}),[i,e]),A=x(async f=>{const p=f?.id;return p?i.find(N=>N.id===p)?(await l(p),{success:!0}):{success:!1,error:`Note not found: ${p}`}:{success:!1,error:"id parameter is required"}},[i,l]),U=x(async()=>{if(!e||!r)return{error:"No note is currently open"};const f=n.current;if(!f)return{error:"Editor is not ready"};const p=E();return p===null?{error:"Editor is not ready"}:{id:r.id,title:r.title,content:p,cursorLine:f.getCursorLine(),selectedText:f.getSelectedText()}},[e,r,n,E]),V=x(async f=>{if(!e||!r)return{success:!1,error:"No note is currently open"};const p=n.current;if(!p)return{success:!1,error:"Editor is not ready"};const y=f?.old_text,N=f?.new_text;if(y===void 0||N===void 0)return{success:!1,error:"Both old_text and new_text are required"};const S=E();if(S===null)return{success:!1,error:"Editor is not ready"};let D,O;if(y==="")D=N+S,O=0;else{const z=S.indexOf(y);if(z===-1)return{success:!1,error:"Text not found in note"};const X=S.indexOf(y,z+1);if(X!==-1){let it=2,nt=X+1;for(;;){const st=S.indexOf(y,nt);if(st===-1)break;it++,nt=st+1}return{success:!1,error:`Text appears ${it} times; provide more surrounding context to make it unique`}}D=S.substring(0,z)+N+S.substring(z+y.length),O=z}const c=Fe(D);p.setMarkdown(c.body);const k=c.tags.length!==r.tags.length||c.tags.some((z,X)=>z!==r.tags[X]),q=c.title!==r.title;if(k||q){const z=await C({id:e,tags:c.tags,content:c.body});d(z)}const{diff:Y,firstChangedLine:vt}=De(S,D,y,N,O);return{success:!0,diff:Y,firstChangedLine:vt}},[e,r,n,E,C,d]);return T(Ie,{children:[u(R,{name:"Create Note",description:"Create a new note with optional title, content, and path",params:{title:{type:"string",description:"Note title",required:!1},content:{type:"string",description:"Note content in Markdown",required:!1},tags:{type:"string",description:"Comma-separated tags",required:!1},path:{type:"string",description:'Relative path for the note (e.g. "work/meeting-notes"). Becomes the note ID. Auto-generated if omitted.',required:!1}},handler:m}),u(R,{name:"Delete Note",description:"Delete the currently selected note",handler:M}),u(R,{name:"Search Notes",description:"Search notes by keyword",params:{query:{type:"string",description:"Search query",required:!0}},handler:F}),u(R,{name:"List Notes",description:"Return the 20 most recent notes with selection status",handler:$}),u(R,{name:"Select Note",description:"Select a note by ID and open it in the editor",params:{id:{type:"string",description:"Note ID (relative path without .md)",required:!0}},handler:A}),u(R,{name:"Get Editing Context",description:"Return the current editor state for the selected note including content, cursor position, and selected text",handler:U}),u(R,{name:"Edit Note",description:"Apply a text replacement to the current note content including front matter. Use old_text to find exact text and new_text to replace it. To edit tags or title, modify the YAML front matter directly.",params:{old_text:{type:"string",description:"Exact text to find in the note content (must appear exactly once). Searches the full content including YAML front matter. Use empty string to insert at beginning.",required:!0},new_text:{type:"string",description:"Replacement text",required:!0}},handler:V}),t]})}var Ve=720;function Oe(){const[t,e]=I([]),[r,i]=I(null),[n,s]=I(null),[a,o]=I(""),[d,l]=I(!1),[g,_]=I(!1),b=H(null),w=H(null),C=B("notes.list"),m=B("notes.get"),M=B("notes.update"),F=B("notes.search"),E=B("notes.create"),$=x(async()=>{try{let c;a?c=await F({query:a}):c=await C(),e(c)}catch(c){console.error("Failed to fetch notes:",c)}},[C,F,a]),A=x(()=>{$()},[$]);W(()=>{A()},[A]),W(()=>{if(!w.current)return;const c=q=>{_(q<=Ve)};c(w.current.clientWidth);const k=new ResizeObserver(q=>{const Y=q[0];Y&&c(Y.contentRect.width)});return k.observe(w.current),()=>k.disconnect()},[]);const U=x(async c=>{i(c),l(!0);try{const k=await m({id:c});s(k)}catch(k){console.error("Failed to load note:",k),s(null)}finally{l(!1)}},[m]),V=H(null),f=x(c=>{o(c),V.current&&clearTimeout(V.current),V.current=setTimeout(()=>{},300)},[]),p=x(async c=>{if(!(!r||!n))try{const k=await M({id:r,content:c});s(k),$()}catch(k){console.error("Failed to save note:",k)}},[r,n,M,$]),y=x(c=>{A(),i(c.id),s(c)},[A]),N=x(c=>{r===c&&(i(null),s(null)),A()},[r,A]),S=x(c=>{r===c.id&&s(c),A()},[r,A]),D=x(c=>{o(c)},[]),O=x(async()=>{try{const c=await E({});y(c)}catch(c){console.error("Failed to create note:",c)}},[E,y]);return u(Pe,{selectedNoteId:r,selectedNote:n,notes:t,editorRef:b,onNoteCreated:y,onNoteDeleted:N,onSearch:D,onNoteUpdated:S,onSelectNote:U,onRefresh:A,children:T("div",{ref:w,className:`${v.root}${g?` ${v.rootCompact}`:""}`,children:[u(Ct,{notes:t,selectedId:r,onSelect:U,onCreate:O,searchQuery:a,onSearchChange:f}),u(He,{ref:b,note:n,loading:d,onSave:p})]})})}function qe(t){const e=xt(t.root);return e.render(u(yt,{windowId:t.windowId,children:u(wt,{miniAppId:t.miniAppId,children:u(Oe,{})})})),{deactivate(){e.unmount()}}}export{qe as activate};
|
|
1689
|
+
(() => {
|
|
1690
|
+
if (typeof document === 'undefined') return;
|
|
1691
|
+
const styleId = "desktalk-style-desktalk-miniapp-note-emi3yz";
|
|
1692
|
+
if (document.getElementById(styleId)) return;
|
|
1693
|
+
const style = document.createElement('style');
|
|
1694
|
+
style.id = styleId;
|
|
1695
|
+
style.textContent = "/* src/styles/NoteApp.module.css */\n.NoteApp_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-sans);\n}\n.NoteApp_rootCompact {\n flex-direction: column;\n}\n.NoteApp_rootCompact .NoteApp_listPanel {\n width: 100%;\n min-width: 0;\n max-height: 180px;\n flex-direction: row;\n border-right: none;\n border-bottom: 1px solid var(--dt-border);\n}\n.NoteApp_rootCompact .NoteApp_listHeader {\n width: 140px;\n min-width: 140px;\n flex-direction: column;\n padding: 10px;\n gap: 8px;\n border-bottom: none;\n border-right: 1px solid var(--dt-border-subtle);\n}\n.NoteApp_rootCompact .NoteApp_searchInput {\n width: 100%;\n}\n.NoteApp_rootCompact .NoteApp_newNoteBtn {\n width: 100%;\n}\n.NoteApp_rootCompact .NoteApp_noteList {\n flex: 1;\n overflow-x: auto;\n overflow-y: hidden;\n display: flex;\n padding: 8px;\n gap: 8px;\n}\n.NoteApp_rootCompact .NoteApp_noteItem,\n.NoteApp_rootCompact .NoteApp_noteItemActive {\n min-width: 160px;\n max-width: 200px;\n flex-shrink: 0;\n border-bottom: none;\n border-radius: 6px;\n background: var(--dt-surface);\n}\n.NoteApp_rootCompact .NoteApp_noteItemActive {\n border-left: none;\n padding-left: 10px;\n border: 1px solid var(--dt-accent);\n background: color-mix(in oklab, var(--dt-accent) 8%, var(--dt-surface));\n}\n.NoteApp_rootCompact .NoteApp_emptyState {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n}\n.NoteApp_listPanel {\n display: flex;\n width: 260px;\n min-width: 200px;\n flex-direction: column;\n overflow: hidden;\n border-right: 1px solid var(--dt-border);\n}\n.NoteApp_listHeader {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 10px 14px;\n border-bottom: 1px solid var(--dt-border);\n}\n.NoteApp_searchInput {\n flex: 1;\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: inherit;\n font-size: 13px;\n outline: none;\n transition: border-color 0.15s;\n}\n.NoteApp_searchInput::placeholder {\n color: var(--dt-text-muted);\n}\n.NoteApp_searchInput:focus {\n border-color: var(--dt-accent);\n}\n.NoteApp_newNoteBtn {\n display: flex;\n width: 30px;\n height: 30px;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n border: 1px solid var(--dt-border);\n border-radius: 6px;\n background: var(--dt-surface);\n color: var(--dt-text);\n cursor: pointer;\n font-size: 18px;\n line-height: 1;\n transition:\n background 0.15s,\n border-color 0.15s,\n color 0.15s;\n}\n.NoteApp_newNoteBtn:hover {\n border-color: var(--dt-accent);\n background: var(--dt-surface-hover);\n color: var(--dt-accent);\n}\n.NoteApp_noteList {\n flex: 1;\n overflow-y: auto;\n}\n.NoteApp_noteItem {\n padding: 10px 14px;\n border-bottom: 1px solid var(--dt-border);\n cursor: pointer;\n transition: background 0.1s;\n}\n.NoteApp_noteItem:hover {\n background: var(--dt-surface-hover);\n}\n.NoteApp_noteItemActive {\n padding-left: 11px;\n border-left: 3px solid var(--dt-accent);\n background: var(--dt-surface);\n}\n.NoteApp_noteTitle {\n overflow: hidden;\n margin-bottom: 4px;\n font-size: 14px;\n font-weight: 500;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.NoteApp_notePreview {\n overflow: hidden;\n margin-bottom: 4px;\n color: var(--dt-text-muted);\n font-size: 12px;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.NoteApp_noteDate {\n color: var(--dt-text-muted);\n opacity: 0.7;\n font-size: 11px;\n}\n.NoteApp_emptyState {\n padding: 24px 14px;\n color: var(--dt-text-muted);\n font-size: 13px;\n text-align: center;\n}\n.NoteApp_editorPanel {\n display: flex;\n min-width: 0;\n flex: 1;\n flex-direction: column;\n overflow: hidden;\n}\n.NoteApp_editorHeader {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: space-between;\n padding: 10px 16px;\n border-bottom: 1px solid var(--dt-border);\n}\n.NoteApp_editorTitle {\n font-size: 16px;\n font-weight: 600;\n}\n.NoteApp_editorTags {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n}\n.NoteApp_editorTag {\n padding: 2px 8px;\n border: 1px solid var(--dt-border);\n border-radius: 4px;\n background: var(--dt-surface);\n color: var(--dt-accent);\n font-size: 11px;\n}\n.NoteApp_editorBody {\n position: relative;\n flex: 1;\n overflow-y: auto;\n}\n.NoteApp_editorPlaceholder {\n display: flex;\n height: 100%;\n align-items: center;\n justify-content: center;\n color: var(--dt-text-muted);\n font-size: 14px;\n}\n.NoteApp_editorBody .milkdown {\n height: 100%;\n background: transparent;\n color: var(--dt-text);\n}\n.NoteApp_editorBody .milkdown .editor {\n min-height: 100%;\n padding: 16px 20px;\n outline: none;\n font-family: var(--font-sans);\n font-size: 14px;\n line-height: 1.65;\n}\n.NoteApp_editorBody .milkdown .editor h1 {\n margin: 0.8em 0 0.4em;\n font-size: 1.6em;\n}\n.NoteApp_editorBody .milkdown .editor h2 {\n margin: 0.7em 0 0.35em;\n font-size: 1.35em;\n}\n.NoteApp_editorBody .milkdown .editor h3 {\n margin: 0.6em 0 0.3em;\n font-size: 1.15em;\n}\n.NoteApp_editorBody .milkdown .editor p {\n margin: 0.5em 0;\n}\n.NoteApp_editorBody .milkdown .editor code {\n padding: 2px 5px;\n border-radius: 3px;\n background: var(--dt-surface);\n font-family: var(--font-mono);\n font-size: 0.9em;\n}\n.NoteApp_editorBody .milkdown .editor pre {\n overflow-x: auto;\n margin: 0.8em 0;\n padding: 12px 16px;\n border: 1px solid var(--dt-border);\n border-radius: 6px;\n background: var(--dt-surface);\n}\n.NoteApp_editorBody .milkdown .editor pre code {\n padding: 0;\n border-radius: 0;\n background: transparent;\n}\n.NoteApp_editorBody .milkdown .editor blockquote {\n margin: 0.8em 0;\n padding-left: 14px;\n border-left: 3px solid var(--dt-accent);\n color: var(--dt-text-muted);\n}\n.NoteApp_editorBody .milkdown .editor a {\n color: var(--dt-accent);\n text-decoration: none;\n}\n.NoteApp_editorBody .milkdown .editor a:hover {\n text-decoration: underline;\n}\n.NoteApp_editorBody .milkdown .editor hr {\n margin: 1.5em 0;\n border: none;\n border-top: 1px solid var(--dt-border);\n}\n.NoteApp_editorBody .milkdown .editor ul,\n.NoteApp_editorBody .milkdown .editor ol {\n margin: 0.5em 0;\n padding-left: 24px;\n}\n.NoteApp_editorBody .milkdown .editor li {\n margin: 0.2em 0;\n}\n.NoteApp_editorBody .milkdown .editor img {\n max-width: 100%;\n border-radius: 6px;\n}\n.NoteApp_editorBody dt-markdown-editor {\n display: block;\n height: 100%;\n}\n.NoteApp_saveStatus {\n color: var(--dt-text-muted);\n opacity: 0.7;\n font-size: 11px;\n}\n.NoteApp_saveStatusSaving {\n color: var(--dt-warning);\n}\n/*# sourceMappingURL=frontend.css.map */\n";
|
|
1696
|
+
document.head.appendChild(style);
|
|
1697
|
+
})();
|