@dxos/react-ui-syntax-highlighter 0.6.12 → 0.6.13-main.548ca8d

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.
@@ -1,6 +1,6 @@
1
1
  // packages/ui/react-ui-syntax-highlighter/src/SyntaxHighlighter.tsx
2
2
  import React from "react";
3
- import NativeSyntaxHighlighter from "react-syntax-highlighter";
3
+ import NativeSyntaxHighlighter from "react-syntax-highlighter/dist/esm/light-async";
4
4
  import styleDark from "react-syntax-highlighter/dist/esm/styles/hljs/a11y-dark";
5
5
  import styleLight from "react-syntax-highlighter/dist/esm/styles/hljs/a11y-light";
6
6
  import { useThemeContext } from "@dxos/react-ui";
@@ -10,7 +10,7 @@ var SyntaxHighlighter = ({ classNames, fallback = zeroWidthSpace, children, ...p
10
10
  const { themeMode } = useThemeContext();
11
11
  return /* @__PURE__ */ React.createElement("div", {
12
12
  role: "none",
13
- className: mx("w-full", classNames)
13
+ className: mx(classNames)
14
14
  }, /* @__PURE__ */ React.createElement(NativeSyntaxHighlighter, {
15
15
  ...props,
16
16
  style: themeMode === "dark" ? styleDark : styleLight
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/SyntaxHighlighter.tsx"],
4
- "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport React from 'react';\nimport NativeSyntaxHighlighter, {\n type SyntaxHighlighterProps as NativeSyntaxHighlighterProps,\n} from 'react-syntax-highlighter';\n// eslint-disable-next-line no-restricted-imports\nimport styleDark from 'react-syntax-highlighter/dist/esm/styles/hljs/a11y-dark';\n// eslint-disable-next-line no-restricted-imports\nimport styleLight from 'react-syntax-highlighter/dist/esm/styles/hljs/a11y-light';\n\nimport { type ThemedClassName, useThemeContext } from '@dxos/react-ui';\nimport { mx } from '@dxos/react-ui-theme';\n\nconst zeroWidthSpace = '\\u200b';\n\nexport type SyntaxHighlighterProps = ThemedClassName<\n NativeSyntaxHighlighterProps & {\n fallback?: string;\n }\n>;\n\n/**\n * https://github.com/react-syntax-highlighter/react-syntax-highlighter\n */\nexport const SyntaxHighlighter = ({\n classNames,\n fallback = zeroWidthSpace,\n children,\n ...props\n}: SyntaxHighlighterProps) => {\n const { themeMode } = useThemeContext();\n return (\n <div role='none' className={mx('w-full', classNames)}>\n <NativeSyntaxHighlighter {...props} style={themeMode === 'dark' ? styleDark : styleLight}>\n {/* Non-empty fallback prevents collapse. */}\n {children || fallback}\n </NativeSyntaxHighlighter>\n </div>\n );\n};\n"],
5
- "mappings": ";AAIA,OAAOA,WAAW;AAClB,OAAOC,6BAEA;AAEP,OAAOC,eAAe;AAEtB,OAAOC,gBAAgB;AAEvB,SAA+BC,uBAAuB;AACtD,SAASC,UAAU;AAEnB,IAAMC,iBAAiB;AAWhB,IAAMC,oBAAoB,CAAC,EAChCC,YACAC,WAAWH,gBACXI,UACA,GAAGC,MAAAA,MACoB;AACvB,QAAM,EAAEC,UAAS,IAAKC,gBAAAA;AACtB,SACE,sBAAA,cAACC,OAAAA;IAAIC,MAAK;IAAOC,WAAWC,GAAG,UAAUT,UAAAA;KACvC,sBAAA,cAACU,yBAAAA;IAAyB,GAAGP;IAAOQ,OAAOP,cAAc,SAASQ,YAAYC;KAE3EX,YAAYD,QAAAA,CAAAA;AAIrB;",
4
+ "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport React from 'react';\nimport { type SyntaxHighlighterProps as NativeSyntaxHighlighterProps } from 'react-syntax-highlighter';\n// Lightweight version will load specific language parsers asynchronously.\n// Using `light-async` version directly from dist to avoid any chance of the heavy one being loaded.\n// eslint-disable-next-line no-restricted-imports\nimport NativeSyntaxHighlighter from 'react-syntax-highlighter/dist/esm/light-async';\n// eslint-disable-next-line no-restricted-imports\nimport styleDark from 'react-syntax-highlighter/dist/esm/styles/hljs/a11y-dark';\n// eslint-disable-next-line no-restricted-imports\nimport styleLight from 'react-syntax-highlighter/dist/esm/styles/hljs/a11y-light';\n\nimport { type ThemedClassName, useThemeContext } from '@dxos/react-ui';\nimport { mx } from '@dxos/react-ui-theme';\n\nconst zeroWidthSpace = '\\u200b';\n\nexport type SyntaxHighlighterProps = ThemedClassName<\n NativeSyntaxHighlighterProps & {\n fallback?: string;\n }\n>;\n\n/**\n * https://github.com/react-syntax-highlighter/react-syntax-highlighter\n */\nexport const SyntaxHighlighter = ({\n classNames,\n fallback = zeroWidthSpace,\n children,\n ...props\n}: SyntaxHighlighterProps) => {\n const { themeMode } = useThemeContext();\n return (\n <div role='none' className={mx(classNames)}>\n <NativeSyntaxHighlighter {...props} style={themeMode === 'dark' ? styleDark : styleLight}>\n {/* Non-empty fallback prevents collapse. */}\n {children || fallback}\n </NativeSyntaxHighlighter>\n </div>\n );\n};\n"],
5
+ "mappings": ";AAIA,OAAOA,WAAW;AAKlB,OAAOC,6BAA6B;AAEpC,OAAOC,eAAe;AAEtB,OAAOC,gBAAgB;AAEvB,SAA+BC,uBAAuB;AACtD,SAASC,UAAU;AAEnB,IAAMC,iBAAiB;AAWhB,IAAMC,oBAAoB,CAAC,EAChCC,YACAC,WAAWH,gBACXI,UACA,GAAGC,MAAAA,MACoB;AACvB,QAAM,EAAEC,UAAS,IAAKC,gBAAAA;AACtB,SACE,sBAAA,cAACC,OAAAA;IAAIC,MAAK;IAAOC,WAAWC,GAAGT,UAAAA;KAC7B,sBAAA,cAACU,yBAAAA;IAAyB,GAAGP;IAAOQ,OAAOP,cAAc,SAASQ,YAAYC;KAE3EX,YAAYD,QAAAA,CAAAA;AAIrB;",
6
6
  "names": ["React", "NativeSyntaxHighlighter", "styleDark", "styleLight", "useThemeContext", "mx", "zeroWidthSpace", "SyntaxHighlighter", "classNames", "fallback", "children", "props", "themeMode", "useThemeContext", "div", "role", "className", "mx", "NativeSyntaxHighlighter", "style", "styleDark", "styleLight"]
7
7
  }
@@ -1 +1 @@
1
- {"inputs":{"packages/ui/react-ui-syntax-highlighter/src/SyntaxHighlighter.tsx":{"bytes":4115,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"react-syntax-highlighter","kind":"import-statement","external":true},{"path":"react-syntax-highlighter/dist/esm/styles/hljs/a11y-dark","kind":"import-statement","external":true},{"path":"react-syntax-highlighter/dist/esm/styles/hljs/a11y-light","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-syntax-highlighter/src/index.ts":{"bytes":536,"imports":[{"path":"packages/ui/react-ui-syntax-highlighter/src/SyntaxHighlighter.tsx","kind":"import-statement","original":"./SyntaxHighlighter"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-syntax-highlighter/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":2165},"packages/ui/react-ui-syntax-highlighter/dist/lib/browser/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"react-syntax-highlighter","kind":"import-statement","external":true},{"path":"react-syntax-highlighter/dist/esm/styles/hljs/a11y-dark","kind":"import-statement","external":true},{"path":"react-syntax-highlighter/dist/esm/styles/hljs/a11y-light","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"exports":["SyntaxHighlighter"],"entryPoint":"packages/ui/react-ui-syntax-highlighter/src/index.ts","inputs":{"packages/ui/react-ui-syntax-highlighter/src/SyntaxHighlighter.tsx":{"bytesInOutput":798},"packages/ui/react-ui-syntax-highlighter/src/index.ts":{"bytesInOutput":0}},"bytes":934}}}
1
+ {"inputs":{"packages/ui/react-ui-syntax-highlighter/src/SyntaxHighlighter.tsx":{"bytes":4768,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"react-syntax-highlighter/dist/esm/light-async","kind":"import-statement","external":true},{"path":"react-syntax-highlighter/dist/esm/styles/hljs/a11y-dark","kind":"import-statement","external":true},{"path":"react-syntax-highlighter/dist/esm/styles/hljs/a11y-light","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-syntax-highlighter/src/index.ts":{"bytes":536,"imports":[{"path":"packages/ui/react-ui-syntax-highlighter/src/SyntaxHighlighter.tsx","kind":"import-statement","original":"./SyntaxHighlighter"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-syntax-highlighter/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":2437},"packages/ui/react-ui-syntax-highlighter/dist/lib/browser/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"react-syntax-highlighter/dist/esm/light-async","kind":"import-statement","external":true},{"path":"react-syntax-highlighter/dist/esm/styles/hljs/a11y-dark","kind":"import-statement","external":true},{"path":"react-syntax-highlighter/dist/esm/styles/hljs/a11y-light","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"exports":["SyntaxHighlighter"],"entryPoint":"packages/ui/react-ui-syntax-highlighter/src/index.ts","inputs":{"packages/ui/react-ui-syntax-highlighter/src/SyntaxHighlighter.tsx":{"bytesInOutput":809},"packages/ui/react-ui-syntax-highlighter/src/index.ts":{"bytesInOutput":0}},"bytes":945}}}
@@ -1 +1 @@
1
- {"version":3,"file":"SyntaxHighlighter.d.ts","sourceRoot":"","sources":["../../../src/SyntaxHighlighter.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAgC,EAC9B,KAAK,sBAAsB,IAAI,4BAA4B,EAC5D,MAAM,0BAA0B,CAAC;AAMlC,OAAO,EAAE,KAAK,eAAe,EAAmB,MAAM,gBAAgB,CAAC;AAKvE,MAAM,MAAM,sBAAsB,GAAG,eAAe,CAClD,4BAA4B,GAAG;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CACF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,iBAAiB,iDAK3B,sBAAsB,sBAUxB,CAAC"}
1
+ {"version":3,"file":"SyntaxHighlighter.d.ts","sourceRoot":"","sources":["../../../src/SyntaxHighlighter.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,sBAAsB,IAAI,4BAA4B,EAAE,MAAM,0BAA0B,CAAC;AAUvG,OAAO,EAAE,KAAK,eAAe,EAAmB,MAAM,gBAAgB,CAAC;AAKvE,MAAM,MAAM,sBAAsB,GAAG,eAAe,CAClD,4BAA4B,GAAG;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CACF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,iBAAiB,iDAK3B,sBAAsB,sBAUxB,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dxos/react-ui-syntax-highlighter",
3
- "version": "0.6.12",
3
+ "version": "0.6.13-main.548ca8d",
4
4
  "description": "A syntax highlighter wrapper.",
5
5
  "homepage": "https://dxos.org",
6
6
  "bugs": "https://github.com/dxos/dxos/issues",
@@ -22,8 +22,8 @@
22
22
  ],
23
23
  "dependencies": {
24
24
  "react-syntax-highlighter": "^15.5.0",
25
- "@dxos/react-ui": "0.6.12",
26
- "@dxos/react-ui-theme": "0.6.12"
25
+ "@dxos/react-ui-theme": "0.6.13-main.548ca8d",
26
+ "@dxos/react-ui": "0.6.13-main.548ca8d"
27
27
  },
28
28
  "devDependencies": {
29
29
  "@types/react": "~18.2.0",
@@ -31,13 +31,13 @@
31
31
  "@types/react-syntax-highlighter": "^15.5.13",
32
32
  "react": "~18.2.0",
33
33
  "react-dom": "~18.2.0",
34
- "vite": "^5.3.4",
35
- "@dxos/react-ui-theme": "0.6.12",
36
- "@dxos/storybook-utils": "0.6.12"
34
+ "vite": "5.4.7",
35
+ "@dxos/react-ui-theme": "0.6.13-main.548ca8d",
36
+ "@dxos/storybook-utils": "0.6.13-main.548ca8d"
37
37
  },
38
38
  "peerDependencies": {
39
- "react": "^18.0.0",
40
- "react-dom": "^18.0.0"
39
+ "react": "~18.2.0",
40
+ "react-dom": "~18.2.0"
41
41
  },
42
42
  "publishConfig": {
43
43
  "access": "public"
@@ -3,9 +3,11 @@
3
3
  //
4
4
 
5
5
  import React from 'react';
6
- import NativeSyntaxHighlighter, {
7
- type SyntaxHighlighterProps as NativeSyntaxHighlighterProps,
8
- } from 'react-syntax-highlighter';
6
+ import { type SyntaxHighlighterProps as NativeSyntaxHighlighterProps } from 'react-syntax-highlighter';
7
+ // Lightweight version will load specific language parsers asynchronously.
8
+ // Using `light-async` version directly from dist to avoid any chance of the heavy one being loaded.
9
+ // eslint-disable-next-line no-restricted-imports
10
+ import NativeSyntaxHighlighter from 'react-syntax-highlighter/dist/esm/light-async';
9
11
  // eslint-disable-next-line no-restricted-imports
10
12
  import styleDark from 'react-syntax-highlighter/dist/esm/styles/hljs/a11y-dark';
11
13
  // eslint-disable-next-line no-restricted-imports
@@ -33,7 +35,7 @@ export const SyntaxHighlighter = ({
33
35
  }: SyntaxHighlighterProps) => {
34
36
  const { themeMode } = useThemeContext();
35
37
  return (
36
- <div role='none' className={mx('w-full', classNames)}>
38
+ <div role='none' className={mx(classNames)}>
37
39
  <NativeSyntaxHighlighter {...props} style={themeMode === 'dark' ? styleDark : styleLight}>
38
40
  {/* Non-empty fallback prevents collapse. */}
39
41
  {children || fallback}
package/src/shims.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ //
2
+ // Copyright 2024 DXOS.org
3
+ //
4
+
5
+ declare module 'react-syntax-highlighter/dist/esm/light-async';
6
+ declare module 'react-syntax-highlighter/dist/esm/styles/hljs/a11y-dark';
7
+ declare module 'react-syntax-highlighter/dist/esm/styles/hljs/a11y-light';