@fde-desktop/fde-core 0.3.7 → 0.4.1

package/dist/chunk-4MCFQPKY.js

@@ -0,0 +1,444 @@
+import { FileIcon_default } from './chunk-EAELL43F.js';
+import { sortNodes, useDesktopStore } from './chunk-NWMSWRUD.js';
+import { Breadcrumbs, Text, Anchor, UnstyledButton, Group, Button, TextInput } from './chunk-BQL3YXMV.js';
+import { memo, useState, useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+// src/utils/buildBreadcrumbs.ts
+var buildBreadcrumbs = (currentFolderId, fsNodes) => {
+  const crumbs = [{ id: null, name: "Home" }];
+  let id = currentFolderId;
+  const trail = [];
+  while (id !== null) {
+    const node = fsNodes.find((n) => n.id === id);
+    if (!node) break;
+    trail.unshift({ id: node.id, name: node.name });
+    id = node.parentId;
+  }
+  return [...crumbs, ...trail];
+};
+
+// src/components/Shared/FilePickerApp/FilePickerApp.module.css
+var FilePickerApp_default = {};
+var PickerModalComponent = ({
+  opened,
+  children,
+  ariaLabelKey,
+  ariaLabelNs = "window"
+}) => {
+  const { t } = useTranslation(ariaLabelNs);
+  if (!opened) return null;
+  return /* @__PURE__ */ jsx("div", { className: FilePickerApp_default.overlay, role: "dialog", "aria-label": t(ariaLabelKey), children: /* @__PURE__ */ jsx("div", { className: FilePickerApp_default.panel, children }) });
+};
+var PickerModal = memo(PickerModalComponent);
+var FolderBreadcrumbsComponent = ({
+  currentFolderId,
+  fsNodes,
+  onNavigate
+}) => {
+  const crumbs = buildBreadcrumbs(currentFolderId, fsNodes);
+  return /* @__PURE__ */ jsx("div", { className: FilePickerApp_default.breadcrumbBar, children: /* @__PURE__ */ jsx(Breadcrumbs, { separator: "\u203A", classNames: { separator: FilePickerApp_default.breadcrumbSep }, children: crumbs.map((crumb, i) => {
+    const isLast = i === crumbs.length - 1;
+    return isLast ? /* @__PURE__ */ jsx(Text, { size: "xs", fw: 500, children: crumb.name }, crumb.id ?? "root") : /* @__PURE__ */ jsx(Anchor, { size: "xs", onClick: () => onNavigate(crumb.id), children: crumb.name }, crumb.id ?? "root");
+  }) }) });
+};
+var FolderBreadcrumbs = memo(FolderBreadcrumbsComponent);
+var FolderTreeItemComponent = ({
+  node,
+  allNodes,
+  currentFolderId,
+  depth,
+  onNavigate
+}) => {
+  const children = allNodes.filter(
+    (n) => n.parentId === node.id && n.type === "folder"
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      UnstyledButton,
+      {
+        className: FilePickerApp_default.treeItem,
+        "data-active": currentFolderId === node.id || void 0,
+        style: { paddingLeft: 8 + depth * 14 },
+        onClick: () => onNavigate(node.id),
+        "aria-label": node.name,
+        "aria-current": currentFolderId === node.id ? "page" : void 0,
+        children: [
+          /* @__PURE__ */ jsx(FileIcon_default, { type: "folder", folderNode: node, size: 14 }),
+          /* @__PURE__ */ jsx(Text, { size: "xs", ml: 6, truncate: true, children: node.name })
+        ]
+      }
+    ),
+    children.map((child) => /* @__PURE__ */ jsx(
+      FolderTreeItem,
+      {
+        node: child,
+        allNodes,
+        currentFolderId,
+        depth: depth + 1,
+        onNavigate
+      },
+      child.id
+    ))
+  ] });
+};
+var FolderTreeItem = memo(FolderTreeItemComponent);
+var FolderSidebarComponent = ({
+  currentFolderId,
+  fsNodes,
+  onNavigate
+}) => {
+  const { t } = useTranslation("window");
+  const rootFolders = fsNodes.filter(
+    (n) => n.parentId === null && n.type === "folder"
+  );
+  return /* @__PURE__ */ jsx("aside", { className: FilePickerApp_default.sidebar, children: /* @__PURE__ */ jsxs(
+    "nav",
+    {
+      className: FilePickerApp_default.folderTree,
+      "aria-label": t("fileDialog.folderTreeAria", { ns: "common" }),
+      children: [
+        /* @__PURE__ */ jsxs(
+          UnstyledButton,
+          {
+            className: FilePickerApp_default.treeItem,
+            "data-active": currentFolderId === null || void 0,
+            style: { paddingLeft: 8 },
+            onClick: () => onNavigate(null),
+            "aria-label": t("common:labels.home"),
+            "aria-current": currentFolderId === null ? "page" : void 0,
+            children: [
+              /* @__PURE__ */ jsx(FileIcon_default, { type: "folder", size: 14 }),
+              /* @__PURE__ */ jsx(Text, { size: "xs", ml: 6, fw: 500, children: t("common:labels.home") })
+            ]
+          }
+        ),
+        rootFolders.map((folder) => /* @__PURE__ */ jsx(
+          FolderTreeItem,
+          {
+            node: folder,
+            allNodes: fsNodes,
+            currentFolderId,
+            depth: 1,
+            onNavigate
+          },
+          folder.id
+        ))
+      ]
+    }
+  ) });
+};
+var FolderSidebar = memo(FolderSidebarComponent);
+var FolderGridComponent = ({
+  currentFolderId,
+  fsNodes,
+  onNavigate,
+  onItemDoubleClick
+}) => {
+  const { t } = useTranslation("window");
+  const currentFolderNodes = fsNodes.filter(
+    (n) => n.parentId === currentFolderId && n.type === "folder"
+  );
+  if (currentFolderNodes.length === 0) {
+    return /* @__PURE__ */ jsx("div", { className: FilePickerApp_default.empty, children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: t("common:messages.noSubfolders") }) });
+  }
+  const sortedNodes = sortNodes(currentFolderNodes);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: FilePickerApp_default.grid,
+      role: "listbox",
+      "aria-label": t("fileDialog.foldersAria", { ns: "common" }),
+      children: sortedNodes.map((node) => /* @__PURE__ */ jsxs(
+        UnstyledButton,
+        {
+          className: FilePickerApp_default.item,
+          onDoubleClick: () => {
+            onNavigate(node.id);
+            onItemDoubleClick?.(node);
+          },
+          "aria-label": t("fileDialog.openFolder", { name: node.name }),
+          role: "option",
+          children: [
+            /* @__PURE__ */ jsx("div", { className: FilePickerApp_default.icon, children: /* @__PURE__ */ jsx(FileIcon_default, { type: "folder", name: node.name, folderNode: node, size: 32 }) }),
+            /* @__PURE__ */ jsx(Text, { size: "xs", className: FilePickerApp_default.name, truncate: true, children: node.name })
+          ]
+        },
+        node.id
+      ))
+    }
+  );
+};
+var FolderGrid = memo(FolderGridComponent);
+var FilePickerApp = ({ acceptedMimeTypes, onConfirm, onCancel }) => {
+  const { t } = useTranslation("window");
+  const fsNodes = useDesktopStore((state) => state.fsNodes);
+  const [currentFolderId, setCurrentFolderId] = useState(null);
+  const [selectedNode, setSelectedNode] = useState(null);
+  const currentNodes = currentFolderId === null ? fsNodes.filter((n) => n.parentId === null) : fsNodes.filter((n) => n.parentId === currentFolderId);
+  const visibleNodes = currentNodes.filter((n) => {
+    if (n.type === "folder") return true;
+    const file = n;
+    if (!acceptedMimeTypes || acceptedMimeTypes.length === 0) return true;
+    return acceptedMimeTypes.some(
+      (accepted) => file.mimeType === accepted || accepted.endsWith("/*") && file.mimeType?.startsWith(accepted.slice(0, -1))
+    );
+  });
+  const handleNavigate = useCallback((id) => {
+    setCurrentFolderId(id);
+    setSelectedNode(null);
+  }, []);
+  const handleItemClick = useCallback((node) => {
+    if (node.type === "file") {
+      setSelectedNode(node);
+    }
+  }, []);
+  const handleItemDoubleClick = useCallback(
+    (node) => {
+      if (node.type === "folder") {
+        handleNavigate(node.id);
+      } else {
+        onConfirm(node);
+      }
+    },
+    [handleNavigate, onConfirm]
+  );
+  return /* @__PURE__ */ jsxs("div", { className: FilePickerApp_default.root, children: [
+    /* @__PURE__ */ jsx(
+      FolderBreadcrumbs,
+      {
+        currentFolderId,
+        fsNodes,
+        onNavigate: handleNavigate
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: FilePickerApp_default.body, children: [
+      /* @__PURE__ */ jsx(
+        FolderSidebar,
+        {
+          currentFolderId,
+          fsNodes,
+          onNavigate: handleNavigate
+        }
+      ),
+      /* @__PURE__ */ jsx("main", { className: FilePickerApp_default.content, children: visibleNodes.length === 0 ? /* @__PURE__ */ jsx("div", { className: FilePickerApp_default.empty, children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: currentNodes.length === 0 ? t("common:messages.folderEmpty") : t("common:messages.noMatchingFiles") }) }) : /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: FilePickerApp_default.grid,
+          role: "listbox",
+          "aria-label": t("fileDialog.filesAria", { ns: "common" }),
+          children: sortNodes(visibleNodes).map((node) => {
+            const isSelected = selectedNode?.id === node.id;
+            return /* @__PURE__ */ jsxs(
+              UnstyledButton,
+              {
+                className: FilePickerApp_default.item,
+                "data-selected": isSelected || void 0,
+                "data-type": node.type,
+                onClick: () => handleItemClick(node),
+                onDoubleClick: () => handleItemDoubleClick(node),
+                "aria-label": node.type === "folder" ? t("fileDialog.openFolder", { name: node.name, ns: "window" }) : t("fileDialog.selectFile", { name: node.name, ns: "window" }),
+                "aria-selected": node.type === "file" ? isSelected : void 0,
+                role: "option",
+                children: [
+                  /* @__PURE__ */ jsx("div", { className: FilePickerApp_default.icon, children: /* @__PURE__ */ jsx(
+                    FileIcon_default,
+                    {
+                      type: node.type,
+                      name: node.name,
+                      folderNode: node.type === "folder" ? node : void 0,
+                      size: 32
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx(Text, { size: "xs", className: FilePickerApp_default.name, truncate: true, children: node.name })
+                ]
+              },
+              node.id
+            );
+          })
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: FilePickerApp_default.actionBar, children: [
+      /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", truncate: true, className: FilePickerApp_default.selectedLabel, children: selectedNode ? selectedNode.name : t("common:messages.noFileSelected") }),
+      /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "default",
+            size: "xs",
+            onClick: onCancel,
+            "aria-label": t("filePicker.cancelAria", { ns: "common" }),
+            children: t("common:actions.cancel")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            size: "xs",
+            disabled: !selectedNode,
+            onClick: () => selectedNode && onConfirm(selectedNode),
+            "aria-label": t("filePicker.openSelectedAria", { ns: "common" }),
+            children: t("common:actions.open")
+          }
+        )
+      ] })
+    ] })
+  ] });
+};
+var FilePickerModal = ({ opened, ...pickerProps }) => {
+  if (!opened) return null;
+  return /* @__PURE__ */ jsx(PickerModal, { opened, ariaLabelKey: "fileDialog.openFile", children: /* @__PURE__ */ jsx(FilePickerApp, { ...pickerProps }) });
+};
+var FileSaveApp = ({
+  initialName = "untitled.md",
+  onConfirm,
+  onCancel
+}) => {
+  const { t } = useTranslation("window");
+  const fsNodes = useDesktopStore((state) => state.fsNodes);
+  const [currentFolderId, setCurrentFolderId] = useState(null);
+  const [fileName, setFileName] = useState(initialName);
+  const handleNavigate = useCallback((id) => {
+    setCurrentFolderId(id);
+  }, []);
+  const handleSave = useCallback(() => {
+    const trimmed = fileName.trim();
+    if (!trimmed) return;
+    onConfirm({
+      parentId: currentFolderId,
+      name: trimmed.endsWith(".md") ? trimmed : `${trimmed}.md`
+    });
+  }, [fileName, currentFolderId, onConfirm]);
+  return /* @__PURE__ */ jsxs("div", { className: FilePickerApp_default.root, children: [
+    /* @__PURE__ */ jsx(
+      FolderBreadcrumbs,
+      {
+        currentFolderId,
+        fsNodes,
+        onNavigate: handleNavigate
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: FilePickerApp_default.body, children: [
+      /* @__PURE__ */ jsx(
+        FolderSidebar,
+        {
+          currentFolderId,
+          fsNodes,
+          onNavigate: handleNavigate
+        }
+      ),
+      /* @__PURE__ */ jsx("main", { className: FilePickerApp_default.content, children: /* @__PURE__ */ jsx(
+        FolderGrid,
+        {
+          currentFolderId,
+          fsNodes,
+          onNavigate: handleNavigate
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: FilePickerApp_default.saveActionBar, children: [
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          size: "xs",
+          placeholder: t("fileDialog.filename"),
+          value: fileName,
+          onChange: (e) => setFileName(e.currentTarget.value),
+          onKeyDown: (e) => e.key === "Enter" && handleSave(),
+          "aria-label": t("filePicker.fileNameAria", { ns: "common" }),
+          className: FilePickerApp_default.fileNameInput
+        }
+      ),
+      /* @__PURE__ */ jsxs(Group, { gap: "xs", style: { flexShrink: 0 }, children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "default",
+            size: "xs",
+            onClick: onCancel,
+            "aria-label": t("filePicker.cancelAria", { ns: "common" }),
+            children: t("common:actions.cancel")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            size: "xs",
+            disabled: !fileName.trim(),
+            onClick: handleSave,
+            "aria-label": t("fileDialog.saveFile"),
+            children: t("common:actions.save")
+          }
+        )
+      ] })
+    ] })
+  ] });
+};
+var FileSaveModal = ({ opened, ...saveProps }) => {
+  if (!opened) return null;
+  return /* @__PURE__ */ jsx(PickerModal, { opened, ariaLabelKey: "fileDialog.saveFile", children: /* @__PURE__ */ jsx(FileSaveApp, { ...saveProps }) });
+};
+var FolderPickerApp = ({ onConfirm, onCancel }) => {
+  const { t } = useTranslation("window");
+  const fsNodes = useDesktopStore((state) => state.fsNodes);
+  const [currentFolderId, setCurrentFolderId] = useState(null);
+  const handleNavigate = useCallback((id) => {
+    setCurrentFolderId(id);
+  }, []);
+  const handleConfirm = useCallback(() => {
+    onConfirm(currentFolderId);
+  }, [currentFolderId, onConfirm]);
+  return /* @__PURE__ */ jsxs("div", { className: FilePickerApp_default.root, children: [
+    /* @__PURE__ */ jsx(
+      FolderBreadcrumbs,
+      {
+        currentFolderId,
+        fsNodes,
+        onNavigate: handleNavigate
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: FilePickerApp_default.body, children: [
+      /* @__PURE__ */ jsx(
+        FolderSidebar,
+        {
+          currentFolderId,
+          fsNodes,
+          onNavigate: handleNavigate
+        }
+      ),
+      /* @__PURE__ */ jsx("main", { className: FilePickerApp_default.content, children: /* @__PURE__ */ jsx(
+        FolderGrid,
+        {
+          currentFolderId,
+          fsNodes,
+          onNavigate: handleNavigate
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: FilePickerApp_default.actionBar, children: [
+      /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", truncate: true, className: FilePickerApp_default.selectedLabel, children: currentFolderId === null ? t("common:labels.home") : fsNodes.find((n) => n.id === currentFolderId)?.name ?? "" }),
+      /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "default",
+            size: "xs",
+            onClick: onCancel,
+            "aria-label": t("filePicker.cancelAria", { ns: "common" }),
+            children: t("common:actions.cancel")
+          }
+        ),
+        /* @__PURE__ */ jsx(Button, { size: "xs", onClick: handleConfirm, "aria-label": t("fileDialog.selectFolder"), children: t("common:actions.select") })
+      ] })
+    ] })
+  ] });
+};
+var FolderPickerModal = ({ opened, ...pickerProps }) => {
+  if (!opened) return null;
+  return /* @__PURE__ */ jsx(PickerModal, { opened, ariaLabelKey: "fileDialog.selectFolder", children: /* @__PURE__ */ jsx(FolderPickerApp, { ...pickerProps }) });
+};
+var FilePickerApp_default2 = FilePickerApp;
+
+export { FilePickerApp_default2 as FilePickerApp_default, FilePickerModal, FileSaveModal, FolderPickerModal, PickerModal, buildBreadcrumbs };

