@fde-desktop/fde-core 0.3.8 → 0.4.1

package/dist/chunk-QB72BLCJ.cjs

@@ -0,0 +1,237 @@
+'use strict';
+
+var chunk657BJOY5_cjs = require('./chunk-657BJOY5.cjs');
+var chunk2PSTHGTD_cjs = require('./chunk-2PSTHGTD.cjs');
+var chunkBDO6B7MZ_cjs = require('./chunk-BDO6B7MZ.cjs');
+var chunk6QOUYSEE_cjs = require('./chunk-6QOUYSEE.cjs');
+var chunk7Y7HB7FB_cjs = require('./chunk-7Y7HB7FB.cjs');
+var chunkE55VXNLK_cjs = require('./chunk-E55VXNLK.cjs');
+var react = require('react');
+var reactI18next = require('react-i18next');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/utils/formatBytes.ts
+function formatBytes(bytes) {
+  if (bytes === 0) return "0 B";
+  const k = 1024;
+  const sizes = ["B", "KB", "MB", "GB", "TB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  const index = Math.min(i, sizes.length - 1);
+  return `${parseFloat((bytes / Math.pow(k, index)).toFixed(1))} ${sizes[index]}`;
+}
+
+// src/components/Apps/UploaderApp/UploaderApp.module.css
+var UploaderApp_default = {};
+var UploaderApp = ({ window: win }) => {
+  const { t } = reactI18next.useTranslation("apps");
+  const createFile = chunk6QOUYSEE_cjs.useDesktopStore((state) => state.createFile);
+  const openApp = chunk657BJOY5_cjs.useOpenApp();
+  const [activeStep, setActiveStep] = react.useState(0);
+  const [file, setFile] = react.useState(null);
+  const [selectedFolderId, setSelectedFolderId] = react.useState(null);
+  const [folderSelected, setFolderSelected] = react.useState(false);
+  const [pickerOpen, setPickerOpen] = react.useState(false);
+  const [uploadStarted, setUploadStarted] = react.useState(false);
+  const [uploadState, setUploadState] = react.useState({
+    status: "idle",
+    progress: { status: "idle", loaded: 0, total: null, percent: null, error: null }
+  });
+  const [createdFileId, setCreatedFileId] = react.useState(null);
+  const uploadIcon = chunk7Y7HB7FB_cjs.useFcIconElement("FcUpload", { size: 120 });
+  const checkIconLg = chunk7Y7HB7FB_cjs.useFcIconElement("FcCheckmark", { size: 64 });
+  const checkIconSm = chunk7Y7HB7FB_cjs.useFcIconElement("FcCheckmark", { size: 14 });
+  const infoIcon = chunk7Y7HB7FB_cjs.useFcIconElement("FcInfo", { size: 64 });
+  const handleFileChange = react.useCallback((selectedFile) => {
+    if (selectedFile) {
+      setFile(selectedFile);
+      setActiveStep(1);
+    }
+  }, []);
+  const handleFolderSelect = react.useCallback((folderId) => {
+    setSelectedFolderId(folderId);
+    setFolderSelected(true);
+    setPickerOpen(false);
+    setActiveStep(2);
+  }, []);
+  const handleUpload = react.useCallback(async () => {
+    if (!file) return;
+    console.log("[UploaderApp] Starting upload for file:", file.name, "size:", file.size);
+    setUploadStarted(true);
+    setUploadState({
+      status: "reading",
+      progress: { status: "downloading", loaded: 0, total: file.size, percent: 0, error: null }
+    });
+    try {
+      setUploadState((prev) => ({
+        ...prev,
+        progress: {
+          status: "downloading",
+          loaded: 0,
+          total: file.size,
+          percent: 0,
+          error: null
+        }
+      }));
+      for (let i = 0; i <= 50; i += 10) {
+        await new Promise((resolve) => setTimeout(resolve, 50));
+        setUploadState((prev) => ({
+          ...prev,
+          progress: {
+            status: "downloading",
+            loaded: Math.floor(file.size * i / 100),
+            total: file.size,
+            percent: i,
+            error: null
+          }
+        }));
+      }
+      console.log("[UploaderApp] Calling saveBlob...");
+      const saveBlobStart = Date.now();
+      const idbUrl = await chunk6QOUYSEE_cjs.fileSystem.saveBlob(file);
+      console.log(
+        "[UploaderApp] saveBlob completed in",
+        Date.now() - saveBlobStart,
+        "ms, url:",
+        idbUrl
+      );
+      setUploadState((prev) => ({
+        ...prev,
+        progress: {
+          status: "downloading",
+          loaded: Math.floor(file.size * 80 / 100),
+          total: file.size,
+          percent: 80,
+          error: null
+        }
+      }));
+      console.log("[UploaderApp] Calling createFile with folderId:", selectedFolderId);
+      const createStart = Date.now();
+      const createdFile = await createFile(file.name, "", selectedFolderId, idbUrl);
+      console.log(
+        "[UploaderApp] createFile completed in",
+        Date.now() - createStart,
+        "ms, id:",
+        createdFile.id
+      );
+      setCreatedFileId(createdFile.id);
+      setUploadState({
+        status: "done",
+        progress: {
+          status: "done",
+          loaded: file.size,
+          total: file.size,
+          percent: 100,
+          error: null
+        }
+      });
+      await new Promise((resolve) => setTimeout(resolve, 1e3));
+      setActiveStep(3);
+    } catch (err) {
+      console.error("[UploaderApp] Upload FAILED:", err);
+      setUploadState((prev) => ({
+        ...prev,
+        status: "error",
+        error: err instanceof Error ? err.message : "Upload failed"
+      }));
+      await new Promise((resolve) => setTimeout(resolve, 1e3));
+      setActiveStep(3);
+    }
+  }, [file, selectedFolderId, createFile]);
+  const handleShowFile = react.useCallback(() => {
+    if (!selectedFolderId) {
+      openApp("files");
+    } else {
+      openApp("files", { contentData: { initialFolderId: selectedFolderId } });
+    }
+  }, [selectedFolderId, openApp]);
+  const handleOpenFile = react.useCallback(() => {
+    if (!createdFileId) return;
+    const createdNode = chunk6QOUYSEE_cjs.useDesktopStore.getState().fsNodes.find((n) => n.id === createdFileId);
+    if (!createdNode || createdNode.type !== "file") return;
+    const fileNode = createdNode;
+    const result = chunk6QOUYSEE_cjs.getAppIdForMime(fileNode);
+    if (result) {
+      openApp(result.appId, { contentData: result.contentData });
+    }
+  }, [createdFileId, openApp]);
+  if (!win) return null;
+  const isSuccess = uploadState.status === "done";
+  const errorMessage = uploadState.error;
+  if (activeStep === 3) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: UploaderApp_default.container, children: /* @__PURE__ */ jsxRuntime.jsxs(chunkE55VXNLK_cjs.Paper, { shadow: "sm", className: UploaderApp_default.resultPaper, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Box, { className: UploaderApp_default.resultIcon, children: isSuccess ? checkIconLg : infoIcon }),
+      /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Text, { size: "lg", fw: 500, ta: "center", children: isSuccess ? t("uploader.uploadComplete") : `${t("uploader.uploadFailed")}: ${errorMessage}` }),
+      isSuccess && /* @__PURE__ */ jsxRuntime.jsxs(chunkE55VXNLK_cjs.Group, { mt: "md", justify: "center", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          chunkE55VXNLK_cjs.Button,
+          {
+            variant: "default",
+            size: "sm",
+            onClick: handleShowFile,
+            "data-testid": "uploader-show-file",
+            children: t("uploader.showFile")
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Button, { size: "sm", onClick: handleOpenFile, "data-testid": "uploader-open-file", children: t("uploader.openFile") })
+      ] })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: UploaderApp_default.container, children: [
+    uploadIcon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: UploaderApp_default.backgroundIcon, children: uploadIcon }),
+    /* @__PURE__ */ jsxRuntime.jsxs(chunkE55VXNLK_cjs.Stepper, { active: activeStep, orientation: "horizontal", size: "sm", className: UploaderApp_default.stepper, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Stepper.Step, { label: t("uploader.stepSelect"), description: t("uploader.clickToUpload"), children: /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.FileButton, { accept: "*", onChange: handleFileChange, children: (props) => /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Button, { ...props, size: "sm", "data-testid": "uploader-select-file", children: t("uploader.clickToUpload") }) }) }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        chunkE55VXNLK_cjs.Stepper.Step,
+        {
+          label: t("uploader.stepDestination"),
+          description: folderSelected ? /* @__PURE__ */ jsxRuntime.jsxs(chunkE55VXNLK_cjs.Group, { gap: 4, align: "center", style: { display: "inline-flex" }, children: [
+            checkIconSm,
+            /* @__PURE__ */ jsxRuntime.jsx("span", { children: t("uploader.folderSelected") })
+          ] }) : t("uploader.selectDestination"),
+          children: [
+            file && /* @__PURE__ */ jsxRuntime.jsxs(chunkE55VXNLK_cjs.Box, { className: UploaderApp_default.fileInfo, children: [
+              /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Text, { size: "sm", fw: 500, children: file.name }),
+              /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Text, { size: "xs", c: "dimmed", children: formatBytes(file.size) })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(chunkE55VXNLK_cjs.Group, { mt: "md", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                chunkE55VXNLK_cjs.Button,
+                {
+                  variant: "default",
+                  size: "xs",
+                  onClick: () => setPickerOpen(true),
+                  "data-testid": "uploader-select-folder",
+                  children: t("uploader.selectDestination")
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Button, { size: "xs", onClick: () => setActiveStep(2), "data-testid": "uploader-skip-folder", children: t("uploader.next", { defaultValue: "Next" }) })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Text, { size: "xs", c: "dimmed", mt: "xs", children: selectedFolderId ? `${t("uploader.uploadTo")}: ${chunk6QOUYSEE_cjs.useDesktopStore.getState().fsNodes.find((n) => n.id === selectedFolderId)?.name || ""}` : t("uploader.uploadToRoot") })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Stepper.Step, { label: t("uploader.stepUpload"), description: t("uploader.uploading"), children: !uploadStarted ? /* @__PURE__ */ jsxRuntime.jsxs(chunkE55VXNLK_cjs.Box, { className: UploaderApp_default.readyContainer, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Text, { size: "sm", ta: "center", children: t("uploader.readyToUpload") }),
+        /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Group, { justify: "center", children: /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Button, { size: "sm", onClick: handleUpload, "data-testid": "uploader-upload", children: t("uploader.upload") }) })
+      ] }) : /* @__PURE__ */ jsxRuntime.jsx(
+        chunk2PSTHGTD_cjs.DownloadProgress_default,
+        {
+          state: uploadState.progress,
+          ariaLabel: t("uploader.uploadProgress")
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      chunkBDO6B7MZ_cjs.FolderPickerModal,
+      {
+        opened: pickerOpen,
+        onConfirm: handleFolderSelect,
+        onCancel: () => setPickerOpen(false)
+      }
+    )
+  ] });
+};
+var UploaderApp_default2 = UploaderApp;
+
+exports.UploaderApp_default = UploaderApp_default2;
+exports.formatBytes = formatBytes;

