@procore/labs-unified-viewer

Unified Viewer Introduction

Unified Viewer for Procore

Installation

yarn add @procore/labs-unified-viewer

Dependencies

@procore/core-react and react are listed as external peer dependencies. The package will not bundle the code, and requires the app client to provide it as a dependency. The external peer dep is to assure React Context is consistent in a client's React tree, the child consumers can reference the correct parent provider. If the package uses latest features or bug fixes and a new minimum version of core-react is required, it should be considered a breaking change as the peer dependency version must be met.

Usage

import { UnifiedViewer } from '@procore/labs-unified-viewer'

Translations

Translations are loaded via api through the usage of @procore/labs-i18n-extensions by specifying the name of the translation js file. i.e document_viewer.

To facilitate local development we point the api to load translations from a locally hosted file. This file is auto-generated by the BuildTranslationsPlugin using the json translations found in src/__translations__/.

Building Storybook for local development

For local storybook development, environment keys are necessary to successfully build the Unified Viewer stories. This is because this package utilizes the library @procore/labs-third-party-scripts. Please follow the instructions listed on the Third Party Script library to correctly set up your local environment. Instead of creating a .env file within the third-party-scripts folder, create the .env file within the unified-viewer folder.

After adding the .env file, run the following commands:

yarn install
yarn build:deps
yarn storybook

And you're all set!