@workday/canvas-kit-docs 15.0.0-alpha.1303-next.0 → 15.0.0

package/dist/mdx/preview-react/segmented-control/examples/Basic.tsx

@@ -1,42 +0,0 @@
-import React from 'react';
-
-import {SegmentedControl} from '@workday/canvas-kit-preview-react/segmented-control';
-import {BodyText} from '@workday/canvas-kit-react/text';
-import {
-  gridIcon,
-  listViewIcon,
-  listDetailIcon,
-  pieChartIcon,
-} from '@workday/canvas-system-icons-web';
-
-export default () => {
-  const [viewType, setViewType] = React.useState('table');
-
-  return (
-    <>
-      <SegmentedControl initialValue={viewType} onSelect={data => setViewType(data.id)}>
-        <SegmentedControl.List aria-label="View type">
-          <SegmentedControl.Item data-id="table" icon={gridIcon} tooltipProps={{title: 'Table'}} />
-          <SegmentedControl.Item
-            data-id="list-view"
-            icon={listViewIcon}
-            tooltipProps={{title: 'List'}}
-          />
-          <SegmentedControl.Item
-            data-id="list-detail"
-            icon={listDetailIcon}
-            tooltipProps={{title: 'Detail'}}
-          />
-          <SegmentedControl.Item
-            data-id="diagrams"
-            icon={pieChartIcon}
-            tooltipProps={{title: 'Diagram'}}
-          />
-        </SegmentedControl.List>
-      </SegmentedControl>
-      <BodyText size="small" marginTop="s">
-        Selected: {viewType}
-      </BodyText>
-    </>
-  );
-};

package/dist/mdx/preview-react/select/Select.mdx

@@ -1,107 +0,0 @@
-import {
-  ExampleCodeBlock,
-  StorybookStatusIndicator,
-  SymbolDoc,
-  Specifications,
-} from '@workday/canvas-kit-docs';
-import {InformationHighlight} from '@workday/canvas-kit-preview-react/information-highlight';
-import Default from './examples/Top Label/Default';
-import DefaultWithCustomOptions from './examples/Top Label/DefaultWithCustomOptions';
-import DefaultWithSimpleOptions from './examples/Top Label/DefaultWithSimpleOptions';
-import Scrollable from './examples/Top Label/Scrollable';
-import Disabled from './examples/Top Label/Disabled';
-import Caution from './examples/Top Label/Caution';
-import Error from './examples/Top Label/Error';
-import Grow from './examples/Top Label/Grow';
-import DefaultLeft from './examples/Left Label/DefaultLeft';
-import DefaultWithCustomOptionsLeft from './examples/Left Label/DefaultWithCustomOptionsLeft';
-import DefaultWithSimpleOptionsLeft from './examples/Left Label/DefaultWithSimpleOptionsLeft';
-import ScrollableLeft from './examples/Left Label/ScrollableLeft';
-import DisabledLeft from './examples/Left Label/DisabledLeft';
-import AlertLeft from './examples/Left Label/AlertLeft';
-import ErrorLeft from './examples/Left Label/ErrorLeft';
-import GrowLeft from './examples/Left Label/GrowLeft';
-
-
-# Canvas Kit Select <StorybookStatusIndicator type="deprecated" />
-
-<InformationHighlight className="sb-unstyled" variant="caution" cs={{p: {marginBlock: 0}}}>
-  <InformationHighlight.Icon />
-  <InformationHighlight.Body>
-    `Select` in Preview has been deprecated and will be removed in a future major version. Please
-    use `Select` in Main instead.
-  </InformationHighlight.Body>
-  <InformationHighlight.Link href="https://workday.github.io/canvas-kit/?path=/docs/components-inputs-select--docs">
-    Select (main) Docs
-  </InformationHighlight.Link>
-</InformationHighlight>
-
-<br />
-
-## Top Label
-
-### Default
-
-<ExampleCodeBlock code={Default} />
-
-### Default with Custom Options Data
-
-<ExampleCodeBlock code={DefaultWithCustomOptions} />
-
-### Default with Simple Options Data
-
-<ExampleCodeBlock code={DefaultWithSimpleOptions} />
-
-### Scrollable
-
-<ExampleCodeBlock code={Scrollable} />
-
-### Disabled
-
-<ExampleCodeBlock code={Disabled} />
-
-### Alert
-
-<ExampleCodeBlock code={Caution} />
-
-### Error
-
-<ExampleCodeBlock code={Error} />
-
-### Grow
-
-<ExampleCodeBlock code={Grow} />
-
-## Left Label
-
-### Default
-
-<ExampleCodeBlock code={DefaultLeft} />
-
-### Default with Custom Options Data
-
-<ExampleCodeBlock code={DefaultWithCustomOptionsLeft} />
-
-### Default with Simple Options Data
-
-<ExampleCodeBlock code={DefaultWithSimpleOptionsLeft} />
-
-### Scrollable
-
-<ExampleCodeBlock code={ScrollableLeft} />
-
-### Disabled
-
-<ExampleCodeBlock code={DisabledLeft} />
-
-### Alert
-
-<ExampleCodeBlock code={CautionLeft} />
-
-### Error
-
-<ExampleCodeBlock code={ErrorLeft} />
-
-### Grow
-
-<ExampleCodeBlock code={GrowLeft} />

