@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
|
@@ -6,21 +6,21 @@ import { SystemIcon, systemIconStencil } from '@workday/canvas-kit-react/icon';
|
|
|
6
6
|
import { checkSmallIcon } from '@workday/canvas-system-icons-web';
|
|
7
7
|
import { CheckBackground } from './CheckBackground';
|
|
8
8
|
const checkboxCheckStencil = createStencil({
|
|
9
|
-
base: { name: "
|
|
9
|
+
base: { name: "xgsx3m", styles: "box-sizing:border-box;display:flex;flex-direction:column;max-width:100%;pointer-events:none;transition:transform 200ms ease, opacity 200ms ease;span{margin-inline-start:calc(0.375rem * -1);transition:margin 200ms ease;}opacity:var(--cnvs-sys-opacity-zero);transform:scale(0.5);" },
|
|
10
10
|
modifiers: {
|
|
11
11
|
checked: {
|
|
12
|
-
true: { name: "
|
|
12
|
+
true: { name: "xgsx3n", styles: "--color-system-icon-583fae:var(--cnvs-brand-primary-accent);opacity:var(--cnvs-sys-opacity-full);transform:scale(1);" }
|
|
13
13
|
},
|
|
14
14
|
indeterminate: {
|
|
15
|
-
true: { name: "
|
|
15
|
+
true: { name: "xgsx3o", styles: "opacity:var(--cnvs-sys-opacity-full);transform:scale(1);" }
|
|
16
16
|
},
|
|
17
17
|
variant: {
|
|
18
|
-
inverse: { name: "
|
|
18
|
+
inverse: { name: "xgsx3p", styles: "--color-system-icon-583fae:var(--cnvs-brand-primary-base);& > div{background-color:var(--cnvs-brand-primary-base);}" }
|
|
19
19
|
}
|
|
20
20
|
}
|
|
21
21
|
}, "checkbox-check-1e6620");
|
|
22
22
|
const indeterminateBoxStencil = createStencil({
|
|
23
|
-
base: { name: "
|
|
23
|
+
base: { name: "xgsx3q", styles: "box-sizing:border-box;width:0.625rem;height:calc(var(--cnvs-sys-space-x1) / 2);background-color:var(--cnvs-brand-primary-accent);" }
|
|
24
24
|
}, "indeterminate-box-c4442f");
|
|
25
25
|
export const CheckboxCheck = createComponent('div')({
|
|
26
26
|
displayName: 'CheckboxCheck',
|
|
@@ -4,7 +4,7 @@ import { calc, createStencil, px2rem } from '@workday/canvas-kit-styling';
|
|
|
4
4
|
import { system } from '@workday/canvas-tokens-web';
|
|
5
5
|
import { LabelText } from '@workday/canvas-kit-react/text';
|
|
6
6
|
const checkboxContainerStencil = createStencil({
|
|
7
|
-
base: { name: "
|
|
7
|
+
base: { name: "xgsx3i", styles: "box-sizing:border-box;display:flex;align-items:center;min-height:var(--cnvs-sys-space-x6);position:relative;&>div{display:flex;height:calc(var(--cnvs-sys-space-x4) + 0.125rem);min-width:calc(var(--cnvs-sys-space-x4) + 0.125rem);margin-top:0.1875rem;align-self:flex-start;}& > label{padding-inline-start:var(--cnvs-sys-space-x3);}" }
|
|
8
8
|
}, "checkbox-container-a7381d");
|
|
9
9
|
export const CheckboxContainer = createComponent('div')({
|
|
10
10
|
displayName: 'CheckboxContainer',
|
|
@@ -4,22 +4,22 @@ import { calc, createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-s
|
|
|
4
4
|
import { brand, system } from '@workday/canvas-tokens-web';
|
|
5
5
|
import { checkboxBackgroundStencil } from './CheckBackground';
|
|
6
6
|
const checkboxInputStencil = createStencil({
|
|
7
|
-
base: { name: "
|
|
7
|
+
base: { name: "xgsx3r", styles: "box-sizing:border-box;border-radius:var(--cnvs-sys-shape-half);width:var(--cnvs-sys-space-x6);height:var(--cnvs-sys-space-x6);margin:var(--cnvs-sys-space-zero);margin-top:calc(0.1875rem * -1);margin-inline-start:calc(0.1875rem * -1);position:absolute;opacity:var(--cnvs-sys-opacity-zero);&:not(:disabled){cursor:pointer;}&:where(:hover,.hover) ~ span:first-of-type{box-shadow:0 0 0 0.4375rem var(--cnvs-sys-color-bg-alt-soft);}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-sys-color-border-input-strong);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-base);background-color:var(--cnvs-brand-primary-base);}&:disabled ~ div:first-of-type{border-color:var(--cnvs-sys-color-border-input-disabled);background-color:var(--cnvs-sys-color-bg-alt-softer);opacity:var(--cnvs-sys-opacity-full);}&:disabled:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-light);background-color:var(--cnvs-brand-primary-light);}&:where(:focus-visible, :active, .focus, .active){outline:none;}&:where(:focus-visible, .focus) ~ div:first-of-type{border-color:var(--cnvs-brand-primary-base);border-width:0.125rem;box-shadow:0 0 0 0px var(--cnvs-base-palette-french-vanilla-100, rgba(255,255,255,1)), 0 0 0 0px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}&:checked:focus-visible, &:indeterminate:focus-visible, &:checked.focus, &:indeterminate.focus{& ~ div:first-of-type{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);border-color:var(--cnvs-brand-primary-base);border-width:0.125rem;span{margin-inline-start:calc(0.4375rem * -1);}}}" },
|
|
8
8
|
modifiers: {
|
|
9
9
|
variant: {
|
|
10
|
-
inverse: { name: "
|
|
10
|
+
inverse: { name: "xgsx3s", styles: "& ~ span:first-of-type{opacity:var(--cnvs-sys-opacity-disabled);}& ~ div:first-of-type{border-color:var(--cnvs-sys-color-border-input-inverse);}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-sys-color-border-input-inverse);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-sys-color-border-input-inverse);background-color:var(--cnvs-sys-color-bg-default);}&:disabled ~ div:first-of-type{background-color:var(--cnvs-sys-color-bg-alt-default);opacity:var(--cnvs-sys-opacity-disabled);}&:disabled:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-sys-color-border-input-inverse);background-color:var(--cnvs-sys-color-bg-default);}&:where(:focus-visible, .focus) ~ div:first-of-type{border-color:var(--cnvs-sys-color-border-contrast-default);box-shadow:0 0 0 0px var(--cnvs-sys-color-border-contrast-default), 0 0 0 2px var(--cnvs-sys-color-border-inverse);}&:checked:focus-visible, &:checked.focus, &:indeterminate:focus-visible, &:indeterminate.focus{& ~ div:first-of-type{box-shadow:0 0 0 2px var(--cnvs-sys-color-border-contrast-default), 0 0 0 4px var(--cnvs-sys-color-border-inverse);border-color:var(--cnvs-sys-color-border-inverse);}}" }
|
|
11
11
|
},
|
|
12
12
|
disabled: {
|
|
13
|
-
true: { name: "
|
|
13
|
+
true: { name: "xgsx3t", styles: "&:where(:hover, .hover) ~ span:first-of-type{box-shadow:none;}" }
|
|
14
14
|
},
|
|
15
15
|
error: {
|
|
16
|
-
true: { name: "
|
|
16
|
+
true: { name: "xgsx3u", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border-color:var(--errorRingColorInner-checkbox-background-8c450a);box-shadow:\n 0 0 0 0.0625rem var(--errorRingColorInner-checkbox-background-8c450a),\n 0 0 0 0.125rem var(--errorRingColorOuter-checkbox-background-8c450a);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:transparent;box-shadow:\n 0 0 0 0.125rem var(--cnvs-sys-color-border-inverse),\n 0 0 0 0.25rem var(--errorRingColorInner-checkbox-background-8c450a),\n 0 0 0 0.3125rem var(--errorRingColorOuter-checkbox-background-8c450a);}&:not(:where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--errorRingColorInner-checkbox-background-8c450a);}" }
|
|
17
17
|
}
|
|
18
18
|
},
|
|
19
19
|
compound: [
|
|
20
20
|
{
|
|
21
21
|
modifiers: { variant: 'inverse', error: true },
|
|
22
|
-
styles: { name: "
|
|
22
|
+
styles: { name: "xgsx3v", styles: "&:not(:where(:focus-visible, .focus)) ~ div:first-of-type{border:0.0625rem solid var(--cnvs-sys-color-border-input-inverse);}&:not(where(:checked, :indeterminate, :disabled, :focus-visible, .focus)):where(:hover, .hover, :active, .active) ~ div:first-of-type{border-color:var(--cnvs-sys-color-border-input-inverse);}&:where(:checked, :indeterminate) ~ div:first-of-type{border-color:var(--cnvs-sys-color-border-input-inverse);}" }
|
|
23
23
|
}
|
|
24
24
|
]
|
|
25
25
|
}, "checkbox-input-d394e3");
|
|
@@ -3,7 +3,7 @@ import { createComponent } from '@workday/canvas-kit-react/common';
|
|
|
3
3
|
import { calc, createStencil, px2rem } from '@workday/canvas-kit-styling';
|
|
4
4
|
import { system } from '@workday/canvas-tokens-web';
|
|
5
5
|
const checkboxRippleStencil = createStencil({
|
|
6
|
-
base: { name: "
|
|
6
|
+
base: { name: "xgsx3h", styles: "box-sizing:border-box;border-radius:var(--cnvs-sys-shape-round);box-shadow:none;height:calc(var(--cnvs-sys-space-x4) + 0.125rem);width:calc(var(--cnvs-sys-space-x4) + 0.125rem);transition:box-shadow 150ms ease-out;position:absolute;pointer-events:none;" }
|
|
7
7
|
}, "checkbox-ripple-27671c");
|
|
8
8
|
export const CheckboxRipple = createComponent('span')({
|
|
9
9
|
displayName: 'CheckboxRipple',
|
|
@@ -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';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../collection/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAE,IAAI,EAAC,MAAM,wBAAwB,CAAC;AAC1D,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AACjD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yBAAyB,CAAC;AACxC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,oCAAoC,CAAC;AACnD,OAAO,EAAC,OAAO,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AACpD,OAAO,EAAC,2BAA2B,EAAC,MAAM,gBAAgB,CAAC;AAC3D,OAAO,EACL,sBAAsB,EACtB,qBAAqB,EACrB,UAAU,GACX,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAC,yBAAyB,EAAE,iBAAiB,EAAC,MAAM,0BAA0B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../collection/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAE,IAAI,EAAC,MAAM,wBAAwB,CAAC;AAC1D,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AACjD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yBAAyB,CAAC;AACxC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,mCAAmC,CAAC;AAClD,cAAc,oCAAoC,CAAC;AACnD,OAAO,EAAC,OAAO,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AACpD,OAAO,EAAC,2BAA2B,EAAC,MAAM,gBAAgB,CAAC;AAC3D,OAAO,EACL,sBAAsB,EACtB,qBAAqB,EACrB,UAAU,GACX,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAC,yBAAyB,EAAE,iBAAiB,EAAC,MAAM,0BAA0B,CAAC"}
|
|
@@ -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 } from './lib/ListBox';
|
|
18
19
|
export { keyboardEventToCursorEvents } from './lib/keyUtils';
|
|
@@ -22,16 +22,16 @@ export const useListBox = createElemPropsHook(useListModel)(model => {
|
|
|
22
22
|
};
|
|
23
23
|
});
|
|
24
24
|
const listBoxContainerStencil = createStencil({
|
|
25
|
-
base: { name: "
|
|
25
|
+
base: { name: "xgsx2j", styles: "box-sizing:border-box;" },
|
|
26
26
|
modifiers: {
|
|
27
27
|
orientation: {
|
|
28
|
-
vertical: { name: "
|
|
29
|
-
horizontal: { name: "
|
|
28
|
+
vertical: { name: "xgsx2k", styles: "overflow-y:auto;" },
|
|
29
|
+
horizontal: { name: "xgsx2l", styles: "overflow-y:undefined;" }
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
}, "list-box-container-625603");
|
|
33
33
|
const listBoxStencil = createStencil({
|
|
34
|
-
base: { name: "
|
|
34
|
+
base: { name: "xgsx2m", styles: "box-sizing:border-box;display:flex;flex-direction:column;margin-top:var(--cnvs-sys-space-zero);margin-bottom:var(--cnvs-sys-space-zero);" }
|
|
35
35
|
}, "list-box-9c3639");
|
|
36
36
|
/**
|
|
37
37
|
* The `ListBox` component that offers vertical rendering of a collection in the form of a
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* This elemProps hook is used for cursor navigation by using [Active
|
|
3
|
+
* Descendant](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_focus_activedescendant).
|
|
4
|
+
* This hook should be applied to List Items, not the list (use {@link useListActiveDescendant} for the list).
|
|
5
|
+
* This hook adds the focus class so that lists using `aria-activedescendant` get the correct
|
|
6
|
+
* visual cue for visual users.
|
|
7
|
+
*
|
|
8
|
+
* ```ts
|
|
9
|
+
* const useMyItem = composeHooks(
|
|
10
|
+
* useListItemActiveDescendant, // adds `aria-activedescendant` support
|
|
11
|
+
* useListItemRegister
|
|
12
|
+
* );
|
|
13
|
+
```
|
|
14
|
+
*/
|
|
15
|
+
export declare const useListItemActiveDescendant: import("@workday/canvas-kit-react/common").BehaviorHook<{
|
|
16
|
+
state: {
|
|
17
|
+
cursorId: string;
|
|
18
|
+
columnCount: number;
|
|
19
|
+
pageSizeRef: import("react").MutableRefObject<number>;
|
|
20
|
+
cursorIndexRef: {
|
|
21
|
+
readonly current: number;
|
|
22
|
+
};
|
|
23
|
+
UNSTABLE_virtual: {
|
|
24
|
+
virtualItems: import("./react-virtual").VirtualItem[];
|
|
25
|
+
totalSize: number;
|
|
26
|
+
scrollToOffset: (index: number, options?: import("./react-virtual").ScrollToOffsetOptions | undefined) => void;
|
|
27
|
+
scrollToIndex: (index: number, options?: import("./react-virtual").ScrollToIndexOptions | undefined) => void;
|
|
28
|
+
measure: () => void;
|
|
29
|
+
};
|
|
30
|
+
UNSTABLE_defaultItemHeight: number;
|
|
31
|
+
containerRef: import("react").RefObject<HTMLDivElement>;
|
|
32
|
+
id: string;
|
|
33
|
+
orientation: "horizontal" | "vertical";
|
|
34
|
+
indexRef: import("react").MutableRefObject<number>;
|
|
35
|
+
nonInteractiveIds: string[];
|
|
36
|
+
isVirtualized: boolean;
|
|
37
|
+
items: import("./useBaseListModel").Item<any>[];
|
|
38
|
+
};
|
|
39
|
+
events: {
|
|
40
|
+
goTo(data: {
|
|
41
|
+
id: string;
|
|
42
|
+
}): void;
|
|
43
|
+
goToNext(): void;
|
|
44
|
+
goToPrevious(): void;
|
|
45
|
+
goToPreviousRow(): void;
|
|
46
|
+
goToNextRow(): void;
|
|
47
|
+
goToFirst(): void;
|
|
48
|
+
goToLast(): void;
|
|
49
|
+
goToFirstOfRow(): void;
|
|
50
|
+
goToLastOfRow(): void;
|
|
51
|
+
goToNextPage(): void;
|
|
52
|
+
goToPreviousPage(): void;
|
|
53
|
+
registerItem(data: {
|
|
54
|
+
item: any;
|
|
55
|
+
textValue: string;
|
|
56
|
+
}): void;
|
|
57
|
+
unregisterItem(data: {
|
|
58
|
+
id: string;
|
|
59
|
+
}): void;
|
|
60
|
+
updateItemHeight(data: {
|
|
61
|
+
value: number;
|
|
62
|
+
}): void;
|
|
63
|
+
};
|
|
64
|
+
navigation: import("./useCursorListModel").NavigationManager;
|
|
65
|
+
getId: (item: any) => string;
|
|
66
|
+
}, {
|
|
67
|
+
className: string;
|
|
68
|
+
}>;
|
|
69
|
+
//# sourceMappingURL=useListItemActiveDescendant.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useListItemActiveDescendant.d.ts","sourceRoot":"","sources":["../../../../collection/lib/useListItemActiveDescendant.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAOvC,CAAC"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { createElemPropsHook } from '@workday/canvas-kit-react/common';
|
|
2
|
+
import { useCursorListModel } from './useCursorListModel';
|
|
3
|
+
/**
|
|
4
|
+
* This elemProps hook is used for cursor navigation by using [Active
|
|
5
|
+
* Descendant](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_focus_activedescendant).
|
|
6
|
+
* This hook should be applied to List Items, not the list (use {@link useListActiveDescendant} for the list).
|
|
7
|
+
* This hook adds the focus class so that lists using `aria-activedescendant` get the correct
|
|
8
|
+
* visual cue for visual users.
|
|
9
|
+
*
|
|
10
|
+
* ```ts
|
|
11
|
+
* const useMyItem = composeHooks(
|
|
12
|
+
* useListItemActiveDescendant, // adds `aria-activedescendant` support
|
|
13
|
+
* useListItemRegister
|
|
14
|
+
* );
|
|
15
|
+
```
|
|
16
|
+
*/
|
|
17
|
+
export const useListItemActiveDescendant = createElemPropsHook(useCursorListModel)((model, _ref, elemProps = {}) => {
|
|
18
|
+
const id = elemProps['data-id'] || '';
|
|
19
|
+
return {
|
|
20
|
+
className: model.state.cursorId && model.state.cursorId === id ? 'focus' : '',
|
|
21
|
+
};
|
|
22
|
+
});
|
|
@@ -1915,7 +1915,7 @@ export declare const Combobox: import("@workday/canvas-kit-react/common").Compon
|
|
|
1915
1915
|
navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
|
|
1916
1916
|
getId: (item: any) => string;
|
|
1917
1917
|
}>;
|
|
1918
|
-
Item: import("@workday/canvas-kit-react/common").ElementComponentM<"li", import("
|
|
1918
|
+
Item: import("@workday/canvas-kit-react/common").ElementComponentM<"li", import("../../menu/lib/MenuOption").MenuOptionProps, {
|
|
1919
1919
|
state: {
|
|
1920
1920
|
stackRef: React.RefObject<HTMLDivElement>;
|
|
1921
1921
|
targetRef: React.RefObject<HTMLButtonElement>;
|
|
@@ -1947,12 +1947,8 @@ export declare const Combobox: import("@workday/canvas-kit-react/common").Compon
|
|
|
1947
1947
|
isVirtualized: boolean;
|
|
1948
1948
|
items: import("../..").Item<any>[];
|
|
1949
1949
|
mode: "multiple" | "single";
|
|
1950
|
-
value: string | undefined;
|
|
1951
|
-
inputRef: React.RefObject<HTMLInputElement>;
|
|
1952
|
-
width: number;
|
|
1953
1950
|
};
|
|
1954
1951
|
events: {
|
|
1955
|
-
setWidth(width: number): void;
|
|
1956
1952
|
updatePlacement(data: {
|
|
1957
1953
|
placement: import("@popperjs/core").Placement;
|
|
1958
1954
|
}): void;
|
|
@@ -1987,88 +1983,14 @@ export declare const Combobox: import("@workday/canvas-kit-react/common").Compon
|
|
|
1987
1983
|
value: number;
|
|
1988
1984
|
}): void;
|
|
1989
1985
|
};
|
|
1990
|
-
onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
1991
1986
|
selection: import("../../collection/lib/useSelectionListModel").SelectionManager;
|
|
1992
1987
|
navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
|
|
1993
1988
|
getId: (item: any) => string;
|
|
1994
1989
|
}> & {
|
|
1995
|
-
Icon:
|
|
1996
|
-
|
|
1997
|
-
|
|
1998
|
-
|
|
1999
|
-
initialFocusRef: React.RefObject<any> | undefined;
|
|
2000
|
-
returnFocusRef: React.RefObject<any> | undefined;
|
|
2001
|
-
placement: import("@popperjs/core").Placement;
|
|
2002
|
-
id: string;
|
|
2003
|
-
visibility: "hidden" | "visible";
|
|
2004
|
-
selectedIds: string[] | "all";
|
|
2005
|
-
unselectedIds: string[];
|
|
2006
|
-
cursorId: string;
|
|
2007
|
-
columnCount: number;
|
|
2008
|
-
pageSizeRef: React.MutableRefObject<number>;
|
|
2009
|
-
cursorIndexRef: {
|
|
2010
|
-
readonly current: number;
|
|
2011
|
-
};
|
|
2012
|
-
UNSTABLE_virtual: {
|
|
2013
|
-
virtualItems: import("../../collection/lib/react-virtual").VirtualItem[];
|
|
2014
|
-
totalSize: number;
|
|
2015
|
-
scrollToOffset: (index: number, options?: import("../../collection/lib/react-virtual").ScrollToOffsetOptions | undefined) => void;
|
|
2016
|
-
scrollToIndex: (index: number, options?: import("../../collection/lib/react-virtual").ScrollToIndexOptions | undefined) => void;
|
|
2017
|
-
measure: () => void;
|
|
2018
|
-
};
|
|
2019
|
-
UNSTABLE_defaultItemHeight: number;
|
|
2020
|
-
containerRef: React.RefObject<HTMLDivElement>;
|
|
2021
|
-
orientation: "horizontal" | "vertical";
|
|
2022
|
-
indexRef: React.MutableRefObject<number>;
|
|
2023
|
-
nonInteractiveIds: string[];
|
|
2024
|
-
isVirtualized: boolean;
|
|
2025
|
-
items: import("../..").Item<any>[];
|
|
2026
|
-
mode: "multiple" | "single";
|
|
2027
|
-
value: string | undefined;
|
|
2028
|
-
inputRef: React.RefObject<HTMLInputElement>;
|
|
2029
|
-
width: number;
|
|
2030
|
-
};
|
|
2031
|
-
events: {
|
|
2032
|
-
setWidth(width: number): void;
|
|
2033
|
-
updatePlacement(data: {
|
|
2034
|
-
placement: import("@popperjs/core").Placement;
|
|
2035
|
-
}): void;
|
|
2036
|
-
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
2037
|
-
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
2038
|
-
select(data: {
|
|
2039
|
-
id: string;
|
|
2040
|
-
}): void;
|
|
2041
|
-
selectAll(): void;
|
|
2042
|
-
unselectAll(): void;
|
|
2043
|
-
goTo(data: {
|
|
2044
|
-
id: string;
|
|
2045
|
-
}): void;
|
|
2046
|
-
goToNext(): void;
|
|
2047
|
-
goToPrevious(): void;
|
|
2048
|
-
goToPreviousRow(): void;
|
|
2049
|
-
goToNextRow(): void;
|
|
2050
|
-
goToFirst(): void;
|
|
2051
|
-
goToLast(): void;
|
|
2052
|
-
goToFirstOfRow(): void;
|
|
2053
|
-
goToLastOfRow(): void;
|
|
2054
|
-
goToNextPage(): void;
|
|
2055
|
-
goToPreviousPage(): void;
|
|
2056
|
-
registerItem(data: {
|
|
2057
|
-
item: any;
|
|
2058
|
-
textValue: string;
|
|
2059
|
-
}): void;
|
|
2060
|
-
unregisterItem(data: {
|
|
2061
|
-
id: string;
|
|
2062
|
-
}): void;
|
|
2063
|
-
updateItemHeight(data: {
|
|
2064
|
-
value: number;
|
|
2065
|
-
}): void;
|
|
2066
|
-
};
|
|
2067
|
-
onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
2068
|
-
selection: import("../../collection/lib/useSelectionListModel").SelectionManager;
|
|
2069
|
-
navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
|
|
2070
|
-
getId: (item: any) => string;
|
|
2071
|
-
}>;
|
|
1990
|
+
Icon: (elemProps: import("../..").SystemIconProps) => React.JSX.Element;
|
|
1991
|
+
Text: ({ children }: {
|
|
1992
|
+
children?: React.ReactNode;
|
|
1993
|
+
}) => React.JSX.Element;
|
|
2072
1994
|
};
|
|
2073
1995
|
Card: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("./ComboboxCard").ComboboxCardProps, {
|
|
2074
1996
|
state: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIjB;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG
|
|
1
|
+
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIjB;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}
|
|
@@ -264,7 +264,7 @@ export declare const ComboboxMenu: import("@workday/canvas-kit-react/common").El
|
|
|
264
264
|
* `Combobox.Menu.List` and will be passed to the optional `onSelect` callback of the
|
|
265
265
|
* `ComboboxModel`. `Combobox.Menu.Item` can contain any HTML.
|
|
266
266
|
*/
|
|
267
|
-
Item: import("@workday/canvas-kit-react/common").ElementComponentM<"li", import("
|
|
267
|
+
Item: import("@workday/canvas-kit-react/common").ElementComponentM<"li", import("../../menu/lib/MenuOption").MenuOptionProps, {
|
|
268
268
|
state: {
|
|
269
269
|
stackRef: React.RefObject<HTMLDivElement>;
|
|
270
270
|
targetRef: React.RefObject<HTMLButtonElement>;
|
|
@@ -296,12 +296,8 @@ export declare const ComboboxMenu: import("@workday/canvas-kit-react/common").El
|
|
|
296
296
|
isVirtualized: boolean;
|
|
297
297
|
items: import("../..").Item<any>[];
|
|
298
298
|
mode: "multiple" | "single";
|
|
299
|
-
value: string | undefined;
|
|
300
|
-
inputRef: React.RefObject<HTMLInputElement>;
|
|
301
|
-
width: number;
|
|
302
299
|
};
|
|
303
300
|
events: {
|
|
304
|
-
setWidth(width: number): void;
|
|
305
301
|
updatePlacement(data: {
|
|
306
302
|
placement: import("@popperjs/core").Placement;
|
|
307
303
|
}): void;
|
|
@@ -336,88 +332,14 @@ export declare const ComboboxMenu: import("@workday/canvas-kit-react/common").El
|
|
|
336
332
|
value: number;
|
|
337
333
|
}): void;
|
|
338
334
|
};
|
|
339
|
-
onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
340
335
|
selection: import("../../collection/lib/useSelectionListModel").SelectionManager;
|
|
341
336
|
navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
|
|
342
337
|
getId: (item: any) => string;
|
|
343
338
|
}> & {
|
|
344
|
-
Icon:
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
initialFocusRef: React.RefObject<any> | undefined;
|
|
349
|
-
returnFocusRef: React.RefObject<any> | undefined;
|
|
350
|
-
placement: import("@popperjs/core").Placement;
|
|
351
|
-
id: string;
|
|
352
|
-
visibility: "hidden" | "visible";
|
|
353
|
-
selectedIds: string[] | "all";
|
|
354
|
-
unselectedIds: string[];
|
|
355
|
-
cursorId: string;
|
|
356
|
-
columnCount: number;
|
|
357
|
-
pageSizeRef: React.MutableRefObject<number>;
|
|
358
|
-
cursorIndexRef: {
|
|
359
|
-
readonly current: number;
|
|
360
|
-
};
|
|
361
|
-
UNSTABLE_virtual: {
|
|
362
|
-
virtualItems: import("../../collection/lib/react-virtual").VirtualItem[];
|
|
363
|
-
totalSize: number;
|
|
364
|
-
scrollToOffset: (index: number, options?: import("../../collection/lib/react-virtual").ScrollToOffsetOptions | undefined) => void;
|
|
365
|
-
scrollToIndex: (index: number, options?: import("../../collection/lib/react-virtual").ScrollToIndexOptions | undefined) => void;
|
|
366
|
-
measure: () => void;
|
|
367
|
-
};
|
|
368
|
-
UNSTABLE_defaultItemHeight: number;
|
|
369
|
-
containerRef: React.RefObject<HTMLDivElement>;
|
|
370
|
-
orientation: "horizontal" | "vertical";
|
|
371
|
-
indexRef: React.MutableRefObject<number>;
|
|
372
|
-
nonInteractiveIds: string[];
|
|
373
|
-
isVirtualized: boolean;
|
|
374
|
-
items: import("../..").Item<any>[];
|
|
375
|
-
mode: "multiple" | "single";
|
|
376
|
-
value: string | undefined;
|
|
377
|
-
inputRef: React.RefObject<HTMLInputElement>;
|
|
378
|
-
width: number;
|
|
379
|
-
};
|
|
380
|
-
events: {
|
|
381
|
-
setWidth(width: number): void;
|
|
382
|
-
updatePlacement(data: {
|
|
383
|
-
placement: import("@popperjs/core").Placement;
|
|
384
|
-
}): void;
|
|
385
|
-
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
386
|
-
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
387
|
-
select(data: {
|
|
388
|
-
id: string;
|
|
389
|
-
}): void;
|
|
390
|
-
selectAll(): void;
|
|
391
|
-
unselectAll(): void;
|
|
392
|
-
goTo(data: {
|
|
393
|
-
id: string;
|
|
394
|
-
}): void;
|
|
395
|
-
goToNext(): void;
|
|
396
|
-
goToPrevious(): void;
|
|
397
|
-
goToPreviousRow(): void;
|
|
398
|
-
goToNextRow(): void;
|
|
399
|
-
goToFirst(): void;
|
|
400
|
-
goToLast(): void;
|
|
401
|
-
goToFirstOfRow(): void;
|
|
402
|
-
goToLastOfRow(): void;
|
|
403
|
-
goToNextPage(): void;
|
|
404
|
-
goToPreviousPage(): void;
|
|
405
|
-
registerItem(data: {
|
|
406
|
-
item: any;
|
|
407
|
-
textValue: string;
|
|
408
|
-
}): void;
|
|
409
|
-
unregisterItem(data: {
|
|
410
|
-
id: string;
|
|
411
|
-
}): void;
|
|
412
|
-
updateItemHeight(data: {
|
|
413
|
-
value: number;
|
|
414
|
-
}): void;
|
|
415
|
-
};
|
|
416
|
-
onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
417
|
-
selection: import("../../collection/lib/useSelectionListModel").SelectionManager;
|
|
418
|
-
navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
|
|
419
|
-
getId: (item: any) => string;
|
|
420
|
-
}>;
|
|
339
|
+
Icon: (elemProps: import("../..").SystemIconProps) => React.JSX.Element;
|
|
340
|
+
Text: ({ children }: {
|
|
341
|
+
children?: React.ReactNode;
|
|
342
|
+
}) => React.JSX.Element;
|
|
421
343
|
};
|
|
422
344
|
/**
|
|
423
345
|
* `Combobox.Menu.Card` is a non-semantic element used to give the dropdown menu its distinct visual
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxMenu.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"ComboboxMenu.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGrB;;;;;;OAMG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;;;;OAoBG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAML,CAAC"}
|
|
@@ -3,7 +3,6 @@ import { createSubcomponent } from '@workday/canvas-kit-react/common';
|
|
|
3
3
|
import { Menu } from '@workday/canvas-kit-react/menu';
|
|
4
4
|
import { useComboboxModel } from './hooks/useComboboxModel';
|
|
5
5
|
import { ComboboxMenuList } from './ComboboxMenuList';
|
|
6
|
-
import { ComboboxMenuItem } from './ComboboxMenuItem';
|
|
7
6
|
import { ComboboxCard } from './ComboboxCard';
|
|
8
7
|
import { ComboboxMenuPopper } from './ComboboxPopper';
|
|
9
8
|
export const ComboboxMenu = createSubcomponent()({
|
|
@@ -44,7 +43,7 @@ export const ComboboxMenu = createSubcomponent()({
|
|
|
44
43
|
* `Combobox.Menu.List` and will be passed to the optional `onSelect` callback of the
|
|
45
44
|
* `ComboboxModel`. `Combobox.Menu.Item` can contain any HTML.
|
|
46
45
|
*/
|
|
47
|
-
Item:
|
|
46
|
+
Item: Menu.Option,
|
|
48
47
|
/**
|
|
49
48
|
* `Combobox.Menu.Card` is a non-semantic element used to give the dropdown menu its distinct visual
|
|
50
49
|
* cue that the dropdown menu is floating above other content. `Combobox.Menu.Card` usually contains a
|