{"version":3,"sources":["../../src/runtime/index.tsx"],"sourcesContent":["import Button from '@mui/material/Button';\nimport * as React from 'react';\nimport * as ReactDOM from 'react-dom/client';\nimport { ToolpadComponents } from '@mui/toolpad-core';\nimport { Emitter } from '@mui/toolpad-utils/events';\nimport createCache from '@emotion/cache';\nimport { CacheProvider } from '@emotion/react';\nimport RuntimeToolpadApp, { ToolpadAppProps } from './ToolpadApp';\nimport { RuntimeState } from '../types';\n\nlet componentsStore: ToolpadComponents = {};\nconst events = new Emitter<{ update: {} }>();\n\nconst cache = createCache({\n  key: 'css',\n  prepend: true,\n});\n\n// See https://github.com/emotion-js/emotion/issues/1105#issuecomment-1058225197\ncache.compat = true;\n\n/**\n * This allows us to hot update the components when a file is added/removed\n */\nexport function setComponents(newComponents: ToolpadComponents) {\n  componentsStore = newComponents;\n  events.emit('update', {});\n}\n\nconst subscribe = (cb: () => void) => events.subscribe('update', cb);\nconst getSnapshot = () => componentsStore;\n\nfunction useComponents() {\n  return React.useSyncExternalStore(subscribe, getSnapshot);\n}\n\nexport interface RootProps {\n  initialState: RuntimeState;\n  base: string;\n  ToolpadApp: React.ComponentType<ToolpadAppProps>;\n}\n\nfunction Root({ ToolpadApp, initialState, base }: RootProps) {\n  const components = useComponents();\n  const loadComponents = React.useMemo(() => async () => components, [components]);\n  return (\n    <React.StrictMode>\n      <CacheProvider value={cache}>\n        {/* For some reason this helps with https://github.com/vitejs/vite/issues/12423 */}\n        <Button sx={{ display: 'none' }} />\n        <ToolpadApp basename={base} state={initialState} loadComponents={loadComponents} />\n      </CacheProvider>\n    </React.StrictMode>\n  );\n}\n\nexport interface InitParams {\n  initialState: RuntimeState;\n  base: string;\n  ToolpadApp?: React.ComponentType<ToolpadAppProps>;\n}\n\nexport function init({ ToolpadApp = RuntimeToolpadApp, initialState, base }: InitParams) {\n  ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(\n    <Root base={base} ToolpadApp={ToolpadApp} initialState={initialState} />,\n  );\n}\n"],"mappings":";;;;;AAAA,OAAO,YAAY;AACnB,YAAY,WAAW;AACvB,YAAY,cAAc;AAE1B,SAAS,eAAe;AACxB,OAAO,iBAAiB;AACxB,SAAS,qBAAqB;AAI9B,IAAI,kBAAqC,CAAC;AAC1C,IAAM,SAAS,IAAI,QAAwB;AAE3C,IAAM,QAAQ,YAAY;AAAA,EACxB,KAAK;AAAA,EACL,SAAS;AACX,CAAC;AAGD,MAAM,SAAS;AAKR,SAAS,cAAc,eAAkC;AAC9D,oBAAkB;AAClB,SAAO,KAAK,UAAU,CAAC,CAAC;AAC1B;AAEA,IAAM,YAAY,CAAC,OAAmB,OAAO,UAAU,UAAU,EAAE;AACnE,IAAM,cAAc,MAAM;AAE1B,SAAS,gBAAgB;AACvB,SAAa,2BAAqB,WAAW,WAAW;AAC1D;AAQA,SAAS,KAAK,EAAE,YAAAA,aAAY,cAAc,KAAK,GAAc;AAC3D,QAAM,aAAa,cAAc;AACjC,QAAM,iBAAuB,cAAQ,MAAM,YAAY,YAAY,CAAC,UAAU,CAAC;AAC/E,SACE,oCAAO,kBAAN,MACC,oCAAC,iBAAc,OAAO,SAEpB,oCAAC,UAAO,IAAI,EAAE,SAAS,OAAO,GAAG,GACjC,oCAACA,aAAA,EAAW,UAAU,MAAM,OAAO,cAAc,gBAAgC,CACnF,CACF;AAEJ;AAQO,SAAS,KAAK,EAAE,YAAAA,cAAa,YAAmB,cAAc,KAAK,GAAe;AACvF,EAAS,oBAAW,SAAS,eAAe,MAAM,CAAgB,EAAE;AAAA,IAClE,oCAAC,QAAK,MAAY,YAAYA,aAAY,cAA4B;AAAA,EACxE;AACF;","names":["ToolpadApp"]}