package/dist/mdx/preview-react/select/examples/Left Label/AlertLeft.tsx

@@ -1,18 +0,0 @@
-import React from 'react';
-
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {hintText, options} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField orientation="horizontalStart" id="select-alert" error="caution">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(<FormField.Input as={Select} name="contact" options={options} />)}
-        <FormField.Hint>{hintText}</FormField.Hint>
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Left Label/DefaultLeft.tsx

@@ -1,17 +0,0 @@
-import React from 'react';
-
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {options} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField orientation="horizontalStart" id="select-default">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(<FormField.Input as={Select} name="contact" options={options} />)}
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Left Label/DefaultWithCustomOptionsLeft.tsx

@@ -1,25 +0,0 @@
-import React from 'react';
-
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {customOptions, customRenderOption, customRenderSelected} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField orientation="horizontalStart" id="select-default-custom">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(
-          <FormField.Input
-            as={Select}
-            name="icon"
-            options={customOptions}
-            renderOption={customRenderOption}
-            renderSelected={customRenderSelected}
-          />
-        )}
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Left Label/DefaultWithSimpleOptionsLeft.tsx

@@ -1,17 +0,0 @@
-import React from 'react';
-
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {simpleOptions} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField orientation="horizontalStart" id="select-default-simple">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(<FormField.Input as={Select} name="state" options={simpleOptions} />)}
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Left Label/DisabledLeft.tsx

@@ -1,19 +0,0 @@
-import React from 'react';
-
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {options} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField orientation="horizontalStart" id="select-disabled">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(
-          <FormField.Input as={Select} name="contact" options={options} disabled={true} />
-        )}
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Left Label/ErrorLeft.tsx

@@ -1,18 +0,0 @@
-import React from 'react';
-
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {hintText, options} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField orientation="horizontalStart" id="select-error" error="error">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(<FormField.Input as={Select} name="contact" options={options} />)}
-        <FormField.Hint>{hintText}</FormField.Hint>
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Left Label/GrowLeft.tsx

@@ -1,17 +0,0 @@
-import React from 'react';
-
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {options} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField orientation="horizontalStart" id="select-grow" grow={true}>
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(<FormField.Input as={Select} name="contact" options={options} />)}
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Left Label/ScrollableLeft.tsx

@@ -1,17 +0,0 @@
-import React from 'react';
-
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {manyOptions} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField orientation="horizontalStart" id="select-default">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(<FormField.Input as={Select} name="contact" options={manyOptions} />)}
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Left Label/index.ts

