@ably/ui 17.13.1-dev.c839343a → 17.13.2-dev.44eaafa0f2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/AGENTS.md CHANGED
@@ -2,6 +2,8 @@
2
2
 
3
3
  This file is not necessarily for people, the intended audience is automated agents.
4
4
 
5
+ > This file contains @ably/ui package-specific guidance. For universal code style and git workflow, see the [root AGENTS.md](../../AGENTS.md).
6
+
5
7
  ## Other references
6
8
 
7
9
  Consider the content of `README.md` as well, it contains technical information
@@ -25,14 +27,12 @@ This project is intended to primarily be consumed by the Ably website, voltaire
25
27
 
26
28
  ## Code Style
27
29
 
28
- - **Language**: TypeScript with strict mode enabled
29
30
  - **React**: Use functional components with hooks; React 18.x
30
31
  - **Imports**: Default export for main component, named exports for types/utils
31
32
  - **Naming**: PascalCase for components/types, camelCase for functions/variables,
32
33
  kebab-case for files
33
34
  - **Types**: Define prop types as `ComponentNameProps`, use `PropsWithChildren<T>`
34
35
  when needed
35
- - **Styling**: Tailwind 3.4.
36
36
  - **Utility**: Use `cn()` from `./src/core/utils/cn` for className merging (clsx
37
37
  & tailwind-merge)
38
38
  - **Formatting**: Prettier defaults (no config = defaults), 2-space indent
@@ -67,12 +67,6 @@ export function useContentHeight(
67
67
  }
68
68
  ```
69
69
 
70
- Keep emojis in the code to a minimum, only introduce them if there is precedent
71
- in the file you're working on.
72
-
73
- Comments and commit messages should not include statements like "local tests pass",
74
- this is a given for how we work.
75
-
76
70
  ## Development
77
71
 
78
72
  - Run `pnpm lint` & `pnpm format:write` on files after making changes, we lint
@@ -527,8 +521,9 @@ This allows testing tiebreaker logic and initial state detection. Storybook stor
527
521
 
528
522
  ## Git workflow
529
523
 
530
- - Always do work on a new branch, start the branch on the HEAD of `origin/main`
531
- - Before pushing the branch run the tests and linters to ensure they are happy
532
- - When updating a branch, rebase on `origin/main` and force-push (with lease)
533
- - Use our PR template in the `.github` folder as a reference for the pull request
534
- - Keep commit messages concise
524
+ See the [root AGENTS.md](../../AGENTS.md) for universal git workflow guidance.
525
+
526
+ **UI package-specific notes:**
527
+
528
+ - Run `pnpm lint` and `pnpm test` before pushing
529
+ - For performance-related changes, compare before/after metrics and include in commit/PR
package/README.md CHANGED
@@ -269,22 +269,25 @@ After the above, you should have:
269
269
  To deploy a review app with your in-progress code, you can use the `pre-release` script:
270
270
 
271
271
  ```bash
