@ably/ui 17.3.5 → 17.4.0-dev.17a4c58f

package/core/Code.js

@@ -1,2 +1,2 @@
-import React from"react";import{highlightSnippet,registerDefaultLanguages}from"./utils/syntax-highlighter";import languagesRegistry from"./utils/syntax-highlighter-registry";import cn from"./utils/cn";registerDefaultLanguages(languagesRegistry);const Code=({language,snippet,textSize="ui-text-code",padding="p-8",additionalCSS="",showLines,lineCSS})=>{const trimmedSnippet=snippet.trimEnd();const HTMLraw=highlightSnippet(language,trimmedSnippet)??"";const className=`language-${language} ${textSize}`;const lines=trimmedSnippet.split(/\r\n|\r|\n/);const lineCount=lines.length;return React.createElement("div",{className:cn("hljs overflow-auto flex",padding,additionalCSS),"data-id":"code"},showLines?React.createElement("div",null,[...Array(lineCount)].map((_,i)=>React.createElement("p",{className:cn("mr-6 font-mono text-right text-neutral-800",lineCSS),key:i},i+1))):null,React.createElement("pre",{lang:language},React.createElement("code",{className:className,dangerouslySetInnerHTML:{__html:HTMLraw}})))};export default Code;
+import React from"react";import{highlightSnippet,registerDefaultLanguages}from"./utils/syntax-highlighter";import languagesRegistry from"./utils/syntax-highlighter-registry";import cn from"./utils/cn";registerDefaultLanguages(languagesRegistry);const Code=({language,snippet,textSize="ui-text-code",padding="p-8",additionalCSS="",showLines,lineCSS})=>{const trimmedSnippet=snippet.trimEnd();const HTMLraw=highlightSnippet(language,trimmedSnippet)??"";const className=`language-${language} ${textSize}`;const lines=trimmedSnippet.split(/\r\n|\r|\n/);const lineCount=lines.length;return React.createElement("div",{className:cn("hljs flex",padding,additionalCSS),"data-id":"code"},showLines?React.createElement("div",{className:"text-code leading-6 pt-px"},[...Array(lineCount)].map((_,i)=>React.createElement("p",{className:cn("mr-4 font-mono text-right text-neutral-800",lineCSS),key:i},i+1))):null,React.createElement("pre",{lang:language,className:"overflow-auto flex-1 leading-6"},React.createElement("code",{className:className,dangerouslySetInnerHTML:{__html:HTMLraw}})))};export default Code;
 //# sourceMappingURL=Code.js.map

package/core/Code.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/core/Code.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  highlightSnippet,\n  registerDefaultLanguages,\n} from \"./utils/syntax-highlighter\";\nimport languagesRegistry from \"./utils/syntax-highlighter-registry\";\nimport cn from \"./utils/cn\";\n\nregisterDefaultLanguages(languagesRegistry);\n\ntype CodeProps = {\n  language: string;\n  snippet: string;\n  textSize?: string;\n  padding?: string;\n  additionalCSS?: string;\n  showLines?: boolean;\n  lineCSS?: string;\n};\n\nconst Code = ({\n  language,\n  snippet,\n  textSize = \"ui-text-code\",\n  padding = \"p-8\",\n  additionalCSS = \"\",\n  showLines,\n  lineCSS,\n}: CodeProps) => {\n  // Trim the snippet and remove trailing empty lines\n  const trimmedSnippet = snippet.trimEnd();\n  const HTMLraw = highlightSnippet(language, trimmedSnippet) ?? \"\";\n  const className = `language-${language} ${textSize}`;\n\n  // Calculate line count after removing trailing empty lines\n  const lines = trimmedSnippet.split(/\\r\\n|\\r|\\n/);\n  const lineCount = lines.length;\n\n  return (\n    <div\n      className={cn(\"hljs overflow-auto flex\", padding, additionalCSS)}\n      data-id=\"code\"\n    >\n      {showLines ? (\n        <div>\n          {[...Array(lineCount)].map((_, i) => (\n            <p\n              className={cn(\n                \"mr-6 font-mono text-right text-neutral-800\",\n                lineCSS,\n              )}\n              key={i}\n            >\n              {i + 1}\n            </p>\n          ))}\n        </div>\n      ) : null}\n      <pre lang={language}>\n        <code\n          className={className}\n          dangerouslySetInnerHTML={{ __html: HTMLraw }}\n        />\n      </pre>\n    </div>\n  );\n};\n\nexport default Code;\n"],"names":["React","highlightSnippet","registerDefaultLanguages","languagesRegistry","cn","Code","language","snippet","textSize","padding","additionalCSS","showLines","lineCSS","trimmedSnippet","trimEnd","HTMLraw","className","lines","split","lineCount","length","div","data-id","Array","map","_","i","p","key","pre","lang","code","dangerouslySetInnerHTML","__html"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QACEC,gBAAgB,CAChBC,wBAAwB,KACnB,4BAA6B,AACpC,QAAOC,sBAAuB,qCAAsC,AACpE,QAAOC,OAAQ,YAAa,CAE5BF,yBAAyBC,mBAYzB,MAAME,KAAO,CAAC,CACZC,QAAQ,CACRC,OAAO,CACPC,SAAW,cAAc,CACzBC,QAAU,KAAK,CACfC,cAAgB,EAAE,CAClBC,SAAS,CACTC,OAAO,CACG,IAEV,MAAMC,eAAiBN,QAAQO,OAAO,GACtC,MAAMC,QAAUd,iBAAiBK,SAAUO,iBAAmB,GAC9D,MAAMG,UAAY,CAAC,SAAS,EAAEV,SAAS,CAAC,EAAEE,SAAS,CAAC,CAGpD,MAAMS,MAAQJ,eAAeK,KAAK,CAAC,cACnC,MAAMC,UAAYF,MAAMG,MAAM,CAE9B,OACE,oBAACC,OACCL,UAAWZ,GAAG,0BAA2BK,QAASC,eAClDY,UAAQ,QAEPX,UACC,oBAACU,WACE,IAAIE,MAAMJ,WAAW,CAACK,GAAG,CAAC,CAACC,EAAGC,IAC7B,oBAACC,KACCX,UAAWZ,GACT,6CACAQ,SAEFgB,IAAKF,GAEJA,EAAI,KAIT,KACJ,oBAACG,OAAIC,KAAMxB,UACT,oBAACyB,QACCf,UAAWA,UACXgB,wBAAyB,CAAEC,OAAQlB,OAAQ,KAKrD,CAEA,gBAAeV,IAAK"}
+{"version":3,"sources":["../../src/core/Code.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  highlightSnippet,\n  registerDefaultLanguages,\n} from \"./utils/syntax-highlighter\";\nimport languagesRegistry from \"./utils/syntax-highlighter-registry\";\nimport cn from \"./utils/cn\";\n\nregisterDefaultLanguages(languagesRegistry);\n\ntype CodeProps = {\n  language: string;\n  snippet: string;\n  textSize?: string;\n  padding?: string;\n  additionalCSS?: string;\n  showLines?: boolean;\n  lineCSS?: string;\n};\n\nconst Code = ({\n  language,\n  snippet,\n  textSize = \"ui-text-code\",\n  padding = \"p-8\",\n  additionalCSS = \"\",\n  showLines,\n  lineCSS,\n}: CodeProps) => {\n  // Trim the snippet and remove trailing empty lines\n  const trimmedSnippet = snippet.trimEnd();\n  const HTMLraw = highlightSnippet(language, trimmedSnippet) ?? \"\";\n  const className = `language-${language} ${textSize}`;\n\n  // Calculate line count after removing trailing empty lines\n  const lines = trimmedSnippet.split(/\\r\\n|\\r|\\n/);\n  const lineCount = lines.length;\n\n  return (\n    <div className={cn(\"hljs flex\", padding, additionalCSS)} data-id=\"code\">\n      {showLines ? (\n        <div className=\"text-code leading-6 pt-px\">\n          {[...Array(lineCount)].map((_, i) => (\n            <p\n              className={cn(\n                \"mr-4 font-mono text-right text-neutral-800\",\n                lineCSS,\n              )}\n              key={i}\n            >\n              {i + 1}\n            </p>\n          ))}\n        </div>\n      ) : null}\n      <pre lang={language} className=\"overflow-auto flex-1 leading-6\">\n        <code\n          className={className}\n          dangerouslySetInnerHTML={{ __html: HTMLraw }}\n        />\n      </pre>\n    </div>\n  );\n};\n\nexport default Code;\n"],"names":["React","highlightSnippet","registerDefaultLanguages","languagesRegistry","cn","Code","language","snippet","textSize","padding","additionalCSS","showLines","lineCSS","trimmedSnippet","trimEnd","HTMLraw","className","lines","split","lineCount","length","div","data-id","Array","map","_","i","p","key","pre","lang","code","dangerouslySetInnerHTML","__html"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QACEC,gBAAgB,CAChBC,wBAAwB,KACnB,4BAA6B,AACpC,QAAOC,sBAAuB,qCAAsC,AACpE,QAAOC,OAAQ,YAAa,CAE5BF,yBAAyBC,mBAYzB,MAAME,KAAO,CAAC,CACZC,QAAQ,CACRC,OAAO,CACPC,SAAW,cAAc,CACzBC,QAAU,KAAK,CACfC,cAAgB,EAAE,CAClBC,SAAS,CACTC,OAAO,CACG,IAEV,MAAMC,eAAiBN,QAAQO,OAAO,GACtC,MAAMC,QAAUd,iBAAiBK,SAAUO,iBAAmB,GAC9D,MAAMG,UAAY,CAAC,SAAS,EAAEV,SAAS,CAAC,EAAEE,SAAS,CAAC,CAGpD,MAAMS,MAAQJ,eAAeK,KAAK,CAAC,cACnC,MAAMC,UAAYF,MAAMG,MAAM,CAE9B,OACE,oBAACC,OAAIL,UAAWZ,GAAG,YAAaK,QAASC,eAAgBY,UAAQ,QAC9DX,UACC,oBAACU,OAAIL,UAAU,6BACZ,IAAIO,MAAMJ,WAAW,CAACK,GAAG,CAAC,CAACC,EAAGC,IAC7B,oBAACC,KACCX,UAAWZ,GACT,6CACAQ,SAEFgB,IAAKF,GAEJA,EAAI,KAIT,KACJ,oBAACG,OAAIC,KAAMxB,SAAUU,UAAU,kCAC7B,oBAACe,QACCf,UAAWA,UACXgB,wBAAyB,CAAEC,OAAQlB,OAAQ,KAKrD,CAEA,gBAAeV,IAAK"}

package/core/CodeSnippet/ApiKeySelector.js

@@ -1,2 +1,2 @@
-import React,{memo,useMemo}from"react";import*as Select from"@radix-ui/react-select";import Badge from"../Badge";import Icon from"../Icon";import Tooltip from"../Tooltip";const SPECIAL_API_KEYS={DEMO:"demo"};const ApiKeySelector=memo(({apiKeys,selectedApiKey,onApiKeyChange})=>{const isDemoMode=useMemo(()=>apiKeys?.length===1&&apiKeys[0]===SPECIAL_API_KEYS.DEMO,[apiKeys]);const apiKeyItems=useMemo(()=>{if(!apiKeys?.length||isDemoMode)return null;return apiKeys.map(key=>React.createElement(Select.Item,{key:key,value:key,className:"relative flex items-center rounded px-2 py-1.5 text-14 text-neutral-1300 dark:text-neutral-000 select-none hover:bg-neutral-100 dark:hover:bg-neutral-1200 data-[highlighted]:outline-none data-[highlighted]:bg-neutral-100 dark:data-[highlighted]:bg-neutral-1200 focus-base"},React.createElement(Select.ItemText,null,key),React.createElement(Select.ItemIndicator,{className:"absolute right-2"},React.createElement(Icon,{name:"icon-gui-check-outline",size:"16px"}))))},[apiKeys,isDemoMode]);const renderDemoMode=useMemo(()=>React.createElement("div",{className:"flex items-center"},React.createElement(Badge,{className:"ml-1 bg-neutral-200 dark:bg-neutral-1100"},"DEMO ONLY"),React.createElement(Tooltip,{className:"ml-0",triggerElement:React.createElement(Icon,{name:"icon-gui-information-circle-outline",size:"16px",color:"text-neutral-700 dark:text-neutral-600"})},"This code example uses a temporary key that is rate limited and expires in 4 hrs. Sign in to Ably to use your API keys instead.")),[]);const renderApiKeyDropdown=useMemo(()=>{if(isDemoMode){return renderDemoMode}if(!apiKeys?.length){return null}return React.createElement(Select.Root,{value:selectedApiKey,onValueChange:onApiKeyChange},React.createElement(Select.Trigger,{className:"inline-flex items-center justify-between rounded px-2 py-1 text-14 text-neutral-1300 dark:text-neutral-000 bg-neutral-200 dark:bg-neutral-1100 hover:bg-neutral-300 dark:hover:bg-neutral-1000 gap-1 focus-base","aria-label":"API Key"},React.createElement(Select.Value,null),React.createElement(Select.Icon,null,React.createElement(Icon,{name:"icon-gui-chevron-down-outline",size:"16px"}))),React.createElement(Select.Portal,null,React.createElement(Select.Content,{className:"overflow-hidden rounded-md bg-neutral-000 dark:bg-neutral-1300 border border-neutral-200 dark:border-neutral-1000 shadow-md z-50"},React.createElement(Select.ScrollUpButton,{className:"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base"},React.createElement(Icon,{name:"icon-gui-chevron-down-outline",size:"16px",additionalCSS:"rotate-180"})),React.createElement(Select.Viewport,{className:"p-1"},apiKeyItems),React.createElement(Select.ScrollDownButton,{className:"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base"},React.createElement(Icon,{name:"icon-gui-chevron-down-outline",size:"16px"})))))},[apiKeys,isDemoMode,selectedApiKey,onApiKeyChange,apiKeyItems,renderDemoMode]);return React.createElement("div",{className:"flex items-center border-t border-neutral-200 dark:border-neutral-1100 px-3 py-3"},React.createElement("span",{className:"ui-text-label4 text-neutral-700 dark:text-neutral-600 mr-1"},"API key:"),renderApiKeyDropdown)});ApiKeySelector.displayName="ApiKeySelector";export default ApiKeySelector;
+import React,{useMemo}from"react";import*as Select from"@radix-ui/react-select";import Badge from"../Badge";import Icon from"../Icon";import Tooltip from"../Tooltip";const ApiKeySelector=({apiKeys,selectedApiKey,onApiKeyChange})=>{const isDemoMode=useMemo(()=>apiKeys?.length===1&&apiKeys[0].app==="demo",[apiKeys]);const renderDemoMode=useMemo(()=>React.createElement("div",{className:"flex items-center gap-2"},React.createElement(Badge,{className:"ml-1 bg-neutral-200 dark:bg-neutral-1100"},"DEMO ONLY"),React.createElement(Tooltip,{className:"ml-0",triggerElement:React.createElement(Icon,{name:"icon-gui-information-circle-outline",size:"16px",color:"text-neutral-700 dark:text-neutral-600"})},"This code example uses a temporary key that is rate limited and expires in 4 hrs. Sign in to Ably to use your API keys instead.")),[]);const renderApiKeyDropdown=useMemo(()=>{if(isDemoMode){return renderDemoMode}if(!apiKeys?.length){return null}return React.createElement(Select.Root,{value:selectedApiKey,onValueChange:onApiKeyChange},React.createElement(Select.Trigger,{className:"font-sans inline-flex items-center justify-between rounded px-3 py-2 ml-1 text-14 text-neutral-1300 dark:text-neutral-000 bg-neutral-200 dark:bg-neutral-1100 hover:bg-neutral-300 dark:hover:bg-neutral-1000 gap-2 focus-base border","aria-label":"API Key"},React.createElement(Select.Value,null),React.createElement(Select.Icon,{className:"size-4"},React.createElement(Icon,{name:"icon-gui-chevron-down-micro",size:"16px"}))),React.createElement(Select.Portal,null,React.createElement(Select.Content,{className:"overflow-hidden rounded-lg bg-neutral-000 dark:bg-neutral-1300 border border-neutral-200 dark:border-neutral-1000 shadow-md z-50"},React.createElement(Select.ScrollUpButton,{className:"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base"},React.createElement(Icon,{name:"icon-gui-chevron-down-outline",size:"16px",additionalCSS:"rotate-180"})),React.createElement(Select.Viewport,{className:"rounded-lg font-sans"},apiKeys.map(apiKeyItem=>React.createElement(Select.Group,{key:apiKeyItem.app},apiKeys.length>1&&React.createElement(Select.Label,{className:"text-neutral-700 rounded-none dark:text-neutral-600 p-1 bg-neutral-200 dark:bg-neutral-1100"},apiKeyItem.app),apiKeyItem.keys.map(({name,key})=>React.createElement(Select.Item,{key:`${apiKeyItem.app}-${name}-${key}`,value:key,className:"relative flex items-center justify-between m-2 p-2 rounded-lg text-14 text-neutral-1300 dark:text-neutral-000 select-none hover:bg-neutral-100 dark:hover:bg-neutral-1200 data-[highlighted]:outline-none data-[highlighted]:bg-neutral-100 dark:data-[highlighted]:bg-neutral-1200 focus-base min-w-64"},React.createElement(Select.ItemText,null,key.length>10?`${key.substring(0,10)}...`:key,React.createElement("span",{className:"font-light"},name&&` - ${name}`)),React.createElement(Select.ItemIndicator,{className:"size-4"},React.createElement(Icon,{name:"icon-gui-check-micro",size:"16px"}))))))),React.createElement(Select.ScrollDownButton,{className:"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base"},React.createElement(Icon,{name:"icon-gui-chevron-down-outline",size:"16px"})))))},[apiKeys,isDemoMode,selectedApiKey,onApiKeyChange,renderDemoMode]);return React.createElement("div",{className:"flex items-center border-t border-neutral-200 dark:border-neutral-1100 px-3 py-3"},React.createElement("span",{className:"ui-text-label4 text-neutral-700 dark:text-neutral-600 mr-1"},"API key:"),renderApiKeyDropdown)};ApiKeySelector.displayName="ApiKeySelector";export default ApiKeySelector;
 //# sourceMappingURL=ApiKeySelector.js.map

package/core/CodeSnippet/ApiKeySelector.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/core/CodeSnippet/ApiKeySelector.tsx"],"sourcesContent":["import React, { memo, useMemo } from \"react\";\nimport * as Select from \"@radix-ui/react-select\";\nimport Badge from \"../Badge\";\nimport Icon from \"../Icon\";\nimport Tooltip from \"../Tooltip\";\n\ninterface ApiKeySelectorProps {\n  apiKeys?: string[];\n  selectedApiKey: string;\n  onApiKeyChange: (apiKey: string) => void;\n}\n\n// Define constants at the module level\nconst SPECIAL_API_KEYS = {\n  DEMO: \"demo\",\n} as const;\n\nconst ApiKeySelector = memo(\n  ({ apiKeys, selectedApiKey, onApiKeyChange }: ApiKeySelectorProps) => {\n    // Check if we're in demo mode - only compute this once\n    const isDemoMode = useMemo(\n      () => apiKeys?.length === 1 && apiKeys[0] === SPECIAL_API_KEYS.DEMO,\n      [apiKeys],\n    );\n\n    // Memoize API key items to prevent recreating them on each render\n    const apiKeyItems = useMemo(() => {\n      if (!apiKeys?.length || isDemoMode) return null;\n\n      return apiKeys.map((key) => (\n        <Select.Item\n          key={key}\n          value={key}\n          className=\"relative flex items-center rounded px-2 py-1.5 text-14 text-neutral-1300 dark:text-neutral-000 select-none hover:bg-neutral-100 dark:hover:bg-neutral-1200 data-[highlighted]:outline-none data-[highlighted]:bg-neutral-100 dark:data-[highlighted]:bg-neutral-1200 focus-base\"\n        >\n          <Select.ItemText>{key}</Select.ItemText>\n          <Select.ItemIndicator className=\"absolute right-2\">\n            <Icon name=\"icon-gui-check-outline\" size=\"16px\" />\n          </Select.ItemIndicator>\n        </Select.Item>\n      ));\n    }, [apiKeys, isDemoMode]);\n\n    // Render the demo mode UI\n    const renderDemoMode = useMemo(\n      () => (\n        <div className=\"flex items-center\">\n          <Badge className=\"ml-1 bg-neutral-200 dark:bg-neutral-1100\">\n            DEMO ONLY\n          </Badge>\n          <Tooltip\n            className=\"ml-0\"\n            triggerElement={\n              <Icon\n                name=\"icon-gui-information-circle-outline\"\n                size=\"16px\"\n                color=\"text-neutral-700 dark:text-neutral-600\"\n              />\n            }\n          >\n            This code example uses a temporary key that is rate limited and\n            expires in 4 hrs. Sign in to Ably to use your API keys instead.\n          </Tooltip>\n        </div>\n      ),\n      [],\n    );\n\n    // Render the dropdown only if we have API keys\n    const renderApiKeyDropdown = useMemo(() => {\n      if (isDemoMode) {\n        return renderDemoMode;\n      }\n\n      if (!apiKeys?.length) {\n        return null;\n      }\n\n      return (\n        <Select.Root value={selectedApiKey} onValueChange={onApiKeyChange}>\n          <Select.Trigger\n            className=\"inline-flex items-center justify-between rounded px-2 py-1 text-14 text-neutral-1300 dark:text-neutral-000 bg-neutral-200 dark:bg-neutral-1100 hover:bg-neutral-300 dark:hover:bg-neutral-1000 gap-1 focus-base\"\n            aria-label=\"API Key\"\n          >\n            <Select.Value />\n            <Select.Icon>\n              <Icon name=\"icon-gui-chevron-down-outline\" size=\"16px\" />\n            </Select.Icon>\n          </Select.Trigger>\n\n          <Select.Portal>\n            <Select.Content className=\"overflow-hidden rounded-md bg-neutral-000 dark:bg-neutral-1300 border border-neutral-200 dark:border-neutral-1000 shadow-md z-50\">\n              <Select.ScrollUpButton className=\"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base\">\n                <Icon\n                  name=\"icon-gui-chevron-down-outline\"\n                  size=\"16px\"\n                  additionalCSS=\"rotate-180\"\n                />\n              </Select.ScrollUpButton>\n\n              <Select.Viewport className=\"p-1\">{apiKeyItems}</Select.Viewport>\n\n              <Select.ScrollDownButton className=\"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base\">\n                <Icon name=\"icon-gui-chevron-down-outline\" size=\"16px\" />\n              </Select.ScrollDownButton>\n            </Select.Content>\n          </Select.Portal>\n        </Select.Root>\n      );\n    }, [\n      apiKeys,\n      isDemoMode,\n      selectedApiKey,\n      onApiKeyChange,\n      apiKeyItems,\n      renderDemoMode,\n    ]);\n\n    return (\n      <div className=\"flex items-center border-t border-neutral-200 dark:border-neutral-1100 px-3 py-3\">\n        <span className=\"ui-text-label4 text-neutral-700 dark:text-neutral-600 mr-1\">\n          API key:\n        </span>\n        {renderApiKeyDropdown}\n      </div>\n    );\n  },\n);\n\n// Define a display name to improve debugging\nApiKeySelector.displayName = \"ApiKeySelector\";\n\nexport default ApiKeySelector;\n"],"names":["React","memo","useMemo","Select","Badge","Icon","Tooltip","SPECIAL_API_KEYS","DEMO","ApiKeySelector","apiKeys","selectedApiKey","onApiKeyChange","isDemoMode","length","apiKeyItems","map","key","Item","value","className","ItemText","ItemIndicator","name","size","renderDemoMode","div","triggerElement","color","renderApiKeyDropdown","Root","onValueChange","Trigger","aria-label","Value","Portal","Content","ScrollUpButton","additionalCSS","Viewport","ScrollDownButton","span","displayName"],"mappings":"AAAA,OAAOA,OAASC,IAAI,CAAEC,OAAO,KAAQ,OAAQ,AAC7C,WAAYC,WAAY,wBAAyB,AACjD,QAAOC,UAAW,UAAW,AAC7B,QAAOC,SAAU,SAAU,AAC3B,QAAOC,YAAa,YAAa,CASjC,MAAMC,iBAAmB,CACvBC,KAAM,MACR,EAEA,MAAMC,eAAiBR,KACrB,CAAC,CAAES,OAAO,CAAEC,cAAc,CAAEC,cAAc,CAAuB,IAE/D,MAAMC,WAAaX,QACjB,IAAMQ,SAASI,SAAW,GAAKJ,OAAO,CAAC,EAAE,GAAKH,iBAAiBC,IAAI,CACnE,CAACE,QAAQ,EAIX,MAAMK,YAAcb,QAAQ,KAC1B,GAAI,CAACQ,SAASI,QAAUD,WAAY,OAAO,KAE3C,OAAOH,QAAQM,GAAG,CAAC,AAACC,KAClB,oBAACd,OAAOe,IAAI,EACVD,IAAKA,IACLE,MAAOF,IACPG,UAAU,mRAEV,oBAACjB,OAAOkB,QAAQ,MAAEJ,KAClB,oBAACd,OAAOmB,aAAa,EAACF,UAAU,oBAC9B,oBAACf,MAAKkB,KAAK,yBAAyBC,KAAK,WAIjD,EAAG,CAACd,QAASG,WAAW,EAGxB,MAAMY,eAAiBvB,QACrB,IACE,oBAACwB,OAAIN,UAAU,qBACb,oBAAChB,OAAMgB,UAAU,4CAA2C,aAG5D,oBAACd,SACCc,UAAU,OACVO,eACE,oBAACtB,MACCkB,KAAK,sCACLC,KAAK,OACLI,MAAM,4CAGX,oIAML,EAAE,EAIJ,MAAMC,qBAAuB3B,QAAQ,KACnC,GAAIW,WAAY,CACd,OAAOY,cACT,CAEA,GAAI,CAACf,SAASI,OAAQ,CACpB,OAAO,IACT,CAEA,OACE,oBAACX,OAAO2B,IAAI,EAACX,MAAOR,eAAgBoB,cAAenB,gBACjD,oBAACT,OAAO6B,OAAO,EACbZ,UAAU,kNACVa,aAAW,WAEX,oBAAC9B,OAAO+B,KAAK,OACb,oBAAC/B,OAAOE,IAAI,MACV,oBAACA,MAAKkB,KAAK,gCAAgCC,KAAK,WAIpD,oBAACrB,OAAOgC,MAAM,MACZ,oBAAChC,OAAOiC,OAAO,EAAChB,UAAU,oIACxB,oBAACjB,OAAOkC,cAAc,EAACjB,UAAU,8IAC/B,oBAACf,MACCkB,KAAK,gCACLC,KAAK,OACLc,cAAc,gBAIlB,oBAACnC,OAAOoC,QAAQ,EAACnB,UAAU,OAAOL,aAElC,oBAACZ,OAAOqC,gBAAgB,EAACpB,UAAU,8IACjC,oBAACf,MAAKkB,KAAK,gCAAgCC,KAAK,YAM5D,EAAG,CACDd,QACAG,WACAF,eACAC,eACAG,YACAU,eACD,EAED,OACE,oBAACC,OAAIN,UAAU,oFACb,oBAACqB,QAAKrB,UAAU,8DAA6D,YAG5ES,qBAGP,EAIFpB,CAAAA,eAAeiC,WAAW,CAAG,gBAE7B,gBAAejC,cAAe"}
+{"version":3,"sources":["../../../src/core/CodeSnippet/ApiKeySelector.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport * as Select from \"@radix-ui/react-select\";\nimport Badge from \"../Badge\";\nimport Icon from \"../Icon\";\nimport Tooltip from \"../Tooltip\";\nimport type { ApiKeysItem } from \"../CodeSnippet\";\n\ntype ApiKeySelectorProps = {\n  apiKeys?: ApiKeysItem[];\n  selectedApiKey: string;\n  onApiKeyChange: (apiKey: string) => void;\n};\n\nconst ApiKeySelector = ({\n  apiKeys,\n  selectedApiKey,\n  onApiKeyChange,\n}: ApiKeySelectorProps) => {\n  const isDemoMode = useMemo(\n    () => apiKeys?.length === 1 && apiKeys[0].app === \"demo\",\n    [apiKeys],\n  );\n\n  // Render the demo mode UI\n  const renderDemoMode = useMemo(\n    () => (\n      <div className=\"flex items-center gap-2\">\n        <Badge className=\"ml-1 bg-neutral-200 dark:bg-neutral-1100\">\n          DEMO ONLY\n        </Badge>\n        <Tooltip\n          className=\"ml-0\"\n          triggerElement={\n            <Icon\n              name=\"icon-gui-information-circle-outline\"\n              size=\"16px\"\n              color=\"text-neutral-700 dark:text-neutral-600\"\n            />\n          }\n        >\n          This code example uses a temporary key that is rate limited and\n          expires in 4 hrs. Sign in to Ably to use your API keys instead.\n        </Tooltip>\n      </div>\n    ),\n    [],\n  );\n\n  // Render the dropdown only if we have API keys\n  const renderApiKeyDropdown = useMemo(() => {\n    if (isDemoMode) {\n      return renderDemoMode;\n    }\n\n    if (!apiKeys?.length) {\n      return null;\n    }\n\n    return (\n      <Select.Root value={selectedApiKey} onValueChange={onApiKeyChange}>\n        <Select.Trigger\n          className=\"font-sans inline-flex items-center justify-between rounded px-3 py-2 ml-1 text-14 text-neutral-1300 dark:text-neutral-000 bg-neutral-200 dark:bg-neutral-1100 hover:bg-neutral-300 dark:hover:bg-neutral-1000 gap-2 focus-base border\"\n          aria-label=\"API Key\"\n        >\n          <Select.Value />\n          <Select.Icon className=\"size-4\">\n            <Icon name=\"icon-gui-chevron-down-micro\" size=\"16px\" />\n          </Select.Icon>\n        </Select.Trigger>\n\n        <Select.Portal>\n          <Select.Content className=\"overflow-hidden rounded-lg bg-neutral-000 dark:bg-neutral-1300 border border-neutral-200 dark:border-neutral-1000 shadow-md z-50\">\n            <Select.ScrollUpButton className=\"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base\">\n              <Icon\n                name=\"icon-gui-chevron-down-outline\"\n                size=\"16px\"\n                additionalCSS=\"rotate-180\"\n              />\n            </Select.ScrollUpButton>\n\n            <Select.Viewport className=\"rounded-lg font-sans\">\n              {apiKeys.map((apiKeyItem) => (\n                <Select.Group key={apiKeyItem.app}>\n                  {apiKeys.length > 1 && (\n                    <Select.Label className=\"text-neutral-700 rounded-none dark:text-neutral-600 p-1 bg-neutral-200 dark:bg-neutral-1100\">\n                      {apiKeyItem.app}\n                    </Select.Label>\n                  )}\n                  {apiKeyItem.keys.map(({ name, key }) => (\n                    <Select.Item\n                      key={`${apiKeyItem.app}-${name}-${key}`}\n                      value={key}\n                      className=\"relative flex items-center justify-between m-2 p-2 rounded-lg text-14 text-neutral-1300 dark:text-neutral-000 select-none hover:bg-neutral-100 dark:hover:bg-neutral-1200 data-[highlighted]:outline-none data-[highlighted]:bg-neutral-100 dark:data-[highlighted]:bg-neutral-1200 focus-base min-w-64\"\n                    >\n                      <Select.ItemText>\n                        {key.length > 10 ? `${key.substring(0, 10)}...` : key}\n                        <span className=\"font-light\">\n                          {name && ` - ${name}`}\n                        </span>\n                      </Select.ItemText>\n                      <Select.ItemIndicator className=\"size-4\">\n                        <Icon name=\"icon-gui-check-micro\" size=\"16px\" />\n                      </Select.ItemIndicator>\n                    </Select.Item>\n                  ))}\n                </Select.Group>\n              ))}\n            </Select.Viewport>\n\n            <Select.ScrollDownButton className=\"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base\">\n              <Icon name=\"icon-gui-chevron-down-outline\" size=\"16px\" />\n            </Select.ScrollDownButton>\n          </Select.Content>\n        </Select.Portal>\n      </Select.Root>\n    );\n  }, [apiKeys, isDemoMode, selectedApiKey, onApiKeyChange, renderDemoMode]);\n\n  return (\n    <div className=\"flex items-center border-t border-neutral-200 dark:border-neutral-1100 px-3 py-3\">\n      <span className=\"ui-text-label4 text-neutral-700 dark:text-neutral-600 mr-1\">\n        API key:\n      </span>\n      {renderApiKeyDropdown}\n    </div>\n  );\n};\n\n// Define a display name to improve debugging\nApiKeySelector.displayName = \"ApiKeySelector\";\n\nexport default ApiKeySelector;\n"],"names":["React","useMemo","Select","Badge","Icon","Tooltip","ApiKeySelector","apiKeys","selectedApiKey","onApiKeyChange","isDemoMode","length","app","renderDemoMode","div","className","triggerElement","name","size","color","renderApiKeyDropdown","Root","value","onValueChange","Trigger","aria-label","Value","Portal","Content","ScrollUpButton","additionalCSS","Viewport","map","apiKeyItem","Group","key","Label","keys","Item","ItemText","substring","span","ItemIndicator","ScrollDownButton","displayName"],"mappings":"AAAA,OAAOA,OAASC,OAAO,KAAQ,OAAQ,AACvC,WAAYC,WAAY,wBAAyB,AACjD,QAAOC,UAAW,UAAW,AAC7B,QAAOC,SAAU,SAAU,AAC3B,QAAOC,YAAa,YAAa,CASjC,MAAMC,eAAiB,CAAC,CACtBC,OAAO,CACPC,cAAc,CACdC,cAAc,CACM,IACpB,MAAMC,WAAaT,QACjB,IAAMM,SAASI,SAAW,GAAKJ,OAAO,CAAC,EAAE,CAACK,GAAG,GAAK,OAClD,CAACL,QAAQ,EAIX,MAAMM,eAAiBZ,QACrB,IACE,oBAACa,OAAIC,UAAU,2BACb,oBAACZ,OAAMY,UAAU,4CAA2C,aAG5D,oBAACV,SACCU,UAAU,OACVC,eACE,oBAACZ,MACCa,KAAK,sCACLC,KAAK,OACLC,MAAM,4CAGX,oIAML,EAAE,EAIJ,MAAMC,qBAAuBnB,QAAQ,KACnC,GAAIS,WAAY,CACd,OAAOG,cACT,CAEA,GAAI,CAACN,SAASI,OAAQ,CACpB,OAAO,IACT,CAEA,OACE,oBAACT,OAAOmB,IAAI,EAACC,MAAOd,eAAgBe,cAAed,gBACjD,oBAACP,OAAOsB,OAAO,EACbT,UAAU,wOACVU,aAAW,WAEX,oBAACvB,OAAOwB,KAAK,OACb,oBAACxB,OAAOE,IAAI,EAACW,UAAU,UACrB,oBAACX,MAAKa,KAAK,8BAA8BC,KAAK,WAIlD,oBAAChB,OAAOyB,MAAM,MACZ,oBAACzB,OAAO0B,OAAO,EAACb,UAAU,oIACxB,oBAACb,OAAO2B,cAAc,EAACd,UAAU,8IAC/B,oBAACX,MACCa,KAAK,gCACLC,KAAK,OACLY,cAAc,gBAIlB,oBAAC5B,OAAO6B,QAAQ,EAAChB,UAAU,wBACxBR,QAAQyB,GAAG,CAAC,AAACC,YACZ,oBAAC/B,OAAOgC,KAAK,EAACC,IAAKF,WAAWrB,GAAG,EAC9BL,QAAQI,MAAM,CAAG,GAChB,oBAACT,OAAOkC,KAAK,EAACrB,UAAU,+FACrBkB,WAAWrB,GAAG,EAGlBqB,WAAWI,IAAI,CAACL,GAAG,CAAC,CAAC,CAAEf,IAAI,CAAEkB,GAAG,CAAE,GACjC,oBAACjC,OAAOoC,IAAI,EACVH,IAAK,CAAC,EAAEF,WAAWrB,GAAG,CAAC,CAAC,EAAEK,KAAK,CAAC,EAAEkB,IAAI,CAAC,CACvCb,MAAOa,IACPpB,UAAU,2SAEV,oBAACb,OAAOqC,QAAQ,MACbJ,IAAIxB,MAAM,CAAG,GAAK,CAAC,EAAEwB,IAAIK,SAAS,CAAC,EAAG,IAAI,GAAG,CAAC,CAAGL,IAClD,oBAACM,QAAK1B,UAAU,cACbE,MAAQ,CAAC,GAAG,EAAEA,KAAK,CAAC,GAGzB,oBAACf,OAAOwC,aAAa,EAAC3B,UAAU,UAC9B,oBAACX,MAAKa,KAAK,uBAAuBC,KAAK,eAQnD,oBAAChB,OAAOyC,gBAAgB,EAAC5B,UAAU,8IACjC,oBAACX,MAAKa,KAAK,gCAAgCC,KAAK,YAM5D,EAAG,CAACX,QAASG,WAAYF,eAAgBC,eAAgBI,eAAe,EAExE,OACE,oBAACC,OAAIC,UAAU,oFACb,oBAAC0B,QAAK1B,UAAU,8DAA6D,YAG5EK,qBAGP,CAGAd,CAAAA,eAAesC,WAAW,CAAG,gBAE7B,gBAAetC,cAAe"}

package/core/CodeSnippet/CopyButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/core/CodeSnippet/CopyButton.tsx"],"sourcesContent":["import React, { memo } from \"react\";\nimport Icon from \"../Icon\";\nimport TooltipButton from \"./TooltipButton\";\n\ninterface CopyButtonProps {\n  onCopy: () => void;\n  isCopied: boolean;\n  tooltip?: string;\n}\n\n/**\n * A reusable copy button component with tooltip and copied indicator\n */\nconst CopyButton = memo(\n  ({ onCopy, isCopied, tooltip = \"Copy\" }: CopyButtonProps) => {\n    return (\n      <div className=\"absolute top-2 right-2 z-10\">\n        <TooltipButton tooltip={tooltip} onClick={onCopy} variant=\"icon-button\">\n          <Icon\n            name=\"icon-gui-document-duplicate-outline\"\n            size=\"20px\"\n            color=\"text-neutral-1300 dark:text-neutral-000\"\n          />\n        </TooltipButton>\n\n        {isCopied ? (\n          <div className=\"absolute right-10 top-0 bg-neutral-1300 dark:bg-neutral-000 text-neutral-000 dark:text-neutral-1300 py-1.5 px-3 rounded ui-text-label4 whitespace-nowrap\">\n            Copied!\n          </div>\n        ) : null}\n      </div>\n    );\n  },\n);\n\n// Add displayName for better debugging\nCopyButton.displayName = \"CopyButton\";\n\nexport default CopyButton;\n"],"names":["React","memo","Icon","TooltipButton","CopyButton","onCopy","isCopied","tooltip","div","className","onClick","variant","name","size","color","displayName"],"mappings":"AAAA,OAAOA,OAASC,IAAI,KAAQ,OAAQ,AACpC,QAAOC,SAAU,SAAU,AAC3B,QAAOC,kBAAmB,iBAAkB,CAW5C,MAAMC,WAAaH,KACjB,CAAC,CAAEI,MAAM,CAAEC,QAAQ,CAAEC,QAAU,MAAM,CAAmB,IACtD,OACE,oBAACC,OAAIC,UAAU,+BACb,oBAACN,eAAcI,QAASA,QAASG,QAASL,OAAQM,QAAQ,eACxD,oBAACT,MACCU,KAAK,sCACLC,KAAK,OACLC,MAAM,6CAITR,SACC,oBAACE,OAAIC,UAAU,4JAA2J,WAGxK,KAGV,EAIFL,CAAAA,WAAWW,WAAW,CAAG,YAEzB,gBAAeX,UAAW"}
+{"version":3,"sources":["../../../src/core/CodeSnippet/CopyButton.tsx"],"sourcesContent":["import React, { memo } from \"react\";\nimport Icon from \"../Icon\";\nimport TooltipButton from \"./TooltipButton\";\n\ntype CopyButtonProps = {\n  onCopy: () => void;\n  isCopied: boolean;\n  tooltip?: string;\n};\n\n/**\n * A reusable copy button component with tooltip and copied indicator\n */\nconst CopyButton = memo(\n  ({ onCopy, isCopied, tooltip = \"Copy\" }: CopyButtonProps) => {\n    return (\n      <div className=\"absolute top-2 right-2 z-10\">\n        <TooltipButton tooltip={tooltip} onClick={onCopy} variant=\"icon-button\">\n          <Icon\n            name=\"icon-gui-document-duplicate-outline\"\n            size=\"20px\"\n            color=\"text-neutral-1300 dark:text-neutral-000\"\n          />\n        </TooltipButton>\n\n        {isCopied ? (\n          <div className=\"absolute right-10 top-0 bg-neutral-1300 dark:bg-neutral-000 text-neutral-000 dark:text-neutral-1300 py-1.5 px-3 rounded ui-text-label4 whitespace-nowrap\">\n            Copied!\n          </div>\n        ) : null}\n      </div>\n    );\n  },\n);\n\n// Add displayName for better debugging\nCopyButton.displayName = \"CopyButton\";\n\nexport default CopyButton;\n"],"names":["React","memo","Icon","TooltipButton","CopyButton","onCopy","isCopied","tooltip","div","className","onClick","variant","name","size","color","displayName"],"mappings":"AAAA,OAAOA,OAASC,IAAI,KAAQ,OAAQ,AACpC,QAAOC,SAAU,SAAU,AAC3B,QAAOC,kBAAmB,iBAAkB,CAW5C,MAAMC,WAAaH,KACjB,CAAC,CAAEI,MAAM,CAAEC,QAAQ,CAAEC,QAAU,MAAM,CAAmB,IACtD,OACE,oBAACC,OAAIC,UAAU,+BACb,oBAACN,eAAcI,QAASA,QAASG,QAASL,OAAQM,QAAQ,eACxD,oBAACT,MACCU,KAAK,sCACLC,KAAK,OACLC,MAAM,6CAITR,SACC,oBAACE,OAAIC,UAAU,4JAA2J,WAGxK,KAGV,EAIFL,CAAAA,WAAWW,WAAW,CAAG,YAEzB,gBAAeX,UAAW"}