package/dist/chunk-QHBBLML3.js

@@ -0,0 +1,86 @@
+import { useImageViewerStore } from './chunk-DWP2SYF7.js';
+import { AppEmptyState_default } from './chunk-ZHNDXNL4.js';
+import { useResolvedUrl } from './chunk-EUQLZW6P.js';
+import { FilePickerModal } from './chunk-4MCFQPKY.js';
+import { IMAGE_MIME_TYPES } from './chunk-NWMSWRUD.js';
+import { useState, useRef, useEffect, useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+// src/components/Apps/ImageViewerApp/ImageViewerApp.module.css
+var ImageViewerApp_default = {};
+var ACCEPTED_IMAGE_TYPES = [...IMAGE_MIME_TYPES, "image/*"];
+var ImageViewerApp = ({ window, notifyReady }) => {
+  const { t } = useTranslation("apps");
+  const win = window;
+  const windowId = win?.id ?? "";
+  const initialSrc = win?.contentData?.src;
+  const [src, setSrc] = useState(initialSrc);
+  const [pickerOpen, setPickerOpen] = useState(false);
+  const [imageDimensions, setImageDimensions] = useState(null);
+  const containerRef = useRef(null);
+  const displayZoom = useImageViewerStore((s) => s.getDisplayZoom(windowId));
+  const fitToWindow = useImageViewerStore((s) => s.getFitToWindow(windowId));
+  const updateCalculatedZoom = useImageViewerStore((s) => s.updateCalculatedZoom);
+  const reset = useImageViewerStore((s) => s.reset);
+  const resolvedSrc = useResolvedUrl(src);
+  useEffect(() => {
+    reset(windowId);
+  }, [windowId, reset]);
+  useEffect(() => {
+    if (!fitToWindow || !imageDimensions || !containerRef.current) return;
+    const observer = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        const { width, height } = entry.contentRect;
+        updateCalculatedZoom(windowId, imageDimensions, { width, height });
+      }
+    });
+    observer.observe(containerRef.current);
+    return () => observer.disconnect();
+  }, [fitToWindow, imageDimensions, windowId, updateCalculatedZoom]);
+  useEffect(() => {
+    notifyReady?.({
+      ...win?.contentData ?? {},
+      setPickerOpen: () => setPickerOpen(true)
+    });
+  }, [win, notifyReady]);
+  const handleFileSelected = useCallback(
+    (node) => {
+      setSrc(node.url ?? node.name);
+      setPickerOpen(false);
+      reset(windowId);
+      setImageDimensions(null);
+    },
+    [windowId, reset]
+  );
+  const handleImageLoad = useCallback((e) => {
+    const img = e.currentTarget;
+    setImageDimensions({ width: img.naturalWidth, height: img.naturalHeight });
+  }, []);
+  const imgStyle = fitToWindow ? void 0 : { transform: `scale(${displayZoom / 100})` };
+  const content = resolvedSrc ? /* @__PURE__ */ jsx(
+    "img",
+    {
+      src: resolvedSrc,
+      alt: resolvedSrc.split("/").pop() ?? "image",
+      className: ImageViewerApp_default.image,
+      style: imgStyle,
+      onLoad: handleImageLoad
+    }
+  ) : /* @__PURE__ */ jsx(AppEmptyState_default, { label: t("imageViewer.noImage") });
+  return /* @__PURE__ */ jsxs("div", { ref: containerRef, className: ImageViewerApp_default.container, "data-windowid": win?.id, children: [
+    content,
+    /* @__PURE__ */ jsx(
+      FilePickerModal,
+      {
+        opened: pickerOpen,
+        acceptedMimeTypes: ACCEPTED_IMAGE_TYPES,
+        onConfirm: handleFileSelected,
+        onCancel: () => setPickerOpen(false)
+      }
+    )
+  ] });
+};
+var ImageViewerApp_default2 = ImageViewerApp;
+
+export { ImageViewerApp_default2 as ImageViewerApp_default };

