@intlayer/design-system 8.1.2 → 8.1.3

package/dist/esm/components/Loader/index.content.mjs

@@ -1,33 +1,2 @@
-import { t } from "intlayer";
-
-//#region src/components/Loader/index.content.ts
-const loaderContent = {
-	key: "loader",
-	content: { label: t({
-		en: "Animated icon, meaning that the website is processing",
-		"en-GB": "Animated icon, meaning that the website is processing",
-		fr: "Icône animée, signifiant que le site Web est en cours de traitement",
-		es: "Icono animado, significa que el sitio web está procesando",
-		de: "Animiertes Icon, das heißt, dass die Website in Bearbeitung ist",
-		ja: "アニメーションアイコン、ウェブサイトが処理していることを意味する",
-		ko: "애니메이션 아이콘, 웹 사이트가 처리 중인 의미",
-		zh: "动画图标，意味着网站正在处理",
-		it: "Icona animata, che significa che il sito web è in fase di elaborazione",
-		pt: "Ícone animado, o que significa que o site está processando",
-		hi: "एनिमेटेड आइकन, जो कि वेबसाइट को प्रसंस्करण हो रहा है इसका मतलब है",
-		ar: "رمز متحرك، مما يعني أن الموقع الإلكتروني يتم التحميل",
-		ru: "Анимационный значок, что означает, что сайт обрабатывается",
-		tr: "Web sitesinin işlemde olduğunu belirten animasyonlu simge",
-		pl: "Animowana ikona oznaczająca, że strona przetwarza dane",
-		id: "Ikon animasi yang menunjukkan bahwa situs sedang memproses konten",
-		vi: "Biểu tượng động, biểu thị rằng trang web đang xử lý",
-		uk: "Анімована іконка, що означає, що сайт обробляє дані"
-	}) },
-	title: "Loader component",
-	description: "Content declaration for the loader component, representing an animated icon indicating that the website is processing or loading content.",
-	tags: ["component", "loader"]
-};
-
-//#endregion
-export { loaderContent as default, loaderContent };
+import{t as e}from"intlayer";const t={key:`loader`,content:{label:e({en:`Animated icon, meaning that the website is processing`,"en-GB":`Animated icon, meaning that the website is processing`,fr:`Icône animée, signifiant que le site Web est en cours de traitement`,es:`Icono animado, significa que el sitio web está procesando`,de:`Animiertes Icon, das heißt, dass die Website in Bearbeitung ist`,ja:`アニメーションアイコン、ウェブサイトが処理していることを意味する`,ko:`애니메이션 아이콘, 웹 사이트가 처리 중인 의미`,zh:`动画图标，意味着网站正在处理`,it:`Icona animata, che significa che il sito web è in fase di elaborazione`,pt:`Ícone animado, o que significa que o site está processando`,hi:`एनिमेटेड आइकन, जो कि वेबसाइट को प्रसंस्करण हो रहा है इसका मतलब है`,ar:`رمز متحرك، مما يعني أن الموقع الإلكتروني يتم التحميل`,ru:`Анимационный значок, что означает, что сайт обрабатывается`,tr:`Web sitesinin işlemde olduğunu belirten animasyonlu simge`,pl:`Animowana ikona oznaczająca, że strona przetwarza dane`,id:`Ikon animasi yang menunjukkan bahwa situs sedang memproses konten`,vi:`Biểu tượng động, biểu thị rằng trang web đang xử lý`,uk:`Анімована іконка, що означає, що сайт обробляє дані`})},title:`Loader component`,description:`Content declaration for the loader component, representing an animated icon indicating that the website is processing or loading content.`,tags:[`component`,`loader`]};export{t as default,t as loaderContent};
 //# sourceMappingURL=index.content.mjs.map

