Hottest Contracts (Highest Volume)

{#each volumeList as item, index} {/each}

{item?.option_type === "C" ? "Call" : "Put"} handleViewData(item)} on:mouseover={() => getContractHistory(item?.option_symbol)} class="px-2 sm:px-0 cursor-pointer text-[#04D9FF] sm:hover:text-white sm:hover:underline sm:hover:underline-offset-4" > {item?.strike_price} {" " + item?.date_expiration}	{item?.dte}	{item?.otm}%	{item?.last ?? "n/a"}	{#if item?.low && item?.high} {item?.low}-{item?.high} {:else} n/a {/if}	{item?.volume?.toLocaleString("en-US")}	{item?.open_interest?.toLocaleString("en-US")}	{#if item?.changeOI >= 0} +{item?.changeOI?.toLocaleString("en-US")} {:else if item?.changeOI < 0} {item?.changeOI?.toLocaleString("en-US")} {:else} n/a {/if}	{item?.iv ? item?.iv + "%" : "n/a"}	{@html abbreviateNumberWithColor( item?.total_premium, false, true, )}

Highest OI Contracts

{#each openInterestList as item, index} {/each}

{item?.option_type === "C" ? "Call" : "Put"} handleViewData(item)} on:mouseover={() => getContractHistory(item?.option_symbol)} class="cursor-pointer text-[#04D9FF] sm:hover:text-white sm:hover:underline sm:hover:underline-offset-4" > {item?.strike_price} {" " + item?.date_expiration}	{item?.dte}	{item?.otm}%	{item?.last ?? "n/a"}	{#if item?.low && item?.high} {item?.low}-{item?.high} {:else} n/a {/if}	{item?.volume?.toLocaleString("en-US")}	{item?.open_interest?.toLocaleString("en-US")}	{#if item?.changeOI >= 0} +{item?.changeOI?.toLocaleString("en-US")} {:else if item?.changeOI < 0} {item?.changeOI?.toLocaleString("en-US")} {:else} n/a {/if}	{item?.iv ? item?.iv + "%" : "n/a"}	{@html abbreviateNumberWithColor( item?.total_premium, false, true, )}

{#if rawDataHistory?.length > 0}

{formatDate(optionHistoryList?.at(0)?.date)}:

Vol: {optionHistoryList?.at(0)?.volume?.toLocaleString("en-US")}

OI: {optionHistoryList?.at(0)?.open_interest?.toLocaleString("en-US")}

Avg: ${optionHistoryList?.at(0)?.mark}

Prem: {abbreviateNumber(optionHistoryList?.at(0)?.total_premium, true)}

IV: {(optionHistoryList?.at(0)?.implied_volatility * 100)?.toLocaleString( "en-US", )}%

{#each ["Vol/OI", "IV"] as item} (selectGraphType = item)} class="px-3 py-1.5 {selectGraphType === item ? 'bg-white text-black ' : 'text-white bg-default text-opacity-[0.6] border border-gray-600'} transition ease-out duration-100 sm:hover:bg-white sm:hover:text-black rounded-md cursor-pointer" > {item} {/each}

{#if isLoaded} {#each optionHistoryList as item} {/each}

Date	Vol	OI	OI Change	% Change OI	Last Price	Avg Price	IV	Total Prem	GEX	DEX
{formatDate(item?.date)}	{item?.volume !== null ? item?.volume?.toLocaleString("en-US") : 0}	{item?.open_interest !== undefined ? item?.open_interest?.toLocaleString("en-US") : "n/a"}	{#if item?.changeOI >= 0 && item?.changeOI !== null} +{item?.changeOI?.toLocaleString("en-US")} {:else if item?.changeOI < 0 && item?.changeOI !== null} {item?.changeOI?.toLocaleString("en-US")} {:else} n/a {/if}	{#if item?.changesPercentageOI > 0 && item?.changesPercentageOI !== undefined} +{item?.changesPercentageOI + "%"} {:else if item?.changesPercentageOI < 0 && item?.changesPercentageOI !== undefined} {item?.changesPercentageOI + "%"} {:else if item?.changesPercentageOI === 0 && item?.changesPercentageOI !== undefined} 0% {:else} n/a {/if}	{item?.close}	{item?.mark}	{(item?.implied_volatility * 100)?.toLocaleString( "en-US", ) + "%"}	{@html abbreviateNumberWithColor( item?.total_premium, false, true, )}	{@html abbreviateNumberWithColor(item?.gex, false, true)}	{@html abbreviateNumberWithColor(item?.dex, false, true)}

{:else}

{/if}

{:else}

No historical data available yet for the given contract

{/if}