tgui-core 1.1.11 → 1.1.13

package/dist/components/Blink.js

@@ -0,0 +1,56 @@
+var n = Object.defineProperty;
+var a = (i, e, t) => e in i ? n(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t;
+var s = (i, e, t) => a(i, typeof e != "symbol" ? e + "" : e, t);
+import { jsx as l } from "react/jsx-runtime";
+import { Component as o } from "react";
+const h = 1e3, m = 1e3;
+class v extends o {
+  constructor(t) {
+    super(t);
+    s(this, "interval");
+    s(this, "timer");
+    this.state = {
+      hidden: !1
+    };
+  }
+  createTimer() {
+    const {
+      interval: t = h,
+      time: r = m
+    } = this.props;
+    clearInterval(this.interval), clearTimeout(this.timer), this.setState({
+      hidden: !1
+    }), this.interval = setInterval(() => {
+      this.setState({
+        hidden: !0
+      }), this.timer = setTimeout(() => {
+        this.setState({
+          hidden: !1
+        });
+      }, r);
+    }, t + r);
+  }
+  componentDidMount() {
+    this.createTimer();
+  }
+  componentDidUpdate(t) {
+    (t.interval !== this.props.interval || t.time !== this.props.time) && this.createTimer();
+  }
+  componentWillUnmount() {
+    clearInterval(this.interval), clearTimeout(this.timer);
+  }
+  render() {
+    return /* @__PURE__ */ l(
+      "span",
+      {
+        style: {
+          visibility: this.state.hidden ? "hidden" : "visible"
+        },
+        children: this.props.children
+      }
+    );
+  }
+}
+export {
+  v as Blink
+};

package/dist/components/BlockQuote.d.ts

@@ -0,0 +1,3 @@
+import { BoxProps } from './Box';
+
+export declare function BlockQuote(props: BoxProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/BlockQuote.js

@@ -0,0 +1,13 @@
+import { jsx as c } from "react/jsx-runtime";
+import { classes as e } from "../common/react.js";
+import { Box as r } from "./Box.js";
+import '../assets/BlockQuote.css';const l = "_blockQuote_14fvy_13", m = {
+  blockQuote: l
+};
+function f(o) {
+  const { className: t, ...s } = o;
+  return /* @__PURE__ */ c(r, { className: e([m.blockQuote, t]), ...s });
+}
+export {
+  f as BlockQuote
+};

package/dist/components/BodyZoneSelector.d.ts

@@ -0,0 +1,28 @@
+import { Component } from 'react';
+
+export declare enum BodyZone {
+    Chest = "chest",
+    Eyes = "eyes",
+    Groin = "groin",
+    Head = "head",
+    LeftArm = "l_arm",
+    LeftLeg = "l_leg",
+    Mouth = "mouth",
+    RightArm = "r_arm",
+    RightLeg = "r_leg"
+}
+type BodyZoneSelectorProps = {
+    onClick?: (zone: BodyZone) => void;
+    scale?: number;
+    selectedZone: BodyZone | null;
+    theme?: string;
+};
+type BodyZoneSelectorState = {
+    hoverZone: BodyZone | null;
+};
+export declare class BodyZoneSelector extends Component<BodyZoneSelectorProps, BodyZoneSelectorState> {
+    ref: import('react').RefObject<HTMLDivElement>;
+    state: BodyZoneSelectorState;
+    render(): import("react/jsx-runtime").JSX.Element;
+}
+export {};

package/dist/components/BodyZoneSelector.js

@@ -0,0 +1,115 @@
+var g = Object.defineProperty;
+var _ = (e, t, s) => t in e ? g(e, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : e[t] = s;
+var l = (e, t, s) => _(e, typeof t != "symbol" ? t + "" : t, s);
+import { jsxs as d, jsx as h } from "react/jsx-runtime";
+import { Component as v, createRef as $ } from "react";
+import { resolveAsset as p } from "../common/assets.js";
+import { Image as f } from "./Image.js";
+var b = /* @__PURE__ */ ((e) => (e.Chest = "chest", e.Eyes = "eyes", e.Groin = "groin", e.Head = "head", e.LeftArm = "l_arm", e.LeftLeg = "l_leg", e.Mouth = "mouth", e.RightArm = "r_arm", e.RightLeg = "r_leg", e))(b || {});
+const C = (e, t) => {
+  if (t < 1)
+    return null;
+  if (t < 10) {
+    if (e > 10 && e < 15)
+      return "r_leg";
+    if (e > 17 && e < 22)
+      return "l_leg";
+  } else if (t < 13) {
+    if (e > 8 && e < 11)
+      return "r_arm";
+    if (e > 12 && e < 20)
+      return "groin";
+    if (e > 21 && e < 24)
+      return "l_arm";
+  } else if (t < 22) {
+    if (e > 8 && e < 11)
+      return "r_arm";
+    if (e > 12 && e < 20)
+      return "chest";
+    if (e > 21 && e < 24)
+      return "l_arm";
+  } else if (t < 30 && e > 12 && e < 20)
+    return t > 23 && t < 24 && e > 15 && e < 17 ? "mouth" : t > 25 && t < 27 && e > 14 && e < 18 ? "eyes" : "head";
+  return null;
+};
+class A extends v {
+  constructor() {
+    super(...arguments);
+    l(this, "ref", $());
+    l(this, "state", {
+      hoverZone: null
+    });
+  }
+  render() {
+    const { hoverZone: s } = this.state, { scale: r = 3, selectedZone: n, theme: c = "midnight" } = this.props;
+    return /* @__PURE__ */ d(
+      "div",
+      {
+        ref: this.ref,
+        style: {
+          width: `${32 * r}px`,
+          height: `${32 * r}px`,
+          position: "relative"
+        },
+        children: [
+          /* @__PURE__ */ h(
+            f,
+            {
+              src: p(`body_zones.base_${c}.png`),
+              onClick: () => {
+                const i = this.props.onClick;
+                i && this.state.hoverZone && i(this.state.hoverZone);
+              },
+              onMouseMove: (i) => {
+                var u;
+                if (!this.props.onClick)
+                  return;
+                const o = (u = this.ref.current) == null ? void 0 : u.getBoundingClientRect();
+                if (!o)
+                  return;
+                const a = i.clientX - o.left, m = 32 * r - (i.clientY - o.top);
+                this.setState({
+                  hoverZone: C(a / r, m / r)
+                });
+              },
+              style: {
+                position: "absolute",
+                width: `${32 * r}px`,
+                height: `${32 * r}px`
+              }
+            }
+          ),
+          n && /* @__PURE__ */ h(
+            f,
+            {
+              src: p(`body_zones.${n}.png`),
+              style: {
+                pointerEvents: "none",
+                position: "absolute",
+                width: `${32 * r}px`,
+                height: `${32 * r}px`
+              }
+            }
+          ),
+          s && s !== n && /* @__PURE__ */ h(
+            f,
+            {
+              src: p(`body_zones.${s}.png`),
+              style: {
+                opacity: "0.5",
+                pointerEvents: "none",
+                position: "absolute",
+                width: `${32 * r}px`,
+                height: `${32 * r}px`
+              }
+            }
+          )
+        ]
+      }
+    );
+  }
+}
+export {
+  b as BodyZone,
+  A as BodyZoneSelector
+};

package/dist/components/Box.d.ts

@@ -0,0 +1,91 @@
+import { CSSProperties, KeyboardEventHandler, MouseEventHandler, ReactNode, UIEventHandler } from 'react';
+import { BooleanLike } from '../common/react';
+
+type BooleanProps = Partial<Record<keyof typeof booleanStyleMap, boolean>>;
+type StringProps = Partial<Record<keyof typeof stringStyleMap, string | BooleanLike>>;
+export type EventHandlers = Partial<{
+    onClick: MouseEventHandler<HTMLDivElement>;
+    onContextMenu: MouseEventHandler<HTMLDivElement>;
+    onDoubleClick: MouseEventHandler<HTMLDivElement>;
+    onKeyDown: KeyboardEventHandler<HTMLDivElement>;
+    onKeyUp: KeyboardEventHandler<HTMLDivElement>;
+    onMouseDown: MouseEventHandler<HTMLDivElement>;
+    onMouseMove: MouseEventHandler<HTMLDivElement>;
+    onMouseOver: MouseEventHandler<HTMLDivElement>;
+    onMouseUp: MouseEventHandler<HTMLDivElement>;
+    onScroll: UIEventHandler<HTMLDivElement>;
+}>;
+export type BoxProps = Partial<{
+    as: string;
+    children: ReactNode;
+    className: string | BooleanLike;
+    style: CSSProperties;
+}> & BooleanProps & StringProps & EventHandlers;
+type DangerDoNotUse = {
+    dangerouslySetInnerHTML?: {
+        __html: any;
+    };
+};
+/**
+ * Coverts our rem-like spacing unit into a CSS unit.
+ */
+export declare function unit(value: unknown): string | undefined;
+/**
+ * Same as `unit`, but half the size for integers numbers.
+ */
+export declare function halfUnit(value: unknown): string | undefined;
+declare const stringStyleMap: {
+    readonly align: (style: any, value: any) => void;
+    readonly bottom: (style: any, value: any) => void;
+    readonly fontFamily: (style: any, value: any) => void;
+    readonly fontSize: (style: any, value: any) => void;
+    readonly fontWeight: (style: any, value: any) => void;
+    readonly height: (style: any, value: any) => void;
+    readonly left: (style: any, value: any) => void;
+    readonly maxHeight: (style: any, value: any) => void;
+    readonly maxWidth: (style: any, value: any) => void;
+    readonly minHeight: (style: any, value: any) => void;
+    readonly minWidth: (style: any, value: any) => void;
+    readonly opacity: (style: any, value: any) => void;
+    readonly overflow: (style: any, value: any) => void;
+    readonly overflowX: (style: any, value: any) => void;
+    readonly overflowY: (style: any, value: any) => void;
+    readonly position: (style: any, value: any) => void;
+    readonly right: (style: any, value: any) => void;
+    readonly textAlign: (style: any, value: any) => void;
+    readonly top: (style: any, value: any) => void;
+    readonly verticalAlign: (style: any, value: any) => void;
+    readonly width: (style: any, value: any) => void;
+    readonly lineHeight: (style: any, value: any) => void;
+    readonly m: (style: any, value: any) => void;
+    readonly mb: (style: any, value: any) => void;
+    readonly ml: (style: any, value: any) => void;
+    readonly mr: (style: any, value: any) => void;
+    readonly mt: (style: any, value: any) => void;
+    readonly mx: (style: any, value: any) => void;
+    readonly my: (style: any, value: any) => void;
+    readonly p: (style: any, value: any) => void;
+    readonly pb: (style: any, value: any) => void;
+    readonly pl: (style: any, value: any) => void;
+    readonly pr: (style: any, value: any) => void;
+    readonly pt: (style: any, value: any) => void;
+    readonly px: (style: any, value: any) => void;
+    readonly py: (style: any, value: any) => void;
+    readonly color: (style: any, value: any) => void;
+    readonly textColor: (style: any, value: any) => void;
+    readonly backgroundColor: (style: any, value: any) => void;
+};
+declare const booleanStyleMap: {
+    readonly bold: (style: any, value: any) => void;
+    readonly fillPositionedParent: (style: any, value: any) => void;
+    readonly inline: (style: any, value: any) => void;
+    readonly italic: (style: any, value: any) => void;
+    readonly nowrap: (style: any, value: any) => void;
+    readonly preserveWhitespace: (style: any, value: any) => void;
+};
+export declare function computeBoxProps(props: any): Record<string, any>;
+export declare function computeBoxClassName(props: BoxProps): string;
+export declare function Box(props: BoxProps & DangerDoNotUse): import('react').ReactElement<{
+    className: string;
+}, string | import('react').JSXElementConstructor<any>>;
+export {};

package/dist/components/Box.js

@@ -0,0 +1,133 @@
+import { createElement as y } from "react";
+import { CSS_COLORS as b } from "../common/constants.js";
+import { classes as u } from "../common/react.js";
+function p(o) {
+  if (typeof o == "string")
+    return o.endsWith("px") ? parseFloat(o) / 12 + "rem" : o;
+  if (typeof o == "number")
+    return o + "rem";
+}
+function r(o) {
+  if (typeof o == "string")
+    return p(o);
+  if (typeof o == "number")
+    return p(o * 0.5);
+}
+function x(o) {
+  return !a(o);
+}
+function a(o) {
+  return typeof o == "string" && b.includes(o);
+}
+const m = (o) => (t, i) => {
+  (typeof i == "number" || typeof i == "string") && (t[o] = i);
+}, n = (o, t) => (i, e) => {
+  (typeof e == "number" || typeof e == "string") && (i[o] = t(e));
+}, l = (o, t) => (i, e) => {
+  e && (i[o] = t);
+}, g = (o, t, i) => (e, f) => {
+  if (typeof f == "number" || typeof f == "string")
+    for (let c = 0; c < i.length; c++)
+      e[o + "-" + i[c]] = t(f);
+}, s = (o) => (t, i) => {
+  x(i) && (t[o] = i);
+}, C = {
+  align: m("textAlign"),
+  bottom: n("bottom", p),
+  fontFamily: m("fontFamily"),
+  fontSize: n("fontSize", p),
+  fontWeight: m("fontWeight"),
+  height: n("height", p),
+  left: n("left", p),
+  maxHeight: n("maxHeight", p),
+  maxWidth: n("maxWidth", p),
+  minHeight: n("minHeight", p),
+  minWidth: n("minWidth", p),
+  opacity: m("opacity"),
+  overflow: m("overflow"),
+  overflowX: m("overflowX"),
+  overflowY: m("overflowY"),
+  position: m("position"),
+  right: n("right", p),
+  textAlign: m("textAlign"),
+  top: n("top", p),
+  verticalAlign: m("verticalAlign"),
+  width: n("width", p),
+  lineHeight: (o, t) => {
+    typeof t == "number" ? o.lineHeight = t : typeof t == "string" && (o.lineHeight = p(t));
+  },
+  // Margin
+  m: g("margin", r, [
+    "Top",
+    "Bottom",
+    "Left",
+    "Right"
+  ]),
+  mb: n("marginBottom", r),
+  ml: n("marginLeft", r),
+  mr: n("marginRight", r),
+  mt: n("marginTop", r),
+  mx: g("margin", r, ["Left", "Right"]),
+  my: g("margin", r, ["Top", "Bottom"]),
+  // Padding
+  p: g("padding", r, [
+    "Top",
+    "Bottom",
+    "Left",
+    "Right"
+  ]),
+  pb: n("paddingBottom", r),
+  pl: n("paddingLeft", r),
+  pr: n("paddingRight", r),
+  pt: n("paddingTop", r),
+  px: g("padding", r, ["Left", "Right"]),
+  py: g("padding", r, ["Top", "Bottom"]),
+  // Color props
+  color: s("color"),
+  textColor: s("color"),
+  backgroundColor: s("backgroundColor")
+}, w = {
+  bold: l("fontWeight", "bold"),
+  fillPositionedParent: (o, t) => {
+    t && (o.position = "absolute", o.top = 0, o.bottom = 0, o.left = 0, o.right = 0);
+  },
+  inline: l("display", "inline-block"),
+  italic: l("fontStyle", "italic"),
+  nowrap: l("whiteSpace", "nowrap"),
+  preserveWhitespace: l("whiteSpace", "pre-wrap")
+};
+function S(o) {
+  const t = {}, i = {};
+  for (const e of Object.keys(o)) {
+    if (e === "style")
+      continue;
+    const f = o[e], c = C[e] || w[e];
+    c ? c(i, f) : t[e] = f;
+  }
+  return t.style = { ...i, ...o.style }, t;
+}
+function d(o) {
+  const t = o.textColor || o.color, i = o.backgroundColor;
+  return u([
+    a(t) && "color-" + t,
+    a(i) && "color-bg-" + i
+  ]);
+}
+function W(o) {
+  const { as: t = "div", className: i, children: e, ...f } = o, c = i ? `${i} ${d(f)}` : d(f), h = S(f);
+  return y(
+    typeof t == "string" ? t : "div",
+    {
+      ...h,
+      className: c
+    },
+    e
+  );
+}
+export {
+  W as Box,
+  d as computeBoxClassName,
+  S as computeBoxProps,
+  r as halfUnit,
+  p as unit
+};

package/dist/components/Button.d.ts

@@ -0,0 +1,93 @@
+import { Placement } from '@popperjs/core';
+import { ReactNode } from 'react';
+import { BooleanLike } from '../common/react';
+import { BoxProps } from './Box';
+
+/**
+ * Getting ellipses to work requires that you use:
+ * 1. A string rather than a node
+ * 2. A fixed width here or in a parent
+ * 3. Children prop rather than content
+ */
+type EllipsisUnion = {
+    children: string;
+    /** @deprecated use children instead */
+    content?: never;
+    /** Cuts off text with an ellipsis */
+    ellipsis: true;
+} | Partial<{
+    children: ReactNode;
+    /** @deprecated use children instead */
+    content: ReactNode;
+    ellipsis: undefined;
+}>;
+type Props = Partial<{
+    /** Captures keyboard events */
+    captureKeys: boolean;
+    /** Makes the button circular */
+    circular: boolean;
+    /** Reduces the padding of the button */
+    compact: boolean;
+    /** Disables and greys out the button */
+    disabled: BooleanLike;
+    /** Fill all available horizontal space */
+    fluid: boolean;
+    /** Adds an icon to the button */
+    icon: string | false;
+    /** Icon color */
+    iconColor: string;
+    /** Icon position */
+    iconPosition: string;
+    /** Icon rotation */
+    iconRotation: number;
+    /** Makes the icon spin */
+    iconSpin: BooleanLike;
+    /** Called when element is clicked */
+    onClick: (e: any) => void;
+    /** Activates the button (gives it a green color) */
+    selected: BooleanLike;
+    /** A fancy, boxy tooltip, which appears when hovering over the button */
+    tooltip: ReactNode;
+    /** Position of the tooltip. See [`Popper`](#Popper) for valid options. */
+    tooltipPosition: Placement;
+    /** Align content vertically using flex. Use lineHeight if the height is static. */
+    verticalAlignContent: string;
+}> & EllipsisUnion & BoxProps;
+/** Clickable button. Comes with variants. Read more in the documentation. */
+export declare function Button(props: Props): import("react/jsx-runtime").JSX.Element;
+export declare namespace Button {
+    var Checkbox: typeof ButtonCheckbox;
+    var Confirm: typeof ButtonConfirm;
+    var Input: typeof ButtonInput;
+    var File: typeof ButtonFile;
+}
+type CheckProps = Partial<{
+    checked: BooleanLike;
+}> & Props;
+/** Visually toggles between checked and unchecked states. */
+export declare function ButtonCheckbox(props: CheckProps): import("react/jsx-runtime").JSX.Element;
+type ConfirmProps = Partial<{
+    confirmColor: string;
+    confirmContent: ReactNode;
+    confirmIcon: string;
+}> & Props;
+/**  Requires user confirmation before triggering its action. */
+declare function ButtonConfirm(props: ConfirmProps): import("react/jsx-runtime").JSX.Element;
+type InputProps = Partial<{
+    currentValue: string;
+    defaultValue: string;
+    fluid: boolean;
+    maxLength: number;
+    onCommit: (e: any, value: string) => void;
+    placeholder: string;
+}> & Props;
+/** Accepts and handles user input. */
+declare function ButtonInput(props: InputProps): import("react/jsx-runtime").JSX.Element;
+type FileProps = {
+    accept: string;
+    multiple?: boolean;
+    onSelectFiles: (files: string | string[]) => void;
+} & Props;
+/**  Accepts file input */
+declare function ButtonFile(props: FileProps): import("react/jsx-runtime").JSX.Element;
+export {};