package/core/CodeSnippet/LanguageSelector.js

@@ -1,2 +1,2 @@
-import React,{memo,useMemo}from"react";import*as Select from"@radix-ui/react-select";import Icon from"../Icon";import TooltipButton from"./TooltipButton";const LanguageSelector=memo(({languages,activeLanguage,onLanguageChange,getLanguageDisplayName,getLanguageIcon,activeLanguageInfo})=>{const desktopLanguageElements=useMemo(()=>languages.map(lang=>{const active=activeLanguage===lang;const displayName=getLanguageDisplayName(lang);return React.createElement(TooltipButton,{key:lang,tooltip:displayName,active:active,onClick:()=>onLanguageChange(lang),icon:getLanguageIcon(lang),variant:"segmented",size:"sm"},displayName)}),[languages,activeLanguage,onLanguageChange,getLanguageDisplayName,getLanguageIcon]);const mobileLanguageElements=useMemo(()=>languages.map(lang=>React.createElement(Select.Item,{key:lang,value:lang,className:"relative flex items-center rounded px-2 py-1.5 text-14 text-neutral-1300 dark:text-neutral-000 select-none hover:bg-neutral-100 dark:hover:bg-neutral-1200 data-[highlighted]:outline-none data-[highlighted]:bg-neutral-100 dark:data-[highlighted]:bg-neutral-1200 focus-base"},React.createElement(Select.ItemText,{asChild:true},React.createElement("div",{className:"flex items-center gap-2"},React.createElement(Icon,{name:getLanguageIcon(lang),size:"20px"}),React.createElement("span",null,getLanguageDisplayName(lang)))),React.createElement(Select.ItemIndicator,{className:"absolute right-2"},React.createElement(Icon,{name:"icon-gui-check-outline",size:"16px"})))),[languages,getLanguageDisplayName,getLanguageIcon]);const mobileSelectValue=useMemo(()=>activeLanguage&&activeLanguageInfo?React.createElement("div",{className:"flex items-center gap-2"},React.createElement(Icon,{name:activeLanguageInfo.icon,size:"20px"}),React.createElement("span",null,activeLanguageInfo.label)):null,[activeLanguage,activeLanguageInfo]);return React.createElement("div",{className:"p-2 border-b border-neutral-200 dark:border-neutral-1100 overflow-x-auto h-[3.625rem]"},React.createElement("div",{className:"hidden sm:flex gap-2"},desktopLanguageElements),React.createElement("div",{className:"sm:hidden w-full"},React.createElement(Select.Root,{value:activeLanguage||undefined,onValueChange:onLanguageChange},React.createElement(Select.Trigger,{className:"w-full inline-flex items-center justify-between rounded-lg px-3 py-2 text-14 text-neutral-1300 dark:text-neutral-000 bg-neutral-200 dark:bg-neutral-1100 hover:bg-neutral-300 dark:hover:bg-neutral-1000 gap-1 border border-neutral-300 dark:border-neutral-900 focus-base","aria-label":"Select language"},React.createElement(Select.Value,{asChild:true},mobileSelectValue),React.createElement(Select.Icon,null,React.createElement(Icon,{name:"icon-gui-chevron-down-outline",size:"16px"}))),React.createElement(Select.Portal,null,React.createElement(Select.Content,{className:"overflow-hidden rounded-md bg-neutral-000 dark:bg-neutral-1300 border border-neutral-200 dark:border-neutral-1000 shadow-md z-50 w-[var(--radix-select-trigger-width)]",position:"popper"},React.createElement(Select.ScrollUpButton,{className:"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base"},React.createElement(Icon,{name:"icon-gui-chevron-down-outline",size:"16px",additionalCSS:"rotate-180"})),React.createElement(Select.Viewport,{className:"p-1"},mobileLanguageElements),React.createElement(Select.ScrollDownButton,{className:"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base"},React.createElement(Icon,{name:"icon-gui-chevron-down-outline",size:"16px"})))))))});LanguageSelector.displayName="LanguageSelector";export default LanguageSelector;
+import React,{memo,useMemo}from"react";import*as Select from"@radix-ui/react-select";import Icon from"../Icon";import TooltipButton from"./TooltipButton";import{getLanguageInfo}from"./languages";const LanguageSelector=memo(({languages,activeLanguage,onLanguageChange})=>{const desktopLanguageElements=useMemo(()=>languages.map(lang=>{const active=activeLanguage===lang;const displayName=getLanguageInfo(lang).label;return React.createElement(TooltipButton,{key:lang,tooltip:displayName,active:active,onClick:()=>onLanguageChange(lang),icon:getLanguageInfo(lang).icon,variant:"segmented",size:"sm"},displayName)}),[languages,activeLanguage,onLanguageChange]);const mobileLanguageElements=useMemo(()=>languages.map(lang=>React.createElement(Select.Item,{key:lang,value:lang,className:"relative flex items-center rounded px-2 py-1.5 text-14 text-neutral-1300 dark:text-neutral-000 select-none hover:bg-neutral-100 dark:hover:bg-neutral-1200 data-[highlighted]:outline-none data-[highlighted]:bg-neutral-100 dark:data-[highlighted]:bg-neutral-1200 focus-base"},React.createElement(Select.ItemText,{asChild:true},React.createElement("div",{className:"flex items-center gap-2"},React.createElement(Icon,{name:getLanguageInfo(lang).icon,size:"20px"}),React.createElement("span",null,getLanguageInfo(lang).label))),React.createElement(Select.ItemIndicator,{className:"absolute right-2"},React.createElement(Icon,{name:"icon-gui-check-outline",size:"16px"})))),[languages]);const mobileSelectValue=useMemo(()=>activeLanguage?React.createElement("div",{className:"flex items-center gap-2"},React.createElement(Icon,{name:getLanguageInfo(activeLanguage).icon,size:"20px"}),React.createElement("span",null,getLanguageInfo(activeLanguage).label)):null,[activeLanguage]);return React.createElement("div",{className:"p-2 border-b border-neutral-200 dark:border-neutral-1100 overflow-x-auto h-[3.625rem]"},React.createElement("div",{className:"hidden sm:flex gap-2"},desktopLanguageElements),React.createElement("div",{className:"sm:hidden w-full"},React.createElement(Select.Root,{value:activeLanguage||undefined,onValueChange:onLanguageChange},React.createElement(Select.Trigger,{className:"w-full inline-flex items-center justify-between rounded-lg px-3 py-2 text-14 text-neutral-1300 dark:text-neutral-000 bg-neutral-200 dark:bg-neutral-1100 hover:bg-neutral-300 dark:hover:bg-neutral-1000 gap-1 border border-neutral-300 dark:border-neutral-900 focus-base","aria-label":"Select language"},React.createElement(Select.Value,{asChild:true},mobileSelectValue),React.createElement(Select.Icon,null,React.createElement(Icon,{name:"icon-gui-chevron-down-outline",size:"16px"}))),React.createElement(Select.Portal,null,React.createElement(Select.Content,{className:"overflow-hidden rounded-md bg-neutral-000 dark:bg-neutral-1300 border border-neutral-200 dark:border-neutral-1000 shadow-md z-50 w-[var(--radix-select-trigger-width)]",position:"popper"},React.createElement(Select.ScrollUpButton,{className:"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base"},React.createElement(Icon,{name:"icon-gui-chevron-down-outline",size:"16px",additionalCSS:"rotate-180"})),React.createElement(Select.Viewport,{className:"p-1"},mobileLanguageElements),React.createElement(Select.ScrollDownButton,{className:"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base"},React.createElement(Icon,{name:"icon-gui-chevron-down-outline",size:"16px"})))))))});LanguageSelector.displayName="LanguageSelector";export default LanguageSelector;
 //# sourceMappingURL=LanguageSelector.js.map

