@workday/canvas-kit-docs 13.0.0-alpha.1106-next.0 → 13.0.0-alpha.1110-next.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -18,11 +18,11 @@ export const packageJSONFile = `{
18
18
  "@emotion/react": "11.11.4",
19
19
  "@types/react": "18.2.60",
20
20
  "@types/react-dom": "18.2.19",
21
- "@workday/canvas-kit-labs-react": "12.6.7",
22
- "@workday/canvas-kit-preview-react": "12.6.7",
23
- "@workday/canvas-kit-react": "12.6.7",
24
- "@workday/canvas-kit-react-fonts": "^12.6.7",
25
- "@workday/canvas-kit-styling": "12.6.7",
21
+ "@workday/canvas-kit-labs-react": "12.6.8",
22
+ "@workday/canvas-kit-preview-react": "12.6.8",
23
+ "@workday/canvas-kit-react": "12.6.8",
24
+ "@workday/canvas-kit-react-fonts": "^12.6.8",
25
+ "@workday/canvas-kit-styling": "12.6.8",
26
26
  "@workday/canvas-system-icons-web": "3.0.22",
27
27
  "@workday/canvas-tokens-web": "2.0.0"
28
28
  },
@@ -18,11 +18,11 @@ export const packageJSONFile = `{
18
18
  "@emotion/react": "11.11.4",
19
19
  "@types/react": "18.2.60",
20
20
  "@types/react-dom": "18.2.19",
21
- "@workday/canvas-kit-labs-react": "12.6.7",
22
- "@workday/canvas-kit-preview-react": "12.6.7",
23
- "@workday/canvas-kit-react": "12.6.7",
24
- "@workday/canvas-kit-react-fonts": "^12.6.7",
25
- "@workday/canvas-kit-styling": "12.6.7",
21
+ "@workday/canvas-kit-labs-react": "12.6.8",
22
+ "@workday/canvas-kit-preview-react": "12.6.8",
23
+ "@workday/canvas-kit-react": "12.6.8",
24
+ "@workday/canvas-kit-react-fonts": "^12.6.8",
25
+ "@workday/canvas-kit-styling": "12.6.8",
26
26
  "@workday/canvas-system-icons-web": "3.0.22",
27
27
  "@workday/canvas-tokens-web": "2.0.0"
28
28
  },
