@heartlandone/vega 2.74.0-RTE-table-preview → 2.74.0

package/dist/vega/vega-input-range.entry.js

@@ -1,693 +0,0 @@
-import { h, F as Fragment, r as registerInstance, e as createEvent, g as Host, i as getElement } from './index-01a2f9c9.js';
-import { s as sanitizeVegaComponent } from './component-0cff85cf.js';
-import { V as VegaSlimmer, b as MapToComponentField, M as MapToComponentMethod, m as methodPlaceholder, e as InjectVegaGlobalSlimmer, a as InjectVegaSlimmer } from './vega-slimmer-core-83fd0e22.js';
-import { c as createEventEmitSlimmer } from './event-emit-slimmer-61db3eef.js';
-import { h as VegaChange } from './vega-event-id-61c8bd9f.js';
-import { F as FormFieldControllerSlimmer } from './form-field-controller-slimmer-316ebdb1.js';
-import { i as isArrayEqual } from './array-a1d98264.js';
-import { C as ChangeManager } from './change-manager-b115783e.js';
-import { F as FORM_ELEMENT_VALUE_CHANGE } from './static-subject-title-6fdf8c8b.js';
-import { g as getDeviceType, D as DeviceType } from './ui-5f775fd9.js';
-import { D as DomNodeSubjectObserverFactory } from './dom-node-subject-observer-factory-3b49c6b3.js';
-import { C as ChildNodesEventPreventSlimmer } from './child-nodes-event-prevent-slimmer-fcfc9c8b.js';
-import { I as InputRangeRequiredRule } from './input-range-required-rule-3ad74776.js';
-import { I as InternalFormFieldValidationRule } from './internal-form-field-validation-rule.abstract-f5b6bdbf.js';
-import { c as createEnterKeyHandlerToTriggerClick } from './accessibility-e5fd0fab.js';
-import { V as VegaComponentUsageRuntimeMetricsSlimmer } from './component-usage-runtime-metrics-0513698f.js';
-import './index-9fdb7060.js';
-import { T as TranslationSlimmer } from './translation-slimmer-3c4e2876.js';
-import './dom-node-subject-factory-5798693b.js';
-import './internal-vega-event-manager-826279b7.js';
-import './try-get-document-bef0f526.js';
-import './string-a953eafc.js';
-import './observer-3959f9dd.js';
-import './create-public-api-runtime-metrics-slimmer-8565f08b.js';
-import './vega-internal-event-id-b65a01a3.js';
-import './index-81ce67e2.js';
-import './page-resize-observer-slimmer-ee8774a6.js';
-import './ui-189dae23.js';
-import './breakpoints-d9faf11c.js';
-import './mutation-observer-slimmer-7065c745.js';
-import './mutation-observer-filters-6c515793.js';
-import './sub-state-observer-slimmer-4fc8b3da.js';
-import './number-4398f2e1.js';
-import './vega-env-manager-8f8dc473.js';
-import './feature-flag-controller-24b9f956.js';
-import './index-1f9eab8f.js';
-import './_commonjsHelpers-2088bffa.js';
-
-var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-/** The class VegaInputRangeRenderer is a TypeScript React component that renders an input range field with custom label, hint, and styling options. */
-class VegaInputRangeRenderer extends VegaSlimmer {
-  /**
-   * This function returns the reference to the input range container element in a TypeScript React component.
-   *
-   * @returns {HTMLElement} An HTMLElement, specifically the inputRangeContainerRef.
-   */
-  getInputRangeContainerRef() {
-    return this.inputRangeContainerRef;
-  }
-  /**
-   * The render function returns a JSX structure that includes a vega-flex container with a vega-field-label and an input range input renderer.
-   *
-   * @returns {HTMLElement} An HTMLElement is being returned. The code snippet is a render method of a component that
-   * returns a structure containing a vega-flex element with various attributes and child elements,
-   * including a vega-field-label and the result of calling the render method of
-   * inputRangeInputRenderer. Additionally, the renderHintDom method is being called and its result is
-   * included in the returned structure.
-   */
-  render() {
-    return (h(Fragment, null,
-      h("vega-flex", { class: "vega-input-range-container", direction: this.stack !== 'horizontal' ? 'col' : 'row', alignItems: this.stack !== 'horizontal' ? 'start' : 'center', gap: "size-8", ref: (dom) => (this.inputRangeContainerRef = dom) },
-        h("vega-field-label", { onClick: this.inputRangeInputRenderer.focusFirstInput, isFieldRequired: this.required, disabled: this.disabled, label: this.label }),
-        this.inputRangeInputRenderer.render()),
-      this.renderHintDom()));
-  }
-  /**
-   * The function `renderHintDom` returns a label element with a hint text if the `hint` property is provided.
-   *
-   * @returns {Nullable<HTMLElement>} A `label` element with the class `vega-input-range-hint` containing a `vega-font` element
-   * with the variant `font-footnote1-short` and color `text-secondary`, displaying the hint text stored
-   * in the `this.hint` property.
-   */
-  renderHintDom() {
-    if (this.hint) {
-      return (h("label", { class: "vega-input-range-hint" },
-        h("vega-font", { variant: "font-footnote1-short", color: "text-secondary" }, this.hint)));
-    }
-  }
-}
-__decorate$4([
-  MapToComponentField()
-], VegaInputRangeRenderer.prototype, "required", void 0);
-__decorate$4([
-  MapToComponentField()
-], VegaInputRangeRenderer.prototype, "disabled", void 0);
-__decorate$4([
-  MapToComponentField()
-], VegaInputRangeRenderer.prototype, "label", void 0);
-__decorate$4([
-  MapToComponentField()
-], VegaInputRangeRenderer.prototype, "hint", void 0);
-__decorate$4([
-  MapToComponentField()
-], VegaInputRangeRenderer.prototype, "stack", void 0);
-__decorate$4([
-  MapToComponentField()
-], VegaInputRangeRenderer.prototype, "inputRangeInputRenderer", void 0);
-
-var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-/** The `VegaInputRangeValueController` class in TypeScript manages the value and events of an input range component. */
-class VegaInputRangeValueController extends VegaSlimmer {
-  /**
-   * This function emits an event and notifies after a value change if the new value is different from the old value.
-   *
-   * @param {InputRangeValueType} newValue - The `newValue` parameter represents the new value of an input range element.
-   * @param {InputRangeValueType} oldValue - The `oldValue` parameter represents the previous value of an input range element before it was changed.
-   */
-  emitEventAndNotifyAfterValueChange(newValue, oldValue) {
-    if (!isArrayEqual(newValue, oldValue)) {
-      this.changeEventEmitter.emit(newValue);
-      ChangeManager.notify(FORM_ELEMENT_VALUE_CHANGE, { host: this.host, detail: newValue });
-    }
-  }
-  /**
-   * The function `updateValueByRangeIndex` updates the value of an array based on the specified index.
-   *
-   * @param {string} itemValue - The `itemValue` parameter is a string representing the value that will be updated in the range input.
-   * @param {RangeInputIndexType} index - The `index` parameter in the `updateValueByRangeIndex` function is used to determine which element in the array `this.value` should be updated.
-   */
-  updateValueByRangeIndex(itemValue, index) {
-    let newValue = this.value;
-    if (index === 0) {
-      newValue = [
-        itemValue,
-        Array.isArray(this.value) && !isNaN(Number(this.value[1])) ? this.value[1] : '',
-      ];
-    }
-    else {
-      newValue = [
-        Array.isArray(this.value) && !isNaN(Number(this.value[0])) ? this.value[0] : '',
-        itemValue,
-      ];
-    }
-    if (!isArrayEqual(newValue, this.value)) {
-      this.setValue(newValue);
-    }
-  }
-  /**
-   * The function `setValue` sets the value of an input range component in TypeScript.
-   *
-   * @param {InputRangeValueType} value - The `value` parameter in the `setValue` method is of type `InputRangeValueType`.
-   */
-  setValue(value) {
-    if (this.valueGuard(value)) {
-      this.value = value;
-    }
-  }
-  /**
-   * The function `valueGuard` checks if the input value is an array with exactly two elements, where each element is either a string or a number.
-   *
-   * @param {InputRangeValueType} value - The `value` parameter is expected to be an array with a length
-   * of 2, where each element in the array is either a string or a number. The `valueGuard` function
-   * returns `true` if these conditions are met, and `false` otherwise.
-   * @returns {boolean} The `valueGuard` function is returning a boolean value. It checks if the `value` parameter
-   * is an array with a length of 2, and if every item in the array is either a string or a number. If
-   * these conditions are met, the function returns `true`, otherwise it returns `false`.
-   */
-  valueGuard(value) {
-    return Array.isArray(value) && value.length === 2;
-  }
-}
-__decorate$3([
-  MapToComponentField({ writable: true })
-], VegaInputRangeValueController.prototype, "value", void 0);
-__decorate$3([
-  MapToComponentField()
-], VegaInputRangeValueController.prototype, "host", void 0);
-__decorate$3([
-  MapToComponentField()
-], VegaInputRangeValueController.prototype, "changeEventEmitter", void 0);
-__decorate$3([
-  MapToComponentMethod('watchValue')
-], VegaInputRangeValueController.prototype, "emitEventAndNotifyAfterValueChange", null);
-
-var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-/* The `VegaInputRangeInputRenderer` class is a TypeScript React component used to render an input range with two fields for minimum and maximum values. */
-class VegaInputRangeInputRenderer extends VegaSlimmer {
-  constructor() {
-    super(...arguments);
-    this.isMobileDevice = getDeviceType() === DeviceType.MOBILE;
-    /**
-     * The below method is e2e-test covered in
-     * @see{module:vega-input-range-label-click}
-     */
-    /* istanbul ignore next */
-    this.focusFirstInput = () => {
-      void this.minFieldInputRef.doFocus();
-    };
-    /**
-     * update the component value when the range input value change
-     *
-     * @param {NotifyObserverPayload<string>} payload the input value and the input element object
-     */
-    this.inputValueChange = (payload) => {
-      const rangeIndex = payload.host.dataset.index === '0' ? 0 : 1;
-      this.valueController.updateValueByRangeIndex(payload.detail, rangeIndex);
-    };
-  }
-  /**
-   * The function `getInputRefByIndex` returns the HTML input element reference based on the index provided.
-   *
-   * @param {RangeInputIndexType} index - The `index` parameter in the `getInputRefByIndex` function is
-   * of type `RangeInputIndexType`. This type is used to specify whether the index refers to the minimum
-   * or maximum input field in a range input element.
-   * @returns {HTMLVegaInputElement} The `getInputRefByIndex` function returns either the `minFieldInputRef` or
-   * `maxFieldInputRef` based on the `index` provided.
-   */
-  getInputRefByIndex(index) {
-    return [this.minFieldInputRef, this.maxFieldInputRef][index];
-  }
-  /** The `render()` method in the `VegaInputRangeInputRenderer` class is responsible for rendering the JSX structure of the input range component. Here's a breakdown of what the `render()` method is doing: */
-  render() {
-    return (h("vega-box", { class: {
-        'vega-input-range-input-container': true,
-        'input-range-disabled': this.disabled,
-        'input-range-mobile': this.isMobileDevice,
-        'input-range-with-clear-icon': this.showClearIcon && !this.disabled,
-      }, corners: "rounded-8", backgroundColor: this.disabled ? 'bg-secondary' : 'bg-primary' },
-      h("vega-flex", { "align-items": "center", direction: this.isMobileDevice ? 'col' : 'row' },
-        h("vega-input", Object.assign({ prefixIcon: this.prefixIcon }, this.getInputPropsByRangeIndex(0), { ref: (input) => {
-            DomNodeSubjectObserverFactory.addUniqueObserverToNode(input, VegaChange, this.inputValueChange);
-            this.minFieldInputRef = input;
-          } })),
-        h("span", { class: "vega-input-range-divider" }),
-        h("vega-input", Object.assign({ class: {
-            'with-left-padding-in-mobile': !!this.prefixIcon && this.isMobileDevice,
-          } }, this.getInputPropsByRangeIndex(1), { ref: (input) => {
-            DomNodeSubjectObserverFactory.addUniqueObserverToNode(input, VegaChange, this.inputValueChange);
-            this.maxFieldInputRef = input;
-          } }))),
-      this.clearIconRenderer.render()));
-  }
-  /**
-   * Get the input props object by range index
-   *
-   * @param {number} index the range index
-   * @returns {InputPropsType} the input props object
-   */
-  getInputPropsByRangeIndex(index) {
-    return {
-      'type': 'number',
-      'data-index': index,
-      'placeholder': this.getPlaceholderByIndex(index),
-      'showClearIcon': false,
-      'disabled': this.disabled,
-      'size': this.size,
-      'min': this.min,
-      'max': this.max,
-      'value': this.getDefaultValueByIndex(index),
-    };
-  }
-  /**
-   * get the input placeholder text by the input range index
-   *
-   * @param {number} index the range index 0|1
-   * @returns {string} the input placeholder text
-   */
-  getPlaceholderByIndex(index) {
-    const placeholder = this.placeholder || VegaInputRangeInputRenderer.defaultPlaceholder;
-    return this.translationSlimmer.t(placeholder[index]);
-  }
-  /**
-   * get the input value by the input range index
-   *
-   * @param {number} index 0|1
-   * @returns {string} the input value
-   */
-  getDefaultValueByIndex(index) {
-    const value = this.value || ['', ''];
-    return value[index];
-  }
-}
-VegaInputRangeInputRenderer.defaultPlaceholder = ['Minimum', 'Maximum'];
-__decorate$2([
-  MapToComponentField()
-], VegaInputRangeInputRenderer.prototype, "value", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaInputRangeInputRenderer.prototype, "prefixIcon", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaInputRangeInputRenderer.prototype, "disabled", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaInputRangeInputRenderer.prototype, "min", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaInputRangeInputRenderer.prototype, "max", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaInputRangeInputRenderer.prototype, "size", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaInputRangeInputRenderer.prototype, "placeholder", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaInputRangeInputRenderer.prototype, "showClearIcon", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaInputRangeInputRenderer.prototype, "valueController", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaInputRangeInputRenderer.prototype, "clearIconRenderer", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaInputRangeInputRenderer.prototype, "translationSlimmer", void 0);
-
-/**
- * A rule that checks if number is in min and max range
- */
-class InputRangeMinAndMaxRule extends InternalFormFieldValidationRule {
-  /**
-   * It creates a new instance of the class with the given config.
-   *
-   * @param {{ minValue: number; maxValue: number }} config - config including the minDate and the maxDate
-   * @param {string} config.minValue - The min number
-   * @param {string} config.maxValue - The max number
-   */
-  constructor(config) {
-    super();
-    /**
-     * Generate an invalid result
-     *
-     * @param {string} message Error message
-     * @returns {EvaluateResultTranslation} invalid validation result
-     */
-    this.invalidResult = (message) => ({
-      isValid: false,
-      message,
-    });
-    /**
-     * Generate a valid result
-     *
-     * @returns {EvaluateResultTranslation} invalid validation result
-     */
-    this.validResult = () => ({
-      isValid: true,
-      message: '',
-    });
-    this.minValue = config.minValue === 0 || config.minValue ? Number(config.minValue) : null;
-    this.maxValue = config.maxValue === 0 || config.maxValue ? Number(config.maxValue) : null;
-  }
-  /**
-   * If the input is accepted and the status is not disabled and visible, then return true
-   *
-   * @param {unknown} input - The input to be evaluated.
-   * @param {FormFieldStatusMeta} [status] - FormFieldStatusMeta
-   * @returns {boolean} A boolean value.
-   */
-  canEvaluate(input, status) {
-    return status
-      ? this.isAcceptedInputType(input) && !status.disabled && status.visible
-      : this.isAcceptedInputType(input);
-  }
-  /**
-   * check if the start value is within the min and max range, and if the end value is within the
-   * max range
-   *
-   * @param {string[]} input - The value of the input range.
-   * @returns  {EvaluateResultTranslation} - The result of the evaluation.
-   */
-  evaluate(input) {
-    if (!this.isAcceptedInputType(input)) {
-      throw new Error(`Unexpected type of input: ${typeof input}: ${input}`);
-    }
-    const startValue = Number(input[0]), endValue = Number(input[1]);
-    if (this.minValue !== null &&
-      ((input[0] !== '' && startValue < this.minValue) || (input[1] !== '' && endValue < this.minValue))) {
-      return this.invalidResult({ key: 'The minimum input value is {0}', args: [this.minValue] });
-    }
-    if (this.maxValue !== null &&
-      ((input[0] !== '' && startValue > this.maxValue) || (input[1] !== '' && endValue > this.maxValue))) {
-      return this.invalidResult({ key: 'The maximum input value is {0}', args: [this.maxValue] });
-    }
-    if (input[0] !== '' && input[1] !== '' && startValue > endValue) {
-      return this.invalidResult(`The end value should be greater than the start value`);
-    }
-    return this.validResult();
-  }
-  /**
-   * If the field is not disabled, visible, and has been touched or modified, then show the error
-   *
-   * @param {FormFieldStatusMeta} status - FormFieldStatusMeta
-   * @returns {boolean} A boolean value.
-   */
-  shouldShowError(status) {
-    return !status.disabled && status.visible && (status.touched || status.modified);
-  }
-  /**
-   * It returns true if the input is a string or an array of two strings, and each string is a valid string
-   *
-   * @param {unknown} input - The input value to be validated.
-   * @returns {boolean} A boolean value.
-   */
-  isAcceptedInputType(input) {
-    return (Array.isArray(input) &&
-      input.length === 2 &&
-      input.every((item) => typeof Number(item) === 'number'));
-  }
-}
-
-var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-class VegaInputRangeClearIconRenderer extends VegaSlimmer {
-  constructor() {
-    super(...arguments);
-    /**
-     * Set the component value to empty and focus on the first input element
-     */
-    this.clearInputRangeValue = () => {
-      this.valueController.setValue(['', '']);
-      this.inputRangeInputRenderer.focusFirstInput();
-    };
-  }
-  /**
-   * This function renders a clear icon element for an input range with specific styling and event handlers.
-   *
-   * @returns {HTMLElement} the clear button
-   */
-  render() {
-    return (h("div", { class: {
-        'vega-input-range-clear-icon': true,
-        'invisible': !this.shouldShowClearIcon(),
-      }, "aria-label": "clear input range", role: "button", tabindex: !this.disabled ? 0 : -1, onClick: this.clearInputRangeValue, onKeyDown: createEnterKeyHandlerToTriggerClick() },
-      h("vega-icon", { icon: "close" })));
-  }
-  /**
-   * It is responsible for determining whether the clear icon should be displayed based on certain conditions.
-   *
-   * @returns {boolean} boolean result
-   */
-  shouldShowClearIcon() {
-    return (this.showClearIcon &&
-      !this.disabled &&
-      Array.isArray(this.value) &&
-      this.value.some((item) => !!item));
-  }
-}
-__decorate$1([
-  MapToComponentField()
-], VegaInputRangeClearIconRenderer.prototype, "showClearIcon", void 0);
-__decorate$1([
-  MapToComponentField()
-], VegaInputRangeClearIconRenderer.prototype, "value", void 0);
-__decorate$1([
-  MapToComponentField()
-], VegaInputRangeClearIconRenderer.prototype, "disabled", void 0);
-__decorate$1([
-  MapToComponentField()
-], VegaInputRangeClearIconRenderer.prototype, "inputRangeInputRenderer", void 0);
-__decorate$1([
-  MapToComponentField()
-], VegaInputRangeClearIconRenderer.prototype, "valueController", void 0);
-
-const vegaInputRangeCss = ":host{display:inline-block;width:100%}.vega-input-range-input-container{position:relative;width:100%;flex:1 1 0%;border:1px solid rgba(var(--v-border-input-field, 171, 198, 216, 1));box-sizing:border-box;min-width:50%}.vega-input-range-input-container:hover{border:1px solid rgba(var(--v-border-input-field-hover, 115, 160, 190, 1))}.vega-input-range-input-container .vega-input-range-divider{display:inline-block;width:0px;height:24px;border-color:rgba(var(--v-border-color-input-field, 171, 198, 216, 1));border-style:solid;border-right-width:1px;border-left-width:0px;flex-shrink:0}.vega-input-range-input-container:focus-within .vega-input-range-divider{opacity:0}.vega-input-range-input-container .vega-input-range-clear-icon{position:absolute;width:16px;height:16px;cursor:pointer;color:rgba(var(--v-text-secondary, 107, 116, 125, 1));top:50%;right:16px;transform:translateY(-50%);z-index:2}.vega-input-range-input-container .vega-input-range-clear-icon.invisible{visibility:hidden}.vega-input-range-input-container .vega-input-range-clear-icon:focus-within{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:2px;border-radius:4px;padding:2px}.vega-input-range-input-container vega-input::part(input-container){border-width:0px}.vega-input-range-input-container vega-input::part(input-container):focus-within{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:3px;border:1px solid rgba(var(--v-border-color-input-field-focus, 19, 98, 226, 1));position:relative;box-shadow:0 0 0;margin:-1px;z-index:1}.vega-input-range-input-container.input-range-with-clear-icon vega-input:last-child::part(input){padding-right:24px}.vega-input-range-input-container.input-range-disabled{background-color:rgba(var(--v-bg-secondary, 245, 247, 247, 1));border:1px solid rgba(var(--v-border-input-field-disabled, 222, 225, 227, 1))}.vega-input-range-input-container.input-range-disabled:hover{border:1px solid rgba(var(--v-border-input-field-disabled, 222, 225, 227, 1))}.vega-input-range-input-container.input-range-disabled .vega-input-range-divider{border-color:rgba(var(--v-border-color-input-field-disabled, 222, 225, 227, 1))}.vega-input-range-input-container.input-range-mobile .vega-input-range-divider{width:100%;height:0px;border-right-width:0px;border-left-width:0px;border-top-width:0px;border-bottom-width:1px}.vega-input-range-input-container.input-range-mobile:focus-within .vega-input-range-divider{opacity:1}.vega-input-range-input-container.input-range-mobile .with-left-padding-in-mobile::part(input){padding-left:26px}.vega-input-range-input-container.input-range-mobile .vega-input-range-clear-icon{top:25%}.vega-input-range-input-container.input-range-mobile.input-range-with-clear-icon vega-input:first-child::part(input){padding-right:24px}.vega-input-range-input-container.input-range-mobile.input-range-with-clear-icon vega-input:last-child::part(input){padding-right:2px}.vega-input-range-container.error .vega-input-range-input-container{border:1px solid rgba(var(--v-border-input-field-danger, 230, 50, 87, 1))}.vega-input-range-container.error .vega-input-range-input-container:hover{border:1px solid rgba(var(--v-border-input-field-danger-hover, 255, 87, 114, 1))}.vega-input-range-container.error .vega-input-range-input-container .vega-input-range-clear-icon:focus-within{outline:2px solid rgba(var(--v-border-color-danger, 230, 50, 87, 1));outline-offset:2px}.vega-input-range-container.error vega-input::part(input-container):focus-within{outline:2px solid rgba(var(--v-border-color-danger, 230, 50, 87, 1));outline-offset:3px;border:1px solid rgba(var(--v-border-color-input-field-danger-focus, 233, 71, 104, 1))}.vega-input-range-hint{display:inline-block;padding-top:12px;padding-right:8px;padding-left:8px}.vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px;color:rgba(var(--v-text-error, 189, 41, 71, 1));display:block;padding-top:12px;padding-right:8px;padding-left:8px}@media screen and (min-width: 768px) and (max-width: 1023px){.vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}.vega-hidden{display:none}";
-
-var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-    r = Reflect.decorate(decorators, target, key, desc);
-  else
-    for (var i = decorators.length - 1; i >= 0; i--)
-      if (d = decorators[i])
-        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-const VegaInputRange = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.vegaChange = createEvent(this, "vegaChange", 7);
-    this.change = createEvent(this, "change", 7);
-    this.globalSlimmers = {};
-    this.translationSlimmer = new TranslationSlimmer();
-    this.formFieldController = new FormFieldControllerSlimmer({
-      propertyRules: [
-        {
-          propertyName: 'required',
-          ruleFactory: (isRequired) => (isRequired ? new InputRangeRequiredRule() : null),
-        },
-        {
-          propertyName: 'min',
-          ruleFactory: (min, max) => new InputRangeMinAndMaxRule({ minValue: min, maxValue: max }),
-          dependence: 'max',
-        },
-        {
-          propertyName: 'max',
-          ruleFactory: (max, min) => new InputRangeMinAndMaxRule({ minValue: min, maxValue: max }),
-          dependence: 'min',
-        },
-      ],
-      validationRulesName: 'validationRules',
-      defaultValue: ['', ''],
-      attributeGetter: (propertyName) => this[propertyName],
-      inputContainerGetter: () => this.inputRangeRenderer.getInputRangeContainerRef(),
-      touchableAreaGetter: () => [
-        this.inputRangeInputRenderer.getInputRefByIndex(0),
-        this.inputRangeInputRenderer.getInputRefByIndex(1),
-      ],
-    });
-    this.inputRangeInputRenderer = new VegaInputRangeInputRenderer();
-    this.clearIconRenderer = new VegaInputRangeClearIconRenderer();
-    this.inputRangeRenderer = new VegaInputRangeRenderer();
-    this.valueController = new VegaInputRangeValueController();
-    this.inputChangeEventPrevent = new ChildNodesEventPreventSlimmer([VegaChange], () => this.inputRangeRenderer.getInputRangeContainerRef());
-    this.changeEventEmitter = createEventEmitSlimmer(VegaInputRange, VegaChange);
-    this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer();
-    /**
-     * Specifies the label or title for the input range.
-     *
-     * It provides descriptive text that helps identify the
-     *    purpose or content expected in the input field.
-     *
-     * @vegaVersion 2.2.0
-     */
-    this.label = '';
-    /**
-     * Represents a pre-set or default value for the input field.
-     *
-     * It allows you to initialize the field with a specific value,
-     *    which is displayed to the user when the input is
-     *    initially rendered.
-     *
-     * If the value is too long, it may be truncated with
-     *    an ellipsis for visual presentation.
-     *
-     * @vegaVersion 2.2.0
-     */
-    /* eslint-disable-next-line @stencil/strict-mutable */
-    this.value = ['', ''];
-    /**
-     * Determines whether the clear icon should be displayed.
-     *
-     * @vegaVersion 2.2.0
-     */
-    this.showClearIcon = true;
-    /**
-     * Sets the minimum allowable numeric value for the input value.
-     *
-     * @vegaVersion 2.2.0
-     */
-    this.min = null;
-    /**
-     * Sets the maximum allowable numeric value for the input value.
-     *
-     * @vegaVersion 2.2.0
-     */
-    this.max = null;
-    /**
-     * Determines whether the input range is required.
-     *
-     * @vegaVersion 2.2.0
-     */
-    /* eslint-disable-next-line @stencil/strict-mutable */
-    this.required = false;
-    /**
-     * Indicates whether the current value in the field is considered valid
-     *    based on the defined validation rules.
-     *
-     * @vegaVersion 2.2.0
-     */
-    /* eslint-disable-next-line @stencil/strict-mutable */
-    this.isValid = null;
-    /**
-     * Determines whether the input field should undergo automatic validation
-     *    during the user's input.
-     *
-     * @vegaVersion 2.2.0
-     */
-    this.autoValidation = true;
-    /**
-     * Defines custom validation rules for the input field.
-     *
-     * @vegaVersion 2.2.0
-     */
-    this.validationRules = [];
-    /**
-     * Defines the size of the input range,
-     *    specifying its width or length.
-     *
-     * @vegaVersion 2.2.0
-     */
-    this.size = 'default';
-    /**
-     * Specifies a placeholder string that displays as a temporary hint
-     *    or example inside the input field.
-     *
-     * It indicates the expected format or pattern of the input.
-     *
-     * @vegaVersion 2.2.0
-     */
-    this.placeholder = ['Minimum', 'Maximum'];
-    /**
-     * Determines whether the input range is disabled.
-     *
-     * @vegaVersion 2.2.0
-     */
-    this.disabled = false;
-    /**
-     * Provides a supplementary prompt message that assists users in
-     *    understanding the expected value for the input field.
-     *
-     * @vegaVersion 2.2.0
-     */
-    this.hint = '';
-    /**
-     * Determines the arrangement and appearance of
-     *    the label and input areas.
-     *
-     * @vegaVersion 2.2.0
-     */
-    this.stack = 'vertical';
-  }
-  /**
-   * The input range component is embedded in other components.
-   *
-   * If modifying the input value does not meet the requirements
-   *    of other components, such as limiting the maximum value, etc.,
-   *    you need to modify the value of the input range component and
-   *    display it in real time.
-   *
-   * Since the value of `inputRef` retains the old value,
-   *    it needs to be updated manually when a value changes.
-   *
-   * @param {InputRangeValueType} newValue - The `newValue` parameter represents the new value of the input range.
-   * @param {InputRangeValueType} oldValue - The `oldValue` parameter represents the previous value of the input range before it was changed to the `newValue`.
-   */
-  watchValue(newValue, oldValue) {
-    methodPlaceholder(newValue, oldValue);
-  }
-  watchValidationRules() {
-    methodPlaceholder();
-  }
-  render() {
-    return sanitizeVegaComponent(h(Host, { class: { disabled: this.disabled } }, this.inputRangeRenderer.render()), this.host);
-  }
-  get host() { return getElement(this); }
-  static get watchers() { return {
-    "value": ["watchValue"],
-    "validationRules": ["watchValidationRules"]
-  }; }
-};
-__decorate([
-  InjectVegaGlobalSlimmer()
-], VegaInputRange.prototype, "globalSlimmers", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaInputRange.prototype, "translationSlimmer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaInputRange.prototype, "formFieldController", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaInputRange.prototype, "inputRangeInputRenderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaInputRange.prototype, "clearIconRenderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaInputRange.prototype, "inputRangeRenderer", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaInputRange.prototype, "valueController", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaInputRange.prototype, "inputChangeEventPrevent", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaInputRange.prototype, "changeEventEmitter", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaInputRange.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
-VegaInputRange.style = vegaInputRangeCss;
-
-export { VegaInputRange as vega_input_range };