package/core/CodeSnippet/LanguageSelector.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/core/CodeSnippet/LanguageSelector.tsx"],"sourcesContent":["import React, { memo, useMemo } from \"react\";\nimport * as Select from \"@radix-ui/react-select\";\nimport Icon from \"../Icon\";\nimport { IconName } from \"../Icon/types\";\nimport TooltipButton from \"./TooltipButton\";\nimport { LanguageInfo } from \"./languages\";\n\ninterface LanguageSelectorProps {\n  languages: string[];\n  activeLanguage: string | null;\n  onLanguageChange: (language: string) => void;\n  getLanguageDisplayName: (lang: string) => string;\n  getLanguageIcon: (lang: string) => IconName;\n  activeLanguageInfo: LanguageInfo | null;\n}\n\nconst LanguageSelector = memo(\n  ({\n    languages,\n    activeLanguage,\n    onLanguageChange,\n    getLanguageDisplayName,\n    getLanguageIcon,\n    activeLanguageInfo,\n  }: LanguageSelectorProps) => {\n    // Memoize the desktop language elements to avoid recreating on each render\n    const desktopLanguageElements = useMemo(\n      () =>\n        languages.map((lang) => {\n          const active = activeLanguage === lang;\n          const displayName = getLanguageDisplayName(lang);\n\n          return (\n            <TooltipButton\n              key={lang}\n              tooltip={displayName}\n              active={active}\n              onClick={() => onLanguageChange(lang)}\n              icon={getLanguageIcon(lang)}\n              variant=\"segmented\"\n              size=\"sm\"\n            >\n              {displayName}\n            </TooltipButton>\n          );\n        }),\n      [\n        languages,\n        activeLanguage,\n        onLanguageChange,\n        getLanguageDisplayName,\n        getLanguageIcon,\n      ],\n    );\n\n    // Memoize the mobile language elements\n    const mobileLanguageElements = useMemo(\n      () =>\n        languages.map((lang) => (\n          <Select.Item\n            key={lang}\n            value={lang}\n            className=\"relative flex items-center rounded px-2 py-1.5 text-14 text-neutral-1300 dark:text-neutral-000 select-none hover:bg-neutral-100 dark:hover:bg-neutral-1200 data-[highlighted]:outline-none data-[highlighted]:bg-neutral-100 dark:data-[highlighted]:bg-neutral-1200 focus-base\"\n          >\n            <Select.ItemText asChild>\n              <div className=\"flex items-center gap-2\">\n                <Icon name={getLanguageIcon(lang)} size=\"20px\" />\n                <span>{getLanguageDisplayName(lang)}</span>\n              </div>\n            </Select.ItemText>\n            <Select.ItemIndicator className=\"absolute right-2\">\n              <Icon name=\"icon-gui-check-outline\" size=\"16px\" />\n            </Select.ItemIndicator>\n          </Select.Item>\n        )),\n      [languages, getLanguageDisplayName, getLanguageIcon],\n    );\n\n    // Memoize the mobile Select.Value content as it's recreated on every render\n    const mobileSelectValue = useMemo(\n      () =>\n        activeLanguage && activeLanguageInfo ? (\n          <div className=\"flex items-center gap-2\">\n            <Icon name={activeLanguageInfo.icon} size=\"20px\" />\n            <span>{activeLanguageInfo.label}</span>\n          </div>\n        ) : null,\n      [activeLanguage, activeLanguageInfo],\n    );\n\n    return (\n      <div className=\"p-2 border-b border-neutral-200 dark:border-neutral-1100 overflow-x-auto h-[3.625rem]\">\n        {/* Desktop language selector - SegmentedControls */}\n        <div className=\"hidden sm:flex gap-2\">{desktopLanguageElements}</div>\n\n        {/* Mobile language selector - Select dropdown */}\n        <div className=\"sm:hidden w-full\">\n          <Select.Root\n            value={activeLanguage || undefined}\n            onValueChange={onLanguageChange}\n          >\n            <Select.Trigger\n              className=\"w-full inline-flex items-center justify-between rounded-lg px-3 py-2 text-14 text-neutral-1300 dark:text-neutral-000 bg-neutral-200 dark:bg-neutral-1100 hover:bg-neutral-300 dark:hover:bg-neutral-1000 gap-1 border border-neutral-300 dark:border-neutral-900 focus-base\"\n              aria-label=\"Select language\"\n            >\n              <Select.Value asChild>{mobileSelectValue}</Select.Value>\n              <Select.Icon>\n                <Icon name=\"icon-gui-chevron-down-outline\" size=\"16px\" />\n              </Select.Icon>\n            </Select.Trigger>\n\n            <Select.Portal>\n              <Select.Content\n                className=\"overflow-hidden rounded-md bg-neutral-000 dark:bg-neutral-1300 border border-neutral-200 dark:border-neutral-1000 shadow-md z-50 w-[var(--radix-select-trigger-width)]\"\n                position=\"popper\"\n              >\n                <Select.ScrollUpButton className=\"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base\">\n                  <Icon\n                    name=\"icon-gui-chevron-down-outline\"\n                    size=\"16px\"\n                    additionalCSS=\"rotate-180\"\n                  />\n                </Select.ScrollUpButton>\n\n                <Select.Viewport className=\"p-1\">\n                  {mobileLanguageElements}\n                </Select.Viewport>\n\n                <Select.ScrollDownButton className=\"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base\">\n                  <Icon name=\"icon-gui-chevron-down-outline\" size=\"16px\" />\n                </Select.ScrollDownButton>\n              </Select.Content>\n            </Select.Portal>\n          </Select.Root>\n        </div>\n      </div>\n    );\n  },\n);\n\n// Define a display name to improve debugging\nLanguageSelector.displayName = \"LanguageSelector\";\n\nexport default LanguageSelector;\n"],"names":["React","memo","useMemo","Select","Icon","TooltipButton","LanguageSelector","languages","activeLanguage","onLanguageChange","getLanguageDisplayName","getLanguageIcon","activeLanguageInfo","desktopLanguageElements","map","lang","active","displayName","key","tooltip","onClick","icon","variant","size","mobileLanguageElements","Item","value","className","ItemText","asChild","div","name","span","ItemIndicator","mobileSelectValue","label","Root","undefined","onValueChange","Trigger","aria-label","Value","Portal","Content","position","ScrollUpButton","additionalCSS","Viewport","ScrollDownButton"],"mappings":"AAAA,OAAOA,OAASC,IAAI,CAAEC,OAAO,KAAQ,OAAQ,AAC7C,WAAYC,WAAY,wBAAyB,AACjD,QAAOC,SAAU,SAAU,AAE3B,QAAOC,kBAAmB,iBAAkB,CAY5C,MAAMC,iBAAmBL,KACvB,CAAC,CACCM,SAAS,CACTC,cAAc,CACdC,gBAAgB,CAChBC,sBAAsB,CACtBC,eAAe,CACfC,kBAAkB,CACI,IAEtB,MAAMC,wBAA0BX,QAC9B,IACEK,UAAUO,GAAG,CAAC,AAACC,OACb,MAAMC,OAASR,iBAAmBO,KAClC,MAAME,YAAcP,uBAAuBK,MAE3C,OACE,oBAACV,eACCa,IAAKH,KACLI,QAASF,YACTD,OAAQA,OACRI,QAAS,IAAMX,iBAAiBM,MAChCM,KAAMV,gBAAgBI,MACtBO,QAAQ,YACRC,KAAK,MAEJN,YAGP,GACF,CACEV,UACAC,eACAC,iBACAC,uBACAC,gBACD,EAIH,MAAMa,uBAAyBtB,QAC7B,IACEK,UAAUO,GAAG,CAAC,AAACC,MACb,oBAACZ,OAAOsB,IAAI,EACVP,IAAKH,KACLW,MAAOX,KACPY,UAAU,mRAEV,oBAACxB,OAAOyB,QAAQ,EAACC,QAAAA,MACf,oBAACC,OAAIH,UAAU,2BACb,oBAACvB,MAAK2B,KAAMpB,gBAAgBI,MAAOQ,KAAK,SACxC,oBAACS,YAAMtB,uBAAuBK,SAGlC,oBAACZ,OAAO8B,aAAa,EAACN,UAAU,oBAC9B,oBAACvB,MAAK2B,KAAK,yBAAyBR,KAAK,YAIjD,CAAChB,UAAWG,uBAAwBC,gBAAgB,EAItD,MAAMuB,kBAAoBhC,QACxB,IACEM,gBAAkBI,mBAChB,oBAACkB,OAAIH,UAAU,2BACb,oBAACvB,MAAK2B,KAAMnB,mBAAmBS,IAAI,CAAEE,KAAK,SAC1C,oBAACS,YAAMpB,mBAAmBuB,KAAK,GAE/B,KACN,CAAC3B,eAAgBI,mBAAmB,EAGtC,OACE,oBAACkB,OAAIH,UAAU,yFAEb,oBAACG,OAAIH,UAAU,wBAAwBd,yBAGvC,oBAACiB,OAAIH,UAAU,oBACb,oBAACxB,OAAOiC,IAAI,EACVV,MAAOlB,gBAAkB6B,UACzBC,cAAe7B,kBAEf,oBAACN,OAAOoC,OAAO,EACbZ,UAAU,8QACVa,aAAW,mBAEX,oBAACrC,OAAOsC,KAAK,EAACZ,QAAAA,MAASK,mBACvB,oBAAC/B,OAAOC,IAAI,MACV,oBAACA,MAAK2B,KAAK,gCAAgCR,KAAK,WAIpD,oBAACpB,OAAOuC,MAAM,MACZ,oBAACvC,OAAOwC,OAAO,EACbhB,UAAU,yKACViB,SAAS,UAET,oBAACzC,OAAO0C,cAAc,EAAClB,UAAU,8IAC/B,oBAACvB,MACC2B,KAAK,gCACLR,KAAK,OACLuB,cAAc,gBAIlB,oBAAC3C,OAAO4C,QAAQ,EAACpB,UAAU,OACxBH,wBAGH,oBAACrB,OAAO6C,gBAAgB,EAACrB,UAAU,8IACjC,oBAACvB,MAAK2B,KAAK,gCAAgCR,KAAK,cAQhE,EAIFjB,CAAAA,iBAAiBW,WAAW,CAAG,kBAE/B,gBAAeX,gBAAiB"}
+{"version":3,"sources":["../../../src/core/CodeSnippet/LanguageSelector.tsx"],"sourcesContent":["import React, { memo, useMemo } from \"react\";\nimport * as Select from \"@radix-ui/react-select\";\nimport Icon from \"../Icon\";\nimport TooltipButton from \"./TooltipButton\";\nimport { getLanguageInfo } from \"./languages\";\n\ntype LanguageSelectorProps = {\n  languages: string[];\n  activeLanguage: string;\n  onLanguageChange: (language: string) => void;\n};\n\nconst LanguageSelector = memo(\n  ({ languages, activeLanguage, onLanguageChange }: LanguageSelectorProps) => {\n    const desktopLanguageElements = useMemo(\n      () =>\n        languages.map((lang) => {\n          const active = activeLanguage === lang;\n          const displayName = getLanguageInfo(lang).label;\n\n          return (\n            <TooltipButton\n              key={lang}\n              tooltip={displayName}\n              active={active}\n              onClick={() => onLanguageChange(lang)}\n              icon={getLanguageInfo(lang).icon}\n              variant=\"segmented\"\n              size=\"sm\"\n            >\n              {displayName}\n            </TooltipButton>\n          );\n        }),\n      [languages, activeLanguage, onLanguageChange],\n    );\n\n    const mobileLanguageElements = useMemo(\n      () =>\n        languages.map((lang) => (\n          <Select.Item\n            key={lang}\n            value={lang}\n            className=\"relative flex items-center rounded px-2 py-1.5 text-14 text-neutral-1300 dark:text-neutral-000 select-none hover:bg-neutral-100 dark:hover:bg-neutral-1200 data-[highlighted]:outline-none data-[highlighted]:bg-neutral-100 dark:data-[highlighted]:bg-neutral-1200 focus-base\"\n          >\n            <Select.ItemText asChild>\n              <div className=\"flex items-center gap-2\">\n                <Icon name={getLanguageInfo(lang).icon} size=\"20px\" />\n                <span>{getLanguageInfo(lang).label}</span>\n              </div>\n            </Select.ItemText>\n            <Select.ItemIndicator className=\"absolute right-2\">\n              <Icon name=\"icon-gui-check-outline\" size=\"16px\" />\n            </Select.ItemIndicator>\n          </Select.Item>\n        )),\n      [languages],\n    );\n\n    const mobileSelectValue = useMemo(\n      () =>\n        activeLanguage ? (\n          <div className=\"flex items-center gap-2\">\n            <Icon name={getLanguageInfo(activeLanguage).icon} size=\"20px\" />\n            <span>{getLanguageInfo(activeLanguage).label}</span>\n          </div>\n        ) : null,\n      [activeLanguage],\n    );\n\n    return (\n      <div className=\"p-2 border-b border-neutral-200 dark:border-neutral-1100 overflow-x-auto h-[3.625rem]\">\n        <div className=\"hidden sm:flex gap-2\">{desktopLanguageElements}</div>\n\n        <div className=\"sm:hidden w-full\">\n          <Select.Root\n            value={activeLanguage || undefined}\n            onValueChange={onLanguageChange}\n          >\n            <Select.Trigger\n              className=\"w-full inline-flex items-center justify-between rounded-lg px-3 py-2 text-14 text-neutral-1300 dark:text-neutral-000 bg-neutral-200 dark:bg-neutral-1100 hover:bg-neutral-300 dark:hover:bg-neutral-1000 gap-1 border border-neutral-300 dark:border-neutral-900 focus-base\"\n              aria-label=\"Select language\"\n            >\n              <Select.Value asChild>{mobileSelectValue}</Select.Value>\n              <Select.Icon>\n                <Icon name=\"icon-gui-chevron-down-outline\" size=\"16px\" />\n              </Select.Icon>\n            </Select.Trigger>\n\n            <Select.Portal>\n              <Select.Content\n                className=\"overflow-hidden rounded-md bg-neutral-000 dark:bg-neutral-1300 border border-neutral-200 dark:border-neutral-1000 shadow-md z-50 w-[var(--radix-select-trigger-width)]\"\n                position=\"popper\"\n              >\n                <Select.ScrollUpButton className=\"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base\">\n                  <Icon\n                    name=\"icon-gui-chevron-down-outline\"\n                    size=\"16px\"\n                    additionalCSS=\"rotate-180\"\n                  />\n                </Select.ScrollUpButton>\n\n                <Select.Viewport className=\"p-1\">\n                  {mobileLanguageElements}\n                </Select.Viewport>\n\n                <Select.ScrollDownButton className=\"flex items-center justify-center h-6 bg-neutral-000 dark:bg-neutral-1300 text-neutral-1300 dark:text-neutral-000 cursor-default focus-base\">\n                  <Icon name=\"icon-gui-chevron-down-outline\" size=\"16px\" />\n                </Select.ScrollDownButton>\n              </Select.Content>\n            </Select.Portal>\n          </Select.Root>\n        </div>\n      </div>\n    );\n  },\n);\n\n// Define a display name to improve debugging\nLanguageSelector.displayName = \"LanguageSelector\";\n\nexport default LanguageSelector;\n"],"names":["React","memo","useMemo","Select","Icon","TooltipButton","getLanguageInfo","LanguageSelector","languages","activeLanguage","onLanguageChange","desktopLanguageElements","map","lang","active","displayName","label","key","tooltip","onClick","icon","variant","size","mobileLanguageElements","Item","value","className","ItemText","asChild","div","name","span","ItemIndicator","mobileSelectValue","Root","undefined","onValueChange","Trigger","aria-label","Value","Portal","Content","position","ScrollUpButton","additionalCSS","Viewport","ScrollDownButton"],"mappings":"AAAA,OAAOA,OAASC,IAAI,CAAEC,OAAO,KAAQ,OAAQ,AAC7C,WAAYC,WAAY,wBAAyB,AACjD,QAAOC,SAAU,SAAU,AAC3B,QAAOC,kBAAmB,iBAAkB,AAC5C,QAASC,eAAe,KAAQ,aAAc,CAQ9C,MAAMC,iBAAmBN,KACvB,CAAC,CAAEO,SAAS,CAAEC,cAAc,CAAEC,gBAAgB,CAAyB,IACrE,MAAMC,wBAA0BT,QAC9B,IACEM,UAAUI,GAAG,CAAC,AAACC,OACb,MAAMC,OAASL,iBAAmBI,KAClC,MAAME,YAAcT,gBAAgBO,MAAMG,KAAK,CAE/C,OACE,oBAACX,eACCY,IAAKJ,KACLK,QAASH,YACTD,OAAQA,OACRK,QAAS,IAAMT,iBAAiBG,MAChCO,KAAMd,gBAAgBO,MAAMO,IAAI,CAChCC,QAAQ,YACRC,KAAK,MAEJP,YAGP,GACF,CAACP,UAAWC,eAAgBC,iBAAiB,EAG/C,MAAMa,uBAAyBrB,QAC7B,IACEM,UAAUI,GAAG,CAAC,AAACC,MACb,oBAACV,OAAOqB,IAAI,EACVP,IAAKJ,KACLY,MAAOZ,KACPa,UAAU,mRAEV,oBAACvB,OAAOwB,QAAQ,EAACC,QAAAA,MACf,oBAACC,OAAIH,UAAU,2BACb,oBAACtB,MAAK0B,KAAMxB,gBAAgBO,MAAMO,IAAI,CAAEE,KAAK,SAC7C,oBAACS,YAAMzB,gBAAgBO,MAAMG,KAAK,IAGtC,oBAACb,OAAO6B,aAAa,EAACN,UAAU,oBAC9B,oBAACtB,MAAK0B,KAAK,yBAAyBR,KAAK,YAIjD,CAACd,UAAU,EAGb,MAAMyB,kBAAoB/B,QACxB,IACEO,eACE,oBAACoB,OAAIH,UAAU,2BACb,oBAACtB,MAAK0B,KAAMxB,gBAAgBG,gBAAgBW,IAAI,CAAEE,KAAK,SACvD,oBAACS,YAAMzB,gBAAgBG,gBAAgBO,KAAK,GAE5C,KACN,CAACP,eAAe,EAGlB,OACE,oBAACoB,OAAIH,UAAU,yFACb,oBAACG,OAAIH,UAAU,wBAAwBf,yBAEvC,oBAACkB,OAAIH,UAAU,oBACb,oBAACvB,OAAO+B,IAAI,EACVT,MAAOhB,gBAAkB0B,UACzBC,cAAe1B,kBAEf,oBAACP,OAAOkC,OAAO,EACbX,UAAU,8QACVY,aAAW,mBAEX,oBAACnC,OAAOoC,KAAK,EAACX,QAAAA,MAASK,mBACvB,oBAAC9B,OAAOC,IAAI,MACV,oBAACA,MAAK0B,KAAK,gCAAgCR,KAAK,WAIpD,oBAACnB,OAAOqC,MAAM,MACZ,oBAACrC,OAAOsC,OAAO,EACbf,UAAU,yKACVgB,SAAS,UAET,oBAACvC,OAAOwC,cAAc,EAACjB,UAAU,8IAC/B,oBAACtB,MACC0B,KAAK,gCACLR,KAAK,OACLsB,cAAc,gBAIlB,oBAACzC,OAAO0C,QAAQ,EAACnB,UAAU,OACxBH,wBAGH,oBAACpB,OAAO2C,gBAAgB,EAACpB,UAAU,8IACjC,oBAACtB,MAAK0B,KAAK,gCAAgCR,KAAK,cAQhE,EAIFf,CAAAA,iBAAiBQ,WAAW,CAAG,kBAE/B,gBAAeR,gBAAiB"}

package/core/CodeSnippet/PlainCodeView.js

@@ -0,0 +1,2 @@
+import React,{useRef,useState,useCallback,memo}from"react";import Icon from"../Icon";import Code from"../Code";import cn from"../utils/cn";import useCopyToClipboard from"../utils/useCopyToClipboard";import CopyButton from"./CopyButton";const PlainCodeView=({content,className,language,icon})=>{const{isCopied,copy}=useCopyToClipboard();const codeRef=useRef(null);const[isHovering,setIsHovering]=useState(false);const handleCopy=useCallback(()=>{copy(content)},[copy,content]);return React.createElement("div",{className:cn("rounded-lg overflow-hidden bg-neutral-000 dark:bg-neutral-1300 border border-neutral-300 dark:border-neutral-1000 relative flex items-center",language==="shell"?"min-h-[3.375rem]":"min-h-12",className),onMouseEnter:()=>setIsHovering(true),onMouseLeave:()=>setIsHovering(false),onFocus:()=>setIsHovering(true),onBlur:()=>setIsHovering(false),tabIndex:0,ref:codeRef},icon&&React.createElement("div",{className:"absolute top-2 left-2 z-10"},React.createElement("div",{className:"w-9 h-9 rounded-lg flex items-center justify-center bg-neutral-200 dark:bg-neutral-1100"},React.createElement(Icon,{name:icon,size:"20px",color:"text-neutral-1300 dark:text-neutral-000"}))),React.createElement(Code,{language:language,snippet:content,additionalCSS:cn("w-full bg-neutral-000 text-neutral-1300 dark:bg-neutral-1300 dark:text-neutral-200 px-4 py-2",icon&&"pl-14"),showLines:false}),isHovering&&React.createElement(CopyButton,{onCopy:handleCopy,isCopied:isCopied}))};PlainCodeView.displayName="PlainCodeView";export default memo(PlainCodeView);
+//# sourceMappingURL=PlainCodeView.js.map

package/core/CodeSnippet/PlainCodeView.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/core/CodeSnippet/PlainCodeView.tsx"],"sourcesContent":["import React, { useRef, useState, useCallback, memo } from \"react\";\nimport Icon from \"../Icon\";\nimport Code from \"../Code\";\nimport cn from \"../utils/cn\";\nimport useCopyToClipboard from \"../utils/useCopyToClipboard\";\nimport CopyButton from \"./CopyButton\";\nimport { IconName } from \"../Icon/types\";\n\ntype PlainCodeViewProps = {\n  content: string;\n  language: string;\n  icon: IconName | null;\n  className?: string;\n};\n\n/**\n * A specialized component for displaying plain code (shell commands, text, etc.) with copy functionality\n */\nconst PlainCodeView: React.FC<PlainCodeViewProps> = ({\n  content,\n  className,\n  language,\n  icon,\n}) => {\n  const { isCopied, copy } = useCopyToClipboard();\n  const codeRef = useRef<HTMLDivElement>(null);\n  const [isHovering, setIsHovering] = useState(false);\n\n  // Handler to copy the content\n  const handleCopy = useCallback(() => {\n    copy(content);\n  }, [copy, content]);\n\n  return (\n    <div\n      className={cn(\n        \"rounded-lg overflow-hidden bg-neutral-000 dark:bg-neutral-1300 border border-neutral-300 dark:border-neutral-1000 relative flex items-center\",\n        language === \"shell\" ? \"min-h-[3.375rem]\" : \"min-h-12\",\n        className,\n      )}\n      onMouseEnter={() => setIsHovering(true)}\n      onMouseLeave={() => setIsHovering(false)}\n      onFocus={() => setIsHovering(true)}\n      onBlur={() => setIsHovering(false)}\n      tabIndex={0}\n      ref={codeRef}\n    >\n      {icon && (\n        <div className=\"absolute top-2 left-2 z-10\">\n          <div className=\"w-9 h-9 rounded-lg flex items-center justify-center bg-neutral-200 dark:bg-neutral-1100\">\n            <Icon\n              name={icon}\n              size=\"20px\"\n              color=\"text-neutral-1300 dark:text-neutral-000\"\n            />\n          </div>\n        </div>\n      )}\n\n      <Code\n        language={language}\n        snippet={content}\n        additionalCSS={cn(\n          \"w-full bg-neutral-000 text-neutral-1300 dark:bg-neutral-1300 dark:text-neutral-200 px-4 py-2\",\n          icon && \"pl-14\",\n        )}\n        showLines={false}\n      />\n\n      {isHovering && <CopyButton onCopy={handleCopy} isCopied={isCopied} />}\n    </div>\n  );\n};\n\nPlainCodeView.displayName = \"PlainCodeView\";\n\nexport default memo(PlainCodeView);\n"],"names":["React","useRef","useState","useCallback","memo","Icon","Code","cn","useCopyToClipboard","CopyButton","PlainCodeView","content","className","language","icon","isCopied","copy","codeRef","isHovering","setIsHovering","handleCopy","div","onMouseEnter","onMouseLeave","onFocus","onBlur","tabIndex","ref","name","size","color","snippet","additionalCSS","showLines","onCopy","displayName"],"mappings":"AAAA,OAAOA,OAASC,MAAM,CAAEC,QAAQ,CAAEC,WAAW,CAAEC,IAAI,KAAQ,OAAQ,AACnE,QAAOC,SAAU,SAAU,AAC3B,QAAOC,SAAU,SAAU,AAC3B,QAAOC,OAAQ,aAAc,AAC7B,QAAOC,uBAAwB,6BAA8B,AAC7D,QAAOC,eAAgB,cAAe,CAatC,MAAMC,cAA8C,CAAC,CACnDC,OAAO,CACPC,SAAS,CACTC,QAAQ,CACRC,IAAI,CACL,IACC,KAAM,CAAEC,QAAQ,CAAEC,IAAI,CAAE,CAAGR,qBAC3B,MAAMS,QAAUhB,OAAuB,MACvC,KAAM,CAACiB,WAAYC,cAAc,CAAGjB,SAAS,OAG7C,MAAMkB,WAAajB,YAAY,KAC7Ba,KAAKL,QACP,EAAG,CAACK,KAAML,QAAQ,EAElB,OACE,oBAACU,OACCT,UAAWL,GACT,+IACAM,WAAa,QAAU,mBAAqB,WAC5CD,WAEFU,aAAc,IAAMH,cAAc,MAClCI,aAAc,IAAMJ,cAAc,OAClCK,QAAS,IAAML,cAAc,MAC7BM,OAAQ,IAAMN,cAAc,OAC5BO,SAAU,EACVC,IAAKV,SAEJH,MACC,oBAACO,OAAIT,UAAU,8BACb,oBAACS,OAAIT,UAAU,2FACb,oBAACP,MACCuB,KAAMd,KACNe,KAAK,OACLC,MAAM,8CAMd,oBAACxB,MACCO,SAAUA,SACVkB,QAASpB,QACTqB,cAAezB,GACb,+FACAO,MAAQ,SAEVmB,UAAW,QAGZf,YAAc,oBAACT,YAAWyB,OAAQd,WAAYL,SAAUA,WAG/D,CAEAL,CAAAA,cAAcyB,WAAW,CAAG,eAE5B,gBAAe/B,KAAKM,cAAe"}

