• Index
• Search by APIs
• Search by Words
• Project Search

• Java
• Python
• JavaScript
• TypeScript
• C++
• Scala
• Blog

• remind-master
  • .github
    • workflows
      • main.yml
  • .husky
    • pre-commit
    • .gitignore
  • .prettierrc
  • LICENSE
  • .npmrc
  • pnpm-workspace.yaml
  • xo.config.cjs
  • packages
    • contributions
      • src
        • useUpdateTopic.ts
        • useDndTopic.ts
        • index.ts
        • useNavigate.ts
        • useHistory.ts
        • index.d.ts
        • utils.ts
        • useSelection.ts
        • useToolbar.ts
      • vite.config.ts
      • CHANGELOG.md
      • package.json
      • tsconfig.node.json
      • tsconfig.json
    • example
      • src
        • data.ts
        • main.ts
      • vite.config.ts
      • CHANGELOG.md
      • package.json
      • index.html
      • tsconfig.node.json
      • tsconfig.json
    • core
      • src
        • preact.d.ts
        • layout
          • index.ts
          • mindmap.ts
          • shared.ts
          • structure.ts
        • utils
          • is.ts
          • useTextEditor.tsx
          • link.tsx
          • textRender.ts
          • uuid.ts
          • to.ts
          • debug.ts
          • common.ts
          • useEventListener.ts
          • history.ts
          • tree.ts
          • assert.ts
        • contribute
          • index.ts
        • interface
          • layout.ts
          • viewModel.ts
          • theme.ts
          • topic.ts
          • textEditor.ts
          • intl.ts
          • contribute.ts
          • model.ts
        • createMindmap.tsx
        • index.ts
        • viewModel
          • index.ts
        • unstated
          • index.tsx
        • context
          • locale.ts
          • theme.ts
        • index.d.ts
        • view
          • Topic.tsx
          • Links.tsx
          • Mindmap.tsx
          • index.module.css
        • vite-env.d.ts
        • model
          • index.ts
        • constant.ts
      • vite.config.ts
      • test
        • useEventListener.test.ts
        • textRender.test.ts
        • history.test.ts
        • createMindmap.test.ts
        • layout.test.ts
        • model.test.ts
      • CHANGELOG.md
      • package.json
      • tsconfig.node.json
      • tsconfig.json
  • README.md
  • package.json
  • tsconfig.node.json
  • .changeset
    • config.json
    • README.md
  • tsconfig.json
  • .gitignore
  • .vscode
    • extensions.json

import { createRef, RefObject, render } from 'preact'
import { forwardRef } from 'preact/compat'
import { Mindmap, MindmapProps } from './view/Mindmap'
import { defaultRoot, Model } from './model'
import { ViewModel } from './viewModel'
import { ThemeContext, defaultTheme } from './context/theme'
import { defaultLocale, LocaleContext } from './context/locale'
import { ContributionAPI } from './interface/contribute'
import { noop } from './utils/common'

const defaultProps: MindmapProps = {
  value: defaultRoot,
  theme: defaultTheme,
  locale: defaultLocale.locale,
  onChange: noop,
  contributions: [],
  layout: 'mindmap',
}

const MindmapApp = forwardRef(
  (props: Partial<MindmapProps>, ref: RefObject<ContributionAPI>) => {
    const {
      value = defaultProps.value,
      theme = defaultTheme,
      locale = defaultProps.locale,
    } = props
    return (
      <ViewModel.Provider>
        <Model.Provider
          initialState={{
            root: value,
          }}
        >
          <ThemeContext.Provider value={theme}>
            <LocaleContext.Provider value={{ locale }}>
              <Mindmap {...defaultProps} {...props} ref={ref} />
            </LocaleContext.Provider>
          </ThemeContext.Provider>
        </Model.Provider>
      </ViewModel.Provider>
    )
  },
)

function createMindmap(el: HTMLElement, options?: Partial<MindmapProps>) {
  const ref = createRef<ContributionAPI>()
  render(<MindmapApp ref={ref} {...options} />, el)
  return ref
}

export { createMindmap }