@sendbird/uikit-react 3.9.0 → 3.9.1-rc-0

package/dist/chunks/bundle-qyl9VDFm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bundle-qyl9VDFm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/bundle-r4JH75Z9.js

@@ -0,0 +1,78 @@
+import { a as __spreadArray } from './bundle-GJNoquF6.js';
+import React__default from 'react';
+import { g as getStringSet } from './bundle-57J_rNKG.js';
+
+var Typography = {
+    H_1: 'H_1',
+    H_2: 'H_2',
+    SUBTITLE_1: 'SUBTITLE_1',
+    SUBTITLE_2: 'SUBTITLE_2',
+    BODY_1: 'BODY_1',
+    BODY_2: 'BODY_2',
+    BUTTON_1: 'BUTTON_1',
+    BUTTON_2: 'BUTTON_2',
+    CAPTION_1: 'CAPTION_1',
+    CAPTION_2: 'CAPTION_2',
+    CAPTION_3: 'CAPTION_3',
+};
+var Colors = {
+    ONBACKGROUND_1: 'ONBACKGROUND_1',
+    ONBACKGROUND_2: 'ONBACKGROUND_2',
+    ONBACKGROUND_3: 'ONBACKGROUND_3',
+    ONBACKGROUND_4: 'ONBACKGROUND_4',
+    ONCONTENT_1: 'ONCONTENT_1',
+    ONCONTENT_2: 'ONCONTENT_2',
+    PRIMARY: 'PRIMARY',
+    ERROR: 'ERROR',
+    SECONDARY_3: 'SECONDARY_3',
+};
+
+function changeTypographyToClassName(type) {
+    switch (type) {
+        case Typography.H_1: return 'sendbird-label--h-1';
+        case Typography.H_2: return 'sendbird-label--h-2';
+        case Typography.SUBTITLE_1: return 'sendbird-label--subtitle-1';
+        case Typography.SUBTITLE_2: return 'sendbird-label--subtitle-2';
+        case Typography.BODY_1: return 'sendbird-label--body-1';
+        case Typography.BODY_2: return 'sendbird-label--body-2';
+        case Typography.BUTTON_1: return 'sendbird-label--button-1';
+        case Typography.BUTTON_2: return 'sendbird-label--button-2';
+        case Typography.CAPTION_1: return 'sendbird-label--caption-1';
+        case Typography.CAPTION_2: return 'sendbird-label--caption-2';
+        case Typography.CAPTION_3: return 'sendbird-label--caption-3';
+        default: return '';
+    }
+}
+function changeColorToClassName(color) {
+    switch (color) {
+        case Colors.ONBACKGROUND_1: return 'sendbird-label--color-onbackground-1';
+        case Colors.ONBACKGROUND_2: return 'sendbird-label--color-onbackground-2';
+        case Colors.ONBACKGROUND_3: return 'sendbird-label--color-onbackground-3';
+        case Colors.ONBACKGROUND_4: return 'sendbird-label--color-onbackground-4';
+        case Colors.ONCONTENT_1: return 'sendbird-label--color-oncontent-1';
+        case Colors.ONCONTENT_2: return 'sendbird-label--color-oncontent-2';
+        case Colors.PRIMARY: return 'sendbird-label--color-primary'; // should be Primary-3 fix me
+        case Colors.ERROR: return 'sendbird-label--color-error';
+        case Colors.SECONDARY_3: return 'sendbird-label--color-secondary-3';
+        default: return '';
+    }
+}
+
+function Label(_a) {
+    var _b = _a.className, className = _b === void 0 ? [] : _b, type = _a.type, color = _a.color, _c = _a.children, children = _c === void 0 ? null : _c;
+    return (
+    // Donot make this into div
+    // Mention uses Label. If we use div, it would break the mention detection on Paste
+    // https://github.com/sendbird/sendbird-uikit-react/pull/479
+    React__default.createElement("span", { className: __spreadArray(__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
+            'sendbird-label',
+            changeTypographyToClassName(type),
+            changeColorToClassName(color),
+        ], false).join(' ') }, children));
+}
+var LabelTypography = Typography;
+var LabelColors = Colors;
+var LabelStringSet = getStringSet('en');
+
+export { Label as L, LabelTypography as a, LabelColors as b, LabelStringSet as c, changeColorToClassName as d };
+//# sourceMappingURL=bundle-r4JH75Z9.js.map

