@workday/canvas-kit-react 12.0.0-alpha.906-next.0 → 12.0.0-alpha.908-next.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/collection/index.ts +1 -0
- package/collection/lib/useListItemActiveDescendant.ts +26 -0
- package/combobox/lib/ComboboxMenu.tsx +1 -2
- package/combobox/lib/ComboboxMenuItem.tsx +3 -91
- package/dist/commonjs/action-bar/lib/ActionBar.d.ts +82 -10
- package/dist/commonjs/action-bar/lib/ActionBar.d.ts.map +1 -1
- package/dist/commonjs/avatar/lib/Avatar.js +21 -21
- package/dist/commonjs/badge/lib/CountBadge.js +3 -3
- package/dist/commonjs/breadcrumbs/lib/Breadcrumbs.d.ts +1 -1
- package/dist/commonjs/breadcrumbs/lib/BreadcrumbsMenu.d.ts +2 -2
- package/dist/commonjs/button/lib/BaseButton.js +21 -21
- package/dist/commonjs/button/lib/DeleteButton.js +1 -1
- package/dist/commonjs/button/lib/PrimaryButton.js +2 -2
- package/dist/commonjs/button/lib/SecondaryButton.js +2 -2
- package/dist/commonjs/button/lib/TertiaryButton.js +18 -18
- package/dist/commonjs/card/lib/Card.js +1 -1
- package/dist/commonjs/card/lib/CardBody.js +1 -1
- package/dist/commonjs/card/lib/CardHeading.js +1 -1
- package/dist/commonjs/checkbox/lib/CheckBackground.js +3 -3
- package/dist/commonjs/checkbox/lib/CheckboxCheck.js +5 -5
- package/dist/commonjs/checkbox/lib/CheckboxContainer.js +1 -1
- package/dist/commonjs/checkbox/lib/CheckboxInput.js +5 -5
- package/dist/commonjs/checkbox/lib/CheckboxRipple.js +1 -1
- package/dist/commonjs/collection/index.d.ts +1 -0
- package/dist/commonjs/collection/index.d.ts.map +1 -1
- package/dist/commonjs/collection/index.js +1 -0
- package/dist/commonjs/collection/lib/ListBox.js +4 -4
- package/dist/commonjs/collection/lib/useListItemActiveDescendant.d.ts +69 -0
- package/dist/commonjs/collection/lib/useListItemActiveDescendant.d.ts.map +1 -0
- package/dist/commonjs/collection/lib/useListItemActiveDescendant.js +25 -0
- package/dist/commonjs/combobox/lib/Combobox.d.ts +5 -83
- package/dist/commonjs/combobox/lib/Combobox.d.ts.map +1 -1
- package/dist/commonjs/combobox/lib/ComboboxMenu.d.ts +5 -83
- package/dist/commonjs/combobox/lib/ComboboxMenu.d.ts.map +1 -1
- package/dist/commonjs/combobox/lib/ComboboxMenu.js +1 -2
- package/dist/commonjs/combobox/lib/ComboboxMenuItem.d.ts +18 -260
- package/dist/commonjs/combobox/lib/ComboboxMenuItem.d.ts.map +1 -1
- package/dist/commonjs/combobox/lib/ComboboxMenuItem.js +3 -59
- package/dist/commonjs/combobox/lib/ComboboxMenuList.js +1 -1
- package/dist/commonjs/common/lib/AccessibleHide.js +1 -1
- package/dist/commonjs/common/lib/CanvasProvider.js +1 -1
- package/dist/commonjs/form-field/lib/FormFieldContainer.js +1 -1
- package/dist/commonjs/form-field/lib/FormFieldField.js +1 -1
- package/dist/commonjs/form-field/lib/FormFieldGroupLabel.js +5 -5
- package/dist/commonjs/form-field/lib/FormFieldGroupList.js +3 -3
- package/dist/commonjs/form-field/lib/FormFieldHint.js +3 -3
- package/dist/commonjs/form-field/lib/FormFieldLabel.js +5 -5
- package/dist/commonjs/form-field/lib/formFieldStencil.js +8 -8
- package/dist/commonjs/icon/lib/AccentIcon.js +2 -2
- package/dist/commonjs/icon/lib/AppletIcon.js +1 -1
- package/dist/commonjs/icon/lib/Graphic.js +2 -2
- package/dist/commonjs/icon/lib/Svg.js +2 -2
- package/dist/commonjs/icon/lib/SystemIcon.js +1 -1
- package/dist/commonjs/icon/lib/SystemIconCircle.js +1 -1
- package/dist/commonjs/loading-dots/lib/LoadingDots.js +3 -3
- package/dist/commonjs/menu/index.d.ts +2 -1
- package/dist/commonjs/menu/index.d.ts.map +1 -1
- package/dist/commonjs/menu/index.js +5 -1
- package/dist/commonjs/menu/lib/Menu.d.ts +89 -9
- package/dist/commonjs/menu/lib/Menu.d.ts.map +1 -1
- package/dist/commonjs/menu/lib/Menu.js +10 -0
- package/dist/commonjs/menu/lib/MenuCard.js +1 -1
- package/dist/commonjs/menu/lib/MenuItem.d.ts +12 -19
- package/dist/commonjs/menu/lib/MenuItem.d.ts.map +1 -1
- package/dist/commonjs/menu/lib/MenuItem.js +20 -91
- package/dist/commonjs/menu/lib/MenuList.js +3 -3
- package/dist/commonjs/menu/lib/MenuOption.d.ts +192 -0
- package/dist/commonjs/menu/lib/MenuOption.d.ts.map +1 -0
- package/dist/commonjs/menu/lib/MenuOption.js +89 -0
- package/dist/commonjs/modal/lib/ModalBody.js +1 -1
- package/dist/commonjs/modal/lib/ModalCard.js +1 -1
- package/dist/commonjs/modal/lib/ModalHeading.js +1 -1
- package/dist/commonjs/modal/lib/ModalOverflowOverlay.js +1 -1
- package/dist/commonjs/modal/lib/ModalOverlay.js +2 -2
- package/dist/commonjs/popup/lib/PopupBody.js +1 -1
- package/dist/commonjs/popup/lib/PopupCard.js +2 -2
- package/dist/commonjs/popup/lib/PopupCloseIcon.js +1 -1
- package/dist/commonjs/popup/lib/PopupHeading.js +1 -1
- package/dist/commonjs/select/lib/Select.d.ts +59 -962
- package/dist/commonjs/select/lib/Select.d.ts.map +1 -1
- package/dist/commonjs/select/lib/Select.js +5 -5
- package/dist/commonjs/switch/lib/Switch.js +7 -7
- package/dist/commonjs/table/lib/Table.js +1 -1
- package/dist/commonjs/table/lib/TableBody.js +1 -1
- package/dist/commonjs/table/lib/TableCaption.js +1 -1
- package/dist/commonjs/table/lib/TableCell.js +1 -1
- package/dist/commonjs/table/lib/TableFooter.js +1 -1
- package/dist/commonjs/table/lib/TableHead.js +1 -1
- package/dist/commonjs/table/lib/TableHeader.js +1 -1
- package/dist/commonjs/table/lib/TableRow.js +1 -1
- package/dist/commonjs/tabs/lib/Tabs.d.ts +82 -10
- package/dist/commonjs/tabs/lib/Tabs.d.ts.map +1 -1
- package/dist/commonjs/text/lib/LabelText.js +6 -6
- package/dist/commonjs/text/lib/Text.js +16 -16
- package/dist/commonjs/text/lib/TypeLevelComponents.js +4 -4
- package/dist/commonjs/text-area/lib/TextArea.js +5 -5
- package/dist/commonjs/text-input/lib/InputGroup.js +6 -6
- package/dist/commonjs/text-input/lib/TextInput.js +5 -5
- package/dist/commonjs/toast/lib/Toast.js +1 -1
- package/dist/commonjs/toast/lib/ToastBody.js +1 -1
- package/dist/commonjs/toast/lib/ToastCloseIcon.js +1 -1
- package/dist/commonjs/toast/lib/ToastIcon.js +1 -1
- package/dist/commonjs/toast/lib/ToastMessage.js +1 -1
- package/dist/es6/action-bar/lib/ActionBar.d.ts +82 -10
- package/dist/es6/action-bar/lib/ActionBar.d.ts.map +1 -1
- package/dist/es6/avatar/lib/Avatar.js +21 -21
- package/dist/es6/badge/lib/CountBadge.js +3 -3
- package/dist/es6/breadcrumbs/lib/Breadcrumbs.d.ts +1 -1
- package/dist/es6/breadcrumbs/lib/BreadcrumbsMenu.d.ts +2 -2
- package/dist/es6/button/lib/BaseButton.js +21 -21
- package/dist/es6/button/lib/DeleteButton.js +1 -1
- package/dist/es6/button/lib/PrimaryButton.js +2 -2
- package/dist/es6/button/lib/SecondaryButton.js +2 -2
- package/dist/es6/button/lib/TertiaryButton.js +18 -18
- package/dist/es6/card/lib/Card.js +1 -1
- package/dist/es6/card/lib/CardBody.js +1 -1
- package/dist/es6/card/lib/CardHeading.js +1 -1
- package/dist/es6/checkbox/lib/CheckBackground.js +3 -3
- package/dist/es6/checkbox/lib/CheckboxCheck.js +5 -5
- package/dist/es6/checkbox/lib/CheckboxContainer.js +1 -1
- package/dist/es6/checkbox/lib/CheckboxInput.js +5 -5
- package/dist/es6/checkbox/lib/CheckboxRipple.js +1 -1
- package/dist/es6/collection/index.d.ts +1 -0
- package/dist/es6/collection/index.d.ts.map +1 -1
- package/dist/es6/collection/index.js +1 -0
- package/dist/es6/collection/lib/ListBox.js +4 -4
- package/dist/es6/collection/lib/useListItemActiveDescendant.d.ts +69 -0
- package/dist/es6/collection/lib/useListItemActiveDescendant.d.ts.map +1 -0
- package/dist/es6/collection/lib/useListItemActiveDescendant.js +22 -0
- package/dist/es6/combobox/lib/Combobox.d.ts +5 -83
- package/dist/es6/combobox/lib/Combobox.d.ts.map +1 -1
- package/dist/es6/combobox/lib/ComboboxMenu.d.ts +5 -83
- package/dist/es6/combobox/lib/ComboboxMenu.d.ts.map +1 -1
- package/dist/es6/combobox/lib/ComboboxMenu.js +1 -2
- package/dist/es6/combobox/lib/ComboboxMenuItem.d.ts +18 -260
- package/dist/es6/combobox/lib/ComboboxMenuItem.d.ts.map +1 -1
- package/dist/es6/combobox/lib/ComboboxMenuItem.js +3 -56
- package/dist/es6/combobox/lib/ComboboxMenuList.js +1 -1
- package/dist/es6/common/lib/AccessibleHide.js +1 -1
- package/dist/es6/common/lib/CanvasProvider.js +1 -1
- package/dist/es6/form-field/lib/FormFieldContainer.js +1 -1
- package/dist/es6/form-field/lib/FormFieldField.js +1 -1
- package/dist/es6/form-field/lib/FormFieldGroupLabel.js +5 -5
- package/dist/es6/form-field/lib/FormFieldGroupList.js +3 -3
- package/dist/es6/form-field/lib/FormFieldHint.js +3 -3
- package/dist/es6/form-field/lib/FormFieldLabel.js +5 -5
- package/dist/es6/form-field/lib/formFieldStencil.js +8 -8
- package/dist/es6/icon/lib/AccentIcon.js +2 -2
- package/dist/es6/icon/lib/AppletIcon.js +1 -1
- package/dist/es6/icon/lib/Graphic.js +2 -2
- package/dist/es6/icon/lib/Svg.js +2 -2
- package/dist/es6/icon/lib/SystemIcon.js +1 -1
- package/dist/es6/icon/lib/SystemIconCircle.js +1 -1
- package/dist/es6/loading-dots/lib/LoadingDots.js +3 -3
- package/dist/es6/menu/index.d.ts +2 -1
- package/dist/es6/menu/index.d.ts.map +1 -1
- package/dist/es6/menu/index.js +2 -1
- package/dist/es6/menu/lib/Menu.d.ts +89 -9
- package/dist/es6/menu/lib/Menu.d.ts.map +1 -1
- package/dist/es6/menu/lib/Menu.js +10 -0
- package/dist/es6/menu/lib/MenuCard.js +1 -1
- package/dist/es6/menu/lib/MenuItem.d.ts +12 -19
- package/dist/es6/menu/lib/MenuItem.d.ts.map +1 -1
- package/dist/es6/menu/lib/MenuItem.js +22 -93
- package/dist/es6/menu/lib/MenuList.js +3 -3
- package/dist/es6/menu/lib/MenuOption.d.ts +192 -0
- package/dist/es6/menu/lib/MenuOption.d.ts.map +1 -0
- package/dist/es6/menu/lib/MenuOption.js +63 -0
- package/dist/es6/modal/lib/ModalBody.js +1 -1
- package/dist/es6/modal/lib/ModalCard.js +1 -1
- package/dist/es6/modal/lib/ModalHeading.js +1 -1
- package/dist/es6/modal/lib/ModalOverflowOverlay.js +1 -1
- package/dist/es6/modal/lib/ModalOverlay.js +2 -2
- package/dist/es6/popup/lib/PopupBody.js +1 -1
- package/dist/es6/popup/lib/PopupCard.js +2 -2
- package/dist/es6/popup/lib/PopupCloseIcon.js +1 -1
- package/dist/es6/popup/lib/PopupHeading.js +1 -1
- package/dist/es6/select/lib/Select.d.ts +59 -962
- package/dist/es6/select/lib/Select.d.ts.map +1 -1
- package/dist/es6/select/lib/Select.js +5 -5
- package/dist/es6/switch/lib/Switch.js +7 -7
- package/dist/es6/table/lib/Table.js +1 -1
- package/dist/es6/table/lib/TableBody.js +1 -1
- package/dist/es6/table/lib/TableCaption.js +1 -1
- package/dist/es6/table/lib/TableCell.js +1 -1
- package/dist/es6/table/lib/TableFooter.js +1 -1
- package/dist/es6/table/lib/TableHead.js +1 -1
- package/dist/es6/table/lib/TableHeader.js +1 -1
- package/dist/es6/table/lib/TableRow.js +1 -1
- package/dist/es6/tabs/lib/Tabs.d.ts +82 -10
- package/dist/es6/tabs/lib/Tabs.d.ts.map +1 -1
- package/dist/es6/text/lib/LabelText.js +6 -6
- package/dist/es6/text/lib/Text.js +16 -16
- package/dist/es6/text/lib/TypeLevelComponents.js +4 -4
- package/dist/es6/text-area/lib/TextArea.js +5 -5
- package/dist/es6/text-input/lib/InputGroup.js +6 -6
- package/dist/es6/text-input/lib/TextInput.js +5 -5
- package/dist/es6/toast/lib/Toast.js +1 -1
- package/dist/es6/toast/lib/ToastBody.js +1 -1
- package/dist/es6/toast/lib/ToastCloseIcon.js +1 -1
- package/dist/es6/toast/lib/ToastIcon.js +1 -1
- package/dist/es6/toast/lib/ToastMessage.js +1 -1
- package/menu/index.ts +2 -1
- package/menu/lib/Menu.tsx +10 -0
- package/menu/lib/MenuItem.tsx +107 -99
- package/menu/lib/MenuOption.tsx +138 -0
- package/package.json +4 -4
- package/select/lib/Select.tsx +1 -1
package/collection/index.ts
CHANGED
|
@@ -13,6 +13,7 @@ export * from './lib/useListLoader';
|
|
|
13
13
|
export * from './lib/useListModel';
|
|
14
14
|
export * from './lib/useGridModel';
|
|
15
15
|
export * from './lib/useListActiveDescendant';
|
|
16
|
+
export * from './lib/useListItemActiveDescendant';
|
|
16
17
|
export * from './lib/useListItemAllowChildStrings';
|
|
17
18
|
export {ListBox, ListBoxProps} from './lib/ListBox';
|
|
18
19
|
export {keyboardEventToCursorEvents} from './lib/keyUtils';
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import {createElemPropsHook} from '@workday/canvas-kit-react/common';
|
|
2
|
+
|
|
3
|
+
import {useCursorListModel} from './useCursorListModel';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* This elemProps hook is used for cursor navigation by using [Active
|
|
7
|
+
* Descendant](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_focus_activedescendant).
|
|
8
|
+
* This hook should be applied to List Items, not the list (use {@link useListActiveDescendant} for the list).
|
|
9
|
+
* This hook adds the focus class so that lists using `aria-activedescendant` get the correct
|
|
10
|
+
* visual cue for visual users.
|
|
11
|
+
*
|
|
12
|
+
* ```ts
|
|
13
|
+
* const useMyItem = composeHooks(
|
|
14
|
+
* useListItemActiveDescendant, // adds `aria-activedescendant` support
|
|
15
|
+
* useListItemRegister
|
|
16
|
+
* );
|
|
17
|
+
```
|
|
18
|
+
*/
|
|
19
|
+
export const useListItemActiveDescendant = createElemPropsHook(useCursorListModel)(
|
|
20
|
+
(model, _ref, elemProps: {'data-id'?: string} = {}) => {
|
|
21
|
+
const id = elemProps['data-id'] || '';
|
|
22
|
+
return {
|
|
23
|
+
className: model.state.cursorId && model.state.cursorId === id ? 'focus' : '',
|
|
24
|
+
};
|
|
25
|
+
}
|
|
26
|
+
);
|
|
@@ -5,7 +5,6 @@ import {Menu} from '@workday/canvas-kit-react/menu';
|
|
|
5
5
|
|
|
6
6
|
import {useComboboxModel} from './hooks/useComboboxModel';
|
|
7
7
|
import {ComboboxMenuList} from './ComboboxMenuList';
|
|
8
|
-
import {ComboboxMenuItem} from './ComboboxMenuItem';
|
|
9
8
|
import {ComboboxCard} from './ComboboxCard';
|
|
10
9
|
import {ComboboxMenuPopper} from './ComboboxPopper';
|
|
11
10
|
|
|
@@ -54,7 +53,7 @@ export const ComboboxMenu = createSubcomponent()({
|
|
|
54
53
|
* `Combobox.Menu.List` and will be passed to the optional `onSelect` callback of the
|
|
55
54
|
* `ComboboxModel`. `Combobox.Menu.Item` can contain any HTML.
|
|
56
55
|
*/
|
|
57
|
-
Item:
|
|
56
|
+
Item: Menu.Option,
|
|
58
57
|
/**
|
|
59
58
|
* `Combobox.Menu.Card` is a non-semantic element used to give the dropdown menu its distinct visual
|
|
60
59
|
* cue that the dropdown menu is floating above other content. `Combobox.Menu.Card` usually contains a
|
|
@@ -1,94 +1,6 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import {
|
|
4
|
-
composeHooks,
|
|
5
|
-
createElemPropsHook,
|
|
6
|
-
createSubcomponent,
|
|
7
|
-
ExtractProps,
|
|
8
|
-
} from '@workday/canvas-kit-react/common';
|
|
9
|
-
import {StyledMenuItem, useMenuModel} from '@workday/canvas-kit-react/menu';
|
|
10
|
-
import {SystemIcon} from '@workday/canvas-kit-react/icon';
|
|
11
|
-
import {
|
|
12
|
-
useListItemAllowChildStrings,
|
|
13
|
-
useListItemRegister,
|
|
14
|
-
isSelected,
|
|
15
|
-
} from '@workday/canvas-kit-react/collection';
|
|
16
|
-
import {OverflowTooltip} from '@workday/canvas-kit-react/tooltip';
|
|
17
|
-
|
|
18
|
-
import {useComboboxModel} from './hooks/useComboboxModel';
|
|
19
|
-
import {createStencil} from '@workday/canvas-kit-styling';
|
|
20
|
-
import {system} from '@workday/canvas-tokens-web';
|
|
21
|
-
import {mergeStyles} from '@workday/canvas-kit-react/layout';
|
|
22
|
-
|
|
23
|
-
export interface ComboboxMenuItemProps extends ExtractProps<typeof StyledMenuItem, never> {}
|
|
1
|
+
import {useMenuOption} from '@workday/canvas-kit-react/menu';
|
|
24
2
|
|
|
25
3
|
/**
|
|
26
|
-
*
|
|
27
|
-
* component. It prevents focus when clicking so the focus stays on the
|
|
28
|
-
* {@link ComboboxInput Combobox.Input} component and selects an item when the user clicks on it. It
|
|
29
|
-
* also prevents items with an `aria-disabled` attribute from being selected. A `focus` CSS class is
|
|
30
|
-
* added when the item has "focus" (when the cursor is on the item).
|
|
4
|
+
* @deprecated Use `useMenuOption` instead
|
|
31
5
|
*/
|
|
32
|
-
export const useComboboxMenuItem =
|
|
33
|
-
createElemPropsHook(useMenuModel)((model, ref, elemProps: {'data-id'?: string} = {}) => {
|
|
34
|
-
const id = elemProps['data-id'] || '';
|
|
35
|
-
|
|
36
|
-
const onMouseDown = (event: React.MouseEvent<HTMLElement>) => {
|
|
37
|
-
if (event.currentTarget.getAttribute('aria-disabled') !== 'true') {
|
|
38
|
-
model.events.select({id});
|
|
39
|
-
|
|
40
|
-
if (model.state.mode === 'single') {
|
|
41
|
-
model.events.hide(event);
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
// prevent focus changes
|
|
46
|
-
event.preventDefault();
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
const selected = isSelected(id, model.state);
|
|
50
|
-
|
|
51
|
-
return {
|
|
52
|
-
role: 'option',
|
|
53
|
-
'aria-selected': selected || undefined,
|
|
54
|
-
onMouseDown,
|
|
55
|
-
className:
|
|
56
|
-
model.state.cursorId && model.state.cursorId === elemProps['data-id'] ? 'focus' : '',
|
|
57
|
-
} as const;
|
|
58
|
-
}),
|
|
59
|
-
useListItemRegister,
|
|
60
|
-
useListItemAllowChildStrings
|
|
61
|
-
);
|
|
62
|
-
const comboboxMenuItemIconStencil = createStencil({
|
|
63
|
-
base: {
|
|
64
|
-
alignSelf: 'start',
|
|
65
|
-
},
|
|
66
|
-
});
|
|
67
|
-
|
|
68
|
-
export const ComboboxMenuItemIcon = createSubcomponent('span')({
|
|
69
|
-
modelHook: useComboboxModel,
|
|
70
|
-
})<ExtractProps<typeof SystemIcon>>((elemProps, Element) => {
|
|
71
|
-
return <SystemIcon as={Element} {...mergeStyles(elemProps, comboboxMenuItemIconStencil())} />;
|
|
72
|
-
});
|
|
73
|
-
|
|
74
|
-
const comboboxMenuItemStencil = createStencil({
|
|
75
|
-
base: {
|
|
76
|
-
minHeight: system.space.x10,
|
|
77
|
-
},
|
|
78
|
-
});
|
|
79
|
-
|
|
80
|
-
export const ComboboxMenuItem = createSubcomponent('li')({
|
|
81
|
-
modelHook: useComboboxModel,
|
|
82
|
-
elemPropsHook: useComboboxMenuItem,
|
|
83
|
-
subComponents: {
|
|
84
|
-
Icon: ComboboxMenuItemIcon,
|
|
85
|
-
},
|
|
86
|
-
})<ComboboxMenuItemProps>(({children, ...elemProps}, Element) => {
|
|
87
|
-
return (
|
|
88
|
-
<OverflowTooltip placement="left">
|
|
89
|
-
<StyledMenuItem as={Element} {...mergeStyles(elemProps, comboboxMenuItemStencil())}>
|
|
90
|
-
{children}
|
|
91
|
-
</StyledMenuItem>
|
|
92
|
-
</OverflowTooltip>
|
|
93
|
-
);
|
|
94
|
-
});
|
|
6
|
+
export const useComboboxMenuItem = useMenuOption;
|
|
@@ -3722,7 +3722,7 @@ export declare const ActionBar: import("@workday/canvas-kit-react/common").Compo
|
|
|
3722
3722
|
navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
|
|
3723
3723
|
getId: (item: any) => string;
|
|
3724
3724
|
}>;
|
|
3725
|
-
Item: import("@workday/canvas-kit-react/common").ElementComponentM<"button", import("
|
|
3725
|
+
Item: import("@workday/canvas-kit-react/common").ElementComponentM<"button", import("../../menu/lib/MenuItem").MenuItemProps, {
|
|
3726
3726
|
state: {
|
|
3727
3727
|
stackRef: React.RefObject<HTMLDivElement>;
|
|
3728
3728
|
targetRef: React.RefObject<HTMLButtonElement>;
|
|
@@ -3794,15 +3794,87 @@ export declare const ActionBar: import("@workday/canvas-kit-react/common").Compo
|
|
|
3794
3794
|
navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
|
|
3795
3795
|
getId: (item: any) => string;
|
|
3796
3796
|
}> & {
|
|
3797
|
-
Icon:
|
|
3798
|
-
|
|
3799
|
-
|
|
3800
|
-
|
|
3801
|
-
|
|
3802
|
-
|
|
3803
|
-
|
|
3804
|
-
|
|
3805
|
-
|
|
3797
|
+
Icon: (elemProps: import("../..").SystemIconProps) => React.JSX.Element;
|
|
3798
|
+
Text: ({ children }: {
|
|
3799
|
+
children?: React.ReactNode;
|
|
3800
|
+
}) => React.JSX.Element;
|
|
3801
|
+
};
|
|
3802
|
+
Option: import("@workday/canvas-kit-react/common").ElementComponentM<"li", import("../../menu/lib/MenuOption").MenuOptionProps, {
|
|
3803
|
+
state: {
|
|
3804
|
+
stackRef: React.RefObject<HTMLDivElement>;
|
|
3805
|
+
targetRef: React.RefObject<HTMLButtonElement>;
|
|
3806
|
+
initialFocusRef: React.RefObject<any> | undefined;
|
|
3807
|
+
returnFocusRef: React.RefObject<any> | undefined;
|
|
3808
|
+
placement: import("@popperjs/core").Placement;
|
|
3809
|
+
id: string;
|
|
3810
|
+
visibility: "hidden" | "visible";
|
|
3811
|
+
selectedIds: string[] | "all";
|
|
3812
|
+
unselectedIds: string[];
|
|
3813
|
+
cursorId: string;
|
|
3814
|
+
columnCount: number;
|
|
3815
|
+
pageSizeRef: React.MutableRefObject<number>;
|
|
3816
|
+
cursorIndexRef: {
|
|
3817
|
+
readonly current: number;
|
|
3818
|
+
};
|
|
3819
|
+
UNSTABLE_virtual: {
|
|
3820
|
+
virtualItems: import("../../collection/lib/react-virtual").VirtualItem[];
|
|
3821
|
+
totalSize: number;
|
|
3822
|
+
scrollToOffset: (index: number, options?: import("../../collection/lib/react-virtual").ScrollToOffsetOptions | undefined) => void;
|
|
3823
|
+
scrollToIndex: (index: number, options?: import("../../collection/lib/react-virtual").ScrollToIndexOptions | undefined) => void;
|
|
3824
|
+
measure: () => void;
|
|
3825
|
+
};
|
|
3826
|
+
UNSTABLE_defaultItemHeight: number;
|
|
3827
|
+
containerRef: React.RefObject<HTMLDivElement>;
|
|
3828
|
+
orientation: "horizontal" | "vertical";
|
|
3829
|
+
indexRef: React.MutableRefObject<number>;
|
|
3830
|
+
nonInteractiveIds: string[];
|
|
3831
|
+
isVirtualized: boolean;
|
|
3832
|
+
items: import("../..").Item<any>[];
|
|
3833
|
+
mode: "multiple" | "single";
|
|
3834
|
+
};
|
|
3835
|
+
events: {
|
|
3836
|
+
updatePlacement(data: {
|
|
3837
|
+
placement: import("@popperjs/core").Placement;
|
|
3838
|
+
}): void;
|
|
3839
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
3840
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
3841
|
+
select(data: {
|
|
3842
|
+
id: string;
|
|
3843
|
+
}): void;
|
|
3844
|
+
selectAll(): void;
|
|
3845
|
+
unselectAll(): void;
|
|
3846
|
+
goTo(data: {
|
|
3847
|
+
id: string;
|
|
3848
|
+
}): void;
|
|
3849
|
+
goToNext(): void;
|
|
3850
|
+
goToPrevious(): void;
|
|
3851
|
+
goToPreviousRow(): void;
|
|
3852
|
+
goToNextRow(): void;
|
|
3853
|
+
goToFirst(): void;
|
|
3854
|
+
goToLast(): void;
|
|
3855
|
+
goToFirstOfRow(): void;
|
|
3856
|
+
goToLastOfRow(): void;
|
|
3857
|
+
goToNextPage(): void;
|
|
3858
|
+
goToPreviousPage(): void;
|
|
3859
|
+
registerItem(data: {
|
|
3860
|
+
item: any;
|
|
3861
|
+
textValue: string;
|
|
3862
|
+
}): void;
|
|
3863
|
+
unregisterItem(data: {
|
|
3864
|
+
id: string;
|
|
3865
|
+
}): void;
|
|
3866
|
+
updateItemHeight(data: {
|
|
3867
|
+
value: number;
|
|
3868
|
+
}): void;
|
|
3869
|
+
};
|
|
3870
|
+
selection: import("../../collection/lib/useSelectionListModel").SelectionManager;
|
|
3871
|
+
navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
|
|
3872
|
+
getId: (item: any) => string;
|
|
3873
|
+
}> & {
|
|
3874
|
+
Icon: (elemProps: import("../..").SystemIconProps) => React.JSX.Element;
|
|
3875
|
+
Text: ({ children }: {
|
|
3876
|
+
children?: React.ReactNode;
|
|
3877
|
+
}) => React.JSX.Element;
|
|
3806
3878
|
};
|
|
3807
3879
|
Divider: import("@workday/canvas-kit-react/common").ElementComponent<"hr", unknown>;
|
|
3808
3880
|
TargetContext: import("@workday/canvas-kit-react/common").ElementComponentM<import("@workday/canvas-kit-react/common").ElementComponent<"button", import("../..").SecondaryButtonProps>, import("../../menu/lib/MenuTarget").MenuTargetProps, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionBar.d.ts","sourceRoot":"","sources":["../../../../action-bar/lib/ActionBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIlB;;;;;;;;;;;;;;;OAeG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;OASG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGH;;;;;;;;;;;OAWG
|
|
1
|
+
{"version":3,"file":"ActionBar.d.ts","sourceRoot":"","sources":["../../../../action-bar/lib/ActionBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIlB;;;;;;;;;;;;;;;OAeG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;OASG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGH;;;;;;;;;;;OAWG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}
|
|
@@ -44,35 +44,35 @@ exports.avatarStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
|
44
44
|
vars: {
|
|
45
45
|
size: '',
|
|
46
46
|
},
|
|
47
|
-
base: { name: "
|
|
47
|
+
base: { name: "e3032t", styles: "box-sizing:border-box;background:var(--cnvs-sys-color-bg-caution-default);position:relative;display:flex;align-items:center;justify-content:center;padding:0;border:0;overflow:hidden;cursor:default;border-radius:var(--cnvs-sys-shape-round);width:var(--size-avatar-69cee0);height:var(--size-avatar-69cee0);&:focus-visible:not([disabled]), &.focus:not([disabled]){outline:none;box-shadow:0 0 0 2px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)), 0 0 0 4px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}:is(button){cursor:pointer;}& > [data-part=\"avatar-icon\"]{transition:opacity 150ms linear;display:flex;align-items:center;justify-content:center;--size-svg-a30d66:calc(var(--size-avatar-69cee0) * 0.625);}& > [data-part=\"avatar-image\"]{position:absolute;width:100%;height:100%;border-radius:999px;transition:opacity 150ms linear;}" },
|
|
48
48
|
modifiers: {
|
|
49
49
|
variant: {
|
|
50
|
-
light: { name: "
|
|
51
|
-
dark: { name: "
|
|
50
|
+
light: { name: "e3032u", styles: "background-color:var(--cnvs-sys-color-bg-alt-default);& [data-part=\"avatar-icon\"]{--color-system-icon-583fae:var(--cnvs-sys-color-fg-default);}" },
|
|
51
|
+
dark: { name: "e3032v", styles: "background-color:var(--cnvs-sys-color-bg-primary-default);& [data-part=\"avatar-icon\"]{--color-system-icon-583fae:var(--cnvs-sys-color-fg-inverse);}" }
|
|
52
52
|
},
|
|
53
53
|
size: {
|
|
54
|
-
extraSmall: { name: "
|
|
55
|
-
small: { name: "
|
|
56
|
-
medium: { name: "
|
|
57
|
-
large: { name: "
|
|
58
|
-
extraLarge: { name: "
|
|
59
|
-
extraExtraLarge: { name: "
|
|
54
|
+
extraSmall: { name: "e3032w", styles: "width:var(--cnvs-sys-space-x4);height:var(--cnvs-sys-space-x4);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x4) * 0.625);}" },
|
|
55
|
+
small: { name: "e3032x", styles: "width:var(--cnvs-sys-space-x6);height:var(--cnvs-sys-space-x6);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x6) * 0.625);}" },
|
|
56
|
+
medium: { name: "e3032y", styles: "width:var(--cnvs-sys-space-x8);height:var(--cnvs-sys-space-x8);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x8) * 0.625);}" },
|
|
57
|
+
large: { name: "e3032z", styles: "width:var(--cnvs-sys-space-x10);height:var(--cnvs-sys-space-x10);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x10) * 0.625);}" },
|
|
58
|
+
extraLarge: { name: "e30330", styles: "width:var(--cnvs-sys-space-x16);height:var(--cnvs-sys-space-x16);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(var(--cnvs-sys-space-x16) * 0.625);}" },
|
|
59
|
+
extraExtraLarge: { name: "e30331", styles: "width:calc(var(--cnvs-sys-space-x10) * 3);height:calc(var(--cnvs-sys-space-x10) * 3);& [data-part=\"avatar-icon\"]{--size-svg-a30d66:calc(calc(var(--cnvs-sys-space-x10) * 3) * 0.625);}" }
|
|
60
60
|
},
|
|
61
61
|
objectFit: {
|
|
62
|
-
contain: { name: "
|
|
63
|
-
fill: { name: "
|
|
64
|
-
cover: { name: "
|
|
65
|
-
['scale-down']: { name: "
|
|
66
|
-
none: { name: "
|
|
67
|
-
['-moz-initial']: { name: "
|
|
68
|
-
['initial']: { name: "
|
|
69
|
-
['inherit']: { name: "
|
|
70
|
-
['revert']: { name: "
|
|
71
|
-
['unset']: { name: "
|
|
62
|
+
contain: { name: "e30332", styles: "& [data-part=\"avatar-image\"]{object-fit:contain;}" },
|
|
63
|
+
fill: { name: "e30333", styles: "& [data-part=\"avatar-image\"]{object-fit:fill;}" },
|
|
64
|
+
cover: { name: "e30334", styles: "& [data-part=\"avatar-image\"]{object-fit:cover;}" },
|
|
65
|
+
['scale-down']: { name: "e30335", styles: "& [data-part=\"avatar-image\"]{object-fit:scale-down;}" },
|
|
66
|
+
none: { name: "e30336", styles: "& [data-part=\"avatar-image\"]{object-fit:none;}" },
|
|
67
|
+
['-moz-initial']: { name: "e30337", styles: "& [data-part=\"avatar-image\"]{object-fit:-moz-initial;}" },
|
|
68
|
+
['initial']: { name: "e30338", styles: "& [data-part=\"avatar-image\"]{object-fit:initial;}" },
|
|
69
|
+
['inherit']: { name: "e30339", styles: "& [data-part=\"avatar-image\"]{object-fit:inherit;}" },
|
|
70
|
+
['revert']: { name: "e3033a", styles: "& [data-part=\"avatar-image\"]{object-fit:revert;}" },
|
|
71
|
+
['unset']: { name: "e3033b", styles: "& [data-part=\"avatar-image\"]{object-fit:unset;}" }
|
|
72
72
|
},
|
|
73
73
|
isImageLoaded: {
|
|
74
|
-
true: { name: "
|
|
75
|
-
false: { name: "
|
|
74
|
+
true: { name: "e3033c", styles: "& [data-part=\"avatar-icon\"]{opacity:0;}& [data-part=\"avatar-image\"]{opacity:1;}" },
|
|
75
|
+
false: { name: "e3033d", styles: "& [data-part=\"avatar-icon\"]{opacity:1;}& [data-part=\"avatar-image\"]{opacity:0;}" }
|
|
76
76
|
}
|
|
77
77
|
},
|
|
78
78
|
defaultModifiers: {
|
|
@@ -28,14 +28,14 @@ const React = __importStar(require("react"));
|
|
|
28
28
|
const common_1 = require("@workday/canvas-kit-react/common");
|
|
29
29
|
const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
|
|
30
30
|
const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
|
|
31
|
-
const grow = (0, canvas_kit_styling_1.keyframes)({ name: "
|
|
31
|
+
const grow = (0, canvas_kit_styling_1.keyframes)({ name: "e3033e", styles: "from{transform:scale(0.85);}to{transform:scale(1.0);}" });
|
|
32
32
|
// .cnvs-count-badge
|
|
33
33
|
const countBadgeStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
34
|
-
base: { name: "
|
|
34
|
+
base: { name: "e3033f", styles: "box-sizing:border-box;align-items:center;animation:animation-e3033e 0.2s ease;background:var(--cnvs-sys-color-static-red-default);border-radius:var(--cnvs-sys-shape-round);color:var(--cnvs-sys-color-text-inverse);display:inline-flex;font-family:var(--cnvs-sys-font-family-default);font-size:var(--cnvs-sys-font-size-subtext-medium);font-weight:var(--cnvs-sys-font-weight-bold);height:1.25rem;justify-content:center;line-height:1.25rem;min-width:1.25rem;padding:0 0.40625rem;text-shadow:0 0 0.0625rem rgba(0,0,0, 0.35);" },
|
|
35
35
|
modifiers: {
|
|
36
36
|
variant: {
|
|
37
37
|
// .cnvs-count-badge--variant-inverse
|
|
38
|
-
inverse: { name: "
|
|
38
|
+
inverse: { name: "e3033g", styles: "background:var(--cnvs-sys-color-bg-default);box-shadow:0 0.0625rem 0.125rem rgba(0,0,0, 0.25);color:var(--cnvs-sys-color-text-primary-default);text-shadow:none;" }
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
41
|
}, "count-badge-183e28");
|
|
@@ -3956,7 +3956,7 @@ export declare const Breadcrumbs: import("@workday/canvas-kit-react/common").Ele
|
|
|
3956
3956
|
navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
|
|
3957
3957
|
getId: (item: any) => string;
|
|
3958
3958
|
}>;
|
|
3959
|
-
Item: import("@workday/canvas-kit-react/common").ElementComponent<"a", import("
|
|
3959
|
+
Item: import("@workday/canvas-kit-react/common").ElementComponent<"a", import("../../menu/lib/MenuItem").MenuItemProps & import("@workday/canvas-kit-react/common").PropsWithModel<{
|
|
3960
3960
|
state: {
|
|
3961
3961
|
stackRef: React.RefObject<HTMLDivElement>;
|
|
3962
3962
|
targetRef: React.RefObject<HTMLButtonElement>;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { ExtractProps } from '@workday/canvas-kit-react/common';
|
|
3
3
|
import { Menu } from '@workday/canvas-kit-react/menu';
|
|
4
|
-
export declare const BreadcrumbsMenuItem: import("@workday/canvas-kit-react/common").ElementComponent<"a", import("
|
|
4
|
+
export declare const BreadcrumbsMenuItem: import("@workday/canvas-kit-react/common").ElementComponent<"a", import("../../menu/lib/MenuItem").MenuItemProps & import("@workday/canvas-kit-react/common").PropsWithModel<{
|
|
5
5
|
state: {
|
|
6
6
|
stackRef: React.RefObject<HTMLDivElement>;
|
|
7
7
|
targetRef: React.RefObject<HTMLButtonElement>;
|
|
@@ -1617,7 +1617,7 @@ export declare const BreadcrumbsMenu: import("@workday/canvas-kit-react/common")
|
|
|
1617
1617
|
navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
|
|
1618
1618
|
getId: (item: any) => string;
|
|
1619
1619
|
}>;
|
|
1620
|
-
Item: import("@workday/canvas-kit-react/common").ElementComponent<"a", import("
|
|
1620
|
+
Item: import("@workday/canvas-kit-react/common").ElementComponent<"a", import("../../menu/lib/MenuItem").MenuItemProps & import("@workday/canvas-kit-react/common").PropsWithModel<{
|
|
1621
1621
|
state: {
|
|
1622
1622
|
stackRef: React.RefObject<HTMLDivElement>;
|
|
1623
1623
|
targetRef: React.RefObject<HTMLButtonElement>;
|
|
@@ -55,7 +55,7 @@ exports.buttonStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
|
55
55
|
opacity: '',
|
|
56
56
|
borderRadius: '',
|
|
57
57
|
},
|
|
58
|
-
base: { name: "
|
|
58
|
+
base: { name: "e30318", styles: "box-sizing:border-box;font-family:\"Roboto\", \"Helvetica Neue\", \"Helvetica\", Arial, sans-serif;font-size:0.875rem;line-height:normal;letter-spacing:0.015rem;font-weight:var(--cnvs-sys-font-weight-bold);background-color:var(--background-b5fb58, var(--background-button-65cb05, transparent));color:var(--label-b5fb58, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));border-width:0.0625rem;border-style:solid;gap:var(--cnvs-sys-space-x2);border-color:var(--border-b5fb58, var(--border-button-65cb05, transparent));cursor:pointer;display:inline-flex;box-shadow:none;align-items:center;justify-content:center;outline:0.125rem transparent;white-space:nowrap;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-radius:var(--borderRadius-b5fb58, var(--borderRadius-button-65cb05, var(--cnvs-sys-shape-round)));position:relative;vertical-align:middle;overflow:hidden;--color-system-icon-583fae:var(--icon-b5fb58, var(--cnvs-sys-color-fg-strong));transition:box-shadow 120ms linear, border 120ms linear, background-color 120ms linear, color 120ms linear;&:disabled, &:disabled:active, &.disabled{cursor:default;box-shadow:none;opacity:var(--opacity-b5fb58, var(--opacity-button-65cb05, var(--cnvs-sys-opacity-full)));}&:focus-visible, &.focus{background-color:var(--background-2ae7b1, var(--background-button-65cb05, transparent));border-color:var(--border-2ae7b1, var(--border-button-65cb05, transparent));color:var(--label-2ae7b1, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));--color-system-icon-583fae:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));box-shadow:0 0 0 2px var(--boxShadowInner-2ae7b1, var(--boxShadowInner-button-65cb05, var(--cnvs-sys-color-border-inverse))), 0 0 0 4px var(--boxShadowOuter-2ae7b1, var(--boxShadowOuter-button-65cb05, var(--cnvs-brand-common-focus-outline)));}&:hover, &.hover{background-color:var(--background-c4b8f8, var(--background-button-65cb05, var(--cnvs-sys-color-bg-contrast-strong)));border-color:var(--border-c4b8f8, var(--border-button-65cb05, transparent));color:var(--label-c4b8f8, var(--label-button-65cb05, var(--cnvs-sys-color-fg-stronger)));--color-system-icon-583fae:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-stronger));}&:hover:active{transition-duration:40ms;}&:active, &.active{background-color:var(--background-93b1ce, var(--background-button-65cb05, transparent));border-color:var(--border-93b1ce, var(--border-button-65cb05, transparent));color:var(--label-93b1ce, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));--color-system-icon-583fae:var(--icon-93b1ce, var(--cnvs-sys-color-fg-strong));}&:disabled, &.disabled{background-color:var(--background-c34400, var(--background-button-65cb05, transparent));border-color:var(--border-c34400, var(--border-button-65cb05, transparent));color:var(--label-c34400, var(--label-button-65cb05, var(--cnvs-sys-color-fg-strong)));--color-system-icon-583fae:var(--icon-c34400, var(--cnvs-sys-color-fg-strong));}" },
|
|
59
59
|
modifiers: {
|
|
60
60
|
/**
|
|
61
61
|
* Button modifiers that will overwrite the base styles of Buttons.
|
|
@@ -64,70 +64,70 @@ exports.buttonStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
|
64
64
|
* within a button or if there is only an icon and no text.
|
|
65
65
|
*/
|
|
66
66
|
size: {
|
|
67
|
-
large: { name: "
|
|
68
|
-
medium: { name: "
|
|
69
|
-
small: { name: "
|
|
70
|
-
extraSmall: { name: "
|
|
67
|
+
large: { name: "e30319", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-base-line-height-150);font-size:var(--cnvs-base-font-size-100);letter-spacing:var(--cnvs-base-letter-spacing-200);height:3rem;padding-inline:var(--cnvs-sys-space-x8);min-width:7rem;" },
|
|
68
|
+
medium: { name: "e3031a", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);min-width:6rem;padding-inline:var(--cnvs-sys-space-x6);height:var(--cnvs-sys-space-x10);" },
|
|
69
|
+
small: { name: "e3031b", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-base-line-height-100);font-size:var(--cnvs-base-font-size-75);letter-spacing:var(--cnvs-base-letter-spacing-150);height:var(--cnvs-sys-space-x8);min-width:var(--cnvs-sys-space-x20);padding-inline:var(--cnvs-sys-space-x4);gap:var(--cnvs-sys-space-x1);" },
|
|
70
|
+
extraSmall: { name: "e3031c", styles: "font-family:var(--cnvs-base-font-family-50);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-base-line-height-50);font-size:var(--cnvs-base-font-size-50);letter-spacing:var(--cnvs-base-letter-spacing-100);height:var(--cnvs-sys-space-x6);min-width:auto;padding-inline:var(--cnvs-sys-space-x3);gap:var(--cnvs-sys-space-x1);" }
|
|
71
71
|
},
|
|
72
72
|
grow: {
|
|
73
|
-
true: { name: "
|
|
73
|
+
true: { name: "e3031d", styles: "width:100%;max-width:100%;" }
|
|
74
74
|
},
|
|
75
75
|
// IconPosition Styles
|
|
76
76
|
iconPosition: {
|
|
77
|
-
only: { name: "
|
|
78
|
-
start: { name: "
|
|
79
|
-
end: { name: "
|
|
77
|
+
only: { name: "e3031e", styles: "padding:var(--cnvs-sys-space-zero);" },
|
|
78
|
+
start: { name: "e3031f", styles: "" },
|
|
79
|
+
end: { name: "e3031g", styles: "" }
|
|
80
80
|
}
|
|
81
81
|
},
|
|
82
82
|
// Compound Modifier Styles
|
|
83
83
|
compound: [
|
|
84
84
|
{
|
|
85
85
|
modifiers: { size: 'large', iconPosition: 'only' },
|
|
86
|
-
styles: { name: "
|
|
86
|
+
styles: { name: "e3031h", styles: "min-width:calc(var(--cnvs-sys-space-x4) * 3);" }
|
|
87
87
|
},
|
|
88
88
|
{
|
|
89
89
|
modifiers: { size: 'large', iconPosition: 'start' },
|
|
90
|
-
styles: { name: "
|
|
90
|
+
styles: { name: "e3031i", styles: "padding-inline-start:var(--cnvs-sys-space-x6);padding-inline-end:var(--cnvs-sys-space-x8);" }
|
|
91
91
|
},
|
|
92
92
|
{
|
|
93
93
|
modifiers: { size: 'large', iconPosition: 'end' },
|
|
94
|
-
styles: { name: "
|
|
94
|
+
styles: { name: "e3031j", styles: "padding-inline-start:var(--cnvs-sys-space-x8);padding-inline-end:var(--cnvs-sys-space-x6);" }
|
|
95
95
|
},
|
|
96
96
|
{
|
|
97
97
|
modifiers: { size: 'medium', iconPosition: 'only' },
|
|
98
|
-
styles: { name: "
|
|
98
|
+
styles: { name: "e3031k", styles: "min-width:var(--cnvs-sys-space-x10);" }
|
|
99
99
|
},
|
|
100
100
|
{
|
|
101
101
|
modifiers: { size: 'medium', iconPosition: 'start' },
|
|
102
|
-
styles: { name: "
|
|
102
|
+
styles: { name: "e3031l", styles: "padding-inline-start:calc(var(--cnvs-sys-space-x1) * 5);padding-inline-end:var(--cnvs-sys-space-x6);" }
|
|
103
103
|
},
|
|
104
104
|
{
|
|
105
105
|
modifiers: { size: 'medium', iconPosition: 'end' },
|
|
106
|
-
styles: { name: "
|
|
106
|
+
styles: { name: "e3031m", styles: "padding-inline-start:var(--cnvs-sys-space-x6);padding-inline-end:calc(var(--cnvs-sys-space-x1) * 5);" }
|
|
107
107
|
},
|
|
108
108
|
{
|
|
109
109
|
modifiers: { size: 'small', iconPosition: 'only' },
|
|
110
|
-
styles: { name: "
|
|
110
|
+
styles: { name: "e3031n", styles: "min-width:var(--cnvs-sys-space-x8);" }
|
|
111
111
|
},
|
|
112
112
|
{
|
|
113
113
|
modifiers: { size: 'small', iconPosition: 'start' },
|
|
114
|
-
styles: { name: "
|
|
114
|
+
styles: { name: "e3031o", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x4);" }
|
|
115
115
|
},
|
|
116
116
|
{
|
|
117
117
|
modifiers: { size: 'small', iconPosition: 'end' },
|
|
118
|
-
styles: { name: "
|
|
118
|
+
styles: { name: "e3031p", styles: "padding-inline-start:var(--cnvs-sys-space-x4);padding-inline-end:var(--cnvs-sys-space-x3);" }
|
|
119
119
|
},
|
|
120
120
|
{
|
|
121
121
|
modifiers: { size: 'extraSmall', iconPosition: 'only' },
|
|
122
|
-
styles: { name: "
|
|
122
|
+
styles: { name: "e3031q", styles: "min-width:var(--cnvs-sys-space-x6);" }
|
|
123
123
|
},
|
|
124
124
|
{
|
|
125
125
|
modifiers: { size: 'extraSmall', iconPosition: 'start' },
|
|
126
|
-
styles: { name: "
|
|
126
|
+
styles: { name: "e3031r", styles: "padding-inline-start:var(--cnvs-sys-space-x2);padding-inline-end:var(--cnvs-sys-space-x3);" }
|
|
127
127
|
},
|
|
128
128
|
{
|
|
129
129
|
modifiers: { size: 'extraSmall', iconPosition: 'end' },
|
|
130
|
-
styles: { name: "
|
|
130
|
+
styles: { name: "e3031s", styles: "padding-inline-start:var(--cnvs-sys-space-x3);padding-inline-end:var(--cnvs-sys-space-x2);" }
|
|
131
131
|
}
|
|
132
132
|
]
|
|
133
133
|
}, "button-65cb05");
|
|
@@ -33,7 +33,7 @@ const Button_1 = require("./Button");
|
|
|
33
33
|
const icon_1 = require("@workday/canvas-kit-react/icon");
|
|
34
34
|
const deleteButtonStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
35
35
|
extends: BaseButton_1.buttonStencil,
|
|
36
|
-
base: { name: "
|
|
36
|
+
base: { name: "e3032f", styles: "box-sizing:border-box;--background-button-65cb05:var(--cnvs-brand-error-base);--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-583fae:var(--icon-b5fb58, var(--cnvs-brand-error-accent));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-brand-error-base);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-583fae:var(--icon-2ae7b1, var(--cnvs-brand-error-accent));--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-inverse);--boxShadowOuter-button-65cb05:var(--cnvs-brand-common-focus-outline);}&:hover, &.hover{--background-button-65cb05:var(--cnvs-brand-error-dark);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-583fae:var(--icon-c4b8f8, var(--cnvs-brand-error-accent));}&:active, &.active{--background-button-65cb05:var(--cnvs-brand-error-darkest);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-583fae:var(--icon-93b1ce, var(--cnvs-brand-error-accent));}&:disabled, &.disabled{--background-button-65cb05:var(--cnvs-brand-error-base);--label-button-65cb05:var(--cnvs-brand-error-accent);--color-system-icon-583fae:var(--icon-c34400, var(--cnvs-brand-error-accent));--opacity-button-65cb05:var(--cnvs-sys-opacity-disabled);}" }
|
|
37
37
|
}, "delete-button-880e51");
|
|
38
38
|
/**
|
|
39
39
|
* Use sparingly for destructive actions that will result in data loss, can’t be undone, or will
|
|
@@ -33,11 +33,11 @@ const BaseButton_1 = require("./BaseButton");
|
|
|
33
33
|
const Button_1 = require("./Button");
|
|
34
34
|
const primaryButtonStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
35
35
|
extends: BaseButton_1.buttonStencil,
|
|
36
|
-
base: { name: "
|
|
36
|
+
base: { name: "e3032b", styles: "box-sizing:border-box;--background-button-65cb05:var(--cnvs-brand-primary-base);--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-brand-primary-accent);--color-system-icon-583fae:var(--icon-b5fb58, var(--cnvs-brand-primary-accent));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-brand-primary-base);--label-button-65cb05:var(--cnvs-brand-primary-accent);--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-inverse);--boxShadowOuter-button-65cb05:var(--cnvs-brand-common-focus-outline);--color-system-icon-583fae:var(--icon-2ae7b1, var(--cnvs-brand-primary-accent));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-brand-primary-dark);--label-button-65cb05:var(--cnvs-brand-primary-accent);--color-system-icon-583fae:var(--icon-c4b8f8, var(--cnvs-brand-primary-accent));}&:active, &.active{--background-button-65cb05:var(--cnvs-brand-primary-darkest);--label-button-65cb05:var(--cnvs-brand-primary-accent);--color-system-icon-583fae:var(--icon-93b1ce, var(--cnvs-brand-primary-accent));}&:disabled, &.disabled{--background-button-65cb05:var(--cnvs-brand-primary-base);--label-button-65cb05:var(--cnvs-brand-primary-accent);--opacity-button-65cb05:var(--cnvs-sys-opacity-disabled);--color-system-icon-583fae:var(--icon-c34400, var(--cnvs-brand-primary-accent));}" },
|
|
37
37
|
modifiers: {
|
|
38
38
|
variant: {
|
|
39
39
|
// Inverse Styles
|
|
40
|
-
inverse: { name: "
|
|
40
|
+
inverse: { name: "e3032c", styles: "--background-button-65cb05:var(--cnvs-sys-color-bg-default);--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-583fae:var(--icon-b5fb58, var(--cnvs-sys-color-fg-strong));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--boxShadowOuter-button-65cb05:var(--cnvs-sys-color-border-inverse);--color-system-icon-583fae:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-default);--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-583fae:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-stronger));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-strong);--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-583fae:var(--icon-93b1ce, var(--cnvs-sys-color-fg-stronger));}&:disabled, &.disabled{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-583fae:var(--icon-c34400, var(--cnvs-sys-color-fg-strong));}" }
|
|
41
41
|
}
|
|
42
42
|
}
|
|
43
43
|
}, "primary-button-cc7f35");
|
|
@@ -33,10 +33,10 @@ const Button_1 = require("./Button");
|
|
|
33
33
|
const icon_1 = require("@workday/canvas-kit-react/icon");
|
|
34
34
|
const secondaryButtonStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
35
35
|
extends: BaseButton_1.buttonStencil,
|
|
36
|
-
base: { name: "
|
|
36
|
+
base: { name: "e3032d", styles: "box-sizing:border-box;--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--borderRadius-button-65cb05:var(--cnvs-sys-shape-round);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--color-system-icon-583fae:var(--icon-b5fb58, var(--cnvs-sys-color-fg-strong));&:focus-visible, &.focus{--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-inverse);--boxShadowOuter-button-65cb05:var(--cnvs-brand-common-focus-outline);--color-system-icon-583fae:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-contrast-default);--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--label-button-65cb05:var(--cnvs-brand-primary-accent);--color-system-icon-583fae:var(--icon-c4b8f8, var(--cnvs-brand-primary-accent));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-contrast-strong);--border-button-65cb05:var(--cnvs-sys-color-border-contrast-strong);--label-button-65cb05:var(--cnvs-brand-primary-accent);--color-system-icon-583fae:var(--icon-93b1ce, var(--cnvs-brand-primary-accent));}&:disabled, &.disabled{--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--opacity-button-65cb05:var(--cnvs-sys-opacity-disabled);--color-system-icon-583fae:var(--icon-c34400, var(--cnvs-sys-color-fg-strong));}" },
|
|
37
37
|
modifiers: {
|
|
38
38
|
variant: {
|
|
39
|
-
inverse: { name: "
|
|
39
|
+
inverse: { name: "e3032e", styles: "--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-inverse);--label-button-65cb05:var(--cnvs-sys-color-fg-inverse);--color-system-icon-583fae:var(--icon-b5fb58, var(--cnvs-sys-color-fg-inverse));&:focus-visible, &.focus{--background-button-65cb05:var(--cnvs-sys-color-bg-default);--border-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-strong);--boxShadowInner-button-65cb05:var(--cnvs-sys-color-border-contrast-default);--boxShadowOuter-button-65cb05:var(--cnvs-sys-color-border-inverse);--color-system-icon-583fae:var(--icon-2ae7b1, var(--cnvs-sys-color-fg-strong));}&:hover, &.hover{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-default);--border-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-583fae:var(--icon-c4b8f8, var(--cnvs-sys-color-fg-stronger));}&:active, &.active{--background-button-65cb05:var(--cnvs-sys-color-bg-alt-strong);--border-button-65cb05:transparent;--label-button-65cb05:var(--cnvs-sys-color-fg-stronger);--color-system-icon-583fae:var(--icon-93b1ce, var(--cnvs-sys-color-fg-stronger));}&:disabled, &.disabled{--background-button-65cb05:transparent;--border-button-65cb05:var(--cnvs-sys-color-border-inverse);--label-button-65cb05:var(--cnvs-sys-color-fg-inverse);--color-system-icon-583fae:var(--icon-c34400, var(--cnvs-sys-color-fg-inverse));}" }
|
|
40
40
|
}
|
|
41
41
|
}
|
|
42
42
|
}, "secondary-button-e11131");
|