package/dist/esm/components/Loader/index.content.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.content.mjs","names":[],"sources":["../../../../src/components/Loader/index.content.ts"],"sourcesContent":["import { type Dictionary, t } from 'intlayer';\n\nexport const loaderContent = {\n  key: 'loader',\n  content: {\n    label: t({\n      en: 'Animated icon, meaning that the website is processing',\n      'en-GB': 'Animated icon, meaning that the website is processing',\n      fr: 'Icône animée, signifiant que le site Web est en cours de traitement',\n      es: 'Icono animado, significa que el sitio web está procesando',\n      de: 'Animiertes Icon, das heißt, dass die Website in Bearbeitung ist',\n      ja: 'アニメーションアイコン、ウェブサイトが処理していることを意味する',\n      ko: '애니메이션 아이콘, 웹 사이트가 처리 중인 의미',\n      zh: '动画图标，意味着网站正在处理',\n      it: 'Icona animata, che significa che il sito web è in fase di elaborazione',\n      pt: 'Ícone animado, o que significa que o site está processando',\n      hi: 'एनिमेटेड आइकन, जो कि वेबसाइट को प्रसंस्करण हो रहा है इसका मतलब है',\n      ar: 'رمز متحرك، مما يعني أن الموقع الإلكتروني يتم التحميل',\n      ru: 'Анимационный значок, что означает, что сайт обрабатывается',\n      tr: 'Web sitesinin işlemde olduğunu belirten animasyonlu simge',\n      pl: 'Animowana ikona oznaczająca, że strona przetwarza dane',\n      id: 'Ikon animasi yang menunjukkan bahwa situs sedang memproses konten',\n      vi: 'Biểu tượng động, biểu thị rằng trang web đang xử lý',\n      uk: 'Анімована іконка, що означає, що сайт обробляє дані',\n    }),\n  },\n  title: 'Loader component',\n  description:\n    'Content declaration for the loader component, representing an animated icon indicating that the website is processing or loading content.',\n  tags: ['component', 'loader'],\n} satisfies Dictionary;\n\nexport default loaderContent;\n"],"mappings":";;;AAEA,MAAa,gBAAgB;CAC3B,KAAK;CACL,SAAS,EACP,OAAO,EAAE;EACP,IAAI;EACJ,SAAS;EACT,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,CAAC,EACH;CACD,OAAO;CACP,aACE;CACF,MAAM,CAAC,aAAa,SAAS;CAC9B"}
+{"version":3,"file":"index.content.mjs","names":[],"sources":["../../../../src/components/Loader/index.content.ts"],"sourcesContent":["import { type Dictionary, t } from 'intlayer';\n\nexport const loaderContent = {\n  key: 'loader',\n  content: {\n    label: t({\n      en: 'Animated icon, meaning that the website is processing',\n      'en-GB': 'Animated icon, meaning that the website is processing',\n      fr: 'Icône animée, signifiant que le site Web est en cours de traitement',\n      es: 'Icono animado, significa que el sitio web está procesando',\n      de: 'Animiertes Icon, das heißt, dass die Website in Bearbeitung ist',\n      ja: 'アニメーションアイコン、ウェブサイトが処理していることを意味する',\n      ko: '애니메이션 아이콘, 웹 사이트가 처리 중인 의미',\n      zh: '动画图标，意味着网站正在处理',\n      it: 'Icona animata, che significa che il sito web è in fase di elaborazione',\n      pt: 'Ícone animado, o que significa que o site está processando',\n      hi: 'एनिमेटेड आइकन, जो कि वेबसाइट को प्रसंस्करण हो रहा है इसका मतलब है',\n      ar: 'رمز متحرك، مما يعني أن الموقع الإلكتروني يتم التحميل',\n      ru: 'Анимационный значок, что означает, что сайт обрабатывается',\n      tr: 'Web sitesinin işlemde olduğunu belirten animasyonlu simge',\n      pl: 'Animowana ikona oznaczająca, że strona przetwarza dane',\n      id: 'Ikon animasi yang menunjukkan bahwa situs sedang memproses konten',\n      vi: 'Biểu tượng động, biểu thị rằng trang web đang xử lý',\n      uk: 'Анімована іконка, що означає, що сайт обробляє дані',\n    }),\n  },\n  title: 'Loader component',\n  description:\n    'Content declaration for the loader component, representing an animated icon indicating that the website is processing or loading content.',\n  tags: ['component', 'loader'],\n} satisfies Dictionary;\n\nexport default loaderContent;\n"],"mappings":"6BAEA,MAAa,EAAgB,CAC3B,IAAK,SACL,QAAS,CACP,MAAO,EAAE,CACP,GAAI,wDACJ,QAAS,wDACT,GAAI,sEACJ,GAAI,4DACJ,GAAI,kEACJ,GAAI,mCACJ,GAAI,6BACJ,GAAI,iBACJ,GAAI,yEACJ,GAAI,6DACJ,GAAI,oEACJ,GAAI,uDACJ,GAAI,6DACJ,GAAI,4DACJ,GAAI,yDACJ,GAAI,oEACJ,GAAI,sDACJ,GAAI,sDACL,CAAC,CACH,CACD,MAAO,mBACP,YACE,4IACF,KAAM,CAAC,YAAa,SAAS,CAC9B"}

package/dist/esm/components/Loader/index.mjs

