vuestic-ui/dist/esm-node/src/composables/useSelectable.mjs.map

Vue 3 UI Framework

{"version":3,"file":"useSelectable.mjs","sources":["../../../../src/composables/useSelectable.ts"],"sourcesContent":["import { PropType, computed, SetupContext, ShallowRef, ExtractPropTypes } from 'vue'\n\nimport { useStateful, useStatefulProps, StatefulProps } from './useStateful'\nimport { useLoadingProps, LoadingProps } from './useLoading'\nimport { useValidation, useValidationProps, ValidationProps, useValidationEmits } from './useValidation'\nimport { useFocus } from './useFocus'\nimport { unwrapEl } from '../utils/unwrapEl'\n\nexport type SelectableProps<V = any> = StatefulProps & LoadingProps & ExtractPropTypes<ValidationProps<V>> & {\n  arrayValue: V | undefined,\n  leftLabel: boolean,\n  trueValue: any,\n  falseValue: any,\n  indeterminate: boolean,\n  indeterminateValue: V | null,\n  disabled: boolean,\n  readonly: boolean,\n  modelValue: unknown\n}\n\nexport type Elements = {\n  input: ShallowRef<HTMLElement | undefined>,\n  label: ShallowRef<HTMLElement | undefined>,\n  container: ShallowRef<HTMLElement | undefined>,\n}\n\nexport const useSelectableProps = {\n  ...useStatefulProps,\n  ...useLoadingProps,\n  ...useValidationProps,\n  arrayValue: { type: [String, Boolean, Object, Number], default: null },\n  label: { type: String, default: '' },\n  leftLabel: { type: Boolean, default: false },\n  trueValue: { type: null as unknown as PropType<any>, default: true },\n  falseValue: { type: null as unknown as PropType<any>, default: false },\n  indeterminate: { type: Boolean, default: false },\n  indeterminateValue: { type: null as unknown as PropType<any>, default: null },\n  disabled: { type: Boolean, default: false },\n  readonly: { type: Boolean, default: false },\n}\n\nexport const useSelectableEmits = [...useValidationEmits, 'update:modelValue', 'focus', 'blur']\n\nconst checkDuplicates = (props: SelectableProps) => {\n  // Just validating state values.\n  const values: unknown[] = [props.falseValue, props.trueValue]\n\n  if (props.indeterminate) {\n    values.push(props.indeterminateValue)\n  }\n\n  const hasDuplicates = new Set(values).size !== values.length\n\n  if (hasDuplicates) {\n    throw new Error('falseValue, trueValue, indeterminateValue props should have strictly different values, which is not the case.')\n  }\n}\n\nexport const useSelectable = (\n  props: SelectableProps,\n  emit: SetupContext['emit'],\n  { input, label, container }: Elements,\n) => {\n  checkDuplicates(props)\n\n  /** @public */\n  const reset = () => withoutValidation(() => {\n    emit('update:modelValue', false)\n    resetValidation()\n  })\n\n  const focus = () => {\n    unwrapEl(input.value)?.focus()\n  }\n\n  const { valueComputed } = useStateful(props, emit)\n\n  const {\n    computedError,\n    computedErrorMessages,\n    validate,\n    validationAriaAttributes,\n    listeners: validationListeners,\n    withoutValidation,\n    resetValidation,\n    isDirty,\n    isTouched,\n    isError,\n    isLoading,\n    isValid,\n  } = useValidation(props, emit, { reset, focus, value: valueComputed })\n  const { isFocused } = useFocus()\n\n  const onBlur = (event: FocusEvent) => {\n    emit('blur', event)\n    isFocused.value = false\n    validationListeners.onBlur()\n  }\n  const onFocus = (event: FocusEvent) => {\n    isFocused.value = true\n    emit('focus', event)\n  }\n\n  const isIndeterminate = computed(() => props.indeterminate && valueComputed.value === props.indeterminateValue)\n  const modelIsArray = computed(() => props.arrayValue !== undefined && props.arrayValue !== null)\n  const isChecked = computed(() => {\n    if (modelIsArray.value) {\n      return (props.modelValue as unknown[])?.includes(props.arrayValue)\n    }\n\n    return valueComputed.value === props.trueValue\n  })\n  const toggleSelection = () => {\n    if (props.readonly || props.disabled || props.loading) {\n      return\n    }\n\n    // For array access we pretend computedValue does not exist and use modelValue + emit input directly.\n    if (modelIsArray.value) {\n      if (!props.modelValue) {\n        emit('update:modelValue', [props.arrayValue])\n      } else if (!Array.isArray(props.modelValue)) {\n        emit('update:modelValue', props.modelValue === props.arrayValue ? [] : [props.modelValue, props.arrayValue])\n      } else if (props.modelValue.includes(props.arrayValue)) {\n        emit('update:modelValue', props.modelValue.filter((option) => option !== props.arrayValue))\n      } else {\n        emit('update:modelValue', props.modelValue.concat(props.arrayValue))\n      }\n      return\n    }\n\n    if (props.indeterminate) {\n      if (isIndeterminate.value) {\n        valueComputed.value = props.trueValue\n      } else if (isChecked.value) {\n        valueComputed.value = props.falseValue\n      } else {\n        // unchecked\n        valueComputed.value = props.indeterminateValue\n      }\n      return\n    }\n\n    if (isChecked.value) {\n      valueComputed.value = props.falseValue\n    } else {\n      valueComputed.value = props.trueValue\n    }\n  }\n\n  return {\n    isDirty,\n    isTouched,\n    isError,\n    isLoading,\n    isValid,\n    isChecked,\n    isIndeterminate,\n    onBlur,\n    onFocus,\n    toggleSelection,\n    reset,\n    focus,\n    computedError,\n    computedErrorMessages,\n    validationAriaAttributes,\n  }\n}\n"],"names":[],"mappings":"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"}