npm - @intlayer/design-system - Versions diffs - 7.5.9 → 7.5.10 - Mend

@intlayer/design-system 7.5.9 → 7.5.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (272) hide show

package/dist/esm/components/Label/index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.mjs","names":["Label: FC<LabelProps>"],"sources":["../../../../src/components/Label/index.tsx"],"sourcesContent":["import ~~type~~ { ~~FC,~~ ~~LabelHTMLAttributes~~ } from '~~react~~';\nimport { cn } from '~~../../utils/cn~~';\n\n/*\n Props for the Label component\n /\nexport interface LabelProps extends LabelHTMLAttributes<HTMLLabelElement> {\n /\n The ID of the form control this label is associated with.\n * This creates the accessible relationship between the label and its control.\n * @example \"email-input\"\n * @example \"password-field\"\n /\n htmlFor?: string;\n\n /\n Whether the associated form control is required.\n * Adds visual indicator and updates ARIA attributes.\n * @default false\n /\n required?: boolean;\n\n /\n Whether the associated form control is disabled.\n * Updates styling to indicate disabled state.\n * @default false\n /\n disabled?: boolean;\n\n /\n Additional CSS classes for custom styling\n * @example \"text-red-600 font-bold\"\n /\n className?: string;\n}\n\n/\n Label Component\n \n A form label component that provides accessible labeling for form controls.\n * Establishes proper relationships between labels and their associated form elements\n * with visual indicators for required and disabled states.\n \n @example\n * ```tsx\n * // Basic usage\n * <Label htmlFor=\"email\">Email Address</Label>\n * <input id=\"email\" type=\"email\" />\n \n // Required field\n * <Label htmlFor=\"password\" required>Password</Label>\n * <input id=\"password\" type=\"password\" required />\n \n // Disabled field\n * <Label htmlFor=\"disabled-field\" disabled>Disabled Field</Label>\n * <input id=\"disabled-field\" type=\"text\" disabled />\n \n // With custom styling\n * <Label htmlFor=\"custom\" className=\"text-blue-600 font-semibold\">\n * Custom Styled Label\n * </Label>\n * ```\n \n @component\n * @accessibility\n * - Uses semantic HTML <label> element\n * - Properly associates with form controls via htmlFor/id relationship\n * - Supports click-to-focus behavior automatically\n * - Visual indicators for required and disabled states\n * - Screen reader compatible with proper ARIA relationships\n /\nexport const Label: FC<LabelProps> = ({\n htmlFor,\n required = false,\n disabled = false,\n className,\n children,\n ...props\n}) => (\n <label\n className={cn(\n 'select-none font-medium text-sm leading-none',\n 'peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n disabled && 'cursor-not-allowed text-muted-foreground opacity-70',\n className\n )}\n htmlFor={htmlFor}\n {...props}\n >\n {children}\n {required && (\n <span\n className=\"ml-1 text-destructive\"\n aria-label=\"required\"\n title=\"This field is required\"\n >\n \n </span>\n )}\n </label>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuEA,MAAaA,SAAyB,EACpC,SACA,WAAW,OACX,WAAW,OACX,WACA,UACA,GAAG,YAEH,qBAAC;CACC,WAAW,GACT,gDACA,6DACA,YAAY,uDACZ,UACD;CACQ;CACT,GAAI;YAEH,UACA,YACC,oBAAC;EACC,WAAU;EACV,cAAW;EACX,OAAM;YACP;GAEM;EAEH"}
1	+ {"version":3,"file":"index.mjs","names":["Label: FC<LabelProps>"],"sources":["../../../../src/components/Label/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport type { FC, LabelHTMLAttributes } from 'react';\n\n/*\n Props for the Label component\n /\nexport interface LabelProps extends LabelHTMLAttributes<HTMLLabelElement> {\n /\n The ID of the form control this label is associated with.\n * This creates the accessible relationship between the label and its control.\n * @example \"email-input\"\n * @example \"password-field\"\n /\n htmlFor?: string;\n\n /\n Whether the associated form control is required.\n * Adds visual indicator and updates ARIA attributes.\n * @default false\n /\n required?: boolean;\n\n /\n Whether the associated form control is disabled.\n * Updates styling to indicate disabled state.\n * @default false\n /\n disabled?: boolean;\n\n /\n Additional CSS classes for custom styling\n * @example \"text-red-600 font-bold\"\n /\n className?: string;\n}\n\n/\n Label Component\n \n A form label component that provides accessible labeling for form controls.\n * Establishes proper relationships between labels and their associated form elements\n * with visual indicators for required and disabled states.\n \n @example\n * ```tsx\n * // Basic usage\n * <Label htmlFor=\"email\">Email Address</Label>\n * <input id=\"email\" type=\"email\" />\n \n // Required field\n * <Label htmlFor=\"password\" required>Password</Label>\n * <input id=\"password\" type=\"password\" required />\n \n // Disabled field\n * <Label htmlFor=\"disabled-field\" disabled>Disabled Field</Label>\n * <input id=\"disabled-field\" type=\"text\" disabled />\n \n // With custom styling\n * <Label htmlFor=\"custom\" className=\"text-blue-600 font-semibold\">\n * Custom Styled Label\n * </Label>\n * ```\n \n @component\n * @accessibility\n * - Uses semantic HTML <label> element\n * - Properly associates with form controls via htmlFor/id relationship\n * - Supports click-to-focus behavior automatically\n * - Visual indicators for required and disabled states\n * - Screen reader compatible with proper ARIA relationships\n /\nexport const Label: FC<LabelProps> = ({\n htmlFor,\n required = false,\n disabled = false,\n className,\n children,\n ...props\n}) => (\n <label\n className={cn(\n 'select-none font-medium text-sm leading-none',\n 'peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n disabled && 'cursor-not-allowed text-muted-foreground opacity-70',\n className\n )}\n htmlFor={htmlFor}\n {...props}\n >\n {children}\n {required && (\n <span\n className=\"ml-1 text-destructive\"\n aria-label=\"required\"\n title=\"This field is required\"\n >\n \n </span>\n )}\n </label>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuEA,MAAaA,SAAyB,EACpC,SACA,WAAW,OACX,WAAW,OACX,WACA,UACA,GAAG,YAEH,qBAAC;CACC,WAAW,GACT,gDACA,6DACA,YAAY,uDACZ,UACD;CACQ;CACT,GAAI;YAEH,UACA,YACC,oBAAC;EACC,WAAU;EACV,cAAW;EACX,OAAM;YACP;GAEM;EAEH"}

package/dist/esm/components/LanguageBackground/index.mjs ADDED Viewed

@@ -0,0 +1,88 @@
+'use client';
+import { cn } from "../../utils/cn.mjs";
+import { useEffect, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { Container, Flag } from "@intlayer/design-system";
+import { Locales, getHTMLTextDir, getLocaleName } from "intlayer";
+//#region src/components/LanguageBackground/index.tsx
+const shuffleArray = (array, limit) => {
+	const shuffled = [...array];
+	for (let i = shuffled.length - 1; i > 0; i--) {
+		const randomIndex = Math.floor(Math.random() * (i + 1));
+		[shuffled[i], shuffled[randomIndex]] = [shuffled[randomIndex], shuffled[i]];
+	}
+	return limit ? shuffled.slice(0, limit) : shuffled;
+};
+const LocalCard = ({ locale, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: "group z-10 mx-8 inline-flex shrink-0 transition-transform duration-300 hover:scale-105",
+	...props,
+	children: /* @__PURE__ */ jsxs(Container, {
+		roundedSize: "xl",
+		className: "flex flex-row items-center gap-5 p-3",
+		children: [/* @__PURE__ */ jsx(Flag, {
+			locale,
+			className: "max-h-5 max-w-5 rounded-sm grayscale-80 transition duration-300 group-hover:grayscale-0",
+			width: 640,
+			height: 480,
+			loading: "lazy"
+		}), /* @__PURE__ */ jsx("span", {
+			dir: getHTMLTextDir(locale),
+			lang: locale,
+			className: "flex text-nowrap",
+			children: getLocaleName(locale)
+		})]
+	})
+});
+const LocalCardList = ({ localeList, className, ...props }) => /* @__PURE__ */ jsx("div", {
+	className: "relative flex w-full overflow-hidden",
+	...props,
+	children: /* @__PURE__ */ jsxs("div", {
+		className: cn("inline-flex shrink-0 will-change-transform", className),
+		children: [localeList.map((locale, index) => /* @__PURE__ */ jsx(LocalCard, { locale }, `${locale}-first-${index}`)), localeList.map((locale, index) => /* @__PURE__ */ jsx(LocalCard, { locale }, `${locale}-second-${index}`))]
+	})
+});
+const NUM_OF_LOCALES = 15;
+const emptyArrayOfLocale = new Array(4).fill(0).map(() => []);
+const arrayOfLocale = new Array(4).fill(0).map(() => shuffleArray(Object.values(Locales.ALL_LOCALES), NUM_OF_LOCALES));
+const LanguageSection = ({ className, ...props }) => {
+	const [localeList, setLocaleList] = useState(emptyArrayOfLocale);
+	const [firstPart, secondPart, thirdPart, fourthPart] = localeList;
+	useEffect(() => {
+		setLocaleList(arrayOfLocale);
+	}, []);
+	return /* @__PURE__ */ jsx("section", {
+		className: cn("mask-[linear-gradient(to_right,transparent_0,black_128px,black_calc(100%-128px),transparent_100%)] my-10 w-full overflow-hidden", className),
+		...props,
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "relative flex w-full flex-col gap-5 py-3",
+			children: [
+				/* @__PURE__ */ jsx(LocalCardList, {
+					localeList: firstPart,
+					className: "horizontal-loop-1"
+				}),
+				/* @__PURE__ */ jsx(LocalCardList, {
+					localeList: secondPart,
+					className: "horizontal-loop-2"
+				}),
+				/* @__PURE__ */ jsx(LocalCardList, {
+					localeList: thirdPart,
+					className: "horizontal-loop-1"
+				}),
+				/* @__PURE__ */ jsx(LocalCardList, {
+					localeList: fourthPart,
+					className: "horizontal-loop-2"
+				})
+			]
+		})
+	});
+};
+const LanguageBackground = ({ children }) => /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("div", {
+	className: "absolute top-0 left-0 z-0 flex size-full items-center justify-center",
+	children: /* @__PURE__ */ jsx(LanguageSection, { className: "mt-[30%]" })
+}), children] });
+//#endregion
+export { LanguageBackground, LanguageSection };
+//# sourceMappingURL=index.mjs.map

package/dist/esm/components/LanguageBackground/index.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.mjs","names":["LocalCard: FC<{ locale: string }>","LocalCardList: FC<{ localeList: string[]; className?: string }>","emptyArrayOfLocale: string[][]","arrayOfLocale: string[][]","LanguageSection: FC<HTMLAttributes<HTMLElement>>","LanguageBackground: FC<PropsWithChildren>"],"sources":["../../../../src/components/LanguageBackground/index.tsx"],"sourcesContent":["'use client';\n\nimport { Container, Flag } from '@intlayer/design-system';\nimport { cn } from '@utils/cn';\nimport { getHTMLTextDir, getLocaleName, type Locale, Locales } from 'intlayer';\nimport {\n type FC,\n type HTMLAttributes,\n type PropsWithChildren,\n useEffect,\n useState,\n} from 'react';\n\nconst shuffleArray = (array: string[], limit?: number) => {\n const shuffled = [...array];\n\n for (let i = shuffled.length - 1; i > 0; i--) {\n const randomIndex = Math.floor(Math.random() * (i + 1));\n\n [shuffled[i], shuffled[randomIndex]] = [shuffled[randomIndex], shuffled[i]];\n }\n\n return limit ? shuffled.slice(0, limit) : shuffled;\n};\n\nconst LocalCard: FC<{ locale: string }> = ({ locale, ...props }) => (\n <div\n className=\"group z-10 mx-8 inline-flex shrink-0 transition-transform duration-300 hover:scale-105\"\n {...props}\n >\n <Container\n roundedSize=\"xl\"\n className=\"flex flex-row items-center gap-5 p-3\"\n >\n <Flag\n locale={locale as Locale}\n className=\"max-h-5 max-w-5 rounded-sm grayscale-80 transition duration-300 group-hover:grayscale-0\"\n width={640}\n height={480}\n loading=\"lazy\"\n />\n <span\n dir={getHTMLTextDir(locale as Locale)}\n lang={locale as Locale}\n className=\"flex text-nowrap\"\n >\n {getLocaleName(locale as Locale)}\n </span>\n </Container>\n </div>\n);\n\nconst LocalCardList: FC<{ localeList: string[]; className?: string }> = ({\n localeList,\n className,\n ...props\n}) => (\n <div className=\"relative flex w-full overflow-hidden\" {...props}>\n <div\n className={cn('inline-flex shrink-0 will-change-transform', className)}\n >\n {/* First set of cards */}\n {localeList.map((locale, index) => (\n <LocalCard key={`${locale}-first-${index}`} locale={locale} />\n ))}\n {/* Duplicate set for seamless loop */}\n {localeList.map((locale, index) => (\n <LocalCard key={`${locale}-second-${index}`} locale={locale} />\n ))}\n </div>\n </div>\n);\n\nconst NUM_OF_LOCALES = 15;\n\nconst emptyArrayOfLocale: string[][] = new Array(4).fill(0).map(() => []);\nconst arrayOfLocale: string[][] = new Array(4)\n .fill(0)\n .map(() => shuffleArray(Object.values(Locales.ALL_LOCALES), NUM_OF_LOCALES));\n\nexport const LanguageSection: FC<HTMLAttributes<HTMLElement>> = ({\n className,\n ...props\n}) => {\n const [localeList, setLocaleList] = useState(emptyArrayOfLocale);\n const [firstPart, secondPart, thirdPart, fourthPart] = localeList;\n\n useEffect(() => {\n setLocaleList(arrayOfLocale);\n }, []);\n\n return (\n <section\n className={cn(\n 'mask-[linear-gradient(to_right,transparent_0,black_128px,black_calc(100%-128px),transparent_100%)] my-10 w-full overflow-hidden',\n className\n )}\n {...props}\n >\n <div className=\"relative flex w-full flex-col gap-5 py-3\">\n <LocalCardList localeList={firstPart} className=\"horizontal-loop-1\" />\n <LocalCardList localeList={secondPart} className=\"horizontal-loop-2\" />\n <LocalCardList localeList={thirdPart} className=\"horizontal-loop-1\" />\n <LocalCardList localeList={fourthPart} className=\"horizontal-loop-2\" />\n </div>\n </section>\n );\n};\n\nexport const LanguageBackground: FC<PropsWithChildren> = ({ children }) => (\n <>\n <div className=\"absolute top-0 left-0 z-0 flex size-full items-center justify-center\">\n <LanguageSection className=\"mt-[30%]\" />\n </div>\n {children}\n </>\n);\n"],"mappings":";;;;;;;;;AAaA,MAAM,gBAAgB,OAAiB,UAAmB;CACxD,MAAM,WAAW,CAAC,GAAG,MAAM;AAE3B,MAAK,IAAI,IAAI,SAAS,SAAS,GAAG,IAAI,GAAG,KAAK;EAC5C,MAAM,cAAc,KAAK,MAAM,KAAK,QAAQ,IAAI,IAAI,GAAG;AAEvD,GAAC,SAAS,IAAI,SAAS,gBAAgB,CAAC,SAAS,cAAc,SAAS,GAAG;;AAG7E,QAAO,QAAQ,SAAS,MAAM,GAAG,MAAM,GAAG;;AAG5C,MAAMA,aAAqC,EAAE,QAAQ,GAAG,YACtD,oBAAC;CACC,WAAU;CACV,GAAI;WAEJ,qBAAC;EACC,aAAY;EACZ,WAAU;aAEV,oBAAC;GACS;GACR,WAAU;GACV,OAAO;GACP,QAAQ;GACR,SAAQ;IACR,EACF,oBAAC;GACC,KAAK,eAAe,OAAiB;GACrC,MAAM;GACN,WAAU;aAET,cAAc,OAAiB;IAC3B;GACG;EACR;AAGR,MAAMC,iBAAmE,EACvE,YACA,WACA,GAAG,YAEH,oBAAC;CAAI,WAAU;CAAuC,GAAI;WACxD,qBAAC;EACC,WAAW,GAAG,8CAA8C,UAAU;aAGrE,WAAW,KAAK,QAAQ,UACvB,oBAAC,aAAmD,UAApC,GAAG,OAAO,SAAS,QAA2B,CAC9D,EAED,WAAW,KAAK,QAAQ,UACvB,oBAAC,aAAoD,UAArC,GAAG,OAAO,UAAU,QAA2B,CAC/D;GACE;EACF;AAGR,MAAM,iBAAiB;AAEvB,MAAMC,qBAAiC,IAAI,MAAM,EAAE,CAAC,KAAK,EAAE,CAAC,UAAU,EAAE,CAAC;AACzE,MAAMC,gBAA4B,IAAI,MAAM,EAAE,CAC3C,KAAK,EAAE,CACP,UAAU,aAAa,OAAO,OAAO,QAAQ,YAAY,EAAE,eAAe,CAAC;AAE9E,MAAaC,mBAAoD,EAC/D,WACA,GAAG,YACC;CACJ,MAAM,CAAC,YAAY,iBAAiB,SAAS,mBAAmB;CAChE,MAAM,CAAC,WAAW,YAAY,WAAW,cAAc;AAEvD,iBAAgB;AACd,gBAAc,cAAc;IAC3B,EAAE,CAAC;AAEN,QACE,oBAAC;EACC,WAAW,GACT,mIACA,UACD;EACD,GAAI;YAEJ,qBAAC;GAAI,WAAU;;IACb,oBAAC;KAAc,YAAY;KAAW,WAAU;MAAsB;IACtE,oBAAC;KAAc,YAAY;KAAY,WAAU;MAAsB;IACvE,oBAAC;KAAc,YAAY;KAAW,WAAU;MAAsB;IACtE,oBAAC;KAAc,YAAY;KAAY,WAAU;MAAsB;;IACnE;GACE;;AAId,MAAaC,sBAA6C,EAAE,eAC1D,8CACE,oBAAC;CAAI,WAAU;WACb,oBAAC,mBAAgB,WAAU,aAAa;EACpC,EACL,YACA"}

