@consta/uikit 3.18.1 → 3.19.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/Attach/package.json +1 -1
- package/Attachment/package.json +1 -1
- package/Avatar/package.json +1 -1
- package/Badge/package.json +1 -1
- package/BasicSelectDeprecated/package.json +1 -1
- package/Breadcrumbs/package.json +1 -1
- package/BreadcrumbsCanary/package.json +1 -1
- package/Button/package.json +1 -1
- package/CHANGELOG.md +41 -64
- package/Calendar/package.json +1 -1
- package/Card/package.json +1 -1
- package/Checkbox/package.json +1 -1
- package/CheckboxGroup/package.json +1 -1
- package/ChoiceGroup/package.json +1 -1
- package/Collapse/package.json +1 -1
- package/CollapseGroup/package.json +1 -1
- package/Combobox/package.json +1 -1
- package/ComboboxDeprecated/package.json +1 -1
- package/ContextMenu/package.json +1 -1
- package/ContextMenuCanary/package.json +1 -1
- package/DatePickerCanary/package.json +1 -1
- package/DateTimeCanary/package.json +1 -1
- package/DragNDropField/package.json +1 -1
- package/EventInterceptor/package.json +1 -1
- package/FieldCaption/package.json +1 -1
- package/FieldLabel/package.json +1 -1
- package/File/package.json +1 -1
- package/FileField/package.json +1 -1
- package/FileIcon/package.json +1 -1
- package/FileIconAvi/package.json +1 -1
- package/FileIconBmp/package.json +1 -1
- package/FileIconCsv/package.json +1 -1
- package/FileIconDoc/package.json +1 -1
- package/FileIconExe/package.json +1 -1
- package/FileIconGif/package.json +1 -1
- package/FileIconJpg/package.json +1 -1
- package/FileIconJson/package.json +1 -1
- package/FileIconLoading/package.json +1 -1
- package/FileIconMov/package.json +1 -1
- package/FileIconMp3/package.json +1 -1
- package/FileIconMp4/package.json +1 -1
- package/FileIconPdf/package.json +1 -1
- package/FileIconPng/package.json +1 -1
- package/FileIconPtt/package.json +1 -1
- package/FileIconRar/package.json +1 -1
- package/FileIconRtf/package.json +1 -1
- package/FileIconTiff/package.json +1 -1
- package/FileIconTxt/package.json +1 -1
- package/FileIconUndefined/package.json +1 -1
- package/FileIconWav/package.json +1 -1
- package/FileIconXls/package.json +1 -1
- package/FileIconZip/package.json +1 -1
- package/Grid/package.json +1 -1
- package/Header/package.json +1 -1
- package/Icon/package.json +1 -1
- package/IconAdd/package.json +1 -1
- package/IconAddToComparison/package.json +1 -1
- package/IconAlert/package.json +1 -1
- package/IconAlignBlocksLeft/package.json +1 -1
- package/IconAlignBlocksRight/package.json +1 -1
- package/IconAlignCenter/package.json +1 -1
- package/IconAlignJustify/package.json +1 -1
- package/IconAlignLeft/package.json +1 -1
- package/IconAlignRight/package.json +1 -1
- package/IconAllDone/package.json +1 -1
- package/IconArrowDown/package.json +1 -1
- package/IconArrowLeft/package.json +1 -1
- package/IconArrowRight/package.json +1 -1
- package/IconArrowUp/package.json +1 -1
- package/IconArtBrush/package.json +1 -1
- package/IconAttach/package.json +1 -1
- package/IconBackward/package.json +1 -1
- package/IconBag/package.json +1 -1
- package/IconBarrier/package.json +1 -1
- package/IconBento/package.json +1 -1
- package/IconBold/package.json +1 -1
- package/IconBook/package.json +1 -1
- package/IconBookmarkFilled/package.json +1 -1
- package/IconBookmarkStroked/package.json +1 -1
- package/IconCalculator/package.json +1 -1
- package/IconCalendar/package.json +1 -1
- package/IconCamera/package.json +1 -1
- package/IconCancel/package.json +1 -1
- package/IconCards/package.json +1 -1
- package/IconChat/package.json +1 -1
- package/IconCheck/package.json +1 -1
- package/IconClose/package.json +1 -1
- package/IconCollapse/package.json +1 -1
- package/IconColorFill/package.json +1 -1
- package/IconColorText/package.json +1 -1
- package/IconColumns/package.json +1 -1
- package/IconComment/package.json +1 -1
- package/IconConnection/package.json +1 -1
- package/IconCopy/package.json +1 -1
- package/IconCrown/package.json +1 -1
- package/IconCursorMouse/package.json +1 -1
- package/IconDataNull/package.json +1 -1
- package/IconDiamond/package.json +1 -1
- package/IconDinosaur/package.json +1 -1
- package/IconDisconnection/package.json +1 -1
- package/IconDocAdd/package.json +1 -1
- package/IconDocBlank/package.json +1 -1
- package/IconDocDelete/package.json +1 -1
- package/IconDocExport/package.json +1 -1
- package/IconDocFilled/package.json +1 -1
- package/IconDown/package.json +1 -1
- package/IconDownload/package.json +1 -1
- package/IconDrag/package.json +1 -1
- package/IconDraggable/package.json +1 -1
- package/IconDrillingRig/package.json +1 -1
- package/IconDrop/package.json +1 -1
- package/IconEdit/package.json +1 -1
- package/IconExit/package.json +1 -1
- package/IconExpand/package.json +1 -1
- package/IconEye/package.json +1 -1
- package/IconEyeClose/package.json +1 -1
- package/IconFacebook/package.json +1 -1
- package/IconFavorite/package.json +1 -1
- package/IconFilter/package.json +1 -1
- package/IconFitToDefault/package.json +1 -1
- package/IconFlagFilled/package.json +1 -1
- package/IconFlagStroked/package.json +1 -1
- package/IconFolders/package.json +1 -1
- package/IconForward/package.json +1 -1
- package/IconFunnel/package.json +1 -1
- package/IconGas/package.json +1 -1
- package/IconGeo/package.json +1 -1
- package/IconGrouping/package.json +1 -1
- package/IconHamburger/package.json +1 -1
- package/IconHand/package.json +1 -1
- package/IconHealth/package.json +1 -1
- package/IconHome/package.json +1 -1
- package/IconInComparison/package.json +1 -1
- package/IconInfo/package.json +1 -1
- package/IconInstagram/package.json +1 -1
- package/IconIntroduction/package.json +1 -1
- package/IconIpad/package.json +1 -1
- package/IconItalic/package.json +1 -1
- package/IconKebab/package.json +1 -1
- package/IconLaptop/package.json +1 -1
- package/IconLayers/package.json +1 -1
- package/IconLeaf/package.json +1 -1
- package/IconLightningBolt/package.json +1 -1
- package/IconLineAndBarChart/package.json +1 -1
- package/IconLink/package.json +1 -1
- package/IconList/package.json +1 -1
- package/IconListNumbered/package.json +1 -1
- package/IconLock/package.json +1 -1
- package/IconLogicalElement/package.json +1 -1
- package/IconMBU/package.json +1 -1
- package/IconMGRP/package.json +1 -1
- package/IconMLSP/package.json +1 -1
- package/IconMMP/package.json +1 -1
- package/IconMail/package.json +1 -1
- package/IconMap/package.json +1 -1
- package/IconMaxHeight/package.json +1 -1
- package/IconMaxWidth/package.json +1 -1
- package/IconMeatball/package.json +1 -1
- package/IconMic/package.json +1 -1
- package/IconMolecules/package.json +1 -1
- package/IconMoon/package.json +1 -1
- package/IconNodeEnd/package.json +1 -1
- package/IconNodeStart/package.json +1 -1
- package/IconNodeStep/package.json +1 -1
- package/IconNodes/package.json +1 -1
- package/IconOpenInNew/package.json +1 -1
- package/IconOperators/package.json +1 -1
- package/IconPanelBottom/package.json +1 -1
- package/IconPanelLeft/package.json +1 -1
- package/IconPanelRight/package.json +1 -1
- package/IconPanelTop/package.json +1 -1
- package/IconPaste/package.json +1 -1
- package/IconPause/package.json +1 -1
- package/IconPhone/package.json +1 -1
- package/IconPhoto/package.json +1 -1
- package/IconPicture/package.json +1 -1
- package/IconPlay/package.json +1 -1
- package/IconPressure/package.json +1 -1
- package/IconPriceLabel/package.json +1 -1
- package/IconProcessing/package.json +1 -1
- package/IconQuestion/package.json +1 -1
- package/IconQuote/package.json +1 -1
- package/IconRUO/package.json +1 -1
- package/IconRUS/package.json +1 -1
- package/IconRecord/package.json +1 -1
- package/IconRemove/package.json +1 -1
- package/IconRemoveFromComparison/package.json +1 -1
- package/IconReply/package.json +1 -1
- package/IconResize/package.json +1 -1
- package/IconRestart/package.json +1 -1
- package/IconRevert/package.json +1 -1
- package/IconRing/package.json +1 -1
- package/IconRouble/package.json +1 -1
- package/IconRuler/package.json +1 -1
- package/IconSave/package.json +1 -1
- package/IconScreen/package.json +1 -1
- package/IconSearch/package.json +1 -1
- package/IconSelect/package.json +1 -1
- package/IconSelectOpen/package.json +1 -1
- package/IconSendMessage/package.json +1 -1
- package/IconSettings/package.json +1 -1
- package/IconShape/package.json +1 -1
- package/IconShuffle/package.json +1 -1
- package/IconSmile/package.json +1 -1
- package/IconSortDown/package.json +1 -1
- package/IconSortDownCenter/package.json +1 -1
- package/IconSortUp/package.json +1 -1
- package/IconSortUpCenter/package.json +1 -1
- package/IconStop/package.json +1 -1
- package/IconStorage/package.json +1 -1
- package/IconStrikethrough/package.json +1 -1
- package/IconSun/package.json +1 -1
- package/IconTable/package.json +1 -1
- package/IconTable2/package.json +1 -1
- package/IconTarget/package.json +1 -1
- package/IconTeam/package.json +1 -1
- package/IconTechResponse/package.json +1 -1
- package/IconTest/package.json +1 -1
- package/IconThumbUp/package.json +1 -1
- package/IconTie/package.json +1 -1
- package/IconTop/package.json +1 -1
- package/IconTrash/package.json +1 -1
- package/IconType/package.json +1 -1
- package/IconUnderline/package.json +1 -1
- package/IconUnlock/package.json +1 -1
- package/IconUnsort/package.json +1 -1
- package/IconUnsortCenter/package.json +1 -1
- package/IconUpload/package.json +1 -1
- package/IconUser/package.json +1 -1
- package/IconVZD/package.json +1 -1
- package/IconVideo/package.json +1 -1
- package/IconVkontakte/package.json +1 -1
- package/IconWarning/package.json +1 -1
- package/IconWatch/package.json +1 -1
- package/IconWideScreen/package.json +1 -1
- package/IconWorld/package.json +1 -1
- package/IconWrench/package.json +1 -1
- package/IconYandexDzen/package.json +1 -1
- package/IconYoutube/package.json +1 -1
- package/Informer/package.json +1 -1
- package/LayoutCanary/package.json +1 -1
- package/Loader/package.json +1 -1
- package/MixCard/package.json +1 -1
- package/MixFocus/package.json +1 -1
- package/MixPopoverAnimate/package.json +1 -1
- package/MixPopoverArrow/package.json +1 -1
- package/MixSpace/package.json +1 -1
- package/MixVisuallyHidden/package.json +1 -1
- package/Modal/package.json +1 -1
- package/MultiComboboxDeprecated/package.json +1 -1
- package/Pagination/package.json +1 -1
- package/Popover/package.json +1 -1
- package/PortalWithTheme/package.json +1 -1
- package/ProgressSpin/package.json +1 -1
- package/ProgressStepBarCanary/package.json +1 -1
- package/README.md +6 -6
- package/Radio/package.json +1 -1
- package/RadioGroup/package.json +1 -1
- package/Responses/package.json +1 -1
- package/Responses403/package.json +1 -1
- package/Responses404/package.json +1 -1
- package/Responses500/package.json +1 -1
- package/Responses503/package.json +1 -1
- package/ResponsesConnectionError/package.json +1 -1
- package/ResponsesDeleted/package.json +1 -1
- package/ResponsesEmptyBox/package.json +1 -1
- package/ResponsesEmptyPockets/package.json +1 -1
- package/ResponsesExit/package.json +1 -1
- package/ResponsesImage/package.json +1 -1
- package/ResponsesImage403/package.json +1 -1
- package/ResponsesImage404/package.json +1 -1
- package/ResponsesImage500/package.json +1 -1
- package/ResponsesImage503/package.json +1 -1
- package/ResponsesImageConnectionError/package.json +1 -1
- package/ResponsesImageDeleted/package.json +1 -1
- package/ResponsesImageEmptyBox/package.json +1 -1
- package/ResponsesImageEmptyPockets/package.json +1 -1
- package/ResponsesImageNothingFound/package.json +1 -1
- package/ResponsesImageSuccess/package.json +1 -1
- package/ResponsesNothingFound/package.json +1 -1
- package/ResponsesSuccess/package.json +1 -1
- package/Select/package.json +1 -1
- package/Sidebar/package.json +1 -1
- package/Skeleton/package.json +1 -1
- package/SliderCanary/package.json +1 -1
- package/SnackBar/package.json +1 -1
- package/Steps/package.json +1 -1
- package/Switch/package.json +1 -1
- package/SwitchGroup/package.json +1 -1
- package/Table/package.json +1 -1
- package/Tabs/package.json +1 -1
- package/Tag/package.json +1 -1
- package/TagBase/package.json +1 -1
- package/Text/package.json +1 -1
- package/TextField/package.json +1 -1
- package/Theme/package.json +1 -1
- package/ThemeToggler/package.json +1 -1
- package/Timer/package.json +1 -1
- package/Tooltip/package.json +1 -1
- package/User/package.json +1 -1
- package/UserSelect/package.json +1 -1
- package/UserSelectDeprecated/package.json +1 -1
- package/__internal__/cjs-src/components/BreadcrumbsCanary/BreadcrumbsCanary.js +9 -3
- package/__internal__/cjs-src/components/BreadcrumbsCanary/BreadcrumbsFitModeDropdown/BreadcrumbsFitModeDropdown.js +2 -2
- package/__internal__/cjs-src/components/BreadcrumbsCanary/BreadcrumbsItem/BreadcrumbsItem.css +20 -0
- package/__internal__/cjs-src/components/BreadcrumbsCanary/BreadcrumbsItem/BreadcrumbsItem.d.ts +2 -14
- package/__internal__/cjs-src/components/BreadcrumbsCanary/BreadcrumbsItem/BreadcrumbsItem.js +31 -8
- package/__internal__/cjs-src/components/BreadcrumbsCanary/BreadcrumbsMore/BreadcrumbsMore.d.ts +7 -1
- package/__internal__/cjs-src/components/BreadcrumbsCanary/BreadcrumbsMore/BreadcrumbsMore.js +24 -14
- package/__internal__/cjs-src/components/BreadcrumbsCanary/helpers.d.ts +267 -18
- package/__internal__/cjs-src/components/BreadcrumbsCanary/helpers.js +3 -10
- package/__internal__/cjs-src/components/BreadcrumbsCanary/types.d.ts +18 -0
- package/__internal__/cjs-src/components/ChoiceGroup/ChoiceGroup.css +4 -1
- package/__internal__/cjs-src/components/ChoiceGroup/ChoiceGroup.d.ts +1 -0
- package/__internal__/cjs-src/components/ChoiceGroup/ChoiceGroup.js +4 -2
- package/__internal__/cjs-src/components/ContextMenuCanary/ContextMenuLevel/ContextMenuLevel.d.ts +1 -0
- package/__internal__/cjs-src/components/ContextMenuCanary/ContextMenuLevel/ContextMenuLevel.js +27 -5
- package/__internal__/cjs-src/components/ContextMenuCanary/ContextMenuLevels/ContextMenuLevels.js +2 -0
- package/__internal__/cjs-src/components/ContextMenuCanary/helper.d.ts +2 -2
- package/__internal__/cjs-src/components/ContextMenuCanary/types.d.ts +2 -2
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerCanary.js +12 -8
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerFieldTypeDate/DatePickerFieldTypeDate.js +6 -70
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerFieldTypeDate/helpers.d.ts +1 -1
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerFieldTypeDate/helpers.js +82 -13
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerFieldTypeDateTime/DatePickerFieldTypeDateTime.js +9 -2
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerFieldTypeDateTime/helpers.d.ts +0 -2
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerFieldTypeDateTime/helpers.js +12 -22
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerFieldTypeTime/DatePickerFieldTypeTime.d.ts +48 -0
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerFieldTypeTime/DatePickerFieldTypeTime.js +75 -0
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerFieldTypeTime/helpers.d.ts +49 -0
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerFieldTypeTime/helpers.js +83 -0
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerTypeDateTime/DatePickerTypeDateTime.js +3 -3
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerTypeTime/DatePickerTypeTime.d.ts +2 -0
- package/__internal__/cjs-src/components/DatePickerCanary/DatePickerTypeTime/DatePickerTypeTime.js +35 -0
- package/__internal__/cjs-src/components/DatePickerCanary/helpers.d.ts +6 -1
- package/__internal__/cjs-src/components/DatePickerCanary/helpers.js +33 -4
- package/__internal__/cjs-src/components/EventInterceptor/types.d.ts +1 -1
- package/__internal__/cjs-src/components/Modal/Modal.css +50 -25
- package/__internal__/cjs-src/components/Modal/Modal.js +3 -3
- package/__internal__/cjs-src/components/Pagination/Pagination.d.ts +0 -1
- package/__internal__/cjs-src/components/Pagination/Pagination.js +8 -11
- package/__internal__/cjs-src/components/PortalWithTheme/PortalWithTheme.js +15 -4
- package/__internal__/cjs-src/components/PortalWithTheme/PortalWithThemeContext/PortalWithThemeContext.d.ts +4 -1
- package/__internal__/cjs-src/components/PortalWithTheme/PortalWithThemeContext/PortalWithThemeContext.js +3 -2
- package/__internal__/cjs-src/components/SelectComponents/SelectDropdown/SelectDropdown.js +1 -1
- package/__internal__/cjs-src/components/Sidebar/Sidebar.css +10 -10
- package/__internal__/cjs-src/components/Sidebar/Sidebar.js +2 -2
- package/__internal__/cjs-src/hooks/useClickOutside/useClickOutside.d.ts +3 -3
- package/__internal__/cjs-src/hooks/useClickOutside/useClickOutside.js +18 -7
- package/__internal__/cjs-src/icons/IconFacebook/IconFacebook_size_m.js +1 -1
- package/__internal__/cjs-src/icons/IconFacebook/IconFacebook_size_s.js +1 -1
- package/__internal__/cjs-src/icons/IconInstagram/IconInstagram_size_m.js +1 -1
- package/__internal__/cjs-src/icons/IconInstagram/IconInstagram_size_s.js +1 -1
- package/__internal__/cjs-src/icons/IconVkontakte/IconVkontakte_size_m.js +1 -1
- package/__internal__/cjs-src/icons/IconVkontakte/IconVkontakte_size_s.js +1 -1
- package/__internal__/cjs-src/icons/IconYandexDzen/IconYandexDzen_size_m.js +1 -1
- package/__internal__/cjs-src/icons/IconYandexDzen/IconYandexDzen_size_s.js +1 -1
- package/__internal__/cjs-src/icons/IconYoutube/IconYoutube_size_m.js +1 -1
- package/__internal__/cjs-src/icons/IconYoutube/IconYoutube_size_s.js +1 -1
- package/__internal__/src/components/BreadcrumbsCanary/BreadcrumbsCanary.js +10 -4
- package/__internal__/src/components/BreadcrumbsCanary/BreadcrumbsFitModeDropdown/BreadcrumbsFitModeDropdown.js +2 -2
- package/__internal__/src/components/BreadcrumbsCanary/BreadcrumbsItem/BreadcrumbsItem.css +20 -0
- package/__internal__/src/components/BreadcrumbsCanary/BreadcrumbsItem/BreadcrumbsItem.d.ts +2 -14
- package/__internal__/src/components/BreadcrumbsCanary/BreadcrumbsItem/BreadcrumbsItem.js +33 -10
- package/__internal__/src/components/BreadcrumbsCanary/BreadcrumbsMore/BreadcrumbsMore.d.ts +7 -1
- package/__internal__/src/components/BreadcrumbsCanary/BreadcrumbsMore/BreadcrumbsMore.js +22 -15
- package/__internal__/src/components/BreadcrumbsCanary/helpers.d.ts +267 -18
- package/__internal__/src/components/BreadcrumbsCanary/helpers.js +2 -8
- package/__internal__/src/components/BreadcrumbsCanary/types.d.ts +18 -0
- package/__internal__/src/components/ChoiceGroup/ChoiceGroup.css +4 -1
- package/__internal__/src/components/ChoiceGroup/ChoiceGroup.d.ts +1 -0
- package/__internal__/src/components/ChoiceGroup/ChoiceGroup.js +4 -2
- package/__internal__/src/components/ContextMenuCanary/ContextMenuLevel/ContextMenuLevel.d.ts +1 -0
- package/__internal__/src/components/ContextMenuCanary/ContextMenuLevel/ContextMenuLevel.js +25 -4
- package/__internal__/src/components/ContextMenuCanary/ContextMenuLevels/ContextMenuLevels.js +3 -1
- package/__internal__/src/components/ContextMenuCanary/helper.d.ts +2 -2
- package/__internal__/src/components/ContextMenuCanary/types.d.ts +2 -2
- package/__internal__/src/components/DatePickerCanary/DatePickerCanary.js +14 -10
- package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeDate/DatePickerFieldTypeDate.js +9 -73
- package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeDate/helpers.d.ts +1 -1
- package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeDate/helpers.js +81 -12
- package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeDateTime/DatePickerFieldTypeDateTime.js +11 -4
- package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeDateTime/helpers.d.ts +0 -2
- package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeDateTime/helpers.js +13 -23
- package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeTime/DatePickerFieldTypeTime.d.ts +48 -0
- package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeTime/DatePickerFieldTypeTime.js +72 -0
- package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeTime/helpers.d.ts +49 -0
- package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeTime/helpers.js +80 -0
- package/__internal__/src/components/DatePickerCanary/DatePickerTypeDateTime/DatePickerTypeDateTime.js +3 -3
- package/__internal__/src/components/DatePickerCanary/DatePickerTypeTime/DatePickerTypeTime.d.ts +2 -0
- package/__internal__/src/components/DatePickerCanary/DatePickerTypeTime/DatePickerTypeTime.js +32 -0
- package/__internal__/src/components/DatePickerCanary/helpers.d.ts +6 -1
- package/__internal__/src/components/DatePickerCanary/helpers.js +32 -3
- package/__internal__/src/components/EventInterceptor/types.d.ts +1 -1
- package/__internal__/src/components/Modal/Modal.css +50 -25
- package/__internal__/src/components/Modal/Modal.js +3 -3
- package/__internal__/src/components/Pagination/Pagination.d.ts +0 -1
- package/__internal__/src/components/Pagination/Pagination.js +7 -10
- package/__internal__/src/components/PortalWithTheme/PortalWithTheme.js +15 -4
- package/__internal__/src/components/PortalWithTheme/PortalWithThemeContext/PortalWithThemeContext.d.ts +4 -1
- package/__internal__/src/components/PortalWithTheme/PortalWithThemeContext/PortalWithThemeContext.js +3 -2
- package/__internal__/src/components/SelectComponents/SelectDropdown/SelectDropdown.js +1 -1
- package/__internal__/src/components/Sidebar/Sidebar.css +10 -10
- package/__internal__/src/components/Sidebar/Sidebar.js +2 -2
- package/__internal__/src/hooks/useClickOutside/useClickOutside.d.ts +3 -3
- package/__internal__/src/hooks/useClickOutside/useClickOutside.js +18 -7
- package/__internal__/src/icons/IconFacebook/IconFacebook_size_m.js +1 -1
- package/__internal__/src/icons/IconFacebook/IconFacebook_size_s.js +1 -1
- package/__internal__/src/icons/IconInstagram/IconInstagram_size_m.js +1 -1
- package/__internal__/src/icons/IconInstagram/IconInstagram_size_s.js +1 -1
- package/__internal__/src/icons/IconVkontakte/IconVkontakte_size_m.js +1 -1
- package/__internal__/src/icons/IconVkontakte/IconVkontakte_size_s.js +1 -1
- package/__internal__/src/icons/IconYandexDzen/IconYandexDzen_size_m.js +1 -1
- package/__internal__/src/icons/IconYandexDzen/IconYandexDzen_size_s.js +1 -1
- package/__internal__/src/icons/IconYoutube/IconYoutube_size_m.js +1 -1
- package/__internal__/src/icons/IconYoutube/IconYoutube_size_s.js +1 -1
- package/createIcon/package.json +1 -1
- package/createResponsesImage/package.json +1 -1
- package/package.json +2 -2
- package/useBreakpoints/package.json +1 -1
- package/useChoiceGroup/package.json +1 -1
- package/useChoiceGroupIndexed/package.json +1 -1
- package/useClickOutside/package.json +1 -1
- package/useComponentSize/package.json +1 -1
- package/useDebounce/package.json +1 -1
- package/useFlag/package.json +1 -1
- package/useForkRef/package.json +1 -1
- package/useGlobalKeys/package.json +1 -1
- package/useHideElementsInLine/package.json +1 -1
- package/useKeys/package.json +1 -1
- package/useMutableRef/package.json +1 -1
- package/useOverflow/package.json +1 -1
- package/usePrevious/package.json +1 -1
- package/useRefs/package.json +1 -1
- package/useResizeObserved/package.json +1 -1
- package/useScrollElements/package.json +1 -1
- package/useScrollPosition/package.json +1 -1
- package/useSelect/package.json +1 -1
- package/useSortSteps/package.json +1 -1
- package/useThemeVars/package.json +1 -1
- package/useTimer/package.json +1 -1
- package/withTooltip/package.json +1 -1
|
@@ -44,6 +44,6 @@ exports.SelectDropdown = function (props) {
|
|
|
44
44
|
return (react_1["default"].createElement(react_1.Fragment, { key: group.key + "-" + i }, renderItem(tslib_1.__assign({ item: item }, getOptionProps({ index: getIndex(), item: item })))));
|
|
45
45
|
})));
|
|
46
46
|
}),
|
|
47
|
-
!isLoading && notFound && labelForNotFound && (react_1["default"].createElement(Text_1.Text, { className: cnSelectDropdown('LabelForNotFound') }, labelForNotFound)),
|
|
47
|
+
!isLoading && hasItems && notFound && labelForNotFound && (react_1["default"].createElement(Text_1.Text, { className: cnSelectDropdown('LabelForNotFound') }, labelForNotFound)),
|
|
48
48
|
!isLoading && !hasItems && labelForEmptyItems && (react_1["default"].createElement(Text_1.Text, { className: cnSelectDropdown('LabelForEmptyItems') }, labelForEmptyItems))))); }));
|
|
49
49
|
};
|
|
@@ -47,18 +47,18 @@
|
|
|
47
47
|
}
|
|
48
48
|
|
|
49
49
|
.Sidebar-Overlay {
|
|
50
|
-
position:
|
|
50
|
+
position: absolute;
|
|
51
51
|
top: 0;
|
|
52
|
+
right: 0;
|
|
52
53
|
left: 0;
|
|
53
|
-
|
|
54
|
-
height: 100%;
|
|
54
|
+
bottom: 0;
|
|
55
55
|
padding: 0;
|
|
56
56
|
background: var(--color-bg-tone);
|
|
57
57
|
border: none;
|
|
58
58
|
}
|
|
59
59
|
|
|
60
60
|
.Sidebar-Window {
|
|
61
|
-
|
|
61
|
+
position: absolute;
|
|
62
62
|
display: -webkit-box;
|
|
63
63
|
display: -ms-flexbox;
|
|
64
64
|
display: flex;
|
|
@@ -143,15 +143,15 @@
|
|
|
143
143
|
}
|
|
144
144
|
|
|
145
145
|
.Sidebar_animate_appear .Sidebar-Overlay, .Sidebar_animate_enter .Sidebar-Overlay, .Sidebar_animate_exit .Sidebar-Overlay, .Sidebar_animate_appearActive .Sidebar-Overlay, .Sidebar_animate_enterActive .Sidebar-Overlay, .Sidebar_animate_exitActive .Sidebar-Overlay {
|
|
146
|
-
-webkit-transition: opacity 0.
|
|
147
|
-
transition: opacity 0.
|
|
146
|
+
-webkit-transition: opacity 0.24s ease;
|
|
147
|
+
transition: opacity 0.24s ease;
|
|
148
148
|
}
|
|
149
149
|
|
|
150
150
|
.Sidebar_animate_appear .Sidebar-Window, .Sidebar_animate_enter .Sidebar-Window, .Sidebar_animate_exit .Sidebar-Window, .Sidebar_animate_appearActive .Sidebar-Window, .Sidebar_animate_enterActive .Sidebar-Window, .Sidebar_animate_exitActive .Sidebar-Window {
|
|
151
|
-
-webkit-transition: -webkit-transform 0.
|
|
152
|
-
transition: -webkit-transform 0.
|
|
153
|
-
transition: transform 0.
|
|
154
|
-
transition: transform 0.
|
|
151
|
+
-webkit-transition: -webkit-transform 0.24s ease;
|
|
152
|
+
transition: -webkit-transform 0.24s ease;
|
|
153
|
+
transition: transform 0.24s ease;
|
|
154
|
+
transition: transform 0.24s ease, -webkit-transform 0.24s ease;
|
|
155
155
|
}
|
|
156
156
|
|
|
157
157
|
.Sidebar_animate_appear .Sidebar-Overlay, .Sidebar_animate_enter .Sidebar-Overlay {
|
|
@@ -50,10 +50,10 @@ exports.Sidebar = function (props) {
|
|
|
50
50
|
useGlobalKeys_1.useGlobalKeys({
|
|
51
51
|
Escape: function (e) { return isOpen && onEsc && onEsc(e); }
|
|
52
52
|
});
|
|
53
|
-
return (react_1["default"].createElement(react_transition_group_1.CSSTransition, { "in": isOpen, unmountOnExit: true, className: exports.cnSidebar({ position: position, hasOverlay: hasOverlay }), classNames: cnForCssTransition_1.cnForCssTransition(exports.cnSidebar), timeout:
|
|
53
|
+
return (react_1["default"].createElement(react_transition_group_1.CSSTransition, { "in": isOpen, unmountOnExit: true, className: exports.cnSidebar({ position: position, hasOverlay: hasOverlay }), classNames: cnForCssTransition_1.cnForCssTransition(exports.cnSidebar), timeout: 240, nodeRef: portalRef },
|
|
54
54
|
react_1["default"].createElement(PortalWithTheme_1.PortalWithTheme, { preset: theme, ref: portalRef, container: container, className: rootClassName, style: typeof (style === null || style === void 0 ? void 0 : style.zIndex) === 'number' ? { zIndex: style.zIndex } : undefined },
|
|
55
55
|
hasOverlay && react_1["default"].createElement("div", { className: exports.cnSidebar('Overlay'), "aria-label": "Overlay" }),
|
|
56
|
-
react_1["default"].createElement("div", tslib_1.__assign({}, otherProps, { style: tslib_1.__assign(tslib_1.__assign({}, style),
|
|
56
|
+
react_1["default"].createElement("div", tslib_1.__assign({}, otherProps, { style: tslib_1.__assign(tslib_1.__assign({}, style), { zIndex: undefined }), className: exports.cnSidebar('Window', { size: size, position: position }, [className]), ref: ref }),
|
|
57
57
|
react_1["default"].createElement(ContextConsumer, { onClickOutside: onClickOutside || onOverlayClick, ignoreClicksInsideRefs: [ref] }, children)))));
|
|
58
58
|
};
|
|
59
59
|
exports.Sidebar.Content = SidebarContent;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { RefObject } from 'react';
|
|
2
2
|
export declare type ClickOutsideHandler = (event: MouseEvent) => void;
|
|
3
3
|
declare type UseClickOutsideProps = {
|
|
4
|
-
isActive
|
|
5
|
-
ignoreClicksInsideRefs
|
|
6
|
-
handler
|
|
4
|
+
isActive?: boolean;
|
|
5
|
+
ignoreClicksInsideRefs?: ReadonlyArray<RefObject<HTMLElement>>;
|
|
6
|
+
handler?: ClickOutsideHandler;
|
|
7
7
|
};
|
|
8
8
|
export declare function useClickOutside({ isActive, ignoreClicksInsideRefs, handler, }: UseClickOutsideProps): void;
|
|
9
9
|
export {};
|
|
@@ -2,19 +2,30 @@
|
|
|
2
2
|
exports.__esModule = true;
|
|
3
3
|
exports.useClickOutside = void 0;
|
|
4
4
|
var react_1 = require("react");
|
|
5
|
+
var useMutableRef_1 = require("../useMutableRef/useMutableRef");
|
|
5
6
|
function useClickOutside(_a) {
|
|
7
|
+
// Аргументы вынесены в рефки за тем, чтобы не пересоздавать подписку `mousedown` при кажом чихе.
|
|
8
|
+
// Бывают кейсы когда на странице несколко `useClickOutside` и один вызывает рендер,
|
|
9
|
+
// А второй не успевает отрабатывать а просто пересоздается
|
|
10
|
+
// С такой реализацией пересоздание только при удалении из дома, а аргументы всегда актуалны.
|
|
6
11
|
var isActive = _a.isActive, ignoreClicksInsideRefs = _a.ignoreClicksInsideRefs, handler = _a.handler;
|
|
12
|
+
var handlerRef = useMutableRef_1.useMutableRef(handler);
|
|
13
|
+
var ignoreClicksInsideRefsRef = useMutableRef_1.useMutableRef(ignoreClicksInsideRefs);
|
|
14
|
+
var isActiveRef = useMutableRef_1.useMutableRef(isActive);
|
|
7
15
|
react_1.useEffect(function () {
|
|
8
|
-
if (!isActive) {
|
|
9
|
-
return;
|
|
10
|
-
}
|
|
11
16
|
var handleClick = function (event) {
|
|
17
|
+
var _a, _b;
|
|
18
|
+
if (!isActiveRef.current) {
|
|
19
|
+
return;
|
|
20
|
+
}
|
|
12
21
|
var target = event.target;
|
|
13
|
-
var shouldCallHandler =
|
|
14
|
-
shouldCallHandler &&
|
|
22
|
+
var shouldCallHandler = (_a = ignoreClicksInsideRefsRef.current) === null || _a === void 0 ? void 0 : _a.every(function (ref) { var _a; return !((_a = ref.current) === null || _a === void 0 ? void 0 : _a.contains(target)); });
|
|
23
|
+
shouldCallHandler && ((_b = handlerRef.current) === null || _b === void 0 ? void 0 : _b.call(handlerRef, event));
|
|
15
24
|
};
|
|
16
25
|
document.addEventListener('mousedown', handleClick);
|
|
17
|
-
return function () {
|
|
18
|
-
|
|
26
|
+
return function () {
|
|
27
|
+
document.removeEventListener('mousedown', handleClick);
|
|
28
|
+
};
|
|
29
|
+
}, []);
|
|
19
30
|
}
|
|
20
31
|
exports.useClickOutside = useClickOutside;
|
|
@@ -4,6 +4,6 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var React = tslib_1.__importStar(require("react"));
|
|
5
5
|
function IconFacebookSizeM(props) {
|
|
6
6
|
return (React.createElement("svg", tslib_1.__assign({ viewBox: "0 0 24 24" }, props),
|
|
7
|
-
React.createElement("path", { d: "M22
|
|
7
|
+
React.createElement("path", { d: "M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12s4.477 10 10 10c.059 0 .117 0 .176-.004v-7.781h-2.149V11.71h2.149V9.867c0-2.137 1.304-3.3 3.21-3.3.915 0 1.7.066 1.927.097v2.234H16c-1.035 0-1.238.493-1.238 1.215v1.594h2.48l-.324 2.504h-2.156v7.402C18.942 20.414 22 16.566 22 12z" })));
|
|
8
8
|
}
|
|
9
9
|
exports["default"] = IconFacebookSizeM;
|
|
@@ -4,6 +4,6 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var React = tslib_1.__importStar(require("react"));
|
|
5
5
|
function IconFacebookSizeS(props) {
|
|
6
6
|
return (React.createElement("svg", tslib_1.__assign({ viewBox: "0 0 16 16" }, props),
|
|
7
|
-
React.createElement("path", { d: "M14
|
|
7
|
+
React.createElement("path", { d: "M14 8A6 6 0 102 8a6 6 0 006 6c.035 0 .07 0 .105-.002v-4.67H6.816V7.828h1.29V6.72c0-1.282.782-1.98 1.926-1.98.549 0 1.02.04 1.155.058V6.14H10.4c-.621 0-.743.295-.743.729v.956h1.488l-.194 1.503H9.657v4.441A6.002 6.002 0 0014 8z" })));
|
|
8
8
|
}
|
|
9
9
|
exports["default"] = IconFacebookSizeS;
|
|
@@ -4,6 +4,6 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var React = tslib_1.__importStar(require("react"));
|
|
5
5
|
function IconInstagramSizeM(props) {
|
|
6
6
|
return (React.createElement("svg", tslib_1.__assign({ viewBox: "0 0 24 24" }, props),
|
|
7
|
-
React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M21.
|
|
7
|
+
React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M21.95 7.88c-.048-1.063-.22-1.793-.466-2.426a4.88 4.88 0 00-1.157-1.774 4.923 4.923 0 00-1.77-1.153c-.637-.246-1.364-.418-2.426-.464C15.06 2.012 14.72 2 12.004 2c-2.716 0-3.056.012-4.123.059-1.063.046-1.793.218-2.426.464A4.881 4.881 0 003.68 3.68a4.924 4.924 0 00-1.152 1.77c-.247.637-.419 1.363-.465 2.426C2.012 8.946 2 9.286 2 12.002c0 2.715.012 3.055.059 4.122.046 1.063.219 1.793.465 2.426a4.931 4.931 0 001.156 1.774c.5.508 1.106.902 1.77 1.152.638.247 1.364.419 2.427.465C8.944 21.988 9.284 22 12 22s3.056-.012 4.123-.059c1.063-.046 1.793-.218 2.426-.464a5.116 5.116 0 002.927-2.927c.247-.637.419-1.363.465-2.426.047-1.067.059-1.407.059-4.122s-.004-3.055-.05-4.122zm-1.802 8.166c-.043.977-.207 1.504-.344 1.856a3.318 3.318 0 01-1.9 1.898c-.351.137-.882.301-1.856.344-1.055.047-1.371.059-4.04.059-2.67 0-2.99-.012-4.04-.059-.978-.043-1.505-.207-1.857-.343a3.079 3.079 0 01-1.149-.747 3.11 3.11 0 01-.746-1.148c-.137-.352-.301-.883-.344-1.856-.047-1.055-.059-1.372-.059-4.04 0-2.669.012-2.99.059-4.04.043-.977.207-1.504.344-1.856a3.04 3.04 0 01.75-1.149 3.105 3.105 0 011.149-.746c.352-.137.883-.3 1.856-.344 1.055-.046 1.372-.058 4.04-.058 2.674 0 2.99.012 4.041.058.977.043 1.505.207 1.857.344.433.16.828.414 1.148.746.333.325.587.715.747 1.15.137.35.3.882.344 1.855.047 1.055.058 1.371.058 4.04 0 2.668-.011 2.98-.058 4.036zm-8.144-9.182a5.14 5.14 0 00-5.139 5.138 5.14 5.14 0 0010.278 0 5.14 5.14 0 00-5.14-5.138zm0 8.47a3.334 3.334 0 110-6.667 3.334 3.334 0 010 6.668zm5.342-7.474a1.2 1.2 0 100-2.399 1.2 1.2 0 000 2.4z" })));
|
|
8
8
|
}
|
|
9
9
|
exports["default"] = IconInstagramSizeM;
|
|
@@ -4,6 +4,6 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var React = tslib_1.__importStar(require("react"));
|
|
5
5
|
function IconInstagramSizeS(props) {
|
|
6
6
|
return (React.createElement("svg", tslib_1.__assign({ viewBox: "0 0 16 16" }, props),
|
|
7
|
-
React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.
|
|
7
|
+
React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.97 5.528c-.029-.638-.132-1.076-.28-1.456a2.928 2.928 0 00-.694-1.064 2.954 2.954 0 00-1.062-.692c-.382-.147-.818-.25-1.456-.278C9.836 2.008 9.632 2 8.002 2s-1.833.007-2.473.035c-.638.028-1.076.131-1.456.28a2.929 2.929 0 00-1.065.693c-.305.3-.541.663-.691 1.062-.148.382-.251.818-.28 1.456C2.008 6.168 2 6.372 2 8c0 1.63.007 1.833.035 2.473.028.638.132 1.076.28 1.456.152.403.388.764.693 1.064.3.305.664.542 1.062.692.383.148.819.25 1.456.279.64.028.845.035 2.474.035 1.63 0 1.834-.007 2.474-.035.637-.028 1.076-.131 1.456-.28a3.07 3.07 0 001.756-1.755c.148-.382.25-.818.279-1.456.028-.64.035-.844.035-2.473s-.002-1.833-.03-2.473zm-1.081 4.9c-.026.585-.125.902-.207 1.113a1.991 1.991 0 01-1.14 1.14c-.21.081-.53.18-1.113.206-.633.028-.823.035-2.424.035-1.602 0-1.794-.007-2.425-.036-.586-.025-.902-.124-1.113-.206a1.847 1.847 0 01-.69-.447 1.865 1.865 0 01-.448-.69c-.082-.21-.18-.53-.206-1.113-.028-.633-.035-.823-.035-2.424s.007-1.793.035-2.424c.026-.586.124-.903.206-1.114.097-.26.249-.496.45-.689.195-.199.43-.351.69-.447.211-.083.53-.18 1.114-.207.633-.028.823-.035 2.424-.035 1.604 0 1.794.007 2.424.035.587.026.903.124 1.114.207.26.096.497.248.69.447.199.195.351.43.447.69.082.21.18.53.207 1.113.028.633.035.823.035 2.424s-.007 1.789-.035 2.421zm-4.887-5.51a3.084 3.084 0 10.001 6.168 3.084 3.084 0 000-6.167zm0 5.083a2 2 0 110-4 2 2 0 010 4zm3.205-4.485a.72.72 0 100-1.44.72.72 0 000 1.44z" })));
|
|
8
8
|
}
|
|
9
9
|
exports["default"] = IconInstagramSizeS;
|
|
@@ -4,6 +4,6 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var React = tslib_1.__importStar(require("react"));
|
|
5
5
|
function IconVkontakteSizeM(props) {
|
|
6
6
|
return (React.createElement("svg", tslib_1.__assign({ viewBox: "0 0 24 24" }, props),
|
|
7
|
-
React.createElement("path", { d: "M20.
|
|
7
|
+
React.createElement("path", { d: "M20.904 16.775a1.233 1.233 0 00-.06-.117c-.313-.563-.91-1.253-1.79-2.072l-.02-.018-.008-.01-.01-.01h-.01c-.4-.38-.652-.636-.758-.768-.194-.25-.238-.503-.132-.759.075-.194.357-.603.844-1.228.256-.33.459-.596.609-.796 1.08-1.437 1.55-2.355 1.406-2.755l-.056-.094c-.038-.056-.134-.108-.29-.155-.157-.046-.357-.054-.6-.023l-2.7.019a.35.35 0 00-.187.004l-.122.029-.047.023-.037.028a.417.417 0 00-.103.099.645.645 0 00-.094.164 15.294 15.294 0 01-1.003 2.108c-.23.388-.443.723-.637 1.008a4.843 4.843 0 01-.487.628c-.132.134-.25.242-.357.323-.106.081-.187.116-.243.103a6.405 6.405 0 01-.16-.037.624.624 0 01-.21-.23 1.028 1.028 0 01-.108-.366 4.028 4.028 0 01-.033-.38 7.973 7.973 0 01.005-.45c.006-.193.01-.324.01-.393 0-.237.004-.495.013-.773.01-.278.017-.498.024-.66.006-.163.009-.335.009-.516s-.011-.323-.033-.426a1.46 1.46 0 00-.098-.3.505.505 0 00-.192-.225 1.083 1.083 0 00-.314-.127c-.331-.075-.753-.115-1.265-.122-1.162-.012-1.91.063-2.24.225-.131.069-.25.163-.356.281-.113.138-.128.213-.047.225.375.056.64.19.796.403l.057.113c.043.081.087.225.13.43.044.207.073.435.085.685.031.456.031.847 0 1.171a14 14 0 01-.089.76 1.52 1.52 0 01-.239.646.161.161 0 01-.047.047.702.702 0 01-.253.047c-.087 0-.193-.044-.318-.131a2.248 2.248 0 01-.39-.361 4.82 4.82 0 01-.454-.642c-.169-.275-.344-.6-.525-.975l-.15-.272c-.093-.175-.221-.43-.384-.763a14.728 14.728 0 01-.43-.97.618.618 0 00-.226-.3l-.047-.029a.642.642 0 00-.15-.08.995.995 0 00-.215-.06L3.6 7.97c-.262 0-.44.059-.534.178l-.038.056a.303.303 0 00-.028.15c0 .069.019.153.056.253.375.881.783 1.73 1.223 2.55.44.818.823 1.477 1.148 1.976.325.5.656.972.994 1.416.337.443.56.728.67.852.11.126.195.22.257.281l.235.225c.15.15.37.33.66.54.291.209.613.415.966.618s.764.368 1.232.496c.469.129.925.18 1.369.155h1.077c.219-.018.384-.087.497-.206l.037-.047a.621.621 0 00.07-.173.953.953 0 00.033-.258 3.09 3.09 0 01.061-.726c.047-.216.1-.378.16-.487a1.197 1.197 0 01.36-.413.617.617 0 01.075-.032c.15-.05.327-.002.53.145s.394.328.572.544c.178.215.392.457.642.726.25.268.468.468.656.6l.187.112c.125.075.288.144.488.206.2.063.374.078.524.047l2.4-.037c.237 0 .421-.04.552-.117.132-.079.21-.165.235-.258a.725.725 0 00.004-.319 1.177 1.177 0 00-.066-.248z" })));
|
|
8
8
|
}
|
|
9
9
|
exports["default"] = IconVkontakteSizeM;
|
|
@@ -4,6 +4,6 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var React = tslib_1.__importStar(require("react"));
|
|
5
5
|
function IconVkontakteSizeS(props) {
|
|
6
6
|
return (React.createElement("svg", tslib_1.__assign({ viewBox: "0 0 16 16" }, props),
|
|
7
|
-
React.createElement("path", { d: "M13.
|
|
7
|
+
React.createElement("path", { d: "M13.936 11.183a.822.822 0 00-.04-.078c-.209-.375-.606-.835-1.194-1.38l-.012-.013-.006-.006-.007-.007h-.006a7.223 7.223 0 01-.506-.512c-.13-.167-.158-.335-.087-.506.05-.13.237-.402.562-.819.17-.22.306-.397.406-.53.72-.959 1.033-1.571.937-1.838l-.037-.062c-.025-.037-.09-.072-.194-.103a.984.984 0 00-.4-.016l-1.799.013a.233.233 0 00-.125.003l-.081.019-.032.015-.024.02a.276.276 0 00-.07.065.427.427 0 00-.062.11 10.21 10.21 0 01-.668 1.405c-.154.258-.296.482-.425.672-.13.189-.237.329-.325.418-.087.09-.166.161-.237.216-.071.054-.125.077-.163.068a4.601 4.601 0 01-.106-.025.415.415 0 01-.14-.153.685.685 0 01-.072-.243 2.686 2.686 0 01-.02-.553c.005-.13.007-.217.007-.263 0-.158.003-.33.01-.515.006-.186.01-.332.015-.44.004-.109.006-.224.006-.344 0-.121-.007-.216-.022-.285a.972.972 0 00-.065-.2.337.337 0 00-.128-.15.722.722 0 00-.21-.084 4.157 4.157 0 00-.843-.081c-.775-.008-1.272.042-1.493.15a.842.842 0 00-.238.187c-.075.092-.085.142-.03.15.25.038.426.127.53.269l.038.075c.029.054.058.15.087.287.03.138.048.29.056.456.021.304.021.565 0 .781-.02.217-.04.386-.059.506a1.013 1.013 0 01-.16.431.108.108 0 01-.03.032.468.468 0 01-.17.031c-.058 0-.128-.03-.212-.088a1.5 1.5 0 01-.259-.24A3.217 3.217 0 015.53 7.6a7.47 7.47 0 01-.35-.65l-.1-.181a15.59 15.59 0 01-.256-.51 9.819 9.819 0 01-.287-.646.412.412 0 00-.15-.2l-.031-.019a.663.663 0 00-.244-.094L2.4 5.314c-.175 0-.294.04-.356.119l-.025.037a.202.202 0 00-.019.1c0 .046.013.102.038.169.25.587.521 1.154.815 1.7.293.545.549.985.765 1.318.217.333.437.647.662.943.225.296.374.485.447.569.073.083.13.145.172.187l.156.15c.1.1.247.22.44.36.194.139.409.276.644.412.236.135.51.245.822.33.312.086.616.12.912.104h.719a.498.498 0 00.33-.138l.026-.03a.415.415 0 00.046-.116.634.634 0 00.022-.172c-.004-.18.01-.34.04-.484.032-.144.067-.252.107-.325a.797.797 0 01.24-.275.393.393 0 01.05-.022c.1-.033.218-.001.354.097.135.098.262.219.38.362.12.144.262.306.429.485.167.179.312.312.437.4l.125.074c.083.05.192.096.325.138a.7.7 0 00.35.031l1.6-.025a.724.724 0 00.368-.078c.087-.052.14-.11.156-.172a.485.485 0 00.003-.212.784.784 0 00-.044-.166z" })));
|
|
8
8
|
}
|
|
9
9
|
exports["default"] = IconVkontakteSizeS;
|
|
@@ -4,6 +4,6 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var React = tslib_1.__importStar(require("react"));
|
|
5
5
|
function IconYandexDzenSizeM(props) {
|
|
6
6
|
return (React.createElement("svg", tslib_1.__assign({ viewBox: "0 0 24 24" }, props),
|
|
7
|
-
React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2
|
|
7
|
+
React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2 11.798c4.114-.047 6.417-.316 7.95-1.849 1.532-1.532 1.801-3.835 1.848-7.948-5.363.106-9.69 4.434-9.797 9.797zm10.396-9.792c.047 4.11.317 6.411 1.849 7.943 1.508 1.509 3.763 1.793 7.756 1.847-.107-5.298-4.332-9.585-9.605-9.79zm9.6 10.392c-3.99.054-6.244.339-7.751 1.847-1.508 1.507-1.793 3.76-1.847 7.75a10.002 10.002 0 009.597-9.597zm-10.2 9.603c-.054-3.994-.338-6.248-1.847-7.756-1.531-1.532-3.832-1.802-7.943-1.85.205 5.274 4.492 9.5 9.79 9.606z" })));
|
|
8
8
|
}
|
|
9
9
|
exports["default"] = IconYandexDzenSizeM;
|
|
@@ -4,6 +4,6 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var React = tslib_1.__importStar(require("react"));
|
|
5
5
|
function IconYandexDzenSizeS(props) {
|
|
6
6
|
return (React.createElement("svg", tslib_1.__assign({ viewBox: "0 0 16 16" }, props),
|
|
7
|
-
React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2 7.
|
|
7
|
+
React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2 7.877c2.468-.028 3.849-.19 4.768-1.109.92-.92 1.081-2.3 1.11-4.768A6 6 0 002 7.877zm6.236-5.874c.028 2.466.19 3.846 1.109 4.765.905.905 2.257 1.076 4.653 1.108a6 6 0 00-5.762-5.873zm5.758 6.234c-2.393.032-3.745.203-4.65 1.108-.904.904-1.075 2.256-1.107 4.65a6 6 0 005.757-5.758zm-6.118 5.76c-.032-2.395-.203-3.747-1.108-4.652-.919-.92-2.299-1.08-4.765-1.11a6 6 0 005.873 5.763z" })));
|
|
8
8
|
}
|
|
9
9
|
exports["default"] = IconYandexDzenSizeS;
|
|
@@ -4,6 +4,6 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var React = tslib_1.__importStar(require("react"));
|
|
5
5
|
function IconYoutubeSizeM(props) {
|
|
6
6
|
return (React.createElement("svg", tslib_1.__assign({ viewBox: "0 0 24 24" }, props),
|
|
7
|
-
React.createElement("path", { d: "M21.
|
|
7
|
+
React.createElement("path", { d: "M21.588 7.191a2.505 2.505 0 00-1.763-1.763C18.26 5 12 5 12 5s-6.26 0-7.825.412c-.84.23-1.533.922-1.763 1.78C2 8.755 2 12.001 2 12.001s0 3.261.412 4.81c.23.857.906 1.532 1.763 1.763 1.581.428 7.825.428 7.825.428s6.26 0 7.825-.412a2.506 2.506 0 001.763-1.763c.412-1.565.412-4.81.412-4.81s.016-3.262-.412-4.827zM10.007 15V9.003l5.205 2.999L10.007 15z" })));
|
|
8
8
|
}
|
|
9
9
|
exports["default"] = IconYoutubeSizeM;
|
|
@@ -4,6 +4,6 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var React = tslib_1.__importStar(require("react"));
|
|
5
5
|
function IconYoutubeSizeS(props) {
|
|
6
6
|
return (React.createElement("svg", tslib_1.__assign({ viewBox: "0 0 16 16" }, props),
|
|
7
|
-
React.createElement("path", { d: "M13.
|
|
7
|
+
React.createElement("path", { d: "M13.753 5.315a1.503 1.503 0 00-1.058-1.058C11.756 4 8 4 8 4s-3.756 0-4.695.247c-.504.138-.92.554-1.058 1.068C2 6.254 2 8.2 2 8.2s0 1.957.247 2.886c.139.514.544.92 1.058 1.058.949.257 4.695.257 4.695.257s3.756 0 4.695-.247c.514-.139.92-.544 1.058-1.058C14 10.158 14 8.211 14 8.211s.01-1.957-.247-2.896zM6.804 10V6.402l3.123 1.799L6.804 10z" })));
|
|
8
8
|
}
|
|
9
9
|
exports["default"] = IconYoutubeSizeS;
|
|
@@ -5,17 +5,23 @@ import { cn } from '../../utils/bem';
|
|
|
5
5
|
import { BreadcrumbsFitModeDropdown } from './BreadcrumbsFitModeDropdown/BreadcrumbsFitModeDropdown';
|
|
6
6
|
import { BreadcrumbsFitModeScroll } from './BreadcrumbsFitModeScroll/BreadcrumbsFitModeScroll';
|
|
7
7
|
import { BreadcrumbsItem } from './BreadcrumbsItem/BreadcrumbsItem';
|
|
8
|
-
import {
|
|
8
|
+
import { withDefaultGetters } from './helpers';
|
|
9
9
|
import { breadcrumbPropFitModeDefault, breadcrumbPropSizeDefault, } from './types';
|
|
10
10
|
export var cnBreadcrumbs = cn('Breadcrumbs');
|
|
11
11
|
var BreadcrumbsRender = function (props, ref) {
|
|
12
|
-
var _a = withDefaultGetters(props), items = _a.items, getItemHref = _a.getItemHref, getItemLabel = _a.getItemLabel, getItemIcon = _a.getItemIcon, getItemOnClick = _a.getItemOnClick, onItemClick = _a.onItemClick, _b = _a.size, size = _b === void 0 ? breadcrumbPropSizeDefault : _b, _c = _a.onlyIconRoot, onlyIconRoot = _c === void 0 ? false : _c, className = _a.className, _d = _a.fitMode, fitMode = _d === void 0 ? breadcrumbPropFitModeDefault : _d, lastItemIsLink = _a.lastItemIsLink, otherProps = __rest(_a, ["items", "getItemHref", "getItemLabel", "getItemIcon", "getItemOnClick", "onItemClick", "size", "onlyIconRoot", "className", "fitMode", "lastItemIsLink"]);
|
|
12
|
+
var _a = withDefaultGetters(props), items = _a.items, getItemHref = _a.getItemHref, getItemLabel = _a.getItemLabel, getItemIcon = _a.getItemIcon, getItemOnClick = _a.getItemOnClick, getItemSubMenu = _a.getItemSubMenu, onItemClick = _a.onItemClick, _b = _a.size, size = _b === void 0 ? breadcrumbPropSizeDefault : _b, _c = _a.onlyIconRoot, onlyIconRoot = _c === void 0 ? false : _c, className = _a.className, _d = _a.fitMode, fitMode = _d === void 0 ? breadcrumbPropFitModeDefault : _d, lastItemIsLink = _a.lastItemIsLink, otherProps = __rest(_a, ["items", "getItemHref", "getItemLabel", "getItemIcon", "getItemOnClick", "getItemSubMenu", "onItemClick", "size", "onlyIconRoot", "className", "fitMode", "lastItemIsLink"]);
|
|
13
13
|
var shortList = items.length <= 2;
|
|
14
14
|
var renderItem = function (item, index, isFirst, isLast, ref, hidden) {
|
|
15
15
|
if (item === undefined) {
|
|
16
16
|
return;
|
|
17
17
|
}
|
|
18
|
-
|
|
18
|
+
var handleClick = function (_a) {
|
|
19
|
+
var _b;
|
|
20
|
+
var e = _a.e, item = _a.item;
|
|
21
|
+
(_b = getItemOnClick === null || getItemOnClick === void 0 ? void 0 : getItemOnClick(item)) === null || _b === void 0 ? void 0 : _b(e);
|
|
22
|
+
onItemClick === null || onItemClick === void 0 ? void 0 : onItemClick({ e: e, item: item });
|
|
23
|
+
};
|
|
24
|
+
return (React.createElement(BreadcrumbsItem, { className: cnBreadcrumbs('Item', { hidden: hidden }), item: item, getItemHref: getItemHref, getItemIcon: getItemIcon, getItemLabel: getItemLabel, getItemSubMenu: getItemSubMenu, onItemClick: handleClick, active: lastItemIsLink ? false : isLast, delimiter: !isFirst, onlyIcon: onlyIconRoot && isFirst, key: cnBreadcrumbs('Item', { index: index }), size: size, ref: ref }));
|
|
19
25
|
};
|
|
20
26
|
if (items.length <= 2) {
|
|
21
27
|
return (React.createElement("ul", __assign({}, otherProps, { className: cnBreadcrumbs({ shortList: shortList }, [className]), ref: ref }), items.map(function (item, index) {
|
|
@@ -25,7 +31,7 @@ var BreadcrumbsRender = function (props, ref) {
|
|
|
25
31
|
if (fitMode === 'scroll') {
|
|
26
32
|
return (React.createElement(BreadcrumbsFitModeScroll, __assign({}, otherProps, { className: cnBreadcrumbs(null, [className]), items: items, renderItem: renderItem, ref: ref })));
|
|
27
33
|
}
|
|
28
|
-
return (React.createElement(BreadcrumbsFitModeDropdown, __assign({}, otherProps, { size: size, className: cnBreadcrumbs(null, [className]), items: items, getItemHref: getItemHref, getItemIcon: getItemIcon, getItemLabel: getItemLabel, getItemOnClick: getItemOnClick, onItemClick: onItemClick, ref: ref, renderItem: renderItem })));
|
|
34
|
+
return (React.createElement(BreadcrumbsFitModeDropdown, __assign({}, otherProps, { size: size, className: cnBreadcrumbs(null, [className]), items: items, getItemHref: getItemHref, getItemIcon: getItemIcon, getItemLabel: getItemLabel, getItemOnClick: getItemOnClick, getItemSubMenu: getItemSubMenu, onItemClick: onItemClick, ref: ref, renderItem: renderItem })));
|
|
29
35
|
};
|
|
30
36
|
export var Breadcrumbs = forwardRef(BreadcrumbsRender);
|
|
31
37
|
export * from './types';
|
|
@@ -8,12 +8,12 @@ import { useElements } from '../useElements';
|
|
|
8
8
|
export var cnBreadcrumbsFitModeDropdown = cn('BreadcrumbsFitModeDropdown');
|
|
9
9
|
export var BreadcrumbsFitModeDropdown = forwardRef(function (props, ref) {
|
|
10
10
|
var _a;
|
|
11
|
-
var items = props.items, getItemHref = props.getItemHref, getItemLabel = props.getItemLabel, getItemIcon = props.getItemIcon, getItemOnClick = props.getItemOnClick, onItemClick = props.onItemClick, size = props.size, className = props.className, renderItem = props.renderItem, otherProps = __rest(props, ["items", "getItemHref", "getItemLabel", "getItemIcon", "getItemOnClick", "onItemClick", "size", "className", "renderItem"]);
|
|
11
|
+
var items = props.items, getItemHref = props.getItemHref, getItemLabel = props.getItemLabel, getItemIcon = props.getItemIcon, getItemOnClick = props.getItemOnClick, getItemSubMenu = props.getItemSubMenu, onItemClick = props.onItemClick, size = props.size, className = props.className, renderItem = props.renderItem, otherProps = __rest(props, ["items", "getItemHref", "getItemLabel", "getItemIcon", "getItemOnClick", "getItemSubMenu", "onItemClick", "size", "className", "renderItem"]);
|
|
12
12
|
var _b = useElements(items), firstItem = _b.firstItem, lastItem = _b.lastItem, readyToHideItems = _b.readyToHideItems, hiddenItems = _b.hiddenItems, itemsRefs = _b.itemsRefs, wrapperRef = _b.wrapperRef, moreRef = _b.moreRef, firstItemRef = _b.firstItemRef, lastItemRef = _b.lastItemRef, lastWidth = _b.lastWidth, compression = _b.compression;
|
|
13
13
|
var rootRef = useForkRef([ref, wrapperRef]);
|
|
14
14
|
return (React.createElement("ul", __assign({ className: cnBreadcrumbsFitModeDropdown({ compression: compression }, [className]), ref: rootRef }, otherProps, { style: (_a = {}, _a['--breadcrumbs-item-last-width'] = lastWidth, _a) }),
|
|
15
15
|
renderItem(firstItem, 'first', true, false, firstItemRef),
|
|
16
|
-
React.createElement(BreadcrumbsMore, { size: size, getItemHref: getItemHref, getItemIcon: getItemIcon, getItemLabel: getItemLabel, getItemOnClick: getItemOnClick, onItemClick: onItemClick, items: hiddenItems, ref: moreRef, className: cnBreadcrumbsFitModeDropdown('Item', { removed: hiddenItems.length <= 0 }) }),
|
|
16
|
+
React.createElement(BreadcrumbsMore, { size: size, getItemHref: getItemHref, getItemIcon: getItemIcon, getItemLabel: getItemLabel, getItemOnClick: getItemOnClick, onItemClick: onItemClick, getItemSubMenu: getItemSubMenu, items: hiddenItems, ref: moreRef, className: cnBreadcrumbsFitModeDropdown('Item', { removed: hiddenItems.length <= 0 }) }),
|
|
17
17
|
readyToHideItems.map(function (item, index) {
|
|
18
18
|
return renderItem(item, index, false, false, itemsRefs[index], !!hiddenItems[index]);
|
|
19
19
|
}),
|
|
@@ -26,3 +26,23 @@
|
|
|
26
26
|
.BreadcrumbsItem-Link:hover {
|
|
27
27
|
color: var(--color-typo-link-hover);
|
|
28
28
|
}
|
|
29
|
+
|
|
30
|
+
.BreadcrumbsItem-SelectButton {
|
|
31
|
+
width: vaer(--space-s);
|
|
32
|
+
height: var(--space-s);
|
|
33
|
+
margin: 0;
|
|
34
|
+
margin-left: var(--space-xs);
|
|
35
|
+
padding: 0;
|
|
36
|
+
background: transparent;
|
|
37
|
+
border: none;
|
|
38
|
+
cursor: pointer;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.BreadcrumbsItem-SelectButton .Icon {
|
|
42
|
+
-webkit-transition: color 0.2s;
|
|
43
|
+
transition: color 0.2s;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.BreadcrumbsItem-SelectButton:hover .Icon {
|
|
47
|
+
color: var(--color-typo-link-hover);
|
|
48
|
+
}
|
|
@@ -1,16 +1,4 @@
|
|
|
1
1
|
import './BreadcrumbsItem.css';
|
|
2
|
-
import
|
|
2
|
+
import { BreadcrumbsItemComponent } from '../types';
|
|
3
3
|
export declare const cnBreadcrumbsItem: import("@bem-react/classname").ClassNameFormatter;
|
|
4
|
-
export declare const BreadcrumbsItem:
|
|
5
|
-
size: 'm' | 'xs' | 's' | 'l';
|
|
6
|
-
label?: React.ReactNode;
|
|
7
|
-
active?: boolean | undefined;
|
|
8
|
-
href?: string | undefined;
|
|
9
|
-
icon?: React.FC<import("../../../utils/types/PropsWithHTMLAttributes").PropsWithHTMLAttributesAndRef<{
|
|
10
|
-
view?: "link" | "alert" | "brand" | "ghost" | "primary" | "secondary" | "success" | "warning" | "disabled" | undefined;
|
|
11
|
-
size?: "xs" | "s" | "m" | undefined;
|
|
12
|
-
}, HTMLSpanElement>> | undefined;
|
|
13
|
-
onlyIcon?: boolean | undefined;
|
|
14
|
-
delimiter?: boolean | undefined;
|
|
15
|
-
onClick?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
|
|
16
|
-
} & Pick<React.HTMLAttributes<HTMLLIElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<HTMLLIElement>>;
|
|
4
|
+
export declare const BreadcrumbsItem: BreadcrumbsItemComponent;
|
|
@@ -1,16 +1,27 @@
|
|
|
1
|
-
import { __assign, __rest } from "tslib";
|
|
1
|
+
import { __assign, __read, __rest } from "tslib";
|
|
2
2
|
import './BreadcrumbsItem.css';
|
|
3
|
-
import React, { forwardRef } from 'react';
|
|
3
|
+
import React, { forwardRef, useRef } from 'react';
|
|
4
|
+
import { useFlag } from '../../../hooks/useFlag/useFlag';
|
|
4
5
|
import { IconArrowRight } from '../../../icons/IconArrowRight/IconArrowRight';
|
|
6
|
+
import { IconSelect } from '../../../icons/IconSelect/IconSelect';
|
|
5
7
|
import { cnMixSpace } from '../../../mixs/MixSpace/MixSpace';
|
|
6
8
|
import { cn } from '../../../utils/bem';
|
|
7
9
|
import { getByMap } from '../../../utils/getByMap';
|
|
8
10
|
import { Button } from '../../Button/Button';
|
|
11
|
+
import { ContextMenu } from '../../ContextMenuCanary/ContextMenuCanary';
|
|
9
12
|
import { Text } from '../../Text/Text';
|
|
13
|
+
import { contextMenuSizeMap, getItemAs, getItemAttributes, } from '../BreadcrumbsMore/BreadcrumbsMore';
|
|
10
14
|
import { iconSizeMap } from '../helpers';
|
|
11
15
|
export var cnBreadcrumbsItem = cn('BreadcrumbsItem');
|
|
12
|
-
|
|
13
|
-
var className = props.className,
|
|
16
|
+
function BreadcrumbsItemRender(props, ref) {
|
|
17
|
+
var className = props.className, onItemClickProp = props.onItemClick, item = props.item, size = props.size, onlyIconProp = props.onlyIcon, delimiter = props.delimiter, active = props.active, getItemHref = props.getItemHref, getItemIcon = props.getItemIcon, getItemLabel = props.getItemLabel, getItemSubMenu = props.getItemSubMenu, children = props.children, otherProps = __rest(props, ["className", "onItemClick", "item", "size", "onlyIcon", "delimiter", "active", "getItemHref", "getItemIcon", "getItemLabel", "getItemSubMenu", "children"]);
|
|
18
|
+
var _a = __read(useFlag(), 2), open = _a[0], setOpen = _a[1];
|
|
19
|
+
var buttonRef = useRef(null);
|
|
20
|
+
var Icon = item && (getItemIcon === null || getItemIcon === void 0 ? void 0 : getItemIcon(item));
|
|
21
|
+
var onlyIcon = Icon && onlyIconProp;
|
|
22
|
+
var href = item && (getItemHref === null || getItemHref === void 0 ? void 0 : getItemHref(item));
|
|
23
|
+
var label = item && (getItemLabel === null || getItemLabel === void 0 ? void 0 : getItemLabel(item));
|
|
24
|
+
var subMenu = item && (getItemSubMenu === null || getItemSubMenu === void 0 ? void 0 : getItemSubMenu(item));
|
|
14
25
|
var iconSize = getByMap(iconSizeMap, size);
|
|
15
26
|
var linkProps = href
|
|
16
27
|
? {
|
|
@@ -20,11 +31,23 @@ export var BreadcrumbsItem = forwardRef(function (props, ref) {
|
|
|
20
31
|
: {
|
|
21
32
|
as: 'span'
|
|
22
33
|
};
|
|
23
|
-
var
|
|
34
|
+
var handleClick = function (e) {
|
|
35
|
+
item && (onItemClickProp === null || onItemClickProp === void 0 ? void 0 : onItemClickProp({ e: e, item: item }));
|
|
36
|
+
};
|
|
37
|
+
var onItemClick = function (_a) {
|
|
38
|
+
var e = _a.e, item = _a.item;
|
|
39
|
+
setOpen.off();
|
|
40
|
+
item && (onItemClickProp === null || onItemClickProp === void 0 ? void 0 : onItemClickProp({ e: e, item: item }));
|
|
41
|
+
};
|
|
24
42
|
return (React.createElement("li", __assign({ className: cnBreadcrumbsItem(null, [className]), ref: ref }, otherProps),
|
|
25
43
|
delimiter && (React.createElement(IconArrowRight, { className: cnBreadcrumbsItem('Delimiter', [cnMixSpace({ mH: size })]), view: "ghost", size: iconSize })),
|
|
26
|
-
children || (React.createElement(
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
44
|
+
children || (React.createElement(React.Fragment, null,
|
|
45
|
+
React.createElement(Text, __assign({ className: cnBreadcrumbsItem('Link', { active: active }), view: active ? 'primary' : 'secondary', onClick: handleClick, size: size, truncate: !onlyIcon }, linkProps),
|
|
46
|
+
Icon &&
|
|
47
|
+
(onlyIcon ? (React.createElement(Button, { view: "clear", onlyIcon: true, iconLeft: Icon, size: iconSize })) : (React.createElement(Icon, { className: cnBreadcrumbsItem('Icon', [cnMixSpace({ mR: 'xs' })]), size: iconSize }))),
|
|
48
|
+
!onlyIcon && label),
|
|
49
|
+
subMenu && (React.createElement("button", { ref: buttonRef, onClick: setOpen.toogle, type: "button", className: cnBreadcrumbsItem('SelectButton') },
|
|
50
|
+
React.createElement(IconSelect, { size: "xs", view: active ? 'primary' : 'secondary' }))))),
|
|
51
|
+
subMenu && (React.createElement(ContextMenu, { isOpen: open, items: subMenu, getItemLabel: getItemLabel, getItemSubMenu: getItemSubMenu, getItemLeftIcon: getItemIcon, onItemClick: onItemClick, getItemAs: getItemAs(getItemHref), getItemAttributes: getItemAttributes(getItemHref), direction: "downStartRight", possibleDirections: ['downStartLeft', 'upStartLeft', 'downStartRight', 'upStartRight'], anchorRef: buttonRef, offset: "xs", onClickOutside: setOpen.off, size: contextMenuSizeMap[size] }))));
|
|
52
|
+
}
|
|
53
|
+
export var BreadcrumbsItem = forwardRef(BreadcrumbsItemRender);
|
|
@@ -1,5 +1,11 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import './BreadcrumbsMore.css';
|
|
2
|
-
import { BreadcrumbsMoreComponent } from '../types';
|
|
3
|
+
import { BreadcrumbsMoreComponent, BreadcrumbsPropGetItemHref, BreadcrumbsPropGetItemIcon } from '../types';
|
|
4
|
+
export declare function getLeftSideBar<ITEM>(iconSize: 'xs' | 'm', getItemIcon?: BreadcrumbsPropGetItemIcon<ITEM>): (item: ITEM) => JSX.Element | undefined;
|
|
5
|
+
export declare function getItemAs<ITEM>(getItemHref?: BreadcrumbsPropGetItemHref<ITEM>): (item: ITEM) => "a" | "span";
|
|
6
|
+
export declare function getItemAttributes<ITEM>(getItemHref?: BreadcrumbsPropGetItemHref<ITEM>): (item: ITEM) => {
|
|
7
|
+
href: string | undefined;
|
|
8
|
+
} | undefined;
|
|
3
9
|
export declare const contextMenuSizeMap: {
|
|
4
10
|
readonly xs: "s";
|
|
5
11
|
readonly s: "s";
|