{"id":21190124,"url":"https://github.com/reactiumcore/reactium-sdk-core","last_synced_at":"2025-07-30T08:10:46.326Z","repository":{"id":40255318,"uuid":"227475087","full_name":"ReactiumCore/reactium-sdk-core","owner":"ReactiumCore","description":"SDK singleton foundation for Reactium","archived":false,"fork":false,"pushed_at":"2024-04-13T03:59:25.000Z","size":2016,"stargazers_count":0,"open_issues_count":4,"forks_count":0,"subscribers_count":3,"default_branch":"main","last_synced_at":"2024-04-13T12:58:54.013Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ReactiumCore.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2019-12-11T22:49:55.000Z","updated_at":"2024-04-15T00:24:44.043Z","dependencies_parsed_at":"2024-04-15T00:24:33.995Z","dependency_job_id":null,"html_url":"https://github.com/ReactiumCore/reactium-sdk-core","commit_stats":null,"previous_names":["reactiumcore/reactium-sdk-core","atomic-reactor/reactium-sdk-core"],"tags_count":39,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReactiumCore%2Freactium-sdk-core","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReactiumCore%2Freactium-sdk-core/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReactiumCore%2Freactium-sdk-core/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ReactiumCore%2Freactium-sdk-core/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ReactiumCore","download_url":"https://codeload.github.com/ReactiumCore/reactium-sdk-core/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243646539,"owners_count":20324583,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-20T18:59:30.582Z","updated_at":"2025-03-14T20:44:20.360Z","avatar_url":"https://github.com/ReactiumCore.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Reactium SDK Core\n\nCore subset of Reactium SDK singleton and named exports.\n\n## Install\n\n```\nnpm install --save @atomic-reactor/reactium-sdk-core\n```\n\n## Usage\n\nNPM Module\n```js\nimport { Zone, useHookComponent } from '@atomic-reactor/reactium-sdk-core';\n```\n\nReactium projects\n```js\n// As above or with some enhhancements patched in from reactium-core workspace:\nimport { Zone, useHookComponent } from '@atomic-reactor/reactium-core/sdk';\n```\n\n## API Description\n\nThis project is best used with [Reactium](https://github.com/Atomic-Reactor/Reactium) but can also be used independently. See the [API documentation](https://reactiumcore.github.io/reactium-sdk-core/).\n\n**Note:** The API documentation link above is written with lots of examples to by used inside a Reactium app projects, but most examples will work if you import from the NPM module directly.\n\n### SDK Objects\n\nThe primary SDK objects in this library are:\n* **Cache**: For controlling runtime object cache in node or browser\n* **Handle**: Registry that manages React handle references\n* **Hook**: Registry for callbacks for async/sync \"hook\" invocations.\n* **Component**: Registry for replaceable React component string tokens.\n* **Pulse**: Registry for running recurring processes over time (like cron for React)\n* **Zone**: Registry for React components to render in \"rendering zones\" (i.e. `\u003cZone /\u003e` component)\n* **Prefs**: Allows you to manipulate local storage from React very quickly and easily.\n\n### React Hooks\n\nThis SDK comes with a number of React hooks:\n* **useHookComponent**: Use a React component registers to Component registry. Allows you to create string token component that can be implemented elsewhere.\n* **useDerivedState**: Tool to managed derived React state from props (if you must).\n* **useEventEffect**: Quickly and easily add and remove event listeners.\n* **useFocusEffect**: Get a true/false state when element is focused.\n* **useAsyncEffect**: Like useEffect, but with built-in protection for setting state async.\n* **useEventRefs**: Like useRefs, but also an EventTarget for event streaming reference changes.\n* **useFocusEffect**: Used to focus a child component on render\n* **useFulfilledObject**: Helps you aggregate async data in React when all conditions are met / ready.\n* **useHandle**: Use a registered imperative React handle by handle id.\n* **useHookComponent**: Used to get re-registered Components and use them in your Component with ease.\n* **useIsContainer**: Determines if the element is a child of the container. Useful for traversing the DOM to find out if an event or action happened within the specified container.\n* **useRefs**: Manage multiple refs easily.\n* **useRegisterHandle**: Register an imperative React handle that can be used anywhere in the app.\n* **useRegisterSyncHandle**: Register an imperative React handle that is also a sync state management object. (See useSyncState)\n* **useScrollToggle**: Facilitates enabling or disabling body scrolling in the browser.\n* **useSelectHandle**: Allows you to \"select\" state from a registered sync handle, and rerender your React component when the selection changes.\n* **useStatus**: Helper hook for walking through enumerated states.\n* **useSyncHandle**: Attach your component to a registered imperative handle.\n* **useSyncState**: A drop in replacement for useState that avoids async state update getting out of sync with your render. Also an EventTarget for event streaming state updates.\n\n\n### Browser / App Utilities\n* **Registry**: A generic subscribable registry class.\n* **registryFactory**: A function that quickly create Registry objects.\n* **cxFactory**: A function that will build a React className namespace, for easily passing a CSS context down through components.\n* **splitParts**: A function that makes it easy to convert a tokenized string into a map of React components.\n* **isWindow**: A function that detects the presence of a global \"window\" object.\n* **isServer**: A function that detects if running on node.js (as opposed to in browser)\n* **isServerWindow**: A functions for determining if the window object is actually on the server (using JSDOM) in Reactium.\n* **isElectronWindow**: A function for determining if the environment is actually Electron (not the web browser)\n\n### React Components\n* **Zone**: A \"rendering zone\" for other components to dynamically render.\n* **HookComponent**: An \"abstract component\" which can be implemented elsewhere.\n\n## ES Module Exports\n\nAs a reference, here is a full list of the library esmodule exports. (Just to make you aware of what is available in your `import` statements)\n\nThe default import includes everything, but you may also import just `core` modules (appropriate for node), or `browser` modules (appropriate for React).\n\n\nFrom `@atomic-reactor/reactium-sdk-core/browser`:\n```js\n[Module: null prototype] {\n  BREAKPOINTS_DEFAULT: { xs: 640, sm: 990, md: 1280, lg: 1440, xl: 1600 },\n  Component: RegisteredComponents [EventTarget] {\n    listeners: {},\n    op: {\n      has: [Function: bound ],\n      ensureExists: [Function: bound ],\n      set: [Function: bound ],\n      insert: [Function: bound ],\n      empty: [Function: bound ],\n      push: [Function: bound ],\n      coalesce: [Function: bound ],\n      get: [Function: bound ],\n      del: [Function: bound del],\n      withInheritedProps: [Function: bound objectPath]\n    },\n    options: { noMerge: true },\n    _addEventListener: [Function: bound addEventListener],\n    addEventListener: [Function (anonymous)],\n    [Symbol(INITIAL_STATE)]: {},\n    [Symbol(STATE)]: { Zone: [Function: Zone] }\n  },\n  ComponentEvent: [class ComponentEvent extends CustomEvent],\n  ComponentTarget: [class ComponentTarget extends EventTarget],\n  Fullscreen: FullscreenClass {\n    initialized: false,\n    update: [Function: update],\n    isExpanded: [Function (anonymous)],\n    isCollapsed: [Function (anonymous)],\n    collapse: [Function (anonymous)],\n    expand: [AsyncFunction (anonymous)],\n    toggle: [Function (anonymous)],\n    element: HTMLHtmlElement {}\n  },\n  FullscreenClass: [class FullscreenClass],\n  Handle: Handle { handles: { BodyScroll: [Object] }, subscriptions: {} },\n  HookComponent: [Function: HookComponent],\n  PassThroughZone: [Function: PassThroughZone],\n  Prefs: PrefsClass {\n    storageKey: 'ar-prefs',\n    clear: [Function (anonymous)],\n    get: [Function (anonymous)],\n    set: [Function (anonymous)]\n  },\n  PrefsClass: [class PrefsClass],\n  ReactiumSyncState: [class ReactiumSyncState extends EventTarget],\n  RegisteredComponents: [class RegisteredComponents extends ReactiumSyncState],\n  SimpleZone: [Function: SimpleZone],\n  SplitParts: [class SplitParts] { splitter: [Function: splitter] },\n  Zone: [Function: Zone],\n  ZoneRegistry: Zones {\n    defaultControls: { components: [], controls: [Object] },\n    [Symbol(INITIALIZED)]: false,\n    [Symbol(ZONES)]: { subscribers: [Object], components: [Object], controls: [Object] },\n    [Symbol(UNSUBSCRIBE)]: [Function (anonymous)]\n  },\n  Zones: [class Zones],\n  __esModule: true,\n  breakpoint: [Function: breakpoint],\n  breakpoints: [Function: breakpoints],\n  conditionalDocument: [Function: conditionalDocument],\n  conditionalWindow: [Function: conditionalWindow],\n  cxFactory: [Function: cxFactory],\n  default: {\n    cxFactory: [Getter],\n    ComponentEvent: [Getter],\n    ComponentTarget: [Getter],\n    FullscreenClass: [Getter],\n    Fullscreen: [Getter],\n    Handle: [Getter],\n    PrefsClass: [Getter],\n    Prefs: [Getter],\n    ReactiumSyncState: [Getter],\n    forwardRefNoop: [Getter],\n    RegisteredComponents: [Getter],\n    Component: [Getter],\n    SplitParts: [Getter],\n    splitParts: [Getter],\n    useAsyncEffect: [Getter],\n    useDerivedState: [Getter],\n    isTarget: [Getter],\n    useEventEffect: [Getter],\n    useFocusEffect: [Getter],\n    useFulfilledObject: [Getter],\n    useHandle: [Getter],\n    useHookComponent: [Getter],\n    useIsContainer: [Getter],\n    useRefs: [Getter],\n    useRegisterHandle: [Getter],\n    useRegisterSyncHandle: [Getter],\n    useScrollToggle: [Getter],\n    useSelectHandle: [Getter],\n    useStatus: [Getter],\n    useSyncHandle: [Getter],\n    useSyncState: [Getter],\n    conditionalWindow: [Getter],\n    conditionalDocument: [Getter],\n    isWindow: [Getter],\n    isElectronWindow: [Getter],\n    isBrowserWindow: [Getter],\n    BREAKPOINTS_DEFAULT: [Getter],\n    breakpoints: [Getter],\n    breakpoint: [Getter],\n    Zone: [Getter],\n    SimpleZone: [Getter],\n    PassThroughZone: [Getter],\n    HookComponent: [Getter],\n    Zones: [Getter],\n    ZoneRegistry: [Getter]\n  },\n  forwardRefNoop: {\n    '$$typeof': Symbol(react.forward_ref),\n    render: [Function (anonymous)]\n  },\n  isBrowserWindow: [Function: isBrowserWindow],\n  isElectronWindow: [Function: isElectronWindow],\n  isTarget: [Function: isTarget],\n  isWindow: [Function: isWindow],\n  splitParts: [Function: splitParts],\n  useAsyncEffect: [Function: useAsyncEffect],\n  useDerivedState: [Function: useDerivedState],\n  useEventEffect: [Function: useEventEffect],\n  useFocusEffect: [Function: useFocusEffect],\n  useFulfilledObject: [Function: useFulfilledObject],\n  useHandle: [Function: useHandle],\n  useHookComponent: [Function: useHookComponent],\n  useIsContainer: [Function: useIsContainer],\n  useRefs: [Function: useRefs],\n  useRegisterHandle: [Function: useRegisterHandle],\n  useRegisterSyncHandle: [Function: useRegisterSyncHandle],\n  useScrollToggle: [Function: useScrollToggle],\n  useSelectHandle: [Function: useSelectHandle],\n  useStatus: [Function: useStatus],\n  useSyncHandle: [Function: useSyncHandle],\n  useSyncState: [Function: useSyncState]\n}\n```\n\nFrom `@atomic-reactor/reactium-sdk-core/core`:\n\n```js\n[Module: null prototype] {\n  Cache: MemoryCache {\n    _subscribers: {},\n    _subscribedPaths: {},\n    set: [Function: put],\n    _mc: Cache {\n      put: [Function (anonymous)],\n      del: [Function (anonymous)],\n      clear: [Function (anonymous)],\n      get: [Function (anonymous)],\n      size: [Function (anonymous)],\n      memsize: [Function (anonymous)],\n      debug: [Function (anonymous)],\n      hits: [Function (anonymous)],\n      misses: [Function (anonymous)],\n      keys: [Function (anonymous)],\n      exportJson: [Function (anonymous)],\n      importJson: [Function (anonymous)]\n    }\n  },\n  Enums: {\n    cache: { settings: 90000 },\n    priority: {\n      '0': 'neutral',\n      '500': 'low',\n      '1000': 'lowest',\n      core: -2000,\n      '-2000': 'core',\n      highest: -1000,\n      '-1000': 'highest',\n      high: -500,\n      '-500': 'high',\n      neutral: 0,\n      low: 500,\n      lowest: 1000\n    }\n  },\n  Hook: HookSDK {\n    action: { sync: [Object], async: {} },\n    actionIds: { '@reactium-file-tag': 'sync.@reactium.@reactium-file-tag' },\n    domains: { '@reactium': [Object] },\n    flush: [Function (anonymous)],\n    unregister: [Function (anonymous)],\n    unregisterDomain: [Function (anonymous)],\n    _register: [Function (anonymous)],\n    list: [Function (anonymous)],\n    _actions: [Function (anonymous)],\n    run: [Function (anonymous)],\n    runSync: [Function (anonymous)]\n  },\n  MemoryCache: [class MemoryCache],\n  NotificationTypes: {\n    REGISTER: 'register',\n    UNREGISTER: 'unregister',\n    PROTECT: 'protect',\n    UNPROTECT: 'unprotect',\n    BAN: 'ban',\n    UNBAN: 'unban',\n    CLEANUP: 'cleanup',\n    FLUSH: 'flush'\n  },\n  Priority: {\n    '0': 'neutral',\n    '500': 'low',\n    '1000': 'lowest',\n    core: -2000,\n    '-2000': 'core',\n    highest: -1000,\n    '-1000': 'highest',\n    high: -500,\n    '-500': 'high',\n    neutral: 0,\n    low: 500,\n    lowest: 1000\n  },\n  Pulse: PulseSDK {\n    Task: null,\n    [Symbol(6a45d4c2-5e9e-4a4b-9eb0-81ca2bf8bb8d)]: {},\n    [Symbol(718e6d8e-4c2c-4124-b754-701aee955261)]: {}\n  },\n  PulseTask: [class PulseTask] {\n    ENUMS: {\n      ERROR: [Object],\n      DEBUG: false,\n      DEFAULT: [Object],\n      STATUS: [Object]\n    }\n  },\n  PulseTaskError: [class PulseTaskError extends Error],\n  Registry: [class Registry] { MODES: { HISTORY: 'HISTORY', CLEAN: 'CLEAN' } },\n  RegistryModes: { HISTORY: 'HISTORY', CLEAN: 'CLEAN' },\n  Server: {\n    Middleware: Registry {\n      __name: 'ExpressMiddleware',\n      __idField: 'name',\n      __registered: [],\n      __protected: {},\n      __unregister: {},\n      __banned: {},\n      __subscribers: {},\n      __mode: 'CLEAN'\n    }\n  },\n  __esModule: true,\n  abbreviatedNumber: [Function: abbreviatedNumber],\n  annotationsFactory: [Function: annotationsFactory],\n  create: [Function: registryFactory],\n  default: {\n    Priority: [Getter],\n    Enums: [Getter],\n    Hook: [Getter],\n    MemoryCache: [Getter],\n    Cache: [Getter],\n    abbreviatedNumber: [Getter],\n    PulseTaskError: [Getter],\n    PulseTask: [Getter],\n    Pulse: [Getter],\n    RegistryModes: [Getter],\n    NotificationTypes: [Getter],\n    Registry: [Getter],\n    registryFactory: [Getter],\n    create: [Getter],\n    Server: [Getter],\n    annotationsFactory: [Getter]\n  },\n  registryFactory: [Function: registryFactory]\n}\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Freactiumcore%2Freactium-sdk-core","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Freactiumcore%2Freactium-sdk-core","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Freactiumcore%2Freactium-sdk-core/lists"}