package/dist/chunk-RDIDAZ3S.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+// src/hooks/useMenuBarUtils.ts
+function appendDirtyIndicator(items, isDirty) {
+  if (!isDirty) return items;
+  return [...items, { type: "dirty-indicator" }];
+}
+
+exports.appendDirtyIndicator = appendDirtyIndicator;

package/dist/chunk-RGJPRXYY.js

@@ -0,0 +1,48 @@
+import { appendDirtyIndicator } from './chunk-YAIWI4Z5.js';
+import { AppMenuBar_default } from './chunk-4E45FBAH.js';
+import { useIsDirty } from './chunk-IDHP3R4I.js';
+import { useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { jsx } from 'react/jsx-runtime';
+
+var useSettingsMenuBarElements = (options) => {
+  const { windowId, contentData, onExit } = options;
+  const { t } = useTranslation("common");
+  const isDirty = useIsDirty(windowId);
+  const discard = contentData?.discard;
+  return useMemo(() => {
+    const items = [
+      {
+        type: "menu",
+        label: t("menu.file"),
+        items: [
+          {
+            type: "item",
+            label: t("actions.discard"),
+            icon: "FcCancel",
+            onClick: () => discard?.(),
+            disabled: !isDirty
+          },
+          { type: "divider" },
+          {
+            type: "item",
+            label: t("actions.exit"),
+            icon: "FcLeft",
+            onClick: onExit
+          }
+        ]
+      }
+    ];
+    return appendDirtyIndicator(items, isDirty);
+  }, [t, isDirty, discard, onExit]);
+};
+var SettingsMenuBar = ({ windowId, contentData, onExit }) => {
+  const elements = useSettingsMenuBarElements({
+    windowId,
+    contentData,
+    onExit
+  });
+  return /* @__PURE__ */ jsx(AppMenuBar_default, { elements });
+};
+
+export { SettingsMenuBar };

package/dist/chunk-RQ6OZRUW.cjs

@@ -0,0 +1,41 @@
+'use strict';
+
+var zustand = require('zustand');
+
+// src/components/Apps/NotesApp/notesStore.ts
+var DEFAULT_STATE = {
+  isDirty: false,
+  contentLoaded: false
+};
+var useNotesStore = zustand.create((set, get) => ({
+  states: {},
+  getIsDirty: (windowId) => get().states[windowId]?.isDirty ?? false,
+  setIsDirty: (windowId, isDirty) => {
+    const currentIsDirty = get().states[windowId]?.isDirty ?? false;
+    if (currentIsDirty === isDirty) return;
+    set((s) => ({
+      states: {
+        ...s.states,
+        [windowId]: { ...s.states[windowId] ?? DEFAULT_STATE, isDirty }
+      }
+    }));
+  },
+  getContentLoaded: (windowId) => get().states[windowId]?.contentLoaded ?? false,
+  setContentLoaded: (windowId, loaded) => {
+    set((s) => ({
+      states: {
+        ...s.states,
+        [windowId]: { ...s.states[windowId] ?? DEFAULT_STATE, contentLoaded: loaded }
+      }
+    }));
+  },
+  reset: (windowId) => {
+    set((s) => ({
+      states: { ...s.states, [windowId]: DEFAULT_STATE }
+    }));
+  }
+}));
+var useIsDirty = (windowId) => useNotesStore((s) => s.states[windowId]?.isDirty ?? false);
+
+exports.useIsDirty = useIsDirty;
+exports.useNotesStore = useNotesStore;

package/dist/chunk-SBE4SZAN.cjs

@@ -0,0 +1,226 @@
+'use strict';
+
+var chunk7Y7HB7FB_cjs = require('./chunk-7Y7HB7FB.cjs');
+var chunkE55VXNLK_cjs = require('./chunk-E55VXNLK.cjs');
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('react');
+
+var DirtyIndicator = ({ size = 16 }) => {
+  const icon = chunk7Y7HB7FB_cjs.useFcIconElement("FcSynchronize", { size });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      style: {
+        color: "orange",
+        fontWeight: "bold",
+        marginLeft: "8px",
+        display: "flex",
+        alignItems: "center"
+      },
+      title: "Unsaved changes",
+      children: icon
+    }
+  );
+};
+var DirtyIndicator_default = DirtyIndicator;
+
+// src/components/AppMenuBar/AppMenuBar.module.css
+var AppMenuBar_default = {};
+var ICON_PROPS = { size: 16, style: { display: "block" } };
+var FcIcon = ({ name }) => chunk7Y7HB7FB_cjs.useFcIconElement(name, ICON_PROPS);
+var MenuDropdownElement = ({
+  label,
+  icon,
+  items,
+  rightSection
+}) => {
+  const [opened, setOpened] = react.useState(false);
+  const TriggerIcon = () => chunk7Y7HB7FB_cjs.useFcIconElement(icon ?? "", ICON_PROPS);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    chunkE55VXNLK_cjs.Menu,
+    {
+      opened,
+      onClose: () => setOpened(false),
+      withinPortal: true,
+      keepMounted: true,
+      closeOnItemClick: true,
+      closeOnEscape: true,
+      closeOnClickOutside: true,
+      position: "bottom-start",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Menu.Target, { children: /* @__PURE__ */ jsxRuntime.jsxs("button", { className: AppMenuBar_default.menuTrigger, onClick: () => setOpened((o) => !o), children: [
+          icon && /* @__PURE__ */ jsxRuntime.jsx(TriggerIcon, {}),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: label }),
+          rightSection && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { marginLeft: "auto" }, children: rightSection })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Menu.Dropdown, { children: items.map((item, idx) => {
+          if (item.type === "divider") {
+            return /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Menu.Divider, {}, idx);
+          }
+          if (item.type === "slider") {
+            return /* @__PURE__ */ jsxRuntime.jsx(chunkE55VXNLK_cjs.Menu.Item, { closeMenuOnClick: false, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { minWidth: 120 }, children: [
+              item.label && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginBottom: 4 }, children: item.label }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                chunkE55VXNLK_cjs.Slider,
+                {
+                  min: item.min,
+                  max: item.max,
+                  value: item.value,
+                  onChange: item.onChange,
+                  size: "sm"
+                }
+              )
+            ] }) }, idx);
+          }
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            chunkE55VXNLK_cjs.Menu.Item,
+            {
+              disabled: item.disabled,
+              onClick: item.onClick,
+              leftSection: item.icon ? /* @__PURE__ */ jsxRuntime.jsx(FcIcon, { name: item.icon }) : void 0,
+              children: item.label
+            },
+            idx
+          );
+        }) })
+      ]
+    }
+  );
+};
+var AppMenuBar = ({ elements }) => {
+  const [sliderStates, setSliderStates] = react.useState({});
+  const setSliderState = (idx, state) => {
+    setSliderStates((prev) => ({
+      ...prev,
+      [idx]: { ...prev[idx] ?? { isHovered: false, isDragging: false }, ...state }
+    }));
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: AppMenuBar_default.root, role: "menubar", "aria-label": "Application menu", children: elements.map((el, idx) => {
+    switch (el.type) {
+      case "menu":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          MenuDropdownElement,
+          {
+            label: el.label,
+            icon: el.icon,
+            items: el.items,
+            rightSection: el.rightSection
+          },
+          idx
+        );
+      case "combobox":
+        return /* @__PURE__ */ jsxRuntime.jsx("div", { className: AppMenuBar_default.element, children: /* @__PURE__ */ jsxRuntime.jsx(
+          chunkE55VXNLK_cjs.Select,
+          {
+            data: el.options,
+            value: el.value,
+            onChange: (v) => v && el.onChange(v),
+            placeholder: el.label,
+            size: "sm",
+            className: AppMenuBar_default.select,
+            comboboxProps: { withinPortal: true }
+          }
+        ) }, idx);
+      case "switch":
+        return /* @__PURE__ */ jsxRuntime.jsx("div", { className: AppMenuBar_default.element, children: /* @__PURE__ */ jsxRuntime.jsx(
+          chunkE55VXNLK_cjs.Switch,
+          {
+            label: el.label,
+            checked: el.checked,
+            onChange: (e) => el.onChange(e.currentTarget.checked),
+            size: "sm"
+          }
+        ) }, idx);
+      case "slider": {
+        const sliderState = sliderStates[idx] ?? { isHovered: false, isDragging: false };
+        const isTooltipOpen = sliderState.isHovered || sliderState.isDragging;
+        const labelFormat = el.labelFormat ?? ((val) => String(val));
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          chunkE55VXNLK_cjs.Tooltip,
+          {
+            label: labelFormat(el.value),
+            position: "bottom",
+            withArrow: true,
+            opened: isTooltipOpen,
+            children: /* @__PURE__ */ jsxRuntime.jsxs(
+              "div",
+              {
+                className: AppMenuBar_default.element,
+                onMouseEnter: () => setSliderState(idx, { isHovered: true }),
+                onMouseLeave: () => setSliderState(idx, { isHovered: false }),
+                children: [
+                  el.label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: AppMenuBar_default.sliderLabel, children: el.label }),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    chunkE55VXNLK_cjs.Slider,
+                    {
+                      min: el.min,
+                      max: el.max,
+                      value: el.value,
+                      onChange: (val) => {
+                        el.onChange(val);
+                        setSliderState(idx, { isDragging: true });
+                      },
+                      onChangeEnd: (val) => {
+                        el.onChange(val);
+                        setSliderState(idx, { isDragging: false });
+                      },
+                      size: "sm",
+                      className: AppMenuBar_default.slider,
+                      marks: el.marks
+                    }
+                  )
+                ]
+              }
+            )
+          },
+          idx
+        );
+      }
+      case "text-input":
+        return /* @__PURE__ */ jsxRuntime.jsx("div", { className: AppMenuBar_default.element, children: /* @__PURE__ */ jsxRuntime.jsx(
+          chunkE55VXNLK_cjs.TextInput,
+          {
+            placeholder: el.placeholder,
+            value: el.value,
+            onChange: (e) => el.onChange(e.currentTarget.value),
+            size: "sm",
+            className: AppMenuBar_default.textInput
+          }
+        ) }, idx);
+      case "number-input":
+        return /* @__PURE__ */ jsxRuntime.jsx("div", { className: AppMenuBar_default.element, children: /* @__PURE__ */ jsxRuntime.jsx(
+          chunkE55VXNLK_cjs.NumberInput,
+          {
+            label: el.label,
+            value: el.value,
+            onChange: (v) => el.onChange(typeof v === "number" ? v : 0),
+            min: el.min,
+            max: el.max,
+            step: el.step ?? 1,
+            placeholder: el.placeholder,
+            size: "sm",
+            className: AppMenuBar_default.numberInput
+          }
+        ) }, idx);
+      case "select":
+        return /* @__PURE__ */ jsxRuntime.jsx("div", { className: AppMenuBar_default.element, children: /* @__PURE__ */ jsxRuntime.jsx(
+          chunkE55VXNLK_cjs.Select,
+          {
+            label: el.label,
+            data: el.options,
+            value: el.value,
+            onChange: (v) => v && el.onChange(v),
+            size: "sm",
+            className: AppMenuBar_default.select,
+            comboboxProps: { withinPortal: true }
+          }
+        ) }, idx);
+      case "dirty-indicator":
+        return /* @__PURE__ */ jsxRuntime.jsx("span", { style: { marginLeft: "auto" }, children: /* @__PURE__ */ jsxRuntime.jsx(DirtyIndicator_default, {}) }, idx);
+    }
+  }) });
+};
+var AppMenuBar_default2 = AppMenuBar;
+
+exports.AppMenuBar_default = AppMenuBar_default2;
+exports.DirtyIndicator_default = DirtyIndicator_default;