package/core/CodeSnippet/TooltipButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/core/CodeSnippet/TooltipButton.tsx"],"sourcesContent":["import React, { memo, useMemo } from \"react\";\nimport Tooltip from \"../Tooltip\";\nimport SegmentedControl from \"../SegmentedControl\";\nimport cn from \"../utils/cn\";\nimport { IconName } from \"../Icon/types\";\n\ninterface TooltipButtonProps {\n  tooltip: string;\n  active?: boolean;\n  onClick: () => void;\n  icon?: IconName;\n  className?: string;\n  children?: React.ReactNode;\n  variant?: \"segmented\" | \"icon-button\";\n  size?: \"sm\" | \"md\";\n  alwaysShowLabel?: boolean;\n}\n\n/**\n * A unified tooltip button component that can render either a segmented control or an icon button\n */\nconst TooltipButton = memo(\n  ({\n    tooltip,\n    active = false,\n    onClick,\n    icon,\n    className,\n    children,\n    variant = \"segmented\",\n    size = \"sm\",\n    alwaysShowLabel = false,\n  }: TooltipButtonProps) => {\n    // Only show tooltip for inactive segmented controls or all icon buttons\n    const showTooltip =\n      (variant === \"segmented\" && !active) || variant === \"icon-button\";\n\n    // Determine whether to show children based on active state and alwaysShowLabel\n    const showChildren = active || alwaysShowLabel;\n\n    // Create the button element based on variant\n    const buttonElement = useMemo(() => {\n      if (variant === \"segmented\") {\n        return (\n          <SegmentedControl\n            size={size}\n            active={active}\n            onClick={onClick}\n            leftIcon={icon}\n            className={cn(\n              \"focus-base\",\n              active\n                ? \"bg-neutral-000 dark:bg-neutral-1300\"\n                : \"bg-neutral-100 dark:bg-neutral-1200\",\n              className,\n            )}\n          >\n            {showChildren ? children : null}\n          </SegmentedControl>\n        );\n      }\n\n      return (\n        <div\n          role=\"button\"\n          className={cn(\n            \"w-8 h-8 rounded-lg flex items-center justify-center bg-neutral-200 dark:bg-neutral-1100 hover:bg-neutral-300 dark:hover:bg-neutral-1000 transition-colors focus-base\",\n            className,\n          )}\n          onClick={onClick}\n          aria-label={tooltip}\n        >\n          {children}\n        </div>\n      );\n    }, [\n      variant,\n      size,\n      active,\n      onClick,\n      icon,\n      className,\n      showChildren,\n      children,\n      tooltip,\n    ]);\n\n    // Render with tooltip if needed\n    if (showTooltip) {\n      return (\n        <Tooltip triggerElement={buttonElement} className=\"ml-0\">\n          {tooltip}\n        </Tooltip>\n      );\n    }\n\n    return buttonElement;\n  },\n);\n\n// Add displayName for better debugging\nTooltipButton.displayName = \"TooltipButton\";\n\nexport default TooltipButton;\n"],"names":["React","memo","useMemo","Tooltip","SegmentedControl","cn","TooltipButton","tooltip","active","onClick","icon","className","children","variant","size","alwaysShowLabel","showTooltip","showChildren","buttonElement","leftIcon","div","role","aria-label","triggerElement","displayName"],"mappings":"AAAA,OAAOA,OAASC,IAAI,CAAEC,OAAO,KAAQ,OAAQ,AAC7C,QAAOC,YAAa,YAAa,AACjC,QAAOC,qBAAsB,qBAAsB,AACnD,QAAOC,OAAQ,aAAc,CAkB7B,MAAMC,cAAgBL,KACpB,CAAC,CACCM,OAAO,CACPC,OAAS,KAAK,CACdC,OAAO,CACPC,IAAI,CACJC,SAAS,CACTC,QAAQ,CACRC,QAAU,WAAW,CACrBC,KAAO,IAAI,CACXC,gBAAkB,KAAK,CACJ,IAEnB,MAAMC,YACJ,AAACH,UAAY,aAAe,CAACL,QAAWK,UAAY,cAGtD,MAAMI,aAAeT,QAAUO,gBAG/B,MAAMG,cAAgBhB,QAAQ,KAC5B,GAAIW,UAAY,YAAa,CAC3B,OACE,oBAACT,kBACCU,KAAMA,KACNN,OAAQA,OACRC,QAASA,QACTU,SAAUT,KACVC,UAAWN,GACT,aACAG,OACI,sCACA,sCACJG,YAGDM,aAAeL,SAAW,KAGjC,CAEA,OACE,oBAACQ,OACCC,KAAK,SACLV,UAAWN,GACT,uKACAM,WAEFF,QAASA,QACTa,aAAYf,SAEXK,SAGP,EAAG,CACDC,QACAC,KACAN,OACAC,QACAC,KACAC,UACAM,aACAL,SACAL,QACD,EAGD,GAAIS,YAAa,CACf,OACE,oBAACb,SAAQoB,eAAgBL,cAAeP,UAAU,QAC/CJ,QAGP,CAEA,OAAOW,aACT,EAIFZ,CAAAA,cAAckB,WAAW,CAAG,eAE5B,gBAAelB,aAAc"}
+{"version":3,"sources":["../../../src/core/CodeSnippet/TooltipButton.tsx"],"sourcesContent":["import React, { memo, useMemo } from \"react\";\nimport Tooltip from \"../Tooltip\";\nimport SegmentedControl from \"../SegmentedControl\";\nimport cn from \"../utils/cn\";\nimport { IconName } from \"../Icon/types\";\n\ntype TooltipButtonProps = {\n  tooltip: string;\n  active?: boolean;\n  onClick: () => void;\n  icon?: IconName;\n  className?: string;\n  children?: React.ReactNode;\n  variant?: \"segmented\" | \"icon-button\";\n  size?: \"sm\" | \"md\";\n  alwaysShowLabel?: boolean;\n};\n\n/**\n * A unified tooltip button component that can render either a segmented control or an icon button\n */\nconst TooltipButton = memo(\n  ({\n    tooltip,\n    active = false,\n    onClick,\n    icon,\n    className,\n    children,\n    variant = \"segmented\",\n    size = \"sm\",\n    alwaysShowLabel = false,\n  }: TooltipButtonProps) => {\n    // Only show tooltip for inactive segmented controls or all icon buttons\n    const showTooltip =\n      (variant === \"segmented\" && !active) || variant === \"icon-button\";\n\n    // Determine whether to show children based on active state and alwaysShowLabel\n    const showChildren = active || alwaysShowLabel;\n\n    // Create the button element based on variant\n    const buttonElement = useMemo(() => {\n      if (variant === \"segmented\") {\n        return (\n          <SegmentedControl\n            size={size}\n            active={active}\n            onClick={onClick}\n            leftIcon={icon}\n            className={cn(\n              \"focus-base\",\n              active\n                ? \"bg-neutral-000 dark:bg-neutral-1300\"\n                : \"bg-neutral-100 dark:bg-neutral-1200\",\n              className,\n            )}\n          >\n            {showChildren ? children : null}\n          </SegmentedControl>\n        );\n      }\n\n      return (\n        <div\n          role=\"button\"\n          className={cn(\n            \"w-8 h-8 rounded-lg flex items-center justify-center bg-neutral-200 dark:bg-neutral-1100 hover:bg-neutral-300 dark:hover:bg-neutral-1000 transition-colors focus-base\",\n            className,\n          )}\n          onClick={onClick}\n          aria-label={tooltip}\n        >\n          {children}\n        </div>\n      );\n    }, [\n      variant,\n      size,\n      active,\n      onClick,\n      icon,\n      className,\n      showChildren,\n      children,\n      tooltip,\n    ]);\n\n    // Render with tooltip if needed\n    if (showTooltip) {\n      return (\n        <Tooltip triggerElement={buttonElement} className=\"ml-0\">\n          {tooltip}\n        </Tooltip>\n      );\n    }\n\n    return buttonElement;\n  },\n);\n\n// Add displayName for better debugging\nTooltipButton.displayName = \"TooltipButton\";\n\nexport default TooltipButton;\n"],"names":["React","memo","useMemo","Tooltip","SegmentedControl","cn","TooltipButton","tooltip","active","onClick","icon","className","children","variant","size","alwaysShowLabel","showTooltip","showChildren","buttonElement","leftIcon","div","role","aria-label","triggerElement","displayName"],"mappings":"AAAA,OAAOA,OAASC,IAAI,CAAEC,OAAO,KAAQ,OAAQ,AAC7C,QAAOC,YAAa,YAAa,AACjC,QAAOC,qBAAsB,qBAAsB,AACnD,QAAOC,OAAQ,aAAc,CAkB7B,MAAMC,cAAgBL,KACpB,CAAC,CACCM,OAAO,CACPC,OAAS,KAAK,CACdC,OAAO,CACPC,IAAI,CACJC,SAAS,CACTC,QAAQ,CACRC,QAAU,WAAW,CACrBC,KAAO,IAAI,CACXC,gBAAkB,KAAK,CACJ,IAEnB,MAAMC,YACJ,AAACH,UAAY,aAAe,CAACL,QAAWK,UAAY,cAGtD,MAAMI,aAAeT,QAAUO,gBAG/B,MAAMG,cAAgBhB,QAAQ,KAC5B,GAAIW,UAAY,YAAa,CAC3B,OACE,oBAACT,kBACCU,KAAMA,KACNN,OAAQA,OACRC,QAASA,QACTU,SAAUT,KACVC,UAAWN,GACT,aACAG,OACI,sCACA,sCACJG,YAGDM,aAAeL,SAAW,KAGjC,CAEA,OACE,oBAACQ,OACCC,KAAK,SACLV,UAAWN,GACT,uKACAM,WAEFF,QAASA,QACTa,aAAYf,SAEXK,SAGP,EAAG,CACDC,QACAC,KACAN,OACAC,QACAC,KACAC,UACAM,aACAL,SACAL,QACD,EAGD,GAAIS,YAAa,CACf,OACE,oBAACb,SAAQoB,eAAgBL,cAAeP,UAAU,QAC/CJ,QAGP,CAEA,OAAOW,aACT,EAIFZ,CAAAA,cAAckB,WAAW,CAAG,eAE5B,gBAAelB,aAAc"}

package/core/CodeSnippet/languages.js

@@ -1,2 +1,2 @@
-const languages={javascript:{label:"JavaScript",icon:"icon-tech-javascript",syntaxHighlighterKey:"javascript"},typescript:{label:"TypeScript",icon:"icon-tech-typescript",syntaxHighlighterKey:"typescript"},java:{label:"Java",icon:"icon-tech-java",syntaxHighlighterKey:"java"},kotlin:{label:"Kotlin",icon:"icon-tech-kotlin",syntaxHighlighterKey:"kotlin"},python:{label:"Python",icon:"icon-tech-python",syntaxHighlighterKey:"python"},csharp:{label:"C#",icon:"icon-tech-csharp",syntaxHighlighterKey:"csharp"},go:{label:"Go",icon:"icon-tech-go",syntaxHighlighterKey:"go"},ruby:{label:"Ruby",icon:"icon-tech-ruby",syntaxHighlighterKey:"ruby"},php:{label:"PHP",icon:"icon-tech-php",syntaxHighlighterKey:"php"},nodejs:{label:"Node.js",icon:"icon-tech-nodejs",syntaxHighlighterKey:"javascript"},react:{label:"React",icon:"icon-tech-react",syntaxHighlighterKey:"javascript"},html:{label:"HTML",icon:"icon-tech-web",syntaxHighlighterKey:"xml"},shell:{label:"Shell",icon:"icon-tech-web",syntaxHighlighterKey:"bash"},json:{label:"JSON",icon:"icon-tech-json",syntaxHighlighterKey:"json"},xml:{label:"XML",icon:"icon-tech-web",syntaxHighlighterKey:"xml"},sql:{label:"SQL",icon:"icon-tech-postgres",syntaxHighlighterKey:"sql"},swift:{label:"Swift",icon:"icon-tech-swift",syntaxHighlighterKey:"swift"},cpp:{label:"C++",icon:"icon-tech-web",syntaxHighlighterKey:"cpp"},dart:{label:"Dart",icon:"icon-tech-web",syntaxHighlighterKey:"dart"},objc:{label:"Objective-C",icon:"icon-tech-objectivec",syntaxHighlighterKey:"objc"},android:{label:"Android",icon:"icon-tech-android-head",syntaxHighlighterKey:"java"},flutter:{label:"Flutter",icon:"icon-tech-flutter",syntaxHighlighterKey:"dart"}};export const getLanguageInfo=langKey=>{const key=langKey.toLowerCase();if(languages[key]){return languages[key]}return{label:langKey,icon:"icon-tech-web",syntaxHighlighterKey:langKey}};export default languages;
+const languages={javascript:{label:"JavaScript",icon:"icon-tech-javascript",syntaxHighlighterKey:"javascript"},typescript:{label:"TypeScript",icon:"icon-tech-typescript",syntaxHighlighterKey:"typescript"},java:{label:"Java",icon:"icon-tech-java",syntaxHighlighterKey:"java"},kotlin:{label:"Kotlin",icon:"icon-tech-kotlin",syntaxHighlighterKey:"kotlin"},python:{label:"Python",icon:"icon-tech-python",syntaxHighlighterKey:"python"},csharp:{label:"C#",icon:"icon-tech-csharp",syntaxHighlighterKey:"csharp"},go:{label:"Go",icon:"icon-tech-go",syntaxHighlighterKey:"go"},ruby:{label:"Ruby",icon:"icon-tech-ruby",syntaxHighlighterKey:"ruby"},php:{label:"PHP",icon:"icon-tech-php",syntaxHighlighterKey:"php"},nodejs:{label:"Node.js",icon:"icon-tech-nodejs",syntaxHighlighterKey:"javascript"},react:{label:"React",icon:"icon-tech-react",syntaxHighlighterKey:"javascript"},html:{label:"HTML",icon:"icon-tech-web",syntaxHighlighterKey:"xml"},shell:{label:"Shell",icon:"icon-tech-web",syntaxHighlighterKey:"bash"},json:{label:"JSON",icon:"icon-tech-json",syntaxHighlighterKey:"json"},xml:{label:"XML",icon:"icon-tech-web",syntaxHighlighterKey:"xml"},sql:{label:"SQL",icon:"icon-tech-postgres",syntaxHighlighterKey:"sql"},swift:{label:"Swift",icon:"icon-tech-swift",syntaxHighlighterKey:"swift"},cpp:{label:"C++",icon:"icon-tech-web",syntaxHighlighterKey:"cpp"},dart:{label:"Dart",icon:"icon-tech-web",syntaxHighlighterKey:"dart"},objc:{label:"Objective-C",icon:"icon-tech-objectivec",syntaxHighlighterKey:"objc"},android:{label:"Android",icon:"icon-tech-android-head",syntaxHighlighterKey:"java"},flutter:{label:"Flutter",icon:"icon-tech-flutter",syntaxHighlighterKey:"dart"}};export const stripSdkType=lang=>{if(lang.startsWith("realtime_")||lang.startsWith("rest_")){return lang.split("_").slice(1).join("_")}return lang};export const getLanguageInfo=langKey=>{const key=stripSdkType(langKey).toLowerCase();if(languages[key]){return languages[key]}return{label:langKey,icon:"icon-tech-web",syntaxHighlighterKey:langKey}};export default languages;
 //# sourceMappingURL=languages.js.map

package/core/CodeSnippet/languages.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/core/CodeSnippet/languages.tsx"],"sourcesContent":["import { IconName } from \"../Icon/types\";\n\nexport interface LanguageInfo {\n  label: string;\n  icon: IconName;\n  syntaxHighlighterKey?: string;\n}\n\nexport type LanguageMap = Record<string, LanguageInfo>;\n\nconst languages: LanguageMap = {\n  javascript: {\n    label: \"JavaScript\",\n    icon: \"icon-tech-javascript\",\n    syntaxHighlighterKey: \"javascript\",\n  },\n  typescript: {\n    label: \"TypeScript\",\n    icon: \"icon-tech-typescript\",\n    syntaxHighlighterKey: \"typescript\",\n  },\n  java: {\n    label: \"Java\",\n    icon: \"icon-tech-java\",\n    syntaxHighlighterKey: \"java\",\n  },\n  kotlin: {\n    label: \"Kotlin\",\n    icon: \"icon-tech-kotlin\",\n    syntaxHighlighterKey: \"kotlin\",\n  },\n  python: {\n    label: \"Python\",\n    icon: \"icon-tech-python\",\n    syntaxHighlighterKey: \"python\",\n  },\n  csharp: {\n    label: \"C#\",\n    icon: \"icon-tech-csharp\",\n    syntaxHighlighterKey: \"csharp\",\n  },\n  go: {\n    label: \"Go\",\n    icon: \"icon-tech-go\",\n    syntaxHighlighterKey: \"go\",\n  },\n  ruby: {\n    label: \"Ruby\",\n    icon: \"icon-tech-ruby\",\n    syntaxHighlighterKey: \"ruby\",\n  },\n  php: {\n    label: \"PHP\",\n    icon: \"icon-tech-php\",\n    syntaxHighlighterKey: \"php\",\n  },\n  nodejs: {\n    label: \"Node.js\",\n    icon: \"icon-tech-nodejs\",\n    syntaxHighlighterKey: \"javascript\",\n  },\n  react: {\n    label: \"React\",\n    icon: \"icon-tech-react\",\n    syntaxHighlighterKey: \"javascript\",\n  },\n  html: {\n    label: \"HTML\",\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: \"xml\",\n  },\n  shell: {\n    label: \"Shell\",\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: \"bash\",\n  },\n  json: {\n    label: \"JSON\",\n    icon: \"icon-tech-json\",\n    syntaxHighlighterKey: \"json\",\n  },\n  xml: {\n    label: \"XML\",\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: \"xml\",\n  },\n  sql: {\n    label: \"SQL\",\n    icon: \"icon-tech-postgres\",\n    syntaxHighlighterKey: \"sql\",\n  },\n  swift: {\n    label: \"Swift\",\n    icon: \"icon-tech-swift\",\n    syntaxHighlighterKey: \"swift\",\n  },\n  // New entries from languageInfo.ts\n  cpp: {\n    label: \"C++\",\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: \"cpp\",\n  },\n  dart: {\n    label: \"Dart\",\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: \"dart\",\n  },\n  objc: {\n    label: \"Objective-C\",\n    icon: \"icon-tech-objectivec\",\n    syntaxHighlighterKey: \"objc\",\n  },\n  android: {\n    label: \"Android\",\n    icon: \"icon-tech-android-head\",\n    syntaxHighlighterKey: \"java\",\n  },\n  flutter: {\n    label: \"Flutter\",\n    icon: \"icon-tech-flutter\",\n    syntaxHighlighterKey: \"dart\",\n  },\n};\n\n// Fallback function to handle languages not in the map\nexport const getLanguageInfo = (langKey: string): LanguageInfo => {\n  const key = langKey.toLowerCase();\n\n  if (languages[key]) {\n    return languages[key];\n  }\n\n  // Fallback for unknown languages\n  return {\n    label: langKey,\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: langKey,\n  };\n};\n\nexport default languages;\n"],"names":["languages","javascript","label","icon","syntaxHighlighterKey","typescript","java","kotlin","python","csharp","go","ruby","php","nodejs","react","html","shell","json","xml","sql","swift","cpp","dart","objc","android","flutter","getLanguageInfo","langKey","key","toLowerCase"],"mappings":"AAUA,MAAMA,UAAyB,CAC7BC,WAAY,CACVC,MAAO,aACPC,KAAM,uBACNC,qBAAsB,YACxB,EACAC,WAAY,CACVH,MAAO,aACPC,KAAM,uBACNC,qBAAsB,YACxB,EACAE,KAAM,CACJJ,MAAO,OACPC,KAAM,iBACNC,qBAAsB,MACxB,EACAG,OAAQ,CACNL,MAAO,SACPC,KAAM,mBACNC,qBAAsB,QACxB,EACAI,OAAQ,CACNN,MAAO,SACPC,KAAM,mBACNC,qBAAsB,QACxB,EACAK,OAAQ,CACNP,MAAO,KACPC,KAAM,mBACNC,qBAAsB,QACxB,EACAM,GAAI,CACFR,MAAO,KACPC,KAAM,eACNC,qBAAsB,IACxB,EACAO,KAAM,CACJT,MAAO,OACPC,KAAM,iBACNC,qBAAsB,MACxB,EACAQ,IAAK,CACHV,MAAO,MACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAS,OAAQ,CACNX,MAAO,UACPC,KAAM,mBACNC,qBAAsB,YACxB,EACAU,MAAO,CACLZ,MAAO,QACPC,KAAM,kBACNC,qBAAsB,YACxB,EACAW,KAAM,CACJb,MAAO,OACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAY,MAAO,CACLd,MAAO,QACPC,KAAM,gBACNC,qBAAsB,MACxB,EACAa,KAAM,CACJf,MAAO,OACPC,KAAM,iBACNC,qBAAsB,MACxB,EACAc,IAAK,CACHhB,MAAO,MACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAe,IAAK,CACHjB,MAAO,MACPC,KAAM,qBACNC,qBAAsB,KACxB,EACAgB,MAAO,CACLlB,MAAO,QACPC,KAAM,kBACNC,qBAAsB,OACxB,EAEAiB,IAAK,CACHnB,MAAO,MACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAkB,KAAM,CACJpB,MAAO,OACPC,KAAM,gBACNC,qBAAsB,MACxB,EACAmB,KAAM,CACJrB,MAAO,cACPC,KAAM,uBACNC,qBAAsB,MACxB,EACAoB,QAAS,CACPtB,MAAO,UACPC,KAAM,yBACNC,qBAAsB,MACxB,EACAqB,QAAS,CACPvB,MAAO,UACPC,KAAM,oBACNC,qBAAsB,MACxB,CACF,CAGA,QAAO,MAAMsB,gBAAkB,AAACC,UAC9B,MAAMC,IAAMD,QAAQE,WAAW,GAE/B,GAAI7B,SAAS,CAAC4B,IAAI,CAAE,CAClB,OAAO5B,SAAS,CAAC4B,IAAI,AACvB,CAGA,MAAO,CACL1B,MAAOyB,QACPxB,KAAM,gBACNC,qBAAsBuB,OACxB,CACF,CAAE,AAEF,gBAAe3B,SAAU"}
+{"version":3,"sources":["../../../src/core/CodeSnippet/languages.ts"],"sourcesContent":["import { IconName } from \"../Icon/types\";\n\nexport interface LanguageInfo {\n  label: string;\n  icon: IconName;\n  syntaxHighlighterKey?: string;\n}\n\nexport type LanguageMap = Record<string, LanguageInfo>;\n\nconst languages: LanguageMap = {\n  javascript: {\n    label: \"JavaScript\",\n    icon: \"icon-tech-javascript\",\n    syntaxHighlighterKey: \"javascript\",\n  },\n  typescript: {\n    label: \"TypeScript\",\n    icon: \"icon-tech-typescript\",\n    syntaxHighlighterKey: \"typescript\",\n  },\n  java: {\n    label: \"Java\",\n    icon: \"icon-tech-java\",\n    syntaxHighlighterKey: \"java\",\n  },\n  kotlin: {\n    label: \"Kotlin\",\n    icon: \"icon-tech-kotlin\",\n    syntaxHighlighterKey: \"kotlin\",\n  },\n  python: {\n    label: \"Python\",\n    icon: \"icon-tech-python\",\n    syntaxHighlighterKey: \"python\",\n  },\n  csharp: {\n    label: \"C#\",\n    icon: \"icon-tech-csharp\",\n    syntaxHighlighterKey: \"csharp\",\n  },\n  go: {\n    label: \"Go\",\n    icon: \"icon-tech-go\",\n    syntaxHighlighterKey: \"go\",\n  },\n  ruby: {\n    label: \"Ruby\",\n    icon: \"icon-tech-ruby\",\n    syntaxHighlighterKey: \"ruby\",\n  },\n  php: {\n    label: \"PHP\",\n    icon: \"icon-tech-php\",\n    syntaxHighlighterKey: \"php\",\n  },\n  nodejs: {\n    label: \"Node.js\",\n    icon: \"icon-tech-nodejs\",\n    syntaxHighlighterKey: \"javascript\",\n  },\n  react: {\n    label: \"React\",\n    icon: \"icon-tech-react\",\n    syntaxHighlighterKey: \"javascript\",\n  },\n  html: {\n    label: \"HTML\",\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: \"xml\",\n  },\n  shell: {\n    label: \"Shell\",\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: \"bash\",\n  },\n  json: {\n    label: \"JSON\",\n    icon: \"icon-tech-json\",\n    syntaxHighlighterKey: \"json\",\n  },\n  xml: {\n    label: \"XML\",\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: \"xml\",\n  },\n  sql: {\n    label: \"SQL\",\n    icon: \"icon-tech-postgres\",\n    syntaxHighlighterKey: \"sql\",\n  },\n  swift: {\n    label: \"Swift\",\n    icon: \"icon-tech-swift\",\n    syntaxHighlighterKey: \"swift\",\n  },\n  // New entries from languageInfo.ts\n  cpp: {\n    label: \"C++\",\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: \"cpp\",\n  },\n  dart: {\n    label: \"Dart\",\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: \"dart\",\n  },\n  objc: {\n    label: \"Objective-C\",\n    icon: \"icon-tech-objectivec\",\n    syntaxHighlighterKey: \"objc\",\n  },\n  android: {\n    label: \"Android\",\n    icon: \"icon-tech-android-head\",\n    syntaxHighlighterKey: \"java\",\n  },\n  flutter: {\n    label: \"Flutter\",\n    icon: \"icon-tech-flutter\",\n    syntaxHighlighterKey: \"dart\",\n  },\n};\n\nexport const stripSdkType = (lang: string) => {\n  if (lang.startsWith(\"realtime_\") || lang.startsWith(\"rest_\")) {\n    return lang.split(\"_\").slice(1).join(\"_\");\n  }\n  return lang;\n};\n\n// Fallback function to handle languages not in the map\nexport const getLanguageInfo = (langKey: string): LanguageInfo => {\n  const key = stripSdkType(langKey).toLowerCase();\n\n  if (languages[key]) {\n    return languages[key];\n  }\n\n  // Fallback for unknown languages\n  return {\n    label: langKey,\n    icon: \"icon-tech-web\",\n    syntaxHighlighterKey: langKey,\n  };\n};\n\nexport default languages;\n"],"names":["languages","javascript","label","icon","syntaxHighlighterKey","typescript","java","kotlin","python","csharp","go","ruby","php","nodejs","react","html","shell","json","xml","sql","swift","cpp","dart","objc","android","flutter","stripSdkType","lang","startsWith","split","slice","join","getLanguageInfo","langKey","key","toLowerCase"],"mappings":"AAUA,MAAMA,UAAyB,CAC7BC,WAAY,CACVC,MAAO,aACPC,KAAM,uBACNC,qBAAsB,YACxB,EACAC,WAAY,CACVH,MAAO,aACPC,KAAM,uBACNC,qBAAsB,YACxB,EACAE,KAAM,CACJJ,MAAO,OACPC,KAAM,iBACNC,qBAAsB,MACxB,EACAG,OAAQ,CACNL,MAAO,SACPC,KAAM,mBACNC,qBAAsB,QACxB,EACAI,OAAQ,CACNN,MAAO,SACPC,KAAM,mBACNC,qBAAsB,QACxB,EACAK,OAAQ,CACNP,MAAO,KACPC,KAAM,mBACNC,qBAAsB,QACxB,EACAM,GAAI,CACFR,MAAO,KACPC,KAAM,eACNC,qBAAsB,IACxB,EACAO,KAAM,CACJT,MAAO,OACPC,KAAM,iBACNC,qBAAsB,MACxB,EACAQ,IAAK,CACHV,MAAO,MACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAS,OAAQ,CACNX,MAAO,UACPC,KAAM,mBACNC,qBAAsB,YACxB,EACAU,MAAO,CACLZ,MAAO,QACPC,KAAM,kBACNC,qBAAsB,YACxB,EACAW,KAAM,CACJb,MAAO,OACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAY,MAAO,CACLd,MAAO,QACPC,KAAM,gBACNC,qBAAsB,MACxB,EACAa,KAAM,CACJf,MAAO,OACPC,KAAM,iBACNC,qBAAsB,MACxB,EACAc,IAAK,CACHhB,MAAO,MACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAe,IAAK,CACHjB,MAAO,MACPC,KAAM,qBACNC,qBAAsB,KACxB,EACAgB,MAAO,CACLlB,MAAO,QACPC,KAAM,kBACNC,qBAAsB,OACxB,EAEAiB,IAAK,CACHnB,MAAO,MACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAkB,KAAM,CACJpB,MAAO,OACPC,KAAM,gBACNC,qBAAsB,MACxB,EACAmB,KAAM,CACJrB,MAAO,cACPC,KAAM,uBACNC,qBAAsB,MACxB,EACAoB,QAAS,CACPtB,MAAO,UACPC,KAAM,yBACNC,qBAAsB,MACxB,EACAqB,QAAS,CACPvB,MAAO,UACPC,KAAM,oBACNC,qBAAsB,MACxB,CACF,CAEA,QAAO,MAAMsB,aAAe,AAACC,OAC3B,GAAIA,KAAKC,UAAU,CAAC,cAAgBD,KAAKC,UAAU,CAAC,SAAU,CAC5D,OAAOD,KAAKE,KAAK,CAAC,KAAKC,KAAK,CAAC,GAAGC,IAAI,CAAC,IACvC,CACA,OAAOJ,IACT,CAAE,AAGF,QAAO,MAAMK,gBAAkB,AAACC,UAC9B,MAAMC,IAAMR,aAAaO,SAASE,WAAW,GAE7C,GAAInC,SAAS,CAACkC,IAAI,CAAE,CAClB,OAAOlC,SAAS,CAACkC,IAAI,AACvB,CAGA,MAAO,CACLhC,MAAO+B,QACP9B,KAAM,gBACNC,qBAAsB6B,OACxB,CACF,CAAE,AAEF,gBAAejC,SAAU"}

