tgui-core 1.1.21 → 1.1.23

package/README.md

@@ -39,3 +39,16 @@ MIT
 ## Contributing
 
 Contributions are welcome. Please open an issue or a pull request. I am available on the tgstation [discord](https://discord.com/invite/EUvpBtU78X).
+
+### Releasing a new version
+
+To automagically release a new version of the tgui-core package, simply create a [new release](https://github.com/tgstation/tgui-core/releases/new) with the tag set to the new version you want to publish. Set the tag to be the commit you want to base the version off of (likely the latest, being the default).
+
+The release workflow will take care of setting the `package.json` version, building, generating a release changelog, and publishing to npm.
+
+### Development
+
+This project uses [pnpm](https://pnpm.io/installation) for its package manager.
+
+To set up the repository:
+`pnpm install`

package/dist/{ProgressBar.module-BkAFfFy0.js → ProgressBar.module-Jzqlebbx.js}

@@ -1,4 +1,4 @@
-import './assets/ProgressBar.css';const _ = "_progressBar_140lk_17", o = "_fill_140lk_29", l = "_fill__animated_140lk_36", r = "_content_140lk_40", c = "_color__default_140lk_47", e = "_color__black_140lk_54", t = "_color__white_140lk_61", n = "_color__red_140lk_68", a = "_color__orange_140lk_75", s = "_color__yellow_140lk_82", k = "_color__olive_140lk_89", i = "_color__green_140lk_96", g = "_color__teal_140lk_103", b = "_color__blue_140lk_110", d = "_color__violet_140lk_117", p = "_color__purple_140lk_124", f = "_color__pink_140lk_131", u = "_color__brown_140lk_138", v = "_color__grey_140lk_145", w = "_color__good_140lk_159", y = "_color__average_140lk_166", h = "_color__bad_140lk_173", m = "_color__label_140lk_180", B = {
+import './assets/ProgressBar.css';const _ = "_progressBar_140lk_17", o = "_fill_140lk_29", l = "_fill__animated_140lk_36", r = "_content_140lk_40", c = "_color__default_140lk_47", e = "_color__black_140lk_54", t = "_color__white_140lk_61", n = "_color__red_140lk_68", a = "_color__orange_140lk_75", s = "_color__yellow_140lk_82", k = "_color__olive_140lk_89", g = "_color__green_140lk_96", i = "_color__teal_140lk_103", b = "_color__blue_140lk_110", d = "_color__violet_140lk_117", p = "_color__purple_140lk_124", f = "_color__pink_140lk_131", u = "_color__brown_140lk_138", v = "_color__grey_140lk_145", w = "_color__good_140lk_159", y = "_color__average_140lk_166", h = "_color__bad_140lk_173", m = "_color__label_140lk_180", B = {
   progressBar: _,
   fill: o,
   fill__animated: l,
@@ -10,8 +10,8 @@ import './assets/ProgressBar.css';const _ = "_progressBar_140lk_17", o = "_fill_
   color__orange: a,
   color__yellow: s,
   color__olive: k,
-  color__green: i,
-  color__teal: g,
+  color__green: g,
+  color__teal: i,
   color__blue: b,
   color__violet: d,
   color__purple: p,
@@ -25,5 +25,5 @@ import './assets/ProgressBar.css';const _ = "_progressBar_140lk_17", o = "_fill_
   color__label: m
 };
 export {
-  B as s
+  B as p
 };

package/dist/common/string.d.ts

@@ -16,6 +16,21 @@
  * ```
  */
 export declare function createSearch<TObj>(searchText: string, stringifier?: (obj: TObj) => string): (obj: TObj) => boolean;
+export declare const VOWELS: string[];
+/**
+ * Pluralizes a word based on the number given.
+ * Handles -es and -ies.
+ *
+ * @param override - A custom string to be appended instead for plurals. Useful for words that don't follow the standard rules.
+ *
+ * @example
+ * ```tsx
+ * pluralize('Dog', 1) // Dog
+ * pluralize('Dog', 2) // Dogs
+ * pluralize('Monarch', 2, "s") // Monarchs
+ * ```
+ */
+export declare function pluralize(str: string, n: number, override?: string): string;
 /**
  * Capitalizes a word and lowercases the rest.
  *

package/dist/common/string.js

@@ -7,16 +7,20 @@ function p(e, t = (r) => JSON.stringify(r)) {
     return o ? o.toLowerCase().includes(r) : !1;
   };
 }
-function a(e) {
+const a = ["a", "e", "i", "o", "u"];
+function l(e, t, r) {
+  return t === 1 ? e : r ? e + r : e.endsWith("s") || e.endsWith("x") || e.endsWith("z") || e.endsWith("ch") || e.endsWith("sh") ? e + "es" : e.endsWith("y") && !a.includes(e.charAt(e.length - 2)) ? e.slice(0, -1) + "ies" : e + "s";
+}
+function c(e) {
   return e.charAt(0).toUpperCase() + e.slice(1).toLowerCase();
 }
-function u(e) {
+function f(e) {
   return e.replace(/(^\w{1})|(\s+\w{1})/g, (t) => t.toUpperCase());
 }
-function l(e) {
+function h(e) {
   return e.replace(/^\w/, (t) => t.toUpperCase());
 }
-const c = ["Id", "Tv"], s = [
+const i = ["Id", "Tv"], s = [
   "A",
   "An",
   "And",
@@ -39,20 +43,20 @@ const c = ["Id", "Tv"], s = [
   "To",
   "With"
 ];
-function f(e) {
+function g(e) {
   if (!e) return e;
-  let t = e.replace(/([^\W_]+[^\s-]*) */g, (r) => a(r));
+  let t = e.replace(/([^\W_]+[^\s-]*) */g, (r) => c(r));
   for (const r of s) {
     const n = new RegExp("\\s" + r + "\\s", "g");
     t = t.replace(n, (o) => o.toLowerCase());
   }
-  for (const r of c) {
+  for (const r of i) {
     const n = new RegExp("\\b" + r + "\\b", "g");
     t = t.replace(n, (o) => o.toLowerCase());
   }
   return t;
 }
-const i = {
+const u = {
   amp: "&",
   apos: "'",
   gt: ">",
@@ -60,11 +64,11 @@ const i = {
   nbsp: " ",
   quot: '"'
 };
-function g(e) {
+function d(e) {
   return e && e.replace(/<br>/gi, `
 `).replace(/<\/?[a-z0-9-_]+[^>]*>/gi, "").replace(
     /&(nbsp|amp|quot|lt|gt|apos);/g,
-    (t, r) => i[r]
+    (t, r) => u[r]
   ).replace(/&#?([0-9]+);/gi, (t, r) => {
     const n = parseInt(r, 10);
     return String.fromCharCode(n);
@@ -74,10 +78,12 @@ function g(e) {
   });
 }
 export {
-  a as capitalize,
-  u as capitalizeAll,
-  l as capitalizeFirst,
+  a as VOWELS,
+  c as capitalize,
+  f as capitalizeAll,
+  h as capitalizeFirst,
   p as createSearch,
-  g as decodeHtmlEntities,
-  f as toTitleCase
+  d as decodeHtmlEntities,
+  l as pluralize,
+  g as toTitleCase
 };

package/dist/components/Box.js

@@ -28,7 +28,7 @@ const m = (o) => (t, i) => {
 }, 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);
+      e[o + i[c]] = t(f);
 }, s = (o) => (t, i) => {
   x(i) && (t[o] = i);
 }, C = {

package/dist/components/ColorBox.js

@@ -15,7 +15,7 @@ function d(r) {
         e(o)
       ]),
       ...n(o),
-      children: c || "."
+      children: c || ""
     }
   );
 }

package/dist/components/LabeledList.js

@@ -1,4 +1,4 @@
-import { jsx as l, jsxs as d } from "react/jsx-runtime";
+import { jsx as l, jsxs as b } from "react/jsx-runtime";
 import { classes as i } from "../common/react.js";
 import { Box as r, unit as g } from "./Box.js";
 import { Divider as x } from "./Divider.js";
@@ -12,7 +12,7 @@ import '../assets/LabeledList.css';const v = "_labeledList_pb6nb_9", y = "_row_p
 };
 function p(e) {
   const { children: t } = e;
-  return /* @__PURE__ */ l("table", { className: "LabeledList", children: t });
+  return /* @__PURE__ */ l("table", { className: "LabeledList", children: /* @__PURE__ */ l("tbody", { children: t }) });
 }
 function z(e) {
   const {
@@ -21,15 +21,15 @@ function z(e) {
     labelColor: _ = "label",
     labelWrap: m,
     color: L,
-    textAlign: f,
+    textAlign: h,
     buttons: a,
-    content: h,
+    content: f,
     children: u,
     verticalAlign: c = "baseline",
-    tooltip: b
+    tooltip: d
   } = e;
   let n;
-  s && (n = s, typeof s == "string" && (n += ":")), b !== void 0 && (n = /* @__PURE__ */ l(N, { content: b, children: /* @__PURE__ */ l(
+  s && (n = s, typeof s == "string" && (n += ":")), d !== void 0 && (n = /* @__PURE__ */ l(N, { content: d, children: /* @__PURE__ */ l(
     r,
     {
       as: "span",
@@ -53,19 +53,19 @@ function z(e) {
       children: n
     }
   );
-  return /* @__PURE__ */ d("tr", { className: i([o.row, t]), children: [
+  return /* @__PURE__ */ b("tr", { className: i([o.row, t]), children: [
     w,
-    /* @__PURE__ */ d(
+    /* @__PURE__ */ b(
       r,
       {
         as: "td",
         color: L,
-        textAlign: f,
+        textAlign: h,
         className: o.cell,
         colSpan: a ? void 0 : 2,
         verticalAlign: c,
         children: [
-          h,
+          f,
           u
         ]
       }

package/dist/components/ProgressBar.js

@@ -1,35 +1,35 @@
-import { jsxs as g, jsx as n } from "react/jsx-runtime";
+import { jsxs as x, jsx as n } from "react/jsx-runtime";
 import { CSS_COLORS as v } from "../common/constants.js";
-import { keyOfMatchingRange as y, toFixed as N, scale as _, clamp01 as B } from "../common/math.js";
+import { keyOfMatchingRange as y, toFixed as N, scale as S, clamp01 as _ } from "../common/math.js";
 import { classes as m } from "../common/react.js";
-import { s as o } from "../ProgressBar.module-BkAFfFy0.js";
-import { computeBoxProps as S, computeBoxClassName as O } from "./Box.js";
+import { p as e } from "../ProgressBar.module-Jzqlebbx.js";
+import { computeBoxProps as B, computeBoxClassName as O } from "./Box.js";
 function w(d) {
   const {
     className: f,
     value: r,
-    minValue: u = 0,
-    maxValue: p = 1,
+    minValue: p = 0,
+    maxValue: u = 1,
     color: C,
-    ranges: h = {},
+    ranges: g = {},
     children: l,
     ...t
-  } = d, a = _(r, u, p), x = l !== void 0, s = C || y(r, h) || "default", e = S(t), c = [
-    o.progressBar,
+  } = d, a = S(r, p, u), h = l !== void 0, o = C || y(r, g) || "default", s = B(t), c = [
+    e.progressBar,
     f,
     O(t)
   ], i = {
-    width: B(a) * 100 + "%"
+    width: _(a) * 100 + "%"
   };
-  return v.includes(s) || s === "default" ? c.push(o["color__" + s]) : (e.style = { ...e.style, borderColor: s }, i.backgroundColor = s), /* @__PURE__ */ g("div", { className: m(c), ...e, children: [
+  return v.includes(o) || o === "default" ? c.push(e["color__" + o]) : (s.style = { ...s.style, borderColor: o }, i.backgroundColor = o), /* @__PURE__ */ x("div", { className: m(c), ...s, children: [
     /* @__PURE__ */ n(
       "div",
       {
-        className: m([o.fill, o.fill__animated]),
+        className: m([e.fill, e.fill__animated]),
         style: i
       }
     ),
-    /* @__PURE__ */ n("div", { className: o.content, children: x ? l : N(a * 100) + "%" })
+    /* @__PURE__ */ n("div", { className: e.content, children: h ? l : N(a * 100) + "%" })
   ] });
 }
 export {

package/dist/components/Slider.js

@@ -1,21 +1,21 @@
 import { jsx as s, jsxs as m } from "react/jsx-runtime";
 import { keyOfMatchingRange as R, clamp01 as t, scale as f } from "../common/math.js";
 import { classes as _ } from "../common/react.js";
-import { s as e } from "../ProgressBar.module-BkAFfFy0.js";
-import { computeBoxClassName as $, computeBoxProps as q } from "./Box.js";
-import { DraggableControl as A } from "./DraggableControl.js";
-import '../assets/Slider.css';const G = "_slider_1assx_9", H = "_cursorOffset_1assx_13", I = "_cursor_1assx_13", J = "_pointer_1assx_30", K = "_popupValue_1assx_41", a = {
-  slider: G,
-  cursorOffset: H,
-  cursor: I,
-  pointer: J,
-  popupValue: K
+import { p as e } from "../ProgressBar.module-Jzqlebbx.js";
+import { computeBoxClassName as q, computeBoxProps as A } from "./Box.js";
+import { DraggableControl as G } from "./DraggableControl.js";
+import '../assets/Slider.css';const H = "_slider_1assx_9", I = "_cursorOffset_1assx_13", J = "_cursor_1assx_13", K = "_pointer_1assx_30", L = "_popupValue_1assx_41", a = {
+  slider: H,
+  cursorOffset: I,
+  cursor: J,
+  pointer: K,
+  popupValue: L
 };
-function Y(h) {
+function Z(h) {
   const {
     // Draggable props (passthrough)
-    animated: v,
-    format: g,
+    animated: g,
+    format: v,
     maxValue: o,
     minValue: r,
     onChange: x,
@@ -29,16 +29,16 @@ function Y(h) {
     className: w,
     fillValue: l,
     color: M,
-    ranges: B = {},
+    ranges: S = {},
     children: i,
     ...c
-  } = h, F = i !== void 0;
+  } = h, B = i !== void 0;
   return /* @__PURE__ */ s(
-    A,
+    G,
     {
       dragMatrix: [1, 0],
-      animated: v,
-      format: g,
+      animated: g,
+      format: v,
       maxValue: o,
       minValue: r,
       onChange: x,
@@ -48,7 +48,7 @@ function Y(h) {
       suppressFlicker: C,
       unit: D,
       value: O,
-      children: (S) => {
+      children: (F) => {
         const {
           displayElement: n,
           displayValue: p,
@@ -56,11 +56,11 @@ function Y(h) {
           handleDragStart: k,
           inputElement: E,
           value: P
-        } = S, b = l != null, u = f(
+        } = F, b = l != null, u = f(
           l ?? p,
           r,
           o
-        ), d = f(p, r, o), z = M || R(l ?? P, B) || "default";
+        ), d = f(p, r, o), z = M || R(l ?? P, S) || "default";
         return /* @__PURE__ */ m(
           "div",
           {
@@ -69,9 +69,9 @@ function Y(h) {
               e.progressBar,
               e["color__" + z],
               w,
-              $(c)
+              q(c)
             ]),
-            ...q(c),
+            ...A(c),
             onMouseDown: k,
             children: [
               /* @__PURE__ */ s(
@@ -110,7 +110,7 @@ function Y(h) {
                   ]
                 }
               ),
-              /* @__PURE__ */ s("div", { className: e.content, children: F ? i : n }),
+              /* @__PURE__ */ s("div", { className: e.content, children: B ? i : n }),
               E
             ]
           }
@@ -120,5 +120,5 @@ function Y(h) {
   );
 }
 export {
-  Y as Slider
+  Z as Slider
 };

package/dist/components/TimeDisplay.d.ts

@@ -0,0 +1,10 @@
+interface TimeDisplayProps {
+    /** Whether the TimeDisplay should automatically increment or decrement (plain prop to dec.) */
+    auto?: 'up' | 'down' | true;
+    /** An optional function to format the value */
+    format?: (value: number) => string;
+    /** The value that the TimeDisplay needs to render - if you pass a wrong type it will be rendered directly */
+    value: number;
+}
+export declare function TimeDisplay(props: TimeDisplayProps): string | number | null;
+export {};

package/dist/components/TimeDisplay.js

@@ -1,34 +1,25 @@
-import { Component as r } from "react";
-import { formatTime as u } from "../common/format.js";
-function s(e) {
-  return typeof e == "number" && Number.isFinite(e) && !Number.isNaN(e);
-}
-class o extends r {
-  constructor(t) {
-    super(t), this.timer = null, this.last_seen_value = void 0, this.state = {
-      value: 0
-    }, s(t.value) && (this.state.value = Number(t.value), this.last_seen_value = Number(t.value));
-  }
-  componentDidUpdate() {
-    this.props.auto !== void 0 && (clearInterval(this.timer), this.timer = setInterval(() => this.tick(), 1e3));
-  }
-  tick() {
-    let t = Number(this.state.value);
-    this.props.value !== this.last_seen_value && (this.last_seen_value = this.props.value, t = this.props.value);
-    const i = this.props.auto === "up" ? 10 : -10, a = Math.max(0, t + i);
-    this.setState({ value: a });
-  }
-  componentDidMount() {
-    this.props.auto !== void 0 && (this.timer = setInterval(() => this.tick(), 1e3));
-  }
-  componentWillUnmount() {
-    clearInterval(this.timer);
-  }
-  render() {
-    const t = this.state.value;
-    return s(t) ? u(t) : this.state.value || null;
-  }
+import { useState as l, useRef as d, useEffect as f } from "react";
+import { formatTime as v } from "../common/format.js";
+const u = (t) => typeof t == "number" && Number.isFinite(t) && !Number.isNaN(t);
+function b(t) {
+  const {
+    value: e = 0,
+    auto: r = void 0,
+    format: o = void 0
+  } = t, [i, a] = l(
+    () => u(e) ? e : 0
+  ), [s, m] = l(
+    u(e) ? e : void 0
+  ), n = d(null);
+  return f(() => (console.log("auto", r), r !== void 0 && (n.current = setInterval(() => {
+    const c = r === "up" ? 10 : -10;
+    a((p) => Math.max(0, p + c));
+  }, 1e3)), () => {
+    n.current && clearInterval(n.current);
+  }), [r]), f(() => {
+    e !== s && (m(e), a(e));
+  }, [e, s]), u(e) ? o ? o(i) : v(i) : e || null;
 }
 export {
-  o as TimeDisplay
+  b as TimeDisplay
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tgui-core",
-  "version": "1.1.21",
+  "version": "1.1.23",
   "description": "TGUI core component library",
   "keywords": [
     "TGUI",
@@ -28,6 +28,12 @@
     "type": "git",
     "url": "https://github.com/tgstation/tgui-core.git"
   },
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc --noEmit && vite build",
+    "lint": "eslint lib/**",
+    "lint-fix": "eslint lib/** --fix"
+  },
   "author": "jlsnow301",
   "license": "MIT",
   "type": "module",
@@ -60,10 +66,5 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
-  "scripts": {
-    "dev": "vite",
-    "build": "tsc --noEmit && vite build",
-    "lint": "eslint lib/**",
-    "lint-fix": "eslint lib/** --fix"
-  }
-}
+  "packageManager": "pnpm@9.5.0+sha512.140036830124618d624a2187b50d04289d5a087f326c9edfc0ccd733d76c4f52c3a313d4fc148794a2a9d81553016004e6742e8cf850670268a7387fc220c903"
+}