@mantine/code-highlight 7.0.0-alpha.7 → 7.0.0-alpha.9

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 (79) hide show
  1. package/cjs/CodeHighlight.js +31 -103
  2. package/cjs/CodeHighlight.js.map +1 -1
  3. package/cjs/CodeHighlight.module.css.js +0 -1
  4. package/cjs/CodeHighlight.module.css.js.map +1 -1
  5. package/cjs/CodeHighlight.theme.module.css.js +0 -1
  6. package/cjs/CodeHighlight.theme.module.css.js.map +1 -1
  7. package/cjs/CodeHighlightTabs.js +60 -167
  8. package/cjs/CodeHighlightTabs.js.map +1 -1
  9. package/cjs/CopyIcon.js +9 -55
  10. package/cjs/CopyIcon.js.map +1 -1
  11. package/cjs/ExpandIcon.js +15 -68
  12. package/cjs/ExpandIcon.js.map +1 -1
  13. package/cjs/FileIcon.js +7 -8
  14. package/cjs/FileIcon.js.map +1 -1
  15. package/cjs/InlineCodeHighlight.js +19 -55
  16. package/cjs/InlineCodeHighlight.js.map +1 -1
  17. package/cjs/src/mantine-code-highlight/src/CodeHighlight.js +55 -0
  18. package/cjs/src/mantine-code-highlight/src/CodeHighlight.js.map +1 -0
  19. package/cjs/src/mantine-code-highlight/src/CodeHighlight.module.css.js +8 -0
  20. package/cjs/src/mantine-code-highlight/src/CodeHighlight.module.css.js.map +1 -0
  21. package/cjs/src/mantine-code-highlight/src/CodeHighlight.theme.module.css.js +8 -0
  22. package/cjs/src/mantine-code-highlight/src/CodeHighlight.theme.module.css.js.map +1 -0
  23. package/cjs/src/mantine-code-highlight/src/CodeHighlightTabs.js +90 -0
  24. package/cjs/src/mantine-code-highlight/src/CodeHighlightTabs.js.map +1 -0
  25. package/cjs/src/mantine-code-highlight/src/CopyIcon.js +25 -0
  26. package/cjs/src/mantine-code-highlight/src/CopyIcon.js.map +1 -0
  27. package/cjs/src/mantine-code-highlight/src/ExpandIcon.js +31 -0
  28. package/cjs/src/mantine-code-highlight/src/ExpandIcon.js.map +1 -0
  29. package/cjs/src/mantine-code-highlight/src/FileIcon.js +22 -0
  30. package/cjs/src/mantine-code-highlight/src/FileIcon.js.map +1 -0
  31. package/cjs/src/mantine-code-highlight/src/InlineCodeHighlight.js +43 -0
  32. package/cjs/src/mantine-code-highlight/src/InlineCodeHighlight.js.map +1 -0
  33. package/cjs/src/mantine-code-highlight/src/index.js +14 -0
  34. package/cjs/src/mantine-code-highlight/src/index.js.map +1 -0
  35. package/cjs/src/mantine-code-highlight/src/use-highlight.js +29 -0
  36. package/cjs/src/mantine-code-highlight/src/use-highlight.js.map +1 -0
  37. package/cjs/use-highlight.js +13 -12
  38. package/cjs/use-highlight.js.map +1 -1
  39. package/esm/CodeHighlight.js +31 -103
  40. package/esm/CodeHighlight.js.map +1 -1
  41. package/esm/CodeHighlight.module.css.js +0 -1
  42. package/esm/CodeHighlight.module.css.js.map +1 -1
  43. package/esm/CodeHighlight.theme.module.css.js +0 -1
  44. package/esm/CodeHighlight.theme.module.css.js.map +1 -1
  45. package/esm/CodeHighlightTabs.js +60 -167
  46. package/esm/CodeHighlightTabs.js.map +1 -1
  47. package/esm/CopyIcon.js +9 -55
  48. package/esm/CopyIcon.js.map +1 -1
  49. package/esm/ExpandIcon.js +15 -68
  50. package/esm/ExpandIcon.js.map +1 -1
  51. package/esm/FileIcon.js +7 -8
  52. package/esm/FileIcon.js.map +1 -1
  53. package/esm/InlineCodeHighlight.js +19 -55
  54. package/esm/InlineCodeHighlight.js.map +1 -1
  55. package/esm/src/mantine-code-highlight/src/CodeHighlight.js +46 -0
  56. package/esm/src/mantine-code-highlight/src/CodeHighlight.js.map +1 -0
  57. package/esm/src/mantine-code-highlight/src/CodeHighlight.module.css.js +4 -0
  58. package/esm/src/mantine-code-highlight/src/CodeHighlight.module.css.js.map +1 -0
  59. package/esm/src/mantine-code-highlight/src/CodeHighlight.theme.module.css.js +4 -0
  60. package/esm/src/mantine-code-highlight/src/CodeHighlight.theme.module.css.js.map +1 -0
  61. package/esm/src/mantine-code-highlight/src/CodeHighlightTabs.js +80 -0
  62. package/esm/src/mantine-code-highlight/src/CodeHighlightTabs.js.map +1 -0
  63. package/esm/src/mantine-code-highlight/src/CopyIcon.js +17 -0
  64. package/esm/src/mantine-code-highlight/src/CopyIcon.js.map +1 -0
  65. package/esm/src/mantine-code-highlight/src/ExpandIcon.js +23 -0
  66. package/esm/src/mantine-code-highlight/src/ExpandIcon.js.map +1 -0
  67. package/esm/src/mantine-code-highlight/src/FileIcon.js +14 -0
  68. package/esm/src/mantine-code-highlight/src/FileIcon.js.map +1 -0
  69. package/esm/src/mantine-code-highlight/src/InlineCodeHighlight.js +33 -0
  70. package/esm/src/mantine-code-highlight/src/InlineCodeHighlight.js.map +1 -0
  71. package/esm/src/mantine-code-highlight/src/index.js +4 -0
  72. package/esm/src/mantine-code-highlight/src/index.js.map +1 -0
  73. package/esm/src/mantine-code-highlight/src/use-highlight.js +21 -0
  74. package/esm/src/mantine-code-highlight/src/use-highlight.js.map +1 -0
  75. package/esm/use-highlight.js +13 -12
  76. package/esm/use-highlight.js.map +1 -1
  77. package/package.json +16 -8
  78. package/tsconfig.build.tsbuildinfo +1 -1
  79. package/styles.css +0 -327
