Miko/PyUIBuilder
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

centered widget on open

Browse Source
This commit is contained in:
paul
2025-03-14 16:42:27 +05:30
parent dc892e6f61
commit ee57b43d0e
5 changed files with 127 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/canvas/canvas.js
View File

@@ -50,7 +50,7 @@ class Canvas extends React.Component {
constructor(props) {
super(props)
const { canvasWidgets, onWidgetListUpdated } = props
// const { canvasWidgets, onWidgetListUpdated } = props
this.canvasRef = React.createRef()
this.canvasContainerRef = React.createRef()
@@ -90,7 +90,7 @@ class Canvas extends React.Component {
toolbarAttrs: null
}
this._onWidgetListUpdated = onWidgetListUpdated // a function callback when the widget is added to the canvas
// this._onWidgetListUpdated = onWidgetListUpdated // a function callback when the widget is added to the canvas
this.resetTransforms = this.resetTransforms.bind(this)
this.renderWidget = this.renderWidget.bind(this)
@@ -1068,8 +1068,8 @@ class Canvas extends React.Component {
if (callback)
callback({ id, widgetRef })
if (this._onWidgetListUpdated)
this._onWidgetListUpdated(widgets) // inform the parent container
// if (this._onWidgetListUpdated)
// this._onWidgetListUpdated(widgets) // inform the parent container
}, 1)
// Update the state to include the new widget's type and ID
@@ -1128,8 +1128,8 @@ class Canvas extends React.Component {
// widgets: []
// })
if (this._onWidgetListUpdated)
this._onWidgetListUpdated([])
// if (this._onWidgetListUpdated)
// this._onWidgetListUpdated([])
}
getWidgetByIdFromWidgetList = (widgetId) => {
@@ -1165,8 +1165,8 @@ class Canvas extends React.Component {
// })
this.setWidgets(widgets)
if (this._onWidgetListUpdated)
this._onWidgetListUpdated(widgets)
// if (this._onWidgetListUpdated)
// this._onWidgetListUpdated(widgets)
}
onActiveWidgetUpdate(widgetId) {
@@ -1268,7 +1268,7 @@ class Canvas extends React.Component {
return (<div className="tw-relative tw-overflow-hidden tw-flex tw-w-full tw-h-full tw-max-h-[100vh]">
<div className="tw-absolute tw-p-2 tw-bg-white tw-z-10 tw-min-w-[100px] tw-h-[50px] tw-gap-2
tw-top-4 tw-place-items-center tw-right-4 tw-shadow-md tw-rounded-md tw-flex">
tw-top-4 tw-place-items-center tw-left-4 tw-shadow-md tw-rounded-md tw-flex">
<Tooltip title="Reset viewport">
<Button icon={<ReloadOutlined />} onClick={this.resetTransforms} />

4
src/canvas/toolbar.js
View File

@@ -394,9 +394,9 @@ const CanvasToolBar = memo(({ isOpen, widgetType, attrs = {} }) => {
return (
<div
className={`tw-absolute tw-top-20 tw-right-5 tw-bg-white
className={`tw-absolute tw-top-10 tw-right-5 tw-bg-white
${toolbarOpen ? "tw-translate-x-0" : "tw-translate-x-full"}
tw-w-[280px] tw-px-3 tw-p-2 tw-h-[600px] tw-rounded-md tw-z-[1000] tw-shadow-lg
tw-w-[280px] tw-px-3 tw-p-2 tw-h-[80vh] tw-rounded-md tw-z-[1000] tw-shadow-lg
tw-transition-transform tw-duration-[0.3s] tw-overflow-x-hidden
tw-flex tw-flex-col tw-gap-2 tw-overflow-y-auto tw-border-[2px]
tw-border-solid tw-border-gray-300`}