@consta/header 0.1.0 → 0.2.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/Header/Header.css +1 -1
- package/Header/Header.js +1 -1
- package/Header/Header.js.map +1 -1
- package/Header/types.d.ts +17 -2
- package/Layout/Layout.js +1 -1
- package/Layout/Layout.js.map +1 -1
- package/Menu/Menu.js +1 -1
- package/Menu/Menu.js.map +1 -1
- package/__private__/AnimatedContextMenu/AnimatedContextMenu.css +1 -1
- package/package.json +2 -2
package/Header/Header.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.che--Header-Logo{flex:none}.che--Header-Menu{flex:1}.che--Header-RowCenterLeft{display:flex;align-items:center;grid-gap:var(--space-2xl);gap:var(--space-2xl)}.che--Header-RowCenterLeft_breakpoint_m{width:100%}.che--Header-RowCenterRight{display:flex;align-items:center;flex-direction:row-reverse;width:100%;grid-gap:var(--space-l);gap:var(--space-l)}.che--Header-NotificationsList_breakpoint_m,.che--Header-TileMenuList_breakpoint_m{max-height:60vh}.che--Header-RowCenterLeftMobile{display:flex;align-items:center;grid-gap:var(--space-2xl);gap:var(--space-2xl)}.che--Header-MobileMenuHeader{display:flex;flex-wrap:wrap;justify-content:space-between;margin:var(--space-s) var(--space-l);grid-gap:var(--space-s);gap:var(--space-s)}
|
|
1
|
+
.che--Header .che--Layout-Row_botton .che--LayoutRow-Side_position_left{width:100%}.che--Header_fixed{position:fixed;top:0;left:0;width:100%}.che--Header-Logo{flex:none}.che--Header-Menu{flex:1}.che--Header-RowCenterLeft{display:flex;align-items:center;grid-gap:var(--space-2xl);gap:var(--space-2xl)}.che--Header-RowCenterLeft_breakpoint_m{width:100%}.che--Header-RowCenterRight{display:flex;align-items:center;flex-direction:row-reverse;width:100%;grid-gap:var(--space-l);gap:var(--space-l)}.che--Header-NotificationsList_breakpoint_m,.che--Header-TileMenuList_breakpoint_m{max-height:60vh}.che--Header-RowCenterLeftMobile{display:flex;align-items:center;grid-gap:var(--space-2xl);gap:var(--space-2xl)}.che--Header-MobileMenuHeader{display:flex;flex-wrap:wrap;justify-content:space-between;margin:var(--space-s) var(--space-l);grid-gap:var(--space-s);gap:var(--space-s)}.che--Header-Breadcrumbs{width:100%}
|
package/Header/Header.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import _jsx from"@babel/runtime/helpers/jsx";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{forwardRef}from"react";import{cn}from"../__private__/utils/bem";import{Layout}from"../Layout";import{Menu}from"../Menu";import{HeaderLogo}from"./HeaderLogo";import{HeaderLogin}from"./HeaderLogin";import{Notifications}from"../Notifications";import{TileMenu}from"../TileMenu";import{useBreakpoints}from"@consta/uikit/useBreakpoints";import{MobileMenu}from"../MobileMenu";import"./Header.css";export const cnHeader=cn("Header");const HeaderRender=(a,b)=>{var c;const{className:d,
|
|
1
|
+
import _jsx from"@babel/runtime/helpers/jsx";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{forwardRef}from"react";import{cn}from"../__private__/utils/bem";import{Layout}from"../Layout";import{Menu}from"../Menu";import{HeaderLogo}from"./HeaderLogo";import{HeaderLogin}from"./HeaderLogin";import{Notifications}from"../Notifications";import{TileMenu}from"../TileMenu";import{useBreakpoints}from"@consta/uikit/useBreakpoints";import{MobileMenu}from"../MobileMenu";import{Breadcrumbs}from"@consta/uikit/BreadcrumbsCanary";import"./Header.css";export const cnHeader=cn("Header");const HeaderRender=(a,b)=>{var c;const{className:d,fixed:e,logo:f,onLogoClick:g,logoHref:h,menu:i,getMenuItemActive:j,getMenuItemHref:k,getMenuItemLabel:l,getMenuItemOnClick:m,getMenuItemSubMenu:n,getMenuItemTarget:o,onMenuItemClick:p,userName:q,userAvatar:r,userInfo:s,userLogined:t,onLoginButtonClick:u,loginButtonLabel:v,notifications:w,notificationsDateFormat:x,notificationsTitle:y,notificationsActions:z,notificationsGroupByDay:A,notificationsGroupLabelFormat:B,notificationsGroups:C,getNotificationsItemLabel:D,getNotificationsItemDescription:E,getNotificationsItemImage:F,getNotificationsItemRead:G,getNotificationsItemDate:H,getNotificationsItemBadges:I,getNotificationsItemActions:J,getNotificationsItemGroup:K,getNotificationsItemView:L,getNotificationsActionLabel:M,getNotificationsActionIcon:N,getNotificationsActionOnClick:O,getNotificationsGroupLabel:P,getNotificationsGroupId:Q,tileMenu:R,tileMenuView:S,onTileMenuItemClick:T,getTileMenuItemDescription:U,getTileMenuItemHref:V,getTileMenuItemImage:W,getTileMenuItemOnClick:X,getTileMenuItemTitle:Y,tileMenuTitle:Z,breadcrumbs:$,breadcrumbsOnlyIconRoot:_,onBreadcrumbsItemClick:aa,getBreadcrumbsItemLabel:ba,getBreadcrumbsItemHref:ca,getBreadcrumbsItemIcon:da,getBreadcrumbsItemOnClick:ea,breadcrumbsLastItemIsLink:fa,breadcrumbsFitMode:ga}=a,ha=_objectWithoutProperties(a,["className","fixed","logo","onLogoClick","logoHref","menu","getMenuItemActive","getMenuItemHref","getMenuItemLabel","getMenuItemOnClick","getMenuItemSubMenu","getMenuItemTarget","onMenuItemClick","userName","userAvatar","userInfo","userLogined","onLoginButtonClick","loginButtonLabel","notifications","notificationsDateFormat","notificationsTitle","notificationsActions","notificationsGroupByDay","notificationsGroupLabelFormat","notificationsGroups","getNotificationsItemLabel","getNotificationsItemDescription","getNotificationsItemImage","getNotificationsItemRead","getNotificationsItemDate","getNotificationsItemBadges","getNotificationsItemActions","getNotificationsItemGroup","getNotificationsItemView","getNotificationsActionLabel","getNotificationsActionIcon","getNotificationsActionOnClick","getNotificationsGroupLabel","getNotificationsGroupId","tileMenu","tileMenuView","onTileMenuItemClick","getTileMenuItemDescription","getTileMenuItemHref","getTileMenuItemImage","getTileMenuItemOnClick","getTileMenuItemTitle","tileMenuTitle","breadcrumbs","breadcrumbsOnlyIconRoot","onBreadcrumbsItemClick","getBreadcrumbsItemLabel","getBreadcrumbsItemHref","getBreadcrumbsItemIcon","getBreadcrumbsItemOnClick","breadcrumbsLastItemIsLink","breadcrumbsFitMode"]),ia=useBreakpoints({s:800,m:1200}),ja="number"==typeof(null===(c=a.style)||void 0===c?void 0:c.zIndex)?a.style.zIndex:void 0;return ia.m?React.createElement(Layout,Object.assign({},ha,{ref:b,className:cnHeader({fixed:e},[d]),rowCenter:{left:_jsx("div",{className:cnHeader("RowCenterLeft",{breakpoint:"m"})},void 0,_jsx(HeaderLogo,{className:cnHeader("Logo"),logo:f,href:h}),i&&_jsx(Menu,{className:cnHeader("Menu"),items:i,getItemActive:j,getItemHref:k,getItemLabel:l,getItemOnClick:m,getItemSubMenu:n,getItemTarget:o,onItemClick:p,style:{zIndex:ja}})),right:_jsx("div",{className:cnHeader("RowCenterRight")},void 0,_jsx(HeaderLogin,{userName:q,userAvatar:r,userInfo:s,userLogined:t,onLoginButtonClick:u,loginButtonLabel:v}),(null===R||void 0===R?void 0:R.length)&&_jsx(TileMenu,{items:R,view:S,onItemClick:T,getItemDescription:U,getItemHref:V,getItemImage:W,getItemOnClick:X,getItemTitle:Y,listClassName:cnHeader("TileMenuList",{breakpoint:"m"}),title:Z,style:{zIndex:ja}}),(null===w||void 0===w?void 0:w.length)&&_jsx(Notifications,{listClassName:cnHeader("NotificationsList",{breakpoint:"m"}),items:w,itemDateFormat:x,title:y,actions:z,groupByDay:A,groupLabelFormat:B,groups:C,getItemLabel:D,getItemDescription:E,getItemImage:F,getItemRead:G,getItemDate:H,getItemBadges:I,getItemActions:J,getItemGroup:K,getItemView:L,getActionLabel:M,getActionIcon:N,getActionOnClick:O,getGroupLabel:P,getGroupId:Q,style:{zIndex:ja}}))},rowBottom:$?_jsx(Breadcrumbs,{className:cnHeader("Breadcrumbs"),items:$,onlyIconRoot:_,size:"m",onItemClick:aa,getItemLabel:ba,getItemHref:ca,getItemIcon:da,getItemOnClick:ea,lastItemIsLink:fa,fitMode:ga}):void 0})):ia.s?React.createElement(Layout,Object.assign({},ha,{ref:b,className:cnHeader({fixed:e},[d]),rowCenter:{left:_jsx("div",{className:cnHeader("RowCenterLeft")},void 0,i&&_jsx(MobileMenu,{className:cnHeader("Menu"),items:i,getItemActive:j,getItemHref:k,getItemLabel:l,getItemOnClick:m,getItemSubMenu:n,getItemTarget:o,onItemClick:p,style:{zIndex:ja}}),_jsx(HeaderLogo,{className:cnHeader("Logo"),logo:f,href:h})),right:_jsx("div",{className:cnHeader("RowCenterRight")},void 0,_jsx(HeaderLogin,{userName:q,userAvatar:r,userInfo:s,userLogined:t,onLoginButtonClick:u,loginButtonLabel:v}),(null===R||void 0===R?void 0:R.length)&&_jsx(TileMenu,{items:R,view:S,onItemClick:T,getItemDescription:U,getItemHref:V,getItemImage:W,getItemOnClick:X,getItemTitle:Y,listClassName:cnHeader("TileMenuList"),title:Z,isMobile:!0,style:{zIndex:ja}}),(null===w||void 0===w?void 0:w.length)&&_jsx(Notifications,{listClassName:cnHeader("NotificationsList"),items:w,itemDateFormat:x,title:y,actions:z,groupByDay:A,groupLabelFormat:B,groups:C,getItemLabel:D,getItemDescription:E,getItemImage:F,getItemRead:G,getItemDate:H,getItemBadges:I,getItemActions:J,getItemGroup:K,getItemView:L,getActionLabel:M,getActionIcon:N,getActionOnClick:O,getGroupLabel:P,getGroupId:Q,isMobile:!0,style:{zIndex:ja}}))},rowBottom:$?_jsx(Breadcrumbs,{className:cnHeader("Breadcrumbs"),items:$,onlyIconRoot:_,size:"m",onItemClick:aa,getItemLabel:ba,getItemHref:ca,getItemIcon:da,getItemOnClick:ea,lastItemIsLink:fa,fitMode:ga}):void 0})):React.createElement(Layout,Object.assign({},ha,{ref:b,className:cnHeader({fixed:e},[d]),rowCenter:{left:_jsx("div",{className:cnHeader("RowCenterLeft")},void 0,i&&_jsx(MobileMenu,{className:cnHeader("Menu"),items:i,getItemActive:j,getItemHref:k,getItemLabel:l,getItemOnClick:m,getItemSubMenu:n,getItemTarget:o,onItemClick:p,style:{zIndex:ja},header:_jsx("div",{className:cnHeader("MobileMenuHeader")},void 0,_jsx("div",{},void 0,_jsx(HeaderLogin,{userName:q,userAvatar:r,userInfo:s,userLogined:t,onLoginButtonClick:u,loginButtonLabel:v})),(null===R||void 0===R?void 0:R.length)&&(null===w||void 0===w?void 0:w.length)&&_jsx("div",{},void 0,(null===R||void 0===R?void 0:R.length)&&_jsx(TileMenu,{items:R,view:S,onItemClick:T,getItemDescription:U,getItemHref:V,getItemImage:W,getItemOnClick:X,getItemTitle:Y,listClassName:cnHeader("TileMenuList"),title:Z,isMobile:!0,style:{zIndex:ja}}),(null===w||void 0===w?void 0:w.length)&&_jsx(Notifications,{listClassName:cnHeader("NotificationsList"),items:w,itemDateFormat:x,title:y,actions:z,groupByDay:A,groupLabelFormat:B,groups:C,getItemLabel:D,getItemDescription:E,getItemImage:F,getItemRead:G,getItemDate:H,getItemBadges:I,getItemActions:J,getItemGroup:K,getItemView:L,getActionLabel:M,getActionIcon:N,getActionOnClick:O,getGroupLabel:P,getGroupId:Q,isMobile:!0,style:{zIndex:ja}})))}),_jsx(HeaderLogo,{className:cnHeader("Logo"),logo:f,href:h}))}}))};export const Header=forwardRef(HeaderRender);export*from"./types";
|
|
2
2
|
//# sourceMappingURL=Header.js.map
|
package/Header/Header.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Header/Header.tsx"],"names":["React","forwardRef","cn","Layout","Menu","HeaderLogo","HeaderLogin","Notifications","TileMenu","useBreakpoints","MobileMenu","cnHeader","HeaderRender","props","ref","className","logo","onLogoClick","logoHref","menu","getMenuItemActive","getMenuItemHref","getMenuItemLabel","getMenuItemOnClick","getMenuItemSubMenu","getMenuItemTarget","onMenuItemClick","userName","userAvatar","userInfo","userLogined","onLoginButtonClick","loginButtonLabel","notifications","notificationsDateFormat","notificationsTitle","notificationsActions","notificationsGroupByDay","notificationsGroupLabelFormat","notificationsGroups","getNotificationsItemLabel","getNotificationsItemDescription","getNotificationsItemImage","getNotificationsItemRead","getNotificationsItemDate","getNotificationsItemBadges","getNotificationsItemActions","getNotificationsItemGroup","getNotificationsItemView","getNotificationsActionLabel","getNotificationsActionIcon","getNotificationsActionOnClick","getNotificationsGroupLabel","getNotificationsGroupId","tileMenu","tileMenuView","onTileMenuItemClick","getTileMenuItemDescription","getTileMenuItemHref","getTileMenuItemImage","getTileMenuItemOnClick","getTileMenuItemTitle","tileMenuTitle","otherProps","breakpoints","s","m","elementZIndex","style","zIndex","left","breakpoint","right","length","Header"],"mappings":"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","sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { cn } from '@/__private__/utils/bem'\nimport { HeaderProps, HeaderComponent } from './types'\nimport { Layout } from '@/Layout'\nimport { Menu } from '@/Menu'\nimport { HeaderLogo } from './HeaderLogo'\nimport { HeaderLogin } from './HeaderLogin'\nimport { Notifications } from '@/Notifications'\nimport { TileMenu } from '@/TileMenu'\nimport { useBreakpoints } from '@consta/uikit/useBreakpoints'\nimport { MobileMenu } from '@/MobileMenu'\n\nimport './Header.css'\n\nexport const cnHeader = cn('Header')\n\nconst HeaderRender = (props: HeaderProps, ref: React.Ref<HTMLDivElement>) => {\n const {\n className,\n\n // Logo\n logo,\n onLogoClick,\n logoHref,\n\n // Menu\n menu,\n getMenuItemActive,\n getMenuItemHref,\n getMenuItemLabel,\n getMenuItemOnClick,\n getMenuItemSubMenu,\n getMenuItemTarget,\n onMenuItemClick,\n\n // Login\n userName,\n userAvatar,\n userInfo,\n userLogined,\n onLoginButtonClick,\n loginButtonLabel,\n\n // Notifications\n notifications,\n notificationsDateFormat,\n notificationsTitle,\n notificationsActions,\n notificationsGroupByDay,\n notificationsGroupLabelFormat,\n notificationsGroups,\n getNotificationsItemLabel,\n getNotificationsItemDescription,\n getNotificationsItemImage,\n getNotificationsItemRead,\n getNotificationsItemDate,\n getNotificationsItemBadges,\n getNotificationsItemActions,\n getNotificationsItemGroup,\n getNotificationsItemView,\n getNotificationsActionLabel,\n getNotificationsActionIcon,\n getNotificationsActionOnClick,\n getNotificationsGroupLabel,\n getNotificationsGroupId,\n\n // TileMenu\n tileMenu,\n tileMenuView,\n onTileMenuItemClick,\n getTileMenuItemDescription,\n getTileMenuItemHref,\n getTileMenuItemImage,\n getTileMenuItemOnClick,\n getTileMenuItemTitle,\n tileMenuTitle,\n ...otherProps\n } = props\n\n const breakpoints = useBreakpoints({ s: 800, m: 1200 })\n\n const elementZIndex = typeof props.style?.zIndex === 'number' ? props.style.zIndex : undefined\n\n if (breakpoints.m) {\n return (\n <Layout\n {...otherProps}\n ref={ref}\n className={cnHeader(null, [className])}\n rowCenter={{\n left: (\n <div className={cnHeader('RowCenterLeft', { breakpoint: 'm' })}>\n <HeaderLogo className={cnHeader('Logo')} logo={logo} href={logoHref} />\n {menu && (\n <Menu\n className={cnHeader('Menu')}\n items={menu}\n getItemActive={getMenuItemActive}\n getItemHref={getMenuItemHref}\n getItemLabel={getMenuItemLabel}\n getItemOnClick={getMenuItemOnClick}\n getItemSubMenu={getMenuItemSubMenu}\n getItemTarget={getMenuItemTarget}\n onItemClick={onMenuItemClick}\n style={{ zIndex: elementZIndex }}\n />\n )}\n </div>\n ),\n right: (\n <div className={cnHeader('RowCenterRight')}>\n <HeaderLogin\n userName={userName}\n userAvatar={userAvatar}\n userInfo={userInfo}\n userLogined={userLogined}\n onLoginButtonClick={onLoginButtonClick}\n loginButtonLabel={loginButtonLabel}\n />\n {tileMenu?.length && (\n <TileMenu\n items={tileMenu}\n view={tileMenuView}\n onItemClick={onTileMenuItemClick}\n getItemDescription={getTileMenuItemDescription}\n getItemHref={getTileMenuItemHref}\n getItemImage={getTileMenuItemImage}\n getItemOnClick={getTileMenuItemOnClick}\n getItemTitle={getTileMenuItemTitle}\n listClassName={cnHeader('TileMenuList', { breakpoint: 'm' })}\n title={tileMenuTitle}\n style={{ zIndex: elementZIndex }}\n />\n )}\n {notifications?.length && (\n <Notifications\n listClassName={cnHeader('NotificationsList', { breakpoint: 'm' })}\n items={notifications}\n itemDateFormat={notificationsDateFormat}\n title={notificationsTitle}\n actions={notificationsActions}\n groupByDay={notificationsGroupByDay}\n groupLabelFormat={notificationsGroupLabelFormat}\n groups={notificationsGroups}\n getItemLabel={getNotificationsItemLabel}\n getItemDescription={getNotificationsItemDescription}\n getItemImage={getNotificationsItemImage}\n getItemRead={getNotificationsItemRead}\n getItemDate={getNotificationsItemDate}\n getItemBadges={getNotificationsItemBadges}\n getItemActions={getNotificationsItemActions}\n getItemGroup={getNotificationsItemGroup}\n getItemView={getNotificationsItemView}\n getActionLabel={getNotificationsActionLabel}\n getActionIcon={getNotificationsActionIcon}\n getActionOnClick={getNotificationsActionOnClick}\n getGroupLabel={getNotificationsGroupLabel}\n getGroupId={getNotificationsGroupId}\n style={{ zIndex: elementZIndex }}\n />\n )}\n </div>\n ),\n }}\n />\n )\n }\n\n if (breakpoints.s) {\n return (\n <Layout\n {...otherProps}\n ref={ref}\n className={cnHeader(null, [className])}\n rowCenter={{\n left: (\n <div className={cnHeader('RowCenterLeft')}>\n {menu && (\n <MobileMenu\n className={cnHeader('Menu')}\n items={menu}\n getItemActive={getMenuItemActive}\n getItemHref={getMenuItemHref}\n getItemLabel={getMenuItemLabel}\n getItemOnClick={getMenuItemOnClick}\n getItemSubMenu={getMenuItemSubMenu}\n getItemTarget={getMenuItemTarget}\n onItemClick={onMenuItemClick}\n style={{ zIndex: elementZIndex }}\n />\n )}\n <HeaderLogo className={cnHeader('Logo')} logo={logo} href={logoHref} />\n </div>\n ),\n right: (\n <div className={cnHeader('RowCenterRight')}>\n <HeaderLogin\n userName={userName}\n userAvatar={userAvatar}\n userInfo={userInfo}\n userLogined={userLogined}\n onLoginButtonClick={onLoginButtonClick}\n loginButtonLabel={loginButtonLabel}\n />\n {tileMenu?.length && (\n <TileMenu\n items={tileMenu}\n view={tileMenuView}\n onItemClick={onTileMenuItemClick}\n getItemDescription={getTileMenuItemDescription}\n getItemHref={getTileMenuItemHref}\n getItemImage={getTileMenuItemImage}\n getItemOnClick={getTileMenuItemOnClick}\n getItemTitle={getTileMenuItemTitle}\n listClassName={cnHeader('TileMenuList')}\n title={tileMenuTitle}\n isMobile\n style={{ zIndex: elementZIndex }}\n />\n )}\n {notifications?.length && (\n <Notifications\n listClassName={cnHeader('NotificationsList')}\n items={notifications}\n itemDateFormat={notificationsDateFormat}\n title={notificationsTitle}\n actions={notificationsActions}\n groupByDay={notificationsGroupByDay}\n groupLabelFormat={notificationsGroupLabelFormat}\n groups={notificationsGroups}\n getItemLabel={getNotificationsItemLabel}\n getItemDescription={getNotificationsItemDescription}\n getItemImage={getNotificationsItemImage}\n getItemRead={getNotificationsItemRead}\n getItemDate={getNotificationsItemDate}\n getItemBadges={getNotificationsItemBadges}\n getItemActions={getNotificationsItemActions}\n getItemGroup={getNotificationsItemGroup}\n getItemView={getNotificationsItemView}\n getActionLabel={getNotificationsActionLabel}\n getActionIcon={getNotificationsActionIcon}\n getActionOnClick={getNotificationsActionOnClick}\n getGroupLabel={getNotificationsGroupLabel}\n getGroupId={getNotificationsGroupId}\n isMobile\n style={{ zIndex: elementZIndex }}\n />\n )}\n </div>\n ),\n }}\n />\n )\n }\n\n return (\n <Layout\n {...otherProps}\n ref={ref}\n className={cnHeader(null, [className])}\n rowCenter={{\n left: (\n <div className={cnHeader('RowCenterLeft')}>\n {menu && (\n <MobileMenu\n className={cnHeader('Menu')}\n items={menu}\n getItemActive={getMenuItemActive}\n getItemHref={getMenuItemHref}\n getItemLabel={getMenuItemLabel}\n getItemOnClick={getMenuItemOnClick}\n getItemSubMenu={getMenuItemSubMenu}\n getItemTarget={getMenuItemTarget}\n onItemClick={onMenuItemClick}\n style={{ zIndex: elementZIndex }}\n header={\n <div className={cnHeader('MobileMenuHeader')}>\n <div>\n <HeaderLogin\n userName={userName}\n userAvatar={userAvatar}\n userInfo={userInfo}\n userLogined={userLogined}\n onLoginButtonClick={onLoginButtonClick}\n loginButtonLabel={loginButtonLabel}\n />\n </div>\n {tileMenu?.length && notifications?.length && (\n <div>\n {tileMenu?.length && (\n <TileMenu\n items={tileMenu}\n view={tileMenuView}\n onItemClick={onTileMenuItemClick}\n getItemDescription={getTileMenuItemDescription}\n getItemHref={getTileMenuItemHref}\n getItemImage={getTileMenuItemImage}\n getItemOnClick={getTileMenuItemOnClick}\n getItemTitle={getTileMenuItemTitle}\n listClassName={cnHeader('TileMenuList')}\n title={tileMenuTitle}\n isMobile\n style={{ zIndex: elementZIndex }}\n />\n )}\n {notifications?.length && (\n <Notifications\n listClassName={cnHeader('NotificationsList')}\n items={notifications}\n itemDateFormat={notificationsDateFormat}\n title={notificationsTitle}\n actions={notificationsActions}\n groupByDay={notificationsGroupByDay}\n groupLabelFormat={notificationsGroupLabelFormat}\n groups={notificationsGroups}\n getItemLabel={getNotificationsItemLabel}\n getItemDescription={getNotificationsItemDescription}\n getItemImage={getNotificationsItemImage}\n getItemRead={getNotificationsItemRead}\n getItemDate={getNotificationsItemDate}\n getItemBadges={getNotificationsItemBadges}\n getItemActions={getNotificationsItemActions}\n getItemGroup={getNotificationsItemGroup}\n getItemView={getNotificationsItemView}\n getActionLabel={getNotificationsActionLabel}\n getActionIcon={getNotificationsActionIcon}\n getActionOnClick={getNotificationsActionOnClick}\n getGroupLabel={getNotificationsGroupLabel}\n getGroupId={getNotificationsGroupId}\n isMobile\n style={{ zIndex: elementZIndex }}\n />\n )}\n </div>\n )}\n </div>\n }\n />\n )}\n <HeaderLogo className={cnHeader('Logo')} logo={logo} href={logoHref} />\n </div>\n ),\n }}\n />\n )\n}\n\nexport const Header = forwardRef(HeaderRender) as HeaderComponent\n\nexport * from './types'\n"],"file":"Header.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/Header/Header.tsx"],"names":["React","forwardRef","cn","Layout","Menu","HeaderLogo","HeaderLogin","Notifications","TileMenu","useBreakpoints","MobileMenu","Breadcrumbs","cnHeader","HeaderRender","props","ref","className","fixed","logo","onLogoClick","logoHref","menu","getMenuItemActive","getMenuItemHref","getMenuItemLabel","getMenuItemOnClick","getMenuItemSubMenu","getMenuItemTarget","onMenuItemClick","userName","userAvatar","userInfo","userLogined","onLoginButtonClick","loginButtonLabel","notifications","notificationsDateFormat","notificationsTitle","notificationsActions","notificationsGroupByDay","notificationsGroupLabelFormat","notificationsGroups","getNotificationsItemLabel","getNotificationsItemDescription","getNotificationsItemImage","getNotificationsItemRead","getNotificationsItemDate","getNotificationsItemBadges","getNotificationsItemActions","getNotificationsItemGroup","getNotificationsItemView","getNotificationsActionLabel","getNotificationsActionIcon","getNotificationsActionOnClick","getNotificationsGroupLabel","getNotificationsGroupId","tileMenu","tileMenuView","onTileMenuItemClick","getTileMenuItemDescription","getTileMenuItemHref","getTileMenuItemImage","getTileMenuItemOnClick","getTileMenuItemTitle","tileMenuTitle","breadcrumbs","breadcrumbsOnlyIconRoot","onBreadcrumbsItemClick","getBreadcrumbsItemLabel","getBreadcrumbsItemHref","getBreadcrumbsItemIcon","getBreadcrumbsItemOnClick","breadcrumbsLastItemIsLink","breadcrumbsFitMode","otherProps","breakpoints","s","m","elementZIndex","style","zIndex","left","breakpoint","right","length","Header"],"mappings":"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","sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { cn } from '@/__private__/utils/bem'\nimport { HeaderProps, HeaderComponent } from './types'\nimport { Layout } from '@/Layout'\nimport { Menu } from '@/Menu'\nimport { HeaderLogo } from './HeaderLogo'\nimport { HeaderLogin } from './HeaderLogin'\nimport { Notifications } from '@/Notifications'\nimport { TileMenu } from '@/TileMenu'\nimport { useBreakpoints } from '@consta/uikit/useBreakpoints'\nimport { MobileMenu } from '@/MobileMenu'\nimport { Breadcrumbs } from '@consta/uikit/BreadcrumbsCanary'\n\nimport './Header.css'\n\nexport const cnHeader = cn('Header')\n\nconst HeaderRender = (props: HeaderProps, ref: React.Ref<HTMLDivElement>) => {\n const {\n className,\n fixed,\n\n // Logo\n logo,\n onLogoClick,\n logoHref,\n\n // Menu\n menu,\n getMenuItemActive,\n getMenuItemHref,\n getMenuItemLabel,\n getMenuItemOnClick,\n getMenuItemSubMenu,\n getMenuItemTarget,\n onMenuItemClick,\n\n // Login\n userName,\n userAvatar,\n userInfo,\n userLogined,\n onLoginButtonClick,\n loginButtonLabel,\n\n // Notifications\n notifications,\n notificationsDateFormat,\n notificationsTitle,\n notificationsActions,\n notificationsGroupByDay,\n notificationsGroupLabelFormat,\n notificationsGroups,\n getNotificationsItemLabel,\n getNotificationsItemDescription,\n getNotificationsItemImage,\n getNotificationsItemRead,\n getNotificationsItemDate,\n getNotificationsItemBadges,\n getNotificationsItemActions,\n getNotificationsItemGroup,\n getNotificationsItemView,\n getNotificationsActionLabel,\n getNotificationsActionIcon,\n getNotificationsActionOnClick,\n getNotificationsGroupLabel,\n getNotificationsGroupId,\n\n // TileMenu\n tileMenu,\n tileMenuView,\n onTileMenuItemClick,\n getTileMenuItemDescription,\n getTileMenuItemHref,\n getTileMenuItemImage,\n getTileMenuItemOnClick,\n getTileMenuItemTitle,\n tileMenuTitle,\n\n // Breadcrumbs\n breadcrumbs,\n breadcrumbsOnlyIconRoot,\n onBreadcrumbsItemClick,\n getBreadcrumbsItemLabel,\n getBreadcrumbsItemHref,\n getBreadcrumbsItemIcon,\n getBreadcrumbsItemOnClick,\n breadcrumbsLastItemIsLink,\n breadcrumbsFitMode,\n ...otherProps\n } = props\n\n const breakpoints = useBreakpoints({ s: 800, m: 1200 })\n\n const elementZIndex = typeof props.style?.zIndex === 'number' ? props.style.zIndex : undefined\n\n if (breakpoints.m) {\n return (\n <Layout\n {...otherProps}\n ref={ref}\n className={cnHeader({ fixed }, [className])}\n rowCenter={{\n left: (\n <div className={cnHeader('RowCenterLeft', { breakpoint: 'm' })}>\n <HeaderLogo className={cnHeader('Logo')} logo={logo} href={logoHref} />\n {menu && (\n <Menu\n className={cnHeader('Menu')}\n items={menu}\n getItemActive={getMenuItemActive}\n getItemHref={getMenuItemHref}\n getItemLabel={getMenuItemLabel}\n getItemOnClick={getMenuItemOnClick}\n getItemSubMenu={getMenuItemSubMenu}\n getItemTarget={getMenuItemTarget}\n onItemClick={onMenuItemClick}\n style={{ zIndex: elementZIndex }}\n />\n )}\n </div>\n ),\n right: (\n <div className={cnHeader('RowCenterRight')}>\n <HeaderLogin\n userName={userName}\n userAvatar={userAvatar}\n userInfo={userInfo}\n userLogined={userLogined}\n onLoginButtonClick={onLoginButtonClick}\n loginButtonLabel={loginButtonLabel}\n />\n {tileMenu?.length && (\n <TileMenu\n items={tileMenu}\n view={tileMenuView}\n onItemClick={onTileMenuItemClick}\n getItemDescription={getTileMenuItemDescription}\n getItemHref={getTileMenuItemHref}\n getItemImage={getTileMenuItemImage}\n getItemOnClick={getTileMenuItemOnClick}\n getItemTitle={getTileMenuItemTitle}\n listClassName={cnHeader('TileMenuList', { breakpoint: 'm' })}\n title={tileMenuTitle}\n style={{ zIndex: elementZIndex }}\n />\n )}\n {notifications?.length && (\n <Notifications\n listClassName={cnHeader('NotificationsList', { breakpoint: 'm' })}\n items={notifications}\n itemDateFormat={notificationsDateFormat}\n title={notificationsTitle}\n actions={notificationsActions}\n groupByDay={notificationsGroupByDay}\n groupLabelFormat={notificationsGroupLabelFormat}\n groups={notificationsGroups}\n getItemLabel={getNotificationsItemLabel}\n getItemDescription={getNotificationsItemDescription}\n getItemImage={getNotificationsItemImage}\n getItemRead={getNotificationsItemRead}\n getItemDate={getNotificationsItemDate}\n getItemBadges={getNotificationsItemBadges}\n getItemActions={getNotificationsItemActions}\n getItemGroup={getNotificationsItemGroup}\n getItemView={getNotificationsItemView}\n getActionLabel={getNotificationsActionLabel}\n getActionIcon={getNotificationsActionIcon}\n getActionOnClick={getNotificationsActionOnClick}\n getGroupLabel={getNotificationsGroupLabel}\n getGroupId={getNotificationsGroupId}\n style={{ zIndex: elementZIndex }}\n />\n )}\n </div>\n ),\n }}\n rowBottom={\n breadcrumbs ? (\n <Breadcrumbs\n className={cnHeader('Breadcrumbs')}\n items={breadcrumbs}\n onlyIconRoot={breadcrumbsOnlyIconRoot}\n size=\"m\"\n onItemClick={onBreadcrumbsItemClick}\n getItemLabel={getBreadcrumbsItemLabel}\n getItemHref={getBreadcrumbsItemHref}\n getItemIcon={getBreadcrumbsItemIcon}\n getItemOnClick={getBreadcrumbsItemOnClick}\n lastItemIsLink={breadcrumbsLastItemIsLink}\n fitMode={breadcrumbsFitMode}\n />\n ) : (\n undefined\n )\n }\n />\n )\n }\n\n if (breakpoints.s) {\n return (\n <Layout\n {...otherProps}\n ref={ref}\n className={cnHeader({ fixed }, [className])}\n rowCenter={{\n left: (\n <div className={cnHeader('RowCenterLeft')}>\n {menu && (\n <MobileMenu\n className={cnHeader('Menu')}\n items={menu}\n getItemActive={getMenuItemActive}\n getItemHref={getMenuItemHref}\n getItemLabel={getMenuItemLabel}\n getItemOnClick={getMenuItemOnClick}\n getItemSubMenu={getMenuItemSubMenu}\n getItemTarget={getMenuItemTarget}\n onItemClick={onMenuItemClick}\n style={{ zIndex: elementZIndex }}\n />\n )}\n <HeaderLogo className={cnHeader('Logo')} logo={logo} href={logoHref} />\n </div>\n ),\n right: (\n <div className={cnHeader('RowCenterRight')}>\n <HeaderLogin\n userName={userName}\n userAvatar={userAvatar}\n userInfo={userInfo}\n userLogined={userLogined}\n onLoginButtonClick={onLoginButtonClick}\n loginButtonLabel={loginButtonLabel}\n />\n {tileMenu?.length && (\n <TileMenu\n items={tileMenu}\n view={tileMenuView}\n onItemClick={onTileMenuItemClick}\n getItemDescription={getTileMenuItemDescription}\n getItemHref={getTileMenuItemHref}\n getItemImage={getTileMenuItemImage}\n getItemOnClick={getTileMenuItemOnClick}\n getItemTitle={getTileMenuItemTitle}\n listClassName={cnHeader('TileMenuList')}\n title={tileMenuTitle}\n isMobile\n style={{ zIndex: elementZIndex }}\n />\n )}\n {notifications?.length && (\n <Notifications\n listClassName={cnHeader('NotificationsList')}\n items={notifications}\n itemDateFormat={notificationsDateFormat}\n title={notificationsTitle}\n actions={notificationsActions}\n groupByDay={notificationsGroupByDay}\n groupLabelFormat={notificationsGroupLabelFormat}\n groups={notificationsGroups}\n getItemLabel={getNotificationsItemLabel}\n getItemDescription={getNotificationsItemDescription}\n getItemImage={getNotificationsItemImage}\n getItemRead={getNotificationsItemRead}\n getItemDate={getNotificationsItemDate}\n getItemBadges={getNotificationsItemBadges}\n getItemActions={getNotificationsItemActions}\n getItemGroup={getNotificationsItemGroup}\n getItemView={getNotificationsItemView}\n getActionLabel={getNotificationsActionLabel}\n getActionIcon={getNotificationsActionIcon}\n getActionOnClick={getNotificationsActionOnClick}\n getGroupLabel={getNotificationsGroupLabel}\n getGroupId={getNotificationsGroupId}\n isMobile\n style={{ zIndex: elementZIndex }}\n />\n )}\n </div>\n ),\n }}\n rowBottom={\n breadcrumbs ? (\n <Breadcrumbs\n className={cnHeader('Breadcrumbs')}\n items={breadcrumbs}\n onlyIconRoot={breadcrumbsOnlyIconRoot}\n size=\"m\"\n onItemClick={onBreadcrumbsItemClick}\n getItemLabel={getBreadcrumbsItemLabel}\n getItemHref={getBreadcrumbsItemHref}\n getItemIcon={getBreadcrumbsItemIcon}\n getItemOnClick={getBreadcrumbsItemOnClick}\n lastItemIsLink={breadcrumbsLastItemIsLink}\n fitMode={breadcrumbsFitMode}\n />\n ) : (\n undefined\n )\n }\n />\n )\n }\n\n return (\n <Layout\n {...otherProps}\n ref={ref}\n className={cnHeader({ fixed }, [className])}\n rowCenter={{\n left: (\n <div className={cnHeader('RowCenterLeft')}>\n {menu && (\n <MobileMenu\n className={cnHeader('Menu')}\n items={menu}\n getItemActive={getMenuItemActive}\n getItemHref={getMenuItemHref}\n getItemLabel={getMenuItemLabel}\n getItemOnClick={getMenuItemOnClick}\n getItemSubMenu={getMenuItemSubMenu}\n getItemTarget={getMenuItemTarget}\n onItemClick={onMenuItemClick}\n style={{ zIndex: elementZIndex }}\n header={\n <div className={cnHeader('MobileMenuHeader')}>\n <div>\n <HeaderLogin\n userName={userName}\n userAvatar={userAvatar}\n userInfo={userInfo}\n userLogined={userLogined}\n onLoginButtonClick={onLoginButtonClick}\n loginButtonLabel={loginButtonLabel}\n />\n </div>\n {tileMenu?.length && notifications?.length && (\n <div>\n {tileMenu?.length && (\n <TileMenu\n items={tileMenu}\n view={tileMenuView}\n onItemClick={onTileMenuItemClick}\n getItemDescription={getTileMenuItemDescription}\n getItemHref={getTileMenuItemHref}\n getItemImage={getTileMenuItemImage}\n getItemOnClick={getTileMenuItemOnClick}\n getItemTitle={getTileMenuItemTitle}\n listClassName={cnHeader('TileMenuList')}\n title={tileMenuTitle}\n isMobile\n style={{ zIndex: elementZIndex }}\n />\n )}\n {notifications?.length && (\n <Notifications\n listClassName={cnHeader('NotificationsList')}\n items={notifications}\n itemDateFormat={notificationsDateFormat}\n title={notificationsTitle}\n actions={notificationsActions}\n groupByDay={notificationsGroupByDay}\n groupLabelFormat={notificationsGroupLabelFormat}\n groups={notificationsGroups}\n getItemLabel={getNotificationsItemLabel}\n getItemDescription={getNotificationsItemDescription}\n getItemImage={getNotificationsItemImage}\n getItemRead={getNotificationsItemRead}\n getItemDate={getNotificationsItemDate}\n getItemBadges={getNotificationsItemBadges}\n getItemActions={getNotificationsItemActions}\n getItemGroup={getNotificationsItemGroup}\n getItemView={getNotificationsItemView}\n getActionLabel={getNotificationsActionLabel}\n getActionIcon={getNotificationsActionIcon}\n getActionOnClick={getNotificationsActionOnClick}\n getGroupLabel={getNotificationsGroupLabel}\n getGroupId={getNotificationsGroupId}\n isMobile\n style={{ zIndex: elementZIndex }}\n />\n )}\n </div>\n )}\n </div>\n }\n />\n )}\n <HeaderLogo className={cnHeader('Logo')} logo={logo} href={logoHref} />\n </div>\n ),\n }}\n />\n )\n}\n\nexport const Header = forwardRef(HeaderRender) as HeaderComponent\n\nexport * from './types'\n"],"file":"Header.js"}
|
package/Header/types.d.ts
CHANGED
|
@@ -3,7 +3,9 @@ import { DefaultItem as DefaultMenuItem, MenuPropOnItemClick, MenuPropGetItemHre
|
|
|
3
3
|
import { NotificationsListPropGetItemLabel, NotificationsListPropGetActionIcon, NotificationsListPropGetActionLabel, NotificationsListPropGetActionOnClick, NotificationsListPropGetGroupId, NotificationsListPropGetGroupLabel, NotificationsListPropGetItemActions, NotificationsListPropGetItemBadges, NotificationsListPropGetItemDate, NotificationsListPropGetItemDescription, NotificationsListPropGetItemGroup, NotificationsListPropGetItemImage, NotificationsListPropGetItemRead, NotificationsListPropGetItemView, NotificationsListPropGroupLabelFormat, DefaultAction as DefaultNotificationAction, DefaultGroup as DefaultNotificationGroup, DefaultItem as DefaultNotificationItem, NotificationsListPropItemDateFormat } from "../NotificationsList/index";
|
|
4
4
|
import { TileMenuPropGetItemImage, TileMenuPropGetItemDescription, TileMenuPropGetItemHref, TileMenuPropGetItemOnClick, TileMenuPropGetItemTitle, TileMenuOnItemClick, TileMenuPropView, DefaultItem as DefaultTileMenuItem } from "../TileMenu/index";
|
|
5
5
|
import { PropsWithHTMLAttributesAndRef } from "../__private__/utils/types/PropsWithHTMLAttributes";
|
|
6
|
-
|
|
6
|
+
import { BreadcrumbsPropGetItemLabel, BreadcrumbsPropGetItemHref, BreadcrumbsPropGetItemOnClick, BreadcrumbsPropGetItemIcon, BreadcrumbsPropOnItemClick, BreadcrumbPropFitMode, DefaultItem as DefaultBreadcrumbsItem } from '@consta/uikit/BreadcrumbsCanary';
|
|
7
|
+
export declare type HeaderProps<MENU_ITEM = DefaultMenuItem, NOTIFICATION_ITEM = DefaultNotificationItem, NOTIFICATION_GROUP = DefaultNotificationGroup, NOTIFICATION_ACTION = DefaultNotificationAction, NOTIFICATION_GROUP_BY_DAY extends boolean = false, TILE_MENU_ITEM = DefaultTileMenuItem, BREADCRUMBS_ITEM = DefaultBreadcrumbsItem> = PropsWithHTMLAttributesAndRef<{
|
|
8
|
+
fixed?: boolean;
|
|
7
9
|
logo?: React.ReactNode;
|
|
8
10
|
onLogoClick?: React.MouseEventHandler;
|
|
9
11
|
logoHref?: string;
|
|
@@ -52,6 +54,15 @@ export declare type HeaderProps<MENU_ITEM = DefaultMenuItem, NOTIFICATION_ITEM =
|
|
|
52
54
|
getTileMenuItemDescription?: TileMenuPropGetItemDescription<TILE_MENU_ITEM>;
|
|
53
55
|
getTileMenuItemHref?: TileMenuPropGetItemHref<TILE_MENU_ITEM>;
|
|
54
56
|
getTileMenuItemOnClick?: TileMenuPropGetItemOnClick<TILE_MENU_ITEM>;
|
|
57
|
+
breadcrumbs?: BREADCRUMBS_ITEM[];
|
|
58
|
+
getBreadcrumbsItemLabel?: BreadcrumbsPropGetItemLabel<BREADCRUMBS_ITEM>;
|
|
59
|
+
getBreadcrumbsItemHref?: BreadcrumbsPropGetItemHref<BREADCRUMBS_ITEM>;
|
|
60
|
+
getBreadcrumbsItemIcon?: BreadcrumbsPropGetItemIcon<BREADCRUMBS_ITEM>;
|
|
61
|
+
getBreadcrumbsItemOnClick?: BreadcrumbsPropGetItemOnClick<BREADCRUMBS_ITEM>;
|
|
62
|
+
onBreadcrumbsItemClick?: BreadcrumbsPropOnItemClick<BREADCRUMBS_ITEM>;
|
|
63
|
+
breadcrumbsOnlyIconRoot?: boolean;
|
|
64
|
+
breadcrumbsLastItemIsLink?: boolean;
|
|
65
|
+
breadcrumbsFitMode?: BreadcrumbPropFitMode;
|
|
55
66
|
}, HTMLDivElement> & (MENU_ITEM extends {
|
|
56
67
|
label: DefaultMenuItem['label'] | unknown;
|
|
57
68
|
} ? {} : {
|
|
@@ -76,5 +87,9 @@ export declare type HeaderProps<MENU_ITEM = DefaultMenuItem, NOTIFICATION_ITEM =
|
|
|
76
87
|
title: DefaultTileMenuItem['title'] | unknown;
|
|
77
88
|
} ? {} : {
|
|
78
89
|
getTileMenuItemTitle: TileMenuPropGetItemTitle<TILE_MENU_ITEM>;
|
|
90
|
+
}) & (BREADCRUMBS_ITEM extends {
|
|
91
|
+
label: DefaultBreadcrumbsItem['label'] | unknown;
|
|
92
|
+
} ? {} : {
|
|
93
|
+
getBreadcrumbsItemLabel: BreadcrumbsPropGetItemLabel<BREADCRUMBS_ITEM>;
|
|
79
94
|
});
|
|
80
|
-
export declare type HeaderComponent = <MENU_ITEM = DefaultMenuItem, NOTIFICATION_ITEM = DefaultNotificationItem, NOTIFICATION_GROUP = DefaultNotificationGroup, NOTIFICATION_ACTION = DefaultNotificationAction, NOTIFICATION_GROUP_BY_DAY extends boolean = false, TILE_MENU_ITEM = DefaultTileMenuItem>(props: HeaderProps<MENU_ITEM, NOTIFICATION_ITEM, NOTIFICATION_GROUP, NOTIFICATION_ACTION, NOTIFICATION_GROUP_BY_DAY, TILE_MENU_ITEM>) => React.ReactElement | null;
|
|
95
|
+
export declare type HeaderComponent = <MENU_ITEM = DefaultMenuItem, NOTIFICATION_ITEM = DefaultNotificationItem, NOTIFICATION_GROUP = DefaultNotificationGroup, NOTIFICATION_ACTION = DefaultNotificationAction, NOTIFICATION_GROUP_BY_DAY extends boolean = false, TILE_MENU_ITEM = DefaultTileMenuItem, BREADCRUMBS_ITEM = DefaultBreadcrumbsItem>(props: HeaderProps<MENU_ITEM, NOTIFICATION_ITEM, NOTIFICATION_GROUP, NOTIFICATION_ACTION, NOTIFICATION_GROUP_BY_DAY, TILE_MENU_ITEM, BREADCRUMBS_ITEM>) => React.ReactElement | null;
|
package/Layout/Layout.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import _jsx from"@babel/runtime/helpers/jsx";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{forwardRef}from"react";import{cn}from"../__private__/utils/bem";import{LayoutRowIsObject}from"./helpers";import"./Layout.css";import{LayoutRow}from"./LayoutRow/LayoutRow";const cnLayout=cn("Layout");export const Layout=forwardRef((a,b)=>{const{className:c,rowTop:d,rowBottom:e,rowCenter:f,children:g}=a,h=_objectWithoutProperties(a,["className","rowTop","rowBottom","rowCenter","children"]);return React.createElement("div",Object.assign({},h,{className:cnLayout(null,[c]),ref:b}),d&&_jsx(LayoutRow,{className:cnLayout("Row"),content:d,height:"s"}),(f||g)&&_jsx(LayoutRow,{className:cnLayout("Row"),content:f||g,height:LayoutRowIsObject(f)?f.height:void 0}),e&&_jsx(LayoutRow,{className:cnLayout("Row"),content:e,height:"s"}))});export*from"./types";
|
|
1
|
+
import _jsx from"@babel/runtime/helpers/jsx";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{forwardRef}from"react";import{cn}from"../__private__/utils/bem";import{LayoutRowIsObject}from"./helpers";import"./Layout.css";import{LayoutRow}from"./LayoutRow/LayoutRow";const cnLayout=cn("Layout");export const Layout=forwardRef((a,b)=>{const{className:c,rowTop:d,rowBottom:e,rowCenter:f,children:g}=a,h=_objectWithoutProperties(a,["className","rowTop","rowBottom","rowCenter","children"]);return React.createElement("div",Object.assign({},h,{className:cnLayout(null,[c]),ref:b}),d&&_jsx(LayoutRow,{className:cnLayout("Row",{top:!0}),content:d,height:"s"}),(f||g)&&_jsx(LayoutRow,{className:cnLayout("Row",{center:!0}),content:f||g,height:LayoutRowIsObject(f)?f.height:void 0}),e&&_jsx(LayoutRow,{className:cnLayout("Row",{botton:!0}),content:e,height:"s"}))});export*from"./types";
|
|
2
2
|
//# sourceMappingURL=Layout.js.map
|
package/Layout/Layout.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Layout/Layout.tsx"],"names":["React","forwardRef","cn","LayoutRowIsObject","LayoutRow","cnLayout","Layout","props","ref","className","rowTop","rowBottom","rowCenter","children","otherProps","height"],"mappings":"kIAAA,MAAOA,CAAAA,KAAP,EAAgBC,UAAhB,KAAkC,OAAlC,CAEA,OAASC,EAAT,gCAEA,OAASC,iBAAT,iBAEA,qBACA,OAASC,SAAT,6BAEA,KAAMC,CAAAA,QAAQ,CAAGH,EAAE,CAAC,QAAD,CAAnB,CAEA,MAAO,MAAMI,CAAAA,MAAM,CAAGL,UAAU,CAAC,CAACM,CAAD,CAAqBC,CAArB,GAAwD,CACvF,KAAM,CAAEC,SAAS,CAATA,CAAF,CAAaC,MAAM,CAANA,CAAb,CAAqBC,SAAS,CAATA,CAArB,CAAgCC,SAAS,CAATA,CAAhC,CAA2CC,QAAQ,CAARA,CAA3C,EAAuEN,CAA7E,CAA8DO,CAA9D,0BAA6EP,CAA7E,4DAEA,MACE,4CAASO,CAAT,EAAqB,SAAS,CAAET,QAAQ,CAAC,IAAD,CAAO,CAACI,CAAD,CAAP,CAAxC,CAA6D,GAAG,CAAED,CAAlE,GACGE,CAAM,
|
|
1
|
+
{"version":3,"sources":["../../src/Layout/Layout.tsx"],"names":["React","forwardRef","cn","LayoutRowIsObject","LayoutRow","cnLayout","Layout","props","ref","className","rowTop","rowBottom","rowCenter","children","otherProps","top","center","height","botton"],"mappings":"kIAAA,MAAOA,CAAAA,KAAP,EAAgBC,UAAhB,KAAkC,OAAlC,CAEA,OAASC,EAAT,gCAEA,OAASC,iBAAT,iBAEA,qBACA,OAASC,SAAT,6BAEA,KAAMC,CAAAA,QAAQ,CAAGH,EAAE,CAAC,QAAD,CAAnB,CAEA,MAAO,MAAMI,CAAAA,MAAM,CAAGL,UAAU,CAAC,CAACM,CAAD,CAAqBC,CAArB,GAAwD,CACvF,KAAM,CAAEC,SAAS,CAATA,CAAF,CAAaC,MAAM,CAANA,CAAb,CAAqBC,SAAS,CAATA,CAArB,CAAgCC,SAAS,CAATA,CAAhC,CAA2CC,QAAQ,CAARA,CAA3C,EAAuEN,CAA7E,CAA8DO,CAA9D,0BAA6EP,CAA7E,4DAEA,MACE,4CAASO,CAAT,EAAqB,SAAS,CAAET,QAAQ,CAAC,IAAD,CAAO,CAACI,CAAD,CAAP,CAAxC,CAA6D,GAAG,CAAED,CAAlE,GACGE,CAAM,EACL,KAAC,SAAD,EAAW,SAAS,CAAEL,QAAQ,CAAC,KAAD,CAAQ,CAAEU,GAAG,GAAL,CAAR,CAA9B,CAAsD,OAAO,CAAEL,CAA/D,CAAuE,MAAM,CAAC,GAA9E,EAFJ,CAIG,CAACE,CAAS,EAAIC,CAAd,GACC,KAAC,SAAD,EACE,SAAS,CAAER,QAAQ,CAAC,KAAD,CAAQ,CAAEW,MAAM,GAAR,CAAR,CADrB,CAEE,OAAO,CAAEJ,CAAS,EAAIC,CAFxB,CAGE,MAAM,CAAEV,iBAAiB,CAACS,CAAD,CAAjB,CAA+BA,CAAS,CAACK,MAAzC,OAHV,EALJ,CAWGN,CAAS,EACR,KAAC,SAAD,EAAW,SAAS,CAAEN,QAAQ,CAAC,KAAD,CAAQ,CAAEa,MAAM,GAAR,CAAR,CAA9B,CAAyD,OAAO,CAAEP,CAAlE,CAA6E,MAAM,CAAC,GAApF,EAZJ,CAgBH,CApB+B,CAAzB,CAsBP","sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { cn } from '@/__private__/utils/bem'\n\nimport { LayoutRowIsObject } from './helpers'\nimport { LayoutProps } from './types'\nimport './Layout.css'\nimport { LayoutRow } from './LayoutRow/LayoutRow'\n\nconst cnLayout = cn('Layout')\n\nexport const Layout = forwardRef((props: LayoutProps, ref: React.Ref<HTMLDivElement>) => {\n const { className, rowTop, rowBottom, rowCenter, children, ...otherProps } = props\n\n return (\n <div {...otherProps} className={cnLayout(null, [className])} ref={ref}>\n {rowTop && (\n <LayoutRow className={cnLayout('Row', { top: true })} content={rowTop} height=\"s\" />\n )}\n {(rowCenter || children) && (\n <LayoutRow\n className={cnLayout('Row', { center: true })}\n content={rowCenter || children}\n height={LayoutRowIsObject(rowCenter) ? rowCenter.height : undefined}\n />\n )}\n {rowBottom && (\n <LayoutRow className={cnLayout('Row', { botton: true })} content={rowBottom} height=\"s\" />\n )}\n </div>\n )\n})\n\nexport * from './types'\n"],"file":"Layout.js"}
|
package/Menu/Menu.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import _jsx from"@babel/runtime/helpers/jsx";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{forwardRef,useState,useRef,useCallback,useEffect}from"react";import{IconSelect}from"@consta/uikit/IconSelect";import{Button}from"@consta/uikit/Button";import{IconMeatball}from"@consta/uikit/IconMeatball";import{useMutableRef}from"@consta/uikit/useMutableRef";import{useDebounce}from"@consta/uikit/useDebounce";import{useFlag}from"@consta/uikit/useFlag";import{AnimatedContextMenu}from"../__private__/AnimatedContextMenu/AnimatedContextMenu";import{cn}from"../__private__/utils/bem";import{useHideElementsLine}from"../__private__/hooks/useHideElementsLine";import{withDefaultGetters,getItemClick,animateTimeout}from"./helpers";import"./Menu.css";export const cnMenu=cn("Menu");const MenuRender=(a,b)=>{var c;const d=withDefaultGetters(a),{items:e,className:f,getItemActive:g,getItemHref:h,getItemLabel:i,getItemOnClick:j,getItemTarget:k,getItemSubMenu:l,onItemClick:m}=d,n=_objectWithoutProperties(d,["items","className","getItemActive","getItemHref","getItemLabel","getItemOnClick","getItemTarget","getItemSubMenu","onItemClick"]),[o,p]=useState(),[q,r]=useFlag(),{visibleItems:s,itemsRefs:t,wrapperRef:u,hiddenItems:v,moreRef:w}=useHideElementsLine(e),x=useRef(null),y=useMutableRef(h),z=useCallback(a=>y.current(a)?"a":"span",[]),A=useCallback(a=>y.current(a)?{href:y.current(a)}:{},[]),B="number"==typeof(null===(c=a.style)||void 0===c?void 0:c.zIndex)?a.style.zIndex+1:void 0;return useEffect(useDebounce(()=>{q||p(void 0)},animateTimeout),[q]),React.createElement("nav",Object.assign({},n,{className:cnMenu(null,[f]),onMouseLeave:r.off,onMouseEnter:r.on,ref:b}),React.createElement("ul",{className:cnMenu("List"),ref:u},e.map((a,b)=>{const c=i(a),d=h(a),e=d?k(a):void 0,f=g(a),n=d?"a":"span",q=l(a),r=o===b,u=!s[b];return React.createElement("li",{className:cnMenu("Item",{hidden:u}),key:cnMenu("Item",{index:b}),ref:t[b],onMouseEnter:()=>p(b)},_jsx(n,{className:cnMenu("Link",{active:f,opened:r}),href:d,target:e,onClick:getItemClick(a,j,m)},void 0,c," ",q&&_jsx(IconSelect,{size:"s",className:cnMenu("Arrow")})),_jsx(AnimatedContextMenu,{isOpen:q&&0<q.length&&r,items:q||[],getLabel:i,getSubItems:l,anchorRef:t[b],getOnClick:a=>getItemClick(a,j,m),direction:"downStartLeft",possibleDirections:["upStartLeft","downStartRight","downStartLeft","upStartRight"],spareDirection:"downStartLeft",getItemAs:z,getItemHTMLAttributes:A,style:{zIndex:B}}))}),0<v.length&&React.createElement("li",{className:cnMenu("Item"),key:cnMenu("Item",{more:!0}),ref:w,onMouseEnter:()=>p("more")},React.createElement(Button,{iconLeft:IconMeatball,ref:x,size:"xs",view:"clear"}),_jsx(AnimatedContextMenu,{isOpen:"more"===o,items:v,getLabel:i,getSubItems:l,anchorRef:x,getOnClick:a=>getItemClick(a,j,m),direction:"downStartLeft",possibleDirections:["upStartLeft","downStartRight","downStartLeft","upStartRight"],spareDirection:"downStartRight",getItemAs:z,getItemHTMLAttributes:A,style:{zIndex:B}}))))};export const Menu=forwardRef(MenuRender);export*from"./types";
|
|
1
|
+
import _jsx from"@babel/runtime/helpers/jsx";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";import React,{forwardRef,useState,useRef,useCallback,useEffect}from"react";import{IconSelect}from"@consta/uikit/IconSelect";import{Button}from"@consta/uikit/Button";import{IconMeatball}from"@consta/uikit/IconMeatball";import{useMutableRef}from"@consta/uikit/useMutableRef";import{useDebounce}from"@consta/uikit/useDebounce";import{useFlag}from"@consta/uikit/useFlag";import{AnimatedContextMenu}from"../__private__/AnimatedContextMenu/AnimatedContextMenu";import{cn}from"../__private__/utils/bem";import{useHideElementsLine}from"../__private__/hooks/useHideElementsLine";import{withDefaultGetters,getItemClick,animateTimeout}from"./helpers";import"./Menu.css";export const cnMenu=cn("Menu");const MenuRender=(a,b)=>{var c;const d=withDefaultGetters(a),{items:e,className:f,getItemActive:g,getItemHref:h,getItemLabel:i,getItemOnClick:j,getItemTarget:k,getItemSubMenu:l,onItemClick:m}=d,n=_objectWithoutProperties(d,["items","className","getItemActive","getItemHref","getItemLabel","getItemOnClick","getItemTarget","getItemSubMenu","onItemClick"]),[o,p]=useState(),[q,r]=useFlag(),{visibleItems:s,itemsRefs:t,wrapperRef:u,hiddenItems:v,moreRef:w}=useHideElementsLine(e),x=useRef(null),y=useMutableRef(h),z=useCallback(a=>y.current(a)?"a":"span",[]),A=useCallback(a=>y.current(a)?{href:y.current(a)}:{},[]),B="number"==typeof(null===(c=a.style)||void 0===c?void 0:c.zIndex)?a.style.zIndex+1:void 0;return useEffect(useDebounce(()=>{q||p(void 0)},animateTimeout),[q]),React.createElement("nav",Object.assign({},n,{className:cnMenu(null,[f]),onMouseLeave:r.off,onMouseEnter:r.on,ref:b}),React.createElement("ul",{className:cnMenu("List"),ref:u},e.map((a,b)=>{const c=i(a),d=h(a),e=d?k(a):void 0,f=g(a),n=d?"a":"span",q=l(a),r=o===b,u=!s[b];return React.createElement("li",{className:cnMenu("Item",{hidden:u}),key:cnMenu("Item",{index:b}),ref:t[b],onMouseEnter:()=>p(b)},_jsx(n,{className:cnMenu("Link",{active:f,opened:r}),href:d,target:e,onClick:getItemClick(a,j,m)},void 0,c," ",q&&_jsx(IconSelect,{size:"s",className:cnMenu("Arrow")})),_jsx(AnimatedContextMenu,{isOpen:q&&0<q.length&&r,items:q||[],getLabel:i,getSubItems:l,anchorRef:t[b],getOnClick:a=>getItemClick(a,j,m),direction:"downStartLeft",possibleDirections:["upStartLeft","downStartRight","downStartLeft","upStartRight"],spareDirection:"downStartLeft",getItemAs:z,getItemHTMLAttributes:A,style:{zIndex:B},offset:8}))}),0<v.length&&React.createElement("li",{className:cnMenu("Item"),key:cnMenu("Item",{more:!0}),ref:w,onMouseEnter:()=>p("more")},React.createElement(Button,{iconLeft:IconMeatball,ref:x,size:"xs",view:"clear"}),_jsx(AnimatedContextMenu,{isOpen:"more"===o,items:v,getLabel:i,getSubItems:l,anchorRef:x,getOnClick:a=>getItemClick(a,j,m),direction:"downStartLeft",possibleDirections:["upStartLeft","downStartRight","downStartLeft","upStartRight"],spareDirection:"downStartRight",getItemAs:z,getItemHTMLAttributes:A,style:{zIndex:B},offset:5}))))};export const Menu=forwardRef(MenuRender);export*from"./types";
|
|
2
2
|
//# sourceMappingURL=Menu.js.map
|
package/Menu/Menu.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Menu/Menu.tsx"],"names":["React","forwardRef","useState","useRef","useCallback","useEffect","IconSelect","Button","IconMeatball","useMutableRef","useDebounce","useFlag","AnimatedContextMenu","cn","useHideElementsLine","withDefaultGetters","getItemClick","animateTimeout","cnMenu","MenuRender","props","ref","items","className","getItemActive","getItemHref","getItemLabel","getItemOnClick","getItemTarget","getItemSubMenu","onItemClick","otherProps","openedSubMenu","setOpenedSubMenu","mouseOnMenu","setMouseOnMenu","visibleItems","itemsRefs","wrapperRef","hiddenItems","moreRef","moreButtonRef","getItemHrefRef","getItemAs","item","current","getItemHTMLAttributes","href","elementZIndex","style","zIndex","off","on","map","index","label","target","active","Tag","subItems","opened","hidden","length","contextMenuItem","more","Menu"],"mappings":"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","sourcesContent":["import React, { forwardRef, useState, useRef, useCallback, useEffect } from 'react'\n\nimport { IconSelect } from '@consta/uikit/IconSelect'\nimport { Button } from '@consta/uikit/Button'\nimport { IconMeatball } from '@consta/uikit/IconMeatball'\nimport { useMutableRef } from '@consta/uikit/useMutableRef'\nimport { useDebounce } from '@consta/uikit/useDebounce'\nimport { useFlag } from '@consta/uikit/useFlag'\n\nimport { AnimatedContextMenu } from '@/__private__/AnimatedContextMenu/AnimatedContextMenu'\n\nimport { cn } from '@/__private__/utils/bem'\nimport { useHideElementsLine } from '@/__private__/hooks/useHideElementsLine'\n\nimport { withDefaultGetters, getItemClick, animateTimeout } from './helpers'\nimport { MenuComponent, MenuProps } from './types'\nimport './Menu.css'\n\nexport const cnMenu = cn('Menu')\n\nconst MenuRender = (props: MenuProps, ref: React.Ref<HTMLDivElement>) => {\n const {\n items,\n className,\n getItemActive,\n getItemHref,\n getItemLabel,\n getItemOnClick,\n getItemTarget,\n getItemSubMenu,\n onItemClick,\n ...otherProps\n } = withDefaultGetters(props)\n\n const [openedSubMenu, setOpenedSubMenu] = useState<number | 'more' | undefined>()\n const [mouseOnMenu, setMouseOnMenu] = useFlag()\n\n const { visibleItems, itemsRefs, wrapperRef, hiddenItems, moreRef } = useHideElementsLine<\n HTMLLIElement,\n HTMLUListElement,\n typeof items[number]\n >(items)\n\n const moreButtonRef = useRef<HTMLButtonElement>(null)\n\n const getItemHrefRef = useMutableRef(getItemHref)\n\n const getItemAs = useCallback((item: typeof items[number]) => {\n if (!!getItemHrefRef.current(item)) {\n return 'a'\n }\n return 'span'\n }, [])\n\n const getItemHTMLAttributes = useCallback((item: typeof items[number]) => {\n if (!!getItemHrefRef.current(item)) {\n return { href: getItemHrefRef.current(item) }\n }\n return {}\n }, [])\n\n const elementZIndex = typeof props.style?.zIndex === 'number' ? props.style.zIndex + 1 : undefined\n\n useEffect(\n useDebounce(() => {\n if (!mouseOnMenu) {\n setOpenedSubMenu(undefined)\n }\n }, animateTimeout),\n [mouseOnMenu]\n )\n\n return (\n <nav\n {...otherProps}\n className={cnMenu(null, [className])}\n onMouseLeave={setMouseOnMenu.off}\n onMouseEnter={setMouseOnMenu.on}\n ref={ref}\n >\n <ul className={cnMenu('List')} ref={wrapperRef}>\n {items.map((item, index) => {\n const label = getItemLabel(item)\n const href = getItemHref(item)\n const target = href ? getItemTarget(item) : undefined\n const active = getItemActive(item)\n const Tag = href ? 'a' : 'span'\n const subItems = getItemSubMenu(item)\n const opened = openedSubMenu === index\n const hidden = !visibleItems[index]\n return (\n <li\n className={cnMenu('Item', { hidden })}\n key={cnMenu('Item', { index })}\n ref={itemsRefs[index]}\n onMouseEnter={() => setOpenedSubMenu(index)}\n >\n <Tag\n className={cnMenu('Link', { active, opened })}\n href={href}\n target={target}\n onClick={getItemClick(item, getItemOnClick, onItemClick)}\n >\n {label} {subItems && <IconSelect size=\"s\" className={cnMenu('Arrow')} />}\n </Tag>\n <AnimatedContextMenu\n isOpen={subItems && subItems.length > 0 && opened}\n items={subItems || []}\n getLabel={getItemLabel}\n getSubItems={getItemSubMenu}\n anchorRef={itemsRefs[index]}\n getOnClick={contextMenuItem =>\n getItemClick(contextMenuItem, getItemOnClick, onItemClick)\n }\n direction=\"downStartLeft\"\n possibleDirections={[\n 'upStartLeft',\n 'downStartRight',\n 'downStartLeft',\n 'upStartRight',\n ]}\n spareDirection=\"downStartLeft\"\n getItemAs={getItemAs}\n getItemHTMLAttributes={getItemHTMLAttributes}\n style={{ zIndex: elementZIndex }}\n />\n </li>\n )\n })}\n {hiddenItems.length > 0 && (\n <li\n className={cnMenu('Item')}\n key={cnMenu('Item', { more: true })}\n ref={moreRef}\n onMouseEnter={() => setOpenedSubMenu('more')}\n >\n <Button iconLeft={IconMeatball} ref={moreButtonRef} size=\"xs\" view=\"clear\" />\n <AnimatedContextMenu\n isOpen={openedSubMenu === 'more'}\n items={hiddenItems}\n getLabel={getItemLabel}\n getSubItems={getItemSubMenu}\n anchorRef={moreButtonRef}\n getOnClick={contextMenuItem =>\n getItemClick(contextMenuItem, getItemOnClick, onItemClick)\n }\n direction=\"downStartLeft\"\n possibleDirections={[\n 'upStartLeft',\n 'downStartRight',\n 'downStartLeft',\n 'upStartRight',\n ]}\n spareDirection=\"downStartRight\"\n getItemAs={getItemAs}\n getItemHTMLAttributes={getItemHTMLAttributes}\n style={{ zIndex: elementZIndex }}\n />\n </li>\n )}\n </ul>\n </nav>\n )\n}\n\nexport const Menu = forwardRef(MenuRender) as MenuComponent\n\nexport * from './types'\n"],"file":"Menu.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/Menu/Menu.tsx"],"names":["React","forwardRef","useState","useRef","useCallback","useEffect","IconSelect","Button","IconMeatball","useMutableRef","useDebounce","useFlag","AnimatedContextMenu","cn","useHideElementsLine","withDefaultGetters","getItemClick","animateTimeout","cnMenu","MenuRender","props","ref","items","className","getItemActive","getItemHref","getItemLabel","getItemOnClick","getItemTarget","getItemSubMenu","onItemClick","otherProps","openedSubMenu","setOpenedSubMenu","mouseOnMenu","setMouseOnMenu","visibleItems","itemsRefs","wrapperRef","hiddenItems","moreRef","moreButtonRef","getItemHrefRef","getItemAs","item","current","getItemHTMLAttributes","href","elementZIndex","style","zIndex","off","on","map","index","label","target","active","Tag","subItems","opened","hidden","length","contextMenuItem","more","Menu"],"mappings":"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","sourcesContent":["import React, { forwardRef, useState, useRef, useCallback, useEffect } from 'react'\n\nimport { IconSelect } from '@consta/uikit/IconSelect'\nimport { Button } from '@consta/uikit/Button'\nimport { IconMeatball } from '@consta/uikit/IconMeatball'\nimport { useMutableRef } from '@consta/uikit/useMutableRef'\nimport { useDebounce } from '@consta/uikit/useDebounce'\nimport { useFlag } from '@consta/uikit/useFlag'\n\nimport { AnimatedContextMenu } from '@/__private__/AnimatedContextMenu/AnimatedContextMenu'\n\nimport { cn } from '@/__private__/utils/bem'\nimport { useHideElementsLine } from '@/__private__/hooks/useHideElementsLine'\n\nimport { withDefaultGetters, getItemClick, animateTimeout } from './helpers'\nimport { MenuComponent, MenuProps } from './types'\nimport './Menu.css'\n\nexport const cnMenu = cn('Menu')\n\nconst MenuRender = (props: MenuProps, ref: React.Ref<HTMLDivElement>) => {\n const {\n items,\n className,\n getItemActive,\n getItemHref,\n getItemLabel,\n getItemOnClick,\n getItemTarget,\n getItemSubMenu,\n onItemClick,\n ...otherProps\n } = withDefaultGetters(props)\n\n const [openedSubMenu, setOpenedSubMenu] = useState<number | 'more' | undefined>()\n const [mouseOnMenu, setMouseOnMenu] = useFlag()\n\n const { visibleItems, itemsRefs, wrapperRef, hiddenItems, moreRef } = useHideElementsLine<\n HTMLLIElement,\n HTMLUListElement,\n typeof items[number]\n >(items)\n\n const moreButtonRef = useRef<HTMLButtonElement>(null)\n\n const getItemHrefRef = useMutableRef(getItemHref)\n\n const getItemAs = useCallback((item: typeof items[number]) => {\n if (!!getItemHrefRef.current(item)) {\n return 'a'\n }\n return 'span'\n }, [])\n\n const getItemHTMLAttributes = useCallback((item: typeof items[number]) => {\n if (!!getItemHrefRef.current(item)) {\n return { href: getItemHrefRef.current(item) }\n }\n return {}\n }, [])\n\n const elementZIndex = typeof props.style?.zIndex === 'number' ? props.style.zIndex + 1 : undefined\n\n useEffect(\n useDebounce(() => {\n if (!mouseOnMenu) {\n setOpenedSubMenu(undefined)\n }\n }, animateTimeout),\n [mouseOnMenu]\n )\n\n return (\n <nav\n {...otherProps}\n className={cnMenu(null, [className])}\n onMouseLeave={setMouseOnMenu.off}\n onMouseEnter={setMouseOnMenu.on}\n ref={ref}\n >\n <ul className={cnMenu('List')} ref={wrapperRef}>\n {items.map((item, index) => {\n const label = getItemLabel(item)\n const href = getItemHref(item)\n const target = href ? getItemTarget(item) : undefined\n const active = getItemActive(item)\n const Tag = href ? 'a' : 'span'\n const subItems = getItemSubMenu(item)\n const opened = openedSubMenu === index\n const hidden = !visibleItems[index]\n return (\n <li\n className={cnMenu('Item', { hidden })}\n key={cnMenu('Item', { index })}\n ref={itemsRefs[index]}\n onMouseEnter={() => setOpenedSubMenu(index)}\n >\n <Tag\n className={cnMenu('Link', { active, opened })}\n href={href}\n target={target}\n onClick={getItemClick(item, getItemOnClick, onItemClick)}\n >\n {label} {subItems && <IconSelect size=\"s\" className={cnMenu('Arrow')} />}\n </Tag>\n <AnimatedContextMenu\n isOpen={subItems && subItems.length > 0 && opened}\n items={subItems || []}\n getLabel={getItemLabel}\n getSubItems={getItemSubMenu}\n anchorRef={itemsRefs[index]}\n getOnClick={contextMenuItem =>\n getItemClick(contextMenuItem, getItemOnClick, onItemClick)\n }\n direction=\"downStartLeft\"\n possibleDirections={[\n 'upStartLeft',\n 'downStartRight',\n 'downStartLeft',\n 'upStartRight',\n ]}\n spareDirection=\"downStartLeft\"\n getItemAs={getItemAs}\n getItemHTMLAttributes={getItemHTMLAttributes}\n style={{ zIndex: elementZIndex }}\n offset={8}\n />\n </li>\n )\n })}\n {hiddenItems.length > 0 && (\n <li\n className={cnMenu('Item')}\n key={cnMenu('Item', { more: true })}\n ref={moreRef}\n onMouseEnter={() => setOpenedSubMenu('more')}\n >\n <Button iconLeft={IconMeatball} ref={moreButtonRef} size=\"xs\" view=\"clear\" />\n <AnimatedContextMenu\n isOpen={openedSubMenu === 'more'}\n items={hiddenItems}\n getLabel={getItemLabel}\n getSubItems={getItemSubMenu}\n anchorRef={moreButtonRef}\n getOnClick={contextMenuItem =>\n getItemClick(contextMenuItem, getItemOnClick, onItemClick)\n }\n direction=\"downStartLeft\"\n possibleDirections={[\n 'upStartLeft',\n 'downStartRight',\n 'downStartLeft',\n 'upStartRight',\n ]}\n spareDirection=\"downStartRight\"\n getItemAs={getItemAs}\n getItemHTMLAttributes={getItemHTMLAttributes}\n style={{ zIndex: elementZIndex }}\n offset={5}\n />\n </li>\n )}\n </ul>\n </nav>\n )\n}\n\nexport const Menu = forwardRef(MenuRender) as MenuComponent\n\nexport * from './types'\n"],"file":"Menu.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.che--AnimatedContextMenu_exit{pointer-events:none;opacity:0;transition:opacity .2s,transform .2s;transform:translateY(var(--space-s))}
|
|
1
|
+
.che--AnimatedContextMenu_exit.ContextMenuLevel{pointer-events:none;opacity:0!important;transition:opacity .2s,transform .2s!important;transform:translateY(var(--space-s))!important}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@consta/header",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.2.0",
|
|
4
4
|
"files": [
|
|
5
5
|
"*",
|
|
6
6
|
"!*.css.d.ts",
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
"access": "public"
|
|
19
19
|
},
|
|
20
20
|
"peerDependencies": {
|
|
21
|
-
"@consta/uikit": "^3.
|
|
21
|
+
"@consta/uikit": "^3.15.0"
|
|
22
22
|
},
|
|
23
23
|
"dependencies": {
|
|
24
24
|
"@bem-react/classname": "^1.5.8",
|