✨ feat(components): fit switch

components/element-ui/switch/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 xaboy
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

components/element-ui/switch/README.md

@@ -0,0 +1,6 @@
+# @form-create/component-elm-switch
+
+@form-create/element-ui 内置组件
+
+[GitHub](https://github.com/xaboy/form-create) | [文档](http://form-create.com/v3/) | [Document](http://form-create.com/v3/)
+

components/element-ui/switch/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "@form-create/component-elm-switch",
+  "version": "3.2.18",
+  "description": "@form-create/element-ui 内置组件",
+  "main": "./dist/index.min.js",
+  "module": "./dist/index.esm.js",
+  "unpkg": "./dist/index.min.js",
+  "jsdelivr": "./dist/index.min.js",
+  "scripts": {
+    "clean": "rimraf dist/",
+    "bili": "cross-env bili",
+    "build": "npm-run-all clean bili"
+  },
+  "files": [
+    "README.md",
+    "package.json",
+    "LICENSE",
+    "src",
+    "dist"
+  ],
+  "keywords": [
+    "@form-create",
+    "form-create-component",
+    "element-ui"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/xaboy/form-create.git"
+  },
+  "author": "xaboy",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/xaboy/form-create/issues"
+  },
+  "homepage": "http://www.form-create.com",
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@form-create/utils": "^3.2.18"
+  },
+  "buildFormCreateOptions": {
+    "name": "@form-create/component-elm-radio",
+    "exportName": "FcRadio",
+    "formats": [
+      "umd",
+      "esm"
+    ]
+  },
+  "gitHead": "3d024534b3ee103a96da1d3629582c0cdf19d9a8"
+}

components/element-ui/switch/src/component.jsx

@@ -0,0 +1,59 @@
+import getSlot from '@form-create/utils/lib/slot';
+import {computed, defineComponent, toRef} from 'vue';
+
+const NAME = 'fcSwitch';
+
+export default defineComponent({
+    name: NAME,
+    inheritAttrs: false,
+    props: {
+        formCreateInject: Object,
+        modelValue: {
+            type: [String, Number, Boolean],
+            default: '',
+        },
+        type: String,
+    },
+    emits: ['update:modelValue', 'fc.el'],
+    setup(props, _) {
+        const value = toRef(props, 'modelValue');
+        const {activeColor, inactiveColor} = _.attrs;
+
+        console.log(props)
+
+        const style = computed(() =>
+            [
+                {key: '--el-switch-on-color', value: activeColor},
+                {key: '--el-switch-off-color', value: inactiveColor},
+            ]
+                .filter((item) => item.value)
+                .map((item) => `${item.key}:${item.value}`)
+                .join(';')
+        );
+
+        const onInput = (n) => {
+            _.emit('update:modelValue', n);
+        };
+
+        return {
+            value,
+            onInput,
+            style,
+        };
+    },
+    render() {
+        return (
+            <ElSwitch
+                {...this.$attrs}
+                modelValue={this.value}
+                v-slots={getSlot(this.$slots, ['default'])}
+                onUpdate:modelValue={this.onInput}
+                ref="el"
+                style={this.style}
+            />
+        );
+    },
+    mounted() {
+        this.$emit('fc.el', this.$refs.el);
+    },
+});

components/element-ui/switch/src/index.js

@@ -0,0 +1,3 @@
+import Switch from './component';
+
+export default Switch;

components/naive-ui/switch/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 xaboy
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

components/naive-ui/switch/README.md

@@ -0,0 +1,6 @@
+# @form-create/component-naive-switch
+
+@form-create/naive-ui 内置组件
+
+[GitHub](https://github.com/xaboy/form-create) | [文档](http://form-create.com/v3/) | [Document](http://form-create.com/v3/)
+

components/naive-ui/switch/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "@form-create/component-naive-switch",
+  "version": "3.2.18",
+  "description": "@form-create/naive-ui 内置组件",
+  "main": "./dist/index.min.js",
+  "module": "./dist/index.esm.js",
+  "unpkg": "./dist/index.min.js",
+  "jsdelivr": "./dist/index.min.js",
+  "scripts": {
+    "clean": "rimraf dist/",
+    "bili": "cross-env bili",
+    "build": "npm-run-all clean bili"
+  },
+  "files": [
+    "README.md",
+    "package.json",
+    "LICENSE",
+    "src",
+    "dist"
+  ],
+  "keywords": [
+    "@form-create",
+    "form-create-component",
+    "naive-ui"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/xaboy/form-create.git"
+  },
+  "author": "xaboy",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/xaboy/form-create/issues"
+  },
+  "homepage": "http://www.form-create.com",
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@form-create/utils": "^3.2.18"
+  },
+  "buildFormCreateOptions": {
+    "name": "@form-create/component-naive-switch",
+    "exportName": "FcSwitch",
+    "formats": [
+      "umd",
+      "esm"
+    ]
+  },
+  "gitHead": "3d024534b3ee103a96da1d3629582c0cdf19d9a8"
+}

components/naive-ui/switch/src/component.jsx

