How to use the @edtr-io/ui.createIcon function in @edtr-io/ui

import { GeogebraEditor } from './editor'
import { GeogebraRenderer } from './renderer'

export const geogebraState = string()
export const geogebraPlugin: DeprecatedPlugin = {
  //eslint-disable-next-line react/display-name
  Component: props =>
    props.editable ? (
      
    ) : (
      
    ),
  state: geogebraState,
  title: 'Geogebra Applet',
  description: 'Binde Applets von Geogebratube via Link oder ID ein.',
  icon: createIcon(faCubes),
  onPaste(clipboardData: DataTransfer) {
    const value = clipboardData.getData('text')

    if (/geogebra\.org\/m\/(.+)/.test(value)) {
      return { state: value }
    }
  }
}

} from '@edtr-io/plugin-text/__fixtures__'

import { RowsState, createRowsPlugin } from '../src'

export const name = 'rows'
export const plugin = createRowsPlugin({
  plugins: [
    {
      name: 'anchor',
      title: 'Anchor',
      icon: createIcon(faAnchor)
    },
    {
      name: 'blockquote',
      title: 'Blockquote',
      icon: createIcon(faQuoteRight)
    },
    {
      name: 'equations',
      title: 'Equations',
      icon: createIcon(faEquals)
    },
    {
      name: 'files',
      title: 'Files',
      icon: createIcon(faFileAlt)
    },
    {
      name: 'geogebra',
      title: 'GeoGebra',
      icon: createIcon(faCubes)
    },

export const createMultimediaExplanationPlugin = (
  multimediaPlugins: PluginRegistry
): Plugin => {
  return {
    Component: createMultimediaExplanationEditor(multimediaPlugins),
    state: multimediaExplanationState(multimediaPlugins),
    icon: createIcon(faPhotoVideo),
    title: 'Erklärung mit Multimedia-Inhalt',
    description:
      'Erstelle einen veranschaulichenden oder erklärenden Multimedia-Inhalt mit zugehöriger Erklärung.'
  }
}
export type PluginRegistry = {

title: 'Image',
      icon: createIcon(faImages)
    },
    {
      name: 'importantStatement',
      title: 'Important Statement'
    },
    {
      name: 'inputExercise',
      title: 'Input Exercise',
      icon: createIcon(faKeyboard)
    },
    {
      name: 'multimediaExplanation',
      title: 'Multimedia Explanation',
      icon: createIcon(faPhotoVideo)
    },
    {
      name: 'scMcExercise',
      title: 'Choice Exercise',
      icon: createIcon(faDotCircle)
    },
    {
      name: 'serloInjection',
      title: 'Serlo Content',
      icon: createIcon(faNewspaper)
    },
    {
      name: 'solution',
      title: 'Solution',
      icon: createIcon(faCheckSquare)
    },

icon: createIcon(faCubes)
    },
    {
      name: 'highlight',
      title: 'Code Highlight',
      icon: createIcon(faCode)
    },
    {
      name: 'hint',
      title: 'Hint',
      icon: createIcon(faLightbulb)
    },
    {
      name: 'image',
      title: 'Image',
      icon: createIcon(faImages)
    },
    {
      name: 'importantStatement',
      title: 'Important Statement'
    },
    {
      name: 'inputExercise',
      title: 'Input Exercise',
      icon: createIcon(faKeyboard)
    },
    {
      name: 'multimediaExplanation',
      title: 'Multimedia Explanation',
      icon: createIcon(faPhotoVideo)
    },
    {

icon: createIcon(faFileAlt)
    },
    {
      name: 'geogebra',
      title: 'GeoGebra',
      icon: createIcon(faCubes)
    },
    {
      name: 'highlight',
      title: 'Code Highlight',
      icon: createIcon(faCode)
    },
    {
      name: 'hint',
      title: 'Hint',
      icon: createIcon(faLightbulb)
    },
    {
      name: 'image',
      title: 'Image',
      icon: createIcon(faImages)
    },
    {
      name: 'importantStatement',
      title: 'Important Statement'
    },
    {
      name: 'inputExercise',
      title: 'Input Exercise',
      icon: createIcon(faKeyboard)
    },
    {

content: child('rows')
})

export const solutionStepsState = object({
  introduction: child('text'),
  strategy: child('rows'),
  hasStrategy: boolean(),
  solutionSteps: list(solutionStep),
  additionals: child('rows'),
  hasAdditionals: boolean()
})

export const solutionStepsPlugin: Plugin = {
  Component: SolutionStepsEditor,
  state: solutionStepsState,
  icon: createIcon(faCheckSquare),
  title: 'Lösungschritte',
  description: 'Erstelle mit diesem Plugin eine schrittweise Aufgabenlösung.'
}

icon: createIcon(faDotCircle)
    },
    {
      name: 'serloInjection',
      title: 'Serlo Content',
      icon: createIcon(faNewspaper)
    },
    {
      name: 'solution',
      title: 'Solution',
      icon: createIcon(faCheckSquare)
    },
    {
      name: 'spoiler',
      title: 'Spoiler',
      icon: createIcon(faCaretSquareDown)
    },
    {
      name: 'table',
      title: 'Markdown Table'
    },
    {
      name: 'text',
      title: 'Text',
      icon: createIcon(faParagraph)
    },
    {
      name: 'video',
      title: 'Video',
      icon: createIcon(faFilm)
    }
  ]

icon: createIcon(faQuoteRight)
    },
    {
      name: 'equations',
      title: 'Equations',
      icon: createIcon(faEquals)
    },
    {
      name: 'files',
      title: 'Files',
      icon: createIcon(faFileAlt)
    },
    {
      name: 'geogebra',
      title: 'GeoGebra',
      icon: createIcon(faCubes)
    },
    {
      name: 'highlight',
      title: 'Code Highlight',
      icon: createIcon(faCode)
    },
    {
      name: 'hint',
      title: 'Hint',
      icon: createIcon(faLightbulb)
    },
    {
      name: 'image',
      title: 'Image',
      icon: createIcon(faImages)
    },

icon: createIcon(faPhotoVideo)
    },
    {
      name: 'scMcExercise',
      title: 'Choice Exercise',
      icon: createIcon(faDotCircle)
    },
    {
      name: 'serloInjection',
      title: 'Serlo Content',
      icon: createIcon(faNewspaper)
    },
    {
      name: 'solution',
      title: 'Solution',
      icon: createIcon(faCheckSquare)
    },
    {
      name: 'spoiler',
      title: 'Spoiler',
      icon: createIcon(faCaretSquareDown)
    },
    {
      name: 'table',
      title: 'Markdown Table'
    },
    {
      name: 'text',
      title: 'Text',
      icon: createIcon(faParagraph)
    },
    {