@consta/header 0.3.3 → 0.4.2

package/Menu/Menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Menu/Menu.tsx"],"names":["React","forwardRef","useState","useRef","useCallback","useEffect","IconSelect","Button","IconMeatball","useMutableRef","useDebounce","useFlag","AnimatedContextMenu","cn","useHideElementsInLine","animateTimeout","withDefaultGetters","getItemClick","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","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 { useHideElementsInLine } from '@consta/uikit/useHideElementsInLine'\n\nimport { animateTimeout } from '@consta/uikit/MixPopoverAnimate'\n\nimport { withDefaultGetters } from './helpers'\n\nimport { getItemClick } from '@/__private__/helpers/getItemClick'\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 } = 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 = 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"}
+{"version":3,"sources":["../../src/Menu/Menu.tsx"],"names":["React","forwardRef","useState","useRef","useCallback","useEffect","IconSelect","Button","IconMeatball","useMutableRef","useDebounce","useFlag","AnimatedContextMenu","cn","useHideElementsInLine","animateTimeout","withDefaultGetters","getItemClick","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","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 { useHideElementsInLine } from '@consta/uikit/useHideElementsInLine'\n\nimport { animateTimeout } from '@consta/uikit/MixPopoverAnimate'\n\nimport { withDefaultGetters } from './helpers'\n\nimport { getItemClick } from '@/__private__/helpers/getItemClick'\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 } = 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 = 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, 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              <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              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"],"file":"Menu.js"}

package/Menu/helpers.d.ts

@@ -30,7 +30,7 @@ export declare function withDefaultGetters<ITEM>(props: MenuProps<ITEM>): {
     getItemActive?: MenuPropGetItemActive<ITEM> | undefined;
     getItemOnClick?: MenuPropGetItemOnClick<ITEM> | undefined;
     getItemSubMenu?: MenuPropGetItemSubMenu<ITEM> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & import("react").RefAttributes<HTMLDivElement> & (ITEM extends {
+} & Omit<import("react").HTMLAttributes<HTMLDivElement>, "css" | "items" | "getItemLabel" | "onItemClick" | "getItemHref" | "getItemTarget" | "getItemOnClick" | "getItemActive" | "getItemSubMenu"> & import("react").RefAttributes<HTMLDivElement> & (ITEM extends {
     label: string;
 } ? {} : {
     getItemLabel: MenuPropGetItemLabel<ITEM>;