diff --git a/assets/apps/components/src/Common/icons.js b/assets/apps/components/src/Common/icons.js index 370f6d9cef..466f719fbb 100644 --- a/assets/apps/components/src/Common/icons.js +++ b/assets/apps/components/src/Common/icons.js @@ -956,6 +956,82 @@ const getIcons = (size) => { /> ), + medium: ( + + + + ), + bluesky: ( + + + + ), + 'square-bluesky': ( + + + + ), + threads: ( + + + + ), + 'square-threads': ( + + + + ), + substack: ( + + + + ), + linktree: ( + + + + ), }; }; diff --git a/assets/apps/customizer-controls/src/repeater/RepeaterItemContent.js b/assets/apps/customizer-controls/src/repeater/RepeaterItemContent.js index fa3eae05b3..8ac144b136 100644 --- a/assets/apps/customizer-controls/src/repeater/RepeaterItemContent.js +++ b/assets/apps/customizer-controls/src/repeater/RepeaterItemContent.js @@ -5,12 +5,15 @@ import { ToggleControl, TextareaControl, ExternalLink, + ButtonGroup, + Placeholder, } from '@wordpress/components'; import IconSelector from './IconSelector'; import { getIcons, ColorControl } from '@neve-wp/components'; import PropTypes from 'prop-types'; import { __ } from '@wordpress/i18n'; import Range from '../range/Range'; +import { MediaUpload } from '@wordpress/media-utils'; const RepeaterItemContent = ({ fields, @@ -163,14 +166,97 @@ const RepeaterItemContent = ({ {...fields[key]} /> ); + case 'switcher': + return ; + case 'media': + return ( + + {!value[index][key] ? ( + <> +

+ {__( + 'Select from the Media Library or upload a new image', + 'neve' + )} +

+ { + changeContent(key, imageData.url); + }} + allowedTypes={['image']} + render={({ open }) => ( + + )} + /> + + ) : ( + <> + icon + + + )} +
+ ); } }; + const Switcher = ({ fieldId, currentField }) => { + const selectedOption = + value[index][fieldId] || Object.keys(currentField.options)[0]; + + return ( + <> + + {Object.entries(currentField.options).map( + ([optionKey, option]) => { + return ( + + ); + } + )} + + {currentField.options?.[selectedOption]?.fields.map( + (componentId) => { + return toComponent(componentId, value[index]); + } + )} + + ); + }; + return (
- {Object.entries(currentFields).map(([key]) => { - return toComponent(key, value[index]); - })} + {Object.entries(currentFields) + .filter(([, options]) => { + return !options?.parent; + }) + .map(([key]) => { + return toComponent(key, value[index]); + })} {value.length > 1 && !isBlocked && (