@nolwenture/formik-jsonschema-form 1.0.5 → 1.0.6

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 (27) hide show
  1. package/dist/cjs/Form/components/FieldInfo.js +45 -17
  2. package/dist/cjs/Form/components/FieldInput.js +6 -1
  3. package/dist/cjs/Form/templates/ArrayFieldTemplate/ArrayFieldTemplate.js +2 -2
  4. package/dist/cjs/Form/templates/ArrayFieldTemplate/styledComponents.js +4 -1
  5. package/dist/cjs/Form/templates/CollapsibleObjectFieldTemplate/CollapsibleObjectFieldTemplate.js +4 -4
  6. package/dist/cjs/Form/templates/CollapsibleObjectFieldTemplate/styledComponents.js +4 -1
  7. package/dist/cjs/Form/templates/FieldTemplate/FieldTemplate.js +2 -2
  8. package/dist/cjs/Form/templates/ObjectFieldTemplate/ObjectFieldTemplate.js +2 -2
  9. package/dist/cjs/Form/templates/ObjectFieldTemplate/styledComponents.js +9 -1
  10. package/dist/esm/Form/components/FieldInfo.js +45 -17
  11. package/dist/esm/Form/components/FieldInput.js +5 -0
  12. package/dist/esm/Form/templates/ArrayFieldTemplate/ArrayFieldTemplate.js +2 -2
  13. package/dist/esm/Form/templates/ArrayFieldTemplate/styledComponents.js +3 -0
  14. package/dist/esm/Form/templates/CollapsibleObjectFieldTemplate/CollapsibleObjectFieldTemplate.js +4 -4
  15. package/dist/esm/Form/templates/CollapsibleObjectFieldTemplate/styledComponents.js +3 -0
  16. package/dist/esm/Form/templates/FieldTemplate/FieldTemplate.js +2 -2
  17. package/dist/esm/Form/templates/ObjectFieldTemplate/ObjectFieldTemplate.js +2 -2
  18. package/dist/esm/Form/templates/ObjectFieldTemplate/styledComponents.js +8 -0
  19. package/dist/types/Form/components/FieldInfo.d.ts +2 -0
  20. package/dist/types/Form/components/FieldInput.d.ts +1 -0
  21. package/dist/types/Form/components/index.d.ts +7 -0
  22. package/dist/types/Form/templates/ArrayFieldTemplate/styledComponents.d.ts +3 -1
  23. package/dist/types/Form/templates/CollapsibleObjectFieldTemplate/styledComponents.d.ts +3 -1
  24. package/dist/types/Form/templates/ObjectFieldTemplate/styledComponents.d.ts +2 -0
  25. package/dist/types/Form/templates/index.d.ts +4 -0
  26. package/dist/types/common/types/FieldInfo.d.ts +1 -0
  27. package/package.json +1 -1
@@ -1,7 +1,8 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.FieldInfo = exports.FieldInfoLabel = exports.FieldInfoContainer = exports.FieldInfoBoxInnerElement = exports.FieldInfoBoxArrowElement = exports.FieldInfoBoxElement = void 0;
3
+ exports.FieldInfo = exports.InlineFieldInfoWrapper = exports.FieldInfoLabel = exports.FieldInfoContainer = exports.InlineFieldInfoBoxInnerElement = exports.FieldInfoBoxInnerElement = exports.FieldInfoBoxArrowElement = exports.FieldInfoBoxElement = void 0;
4
4
  const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const react_1 = require("react");
5
6
  const styled_components_1 = require("styled-components");
6
7
  const polished_1 = require("polished");
7
8
  exports.FieldInfoBoxElement = styled_components_1.styled.div `
@@ -55,17 +56,17 @@ exports.FieldInfoBoxArrowElement = styled_components_1.styled.div `
55
56
  width: 0;
56
57
  position: absolute;
57
58
  pointer-events: none;
58
- border-top-color: ${({ position, theme }) => position === "top" ? theme.color.intent.default.none : "transparent"};
59
- border-bottom-color: ${({ position, theme }) => position === "bottom" ? theme.color.intent.default.none : "transparent"};
60
- border-right-color: ${({ position, theme }) => position === "right" ? theme.color.intent.default.none : "transparent"};
61
- border-left-color: ${({ position, theme }) => position === "left" ? theme.color.intent.default.none : "transparent"};
59
+ border-top-color: ${({ position, theme }) => position === "top" ? theme.color.intent.default.warning : "transparent"};
60
+ border-bottom-color: ${({ position, theme }) => position === "bottom" ? theme.color.intent.default.warning : "transparent"};
61
+ border-right-color: ${({ position, theme }) => position === "right" ? theme.color.intent.default.warning : "transparent"};
62
+ border-left-color: ${({ position, theme }) => position === "left" ? theme.color.intent.default.warning : "transparent"};
62
63
  border-width: 5px;
63
64
  margin-left: -5px;
64
65
  `;
65
66
  exports.FieldInfoBoxInnerElement = styled_components_1.styled.div `
66
- background: ${(props) => props.theme.color.background.default};
67
+ background: ${(props) => props.theme.color.intent.default.warning};
67
68
  border-radius: ${(props) => props.theme.borderRadius.none};
68
- border: ${(props) => `${props.theme.strokeWidth.thin} solid ${props.theme.color.intent.default.none}`};
69
+ border: none;
69
70
  color: ${(props) => props.theme.color.text.default};
70
71
  cursor: default;
71
72
  font-size: ${(props) => props.theme.typography.size.small};
@@ -75,21 +76,31 @@ exports.FieldInfoBoxInnerElement = styled_components_1.styled.div `
75
76
  text-align: left;
76
77
  white-space: pre-wrap;
77
78
  `;
79
+ exports.InlineFieldInfoBoxInnerElement = styled_components_1.styled.div `
80
+ background: ${(props) => props.theme.color.intent.default.warning};
81
+ border-radius: ${(props) => props.theme.borderRadius.none};
82
+ border: none;
83
+ color: ${(props) => props.theme.color.text.default};
84
+ cursor: default;
85
+ font-size: ${(props) => props.theme.typography.size.small};
86
+ line-height: ${(props) => props.theme.typography.lineHeight.small};
87
+ padding: ${(props) => `${props.theme.spacing.s} ${props.theme.spacing.m}`};
88
+ text-align: left;
89
+ white-space: pre-wrap;
90
+ `;
78
91
  exports.FieldInfoContainer = styled_components_1.styled.a `
79
- position: relative;
80
- color: ${(props) => props.theme.color.text.default};
81
92
  background: none;
82
- outline: none;
83
- cursor: pointer;
84
- border: ${(props) => `${props.theme.strokeWidth.thin} solid
85
- ${props.theme.color.border.default}`};
86
93
  border-radius: ${(props) => props.theme.borderRadius.circle};
87
- line-height: 1em;
94
+ border: ${(props) => `${props.theme.strokeWidth.thin} solid ${props.theme.color.border.default}`};
95
+ color: ${(props) => props.theme.color.text.default};
96
+ cursor: pointer;
88
97
  font-family: ${(props) => props.theme.typography.fontFamily.base};
89
98
  font-size: ${(props) => props.theme.typography.size.small};
99
+ margin: ${(props) => `0 ${props.theme.spacing.s} 0 -${props.theme.spacing.xs}`};
100
+ outline: none;
90
101
  padding: ${(props) => `0 ${props.theme.spacing.s}`};
102
+ position: relative;
91
103
  text-decoration: unset;
92
- margin: ${(props) => `0 ${props.theme.spacing.s} 0 -${props.theme.spacing.xs}`};
93
104
  width: fit-content;
94
105
 
95
106
  &:active,
@@ -103,7 +114,24 @@ exports.FieldInfoContainer = styled_components_1.styled.a `
103
114
  }
