@evoke-platform/ui-components 1.10.0-dev.13 → 1.10.0-dev.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/published/components/custom/FormV2/FormRenderer.js +4 -4
  2. package/dist/published/components/custom/FormV2/components/Header.d.ts +1 -1
  3. package/dist/published/components/custom/FormV2/components/Header.js +4 -6
  4. package/dist/published/components/custom/FormV2/components/ValidationFiles/ValidationErrors.js +1 -1
  5. package/package.json +1 -1
package/dist/published/components/custom/FormV2/FormRenderer.js CHANGED
@@ -32,7 +32,7 @@ const FormRendererInternal = (props) => {
32
32
  const [isInitializing, setIsInitializing] = useState(true);
33
33
  const [parameters, setParameters] = useState();
34
34
  const objectStore = useObject(objectId);
35
- const validationErrorsRef = useRef(null);
35
+ const validationContainerRef = useRef(null);
36
36
  const updateFetchedOptions = (newData) => {
37
37
  setFetchedOptions((prev) => ({
38
38
  ...prev,
@@ -139,8 +139,8 @@ const FormRendererInternal = (props) => {
139
139
  if (onSubmitErrorOverride) {
140
140
  onSubmitErrorOverride(errors);
141
141
  }
142
- else if (validationErrorsRef.current) {
143
- validationErrorsRef.current.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
142
+ else if (validationContainerRef.current) {
143
+ validationContainerRef.current.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
144
144
  }
145
145
  };
146
146
  async function unregisterHiddenFieldsAndSubmit() {
@@ -157,7 +157,7 @@ const FormRendererInternal = (props) => {
157
157
  shouldShowValidationErrors: isSubmitted,
158
158
  isDeleteForm: form.id === '',
159
159
  action,
160
- validationErrorsRef: validationErrorsRef,
160
+ validationContainerRef: validationContainerRef,
161
161
  autosaveEnabled: !!form.autosaveActionId,
162
162
  };
163
163
  const footerProps = {
package/dist/published/components/custom/FormV2/components/Header.d.ts CHANGED
@@ -6,7 +6,7 @@ import { ExpandedSection } from './types';
6
6
  export type HeaderProps = {
7
7
  hasAccordions: boolean;
8
8
  shouldShowValidationErrors?: boolean;
9
- validationErrorsRef?: React.Ref<HTMLDivElement>;
9
+ validationContainerRef?: React.Ref<HTMLDivElement>;
10
10
  title?: string;
11
11
  expandedSections?: ExpandedSection[];
12
12
  onExpandAll?: () => void;
package/dist/published/components/custom/FormV2/components/Header.js CHANGED
@@ -7,7 +7,7 @@ import { Typography } from '../../../core/Typography';
7
7
  import Box from '../../../layout/Box/Box';
8
8
  import ValidationErrors from './ValidationFiles/ValidationErrors';
9
9
  const Header = (props) => {
10
- const { title, errors, hasAccordions, shouldShowValidationErrors, validationErrorsRef, sx, isDeleteForm, autosaveEnabled, } = props;
10
+ const { title, errors, hasAccordions, shouldShowValidationErrors, validationContainerRef, sx, isDeleteForm, autosaveEnabled, } = props;
11
11
  const { width } = useFormContext();
12
12
  const { breakpoints, isBelow } = useWidgetSize({
13
13
  scroll: false,
@@ -16,6 +16,7 @@ const Header = (props) => {
16
16
  const isSmallerThanMd = isBelow('md');
17
17
  const { isXs, isSm } = breakpoints;
18
18
  const isSmall = isSm || isXs;
19
+ const displayValidationErrors = shouldShowValidationErrors && !isEmpty(errors);
19
20
  return (React.createElement(Box, { sx: {
20
21
  paddingX: isSmallerThanMd ? 2 : 3,
21
22
  paddingTop: '0px',
@@ -26,11 +27,8 @@ const Header = (props) => {
26
27
  // when rendering the default delete action, we don't want a border
27
28
  borderBottom: isDeleteForm ? undefined : '1px solid #e9ecef',
28
29
  gap: isSm || isXs ? 2 : 3,
29
- '.evoke-form-renderer-header': {
30
- flex: '1 1 100%',
31
- },
32
30
  ...sx,
33
- } },
31
+ }, ref: validationContainerRef },
34
32
  title && (React.createElement(Box, { sx: { flex: '1 1 auto', minWidth: 0, display: 'flex', alignItems: 'center', gap: 1 } },
35
33
  React.createElement(Title, { ...props }),
36
34
  props.autosaving && !isSmall && React.createElement(SavingIndicator, null))),
@@ -45,7 +43,7 @@ const Header = (props) => {
45
43
  alignItems: 'center',
46
44
  marginLeft: 0.5,
47
45
  } }, props.autosaving && isSmall ? React.createElement(SavingIndicator, null) : React.createElement(Box, { sx: { width: '100%' } }))))),
48
- React.createElement("div", { ref: validationErrorsRef, className: 'evoke-form-renderer-header' }, shouldShowValidationErrors && !isEmpty(errors) ? React.createElement(ValidationErrors, { errors: errors }) : null)));
46
+ displayValidationErrors ? React.createElement(ValidationErrors, { errors: errors }) : null));
49
47
  };
50
48
  // Default slot components for convenience
51
49
  export const Title = ({ title }) => (React.createElement(Typography, { sx: {
package/dist/published/components/custom/FormV2/components/ValidationFiles/ValidationErrors.js CHANGED
@@ -29,7 +29,7 @@ function ValidationErrors(props) {
29
29
  border: '1px solid #721c24',
30
30
  padding: '8px 24px',
31
31
  borderRadius: '4px',
32
- flex: 1,
32
+ flex: '1 1 100%',
33
33
  ...sx,
34
34
  } },
35
35
  React.createElement(Typography, { sx: { color: '#721c24', mt: '16px', mb: '8px' } }, "Please fix the following errors before submitting:"),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@evoke-platform/ui-components",
3
- "version": "1.10.0-dev.13",
3
+ "version": "1.10.0-dev.14",
4
4
  "description": "",
5
5
  "main": "dist/published/index.js",
6
6
  "module": "dist/published/index.js",