diff --git a/src/Components/App/MenuActions.ts b/src/Components/App/MenuActions.ts index 1e37328..601e4c7 100644 --- a/src/Components/App/MenuActions.ts +++ b/src/Components/App/MenuActions.ts @@ -5,6 +5,7 @@ import { fetchConfiguration } from '../API/api'; import { IEditorState } from '../../Interfaces/IEditorState'; import { LoadState } from './Load'; import { XPositionReference } from '../../Enums/XPositionReference'; +import { DEFAULT_MAINCONTAINER_PROPS } from '../../utils/default'; export function NewEditor( setEditorState: Dispatch>, @@ -17,19 +18,9 @@ export function NewEditor( const MainContainer = new ContainerModel( null, { - id: 'main', - parentId: 'null', - x: 0, - y: 0, + ...DEFAULT_MAINCONTAINER_PROPS, width: Number(configuration.MainContainer.Width), - height: Number(configuration.MainContainer.Height), - isRigidBody: false, - isAnchor: false, - XPositionReference: XPositionReference.Left, - style: { - fillOpacity: 0, - stroke: 'black' - } + height: Number(configuration.MainContainer.Height) } ); diff --git a/src/Components/Editor/Behaviors/RigidBodyBehaviors.ts b/src/Components/Editor/Behaviors/RigidBodyBehaviors.ts index eab0970..5d7b729 100644 --- a/src/Components/Editor/Behaviors/RigidBodyBehaviors.ts +++ b/src/Components/Editor/Behaviors/RigidBodyBehaviors.ts @@ -164,9 +164,6 @@ export function constraintBodyInsideUnallocatedWidth( // We want the container to fit automatically inside the available space // even if it means to resize the container const availableWidth: ISizePointer | undefined = availableWidths.find((width) => { - if (container.properties.minWidth === undefined) { - return true; - } return isFitting(container.properties.minWidth, width); }); diff --git a/src/Components/ElementsSidebar/ElementsSidebar.test.tsx b/src/Components/ElementsSidebar/ElementsSidebar.test.tsx index f207a46..bf88f22 100644 --- a/src/Components/ElementsSidebar/ElementsSidebar.test.tsx +++ b/src/Components/ElementsSidebar/ElementsSidebar.test.tsx @@ -18,6 +18,7 @@ describe.concurrent('Elements sidebar', () => { y: 0, width: 2000, height: 100, + minWidth: 1, XPositionReference: XPositionReference.Left, isRigidBody: false, isAnchor: false @@ -50,6 +51,7 @@ describe.concurrent('Elements sidebar', () => { y: 0, width: 2000, height: 100, + minWidth: 1, isRigidBody: false, isAnchor: false, XPositionReference: XPositionReference.Left @@ -106,6 +108,7 @@ describe.concurrent('Elements sidebar', () => { parentId: '', x: 0, y: 0, + minWidth: 1, width: 2000, height: 100, XPositionReference: XPositionReference.Left, @@ -124,6 +127,7 @@ describe.concurrent('Elements sidebar', () => { parentId: 'main', x: 0, y: 0, + minWidth: 1, width: 0, height: 0, isRigidBody: false, @@ -143,6 +147,7 @@ describe.concurrent('Elements sidebar', () => { parentId: 'main', x: 0, y: 0, + minWidth: 1, width: 0, height: 0, XPositionReference: XPositionReference.Left, @@ -182,6 +187,7 @@ describe.concurrent('Elements sidebar', () => { parentId: '', x: 0, y: 0, + minWidth: 1, width: 2000, height: 100, XPositionReference: XPositionReference.Left, @@ -199,6 +205,7 @@ describe.concurrent('Elements sidebar', () => { parentId: 'main', x: 0, y: 0, + minWidth: 1, width: 0, height: 0, XPositionReference: XPositionReference.Left, diff --git a/src/Components/InputGroup/InputGroup.tsx b/src/Components/InputGroup/InputGroup.tsx index bc794d3..ff67a6f 100644 --- a/src/Components/InputGroup/InputGroup.tsx +++ b/src/Components/InputGroup/InputGroup.tsx @@ -11,6 +11,7 @@ interface IInputGroupProps { checked?: boolean defaultValue?: string defaultChecked?: boolean + min?: number isDisabled?: boolean onChange?: (event: React.ChangeEvent) => void } @@ -42,6 +43,7 @@ export const InputGroup: React.FunctionComponent = (props) => checked={props.checked} defaultChecked={props.defaultChecked} onChange={props.onChange} + min={props.min} disabled={props.isDisabled} /> ; diff --git a/src/Components/Properties/DynamicForm.tsx b/src/Components/Properties/DynamicForm.tsx index b5665b6..76bc4e1 100644 --- a/src/Components/Properties/DynamicForm.tsx +++ b/src/Components/Properties/DynamicForm.tsx @@ -70,12 +70,23 @@ const DynamicForm: React.FunctionComponent = (props) => { value={props.properties.y.toString()} onChange={(event) => props.onChange('y', Number(event.target.value))} /> + props.onChange('minWidth', Number(event.target.value))} + /> props.onChange('width', Number(event.target.value))} /> @@ -85,6 +96,7 @@ const DynamicForm: React.FunctionComponent = (props) => { labelClassName='' inputClassName='' type='number' + min={0} value={props.properties.height.toString()} onChange={(event) => props.onChange('height', Number(event.target.value))} /> diff --git a/src/Components/Properties/Properties.test.tsx b/src/Components/Properties/Properties.test.tsx index dc9473e..0ede184 100644 --- a/src/Components/Properties/Properties.test.tsx +++ b/src/Components/Properties/Properties.test.tsx @@ -27,6 +27,7 @@ describe.concurrent('Properties', () => { y: 1, width: 1, height: 1, + minWidth: 1, XPositionReference: XPositionReference.Left, isRigidBody: false, isAnchor: false diff --git a/src/Components/Properties/StaticForm.tsx b/src/Components/Properties/StaticForm.tsx index 9f6055b..2b0bd6a 100644 --- a/src/Components/Properties/StaticForm.tsx +++ b/src/Components/Properties/StaticForm.tsx @@ -68,12 +68,22 @@ const StaticForm: React.FunctionComponent = (props) => { type='number' defaultValue={props.properties.y.toString()} /> + = (props) => { labelClassName='' inputClassName='' type='number' + min={1} defaultValue={props.properties.height.toString()} /> by a customized "SVG". It is not really an svg but it at least allows diff --git a/src/utils/default.ts b/src/utils/default.ts index 6eaf561..cc7acf6 100644 --- a/src/utils/default.ts +++ b/src/utils/default.ts @@ -33,6 +33,7 @@ export const DEFAULT_MAINCONTAINER_PROPS: IProperties = { parentId: 'null', x: 0, y: 0, + minWidth: 1, width: Number(DEFAULT_CONFIG.MainContainer.Width), height: Number(DEFAULT_CONFIG.MainContainer.Height), isRigidBody: false, @@ -61,7 +62,7 @@ export const GetDefaultContainerProps = ( isRigidBody: false, isAnchor: false, XPositionReference: containerConfig.XPositionReference ?? XPositionReference.Left, - minWidth: containerConfig.MinWidth, + minWidth: containerConfig.MinWidth ?? 0, customSVG: containerConfig.CustomSVG, style: containerConfig.Style, userData: containerConfig.UserData