q2-tecton-elements 1.52.2 → 1.54.0

package/dist/q2-tecton-elements/q2-calendar.entry.js

@@ -2,7 +2,7 @@ import { r as e, c as t, h as i, g as a } from "./index-7a5365e2.js";
 
 import { d as n } from "./index-3184c760.js";
 
-import { l as s, a as r, o, i as d, w as l, j as c } from "./index-d18e2a20.js";
+import { l as s, a as r, o, i as d, w as l, j as c } from "./index-504f1a9e.js";
 
 function formatDateISO(e) {
   const t = new Date(e);

package/dist/q2-tecton-elements/q2-card.entry.js

@@ -1,6 +1,6 @@
 import { r as t, c as a, h as r, F as c, g as o } from "./index-7a5365e2.js";
 
-import { k as e, o as i, i as s } from "./index-d18e2a20.js";
+import { k as e, o as i, i as s } from "./index-504f1a9e.js";
 
 const n = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}.container{position:relative;width:100%;text-align:start;height:100%;display:grid;gap:var(--tct-card-gap, var(--t-card-gap, var(--app-scale-3x, 15px)));margin:0;color:var(--tct-card-color, var(--t-card-color, var(--t-text, #4d4d4d)));--comp-avatar-size:var(--tct-card-avatar-size, var(--t-card-avatar-size, 44px));--comp-chevron-size:0;--comp-bar-width:var(--tct-card-bar-width, var(--t-card-bar-width, var(--app-scale-2x, 10px)));--comp-card-padding:var(--tct-card-padding, var(--t-card-padding, var(--app-scale-4x, 20px)))}.container.is-small{--comp-avatar-size:var(--tct-card-avatar-size, var(--t-card-avatar-size, 26px))}.container.has-avatar{grid-template-columns:var(--comp-avatar-size) 1fr;--tct-avatar-width:var(--comp-avatar-size);--tct-avatar-height:var(--comp-avatar-size);--tct-icon-size:var(--comp-avatar-size)}:host([bar][is-static]) .container{padding-left:var(--comp-card-padding)}:host(:not([is-static])) .container{--comp-border-radius:var(--tct-card-border-radius, var(--t-card-border-radius, var(--app-border-radius-1, 4px)));--comp-border-width:var(--tct-card-border-width, var(--t-card-border-width, 0px));border:none;background:var(--tct-card-background, var(--t-card-background, var(--t-base, #ffffff)));padding:var(--comp-card-padding);text-decoration:none;border-width:var(--comp-border-width);border-color:var(--tct-card-border-color, var(--t-card-border-color, transparent));border-style:var(--tct-card-border-style, solid);border-radius:var(--comp-border-radius);transition:box-shadow var(--tct-tween-1, var(--app-tween-1, 0.2s ease));box-shadow:var(--tct-card-box-shadow, var(--t-card-box-shadow, var(--app-shadow-2, 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 4px 8px rgba(0, 0, 0, 0.14))))}:host(:not([is-static])) .container.clickable{cursor:pointer}@media (hover: hover){:host(:not([is-static])) .container.clickable{--comp-card-hover-box-shadow:var(--tct-card-hover-box-shadow, var(--t-card-hover-box-shadow, var(--app-shadow-3, 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 8px 16px rgba(0, 0, 0, 0.14))))}:host(:not([is-static])) .container.clickable:hover,:host(:not([is-static])) .container.clickable:active,:host(:not([is-static])) .container.clickable:focus{color:var(--tct-card-color, var(--t-card-color, var(--t-text, #4d4d4d)));box-shadow:var(--const-double-focus-ring)}:host(:not([is-static])) .container.clickable:hover{box-shadow:var(--comp-card-hover-box-shadow)}:host(:not([is-static])) .container.clickable:focus:hover{box-shadow:var(--const-double-focus-ring), var(--comp-card-hover-box-shadow)}:host(:not([is-static])) .container.clickable:active{box-shadow:var(--tct-card-active-box-shadow, var(--t-card-active-box-shadow, var(--app-shadow-1, 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14))))}}:host(:not([is-static])) .container.is-touch{--comp-chevron-size:var(--tct-card-chevron-size, var(--t-card-chevron-size, 26px));grid-template-columns:1fr var(--comp-chevron-size)}:host(:not([is-static])) .container.has-avatar.is-touch{grid-template-columns:var(--comp-avatar-size) 1fr var(--comp-chevron-size)}.content{overflow:hidden;display:grid;gap:var(--tct-card-content-gap, var(--t-card-content-gap, var(--app-scale-1x, 5px)));align-content:start}h3,p{margin:0;padding:0;line-height:var(--tct-card-font-height, var(--t-card-font-height, 20px))}h3{font-weight:var(--tct-card-font-weight, var(--t-card-font-weight, 600));font-size:var(--tct-card-font-size, var(--t-card-font-size, 17px));text-overflow:ellipsis;overflow:hidden;white-space:nowrap}p{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.bar{--comp-bar-border-radius:calc(var(--comp-border-radius) - var(--comp-border-width));border-radius:var(--comp-bar-border-radius) 0 0 var(--comp-bar-border-radius);position:absolute;inset:0 auto auto 0;width:var(--comp-bar-width);background:var(--comp-bar-color);height:100%}.bar.color-primary{--comp-bar-color:var(--tct-card-bar-color-primary, var(--t-primary, #5446a4))}.bar.color-secondary{--comp-bar-color:var(--tct-card-bar-color-secondary, var(--t-secondary, #b6b3cc))}.bar.color-tertiary{--comp-bar-color:var(--tct-card-bar-color-tertiary, var(--t-tertiary, #ebe8fc))}.bar.color-info{--comp-bar-color:var(--tct-card-bar-color-info, var(--const-stoplight-info, #0079c1))}.bar.color-success{--comp-bar-color:var(--tct-card-bar-color-success, var(--const-stoplight-success, #0e8a00))}.bar.color-warning{--comp-bar-color:var(--tct-card-bar-color-warning, var(--const-stoplight-warning, #c35500))}.bar.color-alert{--comp-bar-color:var(--tct-card-bar-color-alert, var(--const-stoplight-alert, #c35500))}.bar.color-accent-1{--comp-bar-color:var(--tct-card-bar-color-accent-1, var(--t-accent-1, #e05252))}.bar.color-accent-2{--comp-bar-color:var(--tct-card-bar-color-accent-2, var(--t-accent-2, #e09952))}.bar.color-accent-3{--comp-bar-color:var(--tct-card-bar-color-accent-3, var(--t-accent-3, #e0e052))}.bar.color-accent-4{--comp-bar-color:var(--tct-card-bar-color-accent-4, var(--t-accent-4, #99e052))}.bar.color-accent-5{--comp-bar-color:var(--tct-card-bar-color-accent-5, var(--t-accent-5, #52e052))}.bar.color-accent-6{--comp-bar-color:var(--tct-card-bar-color-accent-6, var(--t-accent-6, #52e099))}.bar.color-accent-7{--comp-bar-color:var(--tct-card-bar-color-accent-7, var(--t-accent-7, #52e0e0))}.bar.color-accent-8{--comp-bar-color:var(--tct-card-bar-color-accent-8, var(--t-accent-8, #5299e0))}.bar.color-accent-9{--comp-bar-color:var(--tct-card-bar-color-accent-9, var(--t-accent-9, #5252e0))}.bar.color-accent-10{--comp-bar-color:var(--tct-card-bar-color-accent-10, var(--t-accent-10, #9952e0))}.bar.color-accent-11{--comp-bar-color:var(--tct-card-bar-color-accent-11, var(--t-accent-11, #e052e0))}.bar.color-accent-12{--comp-bar-color:var(--tct-card-bar-color-accent-12, var(--t-accent-12, #e05299))}.touch-indicator{align-self:center;--tct-icon-size:var(--comp-chevron-size)}";
 

package/dist/q2-tecton-elements/q2-carousel-pane.entry.js

@@ -1,6 +1,6 @@
 import { r as e, c as t, h as a, H as r, g as o } from "./index-7a5365e2.js";
 
-import { l as n } from "./index-d18e2a20.js";
+import { l as n } from "./index-504f1a9e.js";
 
 const s = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}q2-carousel .swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;transition:all 0.2s}q2-carousel-pane.q2-carousel-pane{--comp-carousel-pane-tween:var(--tct-tween-1, var(--app-tween-1, 0.2s ease));--comp-carousel-shadow:var(--app-shadow-2, 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 4px 8px rgba(0, 0, 0, 0.14));cursor:grab}q2-carousel-pane.q2-carousel-pane:not([is-active-pane]) *{cursor:pointer}q2-carousel-pane.q2-carousel-pane:focus{box-shadow:none}q2-carousel-pane.q2-carousel-pane:focus .q2-carousel-pane-main-content{outline:none;box-shadow:var(--const-double-focus-ring)}q2-carousel-pane.q2-carousel-pane button{border:0;background:transparent;transition:all 0.2s;opacity:0.3;cursor:pointer}q2-carousel-pane.q2-carousel-pane button:hover{opacity:0.7}q2-carousel-pane.q2-carousel-pane .q2-carousel-pane-main-content{box-shadow:var(--comp-carousel-shadow);transition:var(--comp-carousel-pane-tween);background:var(--tct-carousel-background, var(--tct-carousel-background-color, var(--t-carousel-background-color, var(--tct-white, var(--app-white, #ffffff)))));border:var(--tct-carousel-pane-border-width, var(--t-carousel-pane-border-width, 0px)) solid var(--tct-carousel-pane-border-color, var(--t-carousel-pane-border-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))));border-radius:var(--tct-carousel-pane-border-radius, var(--t-carousel-pane-border-radius, 8px));padding:var(--tct-carousel-pane-padding, var(--t-carousel-pane-padding, 7px));height:var(--tct-carousel-pane-height, var(--t-carousel-pane-height, 10em))}q2-carousel-pane.q2-carousel-pane .q2-carousel-pane-main-content:hover{box-shadow:var(--const-double-focus-ring), var(--comp-carousel-shadow)}q2-carousel-pane.q2-carousel-pane[slot-frameless]:not([slot-frameless=false]) .q2-carousel-pane-main-content{box-shadow:none;border:0;border-radius:0;padding:0}";
 

package/dist/q2-tecton-elements/q2-carousel.entry.js

@@ -1,6 +1,6 @@
 import { r as e, c as t, h as i, F as n, H as s, g as r } from "./index-7a5365e2.js";
 
-import { c as o, l as a, a as l, o as c, i as f } from "./index-d18e2a20.js";
+import { c as o, l as a, a as l, o as c, i as f } from "./index-504f1a9e.js";
 
 /**
  * SSR Window 4.0.2

package/dist/q2-tecton-elements/q2-chart-area.entry.js

@@ -1,6 +1,6 @@
 import { r, c as a, h as t, g as e } from "./index-7a5365e2.js";
 
-import { o as i, l as n } from "./index-d18e2a20.js";
+import { o as i, l as n } from "./index-504f1a9e.js";
 
 import { _ as o, c as s, e as v, l as f, u, s as l, i as h, g as d, n as c, Z as p, a as m, b as y, t as b, d as S, r as g, f as P, G as w, h as M, j as I, S as D, m as L, k as x, o as N, p as T, q as k, P as C, v as A, w as E, x as O, y as B, z as F, A as z, C as G, B as U, D as V, E as R, F as q, H as K, I as j, L as _, J as Z, K as $, M as X, N as Y, O as H, Q as J, R as W, T as Q, U as rr, V as ar, W as tr, X as er, Y as ir, $ as nr, a0 as or, a1 as sr, a2 as vr, a3 as fr, a4 as ur, a5 as lr, a6 as hr, a7 as dr, a8 as cr, a9 as pr, aa as mr, ab as yr, ac as br, ad as Sr, ae as gr, af as Pr } from "./charting-1abfb877.js";
 

package/dist/q2-tecton-elements/q2-chart-bar.entry.js

@@ -1,6 +1,6 @@
 import { r as e, h as r, g as a } from "./index-7a5365e2.js";
 
-import { o as t, l as i } from "./index-d18e2a20.js";
+import { o as t, l as i } from "./index-504f1a9e.js";
 
 import { _ as s, I as n, S as o, b6 as h, P as u, b7 as l, o as d, a0 as c, h as f, i as v, u as p, s as g, H as b, b8 as m, G as w, m as S, d as B, C as A, W as y, a as x, g as M, b as k, b9 as P, t as V, z as C, ba as N, V as L, ai as D, bb as z, bc as j, a9 as U, aa as T, ab as I, ac as O, ad as R, ae as E, af as W } from "./charting-1abfb877.js";
 

package/dist/q2-tecton-elements/q2-chart-donut.entry.js

@@ -1,6 +1,6 @@
 import { r as t, c as e, h as i, g as r } from "./index-7a5365e2.js";
 
-import { o as a, i as n, l as o, d as s } from "./index-d18e2a20.js";
+import { o as a, i as n, l as o, d as s } from "./index-504f1a9e.js";
 
 import { br as l, W as c, _ as h, ay as u, bs as v, bt as d, b5 as f, bu as p, D as g, bv as b, x as m, a0 as w, I as y, bw as x, aM as S, bx as T, by as M, j as L, bz as C, E as I, bA as A, bB as P, bC as k, bD as V, d as D, bE as z, bF as O, bG as N, bH as R, bI as B, bJ as H, bK as W, bL as U, a as F, bM as j, bN as $, bO as X, bP as G, bQ as Y, bj as E, aK as _, bR as K, a$ as q, bS as J, bT as Z, bU as Q, a9 as tt, b0 as et, bV as it, aA as rt, bW as at, a4 as nt, m as ot, a6 as st, o as lt, y as ct, bX as ht, bY as ut, b as vt, bZ as dt, b2 as ft, b_ as pt, b$ as gt, c0 as bt, c as mt, ai as wt, G as yt, aB as xt, b6 as St, aC as Tt, c1 as Mt, b1 as Lt, u as Ct, c2 as It, aw as At, a3 as Pt, R as kt, bm as Vt, i as Dt, s as zt, z as Ot, t as Nt, g as Rt, be as Bt, c3 as Ht, V as Wt, b8 as Ut, C as Ft, ak as jt, am as $t, c4 as Xt, c5 as Gt, c6 as Yt, S as Et, c7 as _t, ab as Kt, aa as qt, ac as Jt, ad as Zt } from "./charting-1abfb877.js";
 

package/dist/q2-tecton-elements/q2-checkbox-group.entry.js

@@ -1,6 +1,6 @@
 import { r as t, c as e, h as r, F as o, g as i } from "./index-7a5365e2.js";
 
-import { c as a, f as s } from "./index-d18e2a20.js";
+import { c as a, f as s } from "./index-504f1a9e.js";
 
 const n = '*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{margin-top:var(--tct-checkbox-group-margin-top, var(--app-scale-2x, 10px))}fieldset{padding:var(--tct-checkbox-group-fieldset-padding, 0);margin:0;border:0;position:relative}.label-row{display:grid;grid-template-columns:1fr 24px;grid-template-areas:"label icon";column-gap:var(--tct-checkbox-group-label-column-gap, var(--app-scale-2x, 10px))}.label-row q2-icon{grid-area:icon;margin-top:-2px;margin-bottom:-2px}.group-legend{font-weight:600}legend.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0}.slot-container{margin:var(--app-scale-1x, 5px) 0;padding:var(--app-scale-1x, 5px);border-width:1px;border-color:transparent;border-style:solid;border-radius:var(--tct-checkbox-group-border-radius, var(--app-border-radius-1, 4px))}:host([has-error]) .slot-container{border-color:var(--tct-checkbox-group-error-border-color, var(--const-stoplight-alert, #d20a0a))}:host([has-error=false]) .slot-container{border-color:transparent}.optional-tag{margin-left:var(--tct-checkbox-group-label-optional-margin-left, var(--app-scale-1x, 5px));color:var(--tct-checkbox-group-label-optional-color, var(--t-checkbox-group-label-optional-color, var(--tct-a11y-color, var(--t-a11y-color, var(--tct-a11y-gray-color, var(--t-a11y-gray-color, var(--tct-gray-7, var(--t-gray-7, var(--tct-gray-d1, var(--t-gray-d1, var(--app-gray-d1, rgba(77, 77, 77, 0.77))))))))))));font-size:var(--tct-checkbox-group-label-optional-font-size, 12px);font-weight:var(--tct-checkbox-group-label-optional-font-weight, 400)}.flexed{margin:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.flexed.left{justify-content:left}';
 

package/dist/q2-tecton-elements/q2-checkbox.entry.js

@@ -1,6 +1,6 @@
 import { r as e, c as o, h as c, g as t } from "./index-7a5365e2.js";
 
-import { c as r, a as h, o as a, i, l } from "./index-d18e2a20.js";
+import { c as r, a as h, o as a, i, l } from "./index-504f1a9e.js";
 
 const s = '*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{--comp-checkbox-padding:var(--tct-checkbox-padding, var(--tct-checkbox-vertical-padding, var(--t-checkbox-vertical-padding, var(--tct-scale-2, var(--app-scale-2x, 10px)))) 0);display:block;position:relative;padding:var(--comp-checkbox-padding)}.container{--comp-checkbox-size:var(--tct-checkbox-size, var(--t-checkbox-size, 20px));--comp-checkbox-default-column-gap:var(--app-scale-2x, 10px);--comp-checkbox-default-row-gap:0;--comp-checkbox-default-gap:var(--comp-checkbox-default-row-gap) var(--comp-checkbox-default-column-gap);--comp-checkbox-tween:var(--tct-tween-1, var(--app-tween-1, 0.2s ease));--comp-checkbox-toggle-width:var(--tct-checkbox-toggle-width, var(--t-checkbox-toggle-width, 46px));--comp-checkbox-gap:var(--tct-checkbox-gap, var(--t-checkbox-gap, var(--comp-checkbox-default-gap)));--comp-checkbox-outer-stroke-color:var(--tct-checkbox-outer-stroke-color, var(--t-checkbox-outer-stroke-color, var(--t-a11y-gray-color-AA, #949494)));--comp-checkbox-outer-fill-color:var(--tct-checkbox-outer-fill-color, var(--t-checkbox-outer-fill-color, var(--tct-white, var(--app-white, #ffffff))));--comp-checkbox-checked-color:var(--tct-checkbox-check-stroke-color, var(--t-checkbox-check-stroke-color, var(--t-checkbox-fill, var(--t-a11y-active-gray-color-AA, #404040))));--comp-control-width:var(--comp-checkbox-size);--comp-checkbox-error-color:var(--tct-stoplight-error, var(--const-stoplight-alert, #d20a0a));display:grid;grid-template-areas:"svg label" "svg description";align-items:center;gap:var(--comp-checkbox-gap);grid-template-columns:var(--comp-control-width) calc(100% - var(--comp-control-width) - var(--comp-checkbox-default-column-gap))}:host([type=favorite]) .container{--comp-checkbox-favorite-stroke-color:var(--tct-checkbox-favorite-stroke-color, var(--t-checkbox-favorite-stroke-color, var(--t-a11y-gray-color-AA, #949494)));--comp-checkbox-favorite-fill-color:var(--tct-checkbox-favorite-fill-color, var(--t-checkbox-favorite-fill-color, #db7d24))}:host([hide-label]:not([hide-label=false])) .container{grid-template-areas:"svg";grid-template-columns:var(--comp-control-width)}:host([type=toggle]) .container{--comp-control-width:var(--comp-checkbox-toggle-width)}:host([alignment=right]) .container,:host([type=toggle]:not([alignment])) .container{grid-template-areas:"label svg" "description svg";grid-template-columns:calc(100% - var(--comp-control-width) - var(--comp-checkbox-default-column-gap)) var(--comp-control-width)}.label-control{align-items:center;display:flex}.label-text{grid-area:label;font-weight:var(--tct-checkbox-label-font-weight, var(--t-checkbox-label-font-weight, 400))}:host([description]) .label-text{font-weight:var(--tct-checkbox-label-font-weight, var(--t-checkbox-label-font-weight, 600))}:host([checked]:not([checked=false])) .label-text{font-weight:var(--tct-checkbox-checked-label-font-weight, var(--t-checkbox-checked-label-font-weight, 600))}:host(:hover) .label-text{font-weight:var(--tct-checkbox-hover-label-font-weight, var(--tct-checkbox-label-font-weight, var(--t-checkbox-label-font-weight, 400)))}:host(:focus-within) .label-text{font-weight:var(--tct-checkbox-focused-label-font-weight, var(--tct-checkbox-label-font-weight, var(--t-checkbox-label-font-weight, 400)))}:host([description]:hover) .label-text{font-weight:var(--tct-checkbox-hover-label-font-weight, var(--tct-checkbox-label-font-weight, var(--t-checkbox-label-font-weight, 600)))}:host([checked]:not([checked=false]):hover) .label-text{font-weight:var(--tct-checkbox-checked-hover-label-font-weight, var(--tct-checkbox-checked-label-font-weight, var(--t-checkbox-checked-label-font-weight, 600)))}:host([description]:focus-within) .label-text{font-weight:var(--tct-checkbox-focused-label-font-weight, var(--tct-checkbox-label-font-weight, var(--t-checkbox-label-font-weight, 600)))}:host([checked]:not([checked=false]):focus-within) .label-text{font-weight:var(--tct-checkbox-checked-focused-label-font-weight, var(--tct-checkbox-checked-label-font-weight, var(--t-checkbox-checked-label-font-weight, 600)))}.description-text{grid-area:description;font-weight:var(--tct-checkbox-description-font-weight, var(--t-checkbox-description-font-weight, 400))}:host(:hover) .description-text{font-weight:var(--tct-checkbox-hover-description-font-weight, var(--tct-checkbox-description-font-weight, var(--t-checkbox-description-font-weight, 400)))}label{color:var(--tct-checkbox-label-color);cursor:pointer;hyphens:var(--tct-checkbox-label-hyphens, auto);word-break:var(--tct-checkbox-label-word-break, break-word);word-wrap:var(--tct-checkbox-label-word-wrap, break-word)}:host([disabled]:not([disabled=false])),:host([group-disabled]){opacity:var(--tct-checkbox-disabled-opacity, var(--t-checkbox-disabled-opacity, var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4))))}:host([disabled]:not([disabled=false])) label,:host([group-disabled]) label{cursor:not-allowed}.checkbox-icon{width:var(--comp-checkbox-size);height:var(--comp-checkbox-size);border-radius:var(--tct-checkbox-outer-border-radius, var(--t-checkbox-outer-border-radius, var(--tct-border-radius-1, var(--app-border-radius-1, 4px))));stroke:var(--comp-checkbox-outer-stroke-color);fill:var(--comp-checkbox-outer-fill-color);stroke-width:var(--tct-checkbox-outer-stroke-width, var(--t-checkbox-outer-stroke-width, 2));flex-shrink:0}:host([checked]:not([checked=false]):not([type=favorite])) .checkbox-icon{stroke:var(--tct-checkbox-checked-outer-stroke-color, var(--t-checkbox-checked-outer-stroke-color, var(--comp-checkbox-outer-stroke-color)));fill:var(--tct-checkbox-checked-outer-fill-color, var(--t-checkbox-checked-outer-fill-color, var(--comp-checkbox-outer-fill-color)))}:host([has-error]:not([type=favorite])) .checkbox-icon{stroke:var(--tct-checkbox-error-outer-stroke-color, var(--comp-checkbox-error-color));fill:var(--tct-checkbox-error-outer-fill-color, var(--comp-checkbox-outer-fill-color));box-shadow:var(--tct-checkbox-error-box-shadow)}:host(:hover:not([type=favorite])) .checkbox-icon{stroke:var(--tct-checkbox-hover-outer-stroke-color, var(--comp-checkbox-outer-stroke-color));fill:var(--tct-checkbox-hover-outer-fill-color, var(--comp-checkbox-outer-fill-color));box-shadow:var(--tct-checkbox-hover-box-shadow)}:host(:hover[has-error]:not([type=favorite])) .checkbox-icon{stroke:var(--tct-checkbox-error-hover-outer-stroke-color, var(--tct-checkbox-error-outer-stroke-color, var(--comp-checkbox-error-color)));fill:var(--tct-checkbox-error-hover-outer-fill-color, var(--tct-checkbox-error-outer-fill-color, var(--comp-checkbox-outer-fill-color)));box-shadow:var(--tct-checkbox-error-hover-box-shadow, var(--tct-checkbox-error-box-shadow, var(--tct-checkbox-hover-box-shadow)))}:host(:focus-within:not([type=favorite])) .checkbox-icon{--comp-checkbox-focused-box-shadow:var(--const-double-focus-ring), var(--tct-global-focus, 0 0 0 2px #33b4ff);stroke:var(--tct-checkbox-focused-outer-stroke-color, var(--t-checkbox-focused-outer-stroke-color, var(--comp-checkbox-checked-color)));fill:var(--tct-checkbox-focused-outer-fill-color, var(--comp-checkbox-outer-fill-color));box-shadow:var(--comp-checkbox-focused-box-shadow)}:host(:focus-within[has-error]:not([type=favorite])) .checkbox-icon{stroke:var(--tct-checkbox-error-focused-outer-stroke-color, var(--tct-checkbox-error-outer-stroke-color, var(--comp-checkbox-error-color)));fill:var(--tct-checkbox-error-focused-outer-fill-color, var(--tct-checkbox-error-outer-fill-color, var(--comp-checkbox-outer-fill-color)));box-shadow:var(--tct-checkbox-error-focused-box-shadow, var(--tct-checkbox-error-box-shadow, var(--comp-checkbox-focused-box-shadow)))}:host([type=favorite]) .checkbox-icon{--tct-icon-stroke-width:var(--tct-checkbox-favorite-stroke-width, var(--t-checkbox-favorite-stroke-width, 1));--tct-icon-stroke-primary:var(--comp-checkbox-favorite-stroke-color);transition:fill var(--comp-checkbox-tween), color var(--comp-checkbox-tween), stroke var(--comp-checkbox-tween)}:host(:hover[type=favorite]) .checkbox-icon{--tct-icon-stroke-primary:var(--tct-checkbox-favorite-hover-stroke-color, var(--comp-checkbox-favorite-fill-color));--tct-icon-stroke-width:var(--tct-checkbox-favorite-hover-stroke-width, var(--t-checkbox-favorite-hover-stroke-width, 2))}:host([type=favorite]:focus-within) .checkbox-icon{--tct-icon-stroke-primary:var(--tct-checkbox-favorite-focused-stroke-color, var(--comp-checkbox-favorite-fill-color));--tct-icon-stroke-width:var(--tct-checkbox-favorite-hover-stroke-width, var(--t-checkbox-favorite-hover-stroke-width, 2))}:host([checked]:not([checked=false])[type=favorite]) .checkbox-icon{--tct-icon-stroke-primary:var(--tct-checkbox-favorite-checked-stroke-color, var(--tct-checkbox-favorite-stroke-color, var(--comp-checkbox-favorite-fill-color)));fill:var(--tct-checkbox-favorite-checked-fill-color, var(--comp-checkbox-favorite-fill-color));transition:fill var(--comp-checkbox-tween), color var(--comp-checkbox-tween), stroke var(--comp-checkbox-tween)}:host([checked]:not([checked=false])[type=favorite]:hover) .checkbox-icon{--tct-icon-stroke-primary:var(--tct-checkbox-favorite-checked-hover-stroke-color, var(--tct-checkbox-favorite-hover-stroke-color, var(--comp-checkbox-favorite-stroke-color)));--tct-icon-fill-primary:var(--tct-checkbox-favorite-checked-fill-color, var(--comp-checkbox-favorite-fill-color));--tct-icon-stroke-width:var(--tct-checkbox-favorite-hover-stroke-width, var(--t-checkbox-favorite-hover-stroke-width, 2))}:host([checked]:not([checked=false])[type=favorite]:focus-within) .checkbox-icon{--tct-icon-stroke-primary:var(--tct-checkbox-favorite-checked-focused-stroke-color, var(--tct-checkbox-favorite-focused-stroke-color, var(--comp-checkbox-favorite-stroke-color)));--tct-icon-stroke-width:var(--tct-checkbox-favorite-hover-stroke-width, var(--t-checkbox-favorite-hover-stroke-width, 2))}:host([has-error][type=favorite]) .checkbox-icon{--tct-icon-stroke-primary:var(--tct-checkbox-favorite-error-stroke-color, var(--comp-checkbox-error-color))}:host([has-error][type=favorite][checked]:not([checked=false])) .checkbox-icon{--tct-icon-stroke-primary:var(--tct-checkbox-favorite-error-stroke-color, var(--comp-checkbox-error-color))}.checkbox-fill{stroke:var(--tct-checkbox-checkmark-stroke-color, var(--comp-checkbox-checked-color))}.checked-fill{stroke-width:var(--tct-checkbox-check-stroke-width, var(--t-checkbox-check-stroke-width, 2.5));stroke-linecap:round;stroke-linejoin:round}:host([type=toggle]) .checked-fill{stroke:var(--tct-checkbox-toggle-icon-stroke, var(--t-checkbox-toggle-icon-stroke, var(--tct-white, var(--app-white, #ffffff))));transition:opacity var(--comp-checkbox-tween)}:host([type=toggle][checked]:not([checked=false])) .checked-fill{stroke:var(--tct-checkbox-toggle-checked-icon-stroke, var(--t-checkbox-toggle-checked-icon-stroke, var(--t-checkbox-text, var(--tct-white, var(--app-white, #ffffff)))))}.indeterminate-fill{stroke-width:var(--tct-checkbox-indeterminate-stroke-width, var(--t-checkbox-indeterminate-stroke-width, 3.5))}.toggle-svg{height:30px;width:var(--comp-checkbox-toggle-width);position:relative;text-align:initial}.toggle-track,.toggle-indicator{position:absolute;top:50%;transform:translateY(-50%)}.toggle-track{fill:var(--tct-checkbox-toggle-track-color, var(--t-checkbox-toggle-track-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))));height:14px;width:46px}:host([checked]:not([checked=false])) .toggle-track{fill:var(--tct-checkbox-toggle-checked-color, var(--t-checkbox-toggle-checked-color, var(--comp-checkbox-checked-color)));opacity:0.5}:host([has-error]) .toggle-track{fill:var(--tct-checkbox-toggle-error-color, var(--tct-stoplight-error, var(--const-stoplight-alert, #d20a0a)));opacity:0.5}.toggle-indicator{transition:left var(--comp-checkbox-tween);height:30px;width:30px;left:0;border-radius:50%}:host([checked]:not([checked=false])) .toggle-indicator{left:21px}.toggle-circle{fill:var(--tct-checkbox-toggle-circle-color, var(--t-checkbox-toggle-circle-color, var(--t-a11y-gray-color-AA, #949494)))}:host([checked]:not([checked=false])) .toggle-circle{fill:var(--tct-checkbox-toggle-checked-color, var(--t-checkbox-toggle-checked-color, var(--comp-checkbox-checked-color)))}:host(:is(:not([checked]),[checked=false]):focus-within) .toggle-circle,:host(:is(:not([checked]),[checked=false]):hover) .toggle-circle{fill:var(--tct-checkbox-toggle-checked-color, var(--t-checkbox-toggle-checked-color, var(--comp-checkbox-checked-color)))}:host([has-error]) .toggle-circle,:host([has-error]:focus-within) .toggle-circle,:host([has-error]:hover) .toggle-circle{fill:var(--tct-checkbox-toggle-error-color, var(--tct-stoplight-error, var(--const-stoplight-alert, #d20a0a)))}.toggle-hover-circle{stroke-width:0}:host(:focus-within) .toggle-hover-circle,:host(:hover) .toggle-hover-circle{stroke:var(--tct-checkbox-toggle-checked-color, var(--t-checkbox-toggle-checked-color, var(--comp-checkbox-checked-color)));stroke-width:10px;stroke-opacity:0.5}:host(:is(:not([checked]),[checked=false]):focus-within) .toggle-hover-circle,:host(:is(:not([checked]),[checked=false]):hover) .toggle-hover-circle{stroke:var(--tct-checkbox-toggle-circle-color, var(--t-checkbox-toggle-circle-color, var(--t-a11y-gray-color-AA, #949494)))}:host([has-error]) .toggle-hover-circle,:host([has-error]:focus-within) .toggle-hover-circle,:host([has-error]:hover) .toggle-hover-circle{stroke:var(--tct-checkbox-toggle-error-color, var(--tct-stoplight-error, var(--const-stoplight-alert, #d20a0a)))}:host([checked]:not([checked=false])) .off,:host(:is(:not([checked]),[checked=false])) .on{opacity:0}';
 

package/dist/q2-tecton-elements/q2-data-table.entry.js

@@ -1,6 +1,6 @@
 import { r as t, c as e, h as a, F as o, g as r } from "./index-7a5365e2.js";
 
-import { m as l, l as n } from "./index-d18e2a20.js";
+import { m as l, l as n } from "./index-504f1a9e.js";
 
 const c = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}.container{--comp-cell-padding:var(--tct-data-table-cell-padding, var(--tct-table-cell-padding, var(--app-scale-3x, 15px)));--comp-select-column-width:var(--tct-data-table-select-column-width, var(--tct-table-select-column-width, var(--tct-checkbox-size, 20px)));--comp-dropdown-column-width:var(--tct-data-table-dropdown-column-width, var(--tct-table-dropdown-column-width, var(--tct-btn-icon-width, 44px)));--comp-expandable-row-control-column-width:var(--tct-data-table-expandable-row-control-column-width, var(--tct-table-expandable-row-control-column-width, var(--tct-btn-icon-width, 44px)));overflow:auto;--comp-scrollbar-size:var(--tct-scrollbar-size, var(--t-scrollbar-size, var(--app-scale-1x, 5px)));--comp-scrollbar-border-radius:var(--tct-scrollbar-border-radius, var(--t-scrollbar-border-radius, var(--app-border-radius-1, 4px)));--comp-scrollbar-color:var(--tct-scrollbar-color, var(--t-scrollbar-color, var(--t-a11y-gray-color, #747474)));scrollbar-width:thin;scrollbar-color:var(--comp-scrollbar-color) transparent}.container::-webkit-scrollbar{width:var(--comp-scrollbar-size);height:var(--comp-scrollbar-size);margin:5px}.container::-webkit-scrollbar-thumb{background:var(--comp-scrollbar-color);border-radius:var(--comp-scrollbar-border-radius)}.container::-webkit-scrollbar-track{background:transparent;border-radius:var(--comp-scrollbar-border-radius)}:host([shadowed]:not([shadowed=false])) .container{box-shadow:var(--tct-data-table-shadow, var(--tct-table-shadow, var(--app-shadow-1, 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14))))}:host([density=compact]) .container{--comp-cell-padding:var(--tct-data-table-cell-padding-compact, var(--tct-table-cell-padding-compact, var(--app-scale-1x, 5px)))}:host([density=comfortable]) .container{--comp-cell-padding:var(--tct-data-table-cell-padding-comfortable, var(--tct-table-cell-padding-comfortable, var(--app-scale-5x, 25px)))}table{table-layout:var(--tct-data-table-layout, var(--tct-table-layout, auto));border-collapse:collapse;border-spacing:0;width:var(--tct-data-table-width, var(--tct-table-width));min-width:100%;background:var(--tct-data-table-background, var(--tct-table-background, var(--t-base, #ffffff)));caption-side:var(--tct-data-table-caption-side, var(--tct-table-caption-side, bottom))}thead{border-width:var(--tct-data-table-header-border-width, var(--tct-table-header-border-width, 0 0 2px 0));border-style:var(--tct-data-table-header-border-style, var(--tct-table-header-border-style, solid));border-color:var(--tct-data-table-header-border-color, var(--tct-table-header-border-color, var(--t-gray-9, #999999)));background:var(--tct-data-table-header-background, var(--tct-table-header-background))}col.select-column{width:var(--comp-select-column-width)}col.expandable-row-control-column{width:var(--comp-expandable-row-control-column-width)}col.dropdown-column{width:var(--comp-dropdown-column-width)}:host(:is([bordered=vertical],[bordered=grid])) col{border-width:var(--tct-data-table-column-border-width, 0 1px 0 0);border-style:var(--tct-data-table-column-border-style, solid);border-color:var(--tct-data-table-column-border-color, var(--t-gray-9, #999999))}:host(:is([bordered=vertical],[bordered=grid])) col:last-child{border:none}td,th{padding:var(--comp-cell-padding);text-align:start;vertical-align:middle}td.align-end,th.align-end{text-align:end}td.align-center,th.align-center{text-align:center}td.vertical-align-top,th.vertical-align-top{vertical-align:top}td.vertical-align-bottom,th.vertical-align-bottom{vertical-align:bottom}th .header-content{font-weight:var(--tct-data-table-header-font-weight, var(--tct-table-header-font-weight, 600));font-size:var(--tct-data-table-header-font-size, var(--app-font-size, 14px))}th.sorted .header-content{font-weight:var(--tct-data-table-header-sorted-font-weight, var(--tct-table-header-sorted-font-weight, 600))}th .sorted-indicator{--comp-header-sortable-icon-size:var(--tct-data-table-header-sortable-icon-size, var(--tct-table-header-sortable-icon-size, var(--app-scale-3x, 15px)));--tct-icon-stroke-width:2;width:var(--comp-header-sortable-icon-size);height:var(--comp-header-sortable-icon-size)}th .sorted-indicator.direction-ASC{transform:rotate(180deg)}th q2-btn .header-content{display:flex;align-items:center;gap:var(--tct-data-table-header-content-gap, var(--tct-table-header-content-gap, var(--app-scale-2x, 10px)))}tr.expandable,tr.clickable{cursor:pointer}tr.expandable:focus,tr.clickable:focus{outline:none;box-shadow:none}tr.striped:nth-child(even){background:var(--tct-data-table-row-even-background, var(--t-gray-14, #f2f2f2))}tr.striped:nth-child(odd){background:var(--tct-data-table-row-odd-background, transparent)}tr.expandable:hover{background:var(--tct-data-table-expandable-row-hover-background, var(--tct-table-expandable-row-hover-background, var(--t-gray-14, #f2f2f2)))}tr.clickable:hover{background:var(--tct-data-table-clickable-row-hover-background, var(--tct-table-clickable-row-hover-background, var(--t-gray-14, #f2f2f2)))}tr.selected{background:var(--tct-data-table-selected-row-background, var(--tct-table-selected-row-background, var(--t-gray-14, #f2f2f2)))}tr.expanded{background:var(--tct-data-table-expanded-row-background, var(--tct-table-expanded-row-background, var(--t-gray-14, #f2f2f2)))}tr.expanded .toggle-expandable-row{transform:rotate(180deg)}:host(:is([bordered],[bordered=horizontal],[bordered=grid]):not([bordered=vertical],[bordered=false])) tbody tr{border-width:var(--tct-data-table-row-border-width, var(--tct-table-row-border-width, 0 0 1px 0));border-style:var(--tct-data-table-row-border-style, var(--tct-table-row-border-style, solid));border-color:var(--tct-data-table-row-border-color, var(--tct-table-row-border-color, var(--t-gray-9, #999999)))}tr.loading-row{background:var(--tct-data-table-loading-row-background, var(--tct-table-loading-row-background, var(--t-base, #ffffff)))}tr.loading-row td{text-align:center}tr.loading-row q2-loading{font-size:4em}tr.empty-state{background:var(--tct-data-table-loading-row-background, var(--t-base, #ffffff))}tr.empty-state td{text-align:center}tr.empty-state .empty-state-content{display:flex;flex-direction:column;align-items:center;padding-top:var(--app-scale-10x, 50px);padding-bottom:var(--app-scale-10x, 50px);gap:var(--app-scale-4x, 20px);--tct-icon-size:var(--app-scale-6x, 30px)}tr.expandable-row{background:var(--tct-data-table-expanded-row-background, var(--tct-table-expanded-row-background, var(--t-gray-14, #f2f2f2)))}td.clamped div{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:var(--comp-line-clamp-count, 1);-webkit-box-orient:vertical}td.expandable-row-control-column{--tct-btn-icon-hover-bg:transparent;padding:var(--tct-data-table-expandable-row-control-column-padding, var(--tct-table-expandable-row-control-column-padding, 0 5px));text-align:center}td.dropdown-column{padding:var(--tct-data-table-dropdown-column-padding, var(--tct-table-dropdown-column-padding, 0 5px));text-align:center}td.click-column:not(.sr){padding:var(--tct-data-table-clickable-column-padding, var(--tct-table-clickable-column-padding, 0 5px));text-align:center}caption{padding:var(--tct-data-table-caption-padding, var(--tct-table-caption-padding, var(--app-scale-2x, 10px)));font-size:var(--tct-data-table-caption-font-size, var(--tct-table-caption-font-size, inherit));font-weight:var(--tct-data-table-caption-font-weight, var(--tct-table-caption-font-weight, 600));text-align:var(--tct-data-table-caption-text-align, var(--tct-table-caption-text-align, center));color:var(--tct-data-table-caption-color, var(--tct-table-caption-color, inherit))}q2-checkbox{padding:0}";
 

package/dist/q2-tecton-elements/q2-detail.entry.js

@@ -1,6 +1,6 @@
 import { r as e, h as t, g as i } from "./index-7a5365e2.js";
 
-import { e as l, l as s } from "./index-d18e2a20.js";
+import { e as l, l as s } from "./index-504f1a9e.js";
 
 const a = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}::slotted([slot]){display:flex;align-items:center;--tct-icon-size:var(--tct-detail-label-icon-size, 16px)}.detail{column-gap:var(--tct-detail-gap-column, var(--app-scale-1x, 5px));row-gap:var(--tct-detail-gap-row, 0px)}.detail-block{display:flex;width:100%}.detail-inline{display:flex}.detail-horizontal{align-items:var(--tct-detail-vertical-alignment, baseline);flex-direction:row}.detail-stacked{flex-direction:column}.detail-stacked-alignment-left{align-items:flex-start}.detail-stacked-alignment-right{align-items:flex-end}.label{flex:1;text-align:left;line-height:1.5;color:var(--tct-detail-label-font-color, #141430)}.label-size-xsmall{color:var(--tct-detail-label-xsmall-font-color, #6f6f82);font-size:var(--tct-detail-label-xsmall-font-size, 14px)}.label-size-small{color:var(--tct-detail-label-small-font-color);font-size:var(--tct-detail-label-small-font-size, 14px)}.label-size-medium{color:var(--tct-detail-label-medium-font-color);font-size:var(--tct-detail-label-medium-font-size, 14px)}.label-size-large{color:var(--tct-detail-label-large-font-color);font-size:var(--tct-detail-label-large-font-size, 16px)}.label-size-xlarge{color:var(--tct-detail-label-xlarge-font-color);font-size:var(--tct-detail-label-xlarge-font-size, 18px)}.label-size-inline{font-size:var(--tct-detail-label-inline-font-size, 1em);color:inherit}.description{flex:1;display:flex;align-items:center;line-height:1.5;color:var(--tct-detail-description-font-color, #141430);column-gap:var(--tct-detail-description-gap-column, var(--app-scale-1x, 5px))}.description-alignment-right{justify-content:flex-end}.description-size-xsmall{color:var(--tct-detail-description-xsmall-font-color, #6f6f82);font-size:var(--tct-detail-description-xsmall-font-size, 14px)}.description-size-small{color:var(--tct-detail-description-small-font-color);font-size:var(--tct-detail-description-small-font-size, 14px)}.description-size-medium{color:var(--tct-detail-description-medium-font-color);font-size:var(--tct-detail-description-medium-font-size, 24px)}.description-size-large{color:var(--tct-detail-description-large-font-color);font-size:var(--tct-detail-description-large-font-size, 28px)}.description-size-xlarge{color:var(--tct-detail-description-xlarge-font-color);font-size:var(--tct-detail-description-xlarge-font-size, 32px)}.description-size-inline{font-size:var(--tct-detail-description-inline-font-size, 1em);color:inherit}";
 

package/dist/q2-tecton-elements/q2-dropdown-item.entry.js

@@ -1,28 +1,26 @@
-import { r as t, h as o, g as e } from "./index-7a5365e2.js";
+import { r as t, c as o, h as e, g as r } from "./index-7a5365e2.js";
 
-import { l as r, a as i } from "./index-d18e2a20.js";
+import { l as i, a as d, o as n } from "./index-504f1a9e.js";
 
-const d = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}.dropdown-separator{--comp-default-separator-margin:0 var(--tct-scale-1, var(--app-scale-3x, 15px));margin:var(--tct-dropdown-separator-margin, var(--t-dropdown-separator-margin, var(--comp-default-separator-margin)));border-bottom:1px solid var(--tct-dropdown-item-separator-color, var(--t-dropdown-item-separator-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))))}.dropdown-item-wrapper{display:flex}.dropdown-item-button{--comp-dropdown-item-tween:var(--tct-tween-1, var(--app-tween-1, cubic-bezier(0.4, 0, 0.2, 1)));margin:var(--tct-scale-0, var(--app-scale-0x, 0));padding:var(--tct-scale-0, var(--app-scale-0x, 0));min-height:44px;min-width:44px;border:none;background:transparent;outline:0;transition:var(--tct-dropdown-item-tween, var(--comp-dropdown-item-tween));transition-property:background, color, box-shadow, fill, border-color, border-width}.dropdown-item-button:disabled{opacity:var(--tct-dropdown-item-disabled-opacity, var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4)));cursor:not-allowed}.dropdown-item{--comp-default-dropdown-item-padding:var(--app-scale-2x, 10px) var(--app-scale-3x, 15px);flex:1;text-align:left;padding:var(--tct-dropdown-item-padding, var(--t-dropdown-item-padding, var(--comp-default-dropdown-item-padding)));background:var(--tct-dropdown-item-background, var(--tct-dropdown-item-bg, var(--t-dropdown-item-bg, var(--tct-white, var(--t-base, var(--app-white, #ffffff))))));color:var(--tct-dropdown-item-font-color, var(--t-dropdown-item-font-color, inherit));overflow:hidden;text-overflow:ellipsis}:host(:not([disabled])) .remove-dropdown-item:hover,:host(:not([disabled])) .remove-dropdown-item:focus,:host(:not([disabled])) .dropdown-item:hover,:host(:not([disabled])) .dropdown-item:focus{background:var(--tct-dropdown-item-hover-background, var(--tct-dropdown-item-selected-bg, var(--t-dropdown-item-selected-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, var(--t-base, #f2f2f2))))))))}:host(:not([disabled])) .dropdown-item:hover,:host(:not([disabled])) .dropdown-item:focus{color:var(--tct-dropdown-item-hover-color, var(--tct-dropdown-item-selected-font-color, var(--t-dropdown-item-selected-font-color, inherit)))}:host(:not([disabled])) .dropdown-item:focus,:host(:not([disabled])) .remove-dropdown-item:focus{box-shadow:var(--tct-dropdown-item-focus-box-shadow, var(--const-inset-double-focus-ring, inset 0 0 0 2px var(--t-base), inset 0 0 0 4px var(--const-focus-color), inset 0 0 0 6px var(--t-base)))}.remove-dropdown-item{flex:0 0 44px}";
+const a = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}.dropdown-separator{--comp-default-separator-margin:0 var(--tct-scale-1, var(--app-scale-3x, 15px));margin:var(--tct-dropdown-separator-margin, var(--t-dropdown-separator-margin, var(--comp-default-separator-margin)));border-bottom:1px solid var(--tct-dropdown-item-separator-color, var(--t-dropdown-item-separator-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))))}.dropdown-item-wrapper{display:flex}.dropdown-item-button{--comp-dropdown-item-tween:var(--tct-tween-1, var(--app-tween-1, cubic-bezier(0.4, 0, 0.2, 1)));margin:var(--tct-scale-0, var(--app-scale-0x, 0));padding:var(--tct-scale-0, var(--app-scale-0x, 0));min-height:var(--tct-dropdown-item-min-height, 44px);min-width:44px;border:none;background:transparent;outline:0;transition:var(--tct-dropdown-item-tween, var(--comp-dropdown-item-tween));transition-property:background, color, box-shadow, fill, border-color, border-width}.dropdown-item-button:disabled{opacity:var(--tct-dropdown-item-disabled-opacity, var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4)));cursor:not-allowed}.dropdown-item{--comp-default-dropdown-item-padding:var(--app-scale-2x, 10px) var(--app-scale-3x, 15px);flex:1;text-align:left;padding:var(--tct-dropdown-item-padding, var(--t-dropdown-item-padding, var(--comp-default-dropdown-item-padding)));background:var(--tct-dropdown-item-background, var(--tct-dropdown-item-bg, var(--t-dropdown-item-bg, var(--tct-white, var(--t-base, var(--app-white, #ffffff))))));color:var(--tct-dropdown-item-font-color, var(--t-dropdown-item-font-color, inherit));overflow:hidden;text-overflow:ellipsis}:host(:not([disabled])) .remove-dropdown-item:hover,:host(:not([disabled])) .remove-dropdown-item:focus,:host(:not([disabled])) .dropdown-item:hover,:host(:not([disabled])) .dropdown-item:focus{background:var(--tct-dropdown-item-hover-background, var(--tct-dropdown-item-selected-bg, var(--t-dropdown-item-selected-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, var(--t-base, #f2f2f2))))))))}:host(:not([disabled])) .dropdown-item:hover,:host(:not([disabled])) .dropdown-item:focus{color:var(--tct-dropdown-item-hover-color, var(--tct-dropdown-item-selected-font-color, var(--t-dropdown-item-selected-font-color, inherit)))}:host(:not([disabled])) .dropdown-item:focus,:host(:not([disabled])) .remove-dropdown-item:focus{box-shadow:var(--tct-dropdown-item-focus-box-shadow, var(--const-inset-double-focus-ring, inset 0 0 0 2px var(--t-base), inset 0 0 0 4px var(--const-focus-color), inset 0 0 0 6px var(--t-base)))}.remove-dropdown-item{flex:0 0 44px}";
 
-const n = d;
+const s = a;
 
-const a = class {
-  constructor(o) {
-    t(this, o);
+const p = class {
+  constructor(e) {
+    t(this, e);
+    this.click = o(this, "click", 7);
     this.handleQ2LocValue = () => {
       const t = this.hostElement.querySelector("q2-loc");
       if (!t) return "";
-      return t.value ? r(t.value, t.substitutions) : r(t.innerText, t.substitutions);
+      return t.value ? i(t.value, t.substitutions) : i(t.innerText, t.substitutions);
     };
     this.onItemClick = t => {
       t.stopImmediatePropagation();
-      this.hostElement.dispatchEvent(new CustomEvent("click", {
-        detail: {
-          type: "select",
-          value: this.value || ""
-        },
-        bubbles: true
-      }));
+      this.click.emit({
+        type: "select",
+        value: this.value || ""
+      });
     };
     this.onItemFocus = t => {
       t.stopPropagation();
@@ -32,13 +30,10 @@ const a = class {
     };
     this.onRemoveBtnClick = t => {
       t.stopImmediatePropagation();
-      this.hostElement.dispatchEvent(new CustomEvent("click", {
-        detail: {
-          type: "remove",
-          value: this.value || ""
-        },
-        bubbles: true
-      }));
+      this.click.emit({
+        type: "remove",
+        value: this.value || ""
+      });
     };
     this.onRemoveBtnFocus = t => {
       t.stopPropagation();
@@ -52,14 +47,19 @@ const a = class {
     this.label = undefined;
     this.removable = undefined;
     this.separator = undefined;
+    this.active = undefined;
     this.value = undefined;
   }
   // #endregion
   // #region Component Lifecycle Events
   componentWillLoad() {
-    i(this);
+    d(this);
     this.q2LocValue = this.handleQ2LocValue();
   }
+  componentDidLoad() {
+    if (this.separator) return;
+    n(this.hostElement);
+  }
   // #endregion
   // #region Listeners
   onHostElementFocus(t) {
@@ -70,7 +70,7 @@ const a = class {
   // #endregion
   // #region Watchers
   ariaLabelObserver() {
-    i(this);
+    d(this);
   }
   // #endregion
   // #region Local Methods
@@ -78,7 +78,7 @@ const a = class {
     return this.label || this.hostElement.textContent.trim() || this.q2LocValue;
   }
   get removeLabel() {
-    return r("tecton.element.dropdownItem.remove", [ this.innerLabel || "" ]);
+    return i("tecton.element.dropdownItem.remove", [ this.innerLabel || "" ]);
   }
   focusItem() {
     this.dropdownItemBtn.focus();
@@ -89,12 +89,12 @@ const a = class {
   // #endregion
   // #region Render Methods
   renderItemDOM() {
-    return o("div", {
+    return e("div", {
       class: "dropdown-item-wrapper",
       role: "presentation"
-    }, o("button", {
+    }, e("button", {
       ref: t => this.dropdownItemBtn = t,
-      "aria-label": r(this.innerLabel),
+      "aria-label": i(this.innerLabel),
       class: "dropdown-item-button dropdown-item",
       tabindex: "-1",
       disabled: this.disabled,
@@ -103,7 +103,7 @@ const a = class {
       onKeyDown: this.onItemKeydown,
       onFocus: this.onItemFocus,
       "test-id": "dropdownItem"
-    }, o("slot", null, r(this.innerLabel))), this.removable && o("button", {
+    }, e("slot", null, i(this.innerLabel))), this.removable && e("button", {
       ref: t => this.removeBtn = t,
       class: "dropdown-item-button remove-dropdown-item",
       tabindex: "-1",
@@ -113,12 +113,12 @@ const a = class {
       onKeyDown: this.onRemoveBtnKeydown,
       onFocus: this.onRemoveBtnFocus,
       "test-id": "removeDropdownItem"
-    }, o("q2-icon", {
+    }, e("q2-icon", {
       type: "close"
     })));
   }
   renderSeparatorDOM() {
-    return o("div", {
+    return e("div", {
       class: "dropdown-separator",
       role: "separator",
       "test-id": "dropdownItemSeparator"
@@ -131,7 +131,7 @@ const a = class {
     return this.renderItemDOM();
   }
   get hostElement() {
-    return e(this);
+    return r(this);
   }
   static get watchers() {
     return {
@@ -140,7 +140,7 @@ const a = class {
   }
 };
 
-a.style = n;
+p.style = s;
 
-export { a as q2_dropdown_item };
+export { p as q2_dropdown_item };
 //# sourceMappingURL=q2-dropdown-item.entry.js.map

package/dist/q2-tecton-elements/q2-dropdown-item.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["q2DropdownItemCss","Q2DropdownItemStyle0","Q2DropdownItem","this","handleQ2LocValue","locElement","hostElement","querySelector","value","loc","substitutions","innerText","onItemClick","event","stopImmediatePropagation","dispatchEvent","CustomEvent","detail","type","bubbles","onItemFocus","stopPropagation","onItemKeydown","key","focusRemoveBtn","onRemoveBtnClick","onRemoveBtnFocus","onRemoveBtnKeydown","focusItem","componentWillLoad","handleAriaLabel","q2LocValue","onHostElementFocus","target","ariaLabelObserver","innerLabel","label","textContent","trim","removeLabel","dropdownItemBtn","focus","removeBtn","renderItemDOM","h","class","role","ref","el","tabindex","disabled","onClick","onKeyDown","onFocus","removable","renderSeparatorDOM","render","separator"],"sources":["src/components/q2-dropdown-item/q2-dropdown-item.scss?tag=q2-dropdown-item&encapsulation=shadow","src/components/q2-dropdown-item/q2-dropdown-item.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n.dropdown-separator {\n    --comp-default-separator-margin: 0 #{var-list(--tct-scale-1, --app-scale-3x, 15px)};\n    margin: var-list(var-prefixer(dropdown-separator-margin), --comp-default-separator-margin);\n    border-bottom: 1px solid\n        var-list(\n            var-prefixer(dropdown-item-separator-color),\n            var-prefixer(gray-11),\n            --tct-gray-l1,\n            --app-gray-l1,\n            #cccccc\n        );\n}\n\n.dropdown-item-wrapper {\n    display: flex;\n}\n\n.dropdown-item-button {\n    --comp-dropdown-item-tween: #{var-list(--tct-tween-1, --app-tween-1, cubic-bezier(0.4, 0, 0.2, 1))};\n    margin: var-list(--tct-scale-0, --app-scale-0x, 0);\n    padding: var-list(--tct-scale-0, --app-scale-0x, 0);\n    min-height: 44px;\n    min-width: 44px;\n    border: none;\n    background: transparent;\n    outline: 0;\n    // box-shadow: none;\n    transition: var-list(--tct-dropdown-item-tween, --comp-dropdown-item-tween);\n    transition-property: background, color, box-shadow, fill, border-color, border-width;\n    &:disabled {\n        opacity: var-list(--tct-dropdown-item-disabled-opacity, --tct-disabled-opacity, --app-disabled-opacity, 0.4);\n        cursor: not-allowed;\n    }\n}\n\n.dropdown-item {\n    --comp-default-dropdown-item-padding: var(--app-scale-2x, 10px) var(--app-scale-3x, 15px);\n    flex: 1;\n    text-align: left;\n    padding: var-list(var-prefixer(dropdown-item-padding), --comp-default-dropdown-item-padding);\n    background: var-list(\n        --tct-dropdown-item-background,\n        var-prefixer(dropdown-item-bg),\n        --tct-white,\n        --t-base,\n        --app-white,\n        #ffffff\n    );\n    color: var-list(var-prefixer(dropdown-item-font-color), inherit);\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\n:host(:not([disabled])) {\n    .remove-dropdown-item:hover,\n    .remove-dropdown-item:focus,\n    .dropdown-item:hover,\n    .dropdown-item:focus {\n        background: var-list(\n            --tct-dropdown-item-hover-background,\n            var-prefixer(dropdown-item-selected-bg),\n            var-prefixer(gray-14),\n            --tct-gray-l3,\n            --app-gray-l3,\n            --t-base,\n            #f2f2f2\n        );\n    }\n\n    .dropdown-item:hover,\n    .dropdown-item:focus {\n        color: var-list(--tct-dropdown-item-hover-color, var-prefixer(dropdown-item-selected-font-color), inherit);\n    }\n\n    .dropdown-item:focus,\n    .remove-dropdown-item:focus {\n        box-shadow: var-list(\n            --tct-dropdown-item-focus-box-shadow,\n            --const-inset-double-focus-ring,\n            unquote(\n                'inset 0 0 0 2px var(--t-base), inset 0 0 0 4px var(--const-focus-color), inset 0 0 0 6px var(--t-base)'\n            )\n        );\n    }\n}\n\n.remove-dropdown-item {\n    flex: 0 0 44px;\n}\n","import { Component, ComponentInterface, Prop, State, Element, Listen, Watch, h } from '@stencil/core';\nimport { loc, handleAriaLabel } from 'src/utils';\nimport { JSX } from '../../components';\n\n@Component({ tag: 'q2-dropdown-item', shadow: true, styleUrl: 'q2-dropdown-item.scss' })\nexport class Q2DropdownItem implements ComponentInterface {\n    // #region Own Properties\n\n    dropdownItemBtn: HTMLButtonElement;\n    removeBtn: HTMLButtonElement;\n\n    // #endregion\n    // #region Host HTML Element\n\n    @Element()\n    hostElement: HTMLElement;\n\n    // #endregion\n    // #region State Properties\n\n    @State()\n    q2LocValue: string;\n\n    // #endregion\n    // #region Public Property API\n\n    /** @deprecated */\n    @Prop({ reflect: true, mutable: true })\n    ariaLabel: string;\n\n    /** Disables interaction with the item and blocks its click event. */\n    @Prop({ reflect: true })\n    disabled: boolean;\n\n    /**\n     * The text that appears within the dropdown item.\n     *\n     * @info\n     * This will be used as the `aria-label` for this item.\n     * @localizable\n     */\n    @Prop({ reflect: true, mutable: true })\n    label: string;\n\n    /**\n     * Renders an icon button in the item.\n     * Clicking on this button will change the `type` on the item's click event detail to \"remove\".\n     */\n    @Prop({ reflect: true })\n    removable: boolean;\n\n    /**\n     * Renders a line in the item instead of text.\n     * Click events from these items will not have details provided.\n     * A `separator` allows for quick visual grouping of items, so interactions should not be bound to these options.\n     */\n    @Prop({ reflect: true })\n    separator: boolean;\n\n    /** A static reference value for the item. This value is returned in the click event detail. */\n    @Prop({ reflect: true })\n    value: string;\n\n    // #endregion\n    // #region Component Lifecycle Events\n\n    componentWillLoad() {\n        handleAriaLabel(this);\n        this.q2LocValue = this.handleQ2LocValue();\n    }\n\n    // #endregion\n    // #region Listeners\n\n    @Listen('focus')\n    onHostElementFocus(event: FocusEvent) {\n        if (event.target === this.hostElement) {\n            this.focusItem();\n        }\n    }\n\n    // #endregion\n    // #region Watchers\n\n    @Watch('ariaLabel')\n    ariaLabelObserver() {\n        handleAriaLabel(this);\n    }\n\n    // #endregion\n    // #region Local Methods\n\n    get innerLabel(): string {\n        return this.label || this.hostElement.textContent.trim() || this.q2LocValue;\n    }\n\n    get removeLabel(): string {\n        return loc('tecton.element.dropdownItem.remove', [this.innerLabel || '']);\n    }\n\n    focusItem() {\n        this.dropdownItemBtn.focus();\n    }\n\n    focusRemoveBtn() {\n        this.removeBtn && this.removeBtn.focus();\n    }\n\n    handleQ2LocValue = (): string => {\n        const locElement = this.hostElement.querySelector('q2-loc');\n        if (!locElement) return '';\n\n        return locElement.value\n            ? loc(locElement.value, locElement.substitutions)\n            : loc(locElement.innerText, locElement.substitutions);\n    };\n\n    onItemClick = (event: MouseEvent) => {\n        event.stopImmediatePropagation();\n        this.hostElement.dispatchEvent(\n            new CustomEvent('click', {\n                detail: {\n                    type: 'select',\n                    value: this.value || '',\n                },\n                bubbles: true,\n            })\n        );\n    };\n\n    onItemFocus = (event: FocusEvent) => {\n        event.stopPropagation();\n    };\n\n    onItemKeydown = (event: KeyboardEvent) => {\n        if (event.key === 'ArrowRight') this.focusRemoveBtn();\n    };\n\n    onRemoveBtnClick = (event: MouseEvent) => {\n        event.stopImmediatePropagation();\n\n        this.hostElement.dispatchEvent(\n            new CustomEvent('click', {\n                detail: {\n                    type: 'remove',\n                    value: this.value || '',\n                },\n                bubbles: true,\n            })\n        );\n    };\n\n    onRemoveBtnFocus = (event: FocusEvent) => {\n        event.stopPropagation();\n    };\n\n    onRemoveBtnKeydown = (event: KeyboardEvent) => {\n        if (event.key === 'ArrowLeft') this.focusItem();\n    };\n\n    // #endregion\n    // #region Render Methods\n\n    renderItemDOM(): JSX.IntrinsicElements {\n        return (\n            <div\n                class=\"dropdown-item-wrapper\"\n                role=\"presentation\"\n            >\n                <button\n                    ref={el => (this.dropdownItemBtn = el)}\n                    aria-label={loc(this.innerLabel)}\n                    class=\"dropdown-item-button dropdown-item\"\n                    tabindex=\"-1\"\n                    disabled={this.disabled}\n                    role=\"menuitem\"\n                    onClick={this.onItemClick}\n                    onKeyDown={this.onItemKeydown}\n                    onFocus={this.onItemFocus}\n                    test-id=\"dropdownItem\"\n                >\n                    <slot>{loc(this.innerLabel)}</slot>\n                </button>\n                {this.removable && (\n                    <button\n                        ref={el => (this.removeBtn = el)}\n                        class=\"dropdown-item-button remove-dropdown-item\"\n                        tabindex=\"-1\"\n                        aria-label={this.removeLabel}\n                        disabled={this.disabled}\n                        onClick={this.onRemoveBtnClick}\n                        onKeyDown={this.onRemoveBtnKeydown}\n                        onFocus={this.onRemoveBtnFocus}\n                        test-id=\"removeDropdownItem\"\n                    >\n                        <q2-icon type=\"close\" />\n                    </button>\n                )}\n            </div>\n        );\n    }\n\n    renderSeparatorDOM(): JSX.IntrinsicElements {\n        return (\n            <div\n                class=\"dropdown-separator\"\n                role=\"separator\"\n                test-id=\"dropdownItemSeparator\"\n            />\n        );\n    }\n\n    render() {\n        if (this.separator) {\n            return this.renderSeparatorDOM();\n        }\n\n        return this.renderItemDOM();\n    }\n\n    // #endregion\n}\n"],"mappings":";;;;AAAA,MAAMA,IAAoB;;AAC1B,MAAAC,IAAeD;;MCIFE,IAAc;;;IAuGvBC,KAAAC,mBAAmB;MACf,MAAMC,IAAaF,KAAKG,YAAYC,cAAc;MAClD,KAAKF,GAAY,OAAO;MAExB,OAAOA,EAAWG,QACZC,EAAIJ,EAAWG,OAAOH,EAAWK,iBACjCD,EAAIJ,EAAWM,WAAWN,EAAWK;AAAc;IAG7DP,KAAAS,cAAeC;MACXA,EAAMC;MACNX,KAAKG,YAAYS,cACb,IAAIC,YAAY,SAAS;QACrBC,QAAQ;UACJC,MAAM;UACNV,OAAOL,KAAKK,SAAS;;QAEzBW,SAAS;;AAEhB;IAGLhB,KAAAiB,cAAeP;MACXA,EAAMQ;AAAiB;IAG3BlB,KAAAmB,gBAAiBT;MACb,IAAIA,EAAMU,QAAQ,cAAcpB,KAAKqB;AAAgB;IAGzDrB,KAAAsB,mBAAoBZ;MAChBA,EAAMC;MAENX,KAAKG,YAAYS,cACb,IAAIC,YAAY,SAAS;QACrBC,QAAQ;UACJC,MAAM;UACNV,OAAOL,KAAKK,SAAS;;QAEzBW,SAAS;;AAEhB;IAGLhB,KAAAuB,mBAAoBb;MAChBA,EAAMQ;AAAiB;IAG3BlB,KAAAwB,qBAAsBd;MAClB,IAAIA,EAAMU,QAAQ,aAAapB,KAAKyB;AAAW;;;;;;;;;;;EA3FnD,iBAAAC;IACIC,EAAgB3B;IAChBA,KAAK4B,aAAa5B,KAAKC;;;;EAO3B,kBAAA4B,CAAmBnB;IACf,IAAIA,EAAMoB,WAAW9B,KAAKG,aAAa;MACnCH,KAAKyB;;;;;EAQb,iBAAAM;IACIJ,EAAgB3B;;;;EAMpB,cAAIgC;IACA,OAAOhC,KAAKiC,SAASjC,KAAKG,YAAY+B,YAAYC,UAAUnC,KAAK4B;;EAGrE,eAAIQ;IACA,OAAO9B,EAAI,sCAAsC,EAACN,KAAKgC,cAAc;;EAGzE,SAAAP;IACIzB,KAAKqC,gBAAgBC;;EAGzB,cAAAjB;IACIrB,KAAKuC,aAAavC,KAAKuC,UAAUD;;;;EA0DrC,aAAAE;IACI,OACIC,EAAA;MACIC,OAAM;MACNC,MAAK;OAELF,EAAA;MACIG,KAAKC,KAAO7C,KAAKqC,kBAAkBQ;MAAG,cAC1BvC,EAAIN,KAAKgC;MACrBU,OAAM;MACNI,UAAS;MACTC,UAAU/C,KAAK+C;MACfJ,MAAK;MACLK,SAAShD,KAAKS;MACdwC,WAAWjD,KAAKmB;MAChB+B,SAASlD,KAAKiB;MAAW,WACjB;OAERwB,EAAA,cAAOnC,EAAIN,KAAKgC,eAEnBhC,KAAKmD,aACFV,EAAA;MACIG,KAAKC,KAAO7C,KAAKuC,YAAYM;MAC7BH,OAAM;MACNI,UAAS;MAAI,cACD9C,KAAKoC;MACjBW,UAAU/C,KAAK+C;MACfC,SAAShD,KAAKsB;MACd2B,WAAWjD,KAAKwB;MAChB0B,SAASlD,KAAKuB;MAAgB,WACtB;OAERkB,EAAA;MAAS1B,MAAK;;;EAOlC,kBAAAqC;IACI,OACIX,EAAA;MACIC,OAAM;MACNC,MAAK;MAAW,WACR;;;EAKpB,MAAAU;IACI,IAAIrD,KAAKsD,WAAW;MAChB,OAAOtD,KAAKoD;;IAGhB,OAAOpD,KAAKwC"}
+{"version":3,"names":["q2DropdownItemCss","Q2DropdownItemStyle0","Q2DropdownItem","this","handleQ2LocValue","locElement","hostElement","querySelector","value","loc","substitutions","innerText","onItemClick","event","stopImmediatePropagation","click","emit","type","onItemFocus","stopPropagation","onItemKeydown","key","focusRemoveBtn","onRemoveBtnClick","onRemoveBtnFocus","onRemoveBtnKeydown","focusItem","componentWillLoad","handleAriaLabel","q2LocValue","componentDidLoad","separator","overrideFocus","onHostElementFocus","target","ariaLabelObserver","innerLabel","label","textContent","trim","removeLabel","dropdownItemBtn","focus","removeBtn","renderItemDOM","h","class","role","ref","el","tabindex","disabled","onClick","onKeyDown","onFocus","removable","renderSeparatorDOM","render"],"sources":["src/components/q2-dropdown-item/q2-dropdown-item.scss?tag=q2-dropdown-item&encapsulation=shadow","src/components/q2-dropdown-item/q2-dropdown-item.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n.dropdown-separator {\n    --comp-default-separator-margin: 0 #{var-list(--tct-scale-1, --app-scale-3x, 15px)};\n    margin: var-list(var-prefixer(dropdown-separator-margin), --comp-default-separator-margin);\n    border-bottom: 1px solid\n        var-list(\n            var-prefixer(dropdown-item-separator-color),\n            var-prefixer(gray-11),\n            --tct-gray-l1,\n            --app-gray-l1,\n            #cccccc\n        );\n}\n\n.dropdown-item-wrapper {\n    display: flex;\n}\n\n.dropdown-item-button {\n    --comp-dropdown-item-tween: #{var-list(--tct-tween-1, --app-tween-1, cubic-bezier(0.4, 0, 0.2, 1))};\n    margin: var-list(--tct-scale-0, --app-scale-0x, 0);\n    padding: var-list(--tct-scale-0, --app-scale-0x, 0);\n    min-height: var(--tct-dropdown-item-min-height, 44px);\n    min-width: 44px;\n    border: none;\n    background: transparent;\n    outline: 0;\n    transition: var-list(--tct-dropdown-item-tween, --comp-dropdown-item-tween);\n    transition-property: background, color, box-shadow, fill, border-color, border-width;\n    &:disabled {\n        opacity: var-list(--tct-dropdown-item-disabled-opacity, --tct-disabled-opacity, --app-disabled-opacity, 0.4);\n        cursor: not-allowed;\n    }\n}\n\n.dropdown-item {\n    --comp-default-dropdown-item-padding: var(--app-scale-2x, 10px) var(--app-scale-3x, 15px);\n    flex: 1;\n    text-align: left;\n    padding: var-list(var-prefixer(dropdown-item-padding), --comp-default-dropdown-item-padding);\n    background: var-list(\n        --tct-dropdown-item-background,\n        var-prefixer(dropdown-item-bg),\n        --tct-white,\n        --t-base,\n        --app-white,\n        #ffffff\n    );\n    color: var-list(var-prefixer(dropdown-item-font-color), inherit);\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\n:host(:not([disabled])) {\n    .remove-dropdown-item:hover,\n    .remove-dropdown-item:focus,\n    .dropdown-item:hover,\n    .dropdown-item:focus {\n        background: var-list(\n            --tct-dropdown-item-hover-background,\n            var-prefixer(dropdown-item-selected-bg),\n            var-prefixer(gray-14),\n            --tct-gray-l3,\n            --app-gray-l3,\n            --t-base,\n            #f2f2f2\n        );\n    }\n\n    .dropdown-item:hover,\n    .dropdown-item:focus {\n        color: var-list(--tct-dropdown-item-hover-color, var-prefixer(dropdown-item-selected-font-color), inherit);\n    }\n\n    .dropdown-item:focus,\n    .remove-dropdown-item:focus {\n        box-shadow: var-list(\n            --tct-dropdown-item-focus-box-shadow,\n            --const-inset-double-focus-ring,\n            unquote(\n                'inset 0 0 0 2px var(--t-base), inset 0 0 0 4px var(--const-focus-color), inset 0 0 0 6px var(--t-base)'\n            )\n        );\n    }\n}\n\n.remove-dropdown-item {\n    flex: 0 0 44px;\n}\n","import {\n    Component,\n    ComponentInterface,\n    Prop,\n    State,\n    Element,\n    Event,\n    Listen,\n    Watch,\n    h,\n    EventEmitter,\n} from '@stencil/core';\nimport { loc, handleAriaLabel, overrideFocus } from 'src/utils';\nimport { JSX } from '../../components';\n\n@Component({ tag: 'q2-dropdown-item', shadow: true, styleUrl: 'q2-dropdown-item.scss' })\nexport class Q2DropdownItem implements ComponentInterface {\n    // #region Own Properties\n\n    dropdownItemBtn: HTMLButtonElement;\n    removeBtn: HTMLButtonElement;\n\n    // #endregion\n    // #region Host HTML Element\n\n    @Element()\n    hostElement: HTMLElement;\n\n    // #endregion\n    // #region State Properties\n\n    @State()\n    q2LocValue: string;\n\n    // #endregion\n    // #region Public Property API\n\n    /** @deprecated */\n    @Prop({ reflect: true, mutable: true })\n    ariaLabel: string;\n\n    /** Disables interaction with the item and blocks its click event. */\n    @Prop({ reflect: true })\n    disabled: boolean;\n\n    /**\n     * The text that appears within the dropdown item.\n     *\n     * @info\n     * This will be used as the `aria-label` for this item.\n     * @localizable\n     */\n    @Prop({ reflect: true, mutable: true })\n    label: string;\n\n    /**\n     * Renders an icon button in the item.\n     * Clicking on this button will change the `type` on the item's click event detail to \"remove\".\n     */\n    @Prop({ reflect: true })\n    removable: boolean;\n\n    /**\n     * Renders a line in the item instead of text.\n     * Click events from these items will not have details provided.\n     * A `separator` allows for quick visual grouping of items, so interactions should not be bound to these options.\n     */\n    @Prop({ reflect: true })\n    separator: boolean;\n\n    /**\n     * Used by q2-option-list to indicate the option is active\n     * @private\n     */\n    @Prop({ reflect: true })\n    active: boolean;\n\n    /** A static reference value for the item. This value is returned in the click event detail. */\n    @Prop({ reflect: true })\n    value: string;\n\n    // #endregion\n    // #region Events\n\n    /**\n     * Is emitted when the item is clicked.\n     */\n    @Event({ bubbles: true })\n    click: EventEmitter<{ type: 'select' | 'remove'; value: string }>;\n\n    // #endregion\n    // #region Component Lifecycle Events\n\n    componentWillLoad() {\n        handleAriaLabel(this);\n        this.q2LocValue = this.handleQ2LocValue();\n    }\n\n    componentDidLoad() {\n        if (this.separator) return;\n        overrideFocus(this.hostElement);\n    }\n\n    // #endregion\n    // #region Listeners\n\n    @Listen('focus')\n    onHostElementFocus(event: FocusEvent) {\n        if (event.target === this.hostElement) {\n            this.focusItem();\n        }\n    }\n\n    // #endregion\n    // #region Watchers\n\n    @Watch('ariaLabel')\n    ariaLabelObserver() {\n        handleAriaLabel(this);\n    }\n\n    // #endregion\n    // #region Local Methods\n\n    get innerLabel(): string {\n        return this.label || this.hostElement.textContent.trim() || this.q2LocValue;\n    }\n\n    get removeLabel(): string {\n        return loc('tecton.element.dropdownItem.remove', [this.innerLabel || '']);\n    }\n\n    focusItem() {\n        this.dropdownItemBtn.focus();\n    }\n\n    focusRemoveBtn() {\n        this.removeBtn && this.removeBtn.focus();\n    }\n\n    handleQ2LocValue = (): string => {\n        const locElement = this.hostElement.querySelector('q2-loc');\n        if (!locElement) return '';\n\n        return locElement.value\n            ? loc(locElement.value, locElement.substitutions)\n            : loc(locElement.innerText, locElement.substitutions);\n    };\n\n    onItemClick = (event: MouseEvent) => {\n        event.stopImmediatePropagation();\n        this.click.emit({\n            type: 'select',\n            value: this.value || '',\n        });\n    };\n\n    onItemFocus = (event: FocusEvent) => {\n        event.stopPropagation();\n    };\n\n    onItemKeydown = (event: KeyboardEvent) => {\n        if (event.key === 'ArrowRight') this.focusRemoveBtn();\n    };\n\n    onRemoveBtnClick = (event: MouseEvent) => {\n        event.stopImmediatePropagation();\n\n        this.click.emit({\n            type: 'remove',\n            value: this.value || '',\n        });\n    };\n\n    onRemoveBtnFocus = (event: FocusEvent) => {\n        event.stopPropagation();\n    };\n\n    onRemoveBtnKeydown = (event: KeyboardEvent) => {\n        if (event.key === 'ArrowLeft') this.focusItem();\n    };\n\n    // #endregion\n    // #region Render Methods\n\n    renderItemDOM(): JSX.IntrinsicElements {\n        return (\n            <div\n                class=\"dropdown-item-wrapper\"\n                role=\"presentation\"\n            >\n                <button\n                    ref={el => (this.dropdownItemBtn = el)}\n                    aria-label={loc(this.innerLabel)}\n                    class=\"dropdown-item-button dropdown-item\"\n                    tabindex=\"-1\"\n                    disabled={this.disabled}\n                    role=\"menuitem\"\n                    onClick={this.onItemClick}\n                    onKeyDown={this.onItemKeydown}\n                    onFocus={this.onItemFocus}\n                    test-id=\"dropdownItem\"\n                >\n                    <slot>{loc(this.innerLabel)}</slot>\n                </button>\n                {this.removable && (\n                    <button\n                        ref={el => (this.removeBtn = el)}\n                        class=\"dropdown-item-button remove-dropdown-item\"\n                        tabindex=\"-1\"\n                        aria-label={this.removeLabel}\n                        disabled={this.disabled}\n                        onClick={this.onRemoveBtnClick}\n                        onKeyDown={this.onRemoveBtnKeydown}\n                        onFocus={this.onRemoveBtnFocus}\n                        test-id=\"removeDropdownItem\"\n                    >\n                        <q2-icon type=\"close\" />\n                    </button>\n                )}\n            </div>\n        );\n    }\n\n    renderSeparatorDOM(): JSX.IntrinsicElements {\n        return (\n            <div\n                class=\"dropdown-separator\"\n                role=\"separator\"\n                test-id=\"dropdownItemSeparator\"\n            />\n        );\n    }\n\n    render() {\n        if (this.separator) {\n            return this.renderSeparatorDOM();\n        }\n\n        return this.renderItemDOM();\n    }\n\n    // #endregion\n}\n"],"mappings":";;;;AAAA,MAAMA,IAAoB;;AAC1B,MAAAC,IAAeD;;MCeFE,IAAc;;;;IA4HvBC,KAAAC,mBAAmB;MACf,MAAMC,IAAaF,KAAKG,YAAYC,cAAc;MAClD,KAAKF,GAAY,OAAO;MAExB,OAAOA,EAAWG,QACZC,EAAIJ,EAAWG,OAAOH,EAAWK,iBACjCD,EAAIJ,EAAWM,WAAWN,EAAWK;AAAc;IAG7DP,KAAAS,cAAeC;MACXA,EAAMC;MACNX,KAAKY,MAAMC,KAAK;QACZC,MAAM;QACNT,OAAOL,KAAKK,SAAS;;AACvB;IAGNL,KAAAe,cAAeL;MACXA,EAAMM;AAAiB;IAG3BhB,KAAAiB,gBAAiBP;MACb,IAAIA,EAAMQ,QAAQ,cAAclB,KAAKmB;AAAgB;IAGzDnB,KAAAoB,mBAAoBV;MAChBA,EAAMC;MAENX,KAAKY,MAAMC,KAAK;QACZC,MAAM;QACNT,OAAOL,KAAKK,SAAS;;AACvB;IAGNL,KAAAqB,mBAAoBX;MAChBA,EAAMM;AAAiB;IAG3BhB,KAAAsB,qBAAsBZ;MAClB,IAAIA,EAAMQ,QAAQ,aAAalB,KAAKuB;AAAW;;;;;;;;;;;;EAtFnD,iBAAAC;IACIC,EAAgBzB;IAChBA,KAAK0B,aAAa1B,KAAKC;;EAG3B,gBAAA0B;IACI,IAAI3B,KAAK4B,WAAW;IACpBC,EAAc7B,KAAKG;;;;EAOvB,kBAAA2B,CAAmBpB;IACf,IAAIA,EAAMqB,WAAW/B,KAAKG,aAAa;MACnCH,KAAKuB;;;;;EAQb,iBAAAS;IACIP,EAAgBzB;;;;EAMpB,cAAIiC;IACA,OAAOjC,KAAKkC,SAASlC,KAAKG,YAAYgC,YAAYC,UAAUpC,KAAK0B;;EAGrE,eAAIW;IACA,OAAO/B,EAAI,sCAAsC,EAACN,KAAKiC,cAAc;;EAGzE,SAAAV;IACIvB,KAAKsC,gBAAgBC;;EAGzB,cAAApB;IACInB,KAAKwC,aAAaxC,KAAKwC,UAAUD;;;;EAgDrC,aAAAE;IACI,OACIC,EAAA;MACIC,OAAM;MACNC,MAAK;OAELF,EAAA;MACIG,KAAKC,KAAO9C,KAAKsC,kBAAkBQ;MAAG,cAC1BxC,EAAIN,KAAKiC;MACrBU,OAAM;MACNI,UAAS;MACTC,UAAUhD,KAAKgD;MACfJ,MAAK;MACLK,SAASjD,KAAKS;MACdyC,WAAWlD,KAAKiB;MAChBkC,SAASnD,KAAKe;MAAW,WACjB;OAER2B,EAAA,cAAOpC,EAAIN,KAAKiC,eAEnBjC,KAAKoD,aACFV,EAAA;MACIG,KAAKC,KAAO9C,KAAKwC,YAAYM;MAC7BH,OAAM;MACNI,UAAS;MAAI,cACD/C,KAAKqC;MACjBW,UAAUhD,KAAKgD;MACfC,SAASjD,KAAKoB;MACd8B,WAAWlD,KAAKsB;MAChB6B,SAASnD,KAAKqB;MAAgB,WACtB;OAERqB,EAAA;MAAS5B,MAAK;;;EAOlC,kBAAAuC;IACI,OACIX,EAAA;MACIC,OAAM;MACNC,MAAK;MAAW,WACR;;;EAKpB,MAAAU;IACI,IAAItD,KAAK4B,WAAW;MAChB,OAAO5B,KAAKqD;;IAGhB,OAAOrD,KAAKyC"}