@mantine/code-highlight 8.0.0-alpha.3 → 8.0.1

package/esm/use-highlight.mjs

@@ -1,26 +0,0 @@
-'use client';
-import { useState, useEffect } from 'react';
-import hljs from 'highlight.js';
-
-function useHighlight({ code, language, highlightOnClient }) {
-  const lang = hljs.getLanguage(language) ? language : "plaintext";
-  const getHighlightedCode = () => hljs.highlight(code.trim(), { language: lang }).value;
-  const [highlighted, setHighlighted] = useState(!highlightOnClient);
-  const [highlightedCode, setHighlightedCode] = useState(
-    highlightOnClient ? code : getHighlightedCode()
-  );
-  const getCodeProps = () => highlighted ? { dangerouslySetInnerHTML: { __html: highlightedCode } } : { children: code.trim() };
-  useEffect(() => {
-    if (highlightOnClient) {
-      setHighlightedCode(getHighlightedCode());
-      setHighlighted(true);
-    }
-  }, []);
-  useEffect(() => {
-    setHighlightedCode(getHighlightedCode());
-  }, [code]);
-  return getCodeProps;
-}
-
-export { useHighlight };
-//# sourceMappingURL=use-highlight.mjs.map

package/esm/use-highlight.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-highlight.mjs","sources":["../src/use-highlight.ts"],"sourcesContent":["import { useEffect, useState } 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 lang = hljs.getLanguage(language) ? language : 'plaintext';\n  const getHighlightedCode = () => hljs.highlight(code.trim(), { language: lang }).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  useEffect(() => {\n    setHighlightedCode(getHighlightedCode());\n  }, [code]);\n\n  return getCodeProps;\n}\n"],"names":[],"mappings":"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"}

package/lib/CodeHighlight.d.ts

@@ -1,26 +0,0 @@
-import { BoxProps, ElementProps, Factory, StylesApiProps } from '@mantine/core';
-export type CodeHighlightStylesNames = 'root' | 'code' | 'pre' | 'copy';
-export interface CodeHighlightProps extends BoxProps, StylesApiProps<CodeHighlightFactory>, ElementProps<'div'> {
-    /** Code to highlight */
-    code: string;
-    /** Code language, `'tsx'` by default */
-    language?: string;
-    /** Determines whether copy button should be displayed, `true` by default */
-    withCopyButton?: boolean;
-    /** Copy tooltip label, `'Copy code'` by default */
-    copyLabel?: string;
-    /** Copied tooltip label, `'Copied'` by default */
-    copiedLabel?: string;
-    /** Determines whether code should be highlighted only after component is mounted to the dom (disables code highlight on server), `false` by default */
-    highlightOnClient?: boolean;
-}
-export type CodeHighlightFactory = Factory<{
-    props: CodeHighlightProps;
-    ref: HTMLDivElement;
-    stylesNames: CodeHighlightStylesNames;
-}>;
-export declare const CodeHighlight: import("@mantine/core").MantineComponent<{
-    props: CodeHighlightProps;
-    ref: HTMLDivElement;
-    stylesNames: CodeHighlightStylesNames;
-}>;

package/lib/CodeHighlightTabs.d.ts