@@ -0,0 +1,22 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var React = require('react');
6
+
7
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
8
+
9
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
10
+
11
+ function FileIcon({ fileIcon, fileName, getFileIcon }) {
12
+ if (fileIcon) {
13
+ return React__default.createElement(React__default.Fragment, null, fileIcon);
14
+ }
15
+ if (getFileIcon && fileName) {
16
+ return React__default.createElement(React__default.Fragment, null, getFileIcon(fileName));
17
+ }
18
+ return null;
19
+ }
20
+
21
+ exports.FileIcon = FileIcon;
22
+ //# sourceMappingURL=FileIcon.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FileIcon.js","sources":["../../../../src/FileIcon.tsx"],"sourcesContent":["import React from 'react';\n\ninterface FileIconProps {\n fileName: string | undefined;\n getFileIcon?: ((fileName: string) => React.ReactNode) | undefined;\n fileIcon: React.ReactNode | undefined;\n}\n\nexport function FileIcon({ fileIcon, fileName, getFileIcon }: FileIconProps) {\n if (fileIcon) {\n return <>{fileIcon}</>;\n }\n\n if (getFileIcon && fileName) {\n return <>{getFileIcon(fileName)}</>;\n }\n\n return null;\n}\n"],"names":["React"],"mappings":";;;;;;;;;;SAQgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAiB;IACzE,IAAI,QAAQ,EAAE;QACZ,OAAOA,4DAAG,QAAQ,CAAI,CAAC;KACxB;IAED,IAAI,WAAW,IAAI,QAAQ,EAAE;QAC3B,OAAOA,4DAAG,WAAW,CAAC,QAAQ,CAAC,CAAI,CAAC;KACrC;IAED,OAAO,IAAI,CAAC;AACd;;;;"}
@@ -0,0 +1,43 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var tslib_es6 = require('../../../node_modules/tslib/tslib.es6.js');
6
+ var React = require('react');
7
+ var cx = require('clsx');
8
+ var core = require('@mantine/core');
9
+ var hljs = require('highlight.js');
10
+ var CodeHighlight_module = require('./CodeHighlight.module.css.js');
11
+ var CodeHighlight_theme_module = require('./CodeHighlight.theme.module.css.js');
12
+
13
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
14
+
15
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
16
+ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
17
+ var hljs__default = /*#__PURE__*/_interopDefaultLegacy(hljs);
18
+
19
+ const classes = Object.assign(Object.assign({}, CodeHighlight_module['default']), { code: cx__default(CodeHighlight_module['default'].code, CodeHighlight_theme_module['default'].theme) });
20
+ const defaultProps = {
21
+ language: 'tsx',
22
+ };
23
+ const InlineCodeHighlight = core.factory((_props, ref) => {
24
+ const props = core.useProps('InlineCodeHighlight', defaultProps, _props);
25
+ const { classNames, className, style, styles, unstyled, vars, code, language } = props, others = tslib_es6.__rest(props, ["classNames", "className", "style", "styles", "unstyled", "vars", "code", "language"]);
26
+ const getStyles = core.useStyles({
27
+ name: 'InlineCodeHighlight',
28
+ props,
29
+ classes,
30
+ className,
31
+ style,
32
+ classNames,
33
+ styles,
34
+ unstyled,
35
+ rootSelector: 'code',
36
+ });
37
+ const highlighted = hljs__default.highlight(code.trim(), { language: language }).value;
38
+ return (React__default.createElement(core.Box, Object.assign({}, getStyles('code'), { component: "code", ref: ref }, others, { dangerouslySetInnerHTML: { __html: highlighted } })));
39
+ });
40
+ InlineCodeHighlight.displayName = '@mantine/core/InlineCodeHighlight';
41
+
42
+ exports.InlineCodeHighlight = InlineCodeHighlight;
43
+ //# sourceMappingURL=InlineCodeHighlight.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"InlineCodeHighlight.js","sources":["../../../../src/InlineCodeHighlight.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'clsx';\nimport {\n Box,\n BoxProps,\n StylesApiProps,\n factory,\n ElementProps,\n useProps,\n useStyles,\n Factory,\n} from '@mantine/core';\nimport hljs from 'highlight.js';\nimport _classes from './CodeHighlight.module.css';\nimport themeClasses from './CodeHighlight.theme.module.css';\n\nconst classes = { ..._classes, code: cx(_classes.code, themeClasses.theme) };\n\nexport type InlineCodeHighlightStylesNames = 'code';\nexport type InlineCodeHighlightVariant = string;\n\nexport interface InlineCodeHighlightProps\n extends BoxProps,\n StylesApiProps<InlineCodeHighlightFactory>,\n ElementProps<'div'> {\n /** Code to highlight */\n code: string;\n\n /** Code language, `'tsx'` by default */\n language?: string;\n}\n\nexport type InlineCodeHighlightFactory = Factory<{\n props: InlineCodeHighlightProps;\n ref: HTMLElement;\n stylesNames: InlineCodeHighlightStylesNames;\n}>;\n\nconst defaultProps: Partial<InlineCodeHighlightProps> = {\n language: 'tsx',\n};\n\nexport const InlineCodeHighlight = factory<InlineCodeHighlightFactory>((_props, ref) => {\n const props = useProps('InlineCodeHighlight', defaultProps, _props);\n const { classNames, className, style, styles, unstyled, vars, code, language, ...others } = props;\n\n const getStyles = useStyles<InlineCodeHighlightFactory>({\n name: 'InlineCodeHighlight',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n rootSelector: 'code',\n });\n\n const highlighted = hljs.highlight(code.trim(), { language: language! }).value;\n\n return (\n <Box\n {...getStyles('code')}\n component=\"code\"\n ref={ref}\n {...others}\n dangerouslySetInnerHTML={{ __html: highlighted }}\n />\n );\n});\n\nInlineCodeHighlight.displayName = '@mantine/core/InlineCodeHighlight';\n"],"names":["_classes","cx","themeClasses","factory","useProps","useStyles","hljs","React","Box"],"mappings":";;;;;;;;;;;;;;;;;;AAgBA,MAAM,OAAO,mCAAQA,+BAAQ,KAAE,IAAI,EAAEC,WAAE,CAACD,+BAAQ,CAAC,IAAI,EAAEE,qCAAY,CAAC,KAAK,CAAC,GAAE,CAAC;AAsB7E,MAAM,YAAY,GAAsC;IACtD,QAAQ,EAAE,KAAK;CAChB,CAAC;MAEW,mBAAmB,GAAGC,YAAO,CAA6B,CAAC,MAAM,EAAE,GAAG;IACjF,MAAM,KAAK,GAAGC,aAAQ,CAAC,qBAAqB,EAAE,YAAY,EAAE,MAAM,CAAC,CAAC;IACpE,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,KAAgB,KAAK,EAAhB,MAAM,oBAAK,KAAK,EAA3F,sFAAmF,CAAQ,CAAC;IAElG,MAAM,SAAS,GAAGC,cAAS,CAA6B;QACtD,IAAI,EAAE,qBAAqB;QAC3B,KAAK;QACL,OAAO;QACP,SAAS;QACT,KAAK;QACL,UAAU;QACV,MAAM;QACN,QAAQ;QACR,YAAY,EAAE,MAAM;KACrB,CAAC,CAAC;IAEH,MAAM,WAAW,GAAGC,aAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAS,EAAE,CAAC,CAAC,KAAK,CAAC;IAE/E,QACEC,6BAACC,QAAG,oBACE,SAAS,CAAC,MAAM,CAAC,IACrB,SAAS,EAAC,MAAM,EAChB,GAAG,EAAE,GAAG,IACJ,MAAM,IACV,uBAAuB,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,IAChD,EACF;AACJ,CAAC,EAAE;AAEH,mBAAmB,CAAC,WAAW,GAAG,mCAAmC;;;;"}
@@ -0,0 +1,14 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var CodeHighlightTabs = require('./CodeHighlightTabs.js');
6
+ var CodeHighlight = require('./CodeHighlight.js');
7
+ var InlineCodeHighlight = require('./InlineCodeHighlight.js');
8
+
9
+
10
+
11
+ exports.CodeHighlightTabs = CodeHighlightTabs.CodeHighlightTabs;
12
+ exports.CodeHighlight = CodeHighlight.CodeHighlight;
13
+ exports.InlineCodeHighlight = InlineCodeHighlight.InlineCodeHighlight;
14
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
@@ -0,0 +1,29 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var React = require('react');
6
+ var hljs = require('highlight.js');
7
+
8
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
9
+
10
+ var hljs__default = /*#__PURE__*/_interopDefaultLegacy(hljs);
11
+
12
+ function useHighlight({ code, language, highlightOnClient }) {
13
+ const getHighlightedCode = () => hljs__default.highlight(code.trim(), { language: language }).value;
14
+ const [highlighted, setHighlighted] = React.useState(!highlightOnClient);
15
+ const [highlightedCode, setHighlightedCode] = React.useState(highlightOnClient ? code : getHighlightedCode());
16
+ const getCodeProps = () => highlighted
17
+ ? { dangerouslySetInnerHTML: { __html: highlightedCode } }
18
+ : { children: code.trim() };
19
+ React.useEffect(() => {
20
+ if (highlightOnClient) {
21
+ setHighlightedCode(getHighlightedCode());
22
+ setHighlighted(true);
23
+ }
24
+ }, []);
25
+ return getCodeProps;
26
+ }
27
+
28
+ exports.useHighlight = useHighlight;
29
+ //# sourceMappingURL=use-highlight.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-highlight.js","sources":["../../../../src/use-highlight.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport hljs from 'highlight.js';\n\ninterface UseHighlightInput {\n code: string;\n language: string;\n highlightOnClient: boolean | undefined;\n}\n\nexport function useHighlight({ code, language, highlightOnClient }: UseHighlightInput) {\n const getHighlightedCode = () => hljs.highlight(code.trim(), { language: language! }).value;\n const [highlighted, setHighlighted] = useState(!highlightOnClient);\n const [highlightedCode, setHighlightedCode] = useState(\n highlightOnClient ? code : getHighlightedCode()\n );\n\n const getCodeProps = () =>\n highlighted\n ? { dangerouslySetInnerHTML: { __html: highlightedCode } }\n : { children: code.trim() };\n\n useEffect(() => {\n if (highlightOnClient) {\n setHighlightedCode(getHighlightedCode());\n setHighlighted(true);\n }\n }, []);\n\n return getCodeProps;\n}\n"],"names":["hljs","useState","useEffect"],"mappings":";;;;;;;;;;;SASgB,YAAY,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,iBAAiB,EAAqB;IACnF,MAAM,kBAAkB,GAAG,MAAMA,aAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAS,EAAE,CAAC,CAAC,KAAK,CAAC;IAC5F,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAGC,cAAQ,CAAC,CAAC,iBAAiB,CAAC,CAAC;IACnE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAGA,cAAQ,CACpD,iBAAiB,GAAG,IAAI,GAAG,kBAAkB,EAAE,CAChD,CAAC;IAEF,MAAM,YAAY,GAAG,MACnB,WAAW;UACP,EAAE,uBAAuB,EAAE,EAAE,MAAM,EAAE,eAAe,EAAE,EAAE;UACxD,EAAE,QAAQ,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC;IAEhCC,eAAS,CAAC;QACR,IAAI,iBAAiB,EAAE;YACrB,kBAAkB,CAAC,kBAAkB,EAAE,CAAC,CAAC;YACzC,cAAc,CAAC,IAAI,CAAC,CAAC;SACtB;KACF,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,YAAY,CAAC;AACtB;;;;"}
@@ -1,4 +1,3 @@
1
- 'use client';
2
1
  'use strict';
