diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts index a8fd21381..cae3d2421 100644 --- a/packages/core/src/components.d.ts +++ b/packages/core/src/components.d.ts @@ -402,9 +402,9 @@ export namespace Components { */ "timestamp": DiscordTimestamp; /** - * The type of system message this is, this will change the icon shown. Valid values: `join`, `leave`, `call`, `missed-call`, `boost`, `edit`, `thread`, `alert`, and `error`. + * The type of system message this is, this will change the icon shown. Valid values: `join`, `leave`, `call`, `missed-call`, `boost`, `edit`, `thread`, `pin`, `alert`, and `error`. */ - "type": 'join' | 'leave' | 'call' | 'missed-call' | 'boost' | 'edit' | 'thread' | 'alert' | 'error'; + "type": 'join' | 'leave' | 'call' | 'missed-call' | 'boost' | 'edit' | 'thread' | 'pin' | 'alert' | 'error'; } interface DiscordTenorVideo { /** @@ -1077,9 +1077,9 @@ declare namespace LocalJSX { */ "timestamp"?: DiscordTimestamp; /** - * The type of system message this is, this will change the icon shown. Valid values: `join`, `leave`, `call`, `missed-call`, `boost`, `edit`, `thread`, `alert`, and `error`. + * The type of system message this is, this will change the icon shown. Valid values: `join`, `leave`, `call`, `missed-call`, `boost`, `edit`, `thread`, `pin`, `alert`, and `error`. */ - "type"?: 'join' | 'leave' | 'call' | 'missed-call' | 'boost' | 'edit' | 'thread' | 'alert' | 'error'; + "type"?: 'join' | 'leave' | 'call' | 'missed-call' | 'boost' | 'edit' | 'thread' | 'pin' | 'alert' | 'error'; } interface DiscordTenorVideo { /** diff --git a/packages/core/src/components/discord-mention/discord-mention.tsx b/packages/core/src/components/discord-mention/discord-mention.tsx index 0e9a529bb..d9d298f0b 100644 --- a/packages/core/src/components/discord-mention/discord-mention.tsx +++ b/packages/core/src/components/discord-mention/discord-mention.tsx @@ -1,10 +1,10 @@ import { Component, ComponentInterface, Element, h, Host, Prop, Watch } from '@stencil/core'; import hexToRgba from 'hex-to-rgba'; +import ChannelForum from '../svgs/channel-forum'; +import ChannelIcon from '../svgs/channel-icon'; import ChannelThread from '../svgs/channel-thread'; import LockedVoiceChannel from '../svgs/locked-voice-channel'; import VoiceChannel from '../svgs/voice-channel'; -import ChannelIcon from '../svgs/channel-icon'; -import ChannelForum from '../svgs/channel-forum'; @Component({ tag: 'discord-mention', diff --git a/packages/core/src/components/discord-system-message/discord-system-message.tsx b/packages/core/src/components/discord-system-message/discord-system-message.tsx index c886b2137..daee8ccf3 100644 --- a/packages/core/src/components/discord-system-message/discord-system-message.tsx +++ b/packages/core/src/components/discord-system-message/discord-system-message.tsx @@ -5,6 +5,7 @@ import Boost from '../svgs/boost'; import DMCall from '../svgs/dm-call'; import DMEdit from '../svgs/dm-edit'; import DMMissedCall from '../svgs/dm-missed-call'; +import Pin from '../svgs/pin'; import SystemAlert from '../svgs/system-alert'; import SystemError from '../svgs/system-error'; import Thread from '../svgs/thread'; @@ -30,10 +31,10 @@ export class DiscordSystemMessage implements ComponentInterface { /** * The type of system message this is, this will change the icon shown. - * Valid values: `join`, `leave`, `call`, `missed-call`, `boost`, `edit`, `thread`, `alert`, and `error`. + * Valid values: `join`, `leave`, `call`, `missed-call`, `boost`, `edit`, `thread`, `pin`, `alert`, and `error`. */ @Prop() - public type: 'join' | 'leave' | 'call' | 'missed-call' | 'boost' | 'edit' | 'thread' | 'alert' | 'error' = 'join'; + public type: 'join' | 'leave' | 'call' | 'missed-call' | 'boost' | 'edit' | 'thread' | 'pin' | 'alert' | 'error' = 'join'; /** * Whether this message is to show channel name changes, used to match Discord's style. @@ -45,9 +46,9 @@ export class DiscordSystemMessage implements ComponentInterface { public handleType(value: string) { if (typeof value !== 'string') { throw new TypeError('DiscordSystemMessage `type` prop must be a string.'); - } else if (!['join', 'leave', 'call', 'missed-call', 'boost', 'edit', 'thread', 'alert', 'error'].includes(value)) { + } else if (!['join', 'leave', 'call', 'missed-call', 'boost', 'edit', 'thread', 'pin', 'alert', 'error'].includes(value)) { throw new RangeError( - "DiscordSystemMessage `type` prop must be one of: 'join', 'leave', 'call', 'missed-call', 'boost', 'edit', 'thread' 'alert', 'error'" + "DiscordSystemMessage `type` prop must be one of: 'join', 'leave', 'call', 'missed-call', 'boost', 'edit', 'pin', 'thread' 'alert', 'error'" ); } } @@ -98,6 +99,9 @@ export class DiscordSystemMessage implements ComponentInterface { case 'error': icon = ; break; + case 'pin': + icon = ; + break; } const hasThread: boolean = diff --git a/packages/core/src/components/discord-system-message/readme.md b/packages/core/src/components/discord-system-message/readme.md index c3ee1b2e1..33902ca65 100644 --- a/packages/core/src/components/discord-system-message/readme.md +++ b/packages/core/src/components/discord-system-message/readme.md @@ -4,11 +4,11 @@ ## Properties -| Property | Attribute | Description | Type | Default | -| ------------- | -------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------- | ------------ | -| `channelName` | `channel-name` | Whether this message is to show channel name changes, used to match Discord's style. | `boolean` | `false` | -| `timestamp` | `timestamp` | The timestamp to use for the message date. | `Date \| null \| string` | `new Date()` | -| `type` | `type` | The type of system message this is, this will change the icon shown. Valid values: `join`, `leave`, `call`, `missed-call`, `boost`, `edit`, `thread`, `alert`, and `error`. | `"alert" \| "boost" \| "call" \| "edit" \| "error" \| "join" \| "leave" \| "missed-call" \| "thread"` | `'join'` | +| Property | Attribute | Description | Type | Default | +| ------------- | -------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------- | ------------ | +| `channelName` | `channel-name` | Whether this message is to show channel name changes, used to match Discord's style. | `boolean` | `false` | +| `timestamp` | `timestamp` | The timestamp to use for the message date. | `Date \| null \| string` | `new Date()` | +| `type` | `type` | The type of system message this is, this will change the icon shown. Valid values: `join`, `leave`, `call`, `missed-call`, `boost`, `edit`, `thread`, `pin`, `alert`, and `error`. | `"alert" \| "boost" \| "call" \| "edit" \| "error" \| "join" \| "leave" \| "missed-call" \| "pin" \| "thread"` | `'join'` | --- diff --git a/packages/core/src/components/svgs/pin.tsx b/packages/core/src/components/svgs/pin.tsx new file mode 100644 index 000000000..ffd1e6a39 --- /dev/null +++ b/packages/core/src/components/svgs/pin.tsx @@ -0,0 +1,12 @@ +import { h } from '@stencil/core'; + +export default function Pin(props: T) { + return ( + + + + ); +}