104
115
  `;
105
116
  exports.FieldInfoLabel = styled_components_1.styled.span ``;
106
- const FieldInfo = ({ label, content, position, props, className, }) => {
107
- return ((0, jsx_runtime_1.jsxs)(exports.FieldInfoContainer, { href: "#", onClick: (e) => e.preventDefault(), className: className, children: [(0, jsx_runtime_1.jsx)(exports.FieldInfoLabel, { children: label ?? "i" }), (0, jsx_runtime_1.jsxs)(exports.FieldInfoBoxElement, { position: position ?? "top", role: "tooltip", children: [(0, jsx_runtime_1.jsx)(exports.FieldInfoBoxArrowElement, { position: position ?? "top" }), (0, jsx_runtime_1.jsx)(exports.FieldInfoBoxInnerElement, { children: content })] })] }));
117
+ exports.InlineFieldInfoWrapper = styled_components_1.styled.div `
118
+ display: flex;
119
+ margin: ${(props) => `${props.theme.spacing.m} 0`};
120
+ width: 100%;
121
+ `;
122
+ const FieldInfo = ({ label, content, position, display = "tooltip", className, }) => {
123
+ const [isInlineVisible, setIsInlineVisible] = (0, react_1.useState)(false);
124
+ const handleToggle = (e) => {
125
+ e.preventDefault();
126
+ if (display === "inline") {
127
+ setIsInlineVisible((prev) => !prev);
128
+ }
129
+ };
130
+ if (display === "inline") {
131
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(exports.FieldInfoContainer, { href: "#", onClick: handleToggle, className: className, children: (0, jsx_runtime_1.jsx)(exports.FieldInfoLabel, { children: label ?? "i" }) }), isInlineVisible && ((0, jsx_runtime_1.jsx)(exports.InlineFieldInfoWrapper, { children: (0, jsx_runtime_1.jsx)(exports.InlineFieldInfoBoxInnerElement, { children: content }) }))] }));
132
+ }
133
+ else {
134
+ return ((0, jsx_runtime_1.jsxs)(exports.FieldInfoContainer, { href: "#", onClick: (e) => e.preventDefault(), className: className, children: [(0, jsx_runtime_1.jsx)(exports.FieldInfoLabel, { children: label ?? "i" }), (0, jsx_runtime_1.jsxs)(exports.FieldInfoBoxElement, { position: position ?? "top", role: "tooltip", children: [(0, jsx_runtime_1.jsx)(exports.FieldInfoBoxArrowElement, { position: position ?? "top" }), (0, jsx_runtime_1.jsx)(exports.FieldInfoBoxInnerElement, { children: content })] })] }));
135
+ }
108
136
  };
109
137
  exports.FieldInfo = FieldInfo;
@@ -33,7 +33,7 @@ var __importStar = (this && this.__importStar) || (function () {
33
33
  };
34
34
  })();
35
35
  Object.defineProperty(exports, "__esModule", { value: true });
36
- exports.SelectFieldInput = exports.FieldInput = exports.FieldHelp = exports.FieldDescription = exports.FieldTitle = exports.FieldWrapper = void 0;
36
+ exports.SelectFieldInput = exports.FieldInput = exports.FieldHelp = exports.FieldDescription = exports.FieldTitle = exports.FieldTitleInfoWrapper = exports.FieldWrapper = void 0;
37
37
  const jsx_runtime_1 = require("react/jsx-runtime");
38
38
  const styled_components_1 = require("styled-components");
39
39
  const formik = __importStar(require("formik"));
@@ -45,6 +45,11 @@ exports.FieldWrapper = styled_components_1.styled.div `
45
45
  opacity: ${(props) => (props.$isDisabled ? 0.6 : 1)};
46
46
  pointer-events: ${(props) => (props.$isDisabled ? 'none' : 'auto')};
47
47
  `;
48
+ exports.FieldTitleInfoWrapper = styled_components_1.styled.div `
49
+ display: flex;
50
+ flex-direction: row;
51
+ flex-wrap: wrap;
52
+ `;
48
53
  exports.FieldTitle = styled_components_1.styled.label `
49
54
  font-size: ${(props) => props.theme.typography.size.base};
50
55
  font-family: ${(props) => props.theme.typography.fontFamily.base};
@@ -9,7 +9,7 @@ const FormRegistry_1 = require("../../FormRegistry");
9
9
  const styledComponents_1 = require("./styledComponents");