3
2
 
4
3
  Object.defineProperty(exports, '__esModule', { value: true });
@@ -11,17 +10,19 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
11
10
  var hljs__default = /*#__PURE__*/_interopDefaultLegacy(hljs);
12
11
 
13
12
  function useHighlight({ code, language, highlightOnClient }) {
14
- const getHighlightedCode = () => hljs__default.highlight(code.trim(), { language }).value;
15
- const [highlighted, setHighlighted] = React.useState(!highlightOnClient);
16
- const [highlightedCode, setHighlightedCode] = React.useState(highlightOnClient ? code : getHighlightedCode());
17
- const getCodeProps = () => highlighted ? { dangerouslySetInnerHTML: { __html: highlightedCode } } : { children: code.trim() };
18
- React.useEffect(() => {
19
- if (highlightOnClient) {
20
- setHighlightedCode(getHighlightedCode());
21
- setHighlighted(true);
22
- }
23
- }, []);
24
- return getCodeProps;
13
+ const getHighlightedCode = () => hljs__default.highlight(code.trim(), { language: language }).value;
14
+ const [highlighted, setHighlighted] = React.useState(!highlightOnClient);
15
+ const [highlightedCode, setHighlightedCode] = React.useState(highlightOnClient ? code : getHighlightedCode());
16
+ const getCodeProps = () => highlighted
17
+ ? { dangerouslySetInnerHTML: { __html: highlightedCode } }
18
+ : { children: code.trim() };
19
+ React.useEffect(() => {
20
+ if (highlightOnClient) {
21
+ setHighlightedCode(getHighlightedCode());
22
+ setHighlighted(true);
23
+ }
24
+ }, []);
25
+ return getCodeProps;
25
26
  }
