natty
/
calckey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 🐛 non-duplicate skin tone selection

This commit is contained in:
ThatOneCalculator 2023-06-23 17:47:07 -07:00
parent b6dd48a375
commit 2f38f228d6
No known key found for this signature in database
GPG Key ID: 8703CACD01000000
1 changed files with 19 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
packages/client/src/components/MkEmojiPicker.section.vue
View File

@ -14,7 +14,11 @@
<button
v-for="skinTone in props.skinTones"
class="_button"
@click="applySkinTone(props.skinTones.indexOf(skinTone) + 1)"
@click.prevent="
applyUnicodeSkinTone(
props.skinTones.indexOf(skinTone) + 1
)
"
>
<i
class="ph-circle ph-fill ph-fw ph-lg"
@ -39,6 +43,7 @@
<script lang="ts" setup>
import { ref, watch, onMounted } from "vue";
import { addSkinTone } from "@/scripts/emojilist";
import emojiComponents from "unicode-emoji-json/data-emoji-components.json";
const props = defineProps<{
emojis: string[];
@ -49,8 +54,19 @@ const props = defineProps<{
const localEmojis = ref([...props.emojis]);
function applySkinTone(custom?: number) {
function applyUnicodeSkinTone(custom?: number) {
for (let i = 0; i < localEmojis.value.length; i++) {
if (
[
emojiComponents.light_skin_tone,
emojiComponents.medium_light_skin_tone,
emojiComponents.medium_skin_tone,
emojiComponents.medium_dark_skin_tone,
emojiComponents.dark_skin_tone,
].some((v) => localEmojis.value[i].endsWith(v))
) {
localEmojis.value[i] = localEmojis.value[i].slice(0, -1);
}
localEmojis.value[i] = addSkinTone(localEmojis.value[i], custom);
}
}
@ -63,7 +79,7 @@ const shown = ref(!!props.initialShown);
onMounted(() => {
if (props.skinToneSelector) {
applySkinTone();
applyUnicodeSkinTone();
}
});