@jobber/components 4.60.12 → 4.60.14
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/Chip/index.js +1 -1
- package/dist/{Chip-ac7749ea.js → Chip-a1bdcab2.js} +1 -1
- package/dist/Combobox/Combobox.types.d.ts +0 -8
- package/dist/Combobox/index.js +2 -2
- package/dist/{Combobox-89367468.js → Combobox-c6ec6d59.js} +2 -2
- package/dist/DataList/index.js +2 -2
- package/package.json +3 -3
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-a1bdcab2.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');
|
|
@@ -14,7 +14,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
14
14
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
15
15
|
var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
|
|
16
16
|
|
|
17
|
-
var css_248z = ":root {\n --chip--gradient-color-variation: var(--chip-base-bg);\n --chip--gradient-color-variation--hover: var(--chip-base--hover);\n}\n\n.af7U8MvcbHE- {\n --chip-height: 40px;\n --chip-radius: 20px;\n --chip-disabled--bg: var(--color-grey--lighter);\n --chip-bar-color: var(--color-greyBlue--light);\n --chip-base-bg: var(--color-greyBlue--lightest);\n --chip-base--hover: var(--color-greyBlue--lighter);\n display: -ms-flexbox;\n display: flex;\n position: relative;\n height: 40px;\n height: var(--chip-height);\n min-width: 0;\n padding: calc(16px / 2) 16px;\n padding: var(--space-small) var(--base-unit);\n border: calc(16px / 16) solid transparent;\n border: var(--border-base) solid transparent;\n border-radius: 20px;\n border-radius: var(--chip-radius);\n color: rgb(1, 41, 57);\n color: var(--color-heading);\n text-align: left;\n cursor: pointer;\n transition: all
|
|
17
|
+
var css_248z = ":root {\n --chip--gradient-color-variation: var(--chip-base-bg);\n --chip--gradient-color-variation--hover: var(--chip-base--hover);\n}\n\n.af7U8MvcbHE- {\n --chip-height: 40px;\n --chip-radius: 20px;\n --chip-disabled--bg: var(--color-grey--lighter);\n --chip-bar-color: var(--color-greyBlue--light);\n --chip-base-bg: var(--color-greyBlue--lightest);\n --chip-base--hover: var(--color-greyBlue--lighter);\n display: -ms-flexbox;\n display: flex;\n position: relative;\n height: 40px;\n height: var(--chip-height);\n min-width: 0;\n padding: calc(16px / 2) 16px;\n padding: var(--space-small) var(--base-unit);\n border: calc(16px / 16) solid transparent;\n border: var(--border-base) solid transparent;\n border-radius: 20px;\n border-radius: var(--chip-radius);\n color: rgb(1, 41, 57);\n color: var(--color-heading);\n text-align: left;\n cursor: pointer;\n transition: all 200ms;\n transition: all var(--timing-base);\n -ms-flex-align: center;\n align-items: center;\n}\n\n.af7U8MvcbHE-:focus,\n.af7U8MvcbHE-:focus-visible {\n outline: none;\n}\n\n.af7U8MvcbHE-:focus-visible {\n box-shadow: 0px 0px calc(16px / 4) calc(16px / 8)\n rgb(231, 213, 87);\n box-shadow: var(--shadow-focus);\n}\n\n.af7U8MvcbHE- .e905AYK4SCc- {\n margin-left: calc(-1 * (16px / 2));\n margin-left: calc(-1 * calc(16px / 2));\n margin-left: calc(-1 * var(--space-small));\n margin-right: calc(16px / 2);\n margin-right: var(--space-small);\n}\n\n.af7U8MvcbHE- .ySADfZ0FckM- {\n margin-left: calc(16px / 2);\n margin-left: var(--space-small);\n margin-right: calc(-1 * (16px / 2));\n margin-right: calc(-1 * calc(16px / 2));\n margin-right: calc(-1 * var(--space-small));\n}\n\n.af7U8MvcbHE- .e905AYK4SCc-,\n.af7U8MvcbHE- .ySADfZ0FckM- {\n display: -ms-flexbox;\n display: flex;\n width: calc(16px * 1.5);\n width: var(--space-large);\n height: calc(16px * 1.5);\n height: var(--space-large);\n -ms-flex-negative: 0;\n flex-shrink: 0;\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 -ms-flex-align: center;\n align-items: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n\n.af7U8MvcbHE- .e905AYK4SCc-.usdkmQ9Sxbk-,\n.af7U8MvcbHE- .ySADfZ0FckM-.usdkmQ9Sxbk- {\n display: none;\n}\n\n.af7U8MvcbHE- .dg1-Izy1eQA- {\n width: calc(16px / 16);\n width: var(--space-minuscule);\n height: 16px;\n height: var(--base-unit);\n margin: 0 calc(16px / 2);\n margin: 0 var(--space-small);\n background-color: var(--chip-bar-color);\n}\n\n.af7U8MvcbHE- .-lz0EYLTDgg- {\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.wSI5L-5rODg- {\n border: calc(16px / 16) solid transparent;\n border: var(--border-base) solid transparent;\n color: rgb(1, 41, 57);\n color: var(--color-heading);\n background-color: var(--chip-base-bg);\n --chip--gradient-color-variation: var(--chip-base-bg);\n}\n\n.wSI5L-5rODg-:hover,\n.wSI5L-5rODg-:focus-visible {\n background-color: var(--chip-base--hover);\n --chip--gradient-color-variation--hover: var(--chip-base--hover);\n}\n\n.SmUxkzpIC84-,\n.SmUxkzpIC84-:hover,\n.SmUxkzpIC84-:focus-visible,\n.Mux23dmZSuw-.SmUxkzpIC84-,\n.Mux23dmZSuw-.SmUxkzpIC84-:hover,\n.Mux23dmZSuw-.SmUxkzpIC84-:focus-visible {\n border: calc(16px / 16) solid rgb(201, 66, 33);\n border: var(--border-base) solid var(--color-critical);\n background-color: rgb(255, 226, 219);\n background-color: var(--color-critical--surface);\n --chip--gradient-color-variation: var(--color-critical--surface);\n --chip--gradient-color-variation--hover: var(--color-critical--surface);\n}\n\n.Mux23dmZSuw- {\n border: calc(16px / 16) solid rgb(225, 225, 225);\n border: var(--border-base) solid var(--color-disabled--secondary);\n background-color: rgba(255, 255, 255, 1);\n background-color: var(--color-surface);\n --chip--gradient-color-variation: var(--color-surface);\n}\n\n/* CAUTION: Order is important here since\n* there is are different styles for subtle:focus and subtle:hover\n* and we want hover to take priority\n*/\n\n.Mux23dmZSuw-:focus-visible {\n --chip--gradient-color-variation--hover: var(--color-surface);\n}\n\n.Mux23dmZSuw-:hover {\n border: calc(16px / 16) solid var(--chip-base-bg);\n border: var(--border-base) solid var(--chip-base-bg);\n background-color: var(--chip-base-bg);\n --chip--gradient-color-variation--hover: var(--chip-base-bg);\n}\n\n.MbRItb9vKhc-,\n.MbRItb9vKhc-:hover,\n.MbRItb9vKhc-:focus-visible {\n border: calc(16px / 16) solid var(--chip-disabled--bg);\n border: var(--border-base) solid var(--chip-disabled--bg);\n color: rgb(181, 181, 181);\n color: var(--color-disabled);\n background-color: var(--chip-disabled--bg);\n cursor: auto;\n --chip--gradient-color-variation: var(--chip-disabled--bg);\n --chip--gradient-color-variation--hover: var(--chip-disabled--bg);\n}\n\n.MbRItb9vKhc- .dg1-Izy1eQA- {\n background-color: rgb(181, 181, 181);\n background-color: var(--color-disabled);\n}\n\n.af7U8MvcbHE-.MbRItb9vKhc- .ySADfZ0FckM- {\n background-color: rgb(181, 181, 181);\n background-color: var(--color-disabled);\n}\n\n.tJhURjR2Vec- {\n display: -ms-flexbox;\n display: flex;\n position: relative;\n overflow: hidden;\n -ms-flex-wrap: nowrap;\n flex-wrap: nowrap;\n}\n\n.tJhURjR2Vec- > * {\n -ms-flex: 0 0 auto;\n flex: 0 0 auto;\n}\n\n.tJhURjR2Vec- > p {\n overflow: hidden;\n white-space: nowrap;\n}\n\n.G3QXY0rNcK0- {\n position: absolute;\n top: 0;\n right: 0;\n width: calc(16px * 1);\n width: var(--space-base);\n height: 100%;\n background: linear-gradient(\n to left,\n var(--chip-base-bg) 5%,\n rgba(255, 255, 255, 0)\n );\n background: linear-gradient(\n to left,\n var(--chip--gradient-color-variation) 5%,\n rgba(255, 255, 255, 0)\n );\n}\n\n.af7U8MvcbHE-:focus-visible .G3QXY0rNcK0-,\n.af7U8MvcbHE-:hover .G3QXY0rNcK0- {\n background: linear-gradient(\n to left,\n var(--chip-base--hover) 5%,\n rgba(255, 255, 255, 0)\n );\n background: linear-gradient(\n to left,\n var(--chip--gradient-color-variation--hover) 5%,\n rgba(255, 255, 255, 0)\n );\n}\n\n.MUKEW6c2nNA- {\n display: inline-block;\n width: 1px;\n}\n";
|
|
18
18
|
var styles = {"chip":"af7U8MvcbHE-","prefix":"e905AYK4SCc-","suffix":"ySADfZ0FckM-","empty":"usdkmQ9Sxbk-","chipBar":"dg1-Izy1eQA-","selected":"-lz0EYLTDgg-","base":"wSI5L-5rODg-","invalid":"SmUxkzpIC84-","subtle":"Mux23dmZSuw-","disabled":"MbRItb9vKhc-","chipContent":"tJhURjR2Vec-","truncateGradient":"G3QXY0rNcK0-","chipLabelRef":"MUKEW6c2nNA-"};
|
|
19
19
|
styleInject_es.styleInject(css_248z);
|
|
20
20
|
|
|
@@ -9,10 +9,6 @@ export interface ComboboxProps {
|
|
|
9
9
|
* @default false
|
|
10
10
|
*/
|
|
11
11
|
readonly multiSelect?: boolean;
|
|
12
|
-
/**
|
|
13
|
-
* Placeholder text to display in the search input. Defaults to "Search".
|
|
14
|
-
*/
|
|
15
|
-
readonly searchPlaceholder?: string;
|
|
16
12
|
/**
|
|
17
13
|
* The selected options of the Combobox.
|
|
18
14
|
*/
|
|
@@ -52,10 +48,6 @@ export interface ComboboxOption {
|
|
|
52
48
|
label: string;
|
|
53
49
|
}
|
|
54
50
|
export interface ComboboxContentProps {
|
|
55
|
-
/**
|
|
56
|
-
* Placeholder text to display in the search input. Defaults to "Search".
|
|
57
|
-
*/
|
|
58
|
-
readonly searchPlaceholder?: string;
|
|
59
51
|
/**
|
|
60
52
|
* The selected options of the Combobox.
|
|
61
53
|
*/
|
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-c6ec6d59.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('classnames');
|
|
8
8
|
require('react-dom');
|
|
@@ -17,7 +17,7 @@ require('@jobber/hooks/useRefocusOnActivator');
|
|
|
17
17
|
require('@jobber/hooks/useFocusTrap');
|
|
18
18
|
require('react-popper');
|
|
19
19
|
require('@jobber/hooks/useOnKeyDown');
|
|
20
|
-
require('../Chip-
|
|
20
|
+
require('../Chip-a1bdcab2.js');
|
|
21
21
|
require('@jobber/hooks/useInView');
|
|
22
22
|
require('../Avatar-1aa30ee1.js');
|
|
23
23
|
require('color');
|
|
@@ -12,7 +12,7 @@ var useRefocusOnActivator = require('@jobber/hooks/useRefocusOnActivator');
|
|
|
12
12
|
var useFocusTrap = require('@jobber/hooks/useFocusTrap');
|
|
13
13
|
var reactPopper = require('react-popper');
|
|
14
14
|
var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
|
|
15
|
-
var Chip = require('./Chip-
|
|
15
|
+
var Chip = require('./Chip-a1bdcab2.js');
|
|
16
16
|
require('@jobber/design');
|
|
17
17
|
var useAssert = require('@jobber/hooks/useAssert');
|
|
18
18
|
|
|
@@ -393,7 +393,7 @@ function Combobox(props) {
|
|
|
393
393
|
React__default["default"].createElement("div", { ref: wrapperRef, className: styles.wrapper },
|
|
394
394
|
open && (React__default["default"].createElement("div", { className: styles.overlay, onClick: () => handleClose(), "data-testid": "ATL-Combobox-Overlay" })),
|
|
395
395
|
triggerElement || (React__default["default"].createElement(ComboboxTrigger, { label: props.label, selected: props.selected })),
|
|
396
|
-
React__default["default"].createElement(ComboboxContent, { multiselect: props.multiSelect,
|
|
396
|
+
React__default["default"].createElement(ComboboxContent, { multiselect: props.multiSelect, subjectNoun: props.subjectNoun, selected: selectedOptions, actionElements: actionElements, selectedStateSetter: selectedStateSetter, handleSelection: handleSelection, searchValue: searchValue, setSearchValue: setSearchValue, wrapperRef: wrapperRef, open: open, setOpen: setOpen, options: options }))));
|
|
397
397
|
}
|
|
398
398
|
Combobox.Activator = ComboboxActivator;
|
|
399
399
|
Combobox.Action = ComboboxAction;
|
package/dist/DataList/index.js
CHANGED
|
@@ -25,8 +25,8 @@ var ReactDOM = require('react-dom');
|
|
|
25
25
|
var Checkbox = require('../Checkbox-bc4bc968.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-c6ec6d59.js');
|
|
29
|
+
var Chip = require('../Chip-a1bdcab2.js');
|
|
30
30
|
var Icon = require('../Icon-405a216c.js');
|
|
31
31
|
var debounce = require('lodash/debounce');
|
|
32
32
|
var InputText = require('../InputText-ab237501.js');
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jobber/components",
|
|
3
|
-
"version": "4.60.
|
|
3
|
+
"version": "4.60.14",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
"dist/*"
|
|
20
20
|
],
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@jobber/design": "^0.47.
|
|
22
|
+
"@jobber/design": "^0.47.2",
|
|
23
23
|
"@jobber/formatters": "*",
|
|
24
24
|
"@jobber/hooks": "^2.7.2",
|
|
25
25
|
"@popperjs/core": "^2.0.6",
|
|
@@ -83,5 +83,5 @@
|
|
|
83
83
|
"> 1%",
|
|
84
84
|
"IE 10"
|
|
85
85
|
],
|
|
86
|
-
"gitHead": "
|
|
86
|
+
"gitHead": "3426284f93f6e6447681a4da8c79abff3c8e6d8c"
|
|
87
87
|
}
|