vuestic-ui/dist/web-components/src/composables/useClearable.js

Vue 3 UI Framework

import { computed } from "vue";
import { u as useFocus } from "./useFocus.js";
const useClearableProps = {
  clearable: { type: Boolean, default: false },
  clearableIcon: { type: String, default: "va-clear" },
  clearValue: { type: String, default: "" }
};
const useClearableEmits = ["clear"];
const useClearable = (props, inputValue, el, hasError) => {
  const { isFocused, onFocus, onBlur } = useFocus(el);
  const clearedValues = [null, void 0, props.clearValue];
  const canBeCleared = computed(() => props.clearable && !props.disabled && !props.readonly && !clearedValues.includes(inputValue.value));
  const clearIconColor = computed(() => {
    if (isFocused == null ? void 0 : isFocused.value) {
      return props.color || "primary";
    }
    if (hasError == null ? void 0 : hasError.value) {
      return "danger";
    }
    if (props.success) {
      return "success";
    }
    return "secondary";
  });
  const clearIconProps = computed(() => ({
    name: props.clearableIcon,
    color: clearIconColor.value,
    size: "medium",
    tabindex: canBeCleared.value ? 0 : -1
  }));
  return {
    canBeCleared,
    clearIconColor,
    clearIconProps,
    onFocus,
    onBlur
  };
};
export {
  useClearableEmits as a,
  useClearable as b,
  useClearableProps as u
};
//# sourceMappingURL=useClearable.js.map