@luminescent/ui 0.7.2 → 0.7.4

package/lib/index.qwik.mjs

@@ -1,1944 +0,0 @@
-import { componentQrl, inlinedQrl, _jsxQ, _fnSignal, _restProps, _jsxS, _jsxC, Slot, _wrapSignal, useStylesQrl, useLexicalScope, _IMMUTABLE, _jsxBranch, useStore } from "@builder.io/qwik";
-import { isServer } from "@builder.io/qwik/build";
-import { Fragment } from "@builder.io/qwik/jsx-runtime";
-const Anchor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => /* @__PURE__ */ _jsxQ("span", null, {
-  class: "block h-32 -mt-32",
-  id: _fnSignal((p0) => p0.id, [
-    props
-  ], "p0.id")
-}, null, 3, "Oa_0"), "Anchor_component_O7y4zyaazA0"));
-const buttonColorClasses = {
-  blue: "bg-blue-600/90 border-blue-500 hover:bg-blue-500 active:bg-blue-400 focus:border-blue-400",
-  purple: "bg-purple-600/90 border-purple-500 hover:bg-purple-500 active:bg-purple-400 focus:border-purple-400",
-  pink: "bg-pink-600/90 border-pink-500 hover:bg-pink-500 active:bg-pink-400 focus:border-pink-400",
-  gray: "bg-gray-700/90 border-gray-600 hover:bg-gray-600 active:bg-gray-500 focus:border-gray-500",
-  darkgray: "bg-gray-800/90 border-gray-700 hover:bg-gray-700 active:bg-gray-600 focus:border-gray-600",
-  red: "bg-red-700/90 border-red-600 hover:bg-red-600 active:bg-red-500 focus:border-red-500",
-  green: "bg-green-700/90 border-green-600 hover:bg-green-600 active:bg-green-500 focus:border-green-500",
-  yellow: "bg-yellow-700/90 border-yellow-600 hover:bg-yellow-600 active:bg-yellow-500 focus:border-yellow-500"
-};
-const sizeClasses = {
-  sm: "text-sm px-2 py-1 rounded-md gap-2 active:px-1",
-  md: "text-base px-4 py-2 rounded-md gap-3",
-  lg: "text-base px-6 py-3 rounded-lg gap-3",
-  xl: "text-base px-8 py-4 rounded-xl gap-4"
-};
-const buttonClass = "relative flex items-center gap-3 transition ease-in-out border text-gray-50 fill-gray-50 disabled:opacity-50 hover:shadow-lg active:scale-95";
-const Button = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  const props1 = _restProps(props, [
-    "color",
-    "size"
-  ]);
-  props1.class = {
-    [buttonClass]: true,
-    [buttonColorClasses[props.color ?? "darkgray"]]: true,
-    [sizeClasses[props.size ?? "md"]]: true,
-    ...props1.class
-  };
-  return /* @__PURE__ */ _jsxS("button", {
-    ...props1,
-    children: /* @__PURE__ */ _jsxC(Slot, null, 3, "7H_0")
-  }, null, 0, "7H_1");
-}, "Button_component_40p6lkzzQYM"));
-const ButtonAnchor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  const props1 = _restProps(props, [
-    "color",
-    "size"
-  ]);
-  props1.class = {
-    [buttonClass]: true,
-    [buttonColorClasses[props.color ?? "darkgray"]]: true,
-    [sizeClasses[props.size ?? "md"]]: true,
-    ...props1.class
-  };
-  return /* @__PURE__ */ _jsxS("a", {
-    ...props1,
-    children: /* @__PURE__ */ _jsxC(Slot, null, 3, "7H_2")
-  }, null, 0, "7H_3");
-}, "ButtonAnchor_component_vQT9xS0lqew"));
-const cardColorClasses = {
-  pink: {
-    card: {
-      bg_blobs: "bg-pink-400/10 border-pink-400/20",
-      bg: "bg-pink-400/60 border-pink-400",
-      hover: "hover:bg-pink-400/20",
-      click: "active:bg-pink-300/20"
-    },
-    blobs: [
-      "bg-pink-400",
-      "bg-pink-500",
-      "bg-pink-600"
-    ]
-  },
-  red: {
-    card: {
-      bg_blobs: "bg-red-400/10 border-red-400/20",
-      bg: "bg-red-400/60 border-red-400",
-      hover: "hover:bg-red-400/20",
-      click: "active:bg-red-300/20"
-    },
-    blobs: [
-      "bg-red-400",
-      "bg-red-500",
-      "bg-red-600"
-    ]
-  },
-  orange: {
-    card: {
-      bg_blobs: "bg-orange-400/10 border-orange-400/20",
-      bg: "bg-orange-400/60 border-orange-400",
-      hover: "hover:bg-orange-400/20",
-      click: "active:bg-orange-300/20"
-    },
-    blobs: [
-      "bg-orange-400",
-      "bg-orange-500",
-      "bg-orange-600"
-    ]
-  },
-  yellow: {
-    card: {
-      bg_blobs: "bg-yellow-400/10 border-yellow-400/20",
-      bg: "bg-yellow-400/60 border-yellow-400",
-      hover: "hover:bg-yellow-400/20",
-      click: "active:bg-yellow-300/20"
-    },
-    blobs: [
-      "bg-yellow-400",
-      "bg-yellow-500",
-      "bg-yellow-600"
-    ]
-  },
-  green: {
-    card: {
-      bg_blobs: "bg-green-400/10 border-green-400/20",
-      bg: "bg-green-400/60 border-green-400",
-      hover: "hover:bg-green-400/20",
-      click: "active:bg-green-300/20"
-    },
-    blobs: [
-      "bg-green-400",
-      "bg-green-500",
-      "bg-green-600"
-    ]
-  },
-  blue: {
-    card: {
-      bg_blobs: "bg-blue-400/10 border-blue-400/20",
-      bg: "bg-blue-400/60 border-blue-400",
-      hover: "hover:bg-blue-400/20",
-      click: "active:bg-blue-300/20"
-    },
-    blobs: [
-      "bg-blue-400",
-      "bg-blue-500",
-      "bg-blue-600"
-    ]
-  },
-  purple: {
-    card: {
-      bg_blobs: "bg-purple-400/10 border-purple-400/20",
-      bg: "bg-purple-400/60 border-purple-400",
-      hover: "hover:bg-purple-400/20",
-      click: "active:bg-purple-300/20"
-    },
-    blobs: [
-      "bg-purple-400",
-      "bg-purple-500",
-      "bg-purple-600"
-    ]
-  },
-  gray: {
-    card: {
-      bg_blobs: "bg-gray-400/10 border-gray-400/20",
-      bg: "bg-gray-400/60 border-gray-400",
-      hover: "hover:bg-gray-400/20",
-      click: "active:bg-gray-300/20"
-    },
-    blobs: [
-      "bg-gray-400",
-      "bg-gray-500",
-      "bg-gray-600"
-    ]
-  },
-  darkgray: {
-    card: {
-      bg_blobs: "bg-gray-800/10 border-gray-800/40",
-      bg: "bg-gray-800/60 border-gray-800",
-      hover: "hover:bg-gray-800/40",
-      click: "active:bg-gray-700/40"
-    },
-    blobs: [
-      "bg-gray-500",
-      "bg-gray-600",
-      "bg-gray-700"
-    ]
-  },
-  darkergray: {
-    card: {
-      bg_blobs: "bg-gray-900/10 border-gray-900/50",
-      bg: "bg-gray-900/60 border-gray-900",
-      hover: "hover:bg-gray-900/50",
-      click: "active:bg-gray-800/50"
-    },
-    blobs: [
-      "bg-gray-600",
-      "bg-gray-700",
-      "bg-gray-800"
-    ]
-  }
-};
-const blobClasses = [
-  "animate-blob",
-  "animate-blob1",
-  "animate-blob2",
-  "animate-blob3",
-  "animate-blob4",
-  "animate-blob5",
-  "animate-blob6"
-];
-const Card = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  const props1 = _restProps(props, [
-    "color",
-    "hover",
-    "row",
-    "blobs"
-  ]);
-  const blob = Math.round(Math.random() * 6);
-  let Component = /* @__PURE__ */ _jsxS("div", {
-    ...props1,
-    children: /* @__PURE__ */ _jsxC(Slot, null, 3, "OW_0"),
-    class: {
-      "flex gap-4 p-8 border rounded-lg transition-all": true,
-      [cardColorClasses[props.color ?? "darkgray"].card.bg]: !props.blobs,
-      [cardColorClasses[props.color ?? "darkgray"].card.bg_blobs]: props.blobs,
-      [cardColorClasses[props.color ?? "darkgray"].card.hover + " hover:shadow-lg"]: props.hover,
-      [cardColorClasses[props.color ?? "darkgray"].card.click + " active:scale-[99%] cursor-pointer select-none"]: props.hover == "clickable",
-      "h-full": props1.href,
-      "flex-col": !props.row,
-      "flex-row items-center": props.row,
-      ...props1.class
-    }
-  }, null, 0, "OW_1");
-  if (props.blobs)
-    Component = /* @__PURE__ */ _jsxQ("div", null, {
-      class: "relative"
-    }, [
-      Component,
-      /* @__PURE__ */ _jsxQ("div", null, {
-        class: "absolute -z-10 inset-0 w-full h-full transition-all overflow-clip animate-in fade-in anim-duration-[2s]",
-        style: {
-          containerType: "size"
-        }
-      }, [
-        /* @__PURE__ */ _jsxQ("div", {
-          class: {
-            "absolute top-0 w-[30cqw] h-[30cqw] rounded-full opacity-20 ease-in-out blur-xl": true,
-            [blobClasses[blob]]: true,
-            [cardColorClasses[props.color ?? "darkgray"].blobs[0]]: true
-          }
-        }, null, null, 3, null),
-        /* @__PURE__ */ _jsxQ("div", {
-          class: {
-            "absolute top-0 w-[30cqw] h-[30cqw] rounded-full opacity-20 ease-in-out blur-xl": true,
-            "anim-delay-[-5s]": true,
-            [blobClasses[blob]]: true,
-            [cardColorClasses[props.color ?? "darkgray"].blobs[1]]: true
-          }
-        }, null, null, 3, null),
-        /* @__PURE__ */ _jsxQ("div", {
-          class: {
-            "absolute top-0 w-[30cqw] h-[30cqw] rounded-full opacity-20 ease-in-out blur-xl": true,
-            "anim-delay-[-10s]": true,
-            [blobClasses[blob]]: true,
-            [cardColorClasses[props.color ?? "darkgray"].blobs[2]]: true
-          }
-        }, null, null, 3, null)
-      ], 1, null)
-    ], 1, "OW_2");
-  if (props1.href)
-    Component = /* @__PURE__ */ _jsxQ("a", {
-      href: _wrapSignal(props1, "href")
-    }, null, Component, 1, "OW_3");
-  return Component;
-}, "Card_component_DlkkcTEVka4"));
-const InputClasses = "transition ease-in-out text-lg border border-gray-700 bg-gray-800 text-gray-50 hover:bg-gray-700 hover:shadow-lg focus:bg-gray-700 focus:outline-none focus:border-gray-400 rounded-md px-3 py-2";
-const TextInput = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxQ("div", null, {
-    class: "flex flex-col"
-  }, [
-    /* @__PURE__ */ _jsxQ("label", null, {
-      class: "pb-2",
-      for: _fnSignal((p0) => p0.id, [
-        props
-      ], "p0.id")
-    }, /* @__PURE__ */ _jsxC(Slot, null, 3, "dC_0"), 1, null),
-    /* @__PURE__ */ _jsxC(TextInputRaw, {
-      ...props,
-      children: void 0
-    }, 0, "dC_1")
-  ], 1, "dC_2");
-}, "TextInput_component_AXp2j5aulZI"));
-const TextInputRaw = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("input", {
-    ...props,
-    class: {
-      [InputClasses]: true,
-      ...props.class
-    }
-  }, null, 0, "dC_3");
-}, "TextInputRaw_component_ssloWlmBB4w"));
-const clamp = (value, min, max) => Math.min(Math.max(value, min), max);
-function getMousePosition(e) {
-  if (e instanceof TouchEvent) {
-    const touch = e.touches[0];
-    return {
-      x: touch.clientX,
-      y: touch.clientY
-    };
-  }
-  const mouse = e;
-  return {
-    x: mouse.clientX,
-    y: mouse.clientY
-  };
-}
-const pad2 = (c) => c.length == 1 ? "0" + c : "" + c;
-class Color {
-  constructor(color) {
-    this._rgba = {
-      r: 0,
-      g: 0,
-      b: 0,
-      a: 1
-    };
-    this._hsva = {
-      h: 0,
-      s: 0,
-      v: 0,
-      a: 1
-    };
-    this.fromHex(color);
-  }
-  fromHex(color = 0) {
-    if (typeof color === "number") {
-      this._hexNumber = color;
-      this._hexString = numberToHexString(this._hexNumber);
-    } else {
-      this._hexString = color.toUpperCase();
-      this._hexNumber = hexStringToNumber(this._hexString);
-    }
-    const { r, g, b } = hexNumberToRgb(this._hexNumber);
-    this._rgba.r = r;
-    this._rgba.g = g;
-    this._rgba.b = b;
-    const { h, s, v } = rgbToHsv(this._rgba);
-    this._hsva.h = h;
-    this._hsva.s = s;
-    this._hsva.v = v;
-    this._updateBrightness();
-  }
-  fromHsv(color) {
-    const { h, s, v } = color;
-    this._hsva.h = h;
-    this._hsva.s = s;
-    this._hsva.v = v;
-    const { r, g, b } = hsvToRgb(this._hsva);
-    this._rgba.r = r;
-    this._rgba.g = g;
-    this._rgba.b = b;
-    this._hexString = rgbToHex(this._rgba);
-    this._hexNumber = hexStringToNumber(this._hexString);
-    this._updateBrightness();
-  }
-  _updateBrightness() {
-    this._brightness = getBrightness(this._rgba);
-    this._isDark = this._brightness < 0.5;
-    this._isLight = !this._isDark;
-  }
-  get rgb() {
-    return this._rgba;
-  }
-  get hsv() {
-    return this._hsva;
-  }
-  get hex() {
-    return this._hexNumber;
-  }
-  get hexString() {
-    return this._hexString;
-  }
-  get brightness() {
-    return this._brightness;
-  }
-  get isDark() {
-    return this._isDark;
-  }
-  get isLight() {
-    return this._isLight;
-  }
-}
-function getBrightness(color) {
-  const { r, g, b } = color;
-  return (r * 299 + g * 587 + b * 114) / 1e3;
-}
-function hexNumberToRgb(color) {
-  const r = (color >> 16 & 255) / 255;
-  const g = (color >> 8 & 255) / 255;
-  const b = (color & 255) / 255;
-  return {
-    r,
-    g,
-    b
-  };
-}
-function rgbToHex(color) {
-  const { r, g, b } = color;
-  const hex = [
-    "#",
-    pad2(Math.round(r * 255).toString(16)),
-    pad2(Math.round(g * 255).toString(16)),
-    pad2(Math.round(b * 255).toString(16))
-  ];
-  return hex.join("").toUpperCase();
-}
-const numberToHexString = (color) => "#" + ("00000" + (color | 0).toString(16)).substr(-6).toUpperCase();
-const hexStringToNumber = (color) => parseInt(color.replace("#", ""), 16);
-function hsvToRgb(color) {
-  let { h } = color;
-  const { s, v } = color;
-  h *= 6;
-  const i = Math.floor(h);
-  const f = h - i;
-  const p = v * (1 - s);
-  const q = v * (1 - f * s);
-  const t = v * (1 - (1 - f) * s);
-  const mod = i % 6;
-  const r = [
-    v,
-    q,
-    p,
-    p,
-    t,
-    v
-  ][mod];
-  const g = [
-    t,
-    v,
-    v,
-    q,
-    p,
-    p
-  ][mod];
-  const b = [
-    p,
-    p,
-    t,
-    v,
-    v,
-    q
-  ][mod];
-  return {
-    r,
-    g,
-    b
-  };
-}
-function rgbToHsv(color) {
-  const { r, g, b } = color;
-  const max = Math.max(r, g, b);
-  const min = Math.min(r, g, b);
-  const d = max - min;
-  const s = max === 0 ? 0 : d / max;
-  const v = max;
-  let h = 0;
-  if (max != min) {
-    switch (max) {
-      case r:
-        h = (g - b) / d + (g < b ? 6 : 0);
-        break;
-      case g:
-        h = (b - r) / d + 2;
-        break;
-      case b:
-        h = (r - g) / d + 4;
-        break;
-    }
-    h /= 6;
-  }
-  return {
-    h,
-    s,
-    v
-  };
-}
-class ColorPicker {
-  constructor(options = {}) {
-    this._widthUnits = "px";
-    this._heightUnits = "px";
-    this._huePosition = 0;
-    this._hueHeight = 0;
-    this._maxHue = 0;
-    this._inputIsNumber = false;
-    this._saturationWidth = 0;
-    this._isChoosing = false;
-    this._callbacks = [];
-    this.width = 0;
-    this.height = 0;
-    this.hue = 0;
-    this.position = {
-      x: 0,
-      y: 0
-    };
-    this.color = new Color(0);
-    this.backgroundColor = new Color(0);
-    this.hueColor = new Color(0);
-    this._onSaturationMouseDown = (e) => {
-      const sbOffset = this.$saturation.getBoundingClientRect();
-      const { x, y } = getMousePosition(e);
-      this._isChoosing = true;
-      this._moveSelectorTo(x - sbOffset.left, y - sbOffset.top);
-      this._updateColorFromPosition();
-      this._window.addEventListener("mouseup", this._onSaturationMouseUp);
-      this._window.addEventListener("touchend", this._onSaturationMouseUp);
-      this._window.addEventListener("mousemove", this._onSaturationMouseMove);
-      this._window.addEventListener("touchmove", this._onSaturationMouseMove);
-      e.preventDefault();
-    };
-    this._onSaturationMouseMove = (e) => {
-      const sbOffset = this.$saturation.getBoundingClientRect();
-      const { x, y } = getMousePosition(e);
-      this._moveSelectorTo(x - sbOffset.left, y - sbOffset.top);
-      this._updateColorFromPosition();
-    };
-    this._onSaturationMouseUp = () => {
-      this._isChoosing = false;
-      this._window.removeEventListener("mouseup", this._onSaturationMouseUp);
-      this._window.removeEventListener("touchend", this._onSaturationMouseUp);
-      this._window.removeEventListener("mousemove", this._onSaturationMouseMove);
-      this._window.removeEventListener("touchmove", this._onSaturationMouseMove);
-    };
-    this._onHueMouseDown = (e) => {
-      const hOffset = this.$hue.getBoundingClientRect();
-      const { y } = getMousePosition(e);
-      this._isChoosing = true;
-      this._moveHueTo(y - hOffset.top);
-      this._updateHueFromPosition();
-      this._window.addEventListener("mouseup", this._onHueMouseUp);
-      this._window.addEventListener("touchend", this._onHueMouseUp);
-      this._window.addEventListener("mousemove", this._onHueMouseMove);
-      this._window.addEventListener("touchmove", this._onHueMouseMove);
-      e.preventDefault();
-    };
-    this._onHueMouseMove = (e) => {
-      const hOffset = this.$hue.getBoundingClientRect();
-      const { y } = getMousePosition(e);
-      this._moveHueTo(y - hOffset.top);
-      this._updateHueFromPosition();
-    };
-    this._onHueMouseUp = () => {
-      this._isChoosing = false;
-      this._window.removeEventListener("mouseup", this._onHueMouseUp);
-      this._window.removeEventListener("touchend", this._onHueMouseUp);
-      this._window.removeEventListener("mousemove", this._onHueMouseMove);
-      this._window.removeEventListener("touchmove", this._onHueMouseMove);
-    };
-    this._window = options.window || window;
-    this._document = this._window.document;
-    this.$el = this._document.createElement("div");
-    this.$el.className = "color-picker";
-    this.$el.innerHTML = `
-      <div class="color-picker-saturation">
-        <div class="color-picker-brightness"></div>
-        <div class="color-picker-sbSelector"></div>
-      </div>
-      <div class="color-picker-hue">
-        <div class="color-picker-hSelector"></div>
-      </div>
-    `;
-    this.$saturation = this.$el.querySelector(".color-picker-saturation");
-    this.$hue = this.$el.querySelector(".color-picker-hue");
-    this.$sbSelector = this.$el.querySelector(".color-picker-sbSelector");
-    this.$hSelector = this.$el.querySelector(".color-picker-hSelector");
-    this.$saturation.addEventListener("mousedown", this._onSaturationMouseDown);
-    this.$saturation.addEventListener("touchstart", this._onSaturationMouseDown);
-    this.$hue.addEventListener("mousedown", this._onHueMouseDown);
-    this.$hue.addEventListener("touchstart", this._onHueMouseDown);
-    if (options.el)
-      this.appendTo(options.el);
-    if (options.background)
-      this.setBackgroundColor(options.background);
-    if (options.widthUnits)
-      this._widthUnits = options.widthUnits;
-    if (options.heightUnits)
-      this._heightUnits = options.heightUnits;
-    if (options.colors) {
-      this.$colors = this._document.createElement("div");
-      this.$colors.className = "color-picker-colors";
-      this.$el.appendChild(this.$colors);
-      this.$colors.innerHTML = options.colors.map((color) => `<div class="color-picker-color" style="background: ${color}"></div>`).join("");
-    }
-    this.setSize(options.width || 175, options.height || 150);
-    this.setColor(options.color);
-  }
-  /**
-  * Add the ColorPicker instance to a DOM element.
-  * @param  {HTMLElement} el
-  * @return {ColorPicker} Returns itself for chaining purpose
-  */
-  appendTo(el) {
-    if (typeof el === "string")
-      document.querySelector(el).appendChild(this.$el);
-    else
-      el.appendChild(this.$el);
-    return this;
-  }
-  /**
-  * Removes picker from its parent and kill all listeners.
-  * Call this method for proper destroy.
-  */
-  remove() {
-    this._callbacks = [];
-    this._onSaturationMouseUp();
-    this._onHueMouseUp();
-    this.$saturation.removeEventListener("mousedown", this._onSaturationMouseDown);
-    this.$saturation.removeEventListener("touchstart", this._onSaturationMouseDown);
-    this.$hue.removeEventListener("mousedown", this._onHueMouseDown);
-    this.$hue.removeEventListener("touchstart", this._onHueMouseDown);
-    if (this.$el.parentNode)
-      this.$el.parentNode.removeChild(this.$el);
-  }
-  /**
-  * Manually set the current color of the picker. This is the method
-  * used on instantiation to convert `color` option to actual color for
-  * the picker. Param can be a hexadecimal number or an hex String.
-  * @param {String|Number} color hex color desired
-  * @return {ColorPicker} Returns itself for chaining purpose
-  */
-  setColor(color) {
-    this._inputIsNumber = !isNaN(Number(color));
-    this.color.fromHex(color);
-    const { h, s, v } = this.color.hsv;
-    if (!isNaN(h))
-      this.hue = h;
-    this._moveSelectorTo(this._saturationWidth * s, (1 - v) * this._hueHeight);
-    this._moveHueTo((1 - this.hue) * this._hueHeight);
-    this._updateHue();
-    return this;
-  }
-  /**
-  * Set size of the color picker for a given width and height. Note that
-  * a padding of 5px will be added if you chose to use the background option
-  * of the constructor.
-  * @param {Number} width
-  * @param {Number} height
-  * @return {ColorPicker} Returns itself for chaining purpose
-  */
-  setSize(width, height) {
-    this.width = width;
-    this.height = height;
-    this.$el.style.width = this.width + this._widthUnits;
-    this.$el.style.height = this.height + this._heightUnits;
-    this._saturationWidth = this.width - 25;
-    this.$saturation.style.width = this._saturationWidth + "px";
-    this._hueHeight = this.height;
-    this._maxHue = this._hueHeight - 2;
-    return this;
-  }
-  /**
-  * Set the background color of the picker. It also adds a 5px padding
-  * for design purpose.
-  * @param {String|Number} color hex color desired for background
-  * @return {ColorPicker} Returns itself for chaining purpose
-  */
-  setBackgroundColor(color) {
-    this.backgroundColor.fromHex(color);
-    this.$el.style.padding = "5px";
-    this.$el.style.background = this.backgroundColor.hexString;
-    return this;
-  }
-  /**
-  * Removes background of the picker if previously set. It's no use
-  * calling this method if you didn't set the background option on start
-  * or if you didn't call setBackgroundColor previously.
-  */
-  setNoBackground() {
-    this.$el.style.padding = "0px";
-    this.$el.style.background = "none";
-    return this;
-  }
-  /**
-  * Registers callback to the update event of the picker.
-  * picker inherits from [component/emitter](https://github.com/component/emitter)
-  * so you could do the same thing by calling `colorPicker.on('update');`
-  * @param  {Function} callback
-  * @return {ColorPicker} Returns itself for chaining purpose
-  */
-  onChange(callback) {
-    if (this._callbacks.indexOf(callback) < 0) {
-      this._callbacks.push(callback);
-      callback(this.getHexString());
-    }
-    return this;
-  }
-  /**
-  * Is true when mouse is down and user is currently choosing a color.
-  */
-  get isChoosing() {
-    return this._isChoosing;
-  }
-  /* =============================================================================
-    Color getters
-  ============================================================================= */
-  /**
-  * Main color getter, will return a formatted color string depending on input
-  * or a number depending on the last setColor call.
-  * @return {Number|String}
-  */
-  getColor() {
-    if (this._inputIsNumber)
-      return this.getHexNumber();
-    return this.getHexString();
-  }
-  /**
-  * Returns color as css hex string (ex: '#FF0000').
-  * @return {String}
-  */
-  getHexString() {
-    return this.color.hexString.toUpperCase();
-  }
-  /**
-  * Returns color as number (ex: 0xFF0000).
-  * @return {Number}
-  */
-  getHexNumber() {
-    return this.color.hex;
-  }
-  /**
-  * Returns color as {r: 1, g: 0, b: 0} object.
-  * @return {Object}
-  */
-  getRGB() {
-    return this.color.rgb;
-  }
-  /**
-  * Returns color as {h: 100, s: 1, v: 1} object.
-  * @return {Object}
-  */
-  getHSV() {
-    return this.color.hsv;
-  }
-  /**
-  * Returns true if color is perceived as dark
-  * @return {Boolean}
-  */
-  isDark() {
-    return this.color.isDark;
-  }
-  /**
-  * Returns true if color is perceived as light
-  * @return {Boolean}
-  */
-  isLight() {
-    return this.color.isLight;
-  }
-  /* =============================================================================
-    Private methods
-  ============================================================================= */
-  _moveSelectorTo(x, y) {
-    this.position.x = clamp(x, 0, this._saturationWidth);
-    this.position.y = clamp(y, 0, this._hueHeight);
-    this.$sbSelector.style.transform = `translate(${this.position.x}px, ${this.position.y}px)`;
-  }
-  _updateColorFromPosition() {
-    this.color.fromHsv({
-      h: this.hue,
-      s: this.position.x / this._saturationWidth,
-      v: 1 - this.position.y / this._hueHeight
-    });
-    this._updateColor();
-  }
-  _moveHueTo(y) {
-    this._huePosition = clamp(y, 0, this._maxHue);
-    this.$hSelector.style.transform = `translateY(${this._huePosition}px)`;
-  }
-  _updateHueFromPosition() {
-    const hsvColor = this.getHSV();
-    this.hue = 1 - this._huePosition / this._maxHue;
-    this.color.fromHsv({
-      h: this.hue,
-      s: hsvColor.s,
-      v: hsvColor.v
-    });
-    this._updateHue();
-  }
-  _updateHue() {
-    this.hueColor.fromHsv({
-      h: this.hue,
-      s: 1,
-      v: 1
-    });
-    this.$hSelector.style.background = this.hueColor.hexString;
-    this.$saturation.style.background = `linear-gradient(to right, #fff, ${this.hueColor.hexString})`;
-    this._updateColor();
-  }
-  _updateColor() {
-    this.$sbSelector.style.background = this.getHexString();
-    this.$sbSelector.style.borderColor = this.isDark() ? "#fff" : "#000";
-    this._triggerChange();
-  }
-  _triggerChange() {
-    this._callbacks.forEach((callback) => callback(this.getHexString()));
-  }
-}
-const ColorInput = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  const props1 = _restProps(props, [
-    "onInput$",
-    "value",
-    "presetColors",
-    "preview"
-  ]);
-  useStylesQrl(/* @__PURE__ */ inlinedQrl(`
-    .color-picker {
-      display: flex;
-      gap: 12px;
-      height: 185px !important;
-      width: 100% !important;
-      padding: 15px;
-      border-radius: 10px;
-      border: 1px solid rgb(31 41 55);
-      filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.5));
-      background: rgba(31 41 55 / 40%);
-      backdrop-filter: blur(10px);
-      user-select: none;
-      position: relative;
-      z-index: 1000;
-    }
-
-    .color-picker-saturation {
-      position: relative;
-      height: 100%;
-      width: 100%;
-      background: linear-gradient(to right, #FFFFFF, #FF0000);
-      float: left;
-      border-radius: 5px;
-      border: 1px solid rgb(31 41 55);
-    }
-
-    .color-picker-brightness {
-      width: 100%;
-      height: 100%;
-      background: linear-gradient(rgba(255, 255, 255, 0), rgba(0, 0, 0, 1));
-    }
-
-    .color-picker-sbSelector {
-      border: 1px solid white;
-      position: absolute;
-      width: 14px;
-      height: 14px;
-      background: white;
-      border-radius: 10px;
-      top: -7px;
-      left: -7px;
-      box-sizing: border-box;
-    }
-
-    .color-picker-hue {
-      width: 8px;
-      border-radius: 5px;
-      height: 100%;
-      position: relative;
-      float: left;
-      background: linear-gradient(rgb(255, 0, 0) 0%, rgb(255, 0, 255) 17%, rgb(0, 0, 255) 34%, rgb(0, 255, 255) 50%, rgb(0, 255, 0) 67%, rgb(255, 255, 0) 84%, rgb(255, 0, 0) 100%);
-      border: 1px solid rgb(31 41 55);
-    }
-
-    .color-picker-colors {
-      height: 100%;
-      position: relative;
-      display: flex;
-      flex-direction: column;
-      gap: 5px;
-      float: left;
-      justify-content: space-evenly;
-      flex-wrap: wrap;
-    }
-
-    .color-picker-color {
-      height: 25px;
-      width: 25px;
-      border-radius: 5px;
-      position: relative;
-      background: red;
-      border: 1px solid rgb(31 41 55);
-    }
-
-    .color-picker-hSelector {
-      border: 1px solid white;
-      position: absolute;
-      width: 14px;
-      height: 14px;
-      background: white;
-      border-radius: 10px;
-      top: -6px;
-      left: -4px;
-      box-sizing: border-box;
-    }
-  `, "ColorInput_component_useStyles_SMNFl4Oy0IA"));
-  return /* @__PURE__ */ _jsxQ("div", null, null, [
-    /* @__PURE__ */ _jsxQ("label", {
-      for: _wrapSignal(props1, "id")
-    }, {
-      class: "mb-2 flex"
-    }, /* @__PURE__ */ _jsxC(Slot, null, 3, "0s_0"), 1, null),
-    /* @__PURE__ */ _jsxC(TextInputRaw, {
-      ...props1,
-      get value() {
-        return props.value ?? "#000000";
-      },
-      onBlur$: /* @__PURE__ */ inlinedQrl(() => {
-        const [props12] = useLexicalScope();
-        const pickerDiv = document.getElementById(`${props12.id}-color-picker`);
-        pickerDiv.classList.add("opacity-0", "pointer-events-none", "scale-95");
-      }, "ColorInput_component_div_TextInputRaw_onBlur_giB7aSy8tnc", [
-        props1
-      ]),
-      onFocus$: /* @__PURE__ */ inlinedQrl((event, element) => {
-        const [props12, props2] = useLexicalScope();
-        const pickerDiv = document.getElementById(`${props12.id}-color-picker`);
-        if (!pickerDiv.children.length) {
-          if (isServer)
-            return;
-          const picker = new ColorPicker({
-            el: pickerDiv,
-            color: props2.value ?? "#000000",
-            colors: props2.presetColors,
-            width: 150,
-            height: 150
-          });
-          picker.onChange((color) => {
-            element.value = color;
-            switch (props2.preview ?? "left") {
-              case "full":
-                element.style.backgroundColor = color;
-                element.style.color = getBrightness(hexNumberToRgb(hexStringToNumber(color))) > 0.5 ? "black" : "white";
-                break;
-              case "left":
-                element.style.borderLeft = `40px solid ${color}`;
-                break;
-              case "right":
-                element.style.borderRight = `40px solid ${color}`;
-                break;
-              case "top":
-                element.style.borderTop = `10px solid ${color}`;
-                break;
-              case "bottom":
-                element.style.borderBottom = `10px solid ${color}`;
-                break;
-            }
-            if (props2.onInput$)
-              props2.onInput$(color, element);
-          });
-          element.addEventListener("input", () => picker.setColor(element.value));
-        }
-        pickerDiv.classList.remove("opacity-0", "pointer-events-none", "scale-95");
-      }, "ColorInput_component_div_TextInputRaw_onFocus_9bHrhSeTgfI", [
-        props1,
-        props
-      ]),
-      style: (props.preview ?? "left") == "full" ? {
-        backgroundColor: `${props.value ?? "#000000"}`,
-        color: getBrightness(hexNumberToRgb(hexStringToNumber(props.value ?? "#000000"))) > 0.5 ? "black" : "white"
-      } : (props.preview ?? "left") == "left" ? {
-        borderLeft: `40px solid ${props.value ?? "#000000"}`
-      } : (props.preview ?? "left") == "right" ? {
-        borderRight: `40px solid ${props.value ?? "#000000"}`
-      } : (props.preview ?? "left") == "top" ? {
-        borderTop: `10px solid ${props.value ?? "#000000"}`
-      } : (props.preview ?? "left") == "bottom" ? {
-        borderBottom: `10px solid ${props.value ?? "#000000"}`
-      } : {},
-      [_IMMUTABLE]: {
-        value: _fnSignal((p0) => p0.value ?? "#000000", [
-          props
-        ], 'p0.value??"#000000"')
-      }
-    }, 0, "0s_1"),
-    /* @__PURE__ */ _jsxQ("div", {
-      id: `${props1.id}-color-picker`
-    }, {
-      class: "absolute mt-2 opacity-0 transition-all pointer-events-none scale-95"
-    }, null, 3, null)
-  ], 1, "0s_2");
-}, "ColorInput_component_jilGo0Bn3Ps"));
-const LoadingIcon = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  const props1 = _restProps(props, [
-    "width",
-    "speed"
-  ]);
-  return /* @__PURE__ */ _jsxS("div", {
-    ...props1,
-    class: {
-      "animate-spin rounded-full border-transparent border-l-current border-t-current": true,
-      ...props1.class
-    }
-  }, {
-    style: _fnSignal((p0) => ({
-      borderWidth: p0.width / 8,
-      width: p0.width,
-      height: p0.width,
-      animation: `spin ${p0.speed ?? "0.6s"} ease-in-out infinite`
-    }), [
-      props
-    ], '{borderWidth:p0.width/8,width:p0.width,height:p0.width,animation:`spin ${p0.speed??"0.6s"} ease-in-out infinite`}')
-  }, 0, "1A_0");
-}, "LoadingIcon_component_QMsA9D0RcAM"));
-const Header = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  _jsxBranch();
-  let Component = /* @__PURE__ */ _jsxC(Fragment, {
-    children: /* @__PURE__ */ _jsxQ("h2", null, {
-      class: "flex flex-1 items-center font-bold text-2xl"
-    }, [
-      props.id && /* @__PURE__ */ _jsxC(Anchor, {
-        get id() {
-          return props.id;
-        },
-        [_IMMUTABLE]: {
-          id: _fnSignal((p0) => p0.id, [
-            props
-          ], "p0.id")
-        }
-      }, 3, "dL_0"),
-      /* @__PURE__ */ _jsxC(Slot, null, 3, "dL_1")
-    ], 1, null)
-  }, 1, "dL_2");
-  if (props.subheader)
-    Component = /* @__PURE__ */ _jsxQ("div", null, {
-      class: "flex flex-1 flex-col gap-1"
-    }, [
-      Component,
-      /* @__PURE__ */ _jsxQ("h3", null, {
-        class: "flex flex-1 items-center text-gray-400 text-sm"
-      }, _fnSignal((p0) => p0.subheader, [
-        props
-      ], "p0.subheader"), 3, null)
-    ], 1, "dL_3");
-  if (props.loading !== void 0)
-    Component = /* @__PURE__ */ _jsxQ("div", null, {
-      class: "flex"
-    }, [
-      Component,
-      /* @__PURE__ */ _jsxQ("div", null, {
-        class: _fnSignal((p0) => ({
-          "transition-all duration-200": true,
-          "opacity-0": !p0.loading,
-          "opacity-100": p0.loading
-        }), [
-          props
-        ], '{"transition-all duration-200":true,"opacity-0":!p0.loading,"opacity-100":p0.loading}')
-      }, /* @__PURE__ */ _jsxC(LoadingIcon, {
-        width: 24,
-        [_IMMUTABLE]: {
-          width: _IMMUTABLE
-        }
-      }, 3, "dL_4"), 1, null)
-    ], 1, "dL_5");
-  return Component;
-}, "Header_component_FfGOhhBNG5k"));
-const Plus = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: /* @__PURE__ */ _jsxQ("path", null, {
-      d: "M256 112v288M400 256H112",
-      fill: "none",
-      stroke: "currentColor",
-      "stroke-linecap": "round",
-      "stroke-linejoin": "round",
-      "stroke-width": "32"
-    }, null, 3, null)
-  }, {
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    viewBox: "0 0 512 512",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, 0, "qR_0");
-}, "Plus_component_a7LdBXNrC2w"));
-const Minus = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: /* @__PURE__ */ _jsxQ("path", null, {
-      d: "M400 256H112",
-      fill: "none",
-      stroke: "currentColor",
-      "stroke-linecap": "round",
-      "stroke-linejoin": "round",
-      "stroke-width": "32"
-    }, null, 3, null)
-  }, {
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    viewBox: "0 0 512 512",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, 0, "0g_0");
-}, "Minus_component_oP9l58XNP1Q"));
-const NumberInput = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxQ("div", null, {
-    class: "flex flex-col"
-  }, [
-    /* @__PURE__ */ _jsxQ("label", null, {
-      class: "pb-2",
-      for: _fnSignal((p0) => p0.id, [
-        props
-      ], "p0.id")
-    }, /* @__PURE__ */ _jsxC(Slot, null, 3, "gk_0"), 1, null),
-    /* @__PURE__ */ _jsxC(NumberInputRaw, {
-      ...props,
-      children: void 0
-    }, 0, "gk_1")
-  ], 1, "gk_2");
-}, "NumberInput_component_1NmuE0VG00M"));
-const NumberInputRaw = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  const props1 = _restProps(props, [
-    "input",
-    "onDecrement$",
-    "onIncrement$",
-    "value",
-    "step"
-  ]);
-  useStylesQrl(/* @__PURE__ */ inlinedQrl(`
-    input::-webkit-outer-spin-button,
-    input::-webkit-inner-spin-button {
-      -webkit-appearance: none;
-      margin: 0;
-    }
-    input[type=number] {
-      -moz-appearance: textfield;
-    }
-  `, "NumberInputRaw_component_useStyles_v5EsWTMt0DU"));
-  const store = useStore({
-    value: props.value ?? 0
-  });
-  return /* @__PURE__ */ _jsxQ("div", null, {
-    class: _fnSignal((p0) => ({
-      "flex text-gray-50": true,
-      "gap-2": !p0.input
-    }), [
-      props
-    ], '{"flex text-gray-50":true,"gap-2":!p0.input}')
-  }, [
-    /* @__PURE__ */ _jsxC(Button, {
-      get color() {
-        return props.input ? "gray" : "darkgray";
-      },
-      "aria-label": "Decrement",
-      "data-action": "decrement",
-      disabled: props1.min ? store.value <= props1.min : false,
-      onClick$: /* @__PURE__ */ inlinedQrl((event, element) => {
-        const [props2, store2] = useLexicalScope();
-        store2.value = store2.value - (props2.step ?? 1);
-        props2.onDecrement$(event, element, store2);
-      }, "NumberInputRaw_component_div_Button_onClick_PgKg57gfX0I", [
-        props,
-        store
-      ]),
-      get class() {
-        return {
-          "mr-2": props.input
-        };
-      },
-      children: /* @__PURE__ */ _jsxC(Minus, {
-        class: "fill-current",
-        width: "24",
-        [_IMMUTABLE]: {
-          class: _IMMUTABLE,
-          width: _IMMUTABLE
-        }
-      }, 3, "gk_3"),
-      [_IMMUTABLE]: {
-        "aria-label": _IMMUTABLE,
-        class: _fnSignal((p0) => ({
-          "mr-2": p0.input
-        }), [
-          props
-        ], '{"mr-2":p0.input}'),
-        color: _fnSignal((p0) => p0.input ? "gray" : "darkgray", [
-          props
-        ], 'p0.input?"gray":"darkgray"'),
-        "data-action": _IMMUTABLE,
-        onClick$: _IMMUTABLE
-      }
-    }, 1, "gk_4"),
-    props.input && /* @__PURE__ */ _jsxS("input", {
-      ...props1,
-      class: {
-        [InputClasses]: true,
-        ...props1.class
-      }
-    }, {
-      step: _fnSignal((p0) => p0.step ?? 1, [
-        props
-      ], "p0.step??1"),
-      type: "number",
-      value: _fnSignal((p0) => p0.value, [
-        store
-      ], "p0.value")
-    }, 0, "gk_5"),
-    /* @__PURE__ */ _jsxC(Button, {
-      get color() {
-        return props.input ? "gray" : "darkgray";
-      },
-      "aria-label": "Increment",
-      "data-action": "increment",
-      disabled: props1.max ? store.value >= props1.max : false,
-      onClick$: /* @__PURE__ */ inlinedQrl((event, element) => {
-        const [props2, store2] = useLexicalScope();
-        store2.value = store2.value + (props2.step ?? 1);
-        props2.onIncrement$(event, element, store2);
-      }, "NumberInputRaw_component_div_Button_onClick_1_UzVlUpg1uGs", [
-        props,
-        store
-      ]),
-      get class() {
-        return {
-          "ml-2": props.input
-        };
-      },
-      children: /* @__PURE__ */ _jsxC(Plus, {
-        class: "fill-current",
-        width: "24",
-        [_IMMUTABLE]: {
-          class: _IMMUTABLE,
-          width: _IMMUTABLE
-        }
-      }, 3, "gk_6"),
-      [_IMMUTABLE]: {
-        "aria-label": _IMMUTABLE,
-        class: _fnSignal((p0) => ({
-          "ml-2": p0.input
-        }), [
-          props
-        ], '{"ml-2":p0.input}'),
-        color: _fnSignal((p0) => p0.input ? "gray" : "darkgray", [
-          props
-        ], 'p0.input?"gray":"darkgray"'),
-        "data-action": _IMMUTABLE,
-        onClick$: _IMMUTABLE
-      }
-    }, 1, "gk_7")
-  ], 1, "gk_8");
-}, "NumberInputRaw_component_8sGf0eS1rvo"));
-const ChevronDown = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: /* @__PURE__ */ _jsxQ("path", null, {
-      d: "M112 184l144 144 144-144",
-      fill: "none",
-      stroke: "currentColor",
-      "stroke-linecap": "round",
-      "stroke-linejoin": "round",
-      "stroke-width": "48"
-    }, null, 3, null)
-  }, {
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    viewBox: "0 0 512 512",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, 0, "rN_0");
-}, "ChevronDown_component_V0linof0cMQ"));
-const SelectInput = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxQ("div", null, {
-    class: "flex flex-col"
-  }, [
-    /* @__PURE__ */ _jsxQ("label", null, {
-      class: "pb-2",
-      for: _fnSignal((p0) => p0.id, [
-        props
-      ], "p0.id")
-    }, /* @__PURE__ */ _jsxC(Slot, null, 3, "cA_0"), 1, null),
-    /* @__PURE__ */ _jsxC(SelectInputRaw, {
-      ...props
-    }, 0, "cA_1")
-  ], 1, "cA_2");
-}, "SelectInput_component_m80ag1KuJSk"));
-const SelectInputRaw = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  const props1 = _restProps(props, [
-    "id",
-    "values",
-    "class"
-  ]);
-  const store = useStore({
-    opened: false
-  });
-  return /* @__PURE__ */ _jsxQ("div", null, {
-    class: "relative"
-  }, [
-    /* @__PURE__ */ _jsxS("select", {
-      ...props1,
-      children: props.values.map((value, i) => {
-        return /* @__PURE__ */ _jsxQ("option", {
-          value: _wrapSignal(value, "value")
-        }, null, value.name, 1, i);
-      })
-    }, {
-      class: {
-        "hidden": true
-      },
-      id: _fnSignal((p0) => p0.id, [
-        props
-      ], "p0.id")
-    }, 0, null),
-    /* @__PURE__ */ _jsxC(Button, {
-      get class() {
-        return {
-          "flex focus:bg-gray-700": true,
-          ...props.class
-        };
-      },
-      children: [
-        /* @__PURE__ */ _jsxQ("span", null, {
-          class: "flex-1 text-left",
-          id: _fnSignal((p0) => `lui-${p0.id}-name`, [
-            props
-          ], "`lui-${p0.id}-name`")
-        }, props.values.find((value) => value.value.toString() === props1.value)?.name ?? props.values[0].name, 1, null),
-        /* @__PURE__ */ _jsxC(ChevronDown, {
-          width: 16,
-          get class() {
-            return {
-              "transition-all duration-200": true,
-              "transform rotate-180": store.opened
-            };
-          },
-          [_IMMUTABLE]: {
-            class: _fnSignal((p0) => ({
-              "transition-all duration-200": true,
-              "transform rotate-180": p0.opened
-            }), [
-              store
-            ], '{"transition-all duration-200":true,"transform rotate-180":p0.opened}'),
-            width: _IMMUTABLE
-          }
-        }, 3, "cA_3")
-      ],
-      onClick$: /* @__PURE__ */ inlinedQrl(() => {
-        const [store2] = useLexicalScope();
-        store2.opened = !store2.opened;
-      }, "SelectInputRaw_component_div_Button_onClick_9Gkbglaqsdw", [
-        store
-      ]),
-      [_IMMUTABLE]: {
-        class: _fnSignal((p0) => ({
-          "flex focus:bg-gray-700": true,
-          ...p0.class
-        }), [
-          props
-        ], '{"flex focus:bg-gray-700":true,...p0.class}'),
-        onClick$: _IMMUTABLE
-      }
-    }, 1, "cA_4"),
-    /* @__PURE__ */ _jsxQ("div", {
-      class: {
-        "transition-all absolute top-full left-0 p-1 mt-2 gap-1 bg-gray-800/50 backdrop-blur-xl flex flex-col rounded-lg border border-gray-700 z-[1000] max-h-72 overflow-scroll select-none": true,
-        "pointer-events-none opacity-0 scale-95": !store.opened
-      }
-    }, {
-      id: _fnSignal((p0) => `lui-${p0.id}-opts`, [
-        props
-      ], "`lui-${p0.id}-opts`")
-    }, props.values.map((value, i) => {
-      return /* @__PURE__ */ _jsxC(Button, {
-        onClick$: /* @__PURE__ */ inlinedQrl(() => {
-          const [props2, store2, value2] = useLexicalScope();
-          store2.opened = false;
-          const select = document.getElementById(props2.id);
-          select.value = value2.value.toString();
-          const name = document.getElementById(`lui-${props2.id}-name`);
-          name.textContent = value2.name;
-          select.dispatchEvent(new Event("change"));
-        }, "SelectInputRaw_component_div_div_Button_onClick_mLa0FdeKCLw", [
-          props,
-          store,
-          value
-        ]),
-        get class() {
-          return {
-            "border-0 bg-transparent": true,
-            "opacity-0": !store.opened
-          };
-        },
-        children: _wrapSignal(value, "name"),
-        [_IMMUTABLE]: {
-          class: _fnSignal((p0) => ({
-            "border-0 bg-transparent": true,
-            "opacity-0": !p0.opened
-          }), [
-            store
-          ], '{"border-0 bg-transparent":true,"opacity-0":!p0.opened}')
-        }
-      }, 1, i);
-    }), 1, null)
-  ], 1, "cA_5");
-}, "SelectInputRaw_component_Itdx5yPeQd4"));
-const TextArea = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxQ("div", null, {
-    class: "flex flex-col"
-  }, [
-    /* @__PURE__ */ _jsxQ("label", null, {
-      class: "pb-2",
-      for: _fnSignal((p0) => p0.id, [
-        props
-      ], "p0.id")
-    }, /* @__PURE__ */ _jsxC(Slot, null, 3, "UP_0"), 1, null),
-    /* @__PURE__ */ _jsxC(TextAreaRaw, {
-      ...props
-    }, 0, "UP_1")
-  ], 1, "UP_2");
-}, "TextArea_component_rWDoQFL2c0g"));
-const TextAreaRaw = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  const props1 = _restProps(props, [
-    "output"
-  ]);
-  return /* @__PURE__ */ _jsxC(Fragment, {
-    children: /* @__PURE__ */ _jsxS("textarea", {
-      ...props1,
-      class: {
-        [InputClasses]: true,
-        "h-32": true,
-        "cursor-pointer active:bg-gray-600": props.output,
-        ...props1.class
-      },
-      onClick$: props.output ? /* @__PURE__ */ inlinedQrl((event, element) => {
-        navigator.clipboard.writeText(element.value);
-        const notification = document.createElement("div");
-        notification.className = "fixed bottom-0 right-0 px-6 py-4 m-6 bg-green-600/50 border border-green-500 text-gray-50 rounded-md shadow-lg whitespace-nowrap backdrop-blur-xl";
-        notification.innerText = "Copied to clipboard!";
-        document.body.appendChild(notification);
-        setTimeout(() => {
-          notification.remove();
-        }, 1e3);
-      }, "TextAreaRaw_component__Fragment_textarea_onClick_YAQUkxxJ6Sg") : void 0
-    }, {
-      readOnly: _fnSignal((p0) => p0.output, [
-        props
-      ], "p0.output")
-    }, 0, null)
-  }, 1, "UP_3");
-}, "TextAreaRaw_component_PZiPScYxgNk"));
-const Toggle = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  const props1 = _restProps(props, [
-    "center",
-    "label"
-  ]);
-  return /* @__PURE__ */ _jsxQ("div", null, {
-    class: _fnSignal((p0) => ({
-      "flex gap-3 items-center": true,
-      "justify-center": p0.center
-    }), [
-      props
-    ], '{"flex gap-3 items-center":true,"justify-center":p0.center}')
-  }, [
-    /* @__PURE__ */ _jsxQ("label", null, {
-      class: "inline-flex relative items-center cursor-pointer"
-    }, [
-      /* @__PURE__ */ _jsxS("input", {
-        ...props1,
-        class: {
-          "sr-only peer": true,
-          ...props1.class
-        }
-      }, {
-        type: "checkbox"
-      }, 0, null),
-      /* @__PURE__ */ _jsxQ("div", null, {
-        class: {
-          "transition ease-in-out w-12 h-7 rounded-md peer border hover:shadow-lg": true,
-          "bg-gray-800 border-gray-700 hover:bg-gray-700 active:bg-gray-600": true,
-          "after:content-[''] after:absolute after:top-[4px] after:left-[4px] after:border after:rounded-md after:h-5 after:w-5 after:transition-all after:ease-in-out": true,
-          "after:bg-gray-700 after:border-gray-600 after:hover:bg-gray-600 after:active:bg-gray-500": true,
-          "peer-checked:bg-blue-700 peer-checked:border-blue-600 peer-checked:hover:bg-blue-600 peer-checked:active:bg-blue-500": true,
-          "peer-checked:after:translate-x-full peer-checked:after:bg-blue-600 peer-checked:after:border-blue-500 peer-checked:after:hover:bg-blue-500 peer-checked:after:active:bg-blue-400": true
-        }
-      }, null, 3, null)
-    ], 1, null),
-    props.label && /* @__PURE__ */ _jsxQ("label", {
-      for: _wrapSignal(props1, "id")
-    }, {
-      class: "text-gray-100"
-    }, _fnSignal((p0) => p0.label, [
-      props
-    ], "p0.label"), 3, "yu_0")
-  ], 1, "yu_1");
-}, "Toggle_component_ujuOvR082hY"));
-const LogoBirdflop = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  const props1 = _restProps(props, [
-    "confused",
-    "fillGradient"
-  ]);
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props1,
-    children: [
-      /* @__PURE__ */ _jsxQ("defs", null, null, [
-        props.fillGradient && /* @__PURE__ */ _jsxQ("linearGradient", null, {
-          gradientUnits: "objectBoundingBox",
-          id: "linear-gradient",
-          x1: "0.5",
-          x2: "0.5",
-          y2: "1"
-        }, props.fillGradient.map((color, i) => /* @__PURE__ */ _jsxQ("stop", {
-          offset: i / (props.fillGradient.length - 1),
-          "stop-color": color
-        }, null, null, 3, i)), 1, "Ie_0"),
-        /* @__PURE__ */ _jsxQ("clipPath", null, {
-          id: "clip-bf_3"
-        }, /* @__PURE__ */ _jsxQ("rect", null, {
-          height: "1080",
-          width: "1080"
-        }, null, 3, null), 3, null)
-      ], 1, null),
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "clip-path": "url(#clip-bf_3)",
-        "data-name": "bf - 3",
-        fill: "currentColor",
-        id: "bf_3"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M-1886.608-89.36c-8.311-65.774-27.64-219.008-27.64-221.333a.279.279,0,0,1,.09-.159q-.474-4.88-.477-9.885A101.066,101.066,0,0,1-1813.61-421.844a100.671,100.671,0,0,1,71.913,30.1l.093-.042c-.077-.093-8.783-10.549-22.7-24.758-8.216-8.388-16.645-16.459-25.052-23.993-10.51-9.417-21.018-18.013-31.23-25.552a120.5,120.5,0,0,0-40.468-71.567,119.916,119.916,0,0,0-77.984-28.881c-66.215,0-120.083,53.941-120.083,120.244h-.237v116.01h-.24c-.131,132.971-107.6,240.728-240.16,240.728V-330.289H-2300V-449.818h.362V-931.536h0V-1170c132.71,0,240.293,106.764,240.293,238.464v145.112a358.089,358.089,0,0,1,47.7-13.28,362.475,362.475,0,0,1,72.6-7.329,362.455,362.455,0,0,1,72.6,7.329,358.112,358.112,0,0,1,67.622,21.02,360.042,360.042,0,0,1,61.191,33.26,362.833,362.833,0,0,1,53.315,44.049,363.178,363.178,0,0,1,43.99,53.387,360.83,360.83,0,0,1,33.213,61.276A359.3,359.3,0,0,1-1586.118-519a363.948,363.948,0,0,1,7.317,72.7,363.957,363.957,0,0,1-7.317,72.7,359.333,359.333,0,0,1-20.992,67.714,360.95,360.95,0,0,1-33.213,61.277,363.233,363.233,0,0,1-43.99,53.388,362.833,362.833,0,0,1-53.315,44.049,360.017,360.017,0,0,1-61.191,33.259,358.108,358.108,0,0,1-67.622,21.02c-6.636,1.36-13.421,2.548-20.165,3.532Zm-79.831-365.056a27.049,27.049,0,0,1,27.038-27.059,27.048,27.048,0,0,1,27.037,27.059,27.049,27.049,0,0,1-27.037,27.06A27.05,27.05,0,0,1-1966.439-454.416Z",
-        "data-name": "Union 26",
-        fill: _fnSignal((p0) => p0.fillGradient ? "url(#linear-gradient)" : "", [
-          props
-        ], 'p0.fillGradient?"url(#linear-gradient)":""'),
-        id: "Union_26",
-        transform: "translate(2479.9 1169.7)"
-      }, null, 3, null), 3, null),
-      props.confused && /* @__PURE__ */ _jsxQ("g", null, {
-        fill: "#1E2837",
-        stroke: "#1E2837",
-        style: "transform: translate(595px, 460px) scale(0.375)"
-      }, [
-        /* @__PURE__ */ _jsxQ("path", null, {
-          d: "M160 164s1.44-33 33.54-59.46C212.6 88.83 235.49 84.28 256 84c18.73-.23 35.47 2.94 45.48 7.82C318.59 100.2 352 120.6 352 164c0 45.67-29.18 66.37-62.35 89.18S248 298.36 248 324",
-          fill: "none",
-          "stroke-linecap": "round",
-          "stroke-miterlimit": "10",
-          "stroke-width": "80"
-        }, null, 3, null),
-        /* @__PURE__ */ _jsxQ("circle", null, {
-          cx: "248",
-          cy: "399.99",
-          r: "40",
-          style: "transform: translate(0, 30px)"
-        }, null, 3, null)
-      ], 3, "Ie_1")
-    ],
-    height: _wrapSignal(props1, "width")
-  }, {
-    viewBox: "0 0 1080 1080",
-    xmlns: "http://www.w3.org/2000/svg",
-    "xmlns:xlink": "http://www.w3.org/1999/xlink"
-  }, 0, "Ie_2");
-}, "LogoBirdflop_component_mKG3xZaEE5w"));
-const LogoDiscord = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: /* @__PURE__ */ _jsxQ("path", null, {
-      d: "M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z"
-    }, null, 3, null)
-  }, {
-    fill: "currentColor",
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    viewBox: "0 0 127.14 96.36",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, 0, "V4_0");
-}, "LogoDiscord_component_pyJvo9cIDdU"));
-const LogoFabric = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: [
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M0 0h24v24H0z",
-        fill: "none"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "m820 761-85.6-87.6c-4.6-4.7-10.4-9.6-25.9 1-19.9 13.6-8.4 21.9-5.2 25.4 8.2 9 84.1 89 97.2 104 2.5 2.8-20.3-22.5-6.5-39.7 5.4-7 18-12 26-3 6.5 7.3 10.7 18-3.4 29.7-24.7 20.4-102 82.4-127 103-12.5 10.3-28.5 2.3-35.8-6-7.5-8.9-30.6-34.6-51.3-58.2-5.5-6.3-4.1-19.6 2.3-25 35-30.3 91.9-73.8 111.9-90.8",
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-width": "23",
-        transform: "matrix(.08671 0 0 .0867 -49.8 -56)"
-      }, null, 3, null)
-    ]
-  }, {
-    "clip-rule": "evenodd",
-    "fill-rule": "evenodd",
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    "stroke-linecap": "round",
-    "stroke-linejoin": "round",
-    viewBox: "0 0 24 24",
-    "xml:space": "preserve",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, 0, "W4_0");
-}, "LogoFabric_component_bOPyyyFEHuI"));
-const LogoForge = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: [
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M0 0h24v24H0z",
-        fill: "none"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M2 7.5h8v-2h12v2s-7 3.4-7 6 3.1 3.1 3.1 3.1l.9 3.9H5l1-4.1s3.8.1 4-2.9c.2-2.7-6.5-.7-8-6Z",
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-width": "2"
-      }, null, 3, null)
-    ]
-  }, {
-    "clip-rule": "evenodd",
-    "fill-rule": "evenodd",
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    "stroke-linecap": "round",
-    "stroke-linejoin": "round",
-    "stroke-miterlimit": "1.5",
-    viewBox: "0 0 24 24",
-    "xml:space": "preserve"
-  }, 0, "6E_0");
-}, "LogoForge_component_mRpm0rEP3vY"));
-const LogoLuminescent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: /* @__PURE__ */ _jsxQ("g", null, {
-      "fill-opacity": "1"
-    }, /* @__PURE__ */ _jsxQ("g", null, {
-      transform: "translate(86.97656, 254.624983)"
-    }, /* @__PURE__ */ _jsxQ("path", null, {
-      d: "M 119.476562 -167.570312 C 90.671875 -133.253906 37.820312 -144.527344 30.308594 -109.710938 C 26.550781 -92.175781 39.074219 -75.644531 62.367188 -76.394531 C 67.878906 -77.398438 69.882812 -87.917969 66.628906 -90.671875 C 56.859375 -92.675781 55.855469 -99.691406 57.609375 -107.453125 C 62.117188 -125.988281 93.929688 -123.734375 113.96875 -147.28125 C 103.949219 -115.21875 96.933594 -78.902344 83.910156 -43.582031 C 59.363281 -58.863281 23.796875 -50.847656 21.542969 -27.050781 C 19.285156 -8.765625 32.8125 3.257812 55.355469 2.253906 C 72.386719 1.753906 80.902344 -4.007812 89.921875 -12.023438 C 112.464844 15.277344 138.261719 52.097656 181.347656 37.570312 C 188.609375 30.558594 183.347656 14.777344 177.085938 15.277344 C 147.28125 25.546875 132 1.253906 104.699219 -28.054688 C 119.476562 -56.105469 134.003906 -124.738281 148.53125 -167.320312 C 147.53125 -173.582031 124.488281 -177.339844 119.476562 -167.570312 Z M 46.339844 -28.804688 C 50.347656 -38.324219 68.128906 -36.570312 77.148438 -27.550781 C 72.890625 -20.789062 66.628906 -15.027344 57.359375 -15.027344 C 46.085938 -15.027344 43.332031 -22.792969 46.339844 -28.804688 Z M 46.339844 -28.804688 "
-    }, null, 3, null), 3, null), 3, null)
-  }, {
-    fill: "currentColor",
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    preserveAspectRatio: "xMidYMid meet",
-    version: "1.0",
-    viewBox: "80 80 220 220",
-    xmlns: "http://www.w3.org/2000/svg",
-    "xmlns:xlink": "http://www.w3.org/1999/xlink",
-    zoomAndPan: "magnify"
-  }, 0, "Jv_0");
-}, "LogoLuminescent_component_2ppcIednMJs"));
-const LogoLuminescentFull = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: [
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "fill-opacity": "1"
-      }, /* @__PURE__ */ _jsxQ("g", null, {
-        transform: "translate(12.743357, 223.612604)"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M 110.792969 -155.390625 C 84.082031 -123.570312 35.074219 -134.023438 28.105469 -101.734375 C 24.621094 -85.476562 36.234375 -70.148438 57.835938 -70.84375 C 62.945312 -71.773438 64.804688 -81.527344 61.785156 -84.082031 C 52.726562 -85.941406 51.796875 -92.445312 53.421875 -99.644531 C 57.605469 -116.832031 87.101562 -114.742188 105.683594 -136.578125 C 96.394531 -106.84375 89.890625 -73.167969 77.8125 -40.414062 C 55.046875 -54.585938 22.066406 -47.152344 19.976562 -25.085938 C 17.886719 -8.128906 30.429688 3.019531 51.332031 2.089844 C 67.128906 1.625 75.023438 -3.714844 83.386719 -11.148438 C 104.289062 14.167969 128.214844 48.3125 168.164062 34.839844 C 174.902344 28.335938 170.023438 13.703125 164.21875 14.167969 C 136.578125 23.691406 122.40625 1.160156 97.089844 -26.015625 C 110.792969 -52.027344 124.265625 -115.671875 137.738281 -155.160156 C 136.808594 -160.964844 115.441406 -164.449219 110.792969 -155.390625 Z M 42.96875 -26.710938 C 46.6875 -35.539062 63.179688 -33.910156 71.539062 -25.550781 C 67.589844 -19.277344 61.785156 -13.9375 53.191406 -13.9375 C 42.738281 -13.9375 40.183594 -21.136719 42.96875 -26.710938 Z M 42.96875 -26.710938 "
-      }, null, 3, null), 3, null), 3, null),
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "fill-opacity": "1"
-      }, /* @__PURE__ */ _jsxQ("g", null, {
-        transform: "translate(151.868279, 223.612604)"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M 72.003906 -95.464844 C 67.589844 -79.902344 62.945312 -62.945312 58.066406 -48.3125 C 51.101562 -28.570312 36.46875 -14.867188 27.410156 -14.867188 C 18.8125 -14.867188 21.136719 -26.945312 24.390625 -40.183594 C 28.570312 -58.765625 34.609375 -79.4375 37.859375 -92.445312 C 37.859375 -98.714844 16.492188 -100.804688 13.703125 -95 C 8.363281 -74.328125 0.230469 -51.566406 -3.949219 -28.335938 C -6.96875 -12.078125 -2.324219 1.859375 16.027344 2.089844 C 31.589844 2.554688 46.222656 -5.109375 59.695312 -27.410156 C 56.210938 -13.472656 61.085938 1.160156 73.863281 1.160156 C 98.019531 1.394531 115.207031 -30.890625 123.105469 -46.6875 C 124.5 -49.472656 116.367188 -54.351562 114.976562 -51.332031 C 106.613281 -31.820312 92.675781 -14.632812 83.851562 -14.867188 C 72.003906 -14.867188 90.121094 -70.609375 96.160156 -92.210938 C 94.535156 -98.949219 74.792969 -100.574219 72.003906 -95.464844 Z M 72.003906 -95.464844 "
-      }, null, 3, null), 3, null), 3, null),
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "fill-opacity": "1"
-      }, /* @__PURE__ */ _jsxQ("g", null, {
-        transform: "translate(265.444396, 223.612604)"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M 123.570312 2.089844 C 146.101562 1.394531 163.054688 -26.246094 172.578125 -46.6875 C 173.972656 -49.472656 165.609375 -54.121094 164.449219 -51.332031 C 156.085938 -31.589844 141.6875 -14.167969 132.859375 -14.167969 C 120.78125 -13.9375 136.34375 -51.796875 140.292969 -68.519531 C 144.707031 -87.566406 139.828125 -98.949219 122.175781 -98.949219 C 107.078125 -99.179688 94.304688 -87.101562 85.476562 -75.722656 C 88.03125 -89.65625 81.527344 -98.949219 69.21875 -98.949219 C 55.28125 -99.179688 40.648438 -85.476562 32.519531 -74.09375 L 37.628906 -92.445312 C 36.46875 -99.179688 17.1875 -101.039062 13.472656 -95.929688 C 4.414062 -61.785156 -2.789062 -36.003906 -10.917969 -5.109375 C -11.847656 3.019531 12.773438 2.789062 14.867188 -2.554688 C 19.046875 -20.671875 22.761719 -36.46875 28.105469 -54.351562 C 36.003906 -68.054688 47.382812 -79.902344 54.585938 -79.902344 C 61.320312 -80.132812 60.855469 -72.46875 59.230469 -66.429688 C 53.191406 -42.042969 48.546875 -23.226562 43.898438 -3.714844 C 44.828125 3.019531 66.894531 2.324219 69.449219 -2.789062 C 72.933594 -16.027344 77.8125 -38.558594 81.992188 -53.65625 C 87.101562 -66.199219 100.804688 -80.132812 108.9375 -80.367188 C 116.367188 -80.367188 114.976562 -72.238281 113.347656 -65.5 C 110.328125 -53.191406 104.753906 -32.984375 103.128906 -23.691406 C 100.109375 -7.898438 105.453125 2.789062 123.570312 2.089844 Z M 123.570312 2.089844 "
-      }, null, 3, null), 3, null), 3, null),
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "fill-opacity": "1"
-      }, /* @__PURE__ */ _jsxQ("g", null, {
-        transform: "translate(428.260051, 223.612604)"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M 32.285156 -112.421875 C 41.578125 -112.421875 48.082031 -118.226562 49.007812 -126.589844 C 50.171875 -134.71875 45.0625 -140.523438 36.699219 -140.523438 C 28.105469 -140.757812 21.601562 -134.949219 20.207031 -126.589844 C 19.046875 -118.460938 24.621094 -112.421875 32.285156 -112.421875 Z M 14.632812 2.089844 C 38.789062 1.625 56.210938 -25.550781 65.964844 -46.453125 C 67.359375 -49.472656 59.230469 -54.351562 57.835938 -51.332031 C 49.9375 -32.285156 34.609375 -14.167969 23.925781 -14.167969 C 19.046875 -13.9375 19.277344 -20.207031 21.136719 -29.5 C 24.621094 -45.292969 29.5 -60.390625 38.558594 -92.675781 C 36.929688 -98.25 17.886719 -101.039062 14.167969 -95.695312 C 6.039062 -67.589844 0.464844 -48.777344 -4.644531 -26.945312 C -8.828125 -9.058594 -4.644531 2.554688 14.632812 2.089844 Z M 14.632812 2.089844 "
-      }, null, 3, null), 3, null), 3, null),
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "fill-opacity": "1"
-      }, /* @__PURE__ */ _jsxQ("g", null, {
-        transform: "translate(484.467457, 223.612604)"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M 72.238281 -98.949219 C 56.90625 -99.179688 41.113281 -84.082031 32.75 -74.328125 C 34.839844 -81.0625 35.769531 -85.011719 37.859375 -92.445312 C 35.539062 -99.644531 17.421875 -100.804688 13.703125 -95.695312 C 4.414062 -61.785156 -3.484375 -35.304688 -10.917969 -4.414062 C -10.453125 3.25 12.542969 2.554688 15.097656 -2.554688 C 19.976562 -23.460938 22.53125 -35.304688 29.035156 -57.140625 C 37.628906 -68.753906 49.9375 -79.667969 58.066406 -79.902344 C 65.964844 -80.132812 64.804688 -72.46875 63.179688 -65.5 C 61.085938 -55.976562 54.585938 -30.660156 53.191406 -22.761719 C 50.402344 -7.664062 55.746094 2.554688 73.398438 2.089844 C 95.929688 1.859375 113.347656 -26.480469 122.640625 -46.6875 C 123.800781 -49.472656 115.671875 -54.121094 114.511719 -51.332031 C 105.917969 -31.355469 92.210938 -14.167969 82.6875 -14.167969 C 76.882812 -14.167969 78.042969 -22.996094 79.902344 -31.589844 C 82.457031 -42.738281 87.335938 -55.746094 89.890625 -66.429688 C 94.304688 -85.246094 89.890625 -98.714844 72.238281 -98.949219 Z M 72.238281 -98.949219 "
-      }, null, 3, null), 3, null), 3, null),
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "fill-opacity": "1"
-      }, /* @__PURE__ */ _jsxQ("g", null, {
-        transform: "translate(597.346777, 223.612604)"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M 58.996094 -98.484375 C 31.820312 -99.414062 7.433594 -80.367188 1.160156 -49.9375 C -4.644531 -23.925781 7.898438 1.160156 43.203125 2.324219 C 65.269531 3.019531 93.140625 -4.644531 111.957031 -46.6875 C 113.117188 -49.472656 104.988281 -54.121094 103.59375 -51.332031 C 90.121094 -20.671875 65.5 -12.542969 49.707031 -14.167969 C 33.449219 -15.792969 24.851562 -25.316406 26.246094 -40.183594 C 53.191406 -33.910156 75.257812 -42.042969 83.851562 -59.460938 C 92.675781 -76.417969 85.011719 -97.554688 58.996094 -98.484375 Z M 55.976562 -81.992188 C 64.804688 -81.761719 65.035156 -73.398438 61.320312 -65.734375 C 56.675781 -55.511719 45.0625 -49.472656 27.871094 -52.027344 C 32.054688 -68.753906 45.0625 -82.6875 55.976562 -81.992188 Z M 55.976562 -81.992188 "
-      }, null, 3, null), 3, null), 3, null),
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "fill-opacity": "1"
-      }, /* @__PURE__ */ _jsxQ("g", null, {
-        transform: "translate(699.542059, 223.612604)"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M 35.074219 2.554688 C 49.007812 2.789062 62.015625 -2.789062 68.753906 -12.542969 C 84.316406 -12.078125 100.574219 -19.277344 113.117188 -46.6875 C 114.277344 -49.242188 106.148438 -54.121094 104.988281 -51.566406 C 95.929688 -30.429688 84.082031 -23.460938 73.628906 -22.996094 C 79.207031 -46.453125 65.734375 -63.179688 61.550781 -92.675781 C 73.398438 -108.238281 51.566406 -116.367188 35.304688 -101.039062 C 20.441406 -87.566406 7.433594 -65.035156 -2.324219 -43.433594 C -3.949219 -40.183594 4.414062 -36.003906 5.808594 -39.023438 C 15.097656 -58.300781 26.710938 -78.972656 38.558594 -90.820312 C 40.183594 -71.539062 50.402344 -52.261719 50.171875 -35.769531 C 43.433594 -35.769531 40.183594 -25.316406 46.222656 -19.742188 C 44.132812 -16.722656 39.71875 -14.167969 35.304688 -14.167969 C 27.640625 -14.167969 22.066406 -20.671875 23.691406 -30.660156 C 20.671875 -33.449219 10.683594 -31.820312 8.828125 -25.550781 C 7.664062 -7.199219 21.367188 2.554688 35.074219 2.554688 Z M 35.074219 2.554688 "
-      }, null, 3, null), 3, null), 3, null),
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "fill-opacity": "1"
-      }, /* @__PURE__ */ _jsxQ("g", null, {
-        transform: "translate(802.898632, 223.612604)"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M 57.835938 -98.714844 C 25.085938 -99.179688 0.929688 -70.378906 -0.695312 -41.578125 C -1.859375 -19.046875 13.472656 0.929688 37.628906 1.859375 C 62.015625 3.019531 88.496094 -5.574219 107.078125 -46.6875 C 108.238281 -49.242188 100.109375 -54.121094 98.949219 -51.332031 C 87.335938 -24.851562 68.054688 -13.703125 49.242188 -14.402344 C 33.910156 -14.867188 24.621094 -25.316406 26.015625 -41.578125 C 28.105469 -64.339844 43.203125 -83.617188 56.210938 -82.226562 C 65.734375 -81.296875 60.855469 -68.753906 55.511719 -62.015625 C 55.511719 -56.90625 72.933594 -55.511719 77.8125 -61.085938 C 90.585938 -74.558594 88.496094 -98.25 57.835938 -98.714844 Z M 57.835938 -98.714844 "
-      }, null, 3, null), 3, null), 3, null),
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "fill-opacity": "1"
-      }, /* @__PURE__ */ _jsxQ("g", null, {
-        transform: "translate(900.21642, 223.612604)"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M 58.996094 -98.484375 C 31.820312 -99.414062 7.433594 -80.367188 1.160156 -49.9375 C -4.644531 -23.925781 7.898438 1.160156 43.203125 2.324219 C 65.269531 3.019531 93.140625 -4.644531 111.957031 -46.6875 C 113.117188 -49.472656 104.988281 -54.121094 103.59375 -51.332031 C 90.121094 -20.671875 65.5 -12.542969 49.707031 -14.167969 C 33.449219 -15.792969 24.851562 -25.316406 26.246094 -40.183594 C 53.191406 -33.910156 75.257812 -42.042969 83.851562 -59.460938 C 92.675781 -76.417969 85.011719 -97.554688 58.996094 -98.484375 Z M 55.976562 -81.992188 C 64.804688 -81.761719 65.035156 -73.398438 61.320312 -65.734375 C 56.675781 -55.511719 45.0625 -49.472656 27.871094 -52.027344 C 32.054688 -68.753906 45.0625 -82.6875 55.976562 -81.992188 Z M 55.976562 -81.992188 "
-      }, null, 3, null), 3, null), 3, null),
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "fill-opacity": "1"
-      }, /* @__PURE__ */ _jsxQ("g", null, {
-        transform: "translate(1002.411702, 223.612604)"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M 72.238281 -98.949219 C 56.90625 -99.179688 41.113281 -84.082031 32.75 -74.328125 C 34.839844 -81.0625 35.769531 -85.011719 37.859375 -92.445312 C 35.539062 -99.644531 17.421875 -100.804688 13.703125 -95.695312 C 4.414062 -61.785156 -3.484375 -35.304688 -10.917969 -4.414062 C -10.453125 3.25 12.542969 2.554688 15.097656 -2.554688 C 19.976562 -23.460938 22.53125 -35.304688 29.035156 -57.140625 C 37.628906 -68.753906 49.9375 -79.667969 58.066406 -79.902344 C 65.964844 -80.132812 64.804688 -72.46875 63.179688 -65.5 C 61.085938 -55.976562 54.585938 -30.660156 53.191406 -22.761719 C 50.402344 -7.664062 55.746094 2.554688 73.398438 2.089844 C 95.929688 1.859375 113.347656 -26.480469 122.640625 -46.6875 C 123.800781 -49.472656 115.671875 -54.121094 114.511719 -51.332031 C 105.917969 -31.355469 92.210938 -14.167969 82.6875 -14.167969 C 76.882812 -14.167969 78.042969 -22.996094 79.902344 -31.589844 C 82.457031 -42.738281 87.335938 -55.746094 89.890625 -66.429688 C 94.304688 -85.246094 89.890625 -98.714844 72.238281 -98.949219 Z M 72.238281 -98.949219 "
-      }, null, 3, null), 3, null), 3, null),
-      /* @__PURE__ */ _jsxQ("g", null, {
-        "fill-opacity": "1"
-      }, /* @__PURE__ */ _jsxQ("g", null, {
-        transform: "translate(1115.290992, 223.612604)"
-      }, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M 28.570312 2.089844 C 51.796875 1.859375 68.753906 -17.421875 81.296875 -46.453125 C 82.457031 -49.472656 74.558594 -54.121094 73.167969 -51.332031 C 63.410156 -29.265625 46.917969 -13.9375 33.449219 -14.167969 C 22.066406 -14.402344 22.066406 -30.195312 26.945312 -51.566406 C 29.035156 -61.320312 32.519531 -73.628906 36.003906 -85.707031 L 57.835938 -85.707031 C 61.320312 -86.871094 64.105469 -97.785156 59.695312 -101.039062 L 40.183594 -101.039062 C 45.527344 -118.691406 50.867188 -135.183594 55.976562 -149.351562 C 55.746094 -156.085938 34.609375 -158.644531 31.355469 -153.996094 C 26.710938 -142.152344 19.511719 -120.550781 13.472656 -101.039062 L 4.179688 -101.039062 C 0.464844 -99.644531 -2.324219 -88.265625 2.324219 -85.707031 L 9.289062 -85.707031 C -1.394531 -45.0625 -12.078125 2.554688 28.570312 2.089844 Z M 28.570312 2.089844 "
-      }, null, 3, null), 3, null), 3, null)
-    ]
-  }, {
-    fill: "currentColor",
-    preserveAspectRatio: "xMidYMid meet",
-    version: "1.0",
-    viewBox: "30 60 1160 200",
-    xmlns: "http://www.w3.org/2000/svg",
-    "xmlns:xlink": "http://www.w3.org/1999/xlink",
-    zoomAndPan: "magnify"
-  }, 0, "Jv_1");
-}, "LogoLuminescentFull_component_UNzyq3QUKpA"));
-const LogoPaper = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: [
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M0 0h24v24H0z",
-        fill: "none"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "m12 18 6 2 3-17L2 14l6 2",
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-width": "2"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "m9 21-1-5 4 2-3 3Z",
-        stroke: "currentColor",
-        "stroke-width": "2"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "m12 18-4-2 10-9-6 11Z",
-        fill: "currentColor"
-      }, null, 3, null)
-    ]
-  }, {
-    "clip-rule": "evenodd",
-    "fill-rule": "evenodd",
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    "stroke-linecap": "round",
-    "stroke-linejoin": "round",
-    "stroke-miterlimit": "1.5",
-    viewBox: "0 0 24 24",
-    "xml:space": "preserve"
-  }, 0, "2r_0");
-}, "LogoPaper_component_pBDmaKNS7m4"));
-const LogoPterodactyl = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: /* @__PURE__ */ _jsxQ("g", null, {
-      fill: "currentColor",
-      stroke: "none",
-      transform: "translate(0,180) scale(0.100000,-0.100000)"
-    }, [
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M965 1489 c-86 -13 -231 -63 -305 -107 -70 -41 -175 -138 -204 -190 l-18 -34 53 32 c127 75 410 193 425 177 3 -3 -3 -18 -13 -34 l-18 -28 40 33 c39 32 136 99 205 140 l35 22 -70 -1 c-38 -1 -97 -5 -130 -10z"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M1149 1320 c-147 -23 -282 -103 -431 -254 -103 -104 -143 -125 -65 -34 48 56 188 261 182 266 -6 7 -191 -71 -265 -111 -245 -132 -410 -289 -502 -474 -27 -56 -48 -107 -46 -112 1 -5 41 20 88 56 120 93 200 146 200 133 0 -6 -46 -59 -103 -117 -56 -59 -95 -104 -87 -101 8 3 89 36 180 73 150 61 165 66 175 50 64 -109 121 -158 225 -194 103 -36 259 -47 366 -26 13 3 42 -11 80 -39 32 -24 78 -49 101 -55 27 -7 44 -19 48 -31 8 -27 41 -43 71 -36 28 7 32 26 5 26 -24 0 -44 24 -39 47 2 10 18 25 35 34 18 9 30 19 26 23 -13 13 -58 5 -79 -15 -15 -14 -29 -18 -48 -13 -29 7 -79 60 -73 78 2 6 29 20 60 31 31 11 57 23 57 27 0 13 -181 96 -248 114 l-64 18 6 40 c11 71 63 162 132 231 101 101 239 159 582 246 28 7 52 15 52 19 0 7 -209 64 -310 84 -99 19 -241 27 -311 16z m-819 -401 c-13 -22 -37 -35 -48 -24 -7 7 34 45 49 45 6 0 5 -9 -1 -21z"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M1224 496 c-14 -11 -16 -17 -7 -26 9 -10 17 -8 37 6 14 11 26 22 26 27 0 12 -35 8 -56 -7z"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M1012 441 c-19 -11 64 -51 106 -51 39 0 40 4 5 35 -29 25 -85 33 -111 16z"
-      }, null, 3, null)
-    ], 3, null)
-  }, {
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    preserveAspectRatio: "xMidYMid meet",
-    version: "1.0",
-    viewBox: "0 0 180 180",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, 0, "DN_0");
-}, "LogoPterodactyl_component_wVJW9cHcHoo"));
-const LogoPurpur = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: [
-      /* @__PURE__ */ _jsxQ("defs", null, null, /* @__PURE__ */ _jsxQ("path", null, {
-        d: "m264 41.95 8-4v8l-8 4v-8Z",
-        fill: "none",
-        id: "purpur",
-        stroke: "currentColor",
-        "stroke-width": "1.68"
-      }, null, 3, null), 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M0 0h24v24H0z",
-        fill: "none"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "m264 29.95-8 4 8 4.42 8-4.42-8-4Z",
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-width": "1.77",
-        transform: "matrix(1.125 0 0 1.1372 -285 -31.69)"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "m272 38.37-8 4.42-8-4.42",
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-width": "1.77",
-        transform: "matrix(1.125 0 0 1.1372 -285 -31.69)"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "m260 31.95 8 4.21V45",
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-width": "1.77",
-        transform: "matrix(1.125 0 0 1.1372 -285 -31.69)"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M260 45v-8.84l8-4.21",
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-width": "1.77",
-        transform: "matrix(1.125 0 0 1.1372 -285 -31.69)"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "m264 41.95 8-4v8l-8 4v-8Z",
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-width": "1.68",
-        transform: "matrix(1.125 0 0 1.2569 -285 -40.78)"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "m264 41.95 8-4v8l-8 4v-8Z",
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-width": "1.68",
-        transform: "matrix(-1.125 0 0 1.2569 309 -40.78)"
-      }, null, 3, null)
-    ]
-  }, {
-    "clip-rule": "evenodd",
-    "fill-rule": "evenodd",
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    "stroke-linecap": "round",
-    "stroke-linejoin": "round",
-    "stroke-miterlimit": "1.5",
-    viewBox: "0 0 24 24",
-    "xml:space": "preserve"
-  }, 0, "Xw_0");
-}, "LogoPurpur_component_sVHzeC1GCZ4"));
-const LogoVelocity = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: [
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M236.25 232.55l-54.08-73.79a11.86 11.86 0 00-11.91-4.62L84 171.57a11.88 11.88 0 00-8 5.88l-42.64 77.07a11.84 11.84 0 00.81 12.75l54.21 74a11.86 11.86 0 0011.91 4.62l86-17.37a11.85 11.85 0 008-5.89l42.78-77.3a11.86 11.86 0 00-.82-12.78zm-59.45 74.21a9.57 9.57 0 01-13.39-2.06l-31-42.24a16 16 0 00-16-6.21l-52.58 10.63a9.58 9.58 0 01-11.29-7.49A9.58 9.58 0 0160 248.1l57-11.52a16 16 0 0010.81-7.92L156.42 177a9.58 9.58 0 0113-3.75 9.58 9.58 0 013.75 13L146.81 234a16 16 0 001.09 17.16l31 42.23a9.58 9.58 0 01-2.1 13.37z"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("circle", null, {
-        cx: "416.44",
-        cy: "236.11",
-        r: "9.83"
-      }, null, 3, null),
-      /* @__PURE__ */ _jsxQ("path", null, {
-        d: "M458.29 265.6H280.52a9.83 9.83 0 110-19.66h106.22a9.84 9.84 0 000-19.67h-70.2a9.83 9.83 0 110-19.66H422.9a9.84 9.84 0 000-19.67H202.83l33.42 45.61a11.86 11.86 0 01.81 12.75l-42.78 77.3a11.75 11.75 0 01-1.4 2h212.29a9.83 9.83 0 100-19.66h-53.53a9.84 9.84 0 110-19.67h106.65a9.84 9.84 0 100-19.67z"
-      }, null, 3, null)
-    ]
-  }, {
-    fill: "currentColor",
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    viewBox: "0 0 500 500"
-  }, 0, "Ea_0");
-}, "LogoVelocity_component_SNoCdG0zr0s"));
-const LogoWaterfall = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("svg", {
-    ...props,
-    children: /* @__PURE__ */ _jsxQ("path", null, {
-      d: "M12 2.69l5.66 5.66a8 8 0 1 1-11.31 0z"
-    }, null, 3, null)
-  }, {
-    fill: "none",
-    height: _fnSignal((p0) => p0.width, [
-      props
-    ], "p0.width"),
-    stroke: "currentColor",
-    "stroke-linecap": "round",
-    "stroke-linejoin": "round",
-    "stroke-width": "2",
-    viewBox: "0 0 24 24"
-  }, 0, "Pt_0");
-}, "LogoWaterfall_component_1hFl8GlECLI"));
-export {
-  Anchor,
-  Button,
-  ButtonAnchor,
-  Card,
-  ColorInput,
-  Header,
-  InputClasses,
-  LoadingIcon,
-  LogoBirdflop,
-  LogoDiscord,
-  LogoFabric,
-  LogoForge,
-  LogoLuminescent,
-  LogoLuminescentFull,
-  LogoPaper,
-  LogoPterodactyl,
-  LogoPurpur,
-  LogoVelocity,
-  LogoWaterfall,
-  NumberInput,
-  NumberInputRaw,
-  SelectInput,
-  SelectInputRaw,
-  TextArea,
-  TextAreaRaw,
-  TextInput,
-  TextInputRaw,
-  Toggle,
-  blobClasses as _auto_blobClasses,
-  buttonClass as _auto_buttonClass,
-  buttonColorClasses,
-  cardColorClasses,
-  sizeClasses
-};