@lmvz-ds/components 0.27.0 → 0.27.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/CHANGELOG.md +6 -0
- package/cjs/{ds.constants-8fh6ItAF.js → ds.constants-BbWUmoDv.js} +2 -0
- package/cjs/index.cjs.js +2 -1
- package/cjs/lmvz-chip.cjs.entry.js +1 -1
- package/cjs/lmvz-components.cjs.js +1 -1
- package/cjs/lmvz-input.cjs.entry.js +4 -3
- package/cjs/loader.cjs.js +1 -1
- package/collection/api/ds.constants.js +1 -0
- package/collection/components/lmvz-input/lmvz-input.css +40 -25
- package/collection/components/lmvz-input/lmvz-input.js +33 -2
- package/collection/index.js +2 -2
- package/components/index.js +1 -1
- package/components/lmvz-chip.js +1 -1
- package/components/lmvz-input.js +1 -1
- package/esm/{ds.constants-BOOwq5dE.js → ds.constants-HeV_qTCr.js} +2 -1
- package/esm/index.js +1 -1
- package/esm/lmvz-chip.entry.js +1 -1
- package/esm/lmvz-components.js +1 -1
- package/esm/lmvz-input.entry.js +4 -3
- package/esm/loader.js +1 -1
- package/hydrate/index.js +6 -4
- package/hydrate/index.mjs +6 -4
- package/lmvz-components/index.esm.js +1 -1
- package/lmvz-components/lmvz-components.esm.js +1 -1
- package/lmvz-components/p-HeV_qTCr.js +1 -0
- package/lmvz-components/{p-bb46a884.entry.js → p-c5c064f1.entry.js} +1 -1
- package/lmvz-components/p-cb756f95.entry.js +1 -0
- package/manifest.json +47 -2
- package/package.json +1 -1
- package/types/api/ds.constants.d.ts +2 -0
- package/types/components/lmvz-input/lmvz-input.d.ts +1 -0
- package/types/components.d.ts +14 -0
- package/types/index.d.ts +2 -2
- package/lmvz-components/p-4bd71a3c.entry.js +0 -1
- package/lmvz-components/p-BOOwq5dE.js +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
const sizes = ['xs', 'sm', 'md', 'lg'];
|
|
4
4
|
const textSizes = [...sizes, 'xl'];
|
|
5
5
|
const inputTypes = ['text', 'email', 'password', 'tel', 'url', 'search', 'number'];
|
|
6
|
+
const inputSizes = ['sm', 'md', 'lg'];
|
|
6
7
|
const iconSizes = [...sizes, 'inherit'];
|
|
7
8
|
const iconWeights = ['thin', 'medium', 'bold'];
|
|
8
9
|
const chipTypes = ['active', 'warning', 'success', 'error', 'neutral'];
|
|
@@ -12,5 +13,6 @@ exports.chipSizes = chipSizes;
|
|
|
12
13
|
exports.chipTypes = chipTypes;
|
|
13
14
|
exports.iconSizes = iconSizes;
|
|
14
15
|
exports.iconWeights = iconWeights;
|
|
16
|
+
exports.inputSizes = inputSizes;
|
|
15
17
|
exports.inputTypes = inputTypes;
|
|
16
18
|
exports.textSizes = textSizes;
|
package/cjs/index.cjs.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var ariaLoader = require('./aria-loader-BRo2FTGh.js');
|
|
4
|
-
var ds_constants = require('./ds.constants-
|
|
4
|
+
var ds_constants = require('./ds.constants-BbWUmoDv.js');
|
|
5
5
|
var icons = require('./icons-BQASWgk-.js');
|
|
6
6
|
require('./svg-BMBduILB.js');
|
|
7
7
|
require('./logger-DsM6xg6V.js');
|
|
@@ -211,6 +211,7 @@ exports.chipSizes = ds_constants.chipSizes;
|
|
|
211
211
|
exports.chipTypes = ds_constants.chipTypes;
|
|
212
212
|
exports.iconSizes = ds_constants.iconSizes;
|
|
213
213
|
exports.iconWeights = ds_constants.iconWeights;
|
|
214
|
+
exports.inputSizes = ds_constants.inputSizes;
|
|
214
215
|
exports.inputTypes = ds_constants.inputTypes;
|
|
215
216
|
exports.textSizes = ds_constants.textSizes;
|
|
216
217
|
exports.getRegisteredIconProvider = icons.getRegisteredIconProvider;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var index = require('./index-BCFBLj0e.js');
|
|
4
|
-
var ds_constants = require('./ds.constants-
|
|
4
|
+
var ds_constants = require('./ds.constants-BbWUmoDv.js');
|
|
5
5
|
var ariaValidationController = require('./aria-validation-controller-BMV2tv9-.js');
|
|
6
6
|
var reactiveControllerHost = require('./reactive-controller-host-B_lZtcA6.js');
|
|
7
7
|
var ariaLoader = require('./aria-loader-BRo2FTGh.js');
|
|
@@ -19,7 +19,7 @@ var patchBrowser = () => {
|
|
|
19
19
|
|
|
20
20
|
patchBrowser().then(async (options) => {
|
|
21
21
|
await appGlobals.globalScripts();
|
|
22
|
-
return index.bootstrapLazy([["lmvz-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":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-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["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":[1],"disabled":[516],"required":[516],"error":[516],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},null,{"checked":[{"handleCheckedChange":0}]}]]],["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],"error":[6660],"nativeError":[32],"setValue":[64],"focusInput":[64],"blurInput":[64],"select":[64],"checkValidity":[64],"reportValidity":[64],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":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":[1],"disabled":[516],"required":[516],"error":[516],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-select.cjs",[[774,"lmvz-select",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"disabled":[516],"required":[516],"name":[1],"selectedLabel":[32]},null,{"value":[{"handleValueChange":0}]}]]],["lmvz-tab.cjs",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"vertical":[516]}]]],["lmvz-tabs.cjs",[[769,"lmvz-tabs",{"value":[1537],"orientation":[1537],"resolvedValue":[32],"activateTab":[64],"getTabElements":[64],"setTabPanelIds":[64]},null,{"value":[{"handleValueChange":0}],"orientation":[{"handleOrientationChange":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],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button-group.cjs",[[257,"lmvz-button-group",{"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-button_2.cjs",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1]}],[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);
|
|
22
|
+
return index.bootstrapLazy([["lmvz-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":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-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["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":[1],"disabled":[516],"required":[516],"error":[516],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},null,{"checked":[{"handleCheckedChange":0}]}]]],["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],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":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":[1],"disabled":[516],"required":[516],"error":[516],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-select.cjs",[[774,"lmvz-select",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"disabled":[516],"required":[516],"name":[1],"selectedLabel":[32]},null,{"value":[{"handleValueChange":0}]}]]],["lmvz-tab.cjs",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"vertical":[516]}]]],["lmvz-tabs.cjs",[[769,"lmvz-tabs",{"value":[1537],"orientation":[1537],"resolvedValue":[32],"activateTab":[64],"getTabElements":[64],"setTabPanelIds":[64]},null,{"value":[{"handleValueChange":0}],"orientation":[{"handleOrientationChange":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],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button-group.cjs",[[257,"lmvz-button-group",{"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-button_2.cjs",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1]}],[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;
|
|
@@ -7,7 +7,7 @@ var component = require('./component-C7cavwmZ.js');
|
|
|
7
7
|
var reactiveControllerHost = require('./reactive-controller-host-B_lZtcA6.js');
|
|
8
8
|
require('./aria-loader-BRo2FTGh.js');
|
|
9
9
|
|
|
10
|
-
const lmvzInputCss = () => `@layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } .sc-lmvz-input-h { display: block; font-family: var(--lmvz-global-font-family-default, Router); --input-radius: var(--lmvz-component-input-radius-default, 999px); --input-bg: var(--lmvz-semantic-color-surface-input-primary, #ffffff); --input-border-color: var(--lmvz-semantic-color-border-default, #e0e0e0); --input-border-color-hover: var(--lmvz-semantic-color-border-hover, #c7c7c7); --input-border-color-focus: var(--lmvz-semantic-color-
|
|
10
|
+
const lmvzInputCss = () => `@layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } .sc-lmvz-input-h { display: block; font-family: var(--lmvz-global-font-family-default, Router); --input-radius: var(--lmvz-component-input-radius-default, 999px); --input-bg: var(--lmvz-semantic-color-surface-input-primary, #ffffff); --input-border-color: var(--lmvz-semantic-color-border-default, #e0e0e0); --input-border-color-hover: var(--lmvz-semantic-color-border-hover, #c7c7c7); --input-border-color-focus: var(--lmvz-semantic-color-border-active, #0f8acc); --input-border-width: var(--lmvz-semantic-border-width-default, 1px); --input-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --input-padding-x: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --input-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --input-font-size: var(--lmvz-component-body-md-font-size, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --label-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454); --input-text-color: var(--lmvz-semantic-color-on-surface-input-primary, #000000); --helper-text-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454); --error-text-color: var(--lmvz-semantic-color-status-on-danger, #e52a31); --label-minimized-bg: var(--input-bg); --label-minimized-padding-x: 4px; --input-disabled-opacity: var(--lmvz-component-input-disabled-opacity, 40%); } [size='sm'].sc-lmvz-input-h { --input-height: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)); --input-padding-x: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --input-gap: var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)); --input-font-size: var(--lmvz-component-body-sm-font-size, clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem)); } [size='md'].sc-lmvz-input-h { --input-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --input-padding-x: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --input-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --input-font-size: var(--lmvz-component-body-md-font-size, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); } [size='lg'].sc-lmvz-input-h { --input-height: var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem)); --input-padding-x: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --input-gap: var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); --input-font-size: var(--lmvz-component-body-lg-font-size, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); } .input-container.sc-lmvz-input { display: flex; flex-direction: column; position: relative; width: 100%; } .input-wrapper.sc-lmvz-input { background-color: var(--input-bg); border: var(--input-border-width) solid var(--input-border-color); border-radius: var(--input-radius); display: flex; align-items: center; height: var(--input-height); padding: 0 var(--input-padding-x); position: relative; transition: border-color 0.2s ease; gap: var(--input-gap); } [disabled].sc-lmvz-input-h .input-wrapper.sc-lmvz-input { opacity: var(--input-disabled-opacity); cursor: not-allowed; pointer-events: none; } .input-container.sc-lmvz-input:focus-within .input-wrapper.sc-lmvz-input { border-color: var(--input-border-color-focus); outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); } [error].sc-lmvz-input-h .input-wrapper.sc-lmvz-input { border-color: var(--error-text-color); } .sc-lmvz-input-h:not([disabled]) .input-wrapper.sc-lmvz-input:hover { border-color: var(--input-border-color-hover); } .label-input-group.sc-lmvz-input { position: relative; flex-grow: 1; display: flex; align-items: center; height: 100%; } label.sc-lmvz-input { position: absolute; left: 0; top: 50%; transform: translateY(-50%); color: var(--label-color); font-size: var(--input-font-size); font-weight: 400; pointer-events: none; transition: all 0.2s ease-out; background-color: transparent; padding: 0; margin: 0; line-height: 1.5; white-space: nowrap; } label.floating.sc-lmvz-input { top: 0.5em; transform: translateY(-100%); transform-origin: left top; font-size: var(--lmvz-component-body-2xs-font-size, clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem)); background-color: var(--label-minimized-bg); padding: 0 var(--label-minimized-padding-x); left: -2px; color: var(--input-text-color); font-weight: 400; } .required-indicator.sc-lmvz-input { color: var(--error-text-color); margin-left: 2px; } input.sc-lmvz-input { border: none; background: transparent; width: 100%; height: 100%; color: var(--input-text-color); font-family: inherit; font-size: var(--input-font-size); outline: none; padding: 0; margin: 0; font-weight: 400; } input.sc-lmvz-input::placeholder { color: var(--label-color); } div.sc-lmvz-input:empty { display: none; } [role='status'].sc-lmvz-input { padding-top: 8px; padding-left: var(--input-padding-x); font-size: 12px; color: var(--helper-text-color); font-weight: 400; } [role='alert'].sc-lmvz-input { padding-top: 8px; padding-left: var(--input-padding-x); font-size: 12px; color: var(--error-text-color); font-weight: 400; } .sc-lmvz-input-s > lmvz-button { --lmvz-button-padding: 4px; }`;
|
|
11
11
|
|
|
12
12
|
let inputIdCounter = 0;
|
|
13
13
|
const LmvzInput = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
@@ -62,6 +62,7 @@ const LmvzInput = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
62
62
|
max;
|
|
63
63
|
step;
|
|
64
64
|
form;
|
|
65
|
+
size = 'md';
|
|
65
66
|
get error() {
|
|
66
67
|
return this.errorFromProp || this.nativeError;
|
|
67
68
|
}
|
|
@@ -165,9 +166,9 @@ const LmvzInput = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
|
165
166
|
render() {
|
|
166
167
|
const hasValue = Boolean(this.value);
|
|
167
168
|
const shouldFloatLabel = hasValue || Boolean(this.placeholder);
|
|
168
|
-
return (index.h("div", { key: '
|
|
169
|
+
return (index.h("div", { key: '4be6846147fec950acad0c0cb8643bfa69233935', class: index$1.classNames('input-container', {
|
|
169
170
|
'interaction-filled': hasValue,
|
|
170
|
-
}) }, index.h("div", { key: '
|
|
171
|
+
}) }, index.h("div", { key: 'ae9bf8ffd91b73a86c2ebd21af051efe26a1d5fd', class: "input-wrapper" }, index.h("slot", { key: '36b3f7d97a11296aeead44c4d8ab4f0f8edf62d1', name: "before-input" }), index.h("div", { key: '4320f461ffa908730cd898863f43644aa3677081', class: "label-input-group" }, index.h("label", { key: '1dd51cf16f064303fd9c5249cbe3a357c7515ddc', htmlFor: this.inputId, class: index$1.classNames({ floating: shouldFloatLabel }) }, this.label, this.required && (index.h("span", { key: '74bb8124b1126501201eb7c3361c6cf7f17dda5c', class: "required-indicator", "aria-hidden": "true" }, ' ', "*"))), index.h("input", { key: '9cff77bea65c50331a6804d7039672bbe01e710c', id: this.inputId, ref: (el) => (this.nativeInputElement = el), type: this.type, min: this.min, max: this.max, step: this.step, value: this.value, name: this.name, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, form: this.form, autocomplete: this.autocomplete, inputmode: this.inputmode, autocorrect: this.autocorrect, autocapitalize: this.autocapitalize, spellcheck: this.spellcheck, autofocus: this.autofocus, minlength: this.minlength, maxlength: this.maxlength, pattern: this.pattern, "aria-invalid": this.error ? 'true' : 'false', "aria-required": this.required ? 'true' : 'false', "aria-describedby": this.describedBy, "aria-errormessage": this.errorId, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur })), index.h("slot", { key: '689a3aa53e22f89173893adbc72eaf4953a2c7f6', name: "after-input" })), index.h("div", { key: 'd29b9ea209c138d0de09f71042f539a56ed4f9fa', id: this.helperId, role: "status" }, this.helperText || null), index.h("div", { key: '8be227367abadb0e001d9475f0793aed31dbb64a', id: this.errorId, role: "alert" }, (this.showErrorMessage && this.errorMessage) || null)));
|
|
171
172
|
}
|
|
172
173
|
static get formAssociated() { return true; }
|
|
173
174
|
static get watchers() { return {
|
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-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":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-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["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":[1],"disabled":[516],"required":[516],"error":[516],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},null,{"checked":[{"handleCheckedChange":0}]}]]],["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],"error":[6660],"nativeError":[32],"setValue":[64],"focusInput":[64],"blurInput":[64],"select":[64],"checkValidity":[64],"reportValidity":[64],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":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":[1],"disabled":[516],"required":[516],"error":[516],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-select.cjs",[[774,"lmvz-select",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"disabled":[516],"required":[516],"name":[1],"selectedLabel":[32]},null,{"value":[{"handleValueChange":0}]}]]],["lmvz-tab.cjs",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"vertical":[516]}]]],["lmvz-tabs.cjs",[[769,"lmvz-tabs",{"value":[1537],"orientation":[1537],"resolvedValue":[32],"activateTab":[64],"getTabElements":[64],"setTabPanelIds":[64]},null,{"value":[{"handleValueChange":0}],"orientation":[{"handleOrientationChange":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],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button-group.cjs",[[257,"lmvz-button-group",{"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-button_2.cjs",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1]}],[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);
|
|
9
|
+
return index.bootstrapLazy([["lmvz-modal.cjs",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":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-header_2.cjs",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action.cjs",[[257,"lmvz-action"]]],["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":[1],"disabled":[516],"required":[516],"error":[516],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},null,{"checked":[{"handleCheckedChange":0}]}]]],["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],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":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":[1],"disabled":[516],"required":[516],"error":[516],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-select.cjs",[[774,"lmvz-select",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"disabled":[516],"required":[516],"name":[1],"selectedLabel":[32]},null,{"value":[{"handleValueChange":0}]}]]],["lmvz-tab.cjs",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"vertical":[516]}]]],["lmvz-tabs.cjs",[[769,"lmvz-tabs",{"value":[1537],"orientation":[1537],"resolvedValue":[32],"activateTab":[64],"getTabElements":[64],"setTabPanelIds":[64]},null,{"value":[{"handleValueChange":0}],"orientation":[{"handleOrientationChange":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],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button-group.cjs",[[257,"lmvz-button-group",{"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-button_2.cjs",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1]}],[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;
|
|
@@ -3,6 +3,7 @@ export const scaleValues = ['small', 'default', 'large'];
|
|
|
3
3
|
export const sizes = ['xs', 'sm', 'md', 'lg'];
|
|
4
4
|
export const textSizes = [...sizes, 'xl'];
|
|
5
5
|
export const inputTypes = ['text', 'email', 'password', 'tel', 'url', 'search', 'number'];
|
|
6
|
+
export const inputSizes = ['sm', 'md', 'lg'];
|
|
6
7
|
export const iconSizes = [...sizes, 'inherit'];
|
|
7
8
|
export const iconWeights = ['thin', 'medium', 'bold'];
|
|
8
9
|
export const chipTypes = ['active', 'warning', 'success', 'error', 'neutral'];
|
|
@@ -45,24 +45,45 @@
|
|
|
45
45
|
--input-bg: var(--lmvz-semantic-color-surface-input-primary, #ffffff);
|
|
46
46
|
--input-border-color: var(--lmvz-semantic-color-border-default, #e0e0e0);
|
|
47
47
|
--input-border-color-hover: var(--lmvz-semantic-color-border-hover, #c7c7c7);
|
|
48
|
-
--input-border-color-focus: var(--lmvz-semantic-color-
|
|
48
|
+
--input-border-color-focus: var(--lmvz-semantic-color-border-active, #0f8acc);
|
|
49
49
|
--input-border-width: var(--lmvz-semantic-border-width-default, 1px);
|
|
50
|
-
|
|
51
|
-
|
|
50
|
+
|
|
51
|
+
/* Size defaults (md) */
|
|
52
|
+
--input-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem));
|
|
53
|
+
--input-padding-x: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem));
|
|
54
|
+
--input-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem));
|
|
55
|
+
--input-font-size: var(--lmvz-component-body-md-font-size, clamp(0.88rem, 0.84rem + 0.13vw, 1rem));
|
|
52
56
|
|
|
53
57
|
--label-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454);
|
|
54
58
|
--input-text-color: var(--lmvz-semantic-color-on-surface-input-primary, #000000);
|
|
55
59
|
--helper-text-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454);
|
|
56
60
|
--error-text-color: var(--lmvz-semantic-color-status-on-danger, #e52a31);
|
|
57
61
|
|
|
58
|
-
--label-floating-scale: 0.85; /* 14px -> 12px approx */
|
|
59
|
-
--label-minimized-top: -6px;
|
|
60
62
|
--label-minimized-bg: var(--input-bg);
|
|
61
63
|
--label-minimized-padding-x: 4px;
|
|
62
64
|
|
|
63
65
|
/* Disabled state uses opacity token */
|
|
64
66
|
--input-disabled-opacity: var(--lmvz-component-input-disabled-opacity, 40%);
|
|
65
67
|
}
|
|
68
|
+
/* Size variants */
|
|
69
|
+
:host([size='sm']) {
|
|
70
|
+
--input-height: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem));
|
|
71
|
+
--input-padding-x: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem));
|
|
72
|
+
--input-gap: var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem));
|
|
73
|
+
--input-font-size: var(--lmvz-component-body-sm-font-size, clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem));
|
|
74
|
+
}
|
|
75
|
+
:host([size='md']) {
|
|
76
|
+
--input-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem));
|
|
77
|
+
--input-padding-x: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem));
|
|
78
|
+
--input-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem));
|
|
79
|
+
--input-font-size: var(--lmvz-component-body-md-font-size, clamp(0.88rem, 0.84rem + 0.13vw, 1rem));
|
|
80
|
+
}
|
|
81
|
+
:host([size='lg']) {
|
|
82
|
+
--input-height: var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem));
|
|
83
|
+
--input-padding-x: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem));
|
|
84
|
+
--input-gap: var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem));
|
|
85
|
+
--input-font-size: var(--lmvz-component-body-lg-font-size, clamp(1rem, 0.97rem + 0.13vw, 1.13rem));
|
|
86
|
+
}
|
|
66
87
|
.input-container {
|
|
67
88
|
display: flex;
|
|
68
89
|
flex-direction: column;
|
|
@@ -79,7 +100,7 @@
|
|
|
79
100
|
padding: 0 var(--input-padding-x);
|
|
80
101
|
position: relative;
|
|
81
102
|
transition: border-color 0.2s ease;
|
|
82
|
-
gap:
|
|
103
|
+
gap: var(--input-gap);
|
|
83
104
|
}
|
|
84
105
|
:host([disabled]) .input-wrapper {
|
|
85
106
|
opacity: var(--input-disabled-opacity);
|
|
@@ -87,7 +108,7 @@
|
|
|
87
108
|
pointer-events: none;
|
|
88
109
|
}
|
|
89
110
|
.input-container:focus-within .input-wrapper {
|
|
90
|
-
|
|
111
|
+
border-color: var(--input-border-color-focus);
|
|
91
112
|
outline: var(--lmvz-ds-outline, 1px solid #0e7ab4);
|
|
92
113
|
outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem));
|
|
93
114
|
}
|
|
@@ -95,10 +116,6 @@
|
|
|
95
116
|
:host([error]) .input-wrapper {
|
|
96
117
|
border-color: var(--error-text-color);
|
|
97
118
|
}
|
|
98
|
-
:host([error]):focus-within .input-wrapper {
|
|
99
|
-
border-color: var(--error-text-color);
|
|
100
|
-
outline-color: var(--error-text-color);
|
|
101
|
-
}
|
|
102
119
|
/* Hover State - Use CSS pseudo-selector instead of class */
|
|
103
120
|
:host(:not([disabled])) .input-wrapper:hover {
|
|
104
121
|
border-color: var(--input-border-color-hover);
|
|
@@ -116,26 +133,26 @@ label {
|
|
|
116
133
|
top: 50%;
|
|
117
134
|
transform: translateY(-50%);
|
|
118
135
|
color: var(--label-color);
|
|
119
|
-
font-size:
|
|
120
|
-
font-family: Router, sans-serif;
|
|
136
|
+
font-size: var(--input-font-size);
|
|
121
137
|
font-weight: 400;
|
|
122
138
|
pointer-events: none;
|
|
123
139
|
transition: all 0.2s ease-out;
|
|
124
140
|
background-color: transparent;
|
|
125
141
|
padding: 0;
|
|
126
142
|
margin: 0;
|
|
127
|
-
line-height:
|
|
143
|
+
line-height: 1.5;
|
|
128
144
|
white-space: nowrap;
|
|
129
145
|
}
|
|
130
146
|
label.floating {
|
|
131
|
-
top: 0;
|
|
132
|
-
transform: translateY(-
|
|
147
|
+
top: 0.5em;
|
|
148
|
+
transform: translateY(-100%);
|
|
133
149
|
transform-origin: left top;
|
|
150
|
+
font-size: var(--lmvz-component-body-2xs-font-size, clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem));
|
|
134
151
|
background-color: var(--label-minimized-bg);
|
|
135
152
|
padding: 0 var(--label-minimized-padding-x);
|
|
136
153
|
left: -2px; /* Adjust for padding/border visual alignment */
|
|
137
154
|
color: var(--input-text-color); /* Darker when floating */
|
|
138
|
-
font-weight:
|
|
155
|
+
font-weight: 400;
|
|
139
156
|
}
|
|
140
157
|
.required-indicator {
|
|
141
158
|
color: var(--error-text-color);
|
|
@@ -148,11 +165,11 @@ input {
|
|
|
148
165
|
height: 100%;
|
|
149
166
|
color: var(--input-text-color);
|
|
150
167
|
font-family: inherit;
|
|
151
|
-
font-size:
|
|
168
|
+
font-size: var(--input-font-size);
|
|
152
169
|
outline: none;
|
|
153
170
|
padding: 0;
|
|
154
171
|
margin: 0;
|
|
155
|
-
font-weight: 400;
|
|
172
|
+
font-weight: 400;
|
|
156
173
|
}
|
|
157
174
|
input::placeholder {
|
|
158
175
|
color: var(--label-color);
|
|
@@ -162,19 +179,17 @@ div:empty {
|
|
|
162
179
|
}
|
|
163
180
|
[role='status'] {
|
|
164
181
|
padding-top: 8px; /* space-gap-component-input-helper-text */
|
|
165
|
-
padding-left:
|
|
182
|
+
padding-left: var(--input-padding-x);
|
|
166
183
|
font-size: 12px;
|
|
167
184
|
color: var(--helper-text-color);
|
|
168
|
-
font-
|
|
169
|
-
font-weight: 500; /* Medium weight */
|
|
185
|
+
font-weight: 400;
|
|
170
186
|
}
|
|
171
187
|
[role='alert'] {
|
|
172
188
|
padding-top: 8px;
|
|
173
|
-
padding-left:
|
|
189
|
+
padding-left: var(--input-padding-x);
|
|
174
190
|
font-size: 12px;
|
|
175
191
|
color: var(--error-text-color);
|
|
176
|
-
font-
|
|
177
|
-
font-weight: 500;
|
|
192
|
+
font-weight: 400;
|
|
178
193
|
}
|
|
179
194
|
::slotted(lmvz-button) {
|
|
180
195
|
/* Minimize padding for (icon) buttons due to height constraints */
|
|
@@ -56,6 +56,7 @@ export class LmvzInput extends ReactiveControllerHost {
|
|
|
56
56
|
max;
|
|
57
57
|
step;
|
|
58
58
|
form;
|
|
59
|
+
size = 'md';
|
|
59
60
|
get error() {
|
|
60
61
|
return this.errorFromProp || this.nativeError;
|
|
61
62
|
}
|
|
@@ -150,9 +151,9 @@ export class LmvzInput extends ReactiveControllerHost {
|
|
|
150
151
|
render() {
|
|
151
152
|
const hasValue = Boolean(this.value);
|
|
152
153
|
const shouldFloatLabel = hasValue || Boolean(this.placeholder);
|
|
153
|
-
return (h("div", { key: '
|
|
154
|
+
return (h("div", { key: '4be6846147fec950acad0c0cb8643bfa69233935', class: classNames('input-container', {
|
|
154
155
|
'interaction-filled': hasValue,
|
|
155
|
-
}) }, h("div", { key: '
|
|
156
|
+
}) }, h("div", { key: 'ae9bf8ffd91b73a86c2ebd21af051efe26a1d5fd', class: "input-wrapper" }, h("slot", { key: '36b3f7d97a11296aeead44c4d8ab4f0f8edf62d1', name: "before-input" }), h("div", { key: '4320f461ffa908730cd898863f43644aa3677081', class: "label-input-group" }, h("label", { key: '1dd51cf16f064303fd9c5249cbe3a357c7515ddc', htmlFor: this.inputId, class: classNames({ floating: shouldFloatLabel }) }, this.label, this.required && (h("span", { key: '74bb8124b1126501201eb7c3361c6cf7f17dda5c', class: "required-indicator", "aria-hidden": "true" }, ' ', "*"))), h("input", { key: '9cff77bea65c50331a6804d7039672bbe01e710c', id: this.inputId, ref: (el) => (this.nativeInputElement = el), type: this.type, min: this.min, max: this.max, step: this.step, value: this.value, name: this.name, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, form: this.form, autocomplete: this.autocomplete, inputmode: this.inputmode, autocorrect: this.autocorrect, autocapitalize: this.autocapitalize, spellcheck: this.spellcheck, autofocus: this.autofocus, minlength: this.minlength, maxlength: this.maxlength, pattern: this.pattern, "aria-invalid": this.error ? 'true' : 'false', "aria-required": this.required ? 'true' : 'false', "aria-describedby": this.describedBy, "aria-errormessage": this.errorId, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur })), h("slot", { key: '689a3aa53e22f89173893adbc72eaf4953a2c7f6', name: "after-input" })), h("div", { key: 'd29b9ea209c138d0de09f71042f539a56ed4f9fa', id: this.helperId, role: "status" }, this.helperText || null), h("div", { key: '8be227367abadb0e001d9475f0793aed31dbb64a', id: this.errorId, role: "alert" }, (this.showErrorMessage && this.errorMessage) || null)));
|
|
156
157
|
}
|
|
157
158
|
static get is() { return "lmvz-input"; }
|
|
158
159
|
static get encapsulation() { return "scoped"; }
|
|
@@ -663,6 +664,36 @@ export class LmvzInput extends ReactiveControllerHost {
|
|
|
663
664
|
"reflect": false,
|
|
664
665
|
"attribute": "form"
|
|
665
666
|
},
|
|
667
|
+
"size": {
|
|
668
|
+
"type": "string",
|
|
669
|
+
"mutable": false,
|
|
670
|
+
"complexType": {
|
|
671
|
+
"original": "Input.Size",
|
|
672
|
+
"resolved": "\"lg\" | \"md\" | \"sm\"",
|
|
673
|
+
"references": {
|
|
674
|
+
"Input": {
|
|
675
|
+
"location": "import",
|
|
676
|
+
"path": "../../api",
|
|
677
|
+
"id": "src/api/index.d.ts::Input",
|
|
678
|
+
"referenceLocation": "Input"
|
|
679
|
+
}
|
|
680
|
+
}
|
|
681
|
+
},
|
|
682
|
+
"required": false,
|
|
683
|
+
"optional": false,
|
|
684
|
+
"docs": {
|
|
685
|
+
"tags": [{
|
|
686
|
+
"name": "default",
|
|
687
|
+
"text": "'md'"
|
|
688
|
+
}],
|
|
689
|
+
"text": "Size variant of the input"
|
|
690
|
+
},
|
|
691
|
+
"getter": false,
|
|
692
|
+
"setter": false,
|
|
693
|
+
"reflect": true,
|
|
694
|
+
"attribute": "size",
|
|
695
|
+
"defaultValue": "'md'"
|
|
696
|
+
},
|
|
666
697
|
"error": {
|
|
667
698
|
"type": "boolean",
|
|
668
699
|
"mutable": false,
|
package/collection/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export * from '@lmvz-ds/aria-validation';
|
|
2
|
-
export { chipSizes, chipTypes, iconSizes, iconWeights, inputTypes, textSizes } from './api/ds.constants';
|
|
3
|
-
export * from './utils/public';
|
|
2
|
+
export { chipSizes, chipTypes, iconSizes, iconWeights, inputSizes, inputTypes, textSizes } from './api/ds.constants';
|
|
4
3
|
export * from './components/lmvz-snackbar/public';
|
|
4
|
+
export * from './utils/public';
|
package/components/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export{g as getAssetPath,r as render,s as setAssetPath,a as setNonce,b as setPlatformOptions}from"./p-c7OzBK8f.js";export{A as ARIA_VALIDATION_RUNTIME_CHANGED_EVENT,d as disableAriaValidation,e as enableAriaValidation,i as isAriaValidationEnabled,q as queueValidation,u as useVerboseLogging}from"./p-CdDO7mQa.js";export{LmvzChip,c as chipSizes,a as chipTypes,defineCustomElement as defineCustomElementLmvzChip,i as iconSizes,b as iconWeights,d as inputTypes,t as textSizes}from"./lmvz-chip.js";export{g as getRegisteredIconProvider,r as registerIconProvider,t as typedIconFromSet}from"./p-DjvbwRyl.js";export{LmvzAction,defineCustomElement as defineCustomElementLmvzAction}from"./lmvz-action.js";export{LmvzButton,defineCustomElement as defineCustomElementLmvzButton}from"./lmvz-button.js";export{LmvzButtonGroup,defineCustomElement as defineCustomElementLmvzButtonGroup}from"./lmvz-button-group.js";export{LmvzCard,defineCustomElement as defineCustomElementLmvzCard}from"./lmvz-card.js";export{LmvzCheckbox,defineCustomElement as defineCustomElementLmvzCheckbox}from"./lmvz-checkbox.js";export{LmvzHeader,defineCustomElement as defineCustomElementLmvzHeader}from"./lmvz-header.js";export{LmvzIcon,defineCustomElement as defineCustomElementLmvzIcon}from"./lmvz-icon.js";export{LmvzInput,defineCustomElement as defineCustomElementLmvzInput}from"./lmvz-input.js";export{LmvzMenuitem,defineCustomElement as defineCustomElementLmvzMenuitem}from"./lmvz-menuitem.js";export{LmvzModal,defineCustomElement as defineCustomElementLmvzModal}from"./lmvz-modal.js";export{LmvzRadio,defineCustomElement as defineCustomElementLmvzRadio}from"./lmvz-radio.js";export{LmvzSelect,defineCustomElement as defineCustomElementLmvzSelect}from"./lmvz-select.js";export{LmvzSnackbar,defineCustomElement as defineCustomElementLmvzSnackbar}from"./lmvz-snackbar.js";export{LmvzTab,defineCustomElement as defineCustomElementLmvzTab}from"./lmvz-tab.js";export{LmvzTabs,defineCustomElement as defineCustomElementLmvzTabs}from"./lmvz-tabs.js";export{LmvzToggle,defineCustomElement as defineCustomElementLmvzToggle}from"./lmvz-toggle.js";const o={low:0,normal:1,high:2},n={success:5e3,warning:5e3,error:8e3};let m=0;function l(){return m+=1,"snackbar-"+m}class v{hostEl=void 0;active=void 0;getHost(){return void 0===this.hostEl||this.hostEl.isConnected||(this.hostEl=void 0),void 0===this.hostEl&&(this.hostEl=function(){if("undefined"==typeof document)return;const e=document.querySelector("[data-snackbar-host]");if(e)return e;const t=document.createElement("lmvz-snackbar");return t.setAttribute("data-snackbar-host",""),document.body.appendChild(t),t}()),this.hostEl}clearTimer(e){void 0!==e.timerId&&(clearTimeout(e.timerId),e.timerId=void 0)}scheduleTimer(e,t){t<=0||(e.timerStartedAt=Date.now(),e.timerId=setTimeout((()=>{void 0!==this.active&&this.active.id===e.id&&this.dismissActive(e,"timeout")}),t))}dismissActive(e,t){this.clearTimer(e);const s=e.hostEl;s.removeEventListener("pointerenter",e.onPointerEnter),s.removeEventListener("pointerleave",e.onPointerLeave),s.removeEventListener("focusin",e.onFocusIn),s.removeEventListener("focusout",e.onFocusOut),e.onActionListener&&s.removeEventListener("lmvzAction",e.onActionListener),s.hide?.(),this.active?.id===e.id&&(this.active=void 0),"action"!==t&&s.dispatchEvent(new CustomEvent("lmvzClose",{detail:{reason:t},bubbles:!0,composed:!0})),e.resolve({reason:t})}pauseTimer(e){if(e.pauseCount+=1,e.pauseCount>1||void 0===e.timerId)return;const t=void 0!==e.timerStartedAt?Date.now()-e.timerStartedAt:0;e.remaining=Math.max(0,e.remaining-t),e.timerStartedAt=void 0,this.clearTimer(e)}resumeTimer(e){e.pauseCount>0&&(e.pauseCount-=1),e.pauseCount>0||e.remaining>0&&this.scheduleTimer(e,e.remaining)}applyToHost(e,t){e.setAttribute("status",t.status??"success"),void 0!==t.actionLabel?e.setAttribute("action-label",t.actionLabel):e.removeAttribute("action-label")}open(e){const t=o[e.priority??"normal"];if(void 0!==this.active&&t<this.active.priority){let e;const t=new Promise((t=>{e=t}));return e({reason:"swallowed"}),{id:l(),closed:t,dismiss(){}}}void 0!==this.active&&this.dismissActive(this.active,"overridden");const s=this.getHost();if(void 0===s){const e=l();let t;const s=new Promise((e=>{t=e}));return t({reason:"swallowed"}),{id:e,closed:s,dismiss(){}}}const i=l(),m=0===e.duration?0:e.duration??n[e.status??"success"];let a;const r=new Promise((e=>{a=e})),d={id:i,priority:t,resolve:a,timerId:void 0,remaining:m,timerStartedAt:void 0,pauseCount:0,hostEl:s,onPointerEnter:()=>this.pauseTimer(d),onPointerLeave:()=>this.resumeTimer(d),onFocusIn:()=>this.pauseTimer(d),onFocusOut:()=>this.resumeTimer(d)};this.active=d,s.addEventListener("pointerenter",d.onPointerEnter),s.addEventListener("pointerleave",d.onPointerLeave),s.addEventListener("focusin",d.onFocusIn),s.addEventListener("focusout",d.onFocusOut),this.applyToHost(s,e);const u=()=>{void 0!==this.active&&this.active.id===i&&(e.onAction?.(),this.dismissActive(d,"action"))};return d.onActionListener=u,s.addEventListener("lmvzAction",u,{once:!0}),s.show?.(),queueMicrotask((()=>s.setAttribute("message",e.message))),m>0&&this.scheduleTimer(d,m),{id:i,closed:r,dismiss:()=>{this.active?.id===i&&this.dismissActive(d,"manual")}}}dismiss(e){this.active&&(e&&this.active.id!==e||this.dismissActive(this.active,"manual"))}}export{v as SnackbarController}
|
|
1
|
+
export{g as getAssetPath,r as render,s as setAssetPath,a as setNonce,b as setPlatformOptions}from"./p-c7OzBK8f.js";export{A as ARIA_VALIDATION_RUNTIME_CHANGED_EVENT,d as disableAriaValidation,e as enableAriaValidation,i as isAriaValidationEnabled,q as queueValidation,u as useVerboseLogging}from"./p-CdDO7mQa.js";export{LmvzChip,c as chipSizes,a as chipTypes,defineCustomElement as defineCustomElementLmvzChip,i as iconSizes,b as iconWeights,d as inputSizes,e as inputTypes,t as textSizes}from"./lmvz-chip.js";export{g as getRegisteredIconProvider,r as registerIconProvider,t as typedIconFromSet}from"./p-DjvbwRyl.js";export{LmvzAction,defineCustomElement as defineCustomElementLmvzAction}from"./lmvz-action.js";export{LmvzButton,defineCustomElement as defineCustomElementLmvzButton}from"./lmvz-button.js";export{LmvzButtonGroup,defineCustomElement as defineCustomElementLmvzButtonGroup}from"./lmvz-button-group.js";export{LmvzCard,defineCustomElement as defineCustomElementLmvzCard}from"./lmvz-card.js";export{LmvzCheckbox,defineCustomElement as defineCustomElementLmvzCheckbox}from"./lmvz-checkbox.js";export{LmvzHeader,defineCustomElement as defineCustomElementLmvzHeader}from"./lmvz-header.js";export{LmvzIcon,defineCustomElement as defineCustomElementLmvzIcon}from"./lmvz-icon.js";export{LmvzInput,defineCustomElement as defineCustomElementLmvzInput}from"./lmvz-input.js";export{LmvzMenuitem,defineCustomElement as defineCustomElementLmvzMenuitem}from"./lmvz-menuitem.js";export{LmvzModal,defineCustomElement as defineCustomElementLmvzModal}from"./lmvz-modal.js";export{LmvzRadio,defineCustomElement as defineCustomElementLmvzRadio}from"./lmvz-radio.js";export{LmvzSelect,defineCustomElement as defineCustomElementLmvzSelect}from"./lmvz-select.js";export{LmvzSnackbar,defineCustomElement as defineCustomElementLmvzSnackbar}from"./lmvz-snackbar.js";export{LmvzTab,defineCustomElement as defineCustomElementLmvzTab}from"./lmvz-tab.js";export{LmvzTabs,defineCustomElement as defineCustomElementLmvzTabs}from"./lmvz-tabs.js";export{LmvzToggle,defineCustomElement as defineCustomElementLmvzToggle}from"./lmvz-toggle.js";const o={low:0,normal:1,high:2},n={success:5e3,warning:5e3,error:8e3};let m=0;function l(){return m+=1,"snackbar-"+m}class v{hostEl=void 0;active=void 0;getHost(){return void 0===this.hostEl||this.hostEl.isConnected||(this.hostEl=void 0),void 0===this.hostEl&&(this.hostEl=function(){if("undefined"==typeof document)return;const e=document.querySelector("[data-snackbar-host]");if(e)return e;const t=document.createElement("lmvz-snackbar");return t.setAttribute("data-snackbar-host",""),document.body.appendChild(t),t}()),this.hostEl}clearTimer(e){void 0!==e.timerId&&(clearTimeout(e.timerId),e.timerId=void 0)}scheduleTimer(e,t){t<=0||(e.timerStartedAt=Date.now(),e.timerId=setTimeout((()=>{void 0!==this.active&&this.active.id===e.id&&this.dismissActive(e,"timeout")}),t))}dismissActive(e,t){this.clearTimer(e);const s=e.hostEl;s.removeEventListener("pointerenter",e.onPointerEnter),s.removeEventListener("pointerleave",e.onPointerLeave),s.removeEventListener("focusin",e.onFocusIn),s.removeEventListener("focusout",e.onFocusOut),e.onActionListener&&s.removeEventListener("lmvzAction",e.onActionListener),s.hide?.(),this.active?.id===e.id&&(this.active=void 0),"action"!==t&&s.dispatchEvent(new CustomEvent("lmvzClose",{detail:{reason:t},bubbles:!0,composed:!0})),e.resolve({reason:t})}pauseTimer(e){if(e.pauseCount+=1,e.pauseCount>1||void 0===e.timerId)return;const t=void 0!==e.timerStartedAt?Date.now()-e.timerStartedAt:0;e.remaining=Math.max(0,e.remaining-t),e.timerStartedAt=void 0,this.clearTimer(e)}resumeTimer(e){e.pauseCount>0&&(e.pauseCount-=1),e.pauseCount>0||e.remaining>0&&this.scheduleTimer(e,e.remaining)}applyToHost(e,t){e.setAttribute("status",t.status??"success"),void 0!==t.actionLabel?e.setAttribute("action-label",t.actionLabel):e.removeAttribute("action-label")}open(e){const t=o[e.priority??"normal"];if(void 0!==this.active&&t<this.active.priority){let e;const t=new Promise((t=>{e=t}));return e({reason:"swallowed"}),{id:l(),closed:t,dismiss(){}}}void 0!==this.active&&this.dismissActive(this.active,"overridden");const s=this.getHost();if(void 0===s){const e=l();let t;const s=new Promise((e=>{t=e}));return t({reason:"swallowed"}),{id:e,closed:s,dismiss(){}}}const i=l(),m=0===e.duration?0:e.duration??n[e.status??"success"];let a;const r=new Promise((e=>{a=e})),d={id:i,priority:t,resolve:a,timerId:void 0,remaining:m,timerStartedAt:void 0,pauseCount:0,hostEl:s,onPointerEnter:()=>this.pauseTimer(d),onPointerLeave:()=>this.resumeTimer(d),onFocusIn:()=>this.pauseTimer(d),onFocusOut:()=>this.resumeTimer(d)};this.active=d,s.addEventListener("pointerenter",d.onPointerEnter),s.addEventListener("pointerleave",d.onPointerLeave),s.addEventListener("focusin",d.onFocusIn),s.addEventListener("focusout",d.onFocusOut),this.applyToHost(s,e);const u=()=>{void 0!==this.active&&this.active.id===i&&(e.onAction?.(),this.dismissActive(d,"action"))};return d.onActionListener=u,s.addEventListener("lmvzAction",u,{once:!0}),s.show?.(),queueMicrotask((()=>s.setAttribute("message",e.message))),m>0&&this.scheduleTimer(d,m),{id:i,closed:r,dismiss:()=>{this.active?.id===i&&this.dismissActive(d,"manual")}}}dismiss(e){this.active&&(e&&this.active.id!==e||this.dismissActive(this.active,"manual"))}}export{v as SnackbarController}
|
package/components/lmvz-chip.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,h as o,d as r,t}from"./p-c7OzBK8f.js";import{A as s}from"./p-BJEQw1Sz.js";import{R as a}from"./p-0P2Wb3pE.js";import{i as l}from"./p-CdDO7mQa.js";const c=["xs","sm","md","lg"],n=[...c,"xl"],i=["text","email","password","tel","url","search","number"],m=[...c,"inherit"],
|
|
1
|
+
import{p as e,h as o,d as r,t}from"./p-c7OzBK8f.js";import{A as s}from"./p-BJEQw1Sz.js";import{R as a}from"./p-0P2Wb3pE.js";import{i as l}from"./p-CdDO7mQa.js";const c=["xs","sm","md","lg"],n=[...c,"xl"],i=["text","email","password","tel","url","search","number"],m=["sm","md","lg"],v=[...c,"inherit"],d=["thin","medium","bold"],p=["active","warning","success","error","neutral"],u=["default","small"],h=e(class extends a{ariaValidationController=new s(this);beforeSlot;defaultSlot;afterSlot;get el(){return this}get validationEl(){return this.el}type="active";size="default";constructor(e){super(!1),!1!==e&&this.__registerHost(),this.__attachShadow(),this.addController(this.ariaValidationController)}normalizeType(e){const o=p.includes(e)?e:"active";o!==this.type&&(this.type=o)}normalizeSize(e){const o=u.includes(e)?e:"default";o!==this.size&&(this.size=o)}componentWillLoad(){this.normalizeType(this.type),this.normalizeSize(this.size),super.componentWillLoad()}connectedCallback(){super.connectedCallback(),this.checkContent()}checkContent=function(e){let o;return()=>{void 0!==o&&window.clearTimeout(o),o=window.setTimeout((()=>{e(),o=void 0}),500)}}((()=>{l()&&([...this.beforeSlot?.assignedElements()??[],...this.defaultSlot?.assignedElements()??[],...this.afterSlot?.assignedElements()??[]].length||console.warn("LmvzChip has no assigned content. Please add content to the default slot or the before-text/after-text slots."))}));render(){return o(r,{key:"70654d69189e77f9356853a921366083b2c4b969",type:this.type,size:this.size},o("slot",{key:"c7e667b93166286fe68a812dd8eec82885e3fc5e",name:"before-text",ref:e=>this.beforeSlot=e,onSlotchange:()=>this.checkContent()}),o("span",{key:"af38dd0429b42685a114e26175ce42d09f5fdcc1",class:"content-overflow-wrapper"},o("slot",{key:"924158498d65b9ac7c912b6b1a479016176e0b78",ref:e=>this.defaultSlot=e,onSlotchange:()=>this.checkContent()})),o("slot",{key:"9ff0394dbfb2131fafe513d0f2d8ce26c7781f20",name:"after-text",ref:e=>this.afterSlot=e,onSlotchange:()=>this.checkContent()}))}static get watchers(){return{type:[{normalizeType:0}],size:[{normalizeSize:0}]}}static get style(){return":host { --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-neutral-subtle, #d4d4d4); --lmvz-chip-background-color: var(--lmvz-semantic-color-status-neutral, #fcfcfc); --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-neutral, #545454); padding-block: var(--lmvz-dimension-4-6, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem)); padding-inline: var(--lmvz-dimension-8-10, clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem)); border: 1px solid var(--lmvz-chip-border-color); border-radius: var(--lmvz-semantic-border-radius-round, 999px); font: var(--lmvz-typography-body-xs-strong, 500 clamp(0.63rem, 0.61rem + 0.06vw, 0.69rem) / 1.5 Router); background-color: var(--lmvz-chip-background-color); color: var(--lmvz-chip-foreground-color); display: inline-flex; align-items: center; justify-content: center; gap: var(--lmvz-dimension-4-6, clamp(0.25rem, 0.22rem + 0.13vw, 0.38rem)); box-sizing: border-box; max-width: 100%; overflow: hidden; white-space: nowrap; > .content-overflow-wrapper { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } :host([size='small']) { padding-block: var(--lmvz-dimension-2-4, clamp(0.13rem, 0.09rem + 0.13vw, 0.25rem)); padding-inline: var(--lmvz-dimension-6-8, clamp(0.38rem, 0.34rem + 0.13vw, 0.5rem)); font: var(--lmvz-typography-body-2xs-strong, 500 clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem) / 1.5 Router); gap: var(--lmvz-dimension-2-4, clamp(0.13rem, 0.09rem + 0.13vw, 0.25rem)); } ::slotted(*) { display: inline; white-space: inherit; } ::slotted(lmvz-icon) { --lmvz-component-color: var(--lmvz-chip-foreground-color); --lmvz-component-size: var(--lmvz-dimension-12-14, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); } :host([size='small']) ::slotted(lmvz-icon) { --lmvz-component-size: var(--lmvz-dimension-10-12, clamp(0.63rem, 0.59rem + 0.13vw, 0.75rem)); } :host([type='active']) { --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-active-subtle, #c1e6fa); --lmvz-chip-background-color: var(--lmvz-semantic-color-status-active, #f6fbfe); --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-active, #0e7ab4); } :host([type='warning']) { --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-warning-subtle, #ffdf75); --lmvz-chip-background-color: var(--lmvz-semantic-color-status-warning, #fffbf0); --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-warning, #7a5e00); } :host([type='success']) { --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-success-subtle, #a5dad3); --lmvz-chip-background-color: var(--lmvz-semantic-color-status-success, #f1f9f8); --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-success, #37867c); } :host([type='error']) { --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-danger-subtle, #f7bfc2); --lmvz-chip-background-color: var(--lmvz-semantic-color-status-danger, #fdf1f2); --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-danger, #e52a31); } :host([type='neutral']) { --lmvz-chip-border-color: var(--lmvz-semantic-color-status-on-neutral-subtle, #d4d4d4); --lmvz-chip-background-color: var(--lmvz-semantic-color-status-neutral, #fcfcfc); --lmvz-chip-foreground-color: var(--lmvz-semantic-color-status-on-neutral, #545454); } "}},[769,"lmvz-chip",{type:[1537],size:[1537]},void 0,{type:[{normalizeType:0}],size:[{normalizeSize:0}]}]),z=h,f=function(){"undefined"!=typeof customElements&&["lmvz-chip"].forEach((e=>{"lmvz-chip"===e&&(customElements.get(t(e))||customElements.define(t(e),h))}))};export{z as LmvzChip,p as a,d as b,u as c,m as d,f as defineCustomElement,i as e,v as i,n as t}
|
package/components/lmvz-input.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as t,c as e,h as r,t as i}from"./p-c7OzBK8f.js";import{c as o}from"./p-BfTCfPZ1.js";import{A as a}from"./p-BJEQw1Sz.js";import{c as l}from"./p-DOTK1OW3.js";import{R as n}from"./p-0P2Wb3pE.js";let s=0;const c=t(class extends n{get el(){return this}get validationEl(){return this.el}lmvzInput;internals;nativeInputElement;inputId="lmvz-input-"+s++;initialValue="";nativeError=!1;errorFromProp=!1;get helperId(){return this.helperText?this.inputId+"-helper":void 0}get showErrorMessage(){return this.error&&!!this.errorMessage}get errorId(){return this.inputId+"-error"}get describedBy(){const t=[];return this.helperId&&t.push(this.helperId),this.showErrorMessage&&t.push(this.errorId),t.length>0?t.join(" "):void 0}value;label;helperText;placeholder;disabled=!1;readonly=!1;required=!1;name;type="text";errorMessage;autocomplete;inputmode;autocorrect;autocapitalize;spellcheck;autofocus=!1;minlength;maxlength;pattern;min;max;step;form;get error(){return this.errorFromProp||this.nativeError}set error(t){this.errorFromProp=t}async setValue(t){const e=this.nativeInputElement,r=t??"";e&&(e.value=r),this.value=r,this.internals.setFormValue?.(r),this.lmvzInput.emit(r)}async focusInput(){this.nativeInputElement?.focus()}async blurInput(){this.nativeInputElement?.blur()}async select(){this.nativeInputElement?.select()}async checkValidity(){return this.nativeInputElement?.checkValidity?.()??!1}async reportValidity(){return this.nativeInputElement?.reportValidity?.()??!1}async getInputElement(){return this.nativeInputElement||await new Promise((t=>l(this.el,t))),Promise.resolve(this.nativeInputElement)}constructor(t){super(!1),!1!==t&&this.__registerHost(),this.lmvzInput=e(this,"lmvzInput",7),this.internals=this.attachInternals(),this.addController(new a(this,{reValidateOnPropChanges:!0}))}componentWillLoad(){this.initialValue=this.value??"",super.componentWillLoad()}formAssociatedCallback(t){t&&this.internals.setFormValue?.(this.value??"")}formResetCallback(){this.internals.setValidity({}),this.setValue(this.initialValue)}formStateRestoreCallback(t){this.setValue(t)}handleValueChange(t){this.nativeInputElement&&(this.nativeInputElement.value===t||this.setValue(t))}handleDisabledChange(t){t&&this.nativeInputElement&&this.nativeInputElement.blur()}handleInput=t=>{this.setValue(t.target.value)};handleChange=t=>{this.updateNativeError(t.target??this.nativeInputElement)};handleFocus=()=>{};handleBlur=t=>{const e=t.target;e.reportValidity?.()};updateNativeError(t){const e=t??this.nativeInputElement;e&&(this.nativeError=!(e.checkValidity?.()??1))}render(){const t=!!this.value,e=t||!!this.placeholder;return r("div",{key:"b8c3aaccafb89725aaa157a72633c67ae8b4d58c",class:o("input-container",{"interaction-filled":t})},r("div",{key:"80261c486d3bfe61aa060d50e9a6774c961339a1",class:"input-wrapper"},r("slot",{key:"6856dd64991251adc63d8064ed63e9cf7b1773a2",name:"before-input"}),r("div",{key:"c975357079efef465c56fb50cbb404bd1cbe3fb1",class:"label-input-group"},r("label",{key:"798417172f8411be97866edbffbd2bb98c308c69",htmlFor:this.inputId,class:o({floating:e})},this.label,this.required&&r("span",{key:"9fd59f3d93c984304e6c8ae6531df82bc0057243",class:"required-indicator","aria-hidden":"true"}," ","*")),r("input",{key:"a4e1133b4891c01044365eb3c97ee234c84c9bac",id:this.inputId,ref:t=>this.nativeInputElement=t,type:this.type,min:this.min,max:this.max,step:this.step,value:this.value,name:this.name,placeholder:this.placeholder,disabled:this.disabled,readOnly:this.readonly,required:this.required,form:this.form,autocomplete:this.autocomplete,inputmode:this.inputmode,autocorrect:this.autocorrect,autocapitalize:this.autocapitalize,spellcheck:this.spellcheck,autofocus:this.autofocus,minlength:this.minlength,maxlength:this.maxlength,pattern:this.pattern,"aria-invalid":this.error?"true":"false","aria-required":this.required?"true":"false","aria-describedby":this.describedBy,"aria-errormessage":this.errorId,onInput:this.handleInput,onChange:this.handleChange,onFocus:this.handleFocus,onBlur:this.handleBlur})),r("slot",{key:"c774f03e704889b524f305c00d60c0902abdff5f",name:"after-input"})),r("div",{key:"f513746541c71ce0d67c26eb220b54408fc3f136",id:this.helperId,role:"status"},this.helperText||null),r("div",{key:"197683e55807bf100ca1543f5b84b14e910e721f",id:this.errorId,role:"alert"},this.showErrorMessage&&this.errorMessage||null))}static get formAssociated(){return!0}static get watchers(){return{value:[{handleValueChange:0}],disabled:[{handleDisabledChange:0}]}}static get style(){return"@layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } .sc-lmvz-input-h { display: block; font-family: var(--lmvz-global-font-family-default, Router); --input-radius: var(--lmvz-component-input-radius-default, 999px); --input-bg: var(--lmvz-semantic-color-surface-input-primary, #ffffff); --input-border-color: var(--lmvz-semantic-color-border-default, #e0e0e0); --input-border-color-hover: var(--lmvz-semantic-color-border-hover, #c7c7c7); --input-border-color-focus: var(--lmvz-semantic-color-status-on-active, #0e7ab4); --input-border-width: var(--lmvz-semantic-border-width-default, 1px); --input-height: 48px; --input-padding-x: 16px; --label-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454); --input-text-color: var(--lmvz-semantic-color-on-surface-input-primary, #000000); --helper-text-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454); --error-text-color: var(--lmvz-semantic-color-status-on-danger, #e52a31); --label-floating-scale: 0.85; --label-minimized-top: -6px; --label-minimized-bg: var(--input-bg); --label-minimized-padding-x: 4px; --input-disabled-opacity: var(--lmvz-component-input-disabled-opacity, 40%); } .input-container.sc-lmvz-input { display: flex; flex-direction: column; position: relative; width: 100%; } .input-wrapper.sc-lmvz-input { background-color: var(--input-bg); border: var(--input-border-width) solid var(--input-border-color); border-radius: var(--input-radius); display: flex; align-items: center; height: var(--input-height); padding: 0 var(--input-padding-x); position: relative; transition: border-color 0.2s ease; gap: 8px; } [disabled].sc-lmvz-input-h .input-wrapper.sc-lmvz-input { opacity: var(--input-disabled-opacity); cursor: not-allowed; pointer-events: none; } .input-container.sc-lmvz-input:focus-within .input-wrapper.sc-lmvz-input { outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); } [error].sc-lmvz-input-h .input-wrapper.sc-lmvz-input { border-color: var(--error-text-color); } [error].sc-lmvz-input-h:focus-within .input-wrapper.sc-lmvz-input { border-color: var(--error-text-color); outline-color: var(--error-text-color); } .sc-lmvz-input-h:not([disabled]) .input-wrapper.sc-lmvz-input:hover { border-color: var(--input-border-color-hover); } .label-input-group.sc-lmvz-input { position: relative; flex-grow: 1; display: flex; align-items: center; height: 100%; } label.sc-lmvz-input { position: absolute; left: 0; top: 50%; transform: translateY(-50%); color: var(--label-color); font-size: 14px; font-family: Router, sans-serif; font-weight: 400; pointer-events: none; transition: all 0.2s ease-out; background-color: transparent; padding: 0; margin: 0; line-height: normal; white-space: nowrap; } label.floating.sc-lmvz-input { top: 0; transform: translateY(-50%) scale(0.85); transform-origin: left top; background-color: var(--label-minimized-bg); padding: 0 var(--label-minimized-padding-x); left: -2px; color: var(--input-text-color); font-weight: 500; } .required-indicator.sc-lmvz-input { color: var(--error-text-color); margin-left: 2px; } input.sc-lmvz-input { border: none; background: transparent; width: 100%; height: 100%; color: var(--input-text-color); font-family: inherit; font-size: 14px; outline: none; padding: 0; margin: 0; font-weight: 400; } input.sc-lmvz-input::placeholder { color: var(--label-color); } div.sc-lmvz-input:empty { display: none; } [role='status'].sc-lmvz-input { padding-top: 8px; padding-left: 12px; font-size: 12px; color: var(--helper-text-color); font-family: Router, sans-serif; font-weight: 500; } [role='alert'].sc-lmvz-input { padding-top: 8px; padding-left: 12px; font-size: 12px; color: var(--error-text-color); font-family: Router, sans-serif; font-weight: 500; } .sc-lmvz-input-s > lmvz-button { --lmvz-button-padding: 4px; }"}},[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],error:[6660],nativeError:[32],setValue:[64],focusInput:[64],blurInput:[64],select:[64],checkValidity:[64],reportValidity:[64],getInputElement:[64]},void 0,{value:[{handleValueChange:0}],disabled:[{handleDisabledChange:0}]}]),p=c,u=function(){"undefined"!=typeof customElements&&["lmvz-input"].forEach((t=>{"lmvz-input"===t&&(customElements.get(i(t))||customElements.define(i(t),c))}))};export{p as LmvzInput,u as defineCustomElement}
|
|
1
|
+
import{p as e,c as t,h as r,t as i}from"./p-c7OzBK8f.js";import{c as a}from"./p-BfTCfPZ1.js";import{A as o}from"./p-BJEQw1Sz.js";import{c as n}from"./p-DOTK1OW3.js";import{R as l}from"./p-0P2Wb3pE.js";let s=0;const p=e(class extends l{get el(){return this}get validationEl(){return this.el}lmvzInput;internals;nativeInputElement;inputId="lmvz-input-"+s++;initialValue="";nativeError=!1;errorFromProp=!1;get helperId(){return this.helperText?this.inputId+"-helper":void 0}get showErrorMessage(){return this.error&&!!this.errorMessage}get errorId(){return this.inputId+"-error"}get describedBy(){const e=[];return this.helperId&&e.push(this.helperId),this.showErrorMessage&&e.push(this.errorId),e.length>0?e.join(" "):void 0}value;label;helperText;placeholder;disabled=!1;readonly=!1;required=!1;name;type="text";errorMessage;autocomplete;inputmode;autocorrect;autocapitalize;spellcheck;autofocus=!1;minlength;maxlength;pattern;min;max;step;form;size="md";get error(){return this.errorFromProp||this.nativeError}set error(e){this.errorFromProp=e}async setValue(e){const t=this.nativeInputElement,r=e??"";t&&(t.value=r),this.value=r,this.internals.setFormValue?.(r),this.lmvzInput.emit(r)}async focusInput(){this.nativeInputElement?.focus()}async blurInput(){this.nativeInputElement?.blur()}async select(){this.nativeInputElement?.select()}async checkValidity(){return this.nativeInputElement?.checkValidity?.()??!1}async reportValidity(){return this.nativeInputElement?.reportValidity?.()??!1}async getInputElement(){return this.nativeInputElement||await new Promise((e=>n(this.el,e))),Promise.resolve(this.nativeInputElement)}constructor(e){super(!1),!1!==e&&this.__registerHost(),this.lmvzInput=t(this,"lmvzInput",7),this.internals=this.attachInternals(),this.addController(new o(this,{reValidateOnPropChanges:!0}))}componentWillLoad(){this.initialValue=this.value??"",super.componentWillLoad()}formAssociatedCallback(e){e&&this.internals.setFormValue?.(this.value??"")}formResetCallback(){this.internals.setValidity({}),this.setValue(this.initialValue)}formStateRestoreCallback(e){this.setValue(e)}handleValueChange(e){this.nativeInputElement&&(this.nativeInputElement.value===e||this.setValue(e))}handleDisabledChange(e){e&&this.nativeInputElement&&this.nativeInputElement.blur()}handleInput=e=>{this.setValue(e.target.value)};handleChange=e=>{this.updateNativeError(e.target??this.nativeInputElement)};handleFocus=()=>{};handleBlur=e=>{const t=e.target;t.reportValidity?.()};updateNativeError(e){const t=e??this.nativeInputElement;t&&(this.nativeError=!(t.checkValidity?.()??1))}render(){const e=!!this.value,t=e||!!this.placeholder;return r("div",{key:"4be6846147fec950acad0c0cb8643bfa69233935",class:a("input-container",{"interaction-filled":e})},r("div",{key:"ae9bf8ffd91b73a86c2ebd21af051efe26a1d5fd",class:"input-wrapper"},r("slot",{key:"36b3f7d97a11296aeead44c4d8ab4f0f8edf62d1",name:"before-input"}),r("div",{key:"4320f461ffa908730cd898863f43644aa3677081",class:"label-input-group"},r("label",{key:"1dd51cf16f064303fd9c5249cbe3a357c7515ddc",htmlFor:this.inputId,class:a({floating:t})},this.label,this.required&&r("span",{key:"74bb8124b1126501201eb7c3361c6cf7f17dda5c",class:"required-indicator","aria-hidden":"true"}," ","*")),r("input",{key:"9cff77bea65c50331a6804d7039672bbe01e710c",id:this.inputId,ref:e=>this.nativeInputElement=e,type:this.type,min:this.min,max:this.max,step:this.step,value:this.value,name:this.name,placeholder:this.placeholder,disabled:this.disabled,readOnly:this.readonly,required:this.required,form:this.form,autocomplete:this.autocomplete,inputmode:this.inputmode,autocorrect:this.autocorrect,autocapitalize:this.autocapitalize,spellcheck:this.spellcheck,autofocus:this.autofocus,minlength:this.minlength,maxlength:this.maxlength,pattern:this.pattern,"aria-invalid":this.error?"true":"false","aria-required":this.required?"true":"false","aria-describedby":this.describedBy,"aria-errormessage":this.errorId,onInput:this.handleInput,onChange:this.handleChange,onFocus:this.handleFocus,onBlur:this.handleBlur})),r("slot",{key:"689a3aa53e22f89173893adbc72eaf4953a2c7f6",name:"after-input"})),r("div",{key:"d29b9ea209c138d0de09f71042f539a56ed4f9fa",id:this.helperId,role:"status"},this.helperText||null),r("div",{key:"8be227367abadb0e001d9475f0793aed31dbb64a",id:this.errorId,role:"alert"},this.showErrorMessage&&this.errorMessage||null))}static get formAssociated(){return!0}static get watchers(){return{value:[{handleValueChange:0}],disabled:[{handleDisabledChange:0}]}}static get style(){return"@layer lmvz-ds.reset, lmvz-ds.theme, lmvz-ds.components, lmvz-ds.overrides; @layer lmvz-ds.theme { @font-face { font-family: Router; src: local('RouterBook-Regular'), local('Router-Book'), url('/assets/fonts/Router-Book.woff') format('woff'); font-weight: 400; } @font-face { font-family: Router; src: local('RouterMedium-Regular'), local('Router-Medium'), url('/assets/fonts/Router-Medium.woff') format('woff'); font-weight: 500; } @font-face { font-family: Router; src: local('RouterBold-Regular'), local('Router-Bold'), url('/assets/fonts/Router-Bold.woff') format('woff'); font-weight: 700; } } .sc-lmvz-input-h { display: block; font-family: var(--lmvz-global-font-family-default, Router); --input-radius: var(--lmvz-component-input-radius-default, 999px); --input-bg: var(--lmvz-semantic-color-surface-input-primary, #ffffff); --input-border-color: var(--lmvz-semantic-color-border-default, #e0e0e0); --input-border-color-hover: var(--lmvz-semantic-color-border-hover, #c7c7c7); --input-border-color-focus: var(--lmvz-semantic-color-border-active, #0f8acc); --input-border-width: var(--lmvz-semantic-border-width-default, 1px); --input-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --input-padding-x: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --input-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --input-font-size: var(--lmvz-component-body-md-font-size, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --label-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454); --input-text-color: var(--lmvz-semantic-color-on-surface-input-primary, #000000); --helper-text-color: var(--lmvz-semantic-color-on-surface-input-secondary, #545454); --error-text-color: var(--lmvz-semantic-color-status-on-danger, #e52a31); --label-minimized-bg: var(--input-bg); --label-minimized-padding-x: 4px; --input-disabled-opacity: var(--lmvz-component-input-disabled-opacity, 40%); } [size='sm'].sc-lmvz-input-h { --input-height: var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem)); --input-padding-x: var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem)); --input-gap: var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem)); --input-font-size: var(--lmvz-component-body-sm-font-size, clamp(0.69rem, 0.67rem + 0.06vw, 0.75rem)); } [size='md'].sc-lmvz-input-h { --input-height: var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem)); --input-padding-x: var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); --input-gap: var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem)); --input-font-size: var(--lmvz-component-body-md-font-size, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)); } [size='lg'].sc-lmvz-input-h { --input-height: var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem)); --input-padding-x: var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)); --input-gap: var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem)); --input-font-size: var(--lmvz-component-body-lg-font-size, clamp(1rem, 0.97rem + 0.13vw, 1.13rem)); } .input-container.sc-lmvz-input { display: flex; flex-direction: column; position: relative; width: 100%; } .input-wrapper.sc-lmvz-input { background-color: var(--input-bg); border: var(--input-border-width) solid var(--input-border-color); border-radius: var(--input-radius); display: flex; align-items: center; height: var(--input-height); padding: 0 var(--input-padding-x); position: relative; transition: border-color 0.2s ease; gap: var(--input-gap); } [disabled].sc-lmvz-input-h .input-wrapper.sc-lmvz-input { opacity: var(--input-disabled-opacity); cursor: not-allowed; pointer-events: none; } .input-container.sc-lmvz-input:focus-within .input-wrapper.sc-lmvz-input { border-color: var(--input-border-color-focus); outline: var(--lmvz-ds-outline, 1px solid #0e7ab4); outline-offset: var(--lmvz-ds-outline-offset, clamp(0.25rem, 0.19rem + 0.26vw, 0.5rem)); } [error].sc-lmvz-input-h .input-wrapper.sc-lmvz-input { border-color: var(--error-text-color); } .sc-lmvz-input-h:not([disabled]) .input-wrapper.sc-lmvz-input:hover { border-color: var(--input-border-color-hover); } .label-input-group.sc-lmvz-input { position: relative; flex-grow: 1; display: flex; align-items: center; height: 100%; } label.sc-lmvz-input { position: absolute; left: 0; top: 50%; transform: translateY(-50%); color: var(--label-color); font-size: var(--input-font-size); font-weight: 400; pointer-events: none; transition: all 0.2s ease-out; background-color: transparent; padding: 0; margin: 0; line-height: 1.5; white-space: nowrap; } label.floating.sc-lmvz-input { top: 0.5em; transform: translateY(-100%); transform-origin: left top; font-size: var(--lmvz-component-body-2xs-font-size, clamp(0.5rem, 0.47rem + 0.13vw, 0.63rem)); background-color: var(--label-minimized-bg); padding: 0 var(--label-minimized-padding-x); left: -2px; color: var(--input-text-color); font-weight: 400; } .required-indicator.sc-lmvz-input { color: var(--error-text-color); margin-left: 2px; } input.sc-lmvz-input { border: none; background: transparent; width: 100%; height: 100%; color: var(--input-text-color); font-family: inherit; font-size: var(--input-font-size); outline: none; padding: 0; margin: 0; font-weight: 400; } input.sc-lmvz-input::placeholder { color: var(--label-color); } div.sc-lmvz-input:empty { display: none; } [role='status'].sc-lmvz-input { padding-top: 8px; padding-left: var(--input-padding-x); font-size: 12px; color: var(--helper-text-color); font-weight: 400; } [role='alert'].sc-lmvz-input { padding-top: 8px; padding-left: var(--input-padding-x); font-size: 12px; color: var(--error-text-color); font-weight: 400; } .sc-lmvz-input-s > lmvz-button { --lmvz-button-padding: 4px; }"}},[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],getInputElement:[64]},void 0,{value:[{handleValueChange:0}],disabled:[{handleDisabledChange:0}]}]),m=p,c=function(){"undefined"!=typeof customElements&&["lmvz-input"].forEach((e=>{"lmvz-input"===e&&(customElements.get(i(e))||customElements.define(i(e),p))}))};export{m as LmvzInput,c as defineCustomElement}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
const sizes = ['xs', 'sm', 'md', 'lg'];
|
|
2
2
|
const textSizes = [...sizes, 'xl'];
|
|
3
3
|
const inputTypes = ['text', 'email', 'password', 'tel', 'url', 'search', 'number'];
|
|
4
|
+
const inputSizes = ['sm', 'md', 'lg'];
|
|
4
5
|
const iconSizes = [...sizes, 'inherit'];
|
|
5
6
|
const iconWeights = ['thin', 'medium', 'bold'];
|
|
6
7
|
const chipTypes = ['active', 'warning', 'success', 'error', 'neutral'];
|
|
7
8
|
const chipSizes = ['default', 'small'];
|
|
8
9
|
|
|
9
|
-
export { chipTypes as a, iconWeights as b, chipSizes as c,
|
|
10
|
+
export { chipTypes as a, iconWeights as b, chipSizes as c, inputSizes as d, inputTypes as e, iconSizes as i, textSizes as t };
|
package/esm/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export { A as ARIA_VALIDATION_RUNTIME_CHANGED_EVENT, d as disableAriaValidation, e as enableAriaValidation, i as isAriaValidationEnabled, q as queueValidation, u as useVerboseLogging } from './aria-loader-GfsGHZHY.js';
|
|
2
|
-
export { c as chipSizes, a as chipTypes, i as iconSizes, b as iconWeights, d as inputTypes, t as textSizes } from './ds.constants-
|
|
2
|
+
export { c as chipSizes, a as chipTypes, i as iconSizes, b as iconWeights, d as inputSizes, e as inputTypes, t as textSizes } from './ds.constants-HeV_qTCr.js';
|
|
3
3
|
export { g as getRegisteredIconProvider, r as registerIconProvider, t as typedIconFromSet } from './icons-CmuFKDRz.js';
|
|
4
4
|
import './svg-B2YoIRuh.js';
|
|
5
5
|
import './logger-CGmJG63p.js';
|
package/esm/lmvz-chip.entry.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { g as getElement, r as registerInstance, h, H as Host } from './index-CKYszC64.js';
|
|
2
|
-
import { a as chipTypes, c as chipSizes } from './ds.constants-
|
|
2
|
+
import { a as chipTypes, c as chipSizes } from './ds.constants-HeV_qTCr.js';
|
|
3
3
|
import { A as AriaValidationController } from './aria-validation-controller-D-KO0Asb.js';
|
|
4
4
|
import { R as ReactiveControllerHost } from './reactive-controller-host-FBuCCcFC.js';
|
|
5
5
|
import { i as isAriaValidationEnabled } from './aria-loader-GfsGHZHY.js';
|
package/esm/lmvz-components.js
CHANGED
|
@@ -17,5 +17,5 @@ var patchBrowser = () => {
|
|
|
17
17
|
|
|
18
18
|
patchBrowser().then(async (options) => {
|
|
19
19
|
await globalScripts();
|
|
20
|
-
return bootstrapLazy([["lmvz-modal",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-snackbar",[[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-header_2",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action",[[257,"lmvz-action"]]],["lmvz-card",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox",[[578,"lmvz-checkbox",{"label":[1],"checked":[1540],"value":[1],"name":[1],"disabled":[516],"required":[516],"error":[516],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},null,{"checked":[{"handleCheckedChange":0}]}]]],["lmvz-chip",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-input",[[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],"error":[6660],"nativeError":[32],"setValue":[64],"focusInput":[64],"blurInput":[64],"select":[64],"checkValidity":[64],"reportValidity":[64],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-menuitem",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-radio",[[578,"lmvz-radio",{"label":[1],"checked":[1540],"value":[1],"name":[1],"disabled":[516],"required":[516],"error":[516],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-select",[[774,"lmvz-select",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"disabled":[516],"required":[516],"name":[1],"selectedLabel":[32]},null,{"value":[{"handleValueChange":0}]}]]],["lmvz-tab",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"vertical":[516]}]]],["lmvz-tabs",[[769,"lmvz-tabs",{"value":[1537],"orientation":[1537],"resolvedValue":[32],"activateTab":[64],"getTabElements":[64],"setTabPanelIds":[64]},null,{"value":[{"handleValueChange":0}],"orientation":[{"handleOrientationChange":0}]}]]],["lmvz-toggle",[[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],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button-group",[[257,"lmvz-button-group",{"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-button_2",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1]}],[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);
|
|
20
|
+
return bootstrapLazy([["lmvz-modal",[[769,"lmvz-modal",{"open":[1540],"closeLabel":[1,"close-label"],"hasHeader":[32]},[[0,"submit","handleFormDialogSubmit"]],{"open":[{"handleOpenChange":0}]}]]],["lmvz-snackbar",[[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-header_2",[[769,"lmvz-header",{"role":[2561],"lmvzActiveNav":[1,"lmvz-active-nav"]},null,{"lmvzActiveNav":[{"handleActiveNavChange":0}]}],[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-action",[[257,"lmvz-action"]]],["lmvz-card",[[774,"lmvz-card",{"cardTitle":[1,"card-title"],"imageUrl":[1,"image-url"],"description":[1],"primaryActionLabel":[1,"primary-action-label"]}]]],["lmvz-checkbox",[[578,"lmvz-checkbox",{"label":[1],"checked":[1540],"value":[1],"name":[1],"disabled":[516],"required":[516],"error":[516],"errorMessage":[1,"error-message"],"helperText":[1,"helper-text"],"form":[1],"autofocus":[4],"checkedState":[32],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},null,{"checked":[{"handleCheckedChange":0}]}]]],["lmvz-chip",[[769,"lmvz-chip",{"type":[1537],"size":[1537]},null,{"type":[{"normalizeType":0}],"size":[{"normalizeSize":0}]}]]],["lmvz-input",[[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],"getInputElement":[64]},null,{"value":[{"handleValueChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-menuitem",[[774,"lmvz-menuitem",{"role":[2561],"ti":[2562,"tabindex"]}]]],["lmvz-radio",[[578,"lmvz-radio",{"label":[1],"checked":[1540],"value":[1],"name":[1],"disabled":[516],"required":[516],"error":[516],"helperText":[1,"helper-text"],"form":[513],"autofocus":[4],"focusInput":[64],"checkValidity":[64],"reportValidity":[64]},[[0,"keydown","handleKeydown"]],{"checked":[{"handleCheckedChange":0}],"value":[{"handleValueChange":0}],"label":[{"handleLabelChange":0}]}]]],["lmvz-select",[[774,"lmvz-select",{"value":[1025],"label":[1],"helperText":[1,"helper-text"],"disabled":[516],"required":[516],"name":[1],"selectedLabel":[32]},null,{"value":[{"handleValueChange":0}]}]]],["lmvz-tab",[[785,"lmvz-tab",{"value":[513],"disabled":[516],"selected":[516],"vertical":[516]}]]],["lmvz-tabs",[[769,"lmvz-tabs",{"value":[1537],"orientation":[1537],"resolvedValue":[32],"activateTab":[64],"getTabElements":[64],"setTabPanelIds":[64]},null,{"value":[{"handleValueChange":0}],"orientation":[{"handleOrientationChange":0}]}]]],["lmvz-toggle",[[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],"getInputElement":[64]},null,{"checked":[{"handleCheckedChange":0}],"disabled":[{"handleDisabledChange":0}]}]]],["lmvz-button-group",[[257,"lmvz-button-group",{"primaryEnabledAction":[2064],"hasActions":[2052,"has-actions"]}]]],["lmvz-button_2",[[785,"lmvz-button",{"ti":[2562,"tabindex"],"scale":[513],"variant":[513],"disabled":[516],"type":[1],"form":[1],"formMethod":[1,"form-method"],"name":[1],"value":[1]}],[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);
|
|
21
21
|
});
|