@@ -1,112 +1,2 @@
-import { cn } from "../../utils/cn.mjs";
-import { Spinner } from "./spinner.mjs";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/Loader/index.tsx
-/**
-* Loader Component
-*
-* A versatile loading component that can function as both a standalone loader
-* and a wrapper for content. When loading is true, displays an animated spinner.
-* When loading is false, renders the wrapped content.
-*
-* @component
-* @example
-* Standalone usage:
-* ```tsx
-* <Loader isLoading={true} />
-* ```
-*
-* @example
-* As a content wrapper:
-* ```tsx
-* <Loader isLoading={isDataLoading}>
-*   <div>Your content here</div>
-* </Loader>
-* ```
-*
-* @example
-* Default behavior (loading = true):
-* ```tsx
-* <Loader />
-* ```
-*
-* @example
-* With custom styling:
-* ```tsx
-* <Loader
-*   isLoading={true}
-*   className="min-h-[200px] bg-gray-50"
-*   aria-label="Loading user data"
-* />
-* ```
-*
-* @example
-* Conditional content loading:
-* ```tsx
-* <Loader isLoading={!data}>
-*   {data && (
-*     <div>
-*       <h2>{data.title}</h2>
-*       <p>{data.content}</p>
-*     </div>
-*   )}
-* </Loader>
-* ```
-*
-* Features:
-* - Dual-mode operation: standalone spinner or content wrapper
-* - Responsive design with flexible sizing
-* - Accessible with proper ARIA attributes and role
-* - Smooth animated spinner using SVG
-* - Customizable styling through className prop
-* - Supports all standard HTML div attributes
-* - Screen constraints (max-height/width) to prevent overflow
-* - Internationalization ready with aria-label support
-*
-* Accessibility:
-* - Uses role="status" for screen reader announcements
-* - Includes descriptive aria-label for the loading state
-* - Maintains focus management when transitioning between states
-* - Supports custom aria-label through props for specific contexts
-* - Compatible with keyboard navigation patterns
-*
-* Performance:
-* - Lightweight SVG spinner with CSS animations
-* - Conditional rendering prevents unnecessary DOM updates
-* - Optimized for frequent loading state changes
-* - No external dependencies beyond internal utilities
-*
-* @param props - Component props extending HTML div attributes
-* @param props.children - Content to display when not loading
-* @param props.isLoading - Loading state control (defaults to true)
-* @param props.className - Additional CSS classes for the loader container
-* @param props.role - ARIA role (defaults to "status")
-* @param props.aria-label - Custom accessibility label
-* @param props.id - Unique identifier for the loader
-* @param props.style - Inline styles object
-* @param props.data-* - Data attributes for testing or tracking
-* @param props...rest - All other standard HTML div attributes
-*
-* @returns A loading spinner when isLoading is true, otherwise renders children
-*/
-const Loader = ({ children, isLoading = true, keepChildren = false, className, ...props }) => /* @__PURE__ */ jsx(Fragment, { children: isLoading && keepChildren ? /* @__PURE__ */ jsxs("div", {
-	className: "relative size-full",
-	children: [/* @__PURE__ */ jsx("div", {
-		className: cn("absolute top-0 left-0 flex size-full max-h-screen max-w-[100vw] flex-1 items-center justify-center", className),
-		role: "status",
-		"aria-label": "Animated icon, meaning that the website is processing",
-		...props,
-		children: /* @__PURE__ */ jsx(Spinner, { className: "size-10 max-h-full max-w-full" })
-	}), children]
-}) : isLoading ? /* @__PURE__ */ jsx("div", {
-	className: cn("flex size-full max-h-screen max-w-[100vw] flex-1 items-center justify-center", className),
-	role: "status",
-	"aria-label": "Animated icon, meaning that the website is processing",
-	...props,
-	children: /* @__PURE__ */ jsx(Spinner, { className: "size-10 max-h-full max-w-full" })
-}) : children ?? /* @__PURE__ */ jsx(Fragment, {}) });
-
-//#endregion
-export { Loader };
+import{cn as e}from"../../utils/cn.mjs";import{Spinner as t}from"./spinner.mjs";import{Fragment as n,jsx as r,jsxs as i}from"react/jsx-runtime";const a=({children:a,isLoading:o=!0,keepChildren:s=!1,className:c,...l})=>r(n,{children:o&&s?i(`div`,{className:`relative size-full`,children:[r(`div`,{className:e(`absolute top-0 left-0 flex size-full max-h-screen max-w-[100vw] flex-1 items-center justify-center`,c),role:`status`,"aria-label":`Animated icon, meaning that the website is processing`,...l,children:r(t,{className:`size-10 max-h-full max-w-full`})}),a]}):o?r(`div`,{className:e(`flex size-full max-h-screen max-w-[100vw] flex-1 items-center justify-center`,c),role:`status`,"aria-label":`Animated icon, meaning that the website is processing`,...l,children:r(t,{className:`size-10 max-h-full max-w-full`})}):a??r(n,{})});export{a as Loader};
 //# sourceMappingURL=index.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"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,MAAa,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"}
