@workday/canvas-kit-react 8.6.0-388-next.2 → 8.6.1

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 (23) hide show
  1. package/collection/lib/useListItemSelect.tsx +3 -4
  2. package/dist/commonjs/collection/lib/useListItemSelect.d.ts.map +1 -1
  3. package/dist/commonjs/collection/lib/useListItemSelect.js +3 -4
  4. package/dist/commonjs/form-field/lib/FormField.d.ts.map +1 -1
  5. package/dist/commonjs/form-field/lib/FormField.js +3 -0
  6. package/dist/commonjs/form-field/lib/Label.d.ts +4 -3
  7. package/dist/commonjs/form-field/lib/Label.d.ts.map +1 -1
  8. package/dist/commonjs/form-field/lib/Label.js +4 -4
  9. package/dist/commonjs/menu/lib/MenuItem.d.ts.map +1 -1
  10. package/dist/commonjs/menu/lib/MenuItem.js +5 -2
  11. package/dist/es6/collection/lib/useListItemSelect.d.ts.map +1 -1
  12. package/dist/es6/collection/lib/useListItemSelect.js +3 -4
  13. package/dist/es6/form-field/lib/FormField.d.ts.map +1 -1
  14. package/dist/es6/form-field/lib/FormField.js +3 -0
  15. package/dist/es6/form-field/lib/Label.d.ts +4 -3
  16. package/dist/es6/form-field/lib/Label.d.ts.map +1 -1
  17. package/dist/es6/form-field/lib/Label.js +4 -4
  18. package/dist/es6/menu/lib/MenuItem.d.ts.map +1 -1
  19. package/dist/es6/menu/lib/MenuItem.js +5 -2
  20. package/form-field/lib/FormField.tsx +4 -0
  21. package/form-field/lib/Label.tsx +9 -8
  22. package/menu/lib/MenuItem.tsx +5 -2
  23. package/package.json +3 -3
package/collection/lib/useListItemSelect.tsx CHANGED
@@ -21,12 +21,11 @@ export const useListItemSelect = createElemPropsHook(useListModel)(
21
21
  const name = elemProps['data-id'] || '';
22
22
  const onClick = (event: React.MouseEvent<HTMLElement>) => {
23
23
  if (
24
- state.nonInteractiveIds.includes(name) ||
25
- event.currentTarget.hasAttribute('aria-disabled')
24
+ !state.nonInteractiveIds.includes(name) &&
25
+ event.currentTarget.getAttribute('aria-disabled') !== 'true'
26
26
  ) {
27
- return;
27
+ events.select({id: name});
28
28
  }
29
- events.select({id: name});
30
29
  };
31
30
 
32
31
  return {onClick};
package/dist/commonjs/collection/lib/useListItemSelect.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useListItemSelect.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useListItemSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAGF,gBAAgB,CAAC,WAAW,CAAC;;;OAYxD,CAAC"}
1
+ {"version":3,"file":"useListItemSelect.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useListItemSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAGF,gBAAgB,CAAC,WAAW,CAAC;;;OAWxD,CAAC"}
package/dist/commonjs/collection/lib/useListItemSelect.js CHANGED
@@ -20,11 +20,10 @@ exports.useListItemSelect = common_1.createElemPropsHook(useListModel_1.useListM
20
20
  if (elemProps === void 0) { elemProps = {}; }
21
21
  var name = elemProps['data-id'] || '';
22
22
  var onClick = function (event) {
23
- if (state.nonInteractiveIds.includes(name) ||
24
- event.currentTarget.hasAttribute('aria-disabled')) {
25
- return;
23
+ if (!state.nonInteractiveIds.includes(name) &&
24
+ event.currentTarget.getAttribute('aria-disabled') !== 'true') {
25
+ events.select({ id: name });
26
26
  }
27
- events.select({ id: name });
28
27
  };
29
28
  return { onClick: onClick };
30
29
  });
package/dist/commonjs/form-field/lib/FormField.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,cAAc,EACd,SAAS,EAET,SAAS,EAEV,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EAAC,sBAAsB,EAAiC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,cACf,SAAQ,SAAS,EACf,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,cAAc;IAChB;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAoED,qBAAa,SAAU,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC;IACrF,MAAM,CAAC,aAAa,gCAA0B;IAC9C,MAAM,CAAC,SAAS,mBAAa;IAE7B,OAAO,CAAC,OAAO,CAAoD;IAEnE,OAAO,CAAC,cAAc,CA8BpB;IAEF,MAAM;CA2DP"}
1
+ {"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,cAAc,EACd,SAAS,EAET,SAAS,EAEV,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EAAC,sBAAsB,EAAiC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,cACf,SAAQ,SAAS,EACf,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,cAAc;IAChB;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAoED,qBAAa,SAAU,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC;IACrF,MAAM,CAAC,aAAa,gCAA0B;IAC9C,MAAM,CAAC,SAAS,mBAAa;IAE7B,OAAO,CAAC,OAAO,CAAoD;IAEnE,OAAO,CAAC,cAAc,CAkCpB;IAEF,MAAM;CA2DP"}
package/dist/commonjs/form-field/lib/FormField.js CHANGED
@@ -138,6 +138,9 @@ var FormField = /** @class */ (function (_super) {
138
138
  props['aria-invalid'] = true;
139
139
  }
140
140
  }
141
+ if (_this.props.required) {
142
+ props.required = true;
143
+ }
141
144
  props.id = _this.inputId;
142
145
  return React.cloneElement(child, props);
143
146
  }