package/core/CodeSnippet.js

@@ -1,2 +1,2 @@
-import React,{useState,useEffect,Children,isValidElement,useRef,useCallback,useMemo}from"react";import Code from"./Code";import cn from"./utils/cn";import{getLanguageInfo}from"./CodeSnippet/languages";import Icon from"./Icon";import LanguageSelector from"./CodeSnippet/LanguageSelector";import ApiKeySelector from"./CodeSnippet/ApiKeySelector";import useCopyToClipboard from"./utils/useCopyToClipboard";import ShellCommandView from"./CodeSnippet/ShellCommandView";import CopyButton from"./CodeSnippet/CopyButton";import TooltipButton from"./CodeSnippet/TooltipButton";const CodeSnippet=({fixed=false,headerRow=false,title="Code",children,className,lang,onChange,apiKeys,sdk,showCodeLines=true,languageOrdering})=>{const codeRef=useRef(null);const{isCopied,copy}=useCopyToClipboard();const extractLanguageFromCode=useCallback(codeElement=>{if(!codeElement||!codeElement.props.className)return null;const classNames=codeElement.props.className.split(" ");const langClass=classNames.find(cls=>cls.startsWith("language-"));if(!langClass)return null;return langClass.substring(9)},[]);const{childrenArray,languages,sdkTypes,originalLangMap,isSingleShellCommand}=useMemo(()=>{const childrenArray=Children.toArray(children);const languages=[];const sdkTypes=new Set;const originalLangMap=new Map;const isSingleShellCommand=childrenArray.length===1&&isValidElement(childrenArray[0])&&isValidElement(childrenArray[0].props.children)&&childrenArray[0].props.children.props.className?.includes("language-shell");childrenArray.forEach(child=>{if(!isValidElement(child))return;const preElement=child;const codeElement=isValidElement(preElement.props.children)?preElement.props.children:null;const langName=extractLanguageFromCode(codeElement);if(!langName)return;if(langName.startsWith("realtime_")){const baseLanguage=langName.substring(9);sdkTypes.add("realtime");originalLangMap.set(langName,baseLanguage)}else if(langName.startsWith("rest_")){const baseLanguage=langName.substring(5);sdkTypes.add("rest");originalLangMap.set(langName,baseLanguage)}else{originalLangMap.set(langName,langName)}if(!languages.includes(langName)){languages.push(langName)}});return{childrenArray,languages,sdkTypes,originalLangMap,isSingleShellCommand}},[children,extractLanguageFromCode]);const[activeSDKType,setActiveSDKType]=useState(()=>{if(sdkTypes.size===0)return null;if(sdk&&sdkTypes.has(sdk))return sdk;if(sdkTypes.has("realtime"))return"realtime";if(sdkTypes.has("rest"))return"rest";return null});const[activeLanguage,setActiveLanguage]=useState(null);const[selectedApiKey,setSelectedApiKey]=useState(()=>apiKeys&&apiKeys.length>0?apiKeys[0]:"");const[isHovering,setIsHovering]=useState(false);const showSDKSelector=sdkTypes.size>0;const hasOnlyJsonSnippet=useMemo(()=>languages.length===1&&languages[0]==="json",[languages]);const filteredLanguages=useMemo(()=>{const filtered=!activeSDKType||!showSDKSelector?[...languages]:languages.filter(lang=>lang.startsWith(`${activeSDKType}_`));if(languageOrdering&&languageOrdering.length>0){filtered.sort((a,b)=>{const aBase=originalLangMap.get(a)||a;const bBase=originalLangMap.get(b)||b;const aIndex=languageOrdering.indexOf(aBase);const bIndex=languageOrdering.indexOf(bBase);if(aIndex!==-1&&bIndex!==-1)return aIndex-bIndex;if(aIndex!==-1)return-1;if(bIndex!==-1)return 1;return 0})}return filtered},[activeSDKType,showSDKSelector,languages,languageOrdering,originalLangMap]);const initialActiveLanguage=useMemo(()=>{if(!lang){return filteredLanguages.length>0?filteredLanguages[0]:null}if(activeSDKType){const prefixedLang=`${activeSDKType}_${lang}`;if(languages.includes(prefixedLang)){return prefixedLang}}if(languages.includes(lang)){return lang}if(getLanguageInfo(lang).label!==lang){return lang}return filteredLanguages.length>0?filteredLanguages[0]:null},[lang,activeSDKType,languages,filteredLanguages]);useEffect(()=>{setActiveLanguage(initialActiveLanguage)},[initialActiveLanguage]);useEffect(()=>{if(apiKeys&&apiKeys.length>0&&!apiKeys.includes(selectedApiKey)){setSelectedApiKey(apiKeys[0])}},[apiKeys,selectedApiKey]);const getCleanLanguage=useCallback(lang=>lang?originalLangMap.get(lang)||lang:null,[originalLangMap]);const getLanguageInfoForDisplay=useCallback(lang=>{if(!lang)return null;const cleanLang=getCleanLanguage(lang);return cleanLang?getLanguageInfo(cleanLang):null},[getCleanLanguage]);const getLanguageDisplayName=useCallback(lang=>{const cleanLang=getCleanLanguage(lang);return cleanLang?getLanguageInfo(cleanLang).label:lang},[getCleanLanguage]);const getLanguageIcon=useCallback(lang=>{const cleanLang=getCleanLanguage(lang);return cleanLang?getLanguageInfo(cleanLang).icon:"icon-gui-document-mini"},[getCleanLanguage]);const activeLanguageInfo=useMemo(()=>getLanguageInfoForDisplay(activeLanguage),[getLanguageInfoForDisplay,activeLanguage]);const processedChildren=useMemo(()=>{if(!activeLanguage)return[];const targetLanguage=hasOnlyJsonSnippet?"json":activeLanguage;return childrenArray.filter(child=>{if(!isValidElement(child))return false;const codeElement=isValidElement(child.props.children)?child.props.children:null;const langName=extractLanguageFromCode(codeElement);return langName===targetLanguage}).map(child=>{if(!isValidElement(child))return child;const preElement=child;const codeElement=isValidElement(preElement.props.children)?preElement.props.children:null;if(!codeElement)return child;const codeContent=codeElement.props.children;const langName=extractLanguageFromCode(codeElement);if(!langName)return child;const cleanLang=hasOnlyJsonSnippet?"json":getCleanLanguage(langName)||langName;const langInfo=getLanguageInfo(cleanLang);if(typeof codeContent==="string"||typeof codeContent==="number"||typeof codeContent==="boolean"){return React.createElement(Code,{key:langName,language:langInfo.syntaxHighlighterKey||cleanLang,snippet:String(codeContent),additionalCSS:"bg-neutral-100 text-neutral-1300 dark:bg-neutral-1200 dark:text-neutral-200 px-6 py-4",showLines:showCodeLines})}return child})},[activeLanguage,childrenArray,extractLanguageFromCode,getCleanLanguage,hasOnlyJsonSnippet,showCodeLines]);const hasSnippetForActiveLanguage=useMemo(()=>{if(!activeLanguage)return false;if(hasOnlyJsonSnippet)return true;return childrenArray.some(child=>{if(!isValidElement(child))return false;const codeElement=isValidElement(child.props.children)?child.props.children:null;const langName=extractLanguageFromCode(codeElement);return langName===activeLanguage})},[activeLanguage,childrenArray,extractLanguageFromCode,hasOnlyJsonSnippet]);const getCodeText=useCallback(()=>{if(!activeLanguage||!hasSnippetForActiveLanguage||!codeRef.current)return null;const allPreElements=codeRef.current.querySelectorAll("pre");for(const preElement of Array.from(allPreElements)){const codeElement=preElement.querySelector("code");if(!codeElement||!codeElement.className)continue;const classNames=codeElement.className.split(" ");const langClass=classNames.find(cls=>cls.startsWith("language-"));if(!langClass)continue;const langName=langClass.substring(9);if(hasOnlyJsonSnippet&&langName==="json"||!hasOnlyJsonSnippet&&langName===activeLanguage){return codeElement.textContent||""}}return null},[activeLanguage,hasSnippetForActiveLanguage,hasOnlyJsonSnippet]);const handleSDKTypeChange=useCallback(type=>{const nextLang=languages.find(l=>l.startsWith(`${type}_`))??null;setActiveSDKType(type);setActiveLanguage(nextLang)},[languages]);const handleLanguageChange=useCallback(language=>{setActiveLanguage(language);if(onChange){const cleanLang=getCleanLanguage(language)||language;onChange(cleanLang,activeSDKType)}},[onChange,getCleanLanguage,activeSDKType]);const handleApiKeyChange=useCallback(apiKey=>{setSelectedApiKey(apiKey)},[]);const NoSnippetMessage=useMemo(()=>{if(!activeLanguageInfo)return()=>null;return()=>React.createElement("div",{className:"px-16 py-6 ui-text-body2 text-neutral-800 dark:text-neutral-400 text-center flex flex-col gap-3 items-center"},React.createElement(Icon,{name:"icon-gui-exclamation-triangle-outline",color:"text-yellow-600 dark:text-yellow-400",size:"24px"}),React.createElement("p",{className:"ui-text-p3 text-neutral-700 dark:text-neutral-600"},"You're currently viewing the ",activeLanguageInfo.label," docs. There either isn't a ",activeLanguageInfo.label," code sample for this example, or this feature isn't supported in"," ",activeLanguageInfo.label,". Switch language to view this example in a different language, or check which SDKs support this feature."))},[activeLanguageInfo]);const showLanguageSelector=!fixed&&filteredLanguages.length>0;const showFullSelector=filteredLanguages.length>1;const renderContent=useMemo(()=>{if(!activeLanguage)return null;if(hasSnippetForActiveLanguage){return processedChildren}if(activeLanguageInfo){return React.createElement(NoSnippetMessage,null)}return null},[activeLanguage,hasSnippetForActiveLanguage,processedChildren,activeLanguageInfo,NoSnippetMessage]);if(isSingleShellCommand){const shellChild=childrenArray[0];if(isValidElement(shellChild)&&isValidElement(shellChild.props.children)){const codeElement=shellChild.props.children;const codeContent=codeElement.props.children;return React.createElement(ShellCommandView,{content:String(codeContent),className:className})}}return React.createElement("div",{className:cn("rounded-lg overflow-hidden bg-neutral-100 dark:bg-neutral-1200 border border-neutral-300 dark:border-neutral-1000 min-h-[3.375rem]",className)},headerRow&&React.createElement("div",{className:"h-[2.375rem] bg-neutral-200 dark:bg-neutral-1100 border-b border-neutral-300 dark:border-neutral-1000 flex items-center py-1 px-3 rounded-t-lg"},React.createElement("div",{className:"flex space-x-1.5"},React.createElement("div",{className:"w-3 h-3 rounded-full bg-orange-500"}),React.createElement("div",{className:"w-3 h-3 rounded-full bg-yellow-500"}),React.createElement("div",{className:"w-3 h-3 rounded-full bg-green-500"})),React.createElement("div",{className:"flex-1 text-center ui-text-p3 font-bold text-neutral-1300 dark:text-neutral-000"},title),React.createElement("div",{className:"w-12"})),showSDKSelector&&React.createElement("div",{className:cn("p-2 border-b border-neutral-200 dark:border-neutral-1100 h-14",headerRow?"":"rounded-t-lg")},React.createElement("div",{className:"flex gap-3 justify-start"},sdkTypes.has("realtime")&&React.createElement(TooltipButton,{tooltip:"Realtime SDK",active:activeSDKType==="realtime",onClick:()=>handleSDKTypeChange("realtime"),variant:"segmented",size:"sm",alwaysShowLabel:true},"Realtime"),sdkTypes.has("rest")&&React.createElement(TooltipButton,{tooltip:"REST SDK",active:activeSDKType==="rest",onClick:()=>handleSDKTypeChange("rest"),variant:"segmented",size:"sm",alwaysShowLabel:true},"REST"))),showLanguageSelector&&(showFullSelector?React.createElement(LanguageSelector,{languages:filteredLanguages,activeLanguage:activeLanguage,onLanguageChange:handleLanguageChange,getLanguageDisplayName:getLanguageDisplayName,getLanguageIcon:getLanguageIcon,activeLanguageInfo:activeLanguageInfo}):React.createElement("div",{className:cn("border-b border-neutral-200 dark:border-neutral-1100 h-[2.125rem] inline-flex items-center px-3",{"rounded-t-lg":!headerRow},{"cursor-pointer":filteredLanguages.length>0}),...filteredLanguages.length>0&&{onClick:()=>handleLanguageChange(filteredLanguages[0])}},filteredLanguages.length>0&&React.createElement(React.Fragment,null,React.createElement(Icon,{name:getLanguageIcon(filteredLanguages[0]),size:"16px",additionalCSS:"mr-2"}),React.createElement("span",{className:"ui-text-label4 font-semibold text-neutral-800 dark:text-neutral-500 select-none"},getLanguageDisplayName(filteredLanguages[0]))))),React.createElement("div",{ref:codeRef,className:"relative",onMouseEnter:()=>setIsHovering(true),onMouseLeave:()=>setIsHovering(false),onFocus:()=>setIsHovering(true),onBlur:()=>setIsHovering(false),tabIndex:0},renderContent,isHovering&&activeLanguage&&hasSnippetForActiveLanguage&&React.createElement(CopyButton,{onCopy:()=>{const text=getCodeText();if(text)copy(text)},isCopied:isCopied})),apiKeys&&React.createElement(ApiKeySelector,{apiKeys:apiKeys,selectedApiKey:selectedApiKey,onApiKeyChange:handleApiKeyChange}))};export default CodeSnippet;
+import React,{useState,useEffect,Children,isValidElement,useRef,useCallback,useMemo}from"react";import Code from"./Code";import cn from"./utils/cn";import Icon from"./Icon";import{getLanguageInfo,stripSdkType}from"./CodeSnippet/languages";import LanguageSelector from"./CodeSnippet/LanguageSelector";import ApiKeySelector from"./CodeSnippet/ApiKeySelector";import useCopyToClipboard from"./utils/useCopyToClipboard";import PlainCodeView from"./CodeSnippet/PlainCodeView";import CopyButton from"./CodeSnippet/CopyButton";import TooltipButton from"./CodeSnippet/TooltipButton";const substituteApiKey=(content,apiKey)=>{return content.replace(/\{\{API_KEY\}\}/g,`${apiKey.split(":")[0]}:*****`)};const CodeSnippet=({fixed=false,headerRow=false,title="Code",children,className,lang,onChange,apiKeys,sdk,showCodeLines=true,languageOrdering})=>{const codeRef=useRef(null);const{isCopied,copy}=useCopyToClipboard();const extractLanguageFromCode=useCallback(codeElement=>{if(!codeElement||!codeElement.props.className)return null;const classNames=codeElement.props.className.split(" ");const langClass=classNames.find(cls=>cls.startsWith("language-"));if(!langClass)return null;return langClass.substring(9)},[]);const{codeData,languages,sdkTypes,isSinglePlainCommand}=useMemo(()=>{const childrenArray=Children.toArray(children);const languages=[];const sdkTypes=new Set;const codeData=[];const isSinglePlainCommand=childrenArray.length===1&&["language-shell","language-text"].some(lang=>isValidElement(childrenArray[0])&&isValidElement(childrenArray[0].props.children)&&childrenArray[0].props.children.props.className?.includes(lang));childrenArray.forEach(child=>{if(!isValidElement(child))return;const preElement=child;const codeElement=isValidElement(preElement.props.children)?preElement.props.children:null;if(!codeElement)return;const codeLanguage=extractLanguageFromCode(codeElement);if(!codeLanguage)return;if(codeLanguage.startsWith("realtime_")){sdkTypes.add("realtime")}else if(codeLanguage.startsWith("rest_")){sdkTypes.add("rest")}if(!languages.includes(codeLanguage)){languages.push(codeLanguage)}const codeContent=codeElement.props.children;codeData.push({language:codeLanguage,content:codeContent})});return{codeData,languages,sdkTypes,isSinglePlainCommand}},[children,extractLanguageFromCode]);const[activeSDKType,setActiveSDKType]=useState(()=>{if(sdkTypes.size===0)return null;if(sdk&&sdkTypes.has(sdk))return sdk;if(sdkTypes.has("realtime"))return"realtime";if(sdkTypes.has("rest"))return"rest";return null});const showSDKSelector=sdkTypes.size>0;const filteredLanguages=useMemo(()=>{const filtered=!activeSDKType||!showSDKSelector?[...languages]:languages.filter(lang=>lang.startsWith(`${activeSDKType}_`));if(languageOrdering&&languageOrdering.length>0){filtered.sort((a,b)=>{const aBase=stripSdkType(a);const bBase=stripSdkType(b);const aIndex=languageOrdering.indexOf(aBase);const bIndex=languageOrdering.indexOf(bBase);if(aIndex!==-1&&bIndex!==-1)return aIndex-bIndex;if(aIndex!==-1)return-1;if(bIndex!==-1)return 1;return 0})}return filtered},[activeSDKType,showSDKSelector,languages,languageOrdering]);const activeLanguage=useMemo(()=>{if(sdk&&sdkTypes.has(sdk)){return languages.find(l=>l===`${sdk}_${lang}`)??languages[0]}if(lang)return lang;if(filteredLanguages.length>0)return filteredLanguages[0];return languages[0]},[lang,sdk,sdkTypes,filteredLanguages]);const[selectedApiKey,setSelectedApiKey]=useState(()=>apiKeys?.[0]?.keys?.[0]?.key??"");useEffect(()=>{if(!selectedApiKey&&apiKeys&&apiKeys.length>0){setSelectedApiKey(apiKeys[0].keys?.[0]?.key)}},[apiKeys]);const requiresApiKeySubstitution=useMemo(()=>{const containsPlaceholder=codeData.some(code=>code?.content.includes("{{API_KEY}}")&&code?.language===lang);return containsPlaceholder&&!!apiKeys&&apiKeys.length>0&&!!selectedApiKey},[codeData,apiKeys,selectedApiKey,lang]);const[isHovering,setIsHovering]=useState(false);const hasOnlyJsonSnippet=useMemo(()=>languages.length===1&&languages[0]==="json",[languages]);const processedChildren=useMemo(()=>{if(!activeLanguage)return[];const targetLanguage=hasOnlyJsonSnippet?"json":activeLanguage;return codeData.filter(code=>{return code?.language===targetLanguage}).map(code=>{if(!code)return null;const cleanLang=hasOnlyJsonSnippet?"json":code.language;const langInfo=getLanguageInfo(cleanLang??"");if(typeof code.content==="string"||typeof code.content==="number"||typeof code.content==="boolean"){let processedContent=String(code.content);if(requiresApiKeySubstitution){processedContent=substituteApiKey(processedContent,selectedApiKey)}if(!langInfo.syntaxHighlighterKey||!cleanLang)return null;return React.createElement(Code,{key:code.language,language:langInfo.syntaxHighlighterKey||cleanLang,snippet:processedContent,additionalCSS:"bg-neutral-100 text-neutral-1300 dark:bg-neutral-1200 dark:text-neutral-200 px-6 py-4",showLines:showCodeLines})}return null})},[activeLanguage,codeData,hasOnlyJsonSnippet,showCodeLines,apiKeys,selectedApiKey]);const hasSnippetForActiveLanguage=useMemo(()=>{if(!activeLanguage)return false;if(hasOnlyJsonSnippet)return true;return codeData.some(code=>{return code?.language===activeLanguage})},[activeLanguage,hasOnlyJsonSnippet,codeData]);const handleSDKTypeChange=useCallback(type=>{const nextLang=stripSdkType(languages.find(l=>l===`${type}_${stripSdkType(activeLanguage)}`)??languages.find(l=>l.startsWith(`${type}_`))??activeLanguage);setActiveSDKType(type);if(onChange&&nextLang){onChange(nextLang,type)}},[languages]);const handleLanguageChange=useCallback(language=>{if(onChange){onChange(stripSdkType(language),activeSDKType)}},[onChange,activeSDKType]);const NoSnippetMessage=useMemo(()=>{if(!activeLanguage)return()=>null;const activeLanguageInfo=getLanguageInfo(activeLanguage);return()=>React.createElement("div",{className:"px-16 py-6 ui-text-body2 text-neutral-800 dark:text-neutral-400 text-center flex flex-col gap-3 items-center"},React.createElement(Icon,{name:"icon-gui-exclamation-triangle-outline",color:"text-yellow-600 dark:text-yellow-400",size:"24px"}),React.createElement("p",{className:"ui-text-p3 text-neutral-700 dark:text-neutral-600"},"You're currently viewing the ",activeLanguageInfo.label," docs. There either isn't a ",activeLanguageInfo.label," code sample for this example, or this feature isn't supported in"," ",activeLanguageInfo.label,". Switch language to view this example in a different language, or check which SDKs support this feature."))},[activeLanguage]);const showLanguageSelector=!fixed&&filteredLanguages.length>0;const showFullSelector=filteredLanguages.length>1;const renderContent=useMemo(()=>{if(!activeLanguage)return null;if(hasSnippetForActiveLanguage){return processedChildren}return React.createElement(NoSnippetMessage,null)},[activeLanguage,hasSnippetForActiveLanguage,processedChildren,NoSnippetMessage]);if(isSinglePlainCommand){const plainChild=codeData[0];if(plainChild){const codeContent=plainChild.content;const language=plainChild.language;if(!language||!codeContent)return null;let processedContent=String(codeContent);if(requiresApiKeySubstitution){processedContent=substituteApiKey(processedContent,selectedApiKey)}return React.createElement(PlainCodeView,{content:processedContent,className:className,language:language,icon:language==="shell"?"icon-gui-command-line-outline":null})}}return React.createElement("div",{className:cn("rounded-lg overflow-hidden bg-neutral-100 dark:bg-neutral-1200 border border-neutral-300 dark:border-neutral-1000 min-h-[3.375rem]",className)},headerRow&&React.createElement("div",{className:"h-[2.375rem] bg-neutral-200 dark:bg-neutral-1100 border-b border-neutral-300 dark:border-neutral-1000 flex items-center py-1 px-3 rounded-t-lg"},React.createElement("div",{className:"flex space-x-1.5"},React.createElement("div",{className:"w-3 h-3 rounded-full bg-orange-500"}),React.createElement("div",{className:"w-3 h-3 rounded-full bg-yellow-500"}),React.createElement("div",{className:"w-3 h-3 rounded-full bg-green-500"})),React.createElement("div",{className:"flex-1 text-center ui-text-p3 font-bold text-neutral-1300 dark:text-neutral-000"},title),React.createElement("div",{className:"w-12"})),showSDKSelector&&React.createElement("div",{className:cn("p-2 border-b border-neutral-200 dark:border-neutral-1100 h-14",headerRow?"":"rounded-t-lg")},React.createElement("div",{className:"flex gap-3 justify-start"},sdkTypes.has("realtime")&&React.createElement(TooltipButton,{tooltip:"Realtime SDK",active:activeSDKType==="realtime",onClick:()=>handleSDKTypeChange("realtime"),variant:"segmented",size:"sm",alwaysShowLabel:true},"Realtime"),sdkTypes.has("rest")&&React.createElement(TooltipButton,{tooltip:"REST SDK",active:activeSDKType==="rest",onClick:()=>handleSDKTypeChange("rest"),variant:"segmented",size:"sm",alwaysShowLabel:true},"REST"))),showLanguageSelector&&(showFullSelector?React.createElement(LanguageSelector,{languages:filteredLanguages,activeLanguage:activeLanguage,onLanguageChange:handleLanguageChange}):React.createElement("div",{className:cn("border-b border-neutral-200 dark:border-neutral-1100 h-[2.125rem] inline-flex items-center px-3 w-full",{"rounded-t-lg":!headerRow})},filteredLanguages.length>0&&React.createElement("div",{className:cn("inline-flex items-center",{"cursor-pointer":filteredLanguages.length>0}),...filteredLanguages.length>0&&{onClick:()=>handleLanguageChange(filteredLanguages[0])}},React.createElement(Icon,{name:getLanguageInfo(filteredLanguages[0]).icon,size:"16px",additionalCSS:"mr-2"}),React.createElement("span",{className:"ui-text-label4 font-semibold text-neutral-800 dark:text-neutral-500 select-none"},getLanguageInfo(filteredLanguages[0]).label)))),React.createElement("div",{ref:codeRef,className:"relative",onMouseEnter:()=>setIsHovering(true),onMouseLeave:()=>setIsHovering(false),onFocus:()=>setIsHovering(true),onBlur:()=>setIsHovering(false),tabIndex:0},renderContent,isHovering&&activeLanguage&&React.createElement(CopyButton,{onCopy:()=>{const text=codeData.find(code=>code.language===activeLanguage)?.content;if(text)copy(text)},isCopied:isCopied})),requiresApiKeySubstitution&&React.createElement(ApiKeySelector,{apiKeys:apiKeys,selectedApiKey:selectedApiKey,onApiKeyChange:setSelectedApiKey}))};export default CodeSnippet;
 //# sourceMappingURL=CodeSnippet.js.map

