@a-drowned-fish/rox-v 1.0.7 → 1.0.8
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 +4 -6
- package/dist/es/button/button.js +1 -1
- package/dist/es/button/button.vue_vue_type_script_setup_true_lang.js +5 -5
- package/dist/es/button/style.css +1 -1
- package/dist/index.js +1 -1
- package/dist/lib/button/button.js +1 -1
- package/dist/lib/button/button.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/lib/button/style.css +1 -1
- package/dist/style.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -147,9 +147,9 @@ const handleComplete = (value: string) => {
|
|
|
147
147
|
|
|
148
148
|
#### 基础用法
|
|
149
149
|
|
|
150
|
-
|
|
150
|
+
```vue
|
|
151
151
|
<template>
|
|
152
|
-
<Button @click="show = true">打开弹窗</Button>
|
|
152
|
+
<Button @click="show = true">打开弹窗</Button>
|
|
153
153
|
|
|
154
154
|
<Popup v-model="show">
|
|
155
155
|
<div class="popup-content">
|
|
@@ -158,7 +158,6 @@ const handleComplete = (value: string) => {
|
|
|
158
158
|
<Button @click="show = false">关闭</Button>
|
|
159
159
|
</div>
|
|
160
160
|
</Popup>
|
|
161
|
-
|
|
162
161
|
</template>
|
|
163
162
|
|
|
164
163
|
<script setup lang="ts">
|
|
@@ -175,8 +174,7 @@ const show = ref(false);
|
|
|
175
174
|
border-radius: 12px 12px 0 0;
|
|
176
175
|
}
|
|
177
176
|
</style>
|
|
178
|
-
|
|
179
|
-
````
|
|
177
|
+
```
|
|
180
178
|
|
|
181
179
|
#### 不同位置
|
|
182
180
|
|
|
@@ -212,7 +210,7 @@ const showTop = ref(false);
|
|
|
212
210
|
const showLeft = ref(false);
|
|
213
211
|
const showRight = ref(false);
|
|
214
212
|
</script>
|
|
215
|
-
|
|
213
|
+
```
|
|
216
214
|
|
|
217
215
|
#### 自定义遮罩层
|
|
218
216
|
|
package/dist/es/button/button.js
CHANGED
|
@@ -2,6 +2,6 @@ import e from "../_virtual/_plugin-vue_export-helper.js";
|
|
|
2
2
|
import t from "./button.vue_vue_type_script_setup_true_lang.js";
|
|
3
3
|
/* empty css */
|
|
4
4
|
//#region components/button/button.vue
|
|
5
|
-
var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-
|
|
5
|
+
var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-54355656"]]);
|
|
6
6
|
//#endregion
|
|
7
7
|
export { n as default };
|
|
@@ -22,11 +22,11 @@ var o = ["disabled", "type"], s = /* @__PURE__ */ t({
|
|
|
22
22
|
emits: ["click"],
|
|
23
23
|
setup(t, { emit: s }) {
|
|
24
24
|
a((e) => ({
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
25
|
+
v2ea2427a: l.padding,
|
|
26
|
+
v60fbe83c: l.bg,
|
|
27
|
+
v34bb7ca3: l.border,
|
|
28
|
+
v4f3d7509: l.radius,
|
|
29
|
+
v6e7988d8: l.disabledBg
|
|
30
30
|
}));
|
|
31
31
|
let c = s, l = t, u = (e) => {
|
|
32
32
|
l.disabled || c("click", e);
|
package/dist/es/button/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.button-container[data-v-
|
|
1
|
+
.button-container[data-v-54355656]{padding:var(--v2ea2427a);background-color:var(--v60fbe83c);border:var(--v34bb7ca3);border-radius:var(--v4f3d7509);cursor:pointer}.button-container.block[data-v-54355656]{width:100%;display:block}.button-container.disabled[data-v-54355656]{background-color:var(--v6e7988d8);border-color:#0000}
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`vue`)):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`rox-v`]={},e.Vue))})(this,function(e,t){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var n=Object.defineProperty,r=(e,t)=>{let r={};for(var i in e)n(r,i,{get:e[i],enumerable:!0});return t||n(r,Symbol.toStringTag,{value:`Module`}),r},i=[`maxlength`],a=(0,t.defineComponent)({name:`InputOtp`,__name:`input-otp`,props:{modelValue:{default:``},length:{default:6},itemClass:{default:``},activeItemClass:{default:``},gap:{default:`10px`},hasFilledItemClass:{default:`active`}},emits:[`update:modelValue`,`complete`],setup(e,{emit:n}){let r=[`ArrowLeft`,`ArrowRight`,`Home`,`End`],a=e,o=n,s=(0,t.ref)(null),c=(0,t.ref)(a.modelValue);(0,t.watch)(()=>a.modelValue,e=>{e!==c.value&&(c.value=e)});function l(e){let t=e.target.value;t=t.replace(/\D/g,``),t=t.slice(0,a.length),c.value=t,o(`update:modelValue`,t),t.length===a.length&&o(`complete`,t)}function u(){(0,t.nextTick)(()=>{if(s.value){let e=c.value.length;s.value.setSelectionRange?.(e,e)}})}function d(e){let t=c.value,n=e.key;if(n===`Backspace`||n===`Delete`){if(e.preventDefault(),t.length>0){let e=t.slice(0,-1);c.value=e,o(`update:modelValue`,e),u()}}else r.includes(n)&&e.preventDefault()}function f(){s.value?.focus()}function p(e){return e===c.value.length}function m(e){return e<c.value.length}return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`otp-wrapper`,onClick:f},[(0,t.withDirectives)((0,t.createElementVNode)(`input`,{inputmode:`numeric`,autocomplete:`one-time-code`,ref_key:`inputRef`,ref:s,"onUpdate:modelValue":r[0]||=e=>c.value=e,maxlength:e.length,onInput:l,onKeydown:d,onFocus:u,style:{position:`absolute`,opacity:`0`,"pointer-events":`none`,width:`1px`,height:`1px`}},null,40,i),[[t.vModelText,c.value]]),(0,t.createElementVNode)(`div`,{class:`otp-box`,style:(0,t.normalizeStyle)({gap:a.gap})},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.length,(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:n,class:(0,t.normalizeClass)([`otp-item`,[{[a.activeItemClass]:p(n)},{[a.hasFilledItemClass]:m(n)},a.itemClass]])},(0,t.toDisplayString)(c.value[n]||``),3))),128))],4)]))}}),o=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},s=o(a,[[`__scopeId`,`data-v-0e246228`]]);s.install=e=>(s.name&&e.component(s.name,s),e);var c=s,l=o((0,t.defineComponent)({name:`Popup`,__name:`popup`,props:(0,t.mergeModels)({to:{default:`body`},bg:{default:`rgba(0, 0, 0, .5)`},duration:{default:300},position:{default:`bottom`},maskClosable:{type:Boolean,default:!0}},{modelValue:{type:Boolean,default:!1},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=[`bottom`,`left`,`right`,`top`],r=(0,t.useModel)(e,`modelValue`),i=e;function a(){i.maskClosable&&(r.value=!1)}return(e,o)=>((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:i.to},[(0,t.createVNode)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[r.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,style:(0,t.normalizeStyle)({"background-color":i.bg,"--duration":`${i.duration}ms`}),class:(0,t.normalizeClass)([`popup-container`,[`popup-container-${i.position}`,{"popup-container-bottom":!n.includes(i.position)}]]),onClick:a},[(0,t.createElementVNode)(`div`,{class:`popup-content`,onClick:o[0]||=(0,t.withModifiers)(()=>{},[`stop`])},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)])],6)):(0,t.createCommentVNode)(``,!0)]),_:3})],8,[`to`]))}}),[[`__scopeId`,`data-v-00d0e4c1`]]);l.install=e=>(l.name&&e.component(l.name,l),e);var u=l,d=[`disabled`,`type`],f=o((0,t.defineComponent)({name:`Button`,__name:`button`,props:{padding:{default:`8px 16px`},block:{type:Boolean,default:!1},bg:{default:`transparent`},border:{default:`1px solid #1A171B`},radius:{default:`0`},disabled:{type:Boolean,default:!1},type:{default:`button`},disabledBg:{default:`rgba(26,23,27,0.16)`}},emits:[`click`],setup(e,{emit:n}){(0,t.useCssVars)(e=>({
|
|
1
|
+
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`vue`)):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`rox-v`]={},e.Vue))})(this,function(e,t){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var n=Object.defineProperty,r=(e,t)=>{let r={};for(var i in e)n(r,i,{get:e[i],enumerable:!0});return t||n(r,Symbol.toStringTag,{value:`Module`}),r},i=[`maxlength`],a=(0,t.defineComponent)({name:`InputOtp`,__name:`input-otp`,props:{modelValue:{default:``},length:{default:6},itemClass:{default:``},activeItemClass:{default:``},gap:{default:`10px`},hasFilledItemClass:{default:`active`}},emits:[`update:modelValue`,`complete`],setup(e,{emit:n}){let r=[`ArrowLeft`,`ArrowRight`,`Home`,`End`],a=e,o=n,s=(0,t.ref)(null),c=(0,t.ref)(a.modelValue);(0,t.watch)(()=>a.modelValue,e=>{e!==c.value&&(c.value=e)});function l(e){let t=e.target.value;t=t.replace(/\D/g,``),t=t.slice(0,a.length),c.value=t,o(`update:modelValue`,t),t.length===a.length&&o(`complete`,t)}function u(){(0,t.nextTick)(()=>{if(s.value){let e=c.value.length;s.value.setSelectionRange?.(e,e)}})}function d(e){let t=c.value,n=e.key;if(n===`Backspace`||n===`Delete`){if(e.preventDefault(),t.length>0){let e=t.slice(0,-1);c.value=e,o(`update:modelValue`,e),u()}}else r.includes(n)&&e.preventDefault()}function f(){s.value?.focus()}function p(e){return e===c.value.length}function m(e){return e<c.value.length}return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:`otp-wrapper`,onClick:f},[(0,t.withDirectives)((0,t.createElementVNode)(`input`,{inputmode:`numeric`,autocomplete:`one-time-code`,ref_key:`inputRef`,ref:s,"onUpdate:modelValue":r[0]||=e=>c.value=e,maxlength:e.length,onInput:l,onKeydown:d,onFocus:u,style:{position:`absolute`,opacity:`0`,"pointer-events":`none`,width:`1px`,height:`1px`}},null,40,i),[[t.vModelText,c.value]]),(0,t.createElementVNode)(`div`,{class:`otp-box`,style:(0,t.normalizeStyle)({gap:a.gap})},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.length,(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:n,class:(0,t.normalizeClass)([`otp-item`,[{[a.activeItemClass]:p(n)},{[a.hasFilledItemClass]:m(n)},a.itemClass]])},(0,t.toDisplayString)(c.value[n]||``),3))),128))],4)]))}}),o=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},s=o(a,[[`__scopeId`,`data-v-0e246228`]]);s.install=e=>(s.name&&e.component(s.name,s),e);var c=s,l=o((0,t.defineComponent)({name:`Popup`,__name:`popup`,props:(0,t.mergeModels)({to:{default:`body`},bg:{default:`rgba(0, 0, 0, .5)`},duration:{default:300},position:{default:`bottom`},maskClosable:{type:Boolean,default:!0}},{modelValue:{type:Boolean,default:!1},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let n=[`bottom`,`left`,`right`,`top`],r=(0,t.useModel)(e,`modelValue`),i=e;function a(){i.maskClosable&&(r.value=!1)}return(e,o)=>((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:i.to},[(0,t.createVNode)(t.Transition,{name:`fade`},{default:(0,t.withCtx)(()=>[r.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,style:(0,t.normalizeStyle)({"background-color":i.bg,"--duration":`${i.duration}ms`}),class:(0,t.normalizeClass)([`popup-container`,[`popup-container-${i.position}`,{"popup-container-bottom":!n.includes(i.position)}]]),onClick:a},[(0,t.createElementVNode)(`div`,{class:`popup-content`,onClick:o[0]||=(0,t.withModifiers)(()=>{},[`stop`])},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)])],6)):(0,t.createCommentVNode)(``,!0)]),_:3})],8,[`to`]))}}),[[`__scopeId`,`data-v-00d0e4c1`]]);l.install=e=>(l.name&&e.component(l.name,l),e);var u=l,d=[`disabled`,`type`],f=o((0,t.defineComponent)({name:`Button`,__name:`button`,props:{padding:{default:`8px 16px`},block:{type:Boolean,default:!1},bg:{default:`transparent`},border:{default:`1px solid #1A171B`},radius:{default:`0`},disabled:{type:Boolean,default:!1},type:{default:`button`},disabledBg:{default:`rgba(26,23,27,0.16)`}},emits:[`click`],setup(e,{emit:n}){(0,t.useCssVars)(e=>({v2ea2427a:i.padding,v60fbe83c:i.bg,v34bb7ca3:i.border,v4f3d7509:i.radius,v6e7988d8:i.disabledBg}));let r=n,i=e,a=e=>{i.disabled||r(`click`,e)};return(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{onClick:a,class:(0,t.normalizeClass)([`button-container`,{block:i.block,disabled:i.disabled}]),disabled:i.disabled,type:i.type},[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)],10,d))}}),[[`__scopeId`,`data-v-54355656`]]);f.install=e=>{f.name&&e.component(f.name,f)};var p=f,m=r({Button:()=>p,InputOtp:()=>c,Popup:()=>u}),h=e=>(Object.keys(m).forEach(t=>{let n=m[t];n.install&&e.use(n)}),e),g={install:h};e.Button=p,e.InputOtp=c,e.Popup=u,e.default=g,e.install=h});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=require(`../_virtual/_plugin-vue_export-helper.js`),t=require(`./button.vue_vue_type_script_setup_true_lang.js`);;/* empty css */var n=e.default(t.default,[[`__scopeId`,`data-v-
|
|
1
|
+
const e=require(`../_virtual/_plugin-vue_export-helper.js`),t=require(`./button.vue_vue_type_script_setup_true_lang.js`);;/* empty css */var n=e.default(t.default,[[`__scopeId`,`data-v-54355656`]]);exports.default=n;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
let e=require(`vue`);var t=[`disabled`,`type`],n=(0,e.defineComponent)({name:`Button`,__name:`button`,props:{padding:{default:`8px 16px`},block:{type:Boolean,default:!1},bg:{default:`transparent`},border:{default:`1px solid #1A171B`},radius:{default:`0`},disabled:{type:Boolean,default:!1},type:{default:`button`},disabledBg:{default:`rgba(26,23,27,0.16)`}},emits:[`click`],setup(n,{emit:r}){(0,e.useCssVars)(e=>({
|
|
1
|
+
let e=require(`vue`);var t=[`disabled`,`type`],n=(0,e.defineComponent)({name:`Button`,__name:`button`,props:{padding:{default:`8px 16px`},block:{type:Boolean,default:!1},bg:{default:`transparent`},border:{default:`1px solid #1A171B`},radius:{default:`0`},disabled:{type:Boolean,default:!1},type:{default:`button`},disabledBg:{default:`rgba(26,23,27,0.16)`}},emits:[`click`],setup(n,{emit:r}){(0,e.useCssVars)(e=>({v2ea2427a:a.padding,v60fbe83c:a.bg,v34bb7ca3:a.border,v4f3d7509:a.radius,v6e7988d8:a.disabledBg}));let i=r,a=n,o=e=>{a.disabled||i(`click`,e)};return(n,r)=>((0,e.openBlock)(),(0,e.createElementBlock)(`button`,{onClick:o,class:(0,e.normalizeClass)([`button-container`,{block:a.block,disabled:a.disabled}]),disabled:a.disabled,type:a.type},[(0,e.renderSlot)(n.$slots,`default`,{},void 0,!0)],10,t))}});exports.default=n;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.button-container[data-v-
|
|
1
|
+
.button-container[data-v-54355656]{padding:var(--v2ea2427a);background-color:var(--v60fbe83c);border:var(--v34bb7ca3);border-radius:var(--v4f3d7509);cursor:pointer}.button-container.block[data-v-54355656]{width:100%;display:block}.button-container.disabled[data-v-54355656]{background-color:var(--v6e7988d8);border-color:#0000}
|
package/dist/style.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.otp-wrapper[data-v-0e246228]{cursor:pointer;width:max-content;position:relative}.otp-box[data-v-0e246228]{display:flex}.otp-item[data-v-0e246228]{border-bottom:1px solid #00000029;justify-content:center;align-items:center;width:60px;height:60px;transition:all .2s;display:flex}.otp-item.active[data-v-0e246228]{border-bottom:1px solid #000}.fade-enter-from[data-v-00d0e4c1],.fade-leave-to[data-v-00d0e4c1]{opacity:0}.popup-container[data-v-00d0e4c1]{z-index:50;transition:opacity var(--duration) ease-in-out;will-change:opacity;position:fixed;inset:0}.popup-content[data-v-00d0e4c1]{transition:transform var(--duration) ease-in-out;will-change:transform;position:absolute}.popup-container-top .popup-content[data-v-00d0e4c1]{top:0;left:0;right:0}.fade-enter-from.popup-container-top .popup-content[data-v-00d0e4c1],.fade-leave-to.popup-container-top .popup-content[data-v-00d0e4c1]{transform:translateY(-100%)}.popup-container-bottom .popup-content[data-v-00d0e4c1]{bottom:0;left:0;right:0}.fade-enter-from.popup-container-bottom .popup-content[data-v-00d0e4c1],.fade-leave-to.popup-container-bottom .popup-content[data-v-00d0e4c1]{transform:translateY(100%)}.popup-container-left .popup-content[data-v-00d0e4c1]{top:0;bottom:0;left:0}.fade-enter-from.popup-container-left .popup-content[data-v-00d0e4c1],.fade-leave-to.popup-container-left .popup-content[data-v-00d0e4c1]{transform:translate(-100%)}.popup-container-right .popup-content[data-v-00d0e4c1]{top:0;bottom:0;right:0}.fade-enter-from.popup-container-right .popup-content[data-v-00d0e4c1],.fade-leave-to.popup-container-right .popup-content[data-v-00d0e4c1]{transform:translate(100%)}.button-container[data-v-
|
|
1
|
+
.otp-wrapper[data-v-0e246228]{cursor:pointer;width:max-content;position:relative}.otp-box[data-v-0e246228]{display:flex}.otp-item[data-v-0e246228]{border-bottom:1px solid #00000029;justify-content:center;align-items:center;width:60px;height:60px;transition:all .2s;display:flex}.otp-item.active[data-v-0e246228]{border-bottom:1px solid #000}.fade-enter-from[data-v-00d0e4c1],.fade-leave-to[data-v-00d0e4c1]{opacity:0}.popup-container[data-v-00d0e4c1]{z-index:50;transition:opacity var(--duration) ease-in-out;will-change:opacity;position:fixed;inset:0}.popup-content[data-v-00d0e4c1]{transition:transform var(--duration) ease-in-out;will-change:transform;position:absolute}.popup-container-top .popup-content[data-v-00d0e4c1]{top:0;left:0;right:0}.fade-enter-from.popup-container-top .popup-content[data-v-00d0e4c1],.fade-leave-to.popup-container-top .popup-content[data-v-00d0e4c1]{transform:translateY(-100%)}.popup-container-bottom .popup-content[data-v-00d0e4c1]{bottom:0;left:0;right:0}.fade-enter-from.popup-container-bottom .popup-content[data-v-00d0e4c1],.fade-leave-to.popup-container-bottom .popup-content[data-v-00d0e4c1]{transform:translateY(100%)}.popup-container-left .popup-content[data-v-00d0e4c1]{top:0;bottom:0;left:0}.fade-enter-from.popup-container-left .popup-content[data-v-00d0e4c1],.fade-leave-to.popup-container-left .popup-content[data-v-00d0e4c1]{transform:translate(-100%)}.popup-container-right .popup-content[data-v-00d0e4c1]{top:0;bottom:0;right:0}.fade-enter-from.popup-container-right .popup-content[data-v-00d0e4c1],.fade-leave-to.popup-container-right .popup-content[data-v-00d0e4c1]{transform:translate(100%)}.button-container[data-v-54355656]{padding:var(--v2ea2427a);background-color:var(--v60fbe83c);border:var(--v34bb7ca3);border-radius:var(--v4f3d7509);cursor:pointer}.button-container.block[data-v-54355656]{width:100%;display:block}.button-container.disabled[data-v-54355656]{background-color:var(--v6e7988d8);border-color:#0000}:-webkit-any(input:-webkit-autofill,textarea:-webkit-autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}:is(input:autofill,textarea:autofill){-webkit-box-shadow:0 0 0 1000px var(--input-bg,#fff) inset;-webkit-text-fill-color:inherit}input:focus,textarea:focus{outline:none}input::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}textarea::-webkit-input-placeholder{color:var(--input-placeholder-color,#999)}input::-moz-placeholder{color:var(--input-placeholder-color,#999)}textarea::-moz-placeholder{color:var(--input-placeholder-color,#999)}input:-ms-placeholder-shown{color:var(--input-placeholder-color,#999)}
|
|
2
2
|
/*$vite$:1*/
|