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

Vue 3 UI Framework

{"version":3,"file":"useSyncProp.mjs","sources":["../../../../src/composables/useSyncProp.ts"],"sourcesContent":["import { ref, computed, watch, UnwrapRef, getCurrentInstance } from 'vue'\n\n/**\n * Returns computed that emits update:${propName} on edit.\n *\n * @tutorial\n * ```\n * const [prop] = useSyncProp('name', props, emit)\n *\n * prop.value = 'New name'\n *\n * $nextTick(() => console.log(prop.value)) // 'New name'\n * ```\n *\n * @notice\n * Be careful, that property is not updating in current render\n * cycle. Be sure to use $nextTick if you need to use this property after change.\n */\nexport function useSyncProp<\n  T,\n  PropName extends string,\n  Props extends { [key in PropName]?: T },\n  Emit extends (event: any, newValue: Props[PropName]) => any,\n  ReturnValue extends NonNullable<Props[PropName]>\n> (propName: PropName, props: Props, emit: Emit, defaultValue?: ReturnValue) {\n  const vm = getCurrentInstance()\n\n  const isPropPassed = computed(() => {\n    const t = props[propName]\n\n    if (!vm?.vnode.props) { return t !== undefined }\n\n    return propName in vm.vnode.props && vm.vnode.props[propName] !== undefined\n  })\n\n  if (defaultValue === undefined) {\n    return [\n      computed<ReturnValue>({\n        set (value: ReturnValue) {\n          emit(`update:${propName}`, value)\n        },\n        get () {\n          return props[propName] as ReturnValue\n        },\n      }),\n    ]\n  }\n\n  const currentValue = props[propName] as ReturnValue\n  const statefulValue = ref(currentValue === undefined ? defaultValue : currentValue)\n\n  watch(() => props[propName], (newVal) => {\n    if (newVal === undefined) { return }\n\n    statefulValue.value = newVal as UnwrapRef<ReturnValue>\n  })\n\n  return [\n    computed<ReturnValue>({\n      set (value: ReturnValue) {\n        statefulValue.value = value as UnwrapRef<ReturnValue>\n        emit(`update:${propName}`, value)\n      },\n      get (): ReturnValue {\n        if (isPropPassed.value) {\n          return props[propName] as ReturnValue\n        }\n\n        return statefulValue.value as ReturnValue\n      },\n    }),\n  ]\n}\n"],"names":[],"mappings":";AAkBO,SAAS,YAMb,UAAoB,OAAc,MAAY,cAA4B;AAC3E,QAAM,KAAK;AAEL,QAAA,eAAe,SAAS,MAAM;AAC5B,UAAA,IAAI,MAAM,QAAQ;AAEpB,QAAA,EAAC,yBAAI,MAAM,QAAO;AAAE,aAAO,MAAM;AAAA,IAAU;AAExC,WAAA,YAAY,GAAG,MAAM,SAAS,GAAG,MAAM,MAAM,QAAQ,MAAM;AAAA,EAAA,CACnE;AAED,MAAI,iBAAiB,QAAW;AACvB,WAAA;AAAA,MACL,SAAsB;AAAA,QACpB,IAAK,OAAoB;AAClB,eAAA,UAAU,QAAQ,IAAI,KAAK;AAAA,QAClC;AAAA,QACA,MAAO;AACL,iBAAO,MAAM,QAAQ;AAAA,QACvB;AAAA,MAAA,CACD;AAAA,IAAA;AAAA,EAEL;AAEM,QAAA,eAAe,MAAM,QAAQ;AACnC,QAAM,gBAAgB,IAAI,iBAAiB,SAAY,eAAe,YAAY;AAElF,QAAM,MAAM,MAAM,QAAQ,GAAG,CAAC,WAAW;AACvC,QAAI,WAAW,QAAW;AAAE;AAAA,IAAO;AAEnC,kBAAc,QAAQ;AAAA,EAAA,CACvB;AAEM,SAAA;AAAA,IACL,SAAsB;AAAA,MACpB,IAAK,OAAoB;AACvB,sBAAc,QAAQ;AACjB,aAAA,UAAU,QAAQ,IAAI,KAAK;AAAA,MAClC;AAAA,MACA,MAAoB;AAClB,YAAI,aAAa,OAAO;AACtB,iBAAO,MAAM,QAAQ;AAAA,QACvB;AAEA,eAAO,cAAc;AAAA,MACvB;AAAA,IAAA,CACD;AAAA,EAAA;AAEL;"}