@alfalab/core-components 42.0.0-beta.0 → 42.0.0-beta.1

package/typography/component.js

@@ -7,9 +7,9 @@ var titleResponsive_component = require('./title-responsive/component.js');
 require('tslib');
 require('react');
 require('classnames');
-require('./colors.module-b096a744.js');
+require('./colors.module-0cd8388d.js');
 require('./title/component.js');
-require('./common.module-58467946.js');
+require('./common.module-c49b349a.js');
 
 var Typography = {
     Title: title_index.Title,

package/typography/esm/component.js

@@ -5,9 +5,9 @@ import { TitleResponsive } from './title-responsive/component.js';
 import 'tslib';
 import 'react';
 import 'classnames';
-import './colors.module-20ef4917.js';
+import './colors.module-ef8af906.js';
 import './title/component.js';
-import './common.module-829f0d25.js';
+import './common.module-f0cc487d.js';
 
 var Typography = {
     Title: Title,

package/typography/esm/index.js

@@ -4,9 +4,9 @@ import './text/component.js';
 import 'tslib';
 import 'react';
 import 'classnames';
-import './colors.module-20ef4917.js';
+import './colors.module-ef8af906.js';
 import './title/index.js';
 import './title/component.js';
-import './common.module-829f0d25.js';
+import './common.module-f0cc487d.js';
 import './title-mobile/component.js';
 import './title-responsive/component.js';

package/typography/esm/text/component.js

@@ -1,7 +1,7 @@
 import { __rest, __assign } from 'tslib';
 import React, { forwardRef } from 'react';
 import cn from 'classnames';
-import { c as colors } from '../colors.module-20ef4917.js';
+import { c as colors } from '../colors.module-ef8af906.js';
 
 var styles = {"paragraph":"typography__paragraph_en5sb","paragraphWithMargins":"typography__paragraphWithMargins_en5sb","primary-large":"typography__primary-large_en5sb","primary-medium":"typography__primary-medium_en5sb","primary-small":"typography__primary-small_en5sb","secondary-large":"typography__secondary-large_en5sb","secondary-medium":"typography__secondary-medium_en5sb","secondary-small":"typography__secondary-small_en5sb","component":"typography__component_en5sb","caps":"typography__caps_en5sb","bold":"typography__bold_en5sb","medium":"typography__medium_en5sb","regular":"typography__regular_en5sb","monospace":"typography__monospace_en5sb","rowLimit1":"typography__rowLimit1_en5sb","rowLimit2":"typography__rowLimit2_en5sb","rowLimit3":"typography__rowLimit3_en5sb"};
 require('./index.css');

package/typography/esm/text/index.js

@@ -2,4 +2,4 @@ export { Text } from './component.js';
 import 'tslib';
 import 'react';
 import 'classnames';
-import '../colors.module-20ef4917.js';
+import '../colors.module-ef8af906.js';

package/typography/esm/title/component.js

@@ -1,7 +1,7 @@
 import { __rest, __assign } from 'tslib';
 import React, { forwardRef } from 'react';
 import cn from 'classnames';
-import { c as colors } from '../colors.module-20ef4917.js';
+import { c as colors } from '../colors.module-ef8af906.js';
 
 var Title = forwardRef(function (_a, ref) {
     var _b;

package/typography/esm/title/index.js

@@ -1,9 +1,9 @@
 import { __assign } from 'tslib';
 import React from 'react';
 import { Title as Title$1 } from './component.js';
-import { c as commonStyles } from '../common.module-829f0d25.js';
+import { c as commonStyles } from '../common.module-f0cc487d.js';
 import 'classnames';
-import '../colors.module-20ef4917.js';
+import '../colors.module-ef8af906.js';
 
 var styles = {"styrene-xlarge":"typography__styrene-xlarge_jurz3","styrene-large":"typography__styrene-large_jurz3","styrene-medium":"typography__styrene-medium_jurz3","styrene-small":"typography__styrene-small_jurz3","styrene-xsmall":"typography__styrene-xsmall_jurz3","system-xlarge":"typography__system-xlarge_jurz3","system-large":"typography__system-large_jurz3","system-medium":"typography__system-medium_jurz3","system-small":"typography__system-small_jurz3","system-xsmall":"typography__system-xsmall_jurz3","margins-xlarge":"typography__margins-xlarge_jurz3","margins-large":"typography__margins-large_jurz3","margins-medium":"typography__margins-medium_jurz3","margins-small":"typography__margins-small_jurz3","margins-xsmall":"typography__margins-xsmall_jurz3","rowLimit1":"typography__rowLimit1_jurz3","rowLimit2":"typography__rowLimit2_jurz3","rowLimit3":"typography__rowLimit3_jurz3"};
 require('./index.css');

package/typography/esm/title-mobile/component.js

@@ -1,9 +1,9 @@
 import { __assign } from 'tslib';
 import React from 'react';
 import { Title } from '../title/component.js';
-import { c as commonStyles } from '../common.module-829f0d25.js';
+import { c as commonStyles } from '../common.module-f0cc487d.js';
 import 'classnames';
-import '../colors.module-20ef4917.js';
+import '../colors.module-ef8af906.js';
 
 var styles = {"styrene-xlarge":"typography__styrene-xlarge_1576f","styrene-large":"typography__styrene-large_1576f","styrene-medium":"typography__styrene-medium_1576f","styrene-small":"typography__styrene-small_1576f","styrene-xsmall":"typography__styrene-xsmall_1576f","system-xlarge":"typography__system-xlarge_1576f","system-large":"typography__system-large_1576f","system-medium":"typography__system-medium_1576f","system-small":"typography__system-small_1576f","system-xsmall":"typography__system-xsmall_1576f"};
 require('./index.css');

package/typography/esm/title-mobile/index.js

@@ -3,5 +3,5 @@ import 'tslib';
 import 'react';
 import '../title/component.js';
 import 'classnames';
-import '../colors.module-20ef4917.js';
-import '../common.module-829f0d25.js';
+import '../colors.module-ef8af906.js';
+import '../common.module-f0cc487d.js';

package/typography/esm/title-responsive/component.js

@@ -1,9 +1,9 @@
 import { __assign } from 'tslib';
 import React from 'react';
 import { Title } from '../title/component.js';
-import { c as commonStyles } from '../common.module-829f0d25.js';
+import { c as commonStyles } from '../common.module-f0cc487d.js';
 import 'classnames';
-import '../colors.module-20ef4917.js';
+import '../colors.module-ef8af906.js';
 
 var styles = {"styrene-xlarge":"typography__styrene-xlarge_o64gq","styrene-large":"typography__styrene-large_o64gq","styrene-medium":"typography__styrene-medium_o64gq","styrene-small":"typography__styrene-small_o64gq","styrene-xsmall":"typography__styrene-xsmall_o64gq","system-xlarge":"typography__system-xlarge_o64gq","system-large":"typography__system-large_o64gq","system-medium":"typography__system-medium_o64gq","system-small":"typography__system-small_o64gq","system-xsmall":"typography__system-xsmall_o64gq","margins-xlarge":"typography__margins-xlarge_o64gq","margins-large":"typography__margins-large_o64gq","margins-medium":"typography__margins-medium_o64gq","margins-small":"typography__margins-small_o64gq","margins-xsmall":"typography__margins-xsmall_o64gq"};
 require('./index.css');

package/typography/esm/title-responsive/index.js

@@ -3,5 +3,5 @@ import 'tslib';
 import 'react';
 import '../title/component.js';
 import 'classnames';
-import '../colors.module-20ef4917.js';
-import '../common.module-829f0d25.js';
+import '../colors.module-ef8af906.js';
+import '../common.module-f0cc487d.js';

package/typography/index.js

@@ -6,10 +6,10 @@ require('./text/component.js');
 require('tslib');
 require('react');
 require('classnames');
-require('./colors.module-b096a744.js');
+require('./colors.module-0cd8388d.js');
 require('./title/index.js');
 require('./title/component.js');
-require('./common.module-58467946.js');
+require('./common.module-c49b349a.js');
 require('./title-mobile/component.js');
 require('./title-responsive/component.js');
 

package/typography/modern/component.js

@@ -4,9 +4,9 @@ import { TitleMobile } from './title-mobile/component.js';
 import { TitleResponsive } from './title-responsive/component.js';
 import 'react';
 import 'classnames';
-import './colors.module-44fef2b4.js';
+import './colors.module-1a69681e.js';
 import './title/component.js';
-import './common.module-04cc1105.js';
+import './common.module-188d2f6a.js';
 
 const Typography = {
     Title,

package/typography/modern/index.js

@@ -3,9 +3,9 @@ export { typographyPresets } from './presets.js';
 import './text/component.js';
 import 'react';
 import 'classnames';
-import './colors.module-44fef2b4.js';
+import './colors.module-1a69681e.js';
 import './title/index.js';
 import './title/component.js';
-import './common.module-04cc1105.js';
+import './common.module-188d2f6a.js';
 import './title-mobile/component.js';
 import './title-responsive/component.js';

package/typography/modern/text/component.js

@@ -1,6 +1,6 @@
 import React, { forwardRef } from 'react';
 import cn from 'classnames';
-import { c as colors } from '../colors.module-44fef2b4.js';
+import { c as colors } from '../colors.module-1a69681e.js';
 
 const styles = {"paragraph":"typography__paragraph_en5sb","paragraphWithMargins":"typography__paragraphWithMargins_en5sb","primary-large":"typography__primary-large_en5sb","primary-medium":"typography__primary-medium_en5sb","primary-small":"typography__primary-small_en5sb","secondary-large":"typography__secondary-large_en5sb","secondary-medium":"typography__secondary-medium_en5sb","secondary-small":"typography__secondary-small_en5sb","component":"typography__component_en5sb","caps":"typography__caps_en5sb","bold":"typography__bold_en5sb","medium":"typography__medium_en5sb","regular":"typography__regular_en5sb","monospace":"typography__monospace_en5sb","rowLimit1":"typography__rowLimit1_en5sb","rowLimit2":"typography__rowLimit2_en5sb","rowLimit3":"typography__rowLimit3_en5sb"};
 require('./index.css');

package/typography/modern/text/index.js

@@ -1,4 +1,4 @@
 export { Text } from './component.js';
 import 'react';
 import 'classnames';
-import '../colors.module-44fef2b4.js';
+import '../colors.module-1a69681e.js';

package/typography/modern/title/component.js

@@ -1,6 +1,6 @@
 import React, { forwardRef } from 'react';
 import cn from 'classnames';
-import { c as colors } from '../colors.module-44fef2b4.js';
+import { c as colors } from '../colors.module-1a69681e.js';
 
 const Title = forwardRef(({ tag: Component = 'div', view = 'medium', font = 'styrene', weight = font === 'styrene' ? 'medium' : 'bold', defaultMargins = false, color, className, dataTestId, children, rowLimit, styles, ...restProps }, ref) => (React.createElement(Component, { className: cn(styles.component, className, styles[`${font}-${view}`], defaultMargins && styles[`margins-${view}`], styles[weight], color && colors[color], { [styles[`rowLimit${rowLimit}`]]: rowLimit }), "data-test-id": dataTestId, ref: ref, ...restProps }, children)));
 

package/typography/modern/title/index.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { Title as Title$1 } from './component.js';
-import { c as commonStyles } from '../common.module-04cc1105.js';
+import { c as commonStyles } from '../common.module-188d2f6a.js';
 import 'classnames';
-import '../colors.module-44fef2b4.js';
+import '../colors.module-1a69681e.js';
 
 const styles = {"styrene-xlarge":"typography__styrene-xlarge_jurz3","styrene-large":"typography__styrene-large_jurz3","styrene-medium":"typography__styrene-medium_jurz3","styrene-small":"typography__styrene-small_jurz3","styrene-xsmall":"typography__styrene-xsmall_jurz3","system-xlarge":"typography__system-xlarge_jurz3","system-large":"typography__system-large_jurz3","system-medium":"typography__system-medium_jurz3","system-small":"typography__system-small_jurz3","system-xsmall":"typography__system-xsmall_jurz3","margins-xlarge":"typography__margins-xlarge_jurz3","margins-large":"typography__margins-large_jurz3","margins-medium":"typography__margins-medium_jurz3","margins-small":"typography__margins-small_jurz3","margins-xsmall":"typography__margins-xsmall_jurz3","rowLimit1":"typography__rowLimit1_jurz3","rowLimit2":"typography__rowLimit2_jurz3","rowLimit3":"typography__rowLimit3_jurz3"};
 require('./index.css');

package/typography/modern/title-mobile/component.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { Title } from '../title/component.js';
-import { c as commonStyles } from '../common.module-04cc1105.js';
+import { c as commonStyles } from '../common.module-188d2f6a.js';
 import 'classnames';
-import '../colors.module-44fef2b4.js';
+import '../colors.module-1a69681e.js';
 
 const styles = {"styrene-xlarge":"typography__styrene-xlarge_1576f","styrene-large":"typography__styrene-large_1576f","styrene-medium":"typography__styrene-medium_1576f","styrene-small":"typography__styrene-small_1576f","styrene-xsmall":"typography__styrene-xsmall_1576f","system-xlarge":"typography__system-xlarge_1576f","system-large":"typography__system-large_1576f","system-medium":"typography__system-medium_1576f","system-small":"typography__system-small_1576f","system-xsmall":"typography__system-xsmall_1576f"};
 require('./index.css');

package/typography/modern/title-mobile/index.js

@@ -2,5 +2,5 @@ export { TitleMobile } from './component.js';
 import 'react';
 import '../title/component.js';
 import 'classnames';
-import '../colors.module-44fef2b4.js';
-import '../common.module-04cc1105.js';
+import '../colors.module-1a69681e.js';
+import '../common.module-188d2f6a.js';

package/typography/modern/title-responsive/component.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { Title } from '../title/component.js';
-import { c as commonStyles } from '../common.module-04cc1105.js';
+import { c as commonStyles } from '../common.module-188d2f6a.js';
 import 'classnames';
-import '../colors.module-44fef2b4.js';
+import '../colors.module-1a69681e.js';
 
 const styles = {"styrene-xlarge":"typography__styrene-xlarge_o64gq","styrene-large":"typography__styrene-large_o64gq","styrene-medium":"typography__styrene-medium_o64gq","styrene-small":"typography__styrene-small_o64gq","styrene-xsmall":"typography__styrene-xsmall_o64gq","system-xlarge":"typography__system-xlarge_o64gq","system-large":"typography__system-large_o64gq","system-medium":"typography__system-medium_o64gq","system-small":"typography__system-small_o64gq","system-xsmall":"typography__system-xsmall_o64gq","margins-xlarge":"typography__margins-xlarge_o64gq","margins-large":"typography__margins-large_o64gq","margins-medium":"typography__margins-medium_o64gq","margins-small":"typography__margins-small_o64gq","margins-xsmall":"typography__margins-xsmall_o64gq"};
 require('./index.css');

package/typography/modern/title-responsive/index.js

@@ -2,5 +2,5 @@ export { TitleResponsive } from './component.js';
 import 'react';
 import '../title/component.js';
 import 'classnames';
-import '../colors.module-44fef2b4.js';
-import '../common.module-04cc1105.js';
+import '../colors.module-1a69681e.js';
+import '../common.module-188d2f6a.js';

package/typography/text/component.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 var cn = require('classnames');
-var colors_module = require('../colors.module-b096a744.js');
+var colors_module = require('../colors.module-0cd8388d.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/typography/text/index.js

@@ -4,7 +4,7 @@ var text_component = require('./component.js');
 require('tslib');
 require('react');
 require('classnames');
-require('../colors.module-b096a744.js');
+require('../colors.module-0cd8388d.js');
 
 
 

package/typography/title/component.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 var cn = require('classnames');
-var colors_module = require('../colors.module-b096a744.js');
+var colors_module = require('../colors.module-0cd8388d.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/typography/title/index.js

@@ -3,9 +3,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 var title_component = require('./component.js');
-var common_module = require('../common.module-58467946.js');
+var common_module = require('../common.module-c49b349a.js');
 require('classnames');
-require('../colors.module-b096a744.js');
+require('../colors.module-0cd8388d.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/typography/title-mobile/component.js

@@ -3,9 +3,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 var title_component = require('../title/component.js');
-var common_module = require('../common.module-58467946.js');
+var common_module = require('../common.module-c49b349a.js');
 require('classnames');
-require('../colors.module-b096a744.js');
+require('../colors.module-0cd8388d.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/typography/title-mobile/index.js

@@ -5,8 +5,8 @@ require('tslib');
 require('react');
 require('../title/component.js');
 require('classnames');
-require('../colors.module-b096a744.js');
-require('../common.module-58467946.js');
+require('../colors.module-0cd8388d.js');
+require('../common.module-c49b349a.js');
 
 
 

package/typography/title-responsive/component.js

@@ -3,9 +3,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var React = require('react');
 var title_component = require('../title/component.js');
-var common_module = require('../common.module-58467946.js');
+var common_module = require('../common.module-c49b349a.js');
 require('classnames');
-require('../colors.module-b096a744.js');
+require('../colors.module-0cd8388d.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/typography/title-responsive/index.js

@@ -5,8 +5,8 @@ require('tslib');
 require('react');
 require('../title/component.js');
 require('classnames');
-require('../colors.module-b096a744.js');
-require('../common.module-58467946.js');
+require('../colors.module-0cd8388d.js');
+require('../common.module-c49b349a.js');
 
 
 

package/vars/dist/src/border-radius.css

@@ -0,0 +1,11 @@
+:root {
+    --border-radius-xs: 2px;
+    --border-radius-s: 4px;
+    --border-radius-m: 8px;
+    --border-radius-l: 12px;
+    --border-radius-xl: 16px;
+    --border-radius-xxl: 20px;
+    --border-radius-3xl: 24px;
+    --border-radius-circle: 50%;
+    --border-radius-pill: 99px;
+}

package/vars/dist/src/bundle/click.css

@@ -0,0 +1,7 @@
+@import '../colors-bluetint.css';
+@import '../colors-addons.css';
+@import '../shadows-bluetint.css';
+@import '../border-radius.css';
+@import '../gaps.css';
+@import '../typography.css';
+@import '../mixins.css';

package/vars/dist/src/bundle/corp.css

@@ -0,0 +1,7 @@
+@import '../colors-indigo.css';
+@import '../colors-addons.css';
+@import '../shadows-indigo.css';
+@import '../border-radius.css';
+@import '../gaps.css';
+@import '../typography.css';
+@import '../mixins.css';

package/vars/dist/src/bundle/intranet.css

@@ -0,0 +1,7 @@
+@import '../colors-bluetint.css';
+@import '../colors-addons.css';
+@import '../shadows-bluetint.css';
+@import '../border-radius.css';
+@import '../gaps.css';
+@import '../typography.css';
+@import '../mixins.css';

package/vars/dist/src/bundle/mobile.css

@@ -0,0 +1,7 @@
+@import '../colors-bluetint.css';
+@import '../colors-addons.css';
+@import '../shadows-bluetint.css';
+@import '../border-radius.css';
+@import '../gaps.css';
+@import '../typography.css';
+@import '../mixins.css';

package/vars/dist/src/bundle/site.css

@@ -0,0 +1,6 @@
+@import '../colors-bluetint.css';
+@import '../colors-addons.css';
+@import '../shadows-bluetint.css';
+@import '../border-radius.css';
+@import '../gaps.css';
+@import '../mixins.css';

package/vars/dist/src/colors-addons.css

@@ -0,0 +1,127 @@
+:root {
+    --color-static-corpbg-neutral: #bdc0c2;
+    --color-static-corpbg-primary: #212a33;
+    --color-static-corpbg-secondary: #384048;
+    --color-static-corpbg-tertiary: #7a7f85;
+    --color-static-graphic-amethyst: #a489aa;
+    --color-static-graphic-blackberry: #bfafc6;
+    --color-static-graphic-blue-chill: #0f9c8c;
+    --color-static-graphic-blue-maya: #7eb3ff;
+    --color-static-graphic-blue-moody: #7879cf;
+    --color-static-graphic-blue-steel: #4f84ba;
+    --color-static-graphic-botticelli: #cee5e5;
+    --color-static-graphic-boulder: #7a7a7a;
+    --color-static-graphic-brink-pink: #fc617c;
+    --color-static-graphic-burnt-sienna: #eb7a58;
+    --color-static-graphic-carrot: #e8bba3;
+    --color-static-graphic-chatelle: #bfafc6;
+    --color-static-graphic-chathams-blue: #155966;
+    --color-static-graphic-chick: #f2db9e;
+    --color-static-graphic-crete: #847128;
+    --color-static-graphic-curious-blue: #2381db;
+    --color-static-graphic-curious-blue-light: #3b99d9;
+    --color-static-graphic-eastern-blue: #269cb3;
+    --color-static-graphic-french-lilac: #d3baed;
+    --color-static-graphic-fuel-yellow: #f29d32;
+    --color-static-graphic-fun-blue: #1d6ab5;
+    --color-static-graphic-gallery: #eee;
+    --color-static-graphic-green-jungle: #2fc26e;
+    --color-static-graphic-hippie-blue: #5aa4b0;
+    --color-static-graphic-jaffa: #f07134;
+    --color-static-graphic-jaffa-light: #f18836;
+    --color-static-graphic-java: #15c0e0;
+    --color-static-graphic-jungle-green: #2ab79a;
+    --color-static-graphic-lavender: #8888ad;
+    --color-static-graphic-mantis: #63cd4f;
+    --color-static-graphic-matisse: #16548f;
+    --color-static-graphic-milano-red: #cd1501;
+    --color-static-graphic-mirage: #1d2434;
+    --color-static-graphic-moon-raker: #e9dbf7;
+    --color-static-graphic-moss-green: #a6d29c;
+    --color-static-graphic-nevada: #626b75;
+    --color-static-graphic-olive: #bfd3c9;
+    --color-static-graphic-olivine: #87b965;
+    --color-static-graphic-peach: #fcc99b;
+    --color-static-graphic-persimmon: #ff5c5c;
+    --color-static-graphic-pewter: #96a5a5;
+    --color-static-graphic-pickled-bluewood: #2d3f50;
+    --color-static-graphic-porsche: #e7b965;
+    --color-static-graphic-raspberry: #dfb2bb;
+    --color-static-graphic-red-damask: #da713c;
+    --color-static-graphic-saffron: #f0c330;
+    --color-static-graphic-salomie: #fee984;
+    --color-static-graphic-sand: #f6bf65;
+    --color-static-graphic-sandy-brown: #f38f6f;
+    --color-static-graphic-seawater: #aecfd9;
+    --color-static-graphic-serenade: #fff0e3;
+    --color-static-graphic-sky: #a6c0db;
+    --color-static-graphic-soft-peach: #f3eaeb;
+    --color-static-graphic-solitude: #e8f2fe;
+    --color-static-graphic-strawberry: #f8b6a9;
+    --color-static-graphic-sundust: #d9d6ce;
+    --color-static-graphic-turkish-rose: #b56a6b;
+    --color-static-graphic-turquoise-blue: #6bd3e6;
+    --color-static-graphic-valencia: #d8463b;
+    --color-static-graphic-waikawa-gray: #5b6d9c;
+    --color-static-graphic-whisper: #f2eff6;
+    --color-static-graphic-zanah: #e1f0de;
+    --color-static-local-light-blue: #f5f7f9;
+    --color-static-overlay-black-high: rgba(0, 0, 0, 0.32);
+    --color-static-overlay-black-low: rgba(0, 0, 0, 0.16);
+    --color-static-overlay-black-normal: rgba(0, 0, 0, 0.24);
+    --color-static-overlay-black-xhigh: rgba(0, 0, 0, 0.4);
+    --color-static-overlay-black-xlow: rgba(0, 0, 0, 0.08);
+    --color-static-overlay-indigo-high: rgba(11, 31, 53, 0.32);
+    --color-static-overlay-indigo-low: rgba(11, 31, 53, 0.16);
+    --color-static-overlay-indigo-normal: rgba(11, 31, 53, 0.24);
+    --color-static-overlay-indigo-xhigh: rgba(11, 31, 53, 0.4);
+    --color-static-overlay-indigo-xlow: rgba(11, 31, 53, 0.08);
+    --color-static-overlay-white-high: rgba(255, 255, 255, 0.32);
+    --color-static-overlay-white-low: rgba(255, 255, 255, 0.16);
+    --color-static-overlay-white-normal: rgba(255, 255, 255, 0.24);
+    --color-static-overlay-white-xhigh: rgba(255, 255, 255, 0.4);
+    --color-static-overlay-white-xlow: rgba(255, 255, 255, 0.08);
+    --color-static-status-blue: #007aff;
+    --color-static-status-green: #13a463;
+    --color-static-status-grey: #6d7986;
+    --color-static-status-orange: #de6a00;
+    --color-static-status-purple: #673ab7;
+    --color-static-status-red: #d91d0b;
+    --color-static-status-teal: #219187;
+    --color-static-graphic-blue-chill-old: #0f9c8c; /* deprecated */
+    --color-static-graphic-boulder-old: #7a7a7a; /* deprecated */
+    --color-static-graphic-brink-pink-old: #fc617c; /* deprecated */
+    --color-static-graphic-burnt-sienna-old: #eb7a58; /* deprecated */
+    --color-static-graphic-chatelle-old: #bfafc6; /* deprecated */
+    --color-static-graphic-chathams-blue-old: #155966; /* deprecated */
+    --color-static-graphic-curious-blue-light-old: #3b99d9; /* deprecated */
+    --color-static-graphic-fun-blue-old: #1d6ab5; /* deprecated */
+    --color-static-graphic-hippie-blue-old: #5aa4b0; /* deprecated */
+    --color-static-graphic-jaffa-light-old: #f18836; /* deprecated */
+    --color-static-graphic-java-old: #15c0e0; /* deprecated */
+    --color-static-graphic-mantis-old: #63cd4f; /* deprecated */
+    --color-static-graphic-matisse-old: #16548f; /* deprecated */
+    --color-static-graphic-maya: #7eb3ff; /* deprecated */
+    --color-static-graphic-milano-red-old: #cd1501; /* deprecated */
+    --color-static-graphic-mirage-old: #1d2434; /* deprecated */
+    --color-static-graphic-nevada-old: #626b75; /* deprecated */
+    --color-static-graphic-olivine-old: #87b965; /* deprecated */
+    --color-static-graphic-permission: #ff5c5c; /* deprecated */
+    --color-static-graphic-pewter-old: #96a5a5; /* deprecated */
+    --color-static-graphic-pickled-bluewood-old: #2d3f50; /* deprecated */
+    --color-static-graphic-porsche-old: #e7b965; /* deprecated */
+    --color-static-graphic-red-damask-old: #da713c; /* deprecated */
+    --color-static-graphic-saffron-old: #f0c330; /* deprecated */
+    --color-static-graphic-sandybrown-old: #f38f6f; /* deprecated */
+    --color-static-graphic-turkish-rose-old: #b56a6b; /* deprecated */
+    --color-static-graphic-turquoise-blue-old: #6bd3e6; /* deprecated */
+    --color-static-graphic-valencia-old: #d8463b; /* deprecated */
+    --color-static-graphic-waikawa-gray-old: #5b6d9c; /* deprecated */
+    --color-static-status-blue-alpha-10: rgba(0, 122, 255, 0.1);
+    --color-static-status-green-alpha-10: rgba(19, 164, 99, 0.1);
+    --color-static-status-grey-alpha-10: rgba(109, 121, 134, 0.1);
+    --color-static-status-orange-alpha-10: rgba(222, 106, 0, 0.1);
+    --color-static-status-purple-alpha-10: rgba(103, 58, 183, 0.1);
+    --color-static-status-red-alpha-10: rgba(217, 29, 11, 0.1);
+    --color-static-status-teal-alpha-10: rgba(33, 145, 135, 0.1);
+}