@chayns-components/emoji-input 5.0.0-beta.559 → 5.0.0-beta.561
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.
- package/lib/api/item-storage/get.js.map +1 -1
- package/lib/api/item-storage/put.js.map +1 -1
- package/lib/components/emoji-input/EmojiInput.js.map +1 -1
- package/lib/components/emoji-input/EmojiInput.styles.d.ts +12 -12
- package/lib/components/emoji-input/EmojiInput.styles.js.map +1 -1
- package/lib/components/emoji-input/prefix-element/PrefixElement.js.map +1 -1
- package/lib/components/emoji-input/prefix-element/PrefixElement.styles.js.map +1 -1
- package/lib/components/emoji-picker/EmojiPicker.js.map +1 -1
- package/lib/components/emoji-picker/EmojiPicker.styles.js.map +1 -1
- package/lib/components/emoji-picker/emoji-picker-categories/EmojiPickerCategories.js.map +1 -1
- package/lib/components/emoji-picker/emoji-picker-categories/EmojiPickerCategories.styles.d.ts +6 -6
- package/lib/components/emoji-picker/emoji-picker-categories/EmojiPickerCategories.styles.js.map +1 -1
- package/lib/components/emoji-picker/emoji-picker-emojis/EmojiPickerEmojis.js +0 -1
- package/lib/components/emoji-picker/emoji-picker-emojis/EmojiPickerEmojis.js.map +1 -1
- package/lib/components/emoji-picker/emoji-picker-emojis/EmojiPickerEmojis.styles.js.map +1 -1
- package/lib/components/emoji-picker/emoji-picker-emojis/emoji/Emoji.js.map +1 -1
- package/lib/components/emoji-picker/emoji-picker-emojis/emoji/Emoji.styles.js.map +1 -1
- package/lib/components/emoji-picker/emoji-picker-emojis/emoji/skin-tone-popup/SkinTonePopup.js.map +1 -1
- package/lib/components/emoji-picker/emoji-picker-emojis/emoji/skin-tone-popup/SkinTonePopup.styles.d.ts +6 -6
- package/lib/components/emoji-picker/emoji-picker-emojis/emoji/skin-tone-popup/SkinTonePopup.styles.js.map +1 -1
- package/lib/components/emoji-picker-popup/EmojiPickerPopup.js.map +1 -1
- package/lib/components/emoji-picker-popup/EmojiPickerPopup.styles.d.ts +6 -6
- package/lib/components/emoji-picker-popup/EmojiPickerPopup.styles.js.map +1 -1
- package/lib/constants/alignment.js.map +1 -1
- package/lib/constants/categories.js.map +1 -1
- package/lib/constants/emoji.js.map +1 -1
- package/lib/constants/externalServerUrl.js.map +1 -1
- package/lib/constants/regex.js.map +1 -1
- package/lib/hooks/emojiHistory.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib/types/api.js.map +1 -1
- package/lib/types/category.js.map +1 -1
- package/lib/utils/emoji.js.map +1 -1
- package/lib/utils/environment.js.map +1 -1
- package/lib/utils/font.js.map +1 -1
- package/lib/utils/insert.js.map +1 -1
- package/lib/utils/number.js.map +1 -1
- package/lib/utils/selection.js.map +1 -1
- package/lib/utils/text.js.map +1 -1
- package/package.json +13 -13
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get.js","names":["ITEM_STORAGE_BASE_URL","getEmojiHistory","_ref","accessToken","personId","requestInit","headers","Authorization","method","url","response","fetch","status","data","json","value","e"],"sources":["../../../src/api/item-storage/get.ts"],"sourcesContent":["import { ITEM_STORAGE_BASE_URL } from '../../constants/externalServerUrl';\nimport type { HistoryItem } from '../../hooks/emojiHistory';\nimport type { ApiFunctionResult } from '../../types/api';\n\ninterface GetEmojiHistoryOptions {\n accessToken: string;\n personId: string;\n}\n\ninterface GetEmojiHistoryResponseData {\n key: string;\n personId: string;\n schemeId: string;\n value: HistoryItem[];\n}\n\nexport const getEmojiHistory = async ({\n accessToken,\n personId,\n}: GetEmojiHistoryOptions): Promise<ApiFunctionResult<HistoryItem[]>> => {\n const requestInit: RequestInit = {\n headers: {\n Authorization: `Bearer ${accessToken}`,\n },\n method: 'GET',\n };\n\n const url = `${ITEM_STORAGE_BASE_URL}/7/users/${personId}/keys/emojis`;\n\n const response = await fetch(url, requestInit);\n\n if (response.status === 200) {\n try {\n const data = (await response.json()) as GetEmojiHistoryResponseData;\n\n return { data: data.value, status: 200 };\n } catch (e) {\n // Do nothing\n }\n }\n\n return { status: response.status };\n};\n"],"mappings":"AAAA,SAASA,qBAAqB,QAAQ,mCAAmC;AAgBzE,OAAO,MAAMC,eAAe,GAAG,MAAAC,IAAA,IAG0C;EAAA,IAHnC;IAClCC,WAAW;IACXC;EACoB,CAAC,GAAAF,IAAA;EACrB,MAAMG,WAAwB,GAAG;IAC7BC,OAAO,EAAE;MACLC,aAAa,EAAG,UAASJ,WAAY;IACzC,CAAC;IACDK,MAAM,EAAE;EACZ,CAAC;EAED,MAAMC,GAAG,GAAI,GAAET,qBAAsB,YAAWI,QAAS,cAAa;EAEtE,MAAMM,QAAQ,GAAG,MAAMC,KAAK,CAACF,GAAG,EAAEJ,WAAW,CAAC;EAE9C,IAAIK,QAAQ,CAACE,MAAM,KAAK,GAAG,EAAE;IACzB,IAAI;MACA,MAAMC,IAAI,GAAI,MAAMH,QAAQ,CAACI,IAAI,CAAC,CAAiC;MAEnE,OAAO;QAAED,IAAI,EAAEA,IAAI,CAACE,KAAK;QAAEH,MAAM,EAAE;MAAI,CAAC;IAC5C,CAAC,CAAC,OAAOI,CAAC,EAAE;MACR;IAAA;EAER;EAEA,OAAO;IAAEJ,MAAM,EAAEF,QAAQ,CAACE;EAAO,CAAC;AACtC,CAAC"}
|
|
1
|
+
{"version":3,"file":"get.js","names":["ITEM_STORAGE_BASE_URL","getEmojiHistory","_ref","accessToken","personId","requestInit","headers","Authorization","method","url","response","fetch","status","data","json","value","e"],"sources":["../../../src/api/item-storage/get.ts"],"sourcesContent":["import { ITEM_STORAGE_BASE_URL } from '../../constants/externalServerUrl';\nimport type { HistoryItem } from '../../hooks/emojiHistory';\nimport type { ApiFunctionResult } from '../../types/api';\n\ninterface GetEmojiHistoryOptions {\n accessToken: string;\n personId: string;\n}\n\ninterface GetEmojiHistoryResponseData {\n key: string;\n personId: string;\n schemeId: string;\n value: HistoryItem[];\n}\n\nexport const getEmojiHistory = async ({\n accessToken,\n personId,\n}: GetEmojiHistoryOptions): Promise<ApiFunctionResult<HistoryItem[]>> => {\n const requestInit: RequestInit = {\n headers: {\n Authorization: `Bearer ${accessToken}`,\n },\n method: 'GET',\n };\n\n const url = `${ITEM_STORAGE_BASE_URL}/7/users/${personId}/keys/emojis`;\n\n const response = await fetch(url, requestInit);\n\n if (response.status === 200) {\n try {\n const data = (await response.json()) as GetEmojiHistoryResponseData;\n\n return { data: data.value, status: 200 };\n } catch (e) {\n // Do nothing\n }\n }\n\n return { status: response.status };\n};\n"],"mappings":"AAAA,SAASA,qBAAqB,QAAQ,mCAAmC;AAgBzE,OAAO,MAAMC,eAAe,GAAG,MAAAC,IAAA,IAG0C;EAAA,IAHnC;IAClCC,WAAW;IACXC;EACoB,CAAC,GAAAF,IAAA;EACrB,MAAMG,WAAwB,GAAG;IAC7BC,OAAO,EAAE;MACLC,aAAa,EAAG,UAASJ,WAAY;IACzC,CAAC;IACDK,MAAM,EAAE;EACZ,CAAC;EAED,MAAMC,GAAG,GAAI,GAAET,qBAAsB,YAAWI,QAAS,cAAa;EAEtE,MAAMM,QAAQ,GAAG,MAAMC,KAAK,CAACF,GAAG,EAAEJ,WAAW,CAAC;EAE9C,IAAIK,QAAQ,CAACE,MAAM,KAAK,GAAG,EAAE;IACzB,IAAI;MACA,MAAMC,IAAI,GAAI,MAAMH,QAAQ,CAACI,IAAI,CAAC,CAAiC;MAEnE,OAAO;QAAED,IAAI,EAAEA,IAAI,CAACE,KAAK;QAAEH,MAAM,EAAE;MAAI,CAAC;IAC5C,CAAC,CAAC,OAAOI,CAAC,EAAE;MACR;IAAA;EAER;EAEA,OAAO;IAAEJ,MAAM,EAAEF,QAAQ,CAACE;EAAO,CAAC;AACtC,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"put.js","names":["ITEM_STORAGE_BASE_URL","putEmojiHistory","_ref","accessToken","personId","value","requestInit","body","JSON","stringify","headers","Authorization","method","url","response","fetch","status","data","json","e"],"sources":["../../../src/api/item-storage/put.ts"],"sourcesContent":["import { ITEM_STORAGE_BASE_URL } from '../../constants/externalServerUrl';\nimport type { HistoryItem } from '../../hooks/emojiHistory';\nimport type { ApiFunctionResult } from '../../types/api';\n\ninterface PutEmojiHistoryOptions {\n accessToken: string;\n personId: string;\n value: HistoryItem[];\n}\n\ninterface PutEmojiHistoryResponseData {\n key: string;\n personId: string;\n schemeId: string;\n value: HistoryItem[];\n}\n\nexport const putEmojiHistory = async ({\n accessToken,\n personId,\n value,\n}: PutEmojiHistoryOptions): Promise<ApiFunctionResult<HistoryItem[]>> => {\n const requestInit: RequestInit = {\n body: JSON.stringify({ value }),\n headers: {\n Authorization: `Bearer ${accessToken}`,\n 'Content-Type': 'application/json',\n },\n method: 'PUT',\n };\n\n const url = `${ITEM_STORAGE_BASE_URL}/7/users/${personId}/keys/emojis`;\n\n const response = await fetch(url, requestInit);\n\n if (response.status === 201) {\n try {\n const data = (await response.json()) as PutEmojiHistoryResponseData;\n\n return { data: data.value, status: 200 };\n } catch (e) {\n // Do nothing\n }\n }\n\n return { status: response.status };\n};\n"],"mappings":"AAAA,SAASA,qBAAqB,QAAQ,mCAAmC;AAiBzE,OAAO,MAAMC,eAAe,GAAG,MAAAC,IAAA,IAI0C;EAAA,IAJnC;IAClCC,WAAW;IACXC,QAAQ;IACRC;EACoB,CAAC,GAAAH,IAAA;EACrB,MAAMI,WAAwB,GAAG;IAC7BC,IAAI,EAAEC,IAAI,CAACC,SAAS,CAAC;MAAEJ;IAAM,CAAC,CAAC;IAC/BK,OAAO,EAAE;MACLC,aAAa,EAAG,UAASR,WAAY,EAAC;MACtC,cAAc,EAAE;IACpB,CAAC;IACDS,MAAM,EAAE;EACZ,CAAC;EAED,MAAMC,GAAG,GAAI,GAAEb,qBAAsB,YAAWI,QAAS,cAAa;EAEtE,MAAMU,QAAQ,GAAG,MAAMC,KAAK,CAACF,GAAG,EAAEP,WAAW,CAAC;EAE9C,IAAIQ,QAAQ,CAACE,MAAM,KAAK,GAAG,EAAE;IACzB,IAAI;MACA,MAAMC,IAAI,GAAI,MAAMH,QAAQ,CAACI,IAAI,CAAC,CAAiC;MAEnE,OAAO;QAAED,IAAI,EAAEA,IAAI,CAACZ,KAAK;QAAEW,MAAM,EAAE;MAAI,CAAC;IAC5C,CAAC,CAAC,OAAOG,CAAC,EAAE;MACR;IAAA;EAER;EAEA,OAAO;IAAEH,MAAM,EAAEF,QAAQ,CAACE;EAAO,CAAC;AACtC,CAAC"}
|
|
1
|
+
{"version":3,"file":"put.js","names":["ITEM_STORAGE_BASE_URL","putEmojiHistory","_ref","accessToken","personId","value","requestInit","body","JSON","stringify","headers","Authorization","method","url","response","fetch","status","data","json","e"],"sources":["../../../src/api/item-storage/put.ts"],"sourcesContent":["import { ITEM_STORAGE_BASE_URL } from '../../constants/externalServerUrl';\nimport type { HistoryItem } from '../../hooks/emojiHistory';\nimport type { ApiFunctionResult } from '../../types/api';\n\ninterface PutEmojiHistoryOptions {\n accessToken: string;\n personId: string;\n value: HistoryItem[];\n}\n\ninterface PutEmojiHistoryResponseData {\n key: string;\n personId: string;\n schemeId: string;\n value: HistoryItem[];\n}\n\nexport const putEmojiHistory = async ({\n accessToken,\n personId,\n value,\n}: PutEmojiHistoryOptions): Promise<ApiFunctionResult<HistoryItem[]>> => {\n const requestInit: RequestInit = {\n body: JSON.stringify({ value }),\n headers: {\n Authorization: `Bearer ${accessToken}`,\n 'Content-Type': 'application/json',\n },\n method: 'PUT',\n };\n\n const url = `${ITEM_STORAGE_BASE_URL}/7/users/${personId}/keys/emojis`;\n\n const response = await fetch(url, requestInit);\n\n if (response.status === 201) {\n try {\n const data = (await response.json()) as PutEmojiHistoryResponseData;\n\n return { data: data.value, status: 200 };\n } catch (e) {\n // Do nothing\n }\n }\n\n return { status: response.status };\n};\n"],"mappings":"AAAA,SAASA,qBAAqB,QAAQ,mCAAmC;AAiBzE,OAAO,MAAMC,eAAe,GAAG,MAAAC,IAAA,IAI0C;EAAA,IAJnC;IAClCC,WAAW;IACXC,QAAQ;IACRC;EACoB,CAAC,GAAAH,IAAA;EACrB,MAAMI,WAAwB,GAAG;IAC7BC,IAAI,EAAEC,IAAI,CAACC,SAAS,CAAC;MAAEJ;IAAM,CAAC,CAAC;IAC/BK,OAAO,EAAE;MACLC,aAAa,EAAG,UAASR,WAAY,EAAC;MACtC,cAAc,EAAE;IACpB,CAAC;IACDS,MAAM,EAAE;EACZ,CAAC;EAED,MAAMC,GAAG,GAAI,GAAEb,qBAAsB,YAAWI,QAAS,cAAa;EAEtE,MAAMU,QAAQ,GAAG,MAAMC,KAAK,CAACF,GAAG,EAAEP,WAAW,CAAC;EAE9C,IAAIQ,QAAQ,CAACE,MAAM,KAAK,GAAG,EAAE;IACzB,IAAI;MACA,MAAMC,IAAI,GAAI,MAAMH,QAAQ,CAACI,IAAI,CAAC,CAAiC;MAEnE,OAAO;QAAED,IAAI,EAAEA,IAAI,CAACZ,KAAK;QAAEW,MAAM,EAAE;MAAI,CAAC;IAC5C,CAAC,CAAC,OAAOG,CAAC,EAAE;MACR;IAAA;EAER;EAEA,OAAO;IAAEH,MAAM,EAAEF,QAAQ,CAACE;EAAO,CAAC;AACtC,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmojiInput.js","names":["getDevice","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useLayoutEffect","useMemo","useRef","useState","convertEmojisToUnicode","getIsMobile","insertTextAtCursorPosition","replaceText","getCharCodeThatWillBeDeleted","restoreSelection","saveSelection","convertHTMLToText","convertTextToHTML","EmojiPickerPopup","StyledEmojiInput","StyledEmojiInputContent","StyledEmojiInputLabel","StyledEmojiInputRightWrapper","StyledMotionEmojiInputEditor","StyledMotionEmojiInputProgress","PrefixElement","EmojiInput","_ref","ref","accessToken","height","inputId","isDisabled","maxHeight","onBlur","onFocus","onInput","onKeyDown","onPrefixElementRemove","onPopupVisibilityChange","personId","placeholder","popupAlignment","prefixElement","rightElement","shouldHidePlaceholderOnFocus","shouldPreventEmojiPicker","value","isMobile","plainTextValue","setPlainTextValue","hasFocus","setHasFocus","progressDuration","setProgressDuration","labelWidth","setLabelWidth","isPopupVisible","setIsPopupVisible","isPrefixAnimationFinished","setIsPrefixAnimationFinished","prefixElementWidth","setPrefixElementWidth","editorRef","prefixElementRef","hasPrefixRendered","shouldDeleteOneMoreBackwards","shouldDeleteOneMoreForwards","valueRef","browser","handleUpdateHTML","html","current","newInnerHTML","innerHTML","shouldIgnoreEmptyTextNodes","handleBeforeInput","event","preventDefault","stopPropagation","data","type","nativeEvent","includes","text","editorElement","newEvent","Event","bubbles","dispatchEvent","handleInput","document","execCommand","handleKeyDown","key","isPropagationStopped","charCodeThatWillBeDeleted","handlePopupVisibility","isVisible","handlePaste","clipboardData","getData","handlePopupSelect","emoji","convertedText","replace","convertedPrefix","length","handleInsertTextAtCursorPosition","handleReplaceText","searchText","pasteText","handleStartProgress","duration","handleStopProgress","startProgress","stopProgress","handlePreventLoseFocus","element","target","classList","contains","parentElement","body","addEventListener","removeEventListener","shouldShowPlaceholder","isJustPrefixElement","shouldRenderPlaceholder","handleFocus","handleBlur","offsetWidth","undefined","handleResize","resizeObserver","ResizeObserver","observe","disconnect","blurElement","activeElement","blur","createElement","$isDisabled","initial","animate","width","exit","opacity","transition","ease","$isRightElementGiven","$browser","name","minHeight","contentEditable","id","onBeforeInput","onPaste","$shouldShowContent","$maxWidth","$offsetWidth","alignment","onSelect","displayName"],"sources":["../../../src/components/emoji-input/EmojiInput.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n ChangeEvent,\n ClipboardEvent,\n CSSProperties,\n FocusEvent,\n FocusEventHandler,\n forwardRef,\n KeyboardEvent,\n KeyboardEventHandler,\n ReactElement,\n ReactNode,\n useCallback,\n useEffect,\n useImperativeHandle,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n type FormEvent,\n} from 'react';\nimport type { PopupAlignment } from '../../constants/alignment';\nimport { convertEmojisToUnicode } from '../../utils/emoji';\nimport { getIsMobile } from '../../utils/environment';\nimport { insertTextAtCursorPosition, replaceText } from '../../utils/insert';\nimport {\n getCharCodeThatWillBeDeleted,\n restoreSelection,\n saveSelection,\n} from '../../utils/selection';\nimport { convertHTMLToText, convertTextToHTML } from '../../utils/text';\nimport EmojiPickerPopup from '../emoji-picker-popup/EmojiPickerPopup';\nimport {\n StyledEmojiInput,\n StyledEmojiInputContent,\n StyledEmojiInputLabel,\n StyledEmojiInputRightWrapper,\n StyledMotionEmojiInputEditor,\n StyledMotionEmojiInputProgress,\n} from './EmojiInput.styles';\nimport PrefixElement from './prefix-element/PrefixElement';\n\nexport type EmojiInputProps = {\n /**\n * Access token of the logged-in user. Is needed to load and save the history of the emojis.\n */\n accessToken?: string;\n /**\n * Sets the height of the input field to a fixed value. If this value is not set, the component will use the needed height until the maximum height is reached.\n */\n height?: CSSProperties['height'];\n /**\n * HTML id of the input element\n */\n inputId?: string;\n /**\n * Disables the input so that it cannot be changed anymore\n */\n isDisabled?: boolean;\n /**\n * Sets the maximum height of the input field.\n */\n maxHeight?: CSSProperties['maxHeight'];\n /**\n * Function that is executed when the input field loses focus.\n */\n onBlur?: FocusEventHandler<HTMLDivElement>;\n /**\n * Function that is executed when the input field gets the focus.\n */\n onFocus?: FocusEventHandler<HTMLDivElement>;\n /**\n * Function that is executed when the text of the input changes. In addition to the original\n * event, the original text is returned as second parameter, in which the internally used HTML\n * elements have been converted back to BB codes.\n */\n onInput?: (event: ChangeEvent<HTMLDivElement>, originalText: string) => void;\n /**\n * Function that is executed when a key is pressed down.\n */\n onKeyDown?: KeyboardEventHandler<HTMLDivElement>;\n /**\n * Function to be executed if the prefixElement is removed.\n */\n onPrefixElementRemove?: () => void;\n /**\n * Function that is executed when the visibility of the popup changes.\n * @param {boolean} isVisible - Whether the popup is visible or not\n */\n onPopupVisibilityChange?: (isVisible: boolean) => void;\n /**\n * Person id of the logged-in user. Is needed to load and save the history of the emojis.\n */\n personId?: string;\n /**\n * Placeholder for the input field\n */\n placeholder?: string | ReactElement;\n /**\n * Sets the alignment of the popup to a fixed value. If this value is not set, the component\n * calculates the best position on its own. Use the imported 'PopupAlignment' enum to set this\n * value.\n */\n popupAlignment?: PopupAlignment;\n /**\n * Element that is rendered before the input field but the placeholder is still visible.\n */\n prefixElement?: string;\n /**\n * Element that is rendered inside the EmojiInput on the right side.\n */\n rightElement?: ReactNode;\n /**\n * Whether the placeholder should be shown after the input has focus.\n */\n shouldHidePlaceholderOnFocus?: boolean;\n /**\n * Prevents the EmojiPickerPopup icon from being displayed\n */\n shouldPreventEmojiPicker?: boolean;\n /**\n * The plain text value of the input field. Instead of HTML elements BB codes must be used at\n * this point. These are then converted by the input field into corresponding HTML elements.\n */\n value: string;\n};\n\nexport type EmojiInputRef = {\n insertTextAtCursorPosition: (text: string) => void;\n replaceText: (searchText: string, replaceText: string) => void;\n startProgress: (durationInSeconds: number) => void;\n stopProgress: () => void;\n};\n\nconst EmojiInput = forwardRef<EmojiInputRef, EmojiInputProps>(\n (\n {\n accessToken,\n height,\n inputId,\n isDisabled,\n maxHeight = '190px',\n onBlur,\n onFocus,\n onInput,\n onKeyDown,\n onPrefixElementRemove,\n onPopupVisibilityChange,\n personId,\n placeholder,\n popupAlignment,\n prefixElement,\n rightElement,\n shouldHidePlaceholderOnFocus = true,\n shouldPreventEmojiPicker,\n value,\n },\n ref,\n ) => {\n const [isMobile] = useState(getIsMobile());\n const [plainTextValue, setPlainTextValue] = useState(value);\n const [hasFocus, setHasFocus] = useState(false);\n const [progressDuration, setProgressDuration] = useState(0);\n const [labelWidth, setLabelWidth] = useState(0);\n const [isPopupVisible, setIsPopupVisible] = useState(false);\n const [isPrefixAnimationFinished, setIsPrefixAnimationFinished] = useState(!prefixElement);\n const [prefixElementWidth, setPrefixElementWidth] = useState<number | undefined>();\n\n const editorRef = useRef<HTMLDivElement>(null);\n const prefixElementRef = useRef<HTMLDivElement>(null);\n const hasPrefixRendered = useRef(false);\n const shouldDeleteOneMoreBackwards = useRef(false);\n const shouldDeleteOneMoreForwards = useRef(false);\n\n const valueRef = useRef(value);\n\n const { browser } = getDevice();\n\n /**\n * This function updates the content of the 'contentEditable' element if the new text is\n * different from the previous content. So this is only true if, for example, a text like \":-)\"\n * has been replaced to the corresponding emoji.\n *\n * When updating the HTML, the current cursor position is saved before replacing the content, so\n * that it can be set again afterward.\n */\n const handleUpdateHTML = useCallback((html: string) => {\n if (!editorRef.current) {\n return;\n }\n\n let newInnerHTML = convertEmojisToUnicode(html);\n\n newInnerHTML = convertTextToHTML(newInnerHTML);\n\n if (newInnerHTML !== editorRef.current.innerHTML) {\n saveSelection(editorRef.current, { shouldIgnoreEmptyTextNodes: true });\n\n editorRef.current.innerHTML = newInnerHTML;\n\n restoreSelection(editorRef.current);\n }\n }, []);\n\n const handleBeforeInput = useCallback(\n (event: FormEvent<HTMLDivElement>) => {\n if (!editorRef.current) {\n return;\n }\n\n if (isDisabled) {\n event.preventDefault();\n event.stopPropagation();\n\n return;\n }\n\n const { data, type } = event.nativeEvent as InputEvent;\n\n if (type === 'textInput' && data && data.includes('\\n')) {\n event.preventDefault();\n event.stopPropagation();\n\n const text = convertEmojisToUnicode(data);\n\n insertTextAtCursorPosition({ editorElement: editorRef.current, text });\n\n const newEvent = new Event('input', { bubbles: true });\n\n editorRef.current.dispatchEvent(newEvent);\n }\n },\n [isDisabled],\n );\n\n /**\n * This function handles the 'input' events of the 'contentEditable' element and also passes the\n * respective event up accordingly if the 'onInput' property is a function.\n */\n const handleInput = useCallback(\n (event: ChangeEvent<HTMLDivElement>) => {\n if (!editorRef.current) {\n return;\n }\n\n if (isDisabled) {\n event.stopPropagation();\n event.preventDefault();\n }\n\n if (shouldDeleteOneMoreBackwards.current) {\n shouldDeleteOneMoreBackwards.current = false;\n shouldDeleteOneMoreForwards.current = false;\n\n event.preventDefault();\n event.stopPropagation();\n\n // noinspection JSDeprecatedSymbols\n document.execCommand('delete', false);\n\n return;\n }\n\n if (shouldDeleteOneMoreForwards.current) {\n shouldDeleteOneMoreBackwards.current = false;\n shouldDeleteOneMoreForwards.current = false;\n\n event.preventDefault();\n event.stopPropagation();\n\n // noinspection JSDeprecatedSymbols\n document.execCommand('forwardDelete', false);\n\n return;\n }\n\n handleUpdateHTML(editorRef.current.innerHTML);\n\n const text = convertHTMLToText(editorRef.current.innerHTML);\n\n setPlainTextValue(text);\n\n if (typeof onInput === 'function') {\n onInput(event, text);\n }\n },\n [handleUpdateHTML, isDisabled, onInput],\n );\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent<HTMLDivElement>) => {\n if (isDisabled) {\n event.preventDefault();\n event.stopPropagation();\n\n return;\n }\n\n if (event.key === 'Enter' && isPopupVisible) {\n event.preventDefault();\n\n return;\n }\n\n if (typeof onKeyDown === 'function') {\n onKeyDown(event);\n }\n\n if (event.key === 'Enter' && !event.isPropagationStopped() && editorRef.current) {\n event.preventDefault();\n\n // noinspection JSDeprecatedSymbols\n document.execCommand('insertLineBreak', false);\n }\n\n if (event.key === 'Backspace' || event.key === 'Delete') {\n const charCodeThatWillBeDeleted = getCharCodeThatWillBeDeleted(event);\n\n if (charCodeThatWillBeDeleted === 8203) {\n if (event.key === 'Backspace') {\n shouldDeleteOneMoreBackwards.current = true;\n } else {\n shouldDeleteOneMoreForwards.current = true;\n }\n }\n }\n },\n [isDisabled, isPopupVisible, onKeyDown],\n );\n\n const handlePopupVisibility = (isVisible: boolean) => {\n setIsPopupVisible(isVisible);\n\n if (typeof onPopupVisibilityChange === 'function') {\n onPopupVisibilityChange(isVisible);\n }\n };\n\n /**\n * This function prevents formatting from being adopted when texts are inserted. To do this, the\n * plain text is read from the event after the default behavior has been prevented. The plain\n * text is then inserted at the correct position in the input field using the\n * 'insertTextAtCursorPosition' function.\n */\n const handlePaste = useCallback(\n (event: ClipboardEvent<HTMLDivElement>) => {\n if (editorRef.current) {\n event.preventDefault();\n\n if (isDisabled) {\n event.stopPropagation();\n\n return;\n }\n\n let text = event.clipboardData.getData('text/plain');\n\n text = convertEmojisToUnicode(text);\n\n insertTextAtCursorPosition({ editorElement: editorRef.current, text });\n\n const newEvent = new Event('input', { bubbles: true });\n\n editorRef.current.dispatchEvent(newEvent);\n }\n },\n [isDisabled],\n );\n\n /**\n * This function uses the 'insertTextAtCursorPosition' function to insert the emoji at the\n * correct position in the editor element.\n *\n * At the end an 'input' event is dispatched, so that the function 'handleInput' is triggered,\n * which in turn executes the 'onInput' function from the props. So this serves to ensure that\n * the event is also passed through to the top when inserting via the popup.\n */\n const handlePopupSelect = useCallback((emoji: string) => {\n if (editorRef.current) {\n insertTextAtCursorPosition({ editorElement: editorRef.current, text: emoji });\n\n const event = new Event('input', { bubbles: true });\n\n editorRef.current.dispatchEvent(event);\n }\n }, []);\n\n useEffect(() => {\n if (typeof onPrefixElementRemove !== 'function') {\n return;\n }\n\n if (!hasPrefixRendered.current) {\n return;\n }\n\n const convertedText = convertHTMLToText(editorRef.current?.innerHTML ?? '').replace(\n ' ',\n ' ',\n );\n const convertedPrefix = prefixElement && prefixElement.replace(' ', ' ');\n\n if (\n (convertedPrefix &&\n convertedText.includes(convertedPrefix) &&\n convertedText.length > convertedPrefix.length) ||\n convertedPrefix === convertedText\n ) {\n return;\n }\n\n onPrefixElementRemove();\n hasPrefixRendered.current = false;\n }, [onPrefixElementRemove, plainTextValue.length, prefixElement]);\n\n useEffect(() => {\n if (value !== plainTextValue) {\n setPlainTextValue(value);\n\n handleUpdateHTML(value);\n }\n }, [handleUpdateHTML, plainTextValue, value]);\n\n // This effect is used to call the 'handleUpdateHTML' function once after the component has been\n // rendered. This is necessary because the 'contentEditable' element otherwise does not display\n // the HTML content correctly when the component is rendered for the first time.\n useLayoutEffect(() => {\n handleUpdateHTML(valueRef.current);\n }, [handleUpdateHTML]);\n\n const handleInsertTextAtCursorPosition = useCallback((text: string) => {\n if (editorRef.current) {\n insertTextAtCursorPosition({ editorElement: editorRef.current, text });\n\n const newEvent = new Event('input', { bubbles: true });\n\n editorRef.current.dispatchEvent(newEvent);\n }\n }, []);\n\n const handleReplaceText = useCallback((searchText: string, pasteText: string) => {\n if (editorRef.current) {\n replaceText({ editorElement: editorRef.current, searchText, pasteText });\n\n const newEvent = new Event('input', { bubbles: true });\n\n editorRef.current.dispatchEvent(newEvent);\n }\n }, []);\n\n const handleStartProgress = useCallback((duration: number) => {\n setProgressDuration(duration);\n }, []);\n\n const handleStopProgress = useCallback(() => {\n setProgressDuration(0);\n }, []);\n\n useImperativeHandle(\n ref,\n () => ({\n insertTextAtCursorPosition: handleInsertTextAtCursorPosition,\n replaceText: handleReplaceText,\n startProgress: handleStartProgress,\n stopProgress: handleStopProgress,\n }),\n [\n handleInsertTextAtCursorPosition,\n handleReplaceText,\n handleStartProgress,\n handleStopProgress,\n ],\n );\n\n useEffect(() => {\n /**\n * This function ensures that the input field does not lose focus when the popup is opened\n * or an emoji is selected in it. For this purpose the corresponding elements get the class\n * 'prevent-lose-focus'.\n *\n * The class can also be set to any other elements that should also not cause the input\n * field to lose focus.\n */\n const handlePreventLoseFocus = (event: MouseEvent) => {\n const element = event.target as Element;\n\n if (\n element.classList.contains('prevent-lose-focus') ||\n element.parentElement?.classList.contains('prevent-lose-focus') ||\n element.parentElement?.parentElement?.classList.contains('prevent-lose-focus')\n ) {\n event.preventDefault();\n event.stopPropagation();\n }\n };\n\n document.body.addEventListener('mousedown', handlePreventLoseFocus);\n\n return () => {\n document.body.removeEventListener('mousedown', handlePreventLoseFocus);\n };\n }, []);\n\n const shouldShowPlaceholder = useMemo(() => {\n if (!isPrefixAnimationFinished) {\n return false;\n }\n\n const isJustPrefixElement =\n prefixElement &&\n prefixElement === convertHTMLToText(editorRef.current?.innerHTML ?? '');\n\n const shouldRenderPlaceholder =\n (prefixElement && !plainTextValue) ||\n (prefixElement ? prefixElementWidth && prefixElementWidth > 0 : true);\n\n switch (true) {\n case (!plainTextValue || isJustPrefixElement) &&\n shouldHidePlaceholderOnFocus &&\n !hasFocus:\n case (!plainTextValue || isJustPrefixElement) && !shouldHidePlaceholderOnFocus:\n return shouldRenderPlaceholder;\n case (!plainTextValue || isJustPrefixElement) &&\n shouldHidePlaceholderOnFocus &&\n hasFocus:\n return false;\n default:\n return false;\n }\n }, [\n isPrefixAnimationFinished,\n hasFocus,\n plainTextValue,\n prefixElement,\n shouldHidePlaceholderOnFocus,\n prefixElementWidth,\n ]);\n\n useEffect(() => {\n if (prefixElement) {\n setIsPrefixAnimationFinished(false);\n }\n }, [prefixElement]);\n\n const handleFocus = (event: FocusEvent<HTMLDivElement>) => {\n if (typeof onFocus === 'function' && !isDisabled) {\n onFocus(event);\n }\n\n setHasFocus(true);\n };\n\n const handleBlur = (event: FocusEvent<HTMLDivElement>) => {\n if (typeof onBlur === 'function' && !isDisabled) {\n onBlur(event);\n }\n\n setHasFocus(false);\n };\n\n useEffect(() => {\n if (editorRef.current && prefixElement) {\n const text = convertEmojisToUnicode(prefixElement);\n\n insertTextAtCursorPosition({ editorElement: editorRef.current, text });\n\n handleUpdateHTML(prefixElement);\n hasPrefixRendered.current = true;\n }\n }, [handleUpdateHTML, prefixElement]);\n\n useEffect(() => {\n if (\n prefixElementRef.current &&\n prefixElement &&\n prefixElement === convertHTMLToText(editorRef.current?.innerHTML ?? '')\n ) {\n setPrefixElementWidth(prefixElementRef.current.offsetWidth + 2);\n } else {\n setPrefixElementWidth(undefined);\n }\n }, [plainTextValue, prefixElement]);\n\n useEffect(() => {\n const handleResize = () => {\n if (editorRef.current) {\n setLabelWidth(editorRef.current.offsetWidth);\n }\n };\n\n const resizeObserver = new ResizeObserver(handleResize);\n\n if (editorRef.current) {\n resizeObserver.observe(editorRef.current);\n }\n\n return () => {\n resizeObserver.disconnect();\n };\n }, []);\n\n useEffect(() => {\n const blurElement = () => {\n if (\n editorRef.current &&\n document.activeElement === editorRef.current &&\n isDisabled\n ) {\n editorRef.current.blur();\n }\n };\n\n document.addEventListener('focus', blurElement, true);\n\n return () => {\n document.removeEventListener('focus', blurElement, true);\n };\n }, [isDisabled]);\n\n return (\n <StyledEmojiInput $isDisabled={isDisabled}>\n <AnimatePresence initial>\n {progressDuration > 0 && (\n <StyledMotionEmojiInputProgress\n animate={{ width: '100%' }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 1, width: '0%' }}\n transition={{\n width: {\n ease: 'linear',\n duration: progressDuration,\n },\n opacity: {\n type: 'tween',\n duration: 0.3,\n },\n }}\n />\n )}\n </AnimatePresence>\n <StyledEmojiInputContent $isRightElementGiven={!!rightElement}>\n {prefixElement && (\n <PrefixElement\n element={prefixElement}\n prefixElementRef={prefixElementRef}\n setIsPrefixAnimationFinished={setIsPrefixAnimationFinished}\n />\n )}\n <StyledMotionEmojiInputEditor\n $browser={browser?.name}\n animate={{ maxHeight: height ?? maxHeight, minHeight: height ?? '26px' }}\n contentEditable={!isDisabled}\n id={inputId}\n onBeforeInput={handleBeforeInput}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onInput={handleInput}\n onKeyDown={handleKeyDown}\n onPaste={handlePaste}\n ref={editorRef}\n $shouldShowContent={isPrefixAnimationFinished}\n transition={{ type: 'tween', duration: 0.2 }}\n />\n\n {shouldShowPlaceholder && (\n <StyledEmojiInputLabel\n $maxWidth={labelWidth}\n $offsetWidth={prefixElementWidth}\n >\n {placeholder}\n </StyledEmojiInputLabel>\n )}\n {!isMobile && !shouldPreventEmojiPicker && (\n <EmojiPickerPopup\n accessToken={accessToken}\n alignment={popupAlignment}\n onSelect={handlePopupSelect}\n onPopupVisibilityChange={handlePopupVisibility}\n personId={personId}\n />\n )}\n </StyledEmojiInputContent>\n {rightElement && (\n <StyledEmojiInputRightWrapper>{rightElement}</StyledEmojiInputRightWrapper>\n )}\n </StyledEmojiInput>\n );\n },\n);\n\nEmojiInput.displayName = 'EmojiInput';\n\nexport default EmojiInput;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"EmojiInput.js","names":["getDevice","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useLayoutEffect","useMemo","useRef","useState","convertEmojisToUnicode","getIsMobile","insertTextAtCursorPosition","replaceText","getCharCodeThatWillBeDeleted","restoreSelection","saveSelection","convertHTMLToText","convertTextToHTML","EmojiPickerPopup","StyledEmojiInput","StyledEmojiInputContent","StyledEmojiInputLabel","StyledEmojiInputRightWrapper","StyledMotionEmojiInputEditor","StyledMotionEmojiInputProgress","PrefixElement","EmojiInput","_ref","ref","accessToken","height","inputId","isDisabled","maxHeight","onBlur","onFocus","onInput","onKeyDown","onPrefixElementRemove","onPopupVisibilityChange","personId","placeholder","popupAlignment","prefixElement","rightElement","shouldHidePlaceholderOnFocus","shouldPreventEmojiPicker","value","isMobile","plainTextValue","setPlainTextValue","hasFocus","setHasFocus","progressDuration","setProgressDuration","labelWidth","setLabelWidth","isPopupVisible","setIsPopupVisible","isPrefixAnimationFinished","setIsPrefixAnimationFinished","prefixElementWidth","setPrefixElementWidth","editorRef","prefixElementRef","hasPrefixRendered","shouldDeleteOneMoreBackwards","shouldDeleteOneMoreForwards","valueRef","browser","handleUpdateHTML","html","current","newInnerHTML","innerHTML","shouldIgnoreEmptyTextNodes","handleBeforeInput","event","preventDefault","stopPropagation","data","type","nativeEvent","includes","text","editorElement","newEvent","Event","bubbles","dispatchEvent","handleInput","document","execCommand","handleKeyDown","key","isPropagationStopped","charCodeThatWillBeDeleted","handlePopupVisibility","isVisible","handlePaste","clipboardData","getData","handlePopupSelect","emoji","convertedText","replace","convertedPrefix","length","handleInsertTextAtCursorPosition","handleReplaceText","searchText","pasteText","handleStartProgress","duration","handleStopProgress","startProgress","stopProgress","handlePreventLoseFocus","element","target","classList","contains","parentElement","body","addEventListener","removeEventListener","shouldShowPlaceholder","isJustPrefixElement","shouldRenderPlaceholder","handleFocus","handleBlur","offsetWidth","undefined","handleResize","resizeObserver","ResizeObserver","observe","disconnect","blurElement","activeElement","blur","createElement","$isDisabled","initial","animate","width","exit","opacity","transition","ease","$isRightElementGiven","$browser","name","minHeight","contentEditable","id","onBeforeInput","onPaste","$shouldShowContent","$maxWidth","$offsetWidth","alignment","onSelect","displayName"],"sources":["../../../src/components/emoji-input/EmojiInput.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n ChangeEvent,\n ClipboardEvent,\n CSSProperties,\n FocusEvent,\n FocusEventHandler,\n forwardRef,\n KeyboardEvent,\n KeyboardEventHandler,\n ReactElement,\n ReactNode,\n useCallback,\n useEffect,\n useImperativeHandle,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n type FormEvent,\n} from 'react';\nimport type { PopupAlignment } from '../../constants/alignment';\nimport { convertEmojisToUnicode } from '../../utils/emoji';\nimport { getIsMobile } from '../../utils/environment';\nimport { insertTextAtCursorPosition, replaceText } from '../../utils/insert';\nimport {\n getCharCodeThatWillBeDeleted,\n restoreSelection,\n saveSelection,\n} from '../../utils/selection';\nimport { convertHTMLToText, convertTextToHTML } from '../../utils/text';\nimport EmojiPickerPopup from '../emoji-picker-popup/EmojiPickerPopup';\nimport {\n StyledEmojiInput,\n StyledEmojiInputContent,\n StyledEmojiInputLabel,\n StyledEmojiInputRightWrapper,\n StyledMotionEmojiInputEditor,\n StyledMotionEmojiInputProgress,\n} from './EmojiInput.styles';\nimport PrefixElement from './prefix-element/PrefixElement';\n\nexport type EmojiInputProps = {\n /**\n * Access token of the logged-in user. Is needed to load and save the history of the emojis.\n */\n accessToken?: string;\n /**\n * Sets the height of the input field to a fixed value. If this value is not set, the component will use the needed height until the maximum height is reached.\n */\n height?: CSSProperties['height'];\n /**\n * HTML id of the input element\n */\n inputId?: string;\n /**\n * Disables the input so that it cannot be changed anymore\n */\n isDisabled?: boolean;\n /**\n * Sets the maximum height of the input field.\n */\n maxHeight?: CSSProperties['maxHeight'];\n /**\n * Function that is executed when the input field loses focus.\n */\n onBlur?: FocusEventHandler<HTMLDivElement>;\n /**\n * Function that is executed when the input field gets the focus.\n */\n onFocus?: FocusEventHandler<HTMLDivElement>;\n /**\n * Function that is executed when the text of the input changes. In addition to the original\n * event, the original text is returned as second parameter, in which the internally used HTML\n * elements have been converted back to BB codes.\n */\n onInput?: (event: ChangeEvent<HTMLDivElement>, originalText: string) => void;\n /**\n * Function that is executed when a key is pressed down.\n */\n onKeyDown?: KeyboardEventHandler<HTMLDivElement>;\n /**\n * Function to be executed if the prefixElement is removed.\n */\n onPrefixElementRemove?: () => void;\n /**\n * Function that is executed when the visibility of the popup changes.\n * @param {boolean} isVisible - Whether the popup is visible or not\n */\n onPopupVisibilityChange?: (isVisible: boolean) => void;\n /**\n * Person id of the logged-in user. Is needed to load and save the history of the emojis.\n */\n personId?: string;\n /**\n * Placeholder for the input field\n */\n placeholder?: string | ReactElement;\n /**\n * Sets the alignment of the popup to a fixed value. If this value is not set, the component\n * calculates the best position on its own. Use the imported 'PopupAlignment' enum to set this\n * value.\n */\n popupAlignment?: PopupAlignment;\n /**\n * Element that is rendered before the input field but the placeholder is still visible.\n */\n prefixElement?: string;\n /**\n * Element that is rendered inside the EmojiInput on the right side.\n */\n rightElement?: ReactNode;\n /**\n * Whether the placeholder should be shown after the input has focus.\n */\n shouldHidePlaceholderOnFocus?: boolean;\n /**\n * Prevents the EmojiPickerPopup icon from being displayed\n */\n shouldPreventEmojiPicker?: boolean;\n /**\n * The plain text value of the input field. Instead of HTML elements BB codes must be used at\n * this point. These are then converted by the input field into corresponding HTML elements.\n */\n value: string;\n};\n\nexport type EmojiInputRef = {\n insertTextAtCursorPosition: (text: string) => void;\n replaceText: (searchText: string, replaceText: string) => void;\n startProgress: (durationInSeconds: number) => void;\n stopProgress: () => void;\n};\n\nconst EmojiInput = forwardRef<EmojiInputRef, EmojiInputProps>(\n (\n {\n accessToken,\n height,\n inputId,\n isDisabled,\n maxHeight = '190px',\n onBlur,\n onFocus,\n onInput,\n onKeyDown,\n onPrefixElementRemove,\n onPopupVisibilityChange,\n personId,\n placeholder,\n popupAlignment,\n prefixElement,\n rightElement,\n shouldHidePlaceholderOnFocus = true,\n shouldPreventEmojiPicker,\n value,\n },\n ref,\n ) => {\n const [isMobile] = useState(getIsMobile());\n const [plainTextValue, setPlainTextValue] = useState(value);\n const [hasFocus, setHasFocus] = useState(false);\n const [progressDuration, setProgressDuration] = useState(0);\n const [labelWidth, setLabelWidth] = useState(0);\n const [isPopupVisible, setIsPopupVisible] = useState(false);\n const [isPrefixAnimationFinished, setIsPrefixAnimationFinished] = useState(!prefixElement);\n const [prefixElementWidth, setPrefixElementWidth] = useState<number | undefined>();\n\n const editorRef = useRef<HTMLDivElement>(null);\n const prefixElementRef = useRef<HTMLDivElement>(null);\n const hasPrefixRendered = useRef(false);\n const shouldDeleteOneMoreBackwards = useRef(false);\n const shouldDeleteOneMoreForwards = useRef(false);\n\n const valueRef = useRef(value);\n\n const { browser } = getDevice();\n\n /**\n * This function updates the content of the 'contentEditable' element if the new text is\n * different from the previous content. So this is only true if, for example, a text like \":-)\"\n * has been replaced to the corresponding emoji.\n *\n * When updating the HTML, the current cursor position is saved before replacing the content, so\n * that it can be set again afterward.\n */\n const handleUpdateHTML = useCallback((html: string) => {\n if (!editorRef.current) {\n return;\n }\n\n let newInnerHTML = convertEmojisToUnicode(html);\n\n newInnerHTML = convertTextToHTML(newInnerHTML);\n\n if (newInnerHTML !== editorRef.current.innerHTML) {\n saveSelection(editorRef.current, { shouldIgnoreEmptyTextNodes: true });\n\n editorRef.current.innerHTML = newInnerHTML;\n\n restoreSelection(editorRef.current);\n }\n }, []);\n\n const handleBeforeInput = useCallback(\n (event: FormEvent<HTMLDivElement>) => {\n if (!editorRef.current) {\n return;\n }\n\n if (isDisabled) {\n event.preventDefault();\n event.stopPropagation();\n\n return;\n }\n\n const { data, type } = event.nativeEvent as InputEvent;\n\n if (type === 'textInput' && data && data.includes('\\n')) {\n event.preventDefault();\n event.stopPropagation();\n\n const text = convertEmojisToUnicode(data);\n\n insertTextAtCursorPosition({ editorElement: editorRef.current, text });\n\n const newEvent = new Event('input', { bubbles: true });\n\n editorRef.current.dispatchEvent(newEvent);\n }\n },\n [isDisabled],\n );\n\n /**\n * This function handles the 'input' events of the 'contentEditable' element and also passes the\n * respective event up accordingly if the 'onInput' property is a function.\n */\n const handleInput = useCallback(\n (event: ChangeEvent<HTMLDivElement>) => {\n if (!editorRef.current) {\n return;\n }\n\n if (isDisabled) {\n event.stopPropagation();\n event.preventDefault();\n }\n\n if (shouldDeleteOneMoreBackwards.current) {\n shouldDeleteOneMoreBackwards.current = false;\n shouldDeleteOneMoreForwards.current = false;\n\n event.preventDefault();\n event.stopPropagation();\n\n // noinspection JSDeprecatedSymbols\n document.execCommand('delete', false);\n\n return;\n }\n\n if (shouldDeleteOneMoreForwards.current) {\n shouldDeleteOneMoreBackwards.current = false;\n shouldDeleteOneMoreForwards.current = false;\n\n event.preventDefault();\n event.stopPropagation();\n\n // noinspection JSDeprecatedSymbols\n document.execCommand('forwardDelete', false);\n\n return;\n }\n\n handleUpdateHTML(editorRef.current.innerHTML);\n\n const text = convertHTMLToText(editorRef.current.innerHTML);\n\n setPlainTextValue(text);\n\n if (typeof onInput === 'function') {\n onInput(event, text);\n }\n },\n [handleUpdateHTML, isDisabled, onInput],\n );\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent<HTMLDivElement>) => {\n if (isDisabled) {\n event.preventDefault();\n event.stopPropagation();\n\n return;\n }\n\n if (event.key === 'Enter' && isPopupVisible) {\n event.preventDefault();\n\n return;\n }\n\n if (typeof onKeyDown === 'function') {\n onKeyDown(event);\n }\n\n if (event.key === 'Enter' && !event.isPropagationStopped() && editorRef.current) {\n event.preventDefault();\n\n // noinspection JSDeprecatedSymbols\n document.execCommand('insertLineBreak', false);\n }\n\n if (event.key === 'Backspace' || event.key === 'Delete') {\n const charCodeThatWillBeDeleted = getCharCodeThatWillBeDeleted(event);\n\n if (charCodeThatWillBeDeleted === 8203) {\n if (event.key === 'Backspace') {\n shouldDeleteOneMoreBackwards.current = true;\n } else {\n shouldDeleteOneMoreForwards.current = true;\n }\n }\n }\n },\n [isDisabled, isPopupVisible, onKeyDown],\n );\n\n const handlePopupVisibility = (isVisible: boolean) => {\n setIsPopupVisible(isVisible);\n\n if (typeof onPopupVisibilityChange === 'function') {\n onPopupVisibilityChange(isVisible);\n }\n };\n\n /**\n * This function prevents formatting from being adopted when texts are inserted. To do this, the\n * plain text is read from the event after the default behavior has been prevented. The plain\n * text is then inserted at the correct position in the input field using the\n * 'insertTextAtCursorPosition' function.\n */\n const handlePaste = useCallback(\n (event: ClipboardEvent<HTMLDivElement>) => {\n if (editorRef.current) {\n event.preventDefault();\n\n if (isDisabled) {\n event.stopPropagation();\n\n return;\n }\n\n let text = event.clipboardData.getData('text/plain');\n\n text = convertEmojisToUnicode(text);\n\n insertTextAtCursorPosition({ editorElement: editorRef.current, text });\n\n const newEvent = new Event('input', { bubbles: true });\n\n editorRef.current.dispatchEvent(newEvent);\n }\n },\n [isDisabled],\n );\n\n /**\n * This function uses the 'insertTextAtCursorPosition' function to insert the emoji at the\n * correct position in the editor element.\n *\n * At the end an 'input' event is dispatched, so that the function 'handleInput' is triggered,\n * which in turn executes the 'onInput' function from the props. So this serves to ensure that\n * the event is also passed through to the top when inserting via the popup.\n */\n const handlePopupSelect = useCallback((emoji: string) => {\n if (editorRef.current) {\n insertTextAtCursorPosition({ editorElement: editorRef.current, text: emoji });\n\n const event = new Event('input', { bubbles: true });\n\n editorRef.current.dispatchEvent(event);\n }\n }, []);\n\n useEffect(() => {\n if (typeof onPrefixElementRemove !== 'function') {\n return;\n }\n\n if (!hasPrefixRendered.current) {\n return;\n }\n\n const convertedText = convertHTMLToText(editorRef.current?.innerHTML ?? '').replace(\n ' ',\n ' ',\n );\n const convertedPrefix = prefixElement && prefixElement.replace(' ', ' ');\n\n if (\n (convertedPrefix &&\n convertedText.includes(convertedPrefix) &&\n convertedText.length > convertedPrefix.length) ||\n convertedPrefix === convertedText\n ) {\n return;\n }\n\n onPrefixElementRemove();\n hasPrefixRendered.current = false;\n }, [onPrefixElementRemove, plainTextValue.length, prefixElement]);\n\n useEffect(() => {\n if (value !== plainTextValue) {\n setPlainTextValue(value);\n\n handleUpdateHTML(value);\n }\n }, [handleUpdateHTML, plainTextValue, value]);\n\n // This effect is used to call the 'handleUpdateHTML' function once after the component has been\n // rendered. This is necessary because the 'contentEditable' element otherwise does not display\n // the HTML content correctly when the component is rendered for the first time.\n useLayoutEffect(() => {\n handleUpdateHTML(valueRef.current);\n }, [handleUpdateHTML]);\n\n const handleInsertTextAtCursorPosition = useCallback((text: string) => {\n if (editorRef.current) {\n insertTextAtCursorPosition({ editorElement: editorRef.current, text });\n\n const newEvent = new Event('input', { bubbles: true });\n\n editorRef.current.dispatchEvent(newEvent);\n }\n }, []);\n\n const handleReplaceText = useCallback((searchText: string, pasteText: string) => {\n if (editorRef.current) {\n replaceText({ editorElement: editorRef.current, searchText, pasteText });\n\n const newEvent = new Event('input', { bubbles: true });\n\n editorRef.current.dispatchEvent(newEvent);\n }\n }, []);\n\n const handleStartProgress = useCallback((duration: number) => {\n setProgressDuration(duration);\n }, []);\n\n const handleStopProgress = useCallback(() => {\n setProgressDuration(0);\n }, []);\n\n useImperativeHandle(\n ref,\n () => ({\n insertTextAtCursorPosition: handleInsertTextAtCursorPosition,\n replaceText: handleReplaceText,\n startProgress: handleStartProgress,\n stopProgress: handleStopProgress,\n }),\n [\n handleInsertTextAtCursorPosition,\n handleReplaceText,\n handleStartProgress,\n handleStopProgress,\n ],\n );\n\n useEffect(() => {\n /**\n * This function ensures that the input field does not lose focus when the popup is opened\n * or an emoji is selected in it. For this purpose the corresponding elements get the class\n * 'prevent-lose-focus'.\n *\n * The class can also be set to any other elements that should also not cause the input\n * field to lose focus.\n */\n const handlePreventLoseFocus = (event: MouseEvent) => {\n const element = event.target as Element;\n\n if (\n element.classList.contains('prevent-lose-focus') ||\n element.parentElement?.classList.contains('prevent-lose-focus') ||\n element.parentElement?.parentElement?.classList.contains('prevent-lose-focus')\n ) {\n event.preventDefault();\n event.stopPropagation();\n }\n };\n\n document.body.addEventListener('mousedown', handlePreventLoseFocus);\n\n return () => {\n document.body.removeEventListener('mousedown', handlePreventLoseFocus);\n };\n }, []);\n\n const shouldShowPlaceholder = useMemo(() => {\n if (!isPrefixAnimationFinished) {\n return false;\n }\n\n const isJustPrefixElement =\n prefixElement &&\n prefixElement === convertHTMLToText(editorRef.current?.innerHTML ?? '');\n\n const shouldRenderPlaceholder =\n (prefixElement && !plainTextValue) ||\n (prefixElement ? prefixElementWidth && prefixElementWidth > 0 : true);\n\n switch (true) {\n case (!plainTextValue || isJustPrefixElement) &&\n shouldHidePlaceholderOnFocus &&\n !hasFocus:\n case (!plainTextValue || isJustPrefixElement) && !shouldHidePlaceholderOnFocus:\n return shouldRenderPlaceholder;\n case (!plainTextValue || isJustPrefixElement) &&\n shouldHidePlaceholderOnFocus &&\n hasFocus:\n return false;\n default:\n return false;\n }\n }, [\n isPrefixAnimationFinished,\n hasFocus,\n plainTextValue,\n prefixElement,\n shouldHidePlaceholderOnFocus,\n prefixElementWidth,\n ]);\n\n useEffect(() => {\n if (prefixElement) {\n setIsPrefixAnimationFinished(false);\n }\n }, [prefixElement]);\n\n const handleFocus = (event: FocusEvent<HTMLDivElement>) => {\n if (typeof onFocus === 'function' && !isDisabled) {\n onFocus(event);\n }\n\n setHasFocus(true);\n };\n\n const handleBlur = (event: FocusEvent<HTMLDivElement>) => {\n if (typeof onBlur === 'function' && !isDisabled) {\n onBlur(event);\n }\n\n setHasFocus(false);\n };\n\n useEffect(() => {\n if (editorRef.current && prefixElement) {\n const text = convertEmojisToUnicode(prefixElement);\n\n insertTextAtCursorPosition({ editorElement: editorRef.current, text });\n\n handleUpdateHTML(prefixElement);\n hasPrefixRendered.current = true;\n }\n }, [handleUpdateHTML, prefixElement]);\n\n useEffect(() => {\n if (\n prefixElementRef.current &&\n prefixElement &&\n prefixElement === convertHTMLToText(editorRef.current?.innerHTML ?? '')\n ) {\n setPrefixElementWidth(prefixElementRef.current.offsetWidth + 2);\n } else {\n setPrefixElementWidth(undefined);\n }\n }, [plainTextValue, prefixElement]);\n\n useEffect(() => {\n const handleResize = () => {\n if (editorRef.current) {\n setLabelWidth(editorRef.current.offsetWidth);\n }\n };\n\n const resizeObserver = new ResizeObserver(handleResize);\n\n if (editorRef.current) {\n resizeObserver.observe(editorRef.current);\n }\n\n return () => {\n resizeObserver.disconnect();\n };\n }, []);\n\n useEffect(() => {\n const blurElement = () => {\n if (\n editorRef.current &&\n document.activeElement === editorRef.current &&\n isDisabled\n ) {\n editorRef.current.blur();\n }\n };\n\n document.addEventListener('focus', blurElement, true);\n\n return () => {\n document.removeEventListener('focus', blurElement, true);\n };\n }, [isDisabled]);\n\n return (\n <StyledEmojiInput $isDisabled={isDisabled}>\n <AnimatePresence initial>\n {progressDuration > 0 && (\n <StyledMotionEmojiInputProgress\n animate={{ width: '100%' }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 1, width: '0%' }}\n transition={{\n width: {\n ease: 'linear',\n duration: progressDuration,\n },\n opacity: {\n type: 'tween',\n duration: 0.3,\n },\n }}\n />\n )}\n </AnimatePresence>\n <StyledEmojiInputContent $isRightElementGiven={!!rightElement}>\n {prefixElement && (\n <PrefixElement\n element={prefixElement}\n prefixElementRef={prefixElementRef}\n setIsPrefixAnimationFinished={setIsPrefixAnimationFinished}\n />\n )}\n <StyledMotionEmojiInputEditor\n $browser={browser?.name}\n animate={{ maxHeight: height ?? maxHeight, minHeight: height ?? '26px' }}\n contentEditable={!isDisabled}\n id={inputId}\n onBeforeInput={handleBeforeInput}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onInput={handleInput}\n onKeyDown={handleKeyDown}\n onPaste={handlePaste}\n ref={editorRef}\n $shouldShowContent={isPrefixAnimationFinished}\n transition={{ type: 'tween', duration: 0.2 }}\n />\n\n {shouldShowPlaceholder && (\n <StyledEmojiInputLabel\n $maxWidth={labelWidth}\n $offsetWidth={prefixElementWidth}\n >\n {placeholder}\n </StyledEmojiInputLabel>\n )}\n {!isMobile && !shouldPreventEmojiPicker && (\n <EmojiPickerPopup\n accessToken={accessToken}\n alignment={popupAlignment}\n onSelect={handlePopupSelect}\n onPopupVisibilityChange={handlePopupVisibility}\n personId={personId}\n />\n )}\n </StyledEmojiInputContent>\n {rightElement && (\n <StyledEmojiInputRightWrapper>{rightElement}</StyledEmojiInputRightWrapper>\n )}\n </StyledEmojiInput>\n );\n },\n);\n\nEmojiInput.displayName = 'EmojiInput';\n\nexport default EmojiInput;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -6,7 +6,7 @@ type StyledEmojiInputProps = WithTheme<{
|
|
|
6
6
|
$isDisabled?: boolean;
|
|
7
7
|
}>;
|
|
8
8
|
export declare const StyledEmojiInput: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledEmojiInputProps>>;
|
|
9
|
-
export declare const StyledMotionEmojiInputProgress: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<{
|
|
9
|
+
export declare const StyledMotionEmojiInputProgress: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<Omit<{
|
|
10
10
|
slot?: string | undefined;
|
|
11
11
|
title?: string | undefined;
|
|
12
12
|
dir?: string | undefined;
|
|
@@ -71,7 +71,7 @@ export declare const StyledMotionEmojiInputProgress: import("styled-components")
|
|
|
71
71
|
"aria-description"?: string | undefined;
|
|
72
72
|
"aria-details"?: string | undefined;
|
|
73
73
|
"aria-disabled"?: (boolean | "true" | "false") | undefined;
|
|
74
|
-
"aria-dropeffect"?: "link" | "none" | "copy" | "
|
|
74
|
+
"aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
|
|
75
75
|
"aria-errormessage"?: string | undefined;
|
|
76
76
|
"aria-expanded"?: (boolean | "true" | "false") | undefined;
|
|
77
77
|
"aria-flowto"?: string | undefined;
|
|
@@ -93,7 +93,7 @@ export declare const StyledMotionEmojiInputProgress: import("styled-components")
|
|
|
93
93
|
"aria-posinset"?: number | undefined;
|
|
94
94
|
"aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
|
|
95
95
|
"aria-readonly"?: (boolean | "true" | "false") | undefined;
|
|
96
|
-
"aria-relevant"?: "text" | "
|
|
96
|
+
"aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
|
|
97
97
|
"aria-required"?: (boolean | "true" | "false") | undefined;
|
|
98
98
|
"aria-roledescription"?: string | undefined;
|
|
99
99
|
"aria-rowcount"?: number | undefined;
|
|
@@ -246,9 +246,7 @@ export declare const StyledMotionEmojiInputProgress: import("styled-components")
|
|
|
246
246
|
onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
247
247
|
onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
248
248
|
onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
249
|
-
onPointerEnterCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
250
249
|
onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
251
|
-
onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
252
250
|
onPointerOver?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
253
251
|
onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
254
252
|
onPointerOut?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
@@ -268,7 +266,9 @@ export declare const StyledMotionEmojiInputProgress: import("styled-components")
|
|
|
268
266
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
|
|
269
267
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
270
268
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
271
|
-
} & import("framer-motion").MotionProps & import("react").RefAttributes<HTMLDivElement>, {
|
|
269
|
+
} & import("framer-motion").MotionProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
270
|
+
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
271
|
+
}, {
|
|
272
272
|
theme: import("@chayns-components/core/lib/components/color-scheme-provider/ColorSchemeProvider").Theme;
|
|
273
273
|
}>> & Omit<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
|
|
274
274
|
type StyledEmojiInputContentProps = {
|
|
@@ -279,7 +279,7 @@ type StyledEmojiInputEditorProps = WithTheme<{
|
|
|
279
279
|
$shouldShowContent: boolean;
|
|
280
280
|
$browser: Browser | 'bot' | null | undefined;
|
|
281
281
|
}>;
|
|
282
|
-
export declare const StyledMotionEmojiInputEditor: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<{
|
|
282
|
+
export declare const StyledMotionEmojiInputEditor: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<Omit<{
|
|
283
283
|
slot?: string | undefined;
|
|
284
284
|
title?: string | undefined;
|
|
285
285
|
dir?: string | undefined;
|
|
@@ -344,7 +344,7 @@ export declare const StyledMotionEmojiInputEditor: import("styled-components").I
|
|
|
344
344
|
"aria-description"?: string | undefined;
|
|
345
345
|
"aria-details"?: string | undefined;
|
|
346
346
|
"aria-disabled"?: (boolean | "true" | "false") | undefined;
|
|
347
|
-
"aria-dropeffect"?: "link" | "none" | "copy" | "
|
|
347
|
+
"aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
|
|
348
348
|
"aria-errormessage"?: string | undefined;
|
|
349
349
|
"aria-expanded"?: (boolean | "true" | "false") | undefined;
|
|
350
350
|
"aria-flowto"?: string | undefined;
|
|
@@ -366,7 +366,7 @@ export declare const StyledMotionEmojiInputEditor: import("styled-components").I
|
|
|
366
366
|
"aria-posinset"?: number | undefined;
|
|
367
367
|
"aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
|
|
368
368
|
"aria-readonly"?: (boolean | "true" | "false") | undefined;
|
|
369
|
-
"aria-relevant"?: "text" | "
|
|
369
|
+
"aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
|
|
370
370
|
"aria-required"?: (boolean | "true" | "false") | undefined;
|
|
371
371
|
"aria-roledescription"?: string | undefined;
|
|
372
372
|
"aria-rowcount"?: number | undefined;
|
|
@@ -519,9 +519,7 @@ export declare const StyledMotionEmojiInputEditor: import("styled-components").I
|
|
|
519
519
|
onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
520
520
|
onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
521
521
|
onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
522
|
-
onPointerEnterCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
523
522
|
onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
524
|
-
onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
525
523
|
onPointerOver?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
526
524
|
onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
527
525
|
onPointerOut?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
@@ -541,7 +539,9 @@ export declare const StyledMotionEmojiInputEditor: import("styled-components").I
|
|
|
541
539
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
|
|
542
540
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
543
541
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
544
|
-
} & import("framer-motion").MotionProps & import("react").RefAttributes<HTMLDivElement>,
|
|
542
|
+
} & import("framer-motion").MotionProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
543
|
+
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
544
|
+
}, StyledEmojiInputEditorProps>> & Omit<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
|
|
545
545
|
export declare const StyledEmojiInputRightWrapper: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
|
|
546
546
|
type StyledEmojiInputLabelProps = WithTheme<{
|
|
547
547
|
$maxWidth: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmojiInput.styles.js","names":["motion","styled","css","getFontFamily","StyledEmojiInput","div","_ref","theme","_ref2","$isDisabled","_ref3","StyledMotionEmojiInputProgress","_ref4","StyledEmojiInputContent","_ref5","$isRightElementGiven","StyledMotionEmojiInputEditor","_ref6","$shouldShowContent","text","_ref7","$browser","StyledEmojiInputRightWrapper","StyledEmojiInputLabel","label","_ref8","_ref9","$offsetWidth","_ref10","$maxWidth"],"sources":["../../../src/components/emoji-input/EmojiInput.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport type { Browser } from 'detect-browser';\nimport { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport { getFontFamily } from '../../utils/font';\n\ntype StyledEmojiInputProps = WithTheme<{ $isDisabled?: boolean }>;\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 StyledMotionEmojiInputProgressProps = WithTheme<unknown>;\n\nexport const StyledMotionEmojiInputProgress = styled(\n motion.div,\n)<StyledMotionEmojiInputProgressProps>`\n background-color: ${({ theme }: StyledMotionEmojiInputProgressProps) => theme['402']};\n height: 100%;\n position: absolute;\n z-index: 2;\n border-radius: 3px;\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 z-index: 3;\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 padding-right: 0;\n `}\n`;\n\ntype StyledEmojiInputEditorProps = WithTheme<{\n $shouldShowContent: boolean;\n $browser: Browser | 'bot' | null | undefined;\n}>;\n\nexport const StyledMotionEmojiInputEditor = styled(motion.div)<StyledEmojiInputEditorProps>`\n color: ${({ theme, $shouldShowContent }: StyledEmojiInputEditorProps) =>\n $shouldShowContent ? theme.text : theme['100']};\n flex: 1 1 auto;\n font-family: ${getFontFamily};\n overflow-y: scroll;\n overflow-x: hidden;\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 lc_mention,\n nerIgnore,\n nerReplace {\n font-weight: bold;\n\n span {\n opacity: 0.5;\n }\n }\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledEmojiInputEditorProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\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(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n }\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\ntype StyledEmojiInputLabelProps = WithTheme<{\n $maxWidth: number;\n $offsetWidth?: number;\n}>;\n\nexport const StyledEmojiInputLabel = styled.label<StyledEmojiInputLabelProps>`\n color: rgba(${({ theme }: StyledEmojiInputLabelProps) => theme['text-rgb']}, 0.45);\n left: ${({ $offsetWidth }) => ($offsetWidth ? `${$offsetWidth + 10}px` : '10px')};\n top: 12px;\n align-items: baseline;\n display: flex;\n flex: 0 0 auto;\n gap: 4px;\n line-height: 1.3;\n pointer-events: none;\n position: absolute;\n user-select: none;\n white-space: nowrap;\n max-width: ${({ $maxWidth, $offsetWidth }) => `${$maxWidth - ($offsetWidth ?? 0)}px`};\n overflow: hidden;\n`;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"EmojiInput.styles.js","names":["motion","styled","css","getFontFamily","StyledEmojiInput","div","_ref","theme","_ref2","$isDisabled","_ref3","StyledMotionEmojiInputProgress","_ref4","StyledEmojiInputContent","_ref5","$isRightElementGiven","StyledMotionEmojiInputEditor","_ref6","$shouldShowContent","text","_ref7","$browser","StyledEmojiInputRightWrapper","StyledEmojiInputLabel","label","_ref8","_ref9","$offsetWidth","_ref10","$maxWidth"],"sources":["../../../src/components/emoji-input/EmojiInput.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport type { Browser } from 'detect-browser';\nimport { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport { getFontFamily } from '../../utils/font';\n\ntype StyledEmojiInputProps = WithTheme<{ $isDisabled?: boolean }>;\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 StyledMotionEmojiInputProgressProps = WithTheme<unknown>;\n\nexport const StyledMotionEmojiInputProgress = styled(\n motion.div,\n)<StyledMotionEmojiInputProgressProps>`\n background-color: ${({ theme }: StyledMotionEmojiInputProgressProps) => theme['402']};\n height: 100%;\n position: absolute;\n z-index: 2;\n border-radius: 3px;\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 z-index: 3;\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 padding-right: 0;\n `}\n`;\n\ntype StyledEmojiInputEditorProps = WithTheme<{\n $shouldShowContent: boolean;\n $browser: Browser | 'bot' | null | undefined;\n}>;\n\nexport const StyledMotionEmojiInputEditor = styled(motion.div)<StyledEmojiInputEditorProps>`\n color: ${({ theme, $shouldShowContent }: StyledEmojiInputEditorProps) =>\n $shouldShowContent ? theme.text : theme['100']};\n flex: 1 1 auto;\n font-family: ${getFontFamily};\n overflow-y: scroll;\n overflow-x: hidden;\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 lc_mention,\n nerIgnore,\n nerReplace {\n font-weight: bold;\n\n span {\n opacity: 0.5;\n }\n }\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledEmojiInputEditorProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\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(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n }\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\ntype StyledEmojiInputLabelProps = WithTheme<{\n $maxWidth: number;\n $offsetWidth?: number;\n}>;\n\nexport const StyledEmojiInputLabel = styled.label<StyledEmojiInputLabelProps>`\n color: rgba(${({ theme }: StyledEmojiInputLabelProps) => theme['text-rgb']}, 0.45);\n left: ${({ $offsetWidth }) => ($offsetWidth ? `${$offsetWidth + 10}px` : '10px')};\n top: 12px;\n align-items: baseline;\n display: flex;\n flex: 0 0 auto;\n gap: 4px;\n line-height: 1.3;\n pointer-events: none;\n position: absolute;\n user-select: none;\n white-space: nowrap;\n max-width: ${({ $maxWidth, $offsetWidth }) => `${$maxWidth - ($offsetWidth ?? 0)}px`};\n overflow: hidden;\n`;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PrefixElement.js","names":["React","useCallback","useEffect","useMemo","useState","convertTextToHTML","StyledPrefixElement","StyledPrefixElementLetter","StyledPrefixElementLetterWrapper","StyledPrefixElementPseudo","PrefixElement","_ref","prefixElementRef","element","setIsPrefixAnimationFinished","shouldShow","setShouldShow","prefixText","setPrefixText","current","textContent","handleAnimationEnd","index","length","content","split","map","letter","createElement","onAnimationEnd","$index","$shouldShow","ref","dangerouslySetInnerHTML","__html","displayName"],"sources":["../../../../src/components/emoji-input/prefix-element/PrefixElement.tsx"],"sourcesContent":["import React, {\n useCallback,\n useEffect,\n useMemo,\n useState,\n type Dispatch,\n type FC,\n type RefObject,\n type SetStateAction,\n} from 'react';\nimport { convertTextToHTML } from '../../../utils/text';\nimport {\n StyledPrefixElement,\n StyledPrefixElementLetter,\n StyledPrefixElementLetterWrapper,\n StyledPrefixElementPseudo,\n} from './PrefixElement.styles';\n\nexport type PrefixElementProps = {\n prefixElementRef: RefObject<HTMLDivElement>;\n element: string;\n setIsPrefixAnimationFinished: Dispatch<SetStateAction<boolean>>;\n};\n\nconst PrefixElement: FC<PrefixElementProps> = ({\n prefixElementRef,\n element,\n setIsPrefixAnimationFinished,\n}) => {\n const [shouldShow, setShouldShow] = useState(true);\n const [prefixText, setPrefixText] = useState('');\n\n useEffect(() => {\n if (prefixElementRef.current) {\n setPrefixText(prefixElementRef.current.textContent ?? '');\n }\n }, [prefixElementRef]);\n\n const handleAnimationEnd = useCallback(\n (index: number) => {\n if (index === prefixText.length - 1) {\n setShouldShow(false);\n setIsPrefixAnimationFinished(true);\n }\n },\n [prefixText.length, setIsPrefixAnimationFinished],\n );\n\n const content = useMemo(\n () =>\n prefixText.split('').map((letter, index) => (\n <StyledPrefixElementLetter\n onAnimationEnd={() => handleAnimationEnd(index)}\n $index={index}\n >\n {letter}\n </StyledPrefixElementLetter>\n )),\n [handleAnimationEnd, prefixText],\n );\n\n return (\n <StyledPrefixElement $shouldShow={shouldShow}>\n <StyledPrefixElementPseudo\n ref={prefixElementRef}\n dangerouslySetInnerHTML={{ __html: convertTextToHTML(element) }}\n />\n {shouldShow && (\n <StyledPrefixElementLetterWrapper>{content}</StyledPrefixElementLetterWrapper>\n )}\n </StyledPrefixElement>\n );\n};\n\nPrefixElement.displayName = 'PrefixElement';\n\nexport default PrefixElement;\n"],"mappings":"AAAA,OAAOA,KAAK,IACRC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,QAAQ,QAKL,OAAO;AACd,SAASC,iBAAiB,QAAQ,qBAAqB;AACvD,SACIC,mBAAmB,EACnBC,yBAAyB,EACzBC,gCAAgC,EAChCC,yBAAyB,QACtB,wBAAwB;AAQ/B,MAAMC,aAAqC,GAAGC,IAAA,IAIxC;EAAA,IAJyC;IAC3CC,gBAAgB;IAChBC,OAAO;IACPC;EACJ,CAAC,GAAAH,IAAA;EACG,MAAM,CAACI,UAAU,EAAEC,aAAa,CAAC,GAAGZ,QAAQ,CAAC,IAAI,CAAC;EAClD,MAAM,CAACa,UAAU,EAAEC,aAAa,CAAC,GAAGd,QAAQ,CAAC,EAAE,CAAC;EAEhDF,SAAS,CAAC,MAAM;IACZ,IAAIU,gBAAgB,CAACO,OAAO,EAAE;MAC1BD,aAAa,CAACN,gBAAgB,CAACO,OAAO,CAACC,WAAW,IAAI,EAAE,CAAC;IAC7D;EACJ,CAAC,EAAE,CAACR,gBAAgB,CAAC,CAAC;EAEtB,MAAMS,kBAAkB,GAAGpB,WAAW,CACjCqB,KAAa,IAAK;IACf,IAAIA,KAAK,KAAKL,UAAU,CAACM,MAAM,GAAG,CAAC,EAAE;MACjCP,aAAa,CAAC,KAAK,CAAC;MACpBF,4BAA4B,CAAC,IAAI,CAAC;IACtC;EACJ,CAAC,EACD,CAACG,UAAU,CAACM,MAAM,EAAET,4BAA4B,CACpD,CAAC;EAED,MAAMU,OAAO,GAAGrB,OAAO,CACnB,MACIc,UAAU,CAACQ,KAAK,CAAC,EAAE,CAAC,CAACC,GAAG,CAAC,CAACC,MAAM,EAAEL,KAAK,kBACnCtB,KAAA,CAAA4B,aAAA,CAACrB,yBAAyB;IACtBsB,cAAc,EAAEA,CAAA,KAAMR,kBAAkB,CAACC,KAAK,CAAE;IAChDQ,MAAM,EAAER;EAAM,GAEbK,MACsB,CAC9B,CAAC,EACN,CAACN,kBAAkB,EAAEJ,UAAU,CACnC,CAAC;EAED,oBACIjB,KAAA,CAAA4B,aAAA,CAACtB,mBAAmB;IAACyB,WAAW,EAAEhB;EAAW,gBACzCf,KAAA,CAAA4B,aAAA,CAACnB,yBAAyB;IACtBuB,GAAG,EAAEpB,gBAAiB;IACtBqB,uBAAuB,EAAE;MAAEC,MAAM,EAAE7B,iBAAiB,CAACQ,OAAO;IAAE;EAAE,CACnE,CAAC,EACDE,UAAU,iBACPf,KAAA,CAAA4B,aAAA,CAACpB,gCAAgC,QAAEgB,OAA0C,CAEhE,CAAC;AAE9B,CAAC;AAEDd,aAAa,CAACyB,WAAW,GAAG,eAAe;AAE3C,eAAezB,aAAa"}
|
|
1
|
+
{"version":3,"file":"PrefixElement.js","names":["React","useCallback","useEffect","useMemo","useState","convertTextToHTML","StyledPrefixElement","StyledPrefixElementLetter","StyledPrefixElementLetterWrapper","StyledPrefixElementPseudo","PrefixElement","_ref","prefixElementRef","element","setIsPrefixAnimationFinished","shouldShow","setShouldShow","prefixText","setPrefixText","current","textContent","handleAnimationEnd","index","length","content","split","map","letter","createElement","onAnimationEnd","$index","$shouldShow","ref","dangerouslySetInnerHTML","__html","displayName"],"sources":["../../../../src/components/emoji-input/prefix-element/PrefixElement.tsx"],"sourcesContent":["import React, {\n useCallback,\n useEffect,\n useMemo,\n useState,\n type Dispatch,\n type FC,\n type RefObject,\n type SetStateAction,\n} from 'react';\nimport { convertTextToHTML } from '../../../utils/text';\nimport {\n StyledPrefixElement,\n StyledPrefixElementLetter,\n StyledPrefixElementLetterWrapper,\n StyledPrefixElementPseudo,\n} from './PrefixElement.styles';\n\nexport type PrefixElementProps = {\n prefixElementRef: RefObject<HTMLDivElement>;\n element: string;\n setIsPrefixAnimationFinished: Dispatch<SetStateAction<boolean>>;\n};\n\nconst PrefixElement: FC<PrefixElementProps> = ({\n prefixElementRef,\n element,\n setIsPrefixAnimationFinished,\n}) => {\n const [shouldShow, setShouldShow] = useState(true);\n const [prefixText, setPrefixText] = useState('');\n\n useEffect(() => {\n if (prefixElementRef.current) {\n setPrefixText(prefixElementRef.current.textContent ?? '');\n }\n }, [prefixElementRef]);\n\n const handleAnimationEnd = useCallback(\n (index: number) => {\n if (index === prefixText.length - 1) {\n setShouldShow(false);\n setIsPrefixAnimationFinished(true);\n }\n },\n [prefixText.length, setIsPrefixAnimationFinished],\n );\n\n const content = useMemo(\n () =>\n prefixText.split('').map((letter, index) => (\n <StyledPrefixElementLetter\n onAnimationEnd={() => handleAnimationEnd(index)}\n $index={index}\n >\n {letter}\n </StyledPrefixElementLetter>\n )),\n [handleAnimationEnd, prefixText],\n );\n\n return (\n <StyledPrefixElement $shouldShow={shouldShow}>\n <StyledPrefixElementPseudo\n ref={prefixElementRef}\n dangerouslySetInnerHTML={{ __html: convertTextToHTML(element) }}\n />\n {shouldShow && (\n <StyledPrefixElementLetterWrapper>{content}</StyledPrefixElementLetterWrapper>\n )}\n </StyledPrefixElement>\n );\n};\n\nPrefixElement.displayName = 'PrefixElement';\n\nexport default PrefixElement;\n"],"mappings":"AAAA,OAAOA,KAAK,IACRC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,QAAQ,QAKL,OAAO;AACd,SAASC,iBAAiB,QAAQ,qBAAqB;AACvD,SACIC,mBAAmB,EACnBC,yBAAyB,EACzBC,gCAAgC,EAChCC,yBAAyB,QACtB,wBAAwB;AAQ/B,MAAMC,aAAqC,GAAGC,IAAA,IAIxC;EAAA,IAJyC;IAC3CC,gBAAgB;IAChBC,OAAO;IACPC;EACJ,CAAC,GAAAH,IAAA;EACG,MAAM,CAACI,UAAU,EAAEC,aAAa,CAAC,GAAGZ,QAAQ,CAAC,IAAI,CAAC;EAClD,MAAM,CAACa,UAAU,EAAEC,aAAa,CAAC,GAAGd,QAAQ,CAAC,EAAE,CAAC;EAEhDF,SAAS,CAAC,MAAM;IACZ,IAAIU,gBAAgB,CAACO,OAAO,EAAE;MAC1BD,aAAa,CAACN,gBAAgB,CAACO,OAAO,CAACC,WAAW,IAAI,EAAE,CAAC;IAC7D;EACJ,CAAC,EAAE,CAACR,gBAAgB,CAAC,CAAC;EAEtB,MAAMS,kBAAkB,GAAGpB,WAAW,CACjCqB,KAAa,IAAK;IACf,IAAIA,KAAK,KAAKL,UAAU,CAACM,MAAM,GAAG,CAAC,EAAE;MACjCP,aAAa,CAAC,KAAK,CAAC;MACpBF,4BAA4B,CAAC,IAAI,CAAC;IACtC;EACJ,CAAC,EACD,CAACG,UAAU,CAACM,MAAM,EAAET,4BAA4B,CACpD,CAAC;EAED,MAAMU,OAAO,GAAGrB,OAAO,CACnB,MACIc,UAAU,CAACQ,KAAK,CAAC,EAAE,CAAC,CAACC,GAAG,CAAC,CAACC,MAAM,EAAEL,KAAK,kBACnCtB,KAAA,CAAA4B,aAAA,CAACrB,yBAAyB;IACtBsB,cAAc,EAAEA,CAAA,KAAMR,kBAAkB,CAACC,KAAK,CAAE;IAChDQ,MAAM,EAAER;EAAM,GAEbK,MACsB,CAC9B,CAAC,EACN,CAACN,kBAAkB,EAAEJ,UAAU,CACnC,CAAC;EAED,oBACIjB,KAAA,CAAA4B,aAAA,CAACtB,mBAAmB;IAACyB,WAAW,EAAEhB;EAAW,gBACzCf,KAAA,CAAA4B,aAAA,CAACnB,yBAAyB;IACtBuB,GAAG,EAAEpB,gBAAiB;IACtBqB,uBAAuB,EAAE;MAAEC,MAAM,EAAE7B,iBAAiB,CAACQ,OAAO;IAAE;EAAE,CACnE,CAAC,EACDE,UAAU,iBACPf,KAAA,CAAA4B,aAAA,CAACpB,gCAAgC,QAAEgB,OAA0C,CAEhE,CAAC;AAE9B,CAAC;AAEDd,aAAa,CAACyB,WAAW,GAAG,eAAe;AAE3C,eAAezB,aAAa","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PrefixElement.styles.js","names":["styled","keyframes","StyledPrefixElement","div","StyledPrefixElementPseudo","StyledPrefixElementLetterWrapper","waviy","_ref","theme","text","backgroundPan","StyledPrefixElementLetter","span","_ref2","_ref3","$index","_ref4"],"sources":["../../../../src/components/emoji-input/prefix-element/PrefixElement.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled, { keyframes } from 'styled-components';\n\ntype StyledPrefixElementProps = WithTheme<{\n $shouldShow: boolean;\n}>;\n\nexport const StyledPrefixElement = styled.div<StyledPrefixElementProps>`\n position: absolute;\n`;\n\nexport const StyledPrefixElementPseudo = styled.div`\n visibility: hidden;\n`;\n\nexport const StyledPrefixElementLetterWrapper = styled.div`\n transform: translateY(-2px);\n`;\n\ntype StyledPrefixElementLetterProps = WithTheme<{\n $index: number;\n}>;\n\nconst waviy = keyframes`\n 0%, 40% {\n background: linear-gradient(to right, rgb(15, 109, 126), rgb(15, 109, 126), rgb(115, 190, 204), rgb(15, 109, 126));\n background-clip: text;\n transform: translateY(0) scale(1);\n opacity: 1;\n }\n 20% {\n transform: translateY(-2px) scale(1.2);\n opacity: 1;\n }\n 100% {\n -webkit-text-fill-color: ${({ theme }: WithTheme<unknown>) => theme.text};\n transform: translateY(0) scale(1);\n opacity: 1;\n }\n`;\n\nconst backgroundPan = keyframes`\n 0% {\n background-position: 0 center;\n }\n 100% {\n background-position: -200% center;\n }\n`;\n\nexport const StyledPrefixElementLetter = styled.span<StyledPrefixElementLetterProps>`\n background-clip: text;\n -webkit-text-fill-color: transparent;\n background-color: ${({ theme }: StyledPrefixElementLetterProps) => theme.text};\n opacity: 0;\n\n animation:\n ${waviy} 0.4s forwards,\n ${backgroundPan} 0.1s linear infinite;\n animation-delay: calc(0.03s * ${({ $index }) => $index});\n\n font-weight: ${({ $index }) => ($index > 0 ? 'bold' : 'normal')};\n`;\n"],"mappings":"AACA,OAAOA,MAAM,IAAIC,SAAS,QAAQ,mBAAmB;AAMrD,OAAO,MAAMC,mBAAmB,GAAGF,MAAM,CAACG,GAA8B;AACxE;AACA,CAAC;AAED,OAAO,MAAMC,yBAAyB,GAAGJ,MAAM,CAACG,GAAI;AACpD;AACA,CAAC;AAED,OAAO,MAAME,gCAAgC,GAAGL,MAAM,CAACG,GAAI;AAC3D;AACA,CAAC;AAMD,MAAMG,KAAK,GAAGL,SAAU;AACxB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mCAAmCM,IAAA;EAAA,IAAC;IAAEC;EAA0B,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAACC,IAAI;AAAA,CAAC;AACjF;AACA;AACA;AACA,CAAC;AAED,MAAMC,aAAa,GAAGT,SAAU;AAChC;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMU,yBAAyB,GAAGX,MAAM,CAACY,IAAqC;AACrF;AACA;AACA,wBAAwBC,KAAA;EAAA,IAAC;IAAEL;EAAsC,CAAC,GAAAK,KAAA;EAAA,OAAKL,KAAK,CAACC,IAAI;AAAA,CAAC;AAClF;AACA;AACA;AACA,UAAUH,KAAM;AAChB,UAAUI,aAAc;AACxB,oCAAoCI,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAKC,MAAM;AAAA,CAAC;AAC3D;AACA,mBAAmBC,KAAA;EAAA,IAAC;IAAED;EAAO,CAAC,GAAAC,KAAA;EAAA,OAAMD,MAAM,GAAG,CAAC,GAAG,MAAM,GAAG,QAAQ;AAAA,CAAE;AACpE,CAAC"}
|
|
1
|
+
{"version":3,"file":"PrefixElement.styles.js","names":["styled","keyframes","StyledPrefixElement","div","StyledPrefixElementPseudo","StyledPrefixElementLetterWrapper","waviy","_ref","theme","text","backgroundPan","StyledPrefixElementLetter","span","_ref2","_ref3","$index","_ref4"],"sources":["../../../../src/components/emoji-input/prefix-element/PrefixElement.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled, { keyframes } from 'styled-components';\n\ntype StyledPrefixElementProps = WithTheme<{\n $shouldShow: boolean;\n}>;\n\nexport const StyledPrefixElement = styled.div<StyledPrefixElementProps>`\n position: absolute;\n`;\n\nexport const StyledPrefixElementPseudo = styled.div`\n visibility: hidden;\n`;\n\nexport const StyledPrefixElementLetterWrapper = styled.div`\n transform: translateY(-2px);\n`;\n\ntype StyledPrefixElementLetterProps = WithTheme<{\n $index: number;\n}>;\n\nconst waviy = keyframes`\n 0%, 40% {\n background: linear-gradient(to right, rgb(15, 109, 126), rgb(15, 109, 126), rgb(115, 190, 204), rgb(15, 109, 126));\n background-clip: text;\n transform: translateY(0) scale(1);\n opacity: 1;\n }\n 20% {\n transform: translateY(-2px) scale(1.2);\n opacity: 1;\n }\n 100% {\n -webkit-text-fill-color: ${({ theme }: WithTheme<unknown>) => theme.text};\n transform: translateY(0) scale(1);\n opacity: 1;\n }\n`;\n\nconst backgroundPan = keyframes`\n 0% {\n background-position: 0 center;\n }\n 100% {\n background-position: -200% center;\n }\n`;\n\nexport const StyledPrefixElementLetter = styled.span<StyledPrefixElementLetterProps>`\n background-clip: text;\n -webkit-text-fill-color: transparent;\n background-color: ${({ theme }: StyledPrefixElementLetterProps) => theme.text};\n opacity: 0;\n\n animation:\n ${waviy} 0.4s forwards,\n ${backgroundPan} 0.1s linear infinite;\n animation-delay: calc(0.03s * ${({ $index }) => $index});\n\n font-weight: ${({ $index }) => ($index > 0 ? 'bold' : 'normal')};\n`;\n"],"mappings":"AACA,OAAOA,MAAM,IAAIC,SAAS,QAAQ,mBAAmB;AAMrD,OAAO,MAAMC,mBAAmB,GAAGF,MAAM,CAACG,GAA8B;AACxE;AACA,CAAC;AAED,OAAO,MAAMC,yBAAyB,GAAGJ,MAAM,CAACG,GAAI;AACpD;AACA,CAAC;AAED,OAAO,MAAME,gCAAgC,GAAGL,MAAM,CAACG,GAAI;AAC3D;AACA,CAAC;AAMD,MAAMG,KAAK,GAAGL,SAAU;AACxB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mCAAmCM,IAAA;EAAA,IAAC;IAAEC;EAA0B,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAACC,IAAI;AAAA,CAAC;AACjF;AACA;AACA;AACA,CAAC;AAED,MAAMC,aAAa,GAAGT,SAAU;AAChC;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMU,yBAAyB,GAAGX,MAAM,CAACY,IAAqC;AACrF;AACA;AACA,wBAAwBC,KAAA;EAAA,IAAC;IAAEL;EAAsC,CAAC,GAAAK,KAAA;EAAA,OAAKL,KAAK,CAACC,IAAI;AAAA,CAAC;AAClF;AACA;AACA;AACA,UAAUH,KAAM;AAChB,UAAUI,aAAc;AACxB,oCAAoCI,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAKC,MAAM;AAAA,CAAC;AAC3D;AACA,mBAAmBC,KAAA;EAAA,IAAC;IAAED;EAAO,CAAC,GAAAC,KAAA;EAAA,OAAMD,MAAM,GAAG,CAAC,GAAG,MAAM,GAAG,QAAQ;AAAA,CAAE;AACpE,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmojiPicker.js","names":["Input","React","useCallback","useState","emojiCategories","EmojiPickerCategories","EmojiPickerEmojis","StyledEmojiPicker","EmojiPicker","_ref","accessToken","onSelect","personId","searchString","setSearchString","selectedCategory","setSelectedCategory","slug","handleCategorySelect","category","handleSearchChange","event","target","value","createElement","onChange","placeholder","displayName"],"sources":["../../../src/components/emoji-picker/EmojiPicker.tsx"],"sourcesContent":["import { Input } from '@chayns-components/core';\nimport React, { ChangeEvent, FC, useCallback, useState } from 'react';\nimport emojiCategories from 'unicode-emoji-json/data-by-group.json';\nimport type { Category } from '../../types/category';\nimport EmojiPickerCategories from './emoji-picker-categories/EmojiPickerCategories';\nimport EmojiPickerEmojis from './emoji-picker-emojis/EmojiPickerEmojis';\nimport { StyledEmojiPicker } from './EmojiPicker.styles';\n\nexport type EmojiPickerProps = {\n /**\n * Access token of the logged-in user. Is needed to load and save the history of the emojis.\n */\n accessToken?: string;\n /**\n * Function executed when an emoji is selected in the popup\n * @param {string} emoji - Emoji that was selected\n */\n onSelect: (emoji: string) => void;\n /**\n * Person id of the logged-in user. Is needed to load and save the history of the emojis.\n */\n personId?: string;\n};\nconst EmojiPicker: FC<EmojiPickerProps> = ({ accessToken, onSelect, personId }) => {\n const [searchString, setSearchString] = useState('');\n const [selectedCategory, setSelectedCategory] = useState(emojiCategories[0]?.slug as Category);\n\n const handleCategorySelect = useCallback((category: Category) => {\n setSearchString('');\n setSelectedCategory(category);\n }, []);\n\n const handleSearchChange = useCallback((event: ChangeEvent<HTMLInputElement>) => {\n setSearchString(event.target.value);\n }, []);\n\n return (\n <StyledEmojiPicker>\n <Input onChange={handleSearchChange} placeholder=\"Suchen\" value={searchString} />\n <EmojiPickerEmojis\n accessToken={accessToken}\n onSelect={onSelect}\n personId={personId}\n searchString={searchString}\n selectedCategory={selectedCategory}\n />\n <EmojiPickerCategories\n onSelect={handleCategorySelect}\n searchString={searchString}\n selectedCategory={selectedCategory}\n />\n </StyledEmojiPicker>\n );\n};\n\nEmojiPicker.displayName = 'EmojiPicker';\n\nexport default EmojiPicker;\n"],"mappings":"AAAA,SAASA,KAAK,QAAQ,yBAAyB;AAC/C,OAAOC,KAAK,IAAqBC,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AACrE,OAAOC,eAAe,MAAM,uCAAuC;AAEnE,OAAOC,qBAAqB,MAAM,iDAAiD;AACnF,OAAOC,iBAAiB,MAAM,yCAAyC;AACvE,SAASC,iBAAiB,QAAQ,sBAAsB;AAiBxD,MAAMC,WAAiC,GAAGC,IAAA,IAAyC;EAAA,IAAxC;IAAEC,WAAW;IAAEC,QAAQ;IAAEC;EAAS,CAAC,GAAAH,IAAA;EAC1E,MAAM,CAACI,YAAY,EAAEC,eAAe,CAAC,GAAGX,QAAQ,CAAC,EAAE,CAAC;EACpD,MAAM,CAACY,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGb,QAAQ,CAACC,eAAe,CAAC,CAAC,CAAC,EAAEa,IAAgB,CAAC;EAE9F,MAAMC,oBAAoB,GAAGhB,WAAW,CAAEiB,QAAkB,IAAK;IAC7DL,eAAe,CAAC,EAAE,CAAC;IACnBE,mBAAmB,CAACG,QAAQ,CAAC;EACjC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,kBAAkB,GAAGlB,WAAW,CAAEmB,KAAoC,IAAK;IAC7EP,eAAe,CAACO,KAAK,CAACC,MAAM,CAACC,KAAK,CAAC;EACvC,CAAC,EAAE,EAAE,CAAC;EAEN,oBACItB,KAAA,CAAAuB,aAAA,CAACjB,iBAAiB,qBACdN,KAAA,CAAAuB,aAAA,CAACxB,KAAK;IAACyB,QAAQ,EAAEL,kBAAmB;IAACM,WAAW,EAAC,QAAQ;IAACH,KAAK,EAAEV;EAAa,CAAE,CAAC,eACjFZ,KAAA,CAAAuB,aAAA,CAAClB,iBAAiB;IACdI,WAAW,EAAEA,WAAY;IACzBC,QAAQ,EAAEA,QAAS;IACnBC,QAAQ,EAAEA,QAAS;IACnBC,YAAY,EAAEA,YAAa;IAC3BE,gBAAgB,EAAEA;EAAiB,CACtC,CAAC,eACFd,KAAA,CAAAuB,aAAA,CAACnB,qBAAqB;IAClBM,QAAQ,EAAEO,oBAAqB;IAC/BL,YAAY,EAAEA,YAAa;IAC3BE,gBAAgB,EAAEA;EAAiB,CACtC,CACc,CAAC;AAE5B,CAAC;AAEDP,WAAW,CAACmB,WAAW,GAAG,aAAa;AAEvC,eAAenB,WAAW"}
|
|
1
|
+
{"version":3,"file":"EmojiPicker.js","names":["Input","React","useCallback","useState","emojiCategories","EmojiPickerCategories","EmojiPickerEmojis","StyledEmojiPicker","EmojiPicker","_ref","accessToken","onSelect","personId","searchString","setSearchString","selectedCategory","setSelectedCategory","slug","handleCategorySelect","category","handleSearchChange","event","target","value","createElement","onChange","placeholder","displayName"],"sources":["../../../src/components/emoji-picker/EmojiPicker.tsx"],"sourcesContent":["import { Input } from '@chayns-components/core';\nimport React, { ChangeEvent, FC, useCallback, useState } from 'react';\nimport emojiCategories from 'unicode-emoji-json/data-by-group.json';\nimport type { Category } from '../../types/category';\nimport EmojiPickerCategories from './emoji-picker-categories/EmojiPickerCategories';\nimport EmojiPickerEmojis from './emoji-picker-emojis/EmojiPickerEmojis';\nimport { StyledEmojiPicker } from './EmojiPicker.styles';\n\nexport type EmojiPickerProps = {\n /**\n * Access token of the logged-in user. Is needed to load and save the history of the emojis.\n */\n accessToken?: string;\n /**\n * Function executed when an emoji is selected in the popup\n * @param {string} emoji - Emoji that was selected\n */\n onSelect: (emoji: string) => void;\n /**\n * Person id of the logged-in user. Is needed to load and save the history of the emojis.\n */\n personId?: string;\n};\nconst EmojiPicker: FC<EmojiPickerProps> = ({ accessToken, onSelect, personId }) => {\n const [searchString, setSearchString] = useState('');\n const [selectedCategory, setSelectedCategory] = useState(emojiCategories[0]?.slug as Category);\n\n const handleCategorySelect = useCallback((category: Category) => {\n setSearchString('');\n setSelectedCategory(category);\n }, []);\n\n const handleSearchChange = useCallback((event: ChangeEvent<HTMLInputElement>) => {\n setSearchString(event.target.value);\n }, []);\n\n return (\n <StyledEmojiPicker>\n <Input onChange={handleSearchChange} placeholder=\"Suchen\" value={searchString} />\n <EmojiPickerEmojis\n accessToken={accessToken}\n onSelect={onSelect}\n personId={personId}\n searchString={searchString}\n selectedCategory={selectedCategory}\n />\n <EmojiPickerCategories\n onSelect={handleCategorySelect}\n searchString={searchString}\n selectedCategory={selectedCategory}\n />\n </StyledEmojiPicker>\n );\n};\n\nEmojiPicker.displayName = 'EmojiPicker';\n\nexport default EmojiPicker;\n"],"mappings":"AAAA,SAASA,KAAK,QAAQ,yBAAyB;AAC/C,OAAOC,KAAK,IAAqBC,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AACrE,OAAOC,eAAe,MAAM,uCAAuC;AAEnE,OAAOC,qBAAqB,MAAM,iDAAiD;AACnF,OAAOC,iBAAiB,MAAM,yCAAyC;AACvE,SAASC,iBAAiB,QAAQ,sBAAsB;AAiBxD,MAAMC,WAAiC,GAAGC,IAAA,IAAyC;EAAA,IAAxC;IAAEC,WAAW;IAAEC,QAAQ;IAAEC;EAAS,CAAC,GAAAH,IAAA;EAC1E,MAAM,CAACI,YAAY,EAAEC,eAAe,CAAC,GAAGX,QAAQ,CAAC,EAAE,CAAC;EACpD,MAAM,CAACY,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGb,QAAQ,CAACC,eAAe,CAAC,CAAC,CAAC,EAAEa,IAAgB,CAAC;EAE9F,MAAMC,oBAAoB,GAAGhB,WAAW,CAAEiB,QAAkB,IAAK;IAC7DL,eAAe,CAAC,EAAE,CAAC;IACnBE,mBAAmB,CAACG,QAAQ,CAAC;EACjC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,kBAAkB,GAAGlB,WAAW,CAAEmB,KAAoC,IAAK;IAC7EP,eAAe,CAACO,KAAK,CAACC,MAAM,CAACC,KAAK,CAAC;EACvC,CAAC,EAAE,EAAE,CAAC;EAEN,oBACItB,KAAA,CAAAuB,aAAA,CAACjB,iBAAiB,qBACdN,KAAA,CAAAuB,aAAA,CAACxB,KAAK;IAACyB,QAAQ,EAAEL,kBAAmB;IAACM,WAAW,EAAC,QAAQ;IAACH,KAAK,EAAEV;EAAa,CAAE,CAAC,eACjFZ,KAAA,CAAAuB,aAAA,CAAClB,iBAAiB;IACdI,WAAW,EAAEA,WAAY;IACzBC,QAAQ,EAAEA,QAAS;IACnBC,QAAQ,EAAEA,QAAS;IACnBC,YAAY,EAAEA,YAAa;IAC3BE,gBAAgB,EAAEA;EAAiB,CACtC,CAAC,eACFd,KAAA,CAAAuB,aAAA,CAACnB,qBAAqB;IAClBM,QAAQ,EAAEO,oBAAqB;IAC/BL,YAAY,EAAEA,YAAa;IAC3BE,gBAAgB,EAAEA;EAAiB,CACtC,CACc,CAAC;AAE5B,CAAC;AAEDP,WAAW,CAACmB,WAAW,GAAG,aAAa;AAEvC,eAAenB,WAAW","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmojiPicker.styles.js","names":["styled","emojiPickerSize","height","width","StyledEmojiPicker","div"],"sources":["../../../src/components/emoji-picker/EmojiPicker.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const emojiPickerSize = {\n height: 285,\n width: 350,\n};\n\nexport const StyledEmojiPicker = styled.div`\n align-items: center;\n display: flex;\n flex-direction: column;\n height: ${emojiPickerSize.height}px;\n justify-content: center;\n padding: 10px 22px;\n width: ${emojiPickerSize.width}px;\n user-select: none;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAEtC,OAAO,MAAMC,eAAe,GAAG;EAC3BC,MAAM,EAAE,GAAG;EACXC,KAAK,EAAE;AACX,CAAC;AAED,OAAO,MAAMC,iBAAiB,GAAGJ,MAAM,CAACK,GAAI;AAC5C;AACA;AACA;AACA,cAAcJ,eAAe,CAACC,MAAO;AACrC;AACA;AACA,aAAaD,eAAe,CAACE,KAAM;AACnC;AACA,CAAC"}
|
|
1
|
+
{"version":3,"file":"EmojiPicker.styles.js","names":["styled","emojiPickerSize","height","width","StyledEmojiPicker","div"],"sources":["../../../src/components/emoji-picker/EmojiPicker.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const emojiPickerSize = {\n height: 285,\n width: 350,\n};\n\nexport const StyledEmojiPicker = styled.div`\n align-items: center;\n display: flex;\n flex-direction: column;\n height: ${emojiPickerSize.height}px;\n justify-content: center;\n padding: 10px 22px;\n width: ${emojiPickerSize.width}px;\n user-select: none;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAEtC,OAAO,MAAMC,eAAe,GAAG;EAC3BC,MAAM,EAAE,GAAG;EACXC,KAAK,EAAE;AACX,CAAC;AAED,OAAO,MAAMC,iBAAiB,GAAGJ,MAAM,CAACK,GAAI;AAC5C;AACA;AACA;AACA,cAAcJ,eAAe,CAACC,MAAO;AACrC;AACA;AACA,aAAaD,eAAe,CAACE,KAAM;AACnC;AACA,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmojiPickerCategories.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","unicodeEmoji","CATEGORY_EMOJIS","StyledEmojiPickerCategories","StyledMotionEmojiPickerCategory","EmojiPickerCategories","_ref","onSelect","searchString","selectedCategory","focusedIndex","setFocusedIndex","categoryRef","isSearchStringGiven","trim","handleSelect","slug","handleKeyDown","event","key","shiftKey","preventDefault","children","current","length","newIndex","prevElement","tabIndex","newElement","focus","id","document","addEventListener","removeEventListener","handleClick","categories","categorySlugs","map","_ref2","unshift","isSelected","createElement","animate","filter","opacity","className","initial","onClick","transition","duration","ref","displayName"],"sources":["../../../../src/components/emoji-picker/emoji-picker-categories/EmojiPickerCategories.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport unicodeEmoji from 'unicode-emoji-json/data-by-group.json';\nimport { CATEGORY_EMOJIS } from '../../../constants/categories';\nimport type { Category } from '../../../types/category';\nimport {\n StyledEmojiPickerCategories,\n StyledMotionEmojiPickerCategory,\n} from './EmojiPickerCategories.styles';\n\nexport type EmojiPickerCategoriesProps = {\n onSelect: (category: Category) => void;\n searchString: string;\n selectedCategory: Category;\n};\n\nconst EmojiPickerCategories: FC<EmojiPickerCategoriesProps> = ({\n onSelect,\n searchString,\n selectedCategory,\n}) => {\n const [focusedIndex, setFocusedIndex] = useState(1);\n\n const categoryRef = useRef<HTMLDivElement>(null);\n\n const isSearchStringGiven = searchString.trim() !== '';\n\n const handleSelect = useCallback(\n (slug: Category) => {\n onSelect(slug);\n },\n [onSelect],\n );\n\n useEffect(() => {\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Tab' || (event.key === 'Tab' && event.shiftKey)) {\n event.preventDefault();\n\n const children = categoryRef.current?.children;\n if (children && children.length > 0) {\n let newIndex = focusedIndex !== null ? focusedIndex : 0;\n\n if (event.key === 'Tab' && event.shiftKey) {\n newIndex = (newIndex - 1) % children.length;\n } else if (event.key === 'Tab') {\n newIndex = (newIndex + 1) % children.length;\n }\n\n // remove focus from the old element\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n if (newIndex < 0) {\n newIndex = children.length - 1;\n } else if (newIndex > children.length - 1) {\n newIndex = 0;\n }\n\n setFocusedIndex(newIndex);\n\n // Set focus to the element\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n\n if (!newElement) {\n return;\n }\n\n const { id } = newElement;\n\n handleSelect(id as Category);\n }\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [focusedIndex, handleSelect]);\n\n const handleClick = useCallback(\n (slug: Category) => {\n handleSelect(slug);\n },\n [handleSelect],\n );\n\n const categories = useMemo(() => {\n const categorySlugs = unicodeEmoji.map(({ slug }) => slug);\n\n categorySlugs.unshift('history');\n\n return categorySlugs.map((slug) => {\n const isSelected = selectedCategory === slug && !isSearchStringGiven;\n\n return (\n <StyledMotionEmojiPickerCategory\n animate={{\n filter: `grayscale(${isSelected ? 0 : 0.75})`,\n opacity: isSelected ? 1 : 0.5,\n }}\n className=\"prevent-lose-focus\"\n initial={false}\n key={slug}\n id={slug}\n onClick={() => handleClick(slug as Category)}\n transition={{ duration: 0.2 }}\n >\n {CATEGORY_EMOJIS[slug as Category]}\n </StyledMotionEmojiPickerCategory>\n );\n });\n }, [handleClick, isSearchStringGiven, selectedCategory]);\n\n return (\n <StyledEmojiPickerCategories ref={categoryRef}>{categories}</StyledEmojiPickerCategories>\n );\n};\n\nEmojiPickerCategories.displayName = 'EmojiPickerCategories';\n\nexport default EmojiPickerCategories;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"EmojiPickerCategories.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","unicodeEmoji","CATEGORY_EMOJIS","StyledEmojiPickerCategories","StyledMotionEmojiPickerCategory","EmojiPickerCategories","_ref","onSelect","searchString","selectedCategory","focusedIndex","setFocusedIndex","categoryRef","isSearchStringGiven","trim","handleSelect","slug","handleKeyDown","event","key","shiftKey","preventDefault","children","current","length","newIndex","prevElement","tabIndex","newElement","focus","id","document","addEventListener","removeEventListener","handleClick","categories","categorySlugs","map","_ref2","unshift","isSelected","createElement","animate","filter","opacity","className","initial","onClick","transition","duration","ref","displayName"],"sources":["../../../../src/components/emoji-picker/emoji-picker-categories/EmojiPickerCategories.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport unicodeEmoji from 'unicode-emoji-json/data-by-group.json';\nimport { CATEGORY_EMOJIS } from '../../../constants/categories';\nimport type { Category } from '../../../types/category';\nimport {\n StyledEmojiPickerCategories,\n StyledMotionEmojiPickerCategory,\n} from './EmojiPickerCategories.styles';\n\nexport type EmojiPickerCategoriesProps = {\n onSelect: (category: Category) => void;\n searchString: string;\n selectedCategory: Category;\n};\n\nconst EmojiPickerCategories: FC<EmojiPickerCategoriesProps> = ({\n onSelect,\n searchString,\n selectedCategory,\n}) => {\n const [focusedIndex, setFocusedIndex] = useState(1);\n\n const categoryRef = useRef<HTMLDivElement>(null);\n\n const isSearchStringGiven = searchString.trim() !== '';\n\n const handleSelect = useCallback(\n (slug: Category) => {\n onSelect(slug);\n },\n [onSelect],\n );\n\n useEffect(() => {\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Tab' || (event.key === 'Tab' && event.shiftKey)) {\n event.preventDefault();\n\n const children = categoryRef.current?.children;\n if (children && children.length > 0) {\n let newIndex = focusedIndex !== null ? focusedIndex : 0;\n\n if (event.key === 'Tab' && event.shiftKey) {\n newIndex = (newIndex - 1) % children.length;\n } else if (event.key === 'Tab') {\n newIndex = (newIndex + 1) % children.length;\n }\n\n // remove focus from the old element\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n if (newIndex < 0) {\n newIndex = children.length - 1;\n } else if (newIndex > children.length - 1) {\n newIndex = 0;\n }\n\n setFocusedIndex(newIndex);\n\n // Set focus to the element\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n\n if (!newElement) {\n return;\n }\n\n const { id } = newElement;\n\n handleSelect(id as Category);\n }\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [focusedIndex, handleSelect]);\n\n const handleClick = useCallback(\n (slug: Category) => {\n handleSelect(slug);\n },\n [handleSelect],\n );\n\n const categories = useMemo(() => {\n const categorySlugs = unicodeEmoji.map(({ slug }) => slug);\n\n categorySlugs.unshift('history');\n\n return categorySlugs.map((slug) => {\n const isSelected = selectedCategory === slug && !isSearchStringGiven;\n\n return (\n <StyledMotionEmojiPickerCategory\n animate={{\n filter: `grayscale(${isSelected ? 0 : 0.75})`,\n opacity: isSelected ? 1 : 0.5,\n }}\n className=\"prevent-lose-focus\"\n initial={false}\n key={slug}\n id={slug}\n onClick={() => handleClick(slug as Category)}\n transition={{ duration: 0.2 }}\n >\n {CATEGORY_EMOJIS[slug as Category]}\n </StyledMotionEmojiPickerCategory>\n );\n });\n }, [handleClick, isSearchStringGiven, selectedCategory]);\n\n return (\n <StyledEmojiPickerCategories ref={categoryRef}>{categories}</StyledEmojiPickerCategories>\n );\n};\n\nEmojiPickerCategories.displayName = 'EmojiPickerCategories';\n\nexport default EmojiPickerCategories;\n"],"mappings":"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","ignoreList":[]}
|
package/lib/components/emoji-picker/emoji-picker-categories/EmojiPickerCategories.styles.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
/// <reference types="react" />
|
|
3
3
|
export declare const StyledEmojiPickerCategories: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
|
|
4
|
-
export declare const StyledMotionEmojiPickerCategory: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<{
|
|
4
|
+
export declare const StyledMotionEmojiPickerCategory: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<Omit<{
|
|
5
5
|
slot?: string | undefined;
|
|
6
6
|
title?: string | undefined;
|
|
7
7
|
dir?: string | undefined;
|
|
@@ -66,7 +66,7 @@ export declare const StyledMotionEmojiPickerCategory: import("styled-components"
|
|
|
66
66
|
"aria-description"?: string | undefined;
|
|
67
67
|
"aria-details"?: string | undefined;
|
|
68
68
|
"aria-disabled"?: (boolean | "true" | "false") | undefined;
|
|
69
|
-
"aria-dropeffect"?: "link" | "none" | "copy" | "
|
|
69
|
+
"aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
|
|
70
70
|
"aria-errormessage"?: string | undefined;
|
|
71
71
|
"aria-expanded"?: (boolean | "true" | "false") | undefined;
|
|
72
72
|
"aria-flowto"?: string | undefined;
|
|
@@ -88,7 +88,7 @@ export declare const StyledMotionEmojiPickerCategory: import("styled-components"
|
|
|
88
88
|
"aria-posinset"?: number | undefined;
|
|
89
89
|
"aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
|
|
90
90
|
"aria-readonly"?: (boolean | "true" | "false") | undefined;
|
|
91
|
-
"aria-relevant"?: "text" | "
|
|
91
|
+
"aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
|
|
92
92
|
"aria-required"?: (boolean | "true" | "false") | undefined;
|
|
93
93
|
"aria-roledescription"?: string | undefined;
|
|
94
94
|
"aria-rowcount"?: number | undefined;
|
|
@@ -241,9 +241,7 @@ export declare const StyledMotionEmojiPickerCategory: import("styled-components"
|
|
|
241
241
|
onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
242
242
|
onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
243
243
|
onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
244
|
-
onPointerEnterCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
245
244
|
onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
246
|
-
onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
247
245
|
onPointerOver?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
248
246
|
onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
249
247
|
onPointerOut?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
|
|
@@ -263,6 +261,8 @@ export declare const StyledMotionEmojiPickerCategory: import("styled-components"
|
|
|
263
261
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
|
|
264
262
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
265
263
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
266
|
-
} & import("framer-motion").MotionProps & import("react").RefAttributes<HTMLDivElement>, {
|
|
264
|
+
} & import("framer-motion").MotionProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
265
|
+
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
266
|
+
}, {
|
|
267
267
|
theme: import("@chayns-components/core/lib/components/color-scheme-provider/ColorSchemeProvider").Theme;
|
|
268
268
|
}>> & Omit<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
|
package/lib/components/emoji-picker/emoji-picker-categories/EmojiPickerCategories.styles.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmojiPickerCategories.styles.js","names":["motion","styled","getFontFamily","StyledEmojiPickerCategories","div","StyledMotionEmojiPickerCategory"],"sources":["../../../../src/components/emoji-picker/emoji-picker-categories/EmojiPickerCategories.styles.ts"],"sourcesContent":["import type { FramerMotionBugFix } from '@chayns-components/core';\nimport { motion } from 'framer-motion';\nimport styled from 'styled-components';\nimport { getFontFamily } from '../../../utils/font';\n\nexport const StyledEmojiPickerCategories = styled.div`\n align-items: center;\n border-top: 1px solid rgba(160, 160, 160, 0.3);\n display: flex;\n flex: 0 0 auto;\n justify-content: space-between;\n padding-top: 10px;\n width: 100%;\n`;\n\nexport const StyledMotionEmojiPickerCategory = styled(motion.div)<FramerMotionBugFix>`\n cursor: pointer;\n font-family: ${getFontFamily};\n font-size: 20px;\n`;\n"],"mappings":"AACA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAASC,aAAa,QAAQ,qBAAqB;AAEnD,OAAO,MAAMC,2BAA2B,GAAGF,MAAM,CAACG,GAAI;AACtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,+BAA+B,GAAGJ,MAAM,CAACD,MAAM,CAACI,GAAG,CAAsB;AACtF;AACA,mBAAmBF,aAAc;AACjC;AACA,CAAC"}
|
|
1
|
+
{"version":3,"file":"EmojiPickerCategories.styles.js","names":["motion","styled","getFontFamily","StyledEmojiPickerCategories","div","StyledMotionEmojiPickerCategory"],"sources":["../../../../src/components/emoji-picker/emoji-picker-categories/EmojiPickerCategories.styles.ts"],"sourcesContent":["import type { FramerMotionBugFix } from '@chayns-components/core';\nimport { motion } from 'framer-motion';\nimport styled from 'styled-components';\nimport { getFontFamily } from '../../../utils/font';\n\nexport const StyledEmojiPickerCategories = styled.div`\n align-items: center;\n border-top: 1px solid rgba(160, 160, 160, 0.3);\n display: flex;\n flex: 0 0 auto;\n justify-content: space-between;\n padding-top: 10px;\n width: 100%;\n`;\n\nexport const StyledMotionEmojiPickerCategory = styled(motion.div)<FramerMotionBugFix>`\n cursor: pointer;\n font-family: ${getFontFamily};\n font-size: 20px;\n`;\n"],"mappings":"AACA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAASC,aAAa,QAAQ,qBAAqB;AAEnD,OAAO,MAAMC,2BAA2B,GAAGF,MAAM,CAACG,GAAI;AACtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,+BAA+B,GAAGJ,MAAM,CAACD,MAAM,CAACI,GAAG,CAAsB;AACtF;AACA,mBAAmBF,aAAc;AACjC;AACA,CAAC","ignoreList":[]}
|
|
@@ -147,7 +147,6 @@ const EmojiPickerEmojis = _ref => {
|
|
|
147
147
|
name,
|
|
148
148
|
skin_tone_support
|
|
149
149
|
}] = _ref3;
|
|
150
|
-
// @ts-expect-error: Type is correct here
|
|
151
150
|
const keywords = emojiLib[emoji];
|
|
152
151
|
// @ts-expect-error: Type is correct here
|
|
153
152
|
const germanKeywords = germanEmojiLib[emoji];
|