themed-markdown 0.1.52 → 0.1.54
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.mjs +102 -1
- package/dist/industryMarkdown/components/IndustryMermaidDiagram.d.ts.map +1 -1
- package/dist/industryMarkdown/components/IndustryMermaidModal.d.ts +1 -1
- package/dist/industryMarkdown/components/IndustryMermaidModal.d.ts.map +1 -1
- package/dist/industryMarkdown/utils/platformDetection.d.ts +20 -0
- package/dist/industryMarkdown/utils/platformDetection.d.ts.map +1 -0
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,3 +1,11 @@
|
|
|
1
|
+
var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
|
|
2
|
+
get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
|
|
3
|
+
}) : x)(function(x) {
|
|
4
|
+
if (typeof require !== "undefined")
|
|
5
|
+
return require.apply(this, arguments);
|
|
6
|
+
throw Error('Dynamic require of "' + x + '" is not supported');
|
|
7
|
+
});
|
|
8
|
+
|
|
1
9
|
// node_modules/@a24z/industry-theme/dist/esm/index.js
|
|
2
10
|
import React, { createContext, useContext, useState, useEffect } from "react";
|
|
3
11
|
import React2 from "react";
|
|
@@ -1440,6 +1448,28 @@ import React6, { useEffect as useEffect3, useRef as useRef2, useState as useStat
|
|
|
1440
1448
|
// industryMarkdown/components/IndustryMermaidDiagram.tsx
|
|
1441
1449
|
import { Expand, Copy, Check } from "lucide-react";
|
|
1442
1450
|
import React5, { useEffect as useEffect2, useRef, useState as useState3 } from "react";
|
|
1451
|
+
|
|
1452
|
+
// industryMarkdown/utils/platformDetection.ts
|
|
1453
|
+
function isReactNative() {
|
|
1454
|
+
return typeof navigator !== "undefined" && navigator.product === "ReactNative";
|
|
1455
|
+
}
|
|
1456
|
+
function isWeb() {
|
|
1457
|
+
return typeof window !== "undefined" && typeof document !== "undefined" && !isReactNative();
|
|
1458
|
+
}
|
|
1459
|
+
function hasDOMSupport() {
|
|
1460
|
+
return isWeb();
|
|
1461
|
+
}
|
|
1462
|
+
function hasReactDOMSupport() {
|
|
1463
|
+
if (!isWeb())
|
|
1464
|
+
return false;
|
|
1465
|
+
try {
|
|
1466
|
+
return typeof document !== "undefined" && typeof document.body !== "undefined";
|
|
1467
|
+
} catch {
|
|
1468
|
+
return false;
|
|
1469
|
+
}
|
|
1470
|
+
}
|
|
1471
|
+
|
|
1472
|
+
// industryMarkdown/components/IndustryMermaidDiagram.tsx
|
|
1443
1473
|
var getMermaidSync = () => {
|
|
1444
1474
|
if (typeof window !== "undefined") {
|
|
1445
1475
|
const mermaid = window.mermaid;
|
|
@@ -1461,6 +1491,42 @@ function IndustryMermaidDiagram({
|
|
|
1461
1491
|
onExpandClick
|
|
1462
1492
|
}) {
|
|
1463
1493
|
const theme2 = themeOverride ?? theme;
|
|
1494
|
+
if (!hasDOMSupport()) {
|
|
1495
|
+
return /* @__PURE__ */ React5.createElement("div", {
|
|
1496
|
+
style: {
|
|
1497
|
+
padding: theme2.space[4],
|
|
1498
|
+
backgroundColor: theme2.colors.backgroundSecondary,
|
|
1499
|
+
border: `2px solid ${theme2.colors.warning || theme2.colors.primary}`,
|
|
1500
|
+
borderRadius: theme2.radii[2],
|
|
1501
|
+
margin: `${theme2.space[4]}px 0`
|
|
1502
|
+
}
|
|
1503
|
+
}, /* @__PURE__ */ React5.createElement("div", {
|
|
1504
|
+
style: {
|
|
1505
|
+
color: theme2.colors.warning || theme2.colors.text,
|
|
1506
|
+
fontFamily: theme2.fonts.body,
|
|
1507
|
+
fontSize: theme2.fontSizes[2],
|
|
1508
|
+
marginBottom: theme2.space[2],
|
|
1509
|
+
fontWeight: theme2.fontWeights.bold
|
|
1510
|
+
}
|
|
1511
|
+
}, "⚠️ Mermaid diagrams not supported"), /* @__PURE__ */ React5.createElement("div", {
|
|
1512
|
+
style: {
|
|
1513
|
+
color: theme2.colors.textSecondary || theme2.colors.text,
|
|
1514
|
+
fontFamily: theme2.fonts.body,
|
|
1515
|
+
fontSize: theme2.fontSizes[1],
|
|
1516
|
+
opacity: 0.8,
|
|
1517
|
+
marginBottom: theme2.space[2]
|
|
1518
|
+
}
|
|
1519
|
+
}, "Mermaid diagrams require browser DOM APIs and are only available in web environments."), /* @__PURE__ */ React5.createElement("div", {
|
|
1520
|
+
style: {
|
|
1521
|
+
color: theme2.colors.textTertiary || theme2.colors.textSecondary,
|
|
1522
|
+
fontFamily: theme2.fonts.monospace,
|
|
1523
|
+
fontSize: theme2.fontSizes[0],
|
|
1524
|
+
opacity: 0.6,
|
|
1525
|
+
whiteSpace: "pre-wrap",
|
|
1526
|
+
wordBreak: "break-word"
|
|
1527
|
+
}
|
|
1528
|
+
}, "Diagram code: ", code.substring(0, 100), code.length > 100 ? "..." : ""));
|
|
1529
|
+
}
|
|
1464
1530
|
const [errorDetails, setErrorDetails] = useState3(null);
|
|
1465
1531
|
const [isIntersecting, setIsIntersecting] = useState3(false);
|
|
1466
1532
|
const [hasRendered, setHasRendered] = useState3(false);
|
|
@@ -2747,7 +2813,6 @@ var createIndustryMarkdownComponents = ({
|
|
|
2747
2813
|
|
|
2748
2814
|
// industryMarkdown/components/IndustryMermaidModal.tsx
|
|
2749
2815
|
import React11, { useEffect as useEffect6, useRef as useRef6 } from "react";
|
|
2750
|
-
import ReactDOM from "react-dom";
|
|
2751
2816
|
|
|
2752
2817
|
// industryMarkdown/components/IndustryZoomableMermaidDiagram.tsx
|
|
2753
2818
|
import React10, { useEffect as useEffect5, useRef as useRef5, useState as useState7 } from "react";
|
|
@@ -2929,6 +2994,14 @@ function IndustryZoomableMermaidDiagram({
|
|
|
2929
2994
|
}
|
|
2930
2995
|
|
|
2931
2996
|
// industryMarkdown/components/IndustryMermaidModal.tsx
|
|
2997
|
+
var ReactDOM = null;
|
|
2998
|
+
if (hasReactDOMSupport()) {
|
|
2999
|
+
try {
|
|
3000
|
+
ReactDOM = __require("react-dom");
|
|
3001
|
+
} catch (error) {
|
|
3002
|
+
console.warn("ReactDOM is not available. Modal features will be disabled.");
|
|
3003
|
+
}
|
|
3004
|
+
}
|
|
2932
3005
|
function IndustryMermaidModal({
|
|
2933
3006
|
isOpen,
|
|
2934
3007
|
onClose,
|
|
@@ -2957,6 +3030,32 @@ function IndustryMermaidModal({
|
|
|
2957
3030
|
if (!isOpen) {
|
|
2958
3031
|
return null;
|
|
2959
3032
|
}
|
|
3033
|
+
if (!ReactDOM || !hasReactDOMSupport()) {
|
|
3034
|
+
return /* @__PURE__ */ React11.createElement("div", {
|
|
3035
|
+
style: {
|
|
3036
|
+
padding: theme2.space[4],
|
|
3037
|
+
backgroundColor: theme2.colors.background,
|
|
3038
|
+
border: `2px solid ${theme2.colors.warning || theme2.colors.primary}`,
|
|
3039
|
+
borderRadius: theme2.radii[2],
|
|
3040
|
+
margin: theme2.space[4]
|
|
3041
|
+
}
|
|
3042
|
+
}, /* @__PURE__ */ React11.createElement("div", {
|
|
3043
|
+
style: {
|
|
3044
|
+
color: theme2.colors.warning || theme2.colors.text,
|
|
3045
|
+
fontFamily: theme2.fonts.body,
|
|
3046
|
+
fontSize: theme2.fontSizes[2],
|
|
3047
|
+
marginBottom: theme2.space[2],
|
|
3048
|
+
fontWeight: theme2.fontWeights.bold
|
|
3049
|
+
}
|
|
3050
|
+
}, "⚠️ Mermaid diagrams are not supported in React Native"), /* @__PURE__ */ React11.createElement("div", {
|
|
3051
|
+
style: {
|
|
3052
|
+
color: theme2.colors.textSecondary || theme2.colors.text,
|
|
3053
|
+
fontFamily: theme2.fonts.body,
|
|
3054
|
+
fontSize: theme2.fontSizes[1],
|
|
3055
|
+
opacity: 0.8
|
|
3056
|
+
}
|
|
3057
|
+
}, "Mermaid diagrams require browser DOM APIs and are only available in web environments. Consider using a WebView component or alternative visualization library for React Native."));
|
|
3058
|
+
}
|
|
2960
3059
|
const modalContent = /* @__PURE__ */ React11.createElement("div", {
|
|
2961
3060
|
onClick: handleBackdropClick,
|
|
2962
3061
|
style: {
|
|
@@ -3034,6 +3133,8 @@ function IndustryMermaidModal({
|
|
|
3034
3133
|
code: mermaidCode,
|
|
3035
3134
|
theme: theme2
|
|
3036
3135
|
}))));
|
|
3136
|
+
if (!ReactDOM)
|
|
3137
|
+
return null;
|
|
3037
3138
|
return ReactDOM.createPortal(modalContent, document.body);
|
|
3038
3139
|
}
|
|
3039
3140
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IndustryMermaidDiagram.d.ts","sourceRoot":"","sources":["../../../industryMarkdown/components/IndustryMermaidDiagram.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,KAAK,EAAyB,MAAM,sBAAsB,CAAC;AAEpE,OAAO,KAAsC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"IndustryMermaidDiagram.d.ts","sourceRoot":"","sources":["../../../industryMarkdown/components/IndustryMermaidDiagram.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,KAAK,EAAyB,MAAM,sBAAsB,CAAC;AAEpE,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,UAAU,2BAA2B;IACnC,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,WAAW,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IAClE,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAwBD,wBAAgB,sBAAsB,CAAC,EACrC,IAAI,EACJ,EAAE,EACF,KAAK,EAAE,aAAa,EACpB,WAAW,EACX,OAAO,EACP,UAAoB,EACpB,WAAmB,EACnB,WAAmB,EACnB,aAAa,GACd,EAAE,2BAA2B,qBA6f7B"}
|
|
@@ -6,6 +6,6 @@ interface IndustryMermaidModalProps {
|
|
|
6
6
|
mermaidCode: string;
|
|
7
7
|
theme: Theme;
|
|
8
8
|
}
|
|
9
|
-
export declare function IndustryMermaidModal({ isOpen, onClose, mermaidCode, theme, }: IndustryMermaidModalProps): React.
|
|
9
|
+
export declare function IndustryMermaidModal({ isOpen, onClose, mermaidCode, theme, }: IndustryMermaidModalProps): React.JSX.Element | null;
|
|
10
10
|
export {};
|
|
11
11
|
//# sourceMappingURL=IndustryMermaidModal.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IndustryMermaidModal.d.ts","sourceRoot":"","sources":["../../../industryMarkdown/components/IndustryMermaidModal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAC7C,OAAO,KAA4B,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"IndustryMermaidModal.d.ts","sourceRoot":"","sources":["../../../industryMarkdown/components/IndustryMermaidModal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAC7C,OAAO,KAA4B,MAAM,OAAO,CAAC;AAejD,UAAU,yBAAyB;IACjC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,KAAK,CAAC;CACd;AAED,wBAAgB,oBAAoB,CAAC,EACnC,MAAM,EACN,OAAO,EACP,WAAW,EACX,KAAK,GACN,EAAE,yBAAyB,4BA8J3B"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Platform detection utilities for handling web vs React Native environments
|
|
3
|
+
*/
|
|
4
|
+
/**
|
|
5
|
+
* Detects if the code is running in a React Native environment
|
|
6
|
+
*/
|
|
7
|
+
export declare function isReactNative(): boolean;
|
|
8
|
+
/**
|
|
9
|
+
* Detects if the code is running in a web browser environment
|
|
10
|
+
*/
|
|
11
|
+
export declare function isWeb(): boolean;
|
|
12
|
+
/**
|
|
13
|
+
* Checks if DOM-dependent features are available
|
|
14
|
+
*/
|
|
15
|
+
export declare function hasDOMSupport(): boolean;
|
|
16
|
+
/**
|
|
17
|
+
* Checks if ReactDOM features like portals are available
|
|
18
|
+
*/
|
|
19
|
+
export declare function hasReactDOMSupport(): boolean;
|
|
20
|
+
//# sourceMappingURL=platformDetection.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"platformDetection.d.ts","sourceRoot":"","sources":["../../../industryMarkdown/utils/platformDetection.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;GAEG;AACH,wBAAgB,aAAa,IAAI,OAAO,CAKvC;AAED;;GAEG;AACH,wBAAgB,KAAK,IAAI,OAAO,CAM/B;AAED;;GAEG;AACH,wBAAgB,aAAa,IAAI,OAAO,CAEvC;AAED;;GAEG;AACH,wBAAgB,kBAAkB,IAAI,OAAO,CAW5C"}
|