@forge/react 10.0.0-next.3 → 10.0.0-next.4-experimental-5e2eb7f

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 (37) hide show
  1. package/CHANGELOG.md +173 -0
  2. package/out/__test__/hostConfig.test.js +0 -2
  3. package/out/__test__/inline.test.js +1 -1
  4. package/out/__test__/reconciler.test.js +39 -70
  5. package/out/__test__/stack.test.js +1 -1
  6. package/out/__test__/testUtils.d.ts.map +1 -1
  7. package/out/components.d.ts +19 -37
  8. package/out/components.d.ts.map +1 -1
  9. package/out/components.js +6 -36
  10. package/out/hooks/__test__/useForm.test.d.ts +2 -0
  11. package/out/hooks/__test__/useForm.test.d.ts.map +1 -0
  12. package/out/hooks/__test__/useForm.test.js +36 -0
  13. package/out/hooks/useForm.d.ts +34 -0
  14. package/out/hooks/useForm.d.ts.map +1 -0
  15. package/out/hooks/useForm.js +75 -0
  16. package/out/index.d.ts +2 -0
  17. package/out/index.d.ts.map +1 -1
  18. package/out/index.js +4 -1
  19. package/out/package-types.d.ts +23 -0
  20. package/out/package-types.d.ts.map +1 -0
  21. package/out/package-types.js +5 -0
  22. package/out/reconciler.d.ts +2 -11
  23. package/out/reconciler.d.ts.map +1 -1
  24. package/out/reconciler.js +21 -64
  25. package/out/types/icons.d.ts +1 -1
  26. package/out/types/icons.d.ts.map +1 -1
  27. package/out/uikit2-components.d.ts +54 -0
  28. package/out/uikit2-components.d.ts.map +1 -0
  29. package/out/uikit2-components.js +53 -0
  30. package/package.json +7 -7
  31. package/tsconfig.tsbuildinfo +1 -1
  32. package/out/__test__/defaultReconciler.test.d.ts +0 -2
  33. package/out/__test__/defaultReconciler.test.d.ts.map +0 -1
  34. package/out/__test__/defaultReconciler.test.js +0 -51
  35. package/out/__test__/table.test.d.ts +0 -2
  36. package/out/__test__/table.test.d.ts.map +0 -1
  37. package/out/__test__/table.test.js +0 -23
package/CHANGELOG.md CHANGED
@@ -1,5 +1,178 @@
1
1
  # @forge/react
2
2
 
