import options from "options"p

const { start, center, end } = options.bar.layout

// place all your bar widgets in here
const widgets = {
  expander: () => Widget.Box({ expand: true}),
}


//export type BarWidget = keyof typeof widget;

export default (monitor: number) => Widget.Window({
  monitor,
  class_name: "bar",
  name: "bar-${monitor}",
  // anchor: position.bind().as(pos => [pos, "left", "right"]),
  anchor: ["top", "left", "right"],
  child: Widget.CenterBox({
    // ensure bar is shown
    css: "min-width: 2px; min-height: 2px;"
    startWidget: Widget.Box({
      hexpand: true,
      // map all start widgets to be childen
      childen: start.bind().as(s => s.map(w => widgets[w]()))
    }),
    centerWidget: Widget.Box({
      hpack: "center",
      // map all center widgets to be childen
      childen: center.bind().as(c => c.map(w => widgets[w]()))
    }),
    endWidget: Widget.Box({
      hexpand: true
      // map all end widgets to be childen
      childen: end.bind().as(e => e.map(w => widgets[w]()))
    }),
  })
})