+{"version":3,"file":"index.mjs","names":[],"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":"gJAqGA,MAAa,GAA2B,CACtC,WACA,YAAY,GACZ,eAAe,GACf,YACA,GAAG,KAEH,EAAA,EAAA,CAAA,SACG,GAAa,EACZ,EAAC,MAAA,CAAI,UAAU,+BACb,EAAC,MAAA,CACC,UAAW,EACT,qGACA,EACD,CACD,KAAK,SACL,aAAW,wDACX,GAAI,WAEJ,EAAC,EAAA,CAAQ,UAAU,gCAAA,CAAkC,EACjD,CACL,EAAA,EACG,CACJ,EACF,EAAC,MAAA,CACC,UAAW,EACT,+EACA,EACD,CACD,KAAK,SACL,aAAW,wDACX,GAAI,WAEJ,EAAC,EAAA,CAAQ,UAAU,gCAAA,CAAkC,EACjD,CAEL,GAAY,EAAA,EAAA,EAAA,CAAK,CAAA,CAEnB"}

package/dist/esm/components/Loader/spinner.mjs

@@ -1,122 +1,2 @@
-import { cn } from "../../utils/cn.mjs";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/Loader/spinner.tsx
-/**
-* Spinner Component
-*
-* An animated SVG spinner that displays two expanding and fading circles
-* to indicate loading or processing states. Uses smooth CSS animations
-* with spline curves for natural motion.
-*
-* @component
-* @example
-* Basic usage:
-* ```tsx
-* <Spinner />
-* ```
-*
-* @example
-* Custom stroke width:
-* ```tsx
-* <Spinner strokeWidth={6} className="text-blue-500" />
-* ```
-*
-* @example
-* Custom size:
-* ```tsx
-* <Spinner className="size-8 text-red-500" strokeWidth={2} />
-* ```
-*
-* Features:
-* - Smooth expanding circle animation
-* - Customizable stroke width
-* - Inherits text color from parent (currentColor)
-* - Responsive sizing through className
-* - Infinite loop animation
-* - Two-phase animation with offset timing
-* - Optimized SVG with minimal DOM impact
-*
-* Animation Details:
-* - Duration: 1.8 seconds per cycle
-* - Two circles with 0.9s offset
-* - Radius expands from 1 to 20
-* - Opacity fades from 1 to 0
-* - Spline easing for natural motion
-*
-* @param props - SVG props with custom spinner options
-* @param props.className - CSS classes for styling and sizing
-* @param props.strokeWidth - Line thickness for the animated circles
-* @param props.color - SVG color (use className with text-color for easier styling)
-* @param props.width - SVG width (defaults to 44, use className for responsive sizing)
-* @param props.height - SVG height (defaults to 44, use className for responsive sizing)
-* @param props...rest - All other standard SVG element attributes
-*
-* @returns An animated SVG spinner element
-*/
-const Spinner = ({ className, strokeWidth = 4 }) => /* @__PURE__ */ jsx("svg", {
-	xmlns: "http://www.w3.org/2000/svg",
-	width: "44",
-	height: "44",
-	viewBox: "0 0 44 44",
-	stroke: "currentColor",
-	role: "img",
-	"aria-label": "Spinner",
-	className: cn("size-full", className),
-	children: /* @__PURE__ */ jsxs("g", {
-		fill: "none",
-		fillRule: "evenodd",
-		strokeWidth,
-		children: [/* @__PURE__ */ jsxs("circle", {
-			cx: "22",
-			cy: "22",
-			r: "1",
-			children: [/* @__PURE__ */ jsx("animate", {
-				attributeName: "r",
-				begin: "0s",
-				dur: "1.8s",
-				values: "1; 20",
-				calcMode: "spline",
-				keyTimes: "0; 1",
-				keySplines: "0.165, 0.84, 0.44, 1",
-				repeatCount: "indefinite"
-			}), /* @__PURE__ */ jsx("animate", {
-				attributeName: "stroke-opacity",
-				begin: "0s",
-				dur: "1.8s",
-				values: "1; 0",
-				calcMode: "spline",
-				keyTimes: "0; 1",
-				keySplines: "0.3, 0.61, 0.355, 1",
-				repeatCount: "indefinite"
-			})]
-		}), /* @__PURE__ */ jsxs("circle", {
-			cx: "22",
-			cy: "22",
-			r: "1",
-			children: [/* @__PURE__ */ jsx("animate", {
-				attributeName: "r",
-				begin: "-0.9s",
-				dur: "1.8s",
-				values: "1; 20",
-				calcMode: "spline",
-				keyTimes: "0; 1",
-				keySplines: "0.165, 0.84, 0.44, 1",
-				repeatCount: "indefinite"
-			}), /* @__PURE__ */ jsx("animate", {
-				attributeName: "stroke-opacity",
-				begin: "-0.9s",
-				dur: "1.8s",
-				values: "1; 0",
-				calcMode: "spline",
-				keyTimes: "0; 1",
-				keySplines: "0.3, 0.61, 0.355, 1",
-				repeatCount: "indefinite"
-			})]
-		})]
-	})
-});
-
-//#endregion
-export { Spinner };
+import{cn as e}from"../../utils/cn.mjs";import{jsx as t,jsxs as n}from"react/jsx-runtime";const r=({className:r,strokeWidth:i=4})=>t(`svg`,{xmlns:`http://www.w3.org/2000/svg`,width:`44`,height:`44`,viewBox:`0 0 44 44`,stroke:`currentColor`,role:`img`,"aria-label":`Spinner`,className:e(`size-full`,r),children:n(`g`,{fill:`none`,fillRule:`evenodd`,strokeWidth:i,children:[n(`circle`,{cx:`22`,cy:`22`,r:`1`,children:[t(`animate`,{attributeName:`r`,begin:`0s`,dur:`1.8s`,values:`1; 20`,calcMode:`spline`,keyTimes:`0; 1`,keySplines:`0.165, 0.84, 0.44, 1`,repeatCount:`indefinite`}),t(`animate`,{attributeName:`stroke-opacity`,begin:`0s`,dur:`1.8s`,values:`1; 0`,calcMode:`spline`,keyTimes:`0; 1`,keySplines:`0.3, 0.61, 0.355, 1`,repeatCount:`indefinite`})]}),n(`circle`,{cx:`22`,cy:`22`,r:`1`,children:[t(`animate`,{attributeName:`r`,begin:`-0.9s`,dur:`1.8s`,values:`1; 20`,calcMode:`spline`,keyTimes:`0; 1`,keySplines:`0.165, 0.84, 0.44, 1`,repeatCount:`indefinite`}),t(`animate`,{attributeName:`stroke-opacity`,begin:`-0.9s`,dur:`1.8s`,values:`1; 0`,calcMode:`spline`,keyTimes:`0; 1`,keySplines:`0.3, 0.61, 0.355, 1`,repeatCount:`indefinite`})]})]})});export{r as Spinner};
 //# sourceMappingURL=spinner.mjs.map

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

