From 50dfb5372b6e87a8fe25c325644e38e3d71b0f78 Mon Sep 17 00:00:00 2001
From: 1549469775 <1549469775@qq.com>
Date: Mon, 6 Jun 2022 10:38:35 +0800
Subject: [PATCH] fixed bug

---
 package.json                             |  2 +-
 packages/components/captcha/index.ts     |  2 --
 packages/components/captcha/index.vue    | 12 ++++++++++--
 packages/playground/components.d.ts      |  1 +
 packages/playground/package.json         |  2 +-
 packages/playground/src/App.vue          | 13 ++++++++++---
 packages/theme-chalk/gulpfile.ts         | 14 ++++++++++----
 packages/theme-chalk/src/button.scss     |  1 +
 packages/theme-chalk/src/captcha.scss    | 19 +++++++++++++++++--
 packages/theme-chalk/src/common/var.scss |  1 +
 packages/theme-chalk/src/index.scss      |  5 +----
 tsconfig.json                            |  1 +
 12 files changed, 54 insertions(+), 19 deletions(-)
 create mode 100644 packages/theme-chalk/src/common/var.scss

diff --git a/package.json b/package.json
index 1331f11..7573992 100644
--- a/package.json
+++ b/package.json
@@ -17,7 +17,7 @@
         "doc:dev": "pnpm run -C docs dev",
         "doc:build": "pnpm run -C docs build",
         "doc:serve": "pnpm run -C docs serve",
-        "build": "pnpm run -C packages/build build && pnpm run -C packages/princess-ui build",
+        "build": "pnpm run -C packages/build build && pnpm run -C packages/theme-chalk build && pnpm run -C packages/princess-ui build",
         "theme": "pnpm run -C packages/theme-chalk build",
         "release": "cd packages/princess-ui & npm publish"
     },
diff --git a/packages/components/captcha/index.ts b/packages/components/captcha/index.ts
index aeea16e..e1759b7 100644
--- a/packages/components/captcha/index.ts
+++ b/packages/components/captcha/index.ts
@@ -1,7 +1,5 @@
 import PsCaptcha from "./index.vue"
 
-PsCaptcha.name = "ps-captcha"
-
 export {
     PsCaptcha
 }
diff --git a/packages/components/captcha/index.vue b/packages/components/captcha/index.vue
index 29d4a63..bbf6291 100644
--- a/packages/components/captcha/index.vue
+++ b/packages/components/captcha/index.vue
@@ -1,11 +1,18 @@
 <template>
-    <div class="ps-send" @click="onClick" :disabled="isDisabled" :loading="isLoading" type="button" size="small">
+    <div class="ps-send" :class="[size ? 'ps-send--' + size : '']" @click="onClick" :disabled="isDisabled"
+        :loading="isLoading" type="button" size="small">
         {{ text }}
     </div>
 </template>
 
+<script lang="ts">
+export default defineComponent({
+    name: "ps-captcha"
+})
+</script>
+
 <script lang="ts" setup>
