aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--package-lock.json101
-rw-r--r--package.json3
-rw-r--r--src/client/views/collections/CollectionViewChromes.scss1
-rw-r--r--src/client/views/collections/CollectionViewChromes.tsx56
-rw-r--r--src/client/views/collections/collectionGrid/CollectionGridView.scss8
-rw-r--r--src/client/views/collections/collectionGrid/CollectionGridView.tsx35
-rw-r--r--src/client/views/collections/collectionGrid/Grid.tsx8
7 files changed, 185 insertions, 27 deletions
diff --git a/package-lock.json b/package-lock.json
index 14b279ef6..d1db185a3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3532,6 +3532,11 @@
"delayed-stream": "~1.0.0"
}
},
+ "command-exists": {
+ "version": "1.2.6",
+ "resolved": "https://registry.npmjs.org/command-exists/-/command-exists-1.2.6.tgz",
+ "integrity": "sha512-Qst/zUUNmS/z3WziPxyqjrcz09pm+2Knbs5mAZL4VAE0sSrNY1/w8+/YxeHcoBTsO6iojA6BW7eFf27Eg2MRuw=="
+ },
"command-line-usage": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/command-line-usage/-/command-line-usage-4.1.0.tgz",
@@ -12948,6 +12953,11 @@
"os-tmpdir": "^1.0.0"
}
},
+ "p-debounce": {
+ "version": "1.0.0",
+ "resolved": "https://registry.npmjs.org/p-debounce/-/p-debounce-1.0.0.tgz",
+ "integrity": "sha1-y38svu/YegnrqGHhErZ1J+Yh4v0="
+ },
"p-defer": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/p-defer/-/p-defer-1.0.0.tgz",
@@ -15983,6 +15993,20 @@
"readable-stream": "^3.1.1"
}
},
+ "temp-dir": {
+ "version": "1.0.0",
+ "resolved": "https://registry.npmjs.org/temp-dir/-/temp-dir-1.0.0.tgz",
+ "integrity": "sha1-CnwOom06Oa+n4OvqnB/AvE2qAR0="
+ },
+ "tempy": {
+ "version": "0.2.1",
+ "resolved": "https://registry.npmjs.org/tempy/-/tempy-0.2.1.tgz",
+ "integrity": "sha512-LB83o9bfZGrntdqPuRdanIVCPReam9SOZKW0fOy5I9X3A854GGWi0tjCqoXEk84XIEYBc/x9Hq3EFop/H5wJaw==",
+ "requires": {
+ "temp-dir": "^1.0.0",
+ "unique-string": "^1.0.0"
+ }
+ },
"term-size": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/term-size/-/term-size-1.2.0.tgz",
@@ -16558,6 +16582,40 @@
"resolved": "https://registry.npmjs.org/typescript-collections/-/typescript-collections-1.3.3.tgz",
"integrity": "sha512-7sI4e/bZijOzyURng88oOFZCISQPTHozfE2sUu5AviFYk5QV7fYGb6YiDl+vKjF/pICA354JImBImL9XJWUvdQ=="
},
+ "typescript-language-server": {
+ "version": "0.4.0",
+ "resolved": "https://registry.npmjs.org/typescript-language-server/-/typescript-language-server-0.4.0.tgz",
+ "integrity": "sha512-K8jNOmDFn+QfrCh8ujby2pGDs5rpjYZQn+zvQnf42rxG4IHbfw5CHoMvbGkWPK/J5Gw8/l5K3i03kVZC2IBElg==",
+ "requires": {
+ "command-exists": "1.2.6",
+ "commander": "^2.11.0",
+ "fs-extra": "^7.0.0",
+ "p-debounce": "^1.0.0",
+ "tempy": "^0.2.1",
+ "vscode-languageserver": "^5.3.0-next",
+ "vscode-uri": "^1.0.5"
+ },
+ "dependencies": {
+ "fs-extra": {
+ "version": "7.0.1",
+ "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-7.0.1.tgz",
+ "integrity": "sha512-YJDaCJZEnBmcbw13fvdAM9AwNOJwOzrE4pqMqBq5nFiEqXUqHwlK4B+3pUw6JNvfSPtX05xFHtYy/1ni01eGCw==",
+ "requires": {
+ "graceful-fs": "^4.1.2",
+ "jsonfile": "^4.0.0",
+ "universalify": "^0.1.0"
+ }
+ },
+ "jsonfile": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
+ "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=",
+ "requires": {
+ "graceful-fs": "^4.1.6"
+ }
+ }
+ }
+ },
"typical": {
"version": "2.6.1",
"resolved": "https://registry.npmjs.org/typical/-/typical-2.6.1.tgz",
@@ -16712,6 +16770,11 @@
"crypto-random-string": "^1.0.0"
}
},
+ "universalify": {
+ "version": "0.1.2",
+ "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
+ "integrity": "sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg=="
+ },
"unpack-string": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/unpack-string/-/unpack-string-0.0.2.tgz",
@@ -16954,6 +17017,44 @@
"resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz",
"integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w="
},
+ "vscode-jsonrpc": {
+ "version": "5.0.1",
+ "resolved": "https://registry.npmjs.org/vscode-jsonrpc/-/vscode-jsonrpc-5.0.1.tgz",
+ "integrity": "sha512-JvONPptw3GAQGXlVV2utDcHx0BiY34FupW/kI6mZ5x06ER5DdPG/tXWMVHjTNULF5uKPOUUD0SaXg5QaubJL0A=="
+ },
+ "vscode-languageserver": {
+ "version": "5.3.0-next.10",
+ "resolved": "https://registry.npmjs.org/vscode-languageserver/-/vscode-languageserver-5.3.0-next.10.tgz",
+ "integrity": "sha512-QL7Fe1FT6PdLtVzwJeZ78pTic4eZbzLRy7yAQgPb9xalqqgZESR0+yDZPwJrM3E7PzOmwHBceYcJR54eQZ7Kng==",
+ "requires": {
+ "vscode-languageserver-protocol": "^3.15.0-next.8",
+ "vscode-textbuffer": "^1.0.0"
+ }
+ },
+ "vscode-languageserver-protocol": {
+ "version": "3.15.3",
+ "resolved": "https://registry.npmjs.org/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.15.3.tgz",
+ "integrity": "sha512-zrMuwHOAQRhjDSnflWdJG+O2ztMWss8GqUUB8dXLR/FPenwkiBNkMIJJYfSN6sgskvsF0rHAoBowNQfbyZnnvw==",
+ "requires": {
+ "vscode-jsonrpc": "^5.0.1",
+ "vscode-languageserver-types": "3.15.1"
+ }
+ },
+ "vscode-languageserver-types": {
+ "version": "3.15.1",
+ "resolved": "https://registry.npmjs.org/vscode-languageserver-types/-/vscode-languageserver-types-3.15.1.tgz",
+ "integrity": "sha512-+a9MPUQrNGRrGU630OGbYVQ+11iOIovjCkqxajPa9w57Sd5ruK8WQNsslzpa0x/QJqC8kRc2DUxWjIFwoNm4ZQ=="
+ },
+ "vscode-textbuffer": {
+ "version": "1.0.0",
+ "resolved": "https://registry.npmjs.org/vscode-textbuffer/-/vscode-textbuffer-1.0.0.tgz",
+ "integrity": "sha512-zPaHo4urgpwsm+PrJWfNakolRpryNja18SUip/qIIsfhuEqEIPEXMxHOlFPjvDC4JgTaimkncNW7UMXRJTY6ow=="
+ },
+ "vscode-uri": {
+ "version": "1.0.8",
+ "resolved": "https://registry.npmjs.org/vscode-uri/-/vscode-uri-1.0.8.tgz",
+ "integrity": "sha512-obtSWTlbJ+a+TFRYGaUumtVwb+InIUVI0Lu0VBUAPmj2cU5JutEXg3xUE0c2J5Tcy7h2DEKVJBFi+Y9ZSFzzPQ=="
+ },
"vue-template-compiler": {
"version": "2.6.11",
"resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.6.11.tgz",
diff --git a/package.json b/package.json
index 74b7bf9d1..a8ff42c91 100644
--- a/package.json
+++ b/package.json
@@ -206,10 +206,10 @@
"react-compound-slider": "^2.5.0",
"react-dom": "^16.12.0",
"react-grid-layout": "^0.18.3",
- "react-resizable": "^1.10.1",
"react-image-lightbox-with-rotate": "^5.1.1",
"react-jsx-parser": "^1.21.0",
"react-measure": "^2.2.4",
+ "react-resizable": "^1.10.1",
"react-table": "^6.11.5",
"readline": "^1.3.0",
"request": "^2.88.0",
@@ -223,6 +223,7 @@
"solr-node": "^1.2.1",
"standard-http-error": "^2.0.1",
"typescript-collections": "^1.3.3",
+ "typescript-language-server": "^0.4.0",
"url-loader": "^1.1.2",
"uuid": "^3.4.0",
"valid-url": "^1.0.9",
diff --git a/src/client/views/collections/CollectionViewChromes.scss b/src/client/views/collections/CollectionViewChromes.scss
index f6027471b..398b02d3f 100644
--- a/src/client/views/collections/CollectionViewChromes.scss
+++ b/src/client/views/collections/CollectionViewChromes.scss
@@ -183,6 +183,7 @@
width: 30%;
display: flex;
flex-direction: row;
+ margin-right: 5px;
.grid-icon {
margin-right: 5px;
diff --git a/src/client/views/collections/CollectionViewChromes.tsx b/src/client/views/collections/CollectionViewChromes.tsx
index 5a76a4605..95774adca 100644
--- a/src/client/views/collections/CollectionViewChromes.tsx
+++ b/src/client/views/collections/CollectionViewChromes.tsx
@@ -571,6 +571,7 @@ export class CollectionGridViewChrome extends React.Component<CollectionViewChro
private clicked: boolean = false;
private entered: boolean = false;
+ private decrementLimitReached: boolean = false;
/**
* Sets the value of `numCols` on the grid's Document to the value entered.
@@ -588,14 +589,14 @@ export class CollectionGridViewChrome extends React.Component<CollectionViewChro
/**
* Sets the value of `rowHeight` on the grid's Document to the value entered.
*/
- @undoBatch
- onRowHeightEnter = (e: React.KeyboardEvent<HTMLInputElement>) => {
- if (e.key === "Enter" || e.key === "Tab") {
- if (e.currentTarget.valueAsNumber > 0 && this.props.CollectionView.props.Document.rowHeight as number !== e.currentTarget.valueAsNumber) {
- this.props.CollectionView.props.Document.rowHeight = e.currentTarget.valueAsNumber;
- }
- }
- }
+ // @undoBatch
+ // onRowHeightEnter = (e: React.KeyboardEvent<HTMLInputElement>) => {
+ // if (e.key === "Enter" || e.key === "Tab") {
+ // if (e.currentTarget.valueAsNumber > 0 && this.props.CollectionView.props.Document.rowHeight as number !== e.currentTarget.valueAsNumber) {
+ // this.props.CollectionView.props.Document.rowHeight = e.currentTarget.valueAsNumber;
+ // }
+ // }
+ // }
/**
* Sets whether the grid is flexible or not on the grid's Document.
@@ -613,27 +614,44 @@ export class CollectionGridViewChrome extends React.Component<CollectionViewChro
onDecrementButtonClick = () => {
this.clicked = true;
- this.entered && (this.props.CollectionView.props.Document.numCols as number)++;
- undoBatch(() => (this.props.CollectionView.props.Document.numCols as number)--)();
+ if (!this.decrementLimitReached) {
+ this.entered && (this.props.CollectionView.props.Document.numCols as number)++;
+ undoBatch(() => (this.props.CollectionView.props.Document.numCols as number)--)();
+ }
this.entered = false;
}
incrementValue = () => {
this.entered = true;
- if (!this.clicked) {
+ if (!this.clicked && !this.decrementLimitReached) {
(this.props.CollectionView.props.Document.numCols as number)++;
}
+ this.decrementLimitReached = false;
this.clicked = false;
}
decrementValue = () => {
this.entered = true;
if (!this.clicked) {
- (this.props.CollectionView.props.Document.numCols as number)--;
+ if (this.props.CollectionView.props.Document.numCols as number !== 1) {
+ (this.props.CollectionView.props.Document.numCols as number)--;
+ }
+ else {
+ this.decrementLimitReached = true;
+ }
}
+
this.clicked = false;
}
+ toggleCollisions = () => {
+ this.props.CollectionView.props.Document.preventCollision = !this.props.CollectionView.props.Document.preventCollision;
+ }
+
+ changeCompactType = () => {
+ this.props.CollectionView.props.Document.compactType = this.props.CollectionView.props.Document.compactType === "vertical" ? "horizontal" : this.props.CollectionView.props.Document.compactType === "horizontal" ? "null" : "vertical";
+ }
+
render() {
return (
<div className="collectionGridViewChrome-cont" >
@@ -645,17 +663,23 @@ export class CollectionGridViewChrome extends React.Component<CollectionViewChro
<input className="columnButton" onClick={this.onIncrementButtonClick} onMouseEnter={this.incrementValue} onMouseLeave={this.decrementValue} type="button" value="↑" />
<input className="columnButton" style={{ marginRight: 5 }} onClick={this.onDecrementButtonClick} onMouseEnter={this.decrementValue} onMouseLeave={this.incrementValue} type="button" value="↓" />
</span>
- <span className="grid-control">
+ {/* <span className="grid-control">
<span className="grid-icon">
<FontAwesomeIcon icon="text-height" size="1x" />
</span>
<input className="collectionGridViewChrome-entryBox" type="number" placeholder={this.props.CollectionView.props.Document.rowHeight as string} onKeyDown={this.onRowHeightEnter} onClick={(e: React.MouseEvent<HTMLInputElement, MouseEvent>) => { e.stopPropagation(); e.preventDefault(); e.currentTarget.focus(); }} />
+ </span> */}
+ <span className="grid-control" style={{ width: "20%" }}>
+ <input style={{ marginRight: 5 }} type="checkbox" onClick={this.toggleCollisions} defaultChecked={!this.props.CollectionView.props.Document.preventCollision} />
+ <label className="flexLabel">Collisions </label>
</span>
+
+ <span className="grid-control">
+ <input style={{ marginRight: 5 }} type="button" onClick={this.changeCompactType} value={`Compact: ${this.props.CollectionView.props.Document.compactType}`} />
+ </span>
+
<span className="grid-control">
<input style={{ marginRight: 5 }} type="checkbox" onClick={this.toggleFlex} defaultChecked={this.props.CollectionView.props.Document.flexGrid as boolean} />
- <span className="grid-icon">
- <FontAwesomeIcon icon="arrow-up" size="1x" />
- </span>
<label className="flexLabel">Flexible</label>
</span>
</div>
diff --git a/src/client/views/collections/collectionGrid/CollectionGridView.scss b/src/client/views/collections/collectionGrid/CollectionGridView.scss
index e06e8dc90..578dae966 100644
--- a/src/client/views/collections/collectionGrid/CollectionGridView.scss
+++ b/src/client/views/collections/collectionGrid/CollectionGridView.scss
@@ -46,6 +46,14 @@
background: darkgrey;
opacity: 1;
}
+
+ .rowHeightSlider::-moz-range-thumb {
+ width: 10px;
+ height: 10px;
+ border-radius: 50%;
+ background: darkgrey;
+ opacity: 1;
+ }
}
.collectionGridView-addDocumentButton {
diff --git a/src/client/views/collections/collectionGrid/CollectionGridView.tsx b/src/client/views/collections/collectionGrid/CollectionGridView.tsx
index dd4e28e33..e97cb9f0e 100644
--- a/src/client/views/collections/collectionGrid/CollectionGridView.tsx
+++ b/src/client/views/collections/collectionGrid/CollectionGridView.tsx
@@ -18,6 +18,7 @@ import { SnappingManager } from '../../../util/SnappingManager';
import { Docs } from '../../../documents/Documents';
import { EditableView, EditableProps } from '../../EditableView';
import "./CollectionGridView.scss";
+import { ContextMenu } from '../../ContextMenu';
type GridSchema = makeInterface<[typeof documentSchema]>;
@@ -29,6 +30,7 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
@observable private _scroll: number = 0;
private changeListenerDisposer: Opt<Lambda>;
private rowHeight: number = 0;
+ private sliderDragged: boolean = false;
constructor(props: Readonly<SubCollectionViewProps>) {
super(props);
@@ -37,6 +39,9 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
this.props.Document.rowHeight = NumCast(this.props.Document.rowHeight, 100);
this.props.Document.flexGrid = BoolCast(this.props.Document.flexGrid, true);
+ this.props.Document.compactType = StrCast(this.props.Document.compactType, "vertical");
+ this.props.Document.preventCollision = BoolCast(this.props.Document.preventCollision, false);
+
this.setLayout = this.setLayout.bind(this);
this.onSliderChange = this.onSliderChange.bind(this);
// this.deletePlaceholder = this.deletePlaceholder.bind(this);
@@ -44,6 +49,7 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
}
componentDidMount() {
+
this.changeListenerDisposer = computed(() => this.childLayoutPairs).observe(({ oldValue, newValue }) => {
const layouts: Layout[] = this.parsedLayoutList;
@@ -61,6 +67,7 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
if (!oldValue || newValue.length > oldValue.length) {
// for each document that was added, add a corresponding grid layout document
+
newValue.forEach(({ layout }, i) => {
const targetId = layout[Id];
if (!layouts.find((gridLayout: Layout) => gridLayout.i === targetId)) {
@@ -89,7 +96,6 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
componentWillUnmount() {
this.changeListenerDisposer && this.changeListenerDisposer();
- console.log("unmounted")
}
// deletePlaceholder(placeholder: Layout, e: MouseEvent) {
@@ -222,9 +228,10 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
collector.push(
<div className={this.props.Document.flexGrid && (this.props.isSelected() ? true : false) ? "document-wrapper" : "document-wrapper static"}
key={gridLayout.i}
+ // onContextMenu={() => ContextMenu.Instance.addItem({ description: "test", event: () => console.log("test"), icon: "rainbow" })}
>
{this.getDisplayDoc(layout, dxf, width, height)}
- </div>
+ </div >
);
}
@@ -237,9 +244,17 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
*/
get layoutList(): Layout[] {
const layouts: Layout[] = this.parsedLayoutList;
+ this.unStringifiedLayoutList = layouts;
return this.props.Document.flexGrid ?
- layouts : layouts.map(({ i }, index) => ({
+ layouts.map(({ i, x, y, w, h }) => ({
+ i: i,
+ x: x + w > NumCast(this.props.Document.numCols) ? 0 : x,
+ y: y,
+ w: w,
+ h: h
+ }))
+ : layouts.map(({ i }, index) => ({
i: i,
x: 2 * (index % Math.floor(NumCast(this.props.Document.numCols) / 2)),
y: 2 * Math.floor(index / Math.floor(NumCast(this.props.Document.numCols) / 2)),
@@ -250,7 +265,9 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
}
onSliderChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+ NumCast(this.props.Document.rowHeight) !== event.currentTarget.valueAsNumber && (this.sliderDragged = true);
this.props.Document.rowHeight = event.currentTarget.valueAsNumber;
+
}
onSliderDown = () => {
@@ -277,7 +294,7 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
const newEditableViewProps: EditableProps = {
GetValue: () => "",
SetValue: this.addTextDocument,
- contents: "+ ADD TEXT DOCUMENT AT END",
+ contents: "+ ADD TEXT DOCUMENT",
};
const childDocumentViews: JSX.Element[] = this.contents;
@@ -287,10 +304,9 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
return (
<div className="collectionGridView-contents"
style={{
- // marginLeft: NumCast(this.props.Document._xMargin), marginRight: NumCast(this.props.Document._xMargin),
- // marginTop: NumCast(this.props.Document._yMargin), marginBottom: NumCast(this.props.Document._yMargin),
pointerEvents: !this.props.isSelected() && this.props.renderDepth !== 0 && !this.props.ContainingCollectionView?._isChildActive && !SnappingManager.GetIsDragging() ? "none" : undefined
}}
+ // onContextMenu={() => ContextMenu.Instance.addItem({ description: "test", event: () => console.log("test"), icon: "rainbow" })}
ref={this.createDashEventsTarget}
onPointerDown={e => {
if (this.props.active(true)) {
@@ -301,7 +317,7 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
// is the following section needed? it prevents the slider from being easily used and I'm not sure what it's preventing
// if (this.props.isSelected(true)) {
- // !((e.target as any)?.className.includes("react-resizable-handle")) && e.preventDefault();
+ // !((e.target as any)?.className.includes("react-resizable-handle")) && e.preventDefault();
// }
}} // the grid doesn't stopPropagation when its widgets are hit, so we need to otherwise the outer documents will respond
@@ -316,7 +332,7 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
onScroll={action(e => this._scroll = e.currentTarget.scrollTop)}
onWheel={e => e.stopPropagation()}
>
- <input className="rowHeightSlider" type="range" value={NumCast(this.props.Document.rowHeight)} onPointerDown={this.onSliderDown} onPointerUp={this.onSliderUp} onChange={this.onSliderChange} style={{ width: this.props.PanelHeight() - 40 }} min={1} max={this.props.PanelHeight() - 40} onPointerEnter={e => e.currentTarget.focus()} />
+ <input className="rowHeightSlider" type="range" value={NumCast(this.props.Document.rowHeight)} onPointerDown={this.onSliderDown} onPointerUp={this.onSliderUp} onChange={this.onSliderChange} style={{ width: this.props.PanelHeight() - 40 }} min={1} max={this.props.PanelHeight() - 40} onClick={() => !this.sliderDragged && console.log("clicking") && (this.sliderDragged = false)} />
<Grid
width={this.props.PanelWidth()}
nodeList={childDocumentViews.length ? childDocumentViews : null}
@@ -326,6 +342,9 @@ export class CollectionGridView extends CollectionSubView(GridSchema) {
rowHeight={NumCast(this.props.Document.rowHeight)}
setLayout={this.setLayout}
transformScale={this.props.ScreenToLocalTransform().Scale}
+ compactType={StrCast(this.props.Document.compactType)}
+ preventCollision={BoolCast(this.props.Document.preventCollision)}
+
// deletePlaceholder={this.deletePlaceholder}
/>
diff --git a/src/client/views/collections/collectionGrid/Grid.tsx b/src/client/views/collections/collectionGrid/Grid.tsx
index df550e3c2..5779bf463 100644
--- a/src/client/views/collections/collectionGrid/Grid.tsx
+++ b/src/client/views/collections/collectionGrid/Grid.tsx
@@ -20,6 +20,8 @@ interface GridProps {
transformScale: number;
childrenDraggable: boolean;
// deletePlaceholder: Function;
+ preventCollision: boolean;
+ compactType: string;
}
/**
@@ -57,19 +59,21 @@ export default class Grid extends React.Component<GridProps> {
render() {
console.log(this.props.transformScale);
+ const compactType = this.props.compactType === "vertical" || this.props.compactType === "horizontal" ? this.props.compactType : null;
+
return (
<GridLayout className="layout"
layout={this.props.layout}
cols={this.props.numCols}
rowHeight={this.props.rowHeight}
width={this.props.width}
- compactType={null}
+ compactType={compactType}
isDroppable={true}
isDraggable={this.props.childrenDraggable}
isResizable={this.props.childrenDraggable}
useCSSTransforms={true}
onLayoutChange={this.onLayoutChange}
- preventCollision={true}
+ preventCollision={this.props.preventCollision}
transformScale={this.props.transformScale} // still doesn't work :(
style={{ zIndex: 5 }}
>
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-12 00:03:31 +0000