272
- # in root
273
- scripts/pre-release.sh
272
+ # in packages/ui directory
273
+ ./scripts/pre-release.sh
274
274
  ```
275
275
 
276
- This script is a combination of two scripts:
276
+ This script automates the following steps:
277
277
 
278
278
  1. Pre-Release:
279
279
 
280
- - update your local dependencies for ably-ui and run a production build
281
- - release an NPM package with the version built from your current SemVer but adding a pre-release tag based on a short SHA of your HEAD commit
280
+ - Updates local dependencies for ably-ui and runs a production build
281
+ - Releases an NPM package with the version built from your current SemVer but adding a pre-release tag based on a short SHA of your HEAD commit
282
+ - Waits for the package to be available on the NPM registry (handles propagation delay)
283
+ - Automatically updates both `apps/website` and `apps/voltaire` with the new dev version
282
284
 
283
285
  2. Update Pre-Release Version:
284
286
 
285
- - commit all the above and push to origin
287
+ - Commits all changes (UI package.json, app package.json files, and lockfiles) in a single atomic commit
288
+ - Pushes the commit and tag to origin
286
289
 
287
- This will trigger a build of the review app.
290
+ This will trigger a build of the review app with the pre-release version installed in both consuming apps.
288
291
 
289
292
  ### Components
290
293
 
@@ -339,13 +342,13 @@ We use [Semantic Versioning 2.0.0](https://semver.org/) to version different lib
339
342
 
340
343
  Packages are published to the [GitHub private registry](https://github.com/features/packages).
341
344
 
342
- Publishing is done by tagging a release in GitHub. This triggers a GitHub action that pushes to the private NPM registry as well as publishing new artefacts in the CDN, with the version taken from the tag of the GitHub release.
345
+ Publishing is done by tagging a release in GitHub. This triggers a GitHub action that pushes to the NPM registry as well as deploying Storybook to the [ably/ably-ui](https://github.com/ably/ably-ui) repository, with the version taken from the tag of the GitHub release.
343
346
 
344
- This will trigger GitHub actions in supported apps (currently [Voltaire](http://github.com/ably/voltaire) & [Website](http://github.com/ably/website)) to create a PR with an ably-ui version update.
347
+ After publishing, you can manually trigger the `update-ably-ui` workflow to create a single draft PR that updates both [Voltaire](http://github.com/ably/voltaire) and [Website](http://github.com/ably/website) with the new ably-ui version.
345
348
 
346
349
  **To trigger a release:**
347
350
 
348
- - Make sure you have run pre-release script `./pre-release.sh` (This updates the npm package version for ably-ui in `package.json`).
351
+ - Make sure you have run the pre-release script `./scripts/pre-release.sh` (This updates the npm package version for ably-ui in `package.json` and updates both consuming apps).
349
352
  - Merge your PR into `main` after it has been approved.
350
353
  - On the Github [Ably-UI](http://github.com/ably/ably-ui) repo, [create a new release](https://github.com/ably/ably-ui/releases/new) tag.
351
354
  - Create a new tag with the new version number for the release.
@@ -354,9 +357,26 @@ This will trigger GitHub actions in supported apps (currently [Voltaire](http://
354
357
  - Click on the Autogenerate release notes button.
355
358
  - Publish Release.
356
359
  - Check the Github `Actions` tab in the repo to make sure the release is green.
357
- - Upon successful release, a compiled version of the Storybook site will be deployed to Github Pages.
360
+ - Upon successful release, a compiled version of the Storybook site will be deployed to the [ably/ably-ui](https://github.com/ably/ably-ui) repository's gh-pages branch.
361
+ - Manually trigger the `update-ably-ui` workflow from the Actions tab to create a draft PR updating both apps.
358
362
 
359
- This will release the packages and update library and create & push the commit & tag, and also create corresponding PRs in Voltaire & Website. It will also deploy a new Storybook site to [https://ably.github.io/ably-ui/](https://ably.github.io/ably-ui/).
363
+ This will publish the package to NPM and deploy a new Storybook site to [https://ably.github.io/ably-ui/](https://ably.github.io/ably-ui/). To update the consuming apps, manually trigger the workflow, which will create a single draft PR for both Voltaire and Website that requires review before merging.
364
+
365
+ ### Tagging Convention (Monorepo)
366
+
367
+ In the monorepo, ably-ui uses **component-prefixed tags** to enable independent releases:
368
+
369
+ **Release tags:** `ui-<version>` (e.g., `ui-17.13.2`)
370
+ - Used for production NPM releases
371
+ - Created via GitHub Releases
372
+ - Do NOT include `v` prefix
373
+
374
+ **Pre-release tags:** `ui-v<version>-dev.<sha>` (e.g., `ui-v17.13.2-dev.a1b2c3d`)
375
+ - Created automatically by `./scripts/pre-release.sh`
376
+ - Published to NPM with `dev` tag
377
+ - Includes `v` prefix and commit SHA
378
+
379
+ See the [root docs/TAGGING.md](../../docs/TAGGING.md) for complete details on the monorepo tagging convention.
360
380
 
361
381
  ### Review Apps
362
382
 
@@ -1,2 +1,2 @@
1
- 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"},laravel:{label:"Laravel",icon:"icon-tech-laravel-broadcast",syntaxHighlighterKey:"php"},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"},jetpack:{label:"Jetpack Compose",icon:"icon-tech-jetpack",syntaxHighlighterKey:"kotlin"}};export const stripSdkType=lang=>{const prefixes=["realtime_","rest_","fe_","be_"];for(const prefix of prefixes){if(lang.startsWith(prefix)){return lang.slice(prefix.length)}}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;
1
+ 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"},laravel:{label:"Laravel",icon:"icon-tech-laravel-broadcast",syntaxHighlighterKey:"php"},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"},jetpack:{label:"Jetpack Compose",icon:"icon-tech-jetpack",syntaxHighlighterKey:"kotlin"}};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;
2
2
  //# sourceMappingURL=languages.js.map
@@ -1 +1 @@
1
- {"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 laravel: {\n label: \"Laravel\",\n icon: \"icon-tech-laravel-broadcast\",\n syntaxHighlighterKey: \"php\",\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 jetpack: {\n label: \"Jetpack Compose\",\n icon: \"icon-tech-jetpack\",\n syntaxHighlighterKey: \"kotlin\",\n },\n};\n\nexport const stripSdkType = (lang: string) => {\n const prefixes = [\"realtime_\", \"rest_\", \"fe_\", \"be_\"];\n for (const prefix of prefixes) {\n if (lang.startsWith(prefix)) {\n return lang.slice(prefix.length);\n }\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","laravel","xml","sql","swift","cpp","dart","objc","android","flutter","jetpack","stripSdkType","lang","prefixes","prefix","startsWith","slice","length","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,QAAS,CACPhB,MAAO,UACPC,KAAM,8BACNC,qBAAsB,KACxB,EACAe,IAAK,CACHjB,MAAO,MACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAgB,IAAK,CACHlB,MAAO,MACPC,KAAM,qBACNC,qBAAsB,KACxB,EACAiB,MAAO,CACLnB,MAAO,QACPC,KAAM,kBACNC,qBAAsB,OACxB,EAEAkB,IAAK,CACHpB,MAAO,MACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAmB,KAAM,CACJrB,MAAO,OACPC,KAAM,gBACNC,qBAAsB,MACxB,EACAoB,KAAM,CACJtB,MAAO,cACPC,KAAM,uBACNC,qBAAsB,MACxB,EACAqB,QAAS,CACPvB,MAAO,UACPC,KAAM,yBACNC,qBAAsB,MACxB,EACAsB,QAAS,CACPxB,MAAO,UACPC,KAAM,oBACNC,qBAAsB,MACxB,EACAuB,QAAS,CACPzB,MAAO,kBACPC,KAAM,oBACNC,qBAAsB,QACxB,CACF,CAEA,QAAO,MAAMwB,aAAe,AAACC,OAC3B,MAAMC,SAAW,CAAC,YAAa,QAAS,MAAO,MAAM,CACrD,IAAK,MAAMC,UAAUD,SAAU,CAC7B,GAAID,KAAKG,UAAU,CAACD,QAAS,CAC3B,OAAOF,KAAKI,KAAK,CAACF,OAAOG,MAAM,CACjC,CACF,CACA,OAAOL,IACT,CAAE,AAGF,QAAO,MAAMM,gBAAkB,AAACC,UAC9B,MAAMC,IAAMT,aAAaQ,SAASE,WAAW,GAE7C,GAAItC,SAAS,CAACqC,IAAI,CAAE,CAClB,OAAOrC,SAAS,CAACqC,IAAI,AACvB,CAGA,MAAO,CACLnC,MAAOkC,QACPjC,KAAM,gBACNC,qBAAsBgC,OACxB,CACF,CAAE,AAEF,gBAAepC,SAAU"}
1
+ {"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 laravel: {\n label: \"Laravel\",\n icon: \"icon-tech-laravel-broadcast\",\n syntaxHighlighterKey: \"php\",\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 jetpack: {\n label: \"Jetpack Compose\",\n icon: \"icon-tech-jetpack\",\n syntaxHighlighterKey: \"kotlin\",\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","laravel","xml","sql","swift","cpp","dart","objc","android","flutter","jetpack","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,QAAS,CACPhB,MAAO,UACPC,KAAM,8BACNC,qBAAsB,KACxB,EACAe,IAAK,CACHjB,MAAO,MACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAgB,IAAK,CACHlB,MAAO,MACPC,KAAM,qBACNC,qBAAsB,KACxB,EACAiB,MAAO,CACLnB,MAAO,QACPC,KAAM,kBACNC,qBAAsB,OACxB,EAEAkB,IAAK,CACHpB,MAAO,MACPC,KAAM,gBACNC,qBAAsB,KACxB,EACAmB,KAAM,CACJrB,MAAO,OACPC,KAAM,gBACNC,qBAAsB,MACxB,EACAoB,KAAM,CACJtB,MAAO,cACPC,KAAM,uBACNC,qBAAsB,MACxB,EACAqB,QAAS,CACPvB,MAAO,UACPC,KAAM,yBACNC,qBAAsB,MACxB,EACAsB,QAAS,CACPxB,MAAO,UACPC,KAAM,oBACNC,qBAAsB,MACxB,EACAuB,QAAS,CACPzB,MAAO,kBACPC,KAAM,oBACNC,qBAAsB,QACxB,CACF,CAEA,QAAO,MAAMwB,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,GAAIrC,SAAS,CAACoC,IAAI,CAAE,CAClB,OAAOpC,SAAS,CAACoC,IAAI,AACvB,CAGA,MAAO,CACLlC,MAAOiC,QACPhC,KAAM,gBACNC,qBAAsB+B,OACxB,CACF,CAAE,AAEF,gBAAenC,SAAU"}
@@ -1,2 +1,2 @@
1
- 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 PlainCodeView from"./CodeSnippet/PlainCodeView";import CopyButton from"./CodeSnippet/CopyButton";import SegmentedControl from"./SegmentedControl";const substituteApiKey=(content,apiKey,mask=true)=>{return content.replace(/\{\{API_KEY\}\}/g,mask?`${apiKey.split(":")[0]}:*****`:apiKey)};const CodeSnippet=({fixed=false,headerRow=false,title="Code",children,className,lang,onChange,apiKeys,sdk,showCodeLines=true,languageOrdering,wrapCode=false})=>{const codeRef=useRef(null);const[selectedApiKey,setSelectedApiKey]=useState(()=>apiKeys?.[0]?.keys?.[0]?.key??"");useEffect(()=>{if(!selectedApiKey&&apiKeys&&apiKeys.length>0){setSelectedApiKey(apiKeys[0].keys?.[0]?.key)}},[apiKeys]);useEffect(()=>{const element=codeRef.current;if(!element)return;const unmaskRenderedApiKey=(content,apiKey)=>{return content.replace(/(['"]?)([^:'"]+):\*{5}\1/g,`$1${apiKey}$1`)};const handleCopy=event=>{const selection=window.getSelection();if(!selection||selection.rangeCount===0)return;const selectedText=selection.toString();if(!selectedText)return;const range=selection.getRangeAt(0);if(!element.contains(range.commonAncestorContainer))return;const modifiedText=unmaskRenderedApiKey(selectedText,selectedApiKey);event.clipboardData?.setData("text/plain",modifiedText);event.preventDefault()};document.addEventListener("copy",handleCopy);return()=>{document.removeEventListener("copy",handleCopy)}},[selectedApiKey]);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 findCodeElement=useCallback(preChildren=>{if(isValidElement(preChildren)){return preChildren}if(Array.isArray(preChildren)){const codeEl=preChildren.find(c=>isValidElement(c));return codeEl&&isValidElement(codeEl)?codeEl:null}return null},[]);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=>{if(!isValidElement(childrenArray[0]))return false;const codeEl=findCodeElement(childrenArray[0].props.children);return codeEl?.props.className?.includes(lang)});childrenArray.forEach(child=>{if(!isValidElement(child))return;const preElement=child;const codeElement=findCodeElement(preElement.props.children);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")}else if(codeLanguage.startsWith("fe_")){sdkTypes.add("fe")}else if(codeLanguage.startsWith("be_")){sdkTypes.add("be")}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,findCodeElement]);const resolvedSdk=useMemo(()=>{if(sdkTypes.size===1&&sdk&&!sdkTypes.has(sdk)){return Array.from(sdkTypes)[0]}return sdk??null},[sdk,sdkTypes]);const showSDKSelector=sdkTypes.has("realtime")||sdkTypes.has("rest");const filteredLanguages=useMemo(()=>{const filtered=!resolvedSdk||!showSDKSelector?[...languages]:languages.filter(lang=>lang.startsWith(`${resolvedSdk}_`));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},[resolvedSdk,showSDKSelector,languages,languageOrdering]);const activeLanguage=useMemo(()=>{if(resolvedSdk==="fe"||resolvedSdk==="be"){const fullLang=`${resolvedSdk}_${lang}`;if(languages.includes(fullLang)){return fullLang}const prefixMatch=languages.find(l=>l.startsWith(`${resolvedSdk}_`));if(prefixMatch)return prefixMatch}if(resolvedSdk&&sdkTypes.has(resolvedSdk)){return`${resolvedSdk}_${lang}`}if(lang)return lang;if(filteredLanguages.length>0)return filteredLanguages[0];return languages[0]},[resolvedSdk,sdkTypes,lang,filteredLanguages,languages]);const requiresApiKeySubstitution=useMemo(()=>{const containsPlaceholder=codeData.some(code=>code?.content.includes("{{API_KEY}}"));return containsPlaceholder&&!!apiKeys&&apiKeys.length>0&&!!selectedApiKey},[codeData,apiKeys,selectedApiKey]);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-000 text-neutral-1300 dark:!bg-neutral-1300 dark:text-neutral-200 px-6 py-4",showLines:showCodeLines,wrap:wrapCode})}return null})},[activeLanguage,hasOnlyJsonSnippet,codeData,requiresApiKeySubstitution,showCodeLines,wrapCode,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);if(onChange&&nextLang){onChange(stripSdkType(activeLanguage),type)}},[activeLanguage,languages,onChange]);const handleLanguageChange=useCallback(language=>{if(onChange){onChange(stripSdkType(language),resolvedSdk)}},[onChange,resolvedSdk]);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 showFixedLanguageLabel=fixed&&activeLanguage;const renderContent=useMemo(()=>{if(!activeLanguage)return null;if(hasSnippetForActiveLanguage){return processedChildren}return noSnippetMessage},[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-300 dark:border-neutral-1000",sdkTypes.size===1&&"p-1",headerRow?"":"rounded-t-lg")},React.createElement("div",{className:"flex gap-1 justify-start"},["realtime","rest"].map(type=>sdkTypes.has(type)&&React.createElement(SegmentedControl,{key:type,onClick:()=>handleSDKTypeChange(type),size:"xs",active:resolvedSdk===type,className:cn("text-[11px] font-semibold px-2 py-1 h-auto",sdkTypes.size===1&&"pointer-events-none bg-neutral-100 dark:bg-neutral-1200 !text-neutral-800 !dark:text-neutral-500",sdkTypes.size>1&&resolvedSdk!==type&&"bg-neutral-100 dark:bg-neutral-1200 hover:bg-neutral-200 dark:hover:bg-neutral-1100 active:bg-neutral-400 dark:active:bg-neutral-900",sdkTypes.size>1&&resolvedSdk===type&&"bg-neutral-000 dark:bg-neutral-1100")},type==="realtime"?"Realtime":"REST")))),showFixedLanguageLabel&&React.createElement("div",{className:cn("border-b border-neutral-300 dark:border-neutral-1000 h-[2.125rem] inline-flex items-center px-3 w-full",{"rounded-t-lg":!headerRow})},React.createElement("div",{className:"inline-flex items-center"},React.createElement(Icon,{name:getLanguageInfo(activeLanguage).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(activeLanguage).label))),showLanguageSelector&&(showFullSelector?React.createElement(LanguageSelector,{languages:filteredLanguages,activeLanguage:activeLanguage,onLanguageChange:handleLanguageChange}):React.createElement("div",{className:cn("border-b border-neutral-300 dark:border-neutral-1000 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)},renderContent,isHovering&&activeLanguage&&hasSnippetForActiveLanguage&&React.createElement(CopyButton,{onCopy:()=>{const text=codeData.find(code=>code.language===activeLanguage)?.content;if(text)navigator.clipboard.writeText(substituteApiKey(text,selectedApiKey,false))}})),requiresApiKeySubstitution&&React.createElement(ApiKeySelector,{apiKeys:apiKeys,selectedApiKey:selectedApiKey,onApiKeyChange:setSelectedApiKey}))};export default CodeSnippet;
1
+ 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 PlainCodeView from"./CodeSnippet/PlainCodeView";import CopyButton from"./CodeSnippet/CopyButton";import SegmentedControl from"./SegmentedControl";const substituteApiKey=(content,apiKey,mask=true)=>{return content.replace(/\{\{API_KEY\}\}/g,mask?`${apiKey.split(":")[0]}:*****`:apiKey)};const CodeSnippet=({fixed=false,headerRow=false,title="Code",children,className,lang,onChange,apiKeys,sdk,showCodeLines=true,languageOrdering,wrapCode=false})=>{const codeRef=useRef(null);const[selectedApiKey,setSelectedApiKey]=useState(()=>apiKeys?.[0]?.keys?.[0]?.key??"");useEffect(()=>{if(!selectedApiKey&&apiKeys&&apiKeys.length>0){setSelectedApiKey(apiKeys[0].keys?.[0]?.key)}},[apiKeys]);useEffect(()=>{const element=codeRef.current;if(!element)return;const unmaskRenderedApiKey=(content,apiKey)=>{return content.replace(/(['"]?)([^:'"]+):\*{5}\1/g,`$1${apiKey}$1`)};const handleCopy=event=>{const selection=window.getSelection();if(!selection||selection.rangeCount===0)return;const selectedText=selection.toString();if(!selectedText)return;const range=selection.getRangeAt(0);if(!element.contains(range.commonAncestorContainer))return;const modifiedText=unmaskRenderedApiKey(selectedText,selectedApiKey);event.clipboardData?.setData("text/plain",modifiedText);event.preventDefault()};document.addEventListener("copy",handleCopy);return()=>{document.removeEventListener("copy",handleCopy)}},[selectedApiKey]);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 resolvedSdk=useMemo(()=>{if(sdkTypes.size===1&&sdk&&!sdkTypes.has(sdk)){return Array.from(sdkTypes)[0]}return sdk??null},[sdk,sdkTypes]);const showSDKSelector=sdkTypes.size>0;const filteredLanguages=useMemo(()=>{const filtered=!resolvedSdk||!showSDKSelector?[...languages]:languages.filter(lang=>lang.startsWith(`${resolvedSdk}_`));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},[resolvedSdk,showSDKSelector,languages,languageOrdering]);const activeLanguage=useMemo(()=>{if(resolvedSdk&&sdkTypes.has(resolvedSdk)){return`${resolvedSdk}_${lang}`}if(lang)return lang;if(filteredLanguages.length>0)return filteredLanguages[0];return languages[0]},[resolvedSdk,sdkTypes,lang,filteredLanguages,languages]);const requiresApiKeySubstitution=useMemo(()=>{const containsPlaceholder=codeData.some(code=>code?.content.includes("{{API_KEY}}"));return containsPlaceholder&&!!apiKeys&&apiKeys.length>0&&!!selectedApiKey},[codeData,apiKeys,selectedApiKey]);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-000 text-neutral-1300 dark:!bg-neutral-1300 dark:text-neutral-200 px-6 py-4",showLines:showCodeLines,wrap:wrapCode})}return null})},[activeLanguage,hasOnlyJsonSnippet,codeData,requiresApiKeySubstitution,showCodeLines,wrapCode,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);if(onChange&&nextLang){onChange(stripSdkType(activeLanguage),type)}},[activeLanguage,languages,onChange]);const handleLanguageChange=useCallback(language=>{if(onChange){onChange(stripSdkType(language),resolvedSdk)}},[onChange,resolvedSdk]);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 noSnippetMessage},[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-300 dark:border-neutral-1000",sdkTypes.size===1&&"p-1",headerRow?"":"rounded-t-lg")},React.createElement("div",{className:"flex gap-1 justify-start"},["realtime","rest"].map(type=>sdkTypes.has(type)&&React.createElement(SegmentedControl,{key:type,onClick:()=>handleSDKTypeChange(type),size:"xs",active:resolvedSdk===type,className:cn("text-[11px] font-semibold px-2 py-1 h-auto",sdkTypes.size===1&&"pointer-events-none bg-neutral-100 dark:bg-neutral-1200 !text-neutral-800 !dark:text-neutral-500",sdkTypes.size>1&&resolvedSdk!==type&&"bg-neutral-100 dark:bg-neutral-1200 hover:bg-neutral-200 dark:hover:bg-neutral-1100 active:bg-neutral-400 dark:active:bg-neutral-900",sdkTypes.size>1&&resolvedSdk===type&&"bg-neutral-000 dark:bg-neutral-1100")},type==="realtime"?"Realtime":"REST")))),showLanguageSelector&&(showFullSelector?React.createElement(LanguageSelector,{languages:filteredLanguages,activeLanguage:activeLanguage,onLanguageChange:handleLanguageChange}):React.createElement("div",{className:cn("border-b border-neutral-300 dark:border-neutral-1000 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)},renderContent,isHovering&&activeLanguage&&hasSnippetForActiveLanguage&&React.createElement(CopyButton,{onCopy:()=>{const text=codeData.find(code=>code.language===activeLanguage)?.content;if(text)navigator.clipboard.writeText(substituteApiKey(text,selectedApiKey,false))}})),requiresApiKeySubstitution&&React.createElement(ApiKeySelector,{apiKeys:apiKeys,selectedApiKey:selectedApiKey,onApiKeyChange:setSelectedApiKey}))};export default CodeSnippet;
2
2
  //# sourceMappingURL=CodeSnippet.js.map
@@ -1 +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 Icon from \"./Icon\";\nimport { getLanguageInfo, stripSdkType } from \"./CodeSnippet/languages\";\nimport LanguageSelector from \"./CodeSnippet/LanguageSelector\";\nimport ApiKeySelector from \"./CodeSnippet/ApiKeySelector\";\nimport PlainCodeView from \"./CodeSnippet/PlainCodeView\";\nimport CopyButton from \"./CodeSnippet/CopyButton\";\nimport SegmentedControl from \"./SegmentedControl\";\n\n// Define SDK type\nexport type SDKType = \"realtime\" | \"rest\" | \"fe\" | \"be\" | 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 | null;\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 * Whether to wrap code content instead of scrolling\n */\n wrapCode?: boolean;\n};\n\n// Substitution function for API key placeholders\nconst substituteApiKey = (\n content: string,\n apiKey: string,\n mask = true,\n): string => {\n return content.replace(\n /\\{\\{API_KEY\\}\\}/g,\n mask ? `${apiKey.split(\":\")[0]}:*****` : apiKey,\n );\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 wrapCode = false,\n}) => {\n const codeRef = useRef<HTMLDivElement>(null);\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 // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [apiKeys]);\n\n useEffect(() => {\n const element = codeRef.current;\n if (!element) return;\n\n // Detects the key masking via substituteApiKey (i.e. \"abcde:*****\") and replaces it with the actual API key\n const unmaskRenderedApiKey = (content: string, apiKey: string): string => {\n return content.replace(/(['\"]?)([^:'\"]+):\\*{5}\\1/g, `$1${apiKey}$1`);\n };\n\n const handleCopy = (event: ClipboardEvent) => {\n const selection = window.getSelection();\n if (!selection || selection.rangeCount === 0) return;\n\n const selectedText = selection.toString();\n if (!selectedText) return;\n\n // Check if the selection is within our element\n const range = selection.getRangeAt(0);\n if (!element.contains(range.commonAncestorContainer)) return;\n\n const modifiedText = unmaskRenderedApiKey(selectedText, selectedApiKey);\n\n event.clipboardData?.setData(\"text/plain\", modifiedText);\n event.preventDefault();\n };\n\n document.addEventListener(\"copy\", handleCopy);\n\n return () => {\n document.removeEventListener(\"copy\", handleCopy);\n };\n }, [selectedApiKey]);\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 // Helper to find the code element within pre's children (handles both single element and array)\n const findCodeElement = useCallback(\n (preChildren: React.ReactNode): React.ReactElement | null => {\n if (isValidElement(preChildren)) {\n return preChildren;\n }\n if (Array.isArray(preChildren)) {\n const codeEl = preChildren.find((c) => isValidElement(c));\n return codeEl && isValidElement(codeEl) ? codeEl : null;\n }\n return null;\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((lang) => {\n if (!isValidElement(childrenArray[0])) return false;\n const codeEl = findCodeElement(childrenArray[0].props.children);\n return codeEl?.props.className?.includes(lang);\n });\n\n childrenArray.forEach((child) => {\n if (!isValidElement(child)) return;\n\n const preElement = child;\n const codeElement = findCodeElement(preElement.props.children);\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 } else if (codeLanguage.startsWith(\"fe_\")) {\n sdkTypes.add(\"fe\");\n } else if (codeLanguage.startsWith(\"be_\")) {\n sdkTypes.add(\"be\");\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, findCodeElement]);\n\n const resolvedSdk: SDKType = useMemo(() => {\n if (sdkTypes.size === 1 && sdk && !sdkTypes.has(sdk)) {\n return Array.from(sdkTypes)[0];\n }\n return sdk ?? null;\n }, [sdk, sdkTypes]);\n\n // Only show SDK selector for realtime/rest types, not for fe/be (which are controlled by page-level selector)\n const showSDKSelector = sdkTypes.has(\"realtime\") || sdkTypes.has(\"rest\");\n\n const filteredLanguages = useMemo(() => {\n const filtered =\n !resolvedSdk || !showSDKSelector\n ? [...languages]\n : languages.filter((lang) => lang.startsWith(`${resolvedSdk}_`));\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 }, [resolvedSdk, showSDKSelector, languages, languageOrdering]);\n\n const activeLanguage = useMemo(() => {\n // For fe/be SDK types (controlled by page-level selector), construct the full language\n if (resolvedSdk === \"fe\" || resolvedSdk === \"be\") {\n const fullLang = `${resolvedSdk}_${lang}`;\n // Verify this language exists in available languages\n if (languages.includes(fullLang)) {\n return fullLang;\n }\n // Fall back to first language with this prefix\n const prefixMatch = languages.find((l) =>\n l.startsWith(`${resolvedSdk}_`),\n );\n if (prefixMatch) return prefixMatch;\n }\n\n // For realtime/rest SDK types\n if (resolvedSdk && sdkTypes.has(resolvedSdk)) {\n return `${resolvedSdk}_${lang}`;\n }\n\n if (lang) return lang;\n\n if (filteredLanguages.length > 0) return filteredLanguages[0];\n\n return languages[0];\n }, [resolvedSdk, sdkTypes, lang, filteredLanguages, languages]);\n\n const requiresApiKeySubstitution = useMemo(() => {\n const containsPlaceholder = codeData.some((code) =>\n code?.content.includes(\"{{API_KEY}}\"),\n );\n\n return (\n containsPlaceholder && !!apiKeys && apiKeys.length > 0 && !!selectedApiKey\n );\n }, [codeData, apiKeys, selectedApiKey]);\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-000 text-neutral-1300 dark:!bg-neutral-1300 dark:text-neutral-200 px-6 py-4\"\n showLines={showCodeLines}\n wrap={wrapCode}\n />\n );\n }\n\n return null;\n });\n }, [\n activeLanguage,\n hasOnlyJsonSnippet,\n codeData,\n requiresApiKeySubstitution,\n showCodeLines,\n wrapCode,\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\n if (onChange && nextLang) {\n onChange(stripSdkType(activeLanguage), type);\n }\n },\n [activeLanguage, languages, onChange],\n );\n\n const handleLanguageChange = useCallback(\n (language: string) => {\n if (onChange) {\n onChange(stripSdkType(language), resolvedSdk);\n }\n },\n [onChange, resolvedSdk],\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 // Show a read-only language label when fixed (controlled by external selector)\n const showFixedLanguageLabel = fixed && activeLanguage;\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 <div className=\"w-12\"></div>\n </div>\n )}\n\n {showSDKSelector && (\n <div\n className={cn(\n \"p-2 border-b border-neutral-300 dark:border-neutral-1000\",\n sdkTypes.size === 1 && \"p-1\",\n headerRow ? \"\" : \"rounded-t-lg\",\n )}\n >\n <div className=\"flex gap-1 justify-start\">\n {[\"realtime\", \"rest\"].map(\n (type) =>\n sdkTypes.has(type as SDKType) && (\n <SegmentedControl\n key={type}\n onClick={() => handleSDKTypeChange(type as SDKType)}\n size=\"xs\"\n active={resolvedSdk === type}\n className={cn(\n \"text-[11px] font-semibold px-2 py-1 h-auto\",\n sdkTypes.size === 1 &&\n \"pointer-events-none bg-neutral-100 dark:bg-neutral-1200 !text-neutral-800 !dark:text-neutral-500\",\n sdkTypes.size > 1 &&\n resolvedSdk !== type &&\n \"bg-neutral-100 dark:bg-neutral-1200 hover:bg-neutral-200 dark:hover:bg-neutral-1100 active:bg-neutral-400 dark:active:bg-neutral-900\",\n sdkTypes.size > 1 &&\n resolvedSdk === type &&\n \"bg-neutral-000 dark:bg-neutral-1100\",\n )}\n >\n {type === \"realtime\" ? \"Realtime\" : \"REST\"}\n </SegmentedControl>\n ),\n )}\n </div>\n </div>\n )}\n\n {showFixedLanguageLabel && (\n <div\n className={cn(\n \"border-b border-neutral-300 dark:border-neutral-1000 h-[2.125rem] inline-flex items-center px-3 w-full\",\n { \"rounded-t-lg\": !headerRow },\n )}\n >\n <div className=\"inline-flex items-center\">\n <Icon\n name={getLanguageInfo(activeLanguage).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(activeLanguage).label}\n </span>\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-300 dark:border-neutral-1000 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 >\n {renderContent}\n {isHovering && activeLanguage && hasSnippetForActiveLanguage && (\n <CopyButton\n onCopy={() => {\n const text = codeData.find(\n (code) => code.language === activeLanguage,\n )?.content;\n if (text)\n navigator.clipboard.writeText(\n substituteApiKey(text, selectedApiKey, false),\n );\n }}\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","PlainCodeView","CopyButton","SegmentedControl","substituteApiKey","content","apiKey","mask","replace","split","CodeSnippet","fixed","headerRow","title","children","className","lang","onChange","apiKeys","sdk","showCodeLines","languageOrdering","wrapCode","codeRef","selectedApiKey","setSelectedApiKey","keys","key","length","element","current","unmaskRenderedApiKey","handleCopy","event","selection","window","getSelection","rangeCount","selectedText","toString","range","getRangeAt","contains","commonAncestorContainer","modifiedText","clipboardData","setData","preventDefault","document","addEventListener","removeEventListener","extractLanguageFromCode","codeElement","props","classNames","langClass","find","cls","startsWith","substring","findCodeElement","preChildren","Array","isArray","codeEl","c","codeData","languages","sdkTypes","isSinglePlainCommand","childrenArray","toArray","Set","some","includes","forEach","child","preElement","codeLanguage","add","push","codeContent","language","resolvedSdk","size","has","from","showSDKSelector","filteredLanguages","filtered","filter","sort","a","b","aBase","bBase","aIndex","indexOf","bIndex","activeLanguage","fullLang","prefixMatch","l","requiresApiKeySubstitution","containsPlaceholder","code","isHovering","setIsHovering","hasOnlyJsonSnippet","processedChildren","targetLanguage","map","cleanLang","langInfo","processedContent","String","syntaxHighlighterKey","snippet","additionalCSS","showLines","wrap","hasSnippetForActiveLanguage","handleSDKTypeChange","type","nextLang","handleLanguageChange","noSnippetMessage","activeLanguageInfo","div","name","color","p","label","showLanguageSelector","showFullSelector","showFixedLanguageLabel","renderContent","plainChild","icon","onClick","active","span","onLanguageChange","ref","onMouseEnter","onMouseLeave","onFocus","onBlur","onCopy","text","navigator","clipboard","writeText","onApiKeyChange"],"mappings":"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"}
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 Icon from \"./Icon\";\nimport { getLanguageInfo, stripSdkType } from \"./CodeSnippet/languages\";\nimport LanguageSelector from \"./CodeSnippet/LanguageSelector\";\nimport ApiKeySelector from \"./CodeSnippet/ApiKeySelector\";\nimport PlainCodeView from \"./CodeSnippet/PlainCodeView\";\nimport CopyButton from \"./CodeSnippet/CopyButton\";\nimport SegmentedControl from \"./SegmentedControl\";\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 | null;\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 * Whether to wrap code content instead of scrolling\n */\n wrapCode?: boolean;\n};\n\n// Substitution function for API key placeholders\nconst substituteApiKey = (\n content: string,\n apiKey: string,\n mask = true,\n): string => {\n return content.replace(\n /\\{\\{API_KEY\\}\\}/g,\n mask ? `${apiKey.split(\":\")[0]}:*****` : apiKey,\n );\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 wrapCode = false,\n}) => {\n const codeRef = useRef<HTMLDivElement>(null);\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 // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [apiKeys]);\n\n useEffect(() => {\n const element = codeRef.current;\n if (!element) return;\n\n // Detects the key masking via substituteApiKey (i.e. \"abcde:*****\") and replaces it with the actual API key\n const unmaskRenderedApiKey = (content: string, apiKey: string): string => {\n return content.replace(/(['\"]?)([^:'\"]+):\\*{5}\\1/g, `$1${apiKey}$1`);\n };\n\n const handleCopy = (event: ClipboardEvent) => {\n const selection = window.getSelection();\n if (!selection || selection.rangeCount === 0) return;\n\n const selectedText = selection.toString();\n if (!selectedText) return;\n\n // Check if the selection is within our element\n const range = selection.getRangeAt(0);\n if (!element.contains(range.commonAncestorContainer)) return;\n\n const modifiedText = unmaskRenderedApiKey(selectedText, selectedApiKey);\n\n event.clipboardData?.setData(\"text/plain\", modifiedText);\n event.preventDefault();\n };\n\n document.addEventListener(\"copy\", handleCopy);\n\n return () => {\n document.removeEventListener(\"copy\", handleCopy);\n };\n }, [selectedApiKey]);\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 resolvedSdk: SDKType = useMemo(() => {\n if (sdkTypes.size === 1 && sdk && !sdkTypes.has(sdk)) {\n return Array.from(sdkTypes)[0];\n }\n return sdk ?? null;\n }, [sdk, sdkTypes]);\n\n const showSDKSelector = sdkTypes.size > 0;\n\n const filteredLanguages = useMemo(() => {\n const filtered =\n !resolvedSdk || !showSDKSelector\n ? [...languages]\n : languages.filter((lang) => lang.startsWith(`${resolvedSdk}_`));\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 }, [resolvedSdk, showSDKSelector, languages, languageOrdering]);\n\n const activeLanguage = useMemo(() => {\n if (resolvedSdk && sdkTypes.has(resolvedSdk)) {\n return `${resolvedSdk}_${lang}`;\n }\n\n if (lang) return lang;\n\n if (filteredLanguages.length > 0) return filteredLanguages[0];\n\n return languages[0];\n }, [resolvedSdk, sdkTypes, lang, filteredLanguages, languages]);\n\n const requiresApiKeySubstitution = useMemo(() => {\n const containsPlaceholder = codeData.some((code) =>\n code?.content.includes(\"{{API_KEY}}\"),\n );\n\n return (\n containsPlaceholder && !!apiKeys && apiKeys.length > 0 && !!selectedApiKey\n );\n }, [codeData, apiKeys, selectedApiKey]);\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-000 text-neutral-1300 dark:!bg-neutral-1300 dark:text-neutral-200 px-6 py-4\"\n showLines={showCodeLines}\n wrap={wrapCode}\n />\n );\n }\n\n return null;\n });\n }, [\n activeLanguage,\n hasOnlyJsonSnippet,\n codeData,\n requiresApiKeySubstitution,\n showCodeLines,\n wrapCode,\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\n if (onChange && nextLang) {\n onChange(stripSdkType(activeLanguage), type);\n }\n },\n [activeLanguage, languages, onChange],\n );\n\n const handleLanguageChange = useCallback(\n (language: string) => {\n if (onChange) {\n onChange(stripSdkType(language), resolvedSdk);\n }\n },\n [onChange, resolvedSdk],\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 <div className=\"w-12\"></div>\n </div>\n )}\n\n {showSDKSelector && (\n <div\n className={cn(\n \"p-2 border-b border-neutral-300 dark:border-neutral-1000\",\n sdkTypes.size === 1 && \"p-1\",\n headerRow ? \"\" : \"rounded-t-lg\",\n )}\n >\n <div className=\"flex gap-1 justify-start\">\n {[\"realtime\", \"rest\"].map(\n (type) =>\n sdkTypes.has(type as SDKType) && (\n <SegmentedControl\n key={type}\n onClick={() => handleSDKTypeChange(type as SDKType)}\n size=\"xs\"\n active={resolvedSdk === type}\n className={cn(\n \"text-[11px] font-semibold px-2 py-1 h-auto\",\n sdkTypes.size === 1 &&\n \"pointer-events-none bg-neutral-100 dark:bg-neutral-1200 !text-neutral-800 !dark:text-neutral-500\",\n sdkTypes.size > 1 &&\n resolvedSdk !== type &&\n \"bg-neutral-100 dark:bg-neutral-1200 hover:bg-neutral-200 dark:hover:bg-neutral-1100 active:bg-neutral-400 dark:active:bg-neutral-900\",\n sdkTypes.size > 1 &&\n resolvedSdk === type &&\n \"bg-neutral-000 dark:bg-neutral-1100\",\n )}\n >\n {type === \"realtime\" ? \"Realtime\" : \"REST\"}\n </SegmentedControl>\n ),\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-300 dark:border-neutral-1000 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 >\n {renderContent}\n {isHovering && activeLanguage && hasSnippetForActiveLanguage && (\n <CopyButton\n onCopy={() => {\n const text = codeData.find(\n (code) => code.language === activeLanguage,\n )?.content;\n if (text)\n navigator.clipboard.writeText(\n substituteApiKey(text, selectedApiKey, false),\n );\n }}\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","PlainCodeView","CopyButton","SegmentedControl","substituteApiKey","content","apiKey","mask","replace","split","CodeSnippet","fixed","headerRow","title","children","className","lang","onChange","apiKeys","sdk","showCodeLines","languageOrdering","wrapCode","codeRef","selectedApiKey","setSelectedApiKey","keys","key","length","element","current","unmaskRenderedApiKey","handleCopy","event","selection","window","getSelection","rangeCount","selectedText","toString","range","getRangeAt","contains","commonAncestorContainer","modifiedText","clipboardData","setData","preventDefault","document","addEventListener","removeEventListener","extractLanguageFromCode","codeElement","props","classNames","langClass","find","cls","startsWith","substring","codeData","languages","sdkTypes","isSinglePlainCommand","childrenArray","toArray","Set","some","includes","forEach","child","preElement","codeLanguage","add","push","codeContent","language","resolvedSdk","size","has","Array","from","showSDKSelector","filteredLanguages","filtered","filter","sort","a","b","aBase","bBase","aIndex","indexOf","bIndex","activeLanguage","requiresApiKeySubstitution","containsPlaceholder","code","isHovering","setIsHovering","hasOnlyJsonSnippet","processedChildren","targetLanguage","map","cleanLang","langInfo","processedContent","String","syntaxHighlighterKey","snippet","additionalCSS","showLines","wrap","hasSnippetForActiveLanguage","handleSDKTypeChange","type","nextLang","l","handleLanguageChange","noSnippetMessage","activeLanguageInfo","div","name","color","p","label","showLanguageSelector","showFullSelector","renderContent","plainChild","icon","onClick","active","onLanguageChange","span","ref","onMouseEnter","onMouseLeave","onFocus","onBlur","onCopy","text","navigator","clipboard","writeText","onApiKeyChange"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import React from"react";import G2BestMeetsRequirementsSpring2025 from"../images/badges/g2-best-meets-requirements-spring-2025.svg";import G2BestResultsSpring2025 from"../images/badges/g2-best-results-spring-2025.svg";import G2BestSupportSpring2025 from"../images/badges/g2-best-support-spring-2025.svg";import{products}from"../ProductTile/data";import DoxyMeLogo from"../Meganav/images/cust-logo-doxy-light.png";import DoxyMeLogoDark from"../Meganav/images/cust-logo-doxy-dark.png";export const productsMenu=[{label:"Architecture",icon:"icon-gui-squares-2-x-2-outline",link:"/platform"},{label:"Integrations",icon:"icon-gui-puzzle-piece-outline",link:"/docs/platform/integrations"},{label:"SDKs",icon:"icon-gui-cube-transparent-outline",link:"/docs/sdks"},{label:"Security & Compliance",icon:"icon-gui-shield-check-outline",link:"/security-and-compliance"}];export const compareMenu=[{label:"Ably vs Pusher",link:"/compare/ably-vs-pusher"},{label:"Ably vs PubNub",link:"/compare/ably-vs-pubnub"},{label:"Ably vs Socket.io",link:"/compare/ably-vs-socketio"}];export const solutionsMenu=[{label:"Fan Engagement",icon:"icon-gui-hand-thumb-up-outline",link:"/fan-engagement",description:"Enhance every moment with live, interactive fan experiences."},{label:"FinTech",icon:"icon-gui-currency-dollar-outline",link:"/fin-tech",description:"Speed, reliability, and confidence in every user interaction."},{label:"EdTech",icon:"icon-gui-academic-cap-outline",link:"/ed-tech",description:"Power collaborative, interactive learning environments."},{label:"CXTech",icon:"icon-gui-face-smile-outline",link:"/cx-tech",description:"Deliver fast support, strong relationships, and high retention."},{label:"HealthTech",icon:"icon-gui-heartbeat-outline",link:"/health-tech",description:"Reliable tools with full data privacy and compliance."}];export const customerStoriesHighlight={companyLogo:DoxyMeLogo,companyLogoDark:DoxyMeLogoDark,companyLink:"/case-studies/doxyme",companyName:"Doxy.me",companyDesc:"built their realtime stack in under six months, cutting costs by 65%, eliminating errors, and transforming a once-feared system into a core strength."};export const companyMenu=[{label:"Our story",icon:"icon-gui-ably-badge",link:"/case-studies"},{label:"Careers",icon:"icon-gui-briefcase-outline",link:"/careers",badge:"WE'RE HIRING"}];export const ablyAwards=[{image:G2BestSupportSpring2025,desc:"G2 Best Support Spring 2025"},{image:G2BestMeetsRequirementsSpring2025,desc:"G2 Best Meets Requirements Spring 2025"},{image:G2BestResultsSpring2025,desc:"G2 Best Results Spring 2025"}];export const menuItemLinks=[{name:"Pricing",link:"/pricing",isHiddenMobile:true},{name:"Docs",link:"/docs",isHiddenMobile:true}];export const defaultBlogPosts=[{title:"Ably AI Transport: keep your agents connected and stateful across devices",link:"/blog/ably-ai-transport",categories:["New Release","AI Transport","New Feature","RealTime Experiences","Engineering","Ably News"],pubDate:"Dec 9, 2025"},{title:"Live chat at unlimited scale: What it takes to support stadium-sized audiences",link:"/blog/live-chat-at-unlimited-scale",categories:["Chat"],pubDate:"Nov 18, 2025"}];export const productsForNav={...products,pubsub:{...products.pubsub,link:"/pubsub"},liveSync:{...products.liveSync,link:"/livesync"},chat:{...products.chat,link:"/chat"},spaces:{...products.spaces,link:"/spaces"},aiTransport:{...products.aiTransport,link:"/ai-transport"},liveObjects:{...products.liveObjects,link:"/liveobjects"}};
1
+ import React from"react";import G2BestMeetsRequirementsSpring2025 from"../images/badges/g2-best-meets-requirements-spring-2025.svg";import G2BestResultsSpring2025 from"../images/badges/g2-best-results-spring-2025.svg";import G2BestSupportSpring2025 from"../images/badges/g2-best-support-spring-2025.svg";import{products}from"../ProductTile/data";import DoxyMeLogo from"../Meganav/images/cust-logo-doxy-light.png";import DoxyMeLogoDark from"../Meganav/images/cust-logo-doxy-dark.png";export const productsMenu=[{label:"Architecture",icon:"icon-gui-squares-2-x-2-outline",link:"/platform"},{label:"Integrations",icon:"icon-gui-puzzle-piece-outline",link:"/docs/platform/integrations"},{label:"SDKs",icon:"icon-gui-cube-transparent-outline",link:"/docs/sdks"},{label:"Security & Compliance",icon:"icon-gui-shield-check-outline",link:"/security-and-compliance"}];export const compareMenu=[{label:"Ably vs Pusher",link:"/compare/ably-vs-pusher"},{label:"Ably vs PubNub",link:"/compare/ably-vs-pubnub"},{label:"Ably vs Socket.io",link:"/compare/ably-vs-socketio"}];export const solutionsMenu=[{label:"Fan Engagement",icon:"icon-gui-hand-thumb-up-outline",link:"/fan-engagement",description:"Enhance every moment with live, interactive fan experiences."},{label:"FinTech",icon:"icon-gui-currency-dollar-outline",link:"/fin-tech",description:"Speed, reliability, and confidence in every user interaction."},{label:"EdTech",icon:"icon-gui-academic-cap-outline",link:"/ed-tech",description:"Power collaborative, interactive learning environments."},{label:"CXTech",icon:"icon-gui-face-smile-outline",link:"/cx-tech",description:"Deliver fast support, strong relationships, and high retention."},{label:"HealthTech",icon:"icon-gui-heartbeat-outline",link:"/health-tech",description:"Reliable tools with full data privacy and compliance."}];export const customerStoriesHighlight={companyLogo:DoxyMeLogo,companyLogoDark:DoxyMeLogoDark,companyLink:"/case-studies/doxyme",companyName:"Doxy.me",companyDesc:"built their realtime stack in under six months, cutting costs by 65%, eliminating errors, and transforming a once-feared system into a core strength."};export const companyMenu=[{label:"Our story",icon:"icon-gui-ably-badge",link:"/about"},{label:"Careers",icon:"icon-gui-briefcase-outline",link:"/careers",badge:"WE'RE HIRING"}];export const ablyAwards=[{image:G2BestSupportSpring2025,desc:"G2 Best Support Spring 2025"},{image:G2BestMeetsRequirementsSpring2025,desc:"G2 Best Meets Requirements Spring 2025"},{image:G2BestResultsSpring2025,desc:"G2 Best Results Spring 2025"}];export const menuItemLinks=[{name:"Pricing",link:"/pricing",isHiddenMobile:true},{name:"Docs",link:"/docs",isHiddenMobile:true}];export const defaultBlogPosts=[{title:"Ably AI Transport: keep your agents connected and stateful across devices",link:"/blog/ably-ai-transport",categories:["New Release","AI Transport","New Feature","RealTime Experiences","Engineering","Ably News"],pubDate:"Dec 9, 2025"},{title:"Live chat at unlimited scale: What it takes to support stadium-sized audiences",link:"/blog/live-chat-at-unlimited-scale",categories:["Chat"],pubDate:"Nov 18, 2025"}];export const productsForNav={...products,pubsub:{...products.pubsub,link:"/pubsub"},liveSync:{...products.liveSync,link:"/livesync"},chat:{...products.chat,link:"/chat"},spaces:{...products.spaces,link:"/spaces"},aiTransport:{...products.aiTransport,link:"/ai-transport"},liveObjects:{...products.liveObjects,link:"/liveobjects"}};
2
2
  //# sourceMappingURL=data.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/core/Meganav/data.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconName } from \"../Icon/types\";\nimport { CustomerStoryHighlight } from \"./MeganavCustomerStories\";\nimport { BlogPost } from \"./MeganavBlog\";\nimport G2BestMeetsRequirementsSpring2025 from \"../images/badges/g2-best-meets-requirements-spring-2025.svg\";\nimport G2BestResultsSpring2025 from \"../images/badges/g2-best-results-spring-2025.svg\";\nimport G2BestSupportSpring2025 from \"../images/badges/g2-best-support-spring-2025.svg\";\nimport { products } from \"../ProductTile/data\";\nimport DoxyMeLogo from \"../Meganav/images/cust-logo-doxy-light.png\";\nimport DoxyMeLogoDark from \"../Meganav/images/cust-logo-doxy-dark.png\";\n\nexport type FlyoutPanelList = {\n label: string;\n icon?: IconName;\n link: string;\n isMobile?: boolean;\n description?: string;\n badge?: string;\n};\n\nexport type MenuItem = {\n name: string;\n link?: string;\n isHiddenMobile?: boolean;\n content?: React.ReactNode;\n panelClassName?: string;\n};\n\nexport const productsMenu: FlyoutPanelList[] = [\n {\n label: \"Architecture\",\n icon: \"icon-gui-squares-2-x-2-outline\",\n link: \"/platform\",\n },\n {\n label: \"Integrations\",\n icon: \"icon-gui-puzzle-piece-outline\",\n link: \"/docs/platform/integrations\",\n },\n {\n label: \"SDKs\",\n icon: \"icon-gui-cube-transparent-outline\",\n link: \"/docs/sdks\",\n },\n {\n label: \"Security & Compliance\",\n icon: \"icon-gui-shield-check-outline\",\n link: \"/security-and-compliance\",\n },\n];\n\nexport const compareMenu: FlyoutPanelList[] = [\n {\n label: \"Ably vs Pusher\",\n link: \"/compare/ably-vs-pusher\",\n },\n {\n label: \"Ably vs PubNub\",\n link: \"/compare/ably-vs-pubnub\",\n },\n {\n label: \"Ably vs Socket.io\",\n link: \"/compare/ably-vs-socketio\",\n },\n];\n\nexport const solutionsMenu: FlyoutPanelList[] = [\n {\n label: \"Fan Engagement\",\n icon: \"icon-gui-hand-thumb-up-outline\",\n link: \"/fan-engagement\",\n description: \"Enhance every moment with live, interactive fan experiences.\",\n },\n {\n label: \"FinTech\",\n icon: \"icon-gui-currency-dollar-outline\",\n link: \"/fin-tech\",\n description:\n \"Speed, reliability, and confidence in every user interaction.\",\n },\n {\n label: \"EdTech\",\n icon: \"icon-gui-academic-cap-outline\",\n link: \"/ed-tech\",\n description: \"Power collaborative, interactive learning environments.\",\n },\n {\n label: \"CXTech\",\n icon: \"icon-gui-face-smile-outline\",\n link: \"/cx-tech\",\n description:\n \"Deliver fast support, strong relationships, and high retention.\",\n },\n\n {\n label: \"HealthTech\",\n icon: \"icon-gui-heartbeat-outline\",\n link: \"/health-tech\",\n description: \"Reliable tools with full data privacy and compliance.\",\n },\n];\n\nexport const customerStoriesHighlight: CustomerStoryHighlight = {\n companyLogo: DoxyMeLogo,\n companyLogoDark: DoxyMeLogoDark,\n companyLink: \"/case-studies/doxyme\",\n companyName: \"Doxy.me\",\n companyDesc:\n \"built their realtime stack in under six months, cutting costs by 65%, eliminating errors, and transforming a once-feared system into a core strength.\",\n};\n\nexport const companyMenu: FlyoutPanelList[] = [\n {\n label: \"Our story\",\n icon: \"icon-gui-ably-badge\",\n link: \"/case-studies\",\n },\n {\n label: \"Careers\",\n icon: \"icon-gui-briefcase-outline\",\n link: \"/careers\",\n badge: \"WE'RE HIRING\",\n },\n];\n\nexport const ablyAwards = [\n {\n image: G2BestSupportSpring2025,\n desc: \"G2 Best Support Spring 2025\",\n },\n {\n image: G2BestMeetsRequirementsSpring2025,\n desc: \"G2 Best Meets Requirements Spring 2025\",\n },\n {\n image: G2BestResultsSpring2025,\n desc: \"G2 Best Results Spring 2025\",\n },\n];\n\nexport const menuItemLinks = [\n { name: \"Pricing\", link: \"/pricing\", isHiddenMobile: true },\n { name: \"Docs\", link: \"/docs\", isHiddenMobile: true },\n];\n\nexport const defaultBlogPosts: BlogPost[] = [\n {\n title:\n \"Ably AI Transport: keep your agents connected and stateful across devices\",\n link: \"/blog/ably-ai-transport\",\n categories: [\n \"New Release\",\n \"AI Transport\",\n \"New Feature\",\n \"RealTime Experiences\",\n \"Engineering\",\n \"Ably News\",\n ],\n pubDate: \"Dec 9, 2025\",\n },\n {\n title:\n \"Live chat at unlimited scale: What it takes to support stadium-sized audiences\",\n link: \"/blog/live-chat-at-unlimited-scale\",\n categories: [\"Chat\"],\n pubDate: \"Nov 18, 2025\",\n },\n];\n\nexport const productsForNav = {\n ...products,\n pubsub: { ...products.pubsub, link: \"/pubsub\" },\n liveSync: { ...products.liveSync, link: \"/livesync\" },\n chat: { ...products.chat, link: \"/chat\" },\n spaces: { ...products.spaces, link: \"/spaces\" },\n aiTransport: {\n ...products.aiTransport,\n link: \"/ai-transport\",\n },\n liveObjects: { ...products.liveObjects, link: \"/liveobjects\" },\n};\n"],"names":["React","G2BestMeetsRequirementsSpring2025","G2BestResultsSpring2025","G2BestSupportSpring2025","products","DoxyMeLogo","DoxyMeLogoDark","productsMenu","label","icon","link","compareMenu","solutionsMenu","description","customerStoriesHighlight","companyLogo","companyLogoDark","companyLink","companyName","companyDesc","companyMenu","badge","ablyAwards","image","desc","menuItemLinks","name","isHiddenMobile","defaultBlogPosts","title","categories","pubDate","productsForNav","pubsub","liveSync","chat","spaces","aiTransport","liveObjects"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAI1B,QAAOC,sCAAuC,6DAA8D,AAC5G,QAAOC,4BAA6B,kDAAmD,AACvF,QAAOC,4BAA6B,kDAAmD,AACvF,QAASC,QAAQ,KAAQ,qBAAsB,AAC/C,QAAOC,eAAgB,4CAA6C,AACpE,QAAOC,mBAAoB,2CAA4C,AAmBvE,QAAO,MAAMC,aAAkC,CAC7C,CACEC,MAAO,eACPC,KAAM,iCACNC,KAAM,WACR,EACA,CACEF,MAAO,eACPC,KAAM,gCACNC,KAAM,6BACR,EACA,CACEF,MAAO,OACPC,KAAM,oCACNC,KAAM,YACR,EACA,CACEF,MAAO,wBACPC,KAAM,gCACNC,KAAM,0BACR,EACD,AAAC,AAEF,QAAO,MAAMC,YAAiC,CAC5C,CACEH,MAAO,iBACPE,KAAM,yBACR,EACA,CACEF,MAAO,iBACPE,KAAM,yBACR,EACA,CACEF,MAAO,oBACPE,KAAM,2BACR,EACD,AAAC,AAEF,QAAO,MAAME,cAAmC,CAC9C,CACEJ,MAAO,iBACPC,KAAM,iCACNC,KAAM,kBACNG,YAAa,8DACf,EACA,CACEL,MAAO,UACPC,KAAM,mCACNC,KAAM,YACNG,YACE,+DACJ,EACA,CACEL,MAAO,SACPC,KAAM,gCACNC,KAAM,WACNG,YAAa,yDACf,EACA,CACEL,MAAO,SACPC,KAAM,8BACNC,KAAM,WACNG,YACE,iEACJ,EAEA,CACEL,MAAO,aACPC,KAAM,6BACNC,KAAM,eACNG,YAAa,uDACf,EACD,AAAC,AAEF,QAAO,MAAMC,yBAAmD,CAC9DC,YAAaV,WACbW,gBAAiBV,eACjBW,YAAa,uBACbC,YAAa,UACbC,YACE,uJACJ,CAAE,AAEF,QAAO,MAAMC,YAAiC,CAC5C,CACEZ,MAAO,YACPC,KAAM,sBACNC,KAAM,eACR,EACA,CACEF,MAAO,UACPC,KAAM,6BACNC,KAAM,WACNW,MAAO,cACT,EACD,AAAC,AAEF,QAAO,MAAMC,WAAa,CACxB,CACEC,MAAOpB,wBACPqB,KAAM,6BACR,EACA,CACED,MAAOtB,kCACPuB,KAAM,wCACR,EACA,CACED,MAAOrB,wBACPsB,KAAM,6BACR,EACD,AAAC,AAEF,QAAO,MAAMC,cAAgB,CAC3B,CAAEC,KAAM,UAAWhB,KAAM,WAAYiB,eAAgB,IAAK,EAC1D,CAAED,KAAM,OAAQhB,KAAM,QAASiB,eAAgB,IAAK,EACrD,AAAC,AAEF,QAAO,MAAMC,iBAA+B,CAC1C,CACEC,MACE,4EACFnB,KAAM,0BACNoB,WAAY,CACV,cACA,eACA,cACA,uBACA,cACA,YACD,CACDC,QAAS,aACX,EACA,CACEF,MACE,iFACFnB,KAAM,qCACNoB,WAAY,CAAC,OAAO,CACpBC,QAAS,cACX,EACD,AAAC,AAEF,QAAO,MAAMC,eAAiB,CAC5B,GAAG5B,QAAQ,CACX6B,OAAQ,CAAE,GAAG7B,SAAS6B,MAAM,CAAEvB,KAAM,SAAU,EAC9CwB,SAAU,CAAE,GAAG9B,SAAS8B,QAAQ,CAAExB,KAAM,WAAY,EACpDyB,KAAM,CAAE,GAAG/B,SAAS+B,IAAI,CAAEzB,KAAM,OAAQ,EACxC0B,OAAQ,CAAE,GAAGhC,SAASgC,MAAM,CAAE1B,KAAM,SAAU,EAC9C2B,YAAa,CACX,GAAGjC,SAASiC,WAAW,CACvB3B,KAAM,eACR,EACA4B,YAAa,CAAE,GAAGlC,SAASkC,WAAW,CAAE5B,KAAM,cAAe,CAC/D,CAAE"}
