MTRGen Template Editor

---

Template editor for MTRGen as a React component.

📝 Table of Contents

• 📝 Table of Contents
• 🧐 About
• 🏁 Getting Started
  • Prerequisites
  • Installing
    • With NPM or PNPM
    • With Yarn
    • With Bun
• 🎈 Usage
  • Interfaces
    • EditorProps
    • Template Schema Interfaces
• ⛏️ Built Using
• ✍️ Authors
• 🎧 Dev Soundtrack

🧐 About

React component for editing JSON templates to be used by MTRGen.

🏁 Getting Started

Prerequisites

You need to have NodeJS installed and use React in your project.

Installing

With NPM or PNPM

npm install mtrgen-template-editor

pnpm install mtrgen-template-editor

With Yarn

yarn add mtrgen-template-editor

With Bun

bun add mtrgen-template-editor

🎈 Usage

// Import the component
import { MTRGenTemplateEditor, Template } from "mtrgen-template-editor";

function App() {
    // Create a template object
    const [template, setTemplate] = useState<Template>({
        name: "Template",
        path: "path",
        filename: "template",
        file: {}
    });

    return (
        <div className="App">
            {/* Use it */}
            <MTRGenTemplateEditor setTemplate={setTemplate} template={template} onTemplateChange={(temp) => setTemplate(temp) } />
        </div>
    );
}

Interfaces

EditorProps

interface EditorProps {
    template: Template; // The template object
    onTemplateChange: (template: Template) => void; // Callback for when the template changes
    setTemplate: Dispatch<SetStateAction<Template>>; // React hook for setting the template
}

Template Schema Interfaces

interface Template {
    autoImport?: boolean;
    file:        File;
    filename:    string;
    name:        string;
    path:        string;
}

interface File {
    class?:     Class;
    interface?: Interface;
    namespace?: Namespace;
    strict?:    boolean;
    trait?:     Trait;
    use?:       IndexedString[];
}

interface Class {
    comments?:   IndexedString[];
    constants?:  Constant[];
    extends?:    string;
    implements?: IndexedString[];
    methods?:    Method[];
    modifier?:   Modifier;
    name:        string;
    props?:      Prop[];
    traits?:     IndexedString[];
}

interface Constant {
    id:          number|string;
    comments?:   IndexedString[];
    name:        string;
    value:       Value;
    visibility?: Visibility;
}

type Value = any[] | boolean | number | number | { [key: string]: any } | null | string;

interface Method {
    id:          number|string;
    body?:       IndexedString[];
    comments?:   IndexedString[];
    modifier?:   Modifier;
    name:        string;
    nullable?:   boolean;
    params?:     Param[];
    ref?:        boolean;
    return?:     string;
    static?:     boolean;
    visibility?: Visibility;
}

enum Modifier {
    Abstract = "abstract",
    Final = "final",
}

interface Param {
    id:        number|string;
    name:      string;
    nullable?: boolean;
    promoted?: boolean;
    ref?:      boolean;
    type?:     string;
    value?:    Value;
}

enum Visibility {
    Private = "private",
    Protected = "protected",
    Public = "public",
}

interface Prop {
    id:          number|string;
    comments?:   IndexedString[];
    getter?:     boolean;
    init?:       boolean;
    name:        string;
    nullable?:   boolean;
    setter?:     boolean;
    static?:     boolean;
    type?:       string;
    value?:      Value;
    visibility?: Visibility;
}

interface Interface {
    comments?:  IndexedString[];
    constants?: Constant[];
    extends?:   string;
    methods?:   Method[];
    name:       string;
}

interface Namespace {
    class?:     Class;
    interface?: Interface;
    name:       string;
    trait?:     Trait;
    use?:       IndexedString[];
}

interface Trait {
    comments?: IndexedString[];
    methods?:  Method[];
    name:      string;
    props?:    Prop[];
}

interface IndexedString {
    id: number|string;
    value: string;
}

⛏️ Built Using

• pnpm - pnpm
• TypeScript - TypeScript
• React - React
• Bootstrap - Bootstrap
• React Bootstrap - React Bootstrap

✍️ Authors

• @matronator - Everything

🎧 Dev Soundtrack

Package was built while listening to:

• Bring Me The Horizon - There Is a Hell Believe Me I've Seen It. There Is a Heaven Let's Keep It a Secret.
• Suicide Silence - The Cleansing
• Blackout Podcast 75 - Black Sun Empire
• Neonlight - 2 Hours #10YNL Special @ Fat Bemme x Boundless Beatz (11 - 10 - 2019)