Adornment shadow

I created a node with item array, each item can have an adornment to have action bar for that item,
I need to show shadow for the action bar (look at the red circle below)

the problem is I can not create a shadow on a panel,

I can create shadow to the adornment , but then it hides the item, because I have to put a background to show the shadow


my item Adornment looks like this

    const ItemAdornment = $(
        isShadowed: true, shadowBlur: 4, shadowColor: 'red',
        shadowOffset: new go.Point(5.8, 2.4),
        { mouseLeave: (e, buttonspanel, next) => hideAdornment(next) },

what can I do to have shadow only on the action bar and not to hide the item

Does this do something like what you want?

const AD =
  $(go.Adornment, "Spot",
      isShadowed: true,
      mouseLeave: (e, ad) => ad.adornedPart.removeAdornment("AD")
        alignment: go.Spot.Right, alignmentFocus: go.Spot.Left,
        background: "transparent"  // to catch mouse events between item Panel and this Panel
        { "ButtonBorder.shadowVisible": true, margin: new go.Margin(0, 0, 0, 6) },
        $(go.Shape, "Diamond",
          { width: 12, height: 12, fill: "red", stroke: "darkred" }),
        { click: (e, shp) => alert( }

myDiagram.nodeTemplate =
  $(go.Node, "Auto",
    { isShadowed: true },
    $(go.Shape, { fill: "lightyellow" }),
    $(go.Panel, "Vertical",
      new go.Binding("itemArray", "items"),
          $(go.Panel, "Horizontal",
            $(go.Shape, { width: 10, height: 10, margin: 2 }),
            $(go.TextBlock, { editable: true },
              new go.Binding("text", "").makeTwoWay()),
              mouseEnter: (e, panel) => { AD.adornedObject = panel; panel.part.addAdornment("AD", AD); },
              mouseLeave: (e, panel, next) => { if (!next || !(next === AD || next.isContainedBy(AD))) panel.part.removeAdornment("AD"); }
        defaultAlignment: go.Spot.Left,
        margin: 6

thanks, it is much better,
the problem I have Is that I use RoundeRectangle Figure
so it looks like this

        $(go.Shape, {
          figure: 'RoundedRectangle',
          fill: 'white',
          stroke: 'black',

We can see on the corners the white background.

also can I control the blur, and other shadow attributes?

Look at the Part.shadow… properties.

I could play with the shadow, the only problem I have now is the with the coroners

fixed it , put the shadowVisible on the shape

I have updated the code that I provided, above.