UNPKG

@wordpress/components

Version:

UI components for WordPress.

github.com/WordPress/gutenberg/tree/HEAD/packages/components/README.md

WordPress/gutenberg

8 lines (7 loc) • 4.45 kB
1
2
3
4
5
6
7
8
{ "version": 3, "sources": ["../../../src/toolbar/toolbar-button/index.tsx"], "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n/**\n * WordPress dependencies\n */\nimport { useContext, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport ToolbarItem from '../toolbar-item';\nimport ToolbarContext from '../toolbar-context';\nimport ToolbarButtonContainer from './toolbar-button-container';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction useDeprecatedProps({\n isDisabled,\n ...otherProps\n}) {\n return {\n disabled: isDisabled,\n ...otherProps\n };\n}\nfunction UnforwardedToolbarButton(props, ref) {\n const {\n children,\n className,\n containerClassName,\n extraProps,\n isActive,\n title,\n ...restProps\n } = useDeprecatedProps(props);\n const accessibleToolbarState = useContext(ToolbarContext);\n if (!accessibleToolbarState) {\n return /*#__PURE__*/_jsx(ToolbarButtonContainer, {\n className: containerClassName,\n children: /*#__PURE__*/_jsx(Button, {\n ref: ref,\n icon: restProps.icon,\n size: \"compact\",\n label: title,\n shortcut: restProps.shortcut,\n \"data-subscript\": restProps.subscript,\n onClick: event => {\n event.stopPropagation();\n // TODO: Possible bug; maybe use onClick instead of restProps.onClick.\n if (restProps.onClick) {\n restProps.onClick(event);\n }\n },\n className: clsx('components-toolbar__control', className),\n isPressed: isActive,\n accessibleWhenDisabled: true,\n \"data-toolbar-item\": true,\n ...extraProps,\n ...restProps,\n children: children\n })\n });\n }\n\n // ToobarItem will pass all props to the render prop child, which will pass\n // all props to Button. This means that ToolbarButton has the same API as\n // Button.\n return /*#__PURE__*/_jsx(ToolbarItem, {\n className: clsx('components-toolbar-button', className),\n ...extraProps,\n ...restProps,\n ref: ref,\n children: toolbarItemProps => /*#__PURE__*/_jsx(Button, {\n size: \"compact\",\n label: title,\n isPressed: isActive,\n ...toolbarItemProps,\n children: children\n })\n });\n}\n\n/**\n * ToolbarButton can be used to add actions to a toolbar, usually inside a Toolbar\n * or ToolbarGroup when used to create general interfaces.\n *\n * ```jsx\n * import { Toolbar, ToolbarButton } from '@wordpress/components';\n * import { pencil } from '@wordpress/icons';\n *\n * function MyToolbar() {\n * return (\n *\t\t<Toolbar label=\"Options\">\n *\t\t\t<ToolbarButton\n *\t\t\t\ticon={ pencil }\n *\t\t\t\tlabel=\"Edit\"\n *\t\t\t\tonClick={ () => alert( 'Editing' ) }\n *\t\t\t/>\n *\t\t</Toolbar>\n * );\n * }\n * ```\n */\nexport const ToolbarButton = forwardRef(UnforwardedToolbarButton);\nToolbarButton.displayName = 'ToolbarButton';\nexport default ToolbarButton;"], "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAIjB,qBAAuC;AAKvC,oBAAmB;AACnB,0BAAwB;AACxB,6BAA2B;AAC3B,sCAAmC;AACnC,yBAA4B;AAC5B,SAAS,mBAAmB;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAAG;AACD,SAAO;AAAA,IACL,UAAU;AAAA,IACV,GAAG;AAAA,EACL;AACF;AACA,SAAS,yBAAyB,OAAO,KAAK;AAC5C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI,mBAAmB,KAAK;AAC5B,QAAM,6BAAyB,2BAAW,uBAAAA,OAAc;AACxD,MAAI,CAAC,wBAAwB;AAC3B,WAAoB,uCAAAC,KAAK,gCAAAC,SAAwB;AAAA,MAC/C,WAAW;AAAA,MACX,UAAuB,uCAAAD,KAAK,cAAAE,SAAQ;AAAA,QAClC;AAAA,QACA,MAAM,UAAU;AAAA,QAChB,MAAM;AAAA,QACN,OAAO;AAAA,QACP,UAAU,UAAU;AAAA,QACpB,kBAAkB,UAAU;AAAA,QAC5B,SAAS,WAAS;AAChB,gBAAM,gBAAgB;AAEtB,cAAI,UAAU,SAAS;AACrB,sBAAU,QAAQ,KAAK;AAAA,UACzB;AAAA,QACF;AAAA,QACA,eAAW,YAAAC,SAAK,+BAA+B,SAAS;AAAA,QACxD,WAAW;AAAA,QACX,wBAAwB;AAAA,QACxB,qBAAqB;AAAA,QACrB,GAAG;AAAA,QACH,GAAG;AAAA,QACH;AAAA,MACF,CAAC;AAAA,IACH,CAAC;AAAA,EACH;AAKA,SAAoB,uCAAAH,KAAK,oBAAAI,SAAa;AAAA,IACpC,eAAW,YAAAD,SAAK,6BAA6B,SAAS;AAAA,IACtD,GAAG;AAAA,IACH,GAAG;AAAA,IACH;AAAA,IACA,UAAU,sBAAiC,uCAAAH,KAAK,cAAAE,SAAQ;AAAA,MACtD,MAAM;AAAA,MACN,OAAO;AAAA,MACP,WAAW;AAAA,MACX,GAAG;AAAA,MACH;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACH;AAuBO,IAAM,oBAAgB,2BAAW,wBAAwB;AAChE,cAAc,cAAc;AAC5B,IAAO,yBAAQ;", "names": ["ToolbarContext", "_jsx", "ToolbarButtonContainer", "Button", "clsx", "ToolbarItem"] }