@@ -1,55 +0,0 @@
-import { BoxProps, ElementProps, Factory, StylesApiProps } from '@mantine/core';
-export type CodeHighlightTabsStylesNames = 'root' | 'code' | 'codeWrapper' | 'showCodeButton' | 'pre' | 'controls' | 'control' | 'header' | 'file' | 'files' | 'fileIcon';
-export type CodeHighlightTabsCssVariables = {
-    root: '--ch-max-collapsed-height';
-};
-export interface CodeHighlightTabsCode {
-    language?: string;
-    code: string;
-    fileName?: string;
-    icon?: React.ReactNode;
-}
-export interface CodeHighlightTabsProps extends BoxProps, StylesApiProps<CodeHighlightTabsFactory>, ElementProps<'div'> {
-    /** Code to highlight with meta data (file name and icon) */
-    code: CodeHighlightTabsCode | CodeHighlightTabsCode[];
-    /** Default active tab index */
-    defaultActiveTab?: number;
-    /** Index of controlled active tab state */
-    activeTab?: number;
-    /** Called when tab changes */
-    onTabChange?: (tab: number) => void;
-    /** Determines whether header with file names and copy button should be rendered, `true` by default */
-    withHeader?: boolean;
-    /** Copy tooltip label, `'Copy code'` by default */
-    copyLabel?: string;
-    /** Copied tooltip label, `'Copied'` by default */
-    copiedLabel?: string;
-    /** Function that returns icon based on file name */
-    getFileIcon?: (fileName: string) => React.ReactNode;
-    /** `max-height` of code in collapsed state */
-    maxCollapsedHeight?: React.CSSProperties['maxHeight'];
-    /** Controlled expanded state */
-    expanded?: boolean;
-    /** Uncontrolled expanded state initial value */
-    defaultExpanded?: boolean;
-    /** Called when expanded state changes */
-    onExpandedChange?: (expanded: boolean) => void;
-    /** Expand button label and tooltip, `'Expand code'` by default */
-    expandCodeLabel?: string;
-    /** Collapse button label and tooltip, `'Collapse code'` by default */
-    collapseCodeLabel?: string;
-    /** Determines whether to show the expand button, `false` by default */
-    withExpandButton?: boolean;
-    /** Determines whether copy button should be displayed, `true` by default */
-    withCopyButton?: boolean;
-}
-export type CodeHighlightTabsFactory = Factory<{
-    props: CodeHighlightTabsProps;
-    ref: HTMLDivElement;
-    stylesNames: CodeHighlightTabsStylesNames;
-}>;
-export declare const CodeHighlightTabs: import("@mantine/core").MantineComponent<{
-    props: CodeHighlightTabsProps;
-    ref: HTMLDivElement;
-    stylesNames: CodeHighlightTabsStylesNames;
-}>;

package/lib/CopyIcon.d.ts

@@ -1,8 +0,0 @@
-interface CopyIconProps extends React.ComponentPropsWithoutRef<'svg'> {
-    copied: boolean;
-}
-export declare function CopyIcon({ copied, style, ...others }: CopyIconProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace CopyIcon {
-    var displayName: string;
-}
-export {};

package/lib/ExpandIcon.d.ts

@@ -1,5 +0,0 @@
-interface ExpandIconProps extends React.ComponentPropsWithoutRef<'svg'> {
-    expanded: boolean;
-}
-export declare function ExpandIcon({ expanded, style, ...others }: ExpandIconProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/lib/FileIcon.d.ts

@@ -1,9 +0,0 @@
-interface FileIconProps {
-    fileName: string | undefined;
-    getFileIcon?: ((fileName: string) => React.ReactNode) | undefined;
-    fileIcon: React.ReactNode | undefined;
-    className?: string;
-    style?: React.CSSProperties;
-}
-export declare function FileIcon({ fileIcon, fileName, getFileIcon, className, style }: FileIconProps): import("react/jsx-runtime").JSX.Element | null;
-export {};

package/lib/InlineCodeHighlight.d.ts

@@ -1,18 +0,0 @@
-import { BoxProps, ElementProps, Factory, StylesApiProps } from '@mantine/core';
-export type InlineCodeHighlightStylesNames = 'code';
-export interface InlineCodeHighlightProps extends BoxProps, StylesApiProps<InlineCodeHighlightFactory>, ElementProps<'div'> {
-    /** Code to highlight */
-    code: string;
-    /** Code language, `'tsx'` by default */
-    language?: string;
-}
-export type InlineCodeHighlightFactory = Factory<{
-    props: InlineCodeHighlightProps;
-    ref: HTMLElement;
-    stylesNames: InlineCodeHighlightStylesNames;
-}>;
-export declare const InlineCodeHighlight: import("@mantine/core").MantineComponent<{
-    props: InlineCodeHighlightProps;
-    ref: HTMLElement;
-    stylesNames: InlineCodeHighlightStylesNames;
-}>;

package/lib/use-highlight.d.ts

@@ -1,15 +0,0 @@
-interface UseHighlightInput {
-    code: string;
-    language: string;
-    highlightOnClient: boolean | undefined;
-}
-export declare function useHighlight({ code, language, highlightOnClient }: UseHighlightInput): () => {
-    dangerouslySetInnerHTML: {
-        __html: string;
-    };
-    children?: undefined;
-} | {
-    children: string;
-    dangerouslySetInnerHTML?: undefined;
-};
-export {};