zudoku 0.54.1 → 0.54.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (80) hide show
  1. package/dist/app/main.d.ts +1 -1
  2. package/dist/app/main.js +1 -3
  3. package/dist/app/main.js.map +1 -1
  4. package/dist/config/validators/NavigationSchema.js +4 -2
  5. package/dist/config/validators/NavigationSchema.js.map +1 -1
  6. package/dist/flat-config.d.ts +1 -1
  7. package/dist/lib/components/BuildCheck.d.ts +2 -1
  8. package/dist/lib/components/BuildCheck.js +2 -3
  9. package/dist/lib/components/BuildCheck.js.map +1 -1
  10. package/dist/lib/components/index.d.ts +2 -1
  11. package/dist/lib/shiki.d.ts +4 -0
  12. package/dist/lib/shiki.js +2 -0
  13. package/dist/lib/shiki.js.map +1 -1
  14. package/dist/lib/ui/CodeBlock.js +30 -4
  15. package/dist/lib/ui/CodeBlock.js.map +1 -1
  16. package/dist/vite/config.js +6 -1
  17. package/dist/vite/config.js.map +1 -1
  18. package/dist/vite/plugin-config.d.ts +1 -1
  19. package/dist/vite/plugin-config.js +2 -1
  20. package/dist/vite/plugin-config.js.map +1 -1
  21. package/dist/vite/plugin-docs.js +9 -11
  22. package/dist/vite/plugin-docs.js.map +1 -1
  23. package/lib/CodeBlock-NFCmSWOK.js +98 -0
  24. package/lib/CodeBlock-NFCmSWOK.js.map +1 -0
  25. package/lib/{MdxPage-Bsko6_kb.js → MdxPage-C6Ru5mfp.js} +5 -5
  26. package/lib/{MdxPage-Bsko6_kb.js.map → MdxPage-C6Ru5mfp.js.map} +1 -1
  27. package/lib/{OAuthErrorPage-DJzGiIBt.js → OAuthErrorPage-Dd0fl6Lh.js} +4 -4
  28. package/lib/{OAuthErrorPage-DJzGiIBt.js.map → OAuthErrorPage-Dd0fl6Lh.js.map} +1 -1
  29. package/lib/{OasProvider-DQQRt3oS.js → OasProvider-DNmLItHj.js} +2 -2
  30. package/lib/{OasProvider-DQQRt3oS.js.map → OasProvider-DNmLItHj.js.map} +1 -1
  31. package/lib/{OperationList-DpmkHf26.js → OperationList-BE_BNejn.js} +8 -8
  32. package/lib/{OperationList-DpmkHf26.js.map → OperationList-BE_BNejn.js.map} +1 -1
  33. package/lib/{Pagination-kqFNgtnI.js → Pagination-29CJ3c2k.js} +2 -2
  34. package/lib/{Pagination-kqFNgtnI.js.map → Pagination-29CJ3c2k.js.map} +1 -1
  35. package/lib/{SchemaList-DS-pMd6B.js → SchemaList-BTkZiol0.js} +6 -6
  36. package/lib/{SchemaList-DS-pMd6B.js.map → SchemaList-BTkZiol0.js.map} +1 -1
  37. package/lib/{SchemaView-BnN6WHjw.js → SchemaView-Bc5_uIbh.js} +4 -4
  38. package/lib/{SchemaView-BnN6WHjw.js.map → SchemaView-Bc5_uIbh.js.map} +1 -1
  39. package/lib/{Select-BmTTKNPp.js → Select-DVKfV8Vb.js} +2 -2
  40. package/lib/{Select-BmTTKNPp.js.map → Select-DVKfV8Vb.js.map} +1 -1
  41. package/lib/{SignUp-BwOSCD-6.js → SignUp-DUmbxjcy.js} +2 -2
  42. package/lib/{SignUp-BwOSCD-6.js.map → SignUp-DUmbxjcy.js.map} +1 -1
  43. package/lib/{Slot-DAyXieeZ.js → Slot-BahfuM5e.js} +137 -124
  44. package/lib/{Slot-DAyXieeZ.js.map → Slot-BahfuM5e.js.map} +1 -1
  45. package/lib/{SyntaxHighlight-BMKR4pl6.js → SyntaxHighlight-BaPoOBLD.js} +112 -110
  46. package/lib/{SyntaxHighlight-BMKR4pl6.js.map → SyntaxHighlight-BaPoOBLD.js.map} +1 -1
  47. package/lib/{Toc-BKDRCQzU.js → Toc-MF9YxB9B.js} +2 -2
  48. package/lib/{Toc-BKDRCQzU.js.map → Toc-MF9YxB9B.js.map} +1 -1
  49. package/lib/{circular-8GWQDvCW.js → circular-Bv1c2Yd3.js} +2 -2
  50. package/lib/{circular-8GWQDvCW.js.map → circular-Bv1c2Yd3.js.map} +1 -1
  51. package/lib/{createServer-BsezSzvV.js → createServer-B4o75XI3.js} +4 -4
  52. package/lib/{createServer-BsezSzvV.js.map → createServer-B4o75XI3.js.map} +1 -1
  53. package/lib/{errors-Cs7hKmdL.js → errors-7Pb4eZXa.js} +2 -2
  54. package/lib/{errors-Cs7hKmdL.js.map → errors-7Pb4eZXa.js.map} +1 -1
  55. package/lib/hook-DbUCLQNg.js.map +1 -1
  56. package/lib/{index-A5Qdwj1B.js → index-BqrVgyZ3.js} +15 -14
  57. package/lib/{index-A5Qdwj1B.js.map → index-BqrVgyZ3.js.map} +1 -1
  58. package/lib/{index-Bg7Js3jB.js → index-D_weJvKR.js} +11 -11
  59. package/lib/{index-Bg7Js3jB.js.map → index-D_weJvKR.js.map} +1 -1
  60. package/lib/{index-BkW9tJ6j.js → index-fHJ5WmM5.js} +2 -2
  61. package/lib/{index-BkW9tJ6j.js.map → index-fHJ5WmM5.js.map} +1 -1
  62. package/lib/ui/CodeBlock.js +1 -1
  63. package/lib/ui/SyntaxHighlight.js +2 -2
  64. package/lib/zudoku.auth-azureb2c.js +3 -3
  65. package/lib/zudoku.auth-clerk.js +1 -1
  66. package/lib/zudoku.auth-openid.js +3 -3
  67. package/lib/zudoku.auth-supabase.js +1 -1
  68. package/lib/zudoku.components.js +2 -2
  69. package/lib/zudoku.plugin-api-catalog.js +3 -3
  70. package/lib/zudoku.plugin-api-keys.js +3 -3
  71. package/lib/zudoku.plugin-markdown.js +1 -1
  72. package/lib/zudoku.plugin-openapi.js +1 -1
  73. package/package.json +8 -8
  74. package/src/app/main.css +3 -7
  75. package/src/app/main.tsx +3 -6
  76. package/src/lib/components/BuildCheck.tsx +3 -3
  77. package/src/lib/shiki.ts +2 -0
  78. package/src/lib/ui/CodeBlock.tsx +38 -13
  79. package/lib/CodeBlock-B-G0eKtw.js +0 -85
  80. package/lib/CodeBlock-B-G0eKtw.js.map +0 -1
