From 11b604c7680f5c349a8771193912a7e0739ff453 Mon Sep 17 00:00:00 2001
From: jlsnow301 <jlsnow301@pm.me>
Date: Wed, 10 Jul 2024 10:19:15 -0700
Subject: [PATCH] reimplements dmicon

---
 dist/components/DmIcon.d.ts | 30 +++++++++++++++++++++
 dist/components/DmIcon.js   | 21 +++++++++++++++
 global.d.ts                 | 27 +++++++++++--------
 lib/components/DmIcon.tsx   | 53 +++++++++++++++++++++++++++++++++++++
 package.json                |  2 +-
 5 files changed, 121 insertions(+), 12 deletions(-)
 create mode 100644 dist/components/DmIcon.d.ts
 create mode 100644 dist/components/DmIcon.js
 create mode 100644 lib/components/DmIcon.tsx

diff --git a/dist/components/DmIcon.d.ts b/dist/components/DmIcon.d.ts
new file mode 100644
index 0000000..8c65a08
--- /dev/null
+++ b/dist/components/DmIcon.d.ts
@@ -0,0 +1,30 @@
+import { ReactNode } from 'react';
+import { BoxProps } from './Box';
+
+declare enum Direction {
+    NORTH = 1,
+    SOUTH = 2,
+    EAST = 4,
+    WEST = 8,
+    NORTHEAST = 5,
+    NORTHWEST = 9,
+    SOUTHEAST = 6,
+    SOUTHWEST = 10
+}
+type Props = {
+    /** Required: The path of the icon */
+    icon: string;
+    /** Required: The state of the icon */
+    icon_state: string;
+} & Partial<{
+    /** Facing direction. See direction enum. Default is South */
+    direction: Direction;
+    /** Fallback icon. */
+    fallback: ReactNode;
+    /** Frame number. Default is 1 */
+    frame: number;
+    /** Movement state. Default is false */
+    movement: any;
+}> & BoxProps;
+export declare function DmIcon(props: Props): string | number | boolean | Iterable<ReactNode> | import("react/jsx-runtime").JSX.Element | null | undefined;
+export {};
diff --git a/dist/components/DmIcon.js b/dist/components/DmIcon.js
new file mode 100644
index 0000000..033150c
--- /dev/null
+++ b/dist/components/DmIcon.js
@@ -0,0 +1,21 @@
+import { jsx as u } from "react/jsx-runtime";
+import { Image as $ } from "./Image.js";
+function x(o) {
+  var r;
+  const {
+    className: l,
+    direction: t = 2,
+    fallback: n,
+    frame: c = 1,
+    icon_state: m,
+    icon: i,
+    movement: s = !1,
+    ...a
+  } = o, e = (r = Byond.iconRefMap) == null ? void 0 : r[i];
+  if (!e) return n;
+  const f = `${e}?state=${m}&dir=${t}&movement=${!!s}&frame=${c}`;
+  return /* @__PURE__ */ u($, { fixErrors: !0, src: f, ...a });
+}
+export {
+  x as DmIcon
+};
diff --git a/global.d.ts b/global.d.ts
index d641def..6286b84 100644
--- a/global.d.ts
+++ b/global.d.ts
@@ -55,6 +55,11 @@ type ByondType = {
    */
   command(command: string): void;
 
+  /**
+   * Icon reference map from BYOND
+   */
+  iconRefMap: Record<string, string>;
+
   /**
    * Loads a stylesheet into the document.
    */
@@ -72,13 +77,13 @@ type ByondType = {
    */
   parseJson(text: string): any;
 
+  sendMessage(message: TguiMessage): void;
+
   /**
    * Sends a message to `/datum/tgui_window` which hosts this window instance.
    */
   sendMessage(type: string, payload?: any): void;
 
-  sendMessage(message: TguiMessage): void;
-
   /**
    * If `true`, unhandled errors and common mistakes result in a blue screen
    * of death, which stops this window from handling incoming messages and
@@ -115,13 +120,6 @@ type ByondType = {
    */
   windowId: string;
 
-  /**
-   * Retrieves all properties of the BYOND skin element.
-   *
-   * Returns a promise with a key-value object containing all properties.
-   */
-  winget(id: string | null): Promise<object>;
-
   /**
    * Retrieves all properties of the BYOND skin element.
    *
@@ -145,9 +143,11 @@ type ByondType = {
   winget(id: string | null, propNames: string[]): Promise<object>;
 
   /**
-   * Assigns properties to BYOND skin elements in bulk.
+   * Retrieves all properties of the BYOND skin element.
+   *
+   * Returns a promise with a key-value object containing all properties.
    */
-  winset(props: object): void;
+  winget(id: string | null): Promise<object>;
 
   /**
    * Sets a property on the BYOND skin element to a certain value.
@@ -158,6 +158,11 @@ type ByondType = {
    * Assigns properties to the BYOND skin element.
    */
   winset(id: string | null, props: object): void;
+
+  /**
+   * Assigns properties to BYOND skin elements in bulk.
+   */
+  winset(props: object): void;
 };
 
 /**
diff --git a/lib/components/DmIcon.tsx b/lib/components/DmIcon.tsx
new file mode 100644
index 0000000..5d14e49
--- /dev/null
+++ b/lib/components/DmIcon.tsx
@@ -0,0 +1,53 @@
+import { ReactNode } from 'react';
+
+import { BoxProps } from './Box';
+import { Image } from './Image';
+
+enum Direction {
+  NORTH = 1,
+  SOUTH = 2,
+  EAST = 4,
+  WEST = 8,
+  NORTHEAST = NORTH | EAST,
+  NORTHWEST = NORTH | WEST,
+  SOUTHEAST = SOUTH | EAST,
+  SOUTHWEST = SOUTH | WEST,
+}
+
+type Props = {
+  /** Required: The path of the icon */
+  icon: string;
+  /** Required: The state of the icon */
+  icon_state: string;
+} & Partial<{
+  /** Facing direction. See direction enum. Default is South */
+  direction: Direction;
+  /** Fallback icon. */
+  fallback: ReactNode;
+  /** Frame number. Default is 1 */
+  frame: number;
+  /** Movement state. Default is false */
+  movement: any;
+}> &
+  BoxProps;
+
+export function DmIcon(props: Props) {
+  const {
+    className,
+    direction = Direction.SOUTH,
+    fallback,
+    frame = 1,
+    icon_state,
+    icon,
+    movement = false,
+    ...rest
+  } = props;
+
+  const iconRef = Byond.iconRefMap?.[icon];
+
+  if (!iconRef) return fallback;
+
+  const query = `${iconRef}?state=${icon_state}&dir=${direction}&movement=${!!movement}&frame=${frame}`;
+
+  return <Image fixErrors src={query} {...rest} />;
+}
diff --git a/package.json b/package.json
index 0c1aa39..fafeb21 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "tgui-core",
-  "version": "1.1.16",
+  "version": "1.1.17",
   "description": "TGUI core component library",
   "keywords": [
     "TGUI",