@workday/canvas-kit-react 6.0.0-alpha.0-next.37 → 6.0.0-alpha.0-next.39

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 (18) hide show
  1. package/button/lib/IconButton.tsx +5 -2
  2. package/dist/commonjs/button/lib/IconButton.d.ts +5 -2
  3. package/dist/commonjs/button/lib/IconButton.d.ts.map +1 -1
  4. package/dist/commonjs/tabs/lib/menu/MenuList.d.ts.map +1 -1
  5. package/dist/commonjs/tabs/lib/menu/MenuList.js +1 -1
  6. package/dist/commonjs/tabs/lib/overflow/useOverflowModel.d.ts.map +1 -1
  7. package/dist/commonjs/tabs/lib/overflow/useOverflowModel.js +9 -0
  8. package/dist/es6/button/lib/IconButton.d.ts +5 -2
  9. package/dist/es6/button/lib/IconButton.d.ts.map +1 -1
  10. package/dist/es6/tabs/lib/menu/MenuList.d.ts.map +1 -1
  11. package/dist/es6/tabs/lib/menu/MenuList.js +1 -1
  12. package/dist/es6/tabs/lib/overflow/useOverflowModel.d.ts.map +1 -1
  13. package/dist/es6/tabs/lib/overflow/useOverflowModel.js +9 -0
  14. package/package.json +5 -5
  15. package/tabs/lib/menu/MenuList.tsx +2 -3
  16. package/tabs/lib/overflow/useOverflowModel.tsx +22 -0
  17. package/ts3.5/dist/commonjs/button/lib/IconButton.d.ts +5 -2
  18. package/ts3.5/dist/es6/button/lib/IconButton.d.ts +5 -2
package/button/lib/IconButton.tsx CHANGED
@@ -14,9 +14,12 @@ import {ButtonContainer} from './parts';
14
14
 
