Calcite action bar panels with different widths

[GaryB]

Hello,

A while back @JuliePowell helped me with this code pen which showed how to have action bar panels with different widths.   If you update the CodePen to use 4.25, Calcite beta 99, and change the slot from "primary-panel" to "panel-start" it still works, however, when I upgrade to Calcite version 1.03 it no longer works and I can't figure out how to get it working again.  Any advice would be greatly appreciated.

Thanks!

Gary

[UndralBatsukh]

Hi there, 

There were breaking changes between different versions and this doc outlines the changes you need to look out for. https://github.com/Esri/calcite-components/releases/tag/v1.0.0-beta.99 

Going forward there should not be breaking changes and the calcite components will work as they are between versions. 

I updated the codepen to reflect the changes in 1.03. https://codepen.io/U_B_U/pen/xxJeejZ?editors=1000

I updated just slot property on calcite-shell-panel based on following breaking change. I did not test the rest but the breaking changes should point you in the right direction.
<calcite-shell-panel id="primary-panel" slot="panel-start" position="start" detached>

• shell:

  • Removed the slot primary-panel, use panel-start instead.
  • Removed the slot contextual-panel, use panel-end instead.

[GaryB]

Undral,  Thanks for taking a look at this.  Your updated codepen clearly shows the issue when compared to the original one in my post.    In the attached image, the Charts panel is  larger in Julie's codepen (left side).  In your CodePen, the Charts panel is no longer larger and is the same size as the other panels.

Thanks!

Gary

[UndralBatsukh]

I completely misread your original question.... Just opened the codepen and made changes. Anyway, I'll look again.

[UndralBatsukh · Accepted solution]

So I had to ask around how it is done. The codepen is now updated: https://codepen.io/U_B_U/pen/xxJeejZ?editors=0100

I apologize for the confusion above. I just did not read the question completely. Just assumed you are asking how to show the calcite components. 

[GaryB]

Perfect, thanks so much!