UNPKG

@nexusui/components

Version:

These are custom components specially-developed for NexusUI applications. They will make your life easier by giving you out-of-the-box implementations for various high-level UI elements that you can drop directly into your application.

3 lines (2 loc) 805 B
"use client"; import{jsxs as r,jsx as e}from"react/jsx-runtime";import{useMemo as o}from"react";import m from"@mui/material/NoSsr";import i from"@mui/material/Box";import t from"clsx";import s from"../prism/prism.js";import a from"./CodeCopyButton.js";import{styles as l}from"./CodeViewer.style.js";const n="NexusCodeViewer",c=c=>{const{code:u,language:d="tsx",copyButtonHidden:p=!1,showLineNumbers:f=!1,sx:x,...g}=c,N=o((()=>s(u.trim(),d)),[u,d]);return r(i,{className:`${n}-root`,"aria-label":"codeViewerLabel",sx:[l.root,...Array.isArray(x)?x:[x]],...g,children:[e("pre",{className:f?t(`${n}-lineNumbers`,"line-numbers"):void 0,children:e("code",{className:t(`${n}-language-${d}`,`language-${d}`),dangerouslySetInnerHTML:{__html:N}})}),p?null:e(m,{children:e(a,{code:u})})]})};export{c as CodeViewer};