@procore/web-sdk-storage

Web Platform Storage

A browser storage solution for Procore front-end applications, providing a standardized interface for interacting with localStorage and sessionStorage.

Installation

Install via yarn:

yarn add @procore/web-sdk-storage

Features

• Type-safe access to localStorage and sessionStorage.
• Accepts react-query-style keys for cleaner storage keys.

Usage

import { storage } from '@procore/web-sdk-storage';

const itemToSave: Item = {
  some: 'data',
};
const itemKey = ['items', { companyId: 1, projectId: 2, itemId: 3 }];

// set item in local storage
storage.local.setItem(itemKey, itemToSave);

// set item on session
storage.session.setItem(itemKey, itemToSave);

const defaultValue = {
  some: 'default',
};

// get item from local storage
const savedItem = storage.local.getItem<Item>(itemKey, defaultValue);

// get item from session storage
const savedItem = storage.session.getItem<Item>(itemKey, defaultValue);

API Reference

Both storage.local and storage.session share the same set of methods for interacting with localStorage and sessionStorage, respectively.

Methods

• setItem(key, value)

  Stores a value under the specified key.

  storage.local.setItem(key, value);
  storage.session.setItem(key, value);

• getItem<T>(key, defaultValue = null)

  Retrieves the value associated with the specified key.

  const value = storage.local.getItem<T>(key, defaultValue);
  const value = storage.session.getItem<T>(key, defaultValue);

• deleteItem(key)

  Removes the item associated with the specified key.

  storage.local.deleteItem(key);
  storage.session.deleteItem(key);

• clear()

  Clears all items from the storage.

  storage.local.clear();
  storage.session.clear();

Parameters

• key: Can be a string or an array (e.g., React Query-style key) that uniquely identifies the storage item.
• value: The data you want to store, which can be any serializable JavaScript object.
• defaultValue: The fallback object to return if the key is not found or has an error. Will default to null.

Support

#team-ui-foundations