package/dist/chunks/bundle-r4JH75Z9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bundle-r4JH75Z9.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/bundle-tAWds1ZJ.js

@@ -0,0 +1,9 @@
+// note to SDK team:
+// using enum inside .d.ts won’t work for jest, but const enum will work.
+var Role = {
+    OPERATOR: 'operator',
+    NONE: 'none',
+};
+
+export { Role as R };
+//# sourceMappingURL=bundle-tAWds1ZJ.js.map

package/dist/chunks/bundle-tAWds1ZJ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bundle-tAWds1ZJ.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/chunks/bundle-tFB0rApi.js

@@ -0,0 +1,36 @@
+import React__default from 'react';
+import { K } from './bundle-oliby3QR.js';
+import { T as TOKEN_TYPES, U as USER_MENTION_PREFIX, g as getWhiteSpacePreservedText } from './bundle-NtsuR2jy.js';
+import { useMessageContext } from '../Message/context.js';
+import MentionLabel from '../ui/MentionLabel.js';
+import LinkLabel from '../ui/LinkLabel.js';
+import { a as LabelTypography } from './bundle-r4JH75Z9.js';
+
+// this function is used to generate a unique key for token in message
+// it changes with updated time and index
+// messageUpdatedAt is the key part of this key generator
+function keyGenerator(createdAt, messageUpdatedAt, index) {
+    return "sb-msg_".concat(createdAt, "_").concat(messageUpdatedAt, "_").concat(index);
+}
+
+function TextFragment(_a) {
+    var tokens = _a.tokens;
+    var messageStore = useMessageContext();
+    var message = messageStore === null || messageStore === void 0 ? void 0 : messageStore.message;
+    var isByMe = messageStore === null || messageStore === void 0 ? void 0 : messageStore.isByMe;
+    var updatedAt = message.updatedAt, createdAt = message.createdAt;
+    return (React__default.createElement(React__default.Fragment, null, tokens === null || tokens === void 0 ? void 0 : tokens.map(function (token, idx) {
+        var key = keyGenerator(createdAt, updatedAt, idx);
+        return K(token.type)
+            .with(TOKEN_TYPES.mention, function () { return (React__default.createElement("span", { className: "sendbird-word", key: key },
+            React__default.createElement(MentionLabel, { mentionTemplate: USER_MENTION_PREFIX, 
+                // @ts-ignore
+                mentionedUserId: token.userId, mentionedUserNickname: token.value, isByMe: isByMe }))); })
+            .with(TOKEN_TYPES.url, function () { return (React__default.createElement("span", { className: "sendbird-word", key: key },
+            React__default.createElement(LinkLabel, { className: "sendbird-word__url", src: token.value, type: LabelTypography.BODY_1 }, token.value))); })
+            .otherwise(function () { return React__default.createElement(React__default.Fragment, { key: key }, getWhiteSpacePreservedText(token.value)); });
+    })));
+}
+
+export { TextFragment as T };
+//# sourceMappingURL=bundle-tFB0rApi.js.map

package/dist/chunks/bundle-tFB0rApi.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bundle-tFB0rApi.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/bundle-u50YHJ4r.js

