@jobber/components 4.67.1 → 4.67.2-retheme-co.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (111) hide show
  1. package/dist/Autocomplete/index.js +10 -10
  2. package/dist/Avatar/index.js +1 -1
  3. package/dist/{Avatar-76a799fa.js → Avatar-3bb347c0.js} +2 -2
  4. package/dist/Banner/index.js +7 -7
  5. package/dist/Button/index.js +2 -2
  6. package/dist/Button-315fdd36.js +57 -0
  7. package/dist/ButtonDismiss/index.js +3 -3
  8. package/dist/{ButtonDismiss-2b98d075.js → ButtonDismiss-10b55ea8.js} +1 -1
  9. package/dist/Card/index.js +5 -5
  10. package/dist/Card-fe44ab83.js +93 -0
  11. package/dist/Checkbox/index.js +3 -3
  12. package/dist/{Checkbox-ad7ec2e7.js → Checkbox-e13780f7.js} +3 -3
  13. package/dist/Chip/index.js +4 -4
  14. package/dist/Chip-ab0db6e3.js +89 -0
  15. package/dist/Chips/index.js +10 -10
  16. package/dist/Combobox/index.js +7 -7
  17. package/dist/{Combobox-eb1e5817.js → Combobox-a211b89c.js} +18 -18
  18. package/dist/ConfirmationModal/index.js +10 -10
  19. package/dist/{ConfirmationModal-0f85d96c.js → ConfirmationModal-0d529f1c.js} +3 -3
  20. package/dist/Content/index.js +1 -1
  21. package/dist/Content-f562fa97.js +24 -0
  22. package/dist/DataDump/index.js +7 -7
  23. package/dist/DataList/index.js +48 -48
  24. package/dist/DataTable/index.js +17 -17
  25. package/dist/DatePicker/index.js +3 -3
  26. package/dist/{DatePicker-c18f1739.js → DatePicker-86ce5543.js} +4 -4
  27. package/dist/DescriptionList/index.js +3 -3
  28. package/dist/Disclosure/index.js +3 -3
  29. package/dist/Divider/index.js +2 -2
  30. package/dist/Drawer/index.js +8 -8
  31. package/dist/Emphasis/index.js +2 -2
  32. package/dist/{Emphasis-b2d1b3aa.js → Emphasis-562dc20f.js} +1 -1
  33. package/dist/FeatureSwitch/index.js +10 -10
  34. package/dist/Flex/index.js +2 -2
  35. package/dist/FormField/index.js +6 -6
  36. package/dist/{FormField-dfc061ca.js → FormField-81f94a56.js} +6 -6
  37. package/dist/FormatEmail/index.js +2 -2
  38. package/dist/FormatFile/index.js +13 -13
  39. package/dist/FormatFile-4721d6e1.js +121 -0
  40. package/dist/Gallery/index.js +16 -16
  41. package/dist/Glimmer/index.js +2 -2
  42. package/dist/Glimmer-7d30eb94.js +77 -0
  43. package/dist/Grid/index.js +6 -6
  44. package/dist/Heading/index.js +2 -2
  45. package/dist/{Heading-0f4ecb0c.js → Heading-33d621dd.js} +1 -1
  46. package/dist/InlineLabel/index.js +2 -2
  47. package/dist/InlineLabel-4d7324ac.js +28 -0
  48. package/dist/InputAvatar/index.js +8 -8
  49. package/dist/InputDate/index.js +7 -7
  50. package/dist/InputEmail/index.js +6 -6
  51. package/dist/InputFile/index.js +4 -4
  52. package/dist/{InputFile-540c1657.js → InputFile-818f026a.js} +5 -5
  53. package/dist/InputGroup/index.js +1 -1
  54. package/dist/InputGroup-ae670374.js +33 -0
  55. package/dist/InputNumber/index.js +7 -7
  56. package/dist/{InputNumber-d9ebabaa.js → InputNumber-4b1b6ec9.js} +1 -1
  57. package/dist/InputPassword/index.js +6 -6
  58. package/dist/InputPhoneNumber/index.js +8 -8
  59. package/dist/InputText/index.js +7 -7
  60. package/dist/{InputText-f7c45ee5.js → InputText-c9117290.js} +1 -1
  61. package/dist/InputTime/index.js +6 -6
  62. package/dist/InputValidation/index.js +3 -3
  63. package/dist/{InputValidation-179f0926.js → InputValidation-b7b3bc73.js} +3 -3
  64. package/dist/LightBox/index.js +4 -4
  65. package/dist/{LightBox-3f4dbc33.js → LightBox-0ed0736a.js} +4 -4
  66. package/dist/List/index.js +12 -12
  67. package/dist/Markdown/index.js +6 -6
  68. package/dist/{Markdown-96070121.js → Markdown-458aeb1e.js} +4 -4
  69. package/dist/Menu/index.js +3 -3
  70. package/dist/{Menu-d7ea093c.js → Menu-26149e93.js} +4 -4
  71. package/dist/Modal/index.js +5 -5
  72. package/dist/{Modal-70daa0e2.js → Modal-112928c4.js} +7 -7
  73. package/dist/MultiSelect/index.js +7 -7
  74. package/dist/{Option-469029b5.js → Option-62da6894.js} +1 -1
  75. package/dist/Page/index.js +10 -10
  76. package/dist/Popover/index.js +5 -5
  77. package/dist/ProgressBar/index.js +1 -1
  78. package/dist/ProgressBar-795d1357.js +43 -0
  79. package/dist/RadioGroup/index.js +3 -3
  80. package/dist/RadioGroup-8af6e169.js +47 -0
  81. package/dist/RecurringSelect/index.js +23 -23
  82. package/dist/Select/index.js +7 -7
  83. package/dist/Spinner/index.js +1 -1
  84. package/dist/Spinner-ba6cbf66.js +24 -0
  85. package/dist/StatusLabel/index.js +4 -4
  86. package/dist/Switch/index.js +2 -2
  87. package/dist/Switch-bae6ee85.js +56 -0
  88. package/dist/Table/index.js +4 -4
  89. package/dist/Tabs/index.js +3 -3
  90. package/dist/Text/index.js +2 -2
  91. package/dist/{Text-4a2bc89f.js → Text-982ed306.js} +1 -1
  92. package/dist/Toast/index.js +4 -4
  93. package/dist/Tooltip/index.js +1 -1
  94. package/dist/{Tooltip-6b12f1c2.js → Tooltip-1b266564.js} +2 -2
  95. package/dist/Typography/index.js +1 -1
  96. package/dist/Typography-702ee9a7.js +62 -0
  97. package/package.json +3 -3
  98. package/rollup.config.js +1 -1
  99. package/dist/Button-163a0641.js +0 -57
  100. package/dist/Card-3178033c.js +0 -93
  101. package/dist/Chip-168acf3e.js +0 -89
  102. package/dist/Content-2ca1ffe1.js +0 -24
  103. package/dist/FormatFile-3b650d02.js +0 -121
  104. package/dist/Glimmer-cfa92a88.js +0 -77
  105. package/dist/InlineLabel-9a517c19.js +0 -28
  106. package/dist/InputGroup-8d4fd4eb.js +0 -33
  107. package/dist/ProgressBar-b68edc8f.js +0 -43
  108. package/dist/RadioGroup-ebaa4f87.js +0 -47
  109. package/dist/Spinner-9d8fc7ff.js +0 -24
  110. package/dist/Switch-b85272bf.js +0 -56
  111. package/dist/Typography-973b122e.js +0 -62
@@ -2,23 +2,23 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var InputNumber = require('../InputNumber-d9ebabaa.js');
5
+ var InputNumber = require('../InputNumber-4b1b6ec9.js');
6
6
  require('react');
7
- require('../FormField-dfc061ca.js');
7
+ require('../FormField-81f94a56.js');
8
8
  require('../tslib.es6-5b8768b7.js');
9
9
  require('uuid');
10
10
  require('react-hook-form');
11
11
  require('../style-inject.es-9d2f5f4e.js');
12
12
  require('classnames');
13
- require('../Button-163a0641.js');
13
+ require('../Button-315fdd36.js');
14
14
  require('react-router-dom');
15
15
  require('../Icon-405a216c.js');
16
16
  require('@jobber/design');
17
- require('../Typography-973b122e.js');
18
- require('../Text-4a2bc89f.js');
19
- require('../InputValidation-179f0926.js');
17
+ require('../Typography-702ee9a7.js');
18
+ require('../Text-982ed306.js');
19
+ require('../InputValidation-b7b3bc73.js');
20
20
  require('framer-motion');
21
- require('../Spinner-9d8fc7ff.js');
21
+ require('../Spinner-ba6cbf66.js');
22
22
 
23
23
 
24
24
 
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  var React = require('react');
4
- var FormField = require('./FormField-dfc061ca.js');
4
+ var FormField = require('./FormField-81f94a56.js');
5
5
 
6
6
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
7
7
 