3
+ ## 10.0.0-next.4-experimental-5e2eb7f
4
+
5
+ ### Major Changes
6
+
7
+ - e4eccf1: UI Kit 2 now supports the following components:
8
+
9
+ - Badge
10
+ - Box
11
+ - Button
12
+ - ButtonGroup
13
+ - Checkbox
14
+ - Code
15
+ - CodeBlock
16
+ - DatePicker
17
+ - DynamicTable
18
+ - ErrorMessage
19
+ - Heading
20
+ - HelperMessage
21
+ - Inline
22
+ - Label
23
+ - Lozenge
24
+ - LinkButton
25
+ - Modal
26
+ - ModalHeader
27
+ - ModalBody
28
+ - ModalFooter
29
+ - ModalTitle
30
+ - ModalTransition
31
+ - ProgressBar
32
+ - ProgressTracker
33
+ - Radio
34
+ - RadioGroup
35
+ - Range
36
+ - SectionMessage
37
+ - SectionMessageAction
38
+ - Spinner
39
+ - Stack
40
+ - Tabs
41
+ - Tab
42
+ - TabList
43
+ - TabPanel
44
+ - Tag
45
+ - TagGroup
46
+ - Form
47
+ - FormHeader
48
+ - FormFooter
49
+ - FormSection
50
+ - Tooltip
51
+ - TextArea
52
+ - Textfield
53
+ - Toggle
54
+ - ValidMessage
55
+ - LoadingButton
56
+ - Select
57
+ - Icon
58
+ - User
59
+ - UserGroup
60
+ - UserPicker
61
+ - Image
62
+ - Text
63
+ - Link
64
+
65
+ A new `useForm` hook has been added for form state management.
66
+
67
+ Existing components have gone through API changes and will need to be updated when used in this version of `@forge/react`.
68
+ For more details of the existing and new component APIs and their capabilities, view our component documentation [here](https://developer.atlassian.com/platform/forge/ui-kit/components/).
69
+
70
+ ### Patch Changes
71
+
72
+ - 7873622: Patch fix to resolve versioning issue
73
+
74
+ ## 10.0.0-next.4
75
+
76
+ ### Patch Changes
77
+
78
+ - 7873622: Patch fix to resolve versioning issue
79
+
80
+ ## 10.0.0-next.0
81
+
82
+ ### Major Changes
83
+
84
+ - e4eccf1: UI Kit 2 now supports the following components:
85
+
86
+ - Badge
87
+ - Box
88
+ - Button
89
+ - ButtonGroup
90
+ - Checkbox
91
+ - Code
92
+ - CodeBlock
93
+ - DatePicker
94
+ - DynamicTable
95
+ - ErrorMessage
96
+ - Heading
97
+ - HelperMessage
98
+ - Inline
99
+ - Label
100
+ - Lozenge
101
+ - LinkButton
102
+ - Modal
103
+ - ModalHeader
104
+ - ModalBody
105
+ - ModalFooter
106
+ - ModalTitle
107
+ - ModalTransition
108
+ - ProgressBar
109
+ - ProgressTracker
110
+ - Radio
111
+ - RadioGroup
112
+ - Range
113
+ - SectionMessage
114
+ - SectionMessageAction
115
+ - Spinner
116
+ - Stack
117
+ - Tabs
118
+ - Tab
119
+ - TabList
120
+ - TabPanel
121
+ - Tag
122
+ - TagGroup
123
+ - Form
124
+ - FormHeader
125
+ - FormFooter
126
+ - FormSection
127
+ - Tooltip
128
+ - TextArea
129
+ - Textfield
130
+ - Toggle
131
+ - ValidMessage
132
+ - LoadingButton
133
+ - Select
134
+ - Icon
135
+ - User
136
+ - UserGroup
137
+ - UserPicker
138
+ - Image
139
+ - Text
140
+ - Link
141
+
142
+ A new `useForm` hook has been added for form state management.
143
+
144
+ Existing components have gone through API changes and will need to be updated when used in this version of `@forge/react`.
145
+ For more details of the existing and new component APIs and their capabilities, view our component documentation [here](https://developer.atlassian.com/platform/forge/ui-kit/components/).
146
+
147
+ ## 9.3.0
148
+
149
+ ### Minor Changes
150
+
151
+ - 428a4b4: Correct version to apply changes to peer dependencies
152
+
153
+ ## 9.3.0-next.0
154
+
155
+ ### Minor Changes
156
+
157
+ - 428a4b4: Correct version to apply changes to peer dependencies
158
+
159
+ ## 9.2.0
160
+
161
+ ### Minor Changes
162
+
163
+ - 0c49f46: Removes @forge/bridge and @forge/ui peer dependencies. These packages are not required.
164
+
165
+ ### Patch Changes
166
+
167
+ - Updated dependencies [d36502b]
168
+ - @forge/bridge@3.3.0
169
+
170
+ ## 9.2.0-next.5
171
+
172
+ ### Minor Changes
173
+
174
+ - 0c49f46: Removes @forge/bridge and @forge/ui peer dependencies. These packages are not required.
175
+
3
176
  ## 10.0.0-next.3
4
177
 
5
178
  ### Patch Changes
@@ -4,7 +4,6 @@ let keyCount = 0;
4
4
  jest.mock('uuid', () => (Object.assign(Object.assign({}, jest.requireActual('uuid')), { v4: () => `${keyCount++}` })));
5
5
  const reconciler_1 = require("../reconciler");
6
6
  const testUtils_1 = require("./testUtils");
7
- reconciler_1.ReconciliationCounter.getInstance(false);
8
7
  const emptyForgeDoc = (0, reconciler_1.createElement)({ type: 'root', props: {} });
9
8
  describe('hostConfig used functions', () => {
10
9
  let bridgeCalls = [];
@@ -70,7 +69,6 @@ describe('hostConfig used functions', () => {
70
69
  expect(reconciler_1.hostConfig.prepareUpdate(instance, 'test', {}, newProps, emptyForgeDoc, null)).toBe(newProps);
71
70
  expect(instance).not.toHaveProperty('oldProps');
72
71
  expect(instance).toHaveProperty('props', newProps);
73
- expect(instance).toHaveProperty('reconciliationCount', 2);
74
72
  });
75
73
  it('shouldSetTextContent returns false', () => {
76
74
  expect(reconciler_1.hostConfig.shouldSetTextContent('test', {})).toBe(false);
@@ -13,7 +13,7 @@ describe('reconciled output', () => {
13
13
  });
14
14
  it('renders Inline ForgeDoc', async () => {
15
15
  const Test = () => {
16
- return ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsxs)(components_1.Inline, Object.assign({ grow: "fill", space: "space.500" }, { children: [(0, jsx_runtime_1.jsxs)(components_1.Inline, Object.assign({ grow: "hug", alignInline: "start", space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, { children: "Hug" }), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "grey-light" }, { children: "1" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "blue-light" }, { children: "2" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "green-light" }, { children: "3" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "red" }, { children: "Really looooooooooooooooooong tag" })), (0, jsx_runtime_1.jsx)(components_1.Button, Object.assign({ appearance: "primary", onClick: jest.fn() }, { children: "Button" }))] })), (0, jsx_runtime_1.jsxs)(components_1.Inline, Object.assign({ grow: "fill", alignInline: "start", space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, { children: "Fill" }), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "grey-light" }, { children: "1" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "blue-light" }, { children: "2" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "green-light" }, { children: "3" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "red" }, { children: "Really looooooooooooooooooong tag" })), (0, jsx_runtime_1.jsx)(components_1.Button, Object.assign({ appearance: "primary", onClick: jest.fn() }, { children: "Button" }))] }))] })) }));
16
+ return ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsxs)(components_1.Inline, Object.assign({ space: "space.500" }, { children: [(0, jsx_runtime_1.jsxs)(components_1.Inline, Object.assign({ alignInline: "start", space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, Object.assign({ as: "h3" }, { children: "Hug" })), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greyLight", text: "1" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "blueLight", text: "2" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greenLight", text: "3" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "red", text: "Really looooooooooooooooooong" }), (0, jsx_runtime_1.jsx)(components_1.Button, Object.assign({ appearance: "primary", onClick: jest.fn() }, { children: "Button" }))] })), (0, jsx_runtime_1.jsxs)(components_1.Inline, Object.assign({ alignInline: "start", space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, Object.assign({ as: "h3" }, { children: "Fill" })), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greyLight", text: "1" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "blueLight", text: "2" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greenLight", text: "3" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "red", text: "Really looooooooooooooooooong" }), (0, jsx_runtime_1.jsx)(components_1.Button, Object.assign({ appearance: "primary", onClick: jest.fn() }, { children: "Button" }))] }))] })) }));
17
17
  };
18
18
  await reconcilerTestRenderer_1.default.create((0, jsx_runtime_1.jsx)(Test, {}));
19
19
  const forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
@@ -4,14 +4,16 @@ const tslib_1 = require("tslib");
4
4
  const jsx_runtime_1 = require("react/jsx-runtime");
5
5
  let keyCount = 0;
6
6
  jest.mock('uuid', () => (Object.assign(Object.assign({}, jest.requireActual('uuid')), { v4: () => `${keyCount++}` })));
7
+ const resetKeyCount = () => {
8
+ keyCount = 0;
9
+ };
7
10
  const react_1 = tslib_1.__importStar(require("react"));
8
11
  const reconcilerTestRenderer_1 = tslib_1.__importDefault(require("./reconcilerTestRenderer"));
9
12
  const components_1 = require("../components");
10
13
  const get_1 = tslib_1.__importDefault(require("lodash/get"));
11
14
  const testUtils_1 = require("./testUtils");
12
- const reconciler_1 = require("../reconciler");
13
- reconciler_1.ReconciliationCounter.getInstance(false);
14
- describe('Reconciliation counting', () => {
15
+ describe('Reconcilation', () => {
16
+ resetKeyCount();
15
17
  let bridgeCalls = [];
16
18
  const TEXT = 0;
17
19
  const BUTTON = 1;
@@ -21,32 +23,27 @@ describe('Reconciliation counting', () => {
21
23
  bridgeCalls = (0, testUtils_1.setupBridge)();
22
24
  const Test = () => {
23
25
  const [bool, setBool] = (0, react_1.useState)(false);
24
- return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.Text, { children: !bool ? 'Loading...' : 'Now loaded...' }), (0, jsx_runtime_1.jsx)(components_1.Button, Object.assign({ onClick: () => setBool(true) }, { children: "Click" })), (0, jsx_runtime_1.jsx)(components_1.StatusLozenge, Object.assign({ appearance: "inprogress" }, { children: "Test" }))] }));
26
+ return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.Text, { children: !bool ? 'Loading...' : 'Now loaded...' }), (0, jsx_runtime_1.jsx)(components_1.Button, Object.assign({ onClick: () => setBool(true) }, { children: "Click" })), (0, jsx_runtime_1.jsx)(components_1.Lozenge, Object.assign({ appearance: "inprogress" }, { children: "Test" }))] }));
25
27
  };
