@broxus/react-uikit 0.22.0 → 0.23.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/dist/assets/accordion.css +135 -0
- package/dist/assets/alert.css +120 -0
- package/dist/assets/align.css +105 -0
- package/dist/assets/animation.css +387 -0
- package/dist/assets/article.css +51 -0
- package/dist/assets/background.css +209 -0
- package/dist/assets/badge.css +46 -0
- package/dist/assets/base.css +571 -0
- package/dist/assets/breadcrumb.css +69 -0
- package/dist/assets/button.css +491 -0
- package/dist/assets/card.css +255 -0
- package/dist/assets/checkbox.css +240 -0
- package/dist/assets/close.css +24 -0
- package/dist/assets/column.css +145 -0
- package/dist/assets/comment.css +87 -0
- package/dist/assets/container.css +171 -0
- package/dist/assets/control.css +262 -0
- package/dist/assets/cover.css +55 -0
- package/dist/assets/datepicker.css +662 -0
- package/dist/assets/description-list.css +39 -0
- package/dist/assets/divider.css +98 -0
- package/dist/assets/dotnav.css +100 -0
- package/dist/assets/drawer.css +562 -0
- package/dist/assets/drop.css +47 -0
- package/dist/assets/dropdown.css +118 -0
- package/dist/assets/flex.css +392 -0
- package/dist/assets/form.css +486 -0
- package/dist/assets/grid.css +545 -0
- package/dist/assets/heading.css +175 -0
- package/dist/assets/height.css +63 -0
- package/dist/assets/icon.css +188 -0
- package/dist/assets/iconnav.css +83 -0
- package/dist/assets/input-number.css +89 -0
- package/dist/assets/input-password.css +24 -0
- package/dist/assets/inverse.css +746 -0
- package/dist/assets/label.css +70 -0
- package/dist/assets/leader.css +44 -0
- package/dist/assets/link.css +79 -0
- package/dist/assets/list.css +211 -0
- package/dist/assets/margin.css +362 -0
- package/dist/assets/marker.css +28 -0
- package/dist/assets/mixin.css +1 -0
- package/dist/assets/mixins.css +1 -0
- package/dist/assets/modal.css +227 -0
- package/dist/assets/motion.css +492 -0
- package/dist/assets/nav.css +406 -0
- package/dist/assets/navbar.css +468 -0
- package/dist/assets/overlay.css +38 -0
- package/dist/assets/padding.css +70 -0
- package/dist/assets/pagination.css +78 -0
- package/dist/assets/placeholder.css +27 -0
- package/dist/assets/position.css +216 -0
- package/dist/assets/print.css +43 -0
- package/dist/assets/progress.css +79 -0
- package/dist/assets/radio.css +196 -0
- package/dist/assets/search.css +258 -0
- package/dist/assets/section.css +138 -0
- package/dist/assets/segmented.css +193 -0
- package/dist/assets/select.css +515 -0
- package/dist/assets/slider.css +392 -0
- package/dist/assets/spinner.css +51 -0
- package/dist/assets/sticky.css +31 -0
- package/dist/assets/subnav.css +171 -0
- package/dist/assets/svg.css +23 -0
- package/dist/assets/switch.css +167 -0
- package/dist/assets/table.css +224 -0
- package/dist/assets/tabs.css +631 -0
- package/dist/assets/text.css +385 -0
- package/dist/assets/textarea.css +54 -0
- package/dist/assets/thumbnav.css +67 -0
- package/dist/assets/tile.css +138 -0
- package/dist/assets/tooltip.css +47 -0
- package/dist/assets/totop.css +32 -0
- package/dist/assets/transition.css +154 -0
- package/dist/assets/uikit.min.css +1 -0
- package/dist/assets/utility.css +494 -0
- package/dist/assets/variables.css +1 -0
- package/dist/assets/vars.css +89 -0
- package/dist/assets/visibility.css +140 -0
- package/dist/assets/width.css +538 -0
- package/dist/cjs/components/Accordion/Accordion.d.ts +3 -2
- package/dist/cjs/components/Accordion/Item.d.ts +1 -5
- package/dist/cjs/components/Accordion/Item.js +0 -4
- package/dist/cjs/components/Accordion/index.d.ts +1 -1
- package/dist/cjs/components/Alert/index.js +1 -3
- package/dist/cjs/components/Align/Align.d.ts +1 -1
- package/dist/cjs/components/Align/Center.d.ts +1 -1
- package/dist/cjs/components/Align/Left.d.ts +1 -1
- package/dist/cjs/components/Align/Right.d.ts +1 -1
- package/dist/cjs/components/Article/Article.d.ts +1 -1
- package/dist/cjs/components/Article/Meta.d.ts +1 -1
- package/dist/cjs/components/Article/Title.d.ts +1 -1
- package/dist/cjs/components/Badge/index.d.ts +1 -1
- package/dist/cjs/components/Breadcrumb/Breadcrumb.d.ts +1 -1
- package/dist/cjs/components/Breadcrumb/Item.d.ts +1 -1
- package/dist/cjs/components/Button/Group.d.ts +1 -1
- package/dist/cjs/components/Card/Badge.d.ts +1 -1
- package/dist/cjs/components/Card/Body.d.ts +1 -1
- package/dist/cjs/components/Card/Card.d.ts +1 -1
- package/dist/cjs/components/Card/Footer.d.ts +1 -1
- package/dist/cjs/components/Card/Header.d.ts +1 -1
- package/dist/cjs/components/Card/Media.d.ts +1 -1
- package/dist/cjs/components/Card/Title.d.ts +1 -1
- package/dist/cjs/components/Close/index.d.ts +1 -1
- package/dist/cjs/components/Component/index.d.ts +1 -1
- package/dist/cjs/components/ConfigProvider/index.d.ts +55 -40
- package/dist/cjs/components/Container/index.d.ts +1 -1
- package/dist/cjs/components/Control/Checkbox/Checkbox.d.ts +2 -2
- package/dist/cjs/components/Control/Checkbox/Group.d.ts +2 -2
- package/dist/cjs/components/Control/Checkbox/index.d.ts +1 -1
- package/dist/cjs/components/Control/Input/Input.js +2 -2
- package/dist/cjs/components/Control/Input/Number/index.js +4 -4
- package/dist/cjs/components/Control/Input/useInput.js +2 -1
- package/dist/cjs/components/Control/Radio/Group.js +2 -4
- package/dist/cjs/components/Control/Radio/index.d.ts +1 -1
- package/dist/cjs/components/Control/Select/Select.d.ts +18 -0
- package/dist/cjs/components/Control/Select/Select.js +248 -0
- package/dist/cjs/components/Control/Select/index.d.ts +4 -21
- package/dist/cjs/components/Control/Select/index.js +2 -246
- package/dist/cjs/components/Control/Select/placements.d.ts +1 -1
- package/dist/cjs/components/Control/TextArea/index.d.ts +3 -3
- package/dist/cjs/components/Control/TextArea/index.js +6 -5
- package/dist/cjs/components/Cover/index.d.ts +1 -1
- package/dist/cjs/components/DatePicker/PickerButton.d.ts +1 -1
- package/dist/cjs/components/DatePicker/generatePurePicker.js +1 -3
- package/dist/cjs/components/DescriptionList/Description.d.ts +1 -1
- package/dist/cjs/components/DescriptionList/DescriptionList.d.ts +1 -1
- package/dist/cjs/components/DescriptionList/Term.d.ts +1 -1
- package/dist/cjs/components/Divider/index.d.ts +1 -1
- package/dist/cjs/components/Dotnav/Dotnav.d.ts +1 -1
- package/dist/cjs/components/Dotnav/Item.d.ts +1 -1
- package/dist/cjs/components/Drawer/index.d.ts +1 -1
- package/dist/cjs/components/Drop/index.d.ts +1 -2
- package/dist/cjs/components/Drop/index.js +2 -1
- package/dist/cjs/components/Flex/Flex.d.ts +1 -1
- package/dist/cjs/components/Flex/Item.d.ts +1 -1
- package/dist/cjs/components/Flex/index.d.ts +1 -1
- package/dist/cjs/components/Form/Controls.d.ts +1 -1
- package/dist/cjs/components/Form/ControlsText.d.ts +1 -1
- package/dist/cjs/components/Form/Fieldset.d.ts +1 -1
- package/dist/cjs/components/Form/Form.d.ts +1 -1
- package/dist/cjs/components/Form/Label.d.ts +1 -1
- package/dist/cjs/components/Form/Legend.d.ts +1 -1
- package/dist/cjs/components/Grid/index.d.ts +1 -1
- package/dist/cjs/components/Heading/index.d.ts +1 -1
- package/dist/cjs/components/Icon/Button.d.ts +1 -1
- package/dist/cjs/components/Icon/Icon.d.ts +1 -1
- package/dist/cjs/components/Icon/Link.d.ts +1 -1
- package/dist/cjs/components/Icon/index.d.ts +1 -1
- package/dist/cjs/components/Iconnav/Iconnav.d.ts +1 -1
- package/dist/cjs/components/Iconnav/Item.d.ts +1 -1
- package/dist/cjs/components/Inverse/index.d.ts +2 -2
- package/dist/cjs/components/Label/index.d.ts +1 -1
- package/dist/cjs/components/List/Item.d.ts +1 -1
- package/dist/cjs/components/List/List.d.ts +1 -1
- package/dist/cjs/components/Modal/index.d.ts +1 -1
- package/dist/cjs/components/Nav/Divider.d.ts +1 -1
- package/dist/cjs/components/Nav/Divider.js +4 -8
- package/dist/cjs/components/Nav/Group/InternalNavGroup.d.ts +10 -0
- package/dist/cjs/components/Nav/Group/{InternalNavItemGroup.js → InternalNavGroup.js} +9 -9
- package/dist/cjs/components/Nav/Group/index.d.ts +4 -5
- package/dist/cjs/components/Nav/Group/index.js +12 -15
- package/dist/cjs/components/Nav/Header.d.ts +1 -3
- package/dist/cjs/components/Nav/Header.js +4 -4
- package/dist/cjs/components/Nav/Icon/index.d.ts +7 -0
- package/dist/cjs/components/Nav/{context/PrivateContext.js → Icon/index.js} +13 -5
- package/dist/cjs/components/Nav/Item/InternalNavItem.d.ts +1 -5
- package/dist/cjs/components/Nav/Item/InternalNavItem.js +26 -47
- package/dist/cjs/components/Nav/Item/LegacyNavItem.js +12 -6
- package/dist/cjs/components/Nav/Item/index.d.ts +1 -4
- package/dist/cjs/components/Nav/Item/index.js +9 -12
- package/dist/cjs/components/Nav/Nav.d.ts +8 -21
- package/dist/cjs/components/Nav/Nav.js +84 -89
- package/dist/cjs/components/Nav/Sub/InlineSubNavList.d.ts +1 -1
- package/dist/cjs/components/Nav/Sub/InlineSubNavList.js +6 -6
- package/dist/cjs/components/Nav/Sub/InternalSubNav.d.ts +15 -0
- package/dist/cjs/components/Nav/Sub/InternalSubNav.js +196 -0
- package/dist/cjs/components/Nav/Sub/PopupTrigger.d.ts +2 -1
- package/dist/cjs/components/Nav/Sub/PopupTrigger.js +10 -11
- package/dist/cjs/components/Nav/Sub/SubNavList.d.ts +1 -2
- package/dist/cjs/components/Nav/Sub/SubNavList.js +5 -5
- package/dist/cjs/components/Nav/Sub/index.d.ts +4 -15
- package/dist/cjs/components/Nav/Sub/index.js +11 -174
- package/dist/cjs/components/Nav/context/NavContext.d.ts +7 -3
- package/dist/cjs/components/Nav/context/NavContext.js +6 -6
- package/dist/cjs/components/Nav/context/index.d.ts +3 -0
- package/dist/cjs/components/Nav/context/index.js +19 -0
- package/dist/cjs/components/Nav/hooks/index.d.ts +5 -0
- package/dist/cjs/components/Nav/hooks/index.js +21 -0
- package/dist/cjs/components/Nav/hooks/useAccessibility.d.ts +11 -0
- package/dist/cjs/components/Nav/hooks/useAccessibility.js +97 -99
- package/dist/cjs/components/Nav/hooks/useActive.js +5 -13
- package/dist/cjs/components/Nav/hooks/useDirectionStyle.js +2 -2
- package/dist/cjs/components/Nav/hooks/useKeyRecords.d.ts +3 -3
- package/dist/cjs/components/Nav/hooks/useKeyRecords.js +5 -8
- package/dist/cjs/components/Nav/types.d.ts +14 -1
- package/dist/cjs/components/Nav/utils/alignUtil.d.ts +1 -1
- package/dist/cjs/components/Nav/utils/alignUtil.js +1 -4
- package/dist/cjs/components/Nav/utils/index.d.ts +5 -0
- package/dist/cjs/components/Nav/utils/index.js +21 -0
- package/dist/cjs/components/Nav/utils/nodeUtil.d.ts +2 -2
- package/dist/cjs/components/Nav/utils/nodeUtil.js +38 -34
- package/dist/cjs/components/Nav/utils/warnUtil.js +2 -5
- package/dist/cjs/components/Navbar/Center.d.ts +1 -1
- package/dist/cjs/components/Navbar/Container.d.ts +1 -1
- package/dist/cjs/components/Navbar/Item.d.ts +1 -1
- package/dist/cjs/components/Navbar/Left.d.ts +1 -1
- package/dist/cjs/components/Navbar/Navbar.d.ts +1 -1
- package/dist/cjs/components/Navbar/Right.d.ts +1 -1
- package/dist/cjs/components/Navbar/Toggle.d.ts +1 -1
- package/dist/cjs/components/Overlay/index.d.ts +1 -1
- package/dist/cjs/components/Progress/index.d.ts +1 -1
- package/dist/cjs/components/Section/index.d.ts +1 -1
- package/dist/cjs/components/Segmented/index.d.ts +1 -1
- package/dist/cjs/components/Slider/index.d.ts +1 -2
- package/dist/cjs/components/Spinner/index.d.ts +1 -1
- package/dist/cjs/components/Subnav/Item.d.ts +1 -1
- package/dist/cjs/components/Subnav/Subnav.d.ts +1 -1
- package/dist/cjs/components/Tabs/index.d.ts +6 -4
- package/dist/cjs/components/Tabs/index.js +8 -7
- package/dist/cjs/components/Text/index.d.ts +1 -1
- package/dist/cjs/components/Tile/index.d.ts +1 -1
- package/dist/cjs/components/Width/Width.d.ts +1 -1
- package/dist/cjs/constants.d.ts +12 -0
- package/dist/cjs/constants.js +16 -0
- package/dist/cjs/index.js +1 -1
- package/dist/cjs/utils/motion.d.ts +1 -1
- package/dist/esm/components/Accordion/Accordion.d.ts +3 -2
- package/dist/esm/components/Accordion/Item.d.ts +1 -5
- package/dist/esm/components/Accordion/Item.js +0 -4
- package/dist/esm/components/Accordion/index.d.ts +1 -1
- package/dist/esm/components/Alert/index.js +1 -3
- package/dist/esm/components/Align/Align.d.ts +1 -1
- package/dist/esm/components/Align/Center.d.ts +1 -1
- package/dist/esm/components/Align/Left.d.ts +1 -1
- package/dist/esm/components/Align/Right.d.ts +1 -1
- package/dist/esm/components/Article/Article.d.ts +1 -1
- package/dist/esm/components/Article/Meta.d.ts +1 -1
- package/dist/esm/components/Article/Title.d.ts +1 -1
- package/dist/esm/components/Badge/index.d.ts +1 -1
- package/dist/esm/components/Breadcrumb/Breadcrumb.d.ts +1 -1
- package/dist/esm/components/Breadcrumb/Item.d.ts +1 -1
- package/dist/esm/components/Button/Group.d.ts +1 -1
- package/dist/esm/components/Card/Badge.d.ts +1 -1
- package/dist/esm/components/Card/Body.d.ts +1 -1
- package/dist/esm/components/Card/Card.d.ts +1 -1
- package/dist/esm/components/Card/Footer.d.ts +1 -1
- package/dist/esm/components/Card/Header.d.ts +1 -1
- package/dist/esm/components/Card/Media.d.ts +1 -1
- package/dist/esm/components/Card/Title.d.ts +1 -1
- package/dist/esm/components/Close/index.d.ts +1 -1
- package/dist/esm/components/Component/index.d.ts +1 -1
- package/dist/esm/components/ConfigProvider/index.d.ts +55 -40
- package/dist/esm/components/Container/index.d.ts +1 -1
- package/dist/esm/components/Control/Checkbox/Checkbox.d.ts +2 -2
- package/dist/esm/components/Control/Checkbox/Group.d.ts +2 -2
- package/dist/esm/components/Control/Checkbox/index.d.ts +1 -1
- package/dist/esm/components/Control/Input/Input.js +1 -1
- package/dist/esm/components/Control/Input/Number/index.js +3 -3
- package/dist/esm/components/Control/Input/useInput.js +2 -1
- package/dist/esm/components/Control/Radio/Group.js +2 -4
- package/dist/esm/components/Control/Radio/index.d.ts +1 -1
- package/dist/esm/components/Control/Select/Select.d.ts +18 -0
- package/dist/esm/components/Control/Select/Select.js +209 -0
- package/dist/esm/components/Control/Select/index.d.ts +4 -21
- package/dist/esm/components/Control/Select/index.js +1 -210
- package/dist/esm/components/Control/Select/placements.d.ts +1 -1
- package/dist/esm/components/Control/TextArea/index.d.ts +3 -3
- package/dist/esm/components/Control/TextArea/index.js +5 -4
- package/dist/esm/components/Cover/index.d.ts +1 -1
- package/dist/esm/components/DatePicker/PickerButton.d.ts +1 -1
- package/dist/esm/components/DatePicker/generatePurePicker.js +1 -3
- package/dist/esm/components/DescriptionList/Description.d.ts +1 -1
- package/dist/esm/components/DescriptionList/DescriptionList.d.ts +1 -1
- package/dist/esm/components/DescriptionList/Term.d.ts +1 -1
- package/dist/esm/components/Divider/index.d.ts +1 -1
- package/dist/esm/components/Dotnav/Dotnav.d.ts +1 -1
- package/dist/esm/components/Dotnav/Item.d.ts +1 -1
- package/dist/esm/components/Drawer/index.d.ts +1 -1
- package/dist/esm/components/Drop/index.d.ts +1 -2
- package/dist/esm/components/Drop/index.js +2 -1
- package/dist/esm/components/Flex/Flex.d.ts +1 -1
- package/dist/esm/components/Flex/Item.d.ts +1 -1
- package/dist/esm/components/Flex/index.d.ts +1 -1
- package/dist/esm/components/Form/Controls.d.ts +1 -1
- package/dist/esm/components/Form/ControlsText.d.ts +1 -1
- package/dist/esm/components/Form/Fieldset.d.ts +1 -1
- package/dist/esm/components/Form/Form.d.ts +1 -1
- package/dist/esm/components/Form/Label.d.ts +1 -1
- package/dist/esm/components/Form/Legend.d.ts +1 -1
- package/dist/esm/components/Grid/index.d.ts +1 -1
- package/dist/esm/components/Heading/index.d.ts +1 -1
- package/dist/esm/components/Icon/Button.d.ts +1 -1
- package/dist/esm/components/Icon/Icon.d.ts +1 -1
- package/dist/esm/components/Icon/Link.d.ts +1 -1
- package/dist/esm/components/Icon/index.d.ts +1 -1
- package/dist/esm/components/Iconnav/Iconnav.d.ts +1 -1
- package/dist/esm/components/Iconnav/Item.d.ts +1 -1
- package/dist/esm/components/Inverse/index.d.ts +2 -2
- package/dist/esm/components/Label/index.d.ts +1 -1
- package/dist/esm/components/List/Item.d.ts +1 -1
- package/dist/esm/components/List/List.d.ts +1 -1
- package/dist/esm/components/Modal/index.d.ts +1 -1
- package/dist/esm/components/Nav/Divider.d.ts +1 -1
- package/dist/esm/components/Nav/Divider.js +2 -6
- package/dist/esm/components/Nav/Group/InternalNavGroup.d.ts +10 -0
- package/dist/esm/components/Nav/Group/InternalNavGroup.js +16 -0
- package/dist/esm/components/Nav/Group/index.d.ts +4 -5
- package/dist/esm/components/Nav/Group/index.js +7 -7
- package/dist/esm/components/Nav/Header.d.ts +1 -3
- package/dist/esm/components/Nav/Header.js +3 -3
- package/dist/esm/components/Nav/Icon/index.d.ts +7 -0
- package/dist/esm/components/Nav/Icon/index.js +14 -0
- package/dist/esm/components/Nav/Item/InternalNavItem.d.ts +1 -5
- package/dist/esm/components/Nav/Item/InternalNavItem.js +16 -37
- package/dist/esm/components/Nav/Item/LegacyNavItem.js +11 -5
- package/dist/esm/components/Nav/Item/index.d.ts +1 -4
- package/dist/esm/components/Nav/Item/index.js +5 -8
- package/dist/esm/components/Nav/Nav.d.ts +8 -21
- package/dist/esm/components/Nav/Nav.js +70 -75
- package/dist/esm/components/Nav/Sub/InlineSubNavList.d.ts +1 -1
- package/dist/esm/components/Nav/Sub/InlineSubNavList.js +3 -3
- package/dist/esm/components/Nav/Sub/InternalSubNav.d.ts +15 -0
- package/dist/esm/components/Nav/Sub/InternalSubNav.js +157 -0
- package/dist/esm/components/Nav/Sub/PopupTrigger.d.ts +2 -1
- package/dist/esm/components/Nav/Sub/PopupTrigger.js +9 -10
- package/dist/esm/components/Nav/Sub/SubNavList.d.ts +1 -2
- package/dist/esm/components/Nav/Sub/SubNavList.js +4 -4
- package/dist/esm/components/Nav/Sub/index.d.ts +4 -15
- package/dist/esm/components/Nav/Sub/index.js +7 -167
- package/dist/esm/components/Nav/context/NavContext.d.ts +7 -3
- package/dist/esm/components/Nav/context/NavContext.js +6 -6
- package/dist/esm/components/Nav/context/index.d.ts +3 -0
- package/dist/esm/components/Nav/context/index.js +3 -0
- package/dist/esm/components/Nav/hooks/index.d.ts +5 -0
- package/dist/esm/components/Nav/hooks/index.js +5 -0
- package/dist/esm/components/Nav/hooks/useAccessibility.d.ts +11 -0
- package/dist/esm/components/Nav/hooks/useAccessibility.js +96 -100
- package/dist/esm/components/Nav/hooks/useActive.js +5 -13
- package/dist/esm/components/Nav/hooks/useDirectionStyle.js +1 -1
- package/dist/esm/components/Nav/hooks/useKeyRecords.d.ts +3 -3
- package/dist/esm/components/Nav/hooks/useKeyRecords.js +3 -3
- package/dist/esm/components/Nav/types.d.ts +14 -1
- package/dist/esm/components/Nav/utils/alignUtil.d.ts +1 -1
- package/dist/esm/components/Nav/utils/alignUtil.js +1 -4
- package/dist/esm/components/Nav/utils/index.d.ts +5 -0
- package/dist/esm/components/Nav/utils/index.js +5 -0
- package/dist/esm/components/Nav/utils/nodeUtil.d.ts +2 -2
- package/dist/esm/components/Nav/utils/nodeUtil.js +38 -31
- package/dist/esm/components/Nav/utils/warnUtil.js +1 -1
- package/dist/esm/components/Navbar/Center.d.ts +1 -1
- package/dist/esm/components/Navbar/Container.d.ts +1 -1
- package/dist/esm/components/Navbar/Item.d.ts +1 -1
- package/dist/esm/components/Navbar/Left.d.ts +1 -1
- package/dist/esm/components/Navbar/Navbar.d.ts +1 -1
- package/dist/esm/components/Navbar/Right.d.ts +1 -1
- package/dist/esm/components/Navbar/Toggle.d.ts +1 -1
- package/dist/esm/components/Overlay/index.d.ts +1 -1
- package/dist/esm/components/Progress/index.d.ts +1 -1
- package/dist/esm/components/Section/index.d.ts +1 -1
- package/dist/esm/components/Segmented/index.d.ts +1 -1
- package/dist/esm/components/Slider/index.d.ts +1 -2
- package/dist/esm/components/Spinner/index.d.ts +1 -1
- package/dist/esm/components/Subnav/Item.d.ts +1 -1
- package/dist/esm/components/Subnav/Subnav.d.ts +1 -1
- package/dist/esm/components/Tabs/index.d.ts +6 -4
- package/dist/esm/components/Tabs/index.js +8 -7
- package/dist/esm/components/Text/index.d.ts +1 -1
- package/dist/esm/components/Tile/index.d.ts +1 -1
- package/dist/esm/components/Width/Width.d.ts +1 -1
- package/dist/esm/constants.d.ts +12 -0
- package/dist/esm/constants.js +13 -0
- package/dist/esm/utils/motion.d.ts +1 -1
- package/package.json +23 -20
- package/styles/accordion.scss +56 -30
- package/styles/alert.scss +6 -5
- package/styles/animation.scss +64 -213
- package/styles/background.scss +34 -131
- package/styles/base.scss +37 -65
- package/styles/breadcrumb.scss +6 -9
- package/styles/button.scss +22 -62
- package/styles/control.scss +1 -0
- package/styles/datepicker.scss +3 -2
- package/styles/input-number.scss +11 -21
- package/styles/leader.scss +2 -2
- package/styles/mixins.scss +10 -19
- package/styles/nav.scss +7 -28
- package/styles/navbar.scss +185 -160
- package/styles/search.scss +16 -46
- package/styles/select.scss +9 -4
- package/styles/subnav.scss +1 -1
- package/styles/switch.scss +12 -0
- package/styles/tabs.scss +65 -37
- package/styles/text.scss +65 -65
- package/styles/thumbnav.scss +4 -4
- package/styles/variables.scss +36 -19
- package/dist/cjs/components/Nav/Group/InternalNavItemGroup.d.ts +0 -14
- package/dist/cjs/components/Nav/context/PrivateContext.d.ts +0 -7
- package/dist/cjs/components/Nav/hooks/useUUID.d.ts +0 -1
- package/dist/cjs/components/Nav/hooks/useUUID.js +0 -56
- package/dist/esm/components/Nav/Group/InternalNavItemGroup.d.ts +0 -14
- package/dist/esm/components/Nav/Group/InternalNavItemGroup.js +0 -16
- package/dist/esm/components/Nav/context/PrivateContext.d.ts +0 -7
- package/dist/esm/components/Nav/context/PrivateContext.js +0 -6
- package/dist/esm/components/Nav/hooks/useUUID.d.ts +0 -1
- package/dist/esm/components/Nav/hooks/useUUID.js +0 -17
|
@@ -1,3 +1,14 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { type NavMode } from '../../../components/Nav/types';
|
|
3
|
+
/**
|
|
4
|
+
* Get focusable elements from the element set under provided container
|
|
5
|
+
*/
|
|
6
|
+
export declare function getFocusableElements(container: HTMLElement, elements: Set<HTMLElement>): HTMLElement[];
|
|
7
|
+
type RefreshElements = {
|
|
8
|
+
element2key: Map<HTMLElement, string>;
|
|
9
|
+
elements: Set<HTMLElement>;
|
|
10
|
+
key2element: Map<string, HTMLElement>;
|
|
11
|
+
};
|
|
12
|
+
export declare function refreshElements(keys: string[], id: string): RefreshElements;
|
|
3
13
|
export declare function useAccessibility<T extends HTMLElement>(mode: NavMode, activeKey: string, isRtl: boolean, id: string, containerRef: React.RefObject<HTMLUListElement | null>, getKeys: () => string[], getKeyPath: (key: string, includeOverflow?: boolean) => string[], triggerActiveKey: (key: string) => void, triggerAccessibilityOpen: (key: string, open?: boolean) => void, originOnKeyDown?: React.KeyboardEventHandler<T>): React.KeyboardEventHandler<T>;
|
|
14
|
+
export {};
|
|
@@ -36,43 +36,53 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
36
36
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
37
37
|
};
|
|
38
38
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
39
|
+
exports.getFocusableElements = getFocusableElements;
|
|
40
|
+
exports.refreshElements = refreshElements;
|
|
39
41
|
exports.useAccessibility = useAccessibility;
|
|
40
|
-
const focus_1 = require("@rc-component/util/
|
|
41
|
-
const
|
|
42
|
-
const raf_1 = __importDefault(require("@rc-component/util/lib/raf"));
|
|
42
|
+
const focus_1 = require("@rc-component/util/es/Dom/focus");
|
|
43
|
+
const raf_1 = __importDefault(require("@rc-component/util/es/raf"));
|
|
43
44
|
const React = __importStar(require("react"));
|
|
44
|
-
const
|
|
45
|
-
|
|
46
|
-
const
|
|
47
|
-
|
|
48
|
-
|
|
45
|
+
const context_1 = require("../../../components/Nav/context");
|
|
46
|
+
const constants_1 = require("../../../constants");
|
|
47
|
+
const ArrowKeys = [
|
|
48
|
+
constants_1.KeyCode.ArrowDown,
|
|
49
|
+
constants_1.KeyCode.ArrowLeft,
|
|
50
|
+
constants_1.KeyCode.ArrowRight,
|
|
51
|
+
constants_1.KeyCode.ArrowUp,
|
|
52
|
+
];
|
|
53
|
+
const EdgeKeys = [constants_1.KeyCode.Home, constants_1.KeyCode.End];
|
|
54
|
+
const EnteringKeys = [constants_1.KeyCode.Enter, constants_1.KeyCode.Space];
|
|
55
|
+
function getOffset(mode, isRootLevel, isRtl, isShiftKey, keyCode) {
|
|
49
56
|
const prev = 'prev';
|
|
50
57
|
const next = 'next';
|
|
51
58
|
const children = 'children';
|
|
52
59
|
const parent = 'parent';
|
|
53
60
|
// Inline enter is special that we use unique operation
|
|
54
|
-
if (mode === 'inline' &&
|
|
55
|
-
return {
|
|
56
|
-
inlineTrigger: true,
|
|
57
|
-
};
|
|
61
|
+
if (mode === 'inline' && [constants_1.KeyCode.Enter.toString(), constants_1.KeyCode.Space.toString()].includes(keyCode)) {
|
|
62
|
+
return { inlineTrigger: true };
|
|
58
63
|
}
|
|
59
64
|
const inline = {
|
|
60
|
-
[
|
|
61
|
-
[
|
|
65
|
+
[constants_1.KeyCode.ArrowDown]: next,
|
|
66
|
+
[constants_1.KeyCode.ArrowUp]: prev,
|
|
67
|
+
[constants_1.KeyCode.Tab]: isShiftKey ? prev : next,
|
|
62
68
|
};
|
|
63
69
|
const horizontal = {
|
|
64
|
-
[
|
|
65
|
-
[
|
|
66
|
-
[
|
|
67
|
-
[
|
|
70
|
+
[constants_1.KeyCode.ArrowDown]: children,
|
|
71
|
+
[constants_1.KeyCode.ArrowLeft]: isRtl ? next : prev,
|
|
72
|
+
[constants_1.KeyCode.ArrowRight]: isRtl ? prev : next,
|
|
73
|
+
[constants_1.KeyCode.Enter]: children,
|
|
74
|
+
[constants_1.KeyCode.Space]: children,
|
|
75
|
+
[constants_1.KeyCode.Tab]: isShiftKey ? prev : next,
|
|
68
76
|
};
|
|
69
77
|
const vertical = {
|
|
70
|
-
[
|
|
71
|
-
[
|
|
72
|
-
[
|
|
73
|
-
[
|
|
74
|
-
[
|
|
75
|
-
[
|
|
78
|
+
[constants_1.KeyCode.ArrowDown]: next,
|
|
79
|
+
[constants_1.KeyCode.ArrowLeft]: isRtl ? children : parent,
|
|
80
|
+
[constants_1.KeyCode.ArrowRight]: isRtl ? parent : children,
|
|
81
|
+
[constants_1.KeyCode.ArrowUp]: prev,
|
|
82
|
+
[constants_1.KeyCode.Enter]: children,
|
|
83
|
+
[constants_1.KeyCode.Escape]: parent,
|
|
84
|
+
[constants_1.KeyCode.Space]: children,
|
|
85
|
+
[constants_1.KeyCode.Tab]: isShiftKey ? prev : next,
|
|
76
86
|
};
|
|
77
87
|
const offsets = {
|
|
78
88
|
horizontal,
|
|
@@ -82,42 +92,30 @@ function getOffset(mode, isRootLevel, isRtl, which) {
|
|
|
82
92
|
vertical,
|
|
83
93
|
verticalSub: vertical,
|
|
84
94
|
};
|
|
85
|
-
|
|
95
|
+
// @ts-ignore .....
|
|
96
|
+
const type = offsets[`${mode}${isRootLevel ? '' : 'Sub'}`]?.[keyCode];
|
|
86
97
|
switch (type) {
|
|
87
98
|
case prev:
|
|
88
|
-
return {
|
|
89
|
-
offset: -1,
|
|
90
|
-
sibling: true,
|
|
91
|
-
};
|
|
99
|
+
return { offset: -1, sibling: true };
|
|
92
100
|
case next:
|
|
93
|
-
return {
|
|
94
|
-
offset: 1,
|
|
95
|
-
sibling: true,
|
|
96
|
-
};
|
|
101
|
+
return { offset: 1, sibling: true };
|
|
97
102
|
case parent:
|
|
98
|
-
return {
|
|
99
|
-
offset: -1,
|
|
100
|
-
sibling: false,
|
|
101
|
-
};
|
|
103
|
+
return { offset: -1, sibling: false };
|
|
102
104
|
case children:
|
|
103
|
-
return {
|
|
104
|
-
offset: 1,
|
|
105
|
-
sibling: false,
|
|
106
|
-
};
|
|
105
|
+
return { offset: 1, sibling: false };
|
|
107
106
|
default:
|
|
108
|
-
return
|
|
107
|
+
return undefined;
|
|
109
108
|
}
|
|
110
109
|
}
|
|
111
110
|
function findContainerUL(element) {
|
|
112
111
|
let current = element;
|
|
113
112
|
while (current) {
|
|
114
|
-
if (current.
|
|
113
|
+
if (current.hasAttribute('data-nav-list')) {
|
|
115
114
|
return current;
|
|
116
115
|
}
|
|
117
116
|
current = current.parentElement;
|
|
118
117
|
}
|
|
119
118
|
// Normally should not reach this line
|
|
120
|
-
/* istanbul ignore next */
|
|
121
119
|
return null;
|
|
122
120
|
}
|
|
123
121
|
/**
|
|
@@ -131,7 +129,7 @@ function getFocusElement(activeElement, elements) {
|
|
|
131
129
|
}
|
|
132
130
|
current = current.parentElement;
|
|
133
131
|
}
|
|
134
|
-
return
|
|
132
|
+
return undefined;
|
|
135
133
|
}
|
|
136
134
|
/**
|
|
137
135
|
* Get focusable elements from the element set under provided container
|
|
@@ -140,16 +138,16 @@ function getFocusableElements(container, elements) {
|
|
|
140
138
|
const list = (0, focus_1.getFocusNodeList)(container, true);
|
|
141
139
|
return list.filter(ele => elements.has(ele));
|
|
142
140
|
}
|
|
143
|
-
function getNextFocusElement(parentQueryContainer, elements,
|
|
141
|
+
function getNextFocusElement(parentQueryContainer, elements, focusNavElement, offset = 1) {
|
|
144
142
|
// Key on the menu item will not get validate parent container
|
|
145
143
|
if (!parentQueryContainer) {
|
|
146
144
|
return undefined;
|
|
147
145
|
}
|
|
148
146
|
// List current level menu item elements
|
|
149
|
-
const
|
|
147
|
+
const sameLevelFocusableNavElementList = getFocusableElements(parentQueryContainer, elements);
|
|
150
148
|
// Find next focus index
|
|
151
|
-
const count =
|
|
152
|
-
let focusIndex =
|
|
149
|
+
const count = sameLevelFocusableNavElementList.length;
|
|
150
|
+
let focusIndex = sameLevelFocusableNavElementList.findIndex(ele => focusNavElement === ele);
|
|
153
151
|
if (offset < 0) {
|
|
154
152
|
if (focusIndex === -1) {
|
|
155
153
|
focusIndex = count - 1;
|
|
@@ -163,7 +161,21 @@ function getNextFocusElement(parentQueryContainer, elements, focusMenuElement, o
|
|
|
163
161
|
}
|
|
164
162
|
focusIndex = (focusIndex + count) % count;
|
|
165
163
|
// Focus menu item
|
|
166
|
-
return
|
|
164
|
+
return sameLevelFocusableNavElementList[focusIndex];
|
|
165
|
+
}
|
|
166
|
+
function refreshElements(keys, id) {
|
|
167
|
+
const elements = new Set();
|
|
168
|
+
const key2element = new Map();
|
|
169
|
+
const element2key = new Map();
|
|
170
|
+
keys.forEach(key => {
|
|
171
|
+
const element = document.querySelector(`[data-nav-id='${(0, context_1.getNavId)(id, key)}']`);
|
|
172
|
+
if (element) {
|
|
173
|
+
elements.add(element);
|
|
174
|
+
element2key.set(element, key);
|
|
175
|
+
key2element.set(key, element);
|
|
176
|
+
}
|
|
177
|
+
});
|
|
178
|
+
return { element2key, elements, key2element };
|
|
167
179
|
}
|
|
168
180
|
function useAccessibility(mode, activeKey, isRtl, id, containerRef, getKeys, getKeyPath, triggerActiveKey, triggerAccessibilityOpen, originOnKeyDown) {
|
|
169
181
|
const rafRef = React.useRef(undefined);
|
|
@@ -176,50 +188,33 @@ function useAccessibility(mode, activeKey, isRtl, id, containerRef, getKeys, get
|
|
|
176
188
|
cleanRaf();
|
|
177
189
|
}, []);
|
|
178
190
|
return event => {
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
// >>> Wrap as function since we use raf for some case
|
|
184
|
-
const refreshElements = () => {
|
|
185
|
-
elements = new Set();
|
|
186
|
-
key2element = new Map();
|
|
187
|
-
element2key = new Map();
|
|
188
|
-
const keys = getKeys();
|
|
189
|
-
keys.forEach(key => {
|
|
190
|
-
const element = document.querySelector(`[data-nav-id='${(0, IdContext_1.getNavId)(id, key)}']`);
|
|
191
|
-
if (element) {
|
|
192
|
-
elements.add(element);
|
|
193
|
-
element2key.set(element, key);
|
|
194
|
-
key2element.set(key, element);
|
|
195
|
-
}
|
|
196
|
-
});
|
|
197
|
-
return elements;
|
|
198
|
-
};
|
|
199
|
-
refreshElements();
|
|
191
|
+
if ([...ArrowKeys, ...EdgeKeys, ...EnteringKeys, constants_1.KeyCode.Escape, constants_1.KeyCode.Tab].includes(event.code)) {
|
|
192
|
+
const keys = getKeys();
|
|
193
|
+
let refreshedElements = refreshElements(keys, id);
|
|
194
|
+
const { element2key, elements, key2element } = refreshedElements;
|
|
200
195
|
// First we should find current focused MenuItem/SubMenu element
|
|
201
196
|
const activeElement = key2element.get(activeKey);
|
|
202
197
|
const focusMenuElement = getFocusElement(activeElement, elements);
|
|
203
|
-
const focusMenuKey = focusMenuElement ? element2key.get(focusMenuElement) :
|
|
204
|
-
const offsetObj = getOffset(mode, focusMenuKey
|
|
198
|
+
const focusMenuKey = focusMenuElement ? element2key.get(focusMenuElement) : null;
|
|
199
|
+
const offsetObj = getOffset(mode, focusMenuKey != null ? getKeyPath(focusMenuKey, true).length === 1 : true, isRtl, event.shiftKey, event.code);
|
|
205
200
|
// Some mode do not have fully arrow operation like inline
|
|
206
|
-
if (!offsetObj) {
|
|
201
|
+
if (!offsetObj && event.code !== constants_1.KeyCode.Home && event.code !== constants_1.KeyCode.End) {
|
|
207
202
|
return;
|
|
208
203
|
}
|
|
209
204
|
// Arrow prevent default to avoid page scroll
|
|
210
|
-
if (ArrowKeys.includes(
|
|
205
|
+
if ([...ArrowKeys, ...EdgeKeys, constants_1.KeyCode.Enter, constants_1.KeyCode.Tab].includes(event.code)) {
|
|
211
206
|
event.preventDefault();
|
|
212
207
|
}
|
|
213
|
-
const tryFocus = (
|
|
214
|
-
if (
|
|
215
|
-
let focusTargetElement =
|
|
208
|
+
const tryFocus = (navElement) => {
|
|
209
|
+
if (navElement) {
|
|
210
|
+
let focusTargetElement = navElement;
|
|
216
211
|
// Focus to link instead of menu item if possible
|
|
217
|
-
const link =
|
|
212
|
+
const link = navElement.querySelector('a');
|
|
218
213
|
if (link?.getAttribute('href')) {
|
|
219
214
|
focusTargetElement = link;
|
|
220
215
|
}
|
|
221
|
-
const targetKey = element2key.get(
|
|
222
|
-
if (targetKey
|
|
216
|
+
const targetKey = element2key.get(navElement);
|
|
217
|
+
if (targetKey != null) {
|
|
223
218
|
triggerActiveKey(targetKey);
|
|
224
219
|
}
|
|
225
220
|
/**
|
|
@@ -235,25 +230,28 @@ function useAccessibility(mode, activeKey, isRtl, id, containerRef, getKeys, get
|
|
|
235
230
|
});
|
|
236
231
|
}
|
|
237
232
|
};
|
|
238
|
-
|
|
233
|
+
// @ts-ignore .....
|
|
234
|
+
if (EdgeKeys.includes(event.code) || offsetObj?.sibling || !focusMenuElement) {
|
|
239
235
|
// ========================== Sibling ==========================
|
|
240
236
|
// Find walkable focus menu element container
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
}
|
|
245
|
-
else {
|
|
246
|
-
parentQueryContainer = findContainerUL(focusMenuElement);
|
|
247
|
-
}
|
|
237
|
+
const parentQueryContainer = (!focusMenuElement || mode === 'inline')
|
|
238
|
+
? containerRef.current
|
|
239
|
+
: findContainerUL(focusMenuElement);
|
|
248
240
|
if (parentQueryContainer == null) {
|
|
249
241
|
return;
|
|
250
242
|
}
|
|
251
243
|
// Get next focus element
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
244
|
+
let targetElement;
|
|
245
|
+
const focusableElements = getFocusableElements(parentQueryContainer, elements);
|
|
246
|
+
if (event.code === constants_1.KeyCode.Home) {
|
|
247
|
+
[targetElement] = focusableElements;
|
|
248
|
+
}
|
|
249
|
+
else if (event.code === constants_1.KeyCode.End) {
|
|
250
|
+
targetElement = focusableElements[focusableElements.length - 1];
|
|
251
|
+
}
|
|
252
|
+
else {
|
|
253
|
+
targetElement = getNextFocusElement(parentQueryContainer, elements, focusMenuElement, offsetObj?.offset);
|
|
254
|
+
}
|
|
257
255
|
if (targetElement == null) {
|
|
258
256
|
return;
|
|
259
257
|
}
|
|
@@ -261,17 +259,17 @@ function useAccessibility(mode, activeKey, isRtl, id, containerRef, getKeys, get
|
|
|
261
259
|
tryFocus(targetElement);
|
|
262
260
|
}
|
|
263
261
|
// ======================= InlineTrigger =======================
|
|
264
|
-
else if (offsetObj
|
|
262
|
+
else if (offsetObj?.inlineTrigger && focusMenuKey) {
|
|
265
263
|
// Inline trigger no need switch to sub menu item
|
|
266
264
|
triggerAccessibilityOpen(focusMenuKey);
|
|
267
265
|
}
|
|
268
266
|
// =========================== Level ===========================
|
|
269
|
-
else if (offsetObj
|
|
267
|
+
else if ((offsetObj?.offset ?? 0) > 0 && focusMenuKey) {
|
|
270
268
|
triggerAccessibilityOpen(focusMenuKey, true);
|
|
271
269
|
cleanRaf();
|
|
272
270
|
rafRef.current = (0, raf_1.default)(() => {
|
|
273
271
|
// Async should re-sync elements
|
|
274
|
-
refreshElements();
|
|
272
|
+
refreshedElements = refreshElements(keys, id);
|
|
275
273
|
const controlId = focusMenuElement.getAttribute('aria-controls');
|
|
276
274
|
if (controlId == null) {
|
|
277
275
|
return;
|
|
@@ -289,12 +287,12 @@ function useAccessibility(mode, activeKey, isRtl, id, containerRef, getKeys, get
|
|
|
289
287
|
tryFocus(targetElement);
|
|
290
288
|
}, 5);
|
|
291
289
|
}
|
|
292
|
-
else if ((
|
|
290
|
+
else if ((offsetObj?.offset ?? 0) < 0 && focusMenuKey) {
|
|
293
291
|
const keyPath = getKeyPath(focusMenuKey, true);
|
|
294
292
|
const parentKey = keyPath[keyPath.length - 2];
|
|
295
|
-
const parentMenuElement = key2element.get(parentKey);
|
|
296
293
|
// Focus menu item
|
|
297
294
|
triggerAccessibilityOpen(parentKey, false);
|
|
295
|
+
const parentMenuElement = key2element.get(parentKey);
|
|
298
296
|
if (parentMenuElement == null) {
|
|
299
297
|
return;
|
|
300
298
|
}
|
|
@@ -35,12 +35,10 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
35
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
36
|
exports.useActive = useActive;
|
|
37
37
|
const React = __importStar(require("react"));
|
|
38
|
-
const
|
|
38
|
+
const context_1 = require("../../../components/Nav/context");
|
|
39
39
|
function useActive(eventKey, disabled, onMouseEnter, onMouseLeave) {
|
|
40
|
-
const {
|
|
41
|
-
|
|
42
|
-
activeKey, onActive, onInactive, } = React.useContext(NavContext_1.NavContext);
|
|
43
|
-
if (eventKey === undefined) {
|
|
40
|
+
const { activeKey, onActive, onInactive } = React.useContext(context_1.NavContext);
|
|
41
|
+
if (eventKey == null) {
|
|
44
42
|
return { active: false };
|
|
45
43
|
}
|
|
46
44
|
const ret = {
|
|
@@ -49,17 +47,11 @@ function useActive(eventKey, disabled, onMouseEnter, onMouseLeave) {
|
|
|
49
47
|
// Skip when disabled
|
|
50
48
|
if (!disabled) {
|
|
51
49
|
ret.onMouseEnter = domEvent => {
|
|
52
|
-
onMouseEnter?.({
|
|
53
|
-
domEvent,
|
|
54
|
-
key: eventKey,
|
|
55
|
-
});
|
|
50
|
+
onMouseEnter?.({ domEvent, key: eventKey });
|
|
56
51
|
onActive(eventKey);
|
|
57
52
|
};
|
|
58
53
|
ret.onMouseLeave = domEvent => {
|
|
59
|
-
onMouseLeave?.({
|
|
60
|
-
domEvent,
|
|
61
|
-
key: eventKey,
|
|
62
|
-
});
|
|
54
|
+
onMouseLeave?.({ domEvent, key: eventKey });
|
|
63
55
|
onInactive(eventKey);
|
|
64
56
|
};
|
|
65
57
|
}
|
|
@@ -35,9 +35,9 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
35
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
36
|
exports.useDirectionStyle = useDirectionStyle;
|
|
37
37
|
const React = __importStar(require("react"));
|
|
38
|
-
const
|
|
38
|
+
const context_1 = require("../../../components/Nav/context");
|
|
39
39
|
function useDirectionStyle(level) {
|
|
40
|
-
const { inlineIndent, mode, rtl } = React.useContext(
|
|
40
|
+
const { inlineIndent, mode, rtl } = React.useContext(context_1.NavContext);
|
|
41
41
|
if (mode !== 'inline') {
|
|
42
42
|
return null;
|
|
43
43
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export declare const OVERFLOW_KEY = "
|
|
2
|
-
|
|
1
|
+
export declare const OVERFLOW_KEY = "uk-nav-more";
|
|
2
|
+
interface KeyRecords {
|
|
3
3
|
getKeyPath: (eventKey: string, includeOverflow?: boolean | undefined) => string[];
|
|
4
4
|
getKeys: () => string[];
|
|
5
5
|
getSubPathKeys: (key: string) => Set<string>;
|
|
@@ -7,6 +7,6 @@ type KeyRecords = {
|
|
|
7
7
|
refreshOverflowKeys: (keys: string[]) => void;
|
|
8
8
|
registerPath: (key: string, keyPath: string[]) => void;
|
|
9
9
|
unregisterPath: (key: string, keyPath: string[]) => void;
|
|
10
|
-
}
|
|
10
|
+
}
|
|
11
11
|
export declare function useKeyRecords(): KeyRecords;
|
|
12
12
|
export {};
|
|
@@ -32,15 +32,12 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
32
32
|
return result;
|
|
33
33
|
};
|
|
34
34
|
})();
|
|
35
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
36
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
37
|
-
};
|
|
38
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
39
36
|
exports.OVERFLOW_KEY = void 0;
|
|
40
37
|
exports.useKeyRecords = useKeyRecords;
|
|
41
|
-
const
|
|
38
|
+
const util_1 = require("@rc-component/util");
|
|
42
39
|
const React = __importStar(require("react"));
|
|
43
|
-
const
|
|
40
|
+
const utils_1 = require("../../../components/Nav/utils");
|
|
44
41
|
const hooks_1 = require("../../../hooks");
|
|
45
42
|
const PATH_SPLIT = '__RC_UTIL_PATH_SPLIT__';
|
|
46
43
|
function getPathStr(keyPath) {
|
|
@@ -49,7 +46,7 @@ function getPathStr(keyPath) {
|
|
|
49
46
|
function getPathKeys(keyPathStr) {
|
|
50
47
|
return keyPathStr.split(PATH_SPLIT);
|
|
51
48
|
}
|
|
52
|
-
exports.OVERFLOW_KEY = '
|
|
49
|
+
exports.OVERFLOW_KEY = 'uk-nav-more';
|
|
53
50
|
function useKeyRecords() {
|
|
54
51
|
const forceUpdate = (0, hooks_1.useForceUpdate)();
|
|
55
52
|
const key2pathRef = React.useRef(new Map());
|
|
@@ -60,7 +57,7 @@ function useKeyRecords() {
|
|
|
60
57
|
const registerPath = React.useCallback((key, keyPath) => {
|
|
61
58
|
// Warning for invalidate or duplicated `key`
|
|
62
59
|
if (process.env.NODE_ENV !== 'production') {
|
|
63
|
-
(0,
|
|
60
|
+
(0, util_1.warning)(!key2pathRef.current.has(key), `Duplicated key '${key}' used in Menu by path [${keyPath.join(' > ')}]`);
|
|
64
61
|
}
|
|
65
62
|
// Fill map
|
|
66
63
|
const connectedPath = getPathStr(keyPath);
|
|
@@ -68,7 +65,7 @@ function useKeyRecords() {
|
|
|
68
65
|
key2pathRef.current.set(key, connectedPath);
|
|
69
66
|
updateRef.current += 1;
|
|
70
67
|
const id = updateRef.current;
|
|
71
|
-
(0,
|
|
68
|
+
(0, utils_1.nextSlice)(() => {
|
|
72
69
|
if (id === updateRef.current && !destroyRef.current) {
|
|
73
70
|
forceUpdate();
|
|
74
71
|
}
|
|
@@ -1,12 +1,16 @@
|
|
|
1
1
|
import { type ActionType } from '@rc-component/trigger';
|
|
2
2
|
import type * as React from 'react';
|
|
3
|
+
import { type SubNavProps } from '../../components/Nav/Sub/InternalSubNav';
|
|
3
4
|
export interface NavRef {
|
|
5
|
+
findItem: (params: {
|
|
6
|
+
key: string;
|
|
7
|
+
}) => HTMLElement | null;
|
|
4
8
|
/**
|
|
5
9
|
* Focus active child if any, or the first child which is not disabled will be focused.
|
|
6
10
|
* @param {FocusOptions} [options]
|
|
7
11
|
*/
|
|
8
12
|
focus: (options?: FocusOptions) => void;
|
|
9
|
-
list
|
|
13
|
+
list?: HTMLUListElement | null;
|
|
10
14
|
}
|
|
11
15
|
interface ItemSharedProps {
|
|
12
16
|
className?: string;
|
|
@@ -21,6 +25,7 @@ export interface SubNavType extends ItemSharedProps {
|
|
|
21
25
|
label?: React.ReactNode;
|
|
22
26
|
popupClassName?: string;
|
|
23
27
|
popupOffset?: number[];
|
|
28
|
+
popupStyle?: React.CSSProperties;
|
|
24
29
|
rootClassName?: string;
|
|
25
30
|
onClick?: NavClickEventHandler;
|
|
26
31
|
onMouseEnter?: NavHoverEventHandler;
|
|
@@ -31,9 +36,11 @@ export interface SubNavType extends ItemSharedProps {
|
|
|
31
36
|
}
|
|
32
37
|
export interface NavItemType extends ItemSharedProps {
|
|
33
38
|
disabled?: boolean;
|
|
39
|
+
extra?: React.ReactNode;
|
|
34
40
|
itemIcon?: RenderIconType;
|
|
35
41
|
key: React.Key;
|
|
36
42
|
label?: React.ReactNode;
|
|
43
|
+
type?: 'item';
|
|
37
44
|
onClick?: NavClickEventHandler;
|
|
38
45
|
onMouseEnter?: NavHoverEventHandler;
|
|
39
46
|
onMouseLeave?: NavHoverEventHandler;
|
|
@@ -78,4 +85,10 @@ export interface SelectInfo extends NavInfo {
|
|
|
78
85
|
}
|
|
79
86
|
export type SelectEventHandler = (info: SelectInfo) => void;
|
|
80
87
|
export type NavClickEventHandler = (info: NavInfo) => void;
|
|
88
|
+
export type NavComponentType = 'subnav' | 'item' | 'group' | 'divider';
|
|
89
|
+
export type NavComponents = Partial<Record<NavComponentType, React.ComponentType<any>>>;
|
|
90
|
+
export type NavPopupRender = (node: React.ReactElement, info: {
|
|
91
|
+
item: SubNavProps;
|
|
92
|
+
keys: string[];
|
|
93
|
+
}) => React.ReactNode;
|
|
81
94
|
export {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { type AlignType, type BuildInPlacements } from '@rc-component/trigger/
|
|
1
|
+
import { type AlignType, type BuildInPlacements } from '@rc-component/trigger/es/interface';
|
|
2
2
|
export declare function getAlignFromPlacement(builtinPlacements: BuildInPlacements, placementStr: string, align: AlignType): AlignType;
|
|
3
3
|
export declare function getAlignPopupClassName(builtinPlacements: BuildInPlacements, prefixCls: string, align: AlignType, isAlignPoint: boolean): string;
|
|
@@ -10,10 +10,7 @@ function isPointsEq(a1, a2, isAlignPoint) {
|
|
|
10
10
|
}
|
|
11
11
|
function getAlignFromPlacement(builtinPlacements, placementStr, align) {
|
|
12
12
|
const baseAlign = builtinPlacements[placementStr] || {};
|
|
13
|
-
return {
|
|
14
|
-
...baseAlign,
|
|
15
|
-
...align,
|
|
16
|
-
};
|
|
13
|
+
return { ...baseAlign, ...align };
|
|
17
14
|
}
|
|
18
15
|
function getAlignPopupClassName(builtinPlacements, prefixCls, align, isAlignPoint) {
|
|
19
16
|
const { points } = align;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export * from '../../../components/Nav/utils/alignUtil';
|
|
2
|
+
export * from '../../../components/Nav/utils/motionUtil';
|
|
3
|
+
export * from '../../../components/Nav/utils/nodeUtil';
|
|
4
|
+
export * from '../../../components/Nav/utils/timeUtil';
|
|
5
|
+
export * from '../../../components/Nav/utils/warnUtil';
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
__exportStar(require("../../../components/Nav/utils/alignUtil"), exports);
|
|
18
|
+
__exportStar(require("../../../components/Nav/utils/motionUtil"), exports);
|
|
19
|
+
__exportStar(require("../../../components/Nav/utils/nodeUtil"), exports);
|
|
20
|
+
__exportStar(require("../../../components/Nav/utils/timeUtil"), exports);
|
|
21
|
+
__exportStar(require("../../../components/Nav/utils/warnUtil"), exports);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { type ItemType } from '../../../components/Nav/types';
|
|
2
|
+
import { type ItemType, type NavComponents } from '../../../components/Nav/types';
|
|
3
3
|
export declare function parseChildren(children: React.ReactNode | undefined, keyPath: string[]): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>[];
|
|
4
|
-
export declare function parseItems(children: React.ReactNode | undefined, items: ItemType[] | undefined, keyPath: string[]): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>[];
|
|
4
|
+
export declare function parseItems(children: React.ReactNode | undefined, items: ItemType[] | undefined, keyPath: string[], components: NavComponents, prefixCls?: string): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>[];
|