@@ -0,0 +1,72 @@
+import { useRef, useEffect, useCallback } from 'react';
+import { S as SCROLL_BUFFER } from './bundle-y_cPOJGG.js';
+
+function useDebounce(callback, delay) {
+    var timeoutRef = useRef(null);
+    useEffect(function () {
+        // Cleanup the timeout on unmount
+        return function () {
+            if (timeoutRef.current) {
+                clearTimeout(timeoutRef.current);
+            }
+        };
+    }, []);
+    function debounceFunction() {
+        var args = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            args[_i] = arguments[_i];
+        }
+        if (timeoutRef.current) {
+            clearTimeout(timeoutRef.current);
+        }
+        timeoutRef.current = setTimeout(function () {
+            callback.apply(void 0, args);
+        }, delay);
+    }
+    return debounceFunction;
+}
+
+var DELAY = 500;
+function calcScrollBottom(scrollHeight, scrollTop) {
+    return scrollHeight - scrollTop;
+}
+function useHandleOnScrollCallback(_a) {
+    var hasMore = _a.hasMore, hasNext = _a.hasNext, onScroll = _a.onScroll, scrollRef = _a.scrollRef, setShowScrollDownButton = _a.setShowScrollDownButton;
+    var scrollCb = useCallback(function () {
+        var element = scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current;
+        if (element == null) {
+            return;
+        }
+        var scrollTop = element.scrollTop, scrollHeight = element.scrollHeight, clientHeight = element.clientHeight;
+        // https://sendbird.atlassian.net/browse/SBISSUE-11759
+        // the edge case where channel is inside a page that already has scroll
+        // scrollintoView will move the whole page, which we dont want
+        var scrollBottom = calcScrollBottom(scrollHeight, scrollTop);
+        // even if there is more to fetch or not,
+        // we still have to show the scroll to bottom button
+        if (typeof setShowScrollDownButton === 'function') {
+            setShowScrollDownButton(scrollHeight > scrollTop + clientHeight + 1);
+        }
+        if (hasMore && scrollTop < SCROLL_BUFFER) {
+            onScroll(function () {
+                // sets the scroll position to the bottom of the new messages
+                element.scrollTop = element.scrollHeight - scrollBottom;
+            });
+        }
+        if (hasNext) {
+            onScroll(function () {
+                // sets the scroll position to the top of the new messages
+                element.scrollTop = scrollTop - (scrollHeight - element.scrollHeight);
+            });
+        }
+    }, [
+        setShowScrollDownButton,
+        hasMore,
+        onScroll,
+        scrollRef,
+    ]);
+    return useDebounce(scrollCb, DELAY);
+}
+
+export { useDebounce as a, useHandleOnScrollCallback as u };
+//# sourceMappingURL=bundle-u50YHJ4r.js.map

package/dist/chunks/bundle-u50YHJ4r.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bundle-u50YHJ4r.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/bundle-v54c93Bz.js