28
+ resetKeyCount();
26
29
  await reconcilerTestRenderer_1.default.create((0, jsx_runtime_1.jsx)(Test, {}));
27
30
  });
28
- it('initial reconcilation output is correct', () => {
31
+ it('forgeDoc is created on initial render', () => {
29
32
  const forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
30
- expect(forgeDoc).toHaveProperty('reconciliationCount', 1);
31
33
  expect(forgeDoc).toHaveProperty(`children[${TEXT}].type`, 'Text');
32
- expect(forgeDoc).toHaveProperty(`children[${TEXT}].reconciliationCount`, 1);
33
34
  expect(forgeDoc).toHaveProperty(`children[${BUTTON}].type`, 'Button');
34
- expect(forgeDoc).toHaveProperty(`children[${BUTTON}].reconciliationCount`, 1);
35
- expect(forgeDoc).toHaveProperty(`children[${STATIC_TEXT}].type`, 'StatusLozenge');
36
- expect(forgeDoc).toHaveProperty(`children[${STATIC_TEXT}].reconciliationCount`, 1);
35
+ expect(forgeDoc).toHaveProperty(`children[${STATIC_TEXT}].type`, 'Lozenge');
36
+ expect(forgeDoc).toMatchSnapshot();
37
37
  });
38
- it('calling the button click handler triggers reconciliation', () => {
38
+ it('forgeDoc is updated on state update', () => {
39
39
  let forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
40
40
  const onClick = (0, get_1.default)(forgeDoc, `children[${BUTTON}].props.onClick`);
41
41
  expect(onClick).not.toBeUndefined();
42
42
  onClick();
43
43
  forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
44
- expect(forgeDoc).toHaveProperty('reconciliationCount', 2);
45
- expect(forgeDoc).toHaveProperty(`children[${TEXT}].reconciliationCount`, 1);
46
44
  expect(forgeDoc).toHaveProperty(`children[${TEXT}].children[${STRING}].type`, 'String');
47
- expect(forgeDoc).toHaveProperty(`children[${TEXT}].children[${STRING}].reconciliationCount`, 2);
48
- expect(forgeDoc).toHaveProperty(`children[${BUTTON}].reconciliationCount`, 2);
49
- expect(forgeDoc).toHaveProperty(`children[${STATIC_TEXT}].reconciliationCount`, 1);
45
+ expect(forgeDoc).toHaveProperty(`children[${TEXT}].children[${STRING}].props.text`, 'Now loaded...');
46
+ expect(forgeDoc).toMatchSnapshot();
50
47
  });
51
48
  });
52
49
  describe('deep tree reconciliation', () => {
@@ -60,6 +57,7 @@ describe('deep tree reconciliation', () => {
60
57
  }
61
58
  return ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsxs)(components_1.Inline, { children: [(0, jsx_runtime_1.jsx)(components_1.Stack, { children: (0, jsx_runtime_1.jsx)(components_1.Text, { children: count }) }), (0, jsx_runtime_1.jsxs)(components_1.Stack, { children: [(0, jsx_runtime_1.jsx)(components_1.Text, { children: "Should not update" }), (0, jsx_runtime_1.jsx)(components_1.Button, Object.assign({ onClick: incrementCount }, { children: "Click" }))] })] }) }));
62
59
  };
60
+ resetKeyCount();
63
61
  await reconcilerTestRenderer_1.default.create((0, jsx_runtime_1.jsx)(Test, {}));
64
62
  });
65
63
  it('should match the initially rendered ForgeDoc snaphot', () => {
@@ -70,77 +68,48 @@ describe('deep tree reconciliation', () => {
70
68
  var _a, _b;
71
69
  let forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
72
70
  expect(forgeDoc).not.toBeNull();
73
- const button = (0, testUtils_1.findElementInForgeDoc)(forgeDoc, '14');
71
+ const button = (0, testUtils_1.findElementInForgeDoc)(forgeDoc, '7');
74
72
  expect(button).not.toBeUndefined();
75
73
  expect((_a = button === null || button === void 0 ? void 0 : button.props) === null || _a === void 0 ? void 0 : _a.onClick).not.toBeUndefined();
76
74
  (_b = button === null || button === void 0 ? void 0 : button.props) === null || _b === void 0 ? void 0 : _b.onClick();
77
75
  forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
78
76
  expect(forgeDoc).toMatchSnapshot();
79
77
  });
80
- it('should set accurate reconciliation counts for updated text and string components', () => {
81
- const forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
82
- expect(forgeDoc).not.toBeNull();
83
- const textComponent = (0, testUtils_1.findElementInForgeDoc)(forgeDoc, '9');
84
- expect(textComponent).not.toBeUndefined();
85
- expect(textComponent === null || textComponent === void 0 ? void 0 : textComponent.reconciliationCount).toBe(3);
86
- const stringComponent = (0, testUtils_1.findElementInForgeDoc)(forgeDoc, '8');
87
- expect(stringComponent).not.toBeUndefined();
88
- expect(stringComponent === null || stringComponent === void 0 ? void 0 : stringComponent.reconciliationCount).toBe(4);
78
+ });
79
+ describe('macro config', () => {
80
+ it('should create forgeDoc tree for macro config', async () => {
81
+ const bridgeCalls = (0, testUtils_1.setupBridge)();
82
+ const App = () => {
83
+ return ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsx)(components_1.Text, { children: "Hello World" }) }));
84
+ };
85
+ const Config = () => {
86
+ return (0, jsx_runtime_1.jsx)(components_1.Textfield, { name: "age" });
87
+ };
88
+ await reconcilerTestRenderer_1.default.create((0, jsx_runtime_1.jsx)(App, {}));
89
+ await reconcilerTestRenderer_1.default.addConfig((0, jsx_runtime_1.jsx)(Config, {}));
90
+ const configForgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
91
+ expect(configForgeDoc === null || configForgeDoc === void 0 ? void 0 : configForgeDoc.type).toEqual('MacroConfig');
92
+ expect(configForgeDoc === null || configForgeDoc === void 0 ? void 0 : configForgeDoc.children[0].type).toEqual('Textfield');
89
93
  });