@@ -1 +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"}
+{"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":"0FA+DA,MAAa,GAAW,CAAE,YAAW,cAAc,KACjD,EAAC,MAAA,CACC,MAAM,6BACN,MAAM,KACN,OAAO,KACP,QAAQ,YACR,OAAO,eACP,KAAK,MACL,aAAW,UACX,UAAW,EAAG,YAAa,EAAU,UAErC,EAAC,IAAA,CAAE,KAAK,OAAO,SAAS,UAAuB,wBAC7C,EAAC,SAAA,CAAO,GAAG,KAAK,GAAG,KAAK,EAAE,cACxB,EAAC,UAAA,CACC,cAAc,IACd,MAAM,KACN,IAAI,OACJ,OAAO,QACP,SAAS,SACT,SAAS,OACT,WAAW,uBACX,YAAY,cACZ,CACF,EAAC,UAAA,CACC,cAAc,iBACd,MAAM,KACN,IAAI,OACJ,OAAO,OACP,SAAS,SACT,SAAS,OACT,WAAW,sBACX,YAAY,cACZ,CAAA,EACK,CACT,EAAC,SAAA,CAAO,GAAG,KAAK,GAAG,KAAK,EAAE,cACxB,EAAC,UAAA,CACC,cAAc,IACd,MAAM,QACN,IAAI,OACJ,OAAO,QACP,SAAS,SACT,SAAS,OACT,WAAW,uBACX,YAAY,cACZ,CACF,EAAC,UAAA,CACC,cAAc,iBACd,MAAM,QACN,IAAI,OACJ,OAAO,OACP,SAAS,SACT,SAAS,OACT,WAAW,sBACX,YAAY,cACZ,CAAA,EACK,CAAA,EACP,EACA"}

package/dist/esm/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.mjs

