@plexcord/types 1.18.5 → 1.19.1

package/PlexcordNative.d.ts

@@ -1,8 +1,9 @@
 import type { Settings } from "./api/Settings";
-import { CspRequestResult } from "./main/csp/manager";
+import type { CspRequestResult } from "./main/csp/manager";
 import type { UserThemeHeader } from "./main/themes";
 import { IpcEvents } from "./shared/IpcEvents";
-import { IpcRes } from "./utils/types";
+import type { IpcRes } from "./utils/types";
+export declare function invoke<T = any>(event: IpcEvents, ...args: any[]): Promise<T>;
 export declare function sendSync<T = any>(event: IpcEvents, ...args: any[]): T;
 declare const _default: {
     themes: {
@@ -33,10 +34,13 @@ declare const _default: {
         addThemeChangeListener(cb: () => void): void;
         openFile: () => Promise<void>;
         openEditor: () => Promise<void>;
+        getEditorTheme: () => string;
     };
     native: {
         getVersions: () => Partial<NodeJS.ProcessVersions>;
         openExternal: (url: string) => Promise<void>;
+        getRendererCss: () => Promise<string>;
+        onRendererCssUpdate: (cb: (newCss: string) => void) => void;
     };
     i18n: {
         updateMainLocale: (locale?: string) => Promise<boolean>;

package/api/Badges.d.ts

@@ -24,7 +24,8 @@ export interface ProfileBadge {
     /** The badge name to display, Discord uses this. Required for component badges */
     key?: string;
     /**
-     * Allows dynamically returning multiple badges
+     * Allows dynamically returning multiple badges.
+     * May call hooks but then you must not use shouldShow
      */
     getBadges?(userInfo: BadgeUserArgs): ProfileBadge[];
 }

package/api/HeaderBar.d.ts

@@ -1,41 +1,114 @@
-import type { ComponentType, JSX, MouseEventHandler, ReactNode, RefObject } from "react";
-export type HeaderBarButtonFactory = () => JSX.Element | null;
-export interface HeaderBarButtonData {
-    render: HeaderBarButtonFactory;
-    icon: ComponentType<any>;
-    priority?: number;
-}
-interface HeaderBarButton {
-    render: HeaderBarButtonFactory;
-    priority: number;
-}
-export declare const buttons: Map<string, HeaderBarButton>;
+import type { ComponentType, JSX, MouseEventHandler, ReactNode } from "react";
 export interface HeaderBarButtonProps {
+    /** The icon component to render inside the button */
     icon: ComponentType<any>;
+    /** Tooltip text shown on hover. Pass null to disable tooltip */
     tooltip: ReactNode;
+    /** Called when the button is clicked */
     onClick?: MouseEventHandler<HTMLDivElement>;
+    /** Called when the button is right-clicked */
     onContextMenu?: MouseEventHandler<HTMLDivElement>;
+    /** Additional CSS class names */
     className?: string;
+    /** CSS class name for the icon element */
     iconClassName?: string;
+    /** Tooltip position relative to the button */
     position?: "top" | "bottom" | "left" | "right";
+    /** Whether the button appears in a selected/active state */
     selected?: boolean;
+    /** Whether the button is disabled */
     disabled?: boolean;
+    /** Whether to show a notification badge */
     showBadge?: boolean;
+    /** Position of the notification badge */
     badgePosition?: "top" | "bottom";
-    ref?: RefObject<any>;
+    /** Size of the icon in pixels */
+    iconSize?: number;
+    /** Ref to the button element */
+    ref?: React.RefObject<any>;
+}
+export type HeaderBarButtonFactory = () => JSX.Element | null;
+export interface HeaderBarButtonData {
+    /** Function that renders the button component */
+    render: HeaderBarButtonFactory;
+    /** Icon component used for settings UI display */
+    icon: ComponentType<any>;
+    /** Higher priority buttons appear further right. Default: 0 */
+    priority?: number;
+    /** Where to render the button. Default: "headerbar" */
+    location?: "headerbar" | "channeltoolbar";
 }
+/**
+ * Button component for the top header bar (title bar area).
+ *
+ * @example
+ * <HeaderBarButton
+ *     icon={MyIcon}
+ *     tooltip="My Button"
+ *     onClick={() => console.log("clicked")}
+ * />
+ */
 export declare const HeaderBarButton: ComponentType<HeaderBarButtonProps>;
 /**
- * Add a button to the header bar.
- * @param id Unique identifier for the button.
- * @param render Function that renders the button component.
- * @param priority Higher priority = more to the right. Default is 0.
+ * Button component for the channel toolbar (below the search bar).
+ * Automatically handles selected state styling.
+ *
+ * @example
+ * <ChannelToolbarButton
+ *     icon={MyIcon}
+ *     tooltip={isOpen ? null : "My Button"}
+ *     onClick={() => setOpen(v => !v)}
+ *     selected={isOpen}
+ * />
+ */
+export declare function ChannelToolbarButton(props: HeaderBarButtonProps): JSX.Element;
+/**
+ * Adds a button to the header bar (title bar area).
+ *
+ * @param id - Unique identifier for the button (e.g., "my-plugin-button")
+ * @param render - Function that returns the button JSX
+ * @param priority - Higher values appear further right. Default: 0
+ *
+ * @example
+ * addHeaderBarButton("my-button", () => (
+ *     <HeaderBarButton
+ *         icon={MyIcon}
+ *         tooltip="My Button"
+ *         onClick={handleClick}
+ *     />
+ * ));
  */
 export declare function addHeaderBarButton(id: string, render: HeaderBarButtonFactory, priority?: number): void;
 /**
- * Remove a button from the header bar.
- * @param id The identifier of the button to remove.
+ * Removes a button from the header bar.
+ *
+ * @param id - The identifier used when adding the button
  */
 export declare function removeHeaderBarButton(id: string): void;
-export declare function _addButtons(): JSX.Element[];
-export {};
+/**
+ * Adds a button to the channel toolbar (below the search bar, next to pins/members).
+ *
+ * @param id - Unique identifier for the button (e.g., "my-plugin-toolbar")
+ * @param render - Function that returns the button JSX
+ * @param priority - Higher values appear further right. Default: 0
+ *
+ * @example
+ * addChannelToolbarButton("my-toolbar", () => (
+ *     <ChannelToolbarButton
+ *         icon={MyIcon}
+ *         tooltip="My Button"
+ *         onClick={handleClick}
+ *     />
+ * ));
+ */
+export declare function addChannelToolbarButton(id: string, render: HeaderBarButtonFactory, priority?: number): void;
+/**
+ * Removes a button from the channel toolbar.
+ *
+ * @param id - The identifier used when adding the button
+ */
+export declare function removeChannelToolbarButton(id: string): void;
+/** @internal Injected by HeaderBarAPI patch (do NOT call directly) */
+export declare function _addHeaderBarButtons(): JSX.Element[];
+/** @internal Injected by HeaderBarAPI patch (do NOT call directly) */
+export declare function _addChannelToolbarButtons(toolbar: ReactNode[]): void;

package/api/PluginManager.d.ts

@@ -14,6 +14,7 @@ export declare function isPluginRequired(name: string): boolean | undefined;
 export declare const calculatePluginDependencyMap: () => Record<string, string[]>;
 export declare function isPluginEnabled(p: string): boolean;
 export declare function addPatch(newPatch: Omit<Patch, "plugin">, pluginName: string, pluginPath?: string): void;
+export declare function pluginRequiresRestart(p: Plugin): boolean;
 export declare const startAllPlugins: (target: StartAt) => void;
 export declare function startDependenciesRecursive(p: Plugin): {
     restartNeeded: boolean;

package/api/Settings.d.ts

@@ -88,7 +88,7 @@ export declare const Settings: Settings;
  * @returns Settings
  */
 export declare function useSettings(paths?: UseSettings<Settings>[]): Settings;
-export declare function migratePluginToSetting(newName: string, oldName: string, settingName: string): void;
+export declare function migratePluginToSettings(newName: string, oldName: string, ...settingNames: string[]): void;
 export declare function migratePluginSettings(name: string, ...oldNames: string[]): void;
 export declare function migratePluginSetting(pluginName: string, newSetting: string, oldSetting: string): void;
 export declare function migrateSettingFromPlugin(newPlugin: string, newSetting: string, oldPlugin: string, oldSetting: string): void;

package/api/SettingsSync/offline.d.ts

@@ -1,20 +1,12 @@
-export declare function importSettings(data: string): Promise<void>;
-export declare function exportSettings({ syncDataStore, minify }: {
+type BackupType = "all" | "plugins" | "css" | "datastore";
+export declare function importSettings(data: string, type?: BackupType, cloud?: boolean): Promise<void>;
+export declare function exportSettings({ syncDataStore, type, minify }: {
     syncDataStore?: boolean;
+    type?: BackupType;
     minify?: boolean;
 }): Promise<string>;
-export declare function exportPlugins({ minify }?: {
-    minify?: boolean;
-}): Promise<string>;
-export declare function exportCSS({ minify }?: {
-    minify?: boolean;
-}): Promise<string>;
-export declare function exportDataStores({ minify }?: {
-    minify?: boolean;
-}): Promise<string>;
-type BackupType = "settings" | "plugins" | "css" | "datastore";
-export declare function downloadSettingsBackup(type: BackupType, { minify }?: {
+export declare function downloadSettingsBackup(type?: BackupType, { minify }?: {
     minify?: boolean;
 }): Promise<void>;
-export declare function uploadSettingsBackup(showToast?: boolean): Promise<void>;
+export declare function uploadSettingsBackup(type?: BackupType, showToast?: boolean): Promise<void>;
 export {};

package/api/Styles.d.ts

@@ -1,3 +1,7 @@
+/** @deprecated Import this from `@utils/css` instead */
+export declare const classNameFactory: (prefix?: string) => (...args: import("../utils/css").ClassNameFactoryArg[]
+/** @deprecated Import this from `@utils/css` instead */
+) => string;
 export interface Style {
     name: string;
     source: string;
@@ -5,6 +9,20 @@ export interface Style {
     dom: HTMLStyleElement | null;
 }
 export declare const styleMap: Map<string, Style>;
+export declare const plexcordRootNode: HTMLElement;
+/**
+ * Houses all Plexcord core styles. This includes all imported css files
+ */
+export declare const coreStyleRootNode: HTMLElement;
+/**
+ * Houses all plugin specific managed styles
+ */
+export declare const managedStyleRootNode: HTMLElement;
+/**
+ * Houses the user's themes and quick css
+ */
+export declare const userStyleRootNode: HTMLElement;
+export declare function initStyles(): void;
 export declare function requireStyle(name: string): Style;
 /**
  * A style's name can be obtained from importing a stylesheet with `?managed` at the end of the import
@@ -69,23 +87,3 @@ export declare const setStyleClassNames: (name: string, classNames: Record<strin
  * @see {@link setStyleClassNames} for more info on style classnames
  */
 export declare const compileStyle: (style: Style) => void;
-/**
- * @param name The classname
- * @param prefix A prefix to add each class, defaults to `""`
- * @return A css selector for the classname
- * @example
- * classNameToSelector("foo bar") // => ".foo.bar"
- */
-export declare const classNameToSelector: (name: string, prefix?: string) => string;
-type ClassNameFactoryArg = string | string[] | Record<string, unknown> | false | null | undefined | 0 | "";
-/**
- * @param prefix The prefix to add to each class, defaults to `""`
- * @returns A classname generator function
- * @example
- * const cl = classNameFactory("plugin-");
- *
- * cl("base", ["item", "editable"], { selected: null, disabled: true })
- * // => "plugin-base plugin-item plugin-editable plugin-disabled"
- */
-export declare const classNameFactory: (prefix?: string) => (...args: ClassNameFactoryArg[]) => string;
-export {};

package/api/UserArea.d.ts

@@ -0,0 +1,38 @@
+import type { ComponentType, MouseEventHandler, ReactNode } from "react";
+export interface UserAreaButtonProps {
+    icon: ReactNode;
+    tooltipText?: ReactNode;
+    onClick?: MouseEventHandler<HTMLDivElement>;
+    onContextMenu?: MouseEventHandler<HTMLDivElement>;
+    className?: string;
+    role?: string;
+    "aria-label"?: string;
+    "aria-checked"?: boolean;
+    disabled?: boolean;
+    plated?: boolean;
+    redGlow?: boolean;
+    orangeGlow?: boolean;
+}
+export interface UserAreaRenderProps {
+    nameplate?: any;
+    iconForeground?: string;
+    hideTooltips?: boolean;
+}
+export type UserAreaButtonFactory = (props: UserAreaRenderProps) => ReactNode;
+export interface UserAreaButtonData {
+    render: UserAreaButtonFactory;
+    icon: ComponentType<{
+        className?: string;
+    }>;
+    priority?: number;
+}
+interface ButtonEntry {
+    render: UserAreaButtonFactory;
+    priority: number;
+}
+export declare const UserAreaButton: ComponentType<UserAreaButtonProps>;
+export declare const buttons: Map<string, ButtonEntry>;
+export declare function addUserAreaButton(id: string, render: UserAreaButtonFactory, priority?: number): void;
+export declare function removeUserAreaButton(id: string): void;
+export declare function _renderButtons(props: UserAreaRenderProps): import("react").JSX.Element[];
+export {};

package/api/index.d.ts

@@ -20,6 +20,7 @@ import * as $ServerList from "./ServerList";
 import * as $Settings from "./Settings";
 import * as $Styles from "./Styles";
 import * as $Themes from "./Themes";
+import * as $UserArea from "./UserArea";
 import * as $UserSettings from "./UserSettings";
 /**
  * An API allowing you to listen to Message Clicks or run your own logic
@@ -122,6 +123,10 @@ export declare const NicknameIcons: typeof $NicknameIcons;
  * An API allowing you to play internal Discord audio files or external audio URLs/URIs.
  */
 export declare const AudioPlayer: typeof $AudioPlayer;
+/**
+ * An API allowing you to add buttons to the user area panel.
+ */
+export declare const UserArea: typeof $UserArea;
 /**
  * Don't use this
  */

package/components/BaseText.d.ts

@@ -1,7 +1,7 @@
 import "./BaseText.css";
 import type { Text as DiscordText } from "@plexcord/discord-types";
 import type { ComponentPropsWithoutRef, ReactNode } from "react";
-declare const Sizes: {
+export declare const TextSizes: {
     readonly xxs: "0.625rem";
     readonly xs: "0.75rem";
     readonly sm: "0.875rem";
@@ -10,7 +10,7 @@ declare const Sizes: {
     readonly xl: "1.5rem";
     readonly xxl: "2rem";
 };
-declare const Weights: {
+export declare const TextWeights: {
     readonly thin: "100";
     readonly extralight: "200";
     readonly light: "300";
@@ -20,15 +20,27 @@ declare const Weights: {
     readonly bold: "700";
     readonly extrabold: "800";
 };
+export declare const TextColors: {
+    readonly "text-default": "var(--text-default)";
+    readonly "text-muted": "var(--text-muted)";
+    readonly "text-link": "var(--text-link)";
+    readonly "text-danger": "var(--redesign-button-danger-background)";
+    readonly "text-brand": "var(--text-brand)";
+    readonly "text-strong": "var(--text-strong)";
+    readonly "text-subtle": "var(--text-subtle)";
+    readonly "control-text-critical": "var(--control-text-critical-secondary-default)";
+    readonly "control-text-primary": "var(--control-primary-text-default)";
+};
 export declare function generateTextCss(): string;
-export type TextSize = keyof typeof Sizes;
-export type TextWeight = keyof typeof Weights;
+export type TextSize = keyof typeof TextSizes;
+export type TextWeight = keyof typeof TextWeights;
+export type TextColor = keyof typeof TextColors;
 export type TextTag = "div" | "span" | "p" | `h${1 | 2 | 3 | 4 | 5 | 6}`;
 export type BaseTextProps<Tag extends TextTag = "div"> = ComponentPropsWithoutRef<Tag> & {
     size?: TextSize;
     weight?: TextWeight;
+    color?: TextColor;
     tag?: Tag;
 };
 export declare function BaseText<T extends TextTag = "div">(props: BaseTextProps<T>): ReactNode;
 export declare const TextCompat: DiscordText;
-export {};

package/components/Flex.d.ts

@@ -4,5 +4,6 @@ export interface FlexProps extends HTMLAttributes<HTMLDivElement> {
     gap?: CSSProperties["gap"];
     justifyContent?: CSSProperties["justifyContent"];
     alignItems?: CSSProperties["alignItems"];
+    flexWrap?: CSSProperties["flexWrap"];
 }
-export declare function Flex({ flexDirection, gap, justifyContent, alignItems, children, style, ...restProps }: FlexProps): import("react").JSX.Element;
+export declare function Flex({ flexDirection, gap, justifyContent, alignItems, flexWrap, children, style, ...restProps }: FlexProps): import("react").JSX.Element;

package/components/Heart.d.ts

@@ -1,2 +1,6 @@
 import { SVGAttributes } from "react";
-export declare function Heart(props: SVGAttributes<SVGSVGElement>): import("react").JSX.Element;
+interface HeartProps extends SVGAttributes<SVGSVGElement> {
+    fill?: string;
+}
+export declare function Heart({ fill, ...props }: HeartProps): import("react").JSX.Element;
+export {};

package/components/Icons.d.ts

@@ -49,6 +49,7 @@ export declare function PluginsIcon(props: IconProps): import("react").JSX.Eleme
 export declare function CloudIcon(props: IconProps): import("react").JSX.Element;
 export declare function BackupRestoreIcon(props: IconProps): import("react").JSX.Element;
 export declare function UpdaterIcon(props: IconProps): import("react").JSX.Element;
+export declare function ChangelogIcon(props: IconProps): import("react").JSX.Element;
 export declare function PatchHelperIcon(props: IconProps): import("react").JSX.Element;
 export declare function PlextronSettingsIcon(props: IconProps): import("react").JSX.Element;
 export declare function EyeIcon(props: IconProps): import("react").JSX.Element;

package/components/Link.d.ts

@@ -1,5 +1,6 @@
-interface Props extends React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> {
+import "./Link.css";
+import type { AnchorHTMLAttributes, PropsWithChildren } from "react";
+export interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
     disabled?: boolean;
 }
-export declare function Link(props: React.PropsWithChildren<Props>): import("react").JSX.Element;
-export {};
+export declare function Link({ disabled, className, children, ...restProps }: PropsWithChildren<LinkProps>): import("react").JSX.Element;

package/components/Span.d.ts

@@ -1,3 +1,3 @@
 import { type BaseTextProps } from "./BaseText";
 export type SpanProps = BaseTextProps<"span">;
-export declare function Span({ children, ...restProps }: SpanProps): import("react").JSX.Element;
+export declare function Span({ children, size, weight, ...restProps }: SpanProps): import("react").JSX.Element;

package/components/TooltipContainer.d.ts

@@ -0,0 +1,4 @@
+import { TooltipProps } from "@plexcord/discord-types";
+export declare function TooltipContainer({ children, ...props }: Omit<TooltipProps, "children"> & {
+    children: React.ReactNode;
+}): import("react").JSX.Element;

package/components/TooltipFallback.d.ts

@@ -0,0 +1,3 @@
+import { Tooltip } from "@plexcord/discord-types";
+/** Don't use this */
+export declare const TooltipFallback: Tooltip;

package/components/settings/tabs/plugins/components/Common.d.ts

@@ -1,6 +1,6 @@
 import { DefinedSettings, PluginOptionBase } from "../../../../../utils/types";
 import { PropsWithChildren } from "react";
-export declare const cl: (...args: (string | false | 0 | string[] | Record<string, unknown> | null | undefined)[]) => string;
+export declare const cl: (...args: import("../../../../../utils/css").ClassNameFactoryArg[]) => string;
 interface SettingBaseProps<T> {
     option: T;
     onChange(newValue: any): void;

package/components/settings/tabs/plugins/index.d.ts

@@ -1,7 +1,7 @@
 import "./styles.css";
 import { Logger } from "../../../../utils/Logger";
 import { JSX } from "react";
-export declare const cl: (...args: (string | false | 0 | string[] | Record<string, unknown> | null | undefined)[]) => string;
+export declare const cl: (...args: import("../../../../utils/css").ClassNameFactoryArg[]) => string;
 export declare const logger: Logger;
 export declare function showErrorToast(message: string): void;
 export declare function getExcludedReasons(): Record<"web" | "discordDesktop" | "plextron" | "desktop" | "dev", string>;