90
94
  });
91
- describe('swapping component type with same props', () => {
95
+ describe('id props', () => {
92
96
  let bridgeCalls = [];
93
97
  beforeAll(async () => {
94
98
  bridgeCalls = (0, testUtils_1.setupBridge)();
95
99
  const Test = () => {
96
- const [bool, setBool] = (0, react_1.useState)(false);
97
- return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [bool ? (0, jsx_runtime_1.jsx)(components_1.Text, { children: "Text" }) : (0, jsx_runtime_1.jsx)(components_1.Heading, Object.assign({ size: "medium" }, { children: "Text" })), (0, jsx_runtime_1.jsx)(components_1.Button, Object.assign({ onClick: () => setBool(!bool) }, { children: "Click" }))] }));
100
+ return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.Label, Object.assign({ labelFor: "username" }, { children: "username" })), (0, jsx_runtime_1.jsx)(components_1.Textfield, { id: "username", placeholder: "name" }), (0, jsx_runtime_1.jsx)(components_1.DatePicker, { id: "datepicker", placeholder: "date" })] }));
98
101
  };
99
102
  await reconcilerTestRenderer_1.default.create((0, jsx_runtime_1.jsx)(Test, {}));
100
103
  });
101
- it('should match the initially rendered ForgeDoc snaphot', () => {
104
+ it('should contain a prefix', () => {
102
105
  const forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
103
- expect(forgeDoc).toMatchSnapshot();
104
- });
105
- it('should match snapshot after triggering update', () => {
106
- var _a, _b;
107
- let forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
108
- expect(forgeDoc).not.toBeNull();
109
- if (forgeDoc !== null) {
110
- const button = (0, testUtils_1.findElementInForgeDoc)(forgeDoc, '21');
111
- expect(button).not.toBeUndefined();
112
- expect((_a = button === null || button === void 0 ? void 0 : button.props) === null || _a === void 0 ? void 0 : _a.onClick).not.toBeUndefined();
113
- (_b = button === null || button === void 0 ? void 0 : button.props) === null || _b === void 0 ? void 0 : _b.onClick();
114
- forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
115
- expect(forgeDoc).toMatchSnapshot();
116
- }
106
+ expect(forgeDoc).toHaveProperty('children[0].props.labelFor', 'forge-app-0-username');
107
+ expect(forgeDoc).toHaveProperty('children[1].props.id', 'forge-app-0-username');
108
+ expect(forgeDoc).toHaveProperty('children[2].props.id', 'forge-app-0-datepicker');
117
109
  });
118
- it('should set accurate reconciliation counts for swapped in text and string components', () => {
110
+ it('should still contain other props', () => {
119
111
  const forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
120
- expect(forgeDoc).not.toBeNull();
121
- if (forgeDoc !== null) {
122
- const textComponent = (0, testUtils_1.findElementInForgeDoc)(forgeDoc, '23');
123
- expect(textComponent).not.toBeUndefined();
124
- expect(textComponent === null || textComponent === void 0 ? void 0 : textComponent.reconciliationCount).toBe(6);
125
- const stringComponent = (0, testUtils_1.findElementInForgeDoc)(forgeDoc, '22');
126
- expect(stringComponent).not.toBeUndefined();
127
- expect(stringComponent === null || stringComponent === void 0 ? void 0 : stringComponent.reconciliationCount).toBe(6);
128
- }
129
- });
130
- describe('macro config', () => {
131
- it('should create forgeDoc tree for macro config', async () => {
132
- const bridgeCalls = (0, testUtils_1.setupBridge)();
133
- const App = () => {
134
- return ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsx)(components_1.Text, { children: "Hello World" }) }));
135
- };
136
- const Config = () => {
137
- return (0, jsx_runtime_1.jsx)(components_1.TextField, { name: "age", label: "Age" });
138
- };
139
- await reconcilerTestRenderer_1.default.create((0, jsx_runtime_1.jsx)(App, {}));
140
- await reconcilerTestRenderer_1.default.addConfig((0, jsx_runtime_1.jsx)(Config, {}));
141
- const configForgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
142
- expect(configForgeDoc === null || configForgeDoc === void 0 ? void 0 : configForgeDoc.type).toEqual('MacroConfig');
143
- expect(configForgeDoc === null || configForgeDoc === void 0 ? void 0 : configForgeDoc.children[0].type).toEqual('TextField');
144
- });
112
+ expect(forgeDoc).toHaveProperty('children[1].props.placeholder', 'name');
113
+ expect(forgeDoc).toHaveProperty('children[2].props.placeholder', 'date');
145
114
  });
146
115
  });
@@ -13,7 +13,7 @@ describe('reconciled output', () => {
13
13
  });
14
14
  it('renders Stack ForgeDoc', async () => {
15
15
  const Test = () => {
16
- return ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.200" }, { children: [(0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, Object.assign({ size: "small" }, { children: "default align" })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "grey-light" }, { children: "1" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "blue-light" }, { children: "2" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "green-light" }, { children: "3" }))] }))] })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, Object.assign({ size: "small" }, { children: "start align" })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100", alignInline: "start" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "grey-light" }, { children: "1" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "blue-light" }, { children: "2" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "green-light" }, { children: "3" }))] }))] })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, Object.assign({ size: "small" }, { children: "center align" })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100", alignInline: "center" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "grey-light" }, { children: "1" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "blue-light" }, { children: "2" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "green-light" }, { children: "3" }))] }))] })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, Object.assign({ size: "small" }, { children: "end align" })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100", alignInline: "end" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "grey-light" }, { children: "1" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "blue-light" }, { children: "2" })), (0, jsx_runtime_1.jsx)(components_1.Tag, Object.assign({ color: "green-light" }, { children: "3" }))] }))] }))] })) }));
16
+ return ((0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.200" }, { children: [(0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, Object.assign({ as: "h3" }, { children: "default align" })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greyLight", text: "1" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "blueLight", text: "2" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greenLight", text: "3" })] }))] })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, Object.assign({ as: "h3" }, { children: "start align" })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100", alignInline: "start" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greyLight", text: "1" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "blueLight", text: "2" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greenLight", text: "3" })] }))] })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, Object.assign({ as: "h3" }, { children: "center align" })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100", alignInline: "center" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greyLight", text: "1" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "blueLight", text: "2" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greenLight", text: "3" })] }))] })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Heading, Object.assign({ as: "h3" }, { children: "end align" })), (0, jsx_runtime_1.jsxs)(components_1.Stack, Object.assign({ space: "space.100", alignInline: "end" }, { children: [(0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greyLight", text: "1" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "blueLight", text: "2" }), (0, jsx_runtime_1.jsx)(components_1.Tag, { color: "greenLight", text: "3" })] }))] }))] })) }));
17
17
  };