package/dist/esm/components/Link/Link.mjs CHANGED Viewed

@@ -8,53 +8,32 @@ import { getLocalizedUrl } from "@intlayer/core";
 //#region src/components/Link/Link.tsx
 /**
 * Visual style variants for Link component
-*
-* @enum {string}
 */
 let LinkVariant = /* @__PURE__ */ function(LinkVariant$1) {
-	/** Default underlined link with hover effects */
 	LinkVariant$1["DEFAULT"] = "default";
-	/** Link without visible underline or hover effects */
 	LinkVariant$1["INVISIBLE_LINK"] = "invisible-link";
-	/** Button-styled link with solid background */
 	LinkVariant$1["BUTTON"] = "button";
-	/** Button-styled link with outlined border */
 	LinkVariant$1["BUTTON_OUTLINED"] = "button-outlined";
-	/** Link with subtle hover background effect */
 	LinkVariant$1["HOVERABLE"] = "hoverable";
 	return LinkVariant$1;
 }({});
 /**
 * Color theme variants for Link component
-*
-* @enum {string}
 */
 let LinkColor = /* @__PURE__ */ function(LinkColor$1) {
-	/** Primary brand color */
 	LinkColor$1["PRIMARY"] = "primary";
-	/** Secondary brand color */
 	LinkColor$1["SECONDARY"] = "secondary";
-	/** Destructive/danger color for critical actions */
 	LinkColor$1["DESTRUCTIVE"] = "destructive";
-	/** Neutral/muted color for less prominent links */
 	LinkColor$1["NEUTRAL"] = "neutral";
-	/** Light color for dark backgrounds */
 	LinkColor$1["LIGHT"] = "light";
-	/** Dark color for light backgrounds */
 	LinkColor$1["DARK"] = "dark";
-	/** Default text color */
 	LinkColor$1["TEXT"] = "text";
-	/** Inverse text color for opposite backgrounds */
 	LinkColor$1["TEXT_INVERSE"] = "text-inverse";
-	/** Error/red color for error states */
 	LinkColor$1["ERROR"] = "error";
-	/** Success/green color for positive actions */
 	LinkColor$1["SUCCESS"] = "success";
-	/** Custom color - no default styling applied */
 	LinkColor$1["CUSTOM"] = "custom";
 	return LinkColor$1;
 }({});