package/core/CodeSnippet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/core/CodeSnippet.tsx"],"sourcesContent":["import React, {\n  useState,\n  useEffect,\n  Children,\n  isValidElement,\n  useRef,\n  useCallback,\n  useMemo,\n} from \"react\";\nimport Code from \"./Code\";\nimport cn from \"./utils/cn\";\nimport { getLanguageInfo } from \"./CodeSnippet/languages\";\nimport Icon from \"./Icon\";\nimport LanguageSelector from \"./CodeSnippet/LanguageSelector\";\nimport ApiKeySelector from \"./CodeSnippet/ApiKeySelector\";\nimport { IconName } from \"./Icon/types\";\nimport useCopyToClipboard from \"./utils/useCopyToClipboard\";\nimport ShellCommandView from \"./CodeSnippet/ShellCommandView\";\nimport CopyButton from \"./CodeSnippet/CopyButton\";\nimport TooltipButton from \"./CodeSnippet/TooltipButton\";\n\n// Define SDK type\nexport type SDKType = \"realtime\" | \"rest\" | null;\n\nexport interface CodeSnippetProps {\n  /**\n   * If true, hides the language selector row completely\n   */\n  fixed?: boolean;\n  /**\n   * If true, renders a macOS-style window header with buttons and title\n   */\n  headerRow?: boolean;\n  /**\n   * Title to display in the header row (when headerRow is true)\n   */\n  title?: string;\n  /**\n   * Children elements with lang attribute\n   */\n  children: React.ReactNode;\n  /**\n   * Additional CSS classes\n   */\n  className?: string;\n  /**\n   * Default language to display. If not found in available languages, first available is used.\n   * If found in languages but no matching snippet exists, a message is displayed.\n   */\n  lang?: string;\n  /**\n   * Callback fired when the active language changes\n   */\n  onChange?: (language: string, sdk?: SDKType) => void;\n  /**\n   * List of API keys to display in a dropdown\n   */\n  apiKeys?: string[];\n  /**\n   * Default SDK type to use for the code snippet\n   */\n  sdk?: SDKType;\n  /**\n   * Whether to show line numbers in code snippets\n   */\n  showCodeLines?: boolean;\n  /**\n   * Defines the order in which languages should be displayed.\n   * Languages not in this array will be shown after those that are included.\n   */\n  languageOrdering?: string[];\n}\n\n/**\n * CodeSnippet component that displays code with language switching capability\n */\nconst CodeSnippet: React.FC<CodeSnippetProps> = ({\n  fixed = false,\n  headerRow = false,\n  title = \"Code\",\n  children,\n  className,\n  lang,\n  onChange,\n  apiKeys,\n  sdk,\n  showCodeLines = true,\n  languageOrdering,\n}) => {\n  const codeRef = useRef<HTMLDivElement>(null);\n  const { isCopied, copy } = useCopyToClipboard();\n\n  // Helper function to extract language from code element\n  const extractLanguageFromCode = useCallback(\n    (codeElement: React.ReactElement | null): string | null => {\n      if (!codeElement || !codeElement.props.className) return null;\n\n      const classNames = codeElement.props.className.split(\" \");\n      const langClass = classNames.find((cls: string) =>\n        cls.startsWith(\"language-\"),\n      );\n      if (!langClass) return null;\n\n      return langClass.substring(9); // Remove \"language-\" prefix\n    },\n    [],\n  );\n\n  // Parse children to extract languages and SDK types - only needs to run once\n  const {\n    childrenArray,\n    languages,\n    sdkTypes,\n    originalLangMap,\n    isSingleShellCommand,\n  } = useMemo(() => {\n    const childrenArray = Children.toArray(children);\n    const languages: string[] = [];\n    const sdkTypes = new Set<SDKType>();\n    const originalLangMap = new Map<string, string>();\n\n    // Check if we have a single shell command\n    const isSingleShellCommand =\n      childrenArray.length === 1 &&\n      isValidElement(childrenArray[0]) &&\n      isValidElement(childrenArray[0].props.children) &&\n      childrenArray[0].props.children.props.className?.includes(\n        \"language-shell\",\n      );\n\n    // Extract all available languages from children and identify SDK types\n    childrenArray.forEach((child) => {\n      if (!isValidElement(child)) return;\n\n      const preElement = child;\n      const codeElement = isValidElement(preElement.props.children)\n        ? preElement.props.children\n        : null;\n\n      const langName = extractLanguageFromCode(codeElement);\n      if (!langName) return;\n\n      // Look for SDK prefixes in the language name itself\n      if (langName.startsWith(\"realtime_\")) {\n        const baseLanguage = langName.substring(9);\n        sdkTypes.add(\"realtime\");\n        originalLangMap.set(langName, baseLanguage);\n      } else if (langName.startsWith(\"rest_\")) {\n        const baseLanguage = langName.substring(5);\n        sdkTypes.add(\"rest\");\n        originalLangMap.set(langName, baseLanguage);\n      } else {\n        originalLangMap.set(langName, langName);\n      }\n\n      // Add to languages list if not already included\n      if (!languages.includes(langName)) {\n        languages.push(langName);\n      }\n    });\n\n    return {\n      childrenArray,\n      languages,\n      sdkTypes,\n      originalLangMap,\n      isSingleShellCommand,\n    };\n  }, [children, extractLanguageFromCode]);\n\n  // Simplified state management with separate hooks\n  const [activeSDKType, setActiveSDKType] = useState<SDKType>(() => {\n    if (sdkTypes.size === 0) return null;\n    if (sdk && sdkTypes.has(sdk)) return sdk;\n    if (sdkTypes.has(\"realtime\")) return \"realtime\";\n    if (sdkTypes.has(\"rest\")) return \"rest\";\n    return null;\n  });\n  const [activeLanguage, setActiveLanguage] = useState<string | null>(null);\n  const [selectedApiKey, setSelectedApiKey] = useState(() =>\n    apiKeys && apiKeys.length > 0 ? apiKeys[0] : \"\",\n  );\n  const [isHovering, setIsHovering] = useState(false);\n\n  // Check if we need to show SDK type selector\n  const showSDKSelector = sdkTypes.size > 0;\n\n  // Check if there is only a JSON snippet\n  const hasOnlyJsonSnippet = useMemo(\n    () => languages.length === 1 && languages[0] === \"json\",\n    [languages],\n  );\n\n  // Get languages filtered by active SDK type & apply ordering\n  const filteredLanguages = useMemo(() => {\n    // Filter by SDK type if needed\n    const filtered =\n      !activeSDKType || !showSDKSelector\n        ? [...languages]\n        : languages.filter((lang) => lang.startsWith(`${activeSDKType}_`));\n\n    // Apply custom ordering if provided\n    if (languageOrdering && languageOrdering.length > 0) {\n      filtered.sort((a, b) => {\n        const aBase = originalLangMap.get(a) || a;\n        const bBase = originalLangMap.get(b) || b;\n\n        const aIndex = languageOrdering.indexOf(aBase);\n        const bIndex = languageOrdering.indexOf(bBase);\n\n        if (aIndex !== -1 && bIndex !== -1) return aIndex - bIndex;\n        if (aIndex !== -1) return -1;\n        if (bIndex !== -1) return 1;\n        return 0;\n      });\n    }\n\n    return filtered;\n  }, [\n    activeSDKType,\n    showSDKSelector,\n    languages,\n    languageOrdering,\n    originalLangMap,\n  ]);\n\n  // Determine the initial active language\n  const initialActiveLanguage = useMemo((): string | null => {\n    if (!lang) {\n      return filteredLanguages.length > 0 ? filteredLanguages[0] : null;\n    }\n\n    // Try with SDK prefix if applicable\n    if (activeSDKType) {\n      const prefixedLang = `${activeSDKType}_${lang}`;\n      if (languages.includes(prefixedLang)) {\n        return prefixedLang;\n      }\n    }\n\n    // Try direct match\n    if (languages.includes(lang)) {\n      return lang;\n    }\n\n    // Check if it's a known language but not available\n    if (getLanguageInfo(lang).label !== lang) {\n      return lang;\n    }\n\n    // Fallback to first available\n    return filteredLanguages.length > 0 ? filteredLanguages[0] : null;\n  }, [lang, activeSDKType, languages, filteredLanguages]);\n\n  // Initialize activeLanguage after filteredLanguages are calculated\n  useEffect(() => {\n    setActiveLanguage(initialActiveLanguage);\n  }, [initialActiveLanguage]);\n\n  // Update selected API key if apiKeys changes\n  useEffect(() => {\n    if (apiKeys && apiKeys.length > 0 && !apiKeys.includes(selectedApiKey)) {\n      setSelectedApiKey(apiKeys[0]);\n    }\n  }, [apiKeys, selectedApiKey]);\n\n  // Clean language utilities\n  const getCleanLanguage = useCallback(\n    (lang: string | null) => (lang ? originalLangMap.get(lang) || lang : null),\n    [originalLangMap],\n  );\n\n  // Get language info for display\n  const getLanguageInfoForDisplay = useCallback(\n    (lang: string | null) => {\n      if (!lang) return null;\n      const cleanLang = getCleanLanguage(lang);\n      return cleanLang ? getLanguageInfo(cleanLang) : null;\n    },\n    [getCleanLanguage],\n  );\n\n  // For language display name and icon (only depends on originalLangMap)\n  const getLanguageDisplayName = useCallback(\n    (lang: string) => {\n      const cleanLang = getCleanLanguage(lang);\n      return cleanLang ? getLanguageInfo(cleanLang).label : lang;\n    },\n    [getCleanLanguage],\n  );\n\n  const getLanguageIcon = useCallback(\n    (lang: string): IconName => {\n      const cleanLang = getCleanLanguage(lang);\n      return cleanLang\n        ? getLanguageInfo(cleanLang).icon\n        : \"icon-gui-document-mini\";\n    },\n    [getCleanLanguage],\n  );\n\n  // Memoize the active language info\n  const activeLanguageInfo = useMemo(\n    () => getLanguageInfoForDisplay(activeLanguage),\n    [getLanguageInfoForDisplay, activeLanguage],\n  );\n\n  // Filter and process children for the active language\n  const processedChildren = useMemo(() => {\n    if (!activeLanguage) return [];\n\n    // Target language is either the active one or json in json-only mode\n    const targetLanguage = hasOnlyJsonSnippet ? \"json\" : activeLanguage;\n\n    return childrenArray\n      .filter((child) => {\n        if (!isValidElement(child)) return false;\n        const codeElement = isValidElement(child.props.children)\n          ? child.props.children\n          : null;\n        const langName = extractLanguageFromCode(codeElement);\n        return langName === targetLanguage;\n      })\n      .map((child) => {\n        if (!isValidElement(child)) return child;\n\n        const preElement = child;\n        const codeElement = isValidElement(preElement.props.children)\n          ? preElement.props.children\n          : null;\n        if (!codeElement) return child;\n\n        const codeContent = codeElement.props.children;\n        const langName = extractLanguageFromCode(codeElement);\n        if (!langName) return child;\n\n        const cleanLang = hasOnlyJsonSnippet\n          ? \"json\"\n          : getCleanLanguage(langName) || langName;\n        const langInfo = getLanguageInfo(cleanLang);\n\n        // Handle primitive content types\n        if (\n          typeof codeContent === \"string\" ||\n          typeof codeContent === \"number\" ||\n          typeof codeContent === \"boolean\"\n        ) {\n          return (\n            <Code\n              key={langName}\n              language={langInfo.syntaxHighlighterKey || cleanLang}\n              snippet={String(codeContent)}\n              additionalCSS=\"bg-neutral-100 text-neutral-1300 dark:bg-neutral-1200 dark:text-neutral-200 px-6 py-4\"\n              showLines={showCodeLines}\n            />\n          );\n        }\n\n        return child;\n      });\n  }, [\n    activeLanguage,\n    childrenArray,\n    extractLanguageFromCode,\n    getCleanLanguage,\n    hasOnlyJsonSnippet,\n    showCodeLines,\n  ]);\n\n  // Check if there's a snippet available for the active language\n  const hasSnippetForActiveLanguage = useMemo(() => {\n    if (!activeLanguage) return false;\n    if (hasOnlyJsonSnippet) return true;\n\n    return childrenArray.some((child) => {\n      if (!isValidElement(child)) return false;\n      const codeElement = isValidElement(child.props.children)\n        ? child.props.children\n        : null;\n      const langName = extractLanguageFromCode(codeElement);\n      return langName === activeLanguage;\n    });\n  }, [\n    activeLanguage,\n    childrenArray,\n    extractLanguageFromCode,\n    hasOnlyJsonSnippet,\n  ]);\n\n  // Function to get the current code text content\n  const getCodeText = useCallback((): string | null => {\n    if (!activeLanguage || !hasSnippetForActiveLanguage || !codeRef.current)\n      return null;\n\n    const allPreElements = codeRef.current.querySelectorAll(\"pre\");\n    for (const preElement of Array.from(allPreElements)) {\n      const codeElement = preElement.querySelector(\"code\");\n      if (!codeElement || !codeElement.className) continue;\n\n      const classNames = codeElement.className.split(\" \");\n      const langClass = classNames.find((cls) => cls.startsWith(\"language-\"));\n      if (!langClass) continue;\n\n      const langName = langClass.substring(9);\n      if (\n        (hasOnlyJsonSnippet && langName === \"json\") ||\n        (!hasOnlyJsonSnippet && langName === activeLanguage)\n      ) {\n        return codeElement.textContent || \"\";\n      }\n    }\n\n    return null;\n  }, [activeLanguage, hasSnippetForActiveLanguage, hasOnlyJsonSnippet]);\n\n  // Event handlers\n  const handleSDKTypeChange = useCallback(\n    (type: SDKType) => {\n      // pick first language matching the new SDK prefix\n      const nextLang = languages.find((l) => l.startsWith(`${type}_`)) ?? null;\n      setActiveSDKType(type);\n      setActiveLanguage(nextLang);\n    },\n    [languages],\n  );\n\n  const handleLanguageChange = useCallback(\n    (language: string) => {\n      setActiveLanguage(language);\n\n      // Call onChange with clean language name\n      if (onChange) {\n        const cleanLang = getCleanLanguage(language) || language;\n        onChange(cleanLang, activeSDKType);\n      }\n    },\n    [onChange, getCleanLanguage, activeSDKType],\n  );\n\n  const handleApiKeyChange = useCallback((apiKey: string) => {\n    setSelectedApiKey(apiKey);\n  }, []);\n\n  // Optimize no-snippet message as a component\n  const NoSnippetMessage = useMemo(() => {\n    if (!activeLanguageInfo) return () => null;\n\n    return () => (\n      <div className=\"px-16 py-6 ui-text-body2 text-neutral-800 dark:text-neutral-400 text-center flex flex-col gap-3 items-center\">\n        <Icon\n          name=\"icon-gui-exclamation-triangle-outline\"\n          color=\"text-yellow-600 dark:text-yellow-400\"\n          size=\"24px\"\n        />\n        <p className=\"ui-text-p3 text-neutral-700 dark:text-neutral-600\">\n          You&apos;re currently viewing the {activeLanguageInfo.label} docs.\n          There either isn&apos;t a {activeLanguageInfo.label} code sample for\n          this example, or this feature isn&apos;t supported in{\" \"}\n          {activeLanguageInfo.label}. Switch language to view this example in a\n          different language, or check which SDKs support this feature.\n        </p>\n      </div>\n    );\n  }, [activeLanguageInfo]);\n\n  // Determine if we should show the language selector\n  const showLanguageSelector = !fixed && filteredLanguages.length > 0;\n  const showFullSelector = filteredLanguages.length > 1;\n\n  // Memoize renderContent\n  const renderContent = useMemo(() => {\n    if (!activeLanguage) return null;\n\n    if (hasSnippetForActiveLanguage) {\n      return processedChildren;\n    }\n\n    if (activeLanguageInfo) {\n      return <NoSnippetMessage />;\n    }\n\n    return null;\n  }, [\n    activeLanguage,\n    hasSnippetForActiveLanguage,\n    processedChildren,\n    activeLanguageInfo,\n    NoSnippetMessage,\n  ]);\n\n  // Render special case for shell commands\n  if (isSingleShellCommand) {\n    const shellChild = childrenArray[0];\n    if (\n      isValidElement(shellChild) &&\n      isValidElement(shellChild.props.children)\n    ) {\n      const codeElement = shellChild.props.children;\n      const codeContent = codeElement.props.children;\n      return (\n        <ShellCommandView content={String(codeContent)} className={className} />\n      );\n    }\n  }\n\n  return (\n    <div\n      className={cn(\n        \"rounded-lg overflow-hidden bg-neutral-100 dark:bg-neutral-1200 border border-neutral-300 dark:border-neutral-1000 min-h-[3.375rem]\",\n        className,\n      )}\n    >\n      {headerRow && (\n        <div className=\"h-[2.375rem] bg-neutral-200 dark:bg-neutral-1100 border-b border-neutral-300 dark:border-neutral-1000 flex items-center py-1 px-3 rounded-t-lg\">\n          {/* macOS window buttons */}\n          <div className=\"flex space-x-1.5\">\n            <div className=\"w-3 h-3 rounded-full bg-orange-500\"></div>\n            <div className=\"w-3 h-3 rounded-full bg-yellow-500\"></div>\n            <div className=\"w-3 h-3 rounded-full bg-green-500\"></div>\n          </div>\n\n          {/* Title */}\n          <div className=\"flex-1 text-center ui-text-p3 font-bold text-neutral-1300 dark:text-neutral-000\">\n            {title}\n          </div>\n\n          {/* Empty div for balance */}\n          <div className=\"w-12\"></div>\n        </div>\n      )}\n\n      {/* SDK Type Selector Row */}\n      {showSDKSelector && (\n        <div\n          className={cn(\n            \"p-2 border-b border-neutral-200 dark:border-neutral-1100 h-14\",\n            headerRow ? \"\" : \"rounded-t-lg\",\n          )}\n        >\n          <div className=\"flex gap-3 justify-start\">\n            {sdkTypes.has(\"realtime\") && (\n              <TooltipButton\n                tooltip=\"Realtime SDK\"\n                active={activeSDKType === \"realtime\"}\n                onClick={() => handleSDKTypeChange(\"realtime\")}\n                variant=\"segmented\"\n                size=\"sm\"\n                alwaysShowLabel={true}\n              >\n                Realtime\n              </TooltipButton>\n            )}\n\n            {sdkTypes.has(\"rest\") && (\n              <TooltipButton\n                tooltip=\"REST SDK\"\n                active={activeSDKType === \"rest\"}\n                onClick={() => handleSDKTypeChange(\"rest\")}\n                variant=\"segmented\"\n                size=\"sm\"\n                alwaysShowLabel={true}\n              >\n                REST\n              </TooltipButton>\n            )}\n          </div>\n        </div>\n      )}\n\n      {/* Language Selector Row */}\n      {showLanguageSelector &&\n        (showFullSelector ? (\n          <LanguageSelector\n            languages={filteredLanguages}\n            activeLanguage={activeLanguage}\n            onLanguageChange={handleLanguageChange}\n            getLanguageDisplayName={getLanguageDisplayName}\n            getLanguageIcon={getLanguageIcon}\n            activeLanguageInfo={activeLanguageInfo}\n          />\n        ) : (\n          <div\n            className={cn(\n              \"border-b border-neutral-200 dark:border-neutral-1100 h-[2.125rem] inline-flex items-center px-3\",\n              { \"rounded-t-lg\": !headerRow },\n              { \"cursor-pointer\": filteredLanguages.length > 0 },\n            )}\n            {...(filteredLanguages.length > 0 && {\n              onClick: () => handleLanguageChange(filteredLanguages[0]),\n            })}\n          >\n            {filteredLanguages.length > 0 && (\n              <>\n                <Icon\n                  name={getLanguageIcon(filteredLanguages[0])}\n                  size=\"16px\"\n                  additionalCSS=\"mr-2\"\n                />\n                <span className=\"ui-text-label4 font-semibold text-neutral-800 dark:text-neutral-500 select-none\">\n                  {getLanguageDisplayName(filteredLanguages[0])}\n                </span>\n              </>\n            )}\n          </div>\n        ))}\n\n      <div\n        ref={codeRef}\n        className=\"relative\"\n        onMouseEnter={() => setIsHovering(true)}\n        onMouseLeave={() => setIsHovering(false)}\n        onFocus={() => setIsHovering(true)}\n        onBlur={() => setIsHovering(false)}\n        tabIndex={0}\n      >\n        {renderContent}\n\n        {/* Copy button - simplified conditional */}\n        {isHovering && activeLanguage && hasSnippetForActiveLanguage && (\n          <CopyButton\n            onCopy={() => {\n              const text = getCodeText();\n              if (text) copy(text);\n            }}\n            isCopied={isCopied}\n          />\n        )}\n      </div>\n\n      {/* API Key Selector */}\n      {apiKeys && (\n        <ApiKeySelector\n          apiKeys={apiKeys}\n          selectedApiKey={selectedApiKey}\n          onApiKeyChange={handleApiKeyChange}\n        />\n      )}\n    </div>\n  );\n};\n\nexport default CodeSnippet;\n"],"names":["React","useState","useEffect","Children","isValidElement","useRef","useCallback","useMemo","Code","cn","getLanguageInfo","Icon","LanguageSelector","ApiKeySelector","useCopyToClipboard","ShellCommandView","CopyButton","TooltipButton","CodeSnippet","fixed","headerRow","title","children","className","lang","onChange","apiKeys","sdk","showCodeLines","languageOrdering","codeRef","isCopied","copy","extractLanguageFromCode","codeElement","props","classNames","split","langClass","find","cls","startsWith","substring","childrenArray","languages","sdkTypes","originalLangMap","isSingleShellCommand","toArray","Set","Map","length","includes","forEach","child","preElement","langName","baseLanguage","add","set","push","activeSDKType","setActiveSDKType","size","has","activeLanguage","setActiveLanguage","selectedApiKey","setSelectedApiKey","isHovering","setIsHovering","showSDKSelector","hasOnlyJsonSnippet","filteredLanguages","filtered","filter","sort","a","b","aBase","get","bBase","aIndex","indexOf","bIndex","initialActiveLanguage","prefixedLang","label","getCleanLanguage","getLanguageInfoForDisplay","cleanLang","getLanguageDisplayName","getLanguageIcon","icon","activeLanguageInfo","processedChildren","targetLanguage","map","codeContent","langInfo","key","language","syntaxHighlighterKey","snippet","String","additionalCSS","showLines","hasSnippetForActiveLanguage","some","getCodeText","current","allPreElements","querySelectorAll","Array","from","querySelector","textContent","handleSDKTypeChange","type","nextLang","l","handleLanguageChange","handleApiKeyChange","apiKey","NoSnippetMessage","div","name","color","p","showLanguageSelector","showFullSelector","renderContent","shellChild","content","tooltip","active","onClick","variant","alwaysShowLabel","onLanguageChange","span","ref","onMouseEnter","onMouseLeave","onFocus","onBlur","tabIndex","onCopy","text","onApiKeyChange"],"mappings":"AAAA,OAAOA,OACLC,QAAQ,CACRC,SAAS,CACTC,QAAQ,CACRC,cAAc,CACdC,MAAM,CACNC,WAAW,CACXC,OAAO,KACF,OAAQ,AACf,QAAOC,SAAU,QAAS,AAC1B,QAAOC,OAAQ,YAAa,AAC5B,QAASC,eAAe,KAAQ,yBAA0B,AAC1D,QAAOC,SAAU,QAAS,AAC1B,QAAOC,qBAAsB,gCAAiC,AAC9D,QAAOC,mBAAoB,8BAA+B,AAE1D,QAAOC,uBAAwB,4BAA6B,AAC5D,QAAOC,qBAAsB,gCAAiC,AAC9D,QAAOC,eAAgB,0BAA2B,AAClD,QAAOC,kBAAmB,6BAA8B,CAyDxD,MAAMC,YAA0C,CAAC,CAC/CC,MAAQ,KAAK,CACbC,UAAY,KAAK,CACjBC,MAAQ,MAAM,CACdC,QAAQ,CACRC,SAAS,CACTC,IAAI,CACJC,QAAQ,CACRC,OAAO,CACPC,GAAG,CACHC,cAAgB,IAAI,CACpBC,gBAAgB,CACjB,IACC,MAAMC,QAAUzB,OAAuB,MACvC,KAAM,CAAE0B,QAAQ,CAAEC,IAAI,CAAE,CAAGlB,qBAG3B,MAAMmB,wBAA0B3B,YAC9B,AAAC4B,cACC,GAAI,CAACA,aAAe,CAACA,YAAYC,KAAK,CAACZ,SAAS,CAAE,OAAO,KAEzD,MAAMa,WAAaF,YAAYC,KAAK,CAACZ,SAAS,CAACc,KAAK,CAAC,KACrD,MAAMC,UAAYF,WAAWG,IAAI,CAAC,AAACC,KACjCA,IAAIC,UAAU,CAAC,cAEjB,GAAI,CAACH,UAAW,OAAO,KAEvB,OAAOA,UAAUI,SAAS,CAAC,EAC7B,EACA,EAAE,EAIJ,KAAM,CACJC,aAAa,CACbC,SAAS,CACTC,QAAQ,CACRC,eAAe,CACfC,oBAAoB,CACrB,CAAGxC,QAAQ,KACV,MAAMoC,cAAgBxC,SAAS6C,OAAO,CAAC1B,UACvC,MAAMsB,UAAsB,EAAE,CAC9B,MAAMC,SAAW,IAAII,IACrB,MAAMH,gBAAkB,IAAII,IAG5B,MAAMH,qBACJJ,cAAcQ,MAAM,GAAK,GACzB/C,eAAeuC,aAAa,CAAC,EAAE,GAC/BvC,eAAeuC,aAAa,CAAC,EAAE,CAACR,KAAK,CAACb,QAAQ,GAC9CqB,aAAa,CAAC,EAAE,CAACR,KAAK,CAACb,QAAQ,CAACa,KAAK,CAACZ,SAAS,EAAE6B,SAC/C,kBAIJT,cAAcU,OAAO,CAAC,AAACC,QACrB,GAAI,CAAClD,eAAekD,OAAQ,OAE5B,MAAMC,WAAaD,MACnB,MAAMpB,YAAc9B,eAAemD,WAAWpB,KAAK,CAACb,QAAQ,EACxDiC,WAAWpB,KAAK,CAACb,QAAQ,CACzB,KAEJ,MAAMkC,SAAWvB,wBAAwBC,aACzC,GAAI,CAACsB,SAAU,OAGf,GAAIA,SAASf,UAAU,CAAC,aAAc,CACpC,MAAMgB,aAAeD,SAASd,SAAS,CAAC,GACxCG,SAASa,GAAG,CAAC,YACbZ,gBAAgBa,GAAG,CAACH,SAAUC,aAChC,MAAO,GAAID,SAASf,UAAU,CAAC,SAAU,CACvC,MAAMgB,aAAeD,SAASd,SAAS,CAAC,GACxCG,SAASa,GAAG,CAAC,QACbZ,gBAAgBa,GAAG,CAACH,SAAUC,aAChC,KAAO,CACLX,gBAAgBa,GAAG,CAACH,SAAUA,SAChC,CAGA,GAAI,CAACZ,UAAUQ,QAAQ,CAACI,UAAW,CACjCZ,UAAUgB,IAAI,CAACJ,SACjB,CACF,GAEA,MAAO,CACLb,cACAC,UACAC,SACAC,gBACAC,oBACF,CACF,EAAG,CAACzB,SAAUW,wBAAwB,EAGtC,KAAM,CAAC4B,cAAeC,iBAAiB,CAAG7D,SAAkB,KAC1D,GAAI4C,SAASkB,IAAI,GAAK,EAAG,OAAO,KAChC,GAAIpC,KAAOkB,SAASmB,GAAG,CAACrC,KAAM,OAAOA,IACrC,GAAIkB,SAASmB,GAAG,CAAC,YAAa,MAAO,WACrC,GAAInB,SAASmB,GAAG,CAAC,QAAS,MAAO,OACjC,OAAO,IACT,GACA,KAAM,CAACC,eAAgBC,kBAAkB,CAAGjE,SAAwB,MACpE,KAAM,CAACkE,eAAgBC,kBAAkB,CAAGnE,SAAS,IACnDyB,SAAWA,QAAQyB,MAAM,CAAG,EAAIzB,OAAO,CAAC,EAAE,CAAG,IAE/C,KAAM,CAAC2C,WAAYC,cAAc,CAAGrE,SAAS,OAG7C,MAAMsE,gBAAkB1B,SAASkB,IAAI,CAAG,EAGxC,MAAMS,mBAAqBjE,QACzB,IAAMqC,UAAUO,MAAM,GAAK,GAAKP,SAAS,CAAC,EAAE,GAAK,OACjD,CAACA,UAAU,EAIb,MAAM6B,kBAAoBlE,QAAQ,KAEhC,MAAMmE,SACJ,CAACb,eAAiB,CAACU,gBACf,IAAI3B,UAAU,CACdA,UAAU+B,MAAM,CAAC,AAACnD,MAASA,KAAKiB,UAAU,CAAC,CAAC,EAAEoB,cAAc,CAAC,CAAC,GAGpE,GAAIhC,kBAAoBA,iBAAiBsB,MAAM,CAAG,EAAG,CACnDuB,SAASE,IAAI,CAAC,CAACC,EAAGC,KAChB,MAAMC,MAAQjC,gBAAgBkC,GAAG,CAACH,IAAMA,EACxC,MAAMI,MAAQnC,gBAAgBkC,GAAG,CAACF,IAAMA,EAExC,MAAMI,OAASrD,iBAAiBsD,OAAO,CAACJ,OACxC,MAAMK,OAASvD,iBAAiBsD,OAAO,CAACF,OAExC,GAAIC,SAAW,CAAC,GAAKE,SAAW,CAAC,EAAG,OAAOF,OAASE,OACpD,GAAIF,SAAW,CAAC,EAAG,MAAO,CAAC,EAC3B,GAAIE,SAAW,CAAC,EAAG,OAAO,EAC1B,OAAO,CACT,EACF,CAEA,OAAOV,QACT,EAAG,CACDb,cACAU,gBACA3B,UACAf,iBACAiB,gBACD,EAGD,MAAMuC,sBAAwB9E,QAAQ,KACpC,GAAI,CAACiB,KAAM,CACT,OAAOiD,kBAAkBtB,MAAM,CAAG,EAAIsB,iBAAiB,CAAC,EAAE,CAAG,IAC/D,CAGA,GAAIZ,cAAe,CACjB,MAAMyB,aAAe,CAAC,EAAEzB,cAAc,CAAC,EAAErC,KAAK,CAAC,CAC/C,GAAIoB,UAAUQ,QAAQ,CAACkC,cAAe,CACpC,OAAOA,YACT,CACF,CAGA,GAAI1C,UAAUQ,QAAQ,CAAC5B,MAAO,CAC5B,OAAOA,IACT,CAGA,GAAId,gBAAgBc,MAAM+D,KAAK,GAAK/D,KAAM,CACxC,OAAOA,IACT,CAGA,OAAOiD,kBAAkBtB,MAAM,CAAG,EAAIsB,iBAAiB,CAAC,EAAE,CAAG,IAC/D,EAAG,CAACjD,KAAMqC,cAAejB,UAAW6B,kBAAkB,EAGtDvE,UAAU,KACRgE,kBAAkBmB,sBACpB,EAAG,CAACA,sBAAsB,EAG1BnF,UAAU,KACR,GAAIwB,SAAWA,QAAQyB,MAAM,CAAG,GAAK,CAACzB,QAAQ0B,QAAQ,CAACe,gBAAiB,CACtEC,kBAAkB1C,OAAO,CAAC,EAAE,CAC9B,CACF,EAAG,CAACA,QAASyC,eAAe,EAG5B,MAAMqB,iBAAmBlF,YACvB,AAACkB,MAAyBA,KAAOsB,gBAAgBkC,GAAG,CAACxD,OAASA,KAAO,KACrE,CAACsB,gBAAgB,EAInB,MAAM2C,0BAA4BnF,YAChC,AAACkB,OACC,GAAI,CAACA,KAAM,OAAO,KAClB,MAAMkE,UAAYF,iBAAiBhE,MACnC,OAAOkE,UAAYhF,gBAAgBgF,WAAa,IAClD,EACA,CAACF,iBAAiB,EAIpB,MAAMG,uBAAyBrF,YAC7B,AAACkB,OACC,MAAMkE,UAAYF,iBAAiBhE,MACnC,OAAOkE,UAAYhF,gBAAgBgF,WAAWH,KAAK,CAAG/D,IACxD,EACA,CAACgE,iBAAiB,EAGpB,MAAMI,gBAAkBtF,YACtB,AAACkB,OACC,MAAMkE,UAAYF,iBAAiBhE,MACnC,OAAOkE,UACHhF,gBAAgBgF,WAAWG,IAAI,CAC/B,wBACN,EACA,CAACL,iBAAiB,EAIpB,MAAMM,mBAAqBvF,QACzB,IAAMkF,0BAA0BxB,gBAChC,CAACwB,0BAA2BxB,eAAe,EAI7C,MAAM8B,kBAAoBxF,QAAQ,KAChC,GAAI,CAAC0D,eAAgB,MAAO,EAAE,CAG9B,MAAM+B,eAAiBxB,mBAAqB,OAASP,eAErD,OAAOtB,cACJgC,MAAM,CAAC,AAACrB,QACP,GAAI,CAAClD,eAAekD,OAAQ,OAAO,MACnC,MAAMpB,YAAc9B,eAAekD,MAAMnB,KAAK,CAACb,QAAQ,EACnDgC,MAAMnB,KAAK,CAACb,QAAQ,CACpB,KACJ,MAAMkC,SAAWvB,wBAAwBC,aACzC,OAAOsB,WAAawC,cACtB,GACCC,GAAG,CAAC,AAAC3C,QACJ,GAAI,CAAClD,eAAekD,OAAQ,OAAOA,MAEnC,MAAMC,WAAaD,MACnB,MAAMpB,YAAc9B,eAAemD,WAAWpB,KAAK,CAACb,QAAQ,EACxDiC,WAAWpB,KAAK,CAACb,QAAQ,CACzB,KACJ,GAAI,CAACY,YAAa,OAAOoB,MAEzB,MAAM4C,YAAchE,YAAYC,KAAK,CAACb,QAAQ,CAC9C,MAAMkC,SAAWvB,wBAAwBC,aACzC,GAAI,CAACsB,SAAU,OAAOF,MAEtB,MAAMoC,UAAYlB,mBACd,OACAgB,iBAAiBhC,WAAaA,SAClC,MAAM2C,SAAWzF,gBAAgBgF,WAGjC,GACE,OAAOQ,cAAgB,UACvB,OAAOA,cAAgB,UACvB,OAAOA,cAAgB,UACvB,CACA,OACE,oBAAC1F,MACC4F,IAAK5C,SACL6C,SAAUF,SAASG,oBAAoB,EAAIZ,UAC3Ca,QAASC,OAAON,aAChBO,cAAc,wFACdC,UAAW9E,eAGjB,CAEA,OAAO0B,KACT,EACJ,EAAG,CACDW,eACAtB,cACAV,wBACAuD,iBACAhB,mBACA5C,cACD,EAGD,MAAM+E,4BAA8BpG,QAAQ,KAC1C,GAAI,CAAC0D,eAAgB,OAAO,MAC5B,GAAIO,mBAAoB,OAAO,KAE/B,OAAO7B,cAAciE,IAAI,CAAC,AAACtD,QACzB,GAAI,CAAClD,eAAekD,OAAQ,OAAO,MACnC,MAAMpB,YAAc9B,eAAekD,MAAMnB,KAAK,CAACb,QAAQ,EACnDgC,MAAMnB,KAAK,CAACb,QAAQ,CACpB,KACJ,MAAMkC,SAAWvB,wBAAwBC,aACzC,OAAOsB,WAAaS,cACtB,EACF,EAAG,CACDA,eACAtB,cACAV,wBACAuC,mBACD,EAGD,MAAMqC,YAAcvG,YAAY,KAC9B,GAAI,CAAC2D,gBAAkB,CAAC0C,6BAA+B,CAAC7E,QAAQgF,OAAO,CACrE,OAAO,KAET,MAAMC,eAAiBjF,QAAQgF,OAAO,CAACE,gBAAgB,CAAC,OACxD,IAAK,MAAMzD,cAAc0D,MAAMC,IAAI,CAACH,gBAAiB,CACnD,MAAM7E,YAAcqB,WAAW4D,aAAa,CAAC,QAC7C,GAAI,CAACjF,aAAe,CAACA,YAAYX,SAAS,CAAE,SAE5C,MAAMa,WAAaF,YAAYX,SAAS,CAACc,KAAK,CAAC,KAC/C,MAAMC,UAAYF,WAAWG,IAAI,CAAC,AAACC,KAAQA,IAAIC,UAAU,CAAC,cAC1D,GAAI,CAACH,UAAW,SAEhB,MAAMkB,SAAWlB,UAAUI,SAAS,CAAC,GACrC,GACE,AAAC8B,oBAAsBhB,WAAa,QACnC,CAACgB,oBAAsBhB,WAAaS,eACrC,CACA,OAAO/B,YAAYkF,WAAW,EAAI,EACpC,CACF,CAEA,OAAO,IACT,EAAG,CAACnD,eAAgB0C,4BAA6BnC,mBAAmB,EAGpE,MAAM6C,oBAAsB/G,YAC1B,AAACgH,OAEC,MAAMC,SAAW3E,UAAUL,IAAI,CAAC,AAACiF,GAAMA,EAAE/E,UAAU,CAAC,CAAC,EAAE6E,KAAK,CAAC,CAAC,IAAM,KACpExD,iBAAiBwD,MACjBpD,kBAAkBqD,SACpB,EACA,CAAC3E,UAAU,EAGb,MAAM6E,qBAAuBnH,YAC3B,AAAC+F,WACCnC,kBAAkBmC,UAGlB,GAAI5E,SAAU,CACZ,MAAMiE,UAAYF,iBAAiBa,WAAaA,SAChD5E,SAASiE,UAAW7B,cACtB,CACF,EACA,CAACpC,SAAU+D,iBAAkB3B,cAAc,EAG7C,MAAM6D,mBAAqBpH,YAAY,AAACqH,SACtCvD,kBAAkBuD,OACpB,EAAG,EAAE,EAGL,MAAMC,iBAAmBrH,QAAQ,KAC/B,GAAI,CAACuF,mBAAoB,MAAO,IAAM,KAEtC,MAAO,IACL,oBAAC+B,OAAItG,UAAU,gHACb,oBAACZ,MACCmH,KAAK,wCACLC,MAAM,uCACNhE,KAAK,SAEP,oBAACiE,KAAEzG,UAAU,qDAAoD,gCAC5BuE,mBAAmBP,KAAK,CAAC,+BACjCO,mBAAmBP,KAAK,CAAC,oEACE,IACrDO,mBAAmBP,KAAK,CAAC,6GAKlC,EAAG,CAACO,mBAAmB,EAGvB,MAAMmC,qBAAuB,CAAC9G,OAASsD,kBAAkBtB,MAAM,CAAG,EAClE,MAAM+E,iBAAmBzD,kBAAkBtB,MAAM,CAAG,EAGpD,MAAMgF,cAAgB5H,QAAQ,KAC5B,GAAI,CAAC0D,eAAgB,OAAO,KAE5B,GAAI0C,4BAA6B,CAC/B,OAAOZ,iBACT,CAEA,GAAID,mBAAoB,CACtB,OAAO,oBAAC8B,sBACV,CAEA,OAAO,IACT,EAAG,CACD3D,eACA0C,4BACAZ,kBACAD,mBACA8B,iBACD,EAGD,GAAI7E,qBAAsB,CACxB,MAAMqF,WAAazF,aAAa,CAAC,EAAE,CACnC,GACEvC,eAAegI,aACfhI,eAAegI,WAAWjG,KAAK,CAACb,QAAQ,EACxC,CACA,MAAMY,YAAckG,WAAWjG,KAAK,CAACb,QAAQ,CAC7C,MAAM4E,YAAchE,YAAYC,KAAK,CAACb,QAAQ,CAC9C,OACE,oBAACP,kBAAiBsH,QAAS7B,OAAON,aAAc3E,UAAWA,WAE/D,CACF,CAEA,OACE,oBAACsG,OACCtG,UAAWd,GACT,qIACAc,YAGDH,WACC,oBAACyG,OAAItG,UAAU,kJAEb,oBAACsG,OAAItG,UAAU,oBACb,oBAACsG,OAAItG,UAAU,uCACf,oBAACsG,OAAItG,UAAU,uCACf,oBAACsG,OAAItG,UAAU,uCAIjB,oBAACsG,OAAItG,UAAU,mFACZF,OAIH,oBAACwG,OAAItG,UAAU,UAKlBgD,iBACC,oBAACsD,OACCtG,UAAWd,GACT,gEACAW,UAAY,GAAK,iBAGnB,oBAACyG,OAAItG,UAAU,4BACZsB,SAASmB,GAAG,CAAC,aACZ,oBAAC/C,eACCqH,QAAQ,eACRC,OAAQ1E,gBAAkB,WAC1B2E,QAAS,IAAMnB,oBAAoB,YACnCoB,QAAQ,YACR1E,KAAK,KACL2E,gBAAiB,MAClB,YAKF7F,SAASmB,GAAG,CAAC,SACZ,oBAAC/C,eACCqH,QAAQ,WACRC,OAAQ1E,gBAAkB,OAC1B2E,QAAS,IAAMnB,oBAAoB,QACnCoB,QAAQ,YACR1E,KAAK,KACL2E,gBAAiB,MAClB,UASRT,sBACEC,CAAAA,iBACC,oBAACtH,kBACCgC,UAAW6B,kBACXR,eAAgBA,eAChB0E,iBAAkBlB,qBAClB9B,uBAAwBA,uBACxBC,gBAAiBA,gBACjBE,mBAAoBA,qBAGtB,oBAAC+B,OACCtG,UAAWd,GACT,kGACA,CAAE,eAAgB,CAACW,SAAU,EAC7B,CAAE,iBAAkBqD,kBAAkBtB,MAAM,CAAG,CAAE,GAElD,GAAIsB,kBAAkBtB,MAAM,CAAG,GAAK,CACnCqF,QAAS,IAAMf,qBAAqBhD,iBAAiB,CAAC,EAAE,CAC1D,CAAC,EAEAA,kBAAkBtB,MAAM,CAAG,GAC1B,wCACE,oBAACxC,MACCmH,KAAMlC,gBAAgBnB,iBAAiB,CAAC,EAAE,EAC1CV,KAAK,OACL0C,cAAc,SAEhB,oBAACmC,QAAKrH,UAAU,mFACboE,uBAAuBlB,iBAAiB,CAAC,EAAE,IAKtD,EAEF,oBAACoD,OACCgB,IAAK/G,QACLP,UAAU,WACVuH,aAAc,IAAMxE,cAAc,MAClCyE,aAAc,IAAMzE,cAAc,OAClC0E,QAAS,IAAM1E,cAAc,MAC7B2E,OAAQ,IAAM3E,cAAc,OAC5B4E,SAAU,GAETf,cAGA9D,YAAcJ,gBAAkB0C,6BAC/B,oBAAC3F,YACCmI,OAAQ,KACN,MAAMC,KAAOvC,cACb,GAAIuC,KAAMpH,KAAKoH,KACjB,EACArH,SAAUA,YAMfL,SACC,oBAACb,gBACCa,QAASA,QACTyC,eAAgBA,eAChBkF,eAAgB3B,qBAK1B,CAEA,gBAAexG,WAAY"}
+{"version":3,"sources":["../../src/core/CodeSnippet.tsx"],"sourcesContent":["import React, {\n  useState,\n  useEffect,\n  Children,\n  isValidElement,\n  useRef,\n  useCallback,\n  useMemo,\n} from \"react\";\nimport Code from \"./Code\";\nimport cn from \"./utils/cn\";\nimport Icon from \"./Icon\";\nimport { getLanguageInfo, stripSdkType } from \"./CodeSnippet/languages\";\nimport LanguageSelector from \"./CodeSnippet/LanguageSelector\";\nimport ApiKeySelector from \"./CodeSnippet/ApiKeySelector\";\nimport useCopyToClipboard from \"./utils/useCopyToClipboard\";\nimport PlainCodeView from \"./CodeSnippet/PlainCodeView\";\nimport CopyButton from \"./CodeSnippet/CopyButton\";\nimport TooltipButton from \"./CodeSnippet/TooltipButton\";\n\n// Define SDK type\nexport type SDKType = \"realtime\" | \"rest\" | null;\n\n// Define API key types\nexport type ApiKeysItem = {\n  app: string;\n  keys: { name: string; key: string }[];\n};\n\nexport type CodeSnippetProps = {\n  /**\n   * If true, hides the language selector row completely\n   */\n  fixed?: boolean;\n  /**\n   * If true, renders a macOS-style window header with buttons and title\n   */\n  headerRow?: boolean;\n  /**\n   * Title to display in the header row (when headerRow is true)\n   */\n  title?: string;\n  /**\n   * Children elements with lang attribute\n   */\n  children: React.ReactNode;\n  /**\n   * Additional CSS classes\n   */\n  className?: string;\n  /**\n   * Default language to display. If not found in available languages, first available is used.\n   * If found in languages but no matching snippet exists, a message is displayed.\n   */\n  lang?: string;\n  /**\n   * Callback fired when the active language changes\n   */\n  onChange?: (language: string, sdk?: SDKType) => void;\n  /**\n   * List of API keys to display in a dropdown\n   */\n  apiKeys?: ApiKeysItem[];\n  /**\n   * Default SDK type to use for the code snippet\n   */\n  sdk?: SDKType;\n  /**\n   * Whether to show line numbers in code snippets\n   */\n  showCodeLines?: boolean;\n  /**\n   * Defines the order in which languages should be displayed.\n   * Languages not in this array will be shown after those that are included.\n   */\n  languageOrdering?: string[];\n};\n\n// Substitution function for API key placeholders\nconst substituteApiKey = (content: string, apiKey: string): string => {\n  return content.replace(/\\{\\{API_KEY\\}\\}/g, `${apiKey.split(\":\")[0]}:*****`);\n};\n\n/**\n * CodeSnippet component that displays code with language switching capability\n */\nconst CodeSnippet: React.FC<CodeSnippetProps> = ({\n  fixed = false,\n  headerRow = false,\n  title = \"Code\",\n  children,\n  className,\n  lang,\n  onChange,\n  apiKeys,\n  sdk,\n  showCodeLines = true,\n  languageOrdering,\n}) => {\n  const codeRef = useRef<HTMLDivElement>(null);\n  const { isCopied, copy } = useCopyToClipboard();\n\n  const extractLanguageFromCode = useCallback(\n    (codeElement: React.ReactElement | null): string | null => {\n      if (!codeElement || !codeElement.props.className) return null;\n\n      const classNames = codeElement.props.className.split(\" \");\n      const langClass = classNames.find((cls: string) =>\n        cls.startsWith(\"language-\"),\n      );\n      if (!langClass) return null;\n\n      return langClass.substring(9); // Remove \"language-\" prefix\n    },\n    [],\n  );\n\n  const { codeData, languages, sdkTypes, isSinglePlainCommand } =\n    useMemo(() => {\n      const childrenArray = Children.toArray(children);\n      const languages: string[] = [];\n      const sdkTypes = new Set<SDKType>();\n      const codeData: { language: string; content: string }[] = [];\n\n      const isSinglePlainCommand =\n        childrenArray.length === 1 &&\n        [\"language-shell\", \"language-text\"].some(\n          (lang) =>\n            isValidElement(childrenArray[0]) &&\n            isValidElement(childrenArray[0].props.children) &&\n            childrenArray[0].props.children.props.className?.includes(lang),\n        );\n\n      childrenArray.forEach((child) => {\n        if (!isValidElement(child)) return;\n\n        const preElement = child;\n        const codeElement = isValidElement(preElement.props.children)\n          ? preElement.props.children\n          : null;\n\n        if (!codeElement) return;\n\n        const codeLanguage = extractLanguageFromCode(codeElement);\n\n        if (!codeLanguage) return;\n\n        if (codeLanguage.startsWith(\"realtime_\")) {\n          sdkTypes.add(\"realtime\");\n        } else if (codeLanguage.startsWith(\"rest_\")) {\n          sdkTypes.add(\"rest\");\n        }\n\n        if (!languages.includes(codeLanguage)) {\n          languages.push(codeLanguage);\n        }\n\n        const codeContent = codeElement.props.children;\n        codeData.push({ language: codeLanguage, content: codeContent });\n      });\n\n      return {\n        codeData,\n        languages,\n        sdkTypes,\n        isSinglePlainCommand,\n      };\n    }, [children, extractLanguageFromCode]);\n\n  const [activeSDKType, setActiveSDKType] = useState<SDKType>(() => {\n    if (sdkTypes.size === 0) return null;\n    if (sdk && sdkTypes.has(sdk)) return sdk;\n    if (sdkTypes.has(\"realtime\")) return \"realtime\";\n    if (sdkTypes.has(\"rest\")) return \"rest\";\n    return null;\n  });\n\n  const showSDKSelector = sdkTypes.size > 0;\n\n  const filteredLanguages = useMemo(() => {\n    const filtered =\n      !activeSDKType || !showSDKSelector\n        ? [...languages]\n        : languages.filter((lang) => lang.startsWith(`${activeSDKType}_`));\n\n    // Apply custom ordering if provided\n    if (languageOrdering && languageOrdering.length > 0) {\n      filtered.sort((a, b) => {\n        const aBase = stripSdkType(a);\n        const bBase = stripSdkType(b);\n\n        const aIndex = languageOrdering.indexOf(aBase);\n        const bIndex = languageOrdering.indexOf(bBase);\n\n        if (aIndex !== -1 && bIndex !== -1) return aIndex - bIndex;\n        if (aIndex !== -1) return -1;\n        if (bIndex !== -1) return 1;\n        return 0;\n      });\n    }\n\n    return filtered;\n  }, [activeSDKType, showSDKSelector, languages, languageOrdering]);\n\n  const activeLanguage = useMemo(() => {\n    if (sdk && sdkTypes.has(sdk)) {\n      return languages.find((l) => l === `${sdk}_${lang}`) ?? languages[0];\n    }\n\n    if (lang) return lang;\n\n    if (filteredLanguages.length > 0) return filteredLanguages[0];\n\n    return languages[0];\n  }, [lang, sdk, sdkTypes, filteredLanguages]);\n\n  const [selectedApiKey, setSelectedApiKey] = useState<string>(\n    () => apiKeys?.[0]?.keys?.[0]?.key ?? \"\",\n  );\n\n  useEffect(() => {\n    if (!selectedApiKey && apiKeys && apiKeys.length > 0) {\n      setSelectedApiKey(apiKeys[0].keys?.[0]?.key);\n    }\n  }, [apiKeys]);\n\n  const requiresApiKeySubstitution = useMemo(() => {\n    const containsPlaceholder = codeData.some(\n      (code) =>\n        code?.content.includes(\"{{API_KEY}}\") && code?.language === lang,\n    );\n\n    return (\n      containsPlaceholder && !!apiKeys && apiKeys.length > 0 && !!selectedApiKey\n    );\n  }, [codeData, apiKeys, selectedApiKey, lang]);\n\n  const [isHovering, setIsHovering] = useState(false);\n\n  const hasOnlyJsonSnippet = useMemo(\n    () => languages.length === 1 && languages[0] === \"json\",\n    [languages],\n  );\n\n  const processedChildren = useMemo(() => {\n    if (!activeLanguage) return [];\n\n    const targetLanguage = hasOnlyJsonSnippet ? \"json\" : activeLanguage;\n\n    return codeData\n      .filter((code) => {\n        return code?.language === targetLanguage;\n      })\n      .map((code) => {\n        if (!code) return null;\n\n        const cleanLang = hasOnlyJsonSnippet ? \"json\" : code.language;\n        const langInfo = getLanguageInfo(cleanLang ?? \"\");\n\n        if (\n          typeof code.content === \"string\" ||\n          typeof code.content === \"number\" ||\n          typeof code.content === \"boolean\"\n        ) {\n          // Apply API key substitution if apiKeys are provided\n          let processedContent = String(code.content);\n          if (requiresApiKeySubstitution) {\n            processedContent = substituteApiKey(\n              processedContent,\n              selectedApiKey,\n            );\n          }\n\n          if (!langInfo.syntaxHighlighterKey || !cleanLang) return null;\n\n          return (\n            <Code\n              key={code.language}\n              language={langInfo.syntaxHighlighterKey || cleanLang}\n              snippet={processedContent}\n              additionalCSS=\"bg-neutral-100 text-neutral-1300 dark:bg-neutral-1200 dark:text-neutral-200 px-6 py-4\"\n              showLines={showCodeLines}\n            />\n          );\n        }\n\n        return null;\n      });\n  }, [\n    activeLanguage,\n    codeData,\n    hasOnlyJsonSnippet,\n    showCodeLines,\n    apiKeys,\n    selectedApiKey,\n  ]);\n\n  const hasSnippetForActiveLanguage = useMemo(() => {\n    if (!activeLanguage) return false;\n    if (hasOnlyJsonSnippet) return true;\n\n    return codeData.some((code) => {\n      return code?.language === activeLanguage;\n    });\n  }, [activeLanguage, hasOnlyJsonSnippet, codeData]);\n\n  const handleSDKTypeChange = useCallback(\n    (type: SDKType) => {\n      const nextLang = stripSdkType(\n        languages.find(\n          (l) => l === `${type}_${stripSdkType(activeLanguage)}`,\n        ) ??\n          languages.find((l) => l.startsWith(`${type}_`)) ??\n          activeLanguage,\n      );\n      setActiveSDKType(type);\n\n      if (onChange && nextLang) {\n        onChange(nextLang, type);\n      }\n    },\n    [languages],\n  );\n\n  const handleLanguageChange = useCallback(\n    (language: string) => {\n      if (onChange) {\n        onChange(stripSdkType(language), activeSDKType);\n      }\n    },\n    [onChange, activeSDKType],\n  );\n\n  const NoSnippetMessage = useMemo(() => {\n    if (!activeLanguage) return () => null;\n\n    const activeLanguageInfo = getLanguageInfo(activeLanguage);\n\n    return () => (\n      <div className=\"px-16 py-6 ui-text-body2 text-neutral-800 dark:text-neutral-400 text-center flex flex-col gap-3 items-center\">\n        <Icon\n          name=\"icon-gui-exclamation-triangle-outline\"\n          color=\"text-yellow-600 dark:text-yellow-400\"\n          size=\"24px\"\n        />\n        <p className=\"ui-text-p3 text-neutral-700 dark:text-neutral-600\">\n          You&apos;re currently viewing the {activeLanguageInfo.label} docs.\n          There either isn&apos;t a {activeLanguageInfo.label} code sample for\n          this example, or this feature isn&apos;t supported in{\" \"}\n          {activeLanguageInfo.label}. Switch language to view this example in a\n          different language, or check which SDKs support this feature.\n        </p>\n      </div>\n    );\n  }, [activeLanguage]);\n\n  const showLanguageSelector = !fixed && filteredLanguages.length > 0;\n  const showFullSelector = filteredLanguages.length > 1;\n\n  const renderContent = useMemo(() => {\n    if (!activeLanguage) return null;\n\n    if (hasSnippetForActiveLanguage) {\n      return processedChildren;\n    }\n\n    return <NoSnippetMessage />;\n  }, [\n    activeLanguage,\n    hasSnippetForActiveLanguage,\n    processedChildren,\n    NoSnippetMessage,\n  ]);\n\n  // Render special case for plain commands (shell or text)\n  if (isSinglePlainCommand) {\n    const plainChild = codeData[0];\n    if (plainChild) {\n      const codeContent = plainChild.content;\n      const language = plainChild.language;\n\n      if (!language || !codeContent) return null;\n\n      // Apply API key substitution if apiKeys are provided\n      let processedContent = String(codeContent);\n      if (requiresApiKeySubstitution) {\n        processedContent = substituteApiKey(processedContent, selectedApiKey);\n      }\n\n      return (\n        <PlainCodeView\n          content={processedContent}\n          className={className}\n          language={language}\n          icon={language === \"shell\" ? \"icon-gui-command-line-outline\" : null}\n        />\n      );\n    }\n  }\n\n  return (\n    <div\n      className={cn(\n        \"rounded-lg overflow-hidden bg-neutral-100 dark:bg-neutral-1200 border border-neutral-300 dark:border-neutral-1000 min-h-[3.375rem]\",\n        className,\n      )}\n    >\n      {headerRow && (\n        <div className=\"h-[2.375rem] bg-neutral-200 dark:bg-neutral-1100 border-b border-neutral-300 dark:border-neutral-1000 flex items-center py-1 px-3 rounded-t-lg\">\n          <div className=\"flex space-x-1.5\">\n            <div className=\"w-3 h-3 rounded-full bg-orange-500\"></div>\n            <div className=\"w-3 h-3 rounded-full bg-yellow-500\"></div>\n            <div className=\"w-3 h-3 rounded-full bg-green-500\"></div>\n          </div>\n\n          <div className=\"flex-1 text-center ui-text-p3 font-bold text-neutral-1300 dark:text-neutral-000\">\n            {title}\n          </div>\n\n          {/* Empty div for balance */}\n          <div className=\"w-12\"></div>\n        </div>\n      )}\n      {showSDKSelector && (\n        <div\n          className={cn(\n            \"p-2 border-b border-neutral-200 dark:border-neutral-1100 h-14\",\n            headerRow ? \"\" : \"rounded-t-lg\",\n          )}\n        >\n          <div className=\"flex gap-3 justify-start\">\n            {sdkTypes.has(\"realtime\") && (\n              <TooltipButton\n                tooltip=\"Realtime SDK\"\n                active={activeSDKType === \"realtime\"}\n                onClick={() => handleSDKTypeChange(\"realtime\")}\n                variant=\"segmented\"\n                size=\"sm\"\n                alwaysShowLabel={true}\n              >\n                Realtime\n              </TooltipButton>\n            )}\n\n            {sdkTypes.has(\"rest\") && (\n              <TooltipButton\n                tooltip=\"REST SDK\"\n                active={activeSDKType === \"rest\"}\n                onClick={() => handleSDKTypeChange(\"rest\")}\n                variant=\"segmented\"\n                size=\"sm\"\n                alwaysShowLabel={true}\n              >\n                REST\n              </TooltipButton>\n            )}\n          </div>\n        </div>\n      )}\n\n      {showLanguageSelector &&\n        (showFullSelector ? (\n          <LanguageSelector\n            languages={filteredLanguages}\n            activeLanguage={activeLanguage}\n            onLanguageChange={handleLanguageChange}\n          />\n        ) : (\n          <div\n            className={cn(\n              \"border-b border-neutral-200 dark:border-neutral-1100 h-[2.125rem] inline-flex items-center px-3 w-full\",\n              { \"rounded-t-lg\": !headerRow },\n            )}\n          >\n            {filteredLanguages.length > 0 && (\n              <div\n                className={cn(\"inline-flex items-center\", {\n                  \"cursor-pointer\": filteredLanguages.length > 0,\n                })}\n                {...(filteredLanguages.length > 0 && {\n                  onClick: () => handleLanguageChange(filteredLanguages[0]),\n                })}\n              >\n                <Icon\n                  name={getLanguageInfo(filteredLanguages[0]).icon}\n                  size=\"16px\"\n                  additionalCSS=\"mr-2\"\n                />\n                <span className=\"ui-text-label4 font-semibold text-neutral-800 dark:text-neutral-500 select-none\">\n                  {getLanguageInfo(filteredLanguages[0]).label}\n                </span>\n              </div>\n            )}\n          </div>\n        ))}\n      <div\n        ref={codeRef}\n        className=\"relative\"\n        onMouseEnter={() => setIsHovering(true)}\n        onMouseLeave={() => setIsHovering(false)}\n        onFocus={() => setIsHovering(true)}\n        onBlur={() => setIsHovering(false)}\n        tabIndex={0}\n      >\n        {renderContent}\n        {isHovering && activeLanguage && (\n          <CopyButton\n            onCopy={() => {\n              const text = codeData.find(\n                (code) => code.language === activeLanguage,\n              )?.content;\n              if (text) copy(text);\n            }}\n            isCopied={isCopied}\n          />\n        )}\n      </div>\n      {requiresApiKeySubstitution && (\n        <ApiKeySelector\n          apiKeys={apiKeys}\n          selectedApiKey={selectedApiKey}\n          onApiKeyChange={setSelectedApiKey}\n        />\n      )}\n    </div>\n  );\n};\n\nexport default CodeSnippet;\n"],"names":["React","useState","useEffect","Children","isValidElement","useRef","useCallback","useMemo","Code","cn","Icon","getLanguageInfo","stripSdkType","LanguageSelector","ApiKeySelector","useCopyToClipboard","PlainCodeView","CopyButton","TooltipButton","substituteApiKey","content","apiKey","replace","split","CodeSnippet","fixed","headerRow","title","children","className","lang","onChange","apiKeys","sdk","showCodeLines","languageOrdering","codeRef","isCopied","copy","extractLanguageFromCode","codeElement","props","classNames","langClass","find","cls","startsWith","substring","codeData","languages","sdkTypes","isSinglePlainCommand","childrenArray","toArray","Set","length","some","includes","forEach","child","preElement","codeLanguage","add","push","codeContent","language","activeSDKType","setActiveSDKType","size","has","showSDKSelector","filteredLanguages","filtered","filter","sort","a","b","aBase","bBase","aIndex","indexOf","bIndex","activeLanguage","l","selectedApiKey","setSelectedApiKey","keys","key","requiresApiKeySubstitution","containsPlaceholder","code","isHovering","setIsHovering","hasOnlyJsonSnippet","processedChildren","targetLanguage","map","cleanLang","langInfo","processedContent","String","syntaxHighlighterKey","snippet","additionalCSS","showLines","hasSnippetForActiveLanguage","handleSDKTypeChange","type","nextLang","handleLanguageChange","NoSnippetMessage","activeLanguageInfo","div","name","color","p","label","showLanguageSelector","showFullSelector","renderContent","plainChild","icon","tooltip","active","onClick","variant","alwaysShowLabel","onLanguageChange","span","ref","onMouseEnter","onMouseLeave","onFocus","onBlur","tabIndex","onCopy","text","onApiKeyChange"],"mappings":"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"}

