@intlayer/design-system 6.1.3 → 6.1.5

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.
Files changed (99) hide show
  1. package/dist/.vite/manifest.json +63 -7
  2. package/dist/components/DictionaryFieldEditor/ContentEditorView/TextEditor.cjs +2 -2
  3. package/dist/components/DictionaryFieldEditor/ContentEditorView/TextEditor.cjs.map +1 -1
  4. package/dist/components/DictionaryFieldEditor/ContentEditorView/TextEditor.mjs +1 -1
  5. package/dist/components/DictionaryFieldEditor/VersionSwitcherDropDown/versionSwitcherDropDown.content.cjs +2 -1
  6. package/dist/components/DictionaryFieldEditor/VersionSwitcherDropDown/versionSwitcherDropDown.content.cjs.map +1 -1
  7. package/dist/components/ExpandCollapse/expandCollapse.content.cjs +2 -1
  8. package/dist/components/ExpandCollapse/expandCollapse.content.cjs.map +1 -1
  9. package/dist/components/Headers/index.cjs +12 -0
  10. package/dist/components/Headers/index.cjs.map +1 -1
  11. package/dist/components/Headers/index.d.ts +1 -0
  12. package/dist/components/Headers/index.d.ts.map +1 -1
  13. package/dist/components/Headers/index.mjs +13 -1
  14. package/dist/components/Headers/index.mjs.map +1 -1
  15. package/dist/components/IDE/Code.cjs +1 -1
  16. package/dist/components/IDE/Code.cjs.map +1 -1
  17. package/dist/components/IDE/Code.mjs +1 -1
  18. package/dist/components/IDE/Code.mjs.map +1 -1
  19. package/dist/components/IDE/MarkDownRender.cjs +2 -2
  20. package/dist/components/IDE/MarkDownRender.cjs.map +1 -1
  21. package/dist/components/IDE/MarkDownRender.d.ts.map +1 -1
  22. package/dist/components/IDE/MarkDownRender.mjs +2 -2
  23. package/dist/components/IDE/MarkDownRender.mjs.map +1 -1
  24. package/dist/components/IDE/code.content.cjs +2 -1
  25. package/dist/components/IDE/code.content.cjs.map +1 -1
  26. package/dist/components/IDE/copyCode.content.cjs +2 -1
  27. package/dist/components/IDE/copyCode.content.cjs.map +1 -1
  28. package/dist/components/LocaleSwitcherContentDropDown/localeSwitcher.content.cjs +2 -1
  29. package/dist/components/LocaleSwitcherContentDropDown/localeSwitcher.content.cjs.map +1 -1
  30. package/dist/components/LocaleSwitcherDropDown/localeSwitcher.content.cjs +2 -1
  31. package/dist/components/LocaleSwitcherDropDown/localeSwitcher.content.cjs.map +1 -1
  32. package/dist/components/MarkDownRender/MarkDownRender.cjs +189 -0
  33. package/dist/components/MarkDownRender/MarkDownRender.cjs.map +1 -0
  34. package/dist/components/MarkDownRender/MarkDownRender.d.ts +12 -0
  35. package/dist/components/MarkDownRender/MarkDownRender.d.ts.map +1 -0
  36. package/dist/components/MarkDownRender/MarkDownRender.mjs +189 -0
  37. package/dist/components/MarkDownRender/MarkDownRender.mjs.map +1 -0
  38. package/dist/components/MarkDownRender/index.cjs +2 -150
  39. package/dist/components/MarkDownRender/index.cjs.map +1 -1
  40. package/dist/components/MarkDownRender/index.d.ts +1 -11
  41. package/dist/components/MarkDownRender/index.d.ts.map +1 -1
  42. package/dist/components/MarkDownRender/index.mjs +1 -149
  43. package/dist/components/MarkDownRender/index.mjs.map +1 -1
  44. package/dist/components/MarkDownRender/processor.cjs +1819 -0
  45. package/dist/components/MarkDownRender/processor.cjs.map +1 -0
  46. package/dist/components/MarkDownRender/processor.d.ts +368 -0
  47. package/dist/components/MarkDownRender/processor.d.ts.map +1 -0
  48. package/dist/components/MarkDownRender/processor.mjs +1819 -0
  49. package/dist/components/MarkDownRender/processor.mjs.map +1 -0
  50. package/dist/components/Tab/Tab.cjs +171 -0
  51. package/dist/components/Tab/Tab.cjs.map +1 -0
  52. package/dist/components/Tab/Tab.d.ts +24 -0
  53. package/dist/components/Tab/Tab.d.ts.map +1 -0
  54. package/dist/components/Tab/Tab.mjs +171 -0
  55. package/dist/components/Tab/Tab.mjs.map +1 -0
  56. package/dist/components/Tab/TabContext.cjs +28 -0
  57. package/dist/components/Tab/TabContext.cjs.map +1 -0
  58. package/dist/components/Tab/TabContext.d.ts +19 -0
  59. package/dist/components/Tab/TabContext.d.ts.map +1 -0
  60. package/dist/components/Tab/TabContext.mjs +28 -0
  61. package/dist/components/Tab/TabContext.mjs.map +1 -0
  62. package/dist/components/Tab/index.cjs +5 -0
  63. package/dist/components/Tab/index.cjs.map +1 -0
  64. package/dist/components/Tab/index.d.ts +2 -0
  65. package/dist/components/Tab/index.d.ts.map +1 -0
  66. package/dist/components/Tab/index.mjs +5 -0
  67. package/dist/components/Tab/index.mjs.map +1 -0
  68. package/dist/components/TabSelector/TabSelector.cjs +6 -1
  69. package/dist/components/TabSelector/TabSelector.cjs.map +1 -1
  70. package/dist/components/TabSelector/TabSelector.d.ts +1 -1
  71. package/dist/components/TabSelector/TabSelector.d.ts.map +1 -1
  72. package/dist/components/TabSelector/TabSelector.mjs +6 -1
  73. package/dist/components/TabSelector/TabSelector.mjs.map +1 -1
  74. package/dist/components/Table/Table.cjs +15 -8
  75. package/dist/components/Table/Table.cjs.map +1 -1
  76. package/dist/components/Table/Table.d.ts.map +1 -1
  77. package/dist/components/Table/Table.mjs +15 -8
  78. package/dist/components/Table/Table.mjs.map +1 -1
  79. package/dist/components/Table/table.content.cjs +2 -1
  80. package/dist/components/Table/table.content.cjs.map +1 -1
  81. package/dist/components/index.cjs +5 -2
  82. package/dist/components/index.cjs.map +1 -1
  83. package/dist/components/index.d.ts +1 -0
  84. package/dist/components/index.d.ts.map +1 -1
  85. package/dist/components/index.mjs +5 -2
  86. package/dist/components/index.mjs.map +1 -1
  87. package/dist/hooks/index.cjs +2 -0
  88. package/dist/hooks/index.cjs.map +1 -1
  89. package/dist/hooks/index.d.ts +1 -0
  90. package/dist/hooks/index.d.ts.map +1 -1
  91. package/dist/hooks/index.mjs +2 -0
  92. package/dist/hooks/index.mjs.map +1 -1
  93. package/dist/hooks/useHorizontalSwipe.cjs +144 -0
  94. package/dist/hooks/useHorizontalSwipe.cjs.map +1 -0
  95. package/dist/hooks/useHorizontalSwipe.d.ts +26 -0
  96. package/dist/hooks/useHorizontalSwipe.d.ts.map +1 -0
  97. package/dist/hooks/useHorizontalSwipe.mjs +144 -0
  98. package/dist/hooks/useHorizontalSwipe.mjs.map +1 -0
  99. package/package.json +44 -20
