@jobber/components 4.4.9-pre.0 → 4.4.9-taylor-pre.51
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/ForcedChange.d.ts +1 -0
- package/ForcedChange.js +17 -0
- package/dist/Autocomplete/index.js +9 -9
- package/dist/Avatar/index.js +1 -1
- package/dist/{Avatar-98b59e17.js → Avatar-1aa30ee1.js} +1 -1
- package/dist/Banner/index.js +5 -5
- package/dist/Button/index.js +2 -2
- package/dist/Button-69409e46.js +57 -0
- package/dist/ButtonDismiss/index.js +3 -3
- package/dist/{ButtonDismiss-64740d0a.js → ButtonDismiss-7d9deeab.js} +1 -1
- package/dist/Card/index.js +5 -5
- package/dist/{Card-bf3d96e0.js → Card-459a48b7.js} +4 -4
- package/dist/Checkbox/index.js +3 -3
- package/dist/{Checkbox-ff77e7ef.js → Checkbox-36f63689.js} +2 -2
- package/dist/Chips/index.js +8 -8
- package/dist/ConfirmationModal/index.js +10 -10
- package/dist/{ConfirmationModal-3b5b2d06.js → ConfirmationModal-3f9a3524.js} +3 -3
- package/dist/Content/index.js +1 -1
- package/dist/{Content-db546523.js → Content-a6590328.js} +1 -1
- package/dist/DataDump/index.js +7 -7
- package/dist/DataTable/index.js +11 -11
- package/dist/DatePicker/index.js +3 -3
- package/dist/{DatePicker-90fd1823.js → DatePicker-b704c15b.js} +3 -3
- package/dist/DescriptionList/index.js +2 -2
- package/dist/Disclosure/index.js +2 -2
- package/dist/Divider/index.js +1 -1
- package/dist/Drawer/index.js +5 -5
- package/dist/Emphasis/index.js +2 -2
- package/dist/{Emphasis-1d1a2601.js → Emphasis-76a10790.js} +1 -1
- package/dist/FeatureSwitch/index.js +9 -9
- package/dist/ForcedChange/index.d.ts +1 -0
- package/dist/ForcedChange/index.js +7 -0
- package/dist/FormField/index.js +6 -6
- package/dist/{FormField-bdfb7a5a.js → FormField-03e36a98.js} +9 -8
- package/dist/FormatFile/InternalThumbnailImage.d.ts +7 -0
- package/dist/FormatFile/index.js +12 -12
- package/dist/FormatFile-38731cfb.js +120 -0
- package/dist/Gallery/index.js +14 -14
- package/dist/Heading/index.js +2 -2
- package/dist/{Heading-4dc407a9.js → Heading-a1191b15.js} +1 -1
- package/dist/InlineLabel/index.js +2 -2
- package/dist/InputAvatar/index.js +7 -7
- package/dist/InputDate/index.js +13 -8
- package/dist/InputEmail/index.js +6 -6
- package/dist/InputFile/index.js +4 -4
- package/dist/{InputFile-33d7d2fb.js → InputFile-a7c0fbbc.js} +4 -4
- package/dist/InputNumber/index.js +6 -6
- package/dist/InputPassword/index.js +6 -6
- package/dist/InputText/index.js +7 -7
- package/dist/{InputText-c056703c.js → InputText-0a76a9f9.js} +1 -1
- package/dist/InputTime/index.js +6 -6
- package/dist/InputValidation/index.js +3 -3
- package/dist/{InputValidation-1b86b467.js → InputValidation-bf743417.js} +2 -2
- package/dist/LightBox/index.js +4 -4
- package/dist/{LightBox-3753b459.js → LightBox-c637c684.js} +3 -3
- package/dist/List/index.js +9 -9
- package/dist/Markdown/index.js +6 -6
- package/dist/{Markdown-c6caca6d.js → Markdown-53a0bfda.js} +4 -4
- package/dist/Menu/index.js +3 -3
- package/dist/{Menu-e6f88c8e.js → Menu-aa9c73d2.js} +3 -3
- package/dist/Modal/index.js +5 -5
- package/dist/{Modal-e493144d.js → Modal-c5f9040f.js} +5 -5
- package/dist/MultiSelect/index.js +5 -5
- package/dist/{Option-73a5502d.js → Option-1447547b.js} +1 -1
- package/dist/Page/index.js +9 -9
- package/dist/Popover/index.js +4 -4
- package/dist/ProgressBar/index.js +1 -1
- package/dist/ProgressBar-5dfc1885.js +28 -0
- package/dist/RadioGroup/index.js +3 -3
- package/dist/Select/index.js +7 -7
- package/dist/Spinner/index.js +1 -1
- package/dist/Spinner-9d8fc7ff.js +24 -0
- package/dist/StatusLabel/index.js +3 -3
- package/dist/Switch/index.js +2 -2
- package/dist/Switch-e75145cc.js +56 -0
- package/dist/Table/index.js +1 -1
- package/dist/Tabs/index.js +2 -2
- package/dist/Text/index.js +2 -2
- package/dist/{Text-668ba4fe.js → Text-e7ed0974.js} +1 -1
- package/dist/Toast/index.js +3 -3
- package/dist/Tooltip/index.js +3 -3
- package/dist/{Tooltip-dba62da5.js → Tooltip-bf67fe6e.js} +2 -2
- package/dist/Typography/index.js +1 -1
- package/dist/Typography-fd6f932a.js +62 -0
- package/package.json +7 -6
- package/rollup.config.js +6 -4
- package/dist/Button-e2452625.js +0 -57
- package/dist/FormatFile-41867ef2.js +0 -111
- package/dist/ProgressBar-8438dd4c.js +0 -28
- package/dist/Spinner-3480bc34.js +0 -24
- package/dist/Switch-4fab8779.js +0 -56
- package/dist/Typography-1aeeb56e.js +0 -62
package/dist/Switch-4fab8779.js
DELETED
|
@@ -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-1aeeb56e.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 var(--timing-base);\n}\n\n.NaSI2jsLI0c- {\n display: -ms-inline-flexbox;\n display: inline-flex;\n width: calc(calc(calc(var(--space-base) * 1.875) * 1.3) + calc(var(--space-base) * 1.875));\n width: calc(var(--switch--labelWidth) + var(--switch--pipSize));\n padding: 0;\n border: var(--border-base) solid var(--color-border);\n border-radius: calc(var(--space-base) * 1.875);\n border-radius: var(--switch--pipSize);\n overflow: hidden;\n line-height: normal;\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: var(--shadow-focus);\n outline: none;\n}\n\n.HbAoDMJhkwY- {\n border-color: var(--color-interactive);\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 * calc(calc(var(--space-base) * 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 * calc(var(--border-base) * 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(calc(var(--space-base) * 1.875) * 1.3);\n min-width: var(--switch--labelWidth);\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: var(--space-small);\n}\n\n.YZ-HIehHOBA-:last-of-type {\n padding-right: var(--space-small);\n}\n\n._2hxova2FHpM- {\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n width: calc(var(--space-base) * 1.875);\n width: var(--switch--pipSize);\n height: calc(var(--space-base) * 1.875);\n height: var(--switch--pipSize);\n border: var(--border-base) solid var(--color-border);\n border-radius: var(--radius-circle);\n background-color: var(--color-surface);\n}\n\n.HbAoDMJhkwY- ._2hxova2FHpM- {\n border-color: var(--color-green);\n}\n\n._6hWvJHjyLlk- {\n border-color: var(--color-disabled--secondary);\n background-color: var(--color-surface--background);\n cursor: not-allowed;\n}\n\n._6hWvJHjyLlk- ._2hxova2FHpM- {\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: var(--typography--fontFamily-normal);\n /* Wrap really long words or URL's */\n word-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: var(--typography--fontSize-extravagant);\n line-height: var(--typography--lineHeight-miniscule);\n}\n\n._8X-fSrUTxV8- {\n font-size: var(--typography--fontSize-jumbo);\n line-height: var(--typography--lineHeight-miniscule);\n}\n\n.n-SPJXPXLSA- {\n font-size: var(--typography--fontSize-largest);\n line-height: var(--typography--lineHeight-tightest);\n}\n\n.vCrvF55YQ9o- {\n font-size: var(--typography--fontSize-larger);\n line-height: var(--typography--lineHeight-tight);\n}\n\n.FBoaHWotSik- {\n font-size: var(--typography--fontSize-large);\n line-height: var(--typography--lineHeight-large);\n}\n\n.V6yPPLHLeuY- {\n font-size: var(--typography--fontSize-base);\n line-height: var(--typography--lineHeight-base);\n}\n\n.T5XC4DgJlxk- {\n font-size: var(--typography--fontSize-small);\n line-height: var(--typography--lineHeight-tighter);\n}\n\n.sycqXMMO-wc- {\n font-size: var(--typography--fontSize-smaller);\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: var(--typography--fontFamily-normal);\n font-weight: 400;\n}\n\n.EEwS0f07RqQ- {\n font-family: var(--typography--fontFamily-normal);\n font-weight: 700;\n}\n\n.kA3NtPPWbP0- {\n font-family: var(--typography--fontFamily-display);\n font-weight: 800;\n}\n\n._3M58OLqp0JM- {\n font-family: var(--typography--fontFamily-display);\n font-weight: 900;\n}\n";
|
|
21
|
-
var fontWeights = {"regular":"lziyWzzvuno-","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: var(--color-blue);\n}\n\n.ftVHRSii3ro- {\n color: var(--color-grey);\n}\n\n.FQbGABZWVzA- {\n color: var(--color-greyBlue--dark);\n}\n\n.zQaB9J0-vrs- {\n color: var(--color-greyBlue);\n}\n\n._4-xdzcqT-Us- {\n color: var(--color-green);\n}\n\n.Zp9E7ELPjPA- {\n color: var(--color-red);\n}\n\n.v-Fo4PwPxDI- {\n color: var(--color-yellow);\n}\n\n.YrGUIChAZC0- {\n color: var(--color-yellow--dark);\n}\n\n.r7JcIVoDcTY- {\n color: var(--color-lightBlue);\n}\n\n._6RXTyd198iM- {\n color: var(--color-white);\n}\n\n.fLix4jA-RkU- {\n color: var(--color-heading);\n}\n\n._1g0uMAwFAsk- {\n color: var(--color-text);\n}\n\n.oXqFAHwT6y4- {\n color: var(--color-text--secondary);\n}\n\n.rWkzi9HFNDU- {\n color: var(--color-critical);\n}\n\n.PQLYQKGCmPI- {\n color: var(--color-warning--onSurface);\n}\n\n.L6bBDJrx-m0- {\n color: var(--color-informative--onSurface);\n}\n\n.bJDJJKvmT90- {\n color: var(--color-success--onSurface);\n}\n\n._3g4iYm8XwkM- {\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 -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 = "[dir=\"ltr\"] .eDMsbRCP0kg- {\n text-align: left;\n}\n\n.eDMsbRCP0kg-:dir(ltr) {\n text-align: left;\n}\n\n[dir=\"rtl\"] .eDMsbRCP0kg- {\n text-align: right;\n}\n\n.eDMsbRCP0kg-:dir(rtl) {\n text-align: right;\n}\n\n.eDMsbRCP0kg- {\n text-align: start;\n}\n\n.j34R9yIG--c- {\n text-align: center;\n}\n\n[dir=\"ltr\"] .CeI75T5sHwM- {\n text-align: right;\n}\n\n.CeI75T5sHwM-:dir(ltr) {\n text-align: right;\n}\n\n[dir=\"rtl\"] .CeI75T5sHwM- {\n text-align: left;\n}\n\n.CeI75T5sHwM-:dir(rtl) {\n text-align: left;\n}\n\n.CeI75T5sHwM- {\n text-align: end;\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: var(--typography--fontFamily-normal);\n}\n\n.TPtuWMdOsfw- {\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;
|