@@ -0,0 +1,59 @@
+import getSlot from '@form-create/utils/lib/slot';
+import {defineComponent, ref} from 'vue';
+
+const NAME = 'fcSwitch';
+
+export default defineComponent({
+    name: NAME,
+    inheritAttrs: false,
+    props: {
+        formCreateInject: Object,
+        modelValue: {type: [String, Number, Boolean], default: ''},
+        type: String,
+    },
+    emits: ['update:modelValue', 'fc.el'],
+    setup(props, _) {
+        const value = ref(props.modelValue);
+        const {
+            activeColor,
+            inactiveColor,
+            activeValue = true,
+            inactiveValue = false,
+        } = _.attrs;
+
+        return {
+            value,
+            onInput(n) {
+                _.emit('update:modelValue', n);
+            },
+            activeValue,
+            inactiveValue,
+            railStyle: ({focused, checked}) => {
+                const style = {};
+                if (checked) {
+                    activeColor && (style.background = activeColor);
+                } else {
+                    inactiveColor && (style.background = inactiveColor);
+                }
+                return style;
+            },
+        };
+    },
+    render() {
+        return (
+            <NSwitch
+                {...this.$attrs}
+                v-model:value={this.value}
+                v-slots={getSlot(this.$slots, ['default'])}
+                onUpdate:value={this.onInput}
+                ref="el"
+                railStyle={this.railStyle}
+                checkedValue={this.activeValue}
+                uncheckedValue={this.inactiveValue}
+            />
+        );
+    },
+    mounted() {
+        this.$emit('fc.el', this.$refs.el);
+    },
+});

components/naive-ui/switch/src/index.js

@@ -0,0 +1,3 @@
+import Switch from './component';
+
+export default Switch;

packages/element-ui/package.json

@@ -51,6 +51,7 @@
         "@form-create/component-elm-group": "^3.2.19",
         "@form-create/component-elm-radio": "^3.2.18",
         "@form-create/component-elm-select": "^3.2.18",
+        "@form-create/component-elm-switch": "^3.2.18",
         "@form-create/component-elm-tree": "^3.2.18",
         "@form-create/component-elm-upload": "^3.2.18",
         "@form-create/component-subform": "^3.1.34",

packages/element-ui/src/components/index.js

@@ -1,10 +1,11 @@
 import checkbox from '@form-create/component-elm-checkbox/src/index';
 import frame from '@form-create/component-elm-frame/src/index';
+import group from '@form-create/component-elm-group/src/index';
 import radio from '@form-create/component-elm-radio/src/index';
 import select from '@form-create/component-elm-select/src/index';
+import Switch from '@form-create/component-elm-switch/src/index';
 import tree from '@form-create/component-elm-tree/src/index';
 import upload from '@form-create/component-elm-upload/src/index';
-import group from '@form-create/component-elm-group/src/index';
 import subForm from '@form-create/component-subform/src/index';
 import IconWarning from './icon/IconWarning.vue';
 
@@ -19,4 +20,5 @@ export default [
     group,
     subForm,
     IconWarning,
+    Switch,
 ]

packages/element-ui/src/core/alias.js

@@ -12,7 +12,7 @@ export default {
     timePicker: PRE + '-time-picker',
     timeSelect: PRE + '-time-select',
     datePicker: PRE + '-date-picker',
-    'switch': PRE + '-switch',
+    'switch': 'fc-switch',
     select: 'fc-select',
     checkbox: 'fc-checkbox',
     radio: 'fc-radio',

packages/naive-ui/package.json

@@ -51,6 +51,7 @@
     "@form-create/component-naive-group": "^3.2.19",
     "@form-create/component-naive-radio": "^3.2.18",
     "@form-create/component-naive-upload": "^3.2.18",
+    "@form-create/component-naive-switch": "^3.2.18",
     "@form-create/component-subform": "^3.1.34",
     "@form-create/core": "^3.2.20",
     "@form-create/utils": "^3.2.18"

packages/naive-ui/src/components/index.js

@@ -4,6 +4,7 @@ import Frame from '@form-create/component-naive-frame/src/index'
 import Group from '@form-create/component-naive-group/src/index'
 import Upload from '@form-create/component-naive-upload/src/index'
 import SubForm from '@form-create/component-subform/src/index'
+import Switch from '@form-create/component-naive-switch/src/index'
 import Eye from './icon/Eye.vue'
 import Info from './icon/Info'
 import Trash from './icon/Trash.vue'
@@ -17,5 +18,6 @@ export default [
     Frame,
     Eye,
     Info,
-    Trash
+    Trash,
+    Switch
 ]

packages/naive-ui/src/core/alias.js

@@ -9,7 +9,7 @@ export default {
     cascader: PRE + 'Cascader',
     timePicker: PRE + 'TimePicker',
     datePicker: PRE + 'DatePicker',
-    'switch': PRE + 'Switch',
+    'switch': 'fc-switch',
     select: PRE + 'Select',
     checkbox: 'fc-checkbox',
     radio: 'fc-radio',

packages/naive-ui/vue.config.js

@@ -17,5 +17,5 @@ module.exports = {
             ]
         }
     },
-    transpileDependencies: ['@form-create']
+    transpileDependencies: ['@form-create', 'date-fns']
 }