package/dist/chunk-4OH5RPSQ.cjs

@@ -0,0 +1,38 @@
+'use strict';
+
+var chunk6QOUYSEE_cjs = require('./chunk-6QOUYSEE.cjs');
+var react = require('react');
+
+var DIMENSIONS = {
+  mobile: { defaultWidth: 300, defaultHeight: 500, minWidth: 280, minHeight: 400 },
+  tablet: { defaultWidth: 600, defaultHeight: 450, minWidth: 400, minHeight: 350 },
+  desktop: { defaultWidth: 800, defaultHeight: 600, minWidth: 640, minHeight: 480 },
+  largeDesktop: { defaultWidth: 1e3, defaultHeight: 700, minWidth: 800, minHeight: 600 }
+};
+var LARGE_DESKTOP = 1440;
+var getAdaptiveDimensions = () => {
+  const width = window.innerWidth;
+  if (width < chunk6QOUYSEE_cjs.BREAKPOINTS.MOBILE) {
+    return DIMENSIONS.mobile;
+  }
+  if (width < chunk6QOUYSEE_cjs.BREAKPOINTS.TABLET) {
+    return DIMENSIONS.tablet;
+  }
+  if (width < LARGE_DESKTOP) {
+    return DIMENSIONS.desktop;
+  }
+  return DIMENSIONS.largeDesktop;
+};
+function useAdaptiveDimensions() {
+  const [dimensions, setDimensions] = react.useState(() => getAdaptiveDimensions());
+  const updateDimensions = react.useCallback(() => {
+    setDimensions(getAdaptiveDimensions());
+  }, []);
+  react.useEffect(() => {
+    window.addEventListener("resize", updateDimensions);
+    return () => window.removeEventListener("resize", updateDimensions);
+  }, [updateDimensions]);
+  return dimensions;
+}
+
+exports.useAdaptiveDimensions = useAdaptiveDimensions;

