Code

A component used to display code snippets.

Usage

1

import ForgeUI, { Code } from '@forge/ui';

Props

Supported languages

The code component currently supports the following programming languages:

"abap", "actionscript", "ada", "arduino", "autoit", "c", "c++", "coffeescript", "csharp", "css", "cuda", "d", "dart", "delphi", "elixir", "erlang", "fortran", "foxpro", "go", "graphql", "groovy", "haskell", "haxe", "html", "java", "javascript", "json", "julia", "kotlin", "latex", "livescript", "lua", "mathematica", "matlab", "objective-c", "objective-j", "objectpascal", "ocaml", "octave", "perl", "php", "powershell", "prolog", "puppet", "python", "qml", "r", "racket", "restructuredtext", "ruby", "rust", "sass", "scala", "scheme", "shell", "smalltalk", "sql", "standardml", "swift", "tcl", "tex", "text", "typescript", "vala", "vbnet", "verilog", "vhdl", "xml", "xquery"

Example

An example app that displays the stringified code block.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

const App = () => {
  const exampleCodeBlock = `  // React Component
    class HelloMessage extends React.Component {
      render() {
        return (
          <div>
            Hello {this.props.name}
          </div>
        );
      }
    }

    ReactDOM.render(
      <HelloMessage name="Taylor" />,
      mountNode
    );
  `;
  return (
    <Code text={exampleCodeBlock} language="javascript" />
  );
};

Preview