-import { onBeforeUnmount, ref } from "vue"
+import { defineComponent, onBeforeUnmount, ref } from "vue"
 const props = withDefaults(
     defineProps<{
         duration?: number
@@ -13,6 +20,7 @@ const props = withDefaults(
         runText?: string
         loadingText?: string
         resetText?: string
+        size?: "small" | "big"
     }>(),
     {
         runText: "{%s}s 后重新发送",
diff --git a/packages/playground/components.d.ts b/packages/playground/components.d.ts
index 035339f..12efac8 100644
--- a/packages/playground/components.d.ts
+++ b/packages/playground/components.d.ts
@@ -6,6 +6,7 @@ import '@vue/runtime-core'
 declare module '@vue/runtime-core' {
   export interface GlobalComponents {
     HelloWorld: typeof import('./src/components/HelloWorld.vue')['default']
+    PsCaptcha: typeof import('@princess-ui/components/captcha')['PsCaptcha']
   }
 }
 
diff --git a/packages/playground/package.json b/packages/playground/package.json
index 729a091..4e39d15 100644
--- a/packages/playground/package.json
+++ b/packages/playground/package.json
@@ -3,7 +3,7 @@
   "private": true,
   "version": "0.0.0",
   "scripts": {
-    "dev": "vite",
+    "dev": "vite --port=3433",
     "build": "vue-tsc --noEmit && vite build",
     "preview": "vite preview"
   },
diff --git a/packages/playground/src/App.vue b/packages/playground/src/App.vue
index e8992b2..c3c8126 100644
--- a/packages/playground/src/App.vue
+++ b/packages/playground/src/App.vue
@@ -13,15 +13,22 @@ function send(start: () => void, done: (isDone: boolean) => void) {
 
 <template>
     <ps-captcha @send="send" :duration="5">sada</ps-captcha>
+    <ps-captcha size="small" @send="send" :duration="5">sada</ps-captcha>
+    <ps-captcha size="big" @send="send" :duration="5">sada</ps-captcha>
 </template>
 
 <style>
+html,body{
+    margin: 0;
+    padding: 0;
+}
 #app {
-    font-family: Avenir, Helvetica, Arial, sans-serif;
+    display: flex;
+    justify-content: center;
+    align-items: center;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     text-align: center;
-    color: #2c3e50;
-    margin-top: 60px;
+    height: 100vh;
 }
 </style>
diff --git a/packages/theme-chalk/gulpfile.ts b/packages/theme-chalk/gulpfile.ts
index fcb03ae..9278bce 100644
--- a/packages/theme-chalk/gulpfile.ts
+++ b/packages/theme-chalk/gulpfile.ts
@@ -8,10 +8,16 @@ import cleanCSS from 'gulp-clean-css'
 import rename from 'gulp-rename'
 import consola from 'consola'
 import { getOutput } from "@princess-ui/share";
+import rimraf from "rimraf"
 
 const distFolder = path.resolve(__dirname, 'dist')
 const distBundle = getOutput("theme-chalk")
 
+function clean(cb) {
+    rimraf.sync(distBundle)
+    cb()
+}
+
 /**
  * compile theme-chalk scss & minify
  * not use sass.sync().on('error', sass.logError) to throw exception
@@ -80,9 +86,9 @@ export function copyThemeChalkSource() {
   )
 }
 
-export const build = parallel(
-  copyThemeChalkSource,
-  series(buildThemeChalk, buildDarkCssVars, copyThemeChalkBundle)
-)
+export const build = series(clean, parallel(
+    copyThemeChalkSource,
+    series(buildThemeChalk, buildDarkCssVars, copyThemeChalkBundle)
+))
 
 export default build
\ No newline at end of file
diff --git a/packages/theme-chalk/src/button.scss b/packages/theme-chalk/src/button.scss
index 51c35c3..981e602 100644
--- a/packages/theme-chalk/src/button.scss
+++ b/packages/theme-chalk/src/button.scss
@@ -1,3 +1,4 @@
+@use "common/var.scss";
 
 div{
     color: darkkhaki;
diff --git a/packages/theme-chalk/src/captcha.scss b/packages/theme-chalk/src/captcha.scss
index 46ae780..c733321 100644
--- a/packages/theme-chalk/src/captcha.scss
+++ b/packages/theme-chalk/src/captcha.scss
@@ -1,4 +1,19 @@
-.ps-send{
+@use 'common/var.scss';
+
+.ps-send {
+    user-select: none;
     color: blue;
     cursor: pointer;
-}
\ No newline at end of file
+    display: inline-block;
+    padding: 4px 10px;
+    border-radius: 15px;
+    border: 1px solid blue;
+    &--small {
+        font-size: 14px;
+        padding: 2px 6px;
+    }
+    &--big {
+        font-size: 18px;
+        padding: 4px 10px;
+    }
+}
diff --git a/packages/theme-chalk/src/common/var.scss b/packages/theme-chalk/src/common/var.scss
new file mode 100644
index 0000000..8b13789
--- /dev/null
+++ b/packages/theme-chalk/src/common/var.scss
@@ -0,0 +1 @@
+
diff --git a/packages/theme-chalk/src/index.scss b/packages/theme-chalk/src/index.scss
index 7bdaf62..7e4c069 100644
--- a/packages/theme-chalk/src/index.scss
+++ b/packages/theme-chalk/src/index.scss
@@ -1,5 +1,2 @@
 @import "./button.scss";
-@import "./send.scss";
-div{
-    color: rosybrown;
-}
\ No newline at end of file
+@import "./captcha.scss";
diff --git a/tsconfig.json b/tsconfig.json
index 98cc37f..a1eae00 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -13,6 +13,7 @@
     },
     "include": ["packages", "typings"],
     "exclude": [
+        "packages/princess-ui/lib/**/*",
         "node_modules",
         "**/dist",
         "**/__tests__/**/*",