@esri/hub-web-components 0.13.1 → 0.13.2

package/dist/components/arcgis-layout/customElement.js

@@ -10,7 +10,7 @@ import { Logger as f } from "@esri/hub-common";
 import { g as y } from "../../chunks/state.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/0.13/esri/copyright.txt for details.
-v0.13.1 */
+v0.13.2 */
 const x = u`:host{font-family:inherit;display:block;box-sizing:border-box;container-type:inline-size;--hub-layout-spacing-x: 1.5rem;--hub-layout-spacing-y: 1rem}#layout-container{contain:layout;padding:0;margin:0;box-sizing:border-box}arcgis-layout-section{box-sizing:border-box;display:flex;flex-direction:column;padding-block:var(--hub-layout-spacing-y);gap:var(--hub-layout-spacing-y);justify-content:space-between;margin:0 auto}arcgis-layout-section.section,arcgis-layout-section.section-fluid,arcgis-layout-section.section-sm,arcgis-layout-section.section-md,arcgis-layout-section.section-lg,arcgis-layout-section.section-xl,arcgis-layout-section.section-xxl{width:100%;padding-inline:calc(var(--hub-layout-spacing-x) * .5)}calcite-tab{>arcgis-layout-section.section,>arcgis-layout-section.section-fluid,>arcgis-layout-section.section-sm,>arcgis-layout-section.section-md,>arcgis-layout-section.section-lg,>arcgis-layout-section.section-xl,>arcgis-layout-section.section-xxl{padding-inline:0}}@container (min-width: 576px){arcgis-layout-section.section,arcgis-layout-section.section-sm{max-width:540px}}@container (min-width: 768px){arcgis-layout-section.section,arcgis-layout-section.section-sm,arcgis-layout-section.section-md{max-width:720px}}@container (min-width: 992px){arcgis-layout-section.section,arcgis-layout-section.section-sm,arcgis-layout-section.section-md,arcgis-layout-section.section-lg{max-width:960px}}@container (min-width: 1200px){arcgis-layout-section.section,arcgis-layout-section.section-sm,arcgis-layout-section.section-md,arcgis-layout-section.section-lg,arcgis-layout-section.section-xl{max-width:1140px}}@container (min-width: 1440px){arcgis-layout-section.section,arcgis-layout-section.section-sm,arcgis-layout-section.section-md,arcgis-layout-section.section-lg,arcgis-layout-section.section-xl,arcgis-layout-section.section-xxl{max-width:1320px}}arcgis-layout-row{display:flex;flex-wrap:wrap;box-sizing:border-box;margin-inline:calc(var(--hub-layout-spacing-x) * -.5);row-gap:var(--hub-layout-spacing-y)}arcgis-layout-row.align-items-start{align-items:flex-start}arcgis-layout-row.align-items-end{align-items:flex-end}arcgis-layout-row.align-items-center{align-items:center}arcgis-layout-row.align-items-baseline{align-items:baseline}arcgis-layout-row.align-items-stretch{align-items:stretch}arcgis-layout-column{display:flex;flex-direction:column;gap:1rem;box-sizing:border-box;flex:0 0;max-width:100%;padding-inline:calc(var(--hub-layout-spacing-x) * .5)}arcgis-layout-section.no-gutters{padding-inline:0}arcgis-hub-layout-row.align-items-stretch>arcgis-layout-column>*,arcgis-hub-layout-row.align-self-stretch>arcgis-layout-column>*{height:100%}arcgis-layout-column.col,arcgis-layout-column:not([class*=col-]){flex:1 1 0%;max-width:100%}arcgis-layout-column[class^=col-md-],arcgis-layout-column[class^=col-lg-],arcgis-layout-column[class^=col-xl-]{flex:1 1 100%;max-width:100%}arcgis-layout-column.col-1{flex:1 1 100%;max-width:8.333333%}arcgis-layout-column.col-2{flex:1 1 100%;max-width:16.666667%}arcgis-layout-column.col-3{flex:1 1 100%;max-width:25%}arcgis-layout-column.col-4{flex:1 1 100%;max-width:33.333333%}arcgis-layout-column.col-5{flex:1 1 100%;max-width:41.666667%}arcgis-layout-column.col-6{flex:1 1 100%;max-width:50%}arcgis-layout-column.col-7{flex:1 1 100%;max-width:58.333333%}arcgis-layout-column.col-8{flex:1 1 100%;max-width:66.666667%}arcgis-layout-column.col-9{flex:1 1 100%;max-width:75%}arcgis-layout-column.col-10{flex:1 1 100%;max-width:83.333333%}arcgis-layout-column.col-11{flex:1 1 100%;max-width:91.666667%}arcgis-layout-column.col-12{flex:1 1 100%;max-width:100%}@container (min-width: 576px){arcgis-layout-column.col-sm-1{flex:0 0 8.333333%;max-width:8.333333%}arcgis-layout-column.col-sm-2{flex:0 0 16.666667%;max-width:16.666667%}arcgis-layout-column.col-sm-3{flex:0 0 25%;max-width:25%}arcgis-layout-column.col-sm-4{flex:0 0 33.333333%;max-width:33.333333%}arcgis-layout-column.col-sm-5{flex:0 0 41.666667%;max-width:41.666667%}arcgis-layout-column.col-sm-6{flex:0 0 50%;max-width:50%}arcgis-layout-column.col-sm-7{flex:0 0 58.333333%;max-width:58.333333%}arcgis-layout-column.col-sm-8{flex:0 0 66.666667%;max-width:66.666667%}arcgis-layout-column.col-sm-9{flex:0 0 75%;max-width:75%}arcgis-layout-column.col-sm-10{flex:0 0 83.333333%;max-width:83.333333%}arcgis-layout-column.col-sm-11{flex:0 0 91.666667%;max-width:91.666667%}arcgis-layout-column.col-sm-12{flex:0 0 100%;max-width:100%}}@container (min-width: 768px){arcgis-layout-column.col-md-1{flex:0 0 8.333333%;max-width:8.333333%}arcgis-layout-column.col-md-2{flex:0 0 16.666667%;max-width:16.666667%}arcgis-layout-column.col-md-3{flex:0 0 25%;max-width:25%}arcgis-layout-column.col-md-4{flex:0 0 33.333333%;max-width:33.333333%}arcgis-layout-column.col-md-5{flex:0 0 41.666667%;max-width:41.666667%}arcgis-layout-column.col-md-6{flex:0 0 50%;max-width:50%}arcgis-layout-column.col-md-7{flex:0 0 58.333333%;max-width:58.333333%}arcgis-layout-column.col-md-8{flex:0 0 66.666667%;max-width:66.666667%}arcgis-layout-column.col-md-9{flex:0 0 75%;max-width:75%}arcgis-layout-column.col-md-10{flex:0 0 83.333333%;max-width:83.333333%}arcgis-layout-column.col-md-11{flex:0 0 91.666667%;max-width:91.666667%}arcgis-layout-column.col-md-12{flex:0 0 100%;max-width:100%}}@container (min-width: 992px){arcgis-layout-column.col-lg-1{flex:0 0 8.333333%;max-width:8.333333%}arcgis-layout-column.col-lg-2{flex:0 0 16.666667%;max-width:16.666667%}arcgis-layout-column.col-lg-3{flex:0 0 25%;max-width:25%}arcgis-layout-column.col-lg-4{flex:0 0 33.333333%;max-width:33.333333%}arcgis-layout-column.col-lg-5{flex:0 0 41.666667%;max-width:41.666667%}arcgis-layout-column.col-lg-6{flex:0 0 50%;max-width:50%}arcgis-layout-column.col-lg-7{flex:0 0 58.333333%;max-width:58.333333%}arcgis-layout-column.col-lg-8{flex:0 0 66.666667%;max-width:66.666667%}arcgis-layout-column.col-lg-9{flex:0 0 75%;max-width:75%}arcgis-layout-column.col-lg-10{flex:0 0 83.333333%;max-width:83.333333%}arcgis-layout-column.col-lg-11{flex:0 0 91.666667%;max-width:91.666667%}arcgis-layout-column.col-lg-12{flex:0 0 100%;max-width:100%}}@container (min-width: 1440px){arcgis-layout-column.col-xxl-1{flex:0 0 8.333333%;max-width:8.333333%}arcgis-layout-column.col-xxl-2{flex:0 0 16.666667%;max-width:16.666667%}arcgis-layout-column.col-xxl-3{flex:0 0 25%;max-width:25%}arcgis-layout-column.col-xxl-4{flex:0 0 33.333333%;max-width:33.333333%}arcgis-layout-column.col-xxl-5{flex:0 0 41.666667%;max-width:41.666667%}arcgis-layout-column.col-xxl-6{flex:0 0 50%;max-width:50%}arcgis-layout-column.col-xxl-7{flex:0 0 58.333333%;max-width:58.333333%}arcgis-layout-column.col-xxl-8{flex:0 0 66.666667%;max-width:66.666667%}arcgis-layout-column.col-xxl-9{flex:0 0 75%;max-width:75%}arcgis-layout-column.col-xxl-10{flex:0 0 83.333333%;max-width:83.333333%}arcgis-layout-column.col-xxl-11{flex:0 0 91.666667%;max-width:91.666667%}arcgis-layout-column.col-xxl-12{flex:0 0 100%;max-width:100%}}arcgis-layout-column.offset-1{margin-left:8.333333%}arcgis-layout-column.offset-2{margin-left:16.666667%}arcgis-layout-column.offset-3{margin-left:25%}arcgis-layout-column.offset-4{margin-left:33.333333%}arcgis-layout-column.offset-5{margin-left:41.666667%}arcgis-layout-column.offset-6{margin-left:50%}arcgis-layout-column.offset-7{margin-left:58.333333%}arcgis-layout-column.offset-8{margin-left:66.666667%}arcgis-layout-column.offset-9{margin-left:75%}arcgis-layout-column.offset-10{margin-left:83.333333%}arcgis-layout-column.offset-11{margin-left:91.666667%}arcgis-layout-column.offset-12{margin-left:100%}@container (min-width: 576px){arcgis-layout-column.offset-sm-1{margin-left:8.333333%}arcgis-layout-column.offset-sm-2{margin-left:16.666667%}arcgis-layout-column.offset-sm-3{margin-left:25%}arcgis-layout-column.offset-sm-4{margin-left:33.333333%}arcgis-layout-column.offset-sm-5{margin-left:41.666667%}arcgis-layout-column.offset-sm-6{margin-left:50%}arcgis-layout-column.offset-sm-7{margin-left:58.333333%}arcgis-layout-column.offset-sm-8{margin-left:66.666667%}arcgis-layout-column.offset-sm-9{margin-left:75%}arcgis-layout-column.offset-sm-10{margin-left:83.333333%}arcgis-layout-column.offset-sm-11{margin-left:91.666667%}arcgis-layout-column.offset-sm-12{margin-left:100%}}@container (min-width: 768px){arcgis-layout-column.offset-md-1{margin-left:8.333333%}arcgis-layout-column.offset-md-2{margin-left:16.666667%}arcgis-layout-column.offset-md-3{margin-left:25%}arcgis-layout-column.offset-md-4{margin-left:33.333333%}arcgis-layout-column.offset-md-5{margin-left:41.666667%}arcgis-layout-column.offset-md-6{margin-left:50%}arcgis-layout-column.offset-md-7{margin-left:58.333333%}arcgis-layout-column.offset-md-8{margin-left:66.666667%}arcgis-layout-column.offset-md-9{margin-left:75%}arcgis-layout-column.offset-md-10{margin-left:83.333333%}arcgis-layout-column.offset-md-11{margin-left:91.666667%}arcgis-layout-column.offset-md-12{margin-left:100%}}@container (min-width: 992px){arcgis-layout-column.offset-lg-1{margin-left:8.333333%}arcgis-layout-column.offset-lg-2{margin-left:16.666667%}arcgis-layout-column.offset-lg-3{margin-left:25%}arcgis-layout-column.offset-lg-4{margin-left:33.333333%}arcgis-layout-column.offset-lg-5{margin-left:41.666667%}arcgis-layout-column.offset-lg-6{margin-left:50%}arcgis-layout-column.offset-lg-7{margin-left:58.333333%}arcgis-layout-column.offset-lg-8{margin-left:66.666667%}arcgis-layout-column.offset-lg-9{margin-left:75%}arcgis-layout-column.offset-lg-10{margin-left:83.333333%}arcgis-layout-column.offset-lg-11{margin-left:91.666667%}arcgis-layout-column.offset-lg-12{margin-left:100%}}@container (min-width: 1200px){arcgis-layout-column.offset-xl-1{margin-left:8.333333%}arcgis-layout-column.offset-xl-2{margin-left:16.666667%}arcgis-layout-column.offset-xl-3{margin-left:25%}arcgis-layout-column.offset-xl-4{margin-left:33.333333%}arcgis-layout-column.offset-xl-5{margin-left:41.666667%}arcgis-layout-column.offset-xl-6{margin-left:50%}arcgis-layout-column.offset-xl-7{margin-left:58.333333%}arcgis-layout-column.offset-xl-8{margin-left:66.666667%}arcgis-layout-column.offset-xl-9{margin-left:75%}arcgis-layout-column.offset-xl-10{margin-left:83.333333%}arcgis-layout-column.offset-xl-11{margin-left:91.666667%}arcgis-layout-column.offset-xl-12{margin-left:100%}}@container (min-width: 1440px){arcgis-layout-column.offset-xxl-1{margin-left:8.333333%}arcgis-layout-column.offset-xxl-2{margin-left:16.666667%}arcgis-layout-column.offset-xxl-3{margin-left:25%}arcgis-layout-column.offset-xxl-4{margin-left:33.333333%}arcgis-layout-column.offset-xxl-5{margin-left:41.666667%}arcgis-layout-column.offset-xxl-6{margin-left:50%}arcgis-layout-column.offset-xxl-7{margin-left:58.333333%}arcgis-layout-column.offset-xxl-8{margin-left:66.666667%}arcgis-layout-column.offset-xxl-9{margin-left:75%}arcgis-layout-column.offset-xxl-10{margin-left:83.333333%}arcgis-layout-column.offset-xxl-11{margin-left:91.666667%}arcgis-layout-column.offset-xxl-12{margin-left:100%}}arcgis-layout-column.align-self-auto{align-self:auto}arcgis-layout-column.align-self-baseline{align-self:baseline}arcgis-layout-column.align-self-start{align-self:flex-start}arcgis-layout-column.align-self-center{align-self:center}arcgis-layout-column.align-self-end{align-self:flex-end}arcgis-layout-column.align-self-stretch{align-self:stretch}@container (min-width: 576px){arcgis-layout-column.align-self-sm-auto{align-self:auto}arcgis-layout-column.align-self-sm-baseline{align-self:baseline}arcgis-layout-column.align-self-sm-start{align-self:flex-start}arcgis-layout-column.align-self-sm-center{align-self:center}arcgis-layout-column.align-self-sm-end{align-self:flex-end}arcgis-layout-column.align-self-sm-stretch{align-self:stretch}}@container (min-width: 768px){arcgis-layout-column.align-self-md-auto{align-self:auto}arcgis-layout-column.align-self-md-baseline{align-self:baseline}arcgis-layout-column.align-self-md-start{align-self:flex-start}arcgis-layout-column.align-self-md-center{align-self:center}arcgis-layout-column.align-self-md-end{align-self:flex-end}arcgis-layout-column.align-self-md-stretch{align-self:stretch}}@container (min-width: 992px){arcgis-layout-column.align-self-lg-auto{align-self:auto}arcgis-layout-column.align-self-lg-baseline{align-self:baseline}arcgis-layout-column.align-self-lg-start{align-self:flex-start}arcgis-layout-column.align-self-lg-center{align-self:center}arcgis-layout-column.align-self-lg-end{align-self:flex-end}arcgis-layout-column.align-self-lg-stretch{align-self:stretch}}@container (min-width: 1200px){arcgis-layout-column.align-self-xl-auto{align-self:auto}arcgis-layout-column.align-self-xl-baseline{align-self:baseline}arcgis-layout-column.align-self-xl-start{align-self:flex-start}arcgis-layout-column.align-self-xl-center{align-self:center}arcgis-layout-column.align-self-xl-end{align-self:flex-end}arcgis-layout-column.align-self-xl-stretch{align-self:stretch}}@container (min-width: 1440px){arcgis-layout-column.align-self-xxl-auto{align-self:auto}arcgis-layout-column.align-self-xxl-baseline{align-self:baseline}arcgis-layout-column.align-self-xxl-start{align-self:flex-start}arcgis-layout-column.align-self-xxl-center{align-self:center}arcgis-layout-column.align-self-xxl-end{align-self:flex-end}arcgis-layout-column.align-self-xxl-stretch{align-self:stretch}}arcgis-layout-column.align-items-baseline{align-items:baseline}arcgis-layout-column.align-items-center{align-items:center}arcgis-layout-column.align-items-end{align-items:flex-end}arcgis-layout-column.align-items-start{align-items:flex-start}arcgis-layout-column.align-items-stretch{align-items:stretch}@container (min-width: 576px){arcgis-layout-column.align-items-sm-baseline{align-items:baseline}arcgis-layout-column.align-items-sm-start{align-items:flex-start}arcgis-layout-column.align-items-sm-center{align-items:center}arcgis-layout-column.align-items-sm-end{align-items:flex-end}arcgis-layout-column.align-items-sm-stretch{align-items:stretch}}@container (min-width: 768px){arcgis-layout-column.align-items-md-baseline{align-items:baseline}arcgis-layout-column.align-items-md-start{align-items:flex-start}arcgis-layout-column.align-items-md-center{align-items:center}arcgis-layout-column.align-items-md-end{align-items:flex-end}arcgis-layout-column.align-items-md-stretch{align-items:stretch}}@container (min-width: 992px){arcgis-layout-column.align-items-lg-baseline{align-items:baseline}arcgis-layout-column.align-items-lg-start{align-items:flex-start}arcgis-layout-column.align-items-lg-center{align-items:center}arcgis-layout-column.align-items-lg-end{align-items:flex-end}arcgis-layout-column.align-items-lg-stretch{align-items:stretch}}@container (min-width: 1200px){arcgis-layout-column.align-items-xl-baseline{align-items:baseline}arcgis-layout-column.align-items-xl-start{align-items:flex-start}arcgis-layout-column.align-items-xl-center{align-items:center}arcgis-layout-column.align-items-xl-end{align-items:flex-end}arcgis-layout-column.align-items-xl-stretch{align-items:stretch}}@container (min-width: 1440px){arcgis-layout-column.align-items-xxl-baseline{align-items:baseline}arcgis-layout-column.align-items-xxl-start{align-items:flex-start}arcgis-layout-column.align-items-xxl-center{align-items:center}arcgis-layout-column.align-items-xxl-end{align-items:flex-end}arcgis-layout-column.align-items-xxl-stretch{align-items:stretch}}arcgis-layout-column.justify-content-start{justify-content:flex-start}arcgis-layout-column.justify-content-end{justify-content:flex-end}arcgis-layout-column.justify-content-center{justify-content:center}arcgis-layout-column.justify-content-between{justify-content:space-between}arcgis-layout-column.justify-content-around{justify-content:space-around}arcgis-layout-column.justify-content-evenly{justify-content:space-evenly}@container (min-width: 576px){arcgis-layout-column.justify-content-sm-start{justify-content:flex-start}arcgis-layout-column.justify-content-sm-end{justify-content:flex-end}arcgis-layout-column.justify-content-sm-center{justify-content:center}arcgis-layout-column.justify-content-sm-between{justify-content:space-between}arcgis-layout-column.justify-content-sm-around{justify-content:space-around}arcgis-layout-column.justify-content-sm-evenly{justify-content:space-evenly}}@container (min-width: 768px){arcgis-layout-column.justify-content-md-start{justify-content:flex-start}arcgis-layout-column.justify-content-md-end{justify-content:flex-end}arcgis-layout-column.justify-content-md-center{justify-content:center}arcgis-layout-column.justify-content-md-between{justify-content:space-between}arcgis-layout-column.justify-content-md-around{justify-content:space-around}arcgis-layout-column.justify-content-md-evenly{justify-content:space-evenly}}@container (min-width: 992px){arcgis-layout-column.justify-content-lg-start{justify-content:flex-start}arcgis-layout-column.justify-content-lg-end{justify-content:flex-end}arcgis-layout-column.justify-content-lg-center{justify-content:center}arcgis-layout-column.justify-content-lg-between{justify-content:space-between}arcgis-layout-column.justify-content-lg-around{justify-content:space-around}arcgis-layout-column.justify-content-lg-evenly{justify-content:space-evenly}}@container (min-width: 1200px){arcgis-layout-column.justify-content-xl-start{justify-content:flex-start}arcgis-layout-column.justify-content-xl-end{justify-content:flex-end}arcgis-layout-column.justify-content-xl-center{justify-content:center}arcgis-layout-column.justify-content-xl-between{justify-content:space-between}arcgis-layout-column.justify-content-xl-around{justify-content:space-around}arcgis-layout-column.justify-content-xl-evenly{justify-content:space-evenly}}arcgis-layout-column.shrink{flex:0 0 auto;width:auto;max-width:none}:host([debug]){#layout-container{background-color:pink}@container (min-width: 576px){#layout-container{background-color:orange}}@container (min-width: 768px){#layout-container{background-color:#fafad2}}@container (min-width: 992px){#layout-container{background-color:#90ee90}}@container (min-width: 1200px){#layout-container{background-color:#add8e6}}@container (min-width: 1440px){#layout-container{background-color:violet}}}:host([debug]) arcgis-layout-section{outline:2px solid var(--calcite-ui-brand);outline-offset:6px}:host([debug]) arcgis-layout-section.layout-error{outline:4px solid fuchsia;outline-offset:4px;height:50px}:host([debug]) arcgis-layout-section.layout-error:after{content:"!";color:#f0f;font-size:2rem;font-weight:700;position:relative;top:-12px}:host([debug]) arcgis-layout-row{outline:2px solid red;outline-offset:3px}:host([debug]) arcgis-layout-row.layout-error{outline:4px solid fuchsia;outline-offset:2px;height:50px}:host([debug]) arcgis-layout-row.layout-error:after{content:"!";color:#f0f;font-size:2rem;font-weight:700;position:relative;top:8px}:host([debug]) arcgis-layout-column{outline:2px solid green}:host([debug]) arcgis-layout-column.layout-error{outline:4px solid fuchsia;outline-offset:-5px;align-self:stretch}:host([debug]) arcgis-layout-column[debug].layout-error:after{content:"!";color:#f0f;font-size:2rem;font-weight:700;position:relative}:host([debug]) arcgis-layout-column[debug]>.layout-error{outline:4px solid fuchsia;outline-offset:-2px;align-self:stretch;height:40px}:host([debug]) arcgis-layout-column[debug]>.layout-error:after{content:"!";color:#f0f;font-size:1.5rem;font-weight:700;position:relative;top:8px;left:5px}:host([is-edit-mode]) arcgis-layout-column>:not(arcgis-layout-row):hover:not(arcgis-nav-card):hover:not(arcgis-layout-node-highlight):hover,:host([is-edit-mode]) arcgis-layout-column>arcgis-nav-card calcite-tab-nav:hover,.current-node{--calcite-internal-color-focus: var(--calcite-ui-brand);cursor:pointer;outline:var(--calcite-border-width-md) solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline:var(--calcite-border-width-md) solid var(--calcite-internal-color-focus);outline-offset:calc(var(--calcite-spacing-base) * calc(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}`;
 class d extends c {
   constructor() {
@@ -30,6 +30,10 @@ class d extends c {
       processLayout: async (t) => await r(t, this.options, this._context)
     };
   }
+  /** highlightNode */
+  async getCardEl(t) {
+    return this.el.shadowRoot?.querySelector(`[data-node-id="${t}"]`);
+  }
   _getChildClasses(t) {
     const l = g(t);
     return t.id === this.highlightedNode?.id && l.push("current-node"), l;

package/dist/components/arcgis-layout-column/customElement.d.ts

@@ -31,8 +31,8 @@ export declare class ArcgisLayoutColumn extends LitElement {
      * @default false
      */
     isEditMode: boolean;
-    /** Emitted when a layout node is un-hovered */
-    readonly arcgisLayoutNodeUnHighlight: TargetedEvent<this, MouseEvent>;
     /** Emitted when a layout node is hovered */
     readonly arcgisLayoutNodeHighlight: TargetedEvent<this, MouseEvent | KeyboardEvent>;
+    /** Emitted when a layout node is un-hovered */
+    readonly arcgisLayoutNodeUnHighlight: TargetedEvent<this, MouseEvent>;
 }

package/dist/components/arcgis-layout-column/customElement.js

@@ -10,10 +10,10 @@ import { spreadProps as N } from "@open-wc/lit-helpers";
 import { i as w } from "../../chunks/isNodeVisible.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/0.13/esri/copyright.txt for details.
-v0.13.1 */
+v0.13.2 */
 class C extends p {
   constructor() {
-    super(...arguments), this.debug = !1, this.isEditMode = !1, this.arcgisLayoutNodeUnHighlight = n(), this.arcgisLayoutNodeHighlight = n();
+    super(...arguments), this.debug = !1, this.isEditMode = !1, this.arcgisLayoutNodeHighlight = n(), this.arcgisLayoutNodeUnHighlight = n();
   }
   static {
     this.properties = { node: 0, highlightedNode: 0, utils: 0, debug: 5, isEditMode: 5 };

package/dist/components/arcgis-layout-container/customElement.d.ts

@@ -29,4 +29,6 @@ export declare class ArcgisLayoutContainer extends LitElement {
     readonly arcgisHubLayoutEditorExit: TargetedEvent<this, void>;
     /** Event emitted when the layout is published */
     readonly arcgisHubLayoutPublished: TargetedEvent<this, import('@esri/hub-common').ILayoutV2>;
+    /** Event emitted for telemetry */
+    readonly hubTelemetry: TargetedEvent<this, Record<string, unknown>>;
 }

package/dist/components/arcgis-layout-container/customElement.js

@@ -1,41 +1,41 @@
 import { c as w } from "../../chunks/runtime.js";
 import { html as c } from "lit-html";
-import { keyed as N } from "lit-html/directives/keyed.js";
-import { LitElement as x, useContextProvider as A, createEvent as f, noShadowRoot as P } from "@arcgis/lumina";
-import { createRef as L, ref as b } from "lit/directives/ref.js";
+import { keyed as b } from "lit-html/directives/keyed.js";
+import { LitElement as x, useContextProvider as P, createEvent as y, noShadowRoot as A } from "@arcgis/lumina";
+import { createRef as _, ref as p } from "lit/directives/ref.js";
 import { l as S } from "../../chunks/messagesContext.js";
 import { css as k } from "@lit/reactive-element/css-tag.js";
-import { layoutNodeTags as $, cloneObject as l, getProp as v, Logger as u, createId as T, getWithDefault as M } from "@esri/hub-common";
-import { g as H } from "../../chunks/state.js";
-import { f as g, p as V } from "../../chunks/processLayout.js";
-import { c as I, b as m, i as y, a as E } from "../../chunks/typeGuards.js";
-import { g as O, i as D } from "../../chunks/interpolate-translations.js";
-import { u as R } from "../../chunks/useT9n.js";
+import { layoutNodeTags as $, cloneObject as l, getProp as v, Logger as u, createId as T, getWithDefault as H } from "@esri/hub-common";
+import { g as M } from "../../chunks/state.js";
+import { f as g, p as I } from "../../chunks/processLayout.js";
+import { c as O, b as N, i as f, a as L } from "../../chunks/typeGuards.js";
+import { g as V, i as R } from "../../chunks/interpolate-translations.js";
+import { u as D } from "../../chunks/useT9n.js";
 import { migrateSchema as j } from "@esri/hub-components";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/0.13/esri/copyright.txt for details.
-v0.13.1 */
+v0.13.2 */
 const U = k`@layer{arcgis-layout-container{display:block;--offsetTop: 0px;calcite-shell{position:static;font-size:inherit}#arcgis-layout-container-edit-mode-live-region{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}}arcgis-layout-container[is-edit-mode]{height:calc(100vh - var(--offsetTop));arcgis-layout{margin-block-start:15px}calcite-panel>*{margin:1rem}calcite-panel>calcite-action.panel-close{margin:0}}}`;
-function G(t, i) {
+function G(i, t) {
   const o = ["order", "offset", "width"], s = [];
   return o.forEach((e) => {
     let a;
-    m(t) && (a = t.sectionProps?.[e]), y(t) && (a = t.rowProps?.[e]), E(t) && (a = t.columnProps?.[e]), typeof a == "number" ? (a < 0 || a > 12) && s.push(`Node "${t.id}": ${i} > ${e} out of range (0-12): ${a}`) : typeof a == "object" && Object.entries(a).forEach(([n, r]) => {
-      typeof r == "number" && (r < 0 || r > 12) && s.push(`Node "${t.id}": ${i} > ${e}.${n} out of range (0-12): ${r}`);
+    N(i) && (a = i.sectionProps?.[e]), f(i) && (a = i.rowProps?.[e]), L(i) && (a = i.columnProps?.[e]), typeof a == "number" ? (a < 0 || a > 12) && s.push(`Node "${i.id}": ${t} > ${e} out of range (0-12): ${a}`) : typeof a == "object" && Object.entries(a).forEach(([h, n]) => {
+      typeof n == "number" && (n < 0 || n > 12) && s.push(`Node "${i.id}": ${t} > ${e}.${h} out of range (0-12): ${n}`);
     });
   }), s;
 }
-function F(t, i, o, s) {
+function F(i, t, o, s) {
   const e = [];
-  return t.id || e.push(`${i} > missing required id.`), t.tag || e.push(`${i} > missing required tag.`), t.id && (o.has(t.id) && e.push(`Node "${t.id}": ${i} > duplicate id: "${t.id}"`), o.add(t.id)), s.includes(t.tag) || e.push(`Node "${t.id}": ${i} > has invalid tag: ${t.tag}`), e.push(...G(t, i)), (m(t) || y(t) || E(t)) && (!t.children || !Array.isArray(t.children) || t.children.length === 0) && e.push(`Node "${t.id}": ${i} > missing or empty children array.`), e;
+  return i.id || e.push(`${t} > missing required id.`), i.tag || e.push(`${t} > missing required tag.`), i.id && (o.has(i.id) && e.push(`Node "${i.id}": ${t} > duplicate id: "${i.id}"`), o.add(i.id)), s.includes(i.tag) || e.push(`Node "${i.id}": ${t} > has invalid tag: ${i.tag}`), e.push(...G(i, t)), (N(i) || f(i) || L(i)) && (!i.children || !Array.isArray(i.children) || i.children.length === 0) && e.push(`Node "${i.id}": ${t} > missing or empty children array.`), e;
 }
-function _({ node: t, nodePath: i, idSet: o, validTags: s, errors: e }) {
-  if (t.tag === "arcgis-nav-card") {
-    const a = t.properties;
-    a && typeof a == "object" && Array.isArray(a.sections) && a.sections.forEach((r, h) => {
-      const d = `${i}.sections[${h}]`;
-      _({
-        node: r,
+function m({ node: i, nodePath: t, idSet: o, validTags: s, errors: e }) {
+  if (i.tag === "arcgis-nav-card") {
+    const a = i.properties;
+    a && typeof a == "object" && Array.isArray(a.sections) && a.sections.forEach((n, r) => {
+      const d = `${t}.sections[${r}]`;
+      m({
+        node: n,
         nodePath: d,
         idSet: o,
         validTags: ["arcgis-layout-section"],
@@ -43,90 +43,90 @@ function _({ node: t, nodePath: i, idSet: o, validTags: s, errors: e }) {
       });
     });
   }
-  e.push(...F(t, i, o, s)), Array.isArray(t.children) && t.children.forEach((a, n) => {
-    let r = `${i}.Child[${n}]`, h = Array.from($);
-    m(t) ? (h = ["arcgis-layout-row"], r = `${i}.Row[${n}]`) : y(t) ? (h = ["arcgis-layout-column"], r = `${i}.Column[${n}]`) : E(t) && (h = Array.from($).filter(
+  e.push(...F(i, t, o, s)), Array.isArray(i.children) && i.children.forEach((a, h) => {
+    let n = `${t}.Child[${h}]`, r = Array.from($);
+    N(i) ? (r = ["arcgis-layout-row"], n = `${t}.Row[${h}]`) : f(i) ? (r = ["arcgis-layout-column"], n = `${t}.Column[${h}]`) : L(i) && (r = Array.from($).filter(
       (d) => d !== "arcgis-layout-column" && d !== "arcgis-layout-section"
-    )), _({
+    )), m({
       node: a,
-      nodePath: r,
+      nodePath: n,
       idSet: o,
-      validTags: h,
+      validTags: r,
       errors: e
     });
   });
 }
-function q(t) {
-  const i = [], o = /* @__PURE__ */ new Set();
-  return t ? typeof t != "object" ? (i.push("Layout must be an object."), i) : !t.sections.length || !Array.isArray(t.sections) ? (i.push("Layout must have a sections array."), i) : (t.sections.forEach((s, e) => {
-    if (I(s)) {
-      i.push(`Section[${e}] is a reference and cannot be a direct child.`);
+function q(i) {
+  const t = [], o = /* @__PURE__ */ new Set();
+  return i ? typeof i != "object" ? (t.push("Layout must be an object."), t) : !i.sections.length || !Array.isArray(i.sections) ? (t.push("Layout must have a sections array."), t) : (i.sections.forEach((s, e) => {
+    if (O(s)) {
+      t.push(`Section[${e}] is a reference and cannot be a direct child.`);
       return;
     }
-    const a = s, n = `Section[${e}]`;
-    _({
+    const a = s, h = `Section[${e}]`;
+    m({
       node: a,
-      nodePath: n,
+      nodePath: h,
       idSet: o,
       validTags: ["arcgis-layout-section"],
-      errors: i
+      errors: t
     });
-  }), console.log("idSet:", o), i) : (i.push("Layout must be defined."), i);
+  }), t) : (t.push("Layout must be defined."), t);
 }
-async function z(t) {
-  switch (t) {
+async function z(i) {
+  switch (i) {
     case "arcgis-text-card":
       return (await import("../../chunks/migrateTextCard.js")).migrateTextCard;
     // ...other cases...
     default:
-      return ((i) => i);
+      return ((t) => t);
   }
 }
-function B(t) {
-  const i = l(t);
-  return i.schemaVersion = 2, i;
+function B(i) {
+  const t = l(i);
+  return t.schemaVersion = 2, t;
 }
 const X = {
   2: B
 };
-async function Y(t) {
-  const i = j(t, X), o = await Promise.all(
-    i.sections.map(async (s) => await C(s))
+async function Y(i) {
+  const t = j(i, X), o = await Promise.all(
+    t.sections.map(async (s) => await C(s))
   );
-  return i.sections = o, i;
+  return t.sections = o, t;
 }
-async function C(t) {
-  const o = (await z(t.tag))(t);
+async function C(i) {
+  const o = (await z(i.tag))(i);
   return Array.isArray(o.children) && (o.children = await Promise.all(
     o.children.map(async (s) => await C(s))
   )), o;
 }
-function p(t, i) {
-  if (!(!i.sections || i.sections.length === 0)) {
-    for (const o of i.sections)
+function E(i, t) {
+  if (!(!t.sections || t.sections.length === 0)) {
+    for (const o of t.sections)
       if (o.children) {
         for (const s of o.children)
           if (s.children) {
             for (const e of s.children)
               if (e.children)
                 for (let a = 0; a < e.children.length; a++) {
-                  const n = e.children[a];
-                  if (n.id === t.id)
+                  const h = e.children[a];
+                  if (h.id === i.id)
                     return { column: e, index: a };
-                  if (n.tag === "arcgis-nav-card") {
-                    const r = n.properties?.sections, h = p(t, {
-                      sections: r || []
-                    });
-                    if (h)
-                      return h;
-                  }
-                  if (y(n) && n.children) {
-                    const r = p(t, {
-                      sections: [{ children: [n] }]
+                  if (h.tag === "arcgis-nav-card") {
+                    const n = h.properties?.sections, r = E(i, {
+                      sections: n || []
                     });
                     if (r)
                       return r;
                   }
+                  if (f(h) && h.children) {
+                    const n = E(i, {
+                      sections: [{ children: [h] }]
+                    });
+                    if (n)
+                      return n;
+                  }
                 }
           }
       }
@@ -134,125 +134,127 @@ function p(t, i) {
 }
 class W extends x {
   constructor() {
-    super(), this._messages = R({ blocking: !0 }), this.#i = A({ context: S }), this._nodeControlsEl = L(), this._initShell = () => {
-      const i = this.el;
-      i.style.setProperty("--offsetTop", `${i.offsetTop}px`);
-    }, this._layoutNodeEditor = L(), this._handleExitEditMode = async (i) => {
-      i.stopPropagation(), this.arcgisHubLayoutEditorExit.emit();
-    }, this._handlePublishLayout = async (i) => {
-      i.stopPropagation(), this.arcgisHubLayoutPublished.emit(this._layout);
+    super(), this._messages = D({ blocking: !0 }), this.#t = P({ context: S }), this._layoutRef = _(), this._nodeControlsEl = _(), this._initShell = () => {
+      const t = this.el;
+      t.style.setProperty("--offsetTop", `${t.offsetTop}px`);
+    }, this._layoutNodeEditor = _(), this._handleExitEditMode = async (t) => {
+      t.stopPropagation(), this.arcgisHubLayoutEditorExit.emit();
+    }, this._handlePublishLayout = async (t) => {
+      t.stopPropagation(), this.arcgisHubLayoutPublished.emit(this._layout);
     }, this._handleCloseEditPanel = () => {
       this._isEditPanelOpen = !1;
-    }, this._liveAnnouncement = void 0, this._layoutErrors = [], this._historyStack = [], this._historyIdx = -1, this._isLayoutDirty = !1, this._isLayoutValid = !0, this._isEditPanelOpen = !1, this.debug = !1, this.isEditMode = !1, this.isPublishing = !1, this.options = {}, this.arcgisHubLayoutChanged = f(), this.arcgisHubLayoutEditorExit = f(), this.arcgisHubLayoutPublished = f(), this.listen("arcgisLayoutNodeChange", async (i) => await this._handleLayoutNodeEditorChange(i)), this.listen("arcgisLayoutNodeVisibilityChange", async (i) => await this._handleLayoutNodeVisibilityChange(i)), this.listen("arcgisLayoutNodeHighlight", (i) => this._handleNodeHighlight(i)), this.listen("arcgisLayoutNodeUnHighlight", (i) => this._handleNodeUnHighlight(i)), this.listen("arcgisLayoutNodeEditorOpen", () => this._handleLayoutNodeEditorOpen()), this.listen("arcgisLayoutAddNode", async (i) => await this._handleLayoutAddNode(i)), this.listenOn(window, "resize", this._initShell);
+    }, this._liveAnnouncement = void 0, this._layoutErrors = [], this._historyStack = [], this._historyIdx = -1, this._isLayoutDirty = !1, this._isLayoutValid = !0, this._isEditPanelOpen = !1, this.debug = !1, this.isEditMode = !1, this.isPublishing = !1, this.options = {}, this.arcgisHubLayoutChanged = y(), this.arcgisHubLayoutEditorExit = y(), this.arcgisHubLayoutPublished = y(), this.hubTelemetry = y(), this.listen("arcgisLayoutNodeChange", async (t) => await this._handleLayoutNodeEditorChange(t)), this.listen("arcgisLayoutNodeVisibilityChange", async (t) => await this._handleLayoutNodeVisibilityChange(t)), this.listen("arcgisLayoutNodeHighlight", (t) => this._handleNodeHighlight(t)), this.listen("arcgisLayoutNodeUnHighlight", (t) => this._handleNodeUnHighlight(t)), this.listen("arcgisLayoutNodeEditorOpen", () => this._handleLayoutNodeEditorOpen()), this.listen("arcgisLayoutAddNode", async (t) => await this._handleLayoutAddNode(t)), this.listenOn(window, "resize", this._initShell);
   }
   static {
     this.properties = { _liveAnnouncement: 16, _processedLayout: 16, _layoutErrors: 16, _highlightedNode: 16, _highlightedElement: 16, _layoutNodeEditorConfig: 16, _historyStack: 16, _historyIdx: 16, _isLayoutDirty: 16, _isLayoutValid: 16, _isEditPanelOpen: 16, layout: 0, debug: 7, isEditMode: 7, isPublishing: 5, options: 0 };
   }
   static {
-    this.shadowRootOptions = P;
+    this.shadowRootOptions = A;
   }
   static {
     this.styles = U;
   }
   get _context() {
-    return H();
+    return M();
   }
-  #i;
+  #t;
   connectedCallback() {
     super.connectedCallback(), this._initShell();
   }
-  willUpdate(i) {
-    (i.has("layout") || i.has("options")) && this._init(), this.hasUpdated && i.has("isEditMode") && this.updateEditModeAnnouncement();
+  willUpdate(t) {
+    (t.has("layout") || t.has("options")) && this._init(), this.hasUpdated && t.has("isEditMode") && this.updateEditModeAnnouncement();
   }
   loaded() {
-    this.#i.setValue(this._messages);
+    this.#t.setValue(this._messages);
   }
   updateEditModeAnnouncement() {
     this._liveAnnouncement = "";
-    const i = this.isEditMode ? this._messages.editModeActivatedLiveRegion : this._messages.editModeDeactivatedLiveRegion;
+    const t = this.isEditMode ? this._messages.editModeActivatedLiveRegion : this._messages.editModeDeactivatedLiveRegion;
     setTimeout(() => {
-      this._liveAnnouncement = i;
+      this._liveAnnouncement = t;
     }, 250);
   }
   async _init() {
-    const i = await Y(this.layout);
-    this._layout = l(i), this._processedLayout = await this._validateAndProcess(this._layout, this.options), this._historyStack = [this._processedLayout], this._historyIdx = 0;
+    const t = await Y(this.layout);
+    this._layout = l(t), this._processedLayout = await this._validateAndProcess(this._layout, this.options), this._historyStack = [this._processedLayout], this._historyIdx = 0;
   }
-  async _handleLayoutNodeEditorChange(i) {
-    const { layoutNodeConfig: o, id: s, values: e, valid: a } = i.detail, n = l(this._layout), r = g(n, s);
-    if (r) {
-      const h = v(o, "editor.valuesOutCallback") || ((d) => d);
-      r.properties = h(e), this._layout = n, this._processedLayout = await this._validateAndProcess(n, this.options), this._highlightedNode = g(this._processedLayout, s), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._processedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutDirty = !0, this._isLayoutValid = a, this.arcgisHubLayoutChanged.emit();
+  async _handleLayoutNodeEditorChange(t) {
+    const { layoutNodeConfig: o, id: s, values: e, valid: a } = t.detail, h = l(this._layout), n = g(h, s);
+    if (n) {
+      const r = v(o, "editor.valuesOutCallback") || ((d) => d);
+      n.properties = r(e), this._layout = h, this._processedLayout = await this._validateAndProcess(h, this.options), this._highlightedNode = g(this._processedLayout, s), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._processedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutDirty = !0, this._isLayoutValid = a, this.arcgisHubLayoutChanged.emit();
     }
   }
-  async _handleLayoutNodeVisibilityChange(i) {
-    const { id: o } = i.detail, s = l(this._layout), e = g(s, o);
+  async _handleLayoutNodeVisibilityChange(t) {
+    const { id: o } = t.detail, s = l(this._layout), e = g(s, o);
     e && (e.visibility || (e.visibility = { kind: "static", isHidden: !1 }), e.visibility.kind === "static" && (e.visibility.isHidden = !e.visibility.isHidden), this._layout = s, this._processedLayout = await this._validateAndProcess(s, this.options), this._highlightedNode = g(this._processedLayout, o), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._processedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutDirty = !0, this.arcgisHubLayoutChanged.emit());
   }
-  async _validateAndProcess(i, o) {
-    const s = q(i);
-    return this._layoutErrors = s, s.length > 0 && !this.debug && u.error("Layout validation errors:", s), await V(i, o, this._context);
+  async _validateAndProcess(t, o) {
+    const s = q(t);
+    return this._layoutErrors = s, s.length > 0 && !this.debug && u.error("Layout validation errors:", s), await I(t, o, this._context);
   }
-  hitTest(i) {
+  hitTest(t) {
     let o = !1;
     if (this._highlightedElement) {
       const s = this._highlightedElement.getBoundingClientRect();
-      i.clientX >= s.left && i.clientX <= s.right && i.clientY >= s.top && i.clientY <= s.bottom && (o = !0);
+      t.clientX >= s.left && t.clientX <= s.right && t.clientY >= s.top && t.clientY <= s.bottom && (o = !0);
     }
     return o;
   }
-  _handleNodeHighlight(i) {
-    i.stopPropagation(), u.debug("NODE HIGHLIGHT EVENT >>>", i);
-    const o = i.detail.target, s = o.dataset.nodeId || "";
+  _handleNodeHighlight(t) {
+    t.stopPropagation(), u.debug("NODE HIGHLIGHT EVENT >>>", t);
+    const o = t.detail.target, s = o.dataset.nodeId || "";
     if (s) {
       const e = g(this._processedLayout, s);
       e ? this._highlightedNode !== e && this._highlightedElement !== o && (this._highlightedNode = e, this._highlightedElement = o) : u.warn(`No node found for target with id ${s}`);
     }
   }
-  _handleNodeUnHighlight(i) {
-    i.stopPropagation(), u.debug("NODE UNHIGHLIGHT EVENT >>>", i), !this._nodeControlsEl.value?.matches(":hover") && // this._highlightedElement === referenceElement &&
-    !this.hitTest(i.detail) && (this._highlightedNode = void 0, this._highlightedElement = void 0);
+  _handleNodeUnHighlight(t) {
+    t.stopPropagation(), u.debug("NODE UNHIGHLIGHT EVENT >>>", t), !this._nodeControlsEl.value?.matches(":hover") && // this._highlightedElement === referenceElement &&
+    !this.hitTest(t.detail) && (this._highlightedNode = void 0, this._highlightedElement = void 0);
   }
-  _handleNodeControlsMouseOut(i) {
-    this.hitTest(i) || (this._highlightedNode = void 0, this._highlightedElement = void 0);
+  _handleNodeControlsMouseOut(t) {
+    this.hitTest(t) || (this._highlightedNode = void 0, this._highlightedElement = void 0);
   }
   _handleLayoutNodeEditorOpen() {
     if (!this._highlightedElement || !this._highlightedNode)
       return;
     this._isEditPanelOpen = !0;
-    let i = O(this._highlightedElement, this._highlightedNode);
-    i && (i = D(this._messages, i)), this._layoutNodeEditorConfig = {
-      layoutNodeConfig: l(i),
+    let t = V(this._highlightedElement, this._highlightedNode);
+    t && (t = R(this._messages, t)), this._layoutNodeEditorConfig = {
+      layoutNodeConfig: l(t),
       layoutNode: l(this._highlightedNode)
     };
   }
-  async _handleLayoutAddNode(i) {
-    u.debug("Add node event:", i.detail.config.tag);
-    const o = l(this._layout), { column: s, index: e } = p(i.detail.adjacentNode, o);
-    u.debug("Found column and index:", s, e), s.children?.splice(e + 1, 0, {
+  async _handleLayoutAddNode(t) {
+    u.debug("Add node event:", t.detail.config.tag);
+    const o = l(this._layout), { column: s, index: e } = E(t.detail.adjacentNode, o);
+    u.debug("Found column and index:", s, e);
+    const a = {
       id: T(),
-      tag: i.detail.config.tag,
-      properties: i.detail.config.defaults
-    }), this._highlightedNode = void 0, this._highlightedElement = void 0, this._layout = o, this._processedLayout = await this._validateAndProcess(o, this.options);
+      tag: t.detail.config.tag,
+      properties: t.detail.config.defaults
+    };
+    s.children?.splice(e + 1, 0, a), this._layout = o, this._processedLayout = await this._validateAndProcess(o, this.options), this._highlightedNode = a, await new Promise((h) => setTimeout(h, 250)), this._highlightedElement = await this._layoutRef.value?.getCardEl(a.id), this._handleLayoutNodeEditorOpen(), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._processedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutDirty = !0, this.arcgisHubLayoutChanged.emit(), t.detail.config.telemetry && this.hubTelemetry.emit(t.detail.config.telemetry);
   }
   renderEditToolbar() {
-    let i;
-    return this.isEditMode && (i = c`<arcgis-layout-editor-toolbar .exitEditMode=${this._handleExitEditMode} .isLayoutDirty=${this._isLayoutDirty} .isLayoutValid=${this._isLayoutValid} .isPublishing=${this.isPublishing} .publishLayout=${this._handlePublishLayout} slot=header></arcgis-layout-editor-toolbar>`), i;
+    let t;
+    return this.isEditMode && (t = c`<arcgis-layout-editor-toolbar .exitEditMode=${this._handleExitEditMode} .isLayoutDirty=${this._isLayoutDirty} .isLayoutValid=${this._isLayoutValid} .isPublishing=${this.isPublishing} .publishLayout=${this._handlePublishLayout} slot=header></arcgis-layout-editor-toolbar>`), t;
   }
   renderNodeControls() {
-    let i;
-    return this.isEditMode && this._highlightedElement && this._highlightedNode && (i = c`<arcgis-layout-node-controls .layoutNodeEditorRef=${this._layoutNodeEditor.value} .isEditMode=${this.isEditMode} .isLayoutValid=${this._isLayoutValid} .messages=${this._messages} .node=${this._highlightedNode} @mouseout=${this._handleNodeControlsMouseOut} .referenceElement=${this._highlightedElement} style="position: absolute;" ${b(this._nodeControlsEl)}></arcgis-layout-node-controls>`), i;
+    let t;
+    return this.isEditMode && this._highlightedElement && this._highlightedNode && (t = c`<arcgis-layout-node-controls .layoutNodeEditorRef=${this._layoutNodeEditor.value} .isEditMode=${this.isEditMode} .isLayoutValid=${this._isLayoutValid} .messages=${this._messages} .node=${this._highlightedNode} @mouseout=${this._handleNodeControlsMouseOut} .referenceElement=${this._highlightedElement} style="position: absolute;" ${p(this._nodeControlsEl)}></arcgis-layout-node-controls>`), t;
   }
   renderEditor() {
     if (this.isEditMode && this._isEditPanelOpen) {
-      const i = this._layoutNodeEditorConfig;
-      if (i?.layoutNodeConfig?.editor)
-        return c`<calcite-shell-panel position=end slot=panel-end><calcite-panel .heading=${M(i.layoutNodeConfig, "i18n.label", v(this._messages, "layoutNodeControls.configurableNodes.default.label"))}><calcite-action class="panel-close" .disabled=${!this._isLayoutValid} icon=x @click=${this._handleCloseEditPanel} slot=header-actions-end .text=${this._messages.close}></calcite-action>${N(i.layoutNode.id, c`<arcgis-layout-node-editor .layoutNodeConfig=${i.layoutNodeConfig} .node=${i.layoutNode} ${b(this._layoutNodeEditor)}></arcgis-layout-node-editor>`)}</calcite-panel></calcite-shell-panel>`;
+      const t = this._layoutNodeEditorConfig;
+      if (t?.layoutNodeConfig?.editor)
+        return c`<calcite-shell-panel position=end slot=panel-end><calcite-panel .heading=${H(t.layoutNodeConfig, "i18n.label", v(this._messages, "layoutNodeControls.configurableNodes.default.label"))}><calcite-action class="panel-close" .disabled=${!this._isLayoutValid} icon=x @click=${this._handleCloseEditPanel} slot=header-actions-end .text=${this._messages.close}></calcite-action>${b(t.layoutNode.id, c`<arcgis-layout-node-editor .layoutNodeConfig=${t.layoutNodeConfig} .node=${t.layoutNode} ${p(this._layoutNodeEditor)}></arcgis-layout-node-editor>`)}</calcite-panel></calcite-shell-panel>`;
     }
     return null;
   }
   render() {
-    return c`<calcite-shell>${N("aria-live-region", c`<div aria-atomic=true aria-live=polite id=arcgis-layout-container-edit-mode-live-region>${this._liveAnnouncement}</div>`)}${this.renderEditToolbar()}${this.renderNodeControls()}${this.renderEditor()}<arcgis-layout .highlightedNode=${this._highlightedNode} .debug=${this.debug} .isEditMode=${this.isEditMode} .layout=${this._processedLayout} .options=${this.options}></arcgis-layout></calcite-shell>`;
+    return c`<calcite-shell>${b("aria-live-region", c`<div aria-atomic=true aria-live=polite id=arcgis-layout-container-edit-mode-live-region>${this._liveAnnouncement}</div>`)}${this.renderEditToolbar()}${this.renderNodeControls()}${this.renderEditor()}<arcgis-layout .highlightedNode=${this._highlightedNode} .debug=${this.debug} .isEditMode=${this.isEditMode} .layout=${this._processedLayout} .options=${this.options} ${p(this._layoutRef)}></arcgis-layout></calcite-shell>`;
   }
 }
 w("arcgis-layout-container", W);

package/dist/components/arcgis-layout-editor-toolbar/customElement.js

@@ -2,16 +2,16 @@ import { c as i } from "../../chunks/runtime.js";
 import { html as s } from "lit-html";
 import { LitElement as e } from "@arcgis/lumina";
 import { css as o } from "@lit/reactive-element/css-tag.js";
-import { u as a } from "../../chunks/useT9n.js";
-import { focusElement as l } from "@arcgis/toolkit/dom";
+import { u as l } from "../../chunks/useT9n.js";
+import { focusElement as a } from "@arcgis/toolkit/dom";
 import { createRef as r, ref as n } from "lit/directives/ref.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/0.13/esri/copyright.txt for details.
-v0.13.1 */
+v0.13.2 */
 const c = o`calcite-navigation{border-block-start:1px solid var(--calcite-navigation-border-color, var(--calcite-color-border-3));[slot=content-end]{margin-inline-end:1rem}[slot=content-end]{display:flex}[slot=content-end]{gap:.75rem}}`;
 class u extends e {
   constructor() {
-    super(...arguments), this._messages = a(), this._exitButtonEl = r(), this.isLayoutDirty = !1, this.isLayoutValid = !0, this.isPublishing = !1;
+    super(...arguments), this._messages = l(), this._exitButtonEl = r(), this.isLayoutDirty = !1, this.isLayoutValid = !0, this.isPublishing = !1;
   }
   static {
     this.properties = { exitEditMode: 0, publishLayout: 0, isLayoutDirty: 5, isLayoutValid: 5, isPublishing: 5 };
@@ -26,10 +26,8 @@ class u extends e {
     let t;
     return this.isLayoutDirty || (t = this._messages.noChanges), this.isLayoutValid || (t = this._messages.invalidLayout), t;
   }
-  updated() {
-    setTimeout(() => {
-      l(this._exitButtonEl.value);
-    }, 50);
+  loaded() {
+    a(this._exitButtonEl.value);
   }
   render() {
     const t = this._messages.exit;

package/dist/components/arcgis-layout-node-controls/customElement.js

@@ -8,7 +8,7 @@ import { i as f } from "../../chunks/isNodeVisible.js";
 import { dictionary as p } from "@esri/telemetry-dictionary-hub";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/0.13/esri/copyright.txt for details.
-v0.13.1 */
+v0.13.2 */
 const m = c`:host{position:absolute}`;
 class y extends r {
   constructor() {

package/dist/components/arcgis-layout-node-editor/customElement.js

@@ -7,7 +7,7 @@ import { css as f } from "@lit/reactive-element/css-tag.js";
 import { ArcgisLayoutNodeEditorDynamicTag as C } from "./layout-node-editor-dynamic-tag/customElement.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/0.13/esri/copyright.txt for details.
-v0.13.1 */
+v0.13.2 */
 const p = f`@layer{arcgis-configuration-editor:focus{--focus-color: var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline:solid 2px var(--focus-color)}}`;
 class m extends n {
   constructor() {

package/dist/components/arcgis-layout-node-editor/layout-node-editor-dynamic-tag/customElement.js

@@ -2,7 +2,7 @@ import { html as t } from "lit-html";
 import { spreadProps as d, spreadEvents as o } from "@open-wc/lit-helpers";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/0.13/esri/copyright.txt for details.
-v0.13.1 */
+v0.13.2 */
 function g({ tagName: c, props: r }) {
   const n = r.onInputChangeEvent || void 0, a = {
     ...r