@@ -1,184 +1,2 @@
-'use client';
-
-import { Container } from "../Container/index.mjs";
-import { Button, ButtonColor, ButtonSize, ButtonTextAlign, ButtonVariant } from "../Button/Button.mjs";
-import { Input } from "../Input/Input.mjs";
-import { usePersistedStore } from "../../hooks/usePersistedStore.mjs";
-import { DropDown } from "../DropDown/index.mjs";
-import { SwitchSelector, SwitchSelectorColor, SwitchSelectorSize } from "../SwitchSelector/index.mjs";
-import { useLocaleSwitcherContent } from "./LocaleSwitcherContentContext.mjs";
-import { Check, Globe, MoveVertical } from "lucide-react";
-import { useMemo, useRef, useState } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { getHTMLTextDir, getLocaleName } from "@intlayer/core";
-import { useIntlayer, useLocale } from "react-intlayer";
-import { Locales } from "@intlayer/types";
-import Fuse from "fuse.js";
-
-//#region src/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.tsx
-const DROPDOWN_IDENTIFIER = "locale-switcher-content";
-const LocaleSwitcherContent = ({ panelProps, isMultilingual = true }) => {
-	const { switchTo, searchInput, localeSwitcherLabel, languageListLabel, seeAllLocalesSwitch } = useIntlayer("locale-switcher-content");
-	const inputRef = useRef(null);
-	const { locale } = useLocale();
-	const { availableLocales, selectedLocales, setSelectedLocales } = useLocaleSwitcherContent();
-	const multilingualAvailableLocales = useMemo(() => availableLocales.map((localeEl) => {
-		return {
-			locale: localeEl,
-			englishName: getLocaleName(localeEl, Locales.ENGLISH),
-			currentLocaleName: getLocaleName(localeEl, locale),
-			ownLocaleName: getLocaleName(localeEl)
-		};
-	}), [availableLocales, locale]);
-	const [searchQuery, setSearchQuery] = useState("");
-	const [seeAllLocales, setSeeAllLocales] = usePersistedStore("locale-content-selector-see-all-locales", false);
-	const fuse = useMemo(() => {
-		return new Fuse(multilingualAvailableLocales, {
-			keys: [
-				{
-					name: "ownLocaleName",
-					weight: .4
-				},
-				{
-					name: "englishName",
-					weight: .2
-				},
-				{
-					name: "currentLocaleName",
-					weight: .2
-				},
-				{
-					name: "locale",
-					weight: .2
-				}
-			],
-			threshold: .02
-		});
-	}, [multilingualAvailableLocales]);
-	const results = useMemo(() => {
-		if (!searchQuery) return multilingualAvailableLocales;
-		return fuse.search(searchQuery).map((result) => result.item);
-	}, [
-		searchQuery,
-		multilingualAvailableLocales,
-		fuse
-	]);
-	const handleClickLocale = (localeItem) => {
-		if (isMultilingual) if (selectedLocales.includes(localeItem)) {
-			if (selectedLocales.length > 1) setSelectedLocales((prev) => prev.filter((el) => el !== localeItem));
-		} else setSelectedLocales((prev) => [...prev, localeItem]);
-		else setSelectedLocales([localeItem]);
-	};
-	const handleSeeAllLocales = (value) => {
-		setSeeAllLocales(value);
-		if (value) setSelectedLocales(availableLocales);
-		else setSelectedLocales([locale]);
-	};
-	return /* @__PURE__ */ jsx("div", {
-		className: "rounded-xl border border-text text-text transition-colors",
-		children: /* @__PURE__ */ jsxs(DropDown, {
-			identifier: DROPDOWN_IDENTIFIER,
-			children: [/* @__PURE__ */ jsx(DropDown.Trigger, {
-				identifier: DROPDOWN_IDENTIFIER,
-				label: localeSwitcherLabel.value,
-				className: "p-0!",
-				roundedSize: "3xl",
-				children: /* @__PURE__ */ jsxs("div", {
-					className: "flex w-full items-center justify-between",
-					children: [/* @__PURE__ */ jsx("div", {
-						className: "px-2 py-1",
-						children: /* @__PURE__ */ jsx(Globe, { size: 16 })
-					}), /* @__PURE__ */ jsx(MoveVertical, {
-						className: "self-center",
-						size: 16
-					})]
-				})
-			}), /* @__PURE__ */ jsx(DropDown.Panel, {
-				identifier: DROPDOWN_IDENTIFIER,
-				isOverable: true,
-				isFocusable: true,
-				className: "right-0 left-auto",
-				...panelProps,
-				children: /* @__PURE__ */ jsxs(Container, {
-					className: "max-h-[60vh] min-w-28",
-					separator: "y",
-					role: "listbox",
-					transparency: "xs",
-					border: true,
-					roundedSize: "2xl",
-					borderColor: "text",
-					"aria-label": languageListLabel.value,
-					children: [isMultilingual && /* @__PURE__ */ jsx("div", {
-						className: "m-auto p-2",
-						children: /* @__PURE__ */ jsx(SwitchSelector, {
-							defaultValue: seeAllLocales,
-							onChange: handleSeeAllLocales,
-							color: SwitchSelectorColor.TEXT,
-							size: SwitchSelectorSize.SM,
-							className: "!w-60",
-							choices: [{
-								content: seeAllLocalesSwitch.true.value,
-								value: true
-							}, {
-								content: seeAllLocalesSwitch.false.value,
-								value: false
-							}]
-						})
-					}), !(isMultilingual && seeAllLocales) && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("div", {
-						className: "p-3",
-						children: /* @__PURE__ */ jsx(Input, {
-							type: "search",
-							"aria-label": searchInput.ariaLabel.value,
-							placeholder: searchInput.placeholder.value,
-							onChange: (e) => setSearchQuery(e.target.value),
-							ref: inputRef
-						})
-					}), /* @__PURE__ */ jsx("ol", {
-						className: "divide-y divide-dashed divide-text/20 overflow-y-auto p-1",
-						children: results.map(({ locale: localeItem, currentLocaleName, ownLocaleName }) => /* @__PURE__ */ jsx("li", {
-							className: "px-1.5 py-1",
-							children: /* @__PURE__ */ jsx(Button, {
-								onClick: () => handleClickLocale(localeItem),
-								label: `${switchTo} ${currentLocaleName}`,
-								disabled: !(availableLocales ?? availableLocales).includes(localeItem),
-								isActive: selectedLocales.includes(localeItem),
-								variant: ButtonVariant.HOVERABLE,
-								color: ButtonColor.TEXT,
-								isFullWidth: true,
-								textAlign: ButtonTextAlign.LEFT,
-								size: ButtonSize.SM,
-								children: /* @__PURE__ */ jsxs("div", {
-									className: "flex flex-row items-center justify-between gap-3 px-2 py-1",
-									children: [isMultilingual && /* @__PURE__ */ jsx("div", {
-										className: "w-4",
-										children: selectedLocales.includes(localeItem) && /* @__PURE__ */ jsx(Check, { className: "size-full" })
-									}), /* @__PURE__ */ jsxs("div", {
-										className: "flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1",
-										children: [/* @__PURE__ */ jsxs("div", {
-											className: "flex flex-col text-nowrap",
-											children: [/* @__PURE__ */ jsx("span", {
-												dir: getHTMLTextDir(localeItem),
-												lang: localeItem,
-												children: ownLocaleName
-											}), /* @__PURE__ */ jsx("span", {
-												className: "text-neutral text-xs",
-												children: currentLocaleName
-											})]
-										}), /* @__PURE__ */ jsx("span", {
-											className: "text-neutral text-sm",
-											children: localeItem.toUpperCase()
-										})]
-									})]
-								})
-							})
-						}, localeItem))
-					})] })]
-				})
-			})]
-		})
-	});
-};
-
-//#endregion
-export { LocaleSwitcherContent };
+"use client";import{Container as e}from"../Container/index.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonTextAlign as i,ButtonVariant as a}from"../Button/Button.mjs";import{Input as o}from"../Input/Input.mjs";import{usePersistedStore as s}from"../../hooks/usePersistedStore.mjs";import{DropDown as c}from"../DropDown/index.mjs";import{SwitchSelector as l,SwitchSelectorColor as u,SwitchSelectorSize as d}from"../SwitchSelector/index.mjs";import{useLocaleSwitcherContent as f}from"./LocaleSwitcherContentContext.mjs";import{Check as p,Globe as m,MoveVertical as h}from"lucide-react";import{useMemo as g,useRef as _,useState as v}from"react";import{Fragment as y,jsx as b,jsxs as x}from"react/jsx-runtime";import{useIntlayer as S,useLocale as C}from"react-intlayer";import{getHTMLTextDir as w,getLocaleName as T}from"@intlayer/core/localization";import{Locales as E}from"@intlayer/types";import D from"fuse.js";const O=`locale-switcher-content`,k=({panelProps:k,isMultilingual:A=!0})=>{let{switchTo:j,searchInput:M,localeSwitcherLabel:N,languageListLabel:P,seeAllLocalesSwitch:F}=S(`locale-switcher-content`),I=_(null),{locale:L}=C(),{availableLocales:R,selectedLocales:z,setSelectedLocales:B}=f(),V=g(()=>R.map(e=>({locale:e,englishName:T(e,E.ENGLISH),currentLocaleName:T(e,L),ownLocaleName:T(e)})),[R,L]),[H,U]=v(``),[W,G]=s(`locale-content-selector-see-all-locales`,!1),K=g(()=>new D(V,{keys:[{name:`ownLocaleName`,weight:.4},{name:`englishName`,weight:.2},{name:`currentLocaleName`,weight:.2},{name:`locale`,weight:.2}],threshold:.02}),[V]),q=g(()=>H?K.search(H).map(e=>e.item):V,[H,V,K]),J=e=>{A?z.includes(e)?z.length>1&&B(t=>t.filter(t=>t!==e)):B(t=>[...t,e]):B([e])},Y=e=>{G(e),B(e?R:[L])};return b(`div`,{className:`rounded-xl border border-text text-text transition-colors`,children:x(c,{identifier:O,children:[b(c.Trigger,{identifier:O,label:N.value,className:`p-0!`,roundedSize:`3xl`,children:x(`div`,{className:`flex w-full items-center justify-between`,children:[b(`div`,{className:`px-2 py-1`,children:b(m,{size:16})}),b(h,{className:`self-center`,size:16})]})}),b(c.Panel,{identifier:O,isOverable:!0,isFocusable:!0,className:`right-0 left-auto`,...k,children:x(e,{className:`max-h-[60vh] min-w-28`,separator:`y`,role:`listbox`,transparency:`xs`,border:!0,roundedSize:`2xl`,borderColor:`text`,"aria-label":P.value,children:[A&&b(`div`,{className:`m-auto p-2`,children:b(l,{defaultValue:W,onChange:Y,color:u.TEXT,size:d.SM,className:`!w-60`,choices:[{content:F.true.value,value:!0},{content:F.false.value,value:!1}]})}),!(A&&W)&&x(y,{children:[b(`div`,{className:`p-3`,children:b(o,{type:`search`,"aria-label":M.ariaLabel.value,placeholder:M.placeholder.value,onChange:e=>U(e.target.value),ref:I})}),b(`ol`,{className:`divide-y divide-dashed divide-text/20 overflow-y-auto p-1`,children:q.map(({locale:e,currentLocaleName:o,ownLocaleName:s})=>b(`li`,{className:`px-1.5 py-1`,children:b(t,{onClick:()=>J(e),label:`${j} ${o}`,disabled:!(R??R).includes(e),isActive:z.includes(e),variant:a.HOVERABLE,color:n.TEXT,isFullWidth:!0,textAlign:i.LEFT,size:r.SM,children:x(`div`,{className:`flex flex-row items-center justify-between gap-3 px-2 py-1`,children:[A&&b(`div`,{className:`w-4`,children:z.includes(e)&&b(p,{className:`size-full`})}),x(`div`,{className:`flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1`,children:[x(`div`,{className:`flex flex-col text-nowrap`,children:[b(`span`,{dir:w(e),lang:e,children:s}),b(`span`,{className:`text-neutral text-xs`,children:o})]}),b(`span`,{className:`text-neutral text-sm`,children:e.toUpperCase()})]})]})})},e))})]})]})})]})})};export{k as LocaleSwitcherContent};
 //# sourceMappingURL=LocaleSwitcherContent.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"LocaleSwitcherContent.mjs","names":[],"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=\"xs\"\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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"}