@@ -17,17 +17,18 @@ any questions.
17
17
  - [Codemod](#codemod)
18
18
  - [Instructions](#instructions)
19
19
  - [Component Updates](#component-updates)
20
- - [Styling API and CSS Tokens](#styling-api-and-css-tokens)
21
- - [Avatar](#avatar)
22
- - [Expandable](#expandable)
23
- - [External Hyperlink](#external-hyperlink)
20
+ - [Styling API and CSS Tokens](#styling-api-and-css-tokens)
21
+ - [Avatar](#avatar)
22
+ - [Expandable](#expandable)
23
+ - [External Hyperlink](#external-hyperlink)
24
24
  - [Form Field and Form Field Group](#form-field-and-form-field-group)
25
- - [Pill](#pill)
26
- - [Tabs](#tabs)
25
+ - [Pill (Preview)](#pill-preview)
26
+ - [SidePanel (Preview)](#sidepanel-preview)
27
+ - [Tabs](#tabs)
27
28
  - [Brand Refresh](#brand-refresh)
28
29
  - [Logo Updates](#logo-updates)
29
30
  - [Infrastructure](#infrastructure)
30
- - [Supporting react-jsx](#supoorting-react-jsx)
31
+ - [Supporting react-jsx](#supporting-react-jsx)
31
32
  - [Troubleshooting](#troubleshooting)
32
33
  - [Glossary](#glossary)
33
34
  - [Main](#main)
@@ -99,7 +100,7 @@ yarn remove @workday/canvas-kit-codemod
99
100
 
100
101
  ### Styling API and CSS Tokens
101
102
 
102
- **PRs:** [#3101](https://github.com/Workday/canvas-kit/pull/3101), [#3088](https://github.com/Workday/canvas-kit/pull/3088), [#3114](https://github.com/Workday/canvas-kit/pull/3114), [#3119](https://github.com/Workday/canvas-kit/pull/3119), [#3120](https://github.com/Workday/canvas-kit/pull/3120), [#3164](https://github.com/Workday/canvas-kit/pull/3164), [#3128](https://github.com/Workday/canvas-kit/pull/3128), [#3123](https://github.com/Workday/canvas-kit/pull/3123), [#3205](https://github.com/Workday/canvas-kit/pull/3205), [#3210](https://github.com/Workday/canvas-kit/pull/3210)
103
+ **PRs:** [#3101](https://github.com/Workday/canvas-kit/pull/3101), [#3088](https://github.com/Workday/canvas-kit/pull/3088), [#3114](https://github.com/Workday/canvas-kit/pull/3114), [#3119](https://github.com/Workday/canvas-kit/pull/3119), [#3120](https://github.com/Workday/canvas-kit/pull/3120), [#3164](https://github.com/Workday/canvas-kit/pull/3164), [#3128](https://github.com/Workday/canvas-kit/pull/3128), [#3123](https://github.com/Workday/canvas-kit/pull/3123), [#3205](https://github.com/Workday/canvas-kit/pull/3205), [#3210](https://github.com/Workday/canvas-kit/pull/3210), [#3240](https://github.com/Workday/canvas-kit/pull/3240)
103
104
 
104
105
  Several components have been refactored to use our
105
106
  [Canvas Tokens](https://workday.github.io/canvas-tokens/?path=/docs/docs-getting-started--docs) and
@@ -119,6 +120,7 @@ The following components are affected:
119
120
  - `LoadingSparkles`
120
121
  - `Menu`
121
122
  - `Pill`
123
+ - `Select`
122
124
  - `SidePanel (Preview)`
123
125
  - `Skeleton`
124
126
  - `Tabs`
@@ -196,14 +198,14 @@ The `orientation` prop on `FormField` component has been updated to remove the d
196
198
  ```
197
199
 
198
200
 
199
- ### Pill
201
+ ### Pill (Preview)
200
202
 
201
203
  **PR:** [#3104](https://github.com/Workday/canvas-kit/pull/3104)
202
204
 
203
205
  A few changes have been made to `Pill` to ensure proper accessibility and styles.
204
206
 
205
207
  - The border color on hover has been updated from `licorice400` to `licorice500` to match our design specs.
206
- - We've removed extra elements and leverage [flex box}(https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/CSS_layout/Flexbox) to ensure only the label receives overflow styles. When `maxWidth` is set, it is set on the parent `<Pill/>` element and the child elements will be styled accordingly. Before v13, `maxWidth` wasn't calculating the width of all its elements and wasn't a true pixel value.
208
+ - We've removed extra elements and leverage [flex box](https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/CSS_layout/Flexbox) to ensure only the label receives overflow styles. When `maxWidth` is set, it is set on the parent `<Pill/>` element and the child elements will be styled accordingly. Before v13, `maxWidth` wasn't calculating the width of all its elements and wasn't a true pixel value.
207
209
 
208
210
  ##### Breaking Changes
209
211
 
@@ -212,6 +214,13 @@ A few changes have been made to `Pill` to ensure proper accessibility and styles
212
214
  - `<Pill.IconButton/>` no longer has a default `aria-label="remove"`. You *must* provide an `aria-label` for `<Pill.IconButton/>` to ensure proper accessibility. Our examples have been updated to reflect this change.
213
215
  - `<Pill.Label/>` is a *required* element when using other sub-components like `<Pill.Icon/>` to ensure that the label truncates correctly.
214
216
 
217
+ ### SidePanel (Preview)
218
+
219
+ **PR:** [3258](https://github.com/Workday/canvas-kit/pull/3258)
220
+
221
+ When we supported IE 11 we needed to use [CSS Animation](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_animations/Using_CSS_animations) to support animation events. Since we dropped support for IE11, we can now use [CSS Transitions](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_transitions/Using_CSS_transitions) to animate the `width` of the `SidePanel` when it's expanding or collapsing.
222
+ As part of this change, we also removed the `onAnimationStart` prop. Since moving to transitions, React doesn't support `onTransitionStart`, therefore the prop is no longer needed.
223
+
215
224
  ### Tabs
216
225
 
217
226
  **PR:** [#3119](https://github.com/Workday/canvas-kit/pull/3119)
@@ -278,7 +287,6 @@ If you're using `react@16.x.x`, you'll need to upgrade to `react@17.x.x` to use
278
287
 
279
288
  >**Note:** You'll need to update the way `jsx` transpiles. The automatic runtime feature, enabled through the `@babel/preset-react` preset with the `runtime: "automatic"` option, handles the importing of functions that JSX transpiles to.
280
289
 
281
- ```sh
282
290
 
283
291
  ## Troubleshooting
284
292
 
@@ -1,11 +1,9 @@
1
- import React from 'react';
2
-
3
1
  import {buttonStencil, PrimaryButton, PrimaryButtonProps} from '@workday/canvas-kit-react/button';
4
2
  import {Grid} from '@workday/canvas-kit-react/layout';
5
3
  import {plusIcon} from '@workday/canvas-system-icons-web';
6
4
  import {createComponent} from '@workday/canvas-kit-react/common';
7
5
  import {systemIconStencil} from '@workday/canvas-kit-react/icon';
8
- import {createStencil, createStyles, handleCsProp, px2rem} from '@workday/canvas-kit-styling';
6
+ import {createStencil, createStyles, px2rem} from '@workday/canvas-kit-styling';
9
7
  import {system} from '@workday/canvas-tokens-web';
10
8
 
11
9
  const customContainer = createStyles({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@workday/canvas-kit-docs",
3
- "version": "13.0.0-alpha.1106-next.0",
3
+ "version": "13.0.0-alpha.1110-next.0",
4
4
  "description": "Documentation components of Canvas Kit components",
5
5
  "author": "Workday, Inc. (https://www.workday.com)",
6
6
  "license": "Apache-2.0",
@@ -45,10 +45,10 @@
45
45
  "@emotion/styled": "^11.6.0",
46
46
  "@stackblitz/sdk": "^1.11.0",
47
47
  "@storybook/csf": "0.0.1",
48
- "@workday/canvas-kit-labs-react": "^13.0.0-alpha.1106-next.0",
49
- "@workday/canvas-kit-preview-react": "^13.0.0-alpha.1106-next.0",
50
- "@workday/canvas-kit-react": "^13.0.0-alpha.1106-next.0",
51
- "@workday/canvas-kit-styling": "^13.0.0-alpha.1106-next.0",
48
+ "@workday/canvas-kit-labs-react": "^13.0.0-alpha.1110-next.0",
49
+ "@workday/canvas-kit-preview-react": "^13.0.0-alpha.1110-next.0",
50
+ "@workday/canvas-kit-react": "^13.0.0-alpha.1110-next.0",
51
+ "@workday/canvas-kit-styling": "^13.0.0-alpha.1110-next.0",
52
52
  "@workday/canvas-system-icons-web": "^3.0.0",
53
53
  "@workday/canvas-tokens-web": "^2.1.1",
54
54
  "markdown-to-jsx": "^7.2.0",
@@ -61,5 +61,5 @@
61
61
  "mkdirp": "^1.0.3",
62
62
  "typescript": "5.0"
63
63
  },
64
- "gitHead": "50e29e2ddae811bbc6f4807dc5dce7af0cb436fc"
64
+ "gitHead": "acdd2495c022e1121cbce90ee654edaf53866fba"
65
65
  }