10
10
  const ArrayFieldTemplate = (props) => {
11
11
  const { components } = (0, react_1.useContext)(FormRegistry_1.FormRegistry);
12
- const { Wrapper, Title, Description, Help, Info, RequiredIndicator, ErrorMessage, } = (0, styledComponents_1.getComponents)(components);
12
+ const { Wrapper, Title, TitleInfoWrapper, Description, Help, Info, RequiredIndicator, ErrorMessage, } = (0, styledComponents_1.getComponents)(components);
13
13
  const { name, uiSchema, items, renderItem, ...otherProps } = props;
14
14
  const title = (0, utils_1.getTitle)(props);
15
15
  const description = (0, utils_1.getDescription)(props);
@@ -31,6 +31,6 @@ const ArrayFieldTemplate = (props) => {
31
31
  // In case of array of objects, it will give error message as an object value,
32
32
  // which is incorrect value for React, causing UI to crash.
33
33
  const errorIsString = typeof error === "string";
34
- return ((0, jsx_runtime_1.jsxs)(Wrapper, { ...mergedWrapperProps, children: [title && ((0, jsx_runtime_1.jsxs)(Title, { ...titleProps, htmlFor: name, children: [title, props?.required && (0, jsx_runtime_1.jsx)(RequiredIndicator, {})] })), info && (0, jsx_runtime_1.jsx)(Info, { ...info }), description && ((0, jsx_runtime_1.jsx)(Description, { ...descriptionProps, children: description })), items && items.map((item, index) => renderItem(item, index)), help && (0, jsx_runtime_1.jsx)(Help, { ...helpProps, children: help }), errorIsString && (0, jsx_runtime_1.jsx)(ErrorMessage, { ...errorProps, name: name })] }));
34
+ return ((0, jsx_runtime_1.jsxs)(Wrapper, { ...mergedWrapperProps, children: [(0, jsx_runtime_1.jsxs)(TitleInfoWrapper, { children: [title && ((0, jsx_runtime_1.jsxs)(Title, { ...titleProps, htmlFor: name, children: [title, props?.required && (0, jsx_runtime_1.jsx)(RequiredIndicator, {})] })), info && (0, jsx_runtime_1.jsx)(Info, { ...info })] }), description && ((0, jsx_runtime_1.jsx)(Description, { ...descriptionProps, children: description })), items && items.map((item, index) => renderItem(item, index)), help && (0, jsx_runtime_1.jsx)(Help, { ...helpProps, children: help }), errorIsString && (0, jsx_runtime_1.jsx)(ErrorMessage, { ...errorProps, name: name })] }));
35
35
  };
36
36
  exports.ArrayFieldTemplate = ArrayFieldTemplate;
@@ -1,7 +1,8 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.ArrayFieldTemplateErrorMessage = exports.ArrayFieldTemplateRequiredIndicator = exports.ArrayFieldTemplateInfo = exports.ArrayFieldTemplateHelp = exports.ArrayFieldTemplateDescription = exports.ArrayFieldTemplateTitle = exports.ArrayFieldTemplateIcon = exports.ArrayFieldTemplateWrapper = void 0;
3
+ exports.ArrayFieldTemplateErrorMessage = exports.ArrayFieldTemplateRequiredIndicator = exports.ArrayFieldTemplateInfo = exports.ArrayFieldTemplateHelp = exports.ArrayFieldTemplateDescription = exports.ArrayFieldTemplateTitle = exports.ArrayFieldTemplateIcon = exports.ArrayFieldTemplateWrapper = exports.ArrayFieldTitleInfoWrapper = void 0;
4
4
  exports.getComponents = getComponents;
5
+ exports.ArrayFieldTitleInfoWrapper = undefined;
5
6
  exports.ArrayFieldTemplateWrapper = undefined;
6
7
  exports.ArrayFieldTemplateIcon = undefined;
7
8
  exports.ArrayFieldTemplateTitle = undefined;
@@ -14,6 +15,8 @@ function getComponents(components) {
14
15
  return {
15
16
  Wrapper: components.ArrayFieldTemplateWrapper ??
16
17
  components.ObjectFieldTemplateWrapper,
18
+ TitleInfoWrapper: components.ArrayFieldTitleInfoWrapper ??
19
+ components.ObjectFieldTitleInfoWrapper,
17
20
  Title: components.ArrayFieldTemplateTitle ?? components.ObjectFieldTemplateTitle,
18
21
  Description: components.ArrayFieldTemplateDescription ?? components.FieldDescription,
19
22
  Help: components.ArrayFieldTemplateHelp ?? components.FieldHelp,
@@ -9,7 +9,7 @@ const FormRegistry_1 = require("../../FormRegistry");
9
9
  const styledComponents_1 = require("./styledComponents");
10
10
  const CollapsibleObjectFieldTemplate = (props) => {
11
11
  const { components } = (0, react_1.useContext)(FormRegistry_1.FormRegistry);
12
- const { Toggle, ChildrenWrapper, RequiredIndicator, Icon, Description, Title, Wrapper, Help, Info, } = (0, styledComponents_1.getComponents)(components);
12
+ const { Toggle, ChildrenWrapper, RequiredIndicator, Icon, Description, Title, TitleInfoWrapper, Wrapper, Help, Info, } = (0, styledComponents_1.getComponents)(components);
13
13
  const { children, name, uiSchema, ...otherProps } = props;
14
14
  const formikCtx = (0, formik_1.useFormikContext)();
15
15
  const values = formikCtx.values
@@ -34,8 +34,8 @@ const CollapsibleObjectFieldTemplate = (props) => {
34
34
  };
35
35
  const [collapsed, setCollapsed] = (0, react_1.useState)(isCollapsedOnLoad);
36
36
  const hide = collapsed;
37
- return ((0, jsx_runtime_1.jsxs)(Wrapper, { ...mergedWrapperProps, children: [title && ((0, jsx_runtime_1.jsx)(Toggle, { onClick: () => setCollapsed(!collapsed),
38
- //ariaExpanded={!hide}
39
- ariaLabel: ariaLabel ?? name, children: (0, jsx_runtime_1.jsxs)(Title, { ...titleProps, htmlFor: name, children: [title, props?.required && (0, jsx_runtime_1.jsx)(RequiredIndicator, {}), (0, jsx_runtime_1.jsx)(Icon, { children: hide ? collapsedIcon ?? "▸" : openIcon ?? "▾" })] }) })), info && (0, jsx_runtime_1.jsx)(Info, { ...info }), description && ((0, jsx_runtime_1.jsx)(Description, { ...descriptionProps, children: description })), !hide && (0, jsx_runtime_1.jsx)(ChildrenWrapper, { children: children }), help && (0, jsx_runtime_1.jsx)(Help, { ...helpProps, children: help })] }));
37
+ return ((0, jsx_runtime_1.jsxs)(Wrapper, { ...mergedWrapperProps, children: [(0, jsx_runtime_1.jsxs)(TitleInfoWrapper, { children: [title && ((0, jsx_runtime_1.jsx)(Toggle, { onClick: () => setCollapsed(!collapsed),
38
+ //ariaExpanded={!hide}
39
+ ariaLabel: ariaLabel ?? name, children: (0, jsx_runtime_1.jsxs)(Title, { ...titleProps, htmlFor: name, children: [title, props?.required && (0, jsx_runtime_1.jsx)(RequiredIndicator, {}), (0, jsx_runtime_1.jsx)(Icon, { children: hide ? collapsedIcon ?? "▸" : openIcon ?? "▾" })] }) })), info && (0, jsx_runtime_1.jsx)(Info, { ...info })] }), description && ((0, jsx_runtime_1.jsx)(Description, { ...descriptionProps, children: description })), !hide && (0, jsx_runtime_1.jsx)(ChildrenWrapper, { children: children }), help && (0, jsx_runtime_1.jsx)(Help, { ...helpProps, children: help })] }));
40
40
  };
41
41
  exports.CollapsibleObjectFieldTemplate = CollapsibleObjectFieldTemplate;
@@ -1,11 +1,12 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.CollapsibleObjectFieldTemplateChildWrapper = exports.CollapsibleObjectFieldTemplateToggle = exports.CollapsibleObjectFieldTemplateErrorMessage = exports.CollapsibleObjectFieldTemplateRequiredIndicator = exports.CollapsibleObjectFieldTemplateInfo = exports.CollapsibleObjectFieldTemplateHelp = exports.CollapsibleObjectFieldTemplateDescription = exports.CollapsibleObjectFieldTemplateTitle = exports.CollapsibleObjectFieldTemplateIcon = exports.CollapsibleObjectFieldTemplateWrapper = void 0;
3
+ exports.CollapsibleObjectFieldTemplateChildWrapper = exports.CollapsibleObjectFieldTemplateToggle = exports.CollapsibleObjectFieldTemplateErrorMessage = exports.CollapsibleObjectFieldTemplateRequiredIndicator = exports.CollapsibleObjectFieldTemplateInfo = exports.CollapsibleObjectFieldTemplateHelp = exports.CollapsibleObjectFieldTemplateDescription = exports.CollapsibleObjectFieldTemplateTitle = exports.CollapsibleObjectFieldTemplateIcon = exports.CollapsibleObjectTitleInfoWrapper = exports.CollapsibleObjectFieldTemplateWrapper = void 0;
4
4
  exports.getComponents = getComponents;
5
5
  const styled_components_1 = require("styled-components");
6
6
  const styledComponents_1 = require("../ObjectFieldTemplate/styledComponents");
7
7
  const component_library_1 = require("@nolwenture/component-library");
8
8
  exports.CollapsibleObjectFieldTemplateWrapper = undefined;
9
+ exports.CollapsibleObjectTitleInfoWrapper = undefined;
9
10
  exports.CollapsibleObjectFieldTemplateIcon = undefined;
10
11
  exports.CollapsibleObjectFieldTemplateTitle = (0, styled_components_1.styled)(styledComponents_1.ObjectFieldTemplateTitle) `
11
12
  display: flex;
@@ -27,6 +28,8 @@ function getComponents(components) {
27
28
  return {
28
29
  Wrapper: components.CollapsibleObjectFieldTemplateWrapper ??
29
30
  components.ObjectFieldTemplateWrapper,
31
+ TitleInfoWrapper: components.CollapsibleObjectTitleInfoWrapper ??
32
+ components.ObjectFieldTitleInfoWrapper,
30
33
  Icon: components.CollapsibleObjectFieldTemplateIcon ?? components.Icon,
31
34
  Title: components.CollapsibleObjectFieldTemplateTitle ??
32
35
  components.ObjectFieldTemplateTitle,
@@ -6,7 +6,7 @@ const react_1 = require("react");
6
6
  const utils_1 = require("../../../utils");
7
7
  const FormRegistry_1 = require("../../FormRegistry");
8
8
  const FieldTemplate = (props) => {
9
- const { components: { FieldWrapper, FieldTitle, FieldDescription, ErrorMessage, FieldHelp, RequiredIndicator, FieldInfo, }, } = (0, react_1.useContext)(FormRegistry_1.FormRegistry);
9
+ const { components: { FieldWrapper, FieldTitleInfoWrapper, FieldTitle, FieldDescription, ErrorMessage, FieldHelp, RequiredIndicator, FieldInfo, }, } = (0, react_1.useContext)(FormRegistry_1.FormRegistry);
10
10
  const { name, uiSchema, children, ...otherProps } = props;
11
11
  const title = (0, utils_1.getTitle)(props);
12
12
  const description = (0, utils_1.getDescription)(props);
@@ -23,6 +23,6 @@ const FieldTemplate = (props) => {
23
23
  ...wrapperProps,
24
24
  ...dataAttributes, // This will only include data-* attributes
25
25
  };
26
- return ((0, jsx_runtime_1.jsxs)(FieldWrapper, { ...mergedWrapperProps, "$isDisabled": isDisabled, children: [title && ((0, jsx_runtime_1.jsxs)(FieldTitle, { ...titleProps, htmlFor: name, children: [title, props.required && (0, jsx_runtime_1.jsx)(RequiredIndicator, {})] })), info && (0, jsx_runtime_1.jsx)(FieldInfo, { ...info }), description && ((0, jsx_runtime_1.jsx)(FieldDescription, { ...descriptionProps, children: description })), children, help && (0, jsx_runtime_1.jsx)(FieldHelp, { ...helpProps, children: help }), (0, jsx_runtime_1.jsx)(ErrorMessage, { ...errorProps, name: name })] }));
26
+ return ((0, jsx_runtime_1.jsxs)(FieldWrapper, { ...mergedWrapperProps, "$isDisabled": isDisabled, children: [(0, jsx_runtime_1.jsxs)(FieldTitleInfoWrapper, { children: [title && ((0, jsx_runtime_1.jsxs)(FieldTitle, { ...titleProps, htmlFor: name, children: [title, props.required && (0, jsx_runtime_1.jsx)(RequiredIndicator, {})] })), info && (0, jsx_runtime_1.jsx)(FieldInfo, { ...info })] }), description && ((0, jsx_runtime_1.jsx)(FieldDescription, { ...descriptionProps, children: description })), children, help && (0, jsx_runtime_1.jsx)(FieldHelp, { ...helpProps, children: help }), (0, jsx_runtime_1.jsx)(ErrorMessage, { ...errorProps, name: name })] }));
27
27
  };
28
28
  exports.FieldTemplate = FieldTemplate;
@@ -8,7 +8,7 @@ const FormRegistry_1 = require("../../FormRegistry");
8
8
  const styledComponents_1 = require("./styledComponents");
9
9
  const ObjectFieldTemplate = (props) => {
10
10
  const { components } = (0, react_1.useContext)(FormRegistry_1.FormRegistry);
11
- const { Wrapper, Title, Description, Help, Info, RequiredIndicator, ErrorMessage, } = (0, styledComponents_1.getComponents)(components);
11
+ const { Wrapper, Title, TitleInfoWrapper, Description, Help, Info, RequiredIndicator, ErrorMessage, } = (0, styledComponents_1.getComponents)(components);
12
12
  const { children, uiSchema, ...otherProps } = props;
13
13
  const title = (0, utils_1.getTitle)(props);
14
14
  const description = (0, utils_1.getDescription)(props);
@@ -27,6 +27,6 @@ const ObjectFieldTemplate = (props) => {
27
27
  ...wrapperProps,
28
28
  ...dataAttributes,
29
29
  };
30
- return ((0, jsx_runtime_1.jsxs)(Wrapper, { ...mergedWrapperProps, children: [title && ((0, jsx_runtime_1.jsxs)(Title, { ...titleProps, children: [title, props?.required && (0, jsx_runtime_1.jsx)(RequiredIndicator, {})] })), info && (0, jsx_runtime_1.jsx)(Info, { ...info }), description && ((0, jsx_runtime_1.jsx)(Description, { ...descriptionProps, children: description })), children, help && (0, jsx_runtime_1.jsx)(Help, { ...helpProps, children: help })] }));
30
+ return ((0, jsx_runtime_1.jsxs)(Wrapper, { ...mergedWrapperProps, children: [(0, jsx_runtime_1.jsxs)(TitleInfoWrapper, { children: [title && ((0, jsx_runtime_1.jsxs)(Title, { ...titleProps, children: [title, props?.required && (0, jsx_runtime_1.jsx)(RequiredIndicator, {})] })), info && (0, jsx_runtime_1.jsx)(Info, { ...info })] }), description && ((0, jsx_runtime_1.jsx)(Description, { ...descriptionProps, children: description })), children, help && (0, jsx_runtime_1.jsx)(Help, { ...helpProps, children: help })] }));
31
31
  };
32
32
  exports.ObjectFieldTemplate = ObjectFieldTemplate;
@@ -1,10 +1,12 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.ObjectFieldTemplateErrorMessage = exports.ObjectFieldTemplateRequiredIndicator = exports.ObjectFieldTemplateInfo = exports.ObjectFieldTemplateHelp = exports.ObjectFieldTemplateDescription = exports.ObjectFieldTemplateTitle = exports.ObjectFieldTemplateWrapper = void 0;
3
+ exports.ObjectFieldTemplateErrorMessage = exports.ObjectFieldTemplateRequiredIndicator = exports.ObjectFieldTemplateInfo = exports.ObjectFieldTemplateHelp = exports.ObjectFieldTemplateDescription = exports.ObjectFieldTitleInfoWrapper = exports.ObjectFieldTemplateTitle = exports.ObjectFieldTemplateWrapper = void 0;
4
4
  exports.getComponents = getComponents;
5
5
  const polished_1 = require("polished");
6
6
  const styled_components_1 = require("styled-components");
7
7
  exports.ObjectFieldTemplateWrapper = styled_components_1.styled.fieldset `
8
+ display: flex;
9
+ flex-direction: column;
8
10
  color: ${(props) => props.theme.color.text.default};
9
11
  font-family: ${(props) => props.theme.typography.fontFamily.base};
10
12
  margin-inline: 0;
@@ -27,6 +29,11 @@ exports.ObjectFieldTemplateTitle = styled_components_1.styled.legend `
27
29
  color: ${(props) => props.theme.color.text.default};
28
30
  font-family: ${(props) => props.theme.typography.fontFamily.base};
29
31
  `;
32
+ exports.ObjectFieldTitleInfoWrapper = styled_components_1.styled.div `
33
+ display: flex;
34
+ flex-direction: row;
35
+ flex-wrap: wrap;
36
+ `;
30
37
  exports.ObjectFieldTemplateDescription = undefined;
31
38
  exports.ObjectFieldTemplateHelp = undefined;
32
39
  exports.ObjectFieldTemplateInfo = undefined;
@@ -36,6 +43,7 @@ function getComponents(components) {
36
43
  return {
37
44
  Wrapper: components.ObjectFieldTemplateWrapper,
38
45
  Title: components.ObjectFieldTemplateTitle,
46
+ TitleInfoWrapper: components.ObjectFieldTitleInfoWrapper,
39
47
  Description: components.ObjectFieldTemplateDescription ?? components.FieldDescription,
40
48
  Help: components.ObjectFieldTemplateHelp ?? components.FieldHelp,
41
49
  Info: components.ObjectFieldTemplateInfo ?? components.FieldInfo,
@@ -1,4 +1,5 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
1
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useState } from "react";
2
3
  import { styled } from "styled-components";
3
4
  import { readableColor } from "polished";
4
5
  export const FieldInfoBoxElement = styled.div `
@@ -52,17 +53,17 @@ export const FieldInfoBoxArrowElement = styled.div `
52
53
  width: 0;
53
54
  position: absolute;
54
55
  pointer-events: none;
55
- border-top-color: ${({ position, theme }) => position === "top" ? theme.color.intent.default.none : "transparent"};
56
- border-bottom-color: ${({ position, theme }) => position === "bottom" ? theme.color.intent.default.none : "transparent"};
57
- border-right-color: ${({ position, theme }) => position === "right" ? theme.color.intent.default.none : "transparent"};
58
- border-left-color: ${({ position, theme }) => position === "left" ? theme.color.intent.default.none : "transparent"};
56
+ border-top-color: ${({ position, theme }) => position === "top" ? theme.color.intent.default.warning : "transparent"};
57
+ border-bottom-color: ${({ position, theme }) => position === "bottom" ? theme.color.intent.default.warning : "transparent"};
58
+ border-right-color: ${({ position, theme }) => position === "right" ? theme.color.intent.default.warning : "transparent"};
59
+ border-left-color: ${({ position, theme }) => position === "left" ? theme.color.intent.default.warning : "transparent"};
59
60
  border-width: 5px;
60
61
  margin-left: -5px;
61
62
  `;
62
63
  export const FieldInfoBoxInnerElement = styled.div `
63
- background: ${(props) => props.theme.color.background.default};
64
+ background: ${(props) => props.theme.color.intent.default.warning};
64
65
  border-radius: ${(props) => props.theme.borderRadius.none};
65
- border: ${(props) => `${props.theme.strokeWidth.thin} solid ${props.theme.color.intent.default.none}`};
66
+ border: none;
66
67
  color: ${(props) => props.theme.color.text.default};
67
68
  cursor: default;
68
69
  font-size: ${(props) => props.theme.typography.size.small};
@@ -72,21 +73,31 @@ export const FieldInfoBoxInnerElement = styled.div `
72
73
  text-align: left;
73
74
  white-space: pre-wrap;
74
75
  `;
76
+ export const InlineFieldInfoBoxInnerElement = styled.div `
77
+ background: ${(props) => props.theme.color.intent.default.warning};
78
+ border-radius: ${(props) => props.theme.borderRadius.none};
79
+ border: none;
80
+ color: ${(props) => props.theme.color.text.default};
81
+ cursor: default;
82
+ font-size: ${(props) => props.theme.typography.size.small};
83
+ line-height: ${(props) => props.theme.typography.lineHeight.small};
84
+ padding: ${(props) => `${props.theme.spacing.s} ${props.theme.spacing.m}`};
85
+ text-align: left;
86
+ white-space: pre-wrap;
87
+ `;
75
88
  export const FieldInfoContainer = styled.a `
76
- position: relative;
77
- color: ${(props) => props.theme.color.text.default};
78
89
  background: none;
79
- outline: none;
80
- cursor: pointer;
81
- border: ${(props) => `${props.theme.strokeWidth.thin} solid
82
- ${props.theme.color.border.default}`};
83
90
  border-radius: ${(props) => props.theme.borderRadius.circle};
84
- line-height: 1em;
91
+ border: ${(props) => `${props.theme.strokeWidth.thin} solid ${props.theme.color.border.default}`};
92
+ color: ${(props) => props.theme.color.text.default};
93
+ cursor: pointer;
85
94
  font-family: ${(props) => props.theme.typography.fontFamily.base};
86
95
  font-size: ${(props) => props.theme.typography.size.small};
96
+ margin: ${(props) => `0 ${props.theme.spacing.s} 0 -${props.theme.spacing.xs}`};
97
+ outline: none;
87
98
  padding: ${(props) => `0 ${props.theme.spacing.s}`};
99
+ position: relative;
88
100
  text-decoration: unset;
89
- margin: ${(props) => `0 ${props.theme.spacing.s} 0 -${props.theme.spacing.xs}`};
90
101
  width: fit-content;
91
102
 
92
103
  &:active,
@@ -100,6 +111,23 @@ export const FieldInfoContainer = styled.a `
100
111
  }
101
112
  `;
102
113
  export const FieldInfoLabel = styled.span ``;
103
- export const FieldInfo = ({ label, content, position, props, className, }) => {
104
- return (_jsxs(FieldInfoContainer, { href: "#", onClick: (e) => e.preventDefault(), className: className, children: [_jsx(FieldInfoLabel, { children: label ?? "i" }), _jsxs(FieldInfoBoxElement, { position: position ?? "top", role: "tooltip", children: [_jsx(FieldInfoBoxArrowElement, { position: position ?? "top" }), _jsx(FieldInfoBoxInnerElement, { children: content })] })] }));
114
+ export const InlineFieldInfoWrapper = styled.div `
115
+ display: flex;
116
+ margin: ${(props) => `${props.theme.spacing.m} 0`};
117
+ width: 100%;
118
+ `;
119
+ export const FieldInfo = ({ label, content, position, display = "tooltip", className, }) => {
120
+ const [isInlineVisible, setIsInlineVisible] = useState(false);
121
+ const handleToggle = (e) => {
122
+ e.preventDefault();
123
+ if (display === "inline") {
124
+ setIsInlineVisible((prev) => !prev);
125
+ }
126
+ };
127
+ if (display === "inline") {
128
+ return (_jsxs(_Fragment, { children: [_jsx(FieldInfoContainer, { href: "#", onClick: handleToggle, className: className, children: _jsx(FieldInfoLabel, { children: label ?? "i" }) }), isInlineVisible && (_jsx(InlineFieldInfoWrapper, { children: _jsx(InlineFieldInfoBoxInnerElement, { children: content }) }))] }));
129
+ }
130
+ else {
131
+ return (_jsxs(FieldInfoContainer, { href: "#", onClick: (e) => e.preventDefault(), className: className, children: [_jsx(FieldInfoLabel, { children: label ?? "i" }), _jsxs(FieldInfoBoxElement, { position: position ?? "top", role: "tooltip", children: [_jsx(FieldInfoBoxArrowElement, { position: position ?? "top" }), _jsx(FieldInfoBoxInnerElement, { children: content })] })] }));
132
+ }
105
133
  };
@@ -9,6 +9,11 @@ export const FieldWrapper = styled.div `
9
9
  opacity: ${(props) => (props.$isDisabled ? 0.6 : 1)};
10
10
  pointer-events: ${(props) => (props.$isDisabled ? 'none' : 'auto')};
11
11
  `;
12
+ export const FieldTitleInfoWrapper = styled.div `
13
+ display: flex;
14
+ flex-direction: row;
15
+ flex-wrap: wrap;
16
+ `;
12
17
  export const FieldTitle = styled.label `
13
18
  font-size: ${(props) => props.theme.typography.size.base};
14
19
  font-family: ${(props) => props.theme.typography.fontFamily.base};
@@ -6,7 +6,7 @@ import { FormRegistry } from "../../FormRegistry";
6
6
  import { getComponents } from "./styledComponents";
7
7
  export const ArrayFieldTemplate = (props) => {
8
8
  const { components } = useContext(FormRegistry);
9
- const { Wrapper, Title, Description, Help, Info, RequiredIndicator, ErrorMessage, } = getComponents(components);
9
+ const { Wrapper, Title, TitleInfoWrapper, Description, Help, Info, RequiredIndicator, ErrorMessage, } = getComponents(components);
10
10
  const { name, uiSchema, items, renderItem, ...otherProps } = props;
11
11
  const title = getTitle(props);
12
12
  const description = getDescription(props);
@@ -28,5 +28,5 @@ export const ArrayFieldTemplate = (props) => {
28
28
  // In case of array of objects, it will give error message as an object value,
29
29
  // which is incorrect value for React, causing UI to crash.
30
30
  const errorIsString = typeof error === "string";
31
- return (_jsxs(Wrapper, { ...mergedWrapperProps, children: [title && (_jsxs(Title, { ...titleProps, htmlFor: name, children: [title, props?.required && _jsx(RequiredIndicator, {})] })), info && _jsx(Info, { ...info }), description && (_jsx(Description, { ...descriptionProps, children: description })), items && items.map((item, index) => renderItem(item, index)), help && _jsx(Help, { ...helpProps, children: help }), errorIsString && _jsx(ErrorMessage, { ...errorProps, name: name })] }));
31
+ return (_jsxs(Wrapper, { ...mergedWrapperProps, children: [_jsxs(TitleInfoWrapper, { children: [title && (_jsxs(Title, { ...titleProps, htmlFor: name, children: [title, props?.required && _jsx(RequiredIndicator, {})] })), info && _jsx(Info, { ...info })] }), description && (_jsx(Description, { ...descriptionProps, children: description })), items && items.map((item, index) => renderItem(item, index)), help && _jsx(Help, { ...helpProps, children: help }), errorIsString && _jsx(ErrorMessage, { ...errorProps, name: name })] }));
32
32
  };
@@ -1,3 +1,4 @@
1
+ export const ArrayFieldTitleInfoWrapper = undefined;
1
2
  export const ArrayFieldTemplateWrapper = undefined;
2
3
  export const ArrayFieldTemplateIcon = undefined;
3
4
  export const ArrayFieldTemplateTitle = undefined;
@@ -10,6 +11,8 @@ export function getComponents(components) {
10
11
  return {
11
12
  Wrapper: components.ArrayFieldTemplateWrapper ??
12
13
  components.ObjectFieldTemplateWrapper,
14
+ TitleInfoWrapper: components.ArrayFieldTitleInfoWrapper ??
15
+ components.ObjectFieldTitleInfoWrapper,
13
16
  Title: components.ArrayFieldTemplateTitle ?? components.ObjectFieldTemplateTitle,
14
17
  Description: components.ArrayFieldTemplateDescription ?? components.FieldDescription,
15
18
  Help: components.ArrayFieldTemplateHelp ?? components.FieldHelp,
@@ -6,7 +6,7 @@ import { FormRegistry } from "../../FormRegistry";
6
6
  import { getComponents } from "./styledComponents";
7
7
  export const CollapsibleObjectFieldTemplate = (props) => {
8
8
  const { components } = useContext(FormRegistry);
9
- const { Toggle, ChildrenWrapper, RequiredIndicator, Icon, Description, Title, Wrapper, Help, Info, } = getComponents(components);
9
+ const { Toggle, ChildrenWrapper, RequiredIndicator, Icon, Description, Title, TitleInfoWrapper, Wrapper, Help, Info, } = getComponents(components);
10
10
  const { children, name, uiSchema, ...otherProps } = props;
11
11
  const formikCtx = useFormikContext();
12
12
  const values = formikCtx.values
@@ -31,7 +31,7 @@ export const CollapsibleObjectFieldTemplate = (props) => {
31
31
  };
32
32
  const [collapsed, setCollapsed] = useState(isCollapsedOnLoad);
33
33
  const hide = collapsed;
34
- return (_jsxs(Wrapper, { ...mergedWrapperProps, children: [title && (_jsx(Toggle, { onClick: () => setCollapsed(!collapsed),
35
- //ariaExpanded={!hide}
36
- ariaLabel: ariaLabel ?? name, children: _jsxs(Title, { ...titleProps, htmlFor: name, children: [title, props?.required && _jsx(RequiredIndicator, {}), _jsx(Icon, { children: hide ? collapsedIcon ?? "▸" : openIcon ?? "▾" })] }) })), info && _jsx(Info, { ...info }), description && (_jsx(Description, { ...descriptionProps, children: description })), !hide && _jsx(ChildrenWrapper, { children: children }), help && _jsx(Help, { ...helpProps, children: help })] }));
34
+ return (_jsxs(Wrapper, { ...mergedWrapperProps, children: [_jsxs(TitleInfoWrapper, { children: [title && (_jsx(Toggle, { onClick: () => setCollapsed(!collapsed),
35
+ //ariaExpanded={!hide}
36
+ ariaLabel: ariaLabel ?? name, children: _jsxs(Title, { ...titleProps, htmlFor: name, children: [title, props?.required && _jsx(RequiredIndicator, {}), _jsx(Icon, { children: hide ? collapsedIcon ?? "▸" : openIcon ?? "▾" })] }) })), info && _jsx(Info, { ...info })] }), description && (_jsx(Description, { ...descriptionProps, children: description })), !hide && _jsx(ChildrenWrapper, { children: children }), help && _jsx(Help, { ...helpProps, children: help })] }));
37
37
  };
@@ -2,6 +2,7 @@ import { styled } from "styled-components";
2
2
  import { ObjectFieldTemplateTitle, } from "../ObjectFieldTemplate/styledComponents";
3
3
  import { Button } from "@nolwenture/component-library";
4
4
  export const CollapsibleObjectFieldTemplateWrapper = undefined;
5
+ export const CollapsibleObjectTitleInfoWrapper = undefined;
5
6
  export const CollapsibleObjectFieldTemplateIcon = undefined;
6
7
  export const CollapsibleObjectFieldTemplateTitle = styled(ObjectFieldTemplateTitle) `
7
8
  display: flex;
@@ -23,6 +24,8 @@ export function getComponents(components) {
23
24
  return {
24
25
  Wrapper: components.CollapsibleObjectFieldTemplateWrapper ??
25
26
  components.ObjectFieldTemplateWrapper,
27
+ TitleInfoWrapper: components.CollapsibleObjectTitleInfoWrapper ??
28
+ components.ObjectFieldTitleInfoWrapper,
26
29
  Icon: components.CollapsibleObjectFieldTemplateIcon ?? components.Icon,
27
30
  Title: components.CollapsibleObjectFieldTemplateTitle ??
28
31
  components.ObjectFieldTemplateTitle,
@@ -3,7 +3,7 @@ import { useContext, useMemo } from "react";
3
3
  import { extractUiSchema, getDescription, getTitle } from "../../../utils";
4
4
  import { FormRegistry } from "../../FormRegistry";
5
5
  export const FieldTemplate = (props) => {
6
- const { components: { FieldWrapper, FieldTitle, FieldDescription, ErrorMessage, FieldHelp, RequiredIndicator, FieldInfo, }, } = useContext(FormRegistry);
6
+ const { components: { FieldWrapper, FieldTitleInfoWrapper, FieldTitle, FieldDescription, ErrorMessage, FieldHelp, RequiredIndicator, FieldInfo, }, } = useContext(FormRegistry);
7
7
  const { name, uiSchema, children, ...otherProps } = props;
8
8
  const title = getTitle(props);
9
9
  const description = getDescription(props);
@@ -20,5 +20,5 @@ export const FieldTemplate = (props) => {
20
20
  ...wrapperProps,
21
21
  ...dataAttributes, // This will only include data-* attributes
22
22
  };
23
- return (_jsxs(FieldWrapper, { ...mergedWrapperProps, "$isDisabled": isDisabled, children: [title && (_jsxs(FieldTitle, { ...titleProps, htmlFor: name, children: [title, props.required && _jsx(RequiredIndicator, {})] })), info && _jsx(FieldInfo, { ...info }), description && (_jsx(FieldDescription, { ...descriptionProps, children: description })), children, help && _jsx(FieldHelp, { ...helpProps, children: help }), _jsx(ErrorMessage, { ...errorProps, name: name })] }));
23
+ return (_jsxs(FieldWrapper, { ...mergedWrapperProps, "$isDisabled": isDisabled, children: [_jsxs(FieldTitleInfoWrapper, { children: [title && (_jsxs(FieldTitle, { ...titleProps, htmlFor: name, children: [title, props.required && _jsx(RequiredIndicator, {})] })), info && _jsx(FieldInfo, { ...info })] }), description && (_jsx(FieldDescription, { ...descriptionProps, children: description })), children, help && _jsx(FieldHelp, { ...helpProps, children: help }), _jsx(ErrorMessage, { ...errorProps, name: name })] }));
24
24
  };
@@ -5,7 +5,7 @@ import { FormRegistry } from "../../FormRegistry";
5
5
  import { getComponents } from "./styledComponents";
6
6
  export const ObjectFieldTemplate = (props) => {
7
7
  const { components } = useContext(FormRegistry);
8
- const { Wrapper, Title, Description, Help, Info, RequiredIndicator, ErrorMessage, } = getComponents(components);
8
+ const { Wrapper, Title, TitleInfoWrapper, Description, Help, Info, RequiredIndicator, ErrorMessage, } = getComponents(components);
9
9
  const { children, uiSchema, ...otherProps } = props;
10
10
  const title = getTitle(props);
11
11
  const description = getDescription(props);
@@ -24,5 +24,5 @@ export const ObjectFieldTemplate = (props) => {
24
24
  ...wrapperProps,
25
25
  ...dataAttributes,
26
26
  };
27
- return (_jsxs(Wrapper, { ...mergedWrapperProps, children: [title && (_jsxs(Title, { ...titleProps, children: [title, props?.required && _jsx(RequiredIndicator, {})] })), info && _jsx(Info, { ...info }), description && (_jsx(Description, { ...descriptionProps, children: description })), children, help && _jsx(Help, { ...helpProps, children: help })] }));
27
+ return (_jsxs(Wrapper, { ...mergedWrapperProps, children: [_jsxs(TitleInfoWrapper, { children: [title && (_jsxs(Title, { ...titleProps, children: [title, props?.required && _jsx(RequiredIndicator, {})] })), info && _jsx(Info, { ...info })] }), description && (_jsx(Description, { ...descriptionProps, children: description })), children, help && _jsx(Help, { ...helpProps, children: help })] }));
28
28
  };
@@ -1,6 +1,8 @@
1
1
  import { lighten } from "polished";
2
2
  import { styled } from "styled-components";
3
3
  export const ObjectFieldTemplateWrapper = styled.fieldset `
4
+ display: flex;
5
+ flex-direction: column;
4
6
  color: ${(props) => props.theme.color.text.default};
5
7
  font-family: ${(props) => props.theme.typography.fontFamily.base};
6
8
  margin-inline: 0;
@@ -23,6 +25,11 @@ export const ObjectFieldTemplateTitle = styled.legend `
23
25
  color: ${(props) => props.theme.color.text.default};
24
26
  font-family: ${(props) => props.theme.typography.fontFamily.base};
25
27
  `;
28
+ export const ObjectFieldTitleInfoWrapper = styled.div `
29
+ display: flex;
30
+ flex-direction: row;
31
+ flex-wrap: wrap;
32
+ `;
26
33
  export const ObjectFieldTemplateDescription = undefined;
27
34
  export const ObjectFieldTemplateHelp = undefined;
28
35
  export const ObjectFieldTemplateInfo = undefined;
@@ -32,6 +39,7 @@ export function getComponents(components) {
32
39
  return {
33
40
  Wrapper: components.ObjectFieldTemplateWrapper,
34
41
  Title: components.ObjectFieldTemplateTitle,
42
+ TitleInfoWrapper: components.ObjectFieldTitleInfoWrapper,
35
43
  Description: components.ObjectFieldTemplateDescription ?? components.FieldDescription,
36
44
  Help: components.ObjectFieldTemplateHelp ?? components.FieldHelp,
37
45
  Info: components.ObjectFieldTemplateInfo ?? components.FieldInfo,
@@ -3,6 +3,8 @@ import { FieldInfoBoxElementProps, FieldInfoProps } from "../../common/types/Fie
3
3
  export declare const FieldInfoBoxElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, FieldInfoBoxElementProps>> & string;
4
4
  export declare const FieldInfoBoxArrowElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, FieldInfoBoxElementProps>> & string;
5
5
  export declare const FieldInfoBoxInnerElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
6
+ export declare const InlineFieldInfoBoxInnerElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
6
7
  export declare const FieldInfoContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, never>> & string;
7
8
  export declare const FieldInfoLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
9
+ export declare const InlineFieldInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
8
10
  export declare const FieldInfo: React.FC<FieldInfoProps>;
@@ -3,6 +3,7 @@ import * as formik from "formik";
3
3
  export declare const FieldWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
4
4
  $isDisabled?: boolean;
5
5
  }>> & string;
6
+ export declare const FieldTitleInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
6
7
  export declare const FieldTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
7
8
  export declare const FieldDescription: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
8
9
  export declare const FieldHelp: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
@@ -15,6 +15,7 @@ export declare const components: {
15
15
  FieldWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
16
16
  $isDisabled?: boolean;
17
17
  }>> & string;
18
+ FieldTitleInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
18
19
  FieldTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
19
20
  FieldDescription: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
20
21
  FieldHelp: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
@@ -29,8 +30,10 @@ export declare const components: {
29
30
  FieldInfoBoxElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("../../common/types/FieldInfo").FieldInfoBoxElementProps>> & string;
30
31
  FieldInfoBoxArrowElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("../../common/types/FieldInfo").FieldInfoBoxElementProps>> & string;
31
32
  FieldInfoBoxInnerElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
33
+ InlineFieldInfoBoxInnerElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
32
34
  FieldInfoContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, never>> & string;
33
35
  FieldInfoLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
36
+ InlineFieldInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
34
37
  FieldInfo: React.FC<import("../../common/types/FieldInfo").FieldInfoProps>;
35
38
  ErrorMessage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("formik").ErrorMessageProps, never>> & string & Omit<import("react").FC<import("formik").ErrorMessageProps> & import("hoist-non-react-statics").NonReactStatics<import("react").ComponentClass<import("formik").ErrorMessageProps & {
36
39
  formik: import("formik").FormikContextType<import("formik").ErrorMessageProps & {
@@ -42,6 +45,7 @@ export declare const components: {
42
45
  getComponents(components: ComponentsType): {
43
46
  Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, never>> & string;
44
47
  Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, never>> & string;
48
+ TitleInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
45
49
  Description: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
46
50
  Help: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
47
51
  Info: import("react").FC<import("../../common/types/FieldInfo").FieldInfoProps>;
@@ -54,12 +58,14 @@ export declare const components: {
54
58
  };
55
59
  ObjectFieldTemplateWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, never>> & string;
56
60
  ObjectFieldTemplateTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, never>> & string;
61
+ ObjectFieldTitleInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
57
62
  ObjectFieldTemplateDescription: typeof Field.FieldDescription | undefined;
58
63
  ObjectFieldTemplateHelp: typeof Field.FieldHelp | undefined;
59
64
  ObjectFieldTemplateInfo: typeof FieldInfo.FieldInfo | undefined;
60
65
  ObjectFieldTemplateRequiredIndicator: typeof RequiredIndicator.RequiredIndicator | undefined;
61
66
  ObjectFieldTemplateErrorMessage: typeof ErrorMessage.ErrorMessage | undefined;
62
67
  CollapsibleObjectFieldTemplateWrapper: typeof import("../templates/ObjectFieldTemplate/styledComponents").ObjectFieldTemplateWrapper | undefined;
68
+ CollapsibleObjectTitleInfoWrapper: typeof import("../templates/ObjectFieldTemplate/styledComponents").ObjectFieldTitleInfoWrapper | undefined;
63
69
  CollapsibleObjectFieldTemplateIcon: typeof Icon.Icon | undefined;
64
70
  CollapsibleObjectFieldTemplateTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, never>, "ref"> & {
65
71
  ref?: ((instance: HTMLLegendElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLLegendElement> | null | undefined;
@@ -71,6 +77,7 @@ export declare const components: {
71
77
  CollapsibleObjectFieldTemplateErrorMessage: typeof import("../templates/ObjectFieldTemplate/styledComponents").ObjectFieldTemplateErrorMessage | undefined;
72
78
  CollapsibleObjectFieldTemplateToggle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Readonly<import("@nolwenture/component-library").ButtonProps>, never>> & string & Omit<typeof import("@nolwenture/component-library").Button, keyof import("react").Component<any, {}, any>>;
73
79
  CollapsibleObjectFieldTemplateChildWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
80
+ ArrayFieldTitleInfoWrapper: typeof import("../templates/ObjectFieldTemplate/styledComponents").ObjectFieldTitleInfoWrapper | undefined;
74
81
  ArrayFieldTemplateWrapper: typeof import("../templates/ObjectFieldTemplate/styledComponents").ObjectFieldTemplateWrapper | undefined;
75
82
  ArrayFieldTemplateIcon: typeof Icon.Icon | undefined;
76
83
  ArrayFieldTemplateTitle: typeof import("../templates/ObjectFieldTemplate/styledComponents").ObjectFieldTemplateTitle | undefined;
@@ -4,7 +4,8 @@ import { FieldInfo } from "../../components/FieldInfo";
4
4
  import { FieldDescription, FieldHelp } from "../../components/FieldInput";
5
5
  import { Icon } from "../../components/Icon";
6
6
  import { RequiredIndicator } from "../../components/RequiredIndicator";
7
- import { ObjectFieldTemplateWrapper, ObjectFieldTemplateTitle } from "../ObjectFieldTemplate/styledComponents";
7
+ import { ObjectFieldTemplateWrapper, ObjectFieldTemplateTitle, ObjectFieldTitleInfoWrapper } from "../ObjectFieldTemplate/styledComponents";
8
+ export declare const ArrayFieldTitleInfoWrapper: typeof ObjectFieldTitleInfoWrapper | undefined;
8
9
  export declare const ArrayFieldTemplateWrapper: typeof ObjectFieldTemplateWrapper | undefined;
9
10
  export declare const ArrayFieldTemplateIcon: typeof Icon | undefined;
10
11
  export declare const ArrayFieldTemplateTitle: typeof ObjectFieldTemplateTitle | undefined;
@@ -15,6 +16,7 @@ export declare const ArrayFieldTemplateRequiredIndicator: typeof RequiredIndicat
15
16
  export declare const ArrayFieldTemplateErrorMessage: typeof ErrorMessage | undefined;
16
17
  export declare function getComponents(components: ComponentsType): {
17
18
  Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, never>> & string;
19
+ TitleInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
18
20
  Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, never>> & string;
19
21
  Description: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
20
22
  Help: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
@@ -1,8 +1,9 @@
1
1
  import type { ComponentsType } from "../../components";
2
- import { ObjectFieldTemplateDescription, ObjectFieldTemplateErrorMessage, ObjectFieldTemplateHelp, ObjectFieldTemplateInfo, ObjectFieldTemplateRequiredIndicator, ObjectFieldTemplateWrapper } from "../ObjectFieldTemplate/styledComponents";
2
+ import { ObjectFieldTemplateDescription, ObjectFieldTemplateErrorMessage, ObjectFieldTemplateHelp, ObjectFieldTemplateInfo, ObjectFieldTemplateRequiredIndicator, ObjectFieldTemplateWrapper, ObjectFieldTitleInfoWrapper } from "../ObjectFieldTemplate/styledComponents";
3
3
  import { Icon } from "../../components/Icon";
4
4
  import { Button } from "@nolwenture/component-library";
5
5
  export declare const CollapsibleObjectFieldTemplateWrapper: typeof ObjectFieldTemplateWrapper | undefined;
6
+ export declare const CollapsibleObjectTitleInfoWrapper: typeof ObjectFieldTitleInfoWrapper | undefined;
6
7
  export declare const CollapsibleObjectFieldTemplateIcon: typeof Icon | undefined;
7
8
  export declare const CollapsibleObjectFieldTemplateTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, never>, "ref"> & {
8
9
  ref?: ((instance: HTMLLegendElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLLegendElement> | null | undefined;
@@ -16,6 +17,7 @@ export declare const CollapsibleObjectFieldTemplateToggle: import("styled-compon
16
17
  export declare const CollapsibleObjectFieldTemplateChildWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
17
18
  export declare function getComponents(components: ComponentsType): {
18
19
  Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, never>> & string;
20
+ TitleInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
19
21
  Icon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
20
22
  Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, never>, "ref"> & {
21
23
  ref?: ((instance: HTMLLegendElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLLegendElement> | null | undefined;
@@ -5,6 +5,7 @@ import { RequiredIndicator } from "../../components/RequiredIndicator";
5
5
  import { ErrorMessage } from "../../components/ErrorMessage";
6
6
  export declare const ObjectFieldTemplateWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, never>> & string;
7
7
  export declare const ObjectFieldTemplateTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, never>> & string;
8
+ export declare const ObjectFieldTitleInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
8
9
  export declare const ObjectFieldTemplateDescription: typeof FieldDescription | undefined;
9
10
  export declare const ObjectFieldTemplateHelp: typeof FieldHelp | undefined;
10
11
  export declare const ObjectFieldTemplateInfo: typeof FieldInfo | undefined;
@@ -13,6 +14,7 @@ export declare const ObjectFieldTemplateErrorMessage: typeof ErrorMessage | unde
13
14
  export declare function getComponents(components: ComponentsType): {
14
15
  Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, never>> & string;
15
16
  Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, never>> & string;
17
+ TitleInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
16
18
  Description: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
17
19
  Help: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
18
20
  Info: import("react").FC<import("../../../common/types/FieldInfo").FieldInfoProps>;
@@ -4,6 +4,7 @@ export declare const templateComponents: {
4
4
  getComponents(components: import("..").ComponentsType): {
5
5
  Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, never>> & string;
6
6
  Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, never>> & string;
7
+ TitleInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
7
8
  Description: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
8
9
  Help: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
9
10
  Info: import("react").FC<import("../../common/types/FieldInfo").FieldInfoProps>;
@@ -16,12 +17,14 @@ export declare const templateComponents: {
16
17
  };
17
18
  ObjectFieldTemplateWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, never>> & string;
18
19
  ObjectFieldTemplateTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, never>> & string;
20
+ ObjectFieldTitleInfoWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
19
21
  ObjectFieldTemplateDescription: typeof import("../components/FieldInput").FieldDescription | undefined;
20
22
  ObjectFieldTemplateHelp: typeof import("../components/FieldInput").FieldHelp | undefined;
21
23
  ObjectFieldTemplateInfo: typeof import("../components/FieldInfo").FieldInfo | undefined;
22
24
  ObjectFieldTemplateRequiredIndicator: typeof import("../components/RequiredIndicator").RequiredIndicator | undefined;
23
25
  ObjectFieldTemplateErrorMessage: typeof import("../components/ErrorMessage").ErrorMessage | undefined;
24
26
  CollapsibleObjectFieldTemplateWrapper: typeof ObjectFieldTemplate.components.ObjectFieldTemplateWrapper | undefined;
27
+ CollapsibleObjectTitleInfoWrapper: typeof ObjectFieldTemplate.components.ObjectFieldTitleInfoWrapper | undefined;
25
28
  CollapsibleObjectFieldTemplateIcon: typeof import("../components/Icon").Icon | undefined;
26
29
  CollapsibleObjectFieldTemplateTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, never>, "ref"> & {
27
30
  ref?: ((instance: HTMLLegendElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLLegendElement> | null | undefined;
@@ -33,6 +36,7 @@ export declare const templateComponents: {
33
36
  CollapsibleObjectFieldTemplateErrorMessage: typeof ObjectFieldTemplate.components.ObjectFieldTemplateErrorMessage | undefined;
34
37
  CollapsibleObjectFieldTemplateToggle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Readonly<import("@nolwenture/component-library").ButtonProps>, never>> & string & Omit<typeof import("@nolwenture/component-library").Button, keyof import("react").Component<any, {}, any>>;
35
38
  CollapsibleObjectFieldTemplateChildWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
39
+ ArrayFieldTitleInfoWrapper: typeof ObjectFieldTemplate.components.ObjectFieldTitleInfoWrapper | undefined;
36
40
  ArrayFieldTemplateWrapper: typeof ObjectFieldTemplate.components.ObjectFieldTemplateWrapper | undefined;
37
41
  ArrayFieldTemplateIcon: typeof import("../components/Icon").Icon | undefined;
38
42
  ArrayFieldTemplateTitle: typeof ObjectFieldTemplate.components.ObjectFieldTemplateTitle | undefined;
@@ -8,4 +8,5 @@ export type FieldInfoProps = {
8
8
  position?: "top" | "right" | "bottom" | "left";
9
9
  className?: string;
10
10
  props?: any;
11
+ display?: "tooltip" | "inline";
11
12
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nolwenture/formik-jsonschema-form",
3
- "version": "1.0.5",
3
+ "version": "1.0.6",
4
4
  "description": "Formik form generation from json schema",
5
5
  "author": "anttivikman <antti.vikman@nolwenture.com>",
6
6
  "contributors": [