Skip to content

Commit 3e155d0

Browse files
committed
fix: additional props styling
1 parent a16107d commit 3e155d0

File tree

4 files changed

+12
-10
lines changed

4 files changed

+12
-10
lines changed

src/Common/RJSF/rjsfForm.scss

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,18 +17,22 @@
1717
}
1818

1919
&__additional-fields {
20-
grid-template-columns: 1fr 1fr minmax(20px, auto);
20+
grid-template-columns: 1fr 1fr;
2121
}
2222

2323
&__array-field-item {
2424
grid-template-columns: 1fr auto;
25-
z-index: 0;
26-
background: transparent;
2725

2826
& > :first-child {
2927
// This is added as the array field itself has a margin bottom
3028
margin: 0;
3129
}
30+
}
31+
32+
&__additional-fields,
33+
&__array-field-items {
34+
z-index: 0;
35+
background: transparent;
3236

3337
&:has(> .remove-btn__container:hover)::after {
3438
background: var(--R50);

src/Common/RJSF/templates/ObjectFieldTemplate.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,12 +19,12 @@ import {
1919
ObjectFieldTemplatePropertyType,
2020
ObjectFieldTemplateProps,
2121
canExpand,
22-
getTemplate,
2322
getUiOptions,
2423
titleId,
2524
} from '@rjsf/utils'
2625
import { FieldRowWithLabel } from '../common/FieldRow'
2726
import { TitleField } from './TitleField'
27+
import { AddButton } from './ButtonTemplates'
2828

2929
const Field = ({
3030
disabled,
@@ -39,13 +39,11 @@ const Field = ({
3939
title,
4040
uiSchema,
4141
}: ObjectFieldTemplateProps) => {
42-
const {
43-
ButtonTemplates: { AddButton },
44-
} = registry.templates
4542
const hasAdditionalProperties = !!schema.additionalProperties
4643

4744
const ActionButton = canExpand(schema, uiSchema, formData) && (
4845
<AddButton
46+
label={title}
4947
className="object-property-expand"
5048
onClick={onAddClick(schema)}
5149
disabled={disabled || readonly}

src/Common/RJSF/templates/TitleField.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ import { ConditionalWrap } from '../../Helper'
1919
import { TitleFieldProps } from '@rjsf/utils'
2020
import { getTippyWrapperWithContent } from '../utils'
2121

22-
export const TitleField = ({ id, title, required, description }: TitleFieldProps & Record<'description', string>) => (
22+
export const TitleField = ({ id, title, required, description }: TitleFieldProps & Partial<Record<'description', string>>) => (
2323
<legend className="fs-13 fw-6 cn-9 lh-20 dc__no-border py-9 mb-0" id={id}>
2424
<ConditionalWrap condition={!!description} wrap={getTippyWrapperWithContent(description, 'top')}>
2525
<span className={`${description ? 'text-underline-dashed-300' : ''}`}>{title}</span>

src/Common/RJSF/templates/WrapIfAdditionalTemplate.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export const WrapIfAdditionalTemplate = ({
3838
return (
3939
<>
4040
{additional ? (
41-
<div className="rjsf-form-template__additional-fields display-grid dc__gap-8 flex-align-center">
41+
<div className="dc__position-rel rjsf-form-template__additional-fields display-grid dc__gap-8 flex-align-center">
4242
<div>
4343
<input
4444
type="text"
@@ -50,7 +50,7 @@ export const WrapIfAdditionalTemplate = ({
5050
/>
5151
</div>
5252
<div>{children}</div>
53-
<div>
53+
<div className="dc__position-abs remove-btn__container" style={{ right: "-28px", top: "9px" }}>
5454
<RemoveButton
5555
disabled={disabled || readonly}
5656
onClick={onDropPropertyClick(label)}

0 commit comments

Comments
 (0)