sakana-element 2.4.0 → 2.4.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sakana-element",
-  "version": "2.4.0",
+  "version": "2.4.2",
   "description": "A pixel-style Vue 3 component library, built with TypeScript and Vitest",
   "type": "module",
   "main": "./dist/umd/index.umd.cjs",

package/dist/es/Input-bThwBbNZ.js

@@ -1,42 +0,0 @@
-import { c as e, r as o, d as a, w as l } from "./utils-BXICIEsD.js";
-import { defineComponent as s, ref as r, shallowRef as u, useAttrs as t, computed as p, watch as n, createElementBlock as d, openBlock as c, normalizeStyle as i, normalizeClass as f, unref as v, withDirectives as m, Fragment as y, createCommentVNode as h, createElementVNode as x, renderSlot as _, mergeProps as w, vModelDynamic as k, createBlock as b, withModifiers as $, vModelText as g, nextTick as B } from "vue";
-import { e as V, u as I } from "./hooks-pU4JmsO3.js";
-import { u as P } from "./Form-B_XDnSjK.js";
-import { P as j } from "./Icon-D6qRB3pq.js";
-import { q as C, f as F } from "./vendor-DrBJKLFW.js";
-const R = /* @__PURE__ */ new Set(["primary", "success", "warning", "danger", "info"]), z = { default: { "border-color": "color", "hover-border-color": "dark", "focus-border-color": "dark", "shadow-color": "dark", "focus-shadow-color": "dark" }, ghost: { "border-color": "transparent", "hover-border-color": "color", "focus-border-color": "dark", "shadow-color": "transparent", "focus-shadow-color": "dark" } }, M = { key: 0, class: "px-input__prepend" }, U = { key: 0, class: "px-input__prefix" }, q = ["id", "type", "disabled", "readonly", "autocomplete", "placeholder", "autofocus", "form"], A = { key: 1, class: "px-input__suffix" }, S = { key: 1, class: "px-input__append" }, D = ["id", "disabled", "readonly", "autocomplete", "placeholder", "autofocus", "form"], E = s({ name: "PxInput", inheritAttrs: false, __name: "Input", props: { id: {}, modelValue: {}, type: { default: "text" }, size: {}, color: {}, ghost: { type: Boolean }, disabled: { type: Boolean }, clearable: { type: Boolean }, showPassword: { type: Boolean }, placeholder: {}, readonly: { type: Boolean }, autocomplete: { default: "off" }, autofocus: { type: Boolean }, form: {} }, emits: ["update:modelValue", "input", "change", "focus", "blur", "clear"], setup(l2, { expose: s2, emit: E2 }) {
-  const G2 = l2, H = E2, J = r(G2.modelValue), K = r(false), L = u(), N = u(), O = t(), { formItem: Q } = P(), T = p((() => L.value || N.value)), W = p((() => G2.disabled)), X = p((() => R.has(G2.color ?? ""))), Y = p((() => !!G2.color && !X.value)), Z = p((() => {
-    if (!Y.value) return {};
-    const a2 = e(G2.color), l3 = G2.ghost ? "ghost" : "default";
-    return o(a2, "px-input", z[l3]);
-  })), ee = p((() => G2.clearable && !!J.value && !W.value && le.value)), oe = p((() => "password" === G2.type && G2.showPassword && !W.value && !!J.value)), { wrapperRef: ae, isFocused: le, handleFocus: se, handleBlur: re } = V(T, { afterBlur() {
-    Q == null ? void 0 : Q.validate("blur").catch(((e2) => a()));
-  } }), ue = () => {
-    J.value = "", F(["input", "change", "update:modelValue"], ((e2) => H(e2, ""))), H("clear"), Q == null ? void 0 : Q.clearValidate();
-  };
-  function te() {
-    H("update:modelValue", J.value), H("input", J.value);
-  }
-  function pe() {
-    H("change", J.value);
-  }
-  function ne() {
-    K.value = !K.value;
-  }
-  return n((() => G2.modelValue), ((e2) => {
-    J.value = e2, Q == null ? void 0 : Q.validate("change").catch(((e3) => a()));
-  })), s2({ ref: T, focus: async () => {
-    var _a;
-    await B(), (_a = T.value) == null ? void 0 : _a.focus();
-  }, blur: () => {
-    var _a;
-    (_a = T.value) == null ? void 0 : _a.blur();
-  }, select: () => {
-    var _a;
-    (_a = T.value) == null ? void 0 : _a.select();
-  }, clear: ue }), (e2, o2) => (c(), d("div", { class: f(["px-input", { [`px-input--${e2.type}`]: e2.type, [`px-input--${e2.size}`]: e2.size, [`px-input--${e2.color}`]: X.value, "is-ghost": e2.ghost, "is-disabled": W.value, "is-prepend": e2.$slots.prepend, "is-append": e2.$slots.append, "is-prefix": e2.$slots.prefix, "is-suffix": e2.$slots.suffix, "is-focus": v(le) }]), style: i(Z.value) }, ["textarea" !== e2.type ? (c(), d(y, { key: 0 }, [e2.$slots.prepend ? (c(), d("div", M, [_(e2.$slots, "prepend")])) : h("", true), x("div", { class: "px-input__wrapper", ref_key: "wrapperRef", ref: ae }, [e2.$slots.prefix ? (c(), d("span", U, [_(e2.$slots, "prefix")])) : h("", true), m(x("input", w({ class: "px-input__inner", ref_key: "inputRef", ref: L, id: v(I)().value, type: e2.showPassword ? K.value ? "text" : "password" : e2.type, disabled: W.value, readonly: e2.readonly, autocomplete: e2.autocomplete, placeholder: e2.placeholder, autofocus: e2.autofocus, form: e2.form, "onUpdate:modelValue": o2[0] || (o2[0] = (e3) => J.value = e3) }, v(O), { onInput: te, onChange: pe, onFocus: o2[1] || (o2[1] = (...e3) => v(se) && v(se)(...e3)), onBlur: o2[2] || (o2[2] = (...e3) => v(re) && v(re)(...e3)) }), null, 16, q), [[k, J.value]]), e2.$slots.suffix || ee.value || oe.value ? (c(), d("span", A, [_(e2.$slots, "suffix"), ee.value ? (c(), b(j, { key: 0, icon: "close-box", class: "px-input__clear", onClick: ue, onMousedown: $(v(C), ["prevent"]) }, null, 8, ["onMousedown"])) : h("", true), oe.value && K.value ? (c(), b(j, { key: 1, icon: "eye", class: "px-input__password", onClick: ne })) : h("", true), oe.value && !K.value ? (c(), b(j, { key: 2, icon: "eye-closed", class: "px-input__password", onClick: ne })) : h("", true)])) : h("", true)], 512), e2.$slots.append ? (c(), d("div", S, [_(e2.$slots, "append")])) : h("", true)], 64)) : m((c(), d("textarea", w({ key: 1, class: "px-textarea__wrapper", ref_key: "textareaRef", ref: N, id: v(I)().value, disabled: W.value, readonly: e2.readonly, autocomplete: e2.autocomplete, placeholder: e2.placeholder, autofocus: e2.autofocus, form: e2.form, "onUpdate:modelValue": o2[3] || (o2[3] = (e3) => J.value = e3) }, v(O), { onInput: te, onChange: pe, onFocus: o2[4] || (o2[4] = (...e3) => v(se) && v(se)(...e3)), onBlur: o2[5] || (o2[5] = (...e3) => v(re) && v(re)(...e3)) }), null, 16, D)), [[g, J.value]])], 6));
-} }), G = l(E);
-export {
-  G as P,
-  E as _
-};

