react-xsd-tree
TypeScript icon, indicating that this package has built-in type declarations

1.0.2 • Public • Published

npm NPM npm

ReactXsdTree

This form is used to design React Material Tree using any given XSD/ISO 20022 Json object. .

Features

  • 🔥 Automatic tree generation from the given XSD Json
  • ⚡️ Supports ISO 20022 messages:

How to consume

  1. Install npm package ngx-xml-message.
    npm i react-xsd-tree
import React from "react";
import { camt53 } from "./models/model"; // model
import ReactXsdTree from "./components/ReactXsdTree";
import { ReactXsdTree, SchemaElement, useReactXsdTreeViewApiRef } from "react-xsd-tree";

const App: React.FC = () => {
  const reactXsdTreeApiRef = useReactXsdTreeViewApiRef();
  
  const onSelect = (event, item: SchemaElement) => {
    console.log(item);
  };

  const handleClick = (event) => {
    reactXsdTreeApiRef.current?.selectItem(
      event,
      "document_bktocstmrstmt_grphdr_credttm"
    );
  };
  return (
    <>
      <button onClick={handleClick}>Click Me</button>

      <ReactXsdTree
        ref={reactXsdTreeApiRef}
        model={camt53}
        onSelectedItemsChange={onSelect}
      ></ReactXsdTree>
    </>
  );
};

export default App;

Convert XSD to JSON

  1. Install npm package xsd-json-converter.
    npm i xsd-json-converter

How to Use

  xjc <source-path> <output-path>

Example

Linux

  xjc /mnt/c/source/xsd/camt.053.001.10.xsd /mnt/c/source/xsd/camt.053.json 

Windows

  xjc C:/source/xsd/camt.053.001.10.xsd C:/source/xsd/camt.053.json 

Package Sidebar

Install

npm i react-xsd-tree

Weekly Downloads

13

Version

1.0.2

License

MIT

Unpacked Size

279 kB

Total Files

7

Last publish

Collaborators

  • pixelbyaj