| @@ -191,8 +191,33 @@ | ||
| 191 | 191 | const duotone = palette?.settings?.color?.duotone; |
| 192 | 192 | return Array.isArray(duotone) ? duotone : duotone?.theme; |
| 193 | 193 | }; |
| 194 | 194 | |
| 195 | +// Roles can share a hex; the palette's own order breaks the tie. | |
| 196 | +const roleByColor = (colors) => { | |
| 197 | + const roles = {}; | |
| 198 | + | |
| 199 | + for (const [role, hex] of Object.entries(colors ?? {})) { | |
| 200 | + const key = hex?.toLowerCase(); | |
| 201 | + if (key && !(key in roles)) roles[key] = role; | |
| 202 | + } | |
| 203 | + | |
| 204 | + return roles; | |
| 205 | +}; | |
| 206 | + | |
| 207 | +export const remapPaletteDuotone = (palette, colors) => { | |
| 208 | + const duotone = paletteDuotone(palette); | |
| 209 | + if (!Array.isArray(duotone)) return undefined; | |
| 210 | + | |
| 211 | + const roles = roleByColor(palette?.colors); | |
| 212 | + const recolor = (pole) => colors?.[roles[pole?.toLowerCase()]] ?? pole; | |
| 213 | + | |
| 214 | + return duotone.map((preset) => ({ | |
| 215 | + ...preset, | |
| 216 | + colors: preset?.colors?.map(recolor), | |
| 217 | + })); | |
| 218 | +}; | |
| 219 | + | |
| 195 | 220 | const cssFromSlots = ({ slots, incoming, themeStyles, themeSettings }) => { |
| 196 | 221 | const rules = new Map(); |
| 197 | 222 | |
| 198 | 223 | for (const { selector, property, section, read } of slots) { |
