q2-tecton-elements 1.21.0 → 1.21.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/q2-stepper-vertical.cjs.entry.js +9 -2
- package/dist/collection/components/q2-stepper-vertical/index.js +8 -1
- package/dist/collection/components/q2-stepper-vertical/styles.css +4 -1
- package/dist/esm/q2-stepper-vertical.entry.js +9 -2
- package/dist/q2-tecton-elements/p-18cc4758.entry.js +1 -0
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js +1 -1
- package/dist/types/components/q2-stepper-vertical/index.d.ts +1 -0
- package/dist/types/workspace/workspace/{Tecton_tecton-production_master → tecton-production_release_1.21.x}/packages/q2-tecton-elements/.stencil/test/helpers.d.ts +0 -0
- package/package.json +2 -2
- package/dist/q2-tecton-elements/p-416c97e4.entry.js +0 -1
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-734296a7.js');
|
|
6
6
|
const index$1 = require('./index-3518c78c.js');
|
|
7
7
|
|
|
8
|
-
const stylesCss = "*{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 #33b4ff #06C)}: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:grid;grid-template-columns:var(--tct-advanced-stepper-list-width, var(--t-advanced-stepper-list-width, 180px)) 1fr;gap:var(--tct-advanced-stepper-layout-gap, var(--t-advanced-stepper-layout-gap, 120px))}.step-label,.step-child-label{color:var(--comp-btn-label-color);font-size:var(--comp-btn-label-font-size);font-weight:var(--comp-label-font-weight, 400);height:1.5em}.step-label{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}[aria-selected=true] .step-label{font-weight:var(--tct-advanced-stepper-btn-active-font-weight, var(--t-advanced-stepper-btn-active-font-weight, 600))}[aria-describedby] .step-label{-webkit-line-clamp:1}.step-child-label{grid-area:content;color:var(--comp-btn-label-color)}.step-description{color:var(--tct-advanced-stepper-description-color, var(--t-advanced-stepper-description-color, var(--t-textA, rgba(77, 77, 77, 0.77))));font-size:var(--tct-advanced-stepper-description-font-size, var(--t-advanced-stepper-description-font-size, var(--app-font-size-small, 12px)));padding-bottom:0.2em}ul{--comp-top-btn-icon-size:var(--tct-advanced-stepper-btn-icon-size, var(--t-advanced-stepper-btn-icon-size, 24px));--comp-btn-icon-size:var(--comp-top-btn-icon-size);--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-3x, 15px)));--comp-btn-label-font-size:var-list(var-prefixer(advanced-stepper-btn-label-font-size), 16px);--comp-btn-label-color:var(--tct-advanced-stepper-label-color, var(--t-advanced-stepper-label-color, var(--t-text, #4d4d4d)));--comp-tween:var(--tct-advanced-stepper-tween, var(--t-advanced-stepper-tween, var(--app-tween-1, 0.2s ease)));list-style:none;margin:0;padding:0}ul ul{--comp-btn-icon-size:var(--tct-advanced-stepper-child-btn-icon-size, var(--t-advanced-stepper-child-btn-icon-size, 12px));--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-2x, 10px)));--comp-btn-label-font-size:var-list(\n var-prefixer(advanced-stepper-child-btn-label-font-size),\n --app-font-size-small,\n 12px\n )}ul ul[aria-hidden=true]{display:none}.step-btn,.step-child-btn{display:grid;grid-template-columns:var(--comp-btn-icon-size) 1fr;gap:var(--comp-btn-content-gap);text-align:var(--tct-advanced-stepper-btn-text-align, var(--t-advanced-stepper-btn-text-align, start));grid-template-areas:\"icon content\";align-items:center;width:100%;position:relative;background:transparent;border:0;cursor:pointer;padding:0;transition-property:box-shadow;outline:none}.step-btn[aria-disabled],.step-child-btn[aria-disabled]{cursor:default;--comp-label-font-weight:300;--comp-btn-label-color:var(--tct-advanced-stepper-btn-locked-color, var(--t-advanced-stepper-btn-locked-color, var(--t-textA, rgba(77, 77, 77, 0.77))))}.step-btn[aria-selected=true],.step-child-btn[aria-selected=true]{--comp-label-font-weight:600}.step-btn{min-height:var(--tct-advanced-stepper-btn-height, var(--t-advanced-stepper-btn-height, 40px));font-size:var(--tct-advanced-stepper-btn-font-size, var(--t-advanced-stepper-btn-font-size, 16px));--comp-active-color:var(--t-primary, #0079c1)}.step-btn.status-complete{--comp-active-color:var(--const-stoplight-success, #0e8a00)}.step-btn.status-error{--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-btn.status-locked{cursor:not-allowed}.step-child-btn{--comp-active-color:var(--t-primary, #0079c1);min-height:var(--tct-advanced-stepper-child-btn-height, var(--t-advanced-stepper-child-btn-height, 30px));padding-left:var(--tct-advanced-stepper-child-btn-left-padding, var(--t-advanced-stepper-child-btn-left-padding, var(--app-scale-2x, 10px)));font-size:var(--tct-advanced-stepper-child-btn-font-size, var(--t-advanced-stepper-child-btn-font-size, 12px));border-left-width:var(--tct-advanced-stepper-child-btn-left-border-width, var(--t-advanced-stepper-child-btn-left-border-width, 3px));border-left-style:var(--tct-advanced-stepper-child-btn-left-border-style, var(--t-advanced-stepper-child-btn-left-border-style, solid));border-left-color:transparent}.step-child-btn[aria-selected=true]{--comp-btn-label-color:var(--comp-active-color);border-left-color:var(--comp-active-color)}.step-child-btn.status-error{--comp-btn-label-color:var(--const-stoplight-alert, #c30000);--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-child-btn.status-locked{cursor:not-allowed}.step-content{grid-area:content}.step-icon,.step-bubble,.step-child-icon{grid-area:icon;width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);line-height:0}.step-icon q2-icon,.step-bubble q2-icon,.step-child-icon q2-icon{width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);--tct-icon-fill:var(--comp-active-color)}.step-icon,.step-bubble{background:var(--t-primary, #0079c1);color:var(--t-base, #ffffff);border-radius:50%}.status-complete .step-icon,.status-error .step-icon,.status-complete .step-bubble,.status-error .step-bubble{background:var(--comp-active-color)}.step-icon q2-icon,.step-bubble q2-icon{--tct-icon-fill:var(--comp-active-color)}.step-icon q2-icon:before,.step-bubble q2-icon:before{content:\"\";display:block;background:var(--t-base, #ffffff);position:absolute;width:80%;height:80%;left:11%;top:11%;border-radius:50%}.status-locked .step-icon,.status-locked .step-bubble{background:var(--t-gray-12, #d9d9d9);color:var(--t-text, #4d4d4d)}[aria-selected=true] .step-icon,[aria-selected=true] .step-bubble{box-shadow:0 0 0 2px var(--t-base, #ffffff), 0 0 0 4px var(--comp-active-color)}.step-bubble{display:flex;justify-content:center;align-items:center;line-height:0}.step-child-icon q2-icon{--tct-icon-stroke-primary:var(--comp-active-color);--tct-icon-stroke-secondary:var(--comp-active-color)}[aria-selected=true] .step-child-icon q2-icon{fill:var(--comp-active-color);--tct-icon-stroke-secondary:var(--t-base, #ffffff)}.spacer{height:
|
|
8
|
+
const stylesCss = "*{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 #33b4ff #06C)}: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:grid;grid-template-columns:var(--tct-advanced-stepper-list-width, var(--t-advanced-stepper-list-width, 180px)) 1fr;gap:var(--tct-advanced-stepper-layout-gap, var(--t-advanced-stepper-layout-gap, 120px))}.step-label,.step-child-label{color:var(--comp-btn-label-color);font-size:var(--comp-btn-label-font-size);font-weight:var(--comp-label-font-weight, 400);height:1.5em}.step-label{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}[aria-selected=true] .step-label{font-weight:var(--tct-advanced-stepper-btn-active-font-weight, var(--t-advanced-stepper-btn-active-font-weight, 600))}[aria-describedby] .step-label{-webkit-line-clamp:1}.step-child-label{grid-area:content;color:var(--comp-btn-label-color)}.step-description{color:var(--tct-advanced-stepper-description-color, var(--t-advanced-stepper-description-color, var(--t-textA, rgba(77, 77, 77, 0.77))));font-size:var(--tct-advanced-stepper-description-font-size, var(--t-advanced-stepper-description-font-size, var(--app-font-size-small, 12px)));padding-bottom:0.2em}ul{--comp-top-btn-icon-size:var(--tct-advanced-stepper-btn-icon-size, var(--t-advanced-stepper-btn-icon-size, 24px));--comp-btn-icon-size:var(--comp-top-btn-icon-size);--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-3x, 15px)));--comp-btn-label-font-size:var-list(var-prefixer(advanced-stepper-btn-label-font-size), 16px);--comp-btn-label-color:var(--tct-advanced-stepper-label-color, var(--t-advanced-stepper-label-color, var(--t-text, #4d4d4d)));--comp-tween:var(--tct-advanced-stepper-tween, var(--t-advanced-stepper-tween, var(--app-tween-1, 0.2s ease)));list-style:none;margin:0;padding:0}ul ul{--comp-btn-icon-size:var(--tct-advanced-stepper-child-btn-icon-size, var(--t-advanced-stepper-child-btn-icon-size, 12px));--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-2x, 10px)));--comp-btn-label-font-size:var-list(\n var-prefixer(advanced-stepper-child-btn-label-font-size),\n --app-font-size-small,\n 12px\n )}ul ul[aria-hidden=true]{display:none}.step-btn,.step-child-btn{display:grid;grid-template-columns:var(--comp-btn-icon-size) 1fr;gap:var(--comp-btn-content-gap);text-align:var(--tct-advanced-stepper-btn-text-align, var(--t-advanced-stepper-btn-text-align, start));grid-template-areas:\"icon content\";align-items:center;width:100%;position:relative;background:transparent;border:0;cursor:pointer;padding:0;transition-property:box-shadow;outline:none}.step-btn[aria-disabled],.step-child-btn[aria-disabled]{cursor:default;--comp-label-font-weight:300;--comp-btn-label-color:var(--tct-advanced-stepper-btn-locked-color, var(--t-advanced-stepper-btn-locked-color, var(--t-textA, rgba(77, 77, 77, 0.77))))}.step-btn[aria-selected=true],.step-child-btn[aria-selected=true]{--comp-label-font-weight:600}.step-btn{min-height:var(--tct-advanced-stepper-btn-height, var(--t-advanced-stepper-btn-height, 40px));font-size:var(--tct-advanced-stepper-btn-font-size, var(--t-advanced-stepper-btn-font-size, 16px));--comp-active-color:var(--t-primary, #0079c1)}.step-btn.status-complete{--comp-active-color:var(--const-stoplight-success, #0e8a00)}.step-btn.status-error{--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-btn.status-locked{cursor:not-allowed}.step-child-btn{--comp-active-color:var(--t-primary, #0079c1);min-height:var(--tct-advanced-stepper-child-btn-height, var(--t-advanced-stepper-child-btn-height, 30px));padding-left:var(--tct-advanced-stepper-child-btn-left-padding, var(--t-advanced-stepper-child-btn-left-padding, var(--app-scale-2x, 10px)));font-size:var(--tct-advanced-stepper-child-btn-font-size, var(--t-advanced-stepper-child-btn-font-size, 12px));border-left-width:var(--tct-advanced-stepper-child-btn-left-border-width, var(--t-advanced-stepper-child-btn-left-border-width, 3px));border-left-style:var(--tct-advanced-stepper-child-btn-left-border-style, var(--t-advanced-stepper-child-btn-left-border-style, solid));border-left-color:transparent}.step-child-btn[aria-selected=true]{--comp-btn-label-color:var(--comp-active-color);border-left-color:var(--comp-active-color)}.step-child-btn.status-error{--comp-btn-label-color:var(--const-stoplight-alert, #c30000);--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-child-btn.status-locked{cursor:not-allowed}.step-content{grid-area:content}.step-icon,.step-bubble,.step-child-icon{grid-area:icon;width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);line-height:0}.step-icon q2-icon,.step-bubble q2-icon,.step-child-icon q2-icon{width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);--tct-icon-fill:var(--comp-active-color)}.step-icon,.step-bubble{background:var(--t-primary, #0079c1);color:var(--t-base, #ffffff);border-radius:50%}.status-complete .step-icon,.status-error .step-icon,.status-complete .step-bubble,.status-error .step-bubble{background:var(--comp-active-color)}.step-icon q2-icon,.step-bubble q2-icon{--tct-icon-fill:var(--comp-active-color)}.step-icon q2-icon:before,.step-bubble q2-icon:before{content:\"\";display:block;background:var(--t-base, #ffffff);position:absolute;width:80%;height:80%;left:11%;top:11%;border-radius:50%}.status-locked .step-icon,.status-locked .step-bubble{background:var(--t-gray-12, #d9d9d9);color:var(--t-text, #4d4d4d)}[aria-selected=true] .step-icon,[aria-selected=true] .step-bubble{box-shadow:0 0 0 2px var(--t-base, #ffffff), 0 0 0 4px var(--comp-active-color)}.step-bubble{display:flex;justify-content:center;align-items:center;line-height:0}.step-child-icon q2-icon{--tct-icon-stroke-primary:var(--comp-active-color);--tct-icon-stroke-secondary:var(--comp-active-color)}[aria-selected=true] .step-child-icon q2-icon{fill:var(--comp-active-color);--tct-icon-stroke-secondary:var(--t-base, #ffffff)}.spacer{height:0;border-left-width:var(--tct-advanced-stepper-child-border-width, var(--t-advanced-stepper-child-border-width, 1px));border-left-style:var(--tct-advanced-stepper-child-border-style, var(--t-advanced-stepper-child-border-style, solid));border-left-color:var(--tct-advanced-stepper-child-border-color, var(--t-advanced-stepper-child-border-color, var(--t-gray-12, #d9d9d9)));overflow:hidden;margin-left:calc(var(--comp-top-btn-icon-size) / 2);transition:height var(--comp-tween)}.spacer.has-sibling{height:var(--tct-advanced-stepper-spacer-height, var(--t-advanced-stepper-spacer-height, var(--app-scale-6x, 30px)))}.spacer ul{opacity:0;transition:opacity var(--comp-tween)}.spacer.is-opening ul,.spacer.is-open ul{display:block;opacity:1 !important}.spacer.is-open{overflow:visible}";
|
|
9
9
|
|
|
10
10
|
const Q2AdvancedStepper = class {
|
|
11
11
|
constructor(hostRef) {
|
|
@@ -249,7 +249,14 @@ const Q2AdvancedStepper = class {
|
|
|
249
249
|
stepClasses.push(`status-${status}`);
|
|
250
250
|
const childIds = pane.children.map(child => child.id);
|
|
251
251
|
const isExpanded = isCurrentStep || childIds.includes(currentStepId);
|
|
252
|
-
return (index.h("li", { role: "presentation" }, index.h("button", { class: stepClasses.join(' '), type: "button", "aria-labelledby": labelId, "aria-describedBy": descriptionId, "aria-label": btnLabel, "aria-selected": `${isCurrentStep}`, "aria-expanded": !!pane.children.length ? `${isExpanded}` : null, "aria-controls": id, "aria-disabled": isLocked ? 'true' : null, role: "tab", tabIndex: isCurrentStep ? 0 : -1, onKeyDown: ev => !isLocked && this.onStepKeyDown(ev, id), onClick: ev => !isLocked && this.onStepClick(ev, id) }, statusIcon ? (index.h("div", { class: "step-icon" }, index.h("q2-icon", { type: statusIcon }))) : (index.h("div", { class: "step-bubble" }, stepNumber)), label && (index.h("div", null, index.h("div", { class: "step-label", id: labelId }, stepLabel), description && (index.h("div", { class: "step-description", id: descriptionId }, index$1.loc(description)))))),
|
|
252
|
+
return (index.h("li", { role: "presentation" }, index.h("button", { class: stepClasses.join(' '), type: "button", "aria-labelledby": labelId, "aria-describedBy": descriptionId, "aria-label": btnLabel, "aria-selected": `${isCurrentStep}`, "aria-expanded": !!pane.children.length ? `${isExpanded}` : null, "aria-controls": id, "aria-disabled": isLocked ? 'true' : null, role: "tab", tabIndex: isCurrentStep ? 0 : -1, onKeyDown: ev => !isLocked && this.onStepKeyDown(ev, id), onClick: ev => !isLocked && this.onStepClick(ev, id) }, statusIcon ? (index.h("div", { class: "step-icon" }, index.h("q2-icon", { type: statusIcon }))) : (index.h("div", { class: "step-bubble" }, stepNumber)), label && (index.h("div", null, index.h("div", { class: "step-label", id: labelId }, stepLabel), description && (index.h("div", { class: "step-description", id: descriptionId }, index$1.loc(description)))))), this.renderSpacer(pane, stepLabel, isExpanded, isLastStep)));
|
|
253
|
+
}
|
|
254
|
+
renderSpacer(pane, stepLabel, isExpanded, isLastStep) {
|
|
255
|
+
const shouldRender = (isLastStep && !!pane.children.length) || !isLastStep;
|
|
256
|
+
const spacerClasses = ['spacer'];
|
|
257
|
+
if (!isLastStep)
|
|
258
|
+
spacerClasses.push('has-sibling');
|
|
259
|
+
return (shouldRender && (index.h("div", { class: spacerClasses.join(' ') }, !!pane.children.length && (index.h("ul", { ref: el => isExpanded && (this.expandedStepChildrenList = el), "aria-hidden": `${!isExpanded}` }, pane.children.map((child, index, children) => this.renderChildStepBtn(child, index, children.length, stepLabel)))))));
|
|
253
260
|
}
|
|
254
261
|
renderChildStepBtn(pane, index$2, children, parentLabel) {
|
|
255
262
|
const { currentStepId } = this;
|
|
@@ -240,7 +240,14 @@ export class Q2AdvancedStepper {
|
|
|
240
240
|
stepClasses.push(`status-${status}`);
|
|
241
241
|
const childIds = pane.children.map(child => child.id);
|
|
242
242
|
const isExpanded = isCurrentStep || childIds.includes(currentStepId);
|
|
243
|
-
return (h("li", { role: "presentation" }, h("button", { class: stepClasses.join(' '), type: "button", "aria-labelledby": labelId, "aria-describedBy": descriptionId, "aria-label": btnLabel, "aria-selected": `${isCurrentStep}`, "aria-expanded": !!pane.children.length ? `${isExpanded}` : null, "aria-controls": id, "aria-disabled": isLocked ? 'true' : null, role: "tab", tabIndex: isCurrentStep ? 0 : -1, onKeyDown: ev => !isLocked && this.onStepKeyDown(ev, id), onClick: ev => !isLocked && this.onStepClick(ev, id) }, statusIcon ? (h("div", { class: "step-icon" }, h("q2-icon", { type: statusIcon }))) : (h("div", { class: "step-bubble" }, stepNumber)), label && (h("div", null, h("div", { class: "step-label", id: labelId }, stepLabel), description && (h("div", { class: "step-description", id: descriptionId }, loc(description)))))),
|
|
243
|
+
return (h("li", { role: "presentation" }, h("button", { class: stepClasses.join(' '), type: "button", "aria-labelledby": labelId, "aria-describedBy": descriptionId, "aria-label": btnLabel, "aria-selected": `${isCurrentStep}`, "aria-expanded": !!pane.children.length ? `${isExpanded}` : null, "aria-controls": id, "aria-disabled": isLocked ? 'true' : null, role: "tab", tabIndex: isCurrentStep ? 0 : -1, onKeyDown: ev => !isLocked && this.onStepKeyDown(ev, id), onClick: ev => !isLocked && this.onStepClick(ev, id) }, statusIcon ? (h("div", { class: "step-icon" }, h("q2-icon", { type: statusIcon }))) : (h("div", { class: "step-bubble" }, stepNumber)), label && (h("div", null, h("div", { class: "step-label", id: labelId }, stepLabel), description && (h("div", { class: "step-description", id: descriptionId }, loc(description)))))), this.renderSpacer(pane, stepLabel, isExpanded, isLastStep)));
|
|
244
|
+
}
|
|
245
|
+
renderSpacer(pane, stepLabel, isExpanded, isLastStep) {
|
|
246
|
+
const shouldRender = (isLastStep && !!pane.children.length) || !isLastStep;
|
|
247
|
+
const spacerClasses = ['spacer'];
|
|
248
|
+
if (!isLastStep)
|
|
249
|
+
spacerClasses.push('has-sibling');
|
|
250
|
+
return (shouldRender && (h("div", { class: spacerClasses.join(' ') }, !!pane.children.length && (h("ul", { ref: el => isExpanded && (this.expandedStepChildrenList = el), "aria-hidden": `${!isExpanded}` }, pane.children.map((child, index, children) => this.renderChildStepBtn(child, index, children.length, stepLabel)))))));
|
|
244
251
|
}
|
|
245
252
|
renderChildStepBtn(pane, index, children, parentLabel) {
|
|
246
253
|
const { currentStepId } = this;
|
|
@@ -266,7 +266,7 @@ ul ul[aria-hidden=true] {
|
|
|
266
266
|
}
|
|
267
267
|
|
|
268
268
|
.spacer {
|
|
269
|
-
height:
|
|
269
|
+
height: 0;
|
|
270
270
|
border-left-width: var(--tct-advanced-stepper-child-border-width, var(--t-advanced-stepper-child-border-width, 1px));
|
|
271
271
|
border-left-style: var(--tct-advanced-stepper-child-border-style, var(--t-advanced-stepper-child-border-style, solid));
|
|
272
272
|
border-left-color: var(--tct-advanced-stepper-child-border-color, var(--t-advanced-stepper-child-border-color, var(--t-gray-12, #d9d9d9)));
|
|
@@ -274,6 +274,9 @@ ul ul[aria-hidden=true] {
|
|
|
274
274
|
margin-left: calc(var(--comp-top-btn-icon-size) / 2);
|
|
275
275
|
transition: height var(--comp-tween);
|
|
276
276
|
}
|
|
277
|
+
.spacer.has-sibling {
|
|
278
|
+
height: var(--tct-advanced-stepper-spacer-height, var(--t-advanced-stepper-spacer-height, var(--app-scale-6x, 30px)));
|
|
279
|
+
}
|
|
277
280
|
.spacer ul {
|
|
278
281
|
opacity: 0;
|
|
279
282
|
transition: opacity var(--comp-tween);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, h, F as Fragment, g as getElement } from './index-bb1c8c7f.js';
|
|
2
2
|
import { o as overrideFocus, c as createGuid, i as isEventFromElement, l as loc } from './index-9c591682.js';
|
|
3
3
|
|
|
4
|
-
const stylesCss = "*{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 #33b4ff #06C)}: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:grid;grid-template-columns:var(--tct-advanced-stepper-list-width, var(--t-advanced-stepper-list-width, 180px)) 1fr;gap:var(--tct-advanced-stepper-layout-gap, var(--t-advanced-stepper-layout-gap, 120px))}.step-label,.step-child-label{color:var(--comp-btn-label-color);font-size:var(--comp-btn-label-font-size);font-weight:var(--comp-label-font-weight, 400);height:1.5em}.step-label{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}[aria-selected=true] .step-label{font-weight:var(--tct-advanced-stepper-btn-active-font-weight, var(--t-advanced-stepper-btn-active-font-weight, 600))}[aria-describedby] .step-label{-webkit-line-clamp:1}.step-child-label{grid-area:content;color:var(--comp-btn-label-color)}.step-description{color:var(--tct-advanced-stepper-description-color, var(--t-advanced-stepper-description-color, var(--t-textA, rgba(77, 77, 77, 0.77))));font-size:var(--tct-advanced-stepper-description-font-size, var(--t-advanced-stepper-description-font-size, var(--app-font-size-small, 12px)));padding-bottom:0.2em}ul{--comp-top-btn-icon-size:var(--tct-advanced-stepper-btn-icon-size, var(--t-advanced-stepper-btn-icon-size, 24px));--comp-btn-icon-size:var(--comp-top-btn-icon-size);--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-3x, 15px)));--comp-btn-label-font-size:var-list(var-prefixer(advanced-stepper-btn-label-font-size), 16px);--comp-btn-label-color:var(--tct-advanced-stepper-label-color, var(--t-advanced-stepper-label-color, var(--t-text, #4d4d4d)));--comp-tween:var(--tct-advanced-stepper-tween, var(--t-advanced-stepper-tween, var(--app-tween-1, 0.2s ease)));list-style:none;margin:0;padding:0}ul ul{--comp-btn-icon-size:var(--tct-advanced-stepper-child-btn-icon-size, var(--t-advanced-stepper-child-btn-icon-size, 12px));--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-2x, 10px)));--comp-btn-label-font-size:var-list(\n var-prefixer(advanced-stepper-child-btn-label-font-size),\n --app-font-size-small,\n 12px\n )}ul ul[aria-hidden=true]{display:none}.step-btn,.step-child-btn{display:grid;grid-template-columns:var(--comp-btn-icon-size) 1fr;gap:var(--comp-btn-content-gap);text-align:var(--tct-advanced-stepper-btn-text-align, var(--t-advanced-stepper-btn-text-align, start));grid-template-areas:\"icon content\";align-items:center;width:100%;position:relative;background:transparent;border:0;cursor:pointer;padding:0;transition-property:box-shadow;outline:none}.step-btn[aria-disabled],.step-child-btn[aria-disabled]{cursor:default;--comp-label-font-weight:300;--comp-btn-label-color:var(--tct-advanced-stepper-btn-locked-color, var(--t-advanced-stepper-btn-locked-color, var(--t-textA, rgba(77, 77, 77, 0.77))))}.step-btn[aria-selected=true],.step-child-btn[aria-selected=true]{--comp-label-font-weight:600}.step-btn{min-height:var(--tct-advanced-stepper-btn-height, var(--t-advanced-stepper-btn-height, 40px));font-size:var(--tct-advanced-stepper-btn-font-size, var(--t-advanced-stepper-btn-font-size, 16px));--comp-active-color:var(--t-primary, #0079c1)}.step-btn.status-complete{--comp-active-color:var(--const-stoplight-success, #0e8a00)}.step-btn.status-error{--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-btn.status-locked{cursor:not-allowed}.step-child-btn{--comp-active-color:var(--t-primary, #0079c1);min-height:var(--tct-advanced-stepper-child-btn-height, var(--t-advanced-stepper-child-btn-height, 30px));padding-left:var(--tct-advanced-stepper-child-btn-left-padding, var(--t-advanced-stepper-child-btn-left-padding, var(--app-scale-2x, 10px)));font-size:var(--tct-advanced-stepper-child-btn-font-size, var(--t-advanced-stepper-child-btn-font-size, 12px));border-left-width:var(--tct-advanced-stepper-child-btn-left-border-width, var(--t-advanced-stepper-child-btn-left-border-width, 3px));border-left-style:var(--tct-advanced-stepper-child-btn-left-border-style, var(--t-advanced-stepper-child-btn-left-border-style, solid));border-left-color:transparent}.step-child-btn[aria-selected=true]{--comp-btn-label-color:var(--comp-active-color);border-left-color:var(--comp-active-color)}.step-child-btn.status-error{--comp-btn-label-color:var(--const-stoplight-alert, #c30000);--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-child-btn.status-locked{cursor:not-allowed}.step-content{grid-area:content}.step-icon,.step-bubble,.step-child-icon{grid-area:icon;width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);line-height:0}.step-icon q2-icon,.step-bubble q2-icon,.step-child-icon q2-icon{width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);--tct-icon-fill:var(--comp-active-color)}.step-icon,.step-bubble{background:var(--t-primary, #0079c1);color:var(--t-base, #ffffff);border-radius:50%}.status-complete .step-icon,.status-error .step-icon,.status-complete .step-bubble,.status-error .step-bubble{background:var(--comp-active-color)}.step-icon q2-icon,.step-bubble q2-icon{--tct-icon-fill:var(--comp-active-color)}.step-icon q2-icon:before,.step-bubble q2-icon:before{content:\"\";display:block;background:var(--t-base, #ffffff);position:absolute;width:80%;height:80%;left:11%;top:11%;border-radius:50%}.status-locked .step-icon,.status-locked .step-bubble{background:var(--t-gray-12, #d9d9d9);color:var(--t-text, #4d4d4d)}[aria-selected=true] .step-icon,[aria-selected=true] .step-bubble{box-shadow:0 0 0 2px var(--t-base, #ffffff), 0 0 0 4px var(--comp-active-color)}.step-bubble{display:flex;justify-content:center;align-items:center;line-height:0}.step-child-icon q2-icon{--tct-icon-stroke-primary:var(--comp-active-color);--tct-icon-stroke-secondary:var(--comp-active-color)}[aria-selected=true] .step-child-icon q2-icon{fill:var(--comp-active-color);--tct-icon-stroke-secondary:var(--t-base, #ffffff)}.spacer{height:
|
|
4
|
+
const stylesCss = "*{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 #33b4ff #06C)}: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:grid;grid-template-columns:var(--tct-advanced-stepper-list-width, var(--t-advanced-stepper-list-width, 180px)) 1fr;gap:var(--tct-advanced-stepper-layout-gap, var(--t-advanced-stepper-layout-gap, 120px))}.step-label,.step-child-label{color:var(--comp-btn-label-color);font-size:var(--comp-btn-label-font-size);font-weight:var(--comp-label-font-weight, 400);height:1.5em}.step-label{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}[aria-selected=true] .step-label{font-weight:var(--tct-advanced-stepper-btn-active-font-weight, var(--t-advanced-stepper-btn-active-font-weight, 600))}[aria-describedby] .step-label{-webkit-line-clamp:1}.step-child-label{grid-area:content;color:var(--comp-btn-label-color)}.step-description{color:var(--tct-advanced-stepper-description-color, var(--t-advanced-stepper-description-color, var(--t-textA, rgba(77, 77, 77, 0.77))));font-size:var(--tct-advanced-stepper-description-font-size, var(--t-advanced-stepper-description-font-size, var(--app-font-size-small, 12px)));padding-bottom:0.2em}ul{--comp-top-btn-icon-size:var(--tct-advanced-stepper-btn-icon-size, var(--t-advanced-stepper-btn-icon-size, 24px));--comp-btn-icon-size:var(--comp-top-btn-icon-size);--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-3x, 15px)));--comp-btn-label-font-size:var-list(var-prefixer(advanced-stepper-btn-label-font-size), 16px);--comp-btn-label-color:var(--tct-advanced-stepper-label-color, var(--t-advanced-stepper-label-color, var(--t-text, #4d4d4d)));--comp-tween:var(--tct-advanced-stepper-tween, var(--t-advanced-stepper-tween, var(--app-tween-1, 0.2s ease)));list-style:none;margin:0;padding:0}ul ul{--comp-btn-icon-size:var(--tct-advanced-stepper-child-btn-icon-size, var(--t-advanced-stepper-child-btn-icon-size, 12px));--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-2x, 10px)));--comp-btn-label-font-size:var-list(\n var-prefixer(advanced-stepper-child-btn-label-font-size),\n --app-font-size-small,\n 12px\n )}ul ul[aria-hidden=true]{display:none}.step-btn,.step-child-btn{display:grid;grid-template-columns:var(--comp-btn-icon-size) 1fr;gap:var(--comp-btn-content-gap);text-align:var(--tct-advanced-stepper-btn-text-align, var(--t-advanced-stepper-btn-text-align, start));grid-template-areas:\"icon content\";align-items:center;width:100%;position:relative;background:transparent;border:0;cursor:pointer;padding:0;transition-property:box-shadow;outline:none}.step-btn[aria-disabled],.step-child-btn[aria-disabled]{cursor:default;--comp-label-font-weight:300;--comp-btn-label-color:var(--tct-advanced-stepper-btn-locked-color, var(--t-advanced-stepper-btn-locked-color, var(--t-textA, rgba(77, 77, 77, 0.77))))}.step-btn[aria-selected=true],.step-child-btn[aria-selected=true]{--comp-label-font-weight:600}.step-btn{min-height:var(--tct-advanced-stepper-btn-height, var(--t-advanced-stepper-btn-height, 40px));font-size:var(--tct-advanced-stepper-btn-font-size, var(--t-advanced-stepper-btn-font-size, 16px));--comp-active-color:var(--t-primary, #0079c1)}.step-btn.status-complete{--comp-active-color:var(--const-stoplight-success, #0e8a00)}.step-btn.status-error{--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-btn.status-locked{cursor:not-allowed}.step-child-btn{--comp-active-color:var(--t-primary, #0079c1);min-height:var(--tct-advanced-stepper-child-btn-height, var(--t-advanced-stepper-child-btn-height, 30px));padding-left:var(--tct-advanced-stepper-child-btn-left-padding, var(--t-advanced-stepper-child-btn-left-padding, var(--app-scale-2x, 10px)));font-size:var(--tct-advanced-stepper-child-btn-font-size, var(--t-advanced-stepper-child-btn-font-size, 12px));border-left-width:var(--tct-advanced-stepper-child-btn-left-border-width, var(--t-advanced-stepper-child-btn-left-border-width, 3px));border-left-style:var(--tct-advanced-stepper-child-btn-left-border-style, var(--t-advanced-stepper-child-btn-left-border-style, solid));border-left-color:transparent}.step-child-btn[aria-selected=true]{--comp-btn-label-color:var(--comp-active-color);border-left-color:var(--comp-active-color)}.step-child-btn.status-error{--comp-btn-label-color:var(--const-stoplight-alert, #c30000);--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-child-btn.status-locked{cursor:not-allowed}.step-content{grid-area:content}.step-icon,.step-bubble,.step-child-icon{grid-area:icon;width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);line-height:0}.step-icon q2-icon,.step-bubble q2-icon,.step-child-icon q2-icon{width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);--tct-icon-fill:var(--comp-active-color)}.step-icon,.step-bubble{background:var(--t-primary, #0079c1);color:var(--t-base, #ffffff);border-radius:50%}.status-complete .step-icon,.status-error .step-icon,.status-complete .step-bubble,.status-error .step-bubble{background:var(--comp-active-color)}.step-icon q2-icon,.step-bubble q2-icon{--tct-icon-fill:var(--comp-active-color)}.step-icon q2-icon:before,.step-bubble q2-icon:before{content:\"\";display:block;background:var(--t-base, #ffffff);position:absolute;width:80%;height:80%;left:11%;top:11%;border-radius:50%}.status-locked .step-icon,.status-locked .step-bubble{background:var(--t-gray-12, #d9d9d9);color:var(--t-text, #4d4d4d)}[aria-selected=true] .step-icon,[aria-selected=true] .step-bubble{box-shadow:0 0 0 2px var(--t-base, #ffffff), 0 0 0 4px var(--comp-active-color)}.step-bubble{display:flex;justify-content:center;align-items:center;line-height:0}.step-child-icon q2-icon{--tct-icon-stroke-primary:var(--comp-active-color);--tct-icon-stroke-secondary:var(--comp-active-color)}[aria-selected=true] .step-child-icon q2-icon{fill:var(--comp-active-color);--tct-icon-stroke-secondary:var(--t-base, #ffffff)}.spacer{height:0;border-left-width:var(--tct-advanced-stepper-child-border-width, var(--t-advanced-stepper-child-border-width, 1px));border-left-style:var(--tct-advanced-stepper-child-border-style, var(--t-advanced-stepper-child-border-style, solid));border-left-color:var(--tct-advanced-stepper-child-border-color, var(--t-advanced-stepper-child-border-color, var(--t-gray-12, #d9d9d9)));overflow:hidden;margin-left:calc(var(--comp-top-btn-icon-size) / 2);transition:height var(--comp-tween)}.spacer.has-sibling{height:var(--tct-advanced-stepper-spacer-height, var(--t-advanced-stepper-spacer-height, var(--app-scale-6x, 30px)))}.spacer ul{opacity:0;transition:opacity var(--comp-tween)}.spacer.is-opening ul,.spacer.is-open ul{display:block;opacity:1 !important}.spacer.is-open{overflow:visible}";
|
|
5
5
|
|
|
6
6
|
const Q2AdvancedStepper = class {
|
|
7
7
|
constructor(hostRef) {
|
|
@@ -245,7 +245,14 @@ const Q2AdvancedStepper = class {
|
|
|
245
245
|
stepClasses.push(`status-${status}`);
|
|
246
246
|
const childIds = pane.children.map(child => child.id);
|
|
247
247
|
const isExpanded = isCurrentStep || childIds.includes(currentStepId);
|
|
248
|
-
return (h("li", { role: "presentation" }, h("button", { class: stepClasses.join(' '), type: "button", "aria-labelledby": labelId, "aria-describedBy": descriptionId, "aria-label": btnLabel, "aria-selected": `${isCurrentStep}`, "aria-expanded": !!pane.children.length ? `${isExpanded}` : null, "aria-controls": id, "aria-disabled": isLocked ? 'true' : null, role: "tab", tabIndex: isCurrentStep ? 0 : -1, onKeyDown: ev => !isLocked && this.onStepKeyDown(ev, id), onClick: ev => !isLocked && this.onStepClick(ev, id) }, statusIcon ? (h("div", { class: "step-icon" }, h("q2-icon", { type: statusIcon }))) : (h("div", { class: "step-bubble" }, stepNumber)), label && (h("div", null, h("div", { class: "step-label", id: labelId }, stepLabel), description && (h("div", { class: "step-description", id: descriptionId }, loc(description)))))),
|
|
248
|
+
return (h("li", { role: "presentation" }, h("button", { class: stepClasses.join(' '), type: "button", "aria-labelledby": labelId, "aria-describedBy": descriptionId, "aria-label": btnLabel, "aria-selected": `${isCurrentStep}`, "aria-expanded": !!pane.children.length ? `${isExpanded}` : null, "aria-controls": id, "aria-disabled": isLocked ? 'true' : null, role: "tab", tabIndex: isCurrentStep ? 0 : -1, onKeyDown: ev => !isLocked && this.onStepKeyDown(ev, id), onClick: ev => !isLocked && this.onStepClick(ev, id) }, statusIcon ? (h("div", { class: "step-icon" }, h("q2-icon", { type: statusIcon }))) : (h("div", { class: "step-bubble" }, stepNumber)), label && (h("div", null, h("div", { class: "step-label", id: labelId }, stepLabel), description && (h("div", { class: "step-description", id: descriptionId }, loc(description)))))), this.renderSpacer(pane, stepLabel, isExpanded, isLastStep)));
|
|
249
|
+
}
|
|
250
|
+
renderSpacer(pane, stepLabel, isExpanded, isLastStep) {
|
|
251
|
+
const shouldRender = (isLastStep && !!pane.children.length) || !isLastStep;
|
|
252
|
+
const spacerClasses = ['spacer'];
|
|
253
|
+
if (!isLastStep)
|
|
254
|
+
spacerClasses.push('has-sibling');
|
|
255
|
+
return (shouldRender && (h("div", { class: spacerClasses.join(' ') }, !!pane.children.length && (h("ul", { ref: el => isExpanded && (this.expandedStepChildrenList = el), "aria-hidden": `${!isExpanded}` }, pane.children.map((child, index, children) => this.renderChildStepBtn(child, index, children.length, stepLabel)))))));
|
|
249
256
|
}
|
|
250
257
|
renderChildStepBtn(pane, index, children, parentLabel) {
|
|
251
258
|
const { currentStepId } = this;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,c as e,h as a,F as r,g as i}from"./p-926a3e80.js";import{o as s,c as n,i as o,l as c}from"./p-5e374fbd.js";const l=class{constructor(a){t(this,a),this.change=e(this,"change",7),this.scheduledAfterRender=[],this.determinePaneChanges=t=>{t.forEach((t=>{var e,a;"childList"===t.type&&(t.addedNodes.length||t.removedNodes.length)&&((null===(e=t.addedNodes[0])||void 0===e?void 0:e.nodeType)!==Node.ELEMENT_NODE&&(null===(a=t.removedNodes[0])||void 0===a?void 0:a.nodeType)!==Node.ELEMENT_NODE||this.buildPaneList())}))},this.buildPaneList=()=>{const{allRootPanes:t}=this;t.length&&(this.structuredPanes=Array.from(t).reduce(((t,e)=>{var a,r;const i=Array.from(null!==(r=null===(a=e.querySelector("[slot=children]"))||void 0===a?void 0:a.children)&&void 0!==r?r:[]).filter((({tagName:t})=>"Q2-STEPPER-PANE"===t)).map(this.extractDetails);return t.push(Object.assign(Object.assign({},this.extractDetails(e)),{children:i})),t}),[]))},this.onStepClick=(t,e)=>{t.stopPropagation();const{currentStepId:a}=this;if(e===a)return;const r=this.allPanes.find((t=>t.id===e));this.change.emit({selectedStep:r,selectedStepId:e,currentStepId:a})},this.onStepKeyDown=(t,e)=>{const{key:a}=t;let r;switch(a){case"ArrowUp":case"ArrowLeft":t.preventDefault(),r=this.getStepId(e,"prev");break;case"ArrowDown":case"ArrowRight":t.preventDefault(),r=this.getStepId(e,"next");break;case"Home":t.preventDefault(),r=this.getStepId(e,"first");break;case"End":t.preventDefault(),r=this.getStepId(e,"last")}r&&this.focusStepBtn(r,!0)},this.currentStepId=void 0,this.structuredPanes=[]}componentWillLoad(){this.setDefaultPane(),this.buildPaneList();const t=new MutationObserver(this.determinePaneChanges),e={childList:!0};t.observe(this.hostElement,e),this.allRootPanes.forEach((a=>{const r=a.querySelector("[slot=children]");r&&t.observe(r,e)})),this.mutationObserver=t}componentDidLoad(){s(this.hostElement),setTimeout((()=>this.showStep(this.currentStepId)),0)}componentWillUpdate(){this.expandedStepChildrenList=null}componentDidRender(){this.scheduledAfterRender.forEach((t=>t())),this.scheduledAfterRender=[],this.openCurrentStepChildren()}disconnectedCallback(){this.mutationObserver.disconnect(),this.mutationObserver=null}get allRootPanes(){return Array.from(this.hostElement.querySelectorAll(":scope > q2-stepper-pane"))}get allPanes(){return Array.from(this.hostElement.querySelectorAll("q2-stepper-pane"))}setDefaultPane(){if(this.currentStepId)return;const t=this.hostElement.querySelector("q2-stepper-pane");t&&(t.id||(t.id=`step-${n()}`),this.currentStepId=t.id)}getStepId(t,e){const a=Array.from(this.hostElement.shadowRoot.querySelectorAll('ul:not([aria-hidden="true"]) > li > button:not([aria-disabled="true"])')),r=a.findIndex((e=>e.getAttribute("aria-controls")===t));let i;switch(e){case"prev":i=Math.max(r-1,0);break;case"next":i=Math.min(r+1,a.length-1);break;case"first":i=0;break;case"last":i=a.length-1}return a[i].getAttribute("aria-controls")}showStep(t){this.scheduledAfterRender.push(this.resizeIframe),this.showStepPane(t),this.focusStepBtn(t)}extractDetails(t){const{label:e,description:a,status:r}=t;return t.id||(t.id=`step-${n()}`),{id:t.id,label:e,description:a,status:r}}resizeIframe(){var t,e;return null===(e=null===(t=null===window||void 0===window?void 0:window.TectonElements)||void 0===t?void 0:t.resizeIframe)||void 0===e?void 0:e.call(t)}openCurrentStepChildren(){const{expandedStepChildrenList:t}=this;this.hostElement.shadowRoot.querySelectorAll(".spacer").forEach((e=>{if(t&&e.contains(t)){if(e.style.height=`${t.clientHeight}px`,e.classList.contains("is-open"))return;e.classList.add("is-opening"),e.addEventListener("transitionend",(()=>{e.classList.remove("is-opening"),e.classList.add("is-open"),this.resizeIframe()}),{once:!0})}else e.removeAttribute("style"),e.classList.remove("is-open","is-opening")}))}showStepPane(t){this.allPanes.forEach((e=>{(e.isActive||e.id===t)&&(e.isActive=t===e.id)}))}focusStepBtn(t,e){const a=this.hostElement.shadowRoot.querySelector(`button[aria-controls="${t}"]`),r=document.activeElement===this.hostElement;a&&(r||e)&&a.focus()}defaultChangeHandler(t){const{hostElement:e}=this;t.target===e&&!e.getAttribute("onchange")&&t.detail&&(this.currentStepId=t.detail.selectedStepId)}delegateFocus(t){o(t,this.hostElement)&&this.focusStepBtn(this.currentStepId,!0)}statusChangeHandler(){this.buildPaneList()}currentStepChanged(t){this.showStep(t)}renderStepBtn(t,e){const{currentStepId:r,structuredPanes:i}=this,s=e===i.length-1,{id:n,label:o,description:l,status:p}=t,d=e+1,b=n===r,h=o&&`label-${n}`,v="locked"===p,u=o&&c(o),f=o&&l&&`description-${n}`,g=!o&&c("tecton.element.advancedStepper.number",[`${d}`,`${i.length}`]);let m;"complete"===p?m="success-filled":"error"===p&&(m="warning-filled");const w=["step-btn"];p&&w.push(`status-${p}`);const x=t.children.map((t=>t.id)),y=b||x.includes(r);return a("li",{role:"presentation"},a("button",{class:w.join(" "),type:"button","aria-labelledby":h,"aria-describedBy":f,"aria-label":g,"aria-selected":`${b}`,"aria-expanded":t.children.length?`${y}`:null,"aria-controls":n,"aria-disabled":v?"true":null,role:"tab",tabIndex:b?0:-1,onKeyDown:t=>!v&&this.onStepKeyDown(t,n),onClick:t=>!v&&this.onStepClick(t,n)},m?a("div",{class:"step-icon"},a("q2-icon",{type:m})):a("div",{class:"step-bubble"},d),o&&a("div",null,a("div",{class:"step-label",id:h},u),l&&a("div",{class:"step-description",id:f},c(l)))),this.renderSpacer(t,u,y,s))}renderSpacer(t,e,r,i){const s=i&&!!t.children.length||!i,n=["spacer"];return i||n.push("has-sibling"),s&&a("div",{class:n.join(" ")},!!t.children.length&&a("ul",{ref:t=>r&&(this.expandedStepChildrenList=t),"aria-hidden":`${!r}`},t.children.map(((t,a,r)=>this.renderChildStepBtn(t,a,r.length,e)))))}renderChildStepBtn(t,e,r,i){const{currentStepId:s}=this,{id:n,label:o,status:l}=t,p=o&&`label-${n}`,d=n===s,b="locked"===l,h=!o&&c("tecton.element.advancedStepper.childNumber",[`${e+1}`,`${r}`,i]);let v;"error"===l&&(v="warning-filled");const u=["step-child-btn"];return l&&u.push(`status-${l}`),a("li",{role:"presentation"},a("button",{class:u.join(" "),type:"button","aria-labelledby":p,"aria-label":h,"aria-selected":`${d}`,"aria-controls":n,"aria-disabled":b?"true":null,role:"tab",tabIndex:d?0:-1,onKeyDown:t=>!b&&this.onStepKeyDown(t,n),onClick:t=>!b&&this.onStepClick(t,n)},v&&a("div",{class:"step-child-icon"},a("q2-icon",{type:v})),o&&a("div",{class:"step-child-label",id:p},c(o))))}render(){return a(r,null,a("ul",{role:"tablist"},this.structuredPanes.map(((t,e)=>this.renderStepBtn(t,e)))),a("div",null,a("slot",null)))}get hostElement(){return i(this)}static get watchers(){return{currentStepId:["currentStepChanged"]}}};l.style='*{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 #33b4ff #06C)}: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:grid;grid-template-columns:var(--tct-advanced-stepper-list-width, var(--t-advanced-stepper-list-width, 180px)) 1fr;gap:var(--tct-advanced-stepper-layout-gap, var(--t-advanced-stepper-layout-gap, 120px))}.step-label,.step-child-label{color:var(--comp-btn-label-color);font-size:var(--comp-btn-label-font-size);font-weight:var(--comp-label-font-weight, 400);height:1.5em}.step-label{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}[aria-selected=true] .step-label{font-weight:var(--tct-advanced-stepper-btn-active-font-weight, var(--t-advanced-stepper-btn-active-font-weight, 600))}[aria-describedby] .step-label{-webkit-line-clamp:1}.step-child-label{grid-area:content;color:var(--comp-btn-label-color)}.step-description{color:var(--tct-advanced-stepper-description-color, var(--t-advanced-stepper-description-color, var(--t-textA, rgba(77, 77, 77, 0.77))));font-size:var(--tct-advanced-stepper-description-font-size, var(--t-advanced-stepper-description-font-size, var(--app-font-size-small, 12px)));padding-bottom:0.2em}ul{--comp-top-btn-icon-size:var(--tct-advanced-stepper-btn-icon-size, var(--t-advanced-stepper-btn-icon-size, 24px));--comp-btn-icon-size:var(--comp-top-btn-icon-size);--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-3x, 15px)));--comp-btn-label-font-size:var-list(var-prefixer(advanced-stepper-btn-label-font-size), 16px);--comp-btn-label-color:var(--tct-advanced-stepper-label-color, var(--t-advanced-stepper-label-color, var(--t-text, #4d4d4d)));--comp-tween:var(--tct-advanced-stepper-tween, var(--t-advanced-stepper-tween, var(--app-tween-1, 0.2s ease)));list-style:none;margin:0;padding:0}ul ul{--comp-btn-icon-size:var(--tct-advanced-stepper-child-btn-icon-size, var(--t-advanced-stepper-child-btn-icon-size, 12px));--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-2x, 10px)));--comp-btn-label-font-size:var-list(\n var-prefixer(advanced-stepper-child-btn-label-font-size),\n --app-font-size-small,\n 12px\n )}ul ul[aria-hidden=true]{display:none}.step-btn,.step-child-btn{display:grid;grid-template-columns:var(--comp-btn-icon-size) 1fr;gap:var(--comp-btn-content-gap);text-align:var(--tct-advanced-stepper-btn-text-align, var(--t-advanced-stepper-btn-text-align, start));grid-template-areas:"icon content";align-items:center;width:100%;position:relative;background:transparent;border:0;cursor:pointer;padding:0;transition-property:box-shadow;outline:none}.step-btn[aria-disabled],.step-child-btn[aria-disabled]{cursor:default;--comp-label-font-weight:300;--comp-btn-label-color:var(--tct-advanced-stepper-btn-locked-color, var(--t-advanced-stepper-btn-locked-color, var(--t-textA, rgba(77, 77, 77, 0.77))))}.step-btn[aria-selected=true],.step-child-btn[aria-selected=true]{--comp-label-font-weight:600}.step-btn{min-height:var(--tct-advanced-stepper-btn-height, var(--t-advanced-stepper-btn-height, 40px));font-size:var(--tct-advanced-stepper-btn-font-size, var(--t-advanced-stepper-btn-font-size, 16px));--comp-active-color:var(--t-primary, #0079c1)}.step-btn.status-complete{--comp-active-color:var(--const-stoplight-success, #0e8a00)}.step-btn.status-error{--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-btn.status-locked{cursor:not-allowed}.step-child-btn{--comp-active-color:var(--t-primary, #0079c1);min-height:var(--tct-advanced-stepper-child-btn-height, var(--t-advanced-stepper-child-btn-height, 30px));padding-left:var(--tct-advanced-stepper-child-btn-left-padding, var(--t-advanced-stepper-child-btn-left-padding, var(--app-scale-2x, 10px)));font-size:var(--tct-advanced-stepper-child-btn-font-size, var(--t-advanced-stepper-child-btn-font-size, 12px));border-left-width:var(--tct-advanced-stepper-child-btn-left-border-width, var(--t-advanced-stepper-child-btn-left-border-width, 3px));border-left-style:var(--tct-advanced-stepper-child-btn-left-border-style, var(--t-advanced-stepper-child-btn-left-border-style, solid));border-left-color:transparent}.step-child-btn[aria-selected=true]{--comp-btn-label-color:var(--comp-active-color);border-left-color:var(--comp-active-color)}.step-child-btn.status-error{--comp-btn-label-color:var(--const-stoplight-alert, #c30000);--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-child-btn.status-locked{cursor:not-allowed}.step-content{grid-area:content}.step-icon,.step-bubble,.step-child-icon{grid-area:icon;width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);line-height:0}.step-icon q2-icon,.step-bubble q2-icon,.step-child-icon q2-icon{width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);--tct-icon-fill:var(--comp-active-color)}.step-icon,.step-bubble{background:var(--t-primary, #0079c1);color:var(--t-base, #ffffff);border-radius:50%}.status-complete .step-icon,.status-error .step-icon,.status-complete .step-bubble,.status-error .step-bubble{background:var(--comp-active-color)}.step-icon q2-icon,.step-bubble q2-icon{--tct-icon-fill:var(--comp-active-color)}.step-icon q2-icon:before,.step-bubble q2-icon:before{content:"";display:block;background:var(--t-base, #ffffff);position:absolute;width:80%;height:80%;left:11%;top:11%;border-radius:50%}.status-locked .step-icon,.status-locked .step-bubble{background:var(--t-gray-12, #d9d9d9);color:var(--t-text, #4d4d4d)}[aria-selected=true] .step-icon,[aria-selected=true] .step-bubble{box-shadow:0 0 0 2px var(--t-base, #ffffff), 0 0 0 4px var(--comp-active-color)}.step-bubble{display:flex;justify-content:center;align-items:center;line-height:0}.step-child-icon q2-icon{--tct-icon-stroke-primary:var(--comp-active-color);--tct-icon-stroke-secondary:var(--comp-active-color)}[aria-selected=true] .step-child-icon q2-icon{fill:var(--comp-active-color);--tct-icon-stroke-secondary:var(--t-base, #ffffff)}.spacer{height:0;border-left-width:var(--tct-advanced-stepper-child-border-width, var(--t-advanced-stepper-child-border-width, 1px));border-left-style:var(--tct-advanced-stepper-child-border-style, var(--t-advanced-stepper-child-border-style, solid));border-left-color:var(--tct-advanced-stepper-child-border-color, var(--t-advanced-stepper-child-border-color, var(--t-gray-12, #d9d9d9)));overflow:hidden;margin-left:calc(var(--comp-top-btn-icon-size) / 2);transition:height var(--comp-tween)}.spacer.has-sibling{height:var(--tct-advanced-stepper-spacer-height, var(--t-advanced-stepper-spacer-height, var(--app-scale-6x, 30px)))}.spacer ul{opacity:0;transition:opacity var(--comp-tween)}.spacer.is-opening ul,.spacer.is-open ul{display:block;opacity:1 !important}.spacer.is-open{overflow:visible}';export{l as q2_stepper_vertical}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,b as a}from"./p-926a3e80.js";(()=>{const a=import.meta.url,l={};return""!==a&&(l.resourcesUrl=new URL(".",a).href),e(l)})().then((e=>a(JSON.parse('[["p-db873db2",[[1,"q2-icon",{"type":[513],"label":[513],"inline":[516]}]]],["p-0766a694",[[1,"q2-calendar",{"value":[1537],"label":[513],"hideLabel":[516,"hide-label"],"ariaLabel":[513,"aria-label"],"optional":[516],"disabled":[516],"readonly":[516],"invalid":[1540],"typeable":[516],"placeholder":[513],"buttonLabel":[513,"button-label"],"disabledMsg":[513,"disabled-msg"],"calendarLabel":[513,"calendar-label"],"disclaimer":[513],"displayFormat":[513,"display-format"],"startDate":[513,"start-date"],"endDate":[513,"end-date"],"cutoffTime":[513,"cutoff-time"],"daysOfWeekChecksum":[514,"days-of-week-checksum"],"popDirection":[513,"pop-direction"],"assume":[513],"errors":[1040],"invalidDates":[16],"validDates":[16],"onsuccess":[16],"dropdownOpen":[32],"keyboardSelection":[32],"typedValue":[32],"dateList":[32],"hintMessage":[32],"hintMessageType":[32]},[[0,"change","defaultChangeHandler"],[0,"error","defaultErrorHandler"],[0,"success","defaultSuccessHandler"],[0,"focus","delegateFocus"]]]]],["p-aaf42539",[[1,"q2-select",{"label":[1537],"hideLabel":[1540,"hide-label"],"value":[1025],"ariaLabel":[1537,"aria-label"],"selectedOptions":[1032,"selected-options"],"disabled":[516],"readonly":[516],"invalid":[516],"errors":[16],"multiple":[516],"minRows":[2,"min-rows"],"popDirection":[513,"pop-direction"],"searchable":[516],"multilineOptions":[516,"multiline-options"],"optional":[516],"dropdownOpen":[32],"onlyShowingSelected":[32],"activeOptionId":[32],"searchText":[32],"hasCustomDisplay":[32],"inputFocused":[32],"statusMessage":[32],"prioritizeSearch":[32]},[[0,"keydown","keydownHandler"],[0,"change","onHostElementChange"],[0,"input","onHostElementInput"],[0,"focus","delegateFocus"],[0,"focusout","handleFocusout"],[0,"click","clickHandler"]]]]],["p-ffb48ccc",[[1,"q2-dropdown",{"type":[513],"icon":[513],"label":[513],"hideLabel":[516,"hide-label"],"ariaLabel":[513,"aria-label"],"disabled":[516],"popDirection":[513,"pop-direction"],"name":[513],"context":[513],"contextValue":[513,"context-value"],"resolvedType":[513,"resolved-type"],"block":[516],"dropdownOpen":[32]},[[0,"focus","delegateFocus"]]]]],["p-7e8f43d1",[[1,"q2-editable-field",{"value":[1537],"editing":[1540],"label":[1537],"hideLabel":[1540,"hide-label"],"ariaLabel":[1537,"aria-label"],"type":[513],"formatModifier":[513,"format-modifier"],"truncated":[513],"maxlength":[514],"persistentLabel":[516,"persistent-label"],"disabled":[516],"hints":[16],"errors":[16]},[[0,"change","onHostElementChange"],[0,"focus","delegateFocus"]]]]],["p-97aa8423",[[1,"q2-pagination",{"recordType":[1,"record-type"],"perPage":[2,"per-page"],"total":[514],"page":[1538],"pages":[1538],"recordsOnly":[1540,"records-only"],"pagesOnly":[1540,"pages-only"],"isSmall":[32]},[[0,"focus","onHostElementFocus"]]]]],["p-0d8dd75a",[[1,"q2-pill",{"disabled":[516],"active":[1540],"open":[1540],"multiple":[516],"maxLength":[514,"max-length"],"label":[513],"value":[513],"theme":[513],"selectedOptions":[1040],"popoverMinHeight":[2,"popover-min-height"],"popoverDirection":[1,"popover-direction"],"hasOptions":[32]},[[0,"focus","delegateFocus"],[0,"popoverStateChanged","popoverStateHandler"]]]]],["p-041b3a82",[[1,"q2-tab-container",{"value":[1537],"type":[513],"name":[513],"color":[513],"noPrint":[516,"no-print"],"hasLeft":[32],"hasRight":[32],"scrollEnabled":[32],"showScrollLeft":[32],"showScrollRight":[32],"tabs":[32]},[[0,"change","defaultChangeHandler"],[9,"resize","onResize"],[0,"focus","onFocus"],[0,"badge","onBadge"]]]]],["p-2c9b1308",[[1,"q2-tag",{"open":[1540],"role":[513],"label":[513],"theme":[513],"popoverMinHeight":[2,"popover-min-height"],"popoverDirection":[1,"popover-direction"],"hasOptions":[32]},[[0,"focus","delegateFocus"],[0,"popoverStateChanged","popoverStateHandler"]]]]],["p-9ebb283a",[[4,"q2-carousel",{"autoPlay":[516,"auto-play"],"fullWidthPanes":[516,"full-width-panes"],"hidePagination":[516,"hide-pagination"],"showNavigationArrows":[516,"show-navigation-arrows"],"ariaLabel":[513,"aria-label"],"label":[513],"index":[1538],"universalCarouselOptions":[32],"fullWidthDisplayOptions":[32],"activePaneIndex":[32],"applyFocus":[32],"applyPaginationFocus":[32],"autoPlayInProgress":[32],"compactMode":[32],"carouselWrapperWidth":[32]},[[0,"change","onHostElementChange"],[0,"clickCarouselPane","carouselPaneClicked"],[0,"focus","delegateFocus"]]]]],["p-fc134a5d",[[1,"q2-month-picker",{"year":[1538],"disabledMonths":[16],"today":[1],"selectedIndex":[32],"focusedIndex":[32],"showYearLayer":[32]}]]],["p-9281adaa",[[1,"q2-section",{"label":[513],"collapsible":[516],"noCollapseIcon":[516,"no-collapse-icon"],"expanded":[1540],"contentHeight":[32],"hideContent":[32],"hasYieldedHeader":[32]},[[0,"change","defaultChangeHandler"],[0,"focus","delegateFocus"]]]]],["p-cbd1289a",[[1,"q2-stepper",{"currentStep":[1538,"current-step"],"stepCount":[1026,"step-count"],"lastEnabledStep":[1026,"last-enabled-step"],"scrollEnabled":[32],"showScrollLeft":[32],"showScrollRight":[32]},[[0,"change","defaultChangeHandler"],[0,"focus","delegateFocus"],[0,"statusChange","statusChangeHandler"]]]]],["p-e6d26f39",[[1,"q2-card",{"title":[513],"description":[513],"avatarName":[513,"avatar-name"],"avatarInitials":[513,"avatar-initials"],"avatarIcon":[513,"avatar-icon"],"avatarSrc":[513,"avatar-src"],"isSmall":[516,"is-small"],"bar":[513],"isStatic":[516,"is-static"],"isTouch":[516,"is-touch"],"url":[513],"target":[513],"isAutoTouch":[32],"isAutoSmall":[32]},[[0,"focus","onHostElementFocus"]]]]],["p-5f064e1e",[[1,"q2-chart-donut",{"chartName":[513,"chart-name"],"summaryIcon":[513,"summary-icon"],"summaryName":[513,"summary-name"],"innerRadius":[1025,"inner-radius"],"outerRadius":[1025,"outer-radius"],"minSliceSize":[1,"min-slice-size"],"selectedOffset":[2,"selected-offset"],"hoverScaleSize":[2,"hover-scale-size"],"format":[513],"isClickable":[516,"is-clickable"],"data":[16],"selectedId":[32],"hoveredId":[32],"selectById":[64],"selectByIndex":[64],"clearSelection":[64]},[[0,"focus","delegateFocus"]]]]],["p-89608314",[[1,"q2-checkbox",{"checked":[1540],"type":[513],"label":[1537],"hideLabel":[1540,"hide-label"],"ariaLabel":[1537,"aria-label"],"indeterminate":[516],"disabled":[516],"readonly":[516],"value":[513],"name":[513],"hasError":[516,"has-error"],"groupDisabled":[516,"group-disabled"],"alignment":[513],"description":[513]},[[0,"change","defaultChangeHandler"],[0,"focus","delegateFocus"]]]]],["p-f800fd1e",[[1,"q2-checkbox-group",{"label":[513],"value":[1040],"disabled":[516],"readonly":[516],"optional":[516],"hasError":[516,"has-error"]},[[0,"change","onHostElementChange"]]]]],["p-f1d06917",[[1,"q2-option",{"role":[513],"tabindex":[513],"display":[1025],"value":[513],"disabled":[516],"optionId":[513,"option-id"],"disabledGroup":[516,"disabled-group"],"selected":[516],"hidden":[516],"multiline":[516],"active":[516],"noSelect":[516,"_no-select"],"_multiSelectHidden":[516,"_multiselecthidden"]}]]],["p-ce015552",[[1,"q2-radio-group",{"label":[513],"value":[1025],"disabled":[516],"name":[513],"optional":[516],"readonly":[516],"tileLayout":[516,"tile-layout"],"tileAlignment":[513,"tile-alignment"],"hasError":[516,"has-error"],"tilelayout":[516]},[[0,"change","onHostElementChange"],[0,"focus","delegateFocus"],[0,"keydown","keydownHandler"]]]]],["p-416c97e4",[[1,"q2-stepper-vertical",{"currentStepId":[1537,"current-step-id"],"structuredPanes":[32]},[[0,"change","defaultChangeHandler"],[0,"focus","delegateFocus"],[0,"statusChange","statusChangeHandler"]]]]],["p-c3f27fe2",[[1,"q2-textarea",{"value":[1025],"label":[513],"hideLabel":[516,"hide-label"],"hideMessages":[516,"hide-messages"],"optional":[516],"placeholder":[513],"disabled":[516],"readonly":[516],"spellcheck":[516],"maxlength":[1538],"rows":[514],"cols":[514],"resize":[513],"errors":[16],"hints":[16],"hasFocus":[32],"downParams":[32]},[[0,"focus","onHostElementFocus"],[0,"change","onHostElementChange"]]]]],["p-2d2c5af2",[[4,"q2-carousel-pane",{"index":[2],"siblingCount":[2,"sibling-count"],"isActivePane":[516,"is-active-pane"],"label":[513]}]]],["p-6e6b5b80",[[0,"q2-loading-element",{"shape":[513],"width":[513],"height":[513],"borderRadius":[513,"border-radius"]}]]],["p-0ba564b1",[[1,"q2-loc",{"value":[513],"substitutions":[16]}]]],["p-0fad9c5a",[[1,"q2-optgroup",{"disabled":[516],"label":[513],"hidden":[32]}]]],["p-9772b15f",[[1,"q2-radio",{"label":[513],"hideLabel":[516,"hide-label"],"value":[513],"disabled":[516],"checked":[516],"name":[513],"ariaLabel":[513,"aria-label"],"groupDisabled":[4,"group-disabled"],"groupReadonly":[4,"group-readonly"],"groupTileLayout":[4,"group-tile-layout"]},[[0,"click","onHostClick"],[0,"focus","delegateFocus"]]]]],["p-c444a60b",[[1,"q2-stepper-pane",{"label":[513],"description":[513],"isActive":[516,"is-active"],"showWithChildren":[516,"show-with-children"],"status":[513],"isChildActive":[32]},[[0,"activeChange","checkForActiveChildren"]]]]],["p-e8e113c2",[[1,"q2-tab-pane",{"value":[513],"label":[513],"name":[513],"selected":[516],"badgeCount":[514,"badge-count"],"badgeDescription":[513,"badge-description"],"index":[2],"guid":[2]}]]],["p-73c12774",[[1,"q2-tooltip",{"label":[513],"block":[516],"multiline":[516],"persistent":[516],"immediate":[516],"position":[513],"focusClass":[32]},[[0,"keyup","keyUpHandler"],[2,"focus","focusHandler"],[0,"focusout","focusOutHandler"]]]]],["p-df91e954",[[1,"tecton-tab-pane",{"value":[513],"label":[513],"name":[513],"selected":[516],"index":[2],"guid":[2],"provided":[516],"url":[513],"moduleId":[513,"module-id"],"minHeight":[513,"min-height"],"badgeCount":[514,"badge-count"],"badgeDescription":[513,"badge-description"],"authPayload":[16],"showForm":[4,"show-form"],"_showForm":[32]}]]],["p-fb37e67e",[[1,"q2-dropdown-item",{"disabled":[516],"removable":[516],"separator":[516],"label":[513],"ariaLabel":[513,"aria-label"],"value":[513]},[[0,"focus","onHostElementFocus"]]]]],["p-e4aa271e",[[1,"q2-avatar",{"name":[513],"initials":[513],"src":[513],"icon":[1],"badSrc":[32],"isLoaded":[32]}]]],["p-b8b00394",[[1,"q2-message",{"type":[513],"appearance":[513],"description":[516],"presentToggle":[32],"present":[64]},[[0,"focus","delegateFocus"]]]]],["p-de164483",[[1,"q2-option-list",{"role":[513],"direction":[513],"customSearch":[516,"custom-search"],"noSelect":[516,"no-select"],"align":[513],"selectedOptions":[1040],"multiple":[516],"disabled":[516],"type":[1],"hasOptions":[32],"setDefaultActiveElement":[64],"setActiveElement":[64],"handleExternalKeydown":[64]},[[0,"focus","delegateFocus"],[0,"click","handleClick"]]],[1,"q2-popover",{"direction":[513],"align":[513],"open":[1540],"block":[516],"minHeight":[2,"min-height"],"controlElement":[16],"toggle":[64]},[[0,"popoverState","popoverStateHandler"]]]]],["p-a987402e",[[0,"click-elsewhere"]]],["p-16c11d74",[[1,"q2-btn",{"ariaExpanded":[1,"aria-expanded"],"ariaHasPopup":[1,"aria-has-popup"],"ariaControls":[1,"aria-controls"],"ariaSelected":[1,"aria-selected"],"label":[1537],"hideLabel":[1540,"hide-label"],"ariaLabel":[1537,"aria-label"],"tabIndex":[2,"tab-index"],"intent":[513],"color":[513],"disabled":[516],"type":[513],"loading":[516],"badge":[516],"active":[516],"fab":[516],"block":[516],"iconPosition":[32]},[[2,"click","disable"],[0,"focus","delegateFocus"]]],[1,"q2-loading",{"type":[513],"shape":[513],"modifiers":[513],"counts":[513],"label":[513],"ariaLabel":[513,"aria-label"],"inline":[516]}]]],["p-35177f6c",[[1,"q2-input",{"value":[1025],"label":[1537],"hideLabel":[1540,"hide-label"],"type":[513],"placeholder":[513],"disabled":[516],"autocomplete":[513],"autocorrect":[513],"autocapitalize":[513],"hideMessages":[516,"hide-messages"],"iconLeft":[513,"icon-left"],"iconRight":[513,"icon-right"],"readonly":[516],"clearable":[516],"optional":[516],"min":[514],"max":[514],"step":[514],"formatModifier":[513,"format-modifier"],"maxlength":[1538],"pseudo":[516],"showVisibilityToggle":[516,"show-visibility-toggle"],"textHidden":[1540,"text-hidden"],"badgeValue":[513,"badge-value"],"badgeTheme":[513,"badge-theme"],"ariaControls":[1,"aria-controls"],"role":[1],"ariaOwns":[1,"aria-owns"],"ariaLabel":[1537,"aria-label"],"ariaHaspopup":[1,"aria-haspopup"],"ariaExpanded":[1,"aria-expanded"],"ariaActivedescendant":[8,"aria-activedescendant"],"current":[1],"errors":[16],"hints":[16],"formattedValueObject":[32],"hasFocus":[32]},[[0,"focus","onHostElementFocus"],[0,"change","onHostElementChange"]]],[1,"q2-badge",{"value":[514],"maxLength":[514,"max-length"],"position":[513],"size":[513],"theme":[513],"status":[513]}]]]]'),e)));
|
|
1
|
+
import{p as e,b as a}from"./p-926a3e80.js";(()=>{const a=import.meta.url,l={};return""!==a&&(l.resourcesUrl=new URL(".",a).href),e(l)})().then((e=>a(JSON.parse('[["p-db873db2",[[1,"q2-icon",{"type":[513],"label":[513],"inline":[516]}]]],["p-0766a694",[[1,"q2-calendar",{"value":[1537],"label":[513],"hideLabel":[516,"hide-label"],"ariaLabel":[513,"aria-label"],"optional":[516],"disabled":[516],"readonly":[516],"invalid":[1540],"typeable":[516],"placeholder":[513],"buttonLabel":[513,"button-label"],"disabledMsg":[513,"disabled-msg"],"calendarLabel":[513,"calendar-label"],"disclaimer":[513],"displayFormat":[513,"display-format"],"startDate":[513,"start-date"],"endDate":[513,"end-date"],"cutoffTime":[513,"cutoff-time"],"daysOfWeekChecksum":[514,"days-of-week-checksum"],"popDirection":[513,"pop-direction"],"assume":[513],"errors":[1040],"invalidDates":[16],"validDates":[16],"onsuccess":[16],"dropdownOpen":[32],"keyboardSelection":[32],"typedValue":[32],"dateList":[32],"hintMessage":[32],"hintMessageType":[32]},[[0,"change","defaultChangeHandler"],[0,"error","defaultErrorHandler"],[0,"success","defaultSuccessHandler"],[0,"focus","delegateFocus"]]]]],["p-aaf42539",[[1,"q2-select",{"label":[1537],"hideLabel":[1540,"hide-label"],"value":[1025],"ariaLabel":[1537,"aria-label"],"selectedOptions":[1032,"selected-options"],"disabled":[516],"readonly":[516],"invalid":[516],"errors":[16],"multiple":[516],"minRows":[2,"min-rows"],"popDirection":[513,"pop-direction"],"searchable":[516],"multilineOptions":[516,"multiline-options"],"optional":[516],"dropdownOpen":[32],"onlyShowingSelected":[32],"activeOptionId":[32],"searchText":[32],"hasCustomDisplay":[32],"inputFocused":[32],"statusMessage":[32],"prioritizeSearch":[32]},[[0,"keydown","keydownHandler"],[0,"change","onHostElementChange"],[0,"input","onHostElementInput"],[0,"focus","delegateFocus"],[0,"focusout","handleFocusout"],[0,"click","clickHandler"]]]]],["p-ffb48ccc",[[1,"q2-dropdown",{"type":[513],"icon":[513],"label":[513],"hideLabel":[516,"hide-label"],"ariaLabel":[513,"aria-label"],"disabled":[516],"popDirection":[513,"pop-direction"],"name":[513],"context":[513],"contextValue":[513,"context-value"],"resolvedType":[513,"resolved-type"],"block":[516],"dropdownOpen":[32]},[[0,"focus","delegateFocus"]]]]],["p-7e8f43d1",[[1,"q2-editable-field",{"value":[1537],"editing":[1540],"label":[1537],"hideLabel":[1540,"hide-label"],"ariaLabel":[1537,"aria-label"],"type":[513],"formatModifier":[513,"format-modifier"],"truncated":[513],"maxlength":[514],"persistentLabel":[516,"persistent-label"],"disabled":[516],"hints":[16],"errors":[16]},[[0,"change","onHostElementChange"],[0,"focus","delegateFocus"]]]]],["p-97aa8423",[[1,"q2-pagination",{"recordType":[1,"record-type"],"perPage":[2,"per-page"],"total":[514],"page":[1538],"pages":[1538],"recordsOnly":[1540,"records-only"],"pagesOnly":[1540,"pages-only"],"isSmall":[32]},[[0,"focus","onHostElementFocus"]]]]],["p-0d8dd75a",[[1,"q2-pill",{"disabled":[516],"active":[1540],"open":[1540],"multiple":[516],"maxLength":[514,"max-length"],"label":[513],"value":[513],"theme":[513],"selectedOptions":[1040],"popoverMinHeight":[2,"popover-min-height"],"popoverDirection":[1,"popover-direction"],"hasOptions":[32]},[[0,"focus","delegateFocus"],[0,"popoverStateChanged","popoverStateHandler"]]]]],["p-041b3a82",[[1,"q2-tab-container",{"value":[1537],"type":[513],"name":[513],"color":[513],"noPrint":[516,"no-print"],"hasLeft":[32],"hasRight":[32],"scrollEnabled":[32],"showScrollLeft":[32],"showScrollRight":[32],"tabs":[32]},[[0,"change","defaultChangeHandler"],[9,"resize","onResize"],[0,"focus","onFocus"],[0,"badge","onBadge"]]]]],["p-2c9b1308",[[1,"q2-tag",{"open":[1540],"role":[513],"label":[513],"theme":[513],"popoverMinHeight":[2,"popover-min-height"],"popoverDirection":[1,"popover-direction"],"hasOptions":[32]},[[0,"focus","delegateFocus"],[0,"popoverStateChanged","popoverStateHandler"]]]]],["p-9ebb283a",[[4,"q2-carousel",{"autoPlay":[516,"auto-play"],"fullWidthPanes":[516,"full-width-panes"],"hidePagination":[516,"hide-pagination"],"showNavigationArrows":[516,"show-navigation-arrows"],"ariaLabel":[513,"aria-label"],"label":[513],"index":[1538],"universalCarouselOptions":[32],"fullWidthDisplayOptions":[32],"activePaneIndex":[32],"applyFocus":[32],"applyPaginationFocus":[32],"autoPlayInProgress":[32],"compactMode":[32],"carouselWrapperWidth":[32]},[[0,"change","onHostElementChange"],[0,"clickCarouselPane","carouselPaneClicked"],[0,"focus","delegateFocus"]]]]],["p-fc134a5d",[[1,"q2-month-picker",{"year":[1538],"disabledMonths":[16],"today":[1],"selectedIndex":[32],"focusedIndex":[32],"showYearLayer":[32]}]]],["p-9281adaa",[[1,"q2-section",{"label":[513],"collapsible":[516],"noCollapseIcon":[516,"no-collapse-icon"],"expanded":[1540],"contentHeight":[32],"hideContent":[32],"hasYieldedHeader":[32]},[[0,"change","defaultChangeHandler"],[0,"focus","delegateFocus"]]]]],["p-cbd1289a",[[1,"q2-stepper",{"currentStep":[1538,"current-step"],"stepCount":[1026,"step-count"],"lastEnabledStep":[1026,"last-enabled-step"],"scrollEnabled":[32],"showScrollLeft":[32],"showScrollRight":[32]},[[0,"change","defaultChangeHandler"],[0,"focus","delegateFocus"],[0,"statusChange","statusChangeHandler"]]]]],["p-e6d26f39",[[1,"q2-card",{"title":[513],"description":[513],"avatarName":[513,"avatar-name"],"avatarInitials":[513,"avatar-initials"],"avatarIcon":[513,"avatar-icon"],"avatarSrc":[513,"avatar-src"],"isSmall":[516,"is-small"],"bar":[513],"isStatic":[516,"is-static"],"isTouch":[516,"is-touch"],"url":[513],"target":[513],"isAutoTouch":[32],"isAutoSmall":[32]},[[0,"focus","onHostElementFocus"]]]]],["p-5f064e1e",[[1,"q2-chart-donut",{"chartName":[513,"chart-name"],"summaryIcon":[513,"summary-icon"],"summaryName":[513,"summary-name"],"innerRadius":[1025,"inner-radius"],"outerRadius":[1025,"outer-radius"],"minSliceSize":[1,"min-slice-size"],"selectedOffset":[2,"selected-offset"],"hoverScaleSize":[2,"hover-scale-size"],"format":[513],"isClickable":[516,"is-clickable"],"data":[16],"selectedId":[32],"hoveredId":[32],"selectById":[64],"selectByIndex":[64],"clearSelection":[64]},[[0,"focus","delegateFocus"]]]]],["p-89608314",[[1,"q2-checkbox",{"checked":[1540],"type":[513],"label":[1537],"hideLabel":[1540,"hide-label"],"ariaLabel":[1537,"aria-label"],"indeterminate":[516],"disabled":[516],"readonly":[516],"value":[513],"name":[513],"hasError":[516,"has-error"],"groupDisabled":[516,"group-disabled"],"alignment":[513],"description":[513]},[[0,"change","defaultChangeHandler"],[0,"focus","delegateFocus"]]]]],["p-f800fd1e",[[1,"q2-checkbox-group",{"label":[513],"value":[1040],"disabled":[516],"readonly":[516],"optional":[516],"hasError":[516,"has-error"]},[[0,"change","onHostElementChange"]]]]],["p-f1d06917",[[1,"q2-option",{"role":[513],"tabindex":[513],"display":[1025],"value":[513],"disabled":[516],"optionId":[513,"option-id"],"disabledGroup":[516,"disabled-group"],"selected":[516],"hidden":[516],"multiline":[516],"active":[516],"noSelect":[516,"_no-select"],"_multiSelectHidden":[516,"_multiselecthidden"]}]]],["p-ce015552",[[1,"q2-radio-group",{"label":[513],"value":[1025],"disabled":[516],"name":[513],"optional":[516],"readonly":[516],"tileLayout":[516,"tile-layout"],"tileAlignment":[513,"tile-alignment"],"hasError":[516,"has-error"],"tilelayout":[516]},[[0,"change","onHostElementChange"],[0,"focus","delegateFocus"],[0,"keydown","keydownHandler"]]]]],["p-18cc4758",[[1,"q2-stepper-vertical",{"currentStepId":[1537,"current-step-id"],"structuredPanes":[32]},[[0,"change","defaultChangeHandler"],[0,"focus","delegateFocus"],[0,"statusChange","statusChangeHandler"]]]]],["p-c3f27fe2",[[1,"q2-textarea",{"value":[1025],"label":[513],"hideLabel":[516,"hide-label"],"hideMessages":[516,"hide-messages"],"optional":[516],"placeholder":[513],"disabled":[516],"readonly":[516],"spellcheck":[516],"maxlength":[1538],"rows":[514],"cols":[514],"resize":[513],"errors":[16],"hints":[16],"hasFocus":[32],"downParams":[32]},[[0,"focus","onHostElementFocus"],[0,"change","onHostElementChange"]]]]],["p-2d2c5af2",[[4,"q2-carousel-pane",{"index":[2],"siblingCount":[2,"sibling-count"],"isActivePane":[516,"is-active-pane"],"label":[513]}]]],["p-6e6b5b80",[[0,"q2-loading-element",{"shape":[513],"width":[513],"height":[513],"borderRadius":[513,"border-radius"]}]]],["p-0ba564b1",[[1,"q2-loc",{"value":[513],"substitutions":[16]}]]],["p-0fad9c5a",[[1,"q2-optgroup",{"disabled":[516],"label":[513],"hidden":[32]}]]],["p-9772b15f",[[1,"q2-radio",{"label":[513],"hideLabel":[516,"hide-label"],"value":[513],"disabled":[516],"checked":[516],"name":[513],"ariaLabel":[513,"aria-label"],"groupDisabled":[4,"group-disabled"],"groupReadonly":[4,"group-readonly"],"groupTileLayout":[4,"group-tile-layout"]},[[0,"click","onHostClick"],[0,"focus","delegateFocus"]]]]],["p-c444a60b",[[1,"q2-stepper-pane",{"label":[513],"description":[513],"isActive":[516,"is-active"],"showWithChildren":[516,"show-with-children"],"status":[513],"isChildActive":[32]},[[0,"activeChange","checkForActiveChildren"]]]]],["p-e8e113c2",[[1,"q2-tab-pane",{"value":[513],"label":[513],"name":[513],"selected":[516],"badgeCount":[514,"badge-count"],"badgeDescription":[513,"badge-description"],"index":[2],"guid":[2]}]]],["p-73c12774",[[1,"q2-tooltip",{"label":[513],"block":[516],"multiline":[516],"persistent":[516],"immediate":[516],"position":[513],"focusClass":[32]},[[0,"keyup","keyUpHandler"],[2,"focus","focusHandler"],[0,"focusout","focusOutHandler"]]]]],["p-df91e954",[[1,"tecton-tab-pane",{"value":[513],"label":[513],"name":[513],"selected":[516],"index":[2],"guid":[2],"provided":[516],"url":[513],"moduleId":[513,"module-id"],"minHeight":[513,"min-height"],"badgeCount":[514,"badge-count"],"badgeDescription":[513,"badge-description"],"authPayload":[16],"showForm":[4,"show-form"],"_showForm":[32]}]]],["p-fb37e67e",[[1,"q2-dropdown-item",{"disabled":[516],"removable":[516],"separator":[516],"label":[513],"ariaLabel":[513,"aria-label"],"value":[513]},[[0,"focus","onHostElementFocus"]]]]],["p-e4aa271e",[[1,"q2-avatar",{"name":[513],"initials":[513],"src":[513],"icon":[1],"badSrc":[32],"isLoaded":[32]}]]],["p-b8b00394",[[1,"q2-message",{"type":[513],"appearance":[513],"description":[516],"presentToggle":[32],"present":[64]},[[0,"focus","delegateFocus"]]]]],["p-de164483",[[1,"q2-option-list",{"role":[513],"direction":[513],"customSearch":[516,"custom-search"],"noSelect":[516,"no-select"],"align":[513],"selectedOptions":[1040],"multiple":[516],"disabled":[516],"type":[1],"hasOptions":[32],"setDefaultActiveElement":[64],"setActiveElement":[64],"handleExternalKeydown":[64]},[[0,"focus","delegateFocus"],[0,"click","handleClick"]]],[1,"q2-popover",{"direction":[513],"align":[513],"open":[1540],"block":[516],"minHeight":[2,"min-height"],"controlElement":[16],"toggle":[64]},[[0,"popoverState","popoverStateHandler"]]]]],["p-a987402e",[[0,"click-elsewhere"]]],["p-16c11d74",[[1,"q2-btn",{"ariaExpanded":[1,"aria-expanded"],"ariaHasPopup":[1,"aria-has-popup"],"ariaControls":[1,"aria-controls"],"ariaSelected":[1,"aria-selected"],"label":[1537],"hideLabel":[1540,"hide-label"],"ariaLabel":[1537,"aria-label"],"tabIndex":[2,"tab-index"],"intent":[513],"color":[513],"disabled":[516],"type":[513],"loading":[516],"badge":[516],"active":[516],"fab":[516],"block":[516],"iconPosition":[32]},[[2,"click","disable"],[0,"focus","delegateFocus"]]],[1,"q2-loading",{"type":[513],"shape":[513],"modifiers":[513],"counts":[513],"label":[513],"ariaLabel":[513,"aria-label"],"inline":[516]}]]],["p-35177f6c",[[1,"q2-input",{"value":[1025],"label":[1537],"hideLabel":[1540,"hide-label"],"type":[513],"placeholder":[513],"disabled":[516],"autocomplete":[513],"autocorrect":[513],"autocapitalize":[513],"hideMessages":[516,"hide-messages"],"iconLeft":[513,"icon-left"],"iconRight":[513,"icon-right"],"readonly":[516],"clearable":[516],"optional":[516],"min":[514],"max":[514],"step":[514],"formatModifier":[513,"format-modifier"],"maxlength":[1538],"pseudo":[516],"showVisibilityToggle":[516,"show-visibility-toggle"],"textHidden":[1540,"text-hidden"],"badgeValue":[513,"badge-value"],"badgeTheme":[513,"badge-theme"],"ariaControls":[1,"aria-controls"],"role":[1],"ariaOwns":[1,"aria-owns"],"ariaLabel":[1537,"aria-label"],"ariaHaspopup":[1,"aria-haspopup"],"ariaExpanded":[1,"aria-expanded"],"ariaActivedescendant":[8,"aria-activedescendant"],"current":[1],"errors":[16],"hints":[16],"formattedValueObject":[32],"hasFocus":[32]},[[0,"focus","onHostElementFocus"],[0,"change","onHostElementChange"]]],[1,"q2-badge",{"value":[514],"maxLength":[514,"max-length"],"position":[513],"size":[513],"theme":[513],"status":[513]}]]]]'),e)));
|
|
@@ -46,6 +46,7 @@ export declare class Q2AdvancedStepper implements ComponentInterface {
|
|
|
46
46
|
onStepClick: (event: any, stepId: string) => void;
|
|
47
47
|
onStepKeyDown: (event: KeyboardEvent, stepId: string) => void;
|
|
48
48
|
renderStepBtn(pane: IStructuredPane, index: number): any;
|
|
49
|
+
renderSpacer(pane: IStructuredPane, stepLabel: string, isExpanded: boolean, isLastStep: boolean): any;
|
|
49
50
|
renderChildStepBtn(pane: IBaseStructuredPane, index: number, children: number, parentLabel: string): any;
|
|
50
51
|
render(): any;
|
|
51
52
|
}
|
|
File without changes
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "q2-tecton-elements",
|
|
3
|
-
"version": "1.21.
|
|
3
|
+
"version": "1.21.1",
|
|
4
4
|
"description": "Q2 Tecton Custom Elements",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.mjs",
|
|
@@ -49,5 +49,5 @@
|
|
|
49
49
|
"smoothscroll-polyfill": "^0.4.4",
|
|
50
50
|
"swiper": "8.4.4"
|
|
51
51
|
},
|
|
52
|
-
"gitHead": "
|
|
52
|
+
"gitHead": "fecd445cd097317c563c259e6e886fb716a61b8b"
|
|
53
53
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as t,c as e,h as a,F as r,g as i}from"./p-926a3e80.js";import{o as s,c as n,i as o,l as c}from"./p-5e374fbd.js";const l=class{constructor(a){t(this,a),this.change=e(this,"change",7),this.scheduledAfterRender=[],this.determinePaneChanges=t=>{t.forEach((t=>{var e,a;"childList"===t.type&&(t.addedNodes.length||t.removedNodes.length)&&((null===(e=t.addedNodes[0])||void 0===e?void 0:e.nodeType)!==Node.ELEMENT_NODE&&(null===(a=t.removedNodes[0])||void 0===a?void 0:a.nodeType)!==Node.ELEMENT_NODE||this.buildPaneList())}))},this.buildPaneList=()=>{const{allRootPanes:t}=this;t.length&&(this.structuredPanes=Array.from(t).reduce(((t,e)=>{var a,r;const i=Array.from(null!==(r=null===(a=e.querySelector("[slot=children]"))||void 0===a?void 0:a.children)&&void 0!==r?r:[]).filter((({tagName:t})=>"Q2-STEPPER-PANE"===t)).map(this.extractDetails);return t.push(Object.assign(Object.assign({},this.extractDetails(e)),{children:i})),t}),[]))},this.onStepClick=(t,e)=>{t.stopPropagation();const{currentStepId:a}=this;if(e===a)return;const r=this.allPanes.find((t=>t.id===e));this.change.emit({selectedStep:r,selectedStepId:e,currentStepId:a})},this.onStepKeyDown=(t,e)=>{const{key:a}=t;let r;switch(a){case"ArrowUp":case"ArrowLeft":t.preventDefault(),r=this.getStepId(e,"prev");break;case"ArrowDown":case"ArrowRight":t.preventDefault(),r=this.getStepId(e,"next");break;case"Home":t.preventDefault(),r=this.getStepId(e,"first");break;case"End":t.preventDefault(),r=this.getStepId(e,"last")}r&&this.focusStepBtn(r,!0)},this.currentStepId=void 0,this.structuredPanes=[]}componentWillLoad(){this.setDefaultPane(),this.buildPaneList();const t=new MutationObserver(this.determinePaneChanges),e={childList:!0};t.observe(this.hostElement,e),this.allRootPanes.forEach((a=>{const r=a.querySelector("[slot=children]");r&&t.observe(r,e)})),this.mutationObserver=t}componentDidLoad(){s(this.hostElement),setTimeout((()=>this.showStep(this.currentStepId)),0)}componentWillUpdate(){this.expandedStepChildrenList=null}componentDidRender(){this.scheduledAfterRender.forEach((t=>t())),this.scheduledAfterRender=[],this.openCurrentStepChildren()}disconnectedCallback(){this.mutationObserver.disconnect(),this.mutationObserver=null}get allRootPanes(){return Array.from(this.hostElement.querySelectorAll(":scope > q2-stepper-pane"))}get allPanes(){return Array.from(this.hostElement.querySelectorAll("q2-stepper-pane"))}setDefaultPane(){if(this.currentStepId)return;const t=this.hostElement.querySelector("q2-stepper-pane");t&&(t.id||(t.id=`step-${n()}`),this.currentStepId=t.id)}getStepId(t,e){const a=Array.from(this.hostElement.shadowRoot.querySelectorAll('ul:not([aria-hidden="true"]) > li > button:not([aria-disabled="true"])')),r=a.findIndex((e=>e.getAttribute("aria-controls")===t));let i;switch(e){case"prev":i=Math.max(r-1,0);break;case"next":i=Math.min(r+1,a.length-1);break;case"first":i=0;break;case"last":i=a.length-1}return a[i].getAttribute("aria-controls")}showStep(t){this.scheduledAfterRender.push(this.resizeIframe),this.showStepPane(t),this.focusStepBtn(t)}extractDetails(t){const{label:e,description:a,status:r}=t;return t.id||(t.id=`step-${n()}`),{id:t.id,label:e,description:a,status:r}}resizeIframe(){var t,e;return null===(e=null===(t=null===window||void 0===window?void 0:window.TectonElements)||void 0===t?void 0:t.resizeIframe)||void 0===e?void 0:e.call(t)}openCurrentStepChildren(){const{expandedStepChildrenList:t}=this;this.hostElement.shadowRoot.querySelectorAll(".spacer").forEach((e=>{if(t&&e.contains(t)){if(e.style.height=`${t.clientHeight}px`,e.classList.contains("is-open"))return;e.classList.add("is-opening"),e.addEventListener("transitionend",(()=>{e.classList.remove("is-opening"),e.classList.add("is-open"),this.resizeIframe()}),{once:!0})}else e.removeAttribute("style"),e.classList.remove("is-open","is-opening")}))}showStepPane(t){this.allPanes.forEach((e=>{(e.isActive||e.id===t)&&(e.isActive=t===e.id)}))}focusStepBtn(t,e){const a=this.hostElement.shadowRoot.querySelector(`button[aria-controls="${t}"]`),r=document.activeElement===this.hostElement;a&&(r||e)&&a.focus()}defaultChangeHandler(t){const{hostElement:e}=this;t.target===e&&!e.getAttribute("onchange")&&t.detail&&(this.currentStepId=t.detail.selectedStepId)}delegateFocus(t){o(t,this.hostElement)&&this.focusStepBtn(this.currentStepId,!0)}statusChangeHandler(){this.buildPaneList()}currentStepChanged(t){this.showStep(t)}renderStepBtn(t,e){const{currentStepId:r,structuredPanes:i}=this,s=e===i.length-1,{id:n,label:o,description:l,status:p}=t,d=e+1,b=n===r,h=o&&`label-${n}`,v="locked"===p,u=o&&c(o),f=o&&l&&`description-${n}`,g=!o&&c("tecton.element.advancedStepper.number",[`${d}`,`${i.length}`]);let m;"complete"===p?m="success-filled":"error"===p&&(m="warning-filled");const w=["step-btn"];p&&w.push(`status-${p}`);const x=t.children.map((t=>t.id)),y=b||x.includes(r);return a("li",{role:"presentation"},a("button",{class:w.join(" "),type:"button","aria-labelledby":h,"aria-describedBy":f,"aria-label":g,"aria-selected":`${b}`,"aria-expanded":t.children.length?`${y}`:null,"aria-controls":n,"aria-disabled":v?"true":null,role:"tab",tabIndex:b?0:-1,onKeyDown:t=>!v&&this.onStepKeyDown(t,n),onClick:t=>!v&&this.onStepClick(t,n)},m?a("div",{class:"step-icon"},a("q2-icon",{type:m})):a("div",{class:"step-bubble"},d),o&&a("div",null,a("div",{class:"step-label",id:h},u),l&&a("div",{class:"step-description",id:f},c(l)))),(s&&!!t.children.length||!s)&&a("div",{class:"spacer"},!!t.children.length&&a("ul",{ref:t=>y&&(this.expandedStepChildrenList=t),"aria-hidden":`${!y}`},t.children.map(((t,e,a)=>this.renderChildStepBtn(t,e,a.length,u))))))}renderChildStepBtn(t,e,r,i){const{currentStepId:s}=this,{id:n,label:o,status:l}=t,p=o&&`label-${n}`,d=n===s,b="locked"===l,h=!o&&c("tecton.element.advancedStepper.childNumber",[`${e+1}`,`${r}`,i]);let v;"error"===l&&(v="warning-filled");const u=["step-child-btn"];return l&&u.push(`status-${l}`),a("li",{role:"presentation"},a("button",{class:u.join(" "),type:"button","aria-labelledby":p,"aria-label":h,"aria-selected":`${d}`,"aria-controls":n,"aria-disabled":b?"true":null,role:"tab",tabIndex:d?0:-1,onKeyDown:t=>!b&&this.onStepKeyDown(t,n),onClick:t=>!b&&this.onStepClick(t,n)},v&&a("div",{class:"step-child-icon"},a("q2-icon",{type:v})),o&&a("div",{class:"step-child-label",id:p},c(o))))}render(){return a(r,null,a("ul",{role:"tablist"},this.structuredPanes.map(((t,e)=>this.renderStepBtn(t,e)))),a("div",null,a("slot",null)))}get hostElement(){return i(this)}static get watchers(){return{currentStepId:["currentStepChanged"]}}};l.style='*{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 #33b4ff #06C)}: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:grid;grid-template-columns:var(--tct-advanced-stepper-list-width, var(--t-advanced-stepper-list-width, 180px)) 1fr;gap:var(--tct-advanced-stepper-layout-gap, var(--t-advanced-stepper-layout-gap, 120px))}.step-label,.step-child-label{color:var(--comp-btn-label-color);font-size:var(--comp-btn-label-font-size);font-weight:var(--comp-label-font-weight, 400);height:1.5em}.step-label{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}[aria-selected=true] .step-label{font-weight:var(--tct-advanced-stepper-btn-active-font-weight, var(--t-advanced-stepper-btn-active-font-weight, 600))}[aria-describedby] .step-label{-webkit-line-clamp:1}.step-child-label{grid-area:content;color:var(--comp-btn-label-color)}.step-description{color:var(--tct-advanced-stepper-description-color, var(--t-advanced-stepper-description-color, var(--t-textA, rgba(77, 77, 77, 0.77))));font-size:var(--tct-advanced-stepper-description-font-size, var(--t-advanced-stepper-description-font-size, var(--app-font-size-small, 12px)));padding-bottom:0.2em}ul{--comp-top-btn-icon-size:var(--tct-advanced-stepper-btn-icon-size, var(--t-advanced-stepper-btn-icon-size, 24px));--comp-btn-icon-size:var(--comp-top-btn-icon-size);--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-3x, 15px)));--comp-btn-label-font-size:var-list(var-prefixer(advanced-stepper-btn-label-font-size), 16px);--comp-btn-label-color:var(--tct-advanced-stepper-label-color, var(--t-advanced-stepper-label-color, var(--t-text, #4d4d4d)));--comp-tween:var(--tct-advanced-stepper-tween, var(--t-advanced-stepper-tween, var(--app-tween-1, 0.2s ease)));list-style:none;margin:0;padding:0}ul ul{--comp-btn-icon-size:var(--tct-advanced-stepper-child-btn-icon-size, var(--t-advanced-stepper-child-btn-icon-size, 12px));--comp-btn-content-gap:var(--tct-advanced-stepper-btn-gap, var(--t-advanced-stepper-btn-gap, var(--app-scale-2x, 10px)));--comp-btn-label-font-size:var-list(\n var-prefixer(advanced-stepper-child-btn-label-font-size),\n --app-font-size-small,\n 12px\n )}ul ul[aria-hidden=true]{display:none}.step-btn,.step-child-btn{display:grid;grid-template-columns:var(--comp-btn-icon-size) 1fr;gap:var(--comp-btn-content-gap);text-align:var(--tct-advanced-stepper-btn-text-align, var(--t-advanced-stepper-btn-text-align, start));grid-template-areas:"icon content";align-items:center;width:100%;position:relative;background:transparent;border:0;cursor:pointer;padding:0;transition-property:box-shadow;outline:none}.step-btn[aria-disabled],.step-child-btn[aria-disabled]{cursor:default;--comp-label-font-weight:300;--comp-btn-label-color:var(--tct-advanced-stepper-btn-locked-color, var(--t-advanced-stepper-btn-locked-color, var(--t-textA, rgba(77, 77, 77, 0.77))))}.step-btn[aria-selected=true],.step-child-btn[aria-selected=true]{--comp-label-font-weight:600}.step-btn{min-height:var(--tct-advanced-stepper-btn-height, var(--t-advanced-stepper-btn-height, 40px));font-size:var(--tct-advanced-stepper-btn-font-size, var(--t-advanced-stepper-btn-font-size, 16px));--comp-active-color:var(--t-primary, #0079c1)}.step-btn.status-complete{--comp-active-color:var(--const-stoplight-success, #0e8a00)}.step-btn.status-error{--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-btn.status-locked{cursor:not-allowed}.step-child-btn{--comp-active-color:var(--t-primary, #0079c1);min-height:var(--tct-advanced-stepper-child-btn-height, var(--t-advanced-stepper-child-btn-height, 30px));padding-left:var(--tct-advanced-stepper-child-btn-left-padding, var(--t-advanced-stepper-child-btn-left-padding, var(--app-scale-2x, 10px)));font-size:var(--tct-advanced-stepper-child-btn-font-size, var(--t-advanced-stepper-child-btn-font-size, 12px));border-left-width:var(--tct-advanced-stepper-child-btn-left-border-width, var(--t-advanced-stepper-child-btn-left-border-width, 3px));border-left-style:var(--tct-advanced-stepper-child-btn-left-border-style, var(--t-advanced-stepper-child-btn-left-border-style, solid));border-left-color:transparent}.step-child-btn[aria-selected=true]{--comp-btn-label-color:var(--comp-active-color);border-left-color:var(--comp-active-color)}.step-child-btn.status-error{--comp-btn-label-color:var(--const-stoplight-alert, #c30000);--comp-active-color:var(--const-stoplight-alert, #c30000)}.step-child-btn.status-locked{cursor:not-allowed}.step-content{grid-area:content}.step-icon,.step-bubble,.step-child-icon{grid-area:icon;width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);line-height:0}.step-icon q2-icon,.step-bubble q2-icon,.step-child-icon q2-icon{width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);--tct-icon-fill:var(--comp-active-color)}.step-icon,.step-bubble{background:var(--t-primary, #0079c1);color:var(--t-base, #ffffff);border-radius:50%}.status-complete .step-icon,.status-error .step-icon,.status-complete .step-bubble,.status-error .step-bubble{background:var(--comp-active-color)}.step-icon q2-icon,.step-bubble q2-icon{--tct-icon-fill:var(--comp-active-color)}.step-icon q2-icon:before,.step-bubble q2-icon:before{content:"";display:block;background:var(--t-base, #ffffff);position:absolute;width:80%;height:80%;left:11%;top:11%;border-radius:50%}.status-locked .step-icon,.status-locked .step-bubble{background:var(--t-gray-12, #d9d9d9);color:var(--t-text, #4d4d4d)}[aria-selected=true] .step-icon,[aria-selected=true] .step-bubble{box-shadow:0 0 0 2px var(--t-base, #ffffff), 0 0 0 4px var(--comp-active-color)}.step-bubble{display:flex;justify-content:center;align-items:center;line-height:0}.step-child-icon q2-icon{--tct-icon-stroke-primary:var(--comp-active-color);--tct-icon-stroke-secondary:var(--comp-active-color)}[aria-selected=true] .step-child-icon q2-icon{fill:var(--comp-active-color);--tct-icon-stroke-secondary:var(--t-base, #ffffff)}.spacer{height:var(--tct-advanced-stepper-spacer-height, var(--t-advanced-stepper-spacer-height, var(--app-scale-6x, 30px)));border-left-width:var(--tct-advanced-stepper-child-border-width, var(--t-advanced-stepper-child-border-width, 1px));border-left-style:var(--tct-advanced-stepper-child-border-style, var(--t-advanced-stepper-child-border-style, solid));border-left-color:var(--tct-advanced-stepper-child-border-color, var(--t-advanced-stepper-child-border-color, var(--t-gray-12, #d9d9d9)));overflow:hidden;margin-left:calc(var(--comp-top-btn-icon-size) / 2);transition:height var(--comp-tween)}.spacer ul{opacity:0;transition:opacity var(--comp-tween)}.spacer.is-opening ul,.spacer.is-open ul{display:block;opacity:1 !important}.spacer.is-open{overflow:visible}';export{l as q2_stepper_vertical}
|