@lmvz-ds/components 0.39.0 → 0.40.0
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/CHANGELOG.md +6 -0
- package/cjs/lmvz-components.cjs.js +1 -1
- package/cjs/lmvz-tab.cjs.entry.js +3 -3
- package/cjs/lmvz-tabs.cjs.entry.js +37 -44
- package/cjs/loader.cjs.js +1 -1
- package/collection/components/lmvz-tab/lmvz-tab.css +0 -13
- package/collection/components/lmvz-tab/lmvz-tab.js +10 -14
- package/collection/components/lmvz-tabs/lmvz-tabs.css +0 -5
- package/collection/components/lmvz-tabs/lmvz-tabs.js +45 -66
- package/components/lmvz-tab.js +1 -1
- package/components/lmvz-tabs.js +1 -1
- package/esm/lmvz-components.js +1 -1
- package/esm/lmvz-tab.entry.js +3 -3
- package/esm/lmvz-tabs.entry.js +37 -44
- package/esm/loader.js +1 -1
- package/hydrate/index.js +44 -52
- package/hydrate/index.mjs +44 -52
- package/lmvz-components/lmvz-components.esm.js +1 -1
- package/lmvz-components/p-143e9621.entry.js +1 -0
- package/lmvz-components/p-220e455e.entry.js +1 -0
- package/manifest.json +37 -68
- package/package.json +1 -1
- package/types/components/lmvz-tab/lmvz-tab.d.ts +1 -1
- package/types/components/lmvz-tabs/lmvz-tabs.d.ts +7 -8
- package/types/components.d.ts +17 -28
- package/lmvz-components/p-1ba1af8d.entry.js +0 -1
- package/lmvz-components/p-3b7203a3.entry.js +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -19,7 +19,7 @@ var patchBrowser = () => {
|
|
|
19
19
|
|
|
20
20
|
patchBrowser().then(async (options) => {
|
|
21
21
|
await appGlobals.globalScripts();
|
|
22
|
-
return index.bootstrapLazy([["lmvz-datepicker.cjs",[[593,"lmvz-datepicker",{"value":[6145],"visibleMonth":[6145,"visible-month"],"min":[1],"max":[1],"locale":[1],"firstDayOfWeek":[2,"first-day-of-week"],"disabled":[516],"readonly":[516],"required":[516],"name":[513],"label":[1],"placeholder":[1],"helperText":[1,"helper-text"],"errorMessage":[1,"error-message"],"open":[1540],"displayFormat":[1,"display-format"],"focusedDate":[32],"valueDate":[32],"visibleMonthDate":[32],"inputText":[32],"hasUnparseableInput":[32],"isInvalid":[32],"nativeError":[32],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"],[0,"focusin","handleInputFocus"],[0,"click","handleInputFocus"],[0,"invalid","handleInvalid"]],{"required":[{"handleValidityRelevantPropChange":0}],"min":[{"handleValidityRelevantPropChange":0}],"max":[{"handleValidityRelevantPropChange":0}],"locale":[{"handleDisplayFormatChange":0}],"displayFormat":[{"handleDisplayFormatChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-message.cjs",[[769,"lmvz-message",{"type":[513],"live":[1],"leadingIcon":[4,"leading-icon"],"dismissible":[4],"closeLabel":[1,"close-label"],"actionLabel":[1,"action-label"]}]]],["lmvz-select.cjs",[[838,"lmvz-select",{"value":[1025],"multiple":[516],"values":[1040],"label":[1],"helperText":[1,"helper-text"],"error":[6660],"errorMessage":[1,"error-message"],"disabled":[516],"required":[516],"name":[513],"size":[513],"nativeError":[32],"selectedLabel":[32],"selectedId":[32],"activeId":[32],"isOpen":[32],"optionGroups":[32],"focusTrigger":[64],"blurTrigger":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"]],{"value":[{"handleValueChange":0}],"values":[{"handleValuesChange":0}],"required":[{"handleRequiredChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-snackbar.cjs",[[513,"lmvz-snackbar",{"status":[1537],"message":[1025],"duration":[1026],"priority":[1025],"actionLabel":[1025,"action-label"],"animationClass":[32],"show":[64],"hide":[64]},null,{"status":[{"onStatusChange":0}]}]]],["lmvz-link.cjs",[[785,"lmvz-link",{"href":[513],"target":[513],"rel":[1],"type":[1537],"externalLabel":[1,"external-label"]},null,{"type":[{"normalizeType":0}]}]]],["lmvz-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"],"initFocus":[64]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["lmvz-action-list.cjs",[[774,"lmvz-action-list",{"label":[1],"initFocus":[64]}]]],["lmvz-card.cjs",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox.cjs",[[578,"lmvz-checkbox",{"label":[1],"checked":[1540],"value":[1],"name":[513],"disabled":[516],"required":[516],"error":[6660],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"nativeError":[32],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"]],{"checked":[{"handleCheckedChange":0}],"required":[{"handleRequiredChange":0}]}]]],["lmvz-menuitem.cjs",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-radio.cjs",[[578,"lmvz-radio",{"label":[1],"checked":[1540],"value":[1],"name":[513],"disabled":[516],"required":[516],"error":[6660],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"nativeError":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"],[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"required":[{"handleRequiredChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-spinner.cjs",[[513,"lmvz-spinner",{"size":[513],"ariaLabel":[513,"aria-label"]}]]],["lmvz-tab.cjs",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"
|
|
22
|
+
return index.bootstrapLazy([["lmvz-datepicker.cjs",[[593,"lmvz-datepicker",{"value":[6145],"visibleMonth":[6145,"visible-month"],"min":[1],"max":[1],"locale":[1],"firstDayOfWeek":[2,"first-day-of-week"],"disabled":[516],"readonly":[516],"required":[516],"name":[513],"label":[1],"placeholder":[1],"helperText":[1,"helper-text"],"errorMessage":[1,"error-message"],"open":[1540],"displayFormat":[1,"display-format"],"focusedDate":[32],"valueDate":[32],"visibleMonthDate":[32],"inputText":[32],"hasUnparseableInput":[32],"isInvalid":[32],"nativeError":[32],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"],[0,"focusin","handleInputFocus"],[0,"click","handleInputFocus"],[0,"invalid","handleInvalid"]],{"required":[{"handleValidityRelevantPropChange":0}],"min":[{"handleValidityRelevantPropChange":0}],"max":[{"handleValidityRelevantPropChange":0}],"locale":[{"handleDisplayFormatChange":0}],"displayFormat":[{"handleDisplayFormatChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-message.cjs",[[769,"lmvz-message",{"type":[513],"live":[1],"leadingIcon":[4,"leading-icon"],"dismissible":[4],"closeLabel":[1,"close-label"],"actionLabel":[1,"action-label"]}]]],["lmvz-select.cjs",[[838,"lmvz-select",{"value":[1025],"multiple":[516],"values":[1040],"label":[1],"helperText":[1,"helper-text"],"error":[6660],"errorMessage":[1,"error-message"],"disabled":[516],"required":[516],"name":[513],"size":[513],"nativeError":[32],"selectedLabel":[32],"selectedId":[32],"activeId":[32],"isOpen":[32],"optionGroups":[32],"focusTrigger":[64],"blurTrigger":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"]],{"value":[{"handleValueChange":0}],"values":[{"handleValuesChange":0}],"required":[{"handleRequiredChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-snackbar.cjs",[[513,"lmvz-snackbar",{"status":[1537],"message":[1025],"duration":[1026],"priority":[1025],"actionLabel":[1025,"action-label"],"animationClass":[32],"show":[64],"hide":[64]},null,{"status":[{"onStatusChange":0}]}]]],["lmvz-link.cjs",[[785,"lmvz-link",{"href":[513],"target":[513],"rel":[1],"type":[1537],"externalLabel":[1,"external-label"]},null,{"type":[{"normalizeType":0}]}]]],["lmvz-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"],"initFocus":[64]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["lmvz-action-list.cjs",[[774,"lmvz-action-list",{"label":[1],"initFocus":[64]}]]],["lmvz-card.cjs",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox.cjs",[[578,"lmvz-checkbox",{"label":[1],"checked":[1540],"value":[1],"name":[513],"disabled":[516],"required":[516],"error":[6660],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"nativeError":[32],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"]],{"checked":[{"handleCheckedChange":0}],"required":[{"handleRequiredChange":0}]}]]],["lmvz-menuitem.cjs",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-radio.cjs",[[578,"lmvz-radio",{"label":[1],"checked":[1540],"value":[1],"name":[513],"disabled":[516],"required":[516],"error":[6660],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"nativeError":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"],[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"required":[{"handleRequiredChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-spinner.cjs",[[513,"lmvz-spinner",{"size":[513],"ariaLabel":[513,"aria-label"]}]]],["lmvz-tab.cjs",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"panel":[513]}]]],["lmvz-tabs.cjs",[[769,"lmvz-tabs",{"value":[1537],"resolvedValue":[32],"initFocus":[64],"activateTab":[64],"getTabElements":[64],"setTabPanelIds":[64]},[[0,"slotchange","handleSlotChangeEvent"]],{"value":[{"handleValueChange":0}]}]]],["lmvz-toggle.cjs",[[578,"lmvz-toggle",{"label":[1],"checked":[1540],"disabled":[516],"required":[516],"name":[1],"value":[1],"form":[1],"focusToggle":[64],"blurToggle":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button-group.cjs",[[769,"lmvz-button-group",{"stacked":[516],"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-chip.cjs",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-input.cjs",[[838,"lmvz-input",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"placeholder":[1],"disabled":[516],"readonly":[516],"required":[516],"name":[1],"type":[1],"errorMessage":[1,"error-message"],"autocomplete":[1],"inputmode":[1],"autocorrect":[1],"autocapitalize":[1],"spellcheck":[4],"autofocus":[4],"minlength":[2],"maxlength":[2],"pattern":[1],"min":[8],"max":[8],"step":[8],"form":[1],"size":[513],"error":[6660],"nativeError":[32],"setValue":[64],"focusInput":[64],"blurInput":[64],"select":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-popover.cjs",[[769,"lmvz-popover",{"open":[1540],"anchor":[1],"placement":[1],"size":[1],"autoFocus":[4,"auto-focus"],"containerRole":[1,"container-role"],"label":[1],"anchorEl":[32],"show":[64],"hide":[64],"toggle":[64]},null,{"open":[{"handleOpenChange":0}],"anchor":[{"handleAnchorChange":1}]}]]],["lmvz-button_2.cjs",[[785,"lmvz-button",{"ti":[514,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1],"buttonRole":[1,"button-role"]}],[514,"lmvz-icon",{"icon":[513],"weight":[513],"size":[513],"iconset":[513],"ariaLabel":[513,"aria-label"],"iconData":[32],"visible":[32]},null,{"icon":[{"loadIconPathData":0}],"iconset":[{"loadIconPathData":0}]}]]]], options);
|
|
23
23
|
});
|
|
24
24
|
|
|
25
25
|
exports.setNonce = index.setNonce;
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var index = require('./index-DWy4nuyZ.js');
|
|
4
4
|
|
|
5
|
-
const lmvzTabCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } hr { height: 0; border: none; margin: var(--lmvz-dimension-8-4, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0; border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0); } fieldset { border: none; margin: 0; padding: 0; } legend { padding: 0; display: block; } } :host { display: inline-block; flex: none; } :host([disabled]) { cursor: not-allowed; pointer-events: none; } button { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary, #000000); --lmvz-tab-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--lmvz-component-component-spacing-0-default, 4px); padding-top: var(--lmvz-dimension-12-8, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); padding-bottom: var(--lmvz-dimension-14-8, clamp(0.5rem, 0.41rem + 0.39vw, 0.88rem)); padding-inline: var(--lmvz-dimension-24-16, clamp(1rem, 0.88rem + 0.52vw, 1.5rem)); border: none; border-radius: var(--lmvz-semantic-border-radius-round, 999px); background: var(--lmvz-tab-background); color: var(--lmvz-tab-color); font: var(--lmvz-typography-body-md-strong, 500 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); cursor: pointer; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease; } button:focus-visible { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); z-index: 1; } button:disabled { opacity: var(--lmvz-component-input-disabled-opacity, 40%); pointer-events: none; cursor: not-allowed; } button:hover { --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-hover, #000000); } button:active { --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } :host([has-media]) { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary, #000000); --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); } :host([has-media]) button { padding-top: var(--lmvz-dimension-18-16, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); padding-bottom: var(--lmvz-dimension-14-12, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); padding-inline: var(--lmvz-dimension-48-40, clamp(2.5rem, 2.38rem + 0.52vw, 3rem)); border-radius: var(--lmvz-semantic-border-radius-lg, 14px); } :host([has-media]) button:hover { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } :host([has-media]) button:active { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } :host([selected]) button { --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --lmvz-tab-background: var(--lmvz-semantic-color-status-active, #f6fbfe); } :host([selected][has-media]) button:hover, :host([selected][has-media]) button:active { --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); } .indicator { --lmvz-tab-indicator-size: 4px; position: absolute; background: linear-gradient(to right, var(--lmvz-semantic-color-gradient-main-1, #0e7ab4), var(--lmvz-semantic-color-gradient-main-2, #0e7ab4)); opacity: 0; transition: opacity 0.15s ease;
|
|
5
|
+
const lmvzTabCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } hr { height: 0; border: none; margin: var(--lmvz-dimension-8-4, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0; border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0); } fieldset { border: none; margin: 0; padding: 0; } legend { padding: 0; display: block; } } :host { display: inline-block; flex: none; } :host([disabled]) { cursor: not-allowed; pointer-events: none; } button { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary, #000000); --lmvz-tab-background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--lmvz-component-component-spacing-0-default, 4px); padding-top: var(--lmvz-dimension-12-8, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); padding-bottom: var(--lmvz-dimension-14-8, clamp(0.5rem, 0.41rem + 0.39vw, 0.88rem)); padding-inline: var(--lmvz-dimension-24-16, clamp(1rem, 0.88rem + 0.52vw, 1.5rem)); border: none; border-radius: var(--lmvz-semantic-border-radius-round, 999px); background: var(--lmvz-tab-background); color: var(--lmvz-tab-color); font: var(--lmvz-typography-body-md-strong, 500 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router); cursor: pointer; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease; } button:focus-visible { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); z-index: 1; } button:disabled { opacity: var(--lmvz-component-input-disabled-opacity, 40%); pointer-events: none; cursor: not-allowed; } button:hover { --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0); --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-hover, #000000); } button:active { --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0); --lmvz-tab-color: var(--lmvz-semantic-color-int-on-secondary-active, #000000); } :host([has-media]) { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary, #000000); --lmvz-tab-background: var(--lmvz-semantic-color-int-tertiary, #ffffff); } :host([has-media]) button { padding-top: var(--lmvz-dimension-18-16, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); padding-bottom: var(--lmvz-dimension-14-12, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); padding-inline: var(--lmvz-dimension-48-40, clamp(2.5rem, 2.38rem + 0.52vw, 3rem)); border-radius: var(--lmvz-semantic-border-radius-lg, 14px); } :host([has-media]) button:hover { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-hover, #000000); } :host([has-media]) button:active { --lmvz-tab-color: var(--lmvz-semantic-color-int-on-tertiary-active, #000000); } :host([selected]) button { --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --lmvz-tab-background: var(--lmvz-semantic-color-status-active, #f6fbfe); } :host([selected][has-media]) button:hover, :host([selected][has-media]) button:active { --lmvz-tab-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); } .indicator { --lmvz-tab-indicator-size: 4px; position: absolute; background: linear-gradient(to right, var(--lmvz-semantic-color-gradient-main-1, #0e7ab4), var(--lmvz-semantic-color-gradient-main-2, #0e7ab4)); opacity: 0; transition: opacity 0.15s ease; inset-block-end: 0; inset-inline: 0; block-size: var(--lmvz-tab-indicator-size); border-start-start-radius: 0; border-start-end-radius: 0; border-end-start-radius: var(--lmvz-tab-indicator-size); border-end-end-radius: var(--lmvz-tab-indicator-size); } :host([selected][has-media]) .indicator { opacity: 1; } ::slotted(*) { --lmvz-component-color: var(--lmvz-tab-color); } ::slotted(lmvz-icon) { --lmvz-component-size: var(--lmvz-dimension-18-16, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); } :host([has-media]) ::slotted(lmvz-icon) { --lmvz-component-size: var(--lmvz-component-icon-size-lg, clamp(1.25rem, 1.19rem + 0.26vw, 1.5rem)); } .label { display: contents; } `;
|
|
6
6
|
|
|
7
7
|
const LmvzTab = class {
|
|
8
8
|
constructor(hostRef) {
|
|
@@ -13,7 +13,7 @@ const LmvzTab = class {
|
|
|
13
13
|
value;
|
|
14
14
|
disabled = false;
|
|
15
15
|
selected = false;
|
|
16
|
-
|
|
16
|
+
panel;
|
|
17
17
|
handleMediaSlotChange = () => {
|
|
18
18
|
this.el.toggleAttribute('has-media', (this.mediaSlotEl?.assignedElements() ?? []).length > 0);
|
|
19
19
|
};
|
|
@@ -22,7 +22,7 @@ const LmvzTab = class {
|
|
|
22
22
|
this.el.dispatchEvent(new CustomEvent('lmvzTabReady', { bubbles: true, composed: false }));
|
|
23
23
|
}
|
|
24
24
|
render() {
|
|
25
|
-
return (index.h(index.Host, { key: '
|
|
25
|
+
return (index.h(index.Host, { key: '8fb0ddc827d31fa1669a7fdaef288be5002a7c53' }, index.h("button", { key: '72b8f8be2f7ec7d0d2840148d48188382699d9b9', part: "button", role: "tab", disabled: this.disabled, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: 0 }, index.h("slot", { key: 'c951ae74e7b15feff7f32bc87b2e3fd46221b6b4', name: "media", ref: (el) => (this.mediaSlotEl = el), onSlotchange: this.handleMediaSlotChange }), index.h("span", { key: '8a06f3a9598bbf90819ff3644874f53b1ed9f840', class: "label" }, index.h("slot", { key: '98217fca2371ad7b0ded79628895337603a54c2f' })), index.h("span", { key: '68a11cf2f3d51aa6f4b9a7d2efcce1a1bb0c7640', "aria-hidden": "true", part: "indicator", class: "indicator" }))));
|
|
26
26
|
}
|
|
27
27
|
static get delegatesFocus() { return true; }
|
|
28
28
|
};
|
|
@@ -6,7 +6,7 @@ var reactiveControllerHost = require('./reactive-controller-host-Bc6B_T45.js');
|
|
|
6
6
|
require('./element.util-BlhcwmfR.js');
|
|
7
7
|
require('./aria.constants-DPK5mQEL.js');
|
|
8
8
|
|
|
9
|
-
const lmvzTabsCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } hr { height: 0; border: none; margin: var(--lmvz-dimension-8-4, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0; border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0); } fieldset { border: none; margin: 0; padding: 0; } legend { padding: 0; display: block; } } :host { display: inline-block; } .tablist { display: inline-flex; flex-direction: row; background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); border-radius: var(--lmvz-semantic-border-radius-round, 999px); overflow: auto hidden; scrollbar-width: none; } .tablist::-webkit-scrollbar { display: none; } :host([has-icon-tabs]) .tablist { gap: var(--lmvz-dimension-8-6, clamp(0.38rem, 0.34rem + 0.13vw, 0.5rem)); background: none; border-radius: 0; }
|
|
9
|
+
const lmvzTabsCss = () => ` @layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.reset { body { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; } *[hidden] { display: none !important; } hr { height: 0; border: none; margin: var(--lmvz-dimension-8-4, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)) 0; border-top: var(--lmvz-semantic-border-width-default, 1px) solid var(--lmvz-semantic-color-border-subtle, #f0f0f0); } fieldset { border: none; margin: 0; padding: 0; } legend { padding: 0; display: block; } } :host { display: inline-block; } .tablist { display: inline-flex; flex-direction: row; background: var(--lmvz-semantic-color-int-secondary, #f0f0f0); border-radius: var(--lmvz-semantic-border-radius-round, 999px); overflow: auto hidden; scrollbar-width: none; } .tablist::-webkit-scrollbar { display: none; } :host([has-icon-tabs]) .tablist { gap: var(--lmvz-dimension-8-6, clamp(0.38rem, 0.34rem + 0.13vw, 0.5rem)); background: none; border-radius: 0; } ::slotted([role='tabpanel']) { display: block; } ::slotted([role='tabpanel'][hidden]) { display: none; } `;
|
|
10
10
|
|
|
11
11
|
let tabsIdCounter = 0;
|
|
12
12
|
const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
@@ -22,7 +22,6 @@ const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
22
22
|
listenerTarget: this.tablistEl,
|
|
23
23
|
});
|
|
24
24
|
value;
|
|
25
|
-
orientation = 'horizontal';
|
|
26
25
|
lmvzChange;
|
|
27
26
|
resolvedValue;
|
|
28
27
|
constructor(hostRef) {
|
|
@@ -33,12 +32,11 @@ const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
33
32
|
}
|
|
34
33
|
componentWillLoad() {
|
|
35
34
|
super.componentWillLoad();
|
|
36
|
-
this.syncOrientation();
|
|
37
35
|
}
|
|
38
36
|
componentDidLoad() {
|
|
39
|
-
this.tabSlotEl?.addEventListener('slotchange', this.handleTabSlotChange);
|
|
40
|
-
this.panelSlotEl?.addEventListener('slotchange', this.handlePanelSlotChange);
|
|
41
|
-
this.el.addEventListener('lmvzTabReady', this.handleTabReady);
|
|
37
|
+
this.tabSlotEl?.addEventListener('slotchange', this.handleTabSlotChange.bind(this));
|
|
38
|
+
this.panelSlotEl?.addEventListener('slotchange', this.handlePanelSlotChange.bind(this));
|
|
39
|
+
this.el.addEventListener('lmvzTabReady', this.handleTabReady.bind(this));
|
|
42
40
|
this.handleTabSlotChange();
|
|
43
41
|
if (this.tablistEl) {
|
|
44
42
|
this.focusController.updateListenerTarget(this.tablistEl);
|
|
@@ -46,17 +44,16 @@ const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
46
44
|
super.componentDidLoad();
|
|
47
45
|
}
|
|
48
46
|
disconnectedCallback() {
|
|
49
|
-
this.el.removeEventListener('lmvzTabReady', this.handleTabReady);
|
|
47
|
+
this.el.removeEventListener('lmvzTabReady', this.handleTabReady.bind(this));
|
|
50
48
|
super.disconnectedCallback();
|
|
51
49
|
}
|
|
50
|
+
handleSlotChangeEvent() {
|
|
51
|
+
this.wireAriaIds();
|
|
52
|
+
this.applySelection(this.resolvedValue ?? this.value);
|
|
53
|
+
}
|
|
52
54
|
handleValueChange(newValue) {
|
|
53
55
|
this.applySelection(newValue);
|
|
54
56
|
}
|
|
55
|
-
handleOrientationChange() {
|
|
56
|
-
this.syncOrientation();
|
|
57
|
-
this.syncFocusTargets();
|
|
58
|
-
this.syncTabOrientation();
|
|
59
|
-
}
|
|
60
57
|
async initFocus() {
|
|
61
58
|
this.focusController.initFocus();
|
|
62
59
|
}
|
|
@@ -96,23 +93,22 @@ const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
96
93
|
get slottedPanels() {
|
|
97
94
|
return (this.panelSlotEl?.assignedElements({ flatten: false }) ?? []);
|
|
98
95
|
}
|
|
99
|
-
handleTabSlotChange
|
|
96
|
+
handleTabSlotChange() {
|
|
100
97
|
this.syncFocusTargets();
|
|
101
|
-
this.syncTabOrientation();
|
|
102
98
|
this.wireAriaIds();
|
|
103
99
|
this.applySelection(this.value);
|
|
104
100
|
this.updateIconTabsAttr();
|
|
105
|
-
}
|
|
106
|
-
handlePanelSlotChange
|
|
101
|
+
}
|
|
102
|
+
handlePanelSlotChange() {
|
|
107
103
|
this.wireAriaIds();
|
|
108
104
|
this.applySelection(this.resolvedValue ?? this.value);
|
|
109
|
-
}
|
|
110
|
-
handleTabReady
|
|
105
|
+
}
|
|
106
|
+
handleTabReady() {
|
|
111
107
|
this.syncFocusTargets();
|
|
112
108
|
this.wireAriaIds();
|
|
113
109
|
this.applySelection(this.resolvedValue ?? this.value);
|
|
114
110
|
this.updateIconTabsAttr();
|
|
115
|
-
}
|
|
111
|
+
}
|
|
116
112
|
updateIconTabsAttr() {
|
|
117
113
|
this.el.toggleAttribute('has-icon-tabs', this.slottedTabs.some((t) => t.hasAttribute('has-media')));
|
|
118
114
|
}
|
|
@@ -120,34 +116,31 @@ const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
120
116
|
const buttons = this.slottedTabs.map((tab) => tab.shadowRoot?.querySelector('button')).filter((b) => !!b);
|
|
121
117
|
this.focusController.updateElements(buttons);
|
|
122
118
|
}
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
enableHomeAndEnd: true,
|
|
130
|
-
listenerTarget: this.tablistEl,
|
|
131
|
-
});
|
|
132
|
-
this.addController(this.focusController);
|
|
133
|
-
if (this.el.isConnected) {
|
|
134
|
-
this.focusController.hostConnected?.();
|
|
119
|
+
resolvePanelForTab(tab, index, panels) {
|
|
120
|
+
const panelId = tab.getAttribute('panel');
|
|
121
|
+
if (panelId) {
|
|
122
|
+
const matched = panels.find((panel) => panel.id === panelId);
|
|
123
|
+
if (matched)
|
|
124
|
+
return matched;
|
|
135
125
|
}
|
|
126
|
+
return panels[index];
|
|
136
127
|
}
|
|
137
|
-
|
|
138
|
-
const
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
128
|
+
warnIfMixedPanelLinking(tabs) {
|
|
129
|
+
const hasPanelAttr = tabs.some((tab) => tab.hasAttribute('panel'));
|
|
130
|
+
const missingPanelAttr = tabs.some((tab) => !tab.hasAttribute('panel'));
|
|
131
|
+
if (hasPanelAttr && missingPanelAttr) {
|
|
132
|
+
console.warn("[lmvz-tabs] Mixed panel linking: some lmvz-tab elements have a 'panel' attribute and some do not. Use either id-based or positional linking consistently.");
|
|
133
|
+
}
|
|
142
134
|
}
|
|
143
135
|
wireAriaIds() {
|
|
144
136
|
const tabs = this.slottedTabs;
|
|
145
137
|
const panels = this.slottedPanels;
|
|
146
138
|
const prefix = `lmvz-tabs-${this.instanceId}`;
|
|
139
|
+
this.warnIfMixedPanelLinking(tabs);
|
|
147
140
|
tabs.forEach((tab, index) => {
|
|
148
141
|
const tabId = tab.id || `${prefix}-tab-${index}`;
|
|
149
142
|
tab.id = tabId;
|
|
150
|
-
const panel = panels
|
|
143
|
+
const panel = this.resolvePanelForTab(tab, index, panels);
|
|
151
144
|
if (!panel)
|
|
152
145
|
return;
|
|
153
146
|
const panelId = panel.id || `${prefix}-panel-${index}`;
|
|
@@ -183,9 +176,12 @@ const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
183
176
|
if (btn)
|
|
184
177
|
btn.setAttribute('aria-selected', String(isSelected));
|
|
185
178
|
});
|
|
186
|
-
this.slottedPanels
|
|
187
|
-
|
|
188
|
-
const
|
|
179
|
+
const panels = this.slottedPanels;
|
|
180
|
+
tabs.forEach((tab, index) => {
|
|
181
|
+
const panel = this.resolvePanelForTab(tab, index, panels);
|
|
182
|
+
if (!panel)
|
|
183
|
+
return;
|
|
184
|
+
const isActive = tab.getAttribute('value') === effectiveValue;
|
|
189
185
|
panel.toggleAttribute('hidden', !isActive);
|
|
190
186
|
});
|
|
191
187
|
const selectedBtn = target.shadowRoot?.querySelector('button');
|
|
@@ -250,14 +246,11 @@ const LmvzTabs = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
250
246
|
this.selectTab(value);
|
|
251
247
|
};
|
|
252
248
|
render() {
|
|
253
|
-
return (index.h(index.Host, { key: '
|
|
249
|
+
return (index.h(index.Host, { key: 'ba02ac9a48c62590b8c986670336b04f82030ad2', onClick: this.handleTabClick, onKeydown: this.handleKeydown }, index.h("div", { key: 'c5c123997d154d676947c8a4f49149ff9e209750', role: "tablist", "aria-orientation": "horizontal", class: "tablist", ref: (el) => (this.tablistEl = el) }, index.h("slot", { key: '7e58d17a4ec8e8300b5dfb745cb36154adc9dbcb', ref: (el) => (this.tabSlotEl = el) })), index.h("div", { key: '5e3e44442e0ffb1a51fd325d545fd799d7a9d119', part: "panels-container", class: "panels-container" }, index.h("slot", { key: 'a6208761b4422a297a58b863fff22843221644bd', name: "panels", ref: (el) => (this.panelSlotEl = el) }))));
|
|
254
250
|
}
|
|
255
251
|
static get watchers() { return {
|
|
256
252
|
"value": [{
|
|
257
253
|
"handleValueChange": 0
|
|
258
|
-
}],
|
|
259
|
-
"orientation": [{
|
|
260
|
-
"handleOrientationChange": 0
|
|
261
254
|
}]
|
|
262
255
|
}; }
|
|
263
256
|
};
|
package/cjs/loader.cjs.js
CHANGED
|
@@ -6,7 +6,7 @@ var appGlobals = require('./app-globals-V2Kpy_OQ.js');
|
|
|
6
6
|
const defineCustomElements = async (win, options) => {
|
|
7
7
|
if (typeof window === 'undefined') return undefined;
|
|
8
8
|
await appGlobals.globalScripts();
|
|
9
|
-
return index.bootstrapLazy([["lmvz-datepicker.cjs",[[593,"lmvz-datepicker",{"value":[6145],"visibleMonth":[6145,"visible-month"],"min":[1],"max":[1],"locale":[1],"firstDayOfWeek":[2,"first-day-of-week"],"disabled":[516],"readonly":[516],"required":[516],"name":[513],"label":[1],"placeholder":[1],"helperText":[1,"helper-text"],"errorMessage":[1,"error-message"],"open":[1540],"displayFormat":[1,"display-format"],"focusedDate":[32],"valueDate":[32],"visibleMonthDate":[32],"inputText":[32],"hasUnparseableInput":[32],"isInvalid":[32],"nativeError":[32],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"],[0,"focusin","handleInputFocus"],[0,"click","handleInputFocus"],[0,"invalid","handleInvalid"]],{"required":[{"handleValidityRelevantPropChange":0}],"min":[{"handleValidityRelevantPropChange":0}],"max":[{"handleValidityRelevantPropChange":0}],"locale":[{"handleDisplayFormatChange":0}],"displayFormat":[{"handleDisplayFormatChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-message.cjs",[[769,"lmvz-message",{"type":[513],"live":[1],"leadingIcon":[4,"leading-icon"],"dismissible":[4],"closeLabel":[1,"close-label"],"actionLabel":[1,"action-label"]}]]],["lmvz-select.cjs",[[838,"lmvz-select",{"value":[1025],"multiple":[516],"values":[1040],"label":[1],"helperText":[1,"helper-text"],"error":[6660],"errorMessage":[1,"error-message"],"disabled":[516],"required":[516],"name":[513],"size":[513],"nativeError":[32],"selectedLabel":[32],"selectedId":[32],"activeId":[32],"isOpen":[32],"optionGroups":[32],"focusTrigger":[64],"blurTrigger":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"]],{"value":[{"handleValueChange":0}],"values":[{"handleValuesChange":0}],"required":[{"handleRequiredChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-snackbar.cjs",[[513,"lmvz-snackbar",{"status":[1537],"message":[1025],"duration":[1026],"priority":[1025],"actionLabel":[1025,"action-label"],"animationClass":[32],"show":[64],"hide":[64]},null,{"status":[{"onStatusChange":0}]}]]],["lmvz-link.cjs",[[785,"lmvz-link",{"href":[513],"target":[513],"rel":[1],"type":[1537],"externalLabel":[1,"external-label"]},null,{"type":[{"normalizeType":0}]}]]],["lmvz-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"],"initFocus":[64]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["lmvz-action-list.cjs",[[774,"lmvz-action-list",{"label":[1],"initFocus":[64]}]]],["lmvz-card.cjs",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox.cjs",[[578,"lmvz-checkbox",{"label":[1],"checked":[1540],"value":[1],"name":[513],"disabled":[516],"required":[516],"error":[6660],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"nativeError":[32],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"]],{"checked":[{"handleCheckedChange":0}],"required":[{"handleRequiredChange":0}]}]]],["lmvz-menuitem.cjs",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-radio.cjs",[[578,"lmvz-radio",{"label":[1],"checked":[1540],"value":[1],"name":[513],"disabled":[516],"required":[516],"error":[6660],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"nativeError":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"],[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"required":[{"handleRequiredChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-spinner.cjs",[[513,"lmvz-spinner",{"size":[513],"ariaLabel":[513,"aria-label"]}]]],["lmvz-tab.cjs",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"
|
|
9
|
+
return index.bootstrapLazy([["lmvz-datepicker.cjs",[[593,"lmvz-datepicker",{"value":[6145],"visibleMonth":[6145,"visible-month"],"min":[1],"max":[1],"locale":[1],"firstDayOfWeek":[2,"first-day-of-week"],"disabled":[516],"readonly":[516],"required":[516],"name":[513],"label":[1],"placeholder":[1],"helperText":[1,"helper-text"],"errorMessage":[1,"error-message"],"open":[1540],"displayFormat":[1,"display-format"],"focusedDate":[32],"valueDate":[32],"visibleMonthDate":[32],"inputText":[32],"hasUnparseableInput":[32],"isInvalid":[32],"nativeError":[32],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"],[0,"focusin","handleInputFocus"],[0,"click","handleInputFocus"],[0,"invalid","handleInvalid"]],{"required":[{"handleValidityRelevantPropChange":0}],"min":[{"handleValidityRelevantPropChange":0}],"max":[{"handleValidityRelevantPropChange":0}],"locale":[{"handleDisplayFormatChange":0}],"displayFormat":[{"handleDisplayFormatChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-message.cjs",[[769,"lmvz-message",{"type":[513],"live":[1],"leadingIcon":[4,"leading-icon"],"dismissible":[4],"closeLabel":[1,"close-label"],"actionLabel":[1,"action-label"]}]]],["lmvz-select.cjs",[[838,"lmvz-select",{"value":[1025],"multiple":[516],"values":[1040],"label":[1],"helperText":[1,"helper-text"],"error":[6660],"errorMessage":[1,"error-message"],"disabled":[516],"required":[516],"name":[513],"size":[513],"nativeError":[32],"selectedLabel":[32],"selectedId":[32],"activeId":[32],"isOpen":[32],"optionGroups":[32],"focusTrigger":[64],"blurTrigger":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"]],{"value":[{"handleValueChange":0}],"values":[{"handleValuesChange":0}],"required":[{"handleRequiredChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-snackbar.cjs",[[513,"lmvz-snackbar",{"status":[1537],"message":[1025],"duration":[1026],"priority":[1025],"actionLabel":[1025,"action-label"],"animationClass":[32],"show":[64],"hide":[64]},null,{"status":[{"onStatusChange":0}]}]]],["lmvz-link.cjs",[[785,"lmvz-link",{"href":[513],"target":[513],"rel":[1],"type":[1537],"externalLabel":[1,"external-label"]},null,{"type":[{"normalizeType":0}]}]]],["lmvz-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"],"initFocus":[64]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["lmvz-action-list.cjs",[[774,"lmvz-action-list",{"label":[1],"initFocus":[64]}]]],["lmvz-card.cjs",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox.cjs",[[578,"lmvz-checkbox",{"label":[1],"checked":[1540],"value":[1],"name":[513],"disabled":[516],"required":[516],"error":[6660],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"nativeError":[32],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"]],{"checked":[{"handleCheckedChange":0}],"required":[{"handleRequiredChange":0}]}]]],["lmvz-menuitem.cjs",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-radio.cjs",[[578,"lmvz-radio",{"label":[1],"checked":[1540],"value":[1],"name":[513],"disabled":[516],"required":[516],"error":[6660],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"nativeError":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64]},[[0,"invalid","handleInvalid"],[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"required":[{"handleRequiredChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-spinner.cjs",[[513,"lmvz-spinner",{"size":[513],"ariaLabel":[513,"aria-label"]}]]],["lmvz-tab.cjs",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"panel":[513]}]]],["lmvz-tabs.cjs",[[769,"lmvz-tabs",{"value":[1537],"resolvedValue":[32],"initFocus":[64],"activateTab":[64],"getTabElements":[64],"setTabPanelIds":[64]},[[0,"slotchange","handleSlotChangeEvent"]],{"value":[{"handleValueChange":0}]}]]],["lmvz-toggle.cjs",[[578,"lmvz-toggle",{"label":[1],"checked":[1540],"disabled":[516],"required":[516],"name":[1],"value":[1],"form":[1],"focusToggle":[64],"blurToggle":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button-group.cjs",[[769,"lmvz-button-group",{"stacked":[516],"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-chip.cjs",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-input.cjs",[[838,"lmvz-input",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"placeholder":[1],"disabled":[516],"readonly":[516],"required":[516],"name":[1],"type":[1],"errorMessage":[1,"error-message"],"autocomplete":[1],"inputmode":[1],"autocorrect":[1],"autocapitalize":[1],"spellcheck":[4],"autofocus":[4],"minlength":[2],"maxlength":[2],"pattern":[1],"min":[8],"max":[8],"step":[8],"form":[1],"size":[513],"error":[6660],"nativeError":[32],"setValue":[64],"focusInput":[64],"blurInput":[64],"select":[64],"checkValidity":[64],"reportValidity":[64],"getValidationMessage":[64],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-popover.cjs",[[769,"lmvz-popover",{"open":[1540],"anchor":[1],"placement":[1],"size":[1],"autoFocus":[4,"auto-focus"],"containerRole":[1,"container-role"],"label":[1],"anchorEl":[32],"show":[64],"hide":[64],"toggle":[64]},null,{"open":[{"handleOpenChange":0}],"anchor":[{"handleAnchorChange":1}]}]]],["lmvz-button_2.cjs",[[785,"lmvz-button",{"ti":[514,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1],"buttonRole":[1,"button-role"]}],[514,"lmvz-icon",{"icon":[513],"weight":[513],"size":[513],"iconset":[513],"ariaLabel":[513,"aria-label"],"iconData":[32],"visible":[32]},null,{"icon":[{"loadIconPathData":0}],"iconset":[{"loadIconPathData":0}]}]]]], options);
|
|
10
10
|
};
|
|
11
11
|
|
|
12
12
|
exports.setNonce = index.setNonce;
|
|
@@ -128,7 +128,6 @@ button:active {
|
|
|
128
128
|
opacity: 0;
|
|
129
129
|
transition: opacity 0.15s ease;
|
|
130
130
|
|
|
131
|
-
/* Horizontal: full-width bar at bottom */
|
|
132
131
|
inset-block-end: 0;
|
|
133
132
|
inset-inline: 0;
|
|
134
133
|
block-size: var(--lmvz-tab-indicator-size);
|
|
@@ -140,18 +139,6 @@ button:active {
|
|
|
140
139
|
:host([selected][has-media]) .indicator {
|
|
141
140
|
opacity: 1;
|
|
142
141
|
}
|
|
143
|
-
:host([vertical]) button {
|
|
144
|
-
border-radius: var(--lmvz-semantic-border-radius-round, 999px);
|
|
145
|
-
}
|
|
146
|
-
:host([vertical]) .indicator {
|
|
147
|
-
/* Vertical: narrow bar at inline-start edge */
|
|
148
|
-
inset-block: 0;
|
|
149
|
-
inset-inline: 0 auto;
|
|
150
|
-
inline-size: var(--lmvz-tab-indicator-size);
|
|
151
|
-
block-size: auto;
|
|
152
|
-
border-radius: 0 var(--lmvz-tab-indicator-size) var(--lmvz-tab-indicator-size) 0;
|
|
153
|
-
background: linear-gradient(to bottom, var(--lmvz-semantic-color-gradient-main-1, #0e7ab4), var(--lmvz-semantic-color-gradient-main-2, #0e7ab4));
|
|
154
|
-
}
|
|
155
142
|
::slotted(*) {
|
|
156
143
|
--lmvz-component-color: var(--lmvz-tab-color);
|
|
157
144
|
}
|
|
@@ -5,7 +5,7 @@ export class LmvzTab {
|
|
|
5
5
|
value;
|
|
6
6
|
disabled = false;
|
|
7
7
|
selected = false;
|
|
8
|
-
|
|
8
|
+
panel;
|
|
9
9
|
handleMediaSlotChange = () => {
|
|
10
10
|
this.el.toggleAttribute('has-media', (this.mediaSlotEl?.assignedElements() ?? []).length > 0);
|
|
11
11
|
};
|
|
@@ -14,7 +14,7 @@ export class LmvzTab {
|
|
|
14
14
|
this.el.dispatchEvent(new CustomEvent('lmvzTabReady', { bubbles: true, composed: false }));
|
|
15
15
|
}
|
|
16
16
|
render() {
|
|
17
|
-
return (h(Host, { key: '
|
|
17
|
+
return (h(Host, { key: '8fb0ddc827d31fa1669a7fdaef288be5002a7c53' }, h("button", { key: '72b8f8be2f7ec7d0d2840148d48188382699d9b9', part: "button", role: "tab", disabled: this.disabled, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: 0 }, h("slot", { key: 'c951ae74e7b15feff7f32bc87b2e3fd46221b6b4', name: "media", ref: (el) => (this.mediaSlotEl = el), onSlotchange: this.handleMediaSlotChange }), h("span", { key: '8a06f3a9598bbf90819ff3644874f53b1ed9f840', class: "label" }, h("slot", { key: '98217fca2371ad7b0ded79628895337603a54c2f' })), h("span", { key: '68a11cf2f3d51aa6f4b9a7d2efcce1a1bb0c7640', "aria-hidden": "true", part: "indicator", class: "indicator" }))));
|
|
18
18
|
}
|
|
19
19
|
static get is() { return "lmvz-tab"; }
|
|
20
20
|
static get encapsulation() { return "shadow"; }
|
|
@@ -96,28 +96,24 @@ export class LmvzTab {
|
|
|
96
96
|
"attribute": "selected",
|
|
97
97
|
"defaultValue": "false"
|
|
98
98
|
},
|
|
99
|
-
"
|
|
100
|
-
"type": "
|
|
99
|
+
"panel": {
|
|
100
|
+
"type": "string",
|
|
101
101
|
"mutable": false,
|
|
102
102
|
"complexType": {
|
|
103
|
-
"original": "
|
|
104
|
-
"resolved": "
|
|
103
|
+
"original": "string",
|
|
104
|
+
"resolved": "string | undefined",
|
|
105
105
|
"references": {}
|
|
106
106
|
},
|
|
107
107
|
"required": false,
|
|
108
|
-
"optional":
|
|
108
|
+
"optional": true,
|
|
109
109
|
"docs": {
|
|
110
|
-
"tags": [
|
|
111
|
-
|
|
112
|
-
"text": "false"
|
|
113
|
-
}],
|
|
114
|
-
"text": "Vertical orientation context.\nSet by the parent `lmvz-tabs` when `orientation=\"vertical\"` \u2014 do not set manually.\nWhen true the selection indicator moves to the inline-start edge."
|
|
110
|
+
"tags": [],
|
|
111
|
+
"text": "The `id` of the target `lmvz-tab-panel` this tab controls.\nWhen omitted, pairing falls back to DOM position."
|
|
115
112
|
},
|
|
116
113
|
"getter": false,
|
|
117
114
|
"setter": false,
|
|
118
115
|
"reflect": true,
|
|
119
|
-
"attribute": "
|
|
120
|
-
"defaultValue": "false"
|
|
116
|
+
"attribute": "panel"
|
|
121
117
|
}
|
|
122
118
|
};
|
|
123
119
|
}
|
|
@@ -62,11 +62,6 @@ legend {
|
|
|
62
62
|
background: none;
|
|
63
63
|
border-radius: 0;
|
|
64
64
|
}
|
|
65
|
-
/* ── Vertical orientation ────────────────────────────────────────────────── */
|
|
66
|
-
:host([orientation='vertical']) .tablist {
|
|
67
|
-
flex-direction: column;
|
|
68
|
-
overflow: visible auto;
|
|
69
|
-
}
|
|
70
65
|
/* The panels slot renders inline; individual panels control their own display */
|
|
71
66
|
::slotted([role='tabpanel']) {
|
|
72
67
|
display: block;
|