@vuesimple/vs-switch 3.1.5 → 3.1.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +0 -4
- package/build/vite.config.js +2 -2
- package/dist/index.esm.js +17 -18
- package/dist/index.min.js +2 -3
- package/dist/index.umd.js +2 -3
- package/package.json +4 -3
- package/src/vs-switch.vue +3 -2
package/README.md
CHANGED
package/build/vite.config.js
CHANGED
|
@@ -2,10 +2,10 @@ import vue from '@vitejs/plugin-vue';
|
|
|
2
2
|
import cssInjectedByJsPlugin from 'vite-plugin-css-injected-by-js';
|
|
3
3
|
|
|
4
4
|
export default {
|
|
5
|
-
plugins: [vue(), cssInjectedByJsPlugin()],
|
|
5
|
+
plugins: [vue(), cssInjectedByJsPlugin({ styleId: 'vs-switch-styles' })],
|
|
6
6
|
build: {
|
|
7
7
|
// separate css file or not
|
|
8
|
-
cssCodeSplit:
|
|
8
|
+
cssCodeSplit: false,
|
|
9
9
|
lib: {
|
|
10
10
|
entry: './src/index.js',
|
|
11
11
|
formats: ['es', 'umd', 'iife'],
|
package/dist/index.esm.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
(function(){"use strict";try{if(typeof document<"u"){var s=document.createElement("style");s.appendChild(document.createTextNode("[data-theme=dark] .vs-switch,.dark .vs-switch{--vs-switch-bg-unchecked: #3a3a3a;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #555555}.vs-switch{--vs-switch-bg-unchecked: #e9ebed;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #d1d5db;--vs-switch-primary: #1f73b7;--vs-switch-success: #186146;--vs-switch-danger: #cc3340;--vs-switch-warning: #ffb057;--vs-switch-secondary: #3a3a3a;--vs-switch-indigo: #4f46e5;--vs-switch-cyan: #06b6d4;--vs-switch-orange: #f97316;--vs-switch-crimson: #dc2626;--vs-switch-gray: #6b7280;position:relative;display:inline-flex;align-items:center;justify-content:flex-start;cursor:pointer;border:none;padding:0;background:none;transition:all .2s ease;border-radius:var(--vs-switch-border-radius)}.vs-switch:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--vs-switch-bg-checked)}.vs-switch:disabled{cursor:not-allowed;opacity:.5}.vs-switch__size-small{width:36px;height:20px;--vs-switch-border-radius: 10px}.vs-switch__size-small .vs-switch__thumb{width:16px;height:16px}.vs-switch__size-small.vs-switch--checked .vs-switch__thumb{transform:translate(16px)}.vs-switch__size-medium{width:44px;height:24px;--vs-switch-border-radius: 12px}.vs-switch__size-medium .vs-switch__thumb{width:20px;height:20px}.vs-switch__size-medium.vs-switch--checked .vs-switch__thumb{transform:translate(20px)}.vs-switch__size-large{width:52px;height:28px;--vs-switch-border-radius: 14px}.vs-switch__size-large .vs-switch__thumb{width:24px;height:24px}.vs-switch__size-large.vs-switch--checked .vs-switch__thumb{transform:translate(24px)}.vs-switch__radius-none{--vs-switch-border-radius: 0}.vs-switch__radius-small{--vs-switch-border-radius: 4px}.vs-switch__radius-medium{--vs-switch-border-radius: 6px}.vs-switch__radius-large{--vs-switch-border-radius: 8px}.vs-switch__radius-full{--vs-switch-border-radius: 100px}.vs-switch__variant-classic{background:var(--vs-switch-bg-unchecked);border:1px solid var(--vs-switch-border)}.vs-switch__variant-classic.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked));border-color:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-surface{background:#f0f1f3;border:1px solid transparent}.vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-surface,.dark .vs-switch__variant-surface{background:#4a5568}[data-theme=dark] .vs-switch__variant-surface.vs-switch--checked,.dark .vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-soft{background:rgba(31,115,183,.1);border:1px solid transparent}.vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-soft,.dark .vs-switch__variant-soft{background:rgba(31,115,183,.2)}[data-theme=dark] .vs-switch__variant-soft.vs-switch--checked,.dark .vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #1f73b7)}.vs-switch__color-success.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #186146)}.vs-switch__color-danger.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #cc3340)}.vs-switch__color-warning.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #ffb057)}.vs-switch__color-warning.vs-switch--checked .vs-switch__thumb{background:#703815}.vs-switch__color-secondary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3a3a3a)}.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #4f46e5)}.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #06b6d4)}.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #f97316)}.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #dc2626)}.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #6b7280)}.vs-switch--high-contrast.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0d47a1)}.vs-switch--high-contrast.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3730a3)}.vs-switch--high-contrast.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0369a1)}.vs-switch--high-contrast.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #c2410c)}.vs-switch--high-contrast.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #7f1d1d)}.vs-switch--high-contrast.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #374151)}.vs-switch__thumb{position:absolute;left:2px;width:20px;height:20px;background:var(--vs-switch-thumb);border-radius:50%;transition:transform .2s ease;pointer-events:none;box-shadow:0 1px 3px #0000001a}.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch--disabled{opacity:.5;cursor:not-allowed}")),document.head.appendChild(s)}}catch(c){console.error("vite-plugin-css-injected-by-js",c)}})();
|
|
1
|
+
(function(){"use strict";try{if(typeof document<"u"){var s=document.createElement("style");s.id="vs-switch-styles",s.appendChild(document.createTextNode("[data-theme=dark] .vs-switch,.dark .vs-switch{--vs-switch-bg-unchecked: #3a3a3a;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #555555}.vs-switch{--vs-switch-bg-unchecked: #e9ebed;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #d1d5db;--vs-switch-primary: #1f73b7;--vs-switch-success: #186146;--vs-switch-danger: #cc3340;--vs-switch-warning: #ffb057;--vs-switch-secondary: #3a3a3a;--vs-switch-indigo: #4f46e5;--vs-switch-cyan: #06b6d4;--vs-switch-orange: #f97316;--vs-switch-crimson: #dc2626;--vs-switch-gray: #6b7280;position:relative;display:inline-flex;align-items:center;justify-content:flex-start;cursor:pointer;border:none;padding:0;background:none;transition:all .2s ease;border-radius:var(--vs-switch-border-radius)}.vs-switch:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--vs-switch-bg-checked)}.vs-switch:disabled{cursor:not-allowed;opacity:.5}.vs-switch__size-small{width:36px;height:20px;--vs-switch-border-radius: 10px}.vs-switch__size-small .vs-switch__thumb{width:16px;height:16px}.vs-switch__size-small.vs-switch--checked .vs-switch__thumb{transform:translate(16px)}.vs-switch__size-medium{width:44px;height:24px;--vs-switch-border-radius: 12px}.vs-switch__size-medium .vs-switch__thumb{width:20px;height:20px}.vs-switch__size-medium.vs-switch--checked .vs-switch__thumb{transform:translate(20px)}.vs-switch__size-large{width:52px;height:28px;--vs-switch-border-radius: 14px}.vs-switch__size-large .vs-switch__thumb{width:24px;height:24px}.vs-switch__size-large.vs-switch--checked .vs-switch__thumb{transform:translate(24px)}.vs-switch__radius-none{--vs-switch-border-radius: 0}.vs-switch__radius-small{--vs-switch-border-radius: 4px}.vs-switch__radius-medium{--vs-switch-border-radius: 6px}.vs-switch__radius-large{--vs-switch-border-radius: 8px}.vs-switch__radius-full{--vs-switch-border-radius: 100px}.vs-switch__variant-classic{background:var(--vs-switch-bg-unchecked);border:1px solid var(--vs-switch-border)}.vs-switch__variant-classic.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked));border-color:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-surface{background:#f0f1f3;border:1px solid transparent}.vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-surface,.dark .vs-switch__variant-surface{background:#4a5568}[data-theme=dark] .vs-switch__variant-surface.vs-switch--checked,.dark .vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-soft{background:rgba(31,115,183,.1);border:1px solid transparent}.vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-soft,.dark .vs-switch__variant-soft{background:rgba(31,115,183,.2)}[data-theme=dark] .vs-switch__variant-soft.vs-switch--checked,.dark .vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #1f73b7)}.vs-switch__color-success.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #186146)}.vs-switch__color-danger.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #cc3340)}.vs-switch__color-warning.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #ffb057)}.vs-switch__color-warning.vs-switch--checked .vs-switch__thumb{background:#703815}.vs-switch__color-secondary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3a3a3a)}.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #4f46e5)}.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #06b6d4)}.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #f97316)}.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #dc2626)}.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #6b7280)}.vs-switch--high-contrast.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0d47a1)}.vs-switch--high-contrast.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3730a3)}.vs-switch--high-contrast.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0369a1)}.vs-switch--high-contrast.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #c2410c)}.vs-switch--high-contrast.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #7f1d1d)}.vs-switch--high-contrast.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #374151)}.vs-switch__thumb{position:absolute;left:2px;width:20px;height:20px;background:var(--vs-switch-thumb);border-radius:50%;transition:transform .2s ease;pointer-events:none;box-shadow:0 1px 3px #0000001a}.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch--disabled{opacity:.5;cursor:not-allowed}")),document.head.appendChild(s)}}catch(c){console.error("vite-plugin-css-injected-by-js",c)}})();
|
|
2
2
|
import { openBlock as r, createElementBlock as o, normalizeClass as d, normalizeStyle as n, createElementVNode as h } from "vue";
|
|
3
|
-
const u = (e,
|
|
4
|
-
const
|
|
5
|
-
for (const [i, l] of
|
|
6
|
-
|
|
7
|
-
return
|
|
3
|
+
const u = (e, t) => {
|
|
4
|
+
const s = e.__vccOpts || e;
|
|
5
|
+
for (const [i, l] of t)
|
|
6
|
+
s[i] = l;
|
|
7
|
+
return s;
|
|
8
8
|
}, m = {
|
|
9
9
|
name: "VsSwitch",
|
|
10
10
|
props: {
|
|
@@ -65,7 +65,6 @@ const u = (e, s) => {
|
|
|
65
65
|
`vs-switch__size-${this.size}`,
|
|
66
66
|
`vs-switch__variant-${this.variant}`,
|
|
67
67
|
`vs-switch__color-${this.color}`,
|
|
68
|
-
`vs-switch__radius-${this.radius}`,
|
|
69
68
|
{
|
|
70
69
|
"vs-switch--checked": this.isChecked,
|
|
71
70
|
"vs-switch--disabled": this.disabled,
|
|
@@ -90,27 +89,27 @@ const u = (e, s) => {
|
|
|
90
89
|
}
|
|
91
90
|
}
|
|
92
91
|
}
|
|
93
|
-
},
|
|
94
|
-
function
|
|
92
|
+
}, g = ["aria-checked", "aria-label", "disabled"];
|
|
93
|
+
function _(e, t, s, i, l, a) {
|
|
95
94
|
return r(), o("button", {
|
|
96
95
|
class: d(["vs-switch", a.classList]),
|
|
97
96
|
style: n(a.isCssVars),
|
|
98
97
|
"aria-checked": a.isChecked,
|
|
99
|
-
"aria-label":
|
|
98
|
+
"aria-label": s.ariaLabel,
|
|
100
99
|
role: "switch",
|
|
101
100
|
type: "button",
|
|
102
|
-
disabled:
|
|
103
|
-
onClick:
|
|
104
|
-
}, [...
|
|
101
|
+
disabled: s.disabled,
|
|
102
|
+
onClick: t[0] || (t[0] = (...c) => a.toggle && a.toggle(...c))
|
|
103
|
+
}, [...t[1] || (t[1] = [
|
|
105
104
|
h("span", { class: "vs-switch__thumb" }, null, -1)
|
|
106
|
-
])], 14,
|
|
105
|
+
])], 14, g);
|
|
107
106
|
}
|
|
108
|
-
const
|
|
107
|
+
const f = /* @__PURE__ */ u(m, [["render", _]]), v = {
|
|
109
108
|
install(e) {
|
|
110
|
-
e.component("VsSwitch",
|
|
109
|
+
e.component("VsSwitch", f);
|
|
111
110
|
}
|
|
112
111
|
};
|
|
113
112
|
export {
|
|
114
|
-
|
|
115
|
-
|
|
113
|
+
f as default,
|
|
114
|
+
v as plugin
|
|
116
115
|
};
|
package/dist/index.min.js
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
(function(){"use strict";try{if(typeof document<"u"){var s=document.createElement("style");s.appendChild(document.createTextNode("[data-theme=dark] .vs-switch,.dark .vs-switch{--vs-switch-bg-unchecked: #3a3a3a;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #555555}.vs-switch{--vs-switch-bg-unchecked: #e9ebed;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #d1d5db;--vs-switch-primary: #1f73b7;--vs-switch-success: #186146;--vs-switch-danger: #cc3340;--vs-switch-warning: #ffb057;--vs-switch-secondary: #3a3a3a;--vs-switch-indigo: #4f46e5;--vs-switch-cyan: #06b6d4;--vs-switch-orange: #f97316;--vs-switch-crimson: #dc2626;--vs-switch-gray: #6b7280;position:relative;display:inline-flex;align-items:center;justify-content:flex-start;cursor:pointer;border:none;padding:0;background:none;transition:all .2s ease;border-radius:var(--vs-switch-border-radius)}.vs-switch:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--vs-switch-bg-checked)}.vs-switch:disabled{cursor:not-allowed;opacity:.5}.vs-switch__size-small{width:36px;height:20px;--vs-switch-border-radius: 10px}.vs-switch__size-small .vs-switch__thumb{width:16px;height:16px}.vs-switch__size-small.vs-switch--checked .vs-switch__thumb{transform:translate(16px)}.vs-switch__size-medium{width:44px;height:24px;--vs-switch-border-radius: 12px}.vs-switch__size-medium .vs-switch__thumb{width:20px;height:20px}.vs-switch__size-medium.vs-switch--checked .vs-switch__thumb{transform:translate(20px)}.vs-switch__size-large{width:52px;height:28px;--vs-switch-border-radius: 14px}.vs-switch__size-large .vs-switch__thumb{width:24px;height:24px}.vs-switch__size-large.vs-switch--checked .vs-switch__thumb{transform:translate(24px)}.vs-switch__radius-none{--vs-switch-border-radius: 0}.vs-switch__radius-small{--vs-switch-border-radius: 4px}.vs-switch__radius-medium{--vs-switch-border-radius: 6px}.vs-switch__radius-large{--vs-switch-border-radius: 8px}.vs-switch__radius-full{--vs-switch-border-radius: 100px}.vs-switch__variant-classic{background:var(--vs-switch-bg-unchecked);border:1px solid var(--vs-switch-border)}.vs-switch__variant-classic.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked));border-color:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-surface{background:#f0f1f3;border:1px solid transparent}.vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-surface,.dark .vs-switch__variant-surface{background:#4a5568}[data-theme=dark] .vs-switch__variant-surface.vs-switch--checked,.dark .vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-soft{background:rgba(31,115,183,.1);border:1px solid transparent}.vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-soft,.dark .vs-switch__variant-soft{background:rgba(31,115,183,.2)}[data-theme=dark] .vs-switch__variant-soft.vs-switch--checked,.dark .vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #1f73b7)}.vs-switch__color-success.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #186146)}.vs-switch__color-danger.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #cc3340)}.vs-switch__color-warning.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #ffb057)}.vs-switch__color-warning.vs-switch--checked .vs-switch__thumb{background:#703815}.vs-switch__color-secondary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3a3a3a)}.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #4f46e5)}.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #06b6d4)}.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #f97316)}.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #dc2626)}.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #6b7280)}.vs-switch--high-contrast.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0d47a1)}.vs-switch--high-contrast.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3730a3)}.vs-switch--high-contrast.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0369a1)}.vs-switch--high-contrast.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #c2410c)}.vs-switch--high-contrast.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #7f1d1d)}.vs-switch--high-contrast.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #374151)}.vs-switch__thumb{position:absolute;left:2px;width:20px;height:20px;background:var(--vs-switch-thumb);border-radius:50%;transition:transform .2s ease;pointer-events:none;box-shadow:0 1px 3px #0000001a}.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch--disabled{opacity:.5;cursor:not-allowed}")),document.head.appendChild(s)}}catch(c){console.error("vite-plugin-css-injected-by-js",c)}})();
|
|
2
|
-
var VsSwitch=function(
|
|
3
|
-
`,document.head.appendChild(r);const g="",v=(s,c)=>{const e=s.__vccOpts||s;for(const[o,d]of c)e[o]=d;return e},w={name:"VsSwitch",props:{modelValue:{type:Boolean,default:!1},size:{type:String,default:"medium",validator:s=>["small","medium","large"].includes(s)},variant:{type:String,default:"classic",validator:s=>["classic","surface","soft"].includes(s)},color:{type:String,default:"primary"},highContrast:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},ariaLabel:{type:String},checkedBgColor:{type:String}},emits:["update:modelValue","change"],computed:{isChecked(){return this.modelValue},classList(){return[`vs-switch__size-${this.size}`,`vs-switch__variant-${this.variant}`,`vs-switch__color-${this.color}`,`vs-switch__radius-${this.radius}`,{"vs-switch--checked":this.isChecked,"vs-switch--disabled":this.disabled,"vs-switch--high-contrast":this.highContrast}]},cssVars(){return{"--vs-switch-checked-bg-color":this.checkedBgColor}},isCssVars(){return this.checkedBgColor?this.cssVars:""}},methods:{toggle(){if(!this.disabled){const s=!this.isChecked;this.$emit("update:modelValue",s),this.$emit("change",s)}}}},n=["aria-checked","aria-label","disabled"];function l(s,c,e,o,d,i){return t.openBlock(),t.createElementBlock("button",{class:t.normalizeClass(["vs-switch",i.classList]),style:t.normalizeStyle(i.isCssVars),"aria-checked":i.isChecked,"aria-label":e.ariaLabel,role:"switch",type:"button",disabled:e.disabled,onClick:c[0]||(c[0]=(...b)=>i.toggle&&i.toggle(...b))},[...c[1]||(c[1]=[t.createElementVNode("span",{class:"vs-switch__thumb"},null,-1)])],14,n)}const a=v(w,[["render",l]]),_={install(s){s.component("VsSwitch",a)}};return h.default=a,h.plugin=_,Object.defineProperties(h,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}}),h}({},Vue);
|
|
1
|
+
(function(){"use strict";try{if(typeof document<"u"){var s=document.createElement("style");s.id="vs-switch-styles",s.appendChild(document.createTextNode("[data-theme=dark] .vs-switch,.dark .vs-switch{--vs-switch-bg-unchecked: #3a3a3a;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #555555}.vs-switch{--vs-switch-bg-unchecked: #e9ebed;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #d1d5db;--vs-switch-primary: #1f73b7;--vs-switch-success: #186146;--vs-switch-danger: #cc3340;--vs-switch-warning: #ffb057;--vs-switch-secondary: #3a3a3a;--vs-switch-indigo: #4f46e5;--vs-switch-cyan: #06b6d4;--vs-switch-orange: #f97316;--vs-switch-crimson: #dc2626;--vs-switch-gray: #6b7280;position:relative;display:inline-flex;align-items:center;justify-content:flex-start;cursor:pointer;border:none;padding:0;background:none;transition:all .2s ease;border-radius:var(--vs-switch-border-radius)}.vs-switch:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--vs-switch-bg-checked)}.vs-switch:disabled{cursor:not-allowed;opacity:.5}.vs-switch__size-small{width:36px;height:20px;--vs-switch-border-radius: 10px}.vs-switch__size-small .vs-switch__thumb{width:16px;height:16px}.vs-switch__size-small.vs-switch--checked .vs-switch__thumb{transform:translate(16px)}.vs-switch__size-medium{width:44px;height:24px;--vs-switch-border-radius: 12px}.vs-switch__size-medium .vs-switch__thumb{width:20px;height:20px}.vs-switch__size-medium.vs-switch--checked .vs-switch__thumb{transform:translate(20px)}.vs-switch__size-large{width:52px;height:28px;--vs-switch-border-radius: 14px}.vs-switch__size-large .vs-switch__thumb{width:24px;height:24px}.vs-switch__size-large.vs-switch--checked .vs-switch__thumb{transform:translate(24px)}.vs-switch__radius-none{--vs-switch-border-radius: 0}.vs-switch__radius-small{--vs-switch-border-radius: 4px}.vs-switch__radius-medium{--vs-switch-border-radius: 6px}.vs-switch__radius-large{--vs-switch-border-radius: 8px}.vs-switch__radius-full{--vs-switch-border-radius: 100px}.vs-switch__variant-classic{background:var(--vs-switch-bg-unchecked);border:1px solid var(--vs-switch-border)}.vs-switch__variant-classic.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked));border-color:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-surface{background:#f0f1f3;border:1px solid transparent}.vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-surface,.dark .vs-switch__variant-surface{background:#4a5568}[data-theme=dark] .vs-switch__variant-surface.vs-switch--checked,.dark .vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-soft{background:rgba(31,115,183,.1);border:1px solid transparent}.vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-soft,.dark .vs-switch__variant-soft{background:rgba(31,115,183,.2)}[data-theme=dark] .vs-switch__variant-soft.vs-switch--checked,.dark .vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #1f73b7)}.vs-switch__color-success.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #186146)}.vs-switch__color-danger.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #cc3340)}.vs-switch__color-warning.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #ffb057)}.vs-switch__color-warning.vs-switch--checked .vs-switch__thumb{background:#703815}.vs-switch__color-secondary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3a3a3a)}.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #4f46e5)}.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #06b6d4)}.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #f97316)}.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #dc2626)}.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #6b7280)}.vs-switch--high-contrast.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0d47a1)}.vs-switch--high-contrast.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3730a3)}.vs-switch--high-contrast.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0369a1)}.vs-switch--high-contrast.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #c2410c)}.vs-switch--high-contrast.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #7f1d1d)}.vs-switch--high-contrast.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #374151)}.vs-switch__thumb{position:absolute;left:2px;width:20px;height:20px;background:var(--vs-switch-thumb);border-radius:50%;transition:transform .2s ease;pointer-events:none;box-shadow:0 1px 3px #0000001a}.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch--disabled{opacity:.5;cursor:not-allowed}")),document.head.appendChild(s)}}catch(c){console.error("vite-plugin-css-injected-by-js",c)}})();
|
|
2
|
+
var VsSwitch=function(l,s){"use strict";const m="",o=(e,t)=>{const i=e.__vccOpts||e;for(const[r,n]of t)i[r]=n;return i},d={name:"VsSwitch",props:{modelValue:{type:Boolean,default:!1},size:{type:String,default:"medium",validator:e=>["small","medium","large"].includes(e)},variant:{type:String,default:"classic",validator:e=>["classic","surface","soft"].includes(e)},color:{type:String,default:"primary"},highContrast:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},ariaLabel:{type:String},checkedBgColor:{type:String}},emits:["update:modelValue","change"],computed:{isChecked(){return this.modelValue},classList(){return[`vs-switch__size-${this.size}`,`vs-switch__variant-${this.variant}`,`vs-switch__color-${this.color}`,{"vs-switch--checked":this.isChecked,"vs-switch--disabled":this.disabled,"vs-switch--high-contrast":this.highContrast}]},cssVars(){return{"--vs-switch-checked-bg-color":this.checkedBgColor}},isCssVars(){return this.checkedBgColor?this.cssVars:""}},methods:{toggle(){if(!this.disabled){const e=!this.isChecked;this.$emit("update:modelValue",e),this.$emit("change",e)}}}},h=["aria-checked","aria-label","disabled"];function u(e,t,i,r,n,a){return s.openBlock(),s.createElementBlock("button",{class:s.normalizeClass(["vs-switch",a.classList]),style:s.normalizeStyle(a.isCssVars),"aria-checked":a.isChecked,"aria-label":i.ariaLabel,role:"switch",type:"button",disabled:i.disabled,onClick:t[0]||(t[0]=(..._)=>a.toggle&&a.toggle(..._))},[...t[1]||(t[1]=[s.createElementVNode("span",{class:"vs-switch__thumb"},null,-1)])],14,h)}const c=o(d,[["render",u]]),g={install(e){e.component("VsSwitch",c)}};return l.default=c,l.plugin=g,Object.defineProperties(l,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}}),l}({},Vue);
|
package/dist/index.umd.js
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
(function(){"use strict";try{if(typeof document<"u"){var s=document.createElement("style");s.appendChild(document.createTextNode("[data-theme=dark] .vs-switch,.dark .vs-switch{--vs-switch-bg-unchecked: #3a3a3a;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #555555}.vs-switch{--vs-switch-bg-unchecked: #e9ebed;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #d1d5db;--vs-switch-primary: #1f73b7;--vs-switch-success: #186146;--vs-switch-danger: #cc3340;--vs-switch-warning: #ffb057;--vs-switch-secondary: #3a3a3a;--vs-switch-indigo: #4f46e5;--vs-switch-cyan: #06b6d4;--vs-switch-orange: #f97316;--vs-switch-crimson: #dc2626;--vs-switch-gray: #6b7280;position:relative;display:inline-flex;align-items:center;justify-content:flex-start;cursor:pointer;border:none;padding:0;background:none;transition:all .2s ease;border-radius:var(--vs-switch-border-radius)}.vs-switch:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--vs-switch-bg-checked)}.vs-switch:disabled{cursor:not-allowed;opacity:.5}.vs-switch__size-small{width:36px;height:20px;--vs-switch-border-radius: 10px}.vs-switch__size-small .vs-switch__thumb{width:16px;height:16px}.vs-switch__size-small.vs-switch--checked .vs-switch__thumb{transform:translate(16px)}.vs-switch__size-medium{width:44px;height:24px;--vs-switch-border-radius: 12px}.vs-switch__size-medium .vs-switch__thumb{width:20px;height:20px}.vs-switch__size-medium.vs-switch--checked .vs-switch__thumb{transform:translate(20px)}.vs-switch__size-large{width:52px;height:28px;--vs-switch-border-radius: 14px}.vs-switch__size-large .vs-switch__thumb{width:24px;height:24px}.vs-switch__size-large.vs-switch--checked .vs-switch__thumb{transform:translate(24px)}.vs-switch__radius-none{--vs-switch-border-radius: 0}.vs-switch__radius-small{--vs-switch-border-radius: 4px}.vs-switch__radius-medium{--vs-switch-border-radius: 6px}.vs-switch__radius-large{--vs-switch-border-radius: 8px}.vs-switch__radius-full{--vs-switch-border-radius: 100px}.vs-switch__variant-classic{background:var(--vs-switch-bg-unchecked);border:1px solid var(--vs-switch-border)}.vs-switch__variant-classic.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked));border-color:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-surface{background:#f0f1f3;border:1px solid transparent}.vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-surface,.dark .vs-switch__variant-surface{background:#4a5568}[data-theme=dark] .vs-switch__variant-surface.vs-switch--checked,.dark .vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-soft{background:rgba(31,115,183,.1);border:1px solid transparent}.vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-soft,.dark .vs-switch__variant-soft{background:rgba(31,115,183,.2)}[data-theme=dark] .vs-switch__variant-soft.vs-switch--checked,.dark .vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #1f73b7)}.vs-switch__color-success.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #186146)}.vs-switch__color-danger.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #cc3340)}.vs-switch__color-warning.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #ffb057)}.vs-switch__color-warning.vs-switch--checked .vs-switch__thumb{background:#703815}.vs-switch__color-secondary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3a3a3a)}.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #4f46e5)}.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #06b6d4)}.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #f97316)}.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #dc2626)}.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #6b7280)}.vs-switch--high-contrast.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0d47a1)}.vs-switch--high-contrast.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3730a3)}.vs-switch--high-contrast.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0369a1)}.vs-switch--high-contrast.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #c2410c)}.vs-switch--high-contrast.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #7f1d1d)}.vs-switch--high-contrast.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #374151)}.vs-switch__thumb{position:absolute;left:2px;width:20px;height:20px;background:var(--vs-switch-thumb);border-radius:50%;transition:transform .2s ease;pointer-events:none;box-shadow:0 1px 3px #0000001a}.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch--disabled{opacity:.5;cursor:not-allowed}")),document.head.appendChild(s)}}catch(c){console.error("vite-plugin-css-injected-by-js",c)}})();
|
|
2
|
-
(function(
|
|
3
|
-
`,document.head.appendChild(r);const u="",v=(s,t)=>{const i=s.__vccOpts||s;for(const[o,d]of t)i[o]=d;return i},n={name:"VsSwitch",props:{modelValue:{type:Boolean,default:!1},size:{type:String,default:"medium",validator:s=>["small","medium","large"].includes(s)},variant:{type:String,default:"classic",validator:s=>["classic","surface","soft"].includes(s)},color:{type:String,default:"primary"},highContrast:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},ariaLabel:{type:String},checkedBgColor:{type:String}},emits:["update:modelValue","change"],computed:{isChecked(){return this.modelValue},classList(){return[`vs-switch__size-${this.size}`,`vs-switch__variant-${this.variant}`,`vs-switch__color-${this.color}`,`vs-switch__radius-${this.radius}`,{"vs-switch--checked":this.isChecked,"vs-switch--disabled":this.disabled,"vs-switch--high-contrast":this.highContrast}]},cssVars(){return{"--vs-switch-checked-bg-color":this.checkedBgColor}},isCssVars(){return this.checkedBgColor?this.cssVars:""}},methods:{toggle(){if(!this.disabled){const s=!this.isChecked;this.$emit("update:modelValue",s),this.$emit("change",s)}}}},w=["aria-checked","aria-label","disabled"];function l(s,t,i,o,d,h){return c.openBlock(),c.createElementBlock("button",{class:c.normalizeClass(["vs-switch",h.classList]),style:c.normalizeStyle(h.isCssVars),"aria-checked":h.isChecked,"aria-label":i.ariaLabel,role:"switch",type:"button",disabled:i.disabled,onClick:t[0]||(t[0]=(...b)=>h.toggle&&h.toggle(...b))},[...t[1]||(t[1]=[c.createElementVNode("span",{class:"vs-switch__thumb"},null,-1)])],14,w)}const a=v(n,[["render",l]]),_={install(s){s.component("VsSwitch",a)}};e.default=a,e.plugin=_,Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
|
|
1
|
+
(function(){"use strict";try{if(typeof document<"u"){var s=document.createElement("style");s.id="vs-switch-styles",s.appendChild(document.createTextNode("[data-theme=dark] .vs-switch,.dark .vs-switch{--vs-switch-bg-unchecked: #3a3a3a;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #555555}.vs-switch{--vs-switch-bg-unchecked: #e9ebed;--vs-switch-bg-checked: #1f73b7;--vs-switch-thumb: #ffffff;--vs-switch-border: #d1d5db;--vs-switch-primary: #1f73b7;--vs-switch-success: #186146;--vs-switch-danger: #cc3340;--vs-switch-warning: #ffb057;--vs-switch-secondary: #3a3a3a;--vs-switch-indigo: #4f46e5;--vs-switch-cyan: #06b6d4;--vs-switch-orange: #f97316;--vs-switch-crimson: #dc2626;--vs-switch-gray: #6b7280;position:relative;display:inline-flex;align-items:center;justify-content:flex-start;cursor:pointer;border:none;padding:0;background:none;transition:all .2s ease;border-radius:var(--vs-switch-border-radius)}.vs-switch:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--vs-switch-bg-checked)}.vs-switch:disabled{cursor:not-allowed;opacity:.5}.vs-switch__size-small{width:36px;height:20px;--vs-switch-border-radius: 10px}.vs-switch__size-small .vs-switch__thumb{width:16px;height:16px}.vs-switch__size-small.vs-switch--checked .vs-switch__thumb{transform:translate(16px)}.vs-switch__size-medium{width:44px;height:24px;--vs-switch-border-radius: 12px}.vs-switch__size-medium .vs-switch__thumb{width:20px;height:20px}.vs-switch__size-medium.vs-switch--checked .vs-switch__thumb{transform:translate(20px)}.vs-switch__size-large{width:52px;height:28px;--vs-switch-border-radius: 14px}.vs-switch__size-large .vs-switch__thumb{width:24px;height:24px}.vs-switch__size-large.vs-switch--checked .vs-switch__thumb{transform:translate(24px)}.vs-switch__radius-none{--vs-switch-border-radius: 0}.vs-switch__radius-small{--vs-switch-border-radius: 4px}.vs-switch__radius-medium{--vs-switch-border-radius: 6px}.vs-switch__radius-large{--vs-switch-border-radius: 8px}.vs-switch__radius-full{--vs-switch-border-radius: 100px}.vs-switch__variant-classic{background:var(--vs-switch-bg-unchecked);border:1px solid var(--vs-switch-border)}.vs-switch__variant-classic.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked));border-color:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-surface{background:#f0f1f3;border:1px solid transparent}.vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-surface,.dark .vs-switch__variant-surface{background:#4a5568}[data-theme=dark] .vs-switch__variant-surface.vs-switch--checked,.dark .vs-switch__variant-surface.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__variant-soft{background:rgba(31,115,183,.1);border:1px solid transparent}.vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}[data-theme=dark] .vs-switch__variant-soft,.dark .vs-switch__variant-soft{background:rgba(31,115,183,.2)}[data-theme=dark] .vs-switch__variant-soft.vs-switch--checked,.dark .vs-switch__variant-soft.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #1f73b7)}.vs-switch__color-success.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #186146)}.vs-switch__color-danger.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #cc3340)}.vs-switch__color-warning.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #ffb057)}.vs-switch__color-warning.vs-switch--checked .vs-switch__thumb{background:#703815}.vs-switch__color-secondary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3a3a3a)}.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #4f46e5)}.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #06b6d4)}.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #f97316)}.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #dc2626)}.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #6b7280)}.vs-switch--high-contrast.vs-switch__color-primary.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0d47a1)}.vs-switch--high-contrast.vs-switch__color-indigo.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #3730a3)}.vs-switch--high-contrast.vs-switch__color-cyan.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #0369a1)}.vs-switch--high-contrast.vs-switch__color-orange.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #c2410c)}.vs-switch--high-contrast.vs-switch__color-crimson.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #7f1d1d)}.vs-switch--high-contrast.vs-switch__color-gray.vs-switch--checked{background:var(--vs-switch-checked-bg-color, #374151)}.vs-switch__thumb{position:absolute;left:2px;width:20px;height:20px;background:var(--vs-switch-thumb);border-radius:50%;transition:transform .2s ease;pointer-events:none;box-shadow:0 1px 3px #0000001a}.vs-switch--checked{background:var(--vs-switch-checked-bg-color, var(--vs-switch-bg-checked))}.vs-switch--disabled{opacity:.5;cursor:not-allowed}")),document.head.appendChild(s)}}catch(c){console.error("vite-plugin-css-injected-by-js",c)}})();
|
|
2
|
+
(function(s,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(s=typeof globalThis<"u"?globalThis:s||self,t(s.VsSwitch={},s.Vue))})(this,function(s,t){"use strict";const m="",d=(e,i)=>{const a=e.__vccOpts||e;for(const[n,o]of i)a[n]=o;return a},r={name:"VsSwitch",props:{modelValue:{type:Boolean,default:!1},size:{type:String,default:"medium",validator:e=>["small","medium","large"].includes(e)},variant:{type:String,default:"classic",validator:e=>["classic","surface","soft"].includes(e)},color:{type:String,default:"primary"},highContrast:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},ariaLabel:{type:String},checkedBgColor:{type:String}},emits:["update:modelValue","change"],computed:{isChecked(){return this.modelValue},classList(){return[`vs-switch__size-${this.size}`,`vs-switch__variant-${this.variant}`,`vs-switch__color-${this.color}`,{"vs-switch--checked":this.isChecked,"vs-switch--disabled":this.disabled,"vs-switch--high-contrast":this.highContrast}]},cssVars(){return{"--vs-switch-checked-bg-color":this.checkedBgColor}},isCssVars(){return this.checkedBgColor?this.cssVars:""}},methods:{toggle(){if(!this.disabled){const e=!this.isChecked;this.$emit("update:modelValue",e),this.$emit("change",e)}}}},h=["aria-checked","aria-label","disabled"];function u(e,i,a,n,o,l){return t.openBlock(),t.createElementBlock("button",{class:t.normalizeClass(["vs-switch",l.classList]),style:t.normalizeStyle(l.isCssVars),"aria-checked":l.isChecked,"aria-label":a.ariaLabel,role:"switch",type:"button",disabled:a.disabled,onClick:i[0]||(i[0]=(...g)=>l.toggle&&l.toggle(...g))},[...i[1]||(i[1]=[t.createElementVNode("span",{class:"vs-switch__thumb"},null,-1)])],14,h)}const c=d(r,[["render",u]]),f={install(e){e.component("VsSwitch",c)}};s.default=c,s.plugin=f,Object.defineProperties(s,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vuesimple/vs-switch",
|
|
3
|
-
"version": "3.1.
|
|
3
|
+
"version": "3.1.7",
|
|
4
4
|
"description": "A simple vue switch component. Toggle switch alternative to the checkbox.",
|
|
5
5
|
"main": "dist/index.umd.js",
|
|
6
6
|
"module": "dist/index.esm.js",
|
|
@@ -21,7 +21,8 @@
|
|
|
21
21
|
"url": "git+https://github.com/ashwinkshenoy/vue-simple.git"
|
|
22
22
|
},
|
|
23
23
|
"publishConfig": {
|
|
24
|
-
"registry": "https://registry.npmjs.org"
|
|
24
|
+
"registry": "https://registry.npmjs.org",
|
|
25
|
+
"access": "public"
|
|
25
26
|
},
|
|
26
27
|
"keywords": [
|
|
27
28
|
"vue",
|
|
@@ -43,5 +44,5 @@
|
|
|
43
44
|
"url": "https://github.com/ashwinkshenoy/vue-simple/issues"
|
|
44
45
|
},
|
|
45
46
|
"homepage": "https://github.com/ashwinkshenoy/vue-simple",
|
|
46
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "2002c260f34ce422b53c85326fbac4ae675a5cb5"
|
|
47
48
|
}
|
package/src/vs-switch.vue
CHANGED
|
@@ -78,7 +78,6 @@
|
|
|
78
78
|
`vs-switch__size-${this.size}`,
|
|
79
79
|
`vs-switch__variant-${this.variant}`,
|
|
80
80
|
`vs-switch__color-${this.color}`,
|
|
81
|
-
`vs-switch__radius-${this.radius}`,
|
|
82
81
|
{
|
|
83
82
|
'vs-switch--checked': this.isChecked,
|
|
84
83
|
'vs-switch--disabled': this.disabled,
|
|
@@ -153,7 +152,9 @@
|
|
|
153
152
|
|
|
154
153
|
&:focus-visible {
|
|
155
154
|
outline: none;
|
|
156
|
-
box-shadow:
|
|
155
|
+
box-shadow:
|
|
156
|
+
0 0 0 2px #ffffff,
|
|
157
|
+
0 0 0 4px var(--vs-switch-bg-checked);
|
|
157
158
|
}
|
|
158
159
|
|
|
159
160
|
&:disabled {
|