@@ -1,8 +0,0 @@
-export {DefaultLeft} from './DefaultLeft';
-export {DefaultWithCustomOptionsLeft} from './DefaultWithCustomOptionsLeft';
-export {DefaultWithSimpleOptionsLeft} from './DefaultWithSimpleOptionsLeft';
-export {ScrollableLeft} from './ScrollableLeft';
-export {DisabledLeft} from './DisabledLeft';
-export {AlertLeft} from './AlertLeft';
-export {ErrorLeft} from './ErrorLeft';
-export {GrowLeft} from './GrowLeft';

package/dist/mdx/preview-react/select/examples/Top Label/Caution.tsx

@@ -1,16 +0,0 @@
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {hintText, options} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField id="select-alert" error="caution">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(<FormField.Input as={Select} name="contact" options={options} />)}
-        <FormField.Hint>{hintText}</FormField.Hint>
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Top Label/Default.tsx

@@ -1,15 +0,0 @@
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {options} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField id="select-default">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(<FormField.Input as={Select} name="contact" options={options} />)}
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Top Label/DefaultWithCustomOptions.tsx

@@ -1,23 +0,0 @@
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {customOptions, customRenderOption, customRenderSelected} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField id="select-default-custom">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(
-          <FormField.Input
-            as={Select}
-            name="icon"
-            options={customOptions}
-            renderOption={customRenderOption}
-            renderSelected={customRenderSelected}
-          />
-        )}
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Top Label/DefaultWithSimpleOptions.tsx

@@ -1,15 +0,0 @@
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {simpleOptions} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField id="select-default-simple">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(<FormField.Input as={Select} name="state" options={simpleOptions} />)}
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Top Label/Disabled.tsx

@@ -1,17 +0,0 @@
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {options} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField id="select-disabled">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(
-          <FormField.Input as={Select} name="contact" options={options} disabled={true} />
-        )}
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Top Label/Error.tsx

@@ -1,16 +0,0 @@
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {hintText, options} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField id="select-error" error="error">
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(<FormField.Input as={Select} name="contact" options={options} />)}
-        <FormField.Hint>{hintText}</FormField.Hint>
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Top Label/Grow.tsx

@@ -1,15 +0,0 @@
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {options} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField id="select-grow" grow={true}>
-      <FormField.Label>Label</FormField.Label>
-      <FormField.Field>
-        {controlComponent(<FormField.Input as={Select} name="contact" options={options} />)}
-      </FormField.Field>
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Top Label/Scrollable.tsx

@@ -1,13 +0,0 @@
-import {FormField} from '@workday/canvas-kit-react/form-field';
-import {Select} from '@workday/canvas-kit-preview-react/select';
-import {manyOptions} from '../storiesData';
-import {controlComponent} from '../../../../../../utils/storybook';
-
-export default () => {
-  return (
-    <FormField id="select-default">
-      <FormField.Label>Label</FormField.Label>
-      {controlComponent(<FormField.Input as={Select} name="contact" options={manyOptions} />)}
-    </FormField>
-  );
-};

package/dist/mdx/preview-react/select/examples/Top Label/index.ts

@@ -1,8 +0,0 @@
-export {Default} from './Default';
-export {DefaultWithCustomOptions} from './DefaultWithCustomOptions';
-export {DefaultWithSimpleOptions} from './DefaultWithSimpleOptions';
-export {Scrollable} from './Scrollable';
-export {Disabled} from './Disabled';
-export {Caution} from './Caution';
-export {Error} from './Error';
-export {Grow} from './Grow';

package/dist/mdx/preview-react/select/examples/storiesData.tsx