@@ -3,21 +3,21 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var React = require('react');
6
- var FormField = require('../FormField-dfc061ca.js');
6
+ var FormField = require('../FormField-81f94a56.js');
7
7
  require('../tslib.es6-5b8768b7.js');
8
8
  require('uuid');
9
9
  require('react-hook-form');
10
10
  require('../style-inject.es-9d2f5f4e.js');
11
11
  require('classnames');
12
- require('../Button-163a0641.js');
12
+ require('../Button-315fdd36.js');
13
13
  require('react-router-dom');
14
14
  require('../Icon-405a216c.js');
15
15
  require('@jobber/design');
16
- require('../Typography-973b122e.js');
17
- require('../Text-4a2bc89f.js');
18
- require('../InputValidation-179f0926.js');
16
+ require('../Typography-702ee9a7.js');
17
+ require('../Text-982ed306.js');
18
+ require('../InputValidation-b7b3bc73.js');
19
19
  require('framer-motion');
20
- require('../Spinner-9d8fc7ff.js');
20
+ require('../Spinner-ba6cbf66.js');
21
21
 
22
22
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
23
23
 
@@ -6,25 +6,25 @@ var tslib_es6 = require('../tslib.es6-5b8768b7.js');
6
6
  var React = require('react');
7
7
  var reactHookForm = require('react-hook-form');
8
8
  var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
9
- var FormField = require('../FormField-dfc061ca.js');
9
+ var FormField = require('../FormField-81f94a56.js');
10
10
  require('uuid');
11
11
  require('classnames');
12
- require('../Button-163a0641.js');
12
+ require('../Button-315fdd36.js');
13
13
  require('react-router-dom');
14
14
  require('../Icon-405a216c.js');
15
15
  require('@jobber/design');
16
- require('../Typography-973b122e.js');
17
- require('../Text-4a2bc89f.js');
18
- require('../InputValidation-179f0926.js');
16
+ require('../Typography-702ee9a7.js');
17
+ require('../Text-982ed306.js');
18
+ require('../InputValidation-b7b3bc73.js');
19
19
  require('framer-motion');
20
- require('../Spinner-9d8fc7ff.js');
20
+ require('../Spinner-ba6cbf66.js');
21
21
 
22
22
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
23
23
 
24
24
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
25
25
 
26
- var css_248z = ".L7WK-i5uaOk- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-align: center;\n align-items: center;\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n z-index: 1;\n z-index: var(--elevation-base);\n height: var(--field--height);\n padding-top: var(--field--padding-top);\n padding-bottom: var(--field--padding-bottom);\n padding-left: var(--field--padding-left);\n padding-right: var(--field--padding-right);\n color: rgb(181, 181, 181);\n color: var(--color-grey);\n font-family: inherit;\n font-size: inherit;\n line-height: var(--field--value-lineHeight);\n pointer-events: none;\n}\n\n.q1wXBupm5Xc- {\n visibility: hidden;\n opacity: 0;\n}\n";
27
- var styles = {"mask":"L7WK-i5uaOk-","hiddenValue":"q1wXBupm5Xc-"};
26
+ var css_248z = ".InputMask__mask---retheme- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-align: center;\n align-items: center;\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n z-index: 1;\n z-index: var(--elevation-base);\n height: var(--field--height);\n padding-top: var(--field--padding-top);\n padding-bottom: var(--field--padding-bottom);\n padding-left: var(--field--padding-left);\n padding-right: var(--field--padding-right);\n color: rgb(181, 181, 181);\n color: var(--color-grey);\n font-family: inherit;\n font-size: inherit;\n line-height: var(--field--value-lineHeight);\n pointer-events: none;\n}\n\n.InputMask__hiddenValue---retheme- {\n visibility: hidden;\n opacity: 0;\n}\n";
27
+ var styles = {"mask":"InputMask__mask---retheme-","hiddenValue":"InputMask__hiddenValue---retheme-"};
28
28
  styleInject_es.styleInject(css_248z);
29
29
 