package/dist/chunk-4XURSNM4.js

@@ -0,0 +1,43 @@
+import { AppMenuBar_default } from './chunk-4E45FBAH.js';
+import { memo, useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { jsx } from 'react/jsx-runtime';
+
+var usePdfMenuBarElements = (options) => {
+  const { contentData, onExit } = options;
+  const { t } = useTranslation("common");
+  const setPickerOpen = contentData?.setPickerOpen;
+  return useMemo(() => {
+    return [
+      {
+        type: "menu",
+        label: t("menu.file"),
+        items: [
+          {
+            type: "item",
+            label: t("actions.open"),
+            icon: "FcOpenedFolder",
+            onClick: () => setPickerOpen?.()
+          },
+          { type: "divider" },
+          {
+            type: "item",
+            label: t("actions.exit"),
+            icon: "FcLeft",
+            onClick: onExit
+          }
+        ]
+      }
+    ];
+  }, [t, setPickerOpen, onExit]);
+};
+var PdfMenuBar = memo(({ windowId, contentData, onExit }) => {
+  const elements = usePdfMenuBarElements({
+    contentData,
+    onExit
+  });
+  return /* @__PURE__ */ jsx(AppMenuBar_default, { elements });
+});
+PdfMenuBar.displayName = "PdfMenuBar";
+
+export { PdfMenuBar };