@workday/canvas-kit-react 7.2.0-next.2 → 7.2.2

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.
Files changed (54) hide show
  1. package/action-bar/package.json +2 -1
  2. package/avatar/package.json +2 -1
  3. package/badge/package.json +2 -1
  4. package/banner/package.json +2 -1
  5. package/button/lib/TertiaryButton.tsx +18 -7
  6. package/button/package.json +2 -1
  7. package/card/package.json +2 -1
  8. package/checkbox/package.json +2 -1
  9. package/collection/package.json +2 -1
  10. package/color-picker/package.json +2 -1
  11. package/common/package.json +2 -1
  12. package/dialog/package.json +2 -1
  13. package/disclosure/package.json +2 -1
  14. package/dist/commonjs/button/lib/TertiaryButton.d.ts +9 -0
  15. package/dist/commonjs/button/lib/TertiaryButton.d.ts.map +1 -1
  16. package/dist/commonjs/button/lib/TertiaryButton.js +9 -8
  17. package/dist/commonjs/pagination/lib/Pagination/common/useLiveRegion.d.ts +0 -1
  18. package/dist/commonjs/pagination/lib/Pagination/common/useLiveRegion.d.ts.map +1 -1
  19. package/dist/commonjs/pagination/lib/Pagination/common/useLiveRegion.js +1 -1
  20. package/dist/commonjs/popup/lib/PopupPopper.d.ts +2 -3
  21. package/dist/commonjs/popup/lib/PopupPopper.d.ts.map +1 -1
  22. package/dist/es6/button/lib/TertiaryButton.d.ts +9 -0
  23. package/dist/es6/button/lib/TertiaryButton.d.ts.map +1 -1
  24. package/dist/es6/button/lib/TertiaryButton.js +9 -8
  25. package/dist/es6/pagination/lib/Pagination/common/useLiveRegion.d.ts +0 -1
  26. package/dist/es6/pagination/lib/Pagination/common/useLiveRegion.d.ts.map +1 -1
  27. package/dist/es6/pagination/lib/Pagination/common/useLiveRegion.js +1 -1
  28. package/dist/es6/popup/lib/PopupPopper.d.ts +2 -3
  29. package/dist/es6/popup/lib/PopupPopper.d.ts.map +1 -1
  30. package/form-field/package.json +2 -1
  31. package/icon/package.json +2 -1
  32. package/layout/package.json +2 -1
  33. package/loading-animation/package.json +2 -1
  34. package/menu/package.json +2 -1
  35. package/modal/package.json +2 -1
  36. package/package.json +5 -5
  37. package/pagination/lib/Pagination/common/useLiveRegion.tsx +0 -2
  38. package/pagination/package.json +2 -1
  39. package/popup/lib/PopupPopper.tsx +2 -3
  40. package/popup/package.json +2 -1
  41. package/radio/package.json +2 -1
  42. package/segmented-control/package.json +2 -1
  43. package/select/package.json +2 -1
  44. package/side-panel/package.json +2 -1
  45. package/skeleton/package.json +2 -1
  46. package/status-indicator/package.json +2 -1
  47. package/switch/package.json +2 -1
  48. package/table/package.json +2 -1
  49. package/tabs/package.json +2 -1
  50. package/text-area/package.json +2 -1
  51. package/text-input/package.json +2 -1
  52. package/toast/package.json +2 -1
  53. package/tokens/package.json +2 -1
  54. package/tooltip/package.json +2 -1
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/action-bar",
3
3
  "module": "../dist/es6/action-bar",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/action-bar"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/avatar",
3
3
  "module": "../dist/es6/avatar",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/avatar"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/badge",
3
3
  "module": "../dist/es6/badge",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/badge"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/banner",
3
3
  "module": "../dist/es6/banner",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/banner"
5
6
  }
@@ -44,14 +44,23 @@ export interface TertiaryButtonProps extends Themeable {
44
44
  * @default false
45
45
  */
46
46
  shouldMirrorIcon?: boolean;
47
+ /**
48
+ * If set to `true`, transform text to all letters uppercase
49
+ * @default undefined
50
+ */
47
51
  allCaps?: boolean;
48
52
  children?: React.ReactNode;
53
+ /**
54
+ * If set to `true`, make icon button available to use theme colors instead of default
55
+ * @default false
56
+ */
57
+ isThemeable?: boolean;
49
58
  }
