@fde-desktop/fde-core 0.3.8 → 0.4.2

package/dist/chunk-3IICBLEA.js

@@ -0,0 +1,442 @@
+import { useNotesStore } from './chunk-FH4ILMKF.js';
+import { VscIcon_default } from './chunk-GRYCUBJZ.js';
+import { useCloseInterceptor } from './chunk-ODXL6BR3.js';
+import { FilePickerModal, FileSaveModal } from './chunk-4MCFQPKY.js';
+import { TEXT_MIME_TYPES, useDesktopStore, resolveFileUrl } from './chunk-NWMSWRUD.js';
+import { useState, useRef, useEffect, useCallback } from 'react';
+import { useEditor, useEditorState, EditorContent } from '@tiptap/react';
+import StarterKit from '@tiptap/starter-kit';
+import { Markdown } from '@tiptap/markdown';
+import { Extension } from '@tiptap/core';
+import { useTranslation } from 'react-i18next';
+import { create } from 'zustand';
+import { persist, createJSONStorage } from 'zustand/middleware';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var useAppTempMemoryStore = create()(
+  persist(
+    (set, get) => ({
+      snapshots: {},
+      setSnapshot: (appId, snapshot) => set((state) => ({ snapshots: { ...state.snapshots, [appId]: snapshot } })),
+      getSnapshot: (appId) => {
+        const { snapshots } = get();
+        return snapshots[appId] ?? null;
+      },
+      clearSnapshot: (appId) => set((state) => {
+        const rest = { ...state.snapshots };
+        delete rest[appId];
+        return { snapshots: rest };
+      })
+    }),
+    {
+      name: "fde-desktop:appTempMemory",
+      storage: createJSONStorage(() => localStorage)
+    }
+  )
+);
+
+// src/components/Apps/NotesApp/NotesApp.module.css
+var NotesApp_default = {};
+var ACCEPTED_MD_TYPES = [...TEXT_MIME_TYPES];
+var ClearMarksOnEnter = Extension.create({
+  name: "clearMarksOnEnter",
+  addKeyboardShortcuts() {
+    return {
+      Enter: ({ editor }) => {
+        const { state, dispatch } = editor.view;
+        const { selection, schema } = state;
+        const { $from, empty } = selection;
+        if (!empty || $from.parent.type !== schema.nodes.paragraph) return false;
+        const tr = state.tr.split($from.pos).setStoredMarks([]);
+        dispatch(tr);
+        return true;
+      }
+    };
+  }
+});
+var WELCOME_URL = "Desktop/NotesAppWelcome.md";
+var NotesApp = ({ window, notifyReady }) => {
+  const { t } = useTranslation("notes");
+  const win = window;
+  const windowId = win?.id;
+  const appId = windowId ? `notesApp-${windowId}` : "notesApp";
+  const contentData = win?.contentData;
+  const [fileName, setFileName] = useState(contentData?.initialName ?? t("untitled"));
+  const [saveModalOpen, setSaveModalOpen] = useState(false);
+  const pendingSaveMode = useRef("save");
+  const [fileId, setFileId] = useState(contentData?.fileId ?? null);
+  const contentSnapshotRef = useRef(contentData?.initialContent ?? "");
+  const [isDirty, setIsDirty] = useState(false);
+  const contentLoaded = useNotesStore((s) => s.states[windowId ?? ""]?.contentLoaded ?? false);
+  const setContentLoaded = useNotesStore((s) => s.setContentLoaded);
+  useEffect(() => {
+    if (!windowId) return;
+    useNotesStore.getState().reset(windowId);
+  }, [windowId]);
+  useEffect(() => {
+    if (!windowId) return;
+    useNotesStore.getState().setIsDirty(windowId, isDirty);
+  }, [windowId, isDirty]);
+  const createFile = useDesktopStore((state) => state.createFile);
+  const updateFile = useDesktopStore((state) => state.updateFile);
+  const fsNodes = useDesktopStore((state) => state.fsNodes);
+  const editor = useEditor({
+    extensions: [StarterKit, Markdown, ClearMarksOnEnter],
+    content: contentData?.initialContent ?? "",
+    contentType: "markdown",
+    shouldRerenderOnTransaction: false,
+    onCreate: () => {
+      const initial = editor?.getMarkdown() ?? "";
+      contentSnapshotRef.current = initial;
+      if (appId) {
+        useAppTempMemoryStore.getState().setSnapshot(appId, initial);
+      }
+    },
+    onUpdate: () => {
+      const current = editor?.getMarkdown() ?? "";
+      const dirty = current !== (contentSnapshotRef.current ?? "");
+      setIsDirty(dirty);
+      if (!dirty && appId) {
+        useAppTempMemoryStore.getState().setSnapshot(appId, current);
+      }
+    }
+  });
+  useEffect(() => {
+    if (!fileId || !editor || contentLoaded) return;
+    const node = fsNodes.find((n) => n.id === fileId);
+    if (!node || node.type !== "file") return;
+    const fileNode = node;
+    if (fileNode.content && fileNode.content !== (contentSnapshotRef.current ?? "")) {
+      contentSnapshotRef.current = fileNode.content;
+      if (appId) {
+        useAppTempMemoryStore.getState().setSnapshot(appId, fileNode.content);
+      }
+      editor.commands.setContent(fileNode.content, { emitUpdate: false, contentType: "markdown" });
+      setContentLoaded(windowId, true);
+    }
+  }, [fileId, editor, appId, fsNodes, contentLoaded, windowId, setContentLoaded]);
+  useEffect(() => {
+    if (!editor || !windowId || contentLoaded) return;
+    let cancelled = false;
+    const abortController = new AbortController();
+    const loadContent = async () => {
+      try {
+        if (contentData?.initialContent) {
+          if (!cancelled) {
+            editor.commands.setContent(contentData.initialContent, {
+              emitUpdate: false,
+              contentType: "markdown"
+            });
+            setContentLoaded(windowId, true);
+          }
+          return;
+        }
+        if (contentData?.url) {
+          const content = await resolveFileUrl(contentData.url, abortController.signal);
+          if (!cancelled && content) {
+            editor.commands.setContent(content, { emitUpdate: false, contentType: "markdown" });
+            setContentLoaded(windowId, true);
+          }
+          return;
+        }
+        if (contentData?.fileId) {
+          return;
+        }
+        const base = import.meta.env.BASE_URL;
+        const response = await fetch(`${base}${WELCOME_URL}`, { signal: abortController.signal });
+        if (!cancelled && response.ok) {
+          const content = await response.text();
+          editor.commands.setContent(content, { emitUpdate: false, contentType: "markdown" });
+          setContentLoaded(windowId, true);
+        }
+      } catch (error) {
+        if (!cancelled && error instanceof Error && error.name !== "AbortError") {
+          console.warn("Failed to load content:", error);
+        }
+      }
+    };
+    loadContent();
+    return () => {
+      cancelled = true;
+      abortController.abort();
+    };
+  }, [editor, contentData, windowId, contentLoaded, setContentLoaded]);
+  const getMarkdown = useCallback(() => {
+    if (!editor) return "";
+    return editor.getMarkdown();
+  }, [editor]);
+  const handleNew = useCallback(() => {
+    editor?.commands.setContent("", { emitUpdate: false, contentType: "markdown" });
+    setFileId(null);
+    setFileName("untitled.md");
+    contentSnapshotRef.current = "";
+    setIsDirty(false);
+    if (windowId) {
+      setContentLoaded(windowId, true);
+    }
+  }, [editor, windowId, setContentLoaded]);
+  const handleSave = useCallback(() => {
+    if (!editor) return;
+    if (fileId) {
+      updateFile(fileId, getMarkdown());
+      contentSnapshotRef.current = getMarkdown();
+      setIsDirty(false);
+    } else {
+      pendingSaveMode.current = "save";
+      setSaveModalOpen(true);
+    }
+  }, [editor, getMarkdown, updateFile, fileId]);
+  const handleSaveAs = useCallback(() => {
+    if (!editor) return;
+    pendingSaveMode.current = "saveAs";
+    setSaveModalOpen(true);
+  }, [editor]);
+  const handleSaveConfirm = useCallback(
+    async ({ parentId, name }) => {
+      if (!editor) return;
+      const content = getMarkdown();
+      if (pendingSaveMode.current === "saveAs" || !fileId) {
+        const file = await createFile(name, content, parentId);
+        setFileId(file.id);
+        setFileName(file.name);
+      } else {
+        await updateFile(fileId, content);
+      }
+      contentSnapshotRef.current = content;
+      setIsDirty(false);
+      setSaveModalOpen(false);
+    },
+    [editor, getMarkdown, createFile, updateFile, fileId]
+  );
+  const [pickerOpen, setPickerOpen] = useState(false);
+  const handleFileSelected = useCallback(
+    (node) => {
+      setFileId(node.id);
+      setFileName(node.name);
+      contentSnapshotRef.current = node.content ?? "";
+      setIsDirty(false);
+      setPickerOpen(false);
+      const url = node.url;
+      if (url) {
+        resolveFileUrl(url).then((md) => {
+          if (md) {
+            editor?.commands.setContent(md, { emitUpdate: false, contentType: "markdown" });
+            if (windowId) setContentLoaded(windowId, true);
+          }
+        });
+      } else if (node.content) {
+        editor?.commands.setContent(node.content, { emitUpdate: false, contentType: "markdown" });
+        if (windowId) setContentLoaded(windowId, true);
+      }
+    },
+    [editor, windowId, setContentLoaded]
+  );
+  const setPickerOpenCallback = useCallback(() => setPickerOpen(true), []);
+  useEffect(() => {
+    const actions = { new: handleNew, save: handleSave, saveAs: handleSaveAs };
+    notifyReady?.({
+      ...win?.contentData ?? {},
+      actions,
+      setPickerOpen: setPickerOpenCallback,
+      isDirty
+    });
+  }, [handleNew, handleSave, handleSaveAs, win, notifyReady, setPickerOpenCallback, isDirty]);
+  const isDirtyGetter = useCallback(() => {
+    const current = editor?.getMarkdown() ?? "";
+    return current !== (contentSnapshotRef.current ?? "");
+  }, [editor]);
+  useCloseInterceptor({
+    isDirtyGetter,
+    windowId,
+    onDiscard: () => {
+      if (!editor) return;
+      const snapshot = contentSnapshotRef.current ?? "";
+      editor.commands.setContent(snapshot, { emitUpdate: false, contentType: "markdown" });
+      setIsDirty(false);
+    },
+    onSave: handleSave
+  });
+  const editorState = useEditorState({
+    editor,
+    selector: (ctx) => ({
+      canUndo: ctx.editor?.can().undo() ?? false,
+      canRedo: ctx.editor?.can().redo() ?? false,
+      isBold: ctx.editor?.isActive("bold") ?? false,
+      isItalic: ctx.editor?.isActive("italic") ?? false,
+      isStrike: ctx.editor?.isActive("strike") ?? false,
+      isCode: ctx.editor?.isActive("code") ?? false,
+      isH1: ctx.editor?.isActive("heading", { level: 1 }) ?? false,
+      isH2: ctx.editor?.isActive("heading", { level: 2 }) ?? false,
+      isBulletList: ctx.editor?.isActive("bulletList") ?? false,
+      isOrderedList: ctx.editor?.isActive("orderedList") ?? false,
+      isBlockquote: ctx.editor?.isActive("blockquote") ?? false,
+      isCodeBlock: ctx.editor?.isActive("codeBlock") ?? false
+    })
+  });
+  return /* @__PURE__ */ jsxs("div", { className: NotesApp_default.container, "data-windowid": win?.id, children: [
+    /* @__PURE__ */ jsxs("div", { className: NotesApp_default.toolbar, role: "toolbar", "aria-label": t("toolbar.formatting"), children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: `${NotesApp_default.toolbarBtn} ${editorState?.isBold ? NotesApp_default.active : ""}`,
+          onClick: () => editor?.chain().focus().toggleBold().run(),
+          disabled: !editor?.can().chain().focus().toggleBold().run(),
+          title: t("toolbar.bold"),
+          "aria-label": t("toolbar.bold"),
+          children: /* @__PURE__ */ jsx(VscIcon_default, { name: "VscBold" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: `${NotesApp_default.toolbarBtn} ${editorState?.isItalic ? NotesApp_default.active : ""}`,
+          onClick: () => editor?.chain().focus().toggleItalic().run(),
+          disabled: !editor?.can().chain().focus().toggleItalic().run(),
+          title: t("toolbar.italic"),
+          "aria-label": t("toolbar.italic"),
+          children: /* @__PURE__ */ jsx(VscIcon_default, { name: "VscItalic" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: `${NotesApp_default.toolbarBtn} ${editorState?.isStrike ? NotesApp_default.active : ""}`,
+          onClick: () => editor?.chain().focus().toggleStrike().run(),
+          disabled: !editor?.can().chain().focus().toggleStrike().run(),
+          title: t("toolbar.strikethrough"),
+          "aria-label": t("toolbar.strikethrough"),
+          children: /* @__PURE__ */ jsx("s", { children: "S" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: `${NotesApp_default.toolbarBtn} ${editorState?.isCode ? NotesApp_default.active : ""}`,
+          onClick: () => editor?.chain().focus().toggleCode().run(),
+          disabled: !editor?.can().chain().focus().toggleCode().run(),
+          title: t("toolbar.inlineCode"),
+          "aria-label": t("toolbar.inlineCode"),
+          children: /* @__PURE__ */ jsx(VscIcon_default, { name: "VscCode" })
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: NotesApp_default.separator }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: `${NotesApp_default.toolbarBtn} ${editorState?.isH1 ? NotesApp_default.active : ""}`,
+          onClick: () => editor?.chain().focus().toggleHeading({ level: 1 }).run(),
+          title: t("toolbar.heading1"),
+          "aria-label": t("toolbar.heading1"),
+          children: /* @__PURE__ */ jsx("strong", { children: "H1" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: `${NotesApp_default.toolbarBtn} ${editorState?.isH2 ? NotesApp_default.active : ""}`,
+          onClick: () => editor?.chain().focus().toggleHeading({ level: 2 }).run(),
+          title: t("toolbar.heading2"),
+          "aria-label": t("toolbar.heading2"),
+          children: /* @__PURE__ */ jsx("strong", { children: "H2" })
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: NotesApp_default.separator }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: `${NotesApp_default.toolbarBtn} ${editorState?.isBulletList ? NotesApp_default.active : ""}`,
+          onClick: () => editor?.chain().focus().toggleBulletList().run(),
+          title: t("toolbar.bulletList"),
+          "aria-label": t("toolbar.bulletList"),
+          children: /* @__PURE__ */ jsx(VscIcon_default, { name: "VscListUnordered" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: `${NotesApp_default.toolbarBtn} ${editorState?.isOrderedList ? NotesApp_default.active : ""}`,
+          onClick: () => editor?.chain().focus().toggleOrderedList().run(),
+          title: t("toolbar.orderedList"),
+          "aria-label": t("toolbar.orderedList"),
+          children: /* @__PURE__ */ jsx(VscIcon_default, { name: "VscListOrdered" })
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: NotesApp_default.separator }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: `${NotesApp_default.toolbarBtn} ${editorState?.isBlockquote ? NotesApp_default.active : ""}`,
+          onClick: () => editor?.chain().focus().toggleBlockquote().run(),
+          title: t("toolbar.blockquote"),
+          "aria-label": t("toolbar.blockquote"),
+          children: /* @__PURE__ */ jsx(VscIcon_default, { name: "VscQuote" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: `${NotesApp_default.toolbarBtn} ${editorState?.isCodeBlock ? NotesApp_default.active : ""}`,
+          onClick: () => editor?.chain().focus().toggleCodeBlock().run(),
+          title: t("toolbar.codeBlock"),
+          "aria-label": t("toolbar.codeBlock"),
+          children: /* @__PURE__ */ jsx(VscIcon_default, { name: "VscTerminal" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: NotesApp_default.toolbarBtn,
+          onClick: () => editor?.chain().focus().setHorizontalRule().run(),
+          title: t("toolbar.horizontalRule"),
+          "aria-label": t("toolbar.horizontalRule"),
+          children: /* @__PURE__ */ jsx(VscIcon_default, { name: "VscHorizontalRule" })
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: NotesApp_default.separator }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: NotesApp_default.toolbarBtn,
+          onClick: () => editor?.chain().focus().undo().run(),
+          disabled: !editorState?.canUndo,
+          title: t("common:actions.undo"),
+          "aria-label": t("common:actions.undo"),
+          children: /* @__PURE__ */ jsx(VscIcon_default, { name: "VscDiscard" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: NotesApp_default.toolbarBtn,
+          onClick: () => editor?.chain().focus().redo().run(),
+          disabled: !editorState?.canRedo,
+          title: t("common:actions.redo"),
+          "aria-label": t("common:actions.redo"),
+          children: /* @__PURE__ */ jsx(VscIcon_default, { name: "VscRedo" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(EditorContent, { editor, className: NotesApp_default.editorContent }),
+    /* @__PURE__ */ jsx(
+      FilePickerModal,
+      {
+        opened: pickerOpen,
+        acceptedMimeTypes: ACCEPTED_MD_TYPES,
+        onConfirm: handleFileSelected,
+        onCancel: () => setPickerOpen(false)
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      FileSaveModal,
+      {
+        opened: saveModalOpen,
+        initialName: fileName,
+        onConfirm: handleSaveConfirm,
+        onCancel: () => setSaveModalOpen(false)
+      }
+    )
+  ] });
+};
+var NotesApp_default2 = NotesApp;
+
+export { NotesApp_default2 as NotesApp_default, useAppTempMemoryStore };

package/dist/chunk-43W6UDUZ.cjs

@@ -0,0 +1,19 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/components/Apps/StorybookApp/StorybookApp.module.css
+var StorybookApp_default = {};
+var STORYBOOK_URL = "https://frannunpal.github.io/storybook/";
+var StorybookApp = () => /* @__PURE__ */ jsxRuntime.jsx(
+  "iframe",
+  {
+    src: STORYBOOK_URL,
+    className: StorybookApp_default.frame,
+    title: "Storybook",
+    "aria-label": "Storybook component explorer"
+  }
+);
+var StorybookApp_default2 = StorybookApp;
+
+exports.StorybookApp_default = StorybookApp_default2;

package/dist/chunk-4E45FBAH.js

@@ -0,0 +1,223 @@
+import { useFcIconElement } from './chunk-YY6OUR2U.js';
+import { Select, NumberInput, TextInput, Tooltip, Slider, Switch, Menu } from './chunk-BQL3YXMV.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState } from 'react';
+
+var DirtyIndicator = ({ size = 16 }) => {
+  const icon = useFcIconElement("FcSynchronize", { size });
+  return /* @__PURE__ */ 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 }) => useFcIconElement(name, ICON_PROPS);
+var MenuDropdownElement = ({
+  label,
+  icon,
+  items,
+  rightSection
+}) => {
+  const [opened, setOpened] = useState(false);
+  const TriggerIcon = () => useFcIconElement(icon ?? "", ICON_PROPS);
+  return /* @__PURE__ */ jsxs(
+    Menu,
+    {
+      opened,
+      onClose: () => setOpened(false),
+      withinPortal: true,
+      keepMounted: true,
+      closeOnItemClick: true,
+      closeOnEscape: true,
+      closeOnClickOutside: true,
+      position: "bottom-start",
+      children: [
+        /* @__PURE__ */ jsx(Menu.Target, { children: /* @__PURE__ */ jsxs("button", { className: AppMenuBar_default.menuTrigger, onClick: () => setOpened((o) => !o), children: [
+          icon && /* @__PURE__ */ jsx(TriggerIcon, {}),
+          /* @__PURE__ */ jsx("span", { children: label }),
+          rightSection && /* @__PURE__ */ jsx("span", { style: { marginLeft: "auto" }, children: rightSection })
+        ] }) }),
+        /* @__PURE__ */ jsx(Menu.Dropdown, { children: items.map((item, idx) => {
+          if (item.type === "divider") {
+            return /* @__PURE__ */ jsx(Menu.Divider, {}, idx);
+          }
+          if (item.type === "slider") {
+            return /* @__PURE__ */ jsx(Menu.Item, { closeMenuOnClick: false, children: /* @__PURE__ */ jsxs("div", { style: { minWidth: 120 }, children: [
+              item.label && /* @__PURE__ */ jsx("div", { style: { marginBottom: 4 }, children: item.label }),
+              /* @__PURE__ */ jsx(
+                Slider,
+                {
+                  min: item.min,
+                  max: item.max,
+                  value: item.value,
+                  onChange: item.onChange,
+                  size: "sm"
+                }
+              )
+            ] }) }, idx);
+          }
+          return /* @__PURE__ */ jsx(
+            Menu.Item,
+            {
+              disabled: item.disabled,
+              onClick: item.onClick,
+              leftSection: item.icon ? /* @__PURE__ */ jsx(FcIcon, { name: item.icon }) : void 0,
+              children: item.label
+            },
+            idx
+          );
+        }) })
+      ]
+    }
+  );
+};
+var AppMenuBar = ({ elements }) => {
+  const [sliderStates, setSliderStates] = useState({});
+  const setSliderState = (idx, state) => {
+    setSliderStates((prev) => ({
+      ...prev,
+      [idx]: { ...prev[idx] ?? { isHovered: false, isDragging: false }, ...state }
+    }));
+  };
+  return /* @__PURE__ */ jsx("div", { className: AppMenuBar_default.root, role: "menubar", "aria-label": "Application menu", children: elements.map((el, idx) => {
+    switch (el.type) {
+      case "menu":
+        return /* @__PURE__ */ jsx(
+          MenuDropdownElement,
+          {
+            label: el.label,
+            icon: el.icon,
+            items: el.items,
+            rightSection: el.rightSection
+          },
+          idx
+        );
+      case "combobox":
+        return /* @__PURE__ */ jsx("div", { className: AppMenuBar_default.element, children: /* @__PURE__ */ jsx(
+          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__ */ jsx("div", { className: AppMenuBar_default.element, children: /* @__PURE__ */ jsx(
+          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__ */ jsx(
+          Tooltip,
+          {
+            label: labelFormat(el.value),
+            position: "bottom",
+            withArrow: true,
+            opened: isTooltipOpen,
+            children: /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: AppMenuBar_default.element,
+                onMouseEnter: () => setSliderState(idx, { isHovered: true }),
+                onMouseLeave: () => setSliderState(idx, { isHovered: false }),
+                children: [
+                  el.label && /* @__PURE__ */ jsx("span", { className: AppMenuBar_default.sliderLabel, children: el.label }),
+                  /* @__PURE__ */ jsx(
+                    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__ */ jsx("div", { className: AppMenuBar_default.element, children: /* @__PURE__ */ jsx(
+          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__ */ jsx("div", { className: AppMenuBar_default.element, children: /* @__PURE__ */ jsx(
+          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__ */ jsx("div", { className: AppMenuBar_default.element, children: /* @__PURE__ */ jsx(
+          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__ */ jsx("span", { style: { marginLeft: "auto" }, children: /* @__PURE__ */ jsx(DirtyIndicator_default, {}) }, idx);
+    }
+  }) });
+};
+var AppMenuBar_default2 = AppMenuBar;
+
+export { AppMenuBar_default2 as AppMenuBar_default, DirtyIndicator_default };