reactivity.esm-browser.js 28 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886
  1. const EMPTY_OBJ = Object.freeze({})
  2. ;
  3. const EMPTY_ARR = Object.freeze([]) ;
  4. const extend = Object.assign;
  5. const hasOwnProperty = Object.prototype.hasOwnProperty;
  6. const hasOwn = (val, key) => hasOwnProperty.call(val, key);
  7. const isArray = Array.isArray;
  8. const isMap = (val) => toTypeString(val) === '[object Map]';
  9. const isFunction = (val) => typeof val === 'function';
  10. const isString = (val) => typeof val === 'string';
  11. const isSymbol = (val) => typeof val === 'symbol';
  12. const isObject = (val) => val !== null && typeof val === 'object';
  13. const objectToString = Object.prototype.toString;
  14. const toTypeString = (value) => objectToString.call(value);
  15. const toRawType = (value) => {
  16. // extract "RawType" from strings like "[object RawType]"
  17. return toTypeString(value).slice(8, -1);
  18. };
  19. const isIntegerKey = (key) => isString(key) &&
  20. key !== 'NaN' &&
  21. key[0] !== '-' &&
  22. '' + parseInt(key, 10) === key;
  23. const cacheStringFunction = (fn) => {
  24. const cache = Object.create(null);
  25. return ((str) => {
  26. const hit = cache[str];
  27. return hit || (cache[str] = fn(str));
  28. });
  29. };
  30. /**
  31. * @private
  32. */
  33. const capitalize = cacheStringFunction((str) => str.charAt(0).toUpperCase() + str.slice(1));
  34. // compare whether a value has changed, accounting for NaN.
  35. const hasChanged = (value, oldValue) => value !== oldValue && (value === value || oldValue === oldValue);
  36. const def = (obj, key, value) => {
  37. Object.defineProperty(obj, key, {
  38. configurable: true,
  39. enumerable: false,
  40. value
  41. });
  42. };
  43. const targetMap = new WeakMap();
  44. const effectStack = [];
  45. let activeEffect;
  46. const ITERATE_KEY = Symbol( 'iterate' );
  47. const MAP_KEY_ITERATE_KEY = Symbol( 'Map key iterate' );
  48. function isEffect(fn) {
  49. return fn && fn._isEffect === true;
  50. }
  51. function effect(fn, options = EMPTY_OBJ) {
  52. if (isEffect(fn)) {
  53. fn = fn.raw;
  54. }
  55. const effect = createReactiveEffect(fn, options);
  56. if (!options.lazy) {
  57. effect();
  58. }
  59. return effect;
  60. }
  61. function stop(effect) {
  62. if (effect.active) {
  63. cleanup(effect);
  64. if (effect.options.onStop) {
  65. effect.options.onStop();
  66. }
  67. effect.active = false;
  68. }
  69. }
  70. let uid = 0;
  71. function createReactiveEffect(fn, options) {
  72. const effect = function reactiveEffect() {
  73. if (!effect.active) {
  74. return options.scheduler ? undefined : fn();
  75. }
  76. if (!effectStack.includes(effect)) {
  77. cleanup(effect);
  78. try {
  79. enableTracking();
  80. effectStack.push(effect);
  81. activeEffect = effect;
  82. return fn();
  83. }
  84. finally {
  85. effectStack.pop();
  86. resetTracking();
  87. activeEffect = effectStack[effectStack.length - 1];
  88. }
  89. }
  90. };
  91. effect.id = uid++;
  92. effect.allowRecurse = !!options.allowRecurse;
  93. effect._isEffect = true;
  94. effect.active = true;
  95. effect.raw = fn;
  96. effect.deps = [];
  97. effect.options = options;
  98. return effect;
  99. }
  100. function cleanup(effect) {
  101. const { deps } = effect;
  102. if (deps.length) {
  103. for (let i = 0; i < deps.length; i++) {
  104. deps[i].delete(effect);
  105. }
  106. deps.length = 0;
  107. }
  108. }
  109. let shouldTrack = true;
  110. const trackStack = [];
  111. function pauseTracking() {
  112. trackStack.push(shouldTrack);
  113. shouldTrack = false;
  114. }
  115. function enableTracking() {
  116. trackStack.push(shouldTrack);
  117. shouldTrack = true;
  118. }
  119. function resetTracking() {
  120. const last = trackStack.pop();
  121. shouldTrack = last === undefined ? true : last;
  122. }
  123. function track(target, type, key) {
  124. if (!shouldTrack || activeEffect === undefined) {
  125. return;
  126. }
  127. let depsMap = targetMap.get(target);
  128. if (!depsMap) {
  129. targetMap.set(target, (depsMap = new Map()));
  130. }
  131. let dep = depsMap.get(key);
  132. if (!dep) {
  133. depsMap.set(key, (dep = new Set()));
  134. }
  135. if (!dep.has(activeEffect)) {
  136. dep.add(activeEffect);
  137. activeEffect.deps.push(dep);
  138. if ( activeEffect.options.onTrack) {
  139. activeEffect.options.onTrack({
  140. effect: activeEffect,
  141. target,
  142. type,
  143. key
  144. });
  145. }
  146. }
  147. }
  148. function trigger(target, type, key, newValue, oldValue, oldTarget) {
  149. const depsMap = targetMap.get(target);
  150. if (!depsMap) {
  151. // never been tracked
  152. return;
  153. }
  154. const effects = new Set();
  155. const add = (effectsToAdd) => {
  156. if (effectsToAdd) {
  157. effectsToAdd.forEach(effect => {
  158. if (effect !== activeEffect || effect.allowRecurse) {
  159. effects.add(effect);
  160. }
  161. });
  162. }
  163. };
  164. if (type === "clear" /* CLEAR */) {
  165. // collection being cleared
  166. // trigger all effects for target
  167. depsMap.forEach(add);
  168. }
  169. else if (key === 'length' && isArray(target)) {
  170. depsMap.forEach((dep, key) => {
  171. if (key === 'length' || key >= newValue) {
  172. add(dep);
  173. }
  174. });
  175. }
  176. else {
  177. // schedule runs for SET | ADD | DELETE
  178. if (key !== void 0) {
  179. add(depsMap.get(key));
  180. }
  181. // also run for iteration key on ADD | DELETE | Map.SET
  182. switch (type) {
  183. case "add" /* ADD */:
  184. if (!isArray(target)) {
  185. add(depsMap.get(ITERATE_KEY));
  186. if (isMap(target)) {
  187. add(depsMap.get(MAP_KEY_ITERATE_KEY));
  188. }
  189. }
  190. else if (isIntegerKey(key)) {
  191. // new index added to array -> length changes
  192. add(depsMap.get('length'));
  193. }
  194. break;
  195. case "delete" /* DELETE */:
  196. if (!isArray(target)) {
  197. add(depsMap.get(ITERATE_KEY));
  198. if (isMap(target)) {
  199. add(depsMap.get(MAP_KEY_ITERATE_KEY));
  200. }
  201. }
  202. break;
  203. case "set" /* SET */:
  204. if (isMap(target)) {
  205. add(depsMap.get(ITERATE_KEY));
  206. }
  207. break;
  208. }
  209. }
  210. const run = (effect) => {
  211. if ( effect.options.onTrigger) {
  212. effect.options.onTrigger({
  213. effect,
  214. target,
  215. key,
  216. type,
  217. newValue,
  218. oldValue,
  219. oldTarget
  220. });
  221. }
  222. if (effect.options.scheduler) {
  223. effect.options.scheduler(effect);
  224. }
  225. else {
  226. effect();
  227. }
  228. };
  229. effects.forEach(run);
  230. }
  231. const builtInSymbols = new Set(Object.getOwnPropertyNames(Symbol)
  232. .map(key => Symbol[key])
  233. .filter(isSymbol));
  234. const get = /*#__PURE__*/ createGetter();
  235. const shallowGet = /*#__PURE__*/ createGetter(false, true);
  236. const readonlyGet = /*#__PURE__*/ createGetter(true);
  237. const shallowReadonlyGet = /*#__PURE__*/ createGetter(true, true);
  238. const arrayInstrumentations = {};
  239. ['includes', 'indexOf', 'lastIndexOf'].forEach(key => {
  240. const method = Array.prototype[key];
  241. arrayInstrumentations[key] = function (...args) {
  242. const arr = toRaw(this);
  243. for (let i = 0, l = this.length; i < l; i++) {
  244. track(arr, "get" /* GET */, i + '');
  245. }
  246. // we run the method using the original args first (which may be reactive)
  247. const res = method.apply(arr, args);
  248. if (res === -1 || res === false) {
  249. // if that didn't work, run it again using raw values.
  250. return method.apply(arr, args.map(toRaw));
  251. }
  252. else {
  253. return res;
  254. }
  255. };
  256. });
  257. ['push', 'pop', 'shift', 'unshift', 'splice'].forEach(key => {
  258. const method = Array.prototype[key];
  259. arrayInstrumentations[key] = function (...args) {
  260. pauseTracking();
  261. const res = method.apply(this, args);
  262. resetTracking();
  263. return res;
  264. };
  265. });
  266. function createGetter(isReadonly = false, shallow = false) {
  267. return function get(target, key, receiver) {
  268. if (key === "__v_isReactive" /* IS_REACTIVE */) {
  269. return !isReadonly;
  270. }
  271. else if (key === "__v_isReadonly" /* IS_READONLY */) {
  272. return isReadonly;
  273. }
  274. else if (key === "__v_raw" /* RAW */ &&
  275. receiver === (isReadonly ? readonlyMap : reactiveMap).get(target)) {
  276. return target;
  277. }
  278. const targetIsArray = isArray(target);
  279. if (targetIsArray && hasOwn(arrayInstrumentations, key)) {
  280. return Reflect.get(arrayInstrumentations, key, receiver);
  281. }
  282. const res = Reflect.get(target, key, receiver);
  283. if (isSymbol(key)
  284. ? builtInSymbols.has(key)
  285. : key === `__proto__` || key === `__v_isRef`) {
  286. return res;
  287. }
  288. if (!isReadonly) {
  289. track(target, "get" /* GET */, key);
  290. }
  291. if (shallow) {
  292. return res;
  293. }
  294. if (isRef(res)) {
  295. // ref unwrapping - does not apply for Array + integer key.
  296. const shouldUnwrap = !targetIsArray || !isIntegerKey(key);
  297. return shouldUnwrap ? res.value : res;
  298. }
  299. if (isObject(res)) {
  300. // Convert returned value into a proxy as well. we do the isObject check
  301. // here to avoid invalid value warning. Also need to lazy access readonly
  302. // and reactive here to avoid circular dependency.
  303. return isReadonly ? readonly(res) : reactive(res);
  304. }
  305. return res;
  306. };
  307. }
  308. const set = /*#__PURE__*/ createSetter();
  309. const shallowSet = /*#__PURE__*/ createSetter(true);
  310. function createSetter(shallow = false) {
  311. return function set(target, key, value, receiver) {
  312. const oldValue = target[key];
  313. if (!shallow) {
  314. value = toRaw(value);
  315. if (!isArray(target) && isRef(oldValue) && !isRef(value)) {
  316. oldValue.value = value;
  317. return true;
  318. }
  319. }
  320. const hadKey = isArray(target) && isIntegerKey(key)
  321. ? Number(key) < target.length
  322. : hasOwn(target, key);
  323. const result = Reflect.set(target, key, value, receiver);
  324. // don't trigger if target is something up in the prototype chain of original
  325. if (target === toRaw(receiver)) {
  326. if (!hadKey) {
  327. trigger(target, "add" /* ADD */, key, value);
  328. }
  329. else if (hasChanged(value, oldValue)) {
  330. trigger(target, "set" /* SET */, key, value, oldValue);
  331. }
  332. }
  333. return result;
  334. };
  335. }
  336. function deleteProperty(target, key) {
  337. const hadKey = hasOwn(target, key);
  338. const oldValue = target[key];
  339. const result = Reflect.deleteProperty(target, key);
  340. if (result && hadKey) {
  341. trigger(target, "delete" /* DELETE */, key, undefined, oldValue);
  342. }
  343. return result;
  344. }
  345. function has(target, key) {
  346. const result = Reflect.has(target, key);
  347. if (!isSymbol(key) || !builtInSymbols.has(key)) {
  348. track(target, "has" /* HAS */, key);
  349. }
  350. return result;
  351. }
  352. function ownKeys(target) {
  353. track(target, "iterate" /* ITERATE */, isArray(target) ? 'length' : ITERATE_KEY);
  354. return Reflect.ownKeys(target);
  355. }
  356. const mutableHandlers = {
  357. get,
  358. set,
  359. deleteProperty,
  360. has,
  361. ownKeys
  362. };
  363. const readonlyHandlers = {
  364. get: readonlyGet,
  365. set(target, key) {
  366. {
  367. console.warn(`Set operation on key "${String(key)}" failed: target is readonly.`, target);
  368. }
  369. return true;
  370. },
  371. deleteProperty(target, key) {
  372. {
  373. console.warn(`Delete operation on key "${String(key)}" failed: target is readonly.`, target);
  374. }
  375. return true;
  376. }
  377. };
  378. const shallowReactiveHandlers = extend({}, mutableHandlers, {
  379. get: shallowGet,
  380. set: shallowSet
  381. });
  382. // Props handlers are special in the sense that it should not unwrap top-level
  383. // refs (in order to allow refs to be explicitly passed down), but should
  384. // retain the reactivity of the normal readonly object.
  385. const shallowReadonlyHandlers = extend({}, readonlyHandlers, {
  386. get: shallowReadonlyGet
  387. });
  388. const toReactive = (value) => isObject(value) ? reactive(value) : value;
  389. const toReadonly = (value) => isObject(value) ? readonly(value) : value;
  390. const toShallow = (value) => value;
  391. const getProto = (v) => Reflect.getPrototypeOf(v);
  392. function get$1(target, key, isReadonly = false, isShallow = false) {
  393. // #1772: readonly(reactive(Map)) should return readonly + reactive version
  394. // of the value
  395. target = target["__v_raw" /* RAW */];
  396. const rawTarget = toRaw(target);
  397. const rawKey = toRaw(key);
  398. if (key !== rawKey) {
  399. !isReadonly && track(rawTarget, "get" /* GET */, key);
  400. }
  401. !isReadonly && track(rawTarget, "get" /* GET */, rawKey);
  402. const { has } = getProto(rawTarget);
  403. const wrap = isReadonly ? toReadonly : isShallow ? toShallow : toReactive;
  404. if (has.call(rawTarget, key)) {
  405. return wrap(target.get(key));
  406. }
  407. else if (has.call(rawTarget, rawKey)) {
  408. return wrap(target.get(rawKey));
  409. }
  410. }
  411. function has$1(key, isReadonly = false) {
  412. const target = this["__v_raw" /* RAW */];
  413. const rawTarget = toRaw(target);
  414. const rawKey = toRaw(key);
  415. if (key !== rawKey) {
  416. !isReadonly && track(rawTarget, "has" /* HAS */, key);
  417. }
  418. !isReadonly && track(rawTarget, "has" /* HAS */, rawKey);
  419. return key === rawKey
  420. ? target.has(key)
  421. : target.has(key) || target.has(rawKey);
  422. }
  423. function size(target, isReadonly = false) {
  424. target = target["__v_raw" /* RAW */];
  425. !isReadonly && track(toRaw(target), "iterate" /* ITERATE */, ITERATE_KEY);
  426. return Reflect.get(target, 'size', target);
  427. }
  428. function add(value) {
  429. value = toRaw(value);
  430. const target = toRaw(this);
  431. const proto = getProto(target);
  432. const hadKey = proto.has.call(target, value);
  433. const result = target.add(value);
  434. if (!hadKey) {
  435. trigger(target, "add" /* ADD */, value, value);
  436. }
  437. return result;
  438. }
  439. function set$1(key, value) {
  440. value = toRaw(value);
  441. const target = toRaw(this);
  442. const { has, get } = getProto(target);
  443. let hadKey = has.call(target, key);
  444. if (!hadKey) {
  445. key = toRaw(key);
  446. hadKey = has.call(target, key);
  447. }
  448. else {
  449. checkIdentityKeys(target, has, key);
  450. }
  451. const oldValue = get.call(target, key);
  452. const result = target.set(key, value);
  453. if (!hadKey) {
  454. trigger(target, "add" /* ADD */, key, value);
  455. }
  456. else if (hasChanged(value, oldValue)) {
  457. trigger(target, "set" /* SET */, key, value, oldValue);
  458. }
  459. return result;
  460. }
  461. function deleteEntry(key) {
  462. const target = toRaw(this);
  463. const { has, get } = getProto(target);
  464. let hadKey = has.call(target, key);
  465. if (!hadKey) {
  466. key = toRaw(key);
  467. hadKey = has.call(target, key);
  468. }
  469. else {
  470. checkIdentityKeys(target, has, key);
  471. }
  472. const oldValue = get ? get.call(target, key) : undefined;
  473. // forward the operation before queueing reactions
  474. const result = target.delete(key);
  475. if (hadKey) {
  476. trigger(target, "delete" /* DELETE */, key, undefined, oldValue);
  477. }
  478. return result;
  479. }
  480. function clear() {
  481. const target = toRaw(this);
  482. const hadItems = target.size !== 0;
  483. const oldTarget = isMap(target)
  484. ? new Map(target)
  485. : new Set(target)
  486. ;
  487. // forward the operation before queueing reactions
  488. const result = target.clear();
  489. if (hadItems) {
  490. trigger(target, "clear" /* CLEAR */, undefined, undefined, oldTarget);
  491. }
  492. return result;
  493. }
  494. function createForEach(isReadonly, isShallow) {
  495. return function forEach(callback, thisArg) {
  496. const observed = this;
  497. const target = observed["__v_raw" /* RAW */];
  498. const rawTarget = toRaw(target);
  499. const wrap = isReadonly ? toReadonly : isShallow ? toShallow : toReactive;
  500. !isReadonly && track(rawTarget, "iterate" /* ITERATE */, ITERATE_KEY);
  501. return target.forEach((value, key) => {
  502. // important: make sure the callback is
  503. // 1. invoked with the reactive map as `this` and 3rd arg
  504. // 2. the value received should be a corresponding reactive/readonly.
  505. return callback.call(thisArg, wrap(value), wrap(key), observed);
  506. });
  507. };
  508. }
  509. function createIterableMethod(method, isReadonly, isShallow) {
  510. return function (...args) {
  511. const target = this["__v_raw" /* RAW */];
  512. const rawTarget = toRaw(target);
  513. const targetIsMap = isMap(rawTarget);
  514. const isPair = method === 'entries' || (method === Symbol.iterator && targetIsMap);
  515. const isKeyOnly = method === 'keys' && targetIsMap;
  516. const innerIterator = target[method](...args);
  517. const wrap = isReadonly ? toReadonly : isShallow ? toShallow : toReactive;
  518. !isReadonly &&
  519. track(rawTarget, "iterate" /* ITERATE */, isKeyOnly ? MAP_KEY_ITERATE_KEY : ITERATE_KEY);
  520. // return a wrapped iterator which returns observed versions of the
  521. // values emitted from the real iterator
  522. return {
  523. // iterator protocol
  524. next() {
  525. const { value, done } = innerIterator.next();
  526. return done
  527. ? { value, done }
  528. : {
  529. value: isPair ? [wrap(value[0]), wrap(value[1])] : wrap(value),
  530. done
  531. };
  532. },
  533. // iterable protocol
  534. [Symbol.iterator]() {
  535. return this;
  536. }
  537. };
  538. };
  539. }
  540. function createReadonlyMethod(type) {
  541. return function (...args) {
  542. {
  543. const key = args[0] ? `on key "${args[0]}" ` : ``;
  544. console.warn(`${capitalize(type)} operation ${key}failed: target is readonly.`, toRaw(this));
  545. }
  546. return type === "delete" /* DELETE */ ? false : this;
  547. };
  548. }
  549. const mutableInstrumentations = {
  550. get(key) {
  551. return get$1(this, key);
  552. },
  553. get size() {
  554. return size(this);
  555. },
  556. has: has$1,
  557. add,
  558. set: set$1,
  559. delete: deleteEntry,
  560. clear,
  561. forEach: createForEach(false, false)
  562. };
  563. const shallowInstrumentations = {
  564. get(key) {
  565. return get$1(this, key, false, true);
  566. },
  567. get size() {
  568. return size(this);
  569. },
  570. has: has$1,
  571. add,
  572. set: set$1,
  573. delete: deleteEntry,
  574. clear,
  575. forEach: createForEach(false, true)
  576. };
  577. const readonlyInstrumentations = {
  578. get(key) {
  579. return get$1(this, key, true);
  580. },
  581. get size() {
  582. return size(this, true);
  583. },
  584. has(key) {
  585. return has$1.call(this, key, true);
  586. },
  587. add: createReadonlyMethod("add" /* ADD */),
  588. set: createReadonlyMethod("set" /* SET */),
  589. delete: createReadonlyMethod("delete" /* DELETE */),
  590. clear: createReadonlyMethod("clear" /* CLEAR */),
  591. forEach: createForEach(true, false)
  592. };
  593. const iteratorMethods = ['keys', 'values', 'entries', Symbol.iterator];
  594. iteratorMethods.forEach(method => {
  595. mutableInstrumentations[method] = createIterableMethod(method, false, false);
  596. readonlyInstrumentations[method] = createIterableMethod(method, true, false);
  597. shallowInstrumentations[method] = createIterableMethod(method, false, true);
  598. });
  599. function createInstrumentationGetter(isReadonly, shallow) {
  600. const instrumentations = shallow
  601. ? shallowInstrumentations
  602. : isReadonly
  603. ? readonlyInstrumentations
  604. : mutableInstrumentations;
  605. return (target, key, receiver) => {
  606. if (key === "__v_isReactive" /* IS_REACTIVE */) {
  607. return !isReadonly;
  608. }
  609. else if (key === "__v_isReadonly" /* IS_READONLY */) {
  610. return isReadonly;
  611. }
  612. else if (key === "__v_raw" /* RAW */) {
  613. return target;
  614. }
  615. return Reflect.get(hasOwn(instrumentations, key) && key in target
  616. ? instrumentations
  617. : target, key, receiver);
  618. };
  619. }
  620. const mutableCollectionHandlers = {
  621. get: createInstrumentationGetter(false, false)
  622. };
  623. const shallowCollectionHandlers = {
  624. get: createInstrumentationGetter(false, true)
  625. };
  626. const readonlyCollectionHandlers = {
  627. get: createInstrumentationGetter(true, false)
  628. };
  629. function checkIdentityKeys(target, has, key) {
  630. const rawKey = toRaw(key);
  631. if (rawKey !== key && has.call(target, rawKey)) {
  632. const type = toRawType(target);
  633. console.warn(`Reactive ${type} contains both the raw and reactive ` +
  634. `versions of the same object${type === `Map` ? ` as keys` : ``}, ` +
  635. `which can lead to inconsistencies. ` +
  636. `Avoid differentiating between the raw and reactive versions ` +
  637. `of an object and only use the reactive version if possible.`);
  638. }
  639. }
  640. const reactiveMap = new WeakMap();
  641. const readonlyMap = new WeakMap();
  642. function targetTypeMap(rawType) {
  643. switch (rawType) {
  644. case 'Object':
  645. case 'Array':
  646. return 1 /* COMMON */;
  647. case 'Map':
  648. case 'Set':
  649. case 'WeakMap':
  650. case 'WeakSet':
  651. return 2 /* COLLECTION */;
  652. default:
  653. return 0 /* INVALID */;
  654. }
  655. }
  656. function getTargetType(value) {
  657. return value["__v_skip" /* SKIP */] || !Object.isExtensible(value)
  658. ? 0 /* INVALID */
  659. : targetTypeMap(toRawType(value));
  660. }
  661. function reactive(target) {
  662. // if trying to observe a readonly proxy, return the readonly version.
  663. if (target && target["__v_isReadonly" /* IS_READONLY */]) {
  664. return target;
  665. }
  666. return createReactiveObject(target, false, mutableHandlers, mutableCollectionHandlers);
  667. }
  668. // Return a reactive-copy of the original object, where only the root level
  669. // properties are reactive, and does NOT unwrap refs nor recursively convert
  670. // returned properties.
  671. function shallowReactive(target) {
  672. return createReactiveObject(target, false, shallowReactiveHandlers, shallowCollectionHandlers);
  673. }
  674. function readonly(target) {
  675. return createReactiveObject(target, true, readonlyHandlers, readonlyCollectionHandlers);
  676. }
  677. // Return a reactive-copy of the original object, where only the root level
  678. // properties are readonly, and does NOT unwrap refs nor recursively convert
  679. // returned properties.
  680. // This is used for creating the props proxy object for stateful components.
  681. function shallowReadonly(target) {
  682. return createReactiveObject(target, true, shallowReadonlyHandlers, readonlyCollectionHandlers);
  683. }
  684. function createReactiveObject(target, isReadonly, baseHandlers, collectionHandlers) {
  685. if (!isObject(target)) {
  686. {
  687. console.warn(`value cannot be made reactive: ${String(target)}`);
  688. }
  689. return target;
  690. }
  691. // target is already a Proxy, return it.
  692. // exception: calling readonly() on a reactive object
  693. if (target["__v_raw" /* RAW */] &&
  694. !(isReadonly && target["__v_isReactive" /* IS_REACTIVE */])) {
  695. return target;
  696. }
  697. // target already has corresponding Proxy
  698. const proxyMap = isReadonly ? readonlyMap : reactiveMap;
  699. const existingProxy = proxyMap.get(target);
  700. if (existingProxy) {
  701. return existingProxy;
  702. }
  703. // only a whitelist of value types can be observed.
  704. const targetType = getTargetType(target);
  705. if (targetType === 0 /* INVALID */) {
  706. return target;
  707. }
  708. const proxy = new Proxy(target, targetType === 2 /* COLLECTION */ ? collectionHandlers : baseHandlers);
  709. proxyMap.set(target, proxy);
  710. return proxy;
  711. }
  712. function isReactive(value) {
  713. if (isReadonly(value)) {
  714. return isReactive(value["__v_raw" /* RAW */]);
  715. }
  716. return !!(value && value["__v_isReactive" /* IS_REACTIVE */]);
  717. }
  718. function isReadonly(value) {
  719. return !!(value && value["__v_isReadonly" /* IS_READONLY */]);
  720. }
  721. function isProxy(value) {
  722. return isReactive(value) || isReadonly(value);
  723. }
  724. function toRaw(observed) {
  725. return ((observed && toRaw(observed["__v_raw" /* RAW */])) || observed);
  726. }
  727. function markRaw(value) {
  728. def(value, "__v_skip" /* SKIP */, true);
  729. return value;
  730. }
  731. const convert = (val) => isObject(val) ? reactive(val) : val;
  732. function isRef(r) {
  733. return Boolean(r && r.__v_isRef === true);
  734. }
  735. function ref(value) {
  736. return createRef(value);
  737. }
  738. function shallowRef(value) {
  739. return createRef(value, true);
  740. }
  741. class RefImpl {
  742. constructor(_rawValue, _shallow = false) {
  743. this._rawValue = _rawValue;
  744. this._shallow = _shallow;
  745. this.__v_isRef = true;
  746. this._value = _shallow ? _rawValue : convert(_rawValue);
  747. }
  748. get value() {
  749. track(toRaw(this), "get" /* GET */, 'value');
  750. return this._value;
  751. }
  752. set value(newVal) {
  753. if (hasChanged(toRaw(newVal), this._rawValue)) {
  754. this._rawValue = newVal;
  755. this._value = this._shallow ? newVal : convert(newVal);
  756. trigger(toRaw(this), "set" /* SET */, 'value', newVal);
  757. }
  758. }
  759. }
  760. function createRef(rawValue, shallow = false) {
  761. if (isRef(rawValue)) {
  762. return rawValue;
  763. }
  764. return new RefImpl(rawValue, shallow);
  765. }
  766. function triggerRef(ref) {
  767. trigger(toRaw(ref), "set" /* SET */, 'value', ref.value );
  768. }
  769. function unref(ref) {
  770. return isRef(ref) ? ref.value : ref;
  771. }
  772. const shallowUnwrapHandlers = {
  773. get: (target, key, receiver) => unref(Reflect.get(target, key, receiver)),
  774. set: (target, key, value, receiver) => {
  775. const oldValue = target[key];
  776. if (isRef(oldValue) && !isRef(value)) {
  777. oldValue.value = value;
  778. return true;
  779. }
  780. else {
  781. return Reflect.set(target, key, value, receiver);
  782. }
  783. }
  784. };
  785. function proxyRefs(objectWithRefs) {
  786. return isReactive(objectWithRefs)
  787. ? objectWithRefs
  788. : new Proxy(objectWithRefs, shallowUnwrapHandlers);
  789. }
  790. class CustomRefImpl {
  791. constructor(factory) {
  792. this.__v_isRef = true;
  793. const { get, set } = factory(() => track(this, "get" /* GET */, 'value'), () => trigger(this, "set" /* SET */, 'value'));
  794. this._get = get;
  795. this._set = set;
  796. }
  797. get value() {
  798. return this._get();
  799. }
  800. set value(newVal) {
  801. this._set(newVal);
  802. }
  803. }
  804. function customRef(factory) {
  805. return new CustomRefImpl(factory);
  806. }
  807. function toRefs(object) {
  808. if ( !isProxy(object)) {
  809. console.warn(`toRefs() expects a reactive object but received a plain one.`);
  810. }
  811. const ret = isArray(object) ? new Array(object.length) : {};
  812. for (const key in object) {
  813. ret[key] = toRef(object, key);
  814. }
  815. return ret;
  816. }
  817. class ObjectRefImpl {
  818. constructor(_object, _key) {
  819. this._object = _object;
  820. this._key = _key;
  821. this.__v_isRef = true;
  822. }
  823. get value() {
  824. return this._object[this._key];
  825. }
  826. set value(newVal) {
  827. this._object[this._key] = newVal;
  828. }
  829. }
  830. function toRef(object, key) {
  831. return isRef(object[key])
  832. ? object[key]
  833. : new ObjectRefImpl(object, key);
  834. }
  835. class ComputedRefImpl {
  836. constructor(getter, _setter, isReadonly) {
  837. this._setter = _setter;
  838. this._dirty = true;
  839. this.__v_isRef = true;
  840. this.effect = effect(getter, {
  841. lazy: true,
  842. scheduler: () => {
  843. if (!this._dirty) {
  844. this._dirty = true;
  845. trigger(toRaw(this), "set" /* SET */, 'value');
  846. }
  847. }
  848. });
  849. this["__v_isReadonly" /* IS_READONLY */] = isReadonly;
  850. }
  851. get value() {
  852. if (this._dirty) {
  853. this._value = this.effect();
  854. this._dirty = false;
  855. }
  856. track(toRaw(this), "get" /* GET */, 'value');
  857. return this._value;
  858. }
  859. set value(newValue) {
  860. this._setter(newValue);
  861. }
  862. }
  863. function computed(getterOrOptions) {
  864. let getter;
  865. let setter;
  866. if (isFunction(getterOrOptions)) {
  867. getter = getterOrOptions;
  868. setter = () => {
  869. console.warn('Write operation failed: computed value is readonly');
  870. }
  871. ;
  872. }
  873. else {
  874. getter = getterOrOptions.get;
  875. setter = getterOrOptions.set;
  876. }
  877. return new ComputedRefImpl(getter, setter, isFunction(getterOrOptions) || !getterOrOptions.set);
  878. }
  879. export { ITERATE_KEY, computed, customRef, effect, enableTracking, isProxy, isReactive, isReadonly, isRef, markRaw, pauseTracking, proxyRefs, reactive, readonly, ref, resetTracking, shallowReactive, shallowReadonly, shallowRef, stop, toRaw, toRef, toRefs, track, trigger, triggerRef, unref };