The g-palette-color component represents one color with many shades in your palette. For example the chosen purple and then darker and lighter shades. If it contains a g-color-name, it can expose the name and if the user has overridden the name. If it contains one or more g-color-swatch elements, it can return an ordered list of the hexcodes.
When you combine this with the g-color-name, g-color-swatch elements with derivations, you can create a color palette.
See the Pen Multiple Derived Swatches w/ Styling by Dave Copeland (@davetron5000) on CodePen.