refactor(design-system): replace functional components (#3802)

* update creator item

* update warning tooltip

* update badge and trigger icon

* update action box

* update avatar component

* update badge

* update heading component

* update icon component

* update link component

* update menu

* update route component

* fix avatar bug

* fix avatar bug

* update input component

* update select

* update input

* update tags component

* update spinner

* update square button

* update tag component

* update text component

* add danger color

* add vue.extend

* add human readable names

* add human readable name

* revert button changes

* update name

* revert name

* update classes

* delete unused component

* redo name change

* rename

* rename back

* rename back

* update snapshots

packages/editor-ui/src/components/Badge.vue

@@ -1,19 +1,19 @@
-<template functional>
+<template>
   <fragment>
     <el-tag
-      v-if="props.type === 'danger'"
+      v-if="type === 'danger'"
       type="danger"
       size="small"
       :class="$style['danger']"
     >
-      {{ props.text }}
+      {{ text }}
     </el-tag>
     <el-tag
-      v-else-if="props.type === 'warning'"
+      v-else-if="type === 'warning'"
       size="small"
       :class="$style['warning']"
     >
-      {{ props.text }}
+      {{ text }}
     </el-tag>
   </fragment>
 </template>
@@ -48,4 +48,4 @@ export default {
   color: $--badge-warning-color;
   border: none;
 }
-</style>
+</style>