package/core/Icon/utils.js

@@ -1,2 +1,2 @@
-import*as OutlineIcons from"@heroicons/react/24/outline";import*as SolidIcons from"@heroicons/react/24/solid";import*as MiniIcons from"@heroicons/react/20/solid";import*as MicroIcons from"@heroicons/react/16/solid";export const defaultIconSecondaryColor=name=>{const colorLookup={"icon-gui-check-circled-fill":"text-white"};return colorLookup[name]};export const toPascalCase=str=>{return str.split("-").map(word=>word.charAt(0).toUpperCase()+word.slice(1)).join("")};export const getHeroicon=(iconName,variant)=>{const componentName=`${toPascalCase(iconName)}Icon`;try{let iconModule;switch(variant){case"outline":iconModule=OutlineIcons;break;case"solid":iconModule=SolidIcons;break;case"mini":iconModule=MiniIcons;break;case"micro":iconModule=MicroIcons;break;default:return null}const component=iconModule[componentName];return component||null}catch(error){console.error("Error getting heroicon:",error,componentName);return null}};export const setUniqueIds=(el,uniqueId)=>{if(el){const defsElements=el.querySelectorAll("defs [id]");const elementsWithUrls=el.querySelectorAll('[fill*="url("], [stroke*="url("], [filter*="url("], [clip-path*="url("], [mask*="url("]');defsElements.forEach(def=>{const oldId=def.id;if(oldId.includes(uniqueId)){return}const newId=`${oldId}-${uniqueId}`;def.id=newId;const regex=new RegExp(`url\\(#${oldId}\\)`,"g");elementsWithUrls.forEach(element=>{["fill","stroke","filter","clip-path","mask"].forEach(attr=>{const value=element.getAttribute(attr);if(value&&value.includes(`url(#${oldId})`)){element.setAttribute(attr,value.replace(regex,`url(#${newId})`))}})})})}};
+import*as OutlineIcons from"@heroicons/react/24/outline";import*as SolidIcons from"@heroicons/react/24/solid";import*as MiniIcons from"@heroicons/react/20/solid";import*as MicroIcons from"@heroicons/react/16/solid";export const defaultIconSecondaryColor=name=>{const colorLookup={"icon-gui-check-circled-fill":"text-white"};return colorLookup[name]};export const toPascalCase=str=>{return str.split("-").map(word=>word.charAt(0).toUpperCase()+word.slice(1)).join("")};export const getHeroicon=(iconName,variant)=>{const componentName=`${toPascalCase(iconName)}Icon`;try{let iconModule;switch(variant){case"outline":iconModule=OutlineIcons;break;case"solid":iconModule=SolidIcons;break;case"mini":iconModule=MiniIcons;break;case"micro":iconModule=MicroIcons;break;default:return null}const component=iconModule[componentName];return component||null}catch(error){console.error("Error getting heroicon:",error,componentName);return null}};
 //# sourceMappingURL=utils.js.map

