How to use @antv/x6-components - 10 common examples

To help you get started, we’ve selected a few @antv/x6-components examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github antvis / x6 / examples / x6-example-components / src / pages / menu.tsx View on Github external
import React from 'react'
import { message } from 'antd'
import { Menu } from '@antv/x6-components'

const MenuItem = Menu.Item
const SubMenu = Menu.SubMenu
const Divider = Menu.Divider

export default class MenuExample extends React.PureComponent {
  onMenuClick = (name: string) => {
    message.success(`${name} clicked`, 10)
  }

  onMenuItemClick = () => {
    this.onMenuClick('undo')
  }

  render() {
    return (
      <div style="{{">
        <div style="{{"></div></div>
github antvis / x6 / examples / x6-example-components / src / pages / toolbar.tsx View on Github external
renderZoomDropdown() {
    const MenuItem = Menu.Item
    const Divider = Menu.Divider

    return (
      <menu>
        <menuitem name="resetView">
          Reset View
        </menuitem>
        <menuitem name="fitWindow">
          Fit Window
        </menuitem>
        
        <menuitem name="25">25%</menuitem>
        <menuitem name="50">50%</menuitem>
        <menuitem name="75">75%</menuitem>
        <menuitem name="100">100%</menuitem>
        <menuitem name="125">125%</menuitem></menu>
github antvis / x6 / examples / x6-example-features / src / pages / flowchart / toolbar.tsx View on Github external
renderZoomDropdown() {
    const MenuItem = Menu.Item
    return (
      <menu>
        <menuitem name="25">25%</menuitem>
        <menuitem name="50">50%</menuitem>
        <menuitem name="75">75%</menuitem>
        <menuitem name="100">100%</menuitem>
        <menuitem name="125">125%</menuitem>
        <menuitem name="150">150%</menuitem>
        <menuitem name="200">200%</menuitem>
        <menuitem name="400">400%</menuitem>
      </menu>
    )
  }
github antvis / x6 / examples / x6-example-drawio / src / pages / graph / toolbar.tsx View on Github external
renderColorPicker(
    name: string,
    value: string,
    onChange: (value: ColorResult) =&gt; void,
  ) {
    const MenuItem = Menu.Item
    return (
      <menu>
        <menuitem name="{name}">
          
        </menuitem>
      </menu>
    )
  }
github antvis / x6 / examples / x6-example-drawio / src / pages / graph / menubar.tsx View on Github external
import React from 'react'
import { Menubar, Menu } from '@antv/x6-components'

const MenuItem = Menu.Item
const SubMenu = Menu.SubMenu
const Divider = Menu.Divider
const MenubarItem = Menubar.Item

export class GraphMenubar extends React.PureComponent {
  render() {
    return (
      
        
          <menu>
            <menuitem>New...</menuitem>
            <menuitem>Open...</menuitem>
            
            <menuitem>Save</menuitem>
            <menuitem>Save as...</menuitem>
            </menu>
github antvis / x6 / examples / x6-example-components / src / pages / menubar.tsx View on Github external
import React from 'react'
import { message } from 'antd'
import { Menubar, Menu } from '@antv/x6-components'

const MenuItem = Menu.Item
const SubMenu = Menu.SubMenu
const Divider = Menu.Divider
const MenubarItem = Menubar.Item

export default class MenuExample extends React.PureComponent {
  onMenuClick = (name: string) =&gt; {
    message.success(`${name} clicked`, 10)
  }

  onMenuItemClick = () =&gt; {
    this.onMenuClick('undo')
  }

  render() {
    return (
      <div style="{{"></div>
github antvis / x6 / examples / x6-example-drawio / src / pages / graph / menubar.tsx View on Github external
import React from 'react'
import { Menubar, Menu } from '@antv/x6-components'

const MenuItem = Menu.Item
const SubMenu = Menu.SubMenu
const Divider = Menu.Divider
const MenubarItem = Menubar.Item

export class GraphMenubar extends React.PureComponent {
  render() {
    return (
      
        
          <menu>
            <menuitem>New...</menuitem>
            <menuitem>Open...</menuitem>
            
            <menuitem>Save</menuitem>
            <menuitem>Save as...</menuitem>
            
            <menuitem>Import...</menuitem>
            <menuitem>Export...</menuitem></menu>
github antvis / x6 / examples / x6-example-components / src / pages / menu.tsx View on Github external
import React from 'react'
import { message } from 'antd'
import { Menu } from '@antv/x6-components'

const MenuItem = Menu.Item
const SubMenu = Menu.SubMenu
const Divider = Menu.Divider

export default class MenuExample extends React.PureComponent {
  onMenuClick = (name: string) =&gt; {
    message.success(`${name} clicked`, 10)
  }

  onMenuItemClick = () =&gt; {
    this.onMenuClick('undo')
  }

  render() {
    return (
      <div style="{{">
        <div style="{{">
          <menu>
            <menuitem name="undo"></menuitem></menu></div></div>
github antvis / x6 / examples / x6-example-drawio / src / pages / graph / toolbar.tsx View on Github external
renderZoomDropdown() {
    const MenuItem = Menu.Item
    const Divider = Menu.Divider

    return (
      <menu>
        <menuitem name="resetView">
          Reset View
        </menuitem>
        <menuitem name="fitWindow">
          Fit Window
        </menuitem>
        
        <menuitem name="25">25%</menuitem>
        <menuitem name="50">50%</menuitem>
        <menuitem name="75">75%</menuitem>
        <menuitem name="100">100%</menuitem>
        <menuitem name="125">125%</menuitem>
        <menuitem name="150">150%</menuitem></menu>
github antvis / x6 / examples / x6-example-components / src / pages / menubar.tsx View on Github external
import React from 'react'
import { message } from 'antd'
import { Menubar, Menu } from '@antv/x6-components'

const MenuItem = Menu.Item
const SubMenu = Menu.SubMenu
const Divider = Menu.Divider
const MenubarItem = Menubar.Item

export default class MenuExample extends React.PureComponent {
  onMenuClick = (name: string) =&gt; {
    message.success(`${name} clicked`, 10)
  }

  onMenuItemClick = () =&gt; {
    this.onMenuClick('undo')
  }

  render() {
    return (
      <div style="{{">
        </div>

@antv/x6-components

React components for building x6 editors

MIT
Latest version published 4 years ago

Package Health Score

70 / 100
Full package analysis