4e:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 4f:T102a,import { createContext, createElement, type ReactNode, useContext, useLayoutEffect, useState, useSyncExternalStore, } from "react"; type Listener = () => void; export type SlotRegistry = { delete: (name: Name) => void; get: (name: Name) => ReactNode; has: (name: Name) => boolean; set: (name: Name, node: ReactNode) => void; subscribe: (name: Name, listener: Listener) => () => void; subscribePresence: (name: Name, listener: Listener) => () => void; }; type FillProps = { name: Name; children?: ReactNode; passthrough?: boolean; }; type OutletProps = { name: Name; }; type ProviderProps = { children: ReactNode; }; const notify = (listeners: Set | undefined) => { if (!listeners) { return; } for (const listener of listeners) { listener(); } }; export const createSlotRegistry = < Name extends string = string, >(): SlotRegistry => { const nodes = new Map(); const nodeListeners = new Map>(); const presenceListeners = new Map>(); const getListeners = (map: Map>, name: Name) => { let listeners = map.get(name); if (!listeners) { listeners = new Set(); map.set(name, listeners); } return listeners; }; return { delete: (name) => { if (!nodes.has(name)) { return; } nodes.delete(name); notify(nodeListeners.get(name)); notify(presenceListeners.get(name)); }, get: (name) => nodes.get(name) ?? null, has: (name) => nodes.has(name), set: (name, node) => { const existed = nodes.has(name); if (existed && Object.is(nodes.get(name), node)) { return; } nodes.set(name, node); notify(nodeListeners.get(name)); if (!existed) { notify(presenceListeners.get(name)); } }, subscribe: (name, listener) => { const listeners = getListeners(nodeListeners, name); listeners.add(listener); return () => { listeners.delete(listener); }; }, subscribePresence: (name, listener) => { const listeners = getListeners(presenceListeners, name); listeners.add(listener); return () => { listeners.delete(listener); }; }, }; }; export const createSlots = (options?: { errorMessage?: string; }) => { const SlotsContext = createContext | null>(null); const errorMessage = options?.errorMessage ?? "Slot components must be rendered inside Provider"; const useRegistry = () => { const registry = useContext(SlotsContext); if (!registry) { throw new Error(errorMessage); } return registry; }; const Provider = ({ children }: ProviderProps) => { const [registry] = useState(() => createSlotRegistry()); return createElement(SlotsContext.Provider, { value: registry }, children); }; const Fill = ({ name, children, passthrough = false }: FillProps) => { const registry = useRegistry(); useLayoutEffect(() => { registry.set(name, children); return () => { registry.delete(name); }; }, [children, name, registry]); return passthrough ? children : null; }; const useSlot = (name: Name) => { const registry = useRegistry(); return useSyncExternalStore( (onStoreChange) => registry.subscribe(name, onStoreChange), () => registry.get(name), () => registry.get(name) ); }; const Outlet = ({ name }: OutletProps) => useSlot(name); const useHasSlot = (name: Name) => { const registry = useRegistry(); return useSyncExternalStore( (onStoreChange) => registry.subscribePresence(name, onStoreChange), () => registry.has(name), () => registry.has(name) ); }; Provider.displayName = "SlotProvider"; Fill.displayName = "SlotFill"; Outlet.displayName = "SlotOutlet"; return { Fill, Outlet, Provider, useHasSlot, useRegistry, useSlot, }; }; 4d:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[null,["$","$L4e",null,{"files":[{"path":"lib/slots.ts","content":"$4f","type":"registry:lib","target":"@lib/slots.ts"}],"className":"h-[70svh] min-h-80"}]]}]