30
30
  function InputMask({ children, delimiter = "*", pattern, strict = true, }) {
@@ -2,23 +2,23 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var InputText = require('../InputText-f7c45ee5.js');
5
+ var InputText = require('../InputText-c9117290.js');
6
6
  require('react');
7
- require('../FormField-dfc061ca.js');
7
+ require('../FormField-81f94a56.js');
8
8
  require('../tslib.es6-5b8768b7.js');
9
9
  require('uuid');
10
10
  require('react-hook-form');
11
11
  require('../style-inject.es-9d2f5f4e.js');
12
12
  require('classnames');
13
- require('../Button-163a0641.js');
13
+ require('../Button-315fdd36.js');
14
14
  require('react-router-dom');
15
15
  require('../Icon-405a216c.js');
16
16
  require('@jobber/design');
17
- require('../Typography-973b122e.js');
18
- require('../Text-4a2bc89f.js');
19
- require('../InputValidation-179f0926.js');
17
+ require('../Typography-702ee9a7.js');
18
+ require('../Text-982ed306.js');
19
+ require('../InputValidation-b7b3bc73.js');
20
20
  require('framer-motion');
21
- require('../Spinner-9d8fc7ff.js');
21
+ require('../Spinner-ba6cbf66.js');
22
22
 
23
23
 
24
24
 
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  var React = require('react');
4
- var FormField = require('./FormField-dfc061ca.js');
4
+ var FormField = require('./FormField-81f94a56.js');
5
5
 
6
6
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
7
7
 
@@ -6,20 +6,20 @@ var tslib_es6 = require('../tslib.es6-5b8768b7.js');
6
6
  var React = require('react');
7
7
  var debounce = require('lodash/debounce');
8
8
  var temporal = require('@std-proposal/temporal');
9
- var FormField = require('../FormField-dfc061ca.js');
9
+ var FormField = require('../FormField-81f94a56.js');
10
10
  require('uuid');
11
11
  require('react-hook-form');
12
12
  require('../style-inject.es-9d2f5f4e.js');
13
13
  require('classnames');
14
- require('../Button-163a0641.js');
14
+ require('../Button-315fdd36.js');
15
15
  require('react-router-dom');
16
16
  require('../Icon-405a216c.js');
17
17
  require('@jobber/design');
18
- require('../Typography-973b122e.js');
19
- require('../Text-4a2bc89f.js');
20
- require('../InputValidation-179f0926.js');
18
+ require('../Typography-702ee9a7.js');
19
+ require('../Text-982ed306.js');
20
+ require('../InputValidation-b7b3bc73.js');
21
21
  require('framer-motion');
22
- require('../Spinner-9d8fc7ff.js');
22
+ require('../Spinner-ba6cbf66.js');
23
23
 
24
24
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
25
25
 
@@ -2,12 +2,12 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var InputValidation = require('../InputValidation-179f0926.js');
5
+ var InputValidation = require('../InputValidation-b7b3bc73.js');
6
6
  require('react');
7
7
  require('framer-motion');
8
8
  require('../style-inject.es-9d2f5f4e.js');
9
- require('../Text-4a2bc89f.js');
10
- require('../Typography-973b122e.js');
9
+ require('../Text-982ed306.js');
10
+ require('../Typography-702ee9a7.js');
11
11
  require('classnames');
12
12
  require('../Icon-405a216c.js');
13
13
  require('@jobber/design');
@@ -3,15 +3,15 @@
3
3
  var React = require('react');
4
4
  var framerMotion = require('framer-motion');
5
5
  var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
6
- var Text = require('./Text-4a2bc89f.js');
6
+ var Text = require('./Text-982ed306.js');
7
7
  var Icon = require('./Icon-405a216c.js');
8
8
 
9
9
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
10
 
11
11
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
12
 
13
- var css_248z = ".sc-bFJieXBA- {\n margin-top: calc(16px / 4);\n margin-top: var(--space-smaller);\n}\n\n.xybhC5Y6mk4- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-align: center;\n align-items: center;\n padding: calc(16px / 4);\n padding: var(--space-smaller);\n padding-left: 0;\n}\n\n.xybhC5Y6mk4- > svg {\n margin-right: calc(16px / 4);\n margin-right: var(--space-smaller);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n -ms-flex-item-align: start;\n align-self: flex-start;\n}\n\n.xybhC5Y6mk4-:focus {\n box-shadow: 0px 0px 0px calc(16px / 8) rgba(255, 255, 255, 1),\n 0px 0px 0px calc(16px / 4) rgb(147, 161, 169);\n box-shadow: var(--shadow-focus);\n outline: none;\n}\n";
14
- var styles = {"hasValidationMessage":"sc-bFJieXBA-","message":"xybhC5Y6mk4-"};
13
+ var css_248z = ".InputValidation__hasValidationMessage---retheme- {\n margin-top: calc(16px / 4);\n margin-top: var(--space-smaller);\n}\n\n.InputValidation__message---retheme- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-align: center;\n align-items: center;\n padding: calc(16px / 4);\n padding: var(--space-smaller);\n padding-left: 0;\n}\n\n.InputValidation__message---retheme- > svg {\n margin-right: calc(16px / 4);\n margin-right: var(--space-smaller);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n -ms-flex-item-align: start;\n align-self: flex-start;\n}\n\n.InputValidation__message---retheme-:focus {\n box-shadow: 0px 0px 0px calc(16px / 8) rgba(255, 255, 255, 1),\n 0px 0px 0px calc(16px / 4) rgb(147, 161, 169);\n box-shadow: var(--shadow-focus);\n outline: none;\n}\n";
14
+ var styles = {"hasValidationMessage":"InputValidation__hasValidationMessage---retheme-","message":"InputValidation__message---retheme-"};
15
15
  styleInject_es.styleInject(css_248z);
16
16
 
17
17
  function InputValidation({ message }) {
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var LightBox = require('../LightBox-3f4dbc33.js');
5
+ var LightBox = require('../LightBox-0ed0736a.js');
6
6
  require('react');
7
7
  require('framer-motion');
8
8
  require('react-dom');
@@ -11,13 +11,13 @@ require('@jobber/hooks/useRefocusOnActivator');
11
11
  require('@jobber/hooks/useOnKeyDown');
12
12
  require('@jobber/hooks/useFocusTrap');
13
13
  require('../style-inject.es-9d2f5f4e.js');
14
- require('../ButtonDismiss-2b98d075.js');
15
- require('../Button-163a0641.js');
14
+ require('../ButtonDismiss-10b55ea8.js');
15
+ require('../Button-315fdd36.js');
16
16
  require('classnames');
17
17
  require('react-router-dom');
18
18
  require('../Icon-405a216c.js');
19
19
  require('@jobber/design');
20
- require('../Typography-973b122e.js');
20
+ require('../Typography-702ee9a7.js');
21
21
 
22
22
 
23
23
 
@@ -8,8 +8,8 @@ var useRefocusOnActivator = require('@jobber/hooks/useRefocusOnActivator');
8
8
  var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
9
9
  var useFocusTrap = require('@jobber/hooks/useFocusTrap');
10
10
  var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
11
- var ButtonDismiss = require('./ButtonDismiss-2b98d075.js');
12
- var Button = require('./Button-163a0641.js');
11
+ var ButtonDismiss = require('./ButtonDismiss-10b55ea8.js');
12
+ var Button = require('./Button-315fdd36.js');
13
13
 
14
14
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
15
15
 
@@ -17,8 +17,8 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
17
17
  var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
18
18
  var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);
19
19
 
20
- var css_248z = "._3JgBCebdbNU-,\n.JJOBEL7d-10- {\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n top: 50%;\n z-index: 1;\n z-index: var(--elevation-base);\n -webkit-transform: translateY(-50%);\n transform: translateY(-50%);\n}\n\n._3JgBCebdbNU- {\n right: calc(16px * 1);\n right: var(--space-base);\n}\n\n.JJOBEL7d-10- {\n left: calc(16px * 1);\n left: var(--space-base);\n}\n\n.fAep1A-0xIU- {\n display: -ms-flexbox;\n display: flex;\n position: fixed;\n top: 0;\n left: 0;\n z-index: 1001;\n z-index: var(--elevation-modal);\n width: 100%;\n height: 100%;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n\n.AfUUWErd5S4- {\n display: -ms-flexbox;\n display: flex;\n z-index: 1;\n z-index: var(--elevation-base);\n padding: calc(16px / 2) calc(16px * 1);\n padding: var(--space-small) var(--space-base);\n color: rgb(193, 201, 206);\n color: var(--color-text--reverse--secondary);\n font-size: calc(16px * 1);\n font-size: var(--typography--fontSize-large);\n background-color: rgb(1, 41, 57);\n background-color: var(--color-surface--reverse);\n -ms-flex-pack: justify;\n justify-content: space-between;\n}\n\n.ysUYbBTaORk- {\n display: -ms-inline-flexbox;\n display: inline-flex;\n -ms-flex-align: center;\n align-items: center;\n}\n\n.GSOVtN1Y3IU- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: center;\n justify-content: center;\n position: relative;\n -ms-flex: 1 1 0px;\n flex: 1 1 0;\n min-height: 0;\n}\n\n.-V917BdNqSs- {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background-color: rgba(0, 0, 0, 0.32);\n background-color: var(--color-overlay);\n}\n\n.sjwUjzb3a5c- {\n position: absolute;\n top: 50%;\n max-width: 100%;\n max-height: 100%;\n margin: auto;\n}\n";
21
- var styles = {"next":"_3JgBCebdbNU-","prev":"JJOBEL7d-10-","lightboxWrapper":"fAep1A-0xIU-","toolbar":"AfUUWErd5S4-","title":"ysUYbBTaORk-","imagesWrapper":"GSOVtN1Y3IU-","overlay":"-V917BdNqSs-","image":"sjwUjzb3a5c-"};
20
+ var css_248z = ".LightBox__next---retheme-,\n.LightBox__prev---retheme- {\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n top: 50%;\n z-index: 1;\n z-index: var(--elevation-base);\n -webkit-transform: translateY(-50%);\n transform: translateY(-50%);\n}\n\n.LightBox__next---retheme- {\n right: calc(16px * 1);\n right: var(--space-base);\n}\n\n.LightBox__prev---retheme- {\n left: calc(16px * 1);\n left: var(--space-base);\n}\n\n.LightBox__lightboxWrapper---retheme- {\n display: -ms-flexbox;\n display: flex;\n position: fixed;\n top: 0;\n left: 0;\n z-index: 1001;\n z-index: var(--elevation-modal);\n width: 100%;\n height: 100%;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n\n.LightBox__toolbar---retheme- {\n display: -ms-flexbox;\n display: flex;\n z-index: 1;\n z-index: var(--elevation-base);\n padding: calc(16px / 2) calc(16px * 1);\n padding: var(--space-small) var(--space-base);\n color: rgb(193, 201, 206);\n color: var(--color-text--reverse--secondary);\n font-size: calc(16px * 1);\n font-size: var(--typography--fontSize-large);\n background-color: rgb(1, 41, 57);\n background-color: var(--color-surface--reverse);\n -ms-flex-pack: justify;\n justify-content: space-between;\n}\n\n.LightBox__title---retheme- {\n display: -ms-inline-flexbox;\n display: inline-flex;\n -ms-flex-align: center;\n align-items: center;\n}\n\n.LightBox__imagesWrapper---retheme- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: center;\n justify-content: center;\n position: relative;\n -ms-flex: 1 1 0px;\n flex: 1 1 0;\n min-height: 0;\n}\n\n.LightBox__overlay---retheme- {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background-color: rgba(0, 0, 0, 0.32);\n background-color: var(--color-overlay);\n}\n\n.LightBox__image---retheme- {\n position: absolute;\n top: 50%;\n max-width: 100%;\n max-height: 100%;\n margin: auto;\n}\n";
21
+ var styles = {"next":"LightBox__next---retheme-","prev":"LightBox__prev---retheme-","lightboxWrapper":"LightBox__lightboxWrapper---retheme-","toolbar":"LightBox__toolbar---retheme-","title":"LightBox__title---retheme-","imagesWrapper":"LightBox__imagesWrapper---retheme-","overlay":"LightBox__overlay---retheme-","image":"LightBox__image---retheme-"};
22
22
  styleInject_es.styleInject(css_248z);
23
23
 
24
24
  /* eslint-disable max-statements */
@@ -8,14 +8,14 @@ var get = require('lodash/get');
8
8
  var groupBy = require('lodash/groupBy');
9
9
  var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
10
10
  var Icon = require('../Icon-405a216c.js');
11
- var Text = require('../Text-4a2bc89f.js');
12
- var Heading = require('../Heading-0f4ecb0c.js');
13
- var Typography = require('../Typography-973b122e.js');
14
- var Markdown = require('../Markdown-96070121.js');
15
- var Emphasis = require('../Emphasis-b2d1b3aa.js');
11
+ var Text = require('../Text-982ed306.js');
12
+ var Heading = require('../Heading-33d621dd.js');
13
+ var Typography = require('../Typography-702ee9a7.js');
14
+ var Markdown = require('../Markdown-458aeb1e.js');
15
+ var Emphasis = require('../Emphasis-562dc20f.js');
16
16
  require('@jobber/design');
17
17
  require('react-markdown');
18
- require('../Content-2ca1ffe1.js');
18
+ require('../Content-f562fa97.js');
19
19
 
20
20
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
21
21
 
@@ -24,16 +24,16 @@ var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
24
24
  var get__default = /*#__PURE__*/_interopDefaultLegacy(get);
25
25
  var groupBy__default = /*#__PURE__*/_interopDefaultLegacy(groupBy);
26
26
 
27
- var css_248z$2 = ".u853Ql4cj50- {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\n.ig9l6LfEgwo-:not(:last-child) {\n border-bottom: calc(16px / 16) solid rgb(217, 223, 225);\n border-bottom: var(--border-base) solid var(--color-border);\n}\n\n.KIYTQdrufzY- {\n position: relative;\n}\n\n.KIYTQdrufzY-:not(:last-child) .u853Ql4cj50- {\n padding-bottom: calc(16px * 1.5);\n padding-bottom: var(--space-large);\n}\n";
28
- var styles$1 = {"list":"u853Ql4cj50-","item":"ig9l6LfEgwo-","section":"KIYTQdrufzY-"};
27
+ var css_248z$2 = ".List__list---retheme- {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\n.List__item---retheme-:not(:last-child) {\n border-bottom: calc(16px / 16) solid rgb(217, 223, 225);\n border-bottom: var(--border-base) solid var(--color-border);\n}\n\n.List__section---retheme- {\n position: relative;\n}\n\n.List__section---retheme-:not(:last-child) .List__list---retheme- {\n padding-bottom: calc(16px * 1.5);\n padding-bottom: var(--space-large);\n}\n";
28
+ var styles$1 = {"list":"List__list---retheme-","item":"List__item---retheme-","section":"List__section---retheme-"};
29
29
  styleInject_es.styleInject(css_248z$2);
30
30
 
31
- var css_248z$1 = ".LUlooG82UJA- {\n position: sticky;\n top: 0;\n padding: calc(16px / 2) calc(16px * 1);\n padding: var(--space-small) var(--space-base);\n border-bottom: 1px solid rgb(1, 41, 57);\n border-bottom: 1px solid var(--color-border--section);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n._4LVpgNq-SLM- {\n border-bottom-color: rgb(147, 161, 169);\n border-bottom-color: var(--color-greyBlue--light);\n color: rgb(147, 161, 169);\n color: var(--color-greyBlue--light);\n}\n\n._0QhWokyE9PY- {\n border-bottom-color: rgb(125, 176, 14);\n border-bottom-color: var(--color-green);\n color: rgb(125, 176, 14);\n color: var(--color-green);\n}\n\n.J8wB3qqOlBc-,\n.Ujqj17pKDIE- {\n border-bottom-color: rgb(1, 41, 57);\n border-bottom-color: var(--color-blue);\n color: rgb(1, 41, 57);\n color: var(--color-blue);\n}\n\n._0lNxLGXhrfY- {\n border-bottom-color: rgb(243, 150, 36);\n border-bottom-color: var(--color-orange);\n color: rgb(243, 150, 36);\n color: var(--color-orange);\n}\n\n._4qPymF0CAAE- {\n border-bottom-color: rgb(201, 66, 33);\n border-bottom-color: var(--color-red);\n color: rgb(201, 66, 33);\n color: var(--color-red);\n}\n\n.kKYNLBSu9IQ- {\n border-bottom-color: rgb(62, 173, 146);\n border-bottom-color: var(--color-teal);\n color: rgb(62, 173, 146);\n color: var(--color-teal);\n}\n";
32
- var sectionStyles = {"sectionHeader":"LUlooG82UJA-","greyBlue":"_4LVpgNq-SLM-","green":"_0QhWokyE9PY-","blue":"J8wB3qqOlBc-","archived":"Ujqj17pKDIE-","orange":"_0lNxLGXhrfY-","red":"_4qPymF0CAAE-","teal":"kKYNLBSu9IQ-"};
31
+ var css_248z$1 = ".SectionHeader__sectionHeader---retheme- {\n position: sticky;\n top: 0;\n padding: calc(16px / 2) calc(16px * 1);\n padding: var(--space-small) var(--space-base);\n border-bottom: 1px solid rgb(1, 41, 57);\n border-bottom: 1px solid var(--color-border--section);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n.SectionHeader__greyBlue---retheme- {\n border-bottom-color: rgb(147, 161, 169);\n border-bottom-color: var(--color-greyBlue--light);\n color: rgb(147, 161, 169);\n color: var(--color-greyBlue--light);\n}\n\n.SectionHeader__green---retheme- {\n border-bottom-color: rgb(125, 176, 14);\n border-bottom-color: var(--color-green);\n color: rgb(125, 176, 14);\n color: var(--color-green);\n}\n\n.SectionHeader__blue---retheme-,\n.SectionHeader__archived---retheme- {\n border-bottom-color: rgb(1, 41, 57);\n border-bottom-color: var(--color-blue);\n color: rgb(1, 41, 57);\n color: var(--color-blue);\n}\n\n.SectionHeader__orange---retheme- {\n border-bottom-color: rgb(243, 150, 36);\n border-bottom-color: var(--color-orange);\n color: rgb(243, 150, 36);\n color: var(--color-orange);\n}\n\n.SectionHeader__red---retheme- {\n border-bottom-color: rgb(201, 66, 33);\n border-bottom-color: var(--color-red);\n color: rgb(201, 66, 33);\n color: var(--color-red);\n}\n\n.SectionHeader__teal---retheme- {\n border-bottom-color: rgb(62, 173, 146);\n border-bottom-color: var(--color-teal);\n color: rgb(62, 173, 146);\n color: var(--color-teal);\n}\n";
32
+ var sectionStyles = {"sectionHeader":"SectionHeader__sectionHeader---retheme-","greyBlue":"SectionHeader__greyBlue---retheme-","green":"SectionHeader__green---retheme-","blue":"SectionHeader__blue---retheme-","archived":"SectionHeader__archived---retheme-","orange":"SectionHeader__orange---retheme-","red":"SectionHeader__red---retheme-","teal":"SectionHeader__teal---retheme-"};
33
33
  styleInject_es.styleInject(css_248z$1);
34
34
 
35
- var css_248z = ".XPLf4Jp6feU- {\n display: -ms-flexbox;\n display: flex;\n width: 100%;\n box-sizing: border-box;\n padding: calc(16px / 2);\n padding: var(--space-small);\n border: none;\n text-align: left;\n -webkit-text-decoration: none;\n text-decoration: none;\n background-color: transparent;\n transition: background-color 200ms;\n transition: background-color var(--timing-base);\n -webkit-appearance: none;\n appearance: none;\n -ms-flex-align: start;\n align-items: flex-start;\n}\n\n.XPLf4Jp6feU- > * {\n padding: calc(16px / 2);\n padding: var(--space-small);\n}\n\n.RseHYbVm4MA- {\n cursor: pointer;\n}\n\n.RseHYbVm4MA-:hover,\n.RseHYbVm4MA-:focus {\n outline: none;\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n}\n\n.d1-zQvxPH-M- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n width: calc(16px * 1.5);\n width: var(--space-large);\n height: calc(16px * 1.5);\n height: var(--space-large);\n box-sizing: content-box;\n}\n\n._-58VuZf1TtM- {\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n min-width: 0;\n -ms-flex-item-align: center;\n align-self: center;\n}\n\n.wHB5zXYWW3E- {\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n text-align: right;\n}\n\n/* States */\n\n.C4DznaxLKiw- {\n background-color: rgb(238, 240, 242);\n background-color: var(--color-surface--background);\n}\n\n.C4DznaxLKiw-:hover,\n.C4DznaxLKiw-:focus {\n background-color: rgb(193, 201, 206);\n background-color: var(--color-surface--background--hover);\n}\n\n/* TODO: Move truncate in typography */\n\n.Brob-IpVv4o- {\n display: block;\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n";
36
- var styles = {"action":"XPLf4Jp6feU-","hoverable":"RseHYbVm4MA-","icon":"d1-zQvxPH-M-","info":"_-58VuZf1TtM-","amount":"wHB5zXYWW3E-","isActive":"C4DznaxLKiw-","truncate":"Brob-IpVv4o-"};
35
+ var css_248z = ".ListItem__action---retheme- {\n display: -ms-flexbox;\n display: flex;\n width: 100%;\n box-sizing: border-box;\n padding: calc(16px / 2);\n padding: var(--space-small);\n border: none;\n text-align: left;\n -webkit-text-decoration: none;\n text-decoration: none;\n background-color: transparent;\n transition: background-color 200ms;\n transition: background-color var(--timing-base);\n -webkit-appearance: none;\n appearance: none;\n -ms-flex-align: start;\n align-items: flex-start;\n}\n\n.ListItem__action---retheme- > * {\n padding: calc(16px / 2);\n padding: var(--space-small);\n}\n\n.ListItem__hoverable---retheme- {\n cursor: pointer;\n}\n\n.ListItem__hoverable---retheme-:hover,\n.ListItem__hoverable---retheme-:focus {\n outline: none;\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n}\n\n.ListItem__icon---retheme- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n width: calc(16px * 1.5);\n width: var(--space-large);\n height: calc(16px * 1.5);\n height: var(--space-large);\n box-sizing: content-box;\n}\n\n.ListItem__info---retheme- {\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n min-width: 0;\n -ms-flex-item-align: center;\n align-self: center;\n}\n\n.ListItem__amount---retheme- {\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n text-align: right;\n}\n\n/* States */\n\n.ListItem__isActive---retheme- {\n background-color: rgb(238, 240, 242);\n background-color: var(--color-surface--background);\n}\n\n.ListItem__isActive---retheme-:hover,\n.ListItem__isActive---retheme-:focus {\n background-color: rgb(193, 201, 206);\n background-color: var(--color-surface--background--hover);\n}\n\n/* TODO: Move truncate in typography */\n\n.ListItem__truncate---retheme- {\n display: block;\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n";
36
+ var styles = {"action":"ListItem__action---retheme-","hoverable":"ListItem__hoverable---retheme-","icon":"ListItem__icon---retheme-","info":"ListItem__info---retheme-","amount":"ListItem__amount---retheme-","isActive":"ListItem__isActive---retheme-","truncate":"ListItem__truncate---retheme-"};
37
37
  styleInject_es.styleInject(css_248z);
38
38
 
39
39
  function ListItem({ caption, content, icon, iconColor, id, isActive, onClick, title, url, value, }) {
@@ -2,16 +2,16 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var Markdown = require('../Markdown-96070121.js');
5
+ var Markdown = require('../Markdown-458aeb1e.js');
6
6
  require('react');
7
7
  require('react-markdown');
8
- require('../Text-4a2bc89f.js');
9
- require('../Typography-973b122e.js');
8
+ require('../Text-982ed306.js');
9
+ require('../Typography-702ee9a7.js');
10
10
  require('classnames');
11
11
  require('../style-inject.es-9d2f5f4e.js');
12
- require('../Emphasis-b2d1b3aa.js');
13
- require('../Heading-0f4ecb0c.js');
14
- require('../Content-2ca1ffe1.js');
12
+ require('../Emphasis-562dc20f.js');
13
+ require('../Heading-33d621dd.js');
14
+ require('../Content-f562fa97.js');
15
15
 
16
16
 
17
17
 
@@ -2,10 +2,10 @@
2
2
 
3
3
  var React = require('react');
4
4
  var ReactMarkdown = require('react-markdown');
5
- var Text = require('./Text-4a2bc89f.js');
6
- var Emphasis = require('./Emphasis-b2d1b3aa.js');
7
- var Heading = require('./Heading-0f4ecb0c.js');
8
- var Content = require('./Content-2ca1ffe1.js');
5
+ var Text = require('./Text-982ed306.js');
6
+ var Emphasis = require('./Emphasis-562dc20f.js');
7
+ var Heading = require('./Heading-33d621dd.js');
8
+ var Content = require('./Content-f562fa97.js');
9
9
 
10
10
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
11
11
 
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var Menu = require('../Menu-d7ea093c.js');
5
+ var Menu = require('../Menu-26149e93.js');
6
6
  require('react');
7
7
  require('uuid');
8
8
  require('classnames');
@@ -10,11 +10,11 @@ require('framer-motion');
10
10
  require('@jobber/hooks/useOnKeyDown');
11
11
  require('@jobber/hooks/useRefocusOnActivator');
12
12
  require('../style-inject.es-9d2f5f4e.js');
13
- require('../Button-163a0641.js');
13
+ require('../Button-315fdd36.js');
14
14
  require('react-router-dom');
15
15
  require('../Icon-405a216c.js');
16
16
  require('@jobber/design');
17
- require('../Typography-973b122e.js');
17
+ require('../Typography-702ee9a7.js');
18
18
 
19
19
 
20
20
 
@@ -7,8 +7,8 @@ var framerMotion = require('framer-motion');
7
7
  var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
8
8
  var useRefocusOnActivator = require('@jobber/hooks/useRefocusOnActivator');
9
9
  var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
10
- var Button = require('./Button-163a0641.js');
11
- var Typography = require('./Typography-973b122e.js');
10
+ var Button = require('./Button-315fdd36.js');
11
+ var Typography = require('./Typography-702ee9a7.js');
12
12
  var Icon = require('./Icon-405a216c.js');
13
13
 
14
14
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -16,8 +16,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
16
16
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
17
17
  var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
18
18
 
19
- var css_248z = ".dT6M9tp1sZc- * {\n box-sizing: border-box;\n}\n\n.dT6M9tp1sZc- {\n display: inline-block;\n position: relative;\n}\n\n.Qmxlsj0D3qM- {\n position: fixed;\n bottom: 0;\n left: 0;\n z-index: 6;\n z-index: var(--elevation-menu);\n width: 100%;\n max-height: 72vh;\n padding: calc(16px / 2);\n padding: var(--space-small);\n padding-bottom: calc(env(safe-area-inset-bottom) + (16px / 2));\n padding-bottom: calc(env(safe-area-inset-bottom) + calc(16px / 2));\n padding-bottom: calc(env(safe-area-inset-bottom) + var(--space-small));\n border-radius: calc(16px / 8) calc(16px / 8) 0 0;\n border-radius: var(--radius-base) var(--radius-base) 0 0;\n -webkit-overflow-scrolling: touch;\n overflow-y: scroll;\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n@media (min-width: 490px) {\n\n.Qmxlsj0D3qM- {\n position: absolute;\n left: auto;\n width: calc(16px * 12.5);\n width: calc(var(--base-unit) * 12.5);\n box-shadow: 0px calc(16px / 16) calc(16px / 4) 0px\n rgba(0, 0, 0, 0.1),\n 0px calc(16px / 4) 12px 0px rgba(0, 0, 0, 0.05);\n box-shadow: var(--shadow-base);\n padding: calc(16px / 2);\n padding: var(--space-small);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n overflow: auto;\n}\n }\n\n@media (--small-screens-and-up) {\n\n.Qmxlsj0D3qM- {\n position: absolute;\n left: auto;\n width: calc(16px * 12.5);\n width: calc(var(--base-unit) * 12.5);\n box-shadow: 0px calc(16px / 16) calc(16px / 4) 0px\n rgba(0, 0, 0, 0.1),\n 0px calc(16px / 4) 12px 0px rgba(0, 0, 0, 0.05);\n box-shadow: var(--shadow-base);\n padding: calc(16px / 2);\n padding: var(--space-small);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n overflow: auto;\n}\n }\n\n@media (min-width: 490px) {\n\n.QTisUfiHwL4- {\n bottom: 100%;\n margin-bottom: calc(16px / 8);\n margin-bottom: var(--space-smallest);\n}\n }\n\n@media (--small-screens-and-up) {\n\n.QTisUfiHwL4- {\n bottom: 100%;\n margin-bottom: calc(16px / 8);\n margin-bottom: var(--space-smallest);\n}\n }\n\n@media (min-width: 490px) {\n\n.qsch1dlpOHc- {\n top: 100%;\n bottom: auto;\n margin-top: calc(16px / 8);\n margin-top: var(--space-smallest);\n}\n }\n\n@media (--small-screens-and-up) {\n\n.qsch1dlpOHc- {\n top: 100%;\n bottom: auto;\n margin-top: calc(16px / 8);\n margin-top: var(--space-smallest);\n}\n }\n\n@media (min-width: 490px) {\n\n._0xR9-oxWMOU- {\n right: 0;\n left: auto;\n}\n }\n\n@media (--small-screens-and-up) {\n\n._0xR9-oxWMOU- {\n right: 0;\n left: auto;\n}\n }\n\n@media (min-width: 490px) {\n\n.gaZwsdyoG0k- {\n right: auto;\n left: 0;\n}\n }\n\n@media (--small-screens-and-up) {\n\n.gaZwsdyoG0k- {\n right: auto;\n left: 0;\n}\n }\n\n.LaKFjYCLHZc- {\n padding: calc(16px / 2) 0;\n padding: var(--space-small) 0;\n border-bottom: calc(16px / 16) dotted rgb(217, 223, 225);\n border-bottom: var(--border-base) dotted var(--color-border);\n}\n\n.LaKFjYCLHZc-:first-of-type {\n padding-top: 0;\n}\n\n.LaKFjYCLHZc-:last-of-type {\n padding-bottom: 0;\n border-bottom: none;\n}\n\n._7HB7dWnqCi0- {\n padding: calc(16px / 2);\n padding: var(--space-small);\n}\n\n.ZuceCiefKqw- {\n display: -ms-flexbox;\n display: flex;\n width: 100%;\n padding: calc(16px / 2);\n padding: var(--space-small);\n border: none;\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n background-color: transparent;\n cursor: pointer;\n -ms-flex-align: center;\n align-items: center;\n}\n\n.ZuceCiefKqw-:hover,\n.ZuceCiefKqw-:focus {\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n outline-color: rgb(147, 161, 169);\n outline-color: var(--color-focus);\n}\n\n.Bz8TONF8kws- {\n margin-right: calc(16px * 1);\n margin-right: var(--space-base);\n}\n\n.eKnUAucwwWU- {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 6;\n z-index: var(--elevation-menu);\n background-color: rgba(0, 0, 0, 0.32);\n background-color: var(--color-overlay);\n}\n\n@media (min-width: 490px) {\n\n.eKnUAucwwWU- {\n background-color: transparent;\n}\n }\n\n@media (--small-screens-and-up) {\n\n.eKnUAucwwWU- {\n background-color: transparent;\n}\n }\n\n.oaxefr58z-E- {\n width: 100%;\n}\n\n.vz9opIdwHFg- {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n}\n";
20
- var styles = {"wrapper":"dT6M9tp1sZc-","menu":"Qmxlsj0D3qM-","above":"QTisUfiHwL4-","below":"qsch1dlpOHc-","left":"_0xR9-oxWMOU-","right":"gaZwsdyoG0k-","section":"LaKFjYCLHZc-","sectionHeader":"_7HB7dWnqCi0-","action":"ZuceCiefKqw-","icon":"Bz8TONF8kws-","overlay":"eKnUAucwwWU-","fullWidth":"oaxefr58z-E-","screenReaderOnly":"vz9opIdwHFg-"};
19
+ var css_248z = ".Menu__wrapper---retheme- * {\n box-sizing: border-box;\n}\n\n.Menu__wrapper---retheme- {\n display: inline-block;\n position: relative;\n}\n\n.Menu__menu---retheme- {\n position: fixed;\n bottom: 0;\n left: 0;\n z-index: 6;\n z-index: var(--elevation-menu);\n width: 100%;\n max-height: 72vh;\n padding: calc(16px / 2);\n padding: var(--space-small);\n padding-bottom: calc(env(safe-area-inset-bottom) + (16px / 2));\n padding-bottom: calc(env(safe-area-inset-bottom) + calc(16px / 2));\n padding-bottom: calc(env(safe-area-inset-bottom) + var(--space-small));\n border-radius: calc(16px / 8) calc(16px / 8) 0 0;\n border-radius: var(--radius-base) var(--radius-base) 0 0;\n -webkit-overflow-scrolling: touch;\n overflow-y: scroll;\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n@media (min-width: 490px) {\n\n.Menu__menu---retheme- {\n position: absolute;\n left: auto;\n width: calc(16px * 12.5);\n width: calc(var(--base-unit) * 12.5);\n box-shadow: 0px calc(16px / 16) calc(16px / 4) 0px\n rgba(0, 0, 0, 0.1),\n 0px calc(16px / 4) 12px 0px rgba(0, 0, 0, 0.05);\n box-shadow: var(--shadow-base);\n padding: calc(16px / 2);\n padding: var(--space-small);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n overflow: auto;\n}\n }\n\n@media (--small-screens-and-up) {\n\n.Menu__menu---retheme- {\n position: absolute;\n left: auto;\n width: calc(16px * 12.5);\n width: calc(var(--base-unit) * 12.5);\n box-shadow: 0px calc(16px / 16) calc(16px / 4) 0px\n rgba(0, 0, 0, 0.1),\n 0px calc(16px / 4) 12px 0px rgba(0, 0, 0, 0.05);\n box-shadow: var(--shadow-base);\n padding: calc(16px / 2);\n padding: var(--space-small);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n overflow: auto;\n}\n }\n\n@media (min-width: 490px) {\n\n.Menu__above---retheme- {\n bottom: 100%;\n margin-bottom: calc(16px / 8);\n margin-bottom: var(--space-smallest);\n}\n }\n\n@media (--small-screens-and-up) {\n\n.Menu__above---retheme- {\n bottom: 100%;\n margin-bottom: calc(16px / 8);\n margin-bottom: var(--space-smallest);\n}\n }\n\n@media (min-width: 490px) {\n\n.Menu__below---retheme- {\n top: 100%;\n bottom: auto;\n margin-top: calc(16px / 8);\n margin-top: var(--space-smallest);\n}\n }\n\n@media (--small-screens-and-up) {\n\n.Menu__below---retheme- {\n top: 100%;\n bottom: auto;\n margin-top: calc(16px / 8);\n margin-top: var(--space-smallest);\n}\n }\n\n@media (min-width: 490px) {\n\n.Menu__left---retheme- {\n right: 0;\n left: auto;\n}\n }\n\n@media (--small-screens-and-up) {\n\n.Menu__left---retheme- {\n right: 0;\n left: auto;\n}\n }\n\n@media (min-width: 490px) {\n\n.Menu__right---retheme- {\n right: auto;\n left: 0;\n}\n }\n\n@media (--small-screens-and-up) {\n\n.Menu__right---retheme- {\n right: auto;\n left: 0;\n}\n }\n\n.Menu__section---retheme- {\n padding: calc(16px / 2) 0;\n padding: var(--space-small) 0;\n border-bottom: calc(16px / 16) dotted rgb(217, 223, 225);\n border-bottom: var(--border-base) dotted var(--color-border);\n}\n\n.Menu__section---retheme-:first-of-type {\n padding-top: 0;\n}\n\n.Menu__section---retheme-:last-of-type {\n padding-bottom: 0;\n border-bottom: none;\n}\n\n.Menu__sectionHeader---retheme- {\n padding: calc(16px / 2);\n padding: var(--space-small);\n}\n\n.Menu__action---retheme- {\n display: -ms-flexbox;\n display: flex;\n width: 100%;\n padding: calc(16px / 2);\n padding: var(--space-small);\n border: none;\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n background-color: transparent;\n cursor: pointer;\n -ms-flex-align: center;\n align-items: center;\n}\n\n.Menu__action---retheme-:hover,\n.Menu__action---retheme-:focus {\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n outline-color: rgb(147, 161, 169);\n outline-color: var(--color-focus);\n}\n\n.Menu__icon---retheme- {\n margin-right: calc(16px * 1);\n margin-right: var(--space-base);\n}\n\n.Menu__overlay---retheme- {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 6;\n z-index: var(--elevation-menu);\n background-color: rgba(0, 0, 0, 0.32);\n background-color: var(--color-overlay);\n}\n\n@media (min-width: 490px) {\n\n.Menu__overlay---retheme- {\n background-color: transparent;\n}\n }\n\n@media (--small-screens-and-up) {\n\n.Menu__overlay---retheme- {\n background-color: transparent;\n}\n }\n\n.Menu__fullWidth---retheme- {\n width: 100%;\n}\n\n.Menu__screenReaderOnly---retheme- {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n}\n";
20
+ var styles = {"wrapper":"Menu__wrapper---retheme-","menu":"Menu__menu---retheme-","above":"Menu__above---retheme-","below":"Menu__below---retheme-","left":"Menu__left---retheme-","right":"Menu__right---retheme-","section":"Menu__section---retheme-","sectionHeader":"Menu__sectionHeader---retheme-","action":"Menu__action---retheme-","icon":"Menu__icon---retheme-","overlay":"Menu__overlay---retheme-","fullWidth":"Menu__fullWidth---retheme-","screenReaderOnly":"Menu__screenReaderOnly---retheme-"};
21
21
  styleInject_es.styleInject(css_248z);
22
22
 
23
23
  const variation = {
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var Modal = require('../Modal-70daa0e2.js');
5
+ var Modal = require('../Modal-112928c4.js');
6
6
  require('react');
7
7
  require('react-dom');
8
8
  require('classnames');
@@ -11,13 +11,13 @@ require('@jobber/hooks/useRefocusOnActivator');
11
11
  require('@jobber/hooks/useOnKeyDown');
12
12
  require('@jobber/hooks/useFocusTrap');
13
13
  require('../style-inject.es-9d2f5f4e.js');
14
- require('../Heading-0f4ecb0c.js');
15
- require('../Typography-973b122e.js');
16
- require('../Button-163a0641.js');
14
+ require('../Heading-33d621dd.js');
15
+ require('../Typography-702ee9a7.js');
16
+ require('../Button-315fdd36.js');
17
17
  require('react-router-dom');
18
18
  require('../Icon-405a216c.js');
19
19
  require('@jobber/design');
20
- require('../ButtonDismiss-2b98d075.js');
20
+ require('../ButtonDismiss-10b55ea8.js');
21
21
 
22
22
 
23
23
 
@@ -8,9 +8,9 @@ var useRefocusOnActivator = require('@jobber/hooks/useRefocusOnActivator');
8
8
  var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
9
9
  var useFocusTrap = require('@jobber/hooks/useFocusTrap');
10
10
  var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
11
- var Heading = require('./Heading-0f4ecb0c.js');
12
- var Button = require('./Button-163a0641.js');
13
- var ButtonDismiss = require('./ButtonDismiss-2b98d075.js');
11
+ var Heading = require('./Heading-33d621dd.js');
12
+ var Button = require('./Button-315fdd36.js');
13
+ var ButtonDismiss = require('./ButtonDismiss-10b55ea8.js');
14
14
 
15
15
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
16
16
 
@@ -18,12 +18,12 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
18
18
  var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
19
19
  var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
20
20
 
21
- var css_248z$1 = ":root {\n --modal--width: calc(var(--base-unit) * 37.5);\n --modal--padding-horizontal: var(--space-base);\n --modal--padding-vertical: var(--space-base);\n --modal--padding: var(--modal--padding-vertical)\n var(--modal--padding-horizontal);\n}\n\n@media (min-width: 768px) {\n\n:root {\n --modal--padding-horizontal: var(--space-large);\n}\n }\n\n@media (--medium-screens-and-up) {\n\n:root {\n --modal--padding-horizontal: var(--space-large);\n}\n }\n\n.QGRLFHPoV5E- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-direction: column;\n flex-direction: column;\n z-index: 1001;\n z-index: var(--elevation-modal);\n padding: calc(16px / 2);\n padding: var(--space-small);\n overflow: auto;\n}\n\n.QGRLFHPoV5E-,\n._4WzGOMUGj5I- {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n}\n\n._4WzGOMUGj5I- {\n background-color: rgba(0, 0, 0, 0.32);\n background-color: var(--color-overlay);\n}\n\n.WLId2NJBQcQ- {\n position: relative;\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n width: 100%;\n max-width: calc(16px * 37.5);\n max-width: var(--modal--width);\n margin: auto;\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n outline-color: rgb(147, 161, 169);\n outline-color: var(--color-focus);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n/* Adjust `Content` and `Tab` components public padding to match the modal */\n\n.WLId2NJBQcQ- > * {\n --public-content--padding: var(--modal--padding);\n --public-tab--inset: var(--modal--padding-horizontal);\n}\n\n/* Remove the nested `Content` components public padding */\n\n.WLId2NJBQcQ- > * > * {\n --public-content--padding: 0;\n}\n\n.wjrPpIUNNrk- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-align: center;\n align-items: center;\n padding: calc(16px * 1)\n calc(16px * 1);\n padding: var(--modal--padding);\n background-color: rgb(238, 240, 242);\n background-color: var(--color-surface--background);\n}\n\n.rKvigUnOyYE- {\n padding: 0;\n border: none;\n background-color: transparent;\n cursor: pointer;\n -webkit-appearance: none;\n appearance: none;\n}\n\n._62c8HLZFwvs- {\n display: -ms-flexbox;\n display: flex;\n padding: calc(16px * 1)\n calc(16px * 1);\n padding: var(--modal--padding);\n padding-top: 0;\n -ms-flex: 1 1 100%;\n flex: 1 1 100%;\n -ms-flex-pack: end;\n justify-content: flex-end;\n}\n\n/**\n * 1. Use CSS `order` to adjust the buttons position on the UI\n */\n\n.Xl1Ptn-P9Ew- {\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n -ms-flex-order: 1;\n order: 1; /* 1 */\n}\n\n.p2s7GtpoZz0- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n -ms-flex-order: 2;\n order: 2; /* 1 */\n}\n\n.p2s7GtpoZz0- > * {\n margin-left: calc(16px / 2);\n margin-left: var(--space-small);\n}\n\n.p2s7GtpoZz0- *:first-child {\n -ms-flex-order: 2;\n order: 2; /* 1 */\n}\n\n.p2s7GtpoZz0- *:nth-child(2) {\n -ms-flex-order: 1;\n order: 1; /* 1 */\n}\n";
22
- var styles = {"container":"QGRLFHPoV5E-","overlay":"_4WzGOMUGj5I-","modal":"WLId2NJBQcQ-","header":"wjrPpIUNNrk-","closeButton":"rKvigUnOyYE-","actionBar":"_62c8HLZFwvs-","leftAction":"Xl1Ptn-P9Ew-","rightAction":"p2s7GtpoZz0-"};
21
+ var css_248z$1 = ":root {\n --modal--width: calc(var(--base-unit) * 37.5);\n --modal--padding-horizontal: var(--space-base);\n --modal--padding-vertical: var(--space-base);\n --modal--padding: var(--modal--padding-vertical)\n var(--modal--padding-horizontal);\n}\n\n@media (min-width: 768px) {\n\n:root {\n --modal--padding-horizontal: var(--space-large);\n}\n }\n\n@media (--medium-screens-and-up) {\n\n:root {\n --modal--padding-horizontal: var(--space-large);\n}\n }\n\n.Modal__container---retheme- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-direction: column;\n flex-direction: column;\n z-index: 1001;\n z-index: var(--elevation-modal);\n padding: calc(16px / 2);\n padding: var(--space-small);\n overflow: auto;\n}\n\n.Modal__container---retheme-,\n.Modal__overlay---retheme- {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n}\n\n.Modal__overlay---retheme- {\n background-color: rgba(0, 0, 0, 0.32);\n background-color: var(--color-overlay);\n}\n\n.Modal__modal---retheme- {\n position: relative;\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n width: 100%;\n max-width: calc(16px * 37.5);\n max-width: var(--modal--width);\n margin: auto;\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n outline-color: rgb(147, 161, 169);\n outline-color: var(--color-focus);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n/* Adjust `Content` and `Tab` components public padding to match the modal */\n\n.Modal__modal---retheme- > * {\n --public-content--padding: var(--modal--padding);\n --public-tab--inset: var(--modal--padding-horizontal);\n}\n\n/* Remove the nested `Content` components public padding */\n\n.Modal__modal---retheme- > * > * {\n --public-content--padding: 0;\n}\n\n.Modal__header---retheme- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-align: center;\n align-items: center;\n padding: calc(16px * 1)\n calc(16px * 1);\n padding: var(--modal--padding);\n background-color: rgb(238, 240, 242);\n background-color: var(--color-surface--background);\n}\n\n.Modal__closeButton---retheme- {\n padding: 0;\n border: none;\n background-color: transparent;\n cursor: pointer;\n -webkit-appearance: none;\n appearance: none;\n}\n\n.Modal__actionBar---retheme- {\n display: -ms-flexbox;\n display: flex;\n padding: calc(16px * 1)\n calc(16px * 1);\n padding: var(--modal--padding);\n padding-top: 0;\n -ms-flex: 1 1 100%;\n flex: 1 1 100%;\n -ms-flex-pack: end;\n justify-content: flex-end;\n}\n\n/**\n * 1. Use CSS `order` to adjust the buttons position on the UI\n */\n\n.Modal__leftAction---retheme- {\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n -ms-flex-order: 1;\n order: 1; /* 1 */\n}\n\n.Modal__rightAction---retheme- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n -ms-flex-order: 2;\n order: 2; /* 1 */\n}\n\n.Modal__rightAction---retheme- > * {\n margin-left: calc(16px / 2);\n margin-left: var(--space-small);\n}\n\n.Modal__rightAction---retheme- *:first-child {\n -ms-flex-order: 2;\n order: 2; /* 1 */\n}\n\n.Modal__rightAction---retheme- *:nth-child(2) {\n -ms-flex-order: 1;\n order: 1; /* 1 */\n}\n";
22
+ var styles = {"container":"Modal__container---retheme-","overlay":"Modal__overlay---retheme-","modal":"Modal__modal---retheme-","header":"Modal__header---retheme-","closeButton":"Modal__closeButton---retheme-","actionBar":"Modal__actionBar---retheme-","leftAction":"Modal__leftAction---retheme-","rightAction":"Modal__rightAction---retheme-"};
23
23
  styleInject_es.styleInject(css_248z$1);
24
24
 
25
- var css_248z = "._65IpUjOZiBg- {\n --modal--padding: var(--space-base);\n --public-tab--inset: var(--space-base);\n max-width: calc(16px * 25);\n max-width: calc(var(--base-unit) * 25);\n}\n\n.Cpwnmw65caA- {\n max-width: calc(16px * 58.75);\n max-width: calc(var(--base-unit) * 58.75);\n}\n";
26
- var sizes = {"small":"_65IpUjOZiBg-","large":"Cpwnmw65caA-"};
25
+ var css_248z = ".Sizes__small---retheme- {\n --modal--padding: var(--space-base);\n --public-tab--inset: var(--space-base);\n max-width: calc(16px * 25);\n max-width: calc(var(--base-unit) * 25);\n}\n\n.Sizes__large---retheme- {\n max-width: calc(16px * 58.75);\n max-width: calc(var(--base-unit) * 58.75);\n}\n";
26
+ var sizes = {"small":"Sizes__small---retheme-","large":"Sizes__large---retheme-"};
27
27
  styleInject_es.styleInject(css_248z);
28
28
 
29
29
  function Modal({ open = false, title, size, dismissible = true, children, primaryAction, secondaryAction, tertiaryAction, onRequestClose, }) {
@@ -5,13 +5,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var React = require('react');
6
6
  var classnames = require('classnames');
7
7
  var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
8
- var Checkbox = require('../Checkbox-ad7ec2e7.js');
9
- var Text = require('../Text-4a2bc89f.js');
8
+ var Checkbox = require('../Checkbox-e13780f7.js');
9
+ var Text = require('../Text-982ed306.js');
10
10
  var Icon = require('../Icon-405a216c.js');
11
11
  require('../tslib.es6-5b8768b7.js');
12
12
  require('uuid');
13
13
  require('react-hook-form');
14
- require('../Typography-973b122e.js');
14
+ require('../Typography-702ee9a7.js');
15
15
  require('@jobber/design');
16
16
 
17
17
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -19,12 +19,12 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
19
19
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
20
20
  var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
21
21
 
22
- var css_248z$1 = ".D-J03az6XL4- {\n position: relative;\n width: 100%;\n}\n\n.D-J03az6XL4- * {\n box-sizing: border-box;\n}\n\n.EzNdHgwsT40- {\n --field--height: var(--space-largest);\n\n --field--padding-top: calc(var(--space-base) - var(--space-smallest));\n --field--padding-bottom: calc(var(--space-base) - var(--space-smallest));\n --field--padding-left: var(--space-base);\n --field--padding-right: var(--space-base);\n\n display: -ms-flexbox;\n\n display: flex;\n -ms-flex-direction: row;\n flex-direction: row;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-align: center;\n align-items: center;\n width: 100%;\n height: calc(16px * 3);\n height: var(--field--height);\n padding-top: calc((16px * 1) - (16px / 8));\n padding-top: calc(calc(16px * 1) - calc(16px / 8));\n padding-top: var(--field--padding-top);\n padding-bottom: calc((16px * 1) - (16px / 8));\n padding-bottom: calc(calc(16px * 1) - calc(16px / 8));\n padding-bottom: var(--field--padding-bottom);\n padding-left: calc(16px * 1);\n padding-left: var(--field--padding-left);\n padding-right: calc(16px * 1);\n padding-right: var(--field--padding-right);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n}\n\n.EzNdHgwsT40- p {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.D-J03az6XL4-:hover,\n.D-J03az6XL4-.EzNdHgwsT40- {\n cursor: pointer;\n caret-color: transparent;\n}\n\n.EzNdHgwsT40-:focus,\n.EzNdHgwsT40-.bu7HWKRu6HI- {\n box-shadow: 0px 0px 0px calc(16px / 8) rgba(255, 255, 255, 1),\n 0px 0px 0px calc(16px / 4) rgb(147, 161, 169);\n box-shadow: var(--shadow-focus);\n outline: none;\n}\n\n.eQ6yfQg6zLc- {\n --field--padding-left: calc(var(--space-base) - var(--space-smaller));\n --field--padding-right: calc(var(--space-base) - var(--space-smaller));\n --field--height: calc(var(--space-larger) + var(--space-smaller));\n}\n\n.pM-ts4-QMZY- {\n --field--padding-left: var(--space-large);\n --field--padding-right: var(--space-large);\n --field--height: calc(var(--space-extravagant));\n}\n";
23
- var styles$1 = {"multiSelectContainer":"D-J03az6XL4-","multiSelect":"EzNdHgwsT40-","active":"bu7HWKRu6HI-","small":"eQ6yfQg6zLc-","large":"pM-ts4-QMZY-"};
22
+ var css_248z$1 = ".MultiSelect__multiSelectContainer---retheme- {\n position: relative;\n width: 100%;\n}\n\n.MultiSelect__multiSelectContainer---retheme- * {\n box-sizing: border-box;\n}\n\n.MultiSelect__multiSelect---retheme- {\n --field--height: var(--space-largest);\n\n --field--padding-top: calc(var(--space-base) - var(--space-smallest));\n --field--padding-bottom: calc(var(--space-base) - var(--space-smallest));\n --field--padding-left: var(--space-base);\n --field--padding-right: var(--space-base);\n\n display: -ms-flexbox;\n\n display: flex;\n -ms-flex-direction: row;\n flex-direction: row;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-align: center;\n align-items: center;\n width: 100%;\n height: calc(16px * 3);\n height: var(--field--height);\n padding-top: calc((16px * 1) - (16px / 8));\n padding-top: calc(calc(16px * 1) - calc(16px / 8));\n padding-top: var(--field--padding-top);\n padding-bottom: calc((16px * 1) - (16px / 8));\n padding-bottom: calc(calc(16px * 1) - calc(16px / 8));\n padding-bottom: var(--field--padding-bottom);\n padding-left: calc(16px * 1);\n padding-left: var(--field--padding-left);\n padding-right: calc(16px * 1);\n padding-right: var(--field--padding-right);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n}\n\n.MultiSelect__multiSelect---retheme- p {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.MultiSelect__multiSelectContainer---retheme-:hover,\n.MultiSelect__multiSelectContainer---retheme-.MultiSelect__multiSelect---retheme- {\n cursor: pointer;\n caret-color: transparent;\n}\n\n.MultiSelect__multiSelect---retheme-:focus,\n.MultiSelect__multiSelect---retheme-.MultiSelect__active---retheme- {\n box-shadow: 0px 0px 0px calc(16px / 8) rgba(255, 255, 255, 1),\n 0px 0px 0px calc(16px / 4) rgb(147, 161, 169);\n box-shadow: var(--shadow-focus);\n outline: none;\n}\n\n.MultiSelect__small---retheme- {\n --field--padding-left: calc(var(--space-base) - var(--space-smaller));\n --field--padding-right: calc(var(--space-base) - var(--space-smaller));\n --field--height: calc(var(--space-larger) + var(--space-smaller));\n}\n\n.MultiSelect__large---retheme- {\n --field--padding-left: var(--space-large);\n --field--padding-right: var(--space-large);\n --field--height: calc(var(--space-extravagant));\n}\n";
23
+ var styles$1 = {"multiSelectContainer":"MultiSelect__multiSelectContainer---retheme-","multiSelect":"MultiSelect__multiSelect---retheme-","active":"MultiSelect__active---retheme-","small":"MultiSelect__small---retheme-","large":"MultiSelect__large---retheme-"};
24
24
  styleInject_es.styleInject(css_248z$1);
25
25
 
26
- var css_248z = "._0SStdD4KRHs- {\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n z-index: 6;\n z-index: var(--elevation-menu);\n width: 100%;\n max-height: calc((16px * 4) * 5);\n max-height: calc(calc(16px * 4) * 5);\n max-height: calc(var(--space-extravagant) * 5);\n box-shadow: 0px calc(16px / 16) calc(16px / 4) 0px\n rgba(0, 0, 0, 0.1),\n 0px calc(16px / 4) 12px 0px rgba(0, 0, 0, 0.05);\n box-shadow: var(--shadow-base);\n margin: 0;\n padding: 0;\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 4);\n border-radius: var(--radius-large);\n overflow: auto;\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n -ms-flex-direction: column;\n flex-direction: column;\n scroll-behavior: smooth;\n}\n\n._0SStdD4KRHs- li {\n list-style: none;\n}\n\n.mFSgwOQZJm0- {\n display: -ms-flexbox;\n display: flex;\n width: 100%;\n padding: calc(16px / 2) calc(16px * 1);\n padding: var(--space-small) var(--space-base);\n cursor: pointer;\n transition: all 200ms;\n transition: all var(--timing-base);\n}\n\n.mFSgwOQZJm0-:focus,\n.mFSgwOQZJm0-.SepF4gvOxq8- {\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n outline-color: rgb(147, 161, 169);\n outline-color: var(--color-focus);\n}\n";
27
- var styles = {"dropDownMenuContainer":"_0SStdD4KRHs-","option":"mFSgwOQZJm0-","active":"SepF4gvOxq8-"};
26
+ var css_248z = ".DropDownMenu__dropDownMenuContainer---retheme- {\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n z-index: 6;\n z-index: var(--elevation-menu);\n width: 100%;\n max-height: calc((16px * 4) * 5);\n max-height: calc(calc(16px * 4) * 5);\n max-height: calc(var(--space-extravagant) * 5);\n box-shadow: 0px calc(16px / 16) calc(16px / 4) 0px\n rgba(0, 0, 0, 0.1),\n 0px calc(16px / 4) 12px 0px rgba(0, 0, 0, 0.05);\n box-shadow: var(--shadow-base);\n margin: 0;\n padding: 0;\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 4);\n border-radius: var(--radius-large);\n overflow: auto;\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n -ms-flex-direction: column;\n flex-direction: column;\n scroll-behavior: smooth;\n}\n\n.DropDownMenu__dropDownMenuContainer---retheme- li {\n list-style: none;\n}\n\n.DropDownMenu__option---retheme- {\n display: -ms-flexbox;\n display: flex;\n width: 100%;\n padding: calc(16px / 2) calc(16px * 1);\n padding: var(--space-small) var(--space-base);\n cursor: pointer;\n transition: all 200ms;\n transition: all var(--timing-base);\n}\n\n.DropDownMenu__option---retheme-:focus,\n.DropDownMenu__option---retheme-.DropDownMenu__active---retheme- {\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n outline-color: rgb(147, 161, 169);\n outline-color: var(--color-focus);\n}\n";
27
+ var styles = {"dropDownMenuContainer":"DropDownMenu__dropDownMenuContainer---retheme-","option":"DropDownMenu__option---retheme-","active":"DropDownMenu__active---retheme-"};
28
28
  styleInject_es.styleInject(css_248z);
29
29
 
30
30
  function DropDownMenu({ options, setOptions }) {
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  var React = require('react');
4
- var FormField = require('./FormField-dfc061ca.js');
4
+ var FormField = require('./FormField-81f94a56.js');
5
5
 
6
6
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
7
7