Accepted parentWidget Values#

The only accepted values for parentWidget are defined as a TypeScript union type:

type ParentName = "left-pane" | "center-pane" | "note-detail-pane" | "right-pane"

Note: For Preact widgets (using defineWidget), the property is called parent instead of parentWidget:

⧉

export default defineWidget({
parent: "right-pane",
render: () => <span>...</span>
});

Additional Positioning Options#

These four parentWidget values are the only supported mechanism to place a widget into the app layout. Areas like the ribbon, toolbar, or status bar are not extensible via custom widget scripts. However, within those constraints, you can:

• position property — Controls the ordering of your widget within its parent container. Higher values push it lower/further right. Widgets without an explicit position auto-increment by 10.

  ⧉

  get position() { return 100; }
  get parentWidget() { return 'center-pane'; }
  

• CSS positioning within your widget — Use CSS (position: absolute, position: fixed, etc.) inside doRender() to create floating, overlay, or popup-like behavior. Built-in components like floating buttons and backlinks popups use this pattern.

• Specialized base classes — Extending RightPanelWidget gives a card-based layout with a fixed header and scrollable body for right-pane widgets. Using NoteContextAwareWidget gives the widget awareness of the active note context.

• Child widget composition — Widgets can be nested inside your widget using the child() method to build more complex layouts within the allocated space.

In summary: the four parentWidget values determine where your widget lands in the app, but you have flexibility in how it renders within that space using CSS and widget composition.