@industry-theme/markdown-panels 0.2.22 → 0.2.24

package/dist/panels/MarkdownPanel.d.ts

@@ -8,6 +8,11 @@ export interface MarkdownPanelProps extends PanelComponentProps {
      * This allows the host to control panel state via props instead of context.
      */
     filePath?: string | null;
+    /**
+     * Optional width to pass to DocumentView for layout calculations.
+     * Useful when embedding in panels that need responsive width handling.
+     */
+    width?: number;
 }
 /**
  * MarkdownPanel - A panel for rendering markdown documents with industry theming

package/dist/panels/MarkdownPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MarkdownPanel.d.ts","sourceRoot":"","sources":["../../src/panels/MarkdownPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAS5D,OAAO,gCAAgC,CAAC;AACxC,OAAO,KAAK,EAAE,mBAAmB,EAAmB,MAAM,UAAU,CAAC;AAmBrE,MAAM,WAAW,kBAAmB,SAAQ,mBAAmB;IAC7D;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC1B;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAmatD,CAAC"}
+{"version":3,"file":"MarkdownPanel.d.ts","sourceRoot":"","sources":["../../src/panels/MarkdownPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAS5D,OAAO,gCAAgC,CAAC;AACxC,OAAO,KAAK,EAAE,mBAAmB,EAAmB,MAAM,UAAU,CAAC;AAmBrE,MAAM,WAAW,kBAAmB,SAAQ,mBAAmB;IAC7D;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAoetD,CAAC"}

package/dist/panels.bundle.js

@@ -46751,7 +46751,8 @@ var SlidePresentationBook = ({
   handlePromptCopy,
   fontSizeScale,
   theme: theme2,
-  repositoryInfo
+  repositoryInfo,
+  width
 }) => {
   const [isMobile, setIsMobile] = useState(false);
   useEffect(() => {
@@ -47150,7 +47151,8 @@ var SlidePresentationBook = ({
       handlePromptCopy,
       fontSizeScale,
       searchQuery: showSearch ? searchQuery : void 0,
-      repositoryInfo
+      repositoryInfo,
+      containerWidth: width
     }) : /* @__PURE__ */ React2__default.createElement("div", {
       style: {
         height: "100%",
@@ -47273,7 +47275,8 @@ var SlidePresentationBook = ({
       handlePromptCopy,
       fontSizeScale,
       searchQuery: showSearch ? searchQuery : void 0,
-      repositoryInfo
+      repositoryInfo,
+      containerWidth: width
     }) : /* @__PURE__ */ React2__default.createElement("div", {
       style: {
         height: "100%",
@@ -47465,6 +47468,7 @@ var SlidePresentationBook = ({
       fontSizeScale,
       searchQuery: showSearch ? searchQuery : void 0,
       repositoryInfo,
+      containerWidth: width,
       transparentBackground: true,
       additionalPadding: {
         left: `${theme2.space[4]}px`,
@@ -47511,6 +47515,7 @@ var SlidePresentationBook = ({
       fontSizeScale,
       searchQuery: showSearch ? searchQuery : void 0,
       repositoryInfo,
+      containerWidth: width,
       transparentBackground: true,
       additionalPadding: {
         left: `${theme2.space[2]}px`,
@@ -47581,6 +47586,7 @@ var SlidePresentationBook = ({
     fontSizeScale,
     searchQuery: showSearch ? searchQuery : void 0,
     repositoryInfo,
+    containerWidth: width,
     transparentBackground: false,
     disableScroll: false
   }))) : /* @__PURE__ */ React2__default.createElement("div", {
@@ -47649,6 +47655,7 @@ var DocumentView = ({
   content: content2,
   onCheckboxChange,
   maxWidth = "900px",
+  width,
   slideIdPrefix = "document",
   enableHtmlPopout = true,
   enableKeyboardScrolling = true,
@@ -47693,7 +47700,8 @@ var DocumentView = ({
     handlePromptCopy,
     repositoryInfo,
     transparentBackground,
-    editable
+    editable,
+    containerWidth: width
   })));
 };
 function parseMarkdownIntoPresentation2(markdownContent, repositoryInfo) {
@@ -47712,24 +47720,55 @@ const MarkdownPanel = ({
   context,
   actions,
   events,
-  filePath: filePathProp
+  filePath: filePathProp,
+  width
 }) => {
-  var _a, _b, _c, _d, _e2, _f, _g;
+  var _a, _b, _c, _d, _e2, _f;
   const { theme: theme2 } = useTheme();
   const [viewMode, setViewMode] = useState("document");
   const [currentSlide, setCurrentSlide] = useState(0);
   const [fontSizeScale, setFontSizeScale] = useState(1);
   const [isMobile, setIsMobile] = useState(false);
   const [preferencesLoaded, setPreferencesLoaded] = useState(false);
+  const [propBasedContent, setPropBasedContent] = useState(null);
   useEffect(() => {
-    if (filePathProp) {
+    if (!filePathProp) {
+      setPropBasedContent(null);
+      return;
+    }
+    if ((propBasedContent == null ? void 0 : propBasedContent.path) === filePathProp && !propBasedContent.loading) {
+      return;
+    }
+    const loadContent = async () => {
+      var _a2;
       console.log("[MarkdownPanel] Loading file from prop:", filePathProp);
-      const setActiveFile = actions == null ? void 0 : actions.setActiveFile;
-      if (typeof setActiveFile === "function") {
-        setActiveFile(filePathProp);
+      setPropBasedContent({ path: filePathProp, content: "", loading: true, error: null });
+      try {
+        const fileSystem = (_a2 = context.adapters) == null ? void 0 : _a2.fileSystem;
+        if (fileSystem == null ? void 0 : fileSystem.readFile) {
+          const content2 = await fileSystem.readFile(filePathProp);
+          setPropBasedContent({ path: filePathProp, content: content2, loading: false, error: null });
+        } else {
+          const setActiveFile = actions == null ? void 0 : actions.setActiveFile;
+          if (typeof setActiveFile === "function") {
+            await setActiveFile(filePathProp);
+            setPropBasedContent(null);
+          } else {
+            throw new Error("No file reading capability available");
+          }
+        }
+      } catch (err) {
+        console.error("[MarkdownPanel] Failed to load file:", err);
+        setPropBasedContent({
+          path: filePathProp,
+          content: "",
+          loading: false,
+          error: err instanceof Error ? err : new Error(String(err))
+        });
       }
-    }
-  }, [filePathProp, actions]);
+    };
+    loadContent();
+  }, [filePathProp, (_a = context.adapters) == null ? void 0 : _a.fileSystem, actions]);
   useEffect(() => {
     const checkMobile = () => {
       setIsMobile(window.innerWidth < 768);
@@ -47766,9 +47805,19 @@ const MarkdownPanel = ({
     });
     return unsubscribe;
   }, [events]);
-  const activeFile = context.getSlice("active-file");
-  const isMarkdown = ((_a = activeFile == null ? void 0 : activeFile.data) == null ? void 0 : _a.type) === "markdown" || ((_c = (_b = activeFile == null ? void 0 : activeFile.data) == null ? void 0 : _b.path) == null ? void 0 : _c.match(/\.(md|mdx|markdown)$/i));
-  const markdownContent = ((_d = activeFile == null ? void 0 : activeFile.data) == null ? void 0 : _d.content) || "";
+  const activeFileSlice = context.getSlice("active-file");
+  const usePropBasedContent = filePathProp && (propBasedContent == null ? void 0 : propBasedContent.path) === filePathProp;
+  const activeFile = usePropBasedContent ? {
+    data: {
+      path: propBasedContent.path,
+      content: propBasedContent.content,
+      type: "markdown"
+    },
+    loading: propBasedContent.loading,
+    error: propBasedContent.error
+  } : activeFileSlice;
+  const isMarkdown = ((_b = activeFile == null ? void 0 : activeFile.data) == null ? void 0 : _b.type) === "markdown" || ((_d = (_c = activeFile == null ? void 0 : activeFile.data) == null ? void 0 : _c.path) == null ? void 0 : _d.match(/\.(md|mdx|markdown)$/i));
+  const markdownContent = ((_e2 = activeFile == null ? void 0 : activeFile.data) == null ? void 0 : _e2.content) || "";
   const presentation = useMemo(
     () => parseMarkdownIntoPresentation2(markdownContent),
     [markdownContent]
@@ -47776,17 +47825,18 @@ const MarkdownPanel = ({
   const slides = presentation.slides.map((slide) => slide.location.content);
   const hasSlides = slides.length > 1;
   const repositoryInfo = useMemo(() => {
-    var _a2, _b2, _c2;
-    const source2 = (_a2 = activeFile == null ? void 0 : activeFile.data) == null ? void 0 : _a2.source;
+    var _a2, _b2;
+    if (usePropBasedContent || !(activeFileSlice == null ? void 0 : activeFileSlice.data)) return void 0;
+    const source2 = "source" in activeFileSlice.data ? activeFileSlice.data.source : void 0;
     if (!source2) return void 0;
-    const branch = source2.locationType === "branch" ? source2.location : ((_b2 = source2.metadata) == null ? void 0 : _b2.currentBranch) || "main";
+    const branch = source2.locationType === "branch" ? source2.location : ((_a2 = source2.metadata) == null ? void 0 : _a2.currentBranch) || "main";
     return {
       owner: source2.owner,
       repo: source2.name,
       branch,
-      basePath: getBasePath(((_c2 = activeFile == null ? void 0 : activeFile.data) == null ? void 0 : _c2.path) || "")
+      basePath: getBasePath(((_b2 = activeFileSlice == null ? void 0 : activeFileSlice.data) == null ? void 0 : _b2.path) || "")
     };
-  }, [(_e2 = activeFile == null ? void 0 : activeFile.data) == null ? void 0 : _e2.source, (_f = activeFile == null ? void 0 : activeFile.data) == null ? void 0 : _f.path]);
+  }, [usePropBasedContent, activeFileSlice == null ? void 0 : activeFileSlice.data]);
   const handleFontSizeIncrease = () => {
     setFontSizeScale((prev) => {
       const newScale = Math.min(prev + 0.1, 3);
@@ -47835,7 +47885,7 @@ const MarkdownPanel = ({
         },
         children: /* @__PURE__ */ jsx("div", { style: { textAlign: "center" }, children: /* @__PURE__ */ jsxs("p", { style: { color: theme2.colors.textSecondary }, children: [
           "Loading ",
-          ((_g = activeFile.data) == null ? void 0 : _g.path) || "file",
+          ((_f = activeFile.data) == null ? void 0 : _f.path) || "file",
           "..."
         ] }) })
       }
@@ -48057,7 +48107,8 @@ const MarkdownPanel = ({
                 },
                 slideIdPrefix: "markdown-panel",
                 maxWidth: "100%",
-                repositoryInfo
+                repositoryInfo,
+                width
               }
             ) : /* @__PURE__ */ jsx(
               SlidePresentationBook,
@@ -48079,7 +48130,8 @@ const MarkdownPanel = ({
                 tocDisplayMode: "sidebar",
                 tocSidebarPosition: "left",
                 initialTocOpen: false,
-                repositoryInfo
+                repositoryInfo,
+                width
               }
             )
           }