26
27
 
27
28
  exports.useHighlight = useHighlight;
@@ -1 +1 @@
1
- {"version":3,"file":"use-highlight.js","sources":["../src/use-highlight.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport hljs from 'highlight.js';\n\ninterface UseHighlightInput {\n code: string;\n language: string;\n highlightOnClient: boolean | undefined;\n}\n\nexport function useHighlight({ code, language, highlightOnClient }: UseHighlightInput) {\n const getHighlightedCode = () => hljs.highlight(code.trim(), { language: language! }).value;\n const [highlighted, setHighlighted] = useState(!highlightOnClient);\n const [highlightedCode, setHighlightedCode] = useState(\n highlightOnClient ? code : getHighlightedCode()\n );\n\n const getCodeProps = () =>\n highlighted\n ? { dangerouslySetInnerHTML: { __html: highlightedCode } }\n : { children: code.trim() };\n\n useEffect(() => {\n if (highlightOnClient) {\n setHighlightedCode(getHighlightedCode());\n setHighlighted(true);\n }\n }, []);\n\n return getCodeProps;\n}\n"],"names":["hljs","useState","useEffect"],"mappings":";;;;;;;;;;;;AAEO,SAAS,YAAY,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,iBAAiB,EAAE,EAAE;AACpE,EAAE,MAAM,kBAAkB,GAAG,MAAMA,aAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,CAAC,KAAK,CAAC;AACnF,EAAE,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAGC,cAAQ,CAAC,CAAC,iBAAiB,CAAC,CAAC;AACrE,EAAE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAGA,cAAQ,CAAC,iBAAiB,GAAG,IAAI,GAAG,kBAAkB,EAAE,CAAC,CAAC;AAC1G,EAAE,MAAM,YAAY,GAAG,MAAM,WAAW,GAAG,EAAE,uBAAuB,EAAE,EAAE,MAAM,EAAE,eAAe,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC;AAChI,EAAEC,eAAS,CAAC,MAAM;AAClB,IAAI,IAAI,iBAAiB,EAAE;AAC3B,MAAM,kBAAkB,CAAC,kBAAkB,EAAE,CAAC,CAAC;AAC/C,MAAM,cAAc,CAAC,IAAI,CAAC,CAAC;AAC3B,KAAK;AACL,GAAG,EAAE,EAAE,CAAC,CAAC;AACT,EAAE,OAAO,YAAY,CAAC;AACtB;;"}
1
+ {"version":3,"file":"use-highlight.js","sources":["../src/use-highlight.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport hljs from 'highlight.js';\n\ninterface UseHighlightInput {\n code: string;\n language: string;\n highlightOnClient: boolean | undefined;\n}\n\nexport function useHighlight({ code, language, highlightOnClient }: UseHighlightInput) {\n const getHighlightedCode = () => hljs.highlight(code.trim(), { language: language! }).value;\n const [highlighted, setHighlighted] = useState(!highlightOnClient);\n const [highlightedCode, setHighlightedCode] = useState(\n highlightOnClient ? code : getHighlightedCode()\n );\n\n const getCodeProps = () =>\n highlighted\n ? { dangerouslySetInnerHTML: { __html: highlightedCode } }\n : { children: code.trim() };\n\n useEffect(() => {\n if (highlightOnClient) {\n setHighlightedCode(getHighlightedCode());\n setHighlighted(true);\n }\n }, []);\n\n return getCodeProps;\n}\n"],"names":["hljs","useState","useEffect"],"mappings":";;;;;;;;;;;SASgB,YAAY,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,iBAAiB,EAAqB;IACnF,MAAM,kBAAkB,GAAG,MAAMA,aAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAS,EAAE,CAAC,CAAC,KAAK,CAAC;IAC5F,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAGC,cAAQ,CAAC,CAAC,iBAAiB,CAAC,CAAC;IACnE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAGA,cAAQ,CACpD,iBAAiB,GAAG,IAAI,GAAG,kBAAkB,EAAE,CAChD,CAAC;IAEF,MAAM,YAAY,GAAG,MACnB,WAAW;UACP,EAAE,uBAAuB,EAAE,EAAE,MAAM,EAAE,eAAe,EAAE,EAAE;UACxD,EAAE,QAAQ,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC;IAEhCC,eAAS,CAAC;QACR,IAAI,iBAAiB,EAAE;YACrB,kBAAkB,CAAC,kBAAkB,EAAE,CAAC,CAAC;YACzC,cAAc,CAAC,IAAI,CAAC,CAAC;SACtB;KACF,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,YAAY,CAAC;AACtB;;;;"}
@@ -1,4 +1,4 @@
1
- 'use client';
1
+ import { __rest } from 'tslib';
2
2
  import React from 'react';
