box-content-ui-kits

Box Content UI Kits

The Box Content UI Kits are currently in beta and may contain bugs. Their interfaces may also update as needed. Please email [e-mail] to report issues or provide feedback.

Installation

yarn add box-content-ui-kits

Usage

You can import the ContentExplorer, ContentPicker or ContentUploader. Likewise you can also import ContentPickerPopup or ContentUploaderPopup which are popup versions for the picker and uploader respectively. Example:

import React from 'react';
import { render } from 'react-dom';
import { ContentExplorer } from 'box-content-ui-kits';
import messages from 'box-content-ui-kits/lib/i18n/en-US';
import 'box-content-ui-kits/dist/explorer.css';

const getLocalizedMessage = (id, replacements) =>
    messages[id].replace(/{\s*(\w+)\s*}/g, (match, key) => replacements[key]);

render(
    <ContentExplorer
        token={token}
        getLocalizedMessage={getLocalizedMessage}
    />,
    document.querySelector('.container')
);

Note: The Box Content UI Kits require their corresponding CSS to render properly. The above example shows importing explorer.css into your app. This will require setting up webpack's style-loader / css-loader plugins to properly process that CSS. Alternatively, you can just include that CSS file in your apps's HTML.

Documentation

Box Content Pickers

Box Content Explorer

Box Content Uploader

Box Content Preview

Support

Need to contact us directly? Email [e-mail] and be sure to include the name of this project in the subject.

Copyright and License

Copyright 2016-2017 Box, Inc. All Rights Reserved.

Licensed under the Box Software License Agreement v.20170516. You may not use this file except in compliance with the License. You may obtain a copy of the License at Box UI Kit Software License Agreement

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.