Package Exports

@workday/canvas-kit-docs
@workday/canvas-kit-docs/dist/commonjs/index.js
@workday/canvas-kit-docs/dist/es6/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@workday/canvas-kit-docs) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Canvas Kit Documentation Package

A package of documentation components for use in Storybook and the Canvas Kit Documentation site.

Installation

yarn add @workday/canvas-kit-docs

Specifications

Usage

The Specifications component is meant to be used in MDX files by file name and top-level describe name:

import {Specifications} from '@workday/canvas-kit-docs';

<Specifications file="Tooltip.spec.tsx" name="Tooltip">

Component Props

Required

`file: string`

The file path after cypress/integrations in the Canvas Kit repository. Example: 'Tooltip.spec.ts'

Optional

`name: string`

The string contents of the top-level 'describe' block of the specification. Most only have a single describe block. Omitting will grab the first one.

Default: The first defined describe block.

StorybookURL

The StorybookURL is used for the base URL of the storybook. The default is / which works for local Storybook development and Storybook builds. This URL is used for the Story link in the specification table. To render the Specification table outside a Storybook, add a provider context with the value of https://workday.github.io/canvas-kit/

Usage

import {StorybookURL} from '@workday/canvas-kit-docs';

<StorybookURL.Provider value="https://workday.github.io/canvas-kit/">
  <Specifications file="Tooltip.spec.ts" />
</StorybookURL.Provider>

This provider should be defined high up in the React tree and not directly in MDX files.

GithubBranch

The GithubBranch is used for links to source code files in documentation. The default is master which works for mainline development, but could also point to a specific branch or tag.

Usage

import {StorybookURL} from '@workday/canvas-kit-docs';

<GithubBranch.Provider value="v4.5.0">
  <Specifications file="Tooltip.spec.ts" />
</GithubBranch.Provider>;

This provider should be defined high up in the React tree and not directly in MDX files.