@chayns-components/emoji-input 5.0.0-beta.96 → 5.0.0-beta.98
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -67,6 +67,11 @@ const StyledEmojiInputEditor = _styledComponents.default.div`
|
|
|
67
67
|
overflow-y: scroll;
|
|
68
68
|
word-break: break-word;
|
|
69
69
|
|
|
70
|
+
// This fixes a bug where the field is not editable in certain browsers.
|
|
71
|
+
// This is for example the case on iOS 15 or older.
|
|
72
|
+
-webkit-user-modify: read-write;
|
|
73
|
+
-webkit-user-select: text;
|
|
74
|
+
|
|
70
75
|
${_ref6 => {
|
|
71
76
|
let {
|
|
72
77
|
isMobile,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmojiInput.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","StyledEmojiInput","styled","div","_ref","theme","_ref2","isDisabled","_ref3","exports","StyledEmojiInputContent","_ref4","isRightElementGiven","css","StyledEmojiInputEditor","_ref5","text","_ref6","isMobile","rootFontFamily","_ref7","placeholder","_ref8","_ref9","_ref10","StyledEmojiInputRightWrapper"],"sources":["../../../src/components/emoji-input/EmojiInput.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled, { css } from 'styled-components';\nimport type { EmojiInputProps } from './EmojiInput';\n\ntype StyledEmojiInputProps = WithTheme<Pick<EmojiInputProps, 'isDisabled'>>;\n\nexport const StyledEmojiInput = styled.div<StyledEmojiInputProps>`\n align-items: center;\n background-color: ${({ theme }: StyledEmojiInputProps) => theme['100']};\n border-radius: 3px;\n display: flex;\n min-height: 42px;\n opacity: ${({ isDisabled }) => (isDisabled ? 0.5 : 1)};\n pointer-events: ${({ isDisabled }) => (isDisabled ? 'none' : 'initial')};\n position: relative;\n transition: opacity 0.3s ease;\n`;\n\ntype StyledEmojiInputContentProps = {\n isRightElementGiven: boolean;\n};\n\nexport const StyledEmojiInputContent = styled.div<StyledEmojiInputContentProps>`\n align-items: end;\n border: 1px solid rgba(160, 160, 160, 0.3);\n border-radius: 3px;\n display: flex;\n flex: 1 1 auto;\n gap: 10px;\n padding: 8px 10px;\n\n ${({ isRightElementGiven }) =>\n isRightElementGiven &&\n css`\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right-width: 0;\n `}\n`;\n\ntype StyledEmojiInputEditorProps = WithTheme<Pick<EmojiInputProps, 'placeholder'>> & {\n isMobile: boolean;\n rootFontFamily: string;\n};\n\nexport const StyledEmojiInputEditor = styled.div<StyledEmojiInputEditorProps>`\n color: ${({ theme }: StyledEmojiInputEditorProps) => theme.text};\n flex: 1 1 auto;\n max-height: 210px;\n overflow-y: scroll;\n word-break: break-word;\n\n ${({ isMobile, rootFontFamily }) => {\n if (isMobile) {\n return css`\n font-family: ${rootFontFamily};\n `;\n }\n\n return css`\n font-family: ${rootFontFamily}, 'Noto Color Emoji';\n `;\n }}\n\n &:empty:not(:focus):before {\n content: '${({ placeholder }) => placeholder}';\n color: ${({ theme }: StyledEmojiInputEditorProps) => theme['006']};\n pointer-events: none;\n }\n\n // Styles for custom scrollbar\n ::-webkit-scrollbar {\n width: 5px;\n }\n\n ::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n ::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: rgba(\n ${({ theme }: StyledEmojiInputEditorProps) => theme['text-rgb']},\n 0.15\n );\n border-radius: 20px;\n }\n\n // Scrollbar styles for Firefox. The above styles are not supported in Firefox, these styles are\n // only supported in Firefox:\n * {\n scrollbar-color: rgba(\n ${({ theme }: StyledEmojiInputEditorProps) => theme['text-rgb']},\n 0.15\n )\n transparent;\n scrollbar-width: thin;\n }\n`;\n\nexport const StyledEmojiInputRightWrapper = styled.div`\n align-self: stretch;\n border-bottom-right-radius: 3px;\n border-top-right-radius: 3px;\n flex: 0 0 auto;\n overflow: hidden;\n`;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"EmojiInput.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","StyledEmojiInput","styled","div","_ref","theme","_ref2","isDisabled","_ref3","exports","StyledEmojiInputContent","_ref4","isRightElementGiven","css","StyledEmojiInputEditor","_ref5","text","_ref6","isMobile","rootFontFamily","_ref7","placeholder","_ref8","_ref9","_ref10","StyledEmojiInputRightWrapper"],"sources":["../../../src/components/emoji-input/EmojiInput.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled, { css } from 'styled-components';\nimport type { EmojiInputProps } from './EmojiInput';\n\ntype StyledEmojiInputProps = WithTheme<Pick<EmojiInputProps, 'isDisabled'>>;\n\nexport const StyledEmojiInput = styled.div<StyledEmojiInputProps>`\n align-items: center;\n background-color: ${({ theme }: StyledEmojiInputProps) => theme['100']};\n border-radius: 3px;\n display: flex;\n min-height: 42px;\n opacity: ${({ isDisabled }) => (isDisabled ? 0.5 : 1)};\n pointer-events: ${({ isDisabled }) => (isDisabled ? 'none' : 'initial')};\n position: relative;\n transition: opacity 0.3s ease;\n`;\n\ntype StyledEmojiInputContentProps = {\n isRightElementGiven: boolean;\n};\n\nexport const StyledEmojiInputContent = styled.div<StyledEmojiInputContentProps>`\n align-items: end;\n border: 1px solid rgba(160, 160, 160, 0.3);\n border-radius: 3px;\n display: flex;\n flex: 1 1 auto;\n gap: 10px;\n padding: 8px 10px;\n\n ${({ isRightElementGiven }) =>\n isRightElementGiven &&\n css`\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right-width: 0;\n `}\n`;\n\ntype StyledEmojiInputEditorProps = WithTheme<Pick<EmojiInputProps, 'placeholder'>> & {\n isMobile: boolean;\n rootFontFamily: string;\n};\n\nexport const StyledEmojiInputEditor = styled.div<StyledEmojiInputEditorProps>`\n color: ${({ theme }: StyledEmojiInputEditorProps) => theme.text};\n flex: 1 1 auto;\n max-height: 210px;\n overflow-y: scroll;\n word-break: break-word;\n\n // This fixes a bug where the field is not editable in certain browsers.\n // This is for example the case on iOS 15 or older.\n -webkit-user-modify: read-write;\n -webkit-user-select: text;\n\n ${({ isMobile, rootFontFamily }) => {\n if (isMobile) {\n return css`\n font-family: ${rootFontFamily};\n `;\n }\n\n return css`\n font-family: ${rootFontFamily}, 'Noto Color Emoji';\n `;\n }}\n\n &:empty:not(:focus):before {\n content: '${({ placeholder }) => placeholder}';\n color: ${({ theme }: StyledEmojiInputEditorProps) => theme['006']};\n pointer-events: none;\n }\n\n // Styles for custom scrollbar\n ::-webkit-scrollbar {\n width: 5px;\n }\n\n ::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n ::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: rgba(\n ${({ theme }: StyledEmojiInputEditorProps) => theme['text-rgb']},\n 0.15\n );\n border-radius: 20px;\n }\n\n // Scrollbar styles for Firefox. The above styles are not supported in Firefox, these styles are\n // only supported in Firefox:\n * {\n scrollbar-color: rgba(\n ${({ theme }: StyledEmojiInputEditorProps) => theme['text-rgb']},\n 0.15\n )\n transparent;\n scrollbar-width: thin;\n }\n`;\n\nexport const StyledEmojiInputRightWrapper = styled.div`\n align-self: stretch;\n border-bottom-right-radius: 3px;\n border-top-right-radius: 3px;\n flex: 0 0 auto;\n overflow: hidden;\n`;\n"],"mappings":"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"}
|
package/lib/utils/emoji.js
CHANGED
|
@@ -58,6 +58,7 @@ const unescapeHTML = text => {
|
|
|
58
58
|
};
|
|
59
59
|
const convertEmojisToUnicode = text => {
|
|
60
60
|
let result = text;
|
|
61
|
+
result = result.replace(/https?:\/\/.*?(?=$|\s)/gi, fullMatch => fullMatch.replace(/:/g, '%3A'));
|
|
61
62
|
result = result.replace(_emoji.regShortnames, shortname => {
|
|
62
63
|
if (shortname) {
|
|
63
64
|
const unicode = _emoji.shortNameList[shortname];
|
|
@@ -67,6 +68,7 @@ const convertEmojisToUnicode = text => {
|
|
|
67
68
|
}
|
|
68
69
|
return shortname;
|
|
69
70
|
});
|
|
71
|
+
result = result.replace(/https?%3A\/\/.*?(?=$|\s)/gi, fullMatch => fullMatch.replace(/%3A/g, ':'));
|
|
70
72
|
result = result.replace(_emoji.regAscii, (fullMatch, m1, m2, m3) => {
|
|
71
73
|
if (typeof m3 === 'string' && m3 !== '') {
|
|
72
74
|
const unicode = _emoji.asciiList[unescapeHTML(m3)];
|
package/lib/utils/emoji.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"emoji.js","names":["_dataByEmoji","_interopRequireDefault","require","_emoji","obj","__esModule","default","convert","unicode","indexOf","parts","s","split","i","length","part","parseInt","hi","Math","floor","lo","String","fromCharCode","push","join","unescapeHTML","text","unescaped","replace","match","_unescaped$match","convertEmojisToUnicode","result","regShortnames","shortname","shortNameList","toUpperCase","regAscii","
|
|
1
|
+
{"version":3,"file":"emoji.js","names":["_dataByEmoji","_interopRequireDefault","require","_emoji","obj","__esModule","default","convert","unicode","indexOf","parts","s","split","i","length","part","parseInt","hi","Math","floor","lo","String","fromCharCode","push","join","unescapeHTML","text","unescaped","replace","match","_unescaped$match","convertEmojisToUnicode","result","fullMatch","regShortnames","shortname","shortNameList","toUpperCase","regAscii","m1","m2","m3","asciiList","exports","addSkinToneToEmoji","emoji","skinTone","map","rawEmoji","_emojiList$rawEmoji","emojiList","skin_tone_support"],"sources":["../../src/utils/emoji.ts"],"sourcesContent":["import emojiList from 'unicode-emoji-json/data-by-emoji.json';\nimport { asciiList, regAscii, regShortnames, shortNameList } from '../constants/emoji';\n\nconst convert = (unicode: string) => {\n if (unicode.indexOf('-') > -1) {\n const parts = [];\n\n const s = unicode.split('-');\n\n for (let i = 0; i < s.length; i++) {\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n let part: number | string = parseInt(s[i]!, 16);\n\n if (part >= 0x10000 && part <= 0x10ffff) {\n const hi = Math.floor((part - 0x10000) / 0x400) + 0xd800;\n const lo = ((part - 0x10000) % 0x400) + 0xdc00;\n\n part = String.fromCharCode(hi) + String.fromCharCode(lo);\n } else {\n part = String.fromCharCode(part);\n }\n\n parts.push(part);\n }\n\n return parts.join('');\n }\n\n const s = parseInt(unicode, 16);\n\n if (s >= 0x10000 && s <= 0x10ffff) {\n const hi = Math.floor((s - 0x10000) / 0x400) + 0xd800;\n const lo = ((s - 0x10000) % 0x400) + 0xdc00;\n\n return String.fromCharCode(hi) + String.fromCharCode(lo);\n }\n\n return String.fromCharCode(s);\n};\n\nconst unescapeHTML = (text: string) => {\n const unescaped: { [key: string]: string } = {\n '&': '&',\n '&': '&',\n '&': '&',\n '<': '<',\n '<': '<',\n '<': '<',\n '>': '>',\n '>': '>',\n '>': '>',\n '"': '\"',\n '"': '\"',\n '"': '\"',\n ''': \"'\",\n ''': \"'\",\n ''': \"'\",\n };\n\n return text.replace(\n /&(?:amp|#38|#x26|lt|#60|#x3C|gt|#62|#x3E|apos|#39|#x27|quot|#34|#x22);/gi,\n (match) => unescaped[match] ?? match\n );\n};\n\nexport const convertEmojisToUnicode = (text: string): string => {\n let result = text;\n\n result = result.replace(/https?:\\/\\/.*?(?=$|\\s)/gi, (fullMatch) =>\n fullMatch.replace(/:/g, '%3A')\n );\n\n result = result.replace(regShortnames, (shortname) => {\n if (shortname) {\n const unicode = shortNameList[shortname];\n\n if (unicode) {\n return convert(unicode.toUpperCase());\n }\n }\n\n return shortname;\n });\n\n result = result.replace(/https?%3A\\/\\/.*?(?=$|\\s)/gi, (fullMatch) =>\n fullMatch.replace(/%3A/g, ':')\n );\n\n result = result.replace(regAscii, (fullMatch, m1, m2, m3) => {\n if (typeof m3 === 'string' && m3 !== '') {\n const unicode = asciiList[unescapeHTML(m3)];\n\n if (unicode) {\n return (m2 as string) + convert(unicode.toUpperCase());\n }\n }\n\n return fullMatch;\n });\n\n return result;\n};\n\nexport const addSkinToneToEmoji = (emoji: string, skinTone: string): string =>\n emoji\n .split('\\u{200D}')\n .map((rawEmoji) => {\n const parts = [rawEmoji.replace(/\\ufe0f/, '')];\n\n // @ts-expect-error: Difficult to type external json file\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n if (emojiList[rawEmoji]?.skin_tone_support) {\n parts.push(skinTone);\n }\n\n return parts.join('');\n })\n .join('\\u{200D}');\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/emoji-input",
|
|
3
|
-
"version": "5.0.0-beta.
|
|
3
|
+
"version": "5.0.0-beta.98",
|
|
4
4
|
"description": "Input field that supports HTML elements and emojis",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"chayns",
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
39
|
"@babel/cli": "^7.21.0",
|
|
40
|
-
"@babel/core": "^7.21.
|
|
40
|
+
"@babel/core": "^7.21.3",
|
|
41
41
|
"@babel/preset-env": "^7.20.2",
|
|
42
42
|
"@babel/preset-react": "^7.18.6",
|
|
43
43
|
"@babel/preset-typescript": "^7.21.0",
|
|
@@ -52,12 +52,12 @@
|
|
|
52
52
|
"typescript": "^4.9.5"
|
|
53
53
|
},
|
|
54
54
|
"dependencies": {
|
|
55
|
-
"@chayns-components/core": "^5.0.0-beta.
|
|
55
|
+
"@chayns-components/core": "^5.0.0-beta.98",
|
|
56
56
|
"@chayns/colors": "^2.0.0",
|
|
57
57
|
"clsx": "^1.2.1",
|
|
58
|
-
"emojilib": "^3.0.
|
|
58
|
+
"emojilib": "^3.0.9",
|
|
59
59
|
"framer-motion": "^6.5.1",
|
|
60
|
-
"styled-components": "^5.3.
|
|
60
|
+
"styled-components": "^5.3.9",
|
|
61
61
|
"unicode-emoji-json": "^0.5.0",
|
|
62
62
|
"uuid": "^9.0.0"
|
|
63
63
|
},
|
|
@@ -68,5 +68,5 @@
|
|
|
68
68
|
"publishConfig": {
|
|
69
69
|
"access": "public"
|
|
70
70
|
},
|
|
71
|
-
"gitHead": "
|
|
71
|
+
"gitHead": "ee7237bbc5e9a51e98268f74989f98da251255c1"
|
|
72
72
|
}
|