@react-spectrum/s2
Version:
Spectrum 2 UI components in React
2,007 lines (2,006 loc) • 110 kB
JavaScript
import {ArbitraryProperty as $1619a4f0ddc7ccfb$export$d03475ad9df06cd2, createTheme as $1619a4f0ddc7ccfb$export$25d302a5b900a763, ExpandedProperty as $1619a4f0ddc7ccfb$export$1b6028cfca42adca, MappedProperty as $1619a4f0ddc7ccfb$export$965169194d2485f7, parseArbitraryValue as $1619a4f0ddc7ccfb$export$22a8270399010c94, PercentageProperty as $1619a4f0ddc7ccfb$export$6bff0717a72a8669, SizingProperty as $1619a4f0ddc7ccfb$export$8c6b4dc3755476bb} from "./style-macro.mjs";
/*
* Copyright 2024 Adobe. All rights reserved.
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License. You may obtain a copy
* of the License at http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software distributed under
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
* OF ANY KIND, either express or implied. See the License for the specific language
* governing permissions and limitations under the License.
*/
function $27684d56c53d4b5c$var$pxToRem(px) {
if (typeof px === 'string') px = parseFloat(px);
return px / 16 + 'rem';
}
const $27684d56c53d4b5c$var$baseColors = {
transparent: 'transparent',
black: 'black',
white: 'white',
"gray-25": {
type: "color",
light: "rgb(255, 255, 255)",
dark: "rgb(17, 17, 17)"
},
"gray-50": {
type: "color",
light: "rgb(248, 248, 248)",
dark: "rgb(27, 27, 27)"
},
"gray-75": {
type: "color",
light: "rgb(243, 243, 243)",
dark: "rgb(34, 34, 34)"
},
"gray-100": {
type: "color",
light: "rgb(233, 233, 233)",
dark: "rgb(44, 44, 44)"
},
"gray-200": {
type: "color",
light: "rgb(225, 225, 225)",
dark: "rgb(50, 50, 50)"
},
"gray-300": {
type: "color",
light: "rgb(218, 218, 218)",
dark: "rgb(57, 57, 57)"
},
"gray-400": {
type: "color",
light: "rgb(198, 198, 198)",
dark: "rgb(68, 68, 68)"
},
"gray-500": {
type: "color",
light: "rgb(143, 143, 143)",
dark: "rgb(109, 109, 109)"
},
"gray-600": {
type: "color",
light: "rgb(113, 113, 113)",
dark: "rgb(138, 138, 138)"
},
"gray-700": {
type: "color",
light: "rgb(80, 80, 80)",
dark: "rgb(175, 175, 175)"
},
"gray-800": {
type: "color",
light: "rgb(41, 41, 41)",
dark: "rgb(219, 219, 219)"
},
"gray-900": {
type: "color",
light: "rgb(19, 19, 19)",
dark: "rgb(242, 242, 242)"
},
"gray-1000": {
type: "color",
light: "rgb(0, 0, 0)",
dark: "rgb(255, 255, 255)"
},
"blue-100": {
type: "color",
light: "rgb(245, 249, 255)",
dark: "rgb(14, 23, 63)"
},
"blue-200": {
type: "color",
light: "rgb(229, 240, 254)",
dark: "rgb(15, 28, 82)"
},
"blue-300": {
type: "color",
light: "rgb(203, 226, 254)",
dark: "rgb(12, 33, 117)"
},
"blue-400": {
type: "color",
light: "rgb(172, 207, 253)",
dark: "rgb(18, 45, 154)"
},
"blue-500": {
type: "color",
light: "rgb(142, 185, 252)",
dark: "rgb(26, 58, 195)"
},
"blue-600": {
type: "color",
light: "rgb(114, 158, 253)",
dark: "rgb(37, 73, 229)"
},
"blue-700": {
type: "color",
light: "rgb(93, 137, 255)",
dark: "rgb(52, 91, 248)"
},
"blue-800": {
type: "color",
light: "rgb(75, 117, 255)",
dark: "rgb(64, 105, 253)"
},
"blue-900": {
type: "color",
light: "rgb(59, 99, 251)",
dark: "rgb(86, 129, 255)"
},
"blue-1000": {
type: "color",
light: "rgb(39, 77, 234)",
dark: "rgb(105, 149, 254)"
},
"blue-1100": {
type: "color",
light: "rgb(29, 62, 207)",
dark: "rgb(124, 169, 252)"
},
"blue-1200": {
type: "color",
light: "rgb(21, 50, 173)",
dark: "rgb(152, 192, 252)"
},
"blue-1300": {
type: "color",
light: "rgb(16, 40, 140)",
dark: "rgb(181, 213, 253)"
},
"blue-1400": {
type: "color",
light: "rgb(12, 31, 105)",
dark: "rgb(213, 231, 254)"
},
"blue-1500": {
type: "color",
light: "rgb(14, 24, 67)",
dark: "rgb(238, 245, 255)"
},
"blue-1600": {
type: "color",
light: "rgb(7, 11, 30)",
dark: "rgb(255, 255, 255)"
},
"red-100": {
type: "color",
light: "rgb(255, 246, 245)",
dark: "rgb(54, 10, 3)"
},
"red-200": {
type: "color",
light: "rgb(255, 235, 232)",
dark: "rgb(68, 13, 5)"
},
"red-300": {
type: "color",
light: "rgb(255, 214, 209)",
dark: "rgb(87, 17, 7)"
},
"red-400": {
type: "color",
light: "rgb(255, 188, 180)",
dark: "rgb(115, 24, 11)"
},
"red-500": {
type: "color",
light: "rgb(255, 157, 145)",
dark: "rgb(147, 31, 17)"
},
"red-600": {
type: "color",
light: "rgb(255, 118, 101)",
dark: "rgb(177, 38, 23)"
},
"red-700": {
type: "color",
light: "rgb(255, 81, 61)",
dark: "rgb(205, 46, 29)"
},
"red-800": {
type: "color",
light: "rgb(240, 56, 35)",
dark: "rgb(223, 52, 34)"
},
"red-900": {
type: "color",
light: "rgb(215, 50, 32)",
dark: "rgb(252, 67, 46)"
},
"red-1000": {
type: "color",
light: "rgb(183, 40, 24)",
dark: "rgb(255, 103, 86)"
},
"red-1100": {
type: "color",
light: "rgb(156, 33, 19)",
dark: "rgb(255, 134, 120)"
},
"red-1200": {
type: "color",
light: "rgb(129, 27, 14)",
dark: "rgb(255, 167, 157)"
},
"red-1300": {
type: "color",
light: "rgb(104, 21, 10)",
dark: "rgb(255, 196, 189)"
},
"red-1400": {
type: "color",
light: "rgb(80, 16, 6)",
dark: "rgb(255, 222, 219)"
},
"red-1500": {
type: "color",
light: "rgb(59, 11, 4)",
dark: "rgb(255, 242, 240)"
},
"red-1600": {
type: "color",
light: "rgb(29, 5, 2)",
dark: "rgb(255, 255, 255)"
},
"orange-100": {
type: "color",
light: "rgb(255, 246, 231)",
dark: "rgb(49, 16, 0)"
},
"orange-200": {
type: "color",
light: "rgb(255, 236, 207)",
dark: "rgb(61, 21, 0)"
},
"orange-300": {
type: "color",
light: "rgb(255, 218, 158)",
dark: "rgb(80, 27, 0)"
},
"orange-400": {
type: "color",
light: "rgb(255, 193, 94)",
dark: "rgb(106, 36, 0)"
},
"orange-500": {
type: "color",
light: "rgb(255, 162, 19)",
dark: "rgb(135, 47, 0)"
},
"orange-600": {
type: "color",
light: "rgb(252, 125, 0)",
dark: "rgb(162, 59, 0)"
},
"orange-700": {
type: "color",
light: "rgb(232, 106, 0)",
dark: "rgb(185, 73, 0)"
},
"orange-800": {
type: "color",
light: "rgb(212, 91, 0)",
dark: "rgb(199, 82, 0)"
},
"orange-900": {
type: "color",
light: "rgb(194, 78, 0)",
dark: "rgb(224, 100, 0)"
},
"orange-1000": {
type: "color",
light: "rgb(167, 62, 0)",
dark: "rgb(243, 117, 0)"
},
"orange-1100": {
type: "color",
light: "rgb(144, 51, 0)",
dark: "rgb(255, 137, 0)"
},
"orange-1200": {
type: "color",
light: "rgb(118, 41, 0)",
dark: "rgb(255, 173, 45)"
},
"orange-1300": {
type: "color",
light: "rgb(95, 32, 0)",
dark: "rgb(255, 201, 116)"
},
"orange-1400": {
type: "color",
light: "rgb(73, 24, 0)",
dark: "rgb(255, 225, 178)"
},
"orange-1500": {
type: "color",
light: "rgb(52, 18, 0)",
dark: "rgb(255, 243, 225)"
},
"orange-1600": {
type: "color",
light: "rgb(25, 8, 0)",
dark: "rgb(255, 255, 255)"
},
"yellow-100": {
type: "color",
light: "rgb(255, 248, 204)",
dark: "rgb(37, 23, 0)"
},
"yellow-200": {
type: "color",
light: "rgb(255, 241, 151)",
dark: "rgb(47, 29, 0)"
},
"yellow-300": {
type: "color",
light: "rgb(255, 222, 44)",
dark: "rgb(61, 39, 0)"
},
"yellow-400": {
type: "color",
light: "rgb(245, 199, 0)",
dark: "rgb(83, 52, 0)"
},
"yellow-500": {
type: "color",
light: "rgb(230, 175, 0)",
dark: "rgb(107, 67, 0)"
},
"yellow-600": {
type: "color",
light: "rgb(210, 149, 0)",
dark: "rgb(130, 82, 0)"
},
"yellow-700": {
type: "color",
light: "rgb(193, 131, 0)",
dark: "rgb(151, 97, 0)"
},
"yellow-800": {
type: "color",
light: "rgb(175, 116, 0)",
dark: "rgb(164, 106, 0)"
},
"yellow-900": {
type: "color",
light: "rgb(158, 102, 0)",
dark: "rgb(186, 124, 0)"
},
"yellow-1000": {
type: "color",
light: "rgb(134, 85, 0)",
dark: "rgb(203, 141, 0)"
},
"yellow-1100": {
type: "color",
light: "rgb(114, 72, 0)",
dark: "rgb(218, 159, 0)"
},
"yellow-1200": {
type: "color",
light: "rgb(93, 59, 0)",
dark: "rgb(235, 183, 0)"
},
"yellow-1300": {
type: "color",
light: "rgb(75, 47, 0)",
dark: "rgb(249, 206, 0)"
},
"yellow-1400": {
type: "color",
light: "rgb(56, 35, 0)",
dark: "rgb(255, 230, 86)"
},
"yellow-1500": {
type: "color",
light: "rgb(40, 25, 0)",
dark: "rgb(255, 246, 195)"
},
"yellow-1600": {
type: "color",
light: "rgb(18, 11, 0)",
dark: "rgb(255, 255, 255)"
},
"chartreuse-100": {
type: "color",
light: "rgb(246, 251, 222)",
dark: "rgb(23, 28, 0)"
},
"chartreuse-200": {
type: "color",
light: "rgb(234, 246, 173)",
dark: "rgb(30, 36, 0)"
},
"chartreuse-300": {
type: "color",
light: "rgb(208, 236, 70)",
dark: "rgb(39, 47, 0)"
},
"chartreuse-400": {
type: "color",
light: "rgb(182, 219, 0)",
dark: "rgb(53, 63, 0)"
},
"chartreuse-500": {
type: "color",
light: "rgb(163, 196, 0)",
dark: "rgb(68, 82, 0)"
},
"chartreuse-600": {
type: "color",
light: "rgb(143, 172, 0)",
dark: "rgb(83, 100, 0)"
},
"chartreuse-700": {
type: "color",
light: "rgb(128, 153, 0)",
dark: "rgb(97, 116, 0)"
},
"chartreuse-800": {
type: "color",
light: "rgb(114, 137, 0)",
dark: "rgb(106, 127, 0)"
},
"chartreuse-900": {
type: "color",
light: "rgb(102, 122, 0)",
dark: "rgb(122, 147, 0)"
},
"chartreuse-1000": {
type: "color",
light: "rgb(86, 103, 0)",
dark: "rgb(136, 164, 0)"
},
"chartreuse-1100": {
type: "color",
light: "rgb(73, 87, 0)",
dark: "rgb(151, 181, 0)"
},
"chartreuse-1200": {
type: "color",
light: "rgb(60, 71, 0)",
dark: "rgb(169, 203, 0)"
},
"chartreuse-1300": {
type: "color",
light: "rgb(47, 57, 0)",
dark: "rgb(187, 225, 0)"
},
"chartreuse-1400": {
type: "color",
light: "rgb(35, 43, 0)",
dark: "rgb(219, 240, 117)"
},
"chartreuse-1500": {
type: "color",
light: "rgb(25, 30, 0)",
dark: "rgb(242, 249, 206)"
},
"chartreuse-1600": {
type: "color",
light: "rgb(11, 14, 0)",
dark: "rgb(255, 255, 255)"
},
"celery-100": {
type: "color",
light: "rgb(235, 255, 220)",
dark: "rgb(11, 31, 0)"
},
"celery-200": {
type: "color",
light: "rgb(197, 255, 156)",
dark: "rgb(15, 38, 0)"
},
"celery-300": {
type: "color",
light: "rgb(157, 247, 92)",
dark: "rgb(21, 51, 1)"
},
"celery-400": {
type: "color",
light: "rgb(129, 228, 58)",
dark: "rgb(31, 67, 4)"
},
"celery-500": {
type: "color",
light: "rgb(110, 206, 42)",
dark: "rgb(41, 86, 8)"
},
"celery-600": {
type: "color",
light: "rgb(93, 180, 31)",
dark: "rgb(50, 105, 11)"
},
"celery-700": {
type: "color",
light: "rgb(82, 161, 25)",
dark: "rgb(60, 122, 15)"
},
"celery-800": {
type: "color",
light: "rgb(72, 144, 20)",
dark: "rgb(66, 134, 18)"
},
"celery-900": {
type: "color",
light: "rgb(64, 129, 17)",
dark: "rgb(78, 154, 23)"
},
"celery-1000": {
type: "color",
light: "rgb(52, 109, 12)",
dark: "rgb(88, 172, 28)"
},
"celery-1100": {
type: "color",
light: "rgb(44, 92, 9)",
dark: "rgb(100, 190, 35)"
},
"celery-1200": {
type: "color",
light: "rgb(35, 75, 6)",
dark: "rgb(116, 213, 46)"
},
"celery-1300": {
type: "color",
light: "rgb(27, 60, 3)",
dark: "rgb(136, 234, 65)"
},
"celery-1400": {
type: "color",
light: "rgb(19, 46, 0)",
dark: "rgb(170, 251, 112)"
},
"celery-1500": {
type: "color",
light: "rgb(12, 33, 0)",
dark: "rgb(222, 255, 198)"
},
"celery-1600": {
type: "color",
light: "rgb(4, 15, 0)",
dark: "rgb(255, 255, 255)"
},
"green-100": {
type: "color",
light: "rgb(237, 252, 241)",
dark: "rgb(0, 30, 23)"
},
"green-200": {
type: "color",
light: "rgb(215, 247, 225)",
dark: "rgb(0, 38, 29)"
},
"green-300": {
type: "color",
light: "rgb(173, 238, 197)",
dark: "rgb(0, 51, 38)"
},
"green-400": {
type: "color",
light: "rgb(107, 227, 162)",
dark: "rgb(0, 68, 48)"
},
"green-500": {
type: "color",
light: "rgb(43, 209, 125)",
dark: "rgb(2, 87, 58)"
},
"green-600": {
type: "color",
light: "rgb(18, 184, 103)",
dark: "rgb(3, 106, 67)"
},
"green-700": {
type: "color",
light: "rgb(11, 164, 93)",
dark: "rgb(4, 124, 75)"
},
"green-800": {
type: "color",
light: "rgb(7, 147, 85)",
dark: "rgb(6, 136, 80)"
},
"green-900": {
type: "color",
light: "rgb(5, 131, 78)",
dark: "rgb(9, 157, 89)"
},
"green-1000": {
type: "color",
light: "rgb(3, 110, 69)",
dark: "rgb(14, 175, 98)"
},
"green-1100": {
type: "color",
light: "rgb(2, 93, 60)",
dark: "rgb(24, 193, 110)"
},
"green-1200": {
type: "color",
light: "rgb(1, 76, 52)",
dark: "rgb(57, 215, 134)"
},
"green-1300": {
type: "color",
light: "rgb(0, 61, 44)",
dark: "rgb(126, 231, 172)"
},
"green-1400": {
type: "color",
light: "rgb(0, 46, 34)",
dark: "rgb(189, 241, 208)"
},
"green-1500": {
type: "color",
light: "rgb(0, 33, 25)",
dark: "rgb(229, 250, 236)"
},
"green-1600": {
type: "color",
light: "rgb(0, 15, 12)",
dark: "rgb(255, 255, 255)"
},
"seafoam-100": {
type: "color",
light: "rgb(235, 251, 246)",
dark: "rgb(0, 30, 27)"
},
"seafoam-200": {
type: "color",
light: "rgb(211, 246, 234)",
dark: "rgb(0, 39, 35)"
},
"seafoam-300": {
type: "color",
light: "rgb(169, 237, 216)",
dark: "rgb(0, 50, 44)"
},
"seafoam-400": {
type: "color",
light: "rgb(92, 225, 194)",
dark: "rgb(0, 67, 59)"
},
"seafoam-500": {
type: "color",
light: "rgb(16, 207, 169)",
dark: "rgb(2, 86, 75)"
},
"seafoam-600": {
type: "color",
light: "rgb(13, 181, 149)",
dark: "rgb(4, 105, 89)"
},
"seafoam-700": {
type: "color",
light: "rgb(11, 162, 134)",
dark: "rgb(6, 122, 103)"
},
"seafoam-800": {
type: "color",
light: "rgb(9, 144, 120)",
dark: "rgb(8, 134, 112)"
},
"seafoam-900": {
type: "color",
light: "rgb(7, 129, 109)",
dark: "rgb(10, 154, 128)"
},
"seafoam-1000": {
type: "color",
light: "rgb(5, 108, 92)",
dark: "rgb(12, 173, 142)"
},
"seafoam-1100": {
type: "color",
light: "rgb(3, 92, 80)",
dark: "rgb(14, 190, 156)"
},
"seafoam-1200": {
type: "color",
light: "rgb(1, 75, 67)",
dark: "rgb(29, 214, 176)"
},
"seafoam-1300": {
type: "color",
light: "rgb(0, 60, 54)",
dark: "rgb(122, 229, 203)"
},
"seafoam-1400": {
type: "color",
light: "rgb(0, 46, 40)",
dark: "rgb(186, 241, 222)"
},
"seafoam-1500": {
type: "color",
light: "rgb(0, 33, 29)",
dark: "rgb(229, 249, 243)"
},
"seafoam-1600": {
type: "color",
light: "rgb(0, 15, 14)",
dark: "rgb(255, 255, 255)"
},
"cyan-100": {
type: "color",
light: "rgb(238, 250, 254)",
dark: "rgb(0, 29, 39)"
},
"cyan-200": {
type: "color",
light: "rgb(217, 244, 253)",
dark: "rgb(0, 36, 49)"
},
"cyan-300": {
type: "color",
light: "rgb(183, 231, 252)",
dark: "rgb(0, 48, 65)"
},
"cyan-400": {
type: "color",
light: "rgb(138, 213, 255)",
dark: "rgb(0, 64, 88)"
},
"cyan-500": {
type: "color",
light: "rgb(92, 192, 255)",
dark: "rgb(0, 82, 113)"
},
"cyan-600": {
type: "color",
light: "rgb(48, 167, 254)",
dark: "rgb(3, 99, 140)"
},
"cyan-700": {
type: "color",
light: "rgb(29, 149, 231)",
dark: "rgb(8, 115, 168)"
},
"cyan-800": {
type: "color",
light: "rgb(18, 134, 205)",
dark: "rgb(13, 125, 186)"
},
"cyan-900": {
type: "color",
light: "rgb(11, 120, 179)",
dark: "rgb(24, 142, 220)"
},
"cyan-1000": {
type: "color",
light: "rgb(4, 102, 145)",
dark: "rgb(38, 159, 244)"
},
"cyan-1100": {
type: "color",
light: "rgb(0, 87, 121)",
dark: "rgb(63, 177, 255)"
},
"cyan-1200": {
type: "color",
light: "rgb(0, 71, 98)",
dark: "rgb(107, 199, 255)"
},
"cyan-1300": {
type: "color",
light: "rgb(0, 57, 78)",
dark: "rgb(152, 219, 255)"
},
"cyan-1400": {
type: "color",
light: "rgb(0, 43, 59)",
dark: "rgb(195, 236, 252)"
},
"cyan-1500": {
type: "color",
light: "rgb(0, 31, 43)",
dark: "rgb(230, 248, 253)"
},
"cyan-1600": {
type: "color",
light: "rgb(0, 14, 20)",
dark: "rgb(255, 255, 255)"
},
"indigo-100": {
type: "color",
light: "rgb(247, 248, 255)",
dark: "rgb(30, 0, 93)"
},
"indigo-200": {
type: "color",
light: "rgb(235, 238, 255)",
dark: "rgb(35, 0, 110)"
},
"indigo-300": {
type: "color",
light: "rgb(216, 222, 255)",
dark: "rgb(47, 0, 140)"
},
"indigo-400": {
type: "color",
light: "rgb(192, 201, 255)",
dark: "rgb(62, 12, 174)"
},
"indigo-500": {
type: "color",
light: "rgb(167, 178, 255)",
dark: "rgb(79, 30, 209)"
},
"indigo-600": {
type: "color",
light: "rgb(145, 151, 254)",
dark: "rgb(95, 52, 235)"
},
"indigo-700": {
type: "color",
light: "rgb(132, 128, 254)",
dark: "rgb(109, 75, 248)"
},
"indigo-800": {
type: "color",
light: "rgb(122, 106, 253)",
dark: "rgb(116, 91, 252)"
},
"indigo-900": {
type: "color",
light: "rgb(113, 85, 250)",
dark: "rgb(128, 119, 254)"
},
"indigo-1000": {
type: "color",
light: "rgb(99, 56, 238)",
dark: "rgb(139, 141, 254)"
},
"indigo-1100": {
type: "color",
light: "rgb(84, 36, 219)",
dark: "rgb(153, 161, 255)"
},
"indigo-1200": {
type: "color",
light: "rgb(69, 19, 191)",
dark: "rgb(176, 186, 255)"
},
"indigo-1300": {
type: "color",
light: "rgb(55, 6, 160)",
dark: "rgb(199, 208, 255)"
},
"indigo-1400": {
type: "color",
light: "rgb(42, 0, 129)",
dark: "rgb(223, 228, 255)"
},
"indigo-1500": {
type: "color",
light: "rgb(31, 0, 98)",
dark: "rgb(243, 244, 255)"
},
"indigo-1600": {
type: "color",
light: "rgb(17, 0, 54)",
dark: "rgb(255, 255, 255)"
},
"purple-100": {
type: "color",
light: "rgb(251, 247, 254)",
dark: "rgb(41, 0, 79)"
},
"purple-200": {
type: "color",
light: "rgb(244, 235, 252)",
dark: "rgb(50, 0, 96)"
},
"purple-300": {
type: "color",
light: "rgb(235, 218, 249)",
dark: "rgb(64, 0, 122)"
},
"purple-400": {
type: "color",
light: "rgb(221, 193, 246)",
dark: "rgb(83, 0, 159)"
},
"purple-500": {
type: "color",
light: "rgb(208, 167, 243)",
dark: "rgb(107, 6, 195)"
},
"purple-600": {
type: "color",
light: "rgb(191, 138, 238)",
dark: "rgb(130, 34, 215)"
},
"purple-700": {
type: "color",
light: "rgb(178, 114, 235)",
dark: "rgb(148, 62, 224)"
},
"purple-800": {
type: "color",
light: "rgb(166, 92, 231)",
dark: "rgb(157, 78, 228)"
},
"purple-900": {
type: "color",
light: "rgb(154, 71, 226)",
dark: "rgb(173, 105, 233)"
},
"purple-1000": {
type: "color",
light: "rgb(134, 40, 217)",
dark: "rgb(186, 127, 237)"
},
"purple-1100": {
type: "color",
light: "rgb(115, 13, 204)",
dark: "rgb(197, 149, 240)"
},
"purple-1200": {
type: "color",
light: "rgb(93, 0, 177)",
dark: "rgb(212, 176, 244)"
},
"purple-1300": {
type: "color",
light: "rgb(75, 0, 144)",
dark: "rgb(225, 201, 247)"
},
"purple-1400": {
type: "color",
light: "rgb(59, 0, 111)",
dark: "rgb(238, 224, 250)"
},
"purple-1500": {
type: "color",
light: "rgb(44, 0, 84)",
dark: "rgb(248, 243, 253)"
},
"purple-1600": {
type: "color",
light: "rgb(23, 0, 45)",
dark: "rgb(255, 255, 255)"
},
"fuchsia-100": {
type: "color",
light: "rgb(254, 246, 255)",
dark: "rgb(50, 0, 61)"
},
"fuchsia-200": {
type: "color",
light: "rgb(253, 233, 255)",
dark: "rgb(61, 0, 74)"
},
"fuchsia-300": {
type: "color",
light: "rgb(250, 211, 255)",
dark: "rgb(79, 0, 95)"
},
"fuchsia-400": {
type: "color",
light: "rgb(247, 181, 255)",
dark: "rgb(102, 9, 120)"
},
"fuchsia-500": {
type: "color",
light: "rgb(243, 147, 255)",
dark: "rgb(127, 23, 146)"
},
"fuchsia-600": {
type: "color",
light: "rgb(236, 105, 255)",
dark: "rgb(151, 38, 170)"
},
"fuchsia-700": {
type: "color",
light: "rgb(223, 77, 245)",
dark: "rgb(173, 51, 192)"
},
"fuchsia-800": {
type: "color",
light: "rgb(200, 68, 220)",
dark: "rgb(186, 60, 206)"
},
"fuchsia-900": {
type: "color",
light: "rgb(181, 57, 200)",
dark: "rgb(213, 73, 235)"
},
"fuchsia-1000": {
type: "color",
light: "rgb(156, 40, 175)",
dark: "rgb(232, 91, 253)"
},
"fuchsia-1100": {
type: "color",
light: "rgb(135, 27, 154)",
dark: "rgb(240, 122, 255)"
},
"fuchsia-1200": {
type: "color",
light: "rgb(113, 15, 131)",
dark: "rgb(245, 159, 255)"
},
"fuchsia-1300": {
type: "color",
light: "rgb(92, 4, 109)",
dark: "rgb(248, 191, 255)"
},
"fuchsia-1400": {
type: "color",
light: "rgb(72, 0, 88)",
dark: "rgb(251, 219, 255)"
},
"fuchsia-1500": {
type: "color",
light: "rgb(54, 0, 66)",
dark: "rgb(253, 241, 255)"
},
"fuchsia-1600": {
type: "color",
light: "rgb(29, 0, 35)",
dark: "rgb(255, 255, 255)"
},
"magenta-100": {
type: "color",
light: "rgb(255, 245, 248)",
dark: "rgb(59, 0, 22)"
},
"magenta-200": {
type: "color",
light: "rgb(255, 232, 240)",
dark: "rgb(74, 0, 27)"
},
"magenta-300": {
type: "color",
light: "rgb(255, 213, 227)",
dark: "rgb(93, 0, 34)"
},
"magenta-400": {
type: "color",
light: "rgb(255, 185, 208)",
dark: "rgb(123, 0, 45)"
},
"magenta-500": {
type: "color",
light: "rgb(255, 152, 187)",
dark: "rgb(152, 7, 60)"
},
"magenta-600": {
type: "color",
light: "rgb(255, 112, 159)",
dark: "rgb(181, 19, 76)"
},
"magenta-700": {
type: "color",
light: "rgb(255, 72, 133)",
dark: "rgb(207, 31, 92)"
},
"magenta-800": {
type: "color",
light: "rgb(240, 45, 110)",
dark: "rgb(224, 38, 101)"
},
"magenta-900": {
type: "color",
light: "rgb(217, 35, 97)",
dark: "rgb(255, 51, 119)"
},
"magenta-1000": {
type: "color",
light: "rgb(186, 22, 80)",
dark: "rgb(255, 96, 149)"
},
"magenta-1100": {
type: "color",
light: "rgb(163, 5, 62)",
dark: "rgb(255, 128, 171)"
},
"magenta-1200": {
type: "color",
light: "rgb(136, 0, 51)",
dark: "rgb(255, 163, 194)"
},
"magenta-1300": {
type: "color",
light: "rgb(111, 0, 40)",
dark: "rgb(255, 193, 214)"
},
"magenta-1400": {
type: "color",
light: "rgb(86, 0, 30)",
dark: "rgb(255, 220, 232)"
},
"magenta-1500": {
type: "color",
light: "rgb(64, 0, 22)",
dark: "rgb(255, 241, 246)"
},
"magenta-1600": {
type: "color",
light: "rgb(35, 0, 12)",
dark: "rgb(255, 255, 255)"
},
"pink-100": {
type: "color",
light: "rgb(255, 246, 252)",
dark: "rgb(58, 0, 37)"
},
"pink-200": {
type: "color",
light: "rgb(255, 232, 247)",
dark: "rgb(71, 0, 44)"
},
"pink-300": {
type: "color",
light: "rgb(255, 211, 240)",
dark: "rgb(90, 0, 57)"
},
"pink-400": {
type: "color",
light: "rgb(255, 181, 230)",
dark: "rgb(115, 7, 75)"
},
"pink-500": {
type: "color",
light: "rgb(255, 148, 219)",
dark: "rgb(143, 18, 97)"
},
"pink-600": {
type: "color",
light: "rgb(255, 103, 204)",
dark: "rgb(171, 29, 119)"
},
"pink-700": {
type: "color",
light: "rgb(242, 76, 184)",
dark: "rgb(196, 39, 138)"
},
"pink-800": {
type: "color",
light: "rgb(228, 52, 163)",
dark: "rgb(213, 45, 151)"
},
"pink-900": {
type: "color",
light: "rgb(206, 42, 146)",
dark: "rgb(236, 67, 175)"
},
"pink-1000": {
type: "color",
light: "rgb(176, 31, 123)",
dark: "rgb(251, 90, 196)"
},
"pink-1100": {
type: "color",
light: "rgb(152, 22, 104)",
dark: "rgb(255, 122, 210)"
},
"pink-1200": {
type: "color",
light: "rgb(128, 12, 85)",
dark: "rgb(255, 159, 223)"
},
"pink-1300": {
type: "color",
light: "rgb(105, 3, 68)",
dark: "rgb(255, 191, 234)"
},
"pink-1400": {
type: "color",
light: "rgb(83, 0, 53)",
dark: "rgb(255, 219, 243)"
},
"pink-1500": {
type: "color",
light: "rgb(62, 0, 39)",
dark: "rgb(255, 241, 250)"
},
"pink-1600": {
type: "color",
light: "rgb(33, 0, 21)",
dark: "rgb(255, 255, 255)"
},
"turquoise-100": {
type: "color",
light: "rgb(238, 251, 251)",
dark: "rgb(0, 30, 33)"
},
"turquoise-200": {
type: "color",
light: "rgb(209, 245, 245)",
dark: "rgb(0, 37, 41)"
},
"turquoise-300": {
type: "color",
light: "rgb(169, 236, 237)",
dark: "rgb(0, 49, 54)"
},
"turquoise-400": {
type: "color",
light: "rgb(111, 221, 228)",
dark: "rgb(0, 66, 72)"
},
"turquoise-500": {
type: "color",
light: "rgb(39, 202, 216)",
dark: "rgb(3, 84, 92)"
},
"turquoise-600": {
type: "color",
light: "rgb(15, 177, 192)",
dark: "rgb(5, 103, 112)"
},
"turquoise-700": {
type: "color",
light: "rgb(12, 158, 171)",
dark: "rgb(7, 120, 131)"
},
"turquoise-800": {
type: "color",
light: "rgb(10, 141, 153)",
dark: "rgb(9, 131, 142)"
},
"turquoise-900": {
type: "color",
light: "rgb(8, 126, 137)",
dark: "rgb(11, 151, 164)"
},
"turquoise-1000": {
type: "color",
light: "rgb(5, 107, 116)",
dark: "rgb(13, 168, 182)"
},
"turquoise-1100": {
type: "color",
light: "rgb(3, 90, 98)",
dark: "rgb(16, 186, 202)"
},
"turquoise-1200": {
type: "color",
light: "rgb(1, 74, 81)",
dark: "rgb(64, 208, 220)"
},
"turquoise-1300": {
type: "color",
light: "rgb(0, 59, 65)",
dark: "rgb(128, 225, 231)"
},
"turquoise-1400": {
type: "color",
light: "rgb(0, 44, 49)",
dark: "rgb(183, 240, 240)"
},
"turquoise-1500": {
type: "color",
light: "rgb(0, 32, 35)",
dark: "rgb(228, 249, 249)"
},
"turquoise-1600": {
type: "color",
light: "rgb(0, 15, 17)",
dark: "rgb(255, 255, 255)"
},
"brown-100": {
type: "color",
light: "rgb(252, 247, 242)",
dark: "rgb(35, 24, 8)"
},
"brown-200": {
type: "color",
light: "rgb(247, 238, 225)",
dark: "rgb(44, 31, 11)"
},
"brown-300": {
type: "color",
light: "rgb(239, 221, 195)",
dark: "rgb(58, 40, 14)"
},
"brown-400": {
type: "color",
light: "rgb(229, 200, 157)",
dark: "rgb(78, 55, 19)"
},
"brown-500": {
type: "color",
light: "rgb(214, 177, 123)",
dark: "rgb(98, 71, 30)"
},
"brown-600": {
type: "color",
light: "rgb(190, 155, 104)",
dark: "rgb(115, 88, 47)"
},
"brown-700": {
type: "color",
light: "rgb(171, 138, 90)",
dark: "rgb(132, 104, 61)"
},
"brown-800": {
type: "color",
light: "rgb(154, 123, 77)",
dark: "rgb(143, 114, 69)"
},
"brown-900": {
type: "color",
light: "rgb(139, 109, 66)",
dark: "rgb(163, 132, 84)"
},
"brown-1000": {
type: "color",
light: "rgb(119, 91, 50)",
dark: "rgb(181, 147, 98)"
},
"brown-1100": {
type: "color",
light: "rgb(103, 76, 35)",
dark: "rgb(199, 163, 112)"
},
"brown-1200": {
type: "color",
light: "rgb(88, 61, 21)",
dark: "rgb(222, 185, 130)"
},
"brown-1300": {
type: "color",
light: "rgb(70, 49, 17)",
dark: "rgb(232, 207, 169)"
},
"brown-1400": {
type: "color",
light: "rgb(52, 37, 13)",
dark: "rgb(242, 227, 206)"
},
"brown-1500": {
type: "color",
light: "rgb(38, 26, 9)",
dark: "rgb(250, 244, 236)"
},
"brown-1600": {
type: "color",
light: "rgb(16, 12, 4)",
dark: "rgb(255, 255, 255)"
},
"silver-100": {
type: "color",
light: "rgb(247, 247, 247)",
dark: "rgb(26, 26, 26)"
},
"silver-200": {
type: "color",
light: "rgb(239, 239, 239)",
dark: "rgb(33, 33, 33)"
},
"silver-300": {
type: "color",
light: "rgb(223, 223, 223)",
dark: "rgb(44, 44, 44)"
},
"silver-400": {
type: "color",
light: "rgb(204, 204, 204)",
dark: "rgb(59, 59, 59)"
},
"silver-500": {
type: "color",
light: "rgb(183, 183, 183)",
dark: "rgb(76, 76, 76)"
},
"silver-600": {
type: "color",
light: "rgb(160, 160, 160)",
dark: "rgb(92, 92, 92)"
},
"silver-700": {
type: "color",
light: "rgb(143, 143, 143)",
dark: "rgb(108, 108, 108)"
},
"silver-800": {
type: "color",
light: "rgb(128, 128, 128)",
dark: "rgb(118, 118, 118)"
},
"silver-900": {
type: "color",
light: "rgb(114, 114, 114)",
dark: "rgb(137, 137, 137)"
},
"silver-1000": {
type: "color",
light: "rgb(96, 96, 96)",
dark: "rgb(152, 152, 152)"
},
"silver-1100": {
type: "color",
light: "rgb(81, 81, 81)",
dark: "rgb(169, 169, 169)"
},
"silver-1200": {
type: "color",
light: "rgb(66, 66, 66)",
dark: "rgb(190, 190, 190)"
},
"silver-1300": {
type: "color",
light: "rgb(52, 52, 52)",
dark: "rgb(211, 211, 211)"
},
"silver-1400": {
type: "color",
light: "rgb(39, 39, 39)",
dark: "rgb(229, 229, 229)"
},
"silver-1500": {
type: "color",
light: "rgb(28, 28, 28)",
dark: "rgb(244, 244, 244)"
},
"silver-1600": {
type: "color",
light: "rgb(12, 12, 12)",
dark: "rgb(255, 255, 255)"
},
"cinnamon-100": {
type: "color",
light: "rgb(253, 247, 243)",
dark: "rgb(48, 17, 4)"
},
"cinnamon-200": {
type: "color",
light: "rgb(249, 236, 229)",
dark: "rgb(59, 21, 5)"
},
"cinnamon-300": {
type: "color",
light: "rgb(244, 218, 203)",
dark: "rgb(79, 28, 7)"
},
"cinnamon-400": {
type: "color",
light: "rgb(237, 196, 172)",
dark: "rgb(100, 41, 15)"
},
"cinnamon-500": {
type: "color",
light: "rgb(229, 170, 136)",
dark: "rgb(122, 57, 28)"
},
"cinnamon-600": {
type: "color",
light: "rgb(212, 145, 108)",
dark: "rgb(143, 74, 40)"
},
"cinnamon-700": {
type: "color",
light: "rgb(198, 126, 88)",
dark: "rgb(163, 88, 52)"
},
"cinnamon-800": {
type: "color",
light: "rgb(184, 109, 70)",
dark: "rgb(176, 98, 59)"
},
"cinnamon-900": {
type: "color",
light: "rgb(170, 94, 56)",
dark: "rgb(192, 119, 80)"
},
"cinnamon-1000": {
type: "color",
light: "rgb(147, 77, 43)",
dark: "rgb(206, 136, 99)"
},
"cinnamon-1100": {
type: "color",
light: "rgb(128, 62, 32)",
dark: "rgb(220, 154, 118)"
},
"cinnamon-1200": {
type: "color",
light: "rgb(110, 48, 21)",
dark: "rgb(232, 179, 149)"
},
"cinnamon-1300": {
type: "color",
light: "rgb(92, 35, 11)",
dark: "rgb(239, 203, 183)"
},
"cinnamon-1400": {
type: "color",
light: "rgb(72, 25, 6)",
dark: "rgb(246, 225, 214)"
},
"cinnamon-1500": {
type: "color",
light: "rgb(52, 18, 4)",
dark: "rgb(252, 244, 239)"
},
"cinnamon-1600": {
type: "color",
light: "rgb(24, 8, 2)",
dark: "rgb(255, 255, 255)"
},
"accent-100": {
type: "ref",
light: "blue-100",
dark: "blue-100"
},
"accent-200": {
type: "ref",
light: "blue-200",
dark: "blue-200"
},
"accent-300": {
type: "ref",
light: "blue-300",
dark: "blue-300"
},
"accent-400": {
type: "ref",
light: "blue-400",
dark: "blue-400"
},
"accent-500": {
type: "ref",
light: "blue-500",
dark: "blue-500"
},
"accent-600": {
type: "ref",
light: "blue-600",
dark: "blue-600"
},
"accent-700": {
type: "ref",
light: "blue-700",
dark: "blue-700"
},
"accent-800": {
type: "ref",
light: "blue-800",
dark: "blue-800"
},
"accent-900": {
type: "ref",
light: "blue-900",
dark: "blue-900"
},
"accent-1000": {
type: "ref",
light: "blue-1000",
dark: "blue-1000"
},
"accent-1100": {
type: "ref",
light: "blue-1100",
dark: "blue-1100"
},
"accent-1200": {
type: "ref",
light: "blue-1200",
dark: "blue-1200"
},
"accent-1300": {
type: "ref",
light: "blue-1300",
dark: "blue-1300"
},
"accent-1400": {
type: "ref",
light: "blue-1400",
dark: "blue-1400"
},
"accent-1500": {
type: "ref",
light: "blue-1500",
dark: "blue-1500"
},
"accent-1600": {
type: "ref",
light: "blue-1600",
dark: "blue-1600"
},
"informative-100": {
type: "ref",
light: "blue-100",
dark: "blue-100"
},
"informative-200": {
type: "ref",
light: "blue-200",
dark: "blue-200"
},
"informative-300": {
type: "ref",
light: "blue-300",
dark: "blue-300"
},
"informative-400": {
type: "ref",
light: "blue-400",
dark: "blue-400"
},
"informative-500": {
type: "ref",
light: "blue-500",
dark: "blue-500"
},
"informative-600": {
type: "ref",
light: "blue-600",
dark: "blue-600"
},
"informative-700": {
type: "ref",
light: "blue-700",
dark: "blue-700"
},
"informative-800": {
type: "ref",
light: "blue-800",
dark: "blue-800"
},
"informative-900": {
type: "ref",
light: "blue-900",
dark: "blue-900"
},
"informative-1000": {
type: "ref",
light: "blue-1000",
dark: "blue-1000"
},
"informative-1100": {
type: "ref",
light: "blue-1100",
dark: "blue-1100"
},
"informative-1200": {
type: "ref",
light: "blue-1200",
dark: "blue-1200"
},
"informative-1300": {
type: "ref",
light: "blue-1300",
dark: "blue-1300"
},
"informative-1400": {
type: "ref",
light: "blue-1400",
dark: "blue-1400"
},
"informative-1500": {
type: "ref",
light: "blue-1500",
dark: "blue-1500"
},
"informative-1600": {
type: "ref",
light: "blue-1600",
dark: "blue-1600"
},
"negative-100": {
type: "ref",
light: "red-100",
dark: "red-100"
},
"negative-200": {
type: "ref",
light: "red-200",
dark: "red-200"
},
"negative-300": {
type: "ref",
light: "red-300",
dark: "red-300"
},
"negative-400": {
type: "ref",
light: "red-400",
dark: "red-400"
},
"negative-500": {
type: "ref",
light: "red-500",
dark: "red-500"
},
"negative-600": {
type: "ref",
light: "red-600",
dark: "red-600"
},
"negative-700": {
type: "ref",
light: "red-700",
dark: "red-700"
},
"negative-800": {
type: "ref",
light: "red-800",
dark: "red-800"
},
"negative-900": {
type: "ref",
light: "red-900",
dark: "red-900"
},
"negative-1000": {
type: "ref",
light: "red-1000",
dark: "red-1000"
},
"negative-1100": {
type: "ref",
light: "red-1100",
dark: "red-1100"
},
"negative-1200": {
type: "ref",
light: "red-1200",
dark: "red-1200"
},
"negative-1300": {
type: "ref",
light: "red-1300",
dark: "red-1300"
},
"negative-1400": {
type: "ref",
light: "red-1400",
dark: "red-1400"
},
"negative-1500": {
type: "ref",
light: "red-1500",
dark: "red-1500"
},
"negative-1600": {
type: "ref",
light: "red-1600",
dark: "red-1600"
},
"notice-100": {
type: "ref",
light: "orange-100",
dark: "orange-100"
},
"notice-200": {
type: "ref",
light: "orange-200",
dark: "orange-200"
},
"notice-300": {
type: "ref",
light: "orange-300",
dark: "orange-300"
},
"notice-400": {
type: "ref",
light: "orange-400",
dark: "orange-400"
},
"notice-500": {
type: "ref",
light: "orange-500",
dark: "orange-500"
},
"notice-600": {
type: "ref",
light: "orange-600",
dark: "orange-600"
},
"notice-700": {
type: "ref",
light: "orange-700",
dark: "orange-700"
},
"notice-800": {
type: "ref",
light: "orange-800",
dark: "orange-800"
},
"notice-900": {
type: "ref",
light: "orange-900",
dark: "orange-900"
},
"notice-1000": {
type: "ref",
light: "orange-1000",
dark: "orange-1000"
},
"notice-1100": {
type: "ref",
light: "orange-1100",
dark: "orange-1100"
},
"notice-1200": {
type: "ref",
light: "orange-1200",
dark: "orange-1200"
},
"notice-1300": {
type: "ref",
light: "orange-1300",
dark: "orange-1300"
},
"notice-1400": {
type: "ref",
light: "orange-1400",
dark: "orange-1400"
},
"notice-1500": {
type: "ref",
light: "orange-1500",
dark: "orange-1500"
},
"notice-1600": {
type: "ref",
light: "orange-1600",
dark: "orange-1600"
},
"positive-100": {
type: "ref",
light: "green-100",
dark: "green-100"
},
"positive-200": {
type: "ref",
light: "green-200",
dark: "green-200"
},
"positive-300": {
type: "ref",
light: "green-300",
dark: "green-300"
},
"positive-400": {
type: "ref",
light: "green-400",
dark: "green-400"
},
"positive-500": {
type: "ref",
light: "green-500",
dark: "green-500"
},
"positive-600": {
type: "ref",
light: "green-600",
dark: "green-600"
},
"positive-700": {
type: "ref",
light: "green-700",
dark: "green-700"
},
"positive-800": {
type: "ref",
light: "green-800",
dark: "green-800"
},
"positive-900": {
type: "ref",
light: "green-900",
dark: "green-900"
},
"positive-1000": {
type: "ref",
light: "green-1000",
dark: "green-1000"
},
"positive-1100": {
type: "ref",
light: "green-1100",
dark: "green-1100"
},
"positive-1200": {
type: "ref",
light: "green-1200",
dark: "green-1200"
},
"positive-1300": {
type: "ref",
light: "green-1300",
dark: "green-1300"
},
"positive-1400": {
type: "ref",
light: "green-1400",
dark: "green-1400"
},
"positive-1500": {
type: "ref",
light: "green-1500",
dark: "green-1500"
},
"positive-1600": {
type: "ref",
light: "green-1600",
dark: "green-1600"
},
"transparent-white-25": "rgba(255, 255, 255, 0)",
"transparent-white-50": "rgba(255, 255, 255, 0.04)",
"transparent-white-75": "rgba(255, 255, 255, 0.07)",
"transparent-white-100": "rgba(255, 255, 255, 0.11)",
"transparent-white-200": "rgba(255, 255, 255, 0.14)",
"transparent-white-300": "rgba(255, 255, 255, 0.17)",
"transparent-white-400": "rgba(255, 255, 255, 0.21)",
"transparent-white-500": "rgba(255, 255, 255, 0.39)",
"transparent-white-600": "rgba(255, 255, 255, 0.51)",
"transparent-white-700": "rgba(255, 255, 255, 0.66)",
"transparent-white-800": "rgba(255, 255, 255, 0.85)",
"transparent-white-900": "rgba(255, 255, 255, 0.94)",
"transparent-white-1000": "rgb(255, 255, 255)",
"transparent-black-25": "rgba(0, 0, 0, 0)",
"transparent-black-50": "rgba(0, 0, 0, 0.03)",
"transparent-black-75": "rgba(0, 0, 0, 0.05)",
"transparent-black-100": "rgba(0, 0, 0, 0.09)",
"transparent-black-200": "rgba(0, 0, 0, 0.12)",
"transparent-black-300": "rgba(0, 0, 0, 0.15)",
"transparent-black-400": "rgba(0, 0, 0, 0.22)",
"transparent-black-500": "rgba(0, 0, 0, 0.44)",
"transparent-black-600": "rgba(0, 0, 0, 0.56)",
"transparent-black-700": "rgba(0, 0, 0, 0.69)",
"transparent-black-800": "rgba(0, 0, 0, 0.84)",
"transparent-black-900": "rgba(0, 0, 0, 0.93)",
"transparent-black-1000": "rgb(0, 0, 0)",
"transparent-overlay-25": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0)",
"transparent-overlay-50": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0.04)",
"transparent-overlay-75": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0.07)",
"transparent-overlay-100": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0.11)",
"transparent-overlay-200": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0.14)",
"transparent-overlay-300": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0.17)",
"transparent-overlay-400": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0.21)",
"transparent-overlay-500": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0.39)",
"transparent-overlay-600": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0.51)",
"transparent-overlay-700": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0.66)",
"transparent-overlay-800": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0.85)",
"transparent-overlay-900": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 0.94)",
"transparent-overlay-1000": "lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / 1)",
// High contrast mode.
Background: 'Background',
ButtonBorder: 'ButtonBorder',
ButtonFace: 'ButtonFace',
ButtonText: 'ButtonText',
Field: 'Field',
Highlight: 'Highlight',
HighlightText: 'HighlightText',
GrayText: 'GrayText',
Mark: 'Mark',
LinkText: 'LinkText'
};
// Resolves a color to its most basic form, following all aliases.
function $27684d56c53d4b5c$var$resolveColorToken(token) {
if (typeof token === 'string') return {
type: 'color',
light: token,
dark: token
};
if (token.type === 'color') return token;
let lightToken = $27684d56c53d4b5c$var$baseColors[token.light];
if (!lightToken) throw new Error(`${token.light} is not a valid color reference`);
let darkToken = $27684d56c53d4b5c$var$baseColors[token.dark];
if (!darkToken) throw new Error(`${token.dark} is not a valid color reference`);
let light = $27684d56c53d4b5c$var$resolveColorToken(lightToken);
let dark = $27684d56c53d4b5c$var$resolveColorToken(darkToken);
return {
type: 'color',
light: light.light,
dark: dark.dark
};
}
function $27684d56c53d4b5c$var$colorTokenToString(token, opacity) {
let result = token.light === token.dark ? token.light : `light-dark(${token.light}, ${token.dark})`;
if (opacity) result = `rgb(from ${result} r g b / ${opacity}%)`;
return result;
}
// Bumps up a color token by one stop, e.g. for hover/press states.
let $27684d56c53d4b5c$var$colorList = Object.keys($27684d56c53d4b5c$var$baseColors);
function $27684d56c53d4b5c$var$nextColorStop(name, token) {
if (typeof token === 'object' && token.type === 'ref') {
let light = $27684d56c53d4b5c$var$nextColorStop(token.light, $27684d56c53d4b5c$var