@consta/header 0.1.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/Badges/Badges.css +1 -0
- package/Badges/Badges.d.ts +5 -0
- package/Badges/Badges.js +2 -0
- package/Badges/Badges.js.map +1 -0
- package/Badges/helpers.d.ts +20 -0
- package/Badges/helpers.js +2 -0
- package/Badges/helpers.js.map +1 -0
- package/Badges/index.d.ts +1 -0
- package/Badges/index.js +2 -0
- package/Badges/index.js.map +1 -0
- package/Badges/types.d.ts +27 -0
- package/Badges/types.js +2 -0
- package/Badges/types.js.map +1 -0
- package/Header/Header.css +1 -0
- package/Header/Header.d.ts +5 -0
- package/Header/Header.js +2 -0
- package/Header/Header.js.map +1 -0
- package/Header/HeaderLogin/HeaderLogin.d.ts +15 -0
- package/Header/HeaderLogin/HeaderLogin.js +2 -0
- package/Header/HeaderLogin/HeaderLogin.js.map +1 -0
- package/Header/HeaderLogin/index.d.ts +1 -0
- package/Header/HeaderLogin/index.js +2 -0
- package/Header/HeaderLogin/index.js.map +1 -0
- package/Header/HeaderLogo/HeaderLogo.d.ts +9 -0
- package/Header/HeaderLogo/HeaderLogo.js +2 -0
- package/Header/HeaderLogo/HeaderLogo.js.map +1 -0
- package/Header/HeaderLogo/index.d.ts +1 -0
- package/Header/HeaderLogo/index.js +2 -0
- package/Header/HeaderLogo/index.js.map +1 -0
- package/Header/index.d.ts +1 -0
- package/Header/index.js +2 -0
- package/Header/index.js.map +1 -0
- package/Header/types.d.ts +80 -0
- package/Header/types.js +2 -0
- package/Header/types.js.map +1 -0
- package/Layout/Layout.css +1 -0
- package/Layout/Layout.d.ts +8 -0
- package/Layout/Layout.js +2 -0
- package/Layout/Layout.js.map +1 -0
- package/Layout/LayoutRow/LayoutRow.css +1 -0
- package/Layout/LayoutRow/LayoutRow.d.ts +11 -0
- package/Layout/LayoutRow/LayoutRow.js +2 -0
- package/Layout/LayoutRow/LayoutRow.js.map +1 -0
- package/Layout/helpers.d.ts +2 -0
- package/Layout/helpers.js +2 -0
- package/Layout/helpers.js.map +1 -0
- package/Layout/index.d.ts +1 -0
- package/Layout/index.js +2 -0
- package/Layout/index.js.map +1 -0
- package/Layout/types.d.ts +17 -0
- package/Layout/types.js +2 -0
- package/Layout/types.js.map +1 -0
- package/Menu/Menu.css +1 -0
- package/Menu/Menu.d.ts +5 -0
- package/Menu/Menu.js +2 -0
- package/Menu/Menu.js.map +1 -0
- package/Menu/helpers.d.ts +31 -0
- package/Menu/helpers.js +2 -0
- package/Menu/helpers.js.map +1 -0
- package/Menu/index.d.ts +1 -0
- package/Menu/index.js +2 -0
- package/Menu/index.js.map +1 -0
- package/Menu/types.d.ts +35 -0
- package/Menu/types.js +2 -0
- package/Menu/types.js.map +1 -0
- package/MobileMenu/MobileMenu.css +1 -0
- package/MobileMenu/MobileMenu.d.ts +5 -0
- package/MobileMenu/MobileMenu.js +2 -0
- package/MobileMenu/MobileMenu.js.map +1 -0
- package/MobileMenu/index.d.ts +1 -0
- package/MobileMenu/index.js +2 -0
- package/MobileMenu/index.js.map +1 -0
- package/MobileMenu/types.d.ts +21 -0
- package/MobileMenu/types.js +2 -0
- package/MobileMenu/types.js.map +1 -0
- package/Notifications/Notifications.css +1 -0
- package/Notifications/Notifications.d.ts +4 -0
- package/Notifications/Notifications.js +2 -0
- package/Notifications/Notifications.js.map +1 -0
- package/Notifications/index.d.ts +1 -0
- package/Notifications/index.js +2 -0
- package/Notifications/index.js.map +1 -0
- package/Notifications/types.d.ts +8 -0
- package/Notifications/types.js +2 -0
- package/Notifications/types.js.map +1 -0
- package/NotificationsList/NotificationsList.css +1 -0
- package/NotificationsList/NotificationsList.d.ts +5 -0
- package/NotificationsList/NotificationsList.js +2 -0
- package/NotificationsList/NotificationsList.js.map +1 -0
- package/NotificationsList/helpers.d.ts +4150 -0
- package/NotificationsList/helpers.js +2 -0
- package/NotificationsList/helpers.js.map +1 -0
- package/NotificationsList/index.d.ts +1 -0
- package/NotificationsList/index.js +2 -0
- package/NotificationsList/index.js.map +1 -0
- package/NotificationsList/types.d.ts +88 -0
- package/NotificationsList/types.js +2 -0
- package/NotificationsList/types.js.map +1 -0
- package/README.md +80 -0
- package/TileMenu/TileMenu.css +1 -0
- package/TileMenu/TileMenu.d.ts +5 -0
- package/TileMenu/TileMenu.js +2 -0
- package/TileMenu/TileMenu.js.map +1 -0
- package/TileMenu/TileMenuItem/TileMenuItem.css +1 -0
- package/TileMenu/TileMenuItem/TileMenuItem.d.ts +12 -0
- package/TileMenu/TileMenuItem/TileMenuItem.js +2 -0
- package/TileMenu/TileMenuItem/TileMenuItem.js.map +1 -0
- package/TileMenu/TileMenuList/TileMenuList.css +1 -0
- package/TileMenu/TileMenuList/TileMenuList.d.ts +4 -0
- package/TileMenu/TileMenuList/TileMenuList.js +2 -0
- package/TileMenu/TileMenuList/TileMenuList.js.map +1 -0
- package/TileMenu/TileMenuList/types.d.ts +32 -0
- package/TileMenu/TileMenuList/types.js +2 -0
- package/TileMenu/TileMenuList/types.js.map +1 -0
- package/TileMenu/helpers.d.ts +274 -0
- package/TileMenu/helpers.js +2 -0
- package/TileMenu/helpers.js.map +1 -0
- package/TileMenu/index.d.ts +1 -0
- package/TileMenu/index.js +2 -0
- package/TileMenu/index.js.map +1 -0
- package/TileMenu/types.d.ts +48 -0
- package/TileMenu/types.js +2 -0
- package/TileMenu/types.js.map +1 -0
- package/VerticalMenu/VerticalMenu.css +1 -0
- package/VerticalMenu/VerticalMenu.d.ts +5 -0
- package/VerticalMenu/VerticalMenu.js +2 -0
- package/VerticalMenu/VerticalMenu.js.map +1 -0
- package/VerticalMenu/VerticalMenuItem/VerticalMenuItem.css +1 -0
- package/VerticalMenu/VerticalMenuItem/VerticalMenuItem.d.ts +4 -0
- package/VerticalMenu/VerticalMenuItem/VerticalMenuItem.js +2 -0
- package/VerticalMenu/VerticalMenuItem/VerticalMenuItem.js.map +1 -0
- package/VerticalMenu/VerticalMenuLevel/VerticalMenuLevel.css +1 -0
- package/VerticalMenu/VerticalMenuLevel/VerticalMenuLevel.d.ts +5 -0
- package/VerticalMenu/VerticalMenuLevel/VerticalMenuLevel.js +2 -0
- package/VerticalMenu/VerticalMenuLevel/VerticalMenuLevel.js.map +1 -0
- package/VerticalMenu/helpers.d.ts +31 -0
- package/VerticalMenu/helpers.js +2 -0
- package/VerticalMenu/helpers.js.map +1 -0
- package/VerticalMenu/index.d.ts +1 -0
- package/VerticalMenu/index.js +2 -0
- package/VerticalMenu/index.js.map +1 -0
- package/VerticalMenu/types.d.ts +63 -0
- package/VerticalMenu/types.js +2 -0
- package/VerticalMenu/types.js.map +1 -0
- package/__private__/AnimatedContextMenu/AnimatedContextMenu.css +1 -0
- package/__private__/AnimatedContextMenu/AnimatedContextMenu.d.ts +8 -0
- package/__private__/AnimatedContextMenu/AnimatedContextMenu.js +2 -0
- package/__private__/AnimatedContextMenu/AnimatedContextMenu.js.map +1 -0
- package/__private__/components/NotificationCard/NotificationCard.css +1 -0
- package/__private__/components/NotificationCard/NotificationCard.d.ts +19 -0
- package/__private__/components/NotificationCard/NotificationCard.js +2 -0
- package/__private__/components/NotificationCard/NotificationCard.js.map +1 -0
- package/__private__/components/NotificationCard/helpers.d.ts +1 -0
- package/__private__/components/NotificationCard/helpers.js +2 -0
- package/__private__/components/NotificationCard/helpers.js.map +1 -0
- package/__private__/components/NotificationCard/index.d.ts +1 -0
- package/__private__/components/NotificationCard/index.js +2 -0
- package/__private__/components/NotificationCard/index.js.map +1 -0
- package/__private__/components/NotificationCard/types.d.ts +28 -0
- package/__private__/components/NotificationCard/types.js +2 -0
- package/__private__/components/NotificationCard/types.js.map +1 -0
- package/__private__/components/NotificationsActions/NotificationsActions.d.ts +2 -0
- package/__private__/components/NotificationsActions/NotificationsActions.js +2 -0
- package/__private__/components/NotificationsActions/NotificationsActions.js.map +1 -0
- package/__private__/components/NotificationsActions/helpers.d.ts +23 -0
- package/__private__/components/NotificationsActions/helpers.js +2 -0
- package/__private__/components/NotificationsActions/helpers.js.map +1 -0
- package/__private__/components/NotificationsActions/index.d.ts +1 -0
- package/__private__/components/NotificationsActions/index.js +2 -0
- package/__private__/components/NotificationsActions/index.js.map +1 -0
- package/__private__/components/NotificationsActions/types.d.ts +32 -0
- package/__private__/components/NotificationsActions/types.js +2 -0
- package/__private__/components/NotificationsActions/types.js.map +1 -0
- package/__private__/components/Sidebar/Sidebar.css +1 -0
- package/__private__/components/Sidebar/Sidebar.d.ts +9 -0
- package/__private__/components/Sidebar/Sidebar.js +2 -0
- package/__private__/components/Sidebar/Sidebar.js.map +1 -0
- package/__private__/components/Sidebar/index.d.ts +1 -0
- package/__private__/components/Sidebar/index.js +2 -0
- package/__private__/components/Sidebar/index.js.map +1 -0
- package/__private__/hooks/useHideElementsLine.d.ts +8 -0
- package/__private__/hooks/useHideElementsLine.js +2 -0
- package/__private__/hooks/useHideElementsLine.js.map +1 -0
- package/__private__/mixs/MixPopoverAnimate/MixPopoverAnimate.css +1 -0
- package/__private__/mixs/MixPopoverAnimate/MixPopoverAnimate.d.ts +4 -0
- package/__private__/mixs/MixPopoverAnimate/MixPopoverAnimate.js +2 -0
- package/__private__/mixs/MixPopoverAnimate/MixPopoverAnimate.js.map +1 -0
- package/__private__/mixs/MixPopoverArrow/MixPopoverArrow.css +1 -0
- package/__private__/mixs/MixPopoverArrow/MixPopoverArrow.d.ts +8 -0
- package/__private__/mixs/MixPopoverArrow/MixPopoverArrow.js +2 -0
- package/__private__/mixs/MixPopoverArrow/MixPopoverArrow.js.map +1 -0
- package/__private__/utils/bem.d.ts +1 -0
- package/__private__/utils/bem.js +2 -0
- package/__private__/utils/bem.js.map +1 -0
- package/__private__/utils/types/PropsWithHTMLAttributes.d.ts +3 -0
- package/__private__/utils/types/PropsWithHTMLAttributes.js +2 -0
- package/__private__/utils/types/PropsWithHTMLAttributes.js.map +1 -0
- package/package.json +41 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"types.js"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.che--AnimatedContextMenu_exit{pointer-events:none;opacity:0;transition:opacity .2s,transform .2s;transform:translateY(var(--space-s))}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ContextMenuProps } from '@consta/uikit/__internal__/src/components/ContextMenu/helpers';
|
|
3
|
+
import './AnimatedContextMenu.css';
|
|
4
|
+
export declare type AnimatedContextMenuComponent = <ITEM>(props: ContextMenuProps<ITEM> & {
|
|
5
|
+
isOpen?: boolean;
|
|
6
|
+
}) => React.ReactElement | null;
|
|
7
|
+
export declare const cnAnimatedContextMenu: import("@bem-react/classname").ClassNameFormatter;
|
|
8
|
+
export declare const AnimatedContextMenu: AnimatedContextMenuComponent;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import _jsx from"@babel/runtime/helpers/jsx";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React from"react";import{useFlag}from"@consta/uikit/useFlag";import{CSSTransition}from"react-transition-group";import{cnMixPopoverAnimateForCssTransition,animateTimeout}from"../mixs/MixPopoverAnimate/MixPopoverAnimate";import{cn}from"../utils/bem";import{ContextMenu}from"@consta/uikit/ContextMenu";import"./AnimatedContextMenu.css";export const cnAnimatedContextMenu=cn("AnimatedContextMenu");export const AnimatedContextMenu=a=>{const{isOpen:b,className:c}=a,d=_objectWithoutProperties(a,["isOpen","className"]),[e,f]=useFlag();return _jsx(CSSTransition,{in:b,classNames:cnMixPopoverAnimateForCssTransition,unmountOnExit:!0,timeout:animateTimeout,onEnter:f.off,onExit:f.on},void 0,React.createElement(ContextMenu,Object.assign({},d,{className:cnAnimatedContextMenu({exit:e},[c])})))};
|
|
2
|
+
//# sourceMappingURL=AnimatedContextMenu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/__private__/AnimatedContextMenu/AnimatedContextMenu.tsx"],"names":["React","useFlag","CSSTransition","cnMixPopoverAnimateForCssTransition","animateTimeout","cn","ContextMenu","cnAnimatedContextMenu","AnimatedContextMenu","props","isOpen","className","otherProps","exitAnimation","setExitAnimation","off","on","exit"],"mappings":"kIAAA,MAAOA,CAAAA,KAAP,KAAkB,OAAlB,CACA,OAASC,OAAT,KAAwB,uBAAxB,CACA,OAASC,aAAT,KAA8B,wBAA9B,CACA,OACEC,mCADF,CAEEC,cAFF,mDAIA,OAASC,EAAT,oBACA,OAASC,WAAT,KAA4B,2BAA5B,CAGA,kCAMA,MAAO,MAAMC,CAAAA,qBAAqB,CAAGF,EAAE,CAAC,qBAAD,CAAhC,CAEP,MAAO,MAAMG,CAAAA,mBAAiD,CAAGC,CAAK,EAAI,MAClE,CAAEC,MAAM,CAANA,CAAF,CAAUC,SAAS,CAATA,CAAV,EAAuCF,CAD2B,CAC1CG,CAD0C,0BAC3BH,CAD2B,yBAElE,CAACI,CAAD,CAAgBC,CAAhB,EAAoCb,OAAO,EAFuB,CAIxE,MACE,MAAC,aAAD,EACE,EAAE,CAAES,CADN,CAEE,UAAU,CAAEP,mCAFd,CAGE,aAAa,GAHf,CAIE,OAAO,CAAEC,cAJX,CAKE,OAAO,CAAEU,CAAgB,CAACC,GAL5B,CAME,MAAM,CAAED,CAAgB,CAACE,EAN3B,SAQE,oBAAC,WAAD,kBACMJ,CADN,EAEE,SAAS,CAAEL,qBAAqB,CAAC,CAAEU,IAAI,CAAEJ,CAAR,CAAD,CAA0B,CAACF,CAAD,CAA1B,CAFlC,GARF,CAcH,CAnBM","sourcesContent":["import React from 'react'\nimport { useFlag } from '@consta/uikit/useFlag'\nimport { CSSTransition } from 'react-transition-group'\nimport {\n cnMixPopoverAnimateForCssTransition,\n animateTimeout,\n} from '@/__private__/mixs/MixPopoverAnimate/MixPopoverAnimate'\nimport { cn } from '@/__private__/utils/bem'\nimport { ContextMenu } from '@consta/uikit/ContextMenu'\nimport { ContextMenuProps } from '@consta/uikit/__internal__/src/components/ContextMenu/helpers'\n\nimport './AnimatedContextMenu.css'\n\nexport type AnimatedContextMenuComponent = <ITEM>(\n props: ContextMenuProps<ITEM> & { isOpen?: boolean }\n) => React.ReactElement | null\n\nexport const cnAnimatedContextMenu = cn('AnimatedContextMenu')\n\nexport const AnimatedContextMenu: AnimatedContextMenuComponent = props => {\n const { isOpen, className, ...otherProps } = props\n const [exitAnimation, setExitAnimation] = useFlag()\n\n return (\n <CSSTransition\n in={isOpen}\n classNames={cnMixPopoverAnimateForCssTransition}\n unmountOnExit\n timeout={animateTimeout}\n onEnter={setExitAnimation.off}\n onExit={setExitAnimation.on}\n >\n <ContextMenu\n {...otherProps}\n className={cnAnimatedContextMenu({ exit: exitAnimation }, [className])}\n />\n </CSSTransition>\n )\n}\n"],"file":"AnimatedContextMenu.js"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.che--NotificationCard{display:flex}.che--NotificationCard-Image{flex:none;margin-right:var(--space-m)}.che--NotificationCard-Content{position:relative;flex:1}.che--NotificationCard-Text{margin-bottom:var(--space-m)}.che--NotificationCard-Text:last-child{margin-bottom:0}.che--NotificationCard-Title{margin-bottom:var(--space-2xs)}.che--NotificationCard-Title_cardWithActions{margin-right:calc(var(--control-height-xs) + var(--space-2xs))}.che--NotificationCard-Title:last-child{margin-bottom:0}.che--NotificationCard-Footer{display:flex;align-items:flex-end;justify-content:space-between}.che--NotificationCard-Badges{flex:1;margin-right:var(--space-xs)}.che--NotificationCard-Actions,.che--NotificationCard-Button{position:absolute;top:0;right:0}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './NotificationCard.css';
|
|
3
|
+
export declare const cnNotificationCard: import("@bem-react/classname").ClassNameFormatter;
|
|
4
|
+
export declare const NotificationCard: React.ForwardRefExoticComponent<Pick<import("../../utils/types/PropsWithHTMLAttributes").PropsWithHTMLAttributesAndRef<{
|
|
5
|
+
title: string;
|
|
6
|
+
description?: string | undefined;
|
|
7
|
+
imageUrl?: string | undefined;
|
|
8
|
+
read?: boolean | undefined;
|
|
9
|
+
date?: Date | undefined;
|
|
10
|
+
dateFormat?: ((date: Date) => string) | undefined;
|
|
11
|
+
badges?: import("./types").NotificationCardBadge[] | undefined;
|
|
12
|
+
actions?: import("./types").NotificationCardAction[] | undefined;
|
|
13
|
+
onClick?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
|
|
14
|
+
children?: undefined;
|
|
15
|
+
view?: "user" | "default" | undefined;
|
|
16
|
+
actionsMenuOpened?: boolean | undefined;
|
|
17
|
+
setVisibleMenu?: ((setVisibleMenu: React.Dispatch<React.SetStateAction<boolean>>) => void) | undefined;
|
|
18
|
+
}, HTMLDivElement>, "description" | "hidden" | "dir" | "slot" | "style" | "title" | "view" | "color" | "key" | "children" | "date" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "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" | "onClick" | "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" | "actions" | "setVisibleMenu" | "imageUrl" | "read" | "dateFormat" | "badges" | "actionsMenuOpened"> & React.RefAttributes<HTMLDivElement>>;
|
|
19
|
+
export * from "./types";
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import _jsx from"@babel/runtime/helpers/jsx";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{forwardRef}from"react";import{defaultDateFormat}from"./helpers";import{Avatar}from"@consta/uikit/Avatar";import{Text}from"@consta/uikit/Text";import{NotificationsActions}from"../NotificationsActions";import{Badges}from"../../../Badges";import{cn}from"../../utils/bem";import"./NotificationCard.css";export const cnNotificationCard=cn("NotificationCard");export const NotificationCard=forwardRef((a,b)=>{var c;const{title:d,className:e,description:f,imageUrl:g,view:n="default",read:h,date:i,dateFormat:o=defaultDateFormat,badges:j,actions:k,actionsMenuOpened:l,setVisibleMenu:m}=a,p=_objectWithoutProperties(a,["title","className","description","imageUrl","view","read","date","dateFormat","badges","actions","actionsMenuOpened","setVisibleMenu"]);return React.createElement("div",Object.assign({},p,{ref:b,className:cnNotificationCard(null,[e])}),(g||"user"===n)&&_jsx(Avatar,{size:"l",name:d,url:g,className:cnNotificationCard("Image")}),_jsx("div",{className:cnNotificationCard("Content")},void 0,_jsx("div",{className:cnNotificationCard("Text")},void 0,_jsx(Text,{weight:h?void 0:"bold",className:cnNotificationCard("Title",{cardWithActions:!(!(null!==k&&void 0!==k)||!k.length)})},void 0,d),f&&_jsx(Text,{size:"s"},void 0,f)),(j||i)&&_jsx("div",{className:cnNotificationCard("Footer")},void 0,_jsx(Badges,{className:cnNotificationCard("Badges"),items:j,view:"stroked"}),i&&_jsx(Text,{size:"xs",view:"secondary"},void 0,o(i))),(null===k||void 0===k?void 0:k.length)&&_jsx(NotificationsActions,{className:cnNotificationCard("Actions"),items:k,mainButtonOnlyIcon:!0,opened:l,setVisibleMenu:m,style:{zIndex:null===(c=a.style)||void 0===c?void 0:c.zIndex}})))});export*from"./types";
|
|
2
|
+
//# sourceMappingURL=NotificationCard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/__private__/components/NotificationCard/NotificationCard.tsx"],"names":["React","forwardRef","defaultDateFormat","Avatar","Text","NotificationsActions","Badges","cn","cnNotificationCard","NotificationCard","props","ref","title","className","description","imageUrl","view","read","date","dateFormat","badges","actions","actionsMenuOpened","setVisibleMenu","otherProps","cardWithActions","length","zIndex","style"],"mappings":"kIAAA,MAAOA,CAAAA,KAAP,EAAgBC,UAAhB,KAAkC,OAAlC,CACA,OAASC,iBAAT,iBACA,OAASC,MAAT,KAAuB,sBAAvB,CACA,OAASC,IAAT,KAAqB,oBAArB,CACA,OAASC,oBAAT,+BAEA,OAASC,MAAT,uBAEA,OAASC,EAAT,uBAGA,+BAEA,MAAO,MAAMC,CAAAA,kBAAkB,CAAGD,EAAE,CAAC,kBAAD,CAA7B,CAEP,MAAO,MAAME,CAAAA,gBAAgB,CAAGR,UAAU,CACxC,CAACS,CAAD,CAA+BC,CAA/B,GAAkE,OAChE,KAAM,CACJC,KAAK,CAALA,CADI,CAEJC,SAAS,CAATA,CAFI,CAGJC,WAAW,CAAXA,CAHI,CAIJC,QAAQ,CAARA,CAJI,CAKJC,IAAI,CAAJA,CAAI,CAAG,SALH,CAMJC,IAAI,CAAJA,CANI,CAOJC,IAAI,CAAJA,CAPI,CAQJC,UAAU,CAAVA,CAAU,CAAGjB,iBART,CASJkB,MAAM,CAANA,CATI,CAUJC,OAAO,CAAPA,CAVI,CAWJC,iBAAiB,CAAjBA,CAXI,CAYJC,cAAc,CAAdA,CAZI,EAcFb,CAdJ,CAaKc,CAbL,0BAcId,CAdJ,2IAgBA,MACE,4CAASc,CAAT,EAAqB,GAAG,CAAEb,CAA1B,CAA+B,SAAS,CAAEH,kBAAkB,CAAC,IAAD,CAAO,CAACK,CAAD,CAAP,CAA5D,GACG,CAACE,CAAQ,EAAa,MAAT,GAAAC,CAAb,GACC,KAAC,MAAD,EAAQ,IAAI,CAAC,GAAb,CAAiB,IAAI,CAAEJ,CAAvB,CAA8B,GAAG,CAAEG,CAAnC,CAA6C,SAAS,CAAEP,kBAAkB,CAAC,OAAD,CAA1E,EAFJ,CAIE,YAAK,SAAS,CAAEA,kBAAkB,CAAC,SAAD,CAAlC,SACE,YAAK,SAAS,CAAEA,kBAAkB,CAAC,MAAD,CAAlC,SACE,KAAC,IAAD,EACE,MAAM,CAAGS,CAAD,QAAQ,MADlB,CAEE,SAAS,CAAET,kBAAkB,CAAC,OAAD,CAAU,CAAEiB,eAAe,CAAE,WAAEJ,CAAF,WAAEA,CAAF,IAAEA,CAAO,CAAEK,MAAX,CAAnB,CAAV,CAF/B,SAIGd,CAJH,CADF,CAOGE,CAAW,EAAI,KAAC,IAAD,EAAM,IAAI,CAAC,GAAX,SAAgBA,CAAhB,CAPlB,CADF,CAUG,CAACM,CAAM,EAAIF,CAAX,GACC,YAAK,SAAS,CAAEV,kBAAkB,CAAC,QAAD,CAAlC,SACE,KAAC,MAAD,EAAQ,SAAS,CAAEA,kBAAkB,CAAC,QAAD,CAArC,CAAiD,KAAK,CAAEY,CAAxD,CAAgE,IAAI,CAAC,SAArE,EADF,CAEGF,CAAI,EACH,KAAC,IAAD,EAAM,IAAI,CAAC,IAAX,CAAgB,IAAI,CAAC,WAArB,SACGC,CAAU,CAACD,CAAD,CADb,CAHJ,CAXJ,CAoBG,QAAAG,CAAO,WAAPA,SAAAA,CAAO,CAAEK,MAAT,GACC,KAAC,oBAAD,EACE,SAAS,CAAElB,kBAAkB,CAAC,SAAD,CAD/B,CAEE,KAAK,CAAEa,CAFT,CAGE,kBAAkB,GAHpB,CAIE,MAAM,CAAEC,CAJV,CAKE,cAAc,CAAEC,CALlB,CAME,KAAK,CAAE,CAAEI,MAAM,WAAEjB,CAAK,CAACkB,KAAR,qBAAE,EAAaD,MAAvB,CANT,EArBJ,CAJF,CAqCH,CAxDuC,CAAnC,CA2DP","sourcesContent":["import React, { forwardRef } from 'react'\nimport { defaultDateFormat } from './helpers'\nimport { Avatar } from '@consta/uikit/Avatar'\nimport { Text } from '@consta/uikit/Text'\nimport { NotificationsActions } from '@/__private__/components/NotificationsActions'\n\nimport { Badges } from '@/Badges'\n\nimport { cn } from '@/__private__/utils/bem'\n\nimport { NotificationCardProps } from './types'\nimport './NotificationCard.css'\n\nexport const cnNotificationCard = cn('NotificationCard')\n\nexport const NotificationCard = forwardRef(\n (props: NotificationCardProps, ref: React.Ref<HTMLDivElement>) => {\n const {\n title,\n className,\n description,\n imageUrl,\n view = 'default',\n read,\n date,\n dateFormat = defaultDateFormat,\n badges,\n actions,\n actionsMenuOpened,\n setVisibleMenu,\n ...otherProps\n } = props\n\n return (\n <div {...otherProps} ref={ref} className={cnNotificationCard(null, [className])}>\n {(imageUrl || view === 'user') && (\n <Avatar size=\"l\" name={title} url={imageUrl} className={cnNotificationCard('Image')} />\n )}\n <div className={cnNotificationCard('Content')}>\n <div className={cnNotificationCard('Text')}>\n <Text\n weight={!read ? 'bold' : undefined}\n className={cnNotificationCard('Title', { cardWithActions: !!actions?.length })}\n >\n {title}\n </Text>\n {description && <Text size=\"s\">{description}</Text>}\n </div>\n {(badges || date) && (\n <div className={cnNotificationCard('Footer')}>\n <Badges className={cnNotificationCard('Badges')} items={badges} view=\"stroked\" />\n {date && (\n <Text size=\"xs\" view=\"secondary\">\n {dateFormat(date)}\n </Text>\n )}\n </div>\n )}\n {actions?.length && (\n <NotificationsActions\n className={cnNotificationCard('Actions')}\n items={actions}\n mainButtonOnlyIcon\n opened={actionsMenuOpened}\n setVisibleMenu={setVisibleMenu}\n style={{ zIndex: props.style?.zIndex }}\n />\n )}\n </div>\n </div>\n )\n }\n)\n\nexport * from './types'\n"],"file":"NotificationCard.js"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const defaultDateFormat: (date: Date) => string;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{format,formatDistanceToNow}from"date-fns";import ruLocale from"date-fns/locale/ru";export const defaultDateFormat=a=>{const b=new Date;return 36e5>b.getTime()-a.getTime()?formatDistanceToNow(a,{locale:ruLocale,addSuffix:!0}):format(b,"dd.MM.yyyy")===format(a,"dd.MM.yyyy")?format(a,"HH:mm"):format(a,"dd.MM.yyyy HH:mm")};
|
|
2
|
+
//# sourceMappingURL=helpers.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/__private__/components/NotificationCard/helpers.ts"],"names":["format","formatDistanceToNow","ruLocale","defaultDateFormat","date","currentDate","Date","getTime","locale","addSuffix"],"mappings":"AAAA,OAASA,MAAT,CAAiBC,mBAAjB,KAA4C,UAA5C,CACA,MAAOC,CAAAA,QAAP,KAAqB,oBAArB,CAEA,MAAO,MAAMC,CAAAA,iBAAiB,CAAIC,CAAD,EAAwB,CACvD,KAAMC,CAAAA,CAAW,CAAG,GAAIC,CAAAA,IAAxB,CADuD,MAGV,KAAzC,CAAAD,CAAW,CAACE,OAAZ,GAAwBH,CAAI,CAACG,OAAL,EAH2B,CAI9CN,mBAAmB,CAACG,CAAD,CAAO,CAAEI,MAAM,CAAEN,QAAV,CAAoBO,SAAS,GAA7B,CAAP,CAJ2B,CAOnDT,MAAM,CAACK,CAAD,CAAc,YAAd,CAAN,GAAsCL,MAAM,CAACI,CAAD,CAAO,YAAP,CAPO,CAQ9CJ,MAAM,CAACI,CAAD,CAAO,OAAP,CARwC,CAWhDJ,MAAM,CAACI,CAAD,CAAO,kBAAP,CACd,CAZM","sourcesContent":["import { format, formatDistanceToNow } from 'date-fns'\nimport ruLocale from 'date-fns/locale/ru'\n\nexport const defaultDateFormat = (date: Date): string => {\n const currentDate = new Date()\n\n if (currentDate.getTime() - date.getTime() < 3600000) {\n return formatDistanceToNow(date, { locale: ruLocale, addSuffix: true })\n }\n\n if (format(currentDate, 'dd.MM.yyyy') === format(date, 'dd.MM.yyyy')) {\n return format(date, 'HH:mm')\n }\n\n return format(date, 'dd.MM.yyyy HH:mm')\n}\n"],"file":"helpers.js"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./NotificationCard";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/__private__/components/NotificationCard/index.ts"],"names":[],"mappings":"AAAA","sourcesContent":["export * from './NotificationCard'\n"],"file":"index.js"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { BadgePropStatus } from '@consta/uikit/Badge';
|
|
3
|
+
import { IconProps } from '@consta/uikit/Icon';
|
|
4
|
+
import { PropsWithHTMLAttributesAndRef } from "../../utils/types/PropsWithHTMLAttributes";
|
|
5
|
+
export declare type NotificationCardAction = {
|
|
6
|
+
label: string;
|
|
7
|
+
onClick?: React.EventHandler<React.MouseEvent>;
|
|
8
|
+
icon?: React.FC<IconProps>;
|
|
9
|
+
};
|
|
10
|
+
export declare type NotificationCardBadge = {
|
|
11
|
+
label: string;
|
|
12
|
+
status?: BadgePropStatus;
|
|
13
|
+
};
|
|
14
|
+
export declare type NotificationCardProps = PropsWithHTMLAttributesAndRef<{
|
|
15
|
+
title: string;
|
|
16
|
+
description?: string;
|
|
17
|
+
imageUrl?: string;
|
|
18
|
+
read?: boolean;
|
|
19
|
+
date?: Date;
|
|
20
|
+
dateFormat?: (date: Date) => string;
|
|
21
|
+
badges?: NotificationCardBadge[];
|
|
22
|
+
actions?: NotificationCardAction[];
|
|
23
|
+
onClick?: React.EventHandler<React.MouseEvent>;
|
|
24
|
+
children?: never;
|
|
25
|
+
view?: 'user' | 'default';
|
|
26
|
+
actionsMenuOpened?: boolean;
|
|
27
|
+
setVisibleMenu?: (setVisibleMenu: React.Dispatch<React.SetStateAction<boolean>>) => void;
|
|
28
|
+
}, HTMLDivElement>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"types.js"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import _jsx from"@babel/runtime/helpers/jsx";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{useRef,useState,useCallback,useEffect,forwardRef}from"react";import{IconMeatball}from"@consta/uikit/IconMeatball";import{Button}from"@consta/uikit/Button";import{useForkRef}from"@consta/uikit/useForkRef";import{withTooltip}from"@consta/uikit/withTooltip";import{useMutableRef}from"@consta/uikit/useMutableRef";import{withDefaultGetters,menuGetItemLeftSideBar}from"./helpers";import{AnimatedContextMenu}from"../../AnimatedContextMenu/AnimatedContextMenu";const ButtonWithTooltip=withTooltip()(Button),NotificationsActionsRender=(a,b)=>{var c;const d=withDefaultGetters(a),{items:n=[],className:e,children:f,mainButtonOnlyIcon:g,opened:o=!1,onOpen:h,setVisibleMenu:i,getItemIcon:j,getItemLabel:k,getItemOnClick:l,onItemClick:m}=d,p=_objectWithoutProperties(d,["items","className","children","mainButtonOnlyIcon","opened","onOpen","setVisibleMenu","getItemIcon","getItemLabel","getItemOnClick","onItemClick"]),q=useRef(null),[r,s]=useState(o),t=useCallback(()=>s(!1),[]),u=useCallback(()=>s(a=>!a),[]),v=useMutableRef(h),w=useMutableRef(i),x=useForkRef([q,b]),y=a=>b=>{var c;null===m||void 0===m?void 0:m({e:b,item:a}),null===(c=l(a))||void 0===c?void 0:c(b)},z="number"==typeof(null===(c=a.style)||void 0===c?void 0:c.zIndex)?a.style.zIndex+1:void 0;return useEffect(()=>{s(o)},[o]),useEffect(()=>{var a;null===(a=v.current)||void 0===a?void 0:a.call(v,r)},[r,v]),useEffect(()=>{var a;null===(a=w.current)||void 0===a?void 0:a.call(w,s)},[]),1!==n.length||g?1===n.length&&j(n[0])&&g?React.createElement(ButtonWithTooltip,Object.assign({},p,{className:e,size:"xs",view:"clear",iconLeft:j(n[0]),onClick:y(n[0]),tooltipProps:{content:k(n[0])},ref:b})):React.createElement(React.Fragment,null,React.createElement(Button,Object.assign({},p,{className:e,size:"xs",view:"clear",iconLeft:IconMeatball,ref:x,onClick:u})),_jsx(AnimatedContextMenu,{isOpen:r,items:n,getLabel:k,getOnClick:y,getKey:k,getLeftSideBar:menuGetItemLeftSideBar(j),anchorRef:q,onClickOutside:t,possibleDirections:["downStartRight","upStartRight"],direction:"downStartRight",style:{width:280,zIndex:z}})):React.createElement(Button,Object.assign({},p,{className:e,size:"xs",view:"clear",iconLeft:j(n[0]),onClick:y(n[0]),label:k(n[0]),ref:b}))};export const NotificationsActions=forwardRef(NotificationsActionsRender);
|
|
2
|
+
//# sourceMappingURL=NotificationsActions.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/__private__/components/NotificationsActions/NotificationsActions.tsx"],"names":["React","useRef","useState","useCallback","useEffect","forwardRef","IconMeatball","Button","useForkRef","withTooltip","useMutableRef","withDefaultGetters","menuGetItemLeftSideBar","AnimatedContextMenu","ButtonWithTooltip","NotificationsActionsRender","props","ref","items","className","children","mainButtonOnlyIcon","opened","onOpen","onOpenProp","setVisibleMenu","setVisibleMenuProp","getItemIcon","getItemLabel","getItemOnClick","onItemClick","otherProps","buttonRef","visibleMenu","closeMenu","toogleMenu","state","setVisibleMenuRef","menuRef","getOnItemClick","item","e","elementZIndex","style","zIndex","current","length","content","width","NotificationsActions"],"mappings":"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","sourcesContent":["import React, { useRef, useState, useCallback, useEffect, forwardRef } from 'react'\nimport { IconMeatball } from '@consta/uikit/IconMeatball'\nimport { Button } from '@consta/uikit/Button'\n\nimport { useForkRef } from '@consta/uikit/useForkRef'\nimport { withTooltip } from '@consta/uikit/withTooltip'\n\nimport { useMutableRef } from '@consta/uikit/useMutableRef'\n\nimport { NotificationsActionsProps, NotificationsActionsComponent } from './types'\nimport { withDefaultGetters, menuGetItemLeftSideBar } from './helpers'\nimport { AnimatedContextMenu } from '@/__private__/AnimatedContextMenu/AnimatedContextMenu'\n\nconst ButtonWithTooltip = withTooltip()(Button)\n\nconst NotificationsActionsRender = (\n props: NotificationsActionsProps,\n ref: React.Ref<HTMLButtonElement>\n) => {\n const {\n items = [],\n className,\n children,\n mainButtonOnlyIcon,\n opened = false,\n onOpen: onOpenProp,\n setVisibleMenu: setVisibleMenuProp,\n getItemIcon,\n getItemLabel,\n getItemOnClick,\n onItemClick,\n ...otherProps\n } = withDefaultGetters(props)\n const buttonRef = useRef(null)\n\n const [visibleMenu, setVisibleMenu] = useState<boolean>(opened)\n\n const closeMenu = useCallback(() => setVisibleMenu(false), [])\n const toogleMenu = useCallback(() => setVisibleMenu((state?) => !state), [])\n const onOpen = useMutableRef(onOpenProp)\n const setVisibleMenuRef = useMutableRef(setVisibleMenuProp)\n const menuRef = useForkRef([buttonRef, ref])\n\n const getOnItemClick = (item: typeof items[number]) => (e: React.MouseEvent) => {\n onItemClick?.({ e, item })\n getItemOnClick(item)?.(e)\n }\n\n const elementZIndex = typeof props.style?.zIndex === 'number' ? props.style.zIndex + 1 : undefined\n\n useEffect(() => {\n setVisibleMenu(opened)\n }, [opened])\n\n useEffect(() => {\n onOpen.current?.(visibleMenu)\n }, [visibleMenu, onOpen])\n\n useEffect(() => {\n setVisibleMenuRef.current?.(setVisibleMenu)\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n if (items.length === 1 && !mainButtonOnlyIcon) {\n return (\n <Button\n {...otherProps}\n className={className}\n size=\"xs\"\n view=\"clear\"\n iconLeft={getItemIcon(items[0])}\n onClick={getOnItemClick(items[0])}\n label={getItemLabel(items[0])}\n ref={ref}\n />\n )\n }\n\n if (items.length === 1 && getItemIcon(items[0]) && mainButtonOnlyIcon) {\n return (\n <ButtonWithTooltip\n {...otherProps}\n className={className}\n size=\"xs\"\n view=\"clear\"\n iconLeft={getItemIcon(items[0])}\n onClick={getOnItemClick(items[0])}\n tooltipProps={{\n content: getItemLabel(items[0]),\n }}\n ref={ref}\n />\n )\n }\n\n return (\n <>\n <Button\n {...otherProps}\n className={className}\n size=\"xs\"\n view=\"clear\"\n iconLeft={IconMeatball}\n ref={menuRef}\n onClick={toogleMenu}\n />\n <AnimatedContextMenu\n isOpen={visibleMenu}\n items={items}\n getLabel={getItemLabel}\n getOnClick={getOnItemClick}\n getKey={getItemLabel}\n getLeftSideBar={menuGetItemLeftSideBar(getItemIcon)}\n anchorRef={buttonRef}\n onClickOutside={closeMenu}\n possibleDirections={['downStartRight', 'upStartRight']}\n direction=\"downStartRight\"\n style={{ width: 280, zIndex: elementZIndex }}\n />\n </>\n )\n}\n\nexport const NotificationsActions = forwardRef(\n NotificationsActionsRender\n) as NotificationsActionsComponent\n"],"file":"NotificationsActions.js"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { NotificationsActionsProps, NotificationsActionsPropGetItemIcon, NotificationsActionsPropGetItemLabel, NotificationsActionsPropGetItemOnClick, DefaultItem } from "./types";
|
|
3
|
+
export declare function withDefaultGetters<ITEM>(props: NotificationsActionsProps<ITEM>): {
|
|
4
|
+
items?: ITEM[] | undefined;
|
|
5
|
+
mainButtonOnlyIcon?: boolean | undefined;
|
|
6
|
+
opened?: boolean | undefined;
|
|
7
|
+
onOpen?: ((value: boolean) => void) | undefined;
|
|
8
|
+
setVisibleMenu?: ((setVisibleMenu: React.Dispatch<React.SetStateAction<boolean>>) => void) | undefined;
|
|
9
|
+
onItemClick?: import("./types").NotificationsActionsOnItemClick<ITEM> | undefined;
|
|
10
|
+
} & Pick<React.HTMLAttributes<HTMLButtonElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "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" | "onClick" | "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"> & {
|
|
11
|
+
getItemLabel?: NotificationsActionsPropGetItemLabel<ITEM> | undefined;
|
|
12
|
+
getItemOnClick?: NotificationsActionsPropGetItemOnClick<ITEM> | undefined;
|
|
13
|
+
getItemIcon?: NotificationsActionsPropGetItemIcon<ITEM> | undefined;
|
|
14
|
+
} & (ITEM extends {
|
|
15
|
+
label: string;
|
|
16
|
+
} ? {} : {
|
|
17
|
+
getItemLabel: NotificationsActionsPropGetItemLabel<ITEM>;
|
|
18
|
+
}) & {
|
|
19
|
+
getItemIcon: NotificationsActionsPropGetItemIcon<DefaultItem> | NotificationsActionsPropGetItemIcon<ITEM>;
|
|
20
|
+
getItemLabel: NotificationsActionsPropGetItemLabel<DefaultItem> | NotificationsActionsPropGetItemLabel<ITEM>;
|
|
21
|
+
getItemOnClick: NotificationsActionsPropGetItemOnClick<DefaultItem> | NotificationsActionsPropGetItemOnClick<ITEM>;
|
|
22
|
+
};
|
|
23
|
+
export declare function menuGetItemLeftSideBar<ITEM>(getIcon: NotificationsActionsPropGetItemIcon<ITEM>): (item: ITEM) => JSX.Element | undefined;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import _jsx from"@babel/runtime/helpers/jsx";import _objectSpread from"@babel/runtime/helpers/objectSpread";import React from"react";const defaultGetItemIcon=a=>a.icon,defaultGetItemLabel=a=>a.label,defaultGetItemOnClick=a=>a.onClick;export function withDefaultGetters(a){return _objectSpread({},a,{getItemIcon:a.getItemIcon||defaultGetItemIcon,getItemLabel:a.getItemLabel||defaultGetItemLabel,getItemOnClick:a.getItemOnClick||defaultGetItemOnClick})}export function menuGetItemLeftSideBar(a){return b=>{const c=a(b);return c?_jsx(c,{size:"s"}):void 0}}
|
|
2
|
+
//# sourceMappingURL=helpers.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/__private__/components/NotificationsActions/helpers.tsx"],"names":["React","defaultGetItemIcon","item","icon","defaultGetItemLabel","label","defaultGetItemOnClick","onClick","withDefaultGetters","props","getItemIcon","getItemLabel","getItemOnClick","menuGetItemLeftSideBar","getIcon","Icon"],"mappings":"4GAAA,MAAOA,CAAAA,KAAP,KAAkB,OAAlB,C,KAUMC,CAAAA,kBAAoE,CAAGC,CAAI,EAAIA,CAAI,CAACC,I,CACpFC,mBAAsE,CAAGF,CAAI,EAAIA,CAAI,CAACG,K,CACtFC,qBAA0E,CAAGJ,CAAI,EACrFA,CAAI,CAACK,O,CAEP,MAAO,SAASC,CAAAA,kBAAT,CAAkCC,CAAlC,CAA0E,CAC/E,wBACKA,CADL,EAEEC,WAAW,CAAED,CAAK,CAACC,WAAN,EAAqBT,kBAFpC,CAGEU,YAAY,CAAEF,CAAK,CAACE,YAAN,EAAsBP,mBAHtC,CAIEQ,cAAc,CAAEH,CAAK,CAACG,cAAN,EAAwBN,qBAJ1C,EAMD,CAED,MAAO,SAASO,CAAAA,sBAAT,CAAsCC,CAAtC,CAA0F,CAC/F,MAAQZ,CAAAA,CAAD,EAAgB,CACrB,KAAMa,CAAAA,CAAI,CAAGD,CAAO,CAACZ,CAAD,CAApB,CADqB,MAGhBa,CAAAA,CAHgB,CAOd,KAAC,CAAD,EAAM,IAAI,CAAC,GAAX,EAPc,OAQtB,CACF","sourcesContent":["import React from 'react'\n\nimport {\n NotificationsActionsProps,\n NotificationsActionsPropGetItemIcon,\n NotificationsActionsPropGetItemLabel,\n NotificationsActionsPropGetItemOnClick,\n DefaultItem,\n} from './types'\n\nconst defaultGetItemIcon: NotificationsActionsPropGetItemIcon<DefaultItem> = item => item.icon\nconst defaultGetItemLabel: NotificationsActionsPropGetItemLabel<DefaultItem> = item => item.label\nconst defaultGetItemOnClick: NotificationsActionsPropGetItemOnClick<DefaultItem> = item =>\n item.onClick\n\nexport function withDefaultGetters<ITEM>(props: NotificationsActionsProps<ITEM>) {\n return {\n ...props,\n getItemIcon: props.getItemIcon || defaultGetItemIcon,\n getItemLabel: props.getItemLabel || defaultGetItemLabel,\n getItemOnClick: props.getItemOnClick || defaultGetItemOnClick,\n }\n}\n\nexport function menuGetItemLeftSideBar<ITEM>(getIcon: NotificationsActionsPropGetItemIcon<ITEM>) {\n return (item: ITEM) => {\n const Icon = getIcon(item)\n\n if (!Icon) {\n return undefined\n }\n\n return <Icon size=\"s\" />\n }\n}\n"],"file":"helpers.js"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./NotificationsActions";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/__private__/components/NotificationsActions/index.ts"],"names":[],"mappings":"AAAA","sourcesContent":["export * from './NotificationsActions'\n"],"file":"index.js"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { PropsWithHTMLAttributes } from "../../utils/types/PropsWithHTMLAttributes";
|
|
3
|
+
import { IconComponent } from '@consta/uikit/Icon';
|
|
4
|
+
export declare type DefaultItem = {
|
|
5
|
+
label: string;
|
|
6
|
+
onClick?: React.EventHandler<React.MouseEvent>;
|
|
7
|
+
icon?: IconComponent;
|
|
8
|
+
};
|
|
9
|
+
export declare type NotificationsActionsPropGetItemLabel<ITEM> = (item: ITEM) => string;
|
|
10
|
+
export declare type NotificationsActionsPropGetItemIcon<ITEM> = (item: ITEM) => IconComponent | undefined;
|
|
11
|
+
export declare type NotificationsActionsPropGetItemOnClick<ITEM> = (item: ITEM) => React.EventHandler<React.MouseEvent> | undefined;
|
|
12
|
+
export declare type NotificationsActionsOnItemClick<ITEM> = (props: {
|
|
13
|
+
e: React.MouseEvent;
|
|
14
|
+
item: ITEM;
|
|
15
|
+
}) => void;
|
|
16
|
+
export declare type NotificationsActionsProps<ITEM = DefaultItem> = PropsWithHTMLAttributes<{
|
|
17
|
+
items?: ITEM[];
|
|
18
|
+
mainButtonOnlyIcon?: boolean;
|
|
19
|
+
opened?: boolean;
|
|
20
|
+
onOpen?: (value: boolean) => void;
|
|
21
|
+
setVisibleMenu?: (setVisibleMenu: React.Dispatch<React.SetStateAction<boolean>>) => void;
|
|
22
|
+
onItemClick?: NotificationsActionsOnItemClick<ITEM>;
|
|
23
|
+
}, HTMLButtonElement> & {
|
|
24
|
+
getItemLabel?: NotificationsActionsPropGetItemLabel<ITEM>;
|
|
25
|
+
getItemOnClick?: NotificationsActionsPropGetItemOnClick<ITEM>;
|
|
26
|
+
getItemIcon?: NotificationsActionsPropGetItemIcon<ITEM>;
|
|
27
|
+
} & (ITEM extends {
|
|
28
|
+
label: DefaultItem['label'];
|
|
29
|
+
} ? {} : {
|
|
30
|
+
getItemLabel: NotificationsActionsPropGetItemLabel<ITEM>;
|
|
31
|
+
});
|
|
32
|
+
export declare type NotificationsActionsComponent = <ITEM = DefaultItem>(props: NotificationsActionsProps<ITEM>) => React.ReactElement | null;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"types.js"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.che--Sidebar-Header{display:flex;align-items:flex-end;flex:none;justify-content:space-between;padding:var(--space-l) var(--space-xl);border-bottom:1px solid var(--color-bg-border)}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import './Sidebar.css';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { Sidebar as ConstaSidebar } from '@consta/uikit/Sidebar';
|
|
4
|
+
declare type SidebarProps = Omit<React.ComponentProps<typeof ConstaSidebar>, 'position' | 'onClose'> & {
|
|
5
|
+
title?: string;
|
|
6
|
+
onClose?: React.EventHandler<React.MouseEvent>;
|
|
7
|
+
};
|
|
8
|
+
export declare const Sidebar: (props: SidebarProps) => JSX.Element;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import _jsx from"@babel/runtime/helpers/jsx";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import"./Sidebar.css";import React from"react";import{Sidebar as ConstaSidebar}from"@consta/uikit/Sidebar";import{useBreakpoints}from"@consta/uikit/useBreakpoints";import{Text}from"@consta/uikit/Text";import{Button}from"@consta/uikit/Button";import{IconClose}from"@consta/uikit/IconClose";import{cn}from"../../utils/bem";const cnSidebar=cn("Sidebar");export const Sidebar=a=>{const{children:b,title:c,onClose:d,className:e}=a,f=_objectWithoutProperties(a,["children","title","onClose","className"]),{bigScreen:g}=useBreakpoints({bigScreen:520});return React.createElement(ConstaSidebar,Object.assign({},f,{position:g?"right":"bottom",size:g?"l":"full",className:cnSidebar(null,[e])}),(c||d)&&_jsx("div",{className:cnSidebar("Header")},void 0,_jsx(Text,{className:cnSidebar("Title"),size:"xl",truncate:!0},void 0,c),d&&_jsx(Button,{size:"s",view:"clear",iconLeft:IconClose,onClick:d})),b)};
|
|
2
|
+
//# sourceMappingURL=Sidebar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/__private__/components/Sidebar/Sidebar.tsx"],"names":["React","Sidebar","ConstaSidebar","useBreakpoints","Text","Button","IconClose","cn","cnSidebar","props","children","title","onClose","className","otherProps","bigScreen"],"mappings":"kIAAA,sBAEA,MAAOA,CAAAA,KAAP,KAAkB,OAAlB,CACA,OAASC,OAAO,GAAIC,CAAAA,aAApB,KAAyC,uBAAzC,CACA,OAASC,cAAT,KAA+B,8BAA/B,CACA,OAASC,IAAT,KAAqB,oBAArB,CACA,OAASC,MAAT,KAAuB,sBAAvB,CACA,OAASC,SAAT,KAA0B,yBAA1B,CACA,OAASC,EAAT,uBAOA,KAAMC,CAAAA,SAAS,CAAGD,EAAE,CAAC,SAAD,CAApB,CAEA,MAAO,MAAMN,CAAAA,OAAO,CAAIQ,CAAD,EAAyB,MACxC,CAAEC,QAAQ,CAARA,CAAF,CAAYC,KAAK,CAALA,CAAZ,CAAmBC,OAAO,CAAPA,CAAnB,CAA4BC,SAAS,CAATA,CAA5B,EAAyDJ,CADjB,CACEK,CADF,0BACiBL,CADjB,6CAExC,CAAEM,SAAS,CAATA,CAAF,EAAgBZ,cAAc,CAAC,CAAEY,SAAS,CAAE,GAAb,CAAD,CAFU,CAG9C,MACE,qBAAC,aAAD,kBACMD,CADN,EAEE,QAAQ,CAAEC,CAAS,CAAG,OAAH,CAAa,QAFlC,CAGE,IAAI,CAAEA,CAAS,CAAG,GAAH,CAAS,MAH1B,CAIE,SAAS,CAAEP,SAAS,CAAC,IAAD,CAAO,CAACK,CAAD,CAAP,CAJtB,GAMG,CAACF,CAAK,EAAIC,CAAV,GACC,YAAK,SAAS,CAAEJ,SAAS,CAAC,QAAD,CAAzB,SACE,KAAC,IAAD,EAAM,SAAS,CAAEA,SAAS,CAAC,OAAD,CAA1B,CAAqC,IAAI,CAAC,IAA1C,CAA+C,QAAQ,GAAvD,SACGG,CADH,CADF,CAIGC,CAAO,EAAI,KAAC,MAAD,EAAQ,IAAI,CAAC,GAAb,CAAiB,IAAI,CAAC,OAAtB,CAA8B,QAAQ,CAAEN,SAAxC,CAAmD,OAAO,CAAEM,CAA5D,EAJd,CAPJ,CAeGF,CAfH,CAkBH,CAtBM","sourcesContent":["import './Sidebar.css'\n\nimport React from 'react'\nimport { Sidebar as ConstaSidebar } from '@consta/uikit/Sidebar'\nimport { useBreakpoints } from '@consta/uikit/useBreakpoints'\nimport { Text } from '@consta/uikit/Text'\nimport { Button } from '@consta/uikit/Button'\nimport { IconClose } from '@consta/uikit/IconClose'\nimport { cn } from '@/__private__/utils/bem'\n\ntype SidebarProps = Omit<React.ComponentProps<typeof ConstaSidebar>, 'position' | 'onClose'> & {\n title?: string\n onClose?: React.EventHandler<React.MouseEvent>\n}\n\nconst cnSidebar = cn('Sidebar')\n\nexport const Sidebar = (props: SidebarProps) => {\n const { children, title, onClose, className, ...otherProps } = props\n const { bigScreen } = useBreakpoints({ bigScreen: 520 })\n return (\n <ConstaSidebar\n {...otherProps}\n position={bigScreen ? 'right' : 'bottom'}\n size={bigScreen ? 'l' : 'full'}\n className={cnSidebar(null, [className])}\n >\n {(title || onClose) && (\n <div className={cnSidebar('Header')}>\n <Text className={cnSidebar('Title')} size=\"xl\" truncate>\n {title}\n </Text>\n {onClose && <Button size=\"s\" view=\"clear\" iconLeft={IconClose} onClick={onClose} />}\n </div>\n )}\n\n {children}\n </ConstaSidebar>\n )\n}\n"],"file":"Sidebar.js"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./Sidebar";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/__private__/components/Sidebar/index.ts"],"names":[],"mappings":"AAAA","sourcesContent":["export * from './Sidebar'\n"],"file":"index.js"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const useHideElementsLine: <ELEMENT extends HTMLElement, WRAPPER_ELEMENT extends HTMLElement, ITEM>(items: ITEM[]) => {
|
|
3
|
+
visibleItems: ITEM[];
|
|
4
|
+
hiddenItems: ITEM[];
|
|
5
|
+
itemsRefs: import("react").RefObject<ELEMENT>[];
|
|
6
|
+
wrapperRef: import("react").RefObject<WRAPPER_ELEMENT>;
|
|
7
|
+
moreRef: import("react").RefObject<ELEMENT> | undefined;
|
|
8
|
+
};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{createRef,useMemo,useRef}from"react";import{useResizeObserved}from"@consta/uikit/useResizeObserved";import{useComponentSize}from"@consta/uikit/useComponentSize";const useCreateRefs=a=>useMemo(()=>Array(a.length+1).fill(null).map(()=>createRef()),[a]);export const useHideElementsLine=a=>{const b=useCreateRefs(a),c=useRef(null),d=useComponentSize(c).width,e=[...b],f=e.pop(),g=useResizeObserved(b,a=>({size:(null===a||void 0===a?void 0:a.offsetWidth)||0,gap:a?parseInt(getComputedStyle(a).marginRight,10):0})),h=[],i=[];if(d){var j;let b=(null===(j=g[g.length-1])||void 0===j?void 0:j.size)||0;for(let c=0;c<g.length;c++){if(b=b+g[c].size+g[c].gap,b>=d){a[c]&&i.push(a[c]);continue}h.push(a[c])}}return{visibleItems:h,hiddenItems:i,itemsRefs:e,wrapperRef:c,moreRef:f}};
|
|
2
|
+
//# sourceMappingURL=useHideElementsLine.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/__private__/hooks/useHideElementsLine.ts"],"names":["createRef","useMemo","useRef","useResizeObserved","useComponentSize","useCreateRefs","items","Array","length","fill","map","useHideElementsLine","refs","wrapperRef","wrapperWidth","width","itemsRefs","moreRef","pop","itemsDimensions","el","size","offsetWidth","gap","parseInt","getComputedStyle","marginRight","visibleItems","hiddenItems","calcWidth","index","push"],"mappings":"AAAA,OAASA,SAAT,CAAoBC,OAApB,CAA6BC,MAA7B,KAA2C,OAA3C,CAEA,OAASC,iBAAT,KAAkC,iCAAlC,CACA,OAASC,gBAAT,KAAiC,gCAAjC,CAEA,KAAMC,CAAAA,aAAa,CAAiCC,CAA9B,EACpBL,OAAO,CAAC,IAAUM,KAAJ,CAAUD,CAAK,CAACE,MAAN,CAAe,CAAzB,EAA4BC,IAA5B,CAAiC,IAAjC,EAAuCC,GAAvC,CAA2C,IAAMV,SAAS,EAA1D,CAAP,CAA+E,CAACM,CAAD,CAA/E,CADT,CAQA,MAAO,MAAMK,CAAAA,mBAAmB,CAK9BL,CALiC,EAY9B,MACGM,CAAAA,CAAI,CAAGP,aAAa,CAAUC,CAAV,CADvB,CAEGO,CAAU,CAAGX,MAAM,CAAkB,IAAlB,CAFtB,CAGGY,CAAY,CAAGV,gBAAgB,CAACS,CAAD,CAAhB,CAA6BE,KAH/C,CAIGC,CAAS,CAAG,CAAC,GAAGJ,CAAJ,CAJf,CAKGK,CAAO,CAAGD,CAAS,CAACE,GAAV,EALb,CAOGC,CAAe,CAAGhB,iBAAiB,CACvCS,CADuC,CAEtCQ,CAAD,GACS,CACLC,IAAI,CAAE,QAAAD,CAAE,WAAFA,SAAAA,CAAE,CAAEE,WAAJ,GAAmB,CADpB,CAELC,GAAG,CAAEH,CAAE,CAAGI,QAAQ,CAACC,gBAAgB,CAACL,CAAD,CAAhB,CAAqBM,WAAtB,CAAmC,EAAnC,CAAX,CAAoD,CAFtD,CADT,CAFuC,CAPtC,CAiBGC,CAAoB,CAAG,EAjB1B,CAkBGC,CAAmB,CAAG,EAlBzB,CAoBH,GAAId,CAAJ,CAAkB,OAChB,GAAIe,CAAAA,CAAS,CAAG,WAAAV,CAAe,CAACA,CAAe,CAACX,MAAhB,CAAyB,CAA1B,CAAf,uBAA6Ca,IAA7C,GAAqD,CAArE,CAEA,IAAK,GAAIS,CAAAA,CAAK,CAAG,CAAjB,CAAoBA,CAAK,CAAGX,CAAe,CAACX,MAA5C,CAAoDsB,CAAK,EAAzD,CAA6D,CAG3D,GAFAD,CAAS,CAAGA,CAAS,CAAGV,CAAe,CAACW,CAAD,CAAf,CAAuBT,IAAnC,CAA0CF,CAAe,CAACW,CAAD,CAAf,CAAuBP,GAE7E,CAAIM,CAAS,EAAIf,CAAjB,CAA+B,CAC7BR,CAAK,CAACwB,CAAD,CAAL,EAAgBF,CAAW,CAACG,IAAZ,CAAiBzB,CAAK,CAACwB,CAAD,CAAtB,CADa,CAE7B,QACD,CACDH,CAAY,CAACI,IAAb,CAAkBzB,CAAK,CAACwB,CAAD,CAAvB,CACD,CACF,CAED,MAAO,CAAEH,YAAY,CAAZA,CAAF,CAAgBC,WAAW,CAAXA,CAAhB,CAA6BZ,SAAS,CAATA,CAA7B,CAAwCH,UAAU,CAAVA,CAAxC,CAAoDI,OAAO,CAAPA,CAApD,CACR,CA/CM","sourcesContent":["import { createRef, useMemo, useRef } from 'react'\n\nimport { useResizeObserved } from '@consta/uikit/useResizeObserved'\nimport { useComponentSize } from '@consta/uikit/useComponentSize'\n\nconst useCreateRefs = <ELEMENT extends HTMLElement>(items: unknown[]) =>\n useMemo(() => new Array(items.length + 1).fill(null).map(() => createRef<ELEMENT>()), [items])\n\ntype ItemDimensions = {\n size: number\n gap: number\n}\n\nexport const useHideElementsLine = <\n ELEMENT extends HTMLElement,\n WRAPPER_ELEMENT extends HTMLElement,\n ITEM\n>(\n items: ITEM[]\n): {\n visibleItems: ITEM[]\n hiddenItems: ITEM[]\n itemsRefs: Array<React.RefObject<ELEMENT>>\n wrapperRef: React.RefObject<WRAPPER_ELEMENT>\n moreRef: React.RefObject<ELEMENT> | undefined\n} => {\n const refs = useCreateRefs<ELEMENT>(items)\n const wrapperRef = useRef<WRAPPER_ELEMENT>(null)\n const wrapperWidth = useComponentSize(wrapperRef).width\n const itemsRefs = [...refs]\n const moreRef = itemsRefs.pop()\n\n const itemsDimensions = useResizeObserved(\n refs,\n (el): ItemDimensions => {\n return {\n size: el?.offsetWidth || 0,\n gap: el ? parseInt(getComputedStyle(el).marginRight, 10) : 0,\n }\n }\n )\n\n const visibleItems: ITEM[] = []\n const hiddenItems: ITEM[] = []\n\n if (wrapperWidth) {\n let calcWidth = itemsDimensions[itemsDimensions.length - 1]?.size || 0\n\n for (let index = 0; index < itemsDimensions.length; index++) {\n calcWidth = calcWidth + itemsDimensions[index].size + itemsDimensions[index].gap\n\n if (calcWidth >= wrapperWidth) {\n items[index] && hiddenItems.push(items[index])\n continue\n }\n visibleItems.push(items[index])\n }\n }\n\n return { visibleItems, hiddenItems, itemsRefs, wrapperRef, moreRef }\n}\n"],"file":"useHideElementsLine.js"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.che--MixPopoverAnimate_animate_enter,.che--MixPopoverAnimate_animate_enterActive{opacity:0;transform:translateY(var(--space-s))}.che--MixPopoverAnimate_animate_enterDone{opacity:1;transition:opacity .2s,transform .2s;transform:translate(0)}.che--MixPopoverAnimate_animate_exit{opacity:1;transform:translate(0)}.che--MixPopoverAnimate_animate_exitActive,.che--MixPopoverAnimate_animate_exitDone{opacity:0;transition:opacity .2s,transform .2s;transform:translateY(var(--space-s))}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import './MixPopoverAnimate.css';
|
|
2
|
+
export declare const cnMixPopoverAnimate: import("@bem-react/classname").ClassNameFormatter;
|
|
3
|
+
export declare const cnMixPopoverAnimateForCssTransition: import("@consta/uikit/__internal__/src/utils/cnForCssTransition").CSSTransitionClassNames;
|
|
4
|
+
export declare const animateTimeout = 200;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import"./MixPopoverAnimate.css";import{cnForCssTransition}from"@consta/uikit/__internal__/src/utils/cnForCssTransition";import{cn}from"../../utils/bem";export const cnMixPopoverAnimate=cn("MixPopoverAnimate");export const cnMixPopoverAnimateForCssTransition=cnForCssTransition(cnMixPopoverAnimate);export const animateTimeout=200;
|
|
2
|
+
//# sourceMappingURL=MixPopoverAnimate.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/__private__/mixs/MixPopoverAnimate/MixPopoverAnimate.tsx"],"names":["cnForCssTransition","cn","cnMixPopoverAnimate","cnMixPopoverAnimateForCssTransition","animateTimeout"],"mappings":"AAAA,gCACA,OAASA,kBAAT,KAAmC,yDAAnC,CAEA,OAASC,EAAT,uBAEA,MAAO,MAAMC,CAAAA,mBAAmB,CAAGD,EAAE,CAAC,mBAAD,CAA9B,CACP,MAAO,MAAME,CAAAA,mCAAmC,CAAGH,kBAAkB,CAACE,mBAAD,CAA9D,CACP,MAAO,MAAME,CAAAA,cAAc,CAAG,GAAvB","sourcesContent":["import './MixPopoverAnimate.css'\nimport { cnForCssTransition } from '@consta/uikit/__internal__/src/utils/cnForCssTransition'\n\nimport { cn } from '@/__private__/utils/bem'\n\nexport const cnMixPopoverAnimate = cn('MixPopoverAnimate')\nexport const cnMixPopoverAnimateForCssTransition = cnForCssTransition(cnMixPopoverAnimate)\nexport const animateTimeout = 200\n"],"file":"MixPopoverAnimate.js"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.che--MixPopoverArrow{position:absolute;border:var(--popover-arrow-size) solid transparent}.che--MixPopoverArrow_direction_upCenter,.che--MixPopoverArrow_direction_upLeft,.che--MixPopoverArrow_direction_upRight,.che--MixPopoverArrow_direction_upStartLeft,.che--MixPopoverArrow_direction_upStartRight{bottom:0;border-top-color:var(--popover-arrow-bg-color);transform:translateY(100%)}.che--MixPopoverArrow_direction_downLeft,.che--MixPopoverArrow_direction_downStartRight,.che--MixPopoverArrow_direction_upLeft,.che--MixPopoverArrow_direction_upStartRight{right:var(--popover-arrow-offset)}.che--MixPopoverArrow_direction_downCenter,.che--MixPopoverArrow_direction_upCenter{left:calc(50% - var(--popover-arrow-size))}.che--MixPopoverArrow_direction_downRight,.che--MixPopoverArrow_direction_downStartLeft,.che--MixPopoverArrow_direction_upRight,.che--MixPopoverArrow_direction_upStartLeft{left:var(--popover-arrow-offset)}.che--MixPopoverArrow_direction_downCenter,.che--MixPopoverArrow_direction_downLeft,.che--MixPopoverArrow_direction_downRight,.che--MixPopoverArrow_direction_downStartLeft,.che--MixPopoverArrow_direction_downStartRight{top:0;border-bottom-color:var(--popover-arrow-bg-color);transform:translateY(-100%)}.che--MixPopoverArrow_direction_rightCenter,.che--MixPopoverArrow_direction_rightDown,.che--MixPopoverArrow_direction_rightStartDown,.che--MixPopoverArrow_direction_rightStartUp,.che--MixPopoverArrow_direction_rightUp{left:0;border-right-color:var(--popover-arrow-bg-color);transform:translateX(-100%)}.che--MixPopoverArrow_direction_leftStartDown,.che--MixPopoverArrow_direction_leftUp,.che--MixPopoverArrow_direction_rightStartDown,.che--MixPopoverArrow_direction_rightUp{bottom:var(--popover-arrow-offset)}.che--MixPopoverArrow_direction_leftCenter,.che--MixPopoverArrow_direction_rightCenter{top:calc(50% - var(--popover-arrow-size))}.che--MixPopoverArrow_direction_leftDown,.che--MixPopoverArrow_direction_leftStartUp,.che--MixPopoverArrow_direction_rightDown,.che--MixPopoverArrow_direction_rightStartUp{top:var(--popover-arrow-offset)}.che--MixPopoverArrow_direction_leftCenter,.che--MixPopoverArrow_direction_leftDown,.che--MixPopoverArrow_direction_leftStartDown,.che--MixPopoverArrow_direction_leftStartUp,.che--MixPopoverArrow_direction_leftUp{right:0;border-left-color:var(--popover-arrow-bg-color);transform:translateX(100%)}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import './MixPopoverArrow.css';
|
|
2
|
+
import { Direction } from '@consta/uikit/Popover';
|
|
3
|
+
declare type Props = {
|
|
4
|
+
direction?: Direction;
|
|
5
|
+
};
|
|
6
|
+
declare type CnMixPopoverArrow = (elemNameOrBlockMods?: Props | string | null, elemModsOrBlockMix?: Props | Array<string | undefined> | null, elemMix?: Array<string | undefined>) => string;
|
|
7
|
+
export declare const cnMixPopoverArrow: CnMixPopoverArrow;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/__private__/mixs/MixPopoverArrow/MixPopoverArrow.tsx"],"names":["cn","cnMixPopoverArrow"],"mappings":"AAAA,8BAGA,OAASA,EAAT,uBAYA,MAAO,MAAMC,CAAAA,iBAAoC,CAAGD,EAAE,CAAC,iBAAD,CAA/C","sourcesContent":["import './MixPopoverArrow.css'\nimport { Direction } from '@consta/uikit/Popover'\n\nimport { cn } from '@/__private__/utils/bem'\n\ntype Props = {\n direction?: Direction\n}\n\ntype CnMixPopoverArrow = (\n elemNameOrBlockMods?: Props | string | null,\n elemModsOrBlockMix?: Props | Array<string | undefined> | null,\n elemMix?: Array<string | undefined>\n) => string\n\nexport const cnMixPopoverArrow: CnMixPopoverArrow = cn('MixPopoverArrow')\n"],"file":"MixPopoverArrow.js"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const cn: import("@bem-react/classname").ClassNameInitilizer;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/__private__/utils/bem.ts"],"names":["withNaming","cn","n","e","m"],"mappings":"AAAA,OAASA,UAAT,KAA2B,sBAA3B,CAEA,MAAO,MAAMC,CAAAA,EAAE,CAAGD,UAAU,CAAC,CAAEE,CAAC,CAAE,OAAL,CAAcC,CAAC,CAAE,GAAjB,CAAsBC,CAAC,CAAE,GAAzB,CAAD,CAArB","sourcesContent":["import { withNaming } from '@bem-react/classname'\n\nexport const cn = withNaming({ n: 'che--', e: '-', m: '_' })\n"],"file":"bem.js"}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare type PropsWithHTMLAttributes<Props, HTMLElement> = Props & Omit<React.HTMLAttributes<HTMLElement>, keyof Props | 'css'>;
|
|
3
|
+
export declare type PropsWithHTMLAttributesAndRef<Props, HTMLElement> = PropsWithHTMLAttributes<Props, HTMLElement> & React.RefAttributes<HTMLElement>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"PropsWithHTMLAttributes.js"}
|
package/package.json
ADDED
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@consta/header",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"files": [
|
|
5
|
+
"*",
|
|
6
|
+
"!*.css.d.ts",
|
|
7
|
+
"!**/__private__/storybook",
|
|
8
|
+
"!**/storybook",
|
|
9
|
+
"!**/__mocks__",
|
|
10
|
+
"!**/__stories__",
|
|
11
|
+
"!**/__tests__",
|
|
12
|
+
"!**/*.test.d.ts",
|
|
13
|
+
"!**/*.spec.d.ts",
|
|
14
|
+
"!**/*.mock.d.ts",
|
|
15
|
+
"!**/*.stories.d.ts"
|
|
16
|
+
],
|
|
17
|
+
"publishConfig": {
|
|
18
|
+
"access": "public"
|
|
19
|
+
},
|
|
20
|
+
"peerDependencies": {
|
|
21
|
+
"@consta/uikit": "^3.14.0"
|
|
22
|
+
},
|
|
23
|
+
"dependencies": {
|
|
24
|
+
"@bem-react/classname": "^1.5.8",
|
|
25
|
+
"date-fns": "^2.17.0",
|
|
26
|
+
"react-transition-group": "^4.4.2"
|
|
27
|
+
},
|
|
28
|
+
"resolutions": {
|
|
29
|
+
"@types/react": "16.9.34",
|
|
30
|
+
"react": "16.8.6",
|
|
31
|
+
"react-dom": "16.8.6"
|
|
32
|
+
},
|
|
33
|
+
"config": {
|
|
34
|
+
"commitizen": {
|
|
35
|
+
"path": "./node_modules/cz-customizable"
|
|
36
|
+
},
|
|
37
|
+
"cz-customizable": {
|
|
38
|
+
"config": "./commitizen.js"
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
}
|