(function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");t.appendChild(document.createTextNode(".pl-btn-ghost{--font-size: 14px;--border-radius: 6px;--button-height: 40px;--focus-shadow: 0 0 0 0 transparent;--btn-disabled-bg: var(--color-dis-01);--color-text: var(--txt-00);--shape-shadow: 0 0 0 0 transparent;--append-shadow: 0 0 0 0 transparent;--drop-shadow: 0 0 0 0 transparent;--active-shadow: 0 0 0 0 transparent;--main-padding: 0 12px;text-transform:capitalize;position:relative;overflow:hidden;display:flex;flex-direction:row;justify-content:space-between;align-items:center;white-space:nowrap;gap:8px;padding:var(--main-padding);color:var(--color-text);font-weight:600;font-size:var(--font-size);font-family:var(--font-family-base);line-height:16px;height:var(--button-height);min-height:var(--button-height);border-radius:var(--border-radius);outline:none;-webkit-user-select:none;user-select:none;transition:box-shadow .05s ease-in-out;box-shadow:var(--focus-shadow),var(--append-shadow),var(--shape-shadow),var(--active-shadow),var(--drop-shadow)}.pl-btn-ghost.justifyCenter{justify-content:center}.pl-btn-ghost.round{border-radius:50%;width:var(--button-height);min-width:var(--button-height);padding:0;justify-content:center}.pl-btn-ghost.small{--button-height: 32px;--main-padding: 0 8px}.pl-btn-ghost.medium{--main-padding: 0 16px}.pl-btn-ghost.large{--button-height: 56px;--border-radius: 8px;--font-size: 16px;--main-padding: 0 18px}.pl-btn-ghost.large .mask{--mask-size: 24px}.pl-btn-ghost:disabled{--color-text: var(--dis-00);--icon-color: var(--dis-00)}.pl-btn-ghost:disabled *{color:var(--color-text)}.pl-btn-ghost:not([disabled]){cursor:pointer}.pl-btn-ghost:not([disabled]).hover{background:var(--color-btn-hover)}.pl-btn-ghost:not([disabled]):hover{background:var(--color-btn-hover)}.pl-btn-ghost:focus-visible{--focus-shadow: inset 0 0 0 2px var(--border-color-focus)}.pl-btn-ghost .icon{display:block;width:16px;height:16px}.pl-btn-ghost.loading{box-shadow:none!important}.pl-btn-ghost.loading .mask-loading{display:block;animation:spin 4s linear infinite}.pl-btn-ghost.reverse{flex-direction:row-reverse}.pl-btn-ghost>span{display:inline-flex}.pl-btn-ghost{--color-text: var(--txt-01);--color-btn-hover: var(--btn-sec-hover-grey);--btn-min-width: auto;gap:10px;background:transparent;border:none;width:fit-content;min-width:var(--btn-min-width)}.pl-btn-ghost:disabled{--color-text: var(--btn-disabled-bg);--icon-color: var(--dis-01);box-shadow:none!important;cursor:auto}.pl-btn-ghost.loading{--color-text: var(--btn-disabled-bg)}")),document.head.appendChild(t)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
import { defineComponent as y, computed as a, ref as c, useSlots as z, createElementBlock as r, openBlock as o, mergeProps as B, createCommentVNode as i, renderSlot as s, unref as n, createBlock as d } from "vue";

import u from "../PlIcon24/PlIcon24.vue.js";
import { useRipple as k } from "../../composition/useRipple.js";
const b = { key: 0 }, v = {
  name: "PlBtnGhost"
}, R = /* @__PURE__ */ y({
  ...v,
  props: {
    loading: { type: Boolean },
    size: { default: void 0 },
    round: { type: Boolean },
    icon: { default: void 0 },
    reverse: { type: Boolean },
    justifyCenter: { type: Boolean, default: !1 }
  },
  setup(p) {
    const l = p, f = a(() => l.size === "small"), m = a(() => l.size === "large"), t = c(), g = z();
    return k(t), (e, $) => (o(), r("button", B({
      ref_key: "btnRef",
      ref: t,
      tabindex: "0",
      class: ["pl-btn-ghost", { loading: e.loading, small: f.value, large: m.value, round: e.round, reverse: e.reverse, justifyCenter: e.justifyCenter, [e.$attrs.class + ""]: !0 }]
    }, { ...e.$attrs, disabled: !!e.$attrs.disabled || e.loading }), [
      n(g).default && !e.round ? (o(), r("span", b, [
        s(e.$slots, "default")
      ])) : i("", !0),
      s(e.$slots, "icon", {}, () => [
        e.loading ? (o(), d(n(u), {
          key: 0,
          name: "loading",
          size: e.size
        }, null, 8, ["size"])) : e.icon ? (o(), d(n(u), {
          key: 1,
          name: e.icon,
          size: e.size
        }, null, 8, ["name", "size"])) : i("", !0)
      ]),
      s(e.$slots, "append")
    ], 16));
  }
});
export {
  R as default
};
//# sourceMappingURL=PlBtnGhost.vue.js.map
