@cord-sdk/react
Advanced tools
Comparing version 0.0.41 to 0.0.42
@@ -173,3 +173,3 @@ 'use strict'; | ||
navigate, | ||
react_package_version: "0.0.41", | ||
react_package_version: "0.0.42", | ||
thread_options: threadOptions | ||
@@ -342,11 +342,11 @@ ? { | ||
const propsToAttributes$j = components.propsToAttributeConverter(components.componentAttributes.MultipleCursors); | ||
const propsToAttributes$k = components.propsToAttributeConverter(components.componentAttributes.MultipleCursors); | ||
function MultipleCursorsWithForwardedRef(props, forwardedRef) { | ||
const ref = useCustomElementRef({}, forwardedRef); | ||
const location = useCordLocation(); | ||
return (jsxRuntime.jsx("cord-multiple-cursors", { id: props.id, class: props.className, style: props.style, ref: ref, ...propsToAttributes$j({ location, ...props }) })); | ||
return (jsxRuntime.jsx("cord-multiple-cursors", { id: props.id, class: props.className, style: props.style, ref: ref, ...propsToAttributes$k({ location, ...props }) })); | ||
} | ||
const MultipleCursors = React__namespace.forwardRef(MultipleCursorsWithForwardedRef); | ||
const propsToAttributes$i = components.propsToAttributeConverter(components.componentAttributes.PagePresence); | ||
const propsToAttributes$j = components.propsToAttributeConverter(components.componentAttributes.PagePresence); | ||
function PagePresence(props) { | ||
@@ -358,6 +358,6 @@ const { onUpdate } = props; | ||
const location = useCordLocation(); | ||
return (jsxRuntime.jsx("cord-page-presence", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$i({ location, ...props }) })); | ||
return (jsxRuntime.jsx("cord-page-presence", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$j({ location, ...props }) })); | ||
} | ||
const propsToAttributes$h = components.propsToAttributeConverter(components.componentAttributes.PresenceFacepile); | ||
const propsToAttributes$i = components.propsToAttributeConverter(components.componentAttributes.PresenceFacepile); | ||
function PresenceFacepile(props) { | ||
@@ -369,6 +369,6 @@ const { onUpdate } = props; | ||
const location = useCordLocation(); | ||
return (jsxRuntime.jsx("cord-presence-facepile", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$h({ location, ...props }) })); | ||
return (jsxRuntime.jsx("cord-presence-facepile", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$i({ location, ...props }) })); | ||
} | ||
const propsToAttributes$g = components.propsToAttributeConverter(components.componentAttributes.PresenceObserver); | ||
const propsToAttributes$h = components.propsToAttributeConverter(components.componentAttributes.PresenceObserver); | ||
function PresenceObserver(props) { | ||
@@ -380,3 +380,3 @@ const { onChange } = props; | ||
const location = useCordLocation(); | ||
return (jsxRuntime.jsx("cord-presence-observer", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$g({ location, ...props }), children: props.children })); | ||
return (jsxRuntime.jsx("cord-presence-observer", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$h({ location, ...props }), children: props.children })); | ||
} | ||
@@ -403,3 +403,3 @@ | ||
const propsToAttributes$f = components.propsToAttributeConverter(components.componentAttributes.Sidebar); | ||
const propsToAttributes$g = components.propsToAttributeConverter(components.componentAttributes.Sidebar); | ||
function SidebarWithForwardedRef(props, forwardedRef) { | ||
@@ -419,7 +419,7 @@ const { onOpen, onClose, onThreadOpen, onThreadClose } = props; | ||
const location = useCordLocation(); | ||
return (jsxRuntime.jsx("cord-sidebar", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$f({ location, ...props }) })); | ||
return (jsxRuntime.jsx("cord-sidebar", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$g({ location, ...props }) })); | ||
} | ||
const Sidebar = React__namespace.forwardRef(SidebarWithForwardedRef); | ||
const propsToAttributes$e = components.propsToAttributeConverter(components.componentAttributes.SidebarLauncher); | ||
const propsToAttributes$f = components.propsToAttributeConverter(components.componentAttributes.SidebarLauncher); | ||
function SidebarLauncher(props) { | ||
@@ -430,6 +430,6 @@ const { onClick } = props; | ||
}); | ||
return (jsxRuntime.jsx("cord-sidebar-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$e(props) })); | ||
return (jsxRuntime.jsx("cord-sidebar-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$f(props) })); | ||
} | ||
const propsToAttributes$d = components.propsToAttributeConverter(components.componentAttributes.Thread); | ||
const propsToAttributes$e = components.propsToAttributeConverter(components.componentAttributes.Thread); | ||
function Thread(props) { | ||
@@ -466,6 +466,6 @@ const threadEventsListenerSetRef = useCustomEventListeners({ | ||
const location = useCordLocation(); | ||
return (jsxRuntime.jsx("cord-thread", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$d({ location, ...props }), children: props.children })); | ||
return (jsxRuntime.jsx("cord-thread", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$e({ location, ...props }), children: props.children })); | ||
} | ||
const propsToAttributes$c = components.propsToAttributeConverter(components.componentAttributes.ThreadList); | ||
const propsToAttributes$d = components.propsToAttributeConverter(components.componentAttributes.ThreadList); | ||
function ThreadList(props) { | ||
@@ -488,3 +488,3 @@ const setRef = useCustomEventListeners({ | ||
const location = useCordLocation(); | ||
return (jsxRuntime.jsx("cord-thread-list", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$c({ location, ...props }) })); | ||
return (jsxRuntime.jsx("cord-thread-list", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$d({ location, ...props }) })); | ||
} | ||
@@ -570,3 +570,3 @@ | ||
const propsToAttributes$b = components.propsToAttributeConverter(components.componentAttributes.InboxLauncher); | ||
const propsToAttributes$c = components.propsToAttributeConverter(components.componentAttributes.InboxLauncher); | ||
function InboxLauncher(props) { | ||
@@ -577,6 +577,6 @@ const { onClick } = props; | ||
}); | ||
return (jsxRuntime.jsx("cord-inbox-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$b(props) })); | ||
return (jsxRuntime.jsx("cord-inbox-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$c(props) })); | ||
} | ||
const propsToAttributes$a = components.propsToAttributeConverter(components.componentAttributes.Inbox); | ||
const propsToAttributes$b = components.propsToAttributeConverter(components.componentAttributes.Inbox); | ||
function Inbox(props) { | ||
@@ -587,11 +587,11 @@ const { onCloseRequested } = props; | ||
}); | ||
return (jsxRuntime.jsx("cord-inbox", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$a(props) })); | ||
return (jsxRuntime.jsx("cord-inbox", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$b(props) })); | ||
} | ||
const propsToAttributes$9 = components.propsToAttributeConverter(components.componentAttributes.Settings); | ||
const propsToAttributes$a = components.propsToAttributeConverter(components.componentAttributes.Settings); | ||
function Settings(props) { | ||
return (jsxRuntime.jsx("cord-settings", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$9(props) })); | ||
return (jsxRuntime.jsx("cord-settings", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$a(props) })); | ||
} | ||
const propsToAttributes$8 = components.propsToAttributeConverter(components.componentAttributes.FloatingThreads); | ||
const propsToAttributes$9 = components.propsToAttributeConverter(components.componentAttributes.FloatingThreads); | ||
let shouldLogLoadingTime = false; | ||
@@ -619,12 +619,12 @@ try { | ||
}, []); | ||
return (jsxRuntime.jsx("cord-floating-threads", { ref: combinedSetRef, id: props.id, class: props.className, style: props.style, ...propsToAttributes$8(props) })); | ||
return (jsxRuntime.jsx("cord-floating-threads", { ref: combinedSetRef, id: props.id, class: props.className, style: props.style, ...propsToAttributes$9(props) })); | ||
} | ||
const FloatingThreads = React__namespace.forwardRef(FloatingThreadsWithForwardedRef); | ||
const propsToAttributes$7 = components.propsToAttributeConverter(components.componentAttributes.NotificationList); | ||
const propsToAttributes$8 = components.propsToAttributeConverter(components.componentAttributes.NotificationList); | ||
function NotificationList(props) { | ||
return (jsxRuntime.jsx("cord-notification-list", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$7(props) })); | ||
return (jsxRuntime.jsx("cord-notification-list", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$8(props) })); | ||
} | ||
const propsToAttributes$6 = components.propsToAttributeConverter(components.componentAttributes.NotificationListLauncher); | ||
const propsToAttributes$7 = components.propsToAttributeConverter(components.componentAttributes.NotificationListLauncher); | ||
function NotificationListLauncher(props) { | ||
@@ -635,11 +635,11 @@ const { onClick } = props; | ||
}); | ||
return (jsxRuntime.jsx("cord-notification-list-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$6(props) })); | ||
return (jsxRuntime.jsx("cord-notification-list-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$7(props) })); | ||
} | ||
const propsToAttributes$5 = components.propsToAttributeConverter(components.componentAttributes.Avatar); | ||
const propsToAttributes$6 = components.propsToAttributeConverter(components.componentAttributes.Avatar); | ||
function Avatar(props) { | ||
return (jsxRuntime.jsx("cord-avatar", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$5(props) })); | ||
return (jsxRuntime.jsx("cord-avatar", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$6(props) })); | ||
} | ||
const propsToAttributes$4 = components.propsToAttributeConverter(components.componentAttributes.Composer); | ||
const propsToAttributes$5 = components.propsToAttributeConverter(components.componentAttributes.Composer); | ||
function Composer(props) { | ||
@@ -656,10 +656,20 @@ const setRef = useCustomEventListeners({ | ||
const location = useCordLocation(); | ||
return (jsxRuntime.jsx("cord-composer", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$4({ location, ...props }) })); | ||
return (jsxRuntime.jsx("cord-composer", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$5({ location, ...props }) })); | ||
} | ||
const propsToAttributes$3 = components.propsToAttributeConverter(components.componentAttributes.Facepile); | ||
const propsToAttributes$4 = components.propsToAttributeConverter(components.componentAttributes.Facepile); | ||
function Facepile(props) { | ||
return (jsxRuntime.jsx("cord-facepile", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$3(props) })); | ||
return (jsxRuntime.jsx("cord-facepile", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$4(props) })); | ||
} | ||
const propsToAttributes$3 = components.propsToAttributeConverter(components.componentAttributes.AddReaction); | ||
function AddReaction(props) { | ||
return (jsxRuntime.jsx("cord-add-reaction", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$3(props) })); | ||
} | ||
const propsToAttributes$2 = components.propsToAttributeConverter(components.componentAttributes.Message); | ||
function Message(props) { | ||
return (jsxRuntime.jsx("cord-message", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$2(props) })); | ||
} | ||
function useNotificationSummaryInternal(notificationSDK, isCordInternalCall) { | ||
@@ -874,2 +884,35 @@ const [summary, setSummary] = React.useState(null); | ||
/** | ||
* This method allows you to observe summary information about a | ||
* [location](https://docs.cord.com/reference/location), including live updates. | ||
* @example Overview | ||
* ```javascript | ||
* import { thread } from '@cord-sdk/react'; | ||
* const summary = thread.useLocationSummary(location, options); | ||
* ``` | ||
* @example Usage | ||
* ```javascript | ||
* import { thread } from '@cord-sdk/react'; | ||
* const summary = thread.useLocationSummary({page: 'document_details'}, {partialMatch: true}); | ||
* return ( | ||
* <div> | ||
* {!summary && "Loading..."} | ||
* {summary && ( | ||
* <p>Total threads: {summary.total}</p> | ||
* <p>Unread threads: {summary.unread}</p> | ||
* <p>Unread subscribed threads: {summary.unreadSubscribed}</p> | ||
* <p>Resolved threads: {summary.resolved}</p> | ||
* )} | ||
* </div> | ||
* ); | ||
* ``` | ||
* @param location - The [location](https://docs.cord.com/reference/location) to | ||
* fetch summary information for. | ||
* @param options - Miscellaneous options. See below. | ||
* @returns The hook will initially return `undefined` while the data loads from | ||
* our API. Once it has loaded, your component will re-render and the hook will | ||
* return an object containing the fields described under "Available Data" | ||
* above. The component will automatically re-render if any of the data changes, | ||
* i.e., this data is always "live". | ||
*/ | ||
function useLocationSummary(location, options) { | ||
@@ -992,7 +1035,98 @@ const { sdk } = useCordContext$1('thread.useLocationSummary'); | ||
const propsToAttributes$2 = components.propsToAttributeConverter(components.componentAttributes.Message); | ||
function Message(props) { | ||
return (jsxRuntime.jsx("cord-message", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$2(props) })); | ||
function sameIDs(left, right) { | ||
if (Array.isArray(left)) { | ||
if (!Array.isArray(right)) { | ||
return false; | ||
} | ||
if (left.length !== right.length) { | ||
return false; | ||
} | ||
return left.every((value, index) => value === right[index]); | ||
} | ||
if (Array.isArray(right)) { | ||
return false; | ||
} | ||
return left === right; | ||
} | ||
function useUserData(userIDorIDs) { | ||
const { sdk } = useCordContext$1('user.useUserData'); | ||
const userSDK = sdk === null || sdk === void 0 ? void 0 : sdk.user; | ||
const [data, setData] = React.useState(Array.isArray(userIDorIDs) ? {} : undefined); | ||
const [memoizedUserIDorIDs, setMemoizedUserIDorIDs] = React.useState(); | ||
React.useEffect(() => { | ||
setMemoizedUserIDorIDs((previous) => { | ||
if (!previous || !sameIDs(previous, userIDorIDs)) { | ||
return userIDorIDs; | ||
} | ||
return previous; | ||
}); | ||
}, [userIDorIDs]); | ||
React.useEffect(() => { | ||
if (!userSDK || !memoizedUserIDorIDs) { | ||
return; | ||
} | ||
// This very tortured call is to make the typechecker happy. userIDorIDs | ||
// isn't a valid input for either overload of observeUserData, but either of | ||
// its narrower types is. | ||
const ref = Array.isArray(memoizedUserIDorIDs) | ||
? userSDK.observeUserData(memoizedUserIDorIDs, setData) | ||
: userSDK.observeUserData(memoizedUserIDorIDs, setData); | ||
return () => { | ||
userSDK.unobserveUserData(ref); | ||
}; | ||
}, [userSDK, memoizedUserIDorIDs]); | ||
return data; | ||
} | ||
/** | ||
* This method allows you to observe data about the logged-in user, including | ||
* live updates. | ||
* @example Overview | ||
* ```javascript | ||
* import { user } from '@cord-sdk/react'; | ||
* const data = thread.useViewerData(); | ||
* ``` | ||
* @example Usage | ||
* ```javascript | ||
* import { user } from '@cord-sdk/react'; | ||
* const data = thread.useViewerData(); | ||
* return ( | ||
* <div> | ||
* {!data && "Loading..."} | ||
* {data && ( | ||
* <p>User name: {data.name}</p> | ||
* <p>User short name: {data.shortName}</p> | ||
* <p>User profile picture: <img src={data.profilePictureURL} /></p> | ||
* <p>Organization ID: {data.organizationID}</p> | ||
* )} | ||
* </div> | ||
* ); | ||
* ``` | ||
* @returns The hook will initially return `undefined` while the data loads from | ||
* our API. Once it has loaded, your component will re-render and the hook will | ||
* return an object containing the fields described under "Available Data" | ||
* above. The component will automatically re-render if any of the data changes, | ||
* i.e., this data is always "live". | ||
*/ | ||
function useViewerData() { | ||
const { sdk } = useCordContext$1('user.useViewerData'); | ||
const userSDK = sdk === null || sdk === void 0 ? void 0 : sdk.user; | ||
const [data, setData] = React.useState(); | ||
React.useEffect(() => { | ||
if (!userSDK) { | ||
return; | ||
} | ||
const ref = userSDK.observeViewerData(setData); | ||
return () => { | ||
userSDK.unobserveViewerData(ref); | ||
}; | ||
}, [userSDK]); | ||
return data; | ||
} | ||
var user = /*#__PURE__*/Object.freeze({ | ||
__proto__: null, | ||
useUserData: useUserData, | ||
useViewerData: useViewerData | ||
}); | ||
const propsToAttributes$1 = components.propsToAttributeConverter(components.componentAttributes.Pin); | ||
@@ -1038,3 +1172,2 @@ function Pin(props) { | ||
__proto__: null, | ||
Message: Message, | ||
Pin: Pin, | ||
@@ -1059,2 +1192,3 @@ SelectionComments: SelectionComments, | ||
exports.AddReaction = AddReaction; | ||
exports.AnchoredThreads = FloatingThreads; | ||
@@ -1069,2 +1203,3 @@ exports.Avatar = Avatar; | ||
exports.InboxLauncher = InboxLauncher; | ||
exports.Message = Message; | ||
exports.MultipleCursors = MultipleCursors; | ||
@@ -1096,2 +1231,3 @@ exports.NotificationList = NotificationList; | ||
exports.useCordThreadSummary = useThreadSummary; | ||
exports.user = user; | ||
//# sourceMappingURL=index.js.map |
import type { ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type AvatarReactComponentProps = { | ||
export type AvatarReactComponentProps = { | ||
userId: string; | ||
@@ -4,0 +4,0 @@ enableTooltip?: boolean; |
import type { ComposerSize, ComposerWebComponentEvents } from '@cord-sdk/types'; | ||
import type { ReactPropsWithLocation, ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type ComposerReactComponentProps = ReactPropsWithLocation<{ | ||
export type ComposerReactComponentProps = ReactPropsWithLocation<{ | ||
threadId?: string; | ||
@@ -5,0 +5,0 @@ threadName?: string; |
import type { ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type FacepileReactComponentProps = { | ||
export type FacepileReactComponentProps = { | ||
users: string[]; | ||
@@ -4,0 +4,0 @@ enableTooltip?: boolean; |
import * as React from 'react'; | ||
import type { FloatingThreadsWebComponentEvents, HTMLCordFloatingThreadsElement, ScreenshotConfig } from '@cord-sdk/types'; | ||
import type { ReactPropsWithLocation, ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type FloatingThreadsReactComponentProps = ReactPropsWithLocation<{ | ||
export type FloatingThreadsReactComponentProps = ReactPropsWithLocation<{ | ||
showButton?: boolean; | ||
@@ -6,0 +6,0 @@ buttonLabel?: string; |
import type { InboxWebComponentEvents } from '@cord-sdk/types'; | ||
import type { ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type InboxSharedReactComponentProps = { | ||
export type InboxSharedReactComponentProps = { | ||
showSettings?: boolean; | ||
showPlaceholder?: boolean; | ||
}; | ||
export declare type InboxSpecificReactComponentProps = { | ||
export type InboxSpecificReactComponentProps = { | ||
showCloseButton?: boolean; | ||
onCloseRequested?: (...args: InboxWebComponentEvents['closeRequested']) => void; | ||
}; | ||
export declare type InboxReactComponentProps = InboxSharedReactComponentProps & InboxSpecificReactComponentProps; | ||
export type InboxReactComponentProps = InboxSharedReactComponentProps & InboxSpecificReactComponentProps; | ||
export declare function Inbox(props: ReactPropsWithStandardHTMLAttributes<InboxReactComponentProps>): JSX.Element; |
import type { BadgeStyle, InboxLauncherWebComponentEvents } from '@cord-sdk/types'; | ||
import type { ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
import type { InboxSharedReactComponentProps } from './Inbox'; | ||
declare type InboxLauncherSpecificReactComponentProps = { | ||
type InboxLauncherSpecificReactComponentProps = { | ||
label?: string; | ||
@@ -12,4 +12,4 @@ iconUrl?: string; | ||
}; | ||
export declare type InboxLauncherReactComponentProps = InboxLauncherSpecificReactComponentProps & InboxSharedReactComponentProps; | ||
export type InboxLauncherReactComponentProps = InboxLauncherSpecificReactComponentProps & InboxSharedReactComponentProps; | ||
export declare function InboxLauncher(props: ReactPropsWithStandardHTMLAttributes<InboxLauncherReactComponentProps>): JSX.Element; | ||
export {}; |
import type { ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type MessageReactComponentProps = { | ||
export type MessageReactComponentProps = { | ||
threadId: string; | ||
@@ -4,0 +4,0 @@ messageId?: string; |
import * as React from 'react'; | ||
import type { HTMLCordMultipleCursorsElement } from '@cord-sdk/types'; | ||
import type { ReactPropsWithLocation, ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type MultipleCursorsReactComponentProps = ReactPropsWithLocation<unknown>; | ||
export type MultipleCursorsReactComponentProps = ReactPropsWithLocation<unknown>; | ||
export declare function MultipleCursorsWithForwardedRef(props: ReactPropsWithStandardHTMLAttributes<MultipleCursorsReactComponentProps>, forwardedRef: React.ForwardedRef<HTMLCordMultipleCursorsElement | null>): JSX.Element; | ||
@@ -6,0 +6,0 @@ export declare const MultipleCursors: React.ForwardRefExoticComponent<{ |
import type { NotificationListFilter } from '@cord-sdk/types'; | ||
import type { ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type NotificationListReactComponentProps = { | ||
export type NotificationListReactComponentProps = { | ||
maxCount?: number; | ||
@@ -5,0 +5,0 @@ fetchAdditionalCount?: number; |
import type { BadgeStyle, NotificationListLauncherWebComponentEvents } from '@cord-sdk/types'; | ||
import type { ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
import type { NotificationListReactComponentProps } from './NotificationList'; | ||
declare type NotificationListLauncherSpecificReactComponentProps = { | ||
type NotificationListLauncherSpecificReactComponentProps = { | ||
label?: string; | ||
@@ -11,4 +11,4 @@ iconUrl?: string; | ||
}; | ||
export declare type NotificationListLauncherReactComponentProps = NotificationListReactComponentProps & NotificationListLauncherSpecificReactComponentProps; | ||
export type NotificationListLauncherReactComponentProps = NotificationListReactComponentProps & NotificationListLauncherSpecificReactComponentProps; | ||
export declare function NotificationListLauncher(props: ReactPropsWithStandardHTMLAttributes<NotificationListLauncherReactComponentProps>): JSX.Element; | ||
export {}; |
import type { Orientation, PagePresenceWebComponentEvents } from '@cord-sdk/types'; | ||
import type { PresenceReducerOptions, ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type PagePresenceReactComponentProps = PresenceReducerOptions & { | ||
export type PagePresenceReactComponentProps = PresenceReducerOptions & { | ||
durable?: boolean; | ||
@@ -5,0 +5,0 @@ maxUsers?: number; |
import type { PropsWithChildren } from 'react'; | ||
import type { PinWebComponentEvents } from '@cord-sdk/types'; | ||
import type { PropsWithRef, ReactPropsWithLocation, ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type PinReactComponentProps = ReactPropsWithLocation<{ | ||
export type PinReactComponentProps = ReactPropsWithLocation<{ | ||
threadId: string; | ||
@@ -6,0 +6,0 @@ threadName?: string; |
import type { Orientation, PresenceFacepileWebComponentEvents } from '@cord-sdk/types'; | ||
import type { PresenceReducerOptions, ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type PresenceFacepileReactComponentProps = PresenceReducerOptions & { | ||
export type PresenceFacepileReactComponentProps = PresenceReducerOptions & { | ||
maxUsers?: number; | ||
@@ -5,0 +5,0 @@ orientation?: Orientation; |
import type { PresenceObserverWebComponentEvents } from '@cord-sdk/types'; | ||
import type { ReactPropsWithLocation, ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type PresenceObserverReactComponentProps = React.PropsWithChildren<ReactPropsWithLocation<{ | ||
export type PresenceObserverReactComponentProps = React.PropsWithChildren<ReactPropsWithLocation<{ | ||
observeDocument?: boolean; | ||
@@ -5,0 +5,0 @@ durable?: boolean; |
import type { ReactPropsWithLocation, ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type SelectionCommentsReactComponentProps = React.PropsWithChildren<ReactPropsWithLocation<{ | ||
export type SelectionCommentsReactComponentProps = React.PropsWithChildren<ReactPropsWithLocation<{ | ||
buttonLabel?: string; | ||
@@ -4,0 +4,0 @@ iconUrl?: string; |
import type { ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type SettingsReactComponentProps = Record<string, unknown>; | ||
export type SettingsReactComponentProps = Record<string, unknown>; | ||
export declare function Settings(props: ReactPropsWithStandardHTMLAttributes<SettingsReactComponentProps>): JSX.Element; |
import * as React from 'react'; | ||
import type { HTMLCordSidebarElement, ScreenshotConfig, SidebarWebComponentEvents } from '@cord-sdk/types'; | ||
import type { ReactPropsWithLocation } from '../types'; | ||
export declare type SidebarReactComponentProps = ReactPropsWithLocation<{ | ||
export type SidebarReactComponentProps = ReactPropsWithLocation<{ | ||
showCloseButton?: boolean; | ||
@@ -6,0 +6,0 @@ showInbox?: boolean; |
import type { BadgeStyle, SidebarLauncherWebComponentEvents } from '@cord-sdk/types'; | ||
import type { ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type SidebarLauncherReactComponentProps = { | ||
export type SidebarLauncherReactComponentProps = { | ||
disabled?: boolean; | ||
@@ -5,0 +5,0 @@ label?: string | null; |
import type { PropsWithChildren } from 'react'; | ||
import type { ComposerWebComponentEvents, EntityMetadata, ScreenshotConfig, ThreadOptions, ThreadWebComponentEvents } from '@cord-sdk/types'; | ||
import type { PropsWithRef, ReactPropsWithLocation, ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type ThreadReactComponentProps = ReactPropsWithLocation<{ | ||
export type ThreadReactComponentProps = ReactPropsWithLocation<{ | ||
threadId: string; | ||
@@ -6,0 +6,0 @@ threadName?: string; |
import type { ThreadListFilter, ThreadListWebComponentEvents } from '@cord-sdk/types'; | ||
import type { PropsWithRef, ReactPropsWithLocation, ReactPropsWithStandardHTMLAttributes } from '../types'; | ||
export declare type ThreadListMode = 'default' | 'experimentalComments'; | ||
export declare type ThreadListReactComponentProps = ReactPropsWithLocation<{ | ||
export type ThreadListMode = 'default' | 'experimentalComments'; | ||
export type ThreadListReactComponentProps = ReactPropsWithLocation<{ | ||
showScreenshotPreviewInMessage?: boolean; | ||
@@ -6,0 +6,0 @@ highlightOpenFloatingThread?: boolean; |
import * as React from 'react'; | ||
import type { AnnotationMode, BlurDisplayLocation, ICordSDK, Location, NavigateFn, InitErrorCallback, LoadCallback, ScreenshotOptions } from '@cord-sdk/types'; | ||
declare type CordContextValue = { | ||
type CordContextValue = { | ||
sdk: ICordSDK | null; | ||
@@ -13,3 +13,3 @@ location: Location | undefined; | ||
export declare const CordContext: React.Context<CordContextValue>; | ||
declare type Props = { | ||
type Props = { | ||
clientAuthToken: string | undefined | null; | ||
@@ -36,3 +36,3 @@ enableTasks?: boolean; | ||
}; | ||
declare type ThreadOptions = { | ||
type ThreadOptions = { | ||
additionalSubscribersOnCreate: string[]; | ||
@@ -39,0 +39,0 @@ }; |
@@ -1,4 +0,3 @@ | ||
export { MessageReactComponentProps, Message } from './components/Message'; | ||
export { Pin, PinReactComponentProps } from './components/Pin'; | ||
export { SelectionComments, SelectionCommentsReactComponentProps, } from './components/SelectionComments'; | ||
export { ThreadFacepile } from './components/ThreadFacepile'; |
import type { Location, UserPresenceInformation, UserData } from '@cord-sdk/types'; | ||
declare type Options = { | ||
type Options = { | ||
excludeViewer?: boolean; | ||
@@ -4,0 +4,0 @@ onlyPresentUsers?: boolean; |
@@ -1,9 +0,38 @@ | ||
import type { ObserveThreadSummaryOptions, ThreadActivitySummary, ThreadSummary, Location, ObserveThreadDataOptions, ThreadData, ObserveLocationDataOptions, LocationData } from '@cord-sdk/types'; | ||
declare type Options = { | ||
partialMatch?: boolean; | ||
}; | ||
export declare function useLocationSummary(location: Location, options?: Options): ThreadActivitySummary | undefined; | ||
import type { ObserveThreadSummaryOptions, ThreadActivitySummary, ThreadSummary, Location, ObserveThreadDataOptions, ThreadData, ObserveLocationDataOptions, LocationData, ObserveThreadActivitySummaryOptions } from '@cord-sdk/types'; | ||
/** | ||
* This method allows you to observe summary information about a | ||
* [location](https://docs.cord.com/reference/location), including live updates. | ||
* @example Overview | ||
* ```javascript | ||
* import { thread } from '@cord-sdk/react'; | ||
* const summary = thread.useLocationSummary(location, options); | ||
* ``` | ||
* @example Usage | ||
* ```javascript | ||
* import { thread } from '@cord-sdk/react'; | ||
* const summary = thread.useLocationSummary({page: 'document_details'}, {partialMatch: true}); | ||
* return ( | ||
* <div> | ||
* {!summary && "Loading..."} | ||
* {summary && ( | ||
* <p>Total threads: {summary.total}</p> | ||
* <p>Unread threads: {summary.unread}</p> | ||
* <p>Unread subscribed threads: {summary.unreadSubscribed}</p> | ||
* <p>Resolved threads: {summary.resolved}</p> | ||
* )} | ||
* </div> | ||
* ); | ||
* ``` | ||
* @param location - The [location](https://docs.cord.com/reference/location) to | ||
* fetch summary information for. | ||
* @param options - Miscellaneous options. See below. | ||
* @returns The hook will initially return `undefined` while the data loads from | ||
* our API. Once it has loaded, your component will re-render and the hook will | ||
* return an object containing the fields described under "Available Data" | ||
* above. The component will automatically re-render if any of the data changes, | ||
* i.e., this data is always "live". | ||
*/ | ||
export declare function useLocationSummary(location: Location, options?: ObserveThreadActivitySummaryOptions): ThreadActivitySummary | undefined; | ||
export declare function useThreadSummary(id: string, options?: ObserveThreadSummaryOptions): ThreadSummary | null; | ||
export declare function useLocationData(location: Location, options?: ObserveLocationDataOptions): LocationData; | ||
export declare function useThreadData(threadId: string, options?: ObserveThreadDataOptions): ThreadData; | ||
export {}; |
@@ -1,4 +0,4 @@ | ||
export declare type CustomEventsDefinition<T extends Record<string, unknown[]>> = { | ||
export type CustomEventsDefinition<T extends Record<string, unknown[]>> = { | ||
[P in keyof T]: ((...args: T[P]) => unknown) | undefined; | ||
}; | ||
export declare function useCustomEventListeners<T extends Record<string, unknown[]>>(events: CustomEventsDefinition<T>, sourceComponentName?: string): import("react").Dispatch<import("react").SetStateAction<Element | null>>; |
export declare function hasOwnProperty<X extends object, Y extends PropertyKey>(obj: X, prop: Y): obj is X & Record<Y, unknown>; | ||
declare type UnpackedClientAuthTokenPayload = { | ||
type UnpackedClientAuthTokenPayload = { | ||
userID: string | undefined; | ||
@@ -4,0 +4,0 @@ organizationID: string | undefined; |
@@ -22,5 +22,8 @@ export { CordProvider, CordContext } from './contexts/CordContext'; | ||
export { FacepileReactComponentProps, Facepile } from './components/Facepile'; | ||
export { AddReaction, AddReactionReactComponentProps, } from './components/AddReaction'; | ||
export { MessageReactComponentProps, Message } from './components/Message'; | ||
import * as notification from './hooks/notification'; | ||
import * as presence from './hooks/presence'; | ||
import * as thread from './hooks/thread'; | ||
import * as user from './hooks/user'; | ||
import * as experimental from './experimental'; | ||
@@ -31,2 +34,2 @@ import * as beta from './beta'; | ||
export { useLocationSummary as useCordThreadActivitySummary, useThreadSummary as useCordThreadSummary, } from './hooks/thread'; | ||
export { notification, presence, thread, experimental, beta }; | ||
export { notification, presence, thread, user, experimental, beta }; |
@@ -150,3 +150,3 @@ import { jsx } from 'react/jsx-runtime'; | ||
navigate, | ||
react_package_version: "0.0.41", | ||
react_package_version: "0.0.42", | ||
thread_options: threadOptions | ||
@@ -319,11 +319,11 @@ ? { | ||
const propsToAttributes$j = propsToAttributeConverter(componentAttributes.MultipleCursors); | ||
const propsToAttributes$k = propsToAttributeConverter(componentAttributes.MultipleCursors); | ||
function MultipleCursorsWithForwardedRef(props, forwardedRef) { | ||
const ref = useCustomElementRef({}, forwardedRef); | ||
const location = useCordLocation(); | ||
return (jsx("cord-multiple-cursors", { id: props.id, class: props.className, style: props.style, ref: ref, ...propsToAttributes$j({ location, ...props }) })); | ||
return (jsx("cord-multiple-cursors", { id: props.id, class: props.className, style: props.style, ref: ref, ...propsToAttributes$k({ location, ...props }) })); | ||
} | ||
const MultipleCursors = React.forwardRef(MultipleCursorsWithForwardedRef); | ||
const propsToAttributes$i = propsToAttributeConverter(componentAttributes.PagePresence); | ||
const propsToAttributes$j = propsToAttributeConverter(componentAttributes.PagePresence); | ||
function PagePresence(props) { | ||
@@ -335,6 +335,6 @@ const { onUpdate } = props; | ||
const location = useCordLocation(); | ||
return (jsx("cord-page-presence", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$i({ location, ...props }) })); | ||
return (jsx("cord-page-presence", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$j({ location, ...props }) })); | ||
} | ||
const propsToAttributes$h = propsToAttributeConverter(componentAttributes.PresenceFacepile); | ||
const propsToAttributes$i = propsToAttributeConverter(componentAttributes.PresenceFacepile); | ||
function PresenceFacepile(props) { | ||
@@ -346,6 +346,6 @@ const { onUpdate } = props; | ||
const location = useCordLocation(); | ||
return (jsx("cord-presence-facepile", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$h({ location, ...props }) })); | ||
return (jsx("cord-presence-facepile", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$i({ location, ...props }) })); | ||
} | ||
const propsToAttributes$g = propsToAttributeConverter(componentAttributes.PresenceObserver); | ||
const propsToAttributes$h = propsToAttributeConverter(componentAttributes.PresenceObserver); | ||
function PresenceObserver(props) { | ||
@@ -357,3 +357,3 @@ const { onChange } = props; | ||
const location = useCordLocation(); | ||
return (jsx("cord-presence-observer", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$g({ location, ...props }), children: props.children })); | ||
return (jsx("cord-presence-observer", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$h({ location, ...props }), children: props.children })); | ||
} | ||
@@ -380,3 +380,3 @@ | ||
const propsToAttributes$f = propsToAttributeConverter(componentAttributes.Sidebar); | ||
const propsToAttributes$g = propsToAttributeConverter(componentAttributes.Sidebar); | ||
function SidebarWithForwardedRef(props, forwardedRef) { | ||
@@ -396,7 +396,7 @@ const { onOpen, onClose, onThreadOpen, onThreadClose } = props; | ||
const location = useCordLocation(); | ||
return (jsx("cord-sidebar", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$f({ location, ...props }) })); | ||
return (jsx("cord-sidebar", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$g({ location, ...props }) })); | ||
} | ||
const Sidebar = React.forwardRef(SidebarWithForwardedRef); | ||
const propsToAttributes$e = propsToAttributeConverter(componentAttributes.SidebarLauncher); | ||
const propsToAttributes$f = propsToAttributeConverter(componentAttributes.SidebarLauncher); | ||
function SidebarLauncher(props) { | ||
@@ -407,6 +407,6 @@ const { onClick } = props; | ||
}); | ||
return (jsx("cord-sidebar-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$e(props) })); | ||
return (jsx("cord-sidebar-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$f(props) })); | ||
} | ||
const propsToAttributes$d = propsToAttributeConverter(componentAttributes.Thread); | ||
const propsToAttributes$e = propsToAttributeConverter(componentAttributes.Thread); | ||
function Thread(props) { | ||
@@ -443,6 +443,6 @@ const threadEventsListenerSetRef = useCustomEventListeners({ | ||
const location = useCordLocation(); | ||
return (jsx("cord-thread", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$d({ location, ...props }), children: props.children })); | ||
return (jsx("cord-thread", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$e({ location, ...props }), children: props.children })); | ||
} | ||
const propsToAttributes$c = propsToAttributeConverter(componentAttributes.ThreadList); | ||
const propsToAttributes$d = propsToAttributeConverter(componentAttributes.ThreadList); | ||
function ThreadList(props) { | ||
@@ -465,3 +465,3 @@ const setRef = useCustomEventListeners({ | ||
const location = useCordLocation(); | ||
return (jsx("cord-thread-list", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$c({ location, ...props }) })); | ||
return (jsx("cord-thread-list", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$d({ location, ...props }) })); | ||
} | ||
@@ -547,3 +547,3 @@ | ||
const propsToAttributes$b = propsToAttributeConverter(componentAttributes.InboxLauncher); | ||
const propsToAttributes$c = propsToAttributeConverter(componentAttributes.InboxLauncher); | ||
function InboxLauncher(props) { | ||
@@ -554,6 +554,6 @@ const { onClick } = props; | ||
}); | ||
return (jsx("cord-inbox-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$b(props) })); | ||
return (jsx("cord-inbox-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$c(props) })); | ||
} | ||
const propsToAttributes$a = propsToAttributeConverter(componentAttributes.Inbox); | ||
const propsToAttributes$b = propsToAttributeConverter(componentAttributes.Inbox); | ||
function Inbox(props) { | ||
@@ -564,11 +564,11 @@ const { onCloseRequested } = props; | ||
}); | ||
return (jsx("cord-inbox", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$a(props) })); | ||
return (jsx("cord-inbox", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$b(props) })); | ||
} | ||
const propsToAttributes$9 = propsToAttributeConverter(componentAttributes.Settings); | ||
const propsToAttributes$a = propsToAttributeConverter(componentAttributes.Settings); | ||
function Settings(props) { | ||
return (jsx("cord-settings", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$9(props) })); | ||
return (jsx("cord-settings", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$a(props) })); | ||
} | ||
const propsToAttributes$8 = propsToAttributeConverter(componentAttributes.FloatingThreads); | ||
const propsToAttributes$9 = propsToAttributeConverter(componentAttributes.FloatingThreads); | ||
let shouldLogLoadingTime = false; | ||
@@ -596,12 +596,12 @@ try { | ||
}, []); | ||
return (jsx("cord-floating-threads", { ref: combinedSetRef, id: props.id, class: props.className, style: props.style, ...propsToAttributes$8(props) })); | ||
return (jsx("cord-floating-threads", { ref: combinedSetRef, id: props.id, class: props.className, style: props.style, ...propsToAttributes$9(props) })); | ||
} | ||
const FloatingThreads = React.forwardRef(FloatingThreadsWithForwardedRef); | ||
const propsToAttributes$7 = propsToAttributeConverter(componentAttributes.NotificationList); | ||
const propsToAttributes$8 = propsToAttributeConverter(componentAttributes.NotificationList); | ||
function NotificationList(props) { | ||
return (jsx("cord-notification-list", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$7(props) })); | ||
return (jsx("cord-notification-list", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$8(props) })); | ||
} | ||
const propsToAttributes$6 = propsToAttributeConverter(componentAttributes.NotificationListLauncher); | ||
const propsToAttributes$7 = propsToAttributeConverter(componentAttributes.NotificationListLauncher); | ||
function NotificationListLauncher(props) { | ||
@@ -612,11 +612,11 @@ const { onClick } = props; | ||
}); | ||
return (jsx("cord-notification-list-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$6(props) })); | ||
return (jsx("cord-notification-list-launcher", { id: props.id, class: props.className, style: props.style, ref: setRef, ...propsToAttributes$7(props) })); | ||
} | ||
const propsToAttributes$5 = propsToAttributeConverter(componentAttributes.Avatar); | ||
const propsToAttributes$6 = propsToAttributeConverter(componentAttributes.Avatar); | ||
function Avatar(props) { | ||
return (jsx("cord-avatar", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$5(props) })); | ||
return (jsx("cord-avatar", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$6(props) })); | ||
} | ||
const propsToAttributes$4 = propsToAttributeConverter(componentAttributes.Composer); | ||
const propsToAttributes$5 = propsToAttributeConverter(componentAttributes.Composer); | ||
function Composer(props) { | ||
@@ -633,10 +633,20 @@ const setRef = useCustomEventListeners({ | ||
const location = useCordLocation(); | ||
return (jsx("cord-composer", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$4({ location, ...props }) })); | ||
return (jsx("cord-composer", { id: props.id, class: props.className, style: props.style, ref: combinedSetRef, ...propsToAttributes$5({ location, ...props }) })); | ||
} | ||
const propsToAttributes$3 = propsToAttributeConverter(componentAttributes.Facepile); | ||
const propsToAttributes$4 = propsToAttributeConverter(componentAttributes.Facepile); | ||
function Facepile(props) { | ||
return (jsx("cord-facepile", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$3(props) })); | ||
return (jsx("cord-facepile", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$4(props) })); | ||
} | ||
const propsToAttributes$3 = propsToAttributeConverter(componentAttributes.AddReaction); | ||
function AddReaction(props) { | ||
return (jsx("cord-add-reaction", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$3(props) })); | ||
} | ||
const propsToAttributes$2 = propsToAttributeConverter(componentAttributes.Message); | ||
function Message(props) { | ||
return (jsx("cord-message", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$2(props) })); | ||
} | ||
function useNotificationSummaryInternal(notificationSDK, isCordInternalCall) { | ||
@@ -851,2 +861,35 @@ const [summary, setSummary] = useState(null); | ||
/** | ||
* This method allows you to observe summary information about a | ||
* [location](https://docs.cord.com/reference/location), including live updates. | ||
* @example Overview | ||
* ```javascript | ||
* import { thread } from '@cord-sdk/react'; | ||
* const summary = thread.useLocationSummary(location, options); | ||
* ``` | ||
* @example Usage | ||
* ```javascript | ||
* import { thread } from '@cord-sdk/react'; | ||
* const summary = thread.useLocationSummary({page: 'document_details'}, {partialMatch: true}); | ||
* return ( | ||
* <div> | ||
* {!summary && "Loading..."} | ||
* {summary && ( | ||
* <p>Total threads: {summary.total}</p> | ||
* <p>Unread threads: {summary.unread}</p> | ||
* <p>Unread subscribed threads: {summary.unreadSubscribed}</p> | ||
* <p>Resolved threads: {summary.resolved}</p> | ||
* )} | ||
* </div> | ||
* ); | ||
* ``` | ||
* @param location - The [location](https://docs.cord.com/reference/location) to | ||
* fetch summary information for. | ||
* @param options - Miscellaneous options. See below. | ||
* @returns The hook will initially return `undefined` while the data loads from | ||
* our API. Once it has loaded, your component will re-render and the hook will | ||
* return an object containing the fields described under "Available Data" | ||
* above. The component will automatically re-render if any of the data changes, | ||
* i.e., this data is always "live". | ||
*/ | ||
function useLocationSummary(location, options) { | ||
@@ -969,7 +1012,98 @@ const { sdk } = useCordContext$1('thread.useLocationSummary'); | ||
const propsToAttributes$2 = propsToAttributeConverter(componentAttributes.Message); | ||
function Message(props) { | ||
return (jsx("cord-message", { id: props.id, class: props.className, style: props.style, ...propsToAttributes$2(props) })); | ||
function sameIDs(left, right) { | ||
if (Array.isArray(left)) { | ||
if (!Array.isArray(right)) { | ||
return false; | ||
} | ||
if (left.length !== right.length) { | ||
return false; | ||
} | ||
return left.every((value, index) => value === right[index]); | ||
} | ||
if (Array.isArray(right)) { | ||
return false; | ||
} | ||
return left === right; | ||
} | ||
function useUserData(userIDorIDs) { | ||
const { sdk } = useCordContext$1('user.useUserData'); | ||
const userSDK = sdk === null || sdk === void 0 ? void 0 : sdk.user; | ||
const [data, setData] = useState(Array.isArray(userIDorIDs) ? {} : undefined); | ||
const [memoizedUserIDorIDs, setMemoizedUserIDorIDs] = useState(); | ||
useEffect(() => { | ||
setMemoizedUserIDorIDs((previous) => { | ||
if (!previous || !sameIDs(previous, userIDorIDs)) { | ||
return userIDorIDs; | ||
} | ||
return previous; | ||
}); | ||
}, [userIDorIDs]); | ||
useEffect(() => { | ||
if (!userSDK || !memoizedUserIDorIDs) { | ||
return; | ||
} | ||
// This very tortured call is to make the typechecker happy. userIDorIDs | ||
// isn't a valid input for either overload of observeUserData, but either of | ||
// its narrower types is. | ||
const ref = Array.isArray(memoizedUserIDorIDs) | ||
? userSDK.observeUserData(memoizedUserIDorIDs, setData) | ||
: userSDK.observeUserData(memoizedUserIDorIDs, setData); | ||
return () => { | ||
userSDK.unobserveUserData(ref); | ||
}; | ||
}, [userSDK, memoizedUserIDorIDs]); | ||
return data; | ||
} | ||
/** | ||
* This method allows you to observe data about the logged-in user, including | ||
* live updates. | ||
* @example Overview | ||
* ```javascript | ||
* import { user } from '@cord-sdk/react'; | ||
* const data = thread.useViewerData(); | ||
* ``` | ||
* @example Usage | ||
* ```javascript | ||
* import { user } from '@cord-sdk/react'; | ||
* const data = thread.useViewerData(); | ||
* return ( | ||
* <div> | ||
* {!data && "Loading..."} | ||
* {data && ( | ||
* <p>User name: {data.name}</p> | ||
* <p>User short name: {data.shortName}</p> | ||
* <p>User profile picture: <img src={data.profilePictureURL} /></p> | ||
* <p>Organization ID: {data.organizationID}</p> | ||
* )} | ||
* </div> | ||
* ); | ||
* ``` | ||
* @returns The hook will initially return `undefined` while the data loads from | ||
* our API. Once it has loaded, your component will re-render and the hook will | ||
* return an object containing the fields described under "Available Data" | ||
* above. The component will automatically re-render if any of the data changes, | ||
* i.e., this data is always "live". | ||
*/ | ||
function useViewerData() { | ||
const { sdk } = useCordContext$1('user.useViewerData'); | ||
const userSDK = sdk === null || sdk === void 0 ? void 0 : sdk.user; | ||
const [data, setData] = useState(); | ||
useEffect(() => { | ||
if (!userSDK) { | ||
return; | ||
} | ||
const ref = userSDK.observeViewerData(setData); | ||
return () => { | ||
userSDK.unobserveViewerData(ref); | ||
}; | ||
}, [userSDK]); | ||
return data; | ||
} | ||
var user = /*#__PURE__*/Object.freeze({ | ||
__proto__: null, | ||
useUserData: useUserData, | ||
useViewerData: useViewerData | ||
}); | ||
const propsToAttributes$1 = propsToAttributeConverter(componentAttributes.Pin); | ||
@@ -1015,3 +1149,2 @@ function Pin(props) { | ||
__proto__: null, | ||
Message: Message, | ||
Pin: Pin, | ||
@@ -1036,3 +1169,3 @@ SelectionComments: SelectionComments, | ||
export { FloatingThreads as AnchoredThreads, Avatar, Composer, CordContext, CordProvider, Facepile, FloatingThreads, Inbox, InboxLauncher, MultipleCursors, NotificationList, NotificationListLauncher, PagePresence, PresenceFacepile, PresenceObserver, Settings, Sidebar, SidebarLauncher, Thread, ThreadList, beta, experimental, notification, presence, thread, useCordAnnotationCaptureHandler, useCordAnnotationClickHandler, useCordAnnotationRenderer, useCordAnnotationTargetRef, useCordContext, useCordLocation, useSummary as useCordNotificationSummary, useLocationData$1 as useCordPresentUsers, useLocationSummary as useCordThreadActivitySummary, useThreadSummary as useCordThreadSummary }; | ||
export { AddReaction, FloatingThreads as AnchoredThreads, Avatar, Composer, CordContext, CordProvider, Facepile, FloatingThreads, Inbox, InboxLauncher, Message, MultipleCursors, NotificationList, NotificationListLauncher, PagePresence, PresenceFacepile, PresenceObserver, Settings, Sidebar, SidebarLauncher, Thread, ThreadList, beta, experimental, notification, presence, thread, useCordAnnotationCaptureHandler, useCordAnnotationClickHandler, useCordAnnotationRenderer, useCordAnnotationTargetRef, useCordContext, useCordLocation, useSummary as useCordNotificationSummary, useLocationData$1 as useCordPresentUsers, useLocationSummary as useCordThreadActivitySummary, useThreadSummary as useCordThreadSummary, user }; | ||
//# sourceMappingURL=index.js.map |
import type * as React from 'react'; | ||
import type { Location } from '@cord-sdk/types'; | ||
export declare type ReactPropsWithStandardHTMLAttributes<T> = T & { | ||
export type ReactPropsWithStandardHTMLAttributes<T> = T & { | ||
id?: string; | ||
@@ -8,3 +8,3 @@ className?: string; | ||
}; | ||
export declare type ReactPropsWithLocation<T> = T & { | ||
export type ReactPropsWithLocation<T> = T & { | ||
/** | ||
@@ -16,3 +16,3 @@ * @deprecated The context prop has been renamed to location. | ||
}; | ||
export declare type PresenceReducerOptions = ReactPropsWithLocation<{ | ||
export type PresenceReducerOptions = ReactPropsWithLocation<{ | ||
excludeViewer?: boolean; | ||
@@ -26,4 +26,4 @@ onlyPresentUsers?: boolean; | ||
}>; | ||
export declare type PropsWithRef<T> = T & { | ||
export type PropsWithRef<T> = T & { | ||
forwardRef?: React.MutableRefObject<Element | null>; | ||
}; |
{ | ||
"name": "@cord-sdk/react", | ||
"description": "React components for Cord", | ||
"version": "0.0.41", | ||
"version": "0.0.42", | ||
"homepage": "https://docs.cord.com/", | ||
@@ -22,4 +22,4 @@ "license": "MIT", | ||
"dependencies": { | ||
"@cord-sdk/types": "0.0.41", | ||
"@cord-sdk/components": "0.0.41" | ||
"@cord-sdk/types": "0.0.42", | ||
"@cord-sdk/components": "0.0.42" | ||
}, | ||
@@ -30,3 +30,3 @@ "peerDependencies": { | ||
"devDependencies": { | ||
"@cord-sdk/jsx": "0.0.41", | ||
"@cord-sdk/jsx": "0.0.42", | ||
"@types/react": "^17.0.43", | ||
@@ -33,0 +33,0 @@ "rollup": "^2.70.1", |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
136632
49
2858
+ Added@cord-sdk/components@0.0.42(transitive)
+ Added@cord-sdk/types@0.0.42(transitive)
- Removed@cord-sdk/components@0.0.41(transitive)
- Removed@cord-sdk/types@0.0.41(transitive)
Updated@cord-sdk/components@0.0.42
Updated@cord-sdk/types@0.0.42