@lmvz-ds/components 0.35.1 → 0.36.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 +16 -0
- package/assets/icons/calendar.svg +7 -0
- package/cjs/{aria-validation-controller-BC0Eaiv4.js → aria-validation-controller-Do0uEK4t.js} +1 -1
- package/cjs/{directional-focus-controller-DBat-oF7.js → directional-focus-controller-3uDoin45.js} +3 -1
- package/cjs/{element-activation-controller-BHqCUgQv.js → element-activation-controller-BWtUKzu2.js} +1 -1
- package/cjs/{element.util-CRS_YJ59.js → element.util-CctmBvUY.js} +14 -0
- package/cjs/{index-TGsVZNDP.js → index-BgvZ4y-3.js} +12 -0
- package/cjs/lmvz-action-list.cjs.entry.js +5 -5
- package/cjs/lmvz-action.cjs.entry.js +1 -1
- package/cjs/lmvz-button-group.cjs.entry.js +2 -2
- package/cjs/lmvz-button_2.cjs.entry.js +6 -6
- package/cjs/lmvz-card.cjs.entry.js +2 -2
- package/cjs/lmvz-checkbox.cjs.entry.js +2 -2
- package/cjs/lmvz-chip.cjs.entry.js +2 -2
- package/cjs/lmvz-components.cjs.js +2 -2
- package/cjs/lmvz-datepicker.cjs.entry.js +2764 -0
- package/cjs/lmvz-header_2.cjs.entry.js +6 -6
- package/cjs/{lmvz-popover.cjs.entry.js → lmvz-input_2.cjs.entry.js} +230 -11
- package/cjs/lmvz-link.cjs.entry.js +2 -2
- package/cjs/lmvz-menuitem.cjs.entry.js +5 -5
- package/cjs/lmvz-message.cjs.entry.js +2 -2
- package/cjs/lmvz-modal.cjs.entry.js +4 -4
- package/cjs/lmvz-radio.cjs.entry.js +3 -3
- package/cjs/lmvz-select.cjs.entry.js +3 -3
- package/cjs/lmvz-snackbar.cjs.entry.js +2 -2
- package/cjs/lmvz-spinner.cjs.entry.js +2 -2
- package/cjs/lmvz-tab.cjs.entry.js +2 -2
- package/cjs/lmvz-tabs.cjs.entry.js +4 -4
- package/cjs/lmvz-toggle.cjs.entry.js +4 -5
- package/cjs/loader.cjs.js +2 -2
- package/cjs/{async.util-Dnl6c82X.js → stencil.util-TjS8_DoU.js} +13 -1
- package/collection/assets/icons/calendar.svg +7 -0
- package/collection/collection-manifest.json +1 -0
- package/collection/components/lmvz-action-list/lmvz-action-list.css +1 -0
- package/collection/components/lmvz-button/lmvz-button.css +1 -0
- package/collection/components/lmvz-card/lmvz-card.css +1 -0
- package/collection/components/lmvz-datepicker/lmvz-datepicker.css +166 -0
- package/collection/components/lmvz-datepicker/lmvz-datepicker.js +988 -0
- package/collection/components/lmvz-datepicker/lmvz-datepicker.utils.js +189 -0
- package/collection/components/lmvz-datepicker/test/lmvz-datepicker.utils.unit.js +300 -0
- package/collection/components/lmvz-header/lmvz-header.js +1 -1
- package/collection/components/lmvz-icon/lmvz-icon.js +1 -1
- package/collection/components/lmvz-input/lmvz-input.css +2 -1
- package/collection/components/lmvz-input/lmvz-input.js +40 -2
- package/collection/components/lmvz-link/lmvz-link.js +1 -1
- package/collection/components/lmvz-menuitem/lmvz-menuitem.js +1 -1
- package/collection/components/lmvz-message/lmvz-message.js +1 -1
- package/collection/components/lmvz-modal/lmvz-modal.js +1 -1
- package/collection/components/lmvz-popover/lmvz-popover.js +6 -2
- package/collection/components/lmvz-radio/lmvz-radio.js +1 -1
- package/collection/components/lmvz-select/lmvz-select.js +1 -1
- package/collection/components/lmvz-snackbar/lmvz-snackbar.js +1 -1
- package/collection/components/lmvz-spinner/lmvz-spinner.js +1 -1
- package/collection/components/lmvz-tab/lmvz-tab.js +1 -1
- package/collection/components/lmvz-tabs/lmvz-tabs.js +1 -1
- package/collection/components/lmvz-toggle/lmvz-toggle.js +1 -1
- package/collection/integration/header-integration/header-integration.js +1 -1
- package/collection/utils/aria/aria.constants.js +7 -0
- package/collection/utils/aria/directional-focus-controller.js +3 -1
- package/collection/utils/element/element.util.js +5 -0
- package/components/index.d.ts +2 -0
- package/components/index.d.ts.bak +2 -0
- package/components/index.js +1 -1
- package/components/lmvz-action-list.js +1 -1
- package/components/lmvz-action.js +1 -1
- package/components/lmvz-button-group.js +1 -1
- package/components/lmvz-button.js +1 -1
- package/components/lmvz-card.js +1 -1
- package/components/lmvz-checkbox.js +1 -1
- package/components/lmvz-chip.js +1 -1
- package/components/lmvz-datepicker.d.ts +11 -0
- package/components/lmvz-datepicker.d.ts.bak +11 -0
- package/components/lmvz-datepicker.js +1 -0
- package/components/lmvz-header.js +1 -1
- package/components/lmvz-icon.js +1 -1
- package/components/lmvz-input.js +1 -1
- package/components/lmvz-link.js +1 -1
- package/components/lmvz-menuitem.js +1 -1
- package/components/lmvz-message.js +1 -1
- package/components/lmvz-modal.js +1 -1
- package/components/lmvz-popover.js +1 -1
- package/components/lmvz-radio.js +1 -1
- package/components/lmvz-select.js +1 -1
- package/components/lmvz-snackbar.js +1 -1
- package/components/lmvz-spinner.js +1 -1
- package/components/lmvz-tab.js +1 -1
- package/components/lmvz-tabs.js +1 -1
- package/components/lmvz-toggle.js +1 -1
- package/components/{p-Chj7BuUZ.js → p--FDdvoIg.js} +1 -1
- package/components/{p-CFTmV4XZ.js → p-BAj4FkUt.js} +1 -1
- package/components/{p-CxLd309t.js → p-BLMXiDE0.js} +1 -1
- package/components/{p-DGg7OzDl.js → p-BPYBmylI.js} +1 -1
- package/components/p-BhALzK62.js +1 -0
- package/components/p-Bnri3fEI.js +1 -0
- package/components/p-C-pRMuMh.js +1 -0
- package/components/p-CPuI0_r_.js +1 -0
- package/components/p-CWpl0WaZ.js +1 -0
- package/components/{p-D5FL8n1q.js → p-CrQCHVKL.js} +1 -1
- package/components/p-DqdrUt_G.js +1 -0
- package/components/{p-CgK6-SEe.js → p-diOze8wI.js} +1 -1
- package/esm/{aria-validation-controller-BvOU1BO8.js → aria-validation-controller-Cp6pofER.js} +1 -1
- package/esm/{directional-focus-controller-DgAdCZrG.js → directional-focus-controller-Bhu7RqYE.js} +3 -1
- package/esm/{element-activation-controller-7PNSl6io.js → element-activation-controller-BuwyVq4A.js} +1 -1
- package/esm/{element.util-BFcYfHYq.js → element.util-Bd9JyKJZ.js} +13 -1
- package/esm/{index-BPeerEwm.js → index-BOXP1Vx0.js} +12 -1
- package/esm/lmvz-action-list.entry.js +5 -5
- package/esm/lmvz-action.entry.js +1 -1
- package/esm/lmvz-button-group.entry.js +2 -2
- package/esm/lmvz-button_2.entry.js +6 -6
- package/esm/lmvz-card.entry.js +2 -2
- package/esm/lmvz-checkbox.entry.js +2 -2
- package/esm/lmvz-chip.entry.js +2 -2
- package/esm/lmvz-components.js +3 -3
- package/esm/lmvz-datepicker.entry.js +2762 -0
- package/esm/lmvz-header_2.entry.js +6 -6
- package/esm/{lmvz-popover.entry.js → lmvz-input_2.entry.js} +227 -9
- package/esm/lmvz-link.entry.js +2 -2
- package/esm/lmvz-menuitem.entry.js +5 -5
- package/esm/lmvz-message.entry.js +2 -2
- package/esm/lmvz-modal.entry.js +4 -4
- package/esm/lmvz-radio.entry.js +3 -3
- package/esm/lmvz-select.entry.js +3 -3
- package/esm/lmvz-snackbar.entry.js +2 -2
- package/esm/lmvz-spinner.entry.js +2 -2
- package/esm/lmvz-tab.entry.js +2 -2
- package/esm/lmvz-tabs.entry.js +4 -4
- package/esm/lmvz-toggle.entry.js +4 -5
- package/esm/loader.js +3 -3
- package/esm/{async.util-DZj20TV1.js → stencil.util-C3QOYC8E.js} +13 -1
- package/hydrate/index.js +3083 -241
- package/hydrate/index.mjs +3083 -241
- package/lmvz-components/lmvz-components.esm.js +1 -1
- package/lmvz-components/{p-eb62d4af.entry.js → p-0af0211a.entry.js} +1 -1
- package/lmvz-components/{p-0c05f24b.entry.js → p-3d5867df.entry.js} +1 -1
- package/lmvz-components/{p-a887018d.entry.js → p-492adf21.entry.js} +1 -1
- package/lmvz-components/{p-24d13be6.entry.js → p-4fa6e72f.entry.js} +1 -1
- package/lmvz-components/{p-5bbbcfc0.entry.js → p-544e3ccb.entry.js} +1 -1
- package/lmvz-components/{p-eb4c5a6f.entry.js → p-63f6a596.entry.js} +1 -1
- package/lmvz-components/p-7a7aa922.entry.js +1 -0
- package/lmvz-components/p-8022c6dc.entry.js +1 -0
- package/lmvz-components/{p-BPeerEwm.js → p-BOXP1Vx0.js} +2 -2
- package/lmvz-components/p-Bd9JyKJZ.js +1 -0
- package/lmvz-components/{p-D9PQIBzA.js → p-BeY96W7m.js} +1 -1
- package/lmvz-components/p-C3QOYC8E.js +1 -0
- package/lmvz-components/p-GGkwaiT6.js +1 -0
- package/lmvz-components/{p-wlMjNjuv.js → p-UhNgD4L3.js} +1 -1
- package/lmvz-components/{p-d4154a65.entry.js → p-a611c110.entry.js} +1 -1
- package/lmvz-components/{p-46edf36f.entry.js → p-b1bb4393.entry.js} +1 -1
- package/lmvz-components/p-b50b1cb5.entry.js +1 -0
- package/lmvz-components/{p-f42b16e6.entry.js → p-b932cf91.entry.js} +1 -1
- package/lmvz-components/p-bff115d4.entry.js +1 -0
- package/lmvz-components/p-d280d21a.entry.js +1 -0
- package/lmvz-components/{p-c2544495.entry.js → p-d48203f9.entry.js} +1 -1
- package/lmvz-components/{p-e4ce63b3.entry.js → p-d9aede81.entry.js} +1 -1
- package/lmvz-components/{p-ecbd9e93.entry.js → p-dbfbcb74.entry.js} +1 -1
- package/lmvz-components/p-f0e28f3a.entry.js +1 -0
- package/lmvz-components/{p-aaa7691c.entry.js → p-f853faae.entry.js} +1 -1
- package/lmvz-components/p-fa2efc42.entry.js +1 -0
- package/lmvz-components/{p-194a3af5.entry.js → p-fe6f5bdc.entry.js} +1 -1
- package/manifest.json +940 -159
- package/package.json +5 -1
- package/types/api/ds.constants.d.ts +0 -1
- package/types/api/ds.types.d.ts +8 -0
- package/types/components/lmvz-action/lmvz-action.d.ts +0 -1
- package/types/components/lmvz-action-list/lmvz-action-list.d.ts +0 -1
- package/types/components/lmvz-button/lmvz-button.d.ts +0 -1
- package/types/components/lmvz-button-group/lmvz-button-group.d.ts +0 -1
- package/types/components/lmvz-card/lmvz-card.d.ts +0 -1
- package/types/components/lmvz-checkbox/lmvz-checkbox.d.ts +0 -1
- package/types/components/lmvz-chip/lmvz-chip.d.ts +0 -1
- package/types/components/lmvz-datepicker/lmvz-datepicker.d.ts +75 -0
- package/types/components/lmvz-datepicker/lmvz-datepicker.utils.d.ts +22 -0
- package/types/components/lmvz-datepicker/test/lmvz-datepicker.utils.unit.d.ts +1 -0
- package/types/components/lmvz-header/lmvz-header.d.ts +0 -1
- package/types/components/lmvz-icon/lmvz-icon.d.ts +0 -1
- package/types/components/lmvz-input/lmvz-input.d.ts +5 -1
- package/types/components/lmvz-link/lmvz-link.d.ts +0 -1
- package/types/components/lmvz-menuitem/lmvz-menuitem.d.ts +0 -1
- package/types/components/lmvz-message/lmvz-message.d.ts +0 -1
- package/types/components/lmvz-message/public.d.ts +0 -1
- package/types/components/lmvz-modal/lmvz-modal.d.ts +0 -1
- package/types/components/lmvz-modal/test/testing.d.ts +0 -1
- package/types/components/lmvz-popover/lmvz-popover.d.ts +0 -1
- package/types/components/lmvz-radio/lmvz-radio.d.ts +0 -1
- package/types/components/lmvz-select/lmvz-select.d.ts +0 -1
- package/types/components/lmvz-snackbar/lmvz-snackbar.d.ts +0 -1
- package/types/components/lmvz-snackbar/public.d.ts +0 -1
- package/types/components/lmvz-snackbar/snackbar-controller.d.ts +0 -1
- package/types/components/lmvz-spinner/lmvz-spinner.d.ts +0 -1
- package/types/components/lmvz-tab/lmvz-tab.d.ts +0 -1
- package/types/components/lmvz-tabs/lmvz-tabs.d.ts +0 -1
- package/types/components/lmvz-toggle/lmvz-toggle.d.ts +0 -1
- package/types/components.d.ts +216 -0
- package/types/index.d.ts +0 -1
- package/types/utils/aria/aria-validation-controller.d.ts +0 -1
- package/types/utils/aria/aria.constants.d.ts +1 -1
- package/types/utils/aria/directional-focus-controller.d.ts +0 -1
- package/types/utils/aria/element-activation-controller.d.ts +0 -1
- package/types/utils/async/async.util.d.ts +1 -2
- package/types/utils/data/event.util.d.ts +0 -1
- package/types/utils/data/number.util.d.ts +0 -1
- package/types/utils/data/object.util.d.ts +0 -1
- package/types/utils/data/time.util.d.ts +0 -1
- package/types/utils/element/element.util.d.ts +1 -1
- package/types/utils/environment.d.ts +0 -1
- package/types/utils/icons/icons-registry.d.ts +0 -1
- package/types/utils/icons/icons.d.ts +0 -1
- package/types/utils/icons/icons.unit.d.ts +0 -1
- package/types/utils/icons/public.d.ts +0 -1
- package/types/utils/public.d.ts +0 -1
- package/types/utils/radio/radio-group-controller.d.ts +0 -1
- package/types/utils/stencil/assets.d.ts +0 -1
- package/types/utils/stencil/reactive-controller-host.d.ts +0 -1
- package/types/utils/stencil/stencil.util.d.ts +0 -1
- package/cjs/lmvz-input.cjs.entry.js +0 -186
- package/cjs/stencil.util-CBrPLd-F.js +0 -17
- package/components/p-BVzxNP7h.js +0 -1
- package/components/p-DLUsBYJH.js +0 -1
- package/components/p-zMWemcoB.js +0 -1
- package/esm/lmvz-input.entry.js +0 -184
- package/esm/stencil.util-D2-5rsN3.js +0 -15
- package/lmvz-components/p-4416d688.entry.js +0 -1
- package/lmvz-components/p-489d9912.entry.js +0 -1
- package/lmvz-components/p-5ff55ba9.entry.js +0 -1
- package/lmvz-components/p-888e04d7.entry.js +0 -1
- package/lmvz-components/p-9dc420e2.entry.js +0 -1
- package/lmvz-components/p-BFcYfHYq.js +0 -1
- package/lmvz-components/p-BuEA0MWd.js +0 -1
- package/lmvz-components/p-DZj20TV1.js +0 -1
- package/lmvz-components/p-af48eccb.entry.js +0 -1
- package/lmvz-components/p-bc237ab7.entry.js +0 -1
- package/lmvz-components/p-bh9cItsP.js +0 -1
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { Attributes, Button, FormRef } from '../../api';
|
|
2
|
+
export declare function isInputElement(element: unknown): boolean;
|
|
2
3
|
export declare function isActionButton(element: Element): element is HTMLButtonElement;
|
|
3
4
|
export declare function isLmvzButton(element?: Element): element is HTMLLmvzButtonElement;
|
|
4
5
|
export declare function isDisabledButton(element: HTMLButtonElement): boolean;
|
|
@@ -22,4 +23,3 @@ export declare function findFormByRef(form: FormRef, el: HTMLElement): HTMLFormE
|
|
|
22
23
|
export declare function isInteractiveElement(el: HTMLElement): boolean;
|
|
23
24
|
export declare function isHtmlElement(element: unknown): element is HTMLElement;
|
|
24
25
|
export {};
|
|
25
|
-
//# sourceMappingURL=element.util.d.ts.map
|
|
@@ -10,4 +10,3 @@ export declare function registerIconProvider<I extends KnownIconSetId>(id: I, pr
|
|
|
10
10
|
export declare function getRegisteredIconProvider<I extends KnownIconSetId>(id: I): IconProvider<KnownIconName<I>> | undefined;
|
|
11
11
|
export declare function getRegisteredIconProvider(id?: string | undefined): IconProvider<string> | undefined;
|
|
12
12
|
export {};
|
|
13
|
-
//# sourceMappingURL=icons-registry.d.ts.map
|
|
@@ -4,4 +4,3 @@ export type IconData = SVGString;
|
|
|
4
4
|
export declare function resolveIconSvg<I extends KnownIconSetId>(options: IconPropsForSet<I>): Promise<IconData>;
|
|
5
5
|
export declare function resolveIconSvg(options: IconPropsFallback): Promise<IconData>;
|
|
6
6
|
export declare function typedIconFromSet<S extends string>(iconset: S, icon: IconPropsForSetWithoutFallback<S>['icon']): IconPropsForSetWithoutFallback<S>;
|
|
7
|
-
//# sourceMappingURL=icons.d.ts.map
|
package/types/utils/public.d.ts
CHANGED
|
@@ -30,4 +30,3 @@ export declare class ReactiveControllerHost implements ComponentInterface {
|
|
|
30
30
|
}
|
|
31
31
|
export declare function registerLmvzComponentMetaInfo<K extends keyof LmvzComponentMeta>(el: HTMLElement, key: K, info: LmvzComponentMeta[K]): void;
|
|
32
32
|
export declare function getLmvzComponentMetaInfo<K extends keyof LmvzComponentMeta>(el: HTMLElement, key: K): LmvzComponentMeta[K] | undefined;
|
|
33
|
-
//# sourceMappingURL=reactive-controller-host.d.ts.map
|
|
@@ -4,4 +4,3 @@ type LazyLoadedComponent<T extends HTMLElement> = T & {
|
|
|
4
4
|
export declare const componentOnReady: <T extends HTMLElement>(stencilEl: T, callback: (el: T) => unknown) => void;
|
|
5
5
|
export declare const hasLazyBuild: <T extends HTMLElement>(stencilEl: T) => stencilEl is LazyLoadedComponent<T>;
|
|
6
6
|
export {};
|
|
7
|
-
//# sourceMappingURL=stencil.util.d.ts.map
|
|
@@ -1,186 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var index = require('./index-TGsVZNDP.js');
|
|
4
|
-
var index$1 = require('./index-Bp6Dd2i1.js');
|
|
5
|
-
var ariaValidationController = require('./aria-validation-controller-BC0Eaiv4.js');
|
|
6
|
-
var reactiveControllerHost = require('./reactive-controller-host-Bc6B_T45.js');
|
|
7
|
-
var stencil_util = require('./stencil.util-CBrPLd-F.js');
|
|
8
|
-
require('./aria-loader-DWUVcapD.js');
|
|
9
|
-
require('./async.util-Dnl6c82X.js');
|
|
10
|
-
|
|
11
|
-
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, #a1a1a1); --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, #a31419); --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.75rem, 0.72rem + 0.13vw, 0.88rem)); } [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; }`;
|
|
12
|
-
|
|
13
|
-
let inputIdCounter = 0;
|
|
14
|
-
const LmvzInput = class extends reactiveControllerHost.ReactiveControllerHost {
|
|
15
|
-
get el() { return index.getElement(this); }
|
|
16
|
-
get validationEl() {
|
|
17
|
-
return this.el;
|
|
18
|
-
}
|
|
19
|
-
lmvzInput;
|
|
20
|
-
internals;
|
|
21
|
-
nativeInputElement;
|
|
22
|
-
inputId = `lmvz-input-${inputIdCounter++}`;
|
|
23
|
-
initialValue = '';
|
|
24
|
-
nativeError = false;
|
|
25
|
-
errorFromProp = false;
|
|
26
|
-
get helperId() {
|
|
27
|
-
return this.helperText ? `${this.inputId}-helper` : undefined;
|
|
28
|
-
}
|
|
29
|
-
get showErrorMessage() {
|
|
30
|
-
return this.error && Boolean(this.errorMessage);
|
|
31
|
-
}
|
|
32
|
-
get errorId() {
|
|
33
|
-
return `${this.inputId}-error`;
|
|
34
|
-
}
|
|
35
|
-
get describedBy() {
|
|
36
|
-
const ids = [];
|
|
37
|
-
if (this.helperId)
|
|
38
|
-
ids.push(this.helperId);
|
|
39
|
-
if (this.showErrorMessage)
|
|
40
|
-
ids.push(this.errorId);
|
|
41
|
-
return ids.length > 0 ? ids.join(' ') : undefined;
|
|
42
|
-
}
|
|
43
|
-
value;
|
|
44
|
-
label;
|
|
45
|
-
helperText;
|
|
46
|
-
placeholder;
|
|
47
|
-
disabled = false;
|
|
48
|
-
readonly = false;
|
|
49
|
-
required = false;
|
|
50
|
-
name;
|
|
51
|
-
type = 'text';
|
|
52
|
-
errorMessage;
|
|
53
|
-
autocomplete;
|
|
54
|
-
inputmode;
|
|
55
|
-
autocorrect;
|
|
56
|
-
autocapitalize;
|
|
57
|
-
spellcheck;
|
|
58
|
-
autofocus = false;
|
|
59
|
-
minlength;
|
|
60
|
-
maxlength;
|
|
61
|
-
pattern;
|
|
62
|
-
min;
|
|
63
|
-
max;
|
|
64
|
-
step;
|
|
65
|
-
form;
|
|
66
|
-
size = 'md';
|
|
67
|
-
get error() {
|
|
68
|
-
return this.errorFromProp || this.nativeError;
|
|
69
|
-
}
|
|
70
|
-
set error(value) {
|
|
71
|
-
this.errorFromProp = value;
|
|
72
|
-
}
|
|
73
|
-
async setValue(newValue) {
|
|
74
|
-
const input = this.nativeInputElement;
|
|
75
|
-
const val = newValue ?? '';
|
|
76
|
-
if (input) {
|
|
77
|
-
input.value = val;
|
|
78
|
-
}
|
|
79
|
-
this.value = val;
|
|
80
|
-
this.internals.setFormValue?.(val);
|
|
81
|
-
this.lmvzInput.emit(val);
|
|
82
|
-
}
|
|
83
|
-
async focusInput() {
|
|
84
|
-
this.nativeInputElement?.focus();
|
|
85
|
-
}
|
|
86
|
-
async blurInput() {
|
|
87
|
-
this.nativeInputElement?.blur();
|
|
88
|
-
}
|
|
89
|
-
async select() {
|
|
90
|
-
this.nativeInputElement?.select();
|
|
91
|
-
}
|
|
92
|
-
async checkValidity() {
|
|
93
|
-
return this.nativeInputElement?.checkValidity?.() ?? false;
|
|
94
|
-
}
|
|
95
|
-
async reportValidity() {
|
|
96
|
-
return this.nativeInputElement?.reportValidity?.() ?? false;
|
|
97
|
-
}
|
|
98
|
-
async getInputElement() {
|
|
99
|
-
if (!this.nativeInputElement) {
|
|
100
|
-
await new Promise((resolve) => stencil_util.componentOnReady(this.el, resolve));
|
|
101
|
-
}
|
|
102
|
-
return Promise.resolve(this.nativeInputElement);
|
|
103
|
-
}
|
|
104
|
-
constructor(hostRef) {
|
|
105
|
-
super();
|
|
106
|
-
index.registerInstance(this, hostRef);
|
|
107
|
-
this.lmvzInput = index.createEvent(this, "lmvzInput", 7);
|
|
108
|
-
if (hostRef.$hostElement$["s-ei"]) {
|
|
109
|
-
this.internals = hostRef.$hostElement$["s-ei"];
|
|
110
|
-
}
|
|
111
|
-
else {
|
|
112
|
-
this.internals = hostRef.$hostElement$.attachInternals();
|
|
113
|
-
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
114
|
-
}
|
|
115
|
-
this.addController(new ariaValidationController.AriaValidationController(this, {
|
|
116
|
-
reValidateOnPropChanges: true,
|
|
117
|
-
}));
|
|
118
|
-
}
|
|
119
|
-
componentWillLoad() {
|
|
120
|
-
this.initialValue = this.value ?? '';
|
|
121
|
-
super.componentWillLoad();
|
|
122
|
-
}
|
|
123
|
-
formAssociatedCallback(form) {
|
|
124
|
-
if (!form)
|
|
125
|
-
return;
|
|
126
|
-
this.internals.setFormValue?.(this.value ?? '');
|
|
127
|
-
}
|
|
128
|
-
formResetCallback() {
|
|
129
|
-
this.internals.setValidity({});
|
|
130
|
-
this.setValue(this.initialValue);
|
|
131
|
-
}
|
|
132
|
-
formStateRestoreCallback(state) {
|
|
133
|
-
this.setValue(state);
|
|
134
|
-
}
|
|
135
|
-
handleValueChange(newValue) {
|
|
136
|
-
if (!this.nativeInputElement)
|
|
137
|
-
return;
|
|
138
|
-
const isInternalChange = this.nativeInputElement.value === newValue;
|
|
139
|
-
if (isInternalChange)
|
|
140
|
-
return;
|
|
141
|
-
this.setValue(newValue);
|
|
142
|
-
}
|
|
143
|
-
handleDisabledChange(disabled) {
|
|
144
|
-
if (disabled && this.nativeInputElement) {
|
|
145
|
-
this.nativeInputElement.blur();
|
|
146
|
-
}
|
|
147
|
-
}
|
|
148
|
-
handleInput = (event) => {
|
|
149
|
-
const input = event.target;
|
|
150
|
-
this.setValue(input.value);
|
|
151
|
-
};
|
|
152
|
-
handleChange = (event) => {
|
|
153
|
-
const input = event.target ?? this.nativeInputElement;
|
|
154
|
-
this.updateNativeError(input);
|
|
155
|
-
};
|
|
156
|
-
handleFocus = () => { };
|
|
157
|
-
handleBlur = (event) => {
|
|
158
|
-
const input = event.target;
|
|
159
|
-
input.checkValidity?.();
|
|
160
|
-
};
|
|
161
|
-
updateNativeError(fromEvent) {
|
|
162
|
-
const input = fromEvent ?? this.nativeInputElement;
|
|
163
|
-
if (!input)
|
|
164
|
-
return;
|
|
165
|
-
this.nativeError = !(input.checkValidity?.() ?? true);
|
|
166
|
-
}
|
|
167
|
-
render() {
|
|
168
|
-
const hasValue = Boolean(this.value);
|
|
169
|
-
const shouldFloatLabel = hasValue || Boolean(this.placeholder);
|
|
170
|
-
return (index.h("div", { key: '693614c334a94373dcef56b461455bf872249a69', class: index$1.classNames('input-container', {
|
|
171
|
-
'interaction-filled': hasValue,
|
|
172
|
-
}) }, index.h("div", { key: '0eb36d76661d70bea71027ca7b30763d89bd6cb6', class: "input-wrapper" }, index.h("slot", { key: '03adf18ebe01fe70dc821dcea2bb2963df40f8b4', name: "before-input" }), index.h("div", { key: 'f1254561b53e321d0f2e4cf4ac93936119083f3f', class: "label-input-group" }, index.h("label", { key: 'e17cdec368fd36a041d9d8853f4a82249f1b5d8c', htmlFor: this.inputId, class: index$1.classNames({ floating: shouldFloatLabel }) }, this.label, this.required && (index.h("span", { key: 'b3e003bf972c3ad5b6c5b25f8ee509bd5d8df758', class: "required-indicator", "aria-hidden": "true" }, ' ', "*"))), index.h("input", { key: '75f192118b7a4c3e507172e13d0ae7e32118aad3', 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: '58a9701259ca92fd7441c1480de741d92bc47bc9', name: "after-input" })), index.h("div", { key: '396b719d080c781f38d736e28e9c048f629d6ffe', id: this.helperId, role: "status" }, this.helperText || null), index.h("div", { key: '9e5c86e6098f58d95c0984348d3da07b9e34e1fb', id: this.errorId, role: "alert" }, (this.showErrorMessage && this.errorMessage) || null)));
|
|
173
|
-
}
|
|
174
|
-
static get formAssociated() { return true; }
|
|
175
|
-
static get watchers() { return {
|
|
176
|
-
"value": [{
|
|
177
|
-
"handleValueChange": 0
|
|
178
|
-
}],
|
|
179
|
-
"disabled": [{
|
|
180
|
-
"handleDisabledChange": 0
|
|
181
|
-
}]
|
|
182
|
-
}; }
|
|
183
|
-
};
|
|
184
|
-
LmvzInput.style = lmvzInputCss();
|
|
185
|
-
|
|
186
|
-
exports.lmvz_input = LmvzInput;
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var async_util = require('./async.util-Dnl6c82X.js');
|
|
4
|
-
|
|
5
|
-
const componentOnReady = (stencilEl, callback) => {
|
|
6
|
-
if (hasLazyBuild(stencilEl)) {
|
|
7
|
-
stencilEl.componentOnReady().then((resolvedEl) => callback(resolvedEl));
|
|
8
|
-
}
|
|
9
|
-
else {
|
|
10
|
-
async_util.raf(() => callback(stencilEl));
|
|
11
|
-
}
|
|
12
|
-
};
|
|
13
|
-
const hasLazyBuild = (stencilEl) => {
|
|
14
|
-
return stencilEl.componentOnReady !== undefined;
|
|
15
|
-
};
|
|
16
|
-
|
|
17
|
-
exports.componentOnReady = componentOnReady;
|
package/components/p-BVzxNP7h.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{p as t,c as o,h as r,d as e,t as n}from"./p-DGg7OzDl.js";import{c as a}from"./p-BfTCfPZ1.js";import{A as l}from"./p-CFTmV4XZ.js";import{E as i}from"./p-CxLd309t.js";import{a as m,l as v}from"./p-zMWemcoB.js";import{R as d}from"./p-CgK6-SEe.js";const u=t(class extends d{get el(){return this}validationEl;inheritedAttributes={};formEl=null;formButtonEl=null;lmvzActivation;ti=0;resolveFocusableElement(){return this.validationEl}scale="default";variant;disabled=!1;type="button";form;formMethod;name;value;buttonRole;constructor(t){super(!1),!1!==t&&this.__registerHost(),this.__attachShadow(),this.lmvzActivation=o(this,"lmvzActivation",7),this.addController(new l(this)),this.addController(new i(this,{localHandler:this.handleClick.bind(this)}))}connectedCallback(){this.inheritedAttributes=m(this.el,["role"]),super.connectedCallback()}disconnectedCallback(){this.formButtonEl?.remove(),this.formButtonEl=null,this.formEl=null,super.disconnectedCallback()}renderHiddenButton(){if("submit"!==this.type)return this.formButtonEl?.remove(),this.formButtonEl=null,void(this.formEl=null);const t=v(this.form,this.el);if(!t)return this.formButtonEl?.remove(),this.formButtonEl=null,void(this.formEl=null);this.formEl=t;const o=this.formButtonEl??document.createElement("button");o.type="submit",o.style.display="none",o.disabled=this.disabled,o.name=this.name??"",o.value=this.value??"",this.formMethod?o.setAttribute("formmethod",this.formMethod):o.removeAttribute("formmethod"),this.formButtonEl!==o&&(this.formButtonEl=o),o.parentElement!==t&&(o.remove(),t.appendChild(o))}submitForm(t){this.formEl&&this.formButtonEl&&(t.preventDefault(),this.formButtonEl.click())}handleClick=t=>{"submit"===this.type&&this.submitForm(t)};render(){return this.renderHiddenButton(),r(e,{key:"eb0ee982f50f1e41b2aa72a0598d739b972cbcdf",role:"presentation"},r("button",{key:"aed6f44f51222e31d5f1deec952c0d81b8f1200a",ref:t=>this.validationEl=t,part:"button",role:this.buttonRole,disabled:this.disabled,type:this.type,class:a(this.variant??"secondary",{[this.scale??""]:!!this.scale,disabled:this.disabled}),...this.inheritedAttributes},r("slot",{key:"2aaedfde3c0d6ebf426f20a8489b22c2a356767e"})))}static get delegatesFocus(){return!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; } } @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); } } :host { button { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary, #f0f0f0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary, #000000)); --lmvz-button-radius: var(--lmvz-button-radius-override, var(--lmvz-component-input-radius-default, 999px)); --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-md-strong, normal 700 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router)); --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); display: inline-flex; align-items: center; justify-content: var(--lmvz-button-content-justification-override, center); gap: var(--lmvz-button-gap); padding-block: var(--lmvz-button-padding-block); padding-inline: var(--lmvz-button-padding-inline); min-height: var(--lmvz-button-min-height); border-radius: var(--lmvz-button-radius); border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color); background-color: var(--lmvz-button-background); color: var(--lmvz-button-color); cursor: pointer; font: var(--lmvz-button-font); text-decoration: none; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; } button > * { font: inherit; color: inherit; } 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)); position: relative; z-index: 1; } button:is([disabled], .disabled) { cursor: not-allowed; pointer-events: none; opacity: var(--lmvz-component-input-disabled-opacity, 40%); } button:not([disabled]):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0)); } button:not([disabled]):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-active, #d4d4d4)); } button.primary { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary, #000000)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-primary, #ffffff)); --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); } button.primary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-hover, #2e2e2e)); } button.primary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-active, #545454)); } button.danger { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff)); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419)); } button.danger:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-danger, #fbdfe0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419)); } button.danger:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-on-danger-subtle, #e8454b)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419)); } button.tertiary { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary, #000000)); } button.tertiary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-hover, #000000)); } button.tertiary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-active, #000000)); } button.small { --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-sm-strong, normal 700 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5 Router)); } button.large { --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-lg-strong, normal 700 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.5 Router)); } display: inline-block; button { width: 100%; } } ::slotted(*) { --lmvz-component-color: var(--lmvz-button-color); } "}},[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"]}]);function s(){"undefined"!=typeof customElements&&["lmvz-button"].forEach((t=>{"lmvz-button"===t&&(customElements.get(n(t))||customElements.define(n(t),u))}))}export{u as L,s as d}
|
package/components/p-DLUsBYJH.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{g as t}from"./p-zMWemcoB.js";import{r as s,g as i}from"./p-CgK6-SEe.js";function e(t){return Boolean(i(t,"isFocusControllerHost"))}const n={orientation:"both",enableHomeAndEnd:!1,manageTabIndex:!1};class o{host;elements=[];currentElement;config;constructor(t,s={}){this.host=t,this.config={...n,...s}}hostConnected(){s(this.host.el,"isFocusControllerHost",!0),this.host.el.addEventListener("keydown",this.handleKeydown),this.syncManagedFocusTarget()}hostDisconnected(){this.host.el.removeEventListener("keydown",this.handleKeydown)}updateElements(t){const s=this.currentElement??this.getManagedActiveElement()??void 0;this.elements=t.filter((t=>"focus"in t&&1===t.nodeType)),this.syncManagedFocusTarget(s)}setCurrentElement(t){const s=this.currentElement;this.currentElement=null!=t&&"focus"in t&&1===t.nodeType?t:void 0,this.syncManagedFocusTarget(s)}async initFocus(){const t=this.selectManagedElement();t&&this.applyFocusTarget(t,!0)}handleKeydown=t=>{const s=this.getFocusIntent(t.key);if(!s)return;const i=this.getManagedActiveElement(),e=this.getTargetElement(i,s);e&&(t.preventDefault(),this.applyFocusTarget(e,!0))};getFocusIntent(t){return this.config.enableHomeAndEnd&&"Home"===t?"first":this.config.enableHomeAndEnd&&"End"===t?"last":"horizontal"===this.config.orientation?"ArrowRight"===t?"next":"ArrowLeft"===t?"previous":void 0:"vertical"===this.config.orientation?"ArrowDown"===t?"next":"ArrowUp"===t?"previous":void 0:"ArrowDown"===t||"ArrowRight"===t?"next":"ArrowUp"===t||"ArrowLeft"===t?"previous":void 0}getManagedActiveElement(){const s=t(this.host.el.ownerDocument??document);if(s instanceof HTMLElement){const t=this.elements.find((t=>function(t){return function(t){return"function"==typeof t.resolveFocusableElement}(t)?t.resolveFocusableElement()??t:t}(t)===s));if(t&&this.canMoveFocusTo(t))return t}if(this.currentElement&&this.elements.includes(this.currentElement)&&this.canMoveFocusTo(this.currentElement))return this.currentElement}getTargetElement(t,s){if(!this.elements.length)return;if("first"===s)return this.findFocusableFromIndex(-1,"next");if("last"===s)return this.findFocusableFromIndex(this.elements.length,"previous");const i=t?this.elements.indexOf(t):-1;return-1===i?"next"===s?this.findFocusableFromIndex(-1,"next"):this.findFocusableFromIndex(this.elements.length,"previous"):this.findFocusableFromIndex(i,s)}findFocusableFromIndex(t,s){if(!this.elements.length)return;const i="next"===s?1:-1;for(let s=1;s<=this.elements.length;s++){const e=this.elements[(t+i*s+this.elements.length)%this.elements.length];if(this.canMoveFocusTo(e))return e}}syncManagedFocusTarget(t){const s=this.selectManagedElement(t),i=s!==this.currentElement;this.currentElement=s,this.config.manageTabIndex&&this.updateTabIndexes(s),i&&s&&this.config.onFocusTargetChange?.(s)}selectManagedElement(t){const s=this.getManagedActiveElement();if(s)return s;if(this.currentElement&&this.elements.includes(this.currentElement)&&this.canMoveFocusTo(this.currentElement))return this.currentElement;if(t&&this.elements.includes(t))return this.findFocusableFromIndex(this.elements.indexOf(t),"next")??this.findFocusableFromIndex(-1,"next");return this.elements.find((t=>0===t.tabIndex&&this.canMoveFocusTo(t)))||this.findFocusableFromIndex(-1,"next")}updateTabIndexes(t){this.elements.forEach((s=>{s.tabIndex=t&&s===t?0:-1}))}applyFocusTarget(t,s){const i=t!==this.currentElement;this.currentElement=t,this.config.manageTabIndex&&this.updateTabIndexes(t),s&&t.focus(),i&&this.config.onFocusTargetChange?.(t)}canMoveFocusTo(t){return!!t&&(!t.hasAttribute("disabled")&&((!("disabled"in t)||!Boolean(t.disabled))&&("true"!==t.getAttribute("aria-disabled")&&(this.config.isFocusableElement?this.config.isFocusableElement(t):(this.config.manageTabIndex||t.tabIndex>=0)&&"true"!==t.getAttribute("aria-hidden")&&(t.checkVisibility?.()??!0)&&null!==t.offsetParent))))}}export{o as D,e as i}
|
package/components/p-zMWemcoB.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
const a=["role","aria-activedescendant","aria-atomic","aria-autocomplete","aria-braillelabel","aria-brailleroledescription","aria-busy","aria-checked","aria-colcount","aria-colindex","aria-colindextext","aria-colspan","aria-controls","aria-current","aria-describedby","aria-description","aria-details","aria-disabled","aria-errormessage","aria-expanded","aria-flowto","aria-haspopup","aria-hidden","aria-invalid","aria-keyshortcuts","aria-label","aria-labelledby","aria-level","aria-live","aria-multiline","aria-multiselectable","aria-orientation","aria-owns","aria-placeholder","aria-posinset","aria-pressed","aria-readonly","aria-relevant","aria-required","aria-roledescription","aria-rowcount","aria-rowindex","aria-rowindextext","aria-rowspan","aria-selected","aria-setsize","aria-sort","aria-valuemax","aria-valuemin","aria-valuenow","aria-valuetext"];function e(a){return["LMVZ-BUTTON","BUTTON"].includes(a.tagName.toUpperCase())}function r(a){return"LMVZ-BUTTON"===a?.tagName.toUpperCase()}function i(a){return a.hasAttribute("disabled")||!0===a.disabled}function n(a){return!a.hasAttribute("hidden")}function t(a){const e=a.getAttribute("variant")??a.variant;return"primary"===e||"secondary"===e||"tertiary"===e?e:"secondary"}function o(a){return"primary"===t(a)}function l(a){return"secondary"===t(a)}const s=(e,r)=>{let i=a;return r&&r.length>0&&(i=i.filter((a=>!r.includes(a)))),((a,e=[])=>{const r={};return e.forEach((e=>{a.hasAttribute(e)&&(null!==a.getAttribute(e)&&(r[e]=a.getAttribute(e)),a.removeAttribute(e))})),r})(e,i)};function c(a=document){let e=a.activeElement;if(!e)return null;for(;e?.shadowRoot;){const a=e.shadowRoot.activeElement;if(!a)break;e=a}return e}function u(a,e){if(!a)return;if(e(a))return a;const r=Array.from(a.shadowRoot?a.shadowRoot.children:a.children);for(const a of r){const r=u(a,e);if(r)return r}}function d(a){return!!a&&a instanceof HTMLElement&&a.tabIndex>=0&&!a.hasAttribute("disabled")&&"true"!==a.getAttribute("aria-hidden")&&a.checkVisibility()&&null!==a.offsetParent}function f(a,e){if(a instanceof HTMLFormElement)return a;if("string"==typeof a){const e=document.getElementById(a);return e?e instanceof HTMLFormElement?e:(console.warn(`No Form found with selector: "#${a}". Verify that the element with id exists and is actually a <form> element.`,e),null):(console.warn(`No Form found with selector: "#${a}". Verify that the id is correct and the form is rendered in the DOM.`,e),null)}return void 0!==a?(console.warn('The provided "form" element is invalid. Verify that the form is a HTMLFormElement and rendered in the DOM.',e),null):e.closest("form")}function m(a){const e=a.tagName.toLowerCase();if(["button","lmvz-button","input","lmvz-input","select","lmvz-select","textarea"].includes(e))return!0;if(["a","lmvz-link"].includes(e)&&a.hasAttribute("href"))return!0;if(a.hasAttribute("tabindex")){const e=parseInt(a.getAttribute("tabindex")??"-1");return(isNaN(e)||e<0)&&console.warn("Interactive element is not keyboard accessible due to negative tabindex!",a),!0}const r=a.getAttribute("role");return!(!r||!["button","link","menuitem","option","combobox","listbox","checkbox","radio","switch","tab"].includes(r))}function b(a){return a instanceof HTMLElement}export{s as a,o as b,n as c,e as d,i as e,l as f,c as g,d as h,r as i,b as j,m as k,f as l,u as w}
|
package/esm/lmvz-input.entry.js
DELETED
|
@@ -1,184 +0,0 @@
|
|
|
1
|
-
import { g as getElement, r as registerInstance, c as createEvent, h } from './index-BPeerEwm.js';
|
|
2
|
-
import { c as classNames } from './index-BfTCfPZ1.js';
|
|
3
|
-
import { A as AriaValidationController } from './aria-validation-controller-BvOU1BO8.js';
|
|
4
|
-
import { R as ReactiveControllerHost } from './reactive-controller-host-CICeIanv.js';
|
|
5
|
-
import { c as componentOnReady } from './stencil.util-D2-5rsN3.js';
|
|
6
|
-
import './aria-loader-BfH06m7H.js';
|
|
7
|
-
import './async.util-DZj20TV1.js';
|
|
8
|
-
|
|
9
|
-
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, #a1a1a1); --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, #a31419); --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.75rem, 0.72rem + 0.13vw, 0.88rem)); } [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; }`;
|
|
10
|
-
|
|
11
|
-
let inputIdCounter = 0;
|
|
12
|
-
const LmvzInput = class extends ReactiveControllerHost {
|
|
13
|
-
get el() { return getElement(this); }
|
|
14
|
-
get validationEl() {
|
|
15
|
-
return this.el;
|
|
16
|
-
}
|
|
17
|
-
lmvzInput;
|
|
18
|
-
internals;
|
|
19
|
-
nativeInputElement;
|
|
20
|
-
inputId = `lmvz-input-${inputIdCounter++}`;
|
|
21
|
-
initialValue = '';
|
|
22
|
-
nativeError = false;
|
|
23
|
-
errorFromProp = false;
|
|
24
|
-
get helperId() {
|
|
25
|
-
return this.helperText ? `${this.inputId}-helper` : undefined;
|
|
26
|
-
}
|
|
27
|
-
get showErrorMessage() {
|
|
28
|
-
return this.error && Boolean(this.errorMessage);
|
|
29
|
-
}
|
|
30
|
-
get errorId() {
|
|
31
|
-
return `${this.inputId}-error`;
|
|
32
|
-
}
|
|
33
|
-
get describedBy() {
|
|
34
|
-
const ids = [];
|
|
35
|
-
if (this.helperId)
|
|
36
|
-
ids.push(this.helperId);
|
|
37
|
-
if (this.showErrorMessage)
|
|
38
|
-
ids.push(this.errorId);
|
|
39
|
-
return ids.length > 0 ? ids.join(' ') : undefined;
|
|
40
|
-
}
|
|
41
|
-
value;
|
|
42
|
-
label;
|
|
43
|
-
helperText;
|
|
44
|
-
placeholder;
|
|
45
|
-
disabled = false;
|
|
46
|
-
readonly = false;
|
|
47
|
-
required = false;
|
|
48
|
-
name;
|
|
49
|
-
type = 'text';
|
|
50
|
-
errorMessage;
|
|
51
|
-
autocomplete;
|
|
52
|
-
inputmode;
|
|
53
|
-
autocorrect;
|
|
54
|
-
autocapitalize;
|
|
55
|
-
spellcheck;
|
|
56
|
-
autofocus = false;
|
|
57
|
-
minlength;
|
|
58
|
-
maxlength;
|
|
59
|
-
pattern;
|
|
60
|
-
min;
|
|
61
|
-
max;
|
|
62
|
-
step;
|
|
63
|
-
form;
|
|
64
|
-
size = 'md';
|
|
65
|
-
get error() {
|
|
66
|
-
return this.errorFromProp || this.nativeError;
|
|
67
|
-
}
|
|
68
|
-
set error(value) {
|
|
69
|
-
this.errorFromProp = value;
|
|
70
|
-
}
|
|
71
|
-
async setValue(newValue) {
|
|
72
|
-
const input = this.nativeInputElement;
|
|
73
|
-
const val = newValue ?? '';
|
|
74
|
-
if (input) {
|
|
75
|
-
input.value = val;
|
|
76
|
-
}
|
|
77
|
-
this.value = val;
|
|
78
|
-
this.internals.setFormValue?.(val);
|
|
79
|
-
this.lmvzInput.emit(val);
|
|
80
|
-
}
|
|
81
|
-
async focusInput() {
|
|
82
|
-
this.nativeInputElement?.focus();
|
|
83
|
-
}
|
|
84
|
-
async blurInput() {
|
|
85
|
-
this.nativeInputElement?.blur();
|
|
86
|
-
}
|
|
87
|
-
async select() {
|
|
88
|
-
this.nativeInputElement?.select();
|
|
89
|
-
}
|
|
90
|
-
async checkValidity() {
|
|
91
|
-
return this.nativeInputElement?.checkValidity?.() ?? false;
|
|
92
|
-
}
|
|
93
|
-
async reportValidity() {
|
|
94
|
-
return this.nativeInputElement?.reportValidity?.() ?? false;
|
|
95
|
-
}
|
|
96
|
-
async getInputElement() {
|
|
97
|
-
if (!this.nativeInputElement) {
|
|
98
|
-
await new Promise((resolve) => componentOnReady(this.el, resolve));
|
|
99
|
-
}
|
|
100
|
-
return Promise.resolve(this.nativeInputElement);
|
|
101
|
-
}
|
|
102
|
-
constructor(hostRef) {
|
|
103
|
-
super();
|
|
104
|
-
registerInstance(this, hostRef);
|
|
105
|
-
this.lmvzInput = createEvent(this, "lmvzInput", 7);
|
|
106
|
-
if (hostRef.$hostElement$["s-ei"]) {
|
|
107
|
-
this.internals = hostRef.$hostElement$["s-ei"];
|
|
108
|
-
}
|
|
109
|
-
else {
|
|
110
|
-
this.internals = hostRef.$hostElement$.attachInternals();
|
|
111
|
-
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
112
|
-
}
|
|
113
|
-
this.addController(new AriaValidationController(this, {
|
|
114
|
-
reValidateOnPropChanges: true,
|
|
115
|
-
}));
|
|
116
|
-
}
|
|
117
|
-
componentWillLoad() {
|
|
118
|
-
this.initialValue = this.value ?? '';
|
|
119
|
-
super.componentWillLoad();
|
|
120
|
-
}
|
|
121
|
-
formAssociatedCallback(form) {
|
|
122
|
-
if (!form)
|
|
123
|
-
return;
|
|
124
|
-
this.internals.setFormValue?.(this.value ?? '');
|
|
125
|
-
}
|
|
126
|
-
formResetCallback() {
|
|
127
|
-
this.internals.setValidity({});
|
|
128
|
-
this.setValue(this.initialValue);
|
|
129
|
-
}
|
|
130
|
-
formStateRestoreCallback(state) {
|
|
131
|
-
this.setValue(state);
|
|
132
|
-
}
|
|
133
|
-
handleValueChange(newValue) {
|
|
134
|
-
if (!this.nativeInputElement)
|
|
135
|
-
return;
|
|
136
|
-
const isInternalChange = this.nativeInputElement.value === newValue;
|
|
137
|
-
if (isInternalChange)
|
|
138
|
-
return;
|
|
139
|
-
this.setValue(newValue);
|
|
140
|
-
}
|
|
141
|
-
handleDisabledChange(disabled) {
|
|
142
|
-
if (disabled && this.nativeInputElement) {
|
|
143
|
-
this.nativeInputElement.blur();
|
|
144
|
-
}
|
|
145
|
-
}
|
|
146
|
-
handleInput = (event) => {
|
|
147
|
-
const input = event.target;
|
|
148
|
-
this.setValue(input.value);
|
|
149
|
-
};
|
|
150
|
-
handleChange = (event) => {
|
|
151
|
-
const input = event.target ?? this.nativeInputElement;
|
|
152
|
-
this.updateNativeError(input);
|
|
153
|
-
};
|
|
154
|
-
handleFocus = () => { };
|
|
155
|
-
handleBlur = (event) => {
|
|
156
|
-
const input = event.target;
|
|
157
|
-
input.checkValidity?.();
|
|
158
|
-
};
|
|
159
|
-
updateNativeError(fromEvent) {
|
|
160
|
-
const input = fromEvent ?? this.nativeInputElement;
|
|
161
|
-
if (!input)
|
|
162
|
-
return;
|
|
163
|
-
this.nativeError = !(input.checkValidity?.() ?? true);
|
|
164
|
-
}
|
|
165
|
-
render() {
|
|
166
|
-
const hasValue = Boolean(this.value);
|
|
167
|
-
const shouldFloatLabel = hasValue || Boolean(this.placeholder);
|
|
168
|
-
return (h("div", { key: '693614c334a94373dcef56b461455bf872249a69', class: classNames('input-container', {
|
|
169
|
-
'interaction-filled': hasValue,
|
|
170
|
-
}) }, h("div", { key: '0eb36d76661d70bea71027ca7b30763d89bd6cb6', class: "input-wrapper" }, h("slot", { key: '03adf18ebe01fe70dc821dcea2bb2963df40f8b4', name: "before-input" }), h("div", { key: 'f1254561b53e321d0f2e4cf4ac93936119083f3f', class: "label-input-group" }, h("label", { key: 'e17cdec368fd36a041d9d8853f4a82249f1b5d8c', htmlFor: this.inputId, class: classNames({ floating: shouldFloatLabel }) }, this.label, this.required && (h("span", { key: 'b3e003bf972c3ad5b6c5b25f8ee509bd5d8df758', class: "required-indicator", "aria-hidden": "true" }, ' ', "*"))), h("input", { key: '75f192118b7a4c3e507172e13d0ae7e32118aad3', 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: '58a9701259ca92fd7441c1480de741d92bc47bc9', name: "after-input" })), h("div", { key: '396b719d080c781f38d736e28e9c048f629d6ffe', id: this.helperId, role: "status" }, this.helperText || null), h("div", { key: '9e5c86e6098f58d95c0984348d3da07b9e34e1fb', id: this.errorId, role: "alert" }, (this.showErrorMessage && this.errorMessage) || null)));
|
|
171
|
-
}
|
|
172
|
-
static get formAssociated() { return true; }
|
|
173
|
-
static get watchers() { return {
|
|
174
|
-
"value": [{
|
|
175
|
-
"handleValueChange": 0
|
|
176
|
-
}],
|
|
177
|
-
"disabled": [{
|
|
178
|
-
"handleDisabledChange": 0
|
|
179
|
-
}]
|
|
180
|
-
}; }
|
|
181
|
-
};
|
|
182
|
-
LmvzInput.style = lmvzInputCss();
|
|
183
|
-
|
|
184
|
-
export { LmvzInput as lmvz_input };
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { r as raf } from './async.util-DZj20TV1.js';
|
|
2
|
-
|
|
3
|
-
const componentOnReady = (stencilEl, callback) => {
|
|
4
|
-
if (hasLazyBuild(stencilEl)) {
|
|
5
|
-
stencilEl.componentOnReady().then((resolvedEl) => callback(resolvedEl));
|
|
6
|
-
}
|
|
7
|
-
else {
|
|
8
|
-
raf(() => callback(stencilEl));
|
|
9
|
-
}
|
|
10
|
-
};
|
|
11
|
-
const hasLazyBuild = (stencilEl) => {
|
|
12
|
-
return stencilEl.componentOnReady !== undefined;
|
|
13
|
-
};
|
|
14
|
-
|
|
15
|
-
export { componentOnReady as c };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{g as t,r as o,c as r,h as e,H as n}from"./p-BPeerEwm.js";import{c as i}from"./p-BfTCfPZ1.js";import{A as a}from"./p-D9PQIBzA.js";import{E as l}from"./p-wlMjNjuv.js";import{a as m,k as v}from"./p-BFcYfHYq.js";import{R as s}from"./p-CICeIanv.js";import{p as d}from"./p-DjvtQE7c.js";import{a as c}from"./p-CyDgnpOB.js";import"./p-BDonpCG8.js";import"./p-D06Ds9Dh.js";const u=class extends s{get el(){return t(this)}validationEl;inheritedAttributes={};formEl=null;formButtonEl=null;lmvzActivation;ti=0;resolveFocusableElement(){return this.validationEl}scale="default";variant;disabled=!1;type="button";form;formMethod;name;value;buttonRole;constructor(t){super(),o(this,t),this.lmvzActivation=r(this,"lmvzActivation",7),this.addController(new a(this)),this.addController(new l(this,{localHandler:this.handleClick.bind(this)}))}connectedCallback(){this.inheritedAttributes=m(this.el,["role"]),super.connectedCallback()}disconnectedCallback(){this.formButtonEl?.remove(),this.formButtonEl=null,this.formEl=null,super.disconnectedCallback()}renderHiddenButton(){if("submit"!==this.type)return this.formButtonEl?.remove(),this.formButtonEl=null,void(this.formEl=null);const t=v(this.form,this.el);if(!t)return this.formButtonEl?.remove(),this.formButtonEl=null,void(this.formEl=null);this.formEl=t;const o=this.formButtonEl??document.createElement("button");o.type="submit",o.style.display="none",o.disabled=this.disabled,o.name=this.name??"",o.value=this.value??"",this.formMethod?o.setAttribute("formmethod",this.formMethod):o.removeAttribute("formmethod"),this.formButtonEl!==o&&(this.formButtonEl=o),o.parentElement!==t&&(o.remove(),t.appendChild(o))}submitForm(t){this.formEl&&this.formButtonEl&&(t.preventDefault(),this.formButtonEl.click())}handleClick=t=>{"submit"===this.type&&this.submitForm(t)};render(){return this.renderHiddenButton(),e(n,{key:"eb0ee982f50f1e41b2aa72a0598d739b972cbcdf",role:"presentation"},e("button",{key:"aed6f44f51222e31d5f1deec952c0d81b8f1200a",ref:t=>this.validationEl=t,part:"button",role:this.buttonRole,disabled:this.disabled,type:this.type,class:i(this.variant??"secondary",{[this.scale??""]:!!this.scale,disabled:this.disabled}),...this.inheritedAttributes},e("slot",{key:"2aaedfde3c0d6ebf426f20a8489b22c2a356767e"})))}static get delegatesFocus(){return!0}};u.style=" @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; } } @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); } } :host { button { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary, #f0f0f0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-secondary, #000000)); --lmvz-button-radius: var(--lmvz-button-radius-override, var(--lmvz-component-input-radius-default, 999px)); --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-button-padding, var(--lmvz-component-input-padding-md, clamp(0.88rem, 0.84rem + 0.13vw, 1rem)))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-md, clamp(0.5rem, 0.44rem + 0.26vw, 0.75rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-md, clamp(2.5rem, 2.44rem + 0.26vw, 2.75rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-md-strong, normal 700 clamp(0.88rem, 0.84rem + 0.13vw, 1rem) / 1.5 Router)); --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); display: inline-flex; align-items: center; justify-content: var(--lmvz-button-content-justification-override, center); gap: var(--lmvz-button-gap); padding-block: var(--lmvz-button-padding-block); padding-inline: var(--lmvz-button-padding-inline); min-height: var(--lmvz-button-min-height); border-radius: var(--lmvz-button-radius); border: var(--lmvz-button-border-width) solid var(--lmvz-button-border-color); background-color: var(--lmvz-button-background); color: var(--lmvz-button-color); cursor: pointer; font: var(--lmvz-button-font); text-decoration: none; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; } button > * { font: inherit; color: inherit; } 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)); position: relative; z-index: 1; } button:is([disabled], .disabled) { cursor: not-allowed; pointer-events: none; opacity: var(--lmvz-component-input-disabled-opacity, 40%); } button:not([disabled]):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-hover, #e0e0e0)); } button:not([disabled]):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-secondary-active, #d4d4d4)); } button.primary { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary, #000000)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-primary, #ffffff)); --lmvz-button-border-width: var(--lmvz-button-border-width-override, 0); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); } button.primary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-hover, #2e2e2e)); } button.primary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-primary-active, #545454)); } button.danger { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff)); --lmvz-button-border-color: var(--lmvz-button-border-color-override, transparent); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419)); } button.danger:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-danger, #fbdfe0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419)); } button.danger:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-status-on-danger-subtle, #e8454b)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-status-on-danger, #a31419)); } button.tertiary { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary, #ffffff)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary, #000000)); } button.tertiary:not([disabled], .disabled):hover { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-hover, #f0f0f0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-hover, #000000)); } button.tertiary:not([disabled], .disabled):active { --lmvz-button-background: var(--lmvz-button-background-override, var(--lmvz-semantic-color-int-tertiary-active, #e0e0e0)); --lmvz-button-color: var(--lmvz-button-color-override, var(--lmvz-semantic-color-int-on-tertiary-active, #000000)); } button.small { --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-sm, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-sm, clamp(0.38rem, 0.31rem + 0.26vw, 0.63rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-sm, clamp(2rem, 1.94rem + 0.26vw, 2.25rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-sm-strong, normal 700 clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem) / 1.5 Router)); } button.large { --lmvz-button-padding-inline: var(--lmvz-button-padding-inline-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem))); --lmvz-button-padding-block: var(--lmvz-button-padding-block-override, var(--lmvz-component-input-padding-lg, clamp(1rem, 0.94rem + 0.26vw, 1.25rem))); --lmvz-button-gap: var(--lmvz-button-gap-override, var(--lmvz-component-input-gap-lg, clamp(0.75rem, 0.69rem + 0.26vw, 1rem))); --lmvz-button-min-height: var(--lmvz-button-min-height-override, var(--lmvz-component-input-size-lg, clamp(2.75rem, 2.69rem + 0.26vw, 3rem))); --lmvz-button-font: var(--lmvz-button-font-override, var(--lmvz-typography-label-lg-strong, normal 700 clamp(1rem, 0.97rem + 0.13vw, 1.13rem) / 1.5 Router)); } display: inline-block; button { width: 100%; } } ::slotted(*) { --lmvz-component-color: var(--lmvz-button-color); } ";const b=class extends s{intersectionObserver;ariaValidationController=new a(this);get el(){return t(this)}validationEl;icon;weight="medium";size="md";iconset;iconData;visible=!1;ariaLabel;get ariaHidden(){return!this.ariaLabel}constructor(t){super(),o(this,t),this.addController(this.ariaValidationController)}connectedCallback(){this.waitUntilVisible((()=>{this.visible=!0,this.loadIconPathData()})),super.connectedCallback()}disconnectedCallback(){this.intersectionObserver&&"function"==typeof this.intersectionObserver.disconnect&&this.intersectionObserver.disconnect(),this.intersectionObserver=void 0,super.disconnectedCallback()}async loadIconPathData(){const{icon:t,iconset:o,visible:r}=this;if(!t||!r)return;const e=d(t);this.iconData=e||await c({icon:t,iconset:o})}componentDidRender(){this.validationEl=this.el.querySelector("svg"),this.ariaValidationController.revalidateAria(),super.componentDidRender()}render(){return e(n,{key:"4fba217d573d968951819f12af24d775c8ac62dc",role:"img","aria-hidden":`${this.ariaHidden}`,innerHTML:this.iconData})}waitUntilVisible(t,o=50){"undefined"!=typeof window&&window.IntersectionObserver?(this.intersectionObserver=new IntersectionObserver((o=>{o.some((o=>!!o.isIntersecting&&(this.intersectionObserver&&"function"==typeof this.intersectionObserver.disconnect&&this.intersectionObserver.disconnect(),this.intersectionObserver=void 0,t(),!0)))}),{rootMargin:`${o}px`}),this.intersectionObserver.observe(this.el)):t()}static get watchers(){return{icon:[{loadIconPathData:0}],iconset:[{loadIconPathData:0}]}}};b.style=".sc-lmvz-icon-h{--lmvz-icon-color:var(--lmvz-component-color, var(--lmvz-semantic-color-on-surface-input-primary, #000000));--lmvz-icon-size:var(--lmvz-component-size, var(--lmvz-component-icon-size-md, clamp(1rem, 0.94rem + 0.26vw, 1.25rem)));display:inline-block;line-height:0;svg{display:block;height:var(--lmvz-icon-size);width:auto}svg path{stroke:var(--lmvz-icon-color);fill:none}}[size='xs'].sc-lmvz-icon-h{svg{--lmvz-icon-size:var(--lmvz-component-icon-size-xs, clamp(0.75rem, 0.72rem + 0.13vw, 0.88rem))}}[size='sm'].sc-lmvz-icon-h{svg{--lmvz-icon-size:var(--lmvz-component-icon-size-sm, clamp(0.88rem, 0.84rem + 0.13vw, 1rem))}}[size='md'].sc-lmvz-icon-h{svg{--lmvz-icon-size:var(--lmvz-component-icon-size-md, clamp(1rem, 0.94rem + 0.26vw, 1.25rem))}}[size='lg'].sc-lmvz-icon-h{svg{--lmvz-icon-size:var(--lmvz-component-icon-size-lg, clamp(1.25rem, 1.19rem + 0.26vw, 1.5rem))}}[size='inherit'].sc-lmvz-icon-h{svg{height:var(--lmvz-component-size, inherit)}}[weight='light'].sc-lmvz-icon-h{svg path{stroke-width:1}}[weight='medium'].sc-lmvz-icon-h{svg path{stroke-width:1.5}}[weight='bold'].sc-lmvz-icon-h{svg path{stroke-width:2}}[weight='filled'].sc-lmvz-icon-h{svg path{stroke-width:2;fill:var(--lmvz-icon-color)}}";export{u as lmvz_button,b as lmvz_icon}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{g as e,r as t,c as r,h as i}from"./p-BPeerEwm.js";import{c as o}from"./p-BfTCfPZ1.js";import{A as n}from"./p-D9PQIBzA.js";import{R as a}from"./p-CICeIanv.js";import{c as l}from"./p-bh9cItsP.js";import"./p-BDonpCG8.js";import"./p-DZj20TV1.js";let s=0;const p=class extends a{get el(){return e(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&&Boolean(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=>l(this.el,e))),Promise.resolve(this.nativeInputElement)}constructor(e){super(),t(this,e),this.lmvzInput=r(this,"lmvzInput",7),e.$hostElement$["s-ei"]?this.internals=e.$hostElement$["s-ei"]:(this.internals=e.$hostElement$.attachInternals(),e.$hostElement$["s-ei"]=this.internals),this.addController(new n(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.checkValidity?.()};updateNativeError(e){const t=e??this.nativeInputElement;t&&(this.nativeError=!(t.checkValidity?.()??1))}render(){const e=Boolean(this.value),t=e||Boolean(this.placeholder);return i("div",{key:"693614c334a94373dcef56b461455bf872249a69",class:o("input-container",{"interaction-filled":e})},i("div",{key:"0eb36d76661d70bea71027ca7b30763d89bd6cb6",class:"input-wrapper"},i("slot",{key:"03adf18ebe01fe70dc821dcea2bb2963df40f8b4",name:"before-input"}),i("div",{key:"f1254561b53e321d0f2e4cf4ac93936119083f3f",class:"label-input-group"},i("label",{key:"e17cdec368fd36a041d9d8853f4a82249f1b5d8c",htmlFor:this.inputId,class:o({floating:t})},this.label,this.required&&i("span",{key:"b3e003bf972c3ad5b6c5b25f8ee509bd5d8df758",class:"required-indicator","aria-hidden":"true"}," ","*")),i("input",{key:"75f192118b7a4c3e507172e13d0ae7e32118aad3",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})),i("slot",{key:"58a9701259ca92fd7441c1480de741d92bc47bc9",name:"after-input"})),i("div",{key:"396b719d080c781f38d736e28e9c048f629d6ffe",id:this.helperId,role:"status"},this.helperText||null),i("div",{key:"9e5c86e6098f58d95c0984348d3da07b9e34e1fb",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}]}}};p.style="@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, #a1a1a1); --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, #a31419); --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.75rem, 0.72rem + 0.13vw, 0.88rem)); } [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; }";export{p as lmvz_input}
|