ip-input-vue3 0.1.2 → 0.1.4

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/dist/IpInput.css CHANGED
@@ -1 +1 @@
1
- .ip_input_container[data-v-bb3c700c]{display:inline-flex;align-items:center;border:1px solid #ccc;box-sizing:border-box;min-height:32px}.ip_input_container[data-v-bb3c700c]:hover{border-color:#40a9ff}.ip_input_box[data-v-bb3c700c]{display:inline-flex;align-items:center}input[data-v-bb3c700c]{outline:none;width:40px;border:none;text-align:center;line-height:1px;background-color:transparent}input[type=number][data-v-bb3c700c]::-webkit-inner-spin-button,input[type=number][data-v-bb3c700c]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.symbol_box[data-v-bb3c700c]{font-weight:500}.port_input[data-v-bb3c700c]{width:60px;margin:0 8px}
1
+ .ip_input_container[data-v-1b423e61]{display:flex;align-items:center;border:1px solid #ccc;box-sizing:border-box;min-height:32px;min-width:300px}.ip_input_container[data-v-1b423e61]:hover{border-color:#40a9ff}.ip_input_box[data-v-1b423e61]{width:0;flex:1;display:inline-flex;align-items:center}input[data-v-1b423e61]{width:0;outline:none;flex:1;border:none;text-align:center;line-height:1px;background-color:transparent}input[type=number][data-v-1b423e61]::-webkit-inner-spin-button,input[type=number][data-v-1b423e61]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.symbol_box[data-v-1b423e61]{font-weight:500}.port_input[data-v-1b423e61]{width:0;flex:1;padding:0 8px}
@@ -1,13 +1,13 @@
1
- import { defineComponent as b, toRef as A, reactive as C, watch as g, openBlock as u, createElementBlock as c, Fragment as N, renderList as k, createCommentVNode as f, createElementVNode as m, pushScopeId as w, popScopeId as R } from "vue";
2
- const S = (o) => (w("data-v-bb3c700c"), o = o(), R(), o), V = { class: "ip_input_container" }, B = { class: "ip_input_box" }, E = ["name", "value", "onInput", "onKeydown", "disabled"], K = {
1
+ import { defineComponent as m, toRef as A, reactive as C, watch as g, openBlock as u, createElementBlock as c, Fragment as N, renderList as k, createCommentVNode as f, createElementVNode as h, pushScopeId as w, popScopeId as R } from "vue";
2
+ const S = (o) => (w("data-v-1b423e61"), o = o(), R(), o), V = { class: "ip_input_container" }, B = { class: "ip_input_box" }, E = ["name", "value", "onInput", "onKeydown", "disabled"], K = {
3
3
  key: 0,
4
4
  class: "symbol_box"
5
5
  }, j = {
6
6
  key: 0,
7
7
  class: "ip_input_box"
8
- }, D = /* @__PURE__ */ S(() => /* @__PURE__ */ m("i", { style: { "font-style": "normal" } }, ":", -1)), F = ["value", "disabled"], L = b({
8
+ }, D = /* @__PURE__ */ S(() => /* @__PURE__ */ h("i", { style: { "font-style": "normal" } }, ":", -1)), F = ["value", "disabled"], L = m({
9
9
  name: "IpInput"
10
- }), O = /* @__PURE__ */ b({
10
+ }), O = /* @__PURE__ */ m({
11
11
  ...L,
12
12
  props: {
13
13
  ip: {
@@ -26,7 +26,7 @@ const S = (o) => (w("data-v-bb3c700c"), o = o(), R(), o), V = { class: "ip_input
26
26
  const l = o, _ = A(l, "port"), a = [], e = C({
27
27
  ipControlArr: new Array(4),
28
28
  ipArr: new Array(4)
29
- }), h = (t) => {
29
+ }), b = (t) => {
30
30
  !t || a.findIndex((r) => r.name === t.name) > -1 || a.push(t);
31
31
  }, v = (t, r) => {
32
32
  const n = r.target.value;
@@ -60,7 +60,7 @@ const S = (o) => (w("data-v-bb3c700c"), o = o(), R(), o), V = { class: "ip_input
60
60
  (u(!0), c(N, null, k(e.ipControlArr, (n, p) => (u(), c("div", B, [
61
61
  (u(), c("input", {
62
62
  ref_for: !0,
63
- ref: h,
63
+ ref: b,
64
64
  key: p,
65
65
  name: p + "",
66
66
  value: n,
@@ -71,9 +71,9 @@ const S = (o) => (w("data-v-bb3c700c"), o = o(), R(), o), V = { class: "ip_input
71
71
  }, null, 40, E)),
72
72
  p < e.ipControlArr.length - 1 ? (u(), c("i", K, "·")) : f("", !0)
73
73
  ]))), 256)),
74
- o.port !== void 0 ? (u(), c("div", j, [
74
+ o.port ? (u(), c("div", j, [
75
75
  D,
76
- m("input", {
76
+ h("input", {
77
77
  class: "port_input",
78
78
  value: _.value,
79
79
  onInput: I,
@@ -89,7 +89,7 @@ const P = (o, s) => {
89
89
  for (const [_, a] of s)
90
90
  l[_] = a;
91
91
  return l;
92
- }, d = /* @__PURE__ */ P(O, [["__scopeId", "data-v-bb3c700c"]]);
92
+ }, d = /* @__PURE__ */ P(O, [["__scopeId", "data-v-1b423e61"]]);
93
93
  d.install = (o) => {
94
94
  o.component("IpInput", d);
95
95
  };
@@ -1 +1 @@
1
- (function(t,i){typeof exports=="object"&&typeof module<"u"?module.exports=i(require("vue")):typeof define=="function"&&define.amd?define(["vue"],i):(t=typeof globalThis<"u"?globalThis:t||self,t.IpInput=i(t.Vue))})(this,function(t){"use strict";const i=n=>(t.pushScopeId("data-v-bb3c700c"),n=n(),t.popScopeId(),n),_={class:"ip_input_container"},m={class:"ip_input_box"},h=["name","value","onInput","onKeydown","disabled"],b={key:0,class:"symbol_box"},I={key:0,class:"ip_input_box"},y=i(()=>t.createElementVNode("i",{style:{"font-style":"normal"}},":",-1)),C=["value","disabled"],A=t.defineComponent({name:"IpInput"}),k=t.defineComponent({...A,props:{ip:{type:String},port:{type:Number},disabled:{type:Boolean,default:!1}},emits:["update:port","update:ip","change"],setup(n,{emit:l}){const a=n,f=t.toRef(a,"port"),s=[],o=t.reactive({ipControlArr:new Array(4),ipArr:new Array(4)}),g=e=>{!e||s.findIndex(r=>r.name===e.name)>-1||s.push(e)},B=(e,r)=>{const p=r.target.value;if(r.target.value=o.ipControlArr[e]??"",r.data==="."&&e<o.ipControlArr.length-1){s[e+1].focus(),o.ipControlArr[e+1]!==""&&s[e+1].select();return}if(isNaN(Number(r.data)))return;Number(p)<0?o.ipControlArr[e]=0:Number(p)>255?o.ipControlArr[e]=255:o.ipControlArr[e]=p;const c=o.ipControlArr.every(u=>u==="")?"":o.ipControlArr.join(".");l("update:ip",c),l("change",c,a.port),p.length===3&&e<o.ipControlArr.length-1&&(s[e+1].focus(),o.ipControlArr[e+1]!==""&&s[e+1].select())},N=(e,r)=>{if(r.keyCode===8&&o.ipControlArr[e]===""&&e>0){const p=s[e-1];p&&p.focus()}},E=e=>{e.target.value&&(l("update:port",Number(e.target.value)),l("change",o.ipControlArr.join("."),Number(e.target.value)))};return t.watch(()=>a.ip,e=>{var r;(r=e==null?void 0:e.split("."))==null||r.forEach((p,c)=>{o.ipControlArr[c]=p?Number(p):""})},{immediate:!0}),(e,r)=>(t.openBlock(),t.createElementBlock("div",_,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(o.ipControlArr,(p,c)=>(t.openBlock(),t.createElementBlock("div",m,[(t.openBlock(),t.createElementBlock("input",{ref_for:!0,ref:g,key:c,name:c+"",value:p,type:"text",onInput:u=>B(c,u),onKeydown:u=>N(c,u),disabled:n.disabled},null,40,h)),c<o.ipControlArr.length-1?(t.openBlock(),t.createElementBlock("i",b,"·")):t.createCommentVNode("",!0)]))),256)),n.port!==void 0?(t.openBlock(),t.createElementBlock("div",I,[y,t.createElementVNode("input",{class:"port_input",value:f.value,onInput:E,type:"number",disabled:n.disabled},null,40,C)])):t.createCommentVNode("",!0)]))}}),V="",d=((n,l)=>{const a=n.__vccOpts||n;for(const[f,s]of l)a[f]=s;return a})(k,[["__scopeId","data-v-bb3c700c"]]);return d.install=n=>{n.component("IpInput",d)},d});
1
+ (function(t,i){typeof exports=="object"&&typeof module<"u"?module.exports=i(require("vue")):typeof define=="function"&&define.amd?define(["vue"],i):(t=typeof globalThis<"u"?globalThis:t||self,t.IpInput=i(t.Vue))})(this,function(t){"use strict";const i=n=>(t.pushScopeId("data-v-1b423e61"),n=n(),t.popScopeId(),n),_={class:"ip_input_container"},m={class:"ip_input_box"},h=["name","value","onInput","onKeydown","disabled"],I={key:0,class:"symbol_box"},y={key:0,class:"ip_input_box"},b=i(()=>t.createElementVNode("i",{style:{"font-style":"normal"}},":",-1)),C=["value","disabled"],A=t.defineComponent({name:"IpInput"}),k=t.defineComponent({...A,props:{ip:{type:String},port:{type:Number},disabled:{type:Boolean,default:!1}},emits:["update:port","update:ip","change"],setup(n,{emit:c}){const a=n,f=t.toRef(a,"port"),l=[],o=t.reactive({ipControlArr:new Array(4),ipArr:new Array(4)}),g=e=>{!e||l.findIndex(r=>r.name===e.name)>-1||l.push(e)},B=(e,r)=>{const p=r.target.value;if(r.target.value=o.ipControlArr[e]??"",r.data==="."&&e<o.ipControlArr.length-1){l[e+1].focus(),o.ipControlArr[e+1]!==""&&l[e+1].select();return}if(isNaN(Number(r.data)))return;Number(p)<0?o.ipControlArr[e]=0:Number(p)>255?o.ipControlArr[e]=255:o.ipControlArr[e]=p;const s=o.ipControlArr.every(u=>u==="")?"":o.ipControlArr.join(".");c("update:ip",s),c("change",s,a.port),p.length===3&&e<o.ipControlArr.length-1&&(l[e+1].focus(),o.ipControlArr[e+1]!==""&&l[e+1].select())},N=(e,r)=>{if(r.keyCode===8&&o.ipControlArr[e]===""&&e>0){const p=l[e-1];p&&p.focus()}},E=e=>{e.target.value&&(c("update:port",Number(e.target.value)),c("change",o.ipControlArr.join("."),Number(e.target.value)))};return t.watch(()=>a.ip,e=>{var r;(r=e==null?void 0:e.split("."))==null||r.forEach((p,s)=>{o.ipControlArr[s]=p?Number(p):""})},{immediate:!0}),(e,r)=>(t.openBlock(),t.createElementBlock("div",_,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(o.ipControlArr,(p,s)=>(t.openBlock(),t.createElementBlock("div",m,[(t.openBlock(),t.createElementBlock("input",{ref_for:!0,ref:g,key:s,name:s+"",value:p,type:"text",onInput:u=>B(s,u),onKeydown:u=>N(s,u),disabled:n.disabled},null,40,h)),s<o.ipControlArr.length-1?(t.openBlock(),t.createElementBlock("i",I,"·")):t.createCommentVNode("",!0)]))),256)),n.port?(t.openBlock(),t.createElementBlock("div",y,[b,t.createElementVNode("input",{class:"port_input",value:f.value,onInput:E,type:"number",disabled:n.disabled},null,40,C)])):t.createCommentVNode("",!0)]))}}),V="",d=((n,c)=>{const a=n.__vccOpts||n;for(const[f,l]of c)a[f]=l;return a})(k,[["__scopeId","data-v-1b423e61"]]);return d.install=n=>{n.component("IpInput",d)},d});
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "author": "czl0325",
4
4
  "homepage": "https://github.com/czl0325/IpInput",
5
5
  "private": false,
6
- "version": "0.1.2",
6
+ "version": "0.1.4",
7
7
  "type": "module",
8
8
  "main": "dist/IpInput.es.js",
9
9
  "module": "dist/IpInput.es.js",