@multisynq/react/dist/createMultisynqSession.js

React bindings for Multisynq

var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
import { Session } from '@multisynq/client';
import { MultisynqReactView } from './MultisynqReactView';
/** When Multisynq is used in a component that is a part of a bigger application,
 * it is sometimes better to establish the Multisynq session instance outside,
 * and then pass it in to the Multisynq-powered part.

 * ```
 *  const [multisynqSession, setMultisynqSession] = useState(null)
 *  const [multisynqView, setMultisynqView] = useState(null)
 *  const calledOnce = useRef(false)
 *  useEffect(() => {
 *    if (!calledOnce.current) {
 *      calledOnce.current = true
 *      const sessionParams = {
 *        name: projectId,
 *        apiKey: import.meta.env.VITE_MULTISYNQ_API_KEY,
 *        tps: 0.5,
 *        appId: import.meta.env.VITE_MULTISYNQ_APP_ID,
 *        password: 'abc',
 *        model: MyMultisynqModel,
 *        eventRateLimit: import.meta.env.EVENT_RATE_LIMIT || 60,
 *      }
 *      createMultisynqSession(sessionParams as any).then((session) => {
 *        console.log(`session created`)
 *        setMultisynqSession(session)
 *        setMultisynqView(session.view)
 *        setSyncedCallback((flag) => {
 *           console.log(`synced`, flag)
 *           if (flag) {
 *              setMultisynqView((old) => session.view)
 *           }
 *           session.view.detachCallback = (e) => {
 *             console.log(`detached`)
 *             setMultisynqView(null)
 *           }
 *        })
 *      })
 *    }
 *  }, [])
 *  return (
 *    <MultisynqRoot multisynqView={multisynqView}>
 *      <MyMultisynqComponent/>
 *    </MultisynqRoot>
 *   )
```
*/
export function createMultisynqSession(params) {
    return __awaiter(this, void 0, void 0, function* () {
        const sessionParams = Object.assign(Object.assign({}, params), { view: (MultisynqReactView), flags: ['react'] });
        return Session.join(sessionParams);
    });
}