ranui 0.2.0-alpha.0 → 0.2.0-alpha.2

package/dist/button-DukaD6uL.js

@@ -1,117 +0,0 @@
-import { C as i, c as b, d as l, f as d, p as a, s as h } from "./utils-D4pPF77E.js";
-import { t as u } from "./events-C59wGdni.js";
-import { _ as v, i as s, p as f } from "./factory-BdsO0dEW.js";
-import { a as p, n as g } from "./ssr-DSGwPtEd.js";
-var m = '.remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{box-sizing:var(--ran-btn-box-sizing, border-box);position:var(--ran-btn-position, relative);display:var(--ran-btn-display, inline-flex);background-image:var(--ran-btn-background-image, none);box-shadow:var(--ran-btn-box-shadow, var(--ran-skin-raised-shadow, 0 2px #00000004));cursor:var(--ran-btn-cursor, pointer);-webkit-user-select:var(--ran-btn-user-select, none);user-select:var(--ran-btn-user-select, none);touch-action:var(--ran-btn-touch-action, manipulation);overflow:var(--ran-btn-overflow, hidden);pointer-events:var(--ran-btn-pointer-events, auto)}:host .ran-btn{box-sizing:var(--ran-btn-contain-box-sizing, border-box);position:var(--ran-btn-contain-position, relative);display:var(--ran-btn-contain-display, block);background-image:var(--ran-btn-contain-background-image, none);cursor:var(--ran-btn-contain-cursor, pointer);transition:var(--ran-btn-contain-transition, all var(--ran-motion-duration-base, .2s) cubic-bezier(.645, .045, .355, 1));-webkit-user-select:var(--ran-btn-contain-user-select, none);user-select:var(--ran-btn-contain-user-select, none);touch-action:var(--ran-btn-contain-touch-action, manipulation);background:var(--ran-btn-contain-background, var(--ran-color-bg-elevated, #fff))}:host,:host(:active),:host(:focus){outline:0;-webkit-tap-highlight-color:transparent}:host .ran-btn,:host(:active) .ran-btn,:host(:focus) .ran-btn{outline:var(--ran-btn-contain-outline, 0)}:host(:focus-visible){outline:var(--ran-btn-focus-outline, 2px solid var(--ran-color-primary));outline-offset:var(--ran-btn-focus-outline-offset, 2px)}:host([type="primary"]) .ran-btn-content{background-color:var(--ran-btn-content-background-color, var(--ran-color-primary, #1890ff));background-image:var(--ran-btn-content-background-image, none);border-color:var(--ran-btn-content-border-color, var(--ran-color-primary, #1890ff));color:var(--ran-btn-content-color, #fff)}:host([type="primary"]:not([disabled])) .ran-btn:after{background-image:var(--ran-btn-after-background-image, radial-gradient(circle, #fff 10%, transparent 10.01%))}:host([type="primary"]:not([disabled]):active) .ran-btn-content{background-color:var(--ran-btn-content-active-background-color, var(--ran-color-primary-active, #005ff2));border-color:var(--ran-btn-content-active-border-color, var(--ran-color-primary-active, #005ff2))}@media(min-width:1024px){:host(:not([disabled]):hover) .ran-btn-content{border-color:var(--ran-btn-content-hover-border-color, var(--ran-color-primary, #1890ff));color:var(--ran-btn-content-hover-color, var(--ran-color-primary, #1890ff))}:host([type="primary"]:not([disabled]):hover) .ran-btn-content{background-color:var(--ran-btn-content-hover-background-color, var(--ran-color-primary-hover, #0059ec));border-color:var(--ran-btn-content-hover-border-color, var(--ran-color-primary-hover, #0059ec));color:var(--ran-btn-content-hover-color, #fff)}:host([type="warning"]:not([disabled]):hover) .ran-btn-content{border-color:var(--ran-btn-content-warning-border-color, var(--ran-color-danger, #ff4d4f));background-color:var(--ran-btn-content-warning-background-color, var(--ran-color-danger, #ff4d4f));color:var(--ran-btn-content-warning-color, #fff)}}:host([type="warning"]) .ran-btn-content{border-color:var(--ran-btn-content-warning-border-color, var(--ran-color-danger, #ff4d4f));background-color:var(--ran-btn-content-warning-background-color, var(--ran-color-danger, #ff4d4f));background-image:var(--ran-btn-content-background-image, none);color:var(--ran-btn-content-warning-color, #fff)}:host([type="warning"]:not([disabled])) .ran-btn:after{background-image:var(--ran-btn-after-background-image, radial-gradient(circle, #fff 10%, transparent 10.01%))}:host([type="text"]) .ran-btn-content{border:var(--ran-btn-content-text-border, none)}:host([disabled]){cursor:var(--ran-btn-disabled-cursor, not-allowed);pointer-events:var(--ran-btn-disabled-pointer-events, all);opacity:var(--ran-btn-disabled-opacity, .6)}:host([disabled]) .ran-btn{cursor:var(--ran-btn-disabled-container-cursor, not-allowed);pointer-events:var(--ran-btn-disabled-container-pointer-events, all);opacity:var(--ran-btn-disabled-container-opacity, .6)}:host(:not([disabled]):active) .ran-btn:after{transform:var(--ran-btn-after-transform, translate(-50%, -50%) scale(0));opacity:var(--ran-btn-after-opacity, .3);transition:var(--ran-btn-after-transition, 0s)}@media(min-width:1024px){:host(:not([disabled],[effect])) .ran-btn:after{content:"";display:block;position:absolute;width:100%;height:100%;left:var(--ran-x, 0);top:var(--ran-y, 0);pointer-events:none;background-image:radial-gradient(circle,var(--ran-color-primary, #1890ff) 10%,transparent 10.01%);background-repeat:no-repeat;background-position:50%;transform:translate(-50%,-50%) scale(10);opacity:0;transition:transform .3s,opacity .8s}}:host .slot{display:var(--ran-btn-slot-display, block)}.ran-btn-content{display:var(--ran-btn-content-display, flex);justify-content:var(--ran-btn-content-display, space-between);align-items:var(--ran-btn-content-align-items, center);padding:var(--ran-btn-content-padding, 4px 15px);border:var(--ran-btn-content-border, 1px solid transparent);border-image-source:var(--ran-btn-content-border-image-source, none);border-image-slice:var(--ran-btn-content-border-image-slice, 8);border-image-width:var(--ran-btn-content-border-image-width, 4px);border-image-outset:0;border-image-repeat:stretch;border-radius:var(--ran-btn-content-border-radius, var(--ran-radius-sm, 6px));border-color:var(--ran-btn-content-border-color, var(--ran-color-border, #d9d9d9));color:var(--ran-btn-content-color, var(--ran-color-text, #000000d9));line-height:var(--ran-btn-content-line-height, 22px);font-size:var(--ran-btn-content-font-size, 14px);font-weight:var(--ran-btn-content-font-weight, 400);font-family:var(--ran-btn-content-font-family, var(--ran-skin-font-family, inherit));white-space:var(--ran-btn-content-white-space, nowrap);text-align:var(--ran-btn-content-text-align, center);box-sizing:var(--ran-btn-content-box-sizing, border-box)}.ran-btn-content .icon{margin-right:var(--ran-btn-icon-margin-right, 2px)}', y = class extends g {
-  _btn;
-  _btnContent;
-  _iconElement;
-  _slot;
-  _shadowDom;
-  _events = new u();
-  debounceTimeId;
-  static get observedAttributes() {
-    return [
-      "disabled",
-      "icon",
-      "effect",
-      "iconSize",
-      "type",
-      "sheet"
-    ];
-  }
-  constructor() {
-    super(), this._shadowDom = b(this, m);
-    const t = h(this._shadowDom, ".ran-btn", () => s().class("ran-btn").attr("part", "button").role("button").tabIndex(0).children(s().class("ran-btn-content").attr("part", "content").children(f().class("slot"))).build());
-    this._btn = t, this._btnContent = t.querySelector(".ran-btn-content"), this._slot = t.querySelector("slot");
-  }
-  get sheet() {
-    return this.getAttribute("sheet") || "";
-  }
-  set sheet(t) {
-    this.setAttribute("sheet", t || ""), this.handlerExternalCss();
-  }
-  get disabled() {
-    return a(this);
-  }
-  set disabled(t) {
-    !t || t === "false" ? (this.removeAttribute("disabled"), this.removeAttribute("aria-disabled")) : (this.setAttribute("disabled", ""), this.setAttribute("aria-disabled", "true"));
-  }
-  get iconSize() {
-    return this.getAttribute("iconSize") || "";
-  }
-  set iconSize(t) {
-    !t || t === "false" ? this.removeAttribute("iconSize") : (this.setAttribute("iconSize", t), this.setIcon());
-  }
-  get icon() {
-    return this.getAttribute("icon") || "";
-  }
-  set icon(t) {
-    !t || t === "false" ? this.removeAttribute("icon") : (this.setAttribute("icon", t), this.setIcon());
-  }
-  get effect() {
-    return this.getAttribute("effect") || "";
-  }
-  set effect(t) {
-    d.includes(t) || !t ? this.removeAttribute("effect") : this.setAttribute("effect", t);
-  }
-  get type() {
-    return this.getAttribute("type") || "";
-  }
-  set type(t) {
-    t ? this.setAttribute("type", t) : this.removeAttribute("type");
-  }
-  setIcon = () => {
-    if (typeof document > "u" || !this._slot) return;
-    const t = this.icon;
-    if (!t) {
-      this._iconElement && (this._iconElement.remove(), this._iconElement = void 0);
-      return;
-    }
-    if (this._iconElement) this._iconElement.setAttribute("name", t);
-    else {
-      let r = this._shadowDom.querySelector("r-icon");
-      r || (r = v("r-icon").attr("color", "currentColor").class("icon").build(), this._slot.insertAdjacentElement("beforebegin", r)), this._iconElement = r, this._iconElement.setAttribute("name", t);
-    }
-    const { width: n, height: e } = this._slot.getBoundingClientRect(), o = Math.min(n, e) || 16, c = this.iconSize || `${o > 5 ? o - 5 : o}`;
-    this._iconElement.setAttribute("size", String(c));
-  };
-  mousedown = (t) => {
-    if (i() === "pc" && !this.disabled) {
-      this.debounceMouseEvent();
-      const { left: n, top: e } = this.getBoundingClientRect();
-      this._btn.style.setProperty("--ran-x", `${t.clientX - n}px`), this._btn.style.setProperty("--ran-y", `${t.clientY - e}px`);
-    }
-  };
-  mouseup = () => {
-    i() === "pc" && (this.debounceTimeId || (this.debounceTimeId = setTimeout(() => {
-      this._btn.style.removeProperty("--ran-x"), this._btn.style.removeProperty("--ran-y"), this.debounceMouseEvent();
-    }, 600)));
-  };
-  keydown = (t) => {
-    a(this) || (t.key === "Enter" || t.key === " ") && (t.preventDefault(), this.click());
-  };
-  debounceMouseEvent = () => {
-    this.debounceTimeId && (clearTimeout(this.debounceTimeId), this.debounceTimeId = void 0);
-  };
-  handlerExternalCss = () => {
-    l(this, this._shadowDom, "sheet", null, this.sheet);
-  };
-  syncA11yState = () => {
-    const t = a(this);
-    this._btn.setAttribute("aria-disabled", t ? "true" : "false"), this._btn.tabIndex = t ? -1 : 0, t ? (this.setAttribute("aria-disabled", "true"), this._btnContent.setAttribute("disabled", "true")) : (this.removeAttribute("aria-disabled"), this._btnContent.removeAttribute("disabled"));
-  };
-  connectedCallback() {
-    this.handlerExternalCss(), this.setIcon(), this.syncA11yState(), this._events.on(this._btn, "mousedown", this.mousedown).on(this._btn, "mouseup", this.mouseup).on(this._btn, "keydown", this.keydown);
-  }
-  disconnectedCallback() {
-    this.debounceMouseEvent(), this._events.abort();
-  }
-  attributeChangedCallback(t, n, e) {
-    n !== e && (t === "disabled" && this._btnContent && this.syncA11yState(), (t === "icon" || t === "iconSize") && this.setIcon(), t === "sheet" && this.handlerExternalCss());
-  }
-};
-p("r-button", y);
-export {
-  y as t
-};

