@jobber/components 8.6.0 → 8.7.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Autocomplete/index.cjs +1 -2
- package/dist/Autocomplete/index.mjs +1 -2
- package/dist/Autocomplete-cjs.js +1 -3
- package/dist/Autocomplete-es.js +1 -3
- package/dist/DataList/components/DataListSearch/index.cjs +1 -2
- package/dist/DataList/components/DataListSearch/index.mjs +1 -2
- package/dist/DataList/index.cjs +1 -2
- package/dist/DataList/index.mjs +1 -2
- package/dist/DataTable/index.cjs +1 -2
- package/dist/DataTable/index.mjs +1 -2
- package/dist/FormField/FormFieldTypes.d.ts +1 -10
- package/dist/FormField/index.cjs +4 -13
- package/dist/FormField/index.d.ts +0 -4
- package/dist/FormField/index.mjs +4 -9
- package/dist/InputDate/index.cjs +1 -2
- package/dist/InputDate/index.mjs +1 -2
- package/dist/InputEmail/index.cjs +0 -1
- package/dist/InputEmail/index.mjs +0 -1
- package/dist/InputEmail-cjs.js +1 -3
- package/dist/InputEmail-es.js +1 -3
- package/dist/InputPhoneNumber/InputMask.d.ts +0 -38
- package/dist/InputPhoneNumber/InputPhoneNumber.types.d.ts +1 -2
- package/dist/InputPhoneNumber/index.cjs +1 -2
- package/dist/InputPhoneNumber/index.mjs +1 -2
- package/dist/InputPhoneNumber-cjs.js +11 -12
- package/dist/InputPhoneNumber-es.js +11 -12
- package/dist/InputText/index.cjs +1 -2
- package/dist/InputText/index.mjs +1 -2
- package/dist/InputText-cjs.js +3 -5
- package/dist/InputText-es.js +3 -5
- package/dist/InputTime/index.cjs +0 -1
- package/dist/InputTime/index.mjs +0 -1
- package/dist/InputTime-cjs.js +1 -2
- package/dist/InputTime-es.js +1 -2
- package/dist/Select/index.cjs +1 -2
- package/dist/Select/index.mjs +1 -2
- package/dist/Select-cjs.js +3 -5
- package/dist/Select-es.js +3 -5
- package/dist/docs/Button/Button.md +1 -1
- package/dist/docs/errors/errors.md +1 -1
- package/dist/docs/index.md +0 -3
- package/dist/index.cjs +2 -12
- package/dist/index.d.mts +0 -2
- package/dist/index.d.ts +0 -2
- package/dist/index.mjs +2 -6
- package/dist/prebuildCssEntry.d.ts +13 -0
- package/dist/useAtlantisFormFieldName-cjs.js +3 -3
- package/dist/useAtlantisFormFieldName-es.js +3 -3
- package/dist/utils/meta/meta.json +0 -3
- package/package.json +3 -15
- package/rollup.config.mjs +15 -17
- package/Form.d.ts +0 -1
- package/Form.js +0 -17
- package/InputPassword.d.ts +0 -1
- package/InputPassword.js +0 -17
- package/dist/Form/Form.d.ts +0 -18
- package/dist/Form/index.cjs +0 -10
- package/dist/Form/index.d.ts +0 -1
- package/dist/Form/index.mjs +0 -4
- package/dist/Form-cjs.js +0 -43
- package/dist/Form-es.js +0 -41
- package/dist/FormField/FormField.d.ts +0 -3
- package/dist/FormField/hooks/useAtlantisFormField.d.ts +0 -91
- package/dist/FormField/hooks/useAtlantisFormFieldActions.d.ts +0 -22
- package/dist/FormField/hooks/useAtlantisReactHookForm.d.ts +0 -20
- package/dist/FormField-cjs.js +0 -209
- package/dist/FormField-es.js +0 -204
- package/dist/InputPassword/InputPassword.d.ts +0 -13
- package/dist/InputPassword/index.cjs +0 -27
- package/dist/InputPassword/index.d.ts +0 -1
- package/dist/InputPassword/index.mjs +0 -21
- package/dist/InputPassword-cjs.js +0 -28
- package/dist/InputPassword-es.js +0 -26
- package/dist/docs/Form/Form.md +0 -106
- package/dist/docs/FormField/FormField.md +0 -92
- package/dist/docs/InputPassword/InputPassword.md +0 -51
package/dist/Select/index.cjs
CHANGED
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
var Select = require('../Select-cjs.js');
|
|
4
4
|
require('react');
|
|
5
5
|
require('classnames');
|
|
6
|
+
require('../useAtlantisFormFieldName-cjs.js');
|
|
6
7
|
require('../FormFieldWrapper-cjs.js');
|
|
7
8
|
require('@jobber/hooks');
|
|
8
9
|
require('framer-motion');
|
|
@@ -17,8 +18,6 @@ require('../useFormFieldFocus-cjs.js');
|
|
|
17
18
|
require('../InputValidation-cjs.js');
|
|
18
19
|
require('../FormFieldPostFix-cjs.js');
|
|
19
20
|
require('../Spinner-cjs.js');
|
|
20
|
-
require('../useAtlantisFormFieldName-cjs.js');
|
|
21
|
-
require('react-hook-form');
|
|
22
21
|
require('../mergeRefs-cjs.js');
|
|
23
22
|
require('../filterDataAttributes-cjs.js');
|
|
24
23
|
|
package/dist/Select/index.mjs
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export { S as Option, a as Select } from '../Select-es.js';
|
|
2
2
|
import 'react';
|
|
3
3
|
import 'classnames';
|
|
4
|
+
import '../useAtlantisFormFieldName-es.js';
|
|
4
5
|
import '../FormFieldWrapper-es.js';
|
|
5
6
|
import '@jobber/hooks';
|
|
6
7
|
import 'framer-motion';
|
|
@@ -15,7 +16,5 @@ import '../useFormFieldFocus-es.js';
|
|
|
15
16
|
import '../InputValidation-es.js';
|
|
16
17
|
import '../FormFieldPostFix-es.js';
|
|
17
18
|
import '../Spinner-es.js';
|
|
18
|
-
import '../useAtlantisFormFieldName-es.js';
|
|
19
|
-
import 'react-hook-form';
|
|
20
19
|
import '../mergeRefs-es.js';
|
|
21
20
|
import '../filterDataAttributes-es.js';
|
package/dist/Select-cjs.js
CHANGED
|
@@ -2,14 +2,12 @@
|
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
var classnames = require('classnames');
|
|
5
|
-
var FormFieldWrapper = require('./FormFieldWrapper-cjs.js');
|
|
6
|
-
var FormFieldPostFix = require('./FormFieldPostFix-cjs.js');
|
|
7
5
|
var useAtlantisFormFieldName = require('./useAtlantisFormFieldName-cjs.js');
|
|
8
|
-
require('./
|
|
9
|
-
require('react-hook-form');
|
|
10
|
-
var mergeRefs = require('./mergeRefs-cjs.js');
|
|
6
|
+
var FormFieldWrapper = require('./FormFieldWrapper-cjs.js');
|
|
11
7
|
require('./Button-cjs.js');
|
|
12
8
|
require('@jobber/design');
|
|
9
|
+
var FormFieldPostFix = require('./FormFieldPostFix-cjs.js');
|
|
10
|
+
var mergeRefs = require('./mergeRefs-cjs.js');
|
|
13
11
|
var filterDataAttributes = require('./filterDataAttributes-cjs.js');
|
|
14
12
|
|
|
15
13
|
function SelectOption({ children, disabled, value }) {
|
package/dist/Select-es.js
CHANGED
|
@@ -1,13 +1,11 @@
|
|
|
1
1
|
import React__default, { useId, useRef } from 'react';
|
|
2
2
|
import classnames from 'classnames';
|
|
3
|
-
import { c as FormFieldWrapper, g as formFieldStyles } from './FormFieldWrapper-es.js';
|
|
4
|
-
import { F as FormFieldPostFix } from './FormFieldPostFix-es.js';
|
|
5
3
|
import { u as useAtlantisFormFieldName } from './useAtlantisFormFieldName-es.js';
|
|
6
|
-
import './
|
|
7
|
-
import 'react-hook-form';
|
|
8
|
-
import { m as mergeRefs } from './mergeRefs-es.js';
|
|
4
|
+
import { c as FormFieldWrapper, g as formFieldStyles } from './FormFieldWrapper-es.js';
|
|
9
5
|
import './Button-es.js';
|
|
10
6
|
import '@jobber/design';
|
|
7
|
+
import { F as FormFieldPostFix } from './FormFieldPostFix-es.js';
|
|
8
|
+
import { m as mergeRefs } from './mergeRefs-es.js';
|
|
11
9
|
import { f as filterDataAttributes } from './filterDataAttributes-es.js';
|
|
12
10
|
|
|
13
11
|
function SelectOption({ children, disabled, value }) {
|
|
@@ -614,7 +614,7 @@ that the URL will change to the appropriate route. See
|
|
|
614
614
|
### Form submit (web only)
|
|
615
615
|
|
|
616
616
|
Passing the `submit` prop will allow a Button to submit a
|
|
617
|
-
[Form](
|
|
617
|
+
[Form](/components/Form). Since submitting a form is a specific action, only a
|
|
618
618
|
form is a specific action, only `variation="work"` and `type="primary"` are
|
|
619
619
|
allowed. See
|
|
620
620
|
[Web/Form Submit example](/storybook/web/?path=/story/components-actions-button--form-submit)
|
|
@@ -84,7 +84,7 @@ If content is missing as a result of the error, follow guidance around
|
|
|
84
84
|
|
|
85
85
|
Atlantis inputs like [InputText](../InputText/InputText.md) have input validation
|
|
86
86
|
built-in for ease of use. The input validation is integrated with the
|
|
87
|
-
[Form](../
|
|
87
|
+
[Form](../components/Form) components on both web and mobile as well.
|
|
88
88
|
|
|
89
89
|
You can also provide [InputValidation](../InputValidation/InputValidation.md) externally
|
|
90
90
|
if needed.
|
package/dist/docs/index.md
CHANGED
|
@@ -41,10 +41,8 @@
|
|
|
41
41
|
[errors](./errors/errors.md)
|
|
42
42
|
[FeatureSwitch](./FeatureSwitch/FeatureSwitch.md)
|
|
43
43
|
[Flex](./Flex/Flex.md)
|
|
44
|
-
[Form](./Form/Form.md)
|
|
45
44
|
[FormatFile](./FormatFile/FormatFile.md)
|
|
46
45
|
[FormatRelativeDateTime](./FormatRelativeDateTime/FormatRelativeDateTime.md)
|
|
47
|
-
[FormField](./FormField/FormField.md)
|
|
48
46
|
[Frame](./Frame/Frame.md)
|
|
49
47
|
[Gallery](./Gallery/Gallery.md)
|
|
50
48
|
[Glimmer](./Glimmer/Glimmer.md)
|
|
@@ -58,7 +56,6 @@
|
|
|
58
56
|
[InputFile](./InputFile/InputFile.md)
|
|
59
57
|
[InputGroup](./InputGroup/InputGroup.md)
|
|
60
58
|
[InputNumber](./InputNumber/InputNumber.md)
|
|
61
|
-
[InputPassword](./InputPassword/InputPassword.md)
|
|
62
59
|
[InputPhoneNumber](./InputPhoneNumber/InputPhoneNumber.md)
|
|
63
60
|
[InputText](./InputText/InputText.md)
|
|
64
61
|
[InputTime](./InputTime/InputTime.md)
|
package/dist/index.cjs
CHANGED
|
@@ -42,8 +42,6 @@ var DrawerGrid = require('./DrawerGrid-cjs.js');
|
|
|
42
42
|
var Emphasis = require('./Emphasis-cjs.js');
|
|
43
43
|
var FeatureSwitch = require('./FeatureSwitch-cjs.js');
|
|
44
44
|
var Flex = require('./Flex-cjs.js');
|
|
45
|
-
var Form = require('./Form-cjs.js');
|
|
46
|
-
var FormField = require('./FormField-cjs.js');
|
|
47
45
|
var useAtlantisFormFieldName = require('./useAtlantisFormFieldName-cjs.js');
|
|
48
46
|
var FormFieldWrapper = require('./FormFieldWrapper-cjs.js');
|
|
49
47
|
var FormatFile = require('./FormatFile-cjs.js');
|
|
@@ -60,7 +58,6 @@ var InputEmail = require('./InputEmail-cjs.js');
|
|
|
60
58
|
var InputFile = require('./InputFile-cjs.js');
|
|
61
59
|
var InputGroup = require('./InputGroup-cjs.js');
|
|
62
60
|
var InputNumber = require('./InputNumber-cjs.js');
|
|
63
|
-
var InputPassword = require('./InputPassword-cjs.js');
|
|
64
61
|
var InputPhoneNumber = require('./InputPhoneNumber-cjs.js');
|
|
65
62
|
var InputText = require('./InputText-cjs.js');
|
|
66
63
|
var InputTime = require('./InputTime-cjs.js');
|
|
@@ -113,11 +110,10 @@ require('react/jsx-runtime');
|
|
|
113
110
|
require('react-dom');
|
|
114
111
|
require('./floating-ui.react-dom-cjs.js');
|
|
115
112
|
require('./maxHeight-cjs.js');
|
|
116
|
-
require('./tslib.es6-cjs.js');
|
|
117
|
-
require('react-hook-form');
|
|
118
113
|
require('./mergeRefs-cjs.js');
|
|
119
114
|
require('./filterDataAttributes-cjs.js');
|
|
120
115
|
require('color');
|
|
116
|
+
require('./tslib.es6-cjs.js');
|
|
121
117
|
require('react-router-dom');
|
|
122
118
|
require('./getMappedAtlantisSpaceToken-cjs.js');
|
|
123
119
|
require('./useChildComponent-cjs.js');
|
|
@@ -176,10 +172,10 @@ require('./DataListAction-cjs.js');
|
|
|
176
172
|
require('./DataListLayoutActions-cjs.js');
|
|
177
173
|
require('./DataListStatusBar-cjs.js');
|
|
178
174
|
require('./clsx-cjs.js');
|
|
179
|
-
require('./FormFieldPostFix-cjs.js');
|
|
180
175
|
require('./useFormFieldFocus-cjs.js');
|
|
181
176
|
require('filesize');
|
|
182
177
|
require('./GridCell-cjs.js');
|
|
178
|
+
require('./FormFieldPostFix-cjs.js');
|
|
183
179
|
require('axios');
|
|
184
180
|
require('./useRenderElement-cjs.js');
|
|
185
181
|
require('./BottomSheet-cjs.js');
|
|
@@ -257,11 +253,6 @@ exports.DrawerGrid = DrawerGrid.DrawerGrid;
|
|
|
257
253
|
exports.Emphasis = Emphasis.Emphasis;
|
|
258
254
|
exports.FeatureSwitch = FeatureSwitch.FeatureSwitch;
|
|
259
255
|
exports.Flex = Flex.Flex;
|
|
260
|
-
exports.Form = Form.Form;
|
|
261
|
-
exports.FormField = FormField.FormField;
|
|
262
|
-
exports.useAtlantisFormField = FormField.useAtlantisFormField;
|
|
263
|
-
exports.useAtlantisFormFieldActions = FormField.useAtlantisFormFieldActions;
|
|
264
|
-
exports.useAtlantisReactHookForm = FormField.useAtlantisReactHookForm;
|
|
265
256
|
exports.useAtlantisFormFieldName = useAtlantisFormFieldName.useAtlantisFormFieldName;
|
|
266
257
|
exports.AffixIcon = FormFieldWrapper.AffixIcon;
|
|
267
258
|
exports.AffixLabel = FormFieldWrapper.AffixLabel;
|
|
@@ -300,7 +291,6 @@ exports.updateFiles = InputFile.updateFiles;
|
|
|
300
291
|
exports.useInputFileContentContext = InputFile.useInputFileContentContext;
|
|
301
292
|
exports.InputGroup = InputGroup.InputGroup;
|
|
302
293
|
exports.InputNumber = InputNumber.InputNumber;
|
|
303
|
-
exports.InputPassword = InputPassword.InputPassword;
|
|
304
294
|
exports.InputPhoneNumber = InputPhoneNumber.InputPhoneNumber;
|
|
305
295
|
exports.InputText = InputText.InputText;
|
|
306
296
|
exports.InputTime = InputTime.InputTime;
|
package/dist/index.d.mts
CHANGED
|
@@ -32,7 +32,6 @@ export * from "./Drawer";
|
|
|
32
32
|
export * from "./Emphasis";
|
|
33
33
|
export * from "./FeatureSwitch";
|
|
34
34
|
export * from "./Flex";
|
|
35
|
-
export * from "./Form";
|
|
36
35
|
export * from "./FormField";
|
|
37
36
|
export * from "./FormatFile";
|
|
38
37
|
export * from "./FormatRelativeDateTime";
|
|
@@ -49,7 +48,6 @@ export * from "./InputEmail";
|
|
|
49
48
|
export * from "./InputFile";
|
|
50
49
|
export * from "./InputGroup";
|
|
51
50
|
export * from "./InputNumber";
|
|
52
|
-
export * from "./InputPassword";
|
|
53
51
|
export * from "./InputPhoneNumber";
|
|
54
52
|
export * from "./InputText";
|
|
55
53
|
export * from "./InputTime";
|
package/dist/index.d.ts
CHANGED
|
@@ -32,7 +32,6 @@ export * from "./Drawer";
|
|
|
32
32
|
export * from "./Emphasis";
|
|
33
33
|
export * from "./FeatureSwitch";
|
|
34
34
|
export * from "./Flex";
|
|
35
|
-
export * from "./Form";
|
|
36
35
|
export * from "./FormField";
|
|
37
36
|
export * from "./FormatFile";
|
|
38
37
|
export * from "./FormatRelativeDateTime";
|
|
@@ -49,7 +48,6 @@ export * from "./InputEmail";
|
|
|
49
48
|
export * from "./InputFile";
|
|
50
49
|
export * from "./InputGroup";
|
|
51
50
|
export * from "./InputNumber";
|
|
52
|
-
export * from "./InputPassword";
|
|
53
51
|
export * from "./InputPhoneNumber";
|
|
54
52
|
export * from "./InputText";
|
|
55
53
|
export * from "./InputTime";
|
package/dist/index.mjs
CHANGED
|
@@ -40,8 +40,6 @@ export { D as Drawer, a as DrawerGrid } from './DrawerGrid-es.js';
|
|
|
40
40
|
export { E as Emphasis } from './Emphasis-es.js';
|
|
41
41
|
export { F as FeatureSwitch } from './FeatureSwitch-es.js';
|
|
42
42
|
export { F as Flex } from './Flex-es.js';
|
|
43
|
-
export { F as Form } from './Form-es.js';
|
|
44
|
-
export { F as FormField, u as useAtlantisFormField, a as useAtlantisFormFieldActions, b as useAtlantisReactHookForm } from './FormField-es.js';
|
|
45
43
|
export { u as useAtlantisFormFieldName } from './useAtlantisFormFieldName-es.js';
|
|
46
44
|
export { A as AffixIcon, f as AffixLabel, F as FormFieldInputHorizontalWrapper, a as FormFieldInputWrapperStyles, b as FormFieldLabel, c as FormFieldWrapper, d as FormFieldWrapperMain, e as FormFieldWrapperToolbar, u as useFormFieldWrapperStyles } from './FormFieldWrapper-es.js';
|
|
47
45
|
export { F as FormatFile, u as useFormatFile, a as useFormatFileStyles } from './FormatFile-es.js';
|
|
@@ -58,7 +56,6 @@ export { I as InputEmail } from './InputEmail-es.js';
|
|
|
58
56
|
export { F as FileTypes, I as InputFile, a as InputFileContentContext, c as convertToMimeTypes, f as formatMimeTypes, m as mimeTypeToReadable, u as updateFiles, b as useInputFileContentContext } from './InputFile-es.js';
|
|
59
57
|
export { I as InputGroup } from './InputGroup-es.js';
|
|
60
58
|
export { I as InputNumber } from './InputNumber-es.js';
|
|
61
|
-
export { I as InputPassword } from './InputPassword-es.js';
|
|
62
59
|
export { I as InputPhoneNumber } from './InputPhoneNumber-es.js';
|
|
63
60
|
export { I as InputText } from './InputText-es.js';
|
|
64
61
|
export { I as InputTime } from './InputTime-es.js';
|
|
@@ -111,11 +108,10 @@ import 'react/jsx-runtime';
|
|
|
111
108
|
import 'react-dom';
|
|
112
109
|
import './floating-ui.react-dom-es.js';
|
|
113
110
|
import './maxHeight-es.js';
|
|
114
|
-
import './tslib.es6-es.js';
|
|
115
|
-
import 'react-hook-form';
|
|
116
111
|
import './mergeRefs-es.js';
|
|
117
112
|
import './filterDataAttributes-es.js';
|
|
118
113
|
import 'color';
|
|
114
|
+
import './tslib.es6-es.js';
|
|
119
115
|
import 'react-router-dom';
|
|
120
116
|
import './getMappedAtlantisSpaceToken-es.js';
|
|
121
117
|
import './useChildComponent-es.js';
|
|
@@ -174,10 +170,10 @@ import './DataListAction-es.js';
|
|
|
174
170
|
import './DataListLayoutActions-es.js';
|
|
175
171
|
import './DataListStatusBar-es.js';
|
|
176
172
|
import './clsx-es.js';
|
|
177
|
-
import './FormFieldPostFix-es.js';
|
|
178
173
|
import './useFormFieldFocus-es.js';
|
|
179
174
|
import 'filesize';
|
|
180
175
|
import './GridCell-es.js';
|
|
176
|
+
import './FormFieldPostFix-es.js';
|
|
181
177
|
import 'axios';
|
|
182
178
|
import './useRenderElement-es.js';
|
|
183
179
|
import './BottomSheet-es.js';
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Single entry point used only for the PREBUILD_CSS step (see rollup.config.mjs).
|
|
3
|
+
*
|
|
4
|
+
* Rollup traverses a single entry's import graph in a deterministic, depth-first
|
|
5
|
+
* order, which keeps the extracted styles.css ordering stable across builds.
|
|
6
|
+
* Update this file to include any new styles that should be included in the extracted stylesheet.
|
|
7
|
+
*
|
|
8
|
+
* Both the main barrel and the primitives barrel are imported here so that every
|
|
9
|
+
* component's and styled primitive's (under `src/primitives/`) CSS lands in the
|
|
10
|
+
* extracted stylesheet.
|
|
11
|
+
*/
|
|
12
|
+
import "./index";
|
|
13
|
+
import "./primitives/index";
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
function useAtlantisFormFieldName({ id, nameProp, }) {
|
|
4
4
|
/**
|
|
5
|
-
* Generate a name if one is not supplied
|
|
6
|
-
*
|
|
7
|
-
*
|
|
5
|
+
* Generate a name if one is not supplied. This is used as the HTML
|
|
6
|
+
* `name` attribute for form-control inputs that need a stable
|
|
7
|
+
* identifier; when a consumer supplies `nameProp`, it wins.
|
|
8
8
|
*/
|
|
9
9
|
const name = nameProp ? nameProp : `generatedName--${id}`;
|
|
10
10
|
return { name };
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
function useAtlantisFormFieldName({ id, nameProp, }) {
|
|
2
2
|
/**
|
|
3
|
-
* Generate a name if one is not supplied
|
|
4
|
-
*
|
|
5
|
-
*
|
|
3
|
+
* Generate a name if one is not supplied. This is used as the HTML
|
|
4
|
+
* `name` attribute for form-control inputs that need a stable
|
|
5
|
+
* identifier; when a consumer supplies `nameProp`, it wins.
|
|
6
6
|
*/
|
|
7
7
|
const name = nameProp ? nameProp : `generatedName--${id}`;
|
|
8
8
|
return { name };
|
|
@@ -86,8 +86,6 @@
|
|
|
86
86
|
"FeatureSwitch",
|
|
87
87
|
"Flex",
|
|
88
88
|
"Footer",
|
|
89
|
-
"Form",
|
|
90
|
-
"FormField",
|
|
91
89
|
"FormFieldInputHorizontalWrapper",
|
|
92
90
|
"FormFieldInputWrapperStyles",
|
|
93
91
|
"FormFieldLabel",
|
|
@@ -127,7 +125,6 @@
|
|
|
127
125
|
"InputFileContentContext.Provider",
|
|
128
126
|
"InputGroup",
|
|
129
127
|
"InputNumber",
|
|
130
|
-
"InputPassword",
|
|
131
128
|
"InputPhoneNumber",
|
|
132
129
|
"InputText",
|
|
133
130
|
"InputTime",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jobber/components",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.7.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.cjs",
|
|
@@ -195,11 +195,6 @@
|
|
|
195
195
|
"import": "./dist/Flex/index.mjs",
|
|
196
196
|
"require": "./dist/Flex/index.cjs"
|
|
197
197
|
},
|
|
198
|
-
"./Form": {
|
|
199
|
-
"types": "./dist/Form/index.d.ts",
|
|
200
|
-
"import": "./dist/Form/index.mjs",
|
|
201
|
-
"require": "./dist/Form/index.cjs"
|
|
202
|
-
},
|
|
203
198
|
"./FormField": {
|
|
204
199
|
"types": "./dist/FormField/index.d.ts",
|
|
205
200
|
"import": "./dist/FormField/index.mjs",
|
|
@@ -280,11 +275,6 @@
|
|
|
280
275
|
"import": "./dist/InputNumber/index.mjs",
|
|
281
276
|
"require": "./dist/InputNumber/index.cjs"
|
|
282
277
|
},
|
|
283
|
-
"./InputPassword": {
|
|
284
|
-
"types": "./dist/InputPassword/index.d.ts",
|
|
285
|
-
"import": "./dist/InputPassword/index.mjs",
|
|
286
|
-
"require": "./dist/InputPassword/index.cjs"
|
|
287
|
-
},
|
|
288
278
|
"./InputPhoneNumber": {
|
|
289
279
|
"types": "./dist/InputPhoneNumber/index.d.ts",
|
|
290
280
|
"import": "./dist/InputPhoneNumber/index.mjs",
|
|
@@ -504,7 +494,6 @@
|
|
|
504
494
|
"react-countdown": "^2.3.2",
|
|
505
495
|
"react-datepicker": "^8.7.0",
|
|
506
496
|
"react-dropzone": "^11.0.2",
|
|
507
|
-
"react-hook-form": "^7.52.0",
|
|
508
497
|
"react-markdown": "^10.1.0",
|
|
509
498
|
"react-router-dom": "^5.3.4",
|
|
510
499
|
"ts-xor": "^1.0.8",
|
|
@@ -514,7 +503,7 @@
|
|
|
514
503
|
"@apollo/client": "^3.7.10",
|
|
515
504
|
"@csstools/postcss-global-data": "^1.0.3",
|
|
516
505
|
"@jobber/design": "0.101.1",
|
|
517
|
-
"@jobber/hooks": "2.
|
|
506
|
+
"@jobber/hooks": "2.21.0",
|
|
518
507
|
"@rollup/plugin-alias": "^5.1.0",
|
|
519
508
|
"@rollup/plugin-commonjs": "^25.0.7",
|
|
520
509
|
"@rollup/plugin-node-resolve": "15.2.3",
|
|
@@ -560,7 +549,6 @@
|
|
|
560
549
|
"lodash": "^4",
|
|
561
550
|
"react": "^19.1.0",
|
|
562
551
|
"react-dom": "^19.1.0",
|
|
563
|
-
"react-hook-form": "^7.52.0",
|
|
564
552
|
"react-router-dom": "^6"
|
|
565
553
|
},
|
|
566
554
|
"browserslist": [
|
|
@@ -568,5 +556,5 @@
|
|
|
568
556
|
"> 1%",
|
|
569
557
|
"IE 10"
|
|
570
558
|
],
|
|
571
|
-
"gitHead": "
|
|
559
|
+
"gitHead": "36bbb3d447601ce2277cf1ed0265074e479ac471"
|
|
572
560
|
}
|
package/rollup.config.mjs
CHANGED
|
@@ -15,25 +15,24 @@ const createMultiInput =
|
|
|
15
15
|
typeof multiInput === "function" ? multiInput : multiInput.default;
|
|
16
16
|
|
|
17
17
|
/**
|
|
18
|
-
* When PREBUILD_CSS is supplied, only
|
|
19
|
-
* This ensures postcss maintains consistent ordering of
|
|
18
|
+
* When PREBUILD_CSS is supplied, build only a single synthetic entry that
|
|
19
|
+
* imports every barrel. This ensures postcss maintains consistent ordering of
|
|
20
|
+
* styles across builds.
|
|
20
21
|
*
|
|
21
|
-
*
|
|
22
|
-
*
|
|
23
|
-
* that order.
|
|
22
|
+
* Supplying multiple inputs (multiInput globs, or separate barrels) allows rollup
|
|
23
|
+
* discover css imports in a non-deterministic order, which postcss then bundles
|
|
24
|
+
* in that order, producing a styles.css that churns on every build. A single
|
|
25
|
+
* entry is traversed depth-first in a deterministic order, so the extracted
|
|
26
|
+
* styles.css is stable.
|
|
24
27
|
*
|
|
25
|
-
*
|
|
26
|
-
* primitives (under `src/primitives/`) contribute their
|
|
27
|
-
* extracted styles.css. Without
|
|
28
|
-
* bundle but not in the stylesheet, so
|
|
28
|
+
* `src/prebuildCssEntry.ts` imports both the main barrel and the primitives
|
|
29
|
+
* barrel so that styled primitives (under `src/primitives/`) contribute their
|
|
30
|
+
* CSS module hashes to the extracted styles.css. Without the primitives barrel
|
|
31
|
+
* their class hashes appear in the JS bundle but not in the stylesheet, so
|
|
32
|
+
* consumers see no styles applied.
|
|
29
33
|
*/
|
|
30
34
|
const PREBUILD_CSS = process.env.PREBUILD_CSS === "true";
|
|
31
|
-
|
|
32
|
-
// inputs share the basename `index.ts`, so the array form would collide.
|
|
33
|
-
const PREBUILD_CSS_INPUTS = {
|
|
34
|
-
index: "src/index.ts",
|
|
35
|
-
"primitives/index": "src/primitives/index.ts",
|
|
36
|
-
};
|
|
35
|
+
const PREBUILD_CSS_INPUT = "src/prebuildCssEntry.ts";
|
|
37
36
|
|
|
38
37
|
/**
|
|
39
38
|
* PostCSS plugin to remove @charset declarations.
|
|
@@ -63,7 +62,7 @@ export default {
|
|
|
63
62
|
|
|
64
63
|
warn(warning);
|
|
65
64
|
},
|
|
66
|
-
input: PREBUILD_CSS ?
|
|
65
|
+
input: PREBUILD_CSS ? PREBUILD_CSS_INPUT : `src/**/index.{ts,tsx}`,
|
|
67
66
|
plugins: [
|
|
68
67
|
nodePolyfills(),
|
|
69
68
|
nodeResolve(),
|
|
@@ -180,7 +179,6 @@ export default {
|
|
|
180
179
|
external: [
|
|
181
180
|
"react",
|
|
182
181
|
"react/jsx-runtime",
|
|
183
|
-
"react-hook-form",
|
|
184
182
|
"react-router-dom",
|
|
185
183
|
"react-dom",
|
|
186
184
|
"react-dom/client",
|
package/Form.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./dist/Form";
|
package/Form.js
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true,
|
|
5
|
-
});
|
|
6
|
-
|
|
7
|
-
var Form = require("./dist/Form");
|
|
8
|
-
|
|
9
|
-
Object.keys(Form).forEach(function(key) {
|
|
10
|
-
if (key === "default" || key === "__esModule") return;
|
|
11
|
-
Object.defineProperty(exports, key, {
|
|
12
|
-
enumerable: true,
|
|
13
|
-
get: function get() {
|
|
14
|
-
return Form[key];
|
|
15
|
-
},
|
|
16
|
-
});
|
|
17
|
-
});
|
package/InputPassword.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./dist/InputPassword";
|
package/InputPassword.js
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true,
|
|
5
|
-
});
|
|
6
|
-
|
|
7
|
-
var InputPassword = require("./dist/InputPassword");
|
|
8
|
-
|
|
9
|
-
Object.keys(InputPassword).forEach(function(key) {
|
|
10
|
-
if (key === "default" || key === "__esModule") return;
|
|
11
|
-
Object.defineProperty(exports, key, {
|
|
12
|
-
enumerable: true,
|
|
13
|
-
get: function get() {
|
|
14
|
-
return InputPassword[key];
|
|
15
|
-
},
|
|
16
|
-
});
|
|
17
|
-
});
|
package/dist/Form/Form.d.ts
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import type { ReactNode } from "react";
|
|
2
|
-
import React from "react";
|
|
3
|
-
export interface FormRef {
|
|
4
|
-
submit(): void;
|
|
5
|
-
}
|
|
6
|
-
export interface FormProps {
|
|
7
|
-
readonly children: ReactNode;
|
|
8
|
-
/**
|
|
9
|
-
* Callback for when the form has been sucessfully
|
|
10
|
-
* submitted.
|
|
11
|
-
*/
|
|
12
|
-
onSubmit?(): void;
|
|
13
|
-
onStateChange?(formState: {
|
|
14
|
-
isDirty: boolean;
|
|
15
|
-
isValid: boolean;
|
|
16
|
-
}): void;
|
|
17
|
-
}
|
|
18
|
-
export declare const Form: React.ForwardRefExoticComponent<FormProps & React.RefAttributes<FormRef>>;
|
package/dist/Form/index.cjs
DELETED
package/dist/Form/index.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { Form, type FormRef } from "./Form";
|
package/dist/Form/index.mjs
DELETED
package/dist/Form-cjs.js
DELETED
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var tslib_es6 = require('./tslib.es6-cjs.js');
|
|
4
|
-
var React = require('react');
|
|
5
|
-
var reactHookForm = require('react-hook-form');
|
|
6
|
-
|
|
7
|
-
const Form = React.forwardRef(function InternalForm({ onSubmit, children, onStateChange }, ref) {
|
|
8
|
-
const methods = reactHookForm.useForm({
|
|
9
|
-
mode: "onTouched",
|
|
10
|
-
});
|
|
11
|
-
const { trigger, handleSubmit, formState: { isDirty, isValid }, } = methods;
|
|
12
|
-
React.useEffect(() => onStateChange && onStateChange({ isDirty, isValid }), [isDirty, isValid]);
|
|
13
|
-
React.useImperativeHandle(ref, () => ({
|
|
14
|
-
/**
|
|
15
|
-
* The `trigger()` method can also accept an array
|
|
16
|
-
* of fields to validate. We may at some point want
|
|
17
|
-
* to consider adding a `validate()` method to the
|
|
18
|
-
* `Form` component.
|
|
19
|
-
*/
|
|
20
|
-
submit: () => tslib_es6.__awaiter(this, void 0, void 0, function* () {
|
|
21
|
-
const valid = yield trigger(undefined, { shouldFocus: true });
|
|
22
|
-
if (valid) {
|
|
23
|
-
submitHandler();
|
|
24
|
-
}
|
|
25
|
-
}),
|
|
26
|
-
}));
|
|
27
|
-
/**
|
|
28
|
-
* If an onSubmit is not passed into a form, it will only be used
|
|
29
|
-
* for validation. For that, we do not need to wrap it in a <form>
|
|
30
|
-
* tag. This allows the <Form> component to be used in legacy code.
|
|
31
|
-
*/
|
|
32
|
-
const Wrapper = onSubmit ? "form" : "div";
|
|
33
|
-
const formProps = {
|
|
34
|
-
onSubmit: onSubmit && handleSubmit(submitHandler),
|
|
35
|
-
};
|
|
36
|
-
return (React.createElement(reactHookForm.FormProvider, Object.assign({}, methods),
|
|
37
|
-
React.createElement(Wrapper, Object.assign({}, formProps, { "data-testid": "atlantis-form" }), children)));
|
|
38
|
-
function submitHandler() {
|
|
39
|
-
onSubmit && onSubmit();
|
|
40
|
-
}
|
|
41
|
-
});
|
|
42
|
-
|
|
43
|
-
exports.Form = Form;
|
package/dist/Form-es.js
DELETED
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import { a as __awaiter } from './tslib.es6-es.js';
|
|
2
|
-
import React__default, { forwardRef, useEffect, useImperativeHandle } from 'react';
|
|
3
|
-
import { useForm, FormProvider } from 'react-hook-form';
|
|
4
|
-
|
|
5
|
-
const Form = forwardRef(function InternalForm({ onSubmit, children, onStateChange }, ref) {
|
|
6
|
-
const methods = useForm({
|
|
7
|
-
mode: "onTouched",
|
|
8
|
-
});
|
|
9
|
-
const { trigger, handleSubmit, formState: { isDirty, isValid }, } = methods;
|
|
10
|
-
useEffect(() => onStateChange && onStateChange({ isDirty, isValid }), [isDirty, isValid]);
|
|
11
|
-
useImperativeHandle(ref, () => ({
|
|
12
|
-
/**
|
|
13
|
-
* The `trigger()` method can also accept an array
|
|
14
|
-
* of fields to validate. We may at some point want
|
|
15
|
-
* to consider adding a `validate()` method to the
|
|
16
|
-
* `Form` component.
|
|
17
|
-
*/
|
|
18
|
-
submit: () => __awaiter(this, void 0, void 0, function* () {
|
|
19
|
-
const valid = yield trigger(undefined, { shouldFocus: true });
|
|
20
|
-
if (valid) {
|
|
21
|
-
submitHandler();
|
|
22
|
-
}
|
|
23
|
-
}),
|
|
24
|
-
}));
|
|
25
|
-
/**
|
|
26
|
-
* If an onSubmit is not passed into a form, it will only be used
|
|
27
|
-
* for validation. For that, we do not need to wrap it in a <form>
|
|
28
|
-
* tag. This allows the <Form> component to be used in legacy code.
|
|
29
|
-
*/
|
|
30
|
-
const Wrapper = onSubmit ? "form" : "div";
|
|
31
|
-
const formProps = {
|
|
32
|
-
onSubmit: onSubmit && handleSubmit(submitHandler),
|
|
33
|
-
};
|
|
34
|
-
return (React__default.createElement(FormProvider, Object.assign({}, methods),
|
|
35
|
-
React__default.createElement(Wrapper, Object.assign({}, formProps, { "data-testid": "atlantis-form" }), children)));
|
|
36
|
-
function submitHandler() {
|
|
37
|
-
onSubmit && onSubmit();
|
|
38
|
-
}
|
|
39
|
-
});
|
|
40
|
-
|
|
41
|
-
export { Form as F };
|