15
15
  export interface IconButtonProps extends Themeable {
16
16
  /**
17
- * The accessibility label to indicate the action triggered by clicking the IconButton.
17
+ * The accessibility label to indicate the action triggered by clicking the IconButton. This is optional because there are
18
+ * instances where an Icon Button might already have an `aria-labelledby`. In a case where an `aria-labelledby` is provided
19
+ * it will take precedence over the `aria-label` as explained here: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute
20
+ * We highly encourage consumers to either provide an `aria-label` OR an `aria-labelledby`
18
21
  */
19
- 'aria-label': string;
22
+ 'aria-label'?: string;
20
23
  /**
21
24
  * The type of the IconButton.
22
25
  * @default 'circle'
package/dist/commonjs/button/lib/IconButton.d.ts CHANGED
@@ -3,9 +3,12 @@ import { Themeable } from '@workday/canvas-kit-react/common';
3
3
  import { CanvasSystemIcon } from '@workday/design-assets-types';
4
4
  export interface IconButtonProps extends Themeable {
5
5
  /**
6
- * The accessibility label to indicate the action triggered by clicking the IconButton.
6
+ * The accessibility label to indicate the action triggered by clicking the IconButton. This is optional because there are
7
+ * instances where an Icon Button might already have an `aria-labelledby`. In a case where an `aria-labelledby` is provided
8
+ * it will take precedence over the `aria-label` as explained here: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute
9
+ * We highly encourage consumers to either provide an `aria-label` OR an `aria-labelledby`
7
10
  */
8
- 'aria-label': string;
11
+ 'aria-label'?: string;
9
12
  /**
10
13
  * The type of the IconButton.
11
14
  * @default 'circle'
package/dist/commonjs/button/lib/IconButton.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAGL,SAAS,EAGV,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAI9D,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EACJ,QAAQ,GACR,cAAc,GACd,OAAO,GACP,QAAQ,GACR,cAAc,GACd,SAAS,GACT,eAAe,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,CAAC;IACxD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,UAAU,oEA8DrB,CAAC"}
1
+ {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAGL,SAAS,EAGV,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAI9D,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,OAAO,CAAC,EACJ,QAAQ,GACR,cAAc,GACd,OAAO,GACP,QAAQ,GACR,cAAc,GACd,SAAS,GACT,eAAe,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,CAAC;IACxD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,UAAU,oEA8DrB,CAAC"}
package/dist/commonjs/tabs/lib/menu/MenuList.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/menu/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAIL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,KAAK,EAAC,MAAM,uCAAuC,CAAC;AAE5D,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,OAAO,CAAC,YAAY,CAAC,OAAO,KAAK,EAAE,KAAK,CAAC,CAAC;IAC5F;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,2EAwBnB,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;OAKtB,CAAC"}
1
+ {"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/menu/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAIL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,KAAK,EAAC,MAAM,uCAAuC,CAAC;AAE5D,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,OAAO,CAAC,YAAY,CAAC,OAAO,KAAK,EAAE,KAAK,CAAC,CAAC;IAC5F;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,2EAuBnB,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;OAKtB,CAAC"}
package/dist/commonjs/tabs/lib/menu/MenuList.js CHANGED
@@ -41,7 +41,7 @@ exports.MenuList = common_1.createComponent('div')({
41
41
  var model = _a.model, children = _a.children, elemProps = __rest(_a, ["model", "children"]);
42
42
  var localModel = common_1.useModelContext(Menu_1.MenuModelContext, model);
43
43
  var props = exports.useMenuList(localModel, elemProps, ref);
44
- return (React.createElement(layout_1.Stack, __assign({ as: Element, background: tokens_1.commonColors.background, borderRadius: "m", padding: "zero", marginY: "zero", marginX: "xxs", spacing: "zero", overflowY: "auto", flexDirection: localModel.state.orientation === 'vertical' ? 'column' : 'row' }, props), list_1.useRenderItems(localModel, children)));
44
+ return (React.createElement(layout_1.Stack, __assign({ as: Element, background: tokens_1.commonColors.background, borderRadius: "zero", padding: "zero", marginY: "xxs", spacing: "zero", overflowY: "auto", flexDirection: localModel.state.orientation === 'vertical' ? 'column' : 'row' }, props), list_1.useRenderItems(localModel, children)));
45
45
  },
46
46
  });
47
47
  exports.useMenuList = common_1.createHook(function (model) {
package/dist/commonjs/tabs/lib/overflow/useOverflowModel.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useOverflowModel.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/overflow/useOverflowModel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAiB,aAAa,EAAc,MAAM,kCAAkC,CAAC;AAC5F,OAAO,EACL,cAAc,EACd,eAAe,EACf,wBAAwB,EAGxB,iBAAiB,EACjB,cAAc,EACf,MAAM,cAAc,CAAC;AAEtB,oBAAY,aAAa,CAAC,CAAC,GAAG,OAAO,IAAI,cAAc,CAAC,CAAC,CAAC,GAAG;IAC3D,cAAc,EAAE,MAAM,CAAC;IACvB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACvC,SAAS,EAAE,MAAM,EAAE,CAAC;CACrB,CAAC;AAEF,oBAAY,cAAc,CAAC,CAAC,GAAG,OAAO,IAAI,eAAe,CAAC,CAAC,CAAC,GAAG;IAC7D,iBAAiB,CAAC,IAAI,EAAE;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IAChD,sBAAsB,CAAC,IAAI,EAAE;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACpD,YAAY,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACtD,eAAe,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IAC1C,YAAY,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACvC,eAAe,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;CAC3C,CAAC;AAEF,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,cAAc,CAAC,CAAC,CAAC;IACnE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IACxB,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmB3B,CAAC;AAEH,oBAAY,uBAAuB,CAAC,CAAC,IAAI,wBAAwB,CAAC,CAAC,CAAC,GAAG;IACrE,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,oBAAY,mBAAmB,CAAC,CAAC,IAAI,uBAAuB,CAAC,CAAC,CAAC,GAC7D,OAAO,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,EAAE,OAAO,iBAAiB,CAAC,CAAC,CAAC;AAExF,wBAAgB,YAAY,CAC1B,cAAc,EAAE,MAAM,EACtB,mBAAmB,EAAE,MAAM,EAC3B,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACtC,WAAW,EAAE,MAAM,EAAE,GAAG,KAAK,GAC5B,MAAM,EAAE,CAsCV;AAED,eAAO,MAAM,gBAAgB,0EA4E5B,CAAC"}
1
+ {"version":3,"file":"useOverflowModel.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/overflow/useOverflowModel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAiB,aAAa,EAAc,MAAM,kCAAkC,CAAC;AAC5F,OAAO,EACL,cAAc,EACd,eAAe,EACf,wBAAwB,EAGxB,iBAAiB,EACjB,cAAc,EACf,MAAM,cAAc,CAAC;AAEtB,oBAAY,aAAa,CAAC,CAAC,GAAG,OAAO,IAAI,cAAc,CAAC,CAAC,CAAC,GAAG;IAC3D,cAAc,EAAE,MAAM,CAAC;IACvB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACvC,SAAS,EAAE,MAAM,EAAE,CAAC;CACrB,CAAC;AAEF,oBAAY,cAAc,CAAC,CAAC,GAAG,OAAO,IAAI,eAAe,CAAC,CAAC,CAAC,GAAG;IAC7D,iBAAiB,CAAC,IAAI,EAAE;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IAChD,sBAAsB,CAAC,IAAI,EAAE;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACpD,YAAY,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACtD,eAAe,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IAC1C,YAAY,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACvC,eAAe,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;CAC3C,CAAC;AAEF,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,cAAc,CAAC,CAAC,CAAC;IACnE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IACxB,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmB3B,CAAC;AAEH,oBAAY,uBAAuB,CAAC,CAAC,IAAI,wBAAwB,CAAC,CAAC,CAAC,GAAG;IACrE,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,oBAAY,mBAAmB,CAAC,CAAC,IAAI,uBAAuB,CAAC,CAAC,CAAC,GAC7D,OAAO,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,EAAE,OAAO,iBAAiB,CAAC,CAAC,CAAC;AAExF,wBAAgB,YAAY,CAC1B,cAAc,EAAE,MAAM,EACtB,mBAAmB,EAAE,MAAM,EAC3B,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACtC,WAAW,EAAE,MAAM,EAAE,GAAG,KAAK,GAC5B,MAAM,EAAE,CAwCV;AAED,eAAO,MAAM,gBAAgB,0EAgG5B,CAAC"}
package/dist/commonjs/tabs/lib/overflow/useOverflowModel.js CHANGED
@@ -46,6 +46,9 @@ function getHiddenIds(containerWidth, overflowTargetWidth, itemWidthCache, selec
46
46
  itemWidth += itemWidthCache[selectedKey] + overflowTargetWidth;
47
47
  }
48
48
  }
49
+ else {
50
+ itemWidth += overflowTargetWidth;
51
+ }
49
52
  for (var key in itemWidthCache) {
50
53
  if (key !== selectedKey) {
51
54
  itemWidth += itemWidthCache[key];
@@ -97,6 +100,8 @@ exports.useOverflowModel = function (config) {
97
100
  var id = _a.id, width = _a.width;
98
101
  itemWidthCacheRef.current = __assign(__assign({}, itemWidthCacheRef.current), (_b = {}, _b[id] = width, _b));
99
102
  setItemWidthCache(itemWidthCacheRef.current);
103
+ var ids = getHiddenIds(containerWidthRef.current, overflowTargetWidthRef.current, itemWidthCacheRef.current, state.selectedIds);
104
+ setHiddenIds(ids);
100
105
  },
101
106
  removeItemWidth: function (_a) {
102
107
  var id = _a.id;
@@ -104,6 +109,10 @@ exports.useOverflowModel = function (config) {
104
109
  delete newCache[id];
105
110
  itemWidthCacheRef.current = newCache;
106
111
  setItemWidthCache(itemWidthCacheRef.current);
112
+ var ids = getHiddenIds(containerWidthRef.current, overflowTargetWidthRef.current, itemWidthCacheRef.current, state.selectedIds !== 'all'
113
+ ? state.selectedIds.filter(function (sId) { return id !== sId; })
114
+ : state.selectedIds);
115
+ setHiddenIds(ids);
107
116
  },
108
117
  addHiddenKey: function (_a) {
109
118
  var id = _a.id;
package/dist/es6/button/lib/IconButton.d.ts CHANGED
@@ -3,9 +3,12 @@ import { Themeable } from '@workday/canvas-kit-react/common';
3
3
  import { CanvasSystemIcon } from '@workday/design-assets-types';
4
4
  export interface IconButtonProps extends Themeable {
5
5
  /**
6
- * The accessibility label to indicate the action triggered by clicking the IconButton.
6
+ * The accessibility label to indicate the action triggered by clicking the IconButton. This is optional because there are
7
+ * instances where an Icon Button might already have an `aria-labelledby`. In a case where an `aria-labelledby` is provided
8
+ * it will take precedence over the `aria-label` as explained here: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute
9
+ * We highly encourage consumers to either provide an `aria-label` OR an `aria-labelledby`
7
10
  */
8
- 'aria-label': string;
11
+ 'aria-label'?: string;
9
12
  /**
10
13
  * The type of the IconButton.
11
14
  * @default 'circle'
package/dist/es6/button/lib/IconButton.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAGL,SAAS,EAGV,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAI9D,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EACJ,QAAQ,GACR,cAAc,GACd,OAAO,GACP,QAAQ,GACR,cAAc,GACd,SAAS,GACT,eAAe,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,CAAC;IACxD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,UAAU,oEA8DrB,CAAC"}
1
+ {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../button/lib/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAGL,SAAS,EAGV,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAI9D,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,OAAO,CAAC,EACJ,QAAQ,GACR,cAAc,GACd,OAAO,GACP,QAAQ,GACR,cAAc,GACd,SAAS,GACT,eAAe,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,CAAC;IACxD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,UAAU,oEA8DrB,CAAC"}
package/dist/es6/tabs/lib/menu/MenuList.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/menu/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAIL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,KAAK,EAAC,MAAM,uCAAuC,CAAC;AAE5D,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,OAAO,CAAC,YAAY,CAAC,OAAO,KAAK,EAAE,KAAK,CAAC,CAAC;IAC5F;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,2EAwBnB,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;OAKtB,CAAC"}
1
+ {"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/menu/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAIL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,KAAK,EAAC,MAAM,uCAAuC,CAAC;AAE5D,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,OAAO,CAAC,YAAY,CAAC,OAAO,KAAK,EAAE,KAAK,CAAC,CAAC;IAC5F;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,2EAuBnB,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;OAKtB,CAAC"}
package/dist/es6/tabs/lib/menu/MenuList.js CHANGED
@@ -32,7 +32,7 @@ export var MenuList = createComponent('div')({
32
32
  var model = _a.model, children = _a.children, elemProps = __rest(_a, ["model", "children"]);
33
33
  var localModel = useModelContext(MenuModelContext, model);
34
34
  var props = useMenuList(localModel, elemProps, ref);
35
- return (React.createElement(Stack, __assign({ as: Element, background: commonColors.background, borderRadius: "m", padding: "zero", marginY: "zero", marginX: "xxs", spacing: "zero", overflowY: "auto", flexDirection: localModel.state.orientation === 'vertical' ? 'column' : 'row' }, props), useRenderItems(localModel, children)));
35
+ return (React.createElement(Stack, __assign({ as: Element, background: commonColors.background, borderRadius: "zero", padding: "zero", marginY: "xxs", spacing: "zero", overflowY: "auto", flexDirection: localModel.state.orientation === 'vertical' ? 'column' : 'row' }, props), useRenderItems(localModel, children)));
36
36
  },
37
37
  });
38
38
  export var useMenuList = createHook(function (model) {
package/dist/es6/tabs/lib/overflow/useOverflowModel.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useOverflowModel.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/overflow/useOverflowModel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAiB,aAAa,EAAc,MAAM,kCAAkC,CAAC;AAC5F,OAAO,EACL,cAAc,EACd,eAAe,EACf,wBAAwB,EAGxB,iBAAiB,EACjB,cAAc,EACf,MAAM,cAAc,CAAC;AAEtB,oBAAY,aAAa,CAAC,CAAC,GAAG,OAAO,IAAI,cAAc,CAAC,CAAC,CAAC,GAAG;IAC3D,cAAc,EAAE,MAAM,CAAC;IACvB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACvC,SAAS,EAAE,MAAM,EAAE,CAAC;CACrB,CAAC;AAEF,oBAAY,cAAc,CAAC,CAAC,GAAG,OAAO,IAAI,eAAe,CAAC,CAAC,CAAC,GAAG;IAC7D,iBAAiB,CAAC,IAAI,EAAE;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IAChD,sBAAsB,CAAC,IAAI,EAAE;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACpD,YAAY,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACtD,eAAe,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IAC1C,YAAY,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACvC,eAAe,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;CAC3C,CAAC;AAEF,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,cAAc,CAAC,CAAC,CAAC;IACnE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IACxB,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmB3B,CAAC;AAEH,oBAAY,uBAAuB,CAAC,CAAC,IAAI,wBAAwB,CAAC,CAAC,CAAC,GAAG;IACrE,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,oBAAY,mBAAmB,CAAC,CAAC,IAAI,uBAAuB,CAAC,CAAC,CAAC,GAC7D,OAAO,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,EAAE,OAAO,iBAAiB,CAAC,CAAC,CAAC;AAExF,wBAAgB,YAAY,CAC1B,cAAc,EAAE,MAAM,EACtB,mBAAmB,EAAE,MAAM,EAC3B,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACtC,WAAW,EAAE,MAAM,EAAE,GAAG,KAAK,GAC5B,MAAM,EAAE,CAsCV;AAED,eAAO,MAAM,gBAAgB,0EA4E5B,CAAC"}
1
+ {"version":3,"file":"useOverflowModel.d.ts","sourceRoot":"","sources":["../../../../../tabs/lib/overflow/useOverflowModel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAiB,aAAa,EAAc,MAAM,kCAAkC,CAAC;AAC5F,OAAO,EACL,cAAc,EACd,eAAe,EACf,wBAAwB,EAGxB,iBAAiB,EACjB,cAAc,EACf,MAAM,cAAc,CAAC;AAEtB,oBAAY,aAAa,CAAC,CAAC,GAAG,OAAO,IAAI,cAAc,CAAC,CAAC,CAAC,GAAG;IAC3D,cAAc,EAAE,MAAM,CAAC;IACvB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACvC,SAAS,EAAE,MAAM,EAAE,CAAC;CACrB,CAAC;AAEF,oBAAY,cAAc,CAAC,CAAC,GAAG,OAAO,IAAI,eAAe,CAAC,CAAC,CAAC,GAAG;IAC7D,iBAAiB,CAAC,IAAI,EAAE;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IAChD,sBAAsB,CAAC,IAAI,EAAE;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACpD,YAAY,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACtD,eAAe,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IAC1C,YAAY,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IACvC,eAAe,CAAC,IAAI,EAAE;QAAC,EAAE,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;CAC3C,CAAC;AAEF,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,cAAc,CAAC,CAAC,CAAC;IACnE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IACxB,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmB3B,CAAC;AAEH,oBAAY,uBAAuB,CAAC,CAAC,IAAI,wBAAwB,CAAC,CAAC,CAAC,GAAG;IACrE,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,oBAAY,mBAAmB,CAAC,CAAC,IAAI,uBAAuB,CAAC,CAAC,CAAC,GAC7D,OAAO,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,EAAE,OAAO,iBAAiB,CAAC,CAAC,CAAC;AAExF,wBAAgB,YAAY,CAC1B,cAAc,EAAE,MAAM,EACtB,mBAAmB,EAAE,MAAM,EAC3B,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACtC,WAAW,EAAE,MAAM,EAAE,GAAG,KAAK,GAC5B,MAAM,EAAE,CAwCV;AAED,eAAO,MAAM,gBAAgB,0EAgG5B,CAAC"}
package/dist/es6/tabs/lib/overflow/useOverflowModel.js CHANGED
@@ -41,6 +41,9 @@ export function getHiddenIds(containerWidth, overflowTargetWidth, itemWidthCache
41
41
  itemWidth += itemWidthCache[selectedKey] + overflowTargetWidth;
42
42
  }
43
43
  }
44
+ else {
45
+ itemWidth += overflowTargetWidth;
46
+ }
44
47
  for (var key in itemWidthCache) {
45
48
  if (key !== selectedKey) {
46
49
  itemWidth += itemWidthCache[key];
@@ -91,6 +94,8 @@ export var useOverflowModel = function (config) {
91
94
  var id = _a.id, width = _a.width;
92
95
  itemWidthCacheRef.current = __assign(__assign({}, itemWidthCacheRef.current), (_b = {}, _b[id] = width, _b));
93
96
  setItemWidthCache(itemWidthCacheRef.current);
97
+ var ids = getHiddenIds(containerWidthRef.current, overflowTargetWidthRef.current, itemWidthCacheRef.current, state.selectedIds);
98
+ setHiddenIds(ids);
94
99
  },
95
100
  removeItemWidth: function (_a) {
96
101
  var id = _a.id;
@@ -98,6 +103,10 @@ export var useOverflowModel = function (config) {
98
103
  delete newCache[id];
99
104
  itemWidthCacheRef.current = newCache;
100
105
  setItemWidthCache(itemWidthCacheRef.current);
106
+ var ids = getHiddenIds(containerWidthRef.current, overflowTargetWidthRef.current, itemWidthCacheRef.current, state.selectedIds !== 'all'
107
+ ? state.selectedIds.filter(function (sId) { return id !== sId; })
108
+ : state.selectedIds);
109
+ setHiddenIds(ids);
101
110
  },
102
111
  addHiddenKey: function (_a) {
103
112
  var id = _a.id;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@workday/canvas-kit-react",
3
- "version": "6.0.0-alpha.0-next.37+4f33e928",
3
+ "version": "6.0.0-alpha.0-next.39+ac7c09b9",
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",
@@ -57,9 +57,9 @@
57
57
  "@emotion/styled": "^10.0.27",
58
58
  "@popperjs/core": "^2.5.4",
59
59
  "@workday/canvas-colors-web": "^2.0.0",
60
- "@workday/canvas-kit-labs-react": "^6.0.0-alpha.0-next.37+4f33e928",
61
- "@workday/canvas-kit-popup-stack": "^6.0.0-alpha.0-next.37+4f33e928",
62
- "@workday/canvas-kit-preview-react": "^6.0.0-alpha.0-next.37+4f33e928",
60
+ "@workday/canvas-kit-labs-react": "^6.0.0-alpha.0-next.39+ac7c09b9",
61
+ "@workday/canvas-kit-popup-stack": "^6.0.0-alpha.0-next.39+ac7c09b9",
62
+ "@workday/canvas-kit-preview-react": "^6.0.0-alpha.0-next.39+ac7c09b9",
63
63
  "@workday/canvas-system-icons-web": "1.0.41",
64
64
  "@workday/design-assets-types": "^0.2.4",
65
65
  "chroma-js": "^2.1.0",
@@ -77,5 +77,5 @@
77
77
  "@workday/canvas-accent-icons-web": "^1.0.0",
78
78
  "@workday/canvas-applet-icons-web": "^0.17.50"
79
79
  },
80
- "gitHead": "4f33e928c2e93b179997eaf8c9c6b40b87c10580"
80
+ "gitHead": "ac7c09b97add635f256ffc4103478fab55da55c2"
81
81
  }
package/tabs/lib/menu/MenuList.tsx CHANGED
@@ -36,10 +36,9 @@ export const MenuList = createComponent('div')({
36
36
  <Stack
37
37
  as={Element}
38
38
  background={commonColors.background}
39
- borderRadius="m"
39
+ borderRadius="zero"
40
40
  padding="zero"
41
- marginY="zero"
42
- marginX="xxs"
41
+ marginY="xxs"
43
42
  spacing="zero"
44
43
  overflowY="auto"
45
44
  flexDirection={localModel.state.orientation === 'vertical' ? 'column' : 'row'}
package/tabs/lib/overflow/useOverflowModel.tsx CHANGED
@@ -92,6 +92,8 @@ export function getHiddenIds(
92
92
  // at least the selected item and overflow target fit. Update our itemWidth with the sum
93
93
  itemWidth += itemWidthCache[selectedKey] + overflowTargetWidth;
94
94
  }
95
+ } else {
96
+ itemWidth += overflowTargetWidth;
95
97
  }
96
98
 
97
99
  for (const key in itemWidthCache) {
@@ -166,12 +168,32 @@ export const useOverflowModel = <T extends unknown>(
166
168
  itemWidthCacheRef.current = {...itemWidthCacheRef.current, [id]: width};
167
169
 
168
170
  setItemWidthCache(itemWidthCacheRef.current);
171
+
172
+ const ids = getHiddenIds(
173
+ containerWidthRef.current,
174
+ overflowTargetWidthRef.current,
175
+ itemWidthCacheRef.current,
176
+ state.selectedIds
177
+ );
178
+
179
+ setHiddenIds(ids);
169
180
  },
170
181
  removeItemWidth({id}) {
171
182
  const newCache = {...itemWidthCacheRef.current};
172
183
  delete newCache[id];
173
184
  itemWidthCacheRef.current = newCache;
174
185
  setItemWidthCache(itemWidthCacheRef.current);
186
+
187
+ const ids = getHiddenIds(
188
+ containerWidthRef.current,
189
+ overflowTargetWidthRef.current,
190
+ itemWidthCacheRef.current,
191
+ state.selectedIds !== 'all'
192
+ ? state.selectedIds.filter(sId => id !== sId)
193
+ : state.selectedIds
194
+ );
195
+
196
+ setHiddenIds(ids);
175
197
  },
176
198
  addHiddenKey({id}) {
177
199
  setHiddenIds(ids => ids.concat(id));
package/ts3.5/dist/commonjs/button/lib/IconButton.d.ts CHANGED
@@ -3,9 +3,12 @@ import { Themeable } from '@workday/canvas-kit-react/common';
3
3
  import { CanvasSystemIcon } from '@workday/design-assets-types';
4
4
  export interface IconButtonProps extends Themeable {
5
5
  /**
6
- * The accessibility label to indicate the action triggered by clicking the IconButton.
6
+ * The accessibility label to indicate the action triggered by clicking the IconButton. This is optional because there are
7
+ * instances where an Icon Button might already have an `aria-labelledby`. In a case where an `aria-labelledby` is provided
8
+ * it will take precedence over the `aria-label` as explained here: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute
9
+ * We highly encourage consumers to either provide an `aria-label` OR an `aria-labelledby`
7
10
  */
8
- 'aria-label': string;
11
+ 'aria-label'?: string;
9
12
  /**
10
13
  * The type of the IconButton.
11
14
  * @default 'circle'
package/ts3.5/dist/es6/button/lib/IconButton.d.ts CHANGED
@@ -3,9 +3,12 @@ import { Themeable } from '@workday/canvas-kit-react/common';
3
3
  import { CanvasSystemIcon } from '@workday/design-assets-types';
4
4
  export interface IconButtonProps extends Themeable {
5
5
  /**
6
- * The accessibility label to indicate the action triggered by clicking the IconButton.
6
+ * The accessibility label to indicate the action triggered by clicking the IconButton. This is optional because there are
7
+ * instances where an Icon Button might already have an `aria-labelledby`. In a case where an `aria-labelledby` is provided
8
+ * it will take precedence over the `aria-label` as explained here: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute
9
+ * We highly encourage consumers to either provide an `aria-label` OR an `aria-labelledby`
7
10
  */
8
- 'aria-label': string;
11
+ 'aria-label'?: string;
9
12
  /**
10
13
  * The type of the IconButton.
11
14
  * @default 'circle'