secure-keypad 1.0.8 → 1.0.9

package/dist/index.js

@@ -20,15 +20,15 @@ function L({
   numbers: r = F,
   shuffleKey: t = !1
 } = {}) {
-  const n = k(0), [o, a] = h(0);
+  const n = k(0), [o, l] = h(0);
   return { keys: A(() => {
-    const l = r.map((c) => ({
+    const a = r.map((c) => ({
       type: "num",
       value: c
-    })), b = Array.from({ length: 2 }, () => ({ type: "dummy" })), m = [...l, ...b];
+    })), b = Array.from({ length: 2 }, () => ({ type: "dummy" })), m = [...a, ...b];
     return t ? w(m) : m;
   }, [r, t, o]), onDigitPress: () => {
-    t && (n.current += 1, n.current >= I && (n.current = 0, a((l) => l + 1)));
+    t && (n.current += 1, n.current >= I && (n.current = 0, l((a) => a + 1)));
   } };
 }
 function G({
@@ -79,11 +79,11 @@ const H = [
   pressCooldown: n = 500,
   // 버튼 누른 후 쿨다운 시간 (ms)
   onPress: o,
-  onOkClick: a,
+  onOkClick: l,
   onBackspaceClick: p,
   onClearClick: i
 }) => {
-  const [l, b] = h(null), [m, c] = h([]), [v, g] = h(!1), _ = k(0), y = k(null), T = (e) => {
+  const [a, b] = h(null), [m, c] = h([]), [v, g] = h(!1), _ = k(0), y = k(null), T = (e) => {
     const u = e.target.closest("button");
     if (!u || u.classList.contains("kp__btn--dummy")) return;
     const s = u.dataset.key;
@@ -103,9 +103,9 @@ const H = [
       const s = u + Math.max(0, n);
       _.current = s, n > 0 && N(s);
       const { action: d, key: x } = e.currentTarget.dataset, $ = d ? { type: d } : { type: "num", value: x != null ? Number(x) : void 0 };
-      o?.($), d === "del" && p?.(), d === "clear" && i?.(), d === "ok" && a?.();
+      o?.($), d === "del" && p?.(), d === "clear" && i?.(), d === "ok" && l?.();
     },
-    [o, a, p, i, n]
+    [o, l, p, i, n]
   ), { keys: D, onDigitPress: E } = L({
     shuffleKey: t
   });
@@ -118,15 +118,15 @@ const H = [
     return e;
   });
   return M(() => {
-    if (!r || l === null) {
+    if (!r || a === null) {
       c([]);
       return;
     }
     const { randomKey: e } = j({});
-    console.log("버튼 같이 눌림: ", l, e), c([l, e]), setTimeout(() => {
+    console.log("버튼 같이 눌림: ", a, e), c([a, e]), setTimeout(() => {
       c([]);
     }, 400);
-  }, [r, l]), /* @__PURE__ */ f("div", { className: "kp", children: /* @__PURE__ */ f("div", { className: "kp__grid", onClick: T, children: S.map((e, u) => {
+  }, [r, a]), /* @__PURE__ */ f("div", { className: "kp", children: /* @__PURE__ */ f("div", { className: "kp__grid", onClick: T, children: S.map((e, u) => {
     if (e.type === "num") {
       const s = m.includes(e.value);
       return /* @__PURE__ */ f(
@@ -145,7 +145,7 @@ const H = [
     if (e.type === "del" || e.type === "clear" || e.type === "ok") {
       const s = G({
         type: e.type,
-        onOkClick: a,
+        onOkClick: l,
         onBackspaceClick: p,
         onClearClick: i
       });
@@ -179,5 +179,6 @@ const H = [
   }) }) });
 };
 export {
-  z as Keypad
+  z as Keypad,
+  z as default
 };

package/dist/secure-keypad.css

@@ -0,0 +1 @@
+html,body,#root{@apply w-full h-full;}body{margin:0;background:#fff;font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans KR,Apple SD Gothic Neo,Malgun Gothic,Arial,sans-serif;font-weight:500;font-size:20px}.keypad-page{min-height:100vh;display:grid;place-items:center;padding:22px}:root{--blue: #3182f6;--blue-weak: #eaf3ff;--stroke: #e9ecef;--stroke-2: #e9ecef;--num-bg: #ffffff;--num-tx: #0b1220;--fn-bg: #ffffff;--fn-tx: #0b1220;--radius: 14px;--cell-radius: 0px;--cell-h: 56px;--num-col: minmax(58px, 1fr);--fn-col: 110px;--gap: 0px;--focus: 0 0 0 3px rgba(49, 130, 246, .22)}*{box-sizing:border-box}.kp{width:min(420px,96vw);background:transparent;border:2px solid var(--stroke);padding:0;overflow:hidden}.kp__grid{display:grid;grid-template-columns:repeat(5,1fr) ㄴ;grid-auto-rows:var(--cell-h);gap:var(--gap)}button.kp__btn{appearance:none;border:1px solid var(--stroke-2);border-radius:var(--cell-radius);background:var(--num-bg);padding:0;cursor:pointer;font:inherit;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;transition:background .12s ease,border-color .12s ease;color:#0b1220}button.kp__btn:focus-visible{outline:none;box-shadow:var(--focus);border-color:#3182f6b3}.kp__btn--num{font-weight:900;letter-spacing:.2px;-webkit-tap-highlight-color:transparent}button.kp__btn.kp__btn--num:active,.kp__btn--num.mixed{background:#f3f4f6;border-color:#4f8a4b}.kp__btn--del{display:flex;gap:8px;justify-content:center;background:#fff;border-color:var(--stroke-2)}.kp__btn--del .kp__icon{width:18px;height:18px;flex:0 0 auto;color:#4f8a4b}.kp__btn--del .kp__deltext{display:none}.kp__btn--ok{background:#508c4e!important;color:#fff!important;border-color:var(--stroke-2)!important;letter-spacing:.2px;width:auto;height:auto;position:relative;z-index:2}.kp__btn--ok:active{background:#457c44!important;border-color:#4f8a4b}.kp__btn--dummy{pointer-events:none;cursor:default;background:#fff;border:1px solid var(--stroke-2)}.kp__btn--del{grid-column:5;grid-row:1;color:#457c44!important}.kp__btn--del:active{background:#f3f4f6!important;border-color:#4f8a4b}.kp__btn--clear{grid-column:5;grid-row:2;color:#457c44!important}.kp__btn--clear:active{background:#f3f4f6!important;border-color:#4f8a4b}.kp__btn--ok{grid-column:5;grid-row:3}@media(max-width:380px){:root{--cell-h: 52px;--fn-col: 96px}.kp__btn--num{font-size:26px}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "secure-keypad",
-  "version": "1.0.8",
+  "version": "1.0.9",
   "description": "A secure numeric keypad with shuffled keys and anti-spam input protection",
   "type": "module",
   "main": "./dist/index.js",