@@ -1,92 +0,0 @@
-import {SystemIcon} from '@workday/canvas-kit-react/icon';
-import {
-  activityStreamIcon,
-  avatarIcon,
-  uploadCloudIcon,
-  userIcon,
-} from '@workday/canvas-system-icons-web';
-import {colors, typeColors} from '@workday/canvas-kit-react/tokens';
-import {
-  RenderOptionFunction,
-  RenderSelectedFunction,
-} from '@workday/canvas-kit-preview-react/select';
-
-export default 'Helpful text goes here.';
-export default 'error-desc-id';
-
-export default [
-  {label: 'E-mail', value: 'email-1234'},
-  {label: 'Phone', value: 'phone'},
-  {label: 'Fax (disabled)', value: 'fax', disabled: true},
-  {label: 'Mail', value: 'mail'},
-  {label: 'Mobile Phone', value: 'mobile_phone'},
-  {
-    label: 'The Ontologically Anthropocentric Sensory Immersive Simulation',
-    value: 'oasis',
-  },
-];
-
-export default ['California', 'Florida', 'New York', 'Pennsylvania', 'Texas'];
-
-export default [
-  {label: 'Atlanta (United States)', value: 'atlanta'},
-  {label: 'Amsterdam (Europe)', value: 'amsterdam'},
-  {label: 'Austin (United States)', value: 'austin'},
-  {label: 'Beaverton (United States)', value: 'beaverton'},
-  {label: 'Belfast (Europe)', value: 'belfast'},
-  {label: 'Berlin (Europe)', value: 'berlin'},
-  {label: 'Boston (United States)', value: 'boston'},
-  {label: 'Boulder (United States)', value: 'boulder'},
-  {label: 'Chicago (United States)', value: 'chicago'},
-  {label: 'Dallas (United States)', value: 'dallas'},
-  {label: 'Denver (United States)', value: 'denver'},
-  {label: 'Dublin (Europe)', value: 'dublin'},
-  {label: 'Irvine (United States)', value: 'irvine'},
-  {label: 'Minneapolis (United States)', value: 'minneapolis'},
-  {label: 'New York (United States)', value: 'new-york'},
-  {label: 'Orlando (United States)', value: 'orlando'},
-  {label: 'Palo Alto (United States)', value: 'palo-alto'},
-  {label: 'Philadelphia (United States)', value: 'philadelphia'},
-  {label: 'Pleasanton (United States)', value: 'pleasanton'},
-  {label: 'Raleigh (United States)', value: 'raleigh'},
-  {label: 'San Francisco (United States)', value: 'san-francisco'},
-  {label: 'San Mateo (United States)', value: 'san-mateo'},
-  {label: 'Stockholm (Europe)', value: 'stockholm'},
-  {
-    label: 'The Ontologically Anthropocentric Sensory Immersive Simulation (Virtual Reality)',
-    value: 'oasis',
-  },
-  {label: 'Toronto (Canada)', value: 'toronto'},
-  {label: 'Victoria (Canada)', value: 'victoria'},
-  {label: 'Vienna (Europe)', value: 'vienna'},
-  {label: 'Warsaw (Europe)', value: 'warsaw'},
-  {label: 'Washington, DC (United States)', value: 'washington-dc'},
-  {label: 'Zurich (Europe)', value: 'zurich'},
-];
-
-export default [
-  {value: 'Activity Stream', data: {icon: activityStreamIcon}},
-  {value: 'Avatar', data: {icon: avatarIcon}},
-  {value: 'Upload Cloud', data: {icon: uploadCloudIcon}},
-  {value: 'User', data: {icon: userIcon}},
-];
-
-export const customRenderOption: RenderOptionFunction = option => {
-  const iconColor = option.focused ? typeColors.inverse : colors.blackPepper100;
-  return (
-    <div style={{alignItems: 'center', display: 'flex', padding: '3px 0'}}>
-      <SystemIcon icon={option.data.icon} color={iconColor} colorHover={iconColor} />
-      <div style={{marginLeft: 5}}>{option.value}</div>
-    </div>
-  );
-};
-
-export const customRenderSelected: RenderSelectedFunction = option => {
-  const iconColor = colors.blackPepper100;
-  return (
-    <div style={{alignItems: 'center', display: 'flex'}}>
-      <SystemIcon icon={option.data.icon} color={iconColor} colorHover={iconColor} />
-      <div style={{marginLeft: 5}}>{option.value}</div>
-    </div>
-  );
-};