epic-designer-gold/dist/index-DQ9Vb0QH.js

基于vue3的设计器,可视化开发页面表单

import { c as D } from "./_commonjsHelpers-BVfed4GL.js";
import { r as Re } from "./_vue_commonjs-external-NwvjgbHK.js";
import { r as ge, _ as be, c as me, a as Pe, e as ke, p as We, b as je } from "./index-D1ZL6feZ.js";
import { b as Ne } from "./index-BsXm6fLD.js";
import { f as Le, a as qe, _ as Qe } from "./index-gA02bxwJ.js";
var Ve = {}, _e = {}, J = {};
Object.defineProperty(J, "__esModule", { value: !0 });
J.createHoverColor = Xe;
J.createPressedColor = Ye;
const Se = ge;
function Xe(n) {
  return (0, Se.composite)(n, [255, 255, 255, 0.16]);
}
function Ye(n) {
  return (0, Se.composite)(n, [0, 0, 0, 0.12]);
}
var U = {};
Object.defineProperty(U, "__esModule", { value: !0 });
U.buttonGroupInjectionKey = void 0;
const Ae = be;
U.buttonGroupInjectionKey = (0, Ae.createInjectionKey)("n-button-group");
var Te = {}, xe = {}, V = {}, fe = {};
Object.defineProperty(fe, "__esModule", { value: !0 });
fe.default = {
  paddingTiny: "0 6px",
  paddingSmall: "0 10px",
  paddingMedium: "0 14px",
  paddingLarge: "0 18px",
  paddingRoundTiny: "0 10px",
  paddingRoundSmall: "0 14px",
  paddingRoundMedium: "0 18px",
  paddingRoundLarge: "0 22px",
  iconMarginTiny: "6px",
  iconMarginSmall: "6px",
  iconMarginMedium: "6px",
  iconMarginLarge: "6px",
  iconSizeTiny: "14px",
  iconSizeSmall: "18px",
  iconSizeMedium: "18px",
  iconSizeLarge: "20px",
  rippleDuration: ".6s"
};
var Je = D && D.__importDefault || function(n) {
  return n && n.__esModule ? n : { default: n };
};
Object.defineProperty(V, "__esModule", { value: !0 });
V.self = He;
const Ue = me, Ze = Je(fe);
function He(n) {
  const { heightTiny: p, heightSmall: a, heightMedium: T, heightLarge: z, borderRadius: c, fontSizeTiny: ee, fontSizeSmall: oe, fontSizeMedium: re, fontSizeLarge: I, opacityDisabled: G, textColor2: r, textColor3: te, primaryColorHover: f, primaryColorPressed: P, borderColor: o, primaryColor: C, baseColor: s, infoColor: y, infoColorHover: v, infoColorPressed: R, successColor: g, successColorHover: m, successColorPressed: k, warningColor: H, warningColorHover: $, warningColorPressed: W, errorColor: E, errorColorHover: _, errorColorPressed: B, fontWeight: ne, buttonColor2: X, buttonColor2Hover: q, buttonColor2Pressed: j, fontWeightStrong: M } = n;
  return Object.assign(Object.assign({}, Ze.default), {
    heightTiny: p,
    heightSmall: a,
    heightMedium: T,
    heightLarge: z,
    borderRadiusTiny: c,
    borderRadiusSmall: c,
    borderRadiusMedium: c,
    borderRadiusLarge: c,
    fontSizeTiny: ee,
    fontSizeSmall: oe,
    fontSizeMedium: re,
    fontSizeLarge: I,
    opacityDisabled: G,
    // secondary
    colorOpacitySecondary: "0.16",
    colorOpacitySecondaryHover: "0.22",
    colorOpacitySecondaryPressed: "0.28",
    colorSecondary: X,
    colorSecondaryHover: q,
    colorSecondaryPressed: j,
    // tertiary
    colorTertiary: X,
    colorTertiaryHover: q,
    colorTertiaryPressed: j,
    // quaternary
    colorQuaternary: "#0000",
    colorQuaternaryHover: q,
    colorQuaternaryPressed: j,
    // default type
    color: "#0000",
    colorHover: "#0000",
    colorPressed: "#0000",
    colorFocus: "#0000",
    colorDisabled: "#0000",
    textColor: r,
    textColorTertiary: te,
    textColorHover: f,
    textColorPressed: P,
    textColorFocus: f,
    textColorDisabled: r,
    textColorText: r,
    textColorTextHover: f,
    textColorTextPressed: P,
    textColorTextFocus: f,
    textColorTextDisabled: r,
    textColorGhost: r,
    textColorGhostHover: f,
    textColorGhostPressed: P,
    textColorGhostFocus: f,
    textColorGhostDisabled: r,
    border: `1px solid ${o}`,
    borderHover: `1px solid ${f}`,
    borderPressed: `1px solid ${P}`,
    borderFocus: `1px solid ${f}`,
    borderDisabled: `1px solid ${o}`,
    rippleColor: C,
    // primary
    colorPrimary: C,
    colorHoverPrimary: f,
    colorPressedPrimary: P,
    colorFocusPrimary: f,
    colorDisabledPrimary: C,
    textColorPrimary: s,
    textColorHoverPrimary: s,
    textColorPressedPrimary: s,
    textColorFocusPrimary: s,
    textColorDisabledPrimary: s,
    textColorTextPrimary: C,
    textColorTextHoverPrimary: f,
    textColorTextPressedPrimary: P,
    textColorTextFocusPrimary: f,
    textColorTextDisabledPrimary: r,
    textColorGhostPrimary: C,
    textColorGhostHoverPrimary: f,
    textColorGhostPressedPrimary: P,
    textColorGhostFocusPrimary: f,
    textColorGhostDisabledPrimary: C,
    borderPrimary: `1px solid ${C}`,
    borderHoverPrimary: `1px solid ${f}`,
    borderPressedPrimary: `1px solid ${P}`,
    borderFocusPrimary: `1px solid ${f}`,
    borderDisabledPrimary: `1px solid ${C}`,
    rippleColorPrimary: C,
    // info
    colorInfo: y,
    colorHoverInfo: v,
    colorPressedInfo: R,
    colorFocusInfo: v,
    colorDisabledInfo: y,
    textColorInfo: s,
    textColorHoverInfo: s,
    textColorPressedInfo: s,
    textColorFocusInfo: s,
    textColorDisabledInfo: s,
    textColorTextInfo: y,
    textColorTextHoverInfo: v,
    textColorTextPressedInfo: R,
    textColorTextFocusInfo: v,
    textColorTextDisabledInfo: r,
    textColorGhostInfo: y,
    textColorGhostHoverInfo: v,
    textColorGhostPressedInfo: R,
    textColorGhostFocusInfo: v,
    textColorGhostDisabledInfo: y,
    borderInfo: `1px solid ${y}`,
    borderHoverInfo: `1px solid ${v}`,
    borderPressedInfo: `1px solid ${R}`,
    borderFocusInfo: `1px solid ${v}`,
    borderDisabledInfo: `1px solid ${y}`,
    rippleColorInfo: y,
    // success
    colorSuccess: g,
    colorHoverSuccess: m,
    colorPressedSuccess: k,
    colorFocusSuccess: m,
    colorDisabledSuccess: g,
    textColorSuccess: s,
    textColorHoverSuccess: s,
    textColorPressedSuccess: s,
    textColorFocusSuccess: s,
    textColorDisabledSuccess: s,
    textColorTextSuccess: g,
    textColorTextHoverSuccess: m,
    textColorTextPressedSuccess: k,
    textColorTextFocusSuccess: m,
    textColorTextDisabledSuccess: r,
    textColorGhostSuccess: g,
    textColorGhostHoverSuccess: m,
    textColorGhostPressedSuccess: k,
    textColorGhostFocusSuccess: m,
    textColorGhostDisabledSuccess: g,
    borderSuccess: `1px solid ${g}`,
    borderHoverSuccess: `1px solid ${m}`,
    borderPressedSuccess: `1px solid ${k}`,
    borderFocusSuccess: `1px solid ${m}`,
    borderDisabledSuccess: `1px solid ${g}`,
    rippleColorSuccess: g,
    // warning
    colorWarning: H,
    colorHoverWarning: $,
    colorPressedWarning: W,
    colorFocusWarning: $,
    colorDisabledWarning: H,
    textColorWarning: s,
    textColorHoverWarning: s,
    textColorPressedWarning: s,
    textColorFocusWarning: s,
    textColorDisabledWarning: s,
    textColorTextWarning: H,
    textColorTextHoverWarning: $,
    textColorTextPressedWarning: W,
    textColorTextFocusWarning: $,
    textColorTextDisabledWarning: r,
    textColorGhostWarning: H,
    textColorGhostHoverWarning: $,
    textColorGhostPressedWarning: W,
    textColorGhostFocusWarning: $,
    textColorGhostDisabledWarning: H,
    borderWarning: `1px solid ${H}`,
    borderHoverWarning: `1px solid ${$}`,
    borderPressedWarning: `1px solid ${W}`,
    borderFocusWarning: `1px solid ${$}`,
    borderDisabledWarning: `1px solid ${H}`,
    rippleColorWarning: H,
    // error
    colorError: E,
    colorHoverError: _,
    colorPressedError: B,
    colorFocusError: _,
    colorDisabledError: E,
    textColorError: s,
    textColorHoverError: s,
    textColorPressedError: s,
    textColorFocusError: s,
    textColorDisabledError: s,
    textColorTextError: E,
    textColorTextHoverError: _,
    textColorTextPressedError: B,
    textColorTextFocusError: _,
    textColorTextDisabledError: r,
    textColorGhostError: E,
    textColorGhostHoverError: _,
    textColorGhostPressedError: B,
    textColorGhostFocusError: _,
    textColorGhostDisabledError: E,
    borderError: `1px solid ${E}`,
    borderHoverError: `1px solid ${_}`,
    borderPressedError: `1px solid ${B}`,
    borderFocusError: `1px solid ${_}`,
    borderDisabledError: `1px solid ${E}`,
    rippleColorError: E,
    waveOpacity: "0.6",
    fontWeight: ne,
    fontWeightStrong: M
  });
}
const eo = {
  name: "Button",
  common: Ue.commonLight,
  self: He
};
V.default = eo;
Object.defineProperty(xe, "__esModule", { value: !0 });
const oo = me, ro = V, to = {
  name: "Button",
  common: oo.commonDark,
  self(n) {
    const p = (0, ro.self)(n);
    return p.waveOpacity = "0.8", p.colorOpacitySecondary = "0.16", p.colorOpacitySecondaryHover = "0.2", p.colorOpacitySecondaryPressed = "0.12", p;
  }
};
xe.default = to;
var Z = {}, ye = {};
Object.defineProperty(ye, "__esModule", {
  value: !0
});
const L = Pe;
ye.default = (0, L.cB)("button", [(0, L.cM)("rtl", `
 direction: rtl;
 `, [(0, L.cE)("icon", {
  margin: "var(--n-icon-margin)",
  marginRight: 0
}), (0, L.cE)("content", [(0, L.c)("~", [(0, L.cE)("icon", {
  margin: "var(--n-icon-margin)",
  marginLeft: 0
})])])])]);
var no = D && D.__importDefault || function(n) {
  return n && n.__esModule ? n : { default: n };
};
Object.defineProperty(Z, "__esModule", { value: !0 });
Z.buttonRtl = void 0;
const lo = no(ye);
Z.buttonRtl = {
  name: "Button",
  style: lo.default
};
(function(n) {
  var p = D && D.__importDefault || function(c) {
    return c && c.__esModule ? c : { default: c };
  };
  Object.defineProperty(n, "__esModule", { value: !0 }), n.buttonRtl = n.buttonLight = n.buttonDark = void 0;
  var a = xe;
  Object.defineProperty(n, "buttonDark", { enumerable: !0, get: function() {
    return p(a).default;
  } });
  var T = V;
  Object.defineProperty(n, "buttonLight", { enumerable: !0, get: function() {
    return p(T).default;
  } });
  var z = Z;
  Object.defineProperty(n, "buttonRtl", { enumerable: !0, get: function() {
    return z.buttonRtl;
  } });
})(Te);
var ve = {};
Object.defineProperty(ve, "__esModule", {
  value: !0
});
const t = Pe, so = Le, io = qe, ao = be;
ve.default = (0, t.c)([(0, t.cB)("button", `
 margin: 0;
 font-weight: var(--n-font-weight);
 line-height: 1;
 font-family: inherit;
 padding: var(--n-padding);
 height: var(--n-height);
 font-size: var(--n-font-size);
 border-radius: var(--n-border-radius);
 color: var(--n-text-color);
 background-color: var(--n-color);
 width: var(--n-width);
 white-space: nowrap;
 outline: none;
 position: relative;
 z-index: auto;
 border: none;
 display: inline-flex;
 flex-wrap: nowrap;
 flex-shrink: 0;
 align-items: center;
 justify-content: center;
 user-select: none;
 -webkit-user-select: none;
 text-align: center;
 cursor: pointer;
 text-decoration: none;
 transition:
 color .3s var(--n-bezier),
 background-color .3s var(--n-bezier),
 opacity .3s var(--n-bezier),
 border-color .3s var(--n-bezier);
 `, [(0, t.cM)("color", [(0, t.cE)("border", {
  borderColor: "var(--n-border-color)"
}), (0, t.cM)("disabled", [(0, t.cE)("border", {
  borderColor: "var(--n-border-color-disabled)"
})]), (0, t.cNotM)("disabled", [(0, t.c)("&:focus", [(0, t.cE)("state-border", {
  borderColor: "var(--n-border-color-focus)"
})]), (0, t.c)("&:hover", [(0, t.cE)("state-border", {
  borderColor: "var(--n-border-color-hover)"
})]), (0, t.c)("&:active", [(0, t.cE)("state-border", {
  borderColor: "var(--n-border-color-pressed)"
})]), (0, t.cM)("pressed", [(0, t.cE)("state-border", {
  borderColor: "var(--n-border-color-pressed)"
})])])]), (0, t.cM)("disabled", {
  backgroundColor: "var(--n-color-disabled)",
  color: "var(--n-text-color-disabled)"
}, [(0, t.cE)("border", {
  border: "var(--n-border-disabled)"
})]), (0, t.cNotM)("disabled", [(0, t.c)("&:focus", {
  backgroundColor: "var(--n-color-focus)",
  color: "var(--n-text-color-focus)"
}, [(0, t.cE)("state-border", {
  border: "var(--n-border-focus)"
})]), (0, t.c)("&:hover", {
  backgroundColor: "var(--n-color-hover)",
  color: "var(--n-text-color-hover)"
}, [(0, t.cE)("state-border", {
  border: "var(--n-border-hover)"
})]), (0, t.c)("&:active", {
  backgroundColor: "var(--n-color-pressed)",
  color: "var(--n-text-color-pressed)"
}, [(0, t.cE)("state-border", {
  border: "var(--n-border-pressed)"
})]), (0, t.cM)("pressed", {
  backgroundColor: "var(--n-color-pressed)",
  color: "var(--n-text-color-pressed)"
}, [(0, t.cE)("state-border", {
  border: "var(--n-border-pressed)"
})])]), (0, t.cM)("loading", "cursor: wait;"), (0, t.cB)("base-wave", `
 pointer-events: none;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 animation-iteration-count: 1;
 animation-duration: var(--n-ripple-duration);
 animation-timing-function: var(--n-bezier-ease-out), var(--n-bezier-ease-out);
 `, [(0, t.cM)("active", {
  zIndex: 1,
  animationName: "button-wave-spread, button-wave-opacity"
})]), ao.isBrowser && "MozBoxSizing" in document.createElement("div").style ? (0, t.c)("&::moz-focus-inner", {
  border: 0
}) : null, (0, t.cE)("border, state-border", `
 position: absolute;
 left: 0;
 top: 0;
 right: 0;
 bottom: 0;
 border-radius: inherit;
 transition: border-color .3s var(--n-bezier);
 pointer-events: none;
 `), (0, t.cE)("border", {
  border: "var(--n-border)"
}), (0, t.cE)("state-border", {
  border: "var(--n-border)",
  borderColor: "#0000",
  zIndex: 1
}), (0, t.cE)("icon", `
 margin: var(--n-icon-margin);
 margin-left: 0;
 height: var(--n-icon-size);
 width: var(--n-icon-size);
 max-width: var(--n-icon-size);
 font-size: var(--n-icon-size);
 position: relative;
 flex-shrink: 0;
 `, [(0, t.cB)("icon-slot", `
 height: var(--n-icon-size);
 width: var(--n-icon-size);
 position: absolute;
 left: 0;
 top: 50%;
 transform: translateY(-50%);
 display: flex;
 align-items: center;
 justify-content: center;
 `, [(0, io.iconSwitchTransition)({
  top: "50%",
  originalTransform: "translateY(-50%)"
})]), (0, so.fadeInWidthExpandTransition)()]), (0, t.cE)("content", `
 display: flex;
 align-items: center;
 flex-wrap: nowrap;
 min-width: 0;
 `, [(0, t.c)("~", [(0, t.cE)("icon", {
  margin: "var(--n-icon-margin)",
  marginRight: 0
})])]), (0, t.cM)("block", `
 display: flex;
 width: 100%;
 `), (0, t.cM)("dashed", [(0, t.cE)("border, state-border", {
  borderStyle: "dashed !important"
})]), (0, t.cM)("disabled", {
  cursor: "not-allowed",
  opacity: "var(--n-opacity-disabled)"
})]), (0, t.c)("@keyframes button-wave-spread", {
  from: {
    boxShadow: "0 0 0.5px 0 var(--n-ripple-color)"
  },
  to: {
    // don't use exact 5px since chrome will display the animation with glitches
    boxShadow: "0 0 0.5px 4.5px var(--n-ripple-color)"
  }
}), (0, t.c)("@keyframes button-wave-opacity", {
  from: {
    opacity: "var(--n-wave-opacity)"
  },
  to: {
    opacity: 0
  }
})]);
(function(n) {
  var p = D && D.__importDefault || function(o) {
    return o && o.__esModule ? o : { default: o };
  };
  Object.defineProperty(n, "__esModule", { value: !0 }), n.XButton = n.buttonProps = void 0;
  const a = Re, T = ke, z = ge, c = J, ee = U, oe = We, re = Ne, I = je, G = Qe, r = be, te = Te, f = p(ve);
  n.buttonProps = Object.assign(Object.assign({}, I.useTheme.props), { color: String, textColor: String, text: Boolean, block: Boolean, loading: Boolean, disabled: Boolean, circle: Boolean, size: String, ghost: Boolean, round: Boolean, secondary: Boolean, tertiary: Boolean, quaternary: Boolean, strong: Boolean, focusable: {
    type: Boolean,
    default: !0
  }, keyboard: {
    type: Boolean,
    default: !0
  }, tag: {
    type: String,
    default: "button"
  }, type: {
    type: String,
    default: "default"
  }, dashed: Boolean, renderIcon: Function, iconPlacement: {
    type: String,
    default: "left"
  }, attrType: {
    type: String,
    default: "button"
  }, bordered: {
    type: Boolean,
    default: !0
  }, onClick: [Function, Array], nativeFocusBehavior: {
    type: Boolean,
    default: !re.isSafari
  } });
  const P = (0, a.defineComponent)({
    name: "Button",
    props: n.buttonProps,
    setup(o) {
      process.env.NODE_ENV !== "production" && (0, a.watchEffect)(() => {
        const { dashed: l, ghost: x, text: S, secondary: e, tertiary: Q, quaternary: N } = o;
        (l || x || S) && (e || Q || N) && (0, r.warnOnce)("button", "`dashed`, `ghost` and `text` props can't be used along with `secondary`, `tertiary` and `quaternary` props.");
      });
      const C = (0, a.ref)(null), s = (0, a.ref)(null), y = (0, a.ref)(!1), v = (0, T.useMemo)(() => !o.quaternary && !o.tertiary && !o.secondary && !o.text && (!o.color || o.ghost || o.dashed) && o.bordered), R = (0, a.inject)(ee.buttonGroupInjectionKey, {}), { mergedSizeRef: g } = (0, I.useFormItem)({}, {
        defaultSize: "medium",
        mergedSize: (l) => {
          const { size: x } = o;
          if (x)
            return x;
          const { size: S } = R;
          if (S)
            return S;
          const { mergedSize: e } = l || {};
          return e ? e.value : "medium";
        }
      }), m = (0, a.computed)(() => o.focusable && !o.disabled), k = (l) => {
        var x;
        m.value || l.preventDefault(), !o.nativeFocusBehavior && (l.preventDefault(), !o.disabled && m.value && ((x = C.value) === null || x === void 0 || x.focus({ preventScroll: !0 })));
      }, H = (l) => {
        var x;
        if (!o.disabled && !o.loading) {
          const { onClick: S } = o;
          S && (0, r.call)(S, l), o.text || (x = s.value) === null || x === void 0 || x.play();
        }
      }, $ = (l) => {
        switch (l.key) {
          case "Enter":
            if (!o.keyboard)
              return;
            y.value = !1;
        }
      }, W = (l) => {
        switch (l.key) {
          case "Enter":
            if (!o.keyboard || o.loading) {
              l.preventDefault();
              return;
            }
            y.value = !0;
        }
      }, E = () => {
        y.value = !1;
      }, { inlineThemeDisabled: _, mergedClsPrefixRef: B, mergedRtlRef: ne } = (0, I.useConfig)(o), X = (0, I.useTheme)("Button", "-button", f.default, te.buttonLight, o, B), q = (0, oe.useRtl)("Button", ne, B), j = (0, a.computed)(() => {
        const l = X.value, { common: { cubicBezierEaseInOut: x, cubicBezierEaseOut: S }, self: e } = l, { rippleDuration: Q, opacityDisabled: N, fontWeight: le, fontWeightStrong: se } = e, w = g.value, { dashed: ie, type: F, ghost: ae, text: K, color: d, round: he, circle: ce, textColor: O, secondary: $e, tertiary: pe, quaternary: Ee, strong: we } = o, De = {
          "--n-font-weight": we ? se : le
        };
        let u = {
          "--n-color": "initial",
          "--n-color-hover": "initial",
          "--n-color-pressed": "initial",
          "--n-color-focus": "initial",
          "--n-color-disabled": "initial",
          "--n-ripple-color": "initial",
          "--n-text-color": "initial",
          "--n-text-color-hover": "initial",
          "--n-text-color-pressed": "initial",
          "--n-text-color-focus": "initial",
          "--n-text-color-disabled": "initial"
        };
        const Y = F === "tertiary", Ce = F === "default", i = Y ? "default" : F;
        if (K) {
          const b = O || d;
          u = {
            "--n-color": "#0000",
            "--n-color-hover": "#0000",
            "--n-color-pressed": "#0000",
            "--n-color-focus": "#0000",
            "--n-color-disabled": "#0000",
            "--n-ripple-color": "#0000",
            "--n-text-color": b || e[(0, r.createKey)("textColorText", i)],
            "--n-text-color-hover": b ? (0, c.createHoverColor)(b) : e[(0, r.createKey)("textColorTextHover", i)],
            "--n-text-color-pressed": b ? (0, c.createPressedColor)(b) : e[(0, r.createKey)("textColorTextPressed", i)],
            "--n-text-color-focus": b ? (0, c.createHoverColor)(b) : e[(0, r.createKey)("textColorTextHover", i)],
            "--n-text-color-disabled": b || e[(0, r.createKey)("textColorTextDisabled", i)]
          };
        } else if (ae || ie) {
          const b = O || d;
          u = {
            "--n-color": "#0000",
            "--n-color-hover": "#0000",
            "--n-color-pressed": "#0000",
            "--n-color-focus": "#0000",
            "--n-color-disabled": "#0000",
            "--n-ripple-color": d || e[(0, r.createKey)("rippleColor", i)],
            "--n-text-color": b || e[(0, r.createKey)("textColorGhost", i)],
            "--n-text-color-hover": b ? (0, c.createHoverColor)(b) : e[(0, r.createKey)("textColorGhostHover", i)],
            "--n-text-color-pressed": b ? (0, c.createPressedColor)(b) : e[(0, r.createKey)("textColorGhostPressed", i)],
            "--n-text-color-focus": b ? (0, c.createHoverColor)(b) : e[(0, r.createKey)("textColorGhostHover", i)],
            "--n-text-color-disabled": b || e[(0, r.createKey)("textColorGhostDisabled", i)]
          };
        } else if ($e) {
          const b = Ce ? e.textColor : Y ? e.textColorTertiary : e[(0, r.createKey)("color", i)], h = d || b, A = F !== "default" && F !== "tertiary";
          u = {
            "--n-color": A ? (0, z.changeColor)(h, {
              alpha: Number(e.colorOpacitySecondary)
            }) : e.colorSecondary,
            "--n-color-hover": A ? (0, z.changeColor)(h, {
              alpha: Number(e.colorOpacitySecondaryHover)
            }) : e.colorSecondaryHover,
            "--n-color-pressed": A ? (0, z.changeColor)(h, {
              alpha: Number(e.colorOpacitySecondaryPressed)
            }) : e.colorSecondaryPressed,
            "--n-color-focus": A ? (0, z.changeColor)(h, {
              alpha: Number(e.colorOpacitySecondaryHover)
            }) : e.colorSecondaryHover,
            "--n-color-disabled": e.colorSecondary,
            "--n-ripple-color": "#0000",
            "--n-text-color": h,
            "--n-text-color-hover": h,
            "--n-text-color-pressed": h,
            "--n-text-color-focus": h,
            "--n-text-color-disabled": h
          };
        } else if (pe || Ee) {
          const b = Ce ? e.textColor : Y ? e.textColorTertiary : e[(0, r.createKey)("color", i)], h = d || b;
          pe ? (u["--n-color"] = e.colorTertiary, u["--n-color-hover"] = e.colorTertiaryHover, u["--n-color-pressed"] = e.colorTertiaryPressed, u["--n-color-focus"] = e.colorSecondaryHover, u["--n-color-disabled"] = e.colorTertiary) : (u["--n-color"] = e.colorQuaternary, u["--n-color-hover"] = e.colorQuaternaryHover, u["--n-color-pressed"] = e.colorQuaternaryPressed, u["--n-color-focus"] = e.colorQuaternaryHover, u["--n-color-disabled"] = e.colorQuaternary), u["--n-ripple-color"] = "#0000", u["--n-text-color"] = h, u["--n-text-color-hover"] = h, u["--n-text-color-pressed"] = h, u["--n-text-color-focus"] = h, u["--n-text-color-disabled"] = h;
        } else
          u = {
            "--n-color": d || e[(0, r.createKey)("color", i)],
            "--n-color-hover": d ? (0, c.createHoverColor)(d) : e[(0, r.createKey)("colorHover", i)],
            "--n-color-pressed": d ? (0, c.createPressedColor)(d) : e[(0, r.createKey)("colorPressed", i)],
            "--n-color-focus": d ? (0, c.createHoverColor)(d) : e[(0, r.createKey)("colorFocus", i)],
            "--n-color-disabled": d || e[(0, r.createKey)("colorDisabled", i)],
            "--n-ripple-color": d || e[(0, r.createKey)("rippleColor", i)],
            "--n-text-color": O || (d ? e.textColorPrimary : Y ? e.textColorTertiary : e[(0, r.createKey)("textColor", i)]),
            "--n-text-color-hover": O || (d ? e.textColorHoverPrimary : e[(0, r.createKey)("textColorHover", i)]),
            "--n-text-color-pressed": O || (d ? e.textColorPressedPrimary : e[(0, r.createKey)("textColorPressed", i)]),
            "--n-text-color-focus": O || (d ? e.textColorFocusPrimary : e[(0, r.createKey)("textColorFocus", i)]),
            "--n-text-color-disabled": O || (d ? e.textColorDisabledPrimary : e[(0, r.createKey)("textColorDisabled", i)])
          };
        let de = {
          "--n-border": "initial",
          "--n-border-hover": "initial",
          "--n-border-pressed": "initial",
          "--n-border-focus": "initial",
          "--n-border-disabled": "initial"
        };
        K ? de = {
          "--n-border": "none",
          "--n-border-hover": "none",
          "--n-border-pressed": "none",
          "--n-border-focus": "none",
          "--n-border-disabled": "none"
        } : de = {
          "--n-border": e[(0, r.createKey)("border", i)],
          "--n-border-hover": e[(0, r.createKey)("borderHover", i)],
          "--n-border-pressed": e[(0, r.createKey)("borderPressed", i)],
          "--n-border-focus": e[(0, r.createKey)("borderFocus", i)],
          "--n-border-disabled": e[(0, r.createKey)("borderDisabled", i)]
        };
        const { [(0, r.createKey)("height", w)]: ue, [(0, r.createKey)("fontSize", w)]: ze, [(0, r.createKey)("padding", w)]: Be, [(0, r.createKey)("paddingRound", w)]: Me, [(0, r.createKey)("iconSize", w)]: Ke, [(0, r.createKey)("borderRadius", w)]: Ie, [(0, r.createKey)("iconMargin", w)]: Fe, waveOpacity: Oe } = e, Ge = {
          "--n-width": ce && !K ? ue : "initial",
          "--n-height": K ? "initial" : ue,
          "--n-font-size": ze,
          "--n-padding": ce || K ? "initial" : he ? Me : Be,
          "--n-icon-size": Ke,
          "--n-icon-margin": Fe,
          "--n-border-radius": K ? "initial" : ce || he ? ue : Ie
        };
        return Object.assign(Object.assign(Object.assign(Object.assign({ "--n-bezier": x, "--n-bezier-ease-out": S, "--n-ripple-duration": Q, "--n-opacity-disabled": N, "--n-wave-opacity": Oe }, De), u), de), Ge);
      }), M = _ ? (0, I.useThemeClass)("button", (0, a.computed)(() => {
        let l = "";
        const { dashed: x, type: S, ghost: e, text: Q, color: N, round: le, circle: se, textColor: w, secondary: ie, tertiary: F, quaternary: ae, strong: K } = o;
        x && (l += "a"), e && (l += "b"), Q && (l += "c"), le && (l += "d"), se && (l += "e"), ie && (l += "f"), F && (l += "g"), ae && (l += "h"), K && (l += "i"), N && (l += `j${(0, r.color2Class)(N)}`), w && (l += `k${(0, r.color2Class)(w)}`);
        const { value: d } = g;
        return l += `l${d[0]}`, l += `m${S[0]}`, l;
      }), j, o) : void 0;
      return {
        selfElRef: C,
        waveElRef: s,
        mergedClsPrefix: B,
        mergedFocusable: m,
        mergedSize: g,
        showBorder: v,
        enterPressed: y,
        rtlEnabled: q,
        handleMousedown: k,
        handleKeydown: W,
        handleBlur: E,
        handleKeyup: $,
        handleClick: H,
        customColorCssVars: (0, a.computed)(() => {
          const { color: l } = o;
          if (!l)
            return null;
          const x = (0, c.createHoverColor)(l);
          return {
            "--n-border-color": l,
            "--n-border-color-hover": x,
            "--n-border-color-pressed": (0, c.createPressedColor)(l),
            "--n-border-color-focus": x,
            "--n-border-color-disabled": l
          };
        }),
        cssVars: _ ? void 0 : j,
        themeClass: M == null ? void 0 : M.themeClass,
        onRender: M == null ? void 0 : M.onRender
      };
    },
    render() {
      const { mergedClsPrefix: o, tag: C, onRender: s } = this;
      s == null || s();
      const y = (0, r.resolveWrappedSlot)(this.$slots.default, (v) => v && (0, a.h)("span", { class: `${o}-button__content` }, v));
      return (0, a.h)(
        C,
        { ref: "selfElRef", class: [
          this.themeClass,
          `${o}-button`,
          `${o}-button--${this.type}-type`,
          `${o}-button--${this.mergedSize}-type`,
          this.rtlEnabled && `${o}-button--rtl`,
          this.disabled && `${o}-button--disabled`,
          this.block && `${o}-button--block`,
          this.enterPressed && `${o}-button--pressed`,
          !this.text && this.dashed && `${o}-button--dashed`,
          this.color && `${o}-button--color`,
          this.secondary && `${o}-button--secondary`,
          this.loading && `${o}-button--loading`,
          this.ghost && `${o}-button--ghost`
          // required for button group border collapse
        ], tabindex: this.mergedFocusable ? 0 : -1, type: this.attrType, style: this.cssVars, disabled: this.disabled, onClick: this.handleClick, onBlur: this.handleBlur, onMousedown: this.handleMousedown, onKeyup: this.handleKeyup, onKeydown: this.handleKeydown },
        this.iconPlacement === "right" && y,
        (0, a.h)(G.NFadeInExpandTransition, { width: !0 }, {
          default: () => (0, r.resolveWrappedSlot)(this.$slots.icon, (v) => (this.loading || this.renderIcon || v) && (0, a.h)(
            "span",
            { class: `${o}-button__icon`, style: {
              margin: (0, r.isSlotEmpty)(this.$slots.default) ? "0" : ""
            } },
            (0, a.h)(G.NIconSwitchTransition, null, {
              default: () => this.loading ? (0, a.h)(G.NBaseLoading, { clsPrefix: o, key: "loading", class: `${o}-icon-slot`, strokeWidth: 20 }) : (0, a.h)("div", { key: "icon", class: `${o}-icon-slot`, role: "none" }, this.renderIcon ? this.renderIcon() : v)
            })
          ))
        }),
        this.iconPlacement === "left" && y,
        this.text ? null : (0, a.h)(G.NBaseWave, { ref: "waveElRef", clsPrefix: o }),
        this.showBorder ? (0, a.h)("div", { "aria-hidden": !0, class: `${o}-button__border`, style: this.customColorCssVars }) : null,
        this.showBorder ? (0, a.h)("div", { "aria-hidden": !0, class: `${o}-button__state-border`, style: this.customColorCssVars }) : null
      );
    }
  });
  n.default = P, n.XButton = P;
})(_e);
(function(n) {
  var p = D && D.__importDefault || function(T) {
    return T && T.__esModule ? T : { default: T };
  };
  Object.defineProperty(n, "__esModule", { value: !0 }), n.buttonProps = n.NxButton = n.NButton = void 0;
  var a = _e;
  Object.defineProperty(n, "NButton", { enumerable: !0, get: function() {
    return p(a).default;
  } }), Object.defineProperty(n, "NxButton", { enumerable: !0, get: function() {
    return a.XButton;
  } }), Object.defineProperty(n, "buttonProps", { enumerable: !0, get: function() {
    return a.buttonProps;
  } });
})(Ve);
export {
  Ve as b,
  Z as r,
  Te as s
};