@consta/header 1.0.0 → 1.0.1

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/README.md CHANGED
@@ -1,63 +1,75 @@
1
- # [Дизайн-система Consta](http://consta.gazprom-neft.ru/) | Библиотека интерфейсных компонентов
1
+ # [Дизайн-система Consta](http://consta.design/) | Header
2
2
 
3
- Consta дизайн-система для разработки интерфейсов, написана на [React](https://reactjs.org/), сделана и поддерживается в «Газпром нефти».
3
+ Набор компонентов для создания шапки проекта.
4
4
 
5
- В дизайн-систему входит несколько библиотек. **Здесь — библиотека интерфейсных компонентов:** простые контролы, сложные блоки, темы и хуки. Все библиотеки представлены в виде компонентов и макетов в Figma.
5
+ # Как использовать
6
6
 
7
- ## Что входит в дизайн-систему
7
+ ## Установите пакет
8
8
 
9
- ### Библиотека компонентов
9
+ ```sh
10
+ # NPM
11
+ $ npm install @consta/header
12
+ # Yarn
13
+ $ yarn add @consta/header
14
+ ```
10
15
 
11
- [Репозиторий](https://github.com/consta-design-system/uikit) | [NPM](https://www.npmjs.com/package/@consta/uikit) | [Документация и стенд](http://uikit.gizeasy.ru/?path=/story/common-about--page) | [Макеты](https://www.figma.com/community/file/853774806786762374)
16
+ ## Подключите зависимости
12
17
 
13
- ### Библиотека графиков
18
+ Чтобы начать работу, установите библиотеку [`@consta/uikit`](https://www.npmjs.com/package/@consta/uikit) и [настройте тему](http://portal.consta.design/libs/portal/theme-themeabout).
14
19
 
15
- [Репозиторий](https://github.com/consta-design-system/charts) | [NPM](https://www.npmjs.com/package/@consta/charts) | [Документация и стенд](http://charts.gizeasy.ru) | [Макеты](https://www.figma.com/community/file/982611119114314434)
20
+ ### Можно использовать компоненты
16
21
 
17
- [>> Посмотреть все библиотеки](http://uikit.gizeasy.ru/?path=/docs/common-about-github--page)
22
+ Например, так:
18
23
 
19
- <hr>
24
+ ```js
25
+ import { Theme, presetGpnDefault } from '@consta/uikit/Theme';
26
+ import { Header } from '@consta/header';
27
+ const App = () => {
28
+ return (
29
+ <Theme preset={presetGpnDefault}>
30
+ <Header />
31
+ </Theme>
32
+ );
33
+ };
34
+ ```
20
35
 
21
- Подробности — на [на сайте дизайн-системы Consta](http://consta.gazprom-neft.ru/)
36
+ ## Разработка
22
37
 
23
- Следите за новостями и релизами в [телеграм-канале дизайн-системы](https://t.me/consta_ui_releases)
38
+ ### Подготовка окружения
24
39
 
25
- # Как использовать
40
+ Рабочее окружение должно содержать NodeJS и Yarn, необходимые версии можно узнать в файле [package.json](./package.json) в блоке **engines**.
26
41
 
27
- ## Установите пакет
42
+ Чтобы установить зависимости, выполните команду:
28
43
 
44
+ ```sh
45
+ $ yarn install
29
46
  ```
30
- yarn add @consta/uikit
31
- ```
32
-
33
- ## Начните работу с библиотекой
34
47
 
35
- Чтобы начать работу с библиотекой интерфейсных компонентов, подключите тему:
36
-
37
- ```tsx
38
- import React from 'react';
39
- import { Theme, presetGpnDefault } from '@consta/uikit/Theme';
40
- import { Button } from '@consta/uikit/Button';
41
-
42
- const App = () => (
43
- <Theme preset={presetGpnDefault}>
44
- <Button label="Кнопка" />
45
- </Theme>
46
- );
48
+ ### Основные команды
49
+
50
+ ```sh
51
+ # Сборка и старт
52
+ $ yarn start
53
+ # Сборка для production
54
+ $ yarn build
55
+ # Линтинг всех файлов
56
+ $ yarn lint
57
+ # Форматирование всех файлов prettier
58
+ $ yarn format
59
+ # Запуск юнит-тестов
60
+ $ yarn unit
61
+ # Запуск юнит-тестов, тестирование TS, линтинг файлов
62
+ $ yarn test
47
63
  ```
48
64
 
49
- [Что такое темы и как с ними работать](http://uikit.gizeasy.ru/?path=/docs/thematization-what-are-themes--page)
50
-
51
- ## Документация и стенд
52
-
53
- На стенде можно менять параметры и смотреть, как меняются компоненты. Документация — во вкладке у каждого компонента.
65
+ ## Документация
54
66
 
55
- [Вперёд, к стенду](http://uikit.gizeasy.ru/)
67
+ [Посмотреть документацию и примеры](http://header.consta.design/)
56
68
 
57
69
  ## Контрибьюторам
58
70
 
59
- Будем рады, если вы захотите принять участие в разработке дизайн-системы =) Но сначала прочитайте [инструкцию для контрибьюторов](http://uikit.gizeasy.ru/?path=/docs/common-develop-contributors--page).
71
+ Будем рады, если вы захотите принять участие в разработке дизайн-системы =) Но сначала прочитайте [инструкцию для контрибьюторов](http://portal.consta.design/libs/portal/custom-contribute).
60
72
 
61
73
  ## Лицензия
62
74
 
63
- Дизайн-систему можно использовать бесплатно, она распространяется ПАО «Газпром нефть» на условиях открытой [лицензии MIT](https://consta.gazprom-neft.ru/static/licence_mit.pdf).
75
+ Дизайн-систему можно использовать бесплатно, она распространяется на условиях открытой [лицензии MIT](https://consta.design/static/licence_mit.pdf).
@@ -1 +1 @@
1
- .che--LayoutRow{background-color:var(--color-bg-default);border-bottom:1px solid var(--color-bg-border);box-sizing:border-box;display:flex;height:var(--header-height);padding:0 var(--space-xl);width:100%}.che--LayoutRow_height_m{--header-height:60px}.che--LayoutRow_height_s{--header-height:40px}.che--LayoutRow-Side{align-items:center;display:flex;flex:1 1 auto}.che--LayoutRow-Side_position_left{justify-content:flex-start}.che--LayoutRow-Side_position_right{justify-content:flex-end}.che--LayoutRow-Side_position_center{flex:0;justify-content:center}
1
+ .che--LayoutRow{background-color:var(--color-bg-default);border-bottom:1px solid var(--color-bg-border);box-sizing:border-box;display:flex;height:var(--header-height);padding:0 var(--space-xl);width:100%}.che--LayoutRow_height_m{--header-height:60px}.che--LayoutRow_height_s{--header-height:40px}.che--LayoutRow-Side{align-items:center;display:flex;flex:1 1 auto}.che--LayoutRow-Side_position_left{justify-content:flex-start}.che--LayoutRow-Side_position_right{justify-content:flex-end}.che--LayoutRow-Side_position_center{justify-content:center}
@@ -1 +1 @@
1
- .che--Menu-List{list-style-type:none;margin:0;padding:0}.che--Menu-Item,.che--Menu-List{align-items:center;display:flex;height:100%}.che--Menu-Item{--text-color:var(--color-typo-secondary);color:var(--text-color);margin-right:var(--space-m);position:relative;transition:color .2s}.che--Menu-Item:hover,.che--Menu-Item_opened{--text-color:var(--color-typo-primary)}.che--Menu-Item:last-child{margin-right:0}.che--Menu-Item_hidden{left:-300vw;position:absolute;top:-300vh;visibility:hidden}.che--Menu-Item_active{--text-color:var(--color-typo-primary)}.che--Menu-Item_active:before{background-color:var(--color-typo-link);bottom:0;content:"";height:2px;left:0;position:absolute;width:100%}.che--Menu-Link{align-items:center;color:var(--text-color);cursor:pointer;display:flex;height:100%;position:relative;text-decoration:none}.che--Menu-Arrow{margin-left:var(--space-2xs)}
1
+ .che--Menu_width_full{width:100%}.che--Menu-List{list-style-type:none;margin:0;padding:0}.che--Menu-Item,.che--Menu-List{align-items:center;display:flex;height:100%}.che--Menu-Item{--text-color:var(--color-typo-secondary);color:var(--text-color);margin-right:var(--space-m);position:relative;transition:color .2s}.che--Menu-Item:hover,.che--Menu-Item_opened{--text-color:var(--color-typo-primary)}.che--Menu-Item:last-child{margin-right:0}.che--Menu-Item_hidden{left:-300vw;position:absolute;top:-300vh;visibility:hidden}.che--Menu-Item_active{--text-color:var(--color-typo-primary)}.che--Menu-Item_active:before{background-color:var(--color-typo-link);bottom:0;content:"";height:2px;left:0;position:absolute;width:100%}.che--Menu-Link{align-items:center;color:var(--text-color);cursor:pointer;display:flex;height:100%;position:relative;text-decoration:none}.che--Menu-Arrow{margin-left:var(--space-2xs)}
@@ -1,2 +1,2 @@
1
- import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";const _excluded=["items","className","getItemActive","getItemHref","getItemLabel","getItemOnClick","getItemTarget","getItemSubMenu","onItemClick"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"./Menu.css";import{Button}from"@consta/uikit/Button";import{ContextMenu}from"@consta/uikit/ContextMenu";import{IconMeatball}from"@consta/uikit/IconMeatball";import{IconSelect}from"@consta/uikit/IconSelect";import{animateTimeout}from"@consta/uikit/MixPopoverAnimate";import{useDebounce}from"@consta/uikit/useDebounce";import{useFlag}from"@consta/uikit/useFlag";import{useHideElementsInLine}from"@consta/uikit/useHideElementsInLine";import{useMutableRef}from"@consta/uikit/useMutableRef";import React,{forwardRef,useCallback,useEffect,useRef,useState}from"react";import{getItemClick}from"../../helpers/getItemClick";import{cn}from"../../utils/bem";import{withDefaultGetters}from"./helpers";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,_excluded),[o,p]=useState(),[q,r]=useFlag(),{visibleItems:s,itemsRefs:t,wrapperRef:u,hiddenItems:v,moreRef:w}=useHideElementsInLine(e),x=useRef(null),y=useMutableRef(h),z=useMutableRef(k),A=useCallback(a=>y.current(a)?"a":"span",[]),B=useCallback(a=>{const b=y.current(a),c=z.current(a);return _objectSpread(_objectSpread({},b&&{href:y.current(a)}),c&&{href:z.current(a)})},[]),C="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,active:f,opened:r}),key:cnMenu("Item",{index:b}),ref:t[b],onMouseEnter:()=>p(b)},React.createElement(n,{className:cnMenu("Link"),href:d,target:e,onClick:getItemClick(a,j,m)},c),q&&React.createElement(IconSelect,{size:"s",className:cnMenu("Arrow")}),React.createElement(ContextMenu,{isOpen:q&&0<q.length&&r,items:q||[],getItemLabel:i,getItemSubMenu:l,anchorRef:t[b],onItemClick:({e:a,item:b})=>getItemClick(b,j,m)(a),direction:"downStartLeft",possibleDirections:["upStartLeft","downStartRight","downStartLeft","upStartRight"],spareDirection:"downStartLeft",getItemAs:A,getItemAttributes:B,style:{zIndex:C}}))}),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"}),React.createElement(ContextMenu,{isOpen:"more"===o,items:v,getItemLabel:i,getItemSubMenu:l,anchorRef:x,onItemClick:({e:a,item:b})=>getItemClick(b,j,m)(a),direction:"downStartLeft",possibleDirections:["upStartLeft","downStartRight","downStartLeft","upStartRight"],spareDirection:"downStartRight",getItemAs:A,getItemAttributes:B,style:{zIndex:C},offset:8}))))};export const Menu=forwardRef(MenuRender);export*from"./types";
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";const _excluded=["items","className","width","getItemActive","getItemHref","getItemLabel","getItemOnClick","getItemTarget","getItemSubMenu","onItemClick"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"./Menu.css";import{Button}from"@consta/uikit/Button";import{ContextMenu}from"@consta/uikit/ContextMenu";import{IconMeatball}from"@consta/uikit/IconMeatball";import{IconSelect}from"@consta/uikit/IconSelect";import{animateTimeout}from"@consta/uikit/MixPopoverAnimate";import{useDebounce}from"@consta/uikit/useDebounce";import{useFlag}from"@consta/uikit/useFlag";import{useHideElementsInLine}from"@consta/uikit/useHideElementsInLine";import{useMutableRef}from"@consta/uikit/useMutableRef";import React,{forwardRef,useCallback,useEffect,useRef,useState}from"react";import{getItemClick}from"../../helpers/getItemClick";import{cn}from"../../utils/bem";import{withDefaultGetters}from"./helpers";export const cnMenu=cn("Menu");const MenuRender=(a,b)=>{var c;const d=withDefaultGetters(a),{items:e,className:f,width:g,getItemActive:h,getItemHref:i,getItemLabel:j,getItemOnClick:k,getItemTarget:l,getItemSubMenu:m,onItemClick:n}=d,o=_objectWithoutProperties(d,_excluded),[p,q]=useState(),[r,s]=useFlag(),{visibleItems:t,itemsRefs:u,wrapperRef:v,hiddenItems:w,moreRef:x}=useHideElementsInLine(e),y=useRef(null),z=useMutableRef(i),A=useMutableRef(l),B=useCallback(a=>z.current(a)?"a":"span",[]),C=useCallback(a=>{const b=z.current(a),c=A.current(a);return _objectSpread(_objectSpread({},b&&{href:z.current(a)}),c&&{href:A.current(a)})},[]),D="number"==typeof(null===(c=a.style)||void 0===c?void 0:c.zIndex)?a.style.zIndex+1:void 0;return useEffect(useDebounce(()=>{r||q(void 0)},animateTimeout),[r]),React.createElement("nav",Object.assign({},o,{className:cnMenu({width:g},[f]),onMouseLeave:s.off,onMouseEnter:s.on,ref:b}),React.createElement("ul",{className:cnMenu("List"),ref:v},e.map((a,b)=>{const c=j(a),d=i(a),e=d?l(a):void 0,f=h(a),g=d?"a":"span",o=m(a),r=p===b,s=!t[b];return React.createElement("li",{className:cnMenu("Item",{hidden:s,active:f,opened:r}),key:cnMenu("Item",{index:b}),ref:u[b],onMouseEnter:()=>q(b)},React.createElement(g,{className:cnMenu("Link"),href:d,target:e,onClick:getItemClick(a,k,n)},c),o&&React.createElement(IconSelect,{size:"s",className:cnMenu("Arrow")}),React.createElement(ContextMenu,{isOpen:o&&0<o.length&&r,items:o||[],getItemLabel:j,getItemSubMenu:m,anchorRef:u[b],onItemClick:({e:a,item:b})=>getItemClick(b,k,n)(a),direction:"downStartLeft",possibleDirections:["upStartLeft","downStartRight","downStartLeft","upStartRight"],spareDirection:"downStartLeft",getItemAs:B,getItemAttributes:C,style:{zIndex:D}}))}),0<w.length&&React.createElement("li",{className:cnMenu("Item"),key:cnMenu("Item",{more:!0}),ref:x,onMouseEnter:()=>q("more")},React.createElement(Button,{iconLeft:IconMeatball,ref:y,size:"xs",view:"clear"}),React.createElement(ContextMenu,{isOpen:"more"===p,items:w,getItemLabel:j,getItemSubMenu:m,anchorRef:y,onItemClick:({e:a,item:b})=>getItemClick(b,k,n)(a),direction:"downStartLeft",possibleDirections:["upStartLeft","downStartRight","downStartLeft","upStartRight"],spareDirection:"downStartRight",getItemAs:B,getItemAttributes:C,style:{zIndex:D},offset:8}))))};export const Menu=forwardRef(MenuRender);export*from"./types";
2
2
  //# sourceMappingURL=Menu.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Menu.js","names":["Button","ContextMenu","IconMeatball","IconSelect","animateTimeout","useDebounce","useFlag","useHideElementsInLine","useMutableRef","React","forwardRef","useCallback","useEffect","useRef","useState","getItemClick","cn","withDefaultGetters","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","getItemTargetRef","getItemAs","item","current","getItemHTMLAttributes","href","target","elementZIndex","style","zIndex","off","on","map","index","label","active","Tag","subItems","opened","hidden","length","e","more","Menu"],"sources":["../../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import './Menu.css';\n\nimport { Button } from '@consta/uikit/Button';\nimport { ContextMenu } from '@consta/uikit/ContextMenu';\nimport { IconMeatball } from '@consta/uikit/IconMeatball';\nimport { IconSelect } from '@consta/uikit/IconSelect';\nimport { animateTimeout } from '@consta/uikit/MixPopoverAnimate';\nimport { useDebounce } from '@consta/uikit/useDebounce';\nimport { useFlag } from '@consta/uikit/useFlag';\nimport { useHideElementsInLine } from '@consta/uikit/useHideElementsInLine';\nimport { useMutableRef } from '@consta/uikit/useMutableRef';\nimport React, {\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nimport { getItemClick } from '##/helpers/getItemClick';\nimport { cn } from '##/utils/bem';\n\nimport { withDefaultGetters } from './helpers';\nimport { MenuComponent, MenuProps } from './types';\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<\n number | 'more' | undefined\n >();\n const [mouseOnMenu, setMouseOnMenu] = useFlag();\n\n const { visibleItems, itemsRefs, wrapperRef, hiddenItems, moreRef } =\n useHideElementsInLine<\n typeof items[number],\n HTMLLIElement,\n HTMLUListElement\n >(items);\n\n const moreButtonRef = useRef<HTMLButtonElement>(null);\n\n const getItemHrefRef = useMutableRef(getItemHref);\n const getItemTargetRef = useMutableRef(getItemTarget);\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 const href = getItemHrefRef.current(item);\n const target = getItemTargetRef.current(item);\n\n return {\n ...(href && { href: getItemHrefRef.current(item) }),\n ...(target && { href: getItemTargetRef.current(item) }),\n };\n }, []);\n\n const elementZIndex =\n typeof props.style?.zIndex === 'number'\n ? props.style.zIndex + 1\n : 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, active, opened })}\n key={cnMenu('Item', { index })}\n ref={itemsRefs[index]}\n onMouseEnter={() => setOpenedSubMenu(index)}\n >\n <Tag\n className={cnMenu('Link')}\n href={href}\n target={target}\n onClick={getItemClick(item, getItemOnClick, onItemClick)}\n >\n {label}\n </Tag>\n {subItems && <IconSelect size=\"s\" className={cnMenu('Arrow')} />}\n <ContextMenu\n isOpen={subItems && subItems.length > 0 && opened}\n items={subItems || []}\n getItemLabel={getItemLabel}\n getItemSubMenu={getItemSubMenu}\n anchorRef={itemsRefs[index]}\n onItemClick={({ e, item }) =>\n getItemClick(item, getItemOnClick, onItemClick)(e)\n }\n direction=\"downStartLeft\"\n possibleDirections={[\n 'upStartLeft',\n 'downStartRight',\n 'downStartLeft',\n 'upStartRight',\n ]}\n spareDirection=\"downStartLeft\"\n getItemAs={getItemAs}\n getItemAttributes={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\n iconLeft={IconMeatball}\n ref={moreButtonRef}\n size=\"xs\"\n view=\"clear\"\n />\n <ContextMenu\n isOpen={openedSubMenu === 'more'}\n items={hiddenItems}\n getItemLabel={getItemLabel}\n getItemSubMenu={getItemSubMenu}\n anchorRef={moreButtonRef}\n onItemClick={({ e, item }) =>\n getItemClick(item, getItemOnClick, onItemClick)(e)\n }\n direction=\"downStartLeft\"\n possibleDirections={[\n 'upStartLeft',\n 'downStartRight',\n 'downStartLeft',\n 'upStartRight',\n ]}\n spareDirection=\"downStartRight\"\n getItemAs={getItemAs}\n getItemAttributes={getItemHTMLAttributes}\n style={{ zIndex: elementZIndex }}\n offset={8}\n />\n </li>\n )}\n </ul>\n </nav>\n );\n};\n\nexport const Menu = forwardRef(MenuRender) as MenuComponent;\n\nexport * from './types';\n"],"mappings":"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"}
1
+ {"version":3,"file":"Menu.js","names":["Button","ContextMenu","IconMeatball","IconSelect","animateTimeout","useDebounce","useFlag","useHideElementsInLine","useMutableRef","React","forwardRef","useCallback","useEffect","useRef","useState","getItemClick","cn","withDefaultGetters","cnMenu","MenuRender","props","ref","items","className","width","getItemActive","getItemHref","getItemLabel","getItemOnClick","getItemTarget","getItemSubMenu","onItemClick","otherProps","openedSubMenu","setOpenedSubMenu","mouseOnMenu","setMouseOnMenu","visibleItems","itemsRefs","wrapperRef","hiddenItems","moreRef","moreButtonRef","getItemHrefRef","getItemTargetRef","getItemAs","item","current","getItemHTMLAttributes","href","target","elementZIndex","style","zIndex","off","on","map","index","label","active","Tag","subItems","opened","hidden","length","e","more","Menu"],"sources":["../../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import './Menu.css';\n\nimport { Button } from '@consta/uikit/Button';\nimport { ContextMenu } from '@consta/uikit/ContextMenu';\nimport { IconMeatball } from '@consta/uikit/IconMeatball';\nimport { IconSelect } from '@consta/uikit/IconSelect';\nimport { animateTimeout } from '@consta/uikit/MixPopoverAnimate';\nimport { useDebounce } from '@consta/uikit/useDebounce';\nimport { useFlag } from '@consta/uikit/useFlag';\nimport { useHideElementsInLine } from '@consta/uikit/useHideElementsInLine';\nimport { useMutableRef } from '@consta/uikit/useMutableRef';\nimport React, {\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nimport { getItemClick } from '##/helpers/getItemClick';\nimport { cn } from '##/utils/bem';\n\nimport { withDefaultGetters } from './helpers';\nimport { MenuComponent, MenuProps } from './types';\n\nexport const cnMenu = cn('Menu');\n\nconst MenuRender = (props: MenuProps, ref: React.Ref<HTMLDivElement>) => {\n const {\n items,\n className,\n width,\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<\n number | 'more' | undefined\n >();\n const [mouseOnMenu, setMouseOnMenu] = useFlag();\n\n const { visibleItems, itemsRefs, wrapperRef, hiddenItems, moreRef } =\n useHideElementsInLine<\n typeof items[number],\n HTMLLIElement,\n HTMLUListElement\n >(items);\n\n const moreButtonRef = useRef<HTMLButtonElement>(null);\n\n const getItemHrefRef = useMutableRef(getItemHref);\n const getItemTargetRef = useMutableRef(getItemTarget);\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 const href = getItemHrefRef.current(item);\n const target = getItemTargetRef.current(item);\n\n return {\n ...(href && { href: getItemHrefRef.current(item) }),\n ...(target && { href: getItemTargetRef.current(item) }),\n };\n }, []);\n\n const elementZIndex =\n typeof props.style?.zIndex === 'number'\n ? props.style.zIndex + 1\n : 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({ width }, [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, active, opened })}\n key={cnMenu('Item', { index })}\n ref={itemsRefs[index]}\n onMouseEnter={() => setOpenedSubMenu(index)}\n >\n <Tag\n className={cnMenu('Link')}\n href={href}\n target={target}\n onClick={getItemClick(item, getItemOnClick, onItemClick)}\n >\n {label}\n </Tag>\n {subItems && <IconSelect size=\"s\" className={cnMenu('Arrow')} />}\n <ContextMenu\n isOpen={subItems && subItems.length > 0 && opened}\n items={subItems || []}\n getItemLabel={getItemLabel}\n getItemSubMenu={getItemSubMenu}\n anchorRef={itemsRefs[index]}\n onItemClick={({ e, item }) =>\n getItemClick(item, getItemOnClick, onItemClick)(e)\n }\n direction=\"downStartLeft\"\n possibleDirections={[\n 'upStartLeft',\n 'downStartRight',\n 'downStartLeft',\n 'upStartRight',\n ]}\n spareDirection=\"downStartLeft\"\n getItemAs={getItemAs}\n getItemAttributes={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\n iconLeft={IconMeatball}\n ref={moreButtonRef}\n size=\"xs\"\n view=\"clear\"\n />\n <ContextMenu\n isOpen={openedSubMenu === 'more'}\n items={hiddenItems}\n getItemLabel={getItemLabel}\n getItemSubMenu={getItemSubMenu}\n anchorRef={moreButtonRef}\n onItemClick={({ e, item }) =>\n getItemClick(item, getItemOnClick, onItemClick)(e)\n }\n direction=\"downStartLeft\"\n possibleDirections={[\n 'upStartLeft',\n 'downStartRight',\n 'downStartLeft',\n 'upStartRight',\n ]}\n spareDirection=\"downStartRight\"\n getItemAs={getItemAs}\n getItemAttributes={getItemHTMLAttributes}\n style={{ zIndex: elementZIndex }}\n offset={8}\n />\n </li>\n )}\n </ul>\n </nav>\n );\n};\n\nexport const Menu = forwardRef(MenuRender) as MenuComponent;\n\nexport * from './types';\n"],"mappings":"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"}
@@ -23,6 +23,7 @@ export declare const getGetters: <ITEM>(props: {
23
23
  };
24
24
  export declare function withDefaultGetters<ITEM>(props: MenuProps<ITEM>): {
25
25
  items: ITEM[];
26
+ width?: "full" | undefined;
26
27
  onItemClick?: import("./types").MenuPropOnItemClick<ITEM> | undefined;
27
28
  getItemHref?: MenuPropGetItemHref<ITEM> | undefined;
28
29
  getItemLabel?: MenuPropGetItemLabel<ITEM> | undefined;
@@ -30,7 +31,7 @@ export declare function withDefaultGetters<ITEM>(props: MenuProps<ITEM>): {
30
31
  getItemActive?: MenuPropGetItemActive<ITEM> | undefined;
31
32
  getItemOnClick?: MenuPropGetItemOnClick<ITEM> | undefined;
32
33
  getItemSubMenu?: MenuPropGetItemSubMenu<ITEM> | undefined;
33
- } & Omit<import("react").HTMLAttributes<HTMLDivElement>, "css" | "items" | "getItemLabel" | "onItemClick" | "getItemHref" | "getItemTarget" | "getItemOnClick" | "getItemSubMenu" | "getItemActive"> & import("react").RefAttributes<HTMLDivElement> & (ITEM extends {
34
+ } & Omit<import("react").HTMLAttributes<HTMLDivElement>, "css" | "items" | "getItemLabel" | "width" | "onItemClick" | "getItemHref" | "getItemTarget" | "getItemOnClick" | "getItemSubMenu" | "getItemActive"> & import("react").RefAttributes<HTMLDivElement> & (ITEM extends {
34
35
  label: string;
35
36
  } ? {} : {
36
37
  getItemLabel: MenuPropGetItemLabel<ITEM>;
@@ -20,6 +20,7 @@ export declare type MenuPropOnItemClick<ITEM> = (props: {
20
20
  }) => void;
21
21
  export declare type MenuProps<ITEM = MenuDefaultItem> = PropsWithHTMLAttributesAndRef<{
22
22
  items: ITEM[];
23
+ width?: 'full';
23
24
  onItemClick?: MenuPropOnItemClick<ITEM>;
24
25
  getItemHref?: MenuPropGetItemHref<ITEM>;
25
26
  getItemLabel?: MenuPropGetItemLabel<ITEM>;
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","names":[],"sources":["../../../../../src/components/Menu/types.ts"],"sourcesContent":["import { PropsWithHTMLAttributesAndRef } from '##/utils/types/PropsWithHTMLAttributes';\n\nexport type MenuDefaultItem = {\n label: string;\n href?: string;\n target?: string;\n active?: boolean;\n onClick?: React.EventHandler<React.MouseEvent>;\n subMenu?: MenuDefaultItem[];\n};\n\nexport type MenuPropGetItemLabel<ITEM> = (item: ITEM) => string;\nexport type MenuPropGetItemHref<ITEM> = (item: ITEM) => string | undefined;\nexport type MenuPropGetItemTarget<ITEM> = (item: ITEM) => string | undefined;\nexport type MenuPropGetItemActive<ITEM> = (item: ITEM) => boolean | undefined;\nexport type MenuPropGetItemSubMenu<ITEM> = (item: ITEM) => ITEM[] | undefined;\nexport type MenuPropGetItemOnClick<ITEM> = (\n item: ITEM,\n) => React.EventHandler<React.MouseEvent> | undefined;\nexport type MenuPropOnItemClick<ITEM> = (props: {\n e: React.MouseEvent;\n item: ITEM;\n}) => void;\n\nexport type MenuProps<ITEM = MenuDefaultItem> = PropsWithHTMLAttributesAndRef<\n {\n items: ITEM[];\n onItemClick?: MenuPropOnItemClick<ITEM>;\n getItemHref?: MenuPropGetItemHref<ITEM>;\n getItemLabel?: MenuPropGetItemLabel<ITEM>;\n getItemTarget?: MenuPropGetItemTarget<ITEM>;\n getItemActive?: MenuPropGetItemActive<ITEM>;\n getItemOnClick?: MenuPropGetItemOnClick<ITEM>;\n getItemSubMenu?: MenuPropGetItemSubMenu<ITEM>;\n },\n HTMLDivElement\n> &\n (ITEM extends { label: MenuDefaultItem['label'] }\n ? {}\n : { getItemLabel: MenuPropGetItemLabel<ITEM> });\n\nexport type MenuComponent = <ITEM = MenuDefaultItem>(\n props: MenuProps<ITEM>,\n) => React.ReactElement | null;\n"],"mappings":""}
1
+ {"version":3,"file":"types.js","names":[],"sources":["../../../../../src/components/Menu/types.ts"],"sourcesContent":["import { PropsWithHTMLAttributesAndRef } from '##/utils/types/PropsWithHTMLAttributes';\n\nexport type MenuDefaultItem = {\n label: string;\n href?: string;\n target?: string;\n active?: boolean;\n onClick?: React.EventHandler<React.MouseEvent>;\n subMenu?: MenuDefaultItem[];\n};\n\nexport type MenuPropGetItemLabel<ITEM> = (item: ITEM) => string;\nexport type MenuPropGetItemHref<ITEM> = (item: ITEM) => string | undefined;\nexport type MenuPropGetItemTarget<ITEM> = (item: ITEM) => string | undefined;\nexport type MenuPropGetItemActive<ITEM> = (item: ITEM) => boolean | undefined;\nexport type MenuPropGetItemSubMenu<ITEM> = (item: ITEM) => ITEM[] | undefined;\nexport type MenuPropGetItemOnClick<ITEM> = (\n item: ITEM,\n) => React.EventHandler<React.MouseEvent> | undefined;\nexport type MenuPropOnItemClick<ITEM> = (props: {\n e: React.MouseEvent;\n item: ITEM;\n}) => void;\n\nexport type MenuProps<ITEM = MenuDefaultItem> = PropsWithHTMLAttributesAndRef<\n {\n items: ITEM[];\n width?: 'full';\n onItemClick?: MenuPropOnItemClick<ITEM>;\n getItemHref?: MenuPropGetItemHref<ITEM>;\n getItemLabel?: MenuPropGetItemLabel<ITEM>;\n getItemTarget?: MenuPropGetItemTarget<ITEM>;\n getItemActive?: MenuPropGetItemActive<ITEM>;\n getItemOnClick?: MenuPropGetItemOnClick<ITEM>;\n getItemSubMenu?: MenuPropGetItemSubMenu<ITEM>;\n },\n HTMLDivElement\n> &\n (ITEM extends { label: MenuDefaultItem['label'] }\n ? {}\n : { getItemLabel: MenuPropGetItemLabel<ITEM> });\n\nexport type MenuComponent = <ITEM = MenuDefaultItem>(\n props: MenuProps<ITEM>,\n) => React.ReactElement | null;\n"],"mappings":""}
@@ -0,0 +1,2 @@
1
+ declare const _default: import("@consta/stand").CreatedStand;
2
+ export default _default;
@@ -0,0 +1,2 @@
1
+ import{createStand}from"../../stand/standConfig";export default createStand({title:"\u0411\u044B\u0441\u0442\u0440\u044B\u0439 \u0441\u0442\u0430\u0440\u0442",id:"start",group:"docs",order:10});
2
+ //# sourceMappingURL=start.stand.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"start.stand.js","names":["createStand","title","id","group","order"],"sources":["../../../../../src/docs/start/start.stand.tsx"],"sourcesContent":["import { createStand } from '##/stand/standConfig';\n\nexport default createStand({\n title: 'Быстрый старт',\n id: 'start',\n group: 'docs',\n order: 10,\n});\n"],"mappings":"AAAA,OAASA,WAAT,+BAEA,cAAeA,YAAW,CAAC,CACzBC,KAAK,CAAE,2EADkB,CAEzBC,EAAE,CAAE,OAFqB,CAGzBC,KAAK,CAAE,MAHkB,CAIzBC,KAAK,CAAE,EAJkB,CAAD,CAA1B"}
@@ -0,0 +1 @@
1
+ export declare const createStand: (standProps: import("@consta/stand").Stand<string>) => import("@consta/stand").CreatedStand;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@consta/header",
3
- "version": "1.0.0",
3
+ "version": "1.0.1",
4
4
  "files": [
5
5
  "*",
6
6
  "!**/__mocks__",