npm - @amboss/design-system - Versions diffs - 1.5.18 → 1.5.20 - Mend

@amboss/design-system 1.5.18 → 1.5.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (135) hide show

package/build/build-tokens/visualConfig.js ADDED Viewed

@@ -0,0 +1,1417 @@
+const variables = {
+    "color": {
+        "neutral": {
+            "white": "#ffffff",
+            "whiteTransparent01": "rgba(255, 255, 255, 0.8)",
+            "whiteTransparent02": "rgba(255, 255, 255, 0.6)",
+            "whiteTransparent03": "rgba(255, 255, 255, 0.08)",
+            "black": "#1a1c1c"
+        },
+        "green": {
+            "regular": "#0fa980",
+            "regularAlt": "#39d6ac",
+            "dark01": "#0b8363",
+            "dark02": "#0a5c45",
+            "light01": "#8adcc6",
+            "light02": "#d0f1e8",
+            "light03": "#e8f8f4",
+            "regularTransparent": "rgba(15, 169, 128, 0.3)",
+            "dark02Transparent": "rgba(10, 92, 69, 0.3)"
+        },
+        "blue": {
+            "regular": "#1f6ce0",
+            "dark01": "#295dae",
+            "dark02": "#1c427d",
+            "light01": "#6e95cf",
+            "light02": "#d2e2f9",
+            "light03": "#e7effe",
+            "dark02Transparent": "rgba(28, 66, 125, 0.3)"
+        },
+        "gray": {
+            "light04": "#f5f7f9",
+            "light03": "#eef2f5",
+            "light02": "#e0e6eb",
+            "light01": "#a3b2bd",
+            "regular": "#607585",
+            "dark01": "#40515e",
+            "dark02": "#314554",
+            "transparent": "rgba(96, 117, 133, 0.08)",
+            "light01Transparent": "rgba(163, 178, 189, 0.3)",
+            "dark01Transparent": "rgba(64, 81, 94, 0.3)",
+            "dark02Transparent": "rgba(49, 69, 84, 0.3)"
+        },
+        "brand": {
+            "light03": "#e7f6f8",
+            "light02": "#ceedf1",
+            "light01": "#85d3dc",
+            "regular": "#0aa6b8",
+            "dark01": "#067c89",
+            "dark02": "#054f57"
+        },
+        "orange": {
+            "light03": "#fef3e1",
+            "light02": "#fceaca",
+            "light01": "#f6c66f",
+            "regular": "#f6bc56",
+            "regularAlt": "#f1d56b",
+            "dark01": "#df9411",
+            "dark02": "#9a6304"
+        },
+        "red": {
+            "light03": "#fde8e8",
+            "light02": "#fad1d1",
+            "light01": "#f07575",
+            "regular": "#ee6160",
+            "dark01": "#dc4847",
+            "dark02": "#c02725",
+            "dark02Transparent": "rgba(192, 39, 37, 0.3)"
+        },
+        "purple": {
+            "light03": "#f2effb",
+            "light02": "#d8d0f3",
+            "light01": "#a592e3",
+            "regular": "#7254d3",
+            "dark01": "#5d44ab",
+            "dark02": "#493687"
+        },
+        "yellow": {
+            "light03": "#fdfbe3",
+            "light02": "#faf5b8",
+            "light01": "#f3eb75",
+            "regular": "#ede13b",
+            "dark01": "#cec31c",
+            "dark02": "#a39905"
+        },
+        "nightBlack": {
+            "light03": "#40454f",
+            "light02": "#393e47",
+            "light01": "#32363e",
+            "regular": "#282c34",
+            "dark01": "#24282d",
+            "dark02": "#1e2125",
+            "light01Transparent": "rgba(50, 54, 62, 0.3)"
+        },
+        "nightGray": {
+            "light03": "#d8dade",
+            "light02": "#ced1d6",
+            "light01": "#b9bcc3",
+            "regular": "#93979f",
+            "dark01": "#757a84",
+            "dark02": "#5b5f67",
+            "transparent": "rgba(147, 151, 159, 0.08)",
+            "light03Transparent": "rgba(216, 218, 222, 0.3)"
+        },
+        "nightGreen": {
+            "light03": "#e2fef7",
+            "light02": "#a6f2dd",
+            "light01": "#41a48a",
+            "regular": "#28816b",
+            "dark01": "#233d3d",
+            "dark02": "#262e33",
+            "light01Transparent": "rgba(40, 129, 107, 0.3)",
+            "dark02Transparent": "rgba(38, 46, 51, 0.3)"
+        },
+        "nightBlue": {
+            "light03": "#e7effe",
+            "light02": "#99c1fa",
+            "light01": "#6e95cf",
+            "regular": "#2f538a",
+            "dark01": "#29364c",
+            "dark02": "#282e39"
+        },
+        "nightBrand": {
+            "light03": "#e1fbfe",
+            "light02": "#80dfea",
+            "light01": "#62b2bc",
+            "regular": "#1d6670",
+            "dark01": "#223c44",
+            "dark02": "#262f36"
+        },
+        "nightOrange": {
+            "light03": "#fef3e1",
+            "light02": "#fae0b3",
+            "light01": "#cbac76",
+            "regular": "#a4792d",
+            "dark01": "#4d412c",
+            "dark02": "#32302f"
+        },
+        "nightRed": {
+            "light03": "#fee7e7",
+            "light02": "#f49a9a",
+            "light01": "#d07c7c",
+            "regular": "#a45355",
+            "dark01": "#4d3237",
+            "dark02": "#312b31",
+            "dark02Transparent": "rgba(49, 43, 49, 0.3)"
+        },
+        "nightPurple": {
+            "light03": "#e8e1fe",
+            "light02": "#ad97f7",
+            "light01": "#7d67c5",
+            "regular": "#524389",
+            "dark01": "#33314b",
+            "dark02": "#2c2d3a"
+        },
+        "nightYellow": {
+            "light03": "#fefbd2",
+            "light02": "#f9f4a9",
+            "light01": "#cbc576",
+            "regular": "#b2ab39",
+            "dark01": "#494a2f",
+            "dark02": "#323530"
+        }
+    },
+    "fontFamily": {
+        "lato": "Lato, -apple-system, BlinkMacSystemFont, segoe ui, avenir next, avenir, 'helvetica neue', helvetica, ubuntu, roboto, noto, arial, sans-serif"
+    },
+    "opacity": {
+        "button": {
+            "disabled": 0.3
+        },
+        "form": {
+            "disabled": "0.35"
+        }
+    },
+    "shadow": {
+        "card": {
+            "a": "0px 0.3px 0.6px rgba(0, 0, 0, 0.0035), 0px 2px 5px rgba(0, 0, 0, 0.07)",
+            "b": "0px 0.5px 2.5px rgba(0, 0, 0, 0.16), 0px 4px 20px rgba(0, 0, 0, 0.2)",
+            "c": "0px 0.5px 2.5px rgba(0, 0, 0, 0.16), 0px 4px 20px rgba(0, 0, 0, 0.2)",
+            "d": "0px 4px 14px rgba(0, 0, 0, 0.12), 0px 32px 112px rgba(0, 0, 0, 0.24)"
+        }
+    },
+    "size": {
+        "dimension": {
+            "checkbox": {
+                "m": "24px"
+            },
+            "radio": {
+                "m": "24px"
+            },
+            "radioPoint": {
+                "m": "10px"
+            },
+            "toggle": {
+                "height": {
+                    "s": "16px",
+                    "m": "24px"
+                },
+                "width": {
+                    "s": "28px",
+                    "m": "40px"
+                }
+            },
+            "textarea": {
+                "minHeight": {
+                    "m": "36px"
+                }
+            },
+            "togglePoint": {
+                "s": "8px",
+                "m": "16px"
+            },
+            "toggleButton": {
+                "height": {
+                    "m": "32px"
+                }
+            },
+            "dropdownMenu": {
+                "width": "120px"
+            },
+            "mediaViewerBar": {
+                "separator": {
+                    "width": "1px"
+                }
+            }
+        },
+        "borderRadius": {
+            "button": {
+                "m": "4px"
+            },
+            "container": {
+                "m": "12px"
+            },
+            "card": {
+                "m": "12px"
+            },
+            "input": {
+                "s": "4px"
+            },
+            "textarea": {
+                "s": "4px"
+            },
+            "dropdown": {
+                "s": "4px",
+                "m": "8px"
+            },
+            "checkbox": {
+                "m": "4px"
+            },
+            "radio": {
+                "m": "12px"
+            },
+            "toggle": {
+                "s": "8px",
+                "m": "16px"
+            },
+            "badge": {
+                "m": "24px"
+            },
+            "toggleButton": {
+                "m": "16px"
+            },
+            "progressBar": "4px"
+        },
+        "spacing": {
+            "zero": "0px",
+            "xxs": "4px",
+            "xs": "8px",
+            "s": "12px",
+            "m": "16px",
+            "l": "24px",
+            "xl": "32px",
+            "xxl": "48px"
+        },
+        "letterSpacing": {
+            "badge": {
+                "m": "1px"
+            }
+        },
+        "font": {
+            "button": {
+                "m": "14px"
+            },
+            "icon": {
+                "s": "16px",
+                "m": "24px",
+                "l": "48px"
+            },
+            "link": {
+                "xs": "10px",
+                "s": "12px",
+                "m": "14px",
+                "l": "16px"
+            },
+            "badge": {
+                "m": "12px"
+            },
+            "toggleButton": {
+                "m": "14px"
+            },
+            "text": {
+                "xs": "12px",
+                "s": "14px",
+                "m": "16px"
+            },
+            "header": {
+                "xxs": "12px",
+                "xs": "16px",
+                "s": "18px",
+                "m": "20px",
+                "l": "23px",
+                "xl": "26px"
+            }
+        },
+        "lineHeight": {
+            "button": {
+                "m": "16px"
+            },
+            "link": {
+                "xs": "16px",
+                "s": "18px",
+                "m": "20px",
+                "l": "22px"
+            },
+            "badge": {
+                "m": "16px"
+            },
+            "toggleButton": {
+                "m": "16px"
+            },
+            "text": {
+                "xs": "18px",
+                "s": "20px",
+                "m": "24px"
+            },
+            "header": {
+                "xxs": "16px",
+                "xs": "20px",
+                "s": "22px",
+                "m": "24px",
+                "l": "28px",
+                "xl": "32px"
+            }
+        }
+    },
+    "weight": {
+        "normal": 400,
+        "bold": 700,
+        "black": 900,
+        "inherit": "inherit"
+    }
+};
+const ambossVisualConfiguration = {
+    "dark": {
+        "variables": variables,
+        "values": {
+            "color": {
+                "logo": {
+                    "base": "#d8dade"
+                },
+                "background": {
+                    "layer_1": "#1e2125",
+                    "layer_2": "#24282d",
+                    "layer_3": "#282c34",
+                    "layer_4": "#393e47",
+                    "button": {
+                        "primary": {
+                            "base": "#28816b",
+                            "hover": "#41a48a",
+                            "active": "#233d3d",
+                            "disabled": "rgba(40, 129, 107, 0.3)"
+                        },
+                        "secondary": {
+                            "base": "transparent",
+                            "hover": "rgba(147, 151, 159, 0.08)",
+                            "active": "transparent",
+                            "disabled": "transparent"
+                        },
+                        "tertiary": {
+                            "base": "transparent",
+                            "hover": "rgba(147, 151, 159, 0.08)",
+                            "active": "rgba(147, 151, 159, 0.08)",
+                            "disabled": "transparent"
+                        }
+                    },
+                    "input": {
+                        "default": "#1a1c1c"
+                    },
+                    "textarea": {
+                        "default": "#1a1c1c"
+                    },
+                    "checkbox": {
+                        "default": "#24282d",
+                        "checked": "#28816b",
+                        "checkedHover": "#41a48a"
+                    },
+                    "dropdown": {
+                        "active": "#393e47"
+                    },
+                    "toggle": {
+                        "default": "#757a84",
+                        "checked": "#28816b",
+                        "highlighted": "#f9f4a9"
+                    },
+                    "togglePoint": {
+                        "default": "#ced1d6"
+                    },
+                    "radio": {
+                        "default": "#24282d",
+                        "checked": "#24282d",
+                        "checkedHover": "#24282d"
+                    },
+                    "tabs": {
+                        "header": "#282c34",
+                        "buttonActive": "#24282d",
+                        "buttonHover": "#393e47"
+                    },
+                    "badge": {
+                        "default": "transparent",
+                        "green": "transparent",
+                        "blue": "transparent",
+                        "yellow": "transparent",
+                        "brand": "transparent",
+                        "purple": "transparent",
+                        "red": "transparent",
+                        "gray": "transparent"
+                    },
+                    "toggleButton": {
+                        "default": "transparent",
+                        "active": "#40515e",
+                        "activeHover": "#607585"
+                    }
+                },
+                "icon": {
+                    "checkbox": {
+                        "default": "#ced1d6"
+                    },
+                    "radio": {
+                        "default": "#28816b"
+                    }
+                },
+                "header": {
+                    "primary": "#b9bcc3",
+                    "secondary": "#93979f"
+                },
+                "text": {
+                    "primary": "#41a48a",
+                    "secondary": "#ced1d6",
+                    "tertiary": "#93979f",
+                    "lightPrimary": "#d8dade",
+                    "info": "#6e95cf",
+                    "error": "#d07c7c",
+                    "warning": "#4d412c",
+                    "placeholder": "#b9bcc3",
+                    "link": {
+                        "primary": "#41a48a",
+                        "secondary": "#ced1d6",
+                        "tertiary": "#93979f",
+                        "lightPrimary": "#d8dade",
+                        "primaryHover": "#a6f2dd",
+                        "secondaryHover": "#d8dade",
+                        "tertiaryHover": "#d8dade"
+                    },
+                    "button": {
+                        "primary": {
+                            "base": "#d8dade",
+                            "hover": "#d8dade",
+                            "active": "#d8dade",
+                            "disabled": "rgba(216, 218, 222, 0.3)"
+                        },
+                        "secondary": {
+                            "base": "#d8dade",
+                            "hover": "#d8dade",
+                            "active": "#d8dade",
+                            "disabled": "rgba(216, 218, 222, 0.3)"
+                        },
+                        "tertiary": {
+                            "base": "#d8dade",
+                            "hover": "#d8dade",
+                            "active": "#ffffff",
+                            "disabled": "rgba(216, 218, 222, 0.3)"
+                        }
+                    },
+                    "badge": {
+                        "default": "#ced1d6",
+                        "green": "#41a48a",
+                        "blue": "#6e95cf",
+                        "yellow": "#cbac76",
+                        "brand": "#62b2bc",
+                        "purple": "#ad97f7",
+                        "red": "#d07c7c",
+                        "gray": "#93979f"
+                    },
+                    "toggleButton": {
+                        "default": "#a3b2bd",
+                        "active": "#ffffff",
+                        "labelDefault": "#93979f",
+                        "labelActive": "#f5f7f9"
+                    }
+                },
+                "divider": {
+                    "primary": "#32363e"
+                },
+                "segementedProgressBar": {
+                    "monochrome": "#ced1d6",
+                    "success": "#28816b",
+                    "warning": "#a4792d",
+                    "alert": "#a45355",
+                    "inProgress": "#5b5f67"
+                },
+                "border": {
+                    "primary": "#32363e",
+                    "tabs": {
+                        "buttonActive": "#b9bcc3"
+                    },
+                    "button": {
+                        "secondary": {
+                            "base": "#32363e",
+                            "hover": "#40454f",
+                            "active": "#40454f",
+                            "disabled": "rgba(50, 54, 62, 0.3)"
+                        }
+                    },
+                    "input": {
+                        "default": "#757a84",
+                        "active": "#93979f",
+                        "error": "#d07c7c"
+                    },
+                    "textarea": {
+                        "default": "#757a84",
+                        "active": "#93979f",
+                        "error": "#d07c7c"
+                    },
+                    "checkbox": {
+                        "default": "#5b5f67",
+                        "defaultHover": "#28816b"
+                    },
+                    "radio": {
+                        "default": "#5b5f67",
+                        "defaultHover": "#28816b"
+                    },
+                    "toggle": {
+                        "default": "#757a84",
+                        "checked": "#28816b",
+                        "highlighted": "#f9f4a9",
+                        "hover": "#41a48a"
+                    },
+                    "badge": {
+                        "default": "#393e47",
+                        "green": "#393e47",
+                        "blue": "#393e47",
+                        "yellow": "#393e47",
+                        "brand": "#393e47",
+                        "purple": "#393e47",
+                        "red": "#393e47",
+                        "gray": "#393e47"
+                    },
+                    "toggleButton": {
+                        "default": "#607585",
+                        "defaultHover": "#a3b2bd",
+                        "active": "#40515e",
+                        "activeHover": "#607585"
+                    }
+                }
+            },
+            "subThemes": {
+                "dimmed": {
+                    "color": {
+                        "background": {
+                            "layer_1": "#314554",
+                            "layer_2": "#40515e",
+                            "button": {
+                                "primary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                },
+                                "secondary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                },
+                                "tertiary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                }
+                            }
+                        },
+                        "header": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff"
+                        },
+                        "text": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff",
+                            "tertiary": "#e0e6eb",
+                            "error": "#ee6160",
+                            "link": {
+                                "primary": "#ffffff",
+                                "secondary": "#ffffff",
+                                "tertiary": "#e0e6eb",
+                                "primaryHover": "#e0e6eb",
+                                "secondaryHover": "#e0e6eb",
+                                "tertiaryHover": "#a3b2bd"
+                            },
+                            "button": {
+                                "primary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "tertiary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                }
+                            }
+                        },
+                        "divider": {
+                            "primary": "#e0e6eb"
+                        },
+                        "border": {
+                            "button": {
+                                "secondary": {
+                                    "base": "transparent",
+                                    "hover": "transparent",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                }
+                            }
+                        }
+                    }
+                },
+                "error": {
+                    "color": {
+                        "background": {
+                            "layer_2": "#a45355",
+                            "button": {
+                                "primary": {
+                                    "base": "#ffffff",
+                                    "hover": "rgba(255, 255, 255, 0.8)",
+                                    "active": "rgba(255, 255, 255, 0.6)",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "secondary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                },
+                                "tertiary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                }
+                            }
+                        },
+                        "header": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff"
+                        },
+                        "text": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff",
+                            "tertiary": "#ced1d6",
+                            "error": "#d07c7c",
+                            "link": {
+                                "primary": "#ffffff",
+                                "secondary": "#ffffff",
+                                "tertiary": "#ced1d6",
+                                "primaryHover": "#d8dade",
+                                "secondaryHover": "#d8dade",
+                                "tertiaryHover": "#b9bcc3"
+                            },
+                            "button": {
+                                "primary": {
+                                    "base": "#312b31",
+                                    "hover": "#312b31",
+                                    "active": "#312b31",
+                                    "disabled": "rgba(49, 43, 49, 0.3)"
+                                },
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "tertiary": {
+                                    "base": "#d8dade",
+                                    "hover": "#d8dade",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                }
+                            }
+                        },
+                        "divider": {
+                            "primary": "#ced1d6"
+                        },
+                        "border": {
+                            "button": {
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "#ffffff"
+                                }
+                            }
+                        }
+                    }
+                },
+                "info": {
+                    "color": {
+                        "background": {
+                            "layer_2": "#29364c",
+                            "button": {
+                                "primary": {
+                                    "base": "#ffffff",
+                                    "hover": "rgba(255, 255, 255, 0.8)",
+                                    "active": "rgba(255, 255, 255, 0.6)",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "secondary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                },
+                                "tertiary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                }
+                            }
+                        },
+                        "header": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff"
+                        },
+                        "text": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff",
+                            "tertiary": "#e0e6eb",
+                            "info": "#6e95cf",
+                            "error": "#ee6160",
+                            "link": {
+                                "primary": "#ffffff",
+                                "secondary": "#ffffff",
+                                "tertiary": "#e0e6eb",
+                                "primaryHover": "#e0e6eb",
+                                "secondaryHover": "#e0e6eb",
+                                "tertiaryHover": "#a3b2bd"
+                            },
+                            "button": {
+                                "primary": {
+                                    "base": "#1c427d",
+                                    "hover": "#1c427d",
+                                    "active": "#1c427d",
+                                    "disabled": "rgba(28, 66, 125, 0.3)"
+                                },
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "tertiary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                }
+                            }
+                        },
+                        "divider": {
+                            "primary": "#e0e6eb"
+                        },
+                        "border": {
+                            "button": {
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "#ffffff"
+                                }
+                            }
+                        }
+                    }
+                },
+                "success": {
+                    "color": {
+                        "background": {
+                            "layer_2": "#28816b",
+                            "button": {
+                                "primary": {
+                                    "base": "#ffffff",
+                                    "hover": "rgba(255, 255, 255, 0.8)",
+                                    "active": "rgba(255, 255, 255, 0.6)",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "secondary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                },
+                                "tertiary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                }
+                            }
+                        },
+                        "header": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff"
+                        },
+                        "text": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff",
+                            "tertiary": "#ced1d6",
+                            "error": "#d07c7c",
+                            "link": {
+                                "primary": "#ffffff",
+                                "secondary": "#ffffff",
+                                "tertiary": "#ced1d6",
+                                "primaryHover": "#d8dade",
+                                "secondaryHover": "#d8dade",
+                                "tertiaryHover": "#b9bcc3"
+                            },
+                            "button": {
+                                "primary": {
+                                    "base": "#262e33",
+                                    "hover": "#262e33",
+                                    "active": "#262e33",
+                                    "disabled": "rgba(28, 66, 125, 0.3)"
+                                },
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "tertiary": {
+                                    "base": "#d8dade",
+                                    "hover": "#d8dade",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                }
+                            }
+                        },
+                        "divider": {
+                            "primary": "#ced1d6"
+                        },
+                        "border": {
+                            "button": {
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "#ffffff"
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    },
+    "light": {
+        "variables": variables,
+        "values": {
+            "color": {
+                "logo": {
+                    "base": "#1a1c1c"
+                },
+                "background": {
+                    "layer_1": "#ffffff",
+                    "layer_2": "#ffffff",
+                    "layer_3": "#ffffff",
+                    "layer_4": "#ffffff",
+                    "button": {
+                        "primary": {
+                            "base": "#0fa980",
+                            "hover": "#0b8363",
+                            "active": "#0a5c45",
+                            "disabled": "rgba(15, 169, 128, 0.3)"
+                        },
+                        "secondary": {
+                            "base": "transparent",
+                            "hover": "rgba(96, 117, 133, 0.08)",
+                            "active": "transparent",
+                            "disabled": "transparent"
+                        },
+                        "tertiary": {
+                            "base": "transparent",
+                            "hover": "rgba(96, 117, 133, 0.08)",
+                            "active": "rgba(96, 117, 133, 0.08)",
+                            "disabled": "transparent"
+                        }
+                    },
+                    "input": {
+                        "default": "#ffffff"
+                    },
+                    "textarea": {
+                        "default": "#ffffff"
+                    },
+                    "checkbox": {
+                        "default": "#ffffff",
+                        "checked": "#0fa980",
+                        "checkedHover": "#0b8363"
+                    },
+                    "dropdown": {
+                        "active": "#eef2f5"
+                    },
+                    "toggle": {
+                        "default": "#a3b2bd",
+                        "checked": "#0fa980",
+                        "highlighted": "#faf5b8"
+                    },
+                    "togglePoint": {
+                        "default": "#ffffff"
+                    },
+                    "radio": {
+                        "default": "#ffffff",
+                        "checked": "#ffffff",
+                        "checkedHover": "#ffffff"
+                    },
+                    "tabs": {
+                        "header": "#f5f7f9",
+                        "buttonActive": "#ffffff",
+                        "buttonHover": "#eef2f5"
+                    },
+                    "badge": {
+                        "default": "#ffffff",
+                        "green": "#e8f8f4",
+                        "blue": "#e7effe",
+                        "yellow": "#fef3e1",
+                        "brand": "#e7f6f8",
+                        "purple": "#f2effb",
+                        "red": "#fde8e8",
+                        "gray": "#eef2f5"
+                    },
+                    "toggleButton": {
+                        "default": "transparent",
+                        "active": "#607585",
+                        "activeHover": "#40515e"
+                    }
+                },
+                "icon": {
+                    "checkbox": {
+                        "default": "#ffffff"
+                    },
+                    "radio": {
+                        "default": "#0fa980"
+                    }
+                },
+                "header": {
+                    "primary": "#1a1c1c",
+                    "secondary": "#607585"
+                },
+                "text": {
+                    "primary": "#0b8363",
+                    "secondary": "#1a1c1c",
+                    "tertiary": "#607585",
+                    "lightPrimary": "#ffffff",
+                    "info": "#295dae",
+                    "error": "#dc4847",
+                    "warning": "#df9411",
+                    "placeholder": "#a3b2bd",
+                    "link": {
+                        "primary": "#0b8363",
+                        "secondary": "#1a1c1c",
+                        "tertiary": "#607585",
+                        "lightPrimary": "#ffffff",
+                        "primaryHover": "#0a5c45",
+                        "secondaryHover": "#1a1c1c",
+                        "tertiaryHover": "#40515e"
+                    },
+                    "button": {
+                        "primary": {
+                            "base": "#ffffff",
+                            "hover": "#ffffff",
+                            "active": "#ffffff",
+                            "disabled": "rgba(255, 255, 255, 0.6)"
+                        },
+                        "secondary": {
+                            "base": "#40515e",
+                            "hover": "#40515e",
+                            "active": "#40515e",
+                            "disabled": "rgba(64, 81, 94, 0.3)"
+                        },
+                        "tertiary": {
+                            "base": "#40515e",
+                            "hover": "#40515e",
+                            "active": "#1a1c1c",
+                            "disabled": "rgba(64, 81, 94, 0.3)"
+                        }
+                    },
+                    "badge": {
+                        "default": "#1a1c1c",
+                        "green": "#0b8363",
+                        "blue": "#295dae",
+                        "yellow": "#9a6304",
+                        "brand": "#067c89",
+                        "purple": "#5d44ab",
+                        "red": "#c02725",
+                        "gray": "#607585"
+                    },
+                    "toggleButton": {
+                        "default": "#40515e",
+                        "active": "#ffffff",
+                        "labelDefault": "#607585",
+                        "labelActive": "#f5f7f9"
+                    }
+                },
+                "divider": {
+                    "primary": "#e0e6eb"
+                },
+                "segementedProgressBar": {
+                    "monochrome": "#607585",
+                    "success": "#39d6ac",
+                    "warning": "#f1d56b",
+                    "alert": "#f07575",
+                    "inProgress": "#e0e6eb"
+                },
+                "border": {
+                    "primary": "#e0e6eb",
+                    "tabs": {
+                        "buttonActive": "#607585"
+                    },
+                    "button": {
+                        "secondary": {
+                            "base": "#a3b2bd",
+                            "hover": "#607585",
+                            "active": "#40515e",
+                            "disabled": "rgba(163, 178, 189, 0.3)"
+                        }
+                    },
+                    "input": {
+                        "default": "#a3b2bd",
+                        "active": "#607585",
+                        "error": "#dc4847"
+                    },
+                    "textarea": {
+                        "default": "#a3b2bd",
+                        "active": "#a3b2bd",
+                        "error": "#dc4847"
+                    },
+                    "checkbox": {
+                        "default": "#e0e6eb",
+                        "defaultHover": "#0fa980"
+                    },
+                    "radio": {
+                        "default": "#e0e6eb",
+                        "defaultHover": "#0fa980"
+                    },
+                    "toggle": {
+                        "default": "#a3b2bd",
+                        "checked": "#0fa980",
+                        "highlighted": "#faf5b8",
+                        "hover": "#0a5c45"
+                    },
+                    "badge": {
+                        "default": "#e0e6eb",
+                        "green": "#e8f8f4",
+                        "blue": "#e7effe",
+                        "yellow": "#fef3e1",
+                        "brand": "#e7f6f8",
+                        "purple": "#f2effb",
+                        "red": "#fde8e8",
+                        "gray": "#eef2f5"
+                    },
+                    "toggleButton": {
+                        "default": "#e0e6eb",
+                        "defaultHover": "#a3b2bd",
+                        "active": "#607585",
+                        "activeHover": "#40515e"
+                    }
+                }
+            },
+            "subThemes": {
+                "dimmed": {
+                    "color": {
+                        "background": {
+                            "layer_1": "#314554",
+                            "layer_2": "#40515e",
+                            "button": {
+                                "primary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                },
+                                "secondary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                },
+                                "tertiary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                }
+                            }
+                        },
+                        "header": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff"
+                        },
+                        "text": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff",
+                            "tertiary": "#e0e6eb",
+                            "error": "#ee6160",
+                            "link": {
+                                "primary": "#ffffff",
+                                "secondary": "#ffffff",
+                                "tertiary": "#e0e6eb",
+                                "primaryHover": "#e0e6eb",
+                                "secondaryHover": "#e0e6eb",
+                                "tertiaryHover": "#a3b2bd"
+                            },
+                            "button": {
+                                "primary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "tertiary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                }
+                            }
+                        },
+                        "divider": {
+                            "primary": "#e0e6eb"
+                        },
+                        "border": {
+                            "button": {
+                                "secondary": {
+                                    "base": "transparent",
+                                    "hover": "transparent",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                }
+                            }
+                        }
+                    }
+                },
+                "error": {
+                    "color": {
+                        "background": {
+                            "layer_2": "#ee6160",
+                            "button": {
+                                "primary": {
+                                    "base": "#ffffff",
+                                    "hover": "rgba(255, 255, 255, 0.8)",
+                                    "active": "rgba(255, 255, 255, 0.6)",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "secondary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                },
+                                "tertiary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                }
+                            }
+                        },
+                        "header": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff"
+                        },
+                        "text": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff",
+                            "tertiary": "#e0e6eb",
+                            "error": "#ee6160",
+                            "link": {
+                                "primary": "#ffffff",
+                                "secondary": "#ffffff",
+                                "tertiary": "#e0e6eb",
+                                "primaryHover": "#e0e6eb",
+                                "secondaryHover": "#e0e6eb",
+                                "tertiaryHover": "#a3b2bd"
+                            },
+                            "button": {
+                                "primary": {
+                                    "base": "#c02725",
+                                    "hover": "#c02725",
+                                    "active": "#c02725",
+                                    "disabled": "rgba(192, 39, 37, 0.3)"
+                                },
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "tertiary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                }
+                            }
+                        },
+                        "divider": {
+                            "primary": "#e0e6eb"
+                        },
+                        "border": {
+                            "button": {
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "#ffffff"
+                                }
+                            }
+                        }
+                    }
+                },
+                "info": {
+                    "color": {
+                        "background": {
+                            "layer_2": "#295dae",
+                            "button": {
+                                "primary": {
+                                    "base": "#ffffff",
+                                    "hover": "rgba(255, 255, 255, 0.8)",
+                                    "active": "rgba(255, 255, 255, 0.6)",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "secondary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                },
+                                "tertiary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                }
+                            }
+                        },
+                        "header": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff"
+                        },
+                        "text": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff",
+                            "tertiary": "#e0e6eb",
+                            "info": "#d2e2f9",
+                            "error": "#ee6160",
+                            "link": {
+                                "primary": "#ffffff",
+                                "secondary": "#ffffff",
+                                "tertiary": "#e0e6eb",
+                                "primaryHover": "#e0e6eb",
+                                "secondaryHover": "#e0e6eb",
+                                "tertiaryHover": "#a3b2bd"
+                            },
+                            "button": {
+                                "primary": {
+                                    "base": "#1c427d",
+                                    "hover": "#1c427d",
+                                    "active": "#1c427d",
+                                    "disabled": "rgba(28, 66, 125, 0.3)"
+                                },
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "tertiary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                }
+                            }
+                        },
+                        "divider": {
+                            "primary": "#e0e6eb"
+                        },
+                        "border": {
+                            "button": {
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "#ffffff"
+                                }
+                            }
+                        }
+                    }
+                },
+                "success": {
+                    "color": {
+                        "background": {
+                            "layer_2": "#0fa980",
+                            "button": {
+                                "primary": {
+                                    "base": "#ffffff",
+                                    "hover": "rgba(255, 255, 255, 0.8)",
+                                    "active": "rgba(255, 255, 255, 0.6)",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "secondary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                },
+                                "tertiary": {
+                                    "base": "transparent",
+                                    "hover": "rgba(255, 255, 255, 0.08)",
+                                    "active": "transparent",
+                                    "disabled": "transparent"
+                                }
+                            }
+                        },
+                        "header": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff"
+                        },
+                        "text": {
+                            "primary": "#ffffff",
+                            "secondary": "#ffffff",
+                            "tertiary": "#e0e6eb",
+                            "error": "#ee6160",
+                            "link": {
+                                "primary": "#ffffff",
+                                "secondary": "#ffffff",
+                                "tertiary": "#e0e6eb",
+                                "primaryHover": "#e0e6eb",
+                                "secondaryHover": "#e0e6eb",
+                                "tertiaryHover": "#a3b2bd"
+                            },
+                            "button": {
+                                "primary": {
+                                    "base": "#0a5c45",
+                                    "hover": "#0a5c45",
+                                    "active": "#0a5c45",
+                                    "disabled": "rgba(10, 92, 69, 0.3)"
+                                },
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                },
+                                "tertiary": {
+                                    "base": "#d8dade",
+                                    "hover": "#d8dade",
+                                    "active": "#ffffff",
+                                    "disabled": "rgba(255, 255, 255, 0.6)"
+                                }
+                            }
+                        },
+                        "divider": {
+                            "primary": "#e0e6eb"
+                        },
+                        "border": {
+                            "button": {
+                                "secondary": {
+                                    "base": "#ffffff",
+                                    "hover": "#ffffff",
+                                    "active": "#ffffff",
+                                    "disabled": "#ffffff"
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+};
+export { ambossVisualConfiguration };
+//# sourceMappingURL=visualConfig.js.map