+{"version":3,"file":"LocaleSwitcherContent.mjs","names":[],"sources":["../../../../src/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.tsx"],"sourcesContent":["'use client';\n\nimport { usePersistedStore } from '@hooks/usePersistedStore';\nimport { getHTMLTextDir, getLocaleName } from '@intlayer/core/localization';\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=\"xs\"\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

@@ -1,30 +1,2 @@
-'use client';
-
-import { usePersistedStore } from "../../hooks/usePersistedStore.mjs";
-import { createContext, useContext } from "react";
-import { jsx } from "react/jsx-runtime";
-import { useLocale } from "react-intlayer";
-
-//#region src/components/LocaleSwitcherContentDropDown/LocaleSwitcherContentContext.tsx
-const LocaleSwitcherContentContext = createContext({
-	availableLocales: [],
-	selectedLocales: [],
-	setSelectedLocales: () => {}
-});
-const useLocaleSwitcherContent = () => useContext(LocaleSwitcherContentContext);
-const LocaleSwitcherContentProvider = ({ availableLocales, defaultSelectedLocales, children }) => {
-	const { locale } = useLocale();
-	const [selectedLocales, setSelectedLocales] = usePersistedStore("locale-content-selector-selected-locales", defaultSelectedLocales ?? [locale]);
-	return /* @__PURE__ */ jsx(LocaleSwitcherContentContext, {
-		value: {
-			availableLocales,
-			selectedLocales,
-			setSelectedLocales
-		},
-		children
-	});
-};
-
-//#endregion
-export { LocaleSwitcherContentProvider, useLocaleSwitcherContent };
+"use client";import{usePersistedStore as e}from"../../hooks/usePersistedStore.mjs";import{createContext as t,useContext as n}from"react";import{jsx as r}from"react/jsx-runtime";import{useLocale as i}from"react-intlayer";const a=t({availableLocales:[],selectedLocales:[],setSelectedLocales:()=>{}}),o=()=>n(a),s=({availableLocales:t,defaultSelectedLocales:n,children:o})=>{let{locale:s}=i(),[c,l]=e(`locale-content-selector-selected-locales`,n??[s]);return r(a,{value:{availableLocales:t,selectedLocales:c,setSelectedLocales:l},children:o})};export{s as LocaleSwitcherContentProvider,o as useLocaleSwitcherContent};
 //# sourceMappingURL=LocaleSwitcherContentContext.mjs.map