@wordpress/block-library
Version:
Block library for the WordPress editor.
8 lines (7 loc) • 11.4 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../src/tabs-menu-item/controls.js"],
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport {\n\tBlockControls,\n\tInspectorControls,\n\tstore as blockEditorStore,\n\t__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,\n\t__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,\n} from '@wordpress/block-editor';\nimport { ToolbarGroup, ToolbarItem, Button } from '@wordpress/components';\nimport {\n\tchevronLeft,\n\tchevronRight,\n\tchevronUp,\n\tchevronDown,\n} from '@wordpress/icons';\nimport { useDispatch, useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport AddTabToolbarControl from '../tab/add-tab-toolbar-control';\nimport RemoveTabToolbarControl from '../tab/remove-tab-toolbar-control';\n\nfunction TabBlockMover( {\n\ttabClientId,\n\ttabIndex,\n\ttabsCount,\n\ttabsMenuClientId,\n\ttabsClientId,\n} ) {\n\tconst {\n\t\tmoveBlocksUp,\n\t\tmoveBlocksDown,\n\t\tupdateBlockAttributes,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t} = useDispatch( blockEditorStore );\n\n\tconst { tabPanelsClientId, orientation } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockRootClientId, getBlockAttributes } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\t// Get orientation directly from the tabs-menu block's layout attribute.\n\t\t\t// This is more reliable than getBlockListSettings which is set asynchronously.\n\t\t\tconst tabsMenuAttributes = tabsMenuClientId\n\t\t\t\t? getBlockAttributes( tabsMenuClientId )\n\t\t\t\t: null;\n\t\t\treturn {\n\t\t\t\ttabPanelsClientId: getBlockRootClientId( tabClientId ),\n\t\t\t\torientation:\n\t\t\t\t\ttabsMenuAttributes?.layout?.orientation || 'horizontal',\n\t\t\t};\n\t\t},\n\t\t[ tabClientId, tabsMenuClientId ]\n\t);\n\n\tconst isFirst = tabIndex === 0;\n\tconst isLast = tabIndex === tabsCount - 1;\n\tconst isHorizontal = orientation === 'horizontal';\n\n\t// Icons and labels based on orientation (respects RTL for horizontal)\n\tlet upIcon, downIcon, upLabel, downLabel;\n\tif ( isHorizontal ) {\n\t\tif ( isRTL() ) {\n\t\t\tupIcon = chevronRight;\n\t\t\tdownIcon = chevronLeft;\n\t\t\tupLabel = __( 'Move tab right' );\n\t\t\tdownLabel = __( 'Move tab left' );\n\t\t} else {\n\t\t\tupIcon = chevronLeft;\n\t\t\tdownIcon = chevronRight;\n\t\t\tupLabel = __( 'Move tab left' );\n\t\t\tdownLabel = __( 'Move tab right' );\n\t\t}\n\t} else {\n\t\tupIcon = chevronUp;\n\t\tdownIcon = chevronDown;\n\t\tupLabel = __( 'Move tab up' );\n\t\tdownLabel = __( 'Move tab down' );\n\t}\n\n\t// Handle moving tab and updating active index to follow the moved tab\n\tconst handleMoveUp = () => {\n\t\tmoveBlocksUp( [ tabClientId ], tabPanelsClientId );\n\t\t// Update editorActiveTabIndex to follow the moved tab\n\t\tif ( tabsClientId ) {\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tupdateBlockAttributes( tabsClientId, {\n\t\t\t\teditorActiveTabIndex: tabIndex - 1,\n\t\t\t} );\n\t\t}\n\t};\n\n\tconst handleMoveDown = () => {\n\t\tmoveBlocksDown( [ tabClientId ], tabPanelsClientId );\n\t\t// Update editorActiveTabIndex to follow the moved tab\n\t\tif ( tabsClientId ) {\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tupdateBlockAttributes( tabsClientId, {\n\t\t\t\teditorActiveTabIndex: tabIndex + 1,\n\t\t\t} );\n\t\t}\n\t};\n\n\t// Don't render if only one tab\n\tif ( tabsCount <= 1 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<BlockControls group=\"parent\">\n\t\t\t<ToolbarGroup\n\t\t\t\tclassName={ clsx( 'block-editor-block-mover', {\n\t\t\t\t\t'is-horizontal': isHorizontal,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t<div className=\"block-editor-block-mover__move-button-container\">\n\t\t\t\t\t<ToolbarItem>\n\t\t\t\t\t\t{ ( itemProps ) => (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t'block-editor-block-mover-button',\n\t\t\t\t\t\t\t\t\t'is-up-button'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\ticon={ upIcon }\n\t\t\t\t\t\t\t\tlabel={ upLabel }\n\t\t\t\t\t\t\t\tdisabled={ isFirst }\n\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\tonClick={ handleMoveUp }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t{ ...itemProps }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</ToolbarItem>\n\t\t\t\t\t<ToolbarItem>\n\t\t\t\t\t\t{ ( itemProps ) => (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t'block-editor-block-mover-button',\n\t\t\t\t\t\t\t\t\t'is-down-button'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\ticon={ downIcon }\n\t\t\t\t\t\t\t\tlabel={ downLabel }\n\t\t\t\t\t\t\t\tdisabled={ isLast }\n\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\tonClick={ handleMoveDown }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t{ ...itemProps }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</ToolbarItem>\n\t\t\t\t</div>\n\t\t\t</ToolbarGroup>\n\t\t</BlockControls>\n\t);\n}\n\nexport default function Controls( {\n\tattributes,\n\tsetAttributes,\n\tclientId,\n\ttabsClientId,\n\ttabClientId,\n\ttabIndex,\n\ttabsCount,\n\ttabsMenuClientId,\n\tactiveBackgroundColor,\n\tsetActiveBackgroundColor,\n\tactiveTextColor,\n\tsetActiveTextColor,\n\thoverBackgroundColor,\n\tsetHoverBackgroundColor,\n\thoverTextColor,\n\tsetHoverTextColor,\n} ) {\n\tconst {\n\t\tcustomActiveBackgroundColor,\n\t\tcustomActiveTextColor,\n\t\tcustomHoverBackgroundColor,\n\t\tcustomHoverTextColor,\n\t} = attributes;\n\n\tconst colorSettings = useMultipleOriginColorsAndGradients();\n\n\treturn (\n\t\t<>\n\t\t\t<TabBlockMover\n\t\t\t\ttabClientId={ tabClientId }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\ttabsCount={ tabsCount }\n\t\t\t\ttabsMenuClientId={ tabsMenuClientId }\n\t\t\t\ttabsClientId={ tabsClientId }\n\t\t\t/>\n\t\t\t<AddTabToolbarControl tabsClientId={ tabsClientId } />\n\t\t\t<RemoveTabToolbarControl tabsClientId={ tabsClientId } />\n\t\t\t<InspectorControls group=\"color\">\n\t\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\t\tsettings={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: __( 'Active Background' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\tactiveBackgroundColor?.color ??\n\t\t\t\t\t\t\t\tcustomActiveBackgroundColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetActiveBackgroundColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomActiveBackgroundColor: value,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: __( 'Active Text' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\tactiveTextColor?.color ?? customActiveTextColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetActiveTextColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomActiveTextColor: value,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: __( 'Hover Background' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\thoverBackgroundColor?.color ??\n\t\t\t\t\t\t\t\tcustomHoverBackgroundColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetHoverBackgroundColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomHoverBackgroundColor: value,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: __( 'Hover Text' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\thoverTextColor?.color ?? customHoverTextColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetHoverTextColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomHoverTextColor: value,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\tdisableCustomColors={ false }\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t{ ...colorSettings }\n\t\t\t\t/>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n}\n"],
"mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,IAAI,aAAa;AAC1B;AAAA,EACC;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,+CAA+C;AAAA,EAC/C,qDAAqD;AAAA,OAC/C;AACP,SAAS,cAAc,aAAa,cAAc;AAClD;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,aAAa,iBAAiB;AAKvC,OAAO,0BAA0B;AACjC,OAAO,6BAA6B;AA8FhC,SAqEF,UAlEK,KAHH;AA5FJ,SAAS,cAAe;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI,YAAa,gBAAiB;AAElC,QAAM,EAAE,mBAAmB,YAAY,IAAI;AAAA,IAC1C,CAAE,WAAY;AACb,YAAM,EAAE,sBAAsB,mBAAmB,IAChD,OAAQ,gBAAiB;AAG1B,YAAM,qBAAqB,mBACxB,mBAAoB,gBAAiB,IACrC;AACH,aAAO;AAAA,QACN,mBAAmB,qBAAsB,WAAY;AAAA,QACrD,aACC,oBAAoB,QAAQ,eAAe;AAAA,MAC7C;AAAA,IACD;AAAA,IACA,CAAE,aAAa,gBAAiB;AAAA,EACjC;AAEA,QAAM,UAAU,aAAa;AAC7B,QAAM,SAAS,aAAa,YAAY;AACxC,QAAM,eAAe,gBAAgB;AAGrC,MAAI,QAAQ,UAAU,SAAS;AAC/B,MAAK,cAAe;AACnB,QAAK,MAAM,GAAI;AACd,eAAS;AACT,iBAAW;AACX,gBAAU,GAAI,gBAAiB;AAC/B,kBAAY,GAAI,eAAgB;AAAA,IACjC,OAAO;AACN,eAAS;AACT,iBAAW;AACX,gBAAU,GAAI,eAAgB;AAC9B,kBAAY,GAAI,gBAAiB;AAAA,IAClC;AAAA,EACD,OAAO;AACN,aAAS;AACT,eAAW;AACX,cAAU,GAAI,aAAc;AAC5B,gBAAY,GAAI,eAAgB;AAAA,EACjC;AAGA,QAAM,eAAe,MAAM;AAC1B,iBAAc,CAAE,WAAY,GAAG,iBAAkB;AAEjD,QAAK,cAAe;AACnB,8CAAwC;AACxC,4BAAuB,cAAc;AAAA,QACpC,sBAAsB,WAAW;AAAA,MAClC,CAAE;AAAA,IACH;AAAA,EACD;AAEA,QAAM,iBAAiB,MAAM;AAC5B,mBAAgB,CAAE,WAAY,GAAG,iBAAkB;AAEnD,QAAK,cAAe;AACnB,8CAAwC;AACxC,4BAAuB,cAAc;AAAA,QACpC,sBAAsB,WAAW;AAAA,MAClC,CAAE;AAAA,IACH;AAAA,EACD;AAGA,MAAK,aAAa,GAAI;AACrB,WAAO;AAAA,EACR;AAEA,SACC,oBAAC,iBAAc,OAAM,UACpB;AAAA,IAAC;AAAA;AAAA,MACA,WAAY,KAAM,4BAA4B;AAAA,QAC7C,iBAAiB;AAAA,MAClB,CAAE;AAAA,MAEF,+BAAC,SAAI,WAAU,mDACd;AAAA,4BAAC,eACE,WAAE,cACH;AAAA,UAAC;AAAA;AAAA,YACA,WAAY;AAAA,cACX;AAAA,cACA;AAAA,YACD;AAAA,YACA,MAAO;AAAA,YACP,OAAQ;AAAA,YACR,UAAW;AAAA,YACX,wBAAsB;AAAA,YACtB,SAAU;AAAA,YACV,uBAAqB;AAAA,YACnB,GAAG;AAAA;AAAA,QACN,GAEF;AAAA,QACA,oBAAC,eACE,WAAE,cACH;AAAA,UAAC;AAAA;AAAA,YACA,WAAY;AAAA,cACX;AAAA,cACA;AAAA,YACD;AAAA,YACA,MAAO;AAAA,YACP,OAAQ;AAAA,YACR,UAAW;AAAA,YACX,wBAAsB;AAAA,YACtB,SAAU;AAAA,YACV,uBAAqB;AAAA,YACnB,GAAG;AAAA;AAAA,QACN,GAEF;AAAA,SACD;AAAA;AAAA,EACD,GACD;AAEF;AAEe,SAAR,SAA2B;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI;AAEJ,QAAM,gBAAgB,oCAAoC;AAE1D,SACC,iCACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACD;AAAA,IACA,oBAAC,wBAAqB,cAA8B;AAAA,IACpD,oBAAC,2BAAwB,cAA8B;AAAA,IACvD,oBAAC,qBAAkB,OAAM,SACxB;AAAA,MAAC;AAAA;AAAA,QACA,UAAW;AAAA,UACV;AAAA,YACC,OAAO,GAAI,mBAAoB;AAAA,YAC/B,YACC,uBAAuB,SACvB;AAAA,YACD,eAAe,CAAE,UAAW;AAC3B,uCAA0B,KAAM;AAChC,4BAAe;AAAA,gBACd,6BAA6B;AAAA,cAC9B,CAAE;AAAA,YACH;AAAA,UACD;AAAA,UACA;AAAA,YACC,OAAO,GAAI,aAAc;AAAA,YACzB,YACC,iBAAiB,SAAS;AAAA,YAC3B,eAAe,CAAE,UAAW;AAC3B,iCAAoB,KAAM;AAC1B,4BAAe;AAAA,gBACd,uBAAuB;AAAA,cACxB,CAAE;AAAA,YACH;AAAA,UACD;AAAA,UACA;AAAA,YACC,OAAO,GAAI,kBAAmB;AAAA,YAC9B,YACC,sBAAsB,SACtB;AAAA,YACD,eAAe,CAAE,UAAW;AAC3B,sCAAyB,KAAM;AAC/B,4BAAe;AAAA,gBACd,4BAA4B;AAAA,cAC7B,CAAE;AAAA,YACH;AAAA,UACD;AAAA,UACA;AAAA,YACC,OAAO,GAAI,YAAa;AAAA,YACxB,YACC,gBAAgB,SAAS;AAAA,YAC1B,eAAe,CAAE,UAAW;AAC3B,gCAAmB,KAAM;AACzB,4BAAe;AAAA,gBACd,sBAAsB;AAAA,cACvB,CAAE;AAAA,YACH;AAAA,UACD;AAAA,QACD;AAAA,QACA,SAAU;AAAA,QACV,qBAAsB;AAAA,QACtB,mCAAiC;AAAA,QACjC,uBAAqB;AAAA,QACnB,GAAG;AAAA;AAAA,IACN,GACD;AAAA,KACD;AAEF;",
"names": []
}