ssovee-os-web-ui 0.1.104 → 0.1.106
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/index.cjs +96 -143
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +4 -3
- package/dist/index.js +25 -71
- package/dist/index.js.map +1 -1
- package/package.json +1 -3
package/dist/index.cjs
CHANGED
|
@@ -1,15 +1,13 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var React23 = require('react');
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
5
|
var react = require('@phosphor-icons/react');
|
|
6
6
|
var Editor = require('@monaco-editor/react');
|
|
7
7
|
var react$1 = require('@tiptap/react');
|
|
8
8
|
var StarterKit = require('@tiptap/starter-kit');
|
|
9
9
|
var uaParserJs = require('ua-parser-js');
|
|
10
|
-
var reactPdf = require('react-pdf');
|
|
11
10
|
|
|
12
|
-
var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
|
|
13
11
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
14
12
|
|
|
15
13
|
function _interopNamespace(e) {
|
|
@@ -30,7 +28,7 @@ function _interopNamespace(e) {
|
|
|
30
28
|
return Object.freeze(n);
|
|
31
29
|
}
|
|
32
30
|
|
|
33
|
-
var
|
|
31
|
+
var React23__namespace = /*#__PURE__*/_interopNamespace(React23);
|
|
34
32
|
var Editor__default = /*#__PURE__*/_interopDefault(Editor);
|
|
35
33
|
var StarterKit__default = /*#__PURE__*/_interopDefault(StarterKit);
|
|
36
34
|
|
|
@@ -40,7 +38,7 @@ var StarterKit__default = /*#__PURE__*/_interopDefault(StarterKit);
|
|
|
40
38
|
function cn(...inputs) {
|
|
41
39
|
return inputs.filter(Boolean).join(" ");
|
|
42
40
|
}
|
|
43
|
-
var Button =
|
|
41
|
+
var Button = React23__namespace.default.forwardRef(
|
|
44
42
|
({
|
|
45
43
|
className,
|
|
46
44
|
variant = "primary",
|
|
@@ -176,7 +174,7 @@ var Typography = ({
|
|
|
176
174
|
return /* @__PURE__ */ jsxRuntime.jsx(Component, { className: classes, children });
|
|
177
175
|
};
|
|
178
176
|
var Typography_default = Typography;
|
|
179
|
-
var Input =
|
|
177
|
+
var Input = React23__namespace.default.forwardRef(
|
|
180
178
|
({
|
|
181
179
|
className,
|
|
182
180
|
variant = "default",
|
|
@@ -254,7 +252,7 @@ var Input = React24__namespace.default.forwardRef(
|
|
|
254
252
|
);
|
|
255
253
|
Input.displayName = "Input";
|
|
256
254
|
var Input_default = Input;
|
|
257
|
-
var TextArea =
|
|
255
|
+
var TextArea = React23__namespace.default.forwardRef(
|
|
258
256
|
({
|
|
259
257
|
className,
|
|
260
258
|
variant = "default",
|
|
@@ -320,7 +318,7 @@ var CodeEditor = ({
|
|
|
320
318
|
className,
|
|
321
319
|
isDarkTheme
|
|
322
320
|
}) => {
|
|
323
|
-
const editorTheme =
|
|
321
|
+
const editorTheme = React23.useMemo(() => {
|
|
324
322
|
if (typeof isDarkTheme === "undefined") return "light";
|
|
325
323
|
const isDark = Boolean(isDarkTheme);
|
|
326
324
|
return isDark ? "vs-dark" : "light";
|
|
@@ -339,7 +337,7 @@ var CodeEditor = ({
|
|
|
339
337
|
};
|
|
340
338
|
var CodeEditor_default = CodeEditor;
|
|
341
339
|
var RichEditor = ({ content, onChange, isDarkTheme }) => {
|
|
342
|
-
const onChangeRef =
|
|
340
|
+
const onChangeRef = React23.useRef(onChange);
|
|
343
341
|
onChangeRef.current = onChange;
|
|
344
342
|
const editorTheme = isDarkTheme ? "vs-dark" : "light";
|
|
345
343
|
const editor = react$1.useEditor({
|
|
@@ -350,7 +348,7 @@ var RichEditor = ({ content, onChange, isDarkTheme }) => {
|
|
|
350
348
|
onChangeRef.current(updatedEditor.getHTML());
|
|
351
349
|
}
|
|
352
350
|
}, []);
|
|
353
|
-
|
|
351
|
+
React23.useEffect(() => {
|
|
354
352
|
if (editor && content !== editor.getHTML()) {
|
|
355
353
|
editor.commands.setContent(content, { emitUpdate: false });
|
|
356
354
|
}
|
|
@@ -393,7 +391,7 @@ var RichEditor = ({ content, onChange, isDarkTheme }) => {
|
|
|
393
391
|
] });
|
|
394
392
|
};
|
|
395
393
|
var RichEditor_default = RichEditor;
|
|
396
|
-
var Select =
|
|
394
|
+
var Select = React23__namespace.default.forwardRef(
|
|
397
395
|
({
|
|
398
396
|
className,
|
|
399
397
|
options,
|
|
@@ -473,7 +471,7 @@ var Select = React24__namespace.default.forwardRef(
|
|
|
473
471
|
);
|
|
474
472
|
Select.displayName = "Select";
|
|
475
473
|
var Select_default = Select;
|
|
476
|
-
var Checkbox =
|
|
474
|
+
var Checkbox = React23__namespace.default.forwardRef(
|
|
477
475
|
({
|
|
478
476
|
className,
|
|
479
477
|
variant = "default",
|
|
@@ -548,7 +546,7 @@ var Checkbox = React24__namespace.default.forwardRef(
|
|
|
548
546
|
);
|
|
549
547
|
Checkbox.displayName = "Checkbox";
|
|
550
548
|
var Checkbox_default = Checkbox;
|
|
551
|
-
var Toggle =
|
|
549
|
+
var Toggle = React23__namespace.default.forwardRef(
|
|
552
550
|
({
|
|
553
551
|
checked,
|
|
554
552
|
onChange,
|
|
@@ -654,10 +652,10 @@ var Dropdown = ({
|
|
|
654
652
|
className,
|
|
655
653
|
trigger
|
|
656
654
|
}) => {
|
|
657
|
-
const [isOpen, setIsOpen] =
|
|
658
|
-
const dropdownRef =
|
|
655
|
+
const [isOpen, setIsOpen] = React23.useState(false);
|
|
656
|
+
const dropdownRef = React23.useRef(null);
|
|
659
657
|
const selectedOption = options.find((option) => option.value === value);
|
|
660
|
-
|
|
658
|
+
React23.useEffect(() => {
|
|
661
659
|
const handleClickOutside = (event) => {
|
|
662
660
|
if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
|
|
663
661
|
setIsOpen(false);
|
|
@@ -784,9 +782,9 @@ var ImageWithPlaceholder = ({
|
|
|
784
782
|
};
|
|
785
783
|
const resolvedSrc = resolveSrc(src);
|
|
786
784
|
const initialSrc = isValidSrc(resolvedSrc) ? resolvedSrc : fallbackSrc;
|
|
787
|
-
const [imgSrc, setImgSrc] =
|
|
788
|
-
const [hasError, setHasError] =
|
|
789
|
-
|
|
785
|
+
const [imgSrc, setImgSrc] = React23.useState(initialSrc);
|
|
786
|
+
const [hasError, setHasError] = React23.useState(!isValidSrc(resolvedSrc));
|
|
787
|
+
React23.useEffect(() => {
|
|
790
788
|
const nextResolvedSrc = resolveSrc(src);
|
|
791
789
|
if (isValidSrc(nextResolvedSrc)) {
|
|
792
790
|
setImgSrc(nextResolvedSrc);
|
|
@@ -995,8 +993,8 @@ var Toast = ({
|
|
|
995
993
|
showCloseButton = true,
|
|
996
994
|
className
|
|
997
995
|
}) => {
|
|
998
|
-
const [isShowing, setIsShowing] =
|
|
999
|
-
|
|
996
|
+
const [isShowing, setIsShowing] = React23.useState(false);
|
|
997
|
+
React23.useEffect(() => {
|
|
1000
998
|
if (isVisible) {
|
|
1001
999
|
setIsShowing(true);
|
|
1002
1000
|
let timer = null;
|
|
@@ -1220,7 +1218,7 @@ var Modal = ({
|
|
|
1220
1218
|
closeOnEscape = true,
|
|
1221
1219
|
className
|
|
1222
1220
|
}) => {
|
|
1223
|
-
|
|
1221
|
+
React23.useEffect(() => {
|
|
1224
1222
|
if (!isOpen) return;
|
|
1225
1223
|
const handleEscape = (e) => {
|
|
1226
1224
|
if (e.key === "Escape" && closeOnEscape) {
|
|
@@ -1287,7 +1285,7 @@ var Modal = ({
|
|
|
1287
1285
|
);
|
|
1288
1286
|
};
|
|
1289
1287
|
var Modal_default = Modal;
|
|
1290
|
-
var Card =
|
|
1288
|
+
var Card = React23__namespace.default.forwardRef(
|
|
1291
1289
|
({
|
|
1292
1290
|
className,
|
|
1293
1291
|
variant = "default",
|
|
@@ -1325,7 +1323,7 @@ var Card = React24__namespace.default.forwardRef(
|
|
|
1325
1323
|
);
|
|
1326
1324
|
Card.displayName = "Card";
|
|
1327
1325
|
var Card_default = Card;
|
|
1328
|
-
var Badge =
|
|
1326
|
+
var Badge = React23__namespace.default.forwardRef(
|
|
1329
1327
|
({
|
|
1330
1328
|
className,
|
|
1331
1329
|
variant = "default",
|
|
@@ -1380,7 +1378,7 @@ var Avatar = ({
|
|
|
1380
1378
|
className,
|
|
1381
1379
|
onClick
|
|
1382
1380
|
}) => {
|
|
1383
|
-
const [imgError, setImgError] =
|
|
1381
|
+
const [imgError, setImgError] = React23.useState(false);
|
|
1384
1382
|
const sizeClasses = {
|
|
1385
1383
|
sm: "w-8 h-8 text-xs",
|
|
1386
1384
|
md: "w-10 h-10 text-sm",
|
|
@@ -1403,7 +1401,7 @@ var Avatar = ({
|
|
|
1403
1401
|
}
|
|
1404
1402
|
) }) });
|
|
1405
1403
|
};
|
|
1406
|
-
const handleImgError =
|
|
1404
|
+
const handleImgError = React23.useCallback(() => {
|
|
1407
1405
|
setImgError(true);
|
|
1408
1406
|
}, []);
|
|
1409
1407
|
const isSrcAvailable = typeof src === "string" && src.trim() !== "";
|
|
@@ -1475,8 +1473,8 @@ var Tooltip = ({
|
|
|
1475
1473
|
delay = 200,
|
|
1476
1474
|
className
|
|
1477
1475
|
}) => {
|
|
1478
|
-
const [isVisible, setIsVisible] =
|
|
1479
|
-
const [timeoutId, setTimeoutId] =
|
|
1476
|
+
const [isVisible, setIsVisible] = React23.useState(false);
|
|
1477
|
+
const [timeoutId, setTimeoutId] = React23.useState(null);
|
|
1480
1478
|
const showTooltip = () => {
|
|
1481
1479
|
const id = setTimeout(() => setIsVisible(true), delay);
|
|
1482
1480
|
setTimeoutId(id);
|
|
@@ -1606,14 +1604,14 @@ var matchShortcut = (event, shortcut, os) => {
|
|
|
1606
1604
|
var useShortcutFormatter = ({
|
|
1607
1605
|
globalKeyboardShortcuts: globalKeyboardShortcuts2 = []
|
|
1608
1606
|
} = {}) => {
|
|
1609
|
-
const [os, setOS] =
|
|
1610
|
-
const listenersRef =
|
|
1607
|
+
const [os, setOS] = React23.useState("windows");
|
|
1608
|
+
const listenersRef = React23.useRef(
|
|
1611
1609
|
/* @__PURE__ */ new Map()
|
|
1612
1610
|
);
|
|
1613
|
-
|
|
1611
|
+
React23.useEffect(() => {
|
|
1614
1612
|
setOS(detectOS());
|
|
1615
1613
|
}, []);
|
|
1616
|
-
|
|
1614
|
+
React23.useEffect(() => {
|
|
1617
1615
|
if (!globalKeyboardShortcuts2.length) return;
|
|
1618
1616
|
const handleKeyDown = (event) => {
|
|
1619
1617
|
for (const shortcut of globalKeyboardShortcuts2) {
|
|
@@ -1631,21 +1629,21 @@ var useShortcutFormatter = ({
|
|
|
1631
1629
|
window.removeEventListener("keydown", handleKeyDown);
|
|
1632
1630
|
};
|
|
1633
1631
|
}, [os, globalKeyboardShortcuts2]);
|
|
1634
|
-
const formatKeys =
|
|
1632
|
+
const formatKeys = React23.useCallback(
|
|
1635
1633
|
(keys = []) => {
|
|
1636
1634
|
const separator = os === "mac" ? "" : " + ";
|
|
1637
1635
|
return keys.map((key) => keyMap[os][key.toLowerCase()] || key.toUpperCase()).join(separator);
|
|
1638
1636
|
},
|
|
1639
1637
|
[os]
|
|
1640
1638
|
);
|
|
1641
|
-
const getShortcutByCommand =
|
|
1639
|
+
const getShortcutByCommand = React23.useCallback(
|
|
1642
1640
|
(command) => {
|
|
1643
1641
|
const found = globalKeyboardShortcuts2.find((s) => s.command === command);
|
|
1644
1642
|
return found ? found.shortcut : [];
|
|
1645
1643
|
},
|
|
1646
1644
|
[globalKeyboardShortcuts2]
|
|
1647
1645
|
);
|
|
1648
|
-
const addShortcutListener =
|
|
1646
|
+
const addShortcutListener = React23.useCallback(
|
|
1649
1647
|
(command, listener) => {
|
|
1650
1648
|
if (!listenersRef.current.has(command)) {
|
|
1651
1649
|
listenersRef.current.set(command, /* @__PURE__ */ new Set());
|
|
@@ -1654,7 +1652,7 @@ var useShortcutFormatter = ({
|
|
|
1654
1652
|
},
|
|
1655
1653
|
[]
|
|
1656
1654
|
);
|
|
1657
|
-
const removeShortcutListener =
|
|
1655
|
+
const removeShortcutListener = React23.useCallback(
|
|
1658
1656
|
(command, listener) => {
|
|
1659
1657
|
if (listenersRef.current.has(command)) {
|
|
1660
1658
|
listenersRef.current.get(command).delete(listener);
|
|
@@ -1694,7 +1692,7 @@ var globalKeyboardShortcuts = [
|
|
|
1694
1692
|
usage: "Focus on current app search"
|
|
1695
1693
|
}
|
|
1696
1694
|
];
|
|
1697
|
-
var SearchInput =
|
|
1695
|
+
var SearchInput = React23__namespace.default.forwardRef(
|
|
1698
1696
|
({
|
|
1699
1697
|
onSearch,
|
|
1700
1698
|
placeholder = "Search...",
|
|
@@ -1709,16 +1707,16 @@ var SearchInput = React24__namespace.default.forwardRef(
|
|
|
1709
1707
|
isActive = true,
|
|
1710
1708
|
...props
|
|
1711
1709
|
}, ref) => {
|
|
1712
|
-
const [searchValue, setSearchValue] =
|
|
1713
|
-
const inputRef =
|
|
1714
|
-
|
|
1710
|
+
const [searchValue, setSearchValue] = React23__namespace.default.useState(value || "");
|
|
1711
|
+
const inputRef = React23.useRef(null);
|
|
1712
|
+
React23.useImperativeHandle(ref, () => inputRef.current);
|
|
1715
1713
|
const {
|
|
1716
1714
|
addShortcutListener,
|
|
1717
1715
|
removeShortcutListener,
|
|
1718
1716
|
formatKeys,
|
|
1719
1717
|
getShortcutByCommand
|
|
1720
1718
|
} = useShortcutFormatter_default({ globalKeyboardShortcuts });
|
|
1721
|
-
|
|
1719
|
+
React23.useEffect(() => {
|
|
1722
1720
|
setSearchValue(value ?? "");
|
|
1723
1721
|
}, [value]);
|
|
1724
1722
|
const handleChange = (e) => {
|
|
@@ -1727,7 +1725,7 @@ var SearchInput = React24__namespace.default.forwardRef(
|
|
|
1727
1725
|
onChange?.(e);
|
|
1728
1726
|
onSearch?.(newValue);
|
|
1729
1727
|
};
|
|
1730
|
-
const handleClear =
|
|
1728
|
+
const handleClear = React23.useCallback(() => {
|
|
1731
1729
|
setSearchValue("");
|
|
1732
1730
|
onSearch?.("");
|
|
1733
1731
|
const syntheticEvent = {
|
|
@@ -1735,7 +1733,7 @@ var SearchInput = React24__namespace.default.forwardRef(
|
|
|
1735
1733
|
};
|
|
1736
1734
|
onChange?.(syntheticEvent);
|
|
1737
1735
|
}, [onChange, onSearch]);
|
|
1738
|
-
|
|
1736
|
+
React23.useEffect(() => {
|
|
1739
1737
|
if (!enableKeyboardShortcuts || !isActive) return;
|
|
1740
1738
|
const handleFocusSearch = (e) => {
|
|
1741
1739
|
e?.preventDefault();
|
|
@@ -1888,8 +1886,8 @@ var FileUpload = ({
|
|
|
1888
1886
|
children,
|
|
1889
1887
|
dragAndDrop = false
|
|
1890
1888
|
}) => {
|
|
1891
|
-
const fileInputRef =
|
|
1892
|
-
const [isDragOver, setIsDragOver] =
|
|
1889
|
+
const fileInputRef = React23.useRef(null);
|
|
1890
|
+
const [isDragOver, setIsDragOver] = React23__namespace.default.useState(false);
|
|
1893
1891
|
const handleFileSelect = (files) => {
|
|
1894
1892
|
if (!files) return;
|
|
1895
1893
|
const fileArray = Array.from(files);
|
|
@@ -2187,7 +2185,7 @@ var Pagination = ({
|
|
|
2187
2185
|
] });
|
|
2188
2186
|
};
|
|
2189
2187
|
var Pagination_default = Pagination;
|
|
2190
|
-
var Radio =
|
|
2188
|
+
var Radio = React23__namespace.default.forwardRef(
|
|
2191
2189
|
({
|
|
2192
2190
|
className,
|
|
2193
2191
|
label,
|
|
@@ -2252,7 +2250,7 @@ var Radio = React24__namespace.default.forwardRef(
|
|
|
2252
2250
|
Radio.displayName = "Radio";
|
|
2253
2251
|
var Radio_default = Radio;
|
|
2254
2252
|
var Accordion = ({ items, active = -1 }) => {
|
|
2255
|
-
const [activeIndex, setActiveIndex] =
|
|
2253
|
+
const [activeIndex, setActiveIndex] = React23.useState(active);
|
|
2256
2254
|
const toggleAccordion = (index) => {
|
|
2257
2255
|
setActiveIndex(activeIndex === index ? null : index);
|
|
2258
2256
|
};
|
|
@@ -2293,8 +2291,8 @@ var Tabs = ({
|
|
|
2293
2291
|
buttonClassName = "flex items-center gap-1 px-[8px] py-[2px] text-[13px] cursor-pointer transition-all duration-300 text-neutral-300 rounded-[6px] m-[8px]",
|
|
2294
2292
|
activeButtonClassName = "bg-surface-3 text-neutral-400"
|
|
2295
2293
|
}) => {
|
|
2296
|
-
const [activeTab, setActiveTab] =
|
|
2297
|
-
|
|
2294
|
+
const [activeTab, setActiveTab] = React23.useState(defaultActiveTab);
|
|
2295
|
+
React23.useEffect(() => {
|
|
2298
2296
|
setActiveTab(defaultActiveTab);
|
|
2299
2297
|
}, [defaultActiveTab]);
|
|
2300
2298
|
const handleTabClick = (index) => {
|
|
@@ -2320,10 +2318,6 @@ var Tabs = ({
|
|
|
2320
2318
|
] });
|
|
2321
2319
|
};
|
|
2322
2320
|
var Tabs_default = Tabs;
|
|
2323
|
-
reactPdf.pdfjs.GlobalWorkerOptions.workerSrc = new URL(
|
|
2324
|
-
"pdfjs-dist/build/pdf.worker.min.mjs",
|
|
2325
|
-
(typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('index.cjs', document.baseURI).href))
|
|
2326
|
-
).toString();
|
|
2327
2321
|
var imageExtensions = /\.(avif|bmp|gif|heic|jpe?g|png|svg|tiff?|webp)$/i;
|
|
2328
2322
|
var textExtensions = /\.(c|cc|conf|cpp|css|csv|env|h|hpp|html?|ini|java|js|jsx|log|md|mjs|php|py|rb|rs|sh|sql|swift|ts|tsx|txt|xml|yaml|yml)$/i;
|
|
2329
2323
|
var audioExtensions = /\.(aac|flac|m4a|mp3|ogg|wav|weba)$/i;
|
|
@@ -2389,55 +2383,14 @@ var decodeBase64 = (base64) => {
|
|
|
2389
2383
|
const bytes = Uint8Array.from(atob(value), (character) => character.charCodeAt(0));
|
|
2390
2384
|
return new TextDecoder().decode(bytes);
|
|
2391
2385
|
};
|
|
2392
|
-
var toPdfBytes = (base64) => {
|
|
2393
|
-
const value = base64.includes(",") ? base64.slice(base64.indexOf(",") + 1) : base64;
|
|
2394
|
-
return Uint8Array.from(atob(value), (character) => character.charCodeAt(0));
|
|
2395
|
-
};
|
|
2396
2386
|
var PreviewComponent = ({ fileName, base64, className }) => {
|
|
2397
2387
|
const previewType = getPreviewType(fileName);
|
|
2398
2388
|
const dataUrl = toDataUrl(base64, fileName);
|
|
2399
|
-
const [pageCount, setPageCount] = React24.useState(null);
|
|
2400
|
-
const [pdfError, setPdfError] = React24.useState(false);
|
|
2401
2389
|
if (previewType === "image") {
|
|
2402
2390
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex h-full min-h-48 w-full items-center justify-center overflow-auto", className), children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: dataUrl, alt: fileName, className: "max-h-full max-w-full object-contain" }) });
|
|
2403
2391
|
}
|
|
2404
2392
|
if (previewType === "pdf") {
|
|
2405
|
-
return /* @__PURE__ */ jsxRuntime.jsx("
|
|
2406
|
-
"Unable to render ",
|
|
2407
|
-
fileName,
|
|
2408
|
-
". The PDF may be invalid or corrupted."
|
|
2409
|
-
] }) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
2410
|
-
reactPdf.Document,
|
|
2411
|
-
{
|
|
2412
|
-
file: { data: toPdfBytes(base64) },
|
|
2413
|
-
loading: /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
|
|
2414
|
-
"Loading ",
|
|
2415
|
-
fileName,
|
|
2416
|
-
"..."
|
|
2417
|
-
] }),
|
|
2418
|
-
error: /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
|
|
2419
|
-
"Unable to render ",
|
|
2420
|
-
fileName,
|
|
2421
|
-
". The PDF may be invalid or corrupted."
|
|
2422
|
-
] }),
|
|
2423
|
-
onLoadSuccess: ({ numPages }) => {
|
|
2424
|
-
setPageCount(numPages);
|
|
2425
|
-
setPdfError(false);
|
|
2426
|
-
},
|
|
2427
|
-
onLoadError: () => setPdfError(true),
|
|
2428
|
-
className: "flex w-full flex-col items-center",
|
|
2429
|
-
children: pageCount !== null && Array.from({ length: pageCount }, (_, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
2430
|
-
reactPdf.Page,
|
|
2431
|
-
{
|
|
2432
|
-
pageNumber: index + 1,
|
|
2433
|
-
renderAnnotationLayer: false,
|
|
2434
|
-
renderTextLayer: false,
|
|
2435
|
-
className: "mb-3 max-w-full shadow-sm"
|
|
2436
|
-
},
|
|
2437
|
-
`${fileName}-${index + 1}`
|
|
2438
|
-
))
|
|
2439
|
-
}
|
|
2440
|
-
) });
|
|
2393
|
+
return /* @__PURE__ */ jsxRuntime.jsx("iframe", { title: fileName, src: dataUrl, className: cn("h-full min-h-96 w-full border-0", className) });
|
|
2441
2394
|
}
|
|
2442
2395
|
if (previewType === "audio") {
|
|
2443
2396
|
return /* @__PURE__ */ jsxRuntime.jsx("audio", { controls: true, src: dataUrl, className: cn("w-full", className) });
|
|
@@ -2477,11 +2430,11 @@ function renderPluginChild(child, app, api, reloadKey) {
|
|
|
2477
2430
|
const renderFn = child;
|
|
2478
2431
|
return renderFn({ app, api });
|
|
2479
2432
|
}
|
|
2480
|
-
return
|
|
2481
|
-
if (!
|
|
2433
|
+
return React23.Children.map(child, (node, index) => {
|
|
2434
|
+
if (!React23.isValidElement(node)) {
|
|
2482
2435
|
return node;
|
|
2483
2436
|
}
|
|
2484
|
-
return
|
|
2437
|
+
return React23.cloneElement(
|
|
2485
2438
|
node,
|
|
2486
2439
|
{
|
|
2487
2440
|
key: `${reloadKey}-${index}`,
|
|
@@ -2511,13 +2464,13 @@ function PluginPlayground({
|
|
|
2511
2464
|
metadata,
|
|
2512
2465
|
backgroundImage
|
|
2513
2466
|
}) {
|
|
2514
|
-
const [mockUser] =
|
|
2515
|
-
const [mockToken] =
|
|
2516
|
-
const [isMinimized, setIsMinimized] =
|
|
2517
|
-
const [isClosed, setIsClosed] =
|
|
2518
|
-
const [isActive, setIsActive] =
|
|
2519
|
-
const [isNightMode, setIsNightMode] =
|
|
2520
|
-
|
|
2467
|
+
const [mockUser] = React23.useState(DEFAULT_MOCK_USER);
|
|
2468
|
+
const [mockToken] = React23.useState(DEFAULT_TOKEN);
|
|
2469
|
+
const [isMinimized, setIsMinimized] = React23.useState(false);
|
|
2470
|
+
const [isClosed, setIsClosed] = React23.useState(false);
|
|
2471
|
+
const [isActive, setIsActive] = React23.useState(true);
|
|
2472
|
+
const [isNightMode, setIsNightMode] = React23.useState(true);
|
|
2473
|
+
React23.useEffect(() => {
|
|
2521
2474
|
if (typeof window === "undefined") return;
|
|
2522
2475
|
const storedTheme = window.localStorage.getItem("plugin-playground-theme");
|
|
2523
2476
|
const prefersDark = window.matchMedia(
|
|
@@ -2526,7 +2479,7 @@ function PluginPlayground({
|
|
|
2526
2479
|
const shouldUseDark = storedTheme ? storedTheme === "dark" : prefersDark;
|
|
2527
2480
|
setIsNightMode(shouldUseDark);
|
|
2528
2481
|
}, []);
|
|
2529
|
-
|
|
2482
|
+
React23.useEffect(() => {
|
|
2530
2483
|
if (typeof document === "undefined") return;
|
|
2531
2484
|
document.documentElement.classList.toggle("dark", isNightMode);
|
|
2532
2485
|
window.localStorage.setItem(
|
|
@@ -2536,25 +2489,25 @@ function PluginPlayground({
|
|
|
2536
2489
|
}, [isNightMode]);
|
|
2537
2490
|
const title = metadata.title ?? metadata.name ?? "Plugin Playground";
|
|
2538
2491
|
const slug = metadata.slug ?? "local-plugin";
|
|
2539
|
-
const defaultSize =
|
|
2492
|
+
const defaultSize = React23.useMemo(() => getDefaultSize(metadata), [metadata]);
|
|
2540
2493
|
const canvasBackground = backgroundImage ?? metadata.backgroundImage ?? DEFAULT_BACKGROUND;
|
|
2541
2494
|
const isWindowResizable = metadata.windowSize?.isAppWindowResizing ?? metadata.isResizing ?? true;
|
|
2542
|
-
const minimizeWindow =
|
|
2495
|
+
const minimizeWindow = React23.useCallback(() => {
|
|
2543
2496
|
setIsActive(false);
|
|
2544
2497
|
setIsMinimized(true);
|
|
2545
2498
|
setIsClosed(false);
|
|
2546
2499
|
}, []);
|
|
2547
|
-
const closeWindow =
|
|
2500
|
+
const closeWindow = React23.useCallback(() => {
|
|
2548
2501
|
setIsActive(false);
|
|
2549
2502
|
setIsClosed(true);
|
|
2550
2503
|
setIsMinimized(false);
|
|
2551
2504
|
}, []);
|
|
2552
|
-
const restoreWindow =
|
|
2505
|
+
const restoreWindow = React23.useCallback(() => {
|
|
2553
2506
|
setIsActive(true);
|
|
2554
2507
|
setIsClosed(false);
|
|
2555
2508
|
setIsMinimized(false);
|
|
2556
2509
|
}, []);
|
|
2557
|
-
const mockApi =
|
|
2510
|
+
const mockApi = React23.useMemo(() => {
|
|
2558
2511
|
return {
|
|
2559
2512
|
showToast: (message, type) => {
|
|
2560
2513
|
console.info(`[playground:${type}] ${message}`);
|
|
@@ -2571,7 +2524,7 @@ function PluginPlayground({
|
|
|
2571
2524
|
isDarkTheme: isNightMode
|
|
2572
2525
|
};
|
|
2573
2526
|
}, [mockToken, mockUser, isNightMode]);
|
|
2574
|
-
const appProps =
|
|
2527
|
+
const appProps = React23.useMemo(
|
|
2575
2528
|
() => ({
|
|
2576
2529
|
name: title,
|
|
2577
2530
|
slug,
|
|
@@ -2741,13 +2694,13 @@ var WindowWithSideMenu = ({
|
|
|
2741
2694
|
removeShortcutListener,
|
|
2742
2695
|
getShortcutByCommand
|
|
2743
2696
|
} = useShortcutFormatter_default({ globalKeyboardShortcuts });
|
|
2744
|
-
const [state, dispatch] =
|
|
2697
|
+
const [state, dispatch] = React23.useReducer(reducer, {
|
|
2745
2698
|
...initialState,
|
|
2746
2699
|
windowSize: app.windowSize.windowSize ?? defaultSize,
|
|
2747
2700
|
defaultSize: app.windowSize.windowSize ?? defaultSize
|
|
2748
2701
|
});
|
|
2749
|
-
const windowRef =
|
|
2750
|
-
|
|
2702
|
+
const windowRef = React23.useRef(null);
|
|
2703
|
+
React23.useEffect(() => {
|
|
2751
2704
|
if (app.isMinimize !== state.isMinimized) {
|
|
2752
2705
|
dispatch({ type: "SYNC_MINIMIZE_STATE", payload: app.isMinimize });
|
|
2753
2706
|
}
|
|
@@ -2808,7 +2761,7 @@ var WindowWithSideMenu = ({
|
|
|
2808
2761
|
document.body.style.userSelect = "none";
|
|
2809
2762
|
dispatch({ type: "START_RESIZE", payload: { x: e.clientX, y: e.clientY } });
|
|
2810
2763
|
};
|
|
2811
|
-
|
|
2764
|
+
React23.useEffect(() => {
|
|
2812
2765
|
if (state.isDragging || state.resizeStart) {
|
|
2813
2766
|
window.addEventListener("mousemove", handleMouseMove);
|
|
2814
2767
|
window.addEventListener("mouseup", handleMouseUp);
|
|
@@ -2819,7 +2772,7 @@ var WindowWithSideMenu = ({
|
|
|
2819
2772
|
document.body.style.userSelect = "";
|
|
2820
2773
|
};
|
|
2821
2774
|
}, [state.isDragging, state.resizeStart]);
|
|
2822
|
-
|
|
2775
|
+
React23.useEffect(() => {
|
|
2823
2776
|
if (windowRef.current) {
|
|
2824
2777
|
windowRef.current.addEventListener("click", () => {
|
|
2825
2778
|
if (app?.callback) {
|
|
@@ -2828,7 +2781,7 @@ var WindowWithSideMenu = ({
|
|
|
2828
2781
|
});
|
|
2829
2782
|
}
|
|
2830
2783
|
}, [app?.slug, windowRef]);
|
|
2831
|
-
|
|
2784
|
+
React23.useEffect(() => {
|
|
2832
2785
|
const handleExitApp = () => {
|
|
2833
2786
|
if (app?.callback) {
|
|
2834
2787
|
app?.callback("CLOSE_APP");
|
|
@@ -2839,7 +2792,7 @@ var WindowWithSideMenu = ({
|
|
|
2839
2792
|
removeShortcutListener("exit_app", handleExitApp);
|
|
2840
2793
|
};
|
|
2841
2794
|
}, [app?.slug, app.isActive]);
|
|
2842
|
-
|
|
2795
|
+
React23.useEffect(() => {
|
|
2843
2796
|
const handleMinimize = () => {
|
|
2844
2797
|
if (app?.slug && app.isActive) {
|
|
2845
2798
|
dispatch({
|
|
@@ -2856,7 +2809,7 @@ var WindowWithSideMenu = ({
|
|
|
2856
2809
|
removeShortcutListener("minimize_app", handleMinimize);
|
|
2857
2810
|
};
|
|
2858
2811
|
}, [app?.slug, app.isActive, state.isMinimized, state.windowSize]);
|
|
2859
|
-
|
|
2812
|
+
React23.useEffect(() => {
|
|
2860
2813
|
const handleMaximize = () => {
|
|
2861
2814
|
if (app?.slug && app.isActive) {
|
|
2862
2815
|
dispatch({
|
|
@@ -3027,7 +2980,7 @@ var WindowWithSideMenu = ({
|
|
|
3027
2980
|
style: {
|
|
3028
2981
|
maxHeight: `${state.windowSize.height - 37}px`
|
|
3029
2982
|
},
|
|
3030
|
-
children:
|
|
2983
|
+
children: React23.isValidElement(children) && typeof children.type !== "string" ? React23__namespace.default.cloneElement(children, {
|
|
3031
2984
|
windowSize: state.windowSize,
|
|
3032
2985
|
isAppWindowResizing: state.resizeStart !== null
|
|
3033
2986
|
}) : children
|
|
@@ -3133,13 +3086,13 @@ var WindowWithoutSideMenu = ({
|
|
|
3133
3086
|
removeShortcutListener,
|
|
3134
3087
|
getShortcutByCommand
|
|
3135
3088
|
} = useShortcutFormatter_default({ globalKeyboardShortcuts });
|
|
3136
|
-
const [state, dispatch] =
|
|
3089
|
+
const [state, dispatch] = React23.useReducer(reducer2, {
|
|
3137
3090
|
...initialState2,
|
|
3138
3091
|
windowSize: app.windowSize.windowSize ?? defaultSize,
|
|
3139
3092
|
defaultSize: app.windowSize.windowSize ?? defaultSize
|
|
3140
3093
|
});
|
|
3141
|
-
const windowRef =
|
|
3142
|
-
|
|
3094
|
+
const windowRef = React23.useRef(null);
|
|
3095
|
+
React23.useEffect(() => {
|
|
3143
3096
|
if (app.isMinimize !== state.isMinimized) {
|
|
3144
3097
|
dispatch({ type: "SYNC_MINIMIZE_STATE", payload: app.isMinimize });
|
|
3145
3098
|
}
|
|
@@ -3196,7 +3149,7 @@ var WindowWithoutSideMenu = ({
|
|
|
3196
3149
|
document.body.style.userSelect = "none";
|
|
3197
3150
|
dispatch({ type: "START_RESIZE", payload: { x: e.clientX, y: e.clientY } });
|
|
3198
3151
|
};
|
|
3199
|
-
|
|
3152
|
+
React23.useEffect(() => {
|
|
3200
3153
|
if (state.isDragging || state.resizeStart) {
|
|
3201
3154
|
window.addEventListener("mousemove", handleMouseMove);
|
|
3202
3155
|
window.addEventListener("mouseup", handleMouseUp);
|
|
@@ -3207,7 +3160,7 @@ var WindowWithoutSideMenu = ({
|
|
|
3207
3160
|
document.body.style.userSelect = "";
|
|
3208
3161
|
};
|
|
3209
3162
|
}, [state.isDragging, state.resizeStart]);
|
|
3210
|
-
|
|
3163
|
+
React23.useEffect(() => {
|
|
3211
3164
|
if (windowRef.current) {
|
|
3212
3165
|
windowRef.current.addEventListener("click", () => {
|
|
3213
3166
|
if (app?.callback) {
|
|
@@ -3216,7 +3169,7 @@ var WindowWithoutSideMenu = ({
|
|
|
3216
3169
|
});
|
|
3217
3170
|
}
|
|
3218
3171
|
}, [app?.slug, windowRef]);
|
|
3219
|
-
|
|
3172
|
+
React23.useEffect(() => {
|
|
3220
3173
|
const handleExitApp = () => {
|
|
3221
3174
|
if (app?.callback) {
|
|
3222
3175
|
app?.callback("CLOSE_APP");
|
|
@@ -3227,7 +3180,7 @@ var WindowWithoutSideMenu = ({
|
|
|
3227
3180
|
removeShortcutListener("exit_app", handleExitApp);
|
|
3228
3181
|
};
|
|
3229
3182
|
}, [app?.slug, app.isActive]);
|
|
3230
|
-
|
|
3183
|
+
React23.useEffect(() => {
|
|
3231
3184
|
const handleMinimize = () => {
|
|
3232
3185
|
if (app?.slug && app.isActive) {
|
|
3233
3186
|
dispatch({
|
|
@@ -3244,7 +3197,7 @@ var WindowWithoutSideMenu = ({
|
|
|
3244
3197
|
removeShortcutListener("minimize_app", handleMinimize);
|
|
3245
3198
|
};
|
|
3246
3199
|
}, [app?.slug, app.isActive, state.isMinimized, state.windowSize]);
|
|
3247
|
-
|
|
3200
|
+
React23.useEffect(() => {
|
|
3248
3201
|
const handleMaximize = () => {
|
|
3249
3202
|
if (app?.slug && app.isActive) {
|
|
3250
3203
|
dispatch({
|
|
@@ -3360,7 +3313,7 @@ var WindowWithoutSideMenu = ({
|
|
|
3360
3313
|
style: {
|
|
3361
3314
|
maxHeight: `${state.windowSize.height - 37}px`
|
|
3362
3315
|
},
|
|
3363
|
-
children:
|
|
3316
|
+
children: React23.isValidElement(children) && typeof children.type !== "string" ? React23__namespace.default.cloneElement(children, {
|
|
3364
3317
|
windowSize: state.windowSize,
|
|
3365
3318
|
isAppWindowResizing: state.resizeStart !== null
|
|
3366
3319
|
}) : children
|
|
@@ -3383,7 +3336,7 @@ var WindowWithoutSideMenu = ({
|
|
|
3383
3336
|
);
|
|
3384
3337
|
};
|
|
3385
3338
|
var WindowWithoutSideMenu_default = WindowWithoutSideMenu;
|
|
3386
|
-
var Table =
|
|
3339
|
+
var Table = React23__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3387
3340
|
"table",
|
|
3388
3341
|
{
|
|
3389
3342
|
ref,
|
|
@@ -3392,9 +3345,9 @@ var Table = React24__namespace.forwardRef(({ className, ...props }, ref) => /* @
|
|
|
3392
3345
|
}
|
|
3393
3346
|
) }));
|
|
3394
3347
|
Table.displayName = "Table";
|
|
3395
|
-
var TableHeader =
|
|
3348
|
+
var TableHeader = React23__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("thead", { ref, className: cn("[&_tr]:border-b text-neutral-400 bg-surface-2", className), ...props }));
|
|
3396
3349
|
TableHeader.displayName = "TableHeader";
|
|
3397
|
-
var TableBody =
|
|
3350
|
+
var TableBody = React23__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
3398
3351
|
"tbody",
|
|
3399
3352
|
{
|
|
3400
3353
|
ref,
|
|
@@ -3403,7 +3356,7 @@ var TableBody = React24__namespace.forwardRef(({ className, ...props }, ref) =>
|
|
|
3403
3356
|
}
|
|
3404
3357
|
));
|
|
3405
3358
|
TableBody.displayName = "TableBody";
|
|
3406
|
-
var TableFooter =
|
|
3359
|
+
var TableFooter = React23__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
3407
3360
|
"tfoot",
|
|
3408
3361
|
{
|
|
3409
3362
|
ref,
|
|
@@ -3415,7 +3368,7 @@ var TableFooter = React24__namespace.forwardRef(({ className, ...props }, ref) =
|
|
|
3415
3368
|
}
|
|
3416
3369
|
));
|
|
3417
3370
|
TableFooter.displayName = "TableFooter";
|
|
3418
|
-
var TableRow =
|
|
3371
|
+
var TableRow = React23__namespace.forwardRef(({ className, onClick, ...props }, ref) => {
|
|
3419
3372
|
const isInteractive = typeof onClick === "function";
|
|
3420
3373
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3421
3374
|
"tr",
|
|
@@ -3432,7 +3385,7 @@ var TableRow = React24__namespace.forwardRef(({ className, onClick, ...props },
|
|
|
3432
3385
|
);
|
|
3433
3386
|
});
|
|
3434
3387
|
TableRow.displayName = "TableRow";
|
|
3435
|
-
var TableHead =
|
|
3388
|
+
var TableHead = React23__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
3436
3389
|
"th",
|
|
3437
3390
|
{
|
|
3438
3391
|
ref,
|
|
@@ -3444,7 +3397,7 @@ var TableHead = React24__namespace.forwardRef(({ className, ...props }, ref) =>
|
|
|
3444
3397
|
}
|
|
3445
3398
|
));
|
|
3446
3399
|
TableHead.displayName = "TableHead";
|
|
3447
|
-
var TableCell =
|
|
3400
|
+
var TableCell = React23__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
3448
3401
|
"td",
|
|
3449
3402
|
{
|
|
3450
3403
|
ref,
|
|
@@ -3453,7 +3406,7 @@ var TableCell = React24__namespace.forwardRef(({ className, ...props }, ref) =>
|
|
|
3453
3406
|
}
|
|
3454
3407
|
));
|
|
3455
3408
|
TableCell.displayName = "TableCell";
|
|
3456
|
-
var TableCaption =
|
|
3409
|
+
var TableCaption = React23__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
3457
3410
|
"caption",
|
|
3458
3411
|
{
|
|
3459
3412
|
ref,
|
|
@@ -3463,12 +3416,12 @@ var TableCaption = React24__namespace.forwardRef(({ className, ...props }, ref)
|
|
|
3463
3416
|
));
|
|
3464
3417
|
TableCaption.displayName = "TableCaption";
|
|
3465
3418
|
var useGridClasses = (windowSize, gridRules) => {
|
|
3466
|
-
const deviceType =
|
|
3419
|
+
const deviceType = React23.useMemo(() => {
|
|
3467
3420
|
if (windowSize.width <= 640) return "mobile";
|
|
3468
3421
|
if (windowSize.width <= 1024) return "tablet";
|
|
3469
3422
|
return "desktop";
|
|
3470
3423
|
}, [windowSize]);
|
|
3471
|
-
const gridClasses =
|
|
3424
|
+
const gridClasses = React23.useMemo(() => {
|
|
3472
3425
|
const classes = {};
|
|
3473
3426
|
for (const element in gridRules) {
|
|
3474
3427
|
const classRules = gridRules[element] ?? {};
|
|
@@ -3481,8 +3434,8 @@ var useGridClasses = (windowSize, gridRules) => {
|
|
|
3481
3434
|
};
|
|
3482
3435
|
var useGridClasses_default = useGridClasses;
|
|
3483
3436
|
var useDeviceSupport = () => {
|
|
3484
|
-
const [isSupported, setIsSupported] =
|
|
3485
|
-
|
|
3437
|
+
const [isSupported, setIsSupported] = React23.useState(true);
|
|
3438
|
+
React23.useEffect(() => {
|
|
3486
3439
|
function checkSupport() {
|
|
3487
3440
|
const ua = typeof window !== "undefined" ? window.navigator.userAgent : "";
|
|
3488
3441
|
const width = typeof window !== "undefined" ? window.innerWidth : 1920;
|
|
@@ -3608,7 +3561,7 @@ var useSound = () => {
|
|
|
3608
3561
|
audio.currentTime = 0;
|
|
3609
3562
|
await audio.play();
|
|
3610
3563
|
};
|
|
3611
|
-
const playSound =
|
|
3564
|
+
const playSound = React23.useCallback((type) => {
|
|
3612
3565
|
if (typeof window === "undefined") {
|
|
3613
3566
|
return;
|
|
3614
3567
|
}
|