@dialpad/dialtone-vue/dist/common/mixins/input-group.cjs.map

Vue component library for Dialpad's design system Dialtone

{"version":3,"file":"input-group.cjs","sources":["../../../common/mixins/input_group.js"],"sourcesContent":["import Vue from 'vue';\nimport { DtValidationMessages } from '@/components/validation_messages';\nimport { validationMessageValidator } from '@/common/validators';\nimport {\n  getUniqueString,\n  formatMessages,\n  getValidationState,\n} from '@/common/utils';\n\n/**\n * This mixin provides a base provide obj and set of components, props, computed, watchers and data attributes that are\n * commonly used in our input group components.\n * @displayName Input Group Mixin\n */\nexport const InputGroupMixin = {\n  components: { DtValidationMessages },\n\n  // provide data to slotted components\n  provide () {\n    return {\n      groupContext: this.provideObj,\n      setGroupValue: this.setGroupValue,\n    };\n  },\n\n  props: {\n    /**\n     * The id of the input group\n     */\n    id: {\n      type: String,\n      default () {\n        return getUniqueString();\n      },\n    },\n\n    /**\n     * The value of the input group\n     */\n    value: {\n      type: [String, Number, Boolean, Object],\n      default: null,\n    },\n\n    /**\n     * The name of the input group\n     */\n    name: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * The legend of the input group\n     */\n    legend: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Disables the input group\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Validation messages\n     */\n    messages: {\n      type: Array,\n      default: () => [],\n      validator: messages => validationMessageValidator(messages),\n    },\n\n    /**\n     * Show validation messages\n     * @values true, false\n     */\n    showMessages: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Used to customize the legend element\n     */\n    legendClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize the messages container\n     */\n    messagesClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * A set of props that are passed into the legend element\n     */\n    legendChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * A set of props that are passed into the messages container\n     */\n    messagesChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n  },\n\n  data () {\n    const formattedMessages = formatMessages(this.messages);\n\n    return {\n      // wrap values in object to make reactive\n      provideObj: {\n        name: this.name,\n        disabled: this.disabled,\n        validationState: getValidationState(formattedMessages),\n      },\n    };\n  },\n\n  computed: {\n    formattedMessages () {\n      return formatMessages(this.messages);\n    },\n\n    validationState () {\n      return getValidationState(this.formattedMessages);\n    },\n  },\n\n  watch: {\n    disabled (newDisabled) {\n      this.provideObj.disabled = newDisabled;\n    },\n\n    validationState (newValidationState) {\n      this.provideObj.validationState = newValidationState;\n    },\n  },\n\n  methods: {\n    /*\n     * provided value to support 2 way binding for slotted input components.\n     * slotted input components will change this value and need to emit new value up.\n     */\n    setGroupValue (newValue) {\n      this.internalValue = newValue;\n      this.$emit('input', newValue);\n    },\n  },\n\n  mounted () {\n    if (!this.legend && !this.$slots.legend && !this.$attrs['aria-label']) {\n      Vue.util.warn('It is expected that an aria-label is provided when there is no legend.', this);\n    }\n  },\n};\n\nexport default {\n  InputGroupMixin,\n};\n"],"names":["InputGroupMixin","DtValidationMessages","getUniqueString","messages","validationMessageValidator","formattedMessages","formatMessages","getValidationState","newDisabled","newValidationState","newValue","Vue","input_group"],"mappings":"2QAcaA,EAAkB,CAC7B,WAAY,CAAA,qBAAEC,EAAAA,OAAoB,EAGlC,SAAW,CACT,MAAO,CACL,aAAc,KAAK,WACnB,cAAe,KAAK,aAC1B,CACE,EAEA,MAAO,CAIL,GAAI,CACF,KAAM,OACN,SAAW,CACT,OAAOC,kBAAe,CACxB,CACN,EAKI,MAAO,CACL,KAAM,CAAC,OAAQ,OAAQ,QAAS,MAAM,EACtC,QAAS,IACf,EAKI,KAAM,CACJ,KAAM,OACN,SAAU,EAChB,EAKI,OAAQ,CACN,KAAM,OACN,QAAS,EACf,EAMI,SAAU,CACR,KAAM,QACN,QAAS,EACf,EAKI,SAAU,CACR,KAAM,MACN,QAAS,IAAM,CAAA,EACf,UAAWC,GAAYC,EAAAA,2BAA2BD,CAAQ,CAChE,EAMI,aAAc,CACZ,KAAM,QACN,QAAS,EACf,EAKI,YAAa,CACX,KAAM,CAAC,OAAQ,MAAO,MAAM,EAC5B,QAAS,EACf,EAKI,cAAe,CACb,KAAM,CAAC,OAAQ,MAAO,MAAM,EAC5B,QAAS,EACf,EAKI,iBAAkB,CAChB,KAAM,OACN,QAAS,KAAO,CAAA,EACtB,EAKI,mBAAoB,CAClB,KAAM,OACN,QAAS,KAAO,CAAA,EACtB,CACA,EAEE,MAAQ,CACN,MAAME,EAAoBC,EAAAA,eAAe,KAAK,QAAQ,EAEtD,MAAO,CAEL,WAAY,CACV,KAAM,KAAK,KACX,SAAU,KAAK,SACf,gBAAiBC,EAAAA,mBAAmBF,CAAiB,CAC7D,CACA,CACE,EAEA,SAAU,CACR,mBAAqB,CACnB,OAAOC,EAAAA,eAAe,KAAK,QAAQ,CACrC,EAEA,iBAAmB,CACjB,OAAOC,EAAAA,mBAAmB,KAAK,iBAAiB,CAClD,CACJ,EAEE,MAAO,CACL,SAAUC,EAAa,CACrB,KAAK,WAAW,SAAWA,CAC7B,EAEA,gBAAiBC,EAAoB,CACnC,KAAK,WAAW,gBAAkBA,CACpC,CACJ,EAEE,QAAS,CAKP,cAAeC,EAAU,CACvB,KAAK,cAAgBA,EACrB,KAAK,MAAM,QAASA,CAAQ,CAC9B,CACJ,EAEE,SAAW,CACL,CAAC,KAAK,QAAU,CAAC,KAAK,OAAO,QAAU,CAAC,KAAK,OAAO,YAAY,GAClEC,EAAI,KAAK,KAAK,yEAA0E,IAAI,CAEhG,CACF,EAEAC,EAAe,CACb,gBAAAZ,CACF"}