@wordpress/components
Version:
UI components for WordPress.
8 lines (7 loc) • 4.39 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../../src/toolbar/toolbar-group/index.tsx"],
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport ToolbarButton from '../toolbar-button';\nimport ToolbarGroupContainer from './toolbar-group-container';\nimport ToolbarGroupCollapsed from './toolbar-group-collapsed';\nimport ToolbarContext from '../toolbar-context';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction isNestedArray(arr) {\n return Array.isArray(arr) && Array.isArray(arr[0]);\n}\n\n/**\n * Renders a collapsible group of controls\n *\n * The `controls` prop accepts an array of sets. A set is an array of controls.\n * Controls have the following shape:\n *\n * ```\n * {\n * icon: string,\n * title: string,\n * subscript: string,\n * onClick: Function,\n * isActive: boolean,\n * isDisabled: boolean\n * }\n * ```\n *\n * For convenience it is also possible to pass only an array of controls. It is\n * then assumed this is the only set.\n *\n * Either `controls` or `children` is required, otherwise this components\n * renders nothing.\n *\n * @param props Component props.\n * @param [props.controls] The controls to render in this toolbar.\n * @param [props.children] Any other things to render inside the toolbar besides the controls.\n * @param [props.className] Class to set on the container div.\n * @param [props.isCollapsed] Turns ToolbarGroup into a dropdown menu.\n * @param [props.title] ARIA label for dropdown menu if is collapsed.\n */\nfunction ToolbarGroup({\n controls = [],\n children,\n className,\n isCollapsed,\n title,\n ...props\n}) {\n // It'll contain state if `ToolbarGroup` is being used within\n // `<Toolbar label=\"label\" />`\n const accessibleToolbarState = useContext(ToolbarContext);\n if ((!controls || !controls.length) && !children) {\n return null;\n }\n const finalClassName = clsx(\n // Unfortunately, there's legacy code referencing to `.components-toolbar`\n // So we can't get rid of it\n accessibleToolbarState ? 'components-toolbar-group' : 'components-toolbar', className);\n\n // Normalize controls to nested array of objects (sets of controls)\n let controlSets;\n if (isNestedArray(controls)) {\n controlSets = controls;\n } else {\n controlSets = [controls];\n }\n if (isCollapsed) {\n return /*#__PURE__*/_jsx(ToolbarGroupCollapsed, {\n label: title,\n controls: controlSets,\n className: finalClassName,\n children: children,\n ...props\n });\n }\n return /*#__PURE__*/_jsxs(ToolbarGroupContainer, {\n className: finalClassName,\n ...props,\n children: [controlSets?.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => /*#__PURE__*/_jsx(ToolbarButton, {\n containerClassName: indexOfSet > 0 && indexOfControl === 0 ? 'has-left-divider' : undefined,\n ...control\n }, [indexOfSet, indexOfControl].join()))), children]\n });\n}\nexport default ToolbarGroup;"],
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,qBAA2B;AAK3B,4BAA0B;AAC1B,qCAAkC;AAClC,qCAAkC;AAClC,6BAA2B;AAC3B,yBAA2C;AAC3C,SAAS,cAAc,KAAK;AAC1B,SAAO,MAAM,QAAQ,GAAG,KAAK,MAAM,QAAQ,IAAI,CAAC,CAAC;AACnD;AAgCA,SAAS,aAAa;AAAA,EACpB,WAAW,CAAC;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG;AAGD,QAAM,6BAAyB,2BAAW,uBAAAA,OAAc;AACxD,OAAK,CAAC,YAAY,CAAC,SAAS,WAAW,CAAC,UAAU;AAChD,WAAO;AAAA,EACT;AACA,QAAM,qBAAiB,YAAAC;AAAA;AAAA;AAAA,IAGvB,yBAAyB,6BAA6B;AAAA,IAAsB;AAAA,EAAS;AAGrF,MAAI;AACJ,MAAI,cAAc,QAAQ,GAAG;AAC3B,kBAAc;AAAA,EAChB,OAAO;AACL,kBAAc,CAAC,QAAQ;AAAA,EACzB;AACA,MAAI,aAAa;AACf,WAAoB,uCAAAC,KAAK,+BAAAC,SAAuB;AAAA,MAC9C,OAAO;AAAA,MACP,UAAU;AAAA,MACV,WAAW;AAAA,MACX;AAAA,MACA,GAAG;AAAA,IACL,CAAC;AAAA,EACH;AACA,SAAoB,uCAAAC,MAAM,+BAAAC,SAAuB;AAAA,IAC/C,WAAW;AAAA,IACX,GAAG;AAAA,IACH,UAAU,CAAC,aAAa,QAAQ,CAAC,YAAY,eAAe,WAAW,IAAI,CAAC,SAAS,mBAAgC,uCAAAH,KAAK,sBAAAI,SAAe;AAAA,MACvI,oBAAoB,aAAa,KAAK,mBAAmB,IAAI,qBAAqB;AAAA,MAClF,GAAG;AAAA,IACL,GAAG,CAAC,YAAY,cAAc,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,QAAQ;AAAA,EACrD,CAAC;AACH;AACA,IAAO,wBAAQ;",
"names": ["ToolbarContext", "clsx", "_jsx", "ToolbarGroupCollapsed", "_jsxs", "ToolbarGroupContainer", "ToolbarButton"]
}