@workday/canvas-kit-preview-react 8.0.0-alpha.236-next.7 → 8.0.0-alpha.237-next.8

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 (53) hide show
  1. package/dist/commonjs/index.d.ts +1 -0
  2. package/dist/commonjs/index.d.ts.map +1 -1
  3. package/dist/commonjs/index.js +1 -0
  4. package/dist/commonjs/segmented-control/index.d.ts +3 -0
  5. package/dist/commonjs/segmented-control/index.d.ts.map +1 -0
  6. package/dist/commonjs/segmented-control/index.js +14 -0
  7. package/dist/commonjs/segmented-control/lib/SegmentedControl.d.ts +1562 -0
  8. package/dist/commonjs/segmented-control/lib/SegmentedControl.d.ts.map +1 -0
  9. package/dist/commonjs/segmented-control/lib/SegmentedControl.js +22 -0
  10. package/dist/commonjs/segmented-control/lib/SegmentedControlItem.d.ts +126 -0
  11. package/dist/commonjs/segmented-control/lib/SegmentedControlItem.d.ts.map +1 -0
  12. package/dist/commonjs/segmented-control/lib/SegmentedControlItem.js +130 -0
  13. package/dist/commonjs/segmented-control/lib/SegmentedControlList.d.ts +89 -0
  14. package/dist/commonjs/segmented-control/lib/SegmentedControlList.d.ts.map +1 -0
  15. package/dist/commonjs/segmented-control/lib/SegmentedControlList.js +64 -0
  16. package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlItem.d.ts +60 -0
  17. package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlItem.d.ts.map +1 -0
  18. package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlItem.js +44 -0
  19. package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlModel.d.ts +1613 -0
  20. package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlModel.d.ts.map +1 -0
  21. package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlModel.js +74 -0
  22. package/dist/es6/index.d.ts +1 -0
  23. package/dist/es6/index.d.ts.map +1 -1
  24. package/dist/es6/index.js +1 -0
  25. package/dist/es6/segmented-control/index.d.ts +3 -0
  26. package/dist/es6/segmented-control/index.d.ts.map +1 -0
  27. package/dist/es6/segmented-control/index.js +2 -0
  28. package/dist/es6/segmented-control/lib/SegmentedControl.d.ts +1562 -0
  29. package/dist/es6/segmented-control/lib/SegmentedControl.d.ts.map +1 -0
  30. package/dist/es6/segmented-control/lib/SegmentedControl.js +16 -0
  31. package/dist/es6/segmented-control/lib/SegmentedControlItem.d.ts +126 -0
  32. package/dist/es6/segmented-control/lib/SegmentedControlItem.d.ts.map +1 -0
  33. package/dist/es6/segmented-control/lib/SegmentedControlItem.js +108 -0
  34. package/dist/es6/segmented-control/lib/SegmentedControlList.d.ts +89 -0
  35. package/dist/es6/segmented-control/lib/SegmentedControlList.d.ts.map +1 -0
  36. package/dist/es6/segmented-control/lib/SegmentedControlList.js +42 -0
  37. package/dist/es6/segmented-control/lib/hooks/useSegmentedControlItem.d.ts +60 -0
  38. package/dist/es6/segmented-control/lib/hooks/useSegmentedControlItem.d.ts.map +1 -0
  39. package/dist/es6/segmented-control/lib/hooks/useSegmentedControlItem.js +41 -0
  40. package/dist/es6/segmented-control/lib/hooks/useSegmentedControlModel.d.ts +1613 -0
  41. package/dist/es6/segmented-control/lib/hooks/useSegmentedControlModel.d.ts.map +1 -0
  42. package/dist/es6/segmented-control/lib/hooks/useSegmentedControlModel.js +68 -0
  43. package/index.ts +1 -0
  44. package/package.json +4 -4
  45. package/segmented-control/LICENSE +126 -0
  46. package/segmented-control/README.md +6 -0
  47. package/segmented-control/index.ts +2 -0
  48. package/segmented-control/lib/SegmentedControl.tsx +21 -0
  49. package/segmented-control/lib/SegmentedControlItem.tsx +175 -0
  50. package/segmented-control/lib/SegmentedControlList.tsx +48 -0
  51. package/segmented-control/lib/hooks/useSegmentedControlItem.tsx +74 -0
  52. package/segmented-control/lib/hooks/useSegmentedControlModel.tsx +81 -0
  53. package/segmented-control/package.json +6 -0
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../../segmented-control/lib/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAS3B,CAAC"}
@@ -0,0 +1,16 @@
1
+ import React from 'react';
2
+ import { createContainer } from '@workday/canvas-kit-react/common';
3
+ import { useSegmentedControlModel } from './hooks/useSegmentedControlModel';
4
+ import { SegmentedControlList } from './SegmentedControlList';
5
+ import { SegmentedControlItem } from './SegmentedControlItem';
6
+ export var SegmentedControl = createContainer()({
7
+ displayName: 'SegmentedControl',
8
+ modelHook: useSegmentedControlModel,
9
+ subComponents: {
10
+ List: SegmentedControlList,
11
+ Item: SegmentedControlItem,
12
+ },
13
+ })(function (_a) {
14
+ var children = _a.children;
15
+ return React.createElement(React.Fragment, null, children);
16
+ });
@@ -0,0 +1,126 @@
1
+ import * as React from 'react';
2
+ import { TooltipProps } from '@workday/canvas-kit-react/tooltip';
3
+ import { ButtonContainerProps } from '@workday/canvas-kit-react/button';
4
+ import { CanvasSystemIcon } from '@workday/design-assets-types';
5
+ export interface ItemProps extends ButtonContainerProps {
6
+ /**
7
+ * Optionally pass index to the item. This should be done if `SegmentedControl.Item` components were created
8
+ * via a `[Array::map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)` function. This index will ensure keyboard navigation works even if items are
9
+ * inserted out of order.
10
+ */
11
+ index?: number;
12
+ /**
13
+ * The contents of the item. This is text used as the accessible name of the button for screen readers.
14
+ */
15
+ children?: React.ReactNode;
16
+ /**
17
+ * The identifier of the item. This identifier will be used in change events and for `initialTab`.
18
+ * If this property is not provided, it will default to a string representation
19
+ * of the the zero-based index of the item when it was initialized.
20
+ */
21
+ 'data-id'?: string;
22
+ /**
23
+ * Optional id. If not set, it will inherit the ID passed to the `SegmentedControl` component and append the
24
+ * index at the end. Only set this for advanced cases.
25
+ */
26
+ id?: string;
27
+ /**
28
+ * Part of the ARIA specification for buttons. Lets screen readers know which button is active. This
29
+ * should either be `true` or `false`. This is automatically set by the
30
+ * component and should only be used in advanced cases.
31
+ */
32
+ 'aria-pressed'?: boolean;
33
+ /**
34
+ * The icon of the button.
35
+ */
36
+ icon?: CanvasSystemIcon;
37
+ /**
38
+ * Tooltip Props
39
+ */
40
+ tooltipProps?: Omit<TooltipProps, 'children'>;
41
+ }
42
+ export declare const SegmentedControlItem: import("@workday/canvas-kit-react/common").ElementComponentM<"button", ItemProps, {
43
+ state: {
44
+ disabled: boolean;
45
+ size: "small" | "medium" | "large";
46
+ nonInteractiveIds: never[];
47
+ hiddenIds: never[];
48
+ itemWidthCache: Record<string, number>;
49
+ containerWidth: number;
50
+ overflowTargetWidth: number;
51
+ selectedIds: import("@workday/canvas-kit-react/collection/lib/useSelectionListModel").SelectedIds;
52
+ unselectedIds: string[];
53
+ cursorId: string;
54
+ columnCount: number;
55
+ UNSTABLE_virtual: {
56
+ virtualItems: import("@workday/canvas-kit-react/collection/lib/react-virtual").VirtualItem[];
57
+ totalSize: number; /**
58
+ * Optional id. If not set, it will inherit the ID passed to the `SegmentedControl` component and append the
59
+ * index at the end. Only set this for advanced cases.
60
+ */
61
+ scrollToOffset: (index: number, options?: import("@workday/canvas-kit-react/collection/lib/react-virtual").ScrollToOffsetOptions | undefined) => void;
62
+ scrollToIndex: (index: number, options?: import("@workday/canvas-kit-react/collection/lib/react-virtual").ScrollToIndexOptions | undefined) => void;
63
+ measure: () => void;
64
+ };
65
+ UNSTABLE_defaultItemHeight: number;
66
+ containerRef: React.RefObject<HTMLDivElement>;
67
+ id: string;
68
+ orientation: "horizontal" | "vertical";
69
+ indexRef: React.MutableRefObject<number>;
70
+ isVirtualized: boolean;
71
+ items: import("@workday/canvas-kit-react/collection").Item<any>[];
72
+ };
73
+ events: {
74
+ select(data: {
75
+ id: string;
76
+ }): void;
77
+ setContainerWidth(data: {
78
+ width?: number | undefined;
79
+ }): void;
80
+ setOverflowTargetWidth(data: {
81
+ width: number;
82
+ }): void;
83
+ addItemWidth(data: {
84
+ id: string;
85
+ width: number;
86
+ }): void;
87
+ removeItemWidth(data: {
88
+ id: string;
89
+ }): void;
90
+ addHiddenKey(data: {
91
+ id: string;
92
+ }): void;
93
+ removeHiddenKey(data: {
94
+ id: string;
95
+ }): void;
96
+ selectAll(): void;
97
+ unselectAll(): void;
98
+ registerItem(data: {
99
+ item: any;
100
+ textValue: string;
101
+ }): void;
102
+ goTo(data: {
103
+ id: string;
104
+ }): void;
105
+ goToNext(): void;
106
+ goToPrevious(): void;
107
+ goToPreviousRow(): void;
108
+ goToNextRow(): void;
109
+ goToFirst(): void;
110
+ goToLast(): void;
111
+ goToFirstOfRow(): void;
112
+ goToLastOfRow(): void;
113
+ goToNextPage(): void;
114
+ goToPreviousPage(): void;
115
+ unregisterItem(data: {
116
+ id: string;
117
+ }): void;
118
+ updateItemHeight(data: {
119
+ value: number;
120
+ }): void;
121
+ };
122
+ selection: import("@workday/canvas-kit-react/collection/lib/useSelectionListModel").SelectionManager;
123
+ navigation: import("@workday/canvas-kit-react/collection/lib/useCursorListModel").NavigationManager;
124
+ getId: (item: any) => string;
125
+ }>;
126
+ //# sourceMappingURL=SegmentedControlItem.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SegmentedControlItem.d.ts","sourceRoot":"","sources":["../../../../segmented-control/lib/SegmentedControlItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAU,YAAY,EAAC,MAAM,mCAAmC,CAAC;AACxE,OAAO,EAEL,oBAAoB,EAIrB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAK9D,MAAM,WAAW,SAAU,SAAQ,oBAAoB;IACrD;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC;CAC/C;AA0FD,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;+BA7G/B;;;eAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyIH,CAAC"}
@@ -0,0 +1,108 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ var __rest = (this && this.__rest) || function (s, e) {
13
+ var t = {};
14
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
+ t[p] = s[p];
16
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
+ t[p[i]] = s[p[i]];
20
+ }
21
+ return t;
22
+ };
23
+ import * as React from 'react';
24
+ import { colors, type, space } from '@workday/canvas-kit-react/tokens';
25
+ import { createSubcomponent, useIsRTL } from '@workday/canvas-kit-react/common';
26
+ import { Tooltip } from '@workday/canvas-kit-react/tooltip';
27
+ import { BaseButton, getMinWidthStyles, } from '@workday/canvas-kit-react/button';
28
+ import { useSegmentedControlModel } from './hooks/useSegmentedControlModel';
29
+ import { Text } from '@workday/canvas-kit-react/text';
30
+ import { useSegmentedControlItem } from './hooks/useSegmentedControlItem';
31
+ var getButtonSize = function (size) {
32
+ switch (size) {
33
+ case 'large':
34
+ return 'medium';
35
+ case 'medium':
36
+ return 'small';
37
+ case 'small':
38
+ return 'extraSmall';
39
+ default:
40
+ return 'medium';
41
+ }
42
+ };
43
+ var getIconButtonColors = function (toggled) {
44
+ return {
45
+ default: {
46
+ background: toggled ? colors.frenchVanilla100 : colors.soap200,
47
+ border: toggled ? colors.licorice200 : 'transparent',
48
+ icon: toggled ? colors.blackPepper400 : colors.licorice400,
49
+ label: toggled ? colors.blackPepper400 : colors.licorice400,
50
+ },
51
+ hover: {
52
+ background: toggled ? colors.frenchVanilla100 : colors.soap400,
53
+ icon: colors.licorice400,
54
+ label: colors.licorice400,
55
+ },
56
+ active: {
57
+ background: toggled ? colors.frenchVanilla100 : colors.soap400,
58
+ icon: colors.licorice400,
59
+ label: colors.licorice400,
60
+ },
61
+ focus: {},
62
+ disabled: {
63
+ background: colors.soap200,
64
+ opacity: '1',
65
+ },
66
+ };
67
+ };
68
+ var getPaddingStyles = function (children, size, icon) {
69
+ if (!children) {
70
+ return 0;
71
+ }
72
+ switch (size) {
73
+ case 'large':
74
+ return icon ? "0 " + space.m + " 0 20px" : "0 " + space.m;
75
+ case 'medium':
76
+ return icon ? "0 20px 0 " + space.s : "0 " + space.s;
77
+ case 'small':
78
+ return icon ? "0 " + space.xs + " 0 " + space.xxs : "0 " + space.xs;
79
+ default:
80
+ return icon ? "0 20px 0 " + space.s : "0 " + space.s;
81
+ }
82
+ };
83
+ var geButtonStyles = function (size, children, icon) {
84
+ var buttonSize = getButtonSize(size);
85
+ var minWidthValue = getMinWidthStyles(children, children ? size : buttonSize);
86
+ return {
87
+ height: getMinWidthStyles(false, buttonSize),
88
+ minWidth: minWidthValue,
89
+ padding: getPaddingStyles(children, size, icon),
90
+ };
91
+ };
92
+ var Container = function (_a) {
93
+ var tooltipProps = _a.tooltipProps, children = _a.children;
94
+ return tooltipProps ? (React.createElement(Tooltip, __assign({}, tooltipProps), children)) : (React.createElement(React.Fragment, null, children));
95
+ };
96
+ export var SegmentedControlItem = createSubcomponent('button')({
97
+ displayName: 'SegmentedControl.Item',
98
+ modelHook: useSegmentedControlModel,
99
+ elemPropsHook: useSegmentedControlItem,
100
+ })(function (_a, Element, _b) {
101
+ var size = _b.state.size;
102
+ var children = _a.children, icon = _a.icon, tooltipProps = _a.tooltipProps, elemProps = __rest(_a, ["children", "icon", "tooltipProps"]);
103
+ var _c = type.levels.subtext[size === 'small' ? 'medium' : 'large'], color = _c.color, textStyles = __rest(_c, ["color"]);
104
+ return (React.createElement(Container, { tooltipProps: tooltipProps },
105
+ React.createElement(BaseButton, __assign({ as: Element, borderRadius: "m", colors: getIconButtonColors(elemProps['aria-pressed']) }, geButtonStyles(size, children, icon), elemProps),
106
+ icon && (React.createElement(BaseButton.Icon, { size: size === 'small' ? 'extraSmall' : 'medium', icon: icon, shouldMirrorIcon: useIsRTL() })),
107
+ children && (React.createElement(Text, __assign({}, textStyles, { fontWeight: "bold", textAlign: "left" }), children)))));
108
+ });
@@ -0,0 +1,89 @@
1
+ import * as React from 'react';
2
+ import { ExtractProps } from '@workday/canvas-kit-react/common';
3
+ import { Stack } from '@workday/canvas-kit-react/layout';
4
+ export interface SegmentedControlListProps<T = any> extends Omit<Partial<ExtractProps<typeof Stack, never>>, 'children'> {
5
+ 'aria-label': string;
6
+ children: ((item: T) => React.ReactNode) | React.ReactNode;
7
+ }
8
+ export declare const SegmentedControlList: import("@workday/canvas-kit-react/common").ElementComponentM<"div", SegmentedControlListProps<any>, {
9
+ state: {
10
+ disabled: boolean;
11
+ size: "small" | "medium" | "large";
12
+ nonInteractiveIds: never[];
13
+ hiddenIds: never[];
14
+ itemWidthCache: Record<string, number>;
15
+ containerWidth: number;
16
+ overflowTargetWidth: number;
17
+ selectedIds: import("@workday/canvas-kit-react/collection/lib/useSelectionListModel").SelectedIds;
18
+ unselectedIds: string[];
19
+ cursorId: string;
20
+ columnCount: number;
21
+ UNSTABLE_virtual: {
22
+ virtualItems: import("@workday/canvas-kit-react/collection/lib/react-virtual").VirtualItem[];
23
+ totalSize: number;
24
+ scrollToOffset: (index: number, options?: import("@workday/canvas-kit-react/collection/lib/react-virtual").ScrollToOffsetOptions | undefined) => void;
25
+ scrollToIndex: (index: number, options?: import("@workday/canvas-kit-react/collection/lib/react-virtual").ScrollToIndexOptions | undefined) => void;
26
+ measure: () => void;
27
+ };
28
+ UNSTABLE_defaultItemHeight: number;
29
+ containerRef: React.RefObject<HTMLDivElement>;
30
+ id: string;
31
+ orientation: "horizontal" | "vertical";
32
+ indexRef: React.MutableRefObject<number>;
33
+ isVirtualized: boolean;
34
+ items: import("@workday/canvas-kit-react/collection").Item<any>[];
35
+ };
36
+ events: {
37
+ select(data: {
38
+ id: string;
39
+ }): void;
40
+ setContainerWidth(data: {
41
+ width?: number | undefined;
42
+ }): void;
43
+ setOverflowTargetWidth(data: {
44
+ width: number;
45
+ }): void;
46
+ addItemWidth(data: {
47
+ id: string;
48
+ width: number;
49
+ }): void;
50
+ removeItemWidth(data: {
51
+ id: string;
52
+ }): void;
53
+ addHiddenKey(data: {
54
+ id: string;
55
+ }): void;
56
+ removeHiddenKey(data: {
57
+ id: string;
58
+ }): void;
59
+ selectAll(): void;
60
+ unselectAll(): void;
61
+ registerItem(data: {
62
+ item: any;
63
+ textValue: string;
64
+ }): void;
65
+ goTo(data: {
66
+ id: string;
67
+ }): void;
68
+ goToNext(): void;
69
+ goToPrevious(): void;
70
+ goToPreviousRow(): void;
71
+ goToNextRow(): void;
72
+ goToFirst(): void;
73
+ goToLast(): void;
74
+ goToFirstOfRow(): void;
75
+ goToLastOfRow(): void;
76
+ goToNextPage(): void;
77
+ goToPreviousPage(): void;
78
+ unregisterItem(data: {
79
+ id: string;
80
+ }): void;
81
+ updateItemHeight(data: {
82
+ value: number;
83
+ }): void;
84
+ };
85
+ selection: import("@workday/canvas-kit-react/collection/lib/useSelectionListModel").SelectionManager;
86
+ navigation: import("@workday/canvas-kit-react/collection/lib/useCursorListModel").NavigationManager;
87
+ getId: (item: any) => string;
88
+ }>;
89
+ //# sourceMappingURL=SegmentedControlList.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SegmentedControlList.d.ts","sourceRoot":"","sources":["../../../../segmented-control/lib/SegmentedControlList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAEL,YAAY,EAEb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,KAAK,EAAC,MAAM,kCAAkC,CAAC;AAIvD,MAAM,WAAW,yBAAyB,CAAC,CAAC,GAAG,GAAG,CAChD,SAAQ,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,KAAK,EAAE,KAAK,CAAC,CAAC,EAAE,UAAU,CAAC;IACpE,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;CAC5D;AAWD,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqB/B,CAAC"}
@@ -0,0 +1,42 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ var __rest = (this && this.__rest) || function (s, e) {
13
+ var t = {};
14
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
+ t[p] = s[p];
16
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
+ t[p[i]] = s[p[i]];
20
+ }
21
+ return t;
22
+ };
23
+ import * as React from 'react';
24
+ import { createSubcomponent, createElemPropsHook, } from '@workday/canvas-kit-react/common';
25
+ import { Stack } from '@workday/canvas-kit-react/layout';
26
+ import { useListRenderItems } from '@workday/canvas-kit-react/collection';
27
+ import { useSegmentedControlModel } from './hooks/useSegmentedControlModel';
28
+ var useSegmentedControlList = createElemPropsHook(useSegmentedControlModel)(function (_a) {
29
+ var _b = _a.state, orientation = _b.orientation, disabled = _b.disabled;
30
+ return {
31
+ flexDirection: orientation === 'vertical' ? 'column' : 'row',
32
+ opacity: disabled ? 0.4 : 1,
33
+ };
34
+ });
35
+ export var SegmentedControlList = createSubcomponent('div')({
36
+ displayName: 'SegmentedControl.List',
37
+ modelHook: useSegmentedControlModel,
38
+ elemPropsHook: useSegmentedControlList,
39
+ })(function (_a, Element, model) {
40
+ var children = _a.children, elemProps = __rest(_a, ["children"]);
41
+ return (React.createElement(Stack, __assign({ as: Element, display: "inline-flex", role: "group", backgroundColor: "soap200", border: "1px solid transparent", borderColor: "licorice200", borderRadius: "l", spacing: "xxs", padding: "3px" }, elemProps), useListRenderItems(model, children)));
42
+ });
@@ -0,0 +1,60 @@
1
+ import * as React from 'react';
2
+ export declare const useSegmentedControlItem: <P extends {}, R>(model: {
3
+ state: {
4
+ selectedIds: import("@workday/canvas-kit-react/collection/lib/useSelectionListModel").SelectedIds;
5
+ unselectedIds: string[];
6
+ cursorId: string;
7
+ columnCount: number;
8
+ UNSTABLE_virtual: {
9
+ virtualItems: import("@workday/canvas-kit-react/collection/lib/react-virtual").VirtualItem[];
10
+ totalSize: number;
11
+ scrollToOffset: (index: number, options?: import("@workday/canvas-kit-react/collection/lib/react-virtual").ScrollToOffsetOptions | undefined) => void;
12
+ scrollToIndex: (index: number, options?: import("@workday/canvas-kit-react/collection/lib/react-virtual").ScrollToIndexOptions | undefined) => void;
13
+ measure: () => void;
14
+ };
15
+ UNSTABLE_defaultItemHeight: number;
16
+ containerRef: React.RefObject<HTMLDivElement>;
17
+ id: string;
18
+ orientation: "horizontal" | "vertical";
19
+ indexRef: React.MutableRefObject<number>;
20
+ nonInteractiveIds: string[];
21
+ isVirtualized: boolean;
22
+ items: import("@workday/canvas-kit-react/collection").Item<any>[];
23
+ };
24
+ events: {
25
+ select(data: {
26
+ id: string;
27
+ }): void;
28
+ selectAll(): void;
29
+ unselectAll(): void;
30
+ registerItem(data: {
31
+ item: any;
32
+ textValue: string;
33
+ }): void;
34
+ goTo(data: {
35
+ id: string;
36
+ }): void;
37
+ goToNext(): void;
38
+ goToPrevious(): void;
39
+ goToPreviousRow(): void;
40
+ goToNextRow(): void;
41
+ goToFirst(): void;
42
+ goToLast(): void;
43
+ goToFirstOfRow(): void;
44
+ goToLastOfRow(): void;
45
+ goToNextPage(): void;
46
+ goToPreviousPage(): void;
47
+ unregisterItem(data: {
48
+ id: string;
49
+ }): void;
50
+ updateItemHeight(data: {
51
+ value: number;
52
+ }): void;
53
+ };
54
+ selection: import("@workday/canvas-kit-react/collection/lib/useSelectionListModel").SelectionManager;
55
+ navigation: import("@workday/canvas-kit-react/collection/lib/useCursorListModel").NavigationManager;
56
+ getId: (item: any) => string;
57
+ }, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | React.RefObject<R> | null | undefined) => {} & P & (R extends HTMLOrSVGElement ? {
58
+ ref: React.Ref<R>;
59
+ } : {});
60
+ //# sourceMappingURL=useSegmentedControlItem.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useSegmentedControlItem.d.ts","sourceRoot":"","sources":["../../../../../segmented-control/lib/hooks/useSegmentedControlItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAe/B,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA0DnC,CAAC"}
@@ -0,0 +1,41 @@
1
+ import { createElemPropsHook, composeHooks, useLocalRef, useMountLayout, } from '@workday/canvas-kit-react/common';
2
+ import { useListItemRegister, isSelected, useListItemSelect, } from '@workday/canvas-kit-react/collection';
3
+ import { useSegmentedControlModel } from './useSegmentedControlModel';
4
+ export var useSegmentedControlItem = composeHooks(useListItemSelect, createElemPropsHook(useSegmentedControlModel)(function (model, ref, elemProps) {
5
+ if (elemProps === void 0) { elemProps = {}; }
6
+ var _a = useLocalRef(ref), elementRef = _a.elementRef, localRef = _a.localRef;
7
+ var name = elemProps['data-id'] || '';
8
+ var id = model.state.id + "-" + name;
9
+ useMountLayout(function () {
10
+ if (localRef.current) {
11
+ var styles = getComputedStyle(localRef.current);
12
+ model.events.addItemWidth({
13
+ id: name,
14
+ width: localRef.current.offsetWidth +
15
+ parseFloat(styles.marginLeft) +
16
+ parseFloat(styles.marginRight),
17
+ });
18
+ }
19
+ return function () {
20
+ model.events.removeItemWidth({ id: name });
21
+ };
22
+ });
23
+ var selected = !!name && isSelected(name, model.state);
24
+ var longest = Object.keys(model.state.itemWidthCache)
25
+ .map(function (e) { return model.state.itemWidthCache[e]; })
26
+ .sort(function (a, b) { return (a < b ? 1 : -1); })[0];
27
+ return {
28
+ ref: elementRef,
29
+ id: id,
30
+ 'aria-pressed': selected,
31
+ disabled: model.state.disabled || undefined,
32
+ width: elemProps.children && longest + "px",
33
+ };
34
+ }), useListItemRegister, createElemPropsHook(useSegmentedControlModel)(function (_a, _ref, elemProps) {
35
+ var state = _a.state;
36
+ if (elemProps === void 0) { elemProps = {}; }
37
+ return {
38
+ // override the default disabled functionality of `useListItemRegister`
39
+ disabled: elemProps.disabled || state.disabled ? true : undefined,
40
+ };
41
+ }));