fix FriendsSince

src/plugins/friendsSince/index.tsx

@@ -9,9 +9,8 @@ import { Devs } from "@utils/constants";
 import { getCurrentChannel } from "@utils/discord";
 import definePlugin from "@utils/types";
 import { findByPropsLazy } from "@webpack";
-import { React, RelationshipStore } from "@webpack/common";
+import { Heading, React, RelationshipStore, Text } from "@webpack/common";
 
-const { Heading, Text } = findByPropsLazy("Heading", "Text");
 const container = findByPropsLazy("memberSinceWrapper");
 const { getCreatedAtDate } = findByPropsLazy("getCreatedAtDate");
 const clydeMoreInfo = findByPropsLazy("clydeMoreInfo");

src/webpack/common/components.ts

@@ -36,6 +36,7 @@ export let Tooltip: t.Tooltip;
 export let TextInput: t.TextInput;
 export let TextArea: t.TextArea;
 export let Text: t.Text;
+export let Heading: t.HeadingTag;
 export let Select: t.Select;
 export let SearchableSelect: t.SearchableSelect;
 export let Slider: t.Slider;
@@ -59,6 +60,28 @@ export const Flex = waitForComponent<t.Flex>("Flex", ["Justify", "Align", "Wrap"
 export const { OAuth2AuthorizeModal } = findByPropsLazy("OAuth2AuthorizeModal");
 
 waitFor(["FormItem", "Button"], m => {
-    ({ useToken, Card, Button, FormSwitch: Switch, Tooltip, TextInput, TextArea, Text, Select, SearchableSelect, Slider, ButtonLooks, TabBar, Popout, Dialog, Paginator, ScrollerThin, Clickable, Avatar, FocusLock } = m);
+    ({
+        useToken,
+        Card,
+        Button,
+        FormSwitch: Switch,
+        Tooltip,
+        TextInput,
+        TextArea,
+        Text,
+        Select,
+        SearchableSelect,
+        Slider,
+        ButtonLooks,
+        TabBar,
+        Popout,
+        Dialog,
+        Paginator,
+        ScrollerThin,
+        Clickable,
+        Avatar,
+        FocusLock,
+        Heading
+    } = m);
     Forms = m;
 });

src/webpack/common/types/components.d.ts

@@ -20,23 +20,24 @@ import type { ComponentType, CSSProperties, FunctionComponent, HtmlHTMLAttribute
 
 export type TextVariant = "heading-sm/normal" | "heading-sm/medium" | "heading-sm/semibold" | "heading-sm/bold" | "heading-md/normal" | "heading-md/medium" | "heading-md/semibold" | "heading-md/bold" | "heading-lg/normal" | "heading-lg/medium" | "heading-lg/semibold" | "heading-lg/bold" | "heading-xl/normal" | "heading-xl/medium" | "heading-xl/bold" | "heading-xxl/normal" | "heading-xxl/medium" | "heading-xxl/bold" | "eyebrow" | "heading-deprecated-14/normal" | "heading-deprecated-14/medium" | "heading-deprecated-14/bold" | "text-xxs/normal" | "text-xxs/medium" | "text-xxs/semibold" | "text-xxs/bold" | "text-xs/normal" | "text-xs/medium" | "text-xs/semibold" | "text-xs/bold" | "text-sm/normal" | "text-sm/medium" | "text-sm/semibold" | "text-sm/bold" | "text-md/normal" | "text-md/medium" | "text-md/semibold" | "text-md/bold" | "text-lg/normal" | "text-lg/medium" | "text-lg/semibold" | "text-lg/bold" | "display-sm" | "display-md" | "display-lg" | "code";
 export type FormTextTypes = Record<"DEFAULT" | "INPUT_PLACEHOLDER" | "DESCRIPTION" | "LABEL_BOLD" | "LABEL_SELECTED" | "LABEL_DESCRIPTOR" | "ERROR" | "SUCCESS", string>;
-export type Heading = `h${1 | 2 | 3 | 4 | 5 | 6}`;
+export type HeadingTag = `h${1 | 2 | 3 | 4 | 5 | 6}`;
 
 export type Margins = Record<"marginTop16" | "marginTop8" | "marginBottom8" | "marginTop20" | "marginBottom20", string>;
 export type ButtonLooks = Record<"FILLED" | "INVERTED" | "OUTLINED" | "LINK" | "BLANK", string>;
 
 export type TextProps = PropsWithChildren<HtmlHTMLAttributes<HTMLDivElement> & {
     variant?: TextVariant;
-    tag?: "div" | "span" | "p" | "strong" | Heading;
+    tag?: "div" | "span" | "p" | "strong" | HeadingTag;
     selectable?: boolean;
     lineClamp?: number;
 }>;
 
 export type Text = ComponentType<TextProps>;
+export type Heading = ComponentType<TextProps>;
 
 export type FormTitle = ComponentType<HTMLProps<HTMLTitleElement> & PropsWithChildren<{
     /** default is h5 */
-    tag?: Heading;
+    tag?: HeadingTag;
     faded?: boolean;
     disabled?: boolean;
     required?: boolean;
@@ -45,7 +46,7 @@ export type FormTitle = ComponentType<HTMLProps<HTMLTitleElement> & PropsWithChi
 
 export type FormSection = ComponentType<PropsWithChildren<{
     /** default is h5 */
-    tag?: Heading;
+    tag?: HeadingTag;
     className?: string;
     titleClassName?: string;
     titleId?: string;
@@ -455,5 +456,5 @@ export type Avatar = ComponentType<PropsWithChildren<{
 }>>;
 
 type FocusLock = ComponentType<PropsWithChildren<{
-    containerRef: RefObject<HTMLElement>
+    containerRef: RefObject<HTMLElement>;
 }>>;