@workday/canvas-kit-react 15.1.6 → 15.1.9
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 +2 -1
- package/collection/lib/ListBox.tsx +1 -1
- package/collection/lib/isElementDisabled.ts +16 -0
- package/collection/lib/useListItemSelect.tsx +5 -5
- package/collection/lib/useOverflowListModel.tsx +10 -3
- package/dist/commonjs/action-bar/lib/ActionBarList.js +1 -1
- package/dist/commonjs/action-bar/lib/ActionBarOverflowButton.js +1 -1
- package/dist/commonjs/avatar/lib/Avatar.js +13 -13
- package/dist/commonjs/avatar/lib/AvatarImage.js +1 -1
- package/dist/commonjs/avatar/lib/AvatarName.js +1 -1
- package/dist/commonjs/avatar/lib/BaseAvatar.js +12 -12
- package/dist/commonjs/badge/lib/CountBadge.js +6 -6
- package/dist/commonjs/banner/lib/Banner.js +5 -5
- package/dist/commonjs/banner/lib/BannerActionText.js +2 -2
- package/dist/commonjs/banner/lib/BannerIcon.js +1 -1
- package/dist/commonjs/banner/lib/BannerLabel.js +1 -1
- package/dist/commonjs/breadcrumbs/lib/BreadcrumbsCurrentItem.js +1 -1
- package/dist/commonjs/breadcrumbs/lib/BreadcrumbsItem.js +1 -1
- package/dist/commonjs/breadcrumbs/lib/BreadcrumbsLink.js +1 -1
- package/dist/commonjs/breadcrumbs/lib/BreadcrumbsList.js +1 -1
- package/dist/commonjs/breadcrumbs/lib/BreadcrumbsMenu.js +2 -2
- package/dist/commonjs/breadcrumbs/lib/BreadcrumbsOverflowButton.js +1 -1
- package/dist/commonjs/button/lib/BaseButton.js +21 -21
- package/dist/commonjs/button/lib/DeleteButton.js +1 -1
- package/dist/commonjs/button/lib/ExternalHyperlink.js +1 -1
- package/dist/commonjs/button/lib/Hyperlink.js +4 -4
- 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 +17 -17
- package/dist/commonjs/button/lib/ToolbarDropdownButton.js +3 -3
- package/dist/commonjs/button/lib/ToolbarIconButton.js +1 -1
- package/dist/commonjs/button/lib/parts/ButtonLabel.js +1 -1
- package/dist/commonjs/button/lib/parts/ButtonLabelIcon.js +5 -5
- package/dist/commonjs/card/lib/Card.js +3 -3
- 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 +6 -6
- package/dist/commonjs/checkbox/lib/CheckboxCheck.js +6 -6
- 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 +2 -1
- package/dist/commonjs/collection/index.d.ts.map +1 -1
- package/dist/commonjs/collection/index.js +3 -1
- package/dist/commonjs/collection/lib/ListBox.d.ts +15 -0
- package/dist/commonjs/collection/lib/ListBox.d.ts.map +1 -1
- package/dist/commonjs/collection/lib/ListBox.js +8 -8
- package/dist/commonjs/collection/lib/isElementDisabled.d.ts +12 -0
- package/dist/commonjs/collection/lib/isElementDisabled.d.ts.map +1 -0
- package/dist/commonjs/collection/lib/isElementDisabled.js +20 -0
- package/dist/commonjs/collection/lib/useListItemSelect.d.ts +1 -1
- package/dist/commonjs/collection/lib/useListItemSelect.d.ts.map +1 -1
- package/dist/commonjs/collection/lib/useListItemSelect.js +5 -3
- package/dist/commonjs/collection/lib/useOverflowListModel.d.ts.map +1 -1
- package/dist/commonjs/collection/lib/useOverflowListModel.js +10 -3
- package/dist/commonjs/color-picker/lib/ColorInput.js +3 -3
- package/dist/commonjs/color-picker/lib/ColorPreview.js +1 -1
- package/dist/commonjs/color-picker/lib/parts/ColorSwatch.js +2 -2
- package/dist/commonjs/combobox/lib/ComboboxCard.js +1 -1
- 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/common/lib/EllipsisText.js +1 -1
- package/dist/commonjs/expandable/lib/Expandable.js +1 -1
- package/dist/commonjs/expandable/lib/ExpandableAvatar.js +1 -1
- package/dist/commonjs/expandable/lib/ExpandableContent.js +1 -1
- package/dist/commonjs/expandable/lib/ExpandableIcon.js +10 -10
- package/dist/commonjs/expandable/lib/ExpandableTarget.js +1 -1
- package/dist/commonjs/expandable/lib/ExpandableTitle.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 +6 -6
- 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/ExpressiveIcon.js +1 -1
- package/dist/commonjs/icon/lib/Graphic.js +4 -4
- package/dist/commonjs/icon/lib/Svg.js +3 -3
- package/dist/commonjs/icon/lib/SystemIcon.js +1 -1
- package/dist/commonjs/icon/lib/SystemIconCircle.js +2 -2
- package/dist/commonjs/information-highlight/lib/InformationHighlight.js +7 -7
- package/dist/commonjs/information-highlight/lib/parts/Body.js +1 -1
- package/dist/commonjs/information-highlight/lib/parts/Heading.js +1 -1
- package/dist/commonjs/information-highlight/lib/parts/Link.js +1 -1
- package/dist/commonjs/loading-dots/lib/LoadingDots.js +3 -3
- package/dist/commonjs/menu/lib/MenuCard.d.ts +18 -18
- package/dist/commonjs/menu/lib/MenuCard.d.ts.map +1 -1
- package/dist/commonjs/menu/lib/MenuCard.js +3 -2
- package/dist/commonjs/menu/lib/MenuDivider.js +1 -1
- package/dist/commonjs/menu/lib/MenuGroup.js +1 -1
- package/dist/commonjs/menu/lib/MenuItem.d.ts +2 -2
- package/dist/commonjs/menu/lib/MenuItem.d.ts.map +1 -1
- package/dist/commonjs/menu/lib/MenuItem.js +29 -6
- package/dist/commonjs/menu/lib/MenuList.d.ts.map +1 -1
- package/dist/commonjs/menu/lib/MenuList.js +5 -5
- package/dist/commonjs/menu/lib/Submenu.d.ts +1 -1
- package/dist/commonjs/menu/lib/Submenu.d.ts.map +1 -1
- package/dist/commonjs/menu/lib/Submenu.js +26 -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/pagination/lib/Pagination/AdditionalDetails.js +2 -2
- package/dist/commonjs/pagination/lib/Pagination/Controls.js +2 -2
- package/dist/commonjs/pagination/lib/Pagination/GoTo/Form.js +1 -1
- package/dist/commonjs/pagination/lib/Pagination/GoTo/Label.js +1 -1
- package/dist/commonjs/pagination/lib/Pagination/GoTo/TextInput.js +1 -1
- package/dist/commonjs/pagination/lib/Pagination/Nav.js +1 -1
- package/dist/commonjs/pagination/lib/Pagination/PageButton.js +2 -2
- package/dist/commonjs/pagination/lib/Pagination/PageList.js +1 -1
- package/dist/commonjs/pagination/lib/Pagination/Pagination.js +1 -1
- package/dist/commonjs/pagination/lib/Pagination/common/List.js +2 -2
- package/dist/commonjs/pill/lib/Pill.js +3 -3
- package/dist/commonjs/pill/lib/PillAvatar.js +1 -1
- package/dist/commonjs/pill/lib/PillCount.js +1 -1
- package/dist/commonjs/pill/lib/PillIcon.js +1 -1
- package/dist/commonjs/pill/lib/PillIconButton.js +1 -1
- package/dist/commonjs/pill/lib/PillLabel.js +1 -1
- 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/popup/lib/hooks/useDisableBodyScroll.js +1 -1
- package/dist/commonjs/segmented-control/lib/SegmentedControlItem.js +16 -16
- package/dist/commonjs/segmented-control/lib/SegmentedControlList.js +3 -3
- package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlItem.d.ts +1 -1
- package/dist/commonjs/select/lib/SelectCard.js +1 -1
- package/dist/commonjs/select/lib/SelectInput.js +3 -3
- package/dist/commonjs/side-panel/lib/SidePanel.js +7 -7
- package/dist/commonjs/side-panel/lib/SidePanelHeading.js +3 -3
- package/dist/commonjs/side-panel/lib/SidePanelToggleButton.js +10 -10
- package/dist/commonjs/skeleton/lib/Skeleton.js +2 -2
- package/dist/commonjs/skeleton/lib/parts/SkeletonHeader.js +1 -1
- package/dist/commonjs/skeleton/lib/parts/SkeletonShape.js +1 -1
- package/dist/commonjs/skeleton/lib/parts/SkeletonText.js +1 -1
- package/dist/commonjs/switch/lib/Switch.js +7 -7
- package/dist/commonjs/table/lib/BaseTable.js +1 -1
- package/dist/commonjs/table/lib/Table.js +7 -7
- package/dist/commonjs/table/lib/parts/BaseTableBody.js +1 -1
- package/dist/commonjs/table/lib/parts/BaseTableCaption.js +1 -1
- package/dist/commonjs/table/lib/parts/BaseTableCell.js +1 -1
- package/dist/commonjs/table/lib/parts/BaseTableHead.js +1 -1
- package/dist/commonjs/table/lib/parts/BaseTableHeader.js +1 -1
- package/dist/commonjs/table/lib/parts/css-grid-table/TableRow.js +1 -1
- package/dist/commonjs/tabs/lib/TabsItem.d.ts +1 -1
- package/dist/commonjs/tabs/lib/TabsItem.js +1 -1
- package/dist/commonjs/tabs/lib/TabsList.js +8 -8
- package/dist/commonjs/tabs/lib/TabsOverflowButton.js +1 -1
- package/dist/commonjs/tabs/lib/useTabsModel.d.ts.map +1 -1
- package/dist/commonjs/tabs/lib/useTabsModel.js +9 -3
- package/dist/commonjs/testing/lib/ComponentStatesTable.js +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/commonjs/tooltip/lib/TooltipContainer.js +3 -3
- package/dist/commonjs/version/lib/version.js +1 -1
- package/dist/es6/action-bar/lib/ActionBarList.js +1 -1
- package/dist/es6/action-bar/lib/ActionBarOverflowButton.js +1 -1
- package/dist/es6/avatar/lib/Avatar.js +13 -13
- package/dist/es6/avatar/lib/AvatarImage.js +1 -1
- package/dist/es6/avatar/lib/AvatarName.js +1 -1
- package/dist/es6/avatar/lib/BaseAvatar.js +12 -12
- package/dist/es6/badge/lib/CountBadge.js +6 -6
- package/dist/es6/banner/lib/Banner.js +5 -5
- package/dist/es6/banner/lib/BannerActionText.js +2 -2
- package/dist/es6/banner/lib/BannerIcon.js +1 -1
- package/dist/es6/banner/lib/BannerLabel.js +1 -1
- package/dist/es6/breadcrumbs/lib/BreadcrumbsCurrentItem.js +1 -1
- package/dist/es6/breadcrumbs/lib/BreadcrumbsItem.js +1 -1
- package/dist/es6/breadcrumbs/lib/BreadcrumbsLink.js +1 -1
- package/dist/es6/breadcrumbs/lib/BreadcrumbsList.js +1 -1
- package/dist/es6/breadcrumbs/lib/BreadcrumbsMenu.js +2 -2
- package/dist/es6/breadcrumbs/lib/BreadcrumbsOverflowButton.js +1 -1
- package/dist/es6/button/lib/BaseButton.js +21 -21
- package/dist/es6/button/lib/DeleteButton.js +1 -1
- package/dist/es6/button/lib/ExternalHyperlink.js +1 -1
- package/dist/es6/button/lib/Hyperlink.js +4 -4
- 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 +17 -17
- package/dist/es6/button/lib/ToolbarDropdownButton.js +3 -3
- package/dist/es6/button/lib/ToolbarIconButton.js +1 -1
- package/dist/es6/button/lib/parts/ButtonLabel.js +1 -1
- package/dist/es6/button/lib/parts/ButtonLabelIcon.js +5 -5
- package/dist/es6/card/lib/Card.js +3 -3
- 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 +6 -6
- package/dist/es6/checkbox/lib/CheckboxCheck.js +6 -6
- 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 +2 -1
- package/dist/es6/collection/index.d.ts.map +1 -1
- package/dist/es6/collection/index.js +2 -1
- package/dist/es6/collection/lib/ListBox.d.ts +15 -0
- package/dist/es6/collection/lib/ListBox.d.ts.map +1 -1
- package/dist/es6/collection/lib/ListBox.js +5 -5
- package/dist/es6/collection/lib/isElementDisabled.d.ts +12 -0
- package/dist/es6/collection/lib/isElementDisabled.d.ts.map +1 -0
- package/dist/es6/collection/lib/isElementDisabled.js +16 -0
- package/dist/es6/collection/lib/useListItemSelect.d.ts +1 -1
- package/dist/es6/collection/lib/useListItemSelect.d.ts.map +1 -1
- package/dist/es6/collection/lib/useListItemSelect.js +5 -3
- package/dist/es6/collection/lib/useOverflowListModel.d.ts.map +1 -1
- package/dist/es6/collection/lib/useOverflowListModel.js +10 -3
- package/dist/es6/color-picker/lib/ColorInput.js +3 -3
- package/dist/es6/color-picker/lib/ColorPreview.js +1 -1
- package/dist/es6/color-picker/lib/parts/ColorSwatch.js +2 -2
- package/dist/es6/combobox/lib/ComboboxCard.js +1 -1
- 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/common/lib/EllipsisText.js +1 -1
- package/dist/es6/expandable/lib/Expandable.js +1 -1
- package/dist/es6/expandable/lib/ExpandableAvatar.js +1 -1
- package/dist/es6/expandable/lib/ExpandableContent.js +1 -1
- package/dist/es6/expandable/lib/ExpandableIcon.js +10 -10
- package/dist/es6/expandable/lib/ExpandableTarget.js +1 -1
- package/dist/es6/expandable/lib/ExpandableTitle.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 +6 -6
- 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/ExpressiveIcon.js +1 -1
- package/dist/es6/icon/lib/Graphic.js +4 -4
- package/dist/es6/icon/lib/Svg.js +3 -3
- package/dist/es6/icon/lib/SystemIcon.js +1 -1
- package/dist/es6/icon/lib/SystemIconCircle.js +2 -2
- package/dist/es6/information-highlight/lib/InformationHighlight.js +7 -7
- package/dist/es6/information-highlight/lib/parts/Body.js +1 -1
- package/dist/es6/information-highlight/lib/parts/Heading.js +1 -1
- package/dist/es6/information-highlight/lib/parts/Link.js +1 -1
- package/dist/es6/loading-dots/lib/LoadingDots.js +3 -3
- package/dist/es6/menu/lib/MenuCard.d.ts +18 -18
- package/dist/es6/menu/lib/MenuCard.d.ts.map +1 -1
- package/dist/es6/menu/lib/MenuCard.js +4 -3
- package/dist/es6/menu/lib/MenuDivider.js +1 -1
- package/dist/es6/menu/lib/MenuGroup.js +1 -1
- package/dist/es6/menu/lib/MenuItem.d.ts +2 -2
- package/dist/es6/menu/lib/MenuItem.d.ts.map +1 -1
- package/dist/es6/menu/lib/MenuItem.js +31 -8
- package/dist/es6/menu/lib/MenuList.d.ts.map +1 -1
- package/dist/es6/menu/lib/MenuList.js +5 -5
- package/dist/es6/menu/lib/Submenu.d.ts +1 -1
- package/dist/es6/menu/lib/Submenu.d.ts.map +1 -1
- package/dist/es6/menu/lib/Submenu.js +27 -1
- 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/pagination/lib/Pagination/AdditionalDetails.js +2 -2
- package/dist/es6/pagination/lib/Pagination/Controls.js +2 -2
- package/dist/es6/pagination/lib/Pagination/GoTo/Form.js +1 -1
- package/dist/es6/pagination/lib/Pagination/GoTo/Label.js +1 -1
- package/dist/es6/pagination/lib/Pagination/GoTo/TextInput.js +1 -1
- package/dist/es6/pagination/lib/Pagination/Nav.js +1 -1
- package/dist/es6/pagination/lib/Pagination/PageButton.js +2 -2
- package/dist/es6/pagination/lib/Pagination/PageList.js +1 -1
- package/dist/es6/pagination/lib/Pagination/Pagination.js +1 -1
- package/dist/es6/pagination/lib/Pagination/common/List.js +2 -2
- package/dist/es6/pill/lib/Pill.js +3 -3
- package/dist/es6/pill/lib/PillAvatar.js +1 -1
- package/dist/es6/pill/lib/PillCount.js +1 -1
- package/dist/es6/pill/lib/PillIcon.js +1 -1
- package/dist/es6/pill/lib/PillIconButton.js +1 -1
- package/dist/es6/pill/lib/PillLabel.js +1 -1
- 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/popup/lib/hooks/useDisableBodyScroll.js +1 -1
- package/dist/es6/segmented-control/lib/SegmentedControlItem.js +16 -16
- package/dist/es6/segmented-control/lib/SegmentedControlList.js +3 -3
- package/dist/es6/segmented-control/lib/hooks/useSegmentedControlItem.d.ts +1 -1
- package/dist/es6/select/lib/SelectCard.js +1 -1
- package/dist/es6/select/lib/SelectInput.js +3 -3
- package/dist/es6/side-panel/lib/SidePanel.js +7 -7
- package/dist/es6/side-panel/lib/SidePanelHeading.js +3 -3
- package/dist/es6/side-panel/lib/SidePanelToggleButton.js +10 -10
- package/dist/es6/skeleton/lib/Skeleton.js +2 -2
- package/dist/es6/skeleton/lib/parts/SkeletonHeader.js +1 -1
- package/dist/es6/skeleton/lib/parts/SkeletonShape.js +1 -1
- package/dist/es6/skeleton/lib/parts/SkeletonText.js +1 -1
- package/dist/es6/switch/lib/Switch.js +7 -7
- package/dist/es6/table/lib/BaseTable.js +1 -1
- package/dist/es6/table/lib/Table.js +7 -7
- package/dist/es6/table/lib/parts/BaseTableBody.js +1 -1
- package/dist/es6/table/lib/parts/BaseTableCaption.js +1 -1
- package/dist/es6/table/lib/parts/BaseTableCell.js +1 -1
- package/dist/es6/table/lib/parts/BaseTableHead.js +1 -1
- package/dist/es6/table/lib/parts/BaseTableHeader.js +1 -1
- package/dist/es6/table/lib/parts/css-grid-table/TableRow.js +1 -1
- package/dist/es6/tabs/lib/TabsItem.d.ts +1 -1
- package/dist/es6/tabs/lib/TabsItem.js +1 -1
- package/dist/es6/tabs/lib/TabsList.js +8 -8
- package/dist/es6/tabs/lib/TabsOverflowButton.js +1 -1
- package/dist/es6/tabs/lib/useTabsModel.d.ts.map +1 -1
- package/dist/es6/tabs/lib/useTabsModel.js +9 -3
- package/dist/es6/testing/lib/ComponentStatesTable.js +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/dist/es6/tooltip/lib/TooltipContainer.js +3 -3
- package/dist/es6/version/lib/version.js +1 -1
- package/menu/lib/MenuCard.tsx +13 -2
- package/menu/lib/MenuItem.tsx +33 -4
- package/menu/lib/MenuList.tsx +2 -1
- package/menu/lib/Submenu.tsx +32 -1
- package/package.json +4 -4
- package/tabs/lib/useTabsModel.tsx +20 -15
|
@@ -9,19 +9,19 @@ import { InformationHighlightHeading } from './parts/Heading';
|
|
|
9
9
|
import { Icon } from './parts/Icon';
|
|
10
10
|
import { Link } from './parts/Link';
|
|
11
11
|
export const informationHighlightStencil = createStencil({
|
|
12
|
-
base: { name: "
|
|
12
|
+
base: { name: "9ru8u", styles: "box-sizing:border-box;display:grid;grid-template-columns:min-content;gap:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));padding:var(--cnvs-sys-padding-md, var(--cnvs-sys-space-x4, 1rem));border-radius:var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1, 0.25rem));outline:0.0625rem solid transparent;border-inline-start:var(--cnvs-base-size-50, 0.25rem) solid transparent;" },
|
|
13
13
|
modifiers: {
|
|
14
14
|
informational: {
|
|
15
|
-
low: { name: "
|
|
16
|
-
high: { name: "
|
|
15
|
+
low: { name: "23aoxm", styles: "border-inline-start-color:var(--cnvs-sys-color-border-info-default, var(--cnvs-sys-color-border-primary-default, oklch(0.6023 0.2032 255.68 / 1)));background-color:var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05)));& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-inverse);--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-info-default, var(--cnvs-sys-color-fg-primary-default, oklch(0.5198 0.1782 256.11 / 1)));--backgroundColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-info-default, var(--cnvs-sys-color-fg-primary-default, oklch(0.5198 0.1782 256.11 / 1)));}" },
|
|
16
|
+
high: { name: "1hn22p", styles: "border-inline-start-color:var(--cnvs-sys-color-border-info-default, var(--cnvs-sys-color-border-primary-default, oklch(0.6023 0.2032 255.68 / 1)));background-color:var(--cnvs-sys-color-surface-info-default, var(--cnvs-sys-color-bg-info-softest, oklch(0.6499 0.1912 253.52 / 0.08)));& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-inverse);--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-info-default, var(--cnvs-sys-color-fg-primary-default, oklch(0.5198 0.1782 256.11 / 1)));--backgroundColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-info-default, var(--cnvs-sys-color-fg-primary-default, oklch(0.5198 0.1782 256.11 / 1)));}" }
|
|
17
17
|
},
|
|
18
18
|
caution: {
|
|
19
|
-
low: { name: "
|
|
20
|
-
high: { name: "
|
|
19
|
+
low: { name: "20mc9q", styles: "border-inline-start-color:var(--cnvs-sys-color-border-warning, var(--cnvs-sys-color-border-caution-default, oklch(0.7909 0.1711 70.15 / 1)));background-color:var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05)));& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-inverse);--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-warning-default, oklch(0.5505 0.1439 50.78 / 1));--backgroundColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-warning-default, oklch(0.5505 0.1439 50.78 / 1));}" },
|
|
20
|
+
high: { name: "3tep6q", styles: "border-inline-start-color:var(--cnvs-sys-color-border-warning, var(--cnvs-sys-color-border-caution-default, oklch(0.7909 0.1711 70.15 / 1)));background-color:var(--cnvs-sys-color-surface-warning-default, var(--cnvs-sys-color-static-amber-softest, oklch(0.7982 0.159 92.57 / 0.1)));& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-inverse);--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-warning-default, oklch(0.5505 0.1439 50.78 / 1));--backgroundColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-warning-default, oklch(0.5505 0.1439 50.78 / 1));}" }
|
|
21
21
|
},
|
|
22
22
|
critical: {
|
|
23
|
-
low: { name: "
|
|
24
|
-
high: { name: "
|
|
23
|
+
low: { name: "2ug2nf", styles: "border-inline-start-color:var(--cnvs-sys-color-border-danger, var(--cnvs-sys-color-border-critical-default, oklch(0.6495 0.2369 30.04 / 1)));background-color:var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05)));& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-inverse);--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-danger-default, var(--cnvs-sys-color-fg-critical-default, oklch(0.5342 0.2172 29.53 / 1)));--backgroundColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-danger-default, var(--cnvs-sys-color-fg-critical-default, oklch(0.5342 0.2172 29.53 / 1)));}" },
|
|
24
|
+
high: { name: "2etud9", styles: "border-inline-start-color:var(--cnvs-sys-color-border-danger, var(--cnvs-sys-color-border-critical-default, oklch(0.6495 0.2369 30.04 / 1)));background-color:var(--cnvs-sys-color-surface-danger-default, oklch(0.6289 0.2567 29.11 / 0.04));& [data-part=\"information-highlight-icon\"]{--accentColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-inverse);--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-danger-default, var(--cnvs-sys-color-fg-critical-default, oklch(0.5342 0.2172 29.53 / 1)));--backgroundColor-system-icon-c9acc3:var(--cnvs-sys-color-fg-danger-default, var(--cnvs-sys-color-fg-critical-default, oklch(0.5342 0.2172 29.53 / 1)));}" }
|
|
25
25
|
}
|
|
26
26
|
}
|
|
27
27
|
}, "information-highlight-689af3");
|
|
@@ -4,7 +4,7 @@ import { Text } from '@workday/canvas-kit-react/text';
|
|
|
4
4
|
import { createStencil, handleCsProp } from '@workday/canvas-kit-styling';
|
|
5
5
|
import { system } from '@workday/canvas-tokens-web';
|
|
6
6
|
const informationHighlightBodyStencil = createStencil({
|
|
7
|
-
base: { name: "
|
|
7
|
+
base: { name: "3pah6v", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-normal);line-height:var(--cnvs-sys-line-height-subtext-lg, var(--cnvs-sys-line-height-subtext-large, 1.25rem));font-size:var(--cnvs-sys-font-size-subtext-lg, var(--cnvs-sys-font-size-subtext-large, 0.875rem));letter-spacing:var(--cnvs-sys-letter-spacing-subtext-lg, var(--cnvs-sys-type-letter-spacing-subtext-large));color:var(--cnvs-sys-color-fg-default);grid-column:2;margin-block-end:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));" }
|
|
8
8
|
}, "information-highlight-body-86f4c5");
|
|
9
9
|
export const Body = createComponent('div')({
|
|
10
10
|
displayName: 'Body',
|
|
@@ -4,7 +4,7 @@ import { Heading } from '@workday/canvas-kit-react/text';
|
|
|
4
4
|
import { createStencil, handleCsProp } from '@workday/canvas-kit-styling';
|
|
5
5
|
import { system } from '@workday/canvas-tokens-web';
|
|
6
6
|
const informationHighlightHeadingStencil = createStencil({
|
|
7
|
-
base: { name: "
|
|
7
|
+
base: { name: "1ouqpv", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-body-sm, var(--cnvs-sys-line-height-body-small, 1.5rem));font-size:var(--cnvs-sys-font-size-body-sm, var(--cnvs-sys-font-size-body-small, 1rem));letter-spacing:var(--cnvs-sys-letter-spacing-body-sm, var(--cnvs-sys-type-letter-spacing-body-small));color:var(--cnvs-sys-color-fg-default);grid-column:2;margin:0;" }
|
|
8
8
|
}, "information-highlight-heading-578aaa");
|
|
9
9
|
export const InformationHighlightHeading = createComponent('h3')({
|
|
10
10
|
displayName: 'Heading',
|
|
@@ -4,7 +4,7 @@ import { createComponent } from '@workday/canvas-kit-react/common';
|
|
|
4
4
|
import { createStencil, handleCsProp } from '@workday/canvas-kit-styling';
|
|
5
5
|
import { system } from '@workday/canvas-tokens-web';
|
|
6
6
|
const informationHighlightLinkStencil = createStencil({
|
|
7
|
-
base: { name: "
|
|
7
|
+
base: { name: "2au2q0", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-bold);line-height:var(--cnvs-sys-line-height-subtext-lg, var(--cnvs-sys-line-height-subtext-large, 1.25rem));font-size:var(--cnvs-sys-font-size-subtext-lg, var(--cnvs-sys-font-size-subtext-large, 0.875rem));letter-spacing:var(--cnvs-sys-letter-spacing-subtext-lg, var(--cnvs-sys-type-letter-spacing-subtext-large));grid-column:2;justify-self:start;color:var(--cnvs-sys-color-fg-default);" }
|
|
8
8
|
}, "information-highlight-link-654856");
|
|
9
9
|
export const Link = createComponent('a')({
|
|
10
10
|
displayName: 'Link',
|
|
@@ -5,7 +5,7 @@ import { system } from '@workday/canvas-tokens-web';
|
|
|
5
5
|
/**
|
|
6
6
|
* Keyframe for the dots loading animation.
|
|
7
7
|
*/
|
|
8
|
-
const keyframesLoading = keyframes({ name: "
|
|
8
|
+
const keyframesLoading = keyframes({ name: "2yiua8", styles: "0%, 80%, 100%{transform:scale(0);}40%{transform:scale(1);}0%, 79%, 100%{opacity:0.6;}27%{opacity:1;}53%{opacity:0.8;}" });
|
|
9
9
|
export const loadingDotsStencil = createStencil({
|
|
10
10
|
vars: {
|
|
11
11
|
animationDurationMs: '40ms',
|
|
@@ -14,10 +14,10 @@ export const loadingDotsStencil = createStencil({
|
|
|
14
14
|
parts: {
|
|
15
15
|
loadingAnimationDot: 'loading-animation-dot',
|
|
16
16
|
},
|
|
17
|
-
base: { name: "
|
|
17
|
+
base: { name: "48fmyj", styles: "--animationDurationMs-loading-dots-f4f937:40ms;box-sizing:border-box;display:inline-flex;gap:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));[data-part=\"loading-animation-dot\"]{background-color:var(--loadingDotColor-loading-dots-f4f937, var(--cnvs-sys-color-accent-muted-default, var(--cnvs-sys-color-bg-muted-default, oklch(0.5103 0.0255 256.8 / 1))));width:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));font-size:0;border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));outline:0.125rem solid transparent;transform:scale(0);display:inline-block;animation-name:animation-2yiua8;animation-duration:calc(var(--animationDurationMs-loading-dots-f4f937) * 35);animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-fill-mode:both;&:nth-child(1){animation-delay:0ms;}&:nth-child(2){animation-delay:calc(var(--animationDurationMs-loading-dots-f4f937) * 4);}&:nth-child(3){animation-delay:calc(var(--animationDurationMs-loading-dots-f4f937) * 8);}}" },
|
|
18
18
|
modifiers: {
|
|
19
19
|
variant: {
|
|
20
|
-
inverse: { name: "
|
|
20
|
+
inverse: { name: "2gv4gv", styles: "[data-part=\"loading-animation-dot\"]{background-color:var(--loadingDotColor-loading-dots-f4f937, var(--cnvs-sys-color-bg-default));}" }
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
}, "loading-dots-f4f937");
|
|
@@ -39,7 +39,7 @@ export declare const useMenuCard: import("@workday/canvas-kit-react/common").Beh
|
|
|
39
39
|
indexRef: React.MutableRefObject<number>;
|
|
40
40
|
nonInteractiveIds: string[];
|
|
41
41
|
isVirtualized: boolean;
|
|
42
|
-
items: import("
|
|
42
|
+
items: import("@workday/canvas-kit-react/collection").Item<any>[];
|
|
43
43
|
mode: "multiple" | "single";
|
|
44
44
|
};
|
|
45
45
|
events: {
|
|
@@ -101,7 +101,7 @@ export declare const useMenuCard: import("@workday/canvas-kit-react/common").Beh
|
|
|
101
101
|
indexRef: React.MutableRefObject<number>;
|
|
102
102
|
nonInteractiveIds: string[];
|
|
103
103
|
isVirtualized: boolean;
|
|
104
|
-
items: import("
|
|
104
|
+
items: import("@workday/canvas-kit-react/collection").Item<any>[];
|
|
105
105
|
};
|
|
106
106
|
events: {
|
|
107
107
|
select(data: {
|
|
@@ -139,8 +139,8 @@ export declare const useMenuCard: import("@workday/canvas-kit-react/common").Beh
|
|
|
139
139
|
value: number;
|
|
140
140
|
}): void;
|
|
141
141
|
};
|
|
142
|
-
selection: import("
|
|
143
|
-
navigation: import("
|
|
142
|
+
selection: import("@workday/canvas-kit-react/collection").SelectionManager;
|
|
143
|
+
navigation: import("@workday/canvas-kit-react/collection").NavigationManager;
|
|
144
144
|
getId: (item: any) => string;
|
|
145
145
|
getTextValue: (item: any) => string;
|
|
146
146
|
UNSTABLE_parentModel: {
|
|
@@ -161,7 +161,7 @@ export declare const useMenuCard: import("@workday/canvas-kit-react/common").Beh
|
|
|
161
161
|
indexRef: React.MutableRefObject<number>;
|
|
162
162
|
nonInteractiveIds: string[];
|
|
163
163
|
isVirtualized: boolean;
|
|
164
|
-
items: import("
|
|
164
|
+
items: import("@workday/canvas-kit-react/collection").Item<any>[];
|
|
165
165
|
};
|
|
166
166
|
events: {
|
|
167
167
|
select(data: {
|
|
@@ -199,14 +199,14 @@ export declare const useMenuCard: import("@workday/canvas-kit-react/common").Beh
|
|
|
199
199
|
value: number;
|
|
200
200
|
}): void;
|
|
201
201
|
};
|
|
202
|
-
selection: import("
|
|
203
|
-
navigation: import("
|
|
202
|
+
selection: import("@workday/canvas-kit-react/collection").SelectionManager;
|
|
203
|
+
navigation: import("@workday/canvas-kit-react/collection").NavigationManager;
|
|
204
204
|
getId: (item: any) => string;
|
|
205
205
|
getTextValue: (item: any) => string;
|
|
206
206
|
} | undefined;
|
|
207
207
|
};
|
|
208
|
-
selection: import("
|
|
209
|
-
navigation: import("
|
|
208
|
+
selection: import("@workday/canvas-kit-react/collection").SelectionManager;
|
|
209
|
+
navigation: import("@workday/canvas-kit-react/collection").NavigationManager;
|
|
210
210
|
getId: (item: any) => string;
|
|
211
211
|
getTextValue: (item: any) => string;
|
|
212
212
|
}, {}>;
|
|
@@ -234,7 +234,7 @@ export declare const MenuCard: import("@workday/canvas-kit-react/common").Elemen
|
|
|
234
234
|
indexRef: React.MutableRefObject<number>;
|
|
235
235
|
nonInteractiveIds: string[];
|
|
236
236
|
isVirtualized: boolean;
|
|
237
|
-
items: import("
|
|
237
|
+
items: import("@workday/canvas-kit-react/collection").Item<any>[];
|
|
238
238
|
mode: "multiple" | "single";
|
|
239
239
|
};
|
|
240
240
|
events: {
|
|
@@ -296,7 +296,7 @@ export declare const MenuCard: import("@workday/canvas-kit-react/common").Elemen
|
|
|
296
296
|
indexRef: React.MutableRefObject<number>;
|
|
297
297
|
nonInteractiveIds: string[];
|
|
298
298
|
isVirtualized: boolean;
|
|
299
|
-
items: import("
|
|
299
|
+
items: import("@workday/canvas-kit-react/collection").Item<any>[];
|
|
300
300
|
};
|
|
301
301
|
events: {
|
|
302
302
|
select(data: {
|
|
@@ -334,8 +334,8 @@ export declare const MenuCard: import("@workday/canvas-kit-react/common").Elemen
|
|
|
334
334
|
value: number;
|
|
335
335
|
}): void;
|
|
336
336
|
};
|
|
337
|
-
selection: import("
|
|
338
|
-
navigation: import("
|
|
337
|
+
selection: import("@workday/canvas-kit-react/collection").SelectionManager;
|
|
338
|
+
navigation: import("@workday/canvas-kit-react/collection").NavigationManager;
|
|
339
339
|
getId: (item: any) => string;
|
|
340
340
|
getTextValue: (item: any) => string;
|
|
341
341
|
UNSTABLE_parentModel: {
|
|
@@ -356,7 +356,7 @@ export declare const MenuCard: import("@workday/canvas-kit-react/common").Elemen
|
|
|
356
356
|
indexRef: React.MutableRefObject<number>;
|
|
357
357
|
nonInteractiveIds: string[];
|
|
358
358
|
isVirtualized: boolean;
|
|
359
|
-
items: import("
|
|
359
|
+
items: import("@workday/canvas-kit-react/collection").Item<any>[];
|
|
360
360
|
};
|
|
361
361
|
events: {
|
|
362
362
|
select(data: {
|
|
@@ -394,14 +394,14 @@ export declare const MenuCard: import("@workday/canvas-kit-react/common").Elemen
|
|
|
394
394
|
value: number;
|
|
395
395
|
}): void;
|
|
396
396
|
};
|
|
397
|
-
selection: import("
|
|
398
|
-
navigation: import("
|
|
397
|
+
selection: import("@workday/canvas-kit-react/collection").SelectionManager;
|
|
398
|
+
navigation: import("@workday/canvas-kit-react/collection").NavigationManager;
|
|
399
399
|
getId: (item: any) => string;
|
|
400
400
|
getTextValue: (item: any) => string;
|
|
401
401
|
} | undefined;
|
|
402
402
|
};
|
|
403
|
-
selection: import("
|
|
404
|
-
navigation: import("
|
|
403
|
+
selection: import("@workday/canvas-kit-react/collection").SelectionManager;
|
|
404
|
+
navigation: import("@workday/canvas-kit-react/collection").NavigationManager;
|
|
405
405
|
getId: (item: any) => string;
|
|
406
406
|
getTextValue: (item: any) => string;
|
|
407
407
|
}>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuCard.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,IAAI,EAAC,MAAM,gCAAgC,CAAC;
|
|
1
|
+
{"version":3,"file":"MenuCard.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,IAAI,EAAC,MAAM,gCAAgC,CAAC;AAEpD,OAAO,EACL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAQ1C,MAAM,WAAW,aAAc,SAAQ,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC;IACrE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,eAAe;;;;;;;;;;gBA0C1B,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAEtB,CAAC;AAEH,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyBnB,CAAC"}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import { Card } from '@workday/canvas-kit-react/card';
|
|
4
|
+
import { listBoxContainerStencil } from '@workday/canvas-kit-react/collection';
|
|
4
5
|
import { createElemPropsHook, createSubcomponent, } from '@workday/canvas-kit-react/common';
|
|
5
6
|
import { mergeStyles } from '@workday/canvas-kit-react/layout';
|
|
6
7
|
import { getTransformFromPlacement } from '@workday/canvas-kit-react/popup';
|
|
7
|
-
import { calc, createStencil, px2rem } from '@workday/canvas-kit-styling';
|
|
8
|
+
import { calc, createStencil, cssVar, px2rem } from '@workday/canvas-kit-styling';
|
|
8
9
|
import { system } from '@workday/canvas-tokens-web';
|
|
9
10
|
import { useMenuModel } from './useMenuModel';
|
|
10
11
|
export const menuCardStencil = createStencil({
|
|
@@ -14,8 +15,8 @@ export const menuCardStencil = createStencil({
|
|
|
14
15
|
transformOriginHorizontal: 'left',
|
|
15
16
|
maxHeight: '',
|
|
16
17
|
},
|
|
17
|
-
base: { name: "
|
|
18
|
-
}, "menu-card-
|
|
18
|
+
base: { name: "2a918", styles: "--minWidth-menu-card-38a175:0.0625rem;--transformOriginVertical-menu-card-38a175:top;--transformOriginHorizontal-menu-card-38a175:left;box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-normal);font-size:var(--cnvs-sys-font-size-subtext-lg, var(--cnvs-sys-font-size-subtext-large, 0.875rem));line-height:var(--cnvs-sys-line-height-subtext-lg, var(--cnvs-sys-line-height-subtext-large, 1.25rem));letter-spacing:var(--cnvs-sys-letter-spacing-subtext-lg, var(--cnvs-sys-type-letter-spacing-subtext-large));color:var(--cnvs-sys-color-fg-default);position:relative;display:flex;flex-direction:column;transition:transform ease-out 150ms;padding:var(--cnvs-sys-padding-xxs, var(--cnvs-sys-space-x1, 0.25rem));border-radius:var(--cnvs-sys-shape-xxl, var(--cnvs-sys-shape-x6, 1.5rem));max-width:calc(100vw - var(--cnvs-sys-size-sm, var(--cnvs-sys-space-x8, 2rem)));box-shadow:var(--cnvs-sys-depth-3);min-width:var(--minWidth-menu-card-38a175);max-height:var(--maxHeight-menu-card-38a175, 60vh);transform-origin:var(--transformOriginVertical-menu-card-38a175) var(--transformOriginHorizontal-menu-card-38a175);.wd-no-animation &{animation:none;}&:where(:has([data-part=\"list-box-container\"])){overflow:hidden;}& :where([data-part=\"list-box-container\"]){border-radius:var(--cnvs-sys-shape-xxl, var(--cnvs-sys-shape-x6, 1.5rem));min-height:0;}" }
|
|
19
|
+
}, "menu-card-38a175");
|
|
19
20
|
export const useMenuCard = createElemPropsHook(useMenuModel)(() => {
|
|
20
21
|
return {};
|
|
21
22
|
});
|
|
@@ -3,7 +3,7 @@ import { createComponent } from '@workday/canvas-kit-react/common';
|
|
|
3
3
|
import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
|
|
4
4
|
import { system } from '@workday/canvas-tokens-web';
|
|
5
5
|
export const menuDividerStencil = createStencil({
|
|
6
|
-
base: { name: "
|
|
6
|
+
base: { name: "4d4laq", styles: "box-sizing:border-box;display:block;height:0.0625rem;border:none;border-block-start:0.0625rem solid var(--cnvs-sys-color-border-default, var(--cnvs-sys-color-border-divider, oklch(0.3057 0.079 256.22 / 0.13)));margin:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem)) var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));" }
|
|
7
7
|
}, "menu-divider-1b4688");
|
|
8
8
|
export const MenuDivider = createComponent('hr')({
|
|
9
9
|
displayName: 'Menu.Divider',
|
|
@@ -20,7 +20,7 @@ const useMenuGroupModel = createModelHook({
|
|
|
20
20
|
};
|
|
21
21
|
});
|
|
22
22
|
export const menuGroupHeadingStencil = createStencil({
|
|
23
|
-
base: { name: "
|
|
23
|
+
base: { name: "4w12p", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-size:var(--cnvs-sys-font-size-subtext-lg, var(--cnvs-sys-font-size-subtext-large, 0.875rem));line-height:var(--cnvs-sys-line-height-subtext-lg, var(--cnvs-sys-line-height-subtext-large, 1.25rem));letter-spacing:var(--cnvs-sys-letter-spacing-subtext-lg, var(--cnvs-sys-type-letter-spacing-subtext-large));font-weight:var(--cnvs-sys-font-weight-bold);display:flex;align-items:center;width:100%;gap:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));padding:var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem)) var(--cnvs-sys-padding-md, var(--cnvs-sys-space-x4, 1rem));" }
|
|
24
24
|
}, "menu-group-heading-94adee");
|
|
25
25
|
export const useMenuGroup = createElemPropsHook(useMenuGroupModel)(model => {
|
|
26
26
|
return {
|
|
@@ -633,14 +633,14 @@ export declare const useMenuItem: import("@workday/canvas-kit-react/common").Beh
|
|
|
633
633
|
}, import("@workday/canvas-kit-react/common").RemoveNulls<import("@workday/canvas-kit-react/common").MergeProps<{
|
|
634
634
|
readonly role: "menuitem";
|
|
635
635
|
readonly onMouseDown: (event: React.MouseEvent) => void;
|
|
636
|
-
readonly onClick: ((event: React.SyntheticEvent) =>
|
|
636
|
+
readonly onClick: ((event: React.SyntheticEvent) => null | undefined) | undefined;
|
|
637
637
|
}, import("@workday/canvas-kit-react/common").MergeProps<{
|
|
638
638
|
readonly ref: (instance: HTMLElement | null) => void;
|
|
639
639
|
readonly className: "focus" | undefined;
|
|
640
640
|
}, import("@workday/canvas-kit-react/common").MergeProps<{
|
|
641
641
|
readonly onKeyDown: (event: React.KeyboardEvent) => void;
|
|
642
642
|
}, import("@workday/canvas-kit-react/common").MergeProps<{
|
|
643
|
-
readonly onClick: (event: React.MouseEvent<HTMLElement, MouseEvent>) =>
|
|
643
|
+
readonly onClick: (event: React.MouseEvent<HTMLElement, MouseEvent>) => null | undefined;
|
|
644
644
|
}, import("@workday/canvas-kit-react/common").MergeProps<{
|
|
645
645
|
readonly onKeyDown: (event: React.KeyboardEvent<HTMLElement>) => void;
|
|
646
646
|
readonly onClick: () => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAiB/B,OAAO,EAAa,eAAe,EAAoB,MAAM,gCAAgC,CAAC;AAG9F,OAAO,EAAC,OAAO,EAAsC,MAAM,6BAA6B,CAAC;AAKzF,MAAM,WAAW,aAAc,SAAQ,OAAO;IAC5C;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,eAAe;;;;;;;;oBA+F1B,CAAC;AAYH,eAAO,MAAM,cAAc,sFAazB,CAAC;AAEH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCAEd,mBAAmB;EAYtC,CAAC;AAEH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4C3B,CAAC;AASH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kCAIC,gBAAgB;+BAKrB,MAAM,cAAc;;;;;gCA5EnB,mBAAmB;;;;;;;;;;;;;;;;;aA4FvC,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBAzHY,eAAe;;CAyI9C,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import * as React from 'react';
|
|
3
|
-
import { isCursor, useListItemRegister, useListItemRovingFocus, useListItemSelect, } from '@workday/canvas-kit-react/collection';
|
|
4
|
-
import { composeHooks, createComponent, createElemPropsHook, createSubcomponent, useLocalRef, } from '@workday/canvas-kit-react/common';
|
|
3
|
+
import { isCursor, isElementDisabled, useListItemRegister, useListItemRovingFocus, useListItemSelect, } from '@workday/canvas-kit-react/collection';
|
|
4
|
+
import { changeFocus, composeHooks, createComponent, createElemPropsHook, createSubcomponent, useLocalRef, } from '@workday/canvas-kit-react/common';
|
|
5
5
|
import { SystemIcon, systemIconStencil } from '@workday/canvas-kit-react/icon';
|
|
6
6
|
import { mergeStyles } from '@workday/canvas-kit-react/layout';
|
|
7
7
|
import { OverflowTooltip } from '@workday/canvas-kit-react/tooltip';
|
|
@@ -14,8 +14,8 @@ export const menuItemStencil = createStencil({
|
|
|
14
14
|
icon: 'menu-item-icon',
|
|
15
15
|
selected: 'menu-item-selected',
|
|
16
16
|
},
|
|
17
|
-
base: { name: "
|
|
18
|
-
}, "menu-item-
|
|
17
|
+
base: { name: "1jgh06", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-normal);font-size:var(--cnvs-sys-font-size-subtext-lg, var(--cnvs-sys-font-size-subtext-large, 0.875rem));line-height:var(--cnvs-sys-line-height-subtext-lg, var(--cnvs-sys-line-height-subtext-large, 1.25rem));letter-spacing:var(--cnvs-sys-letter-spacing-subtext-lg, var(--cnvs-sys-type-letter-spacing-subtext-large));display:flex;align-items:center;width:100%;gap:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));padding:var(--cnvs-sys-padding-sm, var(--cnvs-sys-space-x3, 0.75rem)) var(--cnvs-sys-padding-md, var(--cnvs-sys-space-x4, 1rem));cursor:pointer;color:var(--cnvs-sys-color-fg-default);border-width:0;border-radius:var(--cnvs-sys-shape-xxl, var(--cnvs-sys-shape-x6, 1.5rem));text-align:start;transition:background-color 80ms, color 80ms;background-color:inherit;min-height:var(--cnvs-sys-size-md, var(--cnvs-sys-space-x10, 2.5rem));overflow-wrap:anywhere;--color-system-icon-c9acc3:currentColor;& :where([data-part=\"menu-item-selected\"]){transition:opacity 80ms linear;opacity:var(--cnvs-sys-opacity-zero);}&:where(:has(span)){display:flex;}&[aria-selected=true]{color:var(--cnvs-sys-color-brand-fg-primary-strong, var(--cnvs-brand-primary-dark, oklch(0.4658 0.1562 255.5 / 1)));background-color:var(--cnvs-sys-color-brand-surface-primary-strong, oklch(0.6152 0.2108 256.1 / 0.11));& :where([data-part=\"menu-item-selected\"]){opacity:var(--cnvs-sys-opacity-full);}&:where(.focus, :focus-visible){--color-system-icon-c9acc3:currentColor;outline:none;background-color:var(--cnvs-sys-color-brand-accent-primary, var(--cnvs-brand-primary-base, oklch(0.5198 0.1782 256.11 / 1)));color:var(--cnvs-sys-color-fg-inverse);}}&:is(.hover, :hover){color:var(--cnvs-sys-color-fg-strong);background-color:var(--cnvs-sys-color-surface-overlay-hover-default, oklch(0.3343 0.0951 253.3 / 0.05));}&:is(.focus, :focus-visible){color:var(--cnvs-sys-color-fg-inverse);background-color:var(--cnvs-sys-color-brand-accent-primary, var(--cnvs-brand-primary-base, oklch(0.5198 0.1782 256.11 / 1)));outline:0.125rem solid transparent;outline-offset:-0.125rem;}&:is(:disabled, [aria-disabled=true]){cursor:default;opacity:var(--cnvs-sys-opacity-disabled);&:where(.hover, :hover, [aria-selected=true]){background:none;}&:where(.focus, :focus-visible){background-color:var(--cnvs-sys-color-brand-accent-primary, var(--cnvs-brand-primary-base, oklch(0.5198 0.1782 256.11 / 1)));opacity:var(--cnvs-sys-opacity-disabled);}}& :where([data-part=\"menu-item-text\"]){flex-grow:1;align-self:center;}& :where([data-part=\"menu-item-icon\"]){align-self:start;}" }
|
|
18
|
+
}, "menu-item-956be4");
|
|
19
19
|
const MenuItemIcon = (elemProps) => {
|
|
20
20
|
return _jsx(SystemIcon, { ...menuItemStencil.parts.icon, ...elemProps });
|
|
21
21
|
};
|
|
@@ -35,7 +35,12 @@ export const useMenuItemArrowReturn = createElemPropsHook(useMenuModel)(model =>
|
|
|
35
35
|
onKeyDown(event) {
|
|
36
36
|
const styles = getComputedStyle(event.currentTarget);
|
|
37
37
|
if (event.key === 'ArrowLeft' && styles.direction === 'ltr' && model.UNSTABLE_parentModel) {
|
|
38
|
+
event.preventDefault();
|
|
39
|
+
const target = model.state.targetRef.current;
|
|
38
40
|
model.events.hide(event);
|
|
41
|
+
requestAnimationFrame(() => {
|
|
42
|
+
changeFocus(target);
|
|
43
|
+
});
|
|
39
44
|
}
|
|
40
45
|
},
|
|
41
46
|
};
|
|
@@ -43,6 +48,23 @@ export const useMenuItemArrowReturn = createElemPropsHook(useMenuModel)(model =>
|
|
|
43
48
|
export const useMenuItemFocus = createElemPropsHook(useMenuModel)((model, ref, elemProps = { 'data-id': '' }) => {
|
|
44
49
|
const { localRef, elementRef } = useLocalRef(ref);
|
|
45
50
|
const id = elemProps['data-id'];
|
|
51
|
+
// A menu keeps its cursor between openings, so reopening would restore focus to a disabled item.
|
|
52
|
+
// Items remount whenever the menu opens, which distinguishes reopening from navigating onto a
|
|
53
|
+
// disabled item while the menu is already open. Clearing the cursor lets the roving focus
|
|
54
|
+
// fallback in `useListItemRovingFocus` move focus to the first item. The check waits for the
|
|
55
|
+
// first render where `id` is known, since items without an explicit `data-id` register it later.
|
|
56
|
+
const hasCheckedDisabledCursor = React.useRef(false);
|
|
57
|
+
React.useLayoutEffect(() => {
|
|
58
|
+
if (hasCheckedDisabledCursor.current || !id) {
|
|
59
|
+
return;
|
|
60
|
+
}
|
|
61
|
+
hasCheckedDisabledCursor.current = true;
|
|
62
|
+
const isItemDisabled = isElementDisabled(localRef.current);
|
|
63
|
+
if (model.state.mode === 'single' && isCursor(model.state, id) && isItemDisabled) {
|
|
64
|
+
model.events.goToFirst();
|
|
65
|
+
}
|
|
66
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
67
|
+
}, [id]);
|
|
46
68
|
// focus on the item with the cursor
|
|
47
69
|
React.useLayoutEffect(() => {
|
|
48
70
|
if (model.state.mode === 'single') {
|
|
@@ -75,11 +97,12 @@ export const useMenuItem = composeHooks(createElemPropsHook(useMenuModel)(model
|
|
|
75
97
|
},
|
|
76
98
|
onClick: model.state.mode === 'single'
|
|
77
99
|
? (event) => {
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
model.events.hide(event);
|
|
81
|
-
hideParent(model);
|
|
100
|
+
if (isElementDisabled(event.currentTarget)) {
|
|
101
|
+
return null;
|
|
82
102
|
}
|
|
103
|
+
model.events.hide(event);
|
|
104
|
+
hideParent(model);
|
|
105
|
+
return undefined;
|
|
83
106
|
}
|
|
84
107
|
: undefined,
|
|
85
108
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAE,SAAS,EAAC,MAAM,sCAAsC,CAAC;AACxE,OAAO,EACL,YAAY,EAIb,MAAM,kCAAkC,CAAC;AAO1C,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,GAAG,CACpC,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,OAAO,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC;IAC7D;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC;CACpC;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+SAUvB,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;wBAiB1B,CAAC;AAEH,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAE,SAAS,EAAC,MAAM,sCAAsC,CAAC;AACxE,OAAO,EACL,YAAY,EAIb,MAAM,kCAAkC,CAAC;AAO1C,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,GAAG,CACpC,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,OAAO,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC;IAC7D;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC;CACpC;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+SAUvB,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;wBAiB1B,CAAC;AAEH,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgBnB,CAAC"}
|
|
@@ -13,11 +13,11 @@ export const useMenuList = composeHooks(createElemPropsHook(useMenuModel)(model
|
|
|
13
13
|
};
|
|
14
14
|
}), useReturnFocus, useFocusRedirect);
|
|
15
15
|
export const menuListStencil = createStencil({
|
|
16
|
-
base: { name: "
|
|
16
|
+
base: { name: "1ef43f", styles: "box-sizing:border-box;background:var(--cnvs-sys-color-surface-popover, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));border-radius:var(--cnvs-sys-shape-xxl, var(--cnvs-sys-shape-x6, 1.5rem));padding:0;gap:var(--cnvs-sys-gap-xs, var(--cnvs-sys-space-x1, 0.25rem));" },
|
|
17
17
|
modifiers: {
|
|
18
18
|
orientation: {
|
|
19
|
-
vertical: { name: "
|
|
20
|
-
horizontal: { name: "
|
|
19
|
+
vertical: { name: "11ea4s", styles: "flex-direction:column;" },
|
|
20
|
+
horizontal: { name: "agrfa", styles: "flex-direction:row;" }
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
}, "menu-list-4b275a");
|
|
@@ -25,6 +25,6 @@ export const MenuList = createSubcomponent('div')({
|
|
|
25
25
|
displayName: 'Menu.List',
|
|
26
26
|
modelHook: useMenuModel,
|
|
27
27
|
elemPropsHook: useMenuList,
|
|
28
|
-
})(({ children, ...elemProps }, Element, model) => {
|
|
29
|
-
return (_jsx(ListBox, { as: Element, model: model, marginY: system.legacy.gap.none, ...handleCsProp(elemProps, menuListStencil({ orientation: model.state.orientation })), children: children }));
|
|
28
|
+
})(({ children, maxHeight, ...elemProps }, Element, model) => {
|
|
29
|
+
return (_jsx(ListBox, { as: Element, model: model, marginY: system.legacy.gap.none, maxHeight: maxHeight !== null && maxHeight !== void 0 ? maxHeight : '100%', ...handleCsProp(elemProps, menuListStencil({ orientation: model.state.orientation })), children: children }));
|
|
30
30
|
});
|
|
@@ -232,7 +232,7 @@ export declare const useSubmenuTargetItem: import("@workday/canvas-kit-react/com
|
|
|
232
232
|
readonly onMouseDown: (event: React.MouseEvent) => void;
|
|
233
233
|
readonly onMouseEnter: (event: React.MouseEvent) => void;
|
|
234
234
|
readonly onMouseLeave: () => void;
|
|
235
|
-
readonly onClick: (event: React.MouseEvent) =>
|
|
235
|
+
readonly onClick: (event: React.MouseEvent) => null | undefined;
|
|
236
236
|
readonly 'data-has-children': true;
|
|
237
237
|
readonly onKeyDown: (event: React.KeyboardEvent) => void;
|
|
238
238
|
}, {}>>>>>>>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Submenu.d.ts","sourceRoot":"","sources":["../../../../menu/lib/Submenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Submenu.d.ts","sourceRoot":"","sources":["../../../../menu/lib/Submenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,EAEL,cAAc,EAMf,MAAM,kCAAkC,CAAC;AAW1C,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAE5C,KAAK,eAAe,GAAG,CAAC,OAAO,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC;AAExD,MAAM,WAAW,YACf,SAAQ,eAAe,EACrB,cAAc,CAAC,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;IACjD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASxB,CAAC;AA2BH,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;kCAuCR,gBAAgB;mCAGf,gBAAgB;;8BAUrB,gBAAgB;;gCAmBd,mBAAmB;aAiBzC,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAU5B,CAAC;AAEH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGhB;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGH;;;;;;;OAOG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGH;;;;;OAKG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqBL,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import React from 'react';
|
|
3
|
-
import { useListItemRegister, useListItemRovingFocus } from '@workday/canvas-kit-react/collection';
|
|
3
|
+
import { isElementDisabled, useListItemRegister, useListItemRovingFocus, } from '@workday/canvas-kit-react/collection';
|
|
4
4
|
import { composeHooks, createElemPropsHook, createSubcomponent, subModelHook, useForkRef, } from '@workday/canvas-kit-react/common';
|
|
5
5
|
import { Popper } from '@workday/canvas-kit-react/popup';
|
|
6
6
|
import { chevronRightSmallIcon } from '@workday/canvas-system-icons-web';
|
|
@@ -45,6 +45,22 @@ export const useSubmenuTargetItem = composeHooks(subModelHook(model => model.UNS
|
|
|
45
45
|
};
|
|
46
46
|
}), subModelHook(model => model.UNSTABLE_parentModel, useListItemRegister), createElemPropsHook(useMenuModel)(model => {
|
|
47
47
|
const currentTargetIdRef = React.useRef();
|
|
48
|
+
// A submenu owns its own `visibility`, so opening a sibling submenu would otherwise leave this
|
|
49
|
+
// one open. The parent's cursor always moves to the item being hovered or focused, so treat the
|
|
50
|
+
// cursor moving away from our target item as a signal to close.
|
|
51
|
+
const parentCursorId = model.UNSTABLE_parentModel.state.cursorId;
|
|
52
|
+
const isVisible = model.state.visibility === 'visible';
|
|
53
|
+
React.useEffect(() => {
|
|
54
|
+
var _a;
|
|
55
|
+
if (!isVisible) {
|
|
56
|
+
return;
|
|
57
|
+
}
|
|
58
|
+
const targetId = (_a = model.state.targetRef.current) === null || _a === void 0 ? void 0 : _a.getAttribute('data-id');
|
|
59
|
+
if (targetId && parentCursorId && parentCursorId !== targetId) {
|
|
60
|
+
model.events.hide();
|
|
61
|
+
}
|
|
62
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
63
|
+
}, [parentCursorId, isVisible]);
|
|
48
64
|
const mouseEnterTimer = useIntentTimer(() => {
|
|
49
65
|
model.UNSTABLE_parentModel.events.goTo({ id: currentTargetIdRef.current || '' });
|
|
50
66
|
model.events.show(event);
|
|
@@ -58,6 +74,9 @@ export const useSubmenuTargetItem = composeHooks(subModelHook(model => model.UNS
|
|
|
58
74
|
model.UNSTABLE_parentModel.events.goTo({ id: event.currentTarget.getAttribute('data-id') });
|
|
59
75
|
},
|
|
60
76
|
onMouseEnter(event) {
|
|
77
|
+
if (isElementDisabled(event.currentTarget)) {
|
|
78
|
+
return;
|
|
79
|
+
}
|
|
61
80
|
currentTargetIdRef.current = event.currentTarget.getAttribute('data-id');
|
|
62
81
|
mouseEnterTimer.start();
|
|
63
82
|
},
|
|
@@ -65,6 +84,9 @@ export const useSubmenuTargetItem = composeHooks(subModelHook(model => model.UNS
|
|
|
65
84
|
mouseEnterTimer.clear();
|
|
66
85
|
},
|
|
67
86
|
onClick(event) {
|
|
87
|
+
if (isElementDisabled(event.currentTarget)) {
|
|
88
|
+
return null;
|
|
89
|
+
}
|
|
68
90
|
// If we're wrapping a target component that doesn't handle ref forwarding, update the
|
|
69
91
|
// `state.targetRef` manually. This ensures that custom target components don't need to handle
|
|
70
92
|
// ref forwarding since ref forwarding is only really needed to programmatically open popups
|
|
@@ -78,9 +100,13 @@ export const useSubmenuTargetItem = composeHooks(subModelHook(model => model.UNS
|
|
|
78
100
|
else {
|
|
79
101
|
model.events.show(event);
|
|
80
102
|
}
|
|
103
|
+
return undefined;
|
|
81
104
|
},
|
|
82
105
|
'data-has-children': true,
|
|
83
106
|
onKeyDown(event) {
|
|
107
|
+
if (isElementDisabled(event.currentTarget)) {
|
|
108
|
+
return;
|
|
109
|
+
}
|
|
84
110
|
if (model.state.orientation === 'vertical') {
|
|
85
111
|
// eslint-disable-next-line default-case
|
|
86
112
|
switch (event.key) {
|
|
@@ -6,7 +6,7 @@ import { createStencil } from '@workday/canvas-kit-styling';
|
|
|
6
6
|
import { system } from '@workday/canvas-tokens-web';
|
|
7
7
|
import { useModalModel } from './hooks';
|
|
8
8
|
export const modalBodyStencil = createStencil({
|
|
9
|
-
base: { name: "
|
|
9
|
+
base: { name: "44a81y", styles: "box-sizing:border-box;@media screen and (max-width: 768px){padding:var(--cnvs-sys-padding-xxs, var(--cnvs-sys-space-x1, 0.25rem)) var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem)) var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem));}" }
|
|
10
10
|
}, "modal-body-d2fb64");
|
|
11
11
|
export const ModalBody = createSubcomponent('div')({
|
|
12
12
|
displayName: 'Modal.Body',
|
|
@@ -6,7 +6,7 @@ import { createStencil, px2rem } from '@workday/canvas-kit-styling';
|
|
|
6
6
|
import { base, system } from '@workday/canvas-tokens-web';
|
|
7
7
|
import { useModalCard, useModalModel } from './hooks';
|
|
8
8
|
export const modalCardStencil = createStencil({
|
|
9
|
-
base: { name: "
|
|
9
|
+
base: { name: "3wmzhx", styles: "box-sizing:border-box;margin:var(--cnvs-base-size-500, 2.5rem);width:27.5rem;border:0;outline:0.0625rem solid transparent;box-shadow:var(--cnvs-sys-depth-5);border-radius:var(--cnvs-sys-shape-xxxl, 2rem);@media screen and (max-width: 768px){gap:0;margin:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));padding:var(--cnvs-sys-gap-md, var(--cnvs-sys-space-x4, 1rem));}" }
|
|
10
10
|
}, "modal-card-32d23a");
|
|
11
11
|
export const ModalCard = createSubcomponent('div')({
|
|
12
12
|
displayName: 'Modal.Card',
|
|
@@ -6,7 +6,7 @@ import { createStencil } from '@workday/canvas-kit-styling';
|
|
|
6
6
|
import { system } from '@workday/canvas-tokens-web';
|
|
7
7
|
import { useModalHeading, useModalModel } from './hooks';
|
|
8
8
|
export const modalHeadingStencil = createStencil({
|
|
9
|
-
base: { name: "
|
|
9
|
+
base: { name: "iamkp", styles: "box-sizing:border-box;@media screen and (max-width: 768px){padding:var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem)) var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem)) var(--cnvs-sys-padding-xxs, var(--cnvs-sys-space-x1, 0.25rem));}" }
|
|
10
10
|
}, "modal-heading-6df35a");
|
|
11
11
|
export const ModalHeading = createSubcomponent('h2')({
|
|
12
12
|
displayName: 'Modal.Heading',
|
|
@@ -5,7 +5,7 @@ import { createStencil } from '@workday/canvas-kit-styling';
|
|
|
5
5
|
import { ModalOverlay } from './ModalOverlay';
|
|
6
6
|
import { useModalModel } from './hooks';
|
|
7
7
|
export const modalOverflowOverlayStencil = createStencil({
|
|
8
|
-
base: { name: "
|
|
8
|
+
base: { name: "3ha8kv", styles: "box-sizing:border-box;& > div{max-height:inherit;}overflow:hidden auto;" }
|
|
9
9
|
}, "modal-overflow-overlay-7fd361");
|
|
10
10
|
export const ModalOverflowOverlay = createSubcomponent('div')({
|
|
11
11
|
displayName: 'Modal.OverflowOverlay',
|
|
@@ -6,12 +6,12 @@ import { usePopupModel, usePopupStack } from '@workday/canvas-kit-react/popup';
|
|
|
6
6
|
import { createStencil, keyframes } from '@workday/canvas-kit-styling';
|
|
7
7
|
import { system } from '@workday/canvas-tokens-web';
|
|
8
8
|
import { useModalModel } from './hooks';
|
|
9
|
-
const fadeIn = keyframes({ name: "
|
|
9
|
+
const fadeIn = keyframes({ name: "10zf93", styles: "0%{background:none;}100%{background:var(--cnvs-sys-color-surface-overlay-scrim, oklch(0.0847 0 0 / 0.36));}" });
|
|
10
10
|
export const modalOverlayContainerStencil = createStencil({
|
|
11
11
|
vars: {
|
|
12
12
|
containerCenter: '',
|
|
13
13
|
},
|
|
14
|
-
base: { name: "
|
|
14
|
+
base: { name: "3xhn5b", styles: "box-sizing:border-box;position:fixed;top:0;left:0;width:100vw;height:100vh;background:var(--cnvs-sys-color-surface-overlay-scrim, oklch(0.0847 0 0 / 0.36));animation-duration:0.3s;animation-name:animation-10zf93;.wd-no-animation &{animation:none;}& > div{max-height:100%;display:flex;position:absolute;left:0;top:0;justify-content:center;align-items:center;height:100%;width:var(--containerCenter-modal-overlay-container-299216);}@media screen and (max-width: 768px){height:100%;& > div{align-items:end;}}" }
|
|
15
15
|
}, "modal-overlay-container-299216");
|
|
16
16
|
export const useModalOverlay = createElemPropsHook(usePopupModel)(({ state }, ref) => {
|
|
17
17
|
const elementRef = useForkRef(ref, state.stackRef);
|
|
@@ -7,10 +7,10 @@ import { system } from '@workday/canvas-tokens-web';
|
|
|
7
7
|
import { useLiveRegion } from './common/useLiveRegion';
|
|
8
8
|
import { PaginationContext } from './usePaginationModel';
|
|
9
9
|
export const paginationAdditionalDetailsStencil = createStencil({
|
|
10
|
-
base: { name: "
|
|
10
|
+
base: { name: "644ko", styles: "box-sizing:border-box;display:flex;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-normal);font-size:var(--cnvs-sys-font-size-subtext-md, var(--cnvs-sys-font-size-subtext-medium, 0.75rem));line-height:var(--cnvs-sys-line-height-subtext-md, var(--cnvs-sys-line-height-subtext-medium, 1rem));letter-spacing:var(--cnvs-sys-letter-spacing-subtext-md, var(--cnvs-sys-type-letter-spacing-subtext-medium));color:var(--cnvs-sys-color-fg-muted-default);margin-block-start:0.75rem;" },
|
|
11
11
|
modifiers: {
|
|
12
12
|
shouldHideDetails: {
|
|
13
|
-
true: { name: "
|
|
13
|
+
true: { name: "1obx02", styles: "clip:rect(1px, 1px, 1px, 1px);clip-path:polygon(0px 0px, 0px 0px, 0px 0px, 0px 0px);position:absolute;overflow:hidden;white-space:nowrap;height:1px;min-height:1px;width:1px;min-width:1px;margin:-1px;padding:0;border:0;margin-block-start:0;" }
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
}, "pagination-additional-details-9f0e61");
|