diff --git a/__integration__/__snapshots__/css.test.js.snap b/__integration__/__snapshots__/css.test.js.snap index e21ab17b2..b696b4969 100644 --- a/__integration__/__snapshots__/css.test.js.snap +++ b/__integration__/__snapshots__/css.test.js.snap @@ -180,341 +180,341 @@ exports[`integration css css/variables with references should match snapshot 1`] */ :root { - --size-padding-xl: 1rem; - --size-padding-large: 1rem; - --size-padding-medium: 1rem; - --size-padding-small: 0.5rem; - --size-font-xl: 2.25rem; - --size-font-large: 1.5rem; - --size-font-medium: 1rem; - --size-font-small: 0.75rem; - --size-border-radius-large: 30rem; - --color-core-yellow-1100: #2d1a05; - --color-core-yellow-1000: #542a00; - --color-core-yellow-900: #944c0c; - --color-core-yellow-800: #ba7506; - --color-core-yellow-700: #dd9903; - --color-core-yellow-600: #ffbc00; - --color-core-yellow-500: #ffcd1c; - --color-core-yellow-400: #ffd943; - --color-core-yellow-300: #ffe16e; - --color-core-yellow-200: #ffe99a; - --color-core-yellow-100: #fdefcd; - --color-core-yellow-0: #fff8e2; - --color-core-neutral-1100: #040404; - --color-core-neutral-1000: #162020; - --color-core-neutral-900: #273333; - --color-core-neutral-800: #364141; - --color-core-neutral-700: #515e5f; - --color-core-neutral-600: #6e797a; - --color-core-neutral-500: #929a9b; - --color-core-neutral-400: #b0b6b7; - --color-core-neutral-300: #c8cccc; - --color-core-neutral-200: #dee1e1; - --color-core-neutral-100: #f3f4f4; - --color-core-neutral-0: #ffffff; - --color-core-orange-1100: #2d130e; - --color-core-orange-1000: #601700; - --color-core-orange-900: #962c0b; - --color-core-orange-800: #ce5511; - --color-core-orange-700: #ed7024; - --color-core-orange-600: #f57d33; - --color-core-orange-500: #fc8943; - --color-core-orange-400: #ff9c5d; - --color-core-orange-300: #ffb180; - --color-core-orange-200: #ffc6a4; - --color-core-orange-100: #fcdccc; - --color-core-orange-0: #ffede3; - --color-core-red-1100: #2b1111; - --color-core-red-1000: #6d1313; - --color-core-red-900: #992222; - --color-core-red-800: #c63434; - --color-core-red-700: #db3e3e; - --color-core-red-600: #ed4c42; - --color-core-red-500: #f76054; - --color-core-red-400: #ff7f6e; - --color-core-red-300: #ff9c8f; - --color-core-red-200: #ffb8b1; - --color-core-red-100: #ffd5d2; - --color-core-red-0: #ffeae9; - --color-core-pink-1100: #2b1721; - --color-core-pink-1000: #561231; - --color-core-pink-900: #931847; - --color-core-pink-800: #b22f5b; - --color-core-pink-700: #ce3665; - --color-core-pink-600: #e0447c; - --color-core-pink-500: #ef588b; - --color-core-pink-400: #ff76ae; - --color-core-pink-300: #ff95c1; - --color-core-pink-200: #ffb5d5; - --color-core-pink-100: #fcdbeb; - --color-core-pink-0: #ffe9f3; - --color-core-magenta-1100: #29192d; - --color-core-magenta-1000: #451551; - --color-core-magenta-900: #6c2277; - --color-core-magenta-800: #8f3896; - --color-core-magenta-700: #ac44a8; - --color-core-magenta-600: #c44eb9; - --color-core-magenta-500: #db61db; - --color-core-magenta-400: #f282f5; - --color-core-magenta-300: #edadf2; - --color-core-magenta-200: #f4c4f7; - --color-core-magenta-100: #f9e3fc; - --color-core-magenta-0: #fef0ff; - --color-core-purple-1100: #1d1d38; - --color-core-purple-1000: #2d246b; - --color-core-purple-900: #483a9c; - --color-core-purple-800: #5e4eba; - --color-core-purple-700: #6f5ed3; - --color-core-purple-600: #816fea; - --color-core-purple-500: #9180f4; - --color-core-purple-400: #a193f2; - --color-core-purple-300: #c1c1f7; - --color-core-purple-200: #d8d7f9; - --color-core-purple-100: #eaeaf9; - --color-core-purple-0: #f2f2f9; - --color-core-blue-1100: #002138; - --color-core-blue-1000: #0a3960; - --color-core-blue-900: #0c5689; - --color-core-blue-800: #116daa; - --color-core-blue-700: #2079c3; - --color-core-blue-600: #2b87d3; - --color-core-blue-500: #3896e3; - --color-core-blue-400: #56adf5; - --color-core-blue-300: #a1d2f8; - --color-core-blue-200: #c7e4f9; - --color-core-blue-100: #dcf2ff; - --color-core-blue-0: #e9f8ff; - --color-core-aqua-1100: #002838; - --color-core-aqua-1000: #083d4f; - --color-core-aqua-900: #035e73; - --color-core-aqua-800: #0f6e84; - --color-core-aqua-700: #0b8599; - --color-core-aqua-600: #0797ae; - --color-core-aqua-500: #17b8ce; - --color-core-aqua-400: #33d6e2; - --color-core-aqua-300: #76e5e2; - --color-core-aqua-200: #a5f2f2; - --color-core-aqua-100: #c5f9f9; - --color-core-aqua-0: #d9fcfb; - --color-core-teal-1100: #002528; - --color-core-teal-1000: #083f3f; - --color-core-teal-900: #026661; - --color-core-teal-800: #067c7c; - --color-core-teal-700: #0b968f; - --color-core-teal-600: #00a99c; - --color-core-teal-500: #08c4b2; - --color-core-teal-400: #24e0c5; - --color-core-teal-300: #7dead5; - --color-core-teal-200: #b3f2e6; - --color-core-teal-100: #cdf7ef; - --color-core-teal-0: #e5f9f5; - --color-core-green-1100: #002b20; - --color-core-green-1000: #08422f; - --color-core-green-900: #006b40; - --color-core-green-800: #008b46; - --color-core-green-700: #0ca750; - --color-core-green-600: #2bb656; - --color-core-green-500: #59cb59; - --color-core-green-400: #75dd66; - --color-core-green-300: #98e58e; - --color-core-green-200: #c2f2bd; - --color-core-green-100: #d7f4d7; --color-core-green-0: #ebf9eb; - --color-background-primary: var(--color-core-neutral-0); - --color-background-secondary: var(--color-core-neutral-100); - --color-background-tertiary: var(--color-core-neutral-200); - --color-background-danger: var(--color-core-red-0); - --color-background-warning: var(--color-core-orange-0); - --color-background-success: var(--color-core-green-0); - --color-background-info: var(--color-core-blue-0); - --color-background-disabled: var(--color-background-tertiary); - --color-border-primary: var(--color-core-neutral-300); - --color-brand-primary: var(--color-core-aqua-700); - --color-brand-secondary: var(--color-core-purple-700); - --color-font-primary: var(--color-core-neutral-1100); - --color-font-secondary: var(--color-core-neutral-900); - --color-font-tertiary: var(--color-core-neutral-800); - --color-font-interactive: var(--color-brand-primary); - --color-font-interactive-hover: var(--color-brand-primary); - --color-font-interactive-active: var(--color-brand-secondary); - --color-font-interactive-disabled: var(--color-font-tertiary); - --color-font-danger: var(--color-core-red-1000); - --color-font-warning: var(--color-core-orange-1000); - --color-font-success: var(--color-core-green-1000); -} -" -`; - -exports[`integration css css/variables with selector should match snapshot 1`] = ` -"/** - * Do not edit directly - * Generated on Sat, 01 Jan 2000 00:00:00 GMT - */ - -.test { - --size-padding-xl: 1rem; - --size-padding-large: 1rem; - --size-padding-medium: 1rem; - --size-padding-small: 0.5rem; - --size-font-xl: 2.25rem; - --size-font-large: 1.5rem; - --size-font-medium: 1rem; - --size-font-small: 0.75rem; - --size-border-radius-large: 30rem; - --color-core-yellow-1100: #2d1a05; - --color-core-yellow-1000: #542a00; - --color-core-yellow-900: #944c0c; - --color-core-yellow-800: #ba7506; - --color-core-yellow-700: #dd9903; - --color-core-yellow-600: #ffbc00; - --color-core-yellow-500: #ffcd1c; - --color-core-yellow-400: #ffd943; - --color-core-yellow-300: #ffe16e; - --color-core-yellow-200: #ffe99a; - --color-core-yellow-100: #fdefcd; - --color-core-yellow-0: #fff8e2; - --color-core-neutral-1100: #040404; - --color-core-neutral-1000: #162020; - --color-core-neutral-900: #273333; - --color-core-neutral-800: #364141; - --color-core-neutral-700: #515e5f; - --color-core-neutral-600: #6e797a; - --color-core-neutral-500: #929a9b; - --color-core-neutral-400: #b0b6b7; - --color-core-neutral-300: #c8cccc; - --color-core-neutral-200: #dee1e1; - --color-core-neutral-100: #f3f4f4; - --color-core-neutral-0: #ffffff; - --color-core-orange-1100: #2d130e; - --color-core-orange-1000: #601700; - --color-core-orange-900: #962c0b; - --color-core-orange-800: #ce5511; - --color-core-orange-700: #ed7024; - --color-core-orange-600: #f57d33; - --color-core-orange-500: #fc8943; - --color-core-orange-400: #ff9c5d; - --color-core-orange-300: #ffb180; - --color-core-orange-200: #ffc6a4; - --color-core-orange-100: #fcdccc; - --color-core-orange-0: #ffede3; - --color-core-red-1100: #2b1111; - --color-core-red-1000: #6d1313; - --color-core-red-900: #992222; - --color-core-red-800: #c63434; - --color-core-red-700: #db3e3e; - --color-core-red-600: #ed4c42; - --color-core-red-500: #f76054; - --color-core-red-400: #ff7f6e; - --color-core-red-300: #ff9c8f; - --color-core-red-200: #ffb8b1; - --color-core-red-100: #ffd5d2; - --color-core-red-0: #ffeae9; - --color-core-pink-1100: #2b1721; - --color-core-pink-1000: #561231; - --color-core-pink-900: #931847; - --color-core-pink-800: #b22f5b; - --color-core-pink-700: #ce3665; - --color-core-pink-600: #e0447c; - --color-core-pink-500: #ef588b; - --color-core-pink-400: #ff76ae; - --color-core-pink-300: #ff95c1; - --color-core-pink-200: #ffb5d5; - --color-core-pink-100: #fcdbeb; - --color-core-pink-0: #ffe9f3; - --color-core-magenta-1100: #29192d; - --color-core-magenta-1000: #451551; - --color-core-magenta-900: #6c2277; - --color-core-magenta-800: #8f3896; - --color-core-magenta-700: #ac44a8; - --color-core-magenta-600: #c44eb9; - --color-core-magenta-500: #db61db; - --color-core-magenta-400: #f282f5; - --color-core-magenta-300: #edadf2; - --color-core-magenta-200: #f4c4f7; - --color-core-magenta-100: #f9e3fc; - --color-core-magenta-0: #fef0ff; - --color-core-purple-1100: #1d1d38; - --color-core-purple-1000: #2d246b; - --color-core-purple-900: #483a9c; - --color-core-purple-800: #5e4eba; - --color-core-purple-700: #6f5ed3; - --color-core-purple-600: #816fea; - --color-core-purple-500: #9180f4; - --color-core-purple-400: #a193f2; - --color-core-purple-300: #c1c1f7; - --color-core-purple-200: #d8d7f9; - --color-core-purple-100: #eaeaf9; - --color-core-purple-0: #f2f2f9; - --color-core-blue-1100: #002138; - --color-core-blue-1000: #0a3960; - --color-core-blue-900: #0c5689; - --color-core-blue-800: #116daa; - --color-core-blue-700: #2079c3; - --color-core-blue-600: #2b87d3; - --color-core-blue-500: #3896e3; - --color-core-blue-400: #56adf5; - --color-core-blue-300: #a1d2f8; - --color-core-blue-200: #c7e4f9; - --color-core-blue-100: #dcf2ff; - --color-core-blue-0: #e9f8ff; - --color-core-aqua-1100: #002838; - --color-core-aqua-1000: #083d4f; - --color-core-aqua-900: #035e73; - --color-core-aqua-800: #0f6e84; - --color-core-aqua-700: #0b8599; - --color-core-aqua-600: #0797ae; - --color-core-aqua-500: #17b8ce; - --color-core-aqua-400: #33d6e2; - --color-core-aqua-300: #76e5e2; - --color-core-aqua-200: #a5f2f2; - --color-core-aqua-100: #c5f9f9; - --color-core-aqua-0: #d9fcfb; - --color-core-teal-1100: #002528; - --color-core-teal-1000: #083f3f; - --color-core-teal-900: #026661; - --color-core-teal-800: #067c7c; - --color-core-teal-700: #0b968f; - --color-core-teal-600: #00a99c; - --color-core-teal-500: #08c4b2; - --color-core-teal-400: #24e0c5; - --color-core-teal-300: #7dead5; - --color-core-teal-200: #b3f2e6; - --color-core-teal-100: #cdf7ef; - --color-core-teal-0: #e5f9f5; - --color-core-green-1100: #002b20; - --color-core-green-1000: #08422f; - --color-core-green-900: #006b40; - --color-core-green-800: #008b46; - --color-core-green-700: #0ca750; - --color-core-green-600: #2bb656; - --color-core-green-500: #59cb59; - --color-core-green-400: #75dd66; - --color-core-green-300: #98e58e; - --color-core-green-200: #c2f2bd; --color-core-green-100: #d7f4d7; + --color-core-green-200: #c2f2bd; + --color-core-green-300: #98e58e; + --color-core-green-400: #75dd66; + --color-core-green-500: #59cb59; + --color-core-green-600: #2bb656; + --color-core-green-700: #0ca750; + --color-core-green-800: #008b46; + --color-core-green-900: #006b40; + --color-core-green-1000: #08422f; + --color-core-green-1100: #002b20; + --color-core-teal-0: #e5f9f5; + --color-core-teal-100: #cdf7ef; + --color-core-teal-200: #b3f2e6; + --color-core-teal-300: #7dead5; + --color-core-teal-400: #24e0c5; + --color-core-teal-500: #08c4b2; + --color-core-teal-600: #00a99c; + --color-core-teal-700: #0b968f; + --color-core-teal-800: #067c7c; + --color-core-teal-900: #026661; + --color-core-teal-1000: #083f3f; + --color-core-teal-1100: #002528; + --color-core-aqua-0: #d9fcfb; + --color-core-aqua-100: #c5f9f9; + --color-core-aqua-200: #a5f2f2; + --color-core-aqua-300: #76e5e2; + --color-core-aqua-400: #33d6e2; + --color-core-aqua-500: #17b8ce; + --color-core-aqua-600: #0797ae; + --color-core-aqua-700: #0b8599; + --color-core-aqua-800: #0f6e84; + --color-core-aqua-900: #035e73; + --color-core-aqua-1000: #083d4f; + --color-core-aqua-1100: #002838; + --color-core-blue-0: #e9f8ff; + --color-core-blue-100: #dcf2ff; + --color-core-blue-200: #c7e4f9; + --color-core-blue-300: #a1d2f8; + --color-core-blue-400: #56adf5; + --color-core-blue-500: #3896e3; + --color-core-blue-600: #2b87d3; + --color-core-blue-700: #2079c3; + --color-core-blue-800: #116daa; + --color-core-blue-900: #0c5689; + --color-core-blue-1000: #0a3960; + --color-core-blue-1100: #002138; + --color-core-purple-0: #f2f2f9; + --color-core-purple-100: #eaeaf9; + --color-core-purple-200: #d8d7f9; + --color-core-purple-300: #c1c1f7; + --color-core-purple-400: #a193f2; + --color-core-purple-500: #9180f4; + --color-core-purple-600: #816fea; + --color-core-purple-700: #6f5ed3; + --color-core-purple-800: #5e4eba; + --color-core-purple-900: #483a9c; + --color-core-purple-1000: #2d246b; + --color-core-purple-1100: #1d1d38; + --color-core-magenta-0: #fef0ff; + --color-core-magenta-100: #f9e3fc; + --color-core-magenta-200: #f4c4f7; + --color-core-magenta-300: #edadf2; + --color-core-magenta-400: #f282f5; + --color-core-magenta-500: #db61db; + --color-core-magenta-600: #c44eb9; + --color-core-magenta-700: #ac44a8; + --color-core-magenta-800: #8f3896; + --color-core-magenta-900: #6c2277; + --color-core-magenta-1000: #451551; + --color-core-magenta-1100: #29192d; + --color-core-pink-0: #ffe9f3; + --color-core-pink-100: #fcdbeb; + --color-core-pink-200: #ffb5d5; + --color-core-pink-300: #ff95c1; + --color-core-pink-400: #ff76ae; + --color-core-pink-500: #ef588b; + --color-core-pink-600: #e0447c; + --color-core-pink-700: #ce3665; + --color-core-pink-800: #b22f5b; + --color-core-pink-900: #931847; + --color-core-pink-1000: #561231; + --color-core-pink-1100: #2b1721; + --color-core-red-0: #ffeae9; + --color-core-red-100: #ffd5d2; + --color-core-red-200: #ffb8b1; + --color-core-red-300: #ff9c8f; + --color-core-red-400: #ff7f6e; + --color-core-red-500: #f76054; + --color-core-red-600: #ed4c42; + --color-core-red-700: #db3e3e; + --color-core-red-800: #c63434; + --color-core-red-900: #992222; + --color-core-red-1000: #6d1313; + --color-core-red-1100: #2b1111; + --color-core-orange-0: #ffede3; + --color-core-orange-100: #fcdccc; + --color-core-orange-200: #ffc6a4; + --color-core-orange-300: #ffb180; + --color-core-orange-400: #ff9c5d; + --color-core-orange-500: #fc8943; + --color-core-orange-600: #f57d33; + --color-core-orange-700: #ed7024; + --color-core-orange-800: #ce5511; + --color-core-orange-900: #962c0b; + --color-core-orange-1000: #601700; + --color-core-orange-1100: #2d130e; + --color-core-neutral-0: #ffffff; + --color-core-neutral-100: #f3f4f4; + --color-core-neutral-200: #dee1e1; + --color-core-neutral-300: #c8cccc; + --color-core-neutral-400: #b0b6b7; + --color-core-neutral-500: #929a9b; + --color-core-neutral-600: #6e797a; + --color-core-neutral-700: #515e5f; + --color-core-neutral-800: #364141; + --color-core-neutral-900: #273333; + --color-core-neutral-1000: #162020; + --color-core-neutral-1100: #040404; + --color-core-yellow-0: #fff8e2; + --color-core-yellow-100: #fdefcd; + --color-core-yellow-200: #ffe99a; + --color-core-yellow-300: #ffe16e; + --color-core-yellow-400: #ffd943; + --color-core-yellow-500: #ffcd1c; + --color-core-yellow-600: #ffbc00; + --color-core-yellow-700: #dd9903; + --color-core-yellow-800: #ba7506; + --color-core-yellow-900: #944c0c; + --color-core-yellow-1000: #542a00; + --color-core-yellow-1100: #2d1a05; + --size-border-radius-large: 30rem; + --size-font-small: 0.75rem; + --size-font-medium: 1rem; + --size-font-large: 1.5rem; + --size-font-xl: 2.25rem; + --size-padding-small: 0.5rem; + --size-padding-medium: 1rem; + --size-padding-large: 1rem; + --size-padding-xl: 1rem; + --color-font-success: var(--color-core-green-1000); + --color-font-warning: var(--color-core-orange-1000); + --color-font-danger: var(--color-core-red-1000); + --color-font-tertiary: var(--color-core-neutral-800); + --color-font-secondary: var(--color-core-neutral-900); + --color-font-primary: var(--color-core-neutral-1100); + --color-brand-secondary: var(--color-core-purple-700); + --color-brand-primary: var(--color-core-aqua-700); + --color-border-primary: var(--color-core-neutral-300); + --color-background-info: var(--color-core-blue-0); + --color-background-success: var(--color-core-green-0); + --color-background-warning: var(--color-core-orange-0); + --color-background-danger: var(--color-core-red-0); + --color-background-tertiary: var(--color-core-neutral-200); + --color-background-secondary: var(--color-core-neutral-100); + --color-background-primary: var(--color-core-neutral-0); + --color-font-interactive-disabled: var(--color-font-tertiary); + --color-font-interactive-active: var(--color-brand-secondary); + --color-font-interactive-hover: var(--color-brand-primary); + --color-font-interactive: var(--color-brand-primary); + --color-background-disabled: var(--color-background-tertiary); +} +" +`; + +exports[`integration css css/variables with selector should match snapshot 1`] = ` +"/** + * Do not edit directly + * Generated on Sat, 01 Jan 2000 00:00:00 GMT + */ + +.test { --color-core-green-0: #ebf9eb; - --color-background-primary: #ffffff; - --color-background-secondary: #f3f4f4; - --color-background-tertiary: #dee1e1; - --color-background-danger: #ffeae9; - --color-background-warning: #ffede3; - --color-background-success: #ebf9eb; - --color-background-info: #e9f8ff; - --color-background-disabled: #dee1e1; - --color-border-primary: #c8cccc; - --color-brand-primary: #0b8599; - --color-brand-secondary: #6f5ed3; - --color-font-primary: #040404; - --color-font-secondary: #273333; + --color-core-green-100: #d7f4d7; + --color-core-green-200: #c2f2bd; + --color-core-green-300: #98e58e; + --color-core-green-400: #75dd66; + --color-core-green-500: #59cb59; + --color-core-green-600: #2bb656; + --color-core-green-700: #0ca750; + --color-core-green-800: #008b46; + --color-core-green-900: #006b40; + --color-core-green-1000: #08422f; + --color-core-green-1100: #002b20; + --color-core-teal-0: #e5f9f5; + --color-core-teal-100: #cdf7ef; + --color-core-teal-200: #b3f2e6; + --color-core-teal-300: #7dead5; + --color-core-teal-400: #24e0c5; + --color-core-teal-500: #08c4b2; + --color-core-teal-600: #00a99c; + --color-core-teal-700: #0b968f; + --color-core-teal-800: #067c7c; + --color-core-teal-900: #026661; + --color-core-teal-1000: #083f3f; + --color-core-teal-1100: #002528; + --color-core-aqua-0: #d9fcfb; + --color-core-aqua-100: #c5f9f9; + --color-core-aqua-200: #a5f2f2; + --color-core-aqua-300: #76e5e2; + --color-core-aqua-400: #33d6e2; + --color-core-aqua-500: #17b8ce; + --color-core-aqua-600: #0797ae; + --color-core-aqua-700: #0b8599; + --color-core-aqua-800: #0f6e84; + --color-core-aqua-900: #035e73; + --color-core-aqua-1000: #083d4f; + --color-core-aqua-1100: #002838; + --color-core-blue-0: #e9f8ff; + --color-core-blue-100: #dcf2ff; + --color-core-blue-200: #c7e4f9; + --color-core-blue-300: #a1d2f8; + --color-core-blue-400: #56adf5; + --color-core-blue-500: #3896e3; + --color-core-blue-600: #2b87d3; + --color-core-blue-700: #2079c3; + --color-core-blue-800: #116daa; + --color-core-blue-900: #0c5689; + --color-core-blue-1000: #0a3960; + --color-core-blue-1100: #002138; + --color-core-purple-0: #f2f2f9; + --color-core-purple-100: #eaeaf9; + --color-core-purple-200: #d8d7f9; + --color-core-purple-300: #c1c1f7; + --color-core-purple-400: #a193f2; + --color-core-purple-500: #9180f4; + --color-core-purple-600: #816fea; + --color-core-purple-700: #6f5ed3; + --color-core-purple-800: #5e4eba; + --color-core-purple-900: #483a9c; + --color-core-purple-1000: #2d246b; + --color-core-purple-1100: #1d1d38; + --color-core-magenta-0: #fef0ff; + --color-core-magenta-100: #f9e3fc; + --color-core-magenta-200: #f4c4f7; + --color-core-magenta-300: #edadf2; + --color-core-magenta-400: #f282f5; + --color-core-magenta-500: #db61db; + --color-core-magenta-600: #c44eb9; + --color-core-magenta-700: #ac44a8; + --color-core-magenta-800: #8f3896; + --color-core-magenta-900: #6c2277; + --color-core-magenta-1000: #451551; + --color-core-magenta-1100: #29192d; + --color-core-pink-0: #ffe9f3; + --color-core-pink-100: #fcdbeb; + --color-core-pink-200: #ffb5d5; + --color-core-pink-300: #ff95c1; + --color-core-pink-400: #ff76ae; + --color-core-pink-500: #ef588b; + --color-core-pink-600: #e0447c; + --color-core-pink-700: #ce3665; + --color-core-pink-800: #b22f5b; + --color-core-pink-900: #931847; + --color-core-pink-1000: #561231; + --color-core-pink-1100: #2b1721; + --color-core-red-0: #ffeae9; + --color-core-red-100: #ffd5d2; + --color-core-red-200: #ffb8b1; + --color-core-red-300: #ff9c8f; + --color-core-red-400: #ff7f6e; + --color-core-red-500: #f76054; + --color-core-red-600: #ed4c42; + --color-core-red-700: #db3e3e; + --color-core-red-800: #c63434; + --color-core-red-900: #992222; + --color-core-red-1000: #6d1313; + --color-core-red-1100: #2b1111; + --color-core-orange-0: #ffede3; + --color-core-orange-100: #fcdccc; + --color-core-orange-200: #ffc6a4; + --color-core-orange-300: #ffb180; + --color-core-orange-400: #ff9c5d; + --color-core-orange-500: #fc8943; + --color-core-orange-600: #f57d33; + --color-core-orange-700: #ed7024; + --color-core-orange-800: #ce5511; + --color-core-orange-900: #962c0b; + --color-core-orange-1000: #601700; + --color-core-orange-1100: #2d130e; + --color-core-neutral-0: #ffffff; + --color-core-neutral-100: #f3f4f4; + --color-core-neutral-200: #dee1e1; + --color-core-neutral-300: #c8cccc; + --color-core-neutral-400: #b0b6b7; + --color-core-neutral-500: #929a9b; + --color-core-neutral-600: #6e797a; + --color-core-neutral-700: #515e5f; + --color-core-neutral-800: #364141; + --color-core-neutral-900: #273333; + --color-core-neutral-1000: #162020; + --color-core-neutral-1100: #040404; + --color-core-yellow-0: #fff8e2; + --color-core-yellow-100: #fdefcd; + --color-core-yellow-200: #ffe99a; + --color-core-yellow-300: #ffe16e; + --color-core-yellow-400: #ffd943; + --color-core-yellow-500: #ffcd1c; + --color-core-yellow-600: #ffbc00; + --color-core-yellow-700: #dd9903; + --color-core-yellow-800: #ba7506; + --color-core-yellow-900: #944c0c; + --color-core-yellow-1000: #542a00; + --color-core-yellow-1100: #2d1a05; + --size-border-radius-large: 30rem; + --size-font-small: 0.75rem; + --size-font-medium: 1rem; + --size-font-large: 1.5rem; + --size-font-xl: 2.25rem; + --size-padding-small: 0.5rem; + --size-padding-medium: 1rem; + --size-padding-large: 1rem; + --size-padding-xl: 1rem; + --color-font-success: #08422f; + --color-font-warning: #601700; + --color-font-danger: #6d1313; --color-font-tertiary: #364141; - --color-font-interactive: #0b8599; - --color-font-interactive-hover: #0b8599; - --color-font-interactive-active: #6f5ed3; + --color-font-secondary: #273333; + --color-font-primary: #040404; + --color-brand-secondary: #6f5ed3; + --color-brand-primary: #0b8599; + --color-border-primary: #c8cccc; + --color-background-info: #e9f8ff; + --color-background-success: #ebf9eb; + --color-background-warning: #ffede3; + --color-background-danger: #ffeae9; + --color-background-tertiary: #dee1e1; + --color-background-secondary: #f3f4f4; + --color-background-primary: #ffffff; --color-font-interactive-disabled: #364141; - --color-font-danger: #6d1313; - --color-font-warning: #601700; - --color-font-success: #08422f; + --color-font-interactive-active: #6f5ed3; + --color-font-interactive-hover: #0b8599; + --color-font-interactive: #0b8599; + --color-background-disabled: #dee1e1; } " `; diff --git a/__integration__/__snapshots__/scss.test.js.snap b/__integration__/__snapshots__/scss.test.js.snap index fe7248e4c..7081b71ad 100644 --- a/__integration__/__snapshots__/scss.test.js.snap +++ b/__integration__/__snapshots__/scss.test.js.snap @@ -7,168 +7,168 @@ exports[`integration scss scss/map-deep should match snapshot 1`] = ` Generated on Sat, 01 Jan 2000 00:00:00 GMT */ -$size-padding-xl: 1rem !default; -$size-padding-large: 1rem !default; -$size-padding-medium: 1rem !default; -$size-padding-small: 0.5rem !default; -$size-font-xl: 2.25rem !default; -$size-font-large: 1.5rem !default; -$size-font-medium: 1rem !default; -$size-font-small: 0.75rem !default; -$size-border-radius-large: 30rem !default; -$color-core-yellow-1100: #2d1a05 !default; -$color-core-yellow-1000: #542a00 !default; -$color-core-yellow-900: #944c0c !default; -$color-core-yellow-800: #ba7506 !default; -$color-core-yellow-700: #dd9903 !default; -$color-core-yellow-600: #ffbc00 !default; -$color-core-yellow-500: #ffcd1c !default; -$color-core-yellow-400: #ffd943 !default; -$color-core-yellow-300: #ffe16e !default; -$color-core-yellow-200: #ffe99a !default; -$color-core-yellow-100: #fdefcd !default; -$color-core-yellow-0: #fff8e2 !default; -$color-core-neutral-1100: #040404 !default; -$color-core-neutral-1000: #162020 !default; -$color-core-neutral-900: #273333 !default; -$color-core-neutral-800: #364141 !default; -$color-core-neutral-700: #515e5f !default; -$color-core-neutral-600: #6e797a !default; -$color-core-neutral-500: #929a9b !default; -$color-core-neutral-400: #b0b6b7 !default; -$color-core-neutral-300: #c8cccc !default; -$color-core-neutral-200: #dee1e1 !default; -$color-core-neutral-100: #f3f4f4 !default; -$color-core-neutral-0: #ffffff !default; -$color-core-orange-1100: #2d130e !default; -$color-core-orange-1000: #601700 !default; -$color-core-orange-900: #962c0b !default; -$color-core-orange-800: #ce5511 !default; -$color-core-orange-700: #ed7024 !default; -$color-core-orange-600: #f57d33 !default; -$color-core-orange-500: #fc8943 !default; -$color-core-orange-400: #ff9c5d !default; -$color-core-orange-300: #ffb180 !default; -$color-core-orange-200: #ffc6a4 !default; -$color-core-orange-100: #fcdccc !default; -$color-core-orange-0: #ffede3 !default; -$color-core-red-1100: #2b1111 !default; -$color-core-red-1000: #6d1313 !default; -$color-core-red-900: #992222 !default; -$color-core-red-800: #c63434 !default; -$color-core-red-700: #db3e3e !default; -$color-core-red-600: #ed4c42 !default; -$color-core-red-500: #f76054 !default; -$color-core-red-400: #ff7f6e !default; -$color-core-red-300: #ff9c8f !default; -$color-core-red-200: #ffb8b1 !default; -$color-core-red-100: #ffd5d2 !default; -$color-core-red-0: #ffeae9 !default; -$color-core-pink-1100: #2b1721 !default; -$color-core-pink-1000: #561231 !default; -$color-core-pink-900: #931847 !default; -$color-core-pink-800: #b22f5b !default; -$color-core-pink-700: #ce3665 !default; -$color-core-pink-600: #e0447c !default; -$color-core-pink-500: #ef588b !default; -$color-core-pink-400: #ff76ae !default; -$color-core-pink-300: #ff95c1 !default; -$color-core-pink-200: #ffb5d5 !default; -$color-core-pink-100: #fcdbeb !default; -$color-core-pink-0: #ffe9f3 !default; -$color-core-magenta-1100: #29192d !default; -$color-core-magenta-1000: #451551 !default; -$color-core-magenta-900: #6c2277 !default; -$color-core-magenta-800: #8f3896 !default; -$color-core-magenta-700: #ac44a8 !default; -$color-core-magenta-600: #c44eb9 !default; -$color-core-magenta-500: #db61db !default; -$color-core-magenta-400: #f282f5 !default; -$color-core-magenta-300: #edadf2 !default; -$color-core-magenta-200: #f4c4f7 !default; -$color-core-magenta-100: #f9e3fc !default; -$color-core-magenta-0: #fef0ff !default; -$color-core-purple-1100: #1d1d38 !default; -$color-core-purple-1000: #2d246b !default; -$color-core-purple-900: #483a9c !default; -$color-core-purple-800: #5e4eba !default; -$color-core-purple-700: #6f5ed3 !default; -$color-core-purple-600: #816fea !default; -$color-core-purple-500: #9180f4 !default; -$color-core-purple-400: #a193f2 !default; -$color-core-purple-300: #c1c1f7 !default; -$color-core-purple-200: #d8d7f9 !default; -$color-core-purple-100: #eaeaf9 !default; -$color-core-purple-0: #f2f2f9 !default; -$color-core-blue-1100: #002138 !default; -$color-core-blue-1000: #0a3960 !default; -$color-core-blue-900: #0c5689 !default; -$color-core-blue-800: #116daa !default; -$color-core-blue-700: #2079c3 !default; -$color-core-blue-600: #2b87d3 !default; -$color-core-blue-500: #3896e3 !default; -$color-core-blue-400: #56adf5 !default; -$color-core-blue-300: #a1d2f8 !default; -$color-core-blue-200: #c7e4f9 !default; -$color-core-blue-100: #dcf2ff !default; -$color-core-blue-0: #e9f8ff !default; -$color-core-aqua-1100: #002838 !default; -$color-core-aqua-1000: #083d4f !default; -$color-core-aqua-900: #035e73 !default; -$color-core-aqua-800: #0f6e84 !default; -$color-core-aqua-700: #0b8599 !default; -$color-core-aqua-600: #0797ae !default; -$color-core-aqua-500: #17b8ce !default; -$color-core-aqua-400: #33d6e2 !default; -$color-core-aqua-300: #76e5e2 !default; -$color-core-aqua-200: #a5f2f2 !default; -$color-core-aqua-100: #c5f9f9 !default; -$color-core-aqua-0: #d9fcfb !default; -$color-core-teal-1100: #002528 !default; -$color-core-teal-1000: #083f3f !default; -$color-core-teal-900: #026661 !default; -$color-core-teal-800: #067c7c !default; -$color-core-teal-700: #0b968f !default; -$color-core-teal-600: #00a99c !default; -$color-core-teal-500: #08c4b2 !default; -$color-core-teal-400: #24e0c5 !default; -$color-core-teal-300: #7dead5 !default; -$color-core-teal-200: #b3f2e6 !default; -$color-core-teal-100: #cdf7ef !default; -$color-core-teal-0: #e5f9f5 !default; -$color-core-green-1100: #002b20 !default; -$color-core-green-1000: #08422f !default; -$color-core-green-900: #006b40 !default; -$color-core-green-800: #008b46 !default; -$color-core-green-700: #0ca750 !default; -$color-core-green-600: #2bb656 !default; -$color-core-green-500: #59cb59 !default; -$color-core-green-400: #75dd66 !default; -$color-core-green-300: #98e58e !default; -$color-core-green-200: #c2f2bd !default; -$color-core-green-100: #d7f4d7 !default; $color-core-green-0: #ebf9eb !default; -$color-background-primary: #ffffff !default; -$color-background-secondary: #f3f4f4 !default; -$color-background-tertiary: #dee1e1 !default; -$color-background-danger: #ffeae9 !default; -$color-background-warning: #ffede3 !default; -$color-background-success: #ebf9eb !default; -$color-background-info: #e9f8ff !default; -$color-background-disabled: #dee1e1 !default; -$color-border-primary: #c8cccc !default; -$color-brand-primary: #0b8599 !default; -$color-brand-secondary: #6f5ed3 !default; -$color-font-primary: #040404 !default; -$color-font-secondary: #273333 !default; +$color-core-green-100: #d7f4d7 !default; +$color-core-green-200: #c2f2bd !default; +$color-core-green-300: #98e58e !default; +$color-core-green-400: #75dd66 !default; +$color-core-green-500: #59cb59 !default; +$color-core-green-600: #2bb656 !default; +$color-core-green-700: #0ca750 !default; +$color-core-green-800: #008b46 !default; +$color-core-green-900: #006b40 !default; +$color-core-green-1000: #08422f !default; +$color-core-green-1100: #002b20 !default; +$color-core-teal-0: #e5f9f5 !default; +$color-core-teal-100: #cdf7ef !default; +$color-core-teal-200: #b3f2e6 !default; +$color-core-teal-300: #7dead5 !default; +$color-core-teal-400: #24e0c5 !default; +$color-core-teal-500: #08c4b2 !default; +$color-core-teal-600: #00a99c !default; +$color-core-teal-700: #0b968f !default; +$color-core-teal-800: #067c7c !default; +$color-core-teal-900: #026661 !default; +$color-core-teal-1000: #083f3f !default; +$color-core-teal-1100: #002528 !default; +$color-core-aqua-0: #d9fcfb !default; +$color-core-aqua-100: #c5f9f9 !default; +$color-core-aqua-200: #a5f2f2 !default; +$color-core-aqua-300: #76e5e2 !default; +$color-core-aqua-400: #33d6e2 !default; +$color-core-aqua-500: #17b8ce !default; +$color-core-aqua-600: #0797ae !default; +$color-core-aqua-700: #0b8599 !default; +$color-core-aqua-800: #0f6e84 !default; +$color-core-aqua-900: #035e73 !default; +$color-core-aqua-1000: #083d4f !default; +$color-core-aqua-1100: #002838 !default; +$color-core-blue-0: #e9f8ff !default; +$color-core-blue-100: #dcf2ff !default; +$color-core-blue-200: #c7e4f9 !default; +$color-core-blue-300: #a1d2f8 !default; +$color-core-blue-400: #56adf5 !default; +$color-core-blue-500: #3896e3 !default; +$color-core-blue-600: #2b87d3 !default; +$color-core-blue-700: #2079c3 !default; +$color-core-blue-800: #116daa !default; +$color-core-blue-900: #0c5689 !default; +$color-core-blue-1000: #0a3960 !default; +$color-core-blue-1100: #002138 !default; +$color-core-purple-0: #f2f2f9 !default; +$color-core-purple-100: #eaeaf9 !default; +$color-core-purple-200: #d8d7f9 !default; +$color-core-purple-300: #c1c1f7 !default; +$color-core-purple-400: #a193f2 !default; +$color-core-purple-500: #9180f4 !default; +$color-core-purple-600: #816fea !default; +$color-core-purple-700: #6f5ed3 !default; +$color-core-purple-800: #5e4eba !default; +$color-core-purple-900: #483a9c !default; +$color-core-purple-1000: #2d246b !default; +$color-core-purple-1100: #1d1d38 !default; +$color-core-magenta-0: #fef0ff !default; +$color-core-magenta-100: #f9e3fc !default; +$color-core-magenta-200: #f4c4f7 !default; +$color-core-magenta-300: #edadf2 !default; +$color-core-magenta-400: #f282f5 !default; +$color-core-magenta-500: #db61db !default; +$color-core-magenta-600: #c44eb9 !default; +$color-core-magenta-700: #ac44a8 !default; +$color-core-magenta-800: #8f3896 !default; +$color-core-magenta-900: #6c2277 !default; +$color-core-magenta-1000: #451551 !default; +$color-core-magenta-1100: #29192d !default; +$color-core-pink-0: #ffe9f3 !default; +$color-core-pink-100: #fcdbeb !default; +$color-core-pink-200: #ffb5d5 !default; +$color-core-pink-300: #ff95c1 !default; +$color-core-pink-400: #ff76ae !default; +$color-core-pink-500: #ef588b !default; +$color-core-pink-600: #e0447c !default; +$color-core-pink-700: #ce3665 !default; +$color-core-pink-800: #b22f5b !default; +$color-core-pink-900: #931847 !default; +$color-core-pink-1000: #561231 !default; +$color-core-pink-1100: #2b1721 !default; +$color-core-red-0: #ffeae9 !default; +$color-core-red-100: #ffd5d2 !default; +$color-core-red-200: #ffb8b1 !default; +$color-core-red-300: #ff9c8f !default; +$color-core-red-400: #ff7f6e !default; +$color-core-red-500: #f76054 !default; +$color-core-red-600: #ed4c42 !default; +$color-core-red-700: #db3e3e !default; +$color-core-red-800: #c63434 !default; +$color-core-red-900: #992222 !default; +$color-core-red-1000: #6d1313 !default; +$color-core-red-1100: #2b1111 !default; +$color-core-orange-0: #ffede3 !default; +$color-core-orange-100: #fcdccc !default; +$color-core-orange-200: #ffc6a4 !default; +$color-core-orange-300: #ffb180 !default; +$color-core-orange-400: #ff9c5d !default; +$color-core-orange-500: #fc8943 !default; +$color-core-orange-600: #f57d33 !default; +$color-core-orange-700: #ed7024 !default; +$color-core-orange-800: #ce5511 !default; +$color-core-orange-900: #962c0b !default; +$color-core-orange-1000: #601700 !default; +$color-core-orange-1100: #2d130e !default; +$color-core-neutral-0: #ffffff !default; +$color-core-neutral-100: #f3f4f4 !default; +$color-core-neutral-200: #dee1e1 !default; +$color-core-neutral-300: #c8cccc !default; +$color-core-neutral-400: #b0b6b7 !default; +$color-core-neutral-500: #929a9b !default; +$color-core-neutral-600: #6e797a !default; +$color-core-neutral-700: #515e5f !default; +$color-core-neutral-800: #364141 !default; +$color-core-neutral-900: #273333 !default; +$color-core-neutral-1000: #162020 !default; +$color-core-neutral-1100: #040404 !default; +$color-core-yellow-0: #fff8e2 !default; +$color-core-yellow-100: #fdefcd !default; +$color-core-yellow-200: #ffe99a !default; +$color-core-yellow-300: #ffe16e !default; +$color-core-yellow-400: #ffd943 !default; +$color-core-yellow-500: #ffcd1c !default; +$color-core-yellow-600: #ffbc00 !default; +$color-core-yellow-700: #dd9903 !default; +$color-core-yellow-800: #ba7506 !default; +$color-core-yellow-900: #944c0c !default; +$color-core-yellow-1000: #542a00 !default; +$color-core-yellow-1100: #2d1a05 !default; +$size-border-radius-large: 30rem !default; +$size-font-small: 0.75rem !default; +$size-font-medium: 1rem !default; +$size-font-large: 1.5rem !default; +$size-font-xl: 2.25rem !default; +$size-padding-small: 0.5rem !default; +$size-padding-medium: 1rem !default; +$size-padding-large: 1rem !default; +$size-padding-xl: 1rem !default; +$color-font-success: #08422f !default; +$color-font-warning: #601700 !default; +$color-font-danger: #6d1313 !default; $color-font-tertiary: #364141 !default; -$color-font-interactive: #0b8599 !default; -$color-font-interactive-hover: #0b8599 !default; -$color-font-interactive-active: #6f5ed3 !default; +$color-font-secondary: #273333 !default; +$color-font-primary: #040404 !default; +$color-brand-secondary: #6f5ed3 !default; +$color-brand-primary: #0b8599 !default; +$color-border-primary: #c8cccc !default; +$color-background-info: #e9f8ff !default; +$color-background-success: #ebf9eb !default; +$color-background-warning: #ffede3 !default; +$color-background-danger: #ffeae9 !default; +$color-background-tertiary: #dee1e1 !default; +$color-background-secondary: #f3f4f4 !default; +$color-background-primary: #ffffff !default; $color-font-interactive-disabled: #364141 !default; -$color-font-danger: #6d1313 !default; -$color-font-warning: #601700 !default; -$color-font-success: #08422f !default; +$color-font-interactive-active: #6f5ed3 !default; +$color-font-interactive-hover: #0b8599 !default; +$color-font-interactive: #0b8599 !default; +$color-background-disabled: #dee1e1 !default; $tokens: ( 'color': ( @@ -397,188 +397,361 @@ exports[`integration scss scss/map-flat should match snapshot 1`] = ` */ $tokens: ( - 'size-padding-xl': 1rem, - 'size-padding-large': 1rem, - 'size-padding-medium': 1rem, - 'size-padding-small': 0.5rem, - 'size-font-xl': 2.25rem, - 'size-font-large': 1.5rem, - 'size-font-medium': 1rem, - 'size-font-small': 0.75rem, - 'size-border-radius-large': 30rem, - 'color-core-yellow-1100': #2d1a05, - 'color-core-yellow-1000': #542a00, - 'color-core-yellow-900': #944c0c, - 'color-core-yellow-800': #ba7506, - 'color-core-yellow-700': #dd9903, - 'color-core-yellow-600': #ffbc00, - 'color-core-yellow-500': #ffcd1c, - 'color-core-yellow-400': #ffd943, - 'color-core-yellow-300': #ffe16e, - 'color-core-yellow-200': #ffe99a, - 'color-core-yellow-100': #fdefcd, - 'color-core-yellow-0': #fff8e2, - 'color-core-neutral-1100': #040404, - 'color-core-neutral-1000': #162020, - 'color-core-neutral-900': #273333, - 'color-core-neutral-800': #364141, - 'color-core-neutral-700': #515e5f, - 'color-core-neutral-600': #6e797a, - 'color-core-neutral-500': #929a9b, - 'color-core-neutral-400': #b0b6b7, - 'color-core-neutral-300': #c8cccc, - 'color-core-neutral-200': #dee1e1, - 'color-core-neutral-100': #f3f4f4, - 'color-core-neutral-0': #ffffff, - 'color-core-orange-1100': #2d130e, - 'color-core-orange-1000': #601700, - 'color-core-orange-900': #962c0b, - 'color-core-orange-800': #ce5511, - 'color-core-orange-700': #ed7024, - 'color-core-orange-600': #f57d33, - 'color-core-orange-500': #fc8943, - 'color-core-orange-400': #ff9c5d, - 'color-core-orange-300': #ffb180, - 'color-core-orange-200': #ffc6a4, - 'color-core-orange-100': #fcdccc, - 'color-core-orange-0': #ffede3, - 'color-core-red-1100': #2b1111, - 'color-core-red-1000': #6d1313, - 'color-core-red-900': #992222, - 'color-core-red-800': #c63434, - 'color-core-red-700': #db3e3e, - 'color-core-red-600': #ed4c42, - 'color-core-red-500': #f76054, - 'color-core-red-400': #ff7f6e, - 'color-core-red-300': #ff9c8f, - 'color-core-red-200': #ffb8b1, - 'color-core-red-100': #ffd5d2, - 'color-core-red-0': #ffeae9, - 'color-core-pink-1100': #2b1721, - 'color-core-pink-1000': #561231, - 'color-core-pink-900': #931847, - 'color-core-pink-800': #b22f5b, - 'color-core-pink-700': #ce3665, - 'color-core-pink-600': #e0447c, - 'color-core-pink-500': #ef588b, - 'color-core-pink-400': #ff76ae, - 'color-core-pink-300': #ff95c1, - 'color-core-pink-200': #ffb5d5, - 'color-core-pink-100': #fcdbeb, - 'color-core-pink-0': #ffe9f3, - 'color-core-magenta-1100': #29192d, - 'color-core-magenta-1000': #451551, - 'color-core-magenta-900': #6c2277, - 'color-core-magenta-800': #8f3896, - 'color-core-magenta-700': #ac44a8, - 'color-core-magenta-600': #c44eb9, - 'color-core-magenta-500': #db61db, - 'color-core-magenta-400': #f282f5, - 'color-core-magenta-300': #edadf2, - 'color-core-magenta-200': #f4c4f7, - 'color-core-magenta-100': #f9e3fc, - 'color-core-magenta-0': #fef0ff, - 'color-core-purple-1100': #1d1d38, - 'color-core-purple-1000': #2d246b, - 'color-core-purple-900': #483a9c, - 'color-core-purple-800': #5e4eba, - 'color-core-purple-700': #6f5ed3, - 'color-core-purple-600': #816fea, - 'color-core-purple-500': #9180f4, - 'color-core-purple-400': #a193f2, - 'color-core-purple-300': #c1c1f7, - 'color-core-purple-200': #d8d7f9, - 'color-core-purple-100': #eaeaf9, - 'color-core-purple-0': #f2f2f9, - 'color-core-blue-1100': #002138, - 'color-core-blue-1000': #0a3960, - 'color-core-blue-900': #0c5689, - 'color-core-blue-800': #116daa, - 'color-core-blue-700': #2079c3, - 'color-core-blue-600': #2b87d3, - 'color-core-blue-500': #3896e3, - 'color-core-blue-400': #56adf5, - 'color-core-blue-300': #a1d2f8, - 'color-core-blue-200': #c7e4f9, - 'color-core-blue-100': #dcf2ff, - 'color-core-blue-0': #e9f8ff, - 'color-core-aqua-1100': #002838, - 'color-core-aqua-1000': #083d4f, - 'color-core-aqua-900': #035e73, - 'color-core-aqua-800': #0f6e84, - 'color-core-aqua-700': #0b8599, - 'color-core-aqua-600': #0797ae, - 'color-core-aqua-500': #17b8ce, - 'color-core-aqua-400': #33d6e2, - 'color-core-aqua-300': #76e5e2, - 'color-core-aqua-200': #a5f2f2, - 'color-core-aqua-100': #c5f9f9, - 'color-core-aqua-0': #d9fcfb, - 'color-core-teal-1100': #002528, - 'color-core-teal-1000': #083f3f, - 'color-core-teal-900': #026661, - 'color-core-teal-800': #067c7c, - 'color-core-teal-700': #0b968f, - 'color-core-teal-600': #00a99c, - 'color-core-teal-500': #08c4b2, - 'color-core-teal-400': #24e0c5, - 'color-core-teal-300': #7dead5, - 'color-core-teal-200': #b3f2e6, - 'color-core-teal-100': #cdf7ef, - 'color-core-teal-0': #e5f9f5, - 'color-core-green-1100': #002b20, - 'color-core-green-1000': #08422f, - 'color-core-green-900': #006b40, - 'color-core-green-800': #008b46, - 'color-core-green-700': #0ca750, - 'color-core-green-600': #2bb656, - 'color-core-green-500': #59cb59, - 'color-core-green-400': #75dd66, - 'color-core-green-300': #98e58e, - 'color-core-green-200': #c2f2bd, - 'color-core-green-100': #d7f4d7, 'color-core-green-0': #ebf9eb, - 'color-background-primary': #ffffff, - 'color-background-secondary': #f3f4f4, - 'color-background-tertiary': #dee1e1, - 'color-background-danger': #ffeae9, - 'color-background-warning': #ffede3, - 'color-background-success': #ebf9eb, - 'color-background-info': #e9f8ff, - 'color-background-disabled': #dee1e1, - 'color-border-primary': #c8cccc, - 'color-brand-primary': #0b8599, - 'color-brand-secondary': #6f5ed3, - 'color-font-primary': #040404, - 'color-font-secondary': #273333, + 'color-core-green-100': #d7f4d7, + 'color-core-green-200': #c2f2bd, + 'color-core-green-300': #98e58e, + 'color-core-green-400': #75dd66, + 'color-core-green-500': #59cb59, + 'color-core-green-600': #2bb656, + 'color-core-green-700': #0ca750, + 'color-core-green-800': #008b46, + 'color-core-green-900': #006b40, + 'color-core-green-1000': #08422f, + 'color-core-green-1100': #002b20, + 'color-core-teal-0': #e5f9f5, + 'color-core-teal-100': #cdf7ef, + 'color-core-teal-200': #b3f2e6, + 'color-core-teal-300': #7dead5, + 'color-core-teal-400': #24e0c5, + 'color-core-teal-500': #08c4b2, + 'color-core-teal-600': #00a99c, + 'color-core-teal-700': #0b968f, + 'color-core-teal-800': #067c7c, + 'color-core-teal-900': #026661, + 'color-core-teal-1000': #083f3f, + 'color-core-teal-1100': #002528, + 'color-core-aqua-0': #d9fcfb, + 'color-core-aqua-100': #c5f9f9, + 'color-core-aqua-200': #a5f2f2, + 'color-core-aqua-300': #76e5e2, + 'color-core-aqua-400': #33d6e2, + 'color-core-aqua-500': #17b8ce, + 'color-core-aqua-600': #0797ae, + 'color-core-aqua-700': #0b8599, + 'color-core-aqua-800': #0f6e84, + 'color-core-aqua-900': #035e73, + 'color-core-aqua-1000': #083d4f, + 'color-core-aqua-1100': #002838, + 'color-core-blue-0': #e9f8ff, + 'color-core-blue-100': #dcf2ff, + 'color-core-blue-200': #c7e4f9, + 'color-core-blue-300': #a1d2f8, + 'color-core-blue-400': #56adf5, + 'color-core-blue-500': #3896e3, + 'color-core-blue-600': #2b87d3, + 'color-core-blue-700': #2079c3, + 'color-core-blue-800': #116daa, + 'color-core-blue-900': #0c5689, + 'color-core-blue-1000': #0a3960, + 'color-core-blue-1100': #002138, + 'color-core-purple-0': #f2f2f9, + 'color-core-purple-100': #eaeaf9, + 'color-core-purple-200': #d8d7f9, + 'color-core-purple-300': #c1c1f7, + 'color-core-purple-400': #a193f2, + 'color-core-purple-500': #9180f4, + 'color-core-purple-600': #816fea, + 'color-core-purple-700': #6f5ed3, + 'color-core-purple-800': #5e4eba, + 'color-core-purple-900': #483a9c, + 'color-core-purple-1000': #2d246b, + 'color-core-purple-1100': #1d1d38, + 'color-core-magenta-0': #fef0ff, + 'color-core-magenta-100': #f9e3fc, + 'color-core-magenta-200': #f4c4f7, + 'color-core-magenta-300': #edadf2, + 'color-core-magenta-400': #f282f5, + 'color-core-magenta-500': #db61db, + 'color-core-magenta-600': #c44eb9, + 'color-core-magenta-700': #ac44a8, + 'color-core-magenta-800': #8f3896, + 'color-core-magenta-900': #6c2277, + 'color-core-magenta-1000': #451551, + 'color-core-magenta-1100': #29192d, + 'color-core-pink-0': #ffe9f3, + 'color-core-pink-100': #fcdbeb, + 'color-core-pink-200': #ffb5d5, + 'color-core-pink-300': #ff95c1, + 'color-core-pink-400': #ff76ae, + 'color-core-pink-500': #ef588b, + 'color-core-pink-600': #e0447c, + 'color-core-pink-700': #ce3665, + 'color-core-pink-800': #b22f5b, + 'color-core-pink-900': #931847, + 'color-core-pink-1000': #561231, + 'color-core-pink-1100': #2b1721, + 'color-core-red-0': #ffeae9, + 'color-core-red-100': #ffd5d2, + 'color-core-red-200': #ffb8b1, + 'color-core-red-300': #ff9c8f, + 'color-core-red-400': #ff7f6e, + 'color-core-red-500': #f76054, + 'color-core-red-600': #ed4c42, + 'color-core-red-700': #db3e3e, + 'color-core-red-800': #c63434, + 'color-core-red-900': #992222, + 'color-core-red-1000': #6d1313, + 'color-core-red-1100': #2b1111, + 'color-core-orange-0': #ffede3, + 'color-core-orange-100': #fcdccc, + 'color-core-orange-200': #ffc6a4, + 'color-core-orange-300': #ffb180, + 'color-core-orange-400': #ff9c5d, + 'color-core-orange-500': #fc8943, + 'color-core-orange-600': #f57d33, + 'color-core-orange-700': #ed7024, + 'color-core-orange-800': #ce5511, + 'color-core-orange-900': #962c0b, + 'color-core-orange-1000': #601700, + 'color-core-orange-1100': #2d130e, + 'color-core-neutral-0': #ffffff, + 'color-core-neutral-100': #f3f4f4, + 'color-core-neutral-200': #dee1e1, + 'color-core-neutral-300': #c8cccc, + 'color-core-neutral-400': #b0b6b7, + 'color-core-neutral-500': #929a9b, + 'color-core-neutral-600': #6e797a, + 'color-core-neutral-700': #515e5f, + 'color-core-neutral-800': #364141, + 'color-core-neutral-900': #273333, + 'color-core-neutral-1000': #162020, + 'color-core-neutral-1100': #040404, + 'color-core-yellow-0': #fff8e2, + 'color-core-yellow-100': #fdefcd, + 'color-core-yellow-200': #ffe99a, + 'color-core-yellow-300': #ffe16e, + 'color-core-yellow-400': #ffd943, + 'color-core-yellow-500': #ffcd1c, + 'color-core-yellow-600': #ffbc00, + 'color-core-yellow-700': #dd9903, + 'color-core-yellow-800': #ba7506, + 'color-core-yellow-900': #944c0c, + 'color-core-yellow-1000': #542a00, + 'color-core-yellow-1100': #2d1a05, + 'size-border-radius-large': 30rem, + 'size-font-small': 0.75rem, + 'size-font-medium': 1rem, + 'size-font-large': 1.5rem, + 'size-font-xl': 2.25rem, + 'size-padding-small': 0.5rem, + 'size-padding-medium': 1rem, + 'size-padding-large': 1rem, + 'size-padding-xl': 1rem, + 'color-font-success': #08422f, + 'color-font-warning': #601700, + 'color-font-danger': #6d1313, 'color-font-tertiary': #364141, - 'color-font-interactive': #0b8599, - 'color-font-interactive-hover': #0b8599, - 'color-font-interactive-active': #6f5ed3, + 'color-font-secondary': #273333, + 'color-font-primary': #040404, + 'color-brand-secondary': #6f5ed3, + 'color-brand-primary': #0b8599, + 'color-border-primary': #c8cccc, + 'color-background-info': #e9f8ff, + 'color-background-success': #ebf9eb, + 'color-background-warning': #ffede3, + 'color-background-danger': #ffeae9, + 'color-background-tertiary': #dee1e1, + 'color-background-secondary': #f3f4f4, + 'color-background-primary': #ffffff, 'color-font-interactive-disabled': #364141, - 'color-font-danger': #6d1313, - 'color-font-warning': #601700, - 'color-font-success': #08422f + 'color-font-interactive-active': #6f5ed3, + 'color-font-interactive-hover': #0b8599, + 'color-font-interactive': #0b8599, + 'color-background-disabled': #dee1e1 ); " `; -exports[`integration scss scss/variables should match snapshot 1`] = ` +exports[`integration scss scss/variables should match snapshot 1`] = ` +" +// Do not edit directly +// Generated on Sat, 01 Jan 2000 00:00:00 GMT + +$color-background-primary: #ffffff !default; +$color-background-secondary: #f3f4f4; +$color-background-tertiary: #dee1e1; +$color-background-danger: #ffeae9; +$color-background-warning: #ffede3; +$color-background-success: #ebf9eb; +$color-background-info: #e9f8ff; +$color-background-disabled: #dee1e1; +$color-border-primary: #c8cccc; +$color-brand-primary: #0b8599; +$color-brand-secondary: #6f5ed3; +$color-core-green-0: #ebf9eb; +$color-core-green-100: #d7f4d7; +$color-core-green-200: #c2f2bd; +$color-core-green-300: #98e58e; +$color-core-green-400: #75dd66; +$color-core-green-500: #59cb59; +$color-core-green-600: #2bb656; +$color-core-green-700: #0ca750; +$color-core-green-800: #008b46; +$color-core-green-900: #006b40; +$color-core-green-1000: #08422f; +$color-core-green-1100: #002b20; +$color-core-teal-0: #e5f9f5; +$color-core-teal-100: #cdf7ef; +$color-core-teal-200: #b3f2e6; +$color-core-teal-300: #7dead5; +$color-core-teal-400: #24e0c5; +$color-core-teal-500: #08c4b2; +$color-core-teal-600: #00a99c; +$color-core-teal-700: #0b968f; +$color-core-teal-800: #067c7c; +$color-core-teal-900: #026661; +$color-core-teal-1000: #083f3f; +$color-core-teal-1100: #002528; +$color-core-aqua-0: #d9fcfb; +$color-core-aqua-100: #c5f9f9; +$color-core-aqua-200: #a5f2f2; +$color-core-aqua-300: #76e5e2; +$color-core-aqua-400: #33d6e2; +$color-core-aqua-500: #17b8ce; +$color-core-aqua-600: #0797ae; +$color-core-aqua-700: #0b8599; +$color-core-aqua-800: #0f6e84; +$color-core-aqua-900: #035e73; +$color-core-aqua-1000: #083d4f; +$color-core-aqua-1100: #002838; +$color-core-blue-0: #e9f8ff; +$color-core-blue-100: #dcf2ff; +$color-core-blue-200: #c7e4f9; +$color-core-blue-300: #a1d2f8; +$color-core-blue-400: #56adf5; +$color-core-blue-500: #3896e3; +$color-core-blue-600: #2b87d3; +$color-core-blue-700: #2079c3; +$color-core-blue-800: #116daa; +$color-core-blue-900: #0c5689; +$color-core-blue-1000: #0a3960; +$color-core-blue-1100: #002138; +$color-core-purple-0: #f2f2f9; +$color-core-purple-100: #eaeaf9; +$color-core-purple-200: #d8d7f9; +$color-core-purple-300: #c1c1f7; +$color-core-purple-400: #a193f2; +$color-core-purple-500: #9180f4; +$color-core-purple-600: #816fea; +$color-core-purple-700: #6f5ed3; +$color-core-purple-800: #5e4eba; +$color-core-purple-900: #483a9c; +$color-core-purple-1000: #2d246b; +$color-core-purple-1100: #1d1d38; +$color-core-magenta-0: #fef0ff; +$color-core-magenta-100: #f9e3fc; +$color-core-magenta-200: #f4c4f7; +$color-core-magenta-300: #edadf2; +$color-core-magenta-400: #f282f5; +$color-core-magenta-500: #db61db; +$color-core-magenta-600: #c44eb9; +$color-core-magenta-700: #ac44a8; +$color-core-magenta-800: #8f3896; +$color-core-magenta-900: #6c2277; +$color-core-magenta-1000: #451551; +$color-core-magenta-1100: #29192d; +$color-core-pink-0: #ffe9f3; +$color-core-pink-100: #fcdbeb; +$color-core-pink-200: #ffb5d5; +$color-core-pink-300: #ff95c1; +$color-core-pink-400: #ff76ae; +$color-core-pink-500: #ef588b; +$color-core-pink-600: #e0447c; +$color-core-pink-700: #ce3665; +$color-core-pink-800: #b22f5b; +$color-core-pink-900: #931847; +$color-core-pink-1000: #561231; +$color-core-pink-1100: #2b1721; +$color-core-red-0: #ffeae9; +$color-core-red-100: #ffd5d2; +$color-core-red-200: #ffb8b1; +$color-core-red-300: #ff9c8f; +$color-core-red-400: #ff7f6e; +$color-core-red-500: #f76054; +$color-core-red-600: #ed4c42; +$color-core-red-700: #db3e3e; +$color-core-red-800: #c63434; +$color-core-red-900: #992222; +$color-core-red-1000: #6d1313; +$color-core-red-1100: #2b1111; +$color-core-orange-0: #ffede3; +$color-core-orange-100: #fcdccc; +$color-core-orange-200: #ffc6a4; +$color-core-orange-300: #ffb180; +$color-core-orange-400: #ff9c5d; +$color-core-orange-500: #fc8943; +$color-core-orange-600: #f57d33; +$color-core-orange-700: #ed7024; +$color-core-orange-800: #ce5511; +$color-core-orange-900: #962c0b; +$color-core-orange-1000: #601700; +$color-core-orange-1100: #2d130e; +$color-core-neutral-0: #ffffff; +$color-core-neutral-100: #f3f4f4; +$color-core-neutral-200: #dee1e1; +$color-core-neutral-300: #c8cccc; +$color-core-neutral-400: #b0b6b7; +$color-core-neutral-500: #929a9b; +$color-core-neutral-600: #6e797a; +$color-core-neutral-700: #515e5f; +$color-core-neutral-800: #364141; +$color-core-neutral-900: #273333; +$color-core-neutral-1000: #162020; +$color-core-neutral-1100: #040404; +$color-core-yellow-0: #fff8e2; +$color-core-yellow-100: #fdefcd; +$color-core-yellow-200: #ffe99a; +$color-core-yellow-300: #ffe16e; +$color-core-yellow-400: #ffd943; +$color-core-yellow-500: #ffcd1c; +$color-core-yellow-600: #ffbc00; +$color-core-yellow-700: #dd9903; +$color-core-yellow-800: #ba7506; +$color-core-yellow-900: #944c0c; +$color-core-yellow-1000: #542a00; +$color-core-yellow-1100: #2d1a05; +$color-font-primary: #040404; +$color-font-secondary: #273333; +$color-font-tertiary: #364141; +$color-font-interactive: #0b8599; +$color-font-interactive-hover: #0b8599; +$color-font-interactive-active: #6f5ed3; +$color-font-interactive-disabled: #364141; +$color-font-danger: #6d1313; +$color-font-warning: #601700; +$color-font-success: #08422f; +$size-border-radius-large: 30rem; +$size-font-small: 0.75rem; +$size-font-medium: 1rem; +$size-font-large: 1.5rem; +$size-font-xl: 2.25rem; +$size-padding-small: 0.5rem; +$size-padding-medium: 1rem; +$size-padding-large: 1rem; +$size-padding-xl: 1rem;" +`; + +exports[`integration scss scss/variables with filter and output references should match snapshot 1`] = ` +" +// Do not edit directly +// Generated on Sat, 01 Jan 2000 00:00:00 GMT + +$color-background-primary: $color-core-neutral-0 !default; +$color-background-secondary: $color-core-neutral-100; +$color-background-tertiary: $color-core-neutral-200; +$color-background-danger: $color-core-red-0; +$color-background-warning: $color-core-orange-0; +$color-background-success: $color-core-green-0; +$color-background-info: $color-core-blue-0; +$color-background-disabled: $color-background-tertiary;" +`; + +exports[`integration scss scss/variables with outputReferences should match snapshot 1`] = ` " // Do not edit directly // Generated on Sat, 01 Jan 2000 00:00:00 GMT -$color-background-primary: #ffffff !default; -$color-background-secondary: #f3f4f4; -$color-background-tertiary: #dee1e1; -$color-background-danger: #ffeae9; -$color-background-warning: #ffede3; -$color-background-success: #ebf9eb; -$color-background-info: #e9f8ff; -$color-background-disabled: #dee1e1; -$color-border-primary: #c8cccc; -$color-brand-primary: #0b8599; -$color-brand-secondary: #6f5ed3; $color-core-green-0: #ebf9eb; $color-core-green-100: #d7f4d7; $color-core-green-200: #c2f2bd; @@ -711,16 +884,6 @@ $color-core-yellow-800: #ba7506; $color-core-yellow-900: #944c0c; $color-core-yellow-1000: #542a00; $color-core-yellow-1100: #2d1a05; -$color-font-primary: #040404; -$color-font-secondary: #273333; -$color-font-tertiary: #364141; -$color-font-interactive: #0b8599; -$color-font-interactive-hover: #0b8599; -$color-font-interactive-active: #6f5ed3; -$color-font-interactive-disabled: #364141; -$color-font-danger: #6d1313; -$color-font-warning: #601700; -$color-font-success: #08422f; $size-border-radius-large: 30rem; $size-font-small: 0.75rem; $size-font-medium: 1rem; @@ -729,189 +892,26 @@ $size-font-xl: 2.25rem; $size-padding-small: 0.5rem; $size-padding-medium: 1rem; $size-padding-large: 1rem; -$size-padding-xl: 1rem;" -`; - -exports[`integration scss scss/variables with filter and output references should match snapshot 1`] = ` -" -// Do not edit directly -// Generated on Sat, 01 Jan 2000 00:00:00 GMT - -$color-background-primary: $color-core-neutral-0 !default; -$color-background-secondary: $color-core-neutral-100; -$color-background-tertiary: $color-core-neutral-200; -$color-background-danger: $color-core-red-0; -$color-background-warning: $color-core-orange-0; -$color-background-success: $color-core-green-0; -$color-background-info: $color-core-blue-0; -$color-background-disabled: $color-background-tertiary;" -`; - -exports[`integration scss scss/variables with outputReferences should match snapshot 1`] = ` -" -// Do not edit directly -// Generated on Sat, 01 Jan 2000 00:00:00 GMT - $size-padding-xl: 1rem; -$size-padding-large: 1rem; -$size-padding-medium: 1rem; -$size-padding-small: 0.5rem; -$size-font-xl: 2.25rem; -$size-font-large: 1.5rem; -$size-font-medium: 1rem; -$size-font-small: 0.75rem; -$size-border-radius-large: 30rem; -$color-core-yellow-1100: #2d1a05; -$color-core-yellow-1000: #542a00; -$color-core-yellow-900: #944c0c; -$color-core-yellow-800: #ba7506; -$color-core-yellow-700: #dd9903; -$color-core-yellow-600: #ffbc00; -$color-core-yellow-500: #ffcd1c; -$color-core-yellow-400: #ffd943; -$color-core-yellow-300: #ffe16e; -$color-core-yellow-200: #ffe99a; -$color-core-yellow-100: #fdefcd; -$color-core-yellow-0: #fff8e2; -$color-core-neutral-1100: #040404; -$color-core-neutral-1000: #162020; -$color-core-neutral-900: #273333; -$color-core-neutral-800: #364141; -$color-core-neutral-700: #515e5f; -$color-core-neutral-600: #6e797a; -$color-core-neutral-500: #929a9b; -$color-core-neutral-400: #b0b6b7; -$color-core-neutral-300: #c8cccc; -$color-core-neutral-200: #dee1e1; -$color-core-neutral-100: #f3f4f4; -$color-core-neutral-0: #ffffff; -$color-core-orange-1100: #2d130e; -$color-core-orange-1000: #601700; -$color-core-orange-900: #962c0b; -$color-core-orange-800: #ce5511; -$color-core-orange-700: #ed7024; -$color-core-orange-600: #f57d33; -$color-core-orange-500: #fc8943; -$color-core-orange-400: #ff9c5d; -$color-core-orange-300: #ffb180; -$color-core-orange-200: #ffc6a4; -$color-core-orange-100: #fcdccc; -$color-core-orange-0: #ffede3; -$color-core-red-1100: #2b1111; -$color-core-red-1000: #6d1313; -$color-core-red-900: #992222; -$color-core-red-800: #c63434; -$color-core-red-700: #db3e3e; -$color-core-red-600: #ed4c42; -$color-core-red-500: #f76054; -$color-core-red-400: #ff7f6e; -$color-core-red-300: #ff9c8f; -$color-core-red-200: #ffb8b1; -$color-core-red-100: #ffd5d2; -$color-core-red-0: #ffeae9; -$color-core-pink-1100: #2b1721; -$color-core-pink-1000: #561231; -$color-core-pink-900: #931847; -$color-core-pink-800: #b22f5b; -$color-core-pink-700: #ce3665; -$color-core-pink-600: #e0447c; -$color-core-pink-500: #ef588b; -$color-core-pink-400: #ff76ae; -$color-core-pink-300: #ff95c1; -$color-core-pink-200: #ffb5d5; -$color-core-pink-100: #fcdbeb; -$color-core-pink-0: #ffe9f3; -$color-core-magenta-1100: #29192d; -$color-core-magenta-1000: #451551; -$color-core-magenta-900: #6c2277; -$color-core-magenta-800: #8f3896; -$color-core-magenta-700: #ac44a8; -$color-core-magenta-600: #c44eb9; -$color-core-magenta-500: #db61db; -$color-core-magenta-400: #f282f5; -$color-core-magenta-300: #edadf2; -$color-core-magenta-200: #f4c4f7; -$color-core-magenta-100: #f9e3fc; -$color-core-magenta-0: #fef0ff; -$color-core-purple-1100: #1d1d38; -$color-core-purple-1000: #2d246b; -$color-core-purple-900: #483a9c; -$color-core-purple-800: #5e4eba; -$color-core-purple-700: #6f5ed3; -$color-core-purple-600: #816fea; -$color-core-purple-500: #9180f4; -$color-core-purple-400: #a193f2; -$color-core-purple-300: #c1c1f7; -$color-core-purple-200: #d8d7f9; -$color-core-purple-100: #eaeaf9; -$color-core-purple-0: #f2f2f9; -$color-core-blue-1100: #002138; -$color-core-blue-1000: #0a3960; -$color-core-blue-900: #0c5689; -$color-core-blue-800: #116daa; -$color-core-blue-700: #2079c3; -$color-core-blue-600: #2b87d3; -$color-core-blue-500: #3896e3; -$color-core-blue-400: #56adf5; -$color-core-blue-300: #a1d2f8; -$color-core-blue-200: #c7e4f9; -$color-core-blue-100: #dcf2ff; -$color-core-blue-0: #e9f8ff; -$color-core-aqua-1100: #002838; -$color-core-aqua-1000: #083d4f; -$color-core-aqua-900: #035e73; -$color-core-aqua-800: #0f6e84; -$color-core-aqua-700: #0b8599; -$color-core-aqua-600: #0797ae; -$color-core-aqua-500: #17b8ce; -$color-core-aqua-400: #33d6e2; -$color-core-aqua-300: #76e5e2; -$color-core-aqua-200: #a5f2f2; -$color-core-aqua-100: #c5f9f9; -$color-core-aqua-0: #d9fcfb; -$color-core-teal-1100: #002528; -$color-core-teal-1000: #083f3f; -$color-core-teal-900: #026661; -$color-core-teal-800: #067c7c; -$color-core-teal-700: #0b968f; -$color-core-teal-600: #00a99c; -$color-core-teal-500: #08c4b2; -$color-core-teal-400: #24e0c5; -$color-core-teal-300: #7dead5; -$color-core-teal-200: #b3f2e6; -$color-core-teal-100: #cdf7ef; -$color-core-teal-0: #e5f9f5; -$color-core-green-1100: #002b20; -$color-core-green-1000: #08422f; -$color-core-green-900: #006b40; -$color-core-green-800: #008b46; -$color-core-green-700: #0ca750; -$color-core-green-600: #2bb656; -$color-core-green-500: #59cb59; -$color-core-green-400: #75dd66; -$color-core-green-300: #98e58e; -$color-core-green-200: #c2f2bd; -$color-core-green-100: #d7f4d7; -$color-core-green-0: #ebf9eb; -$color-background-primary: $color-core-neutral-0 !default; -$color-background-secondary: $color-core-neutral-100; -$color-background-tertiary: $color-core-neutral-200; -$color-background-danger: $color-core-red-0; -$color-background-warning: $color-core-orange-0; -$color-background-success: $color-core-green-0; -$color-background-info: $color-core-blue-0; -$color-background-disabled: $color-background-tertiary; -$color-border-primary: $color-core-neutral-300; -$color-brand-primary: $color-core-aqua-700; -$color-brand-secondary: $color-core-purple-700; -$color-font-primary: $color-core-neutral-1100; -$color-font-secondary: $color-core-neutral-900; +$color-font-success: $color-core-green-1000; +$color-font-warning: $color-core-orange-1000; +$color-font-danger: $color-core-red-1000; $color-font-tertiary: $color-core-neutral-800; -$color-font-interactive: $color-brand-primary; -$color-font-interactive-hover: $color-brand-primary; -$color-font-interactive-active: $color-brand-secondary; +$color-font-secondary: $color-core-neutral-900; +$color-font-primary: $color-core-neutral-1100; +$color-brand-secondary: $color-core-purple-700; +$color-brand-primary: $color-core-aqua-700; +$color-border-primary: $color-core-neutral-300; +$color-background-info: $color-core-blue-0; +$color-background-success: $color-core-green-0; +$color-background-warning: $color-core-orange-0; +$color-background-danger: $color-core-red-0; +$color-background-tertiary: $color-core-neutral-200; +$color-background-secondary: $color-core-neutral-100; +$color-background-primary: $color-core-neutral-0 !default; $color-font-interactive-disabled: $color-font-tertiary; -$color-font-danger: $color-core-red-1000; -$color-font-warning: $color-core-orange-1000; -$color-font-success: $color-core-green-1000;" +$color-font-interactive-active: $color-brand-secondary; +$color-font-interactive-hover: $color-brand-primary; +$color-font-interactive: $color-brand-primary; +$color-background-disabled: $color-background-tertiary;" `; diff --git a/__integration__/__snapshots__/swift.test.js.snap b/__integration__/__snapshots__/swift.test.js.snap index 85e11127a..0628ff0c9 100644 --- a/__integration__/__snapshots__/swift.test.js.snap +++ b/__integration__/__snapshots__/swift.test.js.snap @@ -13,168 +13,168 @@ exports[`integration swift ios-swift/class.swift should match snapshot 1`] = ` import UIKit public class StyleDictionary { - public static let colorBackgroundDanger = UIColor(red: 1.000, green: 0.918, blue: 0.914, alpha:1) - public static let colorBackgroundDisabled = UIColor(red: 0.871, green: 0.882, blue: 0.882, alpha:1) - public static let colorBackgroundInfo = UIColor(red: 0.914, green: 0.973, blue: 1.000, alpha:1) - public static let colorBackgroundPrimary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha:1) - public static let colorBackgroundSecondary = UIColor(red: 0.953, green: 0.957, blue: 0.957, alpha:1) - public static let colorBackgroundSuccess = UIColor(red: 0.922, green: 0.976, blue: 0.922, alpha:1) - public static let colorBackgroundTertiary = UIColor(red: 0.871, green: 0.882, blue: 0.882, alpha:1) - public static let colorBackgroundWarning = UIColor(red: 1.000, green: 0.929, blue: 0.890, alpha:1) - public static let colorBorderPrimary = UIColor(red: 0.784, green: 0.800, blue: 0.800, alpha:1) - public static let colorBrandPrimary = UIColor(red: 0.043, green: 0.522, blue: 0.600, alpha:1) - public static let colorBrandSecondary = UIColor(red: 0.435, green: 0.369, blue: 0.827, alpha:1) - public static let colorCoreAqua0 = UIColor(red: 0.851, green: 0.988, blue: 0.984, alpha:1) - public static let colorCoreAqua100 = UIColor(red: 0.773, green: 0.976, blue: 0.976, alpha:1) - public static let colorCoreAqua1000 = UIColor(red: 0.031, green: 0.239, blue: 0.310, alpha:1) - public static let colorCoreAqua1100 = UIColor(red: 0.000, green: 0.157, blue: 0.220, alpha:1) - public static let colorCoreAqua200 = UIColor(red: 0.647, green: 0.949, blue: 0.949, alpha:1) - public static let colorCoreAqua300 = UIColor(red: 0.463, green: 0.898, blue: 0.886, alpha:1) - public static let colorCoreAqua400 = UIColor(red: 0.200, green: 0.839, blue: 0.886, alpha:1) - public static let colorCoreAqua500 = UIColor(red: 0.090, green: 0.722, blue: 0.808, alpha:1) - public static let colorCoreAqua600 = UIColor(red: 0.027, green: 0.592, blue: 0.682, alpha:1) - public static let colorCoreAqua700 = UIColor(red: 0.043, green: 0.522, blue: 0.600, alpha:1) - public static let colorCoreAqua800 = UIColor(red: 0.059, green: 0.431, blue: 0.518, alpha:1) - public static let colorCoreAqua900 = UIColor(red: 0.012, green: 0.369, blue: 0.451, alpha:1) - public static let colorCoreBlue0 = UIColor(red: 0.914, green: 0.973, blue: 1.000, alpha:1) - public static let colorCoreBlue100 = UIColor(red: 0.863, green: 0.949, blue: 1.000, alpha:1) - public static let colorCoreBlue1000 = UIColor(red: 0.039, green: 0.224, blue: 0.376, alpha:1) - public static let colorCoreBlue1100 = UIColor(red: 0.000, green: 0.129, blue: 0.220, alpha:1) - public static let colorCoreBlue200 = UIColor(red: 0.780, green: 0.894, blue: 0.976, alpha:1) - public static let colorCoreBlue300 = UIColor(red: 0.631, green: 0.824, blue: 0.973, alpha:1) - public static let colorCoreBlue400 = UIColor(red: 0.337, green: 0.678, blue: 0.961, alpha:1) - public static let colorCoreBlue500 = UIColor(red: 0.220, green: 0.588, blue: 0.890, alpha:1) - public static let colorCoreBlue600 = UIColor(red: 0.169, green: 0.529, blue: 0.827, alpha:1) - public static let colorCoreBlue700 = UIColor(red: 0.125, green: 0.475, blue: 0.765, alpha:1) - public static let colorCoreBlue800 = UIColor(red: 0.067, green: 0.427, blue: 0.667, alpha:1) - public static let colorCoreBlue900 = UIColor(red: 0.047, green: 0.337, blue: 0.537, alpha:1) - public static let colorCoreGreen0 = UIColor(red: 0.922, green: 0.976, blue: 0.922, alpha:1) - public static let colorCoreGreen100 = UIColor(red: 0.843, green: 0.957, blue: 0.843, alpha:1) - public static let colorCoreGreen1000 = UIColor(red: 0.031, green: 0.259, blue: 0.184, alpha:1) - public static let colorCoreGreen1100 = UIColor(red: 0.000, green: 0.169, blue: 0.125, alpha:1) - public static let colorCoreGreen200 = UIColor(red: 0.761, green: 0.949, blue: 0.741, alpha:1) - public static let colorCoreGreen300 = UIColor(red: 0.596, green: 0.898, blue: 0.557, alpha:1) - public static let colorCoreGreen400 = UIColor(red: 0.459, green: 0.867, blue: 0.400, alpha:1) - public static let colorCoreGreen500 = UIColor(red: 0.349, green: 0.796, blue: 0.349, alpha:1) - public static let colorCoreGreen600 = UIColor(red: 0.169, green: 0.714, blue: 0.337, alpha:1) - public static let colorCoreGreen700 = UIColor(red: 0.047, green: 0.655, blue: 0.314, alpha:1) - public static let colorCoreGreen800 = UIColor(red: 0.000, green: 0.545, blue: 0.275, alpha:1) - public static let colorCoreGreen900 = UIColor(red: 0.000, green: 0.420, blue: 0.251, alpha:1) - public static let colorCoreMagenta0 = UIColor(red: 0.996, green: 0.941, blue: 1.000, alpha:1) - public static let colorCoreMagenta100 = UIColor(red: 0.976, green: 0.890, blue: 0.988, alpha:1) - public static let colorCoreMagenta1000 = UIColor(red: 0.271, green: 0.082, blue: 0.318, alpha:1) - public static let colorCoreMagenta1100 = UIColor(red: 0.161, green: 0.098, blue: 0.176, alpha:1) - public static let colorCoreMagenta200 = UIColor(red: 0.957, green: 0.769, blue: 0.969, alpha:1) - public static let colorCoreMagenta300 = UIColor(red: 0.929, green: 0.678, blue: 0.949, alpha:1) - public static let colorCoreMagenta400 = UIColor(red: 0.949, green: 0.510, blue: 0.961, alpha:1) - public static let colorCoreMagenta500 = UIColor(red: 0.859, green: 0.380, blue: 0.859, alpha:1) - public static let colorCoreMagenta600 = UIColor(red: 0.769, green: 0.306, blue: 0.725, alpha:1) - public static let colorCoreMagenta700 = UIColor(red: 0.675, green: 0.267, blue: 0.659, alpha:1) - public static let colorCoreMagenta800 = UIColor(red: 0.561, green: 0.220, blue: 0.588, alpha:1) - public static let colorCoreMagenta900 = UIColor(red: 0.424, green: 0.133, blue: 0.467, alpha:1) - public static let colorCoreNeutral0 = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha:1) - public static let colorCoreNeutral100 = UIColor(red: 0.953, green: 0.957, blue: 0.957, alpha:1) - public static let colorCoreNeutral1000 = UIColor(red: 0.086, green: 0.125, blue: 0.125, alpha:1) + public static let sizePaddingXl = CGFloat(16.00) + public static let sizePaddingLarge = CGFloat(16.00) + public static let sizePaddingMedium = CGFloat(16.00) + public static let sizePaddingSmall = CGFloat(8.00) + public static let sizeFontXl = CGFloat(36.00) + public static let sizeFontLarge = CGFloat(24.00) + public static let sizeFontMedium = CGFloat(16.00) + public static let sizeFontSmall = CGFloat(12.00) + public static let sizeBorderRadiusLarge = CGFloat(480.00) + public static let colorCoreYellow1100 = UIColor(red: 0.176, green: 0.102, blue: 0.020, alpha:1) + public static let colorCoreYellow1000 = UIColor(red: 0.329, green: 0.165, blue: 0.000, alpha:1) + public static let colorCoreYellow900 = UIColor(red: 0.580, green: 0.298, blue: 0.047, alpha:1) + public static let colorCoreYellow800 = UIColor(red: 0.729, green: 0.459, blue: 0.024, alpha:1) + public static let colorCoreYellow700 = UIColor(red: 0.867, green: 0.600, blue: 0.012, alpha:1) + public static let colorCoreYellow600 = UIColor(red: 1.000, green: 0.737, blue: 0.000, alpha:1) + public static let colorCoreYellow500 = UIColor(red: 1.000, green: 0.804, blue: 0.110, alpha:1) + public static let colorCoreYellow400 = UIColor(red: 1.000, green: 0.851, blue: 0.263, alpha:1) + public static let colorCoreYellow300 = UIColor(red: 1.000, green: 0.882, blue: 0.431, alpha:1) + public static let colorCoreYellow200 = UIColor(red: 1.000, green: 0.914, blue: 0.604, alpha:1) + public static let colorCoreYellow100 = UIColor(red: 0.992, green: 0.937, blue: 0.804, alpha:1) + public static let colorCoreYellow0 = UIColor(red: 1.000, green: 0.973, blue: 0.886, alpha:1) public static let colorCoreNeutral1100 = UIColor(red: 0.016, green: 0.016, blue: 0.016, alpha:1) - public static let colorCoreNeutral200 = UIColor(red: 0.871, green: 0.882, blue: 0.882, alpha:1) - public static let colorCoreNeutral300 = UIColor(red: 0.784, green: 0.800, blue: 0.800, alpha:1) - public static let colorCoreNeutral400 = UIColor(red: 0.690, green: 0.714, blue: 0.718, alpha:1) - public static let colorCoreNeutral500 = UIColor(red: 0.573, green: 0.604, blue: 0.608, alpha:1) - public static let colorCoreNeutral600 = UIColor(red: 0.431, green: 0.475, blue: 0.478, alpha:1) - public static let colorCoreNeutral700 = UIColor(red: 0.318, green: 0.369, blue: 0.373, alpha:1) - public static let colorCoreNeutral800 = UIColor(red: 0.212, green: 0.255, blue: 0.255, alpha:1) + public static let colorCoreNeutral1000 = UIColor(red: 0.086, green: 0.125, blue: 0.125, alpha:1) public static let colorCoreNeutral900 = UIColor(red: 0.153, green: 0.200, blue: 0.200, alpha:1) - public static let colorCoreOrange0 = UIColor(red: 1.000, green: 0.929, blue: 0.890, alpha:1) - public static let colorCoreOrange100 = UIColor(red: 0.988, green: 0.863, blue: 0.800, alpha:1) - public static let colorCoreOrange1000 = UIColor(red: 0.376, green: 0.090, blue: 0.000, alpha:1) + public static let colorCoreNeutral800 = UIColor(red: 0.212, green: 0.255, blue: 0.255, alpha:1) + public static let colorCoreNeutral700 = UIColor(red: 0.318, green: 0.369, blue: 0.373, alpha:1) + public static let colorCoreNeutral600 = UIColor(red: 0.431, green: 0.475, blue: 0.478, alpha:1) + public static let colorCoreNeutral500 = UIColor(red: 0.573, green: 0.604, blue: 0.608, alpha:1) + public static let colorCoreNeutral400 = UIColor(red: 0.690, green: 0.714, blue: 0.718, alpha:1) + public static let colorCoreNeutral300 = UIColor(red: 0.784, green: 0.800, blue: 0.800, alpha:1) + public static let colorCoreNeutral200 = UIColor(red: 0.871, green: 0.882, blue: 0.882, alpha:1) + public static let colorCoreNeutral100 = UIColor(red: 0.953, green: 0.957, blue: 0.957, alpha:1) + public static let colorCoreNeutral0 = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha:1) public static let colorCoreOrange1100 = UIColor(red: 0.176, green: 0.075, blue: 0.055, alpha:1) - public static let colorCoreOrange200 = UIColor(red: 1.000, green: 0.776, blue: 0.643, alpha:1) - public static let colorCoreOrange300 = UIColor(red: 1.000, green: 0.694, blue: 0.502, alpha:1) - public static let colorCoreOrange400 = UIColor(red: 1.000, green: 0.612, blue: 0.365, alpha:1) - public static let colorCoreOrange500 = UIColor(red: 0.988, green: 0.537, blue: 0.263, alpha:1) - public static let colorCoreOrange600 = UIColor(red: 0.961, green: 0.490, blue: 0.200, alpha:1) - public static let colorCoreOrange700 = UIColor(red: 0.929, green: 0.439, blue: 0.141, alpha:1) - public static let colorCoreOrange800 = UIColor(red: 0.808, green: 0.333, blue: 0.067, alpha:1) + public static let colorCoreOrange1000 = UIColor(red: 0.376, green: 0.090, blue: 0.000, alpha:1) public static let colorCoreOrange900 = UIColor(red: 0.588, green: 0.173, blue: 0.043, alpha:1) - public static let colorCorePink0 = UIColor(red: 1.000, green: 0.914, blue: 0.953, alpha:1) - public static let colorCorePink100 = UIColor(red: 0.988, green: 0.859, blue: 0.922, alpha:1) - public static let colorCorePink1000 = UIColor(red: 0.337, green: 0.071, blue: 0.192, alpha:1) + public static let colorCoreOrange800 = UIColor(red: 0.808, green: 0.333, blue: 0.067, alpha:1) + public static let colorCoreOrange700 = UIColor(red: 0.929, green: 0.439, blue: 0.141, alpha:1) + public static let colorCoreOrange600 = UIColor(red: 0.961, green: 0.490, blue: 0.200, alpha:1) + public static let colorCoreOrange500 = UIColor(red: 0.988, green: 0.537, blue: 0.263, alpha:1) + public static let colorCoreOrange400 = UIColor(red: 1.000, green: 0.612, blue: 0.365, alpha:1) + public static let colorCoreOrange300 = UIColor(red: 1.000, green: 0.694, blue: 0.502, alpha:1) + public static let colorCoreOrange200 = UIColor(red: 1.000, green: 0.776, blue: 0.643, alpha:1) + public static let colorCoreOrange100 = UIColor(red: 0.988, green: 0.863, blue: 0.800, alpha:1) + public static let colorCoreOrange0 = UIColor(red: 1.000, green: 0.929, blue: 0.890, alpha:1) + public static let colorCoreRed1100 = UIColor(red: 0.169, green: 0.067, blue: 0.067, alpha:1) + public static let colorCoreRed1000 = UIColor(red: 0.427, green: 0.075, blue: 0.075, alpha:1) + public static let colorCoreRed900 = UIColor(red: 0.600, green: 0.133, blue: 0.133, alpha:1) + public static let colorCoreRed800 = UIColor(red: 0.776, green: 0.204, blue: 0.204, alpha:1) + public static let colorCoreRed700 = UIColor(red: 0.859, green: 0.243, blue: 0.243, alpha:1) + public static let colorCoreRed600 = UIColor(red: 0.929, green: 0.298, blue: 0.259, alpha:1) + public static let colorCoreRed500 = UIColor(red: 0.969, green: 0.376, blue: 0.329, alpha:1) + public static let colorCoreRed400 = UIColor(red: 1.000, green: 0.498, blue: 0.431, alpha:1) + public static let colorCoreRed300 = UIColor(red: 1.000, green: 0.612, blue: 0.561, alpha:1) + public static let colorCoreRed200 = UIColor(red: 1.000, green: 0.722, blue: 0.694, alpha:1) + public static let colorCoreRed100 = UIColor(red: 1.000, green: 0.835, blue: 0.824, alpha:1) + public static let colorCoreRed0 = UIColor(red: 1.000, green: 0.918, blue: 0.914, alpha:1) public static let colorCorePink1100 = UIColor(red: 0.169, green: 0.090, blue: 0.129, alpha:1) - public static let colorCorePink200 = UIColor(red: 1.000, green: 0.710, blue: 0.835, alpha:1) - public static let colorCorePink300 = UIColor(red: 1.000, green: 0.584, blue: 0.757, alpha:1) - public static let colorCorePink400 = UIColor(red: 1.000, green: 0.463, blue: 0.682, alpha:1) - public static let colorCorePink500 = UIColor(red: 0.937, green: 0.345, blue: 0.545, alpha:1) - public static let colorCorePink600 = UIColor(red: 0.878, green: 0.267, blue: 0.486, alpha:1) - public static let colorCorePink700 = UIColor(red: 0.808, green: 0.212, blue: 0.396, alpha:1) - public static let colorCorePink800 = UIColor(red: 0.698, green: 0.184, blue: 0.357, alpha:1) + public static let colorCorePink1000 = UIColor(red: 0.337, green: 0.071, blue: 0.192, alpha:1) public static let colorCorePink900 = UIColor(red: 0.576, green: 0.094, blue: 0.278, alpha:1) - public static let colorCorePurple0 = UIColor(red: 0.949, green: 0.949, blue: 0.976, alpha:1) - public static let colorCorePurple100 = UIColor(red: 0.918, green: 0.918, blue: 0.976, alpha:1) - public static let colorCorePurple1000 = UIColor(red: 0.176, green: 0.141, blue: 0.420, alpha:1) + public static let colorCorePink800 = UIColor(red: 0.698, green: 0.184, blue: 0.357, alpha:1) + public static let colorCorePink700 = UIColor(red: 0.808, green: 0.212, blue: 0.396, alpha:1) + public static let colorCorePink600 = UIColor(red: 0.878, green: 0.267, blue: 0.486, alpha:1) + public static let colorCorePink500 = UIColor(red: 0.937, green: 0.345, blue: 0.545, alpha:1) + public static let colorCorePink400 = UIColor(red: 1.000, green: 0.463, blue: 0.682, alpha:1) + public static let colorCorePink300 = UIColor(red: 1.000, green: 0.584, blue: 0.757, alpha:1) + public static let colorCorePink200 = UIColor(red: 1.000, green: 0.710, blue: 0.835, alpha:1) + public static let colorCorePink100 = UIColor(red: 0.988, green: 0.859, blue: 0.922, alpha:1) + public static let colorCorePink0 = UIColor(red: 1.000, green: 0.914, blue: 0.953, alpha:1) + public static let colorCoreMagenta1100 = UIColor(red: 0.161, green: 0.098, blue: 0.176, alpha:1) + public static let colorCoreMagenta1000 = UIColor(red: 0.271, green: 0.082, blue: 0.318, alpha:1) + public static let colorCoreMagenta900 = UIColor(red: 0.424, green: 0.133, blue: 0.467, alpha:1) + public static let colorCoreMagenta800 = UIColor(red: 0.561, green: 0.220, blue: 0.588, alpha:1) + public static let colorCoreMagenta700 = UIColor(red: 0.675, green: 0.267, blue: 0.659, alpha:1) + public static let colorCoreMagenta600 = UIColor(red: 0.769, green: 0.306, blue: 0.725, alpha:1) + public static let colorCoreMagenta500 = UIColor(red: 0.859, green: 0.380, blue: 0.859, alpha:1) + public static let colorCoreMagenta400 = UIColor(red: 0.949, green: 0.510, blue: 0.961, alpha:1) + public static let colorCoreMagenta300 = UIColor(red: 0.929, green: 0.678, blue: 0.949, alpha:1) + public static let colorCoreMagenta200 = UIColor(red: 0.957, green: 0.769, blue: 0.969, alpha:1) + public static let colorCoreMagenta100 = UIColor(red: 0.976, green: 0.890, blue: 0.988, alpha:1) + public static let colorCoreMagenta0 = UIColor(red: 0.996, green: 0.941, blue: 1.000, alpha:1) public static let colorCorePurple1100 = UIColor(red: 0.114, green: 0.114, blue: 0.220, alpha:1) - public static let colorCorePurple200 = UIColor(red: 0.847, green: 0.843, blue: 0.976, alpha:1) - public static let colorCorePurple300 = UIColor(red: 0.757, green: 0.757, blue: 0.969, alpha:1) - public static let colorCorePurple400 = UIColor(red: 0.631, green: 0.576, blue: 0.949, alpha:1) - public static let colorCorePurple500 = UIColor(red: 0.569, green: 0.502, blue: 0.957, alpha:1) - public static let colorCorePurple600 = UIColor(red: 0.506, green: 0.435, blue: 0.918, alpha:1) - public static let colorCorePurple700 = UIColor(red: 0.435, green: 0.369, blue: 0.827, alpha:1) - public static let colorCorePurple800 = UIColor(red: 0.369, green: 0.306, blue: 0.729, alpha:1) + public static let colorCorePurple1000 = UIColor(red: 0.176, green: 0.141, blue: 0.420, alpha:1) public static let colorCorePurple900 = UIColor(red: 0.282, green: 0.227, blue: 0.612, alpha:1) - public static let colorCoreRed0 = UIColor(red: 1.000, green: 0.918, blue: 0.914, alpha:1) - public static let colorCoreRed100 = UIColor(red: 1.000, green: 0.835, blue: 0.824, alpha:1) - public static let colorCoreRed1000 = UIColor(red: 0.427, green: 0.075, blue: 0.075, alpha:1) - public static let colorCoreRed1100 = UIColor(red: 0.169, green: 0.067, blue: 0.067, alpha:1) - public static let colorCoreRed200 = UIColor(red: 1.000, green: 0.722, blue: 0.694, alpha:1) - public static let colorCoreRed300 = UIColor(red: 1.000, green: 0.612, blue: 0.561, alpha:1) - public static let colorCoreRed400 = UIColor(red: 1.000, green: 0.498, blue: 0.431, alpha:1) - public static let colorCoreRed500 = UIColor(red: 0.969, green: 0.376, blue: 0.329, alpha:1) - public static let colorCoreRed600 = UIColor(red: 0.929, green: 0.298, blue: 0.259, alpha:1) - public static let colorCoreRed700 = UIColor(red: 0.859, green: 0.243, blue: 0.243, alpha:1) - public static let colorCoreRed800 = UIColor(red: 0.776, green: 0.204, blue: 0.204, alpha:1) - public static let colorCoreRed900 = UIColor(red: 0.600, green: 0.133, blue: 0.133, alpha:1) - public static let colorCoreTeal0 = UIColor(red: 0.898, green: 0.976, blue: 0.961, alpha:1) - public static let colorCoreTeal100 = UIColor(red: 0.804, green: 0.969, blue: 0.937, alpha:1) - public static let colorCoreTeal1000 = UIColor(red: 0.031, green: 0.247, blue: 0.247, alpha:1) + public static let colorCorePurple800 = UIColor(red: 0.369, green: 0.306, blue: 0.729, alpha:1) + public static let colorCorePurple700 = UIColor(red: 0.435, green: 0.369, blue: 0.827, alpha:1) + public static let colorCorePurple600 = UIColor(red: 0.506, green: 0.435, blue: 0.918, alpha:1) + public static let colorCorePurple500 = UIColor(red: 0.569, green: 0.502, blue: 0.957, alpha:1) + public static let colorCorePurple400 = UIColor(red: 0.631, green: 0.576, blue: 0.949, alpha:1) + public static let colorCorePurple300 = UIColor(red: 0.757, green: 0.757, blue: 0.969, alpha:1) + public static let colorCorePurple200 = UIColor(red: 0.847, green: 0.843, blue: 0.976, alpha:1) + public static let colorCorePurple100 = UIColor(red: 0.918, green: 0.918, blue: 0.976, alpha:1) + public static let colorCorePurple0 = UIColor(red: 0.949, green: 0.949, blue: 0.976, alpha:1) + public static let colorCoreBlue1100 = UIColor(red: 0.000, green: 0.129, blue: 0.220, alpha:1) + public static let colorCoreBlue1000 = UIColor(red: 0.039, green: 0.224, blue: 0.376, alpha:1) + public static let colorCoreBlue900 = UIColor(red: 0.047, green: 0.337, blue: 0.537, alpha:1) + public static let colorCoreBlue800 = UIColor(red: 0.067, green: 0.427, blue: 0.667, alpha:1) + public static let colorCoreBlue700 = UIColor(red: 0.125, green: 0.475, blue: 0.765, alpha:1) + public static let colorCoreBlue600 = UIColor(red: 0.169, green: 0.529, blue: 0.827, alpha:1) + public static let colorCoreBlue500 = UIColor(red: 0.220, green: 0.588, blue: 0.890, alpha:1) + public static let colorCoreBlue400 = UIColor(red: 0.337, green: 0.678, blue: 0.961, alpha:1) + public static let colorCoreBlue300 = UIColor(red: 0.631, green: 0.824, blue: 0.973, alpha:1) + public static let colorCoreBlue200 = UIColor(red: 0.780, green: 0.894, blue: 0.976, alpha:1) + public static let colorCoreBlue100 = UIColor(red: 0.863, green: 0.949, blue: 1.000, alpha:1) + public static let colorCoreBlue0 = UIColor(red: 0.914, green: 0.973, blue: 1.000, alpha:1) + public static let colorCoreAqua1100 = UIColor(red: 0.000, green: 0.157, blue: 0.220, alpha:1) + public static let colorCoreAqua1000 = UIColor(red: 0.031, green: 0.239, blue: 0.310, alpha:1) + public static let colorCoreAqua900 = UIColor(red: 0.012, green: 0.369, blue: 0.451, alpha:1) + public static let colorCoreAqua800 = UIColor(red: 0.059, green: 0.431, blue: 0.518, alpha:1) + public static let colorCoreAqua700 = UIColor(red: 0.043, green: 0.522, blue: 0.600, alpha:1) + public static let colorCoreAqua600 = UIColor(red: 0.027, green: 0.592, blue: 0.682, alpha:1) + public static let colorCoreAqua500 = UIColor(red: 0.090, green: 0.722, blue: 0.808, alpha:1) + public static let colorCoreAqua400 = UIColor(red: 0.200, green: 0.839, blue: 0.886, alpha:1) + public static let colorCoreAqua300 = UIColor(red: 0.463, green: 0.898, blue: 0.886, alpha:1) + public static let colorCoreAqua200 = UIColor(red: 0.647, green: 0.949, blue: 0.949, alpha:1) + public static let colorCoreAqua100 = UIColor(red: 0.773, green: 0.976, blue: 0.976, alpha:1) + public static let colorCoreAqua0 = UIColor(red: 0.851, green: 0.988, blue: 0.984, alpha:1) public static let colorCoreTeal1100 = UIColor(red: 0.000, green: 0.145, blue: 0.157, alpha:1) - public static let colorCoreTeal200 = UIColor(red: 0.702, green: 0.949, blue: 0.902, alpha:1) - public static let colorCoreTeal300 = UIColor(red: 0.490, green: 0.918, blue: 0.835, alpha:1) - public static let colorCoreTeal400 = UIColor(red: 0.141, green: 0.878, blue: 0.773, alpha:1) - public static let colorCoreTeal500 = UIColor(red: 0.031, green: 0.769, blue: 0.698, alpha:1) - public static let colorCoreTeal600 = UIColor(red: 0.000, green: 0.663, blue: 0.612, alpha:1) - public static let colorCoreTeal700 = UIColor(red: 0.043, green: 0.588, blue: 0.561, alpha:1) - public static let colorCoreTeal800 = UIColor(red: 0.024, green: 0.486, blue: 0.486, alpha:1) + public static let colorCoreTeal1000 = UIColor(red: 0.031, green: 0.247, blue: 0.247, alpha:1) public static let colorCoreTeal900 = UIColor(red: 0.008, green: 0.400, blue: 0.380, alpha:1) - public static let colorCoreYellow0 = UIColor(red: 1.000, green: 0.973, blue: 0.886, alpha:1) - public static let colorCoreYellow100 = UIColor(red: 0.992, green: 0.937, blue: 0.804, alpha:1) - public static let colorCoreYellow1000 = UIColor(red: 0.329, green: 0.165, blue: 0.000, alpha:1) - public static let colorCoreYellow1100 = UIColor(red: 0.176, green: 0.102, blue: 0.020, alpha:1) - public static let colorCoreYellow200 = UIColor(red: 1.000, green: 0.914, blue: 0.604, alpha:1) - public static let colorCoreYellow300 = UIColor(red: 1.000, green: 0.882, blue: 0.431, alpha:1) - public static let colorCoreYellow400 = UIColor(red: 1.000, green: 0.851, blue: 0.263, alpha:1) - public static let colorCoreYellow500 = UIColor(red: 1.000, green: 0.804, blue: 0.110, alpha:1) - public static let colorCoreYellow600 = UIColor(red: 1.000, green: 0.737, blue: 0.000, alpha:1) - public static let colorCoreYellow700 = UIColor(red: 0.867, green: 0.600, blue: 0.012, alpha:1) - public static let colorCoreYellow800 = UIColor(red: 0.729, green: 0.459, blue: 0.024, alpha:1) - public static let colorCoreYellow900 = UIColor(red: 0.580, green: 0.298, blue: 0.047, alpha:1) + public static let colorCoreTeal800 = UIColor(red: 0.024, green: 0.486, blue: 0.486, alpha:1) + public static let colorCoreTeal700 = UIColor(red: 0.043, green: 0.588, blue: 0.561, alpha:1) + public static let colorCoreTeal600 = UIColor(red: 0.000, green: 0.663, blue: 0.612, alpha:1) + public static let colorCoreTeal500 = UIColor(red: 0.031, green: 0.769, blue: 0.698, alpha:1) + public static let colorCoreTeal400 = UIColor(red: 0.141, green: 0.878, blue: 0.773, alpha:1) + public static let colorCoreTeal300 = UIColor(red: 0.490, green: 0.918, blue: 0.835, alpha:1) + public static let colorCoreTeal200 = UIColor(red: 0.702, green: 0.949, blue: 0.902, alpha:1) + public static let colorCoreTeal100 = UIColor(red: 0.804, green: 0.969, blue: 0.937, alpha:1) + public static let colorCoreTeal0 = UIColor(red: 0.898, green: 0.976, blue: 0.961, alpha:1) + public static let colorCoreGreen1100 = UIColor(red: 0.000, green: 0.169, blue: 0.125, alpha:1) + public static let colorCoreGreen1000 = UIColor(red: 0.031, green: 0.259, blue: 0.184, alpha:1) + public static let colorCoreGreen900 = UIColor(red: 0.000, green: 0.420, blue: 0.251, alpha:1) + public static let colorCoreGreen800 = UIColor(red: 0.000, green: 0.545, blue: 0.275, alpha:1) + public static let colorCoreGreen700 = UIColor(red: 0.047, green: 0.655, blue: 0.314, alpha:1) + public static let colorCoreGreen600 = UIColor(red: 0.169, green: 0.714, blue: 0.337, alpha:1) + public static let colorCoreGreen500 = UIColor(red: 0.349, green: 0.796, blue: 0.349, alpha:1) + public static let colorCoreGreen400 = UIColor(red: 0.459, green: 0.867, blue: 0.400, alpha:1) + public static let colorCoreGreen300 = UIColor(red: 0.596, green: 0.898, blue: 0.557, alpha:1) + public static let colorCoreGreen200 = UIColor(red: 0.761, green: 0.949, blue: 0.741, alpha:1) + public static let colorCoreGreen100 = UIColor(red: 0.843, green: 0.957, blue: 0.843, alpha:1) + public static let colorCoreGreen0 = UIColor(red: 0.922, green: 0.976, blue: 0.922, alpha:1) + public static let colorFontSuccess = UIColor(red: 0.031, green: 0.259, blue: 0.184, alpha:1) + public static let colorFontWarning = UIColor(red: 0.376, green: 0.090, blue: 0.000, alpha:1) public static let colorFontDanger = UIColor(red: 0.427, green: 0.075, blue: 0.075, alpha:1) - public static let colorFontInteractive = UIColor(red: 0.043, green: 0.522, blue: 0.600, alpha:1) - public static let colorFontInteractiveActive = UIColor(red: 0.435, green: 0.369, blue: 0.827, alpha:1) + public static let colorFontTertiary = UIColor(red: 0.212, green: 0.255, blue: 0.255, alpha:1) + public static let colorFontSecondary = UIColor(red: 0.153, green: 0.200, blue: 0.200, alpha:1) + public static let colorFontPrimary = UIColor(red: 0.016, green: 0.016, blue: 0.016, alpha:1) + public static let colorBrandSecondary = UIColor(red: 0.435, green: 0.369, blue: 0.827, alpha:1) + public static let colorBrandPrimary = UIColor(red: 0.043, green: 0.522, blue: 0.600, alpha:1) + public static let colorBorderPrimary = UIColor(red: 0.784, green: 0.800, blue: 0.800, alpha:1) + public static let colorBackgroundInfo = UIColor(red: 0.914, green: 0.973, blue: 1.000, alpha:1) + public static let colorBackgroundSuccess = UIColor(red: 0.922, green: 0.976, blue: 0.922, alpha:1) + public static let colorBackgroundWarning = UIColor(red: 1.000, green: 0.929, blue: 0.890, alpha:1) + public static let colorBackgroundDanger = UIColor(red: 1.000, green: 0.918, blue: 0.914, alpha:1) + public static let colorBackgroundTertiary = UIColor(red: 0.871, green: 0.882, blue: 0.882, alpha:1) + public static let colorBackgroundSecondary = UIColor(red: 0.953, green: 0.957, blue: 0.957, alpha:1) + public static let colorBackgroundPrimary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha:1) public static let colorFontInteractiveDisabled = UIColor(red: 0.212, green: 0.255, blue: 0.255, alpha:1) + public static let colorFontInteractiveActive = UIColor(red: 0.435, green: 0.369, blue: 0.827, alpha:1) public static let colorFontInteractiveHover = UIColor(red: 0.043, green: 0.522, blue: 0.600, alpha:1) - public static let colorFontPrimary = UIColor(red: 0.016, green: 0.016, blue: 0.016, alpha:1) - public static let colorFontSecondary = UIColor(red: 0.153, green: 0.200, blue: 0.200, alpha:1) - public static let colorFontSuccess = UIColor(red: 0.031, green: 0.259, blue: 0.184, alpha:1) - public static let colorFontTertiary = UIColor(red: 0.212, green: 0.255, blue: 0.255, alpha:1) - public static let colorFontWarning = UIColor(red: 0.376, green: 0.090, blue: 0.000, alpha:1) - public static let sizeBorderRadiusLarge = CGFloat(480.00) - public static let sizeFontLarge = CGFloat(24.00) - public static let sizeFontMedium = CGFloat(16.00) - public static let sizeFontSmall = CGFloat(12.00) - public static let sizeFontXl = CGFloat(36.00) - public static let sizePaddingLarge = CGFloat(16.00) - public static let sizePaddingMedium = CGFloat(16.00) - public static let sizePaddingSmall = CGFloat(8.00) - public static let sizePaddingXl = CGFloat(16.00) + public static let colorFontInteractive = UIColor(red: 0.043, green: 0.522, blue: 0.600, alpha:1) + public static let colorBackgroundDisabled = UIColor(red: 0.871, green: 0.882, blue: 0.882, alpha:1) } " `; @@ -192,21 +192,32 @@ exports[`integration swift ios-swift/class.swift with references should match sn import UIKit public class StyleDictionary { - public static let colorBackgroundDanger = colorCoreRed0 - public static let colorBackgroundDisabled = colorBackgroundTertiary - public static let colorBackgroundInfo = colorCoreBlue0 - public static let colorBackgroundPrimary = colorCoreNeutral0 - public static let colorBackgroundSecondary = colorCoreNeutral100 - public static let colorBackgroundSuccess = colorCoreGreen0 - public static let colorBackgroundTertiary = colorCoreNeutral200 - public static let colorBackgroundWarning = colorCoreOrange0 - public static let colorBorderPrimary = colorCoreNeutral300 - public static let colorBrandPrimary = colorCoreAqua700 - public static let colorBrandSecondary = colorCorePurple700 + public static let colorCoreGreen0 = UIColor(red: 0.922, green: 0.976, blue: 0.922, alpha:1) + public static let colorCoreGreen100 = UIColor(red: 0.843, green: 0.957, blue: 0.843, alpha:1) + public static let colorCoreGreen200 = UIColor(red: 0.761, green: 0.949, blue: 0.741, alpha:1) + public static let colorCoreGreen300 = UIColor(red: 0.596, green: 0.898, blue: 0.557, alpha:1) + public static let colorCoreGreen400 = UIColor(red: 0.459, green: 0.867, blue: 0.400, alpha:1) + public static let colorCoreGreen500 = UIColor(red: 0.349, green: 0.796, blue: 0.349, alpha:1) + public static let colorCoreGreen600 = UIColor(red: 0.169, green: 0.714, blue: 0.337, alpha:1) + public static let colorCoreGreen700 = UIColor(red: 0.047, green: 0.655, blue: 0.314, alpha:1) + public static let colorCoreGreen800 = UIColor(red: 0.000, green: 0.545, blue: 0.275, alpha:1) + public static let colorCoreGreen900 = UIColor(red: 0.000, green: 0.420, blue: 0.251, alpha:1) + public static let colorCoreGreen1000 = UIColor(red: 0.031, green: 0.259, blue: 0.184, alpha:1) + public static let colorCoreGreen1100 = UIColor(red: 0.000, green: 0.169, blue: 0.125, alpha:1) + public static let colorCoreTeal0 = UIColor(red: 0.898, green: 0.976, blue: 0.961, alpha:1) + public static let colorCoreTeal100 = UIColor(red: 0.804, green: 0.969, blue: 0.937, alpha:1) + public static let colorCoreTeal200 = UIColor(red: 0.702, green: 0.949, blue: 0.902, alpha:1) + public static let colorCoreTeal300 = UIColor(red: 0.490, green: 0.918, blue: 0.835, alpha:1) + public static let colorCoreTeal400 = UIColor(red: 0.141, green: 0.878, blue: 0.773, alpha:1) + public static let colorCoreTeal500 = UIColor(red: 0.031, green: 0.769, blue: 0.698, alpha:1) + public static let colorCoreTeal600 = UIColor(red: 0.000, green: 0.663, blue: 0.612, alpha:1) + public static let colorCoreTeal700 = UIColor(red: 0.043, green: 0.588, blue: 0.561, alpha:1) + public static let colorCoreTeal800 = UIColor(red: 0.024, green: 0.486, blue: 0.486, alpha:1) + public static let colorCoreTeal900 = UIColor(red: 0.008, green: 0.400, blue: 0.380, alpha:1) + public static let colorCoreTeal1000 = UIColor(red: 0.031, green: 0.247, blue: 0.247, alpha:1) + public static let colorCoreTeal1100 = UIColor(red: 0.000, green: 0.145, blue: 0.157, alpha:1) public static let colorCoreAqua0 = UIColor(red: 0.851, green: 0.988, blue: 0.984, alpha:1) public static let colorCoreAqua100 = UIColor(red: 0.773, green: 0.976, blue: 0.976, alpha:1) - public static let colorCoreAqua1000 = UIColor(red: 0.031, green: 0.239, blue: 0.310, alpha:1) - public static let colorCoreAqua1100 = UIColor(red: 0.000, green: 0.157, blue: 0.220, alpha:1) public static let colorCoreAqua200 = UIColor(red: 0.647, green: 0.949, blue: 0.949, alpha:1) public static let colorCoreAqua300 = UIColor(red: 0.463, green: 0.898, blue: 0.886, alpha:1) public static let colorCoreAqua400 = UIColor(red: 0.200, green: 0.839, blue: 0.886, alpha:1) @@ -215,10 +226,10 @@ public class StyleDictionary { public static let colorCoreAqua700 = UIColor(red: 0.043, green: 0.522, blue: 0.600, alpha:1) public static let colorCoreAqua800 = UIColor(red: 0.059, green: 0.431, blue: 0.518, alpha:1) public static let colorCoreAqua900 = UIColor(red: 0.012, green: 0.369, blue: 0.451, alpha:1) + public static let colorCoreAqua1000 = UIColor(red: 0.031, green: 0.239, blue: 0.310, alpha:1) + public static let colorCoreAqua1100 = UIColor(red: 0.000, green: 0.157, blue: 0.220, alpha:1) public static let colorCoreBlue0 = UIColor(red: 0.914, green: 0.973, blue: 1.000, alpha:1) public static let colorCoreBlue100 = UIColor(red: 0.863, green: 0.949, blue: 1.000, alpha:1) - public static let colorCoreBlue1000 = UIColor(red: 0.039, green: 0.224, blue: 0.376, alpha:1) - public static let colorCoreBlue1100 = UIColor(red: 0.000, green: 0.129, blue: 0.220, alpha:1) public static let colorCoreBlue200 = UIColor(red: 0.780, green: 0.894, blue: 0.976, alpha:1) public static let colorCoreBlue300 = UIColor(red: 0.631, green: 0.824, blue: 0.973, alpha:1) public static let colorCoreBlue400 = UIColor(red: 0.337, green: 0.678, blue: 0.961, alpha:1) @@ -227,22 +238,22 @@ public class StyleDictionary { public static let colorCoreBlue700 = UIColor(red: 0.125, green: 0.475, blue: 0.765, alpha:1) public static let colorCoreBlue800 = UIColor(red: 0.067, green: 0.427, blue: 0.667, alpha:1) public static let colorCoreBlue900 = UIColor(red: 0.047, green: 0.337, blue: 0.537, alpha:1) - public static let colorCoreGreen0 = UIColor(red: 0.922, green: 0.976, blue: 0.922, alpha:1) - public static let colorCoreGreen100 = UIColor(red: 0.843, green: 0.957, blue: 0.843, alpha:1) - public static let colorCoreGreen1000 = UIColor(red: 0.031, green: 0.259, blue: 0.184, alpha:1) - public static let colorCoreGreen1100 = UIColor(red: 0.000, green: 0.169, blue: 0.125, alpha:1) - public static let colorCoreGreen200 = UIColor(red: 0.761, green: 0.949, blue: 0.741, alpha:1) - public static let colorCoreGreen300 = UIColor(red: 0.596, green: 0.898, blue: 0.557, alpha:1) - public static let colorCoreGreen400 = UIColor(red: 0.459, green: 0.867, blue: 0.400, alpha:1) - public static let colorCoreGreen500 = UIColor(red: 0.349, green: 0.796, blue: 0.349, alpha:1) - public static let colorCoreGreen600 = UIColor(red: 0.169, green: 0.714, blue: 0.337, alpha:1) - public static let colorCoreGreen700 = UIColor(red: 0.047, green: 0.655, blue: 0.314, alpha:1) - public static let colorCoreGreen800 = UIColor(red: 0.000, green: 0.545, blue: 0.275, alpha:1) - public static let colorCoreGreen900 = UIColor(red: 0.000, green: 0.420, blue: 0.251, alpha:1) + public static let colorCoreBlue1000 = UIColor(red: 0.039, green: 0.224, blue: 0.376, alpha:1) + public static let colorCoreBlue1100 = UIColor(red: 0.000, green: 0.129, blue: 0.220, alpha:1) + public static let colorCorePurple0 = UIColor(red: 0.949, green: 0.949, blue: 0.976, alpha:1) + public static let colorCorePurple100 = UIColor(red: 0.918, green: 0.918, blue: 0.976, alpha:1) + public static let colorCorePurple200 = UIColor(red: 0.847, green: 0.843, blue: 0.976, alpha:1) + public static let colorCorePurple300 = UIColor(red: 0.757, green: 0.757, blue: 0.969, alpha:1) + public static let colorCorePurple400 = UIColor(red: 0.631, green: 0.576, blue: 0.949, alpha:1) + public static let colorCorePurple500 = UIColor(red: 0.569, green: 0.502, blue: 0.957, alpha:1) + public static let colorCorePurple600 = UIColor(red: 0.506, green: 0.435, blue: 0.918, alpha:1) + public static let colorCorePurple700 = UIColor(red: 0.435, green: 0.369, blue: 0.827, alpha:1) + public static let colorCorePurple800 = UIColor(red: 0.369, green: 0.306, blue: 0.729, alpha:1) + public static let colorCorePurple900 = UIColor(red: 0.282, green: 0.227, blue: 0.612, alpha:1) + public static let colorCorePurple1000 = UIColor(red: 0.176, green: 0.141, blue: 0.420, alpha:1) + public static let colorCorePurple1100 = UIColor(red: 0.114, green: 0.114, blue: 0.220, alpha:1) public static let colorCoreMagenta0 = UIColor(red: 0.996, green: 0.941, blue: 1.000, alpha:1) public static let colorCoreMagenta100 = UIColor(red: 0.976, green: 0.890, blue: 0.988, alpha:1) - public static let colorCoreMagenta1000 = UIColor(red: 0.271, green: 0.082, blue: 0.318, alpha:1) - public static let colorCoreMagenta1100 = UIColor(red: 0.161, green: 0.098, blue: 0.176, alpha:1) public static let colorCoreMagenta200 = UIColor(red: 0.957, green: 0.769, blue: 0.969, alpha:1) public static let colorCoreMagenta300 = UIColor(red: 0.929, green: 0.678, blue: 0.949, alpha:1) public static let colorCoreMagenta400 = UIColor(red: 0.949, green: 0.510, blue: 0.961, alpha:1) @@ -251,34 +262,10 @@ public class StyleDictionary { public static let colorCoreMagenta700 = UIColor(red: 0.675, green: 0.267, blue: 0.659, alpha:1) public static let colorCoreMagenta800 = UIColor(red: 0.561, green: 0.220, blue: 0.588, alpha:1) public static let colorCoreMagenta900 = UIColor(red: 0.424, green: 0.133, blue: 0.467, alpha:1) - public static let colorCoreNeutral0 = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha:1) - public static let colorCoreNeutral100 = UIColor(red: 0.953, green: 0.957, blue: 0.957, alpha:1) - public static let colorCoreNeutral1000 = UIColor(red: 0.086, green: 0.125, blue: 0.125, alpha:1) - public static let colorCoreNeutral1100 = UIColor(red: 0.016, green: 0.016, blue: 0.016, alpha:1) - public static let colorCoreNeutral200 = UIColor(red: 0.871, green: 0.882, blue: 0.882, alpha:1) - public static let colorCoreNeutral300 = UIColor(red: 0.784, green: 0.800, blue: 0.800, alpha:1) - public static let colorCoreNeutral400 = UIColor(red: 0.690, green: 0.714, blue: 0.718, alpha:1) - public static let colorCoreNeutral500 = UIColor(red: 0.573, green: 0.604, blue: 0.608, alpha:1) - public static let colorCoreNeutral600 = UIColor(red: 0.431, green: 0.475, blue: 0.478, alpha:1) - public static let colorCoreNeutral700 = UIColor(red: 0.318, green: 0.369, blue: 0.373, alpha:1) - public static let colorCoreNeutral800 = UIColor(red: 0.212, green: 0.255, blue: 0.255, alpha:1) - public static let colorCoreNeutral900 = UIColor(red: 0.153, green: 0.200, blue: 0.200, alpha:1) - public static let colorCoreOrange0 = UIColor(red: 1.000, green: 0.929, blue: 0.890, alpha:1) - public static let colorCoreOrange100 = UIColor(red: 0.988, green: 0.863, blue: 0.800, alpha:1) - public static let colorCoreOrange1000 = UIColor(red: 0.376, green: 0.090, blue: 0.000, alpha:1) - public static let colorCoreOrange1100 = UIColor(red: 0.176, green: 0.075, blue: 0.055, alpha:1) - public static let colorCoreOrange200 = UIColor(red: 1.000, green: 0.776, blue: 0.643, alpha:1) - public static let colorCoreOrange300 = UIColor(red: 1.000, green: 0.694, blue: 0.502, alpha:1) - public static let colorCoreOrange400 = UIColor(red: 1.000, green: 0.612, blue: 0.365, alpha:1) - public static let colorCoreOrange500 = UIColor(red: 0.988, green: 0.537, blue: 0.263, alpha:1) - public static let colorCoreOrange600 = UIColor(red: 0.961, green: 0.490, blue: 0.200, alpha:1) - public static let colorCoreOrange700 = UIColor(red: 0.929, green: 0.439, blue: 0.141, alpha:1) - public static let colorCoreOrange800 = UIColor(red: 0.808, green: 0.333, blue: 0.067, alpha:1) - public static let colorCoreOrange900 = UIColor(red: 0.588, green: 0.173, blue: 0.043, alpha:1) + public static let colorCoreMagenta1000 = UIColor(red: 0.271, green: 0.082, blue: 0.318, alpha:1) + public static let colorCoreMagenta1100 = UIColor(red: 0.161, green: 0.098, blue: 0.176, alpha:1) public static let colorCorePink0 = UIColor(red: 1.000, green: 0.914, blue: 0.953, alpha:1) public static let colorCorePink100 = UIColor(red: 0.988, green: 0.859, blue: 0.922, alpha:1) - public static let colorCorePink1000 = UIColor(red: 0.337, green: 0.071, blue: 0.192, alpha:1) - public static let colorCorePink1100 = UIColor(red: 0.169, green: 0.090, blue: 0.129, alpha:1) public static let colorCorePink200 = UIColor(red: 1.000, green: 0.710, blue: 0.835, alpha:1) public static let colorCorePink300 = UIColor(red: 1.000, green: 0.584, blue: 0.757, alpha:1) public static let colorCorePink400 = UIColor(red: 1.000, green: 0.463, blue: 0.682, alpha:1) @@ -287,22 +274,10 @@ public class StyleDictionary { public static let colorCorePink700 = UIColor(red: 0.808, green: 0.212, blue: 0.396, alpha:1) public static let colorCorePink800 = UIColor(red: 0.698, green: 0.184, blue: 0.357, alpha:1) public static let colorCorePink900 = UIColor(red: 0.576, green: 0.094, blue: 0.278, alpha:1) - public static let colorCorePurple0 = UIColor(red: 0.949, green: 0.949, blue: 0.976, alpha:1) - public static let colorCorePurple100 = UIColor(red: 0.918, green: 0.918, blue: 0.976, alpha:1) - public static let colorCorePurple1000 = UIColor(red: 0.176, green: 0.141, blue: 0.420, alpha:1) - public static let colorCorePurple1100 = UIColor(red: 0.114, green: 0.114, blue: 0.220, alpha:1) - public static let colorCorePurple200 = UIColor(red: 0.847, green: 0.843, blue: 0.976, alpha:1) - public static let colorCorePurple300 = UIColor(red: 0.757, green: 0.757, blue: 0.969, alpha:1) - public static let colorCorePurple400 = UIColor(red: 0.631, green: 0.576, blue: 0.949, alpha:1) - public static let colorCorePurple500 = UIColor(red: 0.569, green: 0.502, blue: 0.957, alpha:1) - public static let colorCorePurple600 = UIColor(red: 0.506, green: 0.435, blue: 0.918, alpha:1) - public static let colorCorePurple700 = UIColor(red: 0.435, green: 0.369, blue: 0.827, alpha:1) - public static let colorCorePurple800 = UIColor(red: 0.369, green: 0.306, blue: 0.729, alpha:1) - public static let colorCorePurple900 = UIColor(red: 0.282, green: 0.227, blue: 0.612, alpha:1) + public static let colorCorePink1000 = UIColor(red: 0.337, green: 0.071, blue: 0.192, alpha:1) + public static let colorCorePink1100 = UIColor(red: 0.169, green: 0.090, blue: 0.129, alpha:1) public static let colorCoreRed0 = UIColor(red: 1.000, green: 0.918, blue: 0.914, alpha:1) public static let colorCoreRed100 = UIColor(red: 1.000, green: 0.835, blue: 0.824, alpha:1) - public static let colorCoreRed1000 = UIColor(red: 0.427, green: 0.075, blue: 0.075, alpha:1) - public static let colorCoreRed1100 = UIColor(red: 0.169, green: 0.067, blue: 0.067, alpha:1) public static let colorCoreRed200 = UIColor(red: 1.000, green: 0.722, blue: 0.694, alpha:1) public static let colorCoreRed300 = UIColor(red: 1.000, green: 0.612, blue: 0.561, alpha:1) public static let colorCoreRed400 = UIColor(red: 1.000, green: 0.498, blue: 0.431, alpha:1) @@ -311,22 +286,34 @@ public class StyleDictionary { public static let colorCoreRed700 = UIColor(red: 0.859, green: 0.243, blue: 0.243, alpha:1) public static let colorCoreRed800 = UIColor(red: 0.776, green: 0.204, blue: 0.204, alpha:1) public static let colorCoreRed900 = UIColor(red: 0.600, green: 0.133, blue: 0.133, alpha:1) - public static let colorCoreTeal0 = UIColor(red: 0.898, green: 0.976, blue: 0.961, alpha:1) - public static let colorCoreTeal100 = UIColor(red: 0.804, green: 0.969, blue: 0.937, alpha:1) - public static let colorCoreTeal1000 = UIColor(red: 0.031, green: 0.247, blue: 0.247, alpha:1) - public static let colorCoreTeal1100 = UIColor(red: 0.000, green: 0.145, blue: 0.157, alpha:1) - public static let colorCoreTeal200 = UIColor(red: 0.702, green: 0.949, blue: 0.902, alpha:1) - public static let colorCoreTeal300 = UIColor(red: 0.490, green: 0.918, blue: 0.835, alpha:1) - public static let colorCoreTeal400 = UIColor(red: 0.141, green: 0.878, blue: 0.773, alpha:1) - public static let colorCoreTeal500 = UIColor(red: 0.031, green: 0.769, blue: 0.698, alpha:1) - public static let colorCoreTeal600 = UIColor(red: 0.000, green: 0.663, blue: 0.612, alpha:1) - public static let colorCoreTeal700 = UIColor(red: 0.043, green: 0.588, blue: 0.561, alpha:1) - public static let colorCoreTeal800 = UIColor(red: 0.024, green: 0.486, blue: 0.486, alpha:1) - public static let colorCoreTeal900 = UIColor(red: 0.008, green: 0.400, blue: 0.380, alpha:1) + public static let colorCoreRed1000 = UIColor(red: 0.427, green: 0.075, blue: 0.075, alpha:1) + public static let colorCoreRed1100 = UIColor(red: 0.169, green: 0.067, blue: 0.067, alpha:1) + public static let colorCoreOrange0 = UIColor(red: 1.000, green: 0.929, blue: 0.890, alpha:1) + public static let colorCoreOrange100 = UIColor(red: 0.988, green: 0.863, blue: 0.800, alpha:1) + public static let colorCoreOrange200 = UIColor(red: 1.000, green: 0.776, blue: 0.643, alpha:1) + public static let colorCoreOrange300 = UIColor(red: 1.000, green: 0.694, blue: 0.502, alpha:1) + public static let colorCoreOrange400 = UIColor(red: 1.000, green: 0.612, blue: 0.365, alpha:1) + public static let colorCoreOrange500 = UIColor(red: 0.988, green: 0.537, blue: 0.263, alpha:1) + public static let colorCoreOrange600 = UIColor(red: 0.961, green: 0.490, blue: 0.200, alpha:1) + public static let colorCoreOrange700 = UIColor(red: 0.929, green: 0.439, blue: 0.141, alpha:1) + public static let colorCoreOrange800 = UIColor(red: 0.808, green: 0.333, blue: 0.067, alpha:1) + public static let colorCoreOrange900 = UIColor(red: 0.588, green: 0.173, blue: 0.043, alpha:1) + public static let colorCoreOrange1000 = UIColor(red: 0.376, green: 0.090, blue: 0.000, alpha:1) + public static let colorCoreOrange1100 = UIColor(red: 0.176, green: 0.075, blue: 0.055, alpha:1) + public static let colorCoreNeutral0 = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha:1) + public static let colorCoreNeutral100 = UIColor(red: 0.953, green: 0.957, blue: 0.957, alpha:1) + public static let colorCoreNeutral200 = UIColor(red: 0.871, green: 0.882, blue: 0.882, alpha:1) + public static let colorCoreNeutral300 = UIColor(red: 0.784, green: 0.800, blue: 0.800, alpha:1) + public static let colorCoreNeutral400 = UIColor(red: 0.690, green: 0.714, blue: 0.718, alpha:1) + public static let colorCoreNeutral500 = UIColor(red: 0.573, green: 0.604, blue: 0.608, alpha:1) + public static let colorCoreNeutral600 = UIColor(red: 0.431, green: 0.475, blue: 0.478, alpha:1) + public static let colorCoreNeutral700 = UIColor(red: 0.318, green: 0.369, blue: 0.373, alpha:1) + public static let colorCoreNeutral800 = UIColor(red: 0.212, green: 0.255, blue: 0.255, alpha:1) + public static let colorCoreNeutral900 = UIColor(red: 0.153, green: 0.200, blue: 0.200, alpha:1) + public static let colorCoreNeutral1000 = UIColor(red: 0.086, green: 0.125, blue: 0.125, alpha:1) + public static let colorCoreNeutral1100 = UIColor(red: 0.016, green: 0.016, blue: 0.016, alpha:1) public static let colorCoreYellow0 = UIColor(red: 1.000, green: 0.973, blue: 0.886, alpha:1) public static let colorCoreYellow100 = UIColor(red: 0.992, green: 0.937, blue: 0.804, alpha:1) - public static let colorCoreYellow1000 = UIColor(red: 0.329, green: 0.165, blue: 0.000, alpha:1) - public static let colorCoreYellow1100 = UIColor(red: 0.176, green: 0.102, blue: 0.020, alpha:1) public static let colorCoreYellow200 = UIColor(red: 1.000, green: 0.914, blue: 0.604, alpha:1) public static let colorCoreYellow300 = UIColor(red: 1.000, green: 0.882, blue: 0.431, alpha:1) public static let colorCoreYellow400 = UIColor(red: 1.000, green: 0.851, blue: 0.263, alpha:1) @@ -335,25 +322,38 @@ public class StyleDictionary { public static let colorCoreYellow700 = UIColor(red: 0.867, green: 0.600, blue: 0.012, alpha:1) public static let colorCoreYellow800 = UIColor(red: 0.729, green: 0.459, blue: 0.024, alpha:1) public static let colorCoreYellow900 = UIColor(red: 0.580, green: 0.298, blue: 0.047, alpha:1) - public static let colorFontDanger = colorCoreRed1000 - public static let colorFontInteractive = colorBrandPrimary - public static let colorFontInteractiveActive = colorBrandSecondary - public static let colorFontInteractiveDisabled = colorFontTertiary - public static let colorFontInteractiveHover = colorBrandPrimary - public static let colorFontPrimary = colorCoreNeutral1100 - public static let colorFontSecondary = colorCoreNeutral900 - public static let colorFontSuccess = colorCoreGreen1000 - public static let colorFontTertiary = colorCoreNeutral800 - public static let colorFontWarning = colorCoreOrange1000 + public static let colorCoreYellow1000 = UIColor(red: 0.329, green: 0.165, blue: 0.000, alpha:1) + public static let colorCoreYellow1100 = UIColor(red: 0.176, green: 0.102, blue: 0.020, alpha:1) public static let sizeBorderRadiusLarge = CGFloat(480.00) - public static let sizeFontLarge = CGFloat(24.00) - public static let sizeFontMedium = CGFloat(16.00) public static let sizeFontSmall = CGFloat(12.00) + public static let sizeFontMedium = CGFloat(16.00) + public static let sizeFontLarge = CGFloat(24.00) public static let sizeFontXl = CGFloat(36.00) - public static let sizePaddingLarge = CGFloat(16.00) - public static let sizePaddingMedium = CGFloat(16.00) public static let sizePaddingSmall = CGFloat(8.00) + public static let sizePaddingMedium = CGFloat(16.00) + public static let sizePaddingLarge = CGFloat(16.00) public static let sizePaddingXl = CGFloat(16.00) + public static let colorBackgroundPrimary = colorCoreNeutral0 + public static let colorBackgroundSecondary = colorCoreNeutral100 + public static let colorBackgroundTertiary = colorCoreNeutral200 + public static let colorBackgroundDanger = colorCoreRed0 + public static let colorBackgroundWarning = colorCoreOrange0 + public static let colorBackgroundSuccess = colorCoreGreen0 + public static let colorBackgroundInfo = colorCoreBlue0 + public static let colorBorderPrimary = colorCoreNeutral300 + public static let colorBrandPrimary = colorCoreAqua700 + public static let colorBrandSecondary = colorCorePurple700 + public static let colorFontPrimary = colorCoreNeutral1100 + public static let colorFontSecondary = colorCoreNeutral900 + public static let colorFontTertiary = colorCoreNeutral800 + public static let colorFontDanger = colorCoreRed1000 + public static let colorFontWarning = colorCoreOrange1000 + public static let colorFontSuccess = colorCoreGreen1000 + public static let colorBackgroundDisabled = colorBackgroundTertiary + public static let colorFontInteractive = colorBrandPrimary + public static let colorFontInteractiveHover = colorBrandPrimary + public static let colorFontInteractiveActive = colorBrandSecondary + public static let colorFontInteractiveDisabled = colorFontTertiary } " `; diff --git a/lib/common/formatHelpers.js b/lib/common/formatHelpers.js index 72377d15e..3f5547d40 100644 --- a/lib/common/formatHelpers.js +++ b/lib/common/formatHelpers.js @@ -82,6 +82,56 @@ function fileHeader(file, commentStyle) { .join('\n')}${commentFooter}`; } +/** + * A function that returns a sorting function to be used with Array.sort that + * will sort the allProperties array based on references. This is to make sure + * if you use output references that you never use a reference before it is + * defined. + * + * @example + * ```javascript + * dictionary.allProperties.sort(sortAllProperties(dictionary)) + * ``` + * @param {Dictionary} dictionary + * @returns function + */ + function sortAllProperties(dictionary) { + // The sorter function is recursive to account for multiple levels of nesting + function sorter(a, b) { + const aComesFirst = -1; + const bComesFirst = 1; + + // If token a uses a reference and token b doesn't, b might come before a + // read on.. + if (dictionary.usesReference(a.original.value)) { + // Both a and b have references, we need to see if the reference each other + if (dictionary.usesReference(b.original.value)) { + const aRef = dictionary.getReference(a.original.value); + const bRef = dictionary.getReference(b.original.value); + // a references b, we want b to come first + if (aRef.name === b.name) { + return bComesFirst; + } + // ditto but opposite + if (bRef.name === a.name) { + return aComesFirst; + } + // both a and b have references and don't reference each other + // we go further down the rabbit hole (reference chain) + return sorter(aRef, bRef); + // a has a reference and b does not: + } else { + return bComesFirst; + } + // a does not have a reference it should come first regardless if b has one + } else { + return aComesFirst; + } + } + + return sorter; +} + /** * * This is used to create lists of variables like Sass variables or CSS custom properties @@ -129,7 +179,19 @@ function formattedVariables(format, dictionary, outputReferences = false) { break; } - return dictionary.allProperties + let {allProperties} = dictionary; + + // Some languages are imperative, meaning a variable has to be defined + // before it is used. If `outputReferences` is true, check if the token + // has a reference, and if it does send it to the end of the array. + // We also need to account for nested references, a -> b -> c. They + // need to be defined in reverse order: c, b, a so that the reference always + // comes after the definition + if (outputReferences) { + allProperties = allProperties.sort(sortAllProperties(dictionary)); + } + + return allProperties // Some languages are imperative, meaning a variable has to be defined // before it is used. If `outputReferences` is true, check if the token // has a reference, and if it does send it to the end of the array. @@ -252,4 +314,5 @@ module.exports = { fileHeader, formattedVariables, iconsWithPrefix, + sortAllProperties } \ No newline at end of file diff --git a/lib/common/formats.js b/lib/common/formats.js index 52dfe43b4..fbd825e4f 100644 --- a/lib/common/formats.js +++ b/lib/common/formats.js @@ -14,7 +14,7 @@ var fs = require('fs'), _ = require('lodash'), GroupMessages = require('../utils/groupMessages'), - { fileHeader, formattedVariables, iconsWithPrefix, minifyDictionary } = require('./formatHelpers'); + { fileHeader, formattedVariables, iconsWithPrefix, minifyDictionary, sortAllProperties } = require('./formatHelpers'); var SASS_MAP_FORMAT_DEPRECATION_WARNINGS = GroupMessages.GROUP.SassMapFormatDeprecationWarnings; @@ -673,7 +673,7 @@ module.exports = { const template = _.template( fs.readFileSync(__dirname + '/templates/ios-swift/class.swift.template') ); - return template({dictionary, file, options}); + return template({dictionary, file, options, sortAllProperties}); }, /** @@ -683,9 +683,12 @@ module.exports = { * @kind member * @todo Add example and usage */ - 'ios-swift/enum.swift': _.template( - fs.readFileSync(__dirname + '/templates/ios-swift/enum.swift.template') - ), + 'ios-swift/enum.swift': function({dictionary, options, file}) { + const template = _.template( + fs.readFileSync(__dirname + '/templates/ios-swift/enum.swift.template') + ); + return template({dictionary, file, options, sortAllProperties}); + }, // Css templates /** diff --git a/lib/common/templates/ios-swift/class.swift.template b/lib/common/templates/ios-swift/class.swift.template index fc8104a5c..f7afe969b 100644 --- a/lib/common/templates/ios-swift/class.swift.template +++ b/lib/common/templates/ios-swift/class.swift.template @@ -33,15 +33,10 @@ } %> // -<% - // Filter to only those props wanted based on the filter, then sort - // them by category to keep like props together, then by name - // to make them easier to find alphabetically. - var props = _.sortBy(dictionary.allProperties, item => item.attributes.category + item.name); -%> + import UIKit public class <%= file.className %> { - <%= props.map(function(prop) { return 'public static let ' + prop.name + ' = ' + propToValue(prop); }).join('\n ') %> + <%= dictionary.allProperties.sort(sortAllProperties(dictionary)).map(function(prop) { return 'public static let ' + prop.name + ' = ' + propToValue(prop); }).join('\n ') %> } diff --git a/lib/common/templates/ios-swift/enum.swift.template b/lib/common/templates/ios-swift/enum.swift.template index d4d9c658f..a399dd2f8 100644 --- a/lib/common/templates/ios-swift/enum.swift.template +++ b/lib/common/templates/ios-swift/enum.swift.template @@ -14,25 +14,28 @@ // permissions and limitations under the License. %> // -// <%= this.destination %> +// <%= file.destination %> // <% // for backward compatibility we need to have the user explicitly hide it - var showFileHeader = (this.options && this.options.hasOwnProperty('showFileHeader')) ? this.options.showFileHeader : true; + var showFileHeader = (file.options && file.options.hasOwnProperty('showFileHeader')) ? file.options.showFileHeader : true; if(showFileHeader) { print("// Do not edit directly\n"); print("// Generated on " + new Date().toUTCString()); } + + function propToValue(prop) { + if (file.options && file.options.outputReferences && dictionary.usesReference(prop.original.value)) { + return dictionary.getReference(prop.original.value).name; + } else { + return prop.value; + } + } %> // -<% - // Filter to only those props wanted based on the filter, then sort - // them by category to we keep like props together, then by name - // to make them easier to find alphabetically. - var props = _.sortBy(allProperties, item => item.attributes.category + item.name); -%> + import UIKit -public enum <%= this.className %> { - <%= props.map(function(prop) { return 'public static let ' + prop.name + ' = ' + prop.value; }).join('\n ') %> +public enum <%= file.className %> { + <%= dictionary.allProperties.sort(sortAllProperties).map(function(prop) { return 'public static let ' + prop.name + ' = ' + propToValue(prop); }).join('\n ') %> }