3
3
  import cx from 'clsx';
4
4
  import { factory, useProps, useStyles, Box, CopyButton, Tooltip, ActionIcon, ScrollArea } from '@mantine/core';
@@ -7,112 +7,40 @@ import { CopyIcon } from './CopyIcon.js';
7
7
  import _classes from './CodeHighlight.module.css.js';
8
8
  import themeClasses from './CodeHighlight.theme.module.css.js';
9
9
 
10
- var __defProp = Object.defineProperty;
11
- var __defProps = Object.defineProperties;
12
- var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
13
- var __getOwnPropSymbols = Object.getOwnPropertySymbols;
14
- var __hasOwnProp = Object.prototype.hasOwnProperty;
15
- var __propIsEnum = Object.prototype.propertyIsEnumerable;
16
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
17
- var __spreadValues = (a, b) => {
18
- for (var prop in b || (b = {}))
19
- if (__hasOwnProp.call(b, prop))
20
- __defNormalProp(a, prop, b[prop]);
21
- if (__getOwnPropSymbols)
22
- for (var prop of __getOwnPropSymbols(b)) {
23
- if (__propIsEnum.call(b, prop))
24
- __defNormalProp(a, prop, b[prop]);
25
- }
26
- return a;
27
- };
28
- var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
29
- var __objRest = (source, exclude) => {
30
- var target = {};
31
- for (var prop in source)
32
- if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
33
- target[prop] = source[prop];
34
- if (source != null && __getOwnPropSymbols)
35
- for (var prop of __getOwnPropSymbols(source)) {
36
- if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
37
- target[prop] = source[prop];
38
- }
39
- return target;
40
- };
41
- const classes = __spreadProps(__spreadValues({}, _classes), { root: cx(_classes.root, themeClasses.theme) });
10
+ const classes = Object.assign(Object.assign({}, _classes), { root: cx(_classes.root, themeClasses.theme) });
42
11
  const defaultProps = {
43
- copyLabel: "Copy code",
44
- copiedLabel: "Copied",
45
- language: "tsx",
46
- withCopyButton: true
12
+ copyLabel: 'Copy code',
13
+ copiedLabel: 'Copied',
14
+ language: 'tsx',
15
+ withCopyButton: true,
47
16
  };
