react-intlayer 8.0.0-canary.2 → 8.0.0-canary.4
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/cjs/html/HTMLProvider.cjs.map +1 -1
- package/dist/cjs/html/HTMLRenderer.cjs.map +1 -1
- package/dist/cjs/markdown/MarkdownProvider.cjs +10 -22
- package/dist/cjs/markdown/MarkdownProvider.cjs.map +1 -1
- package/dist/cjs/markdown/MarkdownRenderer.cjs +2 -6
- package/dist/cjs/markdown/MarkdownRenderer.cjs.map +1 -1
- package/dist/cjs/markdown/processor.cjs.map +1 -1
- package/dist/cjs/plugins.cjs +1 -2
- package/dist/cjs/plugins.cjs.map +1 -1
- package/dist/cjs/reactElement/renderReactElement.cjs +23 -12
- package/dist/cjs/reactElement/renderReactElement.cjs.map +1 -1
- package/dist/esm/html/HTMLProvider.mjs.map +1 -1
- package/dist/esm/html/HTMLRenderer.mjs.map +1 -1
- package/dist/esm/markdown/MarkdownProvider.mjs +10 -22
- package/dist/esm/markdown/MarkdownProvider.mjs.map +1 -1
- package/dist/esm/markdown/MarkdownRenderer.mjs +2 -6
- package/dist/esm/markdown/MarkdownRenderer.mjs.map +1 -1
- package/dist/esm/markdown/processor.mjs.map +1 -1
- package/dist/esm/plugins.mjs +1 -2
- package/dist/esm/plugins.mjs.map +1 -1
- package/dist/esm/reactElement/renderReactElement.mjs +23 -12
- package/dist/esm/reactElement/renderReactElement.mjs.map +1 -1
- package/dist/types/client/format/useCompact.d.ts +2 -2
- package/dist/types/client/format/useCurrency.d.ts +2 -2
- package/dist/types/client/format/useList.d.ts +2 -2
- package/dist/types/client/format/useList.d.ts.map +1 -1
- package/dist/types/client/format/useNumber.d.ts +2 -2
- package/dist/types/client/format/useRelativeTime.d.ts +2 -2
- package/dist/types/client/format/useUnit.d.ts +2 -2
- package/dist/types/client/format/useUnit.d.ts.map +1 -1
- package/dist/types/client/useDictionaryDynamic.d.ts +2 -2
- package/dist/types/client/useIntlayer.d.ts +2 -2
- package/dist/types/client/useLocaleBase.d.ts +5 -5
- package/dist/types/client/useLocaleStorage.d.ts +5 -5
- package/dist/types/html/HTMLProvider.d.ts +3 -2
- package/dist/types/html/HTMLProvider.d.ts.map +1 -1
- package/dist/types/html/HTMLRenderer.d.ts +107 -3
- package/dist/types/html/HTMLRenderer.d.ts.map +1 -1
- package/dist/types/html/index.d.ts +1 -2
- package/dist/types/markdown/MarkdownProvider.d.ts +6 -10
- package/dist/types/markdown/MarkdownProvider.d.ts.map +1 -1
- package/dist/types/markdown/MarkdownRenderer.d.ts +7 -7
- package/dist/types/markdown/MarkdownRenderer.d.ts.map +1 -1
- package/dist/types/markdown/index.d.ts +2 -2
- package/dist/types/markdown/processor.d.ts +4 -4
- package/dist/types/markdown/processor.d.ts.map +1 -1
- package/dist/types/plugins.d.ts +30 -15
- package/dist/types/plugins.d.ts.map +1 -1
- package/dist/types/reactElement/renderReactElement.d.ts +1 -2
- package/dist/types/reactElement/renderReactElement.d.ts.map +1 -1
- package/dist/types/server/IntlayerServerProvider.d.ts +2 -2
- package/dist/types/server/useDictionary.d.ts +2 -2
- package/dist/types/server/useDictionaryAsync.d.ts +2 -2
- package/dist/types/server/useIntlayer.d.ts +2 -2
- package/dist/types/utils/HTMLComponentTypes.d.ts +38 -0
- package/dist/types/utils/HTMLComponentTypes.d.ts.map +1 -0
- package/package.json +9 -9
- package/dist/types/html/types.d.ts +0 -26
- package/dist/types/html/types.d.ts.map +0 -1
- /package/dist/cjs/{html/types.cjs → utils/HTMLComponentTypes.cjs} +0 -0
- /package/dist/esm/{html/types.mjs → utils/HTMLComponentTypes.mjs} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MarkdownRenderer.mjs","names":[],"sources":["../../../src/markdown/MarkdownRenderer.tsx"],"sourcesContent":["import type { Overrides } from '@intlayer/core';\nimport type { FC, JSX, ReactNode } from 'react';\nimport {\n type MarkdownProviderOptions,\n useMarkdownContext,\n} from './MarkdownProvider';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\n/**\n * Props for rendering markdown content.\n *\n * @example\n * ```tsx\n * const props: RenderMarkdownProps = {\n * components: {\n * h1: ({ children }) => <h1 className=\"text-3xl\">{children}</h1>,\n * p: ({ children }) => <p className=\"text-gray-700\">{children}</p>,\n * },\n * wrapper: ({ children }) => <article>{children}</article>,\n * options: {\n * forceBlock: true,\n * preserveFrontmatter: false,\n * tagfilter: true,\n * },\n * };\n * ```\n */\nexport type RenderMarkdownProps = MarkdownProviderOptions & {\n /**\n * Component overrides for HTML tags.\n * Allows you to customize how specific HTML elements are rendered.\n * Only used if not wrapped in a MarkdownProvider.\n *\n * @example\n * ```tsx\n * components={{\n * h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n * a: ({ href, children }) => <Link to={href}>{children}</Link>,\n * }}\n * ```\n */\n components?: Overrides;\n /**\n * Wrapper element or component to be used when there are multiple children.\n * Only used if not wrapped in a MarkdownProvider.\n *\n * @example\n * ```tsx\n * wrapper={({ children }) => <div className=\"markdown-content\">{children}</div>}\n * ```\n */\n wrapper?: FC;\n};\n\n/**\n * Renders markdown content to JSX with the provided components and options.\n *\n * This function does not use context from MarkdownProvider. Use `useMarkdownRenderer`\n * hook if you want to leverage provider context.\n *\n * @param content - The markdown string to render\n * @param props - Configuration options for rendering\n * @param props.components - Component overrides for HTML tags\n * @param props.wrapper - Wrapper component for multiple children\n * @returns JSX element representing the rendered markdown\n *\n * @example\n * ```tsx\n * import { renderMarkdown } from '@intlayer/react-intlayer/markdown';\n *\n * const markdown = '# Hello World\\n\\nThis is **bold** text.';\n * const jsx = renderMarkdown(markdown, {\n * components: {\n * h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n * },\n * forceBlock: true,\n * });\n * ```\n */\nexport const renderMarkdown = (\n content: string,\n {\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n }: RenderMarkdownProps = {}\n): JSX.Element => {\n // Map public options to internal processor options\n const internalOptions: MarkdownRendererOptions = {\n components,\n forceBlock,\n forceInline,\n wrapper,\n forceWrapper: !!wrapper,\n preserveFrontmatter,\n tagfilter,\n };\n\n return compiler(content, internalOptions);\n};\n\n/**\n * Hook that returns a function to render markdown content.\n *\n * This hook considers the configuration from the `MarkdownProvider` context if available,\n * falling back to the provided props or default behavior.\n *\n * @param props - Optional configuration that will override context values\n * @param props.components - Component overrides for HTML tags (overrides context)\n * @param props.wrapper - Wrapper component (overrides context)\n * @returns A function that takes markdown content and returns JSX\n *\n * @example\n * ```tsx\n * import { useMarkdownRenderer } from '@intlayer/react-intlayer/markdown';\n *\n * function MyComponent() {\n * const renderMarkdown = useMarkdownRenderer({\n * components: {\n * h1: ({ children }) => <h1 className=\"custom\">{children}</h1>,\n * },\n * });\n *\n * return (\n * <div>\n * {renderMarkdown('# Hello\\n\\nThis is **markdown**')}\n * </div>\n * );\n * }\n * ```\n *\n * @example\n * ```tsx\n * // With MarkdownProvider context\n * function App() {\n * return (\n * <MarkdownProvider\n * components={{ h1: CustomHeading }}\n * forceBlock={true}\n * >\n * <MyComponent />\n * </MarkdownProvider>\n * );\n * }\n * ```\n */\nexport const useMarkdownRenderer = ({\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n}: RenderMarkdownProps = {}) => {\n const context = useMarkdownContext();\n\n return (content: string) => {\n if (context) {\n return context.renderMarkdown(content, {\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n });\n }\n\n return renderMarkdown(content, {\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n });\n };\n};\n\n/**\n * Props for the MarkdownRenderer component.\n *\n * @example\n * ```tsx\n * const props: MarkdownRendererProps = {\n * children: '# Hello World\\n\\nThis is **bold** text.',\n * components: {\n * h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n * },\n * wrapper: ({ children }) => <article>{children}</article>,\n * forceBlock: true,\n * };\n * ```\n */\nexport type MarkdownRendererProps = RenderMarkdownProps & {\n /**\n * The markdown content to render as a string.\n *\n * @example\n * ```tsx\n * <MarkdownRenderer>\n * {`# Title\\n\\nParagraph with **bold** text.`}\n * </MarkdownRenderer>\n * ```\n */\n children: string;\n /**\n * Custom render function for markdown.\n * If provided, it will overwrite context and default rendering.\n *\n * @param markdown - The markdown string to render\n * @param options - Optional rendering options\n * @returns React node representing the rendered markdown\n *\n * @example\n * ```tsx\n * <MarkdownRenderer\n * renderMarkdown={(md, opts) => {\n * // Custom rendering logic\n * return <div dangerouslySetInnerHTML={{ __html: customParser(md) }} />;\n * }}\n * >\n * {markdownContent}\n * </MarkdownRenderer>\n * ```\n */\n renderMarkdown?: (\n markdown: string,\n options?: {\n components?: Overrides;\n wrapper?: FC;\n forceBlock?: boolean;\n forceInline?: boolean;\n preserveFrontmatter?: boolean;\n tagfilter?: boolean;\n }\n ) => ReactNode;\n};\n\n/**\n * React component that renders markdown content to JSX.\n *\n * This component uses the `renderMarkdown` function from the `MarkdownProvider` context\n * if available. Otherwise, it falls back to the default compiler with provided components\n * and options. You can also provide a custom `renderMarkdown` function prop to override\n * all rendering behavior.\n *\n * @example\n * ```tsx\n * import { MarkdownRenderer } from '@intlayer/react-intlayer/markdown';\n *\n * function MyComponent() {\n * return (\n * <MarkdownRenderer>\n * {`# Hello World\n *\n * This is a paragraph with **bold** and *italic* text.\n *\n * - List item 1\n * - List item 2`}\n * </MarkdownRenderer>\n * );\n * }\n * ```\n *\n * @example\n * ```tsx\n * // With custom components\n * <MarkdownRenderer\n * components={{\n * h1: ({ children }) => <h1 className=\"text-4xl font-bold\">{children}</h1>,\n * a: ({ href, children }) => (\n * <a href={href} className=\"text-blue-500 hover:underline\">\n * {children}\n * </a>\n * ),\n * }}\n * forceBlock={true}\n * >\n * {markdownContent}\n * </MarkdownRenderer>\n * ```\n *\n * @example\n * ```tsx\n * // With MarkdownProvider context\n * function App() {\n * return (\n * <MarkdownProvider\n * components={{ h1: CustomHeading }}\n * forceBlock={true}\n * >\n * <MarkdownRenderer>\n * {markdownContent}\n * </MarkdownRenderer>\n * </MarkdownProvider>\n * );\n * }\n * ```\n */\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n children = '',\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n renderMarkdown,\n}) => {\n const context = useMarkdownContext();\n\n if (renderMarkdown) {\n return (\n <>\n {renderMarkdown(children, {\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n })}\n </>\n );\n }\n\n if (context) {\n return (\n <>\n {context.renderMarkdown(children, {\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n })}\n </>\n );\n }\n\n // Map public options to internal processor options\n const internalOptions: MarkdownRendererOptions = {\n components,\n forceBlock,\n forceInline,\n wrapper,\n forceWrapper: !!wrapper,\n preserveFrontmatter,\n tagfilter,\n };\n\n return <>{compiler(children, internalOptions)}</>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+EA,MAAa,kBACX,SACA,EACE,YACA,SACA,YACA,aACA,qBACA,cACuB,EAAE,KACX;AAYhB,QAAO,SAAS,SAViC;EAC/C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD,CAEwC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgD3C,MAAa,uBAAuB,EAClC,YACA,SACA,YACA,aACA,qBACA,cACuB,EAAE,KAAK;CAC9B,MAAM,UAAU,oBAAoB;AAEpC,SAAQ,YAAoB;AAC1B,MAAI,QACF,QAAO,QAAQ,eAAe,SAAS;GACrC;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;AAGJ,SAAO,eAAe,SAAS;GAC7B;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6HN,MAAa,oBAA+C,EAC1D,WAAW,IACX,YACA,SACA,YACA,aACA,qBACA,WACA,qBACI;CACJ,MAAM,UAAU,oBAAoB;AAEpC,KAAI,eACF,QACE,0CACG,eAAe,UAAU;EACxB;EACA;EACA;EACA;EACA;EACA;EACD,CAAC,GACD;AAIP,KAAI,QACF,QACE,0CACG,QAAQ,eAAe,UAAU;EAChC;EACA;EACA;EACA;EACA;EACA;EACD,CAAC,GACD;AAeP,QAAO,0CAAG,SAAS,UAV8B;EAC/C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD,CAE4C,GAAI"}
|
|
1
|
+
{"version":3,"file":"MarkdownRenderer.mjs","names":[],"sources":["../../../src/markdown/MarkdownRenderer.tsx"],"sourcesContent":["import type { FC, HTMLAttributes, JSX, ReactNode } from 'react';\nimport type { HTMLComponents } from '../utils/HTMLComponentTypes';\nimport {\n type MarkdownProviderOptions,\n useMarkdownContext,\n} from './MarkdownProvider';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\n/**\n * Props for rendering markdown content.\n *\n * @example\n * ```tsx\n * const props: RenderMarkdownProps = {\n * components: {\n * h1: ({ children }) => <h1 className=\"text-3xl\">{children}</h1>,\n * p: ({ children }) => <p className=\"text-gray-700\">{children}</p>,\n * },\n * wrapper: ({ children }) => <article>{children}</article>,\n * options: {\n * forceBlock: true,\n * preserveFrontmatter: false,\n * tagfilter: true,\n * },\n * };\n * ```\n */\nexport type RenderMarkdownProps = MarkdownProviderOptions & {\n /**\n * Component overrides for HTML tags.\n * Allows you to customize how specific HTML elements are rendered.\n * Only used if not wrapped in a MarkdownProvider.\n *\n * @example\n * ```tsx\n * components={{\n * h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n * a: ({ href, children }) => <Link to={href}>{children}</Link>,\n * }}\n * ```\n */\n components?: HTMLComponents<'permissive', {}>;\n /**\n * Wrapper element or component to be used when there are multiple children.\n * Only used if not wrapped in a MarkdownProvider.\n *\n * @example\n * ```tsx\n * wrapper={({ children }) => <div className=\"markdown-content\">{children}</div>}\n * ```\n */\n wrapper?: FC<HTMLAttributes<HTMLElement>>;\n};\n\n/**\n * Renders markdown content to JSX with the provided components and options.\n *\n * This function does not use context from MarkdownProvider. Use `useMarkdownRenderer`\n * hook if you want to leverage provider context.\n *\n * @param content - The markdown string to render\n * @param props - Configuration options for rendering\n * @param props.components - Component overrides for HTML tags\n * @param props.wrapper - Wrapper component for multiple children\n * @returns JSX element representing the rendered markdown\n *\n * @example\n * ```tsx\n * import { renderMarkdown } from '@intlayer/react-intlayer/markdown';\n *\n * const markdown = '# Hello World\\n\\nThis is **bold** text.';\n * const jsx = renderMarkdown(markdown, {\n * components: {\n * h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n * },\n * forceBlock: true,\n * });\n * ```\n */\nexport const renderMarkdown = (\n content: string,\n {\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n }: RenderMarkdownProps = {}\n): JSX.Element => {\n // Map public options to internal processor options\n const internalOptions: MarkdownRendererOptions = {\n components,\n forceBlock,\n forceInline,\n wrapper,\n forceWrapper: !!wrapper,\n preserveFrontmatter,\n tagfilter,\n };\n\n return compiler(content, internalOptions);\n};\n\n/**\n * Hook that returns a function to render markdown content.\n *\n * This hook considers the configuration from the `MarkdownProvider` context if available,\n * falling back to the provided props or default behavior.\n *\n * @param props - Optional configuration that will override context values\n * @param props.components - Component overrides for HTML tags (overrides context)\n * @param props.wrapper - Wrapper component (overrides context)\n * @returns A function that takes markdown content and returns JSX\n *\n * @example\n * ```tsx\n * import { useMarkdownRenderer } from '@intlayer/react-intlayer/markdown';\n *\n * function MyComponent() {\n * const renderMarkdown = useMarkdownRenderer({\n * components: {\n * h1: ({ children }) => <h1 className=\"custom\">{children}</h1>,\n * },\n * });\n *\n * return (\n * <div>\n * {renderMarkdown('# Hello\\n\\nThis is **markdown**')}\n * </div>\n * );\n * }\n * ```\n *\n * @example\n * ```tsx\n * // With MarkdownProvider context\n * function App() {\n * return (\n * <MarkdownProvider\n * components={{ h1: CustomHeading }}\n * forceBlock={true}\n * >\n * <MyComponent />\n * </MarkdownProvider>\n * );\n * }\n * ```\n */\nexport const useMarkdownRenderer = ({\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n}: RenderMarkdownProps = {}) => {\n const context = useMarkdownContext();\n\n return (content: string) => {\n if (context) {\n return context.renderMarkdown(\n content,\n {\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n },\n components,\n wrapper\n );\n }\n\n return renderMarkdown(content, {\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n });\n };\n};\n\n/**\n * Props for the MarkdownRenderer component.\n *\n * @example\n * ```tsx\n * const props: MarkdownRendererProps = {\n * children: '# Hello World\\n\\nThis is **bold** text.',\n * components: {\n * h1: ({ children }) => <h1 className=\"title\">{children}</h1>,\n * },\n * wrapper: ({ children }) => <article>{children}</article>,\n * forceBlock: true,\n * };\n * ```\n */\nexport type MarkdownRendererProps = RenderMarkdownProps & {\n /**\n * The markdown content to render as a string.\n *\n * @example\n * ```tsx\n * <MarkdownRenderer>\n * {`# Title\\n\\nParagraph with **bold** text.`}\n * </MarkdownRenderer>\n * ```\n */\n children: string;\n /**\n * Custom render function for markdown.\n * If provided, it will overwrite context and default rendering.\n *\n * @param markdown - The markdown string to render\n * @param options - Optional rendering options\n * @returns React node representing the rendered markdown\n *\n * @example\n * ```tsx\n * <MarkdownRenderer\n * renderMarkdown={(md, opts) => {\n * // Custom rendering logic\n * return <div dangerouslySetInnerHTML={{ __html: customParser(md) }} />;\n * }}\n * >\n * {markdownContent}\n * </MarkdownRenderer>\n * ```\n */\n renderMarkdown?: (\n markdown: string,\n options?: {\n components?: HTMLComponents<'permissive', {}>;\n wrapper?: FC;\n forceBlock?: boolean;\n forceInline?: boolean;\n preserveFrontmatter?: boolean;\n tagfilter?: boolean;\n }\n ) => ReactNode;\n};\n\n/**\n * React component that renders markdown content to JSX.\n *\n * This component uses the `renderMarkdown` function from the `MarkdownProvider` context\n * if available. Otherwise, it falls back to the default compiler with provided components\n * and options. You can also provide a custom `renderMarkdown` function prop to override\n * all rendering behavior.\n *\n * @example\n * ```tsx\n * import { MarkdownRenderer } from '@intlayer/react-intlayer/markdown';\n *\n * function MyComponent() {\n * return (\n * <MarkdownRenderer>\n * {`# Hello World\n *\n * This is a paragraph with **bold** and *italic* text.\n *\n * - List item 1\n * - List item 2`}\n * </MarkdownRenderer>\n * );\n * }\n * ```\n *\n * @example\n * ```tsx\n * // With custom components\n * <MarkdownRenderer\n * components={{\n * h1: ({ children }) => <h1 className=\"text-4xl font-bold\">{children}</h1>,\n * a: ({ href, children }) => (\n * <a href={href} className=\"text-blue-500 hover:underline\">\n * {children}\n * </a>\n * ),\n * }}\n * forceBlock={true}\n * >\n * {markdownContent}\n * </MarkdownRenderer>\n * ```\n *\n * @example\n * ```tsx\n * // With MarkdownProvider context\n * function App() {\n * return (\n * <MarkdownProvider\n * components={{ h1: CustomHeading }}\n * forceBlock={true}\n * >\n * <MarkdownRenderer>\n * {markdownContent}\n * </MarkdownRenderer>\n * </MarkdownProvider>\n * );\n * }\n * ```\n */\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n children = '',\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n renderMarkdown,\n}) => {\n const context = useMarkdownContext();\n\n if (renderMarkdown) {\n return (\n <>\n {renderMarkdown(children, {\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n })}\n </>\n );\n }\n\n if (context) {\n return (\n <>\n {context.renderMarkdown(\n children,\n {\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n },\n components,\n wrapper\n )}\n </>\n );\n }\n\n // Map public options to internal processor options\n const internalOptions: MarkdownRendererOptions = {\n components,\n forceBlock,\n forceInline,\n wrapper,\n forceWrapper: !!wrapper,\n preserveFrontmatter,\n tagfilter,\n };\n\n return <>{compiler(children, internalOptions)}</>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+EA,MAAa,kBACX,SACA,EACE,YACA,SACA,YACA,aACA,qBACA,cACuB,EAAE,KACX;AAYhB,QAAO,SAAS,SAViC;EAC/C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD,CAEwC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgD3C,MAAa,uBAAuB,EAClC,YACA,SACA,YACA,aACA,qBACA,cACuB,EAAE,KAAK;CAC9B,MAAM,UAAU,oBAAoB;AAEpC,SAAQ,YAAoB;AAC1B,MAAI,QACF,QAAO,QAAQ,eACb,SACA;GACE;GACA;GACA;GACA;GACD,EACD,YACA,QACD;AAGH,SAAO,eAAe,SAAS;GAC7B;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6HN,MAAa,oBAA+C,EAC1D,WAAW,IACX,YACA,SACA,YACA,aACA,qBACA,WACA,qBACI;CACJ,MAAM,UAAU,oBAAoB;AAEpC,KAAI,eACF,QACE,0CACG,eAAe,UAAU;EACxB;EACA;EACA;EACA;EACA;EACA;EACD,CAAC,GACD;AAIP,KAAI,QACF,QACE,0CACG,QAAQ,eACP,UACA;EACE;EACA;EACA;EACA;EACD,EACD,YACA,QACD,GACA;AAeP,QAAO,0CAAG,SAAS,UAV8B;EAC/C;EACA;EACA;EACA;EACA,cAAc,CAAC,CAAC;EAChB;EACA;EACD,CAE4C,GAAI"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"processor.mjs","names":["coreCompile"],"sources":["../../../src/markdown/processor.tsx"],"sourcesContent":["import {\n
|
|
1
|
+
{"version":3,"file":"processor.mjs","names":["coreCompile"],"sources":["../../../src/markdown/processor.tsx"],"sourcesContent":["import {\n compile as coreCompile,\n sanitizer as defaultSanitizer,\n slugify as defaultSlugify,\n type MarkdownContext,\n type MarkdownOptions,\n type MarkdownRuntime,\n type ParseState,\n type RenderRuleHook,\n RuleType,\n} from '@intlayer/core';\nimport {\n cloneElement,\n createElement,\n type FC,\n Fragment,\n type HTMLAttributes,\n type JSX,\n type ReactNode,\n} from 'react';\nimport type { HTMLComponents } from '../utils/HTMLComponentTypes';\n\n// Re-export RuleType for compatibility\nexport { RuleType };\n\n// Re-export utilities for compatibility\nexport { defaultSlugify as slugify, defaultSanitizer as sanitizer };\n\ntype HTMLTags = keyof JSX.IntrinsicElements;\n\n/**\n * Refined MarkdownRendererOptions type.\n */\nexport type MarkdownRendererOptions = Partial<{\n /**\n * Ultimate control over the output of all rendered JSX.\n */\n createElement: (\n tag: Parameters<typeof createElement>[0],\n props: JSX.IntrinsicAttributes,\n ...children: ReactNode[]\n ) => ReactNode;\n\n /**\n * The library automatically generates an anchor tag for bare URLs included in the markdown\n * document, but this behavior can be disabled if desired.\n */\n disableAutoLink: boolean;\n\n /**\n * Disable the compiler's best-effort transcription of provided raw HTML\n * into JSX-equivalent.\n */\n disableParsingRawHTML: boolean;\n\n /**\n * Forces the compiler to have space between hash sign and the header text.\n */\n enforceAtxHeadings: boolean;\n\n /**\n * Forces the compiler to always output content with a block-level wrapper.\n */\n forceBlock: boolean;\n\n /**\n * Forces the compiler to always output content with an inline wrapper.\n */\n forceInline: boolean;\n\n /**\n * Forces the compiler to wrap results, even if there is only a single child.\n */\n forceWrapper: boolean;\n\n /**\n * Supply additional HTML entity: unicode replacement mappings.\n */\n namedCodesToUnicode: {\n [key: string]: string;\n };\n\n /**\n * Selectively control the output of particular HTML tags.\n */\n components: HTMLComponents;\n\n /**\n * Allows for full control over rendering of particular rules.\n */\n renderRule: RenderRuleHook;\n\n /**\n * Override the built-in sanitizer function for URLs.\n */\n sanitizer: (value: string, tag: HTMLTags, attribute: string) => string | null;\n\n /**\n * Override normalization of non-URI-safe characters for anchor linking.\n */\n slugify: (input: string) => string;\n\n /**\n * Declare the type of the wrapper to be used when there are multiple children.\n */\n wrapper: any | null;\n\n /**\n * Whether to preserve frontmatter in the markdown content.\n */\n preserveFrontmatter: boolean;\n\n /**\n * Whether to use the GitHub Tag Filter.\n */\n tagfilter: boolean;\n}>;\n\n/**\n * Default React runtime for markdown rendering.\n */\nconst DEFAULT_RUNTIME: MarkdownRuntime = {\n createElement: createElement as any,\n cloneElement,\n Fragment,\n normalizeProps: (_tag, props) => props,\n};\n\n/**\n * Compile markdown to React elements.\n * This is the primary export - use this for new code.\n */\nexport const compileMarkdown = (\n markdown: string = '',\n options: MarkdownRendererOptions = {}\n): JSX.Element => {\n const {\n createElement: customCreateElement,\n disableAutoLink,\n disableParsingRawHTML,\n enforceAtxHeadings,\n forceBlock,\n forceInline,\n forceWrapper,\n namedCodesToUnicode,\n components,\n renderRule,\n sanitizer,\n slugify,\n wrapper,\n preserveFrontmatter,\n tagfilter,\n } = options;\n\n const runtime = customCreateElement\n ? { ...DEFAULT_RUNTIME, createElement: customCreateElement as any }\n : DEFAULT_RUNTIME;\n\n const ctx: MarkdownContext<HTMLComponents> = {\n runtime,\n components,\n namedCodesToUnicode,\n sanitizer: sanitizer as any,\n slugify,\n };\n\n const compilerOptions: MarkdownOptions = {\n disableAutoLink,\n disableParsingRawHTML,\n enforceAtxHeadings,\n forceBlock,\n forceInline,\n forceWrapper,\n renderRule,\n wrapper,\n preserveFrontmatter,\n tagfilter,\n };\n\n return coreCompile(markdown, ctx, compilerOptions) as JSX.Element;\n};\n\n// Backward compatibility aliases\nexport const compiler = compileMarkdown;\nexport const compile = compileMarkdown;\n\n/**\n * React component that renders markdown to JSX (legacy).\n */\nexport const LegacyMarkdownRenderer: FC<\n Omit<HTMLAttributes<Element>, 'children'> & {\n children: string;\n options?: MarkdownRendererOptions;\n }\n> = ({ children = '', options, ...props }) => {\n if (process.env.NODE_ENV !== 'production' && typeof children !== 'string') {\n console.error(\n 'intlayer: <Markdown> component only accepts a single string as a child, received:',\n children\n );\n }\n\n return cloneElement(\n compiler(children, options),\n props as JSX.IntrinsicAttributes\n );\n};\n"],"mappings":";;;;;;;AAyHA,MAAM,kBAAmC;CACxB;CACf;CACA;CACA,iBAAiB,MAAM,UAAU;CAClC;;;;;AAMD,MAAa,mBACX,WAAmB,IACnB,UAAmC,EAAE,KACrB;CAChB,MAAM,EACJ,eAAe,qBACf,iBACA,uBACA,oBACA,YACA,aACA,cACA,qBACA,YACA,YACA,WACA,SACA,SACA,qBACA,cACE;AA2BJ,QAAOA,UAAY,UArB0B;EAC3C,SALc,sBACZ;GAAE,GAAG;GAAiB,eAAe;GAA4B,GACjE;EAIF;EACA;EACW;EACX;EACD,EAEwC;EACvC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAEiD;;AAIpD,MAAa,WAAW;AACxB,MAAa,UAAU;;;;AAKvB,MAAa,0BAKR,EAAE,WAAW,IAAI,SAAS,GAAG,YAAY;AAC5C,KAAI,QAAQ,IAAI,aAAa,gBAAgB,OAAO,aAAa,SAC/D,SAAQ,MACN,qFACA,SACD;AAGH,QAAO,aACL,SAAS,UAAU,QAAQ,EAC3B,MACD"}
|
package/dist/esm/plugins.mjs
CHANGED
|
@@ -112,7 +112,7 @@ const markdownStringPlugin = {
|
|
|
112
112
|
...rest,
|
|
113
113
|
children: /* @__PURE__ */ jsx(MarkdownRendererPlugin, {
|
|
114
114
|
...rest,
|
|
115
|
-
...components,
|
|
115
|
+
...components ?? {},
|
|
116
116
|
children: node
|
|
117
117
|
})
|
|
118
118
|
}),
|
|
@@ -147,7 +147,6 @@ const htmlPlugin = {
|
|
|
147
147
|
canHandle: (node) => typeof node === "object" && node?.nodeType === NodeType.HTML,
|
|
148
148
|
transform: (node, props) => {
|
|
149
149
|
const html = node[NodeType.HTML];
|
|
150
|
-
node.tags;
|
|
151
150
|
const { plugins, ...rest } = props;
|
|
152
151
|
const render = (userComponents) => createElement(HTMLRendererPlugin, {
|
|
153
152
|
...rest,
|
package/dist/esm/plugins.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"plugins.mjs","names":[],"sources":["../../src/plugins.tsx"],"sourcesContent":["import {\n type DeepTransformContent as DeepTransformContentCore,\n getMarkdownMetadata,\n type HTMLCond,\n type HTMLContent,\n type IInterpreterPluginState as IInterpreterPluginStateCore,\n type InsertionContent,\n type MarkdownContent,\n type Plugins,\n splitInsertionTemplate,\n} from '@intlayer/core';\nimport {\n type DeclaredLocales,\n type KeyPath,\n type LocalesValues,\n NodeType,\n} from '@intlayer/types';\nimport {\n type ComponentType,\n createElement,\n type ElementType,\n Fragment,\n type ReactElement,\n type ReactNode,\n} from 'react';\nimport { ContentSelectorRenderer } from './editor';\nimport { EditedContentRenderer } from './editor/useEditedContentRenderer';\nimport { HTMLRendererPlugin } from './html';\nimport type { ReactHTMLComponentMap } from './html/types';\nimport { type IntlayerNode, renderIntlayerNode } from './IntlayerNode';\nimport { MarkdownMetadataRenderer, MarkdownRendererPlugin } from './markdown';\nimport { renderReactElement } from './reactElement/renderReactElement';\n\n/** ---------------------------------------------\n * INTLAYER NODE PLUGIN\n * --------------------------------------------- */\n\nexport type IntlayerNodeCond<T> = T extends number | string\n ? IntlayerNode<T>\n : never;\n\n/** Translation plugin. Replaces node with a locale string if nodeType = Translation. */\nexport const intlayerNodePlugins: Plugins = {\n id: 'intlayer-node-plugin',\n canHandle: (node) =>\n typeof node === 'bigint' ||\n typeof node === 'string' ||\n typeof node === 'number',\n transform: (\n _node,\n {\n plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n ...rest\n }\n ) =>\n renderIntlayerNode({\n ...rest,\n value: rest.children,\n children: (\n <EditedContentRenderer {...rest}>{rest.children}</EditedContentRenderer>\n ),\n }),\n};\n\n/** ---------------------------------------------\n * REACT NODE PLUGIN\n * --------------------------------------------- */\n\nexport type ReactNodeCond<T> = T extends {\n props: any;\n key: any;\n}\n ? ReactNode\n : never;\n\n/** Translation plugin. Replaces node with a locale string if nodeType = Translation. */\nexport const reactNodePlugins: Plugins = {\n id: 'react-node-plugin',\n canHandle: (node) =>\n typeof node === 'object' &&\n typeof node?.props !== 'undefined' &&\n typeof node.key !== 'undefined',\n\n transform: (\n node,\n {\n plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n ...rest\n }\n ) =>\n renderIntlayerNode({\n ...rest,\n value: '[[react-element]]',\n children: (\n <ContentSelectorRenderer {...rest}>\n {renderReactElement(node)}\n </ContentSelectorRenderer>\n ),\n }),\n};\n\n/** ---------------------------------------------\n * INSERTION PLUGIN\n * --------------------------------------------- */\n\nexport type InsertionCond<T, S, L> = T extends {\n nodeType: NodeType | string;\n [NodeType.Insertion]: string;\n fields: readonly string[];\n}\n ? (\n values: {\n [K in T['fields'][number]]: ReactNode;\n }\n ) => ReactNode\n : never;\n\n/**\n * Split insertion string and join with React nodes using shared core logic\n */\nconst splitAndJoinInsertion = (\n template: string,\n values: Record<string, string | number | ReactNode>\n): ReactNode => {\n const result = splitInsertionTemplate(template, values);\n\n if (result.isSimple) {\n // Simple string replacement\n return result.parts as string;\n }\n\n // Return as Fragment with proper keys\n return createElement(\n Fragment,\n null,\n ...(result.parts as any[]).map((part, index) =>\n createElement(Fragment, { key: index }, part)\n )\n );\n};\n\n/** Insertion plugin for React. Handles component/node insertion. */\nexport const insertionPlugin: Plugins = {\n id: 'insertion-plugin',\n canHandle: (node) =>\n typeof node === 'object' && node?.nodeType === NodeType.Insertion,\n transform: (node: InsertionContent, props, deepTransformNode) => {\n const newKeyPath: KeyPath[] = [\n ...props.keyPath,\n {\n type: NodeType.Insertion,\n },\n ];\n\n const children = node[NodeType.Insertion];\n\n /** Insertion string plugin. Replaces string node with a component that render the insertion. */\n const insertionStringPlugin: Plugins = {\n id: 'insertion-string-plugin',\n canHandle: (node) => typeof node === 'string',\n transform: (node: string, subProps, deepTransformNode) => {\n const transformedResult = deepTransformNode(node, {\n ...subProps,\n children: node,\n plugins: [\n ...(props.plugins ?? ([] as Plugins[])).filter(\n (plugin) => plugin.id !== 'intlayer-node-plugin'\n ),\n ],\n });\n\n return (\n values: {\n [K in InsertionContent['fields'][number]]:\n | string\n | number\n | ReactNode;\n }\n ) => {\n const result = splitAndJoinInsertion(transformedResult, values);\n\n return deepTransformNode(result, {\n ...subProps,\n plugins: props.plugins,\n children: result,\n });\n };\n },\n };\n\n return deepTransformNode(children, {\n ...props,\n children,\n keyPath: newKeyPath,\n plugins: [insertionStringPlugin, ...(props.plugins ?? [])],\n });\n },\n};\n\n/**\n * MARKDOWN PLUGIN\n */\n\nexport type MarkdownStringCond<T> = T extends string\n ? IntlayerNode<\n string,\n { metadata: DeepTransformContent<string>; use: (components: any) => any }\n >\n : never;\n\n/** Markdown string plugin. Replaces string node with a component that render the markdown. */\nexport const markdownStringPlugin: Plugins = {\n id: 'markdown-string-plugin',\n canHandle: (node) => typeof node === 'string',\n transform: (node: string, props, deepTransformNode) => {\n const {\n plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n ...rest\n } = props;\n\n const metadata = getMarkdownMetadata(node);\n\n const metadataPlugins: Plugins = {\n id: 'markdown-metadata-plugin',\n canHandle: (metadataNode) =>\n typeof metadataNode === 'string' ||\n typeof metadataNode === 'number' ||\n typeof metadataNode === 'boolean' ||\n !metadataNode,\n transform: (metadataNode, props) =>\n renderIntlayerNode({\n ...props,\n value: metadataNode,\n children: (\n <ContentSelectorRenderer {...rest}>\n <MarkdownMetadataRenderer\n {...rest}\n metadataKeyPath={props.keyPath}\n >\n {node}\n </MarkdownMetadataRenderer>\n </ContentSelectorRenderer>\n ),\n }),\n };\n\n // Transform metadata while keeping the same structure\n const metadataNodes = deepTransformNode(metadata, {\n plugins: [metadataPlugins],\n dictionaryKey: rest.dictionaryKey,\n keyPath: [],\n });\n\n const render = (components?: any) =>\n renderIntlayerNode({\n ...props,\n value: node,\n children: (\n <ContentSelectorRenderer {...rest}>\n <MarkdownRendererPlugin {...rest} {...components}>\n {node}\n </MarkdownRendererPlugin>\n </ContentSelectorRenderer>\n ),\n additionalProps: {\n metadata: metadataNodes,\n },\n });\n\n const element = render() as ReactElement;\n\n return new Proxy(element, {\n get(target, prop, receiver) {\n if (prop === 'value') {\n return node;\n }\n if (prop === 'metadata') {\n return metadataNodes;\n }\n\n if (prop === 'use') {\n return (components?: any) => render(components);\n }\n\n return Reflect.get(target, prop, receiver);\n },\n }) as any;\n },\n};\n\ntype MarkdownComponentMap = Record<string, ComponentType<any> | ElementType>;\n\nexport type MarkdownCond<T, S, L extends LocalesValues> = T extends {\n nodeType: NodeType | string;\n [NodeType.Markdown]: infer M;\n metadata?: infer U;\n}\n ? {\n use: (components?: MarkdownComponentMap) => ReactNode;\n metadata: DeepTransformContent<U, L>;\n } & any\n : never;\n\nexport const markdownPlugin: Plugins = {\n id: 'markdown-plugin',\n canHandle: (node) =>\n typeof node === 'object' && node?.nodeType === NodeType.Markdown,\n transform: (node: MarkdownContent, props, deepTransformNode) => {\n const newKeyPath: KeyPath[] = [\n ...props.keyPath,\n {\n type: NodeType.Markdown,\n },\n ];\n\n const children = node[NodeType.Markdown];\n\n return deepTransformNode(children, {\n ...props,\n children,\n keyPath: newKeyPath,\n plugins: [markdownStringPlugin, ...(props.plugins ?? [])],\n });\n },\n};\n\n/** ---------------------------------------------\n * HTML PLUGIN\n * --------------------------------------------- */\n\nexport type HTMLPluginCond<T, S, L> = HTMLCond<T, S, L>;\n\n/** HTML plugin. Replaces node with a function that takes components => ReactNode. */\nexport const htmlPlugin: Plugins = {\n id: 'html-plugin',\n canHandle: (node) =>\n typeof node === 'object' && node?.nodeType === NodeType.HTML,\n\n transform: (node: HTMLContent<string>, props) => {\n const html = node[NodeType.HTML];\n const tags = node.tags ?? [];\n const { plugins, ...rest } = props;\n\n // Type-safe render function that accepts properly typed components\n const render = <\n T = typeof tags extends readonly (infer U extends string)[]\n ? U\n : typeof tags,\n >(\n userComponents?: ReactHTMLComponentMap<T>\n ): ReactNode =>\n createElement(HTMLRendererPlugin, { ...rest, html, userComponents });\n\n const element = render() as ReactElement;\n\n return new Proxy(element, {\n get(target, prop, receiver) {\n if (prop === 'value') {\n return html;\n }\n\n if (prop === 'use') {\n // Return a properly typed function based on custom components\n return <\n T = typeof tags extends readonly (infer U extends string)[]\n ? U\n : typeof tags,\n >(\n userComponents?: ReactHTMLComponentMap<T>\n ) => render(userComponents);\n }\n\n return Reflect.get(target, prop, receiver);\n },\n }) as any;\n },\n};\n\n/** ---------------------------------------------\n * PLUGINS RESULT\n * --------------------------------------------- */\n\nexport interface IInterpreterPluginReact<T, S, L extends LocalesValues> {\n reactNode: ReactNodeCond<T>;\n reactIntlayerNode: IntlayerNodeCond<T>;\n reactInsertion: InsertionCond<T, S, L>;\n reactMarkdown: MarkdownCond<T, S, L>;\n reactHtml: HTMLPluginCond<T, S, L>;\n}\n\n/**\n * Insert this type as param of `DeepTransformContent` to avoid `intlayer` package pollution.\n *\n * Otherwise the the `react-intlayer` plugins will override the types of `intlayer` functions.\n */\nexport type IInterpreterPluginState = IInterpreterPluginStateCore & {\n reactNode: true;\n reactIntlayerNode: true;\n reactInsertion: true;\n reactMarkdown: true;\n reactHtml: true;\n};\n\nexport type DeepTransformContent<\n T,\n L extends LocalesValues = DeclaredLocales,\n> = DeepTransformContentCore<T, IInterpreterPluginState, L>;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"plugins.mjs","names":[],"sources":["../../src/plugins.tsx"],"sourcesContent":["import {\n type DeepTransformContent as DeepTransformContentCore,\n getMarkdownMetadata,\n type HTMLContent,\n type IInterpreterPluginState as IInterpreterPluginStateCore,\n type InsertionContent,\n type MarkdownContent,\n type Plugins,\n splitInsertionTemplate,\n} from '@intlayer/core';\nimport {\n type DeclaredLocales,\n type KeyPath,\n type LocalesValues,\n NodeType,\n} from '@intlayer/types';\nimport {\n createElement,\n Fragment,\n type ReactElement,\n type ReactNode,\n} from 'react';\nimport { ContentSelectorRenderer } from './editor';\nimport { EditedContentRenderer } from './editor/useEditedContentRenderer';\nimport { HTMLRendererPlugin } from './html';\nimport { type IntlayerNode, renderIntlayerNode } from './IntlayerNode';\nimport { MarkdownMetadataRenderer, MarkdownRendererPlugin } from './markdown';\nimport { renderReactElement } from './reactElement/renderReactElement';\nimport type { HTMLComponents } from './utils/HTMLComponentTypes';\n\n/** ---------------------------------------------\n * INTLAYER NODE PLUGIN\n * --------------------------------------------- */\n\nexport type IntlayerNodeCond<T> = T extends number | string\n ? IntlayerNode<T>\n : never;\n\n/** Translation plugin. Replaces node with a locale string if nodeType = Translation. */\nexport const intlayerNodePlugins: Plugins = {\n id: 'intlayer-node-plugin',\n canHandle: (node) =>\n typeof node === 'bigint' ||\n typeof node === 'string' ||\n typeof node === 'number',\n transform: (\n _node,\n {\n plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n ...rest\n }\n ) =>\n renderIntlayerNode({\n ...rest,\n value: rest.children,\n children: (\n <EditedContentRenderer {...rest}>{rest.children}</EditedContentRenderer>\n ),\n }),\n};\n\n/** ---------------------------------------------\n * REACT NODE PLUGIN\n * --------------------------------------------- */\n\nexport type ReactNodeCond<T> = T extends {\n props: any;\n key: any;\n}\n ? ReactNode\n : never;\n\n/** Translation plugin. Replaces node with a locale string if nodeType = Translation. */\nexport const reactNodePlugins: Plugins = {\n id: 'react-node-plugin',\n canHandle: (node) =>\n typeof node === 'object' &&\n typeof node?.props !== 'undefined' &&\n typeof node.key !== 'undefined',\n\n transform: (\n node,\n {\n plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n ...rest\n }\n ) =>\n renderIntlayerNode({\n ...rest,\n value: '[[react-element]]',\n children: (\n <ContentSelectorRenderer {...rest}>\n {renderReactElement(node)}\n </ContentSelectorRenderer>\n ),\n }),\n};\n\n/** ---------------------------------------------\n * INSERTION PLUGIN\n * --------------------------------------------- */\n\nexport type InsertionCond<T> = T extends {\n nodeType: NodeType | string;\n [NodeType.Insertion]: string;\n fields: readonly string[];\n}\n ? (\n values: {\n [K in T['fields'][number]]: ReactNode;\n }\n ) => ReactNode\n : never;\n\n/**\n * Split insertion string and join with React nodes using shared core logic\n */\nconst splitAndJoinInsertion = (\n template: string,\n values: Record<string, string | number | ReactNode>\n): ReactNode => {\n const result = splitInsertionTemplate(template, values);\n\n if (result.isSimple) {\n // Simple string replacement\n return result.parts as string;\n }\n\n // Return as Fragment with proper keys\n return createElement(\n Fragment,\n null,\n ...(result.parts as any[]).map((part, index) =>\n createElement(Fragment, { key: index }, part)\n )\n );\n};\n\n/** Insertion plugin for React. Handles component/node insertion. */\nexport const insertionPlugin: Plugins = {\n id: 'insertion-plugin',\n canHandle: (node) =>\n typeof node === 'object' && node?.nodeType === NodeType.Insertion,\n transform: (node: InsertionContent, props, deepTransformNode) => {\n const newKeyPath: KeyPath[] = [\n ...props.keyPath,\n {\n type: NodeType.Insertion,\n },\n ];\n\n const children = node[NodeType.Insertion];\n\n /** Insertion string plugin. Replaces string node with a component that render the insertion. */\n const insertionStringPlugin: Plugins = {\n id: 'insertion-string-plugin',\n canHandle: (node) => typeof node === 'string',\n transform: (node: string, subProps, deepTransformNode) => {\n const transformedResult = deepTransformNode(node, {\n ...subProps,\n children: node,\n plugins: [\n ...(props.plugins ?? ([] as Plugins[])).filter(\n (plugin) => plugin.id !== 'intlayer-node-plugin'\n ),\n ],\n });\n\n return (\n values: {\n [K in InsertionContent['fields'][number]]:\n | string\n | number\n | ReactNode;\n }\n ) => {\n const result = splitAndJoinInsertion(transformedResult, values);\n\n return deepTransformNode(result, {\n ...subProps,\n plugins: props.plugins,\n children: result,\n });\n };\n },\n };\n\n return deepTransformNode(children, {\n ...props,\n children,\n keyPath: newKeyPath,\n plugins: [insertionStringPlugin, ...(props.plugins ?? [])],\n });\n },\n};\n\n/**\n * MARKDOWN PLUGIN\n */\n\nexport type MarkdownStringCond<T> = T extends string\n ? IntlayerNode<\n string,\n {\n metadata: DeepTransformContent<string>;\n use: (components: HTMLComponents<'permissive', {}>) => ReactNode;\n }\n >\n : never;\n\n/** Markdown string plugin. Replaces string node with a component that render the markdown. */\nexport const markdownStringPlugin: Plugins = {\n id: 'markdown-string-plugin',\n canHandle: (node) => typeof node === 'string',\n transform: (node: string, props, deepTransformNode) => {\n const {\n plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n ...rest\n } = props;\n\n const metadata = getMarkdownMetadata(node);\n\n const metadataPlugins: Plugins = {\n id: 'markdown-metadata-plugin',\n canHandle: (metadataNode) =>\n typeof metadataNode === 'string' ||\n typeof metadataNode === 'number' ||\n typeof metadataNode === 'boolean' ||\n !metadataNode,\n transform: (metadataNode, props) =>\n renderIntlayerNode({\n ...props,\n value: metadataNode,\n children: (\n <ContentSelectorRenderer {...rest}>\n <MarkdownMetadataRenderer\n {...rest}\n metadataKeyPath={props.keyPath}\n >\n {node}\n </MarkdownMetadataRenderer>\n </ContentSelectorRenderer>\n ),\n }),\n };\n\n // Transform metadata while keeping the same structure\n const metadataNodes = deepTransformNode(metadata, {\n plugins: [metadataPlugins],\n dictionaryKey: rest.dictionaryKey,\n keyPath: [],\n });\n\n const render = (components?: HTMLComponents) =>\n renderIntlayerNode({\n ...props,\n value: node,\n children: (\n <ContentSelectorRenderer {...rest}>\n <MarkdownRendererPlugin {...rest} {...(components ?? {})}>\n {node}\n </MarkdownRendererPlugin>\n </ContentSelectorRenderer>\n ),\n additionalProps: {\n metadata: metadataNodes,\n },\n });\n\n const element = render() as ReactElement;\n\n return new Proxy(element, {\n get(target, prop, receiver) {\n if (prop === 'value') {\n return node;\n }\n if (prop === 'metadata') {\n return metadataNodes;\n }\n\n if (prop === 'use') {\n return (components?: HTMLComponents) => render(components);\n }\n\n return Reflect.get(target, prop, receiver);\n },\n }) as any;\n },\n};\n\nexport type MarkdownCond<T> = T extends {\n nodeType: NodeType | string;\n [NodeType.Markdown]: infer M;\n metadata?: infer U;\n tags?: infer U;\n}\n ? {\n use: (components?: HTMLComponents<'permissive', U>) => IntlayerNode<M>;\n metadata: DeepTransformContent<U>;\n }\n : never;\n\nexport const markdownPlugin: Plugins = {\n id: 'markdown-plugin',\n canHandle: (node) =>\n typeof node === 'object' && node?.nodeType === NodeType.Markdown,\n transform: (node: MarkdownContent, props, deepTransformNode) => {\n const newKeyPath: KeyPath[] = [\n ...props.keyPath,\n {\n type: NodeType.Markdown,\n },\n ];\n\n const children = node[NodeType.Markdown];\n\n return deepTransformNode(children, {\n ...props,\n children,\n keyPath: newKeyPath,\n plugins: [markdownStringPlugin, ...(props.plugins ?? [])],\n });\n },\n};\n\n/** ---------------------------------------------\n * HTML PLUGIN\n * --------------------------------------------- */\n\n/**\n * HTML conditional type that enforces:\n * - All components (Standard or Custom) are OPTIONAL in the `use()` method.\n * - Custom components props are strictly inferred from the dictionary definition.\n *\n * This ensures type safety:\n * - `html('<div>Hello <CustomComponent /></div>').use({ CustomComponent: ... })` - optional but typed\n */\nexport type HTMLPluginCond<T> = T extends {\n nodeType: NodeType | string;\n [NodeType.HTML]: infer I;\n tags?: infer U;\n}\n ? {\n use: (components?: HTMLComponents<'permissive', U>) => IntlayerNode<I>;\n }\n : never;\n\n/** HTML plugin. Replaces node with a function that takes components => ReactNode. */\nexport const htmlPlugin: Plugins = {\n id: 'html-plugin',\n canHandle: (node) =>\n typeof node === 'object' && node?.nodeType === NodeType.HTML,\n\n transform: (node: HTMLContent<string>, props) => {\n const html = node[NodeType.HTML];\n const { plugins, ...rest } = props;\n\n // Type-safe render function that accepts properly typed components\n const render = (userComponents?: HTMLComponents): ReactNode =>\n createElement(HTMLRendererPlugin, { ...rest, html, userComponents });\n\n const element = render() as ReactElement;\n\n return new Proxy(element, {\n get(target, prop, receiver) {\n if (prop === 'value') {\n return html;\n }\n\n if (prop === 'use') {\n // Return a properly typed function based on custom components\n return (userComponents?: HTMLComponents) => render(userComponents);\n }\n\n return Reflect.get(target, prop, receiver);\n },\n }) as any;\n },\n};\n\n/** ---------------------------------------------\n * PLUGINS RESULT\n * --------------------------------------------- */\n\nexport type IInterpreterPluginReact<T, _S, _L extends LocalesValues> = {\n reactNode: ReactNodeCond<T>;\n reactIntlayerNode: IntlayerNodeCond<T>;\n reactInsertion: InsertionCond<T>;\n reactMarkdown: MarkdownCond<T>;\n reactHtml: HTMLPluginCond<T>;\n};\n\n/**\n * Insert this type as param of `DeepTransformContent` to avoid `intlayer` package pollution.\n *\n * Otherwise the the `react-intlayer` plugins will override the types of `intlayer` functions.\n */\nexport type IInterpreterPluginState = IInterpreterPluginStateCore & {\n reactNode: true;\n reactIntlayerNode: true;\n reactInsertion: true;\n reactMarkdown: true;\n reactHtml: true;\n};\n\nexport type DeepTransformContent<\n T,\n L extends LocalesValues = DeclaredLocales,\n> = DeepTransformContentCore<T, IInterpreterPluginState, L>;\n"],"mappings":"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"}
|
|
@@ -2,18 +2,20 @@ import { createElement } from "react";
|
|
|
2
2
|
|
|
3
3
|
//#region src/reactElement/renderReactElement.ts
|
|
4
4
|
const renderReactElement = (element) => {
|
|
5
|
-
if (typeof element
|
|
5
|
+
if (element === null || typeof element !== "object") return element;
|
|
6
6
|
const convertChildrenAsArray = (element) => {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
const
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
7
|
+
const children = element.props?.children;
|
|
8
|
+
if (Array.isArray(children)) {
|
|
9
|
+
const childrenResult = children.map((child, index) => {
|
|
10
|
+
const renderedChild = renderReactElement(child);
|
|
11
|
+
if (typeof renderedChild === "object" && renderedChild !== null && "type" in renderedChild) {
|
|
12
|
+
const childElement = renderedChild;
|
|
13
|
+
return createElement(childElement.type, {
|
|
14
|
+
...childElement.props,
|
|
15
|
+
key: index
|
|
16
|
+
}, ...Array.isArray(childElement.props?.children) ? childElement.props.children : typeof childElement.props?.children !== "undefined" ? [childElement.props.children] : []);
|
|
17
|
+
}
|
|
18
|
+
return renderedChild;
|
|
17
19
|
});
|
|
18
20
|
return {
|
|
19
21
|
...element,
|
|
@@ -22,12 +24,21 @@ const renderReactElement = (element) => {
|
|
|
22
24
|
children: childrenResult
|
|
23
25
|
}
|
|
24
26
|
};
|
|
27
|
+
} else if (typeof children !== "undefined" && children !== null) {
|
|
28
|
+
const renderedChild = renderReactElement(children);
|
|
29
|
+
return {
|
|
30
|
+
...element,
|
|
31
|
+
props: {
|
|
32
|
+
...element.props,
|
|
33
|
+
children: [renderedChild]
|
|
34
|
+
}
|
|
35
|
+
};
|
|
25
36
|
}
|
|
26
37
|
return {
|
|
27
38
|
...element,
|
|
28
39
|
props: {
|
|
29
40
|
...element.props,
|
|
30
|
-
children:
|
|
41
|
+
children: []
|
|
31
42
|
}
|
|
32
43
|
};
|
|
33
44
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderReactElement.mjs","names":[],"sources":["../../../src/reactElement/renderReactElement.ts"],"sourcesContent":["import { createElement, type ReactElement, type ReactNode } from 'react';\n\n// This function recursively creates React elements from a given JSON-like structure\nexport const renderReactElement = (element: ReactElement<any>) => {\n if (typeof element
|
|
1
|
+
{"version":3,"file":"renderReactElement.mjs","names":[],"sources":["../../../src/reactElement/renderReactElement.ts"],"sourcesContent":["import { createElement, type ReactElement, type ReactNode } from 'react';\n\n// This function recursively creates React elements from a given JSON-like structure\nexport const renderReactElement = (element: ReactElement<any>): any => {\n if (element === null || typeof element !== 'object') {\n return element;\n }\n\n const convertChildrenAsArray = (\n element: ReactElement<{ children?: ReactNode }>\n ): ReactElement<{ children?: ReactNode }> => {\n const children = element.props?.children;\n\n if (Array.isArray(children)) {\n const childrenResult: ReactNode[] = children.map((child, index) => {\n const renderedChild = renderReactElement(child as ReactElement<any>);\n\n if (\n typeof renderedChild === 'object' &&\n renderedChild !== null &&\n 'type' in renderedChild\n ) {\n const childElement = renderedChild as ReactElement<any>;\n return createElement(\n childElement.type,\n { ...childElement.props, key: index },\n ...(Array.isArray(childElement.props?.children)\n ? childElement.props.children\n : typeof childElement.props?.children !== 'undefined'\n ? [childElement.props.children]\n : [])\n );\n }\n return renderedChild;\n });\n\n return {\n ...element,\n props: { ...element.props, children: childrenResult },\n };\n } else if (typeof children !== 'undefined' && children !== null) {\n const renderedChild = renderReactElement(children as ReactElement<any>);\n return {\n ...element,\n props: { ...element.props, children: [renderedChild] },\n };\n }\n\n return {\n ...element,\n props: { ...element.props, children: [] },\n };\n };\n\n const fixedElement = convertChildrenAsArray(\n element as ReactElement<{ children?: ReactNode }>\n );\n\n const { type, props } = fixedElement;\n\n // Create and return the React element\n return createElement(\n type ?? 'span',\n props,\n ...(props.children as ReactNode[])\n );\n};\n"],"mappings":";;;AAGA,MAAa,sBAAsB,YAAoC;AACrE,KAAI,YAAY,QAAQ,OAAO,YAAY,SACzC,QAAO;CAGT,MAAM,0BACJ,YAC2C;EAC3C,MAAM,WAAW,QAAQ,OAAO;AAEhC,MAAI,MAAM,QAAQ,SAAS,EAAE;GAC3B,MAAM,iBAA8B,SAAS,KAAK,OAAO,UAAU;IACjE,MAAM,gBAAgB,mBAAmB,MAA2B;AAEpE,QACE,OAAO,kBAAkB,YACzB,kBAAkB,QAClB,UAAU,eACV;KACA,MAAM,eAAe;AACrB,YAAO,cACL,aAAa,MACb;MAAE,GAAG,aAAa;MAAO,KAAK;MAAO,EACrC,GAAI,MAAM,QAAQ,aAAa,OAAO,SAAS,GAC3C,aAAa,MAAM,WACnB,OAAO,aAAa,OAAO,aAAa,cACtC,CAAC,aAAa,MAAM,SAAS,GAC7B,EAAE,CACT;;AAEH,WAAO;KACP;AAEF,UAAO;IACL,GAAG;IACH,OAAO;KAAE,GAAG,QAAQ;KAAO,UAAU;KAAgB;IACtD;aACQ,OAAO,aAAa,eAAe,aAAa,MAAM;GAC/D,MAAM,gBAAgB,mBAAmB,SAA8B;AACvE,UAAO;IACL,GAAG;IACH,OAAO;KAAE,GAAG,QAAQ;KAAO,UAAU,CAAC,cAAc;KAAE;IACvD;;AAGH,SAAO;GACL,GAAG;GACH,OAAO;IAAE,GAAG,QAAQ;IAAO,UAAU,EAAE;IAAE;GAC1C;;CAOH,MAAM,EAAE,MAAM,UAJO,uBACnB,QACD;AAKD,QAAO,cACL,QAAQ,QACR,OACA,GAAI,MAAM,SACX"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as _intlayer_types13 from "@intlayer/types";
|
|
2
2
|
|
|
3
3
|
//#region src/client/format/useCompact.d.ts
|
|
4
4
|
/**
|
|
@@ -12,7 +12,7 @@ import * as _intlayer_types10 from "@intlayer/types";
|
|
|
12
12
|
* ```
|
|
13
13
|
*/
|
|
14
14
|
declare const useCompact: () => (value: string | number, options?: Intl.NumberFormatOptions & {
|
|
15
|
-
locale?:
|
|
15
|
+
locale?: _intlayer_types13.LocalesValues;
|
|
16
16
|
}) => string;
|
|
17
17
|
//#endregion
|
|
18
18
|
export { useCompact };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as _intlayer_types14 from "@intlayer/types";
|
|
2
2
|
|
|
3
3
|
//#region src/client/format/useCurrency.d.ts
|
|
4
4
|
/**
|
|
@@ -26,7 +26,7 @@ import * as _intlayer_types12 from "@intlayer/types";
|
|
|
26
26
|
* ```
|
|
27
27
|
*/
|
|
28
28
|
declare const useCurrency: () => (value: string | number, options?: Intl.NumberFormatOptions & {
|
|
29
|
-
locale?:
|
|
29
|
+
locale?: _intlayer_types14.LocalesValues;
|
|
30
30
|
}) => string;
|
|
31
31
|
//#endregion
|
|
32
32
|
export { useCurrency };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as _intlayer_types9 from "@intlayer/types";
|
|
2
2
|
|
|
3
3
|
//#region src/client/format/useList.d.ts
|
|
4
4
|
/**
|
|
@@ -23,7 +23,7 @@ import * as _intlayer_types11 from "@intlayer/types";
|
|
|
23
23
|
* ```
|
|
24
24
|
*/
|
|
25
25
|
declare const useList: () => (values: (string | number)[], options?: Intl.ListFormatOptions & {
|
|
26
|
-
locale?:
|
|
26
|
+
locale?: _intlayer_types9.LocalesValues;
|
|
27
27
|
}) => string;
|
|
28
28
|
//#endregion
|
|
29
29
|
export { useList };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useList.d.ts","names":[],"sources":["../../../../src/client/format/useList.ts"],"mappings":";;;;;;AA2BA;;;;;;;;;;;;;;;;;;cAAa,OAAA,SAAO,MAAA,uBAAA,OAAA,GAAA,IAAA,CAAA,iBAAA;WAAA,
|
|
1
|
+
{"version":3,"file":"useList.d.ts","names":[],"sources":["../../../../src/client/format/useList.ts"],"mappings":";;;;;;AA2BA;;;;;;;;;;;;;;;;;;cAAa,OAAA,SAAO,MAAA,uBAAA,OAAA,GAAA,IAAA,CAAA,iBAAA;WAAA,gBAAA,CAAA,aAAA;AAAA"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as _intlayer_types11 from "@intlayer/types";
|
|
2
2
|
|
|
3
3
|
//#region src/client/format/useNumber.d.ts
|
|
4
4
|
/**
|
|
@@ -24,7 +24,7 @@ import * as _intlayer_types13 from "@intlayer/types";
|
|
|
24
24
|
* A number formatting function bound to the active locale.
|
|
25
25
|
*/
|
|
26
26
|
declare const useNumber: () => (value: string | number, options?: Intl.NumberFormatOptions & {
|
|
27
|
-
locale?:
|
|
27
|
+
locale?: _intlayer_types11.LocalesValues;
|
|
28
28
|
}) => string;
|
|
29
29
|
//#endregion
|
|
30
30
|
export { useNumber };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as _intlayer_types10 from "@intlayer/types";
|
|
2
2
|
|
|
3
3
|
//#region src/client/format/useRelativeTime.d.ts
|
|
4
4
|
/**
|
|
@@ -20,7 +20,7 @@ import * as _intlayer_types14 from "@intlayer/types";
|
|
|
20
20
|
* bound to the current client locale.
|
|
21
21
|
*/
|
|
22
22
|
declare const useRelativeTime: () => (from: string | number | Date, to?: string | number | Date, options?: Intl.RelativeTimeFormatOptions & {
|
|
23
|
-
locale?:
|
|
23
|
+
locale?: _intlayer_types10.LocalesValues;
|
|
24
24
|
unit?: Intl.RelativeTimeFormatUnit;
|
|
25
25
|
}) => string;
|
|
26
26
|
//#endregion
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as _intlayer_types12 from "@intlayer/types";
|
|
2
2
|
|
|
3
3
|
//#region src/client/format/useUnit.d.ts
|
|
4
4
|
/**
|
|
@@ -19,7 +19,7 @@ import * as _intlayer_types0 from "@intlayer/types";
|
|
|
19
19
|
* @returns {Function} A unit formatting function that accepts a value and optional formatting options.
|
|
20
20
|
*/
|
|
21
21
|
declare const useUnit: () => (value: string | number, options?: Intl.NumberFormatOptions & {
|
|
22
|
-
locale?:
|
|
22
|
+
locale?: _intlayer_types12.LocalesValues;
|
|
23
23
|
}) => string;
|
|
24
24
|
//#endregion
|
|
25
25
|
export { useUnit };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useUnit.d.ts","names":[],"sources":["../../../../src/client/format/useUnit.ts"],"mappings":";;;;;;AAuBA;;;;;;;;;;;;;;cAAa,OAAA,SAAO,KAAA,mBAAA,OAAA,GAAA,IAAA,CAAA,mBAAA;WAAA,
|
|
1
|
+
{"version":3,"file":"useUnit.d.ts","names":[],"sources":["../../../../src/client/format/useUnit.ts"],"mappings":";;;;;;AAuBA;;;;;;;;;;;;;;cAAa,OAAA,SAAO,KAAA,mBAAA,OAAA,GAAA,IAAA,CAAA,mBAAA;WAAA,iBAAA,CAAA,aAAA;AAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { IInterpreterPluginState as IInterpreterPluginState$1 } from "../plugins.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as _intlayer_core1 from "@intlayer/core";
|
|
3
3
|
import { Dictionary, DictionaryKeys, LocalesValues, StrictModeLocaleMap } from "@intlayer/types";
|
|
4
4
|
|
|
5
5
|
//#region src/client/useDictionaryDynamic.d.ts
|
|
@@ -8,7 +8,7 @@ import { Dictionary, DictionaryKeys, LocalesValues, StrictModeLocaleMap } from "
|
|
|
8
8
|
*
|
|
9
9
|
* If the locale is not provided, it will use the locale from the client context
|
|
10
10
|
*/
|
|
11
|
-
declare const useDictionaryDynamic: <T extends Dictionary, K extends DictionaryKeys>(dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>, key: K, locale?: LocalesValues) =>
|
|
11
|
+
declare const useDictionaryDynamic: <T extends Dictionary, K extends DictionaryKeys>(dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>, key: K, locale?: LocalesValues) => _intlayer_core1.DeepTransformContent<T["content"], IInterpreterPluginState$1, "af" | "af-ZA" | "ar" | "ar-AE" | "ar-BH" | "ar-DZ" | "ar-EG" | "ar-IQ" | "ar-JO" | "ar-KW" | "ar-LB" | "ar-LY" | "ar-MA" | "ar-OM" | "ar-QA" | "ar-SA" | "ar-SY" | "ar-TN" | "ar-YE" | "az" | "az-AZ" | "be" | "be-BY" | "bg" | "bg-BG" | "bs" | "bs-BA" | "ca" | "ca-ES" | "cs" | "cs-CZ" | "cy" | "cy-GB" | "da" | "da-DK" | "de" | "de-AT" | "de-CH" | "de-DE" | "de-LI" | "de-LU" | "dv" | "dv-MV" | "el" | "el-GR" | "en" | "en-AU" | "en-BZ" | "en-CA" | "en-CB" | "en-GB" | "en-IE" | "en-JM" | "en-NZ" | "en-PH" | "en-TT" | "en-US" | "en-ZA" | "en-ZW" | "eo" | "es" | "es-AR" | "es-BO" | "es-CL" | "es-CO" | "es-CR" | "es-DO" | "es-EC" | "es-ES" | "es-GT" | "es-HN" | "es-MX" | "es-NI" | "es-PA" | "es-PE" | "es-PR" | "es-PY" | "es-SV" | "es-UY" | "es-VE" | "et" | "et-EE" | "eu" | "eu-ES" | "fa" | "fa-IR" | "fi" | "fi-FI" | "fo" | "fo-FO" | "fr" | "fr-BE" | "fr-CA" | "fr-CH" | "fr-FR" | "fr-LU" | "fr-MC" | "ga" | "ga-IE" | "gd" | "gd-GB" | "gl" | "gl-ES" | "gu" | "gu-IN" | "he" | "he-IL" | "hi" | "hi-IN" | "hr" | "hr-BA" | "hr-HR" | "hu" | "hu-HU" | "hy" | "hy-AM" | "id" | "id-ID" | "is" | "is-IS" | "it" | "it-CH" | "it-IT" | "ja" | "ja-JP" | "ka" | "ka-GE" | "kk" | "kk-KZ" | "kn" | "kn-IN" | "ko" | "ko-KR" | "kok" | "kok-IN" | "ku" | "ku-TR" | "ky" | "ky-KG" | "lt" | "lt-LT" | "lv" | "lv-LV" | "mi" | "mi-NZ" | "mk" | "mk-MK" | "mn" | "mn-MN" | "mr" | "mr-IN" | "ms" | "ms-BN" | "ms-MY" | "mt" | "mt-MT" | "ml" | "ml-IN" | "no" | "nb" | "nb-NO" | "nl" | "nl-BE" | "nl-NL" | "nn" | "nn-NO" | "ns" | "ns-ZA" | "pa" | "pa-IN" | "pl" | "pl-PL" | "ps" | "ps-AR" | "pt" | "pt-BR" | "pt-PT" | "qu" | "qu-BO" | "qu-EC" | "qu-PE" | "ro" | "ro-RO" | "ro-MD" | "rm" | "rm-CH" | "ru" | "ru-RU" | "ru-MD" | "sa" | "sa-IN" | "se" | "se-FI" | "se-NO" | "se-SE" | "hsb" | "hsb-DE" | "dsb" | "dsb-DE" | "sk" | "sk-SK" | "sl" | "sl-SI" | "sq" | "sq-AL" | "sr" | "sr-BA" | "sr-SP" | "sv" | "sv-FI" | "sv-SE" | "sw" | "sw-KE" | "syr" | "syr-SY" | "ta" | "ta-IN" | "te" | "te-IN" | "th" | "th-TH" | "tl" | "tl-PH" | "tn" | "tn-ZA" | "tr" | "tr-TR" | "tt" | "tt-RU" | "ts" | "uk" | "uk-UA" | "ur" | "ur-PK" | "uz" | "uz-UZ" | "vi" | "vi-VN" | "ve" | "ve-ZA" | "xh" | "xh-ZA" | "zh" | "zh-Hans" | "zh-CN" | "zh-HK" | "zh-MO" | "zh-SG" | "zh-Hant" | "zu" | "zu-ZA" | "bn" | "bn-BD" | "bn-IN" | "bn-MM" | "my" | "my-MM" | "km" | "km-KH" | "lo" | "lo-LA" | "yo" | "yo-NG" | "yi" | "yi-001" | "am" | "am-ET" | "ne" | "ne-NP" | "si" | "si-LK" | "sr-Cyrl" | "sr-RS" | "en-IN" | "en-SG" | "en-HK" | "en-NG" | "en-PK" | "en-MY" | "en-BW" | "en-KE" | "en-TZ" | "en-GH" | "en-UG" | "es-CU" | "es-US" | "pt-GW" | "pt-MZ" | "pt-ST" | "pt-CV" | "pt-TL" | "pt-MO" | "zh-TW" | "ar-MR" | "ar-PS" | "ar-SD" | "ar-DJ" | "ar-SO" | "ar-TD" | "ar-KM" | (string & {})>;
|
|
12
12
|
//#endregion
|
|
13
13
|
export { useDictionaryDynamic };
|
|
14
14
|
//# sourceMappingURL=useDictionaryDynamic.d.ts.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { IInterpreterPluginState as IInterpreterPluginState$1 } from "../plugins.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as _intlayer_core0 from "@intlayer/core";
|
|
3
3
|
import * as _intlayer_types0 from "@intlayer/types";
|
|
4
4
|
import { DeclaredLocales, DictionaryKeys, LocalesValues } from "@intlayer/types";
|
|
5
5
|
|
|
@@ -24,7 +24,7 @@ import { DeclaredLocales, DictionaryKeys, LocalesValues } from "@intlayer/types"
|
|
|
24
24
|
* };
|
|
25
25
|
* ```
|
|
26
26
|
*/
|
|
27
|
-
declare const useIntlayer: <T extends DictionaryKeys, L extends LocalesValues = DeclaredLocales>(key: T, locale?: L) =>
|
|
27
|
+
declare const useIntlayer: <T extends DictionaryKeys, L extends LocalesValues = DeclaredLocales>(key: T, locale?: L) => _intlayer_core0.DeepTransformContent<_intlayer_types0.DictionaryRegistryContent<T>, IInterpreterPluginState$1, L>;
|
|
28
28
|
//#endregion
|
|
29
29
|
export { useIntlayer };
|
|
30
30
|
//# sourceMappingURL=useIntlayer.d.ts.map
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as _intlayer_types0 from "@intlayer/types";
|
|
2
2
|
|
|
3
3
|
//#region src/client/useLocaleBase.d.ts
|
|
4
4
|
/**
|
|
5
5
|
* On the client side, hook to get the current locale and all related fields
|
|
6
6
|
*/
|
|
7
7
|
declare const useLocaleBase: () => {
|
|
8
|
-
locale:
|
|
9
|
-
defaultLocale:
|
|
10
|
-
availableLocales:
|
|
11
|
-
setLocale: (newLocale:
|
|
8
|
+
locale: _intlayer_types0.LocalesValues;
|
|
9
|
+
defaultLocale: _intlayer_types0.Locale;
|
|
10
|
+
availableLocales: _intlayer_types0.Locale[];
|
|
11
|
+
setLocale: (newLocale: _intlayer_types0.LocalesValues) => void;
|
|
12
12
|
};
|
|
13
13
|
//#endregion
|
|
14
14
|
export { useLocaleBase };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as _intlayer_types4 from "@intlayer/types";
|
|
2
2
|
import { LocalesValues } from "@intlayer/types";
|
|
3
3
|
|
|
4
4
|
//#region src/client/useLocaleStorage.d.ts
|
|
@@ -8,13 +8,13 @@ import { LocalesValues } from "@intlayer/types";
|
|
|
8
8
|
/**
|
|
9
9
|
* Get the locale cookie
|
|
10
10
|
*/
|
|
11
|
-
declare const localeInStorage:
|
|
11
|
+
declare const localeInStorage: _intlayer_types4.Locale;
|
|
12
12
|
/**
|
|
13
13
|
* @deprecated Use localeInStorage instead
|
|
14
14
|
*
|
|
15
15
|
* Get the locale cookie
|
|
16
16
|
*/
|
|
17
|
-
declare const localeCookie:
|
|
17
|
+
declare const localeCookie: _intlayer_types4.Locale;
|
|
18
18
|
/**
|
|
19
19
|
* Set the locale cookie
|
|
20
20
|
*/
|
|
@@ -29,7 +29,7 @@ declare const setLocaleCookie: (locale: LocalesValues, isCookieEnabled?: boolean
|
|
|
29
29
|
* Hook that provides the locale cookie and a function to set it
|
|
30
30
|
*/
|
|
31
31
|
declare const useLocaleStorage: (isCookieEnabled?: boolean) => {
|
|
32
|
-
getLocale: () =>
|
|
32
|
+
getLocale: () => _intlayer_types4.Locale;
|
|
33
33
|
setLocale: (locale: LocalesValues) => void;
|
|
34
34
|
};
|
|
35
35
|
/**
|
|
@@ -40,7 +40,7 @@ declare const useLocaleStorage: (isCookieEnabled?: boolean) => {
|
|
|
40
40
|
* Hook that provides the locale cookie and a function to set it
|
|
41
41
|
*/
|
|
42
42
|
declare const useLocaleCookie: (isCookieEnabled?: boolean) => {
|
|
43
|
-
localeCookie:
|
|
43
|
+
localeCookie: _intlayer_types4.Locale;
|
|
44
44
|
setLocaleCookie: (locale: LocalesValues) => void;
|
|
45
45
|
};
|
|
46
46
|
//#endregion
|
|
@@ -1,14 +1,15 @@
|
|
|
1
|
+
import { HTMLComponents } from "../utils/HTMLComponentTypes.js";
|
|
1
2
|
import { FC, PropsWithChildren } from "react";
|
|
2
3
|
|
|
3
4
|
//#region src/html/HTMLProvider.d.ts
|
|
4
5
|
type HTMLContextValue = {
|
|
5
|
-
components?:
|
|
6
|
+
components?: HTMLComponents<'permissive', {}>;
|
|
6
7
|
};
|
|
7
8
|
type HTMLProviderProps = PropsWithChildren<{
|
|
8
9
|
/**
|
|
9
10
|
* Component overrides for HTML tags.
|
|
10
11
|
*/
|
|
11
|
-
components?:
|
|
12
|
+
components?: HTMLComponents<'permissive', {}>;
|
|
12
13
|
}>;
|
|
13
14
|
declare const useHTMLContext: () => HTMLContextValue;
|
|
14
15
|
declare const HTMLProvider: FC<HTMLProviderProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HTMLProvider.d.ts","names":[],"sources":["../../../src/html/HTMLProvider.tsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"HTMLProvider.d.ts","names":[],"sources":["../../../src/html/HTMLProvider.tsx"],"mappings":";;;;KAUK,gBAAA;EACH,UAAA,GAAa,cAAA;AAAA;AAAA,KAGV,iBAAA,GAAoB,iBAAA;;;;EAIvB,UAAA,GAAa,cAAA;AAAA;AAAA,cAKF,cAAA,QAAc,gBAAA;AAAA,cAEd,YAAA,EAAc,EAAA,CAAG,iBAAA"}
|