-/** Available rounded corner sizes for the container */
 let LinkRoundedSize = /* @__PURE__ */ function(LinkRoundedSize$1) {
 	LinkRoundedSize$1["NONE"] = "none";
 	LinkRoundedSize$1["SM"] = "sm";
@@ -74,24 +53,12 @@ let LinkSize = /* @__PURE__ */ function(LinkSize$1) {
 	LinkSize$1["CUSTOM"] = "custom";
 	return LinkSize$1;
 }({});
-/**
-* Underline style options for Link component
-*
-* @enum {string}
-*/
 let LinkUnderlined = /* @__PURE__ */ function(LinkUnderlined$1) {
-	/** Default underline behavior based on variant */
 	LinkUnderlined$1["DEFAULT"] = "default";
-	/** Always show underline */
 	LinkUnderlined$1["TRUE"] = "true";
-	/** Never show underline */
 	LinkUnderlined$1["FALSE"] = "false";
 	return LinkUnderlined$1;
 }({});
-/**
-* Class variance authority configuration for Link component styling
-* Defines the visual appearance based on variant, color, and underline options
-*/
 const linkVariants = cva("gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50", {
 	variants: {
 		variant: {
@@ -138,6 +105,16 @@ const linkVariants = cva("gap-3 transition-all duration-300 focus-visible:outlin
 		}
 	},
 	compoundVariants: [
+		{
+			variant: LinkVariant.BUTTON,
+			color: LinkColor.TEXT_INVERSE,
+			class: "*:text-text"
+		},
+		{
+			variant: LinkVariant.BUTTON_OUTLINED,
+			color: LinkColor.TEXT_INVERSE,
+			class: "text-text-opposite *:text-text-opposite"
+		},
 		{
 			variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],
 			size: LinkSize.SM,
@@ -217,19 +194,6 @@ const linkVariants = cva("gap-3 transition-all duration-300 focus-visible:outlin
 		size: LinkSize.MD
 	}
 });
-/**
-* Utility function to determine if a link should be treated as external
-*
-* @param props - Link component props containing href and isExternalLink
-* @returns {boolean} True if the link should open externally
-*
-* @example
-* ```tsx
-* checkIsExternalLink({ href: '[https://example.com](https://example.com)' }) // true
-* checkIsExternalLink({ href: '/internal-page' }) // false
-* checkIsExternalLink({ href: '/page', isExternalLink: true }) // true
-* ```
-*/
 const checkIsExternalLink = ({ href, isExternalLink: isExternalLinkProp }) => {
 	const isValidHref = typeof href === "string" && href.trim() !== "";
 	return isExternalLinkProp === true || typeof isExternalLinkProp === "undefined" && isValidHref && /^https?:\/\//.test(href);
@@ -240,13 +204,6 @@ const isTextChildren = (children) => {
 	if (isValidElement(children)) return isTextChildren(children.props.children);
 	return false;
 };
-/**
-* Link Component
-*
-* A versatile link component that handles both internal and external navigation
-* with comprehensive internationalization support and multiple visual variants.
-* ...
-*/
 const Link = (props) => {
 	const { variant = LinkVariant.DEFAULT, color = LinkColor.PRIMARY, roundedSize, children, label, className, isActive, underlined, locale, size, isExternalLink: isExternalLinkProp, isPageSection: isPageSectionProp, href: hrefProp, ...otherProps } = props;
 	const isExternalLink = isExternalLinkProp ?? checkIsExternalLink(props);

package/dist/esm/components/Link/Link.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Link.mjs","names":["Link: FC<LinkProps>"],"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { getLocalizedUrl } from '@intlayer/core';\nimport type { LocalesValues } from '@intlayer/types';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink, MoveRight } from 'lucide-react';\nimport {\n type AnchorHTMLAttributes,\n type DetailedHTMLProps,\n type FC,\n isValidElement,\n type ReactNode,\n} from 'react';\nimport { cn } from '../../utils/cn';\n\n/*\n Visual style variants for Link component\n \n @enum {string}\n /\nexport enum LinkVariant {\n /* Default underlined link with hover effects /\n DEFAULT = 'default',\n /* Link without visible underline or hover effects /\n INVISIBLE_LINK = 'invisible-link',\n /* Button-styled link with solid background /\n BUTTON = 'button',\n /* Button-styled link with outlined border /\n BUTTON_OUTLINED = 'button-outlined',\n /* Link with subtle hover background effect /\n HOVERABLE = 'hoverable',\n}\n\n/\n Color theme variants for Link component\n \n @enum {string}\n /\nexport enum LinkColor {\n /* Primary brand color /\n PRIMARY = 'primary',\n /* Secondary brand color /\n SECONDARY = 'secondary',\n /* Destructive/danger color for critical actions /\n DESTRUCTIVE = 'destructive',\n /* Neutral/muted color for less prominent links /\n NEUTRAL = 'neutral',\n /* Light color for dark backgrounds /\n LIGHT = 'light',\n /* Dark color for light backgrounds /\n DARK = 'dark',\n /* Default text color /\n TEXT = 'text',\n /* Inverse text color for opposite backgrounds /\n TEXT_INVERSE = 'text-inverse',\n /* Error/red color for error states /\n ERROR = 'error',\n /* Success/green color for positive actions /\n SUCCESS = 'success',\n /* Custom color - no default styling applied /\n CUSTOM = 'custom',\n}\n\n/* Available rounded corner sizes for the container /\nexport enum LinkRoundedSize {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n TWO_XL = '2xl',\n THREE_XL = '3xl',\n FULL = 'full',\n}\n\nexport enum LinkSize {\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n CUSTOM = 'custom',\n}\n\n/\n Underline style options for Link component\n \n @enum {string}\n /\nexport enum LinkUnderlined {\n /* Default underline behavior based on variant /\n DEFAULT = 'default',\n /* Always show underline /\n TRUE = 'true',\n /* Never show underline /\n FALSE = 'false',\n}\n\n/\n Class variance authority configuration for Link component styling\n * Defines the visual appearance based on variant, color, and underline options\n /\nexport const linkVariants = cva(\n 'gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n {\n variants: {\n variant: {\n [`${LinkVariant.DEFAULT}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-4 hover:bg-current/0 hover:underline',\n [`${LinkVariant.INVISIBLE_LINK}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-4 hover:bg-current/0',\n\n [`${LinkVariant.BUTTON}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 :text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.BUTTON_OUTLINED}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 :text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.HOVERABLE}`]:\n 'block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5',\n },\n roundedSize: {\n [`${LinkRoundedSize.NONE}`]: 'rounded-none',\n [`${LinkRoundedSize.SM}`]:\n 'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n [`${LinkRoundedSize.MD}`]:\n 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n [`${LinkRoundedSize.LG}`]:\n 'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n [`${LinkRoundedSize.XL}`]:\n 'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n [`${LinkRoundedSize.TWO_XL}`]:\n 'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n [`${LinkRoundedSize.THREE_XL}`]:\n 'rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]',\n [`${LinkRoundedSize.FULL}`]: 'rounded-full',\n },\n color: {\n [`${LinkColor.PRIMARY}`]: 'text-primary',\n [`${LinkColor.SECONDARY}`]: 'text-secondary',\n [`${LinkColor.DESTRUCTIVE}`]: 'text-destructive',\n [`${LinkColor.NEUTRAL}`]: 'text-neutral',\n [`${LinkColor.LIGHT}`]: 'text-white',\n [`${LinkColor.DARK}`]: 'text-neutral-800',\n [`${LinkColor.TEXT}`]: 'text-text',\n [`${LinkColor.TEXT_INVERSE}`]: 'text-text-opposite',\n [`${LinkColor.ERROR}`]: 'text-error',\n [`${LinkColor.SUCCESS}`]: 'text-success',\n [`${LinkColor.CUSTOM}`]: '',\n },\n size: {\n [`${LinkSize.SM}`]: 'text-sm',\n [`${LinkSize.MD}`]: 'text-base',\n [`${LinkSize.LG}`]: 'text-lg',\n [`${LinkSize.XL}`]: 'text-xl',\n [`${LinkSize.CUSTOM}`]: '',\n },\n underlined: {\n [LinkUnderlined.DEFAULT]: '',\n [LinkUnderlined.TRUE]: 'underline',\n [LinkUnderlined.FALSE]: 'no-underline',\n },\n },\n // Compound variants handle height and padding\n compoundVariants: [\n // Min height and padding for button variants\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.SM,\n class: 'min-h-7 px-3 max-md:py-1',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.MD,\n class: 'min-h-8 px-6 max-md:py-2',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.LG,\n class: 'min-h-10 px-8 max-md:py-3',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.XL,\n class: 'min-h-11 px-10 max-md:py-4',\n },\n // Ring color variants for button (Chrome bug fix: ring-current/20 doesn't work properly)\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.PRIMARY,\n class: 'ring-primary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SECONDARY,\n class: 'ring-secondary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DESTRUCTIVE,\n class: 'ring-destructive/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.NEUTRAL,\n class: 'ring-neutral/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.LIGHT,\n class: 'ring-white/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DARK,\n class: 'ring-neutral-800/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT,\n class: 'ring-text/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT_INVERSE,\n class: 'ring-text-opposite/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.ERROR,\n class: 'ring-error/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SUCCESS,\n class: 'ring-success/20',\n },\n ],\n\n defaultVariants: {\n variant: LinkVariant.DEFAULT,\n color: LinkColor.PRIMARY,\n roundedSize: LinkRoundedSize.MD,\n underlined: LinkUnderlined.DEFAULT,\n size: LinkSize.MD,\n },\n }\n);\n\n/\n Props interface for the Link component\n \n @interface LinkProps\n * @extends {DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>}\n * @extends {VariantProps<typeof linkVariants>}\n /\nexport type LinkProps = DetailedHTMLProps<\n AnchorHTMLAttributes<HTMLAnchorElement>,\n HTMLAnchorElement\n> &\n VariantProps<typeof linkVariants> & {\n /\n Accessible label for screen readers (required)\n * Provides context about what the link does or where it leads\n * @example \"Navigate to home page\"\n /\n label: string;\n\n /\n Whether this link opens in a new tab/window\n * When true, adds target=\"_blank\" and security attributes\n * Auto-detected for URLs starting with http/https when undefined\n * @default undefined (auto-detect based on href)\n /\n isExternalLink?: boolean;\n\n /\n If a link is a page section as '#id'\n * @default false\n /\n isPageSection?: boolean;\n\n /\n Whether this link represents the current page/active state\n * Adds aria-current=\"page\" for accessibility\n * @default false\n /\n isActive?: boolean;\n\n /\n Locale for internationalized URLs\n * When provided, URLs are automatically localized using Intlayer\n * @example 'fr', 'es', 'en'\n /\n locale?: LocalesValues;\n };\n\n/\n Utility function to determine if a link should be treated as external\n \n @param props - Link component props containing href and isExternalLink\n * @returns {boolean} True if the link should open externally\n \n @example\n * ```tsx\n * checkIsExternalLink({ href: '[https://example.com](https://example.com)' }) // true\n * checkIsExternalLink({ href: '/internal-page' }) // false\n * checkIsExternalLink({ href: '/page', isExternalLink: true }) // true\n * ```\n /\nexport const checkIsExternalLink = ({\n href,\n isExternalLink: isExternalLinkProp,\n}: LinkProps): boolean => {\n const isValidHref = typeof href === 'string' && href.trim() !== '';\n const isExternalLink =\n isExternalLinkProp === true \|\|\n (typeof isExternalLinkProp === 'undefined' &&\n isValidHref &&\n /^https?:\\/\\//.test(href));\n\n return isExternalLink;\n};\n\nexport const isTextChildren = (children: ReactNode): boolean => {\n // Direct string or number\n if (typeof children === 'string' \|\| typeof children === 'number') {\n return true;\n }\n\n // Array (e.g., {'A'} {'B'}) - check if every item is text\n if (Array.isArray(children)) {\n return children.every(isTextChildren);\n }\n\n // Fragment - check its children recursively\n if (isValidElement(children)) {\n return isTextChildren(\n (children.props as { children?: ReactNode }).children\n );\n }\n\n return false;\n};\n\n/\n Link Component\n \n A versatile link component that handles both internal and external navigation\n * with comprehensive internationalization support and multiple visual variants.\n * ...\n */\nexport const Link: FC<LinkProps> = (props) => {\n const {\n variant = LinkVariant.DEFAULT,\n color = LinkColor.PRIMARY,\n roundedSize,\n children,\n label,\n className,\n isActive,\n underlined,\n locale,\n size,\n isExternalLink: isExternalLinkProp,\n isPageSection: isPageSectionProp,\n href: hrefProp,\n ...otherProps\n } = props;\n\n const isExternalLink = isExternalLinkProp ?? checkIsExternalLink(props);\n const isPageSection = isPageSectionProp ?? hrefProp?.startsWith('#') ?? false;\n\n const isChildrenString = isTextChildren(children);\n const isButton =\n variant === LinkVariant.BUTTON \|\| variant === LinkVariant.BUTTON_OUTLINED;\n\n const rel = isExternalLink ? 'noopener noreferrer nofollow' : undefined;\n\n const target = isExternalLink ? '_blank' : '_self';\n\n const href =\n locale && hrefProp && !isExternalLink && !isPageSection\n ? getLocalizedUrl(hrefProp, locale)\n : hrefProp;\n\n return (\n <a\n href={href}\n aria-label={label}\n rel={rel}\n target={target}\n aria-current={isActive ? 'page' : undefined}\n className={cn(\n linkVariants({\n variant,\n color,\n roundedSize,\n underlined,\n size,\n className,\n })\n )}\n {...otherProps}\n >\n {isButton && isChildrenString ? <span>{children}</span> : children}\n\n {isExternalLink && isChildrenString && (\n <ExternalLink className=\"ml-2 inline-block size-4\" />\n )}\n {isPageSection && <MoveRight className=\"ml-2 inline-block size-4\" />}\n </a>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"Link.mjs","names":["Link: FC<LinkProps>"],"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { getLocalizedUrl } from '@intlayer/core';\nimport type { LocalesValues } from '@intlayer/types';\nimport { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink, MoveRight } from 'lucide-react';\nimport {\n type AnchorHTMLAttributes,\n type DetailedHTMLProps,\n type FC,\n isValidElement,\n type ReactNode,\n} from 'react';\n\n/*\n Visual style variants for Link component\n /\nexport enum LinkVariant {\n DEFAULT = 'default',\n INVISIBLE_LINK = 'invisible-link',\n BUTTON = 'button',\n BUTTON_OUTLINED = 'button-outlined',\n HOVERABLE = 'hoverable',\n}\n\n/\n Color theme variants for Link component\n /\nexport enum LinkColor {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n DESTRUCTIVE = 'destructive',\n NEUTRAL = 'neutral',\n LIGHT = 'light',\n DARK = 'dark',\n TEXT = 'text',\n TEXT_INVERSE = 'text-inverse',\n ERROR = 'error',\n SUCCESS = 'success',\n CUSTOM = 'custom',\n}\n\nexport enum LinkRoundedSize {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n TWO_XL = '2xl',\n THREE_XL = '3xl',\n FULL = 'full',\n}\n\nexport enum LinkSize {\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n CUSTOM = 'custom',\n}\n\nexport enum LinkUnderlined {\n DEFAULT = 'default',\n TRUE = 'true',\n FALSE = 'false',\n}\n\nexport const linkVariants = cva(\n 'gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n {\n variants: {\n variant: {\n [`${LinkVariant.DEFAULT}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-4 hover:bg-current/0 hover:underline',\n [`${LinkVariant.INVISIBLE_LINK}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-4 hover:bg-current/0',\n\n [`${LinkVariant.BUTTON}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 :text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.BUTTON_OUTLINED}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 :text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.HOVERABLE}`]:\n 'block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5',\n },\n roundedSize: {\n [`${LinkRoundedSize.NONE}`]: 'rounded-none',\n [`${LinkRoundedSize.SM}`]:\n 'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n [`${LinkRoundedSize.MD}`]:\n 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n [`${LinkRoundedSize.LG}`]:\n 'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n [`${LinkRoundedSize.XL}`]:\n 'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n [`${LinkRoundedSize.TWO_XL}`]:\n 'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n [`${LinkRoundedSize.THREE_XL}`]:\n 'rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]',\n [`${LinkRoundedSize.FULL}`]: 'rounded-full',\n },\n color: {\n [`${LinkColor.PRIMARY}`]: 'text-primary',\n [`${LinkColor.SECONDARY}`]: 'text-secondary',\n [`${LinkColor.DESTRUCTIVE}`]: 'text-destructive',\n [`${LinkColor.NEUTRAL}`]: 'text-neutral',\n [`${LinkColor.LIGHT}`]: 'text-white',\n [`${LinkColor.DARK}`]: 'text-neutral-800',\n [`${LinkColor.TEXT}`]: 'text-text',\n [`${LinkColor.TEXT_INVERSE}`]: 'text-text-opposite',\n [`${LinkColor.ERROR}`]: 'text-error',\n [`${LinkColor.SUCCESS}`]: 'text-success',\n [`${LinkColor.CUSTOM}`]: '',\n },\n size: {\n [`${LinkSize.SM}`]: 'text-sm',\n [`${LinkSize.MD}`]: 'text-base',\n [`${LinkSize.LG}`]: 'text-lg',\n [`${LinkSize.XL}`]: 'text-xl',\n [`${LinkSize.CUSTOM}`]: '',\n },\n underlined: {\n [LinkUnderlined.DEFAULT]: '',\n [LinkUnderlined.TRUE]: 'underline',\n [LinkUnderlined.FALSE]: 'no-underline',\n },\n },\n // Compound variants handle height and padding\n compoundVariants: [\n // ---------------------------------------------------------\n // FIX START: Correctly Handle Contrast for TEXT_INVERSE\n // ---------------------------------------------------------\n {\n // Filled Button + Inverse Color (e.g., White Button):\n // 1. We DO NOT override parent text color (it must remain 'text-opposite' so bg-current is white).\n // 2. We ONLY override children to be 'text-text' (Dark) so they show up on white.\n variant: LinkVariant.BUTTON,\n color: LinkColor.TEXT_INVERSE,\n class: ':text-text',\n },\n {\n // Outlined Button + Inverse Color (e.g., White Border):\n // 1. Parent is 'text-opposite' (Border is white).\n // 2. Children must also be 'text-opposite' (White text) to show on dark background.\n variant: LinkVariant.BUTTON_OUTLINED,\n color: LinkColor.TEXT_INVERSE,\n class: 'text-text-opposite *:text-text-opposite',\n },\n // ---------------------------------------------------------\n // FIX END\n // ---------------------------------------------------------\n\n // Min height and padding for button variants\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.SM,\n class: 'min-h-7 px-3 max-md:py-1',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.MD,\n class: 'min-h-8 px-6 max-md:py-2',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.LG,\n class: 'min-h-10 px-8 max-md:py-3',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.XL,\n class: 'min-h-11 px-10 max-md:py-4',\n },\n // Ring color variants\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.PRIMARY,\n class: 'ring-primary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SECONDARY,\n class: 'ring-secondary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DESTRUCTIVE,\n class: 'ring-destructive/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.NEUTRAL,\n class: 'ring-neutral/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.LIGHT,\n class: 'ring-white/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DARK,\n class: 'ring-neutral-800/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT,\n class: 'ring-text/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT_INVERSE,\n class: 'ring-text-opposite/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.ERROR,\n class: 'ring-error/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SUCCESS,\n class: 'ring-success/20',\n },\n ],\n\n defaultVariants: {\n variant: LinkVariant.DEFAULT,\n color: LinkColor.PRIMARY,\n roundedSize: LinkRoundedSize.MD,\n underlined: LinkUnderlined.DEFAULT,\n size: LinkSize.MD,\n },\n }\n);\n\nexport type LinkProps = DetailedHTMLProps<\n AnchorHTMLAttributes<HTMLAnchorElement>,\n HTMLAnchorElement\n> &\n VariantProps<typeof linkVariants> & {\n label: string;\n isExternalLink?: boolean;\n isPageSection?: boolean;\n isActive?: boolean;\n locale?: LocalesValues;\n };\n\nexport const checkIsExternalLink = ({\n href,\n isExternalLink: isExternalLinkProp,\n}: LinkProps): boolean => {\n const isValidHref = typeof href === 'string' && href.trim() !== '';\n const isExternalLink =\n isExternalLinkProp === true \|\|\n (typeof isExternalLinkProp === 'undefined' &&\n isValidHref &&\n /^https?:\\/\\//.test(href));\n\n return isExternalLink;\n};\n\nexport const isTextChildren = (children: ReactNode): boolean => {\n if (typeof children === 'string' \|\| typeof children === 'number') {\n return true;\n }\n if (Array.isArray(children)) {\n return children.every(isTextChildren);\n }\n if (isValidElement(children)) {\n return isTextChildren(\n (children.props as { children?: ReactNode }).children\n );\n }\n return false;\n};\n\nexport const Link: FC<LinkProps> = (props) => {\n const {\n variant = LinkVariant.DEFAULT,\n color = LinkColor.PRIMARY,\n roundedSize,\n children,\n label,\n className,\n isActive,\n underlined,\n locale,\n size,\n isExternalLink: isExternalLinkProp,\n isPageSection: isPageSectionProp,\n href: hrefProp,\n ...otherProps\n } = props;\n\n const isExternalLink = isExternalLinkProp ?? checkIsExternalLink(props);\n const isPageSection = isPageSectionProp ?? hrefProp?.startsWith('#') ?? false;\n\n const isChildrenString = isTextChildren(children);\n const isButton =\n variant === LinkVariant.BUTTON \|\| variant === LinkVariant.BUTTON_OUTLINED;\n\n const rel = isExternalLink ? 'noopener noreferrer nofollow' : undefined;\n\n const target = isExternalLink ? '_blank' : '_self';\n\n const href =\n locale && hrefProp && !isExternalLink && !isPageSection\n ? getLocalizedUrl(hrefProp, locale)\n : hrefProp;\n\n return (\n <a\n href={href}\n aria-label={label}\n rel={rel}\n target={target}\n aria-current={isActive ? 'page' : undefined}\n className={cn(\n linkVariants({\n variant,\n color,\n roundedSize,\n underlined,\n size,\n className,\n })\n )}\n {...otherProps}\n >\n {isButton && isChildrenString ? <span>{children}</span> : children}\n\n {isExternalLink && isChildrenString && (\n <ExternalLink className=\"ml-2 inline-block size-4\" />\n )}\n {isPageSection && <MoveRight className=\"ml-2 inline-block size-4\" />}\n </a>\n );\n};\n"],"mappings":"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"}

package/dist/esm/components/Loader/index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.mjs","names":["Loader: FC<LoaderProps>"],"sources":["../../../../src/components/Loader/index.tsx"],"sourcesContent":["import ~~type~~ { ~~FC,~~ ~~HTMLAttributes~~ } from '~~react~~';\nimport { cn } from '~~../../utils/cn~~';\nimport { Spinner } from './spinner';\n\n/*\n Props for the Loader component\n /\nexport type LoaderProps = HTMLAttributes<HTMLDivElement> & {\n /* Controls whether the loading spinner is displayed. Defaults to true when undefined /\n isLoading?: boolean;\n /* Controls whether the children are kept when loading is false. Defaults to false /\n keepChildren?: boolean;\n};\n\n/\n Loader Component\n \n A versatile loading component that can function as both a standalone loader\n * and a wrapper for content. When loading is true, displays an animated spinner.\n * When loading is false, renders the wrapped content.\n \n @component\n * @example\n * Standalone usage:\n * ```tsx\n * <Loader isLoading={true} />\n * ```\n \n @example\n * As a content wrapper:\n * ```tsx\n * <Loader isLoading={isDataLoading}>\n * <div>Your content here</div>\n * </Loader>\n * ```\n \n @example\n * Default behavior (loading = true):\n * ```tsx\n * <Loader />\n * ```\n \n @example\n * With custom styling:\n * ```tsx\n * <Loader\n * isLoading={true}\n * className=\"min-h-[200px] bg-gray-50\"\n * aria-label=\"Loading user data\"\n * />\n * ```\n \n @example\n * Conditional content loading:\n * ```tsx\n * <Loader isLoading={!data}>\n * {data && (\n * <div>\n * <h2>{data.title}</h2>\n * <p>{data.content}</p>\n * </div>\n * )}\n * </Loader>\n * ```\n \n Features:\n * - Dual-mode operation: standalone spinner or content wrapper\n * - Responsive design with flexible sizing\n * - Accessible with proper ARIA attributes and role\n * - Smooth animated spinner using SVG\n * - Customizable styling through className prop\n * - Supports all standard HTML div attributes\n * - Screen constraints (max-height/width) to prevent overflow\n * - Internationalization ready with aria-label support\n \n Accessibility:\n * - Uses role=\"status\" for screen reader announcements\n * - Includes descriptive aria-label for the loading state\n * - Maintains focus management when transitioning between states\n * - Supports custom aria-label through props for specific contexts\n * - Compatible with keyboard navigation patterns\n \n Performance:\n * - Lightweight SVG spinner with CSS animations\n * - Conditional rendering prevents unnecessary DOM updates\n * - Optimized for frequent loading state changes\n * - No external dependencies beyond internal utilities\n \n @param props - Component props extending HTML div attributes\n * @param props.children - Content to display when not loading\n * @param props.isLoading - Loading state control (defaults to true)\n * @param props.className - Additional CSS classes for the loader container\n * @param props.role - ARIA role (defaults to \"status\")\n * @param props.aria-label - Custom accessibility label\n * @param props.id - Unique identifier for the loader\n * @param props.style - Inline styles object\n * @param props.data-* - Data attributes for testing or tracking\n * @param props...rest - All other standard HTML div attributes\n \n @returns A loading spinner when isLoading is true, otherwise renders children\n */\nexport const Loader: FC<LoaderProps> = ({\n children,\n isLoading = true,\n keepChildren = false,\n className,\n ...props\n}) => (\n <>\n {isLoading && keepChildren ? (\n <div className=\"relative size-full\">\n <div\n className={cn(\n 'absolute top-0 left-0 flex size-full max-h-screen max-w-[100vw] flex-1 items-center justify-center',\n className\n )}\n role=\"status\"\n aria-label=\"Animated icon, meaning that the website is processing\"\n {...props}\n >\n <Spinner className=\"size-10 max-h-full max-w-full\" />\n </div>\n {children}\n </div>\n ) : isLoading ? (\n <div\n className={cn(\n 'flex size-full max-h-screen max-w-[100vw] flex-1 items-center justify-center',\n className\n )}\n role=\"status\"\n aria-label=\"Animated icon, meaning that the website is processing\"\n {...props}\n >\n <Spinner className=\"size-10 max-h-full max-w-full\" />\n </div>\n ) : (\n (children ?? <></>)\n )}\n </>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqGA,MAAaA,UAA2B,EACtC,UACA,YAAY,MACZ,eAAe,OACf,WACA,GAAG,YAEH,0CACG,aAAa,eACZ,qBAAC;CAAI,WAAU;YACb,oBAAC;EACC,WAAW,GACT,sGACA,UACD;EACD,MAAK;EACL,cAAW;EACX,GAAI;YAEJ,oBAAC,WAAQ,WAAU,kCAAkC;GACjD,EACL;EACG,GACJ,YACF,oBAAC;CACC,WAAW,GACT,gFACA,UACD;CACD,MAAK;CACL,cAAW;CACX,GAAI;WAEJ,oBAAC,WAAQ,WAAU,kCAAkC;EACjD,GAEL,YAAY,iCAAK,GAEnB"}
1	+ {"version":3,"file":"index.mjs","names":["Loader: FC<LoaderProps>"],"sources":["../../../../src/components/Loader/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport type { FC, HTMLAttributes } from 'react';\nimport { Spinner } from './spinner';\n\n/*\n Props for the Loader component\n /\nexport type LoaderProps = HTMLAttributes<HTMLDivElement> & {\n /* Controls whether the loading spinner is displayed. Defaults to true when undefined /\n isLoading?: boolean;\n /* Controls whether the children are kept when loading is false. Defaults to false /\n keepChildren?: boolean;\n};\n\n/\n Loader Component\n \n A versatile loading component that can function as both a standalone loader\n * and a wrapper for content. When loading is true, displays an animated spinner.\n * When loading is false, renders the wrapped content.\n \n @component\n * @example\n * Standalone usage:\n * ```tsx\n * <Loader isLoading={true} />\n * ```\n \n @example\n * As a content wrapper:\n * ```tsx\n * <Loader isLoading={isDataLoading}>\n * <div>Your content here</div>\n * </Loader>\n * ```\n \n @example\n * Default behavior (loading = true):\n * ```tsx\n * <Loader />\n * ```\n \n @example\n * With custom styling:\n * ```tsx\n * <Loader\n * isLoading={true}\n * className=\"min-h-[200px] bg-gray-50\"\n * aria-label=\"Loading user data\"\n * />\n * ```\n \n @example\n * Conditional content loading:\n * ```tsx\n * <Loader isLoading={!data}>\n * {data && (\n * <div>\n * <h2>{data.title}</h2>\n * <p>{data.content}</p>\n * </div>\n * )}\n * </Loader>\n * ```\n \n Features:\n * - Dual-mode operation: standalone spinner or content wrapper\n * - Responsive design with flexible sizing\n * - Accessible with proper ARIA attributes and role\n * - Smooth animated spinner using SVG\n * - Customizable styling through className prop\n * - Supports all standard HTML div attributes\n * - Screen constraints (max-height/width) to prevent overflow\n * - Internationalization ready with aria-label support\n \n Accessibility:\n * - Uses role=\"status\" for screen reader announcements\n * - Includes descriptive aria-label for the loading state\n * - Maintains focus management when transitioning between states\n * - Supports custom aria-label through props for specific contexts\n * - Compatible with keyboard navigation patterns\n \n Performance:\n * - Lightweight SVG spinner with CSS animations\n * - Conditional rendering prevents unnecessary DOM updates\n * - Optimized for frequent loading state changes\n * - No external dependencies beyond internal utilities\n \n @param props - Component props extending HTML div attributes\n * @param props.children - Content to display when not loading\n * @param props.isLoading - Loading state control (defaults to true)\n * @param props.className - Additional CSS classes for the loader container\n * @param props.role - ARIA role (defaults to \"status\")\n * @param props.aria-label - Custom accessibility label\n * @param props.id - Unique identifier for the loader\n * @param props.style - Inline styles object\n * @param props.data-* - Data attributes for testing or tracking\n * @param props...rest - All other standard HTML div attributes\n \n @returns A loading spinner when isLoading is true, otherwise renders children\n */\nexport const Loader: FC<LoaderProps> = ({\n children,\n isLoading = true,\n keepChildren = false,\n className,\n ...props\n}) => (\n <>\n {isLoading && keepChildren ? (\n <div className=\"relative size-full\">\n <div\n className={cn(\n 'absolute top-0 left-0 flex size-full max-h-screen max-w-[100vw] flex-1 items-center justify-center',\n className\n )}\n role=\"status\"\n aria-label=\"Animated icon, meaning that the website is processing\"\n {...props}\n >\n <Spinner className=\"size-10 max-h-full max-w-full\" />\n </div>\n {children}\n </div>\n ) : isLoading ? (\n <div\n className={cn(\n 'flex size-full max-h-screen max-w-[100vw] flex-1 items-center justify-center',\n className\n )}\n role=\"status\"\n aria-label=\"Animated icon, meaning that the website is processing\"\n {...props}\n >\n <Spinner className=\"size-10 max-h-full max-w-full\" />\n </div>\n ) : (\n (children ?? <></>)\n )}\n </>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqGA,MAAaA,UAA2B,EACtC,UACA,YAAY,MACZ,eAAe,OACf,WACA,GAAG,YAEH,0CACG,aAAa,eACZ,qBAAC;CAAI,WAAU;YACb,oBAAC;EACC,WAAW,GACT,sGACA,UACD;EACD,MAAK;EACL,cAAW;EACX,GAAI;YAEJ,oBAAC,WAAQ,WAAU,kCAAkC;GACjD,EACL;EACG,GACJ,YACF,oBAAC;CACC,WAAW,GACT,gFACA,UACD;CACD,MAAK;CACL,cAAW;CACX,GAAI;WAEJ,oBAAC,WAAQ,WAAU,kCAAkC;EACjD,GAEL,YAAY,iCAAK,GAEnB"}

package/dist/esm/components/Loader/spinner.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spinner.mjs","names":[],"sources":["../../../../src/components/Loader/spinner.tsx"],"sourcesContent":["import ~~type~~ { ~~SVGProps~~ } from '~~react~~';\nimport { cn } from '~~../../utils/cn~~';\n\n/*\n Props for the Spinner component\n /\ntype SpinnerProps = SVGProps<SVGSVGElement> & {\n /* Stroke width for the spinner animation circles. Defaults to 4 /\n strokeWidth?: number;\n};\n\n/\n Spinner Component\n \n An animated SVG spinner that displays two expanding and fading circles\n * to indicate loading or processing states. Uses smooth CSS animations\n * with spline curves for natural motion.\n \n @component\n * @example\n * Basic usage:\n * ```tsx\n * <Spinner />\n * ```\n \n @example\n * Custom stroke width:\n * ```tsx\n * <Spinner strokeWidth={6} className=\"text-blue-500\" />\n * ```\n \n @example\n * Custom size:\n * ```tsx\n * <Spinner className=\"size-8 text-red-500\" strokeWidth={2} />\n * ```\n \n Features:\n * - Smooth expanding circle animation\n * - Customizable stroke width\n * - Inherits text color from parent (currentColor)\n * - Responsive sizing through className\n * - Infinite loop animation\n * - Two-phase animation with offset timing\n * - Optimized SVG with minimal DOM impact\n \n Animation Details:\n * - Duration: 1.8 seconds per cycle\n * - Two circles with 0.9s offset\n * - Radius expands from 1 to 20\n * - Opacity fades from 1 to 0\n * - Spline easing for natural motion\n \n @param props - SVG props with custom spinner options\n * @param props.className - CSS classes for styling and sizing\n * @param props.strokeWidth - Line thickness for the animated circles\n * @param props.color - SVG color (use className with text-color for easier styling)\n * @param props.width - SVG width (defaults to 44, use className for responsive sizing)\n * @param props.height - SVG height (defaults to 44, use className for responsive sizing)\n * @param props...rest - All other standard SVG element attributes\n \n @returns An animated SVG spinner element\n */\nexport const Spinner = ({ className, strokeWidth = 4 }: SpinnerProps) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"44\"\n height=\"44\"\n viewBox=\"0 0 44 44\"\n stroke=\"currentColor\"\n role=\"img\"\n aria-label=\"Spinner\"\n className={cn('size-full', className)}\n >\n <g fill=\"none\" fillRule=\"evenodd\" strokeWidth={strokeWidth}>\n <circle cx=\"22\" cy=\"22\" r=\"1\">\n <animate\n attributeName=\"r\"\n begin=\"0s\"\n dur=\"1.8s\"\n values=\"1; 20\"\n calcMode=\"spline\"\n keyTimes=\"0; 1\"\n keySplines=\"0.165, 0.84, 0.44, 1\"\n repeatCount=\"indefinite\"\n />\n <animate\n attributeName=\"stroke-opacity\"\n begin=\"0s\"\n dur=\"1.8s\"\n values=\"1; 0\"\n calcMode=\"spline\"\n keyTimes=\"0; 1\"\n keySplines=\"0.3, 0.61, 0.355, 1\"\n repeatCount=\"indefinite\"\n />\n </circle>\n <circle cx=\"22\" cy=\"22\" r=\"1\">\n <animate\n attributeName=\"r\"\n begin=\"-0.9s\"\n dur=\"1.8s\"\n values=\"1; 20\"\n calcMode=\"spline\"\n keyTimes=\"0; 1\"\n keySplines=\"0.165, 0.84, 0.44, 1\"\n repeatCount=\"indefinite\"\n />\n <animate\n attributeName=\"stroke-opacity\"\n begin=\"-0.9s\"\n dur=\"1.8s\"\n values=\"1; 0\"\n calcMode=\"spline\"\n keyTimes=\"0; 1\"\n keySplines=\"0.3, 0.61, 0.355, 1\"\n repeatCount=\"indefinite\"\n />\n </circle>\n </g>\n </svg>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DA,MAAa,WAAW,EAAE,WAAW,cAAc,QACjD,oBAAC;CACC,OAAM;CACN,OAAM;CACN,QAAO;CACP,SAAQ;CACR,QAAO;CACP,MAAK;CACL,cAAW;CACX,WAAW,GAAG,aAAa,UAAU;WAErC,qBAAC;EAAE,MAAK;EAAO,UAAS;EAAuB;aAC7C,qBAAC;GAAO,IAAG;GAAK,IAAG;GAAK,GAAE;cACxB,oBAAC;IACC,eAAc;IACd,OAAM;IACN,KAAI;IACJ,QAAO;IACP,UAAS;IACT,UAAS;IACT,YAAW;IACX,aAAY;KACZ,EACF,oBAAC;IACC,eAAc;IACd,OAAM;IACN,KAAI;IACJ,QAAO;IACP,UAAS;IACT,UAAS;IACT,YAAW;IACX,aAAY;KACZ;IACK,EACT,qBAAC;GAAO,IAAG;GAAK,IAAG;GAAK,GAAE;cACxB,oBAAC;IACC,eAAc;IACd,OAAM;IACN,KAAI;IACJ,QAAO;IACP,UAAS;IACT,UAAS;IACT,YAAW;IACX,aAAY;KACZ,EACF,oBAAC;IACC,eAAc;IACd,OAAM;IACN,KAAI;IACJ,QAAO;IACP,UAAS;IACT,UAAS;IACT,YAAW;IACX,aAAY;KACZ;IACK;GACP;EACA"}
1	+ {"version":3,"file":"spinner.mjs","names":[],"sources":["../../../../src/components/Loader/spinner.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport type { SVGProps } from 'react';\n\n/*\n Props for the Spinner component\n /\ntype SpinnerProps = SVGProps<SVGSVGElement> & {\n /* Stroke width for the spinner animation circles. Defaults to 4 /\n strokeWidth?: number;\n};\n\n/\n Spinner Component\n \n An animated SVG spinner that displays two expanding and fading circles\n * to indicate loading or processing states. Uses smooth CSS animations\n * with spline curves for natural motion.\n \n @component\n * @example\n * Basic usage:\n * ```tsx\n * <Spinner />\n * ```\n \n @example\n * Custom stroke width:\n * ```tsx\n * <Spinner strokeWidth={6} className=\"text-blue-500\" />\n * ```\n \n @example\n * Custom size:\n * ```tsx\n * <Spinner className=\"size-8 text-red-500\" strokeWidth={2} />\n * ```\n \n Features:\n * - Smooth expanding circle animation\n * - Customizable stroke width\n * - Inherits text color from parent (currentColor)\n * - Responsive sizing through className\n * - Infinite loop animation\n * - Two-phase animation with offset timing\n * - Optimized SVG with minimal DOM impact\n \n Animation Details:\n * - Duration: 1.8 seconds per cycle\n * - Two circles with 0.9s offset\n * - Radius expands from 1 to 20\n * - Opacity fades from 1 to 0\n * - Spline easing for natural motion\n \n @param props - SVG props with custom spinner options\n * @param props.className - CSS classes for styling and sizing\n * @param props.strokeWidth - Line thickness for the animated circles\n * @param props.color - SVG color (use className with text-color for easier styling)\n * @param props.width - SVG width (defaults to 44, use className for responsive sizing)\n * @param props.height - SVG height (defaults to 44, use className for responsive sizing)\n * @param props...rest - All other standard SVG element attributes\n \n @returns An animated SVG spinner element\n */\nexport const Spinner = ({ className, strokeWidth = 4 }: SpinnerProps) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"44\"\n height=\"44\"\n viewBox=\"0 0 44 44\"\n stroke=\"currentColor\"\n role=\"img\"\n aria-label=\"Spinner\"\n className={cn('size-full', className)}\n >\n <g fill=\"none\" fillRule=\"evenodd\" strokeWidth={strokeWidth}>\n <circle cx=\"22\" cy=\"22\" r=\"1\">\n <animate\n attributeName=\"r\"\n begin=\"0s\"\n dur=\"1.8s\"\n values=\"1; 20\"\n calcMode=\"spline\"\n keyTimes=\"0; 1\"\n keySplines=\"0.165, 0.84, 0.44, 1\"\n repeatCount=\"indefinite\"\n />\n <animate\n attributeName=\"stroke-opacity\"\n begin=\"0s\"\n dur=\"1.8s\"\n values=\"1; 0\"\n calcMode=\"spline\"\n keyTimes=\"0; 1\"\n keySplines=\"0.3, 0.61, 0.355, 1\"\n repeatCount=\"indefinite\"\n />\n </circle>\n <circle cx=\"22\" cy=\"22\" r=\"1\">\n <animate\n attributeName=\"r\"\n begin=\"-0.9s\"\n dur=\"1.8s\"\n values=\"1; 20\"\n calcMode=\"spline\"\n keyTimes=\"0; 1\"\n keySplines=\"0.165, 0.84, 0.44, 1\"\n repeatCount=\"indefinite\"\n />\n <animate\n attributeName=\"stroke-opacity\"\n begin=\"-0.9s\"\n dur=\"1.8s\"\n values=\"1; 0\"\n calcMode=\"spline\"\n keyTimes=\"0; 1\"\n keySplines=\"0.3, 0.61, 0.355, 1\"\n repeatCount=\"indefinite\"\n />\n </circle>\n </g>\n </svg>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DA,MAAa,WAAW,EAAE,WAAW,cAAc,QACjD,oBAAC;CACC,OAAM;CACN,OAAM;CACN,QAAO;CACP,SAAQ;CACR,QAAO;CACP,MAAK;CACL,cAAW;CACX,WAAW,GAAG,aAAa,UAAU;WAErC,qBAAC;EAAE,MAAK;EAAO,UAAS;EAAuB;aAC7C,qBAAC;GAAO,IAAG;GAAK,IAAG;GAAK,GAAE;cACxB,oBAAC;IACC,eAAc;IACd,OAAM;IACN,KAAI;IACJ,QAAO;IACP,UAAS;IACT,UAAS;IACT,YAAW;IACX,aAAY;KACZ,EACF,oBAAC;IACC,eAAc;IACd,OAAM;IACN,KAAI;IACJ,QAAO;IACP,UAAS;IACT,UAAS;IACT,YAAW;IACX,aAAY;KACZ;IACK,EACT,qBAAC;GAAO,IAAG;GAAK,IAAG;GAAK,GAAE;cACxB,oBAAC;IACC,eAAc;IACd,OAAM;IACN,KAAI;IACJ,QAAO;IACP,UAAS;IACT,UAAS;IACT,YAAW;IACX,aAAY;KACZ,EACF,oBAAC;IACC,eAAc;IACd,OAAM;IACN,KAAI;IACJ,QAAO;IACP,UAAS;IACT,UAAS;IACT,YAAW;IACX,aAAY;KACZ;IACK;GACP;EACA"}

package/dist/esm/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LocaleSwitcherContent.mjs","names":["LocaleSwitcherContent: FC<LocaleSwitcherContentProps>","multilingualAvailableLocales: MultilingualAvailableLocales[]"],"sources":["../../../../src/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.tsx"],"sourcesContent":["'use client';\n\nimport { getHTMLTextDir, getLocaleName } from '@intlayer/core';\nimport { Locales, type LocalesValues } from '@intlayer/types';\nimport Fuse, { type IFuseOptions } from 'fuse.js';\nimport { Check, Globe, MoveVertical } from 'lucide-react';\nimport { type FC, useMemo, useRef, useState } from 'react';\nimport { useIntlayer, useLocale } from 'react-intlayer';\nimport { usePersistedStore } from '../../hooks';\nimport {\n Button,\n ButtonColor,\n ButtonSize,\n ButtonTextAlign,\n ButtonVariant,\n} from '../Button';\nimport { Container } from '../Container';\nimport { DropDown, type PanelProps } from '../DropDown';\nimport { Input } from '../Input';\nimport {\n SwitchSelector,\n SwitchSelectorColor,\n SwitchSelectorSize,\n} from '../SwitchSelector';\nimport { useLocaleSwitcherContent } from './LocaleSwitcherContentContext';\n\nexport type LocaleSwitcherContentProps = {\n panelProps?: Omit<PanelProps, 'identifier'>;\n isMultilingual?: boolean;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher-content';\n\ntype MultilingualAvailableLocales = {\n locale: LocalesValues;\n englishName: string;\n currentLocaleName: string;\n ownLocaleName: string;\n};\n\nexport const LocaleSwitcherContent: FC<LocaleSwitcherContentProps> = ({\n panelProps,\n isMultilingual = true,\n}) => {\n const {\n switchTo,\n searchInput,\n localeSwitcherLabel,\n languageListLabel,\n seeAllLocalesSwitch,\n } = useIntlayer('locale-switcher-content');\n const inputRef = useRef<HTMLInputElement>(null);\n const { locale } = useLocale();\n const { availableLocales, selectedLocales, setSelectedLocales } =\n useLocaleSwitcherContent();\n\n // 1. Memoize the list construction so it doesn't rebuild every render\n const multilingualAvailableLocales: MultilingualAvailableLocales[] = useMemo(\n () =>\n availableLocales.map((localeEl) => {\n const englishName = getLocaleName(localeEl, Locales.ENGLISH);\n const currentLocaleName = getLocaleName(localeEl, locale);\n const ownLocaleName = getLocaleName(localeEl);\n return {\n locale: localeEl,\n englishName,\n currentLocaleName,\n ownLocaleName,\n };\n }),\n [availableLocales, locale]\n );\n\n // 2. State for Search Query only (Source of Truth)\n const [searchQuery, setSearchQuery] = useState('');\n\n const [seeAllLocales, setSeeAllLocales] = usePersistedStore(\n 'locale-content-selector-see-all-locales',\n false\n );\n\n // 3. Memoize Fuse instance\n const fuse = useMemo(() => {\n const fuseOptions: IFuseOptions<MultilingualAvailableLocales> = {\n keys: [\n { name: 'ownLocaleName', weight: 0.4 },\n { name: 'englishName', weight: 0.2 },\n { name: 'currentLocaleName', weight: 0.2 },\n { name: 'locale', weight: 0.2 },\n ],\n threshold: 0.02,\n };\n return new Fuse(multilingualAvailableLocales, fuseOptions);\n }, [multilingualAvailableLocales]);\n\n // 4. Derive results from Search Query\n const results = useMemo(() => {\n if (!searchQuery) {\n return multilingualAvailableLocales;\n }\n return fuse.search(searchQuery).map((result) => result.item);\n }, [searchQuery, multilingualAvailableLocales, fuse]);\n\n const handleClickLocale = (localeItem: LocalesValues) => {\n if (isMultilingual) {\n if (selectedLocales.includes(localeItem)) {\n if (selectedLocales.length > 1) {\n setSelectedLocales((prev) => prev.filter((el) => el !== localeItem));\n }\n } else {\n setSelectedLocales((prev) => [...prev, localeItem]);\n }\n } else {\n setSelectedLocales([localeItem]);\n }\n };\n\n const handleSeeAllLocales = (value: boolean) => {\n setSeeAllLocales(value);\n\n if (value) {\n setSelectedLocales(availableLocales);\n } else {\n setSelectedLocales([locale]);\n }\n };\n\n return (\n <div className=\"rounded-xl border border-text text-text transition-colors\">\n <DropDown identifier={DROPDOWN_IDENTIFIER}>\n <DropDown.Trigger\n identifier={DROPDOWN_IDENTIFIER}\n label={localeSwitcherLabel.value}\n className=\"p-0!\"\n roundedSize=\"3xl\"\n >\n <div className=\"flex w-full items-center justify-between\">\n <div className=\"px-2 py-1\">\n <Globe size={16} />\n </div>\n <MoveVertical className=\"self-center\" size={16} />\n </div>\n </DropDown.Trigger>\n\n <DropDown.Panel\n identifier={DROPDOWN_IDENTIFIER}\n isOverable\n isFocusable\n className=\"right-0 left-auto\"\n {...panelProps}\n >\n <Container\n className=\"max-h-[60vh] min-w-28\"\n separator=\"y\"\n role=\"listbox\"\n transparency=\"sm\"\n border\n roundedSize=\"2xl\"\n borderColor=\"text\"\n aria-label={languageListLabel.value}\n >\n {isMultilingual && (\n <div className=\"m-auto p-2\">\n <SwitchSelector\n defaultValue={seeAllLocales} // Ensure this uses the persisted state\n onChange={handleSeeAllLocales}\n color={SwitchSelectorColor.TEXT}\n size={SwitchSelectorSize.SM}\n className=\"!w-60\"\n choices={[\n {\n content: seeAllLocalesSwitch.true.value,\n value: true,\n },\n {\n content: seeAllLocalesSwitch.false.value,\n value: false,\n },\n ]}\n />\n </div>\n )}\n\n {!(isMultilingual && seeAllLocales) && (\n <>\n <div className=\"p-3\">\n <Input\n type=\"search\"\n aria-label={searchInput.ariaLabel.value}\n placeholder={searchInput.placeholder.value}\n // Update search query state directly\n onChange={(e) => setSearchQuery(e.target.value)}\n ref={inputRef}\n />\n </div>\n <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n {results.map(\n ({\n locale: localeItem,\n currentLocaleName,\n ownLocaleName,\n }) => (\n <li className=\"px-1.5 py-1\" key={localeItem}>\n <Button\n onClick={() => handleClickLocale(localeItem)}\n label={`${switchTo} ${currentLocaleName}`}\n disabled={\n !(availableLocales ?? availableLocales).includes(\n localeItem\n )\n }\n isActive={selectedLocales.includes(localeItem)}\n variant={ButtonVariant.HOVERABLE}\n color={ButtonColor.TEXT}\n isFullWidth\n textAlign={ButtonTextAlign.LEFT}\n size={ButtonSize.SM}\n >\n <div className=\"flex flex-row items-center justify-between gap-3 px-2 py-1\">\n {isMultilingual && (\n <div className=\"w-4\">\n {selectedLocales.includes(localeItem) && (\n <Check className=\"size-full\" />\n )}\n </div>\n )}\n <div className=\"flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1\">\n <div className=\"flex flex-col text-nowrap\">\n <span\n dir={getHTMLTextDir(localeItem)}\n lang={localeItem}\n >\n {ownLocaleName}\n </span>\n <span className=\"text-neutral text-xs\">\n {currentLocaleName}\n </span>\n </div>\n <span className=\"text-neutral text-sm\">\n {localeItem.toUpperCase()}\n </span>\n </div>\n </div>\n </Button>\n </li>\n )\n )}\n </ol>\n </>\n )}\n </Container>\n </DropDown.Panel>\n </DropDown>\n </div>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AA+BA,MAAM,sBAAsB;AAS5B,MAAaA,yBAAyD,EACpE,YACA,iBAAiB,WACb;CACJ,MAAM,EACJ,UACA,aACA,qBACA,mBACA,wBACE,YAAY,0BAA0B;CAC1C,MAAM,WAAW,OAAyB,KAAK;CAC/C,MAAM,EAAE,WAAW,WAAW;CAC9B,MAAM,EAAE,kBAAkB,iBAAiB,uBACzC,0BAA0B;CAG5B,MAAMC,+BAA+D,cAEjE,iBAAiB,KAAK,aAAa;AAIjC,SAAO;GACL,QAAQ;GACR,aALkB,cAAc,UAAU,QAAQ,QAAQ;GAM1D,mBALwB,cAAc,UAAU,OAAO;GAMvD,eALoB,cAAc,SAAS;GAM5C;GACD,EACJ,CAAC,kBAAkB,OAAO,CAC3B;CAGD,MAAM,CAAC,aAAa,kBAAkB,SAAS,GAAG;CAElD,MAAM,CAAC,eAAe,oBAAoB,kBACxC,2CACA,MACD;CAGD,MAAM,OAAO,cAAc;AAUzB,SAAO,IAAI,KAAK,8BATgD;GAC9D,MAAM;IACJ;KAAE,MAAM;KAAiB,QAAQ;KAAK;IACtC;KAAE,MAAM;KAAe,QAAQ;KAAK;IACpC;KAAE,MAAM;KAAqB,QAAQ;KAAK;IAC1C;KAAE,MAAM;KAAU,QAAQ;KAAK;IAChC;GACD,WAAW;GACZ,CACyD;IACzD,CAAC,6BAA6B,CAAC;CAGlC,MAAM,UAAU,cAAc;AAC5B,MAAI,CAAC,YACH,QAAO;AAET,SAAO,KAAK,OAAO,YAAY,CAAC,KAAK,WAAW,OAAO,KAAK;IAC3D;EAAC;EAAa;EAA8B;EAAK,CAAC;CAErD,MAAM,qBAAqB,eAA8B;AACvD,MAAI,eACF,KAAI,gBAAgB,SAAS,WAAW,EACtC;OAAI,gBAAgB,SAAS,EAC3B,qBAAoB,SAAS,KAAK,QAAQ,OAAO,OAAO,WAAW,CAAC;QAGtE,qBAAoB,SAAS,CAAC,GAAG,MAAM,WAAW,CAAC;MAGrD,oBAAmB,CAAC,WAAW,CAAC;;CAIpC,MAAM,uBAAuB,UAAmB;AAC9C,mBAAiB,MAAM;AAEvB,MAAI,MACF,oBAAmB,iBAAiB;MAEpC,oBAAmB,CAAC,OAAO,CAAC;;AAIhC,QACE,oBAAC;EAAI,WAAU;YACb,qBAAC;GAAS,YAAY;cACpB,oBAAC,SAAS;IACR,YAAY;IACZ,OAAO,oBAAoB;IAC3B,WAAU;IACV,aAAY;cAEZ,qBAAC;KAAI,WAAU;gBACb,oBAAC;MAAI,WAAU;gBACb,oBAAC,SAAM,MAAM,KAAM;OACf,EACN,oBAAC;MAAa,WAAU;MAAc,MAAM;OAAM;MAC9C;KACW,EAEnB,oBAAC,SAAS;IACR,YAAY;IACZ;IACA;IACA,WAAU;IACV,GAAI;cAEJ,qBAAC;KACC,WAAU;KACV,WAAU;KACV,MAAK;KACL,cAAa;KACb;KACA,aAAY;KACZ,aAAY;KACZ,cAAY,kBAAkB;gBAE7B,kBACC,oBAAC;MAAI,WAAU;gBACb,oBAAC;OACC,cAAc;OACd,UAAU;OACV,OAAO,oBAAoB;OAC3B,MAAM,mBAAmB;OACzB,WAAU;OACV,SAAS,CACP;QACE,SAAS,oBAAoB,KAAK;QAClC,OAAO;QACR,EACD;QACE,SAAS,oBAAoB,MAAM;QACnC,OAAO;QACR,CACF;QACD;OACE,EAGP,EAAE,kBAAkB,kBACnB,8CACE,oBAAC;MAAI,WAAU;gBACb,oBAAC;OACC,MAAK;OACL,cAAY,YAAY,UAAU;OAClC,aAAa,YAAY,YAAY;OAErC,WAAW,MAAM,eAAe,EAAE,OAAO,MAAM;OAC/C,KAAK;QACL;OACE,EACN,oBAAC;MAAG,WAAU;gBACX,QAAQ,KACN,EACC,QAAQ,YACR,mBACA,oBAEA,oBAAC;OAAG,WAAU;iBACZ,oBAAC;QACC,eAAe,kBAAkB,WAAW;QAC5C,OAAO,GAAG,SAAS,GAAG;QACtB,UACE,EAAE,oBAAoB,kBAAkB,SACtC,WACD;QAEH,UAAU,gBAAgB,SAAS,WAAW;QAC9C,SAAS,cAAc;QACvB,OAAO,YAAY;QACnB;QACA,WAAW,gBAAgB;QAC3B,MAAM,WAAW;kBAEjB,qBAAC;SAAI,WAAU;oBACZ,kBACC,oBAAC;UAAI,WAAU;oBACZ,gBAAgB,SAAS,WAAW,IACnC,oBAAC,SAAM,WAAU,cAAc;WAE7B,EAER,qBAAC;UAAI,WAAU;qBACb,qBAAC;WAAI,WAAU;sBACb,oBAAC;YACC,KAAK,eAAe,WAAW;YAC/B,MAAM;sBAEL;aACI,EACP,oBAAC;YAAK,WAAU;sBACb;aACI;YACH,EACN,oBAAC;WAAK,WAAU;qBACb,WAAW,aAAa;YACpB;WACH;UACF;SACC;SAzCsB,WA0C5B,CAER;OACE,IACJ;MAEK;KACG;IACR;GACP"}
1	+ {"version":3,"file":"LocaleSwitcherContent.mjs","names":["LocaleSwitcherContent: FC<LocaleSwitcherContentProps>","multilingualAvailableLocales: MultilingualAvailableLocales[]"],"sources":["../../../../src/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.tsx"],"sourcesContent":["'use client';\n\nimport { usePersistedStore } from '@hooks/usePersistedStore';\nimport { getHTMLTextDir, getLocaleName } from '@intlayer/core';\nimport { Locales, type LocalesValues } from '@intlayer/types';\nimport Fuse, { type IFuseOptions } from 'fuse.js';\nimport { Check, Globe, MoveVertical } from 'lucide-react';\nimport { type FC, useMemo, useRef, useState } from 'react';\nimport { useIntlayer, useLocale } from 'react-intlayer';\nimport {\n Button,\n ButtonColor,\n ButtonSize,\n ButtonTextAlign,\n ButtonVariant,\n} from '../Button';\nimport { Container } from '../Container';\nimport { DropDown, type PanelProps } from '../DropDown';\nimport { Input } from '../Input';\nimport {\n SwitchSelector,\n SwitchSelectorColor,\n SwitchSelectorSize,\n} from '../SwitchSelector';\nimport { useLocaleSwitcherContent } from './LocaleSwitcherContentContext';\n\nexport type LocaleSwitcherContentProps = {\n panelProps?: Omit<PanelProps, 'identifier'>;\n isMultilingual?: boolean;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher-content';\n\ntype MultilingualAvailableLocales = {\n locale: LocalesValues;\n englishName: string;\n currentLocaleName: string;\n ownLocaleName: string;\n};\n\nexport const LocaleSwitcherContent: FC<LocaleSwitcherContentProps> = ({\n panelProps,\n isMultilingual = true,\n}) => {\n const {\n switchTo,\n searchInput,\n localeSwitcherLabel,\n languageListLabel,\n seeAllLocalesSwitch,\n } = useIntlayer('locale-switcher-content');\n const inputRef = useRef<HTMLInputElement>(null);\n const { locale } = useLocale();\n const { availableLocales, selectedLocales, setSelectedLocales } =\n useLocaleSwitcherContent();\n\n // 1. Memoize the list construction so it doesn't rebuild every render\n const multilingualAvailableLocales: MultilingualAvailableLocales[] = useMemo(\n () =>\n availableLocales.map((localeEl) => {\n const englishName = getLocaleName(localeEl, Locales.ENGLISH);\n const currentLocaleName = getLocaleName(localeEl, locale);\n const ownLocaleName = getLocaleName(localeEl);\n return {\n locale: localeEl,\n englishName,\n currentLocaleName,\n ownLocaleName,\n };\n }),\n [availableLocales, locale]\n );\n\n // 2. State for Search Query only (Source of Truth)\n const [searchQuery, setSearchQuery] = useState('');\n\n const [seeAllLocales, setSeeAllLocales] = usePersistedStore(\n 'locale-content-selector-see-all-locales',\n false\n );\n\n // 3. Memoize Fuse instance\n const fuse = useMemo(() => {\n const fuseOptions: IFuseOptions<MultilingualAvailableLocales> = {\n keys: [\n { name: 'ownLocaleName', weight: 0.4 },\n { name: 'englishName', weight: 0.2 },\n { name: 'currentLocaleName', weight: 0.2 },\n { name: 'locale', weight: 0.2 },\n ],\n threshold: 0.02,\n };\n return new Fuse(multilingualAvailableLocales, fuseOptions);\n }, [multilingualAvailableLocales]);\n\n // 4. Derive results from Search Query\n const results = useMemo(() => {\n if (!searchQuery) {\n return multilingualAvailableLocales;\n }\n return fuse.search(searchQuery).map((result) => result.item);\n }, [searchQuery, multilingualAvailableLocales, fuse]);\n\n const handleClickLocale = (localeItem: LocalesValues) => {\n if (isMultilingual) {\n if (selectedLocales.includes(localeItem)) {\n if (selectedLocales.length > 1) {\n setSelectedLocales((prev) => prev.filter((el) => el !== localeItem));\n }\n } else {\n setSelectedLocales((prev) => [...prev, localeItem]);\n }\n } else {\n setSelectedLocales([localeItem]);\n }\n };\n\n const handleSeeAllLocales = (value: boolean) => {\n setSeeAllLocales(value);\n\n if (value) {\n setSelectedLocales(availableLocales);\n } else {\n setSelectedLocales([locale]);\n }\n };\n\n return (\n <div className=\"rounded-xl border border-text text-text transition-colors\">\n <DropDown identifier={DROPDOWN_IDENTIFIER}>\n <DropDown.Trigger\n identifier={DROPDOWN_IDENTIFIER}\n label={localeSwitcherLabel.value}\n className=\"p-0!\"\n roundedSize=\"3xl\"\n >\n <div className=\"flex w-full items-center justify-between\">\n <div className=\"px-2 py-1\">\n <Globe size={16} />\n </div>\n <MoveVertical className=\"self-center\" size={16} />\n </div>\n </DropDown.Trigger>\n\n <DropDown.Panel\n identifier={DROPDOWN_IDENTIFIER}\n isOverable\n isFocusable\n className=\"right-0 left-auto\"\n {...panelProps}\n >\n <Container\n className=\"max-h-[60vh] min-w-28\"\n separator=\"y\"\n role=\"listbox\"\n transparency=\"sm\"\n border\n roundedSize=\"2xl\"\n borderColor=\"text\"\n aria-label={languageListLabel.value}\n >\n {isMultilingual && (\n <div className=\"m-auto p-2\">\n <SwitchSelector\n defaultValue={seeAllLocales} // Ensure this uses the persisted state\n onChange={handleSeeAllLocales}\n color={SwitchSelectorColor.TEXT}\n size={SwitchSelectorSize.SM}\n className=\"!w-60\"\n choices={[\n {\n content: seeAllLocalesSwitch.true.value,\n value: true,\n },\n {\n content: seeAllLocalesSwitch.false.value,\n value: false,\n },\n ]}\n />\n </div>\n )}\n\n {!(isMultilingual && seeAllLocales) && (\n <>\n <div className=\"p-3\">\n <Input\n type=\"search\"\n aria-label={searchInput.ariaLabel.value}\n placeholder={searchInput.placeholder.value}\n // Update search query state directly\n onChange={(e) => setSearchQuery(e.target.value)}\n ref={inputRef}\n />\n </div>\n <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n {results.map(\n ({\n locale: localeItem,\n currentLocaleName,\n ownLocaleName,\n }) => (\n <li className=\"px-1.5 py-1\" key={localeItem}>\n <Button\n onClick={() => handleClickLocale(localeItem)}\n label={`${switchTo} ${currentLocaleName}`}\n disabled={\n !(availableLocales ?? availableLocales).includes(\n localeItem\n )\n }\n isActive={selectedLocales.includes(localeItem)}\n variant={ButtonVariant.HOVERABLE}\n color={ButtonColor.TEXT}\n isFullWidth\n textAlign={ButtonTextAlign.LEFT}\n size={ButtonSize.SM}\n >\n <div className=\"flex flex-row items-center justify-between gap-3 px-2 py-1\">\n {isMultilingual && (\n <div className=\"w-4\">\n {selectedLocales.includes(localeItem) && (\n <Check className=\"size-full\" />\n )}\n </div>\n )}\n <div className=\"flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1\">\n <div className=\"flex flex-col text-nowrap\">\n <span\n dir={getHTMLTextDir(localeItem)}\n lang={localeItem}\n >\n {ownLocaleName}\n </span>\n <span className=\"text-neutral text-xs\">\n {currentLocaleName}\n </span>\n </div>\n <span className=\"text-neutral text-sm\">\n {localeItem.toUpperCase()}\n </span>\n </div>\n </div>\n </Button>\n </li>\n )\n )}\n </ol>\n </>\n )}\n </Container>\n </DropDown.Panel>\n </DropDown>\n </div>\n );\n};\n"],"mappings":"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"}

package/dist/esm/components/LocaleSwitcherContentDropDown/LocaleSwitcherContentContext.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LocaleSwitcherContentContext.mjs","names":["LocaleSwitcherContentProvider: FC<\n PropsWithChildren<LocaleSwitcherContentProviderProps>\n>"],"sources":["../../../../src/components/LocaleSwitcherContentDropDown/LocaleSwitcherContentContext.tsx"],"sourcesContent":["'use client';\n\nimport type { LocalesValues } from 'intlayer';\nimport {\n createContext,\n type Dispatch,\n type FC,\n type PropsWithChildren,\n type SetStateAction,\n useContext,\n} from 'react';\nimport { useLocale } from 'react-intlayer';\~~nimport { usePersistedStore } from '../../hooks';\~~n\ntype LocaleSwitcherContentContextProps = {\n availableLocales: LocalesValues[];\n selectedLocales: LocalesValues[];\n setSelectedLocales: Dispatch<SetStateAction<LocalesValues[]>>;\n};\n\nconst LocaleSwitcherContentContext =\n createContext<LocaleSwitcherContentContextProps>({\n availableLocales: [],\n selectedLocales: [],\n setSelectedLocales: () => {},\n });\n\nexport const useLocaleSwitcherContent = () =>\n useContext(LocaleSwitcherContentContext);\n\ntype LocaleSwitcherContentProviderProps = {\n availableLocales: LocalesValues[];\n defaultSelectedLocales?: LocalesValues[];\n};\n\nexport const LocaleSwitcherContentProvider: FC<\n PropsWithChildren<LocaleSwitcherContentProviderProps>\n> = ({ availableLocales, defaultSelectedLocales, children }) => {\n const { locale } = useLocale();\n\n const [selectedLocales, setSelectedLocales] = usePersistedStore<\n LocalesValues[]\n >(\n 'locale-content-selector-selected-locales',\n defaultSelectedLocales ?? [locale]\n );\n\n return (\n <LocaleSwitcherContentContext\n value={{\n availableLocales,\n selectedLocales,\n setSelectedLocales,\n }}\n >\n {children}\n </LocaleSwitcherContentContext>\n );\n};\n"],"mappings":";;;;;;;;AAoBA,MAAM,+BACJ,cAAiD;CAC/C,kBAAkB,EAAE;CACpB,iBAAiB,EAAE;CACnB,0BAA0B;CAC3B,CAAC;AAEJ,MAAa,iCACX,WAAW,6BAA6B;AAO1C,MAAaA,iCAER,EAAE,kBAAkB,wBAAwB,eAAe;CAC9D,MAAM,EAAE,WAAW,WAAW;CAE9B,MAAM,CAAC,iBAAiB,sBAAsB,kBAG5C,4CACA,0BAA0B,CAAC,OAAO,CACnC;AAED,QACE,oBAAC;EACC,OAAO;GACL;GACA;GACA;GACD;EAEA;GAC4B"}
1	+ {"version":3,"file":"LocaleSwitcherContentContext.mjs","names":["LocaleSwitcherContentProvider: FC<\n PropsWithChildren<LocaleSwitcherContentProviderProps>\n>"],"sources":["../../../../src/components/LocaleSwitcherContentDropDown/LocaleSwitcherContentContext.tsx"],"sourcesContent":["'use client';\n\nimport { usePersistedStore } from '@hooks/usePersistedStore';\nimport type { LocalesValues } from 'intlayer';\nimport {\n createContext,\n type Dispatch,\n type FC,\n type PropsWithChildren,\n type SetStateAction,\n useContext,\n} from 'react';\nimport { useLocale } from 'react-intlayer';\n\ntype LocaleSwitcherContentContextProps = {\n availableLocales: LocalesValues[];\n selectedLocales: LocalesValues[];\n setSelectedLocales: Dispatch<SetStateAction<LocalesValues[]>>;\n};\n\nconst LocaleSwitcherContentContext =\n createContext<LocaleSwitcherContentContextProps>({\n availableLocales: [],\n selectedLocales: [],\n setSelectedLocales: () => {},\n });\n\nexport const useLocaleSwitcherContent = () =>\n useContext(LocaleSwitcherContentContext);\n\ntype LocaleSwitcherContentProviderProps = {\n availableLocales: LocalesValues[];\n defaultSelectedLocales?: LocalesValues[];\n};\n\nexport const LocaleSwitcherContentProvider: FC<\n PropsWithChildren<LocaleSwitcherContentProviderProps>\n> = ({ availableLocales, defaultSelectedLocales, children }) => {\n const { locale } = useLocale();\n\n const [selectedLocales, setSelectedLocales] = usePersistedStore<\n LocalesValues[]\n >(\n 'locale-content-selector-selected-locales',\n defaultSelectedLocales ?? [locale]\n );\n\n return (\n <LocaleSwitcherContentContext\n value={{\n availableLocales,\n selectedLocales,\n setSelectedLocales,\n }}\n >\n {children}\n </LocaleSwitcherContentContext>\n );\n};\n"],"mappings":";;;;;;;;AAoBA,MAAM,+BACJ,cAAiD;CAC/C,kBAAkB,EAAE;CACpB,iBAAiB,EAAE;CACnB,0BAA0B;CAC3B,CAAC;AAEJ,MAAa,iCACX,WAAW,6BAA6B;AAO1C,MAAaA,iCAER,EAAE,kBAAkB,wBAAwB,eAAe;CAC9D,MAAM,EAAE,WAAW,WAAW;CAE9B,MAAM,CAAC,iBAAiB,sBAAsB,kBAG5C,4CACA,0BAA0B,CAAC,OAAO,CACnC;AAED,QACE,oBAAC;EACC,OAAO;GACL;GACA;GACA;GACD;EAEA;GAC4B"}

package/dist/esm/components/LocaleSwitcherDropDown/LocaleSwitcher.mjs CHANGED Viewed

@@ -109,9 +109,11 @@ const LocaleSwitcher = ({ locale, localeList, availableLocales, fullLocaleName =
 										children: [/* @__PURE__ */ jsx("span", {
 											dir: getHTMLTextDir(localeItem),
 											lang: localeItem,
+											suppressHydrationWarning: true,
 											children: ownLocaleName
 										}), /* @__PURE__ */ jsx("span", {
 											className: "text-neutral text-xs",
+											suppressHydrationWarning: true,
 											children: currentLocaleName
 										})]
 									}), /* @__PURE__ */ jsx("span", {

package/dist/esm/components/LocaleSwitcherDropDown/LocaleSwitcher.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LocaleSwitcher.mjs","names":["LocaleSwitcher: FC<LocaleSwitcherProps>","multilingualAvailableLocales: MultilingualAvailableLocales[]"],"sources":["../../../../src/components/LocaleSwitcherDropDown/LocaleSwitcher.tsx"],"sourcesContent":["'use client';\n\nimport { getHTMLTextDir, getLocaleName } from '@intlayer/core';\nimport { type Locale, Locales } from '@intlayer/types';\nimport Fuse, { type IFuseOptions } from 'fuse.js';\nimport { MoveVertical } from 'lucide-react';\nimport { type FC, useCallback, useMemo, useRef, useState } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button, ButtonColor, ButtonTextAlign, ButtonVariant } from '../Button';\nimport { Container } from '../Container';\nimport { DropDown, type PanelProps } from '../DropDown';\nimport { Input } from '../Input';\n\nexport type LocaleSwitcherProps = {\n locale?: Locale;\n localeList: Locale[];\n availableLocales?: Locale[];\n fullLocaleName?: boolean;\n setLocale: (locale: Locale) => void;\n panelProps?: Omit<PanelProps, 'identifier'>;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher';\n\ntype MultilingualAvailableLocales = {\n locale: Locale;\n englishName: string;\n currentLocaleName: string;\n ownLocaleName: string;\n};\n\nexport const LocaleSwitcher: FC<LocaleSwitcherProps> = ({\n locale,\n localeList,\n availableLocales,\n fullLocaleName = true,\n setLocale,\n panelProps,\n}) => {\n let localeName = 'Select a locale';\n const { switchTo, searchInput, languageListLabel } =\n useIntlayer('locale-switcher');\n const inputRef = useRef<HTMLInputElement>(null);\n\n const multilingualAvailableLocales: MultilingualAvailableLocales[] = useMemo(\n () =>\n localeList.map((localeEl) => {\n const englishName = getLocaleName(localeEl, Locales.ENGLISH);\n const currentLocaleName = getLocaleName(localeEl, locale);\n const ownLocaleName = getLocaleName(localeEl);\n return {\n locale: localeEl,\n englishName,\n currentLocaleName,\n ownLocaleName,\n };\n }),\n [localeList, locale]\n );\n\n const [results, setResults] = useState<MultilingualAvailableLocales[]>(\n multilingualAvailableLocales\n );\n\n // Create a new Fuse instance with the options and documentation data\n const fuse = useMemo(() => {\n const fuseOptions: IFuseOptions<MultilingualAvailableLocales> = {\n keys: [\n { name: 'ownLocaleName', weight: 0.4 },\n { name: 'englishName', weight: 0.2 },\n { name: 'currentLocaleName', weight: 0.2 },\n { name: 'locale', weight: 0.2 },\n ],\n threshold: 0.02, // Defines how fuzzy the matching should be (lower is more strict)\n };\n\n return new Fuse(multilingualAvailableLocales, fuseOptions);\n }, [multilingualAvailableLocales]);\n\n const handleSearch = useCallback(\n (searchQuery: string) => {\n if (searchQuery) {\n // Perform search on every input change\n const searchResults = fuse\n .search(searchQuery)\n .map((result) => result.item);\n setResults(searchResults);\n } else {\n setResults(multilingualAvailableLocales);\n }\n },\n [fuse, multilingualAvailableLocales]\n );\n\n if (locale) {\n localeName = fullLocaleName ? getLocaleName(locale) : locale.toUpperCase();\n }\n\n return (\n <div\n className=\"rounded-xl border border-text text-text transition-colors\"\n aria-label={localeSwitcherLabel.value}\n >\n <DropDown identifier={DROPDOWN_IDENTIFIER}>\n <DropDown.Trigger identifier={DROPDOWN_IDENTIFIER}>\n <div className=\"flex w-full items-center justify-between\">\n <div className=\"text-nowrap px-2\">{localeName}</div>\n <MoveVertical className=\"w-5 self-center\" />\n </div>\n </DropDown.Trigger>\n\n <DropDown.Panel\n identifier={DROPDOWN_IDENTIFIER}\n isOverable\n isFocusable\n {...panelProps}\n >\n <Container\n className=\"max-h-[80vh] min-w-28\"\n separator=\"y\"\n role=\"listbox\"\n transparency=\"sm\"\n aria-label={languageListLabel.value}\n >\n <div className=\"p-3\">\n <Input\n type=\"search\"\n aria-label={searchInput.ariaLabel.value}\n placeholder={searchInput.placeholder.value}\n onChange={(e) => handleSearch(e.target.value)}\n ref={inputRef}\n />\n </div>\n <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n {results.map(\n ({ locale: localeItem, currentLocaleName, ownLocaleName }) => (\n <li className=\"px-1.5 py-1\" key={localeItem}>\n <Button\n onClick={() => setLocale(localeItem)}\n label={`${switchTo} ${currentLocaleName}`}\n disabled={\n !(availableLocales ?? localeList).includes(localeItem)\n }\n isActive={locale === localeItem}\n variant={ButtonVariant.HOVERABLE}\n color={ButtonColor.TEXT}\n isFullWidth\n textAlign={ButtonTextAlign.LEFT}\n >\n <div className=\"flex flex-row items-center justify-between gap-3 px-2 py-1\">\n <div className=\"flex flex-col text-nowrap\">\n <span\n dir={getHTMLTextDir(localeItem)}\n lang={localeItem}\n >\n {ownLocaleName}\n </span>\n <span className=\"text-neutral text-xs\">\n {currentLocaleName}\n </span>\n </div>\n <span className=\"text-neutral text-sm\">\n {localeItem.toUpperCase()}\n </span>\n </div>\n </Button>\n </li>\n )\n )}\n </ol>\n </Container>\n </DropDown.Panel>\n </DropDown>\n </div>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAsBA,MAAM,sBAAsB;AAS5B,MAAaA,kBAA2C,EACtD,QACA,YACA,kBACA,iBAAiB,MACjB,WACA,iBACI;CACJ,IAAI,aAAa;CACjB,MAAM,EAAE,UAAU,aAAa,sBAC7B,YAAY,kBAAkB;CAChC,MAAM,WAAW,OAAyB,KAAK;CAE/C,MAAMC,+BAA+D,cAEjE,WAAW,KAAK,aAAa;AAI3B,SAAO;GACL,QAAQ;GACR,aALkB,cAAc,UAAU,QAAQ,QAAQ;GAM1D,mBALwB,cAAc,UAAU,OAAO;GAMvD,eALoB,cAAc,SAAS;GAM5C;GACD,EACJ,CAAC,YAAY,OAAO,CACrB;CAED,MAAM,CAAC,SAAS,cAAc,SAC5B,6BACD;CAGD,MAAM,OAAO,cAAc;AAWzB,SAAO,IAAI,KAAK,8BAVgD;GAC9D,MAAM;IACJ;KAAE,MAAM;KAAiB,QAAQ;KAAK;IACtC;KAAE,MAAM;KAAe,QAAQ;KAAK;IACpC;KAAE,MAAM;KAAqB,QAAQ;KAAK;IAC1C;KAAE,MAAM;KAAU,QAAQ;KAAK;IAChC;GACD,WAAW;GACZ,CAEyD;IACzD,CAAC,6BAA6B,CAAC;CAElC,MAAM,eAAe,aAClB,gBAAwB;AACvB,MAAI,YAKF,YAHsB,KACnB,OAAO,YAAY,CACnB,KAAK,WAAW,OAAO,KAAK,CACN;MAEzB,YAAW,6BAA6B;IAG5C,CAAC,MAAM,6BAA6B,CACrC;AAED,KAAI,OACF,cAAa,iBAAiB,cAAc,OAAO,GAAG,OAAO,aAAa;AAG5E,QACE,oBAAC;EACC,WAAU;EACV,cAAY,oBAAoB;YAEhC,qBAAC;GAAS,YAAY;cACpB,oBAAC,SAAS;IAAQ,YAAY;cAC5B,qBAAC;KAAI,WAAU;gBACb,oBAAC;MAAI,WAAU;gBAAoB;OAAiB,EACpD,oBAAC,gBAAa,WAAU,oBAAoB;MACxC;KACW,EAEnB,oBAAC,SAAS;IACR,YAAY;IACZ;IACA;IACA,GAAI;cAEJ,qBAAC;KACC,WAAU;KACV,WAAU;KACV,MAAK;KACL,cAAa;KACb,cAAY,kBAAkB;gBAE9B,oBAAC;MAAI,WAAU;gBACb,oBAAC;OACC,MAAK;OACL,cAAY,YAAY,UAAU;OAClC,aAAa,YAAY,YAAY;OACrC,WAAW,MAAM,aAAa,EAAE,OAAO,MAAM;OAC7C,KAAK;QACL;OACE,EACN,oBAAC;MAAG,WAAU;gBACX,QAAQ,KACN,EAAE,QAAQ,YAAY,mBAAmB,oBACxC,oBAAC;OAAG,WAAU;iBACZ,oBAAC;QACC,eAAe,UAAU,WAAW;QACpC,OAAO,GAAG,SAAS,GAAG;QACtB,UACE,EAAE,oBAAoB,YAAY,SAAS,WAAW;QAExD,UAAU,WAAW;QACrB,SAAS,cAAc;QACvB,OAAO,YAAY;QACnB;QACA,WAAW,gBAAgB;kBAE3B,qBAAC;SAAI,WAAU;oBACb,qBAAC;UAAI,WAAU;qBACb,oBAAC;WACC,KAAK,eAAe,WAAW;WAC/B,MAAM;~~qBAEL~~;YACI,EACP,oBAAC;~~WAAK~~,WAAU;~~qBACb~~;YACI;WACH,EACN,oBAAC;UAAK,WAAU;oBACb,WAAW,aAAa;WACpB;UACH;SACC;~~SA7BsB~~,~~WA8B5B~~,CAER;OACE;MACK;KACG;IACR;GACP"}
1	+ {"version":3,"file":"LocaleSwitcher.mjs","names":["LocaleSwitcher: FC<LocaleSwitcherProps>","multilingualAvailableLocales: MultilingualAvailableLocales[]"],"sources":["../../../../src/components/LocaleSwitcherDropDown/LocaleSwitcher.tsx"],"sourcesContent":["'use client';\n\nimport { getHTMLTextDir, getLocaleName } from '@intlayer/core';\nimport { type Locale, Locales } from '@intlayer/types';\nimport Fuse, { type IFuseOptions } from 'fuse.js';\nimport { MoveVertical } from 'lucide-react';\nimport { type FC, useCallback, useMemo, useRef, useState } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button, ButtonColor, ButtonTextAlign, ButtonVariant } from '../Button';\nimport { Container } from '../Container';\nimport { DropDown, type PanelProps } from '../DropDown';\nimport { Input } from '../Input';\n\nexport type LocaleSwitcherProps = {\n locale?: Locale;\n localeList: Locale[];\n availableLocales?: Locale[];\n fullLocaleName?: boolean;\n setLocale: (locale: Locale) => void;\n panelProps?: Omit<PanelProps, 'identifier'>;\n};\n\nconst DROPDOWN_IDENTIFIER = 'locale-switcher';\n\ntype MultilingualAvailableLocales = {\n locale: Locale;\n englishName: string;\n currentLocaleName: string;\n ownLocaleName: string;\n};\n\nexport const LocaleSwitcher: FC<LocaleSwitcherProps> = ({\n locale,\n localeList,\n availableLocales,\n fullLocaleName = true,\n setLocale,\n panelProps,\n}) => {\n let localeName = 'Select a locale';\n const { switchTo, searchInput, languageListLabel } =\n useIntlayer('locale-switcher');\n const inputRef = useRef<HTMLInputElement>(null);\n\n const multilingualAvailableLocales: MultilingualAvailableLocales[] = useMemo(\n () =>\n localeList.map((localeEl) => {\n const englishName = getLocaleName(localeEl, Locales.ENGLISH);\n const currentLocaleName = getLocaleName(localeEl, locale);\n const ownLocaleName = getLocaleName(localeEl);\n return {\n locale: localeEl,\n englishName,\n currentLocaleName,\n ownLocaleName,\n };\n }),\n [localeList, locale]\n );\n\n const [results, setResults] = useState<MultilingualAvailableLocales[]>(\n multilingualAvailableLocales\n );\n\n // Create a new Fuse instance with the options and documentation data\n const fuse = useMemo(() => {\n const fuseOptions: IFuseOptions<MultilingualAvailableLocales> = {\n keys: [\n { name: 'ownLocaleName', weight: 0.4 },\n { name: 'englishName', weight: 0.2 },\n { name: 'currentLocaleName', weight: 0.2 },\n { name: 'locale', weight: 0.2 },\n ],\n threshold: 0.02, // Defines how fuzzy the matching should be (lower is more strict)\n };\n\n return new Fuse(multilingualAvailableLocales, fuseOptions);\n }, [multilingualAvailableLocales]);\n\n const handleSearch = useCallback(\n (searchQuery: string) => {\n if (searchQuery) {\n // Perform search on every input change\n const searchResults = fuse\n .search(searchQuery)\n .map((result) => result.item);\n setResults(searchResults);\n } else {\n setResults(multilingualAvailableLocales);\n }\n },\n [fuse, multilingualAvailableLocales]\n );\n\n if (locale) {\n localeName = fullLocaleName ? getLocaleName(locale) : locale.toUpperCase();\n }\n\n return (\n <div\n className=\"rounded-xl border border-text text-text transition-colors\"\n aria-label={localeSwitcherLabel.value}\n >\n <DropDown identifier={DROPDOWN_IDENTIFIER}>\n <DropDown.Trigger identifier={DROPDOWN_IDENTIFIER}>\n <div className=\"flex w-full items-center justify-between\">\n <div className=\"text-nowrap px-2\">{localeName}</div>\n <MoveVertical className=\"w-5 self-center\" />\n </div>\n </DropDown.Trigger>\n\n <DropDown.Panel\n identifier={DROPDOWN_IDENTIFIER}\n isOverable\n isFocusable\n {...panelProps}\n >\n <Container\n className=\"max-h-[80vh] min-w-28\"\n separator=\"y\"\n role=\"listbox\"\n transparency=\"sm\"\n aria-label={languageListLabel.value}\n >\n <div className=\"p-3\">\n <Input\n type=\"search\"\n aria-label={searchInput.ariaLabel.value}\n placeholder={searchInput.placeholder.value}\n onChange={(e) => handleSearch(e.target.value)}\n ref={inputRef}\n />\n </div>\n <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n {results.map(\n ({ locale: localeItem, currentLocaleName, ownLocaleName }) => (\n <li className=\"px-1.5 py-1\" key={localeItem}>\n <Button\n onClick={() => setLocale(localeItem)}\n label={`${switchTo} ${currentLocaleName}`}\n disabled={\n !(availableLocales ?? localeList).includes(localeItem)\n }\n isActive={locale === localeItem}\n variant={ButtonVariant.HOVERABLE}\n color={ButtonColor.TEXT}\n isFullWidth\n textAlign={ButtonTextAlign.LEFT}\n >\n <div className=\"flex flex-row items-center justify-between gap-3 px-2 py-1\">\n <div className=\"flex flex-col text-nowrap\">\n <span\n dir={getHTMLTextDir(localeItem)}\n lang={localeItem}\n suppressHydrationWarning\n >\n {ownLocaleName}\n </span>\n <span\n className=\"text-neutral text-xs\"\n suppressHydrationWarning\n >\n {currentLocaleName}\n </span>\n </div>\n <span className=\"text-neutral text-sm\">\n {localeItem.toUpperCase()}\n </span>\n </div>\n </Button>\n </li>\n )\n )}\n </ol>\n </Container>\n </DropDown.Panel>\n </DropDown>\n </div>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAsBA,MAAM,sBAAsB;AAS5B,MAAaA,kBAA2C,EACtD,QACA,YACA,kBACA,iBAAiB,MACjB,WACA,iBACI;CACJ,IAAI,aAAa;CACjB,MAAM,EAAE,UAAU,aAAa,sBAC7B,YAAY,kBAAkB;CAChC,MAAM,WAAW,OAAyB,KAAK;CAE/C,MAAMC,+BAA+D,cAEjE,WAAW,KAAK,aAAa;AAI3B,SAAO;GACL,QAAQ;GACR,aALkB,cAAc,UAAU,QAAQ,QAAQ;GAM1D,mBALwB,cAAc,UAAU,OAAO;GAMvD,eALoB,cAAc,SAAS;GAM5C;GACD,EACJ,CAAC,YAAY,OAAO,CACrB;CAED,MAAM,CAAC,SAAS,cAAc,SAC5B,6BACD;CAGD,MAAM,OAAO,cAAc;AAWzB,SAAO,IAAI,KAAK,8BAVgD;GAC9D,MAAM;IACJ;KAAE,MAAM;KAAiB,QAAQ;KAAK;IACtC;KAAE,MAAM;KAAe,QAAQ;KAAK;IACpC;KAAE,MAAM;KAAqB,QAAQ;KAAK;IAC1C;KAAE,MAAM;KAAU,QAAQ;KAAK;IAChC;GACD,WAAW;GACZ,CAEyD;IACzD,CAAC,6BAA6B,CAAC;CAElC,MAAM,eAAe,aAClB,gBAAwB;AACvB,MAAI,YAKF,YAHsB,KACnB,OAAO,YAAY,CACnB,KAAK,WAAW,OAAO,KAAK,CACN;MAEzB,YAAW,6BAA6B;IAG5C,CAAC,MAAM,6BAA6B,CACrC;AAED,KAAI,OACF,cAAa,iBAAiB,cAAc,OAAO,GAAG,OAAO,aAAa;AAG5E,QACE,oBAAC;EACC,WAAU;EACV,cAAY,oBAAoB;YAEhC,qBAAC;GAAS,YAAY;cACpB,oBAAC,SAAS;IAAQ,YAAY;cAC5B,qBAAC;KAAI,WAAU;gBACb,oBAAC;MAAI,WAAU;gBAAoB;OAAiB,EACpD,oBAAC,gBAAa,WAAU,oBAAoB;MACxC;KACW,EAEnB,oBAAC,SAAS;IACR,YAAY;IACZ;IACA;IACA,GAAI;cAEJ,qBAAC;KACC,WAAU;KACV,WAAU;KACV,MAAK;KACL,cAAa;KACb,cAAY,kBAAkB;gBAE9B,oBAAC;MAAI,WAAU;gBACb,oBAAC;OACC,MAAK;OACL,cAAY,YAAY,UAAU;OAClC,aAAa,YAAY,YAAY;OACrC,WAAW,MAAM,aAAa,EAAE,OAAO,MAAM;OAC7C,KAAK;QACL;OACE,EACN,oBAAC;MAAG,WAAU;gBACX,QAAQ,KACN,EAAE,QAAQ,YAAY,mBAAmB,oBACxC,oBAAC;OAAG,WAAU;iBACZ,oBAAC;QACC,eAAe,UAAU,WAAW;QACpC,OAAO,GAAG,SAAS,GAAG;QACtB,UACE,EAAE,oBAAoB,YAAY,SAAS,WAAW;QAExD,UAAU,WAAW;QACrB,SAAS,cAAc;QACvB,OAAO,YAAY;QACnB;QACA,WAAW,gBAAgB;kBAE3B,qBAAC;SAAI,WAAU;oBACb,qBAAC;UAAI,WAAU;qBACb,oBAAC;WACC,KAAK,eAAe,WAAW;WAC/B,MAAM;WACN;qBAEC;YACI,EACP,oBAAC;WACC,WAAU;WACV;qBAEC;YACI;WACH,EACN,oBAAC;UAAK,WAAU;oBACb,WAAW,aAAa;WACpB;UACH;SACC;SAjCsB,WAkC5B,CAER;OACE;MACK;KACG;IACR;GACP"}

package/dist/esm/components/MarkDownRender/MarkDownRender.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MarkDownRender.mjs","names":["MarkdownRenderer: FC<MarkdownRendererProps>"],"sources":["../../../../src/components/MarkDownRender/MarkDownRender.tsx"],"sourcesContent":["import type { LocalesValues } from '@intlayer/types';\nimport type { ComponentProps, ComponentPropsWithoutRef, FC } from 'react';\nimport type { BundledLanguage } from 'shiki/bundle/web';\nimport { cn } from '../../utils/cn';\nimport { H1, H2, H3, H4, H5, H6 } from '../Headers';\nimport type { CodeCompAttributes } from '../IDE/Code';\nimport { Code } from '../IDE/Code';\nimport { CodeProvider } from '../IDE/CodeContext';\nimport { Link } from '../Link';\nimport { Tab } from '../Tab';\nimport { TabProvider } from '../Tab/TabContext';\nimport { Table } from '../Table';\nimport { MarkdownProcessor, type MarkdownProcessorOptions } from './processor';\n\ntype MarkdownRendererProps = {\n children: string;\n isDarkMode?: boolean;\n locale?: LocalesValues;\n options?: MarkdownProcessorOptions;\n};\n\n/*\n Removes frontmatter from markdown content\n * Frontmatter is the YAML metadata block at the beginning of markdown files\n * delimited by --- at the start and end\n /\nconst stripFrontmatter = (markdown: string): string => {\n const lines = markdown.split(/\\r?\\n/);\n\n // Check if the very first non-empty line is the metadata start delimiter\n const firstNonEmptyLine = lines.find((line) => line.trim() !== '');\n\n if (!firstNonEmptyLine \|\| firstNonEmptyLine.trim() !== '---') {\n // No frontmatter, return original content\n return markdown;\n }\n\n let inMetadataBlock = false;\n let endOfMetadataIndex = -1;\n\n for (let i = 0; i < lines.length; i++) {\n const trimmedLine = lines[i].trim();\n\n // Toggle metadata block on encountering the delimiter\n if (trimmedLine === '---') {\n if (!inMetadataBlock) {\n // Begin metadata block\n inMetadataBlock = true;\n } else {\n // End of metadata block\n endOfMetadataIndex = i;\n break;\n }\n }\n }\n\n if (endOfMetadataIndex > -1) {\n // Return content after the frontmatter\n return lines.slice(endOfMetadataIndex + 1).join('\\n');\n }\n\n // If we couldn't find the end delimiter, return original content\n return markdown;\n};\n\n/\n MarkdownRenderer Component\n \n A comprehensive markdown renderer that transforms markdown text into rich,\n * interactive HTML with custom styling and Intlayer integration. Supports\n * code syntax highlighting, responsive tables, internationalized links,\n * and automatic frontmatter stripping.\n \n @component\n * @example\n * Basic usage:\n * ```tsx\n * const markdownContent = `\n * # Hello World\n * This is bold and italic text.\n * `;\n \n <MarkdownRenderer>{markdownContent}</MarkdownRenderer>\n * ```\n \n @example\n * With dark mode:\n * ```tsx\n * const codeExample = `\n * # API Documentation\n * \\`\\`\\`javascript\n * const response = await fetch('/api/data');\n * const data = await response.json();\n * \\`\\`\\`\n * `;\n \n <MarkdownRenderer isDarkMode={true}>\n * {codeExample}\n * </MarkdownRenderer>\n * ```\n \n @example\n * With internationalized links:\n * ```tsx\n * const content = `\n * Visit our [documentation](/docs) for more information.\n * External link: [Google](https://google.com)\n * `;\n \n <MarkdownRenderer locale=\"fr\">\n * {content}\n * </MarkdownRenderer>\n * ```\n \n @example\n * With custom overrides:\n * ```tsx\n * const customOptions = {\n * overrides: {\n * h1: ({ children }) => (\n * <h1 className=\"custom-title\">{children}</h1>\n * ),\n * },\n * };\n \n <MarkdownRenderer options={customOptions}>\n * {markdownContent}\n * </MarkdownRenderer>\n * ```\n \n @example\n * With frontmatter (automatically stripped):\n * ```tsx\n * const blogPost = `\n * ---\n * title: \"My Blog Post\"\n * date: \"2023-12-01\"\n * author: \"John Doe\"\n * ---\n * # My Blog Post\n * This content will be rendered without the frontmatter.\n * `;\n \n <MarkdownRenderer>{blogPost}</MarkdownRenderer>\n * ```\n \n Features:\n * - Automatic frontmatter detection and removal\n * - Syntax-highlighted code blocks with theme support\n * - Clickable headers with anchor links\n * - Internationalized link handling with locale awareness\n * - Responsive tables with hover effects\n * - Custom blockquote, list, and image styling\n * - External link detection and security attributes\n * - Inline code with distinctive styling\n * - Lazy-loaded images with GitHub raw URL support\n * - Horizontal rules with custom styling\n \n Supported Markdown Elements:\n * - Headers (h1-h4) with click-to-anchor functionality\n * - Code blocks with language-specific syntax highlighting\n * - Inline code with background styling\n * - Blockquotes with custom border and padding\n * - Ordered and unordered lists with custom spacing\n * - Links (internal and external) with security attributes\n * - Images with lazy loading and responsive sizing\n * - Tables with hover effects and proper styling\n * - Horizontal rules with custom appearance\n * - All standard markdown formatting (bold, italic, etc.)\n \n Code Block Support:\n * - Language detection from code fence info\n * - Syntax highlighting through Code component\n * - Dark/light mode theme switching\n * - Line numbers and copy functionality (via Code component)\n * - Support for popular languages (JS, TS, Python, etc.)\n \n Link Handling:\n * - Automatic external link detection (starts with 'http')\n * - Security attributes for external links (rel=\"noopener noreferrer\")\n * - Locale-aware internal link routing\n * - Custom Link component integration\n * - Underlined styling for better visibility\n \n Image Processing:\n * - Automatic lazy loading for performance\n * - GitHub raw URL transformation for repository images\n * - Responsive sizing with max-width constraints\n * - Rounded corners for visual appeal\n \n Accessibility:\n * - Semantic HTML structure with proper heading hierarchy\n * - ARIA attributes through component integration\n * - Screen reader friendly link descriptions\n * - Keyboard navigation support\n * - High contrast styling options\n \n Performance:\n * - Lazy loading for images\n * - Efficient re-rendering with React memo patterns\n * - Code syntax highlighting with minimal bundle impact\n * - Optimized markdown parsing with markdown-to-jsx\n \n @param props - Component props\n * @param props.children - Raw markdown content to render\n * @param props.isDarkMode - Enable dark mode styling for code blocks\n * @param props.locale - Current locale for link internationalization\n * @param props.options - Additional markdown-to-jsx options\n * @param props.options.overrides - Custom component overrides for markdown elements\n \n @returns Rendered markdown content with custom styling and functionality\n */\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n children,\n isDarkMode,\n locale,\n options,\n}) => {\n const { overrides, ...restOptions } = options ?? {};\n\n // Strip frontmatter from the markdown content before rendering\n const cleanMarkdown = stripFrontmatter(children);\n\n return (\n <CodeProvider>\n <TabProvider>\n <MarkdownProcessor\n options={{\n overrides: {\n h1: (props: ComponentProps<typeof H1>) => (\n <H1 isClickable={true} {...props} />\n ),\n h2: (props: ComponentProps<typeof H2>) => (\n <H2 isClickable={true} className=\"mt-16\" {...props} />\n ),\n h3: (props: ComponentProps<typeof H3>) => (\n <H3 isClickable={true} className=\"mt-5\" {...props} />\n ),\n h4: (props: ComponentProps<typeof H4>) => (\n <H4 isClickable={true} className=\"mt-3\" {...props} />\n ),\n h5: (props: ComponentProps<typeof H5>) => (\n <H5 isClickable={true} className=\"mt-3\" {...props} />\n ),\n h6: (props: ComponentProps<typeof H6>) => (\n <H6 isClickable={true} className=\"mt-3\" {...props} />\n ),\n\n code: (\n props: Omit<ComponentPropsWithoutRef<'code'>, 'children'> &\n Partial<CodeCompAttributes> & { children: string }\n ) =>\n !props.className ? (\n <strong className=\"rounded bg-card/60 box-decoration-clone px-1 py-0.5\">\n {props.children}\n </strong>\n ) : (\n <Code\n {...props}\n isDarkMode={isDarkMode}\n language={\n (props.className?.replace('lang-', '') \|\|\n 'plaintext') as BundledLanguage\n }\n fileName={props.fileName}\n showHeader={Boolean(\n props.fileName \|\|\n props.packageManager \|\|\n props.codeFormat \|\|\n props.contentDeclarationFormat\n )}\n />\n ),\n\n blockquote: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'blockquote'>) => (\n <blockquote\n className={cn(\n 'mt-5 gap-3 border-card border-l-4 pl-5 text-neutral',\n className\n )}\n {...props}\n />\n ),\n ul: ({ className, ...props }: ComponentPropsWithoutRef<'ul'>) => (\n <ul\n className={cn(\n 'mt-5 flex list-disc flex-col gap-3 pl-5',\n className\n )}\n {...props}\n />\n ),\n ol: ({ className, ...props }: ComponentPropsWithoutRef<'ol'>) => (\n <ol\n className={cn(\n 'mt-5 flex list-decimal flex-col gap-3 pl-5',\n className\n )}\n {...props}\n />\n ),\n img: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'img'>) => (\n <img\n {...props}\n loading=\"lazy\"\n className={cn(\n 'max-h-[80vh] max-w-full rounded-md',\n className\n )}\n src={`${props.src}?raw=true`}\n />\n ),\n a: (props: ComponentProps<typeof Link>) => (\n <Link\n color=\"neutral\"\n isExternalLink={props.href?.startsWith('http')}\n underlined={true}\n locale={locale}\n {...props}\n />\n ),\n pre: (props: ComponentPropsWithoutRef<'pre'>) => props.children,\n\n table: (props: ComponentProps<typeof Table>) => (\n <Table isRollable={true} {...props} />\n ),\n th: ({ className, ...props }: ComponentPropsWithoutRef<'th'>) => (\n <th\n className={cn(\n 'border-neutral border-b bg-neutral/10 p-4',\n className\n )}\n {...props}\n />\n ),\n tr: ({ className, ...props }: ComponentPropsWithoutRef<'tr'>) => (\n <tr\n className={cn('hover:/10 hover:bg-neutral/10', className)}\n {...props}\n />\n ),\n td: ({ className, ...props }: ComponentPropsWithoutRef<'td'>) => (\n <td\n className={cn(\n 'border-neutral-500/50 border-b p-4',\n className\n )}\n {...props}\n />\n ),\n hr: ({ className, ...props }: ComponentPropsWithoutRef<'hr'>) => (\n <hr\n className={cn('mx-6 mt-16 text-neutral', className)}\n {...props}\n />\n ),\n // Support both <Tab> and <Tabs> in markdown\n Tabs: (props: ComponentProps<typeof Tab>) => <Tab {...props} />,\n Tab: (props: ComponentProps<typeof Tab>) => <Tab {...props} />,\n TabItem: (props: ComponentProps<typeof Tab.Item>) => (\n <Tab.Item {...props} />\n ),\n Columns: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'div'>) => (\n <div\n className={cn('flex gap-4 max-md:flex-col', className)}\n {...props}\n />\n ),\n Column: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'div'>) => (\n <div className={cn('flex-1', className)} {...props} />\n ),\n ...overrides,\n },\n ...restOptions,\n }}\n >\n {cleanMarkdown ?? ''}\n </MarkdownProcessor>\n </TabProvider>\n </CodeProvider>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"MarkDownRender.mjs","names":["MarkdownRenderer: FC<MarkdownRendererProps>"],"sources":["../../../../src/components/MarkDownRender/MarkDownRender.tsx"],"sourcesContent":["import type { LocalesValues } from '@intlayer/types';\nimport { cn } from '@utils/cn';\nimport type { ComponentProps, ComponentPropsWithoutRef, FC } from 'react';\nimport type { BundledLanguage } from 'shiki/bundle/web';\nimport { H1, H2, H3, H4, H5, H6 } from '../Headers';\nimport type { CodeCompAttributes } from '../IDE/Code';\nimport { Code } from '../IDE/Code';\nimport { CodeProvider } from '../IDE/CodeContext';\nimport { Link } from '../Link';\nimport { Tab } from '../Tab';\nimport { TabProvider } from '../Tab/TabContext';\nimport { Table } from '../Table';\nimport { MarkdownProcessor, type MarkdownProcessorOptions } from './processor';\n\ntype MarkdownRendererProps = {\n children: string;\n isDarkMode?: boolean;\n locale?: LocalesValues;\n options?: MarkdownProcessorOptions;\n};\n\n/*\n Removes frontmatter from markdown content\n * Frontmatter is the YAML metadata block at the beginning of markdown files\n * delimited by --- at the start and end\n /\nconst stripFrontmatter = (markdown: string): string => {\n const lines = markdown.split(/\\r?\\n/);\n\n // Check if the very first non-empty line is the metadata start delimiter\n const firstNonEmptyLine = lines.find((line) => line.trim() !== '');\n\n if (!firstNonEmptyLine \|\| firstNonEmptyLine.trim() !== '---') {\n // No frontmatter, return original content\n return markdown;\n }\n\n let inMetadataBlock = false;\n let endOfMetadataIndex = -1;\n\n for (let i = 0; i < lines.length; i++) {\n const trimmedLine = lines[i].trim();\n\n // Toggle metadata block on encountering the delimiter\n if (trimmedLine === '---') {\n if (!inMetadataBlock) {\n // Begin metadata block\n inMetadataBlock = true;\n } else {\n // End of metadata block\n endOfMetadataIndex = i;\n break;\n }\n }\n }\n\n if (endOfMetadataIndex > -1) {\n // Return content after the frontmatter\n return lines.slice(endOfMetadataIndex + 1).join('\\n');\n }\n\n // If we couldn't find the end delimiter, return original content\n return markdown;\n};\n\n/\n MarkdownRenderer Component\n \n A comprehensive markdown renderer that transforms markdown text into rich,\n * interactive HTML with custom styling and Intlayer integration. Supports\n * code syntax highlighting, responsive tables, internationalized links,\n * and automatic frontmatter stripping.\n \n @component\n * @example\n * Basic usage:\n * ```tsx\n * const markdownContent = `\n * # Hello World\n * This is bold and italic text.\n * `;\n \n <MarkdownRenderer>{markdownContent}</MarkdownRenderer>\n * ```\n \n @example\n * With dark mode:\n * ```tsx\n * const codeExample = `\n * # API Documentation\n * \\`\\`\\`javascript\n * const response = await fetch('/api/data');\n * const data = await response.json();\n * \\`\\`\\`\n * `;\n \n <MarkdownRenderer isDarkMode={true}>\n * {codeExample}\n * </MarkdownRenderer>\n * ```\n \n @example\n * With internationalized links:\n * ```tsx\n * const content = `\n * Visit our [documentation](/docs) for more information.\n * External link: [Google](https://google.com)\n * `;\n \n <MarkdownRenderer locale=\"fr\">\n * {content}\n * </MarkdownRenderer>\n * ```\n \n @example\n * With custom overrides:\n * ```tsx\n * const customOptions = {\n * overrides: {\n * h1: ({ children }) => (\n * <h1 className=\"custom-title\">{children}</h1>\n * ),\n * },\n * };\n \n <MarkdownRenderer options={customOptions}>\n * {markdownContent}\n * </MarkdownRenderer>\n * ```\n \n @example\n * With frontmatter (automatically stripped):\n * ```tsx\n * const blogPost = `\n * ---\n * title: \"My Blog Post\"\n * date: \"2023-12-01\"\n * author: \"John Doe\"\n * ---\n * # My Blog Post\n * This content will be rendered without the frontmatter.\n * `;\n \n <MarkdownRenderer>{blogPost}</MarkdownRenderer>\n * ```\n \n Features:\n * - Automatic frontmatter detection and removal\n * - Syntax-highlighted code blocks with theme support\n * - Clickable headers with anchor links\n * - Internationalized link handling with locale awareness\n * - Responsive tables with hover effects\n * - Custom blockquote, list, and image styling\n * - External link detection and security attributes\n * - Inline code with distinctive styling\n * - Lazy-loaded images with GitHub raw URL support\n * - Horizontal rules with custom styling\n \n Supported Markdown Elements:\n * - Headers (h1-h4) with click-to-anchor functionality\n * - Code blocks with language-specific syntax highlighting\n * - Inline code with background styling\n * - Blockquotes with custom border and padding\n * - Ordered and unordered lists with custom spacing\n * - Links (internal and external) with security attributes\n * - Images with lazy loading and responsive sizing\n * - Tables with hover effects and proper styling\n * - Horizontal rules with custom appearance\n * - All standard markdown formatting (bold, italic, etc.)\n \n Code Block Support:\n * - Language detection from code fence info\n * - Syntax highlighting through Code component\n * - Dark/light mode theme switching\n * - Line numbers and copy functionality (via Code component)\n * - Support for popular languages (JS, TS, Python, etc.)\n \n Link Handling:\n * - Automatic external link detection (starts with 'http')\n * - Security attributes for external links (rel=\"noopener noreferrer\")\n * - Locale-aware internal link routing\n * - Custom Link component integration\n * - Underlined styling for better visibility\n \n Image Processing:\n * - Automatic lazy loading for performance\n * - GitHub raw URL transformation for repository images\n * - Responsive sizing with max-width constraints\n * - Rounded corners for visual appeal\n \n Accessibility:\n * - Semantic HTML structure with proper heading hierarchy\n * - ARIA attributes through component integration\n * - Screen reader friendly link descriptions\n * - Keyboard navigation support\n * - High contrast styling options\n \n Performance:\n * - Lazy loading for images\n * - Efficient re-rendering with React memo patterns\n * - Code syntax highlighting with minimal bundle impact\n * - Optimized markdown parsing with markdown-to-jsx\n \n @param props - Component props\n * @param props.children - Raw markdown content to render\n * @param props.isDarkMode - Enable dark mode styling for code blocks\n * @param props.locale - Current locale for link internationalization\n * @param props.options - Additional markdown-to-jsx options\n * @param props.options.overrides - Custom component overrides for markdown elements\n \n @returns Rendered markdown content with custom styling and functionality\n */\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n children,\n isDarkMode,\n locale,\n options,\n}) => {\n const { overrides, ...restOptions } = options ?? {};\n\n // Strip frontmatter from the markdown content before rendering\n const cleanMarkdown = stripFrontmatter(children);\n\n return (\n <CodeProvider>\n <TabProvider>\n <MarkdownProcessor\n options={{\n overrides: {\n h1: (props: ComponentProps<typeof H1>) => (\n <H1 isClickable={true} {...props} />\n ),\n h2: (props: ComponentProps<typeof H2>) => (\n <H2 isClickable={true} className=\"mt-16\" {...props} />\n ),\n h3: (props: ComponentProps<typeof H3>) => (\n <H3 isClickable={true} className=\"mt-5\" {...props} />\n ),\n h4: (props: ComponentProps<typeof H4>) => (\n <H4 isClickable={true} className=\"mt-3\" {...props} />\n ),\n h5: (props: ComponentProps<typeof H5>) => (\n <H5 isClickable={true} className=\"mt-3\" {...props} />\n ),\n h6: (props: ComponentProps<typeof H6>) => (\n <H6 isClickable={true} className=\"mt-3\" {...props} />\n ),\n\n code: (\n props: Omit<ComponentPropsWithoutRef<'code'>, 'children'> &\n Partial<CodeCompAttributes> & { children: string }\n ) =>\n !props.className ? (\n <strong className=\"rounded bg-card/60 box-decoration-clone px-1 py-0.5\">\n {props.children}\n </strong>\n ) : (\n <Code\n {...props}\n isDarkMode={isDarkMode}\n language={\n (props.className?.replace('lang-', '') \|\|\n 'plaintext') as BundledLanguage\n }\n fileName={props.fileName}\n showHeader={Boolean(\n props.fileName \|\|\n props.packageManager \|\|\n props.codeFormat \|\|\n props.contentDeclarationFormat\n )}\n />\n ),\n\n blockquote: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'blockquote'>) => (\n <blockquote\n className={cn(\n 'mt-5 gap-3 border-card border-l-4 pl-5 text-neutral',\n className\n )}\n {...props}\n />\n ),\n ul: ({ className, ...props }: ComponentPropsWithoutRef<'ul'>) => (\n <ul\n className={cn(\n 'mt-5 flex list-disc flex-col gap-3 pl-5',\n className\n )}\n {...props}\n />\n ),\n ol: ({ className, ...props }: ComponentPropsWithoutRef<'ol'>) => (\n <ol\n className={cn(\n 'mt-5 flex list-decimal flex-col gap-3 pl-5',\n className\n )}\n {...props}\n />\n ),\n img: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'img'>) => (\n <img\n {...props}\n loading=\"lazy\"\n className={cn(\n 'max-h-[80vh] max-w-full rounded-md',\n className\n )}\n src={`${props.src}?raw=true`}\n />\n ),\n a: (props: ComponentProps<typeof Link>) => (\n <Link\n color=\"neutral\"\n isExternalLink={props.href?.startsWith('http')}\n underlined={true}\n locale={locale}\n {...props}\n />\n ),\n pre: (props: ComponentPropsWithoutRef<'pre'>) => props.children,\n\n table: (props: ComponentProps<typeof Table>) => (\n <Table isRollable={true} {...props} />\n ),\n th: ({ className, ...props }: ComponentPropsWithoutRef<'th'>) => (\n <th\n className={cn(\n 'border-neutral border-b bg-neutral/10 p-4',\n className\n )}\n {...props}\n />\n ),\n tr: ({ className, ...props }: ComponentPropsWithoutRef<'tr'>) => (\n <tr\n className={cn('hover:/10 hover:bg-neutral/10', className)}\n {...props}\n />\n ),\n td: ({ className, ...props }: ComponentPropsWithoutRef<'td'>) => (\n <td\n className={cn(\n 'border-neutral-500/50 border-b p-4',\n className\n )}\n {...props}\n />\n ),\n hr: ({ className, ...props }: ComponentPropsWithoutRef<'hr'>) => (\n <hr\n className={cn('mx-6 mt-16 text-neutral', className)}\n {...props}\n />\n ),\n // Support both <Tab> and <Tabs> in markdown\n Tabs: (props: ComponentProps<typeof Tab>) => <Tab {...props} />,\n Tab: (props: ComponentProps<typeof Tab>) => <Tab {...props} />,\n TabItem: (props: ComponentProps<typeof Tab.Item>) => (\n <Tab.Item {...props} />\n ),\n Columns: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'div'>) => (\n <div\n className={cn('flex gap-4 max-md:flex-col', className)}\n {...props}\n />\n ),\n Column: ({\n className,\n ...props\n }: ComponentPropsWithoutRef<'div'>) => (\n <div className={cn('flex-1', className)} {...props} />\n ),\n ...overrides,\n },\n ...restOptions,\n }}\n >\n {cleanMarkdown ?? ''}\n </MarkdownProcessor>\n </TabProvider>\n </CodeProvider>\n );\n};\n"],"mappings":"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"}