@@ -0,0 +1,189 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ import { cn } from "../../utils/cn.mjs";
3
+ import { H6, H5, H4, H3, H2, H1 } from "../Headers/index.mjs";
4
+ import { Code } from "../IDE/Code.mjs";
5
+ import { CodeProvider } from "../IDE/CodeContext.mjs";
6
+ import { Link } from "../Link/Link.mjs";
7
+ import { Tab } from "../Tab/Tab.mjs";
8
+ import { TabProvider } from "../Tab/TabContext.mjs";
9
+ import { Table } from "../Table/Table.mjs";
10
+ import { MarkdownProcessor } from "./processor.mjs";
11
+ const stripFrontmatter = (markdown) => {
12
+ const lines = markdown.split(/\r?\n/);
13
+ const firstNonEmptyLine = lines.find((line) => line.trim() !== "");
14
+ if (!firstNonEmptyLine || firstNonEmptyLine.trim() !== "---") {
15
+ return markdown;
16
+ }
17
+ let inMetadataBlock = false;
18
+ let endOfMetadataIndex = -1;
19
+ for (let i = 0; i < lines.length; i++) {
20
+ const trimmedLine = lines[i].trim();
21
+ if (trimmedLine === "---") {
22
+ if (!inMetadataBlock) {
23
+ inMetadataBlock = true;
24
+ continue;
25
+ } else {
26
+ endOfMetadataIndex = i;
27
+ break;
28
+ }
29
+ }
30
+ }
31
+ if (endOfMetadataIndex > -1) {
32
+ return lines.slice(endOfMetadataIndex + 1).join("\n");
33
+ }
34
+ return markdown;
35
+ };
36
+ const MarkdownRenderer = ({
37
+ children,
38
+ isDarkMode,
39
+ locale,
40
+ options
41
+ }) => {
42
+ const { overrides, ...restOptions } = options ?? {};
43
+ const cleanMarkdown = stripFrontmatter(children);
44
+ return /* @__PURE__ */ jsx(CodeProvider, { children: /* @__PURE__ */ jsx(TabProvider, { children: /* @__PURE__ */ jsx(
45
+ MarkdownProcessor,
46
+ {
47
+ options: {
48
+ disableParsingRawHTML: true,
49
+ overrides: {
50
+ h1: (props) => /* @__PURE__ */ jsx(H1, { isClickable: true, ...props }),
51
+ h2: (props) => /* @__PURE__ */ jsx(H2, { isClickable: true, ...props }),
52
+ h3: (props) => /* @__PURE__ */ jsx(H3, { isClickable: true, ...props }),
53
+ h4: (props) => /* @__PURE__ */ jsx(H4, { isClickable: true, ...props }),
54
+ h5: (props) => /* @__PURE__ */ jsx(H5, { isClickable: true, ...props }),
55
+ h6: (props) => /* @__PURE__ */ jsx(H6, { isClickable: true, ...props }),
56
+ code: (props) => !props.className ? /* @__PURE__ */ jsx("strong", { className: "bg-card/60 rounded p-1 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur", children: props.children }) : /* @__PURE__ */ jsx(
57
+ Code,
58
+ {
59
+ ...props,
60
+ isDarkMode,
61
+ language: props.className?.replace("lang-", "") || "plaintext",
62
+ fileName: props.fileName,
63
+ showHeader: Boolean(props.fileName)
64
+ }
65
+ ),
66
+ blockquote: ({
67
+ className,
68
+ ...props
69
+ }) => /* @__PURE__ */ jsx(
70
+ "blockquote",
71
+ {
72
+ className: cn(
73
+ "border-card text-neutral mt-5 flex flex-col gap-3 border-l-4 pl-5",
74
+ className
75
+ ),
76
+ ...props
77
+ }
78
+ ),
79
+ ul: ({ className, ...props }) => /* @__PURE__ */ jsx(
80
+ "ul",
81
+ {
82
+ className: cn(
83
+ "mt-5 flex flex-col gap-3 pl-5 list-disc",
84
+ className
85
+ ),
86
+ ...props
87
+ }
88
+ ),
89
+ ol: ({ className, ...props }) => /* @__PURE__ */ jsx(
90
+ "ol",
91
+ {
92
+ className: cn(
93
+ "mt-5 flex flex-col gap-3 pl-5 list-decimal",
94
+ className
95
+ ),
96
+ ...props
97
+ }
98
+ ),
99
+ img: ({
100
+ className,
101
+ ...props
102
+ }) => /* @__PURE__ */ jsx(
103
+ "img",
104
+ {
105
+ ...props,
106
+ loading: "lazy",
107
+ className: cn(
108
+ "max-w-full max-h-[80vh] rounded-md",
109
+ className
110
+ ),
111
+ src: `${props.src}?raw=true`
112
+ }
113
+ ),
114
+ a: (props) => /* @__PURE__ */ jsx(
115
+ Link,
116
+ {
117
+ color: "neutral",
118
+ isExternalLink: props.href?.startsWith("http"),
119
+ underlined: true,
120
+ locale,
121
+ ...props
122
+ }
123
+ ),
124
+ pre: (props) => props.children,
125
+ table: (props) => /* @__PURE__ */ jsx(Table, { ...props }),
126
+ th: ({ className, ...props }) => /* @__PURE__ */ jsx(
127
+ "th",
128
+ {
129
+ className: cn(
130
+ "border-neutral bg-neutral/10 border-b p-4",
131
+ className
132
+ ),
133
+ ...props
134
+ }
135
+ ),
136
+ tr: ({ className, ...props }) => /* @__PURE__ */ jsx(
137
+ "tr",
138
+ {
139
+ className: cn("hover:bg-neutral/10 hover:/10", className),
140
+ ...props
141
+ }
142
+ ),
143
+ td: ({ className, ...props }) => /* @__PURE__ */ jsx(
144
+ "td",
145
+ {
146
+ className: cn(
147
+ "border-b border-neutral-500/50 p-4",
148
+ className
149
+ ),
150
+ ...props
151
+ }
152
+ ),
153
+ hr: ({ className, ...props }) => /* @__PURE__ */ jsx(
154
+ "hr",
155
+ {
156
+ className: cn("mt-16 mx-6 text-neutral", className),
157
+ ...props
158
+ }
159
+ ),
160
+ // Support both <Tab> and <Tabs> in markdown
161
+ Tabs: (props) => /* @__PURE__ */ jsx(Tab, { ...props }),
162
+ Tab: (props) => /* @__PURE__ */ jsx(Tab, { ...props }),
163
+ TabItem: (props) => /* @__PURE__ */ jsx(Tab.Item, { ...props }),
164
+ Columns: ({
165
+ className,
166
+ ...props
167
+ }) => /* @__PURE__ */ jsx(
168
+ "div",
169
+ {
170
+ className: cn("flex max-md:flex-col gap-4", className),
171
+ ...props
172
+ }
173
+ ),
174
+ Column: ({
175
+ className,
176
+ ...props
177
+ }) => /* @__PURE__ */ jsx("div", { className: cn("flex-1", className), ...props }),
178
+ ...overrides
179
+ },
180
+ ...restOptions
181
+ },
182
+ children: cleanMarkdown ?? ""
183
+ }
184
+ ) }) });
185
+ };
186
+ export {
187
+ MarkdownRenderer
188
+ };
189
+ //# sourceMappingURL=MarkDownRender.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MarkDownRender.mjs","sources":["../../../src/components/MarkDownRender/MarkDownRender.tsx"],"sourcesContent":["import type { LocalesValues } from '@intlayer/config/client';\nimport type { ComponentProps, ComponentPropsWithoutRef, FC } from 'react';\nimport type { BundledLanguage } from 'shiki';\nimport { cn } from '../../utils/cn';\nimport { H1, H2, H3, H4, H5, H6 } from '../Headers';\nimport type { CodeCompAttributes } from '../IDE/Code';\nimport { Code } from '../IDE/Code';\nimport { CodeProvider } from '../IDE/CodeContext';\nimport { Link } from '../Link';\nimport { Tab } from '../Tab';\nimport { TabProvider } from '../Tab/TabContext';\nimport { Table } from '../Table';\nimport { MarkdownProcessor, type MarkdownProcessorOptions } from './processor';\n\ntype MarkdownRendererProps = {\n children: string;\n isDarkMode?: boolean;\n locale?: LocalesValues;\n options?: MarkdownProcessorOptions;\n};\n\n/**\n * Removes frontmatter from markdown content\n * Frontmatter is the YAML metadata block at the beginning of markdown files\n * delimited by --- at the start and end\n */\nconst stripFrontmatter = (markdown: string): string => {\n const lines = markdown.split(/\\r?\\n/);\n\n // Check if the very first non-empty line is the metadata start delimiter\n const firstNonEmptyLine = lines.find((line) => line.trim() !== '');\n\n if (!firstNonEmptyLine || firstNonEmptyLine.trim() !== '---') {\n // No frontmatter, return original content\n return markdown;\n }\n\n let inMetadataBlock = false;\n let endOfMetadataIndex = -1;\n\n for (let i = 0; i < lines.length; i++) {\n const trimmedLine = lines[i].trim();\n\n // Toggle metadata block on encountering the delimiter\n if (trimmedLine === '---') {\n if (!inMetadataBlock) {\n // Begin metadata block\n inMetadataBlock = true;\n continue;\n } else {\n // End of metadata block\n endOfMetadataIndex = i;\n break;\n }\n }\n }\n\n if (endOfMetadataIndex > -1) {\n // Return content after the frontmatter\n return lines.slice(endOfMetadataIndex + 1).join('\\n');\n }\n\n // If we couldn't find the end delimiter, return original content\n return markdown;\n};\n\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n children,\n isDarkMode,\n locale,\n options,\n}) => {\n const { overrides, ...restOptions } = options ?? {};\n\n // Strip frontmatter from the markdown content before rendering\n const cleanMarkdown = stripFrontmatter(children);\n\n return (\n <CodeProvider>\n <TabProvider>\n <MarkdownProcessor\n options={{\n disableParsingRawHTML: true,\n overrides: {\n h1: (props: ComponentProps<typeof H1>) => (\n <H1 isClickable={true} {...props} />\n ),\n h2: (props: ComponentProps<typeof H2>) => (\n <H2 isClickable={true} {...props} />\n ),\n h3: (props: ComponentProps<typeof H3>) => (\n <H3 isClickable={true} {...props} />\n ),\n h4: (props: ComponentProps<typeof H4>) => (\n <H4 isClickable={true} {...props} />\n ),\n h5: (props: ComponentProps<typeof H5>) => (\n <H5 isClickable={true} {...props} />\n ),\n h6: (props: ComponentProps<typeof H6>) => (\n <H6 isClickable={true} {...props} />\n ),\n\n code: (\n props: Omit<ComponentPropsWithoutRef<'code'>, 'children'> &\n Partial<CodeCompAttributes> & { children: string }\n ) =>\n !props.className ? (\n <strong className=\"bg-card/60 rounded p-1 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur\">\n {props.children}\n </strong>\n ) : (\n <Code\n {...props}\n isDarkMode={isDarkMode}\n language={\n (props.className?.replace('lang-', '') ||\n 'plaintext') as BundledLanguage\n }\n fileName={props.fileName}\n showHeader={Boolean(props.fileName)}\n />\n ),\n\n blockquote: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'blockquote'>) => (\n <blockquote\n className={cn(\n 'border-card text-neutral mt-5 flex flex-col gap-3 border-l-4 pl-5',\n className\n )}\n {...props}\n />\n ),\n ul: ({ className, ...props }: ComponentPropsWithoutRef<'ul'>) => (\n <ul\n className={cn(\n 'mt-5 flex flex-col gap-3 pl-5 list-disc',\n className\n )}\n {...props}\n />\n ),\n ol: ({ className, ...props }: ComponentPropsWithoutRef<'ol'>) => (\n <ol\n className={cn(\n 'mt-5 flex flex-col gap-3 pl-5 list-decimal',\n className\n )}\n {...props}\n />\n ),\n img: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'img'>) => (\n <img\n {...props}\n loading=\"lazy\"\n className={cn(\n 'max-w-full max-h-[80vh] rounded-md',\n className\n )}\n src={`${props.src}?raw=true`}\n />\n ),\n a: (props: ComponentProps<typeof Link>) => (\n <Link\n color=\"neutral\"\n isExternalLink={props.href?.startsWith('http')}\n underlined={true}\n locale={locale}\n {...props}\n />\n ),\n pre: (props: ComponentPropsWithoutRef<'pre'>) => props.children,\n\n table: (props: ComponentProps<typeof Table>) => (\n <Table {...props} />\n ),\n th: ({ className, ...props }: ComponentPropsWithoutRef<'th'>) => (\n <th\n className={cn(\n 'border-neutral bg-neutral/10 border-b p-4',\n className\n )}\n {...props}\n />\n ),\n tr: ({ className, ...props }: ComponentPropsWithoutRef<'tr'>) => (\n <tr\n className={cn('hover:bg-neutral/10 hover:/10', className)}\n {...props}\n />\n ),\n td: ({ className, ...props }: ComponentPropsWithoutRef<'td'>) => (\n <td\n className={cn(\n 'border-b border-neutral-500/50 p-4',\n className\n )}\n {...props}\n />\n ),\n hr: ({ className, ...props }: ComponentPropsWithoutRef<'hr'>) => (\n <hr\n className={cn('mt-16 mx-6 text-neutral', className)}\n {...props}\n />\n ),\n // Support both <Tab> and <Tabs> in markdown\n Tabs: (props: ComponentProps<typeof Tab>) => <Tab {...props} />,\n Tab: (props: ComponentProps<typeof Tab>) => <Tab {...props} />,\n TabItem: (props: ComponentProps<typeof Tab.Item>) => (\n <Tab.Item {...props} />\n ),\n Columns: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'div'>) => (\n <div\n className={cn('flex max-md:flex-col gap-4', className)}\n {...props}\n />\n ),\n Column: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'div'>) => (\n <div className={cn('flex-1', className)} {...props} />\n ),\n ...overrides,\n },\n ...restOptions,\n }}\n >\n {cleanMarkdown ?? ''}\n </MarkdownProcessor>\n </TabProvider>\n </CodeProvider>\n );\n};\n"],"names":[],"mappings":"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"}
@@ -1,153 +1,5 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const jsxRuntime = require("react/jsx-runtime");
4
- const Markdown = require("markdown-to-jsx");
5
- const utils_cn = require("../../utils/cn.cjs");
6
- const components_Headers_index = require("../Headers/index.cjs");
7
- const components_IDE_Code = require("../IDE/Code.cjs");
8
- const components_IDE_CodeContext = require("../IDE/CodeContext.cjs");
9
- const components_Link_Link = require("../Link/Link.cjs");
10
- const components_Table_Table = require("../Table/Table.cjs");
11
- const stripFrontmatter = (markdown) => {
12
- const lines = markdown.split(/\r?\n/);
13
- const firstNonEmptyLine = lines.find((line) => line.trim() !== "");
14
- if (!firstNonEmptyLine || firstNonEmptyLine.trim() !== "---") {
15
- return markdown;
16
- }
17
- let inMetadataBlock = false;
18
- let endOfMetadataIndex = -1;
19
- for (let i = 0; i < lines.length; i++) {
20
- const trimmedLine = lines[i].trim();
21
- if (trimmedLine === "---") {
22
- if (!inMetadataBlock) {
23
- inMetadataBlock = true;
24
- continue;
25
- } else {
26
- endOfMetadataIndex = i;
27
- break;
28
- }
29
- }
30
- }
31
- if (endOfMetadataIndex > -1) {
32
- return lines.slice(endOfMetadataIndex + 1).join("\n");
33
- }
34
- return markdown;
35
- };
36
- const MarkdownRenderer = ({
37
- children,
38
- isDarkMode,
39
- locale,
40
- options
41
- }) => {
42
- const { overrides, ...restOptions } = options ?? {};
43
- const cleanMarkdown = stripFrontmatter(children);
44
- return /* @__PURE__ */ jsxRuntime.jsx(components_IDE_CodeContext.CodeProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(
45
- Markdown,
46
- {
47
- options: {
48
- overrides: {
49
- h1: (props) => /* @__PURE__ */ jsxRuntime.jsx(components_Headers_index.H1, { isClickable: true, ...props }),
50
- h2: (props) => /* @__PURE__ */ jsxRuntime.jsx(components_Headers_index.H2, { isClickable: true, ...props }),
51
- h3: (props) => /* @__PURE__ */ jsxRuntime.jsx(components_Headers_index.H3, { isClickable: true, ...props }),
52
- h4: (props) => /* @__PURE__ */ jsxRuntime.jsx(components_Headers_index.H4, { isClickable: true, ...props }),
53
- code: (props) => typeof props.className === "undefined" ? /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "bg-card/60 rounded p-1 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur", children: props.children }) : /* @__PURE__ */ jsxRuntime.jsx(
54
- components_IDE_Code.Code,
55
- {
56
- isDarkMode,
57
- language: props.className?.replace("lang-", ""),
58
- ...props
59
- }
60
- ),
61
- blockquote: ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
62
- "blockquote",
63
- {
64
- className: utils_cn.cn(
65
- "border-card text-neutral mt-5 flex flex-col gap-3 border-l-4 pl-5",
66
- className
67
- ),
68
- ...props
69
- }
70
- ),
71
- ul: ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
72
- "ul",
73
- {
74
- className: utils_cn.cn(
75
- "mt-5 flex flex-col gap-3 pl-5 list-disc",
76
- className
77
- ),
78
- ...props
79
- }
80
- ),
81
- ol: ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
82
- "ol",
83
- {
84
- className: utils_cn.cn(
85
- "mt-5 flex flex-col gap-3 pl-5 list-decimal",
86
- className
87
- ),
88
- ...props
89
- }
90
- ),
91
- li: ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: utils_cn.cn("", className), ...props }),
92
- img: ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
93
- "img",
94
- {
95
- ...props,
96
- loading: "lazy",
97
- className: utils_cn.cn("max-w-full max-h-[80vh] rounded-md", className),
98
- src: `${props.src}?raw=true`
99
- }
100
- ),
101
- a: (props) => /* @__PURE__ */ jsxRuntime.jsx(
102
- components_Link_Link.Link,
103
- {
104
- color: "neutral",
105
- isExternalLink: props.href?.startsWith("http"),
106
- underlined: true,
107
- locale,
108
- ...props
109
- }
110
- ),
111
- pre: (props) => props.children,
112
- table: (props) => /* @__PURE__ */ jsxRuntime.jsx(components_Table_Table.Table, { ...props }),
113
- th: ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
114
- "th",
115
- {
116
- className: utils_cn.cn(
117
- "border-neutral bg-neutral/10 border-b p-4",
118
- className
119
- ),
120
- ...props
121
- }
122
- ),
123
- tr: ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
124
- "tr",
125
- {
126
- className: utils_cn.cn("hover:bg-neutral/10 hover:/10", className),
127
- ...props
128
- }
129
- ),
130
- td: ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
131
- "td",
132
- {
133
- className: utils_cn.cn("border-b border-neutral-500/50 p-4", className),
134
- ...props
135
- }
136
- ),
137
- hr: ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
138
- "hr",
139
- {
140
- className: utils_cn.cn("mt-16 mx-6 text-neutral", className),
141
- ...props
142
- }
143
- ),
144
- ...overrides
145
- },
146
- ...restOptions
147
- },
148
- children: cleanMarkdown ?? ""
149
- }
150
- ) });
151
- };
152
- exports.MarkdownRenderer = MarkdownRenderer;
3
+ const components_MarkDownRender_MarkDownRender = require("./MarkDownRender.cjs");
4
+ exports.MarkdownRenderer = components_MarkDownRender_MarkDownRender.MarkdownRenderer;
153
5
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":["../../../src/components/MarkDownRender/index.tsx"],"sourcesContent":["import type { LocalesValues } from '@intlayer/config/client';\nimport Markdown, { type MarkdownToJSX } from 'markdown-to-jsx';\nimport type { FC } from 'react';\nimport { cn } from '../../utils/cn';\nimport { H1, H2, H3, H4 } from '../Headers';\nimport { Code } from '../IDE/Code';\nimport { CodeProvider } from '../IDE/CodeContext';\nimport { Link } from '../Link';\nimport { Table } from '../Table';\n\ntype MarkdownRendererProps = {\n children: string;\n isDarkMode?: boolean;\n locale?: LocalesValues;\n options?: MarkdownToJSX.Options;\n};\n\n/**\n * Removes frontmatter from markdown content\n * Frontmatter is the YAML metadata block at the beginning of markdown files\n * delimited by --- at the start and end\n */\nconst stripFrontmatter = (markdown: string): string => {\n const lines = markdown.split(/\\r?\\n/);\n\n // Check if the very first non-empty line is the metadata start delimiter\n const firstNonEmptyLine = lines.find((line) => line.trim() !== '');\n\n if (!firstNonEmptyLine || firstNonEmptyLine.trim() !== '---') {\n // No frontmatter, return original content\n return markdown;\n }\n\n let inMetadataBlock = false;\n let endOfMetadataIndex = -1;\n\n for (let i = 0; i < lines.length; i++) {\n const trimmedLine = lines[i].trim();\n\n // Toggle metadata block on encountering the delimiter\n if (trimmedLine === '---') {\n if (!inMetadataBlock) {\n // Begin metadata block\n inMetadataBlock = true;\n continue;\n } else {\n // End of metadata block\n endOfMetadataIndex = i;\n break;\n }\n }\n }\n\n if (endOfMetadataIndex > -1) {\n // Return content after the frontmatter\n return lines.slice(endOfMetadataIndex + 1).join('\\n');\n }\n\n // If we couldn't find the end delimiter, return original content\n return markdown;\n};\n\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n children,\n isDarkMode,\n locale,\n options,\n}) => {\n const { overrides, ...restOptions } = options ?? {};\n\n // Strip frontmatter from the markdown content before rendering\n const cleanMarkdown = stripFrontmatter(children);\n\n return (\n <CodeProvider>\n <Markdown\n options={{\n overrides: {\n h1: (props) => <H1 isClickable={true} {...props} />,\n h2: (props) => <H2 isClickable={true} {...props} />,\n h3: (props) => <H3 isClickable={true} {...props} />,\n h4: (props) => <H4 isClickable={true} {...props} />,\n\n code: (props) =>\n typeof props.className === 'undefined' ? (\n <strong className=\"bg-card/60 rounded p-1 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur\">\n {props.children}\n </strong>\n ) : (\n <Code\n isDarkMode={isDarkMode}\n language={props.className?.replace('lang-', '')}\n {...props}\n />\n ),\n\n blockquote: ({ className, ...props }) => (\n <blockquote\n className={cn(\n 'border-card text-neutral mt-5 flex flex-col gap-3 border-l-4 pl-5',\n className\n )}\n {...props}\n />\n ),\n ul: ({ className, ...props }) => (\n <ul\n className={cn(\n 'mt-5 flex flex-col gap-3 pl-5 list-disc',\n className\n )}\n {...props}\n />\n ),\n ol: ({ className, ...props }) => (\n <ol\n className={cn(\n 'mt-5 flex flex-col gap-3 pl-5 list-decimal',\n className\n )}\n {...props}\n />\n ),\n li: ({ className, ...props }) => (\n <li className={cn('', className)} {...props} />\n ),\n img: ({ className, ...props }) => (\n <img\n {...props}\n loading=\"lazy\"\n className={cn('max-w-full max-h-[80vh] rounded-md', className)}\n src={`${props.src}?raw=true`}\n />\n ),\n a: (props) => (\n <Link\n color=\"neutral\"\n isExternalLink={props.href?.startsWith('http')}\n underlined={true}\n locale={locale}\n {...props}\n />\n ),\n pre: (props) => props.children,\n table: (props) => <Table {...props} />,\n\n th: ({ className, ...props }) => (\n <th\n className={cn(\n 'border-neutral bg-neutral/10 border-b p-4',\n className\n )}\n {...props}\n />\n ),\n tr: ({ className, ...props }) => (\n <tr\n className={cn('hover:bg-neutral/10 hover:/10', className)}\n {...props}\n />\n ),\n td: ({ className, ...props }) => (\n <td\n className={cn('border-b border-neutral-500/50 p-4', className)}\n {...props}\n />\n ),\n hr: ({ className, ...props }) => (\n <hr\n className={cn('mt-16 mx-6 text-neutral', className)}\n {...props}\n />\n ),\n ...overrides,\n },\n ...restOptions,\n }}\n >\n {cleanMarkdown ?? ''}\n </Markdown>\n </CodeProvider>\n );\n};\n"],"names":["CodeProvider","jsx","H1","H2","H3","H4","Code","cn","Link","Table"],"mappings":"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"}
1
+ {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,12 +1,2 @@
1
- import { LocalesValues } from '@intlayer/config/client';
2
- import { MarkdownToJSX } from 'markdown-to-jsx';
3
- import { FC } from 'react';
4
- type MarkdownRendererProps = {
5
- children: string;
6
- isDarkMode?: boolean;
7
- locale?: LocalesValues;
8
- options?: MarkdownToJSX.Options;
9
- };
10
- export declare const MarkdownRenderer: FC<MarkdownRendererProps>;
11
- export {};
1
+ export * from './MarkDownRender';
12
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MarkDownRender/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAiB,EAAE,KAAK,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAQhC,KAAK,qBAAqB,GAAG;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,OAAO,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC;CACjC,CAAC;AA+CF,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAwHtD,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MarkDownRender/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC"}
@@ -1,152 +1,4 @@
1
- import { jsx } from "react/jsx-runtime";
2
- import Markdown from "markdown-to-jsx";
3
- import { cn } from "../../utils/cn.mjs";
4
- import { H4, H3, H2, H1 } from "../Headers/index.mjs";
5
- import { Code } from "../IDE/Code.mjs";
6
- import { CodeProvider } from "../IDE/CodeContext.mjs";
7
- import { Link } from "../Link/Link.mjs";
8
- import { Table } from "../Table/Table.mjs";
9
- const stripFrontmatter = (markdown) => {
10
- const lines = markdown.split(/\r?\n/);
11
- const firstNonEmptyLine = lines.find((line) => line.trim() !== "");
12
- if (!firstNonEmptyLine || firstNonEmptyLine.trim() !== "---") {
13
- return markdown;
14
- }
15
- let inMetadataBlock = false;
16
- let endOfMetadataIndex = -1;
17
- for (let i = 0; i < lines.length; i++) {
18
- const trimmedLine = lines[i].trim();
19
- if (trimmedLine === "---") {
20
- if (!inMetadataBlock) {
21
- inMetadataBlock = true;
22
- continue;
23
- } else {
24
- endOfMetadataIndex = i;
25
- break;
26
- }
27
- }
28
- }
29
- if (endOfMetadataIndex > -1) {
30
- return lines.slice(endOfMetadataIndex + 1).join("\n");
31
- }
32
- return markdown;
33
- };
34
- const MarkdownRenderer = ({
35
- children,
36
- isDarkMode,
37
- locale,
38
- options
39
- }) => {
40
- const { overrides, ...restOptions } = options ?? {};
41
- const cleanMarkdown = stripFrontmatter(children);
42
- return /* @__PURE__ */ jsx(CodeProvider, { children: /* @__PURE__ */ jsx(
43
- Markdown,
44
- {
45
- options: {
46
- overrides: {
47
- h1: (props) => /* @__PURE__ */ jsx(H1, { isClickable: true, ...props }),
48
- h2: (props) => /* @__PURE__ */ jsx(H2, { isClickable: true, ...props }),
49
- h3: (props) => /* @__PURE__ */ jsx(H3, { isClickable: true, ...props }),
50
- h4: (props) => /* @__PURE__ */ jsx(H4, { isClickable: true, ...props }),
51
- code: (props) => typeof props.className === "undefined" ? /* @__PURE__ */ jsx("strong", { className: "bg-card/60 rounded p-1 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur", children: props.children }) : /* @__PURE__ */ jsx(
52
- Code,
53
- {
54
- isDarkMode,
55
- language: props.className?.replace("lang-", ""),
56
- ...props
57
- }
58
- ),
59
- blockquote: ({ className, ...props }) => /* @__PURE__ */ jsx(
60
- "blockquote",
61
- {
62
- className: cn(
63
- "border-card text-neutral mt-5 flex flex-col gap-3 border-l-4 pl-5",
64
- className
65
- ),
66
- ...props
67
- }
68
- ),
69
- ul: ({ className, ...props }) => /* @__PURE__ */ jsx(
70
- "ul",
71
- {
72
- className: cn(
73
- "mt-5 flex flex-col gap-3 pl-5 list-disc",
74
- className
75
- ),
76
- ...props
77
- }
78
- ),
79
- ol: ({ className, ...props }) => /* @__PURE__ */ jsx(
80
- "ol",
81
- {
82
- className: cn(
83
- "mt-5 flex flex-col gap-3 pl-5 list-decimal",
84
- className
85
- ),
86
- ...props
87
- }
88
- ),
89
- li: ({ className, ...props }) => /* @__PURE__ */ jsx("li", { className: cn("", className), ...props }),
90
- img: ({ className, ...props }) => /* @__PURE__ */ jsx(
91
- "img",
92
- {
93
- ...props,
94
- loading: "lazy",
95
- className: cn("max-w-full max-h-[80vh] rounded-md", className),
96
- src: `${props.src}?raw=true`
97
- }
98
- ),
99
- a: (props) => /* @__PURE__ */ jsx(
100
- Link,
101
- {
102
- color: "neutral",
103
- isExternalLink: props.href?.startsWith("http"),
104
- underlined: true,
105
- locale,
106
- ...props
107
- }
108
- ),
109
- pre: (props) => props.children,
110
- table: (props) => /* @__PURE__ */ jsx(Table, { ...props }),
111
- th: ({ className, ...props }) => /* @__PURE__ */ jsx(
112
- "th",
113
- {
114
- className: cn(
115
- "border-neutral bg-neutral/10 border-b p-4",
116
- className
117
- ),
118
- ...props
119
- }
120
- ),
121
- tr: ({ className, ...props }) => /* @__PURE__ */ jsx(
122
- "tr",
123
- {
124
- className: cn("hover:bg-neutral/10 hover:/10", className),
125
- ...props
126
- }
127
- ),
128
- td: ({ className, ...props }) => /* @__PURE__ */ jsx(
129
- "td",
130
- {
131
- className: cn("border-b border-neutral-500/50 p-4", className),
132
- ...props
133
- }
134
- ),
135
- hr: ({ className, ...props }) => /* @__PURE__ */ jsx(
136
- "hr",
137
- {
138
- className: cn("mt-16 mx-6 text-neutral", className),
139
- ...props
140
- }
141
- ),
142
- ...overrides
143
- },
144
- ...restOptions
145
- },
146
- children: cleanMarkdown ?? ""
147
- }
148
- ) });
149
- };
1
+ import { MarkdownRenderer } from "./MarkDownRender.mjs";
150
2
  export {
151
3
  MarkdownRenderer
152
4
  };
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":["../../../src/components/MarkDownRender/index.tsx"],"sourcesContent":["import type { LocalesValues } from '@intlayer/config/client';\nimport Markdown, { type MarkdownToJSX } from 'markdown-to-jsx';\nimport type { FC } from 'react';\nimport { cn } from '../../utils/cn';\nimport { H1, H2, H3, H4 } from '../Headers';\nimport { Code } from '../IDE/Code';\nimport { CodeProvider } from '../IDE/CodeContext';\nimport { Link } from '../Link';\nimport { Table } from '../Table';\n\ntype MarkdownRendererProps = {\n children: string;\n isDarkMode?: boolean;\n locale?: LocalesValues;\n options?: MarkdownToJSX.Options;\n};\n\n/**\n * Removes frontmatter from markdown content\n * Frontmatter is the YAML metadata block at the beginning of markdown files\n * delimited by --- at the start and end\n */\nconst stripFrontmatter = (markdown: string): string => {\n const lines = markdown.split(/\\r?\\n/);\n\n // Check if the very first non-empty line is the metadata start delimiter\n const firstNonEmptyLine = lines.find((line) => line.trim() !== '');\n\n if (!firstNonEmptyLine || firstNonEmptyLine.trim() !== '---') {\n // No frontmatter, return original content\n return markdown;\n }\n\n let inMetadataBlock = false;\n let endOfMetadataIndex = -1;\n\n for (let i = 0; i < lines.length; i++) {\n const trimmedLine = lines[i].trim();\n\n // Toggle metadata block on encountering the delimiter\n if (trimmedLine === '---') {\n if (!inMetadataBlock) {\n // Begin metadata block\n inMetadataBlock = true;\n continue;\n } else {\n // End of metadata block\n endOfMetadataIndex = i;\n break;\n }\n }\n }\n\n if (endOfMetadataIndex > -1) {\n // Return content after the frontmatter\n return lines.slice(endOfMetadataIndex + 1).join('\\n');\n }\n\n // If we couldn't find the end delimiter, return original content\n return markdown;\n};\n\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n children,\n isDarkMode,\n locale,\n options,\n}) => {\n const { overrides, ...restOptions } = options ?? {};\n\n // Strip frontmatter from the markdown content before rendering\n const cleanMarkdown = stripFrontmatter(children);\n\n return (\n <CodeProvider>\n <Markdown\n options={{\n overrides: {\n h1: (props) => <H1 isClickable={true} {...props} />,\n h2: (props) => <H2 isClickable={true} {...props} />,\n h3: (props) => <H3 isClickable={true} {...props} />,\n h4: (props) => <H4 isClickable={true} {...props} />,\n\n code: (props) =>\n typeof props.className === 'undefined' ? (\n <strong className=\"bg-card/60 rounded p-1 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur\">\n {props.children}\n </strong>\n ) : (\n <Code\n isDarkMode={isDarkMode}\n language={props.className?.replace('lang-', '')}\n {...props}\n />\n ),\n\n blockquote: ({ className, ...props }) => (\n <blockquote\n className={cn(\n 'border-card text-neutral mt-5 flex flex-col gap-3 border-l-4 pl-5',\n className\n )}\n {...props}\n />\n ),\n ul: ({ className, ...props }) => (\n <ul\n className={cn(\n 'mt-5 flex flex-col gap-3 pl-5 list-disc',\n className\n )}\n {...props}\n />\n ),\n ol: ({ className, ...props }) => (\n <ol\n className={cn(\n 'mt-5 flex flex-col gap-3 pl-5 list-decimal',\n className\n )}\n {...props}\n />\n ),\n li: ({ className, ...props }) => (\n <li className={cn('', className)} {...props} />\n ),\n img: ({ className, ...props }) => (\n <img\n {...props}\n loading=\"lazy\"\n className={cn('max-w-full max-h-[80vh] rounded-md', className)}\n src={`${props.src}?raw=true`}\n />\n ),\n a: (props) => (\n <Link\n color=\"neutral\"\n isExternalLink={props.href?.startsWith('http')}\n underlined={true}\n locale={locale}\n {...props}\n />\n ),\n pre: (props) => props.children,\n table: (props) => <Table {...props} />,\n\n th: ({ className, ...props }) => (\n <th\n className={cn(\n 'border-neutral bg-neutral/10 border-b p-4',\n className\n )}\n {...props}\n />\n ),\n tr: ({ className, ...props }) => (\n <tr\n className={cn('hover:bg-neutral/10 hover:/10', className)}\n {...props}\n />\n ),\n td: ({ className, ...props }) => (\n <td\n className={cn('border-b border-neutral-500/50 p-4', className)}\n {...props}\n />\n ),\n hr: ({ className, ...props }) => (\n <hr\n className={cn('mt-16 mx-6 text-neutral', className)}\n {...props}\n />\n ),\n ...overrides,\n },\n ...restOptions,\n }}\n >\n {cleanMarkdown ?? ''}\n </Markdown>\n </CodeProvider>\n );\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}