50
59
 
51
60
  const getTertiaryButtonColors = (
52
61
  variant: 'inverse' | undefined,
53
62
  theme: EmotionCanvasTheme,
54
- children: React.ReactNode
63
+ hasThemeStyles: boolean
55
64
  ): ButtonColors => {
56
65
  const {
57
66
  canvas: {
@@ -99,27 +108,27 @@ const getTertiaryButtonColors = (
99
108
  } else {
100
109
  return {
101
110
  default: {
102
- icon: children ? themePrimary.main : colors.blackPepper400,
111
+ icon: hasThemeStyles ? themePrimary.main : colors.blackPepper400,
103
112
  label: themePrimary.main,
104
113
  },
105
114
  hover: {
106
115
  background: colors.soap200,
107
- icon: children ? themePrimary.dark : colors.blackPepper500,
116
+ icon: hasThemeStyles ? themePrimary.dark : colors.blackPepper500,
108
117
  label: themePrimary.dark,
109
118
  },
110
119
  active: {
111
120
  background: colors.soap300,
112
- icon: children ? themePrimary.dark : colors.blackPepper500,
121
+ icon: hasThemeStyles ? themePrimary.dark : colors.blackPepper500,
113
122
  label: themePrimary.dark,
114
123
  },
115
124
  focus: {
116
- icon: children ? themePrimary.main : colors.blackPepper500,
125
+ icon: hasThemeStyles ? themePrimary.main : colors.blackPepper500,
117
126
  label: themePrimary.main,
118
127
  focusRing: focusRing({innerColor: colors.blueberry400}, theme),
119
128
  },
120
129
  disabled: {
121
130
  background: 'transparent',
122
- icon: children ? themePrimary.main : colors.blackPepper400,
131
+ icon: hasThemeStyles ? themePrimary.main : colors.blackPepper400,
123
132
  label: themePrimary.main,
124
133
  },
125
134
  };
@@ -197,6 +206,7 @@ export const TertiaryButton = createComponent('button')({
197
206
  {
198
207
  size = 'medium',
199
208
  iconPosition = 'start',
209
+ isThemeable = false,
200
210
  variant,
201
211
  children,
202
212
  icon,
@@ -208,13 +218,14 @@ export const TertiaryButton = createComponent('button')({
208
218
  Element
209
219
  ) => {
210
220
  const theme = useTheme();
221
+ const hasThemeStyles = !!children || isThemeable;
211
222
 
212
223
  return (
213
224
  <StyledTertiaryButtonContainer
214
225
  ref={ref}
215
226
  as={Element}
216
227
  allCaps={allCaps}
217
- colors={getTertiaryButtonColors(variant, theme, children)}
228
+ colors={getTertiaryButtonColors(variant, theme, hasThemeStyles)}
218
229
  size={size}
219
230
  padding={getPaddingStyles(icon, iconPosition, children, size)}
220
231
  minWidth={getMinWidthStyles(children, size)}
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/button",
3
3
  "module": "../dist/es6/button",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/button"
5
6
  }
package/card/package.json CHANGED
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/card",
3
3
  "module": "../dist/es6/card",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/card"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/checkbox",
3
3
  "module": "../dist/es6/checkbox",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/checkbox"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/collection",
3
3
  "module": "../dist/es6/collection",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/collection"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/color-picker",
3
3
  "module": "../dist/es6/color-picker",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/color-picker"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/common",
3
3
  "module": "../dist/es6/common",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/common"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/dialog",
3
3
  "module": "../dist/es6/dialog",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/dialog"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/disclosure",
3
3
  "module": "../dist/es6/disclosure",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/disclosure"
5
6
  }
@@ -33,8 +33,17 @@ export interface TertiaryButtonProps extends Themeable {
33
33
  * @default false
34
34
  */
35
35
  shouldMirrorIcon?: boolean;
36
+ /**
37
+ * If set to `true`, transform text to all letters uppercase
38
+ * @default undefined
39
+ */
36
40
  allCaps?: boolean;
37
41
  children?: React.ReactNode;
42
+ /**
43
+ * If set to `true`, make icon button available to use theme colors instead of default
44
+ * @default false
45
+ */
46
+ isThemeable?: boolean;
38
47
  }
39
48
  export declare const TertiaryButton: import("../../common").ElementComponent<"button", TertiaryButtonProps>;
40
49
  //# sourceMappingURL=TertiaryButton.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"TertiaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/TertiaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAGL,SAAS,EAKV,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAe,aAAa,EAAE,WAAW,EAAC,MAAM,SAAS,CAAC;AAGjE,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;OAIG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;OAEG;IACH;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAiJD,eAAO,MAAM,cAAc,wEAkDzB,CAAC"}
1
+ {"version":3,"file":"TertiaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/TertiaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAGL,SAAS,EAKV,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAe,aAAa,EAAE,WAAW,EAAC,MAAM,SAAS,CAAC;AAGjE,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;OAIG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;OAEG;IACH;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAiJD,eAAO,MAAM,cAAc,wEAoDzB,CAAC"}
@@ -46,7 +46,7 @@ var React = __importStar(require("react"));
46
46
  var common_1 = require("@workday/canvas-kit-react/common");
47
47
  var tokens_1 = require("@workday/canvas-kit-react/tokens");
48
48
  var BaseButton_1 = require("./BaseButton");
49
- var getTertiaryButtonColors = function (variant, theme, children) {
49
+ var getTertiaryButtonColors = function (variant, theme, hasThemeStyles) {
50
50
  var themePrimary = theme.canvas.palette.primary;
51
51
  if (variant === 'inverse') {
52
52
  return {
@@ -86,27 +86,27 @@ var getTertiaryButtonColors = function (variant, theme, children) {
86
86
  else {
87
87
  return {
88
88
  default: {
89
- icon: children ? themePrimary.main : tokens_1.colors.blackPepper400,
89
+ icon: hasThemeStyles ? themePrimary.main : tokens_1.colors.blackPepper400,
90
90
  label: themePrimary.main,
91
91
  },
92
92
  hover: {
93
93
  background: tokens_1.colors.soap200,
94
- icon: children ? themePrimary.dark : tokens_1.colors.blackPepper500,
94
+ icon: hasThemeStyles ? themePrimary.dark : tokens_1.colors.blackPepper500,
95
95
  label: themePrimary.dark,
96
96
  },
97
97
  active: {
98
98
  background: tokens_1.colors.soap300,
99
- icon: children ? themePrimary.dark : tokens_1.colors.blackPepper500,
99
+ icon: hasThemeStyles ? themePrimary.dark : tokens_1.colors.blackPepper500,
100
100
  label: themePrimary.dark,
101
101
  },
102
102
  focus: {
103
- icon: children ? themePrimary.main : tokens_1.colors.blackPepper500,
103
+ icon: hasThemeStyles ? themePrimary.main : tokens_1.colors.blackPepper500,
104
104
  label: themePrimary.main,
105
105
  focusRing: common_1.focusRing({ innerColor: tokens_1.colors.blueberry400 }, theme),
106
106
  },
107
107
  disabled: {
108
108
  background: 'transparent',
109
- icon: children ? themePrimary.main : tokens_1.colors.blackPepper400,
109
+ icon: hasThemeStyles ? themePrimary.main : tokens_1.colors.blackPepper400,
110
110
  label: themePrimary.main,
111
111
  },
112
112
  };
@@ -170,9 +170,10 @@ var getMinWidthStyles = function (children, size) {
170
170
  exports.TertiaryButton = common_1.createComponent('button')({
171
171
  displayName: 'TertiaryButton',
172
172
  Component: function (_a, ref, Element) {
173
- var _b = _a.size, size = _b === void 0 ? 'medium' : _b, _c = _a.iconPosition, iconPosition = _c === void 0 ? 'start' : _c, variant = _a.variant, children = _a.children, icon = _a.icon, _d = _a.shouldMirrorIcon, shouldMirrorIcon = _d === void 0 ? false : _d, allCaps = _a.allCaps, elemProps = __rest(_a, ["size", "iconPosition", "variant", "children", "icon", "shouldMirrorIcon", "allCaps"]);
173
+ var _b = _a.size, size = _b === void 0 ? 'medium' : _b, _c = _a.iconPosition, iconPosition = _c === void 0 ? 'start' : _c, _d = _a.isThemeable, isThemeable = _d === void 0 ? false : _d, variant = _a.variant, children = _a.children, icon = _a.icon, _e = _a.shouldMirrorIcon, shouldMirrorIcon = _e === void 0 ? false : _e, allCaps = _a.allCaps, elemProps = __rest(_a, ["size", "iconPosition", "isThemeable", "variant", "children", "icon", "shouldMirrorIcon", "allCaps"]);
174
174
  var theme = common_1.useTheme();
175
- return (React.createElement(StyledTertiaryButtonContainer, __assign({ ref: ref, as: Element, allCaps: allCaps, colors: getTertiaryButtonColors(variant, theme, children), size: size, padding: getPaddingStyles(icon, iconPosition, children, size), minWidth: getMinWidthStyles(children, size), style: { borderRadius: children ? tokens_1.borderRadius.m : tokens_1.borderRadius.circle } }, elemProps),
175
+ var hasThemeStyles = !!children || isThemeable;
176
+ return (React.createElement(StyledTertiaryButtonContainer, __assign({ ref: ref, as: Element, allCaps: allCaps, colors: getTertiaryButtonColors(variant, theme, hasThemeStyles), size: size, padding: getPaddingStyles(icon, iconPosition, children, size), minWidth: getMinWidthStyles(children, size), style: { borderRadius: children ? tokens_1.borderRadius.m : tokens_1.borderRadius.circle } }, elemProps),
176
177
  icon && iconPosition === 'start' && (React.createElement(BaseButton_1.BaseButton.Icon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon })),
177
178
  children && React.createElement(StyledButtonLabel, null, children),
178
179
  icon && iconPosition === 'end' && (React.createElement(BaseButton_1.BaseButton.Icon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon }))));
@@ -1,7 +1,6 @@
1
1
  declare type UseLiveRegionConfig = {
2
2
  'aria-atomic'?: React.AriaAttributes['aria-atomic'];
3
3
  'aria-live'?: 'polite' | 'assertive';
4
- 'aria-relevant'?: React.AriaAttributes['aria-relevant'];
5
4
  role?: 'status' | 'alert' | 'log';
6
5
  shouldAnnounceToScreenReader?: boolean;
7
6
  };
@@ -1 +1 @@
1
- {"version":3,"file":"useLiveRegion.d.ts","sourceRoot":"","sources":["../../../../../../pagination/lib/Pagination/common/useLiveRegion.tsx"],"names":[],"mappings":"AAAA,aAAK,mBAAmB,GAAG;IACzB,aAAa,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;IACpD,WAAW,CAAC,EAAE,QAAQ,GAAG,WAAW,CAAC;IACrC,eAAe,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC;IACxD,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC;IAClC,4BAA4B,CAAC,EAAE,OAAO,CAAC;CACxC,CAAC;AAEF,wBAAgB,aAAa,CAAC,MAAM,sBAA4B,uBAY/D"}
1
+ {"version":3,"file":"useLiveRegion.d.ts","sourceRoot":"","sources":["../../../../../../pagination/lib/Pagination/common/useLiveRegion.tsx"],"names":[],"mappings":"AAAA,aAAK,mBAAmB,GAAG;IACzB,aAAa,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;IACpD,WAAW,CAAC,EAAE,QAAQ,GAAG,WAAW,CAAC;IACrC,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC;IAClC,4BAA4B,CAAC,EAAE,OAAO,CAAC;CACxC,CAAC;AAEF,wBAAgB,aAAa,CAAC,MAAM,sBAA4B,uBAW/D"}
@@ -27,7 +27,7 @@ function useLiveRegion(config) {
27
27
  if (config === void 0) { config = {}; }
28
28
  var _a = config.shouldAnnounceToScreenReader, shouldAnnounceToScreenReader = _a === void 0 ? true : _a, restConfig = __rest(config, ["shouldAnnounceToScreenReader"]);
29
29
  if (shouldAnnounceToScreenReader) {
30
- return __assign({ 'aria-atomic': true, 'aria-live': 'polite', 'aria-relevant': true, role: 'status' }, restConfig);
30
+ return __assign({ 'aria-atomic': true, 'aria-live': 'polite', role: 'status' }, restConfig);
31
31
  }
32
32
  return {};
33
33
  }
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
- import { Placement, PopperOptions } from './Popper';
3
- export interface PopupPopperProps {
2
+ import { Placement, PopperOptions, PopperProps } from './Popper';
3
+ export interface PopupPopperProps extends PopperProps {
4
4
  /**
5
5
  * The placement of the `Popper` contents relative to the `anchorElement`. Accepts `auto`, `top`,
6
6
  * `right`, `bottom`, or `left`. Each placement can also be modified using any of the following
@@ -12,7 +12,6 @@ export interface PopupPopperProps {
12
12
  * The additional options passed to the Popper's `popper.js` instance.
13
13
  */
14
14
  popperOptions?: Partial<PopperOptions>;
15
- children?: React.ReactNode;
16
15
  }
17
16
  export declare const PopupPopper: import("../../common").ElementComponentM<"div", PopupPopperProps, {
18
17
  state: {
@@ -1 +1 @@
1
- {"version":3,"file":"PopupPopper.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupPopper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAC,SAAS,EAAE,aAAa,EAAS,MAAM,UAAU,CAAC;AAE1D,MAAM,WAAW,gBAAgB;IAC/B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;EAMtB,CAAC"}
1
+ {"version":3,"file":"PopupPopper.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupPopper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAC,SAAS,EAAE,aAAa,EAAU,WAAW,EAAC,MAAM,UAAU,CAAC;AAEvE,MAAM,WAAW,gBAAiB,SAAQ,WAAW;IACnD;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;CACxC;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;EAMtB,CAAC"}
@@ -33,8 +33,17 @@ export interface TertiaryButtonProps extends Themeable {
33
33
  * @default false
34
34
  */
35
35
  shouldMirrorIcon?: boolean;
36
+ /**
37
+ * If set to `true`, transform text to all letters uppercase
38
+ * @default undefined
39
+ */
36
40
  allCaps?: boolean;
37
41
  children?: React.ReactNode;
42
+ /**
43
+ * If set to `true`, make icon button available to use theme colors instead of default
44
+ * @default false
45
+ */
46
+ isThemeable?: boolean;
38
47
  }
39
48
  export declare const TertiaryButton: import("../../common").ElementComponent<"button", TertiaryButtonProps>;
40
49
  //# sourceMappingURL=TertiaryButton.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"TertiaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/TertiaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAGL,SAAS,EAKV,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAe,aAAa,EAAE,WAAW,EAAC,MAAM,SAAS,CAAC;AAGjE,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;OAIG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;OAEG;IACH;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAiJD,eAAO,MAAM,cAAc,wEAkDzB,CAAC"}
1
+ {"version":3,"file":"TertiaryButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/TertiaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAGL,SAAS,EAKV,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAe,aAAa,EAAE,WAAW,EAAC,MAAM,SAAS,CAAC;AAGjE,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;OAIG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;OAEG;IACH;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAiJD,eAAO,MAAM,cAAc,wEAoDzB,CAAC"}
@@ -24,7 +24,7 @@ import * as React from 'react';
24
24
  import { focusRing, useTheme, createComponent, styled, } from '@workday/canvas-kit-react/common';
25
25
  import { borderRadius, colors, space } from '@workday/canvas-kit-react/tokens';
26
26
  import { BaseButton } from './BaseButton';
27
- var getTertiaryButtonColors = function (variant, theme, children) {
27
+ var getTertiaryButtonColors = function (variant, theme, hasThemeStyles) {
28
28
  var themePrimary = theme.canvas.palette.primary;
29
29
  if (variant === 'inverse') {
30
30
  return {
@@ -64,27 +64,27 @@ var getTertiaryButtonColors = function (variant, theme, children) {
64
64
  else {
65
65
  return {
66
66
  default: {
67
- icon: children ? themePrimary.main : colors.blackPepper400,
67
+ icon: hasThemeStyles ? themePrimary.main : colors.blackPepper400,
68
68
  label: themePrimary.main,
69
69
  },
70
70
  hover: {
71
71
  background: colors.soap200,
72
- icon: children ? themePrimary.dark : colors.blackPepper500,
72
+ icon: hasThemeStyles ? themePrimary.dark : colors.blackPepper500,
73
73
  label: themePrimary.dark,
74
74
  },
75
75
  active: {
76
76
  background: colors.soap300,
77
- icon: children ? themePrimary.dark : colors.blackPepper500,
77
+ icon: hasThemeStyles ? themePrimary.dark : colors.blackPepper500,
78
78
  label: themePrimary.dark,
79
79
  },
80
80
  focus: {
81
- icon: children ? themePrimary.main : colors.blackPepper500,
81
+ icon: hasThemeStyles ? themePrimary.main : colors.blackPepper500,
82
82
  label: themePrimary.main,
83
83
  focusRing: focusRing({ innerColor: colors.blueberry400 }, theme),
84
84
  },
85
85
  disabled: {
86
86
  background: 'transparent',
87
- icon: children ? themePrimary.main : colors.blackPepper400,
87
+ icon: hasThemeStyles ? themePrimary.main : colors.blackPepper400,
88
88
  label: themePrimary.main,
89
89
  },
90
90
  };
@@ -148,9 +148,10 @@ var getMinWidthStyles = function (children, size) {
148
148
  export var TertiaryButton = createComponent('button')({
149
149
  displayName: 'TertiaryButton',
150
150
  Component: function (_a, ref, Element) {
151
- var _b = _a.size, size = _b === void 0 ? 'medium' : _b, _c = _a.iconPosition, iconPosition = _c === void 0 ? 'start' : _c, variant = _a.variant, children = _a.children, icon = _a.icon, _d = _a.shouldMirrorIcon, shouldMirrorIcon = _d === void 0 ? false : _d, allCaps = _a.allCaps, elemProps = __rest(_a, ["size", "iconPosition", "variant", "children", "icon", "shouldMirrorIcon", "allCaps"]);
151
+ var _b = _a.size, size = _b === void 0 ? 'medium' : _b, _c = _a.iconPosition, iconPosition = _c === void 0 ? 'start' : _c, _d = _a.isThemeable, isThemeable = _d === void 0 ? false : _d, variant = _a.variant, children = _a.children, icon = _a.icon, _e = _a.shouldMirrorIcon, shouldMirrorIcon = _e === void 0 ? false : _e, allCaps = _a.allCaps, elemProps = __rest(_a, ["size", "iconPosition", "isThemeable", "variant", "children", "icon", "shouldMirrorIcon", "allCaps"]);
152
152
  var theme = useTheme();
153
- return (React.createElement(StyledTertiaryButtonContainer, __assign({ ref: ref, as: Element, allCaps: allCaps, colors: getTertiaryButtonColors(variant, theme, children), size: size, padding: getPaddingStyles(icon, iconPosition, children, size), minWidth: getMinWidthStyles(children, size), style: { borderRadius: children ? borderRadius.m : borderRadius.circle } }, elemProps),
153
+ var hasThemeStyles = !!children || isThemeable;
154
+ return (React.createElement(StyledTertiaryButtonContainer, __assign({ ref: ref, as: Element, allCaps: allCaps, colors: getTertiaryButtonColors(variant, theme, hasThemeStyles), size: size, padding: getPaddingStyles(icon, iconPosition, children, size), minWidth: getMinWidthStyles(children, size), style: { borderRadius: children ? borderRadius.m : borderRadius.circle } }, elemProps),
154
155
  icon && iconPosition === 'start' && (React.createElement(BaseButton.Icon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon })),
155
156
  children && React.createElement(StyledButtonLabel, null, children),
156
157
  icon && iconPosition === 'end' && (React.createElement(BaseButton.Icon, { size: size, iconPosition: iconPosition, icon: icon, shouldMirrorIcon: shouldMirrorIcon }))));
@@ -1,7 +1,6 @@
1
1
  declare type UseLiveRegionConfig = {
2
2
  'aria-atomic'?: React.AriaAttributes['aria-atomic'];
3
3
  'aria-live'?: 'polite' | 'assertive';
4
- 'aria-relevant'?: React.AriaAttributes['aria-relevant'];
5
4
  role?: 'status' | 'alert' | 'log';
6
5
  shouldAnnounceToScreenReader?: boolean;
7
6
  };
@@ -1 +1 @@
1
- {"version":3,"file":"useLiveRegion.d.ts","sourceRoot":"","sources":["../../../../../../pagination/lib/Pagination/common/useLiveRegion.tsx"],"names":[],"mappings":"AAAA,aAAK,mBAAmB,GAAG;IACzB,aAAa,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;IACpD,WAAW,CAAC,EAAE,QAAQ,GAAG,WAAW,CAAC;IACrC,eAAe,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC;IACxD,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC;IAClC,4BAA4B,CAAC,EAAE,OAAO,CAAC;CACxC,CAAC;AAEF,wBAAgB,aAAa,CAAC,MAAM,sBAA4B,uBAY/D"}
1
+ {"version":3,"file":"useLiveRegion.d.ts","sourceRoot":"","sources":["../../../../../../pagination/lib/Pagination/common/useLiveRegion.tsx"],"names":[],"mappings":"AAAA,aAAK,mBAAmB,GAAG;IACzB,aAAa,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;IACpD,WAAW,CAAC,EAAE,QAAQ,GAAG,WAAW,CAAC;IACrC,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC;IAClC,4BAA4B,CAAC,EAAE,OAAO,CAAC;CACxC,CAAC;AAEF,wBAAgB,aAAa,CAAC,MAAM,sBAA4B,uBAW/D"}
@@ -24,7 +24,7 @@ export function useLiveRegion(config) {
24
24
  if (config === void 0) { config = {}; }
25
25
  var _a = config.shouldAnnounceToScreenReader, shouldAnnounceToScreenReader = _a === void 0 ? true : _a, restConfig = __rest(config, ["shouldAnnounceToScreenReader"]);
26
26
  if (shouldAnnounceToScreenReader) {
27
- return __assign({ 'aria-atomic': true, 'aria-live': 'polite', 'aria-relevant': true, role: 'status' }, restConfig);
27
+ return __assign({ 'aria-atomic': true, 'aria-live': 'polite', role: 'status' }, restConfig);
28
28
  }
29
29
  return {};
30
30
  }
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
- import { Placement, PopperOptions } from './Popper';
3
- export interface PopupPopperProps {
2
+ import { Placement, PopperOptions, PopperProps } from './Popper';
3
+ export interface PopupPopperProps extends PopperProps {
4
4
  /**
5
5
  * The placement of the `Popper` contents relative to the `anchorElement`. Accepts `auto`, `top`,
6
6
  * `right`, `bottom`, or `left`. Each placement can also be modified using any of the following
@@ -12,7 +12,6 @@ export interface PopupPopperProps {
12
12
  * The additional options passed to the Popper's `popper.js` instance.
13
13
  */
14
14
  popperOptions?: Partial<PopperOptions>;
15
- children?: React.ReactNode;
16
15
  }
17
16
  export declare const PopupPopper: import("../../common").ElementComponentM<"div", PopupPopperProps, {
18
17
  state: {
@@ -1 +1 @@
1
- {"version":3,"file":"PopupPopper.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupPopper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAC,SAAS,EAAE,aAAa,EAAS,MAAM,UAAU,CAAC;AAE1D,MAAM,WAAW,gBAAgB;IAC/B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;EAMtB,CAAC"}
1
+ {"version":3,"file":"PopupPopper.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupPopper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAC,SAAS,EAAE,aAAa,EAAU,WAAW,EAAC,MAAM,UAAU,CAAC;AAEvE,MAAM,WAAW,gBAAiB,SAAQ,WAAW;IACnD;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;CACxC;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;EAMtB,CAAC"}
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/form-field",
3
3
  "module": "../dist/es6/form-field",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/form-field"
5
6
  }
package/icon/package.json CHANGED
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/icon",
3
3
  "module": "../dist/es6/icon",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/icon"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/layout",
3
3
  "module": "../dist/es6/layout",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/layout"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/loading-animation",
3
3
  "module": "../dist/es6/loading-animation",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/loading-animation"
5
6
  }
package/menu/package.json CHANGED
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/menu",
3
3
  "module": "../dist/es6/menu",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/menu"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/modal",
3
3
  "module": "../dist/es6/modal",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/modal"
5
6
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@workday/canvas-kit-react",
3
- "version": "7.2.0-next.2+2d1c962c",
3
+ "version": "7.2.2",
4
4
  "description": "The parent module that contains all Workday Canvas Kit React components",
5
5
  "author": "Workday, Inc. (https://www.workday.com)",
6
6
  "license": "Apache-2.0",
@@ -49,9 +49,9 @@
49
49
  "@emotion/styled": "^11.6.0",
50
50
  "@popperjs/core": "^2.5.4",
51
51
  "@workday/canvas-colors-web": "^2.0.0",
52
- "@workday/canvas-kit-labs-react": "^7.2.0-next.2+2d1c962c",
53
- "@workday/canvas-kit-popup-stack": "^7.2.0-next.2+2d1c962c",
54
- "@workday/canvas-kit-preview-react": "^7.2.0-next.2+2d1c962c",
52
+ "@workday/canvas-kit-labs-react": "^7.2.2",
53
+ "@workday/canvas-kit-popup-stack": "^7.2.2",
54
+ "@workday/canvas-kit-preview-react": "^7.2.2",
55
55
  "@workday/canvas-system-icons-web": "^3.0.0",
56
56
  "@workday/design-assets-types": "^0.2.8",
57
57
  "chroma-js": "^2.1.0",
@@ -70,5 +70,5 @@
70
70
  "@workday/canvas-accent-icons-web": "^3.0.0",
71
71
  "@workday/canvas-applet-icons-web": "^2.0.0"
72
72
  },
73
- "gitHead": "2d1c962c704eec264f341f2f3a5cad9a0e7c2c02"
73
+ "gitHead": "aa0a6bd1f7e8c7c5a8e9a8c331c71eb460e4b34f"
74
74
  }
@@ -1,7 +1,6 @@
1
1
  type UseLiveRegionConfig = {
2
2
  'aria-atomic'?: React.AriaAttributes['aria-atomic'];
3
3
  'aria-live'?: 'polite' | 'assertive';
4
- 'aria-relevant'?: React.AriaAttributes['aria-relevant'];
5
4
  role?: 'status' | 'alert' | 'log';
6
5
  shouldAnnounceToScreenReader?: boolean;
7
6
  };
@@ -12,7 +11,6 @@ export function useLiveRegion(config = {} as UseLiveRegionConfig) {
12
11
  return {
13
12
  'aria-atomic': true,
14
13
  'aria-live': 'polite',
15
- 'aria-relevant': true,
16
14
  role: 'status',
17
15
  ...restConfig,
18
16
  } as UseLiveRegionConfig;
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/pagination",
3
3
  "module": "../dist/es6/pagination",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/pagination"
5
6
  }
@@ -3,9 +3,9 @@ import * as React from 'react';
3
3
  import {createSubcomponent} from '@workday/canvas-kit-react/common';
4
4
 
5
5
  import {usePopupModel, usePopupPopper} from './hooks';
6
- import {Placement, PopperOptions, Popper} from './Popper';
6
+ import {Placement, PopperOptions, Popper, PopperProps} from './Popper';
7
7
 
8
- export interface PopupPopperProps {
8
+ export interface PopupPopperProps extends PopperProps {
9
9
  /**
10
10
  * The placement of the `Popper` contents relative to the `anchorElement`. Accepts `auto`, `top`,
11
11
  * `right`, `bottom`, or `left`. Each placement can also be modified using any of the following
@@ -17,7 +17,6 @@ export interface PopupPopperProps {
17
17
  * The additional options passed to the Popper's `popper.js` instance.
18
18
  */
19
19
  popperOptions?: Partial<PopperOptions>;
20
- children?: React.ReactNode;
21
20
  }
22
21
 
23
22
  export const PopupPopper = createSubcomponent('div')({
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/popup",
3
3
  "module": "../dist/es6/popup",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/popup"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/radio",
3
3
  "module": "../dist/es6/radio",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/radio"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/segmented-control",
3
3
  "module": "../dist/es6/segmented-control",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/segmented-control"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/select",
3
3
  "module": "../dist/es6/select",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/select"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/side-panel",
3
3
  "module": "../dist/es6/side-panel",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/side-panel"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/skeleton",
3
3
  "module": "../dist/es6/skeleton",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/skeleton"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/status-indicator",
3
3
  "module": "../dist/es6/status-indicator",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/status-indicator"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/switch",
3
3
  "module": "../dist/es6/switch",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/switch"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/table",
3
3
  "module": "../dist/es6/table",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/table"
5
6
  }
package/tabs/package.json CHANGED
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/tabs",
3
3
  "module": "../dist/es6/tabs",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/tabs"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/text-area",
3
3
  "module": "../dist/es6/text-area",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/text-area"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/text-input",
3
3
  "module": "../dist/es6/text-input",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/text-input"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/toast",
3
3
  "module": "../dist/es6/toast",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/toast"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/tokens",
3
3
  "module": "../dist/es6/tokens",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/tokens"
5
6
  }
@@ -1,5 +1,6 @@
1
1
  {
2
2
  "main": "../dist/commonjs/tooltip",
3
3
  "module": "../dist/es6/tooltip",
4
- "sideEffects": false
4
+ "sideEffects": false,
5
+ "types": "../dist/es6/tooltip"
5
6
  }