@jobber/components 4.88.0 → 4.90.0
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/AtlantisContext.d.ts +1 -0
- package/AtlantisContext.js +17 -0
- package/dist/AtlantisContext/AtlantisContext.d.ts +34 -0
- package/dist/AtlantisContext/index.d.ts +1 -0
- package/dist/AtlantisContext/index.js +12 -0
- package/dist/AtlantisContext-64608897.js +22 -0
- package/dist/Autocomplete/index.js +1 -1
- package/dist/Card/index.js +2 -2
- package/dist/{Card-74f078a4.js → Card-01d6ba19.js} +1 -1
- package/dist/ConfirmationModal/index.js +4 -4
- package/dist/{ConfirmationModal-387aa1b5.js → ConfirmationModal-b44e302f.js} +2 -2
- package/dist/DataDump/index.js +2 -2
- package/dist/DataList/index.js +1 -1
- package/dist/DatePicker/index.js +2 -1
- package/dist/{DatePicker-dd9173c7.js → DatePicker-305a5b82.js} +11 -1
- package/dist/Drawer/index.js +1 -1
- package/dist/FeatureSwitch/index.js +2 -2
- package/dist/FormatFile/index.js +5 -5
- package/dist/{FormatFile-5ba4cf69.js → FormatFile-32228107.js} +1 -1
- package/dist/Gallery/index.js +5 -5
- package/dist/Heading/Heading.d.ts +5 -1
- package/dist/Heading/index.js +1 -1
- package/dist/{Heading-bae3c69e.js → Heading-23d382a1.js} +2 -2
- package/dist/InputDate/InputDate.d.ts +9 -0
- package/dist/InputDate/index.js +21 -6
- package/dist/List/index.js +2 -2
- package/dist/Markdown/index.js +2 -2
- package/dist/{Markdown-b1b65457.js → Markdown-0f24de70.js} +1 -1
- package/dist/Modal/index.js +2 -2
- package/dist/{Modal-5b866c72.js → Modal-067becad.js} +1 -1
- package/dist/Page/index.js +2 -2
- package/package.json +4 -2
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./dist/AtlantisContext";
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true,
|
|
5
|
+
});
|
|
6
|
+
|
|
7
|
+
var AtlantisContext = require("./dist/AtlantisContext");
|
|
8
|
+
|
|
9
|
+
Object.keys(AtlantisContext).forEach(function(key) {
|
|
10
|
+
if (key === "default" || key === "__esModule") return;
|
|
11
|
+
Object.defineProperty(exports, key, {
|
|
12
|
+
enumerable: true,
|
|
13
|
+
get: function get() {
|
|
14
|
+
return AtlantisContext[key];
|
|
15
|
+
},
|
|
16
|
+
});
|
|
17
|
+
});
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export interface AtlantisContextProps {
|
|
3
|
+
/**
|
|
4
|
+
* The date format Atlantis components would use
|
|
5
|
+
*/
|
|
6
|
+
readonly dateFormat: string;
|
|
7
|
+
/**
|
|
8
|
+
* The time format Atlantis components would use
|
|
9
|
+
*/
|
|
10
|
+
readonly timeFormat: string;
|
|
11
|
+
/**
|
|
12
|
+
* Time zone used in converting the date and time formats
|
|
13
|
+
*/
|
|
14
|
+
readonly timeZone: string;
|
|
15
|
+
/**
|
|
16
|
+
* Grabs the decimal separator and group separator based on locale
|
|
17
|
+
*/
|
|
18
|
+
readonly floatSeparators: Record<"decimal" | "group", string>;
|
|
19
|
+
/**
|
|
20
|
+
* The currency symbol Atlantis components will use
|
|
21
|
+
*/
|
|
22
|
+
readonly currencySymbol: string;
|
|
23
|
+
/**
|
|
24
|
+
* Change the locale of the components. This updates the strings that comes
|
|
25
|
+
* with the components, updates the date and time formats, and/or the
|
|
26
|
+
* native 3rd-party packages.
|
|
27
|
+
*
|
|
28
|
+
* @default "en"
|
|
29
|
+
*/
|
|
30
|
+
readonly locale: string;
|
|
31
|
+
}
|
|
32
|
+
export declare const atlantisContextDefaultValues: AtlantisContextProps;
|
|
33
|
+
export declare const AtlantisContext: import("react").Context<AtlantisContextProps>;
|
|
34
|
+
export declare function useAtlantisContext(): AtlantisContextProps;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./AtlantisContext";
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var AtlantisContext = require('../AtlantisContext-64608897.js');
|
|
6
|
+
require('react');
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
exports.AtlantisContext = AtlantisContext.AtlantisContext;
|
|
11
|
+
exports.atlantisContextDefaultValues = AtlantisContext.atlantisContextDefaultValues;
|
|
12
|
+
exports.useAtlantisContext = AtlantisContext.useAtlantisContext;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
|
|
5
|
+
/* eslint-disable @typescript-eslint/no-unused-vars */
|
|
6
|
+
const atlantisContextDefaultValues = {
|
|
7
|
+
dateFormat: "P",
|
|
8
|
+
// The system time is "p"
|
|
9
|
+
timeFormat: "p",
|
|
10
|
+
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
|
|
11
|
+
floatSeparators: { group: ",", decimal: "." },
|
|
12
|
+
currencySymbol: "$",
|
|
13
|
+
locale: "en",
|
|
14
|
+
};
|
|
15
|
+
const AtlantisContext = React.createContext(atlantisContextDefaultValues);
|
|
16
|
+
function useAtlantisContext() {
|
|
17
|
+
return React.useContext(AtlantisContext);
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
exports.AtlantisContext = AtlantisContext;
|
|
21
|
+
exports.atlantisContextDefaultValues = atlantisContextDefaultValues;
|
|
22
|
+
exports.useAtlantisContext = useAtlantisContext;
|
|
@@ -14,7 +14,7 @@ var useSafeLayoutEffect = require('@jobber/hooks/useSafeLayoutEffect');
|
|
|
14
14
|
var useIsMounted = require('@jobber/hooks/useIsMounted');
|
|
15
15
|
var Text = require('../Text-fbeaaca6.js');
|
|
16
16
|
var Icon = require('../Icon-405a216c.js');
|
|
17
|
-
var Heading = require('../Heading-
|
|
17
|
+
var Heading = require('../Heading-23d382a1.js');
|
|
18
18
|
var InputText = require('../InputText-130b0440.js');
|
|
19
19
|
require('../Typography-e2a23b7e.js');
|
|
20
20
|
require('@jobber/design');
|
package/dist/Card/index.js
CHANGED
|
@@ -2,11 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var Card = require('../Card-
|
|
5
|
+
var Card = require('../Card-01d6ba19.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('classnames');
|
|
8
8
|
require('../style-inject.es-9d2f5f4e.js');
|
|
9
|
-
require('../Heading-
|
|
9
|
+
require('../Heading-23d382a1.js');
|
|
10
10
|
require('../Typography-e2a23b7e.js');
|
|
11
11
|
require('../useAtlantisConfig-ed0bee66.js');
|
|
12
12
|
require('@jobber/hooks/useSafeLayoutEffect');
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
var classnames = require('classnames');
|
|
5
5
|
var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
|
|
6
|
-
var Heading = require('./Heading-
|
|
6
|
+
var Heading = require('./Heading-23d382a1.js');
|
|
7
7
|
var Button = require('./Button-6b922fc1.js');
|
|
8
8
|
var Menu = require('./Menu-d6dd673e.js');
|
|
9
9
|
|
|
@@ -2,17 +2,17 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var ConfirmationModal = require('../ConfirmationModal-
|
|
5
|
+
var ConfirmationModal = require('../ConfirmationModal-b44e302f.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('@jobber/hooks/useOnKeyDown');
|
|
8
|
-
require('../Modal-
|
|
8
|
+
require('../Modal-067becad.js');
|
|
9
9
|
require('react-dom');
|
|
10
10
|
require('classnames');
|
|
11
11
|
require('framer-motion');
|
|
12
12
|
require('@jobber/hooks/useRefocusOnActivator');
|
|
13
13
|
require('@jobber/hooks/useFocusTrap');
|
|
14
14
|
require('../style-inject.es-9d2f5f4e.js');
|
|
15
|
-
require('../Heading-
|
|
15
|
+
require('../Heading-23d382a1.js');
|
|
16
16
|
require('../Typography-e2a23b7e.js');
|
|
17
17
|
require('../useAtlantisConfig-ed0bee66.js');
|
|
18
18
|
require('@jobber/hooks/useSafeLayoutEffect');
|
|
@@ -22,7 +22,7 @@ require('../Icon-405a216c.js');
|
|
|
22
22
|
require('@jobber/design');
|
|
23
23
|
require('../ButtonDismiss-a3ba1de2.js');
|
|
24
24
|
require('../Content-e3f7b6fc.js');
|
|
25
|
-
require('../Markdown-
|
|
25
|
+
require('../Markdown-0f24de70.js');
|
|
26
26
|
require('react-markdown');
|
|
27
27
|
require('../Text-fbeaaca6.js');
|
|
28
28
|
require('../Emphasis-a77d8ee9.js');
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
|
|
5
|
-
var Modal = require('./Modal-
|
|
5
|
+
var Modal = require('./Modal-067becad.js');
|
|
6
6
|
var Content = require('./Content-e3f7b6fc.js');
|
|
7
|
-
var Markdown = require('./Markdown-
|
|
7
|
+
var Markdown = require('./Markdown-0f24de70.js');
|
|
8
8
|
|
|
9
9
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
10
10
|
|
package/dist/DataDump/index.js
CHANGED
|
@@ -3,12 +3,12 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
-
var Card = require('../Card-
|
|
6
|
+
var Card = require('../Card-01d6ba19.js');
|
|
7
7
|
var Content = require('../Content-e3f7b6fc.js');
|
|
8
8
|
var Emphasis = require('../Emphasis-a77d8ee9.js');
|
|
9
9
|
require('classnames');
|
|
10
10
|
require('../style-inject.es-9d2f5f4e.js');
|
|
11
|
-
require('../Heading-
|
|
11
|
+
require('../Heading-23d382a1.js');
|
|
12
12
|
require('../Typography-e2a23b7e.js');
|
|
13
13
|
require('../useAtlantisConfig-ed0bee66.js');
|
|
14
14
|
require('@jobber/hooks/useSafeLayoutEffect');
|
package/dist/DataList/index.js
CHANGED
|
@@ -21,7 +21,7 @@ var useRefocusOnActivator = require('@jobber/hooks/useRefocusOnActivator');
|
|
|
21
21
|
var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
|
|
22
22
|
var Icon = require('../Icon-405a216c.js');
|
|
23
23
|
var FormatDate = require('../FormatDate-70ea5b43.js');
|
|
24
|
-
var Heading = require('../Heading-
|
|
24
|
+
var Heading = require('../Heading-23d382a1.js');
|
|
25
25
|
var ReactDOM = require('react-dom');
|
|
26
26
|
var useIsMounted = require('@jobber/hooks/useIsMounted');
|
|
27
27
|
var Checkbox = require('../Checkbox-e481a4b1.js');
|
package/dist/DatePicker/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var DatePicker = require('../DatePicker-
|
|
5
|
+
var DatePicker = require('../DatePicker-305a5b82.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('classnames');
|
|
8
8
|
require('react-datepicker');
|
|
@@ -14,6 +14,7 @@ require('react-router-dom');
|
|
|
14
14
|
require('../Icon-405a216c.js');
|
|
15
15
|
require('@jobber/design');
|
|
16
16
|
require('lodash/omit');
|
|
17
|
+
require('../AtlantisContext-64608897.js');
|
|
17
18
|
|
|
18
19
|
|
|
19
20
|
|
|
@@ -8,6 +8,7 @@ var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
|
|
|
8
8
|
var Typography = require('./Typography-e2a23b7e.js');
|
|
9
9
|
var Button = require('./Button-6b922fc1.js');
|
|
10
10
|
var omit = require('lodash/omit');
|
|
11
|
+
var AtlantisContext = require('./AtlantisContext-64608897.js');
|
|
11
12
|
|
|
12
13
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
13
14
|
|
|
@@ -65,9 +66,11 @@ function useFocusOnSelectedDate() {
|
|
|
65
66
|
return { ref, focusOnSelectedDate };
|
|
66
67
|
}
|
|
67
68
|
|
|
69
|
+
/*eslint max-statements: ["error", 13]*/
|
|
68
70
|
function DatePicker({ onChange, onMonthChange, activator, inline, selected, readonly = false, disabled = false, fullWidth = false, smartAutofocus = true, maxDate, minDate, highlightDates, }) {
|
|
69
71
|
const { ref, focusOnSelectedDate } = useFocusOnSelectedDate();
|
|
70
72
|
const [open, setOpen] = React.useState(false);
|
|
73
|
+
const { dateFormat } = AtlantisContext.useAtlantisContext();
|
|
71
74
|
const wrapperClassName = classnames__default["default"](styles.datePickerWrapper, {
|
|
72
75
|
// react-datepicker uses this class name to not close the date picker when
|
|
73
76
|
// the activator is clicked
|
|
@@ -88,7 +91,14 @@ function DatePicker({ onChange, onMonthChange, activator, inline, selected, read
|
|
|
88
91
|
React.useEffect(focusOnSelectedDate, [open]);
|
|
89
92
|
}
|
|
90
93
|
return (React__default["default"].createElement("div", { className: wrapperClassName, ref: ref },
|
|
91
|
-
React__default["default"].createElement(ReactDatePicker__default["default"], { ref: pickerRef, calendarClassName: datePickerClassNames, showPopperArrow: false, selected: selected, inline: inline, disabled: disabled, readOnly: readonly, onChange: handleChange, maxDate: maxDate, preventOpenOnFocus: true, minDate: minDate, useWeekdaysShort: true, customInput: React__default["default"].createElement(DatePickerActivator, { activator: activator, fullWidth: fullWidth }), renderCustomHeader: props => React__default["default"].createElement(DatePickerCustomHeader, Object.assign({}, props)), onCalendarOpen: handleCalendarOpen, onCalendarClose: handleCalendarClose, dateFormat: [
|
|
94
|
+
React__default["default"].createElement(ReactDatePicker__default["default"], { ref: pickerRef, calendarClassName: datePickerClassNames, showPopperArrow: false, selected: selected, inline: inline, disabled: disabled, readOnly: readonly, onChange: handleChange, maxDate: maxDate, preventOpenOnFocus: true, minDate: minDate, useWeekdaysShort: true, customInput: React__default["default"].createElement(DatePickerActivator, { activator: activator, fullWidth: fullWidth }), renderCustomHeader: props => React__default["default"].createElement(DatePickerCustomHeader, Object.assign({}, props)), onCalendarOpen: handleCalendarOpen, onCalendarClose: handleCalendarClose, dateFormat: [
|
|
95
|
+
dateFormat,
|
|
96
|
+
"P",
|
|
97
|
+
"PP",
|
|
98
|
+
"PPP",
|
|
99
|
+
"MMM dd yyyy",
|
|
100
|
+
"MMMM dd yyyy",
|
|
101
|
+
], highlightDates: highlightDates, onMonthChange: onMonthChange })));
|
|
92
102
|
/**
|
|
93
103
|
* The onChange callback on ReactDatePicker returns a Date and an Event, but
|
|
94
104
|
* the onChange in our interface only provides the Date. Simplifying the code
|
package/dist/Drawer/index.js
CHANGED
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var classnames = require('classnames');
|
|
7
7
|
var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
|
|
8
|
-
var Heading = require('../Heading-
|
|
8
|
+
var Heading = require('../Heading-23d382a1.js');
|
|
9
9
|
var ButtonDismiss = require('../ButtonDismiss-a3ba1de2.js');
|
|
10
10
|
require('../Typography-e2a23b7e.js');
|
|
11
11
|
require('../useAtlantisConfig-ed0bee66.js');
|
|
@@ -6,13 +6,13 @@ var React = require('react');
|
|
|
6
6
|
var framerMotion = require('framer-motion');
|
|
7
7
|
var classnames = require('classnames');
|
|
8
8
|
var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
|
|
9
|
-
var Heading = require('../Heading-
|
|
9
|
+
var Heading = require('../Heading-23d382a1.js');
|
|
10
10
|
var Text = require('../Text-fbeaaca6.js');
|
|
11
11
|
var Content = require('../Content-e3f7b6fc.js');
|
|
12
12
|
var Switch = require('../Switch-eac89586.js');
|
|
13
13
|
var Button = require('../Button-6b922fc1.js');
|
|
14
14
|
var Emphasis = require('../Emphasis-a77d8ee9.js');
|
|
15
|
-
var Markdown = require('../Markdown-
|
|
15
|
+
var Markdown = require('../Markdown-0f24de70.js');
|
|
16
16
|
require('../Typography-e2a23b7e.js');
|
|
17
17
|
require('../useAtlantisConfig-ed0bee66.js');
|
|
18
18
|
require('@jobber/hooks/useSafeLayoutEffect');
|
package/dist/FormatFile/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var FormatFile = require('../FormatFile-
|
|
5
|
+
var FormatFile = require('../FormatFile-32228107.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('classnames');
|
|
8
8
|
require('filesize');
|
|
@@ -12,19 +12,19 @@ require('react-router-dom');
|
|
|
12
12
|
require('../Icon-405a216c.js');
|
|
13
13
|
require('@jobber/design');
|
|
14
14
|
require('../Typography-e2a23b7e.js');
|
|
15
|
-
require('../ConfirmationModal-
|
|
15
|
+
require('../ConfirmationModal-b44e302f.js');
|
|
16
16
|
require('@jobber/hooks/useOnKeyDown');
|
|
17
|
-
require('../Modal-
|
|
17
|
+
require('../Modal-067becad.js');
|
|
18
18
|
require('react-dom');
|
|
19
19
|
require('framer-motion');
|
|
20
20
|
require('@jobber/hooks/useRefocusOnActivator');
|
|
21
21
|
require('@jobber/hooks/useFocusTrap');
|
|
22
|
-
require('../Heading-
|
|
22
|
+
require('../Heading-23d382a1.js');
|
|
23
23
|
require('../useAtlantisConfig-ed0bee66.js');
|
|
24
24
|
require('@jobber/hooks/useSafeLayoutEffect');
|
|
25
25
|
require('../ButtonDismiss-a3ba1de2.js');
|
|
26
26
|
require('../Content-e3f7b6fc.js');
|
|
27
|
-
require('../Markdown-
|
|
27
|
+
require('../Markdown-0f24de70.js');
|
|
28
28
|
require('react-markdown');
|
|
29
29
|
require('../Text-fbeaaca6.js');
|
|
30
30
|
require('../Emphasis-a77d8ee9.js');
|
|
@@ -5,7 +5,7 @@ var classnames = require('classnames');
|
|
|
5
5
|
var getHumanReadableFileSize = require('filesize');
|
|
6
6
|
var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
|
|
7
7
|
var Button = require('./Button-6b922fc1.js');
|
|
8
|
-
var ConfirmationModal = require('./ConfirmationModal-
|
|
8
|
+
var ConfirmationModal = require('./ConfirmationModal-b44e302f.js');
|
|
9
9
|
var Glimmer = require('./Glimmer-84dee1ed.js');
|
|
10
10
|
var Icon = require('./Icon-405a216c.js');
|
|
11
11
|
var Typography = require('./Typography-e2a23b7e.js');
|
package/dist/Gallery/index.js
CHANGED
|
@@ -6,7 +6,7 @@ var React = require('react');
|
|
|
6
6
|
var classnames = require('classnames');
|
|
7
7
|
var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
|
|
8
8
|
var LightBox = require('../LightBox-7efe8932.js');
|
|
9
|
-
var FormatFile = require('../FormatFile-
|
|
9
|
+
var FormatFile = require('../FormatFile-32228107.js');
|
|
10
10
|
var Button = require('../Button-6b922fc1.js');
|
|
11
11
|
require('framer-motion');
|
|
12
12
|
require('react-dom');
|
|
@@ -17,14 +17,14 @@ require('@jobber/hooks/useFocusTrap');
|
|
|
17
17
|
require('@jobber/hooks/useIsMounted');
|
|
18
18
|
require('../ButtonDismiss-a3ba1de2.js');
|
|
19
19
|
require('filesize');
|
|
20
|
-
require('../ConfirmationModal-
|
|
21
|
-
require('../Modal-
|
|
22
|
-
require('../Heading-
|
|
20
|
+
require('../ConfirmationModal-b44e302f.js');
|
|
21
|
+
require('../Modal-067becad.js');
|
|
22
|
+
require('../Heading-23d382a1.js');
|
|
23
23
|
require('../Typography-e2a23b7e.js');
|
|
24
24
|
require('../useAtlantisConfig-ed0bee66.js');
|
|
25
25
|
require('@jobber/hooks/useSafeLayoutEffect');
|
|
26
26
|
require('../Content-e3f7b6fc.js');
|
|
27
|
-
require('../Markdown-
|
|
27
|
+
require('../Markdown-0f24de70.js');
|
|
28
28
|
require('react-markdown');
|
|
29
29
|
require('../Text-fbeaaca6.js');
|
|
30
30
|
require('../Emphasis-a77d8ee9.js');
|
|
@@ -7,7 +7,11 @@ interface HeadingProps {
|
|
|
7
7
|
*/
|
|
8
8
|
readonly level: HeadingLevel;
|
|
9
9
|
readonly children: ReactNode;
|
|
10
|
+
/**
|
|
11
|
+
* Allows overriding of the element rendered. Defaults to the heading specified with level.
|
|
12
|
+
*/
|
|
13
|
+
readonly element?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span";
|
|
10
14
|
}
|
|
11
15
|
export type LevelMap = Record<HeadingLevel, TypographyOptions>;
|
|
12
|
-
export declare function Heading({ level, children }: HeadingProps): JSX.Element;
|
|
16
|
+
export declare function Heading({ level, children, element }: HeadingProps): JSX.Element;
|
|
13
17
|
export {};
|
package/dist/Heading/index.js
CHANGED
|
@@ -8,7 +8,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
8
8
|
|
|
9
9
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
10
10
|
|
|
11
|
-
function Heading({ level = 5, children }) {
|
|
11
|
+
function Heading({ level = 5, children, element }) {
|
|
12
12
|
const { JOBBER_RETHEME: inRetheme } = useAtlantisConfig.useAtlantisConfig();
|
|
13
13
|
const levelMap = {
|
|
14
14
|
1: {
|
|
@@ -49,7 +49,7 @@ function Heading({ level = 5, children }) {
|
|
|
49
49
|
textColor: "heading",
|
|
50
50
|
},
|
|
51
51
|
};
|
|
52
|
-
return React__default["default"].createElement(Typography.Typography, Object.assign({}, levelMap[level]), children);
|
|
52
|
+
return (React__default["default"].createElement(Typography.Typography, Object.assign({}, levelMap[level], { element: element || levelMap[level].element }), children));
|
|
53
53
|
}
|
|
54
54
|
|
|
55
55
|
exports.Heading = Heading;
|
|
@@ -15,6 +15,15 @@ interface InputDateProps extends Omit<CommonFormFieldProps, "clearable">, Pick<F
|
|
|
15
15
|
* The minimum selectable date.
|
|
16
16
|
*/
|
|
17
17
|
readonly minDate?: Date;
|
|
18
|
+
/**
|
|
19
|
+
* Whether to show the calendar icon
|
|
20
|
+
* @default true
|
|
21
|
+
*/
|
|
22
|
+
readonly showIcon?: boolean;
|
|
23
|
+
/**
|
|
24
|
+
* Text to display instead of a date value
|
|
25
|
+
*/
|
|
26
|
+
readonly emptyValueLabel?: string;
|
|
18
27
|
}
|
|
19
28
|
export declare function InputDate(inputProps: InputDateProps): JSX.Element;
|
|
20
29
|
export {};
|
package/dist/InputDate/index.js
CHANGED
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var omit = require('lodash/omit');
|
|
6
6
|
var React = require('react');
|
|
7
7
|
var FormField = require('../FormField-f6fadff2.js');
|
|
8
|
-
var DatePicker = require('../DatePicker-
|
|
8
|
+
var DatePicker = require('../DatePicker-305a5b82.js');
|
|
9
9
|
require('../tslib.es6-754e2961.js');
|
|
10
10
|
require('react-hook-form');
|
|
11
11
|
require('../style-inject.es-9d2f5f4e.js');
|
|
@@ -22,6 +22,7 @@ require('framer-motion');
|
|
|
22
22
|
require('../Spinner-9d8fc7ff.js');
|
|
23
23
|
require('react-datepicker');
|
|
24
24
|
require('@jobber/hooks/useRefocusOnActivator');
|
|
25
|
+
require('../AtlantisContext-64608897.js');
|
|
25
26
|
|
|
26
27
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
27
28
|
|
|
@@ -34,22 +35,36 @@ function InputDate(inputProps) {
|
|
|
34
35
|
var _a;
|
|
35
36
|
const { onChange, onClick, value } = activatorProps;
|
|
36
37
|
const newActivatorProps = omit__default["default"](activatorProps, ["activator"]);
|
|
37
|
-
const
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
38
|
+
const [showEmptyPlaceholder, setShowEmptyPlaceholder] = React.useState(!value);
|
|
39
|
+
const suffix = inputProps.showIcon !== false
|
|
40
|
+
? {
|
|
41
|
+
icon: "calendar",
|
|
42
|
+
ariaLabel: "Show calendar",
|
|
43
|
+
onClick: onClick && onClick,
|
|
44
|
+
}
|
|
45
|
+
: undefined;
|
|
41
46
|
// Set form field to formatted date string immediately, to avoid validations
|
|
42
47
|
// triggering incorrectly when it blurs (to handle the datepicker UI click)
|
|
43
48
|
value && ((_a = formFieldActionsRef.current) === null || _a === void 0 ? void 0 : _a.setValue(value));
|
|
44
49
|
return (
|
|
45
50
|
// We prevent the picker from opening on focus for keyboard navigation, so to maintain a good UX for mouse users we want to open the picker on click
|
|
46
51
|
React__default["default"].createElement("div", { onClick: onClick },
|
|
47
|
-
React__default["default"].createElement(FormField.FormField, Object.assign({}, newActivatorProps, inputProps, { value: value,
|
|
52
|
+
React__default["default"].createElement(FormField.FormField, Object.assign({}, newActivatorProps, inputProps, { value: showEmptyPlaceholder ? inputProps.emptyValueLabel : value, placeholder: inputProps.placeholder, onChange: (_, event) => {
|
|
53
|
+
onChange && onChange(event);
|
|
54
|
+
setShowEmptyPlaceholder(false);
|
|
55
|
+
}, onBlur: () => {
|
|
48
56
|
inputProps.onBlur && inputProps.onBlur();
|
|
49
57
|
activatorProps.onBlur && activatorProps.onBlur();
|
|
58
|
+
setShowEmptyPlaceholder(!value);
|
|
50
59
|
}, onFocus: () => {
|
|
51
60
|
inputProps.onFocus && inputProps.onFocus();
|
|
52
61
|
activatorProps.onFocus && activatorProps.onFocus();
|
|
62
|
+
}, onKeyUp: event => {
|
|
63
|
+
var _a;
|
|
64
|
+
if (inputProps.showIcon === false &&
|
|
65
|
+
event.key === "ArrowDown") {
|
|
66
|
+
(_a = activatorProps.onClick) === null || _a === void 0 ? void 0 : _a.call(activatorProps);
|
|
67
|
+
}
|
|
53
68
|
}, actionsRef: formFieldActionsRef, suffix: suffix }))));
|
|
54
69
|
} }));
|
|
55
70
|
}
|
package/dist/List/index.js
CHANGED
|
@@ -9,9 +9,9 @@ var groupBy = require('lodash/groupBy');
|
|
|
9
9
|
var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
|
|
10
10
|
var Icon = require('../Icon-405a216c.js');
|
|
11
11
|
var Text = require('../Text-fbeaaca6.js');
|
|
12
|
-
var Heading = require('../Heading-
|
|
12
|
+
var Heading = require('../Heading-23d382a1.js');
|
|
13
13
|
var Typography = require('../Typography-e2a23b7e.js');
|
|
14
|
-
var Markdown = require('../Markdown-
|
|
14
|
+
var Markdown = require('../Markdown-0f24de70.js');
|
|
15
15
|
var Emphasis = require('../Emphasis-a77d8ee9.js');
|
|
16
16
|
require('@jobber/design');
|
|
17
17
|
require('../useAtlantisConfig-ed0bee66.js');
|
package/dist/Markdown/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var Markdown = require('../Markdown-
|
|
5
|
+
var Markdown = require('../Markdown-0f24de70.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('react-markdown');
|
|
8
8
|
require('../Text-fbeaaca6.js');
|
|
@@ -10,7 +10,7 @@ require('../Typography-e2a23b7e.js');
|
|
|
10
10
|
require('classnames');
|
|
11
11
|
require('../style-inject.es-9d2f5f4e.js');
|
|
12
12
|
require('../Emphasis-a77d8ee9.js');
|
|
13
|
-
require('../Heading-
|
|
13
|
+
require('../Heading-23d382a1.js');
|
|
14
14
|
require('../useAtlantisConfig-ed0bee66.js');
|
|
15
15
|
require('@jobber/hooks/useSafeLayoutEffect');
|
|
16
16
|
require('../Content-e3f7b6fc.js');
|
|
@@ -4,7 +4,7 @@ var React = require('react');
|
|
|
4
4
|
var ReactMarkdown = require('react-markdown');
|
|
5
5
|
var Text = require('./Text-fbeaaca6.js');
|
|
6
6
|
var Emphasis = require('./Emphasis-a77d8ee9.js');
|
|
7
|
-
var Heading = require('./Heading-
|
|
7
|
+
var Heading = require('./Heading-23d382a1.js');
|
|
8
8
|
var Content = require('./Content-e3f7b6fc.js');
|
|
9
9
|
|
|
10
10
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
package/dist/Modal/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var Modal = require('../Modal-
|
|
5
|
+
var Modal = require('../Modal-067becad.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('react-dom');
|
|
8
8
|
require('classnames');
|
|
@@ -11,7 +11,7 @@ require('@jobber/hooks/useRefocusOnActivator');
|
|
|
11
11
|
require('@jobber/hooks/useOnKeyDown');
|
|
12
12
|
require('@jobber/hooks/useFocusTrap');
|
|
13
13
|
require('../style-inject.es-9d2f5f4e.js');
|
|
14
|
-
require('../Heading-
|
|
14
|
+
require('../Heading-23d382a1.js');
|
|
15
15
|
require('../Typography-e2a23b7e.js');
|
|
16
16
|
require('../useAtlantisConfig-ed0bee66.js');
|
|
17
17
|
require('@jobber/hooks/useSafeLayoutEffect');
|
|
@@ -8,7 +8,7 @@ var useRefocusOnActivator = require('@jobber/hooks/useRefocusOnActivator');
|
|
|
8
8
|
var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
|
|
9
9
|
var useFocusTrap = require('@jobber/hooks/useFocusTrap');
|
|
10
10
|
var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
|
|
11
|
-
var Heading = require('./Heading-
|
|
11
|
+
var Heading = require('./Heading-23d382a1.js');
|
|
12
12
|
var Button = require('./Button-6b922fc1.js');
|
|
13
13
|
var ButtonDismiss = require('./ButtonDismiss-a3ba1de2.js');
|
|
14
14
|
|
package/dist/Page/index.js
CHANGED
|
@@ -6,10 +6,10 @@ var React = require('react');
|
|
|
6
6
|
var classnames = require('classnames');
|
|
7
7
|
var jobberHooks = require('@jobber/hooks/useResizeObserver');
|
|
8
8
|
var styleInject_es = require('../style-inject.es-9d2f5f4e.js');
|
|
9
|
-
var Heading = require('../Heading-
|
|
9
|
+
var Heading = require('../Heading-23d382a1.js');
|
|
10
10
|
var Text = require('../Text-fbeaaca6.js');
|
|
11
11
|
var Content = require('../Content-e3f7b6fc.js');
|
|
12
|
-
var Markdown = require('../Markdown-
|
|
12
|
+
var Markdown = require('../Markdown-0f24de70.js');
|
|
13
13
|
var Button = require('../Button-6b922fc1.js');
|
|
14
14
|
var Menu = require('../Menu-d6dd673e.js');
|
|
15
15
|
var Emphasis = require('../Emphasis-a77d8ee9.js');
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jobber/components",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.90.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -72,6 +72,8 @@
|
|
|
72
72
|
"typescript": "^4.9.5"
|
|
73
73
|
},
|
|
74
74
|
"peerDependencies": {
|
|
75
|
+
"date-fns": "^2.0.0",
|
|
76
|
+
"date-fns-tz": "^2.0.0",
|
|
75
77
|
"react": "^18",
|
|
76
78
|
"react-dom": "^18"
|
|
77
79
|
},
|
|
@@ -80,5 +82,5 @@
|
|
|
80
82
|
"> 1%",
|
|
81
83
|
"IE 10"
|
|
82
84
|
],
|
|
83
|
-
"gitHead": "
|
|
85
|
+
"gitHead": "01b7c3a9758037e7c41381c156e6349a48fb8f4e"
|
|
84
86
|
}
|