Skip to content
This repository has been archived by the owner on Dec 11, 2021. It is now read-only.

Add labelClass option to block definition and closedOnAdd option #13

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
+5 −3
Open

Add labelClass option to block definition and closedOnAdd option #13

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
f6ad648
Add labelClass option to block definition
joeyjurjens Oct 31, 2020
a7fec90
Option to have blocks closed on add.
joeyjurjens Nov 2, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions src/StreamField.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ function lazyFunction(f) {
const BlockDefinitionType = PropTypes.shape({
key: PropTypes.string.isRequired,
label: PropTypes.string,
labelClass: PropTypes.string,
required: PropTypes.bool,
default: PropTypes.any,
icon: PropTypes.string,
Expand All @@ -29,6 +30,7 @@ const BlockDefinitionType = PropTypes.shape({
minNum: PropTypes.number,
maxNum: PropTypes.number,
closed: PropTypes.bool,
closedOnAdd: PropTypes.bool,
titleTemplate: PropTypes.string,
html: PropTypes.string,
isStruct: PropTypes.bool,
Expand Down
4 changes: 2 additions & 2 deletions src/StructChildField.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,8 +31,8 @@ class StructChildField extends React.Component {
const {fieldId, blockId, blockDefinition} = this.props;
return (
<div className={classNames('field',
!!blockDefinition.required && 'required')}>
<label className='field__label' htmlFor={getFieldName(blockId)}>
!!blockDefinition.required && 'required', )}>
<label className={classNames('field__label', blockDefinition.labelClass)} htmlFor={getFieldName(blockId)}>
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This comment is for react-streamfield team: If there is some way to get className on the div, that would probably also work (higher level in the dom tree is usually more "future-proof"). Or is there already a recommended way to accomplish customizing the HTML output?

{getLabel(blockDefinition)}
</label>
<FieldInput fieldId={fieldId} blockId={blockId} />
Expand Down
2 changes: 1 addition & 1 deletion src/processing/utils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -227,7 +227,7 @@ export const getNewBlock = (parentId, blockDefinition, value=null) => {
type: blockDefinition.key,
value: value,
hidden: true,
closed: false,
closed: blockDefinition.closedOnAdd === undefined ? false : blockDefinition.closedOnAdd,
shouldUpdate: false,
},
extraBlocks,
Expand Down