Overlay/Override granite colorfield

[#1]

I have a dialog box where i have used colorfield in 3 different fields. But all the fields should show only 4 colors. Which means i have to add the following node to each colorField node:

--

items

color1

color2

color3

color4

--

This is difficult to maintain as i have to add these nodes to each place wherever i have colorField component. I am looking for a way where i can keep these nodes at one place from where all the colorfield nodes can refer to the items.

Overlay/override is not an option as colorfield is having mixingType: granite:FinalArea

https://helpx.adobe.com/experience-manager/6-5/sites/developing/using/reference-materials/granite-ui...

[Shaheena_Sheikh · Accepted solution]

@Shaheena_Sheikh, your question is confusing, but if you are looking for a way to only show swatches of pre-selected colors, you can use this.

<textColor
    jcr:primaryType="nt:unstructured"
    sling:resourceType="granite/ui/components/coral/foundation/form/colorfield"
    autogenerateColors="off"
    fieldLabel="Text Color"
    name="./textColor"
    showDefaultColors="{Boolean}false"
    showProperties="{Boolean}false"
    showSwatches="{Boolean}true">
    <items jcr:primaryType="nt:unstructured">
        <color1
            jcr:primaryType="nt:unstructured"
            value="000000"/>
        <color2
            jcr:primaryType="nt:unstructured"
            value="FFFFFF"/>
    </items>
</textColor>

Or you can use ACS Common's Generic List Feature to create shared configurations - https://sourcedcode.com/re-usable-color-select-in-touch-ui-dialogs-w-acs-commons-generics-list

[Shaheena_Sheikh · Accepted solution]

the section of your code which has color options (all items), can that be maintained separately and referred by all colorfield nodes? Instead of having to write the items section for every colorfield node?

[BrianKasingli · Accepted solution]

@Shaheena_Sheikh, I created this blog for your case, https://sourcedcode.com/re-usable-color-select-in-touch-ui-dialogs-w-acs-commons-generics-list

[Shaheena_Sheikh · Accepted solution]

thanks that works