package/core/Icon/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/core/Icon/utils.ts"],"sourcesContent":["import { ColorClass } from \"../styles/colors/types\";\nimport { IconName } from \"./types\";\n\n// Import entire heroicon category modules\nimport * as OutlineIcons from \"@heroicons/react/24/outline\";\nimport * as SolidIcons from \"@heroicons/react/24/solid\";\nimport * as MiniIcons from \"@heroicons/react/20/solid\";\nimport * as MicroIcons from \"@heroicons/react/16/solid\";\n\ntype HeroiconComponent = React.ComponentType<React.SVGProps<SVGSVGElement>>;\n\nexport const defaultIconSecondaryColor = (name: IconName) => {\n  const colorLookup = {\n    \"icon-gui-check-circled-fill\": \"text-white\",\n  } as Record<string, ColorClass>;\n\n  return colorLookup[name];\n};\n\n// Helper function to convert kebab-case to PascalCase for heroicons\nexport const toPascalCase = (str: string): string => {\n  return str\n    .split(\"-\")\n    .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n    .join(\"\");\n};\n\n// Helper function to get a heroicon component by name and variant\nexport const getHeroicon = (\n  iconName: string,\n  variant: string,\n): HeroiconComponent | null => {\n  const componentName = `${toPascalCase(iconName)}Icon`;\n\n  try {\n    let iconModule: Record<string, HeroiconComponent>;\n\n    switch (variant) {\n      case \"outline\":\n        iconModule = OutlineIcons as Record<string, HeroiconComponent>;\n        break;\n      case \"solid\":\n        iconModule = SolidIcons as Record<string, HeroiconComponent>;\n        break;\n      case \"mini\":\n        iconModule = MiniIcons as Record<string, HeroiconComponent>;\n        break;\n      case \"micro\":\n        iconModule = MicroIcons as Record<string, HeroiconComponent>;\n        break;\n      default:\n        return null;\n    }\n\n    // Access the component from the module\n    const component = iconModule[componentName];\n    return component || null;\n  } catch (error) {\n    console.error(\"Error getting heroicon:\", error, componentName);\n    return null;\n  }\n};\n\nexport const setUniqueIds = (el: SVGSVGElement | null, uniqueId: string) => {\n  if (el) {\n    // Find all elements with IDs in defs and their URL references\n    const defsElements = el.querySelectorAll(\"defs [id]\");\n    const elementsWithUrls = el.querySelectorAll(\n      '[fill*=\"url(\"], [stroke*=\"url(\"], [filter*=\"url(\"], [clip-path*=\"url(\"], [mask*=\"url(\"]',\n    );\n\n    defsElements.forEach((def) => {\n      const oldId = def.id;\n\n      // Prevent re-aliasing of processed ids\n      if (oldId.includes(uniqueId)) {\n        return;\n      }\n\n      const newId = `${oldId}-${uniqueId}`;\n\n      def.id = newId;\n\n      // Update all URL references to this ID\n      const regex = new RegExp(`url\\\\(#${oldId}\\\\)`, \"g\");\n      elementsWithUrls.forEach((element) => {\n        [\"fill\", \"stroke\", \"filter\", \"clip-path\", \"mask\"].forEach((attr) => {\n          const value = element.getAttribute(attr);\n          if (value && value.includes(`url(#${oldId})`)) {\n            element.setAttribute(attr, value.replace(regex, `url(#${newId})`));\n          }\n        });\n      });\n    });\n  }\n};\n"],"names":["OutlineIcons","SolidIcons","MiniIcons","MicroIcons","defaultIconSecondaryColor","name","colorLookup","toPascalCase","str","split","map","word","charAt","toUpperCase","slice","join","getHeroicon","iconName","variant","componentName","iconModule","component","error","console","setUniqueIds","el","uniqueId","defsElements","querySelectorAll","elementsWithUrls","forEach","def","oldId","id","includes","newId","regex","RegExp","element","attr","value","getAttribute","setAttribute","replace"],"mappings":"AAIA,UAAYA,iBAAkB,6BAA8B,AAC5D,WAAYC,eAAgB,2BAA4B,AACxD,WAAYC,cAAe,2BAA4B,AACvD,WAAYC,eAAgB,2BAA4B,AAIxD,QAAO,MAAMC,0BAA4B,AAACC,OACxC,MAAMC,YAAc,CAClB,8BAA+B,YACjC,EAEA,OAAOA,WAAW,CAACD,KAAK,AAC1B,CAAE,AAGF,QAAO,MAAME,aAAe,AAACC,MAC3B,OAAOA,IACJC,KAAK,CAAC,KACNC,GAAG,CAAC,AAACC,MAASA,KAAKC,MAAM,CAAC,GAAGC,WAAW,GAAKF,KAAKG,KAAK,CAAC,IACxDC,IAAI,CAAC,GACV,CAAE,AAGF,QAAO,MAAMC,YAAc,CACzBC,SACAC,WAEA,MAAMC,cAAgB,CAAC,EAAEZ,aAAaU,UAAU,IAAI,CAAC,CAErD,GAAI,CACF,IAAIG,WAEJ,OAAQF,SACN,IAAK,UACHE,WAAapB,aACb,KACF,KAAK,QACHoB,WAAanB,WACb,KACF,KAAK,OACHmB,WAAalB,UACb,KACF,KAAK,QACHkB,WAAajB,WACb,KACF,SACE,OAAO,IACX,CAGA,MAAMkB,UAAYD,UAAU,CAACD,cAAc,CAC3C,OAAOE,WAAa,IACtB,CAAE,MAAOC,MAAO,CACdC,QAAQD,KAAK,CAAC,0BAA2BA,MAAOH,eAChD,OAAO,IACT,CACF,CAAE,AAEF,QAAO,MAAMK,aAAe,CAACC,GAA0BC,YACrD,GAAID,GAAI,CAEN,MAAME,aAAeF,GAAGG,gBAAgB,CAAC,aACzC,MAAMC,iBAAmBJ,GAAGG,gBAAgB,CAC1C,2FAGFD,aAAaG,OAAO,CAAC,AAACC,MACpB,MAAMC,MAAQD,IAAIE,EAAE,CAGpB,GAAID,MAAME,QAAQ,CAACR,UAAW,CAC5B,MACF,CAEA,MAAMS,MAAQ,CAAC,EAAEH,MAAM,CAAC,EAAEN,SAAS,CAAC,AAEpCK,CAAAA,IAAIE,EAAE,CAAGE,MAGT,MAAMC,MAAQ,IAAIC,OAAO,CAAC,OAAO,EAAEL,MAAM,GAAG,CAAC,CAAE,KAC/CH,iBAAiBC,OAAO,CAAC,AAACQ,UACxB,CAAC,OAAQ,SAAU,SAAU,YAAa,OAAO,CAACR,OAAO,CAAC,AAACS,OACzD,MAAMC,MAAQF,QAAQG,YAAY,CAACF,MACnC,GAAIC,OAASA,MAAMN,QAAQ,CAAC,CAAC,KAAK,EAAEF,MAAM,CAAC,CAAC,EAAG,CAC7CM,QAAQI,YAAY,CAACH,KAAMC,MAAMG,OAAO,CAACP,MAAO,CAAC,KAAK,EAAED,MAAM,CAAC,CAAC,EAClE,CACF,EACF,EACF,EACF,CACF,CAAE"}
+{"version":3,"sources":["../../../src/core/Icon/utils.ts"],"sourcesContent":["import { ColorClass } from \"../styles/colors/types\";\nimport { IconName } from \"./types\";\n\n// Import entire heroicon category modules\nimport * as OutlineIcons from \"@heroicons/react/24/outline\";\nimport * as SolidIcons from \"@heroicons/react/24/solid\";\nimport * as MiniIcons from \"@heroicons/react/20/solid\";\nimport * as MicroIcons from \"@heroicons/react/16/solid\";\n\ntype HeroiconComponent = React.ComponentType<React.SVGProps<SVGSVGElement>>;\n\nexport const defaultIconSecondaryColor = (name: IconName) => {\n  const colorLookup = {\n    \"icon-gui-check-circled-fill\": \"text-white\",\n  } as Record<string, ColorClass>;\n\n  return colorLookup[name];\n};\n\n// Helper function to convert kebab-case to PascalCase for heroicons\nexport const toPascalCase = (str: string): string => {\n  return str\n    .split(\"-\")\n    .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n    .join(\"\");\n};\n\n// Helper function to get a heroicon component by name and variant\nexport const getHeroicon = (\n  iconName: string,\n  variant: string,\n): HeroiconComponent | null => {\n  const componentName = `${toPascalCase(iconName)}Icon`;\n\n  try {\n    let iconModule: Record<string, HeroiconComponent>;\n\n    switch (variant) {\n      case \"outline\":\n        iconModule = OutlineIcons as Record<string, HeroiconComponent>;\n        break;\n      case \"solid\":\n        iconModule = SolidIcons as Record<string, HeroiconComponent>;\n        break;\n      case \"mini\":\n        iconModule = MiniIcons as Record<string, HeroiconComponent>;\n        break;\n      case \"micro\":\n        iconModule = MicroIcons as Record<string, HeroiconComponent>;\n        break;\n      default:\n        return null;\n    }\n\n    // Access the component from the module\n    const component = iconModule[componentName];\n    return component || null;\n  } catch (error) {\n    console.error(\"Error getting heroicon:\", error, componentName);\n    return null;\n  }\n};\n"],"names":["OutlineIcons","SolidIcons","MiniIcons","MicroIcons","defaultIconSecondaryColor","name","colorLookup","toPascalCase","str","split","map","word","charAt","toUpperCase","slice","join","getHeroicon","iconName","variant","componentName","iconModule","component","error","console"],"mappings":"AAIA,UAAYA,iBAAkB,6BAA8B,AAC5D,WAAYC,eAAgB,2BAA4B,AACxD,WAAYC,cAAe,2BAA4B,AACvD,WAAYC,eAAgB,2BAA4B,AAIxD,QAAO,MAAMC,0BAA4B,AAACC,OACxC,MAAMC,YAAc,CAClB,8BAA+B,YACjC,EAEA,OAAOA,WAAW,CAACD,KAAK,AAC1B,CAAE,AAGF,QAAO,MAAME,aAAe,AAACC,MAC3B,OAAOA,IACJC,KAAK,CAAC,KACNC,GAAG,CAAC,AAACC,MAASA,KAAKC,MAAM,CAAC,GAAGC,WAAW,GAAKF,KAAKG,KAAK,CAAC,IACxDC,IAAI,CAAC,GACV,CAAE,AAGF,QAAO,MAAMC,YAAc,CACzBC,SACAC,WAEA,MAAMC,cAAgB,CAAC,EAAEZ,aAAaU,UAAU,IAAI,CAAC,CAErD,GAAI,CACF,IAAIG,WAEJ,OAAQF,SACN,IAAK,UACHE,WAAapB,aACb,KACF,KAAK,QACHoB,WAAanB,WACb,KACF,KAAK,OACHmB,WAAalB,UACb,KACF,KAAK,QACHkB,WAAajB,WACb,KACF,SACE,OAAO,IACX,CAGA,MAAMkB,UAAYD,UAAU,CAACD,cAAc,CAC3C,OAAOE,WAAa,IACtB,CAAE,MAAOC,MAAO,CACdC,QAAQD,KAAK,CAAC,0BAA2BA,MAAOH,eAChD,OAAO,IACT,CACF,CAAE"}