48
17
  const CodeHighlight = factory((_props, ref) => {
49
- const props = useProps("CodeHighlight", defaultProps, _props);
50
- const _a = props, {
51
- classNames,
52
- className,
53
- style,
54
- styles,
55
- unstyled,
56
- vars,
57
- children,
58
- code,
59
- copiedLabel,
60
- copyLabel,
61
- language,
62
- withCopyButton,
63
- highlightOnClient
64
- } = _a, others = __objRest(_a, [
65
- "classNames",
66
- "className",
67
- "style",
68
- "styles",
69
- "unstyled",
70
- "vars",
71
- "children",
72
- "code",
73
- "copiedLabel",
74
- "copyLabel",
75
- "language",
76
- "withCopyButton",
77
- "highlightOnClient"
78
- ]);
79
- const getStyles = useStyles({
80
- name: "CodeHighlight",
81
- props,
82
- classes,
83
- className,
84
- style,
85
- classNames,
86
- styles,
87
- unstyled
88
- });
89
- const getCodeProps = useHighlight({
90
- code,
91
- language,
92
- highlightOnClient
93
- });
94
- return /* @__PURE__ */ React.createElement(Box, __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, getStyles("root")), {
95
- ref
96
- }), others), {
97
- dir: "ltr"
98
- }), withCopyButton && /* @__PURE__ */ React.createElement(CopyButton, {
99
- value: code.trim()
100
- }, ({ copied, copy }) => /* @__PURE__ */ React.createElement(Tooltip, {
101
- label: copied ? copiedLabel : copyLabel,
102
- fz: "sm",
103
- position: "left"
104
- }, /* @__PURE__ */ React.createElement(ActionIcon, __spreadValues({
105
- onClick: copy,
106
- variant: "none"
107
- }, getStyles("copy")), /* @__PURE__ */ React.createElement(CopyIcon, {
108
- copied
109
- })))), /* @__PURE__ */ React.createElement(ScrollArea, {
110
- type: "auto",
111
- dir: "ltr",
112
- offsetScrollbars: false
113
- }, /* @__PURE__ */ React.createElement("pre", __spreadValues({}, getStyles("pre")), /* @__PURE__ */ React.createElement("code", __spreadValues(__spreadValues({}, getStyles("code")), getCodeProps())))));
18
+ const props = useProps('CodeHighlight', defaultProps, _props);
19
+ const { classNames, className, style, styles, unstyled, vars, children, code, copiedLabel, copyLabel, language, withCopyButton, highlightOnClient } = props, others = __rest(props, ["classNames", "className", "style", "styles", "unstyled", "vars", "children", "code", "copiedLabel", "copyLabel", "language", "withCopyButton", "highlightOnClient"]);
20
+ const getStyles = useStyles({
21
+ name: 'CodeHighlight',
22
+ props,
23
+ classes,
24
+ className,
25
+ style,
26
+ classNames,
27
+ styles,
28
+ unstyled,
29
+ });
30
+ const getCodeProps = useHighlight({
31
+ code,
32
+ language: language,
33
+ highlightOnClient,
34
+ });
35
+ return (React.createElement(Box, Object.assign({}, getStyles('root'), { ref: ref }, others, { dir: "ltr" }),
36
+ withCopyButton && (React.createElement(CopyButton, { value: code.trim() }, ({ copied, copy }) => (React.createElement(Tooltip, { label: copied ? copiedLabel : copyLabel, fz: "sm", position: "left" },
37
+ React.createElement(ActionIcon, Object.assign({ onClick: copy, variant: "none" }, getStyles('copy')),
38
+ React.createElement(CopyIcon, { copied: copied })))))),
39
+ React.createElement(ScrollArea, { type: "auto", dir: "ltr", offsetScrollbars: false },
40
+ React.createElement("pre", Object.assign({}, getStyles('pre')),
41
+ React.createElement("code", Object.assign({}, getStyles('code'), getCodeProps()))))));
114
42
  });
115
- CodeHighlight.displayName = "@mantine/core/CodeHighlight";
43
+ CodeHighlight.displayName = '@mantine/core/CodeHighlight';
116
44
 
117
45
  export { CodeHighlight };
