@channel-state/react/dist/index.cjs.map

React hooks for channel-state, providing seamless integration with React applications for cross-context state management.

{"version":3,"sources":["../src/index.ts"],"names":["useSyncExternalStore"],"mappings":";;;;;AA4CO,SAAS,gBAAmB,KAAA,EAAwB;AACzD,EAAA,MAAM,KAAA,GAAQA,0BAAA;AAAA,IACZ,CAAC,aAAA,KAAkB,KAAA,CAAM,SAAA,CAAU,aAAa,CAAA;AAAA,IAChD,MAAM,MAAM,GAAA,EAAI;AAAA,IAChB,MAAM,MAAM,GAAA;AAAI,GAClB;AAEA,EAAA,MAAM,GAAA,GAAM,CAAC,QAAA,KAAgB;AAC3B,IAAA,KAAA,CAAM,IAAI,QAAQ,CAAA;AAAA,GACpB;AAEA,EAAA,OAAO,CAAC,OAAO,GAAG,CAAA;AACpB;AAoBO,SAAS,iBAAiB,KAAA,EAA8B;AAC7D,EAAA,MAAM,MAAA,GAASA,0BAAA;AAAA,IACb,CAAC,mBAAA,KAAwB,KAAA,CAAM,eAAA,CAAgB,mBAAmB,CAAA;AAAA,IAClE,MAAM,KAAA,CAAM,MAAA;AAAA,IACZ,MAAM,KAAA,CAAM;AAAA,GACd;AAEA,EAAA,OAAO,MAAA;AACT","file":"index.cjs","sourcesContent":["/*\n * Copyright 2025 ronny1020\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/**\n * @module @channel-state/react\n * @description Provides a React hook for integrating with ChannelStore.\n */\nimport { useSyncExternalStore } from 'react'\nimport type { ChannelStore } from '@channel-state/core'\n\n/**\n * A React hook that provides access to a ChannelStore's state and a setter function.\n * It uses `useSyncExternalStore` for efficient and concurrent-safe updates.\n * @template T The type of the state managed by the ChannelStore.\n * @param store The ChannelStore instance to connect to.\n * @returns A tuple containing the current state and a function to update the state.\n * @example\n * ```tsx\n * import { useChannelState } from '@channel-state/react';\n * import { ChannelStore } from '@channel-state/core';\n *\n * const countStore = new ChannelStore<number>({ name: 'count', initial: 0 });\n *\n * function Counter() {\n *   const [count, setCount] = useChannelState(countStore);\n *   return (\n *     <button onClick={() => setCount(count + 1)}>Count: {count}</button>\n *   );\n * }\n * ```\n */\nexport function useChannelState<T>(store: ChannelStore<T>) {\n  const value = useSyncExternalStore(\n    (onStoreChange) => store.subscribe(onStoreChange),\n    () => store.get(),\n    () => store.get(),\n  )\n\n  const set = (newValue: T) => {\n    store.set(newValue)\n  }\n\n  return [value, set] as const\n}\n\n/**\n * A React hook that provides access to a ChannelStore's status.\n * It uses `useSyncExternalStore` for efficient and concurrent-safe updates.\n * @param store The ChannelStore instance to connect to.\n * @returns The current status of the store.\n * @example\n * ```tsx\n * import { useChannelStatus } from '@channel-state/react';\n * import { ChannelStore } from '@channel-state/core';\n *\n * const countStore = new ChannelStore<number>({ name: 'count', initial: 0 });\n *\n * function StatusDisplay() {\n *   const status = useChannelStatus(countStore);\n *   return <p>Status: {status}</p>;\n * }\n * ```\n */\nexport function useChannelStatus(store: ChannelStore<unknown>) {\n  const status = useSyncExternalStore(\n    (onStoreStatusChange) => store.subscribeStatus(onStoreStatusChange),\n    () => store.status,\n    () => store.status,\n  )\n\n  return status\n}\n"]}