@wordpress/block-library/build/social-links/edit.cjs.map

Block library for the WordPress editor.

{
  "version": 3,
  "sources": ["../../src/social-links/edit.js"],
  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect } from '@wordpress/element';\nimport {\n\tuseInnerBlocksProps,\n\tuseBlockProps,\n\tInspectorControls,\n\tContrastChecker,\n\twithColors,\n\tInnerBlocks,\n\t__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,\n\t__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport {\n\tToggleControl,\n\tSelectControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { useToolsPanelDropdownMenuProps } from '../utils/hooks';\n\nconst sizeOptions = [\n\t{ label: __( 'Default' ), value: '' },\n\t{ label: __( 'Small' ), value: 'has-small-icon-size' },\n\t{ label: __( 'Normal' ), value: 'has-normal-icon-size' },\n\t{ label: __( 'Large' ), value: 'has-large-icon-size' },\n\t{ label: __( 'Huge' ), value: 'has-huge-icon-size' },\n];\n\nexport function SocialLinksEdit( props ) {\n\tconst {\n\t\tclientId,\n\t\tattributes,\n\t\ticonBackgroundColor,\n\t\ticonColor,\n\t\tisSelected,\n\t\tsetAttributes,\n\t\tsetIconBackgroundColor,\n\t\tsetIconColor,\n\t} = props;\n\n\tconst {\n\t\ticonBackgroundColorValue,\n\t\ticonColorValue,\n\t\topenInNewTab,\n\t\tshowLabels,\n\t\tsize,\n\t} = attributes;\n\n\tconst { hasSocialIcons, hasSelectedChild } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockCount, hasSelectedInnerBlock } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\treturn {\n\t\t\t\thasSocialIcons: getBlockCount( clientId ) > 0,\n\t\t\t\thasSelectedChild: hasSelectedInnerBlock( clientId ),\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst hasAnySelected = isSelected || hasSelectedChild;\n\n\tconst logosOnly = attributes.className?.includes( 'is-style-logos-only' );\n\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\n\t// Remove icon background color when logos only style is selected or\n\t// restore it when any other style is selected.\n\tuseEffect( () => {\n\t\tif ( logosOnly ) {\n\t\t\tlet restore;\n\t\t\tsetAttributes( ( prev ) => {\n\t\t\t\trestore = {\n\t\t\t\t\ticonBackgroundColor: prev.iconBackgroundColor,\n\t\t\t\t\ticonBackgroundColorValue: prev.iconBackgroundColorValue,\n\t\t\t\t\tcustomIconBackgroundColor: prev.customIconBackgroundColor,\n\t\t\t\t};\n\t\t\t\treturn {\n\t\t\t\t\ticonBackgroundColor: undefined,\n\t\t\t\t\ticonBackgroundColorValue: undefined,\n\t\t\t\t\tcustomIconBackgroundColor: undefined,\n\t\t\t\t};\n\t\t\t} );\n\n\t\t\treturn () => setAttributes( { ...restore } );\n\t\t}\n\t}, [ logosOnly, setAttributes ] );\n\n\t// Fallback color values are used maintain selections in case switching\n\t// themes and named colors in palette do not match.\n\tconst className = clsx( size, {\n\t\t'has-visible-labels': showLabels,\n\t\t'has-icon-color': iconColor.color || iconColorValue,\n\t\t'has-icon-background-color':\n\t\t\ticonBackgroundColor.color || iconBackgroundColorValue,\n\t} );\n\n\tconst blockProps = useBlockProps( { className } );\n\tconst innerBlocksProps = useInnerBlocksProps( blockProps, {\n\t\ttemplateLock: false,\n\t\torientation: attributes.layout?.orientation ?? 'horizontal',\n\t\t__experimentalAppenderTagName: 'li',\n\t\trenderAppender:\n\t\t\t! hasSocialIcons || hasAnySelected\n\t\t\t\t? InnerBlocks.ButtonBlockAppender\n\t\t\t\t: undefined,\n\t} );\n\n\tconst colorSettings = [\n\t\t{\n\t\t\t// Use custom attribute as fallback to prevent loss of named color selection when\n\t\t\t// switching themes to a new theme that does not have a matching named color.\n\t\t\tvalue: iconColor.color || iconColorValue,\n\t\t\tonChange: ( colorValue ) => {\n\t\t\t\tsetIconColor( colorValue );\n\t\t\t\tsetAttributes( { iconColorValue: colorValue } );\n\t\t\t},\n\t\t\tlabel: __( 'Icon color' ),\n\t\t\tresetAllFilter: () => {\n\t\t\t\tsetIconColor( undefined );\n\t\t\t\tsetAttributes( { iconColorValue: undefined } );\n\t\t\t},\n\t\t},\n\t];\n\n\tif ( ! logosOnly ) {\n\t\tcolorSettings.push( {\n\t\t\t// Use custom attribute as fallback to prevent loss of named color selection when\n\t\t\t// switching themes to a new theme that does not have a matching named color.\n\t\t\tvalue: iconBackgroundColor.color || iconBackgroundColorValue,\n\t\t\tonChange: ( colorValue ) => {\n\t\t\t\tsetIconBackgroundColor( colorValue );\n\t\t\t\tsetAttributes( {\n\t\t\t\t\ticonBackgroundColorValue: colorValue,\n\t\t\t\t} );\n\t\t\t},\n\t\t\tlabel: __( 'Icon background' ),\n\t\t\tresetAllFilter: () => {\n\t\t\t\tsetIconBackgroundColor( undefined );\n\t\t\t\tsetAttributes( { iconBackgroundColorValue: undefined } );\n\t\t\t},\n\t\t} );\n\t}\n\n\tconst colorGradientSettings = useMultipleOriginColorsAndGradients();\n\n\treturn (\n\t\t<>\n\t\t\t<InspectorControls>\n\t\t\t\t<ToolsPanel\n\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\topenInNewTab: false,\n\t\t\t\t\t\t\tshowLabels: false,\n\t\t\t\t\t\t\tsize: undefined,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\thasValue={ () => !! size }\n\t\t\t\t\t\tlabel={ __( 'Icon size' ) }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { size: undefined } )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectControl\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tlabel={ __( 'Icon size' ) }\n\t\t\t\t\t\t\tonChange={ ( newSize ) => {\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tsize: newSize === '' ? undefined : newSize,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ size ?? '' }\n\t\t\t\t\t\t\toptions={ sizeOptions }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\tlabel={ __( 'Show text' ) }\n\t\t\t\t\t\thasValue={ () => !! showLabels }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { showLabels: false } )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Show text' ) }\n\t\t\t\t\t\t\tchecked={ showLabels }\n\t\t\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\t\t\tsetAttributes( { showLabels: ! showLabels } )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\tlabel={ __( 'Open links in new tab' ) }\n\t\t\t\t\t\thasValue={ () => !! openInNewTab }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { openInNewTab: false } )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Open links in new tab' ) }\n\t\t\t\t\t\t\tchecked={ openInNewTab }\n\t\t\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\topenInNewTab: ! openInNewTab,\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</ToolsPanelItem>\n\t\t\t\t</ToolsPanel>\n\t\t\t</InspectorControls>\n\t\t\t{ colorGradientSettings.hasColorsOrGradients && (\n\t\t\t\t<InspectorControls group=\"color\">\n\t\t\t\t\t{ colorSettings.map(\n\t\t\t\t\t\t( { onChange, label, value, resetAllFilter } ) => (\n\t\t\t\t\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\t\t\t\t\tkey={ `social-links-color-${ label }` }\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t\tsettings={ [\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tcolorValue: value,\n\t\t\t\t\t\t\t\t\t\tlabel,\n\t\t\t\t\t\t\t\t\t\tonColorChange: onChange,\n\t\t\t\t\t\t\t\t\t\tisShownByDefault: true,\n\t\t\t\t\t\t\t\t\t\tresetAllFilter,\n\t\t\t\t\t\t\t\t\t\tenableAlpha: true,\n\t\t\t\t\t\t\t\t\t\tclearable: true,\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\t\t\t\t{ ...colorGradientSettings }\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\t{ ! logosOnly && (\n\t\t\t\t\t\t<ContrastChecker\n\t\t\t\t\t\t\t{ ...{\n\t\t\t\t\t\t\t\ttextColor: iconColorValue,\n\t\t\t\t\t\t\t\tbackgroundColor: iconBackgroundColorValue,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tisLargeText={ false }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</InspectorControls>\n\t\t\t) }\n\t\t\t<ul { ...innerBlocksProps } />\n\t\t</>\n\t);\n}\n\nconst iconColorAttributes = {\n\ticonColor: 'icon-color',\n\ticonBackgroundColor: 'icon-background-color',\n};\n\nexport default withColors( iconColorAttributes )( SocialLinksEdit );\n"],
  "mappings": "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",
  "names": ["blockEditorStore", "clsx", "useMultipleOriginColorsAndGradients", "ToolsPanel", "ToolsPanelItem", "ColorGradientSettingsDropdown"]
}