@wordpress/components
Version:
UI components for WordPress.
8 lines (7 loc) • 4.23 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../../src/navigation/menu/menu-title.tsx"],
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useRef, useState } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Icon, search as searchIcon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { getAnimateClassName } from '../../animate';\nimport Button from '../../button';\nimport MenuTitleSearch from './menu-title-search';\nimport { GroupTitleUI, MenuTitleActionsUI, MenuTitleUI } from '../styles/navigation-styles';\nimport { useNavigationMenuContext } from './context';\nimport { SEARCH_FOCUS_DELAY } from '../constants';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nexport default function NavigationMenuTitle({\n hasSearch,\n onSearch,\n search,\n title,\n titleAction\n}) {\n const [isSearching, setIsSearching] = useState(false);\n const {\n menu\n } = useNavigationMenuContext();\n const searchButtonRef = useRef(null);\n if (!title) {\n return null;\n }\n const onCloseSearch = () => {\n setIsSearching(false);\n\n // Wait for the slide-in animation to complete before focusing the search button.\n // eslint-disable-next-line @wordpress/react-no-unsafe-timeout\n setTimeout(() => {\n searchButtonRef.current?.focus();\n }, SEARCH_FOCUS_DELAY);\n };\n const menuTitleId = `components-navigation__menu-title-${menu}`;\n /* translators: search button label for menu search box. %s: menu title */\n const searchButtonLabel = sprintf(__('Search in %s'), title);\n return /*#__PURE__*/_jsxs(MenuTitleUI, {\n className: \"components-navigation__menu-title\",\n children: [!isSearching && /*#__PURE__*/_jsxs(GroupTitleUI, {\n as: \"h2\",\n className: \"components-navigation__menu-title-heading\",\n level: 3,\n children: [/*#__PURE__*/_jsx(\"span\", {\n id: menuTitleId,\n children: title\n }), (hasSearch || titleAction) && /*#__PURE__*/_jsxs(MenuTitleActionsUI, {\n children: [titleAction, hasSearch && /*#__PURE__*/_jsx(Button, {\n size: \"small\",\n variant: \"tertiary\",\n label: searchButtonLabel,\n onClick: () => setIsSearching(true),\n ref: searchButtonRef,\n children: /*#__PURE__*/_jsx(Icon, {\n icon: searchIcon\n })\n })]\n })]\n }), isSearching && /*#__PURE__*/_jsx(\"div\", {\n className: getAnimateClassName({\n type: 'slide-in',\n origin: 'left'\n }),\n children: /*#__PURE__*/_jsx(MenuTitleSearch, {\n onCloseSearch: onCloseSearch,\n onSearch: onSearch,\n search: search,\n title: title\n })\n })]\n });\n}"],
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAiC;AACjC,kBAA4B;AAC5B,mBAA2C;AAK3C,qBAAoC;AACpC,oBAAmB;AACnB,+BAA4B;AAC5B,+BAA8D;AAC9D,qBAAyC;AACzC,uBAAmC;AACnC,yBAA2C;AAC5B,SAAR,oBAAqC;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAG;AACD,QAAM,CAAC,aAAa,cAAc,QAAI,yBAAS,KAAK;AACpD,QAAM;AAAA,IACJ;AAAA,EACF,QAAI,yCAAyB;AAC7B,QAAM,sBAAkB,uBAAO,IAAI;AACnC,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AACA,QAAM,gBAAgB,MAAM;AAC1B,mBAAe,KAAK;AAIpB,eAAW,MAAM;AACf,sBAAgB,SAAS,MAAM;AAAA,IACjC,GAAG,mCAAkB;AAAA,EACvB;AACA,QAAM,cAAc,qCAAqC,IAAI;AAE7D,QAAM,wBAAoB,yBAAQ,gBAAG,cAAc,GAAG,KAAK;AAC3D,SAAoB,uCAAAA,MAAM,sCAAa;AAAA,IACrC,WAAW;AAAA,IACX,UAAU,CAAC,CAAC,eAA4B,uCAAAA,MAAM,uCAAc;AAAA,MAC1D,IAAI;AAAA,MACJ,WAAW;AAAA,MACX,OAAO;AAAA,MACP,UAAU,CAAc,uCAAAC,KAAK,QAAQ;AAAA,QACnC,IAAI;AAAA,QACJ,UAAU;AAAA,MACZ,CAAC,IAAI,aAAa,gBAA6B,uCAAAD,MAAM,6CAAoB;AAAA,QACvE,UAAU,CAAC,aAAa,aAA0B,uCAAAC,KAAK,cAAAC,SAAQ;AAAA,UAC7D,MAAM;AAAA,UACN,SAAS;AAAA,UACT,OAAO;AAAA,UACP,SAAS,MAAM,eAAe,IAAI;AAAA,UAClC,KAAK;AAAA,UACL,UAAuB,uCAAAD,KAAK,mBAAM;AAAA,YAChC,MAAM,aAAAE;AAAA,UACR,CAAC;AAAA,QACH,CAAC,CAAC;AAAA,MACJ,CAAC,CAAC;AAAA,IACJ,CAAC,GAAG,eAA4B,uCAAAF,KAAK,OAAO;AAAA,MAC1C,eAAW,oCAAoB;AAAA,QAC7B,MAAM;AAAA,QACN,QAAQ;AAAA,MACV,CAAC;AAAA,MACD,UAAuB,uCAAAA,KAAK,yBAAAG,SAAiB;AAAA,QAC3C;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;",
"names": ["_jsxs", "_jsx", "Button", "searchIcon", "MenuTitleSearch"]
}