package/dist/es/utils-BXICIEsD.js

@@ -1,139 +0,0 @@
-import { h as e, d as t, y as o } from "./vendor-DrBJKLFW.js";
-import { defineComponent as r } from "vue";
-function n(e2, t2) {
-  const o2 = parseInt(e2.replace("#", ""), 16);
-  return `#${(Math.max(0, (o2 >> 16) - Math.round(2.55 * t2)) << 16 | Math.max(0, (o2 >> 8 & 255) - Math.round(2.55 * t2)) << 8 | Math.max(0, (255 & o2) - Math.round(2.55 * t2))).toString(16).padStart(6, "0")}`;
-}
-function a(e2, t2) {
-  const o2 = parseInt(e2.replace("#", ""), 16);
-  return `#${(Math.min(255, (o2 >> 16) + Math.round(2.55 * t2)) << 16 | Math.min(255, (o2 >> 8 & 255) + Math.round(2.55 * t2)) << 8 | Math.min(255, (255 & o2) + Math.round(2.55 * t2))).toString(16).padStart(6, "0")}`;
-}
-function c(e2) {
-  const t2 = parseInt(e2.replace("#", ""), 16);
-  return (0.299 * (t2 >> 16) + 0.587 * (t2 >> 8 & 255) + 0.114 * (255 & t2)) / 255 > 0.6 ? "#1e1e2e" : "#ffffff";
-}
-function s(e2) {
-  return { color: e2, dark: n(e2, 15), light: a(e2, 35), contrast: c(e2), transparent: "transparent" };
-}
-function i(e2, t2, o2) {
-  const r2 = {};
-  for (const [n2, a2] of Object.entries(o2)) r2[`--${t2}-${n2}`] = e2[a2];
-  return r2;
-}
-const l = { outline: { "text-color": "color", "bg-color": "transparent", "border-color": "color", "shadow-color": "transparent" }, dash: { "text-color": "color", "bg-color": "light", "border-color": "color", "shadow-color": "transparent" }, default: { "text-color": "contrast", "bg-color": "color", "border-color": "dark", "shadow-color": "dark" } };
-function u(e2, t2) {
-}
-const f = { spinner: "loader", loading: "loader", "eye-slash": "eye-closed", "eye-off": "eye-closed", xmark: "close", x: "close", times: "close", "circle-xmark": "close-box", "x-circle": "close-box", "times-circle": "close-box", error: "close-box", "circle-info": "info-box", "info-circle": "info-box", info: "info-box", "check-circle": "check", "circle-check": "check", success: "check", "circle-exclamation": "warning-box", "exclamation-circle": "warning-box", warning: "warning-box", "angle-down": "chevron-down", "caret-down": "chevron-down", "angle-up": "chevron-up", "caret-up": "chevron-up", "angle-left": "chevron-left", "caret-left": "chevron-left", "angle-right": "chevron-right", "caret-right": "chevron-right", "question-circle": "info-box", "circle-question": "info-box", help: "info-box", question: "info-box", gear: "sliders", cog: "sliders", settings: "sliders", star: "bookmark", "star-solid": "bookmark" };
-function d(e2) {
-  return e2 in f ? f[e2] : e2;
-}
-const h = /* @__PURE__ */ new Set(["svg", "path", "rect", "circle", "ellipse", "line", "polyline", "polygon", "g", "defs", "clipPath", "mask", "title", "desc", "linearGradient", "radialGradient", "stop", "symbol", "use"]), g = /^on/i, p = /^\s*javascript\s*:/i;
-function m(e2) {
-  if (!e2 || "string" != typeof e2) return "";
-  if ("undefined" == typeof DOMParser) return "";
-  const t2 = new DOMParser().parseFromString(e2, "image/svg+xml");
-  return t2.querySelector("parsererror") ? "" : (b(t2.documentElement), t2.documentElement.outerHTML);
-}
-function b(e2) {
-  const t2 = Array.from(e2.children);
-  for (const e3 of t2) {
-    const t3 = e3.tagName.toLowerCase();
-    if (h.has(t3)) {
-      for (const t4 of Array.from(e3.attributes)) (g.test(t4.name) || "href" === t4.name && p.test(t4.value) || "xlink:href" === t4.name && p.test(t4.value)) && e3.removeAttribute(t4.name);
-      b(e3);
-    } else e3.remove();
-  }
-}
-const x = /* @__PURE__ */ new Map();
-function M(e2) {
-  for (const [t2, o2] of Object.entries(e2)) x.set(t2, m(o2));
-}
-function v(e2) {
-  return x.get(e2);
-}
-const w = (e2) => (e2.install = (t2) => {
-  const o2 = e2.name;
-  t2.component(o2, e2);
-}, e2), y = (e2, t2) => (e2.install = (o2) => {
-  o2.config.globalProperties[t2] = e2;
-}, e2);
-function k(e2, t2) {
-  for (; e2.length >= t2; ) e2[0].props.onDestroy();
-}
-function S(e2) {
-  let t2 = false, o2 = 0;
-  const r2 = (t3) => {
-    var _a;
-    "Escape" === t3.code && ((_a = e2()) == null ? void 0 : _a.handler.close());
-  };
-  return { register() {
-    o2++, t2 || (document.addEventListener("keydown", r2), t2 = true);
-  }, unregister() {
-    o2--, o2 <= 0 && (document.removeEventListener("keydown", r2), t2 = false, o2 = 0);
-  } };
-}
-function N(e2, t2, o2, r2) {
-  if (0 === r2.length) return [e2, t2, o2];
-  let n2 = 1 / 0, a2 = r2[0];
-  for (const c2 of r2) {
-    const r3 = (e2 - c2[0]) ** 2 + (t2 - c2[1]) ** 2 + (o2 - c2[2]) ** 2;
-    if (0 === r3) return c2;
-    r3 < n2 && (n2 = r3, a2 = c2);
-  }
-  return a2;
-}
-function $(e2, t2, o2) {
-  const r2 = e2.getContext("2d");
-  if (!r2) return;
-  const { pixelSize: n2, grayscale: a2 = false, palette: c2, background: s2 = "#FFFFFF" } = o2, i2 = t2.naturalWidth, l2 = t2.naturalHeight;
-  e2.width = i2, e2.height = l2, r2.drawImage(t2, 0, 0, i2, l2);
-  const u2 = r2.getImageData(0, 0, i2, l2).data, f2 = Math.max(1, Math.round(n2)), d2 = c2 ? (function(e3) {
-    return e3.map(((e4) => "string" == typeof e4 ? (function(e5) {
-      const t3 = e5.replace("#", "");
-      return [parseInt(t3.substring(0, 2), 16), parseInt(t3.substring(2, 4), 16), parseInt(t3.substring(4, 6), 16)];
-    })(e4) : e4));
-  })(c2) : null;
-  r2.fillStyle = s2, r2.fillRect(0, 0, i2, l2);
-  for (let e3 = 0; e3 < l2; e3 += f2) for (let t3 = 0; t3 < i2; t3 += f2) {
-    const o3 = Math.min(f2, i2 - t3), n3 = Math.min(f2, l2 - e3);
-    let c3 = 0, s3 = 0, h2 = 0, g2 = 0;
-    for (let r3 = 0; r3 < n3; r3++) for (let n4 = 0; n4 < o3; n4++) {
-      const o4 = 4 * ((e3 + r3) * i2 + (t3 + n4));
-      c3 += u2[o4], s3 += u2[o4 + 1], h2 += u2[o4 + 2], g2++;
-    }
-    let p2 = Math.round(c3 / g2), m2 = Math.round(s3 / g2), b2 = Math.round(h2 / g2);
-    a2 && (p2 = m2 = b2 = Math.round(0.299 * p2 + 0.587 * m2 + 0.114 * b2)), d2 && ([p2, m2, b2] = N(p2, m2, b2, d2)), r2.fillStyle = `rgb(${p2},${m2},${b2})`, r2.fillRect(t3, e3, o3, n3);
-  }
-}
-function F(o2, r2 = "px") {
-  return o2 ? e(o2) || ((e2) => !!t(e2) && !Number.isNaN(Number(e2)))(o2) ? `${o2}${r2}` : t(o2) ? o2 : void 0 : "";
-}
-function I(e2, t2, o2) {
-  return Math.max(t2, Math.min(o2, e2));
-}
-const j = /* @__PURE__ */ new Map([["info", "info-box"], ["success", "check"], ["warning", "warning-box"], ["danger", "close-box"], ["error", "close-box"]]), O = r({ props: { vNode: { type: [String, Object, Function], required: true } }, setup: (e2) => () => o(e2.vNode) ? e2.vNode() : e2.vNode }), q = (e2, t2) => {
-  const o2 = e2.__vccOpts || e2;
-  for (const [e3, r2] of t2) o2[e3] = r2;
-  return o2;
-};
-export {
-  O as R,
-  l as S,
-  q as _,
-  I as a,
-  F as b,
-  s as c,
-  u as d,
-  d as e,
-  M as f,
-  v as g,
-  k as h,
-  S as i,
-  y as j,
-  a as l,
-  $ as p,
-  i as r,
-  m as s,
-  j as t,
-  w
-};