@workday/canvas-kit-preview-react 11.0.0-alpha.656-next.0 → 11.0.0-alpha.662-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.
@@ -94,8 +94,8 @@ const loadingSparklesStyles = canvas_kit_styling_1.createStyles({
94
94
  */
95
95
  exports.LoadingSparkles = common_1.createComponent('div')({
96
96
  displayName: 'LoadingSparkles',
97
- Component: (props, ref, Element) => {
98
- return (React.createElement(Element, Object.assign({ ref: ref }, canvas_kit_styling_1.handleCsProp(props, loadingSparklesStyles)),
97
+ Component: (elemProps, ref, Element) => {
98
+ return (React.createElement(Element, Object.assign({ ref: ref, role: "status" }, canvas_kit_styling_1.handleCsProp(elemProps, loadingSparklesStyles)),
99
99
  React.createElement(Sparkle, null),
100
100
  React.createElement(Sparkle, null),
101
101
  React.createElement(Sparkle, null)));
@@ -11,6 +11,6 @@ const common_1 = require("@workday/canvas-kit-react/common");
11
11
  exports.TableHeader = common_1.createComponent('th')({
12
12
  displayName: 'Table.Header',
13
13
  Component: ({ children, ...elemProps }, ref, Element) => {
14
- return (react_1.default.createElement(layout_1.Grid, Object.assign({ as: Element, ref: ref, alignItems: "center", backgroundColor: "frenchVanilla100", borderBottom: `1px solid ${tokens_1.colors.soap400}`, justifyContent: "left", minHeight: "56px", paddingY: "xxs", paddingX: "s", wordBreak: "break-word", fontWeight: "medium" }, elemProps), children));
14
+ return (react_1.default.createElement(layout_1.Grid, Object.assign({ as: Element, ref: ref, alignItems: "center", backgroundColor: "frenchVanilla100", borderBottom: `1px solid ${tokens_1.colors.soap500}`, justifyContent: "left", minHeight: "56px", paddingY: "xxs", paddingX: "s", wordBreak: "break-word", fontWeight: "medium" }, elemProps), children));
15
15
  },
16
16
  });
@@ -1 +1 @@
1
- {"version":3,"file":"TextAreaField.d.ts","sourceRoot":"","sources":["../../../../text-area/lib/TextAreaField.tsx"],"names":[],"mappings":"AA6CA;;GAEG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;EAiCxB,CAAC"}
1
+ {"version":3,"file":"TextAreaField.d.ts","sourceRoot":"","sources":["../../../../text-area/lib/TextAreaField.tsx"],"names":[],"mappings":"AA8CA;;GAEG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;EAiCxB,CAAC"}
@@ -25,7 +25,7 @@ const baseStyles = {
25
25
  },
26
26
  '&:disabled': {
27
27
  backgroundColor: tokens_1.inputColors.disabled.background,
28
- borderColor: tokens_1.inputColors.disabled.border,
28
+ borderColor: tokens_1.colors.licorice100,
29
29
  color: tokens_1.inputColors.disabled.text,
30
30
  '&::placeholder': {
31
31
  color: tokens_1.inputColors.disabled.text,
@@ -1 +1 @@
1
- {"version":3,"file":"TextInputField.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/TextInputField.tsx"],"names":[],"mappings":"AA6CA;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;EAkCzB,CAAC"}
1
+ {"version":3,"file":"TextInputField.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/TextInputField.tsx"],"names":[],"mappings":"AA8CA;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;EAkCzB,CAAC"}
@@ -21,7 +21,7 @@ const baseStyles = {
21
21
  },
22
22
  '&:disabled': {
23
23
  backgroundColor: tokens_1.inputColors.disabled.background,
24
- borderColor: tokens_1.inputColors.disabled.border,
24
+ borderColor: tokens_1.colors.licorice100,
25
25
  color: tokens_1.inputColors.disabled.text,
26
26
  '&::placeholder': {
27
27
  color: tokens_1.inputColors.disabled.text,
@@ -72,8 +72,8 @@ const loadingSparklesStyles = createStyles({
72
72
  */
73
73
  export const LoadingSparkles = createComponent('div')({
74
74
  displayName: 'LoadingSparkles',
75
- Component: (props, ref, Element) => {
76
- return (React.createElement(Element, Object.assign({ ref: ref }, handleCsProp(props, loadingSparklesStyles)),
75
+ Component: (elemProps, ref, Element) => {
76
+ return (React.createElement(Element, Object.assign({ ref: ref, role: "status" }, handleCsProp(elemProps, loadingSparklesStyles)),
77
77
  React.createElement(Sparkle, null),
78
78
  React.createElement(Sparkle, null),
79
79
  React.createElement(Sparkle, null)));
@@ -5,6 +5,6 @@ import { createComponent } from '@workday/canvas-kit-react/common';
5
5
  export const TableHeader = createComponent('th')({
6
6
  displayName: 'Table.Header',
7
7
  Component: ({ children, ...elemProps }, ref, Element) => {
8
- return (React.createElement(Grid, Object.assign({ as: Element, ref: ref, alignItems: "center", backgroundColor: "frenchVanilla100", borderBottom: `1px solid ${colors.soap400}`, justifyContent: "left", minHeight: "56px", paddingY: "xxs", paddingX: "s", wordBreak: "break-word", fontWeight: "medium" }, elemProps), children));
8
+ return (React.createElement(Grid, Object.assign({ as: Element, ref: ref, alignItems: "center", backgroundColor: "frenchVanilla100", borderBottom: `1px solid ${colors.soap500}`, justifyContent: "left", minHeight: "56px", paddingY: "xxs", paddingX: "s", wordBreak: "break-word", fontWeight: "medium" }, elemProps), children));
9
9
  },
10
10
  });
@@ -1 +1 @@
1
- {"version":3,"file":"TextAreaField.d.ts","sourceRoot":"","sources":["../../../../text-area/lib/TextAreaField.tsx"],"names":[],"mappings":"AA6CA;;GAEG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;EAiCxB,CAAC"}
1
+ {"version":3,"file":"TextAreaField.d.ts","sourceRoot":"","sources":["../../../../text-area/lib/TextAreaField.tsx"],"names":[],"mappings":"AA8CA;;GAEG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;EAiCxB,CAAC"}
@@ -1,7 +1,7 @@
1
1
  /** @jsxRuntime classic */
2
2
  /** @jsx jsx */
3
3
  import { jsx } from '@emotion/react';
4
- import { borderRadius, inputColors, space, type, } from '@workday/canvas-kit-react/tokens';
4
+ import { borderRadius, colors, inputColors, space, type, } from '@workday/canvas-kit-react/tokens';
5
5
  import { createSubcomponent, useTheme, useThemedRing, } from '@workday/canvas-kit-react/common';
6
6
  import { FormField } from '@workday/canvas-kit-preview-react/form-field';
7
7
  import { useTextInputModel } from '@workday/canvas-kit-preview-react/text-input';
@@ -22,7 +22,7 @@ const baseStyles = {
22
22
  },
23
23
  '&:disabled': {
24
24
  backgroundColor: inputColors.disabled.background,
25
- borderColor: inputColors.disabled.border,
25
+ borderColor: colors.licorice100,
26
26
  color: inputColors.disabled.text,
27
27
  '&::placeholder': {
28
28
  color: inputColors.disabled.text,
@@ -1 +1 @@
1
- {"version":3,"file":"TextInputField.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/TextInputField.tsx"],"names":[],"mappings":"AA6CA;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;EAkCzB,CAAC"}
1
+ {"version":3,"file":"TextInputField.d.ts","sourceRoot":"","sources":["../../../../text-input/lib/TextInputField.tsx"],"names":[],"mappings":"AA8CA;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;EAkCzB,CAAC"}
@@ -1,7 +1,7 @@
1
1
  /** @jsxRuntime classic */
2
2
  /** @jsx jsx */
3
3
  import { jsx } from '@emotion/react';
4
- import { borderRadius, inputColors, space, type, } from '@workday/canvas-kit-react/tokens';
4
+ import { borderRadius, colors, inputColors, space, type, } from '@workday/canvas-kit-react/tokens';
5
5
  import { createSubcomponent, useTheme, useThemedRing, } from '@workday/canvas-kit-react/common';
6
6
  import { FormField } from '@workday/canvas-kit-preview-react/form-field';
7
7
  import { useTextInputField, useTextInputModel } from './hooks';
@@ -18,7 +18,7 @@ const baseStyles = {
18
18
  },
19
19
  '&:disabled': {
20
20
  backgroundColor: inputColors.disabled.background,
21
- borderColor: inputColors.disabled.border,
21
+ borderColor: colors.licorice100,
22
22
  color: inputColors.disabled.text,
23
23
  '&::placeholder': {
24
24
  color: inputColors.disabled.text,
@@ -86,9 +86,9 @@ const loadingSparklesStyles = createStyles({
86
86
  */
87
87
  export const LoadingSparkles = createComponent('div')({
88
88
  displayName: 'LoadingSparkles',
89
- Component: (props: CSProps, ref, Element) => {
89
+ Component: (elemProps: CSProps, ref, Element) => {
90
90
  return (
91
- <Element ref={ref} {...handleCsProp(props, loadingSparklesStyles)}>
91
+ <Element ref={ref} role="status" {...handleCsProp(elemProps, loadingSparklesStyles)}>
92
92
  <Sparkle />
93
93
  <Sparkle />
94
94
  <Sparkle />
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@workday/canvas-kit-preview-react",
3
- "version": "11.0.0-alpha.656-next.0",
3
+ "version": "11.0.0-alpha.662-next.0",
4
4
  "description": "Canvas Kit Preview is made up of components that have the full design and a11y review, are part of the DS ecosystem and are approved for use in product. The API's could be subject to change, but not without strong communication and migration strategies.",
5
5
  "author": "Workday, Inc. (https://www.workday.com)",
6
6
  "license": "Apache-2.0",
@@ -47,8 +47,8 @@
47
47
  "@emotion/css": "^11.7.1",
48
48
  "@emotion/react": "^11.7.1",
49
49
  "@emotion/styled": "^11.6.0",
50
- "@workday/canvas-kit-react": "^11.0.0-alpha.656-next.0",
51
- "@workday/canvas-kit-styling": "^11.0.0-alpha.656-next.0",
50
+ "@workday/canvas-kit-react": "^11.0.0-alpha.662-next.0",
51
+ "@workday/canvas-kit-styling": "^11.0.0-alpha.662-next.0",
52
52
  "@workday/canvas-system-icons-web": "^3.0.0",
53
53
  "@workday/canvas-tokens-web": "^1.0.2",
54
54
  "@workday/design-assets-types": "^0.2.8"
@@ -59,5 +59,5 @@
59
59
  "react-hook-form": "7.36.1",
60
60
  "yup": "^0.32.11"
61
61
  },
62
- "gitHead": "571f72183c962ed851027dcf5d5a93c4111bde68"
62
+ "gitHead": "ffa75d9e1edd782bf454f8a88dffdc6fca2695fa"
63
63
  }
@@ -12,7 +12,7 @@ export const TableHeader = createComponent('th')({
12
12
  ref={ref}
13
13
  alignItems="center"
14
14
  backgroundColor="frenchVanilla100"
15
- borderBottom={`1px solid ${colors.soap400}`}
15
+ borderBottom={`1px solid ${colors.soap500}`}
16
16
  justifyContent="left"
17
17
  minHeight="56px"
18
18
  paddingY="xxs"
@@ -4,6 +4,7 @@ import {jsx} from '@emotion/react';
4
4
 
5
5
  import {
6
6
  borderRadius,
7
+ colors,
7
8
  CSSProperties,
8
9
  inputColors,
9
10
  space,
@@ -35,7 +36,7 @@ const baseStyles: CSSProperties = {
35
36
  },
36
37
  '&:disabled': {
37
38
  backgroundColor: inputColors.disabled.background,
38
- borderColor: inputColors.disabled.border,
39
+ borderColor: colors.licorice100,
39
40
  color: inputColors.disabled.text,
40
41
  '&::placeholder': {
41
42
  color: inputColors.disabled.text,
@@ -4,6 +4,7 @@ import {jsx} from '@emotion/react';
4
4
 
5
5
  import {
6
6
  borderRadius,
7
+ colors,
7
8
  CSSProperties,
8
9
  inputColors,
9
10
  space,
@@ -32,7 +33,7 @@ const baseStyles: CSSProperties = {
32
33
  },
33
34
  '&:disabled': {
34
35
  backgroundColor: inputColors.disabled.background,
35
- borderColor: inputColors.disabled.border,
36
+ borderColor: colors.licorice100,
36
37
  color: inputColors.disabled.text,
37
38
  '&::placeholder': {
38
39
  color: inputColors.disabled.text,