package/dist/commonjs/form-field/lib/Label.d.ts CHANGED
@@ -12,7 +12,7 @@ export interface LabelProps extends FormFieldLabelPositionBehavior {
12
12
  */
13
13
  isLegend?: boolean;
14
14
  /**
15
- * The id of a labelable form-related element. Synonymous with `for`.
15
+ * The id of the form-related element. Synonymous with `for`.
16
16
  */
17
17
  htmlFor?: string;
18
18
  /**
@@ -21,8 +21,9 @@ export interface LabelProps extends FormFieldLabelPositionBehavior {
21
21
  */
22
22
  required?: boolean;
23
23
  /**
24
- * The title of the required label.
25
- * @default required
24
+ * The required label is not visible to screen readers and should have no label. This prop will be
25
+ * ignored.
26
+ * @deprecated
26
27
  */
27
28
  requiredLabel?: string;
28
29
  /**
package/dist/commonjs/form-field/lib/Label.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Label.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/Label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,sBAAsB,EAAE,8BAA8B,EAAC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,UAAW,SAAQ,8BAA8B;IAChE;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAsDD,cAAM,KAAM,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACtE,MAAM,CAAC,QAAQ,gCAA0B;IAElC,MAAM;CA8Bd;AAID,OAAO,EAAC,KAAK,EAAC,CAAC"}
1
+ {"version":3,"file":"Label.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/Label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,sBAAsB,EAAE,8BAA8B,EAAC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,UAAW,SAAQ,8BAA8B;IAChE;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAsDD,cAAM,KAAM,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACtE,MAAM,CAAC,QAAQ,gCAA0B;IAElC,MAAM;CA8Bd;AAID,OAAO,EAAC,KAAK,EAAC,CAAC"}
package/dist/commonjs/form-field/lib/Label.js CHANGED
@@ -87,7 +87,7 @@ var labelStyles = [
87
87
  }));
88
88
  },
89
89
  ];
90
- var RequiredAstrisk = common_1.styled('abbr')({
90
+ var RequiredAsterisk = common_1.styled('abbr')({
91
91
  color: tokens_1.colors.cinnamon500,
92
92
  fontSize: '16px',
93
93
  fontWeight: 400,
@@ -115,12 +115,12 @@ var Label = /** @class */ (function (_super) {
115
115
  return _super !== null && _super.apply(this, arguments) || this;
116
116
  }
117
117
  Label.prototype.render = function () {
118
- var _a = this.props, _b = _a.labelPosition, labelPosition = _b === void 0 ? Label.Position.Top : _b, _c = _a.isLegend, isLegend = _c === void 0 ? false : _c, _d = _a.requiredLabel, requiredLabel = _d === void 0 ? 'required' : _d, elemProps = __rest(_a, ["labelPosition", "isLegend", "requiredLabel"]);
119
- var children = !this.props.required
118
+ var _a = this.props, _b = _a.labelPosition, labelPosition = _b === void 0 ? Label.Position.Top : _b, _c = _a.isLegend, isLegend = _c === void 0 ? false : _c, required = _a.required, elemProps = __rest(_a, ["labelPosition", "isLegend", "required"]);
119
+ var children = !required
120
120
  ? this.props.children
121
121
  : [
122
122
  this.props.children,
123
- React.createElement(RequiredAstrisk, { key: '0', title: requiredLabel }, "*"),
123
+ React.createElement(RequiredAsterisk, { key: '0', "aria-hidden": true }, "*"),
124
124
  ];
125
125
  return (React.createElement(React.Fragment, null, isLegend ? (React.createElement(LegendComponent, __assign({ labelPosition: labelPosition, isLegend: isLegend }, elemProps, { children: children }))) : (React.createElement(LabelComponent, __assign({ labelPosition: labelPosition }, elemProps, { children: children })))));
126
126
  };
package/dist/commonjs/menu/lib/MenuItem.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B,MAAM,WAAW,aAAa;IAC5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AA4FD,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAoCvB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgBnB,CAAC"}
1
+ {"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B,MAAM,WAAW,aAAa;IAC5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AA4FD,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAuCvB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgBnB,CAAC"}
package/dist/commonjs/menu/lib/MenuItem.js CHANGED
@@ -89,7 +89,7 @@ var StyledItem = common_1.styled(layout_1.Box.as('button'))(function (_a) {
89
89
  fill: tokens_1.iconColors.hover,
90
90
  },
91
91
  },
92
- }, _b.backgroundColor = 'inherit', _b['&:disabled, &[aria-disabled]'] = {
92
+ }, _b.backgroundColor = 'inherit', _b['&:disabled, &[aria-disabled=true]'] = {
93
93
  color: tokens_1.colors.licorice100,
94
94
  cursor: 'default',
95
95
  '.wd-icon-fill, .wd-icon-accent, .wd-icon-accent2': {
@@ -144,7 +144,10 @@ exports.useMenuItem = common_1.composeHooks(common_1.createElemPropsHook(useMenu
144
144
  role: 'menuitem',
145
145
  onClick: model.state.mode === 'single'
146
146
  ? function (event) {
147
- model.events.hide(event);
147
+ // only hide if the item isn't disabled
148
+ if (event.currentTarget.getAttribute('aria-disabled') !== 'true') {
149
+ model.events.hide(event);
150
+ }
148
151
  }
149
152
  : undefined,
150
153
  };
package/dist/es6/collection/lib/useListItemSelect.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useListItemSelect.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useListItemSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAGF,gBAAgB,CAAC,WAAW,CAAC;;;OAYxD,CAAC"}
1
+ {"version":3,"file":"useListItemSelect.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useListItemSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAGF,gBAAgB,CAAC,WAAW,CAAC;;;OAWxD,CAAC"}
package/dist/es6/collection/lib/useListItemSelect.js CHANGED
@@ -17,11 +17,10 @@ export var useListItemSelect = createElemPropsHook(useListModel)(function (_a, _
17
17
  if (elemProps === void 0) { elemProps = {}; }
18
18
  var name = elemProps['data-id'] || '';
19
19
  var onClick = function (event) {
20
- if (state.nonInteractiveIds.includes(name) ||
21
- event.currentTarget.hasAttribute('aria-disabled')) {
22
- return;
20
+ if (!state.nonInteractiveIds.includes(name) &&
21
+ event.currentTarget.getAttribute('aria-disabled') !== 'true') {
22
+ events.select({ id: name });
23
23
  }
24
- events.select({ id: name });
25
24
  };
26
25
  return { onClick: onClick };
27
26
  });
package/dist/es6/form-field/lib/FormField.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,cAAc,EACd,SAAS,EAET,SAAS,EAEV,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EAAC,sBAAsB,EAAiC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,cACf,SAAQ,SAAS,EACf,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,cAAc;IAChB;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAoED,qBAAa,SAAU,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC;IACrF,MAAM,CAAC,aAAa,gCAA0B;IAC9C,MAAM,CAAC,SAAS,mBAAa;IAE7B,OAAO,CAAC,OAAO,CAAoD;IAEnE,OAAO,CAAC,cAAc,CA8BpB;IAEF,MAAM;CA2DP"}
1
+ {"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,cAAc,EACd,SAAS,EAET,SAAS,EAEV,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EAAC,sBAAsB,EAAiC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,cACf,SAAQ,SAAS,EACf,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,cAAc;IAChB;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAoED,qBAAa,SAAU,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC;IACrF,MAAM,CAAC,aAAa,gCAA0B;IAC9C,MAAM,CAAC,SAAS,mBAAa;IAE7B,OAAO,CAAC,OAAO,CAAoD;IAEnE,OAAO,CAAC,cAAc,CAkCpB;IAEF,MAAM;CA2DP"}
package/dist/es6/form-field/lib/FormField.js CHANGED
@@ -116,6 +116,9 @@ var FormField = /** @class */ (function (_super) {
116
116
  props['aria-invalid'] = true;
117
117
  }
118
118
  }
119
+ if (_this.props.required) {
120
+ props.required = true;
121
+ }
119
122
  props.id = _this.inputId;
120
123
  return React.cloneElement(child, props);
121
124
  }
package/dist/es6/form-field/lib/Label.d.ts CHANGED
@@ -12,7 +12,7 @@ export interface LabelProps extends FormFieldLabelPositionBehavior {
12
12
  */
13
13
  isLegend?: boolean;
14
14
  /**
15
- * The id of a labelable form-related element. Synonymous with `for`.
15
+ * The id of the form-related element. Synonymous with `for`.
16
16
  */
17
17
  htmlFor?: string;
18
18
  /**
@@ -21,8 +21,9 @@ export interface LabelProps extends FormFieldLabelPositionBehavior {
21
21
  */
22
22
  required?: boolean;
23
23
  /**
24
- * The title of the required label.
25
- * @default required
24
+ * The required label is not visible to screen readers and should have no label. This prop will be
25
+ * ignored.
26
+ * @deprecated
26
27
  */
27
28
  requiredLabel?: string;
28
29
  /**
package/dist/es6/form-field/lib/Label.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Label.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/Label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,sBAAsB,EAAE,8BAA8B,EAAC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,UAAW,SAAQ,8BAA8B;IAChE;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAsDD,cAAM,KAAM,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACtE,MAAM,CAAC,QAAQ,gCAA0B;IAElC,MAAM;CA8Bd;AAID,OAAO,EAAC,KAAK,EAAC,CAAC"}
1
+ {"version":3,"file":"Label.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/Label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,sBAAsB,EAAE,8BAA8B,EAAC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,UAAW,SAAQ,8BAA8B;IAChE;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAsDD,cAAM,KAAM,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACtE,MAAM,CAAC,QAAQ,gCAA0B;IAElC,MAAM;CA8Bd;AAID,OAAO,EAAC,KAAK,EAAC,CAAC"}
package/dist/es6/form-field/lib/Label.js CHANGED
@@ -65,7 +65,7 @@ var labelStyles = [
65
65
  }));
66
66
  },
67
67
  ];
68
- var RequiredAstrisk = styled('abbr')({
68
+ var RequiredAsterisk = styled('abbr')({
69
69
  color: colors.cinnamon500,
70
70
  fontSize: '16px',
71
71
  fontWeight: 400,
@@ -93,12 +93,12 @@ var Label = /** @class */ (function (_super) {
93
93
  return _super !== null && _super.apply(this, arguments) || this;
94
94
  }
95
95
  Label.prototype.render = function () {
96
- var _a = this.props, _b = _a.labelPosition, labelPosition = _b === void 0 ? Label.Position.Top : _b, _c = _a.isLegend, isLegend = _c === void 0 ? false : _c, _d = _a.requiredLabel, requiredLabel = _d === void 0 ? 'required' : _d, elemProps = __rest(_a, ["labelPosition", "isLegend", "requiredLabel"]);
97
- var children = !this.props.required
96
+ var _a = this.props, _b = _a.labelPosition, labelPosition = _b === void 0 ? Label.Position.Top : _b, _c = _a.isLegend, isLegend = _c === void 0 ? false : _c, required = _a.required, elemProps = __rest(_a, ["labelPosition", "isLegend", "required"]);
97
+ var children = !required
98
98
  ? this.props.children
99
99
  : [
100
100
  this.props.children,
101
- React.createElement(RequiredAstrisk, { key: '0', title: requiredLabel }, "*"),
101
+ React.createElement(RequiredAsterisk, { key: '0', "aria-hidden": true }, "*"),
102
102
  ];
103
103
  return (React.createElement(React.Fragment, null, isLegend ? (React.createElement(LegendComponent, __assign({ labelPosition: labelPosition, isLegend: isLegend }, elemProps, { children: children }))) : (React.createElement(LabelComponent, __assign({ labelPosition: labelPosition }, elemProps, { children: children })))));
104
104
  };
package/dist/es6/menu/lib/MenuItem.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B,MAAM,WAAW,aAAa;IAC5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AA4FD,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAoCvB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgBnB,CAAC"}
1
+ {"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B,MAAM,WAAW,aAAa;IAC5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AA4FD,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAuCvB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgBnB,CAAC"}
package/dist/es6/menu/lib/MenuItem.js CHANGED
@@ -67,7 +67,7 @@ var StyledItem = styled(Box.as('button'))(function (_a) {
67
67
  fill: iconColors.hover,
68
68
  },
69
69
  },
70
- }, _b.backgroundColor = 'inherit', _b['&:disabled, &[aria-disabled]'] = {
70
+ }, _b.backgroundColor = 'inherit', _b['&:disabled, &[aria-disabled=true]'] = {
71
71
  color: colors.licorice100,
72
72
  cursor: 'default',
73
73
  '.wd-icon-fill, .wd-icon-accent, .wd-icon-accent2': {
@@ -122,7 +122,10 @@ export var useMenuItem = composeHooks(createElemPropsHook(useMenuModel)(function
122
122
  role: 'menuitem',
123
123
  onClick: model.state.mode === 'single'
124
124
  ? function (event) {
125
- model.events.hide(event);
125
+ // only hide if the item isn't disabled
126
+ if (event.currentTarget.getAttribute('aria-disabled') !== 'true') {
127
+ model.events.hide(event);
128
+ }
126
129
  }
127
130
  : undefined,
128
131
  };
package/form-field/lib/FormField.tsx CHANGED
@@ -166,6 +166,10 @@ export class FormField extends React.Component<React.PropsWithChildren<FormField
166
166
  }
167
167
  }
168
168
 
169
+ if (this.props.required) {
170
+ props.required = true;
171
+ }
172
+
169
173
  props.id = this.inputId;
170
174
 
171
175
  return React.cloneElement(child, props);
package/form-field/lib/Label.tsx CHANGED
@@ -15,7 +15,7 @@ export interface LabelProps extends FormFieldLabelPositionBehavior {
15
15
  */
16
16
  isLegend?: boolean;
17
17
  /**
18
- * The id of a labelable form-related element. Synonymous with `for`.
18
+ * The id of the form-related element. Synonymous with `for`.
19
19
  */
20
20
  htmlFor?: string;
21
21
  /**
@@ -24,8 +24,9 @@ export interface LabelProps extends FormFieldLabelPositionBehavior {
24
24
  */
25
25
  required?: boolean;
26
26
  /**
27
- * The title of the required label.
28
- * @default required
27
+ * The required label is not visible to screen readers and should have no label. This prop will be
28
+ * ignored.
29
+ * @deprecated
29
30
  */
30
31
  requiredLabel?: string;
31
32
  /**
@@ -62,7 +63,7 @@ const labelStyles = [
62
63
  },
63
64
  ];
64
65
 
65
- const RequiredAstrisk = styled('abbr')({
66
+ const RequiredAsterisk = styled('abbr')({
66
67
  color: colors.cinnamon500,
67
68
  fontSize: '16px',
68
69
  fontWeight: 400,
@@ -94,16 +95,16 @@ class Label extends React.Component<React.PropsWithChildren<LabelProps>> {
94
95
  const {
95
96
  labelPosition = Label.Position.Top,
96
97
  isLegend = false,
97
- requiredLabel = 'required',
98
+ required,
98
99
  ...elemProps
99
100
  } = this.props;
100
- const children = !this.props.required
101
+ const children = !required
101
102
  ? this.props.children
102
103
  : [
103
104
  this.props.children,
104
- <RequiredAstrisk key={'0'} title={requiredLabel}>
105
+ <RequiredAsterisk key={'0'} aria-hidden>
105
106
  *
106
- </RequiredAstrisk>,
107
+ </RequiredAsterisk>,
107
108
  ];
108
109
  return (
109
110
  <>
package/menu/lib/MenuItem.tsx CHANGED
@@ -96,7 +96,7 @@ const StyledItem = styled(Box.as('button'))<StyledType>(
96
96
  },
97
97
  },
98
98
  backgroundColor: 'inherit',
99
- '&:disabled, &[aria-disabled]': {
99
+ '&:disabled, &[aria-disabled=true]': {
100
100
  color: colors.licorice100,
101
101
  cursor: 'default',
102
102
  '.wd-icon-fill, .wd-icon-accent, .wd-icon-accent2': {
@@ -157,7 +157,10 @@ export const useMenuItem = composeHooks(
157
157
  onClick:
158
158
  model.state.mode === 'single'
159
159
  ? (event: React.SyntheticEvent) => {
160
- model.events.hide(event);
160
+ // only hide if the item isn't disabled
161
+ if (event.currentTarget.getAttribute('aria-disabled') !== 'true') {
162
+ model.events.hide(event);
163
+ }
161
164
  }
162
165
  : undefined,
163
166
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@workday/canvas-kit-react",
3
- "version": "8.6.0-388-next.2+46eb3884",
3
+ "version": "8.6.1",
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,7 +49,7 @@
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-popup-stack": "^8.6.0-388-next.2+46eb3884",
52
+ "@workday/canvas-kit-popup-stack": "^8.6.1",
53
53
  "@workday/canvas-system-icons-web": "^3.0.0",
54
54
  "@workday/design-assets-types": "^0.2.8",
55
55
  "chroma-js": "^2.1.0",
@@ -67,5 +67,5 @@
67
67
  "@workday/canvas-accent-icons-web": "^3.0.0",
68
68
  "@workday/canvas-applet-icons-web": "^2.0.0"
69
69
  },
70
- "gitHead": "46eb3884ab4db04dca74be4fa1dff531af89ac51"
70
+ "gitHead": "2fd1e6ab51b4a0f3d3db491c817419b66cc92aaf"
71
71
  }