@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
@@ -1,121 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var classnames = require('classnames');
5
- var getHumanReadableFileSize = require('filesize');
6
- var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
7
- var Button = require('./Button-163a0641.js');
8
- var ConfirmationModal = require('./ConfirmationModal-0f85d96c.js');
9
- var Glimmer = require('./Glimmer-cfa92a88.js');
10
- var Icon = require('./Icon-405a216c.js');
11
- var Typography = require('./Typography-973b122e.js');
12
- var Text = require('./Text-4a2bc89f.js');
13
- var ProgressBar = require('./ProgressBar-b68edc8f.js');
14
-
15
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
16
-
17
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
18
- var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
19
- var getHumanReadableFileSize__default = /*#__PURE__*/_interopDefaultLegacy(getHumanReadableFileSize);
20
-
21
- var css_248z$2 = ":root {\n --file-card--height: calc(var(--space-base) * 3.5);\n --file-card--background-color: var(--color-white);\n --file-card--header-background-color: var(--color-greyBlue--lighter);\n --file-card--content-background-color: var(--color-white);\n --file-card--border-color: var(--color-border);\n --file-card--accent-color: var(--color-grey);\n --file-card--base-padding: var(--space-small);\n}\n\n.cx4iQqlNNvc- {\n display: grid;\n grid-template-columns: auto -webkit-max-content;\n grid-template-columns: auto max-content;\n gap: calc(16px / 2);\n grid-gap: calc(16px / 2);\n grid-gap: var(--file-card--base-padding);\n gap: var(--file-card--base-padding);\n -ms-flex-align: center;\n align-items: center;\n padding-right: calc(16px / 2);\n padding-right: var(--space-small);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--file-card--border-color);\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--file-card--background-color);\n}\n\n.nSaog7-7Jn0-,\n.cx4iQqlNNvc- {\n position: relative;\n}\n\n._9jVt97W52JY- {\n display: grid;\n grid-template-columns: -webkit-max-content auto;\n grid-template-columns: max-content auto;\n gap: calc(16px / 2);\n grid-gap: calc(16px / 2);\n grid-gap: var(--file-card--base-padding);\n gap: var(--file-card--base-padding);\n -ms-flex-align: center;\n align-items: center;\n padding: 0;\n border: none;\n text-align: left;\n background-color: var(--color-transparent);\n}\n\n.z-kUGMs0Yfg- {\n width: 168px;\n height: 168px;\n}\n\n.x1Ql0enaIxY- {\n width: 56px;\n height: 56px;\n}\n\n.il9-MCeoBts- {\n display: -ms-flexbox;\n display: flex;\n position: relative;\n box-sizing: border-box;\n padding: 0;\n overflow: hidden;\n background-color: rgb(238, 240, 242);\n background-color: var(--color-surface--background);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n\n.cx4iQqlNNvc- ._9jVt97W52JY- {\n outline: none;\n}\n\n.nSaog7-7Jn0- ._9jVt97W52JY-: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\n.nSaog7-7Jn0- .il9-MCeoBts- {\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.cx4iQqlNNvc- ._9jVt97W52JY-:focus::after {\n content: \"\";\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\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.cx4iQqlNNvc- .il9-MCeoBts- {\n border-right: none;\n border-bottom-left-radius: calc(16px / 8);\n border-bottom-left-radius: var(--radius-base);\n border-top-left-radius: calc(16px / 8);\n border-top-left-radius: var(--radius-base);\n}\n\n.O9EG-xJYVco- {\n cursor: pointer;\n}\n\n.QmrRp5CTpGU- .il9-MCeoBts-::after,\n.N5qVYfi1Pgo- {\n content: \"\";\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.32);\n background-color: var(--color-overlay);\n opacity: 0;\n transition: all 200ms;\n transition: all var(--timing-base);\n}\n\n.QmrRp5CTpGU-:hover .il9-MCeoBts-::after,\n.QmrRp5CTpGU-:focus .il9-MCeoBts-::after,\n.N5qVYfi1Pgo- {\n opacity: 1;\n}\n\n.N5qVYfi1Pgo- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-align: center;\n align-items: center;\n box-sizing: border-box;\n padding: calc(16px / 2);\n padding: var(--file-card--base-padding);\n}\n\n.TyXXZnJuVwo- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-direction: column;\n flex-direction: column;\n min-width: 0;\n}\n\n.TyXXZnJuVwo- p {\n margin: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.nSaog7-7Jn0- ._7wDO6nPXy-g- {\n position: absolute;\n top: calc(16px / 4);\n top: var(--space-smaller);\n right: calc(16px / 4);\n right: var(--space-smaller);\n}\n\n.sgUJuNv0rUE- ~ ._7wDO6nPXy-g- {\n visibility: hidden;\n}\n\n._7wDO6nPXy-g-:focus-within,\n._7wDO6nPXy-g-:hover,\n.sgUJuNv0rUE-:hover ~ ._7wDO6nPXy-g-,\n.sgUJuNv0rUE-:focus ~ ._7wDO6nPXy-g- {\n visibility: visible;\n}\n";
22
- var styles$2 = {"expanded":"cx4iQqlNNvc-","compact":"nSaog7-7Jn0-","wrapper":"_9jVt97W52JY-","large":"z-kUGMs0Yfg-","base":"x1Ql0enaIxY-","thumbnail":"il9-MCeoBts-","clickable":"O9EG-xJYVco-","hoverable":"QmrRp5CTpGU-","progress":"N5qVYfi1Pgo-","contentBlock":"TyXXZnJuVwo-","deleteButton":"_7wDO6nPXy-g-","deleteable":"sgUJuNv0rUE-"};
23
- styleInject_es.styleInject(css_248z$2);
24
-
25
- function FormatFileDeleteButton({ size, onDelete }) {
26
- const buttonSize = size === "base" ? "small" : "base";
27
- const [deleteConfirmationOpen, setDeleteConfirmationOpen] = React.useState(false);
28
- return (React__default["default"].createElement(React__default["default"].Fragment, null,
29
- React__default["default"].createElement(Button.Button, { onClick: () => setDeleteConfirmationOpen(true), variation: "destructive", type: "tertiary", icon: "trash", ariaLabel: "Delete File", size: buttonSize }),
30
- React__default["default"].createElement(ConfirmationModal.ConfirmationModal, { title: "Confirm Deletion", message: `Are you sure you want to delete this file?`, confirmLabel: "Delete", variation: "destructive", open: deleteConfirmationOpen, onConfirm: () => onDelete === null || onDelete === void 0 ? void 0 : onDelete(), onRequestClose: () => setDeleteConfirmationOpen(false) })));
31
- }
32
-
33
- var css_248z$1 = ".M9Y7sOk6lTc- {\n display: grid;\n grid-template-columns: auto;\n grid-template-rows: auto -webkit-max-content;\n grid-template-rows: auto max-content;\n width: inherit;\n height: inherit;\n -ms-flex-align: center;\n align-items: center;\n justify-items: center;\n}\n\n.E4wclxY71oM-:not(.yReSfaruAh0-) {\n -ms-flex-align: end;\n align-items: end;\n}\n\n.YXN92rsh2eU- {\n width: 100%;\n min-width: 0;\n box-sizing: border-box;\n}\n\n.psaqxO2Lu7E- .YXN92rsh2eU- {\n padding: calc(16px / 4);\n padding: var(--space-smaller);\n font-size: calc(\n (16px * 1) * 0.625\n );\n font-size: calc(\n calc(16px * 1) * 0.625\n );\n font-size: var(--typography--fontSize-smaller);\n}\n\n.yReSfaruAh0- .YXN92rsh2eU- {\n position: absolute;\n bottom: 0;\n left: 0;\n padding: calc(16px / 2);\n padding: var(--space-small);\n font-size: calc((16px * 1) * 0.75);\n font-size: calc(calc(16px * 1) * 0.75);\n font-size: var(--typography--fontSize-small);\n}\n";
34
- var styles$1 = {"content":"M9Y7sOk6lTc-","hasName":"E4wclxY71oM-","large":"yReSfaruAh0-","fileName":"YXN92rsh2eU-","base":"psaqxO2Lu7E-"};
35
- styleInject_es.styleInject(css_248z$1);
36
-
37
- var css_248z = "._62D0xyydQwo- {\n width: 100%;\n height: 100%;\n -o-object-fit: cover;\n object-fit: cover;\n -webkit-animation: _5GIEBejwNJc- 200ms ease;\n animation: _5GIEBejwNJc- 200ms ease;\n}\n\n.a5EQqLlJmCk- {\n display: none;\n}\n\n@-webkit-keyframes _5GIEBejwNJc- {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n@keyframes _5GIEBejwNJc- {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n";
38
- var styles = {"image":"_62D0xyydQwo-","fadeIn":"_5GIEBejwNJc-","hidden":"a5EQqLlJmCk-"};
39
- styleInject_es.styleInject(css_248z);
40
-
41
- function InternalThumbnailImage({ file }) {
42
- const { name, src } = file;
43
- const [imageSource, setImageSource] = React.useState();
44
- const [imageLoaded, setImageLoaded] = React.useState(false);
45
- if (!imageSource) {
46
- src().then(url => setImageSource(url));
47
- }
48
- return (React__default["default"].createElement(React__default["default"].Fragment, null,
49
- !imageLoaded && React__default["default"].createElement(Glimmer.Glimmer, { size: "auto" }),
50
- React__default["default"].createElement("img", { src: imageSource, onLoad: handleImageLoad, alt: name, "data-testid": "internalThumbnailImage", className: classnames__default["default"](styles.image, { [styles.hidden]: !imageLoaded }) })));
51
- function handleImageLoad() {
52
- setImageLoaded(true);
53
- }
54
- }
55
-
56
- function InternalThumbnail({ compact = false, size, file, }) {
57
- const { name, type } = file;
58
- const iconName = getIconNameFromType(type);
59
- const hasName = Boolean(name) && compact;
60
- if (type.startsWith("image/")) {
61
- return React__default["default"].createElement(InternalThumbnailImage, { file: file });
62
- }
63
- return (React__default["default"].createElement("div", { className: classnames__default["default"](styles$1.content, styles$1[size], {
64
- [styles$1.hasName]: hasName,
65
- }) },
66
- React__default["default"].createElement(Icon.Icon, { name: iconName, color: "greyBlue", size: size }),
67
- hasName && (React__default["default"].createElement("div", { className: styles$1.fileName },
68
- React__default["default"].createElement(Typography.Typography, { element: "span", textColor: "text", numberOfLines: 1 }, name)))));
69
- }
70
- function getIconNameFromType(mimeType) {
71
- if (mimeType.startsWith("image/"))
72
- return "camera";
73
- if (mimeType.startsWith("video/"))
74
- return "video";
75
- switch (mimeType) {
76
- case "application/pdf":
77
- return "pdf";
78
- case "application/vnd.ms-excel":
79
- return "excel";
80
- default:
81
- return "file";
82
- }
83
- }
84
-
85
- function FormatFile({ file, display = "expanded", displaySize = "base", onDelete, onClick, }) {
86
- const isComplete = file.progress >= 1;
87
- const fileSize = getHumanReadableFileSize__default["default"](file.size);
88
- const wrapperClassNames = classnames__default["default"](styles$2[display], {
89
- [styles$2[displaySize]]: display === "compact",
90
- });
91
- const DetailsContainer = isComplete && onClick ? "button" : "div";
92
- const detailsClassNames = classnames__default["default"](styles$2.wrapper, {
93
- [styles$2[displaySize]]: display === "compact",
94
- [styles$2.hoverable]: isHoverable({ display, isComplete, onClick, onDelete }),
95
- [styles$2.clickable]: onClick,
96
- [styles$2.deleteable]: display === "compact",
97
- });
98
- const thumbnailContainerClassNames = classnames__default["default"](styles$2.thumbnail, styles$2[displaySize]);
99
- return (React__default["default"].createElement("div", { className: wrapperClassNames },
100
- React__default["default"].createElement(DetailsContainer, { type: "button", className: detailsClassNames, onClick: isComplete ? onClick : undefined, tabIndex: 0, "aria-busy": !isComplete },
101
- React__default["default"].createElement("div", { className: thumbnailContainerClassNames },
102
- React__default["default"].createElement(InternalThumbnail, { key: file.key, compact: display === "compact", file: file, size: displaySize }),
103
- !isComplete && (React__default["default"].createElement("div", { className: styles$2.progress },
104
- React__default["default"].createElement(ProgressBar.ProgressBar, { size: "small", currentStep: file.progress * 100, totalSteps: 100 })))),
105
- display === "expanded" && (React__default["default"].createElement("div", { className: styles$2.contentBlock },
106
- React__default["default"].createElement(Text.Text, { size: "base" }, file.name),
107
- React__default["default"].createElement(Text.Text, { size: "small" }, fileSize)))),
108
- isComplete && onDelete && (React__default["default"].createElement("div", { className: styles$2.deleteButton },
109
- React__default["default"].createElement(FormatFileDeleteButton, { size: display === "expanded" ? "large" : displaySize, onDelete: onDelete })))));
110
- }
111
- function isHoverable({ display, isComplete, onClick, onDelete, }) {
112
- if (display === "compact") {
113
- return Boolean(isComplete && (onClick || onDelete));
114
- }
115
- else if (display === "expanded") {
116
- return Boolean(isComplete && onClick);
117
- }
118
- return false;
119
- }
120
-
121
- exports.FormatFile = FormatFile;
@@ -1,77 +0,0 @@
1
- 'use strict';
2
-
3
- var tslib_es6 = require('./tslib.es6-5b8768b7.js');
4
- var React = require('react');
5
- var classnames = require('classnames');
6
- var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
7
- var Content = require('./Content-2ca1ffe1.js');
8
-
9
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
-
11
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
- var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
13
-
14
- var css_248z$3 = ".FXzzrJAf890- {\n --glimmer-background: rgba(var(--color-black--rgb) 5%);\n --glimmer-shine: rgba(var(--color-white--rgb), var(--glimmer-shine-opacity));\n --glimmer-shine-opacity: 80%;\n --duration-base: calc(var(--timing-slowest) * 4); /* 2s */\n --duration-fast: calc(var(--duration-base) / 2); /* 1s */\n\n width: 100%;\n height: 100%;\n border-radius: calc(16px / 8);\n border-radius: var(--radius-base);\n background-color: rgba(0 0 0 5%);\n background-color: rgba(0, 0, 0 5%);\n background-color: var(--glimmer-background);\n background-image: linear-gradient(\n 90deg,\n transparent 0px,\n rgba(255, 255, 255, 0.8) calc(16px * 2),\n transparent calc(16px * 4)\n );\n background-image: linear-gradient(\n 90deg,\n transparent 0px,\n rgba(255, 255, 255, 80%) calc(16px * 2),\n transparent calc(16px * 4)\n );\n background-image: linear-gradient(\n 90deg,\n transparent 0px,\n var(--glimmer-shine) var(--space-larger),\n transparent var(--space-extravagant)\n );\n background-repeat: no-repeat;\n background-size: calc(16px * 4) 100%;\n background-size: var(--space-extravagant) 100%;\n -webkit-animation: FXzzrJAf890- 2s infinite linear;\n animation: FXzzrJAf890- 2s infinite linear;\n}@supports (color: rgb(0 0 0 / 0.5)) and (color: hsl(0 0% 0% / 0.5)) {.FXzzrJAf890- {\n --glimmer-background: rgba(var(--color-black--rgb), 5%);\n}\n}\n\n.s9bG0yRJR3A- {\n --glimmer-background: rgba(var(--color-white--rgb) 10%);\n --glimmer-shine-opacity: 25%;\n}\n\n@supports (color: rgb(0 0 0 / 0.5)) and (color: hsl(0 0% 0% / 0.5)) {\n\n.s9bG0yRJR3A- {\n --glimmer-background: rgba(var(--color-white--rgb), 10%);\n}\n}\n\n@-webkit-keyframes FXzzrJAf890- {\n 0%,\n 20% {\n background-position-x: calc((16px * 4) * -1);\n background-position-x: calc(calc(16px * 4) * -1);\n background-position-x: calc(var(--space-extravagant) * -1);\n }\n\n 100% {\n background-position-x: calc(100% + (16px * 4));\n background-position-x: calc(100% + calc(16px * 4));\n background-position-x: calc(100% + var(--space-extravagant));\n }\n}\n\n@keyframes FXzzrJAf890- {\n 0%,\n 20% {\n background-position-x: calc((16px * 4) * -1);\n background-position-x: calc(calc(16px * 4) * -1);\n background-position-x: calc(var(--space-extravagant) * -1);\n }\n\n 100% {\n background-position-x: calc(100% + (16px * 4));\n background-position-x: calc(100% + calc(16px * 4));\n background-position-x: calc(100% + var(--space-extravagant));\n }\n}\n\n.M0X0dxjIyv4- {\n width: 30%;\n max-width: 180px;\n min-width: 120px;\n}\n\n.v2Q1amzd7Ac- {\n display: inline-block;\n width: 100px;\n height: 36px;\n}\n\n._8va--lBgr38- {\n display: block;\n width: 100%;\n min-width: 100px;\n}\n";
15
- var styles = {"glimmer":"FXzzrJAf890-","reverseTheme":"s9bG0yRJR3A-","header":"M0X0dxjIyv4-","button":"v2Q1amzd7Ac-","buttonFill":"_8va--lBgr38-"};
16
- styleInject_es.styleInject(css_248z$3);
17
-
18
- var css_248z$2 = ".siUUG4rZNSk- {\n height: calc(16px / 2);\n height: var(--space-small);\n}\n\n.nFuBXyrhG2Q- {\n height: calc(16px * 1);\n height: var(--space-base);\n}\n\n.oiVEoAqI-fU- {\n height: calc(16px * 1.5);\n height: var(--space-large);\n}\n\n.Tkmo6mSMI9Y- {\n height: calc(16px * 2);\n height: var(--space-larger);\n}\n\n.uVeaD3IhD6o- {\n height: calc(16px * 3);\n height: var(--space-largest);\n}\n\n._6Wak9NLJ3VQ- {\n height: 100%;\n min-width: calc(16px * 1);\n min-width: var(--space-base);\n min-height: calc(16px * 1);\n min-height: var(--space-base);\n}\n";
19
- var sizes = {"small":"siUUG4rZNSk-","base":"nFuBXyrhG2Q-","large":"oiVEoAqI-fU-","larger":"Tkmo6mSMI9Y-","largest":"uVeaD3IhD6o-","auto":"_6Wak9NLJ3VQ-"};
20
- styleInject_es.styleInject(css_248z$2);
21
-
22
- var css_248z$1 = ".enoWbteryXg- {\n width: 100%;\n}\n\n._9qkwCdedX1M- {\n width: 85%;\n}\n\n.XtyJxvcJDFs- {\n width: 70%;\n}\n\n._8unQ0TS1He4-,\n.ameRMYEKfss- {\n width: auto;\n aspect-ratio: 1;\n}\n\n.ameRMYEKfss- {\n border-radius: 100%;\n border-radius: var(--radius-circle);\n}\n";
23
- var shapes = {"rectangle":"enoWbteryXg-","rectangleShort":"_9qkwCdedX1M-","rectangleShorter":"XtyJxvcJDFs-","square":"_8unQ0TS1He4-","circle":"ameRMYEKfss-"};
24
- styleInject_es.styleInject(css_248z$1);
25
-
26
- var css_248z = ".hO0mZ6TeVko- {\n -webkit-animation-duration: var(--duration-base);\n animation-duration: var(--duration-base);\n}\n\n.WXi5-zF8Ll4- {\n -webkit-animation-duration: calc(var(--duration-fast));\n animation-duration: calc(var(--duration-fast));\n}\n";
27
- var timings = {"base":"hO0mZ6TeVko-","fast":"WXi5-zF8Ll4-"};
28
- styleInject_es.styleInject(css_248z);
29
-
30
- const GLIMMER_TEST_ID = "ATL-Glimmer";
31
- const GLIMMER_HEADER_TEST_ID = "ATL-GlimmerHeader";
32
- const GLIMMER_TEXT_TEST_ID = "ATL-GlimmerText";
33
- const GLIMMER_BUTTON_TEST_ID = "ATL-GlimmerButton";
34
- /**
35
- * **Experimental component! Use at your own risk.**
36
- *
37
- * Foundational component used to build loading states such as Skeleton UI
38
- *
39
- * @experimental
40
- */
41
- function Glimmer({ size = "base", shape = "rectangle", timing = "base", reverseTheme = false, width, }) {
42
- const className = classnames__default["default"](styles.glimmer, sizes[size], shapes[shape], timings[timing], { [styles.reverseTheme]: reverseTheme });
43
- return (React__default["default"].createElement("div", { "aria-busy": "true", className: className, "data-testid": GLIMMER_TEST_ID, style: { width } }));
44
- }
45
- Glimmer.Header = function GlimmerHeader(_a) {
46
- var { level = 3 } = _a, props = tslib_es6.__rest(_a, ["level"]);
47
- const headerSize = {
48
- 1: "largest",
49
- 2: "larger",
50
- 3: "large",
51
- 4: "base",
52
- 5: "small",
53
- };
54
- return (React__default["default"].createElement("div", { className: styles.header, "data-testid": GLIMMER_HEADER_TEST_ID },
55
- React__default["default"].createElement(Glimmer, Object.assign({ size: headerSize[level] }, props))));
56
- };
57
- Glimmer.Text = function GlimmerText(_a) {
58
- var { width, lines = 3 } = _a, props = tslib_es6.__rest(_a, ["width", "lines"]);
59
- const children = [
60
- React__default["default"].createElement(Glimmer, Object.assign({ key: "1", size: "small", shape: "rectangleShort" }, props)),
61
- React__default["default"].createElement(Glimmer, Object.assign({ key: "2", size: "small" }, props)),
62
- React__default["default"].createElement(Glimmer, Object.assign({ key: "3", size: "small", shape: "rectangleShorter" }, props)),
63
- ].slice(0, lines);
64
- return (React__default["default"].createElement("div", { style: { width }, "data-testid": GLIMMER_TEXT_TEST_ID },
65
- React__default["default"].createElement(Content.Content, { spacing: "small" }, children)));
66
- };
67
- Glimmer.Button = function GlimmerButton(_a) {
68
- var { fullWidth = false } = _a, props = tslib_es6.__rest(_a, ["fullWidth"]);
69
- const buttonClassNames = classnames__default["default"](styles.button, {
70
- [styles.buttonFill]: fullWidth,
71
- });
72
- return (React__default["default"].createElement("div", { className: buttonClassNames, "data-testid": GLIMMER_BUTTON_TEST_ID },
73
- React__default["default"].createElement(Glimmer, Object.assign({}, props, { size: "auto" }))));
74
- };
75
-
76
- exports.GLIMMER_TEST_ID = GLIMMER_TEST_ID;
77
- exports.Glimmer = Glimmer;
@@ -1,28 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var classnames = require('classnames');
5
- var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
6
- var Typography = require('./Typography-973b122e.js');
7
-
8
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
9
-
10
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
11
- var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
12
-
13
- var css_248z = ".S72WkdRbhc0- {\n display: -ms-inline-flexbox;\n display: inline-flex;\n border-radius: calc(16px / 4);\n border-radius: var(--radius-large);\n}\n\n.bMWuAXJHkbw- {\n padding: calc((16px / 4) * 1.5) calc((16px / 2) * 1.25);\n padding: calc(calc(16px / 4) * 1.5) calc(calc(16px / 2) * 1.25);\n padding: calc(var(--space-smaller) * 1.5) calc(var(--space-small) * 1.25);\n}\n\n.ui07veHjPII- {\n padding: calc((16px / 4) * 1.5) calc((16px / 2) * 1.25);\n padding: calc(calc(16px / 4) * 1.5) calc(calc(16px / 2) * 1.25);\n padding: calc(var(--space-smaller) * 1.5) calc(var(--space-small) * 1.25);\n}\n\n.WIXhLSQ7z8A- {\n padding: calc((16px / 2) * 1.25) calc((16px / 4) * 3.5);\n padding: calc(calc(16px / 2) * 1.25) calc(calc(16px / 4) * 3.5);\n padding: calc(var(--space-small) * 1.25) calc(var(--space-smaller) * 3.5);\n}\n\n._8RuKvOhj-Ro- {\n color: rgb(66, 78, 86);\n color: var(--color-greyBlue--dark);\n background-color: rgb(238, 240, 242);\n background-color: var(--color-greyBlue--lightest);\n}\n\n._2vEF1nvVWm8- {\n color: rgb(128, 25, 0);\n color: var(--color-red--dark);\n background-color: rgb(255, 226, 219);\n background-color: var(--color-red--lightest);\n}\n\n.Wt305sIAeoE- {\n color: rgb(158, 98, 23);\n color: var(--color-orange--dark);\n background-color: rgb(253, 239, 222);\n background-color: var(--color-orange--lightest);\n}\n\n.F8KkNxz8W3A- {\n color: rgb(81, 114, 9);\n color: var(--color-green--dark);\n background-color: rgb(236, 243, 219);\n background-color: var(--color-green--lightest);\n}\n\n.URZZoKSX4So- {\n color: rgb(1, 27, 37);\n color: var(--color-blue--dark);\n background-color: rgb(217, 223, 225);\n background-color: var(--color-blue--lightest);\n}\n\n.OeLBV-9i0Rs- {\n color: rgb(49, 69, 98);\n color: var(--color-navy--dark);\n background-color: rgb(228, 233, 239);\n background-color: var(--color-navy--lightest);\n}\n\n._2Xwx5tarf1w- {\n color: rgb(144, 127, 10);\n color: var(--color-yellow--dark);\n background-color: rgb(250, 246, 219);\n background-color: var(--color-yellow--lightest);\n}\n\n.iCqIjI7GkEk- {\n color: rgb(99, 125, 46);\n color: var(--color-lime--dark);\n background-color: rgb(240, 246, 227);\n background-color: var(--color-lime--lightest);\n}\n\n._4iEIjiZj9oA- {\n color: rgb(88, 73, 127);\n color: var(--color-purple--dark);\n background-color: rgb(237, 234, 246);\n background-color: var(--color-purple--lightest);\n}\n\n.JRW9QFSjLTA- {\n color: rgb(116, 62, 98);\n color: var(--color-pink--dark);\n background-color: rgb(244, 231, 239);\n background-color: var(--color-pink--lightest);\n}\n\n.fbhprd-Gl8k- {\n color: rgb(40, 112, 95);\n color: var(--color-teal--dark);\n background-color: rgb(226, 243, 239);\n background-color: var(--color-teal--lightest);\n}\n\n.yrF9aZSaTdw- {\n color: rgb(122, 128, 21);\n color: var(--color-yellowGreen--dark);\n background-color: rgb(245, 246, 222);\n background-color: var(--color-yellowGreen--lightest);\n}\n\n.RPvjah0FdjI- {\n color: rgba(255, 255, 255, 1);\n color: var(--color-white);\n background-color: rgb(77, 105, 116);\n background-color: var(--color-blue--light);\n}\n\n.apwauWJ6ITc- {\n color: rgb(39, 105, 146);\n color: var(--color-lightBlue--dark);\n background-color: rgb(226, 241, 250);\n background-color: var(--color-lightBlue--lightest);\n}\n\n.n8qJynvE-n0- {\n color: rgb(55, 69, 132);\n color: var(--color-indigo--dark);\n background-color: rgb(230, 233, 247);\n background-color: var(--color-indigo--lightest);\n}\n";
14
- var styles = {"inlineLabel":"S72WkdRbhc0-","base":"bMWuAXJHkbw-","large":"ui07veHjPII-","larger":"WIXhLSQ7z8A-","greyBlue":"_8RuKvOhj-Ro-","red":"_2vEF1nvVWm8-","orange":"Wt305sIAeoE-","green":"F8KkNxz8W3A-","blue":"URZZoKSX4So-","navy":"OeLBV-9i0Rs-","yellow":"_2Xwx5tarf1w-","lime":"iCqIjI7GkEk-","purple":"_4iEIjiZj9oA-","pink":"JRW9QFSjLTA-","teal":"fbhprd-Gl8k-","yellowGreen":"yrF9aZSaTdw-","blueDark":"RPvjah0FdjI-","lightBlue":"apwauWJ6ITc-","indigo":"n8qJynvE-n0-"};
15
- styleInject_es.styleInject(css_248z);
16
-
17
- function InlineLabel({ size = "base", color = "greyBlue", children, }) {
18
- const className = classnames__default["default"](styles.inlineLabel, styles[size], styles[color]);
19
- const sizeMapper = {
20
- base: "small",
21
- large: "large",
22
- larger: "large",
23
- };
24
- return (React__default["default"].createElement("span", { className: className },
25
- React__default["default"].createElement(Typography.Typography, { element: "span", size: sizeMapper[size] }, children)));
26
- }
27
-
28
- exports.InlineLabel = InlineLabel;
@@ -1,33 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var classnames = require('classnames');
5
- var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
6
-
7
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
-
9
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
10
- var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
11
-
12
- var css_248z = "._4bvHwa3-qBA- > *:not(:last-child) {\n margin-bottom: -1px !important;\n}\n\n.bHm4WuX8ToY- {\n display: -ms-flexbox;\n display: flex;\n}\n\n.bHm4WuX8ToY- > *:not(:last-child) {\n margin-bottom: auto;\n margin-right: -1px;\n}\n\n/* Border corners are rounded on the outside edges of the group */\n\n.nmDPgrXofeE- {\n --public-field--top-left-radius: 0;\n --public-field--top-right-radius: 0;\n --public-field--bottom-left-radius: 0;\n --public-field--bottom-right-radius: 0;\n}\n\n._4bvHwa3-qBA- > :first-child:not(.bHm4WuX8ToY-) {\n --public-field--top-left-radius: var(--radius-base);\n --public-field--top-right-radius: var(--radius-base);\n}\n\n._4bvHwa3-qBA- > :last-child:not(.bHm4WuX8ToY-) {\n --public-field--bottom-left-radius: var(--radius-base);\n --public-field--bottom-right-radius: var(--radius-base);\n}\n\n/* First Horizontal Input Group */\n\n.bHm4WuX8ToY-:first-child > :first-child {\n --public-field--top-left-radius: var(--radius-base);\n}\n\n.bHm4WuX8ToY-:first-child > :last-child {\n --public-field--top-right-radius: var(--radius-base);\n}\n\n/* Last Horizontal Input Group */\n\n.bHm4WuX8ToY-:last-child > :first-child {\n --public-field--bottom-left-radius: var(--radius-base);\n}\n\n.bHm4WuX8ToY-:last-child > :last-child {\n --public-field--bottom-right-radius: var(--radius-base);\n}\n";
13
- var styles = {"vertical":"_4bvHwa3-qBA-","horizontal":"bHm4WuX8ToY-","inputGroup":"nmDPgrXofeE-"};
14
- styleInject_es.styleInject(css_248z);
15
-
16
- function InputGroup({ children, flowDirection = "vertical", }) {
17
- if (isInvalidGroupNesting(children))
18
- return React__default["default"].createElement(React__default["default"].Fragment, null);
19
- const className = classnames__default["default"](styles.inputGroup, styles[flowDirection]);
20
- return React__default["default"].createElement("div", { className: className }, children);
21
- }
22
- function isInvalidGroupNesting(childs) {
23
- return React__default["default"].Children.toArray(childs).some(child => {
24
- if (child.type === InputGroup &&
25
- child.props.flowDirection != "horizontal") {
26
- console.error(`ERROR: InputGroup not rendered: nesting 'flowDirection="vertical"' columns not supported.`, `https://atlantis.getjobber.com/?path=/story/components-forms-and-inputs-inputgroup-web--nested`);
27
- return true;
28
- }
29
- return false;
30
- });
31
- }
32
-
33
- exports.InputGroup = InputGroup;
@@ -1,43 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var classnames = require('classnames');
5
- var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
6
-
7
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
-
9
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
10
- var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
11
-
12
- var css_248z$1 = ":root {\n --progress-bar--height: var(--space-base);\n}\n\nprogress.S1cioqW7loo-[value] {\n width: 100%;\n height: calc(16px * 1);\n height: var(--progress-bar--height);\n border: none;\n vertical-align: baseline;\n -webkit-appearance: none;\n appearance: none;\n}\n\nprogress.S1cioqW7loo-[value],\nprogress.S1cioqW7loo-[value]::-webkit-progress-bar {\n box-shadow: inset 0px 2px 4px rgba(0, 0, 0, 0.05);\n border-radius: calc((16px * 1) / 2);\n border-radius: calc(calc(16px * 1) / 2);\n border-radius: calc(var(--progress-bar--height) / 2);\n}\n\nprogress.S1cioqW7loo-[value]::-webkit-progress-bar {\n background-color: rgb(238, 240, 242);\n background-color: var(--color-surface--background);\n}\n\nprogress.S1cioqW7loo-[value]::-webkit-progress-value {\n border-radius: calc((16px * 1) / 2);\n border-radius: calc(calc(16px * 1) / 2);\n border-radius: calc(var(--progress-bar--height) / 2);\n background-color: rgb(125, 176, 14);\n background-color: var(--color-interactive);\n -webkit-transition: all 300ms ease-out;\n transition: all 300ms ease-out;\n -webkit-transition: all var(--timing-slow) ease-out;\n transition: all var(--timing-slow) ease-out;\n}\n\nprogress.S1cioqW7loo-[value]::-moz-progress-bar {\n border-radius: calc((16px * 1) / 2);\n border-radius: calc(calc(16px * 1) / 2);\n border-radius: calc(var(--progress-bar--height) / 2);\n background-color: rgb(125, 176, 14);\n background-color: var(--color-interactive);\n -moz-transition: all 300ms ease-out;\n transition: all 300ms ease-out;\n -moz-transition: all var(--timing-slow) ease-out;\n transition: all var(--timing-slow) ease-out;\n}\n\nprogress.nv5fejwjHzo-[value]::-webkit-progress-value {\n -webkit-transition: all 100ms ease-out;\n transition: all 100ms ease-out;\n -webkit-transition: all var(--timing-quick) ease-out;\n transition: all var(--timing-quick) ease-out;\n}\n\n.dyBDsjWCui4- {\n display: -ms-flexbox;\n display: flex;\n -ms-flex-direction: row;\n flex-direction: row;\n width: 100%;\n gap: calc(16px / 2);\n gap: var(--space-small);\n}\n";
13
- var styles = {"ProgressBar":"S1cioqW7loo-","SteppedProgressBar":"nv5fejwjHzo-","wrapper":"dyBDsjWCui4-"};
14
- styleInject_es.styleInject(css_248z$1);
15
-
16
- var css_248z = ".CzIxUWYkrdo- {\n --progress-bar--height: var(--space-smaller);\n}\n\n.JNSDqHqKVlE- {\n --progress-bar--height: var(--space-small);\n}\n\n.nzFMJ2k4zJ0- {\n --progress-bar--height: var(--space-base);\n}\n";
17
- var sizes = {"smaller":"CzIxUWYkrdo-","small":"JNSDqHqKVlE-","base":"nzFMJ2k4zJ0-"};
18
- styleInject_es.styleInject(css_248z);
19
-
20
- function ProgressBarStepped({ currentStep, totalSteps, percentage, size = "base", }) {
21
- const steppedProgressBarClassName = classnames__default["default"](styles.ProgressBar, styles.SteppedProgressBar, sizes[size]);
22
- const ariaLabel = `progress, ${currentStep} out of ${totalSteps}`;
23
- return (React__default["default"].createElement("div", { role: "progressbar", className: styles.wrapper, "aria-valuenow": percentage, "aria-valuetext": ariaLabel }, Array.from({ length: totalSteps }).map((_, index) => {
24
- const step = index + 1;
25
- const value = step <= currentStep ? 100 : 0;
26
- return (React__default["default"].createElement("progress", { key: step, className: steppedProgressBarClassName, value: value, "data-testid": "progress-step" },
27
- value,
28
- "%"));
29
- })));
30
- }
31
-
32
- function ProgressBar({ currentStep, totalSteps, size = "base", variation = "progress", }) {
33
- const percentage = (currentStep / totalSteps) * 100;
34
- const progressBarClassName = classnames__default["default"](styles.ProgressBar, sizes[size]);
35
- if (variation === "stepped") {
36
- return (React__default["default"].createElement(ProgressBarStepped, { currentStep: currentStep, totalSteps: totalSteps, percentage: percentage, size: size }));
37
- }
38
- return (React__default["default"].createElement("progress", { className: progressBarClassName, max: totalSteps, value: currentStep },
39
- percentage,
40
- "%"));
41
- }
42
-
43
- exports.ProgressBar = ProgressBar;
@@ -1,47 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var uuid = require('uuid');
5
- var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
6
- var Text = require('./Text-4a2bc89f.js');
7
-
8
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
9
-
10
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
11
-
12
- var css_248z = "._5P8wEHDUdKY- {\n display: -ms-inline-flexbox;\n display: inline-flex;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n\n._08ZPdlE98Ko- {\n /* Hide checkbox on UI but not screen readers and still allow focus state */\n position: absolute;\n left: -999vw;\n}\n\n.-PUoLXltVlQ- {\n display: -ms-inline-flexbox;\n display: inline-flex;\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 cursor: pointer;\n -ms-flex-align: start;\n align-items: flex-start;\n}\n\n._08ZPdlE98Ko- + .-PUoLXltVlQ-::before {\n content: \"\";\n display: block;\n width: calc(16px * 1);\n width: var(--space-base);\n height: calc(16px * 1);\n height: var(--space-base);\n box-sizing: border-box;\n margin: calc(16px / 8) calc(16px / 2) 0 0;\n margin: var(--space-smallest) var(--space-small) 0 0;\n border: calc(16px / 8) solid rgb(125, 176, 14);\n border: var(--border-thick) solid var(--color-interactive);\n border-radius: 100%;\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n transition: all 200ms;\n transition: all var(--timing-base);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n}\n\n._08ZPdlE98Ko-:focus + .-PUoLXltVlQ-:before {\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._08ZPdlE98Ko-:focus:checked + .-PUoLXltVlQ-:before {\n box-shadow: 0px 0px 0px calc(16px / 16) rgb(81, 114, 9),\n 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: 0px 0px 0px var(--space-minuscule) var(--color-interactive--hover),\n var(--shadow-focus);\n}\n\n._08ZPdlE98Ko-:checked + .-PUoLXltVlQ-::before {\n box-shadow: 0px 0px 0px calc(16px / 16) rgb(81, 114, 9);\n box-shadow: 0px 0px 0px var(--space-minuscule) var(--color-interactive--hover);\n border-color: rgb(81, 114, 9);\n border-color: var(--color-interactive--hover);\n border-width: calc(16px / 4);\n border-width: var(--border-thicker);\n background-color: rgb(125, 176, 14);\n background-color: var(--color-interactive);\n}\n\n._08ZPdlE98Ko-[disabled] + .-PUoLXltVlQ- {\n color: rgb(181, 181, 181);\n color: var(--color-disabled);\n cursor: not-allowed;\n}\n\n._08ZPdlE98Ko-[disabled] + .-PUoLXltVlQ-::before {\n border-color: rgb(225, 225, 225);\n border-color: var(--color-disabled--secondary);\n}\n\n._08ZPdlE98Ko-[disabled]:checked + .-PUoLXltVlQ-::before {\n box-shadow: 0px 0px 0px calc(16px / 16) rgb(181, 181, 181);\n box-shadow: 0px 0px 0px var(--space-minuscule) var(--color-disabled);\n border-color: rgb(181, 181, 181);\n border-color: var(--color-grey);\n background-color: rgb(225, 225, 225);\n background-color: var(--color-disabled--secondary);\n}\n\n._8r6qT-6S9EI-,\n.C5SzbO1epLk- {\n margin-bottom: calc(16px / 2);\n margin-bottom: var(--space-small);\n padding-left: calc(16px * 1.5);\n padding-left: var(--space-large);\n}\n\n._08ZPdlE98Ko-[disabled] + .-PUoLXltVlQ- + ._8r6qT-6S9EI- > p {\n color: rgb(181, 181, 181);\n color: var(--color-disabled);\n}\n";
13
- var styles = {"radioGroup":"_5P8wEHDUdKY-","input":"_08ZPdlE98Ko-","label":"-PUoLXltVlQ-","description":"_8r6qT-6S9EI-","children":"C5SzbO1epLk-"};
14
- styleInject_es.styleInject(css_248z);
15
-
16
- /**
17
- * For rendering props only. To make updates to
18
- * the real RadioOption, look at InternalRadioOption
19
- */
20
- function RadioOption({ children }) {
21
- return React__default["default"].createElement(React__default["default"].Fragment, null, children);
22
- }
23
- function InternalRadioOption({ value, name, label, description, disabled, checked, children, onChange, }) {
24
- const inputId = `${value.toString()}_${uuid.v1()}`;
25
- const shouldRenderIndependentChildren = label && children;
26
- return (React__default["default"].createElement("div", null,
27
- React__default["default"].createElement("input", { onChange: handleChange, type: "radio", name: name, value: value, disabled: disabled, checked: checked, id: inputId, className: styles.input, "aria-describedby": description ? `${inputId}_description` : undefined }),
28
- React__default["default"].createElement("label", { className: styles.label, htmlFor: inputId }, label ? label : children),
29
- description && (React__default["default"].createElement("div", { className: styles.description, id: `${inputId}_description` },
30
- React__default["default"].createElement(Text.Text, { variation: "subdued", size: "small" }, description))),
31
- shouldRenderIndependentChildren && (React__default["default"].createElement("div", { className: styles.children, id: `${inputId}_children` }, children))));
32
- function handleChange() {
33
- onChange(value);
34
- }
35
- }
36
-
37
- function RadioGroup({ children, value, ariaLabel, onChange, name = uuid.v1(), }) {
38
- return (React__default["default"].createElement("div", { role: "radiogroup", "aria-label": ariaLabel, className: styles.radioGroup }, React__default["default"].Children.map(children, option => (React__default["default"].createElement(InternalRadioOption, Object.assign({ checked: value === option.props.value, name: name, onChange: handleChange }, option.props), option.props.children)))));
39
- function handleChange(newValue) {
40
- if (newValue !== value) {
41
- onChange(newValue);
42
- }
43
- }
44
- }
45
-
46
- exports.RadioGroup = RadioGroup;
47
- exports.RadioOption = RadioOption;
@@ -1,24 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var classnames = require('classnames');
5
- var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
6
-
7
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
-
9
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
10
- var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
11
-
12
- var css_248z = ".uoU-LfjFDv0- {\n width: calc(16px * 2);\n width: var(--space-larger);\n height: calc(16px * 2);\n height: var(--space-larger);\n box-shadow: 0px 0px 4px 2px rgba(1, 41, 57, 0.4);\n border: solid rgb(77, 105, 116);\n border: solid var(--color-blue--light);\n border-top-color: rgba(255, 255, 255, 1);\n border-top-color: var(--color-white);\n border-width: calc((16px / 2) * 0.75);\n border-width: calc(calc(16px / 2) * 0.75);\n border-width: calc(var(--space-small) * 0.75);\n border-radius: 100%;\n border-radius: var(--radius-circle);\n background-color: rgb(217, 223, 225);\n background-color: var(--color-blue--lightest);\n -webkit-animation-duration: calc(500ms * 2);\n -webkit-animation-duration: calc(var(--timing-slowest) * 2);\n animation-duration: calc(500ms * 2);\n animation-duration: calc(var(--timing-slowest) * 2);\n -webkit-animation-iteration-count: infinite;\n animation-iteration-count: infinite;\n -webkit-animation-name: _1aCKd5q9u34-;\n animation-name: _1aCKd5q9u34-;\n -webkit-animation-timing-function: linear;\n animation-timing-function: linear;\n will-change: transform;\n}\n\n@-webkit-keyframes _1aCKd5q9u34- {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n\n 100% {\n -webkit-transform: rotate(359deg);\n transform: rotate(359deg);\n }\n}\n\n@keyframes _1aCKd5q9u34- {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n\n 100% {\n -webkit-transform: rotate(359deg);\n transform: rotate(359deg);\n }\n}\n\n.cLRQwkSqnhA- {\n width: calc(16px * 1);\n width: var(--space-base);\n height: calc(16px * 1);\n height: var(--space-base);\n border-width: calc(16px / 4);\n border-width: var(--space-smaller);\n}\n\n.h6O4vDPCWOQ- {\n display: inline-block;\n margin-top: calc((16px / 4) * -1);\n margin-top: calc(calc(16px / 4) * -1);\n margin-top: calc(var(--space-smaller) * -1);\n vertical-align: middle;\n}\n";
13
- var styles = {"spinner":"uoU-LfjFDv0-","animationSpin":"_1aCKd5q9u34-","small":"cLRQwkSqnhA-","inline":"h6O4vDPCWOQ-"};
14
- styleInject_es.styleInject(css_248z);
15
-
16
- function Spinner({ size = "base", inline }) {
17
- const spinnerStyles = classnames__default["default"](styles.spinner, {
18
- [styles.small]: size === "small",
19
- [styles.inline]: inline,
20
- });
21
- return (React__default["default"].createElement("div", { className: spinnerStyles, role: "alert", "aria-busy": true, "aria-label": "loading" }));
22
- }
23
-
24
- exports.Spinner = Spinner;
@@ -1,56 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var classnames = require('classnames');
5
- var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
6
- var Typography = require('./Typography-973b122e.js');
7
-
8
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
9
-
10
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
11
- var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
12
-
13
- var css_248z = ":root {\n --switch--pipSize: calc(var(--space-base) * 1.875);\n --switch--labelWidth: calc(var(--switch--pipSize) * 1.3);\n --switch--borderOffset: calc(var(--border-base) * 2);\n}\n\n.NaSI2jsLI0c-,\n.NaSI2jsLI0c- * {\n box-sizing: border-box;\n transition: all 200ms;\n transition: all var(--timing-base);\n}\n\n.NaSI2jsLI0c- {\n display: -ms-inline-flexbox;\n display: inline-flex;\n width: calc((((16px * 1) * 1.875) * 1.3) + ((16px * 1) * 1.875));\n width: calc(calc(calc(calc(16px * 1) * 1.875) * 1.3) + calc(calc(16px * 1) * 1.875));\n width: calc(var(--switch--labelWidth) + var(--switch--pipSize));\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 * 1) * 1.875);\n border-radius: calc(calc(16px * 1) * 1.875);\n border-radius: var(--switch--pipSize);\n overflow: hidden;\n line-height: normal;\n background-color: rgb(238, 240, 242);\n background-color: var(--color-surface--background);\n cursor: pointer;\n -webkit-appearance: none;\n appearance: none;\n}\n\n.NaSI2jsLI0c-: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\n.HbAoDMJhkwY- {\n border-color: rgb(125, 176, 14);\n border-color: var(--color-interactive);\n background-color: rgb(125, 176, 14);\n background-color: var(--color-interactive);\n}\n\n.cc259FtdxeE- {\n display: -ms-flexbox;\n display: flex;\n position: relative;\n margin-left: calc(-1 * (((16px * 1) * 1.875) * 1.3));\n margin-left: calc(-1 * calc(calc(calc(16px * 1) * 1.875) * 1.3));\n margin-left: calc(-1 * var(--switch--labelWidth));\n pointer-events: none;\n -ms-flex: 1 1 100%;\n flex: 1 1 100%;\n -ms-flex-align: center;\n align-items: center;\n}\n\n.HbAoDMJhkwY- .cc259FtdxeE- {\n margin-left: calc(-1 * ((16px / 16) * 2));\n margin-left: calc(-1 * calc(calc(16px / 16) * 2));\n margin-left: calc(-1 * var(--switch--borderOffset));\n}\n\n.YZ-HIehHOBA- {\n display: -ms-flexbox;\n display: flex;\n position: relative;\n min-width: calc(((16px * 1) * 1.875) * 1.3);\n min-width: calc(calc(calc(16px * 1) * 1.875) * 1.3);\n min-width: var(--switch--labelWidth);\n margin-top: calc(16px / 16);\n margin-top: var(--space-minuscule);\n -webkit-user-select: none;\n -ms-user-select: none;\n user-select: none;\n pointer-events: none;\n -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n\n.YZ-HIehHOBA-:first-of-type {\n padding-left: calc(16px / 2);\n padding-left: var(--space-small);\n}\n\n.YZ-HIehHOBA-:last-of-type {\n padding-right: calc(16px / 2);\n padding-right: var(--space-small);\n}\n\n._2hxova2FHpM- {\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n width: calc((16px * 1) * 1.875);\n width: calc(calc(16px * 1) * 1.875);\n width: var(--switch--pipSize);\n height: calc((16px * 1) * 1.875);\n height: calc(calc(16px * 1) * 1.875);\n height: var(--switch--pipSize);\n border: calc(16px / 16) solid rgb(217, 223, 225);\n border: var(--border-base) solid var(--color-border);\n border-radius: 100%;\n border-radius: var(--radius-circle);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n}\n\n.HbAoDMJhkwY- ._2hxova2FHpM- {\n border-color: rgb(125, 176, 14);\n border-color: var(--color-green);\n}\n\n._6hWvJHjyLlk- {\n border-color: rgb(225, 225, 225);\n border-color: var(--color-disabled--secondary);\n background-color: rgb(238, 240, 242);\n background-color: var(--color-surface--background);\n cursor: not-allowed;\n}\n\n._6hWvJHjyLlk- ._2hxova2FHpM- {\n border-color: rgb(225, 225, 225);\n border-color: var(--color-disabled--secondary);\n}\n";
14
- var styles = {"track":"NaSI2jsLI0c-","isChecked":"HbAoDMJhkwY-","toggle":"cc259FtdxeE-","label":"YZ-HIehHOBA-","pip":"_2hxova2FHpM-","disabled":"_6hWvJHjyLlk-"};
15
- styleInject_es.styleInject(css_248z);
16
-
17
- function Switch({ value: providedValue, ariaLabel, name, disabled, onChange, }) {
18
- const [statefulValue, setValue] = React.useState(false);
19
- const value = providedValue != undefined ? providedValue : statefulValue;
20
- const toggleSwitch = () => {
21
- if (disabled) {
22
- return;
23
- }
24
- const newValue = !value;
25
- onChange && onChange(newValue);
26
- if (providedValue == undefined) {
27
- setValue(newValue);
28
- }
29
- };
30
- const className = classnames__default["default"](styles.track, {
31
- [styles.isChecked]: value,
32
- [styles.disabled]: disabled,
33
- });
34
- return (React__default["default"].createElement(React__default["default"].Fragment, null,
35
- React__default["default"].createElement("button", { id: name, type: "button", role: "switch", "aria-checked": value, "aria-label": ariaLabel, className: className, onClick: toggleSwitch, disabled: disabled },
36
- React__default["default"].createElement("span", { className: styles.toggle },
37
- React__default["default"].createElement(Label, { as: "On", disabled: disabled }),
38
- React__default["default"].createElement("span", { className: styles.pip }),
39
- React__default["default"].createElement(Label, { as: "Off", disabled: disabled }))),
40
- React__default["default"].createElement("input", { name: name, type: "hidden", value: String(value) })));
41
- }
42
- function Label({ as, disabled }) {
43
- const getTextColor = () => {
44
- if (disabled) {
45
- return "grey";
46
- }
47
- else if (as === "On") {
48
- return "white";
49
- }
50
- return "greyBlue";
51
- };
52
- return (React__default["default"].createElement("span", { className: styles.label },
53
- React__default["default"].createElement(Typography.Typography, { element: "span", textColor: getTextColor(), size: "small", fontWeight: "bold", textCase: "uppercase" }, as)));
54
- }
55
-
56
- exports.Switch = Switch;
@@ -1,62 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var classnames = require('classnames');
5
- var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
6
-
7
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
-
9
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
10
- var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
11
-
12
- var css_248z$8 = ".asDB9Ra2UpA- {\n margin: 0;\n padding: 0;\n font-family: \"Inter\", Helvetica, Arial, sans-serif;\n font-family: var(--typography--fontFamily-normal);\n /* Wrap really long words or URL's */\n word-wrap: break-word;\n overflow-wrap: break-word;\n word-wrap: break-word;\n}\n";
13
- var styles = {"base":"asDB9Ra2UpA-"};
14
- styleInject_es.styleInject(css_248z$8);
15
-
16
- var css_248z$7 = "._7C4Ck1izBPs- {\n font-size: calc(\n (16px * 1) * 3\n );\n font-size: calc(\n calc(16px * 1) * 3\n );\n font-size: var(--typography--fontSize-extravagant);\n line-height: 1.08;\n line-height: var(--typography--lineHeight-miniscule);\n}\n\n._8X-fSrUTxV8- {\n font-size: calc((16px * 1) * 2.25);\n font-size: calc(calc(16px * 1) * 2.25);\n font-size: var(--typography--fontSize-jumbo);\n line-height: 1.08;\n line-height: var(--typography--lineHeight-miniscule);\n}\n\n.n-SPJXPXLSA- {\n font-size: calc((16px * 1) * 1.5);\n font-size: calc(calc(16px * 1) * 1.5);\n font-size: var(--typography--fontSize-largest);\n line-height: 1.12;\n line-height: var(--typography--lineHeight-tightest);\n}\n\n.vCrvF55YQ9o- {\n font-size: calc((16px * 1) * 1.25);\n font-size: calc(calc(16px * 1) * 1.25);\n font-size: var(--typography--fontSize-larger);\n line-height: 1.2;\n line-height: var(--typography--lineHeight-tight);\n}\n\n.FBoaHWotSik- {\n font-size: calc(16px * 1);\n font-size: var(--typography--fontSize-large);\n line-height: 1.34;\n line-height: var(--typography--lineHeight-large);\n}\n\n.V6yPPLHLeuY- {\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 line-height: 1.25;\n line-height: var(--typography--lineHeight-base);\n}\n\n.T5XC4DgJlxk- {\n font-size: calc((16px * 1) * 0.75);\n font-size: calc(calc(16px * 1) * 0.75);\n font-size: var(--typography--fontSize-small);\n line-height: 1.143;\n line-height: var(--typography--lineHeight-tighter);\n}\n\n.sycqXMMO-wc- {\n font-size: calc(\n (16px * 1) * 0.625\n );\n font-size: calc(\n calc(16px * 1) * 0.625\n );\n font-size: var(--typography--fontSize-smaller);\n line-height: 1.2;\n line-height: var(--typography--lineHeight-tight);\n}\n";
17
- var fontSizes = {"extravagant":"_7C4Ck1izBPs-","jumbo":"_8X-fSrUTxV8-","largest":"n-SPJXPXLSA-","larger":"vCrvF55YQ9o-","large":"FBoaHWotSik-","base":"V6yPPLHLeuY-","small":"T5XC4DgJlxk-","smaller":"sycqXMMO-wc-"};
18
- styleInject_es.styleInject(css_248z$7);
19
-
20
- var css_248z$6 = ".lziyWzzvuno- {\n font-family: \"Inter\", Helvetica, Arial, sans-serif;\n font-family: var(--typography--fontFamily-normal);\n font-weight: 400;\n}\n\n.PVKSijyipP8- {\n font-family: \"Inter\", Helvetica, Arial, sans-serif;\n font-family: var(--typography--fontFamily-normal);\n font-weight: 500;\n}\n\n.-ch9Z4gIGDg- {\n font-family: \"Inter\", Helvetica, Arial, sans-serif;\n font-family: var(--typography--fontFamily-normal);\n font-weight: 600;\n}\n\n.EEwS0f07RqQ- {\n font-family: \"Inter\", Helvetica, Arial, sans-serif;\n font-family: var(--typography--fontFamily-normal);\n font-weight: 700;\n}\n\n.kA3NtPPWbP0- {\n font-family: \"Jobber Pro\", \"Poppins\", Helvetica, Arial,\n sans-serif;\n font-family: var(--typography--fontFamily-display);\n font-weight: 800;\n}\n\n._3M58OLqp0JM- {\n font-family: \"Jobber Pro\", \"Poppins\", Helvetica, Arial,\n sans-serif;\n font-family: var(--typography--fontFamily-display);\n font-weight: 900;\n}\n";
21
- var fontWeights = {"regular":"lziyWzzvuno-","medium":"PVKSijyipP8-","semiBold":"-ch9Z4gIGDg-","bold":"EEwS0f07RqQ-","extraBold":"kA3NtPPWbP0-","black":"_3M58OLqp0JM-"};
22
- styleInject_es.styleInject(css_248z$6);
23
-
24
- var css_248z$5 = ".xE6cC62h5G0- {\n text-transform: uppercase;\n}\n\n.HlqJJ3Cl7dE- {\n text-transform: lowercase;\n}\n\n.Loe26JnDfco- {\n text-transform: capitalize;\n}\n";
25
- var textCases = {"uppercase":"xE6cC62h5G0-","lowercase":"HlqJJ3Cl7dE-","capitalize":"Loe26JnDfco-"};
26
- styleInject_es.styleInject(css_248z$5);
27
-
28
- var css_248z$4 = ".pkqoq2KXY9w- {\n color: rgb(1, 41, 57);\n color: var(--color-blue);\n}\n\n.ftVHRSii3ro- {\n color: rgb(181, 181, 181);\n color: var(--color-grey);\n}\n\n.FQbGABZWVzA- {\n color: rgb(66, 78, 86);\n color: var(--color-greyBlue--dark);\n}\n\n.zQaB9J0-vrs- {\n color: rgba(101, 120, 132, 1);\n color: var(--color-greyBlue);\n}\n\n._4-xdzcqT-Us- {\n color: rgb(125, 176, 14);\n color: var(--color-green);\n}\n\n.Zp9E7ELPjPA- {\n color: rgb(201, 66, 33);\n color: var(--color-red);\n}\n\n.v-Fo4PwPxDI- {\n color: rgb(221, 195, 15);\n color: var(--color-yellow);\n}\n\n.YrGUIChAZC0- {\n color: rgb(144, 127, 10);\n color: var(--color-yellow--dark);\n}\n\n.r7JcIVoDcTY- {\n color: rgb(60, 162, 224);\n color: var(--color-lightBlue);\n}\n\n._6RXTyd198iM- {\n color: rgba(255, 255, 255, 1);\n color: var(--color-white);\n}\n\n.fLix4jA-RkU- {\n color: rgb(1, 41, 57);\n color: var(--color-heading);\n}\n\n._1g0uMAwFAsk- {\n color: rgb(66, 78, 86);\n color: var(--color-text);\n}\n\n.oXqFAHwT6y4- {\n color: rgb(77, 105, 116);\n color: var(--color-text--secondary);\n}\n\n.rWkzi9HFNDU- {\n color: rgb(201, 66, 33);\n color: var(--color-critical);\n}\n\n.PQLYQKGCmPI- {\n color: rgb(144, 127, 10);\n color: var(--color-warning--onSurface);\n}\n\n.L6bBDJrx-m0- {\n color: rgb(39, 105, 146);\n color: var(--color-informative--onSurface);\n}\n\n.bJDJJKvmT90- {\n color: rgb(81, 114, 9);\n color: var(--color-success--onSurface);\n}\n\n._3g4iYm8XwkM- {\n color: rgb(181, 181, 181);\n color: var(--color-disabled);\n}\n";
29
- var textColors = {"blue":"pkqoq2KXY9w-","grey":"ftVHRSii3ro-","greyBlueDark":"FQbGABZWVzA-","greyBlue":"zQaB9J0-vrs-","green":"_4-xdzcqT-Us-","red":"Zp9E7ELPjPA-","yellow":"v-Fo4PwPxDI-","yellowDark":"YrGUIChAZC0-","lightBlue":"r7JcIVoDcTY-","white":"_6RXTyd198iM-","heading":"fLix4jA-RkU-","text":"_1g0uMAwFAsk-","textSecondary":"oXqFAHwT6y4-","critical":"rWkzi9HFNDU-","warning":"PQLYQKGCmPI-","informative":"L6bBDJrx-m0-","success":"bJDJJKvmT90-","disabled":"_3g4iYm8XwkM-"};
30
- styleInject_es.styleInject(css_248z$4);
31
-
32
- var css_248z$3 = ".Jys1uy2pQXw- {\n font-style: italic;\n}\n\n.kd2u0dL-if0- {\n display: inline;\n font-family: inherit;\n font-style: normal;\n font-weight: inherit;\n background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 84 8' fill='none' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.5 6.50004C14.6667 4.50004 49.3 0.900038 82.5 2.50004' stroke='%2384EA00' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E\");\n background-position: center bottom;\n background-repeat: no-repeat;\n background-size: 100% 20%;\n}\n";
33
- var emphasis = {"italic":"Jys1uy2pQXw-","highlight":"kd2u0dL-if0-"};
34
- styleInject_es.styleInject(css_248z$3);
35
-
36
- var css_248z$2 = ".LUJEfdi3pws- {\n display: -webkit-box !important;\n}\n.LUJEfdi3pws- {\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n";
37
- var truncate = {"textTruncate":"LUJEfdi3pws-"};
38
- styleInject_es.styleInject(css_248z$2);
39
-
40
- var css_248z$1 = ".eDMsbRCP0kg- {\n text-align: left;\n}\n\n.j34R9yIG--c- {\n text-align: center;\n}\n\n.CeI75T5sHwM- {\n text-align: right;\n}\n";
41
- var alignment = {"start":"eDMsbRCP0kg-","center":"j34R9yIG--c-","end":"CeI75T5sHwM-"};
42
- styleInject_es.styleInject(css_248z$1);
43
-
44
- var css_248z = ".mRpfVoMiIMM- {\n font-family: \"Inter\", Helvetica, Arial, sans-serif;\n font-family: var(--typography--fontFamily-normal);\n}\n\n.TPtuWMdOsfw- {\n font-family: \"Jobber Pro\", \"Poppins\", Helvetica, Arial,\n sans-serif;\n font-family: var(--typography--fontFamily-display);\n}\n";
45
- var fontFamilies = {"base":"mRpfVoMiIMM-","display":"TPtuWMdOsfw-"};
46
- styleInject_es.styleInject(css_248z);
47
-
48
- /* eslint-disable import/no-internal-modules */
49
- function Typography({ id, children, element: Tag = "p", size, align, fontWeight = "regular", textCase, textColor, emphasisType, numberOfLines, fontFamily, }) {
50
- const shouldTruncateText = numberOfLines && numberOfLines > 0;
51
- const className = classnames__default["default"](styles.base, fontWeights[fontWeight], size && fontSizes[size], textCase && textCases[textCase], textColor && textColors[textColor], emphasisType && emphasis[emphasisType], fontFamily && fontFamilies[fontFamily], shouldTruncateText && truncate.textTruncate, Object.assign({}, (align && { [alignment[align]]: align !== `start` })));
52
- let truncateLines;
53
- if (shouldTruncateText) {
54
- truncateLines = {
55
- WebkitLineClamp: numberOfLines,
56
- WebkitBoxOrient: "vertical",
57
- };
58
- }
59
- return (React__default["default"].createElement(Tag, { id: id, className: className, style: truncateLines }, children));
60
- }
61
-
62
- exports.Typography = Typography;