@intlayer/design-system 8.1.2 → 8.1.3

package/dist/esm/components/IDE/Code.mjs

@@ -1,60 +1,3 @@
-import { cn } from "../../utils/cn.mjs";
-import { Container } from "../Container/index.mjs";
-import { ExpandCollapse } from "../ExpandCollapse/ExpandCollapse.mjs";
-import { CodeBlock } from "./CodeBlockClient.mjs";
-import { CodeConditionalRender } from "./CodeConditionalRenderer.mjs";
-import { CodeFormatSelector } from "./CodeFormatSelector.mjs";
-import { ContentDeclarationFormatSelector } from "./ContentDeclarationFormatSelector.mjs";
-import { CopyCode } from "./CopyCode.mjs";
-import { PackageManagerSelector } from "./PackageManagerSelector.mjs";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/IDE/Code.tsx
-const MIN_HEIGHT = 700;
-const Code = ({ children, language, isDarkMode, showHeader = true, showLineNumbers = true, className, fileName, packageManager, codeFormat, contentDeclarationFormat, isRollable = true, ...props }) => {
-	const code = children?.endsWith("\n") ? children.slice(0, -1) : children;
-	const hadSelectInHeader = packageManager || codeFormat || contentDeclarationFormat;
-	return /* @__PURE__ */ jsx(CodeConditionalRender, {
-		packageManager,
-		codeFormat,
-		contentDeclarationFormat,
-		children: /* @__PURE__ */ jsxs(Container, {
-			className: cn("relative min-w-0 max-w-full text-sm leading-6", showLineNumbers && "with-line-number ml-0", className),
-			transparency: "lg",
-			...props,
-			children: [showHeader && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
-				className: "grid w-full grid-cols-[1fr_auto] items-center justify-between rounded-t-xl bg-card/50 py-1.5 pr-12 pl-4 text-neutral text-xs",
-				children: [/* @__PURE__ */ jsx("span", {
-					className: "truncate",
-					children: fileName ?? language
-				}), /* @__PURE__ */ jsxs("div", {
-					className: "flex items-center gap-2",
-					children: [
-						packageManager && /* @__PURE__ */ jsx(PackageManagerSelector, {}),
-						codeFormat && /* @__PURE__ */ jsx(CodeFormatSelector, {}),
-						contentDeclarationFormat && /* @__PURE__ */ jsx(ContentDeclarationFormatSelector, {})
-					]
-				})]
-			}), /* @__PURE__ */ jsx("div", {
-				className: "sticky top-46 z-20",
-				children: /* @__PURE__ */ jsx("div", {
-					className: cn("absolute right-2 bottom-0 flex h-7 items-center", hadSelectInHeader && "h-11"),
-					children: /* @__PURE__ */ jsx(CopyCode, { code })
-				})
-			})] }), /* @__PURE__ */ jsx(ExpandCollapse, {
-				minHeight: MIN_HEIGHT,
-				isRollable,
-				className: "min-w-0 max-w-full overflow-x-auto p-2",
-				children: /* @__PURE__ */ jsx(CodeBlock, {
-					lang: language,
-					isDarkMode,
-					children: code
-				})
-			})]
-		})
-	});
-};
-
-//#endregion
-export { Code };
+import{cn as e}from"../../utils/cn.mjs";import{Container as t}from"../Container/index.mjs";import{ExpandCollapse as n}from"../ExpandCollapse/ExpandCollapse.mjs";import{CodeBlock as r}from"./CodeBlockClient.mjs";import{CodeConditionalRender as i}from"./CodeConditionalRenderer.mjs";import{CodeFormatSelector as a}from"./CodeFormatSelector.mjs";import{ContentDeclarationFormatSelector as o}from"./ContentDeclarationFormatSelector.mjs";import{CopyCode as s}from"./CopyCode.mjs";import{PackageManagerSelector as c}from"./PackageManagerSelector.mjs";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";const f=({children:f,language:p,isDarkMode:m,showHeader:h=!0,showLineNumbers:g=!0,className:_,fileName:v,packageManager:y,codeFormat:b,contentDeclarationFormat:x,isRollable:S=!0,...C})=>{let w=f?.endsWith(`
+`)?f.slice(0,-1):f,T=y||b||x;return u(i,{packageManager:y,codeFormat:b,contentDeclarationFormat:x,children:d(t,{className:e(`relative min-w-0 max-w-full text-sm leading-6`,g&&`with-line-number ml-0`,_),transparency:`lg`,...C,children:[h&&d(l,{children:[d(`div`,{className:`grid w-full grid-cols-[1fr_auto] items-center justify-between rounded-t-xl bg-card/50 py-1.5 pr-12 pl-4 text-neutral text-xs`,children:[u(`span`,{className:`truncate`,children:v??p}),d(`div`,{className:`flex items-center gap-2`,children:[y&&u(c,{}),b&&u(a,{}),x&&u(o,{})]})]}),u(`div`,{className:`sticky top-46 z-20`,children:u(`div`,{className:e(`absolute right-2 bottom-0 flex h-7 items-center`,T&&`h-11`),children:u(s,{code:w})})})]}),u(n,{minHeight:700,isRollable:S,className:`min-w-0 max-w-full overflow-x-auto p-2`,children:u(r,{lang:p,isDarkMode:m,children:w})})]})})};export{f as Code};
 //# sourceMappingURL=Code.mjs.map

package/dist/esm/components/IDE/Code.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Code.mjs","names":[],"sources":["../../../../src/components/IDE/Code.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport type { FC, HTMLAttributes } from 'react';\nimport type { BundledLanguage } from 'shiki/bundle/web';\nimport { Container } from '../Container';\nimport { ExpandCollapse } from '../ExpandCollapse';\nimport { CodeBlock } from './CodeBlockClient';\nimport { CodeConditionalRender } from './CodeConditionalRenderer';\nimport type {\n  CodeFormat,\n  ContentDeclarationFormat,\n  PackageManager,\n} from './CodeContext';\nimport { CodeFormatSelector } from './CodeFormatSelector';\nimport { ContentDeclarationFormatSelector } from './ContentDeclarationFormatSelector';\nimport { CopyCode } from './CopyCode';\nimport { PackageManagerSelector } from './PackageManagerSelector';\n\nexport type CodeCompAttributes = {\n  fileName?: string;\n  packageManager?: PackageManager;\n  codeFormat?: CodeFormat;\n  contentDeclarationFormat?: ContentDeclarationFormat;\n};\n\ntype CodeCompProps = {\n  children: string;\n  fileName?: string;\n  language: BundledLanguage;\n  isDarkMode?: boolean;\n  showHeader?: boolean;\n  showLineNumbers?: boolean;\n  isRollable?: boolean;\n} & CodeCompAttributes &\n  HTMLAttributes<HTMLDivElement>;\n\nconst MIN_HEIGHT = 700;\n\nexport const Code: FC<CodeCompProps> = ({\n  children,\n  language,\n  isDarkMode,\n  showHeader = true,\n  showLineNumbers = true,\n  className,\n  fileName,\n  packageManager,\n  codeFormat,\n  contentDeclarationFormat,\n  isRollable = true,\n  ...props\n}) => {\n  const code = children?.endsWith('\\n') ? children.slice(0, -1) : children;\n\n  const hadSelectInHeader =\n    packageManager || codeFormat || contentDeclarationFormat;\n\n  return (\n    <CodeConditionalRender\n      packageManager={packageManager}\n      codeFormat={codeFormat}\n      contentDeclarationFormat={contentDeclarationFormat}\n    >\n      <Container\n        className={cn(\n          'relative min-w-0 max-w-full text-sm leading-6',\n          showLineNumbers && 'with-line-number ml-0',\n          className\n        )}\n        transparency=\"lg\"\n        {...props}\n      >\n        {showHeader && (\n          <>\n            <div className=\"grid w-full grid-cols-[1fr_auto] items-center justify-between rounded-t-xl bg-card/50 py-1.5 pr-12 pl-4 text-neutral text-xs\">\n              <span className=\"truncate\">{fileName ?? language}</span>\n              <div className=\"flex items-center gap-2\">\n                {packageManager && <PackageManagerSelector />}\n                {codeFormat && <CodeFormatSelector />}\n                {contentDeclarationFormat && (\n                  <ContentDeclarationFormatSelector />\n                )}\n              </div>\n            </div>\n            <div className=\"sticky top-46 z-20\">\n              <div\n                className={cn(\n                  'absolute right-2 bottom-0 flex h-7 items-center',\n                  hadSelectInHeader && 'h-11'\n                )}\n              >\n                <CopyCode code={code} />\n              </div>\n            </div>\n          </>\n        )}\n        <ExpandCollapse\n          minHeight={MIN_HEIGHT}\n          isRollable={isRollable}\n          className=\"min-w-0 max-w-full overflow-x-auto p-2\"\n        >\n          <CodeBlock lang={language} isDarkMode={isDarkMode}>\n            {code}\n          </CodeBlock>\n        </ExpandCollapse>\n      </Container>\n    </CodeConditionalRender>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAmCA,MAAM,aAAa;AAEnB,MAAa,QAA2B,EACtC,UACA,UACA,YACA,aAAa,MACb,kBAAkB,MAClB,WACA,UACA,gBACA,YACA,0BACA,aAAa,MACb,GAAG,YACC;CACJ,MAAM,OAAO,UAAU,SAAS,KAAK,GAAG,SAAS,MAAM,GAAG,GAAG,GAAG;CAEhE,MAAM,oBACJ,kBAAkB,cAAc;AAElC,QACE,oBAAC;EACiB;EACJ;EACc;YAE1B,qBAAC;GACC,WAAW,GACT,iDACA,mBAAmB,yBACnB,UACD;GACD,cAAa;GACb,GAAI;cAEH,cACC,4CACE,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAK,WAAU;eAAY,YAAY;MAAgB,EACxD,qBAAC;KAAI,WAAU;;MACZ,kBAAkB,oBAAC,2BAAyB;MAC5C,cAAc,oBAAC,uBAAqB;MACpC,4BACC,oBAAC,qCAAmC;;MAElC;KACF,EACN,oBAAC;IAAI,WAAU;cACb,oBAAC;KACC,WAAW,GACT,mDACA,qBAAqB,OACtB;eAED,oBAAC,YAAe,OAAQ;MACpB;KACF,IACL,EAEL,oBAAC;IACC,WAAW;IACC;IACZ,WAAU;cAEV,oBAAC;KAAU,MAAM;KAAsB;eACpC;MACS;KACG;IACP;GACU"}
+{"version":3,"file":"Code.mjs","names":[],"sources":["../../../../src/components/IDE/Code.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport type { FC, HTMLAttributes } from 'react';\nimport type { BundledLanguage } from 'shiki/bundle/web';\nimport { Container } from '../Container';\nimport { ExpandCollapse } from '../ExpandCollapse';\nimport { CodeBlock } from './CodeBlockClient';\nimport { CodeConditionalRender } from './CodeConditionalRenderer';\nimport type {\n  CodeFormat,\n  ContentDeclarationFormat,\n  PackageManager,\n} from './CodeContext';\nimport { CodeFormatSelector } from './CodeFormatSelector';\nimport { ContentDeclarationFormatSelector } from './ContentDeclarationFormatSelector';\nimport { CopyCode } from './CopyCode';\nimport { PackageManagerSelector } from './PackageManagerSelector';\n\nexport type CodeCompAttributes = {\n  fileName?: string;\n  packageManager?: PackageManager;\n  codeFormat?: CodeFormat;\n  contentDeclarationFormat?: ContentDeclarationFormat;\n};\n\ntype CodeCompProps = {\n  children: string;\n  fileName?: string;\n  language: BundledLanguage;\n  isDarkMode?: boolean;\n  showHeader?: boolean;\n  showLineNumbers?: boolean;\n  isRollable?: boolean;\n} & CodeCompAttributes &\n  HTMLAttributes<HTMLDivElement>;\n\nconst MIN_HEIGHT = 700;\n\nexport const Code: FC<CodeCompProps> = ({\n  children,\n  language,\n  isDarkMode,\n  showHeader = true,\n  showLineNumbers = true,\n  className,\n  fileName,\n  packageManager,\n  codeFormat,\n  contentDeclarationFormat,\n  isRollable = true,\n  ...props\n}) => {\n  const code = children?.endsWith('\\n') ? children.slice(0, -1) : children;\n\n  const hadSelectInHeader =\n    packageManager || codeFormat || contentDeclarationFormat;\n\n  return (\n    <CodeConditionalRender\n      packageManager={packageManager}\n      codeFormat={codeFormat}\n      contentDeclarationFormat={contentDeclarationFormat}\n    >\n      <Container\n        className={cn(\n          'relative min-w-0 max-w-full text-sm leading-6',\n          showLineNumbers && 'with-line-number ml-0',\n          className\n        )}\n        transparency=\"lg\"\n        {...props}\n      >\n        {showHeader && (\n          <>\n            <div className=\"grid w-full grid-cols-[1fr_auto] items-center justify-between rounded-t-xl bg-card/50 py-1.5 pr-12 pl-4 text-neutral text-xs\">\n              <span className=\"truncate\">{fileName ?? language}</span>\n              <div className=\"flex items-center gap-2\">\n                {packageManager && <PackageManagerSelector />}\n                {codeFormat && <CodeFormatSelector />}\n                {contentDeclarationFormat && (\n                  <ContentDeclarationFormatSelector />\n                )}\n              </div>\n            </div>\n            <div className=\"sticky top-46 z-20\">\n              <div\n                className={cn(\n                  'absolute right-2 bottom-0 flex h-7 items-center',\n                  hadSelectInHeader && 'h-11'\n                )}\n              >\n                <CopyCode code={code} />\n              </div>\n            </div>\n          </>\n        )}\n        <ExpandCollapse\n          minHeight={MIN_HEIGHT}\n          isRollable={isRollable}\n          className=\"min-w-0 max-w-full overflow-x-auto p-2\"\n        >\n          <CodeBlock lang={language} isDarkMode={isDarkMode}>\n            {code}\n          </CodeBlock>\n        </ExpandCollapse>\n      </Container>\n    </CodeConditionalRender>\n  );\n};\n"],"mappings":"imBAmCA,MAEa,GAA2B,CACtC,WACA,WACA,aACA,aAAa,GACb,kBAAkB,GAClB,YACA,WACA,iBACA,aACA,2BACA,aAAa,GACb,GAAG,KACC,CACJ,IAAM,EAAO,GAAU,SAAS;EAAK,CAAG,EAAS,MAAM,EAAG,GAAG,CAAG,EAE1D,EACJ,GAAkB,GAAc,EAElC,OACE,EAAC,EAAA,CACiB,iBACJ,aACc,oCAE1B,EAAC,EAAA,CACC,UAAW,EACT,gDACA,GAAmB,wBACnB,EACD,CACD,aAAa,KACb,GAAI,YAEH,GACC,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,MAAA,CAAI,UAAU,yIACb,EAAC,OAAA,CAAK,UAAU,oBAAY,GAAY,GAAgB,CACxD,EAAC,MAAA,CAAI,UAAU,oCACZ,GAAkB,EAAC,EAAA,EAAA,CAAyB,CAC5C,GAAc,EAAC,EAAA,EAAA,CAAqB,CACpC,GACC,EAAC,EAAA,EAAA,CAAmC,GAElC,CAAA,EACF,CACN,EAAC,MAAA,CAAI,UAAU,8BACb,EAAC,MAAA,CACC,UAAW,EACT,kDACA,GAAqB,OACtB,UAED,EAAC,EAAA,CAAe,OAAA,CAAQ,EACpB,EACF,CAAA,CAAA,CACL,CAEL,EAAC,EAAA,CACC,UAAW,IACC,aACZ,UAAU,kDAEV,EAAC,EAAA,CAAU,KAAM,EAAsB,sBACpC,GACS,EACG,CAAA,EACP,EACU"}

package/dist/esm/components/IDE/CodeBlockClient.mjs

@@ -1,32 +1,3 @@
-import { cn } from "../../utils/cn.mjs";
-import { Suspense, lazy } from "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/IDE/CodeBlockClient.tsx
-const CodeDefault = ({ children }) => /* @__PURE__ */ jsx("div", {
-	className: "min-w-0 max-w-full overflow-x-auto",
-	children: /* @__PURE__ */ jsx("pre", {
-		className: "min-w-0 max-w-full overflow-x-auto [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
-		children: /* @__PURE__ */ jsx("code", { children: typeof children === "string" ? children.split("\n").map((line, index) => /* @__PURE__ */ jsx("span", {
-			className: "line block w-full",
-			children: line
-		}, `line-${index}-${line.slice(0, 10)}`)) : children })
-	})
-});
-const CodeBlockShiki = lazy(() => import("./CodeBlockShiki.mjs").then((mod) => ({ default: mod.CodeBlockShiki })));
-const CodeBlock = ({ className, onChange, isEditable, children, lang, isDarkMode, ...props }) => /* @__PURE__ */ jsx("div", {
-	className: cn("flex w-full min-w-0 max-w-full overflow-x-auto", className),
-	...props,
-	children: /* @__PURE__ */ jsx(Suspense, {
-		fallback: /* @__PURE__ */ jsx(CodeDefault, { children }),
-		children: /* @__PURE__ */ jsx(CodeBlockShiki, {
-			lang,
-			isDarkMode,
-			children
-		})
-	})
-});
-
-//#endregion
-export { CodeBlock, CodeDefault };
+import{cn as e}from"../../utils/cn.mjs";import{Suspense as t,lazy as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=({children:e})=>r(`div`,{className:`min-w-0 max-w-full overflow-x-auto`,children:r(`pre`,{className:`min-w-0 max-w-full overflow-x-auto [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden`,children:r(`code`,{children:typeof e==`string`?e.split(`
+`).map((e,t)=>r(`span`,{className:`line block w-full`,children:e},`line-${t}-${e.slice(0,10)}`)):e})})}),a=n(()=>import(`./CodeBlockShiki.mjs`).then(e=>({default:e.CodeBlockShiki}))),o=({className:n,onChange:o,isEditable:s,children:c,lang:l,isDarkMode:u,...d})=>r(`div`,{className:e(`flex w-full min-w-0 max-w-full overflow-x-auto`,n),...d,children:r(t,{fallback:r(i,{children:c}),children:r(a,{lang:l,isDarkMode:u,children:c})})});export{o as CodeBlock,i as CodeDefault};
 //# sourceMappingURL=CodeBlockClient.mjs.map

package/dist/esm/components/IDE/CodeBlockClient.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlockClient.mjs","names":[],"sources":["../../../../src/components/IDE/CodeBlockClient.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { type FC, type HTMLAttributes, lazy, Suspense } from 'react';\nimport type { BundledLanguage } from 'shiki/bundle/web';\n\nexport const CodeDefault: FC<{ children: string }> = ({ children }) => (\n  <div className=\"min-w-0 max-w-full overflow-x-auto\">\n    <pre className=\"min-w-0 max-w-full overflow-x-auto [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n      <code>\n        {typeof children === 'string'\n          ? children.split('\\n').map((line, index) => (\n              <span\n                className=\"line block w-full\"\n                key={`line-${index}-${line.slice(0, 10)}`}\n              >\n                {line}\n              </span>\n            ))\n          : children}\n      </code>\n    </pre>\n  </div>\n);\n\n// Lazy load the Shiki component\nconst CodeBlockShiki = lazy(() =>\n  import('./CodeBlockShiki').then((mod) => ({\n    default: mod.CodeBlockShiki,\n  }))\n);\n\nexport type CodeBlockProps = {\n  children: string;\n  lang: BundledLanguage;\n  isDarkMode?: boolean;\n  isEditable?: boolean;\n  onChange?: (content: string) => void;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;\n\nexport const CodeBlock: FC<CodeBlockProps> = ({\n  className,\n  onChange,\n  isEditable,\n  children,\n  lang,\n  isDarkMode,\n  ...props\n}) => (\n  <div\n    className={cn('flex w-full min-w-0 max-w-full overflow-x-auto', className)}\n    {...props}\n  >\n    <Suspense fallback={<CodeDefault>{children}</CodeDefault>}>\n      <CodeBlockShiki lang={lang} isDarkMode={isDarkMode}>\n        {children}\n      </CodeBlockShiki>\n    </Suspense>\n  </div>\n);\n"],"mappings":";;;;;AAIA,MAAa,eAAyC,EAAE,eACtD,oBAAC;CAAI,WAAU;WACb,oBAAC;EAAI,WAAU;YACb,oBAAC,oBACE,OAAO,aAAa,WACjB,SAAS,MAAM,KAAK,CAAC,KAAK,MAAM,UAC9B,oBAAC;GACC,WAAU;aAGT;KAFI,QAAQ,MAAM,GAAG,KAAK,MAAM,GAAG,GAAG,GAGlC,CACP,GACF,WACC;GACH;EACF;AAIR,MAAM,iBAAiB,WACrB,OAAO,wBAAoB,MAAM,SAAS,EACxC,SAAS,IAAI,gBACd,EAAE,CACJ;AAUD,MAAa,aAAiC,EAC5C,WACA,UACA,YACA,UACA,MACA,YACA,GAAG,YAEH,oBAAC;CACC,WAAW,GAAG,kDAAkD,UAAU;CAC1E,GAAI;WAEJ,oBAAC;EAAS,UAAU,oBAAC,eAAa,WAAuB;YACvD,oBAAC;GAAqB;GAAkB;GACrC;IACc;GACR;EACP"}
+{"version":3,"file":"CodeBlockClient.mjs","names":[],"sources":["../../../../src/components/IDE/CodeBlockClient.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { type FC, type HTMLAttributes, lazy, Suspense } from 'react';\nimport type { BundledLanguage } from 'shiki/bundle/web';\n\nexport const CodeDefault: FC<{ children: string }> = ({ children }) => (\n  <div className=\"min-w-0 max-w-full overflow-x-auto\">\n    <pre className=\"min-w-0 max-w-full overflow-x-auto [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n      <code>\n        {typeof children === 'string'\n          ? children.split('\\n').map((line, index) => (\n              <span\n                className=\"line block w-full\"\n                key={`line-${index}-${line.slice(0, 10)}`}\n              >\n                {line}\n              </span>\n            ))\n          : children}\n      </code>\n    </pre>\n  </div>\n);\n\n// Lazy load the Shiki component\nconst CodeBlockShiki = lazy(() =>\n  import('./CodeBlockShiki').then((mod) => ({\n    default: mod.CodeBlockShiki,\n  }))\n);\n\nexport type CodeBlockProps = {\n  children: string;\n  lang: BundledLanguage;\n  isDarkMode?: boolean;\n  isEditable?: boolean;\n  onChange?: (content: string) => void;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;\n\nexport const CodeBlock: FC<CodeBlockProps> = ({\n  className,\n  onChange,\n  isEditable,\n  children,\n  lang,\n  isDarkMode,\n  ...props\n}) => (\n  <div\n    className={cn('flex w-full min-w-0 max-w-full overflow-x-auto', className)}\n    {...props}\n  >\n    <Suspense fallback={<CodeDefault>{children}</CodeDefault>}>\n      <CodeBlockShiki lang={lang} isDarkMode={isDarkMode}>\n        {children}\n      </CodeBlockShiki>\n    </Suspense>\n  </div>\n);\n"],"mappings":"2HAIA,MAAa,GAAyC,CAAE,cACtD,EAAC,MAAA,CAAI,UAAU,8CACb,EAAC,MAAA,CAAI,UAAU,6HACb,EAAC,OAAA,CAAA,SACE,OAAO,GAAa,SACjB,EAAS,MAAM;EAAK,CAAC,KAAK,EAAM,IAC9B,EAAC,OAAA,CACC,UAAU,6BAGT,GAFI,QAAQ,EAAM,GAAG,EAAK,MAAM,EAAG,GAAG,GAGlC,CACP,CACF,EAAA,CACC,EACH,EACF,CAIF,EAAiB,MACrB,OAAO,wBAAoB,KAAM,IAAS,CACxC,QAAS,EAAI,eACd,EAAE,CACJ,CAUY,GAAiC,CAC5C,YACA,WACA,aACA,WACA,OACA,aACA,GAAG,KAEH,EAAC,MAAA,CACC,UAAW,EAAG,iDAAkD,EAAU,CAC1E,GAAI,WAEJ,EAAC,EAAA,CAAS,SAAU,EAAC,EAAA,CAAa,WAAA,CAAuB,UACvD,EAAC,EAAA,CAAqB,OAAkB,aACrC,YACc,EACR,EACP"}

package/dist/esm/components/IDE/CodeBlockServer.mjs

@@ -1,46 +1,3 @@
-import { cn } from "../../utils/cn.mjs";
-import { Suspense } from "react";
-import { jsx } from "react/jsx-runtime";
-import { transformerMetaHighlight, transformerMetaWordHighlight, transformerNotationDiff, transformerNotationErrorLevel, transformerNotationHighlight, transformerNotationWordHighlight } from "@shikijs/transformers";
-import { codeToHtml } from "shiki/bundle/web";
-
-//#region src/components/IDE/CodeBlockServer.tsx
-const CodeBlockShiki = (async ({ children, lang, isDarkMode, onChange, ...props }) => {
-	return /* @__PURE__ */ jsx("div", {
-		dangerouslySetInnerHTML: { __html: await codeToHtml(children, {
-			lang,
-			theme: isDarkMode ? "github-dark" : "github-light",
-			transformers: [
-				transformerNotationDiff(),
-				transformerNotationHighlight(),
-				transformerNotationWordHighlight(),
-				transformerNotationErrorLevel(),
-				transformerMetaHighlight(),
-				transformerMetaWordHighlight()
-			]
-		}) },
-		...props,
-		style: { backgroundColor: "transparent" }
-	});
-});
-const CodeDefault = ({ children, isEditable, isDarkMode, onChange, ...props }) => /* @__PURE__ */ jsx("div", {
-	contentEditable: isEditable,
-	...props,
-	children: /* @__PURE__ */ jsx("pre", { children: /* @__PURE__ */ jsx("code", { children: typeof children === "string" ? children.split("\n").map((line, index) => /* @__PURE__ */ jsx("span", {
-		className: "line block w-full",
-		children: line
-	}, index)) : children }) })
-});
-const CodeBlock = ({ className, onChange, isEditable, ...props }) => /* @__PURE__ */ jsx(Suspense, {
-	fallback: /* @__PURE__ */ jsx(CodeDefault, { ...props }),
-	children: /* @__PURE__ */ jsx(CodeBlockShiki, {
-		className: cn("flex w-full", className),
-		contentEditable: isEditable,
-		onInput: (e) => onChange?.(e.currentTarget.textContent ?? ""),
-		...props
-	})
-});
-
-//#endregion
-export { CodeBlock, CodeBlockShiki };
+import{cn as e}from"../../utils/cn.mjs";import{Suspense as t}from"react";import{jsx as n}from"react/jsx-runtime";import{transformerMetaHighlight as r,transformerMetaWordHighlight as i,transformerNotationDiff as a,transformerNotationErrorLevel as o,transformerNotationHighlight as s,transformerNotationWordHighlight as c}from"@shikijs/transformers";import{codeToHtml as l}from"shiki/bundle/web";const u=(async({children:e,lang:t,isDarkMode:u,onChange:d,...f})=>n(`div`,{dangerouslySetInnerHTML:{__html:await l(e,{lang:t,theme:u?`github-dark`:`github-light`,transformers:[a(),s(),c(),o(),r(),i()]})},...f,style:{backgroundColor:`transparent`}})),d=({children:e,isEditable:t,isDarkMode:r,onChange:i,...a})=>n(`div`,{contentEditable:t,...a,children:n(`pre`,{children:n(`code`,{children:typeof e==`string`?e.split(`
+`).map((e,t)=>n(`span`,{className:`line block w-full`,children:e},t)):e})})}),f=({className:r,onChange:i,isEditable:a,...o})=>n(t,{fallback:n(d,{...o}),children:n(u,{className:e(`flex w-full`,r),contentEditable:a,onInput:e=>i?.(e.currentTarget.textContent??``),...o})});export{f as CodeBlock,u as CodeBlockShiki};
 //# sourceMappingURL=CodeBlockServer.mjs.map

package/dist/esm/components/IDE/CodeBlockServer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlockServer.mjs","names":[],"sources":["../../../../src/components/IDE/CodeBlockServer.tsx"],"sourcesContent":["import {\n  transformerMetaHighlight,\n  transformerMetaWordHighlight,\n  transformerNotationDiff,\n  transformerNotationErrorLevel,\n  transformerNotationHighlight,\n  transformerNotationWordHighlight,\n} from '@shikijs/transformers';\nimport { cn } from '@utils/cn';\nimport { type FC, type HTMLAttributes, Suspense } from 'react';\nimport {\n  type BundledLanguage,\n  type BundledTheme,\n  type CodeToHastOptions,\n  codeToHtml,\n} from 'shiki/bundle/web';\n\nexport const CodeBlockShiki = (async ({\n  children,\n  lang,\n  isDarkMode,\n  onChange,\n  ...props\n}: CodeBlockProps) => {\n  const shikiOptions: CodeToHastOptions<BundledLanguage, BundledTheme> = {\n    lang,\n    theme: isDarkMode ? 'github-dark' : 'github-light',\n    transformers: [\n      transformerNotationDiff(),\n      transformerNotationHighlight(),\n      transformerNotationWordHighlight(),\n      transformerNotationErrorLevel(),\n      transformerMetaHighlight(),\n      transformerMetaWordHighlight(),\n    ],\n  };\n\n  const out = await codeToHtml(children, shikiOptions);\n\n  return (\n    <div\n      dangerouslySetInnerHTML={{ __html: out }}\n      {...props}\n      style={{ backgroundColor: 'transparent' }}\n    />\n  );\n}) as unknown as FC<CodeBlockProps>;\n\nconst CodeDefault: FC<CodeBlockProps> = ({\n  children,\n  isEditable,\n  isDarkMode,\n  onChange,\n  ...props\n}) => (\n  <div contentEditable={isEditable} {...props}>\n    <pre>\n      <code>\n        {typeof children === 'string'\n          ? children.split('\\n').map((line, index) => (\n              <span className=\"line block w-full\" key={index}>\n                {line}\n              </span>\n            ))\n          : children}\n      </code>\n    </pre>\n  </div>\n);\n\nexport type CodeBlockProps = {\n  children: string;\n  lang: BundledLanguage;\n  isDarkMode?: boolean;\n  isEditable?: boolean;\n  onChange?: (content: string) => void;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;\n\nexport const CodeBlock: FC<CodeBlockProps> = ({\n  className,\n  onChange,\n  isEditable,\n  ...props\n}) => (\n  <Suspense fallback={<CodeDefault {...props} />}>\n    <CodeBlockShiki\n      className={cn('flex w-full', className)}\n      contentEditable={isEditable}\n      onInput={(e) => onChange?.(e.currentTarget.textContent ?? '')}\n      {...props}\n    />\n  </Suspense>\n);\n"],"mappings":";;;;;;;AAiBA,MAAa,kBAAkB,OAAO,EACpC,UACA,MACA,YACA,UACA,GAAG,YACiB;AAgBpB,QACE,oBAAC;EACC,yBAAyB,EAAE,QAJnB,MAAM,WAAW,UAb0C;GACrE;GACA,OAAO,aAAa,gBAAgB;GACpC,cAAc;IACZ,yBAAyB;IACzB,8BAA8B;IAC9B,kCAAkC;IAClC,+BAA+B;IAC/B,0BAA0B;IAC1B,8BAA8B;IAC/B;GACF,CAEmD,EAIR;EACxC,GAAI;EACJ,OAAO,EAAE,iBAAiB,eAAe;GACzC;;AAIN,MAAM,eAAmC,EACvC,UACA,YACA,YACA,UACA,GAAG,YAEH,oBAAC;CAAI,iBAAiB;CAAY,GAAI;WACpC,oBAAC,mBACC,oBAAC,oBACE,OAAO,aAAa,WACjB,SAAS,MAAM,KAAK,CAAC,KAAK,MAAM,UAC9B,oBAAC;EAAK,WAAU;YACb;IADsC,MAElC,CACP,GACF,WACC,GACH;EACF;AAWR,MAAa,aAAiC,EAC5C,WACA,UACA,YACA,GAAG,YAEH,oBAAC;CAAS,UAAU,oBAAC,eAAY,GAAI,QAAS;WAC5C,oBAAC;EACC,WAAW,GAAG,eAAe,UAAU;EACvC,iBAAiB;EACjB,UAAU,MAAM,WAAW,EAAE,cAAc,eAAe,GAAG;EAC7D,GAAI;GACJ;EACO"}
+{"version":3,"file":"CodeBlockServer.mjs","names":[],"sources":["../../../../src/components/IDE/CodeBlockServer.tsx"],"sourcesContent":["import {\n  transformerMetaHighlight,\n  transformerMetaWordHighlight,\n  transformerNotationDiff,\n  transformerNotationErrorLevel,\n  transformerNotationHighlight,\n  transformerNotationWordHighlight,\n} from '@shikijs/transformers';\nimport { cn } from '@utils/cn';\nimport { type FC, type HTMLAttributes, Suspense } from 'react';\nimport {\n  type BundledLanguage,\n  type BundledTheme,\n  type CodeToHastOptions,\n  codeToHtml,\n} from 'shiki/bundle/web';\n\nexport const CodeBlockShiki = (async ({\n  children,\n  lang,\n  isDarkMode,\n  onChange,\n  ...props\n}: CodeBlockProps) => {\n  const shikiOptions: CodeToHastOptions<BundledLanguage, BundledTheme> = {\n    lang,\n    theme: isDarkMode ? 'github-dark' : 'github-light',\n    transformers: [\n      transformerNotationDiff(),\n      transformerNotationHighlight(),\n      transformerNotationWordHighlight(),\n      transformerNotationErrorLevel(),\n      transformerMetaHighlight(),\n      transformerMetaWordHighlight(),\n    ],\n  };\n\n  const out = await codeToHtml(children, shikiOptions);\n\n  return (\n    <div\n      dangerouslySetInnerHTML={{ __html: out }}\n      {...props}\n      style={{ backgroundColor: 'transparent' }}\n    />\n  );\n}) as unknown as FC<CodeBlockProps>;\n\nconst CodeDefault: FC<CodeBlockProps> = ({\n  children,\n  isEditable,\n  isDarkMode,\n  onChange,\n  ...props\n}) => (\n  <div contentEditable={isEditable} {...props}>\n    <pre>\n      <code>\n        {typeof children === 'string'\n          ? children.split('\\n').map((line, index) => (\n              <span className=\"line block w-full\" key={index}>\n                {line}\n              </span>\n            ))\n          : children}\n      </code>\n    </pre>\n  </div>\n);\n\nexport type CodeBlockProps = {\n  children: string;\n  lang: BundledLanguage;\n  isDarkMode?: boolean;\n  isEditable?: boolean;\n  onChange?: (content: string) => void;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;\n\nexport const CodeBlock: FC<CodeBlockProps> = ({\n  className,\n  onChange,\n  isEditable,\n  ...props\n}) => (\n  <Suspense fallback={<CodeDefault {...props} />}>\n    <CodeBlockShiki\n      className={cn('flex w-full', className)}\n      contentEditable={isEditable}\n      onInput={(e) => onChange?.(e.currentTarget.textContent ?? '')}\n      {...props}\n    />\n  </Suspense>\n);\n"],"mappings":"0YAiBA,MAAa,GAAkB,MAAO,CACpC,WACA,OACA,aACA,WACA,GAAG,KAkBD,EAAC,MAAA,CACC,wBAAyB,CAAE,OAJnB,MAAM,EAAW,EAb0C,CACrE,OACA,MAAO,EAAa,cAAgB,eACpC,aAAc,CACZ,GAAyB,CACzB,GAA8B,CAC9B,GAAkC,CAClC,GAA+B,CAC/B,GAA0B,CAC1B,GAA8B,CAC/B,CACF,CAEmD,CAIR,CACxC,GAAI,EACJ,MAAO,CAAE,gBAAiB,cAAe,EACzC,EAIA,GAAmC,CACvC,WACA,aACA,aACA,WACA,GAAG,KAEH,EAAC,MAAA,CAAI,gBAAiB,EAAY,GAAI,WACpC,EAAC,MAAA,CAAA,SACC,EAAC,OAAA,CAAA,SACE,OAAO,GAAa,SACjB,EAAS,MAAM;EAAK,CAAC,KAAK,EAAM,IAC9B,EAAC,OAAA,CAAK,UAAU,6BACb,GADsC,EAElC,CACP,CACF,EAAA,CACC,CAAA,CACH,EACF,CAWK,GAAiC,CAC5C,YACA,WACA,aACA,GAAG,KAEH,EAAC,EAAA,CAAS,SAAU,EAAC,EAAA,CAAY,GAAI,EAAA,CAAS,UAC5C,EAAC,EAAA,CACC,UAAW,EAAG,cAAe,EAAU,CACvC,gBAAiB,EACjB,QAAU,GAAM,IAAW,EAAE,cAAc,aAAe,GAAG,CAC7D,GAAI,GACJ,EACO"}

package/dist/esm/components/IDE/CodeBlockShiki.mjs

@@ -1,110 +1,2 @@
-'use client';
-
-import { CodeDefault } from "./CodeBlockClient.mjs";
-import { useEffect, useState } from "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/IDE/CodeBlockShiki.tsx
-const languageCache = /* @__PURE__ */ new Map();
-const themeCache = /* @__PURE__ */ new Map();
-const loadLanguage = async (lang) => {
-	if (languageCache.has(lang)) return languageCache.get(lang);
-	let languageModule;
-	switch (lang) {
-		case "typescript":
-		case "ts":
-			languageModule = await import("shiki/langs/typescript.mjs");
-			break;
-		case "javascript":
-		case "js":
-			languageModule = await import("shiki/langs/javascript.mjs");
-			break;
-		case "bash":
-		case "sh":
-		case "shell":
-			languageModule = await import("shiki/langs/bash.mjs");
-			break;
-		case "json":
-			languageModule = await import("shiki/langs/json.mjs");
-			break;
-		case "tsx":
-			languageModule = await import("shiki/langs/tsx.mjs");
-			break;
-		case "vue":
-			languageModule = await import("shiki/langs/vue.mjs");
-			break;
-		case "html":
-			languageModule = await import("shiki/langs/html.mjs");
-			break;
-		default:
-			languageModule = await import("shiki/langs/typescript.mjs");
-			break;
-	}
-	const language = languageModule.default;
-	languageCache.set(lang, language);
-	return language;
-};
-const loadTheme = async (themeName) => {
-	if (themeCache.has(themeName)) return themeCache.get(themeName);
-	let themeModule;
-	switch (themeName) {
-		case "github-dark":
-			themeModule = await import("shiki/themes/github-dark.mjs");
-			break;
-		case "github-light":
-			themeModule = await import("shiki/themes/github-light.mjs");
-			break;
-		default:
-			themeModule = await import("shiki/themes/github-light.mjs");
-			break;
-	}
-	const theme = themeModule.default;
-	themeCache.set(themeName, theme);
-	return theme;
-};
-const highlightCode = async (code, lang, isDarkMode) => {
-	const themeName = isDarkMode ? "github-dark" : "github-light";
-	const [{ codeToHtml }, languageModule, themeModule] = await Promise.all([
-		import("shiki/bundle/web"),
-		loadLanguage(lang),
-		loadTheme(themeName)
-	]);
-	return codeToHtml(code, {
-		lang,
-		theme: themeModule,
-		langs: [languageModule]
-	});
-};
-const CodeBlockShiki = ({ children, lang, isDarkMode }) => {
-	const [html, setHtml] = useState(null);
-	useEffect(() => {
-		let isCancelled = false;
-		setHtml(null);
-		highlightCode(children, lang, isDarkMode).then((result) => {
-			if (!isCancelled) setHtml(result);
-		}).catch(() => {
-			if (!isCancelled) setHtml("");
-		});
-		return () => {
-			isCancelled = true;
-		};
-	}, [
-		children,
-		lang,
-		isDarkMode
-	]);
-	return /* @__PURE__ */ jsx("div", {
-		className: "min-w-0 max-w-full overflow-auto bg-transparent [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&_pre::-webkit-scrollbar]:hidden [&_pre]:[-ms-overflow-style:none] [&_pre]:[scrollbar-width:none]",
-		style: {
-			backgroundColor: "transparent",
-			minWidth: 0,
-			maxWidth: "100%",
-			overflow: "auto"
-		},
-		children: html ? /* @__PURE__ */ jsx("div", { dangerouslySetInnerHTML: { __html: html } }) : /* @__PURE__ */ jsx(CodeDefault, { children })
-	});
-};
-
-//#endregion
-export { CodeBlockShiki };
+"use client";import{CodeDefault as e}from"./CodeBlockClient.mjs";import{useEffect as t,useState as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=new Map,a=new Map,o=async e=>{if(i.has(e))return i.get(e);let t;switch(e){case`typescript`:case`ts`:t=await import(`shiki/langs/typescript.mjs`);break;case`javascript`:case`js`:t=await import(`shiki/langs/javascript.mjs`);break;case`bash`:case`sh`:case`shell`:t=await import(`shiki/langs/bash.mjs`);break;case`json`:t=await import(`shiki/langs/json.mjs`);break;case`tsx`:t=await import(`shiki/langs/tsx.mjs`);break;case`vue`:t=await import(`shiki/langs/vue.mjs`);break;case`html`:t=await import(`shiki/langs/html.mjs`);break;default:t=await import(`shiki/langs/typescript.mjs`);break}let n=t.default;return i.set(e,n),n},s=async e=>{if(a.has(e))return a.get(e);let t;switch(e){case`github-dark`:t=await import(`shiki/themes/github-dark.mjs`);break;case`github-light`:t=await import(`shiki/themes/github-light.mjs`);break;default:t=await import(`shiki/themes/github-light.mjs`);break}let n=t.default;return a.set(e,n),n},c=async(e,t,n)=>{let r=n?`github-dark`:`github-light`,[{codeToHtml:i},a,c]=await Promise.all([import(`shiki/bundle/web`),o(t),s(r)]);return i(e,{lang:t,theme:c,langs:[a]})},l=({children:i,lang:a,isDarkMode:o})=>{let[s,l]=n(null);return t(()=>{let e=!1;return l(null),c(i,a,o).then(t=>{e||l(t)}).catch(()=>{e||l(``)}),()=>{e=!0}},[i,a,o]),r(`div`,{className:`min-w-0 max-w-full overflow-auto bg-transparent [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&_pre::-webkit-scrollbar]:hidden [&_pre]:[-ms-overflow-style:none] [&_pre]:[scrollbar-width:none]`,style:{backgroundColor:`transparent`,minWidth:0,maxWidth:`100%`,overflow:`auto`},children:s?r(`div`,{dangerouslySetInnerHTML:{__html:s}}):r(e,{children:i})})};export{l as CodeBlockShiki};
 //# sourceMappingURL=CodeBlockShiki.mjs.map

package/dist/esm/components/IDE/CodeBlockShiki.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlockShiki.mjs","names":[],"sources":["../../../../src/components/IDE/CodeBlockShiki.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, useEffect, useState } from 'react';\nimport type {\n  BundledLanguage,\n  BundledTheme,\n  CodeToHastOptions,\n} from 'shiki/bundle/web';\nimport { CodeDefault } from './CodeBlockClient';\n\n// Map of loaded modules to avoid re-importing\nconst languageCache = new Map<BundledLanguage, any>();\nconst themeCache = new Map<BundledTheme, any>();\n\n// Lazy load language modules\nconst loadLanguage = async (lang: BundledLanguage): Promise<any> => {\n  if (languageCache.has(lang)) {\n    return languageCache.get(lang);\n  }\n\n  let languageModule: any;\n\n  switch (lang) {\n    case 'typescript':\n    case 'ts':\n      languageModule = await import('shiki/langs/typescript.mjs');\n      break;\n    case 'javascript':\n    case 'js':\n      languageModule = await import('shiki/langs/javascript.mjs');\n      break;\n    case 'bash':\n    case 'sh':\n    case 'shell':\n      languageModule = await import('shiki/langs/bash.mjs');\n      break;\n    case 'json':\n      languageModule = await import('shiki/langs/json.mjs');\n      break;\n    case 'tsx':\n      languageModule = await import('shiki/langs/tsx.mjs');\n      break;\n    case 'vue':\n      languageModule = await import('shiki/langs/vue.mjs');\n      break;\n    case 'html':\n      languageModule = await import('shiki/langs/html.mjs');\n      break;\n    default:\n      // Fallback to typescript for unknown languages\n      languageModule = await import('shiki/langs/typescript.mjs');\n      break;\n  }\n\n  const language = languageModule.default;\n  languageCache.set(lang, language);\n  return language;\n};\n\n// Lazy load theme modules\nconst loadTheme = async (themeName: BundledTheme): Promise<any> => {\n  if (themeCache.has(themeName)) {\n    return themeCache.get(themeName);\n  }\n\n  let themeModule: any;\n\n  switch (themeName) {\n    case 'github-dark':\n      themeModule = await import('shiki/themes/github-dark.mjs');\n      break;\n    case 'github-light':\n      themeModule = await import('shiki/themes/github-light.mjs');\n      break;\n    default:\n      themeModule = await import('shiki/themes/github-light.mjs');\n      break;\n  }\n\n  const theme = themeModule.default;\n  themeCache.set(themeName, theme);\n  return theme;\n};\n\n// Create a promise for highlighting\nconst highlightCode = async (\n  code: string,\n  lang: BundledLanguage,\n  isDarkMode?: boolean\n): Promise<string> => {\n  const themeName: BundledTheme = isDarkMode ? 'github-dark' : 'github-light';\n\n  // Lazy load shiki, language, and theme in parallel\n  const [{ codeToHtml }, languageModule, themeModule] = await Promise.all([\n    import('shiki/bundle/web'),\n    loadLanguage(lang),\n    loadTheme(themeName),\n  ]);\n\n  const shikiOptions: CodeToHastOptions<BundledLanguage, BundledTheme> = {\n    lang,\n    theme: themeModule,\n  };\n\n  return codeToHtml(code, {\n    ...shikiOptions,\n    langs: [languageModule],\n  } as any);\n};\n\nexport type CodeBlockShikiProps = {\n  children: string;\n  lang: BundledLanguage;\n  isDarkMode?: boolean;\n};\n\nexport const CodeBlockShiki: FC<CodeBlockShikiProps> = ({\n  children,\n  lang,\n  isDarkMode,\n}) => {\n  const [html, setHtml] = useState<string | null>(null);\n\n  useEffect(() => {\n    let isCancelled = false;\n\n    setHtml(null);\n\n    highlightCode(children, lang, isDarkMode)\n      .then((result) => {\n        if (!isCancelled) setHtml(result);\n      })\n      .catch(() => {\n        if (!isCancelled) setHtml('');\n      });\n\n    return () => {\n      isCancelled = true;\n    };\n  }, [children, lang, isDarkMode]);\n\n  return (\n    <div\n      className=\"min-w-0 max-w-full overflow-auto bg-transparent [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&_pre::-webkit-scrollbar]:hidden [&_pre]:[-ms-overflow-style:none] [&_pre]:[scrollbar-width:none]\"\n      style={{\n        backgroundColor: 'transparent',\n        minWidth: 0,\n        maxWidth: '100%',\n        overflow: 'auto',\n      }}\n    >\n      {html ? (\n        // biome-ignore lint/security/noDangerouslySetInnerHtml: Shiki generates safe HTML for code highlighting\n        <div dangerouslySetInnerHTML={{ __html: html }} />\n      ) : (\n        <CodeDefault>{children}</CodeDefault>\n      )}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;AAWA,MAAM,gCAAgB,IAAI,KAA2B;AACrD,MAAM,6BAAa,IAAI,KAAwB;AAG/C,MAAM,eAAe,OAAO,SAAwC;AAClE,KAAI,cAAc,IAAI,KAAK,CACzB,QAAO,cAAc,IAAI,KAAK;CAGhC,IAAI;AAEJ,SAAQ,MAAR;EACE,KAAK;EACL,KAAK;AACH,oBAAiB,MAAM,OAAO;AAC9B;EACF,KAAK;EACL,KAAK;AACH,oBAAiB,MAAM,OAAO;AAC9B;EACF,KAAK;EACL,KAAK;EACL,KAAK;AACH,oBAAiB,MAAM,OAAO;AAC9B;EACF,KAAK;AACH,oBAAiB,MAAM,OAAO;AAC9B;EACF,KAAK;AACH,oBAAiB,MAAM,OAAO;AAC9B;EACF,KAAK;AACH,oBAAiB,MAAM,OAAO;AAC9B;EACF,KAAK;AACH,oBAAiB,MAAM,OAAO;AAC9B;EACF;AAEE,oBAAiB,MAAM,OAAO;AAC9B;;CAGJ,MAAM,WAAW,eAAe;AAChC,eAAc,IAAI,MAAM,SAAS;AACjC,QAAO;;AAIT,MAAM,YAAY,OAAO,cAA0C;AACjE,KAAI,WAAW,IAAI,UAAU,CAC3B,QAAO,WAAW,IAAI,UAAU;CAGlC,IAAI;AAEJ,SAAQ,WAAR;EACE,KAAK;AACH,iBAAc,MAAM,OAAO;AAC3B;EACF,KAAK;AACH,iBAAc,MAAM,OAAO;AAC3B;EACF;AACE,iBAAc,MAAM,OAAO;AAC3B;;CAGJ,MAAM,QAAQ,YAAY;AAC1B,YAAW,IAAI,WAAW,MAAM;AAChC,QAAO;;AAIT,MAAM,gBAAgB,OACpB,MACA,MACA,eACoB;CACpB,MAAM,YAA0B,aAAa,gBAAgB;CAG7D,MAAM,CAAC,EAAE,cAAc,gBAAgB,eAAe,MAAM,QAAQ,IAAI;EACtE,OAAO;EACP,aAAa,KAAK;EAClB,UAAU,UAAU;EACrB,CAAC;AAOF,QAAO,WAAW,MAAM;EAJtB;EACA,OAAO;EAKP,OAAO,CAAC,eAAe;EACxB,CAAQ;;AASX,MAAa,kBAA2C,EACtD,UACA,MACA,iBACI;CACJ,MAAM,CAAC,MAAM,WAAW,SAAwB,KAAK;AAErD,iBAAgB;EACd,IAAI,cAAc;AAElB,UAAQ,KAAK;AAEb,gBAAc,UAAU,MAAM,WAAW,CACtC,MAAM,WAAW;AAChB,OAAI,CAAC,YAAa,SAAQ,OAAO;IACjC,CACD,YAAY;AACX,OAAI,CAAC,YAAa,SAAQ,GAAG;IAC7B;AAEJ,eAAa;AACX,iBAAc;;IAEf;EAAC;EAAU;EAAM;EAAW,CAAC;AAEhC,QACE,oBAAC;EACC,WAAU;EACV,OAAO;GACL,iBAAiB;GACjB,UAAU;GACV,UAAU;GACV,UAAU;GACX;YAEA,OAEC,oBAAC,SAAI,yBAAyB,EAAE,QAAQ,MAAM,GAAI,GAElD,oBAAC,eAAa,WAAuB;GAEnC"}
+{"version":3,"file":"CodeBlockShiki.mjs","names":[],"sources":["../../../../src/components/IDE/CodeBlockShiki.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, useEffect, useState } from 'react';\nimport type {\n  BundledLanguage,\n  BundledTheme,\n  CodeToHastOptions,\n} from 'shiki/bundle/web';\nimport { CodeDefault } from './CodeBlockClient';\n\n// Map of loaded modules to avoid re-importing\nconst languageCache = new Map<BundledLanguage, any>();\nconst themeCache = new Map<BundledTheme, any>();\n\n// Lazy load language modules\nconst loadLanguage = async (lang: BundledLanguage): Promise<any> => {\n  if (languageCache.has(lang)) {\n    return languageCache.get(lang);\n  }\n\n  let languageModule: any;\n\n  switch (lang) {\n    case 'typescript':\n    case 'ts':\n      languageModule = await import('shiki/langs/typescript.mjs');\n      break;\n    case 'javascript':\n    case 'js':\n      languageModule = await import('shiki/langs/javascript.mjs');\n      break;\n    case 'bash':\n    case 'sh':\n    case 'shell':\n      languageModule = await import('shiki/langs/bash.mjs');\n      break;\n    case 'json':\n      languageModule = await import('shiki/langs/json.mjs');\n      break;\n    case 'tsx':\n      languageModule = await import('shiki/langs/tsx.mjs');\n      break;\n    case 'vue':\n      languageModule = await import('shiki/langs/vue.mjs');\n      break;\n    case 'html':\n      languageModule = await import('shiki/langs/html.mjs');\n      break;\n    default:\n      // Fallback to typescript for unknown languages\n      languageModule = await import('shiki/langs/typescript.mjs');\n      break;\n  }\n\n  const language = languageModule.default;\n  languageCache.set(lang, language);\n  return language;\n};\n\n// Lazy load theme modules\nconst loadTheme = async (themeName: BundledTheme): Promise<any> => {\n  if (themeCache.has(themeName)) {\n    return themeCache.get(themeName);\n  }\n\n  let themeModule: any;\n\n  switch (themeName) {\n    case 'github-dark':\n      themeModule = await import('shiki/themes/github-dark.mjs');\n      break;\n    case 'github-light':\n      themeModule = await import('shiki/themes/github-light.mjs');\n      break;\n    default:\n      themeModule = await import('shiki/themes/github-light.mjs');\n      break;\n  }\n\n  const theme = themeModule.default;\n  themeCache.set(themeName, theme);\n  return theme;\n};\n\n// Create a promise for highlighting\nconst highlightCode = async (\n  code: string,\n  lang: BundledLanguage,\n  isDarkMode?: boolean\n): Promise<string> => {\n  const themeName: BundledTheme = isDarkMode ? 'github-dark' : 'github-light';\n\n  // Lazy load shiki, language, and theme in parallel\n  const [{ codeToHtml }, languageModule, themeModule] = await Promise.all([\n    import('shiki/bundle/web'),\n    loadLanguage(lang),\n    loadTheme(themeName),\n  ]);\n\n  const shikiOptions: CodeToHastOptions<BundledLanguage, BundledTheme> = {\n    lang,\n    theme: themeModule,\n  };\n\n  return codeToHtml(code, {\n    ...shikiOptions,\n    langs: [languageModule],\n  } as any);\n};\n\nexport type CodeBlockShikiProps = {\n  children: string;\n  lang: BundledLanguage;\n  isDarkMode?: boolean;\n};\n\nexport const CodeBlockShiki: FC<CodeBlockShikiProps> = ({\n  children,\n  lang,\n  isDarkMode,\n}) => {\n  const [html, setHtml] = useState<string | null>(null);\n\n  useEffect(() => {\n    let isCancelled = false;\n\n    setHtml(null);\n\n    highlightCode(children, lang, isDarkMode)\n      .then((result) => {\n        if (!isCancelled) setHtml(result);\n      })\n      .catch(() => {\n        if (!isCancelled) setHtml('');\n      });\n\n    return () => {\n      isCancelled = true;\n    };\n  }, [children, lang, isDarkMode]);\n\n  return (\n    <div\n      className=\"min-w-0 max-w-full overflow-auto bg-transparent [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&_pre::-webkit-scrollbar]:hidden [&_pre]:[-ms-overflow-style:none] [&_pre]:[scrollbar-width:none]\"\n      style={{\n        backgroundColor: 'transparent',\n        minWidth: 0,\n        maxWidth: '100%',\n        overflow: 'auto',\n      }}\n    >\n      {html ? (\n        // biome-ignore lint/security/noDangerouslySetInnerHtml: Shiki generates safe HTML for code highlighting\n        <div dangerouslySetInnerHTML={{ __html: html }} />\n      ) : (\n        <CodeDefault>{children}</CodeDefault>\n      )}\n    </div>\n  );\n};\n"],"mappings":"yJAWA,MAAM,EAAgB,IAAI,IACpB,EAAa,IAAI,IAGjB,EAAe,KAAO,IAAwC,CAClE,GAAI,EAAc,IAAI,EAAK,CACzB,OAAO,EAAc,IAAI,EAAK,CAGhC,IAAI,EAEJ,OAAQ,EAAR,CACE,IAAK,aACL,IAAK,KACH,EAAiB,MAAM,OAAO,8BAC9B,MACF,IAAK,aACL,IAAK,KACH,EAAiB,MAAM,OAAO,8BAC9B,MACF,IAAK,OACL,IAAK,KACL,IAAK,QACH,EAAiB,MAAM,OAAO,wBAC9B,MACF,IAAK,OACH,EAAiB,MAAM,OAAO,wBAC9B,MACF,IAAK,MACH,EAAiB,MAAM,OAAO,uBAC9B,MACF,IAAK,MACH,EAAiB,MAAM,OAAO,uBAC9B,MACF,IAAK,OACH,EAAiB,MAAM,OAAO,wBAC9B,MACF,QAEE,EAAiB,MAAM,OAAO,8BAC9B,MAGJ,IAAM,EAAW,EAAe,QAEhC,OADA,EAAc,IAAI,EAAM,EAAS,CAC1B,GAIH,EAAY,KAAO,IAA0C,CACjE,GAAI,EAAW,IAAI,EAAU,CAC3B,OAAO,EAAW,IAAI,EAAU,CAGlC,IAAI,EAEJ,OAAQ,EAAR,CACE,IAAK,cACH,EAAc,MAAM,OAAO,gCAC3B,MACF,IAAK,eACH,EAAc,MAAM,OAAO,iCAC3B,MACF,QACE,EAAc,MAAM,OAAO,iCAC3B,MAGJ,IAAM,EAAQ,EAAY,QAE1B,OADA,EAAW,IAAI,EAAW,EAAM,CACzB,GAIH,EAAgB,MACpB,EACA,EACA,IACoB,CACpB,IAAM,EAA0B,EAAa,cAAgB,eAGvD,CAAC,CAAE,cAAc,EAAgB,GAAe,MAAM,QAAQ,IAAI,CACtE,OAAO,oBACP,EAAa,EAAK,CAClB,EAAU,EAAU,CACrB,CAAC,CAOF,OAAO,EAAW,EAAM,CAJtB,OACA,MAAO,EAKP,MAAO,CAAC,EAAe,CACxB,CAAQ,EASE,GAA2C,CACtD,WACA,OACA,gBACI,CACJ,GAAM,CAAC,EAAM,GAAW,EAAwB,KAAK,CAoBrD,OAlBA,MAAgB,CACd,IAAI,EAAc,GAYlB,OAVA,EAAQ,KAAK,CAEb,EAAc,EAAU,EAAM,EAAW,CACtC,KAAM,GAAW,CACX,GAAa,EAAQ,EAAO,EACjC,CACD,UAAY,CACN,GAAa,EAAQ,GAAG,EAC7B,KAES,CACX,EAAc,KAEf,CAAC,EAAU,EAAM,EAAW,CAAC,CAG9B,EAAC,MAAA,CACC,UAAU,oOACV,MAAO,CACL,gBAAiB,cACjB,SAAU,EACV,SAAU,OACV,SAAU,OACX,UAEA,EAEC,EAAC,MAAA,CAAI,wBAAyB,CAAE,OAAQ,EAAM,CAAA,CAAI,CAElD,EAAC,EAAA,CAAa,WAAA,CAAuB,EAEnC"}

package/dist/esm/components/IDE/CodeConditionalRenderer.mjs

@@ -1,21 +1,2 @@
-'use client';
-
-import { useCodeContext } from "./CodeContext.mjs";
-import { Fragment, jsx } from "react/jsx-runtime";
-
-//#region src/components/IDE/CodeConditionalRenderer.tsx
-const CodeConditionalRender = ({ children, ...props }) => {
-	const { packageManager, codeFormat, contentDeclarationFormat } = useCodeContext();
-	const isPackageManagerUndefined = typeof props.packageManager === "undefined";
-	const isPackageManagerSelected = packageManager === props.packageManager;
-	const isCodeFormatUndefined = typeof props.codeFormat === "undefined";
-	const isCodeFormatSelected = codeFormat === props.codeFormat;
-	const isContentDeclarationFormatUndefined = typeof props.contentDeclarationFormat === "undefined";
-	const isContentDeclarationFormatSelected = contentDeclarationFormat === props.contentDeclarationFormat;
-	if ((isPackageManagerUndefined || isPackageManagerSelected) && (isCodeFormatUndefined || isCodeFormatSelected) && (isContentDeclarationFormatUndefined || isContentDeclarationFormatSelected)) return children;
-	return /* @__PURE__ */ jsx(Fragment, {});
-};
-
-//#endregion
-export { CodeConditionalRender };
+"use client";import{useCodeContext as e}from"./CodeContext.mjs";import{Fragment as t,jsx as n}from"react/jsx-runtime";const r=({children:r,...i})=>{let{packageManager:a,codeFormat:o,contentDeclarationFormat:s}=e(),c=i.packageManager===void 0,l=a===i.packageManager,u=i.codeFormat===void 0,d=o===i.codeFormat,f=i.contentDeclarationFormat===void 0,p=s===i.contentDeclarationFormat;return(c||l)&&(u||d)&&(f||p)?r:n(t,{})};export{r as CodeConditionalRender};
 //# sourceMappingURL=CodeConditionalRenderer.mjs.map

package/dist/esm/components/IDE/CodeConditionalRenderer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeConditionalRenderer.mjs","names":[],"sources":["../../../../src/components/IDE/CodeConditionalRenderer.tsx"],"sourcesContent":["'use client';\n\nimport type { FC, PropsWithChildren } from 'react';\nimport type { CodeCompAttributes } from './Code';\nimport { useCodeContext } from './CodeContext';\n\nexport const CodeConditionalRender: FC<\n  PropsWithChildren<CodeCompAttributes>\n> = ({ children, ...props }) => {\n  const { packageManager, codeFormat, contentDeclarationFormat } =\n    useCodeContext();\n\n  const isPackageManagerUndefined = typeof props.packageManager === 'undefined';\n  const isPackageManagerSelected = packageManager === props.packageManager;\n\n  const isCodeFormatUndefined = typeof props.codeFormat === 'undefined';\n  const isCodeFormatSelected = codeFormat === props.codeFormat;\n\n  const isContentDeclarationFormatUndefined =\n    typeof props.contentDeclarationFormat === 'undefined';\n  const isContentDeclarationFormatSelected =\n    contentDeclarationFormat === props.contentDeclarationFormat;\n\n  if (\n    (isPackageManagerUndefined || isPackageManagerSelected) &&\n    (isCodeFormatUndefined || isCodeFormatSelected) &&\n    (isContentDeclarationFormatUndefined || isContentDeclarationFormatSelected)\n  ) {\n    return children;\n  }\n\n  return <></>;\n};\n"],"mappings":";;;;;;AAMA,MAAa,yBAER,EAAE,UAAU,GAAG,YAAY;CAC9B,MAAM,EAAE,gBAAgB,YAAY,6BAClC,gBAAgB;CAElB,MAAM,4BAA4B,OAAO,MAAM,mBAAmB;CAClE,MAAM,2BAA2B,mBAAmB,MAAM;CAE1D,MAAM,wBAAwB,OAAO,MAAM,eAAe;CAC1D,MAAM,uBAAuB,eAAe,MAAM;CAElD,MAAM,sCACJ,OAAO,MAAM,6BAA6B;CAC5C,MAAM,qCACJ,6BAA6B,MAAM;AAErC,MACG,6BAA6B,8BAC7B,yBAAyB,0BACzB,uCAAuC,oCAExC,QAAO;AAGT,QAAO,iCAAK"}
+{"version":3,"file":"CodeConditionalRenderer.mjs","names":[],"sources":["../../../../src/components/IDE/CodeConditionalRenderer.tsx"],"sourcesContent":["'use client';\n\nimport type { FC, PropsWithChildren } from 'react';\nimport type { CodeCompAttributes } from './Code';\nimport { useCodeContext } from './CodeContext';\n\nexport const CodeConditionalRender: FC<\n  PropsWithChildren<CodeCompAttributes>\n> = ({ children, ...props }) => {\n  const { packageManager, codeFormat, contentDeclarationFormat } =\n    useCodeContext();\n\n  const isPackageManagerUndefined = typeof props.packageManager === 'undefined';\n  const isPackageManagerSelected = packageManager === props.packageManager;\n\n  const isCodeFormatUndefined = typeof props.codeFormat === 'undefined';\n  const isCodeFormatSelected = codeFormat === props.codeFormat;\n\n  const isContentDeclarationFormatUndefined =\n    typeof props.contentDeclarationFormat === 'undefined';\n  const isContentDeclarationFormatSelected =\n    contentDeclarationFormat === props.contentDeclarationFormat;\n\n  if (\n    (isPackageManagerUndefined || isPackageManagerSelected) &&\n    (isCodeFormatUndefined || isCodeFormatSelected) &&\n    (isContentDeclarationFormatUndefined || isContentDeclarationFormatSelected)\n  ) {\n    return children;\n  }\n\n  return <></>;\n};\n"],"mappings":"sHAMA,MAAa,GAER,CAAE,WAAU,GAAG,KAAY,CAC9B,GAAM,CAAE,iBAAgB,aAAY,4BAClC,GAAgB,CAEZ,EAAmC,EAAM,iBAAmB,OAC5D,EAA2B,IAAmB,EAAM,eAEpD,EAA+B,EAAM,aAAe,OACpD,EAAuB,IAAe,EAAM,WAE5C,EACG,EAAM,2BAA6B,OACtC,EACJ,IAA6B,EAAM,yBAUrC,OAPG,GAA6B,KAC7B,GAAyB,KACzB,GAAuC,GAEjC,EAGF,EAAA,EAAA,EAAA,CAAK"}

package/dist/esm/components/IDE/CodeContext.mjs

@@ -1,45 +1,2 @@
-'use client';
-
-import { usePersistedStore } from "../../hooks/usePersistedStore.mjs";
-import { createContext, useContext } from "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/IDE/CodeContext.tsx
-/**
-* Context that store the current locale on the client side
-*/
-const CodeContext = createContext({
-	packageManager: "npm",
-	setPackageManager: () => {},
-	codeFormat: "typescript",
-	setCodeFormat: () => {},
-	contentDeclarationFormat: "typescript",
-	setContentDeclarationFormat: () => {}
-});
-/**
-* Hook that provides the current locale
-*/
-const useCodeContext = () => useContext(CodeContext);
-/**
-* Provider that store the current locale on the client side
-*/
-const CodeProvider = ({ children }) => {
-	const [packageManager, setPackageManager] = usePersistedStore("packageManager", "npm");
-	const [codeFormat, setCodeFormat] = usePersistedStore("codeFormat", "typescript");
-	const [contentDeclarationFormat, setContentDeclarationFormat] = usePersistedStore("contentDeclarationFormat", "typescript");
-	return /* @__PURE__ */ jsx(CodeContext, {
-		value: {
-			packageManager,
-			setPackageManager,
-			codeFormat,
-			setCodeFormat,
-			contentDeclarationFormat,
-			setContentDeclarationFormat
-		},
-		children
-	});
-};
-
-//#endregion
-export { CodeContext, CodeProvider, useCodeContext };
+"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";const i=t({packageManager:`npm`,setPackageManager:()=>{},codeFormat:`typescript`,setCodeFormat:()=>{},contentDeclarationFormat:`typescript`,setContentDeclarationFormat:()=>{}}),a=()=>n(i),o=({children:t})=>{let[n,a]=e(`packageManager`,`npm`),[o,s]=e(`codeFormat`,`typescript`),[c,l]=e(`contentDeclarationFormat`,`typescript`);return r(i,{value:{packageManager:n,setPackageManager:a,codeFormat:o,setCodeFormat:s,contentDeclarationFormat:c,setContentDeclarationFormat:l},children:t})};export{i as CodeContext,o as CodeProvider,a as useCodeContext};
 //# sourceMappingURL=CodeContext.mjs.map

package/dist/esm/components/IDE/CodeContext.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeContext.mjs","names":[],"sources":["../../../../src/components/IDE/CodeContext.tsx"],"sourcesContent":["'use client';\n\nimport { usePersistedStore } from '@hooks/usePersistedStore';\nimport {\n  createContext,\n  type FC,\n  type PropsWithChildren,\n  useContext,\n} from 'react';\n\nexport type PackageManager = 'npm' | 'pnpm' | 'yarn' | 'bun';\nexport type CodeFormat = 'typescript' | 'commonjs' | 'esm';\nexport type ContentDeclarationFormat =\n  | 'typescript'\n  | 'commonjs'\n  | 'esm'\n  | 'json';\n\ntype CodeContextValue = {\n  packageManager: PackageManager;\n  setPackageManager: (packageManager: PackageManager) => void;\n  codeFormat: CodeFormat;\n  setCodeFormat: (codeFormat: CodeFormat) => void;\n  contentDeclarationFormat: ContentDeclarationFormat;\n  setContentDeclarationFormat: (\n    contentDeclarationFormat: ContentDeclarationFormat\n  ) => void;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const CodeContext = createContext<CodeContextValue>({\n  packageManager: 'npm',\n  setPackageManager: () => {},\n  codeFormat: 'typescript',\n  setCodeFormat: () => {},\n  contentDeclarationFormat: 'typescript',\n  setContentDeclarationFormat: () => {},\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useCodeContext = () => useContext(CodeContext);\n\n/**\n * Provider that store the current locale on the client side\n */\nexport const CodeProvider: FC<PropsWithChildren> = ({ children }) => {\n  const [packageManager, setPackageManager] = usePersistedStore<PackageManager>(\n    'packageManager',\n    'npm'\n  );\n  const [codeFormat, setCodeFormat] = usePersistedStore<CodeFormat>(\n    'codeFormat',\n    'typescript'\n  );\n  const [contentDeclarationFormat, setContentDeclarationFormat] =\n    usePersistedStore<ContentDeclarationFormat>(\n      'contentDeclarationFormat',\n      'typescript'\n    );\n\n  return (\n    <CodeContext\n      value={{\n        packageManager,\n        setPackageManager,\n        codeFormat,\n        setCodeFormat,\n        contentDeclarationFormat,\n        setContentDeclarationFormat,\n      }}\n    >\n      {children}\n    </CodeContext>\n  );\n};\n"],"mappings":";;;;;;;;;;AAgCA,MAAa,cAAc,cAAgC;CACzD,gBAAgB;CAChB,yBAAyB;CACzB,YAAY;CACZ,qBAAqB;CACrB,0BAA0B;CAC1B,mCAAmC;CACpC,CAAC;;;;AAKF,MAAa,uBAAuB,WAAW,YAAY;;;;AAK3D,MAAa,gBAAuC,EAAE,eAAe;CACnE,MAAM,CAAC,gBAAgB,qBAAqB,kBAC1C,kBACA,MACD;CACD,MAAM,CAAC,YAAY,iBAAiB,kBAClC,cACA,aACD;CACD,MAAM,CAAC,0BAA0B,+BAC/B,kBACE,4BACA,aACD;AAEH,QACE,oBAAC;EACC,OAAO;GACL;GACA;GACA;GACA;GACA;GACA;GACD;EAEA;GACW"}
+{"version":3,"file":"CodeContext.mjs","names":[],"sources":["../../../../src/components/IDE/CodeContext.tsx"],"sourcesContent":["'use client';\n\nimport { usePersistedStore } from '@hooks/usePersistedStore';\nimport {\n  createContext,\n  type FC,\n  type PropsWithChildren,\n  useContext,\n} from 'react';\n\nexport type PackageManager = 'npm' | 'pnpm' | 'yarn' | 'bun';\nexport type CodeFormat = 'typescript' | 'commonjs' | 'esm';\nexport type ContentDeclarationFormat =\n  | 'typescript'\n  | 'commonjs'\n  | 'esm'\n  | 'json';\n\ntype CodeContextValue = {\n  packageManager: PackageManager;\n  setPackageManager: (packageManager: PackageManager) => void;\n  codeFormat: CodeFormat;\n  setCodeFormat: (codeFormat: CodeFormat) => void;\n  contentDeclarationFormat: ContentDeclarationFormat;\n  setContentDeclarationFormat: (\n    contentDeclarationFormat: ContentDeclarationFormat\n  ) => void;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const CodeContext = createContext<CodeContextValue>({\n  packageManager: 'npm',\n  setPackageManager: () => {},\n  codeFormat: 'typescript',\n  setCodeFormat: () => {},\n  contentDeclarationFormat: 'typescript',\n  setContentDeclarationFormat: () => {},\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useCodeContext = () => useContext(CodeContext);\n\n/**\n * Provider that store the current locale on the client side\n */\nexport const CodeProvider: FC<PropsWithChildren> = ({ children }) => {\n  const [packageManager, setPackageManager] = usePersistedStore<PackageManager>(\n    'packageManager',\n    'npm'\n  );\n  const [codeFormat, setCodeFormat] = usePersistedStore<CodeFormat>(\n    'codeFormat',\n    'typescript'\n  );\n  const [contentDeclarationFormat, setContentDeclarationFormat] =\n    usePersistedStore<ContentDeclarationFormat>(\n      'contentDeclarationFormat',\n      'typescript'\n    );\n\n  return (\n    <CodeContext\n      value={{\n        packageManager,\n        setPackageManager,\n        codeFormat,\n        setCodeFormat,\n        contentDeclarationFormat,\n        setContentDeclarationFormat,\n      }}\n    >\n      {children}\n    </CodeContext>\n  );\n};\n"],"mappings":"iLAgCA,MAAa,EAAc,EAAgC,CACzD,eAAgB,MAChB,sBAAyB,GACzB,WAAY,aACZ,kBAAqB,GACrB,yBAA0B,aAC1B,gCAAmC,GACpC,CAAC,CAKW,MAAuB,EAAW,EAAY,CAK9C,GAAuC,CAAE,cAAe,CACnE,GAAM,CAAC,EAAgB,GAAqB,EAC1C,iBACA,MACD,CACK,CAAC,EAAY,GAAiB,EAClC,aACA,aACD,CACK,CAAC,EAA0B,GAC/B,EACE,2BACA,aACD,CAEH,OACE,EAAC,EAAA,CACC,MAAO,CACL,iBACA,oBACA,aACA,gBACA,2BACA,8BACD,CAEA,YACW"}

package/dist/esm/components/IDE/CodeFormatSelector.mjs

@@ -1,41 +1,2 @@
-'use client';
-
-import { useCodeContext } from "./CodeContext.mjs";
-import { Select } from "../Select/Select.mjs";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useIntlayer } from "react-intlayer";
-
-//#region src/components/IDE/CodeFormatSelector.tsx
-const CodeFormatSelector = () => {
-	const { codeFormat, setCodeFormat, setContentDeclarationFormat } = useCodeContext();
-	const content = useIntlayer("code-selectors");
-	return /* @__PURE__ */ jsxs(Select, {
-		value: codeFormat,
-		onValueChange: (value) => {
-			setCodeFormat(value);
-			setContentDeclarationFormat(value);
-		},
-		children: [/* @__PURE__ */ jsx(Select.Trigger, {
-			className: "py-1!",
-			"aria-label": content.codeFormat.label.value,
-			children: /* @__PURE__ */ jsx(Select.Value, { placeholder: content.codeFormat.placeholder.value })
-		}), /* @__PURE__ */ jsxs(Select.Content, { children: [
-			/* @__PURE__ */ jsx(Select.Item, {
-				value: "typescript",
-				children: "TypeScript"
-			}),
-			/* @__PURE__ */ jsx(Select.Item, {
-				value: "esm",
-				children: "ESM"
-			}),
-			/* @__PURE__ */ jsx(Select.Item, {
-				value: "commonjs",
-				children: "CommonJS"
-			})
-		] })]
-	});
-};
-
-//#endregion
-export { CodeFormatSelector };
+"use client";import{useCodeContext as e}from"./CodeContext.mjs";import{Select as t}from"../Select/Select.mjs";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{useIntlayer as i}from"react-intlayer";const a=()=>{let{codeFormat:a,setCodeFormat:o,setContentDeclarationFormat:s}=e(),c=i(`code-selectors`);return r(t,{value:a,onValueChange:e=>{o(e),s(e)},children:[n(t.Trigger,{className:`py-1!`,"aria-label":c.codeFormat.label.value,children:n(t.Value,{placeholder:c.codeFormat.placeholder.value})}),r(t.Content,{children:[n(t.Item,{value:`typescript`,children:`TypeScript`}),n(t.Item,{value:`esm`,children:`ESM`}),n(t.Item,{value:`commonjs`,children:`CommonJS`})]})]})};export{a as CodeFormatSelector};
 //# sourceMappingURL=CodeFormatSelector.mjs.map

package/dist/esm/components/IDE/CodeFormatSelector.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeFormatSelector.mjs","names":[],"sources":["../../../../src/components/IDE/CodeFormatSelector.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Select } from '../Select';\nimport { useCodeContext } from './CodeContext';\n\nexport const CodeFormatSelector: FC = () => {\n  const { codeFormat, setCodeFormat, setContentDeclarationFormat } =\n    useCodeContext();\n  const content = useIntlayer('code-selectors');\n\n  return (\n    <Select\n      value={codeFormat}\n      onValueChange={(value) => {\n        setCodeFormat(value as typeof codeFormat);\n        setContentDeclarationFormat(value as typeof codeFormat);\n      }}\n    >\n      <Select.Trigger\n        className=\"py-1!\"\n        aria-label={content.codeFormat.label.value}\n      >\n        <Select.Value placeholder={content.codeFormat.placeholder.value} />\n      </Select.Trigger>\n      <Select.Content>\n        <Select.Item value=\"typescript\">TypeScript</Select.Item>\n        <Select.Item value=\"esm\">ESM</Select.Item>\n        <Select.Item value=\"commonjs\">CommonJS</Select.Item>\n      </Select.Content>\n    </Select>\n  );\n};\n"],"mappings":";;;;;;;;AAOA,MAAa,2BAA+B;CAC1C,MAAM,EAAE,YAAY,eAAe,gCACjC,gBAAgB;CAClB,MAAM,UAAU,YAAY,iBAAiB;AAE7C,QACE,qBAAC;EACC,OAAO;EACP,gBAAgB,UAAU;AACxB,iBAAc,MAA2B;AACzC,+BAA4B,MAA2B;;aAGzD,oBAAC,OAAO;GACN,WAAU;GACV,cAAY,QAAQ,WAAW,MAAM;aAErC,oBAAC,OAAO,SAAM,aAAa,QAAQ,WAAW,YAAY,QAAS;IACpD,EACjB,qBAAC,OAAO;GACN,oBAAC,OAAO;IAAK,OAAM;cAAa;KAAwB;GACxD,oBAAC,OAAO;IAAK,OAAM;cAAM;KAAiB;GAC1C,oBAAC,OAAO;IAAK,OAAM;cAAW;KAAsB;MACrC;GACV"}
+{"version":3,"file":"CodeFormatSelector.mjs","names":[],"sources":["../../../../src/components/IDE/CodeFormatSelector.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Select } from '../Select';\nimport { useCodeContext } from './CodeContext';\n\nexport const CodeFormatSelector: FC = () => {\n  const { codeFormat, setCodeFormat, setContentDeclarationFormat } =\n    useCodeContext();\n  const content = useIntlayer('code-selectors');\n\n  return (\n    <Select\n      value={codeFormat}\n      onValueChange={(value) => {\n        setCodeFormat(value as typeof codeFormat);\n        setContentDeclarationFormat(value as typeof codeFormat);\n      }}\n    >\n      <Select.Trigger\n        className=\"py-1!\"\n        aria-label={content.codeFormat.label.value}\n      >\n        <Select.Value placeholder={content.codeFormat.placeholder.value} />\n      </Select.Trigger>\n      <Select.Content>\n        <Select.Item value=\"typescript\">TypeScript</Select.Item>\n        <Select.Item value=\"esm\">ESM</Select.Item>\n        <Select.Item value=\"commonjs\">CommonJS</Select.Item>\n      </Select.Content>\n    </Select>\n  );\n};\n"],"mappings":"6MAOA,MAAa,MAA+B,CAC1C,GAAM,CAAE,aAAY,gBAAe,+BACjC,GAAgB,CACZ,EAAU,EAAY,iBAAiB,CAE7C,OACE,EAAC,EAAA,CACC,MAAO,EACP,cAAgB,GAAU,CACxB,EAAc,EAA2B,CACzC,EAA4B,EAA2B,YAGzD,EAAC,EAAO,QAAA,CACN,UAAU,QACV,aAAY,EAAQ,WAAW,MAAM,eAErC,EAAC,EAAO,MAAA,CAAM,YAAa,EAAQ,WAAW,YAAY,MAAA,CAAS,EACpD,CACjB,EAAC,EAAO,QAAA,CAAA,SAAA,CACN,EAAC,EAAO,KAAA,CAAK,MAAM,sBAAa,cAAwB,CACxD,EAAC,EAAO,KAAA,CAAK,MAAM,eAAM,OAAiB,CAC1C,EAAC,EAAO,KAAA,CAAK,MAAM,oBAAW,YAAsB,GACrC,CAAA,EACV"}

package/dist/esm/components/IDE/ContentDeclarationFormatSelector.mjs

@@ -1,42 +1,2 @@
-'use client';
-
-import { useCodeContext } from "./CodeContext.mjs";
-import { Select } from "../Select/Select.mjs";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useIntlayer } from "react-intlayer";
-
-//#region src/components/IDE/ContentDeclarationFormatSelector.tsx
-const ContentDeclarationFormatSelector = () => {
-	const { contentDeclarationFormat, setContentDeclarationFormat } = useCodeContext();
-	const content = useIntlayer("code-selectors");
-	return /* @__PURE__ */ jsxs(Select, {
-		value: contentDeclarationFormat,
-		onValueChange: setContentDeclarationFormat,
-		children: [/* @__PURE__ */ jsx(Select.Trigger, {
-			className: "py-1!",
-			"aria-label": content.contentDeclarationFormat.label.value,
-			children: /* @__PURE__ */ jsx(Select.Value, { placeholder: content.contentDeclarationFormat.placeholder.value })
-		}), /* @__PURE__ */ jsxs(Select.Content, { children: [
-			/* @__PURE__ */ jsx(Select.Item, {
-				value: "typescript",
-				children: "TypeScript"
-			}),
-			/* @__PURE__ */ jsx(Select.Item, {
-				value: "commonjs",
-				children: "CommonJS"
-			}),
-			/* @__PURE__ */ jsx(Select.Item, {
-				value: "esm",
-				children: "ESM"
-			}),
-			/* @__PURE__ */ jsx(Select.Item, {
-				value: "json",
-				children: "JSON"
-			})
-		] })]
-	});
-};
-
-//#endregion
-export { ContentDeclarationFormatSelector };
+"use client";import{useCodeContext as e}from"./CodeContext.mjs";import{Select as t}from"../Select/Select.mjs";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{useIntlayer as i}from"react-intlayer";const a=()=>{let{contentDeclarationFormat:a,setContentDeclarationFormat:o}=e(),s=i(`code-selectors`);return r(t,{value:a,onValueChange:o,children:[n(t.Trigger,{className:`py-1!`,"aria-label":s.contentDeclarationFormat.label.value,children:n(t.Value,{placeholder:s.contentDeclarationFormat.placeholder.value})}),r(t.Content,{children:[n(t.Item,{value:`typescript`,children:`TypeScript`}),n(t.Item,{value:`commonjs`,children:`CommonJS`}),n(t.Item,{value:`esm`,children:`ESM`}),n(t.Item,{value:`json`,children:`JSON`})]})]})};export{a as ContentDeclarationFormatSelector};
 //# sourceMappingURL=ContentDeclarationFormatSelector.mjs.map

package/dist/esm/components/IDE/ContentDeclarationFormatSelector.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ContentDeclarationFormatSelector.mjs","names":[],"sources":["../../../../src/components/IDE/ContentDeclarationFormatSelector.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Select } from '../Select';\nimport { useCodeContext } from './CodeContext';\n\nexport const ContentDeclarationFormatSelector: FC = () => {\n  const { contentDeclarationFormat, setContentDeclarationFormat } =\n    useCodeContext();\n  const content = useIntlayer('code-selectors');\n\n  return (\n    <Select\n      value={contentDeclarationFormat}\n      onValueChange={setContentDeclarationFormat}\n    >\n      <Select.Trigger\n        className=\"py-1!\"\n        aria-label={content.contentDeclarationFormat.label.value}\n      >\n        <Select.Value\n          placeholder={content.contentDeclarationFormat.placeholder.value}\n        />\n      </Select.Trigger>\n      <Select.Content>\n        <Select.Item value=\"typescript\">TypeScript</Select.Item>\n        <Select.Item value=\"commonjs\">CommonJS</Select.Item>\n        <Select.Item value=\"esm\">ESM</Select.Item>\n        <Select.Item value=\"json\">JSON</Select.Item>\n      </Select.Content>\n    </Select>\n  );\n};\n"],"mappings":";;;;;;;;AAOA,MAAa,yCAA6C;CACxD,MAAM,EAAE,0BAA0B,gCAChC,gBAAgB;CAClB,MAAM,UAAU,YAAY,iBAAiB;AAE7C,QACE,qBAAC;EACC,OAAO;EACP,eAAe;aAEf,oBAAC,OAAO;GACN,WAAU;GACV,cAAY,QAAQ,yBAAyB,MAAM;aAEnD,oBAAC,OAAO,SACN,aAAa,QAAQ,yBAAyB,YAAY,QAC1D;IACa,EACjB,qBAAC,OAAO;GACN,oBAAC,OAAO;IAAK,OAAM;cAAa;KAAwB;GACxD,oBAAC,OAAO;IAAK,OAAM;cAAW;KAAsB;GACpD,oBAAC,OAAO;IAAK,OAAM;cAAM;KAAiB;GAC1C,oBAAC,OAAO;IAAK,OAAM;cAAO;KAAkB;MAC7B;GACV"}
+{"version":3,"file":"ContentDeclarationFormatSelector.mjs","names":[],"sources":["../../../../src/components/IDE/ContentDeclarationFormatSelector.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Select } from '../Select';\nimport { useCodeContext } from './CodeContext';\n\nexport const ContentDeclarationFormatSelector: FC = () => {\n  const { contentDeclarationFormat, setContentDeclarationFormat } =\n    useCodeContext();\n  const content = useIntlayer('code-selectors');\n\n  return (\n    <Select\n      value={contentDeclarationFormat}\n      onValueChange={setContentDeclarationFormat}\n    >\n      <Select.Trigger\n        className=\"py-1!\"\n        aria-label={content.contentDeclarationFormat.label.value}\n      >\n        <Select.Value\n          placeholder={content.contentDeclarationFormat.placeholder.value}\n        />\n      </Select.Trigger>\n      <Select.Content>\n        <Select.Item value=\"typescript\">TypeScript</Select.Item>\n        <Select.Item value=\"commonjs\">CommonJS</Select.Item>\n        <Select.Item value=\"esm\">ESM</Select.Item>\n        <Select.Item value=\"json\">JSON</Select.Item>\n      </Select.Content>\n    </Select>\n  );\n};\n"],"mappings":"6MAOA,MAAa,MAA6C,CACxD,GAAM,CAAE,2BAA0B,+BAChC,GAAgB,CACZ,EAAU,EAAY,iBAAiB,CAE7C,OACE,EAAC,EAAA,CACC,MAAO,EACP,cAAe,YAEf,EAAC,EAAO,QAAA,CACN,UAAU,QACV,aAAY,EAAQ,yBAAyB,MAAM,eAEnD,EAAC,EAAO,MAAA,CACN,YAAa,EAAQ,yBAAyB,YAAY,MAAA,CAC1D,EACa,CACjB,EAAC,EAAO,QAAA,CAAA,SAAA,CACN,EAAC,EAAO,KAAA,CAAK,MAAM,sBAAa,cAAwB,CACxD,EAAC,EAAO,KAAA,CAAK,MAAM,oBAAW,YAAsB,CACpD,EAAC,EAAO,KAAA,CAAK,MAAM,eAAM,OAAiB,CAC1C,EAAC,EAAO,KAAA,CAAK,MAAM,gBAAO,QAAkB,GAC7B,CAAA,EACV"}