Add BxIconRaw tyoe

dist/better-xcloud.lite.user.js

@@ -787,7 +787,7 @@ function createElement(elmName, props, ..._) {
 }
 var domParser = new DOMParser;
 function createSvgIcon(icon) {
- return domParser.parseFromString(icon.toString(), "image/svg+xml").documentElement;
+ return domParser.parseFromString(icon, "image/svg+xml").documentElement;
 }
 var ButtonStyleIndices = Object.keys(ButtonStyleClass).map((i) => parseInt(i));
 function createButton(options) {

dist/better-xcloud.user.js

@@ -819,7 +819,7 @@ function createElement(elmName, props, ..._) {
 }
 var domParser = new DOMParser;
 function createSvgIcon(icon) {
- return domParser.parseFromString(icon.toString(), "image/svg+xml").documentElement;
+ return domParser.parseFromString(icon, "image/svg+xml").documentElement;
 }
 var ButtonStyleIndices = Object.keys(ButtonStyleClass).map((i) => parseInt(i));
 function createButton(options) {

src/modules/stream/stream-badges.ts

@@ -5,7 +5,7 @@ import { BxEvent } from "@utils/bx-event";
 import { CE, createSvgIcon, humanFileSize } from "@utils/html";
 import { STATES } from "@utils/global";
 import { BxLogger } from "@/utils/bx-logger";
-import { BxIcon } from "@/utils/bx-icon";
+import { BxIcon, type BxIconRaw } from "@/utils/bx-icon";
 import { GuideMenuTab } from "../ui/guide-menu";
 import { StreamStatsCollector } from "@/utils/stream-stats-collector";
 import { StreamStat } from "@/enums/pref-values";
@@ -14,7 +14,7 @@ import { StreamStat } from "@/enums/pref-values";
 type StreamBadgeInfo = {
     name: string,
     $element?: HTMLElement,
-    icon: typeof BxIcon,
+    icon: BxIconRaw,
     color: string,
 };
 

src/modules/stream/stream-ui.ts

@@ -1,6 +1,6 @@
 import { STATES } from "@utils/global.ts";
 import { createSvgIcon } from "@utils/html.ts";
-import { BxIcon } from "@utils/bx-icon";
+import { BxIcon, type BxIconRaw } from "@utils/bx-icon";
 import { t } from "@utils/translation.ts";
 import { StreamBadges } from "./stream-badges.ts";
 import { StreamStats } from "./stream-stats.ts";
@@ -15,7 +15,7 @@ export class StreamUiHandler {
     private static $btnHome: HTMLElement | null | undefined;
     private static observer: MutationObserver | undefined;
 
-    private static cloneStreamHudButton($btnOrg: HTMLElement, label: string, svgIcon: typeof BxIcon): HTMLElement | null {
+    private static cloneStreamHudButton($btnOrg: HTMLElement, label: string, svgIcon: BxIconRaw): HTMLElement | null {
         if (!$btnOrg) {
             return null;
         }
@@ -78,7 +78,7 @@ export class StreamUiHandler {
         return $container;
     }
 
-    private static cloneCloseButton($btnOrg: HTMLElement, icon: typeof BxIcon, className: string, onChange: any): HTMLElement | null {
+    private static cloneCloseButton($btnOrg: HTMLElement, icon: BxIconRaw, className: string, onChange: any): HTMLElement | null {
         if (!$btnOrg) {
             return null;
         }

src/modules/ui/dialog/settings-dialog.ts

@@ -7,7 +7,7 @@ import { SoundShortcut } from "@/modules/shortcuts/sound-shortcut";
 import { StreamStats } from "@/modules/stream/stream-stats";
 import { TouchController } from "@/modules/touch-controller";
 import { BxEvent } from "@/utils/bx-event";
-import { BxIcon } from "@/utils/bx-icon";
+import { BxIcon, type BxIconRaw } from "@/utils/bx-icon";
 import { STATES, AppInterface, deepClone, SCRIPT_VERSION, STORAGE, SCRIPT_VARIANT } from "@/utils/global";
 import { t, Translations } from "@/utils/translation";
 import { BxSelectElement } from "@/web-components/bx-select";
@@ -65,7 +65,7 @@ type SettingTabSection = {
 };
 
 type SettingTab = {
-    icon: SVGElement;
+    icon: BxIconRaw;
     group: SettingTabGroup,
     items: Array<SettingTabSection | HTMLElement | false> | (() => Array<SettingTabSection | false>);
     requiredVariants?: BuildVariant | Array<BuildVariant>;

src/types/index.d.ts

@@ -101,12 +101,27 @@ type XcloudWaitTimeInfo = Partial<{
     estimatedTotalWaitTimeInSeconds: number,
 }>;
 
-declare module '*.js';
+declare module '*.js' {
-declare module '*.svg';
+  const content: string;
-declare module '*.styl';
+  export default content;
+}
+declare module '*.svg' {
+  const content: string;
+  export default content;
+}
+declare module '*.styl' {
+  const content: string;
+  export default content;
+}
 
-declare module '*.fs';
+declare module '*.fs' {
-declare module '*.vert';
+    const content: string;
+    export default content;
+}
+declare module '*.vert' {
+    const content: string;
+    export default content;
+}
 
 type MkbMouseMove = {
     movementX: number;

src/utils/bx-icon.ts

@@ -83,3 +83,5 @@ export const BxIcon = {
     UPLOAD: iconUpload,
     AUDIO: iconSpeakerHigh,
 } as const;
+
+export type BxIconRaw = (typeof BxIcon)[keyof typeof BxIcon];

src/utils/html.ts

@@ -1,4 +1,4 @@
-import type { BxIcon } from "@utils/bx-icon";
+import type { BxIconRaw } from "@utils/bx-icon";
 import { setNearby } from "./navigation-utils";
 import type { NavigationNearbyElements } from "@/modules/ui/dialog/navigation-dialog";
 import type { PresetRecord, AllPresets } from "@/types/presets";
@@ -43,7 +43,7 @@ export type BxButtonOptions = Partial<{
     style: ButtonStyle;
     url: string;
     classes: string[];
-    icon: typeof BxIcon;
+    icon: BxIconRaw;
     label: string;
     secondaryText: HTMLElement | string;
     title: string;
@@ -149,8 +149,8 @@ function createElement<T extends keyof HTMLElementTagNameMap>(elmName: T, props?
 
 
 const domParser = new DOMParser();
-export function createSvgIcon(icon: typeof BxIcon) {
+export function createSvgIcon(icon: BxIconRaw) {
-    return domParser.parseFromString(icon.toString(), 'image/svg+xml').documentElement;
+    return domParser.parseFromString(icon, 'image/svg+xml').documentElement;
 }
 
 const ButtonStyleIndices = Object.keys(ButtonStyleClass).map(i => parseInt(i));