@@ -2,7 +2,7 @@ import "../jsx-runtime-C5mzlN2N.js";
2
2
  import "lucide-react";
3
3
  import "react";
4
4
  import "../cn-dYga0KKN.js";
5
- import { C as e } from "../CodeBlock-B-G0eKtw.js";
5
+ import { C as e } from "../CodeBlock-NFCmSWOK.js";
6
6
  export {
7
7
  e as CodeBlock
8
8
  };
@@ -1,9 +1,9 @@
1
1
  import "../jsx-runtime-C5mzlN2N.js";
2
2
  import "react";
3
3
  import "../ZudokuContext-CLl5w57E.js";
4
- import { S as h } from "../SyntaxHighlight-BMKR4pl6.js";
4
+ import { S as h } from "../SyntaxHighlight-BaPoOBLD.js";
5
5
  import "../invariant-Bm-FVUQE.js";
6
- import "../CodeBlock-B-G0eKtw.js";
6
+ import "../CodeBlock-NFCmSWOK.js";
7
7
  import "./EmbeddedCodeBlock.js";
8
8
  export {
9
9
  h as SyntaxHighlight
@@ -1,10 +1,10 @@
1
1
  import { j as o } from "./jsx-runtime-C5mzlN2N.js";
2
2
  import { PublicClientApplication as A, EventType as f } from "@azure/msal-browser";
3
- import { E as I } from "./index-A5Qdwj1B.js";
3
+ import { E as I } from "./index-BqrVgyZ3.js";
4
4
  import { C as T } from "./ClientOnly-E7hGysn1.js";
5
5
  import { j as S } from "./ZudokuContext-CLl5w57E.js";
6
- import { C, A as c } from "./errors-Cs7hKmdL.js";
7
- import { C as k, O as w } from "./OAuthErrorPage-DJzGiIBt.js";
6
+ import { C, A as c } from "./errors-7Pb4eZXa.js";
7
+ import { C as k, O as w } from "./OAuthErrorPage-Dd0fl6Lh.js";
8
8
  import { u as h } from "./hook-DbUCLQNg.js";
9
9
  const u = "/oauth/callback";
10
10
  class y extends C {
@@ -1,6 +1,6 @@
1
1
  import { j as l } from "./jsx-runtime-C5mzlN2N.js";
2
2
  import { LogOutIcon as f } from "lucide-react";
3
- import { S as w, a as p, b as v } from "./SignUp-BwOSCD-6.js";
3
+ import { S as w, a as p, b as v } from "./SignUp-DUmbxjcy.js";
4
4
  import { u as n } from "./hook-DbUCLQNg.js";
5
5
  const b = ({
6
6
  clerkPubKey: d,
@@ -1,10 +1,10 @@
1
1
  import { j as D } from "./jsx-runtime-C5mzlN2N.js";
2
2
  import { g as Le } from "./invariant-Bm-FVUQE.js";
3
- import { E as Ue } from "./index-A5Qdwj1B.js";
3
+ import { E as Ue } from "./index-BqrVgyZ3.js";
4
4
  import { C as xe } from "./ClientOnly-E7hGysn1.js";
5
5
  import { j as Ce } from "./ZudokuContext-CLl5w57E.js";
6
- import { C as Ie, O as re, A as R } from "./errors-Cs7hKmdL.js";
7
- import { C as je, O as Oe } from "./OAuthErrorPage-DJzGiIBt.js";
6
+ import { C as Ie, O as re, A as R } from "./errors-7Pb4eZXa.js";
7
+ import { C as je, O as Oe } from "./OAuthErrorPage-Dd0fl6Lh.js";
8
8
  import { u as S } from "./hook-DbUCLQNg.js";
9
9
  var J = { exports: {} }, De = J.exports, oe;
10
10
  function Je() {
@@ -1,5 +1,5 @@
1
1
  import { createClient as l } from "@supabase/supabase-js";
2
- import { C as g, A as p } from "./errors-Cs7hKmdL.js";
2
+ import { C as g, A as p } from "./errors-7Pb4eZXa.js";
3
3
  import { u as r } from "./hook-DbUCLQNg.js";
4
4
  class f extends g {
5
5
  client;
@@ -2,8 +2,8 @@ import "./RouteGuard-0wPUKdxJ.js";
2
2
  import "./index-Bm35Tkgf.js";
3
3
  import "./chunk-QMGIS6GS-CEOk3lro.js";
4
4
  import "./hook-DbUCLQNg.js";
5
- import "./Slot-DAyXieeZ.js";
6
- import { e as d, f as h, j as k, B as l, m as S, C as B, i as c, H as y, c as E, L as g, M as H, g as L, R as M, d as R, S as T, h as Z, T as f, Z as A, b, l as j, k as v, n as w, u as x } from "./index-A5Qdwj1B.js";
5
+ import "./Slot-BahfuM5e.js";
6
+ import { e as d, f as h, j as k, B as l, m as S, C as B, i as c, H as y, c as E, L as g, M as H, g as L, R as M, d as R, S as T, h as Z, T as f, Z as A, b, l as j, k as v, n as w, u as x } from "./index-BqrVgyZ3.js";
7
7
  import "./ui/Button.js";
8
8
  import "./ui/Callout.js";
9
9
  import "./ZudokuContext-CLl5w57E.js";
@@ -1,11 +1,11 @@
1
1
  import { j as t } from "./jsx-runtime-C5mzlN2N.js";
2
- import { s as f } from "./index-BkW9tJ6j.js";
2
+ import { s as f } from "./index-fHJ5WmM5.js";
3
3
  import { d as b, m as j } from "./chunk-QMGIS6GS-CEOk3lro.js";
4
4
  import { b as x, j as d } from "./ZudokuContext-CLl5w57E.js";
5
5
  import { H as v } from "./RouteGuard-0wPUKdxJ.js";
6
- import { L as y } from "./index-A5Qdwj1B.js";
6
+ import { L as y } from "./index-BqrVgyZ3.js";
7
7
  import { u as N } from "./hook-DbUCLQNg.js";
8
- import { H as k, M as S } from "./Slot-DAyXieeZ.js";
8
+ import { H as k, M as S } from "./Slot-BahfuM5e.js";
9
9
  const w = ({
10
10
  items: o,
11
11
  filterCatalogItems: r = (n) => n,
@@ -1,19 +1,19 @@
1
1
  import { j as e } from "./jsx-runtime-C5mzlN2N.js";
2
2
  import { CircleSlashIcon as F, CheckIcon as te, XIcon as ue, PencilLineIcon as he, RefreshCwIcon as fe, EyeOffIcon as pe, EyeIcon as me, CopyIcon as xe, TrashIcon as ye, KeyRoundIcon as ge } from "lucide-react";
3
- import { D as je, a as Y, R as Ce } from "./Slot-DAyXieeZ.js";
3
+ import { D as je, a as Y, R as Ce } from "./Slot-BahfuM5e.js";
4
4
  import { i as A } from "./invariant-Bm-FVUQE.js";
5
5
  import { O as ve, a as we, L as be } from "./chunk-QMGIS6GS-CEOk3lro.js";
6
6
  import { a as ke } from "./hook-DbUCLQNg.js";
7
7
  import { Button as x } from "./ui/Button.js";
8
8
  import { c as se, e as ne, b as Ne } from "./ZudokuContext-CLl5w57E.js";
9
- import { u as z, A as O, a as M, b as Ee, S as Ke, c as De, d as Ie, e as Pe, f as Ae, g as Z } from "./Select-BmTTKNPp.js";
9
+ import { u as z, A as O, a as M, b as Ee, S as Ke, c as De, d as Ie, e as Pe, f as Ae, g as Z } from "./Select-DVKfV8Vb.js";
10
10
  import * as _ from "react";
11
11
  import Re, { createContext as G, useRef as D, useLayoutEffect as Se, useEffect as ie, useId as J, useContext as U, useInsertionEffect as Te, useMemo as L, useCallback as ze, Children as Oe, isValidElement as Me, useState as K, forwardRef as qe } from "react";
12
12
  import { C as Fe, a as Le } from "./Card-CMDQUPM4.js";
13
13
  import { e as W, f as I, D as $, g as Q, a as B, c as H, b as V, d as re } from "./Dialog-u9Uz9sTt.js";
14
14
  import { Input as ae } from "./ui/Input.js";
15
15
  import { c as N } from "./cn-dYga0KKN.js";
16
- import { u as $e } from "./CodeBlock-B-G0eKtw.js";
16
+ import { u as $e } from "./CodeBlock-NFCmSWOK.js";
17
17
  import { a as Qe } from "./index.esm-CdzlRw50.js";
18
18
  import { B as Be } from "./Button-B3o-2Xdf.js";
19
19
  import { S as He } from "./Spinner-mNLZ6awP.js";
@@ -4,7 +4,7 @@ const m = (t) => ({
4
4
  ([e, n]) => ({
5
5
  path: e,
6
6
  lazy: async () => {
7
- const { MdxPage: o } = await import("./MdxPage-Bsko6_kb.js"), { default: a, ...r } = await n();
7
+ const { MdxPage: o } = await import("./MdxPage-C6Ru5mfp.js"), { default: a, ...r } = await n();
8
8
  return {
9
9
  element: /* @__PURE__ */ s.jsx(
10
10
  o,
@@ -4,7 +4,7 @@ import "./chunk-QMGIS6GS-CEOk3lro.js";
4
4
  import "./hook-DbUCLQNg.js";
5
5
  import "./ui/Button.js";
6
6
  import "./ZudokuContext-CLl5w57E.js";
7
- import { y as n, U as s, z as A } from "./index-Bg7Js3jB.js";
7
+ import { y as n, U as s, z as A } from "./index-D_weJvKR.js";
8
8
  export {
9
9
  n as GetNavigationOperationsQuery,
10
10
  s as UNTAGGED_PATH,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "zudoku",
3
- "version": "0.54.1",
3
+ "version": "0.54.3",
4
4
  "type": "module",
5
5
  "homepage": "https://zudoku.dev",
6
6
  "repository": {
@@ -164,10 +164,10 @@
164
164
  "@radix-ui/react-visually-hidden": "1.2.3",
165
165
  "@scalar/openapi-parser": "0.18.0",
166
166
  "@sentry/node": "9.26.0",
167
- "@shikijs/langs": "3.7.0",
168
- "@shikijs/rehype": "3.7.0",
169
- "@shikijs/themes": "3.7.0",
170
- "@shikijs/transformers": "3.7.0",
167
+ "@shikijs/langs": "3.8.0",
168
+ "@shikijs/rehype": "3.8.0",
169
+ "@shikijs/themes": "3.8.0",
170
+ "@shikijs/transformers": "3.8.0",
171
171
  "@sindresorhus/slugify": "2.2.1",
172
172
  "@stefanprobst/rehype-extract-toc": "3.0.0",
173
173
  "@tailwindcss/typography": "0.5.16",
@@ -234,7 +234,7 @@
234
234
  "remark-rehype": "^11.1.2",
235
235
  "rollup": "4.45.0",
236
236
  "semver": "7.7.2",
237
- "shiki": "3.7.0",
237
+ "shiki": "3.8.0",
238
238
  "sitemap": "8.0.0",
239
239
  "spin-delay": "2.0.1",
240
240
  "strip-ansi": "7.1.0",
@@ -250,7 +250,7 @@
250
250
  "yargs": "18.0.0",
251
251
  "zod": "3.25.74",
252
252
  "zod-to-ts": "1.2.0",
253
- "zustand": "5.0.5"
253
+ "zustand": "5.0.6"
254
254
  },
255
255
  "devDependencies": {
256
256
  "@graphql-codegen/cli": "5.0.7",
@@ -274,7 +274,7 @@
274
274
  "@types/unist": "^3.0.3",
275
275
  "@types/yargs": "17.0.33",
276
276
  "@vitest/coverage-v8": "3.2.1",
277
- "esbuild": "0.25.1",
277
+ "esbuild": "0.25.6",
278
278
  "happy-dom": "18.0.1",
279
279
  "mdast-util-mdx": "3.0.0",
280
280
  "react": "19.1.0",
package/src/app/main.css CHANGED
@@ -166,14 +166,10 @@
166
166
  @apply bg-(--highlighted-bg) relative;
167
167
  }
168
168
 
169
- .shiki .line.highlighted:before {
170
- position: absolute;
171
- inset-inline-start: 0;
172
- inset-block-start: 0;
173
- inset-block-end: 0;
174
- border-left: 2px solid
169
+ .shiki .line.highlighted::after {
170
+ @apply absolute left-0 top-0 bottom-0 right-auto translate-x-full content-[''];
171
+ border-left: 3px solid
175
172
  hsl(from var(--highlighted-bg) h s calc(l + 4 * var(--dark)));
176
- content: "";
177
173
  }
178
174
 
179
175
  .shiki .highlighted-word {
package/src/app/main.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { type RouteObject } from "react-router";
1
+ import type { RouteObject } from "react-router";
2
2
  import { configuredApiKeysPlugin } from "virtual:zudoku-api-keys-plugin";
3
3
  import {
4
4
  configuredApiCatalogPlugins,
@@ -107,11 +107,8 @@ export const getRoutesByConfig = (config: ZudokuConfig): RouteObject[] => {
107
107
  element: (
108
108
  <Zudoku {...options}>
109
109
  <BuildCheck
110
- buildId={
111
- import.meta.env.IS_ZUPLO && import.meta.env.ZUPLO_BUILD_ID
112
- ? import.meta.env.ZUPLO_BUILD_ID
113
- : undefined
114
- }
110
+ buildId={import.meta.env.ZUPLO_BUILD_ID}
111
+ environmentType={import.meta.env.ZUPLO_ENVIRONMENT_TYPE}
115
112
  />
116
113
  <Layout />
117
114
  </Zudoku>
@@ -11,17 +11,17 @@ const BuildStatusSchema = z.object({
11
11
 
12
12
  export const BuildCheck = ({
13
13
  buildId,
14
+ environmentType,
14
15
  endpoint = "/__zuplo/docs",
15
16
  }: {
16
17
  buildId?: string;
18
+ environmentType?: string;
17
19
  endpoint?: string;
18
20
  }) => {
19
21
  const buildStatusQuery = useQuery({
20
22
  queryKey: ["zuplo-build-check", buildId, endpoint],
21
23
  refetchInterval: 3000,
22
- enabled:
23
- typeof buildId !== "undefined" &&
24
- import.meta.env.ZUPLO_ENVIRONMENT_TYPE === "WORKING_COPY",
24
+ enabled: buildId !== undefined && environmentType === "WORKING_COPY",
25
25
  retry: false,
26
26
  queryFn: () =>
27
27
  fetch(endpoint, { signal: AbortSignal.timeout(2000) })
package/src/lib/shiki.ts CHANGED
@@ -43,6 +43,8 @@ export const defaultHighlightOptions = {
43
43
  dark: "github-dark",
44
44
  },
45
45
  defaultColor: false,
46
+ defaultLanguage: "text",
47
+ fallbackLanguage: "text",
46
48
  inline: "tailing-curly-colon",
47
49
  addLanguageClass: true,
48
50
  transformers: [transformerMetaHighlight(), transformerMetaWordHighlight()],
@@ -18,12 +18,41 @@ export type CodeBlockProps = {
18
18
  showLineNumbers?: boolean;
19
19
  };
20
20
 
21
+ const IconToLanguageMap: Record<string, RegExp> = {
22
+ typescript: /(tsx?|typescript)/,
23
+ javascript: /(jsx?|javascript)/,
24
+ markdown: /(md|markdown)/,
25
+ mdx: /(mdx)/,
26
+ json: /(json)/,
27
+ yaml: /(yaml)/,
28
+ toml: /(toml)/,
29
+ bash: /(shell|bash|sh|zsh)/,
30
+ python: /(py|python)/,
31
+ dotnet: /(cs|csharp|vb)/,
32
+ rust: /(rs|rust)/,
33
+ ruby: /(rb|ruby)/,
34
+ php: /php/,
35
+ html: /html?/,
36
+ css: /css/,
37
+ };
38
+
39
+ const getIconUrl = (language?: string) => {
40
+ if (!language) return undefined;
41
+
42
+ const icon = Object.entries(IconToLanguageMap).find(([_, regex]) =>
43
+ regex.test(language),
44
+ );
45
+ return icon
46
+ ? `https://cdn.simpleicons.org/${icon[0]}/000/fff?viewbox=auto`
47
+ : undefined;
48
+ };
49
+
21
50
  export const CodeBlock = ({
22
51
  children,
23
52
  title = "Code",
24
53
  language,
25
54
  showCopy = "hover",
26
- showLanguageIndicator = false,
55
+ showLanguageIndicator,
27
56
  showLineNumbers,
28
57
  ...props
29
58
  }: CodeBlockProps) => {
@@ -32,6 +61,8 @@ export const CodeBlock = ({
32
61
 
33
62
  if (!children) return null;
34
63
 
64
+ const iconUrl = showLanguageIndicator ? getIconUrl(language) : undefined;
65
+
35
66
  return (
36
67
  <div
37
68
  className={cn(
@@ -40,11 +71,9 @@ export const CodeBlock = ({
40
71
  )}
41
72
  >
42
73
  <div className="border-b flex items-center h-10 font-sans bg-black/2">
43
- <div className="flex-1 text-sm w-full px-4">
74
+ <div className="flex items-center gap-2 flex-1 text-sm w-full px-3">
75
+ {iconUrl && <img src={iconUrl} className="h-3 max-w-4" />}
44
76
  {title}
45
- {showLanguageIndicator && language && (
46
- <span className="text-muted-foreground ml-2">({language})</span>
47
- )}
48
77
  </div>{" "}
49
78
  {showCopy !== "never" && (
50
79
  <button
@@ -52,7 +81,8 @@ export const CodeBlock = ({
52
81
  aria-label="Copy code"
53
82
  title="Copy code"
54
83
  className={cn(
55
- "cursor:pointer h-full hover:border-l-border active:shadow-none active:inset-shadow-xs hover:inset-shadow-xs flex items-center gap-2 px-4 outline-border text-sm hover:bg-black/5 transition-all",
84
+ "transition px-2 py-2 mx-1 rounded-sm",
85
+ !isCopied && "hover:bg-accent hover:brightness-95",
56
86
  )}
57
87
  disabled={isCopied}
58
88
  onClick={() => {
@@ -62,12 +92,7 @@ export const CodeBlock = ({
62
92
  }}
63
93
  >
64
94
  {isCopied ? (
65
- <CheckIcon
66
- className="text-emerald-600"
67
- size={14}
68
- strokeWidth={2.5}
69
- absoluteStrokeWidth
70
- />
95
+ <CheckIcon className="text-emerald-600" size={14} />
71
96
  ) : (
72
97
  <CopyIcon size={14} />
73
98
  )}
@@ -76,7 +101,7 @@ export const CodeBlock = ({
76
101
  </div>
77
102
  <div
78
103
  className={cn(
79
- "code-block text-sm not-prose scrollbar overflow-x-auto scrollbar [&>code]:p-4",
104
+ "code-block text-sm not-prose scrollbar overflow-x-auto scrollbar [&>code]:p-3 [&>code]:py-2",
80
105
  props.className,
81
106
  )}
82
107
  ref={ref}
@@ -1,85 +0,0 @@
1
- import { j as e } from "./jsx-runtime-C5mzlN2N.js";
2
- import { CheckIcon as u, CopyIcon as m } from "lucide-react";
3
- import { useState as x, useCallback as b, useRef as f } from "react";
4
- import { c as n } from "./cn-dYga0KKN.js";
5
- const C = (o = 2e3) => {
6
- const [r, s] = x(!1), t = b(
7
- (l) => {
8
- navigator.clipboard.writeText(l), s(!0), setTimeout(() => s(!1), o);
9
- },
10
- [o]
11
- );
12
- return [r, t];
13
- }, w = ({
14
- children: o,
15
- title: r = "Code",
16
- language: s,
17
- showCopy: t = "hover",
18
- showLanguageIndicator: l = !1,
19
- showLineNumbers: c,
20
- ...d
21
- }) => {
22
- const [i, p] = C(), a = f(null);
23
- return o ? /* @__PURE__ */ e.jsxs(
24
- "div",
25
- {
26
- className: n(
27
- "border code-block-wrapper relative group bg-muted/50 rounded-md overflow-hidden",
28
- c && "line-numbers"
29
- ),
30
- children: [
31
- /* @__PURE__ */ e.jsxs("div", { className: "border-b flex items-center h-10 font-sans bg-black/2", children: [
32
- /* @__PURE__ */ e.jsxs("div", { className: "flex-1 text-sm w-full px-4", children: [
33
- r,
34
- l && s && /* @__PURE__ */ e.jsxs("span", { className: "text-muted-foreground ml-2", children: [
35
- "(",
36
- s,
37
- ")"
38
- ] })
39
- ] }),
40
- " ",
41
- t !== "never" && /* @__PURE__ */ e.jsx(
42
- "button",
43
- {
44
- type: "button",
45
- "aria-label": "Copy code",
46
- title: "Copy code",
47
- className: n(
48
- "cursor:pointer h-full hover:border-l-border active:shadow-none active:inset-shadow-xs hover:inset-shadow-xs flex items-center gap-2 px-4 outline-border text-sm hover:bg-black/5 transition-all"
49
- ),
50
- disabled: i,
51
- onClick: () => {
52
- a.current?.textContent && p(a.current.textContent);
53
- },
54
- children: i ? /* @__PURE__ */ e.jsx(
55
- u,
56
- {
57
- className: "text-emerald-600",
58
- size: 14,
59
- strokeWidth: 2.5,
60
- absoluteStrokeWidth: !0
61
- }
62
- ) : /* @__PURE__ */ e.jsx(m, { size: 14 })
63
- }
64
- )
65
- ] }),
66
- /* @__PURE__ */ e.jsx(
67
- "div",
68
- {
69
- className: n(
70
- "code-block text-sm not-prose scrollbar overflow-x-auto scrollbar [&>code]:p-4",
71
- d.className
72
- ),
73
- ref: a,
74
- children: o
75
- }
76
- )
77
- ]
78
- }
79
- ) : null;
80
- };
81
- export {
82
- w as C,
83
- C as u
84
- };
85
- //# sourceMappingURL=CodeBlock-B-G0eKtw.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CodeBlock-B-G0eKtw.js","sources":["../src/lib/util/useCopyToClipboard.ts","../src/lib/ui/CodeBlock.tsx"],"sourcesContent":["import { useCallback, useState } from \"react\";\n\nexport const useCopyToClipboard = (timeout = 2000) => {\n const [isCopied, setIsCopied] = useState(false);\n\n const copyToClipboard = useCallback(\n (text: string) => {\n void navigator.clipboard.writeText(text);\n setIsCopied(true);\n\n setTimeout(() => setIsCopied(false), timeout);\n },\n [timeout],\n );\n\n return [isCopied, copyToClipboard] as const;\n};\n","import { CheckIcon, CopyIcon } from \"lucide-react\";\nimport type { ReactNode } from \"react\";\nimport { useRef } from \"react\";\nimport { cn } from \"../util/cn.js\";\nimport { useCopyToClipboard } from \"../util/useCopyToClipboard.js\";\n\nexport type CodeBlockProps = {\n className?: string;\n noBackground?: boolean;\n wrapLines?: boolean;\n showLanguageIndicator?: boolean;\n language?: string;\n title?: string;\n children?: ReactNode;\n code?: ReactNode;\n showCopy?: \"hover\" | \"always\" | \"never\";\n disabled?: boolean;\n showLineNumbers?: boolean;\n};\n\nexport const CodeBlock = ({\n children,\n title = \"Code\",\n language,\n showCopy = \"hover\",\n showLanguageIndicator = false,\n showLineNumbers,\n ...props\n}: CodeBlockProps) => {\n const [isCopied, copyToClipboard] = useCopyToClipboard();\n const ref = useRef<HTMLDivElement>(null);\n\n if (!children) return null;\n\n return (\n <div\n className={cn(\n \"border code-block-wrapper relative group bg-muted/50 rounded-md overflow-hidden\",\n showLineNumbers && \"line-numbers\",\n )}\n >\n <div className=\"border-b flex items-center h-10 font-sans bg-black/2\">\n <div className=\"flex-1 text-sm w-full px-4\">\n {title}\n {showLanguageIndicator && language && (\n <span className=\"text-muted-foreground ml-2\">({language})</span>\n )}\n </div>{\" \"}\n {showCopy !== \"never\" && (\n <button\n type=\"button\"\n aria-label=\"Copy code\"\n title=\"Copy code\"\n className={cn(\n \"cursor:pointer h-full hover:border-l-border active:shadow-none active:inset-shadow-xs hover:inset-shadow-xs flex items-center gap-2 px-4 outline-border text-sm hover:bg-black/5 transition-all\",\n )}\n disabled={isCopied}\n onClick={() => {\n if (!ref.current?.textContent) return;\n\n copyToClipboard(ref.current.textContent);\n }}\n >\n {isCopied ? (\n <CheckIcon\n className=\"text-emerald-600\"\n size={14}\n strokeWidth={2.5}\n absoluteStrokeWidth\n />\n ) : (\n <CopyIcon size={14} />\n )}\n </button>\n )}\n </div>\n <div\n className={cn(\n \"code-block text-sm not-prose scrollbar overflow-x-auto scrollbar [&>code]:p-4\",\n props.className,\n )}\n ref={ref}\n >\n {children}\n </div>\n </div>\n );\n};\n"],"names":["useCopyToClipboard","timeout","isCopied","setIsCopied","useState","copyToClipboard","useCallback","text","CodeBlock","children","title","language","showCopy","showLanguageIndicator","showLineNumbers","props","ref","useRef","jsxs","cn","jsx","CheckIcon","CopyIcon"],"mappings":";;;;AAEO,MAAMA,IAAqB,CAACC,IAAU,QAAS;AACpD,QAAM,CAACC,GAAUC,CAAW,IAAIC,EAAS,EAAK,GAExCC,IAAkBC;AAAA,IACtB,CAACC,MAAiB;AAChB,MAAK,UAAU,UAAU,UAAUA,CAAI,GACvCJ,EAAY,EAAI,GAEhB,WAAW,MAAMA,EAAY,EAAK,GAAGF,CAAO;AAAA,IAC9C;AAAA,IACA,CAACA,CAAO;AAAA,EAAA;AAGV,SAAO,CAACC,GAAUG,CAAe;AACnC,GCIaG,IAAY,CAAC;AAAA,EACxB,UAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,uBAAAC,IAAwB;AAAA,EACxB,iBAAAC;AAAA,EACA,GAAGC;AACL,MAAsB;AACpB,QAAM,CAACb,GAAUG,CAAe,IAAIL,EAAA,GAC9BgB,IAAMC,EAAuB,IAAI;AAEvC,SAAKR,IAGHS,gBAAAA,EAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAL,KAAmB;AAAA,MAAA;AAAA,MAGrB,UAAA;AAAA,QAAAI,gBAAAA,EAAAA,KAAC,OAAA,EAAI,WAAU,wDACb,UAAA;AAAA,UAAAA,gBAAAA,EAAAA,KAAC,OAAA,EAAI,WAAU,8BACZ,UAAA;AAAA,YAAAR;AAAA,YACAG,KAAyBF,KACxBO,gBAAAA,OAAC,QAAA,EAAK,WAAU,8BAA6B,UAAA;AAAA,cAAA;AAAA,cAAEP;AAAA,cAAS;AAAA,YAAA,EAAA,CAAC;AAAA,UAAA,GAE7D;AAAA,UAAO;AAAA,UACNC,MAAa,WACZQ,gBAAAA,EAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,cAAW;AAAA,cACX,OAAM;AAAA,cACN,WAAWD;AAAA,gBACT;AAAA,cAAA;AAAA,cAEF,UAAUjB;AAAA,cACV,SAAS,MAAM;AACb,gBAAKc,EAAI,SAAS,eAElBX,EAAgBW,EAAI,QAAQ,WAAW;AAAA,cACzC;AAAA,cAEC,UAAAd,IACCkB,gBAAAA,EAAAA;AAAAA,gBAACC;AAAA,gBAAA;AAAA,kBACC,WAAU;AAAA,kBACV,MAAM;AAAA,kBACN,aAAa;AAAA,kBACb,qBAAmB;AAAA,gBAAA;AAAA,cAAA,IAGrBD,gBAAAA,MAACE,GAAA,EAAS,MAAM,GAAA,CAAI;AAAA,YAAA;AAAA,UAAA;AAAA,QAExB,GAEJ;AAAA,QACAF,gBAAAA,EAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWD;AAAA,cACT;AAAA,cACAJ,EAAM;AAAA,YAAA;AAAA,YAER,KAAAC;AAAA,YAEC,UAAAP;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA,IApDkB;AAuDxB;"}