package/dist/colorpicker-Ch67dWa_.js

@@ -1,302 +0,0 @@
-import { c as f, d as v, l as x, s as m, u as P, x as l } from "./utils-D4pPF77E.js";
-import { t as w } from "./events-C59wGdni.js";
-import { i as y, r as u } from "./signal-XHfNsQNW.js";
-import { _ as h, h as S, i as s } from "./factory-BdsO0dEW.js";
-import { a as A, n as $ } from "./ssr-DSGwPtEd.js";
-import "./input-DoraIb3x.js";
-import "./select-BmhCUTLb.js";
-import "./popover-BCvHwLZb.js";
-var _ = (e) => {
-  const { r, g: o, b: t } = C(e);
-  return g(r, o, t);
-}, C = (e) => (e[0] === "#" && (e = e.substr(1)), e.length === 3 ? {
-  r: parseInt(e[0] + e[0], 16),
-  g: parseInt(e[1] + e[1], 16),
-  b: parseInt(e[2] + e[2], 16)
-} : {
-  r: parseInt(e.substr(0, 2), 16),
-  g: parseInt(e.substr(2, 2), 16),
-  b: parseInt(e.substr(4, 2), 16)
-}), g = (e, r, o) => {
-  let t;
-  const i = Math.max(e, r, o), a = i - Math.min(e, r, o);
-  a === 0 ? t = 0 : e === i ? t = (r - o) / a % 6 : r === i ? t = (o - e) / a + 2 : t = (e - r) / a + 4, t = Math.round(t * 60), t < 0 && (t += 360);
-  const n = Math.round((i === 0 ? 0 : a / i) * 100), c = Math.round(i / 255 * 100);
-  return {
-    h: t,
-    s: n,
-    v: c
-  };
-}, d = (e, r, o) => {
-  r = r / 100, o = o / 100;
-  let t = [];
-  const i = o * r, a = e / 60, n = i * (1 - Math.abs(a % 2 - 1)), c = o - i;
-  return a >= 0 && a < 1 ? t = [
-    i,
-    n,
-    0
-  ] : a >= 1 && a < 2 ? t = [
-    n,
-    i,
-    0
-  ] : a >= 2 && a < 3 ? t = [
-    0,
-    i,
-    n
-  ] : e >= 3 && a < 4 ? t = [
-    0,
-    n,
-    i
-  ] : e >= 4 && a < 5 ? t = [
-    n,
-    0,
-    i
-  ] : e >= 5 && a <= 6 ? t = [
-    i,
-    0,
-    n
-  ] : t = [
-    0,
-    0,
-    0
-  ], {
-    r: Math.round(255 * (t[0] + c)),
-    g: Math.round(255 * (t[1] + c)),
-    b: Math.round(255 * (t[2] + c))
-  };
-}, b = (e) => {
-  const r = e.toString(16);
-  return r.length === 1 ? "0" + r : r;
-}, k = (e, r, o) => "#" + [
-  b(e),
-  b(r),
-  b(o)
-].join(""), I = /^#([\da-f]{6}|[\da-f]{3})$/i, E = /^rgb\((\d{1,3}),(\d{1,3}),(\d{1,3})\)$/, D = /^rgba\((\d{1,3}),(\d{1,3}),(\d{1,3}),(\d{1,3}(\.\d+)?)\)$/, R = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}.ran-colorpicker{box-sizing:border-box;min-width:32px;height:32px;border-radius:var(--ran-colorpicker-border-radius, var(--ran-radius-md, 8px));border:var(--ran-colorpicker-border, 1px solid var(--ran-color-border, #d9d9d9));cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:var(--ran-colorpicker-transition, border-color .2s, box-shadow .2s);background:var(--ran-colorpicker-background, var(--ran-color-bg-elevated, #ffffff));padding:3px}.ran-colorpicker:hover{border-color:var(--ran-colorpicker-border-hover, var(--ran-color-border-hover, var(--ran-gray-500)))}.ran-colorpicker-block{position:relative;border-radius:var(--ran-colorpicker-block-border-radius, var(--ran-radius-sm, 4px));width:24px;height:24px;box-shadow:inset 0 0 0 1px var(--ran-gray-alpha-200, rgba(0, 0, 0, .09));background-image:conic-gradient(var(--ran-gray-alpha-100, rgba(0, 0, 0, .06)) 0 25%,transparent 0 50%,var(--ran-gray-alpha-100, rgba(0, 0, 0, .06)) 0 75%,transparent 0);background-size:50% 50%}.ran-colorpicker-inner{width:100%;height:100%;border-radius:inherit}", V = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}.ran-color-picker-inner{box-sizing:border-box}.ran-color-picker-inner-content{box-sizing:border-box;display:flex;flex-direction:column;gap:12px;width:224px;padding:12px;font-family:var(--ran-font-family, inherit)}.ran-color-picker-inner-content *,.ran-color-picker-inner-content *:before,.ran-color-picker-inner-content *:after{box-sizing:border-box}.ran-color-picker-palette{position:relative;width:100%;height:160px;border-radius:var(--ran-radius-sm, 6px);overflow:hidden;cursor:crosshair;box-shadow:inset 0 0 0 1px var(--ran-gray-alpha-200, rgba(0, 0, 0, .09));touch-action:none}.ran-color-picker-saturation{position:absolute;inset:0;border-radius:inherit;background-image:linear-gradient(to top,#000,#0000),linear-gradient(to right,#fff,#fff0)}.ran-color-picker-palette-dot{position:absolute;top:0;left:0;z-index:2;width:14px;height:14px;transform:translate(-50%,-50%);border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #0003,0 1px 3px #00000059;pointer-events:none}.ran-color-picker-controls{display:flex;align-items:center;gap:12px}.ran-color-picker-preview{position:relative;flex:none;width:28px;height:28px;border-radius:50%;overflow:hidden;box-shadow:inset 0 0 0 1px var(--ran-gray-alpha-200, rgba(0, 0, 0, .09));background-image:conic-gradient(var(--ran-gray-alpha-100, rgba(0, 0, 0, .06)) 0 25%,transparent 0 50%,var(--ran-gray-alpha-100, rgba(0, 0, 0, .06)) 0 75%,transparent 0);background-size:12px 12px}.ran-color-picker-preview-inner{position:absolute;inset:0;border-radius:inherit}.ran-color-picker-sliders{flex:1;min-width:0;display:flex;flex-direction:column;gap:12px}.ran-color-picker-slider{position:relative;height:10px;border-radius:999px;cursor:pointer;box-shadow:inset 0 0 0 1px var(--ran-gray-alpha-200, rgba(0, 0, 0, .09));touch-action:none}.ran-color-picker-slider-hue{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.ran-color-picker-slider-alpha{background-image:conic-gradient(var(--ran-gray-alpha-100, rgba(0, 0, 0, .06)) 0 25%,transparent 0 50%,var(--ran-gray-alpha-100, rgba(0, 0, 0, .06)) 0 75%,transparent 0);background-size:8px 8px}.ran-color-picker-slider-alpha-track{position:absolute;inset:0;border-radius:inherit}.ran-color-picker-slider-thumb{position:absolute;top:50%;left:0;z-index:1;width:14px;height:14px;transform:translate(-50%,-50%);border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #0003,0 1px 3px #00000059;pointer-events:none}.ran-color-picker-input-container{display:flex;align-items:center;gap:8px}.ran-color-picker-format{flex:none;width:68px}.ran-color-picker-value{flex:1;min-width:0}", p = 360, H = class extends $ {
-  colorpicker;
-  colorpickerInner;
-  context;
-  _shadowDom;
-  _events = new w();
-  _effectDisposers = [];
-  popoverBlock;
-  popoverContent;
-  colorPickerInner;
-  colorPickerPalette;
-  colorPickerSaturation;
-  colorPickerPaletteDot;
-  colorPickerHueSlider;
-  colorPickerHueThumb;
-  colorPickerAlphaSlider;
-  colorPickerAlphaTrack;
-  colorPickerAlphaThumb;
-  colorPickerPreviewInner;
-  colorPickerValueInput;
-  colorPickerFormatSelect;
-  colorPickerPaletteSelect;
-  _activeSlider = null;
-  _format = "HEX";
-  _editingInput = !1;
-  static get observedAttributes() {
-    return [
-      "disabled",
-      "value",
-      "sheet"
-    ];
-  }
-  constructor() {
-    super(), this._shadowDom = f(this, R);
-    const e = m(this._shadowDom, "r-popover", () => {
-      const r = s().class("ran-colorpicker-inner").part("swatch").build(), o = s().class("ran-colorpicker-block").part("block").children(r).build(), t = h("r-content").class("ran-content").build();
-      return h("r-popover").class("ran-popover").attr("trigger", "click").children(o, t).build();
-    });
-    this.popoverBlock = e, this.popoverContent = e.querySelector("r-content"), this.colorpicker = e.querySelector(".ran-colorpicker-block"), this.colorpickerInner = e.querySelector(".ran-colorpicker-inner"), this.colorpicker.setAttribute("role", "button"), this.colorpicker.setAttribute("tabindex", "0"), this.colorpicker.setAttribute("aria-haspopup", "dialog"), this.colorpicker.setAttribute("aria-label", "Choose color"), this.colorPickerPaletteSelect = !1, this.createContext();
-  }
-  get value() {
-    return this.context?.value.getter() || "";
-  }
-  set value(e) {
-    this.setAttribute("value", e);
-  }
-  get sheet() {
-    return x(this, "sheet");
-  }
-  set sheet(e) {
-    P(this, "sheet", e);
-  }
-  handlerExternalCss = () => {
-    v(this, this._shadowDom, "sheet", null, this.sheet);
-  };
-  createContext = () => {
-    const e = (r) => {
-      const [o, t] = y(r);
-      return {
-        getter: o,
-        setter: t
-      };
-    };
-    this.context = {
-      value: e(""),
-      disabled: e(!1),
-      hue: e(0),
-      saturation: e(0),
-      lightness: e(100),
-      transparency: e(100)
-    };
-  };
-  currentRgba = () => {
-    const { hue: e, saturation: r, lightness: o, transparency: t } = this.context, { r: i, g: a, b: n } = d(e.getter(), r.getter(), o.getter());
-    return {
-      r: i,
-      g: a,
-      b: n,
-      a: t.getter() / 100
-    };
-  };
-  currentValue = () => {
-    const { r: e, g: r, b: o, a: t } = this.currentRgba();
-    return t < 1 ? `rgba(${e}, ${r}, ${o}, ${Number(t.toFixed(2))})` : k(e, r, o);
-  };
-  currentDisplay = () => {
-    const { r: e, g: r, b: o, a: t } = this.currentRgba();
-    return this._format === "RGB" ? t < 1 ? `rgba(${e}, ${r}, ${o}, ${Number(t.toFixed(2))})` : `rgb(${e}, ${r}, ${o})` : k(e, r, o);
-  };
-  updateColorValue = (e) => {
-    if (e === this.context?.value.getter()) return;
-    const r = e.replace(/\s+/g, ""), o = I.exec(e), t = D.exec(r), i = E.exec(r);
-    if (o) {
-      const { h: a, s: n, v: c } = _(o[0]);
-      this.context.hue.setter(a), this.context.saturation.setter(n), this.context.lightness.setter(c), this.context.transparency.setter(100);
-    } else if (t) {
-      const { h: a, s: n, v: c } = g(Number(t[1]), Number(t[2]), Number(t[3]));
-      this.context.hue.setter(a), this.context.saturation.setter(n), this.context.lightness.setter(c), this.context.transparency.setter(Number(t[4]) * 100);
-    } else if (i) {
-      const { h: a, s: n, v: c } = g(Number(i[1]), Number(i[2]), Number(i[3]));
-      this.context.hue.setter(a), this.context.saturation.setter(n), this.context.lightness.setter(c), this.context.transparency.setter(100);
-    } else return;
-    this.setAttribute("value", e), this.context?.value.setter(e);
-  };
-  emitChange = () => {
-    const e = this.currentValue(), { r, g: o, b: t, a: i } = this.currentRgba();
-    this.context?.value.setter(e), this.setAttribute("value", e), this.dispatchEvent(new CustomEvent("change", {
-      detail: {
-        value: e,
-        hex: k(r, o, t),
-        rgb: `rgb(${r}, ${o}, ${t})`,
-        rgba: `rgba(${r}, ${o}, ${t}, ${Number(i.toFixed(2))})`,
-        alpha: Number(i.toFixed(2))
-      },
-      bubbles: !0,
-      composed: !0
-    }));
-  };
-  palettePointerDown = (e) => {
-    e.preventDefault(), this.colorPickerPaletteSelect = !0, this.updatePaletteFromEvent(e);
-  };
-  updatePaletteFromEvent = (e) => {
-    if (!this.colorPickerPalette) return;
-    const { left: r, top: o, width: t, height: i } = this.colorPickerPalette.getBoundingClientRect();
-    if (!t || !i) return;
-    const a = l(e.clientX - r, 0, t), n = l(e.clientY - o, 0, i);
-    this.context.saturation.setter(a / t * 100), this.context.lightness.setter((1 - n / i) * 100), this.emitChange();
-  };
-  sliderPointerDown = (e) => (r) => {
-    r.preventDefault(), this._activeSlider = e, this.updateSliderFromEvent(e, r);
-  };
-  updateSliderFromEvent = (e, r) => {
-    const o = e === "hue" ? this.colorPickerHueSlider : this.colorPickerAlphaSlider;
-    if (!o) return;
-    const { left: t, width: i } = o.getBoundingClientRect();
-    if (!i) return;
-    const a = l(r.clientX - t, 0, i) / i;
-    e === "hue" ? this.context.hue.setter(a * p) : this.context.transparency.setter(a * 100), this.emitChange();
-  };
-  onPointerMove = (e) => {
-    const r = e;
-    this.colorPickerPaletteSelect ? this.updatePaletteFromEvent(r) : this._activeSlider && this.updateSliderFromEvent(this._activeSlider, r);
-  };
-  initSliderA11y = (e, r, o) => {
-    e.setAttribute("role", "slider"), e.setAttribute("tabindex", "0"), e.setAttribute("aria-label", r), e.setAttribute("aria-orientation", "horizontal"), e.setAttribute("aria-valuemin", "0"), e.setAttribute("aria-valuemax", String(o));
-  };
-  sliderKeydown = (e) => (r) => {
-    const o = e === "hue" ? p : 100, t = e === "hue" ? this.context.hue : this.context.transparency, i = r.shiftKey ? 10 : 1, a = t.getter();
-    let n = a;
-    switch (r.key) {
-      case "ArrowRight":
-      case "ArrowUp":
-        n = a + i;
-        break;
-      case "ArrowLeft":
-      case "ArrowDown":
-        n = a - i;
-        break;
-      case "Home":
-        n = 0;
-        break;
-      case "End":
-        n = o;
-        break;
-      default:
-        return;
-    }
-    r.preventDefault(), t.setter(l(n, 0, o)), this.emitChange();
-  };
-  onPointerUp = () => {
-    this.colorPickerPaletteSelect = !1, this._activeSlider = null;
-  };
-  onSwatchKeydown = (e) => {
-    (e.key === "Enter" || e.key === " " || e.key === "Spacebar") && (e.preventDefault(), this.colorpicker?.click());
-  };
-  onValueInput = (e) => {
-    const r = e.target, o = e.detail?.value ?? r?.value;
-    typeof o == "string" && (this._editingInput = !0, this.updateColorValue(o.trim()), this._editingInput = !1, this.emitChange());
-  };
-  onFormatChange = (e) => {
-    const r = e.detail?.value;
-    this._format = r === "RGB" ? "RGB" : "HEX", this.syncValueInput();
-  };
-  syncValueInput = () => {
-    this._editingInput || !this.colorPickerValueInput || (this.colorPickerValueInput.value = this.currentDisplay());
-  };
-  setupEffects = () => {
-    this._effectDisposers.push(u(() => {
-      const { r: e, g: r, b: o } = d(this.context.hue.getter(), 100, 100);
-      this.colorPickerSaturation?.style.setProperty("background-color", `rgb(${e}, ${r}, ${o})`);
-    }), u(() => {
-      const e = l(this.context.saturation.getter(), 0, 100), r = l(this.context.lightness.getter(), 0, 100);
-      this.colorPickerPaletteDot?.style.setProperty("left", `${e}%`), this.colorPickerPaletteDot?.style.setProperty("top", `${100 - r}%`);
-    }), u(() => {
-      const e = this.context.hue.getter(), { r, g: o, b: t } = d(e, 100, 100);
-      this.colorPickerHueThumb?.style.setProperty("left", `${e / p * 100}%`), this.colorPickerHueThumb?.style.setProperty("background", `rgb(${r}, ${o}, ${t})`), this.colorPickerHueSlider?.setAttribute("aria-valuenow", String(Math.round(e)));
-    }), u(() => {
-      const { r: e, g: r, b: o, a: t } = this.currentRgba(), i = `rgb(${e}, ${r}, ${o})`, a = `rgba(${e}, ${r}, ${o}, ${Number(t.toFixed(3))})`;
-      this.colorPickerAlphaTrack?.style.setProperty("background", `linear-gradient(to right, rgba(${e}, ${r}, ${o}, 0), ${i})`), this.colorPickerAlphaThumb?.style.setProperty("left", `${t * 100}%`), this.colorPickerAlphaThumb?.style.setProperty("background", a), this.colorPickerPreviewInner?.style.setProperty("background", a), this.colorpickerInner?.style.setProperty("background", a), this.colorPickerAlphaSlider?.setAttribute("aria-valuenow", String(Math.round(t * 100))), this.colorPickerAlphaSlider?.setAttribute("aria-valuetext", `${Math.round(t * 100)}%`), this.syncValueInput();
-    }));
-  };
-  disposeEffects = () => {
-    for (const e of this._effectDisposers) e();
-    this._effectDisposers = [];
-  };
-  openColorPicker = () => {
-    if (this.colorPickerInner) return;
-    this.colorPickerSaturation = s().class("ran-color-picker-saturation").build(), this.colorPickerPaletteDot = s().class("ran-color-picker-palette-dot").build(), this.colorPickerPalette = s().class("ran-color-picker-palette").on("mousedown", this.palettePointerDown).children(this.colorPickerSaturation, this.colorPickerPaletteDot).build(), this.colorPickerPreviewInner = s().class("ran-color-picker-preview-inner").build();
-    const e = s().class("ran-color-picker-preview").children(this.colorPickerPreviewInner).build();
-    this.colorPickerHueThumb = s().class("ran-color-picker-slider-thumb").build(), this.colorPickerHueSlider = s().class("ran-color-picker-slider ran-color-picker-slider-hue").on("mousedown", this.sliderPointerDown("hue")).on("keydown", this.sliderKeydown("hue")).children(this.colorPickerHueThumb).build(), this.initSliderA11y(this.colorPickerHueSlider, "Hue", p), this.colorPickerAlphaTrack = s().class("ran-color-picker-slider-alpha-track").build(), this.colorPickerAlphaThumb = s().class("ran-color-picker-slider-thumb").build(), this.colorPickerAlphaSlider = s().class("ran-color-picker-slider ran-color-picker-slider-alpha").on("mousedown", this.sliderPointerDown("alpha")).on("keydown", this.sliderKeydown("alpha")).children(this.colorPickerAlphaTrack, this.colorPickerAlphaThumb).build(), this.initSliderA11y(this.colorPickerAlphaSlider, "Alpha opacity", 100);
-    const r = s().class("ran-color-picker-sliders").children(this.colorPickerHueSlider, this.colorPickerAlphaSlider).build(), o = s().class("ran-color-picker-controls").children(e, r).build();
-    this.colorPickerFormatSelect = h("r-select").class("ran-color-picker-format").attr("value", this._format).attr("defaultValue", this._format).attr("trigger", "click").children(...["HEX", "RGB"].map((a) => h("r-option").attr("value", a).text(a).build())).on("change", this.onFormatChange).build(), this.colorPickerValueInput = h("r-input").class("ran-color-picker-value").on("change", this.onValueInput).build();
-    const t = s().class("ran-color-picker-input-container").children(this.colorPickerFormatSelect, this.colorPickerValueInput).build(), i = s().class("ran-color-picker-inner-content").children(this.colorPickerPalette, o, t).build();
-    this.colorPickerInner = s().class("ran-color-picker-inner").children(S().text(V).build(), i).build(), this.popoverContent.appendChild(this.colorPickerInner), this.setupEffects(), this.syncValueInput();
-  };
-  connectedCallback() {
-    this.handlerExternalCss(), this.setAttribute("class", "ran-colorpicker"), this._events.on(this.popoverBlock, "click", this.openColorPicker), this._events.on(this.colorpicker, "keydown", this.onSwatchKeydown), this._events.on(document, "mousemove", this.onPointerMove), this._events.on(document, "mouseup", this.onPointerUp), this.value && this.updateColorValue(this.value);
-  }
-  disconnectedCallback() {
-    this._events.abort(), this.disposeEffects();
-  }
-  attributeChangedCallback(e, r, o) {
-    r !== o && (e === "value" && this.updateColorValue(o), e === "sheet" && this.handlerExternalCss());
-  }
-};
-A("r-colorpicker", H);
-export {
-  H as t
-};