18
18
  await reconcilerTestRenderer_1.default.create((0, jsx_runtime_1.jsx)(Test, {}));
19
19
  const forgeDoc = (0, testUtils_1.getLastBridgeCallForgeDoc)(bridgeCalls);
@@ -1 +1 @@
1
- {"version":3,"file":"testUtils.d.ts","sourceRoot":"","sources":["../../src/__test__/testUtils.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEpC,oBAAY,UAAU,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,cAAc,CAAA;CAAE,CAAC;AAC/D,aAAK,WAAW,GAAG,MAAM,UAAU,EAAE,CAAC;AAEtC,aAAK,iBAAiB,GAAG,CAAC,WAAW,EAAE,UAAU,EAAE,KAAK,UAAU,GAAG,IAAI,CAAC;AAC1E,aAAK,yBAAyB,GAAG,CAAC,WAAW,EAAE,UAAU,EAAE,KAAK,QAAQ,GAAG,IAAI,CAAC;AAChF,aAAK,qBAAqB,GAAG,CAAC,QAAQ,EAAE,QAAQ,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,QAAQ,GAAG,SAAS,CAAC;AAE9F,aAAK,cAAc,GAAG;IACpB,QAAQ,EAAE,QAAQ,CAAC;CACpB,CAAC;AAMF,eAAO,MAAM,WAAW,EAAE,WAYzB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,iBAK/B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,yBAMvC,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,qBAkBnC,CAAC"}
1
+ {"version":3,"file":"testUtils.d.ts","sourceRoot":"","sources":["../../src/__test__/testUtils.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEpC,oBAAY,UAAU,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,cAAc,CAAA;CAAE,CAAC;AAC/D,aAAK,WAAW,GAAG,MAAM,UAAU,EAAE,CAAC;AAEtC,aAAK,iBAAiB,GAAG,CAAC,WAAW,EAAE,UAAU,EAAE,KAAK,UAAU,GAAG,IAAI,CAAC;AAC1E,aAAK,yBAAyB,GAAG,CAAC,WAAW,EAAE,UAAU,EAAE,KAAK,QAAQ,GAAG,IAAI,CAAC;AAChF,aAAK,qBAAqB,GAAG,CAAC,QAAQ,EAAE,QAAQ,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,QAAQ,GAAG,SAAS,CAAC;AAE9F,aAAK,cAAc,GAAG;IACpB,QAAQ,EAAE,QAAQ,CAAC;CACpB,CAAC;AAMF,eAAO,MAAM,WAAW,EAAE,WAYzB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,iBAK/B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,yBAMvC,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,qBAkBnC,CAAC"}
@@ -1,46 +1,28 @@
1
- import { ButtonSetProps, CellProps, DateLozengeProps, ForgeElement, FormData, FormProps, HeadProps, HeadingProps, InlineDialogProps, MarkupProps, ModalDialogProps, NativeButtonProps as ButtonProps, NativeCheckboxGroupProps as CheckboxGroupProps, NativeCheckboxProps as CheckboxProps, NativeDatePickerProps as DatePickerProps, NativeImageProps as ImageProps, NativeInlineProps as InlineProps, NativeLinkProps as LinkProps, NativeRadioGroupProps as RadioGroupProps, NativeRangeProps as RangeProps, NativeSelectProps as SelectProps, NativeStackProps as StackProps, NativeTextAreaProps as TextAreaProps, NativeTextFieldProps as TextFieldProps, NativeTextProps as TextProps, NativeToggleProps as ToggleProps, NativeUserPickerProps as UserPickerProps, NativeBadgeProps as BadgeProps, OptionProps, RadioProps, RowProps, SectionMessageProps, TabProps, TableProps, TabsProps, TagGroupProps, TooltipProps, UserGroupProps, UserProps } from './types';
2
- import { NativeCodeProps, NativeStatusLozengeProps, NativeTagProps } from './types';
1
+ import { ForgeElement, MarkupProps, NativeImageProps as ImageProps, NativeLinkProps as LinkProps, NativeTextProps as TextProps, NativeUserPickerProps as UserPickerProps, UserGroupProps, UserProps } from './types';
3
2
  export { UserPickerValue } from './types';
4
- export declare const Button: (props: ButtonProps) => ForgeElement;
5
- export declare const Checkbox: (props: CheckboxProps) => ForgeElement;
6
- export declare const CheckboxGroup: (props: CheckboxGroupProps) => ForgeElement;
7
- export declare const DatePicker: (props: DatePickerProps) => ForgeElement;
8
- export declare const Form: <T extends FormData>(props: FormProps<T>) => ForgeElement;
9
3
  export declare const Image: (props: ImageProps) => ForgeElement;
10
- export declare const Inline: (props: InlineProps) => ForgeElement;
11
4
  export declare const Link: (props: LinkProps) => ForgeElement;
12
- export declare const ModalDialog: (props: ModalDialogProps) => ForgeElement;
13
- export declare const RadioGroup: (props: RadioGroupProps) => ForgeElement;
14
- export declare const Range: (props: RangeProps) => ForgeElement;
15
- export declare const Select: (props: SelectProps) => ForgeElement;
16
- export declare const Stack: (props: StackProps) => ForgeElement;
17
5
  export declare const Text: (props: TextProps) => ForgeElement;
18
- export declare const TextArea: (props: TextAreaProps) => ForgeElement;
19
- export declare const TextField: (props: TextFieldProps) => ForgeElement;
20
- export declare const Toggle: (props: ToggleProps) => ForgeElement;
21
6
  export declare const UserPicker: (props: UserPickerProps) => ForgeElement;
22
- export declare const Badge: (props: BadgeProps) => ForgeElement;
23
- export declare const ButtonSet: (props: ButtonSetProps) => ForgeElement;
24
- export declare const Code: (props: NativeCodeProps) => ForgeElement;
25
- export declare const DateLozenge: (props: DateLozengeProps) => ForgeElement;
26
- export declare const Heading: (props: HeadingProps) => ForgeElement;
27
- export declare const InlineDialog: (props: InlineDialogProps) => ForgeElement;
28
- export declare const Option: (props: OptionProps) => ForgeElement;
29
- export declare const Radio: (props: RadioProps) => ForgeElement;
30
- export declare const SectionMessage: (props: SectionMessageProps) => ForgeElement;
31
- export declare const StatusLozenge: (props: NativeStatusLozengeProps) => ForgeElement;
32
- export declare const Tooltip: (props: TooltipProps) => ForgeElement;
7
+ export declare const User: (props: UserProps) => ForgeElement;
8
+ export declare const UserGroup: (props: UserGroupProps) => ForgeElement;
33
9
  export declare const Em: (props: MarkupProps) => ForgeElement;
34
10
  export declare const Strike: (props: MarkupProps) => ForgeElement;
35
11
  export declare const Strong: (props: MarkupProps) => ForgeElement;
36
- export declare const Tab: (props: TabProps) => ForgeElement;
37
- export declare const Tabs: (props: TabsProps) => ForgeElement;
38
- export declare const Cell: (props: CellProps) => ForgeElement;
39
- export declare const Head: (props: HeadProps) => ForgeElement;
40
- export declare const Row: (props: RowProps) => ForgeElement;
41
- export declare const Table: (props: TableProps) => ForgeElement;
42
- export declare const Tag: (props: NativeTagProps) => ForgeElement;
43
- export declare const TagGroup: (props: TagGroupProps) => ForgeElement;
44
- export declare const User: (props: UserProps) => ForgeElement;
45
- export declare const UserGroup: (props: UserGroupProps) => ForgeElement;
12
+ export * from './uikit2-components';
13
+ declare type CheckboxGroupProps = {
14
+ name: string;
15
+ label?: string;
16
+ description?: string;
17
+ isRequired?: boolean;
18
+ items?: {
19
+ label: string;
20
+ value: string;
21
+ }[];
22
+ defaultValue?: {
23
+ label: string;
24
+ value: string;
25
+ }[];
26
+ };
27
+ export declare const CheckboxGroup: (props: CheckboxGroupProps) => ForgeElement;
46
28
  //# sourceMappingURL=components.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../src/components.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,SAAS,EACT,gBAAgB,EAChB,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,SAAS,EACT,YAAY,EACZ,iBAAiB,EACjB,WAAW,EACX,gBAAgB,EAChB,iBAAiB,IAAI,WAAW,EAChC,wBAAwB,IAAI,kBAAkB,EAC9C,mBAAmB,IAAI,aAAa,EACpC,qBAAqB,IAAI,eAAe,EACxC,gBAAgB,IAAI,UAAU,EAC9B,iBAAiB,IAAI,WAAW,EAChC,eAAe,IAAI,SAAS,EAC5B,qBAAqB,IAAI,eAAe,EACxC,gBAAgB,IAAI,UAAU,EAC9B,iBAAiB,IAAI,WAAW,EAChC,gBAAgB,IAAI,UAAU,EAC9B,mBAAmB,IAAI,aAAa,EACpC,oBAAoB,IAAI,cAAc,EACtC,eAAe,IAAI,SAAS,EAC5B,iBAAiB,IAAI,WAAW,EAChC,qBAAqB,IAAI,eAAe,EACxC,gBAAgB,IAAI,UAAU,EAC9B,WAAW,EACX,UAAU,EACV,QAAQ,EACR,mBAAmB,EACnB,QAAQ,EACR,UAAU,EACV,SAAS,EACT,aAAa,EACb,YAAY,EACZ,cAAc,EACd,SAAS,EACV,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,eAAe,EAAE,wBAAwB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEpF,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAG1C,eAAO,MAAM,MAAM,UAAkC,WAAW,KAAK,YAAY,CAAC;AAClF,eAAO,MAAM,QAAQ,UAAoC,aAAa,KAAK,YAAY,CAAC;AACxF,eAAO,MAAM,aAAa,UAAyC,kBAAkB,KAAK,YAAY,CAAC;AACvG,eAAO,MAAM,UAAU,UAAsC,eAAe,KAAK,YAAY,CAAC;AAC9F,eAAO,MAAM,IAAI,+CAAqE,YAAY,CAAC;AACnG,eAAO,MAAM,KAAK,UAAiC,UAAU,KAAK,YAAY,CAAC;AAC/E,eAAO,MAAM,MAAM,UAAkC,WAAW,KAAK,YAAY,CAAC;AAClF,eAAO,MAAM,IAAI,UAAgC,SAAS,KAAK,YAAY,CAAC;AAC5E,eAAO,MAAM,WAAW,UAAuC,gBAAgB,KAAK,YAAY,CAAC;AACjG,eAAO,MAAM,UAAU,UAAsC,eAAe,KAAK,YAAY,CAAC;AAC9F,eAAO,MAAM,KAAK,UAAiC,UAAU,KAAK,YAAY,CAAC;AAC/E,eAAO,MAAM,MAAM,UAAkC,WAAW,KAAK,YAAY,CAAC;AAClF,eAAO,MAAM,KAAK,UAAiC,UAAU,KAAK,YAAY,CAAC;AAC/E,eAAO,MAAM,IAAI,UAAgC,SAAS,KAAK,YAAY,CAAC;AAC5E,eAAO,MAAM,QAAQ,UAAoC,aAAa,KAAK,YAAY,CAAC;AACxF,eAAO,MAAM,SAAS,UAAqC,cAAc,KAAK,YAAY,CAAC;AAC3F,eAAO,MAAM,MAAM,UAAkC,WAAW,KAAK,YAAY,CAAC;AAClF,eAAO,MAAM,UAAU,UAAsC,eAAe,KAAK,YAAY,CAAC;AAC9F,eAAO,MAAM,KAAK,UAAiC,UAAU,KAAK,YAAY,CAAC;AAG/E,eAAO,MAAM,SAAS,UAAqC,cAAc,KAAK,YAAY,CAAC;AAC3F,eAAO,MAAM,IAAI,UAAgC,eAAe,KAAK,YAAY,CAAC;AAClF,eAAO,MAAM,WAAW,UAAuC,gBAAgB,KAAK,YAAY,CAAC;AACjG,eAAO,MAAM,OAAO,UAAmC,YAAY,KAAK,YAAY,CAAC;AACrF,eAAO,MAAM,YAAY,UAAwC,iBAAiB,KAAK,YAAY,CAAC;AACpG,eAAO,MAAM,MAAM,UAAkC,WAAW,KAAK,YAAY,CAAC;AAClF,eAAO,MAAM,KAAK,UAAiC,UAAU,KAAK,YAAY,CAAC;AAC/E,eAAO,MAAM,cAAc,UAA0C,mBAAmB,KAAK,YAAY,CAAC;AAC1G,eAAO,MAAM,aAAa,UAAyC,wBAAwB,KAAK,YAAY,CAAC;AAC7G,eAAO,MAAM,OAAO,UAAmC,YAAY,KAAK,YAAY,CAAC;AAErF,eAAO,MAAM,EAAE,UAA8B,WAAW,KAAK,YAAY,CAAC;AAC1E,eAAO,MAAM,MAAM,UAAkC,WAAW,KAAK,YAAY,CAAC;AAClF,eAAO,MAAM,MAAM,UAAkC,WAAW,KAAK,YAAY,CAAC;AAElF,eAAO,MAAM,GAAG,UAA+B,QAAQ,KAAK,YAAY,CAAC;AACzE,eAAO,MAAM,IAAI,UAAgC,SAAS,KAAK,YAAY,CAAC;AAE5E,eAAO,MAAM,IAAI,UAAgC,SAAS,KAAK,YAAY,CAAC;AAC5E,eAAO,MAAM,IAAI,UAAgC,SAAS,KAAK,YAAY,CAAC;AAC5E,eAAO,MAAM,GAAG,UAA+B,QAAQ,KAAK,YAAY,CAAC;AACzE,eAAO,MAAM,KAAK,UAAiC,UAAU,KAAK,YAAY,CAAC;AAE/E,eAAO,MAAM,GAAG,UAA+B,cAAc,KAAK,YAAY,CAAC;AAC/E,eAAO,MAAM,QAAQ,UAAoC,aAAa,KAAK,YAAY,CAAC;AAExF,eAAO,MAAM,IAAI,UAAgC,SAAS,KAAK,YAAY,CAAC;AAC5E,eAAO,MAAM,SAAS,UAAqC,cAAc,KAAK,YAAY,CAAC"}
1
+ {"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../src/components.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,EACZ,WAAW,EACX,gBAAgB,IAAI,UAAU,EAC9B,eAAe,IAAI,SAAS,EAC5B,eAAe,IAAI,SAAS,EAC5B,qBAAqB,IAAI,eAAe,EACxC,cAAc,EACd,SAAS,EACV,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE1C,eAAO,MAAM,KAAK,UAAiC,UAAU,KAAK,YAAY,CAAC;AAC/E,eAAO,MAAM,IAAI,UAAgC,SAAS,KAAK,YAAY,CAAC;AAC5E,eAAO,MAAM,IAAI,UAAgC,SAAS,KAAK,YAAY,CAAC;AAC5E,eAAO,MAAM,UAAU,UAAsC,eAAe,KAAK,YAAY,CAAC;AAC9F,eAAO,MAAM,IAAI,UAAgC,SAAS,KAAK,YAAY,CAAC;AAC5E,eAAO,MAAM,SAAS,UAAqC,cAAc,KAAK,YAAY,CAAC;AAE3F,eAAO,MAAM,EAAE,UAA8B,WAAW,KAAK,YAAY,CAAC;AAC1E,eAAO,MAAM,MAAM,UAAkC,WAAW,KAAK,YAAY,CAAC;AAClF,eAAO,MAAM,MAAM,UAAkC,WAAW,KAAK,YAAY,CAAC;AAKlF,cAAc,qBAAqB,CAAC;AAGpC,aAAK,kBAAkB,GAAG;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAC3C,YAAY,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CACnD,CAAC;AACF,eAAO,MAAM,aAAa,UAAyC,kBAAkB,KAAK,YAAY,CAAC"}
package/out/components.js CHANGED
@@ -1,45 +1,15 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.UserGroup = exports.User = exports.TagGroup = exports.Tag = exports.Table = exports.Row = exports.Head = exports.Cell = exports.Tabs = exports.Tab = exports.Strong = exports.Strike = exports.Em = exports.Tooltip = exports.StatusLozenge = exports.SectionMessage = exports.Radio = exports.Option = exports.InlineDialog = exports.Heading = exports.DateLozenge = exports.Code = exports.ButtonSet = exports.Badge = exports.UserPicker = exports.Toggle = exports.TextField = exports.TextArea = exports.Text = exports.Stack = exports.Select = exports.Range = exports.RadioGroup = exports.ModalDialog = exports.Link = exports.Inline = exports.Image = exports.Form = exports.DatePicker = exports.CheckboxGroup = exports.Checkbox = exports.Button = void 0;
4
- exports.Button = 'Button';
5
- exports.Checkbox = 'Checkbox';
6
- exports.CheckboxGroup = 'CheckboxGroup';
7
- exports.DatePicker = 'DatePicker';
8
- exports.Form = 'Form';
3
+ exports.CheckboxGroup = exports.Strong = exports.Strike = exports.Em = exports.UserGroup = exports.User = exports.UserPicker = exports.Text = exports.Link = exports.Image = void 0;
4
+ const tslib_1 = require("tslib");
9
5
  exports.Image = 'Image';
10
- exports.Inline = 'Inline';
11
6
  exports.Link = 'Link';
12
- exports.ModalDialog = 'ModalDialog';
13
- exports.RadioGroup = 'RadioGroup';
14
- exports.Range = 'Range';
15
- exports.Select = 'Select';
16
- exports.Stack = 'Stack';
17
7
  exports.Text = 'Text';
18
- exports.TextArea = 'TextArea';
19
- exports.TextField = 'TextField';
20
- exports.Toggle = 'Toggle';
21
8
  exports.UserPicker = 'UserPicker';
22
- exports.Badge = 'Badge';
23
- exports.ButtonSet = 'ButtonSet';
24
- exports.Code = 'Code';
25
- exports.DateLozenge = 'DateLozenge';
26
- exports.Heading = 'Heading';
27
- exports.InlineDialog = 'InlineDialog';
28
- exports.Option = 'Option';
29
- exports.Radio = 'Radio';
30
- exports.SectionMessage = 'SectionMessage';
31
- exports.StatusLozenge = 'StatusLozenge';
32
- exports.Tooltip = 'Tooltip';
9
+ exports.User = 'User';
10
+ exports.UserGroup = 'UserGroup';
33
11
  exports.Em = 'Em';
34
12
  exports.Strike = 'Strike';
35
13
  exports.Strong = 'Strong';
36
- exports.Tab = 'Tab';
37
- exports.Tabs = 'Tabs';
38
- exports.Cell = 'Cell';
39
- exports.Head = 'Head';
40
- exports.Row = 'Row';
41
- exports.Table = 'Table';
42
- exports.Tag = 'Tag';
43
- exports.TagGroup = 'TagGroup';
44
- exports.User = 'User';
45
- exports.UserGroup = 'UserGroup';
14
+ tslib_1.__exportStar(require("./uikit2-components"), exports);
15
+ exports.CheckboxGroup = 'CheckboxGroup';
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=useForm.test.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useForm.test.d.ts","sourceRoot":"","sources":["../../../src/hooks/__test__/useForm.test.ts"],"names":[],"mappings":""}
@@ -0,0 +1,36 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const react_hooks_1 = require("@testing-library/react-hooks");
4
+ const useForm_1 = require("../useForm");
5
+ jest.mock('react', () => (Object.assign(Object.assign({}, jest.requireActual('react')), { useId: jest.fn().mockReturnValue('mocked-id') })));
6
+ describe('useForm with no default values', () => {
7
+ const { result } = (0, react_hooks_1.renderHook)(() => (0, useForm_1.useForm)());
8
+ it('register should return an id', () => {
9
+ const { register } = result.current;
10
+ const fieldProps = register('username');
11
+ expect(fieldProps.id).toBe('form-mocked-id-username');
12
+ });
13
+ it('register should return isDisabled as true', () => {
14
+ const { register } = result.current;
15
+ const fieldProps = register('username', { disabled: true });
16
+ expect(fieldProps.isDisabled).toBe(true);
17
+ });
18
+ it('getFieldId should return the correct id', () => {
19
+ const { getFieldId } = result.current;
20
+ const fieldId = getFieldId('username');
21
+ expect(fieldId).toBe('form-mocked-id-username');
22
+ });
23
+ });
24
+ describe('useForm with default values', () => {
25
+ const { result } = (0, react_hooks_1.renderHook)(() => (0, useForm_1.useForm)({ defaultValues: { checkbox: true, textfield: 'test' } }));
26
+ it('boolean default values should pass a defaultChecked prop', () => {
27
+ const { register } = result.current;
28
+ const fieldProps = register('checkbox');
29
+ expect(fieldProps.defaultChecked).toBe(true);
30
+ });
31
+ it('non boolean values should pass a defaultValue prop', () => {
32
+ const { register } = result.current;
33
+ const fieldProps = register('textfield');
34
+ expect(fieldProps.defaultValue).toBe('test');
35
+ });
36
+ });
@@ -0,0 +1,34 @@
1
+ import { FieldValues, UseFormProps, FieldPath, RegisterOptions, UseFormRegisterReturn } from 'react-hook-form';
2
+ declare type ForgeOnChangeHandler = (event: {
3
+ target: any;
4
+ type?: string;
5
+ } | any) => void;
6
+ declare type ForgeFormRegister = Pick<UseFormRegisterReturn, 'name'> & {
7
+ onChange: ForgeOnChangeHandler;
8
+ id: string;
9
+ defaultValue?: any;
10
+ defaultChecked?: boolean;
11
+ isDisabled?: boolean;
12
+ isInvalid?: boolean;
13
+ 'aria-invalid'?: any;
14
+ };
15
+ export declare function useForm<TFieldValues extends FieldValues = FieldValues>(props?: Pick<UseFormProps<TFieldValues>, 'defaultValues'>): {
16
+ getFieldId: (fieldName: string) => string;
17
+ register: (fieldName: FieldPath<TFieldValues>, options?: Pick<RegisterOptions<TFieldValues, FieldPath<TFieldValues>>, 'disabled' | 'required' | 'maxLength' | 'minLength' | 'max' | 'min' | 'pattern' | 'validate'>) => ForgeFormRegister;
18
+ formState: {
19
+ errors: import("react-hook-form").FieldErrors<TFieldValues>;
20
+ isSubmitted: boolean;
21
+ isSubmitSuccessful: boolean;
22
+ isSubmitting: boolean;
23
+ submitCount: number;
24
+ isValid: boolean;
25
+ dirtyFields: Partial<Readonly<import("react-hook-form").DeepMap<import("react-hook-form").DeepPartial<TFieldValues>, boolean>>>;
26
+ touchedFields: Partial<Readonly<import("react-hook-form").DeepMap<import("react-hook-form").DeepPartial<TFieldValues>, boolean>>>;
27
+ };
28
+ handleSubmit: import("react-hook-form").UseFormHandleSubmit<TFieldValues, TFieldValues>;
29
+ getValues: import("react-hook-form").UseFormGetValues<TFieldValues>;
30
+ trigger: import("react-hook-form").UseFormTrigger<TFieldValues>;
31
+ clearErrors: import("react-hook-form").UseFormClearErrors<TFieldValues>;
32
+ };
33
+ export {};
34
+ //# sourceMappingURL=useForm.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../src/hooks/useForm.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,WAAW,EACX,YAAY,EACZ,SAAS,EACT,eAAe,EACf,qBAAqB,EACtB,MAAM,iBAAiB,CAAC;AAGzB,aAAK,oBAAoB,GAAG,CAAC,KAAK,EAAE;IAAE,MAAM,EAAE,GAAG,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,GAAG,KAAK,IAAI,CAAC;AAElF,aAAK,iBAAiB,GAAG,IAAI,CAAC,qBAAqB,EAAE,MAAM,CAAC,GAAG;IAC7D,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IAGpB,cAAc,CAAC,EAAE,GAAG,CAAC;CACtB,CAAC;AAEF,wBAAgB,OAAO,CAAC,YAAY,SAAS,WAAW,GAAG,WAAW,EACpE,KAAK,GAAE,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC,EAAE,eAAe,CAAM;4BAK9B,MAAM;0BAuBxB,UAAU,YAAY,CAAC,YACxB,KACR,gBAAgB,YAAY,EAAE,UAAU,YAAY,CAAC,CAAC,EACtD,UAAU,GAAG,UAAU,GAAG,WAAW,GAAG,WAAW,GAAG,KAAK,GAAG,KAAK,GAAG,SAAS,GAAG,UAAU,CAC7F,KACA,iBAAiB;;;;;;;;;;;;;;;EAgFrB"}