react-intlayer 8.2.1 → 8.2.3
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/IntlayerNode.cjs.map +1 -1
- package/dist/cjs/UI/ContentSelector.cjs.map +1 -1
- package/dist/cjs/client/IntlayerProvider.cjs.map +1 -1
- package/dist/cjs/editor/ContentSelectorWrapper.cjs.map +1 -1
- package/dist/cjs/editor/IntlayerEditorProvider.cjs.map +1 -1
- package/dist/cjs/editor/useEditedContentRenderer.cjs.map +1 -1
- package/dist/cjs/html/HTMLProvider.cjs.map +1 -1
- package/dist/cjs/html/HTMLRenderer.cjs.map +1 -1
- package/dist/cjs/html/HTMLRendererPlugin.cjs.map +1 -1
- package/dist/cjs/markdown/MarkdownProvider.cjs.map +1 -1
- package/dist/cjs/markdown/MarkdownRenderer.cjs.map +1 -1
- package/dist/cjs/plugins.cjs.map +1 -1
- package/dist/cjs/server/IntlayerServerProvider.cjs.map +1 -1
- package/dist/cjs/server/t.cjs.map +1 -1
- package/dist/cjs/server/useDictionary.cjs +1 -1
- package/dist/cjs/server/useDictionary.cjs.map +1 -1
- package/dist/cjs/server/useDictionaryAsync.cjs +1 -1
- package/dist/cjs/server/useDictionaryAsync.cjs.map +1 -1
- package/dist/cjs/server/useDictionaryDynamic.cjs +1 -1
- package/dist/cjs/server/useDictionaryDynamic.cjs.map +1 -1
- package/dist/cjs/server/useIntlayer.cjs +1 -1
- package/dist/cjs/server/useIntlayer.cjs.map +1 -1
- package/dist/esm/IntlayerNode.mjs.map +1 -1
- package/dist/esm/UI/ContentSelector.mjs.map +1 -1
- package/dist/esm/client/IntlayerProvider.mjs.map +1 -1
- package/dist/esm/editor/ContentSelectorWrapper.mjs.map +1 -1
- package/dist/esm/editor/IntlayerEditorProvider.mjs.map +1 -1
- package/dist/esm/editor/useEditedContentRenderer.mjs.map +1 -1
- package/dist/esm/html/HTMLProvider.mjs.map +1 -1
- package/dist/esm/html/HTMLRenderer.mjs.map +1 -1
- package/dist/esm/html/HTMLRendererPlugin.mjs.map +1 -1
- package/dist/esm/markdown/MarkdownProvider.mjs.map +1 -1
- package/dist/esm/markdown/MarkdownRenderer.mjs.map +1 -1
- package/dist/esm/plugins.mjs.map +1 -1
- package/dist/esm/server/IntlayerServerProvider.mjs.map +1 -1
- package/dist/esm/server/t.mjs.map +1 -1
- package/dist/esm/server/useDictionary.mjs +1 -1
- package/dist/esm/server/useDictionary.mjs.map +1 -1
- package/dist/esm/server/useDictionaryAsync.mjs +1 -1
- package/dist/esm/server/useDictionaryAsync.mjs.map +1 -1
- package/dist/esm/server/useDictionaryDynamic.mjs +1 -1
- package/dist/esm/server/useDictionaryDynamic.mjs.map +1 -1
- package/dist/esm/server/useIntlayer.mjs +1 -1
- package/dist/esm/server/useIntlayer.mjs.map +1 -1
- package/dist/types/server/t.d.ts +2 -2
- package/dist/types/server/t.d.ts.map +1 -1
- package/dist/types/server/useDictionary.d.ts +1 -1
- package/dist/types/server/useDictionary.d.ts.map +1 -1
- package/dist/types/server/useDictionaryAsync.d.ts +1 -1
- package/dist/types/server/useDictionaryAsync.d.ts.map +1 -1
- package/dist/types/server/useDictionaryDynamic.d.ts +1 -1
- package/dist/types/server/useDictionaryDynamic.d.ts.map +1 -1
- package/dist/types/server/useIntlayer.d.ts +2 -2
- package/dist/types/server/useIntlayer.d.ts.map +1 -1
- package/package.json +11 -11
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IntlayerNode.cjs","names":[],"sources":["../../src/IntlayerNode.tsx"],"sourcesContent":["import type { NodeProps } from '@intlayer/core/interpreter';\nimport {\n isValidElement,\n type PropsWithChildren,\n type ReactElement,\n type ReactNode,\n} from 'react';\n\nexport type IntlayerNode<\n T = NodeProps['children'],\n AdditionalProps = Record<string, never>,\n> = ReactNode & {\n value: T;\n} & AdditionalProps;\n\ntype RenderIntlayerNodeProps<T> = PropsWithChildren<{\n value: T;\n children: ReactNode;\n additionalProps?: { [key: string]: any };\n}>;\n\nexport const renderIntlayerNode = <\n T extends number | string | boolean | undefined | null,\n>({\n children,\n value,\n additionalProps,\n}: RenderIntlayerNodeProps<T>): IntlayerNode<T> => {\n // If children is not a valid ReactElement, wrap it in a fragment\n const element: ReactElement<any> = isValidElement(children) ? (\n children\n ) : (\n <>{children}</>\n );\n\n // Return a Proxy that pretends to be the original element\n // but also has a .value getter.\n return new Proxy(element as ReactElement, {\n get(target, prop, receiver) {\n if (prop === 'value') {\n return value;\n }\n\n if (\n additionalProps &&\n Object.keys(additionalProps).includes(prop as string)\n ) {\n return additionalProps[prop as keyof typeof additionalProps];\n }\n\n return Reflect.get(target, prop, receiver);\n },\n }) as IntlayerNode<T>;\n};\n"],"mappings":"qKAqBA,MAAa,GAEX,CACA,WACA,QACA,qBACiD,CAEjD,IAAM,GAAA,EAAA,EAAA,gBAA4C,EAAS,CACzD,GAEA,EAAA,EAAA,KAAA,EAAA,SAAA,CAAG,
|
|
1
|
+
{"version":3,"file":"IntlayerNode.cjs","names":[],"sources":["../../src/IntlayerNode.tsx"],"sourcesContent":["import type { NodeProps } from '@intlayer/core/interpreter';\nimport {\n isValidElement,\n type PropsWithChildren,\n type ReactElement,\n type ReactNode,\n} from 'react';\n\nexport type IntlayerNode<\n T = NodeProps['children'],\n AdditionalProps = Record<string, never>,\n> = ReactNode & {\n value: T;\n} & AdditionalProps;\n\ntype RenderIntlayerNodeProps<T> = PropsWithChildren<{\n value: T;\n children: ReactNode;\n additionalProps?: { [key: string]: any };\n}>;\n\nexport const renderIntlayerNode = <\n T extends number | string | boolean | undefined | null,\n>({\n children,\n value,\n additionalProps,\n}: RenderIntlayerNodeProps<T>): IntlayerNode<T> => {\n // If children is not a valid ReactElement, wrap it in a fragment\n const element: ReactElement<any> = isValidElement(children) ? (\n children\n ) : (\n <>{children}</>\n );\n\n // Return a Proxy that pretends to be the original element\n // but also has a .value getter.\n return new Proxy(element as ReactElement, {\n get(target, prop, receiver) {\n if (prop === 'value') {\n return value;\n }\n\n if (\n additionalProps &&\n Object.keys(additionalProps).includes(prop as string)\n ) {\n return additionalProps[prop as keyof typeof additionalProps];\n }\n\n return Reflect.get(target, prop, receiver);\n },\n }) as IntlayerNode<T>;\n};\n"],"mappings":"qKAqBA,MAAa,GAEX,CACA,WACA,QACA,qBACiD,CAEjD,IAAM,GAAA,EAAA,EAAA,gBAA4C,EAAS,CACzD,GAEA,EAAA,EAAA,KAAA,EAAA,SAAA,CAAG,WAAY,CAAA,CAKjB,OAAO,IAAI,MAAM,EAAyB,CACxC,IAAI,EAAQ,EAAM,EAAU,CAY1B,OAXI,IAAS,QACJ,EAIP,GACA,OAAO,KAAK,EAAgB,CAAC,SAAS,EAAe,CAE9C,EAAgB,GAGlB,QAAQ,IAAI,EAAQ,EAAM,EAAS,EAE7C,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContentSelector.cjs","names":[],"sources":["../../../src/UI/ContentSelector.tsx"],"sourcesContent":["'use client';\n\nimport {\n type FC,\n type HTMLAttributes,\n type MouseEventHandler,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nconst DEFAULT_PRESS_DETECT_DURATION = 250;\n\ntype ContentSelectorProps = {\n onPress: () => void;\n onHover?: () => void;\n onUnhover?: () => void;\n onClickOutside?: () => void;\n pressDuration?: number;\n isSelecting?: boolean;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'content'>;\n\nexport const ContentSelector: FC<ContentSelectorProps> = ({\n children,\n onPress,\n onHover,\n onUnhover,\n onClickOutside: onUnselect,\n pressDuration = DEFAULT_PRESS_DETECT_DURATION,\n isSelecting: isSelectingProp,\n ...props\n}) => {\n const divRef = useRef<HTMLDivElement>(null);\n const [isHovered, setIsHovered] = useState(false);\n const [isSelectingState, setIsSelectingState] = useState(isSelectingProp);\n const pressTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const isChildrenString = typeof children === 'string';\n\n const handleOnLongPress = () => {\n setIsSelectingState(true);\n onPress();\n };\n\n const startPressTimer = () => {\n pressTimerRef.current = setTimeout(() => {\n handleOnLongPress();\n }, pressDuration);\n };\n\n const clearPressTimer = () => {\n if (pressTimerRef.current) {\n clearTimeout(pressTimerRef.current);\n pressTimerRef.current = null;\n }\n };\n\n const handleMouseDown = () => {\n clearPressTimer(); // Ensure any previous timer is cleared\n startPressTimer();\n };\n\n const handleMouseEnter = () => {\n setIsHovered(true);\n onHover?.();\n };\n\n const handleMouseUp = () => {\n onUnhover?.();\n setIsHovered(false);\n clearPressTimer();\n };\n\n // Use useCallback to ensure the function identity remains stable\n const handleClickOutside = useCallback(\n (event: MouseEvent) => {\n if (divRef.current && !divRef.current.contains(event.target as Node)) {\n setIsSelectingState(false);\n onUnselect?.();\n }\n },\n [onUnselect]\n );\n\n useEffect(() => {\n // Attach click outside listener\n document.addEventListener('mousedown', handleClickOutside);\n\n return () => {\n // Cleanup\n document.removeEventListener('mousedown', handleClickOutside);\n // clearPressTimer(); // Ensure to clear the timer when component unmounts\n };\n }, [handleClickOutside]);\n\n const handleOnClick: MouseEventHandler<HTMLDivElement> = (e) => {\n if (isSelectingState) {\n e.preventDefault();\n e.stopPropagation();\n }\n };\n\n const handleOnBlur = () => {\n // Stop editing when the element loses focus\n setIsSelectingState(false);\n };\n\n return (\n <span\n style={{\n display: isChildrenString ? 'inline' : 'inline-block',\n cursor: 'pointer',\n userSelect: 'none',\n borderRadius: '0.375rem',\n outlineWidth: '2px',\n outlineOffset: '4px',\n outlineStyle: 'solid',\n outlineColor:\n isSelectingProp || isSelectingState || isHovered\n ? 'inherit'\n : 'transparent',\n transition: 'all 100ms 50ms ease-in-out',\n }}\n role=\"button\"\n tabIndex={0}\n onKeyUp={() => null}\n onClick={handleOnClick}\n onMouseDown={handleMouseDown}\n onMouseUp={handleMouseUp}\n onMouseLeave={handleMouseUp}\n onTouchStart={handleMouseDown}\n onTouchEnd={handleMouseUp}\n onTouchCancel={handleMouseUp}\n onBlur={handleOnBlur}\n onMouseEnter={handleMouseEnter}\n ref={divRef}\n {...props}\n >\n {children}\n </span>\n );\n};\n"],"mappings":"mLAYA,MAWa,GAA6C,CACxD,WACA,UACA,UACA,YACA,eAAgB,EAChB,gBAAgB,IAChB,YAAa,EACb,GAAG,KACC,CACJ,IAAM,GAAA,EAAA,EAAA,QAAgC,KAAK,CACrC,CAAC,EAAW,IAAA,EAAA,EAAA,UAAyB,GAAM,CAC3C,CAAC,EAAkB,IAAA,EAAA,EAAA,UAAgC,EAAgB,CACnE,GAAA,EAAA,EAAA,QAA6D,KAAK,CAClE,EAAmB,OAAO,GAAa,SAEvC,MAA0B,CAC9B,EAAoB,GAAK,CACzB,GAAS,EAGL,MAAwB,CAC5B,EAAc,QAAU,eAAiB,CACvC,GAAmB,EAClB,EAAc,EAGb,MAAwB,CAC5B,AAEE,EAAc,WADd,aAAa,EAAc,QAAQ,CACX,OAItB,MAAwB,CAC5B,GAAiB,CACjB,GAAiB,EAGb,MAAyB,CAC7B,EAAa,GAAK,CAClB,KAAW,EAGP,MAAsB,CAC1B,KAAa,CACb,EAAa,GAAM,CACnB,GAAiB,EAIb,GAAA,EAAA,EAAA,aACH,GAAsB,CACjB,EAAO,SAAW,CAAC,EAAO,QAAQ,SAAS,EAAM,OAAe,GAClE,EAAoB,GAAM,CAC1B,KAAc,GAGlB,CAAC,EAAW,CACb,CAyBD,OAvBA,EAAA,EAAA,gBAEE,SAAS,iBAAiB,YAAa,EAAmB,KAE7C,CAEX,SAAS,oBAAoB,YAAa,EAAmB,GAG9D,CAAC,EAAmB,CAAC,EAetB,EAAA,EAAA,KAAC,
|
|
1
|
+
{"version":3,"file":"ContentSelector.cjs","names":[],"sources":["../../../src/UI/ContentSelector.tsx"],"sourcesContent":["'use client';\n\nimport {\n type FC,\n type HTMLAttributes,\n type MouseEventHandler,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nconst DEFAULT_PRESS_DETECT_DURATION = 250;\n\ntype ContentSelectorProps = {\n onPress: () => void;\n onHover?: () => void;\n onUnhover?: () => void;\n onClickOutside?: () => void;\n pressDuration?: number;\n isSelecting?: boolean;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'content'>;\n\nexport const ContentSelector: FC<ContentSelectorProps> = ({\n children,\n onPress,\n onHover,\n onUnhover,\n onClickOutside: onUnselect,\n pressDuration = DEFAULT_PRESS_DETECT_DURATION,\n isSelecting: isSelectingProp,\n ...props\n}) => {\n const divRef = useRef<HTMLDivElement>(null);\n const [isHovered, setIsHovered] = useState(false);\n const [isSelectingState, setIsSelectingState] = useState(isSelectingProp);\n const pressTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const isChildrenString = typeof children === 'string';\n\n const handleOnLongPress = () => {\n setIsSelectingState(true);\n onPress();\n };\n\n const startPressTimer = () => {\n pressTimerRef.current = setTimeout(() => {\n handleOnLongPress();\n }, pressDuration);\n };\n\n const clearPressTimer = () => {\n if (pressTimerRef.current) {\n clearTimeout(pressTimerRef.current);\n pressTimerRef.current = null;\n }\n };\n\n const handleMouseDown = () => {\n clearPressTimer(); // Ensure any previous timer is cleared\n startPressTimer();\n };\n\n const handleMouseEnter = () => {\n setIsHovered(true);\n onHover?.();\n };\n\n const handleMouseUp = () => {\n onUnhover?.();\n setIsHovered(false);\n clearPressTimer();\n };\n\n // Use useCallback to ensure the function identity remains stable\n const handleClickOutside = useCallback(\n (event: MouseEvent) => {\n if (divRef.current && !divRef.current.contains(event.target as Node)) {\n setIsSelectingState(false);\n onUnselect?.();\n }\n },\n [onUnselect]\n );\n\n useEffect(() => {\n // Attach click outside listener\n document.addEventListener('mousedown', handleClickOutside);\n\n return () => {\n // Cleanup\n document.removeEventListener('mousedown', handleClickOutside);\n // clearPressTimer(); // Ensure to clear the timer when component unmounts\n };\n }, [handleClickOutside]);\n\n const handleOnClick: MouseEventHandler<HTMLDivElement> = (e) => {\n if (isSelectingState) {\n e.preventDefault();\n e.stopPropagation();\n }\n };\n\n const handleOnBlur = () => {\n // Stop editing when the element loses focus\n setIsSelectingState(false);\n };\n\n return (\n <span\n style={{\n display: isChildrenString ? 'inline' : 'inline-block',\n cursor: 'pointer',\n userSelect: 'none',\n borderRadius: '0.375rem',\n outlineWidth: '2px',\n outlineOffset: '4px',\n outlineStyle: 'solid',\n outlineColor:\n isSelectingProp || isSelectingState || isHovered\n ? 'inherit'\n : 'transparent',\n transition: 'all 100ms 50ms ease-in-out',\n }}\n role=\"button\"\n tabIndex={0}\n onKeyUp={() => null}\n onClick={handleOnClick}\n onMouseDown={handleMouseDown}\n onMouseUp={handleMouseUp}\n onMouseLeave={handleMouseUp}\n onTouchStart={handleMouseDown}\n onTouchEnd={handleMouseUp}\n onTouchCancel={handleMouseUp}\n onBlur={handleOnBlur}\n onMouseEnter={handleMouseEnter}\n ref={divRef}\n {...props}\n >\n {children}\n </span>\n );\n};\n"],"mappings":"mLAYA,MAWa,GAA6C,CACxD,WACA,UACA,UACA,YACA,eAAgB,EAChB,gBAAgB,IAChB,YAAa,EACb,GAAG,KACC,CACJ,IAAM,GAAA,EAAA,EAAA,QAAgC,KAAK,CACrC,CAAC,EAAW,IAAA,EAAA,EAAA,UAAyB,GAAM,CAC3C,CAAC,EAAkB,IAAA,EAAA,EAAA,UAAgC,EAAgB,CACnE,GAAA,EAAA,EAAA,QAA6D,KAAK,CAClE,EAAmB,OAAO,GAAa,SAEvC,MAA0B,CAC9B,EAAoB,GAAK,CACzB,GAAS,EAGL,MAAwB,CAC5B,EAAc,QAAU,eAAiB,CACvC,GAAmB,EAClB,EAAc,EAGb,MAAwB,CAC5B,AAEE,EAAc,WADd,aAAa,EAAc,QAAQ,CACX,OAItB,MAAwB,CAC5B,GAAiB,CACjB,GAAiB,EAGb,MAAyB,CAC7B,EAAa,GAAK,CAClB,KAAW,EAGP,MAAsB,CAC1B,KAAa,CACb,EAAa,GAAM,CACnB,GAAiB,EAIb,GAAA,EAAA,EAAA,aACH,GAAsB,CACjB,EAAO,SAAW,CAAC,EAAO,QAAQ,SAAS,EAAM,OAAe,GAClE,EAAoB,GAAM,CAC1B,KAAc,GAGlB,CAAC,EAAW,CACb,CAyBD,OAvBA,EAAA,EAAA,gBAEE,SAAS,iBAAiB,YAAa,EAAmB,KAE7C,CAEX,SAAS,oBAAoB,YAAa,EAAmB,GAG9D,CAAC,EAAmB,CAAC,EAetB,EAAA,EAAA,KAAC,OAAD,CACE,MAAO,CACL,QAAS,EAAmB,SAAW,eACvC,OAAQ,UACR,WAAY,OACZ,aAAc,WACd,aAAc,MACd,cAAe,MACf,aAAc,QACd,aACE,GAAmB,GAAoB,EACnC,UACA,cACN,WAAY,6BACb,CACD,KAAK,SACL,SAAU,EACV,YAAe,KACf,QA/BsD,GAAM,CAC1D,IACF,EAAE,gBAAgB,CAClB,EAAE,iBAAiB,GA6BnB,YAAa,EACb,UAAW,EACX,aAAc,EACd,aAAc,EACd,WAAY,EACZ,cAAe,EACf,WA/BuB,CAEzB,EAAoB,GAAM,EA8BxB,aAAc,EACd,IAAK,EACL,GAAI,EAEH,WACI,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IntlayerProvider.cjs","names":["localeInStorage","configuration","MessageKey","IntlayerEditorProvider"],"sources":["../../../src/client/IntlayerProvider.tsx"],"sourcesContent":["'use client';\n\nimport configuration from '@intlayer/config/built';\nimport { localeResolver } from '@intlayer/core/localization';\nimport { MessageKey, useCrossFrameState } from '@intlayer/editor-react';\nimport type { LocalesValues } from '@intlayer/types';\nimport {\n createContext,\n type FC,\n type PropsWithChildren,\n useContext,\n useEffect,\n} from 'react';\nimport { IntlayerEditorProvider } from '../editor/IntlayerEditorProvider';\nimport { localeInStorage, setLocaleInStorage } from './useLocaleStorage';\n\ntype IntlayerValue = {\n locale: LocalesValues;\n setLocale: (newLocale: LocalesValues) => void;\n disableEditor?: boolean;\n isCookieEnabled?: boolean;\n};\n\n/**\n * Context that stores the current locale on the client side.\n */\nexport const IntlayerClientContext = createContext<IntlayerValue>({\n locale: localeInStorage ?? configuration?.internationalization?.defaultLocale,\n setLocale: () => null,\n isCookieEnabled: true,\n disableEditor: false,\n});\n\n/**\n * Hook that provides the current Intlayer client context.\n *\n * @returns The current Intlayer context values.\n */\nexport const useIntlayerContext = () => useContext(IntlayerClientContext);\n\n/**\n * Props for the IntlayerProvider component.\n */\nexport type IntlayerProviderProps = PropsWithChildren<{\n /**\n * The locale to use. If not provided, it will be detected from storage or configuration.\n */\n locale?: LocalesValues;\n /**\n * The default locale to use as a fallback.\n */\n defaultLocale?: LocalesValues;\n /**\n * Function to set the locale.\n */\n setLocale?: (locale: LocalesValues) => void;\n /**\n * Whether to disable the editor.\n */\n disableEditor?: boolean;\n /**\n * Whether to enable cookies for storing the locale.\n */\n isCookieEnabled?: boolean;\n}>;\n\n/**\n * Provider that stores the current locale on the client side.\n *\n * This component is focused on content delivery without the editor features.\n *\n * @param props - The provider props.\n * @returns The provider component.\n */\nexport const IntlayerProviderContent: FC<IntlayerProviderProps> = ({\n locale: localeProp,\n defaultLocale: defaultLocaleProp,\n children,\n setLocale: setLocaleProp,\n disableEditor,\n isCookieEnabled,\n}) => {\n const { internationalization } = configuration ?? {};\n const { locales: availableLocales, defaultLocale: defaultLocaleConfig } =\n internationalization ?? {};\n\n const initialLocale =\n localeProp ?? localeInStorage ?? defaultLocaleProp ?? defaultLocaleConfig;\n\n const [currentLocale, setCurrentLocale] = useCrossFrameState(\n MessageKey.INTLAYER_CURRENT_LOCALE,\n initialLocale\n );\n\n // Sync the prop to state if the prop changes from the parent\n useEffect(() => {\n if (localeProp && localeProp !== currentLocale) {\n setCurrentLocale(localeProp);\n }\n }, [localeProp]);\n\n const setLocaleBase = (newLocale: LocalesValues) => {\n if (currentLocale.toString() === newLocale.toString()) return;\n\n if (!availableLocales?.map(String).includes(newLocale)) {\n console.error(`Locale ${newLocale} is not available`);\n return;\n }\n\n setCurrentLocale(newLocale);\n setLocaleInStorage(newLocale, isCookieEnabled);\n };\n\n const setLocale = setLocaleProp ?? setLocaleBase;\n\n // Resolve based on currentLocale (the state), not the prop directly\n const resolvedLocale = localeResolver(currentLocale);\n\n return (\n <IntlayerClientContext.Provider\n value={{\n locale: resolvedLocale,\n setLocale,\n disableEditor,\n }}\n >\n {children}\n </IntlayerClientContext.Provider>\n );\n};\n\n/**\n * Main provider for Intlayer in React applications.\n *\n * It includes the editor provider by default, allowing for live content editing\n * if configured.\n *\n * @param props - The provider props.\n * @returns The provider component with editor support.\n *\n * @example\n * ```tsx\n * import { IntlayerProvider } from 'react-intlayer';\n *\n * const App = () => (\n * <IntlayerProvider>\n * <MyComponent />\n * </IntlayerProvider>\n * );\n * ```\n */\nexport const IntlayerProvider: FC<IntlayerProviderProps> = (props) => (\n <IntlayerEditorProvider>\n <IntlayerProviderContent {...props} />\n </IntlayerEditorProvider>\n);\n"],"mappings":"qZA0BA,MAAa,GAAA,EAAA,EAAA,eAAqD,CAChE,OAAQA,EAAAA,iBAAmBC,EAAAA,SAAe,sBAAsB,cAChE,cAAiB,KACjB,gBAAiB,GACjB,cAAe,GAChB,CAAC,CAOW,OAAA,EAAA,EAAA,YAAsC,EAAsB,CAoC5D,GAAsD,CACjE,OAAQ,EACR,cAAe,EACf,WACA,UAAW,EACX,gBACA,qBACI,CACJ,GAAM,CAAE,wBAAyBA,EAAAA,SAAiB,EAAE,CAC9C,CAAE,QAAS,EAAkB,cAAe,GAChD,GAAwB,EAAE,CAEtB,EACJ,GAAcD,EAAAA,iBAAmB,GAAqB,EAElD,CAAC,EAAe,IAAA,EAAA,EAAA,oBACpBE,EAAAA,WAAW,wBACX,EACD,EAGD,EAAA,EAAA,eAAgB,CACV,GAAc,IAAe,GAC/B,EAAiB,EAAW,EAE7B,CAAC,EAAW,CAAC,CAchB,IAAM,EAAY,IAZK,GAA6B,CAC9C,KAAc,UAAU,GAAK,EAAU,UAAU,CAErD,IAAI,CAAC,GAAkB,IAAI,OAAO,CAAC,SAAS,EAAU,CAAE,CACtD,QAAQ,MAAM,UAAU,EAAU,mBAAmB,CACrD,OAGF,EAAiB,EAAU,CAC3B,EAAA,mBAAmB,EAAW,EAAgB,IAM1C,GAAA,EAAA,EAAA,gBAAgC,EAAc,CAEpD,OACE,EAAA,EAAA,KAAC,EAAsB,
|
|
1
|
+
{"version":3,"file":"IntlayerProvider.cjs","names":["localeInStorage","configuration","MessageKey","IntlayerEditorProvider"],"sources":["../../../src/client/IntlayerProvider.tsx"],"sourcesContent":["'use client';\n\nimport configuration from '@intlayer/config/built';\nimport { localeResolver } from '@intlayer/core/localization';\nimport { MessageKey, useCrossFrameState } from '@intlayer/editor-react';\nimport type { LocalesValues } from '@intlayer/types';\nimport {\n createContext,\n type FC,\n type PropsWithChildren,\n useContext,\n useEffect,\n} from 'react';\nimport { IntlayerEditorProvider } from '../editor/IntlayerEditorProvider';\nimport { localeInStorage, setLocaleInStorage } from './useLocaleStorage';\n\ntype IntlayerValue = {\n locale: LocalesValues;\n setLocale: (newLocale: LocalesValues) => void;\n disableEditor?: boolean;\n isCookieEnabled?: boolean;\n};\n\n/**\n * Context that stores the current locale on the client side.\n */\nexport const IntlayerClientContext = createContext<IntlayerValue>({\n locale: localeInStorage ?? configuration?.internationalization?.defaultLocale,\n setLocale: () => null,\n isCookieEnabled: true,\n disableEditor: false,\n});\n\n/**\n * Hook that provides the current Intlayer client context.\n *\n * @returns The current Intlayer context values.\n */\nexport const useIntlayerContext = () => useContext(IntlayerClientContext);\n\n/**\n * Props for the IntlayerProvider component.\n */\nexport type IntlayerProviderProps = PropsWithChildren<{\n /**\n * The locale to use. If not provided, it will be detected from storage or configuration.\n */\n locale?: LocalesValues;\n /**\n * The default locale to use as a fallback.\n */\n defaultLocale?: LocalesValues;\n /**\n * Function to set the locale.\n */\n setLocale?: (locale: LocalesValues) => void;\n /**\n * Whether to disable the editor.\n */\n disableEditor?: boolean;\n /**\n * Whether to enable cookies for storing the locale.\n */\n isCookieEnabled?: boolean;\n}>;\n\n/**\n * Provider that stores the current locale on the client side.\n *\n * This component is focused on content delivery without the editor features.\n *\n * @param props - The provider props.\n * @returns The provider component.\n */\nexport const IntlayerProviderContent: FC<IntlayerProviderProps> = ({\n locale: localeProp,\n defaultLocale: defaultLocaleProp,\n children,\n setLocale: setLocaleProp,\n disableEditor,\n isCookieEnabled,\n}) => {\n const { internationalization } = configuration ?? {};\n const { locales: availableLocales, defaultLocale: defaultLocaleConfig } =\n internationalization ?? {};\n\n const initialLocale =\n localeProp ?? localeInStorage ?? defaultLocaleProp ?? defaultLocaleConfig;\n\n const [currentLocale, setCurrentLocale] = useCrossFrameState(\n MessageKey.INTLAYER_CURRENT_LOCALE,\n initialLocale\n );\n\n // Sync the prop to state if the prop changes from the parent\n useEffect(() => {\n if (localeProp && localeProp !== currentLocale) {\n setCurrentLocale(localeProp);\n }\n }, [localeProp]);\n\n const setLocaleBase = (newLocale: LocalesValues) => {\n if (currentLocale.toString() === newLocale.toString()) return;\n\n if (!availableLocales?.map(String).includes(newLocale)) {\n console.error(`Locale ${newLocale} is not available`);\n return;\n }\n\n setCurrentLocale(newLocale);\n setLocaleInStorage(newLocale, isCookieEnabled);\n };\n\n const setLocale = setLocaleProp ?? setLocaleBase;\n\n // Resolve based on currentLocale (the state), not the prop directly\n const resolvedLocale = localeResolver(currentLocale);\n\n return (\n <IntlayerClientContext.Provider\n value={{\n locale: resolvedLocale,\n setLocale,\n disableEditor,\n }}\n >\n {children}\n </IntlayerClientContext.Provider>\n );\n};\n\n/**\n * Main provider for Intlayer in React applications.\n *\n * It includes the editor provider by default, allowing for live content editing\n * if configured.\n *\n * @param props - The provider props.\n * @returns The provider component with editor support.\n *\n * @example\n * ```tsx\n * import { IntlayerProvider } from 'react-intlayer';\n *\n * const App = () => (\n * <IntlayerProvider>\n * <MyComponent />\n * </IntlayerProvider>\n * );\n * ```\n */\nexport const IntlayerProvider: FC<IntlayerProviderProps> = (props) => (\n <IntlayerEditorProvider>\n <IntlayerProviderContent {...props} />\n </IntlayerEditorProvider>\n);\n"],"mappings":"qZA0BA,MAAa,GAAA,EAAA,EAAA,eAAqD,CAChE,OAAQA,EAAAA,iBAAmBC,EAAAA,SAAe,sBAAsB,cAChE,cAAiB,KACjB,gBAAiB,GACjB,cAAe,GAChB,CAAC,CAOW,OAAA,EAAA,EAAA,YAAsC,EAAsB,CAoC5D,GAAsD,CACjE,OAAQ,EACR,cAAe,EACf,WACA,UAAW,EACX,gBACA,qBACI,CACJ,GAAM,CAAE,wBAAyBA,EAAAA,SAAiB,EAAE,CAC9C,CAAE,QAAS,EAAkB,cAAe,GAChD,GAAwB,EAAE,CAEtB,EACJ,GAAcD,EAAAA,iBAAmB,GAAqB,EAElD,CAAC,EAAe,IAAA,EAAA,EAAA,oBACpBE,EAAAA,WAAW,wBACX,EACD,EAGD,EAAA,EAAA,eAAgB,CACV,GAAc,IAAe,GAC/B,EAAiB,EAAW,EAE7B,CAAC,EAAW,CAAC,CAchB,IAAM,EAAY,IAZK,GAA6B,CAC9C,KAAc,UAAU,GAAK,EAAU,UAAU,CAErD,IAAI,CAAC,GAAkB,IAAI,OAAO,CAAC,SAAS,EAAU,CAAE,CACtD,QAAQ,MAAM,UAAU,EAAU,mBAAmB,CACrD,OAGF,EAAiB,EAAU,CAC3B,EAAA,mBAAmB,EAAW,EAAgB,IAM1C,GAAA,EAAA,EAAA,gBAAgC,EAAc,CAEpD,OACE,EAAA,EAAA,KAAC,EAAsB,SAAvB,CACE,MAAO,CACL,OAAQ,EACR,YACA,gBACD,CAEA,WAC8B,CAAA,EAwBxB,EAA+C,IAC1D,EAAA,EAAA,KAACC,EAAAA,uBAAD,CAAA,UACE,EAAA,EAAA,KAAC,EAAD,CAAyB,GAAI,EAAS,CAAA,CACf,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContentSelectorWrapper.cjs","names":["NodeType","ContentSelector","MessageKey","useIntlayerContext"],"sources":["../../../src/editor/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport type { NodeProps } from '@intlayer/core/interpreter';\nimport { isSameKeyPath } from '@intlayer/core/utils';\nimport {\n MessageKey,\n useCommunicator,\n useEditorEnabled,\n useFocusDictionary,\n} from '@intlayer/editor-react';\nimport { NodeType } from '@intlayer/types';\nimport { type FC, type HTMLAttributes, useCallback, useMemo } from 'react';\nimport { useIntlayerContext } from '../client';\nimport { ContentSelector } from '../UI/ContentSelector';\n\nexport type ContentSelectorWrapperProps = NodeProps &\n Omit<HTMLAttributes<HTMLDivElement>, 'children'>;\n\nconst ContentSelectorWrapperContent: FC<ContentSelectorWrapperProps> = ({\n children,\n dictionaryKey,\n keyPath,\n}) => {\n const { focusedContent, setFocusedContent } = useFocusDictionary();\n const { postMessage, senderId } = useCommunicator();\n\n // Filter out translation nodes for more flexibility with the editor that can have different format\n const filteredKeyPath = useMemo(\n () => keyPath.filter((key) => key.type !== NodeType.Translation),\n [keyPath]\n );\n\n const handleSelect = useCallback(\n () =>\n setFocusedContent({\n dictionaryKey,\n keyPath: filteredKeyPath,\n }),\n [dictionaryKey, filteredKeyPath]\n );\n\n const handleHover = useCallback(\n () =>\n postMessage({\n type: `${MessageKey.INTLAYER_HOVERED_CONTENT_CHANGED}/post`,\n data: {\n dictionaryKey,\n keyPath: filteredKeyPath,\n },\n senderId,\n }),\n [dictionaryKey, filteredKeyPath]\n );\n\n const handleUnhover = useCallback(\n () =>\n postMessage({\n type: `${MessageKey.INTLAYER_HOVERED_CONTENT_CHANGED}/post`,\n data: null,\n senderId,\n }),\n [senderId]\n );\n\n const isSelected = useMemo(\n () =>\n (focusedContent?.dictionaryKey === dictionaryKey &&\n (focusedContent?.keyPath?.length ?? 0) > 0 &&\n isSameKeyPath(focusedContent?.keyPath ?? [], filteredKeyPath)) ??\n false,\n [focusedContent, filteredKeyPath, dictionaryKey]\n );\n\n return (\n <ContentSelector\n onPress={handleSelect}\n onHover={handleHover}\n onUnhover={handleUnhover}\n isSelecting={isSelected}\n >\n {children}\n </ContentSelector>\n );\n};\n\nexport const ContentSelectorRenderer: FC<ContentSelectorWrapperProps> = ({\n children,\n ...props\n}) => {\n const { enabled } = useEditorEnabled();\n const { disableEditor } = useIntlayerContext();\n\n if (enabled && !disableEditor) {\n return (\n <ContentSelectorWrapperContent {...props}>\n {children}\n </ContentSelectorWrapperContent>\n );\n }\n\n return children;\n};\n"],"mappings":"+WAkBA,MAAM,GAAkE,CACtE,WACA,gBACA,aACI,CACJ,GAAM,CAAE,iBAAgB,sBAAA,EAAA,EAAA,qBAA0C,CAC5D,CAAE,cAAa,aAAA,EAAA,EAAA,kBAA8B,CAG7C,GAAA,EAAA,EAAA,aACE,EAAQ,OAAQ,GAAQ,EAAI,OAASA,EAAAA,SAAS,YAAY,CAChE,CAAC,EAAQ,CACV,CA2CD,OACE,EAAA,EAAA,KAACC,EAAAA,
|
|
1
|
+
{"version":3,"file":"ContentSelectorWrapper.cjs","names":["NodeType","ContentSelector","MessageKey","useIntlayerContext"],"sources":["../../../src/editor/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport type { NodeProps } from '@intlayer/core/interpreter';\nimport { isSameKeyPath } from '@intlayer/core/utils';\nimport {\n MessageKey,\n useCommunicator,\n useEditorEnabled,\n useFocusDictionary,\n} from '@intlayer/editor-react';\nimport { NodeType } from '@intlayer/types';\nimport { type FC, type HTMLAttributes, useCallback, useMemo } from 'react';\nimport { useIntlayerContext } from '../client';\nimport { ContentSelector } from '../UI/ContentSelector';\n\nexport type ContentSelectorWrapperProps = NodeProps &\n Omit<HTMLAttributes<HTMLDivElement>, 'children'>;\n\nconst ContentSelectorWrapperContent: FC<ContentSelectorWrapperProps> = ({\n children,\n dictionaryKey,\n keyPath,\n}) => {\n const { focusedContent, setFocusedContent } = useFocusDictionary();\n const { postMessage, senderId } = useCommunicator();\n\n // Filter out translation nodes for more flexibility with the editor that can have different format\n const filteredKeyPath = useMemo(\n () => keyPath.filter((key) => key.type !== NodeType.Translation),\n [keyPath]\n );\n\n const handleSelect = useCallback(\n () =>\n setFocusedContent({\n dictionaryKey,\n keyPath: filteredKeyPath,\n }),\n [dictionaryKey, filteredKeyPath]\n );\n\n const handleHover = useCallback(\n () =>\n postMessage({\n type: `${MessageKey.INTLAYER_HOVERED_CONTENT_CHANGED}/post`,\n data: {\n dictionaryKey,\n keyPath: filteredKeyPath,\n },\n senderId,\n }),\n [dictionaryKey, filteredKeyPath]\n );\n\n const handleUnhover = useCallback(\n () =>\n postMessage({\n type: `${MessageKey.INTLAYER_HOVERED_CONTENT_CHANGED}/post`,\n data: null,\n senderId,\n }),\n [senderId]\n );\n\n const isSelected = useMemo(\n () =>\n (focusedContent?.dictionaryKey === dictionaryKey &&\n (focusedContent?.keyPath?.length ?? 0) > 0 &&\n isSameKeyPath(focusedContent?.keyPath ?? [], filteredKeyPath)) ??\n false,\n [focusedContent, filteredKeyPath, dictionaryKey]\n );\n\n return (\n <ContentSelector\n onPress={handleSelect}\n onHover={handleHover}\n onUnhover={handleUnhover}\n isSelecting={isSelected}\n >\n {children}\n </ContentSelector>\n );\n};\n\nexport const ContentSelectorRenderer: FC<ContentSelectorWrapperProps> = ({\n children,\n ...props\n}) => {\n const { enabled } = useEditorEnabled();\n const { disableEditor } = useIntlayerContext();\n\n if (enabled && !disableEditor) {\n return (\n <ContentSelectorWrapperContent {...props}>\n {children}\n </ContentSelectorWrapperContent>\n );\n }\n\n return children;\n};\n"],"mappings":"+WAkBA,MAAM,GAAkE,CACtE,WACA,gBACA,aACI,CACJ,GAAM,CAAE,iBAAgB,sBAAA,EAAA,EAAA,qBAA0C,CAC5D,CAAE,cAAa,aAAA,EAAA,EAAA,kBAA8B,CAG7C,GAAA,EAAA,EAAA,aACE,EAAQ,OAAQ,GAAQ,EAAI,OAASA,EAAAA,SAAS,YAAY,CAChE,CAAC,EAAQ,CACV,CA2CD,OACE,EAAA,EAAA,KAACC,EAAAA,gBAAD,CACE,SAAA,EAAA,EAAA,iBAzCA,EAAkB,CAChB,gBACA,QAAS,EACV,CAAC,CACJ,CAAC,EAAe,EAAgB,CACjC,CAqCG,SAAA,EAAA,EAAA,iBAjCA,EAAY,CACV,KAAM,GAAGC,EAAAA,WAAW,iCAAiC,OACrD,KAAM,CACJ,gBACA,QAAS,EACV,CACD,WACD,CAAC,CACJ,CAAC,EAAe,EAAgB,CACjC,CAyBG,WAAA,EAAA,EAAA,iBArBA,EAAY,CACV,KAAM,GAAGA,EAAAA,WAAW,iCAAiC,OACrD,KAAM,KACN,WACD,CAAC,CACJ,CAAC,EAAS,CACX,CAgBG,aAAA,EAAA,EAAA,cAZC,GAAgB,gBAAkB,IAChC,GAAgB,SAAS,QAAU,GAAK,IAAA,EAAA,EAAA,eAC3B,GAAgB,SAAW,EAAE,CAAE,EAAgB,GAC/D,GACF,CAAC,EAAgB,EAAiB,EAAc,CACjD,CASI,WACe,CAAA,EAIT,GAA4D,CACvE,WACA,GAAG,KACC,CACJ,GAAM,CAAE,YAAA,EAAA,EAAA,mBAA8B,CAChC,CAAE,iBAAkBC,EAAAA,oBAAoB,CAU9C,OARI,GAAW,CAAC,GAEZ,EAAA,EAAA,KAAC,EAAD,CAA+B,GAAI,EAChC,WAC6B,CAAA,CAI7B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IntlayerEditorProvider.cjs","names":["configuration","EditorProvider"],"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport configuration from '@intlayer/config/built';\nimport {\n EditorProvider,\n useCrossURLPathSetter,\n useDictionariesRecordActions,\n useEditorEnabled,\n useIframeClickInterceptor,\n} from '@intlayer/editor-react';\nimport type { FC, PropsWithChildren } from 'react';\nimport { useEffect } from 'react';\n\nconst IntlayerEditorHooksEnabled: FC = () => {\n /**\n * URL Messages\n */\n useCrossURLPathSetter();\n\n /**\n * Click Messages\n */\n useIframeClickInterceptor();\n\n /**\n * Sent local dictionaries to editor\n */\n const { setLocaleDictionaries } = useDictionariesRecordActions();\n useEffect(() => {\n // Load dictionaries dynamically to do not impact the bundle, and send them to the editor\n import('@intlayer/unmerged-dictionaries-entry').then((mod) => {\n const unmergedDictionaries = mod.getUnmergedDictionaries();\n const dictionariesList = Object.fromEntries(\n Object.values(unmergedDictionaries)\n .flat()\n .map((dictionary) => [dictionary.localId, dictionary])\n );\n\n setLocaleDictionaries?.(dictionariesList);\n });\n }, []);\n\n return <></>;\n};\n\nconst { editor } = configuration ?? {};\n\nconst IntlayerEditorHook: FC = () => {\n const { enabled } = useEditorEnabled();\n\n return enabled ? <IntlayerEditorHooksEnabled /> : <></>;\n};\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => {\n return (\n <EditorProvider\n postMessage={(data: any) => {\n if (typeof window === 'undefined') return;\n if (!editor) return;\n\n const isInIframe = window.self !== window.top;\n if (!isInIframe) return;\n\n if (editor.applicationURL.length > 0) {\n window?.postMessage(\n data,\n // Use to restrict the origin of the editor for security reasons.\n // Correspond to the current application URL to synchronize the locales states.\n editor.applicationURL\n );\n }\n\n if (editor.editorURL.length > 0) {\n window.parent?.postMessage(\n data,\n // Use to restrict the origin of the editor for security reasons.\n // Correspond to the editor URL to synchronize the locales states.\n editor.editorURL\n );\n }\n\n if (editor.cmsURL.length > 0) {\n window.parent?.postMessage(\n data,\n // Use to restrict the origin of the CMS for security reasons.\n // Correspond to the CMS URL.\n editor.cmsURL\n );\n }\n }}\n allowedOrigins={\n [editor?.editorURL, editor?.cmsURL, editor?.applicationURL].filter(\n Boolean\n ) as string[]\n }\n mode=\"client\"\n configuration={configuration}\n >\n <IntlayerEditorHook />\n {children}\n </EditorProvider>\n );\n};\n"],"mappings":"kRAaA,MAAM,MAAuC,EAI3C,EAAA,EAAA,wBAAuB,EAKvB,EAAA,EAAA,4BAA2B,CAK3B,GAAM,CAAE,0BAAA,EAAA,EAAA,+BAAwD,CAehE,OAdA,EAAA,EAAA,eAAgB,CAEd,OAAO,yCAAyC,KAAM,GAAQ,CAC5D,IAAM,EAAuB,EAAI,yBAAyB,CACpD,EAAmB,OAAO,YAC9B,OAAO,OAAO,EAAqB,CAChC,MAAM,CACN,IAAK,GAAe,CAAC,EAAW,QAAS,EAAW,CAAC,CACzD,CAED,IAAwB,EAAiB,EACzC,EACD,EAAE,CAAC,EAEC,EAAA,EAAA,KAAA,EAAA,SAAA,
|
|
1
|
+
{"version":3,"file":"IntlayerEditorProvider.cjs","names":["configuration","EditorProvider"],"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport configuration from '@intlayer/config/built';\nimport {\n EditorProvider,\n useCrossURLPathSetter,\n useDictionariesRecordActions,\n useEditorEnabled,\n useIframeClickInterceptor,\n} from '@intlayer/editor-react';\nimport type { FC, PropsWithChildren } from 'react';\nimport { useEffect } from 'react';\n\nconst IntlayerEditorHooksEnabled: FC = () => {\n /**\n * URL Messages\n */\n useCrossURLPathSetter();\n\n /**\n * Click Messages\n */\n useIframeClickInterceptor();\n\n /**\n * Sent local dictionaries to editor\n */\n const { setLocaleDictionaries } = useDictionariesRecordActions();\n useEffect(() => {\n // Load dictionaries dynamically to do not impact the bundle, and send them to the editor\n import('@intlayer/unmerged-dictionaries-entry').then((mod) => {\n const unmergedDictionaries = mod.getUnmergedDictionaries();\n const dictionariesList = Object.fromEntries(\n Object.values(unmergedDictionaries)\n .flat()\n .map((dictionary) => [dictionary.localId, dictionary])\n );\n\n setLocaleDictionaries?.(dictionariesList);\n });\n }, []);\n\n return <></>;\n};\n\nconst { editor } = configuration ?? {};\n\nconst IntlayerEditorHook: FC = () => {\n const { enabled } = useEditorEnabled();\n\n return enabled ? <IntlayerEditorHooksEnabled /> : <></>;\n};\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => {\n return (\n <EditorProvider\n postMessage={(data: any) => {\n if (typeof window === 'undefined') return;\n if (!editor) return;\n\n const isInIframe = window.self !== window.top;\n if (!isInIframe) return;\n\n if (editor.applicationURL.length > 0) {\n window?.postMessage(\n data,\n // Use to restrict the origin of the editor for security reasons.\n // Correspond to the current application URL to synchronize the locales states.\n editor.applicationURL\n );\n }\n\n if (editor.editorURL.length > 0) {\n window.parent?.postMessage(\n data,\n // Use to restrict the origin of the editor for security reasons.\n // Correspond to the editor URL to synchronize the locales states.\n editor.editorURL\n );\n }\n\n if (editor.cmsURL.length > 0) {\n window.parent?.postMessage(\n data,\n // Use to restrict the origin of the CMS for security reasons.\n // Correspond to the CMS URL.\n editor.cmsURL\n );\n }\n }}\n allowedOrigins={\n [editor?.editorURL, editor?.cmsURL, editor?.applicationURL].filter(\n Boolean\n ) as string[]\n }\n mode=\"client\"\n configuration={configuration}\n >\n <IntlayerEditorHook />\n {children}\n </EditorProvider>\n );\n};\n"],"mappings":"kRAaA,MAAM,MAAuC,EAI3C,EAAA,EAAA,wBAAuB,EAKvB,EAAA,EAAA,4BAA2B,CAK3B,GAAM,CAAE,0BAAA,EAAA,EAAA,+BAAwD,CAehE,OAdA,EAAA,EAAA,eAAgB,CAEd,OAAO,yCAAyC,KAAM,GAAQ,CAC5D,IAAM,EAAuB,EAAI,yBAAyB,CACpD,EAAmB,OAAO,YAC9B,OAAO,OAAO,EAAqB,CAChC,MAAM,CACN,IAAK,GAAe,CAAC,EAAW,QAAS,EAAW,CAAC,CACzD,CAED,IAAwB,EAAiB,EACzC,EACD,EAAE,CAAC,EAEC,EAAA,EAAA,KAAA,EAAA,SAAA,EAAK,CAAA,EAGR,CAAE,UAAWA,EAAAA,SAAiB,EAAE,CAEhC,MAA+B,CACnC,GAAM,CAAE,YAAA,EAAA,EAAA,mBAA8B,CAEtC,OAAO,GAAU,EAAA,EAAA,KAAC,EAAD,EAA8B,CAAA,EAAG,EAAA,EAAA,KAAA,EAAA,SAAA,EAAK,CAAA,EAG5C,GAAiD,CAAE,eAE5D,EAAA,EAAA,MAACC,EAAAA,eAAD,CACE,YAAc,GAAc,CACtB,OAAO,OAAW,KACjB,GAEc,OAAO,OAAS,OAAO,MAGtC,EAAO,eAAe,OAAS,GACjC,QAAQ,YACN,EAGA,EAAO,eACR,CAGC,EAAO,UAAU,OAAS,GAC5B,OAAO,QAAQ,YACb,EAGA,EAAO,UACR,CAGC,EAAO,OAAO,OAAS,GACzB,OAAO,QAAQ,YACb,EAGA,EAAO,OACR,GAGL,eACE,CAAC,GAAQ,UAAW,GAAQ,OAAQ,GAAQ,eAAe,CAAC,OAC1D,QACD,CAEH,KAAK,SACL,cAAeD,EAAAA,iBAzCjB,EA2CE,EAAA,EAAA,KAAC,EAAD,EAAsB,CAAA,CACrB,EACc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useEditedContentRenderer.cjs","names":["ContentSelectorRenderer"],"sources":["../../../src/editor/useEditedContentRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getContent } from '@intlayer/core/interpreter';\nimport { useEditedContentActions } from '@intlayer/editor-react';\nimport type { KeyPath, Locale } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { ContentSelectorRenderer } from './ContentSelectorWrapper';\n\ntype EditedContentRendererProps = {\n dictionaryKey: string;\n keyPath: KeyPath[];\n children: string;\n locale?: Locale;\n};\n\nexport const useEditedContentRenderer = ({\n dictionaryKey,\n keyPath,\n children,\n}: EditedContentRendererProps) => {\n const editedContentContext = useEditedContentActions();\n\n if (editedContentContext) {\n const editedValue = editedContentContext.getEditedContentValue(\n dictionaryKey,\n keyPath\n ) as string;\n\n const value = editedValue ?? children;\n\n return value;\n }\n\n return children;\n};\n\nexport const EditedContentRenderer: FC<EditedContentRendererProps> = (\n props\n) => {\n const content = useEditedContentRenderer(props);\n\n if (typeof content === 'object') {\n const transformedEditedContent = getContent(content, props, props.locale);\n\n if (typeof transformedEditedContent !== 'string') {\n console.error(\n `Incorrect edited content format. Content type: ${typeof transformedEditedContent}. Expected string. Value ${JSON.stringify(transformedEditedContent)}`\n );\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {props.children}\n </ContentSelectorRenderer>\n );\n }\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {transformedEditedContent}\n </ContentSelectorRenderer>\n );\n }\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {content}\n </ContentSelectorRenderer>\n );\n};\n"],"mappings":"gRAeA,MAAa,GAA4B,CACvC,gBACA,UACA,cACgC,CAChC,IAAM,GAAA,EAAA,EAAA,0BAAgD,CAatD,OAXI,EACkB,EAAqB,sBACvC,EACA,EACD,EAE4B,EAKxB,GAGI,EACX,GACG,CACH,IAAM,EAAU,EAAyB,EAAM,CAE/C,GAAI,OAAO,GAAY,SAAU,CAC/B,IAAM,GAAA,EAAA,EAAA,YAAsC,EAAS,EAAO,EAAM,OAAO,CAczE,OAZI,OAAO,GAA6B,UAatC,EAAA,EAAA,eAACA,EAAAA,
|
|
1
|
+
{"version":3,"file":"useEditedContentRenderer.cjs","names":["ContentSelectorRenderer"],"sources":["../../../src/editor/useEditedContentRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getContent } from '@intlayer/core/interpreter';\nimport { useEditedContentActions } from '@intlayer/editor-react';\nimport type { KeyPath, Locale } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { ContentSelectorRenderer } from './ContentSelectorWrapper';\n\ntype EditedContentRendererProps = {\n dictionaryKey: string;\n keyPath: KeyPath[];\n children: string;\n locale?: Locale;\n};\n\nexport const useEditedContentRenderer = ({\n dictionaryKey,\n keyPath,\n children,\n}: EditedContentRendererProps) => {\n const editedContentContext = useEditedContentActions();\n\n if (editedContentContext) {\n const editedValue = editedContentContext.getEditedContentValue(\n dictionaryKey,\n keyPath\n ) as string;\n\n const value = editedValue ?? children;\n\n return value;\n }\n\n return children;\n};\n\nexport const EditedContentRenderer: FC<EditedContentRendererProps> = (\n props\n) => {\n const content = useEditedContentRenderer(props);\n\n if (typeof content === 'object') {\n const transformedEditedContent = getContent(content, props, props.locale);\n\n if (typeof transformedEditedContent !== 'string') {\n console.error(\n `Incorrect edited content format. Content type: ${typeof transformedEditedContent}. Expected string. Value ${JSON.stringify(transformedEditedContent)}`\n );\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {props.children}\n </ContentSelectorRenderer>\n );\n }\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {transformedEditedContent}\n </ContentSelectorRenderer>\n );\n }\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {content}\n </ContentSelectorRenderer>\n );\n};\n"],"mappings":"gRAeA,MAAa,GAA4B,CACvC,gBACA,UACA,cACgC,CAChC,IAAM,GAAA,EAAA,EAAA,0BAAgD,CAatD,OAXI,EACkB,EAAqB,sBACvC,EACA,EACD,EAE4B,EAKxB,GAGI,EACX,GACG,CACH,IAAM,EAAU,EAAyB,EAAM,CAE/C,GAAI,OAAO,GAAY,SAAU,CAC/B,IAAM,GAAA,EAAA,EAAA,YAAsC,EAAS,EAAO,EAAM,OAAO,CAczE,OAZI,OAAO,GAA6B,UAatC,EAAA,EAAA,eAACA,EAAAA,wBAAD,CAAyB,GAAI,EAAO,IAAK,EAAM,SAErB,CADvB,EACuB,EAd1B,QAAQ,MACN,kDAAkD,OAAO,EAAyB,2BAA2B,KAAK,UAAU,EAAyB,GACtJ,EAGC,EAAA,EAAA,eAACA,EAAAA,wBAAD,CAAyB,GAAI,EAAO,IAAK,EAAM,SAErB,CADvB,EAAM,SACiB,EAWhC,OACE,EAAA,EAAA,eAACA,EAAAA,wBAAD,CAAyB,GAAI,EAAO,IAAK,EAAM,SAErB,CADvB,EACuB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HTMLProvider.cjs","names":[],"sources":["../../../src/html/HTMLProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type FC,\n type PropsWithChildren,\n useContext,\n} from 'react';\nimport type { HTMLComponents } from './HTMLComponentTypes';\n\ntype HTMLContextValue = {\n components?: HTMLComponents<'permissive', {}>;\n};\n\ntype HTMLProviderProps = PropsWithChildren<{\n /**\n * Component overrides for HTML tags.\n */\n components?: HTMLComponents<'permissive', {}>;\n}>;\n\nconst HTMLContext = createContext<HTMLContextValue | undefined>(undefined);\n\nexport const useHTMLContext = () => useContext(HTMLContext);\n\nexport const HTMLProvider: FC<HTMLProviderProps> = ({\n children,\n components,\n}) => (\n <HTMLContext.Provider value={{ components }}>{children}</HTMLContext.Provider>\n);\n"],"mappings":"mLAqBA,MAAM,GAAA,EAAA,EAAA,eAA0D,IAAA,GAAU,CAE7D,OAAA,EAAA,EAAA,YAAkC,EAAY,CAE9C,GAAuC,CAClD,WACA,iBAEA,EAAA,EAAA,KAAC,EAAY,
|
|
1
|
+
{"version":3,"file":"HTMLProvider.cjs","names":[],"sources":["../../../src/html/HTMLProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type FC,\n type PropsWithChildren,\n useContext,\n} from 'react';\nimport type { HTMLComponents } from './HTMLComponentTypes';\n\ntype HTMLContextValue = {\n components?: HTMLComponents<'permissive', {}>;\n};\n\ntype HTMLProviderProps = PropsWithChildren<{\n /**\n * Component overrides for HTML tags.\n */\n components?: HTMLComponents<'permissive', {}>;\n}>;\n\nconst HTMLContext = createContext<HTMLContextValue | undefined>(undefined);\n\nexport const useHTMLContext = () => useContext(HTMLContext);\n\nexport const HTMLProvider: FC<HTMLProviderProps> = ({\n children,\n components,\n}) => (\n <HTMLContext.Provider value={{ components }}>{children}</HTMLContext.Provider>\n);\n"],"mappings":"mLAqBA,MAAM,GAAA,EAAA,EAAA,eAA0D,IAAA,GAAU,CAE7D,OAAA,EAAA,EAAA,YAAkC,EAAY,CAE9C,GAAuC,CAClD,WACA,iBAEA,EAAA,EAAA,KAAC,EAAY,SAAb,CAAsB,MAAO,CAAE,aAAY,CAAG,WAAgC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HTMLRenderer.cjs","names":["HTML_TAGS","Fragment","useHTMLContext"],"sources":["../../../src/html/HTMLRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML } from '@intlayer/core/interpreter';\nimport { HTML_TAGS } from '@intlayer/core/transpiler';\nimport { createElement, type FC, Fragment, type JSX } from 'react';\nimport type { HTMLComponents } from './HTMLComponentTypes';\nimport { useHTMLContext } from './HTMLProvider';\n\nconst createDefaultHTMLComponents = (): HTMLComponents<'permissive', {}> => {\n const components: HTMLComponents = {};\n\n for (const tag of HTML_TAGS) {\n components[tag] = ({ children, ...props }) =>\n createElement(tag, props as any, children);\n }\n\n return components as HTMLComponents<'permissive', {}>;\n};\n\nexport const defaultHTMLComponents = createDefaultHTMLComponents();\n\nexport type RenderHTMLProps = {\n /**\n * Component overrides for HTML tags.\n * Allows you to customize how specific HTML elements are rendered.\n */\n components?: HTMLComponents<'permissive', {}>;\n};\n\n/**\n * Renders HTML-like content to JSX with the provided components.\n *\n * This function does not use context from HTMLProvider. Use `useHTMLRenderer`\n * hook if you want to leverage provider context.\n */\nexport const renderHTML = (\n content: string,\n { components }: RenderHTMLProps = {}\n): JSX.Element => {\n const mergedComponents = {\n ...defaultHTMLComponents,\n ...components,\n };\n\n // Wrap all components to ensure they are rendered via React.createElement\n const wrappedComponents = Object.fromEntries(\n Object.entries(mergedComponents)\n .filter(([, Component]) => Component)\n .map(([key, Component]) => [\n key,\n (props: any) => createElement(Component as any, props),\n ])\n );\n\n return <Fragment>{getHTML(content, wrappedComponents)}</Fragment>;\n};\n\n/**\n * Hook that returns a function to render HTML content.\n *\n * This hook considers the configuration from the `HTMLProvider` context if available,\n * falling back to the provided components.\n */\nexport const useHTMLRenderer = ({ components }: RenderHTMLProps = {}) => {\n const context = useHTMLContext();\n\n return (content: string) => {\n return renderHTML(content, {\n components: {\n ...context?.components,\n ...components,\n },\n });\n };\n};\n\nexport type HTMLRendererProps = RenderHTMLProps & {\n /**\n * The HTML content to render as a string.\n */\n children: string;\n};\n\n/**\n * React component that renders HTML-like content to JSX.\n *\n * This component uses the components from the `HTMLProvider` context\n * if available.\n */\nexport const HTMLRenderer: FC<HTMLRendererProps> = ({\n children = '',\n components,\n}) => {\n const render = useHTMLRenderer({ components });\n\n return render(children);\n};\n"],"mappings":"wSAmBA,MAAa,OAX+D,CAC1E,IAAM,EAA6B,EAAE,CAErC,IAAK,IAAM,KAAOA,EAAAA,UAChB,EAAW,IAAQ,CAAE,WAAU,GAAG,MAAA,EAAA,EAAA,eAClB,EAAK,EAAc,EAAS,CAG9C,OAAO,KAGyD,CAgBrD,GACX,EACA,CAAE,cAAgC,EAAE,GACpB,CAChB,IAAM,EAAmB,CACvB,GAAG,EACH,GAAG,EACJ,CAYD,OAAO,EAAA,EAAA,KAACC,EAAAA,
|
|
1
|
+
{"version":3,"file":"HTMLRenderer.cjs","names":["HTML_TAGS","Fragment","useHTMLContext"],"sources":["../../../src/html/HTMLRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML } from '@intlayer/core/interpreter';\nimport { HTML_TAGS } from '@intlayer/core/transpiler';\nimport { createElement, type FC, Fragment, type JSX } from 'react';\nimport type { HTMLComponents } from './HTMLComponentTypes';\nimport { useHTMLContext } from './HTMLProvider';\n\nconst createDefaultHTMLComponents = (): HTMLComponents<'permissive', {}> => {\n const components: HTMLComponents = {};\n\n for (const tag of HTML_TAGS) {\n components[tag] = ({ children, ...props }) =>\n createElement(tag, props as any, children);\n }\n\n return components as HTMLComponents<'permissive', {}>;\n};\n\nexport const defaultHTMLComponents = createDefaultHTMLComponents();\n\nexport type RenderHTMLProps = {\n /**\n * Component overrides for HTML tags.\n * Allows you to customize how specific HTML elements are rendered.\n */\n components?: HTMLComponents<'permissive', {}>;\n};\n\n/**\n * Renders HTML-like content to JSX with the provided components.\n *\n * This function does not use context from HTMLProvider. Use `useHTMLRenderer`\n * hook if you want to leverage provider context.\n */\nexport const renderHTML = (\n content: string,\n { components }: RenderHTMLProps = {}\n): JSX.Element => {\n const mergedComponents = {\n ...defaultHTMLComponents,\n ...components,\n };\n\n // Wrap all components to ensure they are rendered via React.createElement\n const wrappedComponents = Object.fromEntries(\n Object.entries(mergedComponents)\n .filter(([, Component]) => Component)\n .map(([key, Component]) => [\n key,\n (props: any) => createElement(Component as any, props),\n ])\n );\n\n return <Fragment>{getHTML(content, wrappedComponents)}</Fragment>;\n};\n\n/**\n * Hook that returns a function to render HTML content.\n *\n * This hook considers the configuration from the `HTMLProvider` context if available,\n * falling back to the provided components.\n */\nexport const useHTMLRenderer = ({ components }: RenderHTMLProps = {}) => {\n const context = useHTMLContext();\n\n return (content: string) => {\n return renderHTML(content, {\n components: {\n ...context?.components,\n ...components,\n },\n });\n };\n};\n\nexport type HTMLRendererProps = RenderHTMLProps & {\n /**\n * The HTML content to render as a string.\n */\n children: string;\n};\n\n/**\n * React component that renders HTML-like content to JSX.\n *\n * This component uses the components from the `HTMLProvider` context\n * if available.\n */\nexport const HTMLRenderer: FC<HTMLRendererProps> = ({\n children = '',\n components,\n}) => {\n const render = useHTMLRenderer({ components });\n\n return render(children);\n};\n"],"mappings":"wSAmBA,MAAa,OAX+D,CAC1E,IAAM,EAA6B,EAAE,CAErC,IAAK,IAAM,KAAOA,EAAAA,UAChB,EAAW,IAAQ,CAAE,WAAU,GAAG,MAAA,EAAA,EAAA,eAClB,EAAK,EAAc,EAAS,CAG9C,OAAO,KAGyD,CAgBrD,GACX,EACA,CAAE,cAAgC,EAAE,GACpB,CAChB,IAAM,EAAmB,CACvB,GAAG,EACH,GAAG,EACJ,CAYD,OAAO,EAAA,EAAA,KAACC,EAAAA,SAAD,CAAA,UAAA,EAAA,EAAA,SAAmB,EATA,OAAO,YAC/B,OAAO,QAAQ,EAAiB,CAC7B,QAAQ,EAAG,KAAe,EAAU,CACpC,KAAK,CAAC,EAAK,KAAe,CACzB,EACC,IAAA,EAAA,EAAA,eAA6B,EAAkB,EAAM,CACvD,CAAC,CACL,CAEoD,CAAY,CAAA,EAStD,GAAmB,CAAE,cAAgC,EAAE,GAAK,CACvE,IAAM,EAAUC,EAAAA,gBAAgB,CAEhC,MAAQ,IACC,EAAW,EAAS,CACzB,WAAY,CACV,GAAG,GAAS,WACZ,GAAG,EACJ,CACF,CAAC,EAiBO,GAAuC,CAClD,WAAW,GACX,gBAEe,EAAgB,CAAE,aAAY,CAAC,CAEhC,EAAS"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HTMLRendererPlugin.cjs","names":["useHTMLContext","useEditedContentRenderer","defaultHTMLComponents","ContentSelectorRenderer"],"sources":["../../../src/html/HTMLRendererPlugin.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML } from '@intlayer/core/interpreter';\nimport type { KeyPath, Locale } from '@intlayer/types';\nimport { createElement, type FC, type ReactNode } from 'react';\nimport { ContentSelectorRenderer } from '../editor';\nimport { useEditedContentRenderer } from '../editor/useEditedContentRenderer';\nimport { useHTMLContext } from './HTMLProvider';\nimport { defaultHTMLComponents } from './HTMLRenderer';\nimport type { ReactComponentProps } from './types';\n\ntype HTMLRendererPluginProps = {\n dictionaryKey: string;\n keyPath: KeyPath[];\n html: string;\n locale?: Locale;\n userComponents?: Record<string, any>;\n};\n\nexport const HTMLRendererPlugin: FC<HTMLRendererPluginProps> = (\n props\n): ReactNode => {\n const { dictionaryKey, keyPath, html, userComponents } = props;\n const context = useHTMLContext();\n const globalComponents = context?.components || {};\n\n const editedContentContext = useEditedContentRenderer({\n dictionaryKey: dictionaryKey ?? '',\n keyPath: keyPath ?? [],\n children: html,\n });\n\n const contentToRender =\n typeof editedContentContext === 'string' ? editedContentContext : html;\n\n const mergedComponents = {\n ...defaultHTMLComponents,\n ...globalComponents,\n ...userComponents,\n };\n\n // Wrap all components to ensure they are rendered via React.createElement\n // This is important because it allows React to handle the component's lifecycle,\n // hooks, and Babel-injected variables correctly.\n const wrappedComponents = Object.fromEntries(\n Object.entries(mergedComponents)\n .filter(([, Component]) => Component)\n .map(([key, Component]) => [\n key,\n (props: ReactComponentProps) => createElement(Component, props),\n ])\n );\n\n return (\n <ContentSelectorRenderer {...props}>\n {getHTML(contentToRender, wrappedComponents)}\n </ContentSelectorRenderer>\n );\n};\n"],"mappings":"uYAmBA,MAAa,EACX,GACc,CACd,GAAM,CAAE,gBAAe,UAAS,OAAM,kBAAmB,EAEnD,EADUA,EAAAA,gBAAgB,EACE,YAAc,EAAE,CAE5C,EAAuBC,EAAAA,yBAAyB,CACpD,cAAe,GAAiB,GAChC,QAAS,GAAW,EAAE,CACtB,SAAU,EACX,CAAC,CAEI,EACJ,OAAO,GAAyB,SAAW,EAAuB,EAE9D,EAAmB,CACvB,GAAGC,EAAAA,sBACH,GAAG,EACH,GAAG,EACJ,CAKK,EAAoB,OAAO,YAC/B,OAAO,QAAQ,EAAiB,CAC7B,QAAQ,EAAG,KAAe,EAAU,CACpC,KAAK,CAAC,EAAK,KAAe,CACzB,EACC,IAAA,EAAA,EAAA,eAA6C,EAAW,EAAM,CAChE,CAAC,CACL,CAED,OACE,EAAA,EAAA,KAACC,EAAAA,
|
|
1
|
+
{"version":3,"file":"HTMLRendererPlugin.cjs","names":["useHTMLContext","useEditedContentRenderer","defaultHTMLComponents","ContentSelectorRenderer"],"sources":["../../../src/html/HTMLRendererPlugin.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML } from '@intlayer/core/interpreter';\nimport type { KeyPath, Locale } from '@intlayer/types';\nimport { createElement, type FC, type ReactNode } from 'react';\nimport { ContentSelectorRenderer } from '../editor';\nimport { useEditedContentRenderer } from '../editor/useEditedContentRenderer';\nimport { useHTMLContext } from './HTMLProvider';\nimport { defaultHTMLComponents } from './HTMLRenderer';\nimport type { ReactComponentProps } from './types';\n\ntype HTMLRendererPluginProps = {\n dictionaryKey: string;\n keyPath: KeyPath[];\n html: string;\n locale?: Locale;\n userComponents?: Record<string, any>;\n};\n\nexport const HTMLRendererPlugin: FC<HTMLRendererPluginProps> = (\n props\n): ReactNode => {\n const { dictionaryKey, keyPath, html, userComponents } = props;\n const context = useHTMLContext();\n const globalComponents = context?.components || {};\n\n const editedContentContext = useEditedContentRenderer({\n dictionaryKey: dictionaryKey ?? '',\n keyPath: keyPath ?? [],\n children: html,\n });\n\n const contentToRender =\n typeof editedContentContext === 'string' ? editedContentContext : html;\n\n const mergedComponents = {\n ...defaultHTMLComponents,\n ...globalComponents,\n ...userComponents,\n };\n\n // Wrap all components to ensure they are rendered via React.createElement\n // This is important because it allows React to handle the component's lifecycle,\n // hooks, and Babel-injected variables correctly.\n const wrappedComponents = Object.fromEntries(\n Object.entries(mergedComponents)\n .filter(([, Component]) => Component)\n .map(([key, Component]) => [\n key,\n (props: ReactComponentProps) => createElement(Component, props),\n ])\n );\n\n return (\n <ContentSelectorRenderer {...props}>\n {getHTML(contentToRender, wrappedComponents)}\n </ContentSelectorRenderer>\n );\n};\n"],"mappings":"uYAmBA,MAAa,EACX,GACc,CACd,GAAM,CAAE,gBAAe,UAAS,OAAM,kBAAmB,EAEnD,EADUA,EAAAA,gBAAgB,EACE,YAAc,EAAE,CAE5C,EAAuBC,EAAAA,yBAAyB,CACpD,cAAe,GAAiB,GAChC,QAAS,GAAW,EAAE,CACtB,SAAU,EACX,CAAC,CAEI,EACJ,OAAO,GAAyB,SAAW,EAAuB,EAE9D,EAAmB,CACvB,GAAGC,EAAAA,sBACH,GAAG,EACH,GAAG,EACJ,CAKK,EAAoB,OAAO,YAC/B,OAAO,QAAQ,EAAiB,CAC7B,QAAQ,EAAG,KAAe,EAAU,CACpC,KAAK,CAAC,EAAK,KAAe,CACzB,EACC,IAAA,EAAA,EAAA,eAA6C,EAAW,EAAM,CAChE,CAAC,CACL,CAED,OACE,EAAA,EAAA,KAACC,EAAAA,wBAAD,CAAyB,GAAI,yBAClB,EAAiB,EAAkB,CACpB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MarkdownProvider.cjs","names":["compiler"],"sources":["../../../src/markdown/MarkdownProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type FC,\n type HTMLAttributes,\n type PropsWithChildren,\n type ReactNode,\n useContext,\n} from 'react';\nimport type { HTMLComponents } from '../html/HTMLComponentTypes';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\nexport type MarkdownProviderOptions = {\n /** Forces the compiler to always output content with a block-level wrapper. */\n forceBlock?: boolean;\n /** Forces the compiler to always output content with an inline wrapper. */\n forceInline?: boolean;\n /** Whether to preserve frontmatter in the markdown content. */\n preserveFrontmatter?: boolean;\n /** Whether to use the GitHub Tag Filter for security. */\n tagfilter?: boolean;\n};\n\ntype MarkdownContextValue = {\n renderMarkdown: (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => ReactNode;\n};\n\ntype MarkdownProviderProps = PropsWithChildren<\n MarkdownProviderOptions & {\n components?: HTMLComponents<'permissive', {}>;\n wrapper?: FC<HTMLAttributes<HTMLElement>>;\n renderMarkdown?: (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => ReactNode;\n }\n>;\n\nconst MarkdownContext = createContext<MarkdownContextValue | undefined>(\n undefined\n);\n\nexport const useMarkdownContext = () => useContext(MarkdownContext);\n\nconst mergeOptions = (\n baseOptions: MarkdownRendererOptions,\n options: MarkdownProviderOptions = {},\n components: HTMLComponents<'permissive', {}> = {},\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n): MarkdownRendererOptions => {\n return {\n ...baseOptions,\n ...options,\n forceBlock: options.forceBlock ?? baseOptions.forceBlock,\n forceInline: options.forceInline ?? baseOptions.forceInline,\n preserveFrontmatter:\n options.preserveFrontmatter ?? baseOptions.preserveFrontmatter,\n tagfilter: options.tagfilter ?? baseOptions.tagfilter,\n wrapper: wrapper || baseOptions.wrapper,\n\n forceWrapper: !!(wrapper || baseOptions.wrapper),\n components: { ...baseOptions.components, ...components },\n };\n};\n\n/**\n * Provider for the MarkdownRenderer component.\n *\n * It will provide the `renderMarkdown` function to the context, which can be used to render markdown.\n *\n * ```tsx\n * const content = useIntlayer('app');\n *\n * return (\n * <div>\n * {content.markdown} // Will be rendered with the components and options provided to the MarkdownProvider\n * </div>\n * );\n * ```\n *\n * @example\n * ```tsx\n * <MarkdownProvider components={{ h1: CustomHeading }}>\n * <MarkdownRenderer>\n * {markdownContent}\n * </MarkdownRenderer>\n * </MarkdownProvider>\n * ```\n */\nexport const MarkdownProvider: FC<MarkdownProviderProps> = ({\n children,\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n renderMarkdown: customRenderFn,\n}) => {\n const baseOptions: MarkdownRendererOptions = {\n components,\n forceBlock,\n forceInline,\n wrapper,\n forceWrapper: !!wrapper,\n preserveFrontmatter,\n tagfilter,\n };\n\n // Standard internal renderer\n const defaultRenderMarkdown = (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => {\n const mergedOptions = mergeOptions(\n baseOptions,\n options,\n components,\n wrapper\n );\n\n return compiler(markdown, mergedOptions);\n };\n\n // Wrapper for user-provided custom renderer\n // Note: We wrap in a clean Provider to prevent infinite recursion\n const customRenderMarkdownWrapper = (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => (\n <MarkdownContext.Provider value={undefined}>\n {customRenderFn?.(markdown, options, components, wrapper)}\n </MarkdownContext.Provider>\n );\n\n return (\n <MarkdownContext.Provider\n value={{\n renderMarkdown: customRenderFn\n ? customRenderMarkdownWrapper\n : defaultRenderMarkdown,\n }}\n >\n {children}\n </MarkdownContext.Provider>\n );\n};\n"],"mappings":"sNA8CA,MAAM,GAAA,EAAA,EAAA,eACJ,IAAA,GACD,CAEY,OAAA,EAAA,EAAA,YAAsC,EAAgB,CAE7D,GACJ,EACA,EAAmC,EAAE,CACrC,EAA+C,EAAE,CACjD,KAEO,CACL,GAAG,EACH,GAAG,EACH,WAAY,EAAQ,YAAc,EAAY,WAC9C,YAAa,EAAQ,aAAe,EAAY,YAChD,oBACE,EAAQ,qBAAuB,EAAY,oBAC7C,UAAW,EAAQ,WAAa,EAAY,UAC5C,QAAS,GAAW,EAAY,QAEhC,aAAc,CAAC,EAAE,GAAW,EAAY,SACxC,WAAY,CAAE,GAAG,EAAY,WAAY,GAAG,EAAY,CACzD,EA2BU,GAA+C,CAC1D,WACA,aACA,UACA,aACA,cACA,sBACA,YACA,eAAgB,KACZ,CACJ,IAAM,EAAuC,CAC3C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAgCD,OACE,EAAA,EAAA,KAAC,EAAgB,
|
|
1
|
+
{"version":3,"file":"MarkdownProvider.cjs","names":["compiler"],"sources":["../../../src/markdown/MarkdownProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type FC,\n type HTMLAttributes,\n type PropsWithChildren,\n type ReactNode,\n useContext,\n} from 'react';\nimport type { HTMLComponents } from '../html/HTMLComponentTypes';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\nexport type MarkdownProviderOptions = {\n /** Forces the compiler to always output content with a block-level wrapper. */\n forceBlock?: boolean;\n /** Forces the compiler to always output content with an inline wrapper. */\n forceInline?: boolean;\n /** Whether to preserve frontmatter in the markdown content. */\n preserveFrontmatter?: boolean;\n /** Whether to use the GitHub Tag Filter for security. */\n tagfilter?: boolean;\n};\n\ntype MarkdownContextValue = {\n renderMarkdown: (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => ReactNode;\n};\n\ntype MarkdownProviderProps = PropsWithChildren<\n MarkdownProviderOptions & {\n components?: HTMLComponents<'permissive', {}>;\n wrapper?: FC<HTMLAttributes<HTMLElement>>;\n renderMarkdown?: (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => ReactNode;\n }\n>;\n\nconst MarkdownContext = createContext<MarkdownContextValue | undefined>(\n undefined\n);\n\nexport const useMarkdownContext = () => useContext(MarkdownContext);\n\nconst mergeOptions = (\n baseOptions: MarkdownRendererOptions,\n options: MarkdownProviderOptions = {},\n components: HTMLComponents<'permissive', {}> = {},\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n): MarkdownRendererOptions => {\n return {\n ...baseOptions,\n ...options,\n forceBlock: options.forceBlock ?? baseOptions.forceBlock,\n forceInline: options.forceInline ?? baseOptions.forceInline,\n preserveFrontmatter:\n options.preserveFrontmatter ?? baseOptions.preserveFrontmatter,\n tagfilter: options.tagfilter ?? baseOptions.tagfilter,\n wrapper: wrapper || baseOptions.wrapper,\n\n forceWrapper: !!(wrapper || baseOptions.wrapper),\n components: { ...baseOptions.components, ...components },\n };\n};\n\n/**\n * Provider for the MarkdownRenderer component.\n *\n * It will provide the `renderMarkdown` function to the context, which can be used to render markdown.\n *\n * ```tsx\n * const content = useIntlayer('app');\n *\n * return (\n * <div>\n * {content.markdown} // Will be rendered with the components and options provided to the MarkdownProvider\n * </div>\n * );\n * ```\n *\n * @example\n * ```tsx\n * <MarkdownProvider components={{ h1: CustomHeading }}>\n * <MarkdownRenderer>\n * {markdownContent}\n * </MarkdownRenderer>\n * </MarkdownProvider>\n * ```\n */\nexport const MarkdownProvider: FC<MarkdownProviderProps> = ({\n children,\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n renderMarkdown: customRenderFn,\n}) => {\n const baseOptions: MarkdownRendererOptions = {\n components,\n forceBlock,\n forceInline,\n wrapper,\n forceWrapper: !!wrapper,\n preserveFrontmatter,\n tagfilter,\n };\n\n // Standard internal renderer\n const defaultRenderMarkdown = (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => {\n const mergedOptions = mergeOptions(\n baseOptions,\n options,\n components,\n wrapper\n );\n\n return compiler(markdown, mergedOptions);\n };\n\n // Wrapper for user-provided custom renderer\n // Note: We wrap in a clean Provider to prevent infinite recursion\n const customRenderMarkdownWrapper = (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => (\n <MarkdownContext.Provider value={undefined}>\n {customRenderFn?.(markdown, options, components, wrapper)}\n </MarkdownContext.Provider>\n );\n\n return (\n <MarkdownContext.Provider\n value={{\n renderMarkdown: customRenderFn\n ? customRenderMarkdownWrapper\n : defaultRenderMarkdown,\n }}\n >\n {children}\n </MarkdownContext.Provider>\n );\n};\n"],"mappings":"sNA8CA,MAAM,GAAA,EAAA,EAAA,eACJ,IAAA,GACD,CAEY,OAAA,EAAA,EAAA,YAAsC,EAAgB,CAE7D,GACJ,EACA,EAAmC,EAAE,CACrC,EAA+C,EAAE,CACjD,KAEO,CACL,GAAG,EACH,GAAG,EACH,WAAY,EAAQ,YAAc,EAAY,WAC9C,YAAa,EAAQ,aAAe,EAAY,YAChD,oBACE,EAAQ,qBAAuB,EAAY,oBAC7C,UAAW,EAAQ,WAAa,EAAY,UAC5C,QAAS,GAAW,EAAY,QAEhC,aAAc,CAAC,EAAE,GAAW,EAAY,SACxC,WAAY,CAAE,GAAG,EAAY,WAAY,GAAG,EAAY,CACzD,EA2BU,GAA+C,CAC1D,WACA,aACA,UACA,aACA,cACA,sBACA,YACA,eAAgB,KACZ,CACJ,IAAM,EAAuC,CAC3C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAgCD,OACE,EAAA,EAAA,KAAC,EAAgB,SAAjB,CACE,MAAO,CACL,eAAgB,GAbpB,EACA,EACA,EACA,KAEA,EAAA,EAAA,KAAC,EAAgB,SAAjB,CAA0B,MAAO,IAAA,YAC9B,IAAiB,EAAU,EAAS,EAAY,EAAQ,CAChC,CAAA,EAzB3B,EACA,EACA,EACA,IASOA,EAAAA,SAAS,EAPM,EACpB,EACA,EACA,EACA,EACD,CAEuC,CAsBrC,CAEA,WACwB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MarkdownRenderer.cjs","names":["compiler","useMarkdownContext"],"sources":["../../../src/markdown/MarkdownRenderer.tsx"],"sourcesContent":["import type { FC, HTMLAttributes, JSX, ReactNode } from 'react';\nimport type { HTMLComponents } from '../html/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":"0NA+EA,MAAa,GACX,EACA,CACE,aACA,UACA,aACA,cACA,sBACA,aACuB,EAAE,GAapBA,EAAAA,SAAS,EAViC,CAC/C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAEwC,CAgD9B,GAAuB,CAClC,aACA,UACA,aACA,cACA,sBACA,aACuB,EAAE,GAAK,CAC9B,IAAM,EAAUC,EAAAA,oBAAoB,CAEpC,MAAQ,IACF,EACK,EAAQ,eACb,EACA,CACE,aACA,cACA,sBACA,YACD,CACD,EACA,EACD,CAGI,EAAe,EAAS,CAC7B,aACA,UACA,aACA,cACA,sBACA,YACD,CAAC,EA6HO,GAA+C,CAC1D,WAAW,GACX,aACA,UACA,aACA,cACA,sBACA,YACA,oBACI,CACJ,IAAM,EAAUA,EAAAA,oBAAoB,CA8CpC,OA5CI,GAEA,EAAA,EAAA,KAAA,EAAA,SAAA,CAAA,SACG,EAAe,EAAU,CACxB,aACA,UACA,aACA,cACA,sBACA,YACD,CAAC,CAAA,CACD,CAIH,GAEA,EAAA,EAAA,KAAA,EAAA,SAAA,CAAA,SACG,EAAQ,eACP,EACA,CACE,aACA,cACA,sBACA,YACD,CACD,EACA,EACD,CAAA,CACA,EAeA,EAAA,EAAA,KAAA,EAAA,SAAA,CAAA,SAAGD,EAAAA,SAAS,EAV8B,CAC/C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAE4C,CAAA,CAAI"}
|
|
1
|
+
{"version":3,"file":"MarkdownRenderer.cjs","names":["compiler","useMarkdownContext"],"sources":["../../../src/markdown/MarkdownRenderer.tsx"],"sourcesContent":["import type { FC, HTMLAttributes, JSX, ReactNode } from 'react';\nimport type { HTMLComponents } from '../html/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":"0NA+EA,MAAa,GACX,EACA,CACE,aACA,UACA,aACA,cACA,sBACA,aACuB,EAAE,GAapBA,EAAAA,SAAS,EAViC,CAC/C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAEwC,CAgD9B,GAAuB,CAClC,aACA,UACA,aACA,cACA,sBACA,aACuB,EAAE,GAAK,CAC9B,IAAM,EAAUC,EAAAA,oBAAoB,CAEpC,MAAQ,IACF,EACK,EAAQ,eACb,EACA,CACE,aACA,cACA,sBACA,YACD,CACD,EACA,EACD,CAGI,EAAe,EAAS,CAC7B,aACA,UACA,aACA,cACA,sBACA,YACD,CAAC,EA6HO,GAA+C,CAC1D,WAAW,GACX,aACA,UACA,aACA,cACA,sBACA,YACA,oBACI,CACJ,IAAM,EAAUA,EAAAA,oBAAoB,CA8CpC,OA5CI,GAEA,EAAA,EAAA,KAAA,EAAA,SAAA,CAAA,SACG,EAAe,EAAU,CACxB,aACA,UACA,aACA,cACA,sBACA,YACD,CAAC,CACD,CAAA,CAIH,GAEA,EAAA,EAAA,KAAA,EAAA,SAAA,CAAA,SACG,EAAQ,eACP,EACA,CACE,aACA,cACA,sBACA,YACD,CACD,EACA,EACD,CACA,CAAA,EAeA,EAAA,EAAA,KAAA,EAAA,SAAA,CAAA,SAAGD,EAAAA,SAAS,EAV8B,CAC/C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAE4C,CAAI,CAAA"}
|
package/dist/cjs/plugins.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"plugins.cjs","names":["renderIntlayerNode","EditedContentRenderer","ContentSelectorRenderer","renderReactElement","Fragment","NodeType","MarkdownMetadataRenderer","MarkdownRendererPlugin","HTMLRendererPlugin"],"sources":["../../src/plugins.tsx"],"sourcesContent":["import {\n type DeepTransformContent as DeepTransformContentCore,\n type IInterpreterPluginState as IInterpreterPluginStateCore,\n type Plugins,\n splitInsertionTemplate,\n} from '@intlayer/core/interpreter';\nimport { getMarkdownMetadata } from '@intlayer/core/markdown';\nimport type {\n HTMLContent,\n InsertionContent,\n MarkdownContent,\n} from '@intlayer/core/transpiler';\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 { HTMLComponents } from './html/HTMLComponentTypes';\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> = T extends {\n nodeType: NodeType | string;\n [NodeType.Insertion]: string;\n fields: readonly string[];\n}\n ? <V extends { [K in T['fields'][number]]: ReactNode }>(\n values: V\n ) => V[keyof V] extends string | number\n ? IntlayerNode<string>\n : IntlayerNode<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 const result = deepTransformNode(children, {\n ...props,\n children,\n keyPath: newKeyPath,\n plugins: [insertionStringPlugin, ...(props.plugins ?? [])],\n });\n\n if (\n typeof children === 'object' &&\n children !== null &&\n 'nodeType' in children &&\n [NodeType.Enumeration, NodeType.Condition].includes(\n children.nodeType as NodeType\n )\n ) {\n return (values: any) => (arg: any) => {\n const func = result as Function;\n const inner = func(arg);\n\n if (typeof inner === 'function') {\n return inner(values);\n }\n return inner;\n };\n }\n\n return result;\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 tags?: infer U;\n metadata?: infer V;\n}\n ? IntlayerNode<\n M,\n {\n use: (components?: HTMLComponents<'permissive', U>) => ReactNode;\n metadata: DeepTransformContent<V>;\n }\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 ? IntlayerNode<\n I,\n {\n use: (components?: HTMLComponents<'permissive', U>) => ReactNode;\n }\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 = Omit<\n IInterpreterPluginStateCore,\n 'insertion' // Remove insertion type from core package\n> & {\n reactNode: true;\n reactIntlayerNode: true;\n reactMarkdown: true;\n reactHtml: true;\n reactInsertion: 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.cjs","names":["renderIntlayerNode","EditedContentRenderer","ContentSelectorRenderer","renderReactElement","Fragment","NodeType","MarkdownMetadataRenderer","MarkdownRendererPlugin","HTMLRendererPlugin"],"sources":["../../src/plugins.tsx"],"sourcesContent":["import {\n type DeepTransformContent as DeepTransformContentCore,\n type IInterpreterPluginState as IInterpreterPluginStateCore,\n type Plugins,\n splitInsertionTemplate,\n} from '@intlayer/core/interpreter';\nimport { getMarkdownMetadata } from '@intlayer/core/markdown';\nimport type {\n HTMLContent,\n InsertionContent,\n MarkdownContent,\n} from '@intlayer/core/transpiler';\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 { HTMLComponents } from './html/HTMLComponentTypes';\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> = T extends {\n nodeType: NodeType | string;\n [NodeType.Insertion]: string;\n fields: readonly string[];\n}\n ? <V extends { [K in T['fields'][number]]: ReactNode }>(\n values: V\n ) => V[keyof V] extends string | number\n ? IntlayerNode<string>\n : IntlayerNode<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 const result = deepTransformNode(children, {\n ...props,\n children,\n keyPath: newKeyPath,\n plugins: [insertionStringPlugin, ...(props.plugins ?? [])],\n });\n\n if (\n typeof children === 'object' &&\n children !== null &&\n 'nodeType' in children &&\n [NodeType.Enumeration, NodeType.Condition].includes(\n children.nodeType as NodeType\n )\n ) {\n return (values: any) => (arg: any) => {\n const func = result as Function;\n const inner = func(arg);\n\n if (typeof inner === 'function') {\n return inner(values);\n }\n return inner;\n };\n }\n\n return result;\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 tags?: infer U;\n metadata?: infer V;\n}\n ? IntlayerNode<\n M,\n {\n use: (components?: HTMLComponents<'permissive', U>) => ReactNode;\n metadata: DeepTransformContent<V>;\n }\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 ? IntlayerNode<\n I,\n {\n use: (components?: HTMLComponents<'permissive', U>) => ReactNode;\n }\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 = Omit<\n IInterpreterPluginStateCore,\n 'insertion' // Remove insertion type from core package\n> & {\n reactNode: true;\n reactIntlayerNode: true;\n reactMarkdown: true;\n reactHtml: true;\n reactInsertion: 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 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IntlayerServerProvider.cjs","names":["configuration","createServerContext","getServerContext"],"sources":["../../../src/server/IntlayerServerProvider.tsx"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type { LocalesValues } from '@intlayer/types';\n\nimport type { FC, PropsWithChildren } from 'react';\nimport { createServerContext, getServerContext } from './serverContext';\n\nconst { defaultLocale } = configuration?.internationalization ?? {};\n\n/**\n * Context that store the current locale on the server side\n */\nexport const IntlayerServerContext =\n createServerContext<LocalesValues>(defaultLocale);\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayer = () => getServerContext(IntlayerServerContext);\n\n/**\n * Get the current locale\n */\nexport const locale = getServerContext(IntlayerServerContext);\n\nexport type IntlayerServerProviderProps = PropsWithChildren & {\n locale?: LocalesValues;\n};\n\n/**\n * Provider that store the current locale on the server side\n */\nexport const IntlayerServerProvider: FC<IntlayerServerProviderProps> = ({\n children,\n locale = defaultLocale,\n}) => (\n <IntlayerServerContext.Provider value={locale}>\n {children}\n </IntlayerServerContext.Provider>\n);\n"],"mappings":"+OAMA,KAAM,CAAE,iBAAkBA,EAAAA,SAAe,sBAAwB,EAAE,CAKtD,EACXC,EAAAA,oBAAmC,EAAc,CAKtC,MAAoBC,EAAAA,iBAAiB,EAAsB,CAK3D,EAASA,EAAAA,iBAAiB,EAAsB,CAShD,GAA2D,CACtE,WACA,SAAS,MAET,EAAA,EAAA,KAAC,EAAsB,
|
|
1
|
+
{"version":3,"file":"IntlayerServerProvider.cjs","names":["configuration","createServerContext","getServerContext"],"sources":["../../../src/server/IntlayerServerProvider.tsx"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type { LocalesValues } from '@intlayer/types';\n\nimport type { FC, PropsWithChildren } from 'react';\nimport { createServerContext, getServerContext } from './serverContext';\n\nconst { defaultLocale } = configuration?.internationalization ?? {};\n\n/**\n * Context that store the current locale on the server side\n */\nexport const IntlayerServerContext =\n createServerContext<LocalesValues>(defaultLocale);\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayer = () => getServerContext(IntlayerServerContext);\n\n/**\n * Get the current locale\n */\nexport const locale = getServerContext(IntlayerServerContext);\n\nexport type IntlayerServerProviderProps = PropsWithChildren & {\n locale?: LocalesValues;\n};\n\n/**\n * Provider that store the current locale on the server side\n */\nexport const IntlayerServerProvider: FC<IntlayerServerProviderProps> = ({\n children,\n locale = defaultLocale,\n}) => (\n <IntlayerServerContext.Provider value={locale}>\n {children}\n </IntlayerServerContext.Provider>\n);\n"],"mappings":"+OAMA,KAAM,CAAE,iBAAkBA,EAAAA,SAAe,sBAAwB,EAAE,CAKtD,EACXC,EAAAA,oBAAmC,EAAc,CAKtC,MAAoBC,EAAAA,iBAAiB,EAAsB,CAK3D,EAASA,EAAAA,iBAAiB,EAAsB,CAShD,GAA2D,CACtE,WACA,SAAS,MAET,EAAA,EAAA,KAAC,EAAsB,SAAvB,CAAgC,MAAO,EACpC,WAC8B,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"t.cjs","names":["getServerContext","IntlayerServerContext"],"sources":["../../../src/server/t.ts"],"sourcesContent":["import { getTranslation } from '@intlayer/core/interpreter';\nimport type {
|
|
1
|
+
{"version":3,"file":"t.cjs","names":["getServerContext","IntlayerServerContext"],"sources":["../../../src/server/t.ts"],"sourcesContent":["import { getTranslation } from '@intlayer/core/interpreter';\nimport type {\n DeclaredLocales,\n LocalesValues,\n StrictModeLocaleMap,\n} from '@intlayer/types';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\n\n/**\n * On the server side, hook to get the translation content based on the locale\n *\n * If not locale found, it will return the content related to the default locale.\n *\n * Return either the content editor, or the content itself depending on the configuration.\n *\n * Usage:\n *\n * ```ts\n * const content = t<string>({\n * en: 'Hello',\n * fr: 'Bonjour',\n * }, 'fr');\n * // 'Bonjour'\n * ```\n *\n * Using TypeScript:\n * - this function will require each locale to be defined if defined in the project configuration.\n * - If a locale is missing, it will make each existing locale optional and raise an error if the locale is not found.\n */\nexport const t = <Content = string, L extends LocalesValues = DeclaredLocales>(\n multilangContent: StrictModeLocaleMap<Content>,\n locale?: L\n) => {\n const currentLocale = getServerContext<LocalesValues>(IntlayerServerContext);\n const localeTarget = locale ?? (currentLocale as LocalesValues);\n\n return getTranslation<Content>(multilangContent, localeTarget);\n};\n"],"mappings":"6OA8BA,MAAa,GACX,EACA,IACG,CACH,IAAM,EAAgBA,EAAAA,iBAAgCC,EAAAA,sBAAsB,CAG5E,OAAA,EAAA,EAAA,gBAA+B,EAFV,GAAW,EAE8B"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../getDictionary.cjs`),t=require(`./serverContext.cjs`),n=require(`./IntlayerServerProvider.cjs`),r=(r,i)=>e.getDictionary(r,i??t.getServerContext(n.IntlayerServerContext));exports.useDictionary=r;
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../getDictionary.cjs`),t=require(`./serverContext.cjs`),n=require(`./IntlayerServerProvider.cjs`),r=(r,i,a)=>e.getDictionary(r,i??t.getServerContext(n.IntlayerServerContext)??a);exports.useDictionary=r;
|
|
2
2
|
//# sourceMappingURL=useDictionary.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDictionary.cjs","names":["getDictionary","getServerContext","IntlayerServerContext"],"sources":["../../../src/server/useDictionary.ts"],"sourcesContent":["import type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n} from '@intlayer/types';\nimport { getDictionary } from '../getDictionary';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionary = <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionary: T,\n locale?: L\n) => {\n const localeTarget =\n locale
|
|
1
|
+
{"version":3,"file":"useDictionary.cjs","names":["getDictionary","getServerContext","IntlayerServerContext"],"sources":["../../../src/server/useDictionary.ts"],"sourcesContent":["import type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n} from '@intlayer/types';\nimport { getDictionary } from '../getDictionary';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionary = <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionary: T,\n locale?: L,\n fallbackLocale?: DeclaredLocales\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n fallbackLocale;\n\n return getDictionary<T, L>(dictionary, localeTarget as L);\n};\n"],"mappings":"sLAca,GAIX,EACA,EACA,IAOOA,EAAAA,cAAoB,EAJzB,GACAC,EAAAA,iBAAgCC,EAAAA,sBAAsB,EACtD,EAEuD"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../_virtual/_rolldown/runtime.cjs`),t=require(`./serverContext.cjs`),n=require(`./IntlayerServerProvider.cjs`),r=require(`./useDictionary.cjs`);let i=require(`@intlayer/config/built`);i=e.__toESM(i);const a=async(e,a)=>{let
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../_virtual/_rolldown/runtime.cjs`),t=require(`./serverContext.cjs`),n=require(`./IntlayerServerProvider.cjs`),r=require(`./useDictionary.cjs`);let i=require(`@intlayer/config/built`);i=e.__toESM(i);const a=async(e,a,o)=>{let s=a??t.getServerContext(n.IntlayerServerContext)??o??i.default?.internationalization.defaultLocale;return r.useDictionary(await e[s]?.(),s)};exports.useDictionaryAsync=a;
|
|
2
2
|
//# sourceMappingURL=useDictionaryAsync.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDictionaryAsync.cjs","names":["getServerContext","IntlayerServerContext","configuration","useDictionary"],"sources":["../../../src/server/useDictionaryAsync.ts"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n StrictModeLocaleMap,\n} from '@intlayer/types';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\nimport { useDictionary } from './useDictionary';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionaryAsync = async <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>,\n locale?: L\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n configuration?.internationalization.defaultLocale;\n\n const dictionary = await (dictionaryPromise as any)[localeTarget]?.();\n\n return useDictionary<T, L>(dictionary, localeTarget as L);\n};\n"],"mappings":"2RAgBA,MAAa,EAAqB,MAIhC,EACA,IACG,CACH,IAAM,EACJ,GACAA,EAAAA,iBAAgCC,EAAAA,sBAAsB,
|
|
1
|
+
{"version":3,"file":"useDictionaryAsync.cjs","names":["getServerContext","IntlayerServerContext","configuration","useDictionary"],"sources":["../../../src/server/useDictionaryAsync.ts"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n StrictModeLocaleMap,\n} from '@intlayer/types';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\nimport { useDictionary } from './useDictionary';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionaryAsync = async <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>,\n locale?: L,\n fallbackLocale?: DeclaredLocales\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n fallbackLocale ??\n configuration?.internationalization.defaultLocale;\n\n const dictionary = await (dictionaryPromise as any)[localeTarget]?.();\n\n return useDictionary<T, L>(dictionary, localeTarget as L);\n};\n"],"mappings":"2RAgBA,MAAa,EAAqB,MAIhC,EACA,EACA,IACG,CACH,IAAM,EACJ,GACAA,EAAAA,iBAAgCC,EAAAA,sBAAsB,EACtD,GACAC,EAAAA,SAAe,qBAAqB,cAItC,OAAOC,EAAAA,cAFY,MAAO,EAA0B,MAAiB,CAE9B,EAAkB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../_virtual/_rolldown/runtime.cjs`),t=require(`./serverContext.cjs`),n=require(`./IntlayerServerProvider.cjs`),r=require(`./useDictionary.cjs`),i=require(`./useLoadDynamic.cjs`);let a=require(`@intlayer/config/built`);a=e.__toESM(a);const o=(e,o,s)=>{let
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../_virtual/_rolldown/runtime.cjs`),t=require(`./serverContext.cjs`),n=require(`./IntlayerServerProvider.cjs`),r=require(`./useDictionary.cjs`),i=require(`./useLoadDynamic.cjs`);let a=require(`@intlayer/config/built`);a=e.__toESM(a);const o=(e,o,s,c)=>{let l=s??t.getServerContext(n.IntlayerServerContext)??c??a.default?.internationalization.defaultLocale;return r.useDictionary(i.useLoadDynamic(`${String(o)}.${l}`,e[l]?.()),l)};exports.useDictionaryDynamic=o;
|
|
2
2
|
//# sourceMappingURL=useDictionaryDynamic.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDictionaryDynamic.cjs","names":["getServerContext","IntlayerServerContext","configuration","useDictionary","useLoadDynamic"],"sources":["../../../src/server/useDictionaryDynamic.ts"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n StrictModeLocaleMap,\n} from '@intlayer/types';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\nimport { useDictionary } from './useDictionary';\nimport { useLoadDynamic } from './useLoadDynamic';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionaryDynamic = <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>,\n key: string,\n locale?: L\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n configuration?.internationalization.defaultLocale;\n\n const dictionary = useLoadDynamic<T>(\n `${String(key)}.${localeTarget}`,\n (dictionaryPromise as any)[localeTarget]?.()\n );\n\n return useDictionary<T, L>(dictionary, localeTarget as L);\n};\n"],"mappings":"6TAiBA,MAAa,GAIX,EACA,EACA,IACG,CACH,IAAM,EACJ,GACAA,EAAAA,iBAAgCC,EAAAA,sBAAsB,
|
|
1
|
+
{"version":3,"file":"useDictionaryDynamic.cjs","names":["getServerContext","IntlayerServerContext","configuration","useDictionary","useLoadDynamic"],"sources":["../../../src/server/useDictionaryDynamic.ts"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n StrictModeLocaleMap,\n} from '@intlayer/types';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\nimport { useDictionary } from './useDictionary';\nimport { useLoadDynamic } from './useLoadDynamic';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionaryDynamic = <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>,\n key: string,\n locale?: L,\n fallbackLocale?: DeclaredLocales\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n fallbackLocale ??\n configuration?.internationalization.defaultLocale;\n\n const dictionary = useLoadDynamic<T>(\n `${String(key)}.${localeTarget}`,\n (dictionaryPromise as any)[localeTarget]?.()\n );\n\n return useDictionary<T, L>(dictionary, localeTarget as L);\n};\n"],"mappings":"6TAiBA,MAAa,GAIX,EACA,EACA,EACA,IACG,CACH,IAAM,EACJ,GACAA,EAAAA,iBAAgCC,EAAAA,sBAAsB,EACtD,GACAC,EAAAA,SAAe,qBAAqB,cAOtC,OAAOC,EAAAA,cALYC,EAAAA,eACjB,GAAG,OAAO,EAAI,CAAC,GAAG,IACjB,EAA0B,MAAiB,CAC7C,CAEsC,EAAkB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../getIntlayer.cjs`),t=require(`./serverContext.cjs`),n=require(`./IntlayerServerProvider.cjs`),r=(r,i)=>e.getIntlayer(r,i??t.getServerContext(n.IntlayerServerContext));exports.useIntlayer=r;
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../getIntlayer.cjs`),t=require(`./serverContext.cjs`),n=require(`./IntlayerServerProvider.cjs`),r=(r,i,a)=>e.getIntlayer(r,i??t.getServerContext(n.IntlayerServerContext)??a);exports.useIntlayer=r;
|
|
2
2
|
//# sourceMappingURL=useIntlayer.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useIntlayer.cjs","names":["getIntlayer","getServerContext","IntlayerServerContext"],"sources":["../../../src/server/useIntlayer.ts"],"sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"useIntlayer.cjs","names":["getIntlayer","getServerContext","IntlayerServerContext"],"sources":["../../../src/server/useIntlayer.ts"],"sourcesContent":["import type {\n DeclaredLocales,\n DictionaryKeys,\n LocalesValues,\n} from '@intlayer/types';\nimport { getIntlayer } from '../getIntlayer';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\n\n/**\n * On the server side, Hook that picking one dictionary by its key and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useIntlayer = <\n T extends DictionaryKeys,\n L extends LocalesValues = DeclaredLocales,\n>(\n key: T,\n locale?: L,\n fallbackLocale?: DeclaredLocales\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n fallbackLocale;\n\n return getIntlayer<T, L>(key, localeTarget as L);\n};\n"],"mappings":"oLAca,GAIX,EACA,EACA,IAOOA,EAAAA,YAAkB,EAJvB,GACAC,EAAAA,iBAAgCC,EAAAA,sBAAsB,EACtD,EAE8C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IntlayerNode.mjs","names":[],"sources":["../../src/IntlayerNode.tsx"],"sourcesContent":["import type { NodeProps } from '@intlayer/core/interpreter';\nimport {\n isValidElement,\n type PropsWithChildren,\n type ReactElement,\n type ReactNode,\n} from 'react';\n\nexport type IntlayerNode<\n T = NodeProps['children'],\n AdditionalProps = Record<string, never>,\n> = ReactNode & {\n value: T;\n} & AdditionalProps;\n\ntype RenderIntlayerNodeProps<T> = PropsWithChildren<{\n value: T;\n children: ReactNode;\n additionalProps?: { [key: string]: any };\n}>;\n\nexport const renderIntlayerNode = <\n T extends number | string | boolean | undefined | null,\n>({\n children,\n value,\n additionalProps,\n}: RenderIntlayerNodeProps<T>): IntlayerNode<T> => {\n // If children is not a valid ReactElement, wrap it in a fragment\n const element: ReactElement<any> = isValidElement(children) ? (\n children\n ) : (\n <>{children}</>\n );\n\n // Return a Proxy that pretends to be the original element\n // but also has a .value getter.\n return new Proxy(element as ReactElement, {\n get(target, prop, receiver) {\n if (prop === 'value') {\n return value;\n }\n\n if (\n additionalProps &&\n Object.keys(additionalProps).includes(prop as string)\n ) {\n return additionalProps[prop as keyof typeof additionalProps];\n }\n\n return Reflect.get(target, prop, receiver);\n },\n }) as IntlayerNode<T>;\n};\n"],"mappings":"6FAqBA,MAAa,GAEX,CACA,WACA,QACA,qBACiD,CAEjD,IAAM,EAA6B,EAAe,EAAS,CACzD,EAEA,EAAA,EAAA,CAAG,
|
|
1
|
+
{"version":3,"file":"IntlayerNode.mjs","names":[],"sources":["../../src/IntlayerNode.tsx"],"sourcesContent":["import type { NodeProps } from '@intlayer/core/interpreter';\nimport {\n isValidElement,\n type PropsWithChildren,\n type ReactElement,\n type ReactNode,\n} from 'react';\n\nexport type IntlayerNode<\n T = NodeProps['children'],\n AdditionalProps = Record<string, never>,\n> = ReactNode & {\n value: T;\n} & AdditionalProps;\n\ntype RenderIntlayerNodeProps<T> = PropsWithChildren<{\n value: T;\n children: ReactNode;\n additionalProps?: { [key: string]: any };\n}>;\n\nexport const renderIntlayerNode = <\n T extends number | string | boolean | undefined | null,\n>({\n children,\n value,\n additionalProps,\n}: RenderIntlayerNodeProps<T>): IntlayerNode<T> => {\n // If children is not a valid ReactElement, wrap it in a fragment\n const element: ReactElement<any> = isValidElement(children) ? (\n children\n ) : (\n <>{children}</>\n );\n\n // Return a Proxy that pretends to be the original element\n // but also has a .value getter.\n return new Proxy(element as ReactElement, {\n get(target, prop, receiver) {\n if (prop === 'value') {\n return value;\n }\n\n if (\n additionalProps &&\n Object.keys(additionalProps).includes(prop as string)\n ) {\n return additionalProps[prop as keyof typeof additionalProps];\n }\n\n return Reflect.get(target, prop, receiver);\n },\n }) as IntlayerNode<T>;\n};\n"],"mappings":"6FAqBA,MAAa,GAEX,CACA,WACA,QACA,qBACiD,CAEjD,IAAM,EAA6B,EAAe,EAAS,CACzD,EAEA,EAAA,EAAA,CAAG,WAAY,CAAA,CAKjB,OAAO,IAAI,MAAM,EAAyB,CACxC,IAAI,EAAQ,EAAM,EAAU,CAY1B,OAXI,IAAS,QACJ,EAIP,GACA,OAAO,KAAK,EAAgB,CAAC,SAAS,EAAe,CAE9C,EAAgB,GAGlB,QAAQ,IAAI,EAAQ,EAAM,EAAS,EAE7C,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContentSelector.mjs","names":[],"sources":["../../../src/UI/ContentSelector.tsx"],"sourcesContent":["'use client';\n\nimport {\n type FC,\n type HTMLAttributes,\n type MouseEventHandler,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nconst DEFAULT_PRESS_DETECT_DURATION = 250;\n\ntype ContentSelectorProps = {\n onPress: () => void;\n onHover?: () => void;\n onUnhover?: () => void;\n onClickOutside?: () => void;\n pressDuration?: number;\n isSelecting?: boolean;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'content'>;\n\nexport const ContentSelector: FC<ContentSelectorProps> = ({\n children,\n onPress,\n onHover,\n onUnhover,\n onClickOutside: onUnselect,\n pressDuration = DEFAULT_PRESS_DETECT_DURATION,\n isSelecting: isSelectingProp,\n ...props\n}) => {\n const divRef = useRef<HTMLDivElement>(null);\n const [isHovered, setIsHovered] = useState(false);\n const [isSelectingState, setIsSelectingState] = useState(isSelectingProp);\n const pressTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const isChildrenString = typeof children === 'string';\n\n const handleOnLongPress = () => {\n setIsSelectingState(true);\n onPress();\n };\n\n const startPressTimer = () => {\n pressTimerRef.current = setTimeout(() => {\n handleOnLongPress();\n }, pressDuration);\n };\n\n const clearPressTimer = () => {\n if (pressTimerRef.current) {\n clearTimeout(pressTimerRef.current);\n pressTimerRef.current = null;\n }\n };\n\n const handleMouseDown = () => {\n clearPressTimer(); // Ensure any previous timer is cleared\n startPressTimer();\n };\n\n const handleMouseEnter = () => {\n setIsHovered(true);\n onHover?.();\n };\n\n const handleMouseUp = () => {\n onUnhover?.();\n setIsHovered(false);\n clearPressTimer();\n };\n\n // Use useCallback to ensure the function identity remains stable\n const handleClickOutside = useCallback(\n (event: MouseEvent) => {\n if (divRef.current && !divRef.current.contains(event.target as Node)) {\n setIsSelectingState(false);\n onUnselect?.();\n }\n },\n [onUnselect]\n );\n\n useEffect(() => {\n // Attach click outside listener\n document.addEventListener('mousedown', handleClickOutside);\n\n return () => {\n // Cleanup\n document.removeEventListener('mousedown', handleClickOutside);\n // clearPressTimer(); // Ensure to clear the timer when component unmounts\n };\n }, [handleClickOutside]);\n\n const handleOnClick: MouseEventHandler<HTMLDivElement> = (e) => {\n if (isSelectingState) {\n e.preventDefault();\n e.stopPropagation();\n }\n };\n\n const handleOnBlur = () => {\n // Stop editing when the element loses focus\n setIsSelectingState(false);\n };\n\n return (\n <span\n style={{\n display: isChildrenString ? 'inline' : 'inline-block',\n cursor: 'pointer',\n userSelect: 'none',\n borderRadius: '0.375rem',\n outlineWidth: '2px',\n outlineOffset: '4px',\n outlineStyle: 'solid',\n outlineColor:\n isSelectingProp || isSelectingState || isHovered\n ? 'inherit'\n : 'transparent',\n transition: 'all 100ms 50ms ease-in-out',\n }}\n role=\"button\"\n tabIndex={0}\n onKeyUp={() => null}\n onClick={handleOnClick}\n onMouseDown={handleMouseDown}\n onMouseUp={handleMouseUp}\n onMouseLeave={handleMouseUp}\n onTouchStart={handleMouseDown}\n onTouchEnd={handleMouseUp}\n onTouchCancel={handleMouseUp}\n onBlur={handleOnBlur}\n onMouseEnter={handleMouseEnter}\n ref={divRef}\n {...props}\n >\n {children}\n </span>\n );\n};\n"],"mappings":"kIAYA,MAWa,GAA6C,CACxD,WACA,UACA,UACA,YACA,eAAgB,EAChB,gBAAgB,IAChB,YAAa,EACb,GAAG,KACC,CACJ,IAAM,EAAS,EAAuB,KAAK,CACrC,CAAC,EAAW,GAAgB,EAAS,GAAM,CAC3C,CAAC,EAAkB,GAAuB,EAAS,EAAgB,CACnE,EAAgB,EAA6C,KAAK,CAClE,EAAmB,OAAO,GAAa,SAEvC,MAA0B,CAC9B,EAAoB,GAAK,CACzB,GAAS,EAGL,MAAwB,CAC5B,EAAc,QAAU,eAAiB,CACvC,GAAmB,EAClB,EAAc,EAGb,MAAwB,CAC5B,AAEE,EAAc,WADd,aAAa,EAAc,QAAQ,CACX,OAItB,MAAwB,CAC5B,GAAiB,CACjB,GAAiB,EAGb,MAAyB,CAC7B,EAAa,GAAK,CAClB,KAAW,EAGP,MAAsB,CAC1B,KAAa,CACb,EAAa,GAAM,CACnB,GAAiB,EAIb,EAAqB,EACxB,GAAsB,CACjB,EAAO,SAAW,CAAC,EAAO,QAAQ,SAAS,EAAM,OAAe,GAClE,EAAoB,GAAM,CAC1B,KAAc,GAGlB,CAAC,EAAW,CACb,CAyBD,OAvBA,OAEE,SAAS,iBAAiB,YAAa,EAAmB,KAE7C,CAEX,SAAS,oBAAoB,YAAa,EAAmB,GAG9D,CAAC,EAAmB,CAAC,CAetB,EAAC,
|
|
1
|
+
{"version":3,"file":"ContentSelector.mjs","names":[],"sources":["../../../src/UI/ContentSelector.tsx"],"sourcesContent":["'use client';\n\nimport {\n type FC,\n type HTMLAttributes,\n type MouseEventHandler,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nconst DEFAULT_PRESS_DETECT_DURATION = 250;\n\ntype ContentSelectorProps = {\n onPress: () => void;\n onHover?: () => void;\n onUnhover?: () => void;\n onClickOutside?: () => void;\n pressDuration?: number;\n isSelecting?: boolean;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'content'>;\n\nexport const ContentSelector: FC<ContentSelectorProps> = ({\n children,\n onPress,\n onHover,\n onUnhover,\n onClickOutside: onUnselect,\n pressDuration = DEFAULT_PRESS_DETECT_DURATION,\n isSelecting: isSelectingProp,\n ...props\n}) => {\n const divRef = useRef<HTMLDivElement>(null);\n const [isHovered, setIsHovered] = useState(false);\n const [isSelectingState, setIsSelectingState] = useState(isSelectingProp);\n const pressTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const isChildrenString = typeof children === 'string';\n\n const handleOnLongPress = () => {\n setIsSelectingState(true);\n onPress();\n };\n\n const startPressTimer = () => {\n pressTimerRef.current = setTimeout(() => {\n handleOnLongPress();\n }, pressDuration);\n };\n\n const clearPressTimer = () => {\n if (pressTimerRef.current) {\n clearTimeout(pressTimerRef.current);\n pressTimerRef.current = null;\n }\n };\n\n const handleMouseDown = () => {\n clearPressTimer(); // Ensure any previous timer is cleared\n startPressTimer();\n };\n\n const handleMouseEnter = () => {\n setIsHovered(true);\n onHover?.();\n };\n\n const handleMouseUp = () => {\n onUnhover?.();\n setIsHovered(false);\n clearPressTimer();\n };\n\n // Use useCallback to ensure the function identity remains stable\n const handleClickOutside = useCallback(\n (event: MouseEvent) => {\n if (divRef.current && !divRef.current.contains(event.target as Node)) {\n setIsSelectingState(false);\n onUnselect?.();\n }\n },\n [onUnselect]\n );\n\n useEffect(() => {\n // Attach click outside listener\n document.addEventListener('mousedown', handleClickOutside);\n\n return () => {\n // Cleanup\n document.removeEventListener('mousedown', handleClickOutside);\n // clearPressTimer(); // Ensure to clear the timer when component unmounts\n };\n }, [handleClickOutside]);\n\n const handleOnClick: MouseEventHandler<HTMLDivElement> = (e) => {\n if (isSelectingState) {\n e.preventDefault();\n e.stopPropagation();\n }\n };\n\n const handleOnBlur = () => {\n // Stop editing when the element loses focus\n setIsSelectingState(false);\n };\n\n return (\n <span\n style={{\n display: isChildrenString ? 'inline' : 'inline-block',\n cursor: 'pointer',\n userSelect: 'none',\n borderRadius: '0.375rem',\n outlineWidth: '2px',\n outlineOffset: '4px',\n outlineStyle: 'solid',\n outlineColor:\n isSelectingProp || isSelectingState || isHovered\n ? 'inherit'\n : 'transparent',\n transition: 'all 100ms 50ms ease-in-out',\n }}\n role=\"button\"\n tabIndex={0}\n onKeyUp={() => null}\n onClick={handleOnClick}\n onMouseDown={handleMouseDown}\n onMouseUp={handleMouseUp}\n onMouseLeave={handleMouseUp}\n onTouchStart={handleMouseDown}\n onTouchEnd={handleMouseUp}\n onTouchCancel={handleMouseUp}\n onBlur={handleOnBlur}\n onMouseEnter={handleMouseEnter}\n ref={divRef}\n {...props}\n >\n {children}\n </span>\n );\n};\n"],"mappings":"kIAYA,MAWa,GAA6C,CACxD,WACA,UACA,UACA,YACA,eAAgB,EAChB,gBAAgB,IAChB,YAAa,EACb,GAAG,KACC,CACJ,IAAM,EAAS,EAAuB,KAAK,CACrC,CAAC,EAAW,GAAgB,EAAS,GAAM,CAC3C,CAAC,EAAkB,GAAuB,EAAS,EAAgB,CACnE,EAAgB,EAA6C,KAAK,CAClE,EAAmB,OAAO,GAAa,SAEvC,MAA0B,CAC9B,EAAoB,GAAK,CACzB,GAAS,EAGL,MAAwB,CAC5B,EAAc,QAAU,eAAiB,CACvC,GAAmB,EAClB,EAAc,EAGb,MAAwB,CAC5B,AAEE,EAAc,WADd,aAAa,EAAc,QAAQ,CACX,OAItB,MAAwB,CAC5B,GAAiB,CACjB,GAAiB,EAGb,MAAyB,CAC7B,EAAa,GAAK,CAClB,KAAW,EAGP,MAAsB,CAC1B,KAAa,CACb,EAAa,GAAM,CACnB,GAAiB,EAIb,EAAqB,EACxB,GAAsB,CACjB,EAAO,SAAW,CAAC,EAAO,QAAQ,SAAS,EAAM,OAAe,GAClE,EAAoB,GAAM,CAC1B,KAAc,GAGlB,CAAC,EAAW,CACb,CAyBD,OAvBA,OAEE,SAAS,iBAAiB,YAAa,EAAmB,KAE7C,CAEX,SAAS,oBAAoB,YAAa,EAAmB,GAG9D,CAAC,EAAmB,CAAC,CAetB,EAAC,OAAD,CACE,MAAO,CACL,QAAS,EAAmB,SAAW,eACvC,OAAQ,UACR,WAAY,OACZ,aAAc,WACd,aAAc,MACd,cAAe,MACf,aAAc,QACd,aACE,GAAmB,GAAoB,EACnC,UACA,cACN,WAAY,6BACb,CACD,KAAK,SACL,SAAU,EACV,YAAe,KACf,QA/BsD,GAAM,CAC1D,IACF,EAAE,gBAAgB,CAClB,EAAE,iBAAiB,GA6BnB,YAAa,EACb,UAAW,EACX,aAAc,EACd,aAAc,EACd,WAAY,EACZ,cAAe,EACf,WA/BuB,CAEzB,EAAoB,GAAM,EA8BxB,aAAc,EACd,IAAK,EACL,GAAI,EAEH,WACI,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IntlayerProvider.mjs","names":[],"sources":["../../../src/client/IntlayerProvider.tsx"],"sourcesContent":["'use client';\n\nimport configuration from '@intlayer/config/built';\nimport { localeResolver } from '@intlayer/core/localization';\nimport { MessageKey, useCrossFrameState } from '@intlayer/editor-react';\nimport type { LocalesValues } from '@intlayer/types';\nimport {\n createContext,\n type FC,\n type PropsWithChildren,\n useContext,\n useEffect,\n} from 'react';\nimport { IntlayerEditorProvider } from '../editor/IntlayerEditorProvider';\nimport { localeInStorage, setLocaleInStorage } from './useLocaleStorage';\n\ntype IntlayerValue = {\n locale: LocalesValues;\n setLocale: (newLocale: LocalesValues) => void;\n disableEditor?: boolean;\n isCookieEnabled?: boolean;\n};\n\n/**\n * Context that stores the current locale on the client side.\n */\nexport const IntlayerClientContext = createContext<IntlayerValue>({\n locale: localeInStorage ?? configuration?.internationalization?.defaultLocale,\n setLocale: () => null,\n isCookieEnabled: true,\n disableEditor: false,\n});\n\n/**\n * Hook that provides the current Intlayer client context.\n *\n * @returns The current Intlayer context values.\n */\nexport const useIntlayerContext = () => useContext(IntlayerClientContext);\n\n/**\n * Props for the IntlayerProvider component.\n */\nexport type IntlayerProviderProps = PropsWithChildren<{\n /**\n * The locale to use. If not provided, it will be detected from storage or configuration.\n */\n locale?: LocalesValues;\n /**\n * The default locale to use as a fallback.\n */\n defaultLocale?: LocalesValues;\n /**\n * Function to set the locale.\n */\n setLocale?: (locale: LocalesValues) => void;\n /**\n * Whether to disable the editor.\n */\n disableEditor?: boolean;\n /**\n * Whether to enable cookies for storing the locale.\n */\n isCookieEnabled?: boolean;\n}>;\n\n/**\n * Provider that stores the current locale on the client side.\n *\n * This component is focused on content delivery without the editor features.\n *\n * @param props - The provider props.\n * @returns The provider component.\n */\nexport const IntlayerProviderContent: FC<IntlayerProviderProps> = ({\n locale: localeProp,\n defaultLocale: defaultLocaleProp,\n children,\n setLocale: setLocaleProp,\n disableEditor,\n isCookieEnabled,\n}) => {\n const { internationalization } = configuration ?? {};\n const { locales: availableLocales, defaultLocale: defaultLocaleConfig } =\n internationalization ?? {};\n\n const initialLocale =\n localeProp ?? localeInStorage ?? defaultLocaleProp ?? defaultLocaleConfig;\n\n const [currentLocale, setCurrentLocale] = useCrossFrameState(\n MessageKey.INTLAYER_CURRENT_LOCALE,\n initialLocale\n );\n\n // Sync the prop to state if the prop changes from the parent\n useEffect(() => {\n if (localeProp && localeProp !== currentLocale) {\n setCurrentLocale(localeProp);\n }\n }, [localeProp]);\n\n const setLocaleBase = (newLocale: LocalesValues) => {\n if (currentLocale.toString() === newLocale.toString()) return;\n\n if (!availableLocales?.map(String).includes(newLocale)) {\n console.error(`Locale ${newLocale} is not available`);\n return;\n }\n\n setCurrentLocale(newLocale);\n setLocaleInStorage(newLocale, isCookieEnabled);\n };\n\n const setLocale = setLocaleProp ?? setLocaleBase;\n\n // Resolve based on currentLocale (the state), not the prop directly\n const resolvedLocale = localeResolver(currentLocale);\n\n return (\n <IntlayerClientContext.Provider\n value={{\n locale: resolvedLocale,\n setLocale,\n disableEditor,\n }}\n >\n {children}\n </IntlayerClientContext.Provider>\n );\n};\n\n/**\n * Main provider for Intlayer in React applications.\n *\n * It includes the editor provider by default, allowing for live content editing\n * if configured.\n *\n * @param props - The provider props.\n * @returns The provider component with editor support.\n *\n * @example\n * ```tsx\n * import { IntlayerProvider } from 'react-intlayer';\n *\n * const App = () => (\n * <IntlayerProvider>\n * <MyComponent />\n * </IntlayerProvider>\n * );\n * ```\n */\nexport const IntlayerProvider: FC<IntlayerProviderProps> = (props) => (\n <IntlayerEditorProvider>\n <IntlayerProviderContent {...props} />\n </IntlayerEditorProvider>\n);\n"],"mappings":"wcA0BA,MAAa,EAAwB,EAA6B,CAChE,OAAQ,GAAmB,GAAe,sBAAsB,cAChE,cAAiB,KACjB,gBAAiB,GACjB,cAAe,GAChB,CAAC,CAOW,MAA2B,EAAW,EAAsB,CAoC5D,GAAsD,CACjE,OAAQ,EACR,cAAe,EACf,WACA,UAAW,EACX,gBACA,qBACI,CACJ,GAAM,CAAE,wBAAyB,GAAiB,EAAE,CAC9C,CAAE,QAAS,EAAkB,cAAe,GAChD,GAAwB,EAAE,CAEtB,EACJ,GAAc,GAAmB,GAAqB,EAElD,CAAC,EAAe,GAAoB,EACxC,EAAW,wBACX,EACD,CAGD,MAAgB,CACV,GAAc,IAAe,GAC/B,EAAiB,EAAW,EAE7B,CAAC,EAAW,CAAC,CAchB,IAAM,EAAY,IAZK,GAA6B,CAC9C,KAAc,UAAU,GAAK,EAAU,UAAU,CAErD,IAAI,CAAC,GAAkB,IAAI,OAAO,CAAC,SAAS,EAAU,CAAE,CACtD,QAAQ,MAAM,UAAU,EAAU,mBAAmB,CACrD,OAGF,EAAiB,EAAU,CAC3B,EAAmB,EAAW,EAAgB,IAM1C,EAAiB,EAAe,EAAc,CAEpD,OACE,EAAC,EAAsB,
|
|
1
|
+
{"version":3,"file":"IntlayerProvider.mjs","names":[],"sources":["../../../src/client/IntlayerProvider.tsx"],"sourcesContent":["'use client';\n\nimport configuration from '@intlayer/config/built';\nimport { localeResolver } from '@intlayer/core/localization';\nimport { MessageKey, useCrossFrameState } from '@intlayer/editor-react';\nimport type { LocalesValues } from '@intlayer/types';\nimport {\n createContext,\n type FC,\n type PropsWithChildren,\n useContext,\n useEffect,\n} from 'react';\nimport { IntlayerEditorProvider } from '../editor/IntlayerEditorProvider';\nimport { localeInStorage, setLocaleInStorage } from './useLocaleStorage';\n\ntype IntlayerValue = {\n locale: LocalesValues;\n setLocale: (newLocale: LocalesValues) => void;\n disableEditor?: boolean;\n isCookieEnabled?: boolean;\n};\n\n/**\n * Context that stores the current locale on the client side.\n */\nexport const IntlayerClientContext = createContext<IntlayerValue>({\n locale: localeInStorage ?? configuration?.internationalization?.defaultLocale,\n setLocale: () => null,\n isCookieEnabled: true,\n disableEditor: false,\n});\n\n/**\n * Hook that provides the current Intlayer client context.\n *\n * @returns The current Intlayer context values.\n */\nexport const useIntlayerContext = () => useContext(IntlayerClientContext);\n\n/**\n * Props for the IntlayerProvider component.\n */\nexport type IntlayerProviderProps = PropsWithChildren<{\n /**\n * The locale to use. If not provided, it will be detected from storage or configuration.\n */\n locale?: LocalesValues;\n /**\n * The default locale to use as a fallback.\n */\n defaultLocale?: LocalesValues;\n /**\n * Function to set the locale.\n */\n setLocale?: (locale: LocalesValues) => void;\n /**\n * Whether to disable the editor.\n */\n disableEditor?: boolean;\n /**\n * Whether to enable cookies for storing the locale.\n */\n isCookieEnabled?: boolean;\n}>;\n\n/**\n * Provider that stores the current locale on the client side.\n *\n * This component is focused on content delivery without the editor features.\n *\n * @param props - The provider props.\n * @returns The provider component.\n */\nexport const IntlayerProviderContent: FC<IntlayerProviderProps> = ({\n locale: localeProp,\n defaultLocale: defaultLocaleProp,\n children,\n setLocale: setLocaleProp,\n disableEditor,\n isCookieEnabled,\n}) => {\n const { internationalization } = configuration ?? {};\n const { locales: availableLocales, defaultLocale: defaultLocaleConfig } =\n internationalization ?? {};\n\n const initialLocale =\n localeProp ?? localeInStorage ?? defaultLocaleProp ?? defaultLocaleConfig;\n\n const [currentLocale, setCurrentLocale] = useCrossFrameState(\n MessageKey.INTLAYER_CURRENT_LOCALE,\n initialLocale\n );\n\n // Sync the prop to state if the prop changes from the parent\n useEffect(() => {\n if (localeProp && localeProp !== currentLocale) {\n setCurrentLocale(localeProp);\n }\n }, [localeProp]);\n\n const setLocaleBase = (newLocale: LocalesValues) => {\n if (currentLocale.toString() === newLocale.toString()) return;\n\n if (!availableLocales?.map(String).includes(newLocale)) {\n console.error(`Locale ${newLocale} is not available`);\n return;\n }\n\n setCurrentLocale(newLocale);\n setLocaleInStorage(newLocale, isCookieEnabled);\n };\n\n const setLocale = setLocaleProp ?? setLocaleBase;\n\n // Resolve based on currentLocale (the state), not the prop directly\n const resolvedLocale = localeResolver(currentLocale);\n\n return (\n <IntlayerClientContext.Provider\n value={{\n locale: resolvedLocale,\n setLocale,\n disableEditor,\n }}\n >\n {children}\n </IntlayerClientContext.Provider>\n );\n};\n\n/**\n * Main provider for Intlayer in React applications.\n *\n * It includes the editor provider by default, allowing for live content editing\n * if configured.\n *\n * @param props - The provider props.\n * @returns The provider component with editor support.\n *\n * @example\n * ```tsx\n * import { IntlayerProvider } from 'react-intlayer';\n *\n * const App = () => (\n * <IntlayerProvider>\n * <MyComponent />\n * </IntlayerProvider>\n * );\n * ```\n */\nexport const IntlayerProvider: FC<IntlayerProviderProps> = (props) => (\n <IntlayerEditorProvider>\n <IntlayerProviderContent {...props} />\n </IntlayerEditorProvider>\n);\n"],"mappings":"wcA0BA,MAAa,EAAwB,EAA6B,CAChE,OAAQ,GAAmB,GAAe,sBAAsB,cAChE,cAAiB,KACjB,gBAAiB,GACjB,cAAe,GAChB,CAAC,CAOW,MAA2B,EAAW,EAAsB,CAoC5D,GAAsD,CACjE,OAAQ,EACR,cAAe,EACf,WACA,UAAW,EACX,gBACA,qBACI,CACJ,GAAM,CAAE,wBAAyB,GAAiB,EAAE,CAC9C,CAAE,QAAS,EAAkB,cAAe,GAChD,GAAwB,EAAE,CAEtB,EACJ,GAAc,GAAmB,GAAqB,EAElD,CAAC,EAAe,GAAoB,EACxC,EAAW,wBACX,EACD,CAGD,MAAgB,CACV,GAAc,IAAe,GAC/B,EAAiB,EAAW,EAE7B,CAAC,EAAW,CAAC,CAchB,IAAM,EAAY,IAZK,GAA6B,CAC9C,KAAc,UAAU,GAAK,EAAU,UAAU,CAErD,IAAI,CAAC,GAAkB,IAAI,OAAO,CAAC,SAAS,EAAU,CAAE,CACtD,QAAQ,MAAM,UAAU,EAAU,mBAAmB,CACrD,OAGF,EAAiB,EAAU,CAC3B,EAAmB,EAAW,EAAgB,IAM1C,EAAiB,EAAe,EAAc,CAEpD,OACE,EAAC,EAAsB,SAAvB,CACE,MAAO,CACL,OAAQ,EACR,YACA,gBACD,CAEA,WAC8B,CAAA,EAwBxB,EAA+C,GAC1D,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAyB,GAAI,EAAS,CAAA,CACf,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContentSelectorWrapper.mjs","names":[],"sources":["../../../src/editor/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport type { NodeProps } from '@intlayer/core/interpreter';\nimport { isSameKeyPath } from '@intlayer/core/utils';\nimport {\n MessageKey,\n useCommunicator,\n useEditorEnabled,\n useFocusDictionary,\n} from '@intlayer/editor-react';\nimport { NodeType } from '@intlayer/types';\nimport { type FC, type HTMLAttributes, useCallback, useMemo } from 'react';\nimport { useIntlayerContext } from '../client';\nimport { ContentSelector } from '../UI/ContentSelector';\n\nexport type ContentSelectorWrapperProps = NodeProps &\n Omit<HTMLAttributes<HTMLDivElement>, 'children'>;\n\nconst ContentSelectorWrapperContent: FC<ContentSelectorWrapperProps> = ({\n children,\n dictionaryKey,\n keyPath,\n}) => {\n const { focusedContent, setFocusedContent } = useFocusDictionary();\n const { postMessage, senderId } = useCommunicator();\n\n // Filter out translation nodes for more flexibility with the editor that can have different format\n const filteredKeyPath = useMemo(\n () => keyPath.filter((key) => key.type !== NodeType.Translation),\n [keyPath]\n );\n\n const handleSelect = useCallback(\n () =>\n setFocusedContent({\n dictionaryKey,\n keyPath: filteredKeyPath,\n }),\n [dictionaryKey, filteredKeyPath]\n );\n\n const handleHover = useCallback(\n () =>\n postMessage({\n type: `${MessageKey.INTLAYER_HOVERED_CONTENT_CHANGED}/post`,\n data: {\n dictionaryKey,\n keyPath: filteredKeyPath,\n },\n senderId,\n }),\n [dictionaryKey, filteredKeyPath]\n );\n\n const handleUnhover = useCallback(\n () =>\n postMessage({\n type: `${MessageKey.INTLAYER_HOVERED_CONTENT_CHANGED}/post`,\n data: null,\n senderId,\n }),\n [senderId]\n );\n\n const isSelected = useMemo(\n () =>\n (focusedContent?.dictionaryKey === dictionaryKey &&\n (focusedContent?.keyPath?.length ?? 0) > 0 &&\n isSameKeyPath(focusedContent?.keyPath ?? [], filteredKeyPath)) ??\n false,\n [focusedContent, filteredKeyPath, dictionaryKey]\n );\n\n return (\n <ContentSelector\n onPress={handleSelect}\n onHover={handleHover}\n onUnhover={handleUnhover}\n isSelecting={isSelected}\n >\n {children}\n </ContentSelector>\n );\n};\n\nexport const ContentSelectorRenderer: FC<ContentSelectorWrapperProps> = ({\n children,\n ...props\n}) => {\n const { enabled } = useEditorEnabled();\n const { disableEditor } = useIntlayerContext();\n\n if (enabled && !disableEditor) {\n return (\n <ContentSelectorWrapperContent {...props}>\n {children}\n </ContentSelectorWrapperContent>\n );\n }\n\n return children;\n};\n"],"mappings":"6bAkBA,MAAM,GAAkE,CACtE,WACA,gBACA,aACI,CACJ,GAAM,CAAE,iBAAgB,qBAAsB,GAAoB,CAC5D,CAAE,cAAa,YAAa,GAAiB,CAG7C,EAAkB,MAChB,EAAQ,OAAQ,GAAQ,EAAI,OAAS,EAAS,YAAY,CAChE,CAAC,EAAQ,CACV,CA2CD,OACE,EAAC,
|
|
1
|
+
{"version":3,"file":"ContentSelectorWrapper.mjs","names":[],"sources":["../../../src/editor/ContentSelectorWrapper.tsx"],"sourcesContent":["'use client';\n\nimport type { NodeProps } from '@intlayer/core/interpreter';\nimport { isSameKeyPath } from '@intlayer/core/utils';\nimport {\n MessageKey,\n useCommunicator,\n useEditorEnabled,\n useFocusDictionary,\n} from '@intlayer/editor-react';\nimport { NodeType } from '@intlayer/types';\nimport { type FC, type HTMLAttributes, useCallback, useMemo } from 'react';\nimport { useIntlayerContext } from '../client';\nimport { ContentSelector } from '../UI/ContentSelector';\n\nexport type ContentSelectorWrapperProps = NodeProps &\n Omit<HTMLAttributes<HTMLDivElement>, 'children'>;\n\nconst ContentSelectorWrapperContent: FC<ContentSelectorWrapperProps> = ({\n children,\n dictionaryKey,\n keyPath,\n}) => {\n const { focusedContent, setFocusedContent } = useFocusDictionary();\n const { postMessage, senderId } = useCommunicator();\n\n // Filter out translation nodes for more flexibility with the editor that can have different format\n const filteredKeyPath = useMemo(\n () => keyPath.filter((key) => key.type !== NodeType.Translation),\n [keyPath]\n );\n\n const handleSelect = useCallback(\n () =>\n setFocusedContent({\n dictionaryKey,\n keyPath: filteredKeyPath,\n }),\n [dictionaryKey, filteredKeyPath]\n );\n\n const handleHover = useCallback(\n () =>\n postMessage({\n type: `${MessageKey.INTLAYER_HOVERED_CONTENT_CHANGED}/post`,\n data: {\n dictionaryKey,\n keyPath: filteredKeyPath,\n },\n senderId,\n }),\n [dictionaryKey, filteredKeyPath]\n );\n\n const handleUnhover = useCallback(\n () =>\n postMessage({\n type: `${MessageKey.INTLAYER_HOVERED_CONTENT_CHANGED}/post`,\n data: null,\n senderId,\n }),\n [senderId]\n );\n\n const isSelected = useMemo(\n () =>\n (focusedContent?.dictionaryKey === dictionaryKey &&\n (focusedContent?.keyPath?.length ?? 0) > 0 &&\n isSameKeyPath(focusedContent?.keyPath ?? [], filteredKeyPath)) ??\n false,\n [focusedContent, filteredKeyPath, dictionaryKey]\n );\n\n return (\n <ContentSelector\n onPress={handleSelect}\n onHover={handleHover}\n onUnhover={handleUnhover}\n isSelecting={isSelected}\n >\n {children}\n </ContentSelector>\n );\n};\n\nexport const ContentSelectorRenderer: FC<ContentSelectorWrapperProps> = ({\n children,\n ...props\n}) => {\n const { enabled } = useEditorEnabled();\n const { disableEditor } = useIntlayerContext();\n\n if (enabled && !disableEditor) {\n return (\n <ContentSelectorWrapperContent {...props}>\n {children}\n </ContentSelectorWrapperContent>\n );\n }\n\n return children;\n};\n"],"mappings":"6bAkBA,MAAM,GAAkE,CACtE,WACA,gBACA,aACI,CACJ,GAAM,CAAE,iBAAgB,qBAAsB,GAAoB,CAC5D,CAAE,cAAa,YAAa,GAAiB,CAG7C,EAAkB,MAChB,EAAQ,OAAQ,GAAQ,EAAI,OAAS,EAAS,YAAY,CAChE,CAAC,EAAQ,CACV,CA2CD,OACE,EAAC,EAAD,CACE,QA3CiB,MAEjB,EAAkB,CAChB,gBACA,QAAS,EACV,CAAC,CACJ,CAAC,EAAe,EAAgB,CACjC,CAqCG,QAnCgB,MAEhB,EAAY,CACV,KAAM,GAAG,EAAW,iCAAiC,OACrD,KAAM,CACJ,gBACA,QAAS,EACV,CACD,WACD,CAAC,CACJ,CAAC,EAAe,EAAgB,CACjC,CAyBG,UAvBkB,MAElB,EAAY,CACV,KAAM,GAAG,EAAW,iCAAiC,OACrD,KAAM,KACN,WACD,CAAC,CACJ,CAAC,EAAS,CACX,CAgBG,YAde,OAEd,GAAgB,gBAAkB,IAChC,GAAgB,SAAS,QAAU,GAAK,GACzC,EAAc,GAAgB,SAAW,EAAE,CAAE,EAAgB,GAC/D,GACF,CAAC,EAAgB,EAAiB,EAAc,CACjD,CASI,WACe,CAAA,EAIT,GAA4D,CACvE,WACA,GAAG,KACC,CACJ,GAAM,CAAE,WAAY,GAAkB,CAChC,CAAE,iBAAkB,GAAoB,CAU9C,OARI,GAAW,CAAC,EAEZ,EAAC,EAAD,CAA+B,GAAI,EAChC,WAC6B,CAAA,CAI7B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IntlayerEditorProvider.mjs","names":[],"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport configuration from '@intlayer/config/built';\nimport {\n EditorProvider,\n useCrossURLPathSetter,\n useDictionariesRecordActions,\n useEditorEnabled,\n useIframeClickInterceptor,\n} from '@intlayer/editor-react';\nimport type { FC, PropsWithChildren } from 'react';\nimport { useEffect } from 'react';\n\nconst IntlayerEditorHooksEnabled: FC = () => {\n /**\n * URL Messages\n */\n useCrossURLPathSetter();\n\n /**\n * Click Messages\n */\n useIframeClickInterceptor();\n\n /**\n * Sent local dictionaries to editor\n */\n const { setLocaleDictionaries } = useDictionariesRecordActions();\n useEffect(() => {\n // Load dictionaries dynamically to do not impact the bundle, and send them to the editor\n import('@intlayer/unmerged-dictionaries-entry').then((mod) => {\n const unmergedDictionaries = mod.getUnmergedDictionaries();\n const dictionariesList = Object.fromEntries(\n Object.values(unmergedDictionaries)\n .flat()\n .map((dictionary) => [dictionary.localId, dictionary])\n );\n\n setLocaleDictionaries?.(dictionariesList);\n });\n }, []);\n\n return <></>;\n};\n\nconst { editor } = configuration ?? {};\n\nconst IntlayerEditorHook: FC = () => {\n const { enabled } = useEditorEnabled();\n\n return enabled ? <IntlayerEditorHooksEnabled /> : <></>;\n};\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => {\n return (\n <EditorProvider\n postMessage={(data: any) => {\n if (typeof window === 'undefined') return;\n if (!editor) return;\n\n const isInIframe = window.self !== window.top;\n if (!isInIframe) return;\n\n if (editor.applicationURL.length > 0) {\n window?.postMessage(\n data,\n // Use to restrict the origin of the editor for security reasons.\n // Correspond to the current application URL to synchronize the locales states.\n editor.applicationURL\n );\n }\n\n if (editor.editorURL.length > 0) {\n window.parent?.postMessage(\n data,\n // Use to restrict the origin of the editor for security reasons.\n // Correspond to the editor URL to synchronize the locales states.\n editor.editorURL\n );\n }\n\n if (editor.cmsURL.length > 0) {\n window.parent?.postMessage(\n data,\n // Use to restrict the origin of the CMS for security reasons.\n // Correspond to the CMS URL.\n editor.cmsURL\n );\n }\n }}\n allowedOrigins={\n [editor?.editorURL, editor?.cmsURL, editor?.applicationURL].filter(\n Boolean\n ) as string[]\n }\n mode=\"client\"\n configuration={configuration}\n >\n <IntlayerEditorHook />\n {children}\n </EditorProvider>\n );\n};\n"],"mappings":"+TAaA,MAAM,MAAuC,CAI3C,GAAuB,CAKvB,GAA2B,CAK3B,GAAM,CAAE,yBAA0B,GAA8B,CAehE,OAdA,MAAgB,CAEd,OAAO,yCAAyC,KAAM,GAAQ,CAC5D,IAAM,EAAuB,EAAI,yBAAyB,CACpD,EAAmB,OAAO,YAC9B,OAAO,OAAO,EAAqB,CAChC,MAAM,CACN,IAAK,GAAe,CAAC,EAAW,QAAS,EAAW,CAAC,CACzD,CAED,IAAwB,EAAiB,EACzC,EACD,EAAE,CAAC,CAEC,EAAA,EAAA,
|
|
1
|
+
{"version":3,"file":"IntlayerEditorProvider.mjs","names":[],"sources":["../../../src/editor/IntlayerEditorProvider.tsx"],"sourcesContent":["'use client';\n\nimport configuration from '@intlayer/config/built';\nimport {\n EditorProvider,\n useCrossURLPathSetter,\n useDictionariesRecordActions,\n useEditorEnabled,\n useIframeClickInterceptor,\n} from '@intlayer/editor-react';\nimport type { FC, PropsWithChildren } from 'react';\nimport { useEffect } from 'react';\n\nconst IntlayerEditorHooksEnabled: FC = () => {\n /**\n * URL Messages\n */\n useCrossURLPathSetter();\n\n /**\n * Click Messages\n */\n useIframeClickInterceptor();\n\n /**\n * Sent local dictionaries to editor\n */\n const { setLocaleDictionaries } = useDictionariesRecordActions();\n useEffect(() => {\n // Load dictionaries dynamically to do not impact the bundle, and send them to the editor\n import('@intlayer/unmerged-dictionaries-entry').then((mod) => {\n const unmergedDictionaries = mod.getUnmergedDictionaries();\n const dictionariesList = Object.fromEntries(\n Object.values(unmergedDictionaries)\n .flat()\n .map((dictionary) => [dictionary.localId, dictionary])\n );\n\n setLocaleDictionaries?.(dictionariesList);\n });\n }, []);\n\n return <></>;\n};\n\nconst { editor } = configuration ?? {};\n\nconst IntlayerEditorHook: FC = () => {\n const { enabled } = useEditorEnabled();\n\n return enabled ? <IntlayerEditorHooksEnabled /> : <></>;\n};\n\nexport const IntlayerEditorProvider: FC<PropsWithChildren> = ({ children }) => {\n return (\n <EditorProvider\n postMessage={(data: any) => {\n if (typeof window === 'undefined') return;\n if (!editor) return;\n\n const isInIframe = window.self !== window.top;\n if (!isInIframe) return;\n\n if (editor.applicationURL.length > 0) {\n window?.postMessage(\n data,\n // Use to restrict the origin of the editor for security reasons.\n // Correspond to the current application URL to synchronize the locales states.\n editor.applicationURL\n );\n }\n\n if (editor.editorURL.length > 0) {\n window.parent?.postMessage(\n data,\n // Use to restrict the origin of the editor for security reasons.\n // Correspond to the editor URL to synchronize the locales states.\n editor.editorURL\n );\n }\n\n if (editor.cmsURL.length > 0) {\n window.parent?.postMessage(\n data,\n // Use to restrict the origin of the CMS for security reasons.\n // Correspond to the CMS URL.\n editor.cmsURL\n );\n }\n }}\n allowedOrigins={\n [editor?.editorURL, editor?.cmsURL, editor?.applicationURL].filter(\n Boolean\n ) as string[]\n }\n mode=\"client\"\n configuration={configuration}\n >\n <IntlayerEditorHook />\n {children}\n </EditorProvider>\n );\n};\n"],"mappings":"+TAaA,MAAM,MAAuC,CAI3C,GAAuB,CAKvB,GAA2B,CAK3B,GAAM,CAAE,yBAA0B,GAA8B,CAehE,OAdA,MAAgB,CAEd,OAAO,yCAAyC,KAAM,GAAQ,CAC5D,IAAM,EAAuB,EAAI,yBAAyB,CACpD,EAAmB,OAAO,YAC9B,OAAO,OAAO,EAAqB,CAChC,MAAM,CACN,IAAK,GAAe,CAAC,EAAW,QAAS,EAAW,CAAC,CACzD,CAED,IAAwB,EAAiB,EACzC,EACD,EAAE,CAAC,CAEC,EAAA,EAAA,EAAK,CAAA,EAGR,CAAE,UAAW,GAAiB,EAAE,CAEhC,MAA+B,CACnC,GAAM,CAAE,WAAY,GAAkB,CAEtC,OAAiB,EAAV,EAAW,EAAgC,EAAjC,EAA8B,CAAQ,EAG5C,GAAiD,CAAE,cAE5D,EAAC,EAAD,CACE,YAAc,GAAc,CACtB,OAAO,OAAW,KACjB,GAEc,OAAO,OAAS,OAAO,MAGtC,EAAO,eAAe,OAAS,GACjC,QAAQ,YACN,EAGA,EAAO,eACR,CAGC,EAAO,UAAU,OAAS,GAC5B,OAAO,QAAQ,YACb,EAGA,EAAO,UACR,CAGC,EAAO,OAAO,OAAS,GACzB,OAAO,QAAQ,YACb,EAGA,EAAO,OACR,GAGL,eACE,CAAC,GAAQ,UAAW,GAAQ,OAAQ,GAAQ,eAAe,CAAC,OAC1D,QACD,CAEH,KAAK,SACU,yBAzCjB,CA2CE,EAAC,EAAD,EAAsB,CAAA,CACrB,EACc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useEditedContentRenderer.mjs","names":[],"sources":["../../../src/editor/useEditedContentRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getContent } from '@intlayer/core/interpreter';\nimport { useEditedContentActions } from '@intlayer/editor-react';\nimport type { KeyPath, Locale } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { ContentSelectorRenderer } from './ContentSelectorWrapper';\n\ntype EditedContentRendererProps = {\n dictionaryKey: string;\n keyPath: KeyPath[];\n children: string;\n locale?: Locale;\n};\n\nexport const useEditedContentRenderer = ({\n dictionaryKey,\n keyPath,\n children,\n}: EditedContentRendererProps) => {\n const editedContentContext = useEditedContentActions();\n\n if (editedContentContext) {\n const editedValue = editedContentContext.getEditedContentValue(\n dictionaryKey,\n keyPath\n ) as string;\n\n const value = editedValue ?? children;\n\n return value;\n }\n\n return children;\n};\n\nexport const EditedContentRenderer: FC<EditedContentRendererProps> = (\n props\n) => {\n const content = useEditedContentRenderer(props);\n\n if (typeof content === 'object') {\n const transformedEditedContent = getContent(content, props, props.locale);\n\n if (typeof transformedEditedContent !== 'string') {\n console.error(\n `Incorrect edited content format. Content type: ${typeof transformedEditedContent}. Expected string. Value ${JSON.stringify(transformedEditedContent)}`\n );\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {props.children}\n </ContentSelectorRenderer>\n );\n }\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {transformedEditedContent}\n </ContentSelectorRenderer>\n );\n }\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {content}\n </ContentSelectorRenderer>\n );\n};\n"],"mappings":"mPAeA,MAAa,GAA4B,CACvC,gBACA,UACA,cACgC,CAChC,IAAM,EAAuB,GAAyB,CAatD,OAXI,EACkB,EAAqB,sBACvC,EACA,EACD,EAE4B,EAKxB,GAGI,EACX,GACG,CACH,IAAM,EAAU,EAAyB,EAAM,CAE/C,GAAI,OAAO,GAAY,SAAU,CAC/B,IAAM,EAA2B,EAAW,EAAS,EAAO,EAAM,OAAO,CAczE,OAZI,OAAO,GAA6B,SAatC,EAAC,
|
|
1
|
+
{"version":3,"file":"useEditedContentRenderer.mjs","names":[],"sources":["../../../src/editor/useEditedContentRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getContent } from '@intlayer/core/interpreter';\nimport { useEditedContentActions } from '@intlayer/editor-react';\nimport type { KeyPath, Locale } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { ContentSelectorRenderer } from './ContentSelectorWrapper';\n\ntype EditedContentRendererProps = {\n dictionaryKey: string;\n keyPath: KeyPath[];\n children: string;\n locale?: Locale;\n};\n\nexport const useEditedContentRenderer = ({\n dictionaryKey,\n keyPath,\n children,\n}: EditedContentRendererProps) => {\n const editedContentContext = useEditedContentActions();\n\n if (editedContentContext) {\n const editedValue = editedContentContext.getEditedContentValue(\n dictionaryKey,\n keyPath\n ) as string;\n\n const value = editedValue ?? children;\n\n return value;\n }\n\n return children;\n};\n\nexport const EditedContentRenderer: FC<EditedContentRendererProps> = (\n props\n) => {\n const content = useEditedContentRenderer(props);\n\n if (typeof content === 'object') {\n const transformedEditedContent = getContent(content, props, props.locale);\n\n if (typeof transformedEditedContent !== 'string') {\n console.error(\n `Incorrect edited content format. Content type: ${typeof transformedEditedContent}. Expected string. Value ${JSON.stringify(transformedEditedContent)}`\n );\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {props.children}\n </ContentSelectorRenderer>\n );\n }\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {transformedEditedContent}\n </ContentSelectorRenderer>\n );\n }\n\n return (\n <ContentSelectorRenderer {...props} key={props.children}>\n {content}\n </ContentSelectorRenderer>\n );\n};\n"],"mappings":"mPAeA,MAAa,GAA4B,CACvC,gBACA,UACA,cACgC,CAChC,IAAM,EAAuB,GAAyB,CAatD,OAXI,EACkB,EAAqB,sBACvC,EACA,EACD,EAE4B,EAKxB,GAGI,EACX,GACG,CACH,IAAM,EAAU,EAAyB,EAAM,CAE/C,GAAI,OAAO,GAAY,SAAU,CAC/B,IAAM,EAA2B,EAAW,EAAS,EAAO,EAAM,OAAO,CAczE,OAZI,OAAO,GAA6B,SAatC,EAAC,EAAD,CAAyB,GAAI,EAAO,IAAK,EAAM,SAErB,CADvB,EACuB,EAd1B,QAAQ,MACN,kDAAkD,OAAO,EAAyB,2BAA2B,KAAK,UAAU,EAAyB,GACtJ,CAGC,EAAC,EAAD,CAAyB,GAAI,EAAO,IAAK,EAAM,SAErB,CADvB,EAAM,SACiB,EAWhC,OACE,EAAC,EAAD,CAAyB,GAAI,EAAO,IAAK,EAAM,SAErB,CADvB,EACuB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HTMLProvider.mjs","names":[],"sources":["../../../src/html/HTMLProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type FC,\n type PropsWithChildren,\n useContext,\n} from 'react';\nimport type { HTMLComponents } from './HTMLComponentTypes';\n\ntype HTMLContextValue = {\n components?: HTMLComponents<'permissive', {}>;\n};\n\ntype HTMLProviderProps = PropsWithChildren<{\n /**\n * Component overrides for HTML tags.\n */\n components?: HTMLComponents<'permissive', {}>;\n}>;\n\nconst HTMLContext = createContext<HTMLContextValue | undefined>(undefined);\n\nexport const useHTMLContext = () => useContext(HTMLContext);\n\nexport const HTMLProvider: FC<HTMLProviderProps> = ({\n children,\n components,\n}) => (\n <HTMLContext.Provider value={{ components }}>{children}</HTMLContext.Provider>\n);\n"],"mappings":"2GAqBA,MAAM,EAAc,EAA4C,IAAA,GAAU,CAE7D,MAAuB,EAAW,EAAY,CAE9C,GAAuC,CAClD,WACA,gBAEA,EAAC,EAAY,
|
|
1
|
+
{"version":3,"file":"HTMLProvider.mjs","names":[],"sources":["../../../src/html/HTMLProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type FC,\n type PropsWithChildren,\n useContext,\n} from 'react';\nimport type { HTMLComponents } from './HTMLComponentTypes';\n\ntype HTMLContextValue = {\n components?: HTMLComponents<'permissive', {}>;\n};\n\ntype HTMLProviderProps = PropsWithChildren<{\n /**\n * Component overrides for HTML tags.\n */\n components?: HTMLComponents<'permissive', {}>;\n}>;\n\nconst HTMLContext = createContext<HTMLContextValue | undefined>(undefined);\n\nexport const useHTMLContext = () => useContext(HTMLContext);\n\nexport const HTMLProvider: FC<HTMLProviderProps> = ({\n children,\n components,\n}) => (\n <HTMLContext.Provider value={{ components }}>{children}</HTMLContext.Provider>\n);\n"],"mappings":"2GAqBA,MAAM,EAAc,EAA4C,IAAA,GAAU,CAE7D,MAAuB,EAAW,EAAY,CAE9C,GAAuC,CAClD,WACA,gBAEA,EAAC,EAAY,SAAb,CAAsB,MAAO,CAAE,aAAY,CAAG,WAAgC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HTMLRenderer.mjs","names":[],"sources":["../../../src/html/HTMLRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML } from '@intlayer/core/interpreter';\nimport { HTML_TAGS } from '@intlayer/core/transpiler';\nimport { createElement, type FC, Fragment, type JSX } from 'react';\nimport type { HTMLComponents } from './HTMLComponentTypes';\nimport { useHTMLContext } from './HTMLProvider';\n\nconst createDefaultHTMLComponents = (): HTMLComponents<'permissive', {}> => {\n const components: HTMLComponents = {};\n\n for (const tag of HTML_TAGS) {\n components[tag] = ({ children, ...props }) =>\n createElement(tag, props as any, children);\n }\n\n return components as HTMLComponents<'permissive', {}>;\n};\n\nexport const defaultHTMLComponents = createDefaultHTMLComponents();\n\nexport type RenderHTMLProps = {\n /**\n * Component overrides for HTML tags.\n * Allows you to customize how specific HTML elements are rendered.\n */\n components?: HTMLComponents<'permissive', {}>;\n};\n\n/**\n * Renders HTML-like content to JSX with the provided components.\n *\n * This function does not use context from HTMLProvider. Use `useHTMLRenderer`\n * hook if you want to leverage provider context.\n */\nexport const renderHTML = (\n content: string,\n { components }: RenderHTMLProps = {}\n): JSX.Element => {\n const mergedComponents = {\n ...defaultHTMLComponents,\n ...components,\n };\n\n // Wrap all components to ensure they are rendered via React.createElement\n const wrappedComponents = Object.fromEntries(\n Object.entries(mergedComponents)\n .filter(([, Component]) => Component)\n .map(([key, Component]) => [\n key,\n (props: any) => createElement(Component as any, props),\n ])\n );\n\n return <Fragment>{getHTML(content, wrappedComponents)}</Fragment>;\n};\n\n/**\n * Hook that returns a function to render HTML content.\n *\n * This hook considers the configuration from the `HTMLProvider` context if available,\n * falling back to the provided components.\n */\nexport const useHTMLRenderer = ({ components }: RenderHTMLProps = {}) => {\n const context = useHTMLContext();\n\n return (content: string) => {\n return renderHTML(content, {\n components: {\n ...context?.components,\n ...components,\n },\n });\n };\n};\n\nexport type HTMLRendererProps = RenderHTMLProps & {\n /**\n * The HTML content to render as a string.\n */\n children: string;\n};\n\n/**\n * React component that renders HTML-like content to JSX.\n *\n * This component uses the components from the `HTMLProvider` context\n * if available.\n */\nexport const HTMLRenderer: FC<HTMLRendererProps> = ({\n children = '',\n components,\n}) => {\n const render = useHTMLRenderer({ components });\n\n return render(children);\n};\n"],"mappings":"wQAmBA,MAAa,OAX+D,CAC1E,IAAM,EAA6B,EAAE,CAErC,IAAK,IAAM,KAAO,EAChB,EAAW,IAAQ,CAAE,WAAU,GAAG,KAChC,EAAc,EAAK,EAAc,EAAS,CAG9C,OAAO,KAGyD,CAgBrD,GACX,EACA,CAAE,cAAgC,EAAE,GACpB,CAChB,IAAM,EAAmB,CACvB,GAAG,EACH,GAAG,EACJ,CAYD,OAAO,EAAC,
|
|
1
|
+
{"version":3,"file":"HTMLRenderer.mjs","names":[],"sources":["../../../src/html/HTMLRenderer.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML } from '@intlayer/core/interpreter';\nimport { HTML_TAGS } from '@intlayer/core/transpiler';\nimport { createElement, type FC, Fragment, type JSX } from 'react';\nimport type { HTMLComponents } from './HTMLComponentTypes';\nimport { useHTMLContext } from './HTMLProvider';\n\nconst createDefaultHTMLComponents = (): HTMLComponents<'permissive', {}> => {\n const components: HTMLComponents = {};\n\n for (const tag of HTML_TAGS) {\n components[tag] = ({ children, ...props }) =>\n createElement(tag, props as any, children);\n }\n\n return components as HTMLComponents<'permissive', {}>;\n};\n\nexport const defaultHTMLComponents = createDefaultHTMLComponents();\n\nexport type RenderHTMLProps = {\n /**\n * Component overrides for HTML tags.\n * Allows you to customize how specific HTML elements are rendered.\n */\n components?: HTMLComponents<'permissive', {}>;\n};\n\n/**\n * Renders HTML-like content to JSX with the provided components.\n *\n * This function does not use context from HTMLProvider. Use `useHTMLRenderer`\n * hook if you want to leverage provider context.\n */\nexport const renderHTML = (\n content: string,\n { components }: RenderHTMLProps = {}\n): JSX.Element => {\n const mergedComponents = {\n ...defaultHTMLComponents,\n ...components,\n };\n\n // Wrap all components to ensure they are rendered via React.createElement\n const wrappedComponents = Object.fromEntries(\n Object.entries(mergedComponents)\n .filter(([, Component]) => Component)\n .map(([key, Component]) => [\n key,\n (props: any) => createElement(Component as any, props),\n ])\n );\n\n return <Fragment>{getHTML(content, wrappedComponents)}</Fragment>;\n};\n\n/**\n * Hook that returns a function to render HTML content.\n *\n * This hook considers the configuration from the `HTMLProvider` context if available,\n * falling back to the provided components.\n */\nexport const useHTMLRenderer = ({ components }: RenderHTMLProps = {}) => {\n const context = useHTMLContext();\n\n return (content: string) => {\n return renderHTML(content, {\n components: {\n ...context?.components,\n ...components,\n },\n });\n };\n};\n\nexport type HTMLRendererProps = RenderHTMLProps & {\n /**\n * The HTML content to render as a string.\n */\n children: string;\n};\n\n/**\n * React component that renders HTML-like content to JSX.\n *\n * This component uses the components from the `HTMLProvider` context\n * if available.\n */\nexport const HTMLRenderer: FC<HTMLRendererProps> = ({\n children = '',\n components,\n}) => {\n const render = useHTMLRenderer({ components });\n\n return render(children);\n};\n"],"mappings":"wQAmBA,MAAa,OAX+D,CAC1E,IAAM,EAA6B,EAAE,CAErC,IAAK,IAAM,KAAO,EAChB,EAAW,IAAQ,CAAE,WAAU,GAAG,KAChC,EAAc,EAAK,EAAc,EAAS,CAG9C,OAAO,KAGyD,CAgBrD,GACX,EACA,CAAE,cAAgC,EAAE,GACpB,CAChB,IAAM,EAAmB,CACvB,GAAG,EACH,GAAG,EACJ,CAYD,OAAO,EAAC,EAAD,CAAA,SAAW,EAAQ,EATA,OAAO,YAC/B,OAAO,QAAQ,EAAiB,CAC7B,QAAQ,EAAG,KAAe,EAAU,CACpC,KAAK,CAAC,EAAK,KAAe,CACzB,EACC,GAAe,EAAc,EAAkB,EAAM,CACvD,CAAC,CACL,CAEoD,CAAY,CAAA,EAStD,GAAmB,CAAE,cAAgC,EAAE,GAAK,CACvE,IAAM,EAAU,GAAgB,CAEhC,MAAQ,IACC,EAAW,EAAS,CACzB,WAAY,CACV,GAAG,GAAS,WACZ,GAAG,EACJ,CACF,CAAC,EAiBO,GAAuC,CAClD,WAAW,GACX,gBAEe,EAAgB,CAAE,aAAY,CAAC,CAEhC,EAAS"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HTMLRendererPlugin.mjs","names":[],"sources":["../../../src/html/HTMLRendererPlugin.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML } from '@intlayer/core/interpreter';\nimport type { KeyPath, Locale } from '@intlayer/types';\nimport { createElement, type FC, type ReactNode } from 'react';\nimport { ContentSelectorRenderer } from '../editor';\nimport { useEditedContentRenderer } from '../editor/useEditedContentRenderer';\nimport { useHTMLContext } from './HTMLProvider';\nimport { defaultHTMLComponents } from './HTMLRenderer';\nimport type { ReactComponentProps } from './types';\n\ntype HTMLRendererPluginProps = {\n dictionaryKey: string;\n keyPath: KeyPath[];\n html: string;\n locale?: Locale;\n userComponents?: Record<string, any>;\n};\n\nexport const HTMLRendererPlugin: FC<HTMLRendererPluginProps> = (\n props\n): ReactNode => {\n const { dictionaryKey, keyPath, html, userComponents } = props;\n const context = useHTMLContext();\n const globalComponents = context?.components || {};\n\n const editedContentContext = useEditedContentRenderer({\n dictionaryKey: dictionaryKey ?? '',\n keyPath: keyPath ?? [],\n children: html,\n });\n\n const contentToRender =\n typeof editedContentContext === 'string' ? editedContentContext : html;\n\n const mergedComponents = {\n ...defaultHTMLComponents,\n ...globalComponents,\n ...userComponents,\n };\n\n // Wrap all components to ensure they are rendered via React.createElement\n // This is important because it allows React to handle the component's lifecycle,\n // hooks, and Babel-injected variables correctly.\n const wrappedComponents = Object.fromEntries(\n Object.entries(mergedComponents)\n .filter(([, Component]) => Component)\n .map(([key, Component]) => [\n key,\n (props: ReactComponentProps) => createElement(Component, props),\n ])\n );\n\n return (\n <ContentSelectorRenderer {...props}>\n {getHTML(contentToRender, wrappedComponents)}\n </ContentSelectorRenderer>\n );\n};\n"],"mappings":"gaAmBA,MAAa,EACX,GACc,CACd,GAAM,CAAE,gBAAe,UAAS,OAAM,kBAAmB,EAEnD,EADU,GAAgB,EACE,YAAc,EAAE,CAE5C,EAAuB,EAAyB,CACpD,cAAe,GAAiB,GAChC,QAAS,GAAW,EAAE,CACtB,SAAU,EACX,CAAC,CAEI,EACJ,OAAO,GAAyB,SAAW,EAAuB,EAE9D,EAAmB,CACvB,GAAG,EACH,GAAG,EACH,GAAG,EACJ,CAKK,EAAoB,OAAO,YAC/B,OAAO,QAAQ,EAAiB,CAC7B,QAAQ,EAAG,KAAe,EAAU,CACpC,KAAK,CAAC,EAAK,KAAe,CACzB,EACC,GAA+B,EAAc,EAAW,EAAM,CAChE,CAAC,CACL,CAED,OACE,EAAC,
|
|
1
|
+
{"version":3,"file":"HTMLRendererPlugin.mjs","names":[],"sources":["../../../src/html/HTMLRendererPlugin.tsx"],"sourcesContent":["'use client';\n\nimport { getHTML } from '@intlayer/core/interpreter';\nimport type { KeyPath, Locale } from '@intlayer/types';\nimport { createElement, type FC, type ReactNode } from 'react';\nimport { ContentSelectorRenderer } from '../editor';\nimport { useEditedContentRenderer } from '../editor/useEditedContentRenderer';\nimport { useHTMLContext } from './HTMLProvider';\nimport { defaultHTMLComponents } from './HTMLRenderer';\nimport type { ReactComponentProps } from './types';\n\ntype HTMLRendererPluginProps = {\n dictionaryKey: string;\n keyPath: KeyPath[];\n html: string;\n locale?: Locale;\n userComponents?: Record<string, any>;\n};\n\nexport const HTMLRendererPlugin: FC<HTMLRendererPluginProps> = (\n props\n): ReactNode => {\n const { dictionaryKey, keyPath, html, userComponents } = props;\n const context = useHTMLContext();\n const globalComponents = context?.components || {};\n\n const editedContentContext = useEditedContentRenderer({\n dictionaryKey: dictionaryKey ?? '',\n keyPath: keyPath ?? [],\n children: html,\n });\n\n const contentToRender =\n typeof editedContentContext === 'string' ? editedContentContext : html;\n\n const mergedComponents = {\n ...defaultHTMLComponents,\n ...globalComponents,\n ...userComponents,\n };\n\n // Wrap all components to ensure they are rendered via React.createElement\n // This is important because it allows React to handle the component's lifecycle,\n // hooks, and Babel-injected variables correctly.\n const wrappedComponents = Object.fromEntries(\n Object.entries(mergedComponents)\n .filter(([, Component]) => Component)\n .map(([key, Component]) => [\n key,\n (props: ReactComponentProps) => createElement(Component, props),\n ])\n );\n\n return (\n <ContentSelectorRenderer {...props}>\n {getHTML(contentToRender, wrappedComponents)}\n </ContentSelectorRenderer>\n );\n};\n"],"mappings":"gaAmBA,MAAa,EACX,GACc,CACd,GAAM,CAAE,gBAAe,UAAS,OAAM,kBAAmB,EAEnD,EADU,GAAgB,EACE,YAAc,EAAE,CAE5C,EAAuB,EAAyB,CACpD,cAAe,GAAiB,GAChC,QAAS,GAAW,EAAE,CACtB,SAAU,EACX,CAAC,CAEI,EACJ,OAAO,GAAyB,SAAW,EAAuB,EAE9D,EAAmB,CACvB,GAAG,EACH,GAAG,EACH,GAAG,EACJ,CAKK,EAAoB,OAAO,YAC/B,OAAO,QAAQ,EAAiB,CAC7B,QAAQ,EAAG,KAAe,EAAU,CACpC,KAAK,CAAC,EAAK,KAAe,CACzB,EACC,GAA+B,EAAc,EAAW,EAAM,CAChE,CAAC,CACL,CAED,OACE,EAAC,EAAD,CAAyB,GAAI,WAC1B,EAAQ,EAAiB,EAAkB,CACpB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MarkdownProvider.mjs","names":[],"sources":["../../../src/markdown/MarkdownProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type FC,\n type HTMLAttributes,\n type PropsWithChildren,\n type ReactNode,\n useContext,\n} from 'react';\nimport type { HTMLComponents } from '../html/HTMLComponentTypes';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\nexport type MarkdownProviderOptions = {\n /** Forces the compiler to always output content with a block-level wrapper. */\n forceBlock?: boolean;\n /** Forces the compiler to always output content with an inline wrapper. */\n forceInline?: boolean;\n /** Whether to preserve frontmatter in the markdown content. */\n preserveFrontmatter?: boolean;\n /** Whether to use the GitHub Tag Filter for security. */\n tagfilter?: boolean;\n};\n\ntype MarkdownContextValue = {\n renderMarkdown: (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => ReactNode;\n};\n\ntype MarkdownProviderProps = PropsWithChildren<\n MarkdownProviderOptions & {\n components?: HTMLComponents<'permissive', {}>;\n wrapper?: FC<HTMLAttributes<HTMLElement>>;\n renderMarkdown?: (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => ReactNode;\n }\n>;\n\nconst MarkdownContext = createContext<MarkdownContextValue | undefined>(\n undefined\n);\n\nexport const useMarkdownContext = () => useContext(MarkdownContext);\n\nconst mergeOptions = (\n baseOptions: MarkdownRendererOptions,\n options: MarkdownProviderOptions = {},\n components: HTMLComponents<'permissive', {}> = {},\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n): MarkdownRendererOptions => {\n return {\n ...baseOptions,\n ...options,\n forceBlock: options.forceBlock ?? baseOptions.forceBlock,\n forceInline: options.forceInline ?? baseOptions.forceInline,\n preserveFrontmatter:\n options.preserveFrontmatter ?? baseOptions.preserveFrontmatter,\n tagfilter: options.tagfilter ?? baseOptions.tagfilter,\n wrapper: wrapper || baseOptions.wrapper,\n\n forceWrapper: !!(wrapper || baseOptions.wrapper),\n components: { ...baseOptions.components, ...components },\n };\n};\n\n/**\n * Provider for the MarkdownRenderer component.\n *\n * It will provide the `renderMarkdown` function to the context, which can be used to render markdown.\n *\n * ```tsx\n * const content = useIntlayer('app');\n *\n * return (\n * <div>\n * {content.markdown} // Will be rendered with the components and options provided to the MarkdownProvider\n * </div>\n * );\n * ```\n *\n * @example\n * ```tsx\n * <MarkdownProvider components={{ h1: CustomHeading }}>\n * <MarkdownRenderer>\n * {markdownContent}\n * </MarkdownRenderer>\n * </MarkdownProvider>\n * ```\n */\nexport const MarkdownProvider: FC<MarkdownProviderProps> = ({\n children,\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n renderMarkdown: customRenderFn,\n}) => {\n const baseOptions: MarkdownRendererOptions = {\n components,\n forceBlock,\n forceInline,\n wrapper,\n forceWrapper: !!wrapper,\n preserveFrontmatter,\n tagfilter,\n };\n\n // Standard internal renderer\n const defaultRenderMarkdown = (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => {\n const mergedOptions = mergeOptions(\n baseOptions,\n options,\n components,\n wrapper\n );\n\n return compiler(markdown, mergedOptions);\n };\n\n // Wrapper for user-provided custom renderer\n // Note: We wrap in a clean Provider to prevent infinite recursion\n const customRenderMarkdownWrapper = (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => (\n <MarkdownContext.Provider value={undefined}>\n {customRenderFn?.(markdown, options, components, wrapper)}\n </MarkdownContext.Provider>\n );\n\n return (\n <MarkdownContext.Provider\n value={{\n renderMarkdown: customRenderFn\n ? customRenderMarkdownWrapper\n : defaultRenderMarkdown,\n }}\n >\n {children}\n </MarkdownContext.Provider>\n );\n};\n"],"mappings":"sJA8CA,MAAM,EAAkB,EACtB,IAAA,GACD,CAEY,MAA2B,EAAW,EAAgB,CAE7D,GACJ,EACA,EAAmC,EAAE,CACrC,EAA+C,EAAE,CACjD,KAEO,CACL,GAAG,EACH,GAAG,EACH,WAAY,EAAQ,YAAc,EAAY,WAC9C,YAAa,EAAQ,aAAe,EAAY,YAChD,oBACE,EAAQ,qBAAuB,EAAY,oBAC7C,UAAW,EAAQ,WAAa,EAAY,UAC5C,QAAS,GAAW,EAAY,QAEhC,aAAc,CAAC,EAAE,GAAW,EAAY,SACxC,WAAY,CAAE,GAAG,EAAY,WAAY,GAAG,EAAY,CACzD,EA2BU,GAA+C,CAC1D,WACA,aACA,UACA,aACA,cACA,sBACA,YACA,eAAgB,KACZ,CACJ,IAAM,EAAuC,CAC3C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAgCD,OACE,EAAC,EAAgB,
|
|
1
|
+
{"version":3,"file":"MarkdownProvider.mjs","names":[],"sources":["../../../src/markdown/MarkdownProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type FC,\n type HTMLAttributes,\n type PropsWithChildren,\n type ReactNode,\n useContext,\n} from 'react';\nimport type { HTMLComponents } from '../html/HTMLComponentTypes';\nimport { compiler, type MarkdownRendererOptions } from './processor';\n\nexport type MarkdownProviderOptions = {\n /** Forces the compiler to always output content with a block-level wrapper. */\n forceBlock?: boolean;\n /** Forces the compiler to always output content with an inline wrapper. */\n forceInline?: boolean;\n /** Whether to preserve frontmatter in the markdown content. */\n preserveFrontmatter?: boolean;\n /** Whether to use the GitHub Tag Filter for security. */\n tagfilter?: boolean;\n};\n\ntype MarkdownContextValue = {\n renderMarkdown: (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => ReactNode;\n};\n\ntype MarkdownProviderProps = PropsWithChildren<\n MarkdownProviderOptions & {\n components?: HTMLComponents<'permissive', {}>;\n wrapper?: FC<HTMLAttributes<HTMLElement>>;\n renderMarkdown?: (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => ReactNode;\n }\n>;\n\nconst MarkdownContext = createContext<MarkdownContextValue | undefined>(\n undefined\n);\n\nexport const useMarkdownContext = () => useContext(MarkdownContext);\n\nconst mergeOptions = (\n baseOptions: MarkdownRendererOptions,\n options: MarkdownProviderOptions = {},\n components: HTMLComponents<'permissive', {}> = {},\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n): MarkdownRendererOptions => {\n return {\n ...baseOptions,\n ...options,\n forceBlock: options.forceBlock ?? baseOptions.forceBlock,\n forceInline: options.forceInline ?? baseOptions.forceInline,\n preserveFrontmatter:\n options.preserveFrontmatter ?? baseOptions.preserveFrontmatter,\n tagfilter: options.tagfilter ?? baseOptions.tagfilter,\n wrapper: wrapper || baseOptions.wrapper,\n\n forceWrapper: !!(wrapper || baseOptions.wrapper),\n components: { ...baseOptions.components, ...components },\n };\n};\n\n/**\n * Provider for the MarkdownRenderer component.\n *\n * It will provide the `renderMarkdown` function to the context, which can be used to render markdown.\n *\n * ```tsx\n * const content = useIntlayer('app');\n *\n * return (\n * <div>\n * {content.markdown} // Will be rendered with the components and options provided to the MarkdownProvider\n * </div>\n * );\n * ```\n *\n * @example\n * ```tsx\n * <MarkdownProvider components={{ h1: CustomHeading }}>\n * <MarkdownRenderer>\n * {markdownContent}\n * </MarkdownRenderer>\n * </MarkdownProvider>\n * ```\n */\nexport const MarkdownProvider: FC<MarkdownProviderProps> = ({\n children,\n components,\n wrapper,\n forceBlock,\n forceInline,\n preserveFrontmatter,\n tagfilter,\n renderMarkdown: customRenderFn,\n}) => {\n const baseOptions: MarkdownRendererOptions = {\n components,\n forceBlock,\n forceInline,\n wrapper,\n forceWrapper: !!wrapper,\n preserveFrontmatter,\n tagfilter,\n };\n\n // Standard internal renderer\n const defaultRenderMarkdown = (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => {\n const mergedOptions = mergeOptions(\n baseOptions,\n options,\n components,\n wrapper\n );\n\n return compiler(markdown, mergedOptions);\n };\n\n // Wrapper for user-provided custom renderer\n // Note: We wrap in a clean Provider to prevent infinite recursion\n const customRenderMarkdownWrapper = (\n markdown: string,\n options?: MarkdownProviderOptions,\n components?: HTMLComponents<'permissive', {}>,\n wrapper?: FC<HTMLAttributes<HTMLElement>>\n ) => (\n <MarkdownContext.Provider value={undefined}>\n {customRenderFn?.(markdown, options, components, wrapper)}\n </MarkdownContext.Provider>\n );\n\n return (\n <MarkdownContext.Provider\n value={{\n renderMarkdown: customRenderFn\n ? customRenderMarkdownWrapper\n : defaultRenderMarkdown,\n }}\n >\n {children}\n </MarkdownContext.Provider>\n );\n};\n"],"mappings":"sJA8CA,MAAM,EAAkB,EACtB,IAAA,GACD,CAEY,MAA2B,EAAW,EAAgB,CAE7D,GACJ,EACA,EAAmC,EAAE,CACrC,EAA+C,EAAE,CACjD,KAEO,CACL,GAAG,EACH,GAAG,EACH,WAAY,EAAQ,YAAc,EAAY,WAC9C,YAAa,EAAQ,aAAe,EAAY,YAChD,oBACE,EAAQ,qBAAuB,EAAY,oBAC7C,UAAW,EAAQ,WAAa,EAAY,UAC5C,QAAS,GAAW,EAAY,QAEhC,aAAc,CAAC,EAAE,GAAW,EAAY,SACxC,WAAY,CAAE,GAAG,EAAY,WAAY,GAAG,EAAY,CACzD,EA2BU,GAA+C,CAC1D,WACA,aACA,UACA,aACA,cACA,sBACA,YACA,eAAgB,KACZ,CACJ,IAAM,EAAuC,CAC3C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAgCD,OACE,EAAC,EAAgB,SAAjB,CACE,MAAO,CACL,eAAgB,GAbpB,EACA,EACA,EACA,IAEA,EAAC,EAAgB,SAAjB,CAA0B,MAAO,IAAA,YAC9B,IAAiB,EAAU,EAAS,EAAY,EAAQ,CAChC,CAAA,EAzB3B,EACA,EACA,EACA,IASO,EAAS,EAPM,EACpB,EACA,EACA,EACA,EACD,CAEuC,CAsBrC,CAEA,WACwB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
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 '../html/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":"6JA+EA,MAAa,GACX,EACA,CACE,aACA,UACA,aACA,cACA,sBACA,aACuB,EAAE,GAapB,EAAS,EAViC,CAC/C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAEwC,CAgD9B,GAAuB,CAClC,aACA,UACA,aACA,cACA,sBACA,aACuB,EAAE,GAAK,CAC9B,IAAM,EAAU,GAAoB,CAEpC,MAAQ,IACF,EACK,EAAQ,eACb,EACA,CACE,aACA,cACA,sBACA,YACD,CACD,EACA,EACD,CAGI,EAAe,EAAS,CAC7B,aACA,UACA,aACA,cACA,sBACA,YACD,CAAC,EA6HO,GAA+C,CAC1D,WAAW,GACX,aACA,UACA,aACA,cACA,sBACA,YACA,oBACI,CACJ,IAAM,EAAU,GAAoB,CA8CpC,OA5CI,EAEA,EAAA,EAAA,CAAA,SACG,EAAe,EAAU,CACxB,aACA,UACA,aACA,cACA,sBACA,YACD,CAAC,CAAA,CACD,CAIH,EAEA,EAAA,EAAA,CAAA,SACG,EAAQ,eACP,EACA,CACE,aACA,cACA,sBACA,YACD,CACD,EACA,EACD,CAAA,CACA,CAeA,EAAA,EAAA,CAAA,SAAG,EAAS,EAV8B,CAC/C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAE4C,CAAA,CAAI"}
|
|
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 '../html/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":"6JA+EA,MAAa,GACX,EACA,CACE,aACA,UACA,aACA,cACA,sBACA,aACuB,EAAE,GAapB,EAAS,EAViC,CAC/C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAEwC,CAgD9B,GAAuB,CAClC,aACA,UACA,aACA,cACA,sBACA,aACuB,EAAE,GAAK,CAC9B,IAAM,EAAU,GAAoB,CAEpC,MAAQ,IACF,EACK,EAAQ,eACb,EACA,CACE,aACA,cACA,sBACA,YACD,CACD,EACA,EACD,CAGI,EAAe,EAAS,CAC7B,aACA,UACA,aACA,cACA,sBACA,YACD,CAAC,EA6HO,GAA+C,CAC1D,WAAW,GACX,aACA,UACA,aACA,cACA,sBACA,YACA,oBACI,CACJ,IAAM,EAAU,GAAoB,CA8CpC,OA5CI,EAEA,EAAA,EAAA,CAAA,SACG,EAAe,EAAU,CACxB,aACA,UACA,aACA,cACA,sBACA,YACD,CAAC,CACD,CAAA,CAIH,EAEA,EAAA,EAAA,CAAA,SACG,EAAQ,eACP,EACA,CACE,aACA,cACA,sBACA,YACD,CACD,EACA,EACD,CACA,CAAA,CAeA,EAAA,EAAA,CAAA,SAAG,EAAS,EAV8B,CAC/C,aACA,aACA,cACA,UACA,aAAc,CAAC,CAAC,EAChB,sBACA,YACD,CAE4C,CAAI,CAAA"}
|
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 type IInterpreterPluginState as IInterpreterPluginStateCore,\n type Plugins,\n splitInsertionTemplate,\n} from '@intlayer/core/interpreter';\nimport { getMarkdownMetadata } from '@intlayer/core/markdown';\nimport type {\n HTMLContent,\n InsertionContent,\n MarkdownContent,\n} from '@intlayer/core/transpiler';\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 { HTMLComponents } from './html/HTMLComponentTypes';\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> = T extends {\n nodeType: NodeType | string;\n [NodeType.Insertion]: string;\n fields: readonly string[];\n}\n ? <V extends { [K in T['fields'][number]]: ReactNode }>(\n values: V\n ) => V[keyof V] extends string | number\n ? IntlayerNode<string>\n : IntlayerNode<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 const result = deepTransformNode(children, {\n ...props,\n children,\n keyPath: newKeyPath,\n plugins: [insertionStringPlugin, ...(props.plugins ?? [])],\n });\n\n if (\n typeof children === 'object' &&\n children !== null &&\n 'nodeType' in children &&\n [NodeType.Enumeration, NodeType.Condition].includes(\n children.nodeType as NodeType\n )\n ) {\n return (values: any) => (arg: any) => {\n const func = result as Function;\n const inner = func(arg);\n\n if (typeof inner === 'function') {\n return inner(values);\n }\n return inner;\n };\n }\n\n return result;\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 tags?: infer U;\n metadata?: infer V;\n}\n ? IntlayerNode<\n M,\n {\n use: (components?: HTMLComponents<'permissive', U>) => ReactNode;\n metadata: DeepTransformContent<V>;\n }\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 ? IntlayerNode<\n I,\n {\n use: (components?: HTMLComponents<'permissive', U>) => ReactNode;\n }\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 = Omit<\n IInterpreterPluginStateCore,\n 'insertion' // Remove insertion type from core package\n> & {\n reactNode: true;\n reactIntlayerNode: true;\n reactMarkdown: true;\n reactHtml: true;\n reactInsertion: 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 type IInterpreterPluginState as IInterpreterPluginStateCore,\n type Plugins,\n splitInsertionTemplate,\n} from '@intlayer/core/interpreter';\nimport { getMarkdownMetadata } from '@intlayer/core/markdown';\nimport type {\n HTMLContent,\n InsertionContent,\n MarkdownContent,\n} from '@intlayer/core/transpiler';\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 { HTMLComponents } from './html/HTMLComponentTypes';\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> = T extends {\n nodeType: NodeType | string;\n [NodeType.Insertion]: string;\n fields: readonly string[];\n}\n ? <V extends { [K in T['fields'][number]]: ReactNode }>(\n values: V\n ) => V[keyof V] extends string | number\n ? IntlayerNode<string>\n : IntlayerNode<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 const result = deepTransformNode(children, {\n ...props,\n children,\n keyPath: newKeyPath,\n plugins: [insertionStringPlugin, ...(props.plugins ?? [])],\n });\n\n if (\n typeof children === 'object' &&\n children !== null &&\n 'nodeType' in children &&\n [NodeType.Enumeration, NodeType.Condition].includes(\n children.nodeType as NodeType\n )\n ) {\n return (values: any) => (arg: any) => {\n const func = result as Function;\n const inner = func(arg);\n\n if (typeof inner === 'function') {\n return inner(values);\n }\n return inner;\n };\n }\n\n return result;\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 tags?: infer U;\n metadata?: infer V;\n}\n ? IntlayerNode<\n M,\n {\n use: (components?: HTMLComponents<'permissive', U>) => ReactNode;\n metadata: DeepTransformContent<V>;\n }\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 ? IntlayerNode<\n I,\n {\n use: (components?: HTMLComponents<'permissive', U>) => ReactNode;\n }\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 = Omit<\n IInterpreterPluginStateCore,\n 'insertion' // Remove insertion type from core package\n> & {\n reactNode: true;\n reactIntlayerNode: true;\n reactMarkdown: true;\n reactHtml: true;\n reactInsertion: 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 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IntlayerServerProvider.mjs","names":[],"sources":["../../../src/server/IntlayerServerProvider.tsx"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type { LocalesValues } from '@intlayer/types';\n\nimport type { FC, PropsWithChildren } from 'react';\nimport { createServerContext, getServerContext } from './serverContext';\n\nconst { defaultLocale } = configuration?.internationalization ?? {};\n\n/**\n * Context that store the current locale on the server side\n */\nexport const IntlayerServerContext =\n createServerContext<LocalesValues>(defaultLocale);\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayer = () => getServerContext(IntlayerServerContext);\n\n/**\n * Get the current locale\n */\nexport const locale = getServerContext(IntlayerServerContext);\n\nexport type IntlayerServerProviderProps = PropsWithChildren & {\n locale?: LocalesValues;\n};\n\n/**\n * Provider that store the current locale on the server side\n */\nexport const IntlayerServerProvider: FC<IntlayerServerProviderProps> = ({\n children,\n locale = defaultLocale,\n}) => (\n <IntlayerServerContext.Provider value={locale}>\n {children}\n </IntlayerServerContext.Provider>\n);\n"],"mappings":"8JAMA,KAAM,CAAE,iBAAkB,GAAe,sBAAwB,EAAE,CAKtD,EACX,EAAmC,EAAc,CAKtC,MAAoB,EAAiB,EAAsB,CAK3D,EAAS,EAAiB,EAAsB,CAShD,GAA2D,CACtE,WACA,SAAS,KAET,EAAC,EAAsB,
|
|
1
|
+
{"version":3,"file":"IntlayerServerProvider.mjs","names":[],"sources":["../../../src/server/IntlayerServerProvider.tsx"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type { LocalesValues } from '@intlayer/types';\n\nimport type { FC, PropsWithChildren } from 'react';\nimport { createServerContext, getServerContext } from './serverContext';\n\nconst { defaultLocale } = configuration?.internationalization ?? {};\n\n/**\n * Context that store the current locale on the server side\n */\nexport const IntlayerServerContext =\n createServerContext<LocalesValues>(defaultLocale);\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayer = () => getServerContext(IntlayerServerContext);\n\n/**\n * Get the current locale\n */\nexport const locale = getServerContext(IntlayerServerContext);\n\nexport type IntlayerServerProviderProps = PropsWithChildren & {\n locale?: LocalesValues;\n};\n\n/**\n * Provider that store the current locale on the server side\n */\nexport const IntlayerServerProvider: FC<IntlayerServerProviderProps> = ({\n children,\n locale = defaultLocale,\n}) => (\n <IntlayerServerContext.Provider value={locale}>\n {children}\n </IntlayerServerContext.Provider>\n);\n"],"mappings":"8JAMA,KAAM,CAAE,iBAAkB,GAAe,sBAAwB,EAAE,CAKtD,EACX,EAAmC,EAAc,CAKtC,MAAoB,EAAiB,EAAsB,CAK3D,EAAS,EAAiB,EAAsB,CAShD,GAA2D,CACtE,WACA,SAAS,KAET,EAAC,EAAsB,SAAvB,CAAgC,MAAO,EACpC,WAC8B,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"t.mjs","names":[],"sources":["../../../src/server/t.ts"],"sourcesContent":["import { getTranslation } from '@intlayer/core/interpreter';\nimport type {
|
|
1
|
+
{"version":3,"file":"t.mjs","names":[],"sources":["../../../src/server/t.ts"],"sourcesContent":["import { getTranslation } from '@intlayer/core/interpreter';\nimport type {\n DeclaredLocales,\n LocalesValues,\n StrictModeLocaleMap,\n} from '@intlayer/types';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\n\n/**\n * On the server side, hook to get the translation content based on the locale\n *\n * If not locale found, it will return the content related to the default locale.\n *\n * Return either the content editor, or the content itself depending on the configuration.\n *\n * Usage:\n *\n * ```ts\n * const content = t<string>({\n * en: 'Hello',\n * fr: 'Bonjour',\n * }, 'fr');\n * // 'Bonjour'\n * ```\n *\n * Using TypeScript:\n * - this function will require each locale to be defined if defined in the project configuration.\n * - If a locale is missing, it will make each existing locale optional and raise an error if the locale is not found.\n */\nexport const t = <Content = string, L extends LocalesValues = DeclaredLocales>(\n multilangContent: StrictModeLocaleMap<Content>,\n locale?: L\n) => {\n const currentLocale = getServerContext<LocalesValues>(IntlayerServerContext);\n const localeTarget = locale ?? (currentLocale as LocalesValues);\n\n return getTranslation<Content>(multilangContent, localeTarget);\n};\n"],"mappings":"wLA8BA,MAAa,GACX,EACA,IACG,CACH,IAAM,EAAgB,EAAgC,EAAsB,CAG5E,OAAO,EAAwB,EAFV,GAAW,EAE8B"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{getDictionary as e}from"../getDictionary.mjs";import{getServerContext as t}from"./serverContext.mjs";import{IntlayerServerContext as n}from"./IntlayerServerProvider.mjs";const r=(r,i)=>e(r,i??t(n));export{r as useDictionary};
|
|
1
|
+
import{getDictionary as e}from"../getDictionary.mjs";import{getServerContext as t}from"./serverContext.mjs";import{IntlayerServerContext as n}from"./IntlayerServerProvider.mjs";const r=(r,i,a)=>e(r,i??t(n)??a);export{r as useDictionary};
|
|
2
2
|
//# sourceMappingURL=useDictionary.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDictionary.mjs","names":[],"sources":["../../../src/server/useDictionary.ts"],"sourcesContent":["import type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n} from '@intlayer/types';\nimport { getDictionary } from '../getDictionary';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionary = <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionary: T,\n locale?: L\n) => {\n const localeTarget =\n locale
|
|
1
|
+
{"version":3,"file":"useDictionary.mjs","names":[],"sources":["../../../src/server/useDictionary.ts"],"sourcesContent":["import type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n} from '@intlayer/types';\nimport { getDictionary } from '../getDictionary';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionary = <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionary: T,\n locale?: L,\n fallbackLocale?: DeclaredLocales\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n fallbackLocale;\n\n return getDictionary<T, L>(dictionary, localeTarget as L);\n};\n"],"mappings":"iLAcA,MAAa,GAIX,EACA,EACA,IAOO,EAAoB,EAJzB,GACA,EAAgC,EAAsB,EACtD,EAEuD"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{getServerContext as e}from"./serverContext.mjs";import{IntlayerServerContext as t}from"./IntlayerServerProvider.mjs";import{useDictionary as n}from"./useDictionary.mjs";import r from"@intlayer/config/built";const i=async(i,a)=>{let
|
|
1
|
+
import{getServerContext as e}from"./serverContext.mjs";import{IntlayerServerContext as t}from"./IntlayerServerProvider.mjs";import{useDictionary as n}from"./useDictionary.mjs";import r from"@intlayer/config/built";const i=async(i,a,o)=>{let s=a??e(t)??o??r?.internationalization.defaultLocale;return n(await i[s]?.(),s)};export{i as useDictionaryAsync};
|
|
2
2
|
//# sourceMappingURL=useDictionaryAsync.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDictionaryAsync.mjs","names":[],"sources":["../../../src/server/useDictionaryAsync.ts"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n StrictModeLocaleMap,\n} from '@intlayer/types';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\nimport { useDictionary } from './useDictionary';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionaryAsync = async <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>,\n locale?: L\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n configuration?.internationalization.defaultLocale;\n\n const dictionary = await (dictionaryPromise as any)[localeTarget]?.();\n\n return useDictionary<T, L>(dictionary, localeTarget as L);\n};\n"],"mappings":"sNAgBA,MAAa,EAAqB,MAIhC,EACA,IACG,CACH,IAAM,EACJ,GACA,EAAgC,EAAsB,EACtD,GAAe,qBAAqB,cAItC,OAAO,EAFY,MAAO,EAA0B,MAAiB,CAE9B,EAAkB"}
|
|
1
|
+
{"version":3,"file":"useDictionaryAsync.mjs","names":[],"sources":["../../../src/server/useDictionaryAsync.ts"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n StrictModeLocaleMap,\n} from '@intlayer/types';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\nimport { useDictionary } from './useDictionary';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionaryAsync = async <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>,\n locale?: L,\n fallbackLocale?: DeclaredLocales\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n fallbackLocale ??\n configuration?.internationalization.defaultLocale;\n\n const dictionary = await (dictionaryPromise as any)[localeTarget]?.();\n\n return useDictionary<T, L>(dictionary, localeTarget as L);\n};\n"],"mappings":"sNAgBA,MAAa,EAAqB,MAIhC,EACA,EACA,IACG,CACH,IAAM,EACJ,GACA,EAAgC,EAAsB,EACtD,GACA,GAAe,qBAAqB,cAItC,OAAO,EAFY,MAAO,EAA0B,MAAiB,CAE9B,EAAkB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{getServerContext as e}from"./serverContext.mjs";import{IntlayerServerContext as t}from"./IntlayerServerProvider.mjs";import{useDictionary as n}from"./useDictionary.mjs";import{useLoadDynamic as r}from"./useLoadDynamic.mjs";import i from"@intlayer/config/built";const a=(a,o,s)=>{let
|
|
1
|
+
import{getServerContext as e}from"./serverContext.mjs";import{IntlayerServerContext as t}from"./IntlayerServerProvider.mjs";import{useDictionary as n}from"./useDictionary.mjs";import{useLoadDynamic as r}from"./useLoadDynamic.mjs";import i from"@intlayer/config/built";const a=(a,o,s,c)=>{let l=s??e(t)??c??i?.internationalization.defaultLocale;return n(r(`${String(o)}.${l}`,a[l]?.()),l)};export{a as useDictionaryDynamic};
|
|
2
2
|
//# sourceMappingURL=useDictionaryDynamic.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDictionaryDynamic.mjs","names":[],"sources":["../../../src/server/useDictionaryDynamic.ts"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n StrictModeLocaleMap,\n} from '@intlayer/types';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\nimport { useDictionary } from './useDictionary';\nimport { useLoadDynamic } from './useLoadDynamic';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionaryDynamic = <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>,\n key: string,\n locale?: L\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n configuration?.internationalization.defaultLocale;\n\n const dictionary = useLoadDynamic<T>(\n `${String(key)}.${localeTarget}`,\n (dictionaryPromise as any)[localeTarget]?.()\n );\n\n return useDictionary<T, L>(dictionary, localeTarget as L);\n};\n"],"mappings":"4QAiBA,MAAa,GAIX,EACA,EACA,IACG,CACH,IAAM,EACJ,GACA,EAAgC,EAAsB,EACtD,GAAe,qBAAqB,cAOtC,OAAO,EALY,EACjB,GAAG,OAAO,EAAI,CAAC,GAAG,IACjB,EAA0B,MAAiB,CAC7C,CAEsC,EAAkB"}
|
|
1
|
+
{"version":3,"file":"useDictionaryDynamic.mjs","names":[],"sources":["../../../src/server/useDictionaryDynamic.ts"],"sourcesContent":["import configuration from '@intlayer/config/built';\nimport type {\n DeclaredLocales,\n Dictionary,\n LocalesValues,\n StrictModeLocaleMap,\n} from '@intlayer/types';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\nimport { useDictionary } from './useDictionary';\nimport { useLoadDynamic } from './useLoadDynamic';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useDictionaryDynamic = <\n T extends Dictionary,\n L extends LocalesValues = DeclaredLocales,\n>(\n dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>,\n key: string,\n locale?: L,\n fallbackLocale?: DeclaredLocales\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n fallbackLocale ??\n configuration?.internationalization.defaultLocale;\n\n const dictionary = useLoadDynamic<T>(\n `${String(key)}.${localeTarget}`,\n (dictionaryPromise as any)[localeTarget]?.()\n );\n\n return useDictionary<T, L>(dictionary, localeTarget as L);\n};\n"],"mappings":"4QAiBA,MAAa,GAIX,EACA,EACA,EACA,IACG,CACH,IAAM,EACJ,GACA,EAAgC,EAAsB,EACtD,GACA,GAAe,qBAAqB,cAOtC,OAAO,EALY,EACjB,GAAG,OAAO,EAAI,CAAC,GAAG,IACjB,EAA0B,MAAiB,CAC7C,CAEsC,EAAkB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{getIntlayer as e}from"../getIntlayer.mjs";import{getServerContext as t}from"./serverContext.mjs";import{IntlayerServerContext as n}from"./IntlayerServerProvider.mjs";const r=(r,i)=>e(r,i??t(n));export{r as useIntlayer};
|
|
1
|
+
import{getIntlayer as e}from"../getIntlayer.mjs";import{getServerContext as t}from"./serverContext.mjs";import{IntlayerServerContext as n}from"./IntlayerServerProvider.mjs";const r=(r,i,a)=>e(r,i??t(n)??a);export{r as useIntlayer};
|
|
2
2
|
//# sourceMappingURL=useIntlayer.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useIntlayer.mjs","names":[],"sources":["../../../src/server/useIntlayer.ts"],"sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"useIntlayer.mjs","names":[],"sources":["../../../src/server/useIntlayer.ts"],"sourcesContent":["import type {\n DeclaredLocales,\n DictionaryKeys,\n LocalesValues,\n} from '@intlayer/types';\nimport { getIntlayer } from '../getIntlayer';\nimport { IntlayerServerContext } from './IntlayerServerProvider';\nimport { getServerContext } from './serverContext';\n\n/**\n * On the server side, Hook that picking one dictionary by its key and return the content\n *\n * If the locale is not provided, it will use the locale from the server context\n */\nexport const useIntlayer = <\n T extends DictionaryKeys,\n L extends LocalesValues = DeclaredLocales,\n>(\n key: T,\n locale?: L,\n fallbackLocale?: DeclaredLocales\n) => {\n const localeTarget =\n locale ??\n getServerContext<LocalesValues>(IntlayerServerContext) ??\n fallbackLocale;\n\n return getIntlayer<T, L>(key, localeTarget as L);\n};\n"],"mappings":"6KAcA,MAAa,GAIX,EACA,EACA,IAOO,EAAkB,EAJvB,GACA,EAAgC,EAAsB,EACtD,EAE8C"}
|
package/dist/types/server/t.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { LocalesValues, StrictModeLocaleMap } from "@intlayer/types";
|
|
1
|
+
import { DeclaredLocales, LocalesValues, StrictModeLocaleMap } from "@intlayer/types";
|
|
2
2
|
|
|
3
3
|
//#region src/server/t.d.ts
|
|
4
4
|
/**
|
|
@@ -22,7 +22,7 @@ import { LocalesValues, StrictModeLocaleMap } from "@intlayer/types";
|
|
|
22
22
|
* - this function will require each locale to be defined if defined in the project configuration.
|
|
23
23
|
* - If a locale is missing, it will make each existing locale optional and raise an error if the locale is not found.
|
|
24
24
|
*/
|
|
25
|
-
declare const t: <Content = string>(multilangContent: StrictModeLocaleMap<Content>, locale?:
|
|
25
|
+
declare const t: <Content = string, L extends LocalesValues = DeclaredLocales>(multilangContent: StrictModeLocaleMap<Content>, locale?: L) => Content;
|
|
26
26
|
//#endregion
|
|
27
27
|
export { t };
|
|
28
28
|
//# sourceMappingURL=t.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"t.d.ts","names":[],"sources":["../../../src/server/t.ts"],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"t.d.ts","names":[],"sources":["../../../src/server/t.ts"],"mappings":";;;;;AA8BA;;;;;;;;;;;;;;;;;;;cAAa,CAAA,+BAAiC,aAAA,GAAgB,eAAA,EAC5D,gBAAA,EAAkB,mBAAA,CAAoB,OAAA,GACtC,MAAA,GAAS,CAAA,KAAC,OAAA"}
|
|
@@ -8,7 +8,7 @@ import { DeclaredLocales, Dictionary, LocalesValues } from "@intlayer/types";
|
|
|
8
8
|
*
|
|
9
9
|
* If the locale is not provided, it will use the locale from the server context
|
|
10
10
|
*/
|
|
11
|
-
declare const useDictionary: <T extends Dictionary, L extends LocalesValues = DeclaredLocales>(dictionary: T, locale?: L) => _intlayer_core_interpreter0.DeepTransformContent<T["content"], IInterpreterPluginState$1, L>;
|
|
11
|
+
declare const useDictionary: <T extends Dictionary, L extends LocalesValues = DeclaredLocales>(dictionary: T, locale?: L, fallbackLocale?: DeclaredLocales) => _intlayer_core_interpreter0.DeepTransformContent<T["content"], IInterpreterPluginState$1, L>;
|
|
12
12
|
//#endregion
|
|
13
13
|
export { useDictionary };
|
|
14
14
|
//# sourceMappingURL=useDictionary.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDictionary.d.ts","names":[],"sources":["../../../src/server/useDictionary.ts"],"mappings":";;;;;;;;;AAcA;cAAa,aAAA,aACD,UAAA,YACA,aAAA,GAAgB,eAAA,EAE1B,UAAA,EAAY,CAAA,EACZ,MAAA,GAAS,CAAA,
|
|
1
|
+
{"version":3,"file":"useDictionary.d.ts","names":[],"sources":["../../../src/server/useDictionary.ts"],"mappings":";;;;;;;;;AAcA;cAAa,aAAA,aACD,UAAA,YACA,aAAA,GAAgB,eAAA,EAE1B,UAAA,EAAY,CAAA,EACZ,MAAA,GAAS,CAAA,EACT,cAAA,GAAiB,eAAA,KAAe,2BAAA,CAAA,oBAAA,CAAA,CAAA,aAAA,yBAAA,EAAA,CAAA"}
|
|
@@ -8,7 +8,7 @@ import { DeclaredLocales, Dictionary, LocalesValues, StrictModeLocaleMap } from
|
|
|
8
8
|
*
|
|
9
9
|
* If the locale is not provided, it will use the locale from the server context
|
|
10
10
|
*/
|
|
11
|
-
declare const useDictionaryAsync: <T extends Dictionary, L extends LocalesValues = DeclaredLocales>(dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>, locale?: L) => Promise<_intlayer_core_interpreter0.DeepTransformContent<T["content"], IInterpreterPluginState$1, L>>;
|
|
11
|
+
declare const useDictionaryAsync: <T extends Dictionary, L extends LocalesValues = DeclaredLocales>(dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>, locale?: L, fallbackLocale?: DeclaredLocales) => Promise<_intlayer_core_interpreter0.DeepTransformContent<T["content"], IInterpreterPluginState$1, L>>;
|
|
12
12
|
//#endregion
|
|
13
13
|
export { useDictionaryAsync };
|
|
14
14
|
//# sourceMappingURL=useDictionaryAsync.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDictionaryAsync.d.ts","names":[],"sources":["../../../src/server/useDictionaryAsync.ts"],"mappings":";;;;;;;;;AAgBA;cAAa,kBAAA,aACD,UAAA,YACA,aAAA,GAAgB,eAAA,EAE1B,iBAAA,EAAmB,mBAAA,OAA0B,OAAA,CAAQ,CAAA,IACrD,MAAA,GAAS,CAAA,
|
|
1
|
+
{"version":3,"file":"useDictionaryAsync.d.ts","names":[],"sources":["../../../src/server/useDictionaryAsync.ts"],"mappings":";;;;;;;;;AAgBA;cAAa,kBAAA,aACD,UAAA,YACA,aAAA,GAAgB,eAAA,EAE1B,iBAAA,EAAmB,mBAAA,OAA0B,OAAA,CAAQ,CAAA,IACrD,MAAA,GAAS,CAAA,EACT,cAAA,GAAiB,eAAA,KAAe,OAAA,CAAA,2BAAA,CAAA,oBAAA,CAAA,CAAA,aAAA,yBAAA,EAAA,CAAA"}
|
|
@@ -8,7 +8,7 @@ import { DeclaredLocales, Dictionary, LocalesValues, StrictModeLocaleMap } from
|
|
|
8
8
|
*
|
|
9
9
|
* If the locale is not provided, it will use the locale from the server context
|
|
10
10
|
*/
|
|
11
|
-
declare const useDictionaryDynamic: <T extends Dictionary, L extends LocalesValues = DeclaredLocales>(dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>, key: string, locale?: L) => _intlayer_core_interpreter0.DeepTransformContent<T["content"], IInterpreterPluginState$1, L>;
|
|
11
|
+
declare const useDictionaryDynamic: <T extends Dictionary, L extends LocalesValues = DeclaredLocales>(dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>, key: string, locale?: L, fallbackLocale?: DeclaredLocales) => _intlayer_core_interpreter0.DeepTransformContent<T["content"], IInterpreterPluginState$1, L>;
|
|
12
12
|
//#endregion
|
|
13
13
|
export { useDictionaryDynamic };
|
|
14
14
|
//# sourceMappingURL=useDictionaryDynamic.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDictionaryDynamic.d.ts","names":[],"sources":["../../../src/server/useDictionaryDynamic.ts"],"mappings":";;;;;;;;;AAiBA;cAAa,oBAAA,aACD,UAAA,YACA,aAAA,GAAgB,eAAA,EAE1B,iBAAA,EAAmB,mBAAA,OAA0B,OAAA,CAAQ,CAAA,IACrD,GAAA,UACA,MAAA,GAAS,CAAA,
|
|
1
|
+
{"version":3,"file":"useDictionaryDynamic.d.ts","names":[],"sources":["../../../src/server/useDictionaryDynamic.ts"],"mappings":";;;;;;;;;AAiBA;cAAa,oBAAA,aACD,UAAA,YACA,aAAA,GAAgB,eAAA,EAE1B,iBAAA,EAAmB,mBAAA,OAA0B,OAAA,CAAQ,CAAA,IACrD,GAAA,UACA,MAAA,GAAS,CAAA,EACT,cAAA,GAAiB,eAAA,KAAe,2BAAA,CAAA,oBAAA,CAAA,CAAA,aAAA,yBAAA,EAAA,CAAA"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { IInterpreterPluginState as IInterpreterPluginState$1 } from "../plugins.js";
|
|
2
2
|
import * as _intlayer_core_interpreter0 from "@intlayer/core/interpreter";
|
|
3
3
|
import * as _intlayer_types0 from "@intlayer/types";
|
|
4
|
-
import { DictionaryKeys, LocalesValues } from "@intlayer/types";
|
|
4
|
+
import { DeclaredLocales, DictionaryKeys, LocalesValues } from "@intlayer/types";
|
|
5
5
|
|
|
6
6
|
//#region src/server/useIntlayer.d.ts
|
|
7
7
|
/**
|
|
@@ -9,7 +9,7 @@ import { DictionaryKeys, LocalesValues } from "@intlayer/types";
|
|
|
9
9
|
*
|
|
10
10
|
* If the locale is not provided, it will use the locale from the server context
|
|
11
11
|
*/
|
|
12
|
-
declare const useIntlayer: <T extends DictionaryKeys, L extends LocalesValues>(key: T, locale?: L) => _intlayer_core_interpreter0.DeepTransformContent<_intlayer_types0.DictionaryRegistryContent<T>, IInterpreterPluginState$1, L>;
|
|
12
|
+
declare const useIntlayer: <T extends DictionaryKeys, L extends LocalesValues = DeclaredLocales>(key: T, locale?: L, fallbackLocale?: DeclaredLocales) => _intlayer_core_interpreter0.DeepTransformContent<_intlayer_types0.DictionaryRegistryContent<T>, IInterpreterPluginState$1, L>;
|
|
13
13
|
//#endregion
|
|
14
14
|
export { useIntlayer };
|
|
15
15
|
//# sourceMappingURL=useIntlayer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useIntlayer.d.ts","names":[],"sources":["../../../src/server/useIntlayer.ts"],"mappings":";;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"useIntlayer.d.ts","names":[],"sources":["../../../src/server/useIntlayer.ts"],"mappings":";;;;;;;;;;;cAca,WAAA,aACD,cAAA,YACA,aAAA,GAAgB,eAAA,EAE1B,GAAA,EAAK,CAAA,EACL,MAAA,GAAS,CAAA,EACT,cAAA,GAAiB,eAAA,KAAe,2BAAA,CAAA,oBAAA,CAAA,gBAAA,CAAA,yBAAA,CAAA,CAAA,GAAA,yBAAA,EAAA,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-intlayer",
|
|
3
|
-
"version": "8.2.
|
|
3
|
+
"version": "8.2.3",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "Easily internationalize i18n your React applications with type-safe multilingual content management.",
|
|
6
6
|
"keywords": [
|
|
@@ -115,26 +115,26 @@
|
|
|
115
115
|
"typecheck": "tsc --noEmit --project tsconfig.types.json"
|
|
116
116
|
},
|
|
117
117
|
"dependencies": {
|
|
118
|
-
"@intlayer/api": "8.2.
|
|
119
|
-
"@intlayer/config": "8.2.
|
|
120
|
-
"@intlayer/core": "8.2.
|
|
121
|
-
"@intlayer/dictionaries-entry": "8.2.
|
|
122
|
-
"@intlayer/editor-react": "8.2.
|
|
123
|
-
"@intlayer/types": "8.2.
|
|
124
|
-
"@intlayer/unmerged-dictionaries-entry": "8.2.
|
|
125
|
-
"intlayer": "8.2.
|
|
118
|
+
"@intlayer/api": "8.2.3",
|
|
119
|
+
"@intlayer/config": "8.2.3",
|
|
120
|
+
"@intlayer/core": "8.2.3",
|
|
121
|
+
"@intlayer/dictionaries-entry": "8.2.3",
|
|
122
|
+
"@intlayer/editor-react": "8.2.3",
|
|
123
|
+
"@intlayer/types": "8.2.3",
|
|
124
|
+
"@intlayer/unmerged-dictionaries-entry": "8.2.3",
|
|
125
|
+
"intlayer": "8.2.3"
|
|
126
126
|
},
|
|
127
127
|
"devDependencies": {
|
|
128
128
|
"@craco/types": "7.1.0",
|
|
129
129
|
"@testing-library/react": "16.3.2",
|
|
130
|
-
"@types/node": "25.3.
|
|
130
|
+
"@types/node": "25.3.5",
|
|
131
131
|
"@types/react": ">=16.0.0",
|
|
132
132
|
"@types/react-dom": ">=16.0.0",
|
|
133
133
|
"@utils/ts-config": "1.0.4",
|
|
134
134
|
"@utils/ts-config-types": "1.0.4",
|
|
135
135
|
"@utils/tsdown-config": "1.0.4",
|
|
136
136
|
"rimraf": "6.1.3",
|
|
137
|
-
"tsdown": "0.
|
|
137
|
+
"tsdown": "0.21.0",
|
|
138
138
|
"typescript": "5.9.3",
|
|
139
139
|
"vite-tsconfig-paths": "6.1.1",
|
|
140
140
|
"vitest": "4.0.18"
|