@@ -0,0 +1,77 @@
+import { _ as __assign } from './bundle-GJNoquF6.js';
+import { useState, useRef, useCallback } from 'react';
+import { u as useMediaQueryContext } from './bundle-ZqXMPrmp.js';
+
+var DEFAULT_DURATION = 300;
+function preventDefault(e) {
+    if (!isTouchEvent(e)) {
+        return;
+    }
+    if (e.touches.length < 2 && e.preventDefault) {
+        e.preventDefault();
+    }
+}
+function isTouchEvent(e) {
+    return e && 'touches' in e;
+}
+function useLongPress(_a, _b) {
+    var onLongPress = _a.onLongPress, onClick = _a.onClick;
+    var _c = _b === void 0 ? {} : _b, _d = _c.delay, delay = _d === void 0 ? DEFAULT_DURATION : _d, _e = _c.shouldPreventDefault, shouldPreventDefault = _e === void 0 ? true : _e, _f = _c.shouldStopPropagation, shouldStopPropagation = _f === void 0 ? false : _f;
+    var isMobile = useMediaQueryContext().isMobile;
+    var _g = useState(false), longPressTriggered = _g[0], setLongPressTriggered = _g[1];
+    var _h = useState(false), dragTriggered = _h[0], setDragTriggered = _h[1];
+    // https://www.typescriptlang.org/docs/handbook/utility-types.html#returntypetype
+    var timeout = useRef();
+    var target = useRef();
+    var start = useCallback(function (e) {
+        e.persist();
+        var clonedEvent = __assign({}, e);
+        setDragTriggered(false);
+        if (shouldStopPropagation) {
+            e.stopPropagation();
+        }
+        if (shouldPreventDefault && e.target) {
+            e.target.addEventListener('touchend', preventDefault, {
+                passive: false,
+            });
+            target.current = e.target;
+        }
+        timeout.current = setTimeout(function () {
+            onLongPress(clonedEvent);
+            setLongPressTriggered(true);
+        }, delay);
+    }, [onLongPress, delay, shouldPreventDefault, shouldStopPropagation, isMobile]);
+    var clear = useCallback(function (e, shouldTriggerClick, onDrag) {
+        if (shouldTriggerClick === void 0) { shouldTriggerClick = true; }
+        if (onDrag === void 0) { onDrag = false; }
+        if (onDrag) {
+            setDragTriggered(true);
+        }
+        else {
+            setDragTriggered(false);
+        }
+        if (timeout === null || timeout === void 0 ? void 0 : timeout.current) {
+            clearTimeout(timeout.current);
+        }
+        if (shouldTriggerClick && !longPressTriggered && !dragTriggered) {
+            onClick === null || onClick === void 0 ? void 0 : onClick(e);
+        }
+        setLongPressTriggered(false);
+        if (shouldPreventDefault && target.current) {
+            target.current.removeEventListener('touchend', preventDefault);
+        }
+    }, [shouldPreventDefault, onClick, longPressTriggered, dragTriggered]);
+    return {
+        onMouseDown: function (e) { return start(e); },
+        onMouseUp: function (e) { return clear(e); },
+        onMouseLeave: function (e) { return clear(e, false); },
+        onTouchStart: function (e) { return start(e); },
+        // setDragTriggered as true on touchmove, so that next onTouchEnd is ignored
+        // if we dont do it, onClick?.(e) will be triggred, see inside clear()
+        onTouchMove: function (e) { return clear(e, false, true); },
+        onTouchEnd: function (e) { return clear(e); },
+    };
+}
+
+export { useLongPress as u };
+//# sourceMappingURL=bundle-v54c93Bz.js.map

package/dist/chunks/bundle-v54c93Bz.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bundle-v54c93Bz.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/bundle-vYoSgX_9.js

@@ -0,0 +1,29 @@
+/**
+ * Dashboard UIKitConfig's replyType is consisted of all lowercases,
+ * we need to convert it into uppercase ones(or vice versa)
+ * when we pass the value to internal components
+ *  - 'thread' <-> 'THREAD'
+ *  - 'quote_reply' <-> 'QUOTE_REPLY'
+ */
+function getCaseResolvedReplyType(replyType) {
+    return {
+        lowerCase: replyType.toLowerCase(),
+        upperCase: replyType.toUpperCase(),
+    };
+}
+/**
+ * Dashboard UIKitConfig's threadReplySelectType is consisted of all lowercase letters,
+ * we need to convert it into uppercase ones(or vice versa)
+ * when we pass the value to internal components
+ *  - 'thread' <-> 'THREAD'
+ *  - 'parent' <-> 'PARENT'
+ */
+function getCaseResolvedThreadReplySelectType(threadReplySelectType) {
+    return {
+        lowerCase: threadReplySelectType.toLowerCase(),
+        upperCase: threadReplySelectType.toUpperCase(),
+    };
+}
+
+export { getCaseResolvedReplyType as a, getCaseResolvedThreadReplySelectType as g };
+//# sourceMappingURL=bundle-vYoSgX_9.js.map

package/dist/chunks/bundle-vYoSgX_9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bundle-vYoSgX_9.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/bundle-w5oQiIVl.js

@@ -0,0 +1,12 @@
+import React__default from 'react';
+import { n as noop } from './bundle-2B6mR7lS.js';
+
+var Context = React__default.createContext({
+    opened: '',
+    setOpened: noop,
+});
+var Consumer = Context.Consumer;
+var Provider = Context.Provider;
+
+export { Consumer as C, Provider as P };
+//# sourceMappingURL=bundle-w5oQiIVl.js.map

package/dist/chunks/bundle-w5oQiIVl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bundle-w5oQiIVl.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}