You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The current Window could provide more components and settings to allow easily building windows. I propose some API changes:
Create WindowTitle (or WindowTitleText, WindowIcon and WindowControls components that can be children of WindowHeader (or WindowTitle)
Allow title?: React.Node, icon?: React.Node, onClose?: () => void | null, onMinimize?: () => void | null and onMaximize?: () => void | null as shorthands to Window which preconfigure the window title accordingly, and status?: React.Node which renders below the window content.
If the events are undefined, the icon isn't displayed, and if they are null the icon is disabled.
Implement moving and resizing
Add x?: number and y?: number for left and top initial positioning respectively
Add width?: number and height?: number for the initial window dimensions
Implement an onMove: (event: { preventDefault: () => void, { target: { rect: DOMRect } } }) => void, which moves the window but allows the event handler code to prevent that movement (e.g. stick to a frame)
Implement an onResize: (event: { preventDefault: () => void, { target: { rect: DOMRect } } }) => void, which resizes the window but allows the event handler code to prevent that resizing (e.g. minimum or maximum sizes)
Implement helpers on common that allow users to detect collisions
Add a windowResizeWithContent: boolean to the theme that controls if all windows should render their content when being moved or resized, or move as a floating border (Figure 1)
Implement the variant?: 'toolbar' (or thin) to implement toolbar windows (Figure 1)
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
The current Window could provide more components and settings to allow easily building windows. I propose some API changes:
WindowTitle
(orWindowTitleText
,WindowIcon
andWindowControls
components that can be children ofWindowHeader
(orWindowTitle
)title?: React.Node
,icon?: React.Node
,onClose?: () => void | null
,onMinimize?: () => void | null
andonMaximize?: () => void | null
as shorthands toWindow
which preconfigure the window title accordingly, andstatus?: React.Node
which renders below the window content.undefined
, the icon isn't displayed, and if they arenull
the icon is disabled.x?: number
andy?: number
for left and top initial positioning respectivelywidth?: number
andheight?: number
for the initial window dimensionsonMove: (event: { preventDefault: () => void, { target: { rect: DOMRect } } }) => void
, which moves the window but allows the event handler code to prevent that movement (e.g. stick to a frame)onResize: (event: { preventDefault: () => void, { target: { rect: DOMRect } } }) => void
, which resizes the window but allows the event handler code to prevent that resizing (e.g. minimum or maximum sizes)common
that allow users to detect collisionswindowResizeWithContent: boolean
to the theme that controls if all windows should render their content when being moved or resized, or move as a floating border (Figure 1)variant?: 'toolbar'
(orthin
) to implement toolbar windows (Figure 1)Figure 1 (source):
Beta Was this translation helpful? Give feedback.
All reactions