diff --git a/.storybook/routes.js b/.storybook/routes.js index 6a2515677b..15931c8bc6 100644 --- a/.storybook/routes.js +++ b/.storybook/routes.js @@ -42,20 +42,20 @@ const routes = { '/components/text/text/': 'components-text-text--basic', '/components/text/title/': 'components-text-title--basic', '/examples/layout/': 'examples-layouts--area-column-positioning', - '/getting-started/for-developers/contributing/': 'guides-contributing--page', + '/getting-started/for-developers/contributing/': 'guides-contributing--docs', '/getting-started/for-developers/resources/api-pattern-guidelines/': - 'guides-api-pattern-guidelines--page', + 'guides-api-pattern-guidelines--docs', '/getting-started/for-developers/resources/collection-api/': 'features-collections--basic', '/getting-started/for-developers/resources/compound-components/': - 'guides-compound-components--page', + 'guides-compound-components--docs', '/getting-started/for-developers/resources/creating-compound-components/': - 'guides-creating-compound-components--page', + 'guides-creating-compound-components--docs', '/getting-started/for-developers/resources/responsive-styling/': 'features-responsive-styling--responsive-container', '/getting-started/for-developers/resources/style-props/': 'features-style-props--background-example', - '/getting-started/for-developers/resources/testing/': 'guides-testing--page', - '/getting-started/introduction/': 'guides-getting-started--page', + '/getting-started/for-developers/resources/testing/': 'guides-testing--docs', + '/getting-started/introduction/': 'guides-getting-started--docs', '/tokens/color/': 'tokens--colors', '/tokens/depth/': 'tokens--depth', '/tokens/space/': 'tokens--space', diff --git a/README.md b/README.md index cd4667a161..30ad2a9a58 100644 --- a/README.md +++ b/README.md @@ -61,13 +61,14 @@ The Canvas Kit core team will take a look and discuss it with you. ## Contributing Want to contribute to Canvas Kit React? Please read our -[contributing guidelines](https://workday.github.io/canvas-kit/?path=/docs/guides-contributing--page) to find out more and how to get -started. +[contributing guidelines](https://workday.github.io/canvas-kit/?path=/docs/guides-contributing--docs) +to find out more and how to get started. ## Maintaining If you're a Canvas Kit maintainer, please read our -[maintaining docs](https://workday.github.io/canvas-kit/?path=/docs/guides-maintaining--page) to learn more about our processes. +[maintaining docs](https://workday.github.io/canvas-kit/?path=/docs/guides-maintaining--docs) to +learn more about our processes. ## Open Development @@ -79,7 +80,7 @@ process. Any and all issues are public and available for discussion. Canvas Kit follows [semantic versioning](https://semver.org/) and is enforced automatically by [conventional commits](https://www.conventionalcommits.org/) (see -["Commit Message Format"](https://workday.github.io/canvas-kit/?path=/docs/guides-contributing--page#commit-message-format)). +["Commit Message Format"](https://workday.github.io/canvas-kit/?path=/docs/guides-contributing--docs#commit-message-format)). Each module is independently versioned using [Lerna](https://github.com/lerna/lerna). @@ -102,8 +103,8 @@ recommend against using it in production until the first stable version has been ## Developer Documentation -- [Contributing](https://workday.github.io/canvas-kit/?path=/docs/guides-contributing--page) -- [Code of Conduct](https://workday.github.io/canvas-kit/?path=/docs/guides-contributing--page#code-of-conduct) +- [Contributing](https://workday.github.io/canvas-kit/?path=/docs/guides-contributing--docs) +- [Code of Conduct](https://workday.github.io/canvas-kit/?path=/docs/guides-contributing--docs#code-of-conduct) - Upgrade Guides: - [v4.0 Upgrade Guide](https://workday.github.io/canvas-kit/?path=/docs/guides-upgrade-guides-v4-0--docs) - [v5.0 Upgrade Guide](https://workday.github.io/canvas-kit/?path=/docs/guides-upgrade-guides-v5-0--docs) @@ -115,10 +116,10 @@ recommend against using it in production until the first stable version has been - [v11.0 Upgrade Guide](https://workday.github.io/canvas-kit/?path=/docs/guides-upgrade-guides-v11-0--docs) - [v12.0 Upgrade Guide](https://workday.github.io/canvas-kit/?path=/docs/guides-upgrade-guides-v12-0--docs) - Code Style / Best Practices: - - [API & Pattern Guidelines](https://workday.github.io/canvas-kit/?path=/docs/guides-api-pattern-guidelines--page) - - [Compound Components](https://workday.github.io/canvas-kit/?path=/docs/guides-compound-components--page) - - [Creating Compound Components](https://workday.github.io/canvas-kit/?path=/docs/guides-creating-compound-components--page) - - [Testing](https://workday.github.io/canvas-kit/?path=/docs/guides-testing--page) + - [API & Pattern Guidelines](https://workday.github.io/canvas-kit/?path=/docs/guides-api-pattern-guidelines--docs) + - [Compound Components](https://workday.github.io/canvas-kit/?path=/docs/guides-compound-components--docs) + - [Creating Compound Components](https://workday.github.io/canvas-kit/?path=/docs/guides-creating-compound-components--docs) + - [Testing](https://workday.github.io/canvas-kit/?path=/docs/guides-testing--docs) ## License diff --git a/modules/docs/mdx/10.0-UPGRADE-GUIDE.mdx b/modules/docs/mdx/10.0-UPGRADE-GUIDE.mdx index 508f7de71f..23ce858a99 100644 --- a/modules/docs/mdx/10.0-UPGRADE-GUIDE.mdx +++ b/modules/docs/mdx/10.0-UPGRADE-GUIDE.mdx @@ -50,7 +50,7 @@ If you're using Canvas Kit and not directly using this package, there is nothing end. The Canvas Kit packages are using the static compilation as part of the build process. If you want to use this package for your own styles, you don't need to do anything special to use in development; just reference our -[documentation](https://workday.github.io/canvas-kit/?path=/story/features-styling-welcome--page) on +[documentation](https://workday.github.io/canvas-kit/?path=/docs/styling-getting-started--docs) on how to get started. For more information on why this package was introduced, please reference our diff --git a/modules/docs/mdx/11.0-UPGRADE-GUIDE.mdx b/modules/docs/mdx/11.0-UPGRADE-GUIDE.mdx index b2bfd86cb4..cd21f25bb7 100644 --- a/modules/docs/mdx/11.0-UPGRADE-GUIDE.mdx +++ b/modules/docs/mdx/11.0-UPGRADE-GUIDE.mdx @@ -1,9 +1,9 @@ -import {Meta} from '@storybook/addon-docs'; -import {Table} from '@workday/canvas-kit-react/table'; -import {base, brand, system} from '@workday/canvas-tokens-web'; -import {StatusIndicator} from '@workday/canvas-kit-preview-react/status-indicator'; -import {cssVar} from '@workday/canvas-kit-styling'; -import {Box} from '@workday/canvas-kit-react/layout'; +import { Meta } from '@storybook/addon-docs'; +import { Table } from '@workday/canvas-kit-react/table'; +import { base, brand, system } from '@workday/canvas-tokens-web'; +import { StatusIndicator } from '@workday/canvas-kit-preview-react/status-indicator'; +import { cssVar } from '@workday/canvas-kit-styling'; +import { Box } from '@workday/canvas-kit-react/layout'; @@ -852,7 +852,7 @@ previously in [Main](#main) (for reference, see in [Main](#main) from v9). `Table` is a -[compound component](https://workday.github.io/canvas-kit/?path=/docs/guides-compound-components--page) +[compound component](https://workday.github.io/canvas-kit/?path=/docs/guides-compound-components--docs) which provides a flexible API and access to its internals via its subcomponents. > **Note**: `rowState` prop is no longer a part of the `Table` component. diff --git a/modules/docs/mdx/12.0-UPGRADE-GUIDE.mdx b/modules/docs/mdx/12.0-UPGRADE-GUIDE.mdx index 0df0ec4ecf..a7636de664 100644 --- a/modules/docs/mdx/12.0-UPGRADE-GUIDE.mdx +++ b/modules/docs/mdx/12.0-UPGRADE-GUIDE.mdx @@ -1,9 +1,9 @@ -import {Meta} from '@storybook/addon-docs'; -import {Table} from '@workday/canvas-kit-react/table'; -import {base, brand, system} from '@workday/canvas-tokens-web'; -import {StatusIndicator} from '@workday/canvas-kit-preview-react/status-indicator'; -import {cssVar} from '@workday/canvas-kit-styling'; -import {Box} from '@workday/canvas-kit-react/layout'; +import { Meta } from '@storybook/addon-docs'; +import { Table } from '@workday/canvas-kit-react/table'; +import { base, brand, system } from '@workday/canvas-tokens-web'; +import { StatusIndicator } from '@workday/canvas-kit-preview-react/status-indicator'; +import { cssVar } from '@workday/canvas-kit-styling'; +import { Box } from '@workday/canvas-kit-react/layout'; @@ -363,7 +363,7 @@ made to provide more flexibility and better explicit components when using input ##### Breaking API Change The newly promoted `FormField` is a -[compound component](https://workday.github.io/canvas-kit/?path=/docs/guides-compound-components--page). +[compound component](https://workday.github.io/canvas-kit/?path=/docs/guides-compound-components--docs). Due to the different APIs of the component, this change is **not codemodable**. The following shows an example of how to **update** your code to match the new compound component API. diff --git a/modules/docs/mdx/CONTRIBUTING.mdx b/modules/docs/mdx/CONTRIBUTING.mdx index 789630dabd..611523873d 100644 --- a/modules/docs/mdx/CONTRIBUTING.mdx +++ b/modules/docs/mdx/CONTRIBUTING.mdx @@ -157,7 +157,7 @@ Upon commit, [lint-staged](https://github.com/okonet/lint-staged) will run your ### Releases - Releases are prepared by updating package versions with `lerna version`, and updating the - [changelog](/docs/changelog--page) + [changelog](/docs/changelog--docs) - A PR is created for the above updates - After the release PR is approved and merged, we create a release in GitHub with the contents of the changelog updates. diff --git a/modules/docs/mdx/welcome.mdx b/modules/docs/mdx/welcome.mdx index c5a9fbeb41..05f241bfd3 100644 --- a/modules/docs/mdx/welcome.mdx +++ b/modules/docs/mdx/welcome.mdx @@ -1,4 +1,4 @@ -import Readme from '../../../README.md'; +33import Readme from '../../../README.md'; import Markdown from '../../../utils/storybook/Markdown.tsx'; import {WelcomePage} from './welcomePage'; import {InstallBlock} from './installBlock'; diff --git a/modules/docs/mdx/welcomePage.tsx b/modules/docs/mdx/welcomePage.tsx index 2d65da0faf..a091c2b6ae 100644 --- a/modules/docs/mdx/welcomePage.tsx +++ b/modules/docs/mdx/welcomePage.tsx @@ -73,7 +73,7 @@ export const WelcomePage = () => { as={Hyperlink} alignSelf="end" marginTop="xs" - href="https://workday.github.io/canvas-kit/?path=/docs/guides-getting-started--page" + href="https://workday.github.io/canvas-kit/?path=/docs/guides-getting-started--docs" > {' '} Getting Started Guide diff --git a/modules/preview-react/menu/lib/Menu.tsx b/modules/preview-react/menu/lib/Menu.tsx index 73444c9917..5d31d8bc55 100644 --- a/modules/preview-react/menu/lib/Menu.tsx +++ b/modules/preview-react/menu/lib/Menu.tsx @@ -119,7 +119,7 @@ export class DeprecatedMenu extends React.Component console.warn( `This component is being deprecated and will be removed in a future major version.\n For more information, please see the V8 upgrade guide:\n - https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page + https://workday.github.io/canvas-kit/?path=/docs/guides-upgrade-guides-v8-0--docs#menu-preview ` ); } diff --git a/modules/preview-react/radio/stories/Radio.mdx b/modules/preview-react/radio/stories/Radio.mdx index 09d434147d..c25d4aea7d 100644 --- a/modules/preview-react/radio/stories/Radio.mdx +++ b/modules/preview-react/radio/stories/Radio.mdx @@ -1,16 +1,16 @@ -import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs'; - -import {Basic} from './examples/Basic'; -import {Alert} from './examples/Alert'; -import {Error} from './examples/Error'; -import {Inverse} from './examples/Inverse'; -import {LabelPosition} from './examples/LabelPosition'; -import {NoValue} from './examples/NoValue'; -import {RefForwarding} from './examples/RefForwarding'; -import {Disabled} from './examples/Disabled'; -import {Required} from './examples/Required'; -import {Custom} from './examples/Custom'; -import {StandaloneRadio} from './examples/StandaloneRadio'; +import { ExampleCodeBlock, SymbolDoc } from '@workday/canvas-kit-docs'; + +import { Basic } from './examples/Basic'; +import { Alert } from './examples/Alert'; +import { Error } from './examples/Error'; +import { Inverse } from './examples/Inverse'; +import { LabelPosition } from './examples/LabelPosition'; +import { NoValue } from './examples/NoValue'; +import { RefForwarding } from './examples/RefForwarding'; +import { Disabled } from './examples/Disabled'; +import { Required } from './examples/Required'; +import { Custom } from './examples/Custom'; +import { StandaloneRadio } from './examples/StandaloneRadio'; import * as RadioStories from './Radio.stories'; @@ -142,7 +142,7 @@ how to use `RadioGroup` with React Hook Form. Radio and its subcomponents support custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/preview-react/status-indicator/stories/StatusIndicator.mdx b/modules/preview-react/status-indicator/stories/StatusIndicator.mdx index 35ca7b8307..cc539403df 100644 --- a/modules/preview-react/status-indicator/stories/StatusIndicator.mdx +++ b/modules/preview-react/status-indicator/stories/StatusIndicator.mdx @@ -1,10 +1,10 @@ -import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs'; +import { ExampleCodeBlock, SymbolDoc } from '@workday/canvas-kit-docs'; -import {Basic} from './examples/Basic'; -import {Emphasis} from './examples/Emphasis'; -import {Icon} from './examples/Icon'; -import {Overflow} from './examples/Overflow'; -import {Variants} from './examples/Variants'; +import { Basic } from './examples/Basic'; +import { Emphasis } from './examples/Emphasis'; +import { Icon } from './examples/Icon'; +import { Overflow } from './examples/Overflow'; +import { Variants } from './examples/Variants'; import * as StatusIndicatorStories from './StatusIndicator.stories'; @@ -78,7 +78,7 @@ The background color dictated by the `variant` will be dark or light based on th Status Indicator and its subcomponents support custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/_examples/stories/mdx/CompoundComponent.mdx b/modules/react/_examples/stories/mdx/CompoundComponent.mdx index 97e44620c8..cbd01b8337 100644 --- a/modules/react/_examples/stories/mdx/CompoundComponent.mdx +++ b/modules/react/_examples/stories/mdx/CompoundComponent.mdx @@ -1,6 +1,6 @@ -import {ExampleCodeBlock} from '@workday/canvas-kit-docs'; +import { ExampleCodeBlock } from '@workday/canvas-kit-docs'; -import {Template} from './examples/compoundComponent/CustomCard'; +import { Template } from './examples/compoundComponent/CustomCard'; @@ -12,6 +12,6 @@ Component component utilites are a great way to wrap and extend exisitng Canvas can dramatically simplify state handling and gives you easy access to things like ref forwarding. For more complex examples, -[see the creating-compound-components guide](https://workday.github.io/canvas-kit/?path=/docs/guides-creating-compound-components--page). +[see the creating-compound-components guide](https://workday.github.io/canvas-kit/?path=/docs/guides-creating-compound-components--docs). diff --git a/modules/react/badge/stories/CountBadge.mdx b/modules/react/badge/stories/CountBadge.mdx index 6600d13545..04fe2565e4 100644 --- a/modules/react/badge/stories/CountBadge.mdx +++ b/modules/react/badge/stories/CountBadge.mdx @@ -1,8 +1,8 @@ -import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs'; +import { ExampleCodeBlock, SymbolDoc } from '@workday/canvas-kit-docs'; -import {Basic} from './examples/Basic'; -import {CustomLimit} from './examples/CustomLimit'; -import {NotificationBadge} from './examples/NotificationBadge'; +import { Basic } from './examples/Basic'; +import { CustomLimit } from './examples/CustomLimit'; +import { NotificationBadge } from './examples/NotificationBadge'; import * as CountBadgeStories from './CountBadge.stories'; @@ -63,7 +63,7 @@ of another screen update, then this use of `AriaLiveRegion` is unnecessary and n ### Custom Styles Count Badge supports custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/button/stories/button/Button.mdx b/modules/react/button/stories/button/Button.mdx index 78e6cfff5b..ee00a5b545 100644 --- a/modules/react/button/stories/button/Button.mdx +++ b/modules/react/button/stories/button/Button.mdx @@ -1,19 +1,19 @@ import { - ExampleCodeBlock, - Specifications, - SymbolDoc, - SymbolDescription, + ExampleCodeBlock, + Specifications, + SymbolDoc, + SymbolDescription, } from '@workday/canvas-kit-docs'; -import {Primary} from './examples/Primary'; -import {PrimaryInverse} from './examples/PrimaryInverse'; -import {Secondary} from './examples/Secondary'; -import {SecondaryInverse} from './examples/SecondaryInverse'; -import {Tertiary} from './examples/Tertiary'; -import {TertiaryInverse} from './examples/TertiaryInverse'; -import {Delete} from './examples/Delete'; -import {Grow} from './examples/Grow'; -import {CustomStyles} from './examples/CustomStyles'; +import { Primary } from './examples/Primary'; +import { PrimaryInverse } from './examples/PrimaryInverse'; +import { Secondary } from './examples/Secondary'; +import { SecondaryInverse } from './examples/SecondaryInverse'; +import { Tertiary } from './examples/Tertiary'; +import { TertiaryInverse } from './examples/TertiaryInverse'; +import { Delete } from './examples/Delete'; +import { Grow } from './examples/Grow'; +import { CustomStyles } from './examples/CustomStyles'; import * as ButtonStories from './Button.stories'; @@ -89,7 +89,7 @@ the width of the button to the width of its container. ### Custom Styles All of our buttons support custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page) +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs) or view the example below. diff --git a/modules/react/card/stories/card.mdx b/modules/react/card/stories/card.mdx index 7d9030938d..e56d98e31f 100644 --- a/modules/react/card/stories/card.mdx +++ b/modules/react/card/stories/card.mdx @@ -1,9 +1,9 @@ -import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs'; +import { ExampleCodeBlock, SymbolDoc } from '@workday/canvas-kit-docs'; import * as CardStories from './card.stories'; -import {Basic} from './examples/Basic'; -import {WithCustomStyles} from './examples/CustomStyles'; -import {WithStencils} from './examples/Stencils'; +import { Basic } from './examples/Basic'; +import { WithCustomStyles } from './examples/CustomStyles'; +import { WithStencils } from './examples/Stencils'; @@ -33,7 +33,7 @@ yarn add @workday/canvas-kit-react ### Custom Styles Card and its subcomponents support custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). diff --git a/modules/react/checkbox/stories/Checkbox.mdx b/modules/react/checkbox/stories/Checkbox.mdx index 51e3160f4e..19158f92ef 100644 --- a/modules/react/checkbox/stories/Checkbox.mdx +++ b/modules/react/checkbox/stories/Checkbox.mdx @@ -1,18 +1,18 @@ import { - ExampleCodeBlock, - SymbolDoc, - Specifications, - InformationHighlight, + ExampleCodeBlock, + SymbolDoc, + Specifications, + InformationHighlight, } from '@workday/canvas-kit-docs'; -import {Alert} from './examples/Alert'; -import {Basic} from './examples/Basic'; -import {Inverse} from './examples/Inverse'; -import {Disabled} from './examples/Disabled'; -import {Error} from './examples/Error'; -import {Indeterminate} from './examples/Indeterminate'; -import {LabelPosition} from './examples/LabelPosition'; -import {RefForwarding} from './examples/RefForwarding'; -import {Required} from './examples/Required'; +import { Alert } from './examples/Alert'; +import { Basic } from './examples/Basic'; +import { Inverse } from './examples/Inverse'; +import { Disabled } from './examples/Disabled'; +import { Error } from './examples/Error'; +import { Indeterminate } from './examples/Indeterminate'; +import { LabelPosition } from './examples/LabelPosition'; +import { RefForwarding } from './examples/RefForwarding'; +import { Required } from './examples/Required'; import * as CheckboxStories from './Checkbox.stories'; @@ -107,7 +107,7 @@ or `Checkbox.ErrorType.Error` if Form Field is not being used. ### Custom Styles Checkbox supports custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/combobox/stories/Combobox.mdx b/modules/react/combobox/stories/Combobox.mdx index 53b4030a8d..69b760bd07 100644 --- a/modules/react/combobox/stories/Combobox.mdx +++ b/modules/react/combobox/stories/Combobox.mdx @@ -1,5 +1,5 @@ -import {ExampleCodeBlock, SymbolDoc, Specifications} from '@workday/canvas-kit-docs'; -import {Autocomplete} from './examples/Autocomplete'; +import { ExampleCodeBlock, SymbolDoc, Specifications } from '@workday/canvas-kit-docs'; +import { Autocomplete } from './examples/Autocomplete'; import * as ComboboxStories from './Combobox.stories'; @@ -75,7 +75,7 @@ An Autocomplete is an example of an arbitrary combobox. Combobox and its subcomponents support custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/form-field/stories/FormField.mdx b/modules/react/form-field/stories/FormField.mdx index 38d201cb08..e38ceeb6f3 100644 --- a/modules/react/form-field/stories/FormField.mdx +++ b/modules/react/form-field/stories/FormField.mdx @@ -1,22 +1,22 @@ -import {ExampleCodeBlock, Specifications, SymbolDoc} from '@workday/canvas-kit-docs'; +import { ExampleCodeBlock, Specifications, SymbolDoc } from '@workday/canvas-kit-docs'; import * as FormFieldStories from './FormField.stories'; -import {Basic} from './examples/Basic'; -import {Alert} from './examples/Alert'; -import {Error} from './examples/Error'; -import {Disabled} from './examples/Disabled'; -import {HiddenLabel} from './examples/HiddenLabel'; -import {LabelPositionHorizontalStart} from './examples/LabelPositionHorizontalStart'; -import {LabelPositionHorizontalEnd} from './examples/LabelPositionHorizontalEnd'; -import {RefForwarding} from './examples/RefForwarding'; -import {Required} from './examples/Required'; -import {Custom} from './examples/Custom'; -import {CustomId} from './examples/CustomId'; -import {AllFields} from './examples/AllFields'; -import {Hint} from './examples/Hint'; -import {Grow} from './examples/Grow'; -import {ThemedError} from './examples/ThemedErrors'; -import {GroupedInputs} from './examples/GroupedInputs'; +import { Basic } from './examples/Basic'; +import { Alert } from './examples/Alert'; +import { Error } from './examples/Error'; +import { Disabled } from './examples/Disabled'; +import { HiddenLabel } from './examples/HiddenLabel'; +import { LabelPositionHorizontalStart } from './examples/LabelPositionHorizontalStart'; +import { LabelPositionHorizontalEnd } from './examples/LabelPositionHorizontalEnd'; +import { RefForwarding } from './examples/RefForwarding'; +import { Required } from './examples/Required'; +import { Custom } from './examples/Custom'; +import { CustomId } from './examples/CustomId'; +import { AllFields } from './examples/AllFields'; +import { Hint } from './examples/Hint'; +import { Grow } from './examples/Grow'; +import { ThemedError } from './examples/ThemedErrors'; +import { GroupedInputs } from './examples/GroupedInputs'; @@ -205,7 +205,7 @@ You can theme your error rings by wrapping an input in a `CanvasProvider` and de Form Field and its subcomponents support custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/select/stories/Select.mdx b/modules/react/select/stories/Select.mdx index 74d03923e5..3757f5780f 100644 --- a/modules/react/select/stories/Select.mdx +++ b/modules/react/select/stories/Select.mdx @@ -1,28 +1,28 @@ import { - ExampleCodeBlock, - InformationHighlight, - SymbolDoc, - Specifications, + ExampleCodeBlock, + InformationHighlight, + SymbolDoc, + Specifications, } from '@workday/canvas-kit-docs'; -import {Alert} from './examples/Alert'; -import {Basic} from './examples/Basic'; -import {Complex} from './examples/Complex'; -import {Controlled} from './examples/Controlled'; -import {Disabled} from './examples/Disabled'; -import {DisabledOptions} from './examples/DisabledOption'; -import {Error} from './examples/Error'; -import {Grow} from './examples/Grow'; -import {LabelPosition} from './examples/LabelPosition'; -import {WithIcons} from './examples/WithIcons'; -import {Required} from './examples/Required'; -import {MenuHeight} from './examples/MenuHeight'; -import {HoistedModel} from './examples/HoistedModel'; -import {RefForwarding} from './examples/RefForwarding'; -import {FetchingDynamicItems} from './examples/FetchingDynamicItems'; -import {Placeholder} from './examples/Placeholder'; -import {InitialSelectedItem} from './examples/InitialSelectedItem'; +import { Alert } from './examples/Alert'; +import { Basic } from './examples/Basic'; +import { Complex } from './examples/Complex'; +import { Controlled } from './examples/Controlled'; +import { Disabled } from './examples/Disabled'; +import { DisabledOptions } from './examples/DisabledOption'; +import { Error } from './examples/Error'; +import { Grow } from './examples/Grow'; +import { LabelPosition } from './examples/LabelPosition'; +import { WithIcons } from './examples/WithIcons'; +import { Required } from './examples/Required'; +import { MenuHeight } from './examples/MenuHeight'; +import { HoistedModel } from './examples/HoistedModel'; +import { RefForwarding } from './examples/RefForwarding'; +import { FetchingDynamicItems } from './examples/FetchingDynamicItems'; +import { Placeholder } from './examples/Placeholder'; +import { InitialSelectedItem } from './examples/InitialSelectedItem'; import * as SelectStories from './Select.stories'; -import {Table} from '@workday/canvas-kit-react/table'; +import { Table } from '@workday/canvas-kit-react/table'; @@ -308,7 +308,7 @@ prop as well as the `value` DOM property and will update the model accordingly. Select and its subcomponents support custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/switch/stories/Switch.mdx b/modules/react/switch/stories/Switch.mdx index 32357fbcd4..4ddb12b0da 100644 --- a/modules/react/switch/stories/Switch.mdx +++ b/modules/react/switch/stories/Switch.mdx @@ -1,15 +1,15 @@ import { - ExampleCodeBlock, - SymbolDoc, - Specifications, - InformationHighlight, + ExampleCodeBlock, + SymbolDoc, + Specifications, + InformationHighlight, } from '@workday/canvas-kit-docs'; -import {Alert} from './examples/Alert'; -import {Basic} from './examples/Basic'; -import {Disabled} from './examples/Disabled'; -import {Error} from './examples/Error'; -import {LabelPosition} from './examples/LabelPosition'; -import {RefForwarding} from './examples/RefForwarding'; +import { Alert } from './examples/Alert'; +import { Basic } from './examples/Basic'; +import { Disabled } from './examples/Disabled'; +import { Error } from './examples/Error'; +import { LabelPosition } from './examples/LabelPosition'; +import { RefForwarding } from './examples/RefForwarding'; import * as SwitchStories from './Switch.stories'; @@ -76,7 +76,7 @@ The `error` prop may be applied directly to the Switch with a value of `Switch.E ### Custom Styles Switch supports custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/table/stories/Table.mdx b/modules/react/table/stories/Table.mdx index f62df9b465..2867b5d726 100644 --- a/modules/react/table/stories/Table.mdx +++ b/modules/react/table/stories/Table.mdx @@ -1,8 +1,8 @@ -import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs'; -import {Basic} from './examples/Basic'; -import {BasicWithHeading} from './examples/BasicWithHeading'; -import {FixedColumn} from './examples/FixedColumn'; -import {RightToLeft} from './examples/RightToLeft'; +import { ExampleCodeBlock, SymbolDoc } from '@workday/canvas-kit-docs'; +import { Basic } from './examples/Basic'; +import { BasicWithHeading } from './examples/BasicWithHeading'; +import { FixedColumn } from './examples/FixedColumn'; +import { RightToLeft } from './examples/RightToLeft'; import * as TableStories from './Table.stories'; @@ -65,7 +65,7 @@ You can also find several advanced Table examples in our Storybook Examples sect Table and its subcomponents support custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/text/stories/BodyText.mdx b/modules/react/text/stories/BodyText.mdx index 0578dc01f2..81c3c130f9 100644 --- a/modules/react/text/stories/BodyText.mdx +++ b/modules/react/text/stories/BodyText.mdx @@ -1,5 +1,5 @@ -import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs'; -import {Basic} from './examples/BodyText/Basic'; +import { ExampleCodeBlock, SymbolDoc } from '@workday/canvas-kit-docs'; +import { Basic } from './examples/BodyText/Basic'; import * as BodyTextStories from './BodyText.stories'; @@ -32,7 +32,7 @@ You may override the rendered element using the `as` prop. ### Custom Styles Body Text supports custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/text/stories/Heading.mdx b/modules/react/text/stories/Heading.mdx index 13abe1b6e3..57e18013a4 100644 --- a/modules/react/text/stories/Heading.mdx +++ b/modules/react/text/stories/Heading.mdx @@ -1,6 +1,6 @@ -import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs'; +import { ExampleCodeBlock, SymbolDoc } from '@workday/canvas-kit-docs'; import * as HeadingStories from './Heading.stories'; -import {Basic} from './examples/Heading/Basic'; +import { Basic } from './examples/Heading/Basic'; @@ -32,7 +32,7 @@ according to the [Canvas type hierarchy](/tokens/type/#type-styles). ### Custom Styles Heading supports custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/text/stories/Subtext.mdx b/modules/react/text/stories/Subtext.mdx index 51749cd1ef..330a354d44 100644 --- a/modules/react/text/stories/Subtext.mdx +++ b/modules/react/text/stories/Subtext.mdx @@ -1,5 +1,5 @@ -import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs'; -import {Basic} from './examples/Subtext/Basic'; +import { ExampleCodeBlock, SymbolDoc } from '@workday/canvas-kit-docs'; +import { Basic } from './examples/Subtext/Basic'; import * as SubtextStories from './Subtext.stories'; @@ -32,7 +32,7 @@ You may override the rendered element using the `as` prop. ### Custom Styles Subtext supports custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/text/stories/Text.mdx b/modules/react/text/stories/Text.mdx index 2bc7c1a82b..094147c1c0 100644 --- a/modules/react/text/stories/Text.mdx +++ b/modules/react/text/stories/Text.mdx @@ -1,7 +1,7 @@ -import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs'; -import {Basic} from './examples/Text/Basic'; -import {TypeLevel} from './examples/Text/TypeLevel'; -import {Variant} from './examples/Text/Variant'; +import { ExampleCodeBlock, SymbolDoc } from '@workday/canvas-kit-docs'; +import { Basic } from './examples/Text/Basic'; +import { TypeLevel } from './examples/Text/TypeLevel'; +import { Variant } from './examples/Text/Variant'; import * as TextStories from './Text.stories'; @@ -47,7 +47,7 @@ understanding of the text being rendered. ### Custom Styles Text supports custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/react/text/stories/Title.mdx b/modules/react/text/stories/Title.mdx index 62b1773940..3a50649b4c 100644 --- a/modules/react/text/stories/Title.mdx +++ b/modules/react/text/stories/Title.mdx @@ -1,5 +1,5 @@ -import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs'; -import {Basic} from './examples/Title/Basic'; +import { ExampleCodeBlock, SymbolDoc } from '@workday/canvas-kit-docs'; +import { Basic } from './examples/Title/Basic'; import * as TitleStories from './Title.stories'; @@ -32,7 +32,7 @@ You may override the rendered element using the `as` prop. ### Custom Styles Title supports custom styling via the `cs` prop. For more information, check our -["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page). +["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs). ## Component API diff --git a/modules/styling/README.md b/modules/styling/README.md index ec4a9cd5de..9d89036b5c 100644 --- a/modules/styling/README.md +++ b/modules/styling/README.md @@ -2,4 +2,4 @@ This package contains everything needed to create CSS styling. This styling package contains a runtime for development and a static parsing process for build time. For more information, visit -https://workday.github.io/canvas-kit/?path=/docs/features-styling-welcome--page +https://workday.github.io/canvas-kit/?path=/docs/styling-why-canvas-styling--docs diff --git a/modules/styling/stories/mdx/Overview.mdx b/modules/styling/stories/mdx/Overview.mdx index b4018f2e21..8c7d0a800d 100644 --- a/modules/styling/stories/mdx/Overview.mdx +++ b/modules/styling/stories/mdx/Overview.mdx @@ -18,7 +18,7 @@ end. The Canvas Kit packages are using the static compilation as part of the bui want to use this package for your own styles, you don't need to do anything special to use in development. Included is a small runtime to get styling working. If you wish to statically compile your CSS from your TypeScript files for faster page loading, visit the -[Getting Started](/docs/features-styling-getting-started--page) page. +[Getting Started](/docs/styling-getting-started--docs) page. ## Why?