adp-web-components 0.1.85 → 0.1.86

package/dist/collection/components/form-elements/form-select.js

@@ -4,14 +4,10 @@
  */
 import { Host, forceUpdate, h } from "@stencil/core";
 import cn from "../../global/lib/cn";
-import { getNestedValue } from "../../global/lib/get-nested-value";
 import { getInputLocalization } from "../../features/form-hook/index";
-import Loader from "~assets/loader.svg";
-import { TickIcon } from "../../global/assets/tick-icon";
-import { ArrowUpIcon } from "../../global/assets/arrow-up-icon";
 import { FormInputLabel } from "./components/form-input-label";
 import { FormErrorMessage } from "./components/form-error-message";
-import { AddIcon } from "../../global/assets/add-icon";
+import { getNestedValue } from "../../global/lib/get-nested-value";
 export class FormSelect {
     constructor() {
         this.language = 'en';
@@ -22,36 +18,21 @@ export class FormSelect {
         this.searchValue = '';
         this.isOpen = false;
         this.selectedValue = '';
-        this.openUpwards = false;
         this.options = [];
         this.fetchingErrorMessage = null;
-        this.toggleDropdown = () => {
-            if (this.isOpen && !this.searchable)
-                this.isOpen = false;
-            else
-                this.adjustDropdownPosition();
+        this.handleSelection = (option) => {
+            this.selectedValue = option.value;
+            this.searchValue = option.label;
+            this.isOpen = false;
         };
         this.reset = (newValue = '') => {
             const defaultOption = this.options.find(opt => opt.value === newValue || opt.value === this.defaultValue) || { value: newValue, label: '' };
             this.handleSelection(defaultOption);
         };
-        this.closeDropdown = (event) => {
-            if (!this.el.contains(event.target)) {
-                this.isOpen = false;
-            }
-        };
-        this.onSearchInput = (event) => {
-            const target = event.target;
-            this.searchValue = target.value;
-            this.selectedValue = '';
-        };
-        this.clearInput = () => {
-            this.searchValue = '';
-            this.selectedValue = '';
-            const selectButton = this.el.getElementsByClassName('form-input-select')[0];
-            selectButton.focus();
-            if (!this.isOpen)
-                this.adjustDropdownPosition();
+        this.updateShiftSelectContext = (newValues) => {
+            Object.entries(newValues).forEach(([key, value]) => {
+                this[key] = value;
+            });
         };
     }
     async changeLanguage() {
@@ -69,38 +50,11 @@ export class FormSelect {
             this.defaultValue = this.staticValue.value;
             this.clearable = false;
         }
-        this.selectedValue = this.defaultValue;
     }
     async disconnectedCallback() {
         var _a;
         (_a = this.abortController) === null || _a === void 0 ? void 0 : _a.abort();
         this.form.unsubscribe(this.name);
-        document.removeEventListener('click', this.closeDropdown);
-        document.removeEventListener('keydown', this.handleKeyDown.bind(this));
-    }
-    adjustDropdownPosition() {
-        requestAnimationFrame(() => {
-            const selectButton = this.el.getElementsByClassName('form-input-select')[0];
-            const selectContainer = this.el.getElementsByClassName('form-select-container')[0];
-            const rect = selectButton.getBoundingClientRect();
-            const spaceBelow = window.innerHeight - rect.bottom - 20; // 20 is padding
-            this.openUpwards = spaceBelow < selectContainer.getBoundingClientRect().height || this.forceOpenUpwards;
-            setTimeout(() => {
-                this.isOpen = true;
-            }, 10);
-        });
-    }
-    handleSelection(option) {
-        this.selectedValue = option.value;
-        this.searchValue = option.label;
-        this.isOpen = false;
-    }
-    handleKeyDown(event) {
-        if (!this.isOpen)
-            return;
-        if (event.key === 'Escape') {
-            this.isOpen = false;
-        }
     }
     async fetch() {
         var _a, _b, _c, _d;
@@ -144,8 +98,6 @@ export class FormSelect {
     }
     async componentDidLoad() {
         this.fetch();
-        document.addEventListener('click', this.closeDropdown);
-        document.addEventListener('keydown', this.handleKeyDown.bind(this));
     }
     render() {
         var _a, _b, _c;
@@ -160,19 +112,7 @@ export class FormSelect {
         const disableInput = disabled || this.isDisabled || this.isLoading || !!this.staticValue;
         if (this.isHidden)
             return (h(Host, { translate: "no", style: { display: this.isHidden ? 'none' : 'block' } }, h("form-shadow-input", { name: this.name, form: this.form, value: this.selectedValue })));
-        return (h(Host, { translate: "no" }, h("label", { part: `${this.name}`, id: this.wrapperId, class: cn('form-input-label-container', this.wrapperClass, { disabled: disableInput }) }, h(FormInputLabel, { name: this.name, isRequired: isRequired || this.isRequired, label: label }), h("div", { part: `${this.name}-container form-input-container`, class: cn('form-input-container', { open: this.isOpen, disableInput }) }, h("form-shadow-input", { name: this.name, form: this.form, value: this.selectedValue }), h("input", { type: "text", disabled: disableInput, part: `${this.name}-input-select form-input-select`, value: this.searchable ? this.searchValue : (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.label) || '', readOnly: !this.searchable, onInput: this.onSearchInput, onClick: this.toggleDropdown, placeholder: placeholder || (meta === null || meta === void 0 ? void 0 : meta.placeholder), class: cn('form-input-style form-input-select', {
-                'form-input-error-style': isError,
-            }) }), h("div", { part: `${this.name}-select-icon-container form-input-select-icon-container`, class: "form-input-select-icon-container" }, (selectedItem || this.searchValue) && this.clearable ? (h(AddIcon, { part: `${this.name}-cross-icon`, onClick: this.clearInput, class: "form-input-select-icon cross" })) : (h(ArrowUpIcon, { part: `${this.name}-arrow-icon select-arrow`, class: "form-input-select-icon arrow" }))), h("div", { part: cn(`${this.name}-select-container form-select-container`, {
-                'form-select-container-upwards': this.openUpwards || this.forceOpenUpwards,
-                'form-select-container-downwards': !this.openUpwards && !this.forceOpenUpwards,
-            }), class: cn('form-select-container', {
-                upwards: this.openUpwards || this.forceOpenUpwards,
-                downwards: !this.openUpwards && !this.forceOpenUpwards,
-            }) }, !!filteredOptions.length &&
-            (this.reverseOptions ? [...filteredOptions].reverse() : filteredOptions).map(option => (h("button", { type: "button", part: cn(`${this.name}-select-option form-select-option`, { 'form-select-option-selected': this.selectedValue === option.value }), onClick: () => this.handleSelection(option), class: cn('form-select-option', {
-                    selected: this.selectedValue === option.value,
-                }) }, h("div", { part: `${this.name}-select-option-label form-select-option-label`, class: "form-select-option-label" }, option.label), h(TickIcon, { part: `${this.name}-tick-icon`, class: "form-select-option-tick" })))), !filteredOptions.length && (h("div", { part: `${this.name}-select-empty-container form-select-empty-container`, class: cn('form-select-empty-container', { error: this.fetchingErrorMessage }) }, this.fetchingErrorMessage && (getNestedValue(locale, this.fetchingErrorMessage) || this.fetchingErrorMessage || ((_b = (_a = locale === null || locale === void 0 ? void 0 : locale.sharedFormLocales) === null || _a === void 0 ? void 0 : _a.errors) === null || _b === void 0 ? void 0 : _b.wildCard)), !this.fetchingErrorMessage &&
-            (this.isFetching ? (h("img", { part: `${this.name}-select-spinner form-select-spinner`, class: "form-select-spinner", src: Loader })) : ((_c = locale === null || locale === void 0 ? void 0 : locale.sharedFormLocales) === null || _c === void 0 ? void 0 : _c.noSelectOptions)))))), h(FormErrorMessage, { name: this.name, isError: isError, errorMessage: errorTextMessage }))));
+        return (h(Host, { translate: "no" }, h("label", { part: `${this.name}`, id: this.wrapperId, class: cn('form-input-label-container', this.wrapperClass, { disabled: disableInput }) }, h(FormInputLabel, { name: this.name, isRequired: isRequired || this.isRequired, label: label }), h("shift-select", { name: this.name, isError: isError, isOpen: this.isOpen, options: filteredOptions, clearable: this.clearable, isLoading: this.isFetching, disableInput: disableInput, searchable: this.searchable, searchValue: this.searchValue, selectedValue: this.selectedValue, reverseOptions: this.reverseOptions, handleSelection: this.handleSelection, forceOpenUpwards: this.forceOpenUpwards, updateContext: this.updateShiftSelectContext, placeholder: placeholder || (meta === null || meta === void 0 ? void 0 : meta.placeholder), noSelectionText: (_a = locale === null || locale === void 0 ? void 0 : locale.sharedFormLocales) === null || _a === void 0 ? void 0 : _a.noSelectOptions, fetchingErrorText: !this.fetchingErrorMessage ? '' : getNestedValue(locale, this.fetchingErrorMessage) || this.fetchingErrorMessage || ((_c = (_b = locale === null || locale === void 0 ? void 0 : locale.sharedFormLocales) === null || _b === void 0 ? void 0 : _b.errors) === null || _c === void 0 ? void 0 : _c.wildCard) }, h("form-shadow-input", { name: this.name, form: this.form, value: this.selectedValue })), h(FormErrorMessage, { name: this.name, isError: isError, errorMessage: errorTextMessage }))));
     }
     static get is() { return "form-select"; }
     static get originalStyleUrls() {
@@ -584,10 +524,9 @@ export class FormSelect {
     static get states() {
         return {
             "searchValue": {},
-            "isFetching": {},
             "isOpen": {},
             "selectedValue": {},
-            "openUpwards": {},
+            "isFetching": {},
             "options": {},
             "fetchingErrorMessage": {}
         };

package/dist/collection/components/forms/defaults/mappers.js

@@ -3,18 +3,12 @@
  * Copyright (c)
  */
 import { h } from "@stencil/core";
-import { getPhoneValidator } from "../../../features/form-hook/index";
 import { VehicleImageViewer } from "../../form-elements/VehicleImageViewer";
 import { CalendarDaysIcon } from "../../../global/assets/calendar-days-icon";
 import { format, isBefore, isEqual } from "date-fns";
 import { decodeTimeOffset } from "../../../global/lib/decode-time-offset";
 import { populateItems } from "../../../global/lib/populate-items";
-export const getFormMappers = (stateObject, extraMappers = {}) => (Object.assign({ submit: ({ props }) => h("form-submit", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), inputPreview: ({ props }) => h("form-input-preview", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), fileUploader: ({ props }) => h("form-file", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), formStepper: ({ props, language }) => h("form-stepper", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name, language: language }, props)), back: ({ props }) => h("form-stepper-control", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), stepperSubmit: ({ props }) => h("form-stepper-submit", Object.assign({ key: (props === null || props === void 0 ? void 0 : props.step) || (props === null || props === void 0 ? void 0 : props.name) }, props)), name: ({ props }) => h("form-input", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), lastName: ({ props }) => h("form-input", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), email: ({ props }) => h("form-input", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name, type: "email" }, props)), message: ({ props }) => h("form-text-area", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), file: ({ props }) => h("form-file", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), vin: ({ props }) => h("form-vin-input", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), vehicleImage: ({ form }) => h(VehicleImageViewer, { form: form }), phone: ({ props, isLoading }) => {
-        if (!stateObject.phoneValidator) {
-            stateObject.phoneValidator = getPhoneValidator((props === null || props === void 0 ? void 0 : props.countryCode) || '');
-        }
-        return h("form-phone-number", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name, defaultValue: stateObject.phoneValidator.default }, props, { isLoading: isLoading, validator: stateObject.phoneValidator }));
-    }, vehicle: ({ language, props }) => {
+export const getFormMappers = (extraMappers = {}) => (Object.assign({ submit: ({ props }) => h("form-submit", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), inputPreview: ({ props }) => h("form-input-preview", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), fileUploader: ({ props }) => h("form-file", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), formStepper: ({ props, language }) => h("form-stepper", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name, language: language }, props)), back: ({ props }) => h("form-stepper-control", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), stepperSubmit: ({ props }) => h("form-stepper-submit", Object.assign({ key: (props === null || props === void 0 ? void 0 : props.step) || (props === null || props === void 0 ? void 0 : props.name) }, props)), name: ({ props }) => h("form-input", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), lastName: ({ props }) => h("form-input", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), email: ({ props }) => h("form-input", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name, type: "email" }, props)), message: ({ props }) => h("form-text-area", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), file: ({ props }) => h("form-file", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), vin: ({ props }) => h("form-vin-input", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name }, props)), vehicleImage: ({ form }) => h(VehicleImageViewer, { form: form }), phone: ({ props, isLoading }) => h("form-phone-number", Object.assign({ key: props === null || props === void 0 ? void 0 : props.name, isLoading: isLoading }, props)), vehicle: ({ language, props }) => {
         const fetcher = async ({ signal, context }) => {
             var _a, _b;
             const params = new URLSearchParams(window.location.search);

package/dist/collection/components/forms/defaults/style.css

@@ -1 +1 @@
-*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: ;border:0 solid #e5e7eb;box-sizing:border-box}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])){display:none}.block{display:block}.flex{display:flex}.grid{display:grid}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:host{all:initial!important;display:block;font-family:inherit!important}@keyframes form-loading-spin{to{transform:rotate(1turn)}}.form-loader-container .img{animation:form-loading-spin 2s linear infinite;height:32px;width:32px}*{-webkit-user-select:none;-moz-user-select:none;user-select:none}#vehicle-wrapper{display:flex;flex-direction:column}@media (min-width:640px){#vehicle-wrapper{align-items:center;display:grid;gap:24px;grid-template-columns:repeat(2,minmax(0,1fr))}}.pointer-events-none{pointer-events:none}.static{position:static}.absolute{position:absolute}.relative{position:relative}.left-0{left:0}.top-0{top:0}.h-full{height:100%}.min-h-\[150px\]{min-height:150px}.w-full{width:100%}.items-center{align-items:center}.justify-center{justify-content:center}.opacity-0{opacity:0}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.transition-opacity{transition-duration:.15s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-500{transition-duration:.5s}.\!h-auto{height:auto!important}.min-w-full{min-width:100%}.resize{resize:both}.overflow-hidden{overflow:hidden}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.\!transition-none{transition-property:none!important}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.\!duration-0{transition-duration:0s!important}.\!duration-500{transition-duration:.5s!important}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.fixed{position:fixed}.bottom-4{bottom:1rem}.left-1\/2{left:50%}.z-10{z-index:10}.z-\[9999\]{z-index:9999}.hidden{display:none}.aspect-video{aspect-ratio:16/9}.size-8{height:2rem;width:2rem}.size-\[32px\]{height:32px;width:32px}.size-full{height:100%;width:100%}.h-\[100dvh\]{height:100dvh}.h-\[60px\]{height:60px}.min-h-full{min-height:100%}.w-\[100dvw\]{width:100dvw}.w-\[100px\]{width:100px}.-translate-x-1\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.animate-spin{animation:spin 1s linear infinite}.cursor-pointer{cursor:pointer}.justify-between{justify-content:space-between}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-slate-500{--tw-border-opacity:1;border-color:rgb(100 116 139/var(--tw-border-opacity,1))}.border-slate-600{--tw-border-opacity:1;border-color:rgb(71 85 105/var(--tw-border-opacity,1))}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.bg-black\/30{background-color:rgba(0,0,0,.3)}.bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.object-cover{object-fit:cover}.object-center{object-position:center}.p-1{padding:.25rem}.p-\[16px\]{padding:16px}.py-\[10px\]{padding-bottom:10px;padding-top:10px}.text-center{text-align:center}.text-\[18px\]{font-size:18px}.text-slate-100{--tw-text-opacity:1;color:rgb(241 245 249/var(--tw-text-opacity,1))}.text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity,1))}.shadow,.shadow-lg{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.hover\:border-slate-700:hover{--tw-border-opacity:1;border-color:rgb(51 65 85/var(--tw-border-opacity,1))}.hover\:bg-slate-300:hover{--tw-bg-opacity:1;background-color:rgb(203 213 225/var(--tw-bg-opacity,1))}.hover\:text-slate-700:hover{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.disabled\:bg-white\/75:disabled{background-color:hsla(0,0%,100%,.75)}@media (min-width:768px){.md\:relative{position:relative}.md\:h-auto{height:auto}.md\:w-\[600px\]{width:600px}.md\:\!translate-x-0{--tw-translate-x:0px!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.md\:overflow-hidden{overflow:hidden}.md\:rounded-lg{border-radius:.5rem}.md\:border-none{border-style:none}.md\:bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.md\:py-\[8px\]{padding-bottom:8px;padding-top:8px}.md\:text-\[24px\]{font-size:24px}.md\:text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.md\:\!opacity-100{opacity:1!important}.md\:transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.md\:duration-300{transition-duration:.3s}.md\:hover\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}}
+*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: ;border:0 solid #e5e7eb;box-sizing:border-box}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])){display:none}.block{display:block}.flex{display:flex}.grid{display:grid}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:host{all:initial!important;display:block;font-family:inherit!important}@keyframes form-loading-spin{to{transform:rotate(1turn)}}.form-loader-container .img{animation:form-loading-spin 2s linear infinite;height:32px;width:32px}*{-webkit-user-select:none;-moz-user-select:none;user-select:none}#vehicle-wrapper{display:flex;flex-direction:column}@media (min-width:640px){#vehicle-wrapper{align-items:center;display:grid;gap:24px;grid-template-columns:repeat(2,minmax(0,1fr))}}.pointer-events-none{pointer-events:none}.static{position:static}.absolute{position:absolute}.relative{position:relative}.left-0{left:0}.top-0{top:0}.h-full{height:100%}.min-h-\[150px\]{min-height:150px}.w-full{width:100%}.items-center{align-items:center}.justify-center{justify-content:center}.opacity-0{opacity:0}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.transition-opacity{transition-duration:.15s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-500{transition-duration:.5s}.\!h-auto{height:auto!important}.min-w-full{min-width:100%}.resize{resize:both}.overflow-hidden{overflow:hidden}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.\!transition-none{transition-property:none!important}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.\!duration-0{transition-duration:0s!important}.\!duration-500{transition-duration:.5s!important}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.cursor-pointer{cursor:pointer}.fixed{position:fixed}.bottom-4{bottom:1rem}.left-1\/2{left:50%}.z-10{z-index:10}.z-\[9999\]{z-index:9999}.hidden{display:none}.aspect-video{aspect-ratio:16/9}.size-8{height:2rem;width:2rem}.size-\[32px\]{height:32px;width:32px}.size-full{height:100%;width:100%}.h-\[100dvh\]{height:100dvh}.h-\[60px\]{height:60px}.min-h-full{min-height:100%}.w-\[100dvw\]{width:100dvw}.w-\[100px\]{width:100px}.-translate-x-1\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.animate-spin{animation:spin 1s linear infinite}.justify-between{justify-content:space-between}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-slate-500{--tw-border-opacity:1;border-color:rgb(100 116 139/var(--tw-border-opacity,1))}.border-slate-600{--tw-border-opacity:1;border-color:rgb(71 85 105/var(--tw-border-opacity,1))}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.bg-black\/30{background-color:rgba(0,0,0,.3)}.bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.object-cover{object-fit:cover}.object-center{object-position:center}.p-1{padding:.25rem}.p-\[16px\]{padding:16px}.py-\[10px\]{padding-bottom:10px;padding-top:10px}.text-center{text-align:center}.text-\[18px\]{font-size:18px}.text-slate-100{--tw-text-opacity:1;color:rgb(241 245 249/var(--tw-text-opacity,1))}.text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity,1))}.shadow,.shadow-lg{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.hover\:border-slate-700:hover{--tw-border-opacity:1;border-color:rgb(51 65 85/var(--tw-border-opacity,1))}.hover\:bg-slate-300:hover{--tw-bg-opacity:1;background-color:rgb(203 213 225/var(--tw-bg-opacity,1))}.hover\:text-slate-700:hover{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.disabled\:bg-white\/75:disabled{background-color:hsla(0,0%,100%,.75)}@media (min-width:768px){.md\:relative{position:relative}.md\:h-auto{height:auto}.md\:w-\[600px\]{width:600px}.md\:\!translate-x-0{--tw-translate-x:0px!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.md\:overflow-hidden{overflow:hidden}.md\:rounded-lg{border-radius:.5rem}.md\:border-none{border-style:none}.md\:bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.md\:py-\[8px\]{padding-bottom:8px;padding-top:8px}.md\:text-\[24px\]{font-size:24px}.md\:text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.md\:\!opacity-100{opacity:1!important}.md\:transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.md\:duration-300{transition-duration:.3s}.md\:hover\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}}

package/dist/collection/components/forms/defaults/validation.js

@@ -13,7 +13,7 @@ export const placeholder = (name) => `${name}-placeholder`;
 export const meta = (name) => ({ label: label(name), placeholder: placeholder(name) });
 export const condition = (name) => `$${name}Required`;
 export const y = { label, format, require, condition, placeholder, meta, size, max };
-export const getFormValidations = (stateObject, extraFields = {}) => {
+export const getFormValidations = (extraFields = {}) => {
     return object(Object.assign({ name: string()
             .meta(meta('name'))
             .when(condition('name'), {
@@ -45,12 +45,6 @@ export const getFormValidations = (stateObject, extraFields = {}) => {
             is: true,
             otherwise: schema => schema.optional(),
             then: schema => schema.required(require('vin')).test(format('vin'), format('vin'), a => validateVin(a === null || a === void 0 ? void 0 : a.toUpperCase())),
-        }), phone: string()
-            .meta(meta('phone'))
-            .when(condition('phone'), {
-            is: true,
-            otherwise: schema => schema.optional(),
-            then: schema => schema.required(require('phone')).test(format('phone'), format('phone'), () => { var _a; return (_a = stateObject === null || stateObject === void 0 ? void 0 : stateObject.phoneValidator) === null || _a === void 0 ? void 0 : _a.geIsValidPhoneNumber(); }),
         }), vehicle: string()
             .meta(meta('vehicle'))
             .when(y.condition('vehicle'), {

package/dist/collection/components/forms/general-form.js

@@ -10,10 +10,8 @@ import cn from "../../global/lib/cn";
 import { LoaderIcon } from "../../global/assets/loader-icon";
 import { getFormValidations } from "./defaults/validation";
 import { getFormMappers } from "./defaults/mappers";
-import { getDefaultStateObject } from "./defaults/state-object";
-let stateObject = getDefaultStateObject();
-const validation = getFormValidations(stateObject);
-const elementMapper = getFormMappers(stateObject);
+const validation = getFormValidations();
+const elementMapper = getFormMappers();
 export class GeneralForm {
     constructor() {
         this.locale = { sharedFormLocales: sharedFormLocalesSchema.getDefault() };
@@ -58,9 +56,9 @@ export class GeneralForm {
     // #endregion
     render() {
         var _a, _b;
-        return (h(Host, { key: 'a7eecc8181da7b8b346a0be6cd61bd2692611944', translate: "no" }, h("div", { key: '56ca7b9587a1ececcbbd5c164d9cf19f07c5ca14', part: cn('shift-form', (_b = (_a = this.structure) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.theme, this.theme) }, h("div", { key: 'ce7a9e65ab0fd26fba4d64a315229ea5a348caf4', part: "form-container", class: "relative min-h-[150px]" }, h("div", { key: 'f2fc3166572e7c82031be59894d640746b44d9df', part: "form-loader-container", class: cn('form-loader-container absolute top-0 left-0 w-full h-full pointer-events-none flex justify-center items-center transition-opacity duration-500', {
+        return (h(Host, { key: '5239ff4c1dd281969d2e2bed0910e1576d67eaac', translate: "no" }, h("div", { key: 'd0c6ad105d838fe8070461a98d4fb05257bc04bb', part: cn('shift-form', (_b = (_a = this.structure) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.theme, this.theme) }, h("div", { key: '3777a05be973b7c3231bafbf906fee3b99f79977', part: "form-container", class: "relative min-h-[150px]" }, h("div", { key: 'dfd8d422406f692cdab47970ecdb293aeb49c3b5', part: "form-loader-container", class: cn('form-loader-container absolute top-0 left-0 w-full h-full pointer-events-none flex justify-center items-center transition-opacity duration-500', {
                 'opacity-0': this.structureRendered,
-            }) }, h(LoaderIcon, { key: '670e815d77b5a0af19fce038270312c6a4804e14', part: "form-loader-icon", class: "img" })), h("flexible-container", { key: 'd9c6506ef61361041c0912e38c5970ed2c958ba2', onlyForMounting: true, isOpened: this.structureRendered }, !!this.form && (h("form-structure", { key: 'bc5d3954f72ad238dc37fbc4d878943ddd560c79', form: this.form, fields: this.fields, formId: this.formId, formLocale: this.locale, structure: this.structure, isLoading: this.isLoading, language: this.localeLanguage, errorMessage: this.errorMessage, formElementMapper: elementMapper, successMessage: this.locale['Form submitted successfully.'] || 'Form submitted successfully.' }, h("slot", { key: 'a62cd77628a6938a905529a33887b1b27fd57de9' }))))))));
+            }) }, h(LoaderIcon, { key: '5515b40a35b4b30b0be94c778f6839b366202029', part: "form-loader-icon", class: "img" })), h("flexible-container", { key: '22f07ad7e3acadb4a5bd0e4b246f54a4b887757b', onlyForMounting: true, isOpened: this.structureRendered }, !!this.form && (h("form-structure", { key: '7e9ce2ad07b39ac56839351f552a2fc02371ec95', form: this.form, fields: this.fields, formId: this.formId, formLocale: this.locale, structure: this.structure, isLoading: this.isLoading, language: this.localeLanguage, errorMessage: this.errorMessage, formElementMapper: elementMapper, successMessage: this.locale['Form submitted successfully.'] || 'Form submitted successfully.' }, h("slot", { key: '4bf12d1b145995225c1dfc4ee1812f0b5cdaddd2' }))))))));
     }
     static get is() { return "general-form"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/forms/general-inquiry.js

@@ -11,9 +11,7 @@ import { LoaderIcon } from "../../global/assets/loader-icon";
 import { string } from "yup";
 import { getFormValidations, y } from "./defaults/validation";
 import { getFormMappers } from "./defaults/mappers";
-import { getDefaultStateObject } from "./defaults/state-object";
-let stateObject = getDefaultStateObject();
-const validation = getFormValidations(stateObject, {
+const validation = getFormValidations({
     generalTicketType: string()
         .meta(y.meta('generalTicketType'))
         .when(y.condition('generalTicketType'), {
@@ -22,7 +20,7 @@ const validation = getFormValidations(stateObject, {
         then: schema => schema.required(y.require('generalTicketType')),
     }),
 });
-const elementMapper = getFormMappers(stateObject, {
+const elementMapper = getFormMappers({
     generalTicketType: ({ language, props }) => {
         const fetcher = async ({}) => {
             const options = Array.isArray(props === null || props === void 0 ? void 0 : props.options) ? props === null || props === void 0 ? void 0 : props.options : [];
@@ -75,9 +73,9 @@ export class GeneralInquiryForm {
     // #endregion
     render() {
         var _a, _b;
-        return (h(Host, { key: '38849baa5ec06c21fbb28ba52c8547d5c06804df', translate: "no" }, h("div", { key: 'bb58fbf9579cca9ff64077dfc0ba9b3b45847508', part: cn('shift-form', (_b = (_a = this.structure) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.theme, this.theme) }, h("div", { key: '72c22506c012de162a385ffd609e4d20a71c8fb1', part: "form-container", class: "relative min-h-[150px]" }, h("div", { key: '0a495ecac17eaf5d9e7026cce8401f96cb7933d5', part: "form-loader-container", class: cn('form-loader-container absolute top-0 left-0 w-full h-full pointer-events-none flex justify-center items-center transition-opacity duration-500', {
+        return (h(Host, { key: '3778fda81da661d719aad269180e6269b408f7e5', translate: "no" }, h("div", { key: '965f878ee5d0314cf5e6c87861ed87eab24a4c17', part: cn('shift-form', (_b = (_a = this.structure) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.theme, this.theme) }, h("div", { key: '1def9bb2b1964e6b1303ef7a3471bd8b82352179', part: "form-container", class: "relative min-h-[150px]" }, h("div", { key: '4373f8d8866267b8277cb05265e074c5916cd2ee', part: "form-loader-container", class: cn('form-loader-container absolute top-0 left-0 w-full h-full pointer-events-none flex justify-center items-center transition-opacity duration-500', {
                 'opacity-0': this.structureRendered,
-            }) }, h(LoaderIcon, { key: '70e6a44513cdbc0dff3f38e7befba8fd330239fa', part: "form-loader-icon", class: "img" })), h("flexible-container", { key: '3474e08e33d7c46aee5622bc42a682c0211efa38', onlyForMounting: true, isOpened: this.structureRendered }, !!this.form && (h("form-structure", { key: '10f3c3e5c84c9c1a7d2424ba3250750ca71e3c0b', form: this.form, fields: this.fields, formId: this.formId, formLocale: this.locale, structure: this.structure, isLoading: this.isLoading, language: this.localeLanguage, errorMessage: this.errorMessage, formElementMapper: elementMapper, successMessage: this.locale['Form submitted successfully.'] || 'Form submitted successfully.' }, h("slot", { key: '3d16a9879a3f3b2d8a1fa741ff205da90122ba11' }))))))));
+            }) }, h(LoaderIcon, { key: '17930f22899a535db1cbc0ce8cf590f1c662f80c', part: "form-loader-icon", class: "img" })), h("flexible-container", { key: 'c089c41f7c63fc242862e7e82e5a42bf1c794658', onlyForMounting: true, isOpened: this.structureRendered }, !!this.form && (h("form-structure", { key: 'd759c318d33f650305142f371328e87693e6b26c', form: this.form, fields: this.fields, formId: this.formId, formLocale: this.locale, structure: this.structure, isLoading: this.isLoading, language: this.localeLanguage, errorMessage: this.errorMessage, formElementMapper: elementMapper, successMessage: this.locale['Form submitted successfully.'] || 'Form submitted successfully.' }, h("slot", { key: '98a5c921a9a16d00f5b953af51997d8bb4ee613f' }))))))));
     }
     static get is() { return "general-inquiry-form"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/forms/service-booking.js

@@ -10,10 +10,8 @@ import cn from "../../global/lib/cn";
 import { LoaderIcon } from "../../global/assets/loader-icon";
 import { getFormValidations } from "./defaults/validation";
 import { getFormMappers } from "./defaults/mappers";
-import { getDefaultStateObject } from "./defaults/state-object";
-let stateObject = getDefaultStateObject();
-const validation = getFormValidations(stateObject);
-const elementMapper = getFormMappers(stateObject);
+const validation = getFormValidations();
+const elementMapper = getFormMappers();
 export class ServiceBookingForm {
     constructor() {
         this.locale = { sharedFormLocales: sharedFormLocalesSchema.getDefault() };
@@ -58,9 +56,9 @@ export class ServiceBookingForm {
     // #endregion
     render() {
         var _a, _b;
-        return (h(Host, { key: 'e6699ce8ed175af74ab317cd5f49e011c76c0a58', translate: "no" }, h("div", { key: 'ce60f11e6cda7fc9c8ec3c058e9bd1bc2cae2951', part: cn('shift-form', (_b = (_a = this.structure) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.theme, this.theme) }, h("div", { key: '7c9bb51b347deca5bc4e0c41f3dd01c22aa8614c', part: "form-container", class: "relative min-h-[150px]" }, h("div", { key: '8440bc3f03295b1dbdd30ebca05f596bcb494cc3', part: "form-loader-container", class: cn('form-loader-container absolute top-0 left-0 w-full h-full pointer-events-none flex justify-center items-center transition-opacity duration-500', {
+        return (h(Host, { key: '90e81dc68f99658268f7c5c12bdc329e5a9217ba', translate: "no" }, h("div", { key: '86f682cae122268060bde8a14e13248cfa4c4357', part: cn('shift-form', (_b = (_a = this.structure) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.theme, this.theme) }, h("div", { key: 'ecfb15b89332887f71cc29079b9392ddf98e8f1e', part: "form-container", class: "relative min-h-[150px]" }, h("div", { key: '08f9a99565a459bbf905d26de7621db5e8aba762', part: "form-loader-container", class: cn('form-loader-container absolute top-0 left-0 w-full h-full pointer-events-none flex justify-center items-center transition-opacity duration-500', {
                 'opacity-0': this.structureRendered,
-            }) }, h(LoaderIcon, { key: 'de21bf6fd114bcfd0aac55db06849a5f2ccd9b16', part: "form-loader-icon", class: "img" })), h("flexible-container", { key: 'd7fbeecd1c77ad989d69ecc9f215f5572ba3ba3f', onlyForMounting: true, isOpened: this.structureRendered }, !!this.form && (h("form-structure", { key: '3d33f055360a208c6e1818d5561f8376520e8415', form: this.form, fields: this.fields, formId: this.formId, formLocale: this.locale, structure: this.structure, isLoading: this.isLoading, language: this.localeLanguage, errorMessage: this.errorMessage, formElementMapper: elementMapper, successMessage: this.locale['Form submitted successfully.'] || 'Form submitted successfully.' }, h("slot", { key: 'bb7cfa0c2b9828f60e7e72ba297b61132c7126d8' }))))))));
+            }) }, h(LoaderIcon, { key: 'd9aef55b1249f8d0e5eeb8a6f3975378b406cedc', part: "form-loader-icon", class: "img" })), h("flexible-container", { key: '66ddb9b4f9799c0f9934abcf7d26ce95a86ed4ca', onlyForMounting: true, isOpened: this.structureRendered }, !!this.form && (h("form-structure", { key: 'af3c7fe0852ab399cdedf22c46e5e7e5d28838d8', form: this.form, fields: this.fields, formId: this.formId, formLocale: this.locale, structure: this.structure, isLoading: this.isLoading, language: this.localeLanguage, errorMessage: this.errorMessage, formElementMapper: elementMapper, successMessage: this.locale['Form submitted successfully.'] || 'Form submitted successfully.' }, h("slot", { key: '6fabd4ff26b1398734165c8c15b17118cfe9ba03' }))))))));
     }
     static get is() { return "service-booking-form"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/forms/ssc-lookup.js

@@ -10,10 +10,8 @@ import cn from "../../global/lib/cn";
 import { LoaderIcon } from "../../global/assets/loader-icon";
 import { getFormValidations } from "./defaults/validation";
 import { getFormMappers } from "./defaults/mappers";
-import { getDefaultStateObject } from "./defaults/state-object";
-let stateObject = getDefaultStateObject();
-const validation = getFormValidations(stateObject);
-const elementMapper = getFormMappers(stateObject);
+const validation = getFormValidations();
+const elementMapper = getFormMappers();
 export class SSCLookupForm {
     constructor() {
         this.locale = { sharedFormLocales: sharedFormLocalesSchema.getDefault() };
@@ -69,9 +67,9 @@ export class SSCLookupForm {
     // #endregion
     render() {
         var _a, _b;
-        return (h(Host, { key: '7432e29502bf4ab6a10e89fb64579f41d4257274', translate: "no" }, h("div", { key: '28497fc0f52c7e0b20db4dccf0b0b51aeec7c042', part: cn('shift-form', (_b = (_a = this.structure) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.theme, this.theme) }, h("div", { key: '7dc9c39a6c34a11da737f5599e7b39ce2946392e', part: "form-container", class: "relative min-h-[150px]" }, h("div", { key: '1ac87d5561e9083d848527bf68830cc8713a4f1d', part: "form-loader-container", class: cn('form-loader-container absolute top-0 left-0 w-full h-full pointer-events-none flex justify-center items-center transition-opacity duration-500', {
+        return (h(Host, { key: '1507cf3bf7b610dc08382a4071e0d67581a64546', translate: "no" }, h("div", { key: '5b100fb719f8f4cbd4ee7efa3c85eac12a08d13a', part: cn('shift-form', (_b = (_a = this.structure) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.theme, this.theme) }, h("div", { key: '945ed53b3fb772ca407fa198c3e255777c7d13e7', part: "form-container", class: "relative min-h-[150px]" }, h("div", { key: '5abfa5d088f599bfb6197de400b9fa79efa0b519', part: "form-loader-container", class: cn('form-loader-container absolute top-0 left-0 w-full h-full pointer-events-none flex justify-center items-center transition-opacity duration-500', {
                 'opacity-0': this.structureRendered,
-            }) }, h(LoaderIcon, { key: '486ae3a91bdad8bebf18e31d4924c1440846cec7', part: "form-loader-icon", class: "img" })), h("flexible-container", { key: '4083668f9c35c59fd680edf3fd419251c1412edd', onlyForMounting: true, isOpened: this.structureRendered }, !!this.form && (h("form-structure", { key: '09b250445491b3e8fe999e39aa5f52248f3eecf6', form: this.form, fields: this.fields, formId: this.formId, formLocale: this.locale, structure: this.structure, isLoading: this.isLoading, language: this.localeLanguage, errorMessage: this.errorMessage, formElementMapper: elementMapper, successMessage: this.locale['Form submitted successfully.'] || 'Form submitted successfully.' }, h("slot", { key: '7f4d2453daeb9dd4c1612d14825c60d8f7e44d13' }))))))));
+            }) }, h(LoaderIcon, { key: 'a84a96cec2e1566d3942c3787323586ba034d99f', part: "form-loader-icon", class: "img" })), h("flexible-container", { key: '2b199893089c69358ec9f7864239cd652f7504ce', onlyForMounting: true, isOpened: this.structureRendered }, !!this.form && (h("form-structure", { key: 'e245b09edaa1972a00687b41e2e3081333762a49', form: this.form, fields: this.fields, formId: this.formId, formLocale: this.locale, structure: this.structure, isLoading: this.isLoading, language: this.localeLanguage, errorMessage: this.errorMessage, formElementMapper: elementMapper, successMessage: this.locale['Form submitted successfully.'] || 'Form submitted successfully.' }, h("slot", { key: '400ddd123e7eb7ee87328a256a9aeba59152fd3a' }))))))));
     }
     static get is() { return "ssc-lookup-form"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/forms/test-drive.js

@@ -10,10 +10,8 @@ import cn from "../../global/lib/cn";
 import { LoaderIcon } from "../../global/assets/loader-icon";
 import { getFormValidations } from "./defaults/validation";
 import { getFormMappers } from "./defaults/mappers";
-import { getDefaultStateObject } from "./defaults/state-object";
-let stateObject = getDefaultStateObject();
-const validation = getFormValidations(stateObject);
-const elementMapper = getFormMappers(stateObject);
+const validation = getFormValidations();
+const elementMapper = getFormMappers();
 export class TestDriveForm {
     constructor() {
         this.locale = { sharedFormLocales: sharedFormLocalesSchema.getDefault() };
@@ -58,9 +56,9 @@ export class TestDriveForm {
     // #endregion
     render() {
         var _a, _b;
-        return (h(Host, { key: '9ec8f74fff7522248d1aeadce1c16038942dd665', translate: "no" }, h("div", { key: 'bb38406876b1c2884a93c3649f2b8701913efb50', part: cn('shift-form', (_b = (_a = this.structure) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.theme, this.theme) }, h("div", { key: 'd42f73694d89d43000b3d069e5b8af7ed30cb3c1', part: "form-container", class: "relative min-h-[150px]" }, h("div", { key: '8c844677909bcea34e10514bdc3a24b22b94d63b', part: "form-loader-container", class: cn('form-loader-container absolute top-0 left-0 w-full h-full pointer-events-none flex justify-center items-center transition-opacity duration-500', {
+        return (h(Host, { key: '30f38d5e5bddd165f40545860734738f29ae1d0f', translate: "no" }, h("div", { key: '614c1d4901cf2713bbcb745540678f951732e43a', part: cn('shift-form', (_b = (_a = this.structure) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.theme, this.theme) }, h("div", { key: '025dd58198caf0413d5fb894a337b8a4bba8d488', part: "form-container", class: "relative min-h-[150px]" }, h("div", { key: '7a34aed2fe944c4582a8817294ec456a239ea539', part: "form-loader-container", class: cn('form-loader-container absolute top-0 left-0 w-full h-full pointer-events-none flex justify-center items-center transition-opacity duration-500', {
                 'opacity-0': this.structureRendered,
-            }) }, h(LoaderIcon, { key: 'bdc99bdc45095ae639fb3e5e4e71c71c9b445e95', part: "form-loader-icon", class: "img" })), h("flexible-container", { key: 'f7592bb67d1210aefd86130ea241acb4d3361ff2', onlyForMounting: true, isOpened: this.structureRendered }, !!this.form && (h("form-structure", { key: 'de878f320280714ad7dc39c2b9112d804766c005', form: this.form, fields: this.fields, formId: this.formId, formLocale: this.locale, structure: this.structure, isLoading: this.isLoading, language: this.localeLanguage, errorMessage: this.errorMessage, formElementMapper: elementMapper, successMessage: this.locale['Form submitted successfully.'] || 'Form submitted successfully.' }, h("slot", { key: '6294bc637000ff9f6199cb0b8802b8b027b40738' }))))))));
+            }) }, h(LoaderIcon, { key: 'd6656d517dde4a6d278cbfdb17f79e398450c986', part: "form-loader-icon", class: "img" })), h("flexible-container", { key: '7aba61eac290029de1221f1981c5ee1be8da0da6', onlyForMounting: true, isOpened: this.structureRendered }, !!this.form && (h("form-structure", { key: 'e08bb193bccced62c8115df52da2ab630bf97d2c', form: this.form, fields: this.fields, formId: this.formId, formLocale: this.locale, structure: this.structure, isLoading: this.isLoading, language: this.localeLanguage, errorMessage: this.errorMessage, formElementMapper: elementMapper, successMessage: this.locale['Form submitted successfully.'] || 'Form submitted successfully.' }, h("slot", { key: 'ca9ea2eaf549a67e5c64b224e0ddd97ecf6057dc' }))))))));
     }
     static get is() { return "test-drive-form"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/forms/vehicle-quotation/element-mapper.js

@@ -3,20 +3,13 @@
  * Copyright (c)
  */
 import { h } from "@stencil/core";
-import { getPhoneValidator } from "../../../features/form-hook/index";
 import { VehicleImageViewer } from "./VehicleImageViewer";
-export let phoneValidator;
 export const vehicleQuotationElements = {
     'submit': ({ props }) => h("form-submit", Object.assign({}, props)),
     'name': ({ props }) => {
         return h("form-input", Object.assign({}, props));
     },
-    'phone': ({ props, isLoading }) => {
-        if (!phoneValidator) {
-            phoneValidator = getPhoneValidator((props === null || props === void 0 ? void 0 : props.countryCode) || '');
-        }
-        return h("form-phone-number", Object.assign({ defaultValue: phoneValidator.default }, props, { isLoading: isLoading, validator: phoneValidator }));
-    },
+    'phone': ({ props, isLoading }) => h("form-phone-number", Object.assign({ isLoading: isLoading }, props)),
     'vehicle': ({ form, language, props }) => {
         var _a;
         const fetcher = async ({ signal }) => {

package/dist/collection/components/forms/vehicle-quotation/themes.css

@@ -1 +1 @@
-*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: ;border:0 solid #e5e7eb;box-sizing:border-box}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])){display:none}.block{display:block}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:host{all:initial!important;display:block;font-family:inherit!important}@keyframes spin{to{transform:rotate(1turn)}}.form-loader-container .img{animation:spin 2s linear infinite;height:32px;width:32px}*{-webkit-user-select:none;-moz-user-select:none;user-select:none}.pointer-events-none{pointer-events:none}.static{position:static}.absolute{position:absolute}.relative{position:relative}.left-0{left:0}.top-0{top:0}.flex{display:flex}.h-full{height:100%}.min-h-\[150px\]{min-height:150px}.w-full{width:100%}.items-center{align-items:center}.justify-center{justify-content:center}.opacity-0{opacity:0}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.transition-opacity{transition-duration:.15s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-500{transition-duration:.5s}.\!h-auto{height:auto!important}.min-w-full{min-width:100%}.resize{resize:both}.overflow-hidden{overflow:hidden}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.\!transition-none{transition-property:none!important}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.\!duration-0{transition-duration:0s!important}.\!duration-500{transition-duration:.5s!important}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}
+*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: ;border:0 solid #e5e7eb;box-sizing:border-box}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])){display:none}.block{display:block}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:host{all:initial!important;display:block;font-family:inherit!important}@keyframes spin{to{transform:rotate(1turn)}}.form-loader-container .img{animation:spin 2s linear infinite;height:32px;width:32px}*{-webkit-user-select:none;-moz-user-select:none;user-select:none}.pointer-events-none{pointer-events:none}.static{position:static}.absolute{position:absolute}.relative{position:relative}.left-0{left:0}.top-0{top:0}.flex{display:flex}.h-full{height:100%}.min-h-\[150px\]{min-height:150px}.w-full{width:100%}.items-center{align-items:center}.justify-center{justify-content:center}.opacity-0{opacity:0}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.transition-opacity{transition-duration:.15s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-500{transition-duration:.5s}.\!h-auto{height:auto!important}.min-w-full{min-width:100%}.resize{resize:both}.overflow-hidden{overflow:hidden}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.\!transition-none{transition-property:none!important}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.\!duration-0{transition-duration:0s!important}.\!duration-500{transition-duration:.5s!important}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.cursor-pointer{cursor:pointer}

package/dist/collection/components/forms/vehicle-quotation/validations.js

@@ -3,7 +3,6 @@
  * Copyright (c)
  */
 import { object, string } from "yup";
-import { phoneValidator } from "./element-mapper";
 export const vehicleQuotationInputsValidation = object({
     vehicle: string()
         .meta({ label: 'Vehicle', placeholder: 'Please select a Vehicle' })
@@ -12,10 +11,6 @@ export const vehicleQuotationInputsValidation = object({
         .meta({ label: 'Full name', placeholder: 'Full name' })
         .required('Full name is required')
         .min(3, 'Full name minimum'),
-    phone: string()
-        .meta({ label: 'Phone number', placeholder: 'Phone number' })
-        .required('Phone number is required')
-        .test('phone-validation', 'Phone number format invalid', () => phoneValidator === null || phoneValidator === void 0 ? void 0 : phoneValidator.geIsValidPhoneNumber()),
     dealer: string()
         .meta({ label: 'Dealer', placeholder: 'Select a dealer' })
         .required('Dealer is required'),

package/dist/collection/components/forms/vehicle-quotation.js

@@ -318,7 +318,7 @@ export class VehicleQuotationForm {
                 "mutable": true,
                 "complexType": {
                     "original": "FormElementStructure<vehicleQuotationElementNames> | undefined",
-                    "resolved": "{ steps?: Record<LanguageKeys, Step>[]; data?: Record<string, any>; requiredContext?: Record<string, boolean>; } & { id?: string; step?: number; type?: string; class?: string; staticValue?: any; isHidden?: boolean; isDisabled?: boolean; children?: (OptionalKeys<{ vehicle: string; name: string; phone: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields | FormElementStructureComponents<OptionalKeys<{ vehicle: string; name: string; phone: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields>)[]; } & { tag: string; name?: OptionalKeys<{ vehicle: string; name: string; phone: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields; } | { steps?: Record<LanguageKeys, Step>[]; data?: Record<string, any>; requiredContext?: Record<string, boolean>; } & { id?: string; step?: number; type?: string; class?: string; staticValue?: any; isHidden?: boolean; isDisabled?: boolean; children?: (OptionalKeys<{ vehicle: string; name: string; phone: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields | FormElementStructureComponents<OptionalKeys<{ vehicle: string; name: string; phone: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields>)[]; } & { tag?: string; name: OptionalKeys<{ vehicle: string; name: string; phone: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields; }",
+                    "resolved": "{ steps?: Record<LanguageKeys, Step>[]; data?: Record<string, any>; requiredContext?: Record<string, boolean>; } & { id?: string; step?: number; type?: string; class?: string; staticValue?: any; isHidden?: boolean; isDisabled?: boolean; children?: (OptionalKeys<{ vehicle: string; name: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields | FormElementStructureComponents<OptionalKeys<{ vehicle: string; name: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields>)[]; } & { tag: string; name?: OptionalKeys<{ vehicle: string; name: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields; } | { steps?: Record<LanguageKeys, Step>[]; data?: Record<string, any>; requiredContext?: Record<string, boolean>; } & { id?: string; step?: number; type?: string; class?: string; staticValue?: any; isHidden?: boolean; isDisabled?: boolean; children?: (OptionalKeys<{ vehicle: string; name: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields | FormElementStructureComponents<OptionalKeys<{ vehicle: string; name: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields>)[]; } & { tag?: string; name: OptionalKeys<{ vehicle: string; name: string; dealer: string; city: string; paymentType: string; contactTime: string; ownVehicle: string; currentVehicleBrand: string; currentVehicleModel: string; }> | AdditionalFields; }",
                     "references": {
                         "FormElementStructure": {
                             "location": "import",

package/dist/collection/features/form-hook/form-hook.js

@@ -106,6 +106,12 @@ export class FormHook {
             const formObject = Object.fromEntries(formData.entries());
             const elements = form.querySelectorAll('[name]');
             elements.forEach(el => {
+                var _a;
+                const elementContext = (_a = this.subscribers.find(sub => sub.name === el.name)) === null || _a === void 0 ? void 0 : _a.context;
+                if (elementContext && (elementContext === null || elementContext === void 0 ? void 0 : elementContext.getValue)) {
+                    formObject[el.name] = elementContext.getValue();
+                    return;
+                }
                 if (el.disabled) {
                     formObject[el.name] = el.value;
                     return;
@@ -176,7 +182,7 @@ export class FormHook {
             this.rerender({ rerenderAll: true });
         };
         this.submitForm = async () => {
-            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+            var _a, _b, _c, _d, _e, _f;
             try {
                 this.isSubmitted = true;
                 this.context.isLoading = true;
@@ -193,10 +199,7 @@ export class FormHook {
                 const values = await this.schemaObject.omit(excludedFields).validate(formObject, { abortEarly: false, context: this.requiredContext });
                 if ((_b = (_a = this.context) === null || _a === void 0 ? void 0 : _a.structure) === null || _b === void 0 ? void 0 : _b.steps) {
                     this.stepFormValues = Object.assign(Object.assign({}, this === null || this === void 0 ? void 0 : this.stepFormValues), values);
-                    console.log((_e = (_d = (_c = this.context) === null || _c === void 0 ? void 0 : _c.structure) === null || _d === void 0 ? void 0 : _d.steps) === null || _e === void 0 ? void 0 : _e.length);
-                    console.log((_f = this.formStructure) === null || _f === void 0 ? void 0 : _f.currentStep);
-                    console.log(((_j = (_h = (_g = this.context) === null || _g === void 0 ? void 0 : _g.structure) === null || _h === void 0 ? void 0 : _h.steps) === null || _j === void 0 ? void 0 : _j.length) === ((_k = this.formStructure) === null || _k === void 0 ? void 0 : _k.currentStep));
-                    if (((_o = (_m = (_l = this.context) === null || _l === void 0 ? void 0 : _l.structure) === null || _m === void 0 ? void 0 : _m.steps) === null || _o === void 0 ? void 0 : _o.length) === ((_p = this.formStructure) === null || _p === void 0 ? void 0 : _p.currentStep))
+                    if (((_e = (_d = (_c = this.context) === null || _c === void 0 ? void 0 : _c.structure) === null || _d === void 0 ? void 0 : _d.steps) === null || _e === void 0 ? void 0 : _e.length) === ((_f = this.formStructure) === null || _f === void 0 ? void 0 : _f.currentStep))
                         await this.context.formSubmit(this.stepFormValues);
                     else
                         this.updateStep(1);

package/dist/collection/features/form-hook/functions.js

@@ -105,7 +105,6 @@ export const onFormSubmit = async ({ context, formValues, middleware, afterSucce
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11;
     try {
         context.setIsLoading(true);
-        // if (formValues?.['phone'] && !isValidPhoneNumber(formValues?.['phone'])) delete formValues?.['phone'];
         Object.keys(formValues).forEach(key => {
             if (context[`${key}-format`]) {
                 formValues[key] = context[`${key}-format`];

package/dist/collection/features/form-hook/phone-validator.js

@@ -1,41 +1 @@
-/*!
- * Built by ShiftSoftware
- * Copyright (c)
- */
-import { AsYouType } from "libphonenumber-js";
-export const getPhoneValidator = (countryCode) => {
-    const phoneValidator = new AsYouType(Array.isArray(countryCode) ? undefined : countryCode);
-    if (Array.isArray(countryCode)) {
-        phoneValidator.geIsValidPhoneNumber = () => {
-            const raw = (phoneValidator === null || phoneValidator === void 0 ? void 0 : phoneValidator.formattedOutput) || '';
-            if (!raw.trim())
-                return false;
-            for (const country of countryCode) {
-                try {
-                    const phone = new AsYouType(country);
-                    phone === null || phone === void 0 ? void 0 : phone.input(raw);
-                    if (phone === null || phone === void 0 ? void 0 : phone.isValid())
-                        return true;
-                }
-                catch (_a) { }
-            }
-            return false;
-        };
-    }
-    else if (countryCode) {
-        try {
-            phoneValidator.default = '+' + phoneValidator.metadata.numberingPlan.metadata[0];
-            phoneValidator.input(phoneValidator.default);
-        }
-        catch (error) {
-            // If metadata is not available, set empty default
-            phoneValidator.default = '';
-        }
-        phoneValidator.geIsValidPhoneNumber = () => phoneValidator === null || phoneValidator === void 0 ? void 0 : phoneValidator.isValid();
-    }
-    else {
-        phoneValidator.default = '';
-        phoneValidator.geIsValidPhoneNumber = () => (phoneValidator === null || phoneValidator === void 0 ? void 0 : phoneValidator.formattedOutput.length) > 7;
-    }
-    return phoneValidator;
-};
+export {};

package/dist/components/dead-stock-lookup.js

@@ -2,4 +2,4 @@
  * Built by ShiftSoftware
  * Copyright (c)
  */
-import{D as s,d as o}from"./p-sDS2uNRH.js";const p=s,r=o;export{p as DeadStockLookup,r as defineCustomElement}
+import{D as s,d as o}from"./p-R9s5HIai.js";const a=s,p=o;export{a as DeadStockLookup,p as defineCustomElement}