refactor: convert part of component from .vue to .tsx

Author: kagol

devui/button/demo/button-demo.tsx

@@ -0,0 +1,31 @@
+import { defineComponent } from 'vue'
+import CodeBox from '../../shared/devui-codebox/devui-codebox'
+import ButtonPrimary from './primary/primary'
+import ButtonCommon from './common/common'
+
+export default defineComponent({
+  name: 'd-button-demo',
+  setup() {
+    const primarySource = {};
+    const commonSource = {};
+
+    return () => {
+      return <div class="demo-container">
+      <div class="demo-example">
+        <div class="demo-title">{ '主要按钮' }</div>
+        <div class="demo-text"></div>
+        <CodeBox id="components-button-primary" sourceData={primarySource}>
+          <ButtonPrimary></ButtonPrimary>
+        </CodeBox>
+      </div>
+      <div class="demo-example">
+        <div class="demo-title">{ '次要按钮' }</div>
+        <div class="demo-text"></div>
+        <CodeBox id="components-button-common" sourceData={commonSource}>
+          <ButtonCommon></ButtonCommon>
+        </CodeBox>
+      </div>
+    </div>
+    }
+  }
+})

devui/button/demo/button-demo.vue

@@ -1,4 +1,4 @@
-import ButtonDemoComponent from './button-demo.vue'
+import ButtonDemoComponent from './button-demo'
 import DevUIApiComponent from '../../shared/devui-api/devui-api'
 
 const routes = [

devui/button/demo/button.route.ts

@@ -0,0 +1,17 @@
+import { defineComponent } from 'vue'
+
+export default defineComponent({
+  name: 'd-codebox',
+  props: {
+    id: String,
+    sourceData: Object
+  },
+  setup(props, ctx) {
+    return () => {
+      return <div>
+        devui-codebox
+        {ctx.slots.default?.()}
+      </div>
+    }
+  }
+})

devui/shared/devui-codebox/devui-codebox.tsx

@@ -0,0 +1,12 @@
+import { defineComponent } from 'vue'
+
+export default defineComponent({
+  name: 'd-highlight',
+  props: {
+  },
+  setup(props, ctx) {
+    return () => {
+      return <div>devui-highlight</div>
+    }
+  }
+})

devui/shared/devui-codebox/devui-codebox.vue

@@ -23,7 +23,7 @@
 </template>
 
 <script>
-import ButtonDemo from '../../devui/button/demo/button-demo.vue'
+import ButtonDemo from '../../devui/button/demo/button-demo'
 import Tabs from '../../devui/tabs/tabs'
 import Tab from '../../devui/tabs/tab'