From 93dbaa0fd9be933cff626913d0a0c48e9ab5fbab Mon Sep 17 00:00:00 2001
From: Shigma <shigma10826@gmail.com>
Date: Sat, 27 May 2023 01:51:46 +0800
Subject: [PATCH] chore: enhance class names

---
 packages/form/package.json                 |  2 +-
 packages/form/src/base.vue                 | 12 ++++++------
 packages/form/src/extensions/intersect.vue | 12 ++++--------
 packages/form/src/extensions/object.vue    | 12 ++++--------
 packages/form/src/extensions/table.vue     |  4 ++--
 packages/form/src/primitive.vue            |  4 ++--
 packages/form/src/utils.ts                 |  2 +-
 7 files changed, 20 insertions(+), 28 deletions(-)

diff --git a/packages/form/package.json b/packages/form/package.json
index 1e62643..c525396 100644
--- a/packages/form/package.json
+++ b/packages/form/package.json
@@ -1,7 +1,7 @@
 {
   "name": "schemastery-vue",
   "description": "Type driven schema validator",
-  "version": "5.0.2",
+  "version": "5.0.3",
   "main": "src/index.ts",
   "repository": {
     "type": "git",
diff --git a/packages/form/src/base.vue b/packages/form/src/base.vue
index ad90e97..0c62169 100644
--- a/packages/form/src/base.vue
+++ b/packages/form/src/base.vue
@@ -1,8 +1,8 @@
 <template>
   <div class="k-schema-item" v-bind="$attrs">
     <div class="actions"></div>
-    <div class="header">
-      <div class="left">
+    <div class="k-schema-main">
+      <div class="k-schema-left">
         <h3>
           <slot name="title"></slot>
           <el-dropdown
@@ -21,7 +21,7 @@
         </h3>
         <slot name="desc"></slot>
       </div>
-      <div class="right">
+      <div class="k-schema-right">
         <template v-if="!collapsed">
           <slot name="prefix"></slot>
           <slot name="control"></slot>
@@ -124,7 +124,7 @@ if (import.meta.hot) {
     background-color: var(--el-fill-color-light);
   }
 
-  .header {
+  .k-schema-main {
     display: flex;
     flex-direction: row;
     justify-content: space-between;
@@ -154,7 +154,7 @@ if (import.meta.hot) {
     }
   }
 
-  .left {
+  .k-schema-left {
     .el-dropdown {
       margin-left: 0.5rem;
       margin-top: 2px;
@@ -168,7 +168,7 @@ if (import.meta.hot) {
     }
   }
 
-  .right {
+  .k-schema-right {
     display: flex;
     gap: 1rem;
     flex: 1;
diff --git a/packages/form/src/extensions/intersect.vue b/packages/form/src/extensions/intersect.vue
index b290242..254fc9d 100644
--- a/packages/form/src/extensions/intersect.vue
+++ b/packages/form/src/extensions/intersect.vue
@@ -16,19 +16,15 @@
   </k-schema>
 </template>
 
-<script lang="ts">
-
-export default {
-  inheritAttrs: false,
-}
-
-</script>
-
 <script lang="ts" setup>
 
 import { PropType } from 'vue'
 import { getChoices, Schema } from '../utils'
 
+defineOptions({
+  inheritAttrs: false,
+})
+
 defineProps({
   schema: {} as PropType<Schema>,
   modelValue: {} as PropType<any>,
diff --git a/packages/form/src/extensions/object.vue b/packages/form/src/extensions/object.vue
index 222b4e7..33ad040 100644
--- a/packages/form/src/extensions/object.vue
+++ b/packages/form/src/extensions/object.vue
@@ -30,20 +30,16 @@
   </k-schema>
 </template>
 
-<script lang="ts">
-
-export default {
-  inheritAttrs: false,
-}
-
-</script>
-
 <script lang="ts" setup>
 
 import { PropType, computed } from 'vue'
 import { Schema, useConfig, useI18nText } from '../utils'
 import SchemaBase from '../base.vue'
 
+defineOptions({
+  inheritAttrs: false,
+})
+
 const props = defineProps({
   schema: {} as PropType<Schema>,
   modelValue: {} as PropType<any>,
diff --git a/packages/form/src/extensions/table.vue b/packages/form/src/extensions/table.vue
index a832bf1..6509f08 100644
--- a/packages/form/src/extensions/table.vue
+++ b/packages/form/src/extensions/table.vue
@@ -112,7 +112,7 @@ if (import.meta.hot) {
       display: flex;
       justify-content: center;
       align-items: center;
-      color: var(--fg3);
+      color: var(--k-text-light);
       transition: var(--color-transition);
       cursor: pointer;
     }
@@ -122,7 +122,7 @@ if (import.meta.hot) {
     }
 
     .inner:hover {
-      color: var(--fg1);
+      color: var(--k-text-dark);
     }
 
     .k-icon {
diff --git a/packages/form/src/primitive.vue b/packages/form/src/primitive.vue
index be055d8..df520de 100644
--- a/packages/form/src/primitive.vue
+++ b/packages/form/src/primitive.vue
@@ -88,12 +88,12 @@ function onClickExternal(value: string) {
 .k-schema-item {
   .el-input {
     .k-icon {
-      color: var(--fg3);
+      color: var(--k-text-light);
       transition: var(--color-transition);
       cursor: pointer;
 
       &:hover {
-        color: var(--fg1);
+        color: var(--k-text-dark);
       }
     }
 
diff --git a/packages/form/src/utils.ts b/packages/form/src/utils.ts
index 494d9f6..78b32ea 100644
--- a/packages/form/src/utils.ts
+++ b/packages/form/src/utils.ts
@@ -11,7 +11,7 @@ export function useI18nText() {
   const composer = useI18n()
   const context: any = {}
   return (message: string | Dict<string>) => {
-    if (!message || typeof message === 'string') return message
+    if (!message || typeof message === 'string') return message as string
     const locales = fallbackWithLocaleChain(context, composer.fallbackLocale.value, composer.locale.value)
     for (const locale of locales) {
       if (locale in message) return message[locale]