{"version":3,"file":"bubbles.aad4c783.js","mappings":"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","sources":["webpack://@finviz/website/./js/app/bubbles/constants/settings.ts","webpack://@finviz/website/./js/app/bubbles/bubbles.tsx"],"sourcesContent":["import tailwindColors from '../../../../../config/colors'\r\nimport { alphaToHex } from '../../../main/components/color-picker'\r\n\r\nexport interface BubbleSettings {\r\n  margin: { top: number; right: number; bottom: number; left: number }\r\n  background: string\r\n  grid: string\r\n  axis: {\r\n    stroke: string\r\n    text: string\r\n  }\r\n  bubble: {\r\n    color?: string\r\n    textShadow?: string\r\n    stroke: string\r\n    fill: string\r\n  }\r\n  color?: string\r\n  textShadow?: string\r\n  slider: {\r\n    stroke: string\r\n    highlightStroke: string\r\n    highlight: string\r\n    distributionHighligt: (opacity: number) => string\r\n    distribution: (opacity: number) => string\r\n  }\r\n  colorPalette?: string[]\r\n}\r\n\r\nexport const BUBBLES_SETTINGS: BubbleSettings = {\r\n  margin: { top: 20, right: 25, bottom: 30, left: 50 },\r\n  background: tailwindColors.finviz['blue-gray'],\r\n  grid: '#8a95b126',\r\n  axis: {\r\n    stroke: '#8a95b1',\r\n    text: '#8a95b1',\r\n  },\r\n  bubble: {\r\n    textShadow: '#0006',\r\n    stroke: 'rgba(255,255,255,0.25)',\r\n    fill: 'rgba(255,255,255,0.1)',\r\n  },\r\n  textShadow: '#000000b3',\r\n  slider: {\r\n    stroke: '#404553',\r\n    highlightStroke: '#ffd61480',\r\n    highlight: '#ffd61426',\r\n    distributionHighligt: (opacity) => `#ffd614${alphaToHex(opacity)}`,\r\n    distribution: (opacity) => `#ffffff${alphaToHex(opacity)}`,\r\n  },\r\n}\r\n","import * as React from 'react'\r\nimport ReactDOM from 'react-dom'\r\n\r\nimport { Paragraph } from '../../main/components'\r\nimport { Button } from '../../main/components/button'\r\nimport { Topbar } from '../maps/components/Topbar'\r\nimport { QueryClientContext } from '../shared/components/QueryClientContext'\r\nimport { Share } from './Share'\r\nimport BubbleActionCreators from './actions/bubbleActionCreators'\r\nimport { BubbleChart } from './bubbleChart'\r\nimport BubblesHover from './bubblesHover'\r\nimport { BUBBLES_SETTINGS } from './constants/settings'\r\nimport { Presets } from './presets'\r\nimport { ETF_INDUSTRY_IDS, ETF_SECTOR_VALUE, MARKET_CAP_VALUE } from './selects'\r\nimport { SidebarContent } from './sidebar'\r\nimport { BubblesLoadParam } from './types'\r\nimport { decodeQueryString, encodeQueryString } from './utils'\r\n\r\nconst linkClassName = 'text-link hover:text-gray-50'\r\n\r\nfunction Bubbles() {\r\n  const queryString = decodeQueryString(true)\r\n  const hasETFsEnabled =\r\n    // Index isn’t set\r\n    queryString.idx === 'any' &&\r\n    // Sector isn’t set or is specifically set to financial sector\r\n    (!queryString.ind || queryString.ind === 'any' || ETF_INDUSTRY_IDS.includes(queryString.ind)) &&\r\n    // Industry isn’t set or is specifically set to an ETF industry\r\n    (!queryString.sec || queryString.sec === 'any' || queryString.sec === ETF_SECTOR_VALUE)\r\n\r\n  const onChange = React.useRef((values: any) => {\r\n    let query = encodeQueryString(values)\r\n\r\n    if (query.length) query = `?${query}`\r\n\r\n    document.location.href = `/bubbles.ashx${query}`\r\n  }).current\r\n\r\n  return (\r\n    <div>\r\n      <Topbar\r\n        className=\"border-finviz-blue-gray bg-[#363a46] text-[#94a3b8] shadow\"\r\n        navContent={\r\n          <>\r\n            <h2 className=\"m-0 text-2xs uppercase opacity-50\">View</h2>\r\n            <Button as=\"a\" href=\"/map.ashx\" leftContent=\"chartTreemap\" theme=\"transparent\" className={linkClassName}>\r\n              Map\r\n            </Button>\r\n            <Button as=\"a\" href=\"/bubbles.ashx\" leftContent=\"chartBubble\" theme=\"transparent\" className=\"text-gray-50\">\r\n              Bubbles\r\n            </Button>\r\n          </>\r\n        }\r\n        mapControls={\r\n          <div className=\"pr-2\">\r\n            <Share extendedFilters className={linkClassName} />\r\n          </div>\r\n        }\r\n      >\r\n        {hasETFsEnabled && queryString.size === MARKET_CAP_VALUE && (\r\n          <Paragraph size=\"small\" className=\"leading-tight\">\r\n            ETF size represents assets under management.\r\n          </Paragraph>\r\n        )}\r\n      </Topbar>\r\n      <div className=\"bubbles-container\">\r\n        <div className=\"sidebar w-[200px]\">\r\n          <div className=\"mb-0.5 bg-[#404553] p-5 pt-3\">\r\n            <div className=\"border-b border-gray-700\">\r\n              <div className=\"-mx-2 mb-1 flex items-center justify-between py-1\">\r\n                <Presets isDark className={linkClassName} />\r\n                <Button theme=\"transparent\" className={linkClassName} onClick={() => onChange({})}>\r\n                  Reset\r\n                </Button>\r\n              </div>\r\n            </div>\r\n            <SidebarContent\r\n              hasETFs={hasETFsEnabled}\r\n              extendedFilters\r\n              selected={queryString}\r\n              onChange={onChange}\r\n              linkClassName={linkClassName}\r\n            />\r\n          </div>\r\n        </div>\r\n        <div className=\"flex flex-1 flex-col\">\r\n          <div id=\"map\">\r\n            <div id=\"body\" className=\"relative\">\r\n              <BubbleChart settings={BUBBLES_SETTINGS} />\r\n              <BubblesHover\r\n                labelX={queryString['x']}\r\n                labelY={queryString['y']}\r\n                labelSize={queryString['size']}\r\n                labelColor={queryString['color']}\r\n              />\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nwindow['FinvizInitBubbles'] = function () {\r\n  BubbleActionCreators.load('/api/bubbles.ashx', decodeQueryString(true) as unknown as BubblesLoadParam)\r\n  ReactDOM.render(\r\n    <QueryClientContext>\r\n      <Bubbles />\r\n    </QueryClientContext>,\r\n    document.getElementById('bubbles')\r\n  )\r\n}\r\n"],"names":["BUBBLES_SETTINGS","margin","top","right","bottom","left","background","tailwindColors","grid","axis","stroke","text","bubble","textShadow","fill","slider","highlightStroke","highlight","distributionHighligt","opacity","concat","alphaToHex","distribution","linkClassName","Bubbles","queryString","decodeQueryString","hasETFsEnabled","idx","ind","ETF_INDUSTRY_IDS","includes","sec","ETF_SECTOR_VALUE","onChange","React","values","query","encodeQueryString","length","document","location","href","current","_jsxs","children","_jsx","Topbar","className","navContent","_Fragment","Button","as","leftContent","theme","mapControls","Share","extendedFilters","size","MARKET_CAP_VALUE","Paragraph","Presets","isDark","onClick","SidebarContent","hasETFs","selected","id","BubbleChart","settings","BubblesHover","labelX","labelY","labelSize","labelColor","window","BubbleActionCreators","load","ReactDOM","QueryClientContext","getElementById"],"sourceRoot":""}