(optionsDefault),\n // @fb-only: scopeRules_APPEND_ONLY_READ_THE_DOCS,\n // @fb-only: });\n } else {\n return baseAtom({ ...restOptions,\n default: optionsDefault\n });\n }\n}\n\nfunction atomWithFallback(options) {\n const base = atom({ ...options,\n default: DEFAULT_VALUE$7,\n persistence_UNSTABLE: options.persistence_UNSTABLE === undefined ? undefined : { ...options.persistence_UNSTABLE,\n validator: storedValue => storedValue instanceof DefaultValue$2 ? storedValue : Recoil_nullthrows(options.persistence_UNSTABLE).validator(storedValue, DEFAULT_VALUE$7)\n },\n // TODO Hack for now.\n effects: options.effects,\n // flowlint-line unclear-type: off\n effects_UNSTABLE: options.effects_UNSTABLE // flowlint-line unclear-type: off\n\n }); // $FlowFixMe[incompatible-call]\n\n const sel = Recoil_selector({\n key: `${options.key}__withFallback`,\n get: ({\n get\n }) => {\n const baseValue = get(base);\n return baseValue instanceof DefaultValue$2 ? options.default : baseValue;\n },\n // $FlowFixMe[incompatible-call]\n set: ({\n set\n }, newValue) => set(base, newValue),\n // This selector does not need to cache as it is a wrapper selector\n // and the selector within the wrapper selector will have a cache\n // option by default\n cachePolicy_UNSTABLE: {\n eviction: 'most-recent'\n },\n dangerouslyAllowMutability: options.dangerouslyAllowMutability\n });\n setConfigDeletionHandler$1(sel.key, getConfigDeletionHandler$2(options.key));\n return sel;\n} // $FlowFixMe[missing-local-annot]\n\n\natom.value = value => new WrappedValue$2(value);\n\nvar Recoil_atom = atom;\n\n/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * \n * @format\n * @oncall recoil\n */\n\nclass MapCache {\n constructor(options) {\n var _options$mapKey;\n\n _defineProperty(this, \"_map\", void 0);\n\n _defineProperty(this, \"_keyMapper\", void 0);\n\n this._map = new Map();\n this._keyMapper = (_options$mapKey = options === null || options === void 0 ? void 0 : options.mapKey) !== null && _options$mapKey !== void 0 ? _options$mapKey : v => v;\n }\n\n size() {\n return this._map.size;\n }\n\n has(key) {\n return this._map.has(this._keyMapper(key));\n }\n\n get(key) {\n return this._map.get(this._keyMapper(key));\n }\n\n set(key, val) {\n this._map.set(this._keyMapper(key), val);\n }\n\n delete(key) {\n this._map.delete(this._keyMapper(key));\n }\n\n clear() {\n this._map.clear();\n }\n\n}\n\nvar Recoil_MapCache = {\n MapCache\n};\n\nvar Recoil_MapCache_1 = Recoil_MapCache.MapCache;\n\nvar Recoil_MapCache$1 = /*#__PURE__*/Object.freeze({\n __proto__: null,\n MapCache: Recoil_MapCache_1\n});\n\nconst {\n LRUCache: LRUCache$2\n} = Recoil_LRUCache$1;\n\nconst {\n MapCache: MapCache$1\n} = Recoil_MapCache$1;\n\n\n\n\n\n\n\nconst defaultPolicy$1 = {\n equality: 'reference',\n eviction: 'none',\n maxSize: Infinity\n};\n\nfunction cacheFromPolicy({\n equality = defaultPolicy$1.equality,\n eviction = defaultPolicy$1.eviction,\n maxSize = defaultPolicy$1.maxSize\n} = defaultPolicy$1) {\n const valueMapper = getValueMapper$1(equality);\n const cache = getCache(eviction, maxSize, valueMapper);\n return cache;\n}\n\nfunction getValueMapper$1(equality) {\n switch (equality) {\n case 'reference':\n return val => val;\n\n case 'value':\n return val => Recoil_stableStringify(val);\n }\n\n throw Recoil_err(`Unrecognized equality policy ${equality}`);\n}\n\nfunction getCache(eviction, maxSize, mapKey) {\n switch (eviction) {\n case 'keep-all':\n return new MapCache$1({\n mapKey\n });\n\n case 'lru':\n return new LRUCache$2({\n mapKey,\n maxSize: Recoil_nullthrows(maxSize)\n });\n\n case 'most-recent':\n return new LRUCache$2({\n mapKey,\n maxSize: 1\n });\n }\n\n throw Recoil_err(`Unrecognized eviction policy ${eviction}`);\n}\n\nvar Recoil_cacheFromPolicy = cacheFromPolicy;\n\n// @fb-only: import type {ScopeRules} from 'Recoil_ScopedAtom';\n\n\nconst {\n setConfigDeletionHandler: setConfigDeletionHandler$2\n} = Recoil_Node;\n\n\n\n\n\n// Process scopeRules to handle any entries which are functions taking parameters\n// prettier-ignore\n// @fb-only: function mapScopeRules(\n// @fb-only: scopeRules?: ParameterizedScopeRules
,\n// @fb-only: param: P,\n// @fb-only: ): ScopeRules | void {\n// @fb-only: return scopeRules?.map(rule =>\n// @fb-only: Array.isArray(rule)\n// @fb-only: ? rule.map(entry => (typeof entry === 'function' ? entry(param) : entry))\n// @fb-only: : rule,\n// @fb-only: );\n// @fb-only: }\n\n/*\nA function which returns an atom based on the input parameter.\n\nEach unique parameter returns a unique atom. E.g.,\n\n const f = atomFamily(...);\n f({a: 1}) => an atom\n f({a: 2}) => a different atom\n\nThis allows components to persist local, private state using atoms. Each\ninstance of the component may have a different key, which it uses as the\nparameter for a family of atoms; in this way, each component will have\nits own atom not shared by other instances. These state keys may be composed\ninto children's state keys as well.\n*/\nfunction atomFamily(options) {\n var _options$cachePolicyF, _options$cachePolicyF2;\n\n const atomCache = Recoil_cacheFromPolicy({\n equality: (_options$cachePolicyF = (_options$cachePolicyF2 = options.cachePolicyForParams_UNSTABLE) === null || _options$cachePolicyF2 === void 0 ? void 0 : _options$cachePolicyF2.equality) !== null && _options$cachePolicyF !== void 0 ? _options$cachePolicyF : 'value',\n eviction: 'keep-all'\n }); // Simple atomFamily implementation to cache individual atoms based\n // on the parameter value equality.\n\n return params => {\n var _stableStringify, _options$effects;\n\n const cachedAtom = atomCache.get(params);\n\n if (cachedAtom != null) {\n return cachedAtom;\n }\n\n const {\n cachePolicyForParams_UNSTABLE,\n ...atomOptions\n } = options;\n const optionsDefault = 'default' in options ? // $FlowIssue[incompatible-type] No way to refine in Flow that property is not defined\n options.default : new Promise(() => {});\n const newAtom = Recoil_atom({ ...atomOptions,\n key: `${options.key}__${(_stableStringify = Recoil_stableStringify(params)) !== null && _stableStringify !== void 0 ? _stableStringify : 'void'}`,\n default: typeof optionsDefault === 'function' ? // The default was parameterized\n // Flow doesn't know that T isn't a function, so we need to case to any\n // $FlowIssue[incompatible-use]\n optionsDefault(params) : // Default may be a static value, promise, or RecoilValue\n optionsDefault,\n retainedBy_UNSTABLE: typeof options.retainedBy_UNSTABLE === 'function' ? options.retainedBy_UNSTABLE(params) : options.retainedBy_UNSTABLE,\n effects: typeof options.effects === 'function' ? options.effects(params) : typeof options.effects_UNSTABLE === 'function' ? options.effects_UNSTABLE(params) : (_options$effects = options.effects) !== null && _options$effects !== void 0 ? _options$effects : options.effects_UNSTABLE // prettier-ignore\n // @fb-only: scopeRules_APPEND_ONLY_READ_THE_DOCS: mapScopeRules(\n // @fb-only: options.scopeRules_APPEND_ONLY_READ_THE_DOCS,\n // @fb-only: params,\n // @fb-only: ),\n\n });\n atomCache.set(params, newAtom);\n setConfigDeletionHandler$2(newAtom.key, () => {\n atomCache.delete(params);\n });\n return newAtom;\n };\n}\n\nvar Recoil_atomFamily = atomFamily;\n\nconst {\n setConfigDeletionHandler: setConfigDeletionHandler$3\n} = Recoil_Node;\n\n\n\n\n\n // Keep in mind the parameter needs to be serializable as a cahche key\n// using Recoil_stableStringify\n\n\n// Add a unique index to each selector in case the cache implementation allows\n// duplicate keys based on equivalent stringified parameters\nlet nextIndex = 0;\n/* eslint-disable no-redeclare */\n\n// Return a function that returns members of a family of selectors of the same type\n// E.g.,\n//\n// const s = selectorFamily(...);\n// s({a: 1}) => a selector\n// s({a: 2}) => a different selector\n//\n// By default, the selectors are distinguished by distinct values of the\n// parameter based on value equality, not reference equality. This allows using\n// object literals or other equivalent objects at callsites to not create\n// duplicate cache entries. This behavior may be overridden with the\n// cacheImplementationForParams option.\nfunction selectorFamily(options) {\n var _options$cachePolicyF, _options$cachePolicyF2;\n\n const selectorCache = Recoil_cacheFromPolicy({\n equality: (_options$cachePolicyF = (_options$cachePolicyF2 = options.cachePolicyForParams_UNSTABLE) === null || _options$cachePolicyF2 === void 0 ? void 0 : _options$cachePolicyF2.equality) !== null && _options$cachePolicyF !== void 0 ? _options$cachePolicyF : 'value',\n eviction: 'keep-all'\n });\n return params => {\n var _stableStringify;\n\n // Throw an error with selector key so that it is clear which\n // selector is causing an error\n let cachedSelector;\n\n try {\n cachedSelector = selectorCache.get(params);\n } catch (error) {\n throw Recoil_err(`Problem with cache lookup for selector ${options.key}: ${error.message}`);\n }\n\n if (cachedSelector != null) {\n return cachedSelector;\n }\n\n const myKey = `${options.key}__selectorFamily/${(_stableStringify = Recoil_stableStringify(params, {\n // It is possible to use functions in parameters if the user uses\n // a cache with reference equality thanks to the incrementing index.\n allowFunctions: true\n })) !== null && _stableStringify !== void 0 ? _stableStringify : 'void'}/${nextIndex++}`; // Append index in case values serialize to the same key string\n\n const myGet = callbacks => options.get(params)(callbacks);\n\n const myCachePolicy = options.cachePolicy_UNSTABLE;\n const retainedBy = typeof options.retainedBy_UNSTABLE === 'function' ? options.retainedBy_UNSTABLE(params) : options.retainedBy_UNSTABLE;\n let newSelector;\n\n if (options.set != null) {\n const set = options.set;\n\n const mySet = (callbacks, newValue) => set(params)(callbacks, newValue);\n\n newSelector = Recoil_selector({\n key: myKey,\n get: myGet,\n set: mySet,\n cachePolicy_UNSTABLE: myCachePolicy,\n dangerouslyAllowMutability: options.dangerouslyAllowMutability,\n retainedBy_UNSTABLE: retainedBy\n });\n } else {\n newSelector = Recoil_selector({\n key: myKey,\n get: myGet,\n cachePolicy_UNSTABLE: myCachePolicy,\n dangerouslyAllowMutability: options.dangerouslyAllowMutability,\n retainedBy_UNSTABLE: retainedBy\n });\n }\n\n selectorCache.set(params, newSelector);\n setConfigDeletionHandler$3(newSelector.key, () => {\n selectorCache.delete(params);\n });\n return newSelector;\n };\n}\n/* eslint-enable no-redeclare */\n\n\nvar Recoil_selectorFamily = selectorFamily;\n\n// flowlint-next-line unclear-type:off\n\n\nconst constantSelector = Recoil_selectorFamily({\n key: '__constant',\n get: constant => () => constant,\n cachePolicyForParams_UNSTABLE: {\n equality: 'reference'\n }\n}); // Function that returns a selector which always produces the\n// same constant value. It may be called multiple times with the\n// same value, based on reference equality, and will provide the\n// same selector.\n\nfunction constSelector(constant) {\n return constantSelector(constant);\n}\n\nvar Recoil_constSelector = constSelector;\n\n// flowlint-next-line unclear-type:off\n\n\nconst throwingSelector = Recoil_selectorFamily({\n key: '__error',\n get: message => () => {\n throw Recoil_err(message);\n },\n // TODO Why?\n cachePolicyForParams_UNSTABLE: {\n equality: 'reference'\n }\n}); // Function that returns a selector which always throws an error\n// with the provided message.\n\nfunction errorSelector(message) {\n return throwingSelector(message);\n}\n\nvar Recoil_errorSelector = errorSelector;\n\n/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * Wraps another recoil value and prevents writing to it.\n *\n * \n * @format\n * @oncall recoil\n */\n\nfunction readOnlySelector(atom) {\n // flowlint-next-line unclear-type: off\n return atom;\n}\n\nvar Recoil_readOnlySelector = readOnlySelector;\n\nconst {\n loadableWithError: loadableWithError$3,\n loadableWithPromise: loadableWithPromise$3,\n loadableWithValue: loadableWithValue$4\n} = Recoil_Loadable$1;\n\n\n\n\n\n /////////////////\n// TRUTH TABLE\n/////////////////\n// Dependencies waitForNone waitForAny waitForAll waitForAllSettled\n// [loading, loading] [Promise, Promise] Promise Promise Promise\n// [value, loading] [value, Promise] [value, Promise] Promise Promise\n// [value, value] [value, value] [value, value] [value, value] [value, value]\n//\n// [error, loading] [Error, Promise] [Error, Promise] Error Promise\n// [error, error] [Error, Error] [Error, Error] Error [error, error]\n// [value, error] [value, Error] [value, Error] Error [value, error]\n// Issue parallel requests for all dependencies and return the current\n// status if they have results, have some error, or are still pending.\n\n\nfunction concurrentRequests(getRecoilValue, deps) {\n const results = Array(deps.length).fill(undefined);\n const exceptions = Array(deps.length).fill(undefined);\n\n for (const [i, dep] of deps.entries()) {\n try {\n results[i] = getRecoilValue(dep);\n } catch (e) {\n // exceptions can either be Promises of pending results or real errors\n exceptions[i] = e;\n }\n }\n\n return [results, exceptions];\n}\n\nfunction isError(exp) {\n return exp != null && !Recoil_isPromise(exp);\n}\n\nfunction unwrapDependencies(dependencies) {\n return Array.isArray(dependencies) ? dependencies : Object.getOwnPropertyNames(dependencies).map(key => dependencies[key]);\n}\n\nfunction wrapResults(dependencies,\n/* $FlowFixMe[missing-local-annot] The type annotation(s) required by Flow's\n * LTI update could not be added via codemod */\nresults) {\n return Array.isArray(dependencies) ? results : // Object.getOwnPropertyNames() has consistent key ordering with ES6\n Object.getOwnPropertyNames(dependencies).reduce((out, key, idx) => ({ ...out,\n [key]: results[idx]\n }), {});\n}\n\nfunction wrapLoadables(dependencies, results, exceptions) {\n const output = exceptions.map((exception, idx) => exception == null ? loadableWithValue$4(results[idx]) : Recoil_isPromise(exception) ? loadableWithPromise$3(exception) : loadableWithError$3(exception));\n return wrapResults(dependencies, output);\n}\n\nfunction combineAsyncResultsWithSyncResults(syncResults, asyncResults) {\n return asyncResults.map((result, idx) =>\n /**\n * it's important we use === undefined as opposed to == null, because the\n * resolved value of the async promise could be `null`, in which case we\n * don't want to use syncResults[idx], which would be undefined. If async\n * promise resolves to `undefined`, that's ok because `syncResults[idx]`\n * will also be `undefined`. That's a little hacky, but it works.\n */\n result === undefined ? syncResults[idx] : result);\n} // Selector that requests all dependencies in parallel and immediately returns\n// current results without waiting.\n\n\nconst waitForNone = Recoil_selectorFamily({\n key: '__waitForNone',\n get: dependencies => ({\n get\n }) => {\n // Issue requests for all dependencies in parallel.\n const deps = unwrapDependencies(dependencies);\n const [results, exceptions] = concurrentRequests(get, deps); // Always return the current status of the results; never block.\n\n return wrapLoadables(dependencies, results, exceptions);\n },\n dangerouslyAllowMutability: true\n}); // Selector that requests all dependencies in parallel and waits for at least\n// one to be available before returning results. It will only error if all\n// dependencies have errors.\n\nconst waitForAny = Recoil_selectorFamily({\n key: '__waitForAny',\n get: dependencies => ({\n get\n }) => {\n // Issue requests for all dependencies in parallel.\n // Exceptions can either be Promises of pending results or real errors\n const deps = unwrapDependencies(dependencies);\n const [results, exceptions] = concurrentRequests(get, deps); // If any results are available, value or error, return the current status\n\n if (exceptions.some(exp => !Recoil_isPromise(exp))) {\n return wrapLoadables(dependencies, results, exceptions);\n } // Otherwise, return a promise that will resolve when the next result is\n // available, whichever one happens to be next. But, if all pending\n // dependencies end up with errors, then reject the promise.\n\n\n return new Promise(resolve => {\n for (const [i, exp] of exceptions.entries()) {\n if (Recoil_isPromise(exp)) {\n exp.then(result => {\n results[i] = result;\n exceptions[i] = undefined;\n resolve(wrapLoadables(dependencies, results, exceptions));\n }).catch(error => {\n exceptions[i] = error;\n resolve(wrapLoadables(dependencies, results, exceptions));\n });\n }\n }\n });\n },\n dangerouslyAllowMutability: true\n}); // Selector that requests all dependencies in parallel and waits for all to be\n// available before returning a value. It will error if any dependencies error.\n\nconst waitForAll = Recoil_selectorFamily({\n key: '__waitForAll',\n get: dependencies => ({\n get\n }) => {\n // Issue requests for all dependencies in parallel.\n // Exceptions can either be Promises of pending results or real errors\n const deps = unwrapDependencies(dependencies);\n const [results, exceptions] = concurrentRequests(get, deps); // If all results are available, return the results\n\n if (exceptions.every(exp => exp == null)) {\n return wrapResults(dependencies, results);\n } // If we have any errors, throw the first error\n\n\n const error = exceptions.find(isError);\n\n if (error != null) {\n throw error;\n } // Otherwise, return a promise that will resolve when all results are available\n\n\n return Promise.all(exceptions).then(exceptionResults => wrapResults(dependencies, combineAsyncResultsWithSyncResults(results, exceptionResults)));\n },\n dangerouslyAllowMutability: true\n});\nconst waitForAllSettled = Recoil_selectorFamily({\n key: '__waitForAllSettled',\n get: dependencies => ({\n get\n }) => {\n // Issue requests for all dependencies in parallel.\n // Exceptions can either be Promises of pending results or real errors\n const deps = unwrapDependencies(dependencies);\n const [results, exceptions] = concurrentRequests(get, deps); // If all results are available, return the results\n\n if (exceptions.every(exp => !Recoil_isPromise(exp))) {\n return wrapLoadables(dependencies, results, exceptions);\n } // Wait for all results to settle\n\n\n return Promise.all(exceptions.map((exp, i) => Recoil_isPromise(exp) ? exp.then(result => {\n results[i] = result;\n exceptions[i] = undefined;\n }).catch(error => {\n results[i] = undefined;\n exceptions[i] = error;\n }) : null)) // Then wrap them as loadables\n .then(() => wrapLoadables(dependencies, results, exceptions));\n },\n dangerouslyAllowMutability: true\n});\nconst noWait = Recoil_selectorFamily({\n key: '__noWait',\n get: dependency => ({\n get\n }) => {\n try {\n return Recoil_selector.value(loadableWithValue$4(get(dependency)));\n } catch (exception) {\n return Recoil_selector.value(Recoil_isPromise(exception) ? loadableWithPromise$3(exception) : loadableWithError$3(exception));\n }\n },\n dangerouslyAllowMutability: true\n});\nvar Recoil_WaitFor = {\n waitForNone,\n waitForAny,\n waitForAll,\n waitForAllSettled,\n noWait\n};\n\nconst {\n RecoilLoadable\n} = Recoil_Loadable$1;\n\nconst {\n DefaultValue: DefaultValue$3\n} = Recoil_Node;\n\nconst {\n RecoilRoot: RecoilRoot$2,\n useRecoilStoreID: useRecoilStoreID$1\n} = Recoil_RecoilRoot;\n\nconst {\n isRecoilValue: isRecoilValue$5\n} = Recoil_RecoilValue$1;\n\nconst {\n retentionZone: retentionZone$1\n} = Recoil_RetentionZone;\n\nconst {\n freshSnapshot: freshSnapshot$2\n} = Recoil_Snapshot$1;\n\nconst {\n useRecoilState: useRecoilState$1,\n useRecoilState_TRANSITION_SUPPORT_UNSTABLE: useRecoilState_TRANSITION_SUPPORT_UNSTABLE$1,\n useRecoilStateLoadable: useRecoilStateLoadable$1,\n useRecoilValue: useRecoilValue$1,\n useRecoilValue_TRANSITION_SUPPORT_UNSTABLE: useRecoilValue_TRANSITION_SUPPORT_UNSTABLE$1,\n useRecoilValueLoadable: useRecoilValueLoadable$1,\n useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE: useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE$1,\n useResetRecoilState: useResetRecoilState$1,\n useSetRecoilState: useSetRecoilState$1\n} = Recoil_Hooks;\n\nconst {\n useGotoRecoilSnapshot: useGotoRecoilSnapshot$1,\n useRecoilSnapshot: useRecoilSnapshot$1,\n useRecoilTransactionObserver: useRecoilTransactionObserver$1\n} = Recoil_SnapshotHooks;\n\n\n\n\n\nconst {\n useRecoilCallback: useRecoilCallback$1\n} = Recoil_useRecoilCallback;\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nconst {\n noWait: noWait$1,\n waitForAll: waitForAll$1,\n waitForAllSettled: waitForAllSettled$1,\n waitForAny: waitForAny$1,\n waitForNone: waitForNone$1\n} = Recoil_WaitFor;\n\n\n\nvar Recoil_index = {\n // Types\n DefaultValue: DefaultValue$3,\n isRecoilValue: isRecoilValue$5,\n RecoilLoadable,\n // Global Recoil environment settiongs\n RecoilEnv: Recoil_RecoilEnv,\n // Recoil Root\n RecoilRoot: RecoilRoot$2,\n useRecoilStoreID: useRecoilStoreID$1,\n useRecoilBridgeAcrossReactRoots_UNSTABLE: Recoil_useRecoilBridgeAcrossReactRoots,\n // Atoms/Selectors\n atom: Recoil_atom,\n selector: Recoil_selector,\n // Convenience Atoms/Selectors\n atomFamily: Recoil_atomFamily,\n selectorFamily: Recoil_selectorFamily,\n constSelector: Recoil_constSelector,\n errorSelector: Recoil_errorSelector,\n readOnlySelector: Recoil_readOnlySelector,\n // Concurrency Helpers for Atoms/Selectors\n noWait: noWait$1,\n waitForNone: waitForNone$1,\n waitForAny: waitForAny$1,\n waitForAll: waitForAll$1,\n waitForAllSettled: waitForAllSettled$1,\n // Hooks for Atoms/Selectors\n useRecoilValue: useRecoilValue$1,\n useRecoilValueLoadable: useRecoilValueLoadable$1,\n useRecoilState: useRecoilState$1,\n useRecoilStateLoadable: useRecoilStateLoadable$1,\n useSetRecoilState: useSetRecoilState$1,\n useResetRecoilState: useResetRecoilState$1,\n useGetRecoilValueInfo_UNSTABLE: Recoil_useGetRecoilValueInfo,\n useRecoilRefresher_UNSTABLE: Recoil_useRecoilRefresher,\n useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE: useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE$1,\n useRecoilValue_TRANSITION_SUPPORT_UNSTABLE: useRecoilValue_TRANSITION_SUPPORT_UNSTABLE$1,\n useRecoilState_TRANSITION_SUPPORT_UNSTABLE: useRecoilState_TRANSITION_SUPPORT_UNSTABLE$1,\n // Hooks for complex operations\n useRecoilCallback: useRecoilCallback$1,\n useRecoilTransaction_UNSTABLE: Recoil_useRecoilTransaction,\n // Snapshots\n useGotoRecoilSnapshot: useGotoRecoilSnapshot$1,\n useRecoilSnapshot: useRecoilSnapshot$1,\n useRecoilTransactionObserver_UNSTABLE: useRecoilTransactionObserver$1,\n snapshot_UNSTABLE: freshSnapshot$2,\n // Memory Management\n useRetain: Recoil_useRetain,\n retentionZone: retentionZone$1\n};\nvar Recoil_index_1 = Recoil_index.DefaultValue;\nvar Recoil_index_2 = Recoil_index.isRecoilValue;\nvar Recoil_index_3 = Recoil_index.RecoilLoadable;\nvar Recoil_index_4 = Recoil_index.RecoilEnv;\nvar Recoil_index_5 = Recoil_index.RecoilRoot;\nvar Recoil_index_6 = Recoil_index.useRecoilStoreID;\nvar Recoil_index_7 = Recoil_index.useRecoilBridgeAcrossReactRoots_UNSTABLE;\nvar Recoil_index_8 = Recoil_index.atom;\nvar Recoil_index_9 = Recoil_index.selector;\nvar Recoil_index_10 = Recoil_index.atomFamily;\nvar Recoil_index_11 = Recoil_index.selectorFamily;\nvar Recoil_index_12 = Recoil_index.constSelector;\nvar Recoil_index_13 = Recoil_index.errorSelector;\nvar Recoil_index_14 = Recoil_index.readOnlySelector;\nvar Recoil_index_15 = Recoil_index.noWait;\nvar Recoil_index_16 = Recoil_index.waitForNone;\nvar Recoil_index_17 = Recoil_index.waitForAny;\nvar Recoil_index_18 = Recoil_index.waitForAll;\nvar Recoil_index_19 = Recoil_index.waitForAllSettled;\nvar Recoil_index_20 = Recoil_index.useRecoilValue;\nvar Recoil_index_21 = Recoil_index.useRecoilValueLoadable;\nvar Recoil_index_22 = Recoil_index.useRecoilState;\nvar Recoil_index_23 = Recoil_index.useRecoilStateLoadable;\nvar Recoil_index_24 = Recoil_index.useSetRecoilState;\nvar Recoil_index_25 = Recoil_index.useResetRecoilState;\nvar Recoil_index_26 = Recoil_index.useGetRecoilValueInfo_UNSTABLE;\nvar Recoil_index_27 = Recoil_index.useRecoilRefresher_UNSTABLE;\nvar Recoil_index_28 = Recoil_index.useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE;\nvar Recoil_index_29 = Recoil_index.useRecoilValue_TRANSITION_SUPPORT_UNSTABLE;\nvar Recoil_index_30 = Recoil_index.useRecoilState_TRANSITION_SUPPORT_UNSTABLE;\nvar Recoil_index_31 = Recoil_index.useRecoilCallback;\nvar Recoil_index_32 = Recoil_index.useRecoilTransaction_UNSTABLE;\nvar Recoil_index_33 = Recoil_index.useGotoRecoilSnapshot;\nvar Recoil_index_34 = Recoil_index.useRecoilSnapshot;\nvar Recoil_index_35 = Recoil_index.useRecoilTransactionObserver_UNSTABLE;\nvar Recoil_index_36 = Recoil_index.snapshot_UNSTABLE;\nvar Recoil_index_37 = Recoil_index.useRetain;\nvar Recoil_index_38 = Recoil_index.retentionZone;\n\nexport default Recoil_index;\nexport { Recoil_index_1 as DefaultValue, Recoil_index_4 as RecoilEnv, Recoil_index_3 as RecoilLoadable, Recoil_index_5 as RecoilRoot, Recoil_index_8 as atom, Recoil_index_10 as atomFamily, Recoil_index_12 as constSelector, Recoil_index_13 as errorSelector, Recoil_index_2 as isRecoilValue, Recoil_index_15 as noWait, Recoil_index_14 as readOnlySelector, Recoil_index_38 as retentionZone, Recoil_index_9 as selector, Recoil_index_11 as selectorFamily, Recoil_index_36 as snapshot_UNSTABLE, Recoil_index_26 as useGetRecoilValueInfo_UNSTABLE, Recoil_index_33 as useGotoRecoilSnapshot, Recoil_index_7 as useRecoilBridgeAcrossReactRoots_UNSTABLE, Recoil_index_31 as useRecoilCallback, Recoil_index_27 as useRecoilRefresher_UNSTABLE, Recoil_index_34 as useRecoilSnapshot, Recoil_index_22 as useRecoilState, Recoil_index_23 as useRecoilStateLoadable, Recoil_index_30 as useRecoilState_TRANSITION_SUPPORT_UNSTABLE, Recoil_index_6 as useRecoilStoreID, Recoil_index_35 as useRecoilTransactionObserver_UNSTABLE, Recoil_index_32 as useRecoilTransaction_UNSTABLE, Recoil_index_20 as useRecoilValue, Recoil_index_21 as useRecoilValueLoadable, Recoil_index_28 as useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE, Recoil_index_29 as useRecoilValue_TRANSITION_SUPPORT_UNSTABLE, Recoil_index_25 as useResetRecoilState, Recoil_index_37 as useRetain, Recoil_index_24 as useSetRecoilState, Recoil_index_18 as waitForAll, Recoil_index_19 as waitForAllSettled, Recoil_index_17 as waitForAny, Recoil_index_16 as waitForNone };\n","import { atom } from \"recoil\";\r\n\r\nexport let idxAtom = atom({\r\n key: \"idxAtom\", // unique ID (with respect to other atoms/selectors)\r\n default: 0, // default value (aka initial value)\r\n});\r\n","import { atom } from \"recoil\";\r\n\r\nexport let ClickedAtom = atom({\r\n key: \"ClickedAtom\", // unique ID (with respect to other atoms/selectors)\r\n default: {}, // default value (aka initial value)\r\n});\r\n","import React, { useEffect, useState } from \"react\";\r\nimport \"./musicList.css\";\r\nimport SongsList from \"../../listOfSongs\";\r\nimport { idxAtom } from \"../recoil/idxAtom\";\r\nimport { useRecoilState } from \"recoil\";\r\nimport { ClickedAtom } from \"../recoil/clcikedAtom\";\r\nimport { useTranslation } from \"react-i18next\";\r\nexport const MusicList = () => {\r\n const [recIdx, setRecIdx] = useRecoilState(idxAtom);\r\n const [currentMusic, setCurrentMusic] = useRecoilState(ClickedAtom);\r\n const { t, i18n } = useTranslation();\r\n const [changeLang, setChangeLang] = useState();\r\n\r\n console.log(i18n.language);\r\n useEffect(() => {\r\n if (i18n.language == \"en\") {\r\n setChangeLang(false);\r\n } else {\r\n setChangeLang(true);\r\n }\r\n }, [i18n.language]);\r\n let showList = SongsList.map((el, idx) => {\r\n return (\r\n {\r\n setRecIdx(idx);\r\n setCurrentMusic({\r\n audio: el.audio,\r\n pic: el.pic,\r\n text: el.text,\r\n texten: el.texten,\r\n active: true,\r\n });\r\n }}\r\n key={idx}\r\n data-id={idx}\r\n className={`${changeLang ? \"ar\" : \"\"} item ${\r\n idx === recIdx ? \"active\" : \"notactive\"\r\n }`}\r\n >\r\n 
\r\n \r\n
\r\n {t(\"textQuran\", { returnObjects: true })[idx]}\r\n
\r\n\r\n
{t(\"qara\")}
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
1 ? clonedList[idx].pic : clonedList.pic}\r\n alt=\"Album Art\"\r\n />\r\n \r\n
1 ? clonedList[idx].pic : clonedList.pic}\r\n alt=\"Album Art\"\r\n />\r\n \r\n
1 ? clonedList[idx].audio : clonedList.audio}\r\n />\r\n \r\n {clonedList.length > 1\r\n ? i18n.language == \"ar\"\r\n ? clonedList[idx].text\r\n : clonedList[idx].texten\r\n : i18n.language == \"ar\"\r\n ? clonedList.text\r\n : clonedList.texten}\r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
00:00
\r\n
\r\n \r\n
\r\n
00:00
\r\n
\r\n
\r\n
Quran
\r\n \r\n
\r\n \r\n {SongsList.length}\r\n {\" \"}\r\n \r\n \r\n
\r\n
(\n// @fb-only: scopeRules?: ParameterizedScopeRules
,\n// @fb-only: param: P,\n// @fb-only: ): ScopeRules | void {\n// @fb-only: return scopeRules?.map(rule =>\n// @fb-only: Array.isArray(rule)\n// @fb-only: ? rule.map(entry => (typeof entry === 'function' ? entry(param) : entry))\n// @fb-only: : rule,\n// @fb-only: );\n// @fb-only: }\n\n/*\nA function which returns an atom based on the input parameter.\n\nEach unique parameter returns a unique atom. E.g.,\n\n const f = atomFamily(...);\n f({a: 1}) => an atom\n f({a: 2}) => a different atom\n\nThis allows components to persist local, private state using atoms. Each\ninstance of the component may have a different key, which it uses as the\nparameter for a family of atoms; in this way, each component will have\nits own atom not shared by other instances. These state keys may be composed\ninto children's state keys as well.\n*/\nfunction atomFamily(options) {\n var _options$cachePolicyF, _options$cachePolicyF2;\n\n const atomCache = Recoil_cacheFromPolicy({\n equality: (_options$cachePolicyF = (_options$cachePolicyF2 = options.cachePolicyForParams_UNSTABLE) === null || _options$cachePolicyF2 === void 0 ? void 0 : _options$cachePolicyF2.equality) !== null && _options$cachePolicyF !== void 0 ? _options$cachePolicyF : 'value',\n eviction: 'keep-all'\n }); // Simple atomFamily implementation to cache individual atoms based\n // on the parameter value equality.\n\n return params => {\n var _stableStringify, _options$effects;\n\n const cachedAtom = atomCache.get(params);\n\n if (cachedAtom != null) {\n return cachedAtom;\n }\n\n const {\n cachePolicyForParams_UNSTABLE,\n ...atomOptions\n } = options;\n const optionsDefault = 'default' in options ? // $FlowIssue[incompatible-type] No way to refine in Flow that property is not defined\n options.default : new Promise(() => {});\n const newAtom = Recoil_atom({ ...atomOptions,\n key: `${options.key}__${(_stableStringify = Recoil_stableStringify(params)) !== null && _stableStringify !== void 0 ? _stableStringify : 'void'}`,\n default: typeof optionsDefault === 'function' ? // The default was parameterized\n // Flow doesn't know that T isn't a function, so we need to case to any\n // $FlowIssue[incompatible-use]\n optionsDefault(params) : // Default may be a static value, promise, or RecoilValue\n optionsDefault,\n retainedBy_UNSTABLE: typeof options.retainedBy_UNSTABLE === 'function' ? options.retainedBy_UNSTABLE(params) : options.retainedBy_UNSTABLE,\n effects: typeof options.effects === 'function' ? options.effects(params) : typeof options.effects_UNSTABLE === 'function' ? options.effects_UNSTABLE(params) : (_options$effects = options.effects) !== null && _options$effects !== void 0 ? _options$effects : options.effects_UNSTABLE // prettier-ignore\n // @fb-only: scopeRules_APPEND_ONLY_READ_THE_DOCS: mapScopeRules(\n // @fb-only: options.scopeRules_APPEND_ONLY_READ_THE_DOCS,\n // @fb-only: params,\n // @fb-only: ),\n\n });\n atomCache.set(params, newAtom);\n setConfigDeletionHandler$2(newAtom.key, () => {\n atomCache.delete(params);\n });\n return newAtom;\n };\n}\n\nvar Recoil_atomFamily = atomFamily;\n\nconst {\n setConfigDeletionHandler: setConfigDeletionHandler$3\n} = Recoil_Node;\n\n\n\n\n\n // Keep in mind the parameter needs to be serializable as a cahche key\n// using Recoil_stableStringify\n\n\n// Add a unique index to each selector in case the cache implementation allows\n// duplicate keys based on equivalent stringified parameters\nlet nextIndex = 0;\n/* eslint-disable no-redeclare */\n\n// Return a function that returns members of a family of selectors of the same type\n// E.g.,\n//\n// const s = selectorFamily(...);\n// s({a: 1}) => a selector\n// s({a: 2}) => a different selector\n//\n// By default, the selectors are distinguished by distinct values of the\n// parameter based on value equality, not reference equality. This allows using\n// object literals or other equivalent objects at callsites to not create\n// duplicate cache entries. This behavior may be overridden with the\n// cacheImplementationForParams option.\nfunction selectorFamily(options) {\n var _options$cachePolicyF, _options$cachePolicyF2;\n\n const selectorCache = Recoil_cacheFromPolicy({\n equality: (_options$cachePolicyF = (_options$cachePolicyF2 = options.cachePolicyForParams_UNSTABLE) === null || _options$cachePolicyF2 === void 0 ? void 0 : _options$cachePolicyF2.equality) !== null && _options$cachePolicyF !== void 0 ? _options$cachePolicyF : 'value',\n eviction: 'keep-all'\n });\n return params => {\n var _stableStringify;\n\n // Throw an error with selector key so that it is clear which\n // selector is causing an error\n let cachedSelector;\n\n try {\n cachedSelector = selectorCache.get(params);\n } catch (error) {\n throw Recoil_err(`Problem with cache lookup for selector ${options.key}: ${error.message}`);\n }\n\n if (cachedSelector != null) {\n return cachedSelector;\n }\n\n const myKey = `${options.key}__selectorFamily/${(_stableStringify = Recoil_stableStringify(params, {\n // It is possible to use functions in parameters if the user uses\n // a cache with reference equality thanks to the incrementing index.\n allowFunctions: true\n })) !== null && _stableStringify !== void 0 ? _stableStringify : 'void'}/${nextIndex++}`; // Append index in case values serialize to the same key string\n\n const myGet = callbacks => options.get(params)(callbacks);\n\n const myCachePolicy = options.cachePolicy_UNSTABLE;\n const retainedBy = typeof options.retainedBy_UNSTABLE === 'function' ? options.retainedBy_UNSTABLE(params) : options.retainedBy_UNSTABLE;\n let newSelector;\n\n if (options.set != null) {\n const set = options.set;\n\n const mySet = (callbacks, newValue) => set(params)(callbacks, newValue);\n\n newSelector = Recoil_selector({\n key: myKey,\n get: myGet,\n set: mySet,\n cachePolicy_UNSTABLE: myCachePolicy,\n dangerouslyAllowMutability: options.dangerouslyAllowMutability,\n retainedBy_UNSTABLE: retainedBy\n });\n } else {\n newSelector = Recoil_selector({\n key: myKey,\n get: myGet,\n cachePolicy_UNSTABLE: myCachePolicy,\n dangerouslyAllowMutability: options.dangerouslyAllowMutability,\n retainedBy_UNSTABLE: retainedBy\n });\n }\n\n selectorCache.set(params, newSelector);\n setConfigDeletionHandler$3(newSelector.key, () => {\n selectorCache.delete(params);\n });\n return newSelector;\n };\n}\n/* eslint-enable no-redeclare */\n\n\nvar Recoil_selectorFamily = selectorFamily;\n\n// flowlint-next-line unclear-type:off\n\n\nconst constantSelector = Recoil_selectorFamily({\n key: '__constant',\n get: constant => () => constant,\n cachePolicyForParams_UNSTABLE: {\n equality: 'reference'\n }\n}); // Function that returns a selector which always produces the\n// same constant value. It may be called multiple times with the\n// same value, based on reference equality, and will provide the\n// same selector.\n\nfunction constSelector(constant) {\n return constantSelector(constant);\n}\n\nvar Recoil_constSelector = constSelector;\n\n// flowlint-next-line unclear-type:off\n\n\nconst throwingSelector = Recoil_selectorFamily({\n key: '__error',\n get: message => () => {\n throw Recoil_err(message);\n },\n // TODO Why?\n cachePolicyForParams_UNSTABLE: {\n equality: 'reference'\n }\n}); // Function that returns a selector which always throws an error\n// with the provided message.\n\nfunction errorSelector(message) {\n return throwingSelector(message);\n}\n\nvar Recoil_errorSelector = errorSelector;\n\n/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * Wraps another recoil value and prevents writing to it.\n *\n * \n * @format\n * @oncall recoil\n */\n\nfunction readOnlySelector(atom) {\n // flowlint-next-line unclear-type: off\n return atom;\n}\n\nvar Recoil_readOnlySelector = readOnlySelector;\n\nconst {\n loadableWithError: loadableWithError$3,\n loadableWithPromise: loadableWithPromise$3,\n loadableWithValue: loadableWithValue$4\n} = Recoil_Loadable$1;\n\n\n\n\n\n /////////////////\n// TRUTH TABLE\n/////////////////\n// Dependencies waitForNone waitForAny waitForAll waitForAllSettled\n// [loading, loading] [Promise, Promise] Promise Promise Promise\n// [value, loading] [value, Promise] [value, Promise] Promise Promise\n// [value, value] [value, value] [value, value] [value, value] [value, value]\n//\n// [error, loading] [Error, Promise] [Error, Promise] Error Promise\n// [error, error] [Error, Error] [Error, Error] Error [error, error]\n// [value, error] [value, Error] [value, Error] Error [value, error]\n// Issue parallel requests for all dependencies and return the current\n// status if they have results, have some error, or are still pending.\n\n\nfunction concurrentRequests(getRecoilValue, deps) {\n const results = Array(deps.length).fill(undefined);\n const exceptions = Array(deps.length).fill(undefined);\n\n for (const [i, dep] of deps.entries()) {\n try {\n results[i] = getRecoilValue(dep);\n } catch (e) {\n // exceptions can either be Promises of pending results or real errors\n exceptions[i] = e;\n }\n }\n\n return [results, exceptions];\n}\n\nfunction isError(exp) {\n return exp != null && !Recoil_isPromise(exp);\n}\n\nfunction unwrapDependencies(dependencies) {\n return Array.isArray(dependencies) ? dependencies : Object.getOwnPropertyNames(dependencies).map(key => dependencies[key]);\n}\n\nfunction wrapResults(dependencies,\n/* $FlowFixMe[missing-local-annot] The type annotation(s) required by Flow's\n * LTI update could not be added via codemod */\nresults) {\n return Array.isArray(dependencies) ? results : // Object.getOwnPropertyNames() has consistent key ordering with ES6\n Object.getOwnPropertyNames(dependencies).reduce((out, key, idx) => ({ ...out,\n [key]: results[idx]\n }), {});\n}\n\nfunction wrapLoadables(dependencies, results, exceptions) {\n const output = exceptions.map((exception, idx) => exception == null ? loadableWithValue$4(results[idx]) : Recoil_isPromise(exception) ? loadableWithPromise$3(exception) : loadableWithError$3(exception));\n return wrapResults(dependencies, output);\n}\n\nfunction combineAsyncResultsWithSyncResults(syncResults, asyncResults) {\n return asyncResults.map((result, idx) =>\n /**\n * it's important we use === undefined as opposed to == null, because the\n * resolved value of the async promise could be `null`, in which case we\n * don't want to use syncResults[idx], which would be undefined. If async\n * promise resolves to `undefined`, that's ok because `syncResults[idx]`\n * will also be `undefined`. That's a little hacky, but it works.\n */\n result === undefined ? syncResults[idx] : result);\n} // Selector that requests all dependencies in parallel and immediately returns\n// current results without waiting.\n\n\nconst waitForNone = Recoil_selectorFamily({\n key: '__waitForNone',\n get: dependencies => ({\n get\n }) => {\n // Issue requests for all dependencies in parallel.\n const deps = unwrapDependencies(dependencies);\n const [results, exceptions] = concurrentRequests(get, deps); // Always return the current status of the results; never block.\n\n return wrapLoadables(dependencies, results, exceptions);\n },\n dangerouslyAllowMutability: true\n}); // Selector that requests all dependencies in parallel and waits for at least\n// one to be available before returning results. It will only error if all\n// dependencies have errors.\n\nconst waitForAny = Recoil_selectorFamily({\n key: '__waitForAny',\n get: dependencies => ({\n get\n }) => {\n // Issue requests for all dependencies in parallel.\n // Exceptions can either be Promises of pending results or real errors\n const deps = unwrapDependencies(dependencies);\n const [results, exceptions] = concurrentRequests(get, deps); // If any results are available, value or error, return the current status\n\n if (exceptions.some(exp => !Recoil_isPromise(exp))) {\n return wrapLoadables(dependencies, results, exceptions);\n } // Otherwise, return a promise that will resolve when the next result is\n // available, whichever one happens to be next. But, if all pending\n // dependencies end up with errors, then reject the promise.\n\n\n return new Promise(resolve => {\n for (const [i, exp] of exceptions.entries()) {\n if (Recoil_isPromise(exp)) {\n exp.then(result => {\n results[i] = result;\n exceptions[i] = undefined;\n resolve(wrapLoadables(dependencies, results, exceptions));\n }).catch(error => {\n exceptions[i] = error;\n resolve(wrapLoadables(dependencies, results, exceptions));\n });\n }\n }\n });\n },\n dangerouslyAllowMutability: true\n}); // Selector that requests all dependencies in parallel and waits for all to be\n// available before returning a value. It will error if any dependencies error.\n\nconst waitForAll = Recoil_selectorFamily({\n key: '__waitForAll',\n get: dependencies => ({\n get\n }) => {\n // Issue requests for all dependencies in parallel.\n // Exceptions can either be Promises of pending results or real errors\n const deps = unwrapDependencies(dependencies);\n const [results, exceptions] = concurrentRequests(get, deps); // If all results are available, return the results\n\n if (exceptions.every(exp => exp == null)) {\n return wrapResults(dependencies, results);\n } // If we have any errors, throw the first error\n\n\n const error = exceptions.find(isError);\n\n if (error != null) {\n throw error;\n } // Otherwise, return a promise that will resolve when all results are available\n\n\n return Promise.all(exceptions).then(exceptionResults => wrapResults(dependencies, combineAsyncResultsWithSyncResults(results, exceptionResults)));\n },\n dangerouslyAllowMutability: true\n});\nconst waitForAllSettled = Recoil_selectorFamily({\n key: '__waitForAllSettled',\n get: dependencies => ({\n get\n }) => {\n // Issue requests for all dependencies in parallel.\n // Exceptions can either be Promises of pending results or real errors\n const deps = unwrapDependencies(dependencies);\n const [results, exceptions] = concurrentRequests(get, deps); // If all results are available, return the results\n\n if (exceptions.every(exp => !Recoil_isPromise(exp))) {\n return wrapLoadables(dependencies, results, exceptions);\n } // Wait for all results to settle\n\n\n return Promise.all(exceptions.map((exp, i) => Recoil_isPromise(exp) ? exp.then(result => {\n results[i] = result;\n exceptions[i] = undefined;\n }).catch(error => {\n results[i] = undefined;\n exceptions[i] = error;\n }) : null)) // Then wrap them as loadables\n .then(() => wrapLoadables(dependencies, results, exceptions));\n },\n dangerouslyAllowMutability: true\n});\nconst noWait = Recoil_selectorFamily({\n key: '__noWait',\n get: dependency => ({\n get\n }) => {\n try {\n return Recoil_selector.value(loadableWithValue$4(get(dependency)));\n } catch (exception) {\n return Recoil_selector.value(Recoil_isPromise(exception) ? loadableWithPromise$3(exception) : loadableWithError$3(exception));\n }\n },\n dangerouslyAllowMutability: true\n});\nvar Recoil_WaitFor = {\n waitForNone,\n waitForAny,\n waitForAll,\n waitForAllSettled,\n noWait\n};\n\nconst {\n RecoilLoadable\n} = Recoil_Loadable$1;\n\nconst {\n DefaultValue: DefaultValue$3\n} = Recoil_Node;\n\nconst {\n RecoilRoot: RecoilRoot$2,\n useRecoilStoreID: useRecoilStoreID$1\n} = Recoil_RecoilRoot;\n\nconst {\n isRecoilValue: isRecoilValue$5\n} = Recoil_RecoilValue$1;\n\nconst {\n retentionZone: retentionZone$1\n} = Recoil_RetentionZone;\n\nconst {\n freshSnapshot: freshSnapshot$2\n} = Recoil_Snapshot$1;\n\nconst {\n useRecoilState: useRecoilState$1,\n useRecoilState_TRANSITION_SUPPORT_UNSTABLE: useRecoilState_TRANSITION_SUPPORT_UNSTABLE$1,\n useRecoilStateLoadable: useRecoilStateLoadable$1,\n useRecoilValue: useRecoilValue$1,\n useRecoilValue_TRANSITION_SUPPORT_UNSTABLE: useRecoilValue_TRANSITION_SUPPORT_UNSTABLE$1,\n useRecoilValueLoadable: useRecoilValueLoadable$1,\n useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE: useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE$1,\n useResetRecoilState: useResetRecoilState$1,\n useSetRecoilState: useSetRecoilState$1\n} = Recoil_Hooks;\n\nconst {\n useGotoRecoilSnapshot: useGotoRecoilSnapshot$1,\n useRecoilSnapshot: useRecoilSnapshot$1,\n useRecoilTransactionObserver: useRecoilTransactionObserver$1\n} = Recoil_SnapshotHooks;\n\n\n\n\n\nconst {\n useRecoilCallback: useRecoilCallback$1\n} = Recoil_useRecoilCallback;\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nconst {\n noWait: noWait$1,\n waitForAll: waitForAll$1,\n waitForAllSettled: waitForAllSettled$1,\n waitForAny: waitForAny$1,\n waitForNone: waitForNone$1\n} = Recoil_WaitFor;\n\n\n\nvar Recoil_index = {\n // Types\n DefaultValue: DefaultValue$3,\n isRecoilValue: isRecoilValue$5,\n RecoilLoadable,\n // Global Recoil environment settiongs\n RecoilEnv: Recoil_RecoilEnv,\n // Recoil Root\n RecoilRoot: RecoilRoot$2,\n useRecoilStoreID: useRecoilStoreID$1,\n useRecoilBridgeAcrossReactRoots_UNSTABLE: Recoil_useRecoilBridgeAcrossReactRoots,\n // Atoms/Selectors\n atom: Recoil_atom,\n selector: Recoil_selector,\n // Convenience Atoms/Selectors\n atomFamily: Recoil_atomFamily,\n selectorFamily: Recoil_selectorFamily,\n constSelector: Recoil_constSelector,\n errorSelector: Recoil_errorSelector,\n readOnlySelector: Recoil_readOnlySelector,\n // Concurrency Helpers for Atoms/Selectors\n noWait: noWait$1,\n waitForNone: waitForNone$1,\n waitForAny: waitForAny$1,\n waitForAll: waitForAll$1,\n waitForAllSettled: waitForAllSettled$1,\n // Hooks for Atoms/Selectors\n useRecoilValue: useRecoilValue$1,\n useRecoilValueLoadable: useRecoilValueLoadable$1,\n useRecoilState: useRecoilState$1,\n useRecoilStateLoadable: useRecoilStateLoadable$1,\n useSetRecoilState: useSetRecoilState$1,\n useResetRecoilState: useResetRecoilState$1,\n useGetRecoilValueInfo_UNSTABLE: Recoil_useGetRecoilValueInfo,\n useRecoilRefresher_UNSTABLE: Recoil_useRecoilRefresher,\n useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE: useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE$1,\n useRecoilValue_TRANSITION_SUPPORT_UNSTABLE: useRecoilValue_TRANSITION_SUPPORT_UNSTABLE$1,\n useRecoilState_TRANSITION_SUPPORT_UNSTABLE: useRecoilState_TRANSITION_SUPPORT_UNSTABLE$1,\n // Hooks for complex operations\n useRecoilCallback: useRecoilCallback$1,\n useRecoilTransaction_UNSTABLE: Recoil_useRecoilTransaction,\n // Snapshots\n useGotoRecoilSnapshot: useGotoRecoilSnapshot$1,\n useRecoilSnapshot: useRecoilSnapshot$1,\n useRecoilTransactionObserver_UNSTABLE: useRecoilTransactionObserver$1,\n snapshot_UNSTABLE: freshSnapshot$2,\n // Memory Management\n useRetain: Recoil_useRetain,\n retentionZone: retentionZone$1\n};\nvar Recoil_index_1 = Recoil_index.DefaultValue;\nvar Recoil_index_2 = Recoil_index.isRecoilValue;\nvar Recoil_index_3 = Recoil_index.RecoilLoadable;\nvar Recoil_index_4 = Recoil_index.RecoilEnv;\nvar Recoil_index_5 = Recoil_index.RecoilRoot;\nvar Recoil_index_6 = Recoil_index.useRecoilStoreID;\nvar Recoil_index_7 = Recoil_index.useRecoilBridgeAcrossReactRoots_UNSTABLE;\nvar Recoil_index_8 = Recoil_index.atom;\nvar Recoil_index_9 = Recoil_index.selector;\nvar Recoil_index_10 = Recoil_index.atomFamily;\nvar Recoil_index_11 = Recoil_index.selectorFamily;\nvar Recoil_index_12 = Recoil_index.constSelector;\nvar Recoil_index_13 = Recoil_index.errorSelector;\nvar Recoil_index_14 = Recoil_index.readOnlySelector;\nvar Recoil_index_15 = Recoil_index.noWait;\nvar Recoil_index_16 = Recoil_index.waitForNone;\nvar Recoil_index_17 = Recoil_index.waitForAny;\nvar Recoil_index_18 = Recoil_index.waitForAll;\nvar Recoil_index_19 = Recoil_index.waitForAllSettled;\nvar Recoil_index_20 = Recoil_index.useRecoilValue;\nvar Recoil_index_21 = Recoil_index.useRecoilValueLoadable;\nvar Recoil_index_22 = Recoil_index.useRecoilState;\nvar Recoil_index_23 = Recoil_index.useRecoilStateLoadable;\nvar Recoil_index_24 = Recoil_index.useSetRecoilState;\nvar Recoil_index_25 = Recoil_index.useResetRecoilState;\nvar Recoil_index_26 = Recoil_index.useGetRecoilValueInfo_UNSTABLE;\nvar Recoil_index_27 = Recoil_index.useRecoilRefresher_UNSTABLE;\nvar Recoil_index_28 = Recoil_index.useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE;\nvar Recoil_index_29 = Recoil_index.useRecoilValue_TRANSITION_SUPPORT_UNSTABLE;\nvar Recoil_index_30 = Recoil_index.useRecoilState_TRANSITION_SUPPORT_UNSTABLE;\nvar Recoil_index_31 = Recoil_index.useRecoilCallback;\nvar Recoil_index_32 = Recoil_index.useRecoilTransaction_UNSTABLE;\nvar Recoil_index_33 = Recoil_index.useGotoRecoilSnapshot;\nvar Recoil_index_34 = Recoil_index.useRecoilSnapshot;\nvar Recoil_index_35 = Recoil_index.useRecoilTransactionObserver_UNSTABLE;\nvar Recoil_index_36 = Recoil_index.snapshot_UNSTABLE;\nvar Recoil_index_37 = Recoil_index.useRetain;\nvar Recoil_index_38 = Recoil_index.retentionZone;\n\nexport default Recoil_index;\nexport { Recoil_index_1 as DefaultValue, Recoil_index_4 as RecoilEnv, Recoil_index_3 as RecoilLoadable, Recoil_index_5 as RecoilRoot, Recoil_index_8 as atom, Recoil_index_10 as atomFamily, Recoil_index_12 as constSelector, Recoil_index_13 as errorSelector, Recoil_index_2 as isRecoilValue, Recoil_index_15 as noWait, Recoil_index_14 as readOnlySelector, Recoil_index_38 as retentionZone, Recoil_index_9 as selector, Recoil_index_11 as selectorFamily, Recoil_index_36 as snapshot_UNSTABLE, Recoil_index_26 as useGetRecoilValueInfo_UNSTABLE, Recoil_index_33 as useGotoRecoilSnapshot, Recoil_index_7 as useRecoilBridgeAcrossReactRoots_UNSTABLE, Recoil_index_31 as useRecoilCallback, Recoil_index_27 as useRecoilRefresher_UNSTABLE, Recoil_index_34 as useRecoilSnapshot, Recoil_index_22 as useRecoilState, Recoil_index_23 as useRecoilStateLoadable, Recoil_index_30 as useRecoilState_TRANSITION_SUPPORT_UNSTABLE, Recoil_index_6 as useRecoilStoreID, Recoil_index_35 as useRecoilTransactionObserver_UNSTABLE, Recoil_index_32 as useRecoilTransaction_UNSTABLE, Recoil_index_20 as useRecoilValue, Recoil_index_21 as useRecoilValueLoadable, Recoil_index_28 as useRecoilValueLoadable_TRANSITION_SUPPORT_UNSTABLE, Recoil_index_29 as useRecoilValue_TRANSITION_SUPPORT_UNSTABLE, Recoil_index_25 as useResetRecoilState, Recoil_index_37 as useRetain, Recoil_index_24 as useSetRecoilState, Recoil_index_18 as waitForAll, Recoil_index_19 as waitForAllSettled, Recoil_index_17 as waitForAny, Recoil_index_16 as waitForNone };\n","import { atom } from \"recoil\";\r\n\r\nexport let idxAtom = atom({\r\n key: \"idxAtom\", // unique ID (with respect to other atoms/selectors)\r\n default: 0, // default value (aka initial value)\r\n});\r\n","import { atom } from \"recoil\";\r\n\r\nexport let ClickedAtom = atom({\r\n key: \"ClickedAtom\", // unique ID (with respect to other atoms/selectors)\r\n default: {}, // default value (aka initial value)\r\n});\r\n","import React from \"react\";\r\nimport \"./musicList.css\";\r\nimport SongsList from \"../../listOfSongs\";\r\nimport { idxAtom } from \"../recoil/idxAtom\";\r\nimport { useRecoilState } from \"recoil\";\r\nimport { ClickedAtom } from \"../recoil/clcikedAtom\";\r\nexport const MusicList = () => {\r\n const [recIdx, setRecIdx] = useRecoilState(idxAtom);\r\n const [currentMusic, setCurrentMusic] = useRecoilState(ClickedAtom);\r\n let showList = SongsList.map((el, idx) => {\r\n return (\r\n {\r\n setRecIdx(idx);\r\n setCurrentMusic({\r\n audio: el.audio,\r\n pic: el.pic,\r\n text: el.text,\r\n active: true,\r\n });\r\n }}\r\n key={idx}\r\n data-id={idx}\r\n className={`item ${idx === recIdx ? \"active\" : \"notactive\"}`}\r\n >\r\n \r\n \r\n
{el.text}
\r\n
محمد صديق المنشاوي
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
1 ? clonedList[idx].pic : clonedList.pic}\r\n alt=\"Album Art\"\r\n />\r\n \r\n
1 ? clonedList[idx].pic : clonedList.pic}\r\n alt=\"Album Art\"\r\n />\r\n \r\n
1 ? clonedList[idx].audio : clonedList.audio}\r\n />\r\n \r\n {clonedList.length > 1 ? clonedList[idx].text : clonedList.text}\r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
00:00
\r\n
\r\n \r\n
\r\n
00:00
\r\n