118
46
  //# sourceMappingURL=CodeHighlight.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CodeHighlight.js","sources":["../src/CodeHighlight.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'clsx';\nimport {\n Box,\n BoxProps,\n StylesApiProps,\n factory,\n ElementProps,\n useProps,\n useStyles,\n CopyButton,\n Tooltip,\n ActionIcon,\n ScrollArea,\n Factory,\n} from '@mantine/core';\nimport { useHighlight } from './use-highlight';\nimport { CopyIcon } from './CopyIcon';\nimport _classes from './CodeHighlight.module.css';\nimport themeClasses from './CodeHighlight.theme.module.css';\n\nconst classes = { ..._classes, root: cx(_classes.root, themeClasses.theme) };\n\nexport type CodeHighlightStylesNames = 'root' | 'code' | 'pre' | 'copy';\nexport type CodeHighlightVariant = string;\n\nexport interface CodeHighlightProps\n extends BoxProps,\n StylesApiProps<CodeHighlightFactory>,\n ElementProps<'div'> {\n /** Code to highlight */\n code: string;\n\n /** Code language, `'tsx'` by default */\n language?: string;\n\n /** Determines whether copy button should be displayed, `true` by default */\n withCopyButton?: boolean;\n\n /** Copy tooltip label, `'Copy code'` by default */\n copyLabel?: string;\n\n /** Copied tooltip label, `'Copied'` by default */\n copiedLabel?: string;\n\n /** Determines whether code should be highlighted only after component is mounted to the dom (disables code highlight on server), `false` by default */\n highlightOnClient?: boolean;\n}\n\nexport type CodeHighlightFactory = Factory<{\n props: CodeHighlightProps;\n ref: HTMLDivElement;\n stylesNames: CodeHighlightStylesNames;\n variant: CodeHighlightVariant;\n}>;\n\nconst defaultProps: Partial<CodeHighlightProps> = {\n copyLabel: 'Copy code',\n copiedLabel: 'Copied',\n language: 'tsx',\n withCopyButton: true,\n};\n\nexport const CodeHighlight = factory<CodeHighlightFactory>((_props, ref) => {\n const props = useProps('CodeHighlight', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n code,\n copiedLabel,\n copyLabel,\n language,\n withCopyButton,\n highlightOnClient,\n ...others\n } = props;\n\n const getStyles = useStyles<CodeHighlightFactory>({\n name: 'CodeHighlight',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n });\n\n const getCodeProps = useHighlight({\n code,\n language: language!,\n highlightOnClient,\n });\n\n return (\n <Box {...getStyles('root')} ref={ref} {...others} dir=\"ltr\">\n {withCopyButton && (\n <CopyButton value={code.trim()}>\n {({ copied, copy }) => (\n <Tooltip label={copied ? copiedLabel : copyLabel} fz=\"sm\" position=\"left\">\n <ActionIcon onClick={copy} variant=\"none\" {...getStyles('copy')}>\n <CopyIcon copied={copied} />\n </ActionIcon>\n </Tooltip>\n )}\n </CopyButton>\n )}\n\n <ScrollArea type=\"auto\" dir=\"ltr\" offsetScrollbars={false}>\n <pre {...getStyles('pre')}>\n <code {...getStyles('code')} {...getCodeProps()} />\n </pre>\n </ScrollArea>\n </Box>\n );\n});\n\nCodeHighlight.displayName = '@mantine/core/CodeHighlight';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"CodeHighlight.js","sources":["../src/CodeHighlight.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'clsx';\nimport {\n Box,\n BoxProps,\n StylesApiProps,\n factory,\n ElementProps,\n useProps,\n useStyles,\n CopyButton,\n Tooltip,\n ActionIcon,\n ScrollArea,\n Factory,\n} from '@mantine/core';\nimport { useHighlight } from './use-highlight';\nimport { CopyIcon } from './CopyIcon';\nimport _classes from './CodeHighlight.module.css';\nimport themeClasses from './CodeHighlight.theme.module.css';\n\nconst classes = { ..._classes, root: cx(_classes.root, themeClasses.theme) };\n\nexport type CodeHighlightStylesNames = 'root' | 'code' | 'pre' | 'copy';\nexport type CodeHighlightVariant = string;\n\nexport interface CodeHighlightProps\n extends BoxProps,\n StylesApiProps<CodeHighlightFactory>,\n ElementProps<'div'> {\n /** Code to highlight */\n code: string;\n\n /** Code language, `'tsx'` by default */\n language?: string;\n\n /** Determines whether copy button should be displayed, `true` by default */\n withCopyButton?: boolean;\n\n /** Copy tooltip label, `'Copy code'` by default */\n copyLabel?: string;\n\n /** Copied tooltip label, `'Copied'` by default */\n copiedLabel?: string;\n\n /** Determines whether code should be highlighted only after component is mounted to the dom (disables code highlight on server), `false` by default */\n highlightOnClient?: boolean;\n}\n\nexport type CodeHighlightFactory = Factory<{\n props: CodeHighlightProps;\n ref: HTMLDivElement;\n stylesNames: CodeHighlightStylesNames;\n variant: CodeHighlightVariant;\n}>;\n\nconst defaultProps: Partial<CodeHighlightProps> = {\n copyLabel: 'Copy code',\n copiedLabel: 'Copied',\n language: 'tsx',\n withCopyButton: true,\n};\n\nexport const CodeHighlight = factory<CodeHighlightFactory>((_props, ref) => {\n const props = useProps('CodeHighlight', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n code,\n copiedLabel,\n copyLabel,\n language,\n withCopyButton,\n highlightOnClient,\n ...others\n } = props;\n\n const getStyles = useStyles<CodeHighlightFactory>({\n name: 'CodeHighlight',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n });\n\n const getCodeProps = useHighlight({\n code,\n language: language!,\n highlightOnClient,\n });\n\n return (\n <Box {...getStyles('root')} ref={ref} {...others} dir=\"ltr\">\n {withCopyButton && (\n <CopyButton value={code.trim()}>\n {({ copied, copy }) => (\n <Tooltip label={copied ? copiedLabel : copyLabel} fz=\"sm\" position=\"left\">\n <ActionIcon onClick={copy} variant=\"none\" {...getStyles('copy')}>\n <CopyIcon copied={copied} />\n </ActionIcon>\n </Tooltip>\n )}\n </CopyButton>\n )}\n\n <ScrollArea type=\"auto\" dir=\"ltr\" offsetScrollbars={false}>\n <pre {...getStyles('pre')}>\n <code {...getStyles('code')} {...getCodeProps()} />\n </pre>\n </ScrollArea>\n </Box>\n );\n});\n\nCodeHighlight.displayName = '@mantine/core/CodeHighlight';\n"],"names":[],"mappings":";;;;;;;;;AAqBA,MAAM,OAAO,mCAAQ,QAAQ,KAAE,IAAI,EAAE,EAAE,CAAC,QAAQ,CAAC,IAAI,EAAE,YAAY,CAAC,KAAK,CAAC,GAAE,CAAC;AAmC7E,MAAM,YAAY,GAAgC;IAChD,SAAS,EAAE,WAAW;IACtB,WAAW,EAAE,QAAQ;IACrB,QAAQ,EAAE,KAAK;IACf,cAAc,EAAE,IAAI;CACrB,CAAC;MAEW,aAAa,GAAG,OAAO,CAAuB,CAAC,MAAM,EAAE,GAAG;IACrE,MAAM,KAAK,GAAG,QAAQ,CAAC,eAAe,EAAE,YAAY,EAAE,MAAM,CAAC,CAAC;IAC9D,MAAM,EACJ,UAAU,EACV,SAAS,EACT,KAAK,EACL,MAAM,EACN,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,SAAS,EACT,QAAQ,EACR,cAAc,EACd,iBAAiB,KAEf,KAAK,EADJ,MAAM,UACP,KAAK,EAfH,qKAeL,CAAQ,CAAC;IAEV,MAAM,SAAS,GAAG,SAAS,CAAuB;QAChD,IAAI,EAAE,eAAe;QACrB,KAAK;QACL,OAAO;QACP,SAAS;QACT,KAAK;QACL,UAAU;QACV,MAAM;QACN,QAAQ;KACT,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,YAAY,CAAC;QAChC,IAAI;QACJ,QAAQ,EAAE,QAAS;QACnB,iBAAiB;KAClB,CAAC,CAAC;IAEH,QACE,oBAAC,GAAG,oBAAK,SAAS,CAAC,MAAM,CAAC,IAAE,GAAG,EAAE,GAAG,IAAM,MAAM,IAAE,GAAG,EAAC,KAAK;QACxD,cAAc,KACb,oBAAC,UAAU,IAAC,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,IAC3B,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,MAChB,oBAAC,OAAO,IAAC,KAAK,EAAE,MAAM,GAAG,WAAW,GAAG,SAAS,EAAE,EAAE,EAAC,IAAI,EAAC,QAAQ,EAAC,MAAM;YACvE,oBAAC,UAAU,kBAAC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAC,MAAM,IAAK,SAAS,CAAC,MAAM,CAAC;gBAC7D,oBAAC,QAAQ,IAAC,MAAM,EAAE,MAAM,GAAI,CACjB,CACL,CACX,CACU,CACd;QAED,oBAAC,UAAU,IAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAC,KAAK,EAAC,gBAAgB,EAAE,KAAK;YACvD,6CAAS,SAAS,CAAC,KAAK,CAAC;gBACvB,8CAAU,SAAS,CAAC,MAAM,CAAC,EAAM,YAAY,EAAE,EAAI,CAC/C,CACK,CACT,EACN;AACJ,CAAC,EAAE;AAEH,aAAa,CAAC,WAAW,GAAG,6BAA6B;;;;"}
@@ -1,4 +1,3 @@
1
- 'use client';
2
1
  var _classes = {"code":"mantine-XIBJZDt","pre":"mantine-RDvBcjB","header":"mantine-cmEtjrV","controls":"mantine-059sM-t","copy":"mantine-tB-P5PD","control":"mantine-NTm-nGn","file":"mantine-PBrPXnu","files":"mantine-IvOddiX","codeWrapper":"mantine-YfYyOiA","showCodeButton":"mantine-haNyFRC","root":"mantine-k6OJW8l"};
3
2
 
4
3
  export default _classes;
@@ -1 +1 @@
1
- {"version":3,"file":"CodeHighlight.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}
1
+ {"version":3,"file":"CodeHighlight.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,4 +1,3 @@
1
- 'use client';
2
1
  var themeClasses = {"theme":"mantine-h-DP-Yw"};
3
2
 
4
3
  export default themeClasses;
@@ -1 +1 @@
1
- {"version":3,"file":"CodeHighlight.theme.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}
1
+ {"version":3,"file":"CodeHighlight.theme.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}