1
+ {"version":3,"sources":["../../../src/core/Meganav/data.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconName } from \"../Icon/types\";\nimport { CustomerStoryHighlight } from \"./MeganavCustomerStories\";\nimport { BlogPost } from \"./MeganavBlog\";\nimport G2BestMeetsRequirementsSpring2025 from \"../images/badges/g2-best-meets-requirements-spring-2025.svg\";\nimport G2BestResultsSpring2025 from \"../images/badges/g2-best-results-spring-2025.svg\";\nimport G2BestSupportSpring2025 from \"../images/badges/g2-best-support-spring-2025.svg\";\nimport { products } from \"../ProductTile/data\";\nimport DoxyMeLogo from \"../Meganav/images/cust-logo-doxy-light.png\";\nimport DoxyMeLogoDark from \"../Meganav/images/cust-logo-doxy-dark.png\";\n\nexport type FlyoutPanelList = {\n label: string;\n icon?: IconName;\n link: string;\n isMobile?: boolean;\n description?: string;\n badge?: string;\n};\n\nexport type MenuItem = {\n name: string;\n link?: string;\n isHiddenMobile?: boolean;\n content?: React.ReactNode;\n panelClassName?: string;\n};\n\nexport const productsMenu: FlyoutPanelList[] = [\n {\n label: \"Architecture\",\n icon: \"icon-gui-squares-2-x-2-outline\",\n link: \"/platform\",\n },\n {\n label: \"Integrations\",\n icon: \"icon-gui-puzzle-piece-outline\",\n link: \"/docs/platform/integrations\",\n },\n {\n label: \"SDKs\",\n icon: \"icon-gui-cube-transparent-outline\",\n link: \"/docs/sdks\",\n },\n {\n label: \"Security & Compliance\",\n icon: \"icon-gui-shield-check-outline\",\n link: \"/security-and-compliance\",\n },\n];\n\nexport const compareMenu: FlyoutPanelList[] = [\n {\n label: \"Ably vs Pusher\",\n link: \"/compare/ably-vs-pusher\",\n },\n {\n label: \"Ably vs PubNub\",\n link: \"/compare/ably-vs-pubnub\",\n },\n {\n label: \"Ably vs Socket.io\",\n link: \"/compare/ably-vs-socketio\",\n },\n];\n\nexport const solutionsMenu: FlyoutPanelList[] = [\n {\n label: \"Fan Engagement\",\n icon: \"icon-gui-hand-thumb-up-outline\",\n link: \"/fan-engagement\",\n description: \"Enhance every moment with live, interactive fan experiences.\",\n },\n {\n label: \"FinTech\",\n icon: \"icon-gui-currency-dollar-outline\",\n link: \"/fin-tech\",\n description:\n \"Speed, reliability, and confidence in every user interaction.\",\n },\n {\n label: \"EdTech\",\n icon: \"icon-gui-academic-cap-outline\",\n link: \"/ed-tech\",\n description: \"Power collaborative, interactive learning environments.\",\n },\n {\n label: \"CXTech\",\n icon: \"icon-gui-face-smile-outline\",\n link: \"/cx-tech\",\n description:\n \"Deliver fast support, strong relationships, and high retention.\",\n },\n\n {\n label: \"HealthTech\",\n icon: \"icon-gui-heartbeat-outline\",\n link: \"/health-tech\",\n description: \"Reliable tools with full data privacy and compliance.\",\n },\n];\n\nexport const customerStoriesHighlight: CustomerStoryHighlight = {\n companyLogo: DoxyMeLogo,\n companyLogoDark: DoxyMeLogoDark,\n companyLink: \"/case-studies/doxyme\",\n companyName: \"Doxy.me\",\n companyDesc:\n \"built their realtime stack in under six months, cutting costs by 65%, eliminating errors, and transforming a once-feared system into a core strength.\",\n};\n\nexport const companyMenu: FlyoutPanelList[] = [\n {\n label: \"Our story\",\n icon: \"icon-gui-ably-badge\",\n link: \"/about\",\n },\n {\n label: \"Careers\",\n icon: \"icon-gui-briefcase-outline\",\n link: \"/careers\",\n badge: \"WE'RE HIRING\",\n },\n];\n\nexport const ablyAwards = [\n {\n image: G2BestSupportSpring2025,\n desc: \"G2 Best Support Spring 2025\",\n },\n {\n image: G2BestMeetsRequirementsSpring2025,\n desc: \"G2 Best Meets Requirements Spring 2025\",\n },\n {\n image: G2BestResultsSpring2025,\n desc: \"G2 Best Results Spring 2025\",\n },\n];\n\nexport const menuItemLinks = [\n { name: \"Pricing\", link: \"/pricing\", isHiddenMobile: true },\n { name: \"Docs\", link: \"/docs\", isHiddenMobile: true },\n];\n\nexport const defaultBlogPosts: BlogPost[] = [\n {\n title:\n \"Ably AI Transport: keep your agents connected and stateful across devices\",\n link: \"/blog/ably-ai-transport\",\n categories: [\n \"New Release\",\n \"AI Transport\",\n \"New Feature\",\n \"RealTime Experiences\",\n \"Engineering\",\n \"Ably News\",\n ],\n pubDate: \"Dec 9, 2025\",\n },\n {\n title:\n \"Live chat at unlimited scale: What it takes to support stadium-sized audiences\",\n link: \"/blog/live-chat-at-unlimited-scale\",\n categories: [\"Chat\"],\n pubDate: \"Nov 18, 2025\",\n },\n];\n\nexport const productsForNav = {\n ...products,\n pubsub: { ...products.pubsub, link: \"/pubsub\" },\n liveSync: { ...products.liveSync, link: \"/livesync\" },\n chat: { ...products.chat, link: \"/chat\" },\n spaces: { ...products.spaces, link: \"/spaces\" },\n aiTransport: {\n ...products.aiTransport,\n link: \"/ai-transport\",\n },\n liveObjects: { ...products.liveObjects, link: \"/liveobjects\" },\n};\n"],"names":["React","G2BestMeetsRequirementsSpring2025","G2BestResultsSpring2025","G2BestSupportSpring2025","products","DoxyMeLogo","DoxyMeLogoDark","productsMenu","label","icon","link","compareMenu","solutionsMenu","description","customerStoriesHighlight","companyLogo","companyLogoDark","companyLink","companyName","companyDesc","companyMenu","badge","ablyAwards","image","desc","menuItemLinks","name","isHiddenMobile","defaultBlogPosts","title","categories","pubDate","productsForNav","pubsub","liveSync","chat","spaces","aiTransport","liveObjects"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAI1B,QAAOC,sCAAuC,6DAA8D,AAC5G,QAAOC,4BAA6B,kDAAmD,AACvF,QAAOC,4BAA6B,kDAAmD,AACvF,QAASC,QAAQ,KAAQ,qBAAsB,AAC/C,QAAOC,eAAgB,4CAA6C,AACpE,QAAOC,mBAAoB,2CAA4C,AAmBvE,QAAO,MAAMC,aAAkC,CAC7C,CACEC,MAAO,eACPC,KAAM,iCACNC,KAAM,WACR,EACA,CACEF,MAAO,eACPC,KAAM,gCACNC,KAAM,6BACR,EACA,CACEF,MAAO,OACPC,KAAM,oCACNC,KAAM,YACR,EACA,CACEF,MAAO,wBACPC,KAAM,gCACNC,KAAM,0BACR,EACD,AAAC,AAEF,QAAO,MAAMC,YAAiC,CAC5C,CACEH,MAAO,iBACPE,KAAM,yBACR,EACA,CACEF,MAAO,iBACPE,KAAM,yBACR,EACA,CACEF,MAAO,oBACPE,KAAM,2BACR,EACD,AAAC,AAEF,QAAO,MAAME,cAAmC,CAC9C,CACEJ,MAAO,iBACPC,KAAM,iCACNC,KAAM,kBACNG,YAAa,8DACf,EACA,CACEL,MAAO,UACPC,KAAM,mCACNC,KAAM,YACNG,YACE,+DACJ,EACA,CACEL,MAAO,SACPC,KAAM,gCACNC,KAAM,WACNG,YAAa,yDACf,EACA,CACEL,MAAO,SACPC,KAAM,8BACNC,KAAM,WACNG,YACE,iEACJ,EAEA,CACEL,MAAO,aACPC,KAAM,6BACNC,KAAM,eACNG,YAAa,uDACf,EACD,AAAC,AAEF,QAAO,MAAMC,yBAAmD,CAC9DC,YAAaV,WACbW,gBAAiBV,eACjBW,YAAa,uBACbC,YAAa,UACbC,YACE,uJACJ,CAAE,AAEF,QAAO,MAAMC,YAAiC,CAC5C,CACEZ,MAAO,YACPC,KAAM,sBACNC,KAAM,QACR,EACA,CACEF,MAAO,UACPC,KAAM,6BACNC,KAAM,WACNW,MAAO,cACT,EACD,AAAC,AAEF,QAAO,MAAMC,WAAa,CACxB,CACEC,MAAOpB,wBACPqB,KAAM,6BACR,EACA,CACED,MAAOtB,kCACPuB,KAAM,wCACR,EACA,CACED,MAAOrB,wBACPsB,KAAM,6BACR,EACD,AAAC,AAEF,QAAO,MAAMC,cAAgB,CAC3B,CAAEC,KAAM,UAAWhB,KAAM,WAAYiB,eAAgB,IAAK,EAC1D,CAAED,KAAM,OAAQhB,KAAM,QAASiB,eAAgB,IAAK,EACrD,AAAC,AAEF,QAAO,MAAMC,iBAA+B,CAC1C,CACEC,MACE,4EACFnB,KAAM,0BACNoB,WAAY,CACV,cACA,eACA,cACA,uBACA,cACA,YACD,CACDC,QAAS,aACX,EACA,CACEF,MACE,iFACFnB,KAAM,qCACNoB,WAAY,CAAC,OAAO,CACpBC,QAAS,cACX,EACD,AAAC,AAEF,QAAO,MAAMC,eAAiB,CAC5B,GAAG5B,QAAQ,CACX6B,OAAQ,CAAE,GAAG7B,SAAS6B,MAAM,CAAEvB,KAAM,SAAU,EAC9CwB,SAAU,CAAE,GAAG9B,SAAS8B,QAAQ,CAAExB,KAAM,WAAY,EACpDyB,KAAM,CAAE,GAAG/B,SAAS+B,IAAI,CAAEzB,KAAM,OAAQ,EACxC0B,OAAQ,CAAE,GAAGhC,SAASgC,MAAM,CAAE1B,KAAM,SAAU,EAC9C2B,YAAa,CACX,GAAGjC,SAASiC,WAAW,CACvB3B,KAAM,eACR,EACA4B,YAAa,CAAE,GAAGlC,SAASkC,WAAW,CAAE5B,KAAM,cAAe,CAC/D,CAAE"}
package/index.d.ts CHANGED
@@ -412,7 +412,7 @@ export default languages;
412
412
 
413
413
  declare module '@ably/ui/core/CodeSnippet' {
414
414
  import React from "react";
415
- export type SDKType = "realtime" | "rest" | "fe" | "be" | null;
415
+ export type SDKType = "realtime" | "rest" | null;
416
416
  export type ApiKeysItem = {
417
417
  app: string;
418
418
  keys: {
@@ -1705,28 +1705,6 @@ export default ForwardRef;
1705
1705
  //# sourceMappingURL=icon-display-observe-analytics.d.ts.map
1706
1706
  }
1707
1707
 
1708
- declare module '@ably/ui/core/Icon/components/icon-display-other-mono' {
1709
- import * as React from "react";
1710
- interface SVGRProps {
1711
- title?: string;
1712
- titleId?: string;
1713
- }
1714
- const ForwardRef: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement> & SVGRProps, "ref"> & React.RefAttributes<SVGSVGElement>>;
1715
- export default ForwardRef;
1716
- //# sourceMappingURL=icon-display-other-mono.d.ts.map
1717
- }
1718
-
1719
- declare module '@ably/ui/core/Icon/components/icon-display-other' {
1720
- import * as React from "react";
1721
- interface SVGRProps {
1722
- title?: string;
1723
- titleId?: string;
1724
- }
1725
- const ForwardRef: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement> & SVGRProps, "ref"> & React.RefAttributes<SVGSVGElement>>;
1726
- export default ForwardRef;
1727
- //# sourceMappingURL=icon-display-other.d.ts.map
1728
- }
1729
-
1730
1708
  declare module '@ably/ui/core/Icon/components/icon-display-padlock-closed' {
1731
1709
  import * as React from "react";
1732
1710
  interface SVGRProps {
@@ -2651,28 +2629,6 @@ export default ForwardRef;
2651
2629
  //# sourceMappingURL=icon-product-livesync.d.ts.map
2652
2630
  }
2653
2631
 
2654
- declare module '@ably/ui/core/Icon/components/icon-product-other-mono' {
2655
- import * as React from "react";
2656
- interface SVGRProps {
2657
- title?: string;
2658
- titleId?: string;
2659
- }
2660
- const ForwardRef: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement> & SVGRProps, "ref"> & React.RefAttributes<SVGSVGElement>>;
2661
- export default ForwardRef;
2662
- //# sourceMappingURL=icon-product-other-mono.d.ts.map
2663
- }
2664
-
2665
- declare module '@ably/ui/core/Icon/components/icon-product-other' {
2666
- import * as React from "react";
2667
- interface SVGRProps {
2668
- title?: string;
2669
- titleId?: string;
2670
- }
2671
- const ForwardRef: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement> & SVGRProps, "ref"> & React.RefAttributes<SVGSVGElement>>;
2672
- export default ForwardRef;
2673
- //# sourceMappingURL=icon-product-other.d.ts.map
2674
- }
2675
-
2676
2632
  declare module '@ably/ui/core/Icon/components/icon-product-platform-mono' {
2677
2633
  import * as React from "react";
2678
2634
  interface SVGRProps {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ably/ui",
3
- "version": "17.13.1-dev.c839343a",
3
+ "version": "17.13.2-dev.44eaafa0f2",
4
4
  "description": "Home of the Ably design system library ([design.ably.com](https://design.ably.com)). It provides a showcase, development/test environment and a publishing pipeline for different distributables.",
5
5
  "repository": {
6
6
  "type": "git",
@@ -37,8 +37,8 @@
37
37
  "@types/react": "^18.3.1",
38
38
  "@types/react-dom": "^18.3.0",
39
39
  "@types/svg-sprite": "^0.0.39",
40
- "@typescript-eslint/eslint-plugin": "^8.53.0",
41
- "@typescript-eslint/parser": "^8.53.0",
40
+ "@typescript-eslint/eslint-plugin": "^8.54.0",
41
+ "@typescript-eslint/parser": "^8.54.0",
42
42
  "@vitejs/plugin-react-swc": "^4.0.1",
43
43
  "@vitest/browser": "3.2.4",
44
44
  "@vitest/coverage-v8": "3.2.4",
@@ -52,12 +52,12 @@
52
52
  "eslint-plugin-storybook": "^10.2.0",
53
53
  "heroicons": "^2.2.0",
54
54
  "http-server": "14.1.1",
55
- "jsdom": "^27.4.0",
56
- "mixpanel-browser": "^2.73.0",
55
+ "jsdom": "^28.0.0",
56
+ "mixpanel-browser": "^2.74.0",
57
57
  "msw": "2.12.0",
58
58
  "msw-storybook-addon": "^2.0.5",
59
59
  "playwright": "^1.58.0",
60
- "posthog-js": "^1.335.2",
60
+ "posthog-js": "^1.336.1",
61
61
  "prettier": "^3.8.0",
62
62
  "storybook": "^10.2.0",
63
63
  "svg-sprite": "^2.0.4",
@@ -1,2 +0,0 @@
1
- import*as React from"react";import{forwardRef}from"react";const IconDisplayOtherMono=({title,titleId,...props},ref)=>React.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:46,height:48,fill:"none",viewBox:"0 0 46 48",ref:ref,"aria-labelledby":titleId,...props},title?React.createElement("title",{id:titleId},title):null,React.createElement("path",{stroke:"#03020D",strokeWidth:1.5,d:"M21 2.155a4 4 0 0 1 4 0l15.919 9.19a4 4 0 0 1 2 3.464v18.382a4 4 0 0 1-2 3.464L25 45.845a4 4 0 0 1-4 0l-15.919-9.19a4 4 0 0 1-2-3.464V14.809a4 4 0 0 1 2-3.464z"}),React.createElement("path",{fill:"#03020D",d:"M24.063 29.21v-1.797c0-4.693 4.937-3.84 4.937-9.05C29 15.042 26.488 13 23.312 13c-1.703 0-3.493.67-5.312 1.493v2.62l5.14-1.858c2.193 0 3.55 1.31 3.55 3.2 0 3.686-4.995 3.077-4.735 8.866l.087 1.89zm.635 5.79v-3.352h-3.233V35z"}));const ForwardRef=forwardRef(IconDisplayOtherMono);export default ForwardRef;
2
- //# sourceMappingURL=icon-display-other-mono.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../../src/core/Icon/components/icon-display-other-mono.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { SVGProps } from \"react\";\nimport { Ref, forwardRef } from \"react\";\ninterface SVGRProps {\n title?: string;\n titleId?: string;\n}\nconst IconDisplayOtherMono = ({\n title,\n titleId,\n ...props\n}: SVGProps<SVGSVGElement> & SVGRProps, ref: Ref<SVGSVGElement>) => <svg xmlns=\"http://www.w3.org/2000/svg\" width={46} height={48} fill=\"none\" viewBox=\"0 0 46 48\" ref={ref} aria-labelledby={titleId} {...props}>{title ? <title id={titleId}>{title}</title> : null}<path stroke=\"#03020D\" strokeWidth={1.5} d=\"M21 2.155a4 4 0 0 1 4 0l15.919 9.19a4 4 0 0 1 2 3.464v18.382a4 4 0 0 1-2 3.464L25 45.845a4 4 0 0 1-4 0l-15.919-9.19a4 4 0 0 1-2-3.464V14.809a4 4 0 0 1 2-3.464z\" /><path fill=\"#03020D\" d=\"M24.063 29.21v-1.797c0-4.693 4.937-3.84 4.937-9.05C29 15.042 26.488 13 23.312 13c-1.703 0-3.493.67-5.312 1.493v2.62l5.14-1.858c2.193 0 3.55 1.31 3.55 3.2 0 3.686-4.995 3.077-4.735 8.866l.087 1.89zm.635 5.79v-3.352h-3.233V35z\" /></svg>;\nconst ForwardRef = forwardRef(IconDisplayOtherMono);\nexport default ForwardRef;"],"names":["React","forwardRef","IconDisplayOtherMono","title","titleId","props","ref","svg","xmlns","width","height","fill","viewBox","aria-labelledby","id","path","stroke","strokeWidth","d","ForwardRef"],"mappings":"AAAA,UAAYA,UAAW,OAAQ,AAE/B,QAAcC,UAAU,KAAQ,OAAQ,CAKxC,MAAMC,qBAAuB,CAAC,CAC5BC,KAAK,CACLC,OAAO,CACP,GAAGC,MACiC,CAAEC,MAA4B,oBAACC,OAAIC,MAAM,6BAA6BC,MAAO,GAAIC,OAAQ,GAAIC,KAAK,OAAOC,QAAQ,YAAYN,IAAKA,IAAKO,kBAAiBT,QAAU,GAAGC,KAAK,EAAGF,MAAQ,oBAACA,SAAMW,GAAIV,SAAUD,OAAiB,KAAK,oBAACY,QAAKC,OAAO,UAAUC,YAAa,IAAKC,EAAE,oKAAoK,oBAACH,QAAKJ,KAAK,UAAUO,EAAE,sOAC5e,MAAMC,WAAalB,WAAWC,qBAC9B,gBAAeiB,UAAW"}
@@ -1,2 +0,0 @@
1
- import*as React from"react";import{forwardRef}from"react";const IconDisplayOther=({title,titleId,...props},ref)=>React.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:46,height:48,fill:"none",viewBox:"0 0 46 48",ref:ref,"aria-labelledby":titleId,...props},title?React.createElement("title",{id:titleId},title):null,React.createElement("path",{stroke:"#03020D",strokeWidth:1.5,d:"M21 2.155a4 4 0 0 1 4 0l15.919 9.19a4 4 0 0 1 2 3.464v18.382a4 4 0 0 1-2 3.464L25 45.845a4 4 0 0 1-4 0l-15.919-9.19a4 4 0 0 1-2-3.464V14.809a4 4 0 0 1 2-3.464z"}),React.createElement("path",{fill:"#FF5416",d:"M24.063 29.21v-1.797c0-4.693 4.937-3.84 4.937-9.05C29 15.042 26.488 13 23.312 13c-1.703 0-3.493.67-5.312 1.493v2.62l5.14-1.858c2.193 0 3.55 1.31 3.55 3.2 0 3.686-4.995 3.077-4.735 8.866l.087 1.89zm.635 5.79v-3.352h-3.233V35z"}));const ForwardRef=forwardRef(IconDisplayOther);export default ForwardRef;
2
- //# sourceMappingURL=icon-display-other.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../../src/core/Icon/components/icon-display-other.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { SVGProps } from \"react\";\nimport { Ref, forwardRef } from \"react\";\ninterface SVGRProps {\n title?: string;\n titleId?: string;\n}\nconst IconDisplayOther = ({\n title,\n titleId,\n ...props\n}: SVGProps<SVGSVGElement> & SVGRProps, ref: Ref<SVGSVGElement>) => <svg xmlns=\"http://www.w3.org/2000/svg\" width={46} height={48} fill=\"none\" viewBox=\"0 0 46 48\" ref={ref} aria-labelledby={titleId} {...props}>{title ? <title id={titleId}>{title}</title> : null}<path stroke=\"#03020D\" strokeWidth={1.5} d=\"M21 2.155a4 4 0 0 1 4 0l15.919 9.19a4 4 0 0 1 2 3.464v18.382a4 4 0 0 1-2 3.464L25 45.845a4 4 0 0 1-4 0l-15.919-9.19a4 4 0 0 1-2-3.464V14.809a4 4 0 0 1 2-3.464z\" /><path fill=\"#FF5416\" d=\"M24.063 29.21v-1.797c0-4.693 4.937-3.84 4.937-9.05C29 15.042 26.488 13 23.312 13c-1.703 0-3.493.67-5.312 1.493v2.62l5.14-1.858c2.193 0 3.55 1.31 3.55 3.2 0 3.686-4.995 3.077-4.735 8.866l.087 1.89zm.635 5.79v-3.352h-3.233V35z\" /></svg>;\nconst ForwardRef = forwardRef(IconDisplayOther);\nexport default ForwardRef;"],"names":["React","forwardRef","IconDisplayOther","title","titleId","props","ref","svg","xmlns","width","height","fill","viewBox","aria-labelledby","id","path","stroke","strokeWidth","d","ForwardRef"],"mappings":"AAAA,UAAYA,UAAW,OAAQ,AAE/B,QAAcC,UAAU,KAAQ,OAAQ,CAKxC,MAAMC,iBAAmB,CAAC,CACxBC,KAAK,CACLC,OAAO,CACP,GAAGC,MACiC,CAAEC,MAA4B,oBAACC,OAAIC,MAAM,6BAA6BC,MAAO,GAAIC,OAAQ,GAAIC,KAAK,OAAOC,QAAQ,YAAYN,IAAKA,IAAKO,kBAAiBT,QAAU,GAAGC,KAAK,EAAGF,MAAQ,oBAACA,SAAMW,GAAIV,SAAUD,OAAiB,KAAK,oBAACY,QAAKC,OAAO,UAAUC,YAAa,IAAKC,EAAE,oKAAoK,oBAACH,QAAKJ,KAAK,UAAUO,EAAE,sOAC5e,MAAMC,WAAalB,WAAWC,iBAC9B,gBAAeiB,UAAW"}
@@ -1,2 +0,0 @@
1
- import*as React from"react";import{forwardRef}from"react";const IconProductOtherMono=({title,titleId,...props},ref)=>React.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:46,height:48,fill:"none",viewBox:"0 0 46 48",ref:ref,"aria-labelledby":titleId,...props},title?React.createElement("title",{id:titleId},title):null,React.createElement("path",{stroke:"#03020D",strokeWidth:1.5,d:"M21 2.155a4 4 0 0 1 4 0l15.919 9.19a4 4 0 0 1 2 3.464v18.382a4 4 0 0 1-2 3.464L25 45.845a4 4 0 0 1-4 0l-15.919-9.19a4 4 0 0 1-2-3.464V14.809a4 4 0 0 1 2-3.464z"}),React.createElement("path",{fill:"#03020D",d:"M24.063 29.21v-1.797c0-4.693 4.937-3.84 4.937-9.05C29 15.042 26.488 13 23.312 13c-1.703 0-3.493.67-5.312 1.493v2.62l5.14-1.858c2.193 0 3.55 1.31 3.55 3.2 0 3.686-4.995 3.077-4.735 8.866l.087 1.89zm.635 5.79v-3.352h-3.233V35z"}));const ForwardRef=forwardRef(IconProductOtherMono);export default ForwardRef;
2
- //# sourceMappingURL=icon-product-other-mono.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../../src/core/Icon/components/icon-product-other-mono.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { SVGProps } from \"react\";\nimport { Ref, forwardRef } from \"react\";\ninterface SVGRProps {\n title?: string;\n titleId?: string;\n}\nconst IconProductOtherMono = ({\n title,\n titleId,\n ...props\n}: SVGProps<SVGSVGElement> & SVGRProps, ref: Ref<SVGSVGElement>) => <svg xmlns=\"http://www.w3.org/2000/svg\" width={46} height={48} fill=\"none\" viewBox=\"0 0 46 48\" ref={ref} aria-labelledby={titleId} {...props}>{title ? <title id={titleId}>{title}</title> : null}<path stroke=\"#03020D\" strokeWidth={1.5} d=\"M21 2.155a4 4 0 0 1 4 0l15.919 9.19a4 4 0 0 1 2 3.464v18.382a4 4 0 0 1-2 3.464L25 45.845a4 4 0 0 1-4 0l-15.919-9.19a4 4 0 0 1-2-3.464V14.809a4 4 0 0 1 2-3.464z\" /><path fill=\"#03020D\" d=\"M24.063 29.21v-1.797c0-4.693 4.937-3.84 4.937-9.05C29 15.042 26.488 13 23.312 13c-1.703 0-3.493.67-5.312 1.493v2.62l5.14-1.858c2.193 0 3.55 1.31 3.55 3.2 0 3.686-4.995 3.077-4.735 8.866l.087 1.89zm.635 5.79v-3.352h-3.233V35z\" /></svg>;\nconst ForwardRef = forwardRef(IconProductOtherMono);\nexport default ForwardRef;"],"names":["React","forwardRef","IconProductOtherMono","title","titleId","props","ref","svg","xmlns","width","height","fill","viewBox","aria-labelledby","id","path","stroke","strokeWidth","d","ForwardRef"],"mappings":"AAAA,UAAYA,UAAW,OAAQ,AAE/B,QAAcC,UAAU,KAAQ,OAAQ,CAKxC,MAAMC,qBAAuB,CAAC,CAC5BC,KAAK,CACLC,OAAO,CACP,GAAGC,MACiC,CAAEC,MAA4B,oBAACC,OAAIC,MAAM,6BAA6BC,MAAO,GAAIC,OAAQ,GAAIC,KAAK,OAAOC,QAAQ,YAAYN,IAAKA,IAAKO,kBAAiBT,QAAU,GAAGC,KAAK,EAAGF,MAAQ,oBAACA,SAAMW,GAAIV,SAAUD,OAAiB,KAAK,oBAACY,QAAKC,OAAO,UAAUC,YAAa,IAAKC,EAAE,oKAAoK,oBAACH,QAAKJ,KAAK,UAAUO,EAAE,sOAC5e,MAAMC,WAAalB,WAAWC,qBAC9B,gBAAeiB,UAAW"}
@@ -1,2 +0,0 @@
1
- import*as React from"react";import{forwardRef}from"react";const IconProductOther=({title,titleId,...props},ref)=>React.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:46,height:48,fill:"none",viewBox:"0 0 46 48",ref:ref,"aria-labelledby":titleId,...props},title?React.createElement("title",{id:titleId},title):null,React.createElement("path",{stroke:"#03020D",strokeWidth:1.5,d:"M21 2.155a4 4 0 0 1 4 0l15.919 9.19a4 4 0 0 1 2 3.464v18.382a4 4 0 0 1-2 3.464L25 45.845a4 4 0 0 1-4 0l-15.919-9.19a4 4 0 0 1-2-3.464V14.809a4 4 0 0 1 2-3.464z"}),React.createElement("path",{fill:"#FF5416",d:"M24.063 29.21v-1.797c0-4.693 4.937-3.84 4.937-9.05C29 15.042 26.488 13 23.312 13c-1.703 0-3.493.67-5.312 1.493v2.62l5.14-1.858c2.193 0 3.55 1.31 3.55 3.2 0 3.686-4.995 3.077-4.735 8.866l.087 1.89zm.635 5.79v-3.352h-3.233V35z"}));const ForwardRef=forwardRef(IconProductOther);export default ForwardRef;
2
- //# sourceMappingURL=icon-product-other.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../../src/core/Icon/components/icon-product-other.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { SVGProps } from \"react\";\nimport { Ref, forwardRef } from \"react\";\ninterface SVGRProps {\n title?: string;\n titleId?: string;\n}\nconst IconProductOther = ({\n title,\n titleId,\n ...props\n}: SVGProps<SVGSVGElement> & SVGRProps, ref: Ref<SVGSVGElement>) => <svg xmlns=\"http://www.w3.org/2000/svg\" width={46} height={48} fill=\"none\" viewBox=\"0 0 46 48\" ref={ref} aria-labelledby={titleId} {...props}>{title ? <title id={titleId}>{title}</title> : null}<path stroke=\"#03020D\" strokeWidth={1.5} d=\"M21 2.155a4 4 0 0 1 4 0l15.919 9.19a4 4 0 0 1 2 3.464v18.382a4 4 0 0 1-2 3.464L25 45.845a4 4 0 0 1-4 0l-15.919-9.19a4 4 0 0 1-2-3.464V14.809a4 4 0 0 1 2-3.464z\" /><path fill=\"#FF5416\" d=\"M24.063 29.21v-1.797c0-4.693 4.937-3.84 4.937-9.05C29 15.042 26.488 13 23.312 13c-1.703 0-3.493.67-5.312 1.493v2.62l5.14-1.858c2.193 0 3.55 1.31 3.55 3.2 0 3.686-4.995 3.077-4.735 8.866l.087 1.89zm.635 5.79v-3.352h-3.233V35z\" /></svg>;\nconst ForwardRef = forwardRef(IconProductOther);\nexport default ForwardRef;"],"names":["React","forwardRef","IconProductOther","title","titleId","props","ref","svg","xmlns","width","height","fill","viewBox","aria-labelledby","id","path","stroke","strokeWidth","d","ForwardRef"],"mappings":"AAAA,UAAYA,UAAW,OAAQ,AAE/B,QAAcC,UAAU,KAAQ,OAAQ,CAKxC,MAAMC,iBAAmB,CAAC,CACxBC,KAAK,CACLC,OAAO,CACP,GAAGC,MACiC,CAAEC,MAA4B,oBAACC,OAAIC,MAAM,6BAA6BC,MAAO,GAAIC,OAAQ,GAAIC,KAAK,OAAOC,QAAQ,YAAYN,IAAKA,IAAKO,kBAAiBT,QAAU,GAAGC,KAAK,EAAGF,MAAQ,oBAACA,SAAMW,GAAIV,SAAUD,OAAiB,KAAK,oBAACY,QAAKC,OAAO,UAAUC,YAAa,IAAKC,EAAE,oKAAoK,oBAACH,QAAKJ,KAAK,UAAUO,EAAE,sOAC5e,MAAMC,WAAalB,WAAWC,iBAC9B,gBAAeiB,UAAW"}