diff --git a/scripts/build/module/style.js b/scripts/build/module/style.js index 4715d3b46..8fbe6d367 100644 --- a/scripts/build/module/style.js +++ b/scripts/build/module/style.js @@ -22,4 +22,4 @@ enabled: false }); -export default STYLE_NAME; +export default window.VencordStyles.get(STYLE_NAME); diff --git a/src/api/Styles.ts b/src/api/Styles.ts index eace71f66..6f93ef6c6 100644 --- a/src/api/Styles.ts +++ b/src/api/Styles.ts @@ -16,12 +16,15 @@ * along with this program. If not, see . */ -import type { MapValue } from "type-fest/source/entry"; - -export type Style = MapValue; - export const styleMap = window.VencordStyles ??= new Map(); +export interface Style { + name: string; + source: string; + enabled: boolean; + edit?(source: string): string; +} + export function requireStyle(name: string) { const style = styleMap.get(name); if (!style) throw new Error(`Style "${name}" does not exist`); @@ -35,7 +38,7 @@ function findDocuments() { /** * A style's name can be obtained from importing a stylesheet with `?managed` at the end of the import - * @param name The name of the style + * @param style The style object * @returns `false` if the style was already enabled, `true` otherwise * @example * import pluginStyle from "./plugin.css?managed"; @@ -43,9 +46,7 @@ function findDocuments() { * // Inside some plugin method like "start()" or "[option].onChange()" * enableStyle(pluginStyle); */ -export function enableStyle(name: string) { - const style = requireStyle(name); - +export function enableStyle(style: Style) { style.enabled = true; compileStyle(style); @@ -56,16 +57,12 @@ export function enableStyle(name: string) { } /** - * @param name The name of the style + * @param style The style object * @returns `false` if the style was already disabled, `true` otherwise * @see {@link enableStyle} for info on getting the name of an imported style */ -export function disableStyle(name: string) { - const style = requireStyle(name); - - findDocuments().forEach(doc => { - [...doc.head.querySelectorAll("style[data-vencord-name]")].find(e => e.dataset.vencordName === style.name)?.remove(); - }); +export function disableStyle(style: Style) { + compileStyle(style); if (!style.enabled) return false; @@ -74,27 +71,16 @@ export function disableStyle(name: string) { return true; } -/** - * @param name The name of the style - * @returns `true` in most cases, may return `false` in some edge cases - * @see {@link enableStyle} for info on getting the name of an imported style - */ -export const toggleStyle = (name: string) => isStyleEnabled(name) ? disableStyle(name) : enableStyle(name); - -/** - * @param name The name of the style - * @returns Whether the style is enabled - * @see {@link enableStyle} for info on getting the name of an imported style - */ -export const isStyleEnabled = (name: string) => requireStyle(name).enabled ?? false; - /** * @param style The new style object * @see {@link enableStyle} for info on getting the name of an imported style */ export function setStyle(style: Style) { - styleMap.set(style.name, style); - (style.enabled ? enableStyle : disableStyle)(style.name); + if (!styleMap.has(style.name)) styleMap.set(style.name, style); + const storedStyle = requireStyle(style.name); + Object.assign(storedStyle, style); + + (style.enabled ? enableStyle : disableStyle)(style); } /** @@ -132,8 +118,7 @@ export const setStyleClassNames = (name: string, classNames: Record { findDocuments().forEach(doc => { let styleElement = [...doc.head.querySelectorAll("style[data-vencord-name]")].find(e => e.dataset.vencordName === style.name); - if (!styleElement) { - styleElement = doc.createElement("style"); - styleElement.dataset.vencordName = style.name; - document.head.appendChild(styleElement); - } - styleElement.textContent = style.edit ? style.edit(style.source) : style.source; + if (style.enabled) { + if (!styleElement) { + styleElement = doc.createElement("style"); + styleElement.dataset.vencordName = style.name; + document.head.appendChild(styleElement); + } + styleElement.textContent = style.edit ? style.edit(style.source) : style.source; + } else styleElement?.remove(); }); }; diff --git a/src/globals.d.ts b/src/globals.d.ts index 1d6541f05..a45074b1c 100644 --- a/src/globals.d.ts +++ b/src/globals.d.ts @@ -45,12 +45,7 @@ declare global { export var VencordNative: typeof import("./VencordNative").default; export var Vencord: typeof import("./Vencord"); - export var VencordStyles: Map; + export var VencordStyles: Map; export var appSettings: { set(setting: string, v: any): void; }; diff --git a/src/modules.d.ts b/src/modules.d.ts index b6e6b2476..c8bacb6f3 100644 --- a/src/modules.d.ts +++ b/src/modules.d.ts @@ -18,6 +18,7 @@ /// + declare module "~plugins" { const plugins: Record; export default plugins; @@ -50,6 +51,6 @@ declare module "file://*" { declare module "*.css"; declare module "*.css?managed" { - const name: string; - export default name; + const style: import("@api/Styles").Style; + export default style; }