package/dist/input-DoraIb3x.js

@@ -1,198 +0,0 @@
-import { c as s, d as o, f as a, l, p as r, s as u, u as p } from "./utils-D4pPF77E.js";
-import { t as c } from "./events-C59wGdni.js";
-import { _ as d, c as h, i, s as b } from "./factory-BdsO0dEW.js";
-import { a as v, n as g } from "./ssr-DSGwPtEd.js";
-import "./icon-DmoEnao5.js";
-var m = `.remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{position:var(--ran-input-host-position, relative);display:var(--ran-input-host-display, block);box-sizing:var(--ran-input-host-box-sizing, border-box)}:host([placeholder]) .ran-input-label{transform:var(--ran-input-label-placeholder-transform, translateY( calc(-50% - .43em) ) scale(.8));top:var(--ran-input-label-placeholder-top, 0)}:host .ran-input-label{transform:var(--ran-input-label-transform, translateY(-50%));top:var(--ran-input-label-top, 50%);transition:var(--ran-input-label-transition, all .3s)}.ran-input{box-sizing:var(--ran-input-box-sizing, border-box);position:var(--ran-input-position, relative);display:var(--ran-input-display, flex);width:var(--ran-input-width, 100%);height:var(--ran-input-height, auto);min-width:var(--ran-input-min-width, 0);padding:var(--ran-input-padding, 0px 0px 0px 4px);color:var(--ran-input-color, var(--ran-color-text, #000000d9));font-size:var(--ran-input-font-size, 12px);font-family:var(--ran-input-font-family, var(--ran-skin-font-family, inherit));line-height:var(--ran-input-line-height, 1.5715);background-color:var(--ran-input-background-color, var(--ran-color-bg-elevated, #fff));background-image:var(--ran-input-background-image, none);border:var(--ran-input-border, 1px solid var(--ran-color-border, #d9d9d9));border-image-source:var(--ran-input-border-image-source, none);border-image-slice:var(--ran-input-border-image-slice, 8);border-image-width:var(--ran-input-border-image-width, 4px);border-image-outset:0;border-image-repeat:stretch;border-radius:var(--ran-input-border-radius, var(--ran-radius-sm, 6px));transition:var(--ran-input-transition, all var(--ran-motion-duration-base, .2s));min-height:var(--ran-input-min-height, 32px)}.ran-input .ran-icon{display:var(--ran-input-icon-display, flex);align-items:var(--ran-input-icon-align-items, center);justify-content:var(--ran-input-icon-justify-content, center)}.ran-input:focus-within{border-color:var(--ran-input-active-border-color, var(--ran-color-primary, #006bff));box-shadow:var(--ran-input-active-box-shadow, 0 0 0 2px var(--ran-blue-400, #cae7ff));border-right-width:var(--ran-input-active-border-right-width, 1px);outline:var(--ran-input-active-outline, 0)}.ran-input:hover{border-color:var(--ran-input-hover-border-color, var(--ran-color-primary, #006bff));border-right-width:var(--ran-input-hover-border-right-width, 1px)}.ran-input>.ran-input-content:hover~.ran-input-label{color:var(--ran-input-label-hover-color, var(--ran-color-primary, #40a9ff))}.ran-input[value]>.ran-input-label{transform:var(--ran-input-label-value-transform, translateY( calc(-50% - .43em) ) scale(.8));color:var(--ran-input-label-value-color, var(--ran-color-text-disabled, #00000040))}.ran-input[status=error] .ran-input-content,.ran-input[status=warning] .ran-input-content{padding-right:var(--ran-input-content-status-padding-right, 28px)}.ran-input[status=error]:after,.ran-input[status=warning]:after{content:"";position:absolute;top:50%;right:10px;width:16px;height:16px;transform:translateY(-50%);pointer-events:none;mask-position:center;mask-repeat:no-repeat;mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:contain}.ran-input[status=error]{border-color:var(--ran-input-status-error-border-color, var(--ran-color-danger, #ff4d4f))}.ran-input[status=error]>.ran-input-content~.ran-input-label{color:var(--ran-input-label-status-error-color, var(--ran-color-danger, #ff4d4f))}.ran-input[status=error]:after{background-color:var(--ran-color-danger, #ff4d4f);mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a7 7 0 100 14A7 7 0 008 1zm-.75 3.5h1.5v5h-1.5v-5zM8 11a1 1 0 110 2 1 1 0 010-2z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a7 7 0 100 14A7 7 0 008 1zm-.75 3.5h1.5v5h-1.5v-5zM8 11a1 1 0 110 2 1 1 0 010-2z'/%3E%3C/svg%3E")}.ran-input[status=warning]{border-color:var(--ran-input-status-warning-border-color, var(--ran-color-warning, #faad14))}.ran-input[status=warning]>.ran-input-content~.ran-input-label{color:var(--ran-input-label-status-warning-color, var(--ran-color-warning, #faad14))}.ran-input[status=warning]:after{background-color:var(--ran-color-warning, #faad14);mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.5l6.85 11.86a.5.5 0 01-.43.75H1.58a.5.5 0 01-.43-.75L8 1.5zm-.75 4.25v3.5h1.5v-3.5h-1.5zM8 10.75a1 1 0 110 2 1 1 0 010-2z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.5l6.85 11.86a.5.5 0 01-.43.75H1.58a.5.5 0 01-.43-.75L8 1.5zm-.75 4.25v3.5h1.5v-3.5h-1.5zM8 10.75a1 1 0 110 2 1 1 0 010-2z'/%3E%3C/svg%3E")}.ran-input[disabled]{color:var(--ran-input-disabled-color, var(--ran-color-text-disabled, #00000040));background-color:var(--ran-input-disabled-background-color, var(--ran-color-bg-muted, #f5f5f5));border-color:var(--ran-input-disabled-border-color, var(--ran-color-border, #d9d9d9));box-shadow:var(--ran-input-disabled-box-shadow, none);cursor:var(--ran-input-disabled-cursor, not-allowed);opacity:var(--ran-input-disabled-opacity, 1)}.ran-input[disabled]>.ran-input-content{color:var(--ran-input-content-disabled-color, var(--ran-color-text-disabled, #00000040));background-color:var(--ran-input-content-disabled-background-color, var(--ran-color-bg-muted, #f5f5f5));border-color:var(--ran-input-content-disabled-border-color, var(--ran-color-border, #d9d9d9));box-shadow:var(--ran-input-content-disabled-box-shadow, none);cursor:var(--ran-input-content-disabled-cursor, not-allowed);opacity:var(--ran-input-content-disabled-opacity, 1)}.ran-input[disabled]>.ran-input-content~.ran-input-label{color:var(--ran-input-label-disabled-color, var(--ran-color-text-disabled, #00000040));background-color:var(--ran-input-label-disabled-background-color, var(--ran-color-bg-muted, #f5f5f5))}.ran-input[disabled]>.ran-input-label{color:var(--ran-input-label-disabled-color, var(--ran-color-text-disabled, #999));border-color:var(--ran-input-label-disabled-border-color, var(--ran-color-border, #d9d9d9));box-shadow:var(--ran-input-label-disabled-box-shadow, none);cursor:var(--ran-input-label-disabled-cursor, not-allowed)}.ran-input-content{writing-mode:var(--ran-input-content-writing-mode, horizontal-tb);text-rendering:var(--ran-input-content-text-rendering, auto);letter-spacing:var(--ran-input-content-letter-spacing, normal);word-spacing:var(--ran-input-content-word-spacing, normal);text-transform:var(--ran-input-content-text-transform, none);text-indent:var(--ran-input-content-text-indent, 0px);text-shadow:var(--ran-input-content-text-shadow, none);text-align:var(--ran-input-content-text-align, start);cursor:var(--ran-input-content-cursor, text);touch-action:var(--ran-input-content-touch-action, manipulation);-webkit-appearance:var(--ran-input-content--webkit-appearance, none);text-overflow:var(--ran-input-content-text-overflow, ellipsis);box-sizing:var(--ran-input-content-box-sizing, border-box);margin:var(--ran-input-content-margin, 0);font-variant:var(--ran-input-content-font-variant, tabular-nums);list-style:var(--ran-input-content-list-style, none);font-feature-settings:var(--ran-input-content-font-feature-settings, "tnum");position:var(--ran-input-content-position, relative);border:var(--ran-input-content-border, none);width:var(--ran-input-content-width, 100%);height:var(--ran-input-content-height, 100%);min-height:var(--ran-input-content-min-height, 30px);min-width:var(--ran-input-content-min-width, 0);color:var(--ran-input-content-color, var(--ran-color-text, #000000d9));font-size:var(--ran-input-content-font-size, 14px);line-height:var(--ran-input-content-line-height, 1.48);background-color:var(--ran-input-content-background-color, var(--ran-color-bg-elevated, #fff));background-image:var(--ran-input-content-background-image, none);transition:var(--ran-input-content-transition, all var(--ran-motion-duration-base, .2s));outline:var(--ran-input-content-outline, none);border-radius:var(--ran-input-content-border-radius, var(--ran-radius-sm, 6px));padding:var(--ran-input-content-padding, 0 0 0 2px);font-weight:var(--ran-input-content-font-weight, 400)}.ran-input-content:focus,.ran-input-content:hover{border:var(--ran-input-content-hover-border, none);outline:var(--ran-input-content-hover-outline, 0)}.ran-input-content::placeholder{color:var(--ran-input-content-placeholder-color, var(--ran-color-text-disabled, #999))}.ran-input-content:placeholder-shown~.ran-input-label{transform:var(--ran-input-content-placeholder-label-transform, translateY( calc(-50% - .43em) ) scale(.8))}.ran-input-content:focus~.ran-input-label{transform:var(--ran-input-content-focus-label-transform, translateY( calc(-50% - .43em) ) scale(.8));top:var(--ran-input-content-focus-label-top, 0px)}.ran-input-content::-webkit-search-cancel-button{display:none;-webkit-appearance:none}.ran-input-label{box-sizing:var(--ran-input-label-box-sizing, border-box);pointer-events:var(--ran-input-label-pointer-events, none);position:var(--ran-input-label-position, absolute);font-size:var(--ran-input-label-font-size, 14px);left:var(--ran-input-label-left, 8px);transition:var(--ran-input-label-transition, transform .3s, color .3s, background-color .3s, backdrop-filter .3s);transform-origin:var(--ran-input-label-transform-origin, left);padding:var(--ran-input-label-padding, 0 0);color:var(--ran-input-label-color, var(--ran-color-text-disabled, #999));background:var(--ran-input-label-background, var(--ran-color-bg-elevated, #fff));opacity:var(--ran-input-label-opacity, .9);transition:var(--ran-input-label-transition, all .3s)}.ran-input-message{margin-top:var(--ran-input-message-margin-top, 4px);font-size:var(--ran-input-message-font-size, 12px);line-height:var(--ran-input-message-line-height, 1.5);color:var(--ran-input-message-color, var(--ran-color-text-secondary, #8c8c8c))}.ran-input-message:empty{display:none}:host([status="error"]) .ran-input-message{color:var(--ran-input-message-error-color, var(--ran-color-danger, #ff4d4f))}:host([status="warning"]) .ran-input-message{color:var(--ran-input-message-warning-color, var(--ran-color-warning, #faad14))}`, f = 0, x = class extends g {
-  static formAssociated = !0;
-  _internals;
-  static get observedAttributes() {
-    return [
-      "label",
-      "disabled",
-      "name",
-      "placeholder",
-      "type",
-      "icon",
-      "value",
-      "status",
-      "message",
-      "prefix",
-      "suffix",
-      "allowclear",
-      "count",
-      "maxlength",
-      "showcount",
-      "onPressEnter",
-      "variant",
-      "minrows",
-      "maxrows",
-      "sheet"
-    ];
-  }
-  _events = new c();
-  _shadowDom;
-  _input;
-  _label;
-  _inputContent;
-  _icon;
-  _message;
-  constructor() {
-    super();
-    try {
-      this._internals = this.attachInternals();
-    } catch {
-      this._internals = void 0;
-    }
-    this._shadowDom = s(this, m);
-    const t = u(this._shadowDom, ".ran-input", () => i().class("ran-input").part("input").children(b().class("ran-input-content").part("content")).build());
-    this._input = t, this._inputContent = t.querySelector(".ran-input-content"), this._inputContent.id || (this._inputContent.id = `ran-input-${++f}`);
-  }
-  get value() {
-    return this.getAttribute("value") || "";
-  }
-  set value(t) {
-    !r(this) && t ? (this.setAttribute("value", t), this._input.setAttribute("value", t)) : (this.removeAttribute("value"), this._input.removeAttribute("value")), this._internals?.setFormValue?.(this.getAttribute("value") ?? "");
-  }
-  get placeholder() {
-    return this.getAttribute("placeholder") || "";
-  }
-  set placeholder(t) {
-    t ? this.setAttribute("placeholder", t) : this.removeAttribute("placeholder");
-  }
-  get required() {
-    return this.hasAttribute("required");
-  }
-  set required(t) {
-    !t || t === "false" ? this.removeAttribute("required") : this.setAttribute("required", "");
-  }
-  get disabled() {
-    return r(this);
-  }
-  set disabled(t) {
-    a.includes(t) ? (this.removeAttribute("disabled"), this._input.removeAttribute("disabled"), this._inputContent.removeAttribute("disabled")) : (this.setAttribute("disabled", ""), this._input.setAttribute("disabled", ""), this._inputContent.setAttribute("disabled", ""));
-  }
-  get label() {
-    return this.getAttribute("label") || "";
-  }
-  set label(t) {
-    this.setAttribute("label", t);
-  }
-  get status() {
-    return this.getAttribute("status") || "";
-  }
-  set status(t) {
-    t ? (this.setAttribute("status", t), this._input.setAttribute("status", t)) : (this.removeAttribute("status"), this._input.removeAttribute("status"));
-  }
-  get message() {
-    return this.getAttribute("message") || "";
-  }
-  set message(t) {
-    t ? this.setAttribute("message", t) : this.removeAttribute("message");
-  }
-  get name() {
-    return this.getAttribute("name") || "";
-  }
-  set name(t) {
-    this.setAttribute("name", t);
-  }
-  get min() {
-    return this.getAttribute("min") || "";
-  }
-  set min(t) {
-    this.type === "number" && this.setAttribute("min", t);
-  }
-  get max() {
-    return this.getAttribute("max") || "";
-  }
-  set max(t) {
-    this.type === "number" && this.setAttribute("max", t);
-  }
-  get step() {
-    return this.getAttribute("step") || "";
-  }
-  set step(t) {
-    this.type === "number" && this.setAttribute("step", t);
-  }
-  get icon() {
-    return this.getAttribute("icon") || "";
-  }
-  set icon(t) {
-    t ? this.setAttribute("icon", t) : this.removeAttribute("icon");
-  }
-  get prefix() {
-    return this.getAttribute("prefix") || "";
-  }
-  set prefix(t) {
-    t ? this.setAttribute("prefix", t) : this.removeAttribute("prefix");
-  }
-  get suffix() {
-    return this.getAttribute("suffix") || "";
-  }
-  set suffix(t) {
-    t ? this.setAttribute("suffix", t) : this.removeAttribute("suffix");
-  }
-  get type() {
-    return this.getAttribute("type") || "";
-  }
-  set type(t) {
-    t ? this.setAttribute("type", t) : this.removeAttribute("type");
-  }
-  get sheet() {
-    return l(this, "sheet");
-  }
-  set sheet(t) {
-    p(this, "sheet", t);
-  }
-  handlerExternalCss = () => {
-    o(this, this._shadowDom, "sheet", null, this.sheet);
-  };
-  customInput = (t) => {
-    t.stopPropagation(), t.preventDefault();
-    const { target: e, data: n = "" } = t;
-    this.value = e?.value || n || "", this.dispatchEvent(new CustomEvent("input", { detail: { value: this.value } }));
-  };
-  customChange = () => {
-    this.value = this._inputContent?.value ?? this.value, this.dispatchEvent(new CustomEvent("change", { detail: { value: this.value } }));
-  };
-  listenPlaceholder = (t, e) => {
-    t === "placeholder" && this._inputContent && (e != null ? this._inputContent.setAttribute("placeholder", e) : this._inputContent.removeAttribute("placeholder"));
-  };
-  listenLabel = (t, e) => {
-    t === "label" && this._inputContent && (e != null ? this._label ? this._label.innerHTML = e : (this._label = h().class("ran-input-label").part("label").text(e).build(), this._label.htmlFor = this._inputContent.id, this._input.appendChild(this._label)) : (this._input.removeAttribute("label"), this._label && (this._input.removeChild(this._label), this._label = void 0)));
-  };
-  listenType = (t, e) => {
-    t === "type" && this._inputContent && (e ? this._inputContent.setAttribute("type", e) : (this._inputContent.removeAttribute("type"), this._inputContent.removeAttribute("min"), this._inputContent.removeAttribute("max"), this._inputContent.removeAttribute("step")));
-  };
-  listenStatus = (t, e) => {
-    t === "status" && this._input && (e ? this._input.setAttribute("status", e) : this._input.removeAttribute("status"));
-  };
-  listenMessage = (t, e) => {
-    t === "message" && (e ? (this._message || (this._message = i().class("ran-input-message").part("message").build(), this._shadowDom.appendChild(this._message)), this._message.textContent = e) : this._message && (this._message.remove(), this._message = void 0));
-  };
-  listenDisabled = (t, e) => {
-    t === "disabled" && this._input && (a.includes(e) ? this._input.removeAttribute("disabled") : (this._input.setAttribute("disabled", ""), this._inputContent.setAttribute("disabled", "")));
-  };
-  listenIcon = (t, e, n) => {
-    t === "icon" && e && e !== n && (this.removeAttribute("label"), this.setAttribute("icon", e), this.dealIcon());
-  };
-  dealIcon = () => {
-    this._icon || (this._icon = d("r-icon").class("ran-icon").build(), this._inputContent.insertAdjacentElement("beforebegin", this._icon)), this.icon && this._icon.setAttribute("name", this.icon);
-  };
-  listenEvent = (t, e, n) => {
-    this.listenPlaceholder(t, n), this.listenLabel(t, n), this.listenStatus(t, n), this.listenMessage(t, n), this.listenDisabled(t, n), this.listenIcon(t, n, e), t === "value" && e !== n && (this._inputContent.value = n, this._input.setAttribute("value", n));
-  };
-  connectedCallback() {
-    this.handlerExternalCss(), this.value && (this._inputContent.value = this.value, this._input.setAttribute("value", this.value)), this._internals?.setFormValue?.(this.value), this.status && this._input.setAttribute("status", this.status), this.message && this.listenMessage("message", this.message), r(this) && (this._input.setAttribute("disabled", ""), this._inputContent.setAttribute("disabled", "")), this.type && this._inputContent.setAttribute("type", this.type), this._events.on(this._inputContent, "input", this.customInput), this._events.on(this._inputContent, "change", this.customChange), document.readyState === "complete" && this.dealIcon();
-  }
-  disconnectedCallback() {
-    this._events.abort();
-  }
-  attributeChangedCallback(t, e, n) {
-    e !== n && (this.listenEvent(t, e, n), t === "sheet" && this.handlerExternalCss());
-  }
-};
-v("r-input", x);
-export {
-  x as t
-};