@jobber/components 4.68.14 → 4.68.16
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.
- package/dist/Autocomplete/index.js +5 -4
- package/dist/Banner/Banner.d.ts +2 -2
- package/dist/Banner/Banner.types.d.ts +1 -0
- package/dist/Banner/components/BannerIcon/BannerIcon.d.ts +4 -2
- package/dist/Banner/index.d.ts +2 -1
- package/dist/Banner/index.js +44 -15
- package/dist/Button/index.js +1 -1
- package/dist/{Button-ce519335.js → Button-b73a5e01.js} +1 -1
- package/dist/ButtonDismiss/index.js +2 -2
- package/dist/{ButtonDismiss-099ad8fa.js → ButtonDismiss-350af163.js} +1 -1
- package/dist/Card/index.js +5 -4
- package/dist/{Card-104904ba.js → Card-644dd256.js} +3 -3
- package/dist/Chip/index.js +2 -2
- package/dist/{Chip-22700379.js → Chip-c91fd6c8.js} +1 -1
- package/dist/Chips/index.js +2 -2
- package/dist/Combobox/index.js +4 -4
- package/dist/{Combobox-fbd25ef7.js → Combobox-95b3c413.js} +5 -5
- package/dist/ConfirmationModal/index.js +7 -6
- package/dist/{ConfirmationModal-e1c1af73.js → ConfirmationModal-189e107a.js} +2 -2
- package/dist/DataDump/index.js +5 -4
- package/dist/DataList/index.js +11 -10
- package/dist/DataTable/index.js +3 -3
- package/dist/DatePicker/index.js +2 -2
- package/dist/{DatePicker-73ab88dd.js → DatePicker-64c5ab1a.js} +1 -1
- package/dist/Drawer/index.js +5 -4
- package/dist/FeatureSwitch/index.js +4 -3
- package/dist/FormField/index.js +2 -2
- package/dist/{FormField-dc73a8e4.js → FormField-18cda9ed.js} +1 -1
- package/dist/FormatFile/index.js +8 -7
- package/dist/{FormatFile-45a3d625.js → FormatFile-aae6c6e2.js} +2 -2
- package/dist/Gallery/index.js +9 -8
- package/dist/Heading/index.js +2 -1
- package/dist/{Heading-8940f2a3.js → Heading-1e8e4bd3.js} +2 -11
- package/dist/InputAvatar/index.js +2 -2
- package/dist/InputDate/index.js +3 -3
- package/dist/InputEmail/index.js +2 -2
- package/dist/InputFile/index.js +2 -2
- package/dist/{InputFile-65829a06.js → InputFile-65bfbd78.js} +1 -1
- package/dist/InputNumber/index.js +3 -3
- package/dist/{InputNumber-eb187377.js → InputNumber-29416358.js} +1 -1
- package/dist/InputPassword/index.js +2 -2
- package/dist/InputPhoneNumber/index.js +2 -2
- package/dist/InputText/index.js +3 -3
- package/dist/{InputText-9386ad9b.js → InputText-0e3c927f.js} +1 -1
- package/dist/InputTime/index.js +2 -2
- package/dist/LightBox/index.js +3 -3
- package/dist/{LightBox-9f7f6764.js → LightBox-a1b87af7.js} +2 -2
- package/dist/List/index.js +3 -2
- package/dist/Markdown/index.js +3 -2
- package/dist/{Markdown-908e8da0.js → Markdown-b80706ed.js} +1 -1
- package/dist/Menu/index.js +2 -2
- package/dist/{Menu-5b156261.js → Menu-da5d8217.js} +2 -2
- package/dist/Modal/index.js +5 -4
- package/dist/{Modal-bdf40fe4.js → Modal-a0627c92.js} +3 -3
- package/dist/{Option-0c97b8d6.js → Option-a4f8abe7.js} +1 -1
- package/dist/Page/index.js +5 -4
- package/dist/Popover/index.js +2 -2
- package/dist/RecurringSelect/index.js +4 -4
- package/dist/Select/index.js +3 -3
- package/dist/Toast/index.js +1 -1
- package/dist/Tooltip/index.js +1 -1
- package/dist/{Tooltip-6b12f1c2.js → Tooltip-27771182.js} +1 -1
- package/dist/getAtlantisConfig-0f3e8af2.js +13 -0
- package/package.json +2 -2
|
@@ -12,15 +12,16 @@ var reactPopper = require('react-popper');
|
|
|
12
12
|
var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
|
|
13
13
|
var Text = require('../Text-259af966.js');
|
|
14
14
|
var Icon = require('../Icon-405a216c.js');
|
|
15
|
-
var Heading = require('../Heading-
|
|
16
|
-
var InputText = require('../InputText-
|
|
15
|
+
var Heading = require('../Heading-1e8e4bd3.js');
|
|
16
|
+
var InputText = require('../InputText-0e3c927f.js');
|
|
17
17
|
require('../Typography-c45bf216.js');
|
|
18
18
|
require('@jobber/design');
|
|
19
|
-
require('../
|
|
19
|
+
require('../getAtlantisConfig-0f3e8af2.js');
|
|
20
|
+
require('../FormField-18cda9ed.js');
|
|
20
21
|
require('uuid');
|
|
21
22
|
require('react-hook-form');
|
|
22
23
|
require('@jobber/hooks/useShowClear');
|
|
23
|
-
require('../Button-
|
|
24
|
+
require('../Button-b73a5e01.js');
|
|
24
25
|
require('react-router-dom');
|
|
25
26
|
require('../InputValidation-a7a737f9.js');
|
|
26
27
|
require('framer-motion');
|
package/dist/Banner/Banner.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ReactNode } from "react";
|
|
2
2
|
import { IconNames } from "@jobber/design";
|
|
3
|
+
import { BannerType } from "./Banner.types";
|
|
3
4
|
import { ButtonProps } from "../Button";
|
|
4
|
-
export type BannerType = "notice" | "success" | "warning" | "error";
|
|
5
5
|
interface BannerProps {
|
|
6
6
|
readonly children: ReactNode;
|
|
7
7
|
readonly type: BannerType;
|
|
@@ -20,5 +20,5 @@ interface BannerProps {
|
|
|
20
20
|
readonly icon?: IconNames;
|
|
21
21
|
onDismiss?(): void;
|
|
22
22
|
}
|
|
23
|
-
export declare function Banner({ children, type, primaryAction, dismissible, icon, onDismiss, }: BannerProps): JSX.Element;
|
|
23
|
+
export declare function Banner({ children, type, primaryAction, dismissible, icon, onDismiss, }: BannerProps): JSX.Element | null;
|
|
24
24
|
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type BannerType = "notice" | "success" | "warning" | "error";
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { IconNames } from "@jobber/design";
|
|
3
|
+
import { BannerType } from "../../Banner.types";
|
|
3
4
|
export interface BannerIconProps {
|
|
4
|
-
icon: IconNames;
|
|
5
|
+
readonly icon: IconNames;
|
|
6
|
+
readonly type: BannerType;
|
|
5
7
|
}
|
|
6
|
-
export declare function BannerIcon({ icon }: BannerIconProps): JSX.Element;
|
|
8
|
+
export declare function BannerIcon({ icon, type }: BannerIconProps): JSX.Element;
|
package/dist/Banner/index.d.ts
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export { Banner
|
|
1
|
+
export { Banner } from "./Banner";
|
|
2
|
+
export { BannerType } from "./Banner.types";
|
package/dist/Banner/index.js
CHANGED
|
@@ -6,9 +6,10 @@ var React = require('react');
|
|
|
6
6
|
var classnames = require('classnames');
|
|
7
7
|
var jobberHooks = require('@jobber/hooks/useResizeObserver');
|
|
8
8
|
var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
|
|
9
|
+
var getAtlantisConfig = require('../getAtlantisConfig-0f3e8af2.js');
|
|
9
10
|
var Icon = require('../Icon-405a216c.js');
|
|
10
11
|
var Text = require('../Text-259af966.js');
|
|
11
|
-
var Button = require('../Button-
|
|
12
|
+
var Button = require('../Button-b73a5e01.js');
|
|
12
13
|
require('@jobber/design');
|
|
13
14
|
require('../Typography-c45bf216.js');
|
|
14
15
|
require('react-router-dom');
|
|
@@ -18,20 +19,31 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
18
19
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
19
20
|
var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
|
|
20
21
|
|
|
21
|
-
var css_248z$
|
|
22
|
-
var styles = {"banner":"meuT8gYQPJU-","bannerChildren":"y4BapyZr-fo-","bannerContent":"_6v1woNSLEvc-","medium":"bocgLmEhcTU-","bannerAction":"rtNjEzmABX4-","closeButton":"lunQ5SOfyLg-"};
|
|
23
|
-
styleInject_es.styleInject(css_248z$
|
|
22
|
+
var css_248z$2 = ".meuT8gYQPJU- {\n display: -ms-flexbox;\n display: flex;\n position: relative;\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 * 1);\n padding: var(--space-base);\n color: rgb(66, 78, 86);\n color: var(--color-text);\n background-color: rgb(238, 240, 242);\n background-color: var(--color-surface--background);\n gap: calc(16px / 2);\n gap: var(--space-small);\n -ms-flex-align: center;\n align-items: center;\n}\n\n.jobber-retheme .meuT8gYQPJU- {\n padding: calc((16px * 1) - (16px / 4)) calc(16px * 1);\n padding: calc(calc(16px * 1) - calc(16px / 4)) calc(16px * 1);\n padding: calc(var(--space-base) - var(--space-smaller)) var(--space-base);\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 background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n.y4BapyZr-fo- > a {\n color: rgb(66, 78, 86);\n color: var(--color-text);\n}\n\n.y4BapyZr-fo- > a:hover {\n color: rgb(1, 41, 57);\n color: var(--color-blue);\n}\n\n._6v1woNSLEvc- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n gap: calc(16px / 2);\n gap: var(--space-small);\n -ms-flex-wrap: nowrap;\n flex-wrap: nowrap;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-align: start;\n align-items: flex-start;\n}\n\n@media (max-width: 489px) {\n\n._6v1woNSLEvc- {\n -ms-flex-wrap: wrap;\n flex-wrap: wrap;\n}\n }\n\n@media (--small-screens-and-below) {\n\n._6v1woNSLEvc- {\n -ms-flex-wrap: wrap;\n flex-wrap: wrap;\n}\n }\n\n.y4BapyZr-fo- {\n -ms-flex: 1;\n flex: 1;\n -ms-flex-item-align: center;\n align-self: center;\n}\n\n._6v1woNSLEvc- > *:last-child {\n margin-bottom: 0;\n}\n\n.bocgLmEhcTU- .y4BapyZr-fo- {\n -ms-flex: 1;\n flex: 1;\n}\n\n.rtNjEzmABX4- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n}\n\n@media (max-width: 489px) {\n\n.rtNjEzmABX4- {\n width: 100%;\n margin-top: calc(16px / 2);\n margin-top: var(--space-small);\n}\n }\n\n@media (--small-screens-and-below) {\n\n.rtNjEzmABX4- {\n width: 100%;\n margin-top: calc(16px / 2);\n margin-top: var(--space-small);\n}\n }\n\n.lunQ5SOfyLg- {\n margin: calc((16px / 8) * -1) 0;\n margin: calc(calc(16px / 8) * -1) 0;\n margin: calc(var(--space-smallest) * -1) 0;\n padding: calc(16px / 8);\n padding: var(--space-smallest);\n border: none;\n background-color: transparent;\n cursor: pointer;\n -webkit-appearance: none;\n appearance: none;\n -ms-flex: 0;\n flex: 0;\n -ms-flex-item-align: start;\n align-self: flex-start;\n}\n\n.lunQ5SOfyLg-:hover {\n background: rgba(0, 0, 0, 0.025);\n}\n\n.lunQ5SOfyLg-: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 background: rgba(0, 0, 0, 0.05);\n}\n";
|
|
23
|
+
var styles$1 = {"banner":"meuT8gYQPJU-","bannerChildren":"y4BapyZr-fo-","bannerContent":"_6v1woNSLEvc-","medium":"bocgLmEhcTU-","bannerAction":"rtNjEzmABX4-","closeButton":"lunQ5SOfyLg-"};
|
|
24
|
+
styleInject_es.styleInject(css_248z$2);
|
|
24
25
|
|
|
25
|
-
var css_248z = ".wWW-2T7rCV0- {\n background-color: rgb(226, 241, 250);\n background-color: var(--color-informative--surface);\n}\n\n/* Our Banner \"surface\" colors should be lighter than they are so we're leaving the following alone for now */\n\n._7h8FUHIkVjg- {\n background-color: rgb(203, 223, 159);\n background-color: var(--color-green--lighter);\n}\n\n.d5fXcE1L0lc- {\n background-color: rgb(241, 231, 159);\n background-color: var(--color-yellow--lighter);\n}\n\n.oYaw-T3c0IU- {\n background-color: rgb(255, 206, 194);\n background-color: var(--color-red--lighter);\n}\n";
|
|
26
|
+
var css_248z$1 = ".wWW-2T7rCV0- {\n background-color: rgb(226, 241, 250);\n background-color: var(--color-informative--surface);\n}\n\n/* Our Banner \"surface\" colors should be lighter than they are so we're leaving the following alone for now */\n\n._7h8FUHIkVjg- {\n background-color: rgb(203, 223, 159);\n background-color: var(--color-green--lighter);\n}\n\n.d5fXcE1L0lc- {\n background-color: rgb(241, 231, 159);\n background-color: var(--color-yellow--lighter);\n}\n\n.oYaw-T3c0IU- {\n background-color: rgb(255, 206, 194);\n background-color: var(--color-red--lighter);\n}\n";
|
|
26
27
|
var types = {"notice":"wWW-2T7rCV0-","success":"_7h8FUHIkVjg-","warning":"d5fXcE1L0lc-","error":"oYaw-T3c0IU-"};
|
|
28
|
+
styleInject_es.styleInject(css_248z$1);
|
|
29
|
+
|
|
30
|
+
var css_248z = ".vVsm1tTEkcs- {\n display: -ms-inline-flexbox;\n display: inline-flex;\n padding: calc(16px / 4);\n padding: var(--space-smaller);\n border-radius: 100%;\n border-radius: var(--radius-circle);\n background-color: rgb(238, 240, 242);\n background-color: var(--color-surface--background);\n}\n\n._5-B0X5vn0eA- {\n background-color: rgb(125, 176, 14);\n background-color: var(--color-success);\n}\n\n.r3hqur-vxwI- {\n background-color: rgb(201, 66, 33);\n background-color: var(--color-destructive);\n}\n\n.-c8TbjyV5YU- {\n background-color: rgb(221, 195, 15);\n background-color: var(--color-warning);\n}\n\n.bMc69fYWngM- {\n background-color: rgb(60, 162, 224);\n background-color: var(--color-informative);\n}\n";
|
|
31
|
+
var styles = {"wrapper":"vVsm1tTEkcs-","success":"_5-B0X5vn0eA-","error":"r3hqur-vxwI-","warning":"-c8TbjyV5YU-","notice":"bMc69fYWngM-"};
|
|
27
32
|
styleInject_es.styleInject(css_248z);
|
|
28
33
|
|
|
29
|
-
function BannerIcon({ icon }) {
|
|
34
|
+
function BannerIcon({ icon, type }) {
|
|
35
|
+
const { JOBBER_RETHEME } = getAtlantisConfig.getAtlantisConfig();
|
|
36
|
+
if (JOBBER_RETHEME) {
|
|
37
|
+
return (React__default["default"].createElement("span", { className: classnames__default["default"](styles.wrapper, styles[type]) },
|
|
38
|
+
React__default["default"].createElement(Icon.Icon, { name: icon, color: "white", size: "small" })));
|
|
39
|
+
}
|
|
30
40
|
return React__default["default"].createElement(Icon.Icon, { name: icon, color: "greyBlueDark" });
|
|
31
41
|
}
|
|
32
42
|
|
|
33
43
|
function Banner({ children, type, primaryAction, dismissible = true, icon, onDismiss, }) {
|
|
44
|
+
const { JOBBER_RETHEME } = getAtlantisConfig.getAtlantisConfig();
|
|
34
45
|
const [showBanner, setShowBanner] = React.useState(true);
|
|
46
|
+
const bannerIcon = icon || getBannerIcon(type);
|
|
35
47
|
const bannerWidths = {
|
|
36
48
|
small: 320,
|
|
37
49
|
medium: 480,
|
|
@@ -52,23 +64,40 @@ function Banner({ children, type, primaryAction, dismissible = true, icon, onDis
|
|
|
52
64
|
variation: type === "notice" ? "learning" : "work",
|
|
53
65
|
}, primaryAction);
|
|
54
66
|
}
|
|
55
|
-
const bannerClassNames = classnames__default["default"](styles.banner, types[type], {
|
|
56
|
-
[styles.medium]: bannerWidth >= bannerWidths.medium,
|
|
67
|
+
const bannerClassNames = classnames__default["default"](styles$1.banner, types[type], {
|
|
68
|
+
[styles$1.medium]: bannerWidth >= bannerWidths.medium,
|
|
57
69
|
});
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
70
|
+
if (!showBanner)
|
|
71
|
+
return null;
|
|
72
|
+
return (React__default["default"].createElement("div", { className: bannerClassNames, ref: bannerRef, role: type === "error" ? "alert" : "status" },
|
|
73
|
+
React__default["default"].createElement("div", { className: styles$1.bannerContent },
|
|
74
|
+
bannerIcon && React__default["default"].createElement(BannerIcon, { icon: bannerIcon, type: type }),
|
|
75
|
+
React__default["default"].createElement("div", { className: styles$1.bannerChildren },
|
|
62
76
|
React__default["default"].createElement(BannerChildren, null, children)),
|
|
63
|
-
primaryAction && (React__default["default"].createElement("div", { className: styles.bannerAction },
|
|
77
|
+
primaryAction && (React__default["default"].createElement("div", { className: styles$1.bannerAction },
|
|
64
78
|
React__default["default"].createElement(Button.Button, Object.assign({}, primaryAction))))),
|
|
65
|
-
dismissible && (React__default["default"].createElement("button", { className: styles.closeButton, onClick: handleClose, "aria-label": "Close this notification" },
|
|
66
|
-
React__default["default"].createElement(Icon.Icon, { name: "cross", color: iconColors[type] })))))
|
|
79
|
+
dismissible && (React__default["default"].createElement("button", { className: styles$1.closeButton, onClick: handleClose, "aria-label": "Close this notification" },
|
|
80
|
+
React__default["default"].createElement(Icon.Icon, { name: "cross", color: JOBBER_RETHEME ? "interactiveSubtle" : iconColors[type] })))));
|
|
67
81
|
function handleClose() {
|
|
68
82
|
setShowBanner(!showBanner);
|
|
69
83
|
onDismiss && onDismiss();
|
|
70
84
|
}
|
|
71
85
|
}
|
|
86
|
+
function getBannerIcon(type) {
|
|
87
|
+
const { JOBBER_RETHEME } = getAtlantisConfig.getAtlantisConfig();
|
|
88
|
+
if (!JOBBER_RETHEME)
|
|
89
|
+
return;
|
|
90
|
+
switch (type) {
|
|
91
|
+
case "notice":
|
|
92
|
+
return "starburst";
|
|
93
|
+
case "success":
|
|
94
|
+
return "checkmark";
|
|
95
|
+
case "warning":
|
|
96
|
+
return "help";
|
|
97
|
+
case "error":
|
|
98
|
+
return "alert";
|
|
99
|
+
}
|
|
100
|
+
}
|
|
72
101
|
function BannerChildren({ children, }) {
|
|
73
102
|
if (!children)
|
|
74
103
|
return React__default["default"].createElement(React__default["default"].Fragment, null);
|
package/dist/Button/index.js
CHANGED
|
@@ -12,7 +12,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
12
12
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
13
13
|
var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
|
|
14
14
|
|
|
15
|
-
var css_248z = ":root {\n --button--color-variation: var(--color-interactive);\n --button--color-variation--hover: var(--color-interactive--hover);\n --button--color-surface: var(--color-surface);\n --button--color-surface--hover: var(--color-surface--hover);\n --button--color-primaryLabel: var(--color-surface);\n\n --button--duration-loading: var(--timing-loading--extended);\n}\n\n.U9VsquOtk2I- {\n display: -ms-inline-flexbox;\n display: inline-flex;\n min-height: calc(16px * 2.25);\n min-height: calc(var(--base-unit) * 2.25);\n box-sizing: border-box;\n margin: 0;\n border: calc(16px / 16) solid rgb(125, 176, 14);\n border: var(--border-base) solid var(--button--color-variation);\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n color: rgb(125, 176, 14);\n color: var(--button--color-variation);\n -webkit-font-smoothing: antialiased;\n letter-spacing: calc(16px / 40);\n letter-spacing: var(--typography--letterSpacing-loose);\n text-align: center;\n -webkit-text-decoration: none;\n text-decoration: none;\n vertical-align: middle;\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--button--color-surface);\n cursor: pointer;\n transition: all 200ms ease-out;\n transition: all var(--timing-base) ease-out;\n -webkit-appearance: none;\n appearance: none;\n fill: rgb(125, 176, 14);\n fill: var(--button--color-variation);\n -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n\n.jobber-retheme .U9VsquOtk2I- {\n min-height: calc(16px * 2.5);\n min-height: calc(var(--base-unit) * 2.5);\n}\n\n.U9VsquOtk2I- * {\n fill: inherit !important;\n}\n\n.U9VsquOtk2I- * {\n color: inherit;\n /* required to over-ride very specific fill from <Icon> */\n}\n\n.jobber-retheme .U9VsquOtk2I- * {\n font-weight: 600 !important;\n}\n\n.jobber-retheme .U9VsquOtk2I- * {\n line-height: 1;\n letter-spacing: 0;\n /* post-retheme this can move into the TSX on L177 */\n}\n\n.U9VsquOtk2I-:hover,\na.U9VsquOtk2I-:hover,\n.U9VsquOtk2I-:focus-visible,\na.U9VsquOtk2I-:focus-visible,\n.U9VsquOtk2I-:active,\na.U9VsquOtk2I-:active {\n border-color: rgb(81, 114, 9);\n border-color: var(--button--color-variation--hover);\n color: rgb(81, 114, 9);\n color: var(--button--color-variation--hover);\n fill: rgb(81, 114, 9);\n fill: var(--button--color-variation--hover);\n background-color: rgb(244, 246, 250);\n background-color: var(--button--color-surface--hover);\n}\n\n.U9VsquOtk2I-:focus-visible,\na.U9VsquOtk2I-:focus-visible,\n.U9VsquOtk2I-:active,\na.U9VsquOtk2I-:active {\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: transparent;\n}\n\n/* Variation */\n\n.qkFQwI0PKfw- {\n --button--color-variation: var(--color-interactive);\n --button--color-variation--hover: var(--color-interactive--hover);\n}\n\n.jsKQEOBdJ0k- {\n --button--color-variation: var(--color-informative);\n --button--color-variation--hover: var(--color-informative--onSurface);\n}\n\n.jobber-retheme .jsKQEOBdJ0k- {\n --button--color-variation: var(--color-interactive--subtle);\n --button--color-variation--hover: var(--color-interactive--subtle--hover);\n}\n\n._4W8X0dxZDK4- {\n --button--color-variation: var(--color-destructive);\n --button--color-variation--hover: var(--color-destructive--hover);\n}\n\n/* Subtle is special because, by default, it's styled as a secondary button */\n\n.vDKO-cmh8vY- {\n --button--color-variation: var(--color-interactive--subtle);\n --button--color-variation--hover: var(--color-interactive--subtle--hover);\n}\n\n/* Type */\n\n.FXqN12jWtPo-:not(.vDKO-cmh8vY-):not(.bg-l22drjd0-),\n.FXqN12jWtPo-:not(.vDKO-cmh8vY-):not(.bg-l22drjd0-):hover,\n.FXqN12jWtPo-:not(.vDKO-cmh8vY-):not(.bg-l22drjd0-):focus-visible {\n color: rgba(255, 255, 255, 1);\n color: var(--button--color-primaryLabel);\n background-color: rgb(125, 176, 14);\n background-color: var(--button--color-variation);\n fill: rgba(255, 255, 255, 1);\n fill: var(--button--color-primaryLabel);\n}\n\n.FXqN12jWtPo-:not(.vDKO-cmh8vY-):not(.bg-l22drjd0-):hover,\n.FXqN12jWtPo-:not(.vDKO-cmh8vY-):not(.bg-l22drjd0-):focus-visible {\n background-color: rgb(81, 114, 9);\n background-color: var(--button--color-variation--hover);\n}\n\n.vDKO-cmh8vY-.FXqN12jWtPo- {\n color: rgb(125, 176, 14);\n color: var(--button--color-variation);\n fill: rgb(125, 176, 14);\n fill: var(--button--color-variation);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--button--color-surface);\n}\n\n.pf6G840lKdA-,\n.vDKO-cmh8vY-.FXqN12jWtPo- {\n border-color: rgb(125, 176, 14);\n border-color: var(--button--color-variation);\n}\n\n.jobber-retheme .pf6G840lKdA-,\n.jobber-retheme .vDKO-cmh8vY-.FXqN12jWtPo- {\n border-color: rgb(217, 223, 225);\n border-color: var(--color-border);\n}\n\n.vDKO-cmh8vY-.FXqN12jWtPo-:hover,\n.vDKO-cmh8vY-.FXqN12jWtPo-:focus-visible {\n color: rgb(81, 114, 9);\n color: var(--button--color-variation--hover);\n background-color: rgb(244, 246, 250);\n background-color: var(--button--color-surface--hover);\n fill: rgb(81, 114, 9);\n fill: var(--button--color-variation--hover);\n}\n\n.jobber-retheme .pf6G840lKdA-:hover,\n.jobber-retheme .vDKO-cmh8vY-.FXqN12jWtPo-:hover,\n.jobber-retheme .pf6G840lKdA-:focus-visible,\n.jobber-retheme .vDKO-cmh8vY-.FXqN12jWtPo-:focus-visible {\n border-color: rgb(81, 114, 9);\n border-color: var(--button--color-variation--hover);\n}\n\n.vDKO-cmh8vY-.pf6G840lKdA- {\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--button--color-surface);\n}\n\n.m7DbwRZWcNk-,\n.vDKO-cmh8vY-.pf6G840lKdA- {\n border-color: transparent;\n}\n\n.jobber-retheme .m7DbwRZWcNk- {\n border-color: rgb(217, 223, 225);\n border-color: var(--color-border);\n}\n\n.vDKO-cmh8vY-.pf6G840lKdA-:hover,\n.vDKO-cmh8vY-.pf6G840lKdA-:focus-visible {\n background-color: rgb(244, 246, 250);\n background-color: var(--button--color-surface--hover);\n}\n\n.m7DbwRZWcNk-:hover,\n.m7DbwRZWcNk-:focus-visible,\na.m7DbwRZWcNk-:hover,\na.m7DbwRZWcNk-:focus-visible,\n.vDKO-cmh8vY-.pf6G840lKdA-:hover,\n.vDKO-cmh8vY-.pf6G840lKdA-:focus-visible,\na.vDKO-cmh8vY-.pf6G840lKdA-:hover,\na.vDKO-cmh8vY-.pf6G840lKdA-:focus-visible {\n border-color: transparent;\n}\n\n.jobber-retheme .m7DbwRZWcNk-:hover,\n.jobber-retheme .m7DbwRZWcNk-:focus-visible,\n.jobber-retheme a.m7DbwRZWcNk-:hover,\n.jobber-retheme a.m7DbwRZWcNk-:focus-visible {\n border-color: rgb(81, 114, 9);\n border-color: var(--button--color-variation--hover);\n}\n\n.vDKO-cmh8vY-.m7DbwRZWcNk- {\n border-color: transparent;\n background-color: transparent;\n}\n\n.vDKO-cmh8vY-.m7DbwRZWcNk-:hover,\n.vDKO-cmh8vY-.m7DbwRZWcNk-:focus-visible,\na.vDKO-cmh8vY-.m7DbwRZWcNk-:hover,\na.vDKO-cmh8vY-.m7DbwRZWcNk-:focus-visible {\n border-color: transparent;\n color: rgb(66, 78, 86);\n color: var(--color-interactive--subtle--hover);\n fill: rgb(66, 78, 86);\n fill: var(--color-interactive--subtle--hover);\n}\n\n/* Disabled */\n\n.U9VsquOtk2I-.bg-l22drjd0-,\na.U9VsquOtk2I-.bg-l22drjd0-,\n.U9VsquOtk2I-.bg-l22drjd0-:hover,\na.U9VsquOtk2I-.bg-l22drjd0-:hover {\n border-color: rgb(225, 225, 225);\n border-color: var(--color-disabled--secondary);\n color: rgb(181, 181, 181);\n color: var(--color-disabled);\n -webkit-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: rgb(225, 225, 225);\n background-color: var(--color-disabled--secondary);\n fill: rgb(181, 181, 181);\n fill: var(--color-disabled);\n pointer-events: none;\n cursor: not-allowed;\n}\n\n/* Sizes */\n\n.STSDgSRREx4- {\n min-height: calc(16px * 1.5);\n min-height: calc(var(--base-unit) * 1.5);\n padding: 0 calc(16px / 2);\n padding: 0 var(--space-small);\n letter-spacing: 0;\n}\n\n.jobber-retheme .STSDgSRREx4- {\n min-height: calc(16px * 1.5);\n min-height: calc(var(--base-unit) * 1.5);\n padding: 0 calc((16px * 1) - (16px / 4));\n padding: 0 calc(calc(16px * 1) - calc(16px / 4));\n padding: 0 calc(var(--space-base) - var(--space-smaller));\n}\n\n.amIh7vPETfo- {\n padding: 0 calc((16px * 1) - (16px / 4));\n padding: 0 calc(calc(16px * 1) - calc(16px / 4));\n padding: 0 calc(var(--space-base) - var(--space-smaller));\n}\n\n.jobber-retheme .amIh7vPETfo- {\n padding: 0 calc(16px * 1);\n padding: 0 var(--space-base);\n}\n\n.ON6ezOojFVo- {\n min-height: calc(16px * 3);\n min-height: calc(var(--base-unit) * 3);\n padding: 0 calc(16px * 1);\n padding: 0 var(--space-base);\n}\n\n.jobber-retheme .ON6ezOojFVo- {\n min-height: calc(16px * 3);\n min-height: calc(var(--base-unit) * 3);\n padding: 0 calc((16px * 1) + (16px / 4));\n padding: 0 calc(calc(16px * 1) + calc(16px / 4));\n padding: 0 calc(var(--space-base) + var(--space-smaller));\n}\n\n/* Icon */\n\n.U9VsquOtk2I- svg {\n -ms-flex-negative: 0;\n flex-shrink: 0;\n}\n\n.Qq-idRLJTCk- {\n width: calc(16px * 2.25);\n width: calc(var(--base-unit) * 2.25);\n padding: 0;\n}\n\n.Qq-idRLJTCk-.STSDgSRREx4- {\n width: calc((16px / 2) * 3);\n width: calc(calc(16px / 2) * 3);\n width: calc(var(--space-small) * 3);\n}\n\n.Qq-idRLJTCk-.amIh7vPETfo- {\n width: calc((16px * 1) * 2.25);\n width: calc(calc(16px * 1) * 2.25);\n width: calc(var(--space-base) * 2.25);\n}\n\n.jobber-retheme .Qq-idRLJTCk-.amIh7vPETfo- {\n width: calc((16px * 1) * 2.5);\n width: calc(calc(16px * 1) * 2.5);\n width: calc(var(--space-base) * 2.5);\n}\n\n.Qq-idRLJTCk-.ON6ezOojFVo- {\n width: calc((16px * 1.5) * 2);\n width: calc(calc(16px * 1.5) * 2);\n width: calc(var(--space-large) * 2);\n}\n\n.EWh1gvgPJQg- {\n width: auto;\n gap: calc(16px / 2);\n gap: var(--space-small);\n}\n\n.jobber-retheme .EWh1gvgPJQg- {\n gap: calc(16px / 4);\n gap: var(--space-smaller);\n}\n\n/* Don't want to move things that will update after re-theme */\n\n/* stylelint-disable-next-line no-descending-specificity */\n\n.EWh1gvgPJQg- > * {\n text-align: left;\n}\n\n.pfzTUMgNb3o- > *:first-child {\n -ms-flex-order: 1;\n order: 1;\n}\n\n.jobber-retheme .EWh1gvgPJQg- > *:first-child {\n margin-left: calc((16px / 4) * -1);\n margin-left: calc(calc(16px / 4) * -1);\n margin-left: calc(var(--space-smaller) * -1);\n}\n\n.jobber-retheme .pfzTUMgNb3o- > *:first-child {\n margin-left: 0;\n margin-right: calc((16px / 4) * -1);\n margin-right: calc(calc(16px / 4) * -1);\n margin-right: calc(var(--space-smaller) * -1);\n}\n\n.ZCHqCEyLBw0- {\n width: 100%;\n}\n\n.VVFKEv1ksMA- {\n background-image: linear-gradient(\n 135deg,\n rgba(0, 0, 0, 0.1) 0%,\n rgba(0, 0, 0, 0.1) 25%,\n transparent 25%,\n transparent 50%,\n rgba(0, 0, 0, 0.1) 50%,\n rgba(0, 0, 0, 0.1) 75%,\n transparent 75%,\n transparent 100%\n );\n background-size: calc(16px * 2) calc(16px * 2);\n background-size: var(--space-larger) var(--space-larger);\n pointer-events: none;\n cursor: not-allowed;\n -webkit-animation-duration: 2000ms;\n -webkit-animation-duration: var(--button--duration-loading);\n animation-duration: 2000ms;\n animation-duration: var(--button--duration-loading);\n -webkit-animation-iteration-count: infinite;\n animation-iteration-count: infinite;\n -webkit-animation-name: a8Q-0lnKH5M-;\n animation-name: a8Q-0lnKH5M-;\n -webkit-animation-timing-function: linear;\n animation-timing-function: linear;\n}\n\n.FXqN12jWtPo-.VVFKEv1ksMA-:not(.vDKO-cmh8vY-) {\n background-image: linear-gradient(\n 135deg,\n rgba(255, 255, 255, 0.25) 0%,\n rgba(255, 255, 255, 0.25) 25%,\n transparent 25%,\n transparent 50%,\n rgba(255, 255, 255, 0.25) 50%,\n rgba(255, 255, 255, 0.25) 75%,\n transparent 75%,\n transparent 100%\n );\n}\n\n@-webkit-keyframes a8Q-0lnKH5M- {\n 0% {\n background-position: 0 0;\n }\n\n 100% {\n background-position: calc(16px * 2) calc(16px * 2);\n background-position: var(--space-larger) var(--space-larger);\n }\n}\n\n@keyframes a8Q-0lnKH5M- {\n 0% {\n background-position: 0 0;\n }\n\n 100% {\n background-position: calc(16px * 2) calc(16px * 2);\n background-position: var(--space-larger) var(--space-larger);\n }\n}\n";
|
|
15
|
+
var css_248z = ":root {\n --button--color-variation: var(--color-interactive);\n --button--color-variation--hover: var(--color-interactive--hover);\n --button--color-surface: var(--color-surface);\n --button--color-surface--hover: var(--color-surface--hover);\n --button--color-primaryLabel: var(--color-surface);\n\n --button--duration-loading: var(--timing-loading--extended);\n}\n\n.U9VsquOtk2I- {\n display: -ms-inline-flexbox;\n display: inline-flex;\n min-height: calc(16px * 2.25);\n min-height: calc(var(--base-unit) * 2.25);\n box-sizing: border-box;\n margin: 0;\n border: calc(16px / 16) solid rgb(125, 176, 14);\n border: var(--border-base) solid var(--button--color-variation);\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n color: rgb(125, 176, 14);\n color: var(--button--color-variation);\n -webkit-font-smoothing: antialiased;\n letter-spacing: calc(16px / 40);\n letter-spacing: var(--typography--letterSpacing-loose);\n text-align: center;\n -webkit-text-decoration: none;\n text-decoration: none;\n vertical-align: middle;\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--button--color-surface);\n cursor: pointer;\n transition: all 200ms ease-out;\n transition: all var(--timing-base) ease-out;\n -webkit-appearance: none;\n appearance: none;\n fill: rgb(125, 176, 14);\n fill: var(--button--color-variation);\n -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n\n.jobber-retheme .U9VsquOtk2I- {\n min-height: calc(16px * 2.5);\n min-height: calc(var(--base-unit) * 2.5);\n}\n\n.U9VsquOtk2I- * {\n fill: inherit !important;\n}\n\n.U9VsquOtk2I- * {\n color: inherit;\n /* required to over-ride very specific fill from <Icon> */\n}\n\n.jobber-retheme .U9VsquOtk2I- * {\n font-weight: 600 !important;\n}\n\n.jobber-retheme .U9VsquOtk2I- * {\n line-height: 1;\n letter-spacing: 0;\n /* post-retheme this can move into the TSX on L177 */\n}\n\n.U9VsquOtk2I-:hover,\na.U9VsquOtk2I-:hover,\n.U9VsquOtk2I-:focus-visible,\na.U9VsquOtk2I-:focus-visible,\n.U9VsquOtk2I-:active,\na.U9VsquOtk2I-:active {\n border-color: rgb(81, 114, 9);\n border-color: var(--button--color-variation--hover);\n color: rgb(81, 114, 9);\n color: var(--button--color-variation--hover);\n fill: rgb(81, 114, 9);\n fill: var(--button--color-variation--hover);\n background-color: rgb(244, 246, 250);\n background-color: var(--button--color-surface--hover);\n}\n\n.U9VsquOtk2I-:focus-visible,\na.U9VsquOtk2I-:focus-visible,\n.U9VsquOtk2I-:active,\na.U9VsquOtk2I-:active {\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: transparent;\n}\n\n/* Variation */\n\n.qkFQwI0PKfw- {\n --button--color-variation: var(--color-interactive);\n --button--color-variation--hover: var(--color-interactive--hover);\n}\n\n.jsKQEOBdJ0k- {\n --button--color-variation: var(--color-informative);\n --button--color-variation--hover: var(--color-informative--onSurface);\n}\n\n.jobber-retheme .jsKQEOBdJ0k- {\n --button--color-variation: var(--color-interactive--subtle);\n --button--color-variation--hover: var(--color-interactive--subtle--hover);\n}\n\n._4W8X0dxZDK4- {\n --button--color-variation: var(--color-destructive);\n --button--color-variation--hover: var(--color-destructive--hover);\n}\n\n/* Subtle is special because, by default, it's styled as a secondary button */\n\n.vDKO-cmh8vY- {\n --button--color-variation: var(--color-interactive--subtle);\n --button--color-variation--hover: var(--color-interactive--subtle--hover);\n}\n\n/* Type */\n\n.FXqN12jWtPo-:not(.vDKO-cmh8vY-):not(.bg-l22drjd0-),\n.FXqN12jWtPo-:not(.vDKO-cmh8vY-):not(.bg-l22drjd0-):hover,\n.FXqN12jWtPo-:not(.vDKO-cmh8vY-):not(.bg-l22drjd0-):focus-visible {\n color: rgba(255, 255, 255, 1);\n color: var(--button--color-primaryLabel);\n background-color: rgb(125, 176, 14);\n background-color: var(--button--color-variation);\n fill: rgba(255, 255, 255, 1);\n fill: var(--button--color-primaryLabel);\n}\n\n.FXqN12jWtPo-:not(.vDKO-cmh8vY-):not(.bg-l22drjd0-):hover,\n.FXqN12jWtPo-:not(.vDKO-cmh8vY-):not(.bg-l22drjd0-):focus-visible {\n background-color: rgb(81, 114, 9);\n background-color: var(--button--color-variation--hover);\n}\n\n.vDKO-cmh8vY-.FXqN12jWtPo- {\n color: rgb(125, 176, 14);\n color: var(--button--color-variation);\n fill: rgb(125, 176, 14);\n fill: var(--button--color-variation);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--button--color-surface);\n}\n\n.pf6G840lKdA-,\n.vDKO-cmh8vY-.FXqN12jWtPo- {\n border-color: rgb(125, 176, 14);\n border-color: var(--button--color-variation);\n}\n\n.jobber-retheme .pf6G840lKdA-,\n.jobber-retheme .vDKO-cmh8vY-.FXqN12jWtPo- {\n border-color: rgb(217, 223, 225);\n border-color: var(--color-border);\n}\n\n.vDKO-cmh8vY-.FXqN12jWtPo-:hover,\n.vDKO-cmh8vY-.FXqN12jWtPo-:focus-visible {\n color: rgb(81, 114, 9);\n color: var(--button--color-variation--hover);\n background-color: rgb(244, 246, 250);\n background-color: var(--button--color-surface--hover);\n fill: rgb(81, 114, 9);\n fill: var(--button--color-variation--hover);\n}\n\n.jobber-retheme .pf6G840lKdA-:hover,\n.jobber-retheme .vDKO-cmh8vY-.FXqN12jWtPo-:hover,\n.jobber-retheme .pf6G840lKdA-:focus-visible,\n.jobber-retheme .vDKO-cmh8vY-.FXqN12jWtPo-:focus-visible {\n border-color: rgb(81, 114, 9);\n border-color: var(--button--color-variation--hover);\n}\n\n.vDKO-cmh8vY-.pf6G840lKdA- {\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--button--color-surface);\n}\n\n.m7DbwRZWcNk-,\n.vDKO-cmh8vY-.pf6G840lKdA- {\n border-color: transparent;\n}\n\n.jobber-retheme .m7DbwRZWcNk- {\n border-color: rgb(217, 223, 225);\n border-color: var(--color-border);\n}\n\n.vDKO-cmh8vY-.pf6G840lKdA-:hover,\n.vDKO-cmh8vY-.pf6G840lKdA-:focus-visible {\n background-color: rgb(244, 246, 250);\n background-color: var(--button--color-surface--hover);\n}\n\n.m7DbwRZWcNk-:hover,\n.m7DbwRZWcNk-:focus-visible,\na.m7DbwRZWcNk-:hover,\na.m7DbwRZWcNk-:focus-visible,\n.vDKO-cmh8vY-.pf6G840lKdA-:hover,\n.vDKO-cmh8vY-.pf6G840lKdA-:focus-visible,\na.vDKO-cmh8vY-.pf6G840lKdA-:hover,\na.vDKO-cmh8vY-.pf6G840lKdA-:focus-visible {\n border-color: transparent;\n}\n\n.jobber-retheme .m7DbwRZWcNk-:hover,\n.jobber-retheme .m7DbwRZWcNk-:focus-visible,\n.jobber-retheme a.m7DbwRZWcNk-:hover,\n.jobber-retheme a.m7DbwRZWcNk-:focus-visible {\n border-color: rgb(81, 114, 9);\n border-color: var(--button--color-variation--hover);\n}\n\n.vDKO-cmh8vY-.m7DbwRZWcNk- {\n border-color: transparent;\n background-color: transparent;\n}\n\n.vDKO-cmh8vY-.m7DbwRZWcNk-:hover,\n.vDKO-cmh8vY-.m7DbwRZWcNk-:focus-visible,\na.vDKO-cmh8vY-.m7DbwRZWcNk-:hover,\na.vDKO-cmh8vY-.m7DbwRZWcNk-:focus-visible {\n border-color: transparent;\n color: rgb(66, 78, 86);\n color: var(--color-interactive--subtle--hover);\n fill: rgb(66, 78, 86);\n fill: var(--color-interactive--subtle--hover);\n}\n\n/* Disabled */\n\n.U9VsquOtk2I-.bg-l22drjd0-,\na.U9VsquOtk2I-.bg-l22drjd0-,\n.U9VsquOtk2I-.bg-l22drjd0-:hover,\na.U9VsquOtk2I-.bg-l22drjd0-:hover {\n border-color: rgb(225, 225, 225);\n border-color: var(--color-disabled--secondary);\n color: rgb(181, 181, 181);\n color: var(--color-disabled);\n -webkit-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: rgb(225, 225, 225);\n background-color: var(--color-disabled--secondary);\n fill: rgb(181, 181, 181);\n fill: var(--color-disabled);\n pointer-events: none;\n cursor: not-allowed;\n}\n\n/* Sizes */\n\n.STSDgSRREx4- {\n min-height: calc(16px * 1.5);\n min-height: calc(var(--base-unit) * 1.5);\n padding: 0 calc(16px / 2);\n padding: 0 var(--space-small);\n letter-spacing: 0;\n}\n\n.jobber-retheme .STSDgSRREx4- {\n min-height: calc(16px * 1.5);\n min-height: var(--space-large);\n padding: calc(16px / 2) calc((16px * 1) - (16px / 4));\n padding: calc(16px / 2) calc(calc(16px * 1) - calc(16px / 4));\n padding: var(--space-small) calc(var(--space-base) - var(--space-smaller));\n}\n\n.jobber-retheme .STSDgSRREx4- span {\n font-size: calc((16px * 1) * 0.875);\n font-size: calc(calc(16px * 1) * 0.875);\n font-size: var(--typography--fontSize-base);\n}\n\n.amIh7vPETfo- {\n padding: 0 calc((16px * 1) - (16px / 4));\n padding: 0 calc(calc(16px * 1) - calc(16px / 4));\n padding: 0 calc(var(--space-base) - var(--space-smaller));\n}\n\n.jobber-retheme .amIh7vPETfo- {\n padding: 0 calc(16px * 1);\n padding: 0 var(--space-base);\n}\n\n.ON6ezOojFVo- {\n min-height: calc(16px * 3);\n min-height: calc(var(--base-unit) * 3);\n padding: 0 calc(16px * 1);\n padding: 0 var(--space-base);\n}\n\n.jobber-retheme .ON6ezOojFVo- {\n min-height: calc(16px * 3);\n min-height: calc(var(--base-unit) * 3);\n padding: 0 calc((16px * 1) + (16px / 4));\n padding: 0 calc(calc(16px * 1) + calc(16px / 4));\n padding: 0 calc(var(--space-base) + var(--space-smaller));\n}\n\n/* Icon */\n\n.U9VsquOtk2I- svg {\n -ms-flex-negative: 0;\n flex-shrink: 0;\n}\n\n.Qq-idRLJTCk- {\n width: calc(16px * 2.25);\n width: calc(var(--base-unit) * 2.25);\n padding: 0;\n}\n\n.Qq-idRLJTCk-.STSDgSRREx4- {\n width: calc((16px / 2) * 3);\n width: calc(calc(16px / 2) * 3);\n width: calc(var(--space-small) * 3);\n}\n\n.Qq-idRLJTCk-.amIh7vPETfo- {\n width: calc((16px * 1) * 2.25);\n width: calc(calc(16px * 1) * 2.25);\n width: calc(var(--space-base) * 2.25);\n}\n\n.jobber-retheme .Qq-idRLJTCk-.amIh7vPETfo- {\n width: calc((16px * 1) * 2.5);\n width: calc(calc(16px * 1) * 2.5);\n width: calc(var(--space-base) * 2.5);\n}\n\n.Qq-idRLJTCk-.ON6ezOojFVo- {\n width: calc((16px * 1.5) * 2);\n width: calc(calc(16px * 1.5) * 2);\n width: calc(var(--space-large) * 2);\n}\n\n.EWh1gvgPJQg- {\n width: auto;\n gap: calc(16px / 2);\n gap: var(--space-small);\n}\n\n.jobber-retheme .EWh1gvgPJQg- {\n gap: calc(16px / 4);\n gap: var(--space-smaller);\n}\n\n/* Don't want to move things that will update after re-theme */\n\n/* stylelint-disable-next-line no-descending-specificity */\n\n.EWh1gvgPJQg- > * {\n text-align: left;\n}\n\n.pfzTUMgNb3o- > *:first-child {\n -ms-flex-order: 1;\n order: 1;\n}\n\n.jobber-retheme .EWh1gvgPJQg- > *:first-child {\n margin-left: calc((16px / 4) * -1);\n margin-left: calc(calc(16px / 4) * -1);\n margin-left: calc(var(--space-smaller) * -1);\n}\n\n.jobber-retheme .pfzTUMgNb3o- > *:first-child {\n margin-left: 0;\n margin-right: calc((16px / 4) * -1);\n margin-right: calc(calc(16px / 4) * -1);\n margin-right: calc(var(--space-smaller) * -1);\n}\n\n.ZCHqCEyLBw0- {\n width: 100%;\n}\n\n.VVFKEv1ksMA- {\n background-image: linear-gradient(\n 135deg,\n rgba(0, 0, 0, 0.1) 0%,\n rgba(0, 0, 0, 0.1) 25%,\n transparent 25%,\n transparent 50%,\n rgba(0, 0, 0, 0.1) 50%,\n rgba(0, 0, 0, 0.1) 75%,\n transparent 75%,\n transparent 100%\n );\n background-size: calc(16px * 2) calc(16px * 2);\n background-size: var(--space-larger) var(--space-larger);\n pointer-events: none;\n cursor: not-allowed;\n -webkit-animation-duration: 2000ms;\n -webkit-animation-duration: var(--button--duration-loading);\n animation-duration: 2000ms;\n animation-duration: var(--button--duration-loading);\n -webkit-animation-iteration-count: infinite;\n animation-iteration-count: infinite;\n -webkit-animation-name: a8Q-0lnKH5M-;\n animation-name: a8Q-0lnKH5M-;\n -webkit-animation-timing-function: linear;\n animation-timing-function: linear;\n}\n\n.FXqN12jWtPo-.VVFKEv1ksMA-:not(.vDKO-cmh8vY-) {\n background-image: linear-gradient(\n 135deg,\n rgba(255, 255, 255, 0.25) 0%,\n rgba(255, 255, 255, 0.25) 25%,\n transparent 25%,\n transparent 50%,\n rgba(255, 255, 255, 0.25) 50%,\n rgba(255, 255, 255, 0.25) 75%,\n transparent 75%,\n transparent 100%\n );\n}\n\n@-webkit-keyframes a8Q-0lnKH5M- {\n 0% {\n background-position: 0 0;\n }\n\n 100% {\n background-position: calc(16px * 2) calc(16px * 2);\n background-position: var(--space-larger) var(--space-larger);\n }\n}\n\n@keyframes a8Q-0lnKH5M- {\n 0% {\n background-position: 0 0;\n }\n\n 100% {\n background-position: calc(16px * 2) calc(16px * 2);\n background-position: var(--space-larger) var(--space-larger);\n }\n}\n";
|
|
16
16
|
var styles = {"button":"U9VsquOtk2I-","work":"qkFQwI0PKfw-","learning":"jsKQEOBdJ0k-","destructive":"_4W8X0dxZDK4-","subtle":"vDKO-cmh8vY-","primary":"FXqN12jWtPo-","disabled":"bg-l22drjd0-","secondary":"pf6G840lKdA-","tertiary":"m7DbwRZWcNk-","small":"STSDgSRREx4-","base":"amIh7vPETfo-","large":"ON6ezOojFVo-","onlyIcon":"Qq-idRLJTCk-","hasIconAndLabel":"EWh1gvgPJQg-","iconOnRight":"pfzTUMgNb3o-","fullWidth":"ZCHqCEyLBw0-","loading":"VVFKEv1ksMA-","animateStripes":"a8Q-0lnKH5M-"};
|
|
17
17
|
styleInject_es.styleInject(css_248z);
|
|
18
18
|
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var ButtonDismiss = require('../ButtonDismiss-
|
|
5
|
+
var ButtonDismiss = require('../ButtonDismiss-350af163.js');
|
|
6
6
|
require('react');
|
|
7
|
-
require('../Button-
|
|
7
|
+
require('../Button-b73a5e01.js');
|
|
8
8
|
require('classnames');
|
|
9
9
|
require('react-router-dom');
|
|
10
10
|
require('../style-inject.es-9d2f5f4e.js');
|
package/dist/Card/index.js
CHANGED
|
@@ -2,17 +2,18 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var Card = require('../Card-
|
|
5
|
+
var Card = require('../Card-644dd256.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('classnames');
|
|
8
8
|
require('../style-inject.es-9d2f5f4e.js');
|
|
9
|
-
require('../Heading-
|
|
9
|
+
require('../Heading-1e8e4bd3.js');
|
|
10
10
|
require('../Typography-c45bf216.js');
|
|
11
|
-
require('../
|
|
11
|
+
require('../getAtlantisConfig-0f3e8af2.js');
|
|
12
|
+
require('../Button-b73a5e01.js');
|
|
12
13
|
require('react-router-dom');
|
|
13
14
|
require('../Icon-405a216c.js');
|
|
14
15
|
require('@jobber/design');
|
|
15
|
-
require('../Menu-
|
|
16
|
+
require('../Menu-da5d8217.js');
|
|
16
17
|
require('uuid');
|
|
17
18
|
require('framer-motion');
|
|
18
19
|
require('@jobber/hooks/useOnKeyDown');
|
|
@@ -3,9 +3,9 @@
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
var classnames = require('classnames');
|
|
5
5
|
var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
|
|
6
|
-
var Heading = require('./Heading-
|
|
7
|
-
var Button = require('./Button-
|
|
8
|
-
var Menu = require('./Menu-
|
|
6
|
+
var Heading = require('./Heading-1e8e4bd3.js');
|
|
7
|
+
var Button = require('./Button-b73a5e01.js');
|
|
8
|
+
var Menu = require('./Menu-da5d8217.js');
|
|
9
9
|
|
|
10
10
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
11
11
|
|
package/dist/Chip/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var Chip = require('../Chip-
|
|
5
|
+
var Chip = require('../Chip-c91fd6c8.js');
|
|
6
6
|
var tslib_es6 = require('../tslib.es6-5b8768b7.js');
|
|
7
7
|
var React = require('react');
|
|
8
8
|
var Icon = require('../Icon-405a216c.js');
|
|
@@ -12,7 +12,7 @@ require('../style-inject.es-9d2f5f4e.js');
|
|
|
12
12
|
require('../Avatar-76a799fa.js');
|
|
13
13
|
require('color');
|
|
14
14
|
require('../Typography-c45bf216.js');
|
|
15
|
-
require('../Tooltip-
|
|
15
|
+
require('../Tooltip-27771182.js');
|
|
16
16
|
require('react-dom');
|
|
17
17
|
require('framer-motion');
|
|
18
18
|
require('react-popper');
|
|
@@ -7,7 +7,7 @@ var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
|
|
|
7
7
|
var Avatar = require('./Avatar-76a799fa.js');
|
|
8
8
|
var Icon = require('./Icon-405a216c.js');
|
|
9
9
|
var Typography = require('./Typography-c45bf216.js');
|
|
10
|
-
var Tooltip = require('./Tooltip-
|
|
10
|
+
var Tooltip = require('./Tooltip-27771182.js');
|
|
11
11
|
|
|
12
12
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
13
13
|
|
package/dist/Chips/index.js
CHANGED
|
@@ -9,14 +9,14 @@ var useAssert = require('@jobber/hooks/useAssert');
|
|
|
9
9
|
var Icon = require('../Icon-405a216c.js');
|
|
10
10
|
var Avatar = require('../Avatar-76a799fa.js');
|
|
11
11
|
var Typography = require('../Typography-c45bf216.js');
|
|
12
|
-
var Tooltip = require('../Tooltip-
|
|
12
|
+
var Tooltip = require('../Tooltip-27771182.js');
|
|
13
13
|
var uuid = require('uuid');
|
|
14
14
|
var sortBy = require('lodash/sortBy');
|
|
15
15
|
var useLiveAnnounce = require('@jobber/hooks/useLiveAnnounce');
|
|
16
16
|
var debounce = require('lodash/debounce');
|
|
17
17
|
var reactPopper = require('react-popper');
|
|
18
18
|
var Text = require('../Text-259af966.js');
|
|
19
|
-
var Button = require('../Button-
|
|
19
|
+
var Button = require('../Button-b73a5e01.js');
|
|
20
20
|
var Spinner = require('../Spinner-9d8fc7ff.js');
|
|
21
21
|
require('@jobber/design');
|
|
22
22
|
require('color');
|
package/dist/Combobox/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var Combobox = require('../Combobox-
|
|
5
|
+
var Combobox = require('../Combobox-95b3c413.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('classnames');
|
|
8
8
|
require('react-dom');
|
|
@@ -12,17 +12,17 @@ require('@jobber/design');
|
|
|
12
12
|
require('../Text-259af966.js');
|
|
13
13
|
require('../Typography-c45bf216.js');
|
|
14
14
|
require('../tslib.es6-5b8768b7.js');
|
|
15
|
-
require('../Button-
|
|
15
|
+
require('../Button-b73a5e01.js');
|
|
16
16
|
require('react-router-dom');
|
|
17
17
|
require('@jobber/hooks/useRefocusOnActivator');
|
|
18
18
|
require('@jobber/hooks/useFocusTrap');
|
|
19
19
|
require('react-popper');
|
|
20
20
|
require('@jobber/hooks/useOnKeyDown');
|
|
21
|
-
require('../Chip-
|
|
21
|
+
require('../Chip-c91fd6c8.js');
|
|
22
22
|
require('@jobber/hooks/useInView');
|
|
23
23
|
require('../Avatar-76a799fa.js');
|
|
24
24
|
require('color');
|
|
25
|
-
require('../Tooltip-
|
|
25
|
+
require('../Tooltip-27771182.js');
|
|
26
26
|
require('framer-motion');
|
|
27
27
|
require('@jobber/hooks/useAssert');
|
|
28
28
|
|
|
@@ -8,12 +8,12 @@ var Icon = require('./Icon-405a216c.js');
|
|
|
8
8
|
var Text = require('./Text-259af966.js');
|
|
9
9
|
var tslib_es6 = require('./tslib.es6-5b8768b7.js');
|
|
10
10
|
var Typography = require('./Typography-c45bf216.js');
|
|
11
|
-
var Button = require('./Button-
|
|
11
|
+
var Button = require('./Button-b73a5e01.js');
|
|
12
12
|
var useRefocusOnActivator = require('@jobber/hooks/useRefocusOnActivator');
|
|
13
13
|
var useFocusTrap = require('@jobber/hooks/useFocusTrap');
|
|
14
14
|
var reactPopper = require('react-popper');
|
|
15
15
|
var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
|
|
16
|
-
var Chip = require('./Chip-
|
|
16
|
+
var Chip = require('./Chip-c91fd6c8.js');
|
|
17
17
|
require('@jobber/design');
|
|
18
18
|
var useAssert = require('@jobber/hooks/useAssert');
|
|
19
19
|
|
|
@@ -23,7 +23,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
|
23
23
|
var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
|
|
24
24
|
var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
|
|
25
25
|
|
|
26
|
-
var css_248z$6 = ".m1w5vdUZ6rQ- {\n z-index: 1002;\n z-index: var(--elevation-tooltip);\n max-width: var(--popover--width);\n min-width: calc((16px * 4) * 3.75);\n min-width: calc(calc(16px * 4) * 3.75);\n min-width: calc(var(--space-extravagant) * 3.75);\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-top: calc(16px / 2);\n margin-top: 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 / 2);\n border-radius: var(--radius-larger);\n overflow: auto;\n background: rgba(255, 255, 255, 1);\n background: var(--color-surface);\n}\n\n/* CAUTION: Tests for content visibility assume this class' presence hides the content\n* so please be careful if you change this class name, or the css rules within.\n*/\n\n.m1w5vdUZ6rQ-.Zlkv2HA096A- {\n display: none;\n visibility: hidden;\n}\n\n.m1w5vdUZ6rQ-:focus,\n.m1w5vdUZ6rQ-:focus-visible {\n outline: none;\n}\n\n.m1w5vdUZ6rQ-:focus-visible {\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}\n\n.YQry-Rd6zfQ- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-direction: column;\n flex-direction: column;\n position: sticky;\n gap: calc(16px / 4);\n gap: var(--space-smaller);\n bottom: 0;\n width: 100%;\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n.TcpqL34s4lI- {\n padding-bottom: calc(16px / 2);\n padding-bottom: var(--space-small);\n}\n";
|
|
26
|
+
var css_248z$6 = ".m1w5vdUZ6rQ- {\n z-index: 1002;\n z-index: var(--elevation-tooltip);\n max-width: var(--popover--width);\n min-width: calc((16px * 4) * 3.75);\n min-width: calc(calc(16px * 4) * 3.75);\n min-width: calc(var(--space-extravagant) * 3.75);\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-top: calc(16px / 2);\n margin-top: 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 / 2);\n border-radius: var(--radius-larger);\n overflow: auto;\n background: rgba(255, 255, 255, 1);\n background: var(--color-surface);\n}\n\n.jobber-retheme .m1w5vdUZ6rQ- {\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n}\n\n/* CAUTION: Tests for content visibility assume this class' presence hides the content\n* so please be careful if you change this class name, or the css rules within.\n*/\n\n.m1w5vdUZ6rQ-.Zlkv2HA096A- {\n display: none;\n visibility: hidden;\n}\n\n.m1w5vdUZ6rQ-:focus,\n.m1w5vdUZ6rQ-:focus-visible {\n outline: none;\n}\n\n.m1w5vdUZ6rQ-:focus-visible {\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}\n\n.YQry-Rd6zfQ- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-direction: column;\n flex-direction: column;\n position: sticky;\n gap: calc(16px / 4);\n gap: var(--space-smaller);\n bottom: 0;\n width: 100%;\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n.TcpqL34s4lI- {\n padding-bottom: calc(16px / 2);\n padding-bottom: var(--space-small);\n}\n";
|
|
27
27
|
var styles$6 = {"content":"m1w5vdUZ6rQ-","hidden":"Zlkv2HA096A-","actions":"YQry-Rd6zfQ-","actionPadding":"TcpqL34s4lI-"};
|
|
28
28
|
styleInject_es.styleInject(css_248z$6);
|
|
29
29
|
|
|
@@ -59,7 +59,7 @@ var css_248z$4 = ".SgMzjOcdE-E- {\n position: relative;\n padding: calc(16px /
|
|
|
59
59
|
var styles$4 = {"container":"SgMzjOcdE-E-","optionsList":"TwoTCjgcssc-","filterMessage":"_8T5M7MGwCRE-","emptyStateMessage":"_4y5NXkNeIQM-","scrollTop":"T6E3VwBGoQM-","scrollNone":"_6HQzxMQkXnE-","scrollBottom":"_5YsJZyMDkbA-"};
|
|
60
60
|
styleInject_es.styleInject(css_248z$4);
|
|
61
61
|
|
|
62
|
-
var css_248z$3 = "._5QdRGmaNHvc- {\n display: -ms-flexbox;\n display: flex;\n min-height: calc((calc(16px * 3) - calc(16px / 4)));\n min-height: calc((var(--space-largest) - var(--space-smaller)));\n box-sizing: border-box;\n margin: 0 calc(16px / 2);\n margin: 0 var(--space-small);\n padding: calc(16px / 2);\n padding: var(--space-small);\n border-radius: calc(16px / 4);\n border-radius: var(--radius-large);\n color: rgb(1, 41, 57);\n color: var(--color-heading);\n font-weight: 500;\n cursor: pointer;\n transition: all 200ms;\n transition: all var(--timing-base);\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-align: center;\n align-items: center;\n}\n\n._5QdRGmaNHvc-:hover,\n._5QdRGmaNHvc-:focus-visible {\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n}\n\n._5QdRGmaNHvc-:focus,\n._5QdRGmaNHvc-:focus-visible {\n outline: none;\n}\n\n._5QdRGmaNHvc-:focus-visible {\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}\n";
|
|
62
|
+
var css_248z$3 = "._5QdRGmaNHvc- {\n display: -ms-flexbox;\n display: flex;\n min-height: calc((calc(16px * 3) - calc(16px / 4)));\n min-height: calc((var(--space-largest) - var(--space-smaller)));\n box-sizing: border-box;\n margin: 0 calc(16px / 2);\n margin: 0 var(--space-small);\n padding: calc(16px / 2);\n padding: var(--space-small);\n border-radius: calc(16px / 4);\n border-radius: var(--radius-large);\n color: rgb(1, 41, 57);\n color: var(--color-heading);\n font-weight: 500;\n cursor: pointer;\n transition: all 200ms;\n transition: all var(--timing-base);\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-align: center;\n align-items: center;\n}\n\n.jobber-retheme ._5QdRGmaNHvc- {\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n}\n\n._5QdRGmaNHvc-:hover,\n._5QdRGmaNHvc-:focus-visible {\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n}\n\n._5QdRGmaNHvc-:focus,\n._5QdRGmaNHvc-:focus-visible {\n outline: none;\n}\n\n._5QdRGmaNHvc-:focus-visible {\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}\n";
|
|
63
63
|
var styles$3 = {"option":"_5QdRGmaNHvc-"};
|
|
64
64
|
styleInject_es.styleInject(css_248z$3);
|
|
65
65
|
|
|
@@ -282,7 +282,7 @@ function ComboboxContent(props) {
|
|
|
282
282
|
return ReactDOM__default["default"].createPortal(template, document.body);
|
|
283
283
|
}
|
|
284
284
|
|
|
285
|
-
var css_248z$1 = ".Ow9wSNnGP-g- {\n width: 100%;\n box-sizing: border-box;\n padding: 0 calc(16px / 2);\n padding: 0 var(--space-small);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n.ncp0nKHQ7d8- {\n position: relative;\n width: 100%;\n min-height: calc((calc(16px * 3) - calc(16px / 2)));\n min-height: calc((var(--space-largest) - var(--space-small)));\n padding: calc(16px / 2) 0;\n padding: var(--space-small) 0;\n border: none;\n border-radius: calc(16px / 4);\n border-radius: var(--radius-large);\n text-align: left;\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n cursor: pointer;\n transition: all 200ms;\n transition: all var(--timing-base);\n}\n\n.ncp0nKHQ7d8-:focus {\n outline: none;\n}\n\n.ncp0nKHQ7d8-:hover,\n.ncp0nKHQ7d8-:focus-visible {\n outline: none;\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n}\n\n.ncp0nKHQ7d8-:focus-visible {\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}\n\n.ncp0nKHQ7d8- span {\n margin-left: calc(16px / 2);\n margin-left: var(--space-small);\n}\n";
|
|
285
|
+
var css_248z$1 = ".Ow9wSNnGP-g- {\n width: 100%;\n box-sizing: border-box;\n padding: 0 calc(16px / 2);\n padding: 0 var(--space-small);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n.ncp0nKHQ7d8- {\n position: relative;\n width: 100%;\n min-height: calc((calc(16px * 3) - calc(16px / 2)));\n min-height: calc((var(--space-largest) - var(--space-small)));\n padding: calc(16px / 2) 0;\n padding: var(--space-small) 0;\n border: none;\n border-radius: calc(16px / 4);\n border-radius: var(--radius-large);\n text-align: left;\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n cursor: pointer;\n transition: all 200ms;\n transition: all var(--timing-base);\n}\n\n.jobber-retheme .ncp0nKHQ7d8- {\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n}\n\n.ncp0nKHQ7d8-:focus {\n outline: none;\n}\n\n.ncp0nKHQ7d8-:hover,\n.ncp0nKHQ7d8-:focus-visible {\n outline: none;\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n}\n\n.ncp0nKHQ7d8-:focus-visible {\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}\n\n.ncp0nKHQ7d8- span {\n margin-left: calc(16px / 2);\n margin-left: var(--space-small);\n}\n";
|
|
286
286
|
var styles$1 = {"actionContainer":"Ow9wSNnGP-g-","actionButton":"ncp0nKHQ7d8-"};
|
|
287
287
|
styleInject_es.styleInject(css_248z$1);
|
|
288
288
|
|
|
@@ -2,25 +2,26 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var ConfirmationModal = require('../ConfirmationModal-
|
|
5
|
+
var ConfirmationModal = require('../ConfirmationModal-189e107a.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('@jobber/hooks/useOnKeyDown');
|
|
8
|
-
require('../Modal-
|
|
8
|
+
require('../Modal-a0627c92.js');
|
|
9
9
|
require('react-dom');
|
|
10
10
|
require('classnames');
|
|
11
11
|
require('framer-motion');
|
|
12
12
|
require('@jobber/hooks/useRefocusOnActivator');
|
|
13
13
|
require('@jobber/hooks/useFocusTrap');
|
|
14
14
|
require('../style-inject.es-9d2f5f4e.js');
|
|
15
|
-
require('../Heading-
|
|
15
|
+
require('../Heading-1e8e4bd3.js');
|
|
16
16
|
require('../Typography-c45bf216.js');
|
|
17
|
-
require('../
|
|
17
|
+
require('../getAtlantisConfig-0f3e8af2.js');
|
|
18
|
+
require('../Button-b73a5e01.js');
|
|
18
19
|
require('react-router-dom');
|
|
19
20
|
require('../Icon-405a216c.js');
|
|
20
21
|
require('@jobber/design');
|
|
21
|
-
require('../ButtonDismiss-
|
|
22
|
+
require('../ButtonDismiss-350af163.js');
|
|
22
23
|
require('../Content-2ca1ffe1.js');
|
|
23
|
-
require('../Markdown-
|
|
24
|
+
require('../Markdown-b80706ed.js');
|
|
24
25
|
require('react-markdown');
|
|
25
26
|
require('../Text-259af966.js');
|
|
26
27
|
require('../Emphasis-bda56d3b.js');
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
|
|
5
|
-
var Modal = require('./Modal-
|
|
5
|
+
var Modal = require('./Modal-a0627c92.js');
|
|
6
6
|
var Content = require('./Content-2ca1ffe1.js');
|
|
7
|
-
var Markdown = require('./Markdown-
|
|
7
|
+
var Markdown = require('./Markdown-b80706ed.js');
|
|
8
8
|
|
|
9
9
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
10
10
|
|
package/dist/DataDump/index.js
CHANGED
|
@@ -3,18 +3,19 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
-
var Card = require('../Card-
|
|
6
|
+
var Card = require('../Card-644dd256.js');
|
|
7
7
|
var Content = require('../Content-2ca1ffe1.js');
|
|
8
8
|
var Emphasis = require('../Emphasis-bda56d3b.js');
|
|
9
9
|
require('classnames');
|
|
10
10
|
require('../style-inject.es-9d2f5f4e.js');
|
|
11
|
-
require('../Heading-
|
|
11
|
+
require('../Heading-1e8e4bd3.js');
|
|
12
12
|
require('../Typography-c45bf216.js');
|
|
13
|
-
require('../
|
|
13
|
+
require('../getAtlantisConfig-0f3e8af2.js');
|
|
14
|
+
require('../Button-b73a5e01.js');
|
|
14
15
|
require('react-router-dom');
|
|
15
16
|
require('../Icon-405a216c.js');
|
|
16
17
|
require('@jobber/design');
|
|
17
|
-
require('../Menu-
|
|
18
|
+
require('../Menu-da5d8217.js');
|
|
18
19
|
require('uuid');
|
|
19
20
|
require('framer-motion');
|
|
20
21
|
require('@jobber/hooks/useOnKeyDown');
|
package/dist/DataList/index.js
CHANGED
|
@@ -11,13 +11,13 @@ var noop = require('lodash/noop');
|
|
|
11
11
|
var design = require('@jobber/design');
|
|
12
12
|
var framerMotion = require('framer-motion');
|
|
13
13
|
var classnames = require('classnames');
|
|
14
|
-
var Tooltip = require('../Tooltip-
|
|
15
|
-
var Button = require('../Button-
|
|
14
|
+
var Tooltip = require('../Tooltip-27771182.js');
|
|
15
|
+
var Button = require('../Button-b73a5e01.js');
|
|
16
16
|
var useInView = require('@jobber/hooks/useInView');
|
|
17
17
|
var isEmpty = require('lodash/isEmpty');
|
|
18
18
|
var InlineLabel = require('../InlineLabel-a6557829.js');
|
|
19
19
|
var FormatDate = require('../FormatDate-70ea5b43.js');
|
|
20
|
-
var Heading = require('../Heading-
|
|
20
|
+
var Heading = require('../Heading-1e8e4bd3.js');
|
|
21
21
|
var useFocusTrap = require('@jobber/hooks/useFocusTrap');
|
|
22
22
|
var useRefocusOnActivator = require('@jobber/hooks/useRefocusOnActivator');
|
|
23
23
|
var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
|
|
@@ -25,21 +25,22 @@ var ReactDOM = require('react-dom');
|
|
|
25
25
|
var Checkbox = require('../Checkbox-1cdd5cf6.js');
|
|
26
26
|
var reactRouterDom = require('react-router-dom');
|
|
27
27
|
var AnimatedSwitcher = require('../AnimatedSwitcher-d1e1ddcf.js');
|
|
28
|
-
var Combobox = require('../Combobox-
|
|
29
|
-
var Chip = require('../Chip-
|
|
28
|
+
var Combobox = require('../Combobox-95b3c413.js');
|
|
29
|
+
var Chip = require('../Chip-c91fd6c8.js');
|
|
30
30
|
var Icon = require('../Icon-405a216c.js');
|
|
31
31
|
var debounce = require('lodash/debounce');
|
|
32
|
-
var InputText = require('../InputText-
|
|
32
|
+
var InputText = require('../InputText-0e3c927f.js');
|
|
33
33
|
var Spinner = require('../Spinner-9d8fc7ff.js');
|
|
34
34
|
var Typography = require('../Typography-c45bf216.js');
|
|
35
35
|
require('../Content-2ca1ffe1.js');
|
|
36
36
|
require('react-popper');
|
|
37
|
+
require('../getAtlantisConfig-0f3e8af2.js');
|
|
37
38
|
require('uuid');
|
|
38
39
|
require('react-hook-form');
|
|
39
40
|
require('@jobber/hooks/useAssert');
|
|
40
41
|
require('../Avatar-76a799fa.js');
|
|
41
42
|
require('color');
|
|
42
|
-
require('../FormField-
|
|
43
|
+
require('../FormField-18cda9ed.js');
|
|
43
44
|
require('@jobber/hooks/useShowClear');
|
|
44
45
|
require('../InputValidation-a7a737f9.js');
|
|
45
46
|
|
|
@@ -196,7 +197,7 @@ function useDataListLayoutContext() {
|
|
|
196
197
|
return React.useContext(DataListLayoutContext);
|
|
197
198
|
}
|
|
198
199
|
|
|
199
|
-
var css_248z$c = ".jHcHGQ-HDbk- {\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n top: calc((16px / 2) * -1);\n top: calc(calc(16px / 2) * -1);\n top: calc(var(--space-small) * -1);\n right: 0;\n z-index: 6;\n z-index: var(--elevation-menu);\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 / 4);\n padding: var(--space-smaller);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 2);\n border-radius: var(--radius-larger);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n gap: calc(16px / 4);\n gap: var(--space-smaller);\n}\n";
|
|
200
|
+
var css_248z$c = ".jHcHGQ-HDbk- {\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n top: calc((16px / 2) * -1);\n top: calc(calc(16px / 2) * -1);\n top: calc(var(--space-small) * -1);\n right: 0;\n z-index: 6;\n z-index: var(--elevation-menu);\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 / 4);\n padding: var(--space-smaller);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 2);\n border-radius: var(--radius-larger);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n gap: calc(16px / 4);\n gap: var(--space-smaller);\n}\n\n.jobber-retheme .jHcHGQ-HDbk- {\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n}\n";
|
|
200
201
|
var styles$c = {"menu":"jHcHGQ-HDbk-"};
|
|
201
202
|
styleInject_es.styleInject(css_248z$c);
|
|
202
203
|
|
|
@@ -399,7 +400,7 @@ function useDataListLayoutActionsContext() {
|
|
|
399
400
|
return React.useContext(DataListLayoutActionsContext);
|
|
400
401
|
}
|
|
401
402
|
|
|
402
|
-
var css_248z$7 = ".aokwZU8jbWU- {\n position: fixed;\n top: 0;\n top: var(--actions-menu-y, 0);\n left: 0;\n left: var(--actions-menu-x, 0);\n z-index: 6;\n z-index: var(--elevation-menu);\n min-width: 150px;\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 / 4);\n padding: var(--space-smaller);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 2);\n border-radius: var(--radius-larger);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n.XtVRP97TVSE- {\n position: fixed;\n top: 0;\n left: 0;\n z-index: calc(6 - 1);\n z-index: calc(var(--elevation-menu) - 1);\n width: 100%;\n height: 100%;\n padding: 0;\n border: none;\n background-color: transparent;\n}\n";
|
|
403
|
+
var css_248z$7 = ".aokwZU8jbWU- {\n position: fixed;\n top: 0;\n top: var(--actions-menu-y, 0);\n left: 0;\n left: var(--actions-menu-x, 0);\n z-index: 6;\n z-index: var(--elevation-menu);\n min-width: 150px;\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 / 4);\n padding: var(--space-smaller);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(16px / 2);\n border-radius: var(--radius-larger);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n.jobber-retheme .aokwZU8jbWU- {\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n}\n\n.XtVRP97TVSE- {\n position: fixed;\n top: 0;\n left: 0;\n z-index: calc(6 - 1);\n z-index: calc(var(--elevation-menu) - 1);\n width: 100%;\n height: 100%;\n padding: 0;\n border: none;\n background-color: transparent;\n}\n";
|
|
403
404
|
var styles$7 = {"menu":"aokwZU8jbWU-","overlay":"XtVRP97TVSE-"};
|
|
404
405
|
styleInject_es.styleInject(css_248z$7);
|
|
405
406
|
|
|
@@ -1047,7 +1048,7 @@ function DataListLoadMore({ onBackToTop }) {
|
|
|
1047
1048
|
React__default["default"].createElement(Button.Button, { label: "Back to top", onClick: onBackToTop, size: "small", variation: "subtle" })))));
|
|
1048
1049
|
}
|
|
1049
1050
|
|
|
1050
|
-
var css_248z$1 = ".iyg43v-S9yU- {\n display: -ms-flexbox;\n display: flex;\n width: 100%;\n min-height: 44px;\n padding: calc(16px / 2);\n padding: var(--space-small);\n border: none;\n border-radius: 0;\n font-size: calc((16px * 1) * 0.875);\n font-size: calc(calc(16px * 1) * 0.875);\n font-size: var(--typography--fontSize-base);\n text-align: left;\n background: none;\n cursor: pointer;\n transition: background 200ms ease;\n transition: background var(--timing-base) ease;\n -webkit-appearance: none;\n appearance: none;\n -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: justify;\n justify-content: space-between;\n gap: calc(16px / 2);\n gap: var(--space-small);\n}\n\n.iyg43v-S9yU-:hover,\n.iyg43v-S9yU-:focus {\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n}\n\n.iyg43v-S9yU-:focus,\n.iyg43v-S9yU-:focus-visible {\n outline: none;\n}\n\n.iyg43v-S9yU-:focus-visible {\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}\n\n.AUJNqz93ZDA- {\n font-weight: 500;\n}\n";
|
|
1051
|
+
var css_248z$1 = ".iyg43v-S9yU- {\n display: -ms-flexbox;\n display: flex;\n width: 100%;\n min-height: 44px;\n padding: calc(16px / 2);\n padding: var(--space-small);\n border: none;\n border-radius: 0;\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n font-size: calc((16px * 1) * 0.875);\n font-size: calc(calc(16px * 1) * 0.875);\n font-size: var(--typography--fontSize-base);\n text-align: left;\n background: none;\n cursor: pointer;\n transition: background 200ms ease;\n transition: background var(--timing-base) ease;\n -webkit-appearance: none;\n appearance: none;\n -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: justify;\n justify-content: space-between;\n gap: calc(16px / 2);\n gap: var(--space-small);\n}\n\n.iyg43v-S9yU-:hover,\n.iyg43v-S9yU-:focus {\n background-color: rgb(244, 246, 250);\n background-color: var(--color-surface--hover);\n}\n\n.iyg43v-S9yU-:focus,\n.iyg43v-S9yU-:focus-visible {\n outline: none;\n}\n\n.iyg43v-S9yU-:focus-visible {\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}\n\n.AUJNqz93ZDA- {\n font-weight: 500;\n}\n";
|
|
1051
1052
|
var styles$1 = {"action":"iyg43v-S9yU-","label":"AUJNqz93ZDA-"};
|
|
1052
1053
|
styleInject_es.styleInject(css_248z$1);
|
|
1053
1054
|
|