@refinedev/devtools 1.1.37 → 1.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (72) hide show
  1. package/dist/components/apply-styles.d.cts +6 -0
  2. package/dist/components/apply-styles.d.cts.map +1 -0
  3. package/dist/components/apply-styles.d.mts +6 -0
  4. package/dist/components/apply-styles.d.mts.map +1 -0
  5. package/dist/components/apply-styles.d.ts +6 -0
  6. package/dist/components/apply-styles.d.ts.map +1 -0
  7. package/dist/components/devtools-pin.d.cts +4 -2
  8. package/dist/components/devtools-pin.d.cts.map +1 -1
  9. package/dist/components/devtools-pin.d.mts +4 -2
  10. package/dist/components/devtools-pin.d.mts.map +1 -1
  11. package/dist/components/devtools-pin.d.ts +4 -2
  12. package/dist/components/devtools-pin.d.ts.map +1 -1
  13. package/dist/components/devtools-selector.d.cts +3 -2
  14. package/dist/components/devtools-selector.d.cts.map +1 -1
  15. package/dist/components/devtools-selector.d.mts +3 -2
  16. package/dist/components/devtools-selector.d.mts.map +1 -1
  17. package/dist/components/devtools-selector.d.ts +3 -2
  18. package/dist/components/devtools-selector.d.ts.map +1 -1
  19. package/dist/components/icons/selector-button.d.cts +1 -0
  20. package/dist/components/icons/selector-button.d.cts.map +1 -1
  21. package/dist/components/icons/selector-button.d.mts +1 -0
  22. package/dist/components/icons/selector-button.d.mts.map +1 -1
  23. package/dist/components/icons/selector-button.d.ts +1 -0
  24. package/dist/components/icons/selector-button.d.ts.map +1 -1
  25. package/dist/components/selectable-elements.d.cts +8 -0
  26. package/dist/components/selectable-elements.d.cts.map +1 -0
  27. package/dist/components/selectable-elements.d.mts +8 -0
  28. package/dist/components/selectable-elements.d.mts.map +1 -0
  29. package/dist/components/selectable-elements.d.ts +8 -0
  30. package/dist/components/selectable-elements.d.ts.map +1 -0
  31. package/dist/index.cjs +94 -2
  32. package/dist/index.cjs.map +1 -1
  33. package/dist/index.d.cts +2 -2
  34. package/dist/index.d.cts.map +1 -1
  35. package/dist/index.d.mts +2 -2
  36. package/dist/index.d.mts.map +1 -1
  37. package/dist/index.d.ts +2 -2
  38. package/dist/index.d.ts.map +1 -1
  39. package/dist/index.mjs +94 -2
  40. package/dist/index.mjs.map +1 -1
  41. package/dist/panel.d.cts.map +1 -1
  42. package/dist/panel.d.mts.map +1 -1
  43. package/dist/panel.d.ts.map +1 -1
  44. package/dist/utilities/use-selector.d.cts +6 -7
  45. package/dist/utilities/use-selector.d.cts.map +1 -1
  46. package/dist/utilities/use-selector.d.mts +6 -7
  47. package/dist/utilities/use-selector.d.mts.map +1 -1
  48. package/dist/utilities/use-selector.d.ts +6 -7
  49. package/dist/utilities/use-selector.d.ts.map +1 -1
  50. package/package.json +5 -4
  51. package/src/components/apply-styles.tsx +19 -0
  52. package/src/components/devtools-pin.tsx +37 -26
  53. package/src/components/devtools-selector.tsx +34 -76
  54. package/src/components/icons/selector-button.tsx +18 -0
  55. package/src/components/selectable-elements.tsx +255 -0
  56. package/src/index.ts +2 -2
  57. package/src/panel.tsx +13 -2
  58. package/src/utilities/use-selector.tsx +74 -183
  59. package/dist/components/selector-box.d.cts +0 -8
  60. package/dist/components/selector-box.d.cts.map +0 -1
  61. package/dist/components/selector-box.d.mts +0 -8
  62. package/dist/components/selector-box.d.mts.map +0 -1
  63. package/dist/components/selector-box.d.ts +0 -8
  64. package/dist/components/selector-box.d.ts.map +0 -1
  65. package/dist/components/selector-hint.d.cts +0 -4
  66. package/dist/components/selector-hint.d.cts.map +0 -1
  67. package/dist/components/selector-hint.d.mts +0 -4
  68. package/dist/components/selector-hint.d.mts.map +0 -1
  69. package/dist/components/selector-hint.d.ts +0 -4
  70. package/dist/components/selector-hint.d.ts.map +0 -1
  71. package/src/components/selector-box.tsx +0 -107
  72. package/src/components/selector-hint.tsx +0 -57
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/panel.tsx","../src/components/devtools-pin.tsx","../src/components/devtools-selector.tsx","../src/utilities/use-selector.tsx","../src/components/selector-box.tsx","../src/components/icons/arrow-union-icon.tsx","../src/components/selector-hint.tsx","../src/components/icons/devtools-icon.tsx","../src/components/icons/selector-button.tsx","../src/components/resizable-pane.tsx","../src/utilities/index.ts","../src/components/icons/resize-handle-icon.tsx","../src/provider.tsx"],"sourcesContent":["export { DevtoolsPanel } from \"./panel\";\nexport { DevtoolsProvider } from \"./provider\";\n","import React from \"react\";\nimport { DevtoolsPin } from \"./components/devtools-pin\";\nimport { ResizablePane } from \"./components/resizable-pane\";\n\nimport {\n DevToolsContext,\n DevtoolsEvent,\n send,\n} from \"@refinedev/devtools-shared\";\n\nimport { Placement } from \"./interfaces/placement\";\n\nexport const DevtoolsPanel =\n __DEV_CONDITION__ !== \"development\"\n ? () => null\n : () => {\n const [browser, setBrowser] = React.useState<boolean>(false);\n const [visible, setVisible] = React.useState(false);\n const [placement] = React.useState<Placement>(\"bottom\");\n const { devtoolsUrl, ws } = React.useContext(DevToolsContext);\n const [width, setWidth] = React.useState<number>(0);\n\n const onSelectorHighlight = React.useCallback(\n (name: string) => {\n if (ws) {\n send(ws, DevtoolsEvent.DEVTOOLS_HIGHLIGHT_IN_MONITOR, {\n name,\n });\n }\n setVisible(true);\n },\n [ws],\n );\n\n const onSelectorOpen = React.useCallback(() => {\n setVisible(false);\n }, []);\n\n React.useEffect(() => {\n if (typeof window !== \"undefined\") {\n setBrowser(true);\n }\n }, []);\n\n React.useEffect(() => {\n if (browser) {\n // set width by window size dynamically\n setWidth(window.innerWidth);\n\n const onResize = () => {\n setWidth(window.innerWidth);\n };\n\n window.addEventListener(\"resize\", onResize);\n\n return () => {\n window.removeEventListener(\"resize\", onResize);\n };\n }\n\n return () => undefined;\n }, [browser]);\n\n if (!browser) {\n return null;\n }\n\n return (\n <div\n style={{\n position: \"fixed\",\n left: `${Math.round(width / 2)}px`,\n transform: \"translateX(-50%)\",\n bottom: 0,\n zIndex: 99999,\n }}\n >\n <DevtoolsPin\n onClick={() => setVisible((v) => !v)}\n onSelectorHighlight={onSelectorHighlight}\n onSelectorOpen={onSelectorOpen}\n />\n <ResizablePane visible={visible} placement={placement}>\n {({ resizing }) => (\n <iframe\n allow=\"clipboard-write;\"\n src={devtoolsUrl}\n srcDoc={\n devtoolsUrl\n ? undefined\n : `\n <html style=\"height:100%;padding:0;margin:0;\">\n <body style=\"display:flex;justify-content:center;height:100%;padding:24px;margin:0;align-items:center;box-sizing:border-box;\">\n <h1 style=\"font-family:ui-monospace,monospace;color:#CFD7E2;text-align:center;\">Could not connect to the devtools server</h1>\n </body>\n </html>\n `\n }\n style={{\n width: \"100%\",\n height: \"100%\",\n border: \"none\",\n borderRadius: \"7px\",\n pointerEvents: resizing ? \"none\" : \"auto\",\n background: \"#14141F\",\n }}\n />\n )}\n </ResizablePane>\n </div>\n );\n };\n","import React from \"react\";\nimport { DevtoolsSelector } from \"./devtools-selector\";\nimport { DevtoolsIcon } from \"./icons/devtools-icon\";\nimport { SelectorButtonIcon } from \"./icons/selector-button\";\n\ntype Props = {\n onClick?: () => void;\n groupHover?: boolean;\n onSelectorHighlight: (name: string) => void;\n onSelectorOpen: () => void;\n};\n\nexport const DevtoolsPin = ({\n onClick,\n onSelectorHighlight,\n onSelectorOpen,\n}: Props) => {\n const [hover, setHover] = React.useState(false);\n\n return (\n <div\n onMouseOver={() => setHover(true)}\n onMouseOut={() => setHover(false)}\n style={{\n position: \"relative\",\n userSelect: \"none\",\n WebkitUserSelect: \"none\",\n background: \"none\",\n border: \"none\",\n padding: 0,\n paddingRight: \"1px\",\n margin: 0,\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n cursor: \"pointer\",\n color: hover ? \"#0FBDBD\" : \"#6C7793\",\n transition: \"color 0.1s ease-in-out\",\n }}\n onClick={onClick}\n >\n <DevtoolsIcon />\n <DevtoolsSelector\n style={{\n position: \"absolute\",\n top: 5,\n right: 18,\n width: \"16px\",\n height: \"16px\",\n }}\n icon={\n <SelectorButtonIcon\n width={16}\n height={16}\n style={{ pointerEvents: \"none\" }}\n />\n }\n onSelectorOpen={onSelectorOpen}\n onHighlight={onSelectorHighlight}\n />\n </div>\n );\n};\n","import React from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useSelector } from \"src/utilities/use-selector\";\nimport { SelectorBox } from \"./selector-box\";\nimport { SelectorHint } from \"./selector-hint\";\n\ntype Props = {\n onSelectorOpen: () => void;\n onHighlight: (name: string) => void;\n icon?: React.ReactNode;\n style?: React.CSSProperties;\n};\n\nexport const DevtoolsSelector = ({\n onSelectorOpen,\n onHighlight,\n icon,\n style,\n}: Props) => {\n const [hover, setHover] = React.useState(false);\n const [active, setActive] = React.useState(false);\n const { rect, name } = useSelector(active);\n\n const [selectorBoxRoot, setSelectorBoxRoot] =\n React.useState<HTMLElement | null>(null);\n\n React.useEffect(() => {\n if (!selectorBoxRoot) {\n const element = document.createElement(\"div\");\n element.id = \"selector-box-root\";\n\n document.body.appendChild(element);\n\n setSelectorBoxRoot(element);\n }\n }, []);\n\n React.useEffect(() => {\n if (active) {\n document.body.style.cursor = \"crosshair\";\n } else {\n document.body.style.cursor = \"default\";\n }\n }, [active]);\n\n React.useEffect(() => {\n const onMouseClick = (e: MouseEvent) => {\n if (!active) return;\n if (!name) return;\n\n e?.preventDefault();\n e?.stopPropagation();\n e.stopImmediatePropagation();\n onHighlight(name);\n setActive(false);\n };\n\n if (active) {\n document.addEventListener(\"click\", onMouseClick, {\n capture: true,\n });\n\n return () => {\n document.removeEventListener(\"click\", onMouseClick, {\n capture: true,\n });\n };\n }\n\n return () => 0;\n }, [name, onHighlight, active]);\n\n React.useEffect(() => {\n if (active) {\n onSelectorOpen();\n }\n }, [active, onSelectorOpen]);\n\n return (\n <div style={style}>\n <div\n role=\"button\"\n title=\"Element Selector\"\n onMouseOver={() => setHover(true)}\n onMouseOut={() => setHover(false)}\n onClick={(event) => {\n event.preventDefault();\n event.stopPropagation();\n (document?.activeElement as HTMLElement)?.blur();\n setActive((active) => !active);\n }}\n style={{\n padding: 0,\n margin: 0,\n height: \"100%\",\n width: \"100%\",\n transform: hover ? \"rotate(180deg)\" : \"rotate(0deg)\",\n transition: \"transform 0.2s ease-in-out\",\n }}\n >\n {icon}\n </div>\n <SelectorHint active={active} />\n {active &&\n selectorBoxRoot &&\n createPortal(<SelectorBox {...rect} name={name} />, selectorBoxRoot)}\n </div>\n );\n};\n","import {\n getElementFromFiber,\n getFiberFromElement,\n getFirstFiberHasName,\n getFirstStateNodeFiber,\n getNameFromFiber,\n getParentOfFiber,\n} from \"@aliemir/dom-to-fiber-utils\";\nimport { DevToolsContext } from \"@refinedev/devtools-shared\";\nimport debounce from \"lodash/debounce\";\nimport React from \"react\";\n\ntype Fiber = Exclude<ReturnType<typeof getFiberFromElement>, null>;\n\nexport const useSelector = (active: boolean) => {\n const { devtoolsUrl } = React.useContext(DevToolsContext);\n const [traceItems, setTraceItems] = React.useState<string[]>([]);\n\n React.useEffect(() => {\n if (active) {\n fetch(\n `${devtoolsUrl ?? \"http://localhost:5001\"}/api/unique-trace-items`,\n ).then((res) =>\n res.json().then((data: { data: string[] }) => setTraceItems(data.data)),\n );\n }\n }, [active, devtoolsUrl]);\n\n const [selectedFiber, setSelectedFiber] = React.useState<{\n stateNode: Fiber | null;\n nameFiber: Fiber | null;\n }>({\n stateNode: null,\n nameFiber: null,\n });\n const [activeFiber, setActiveFiber] = React.useState<{\n stateNode: Fiber | null;\n nameFiber: Fiber | null;\n derived?: boolean;\n }>({\n stateNode: null,\n nameFiber: null,\n derived: false,\n });\n\n React.useEffect(() => {\n if (active) {\n return () => {\n setSelectedFiber({\n stateNode: null,\n nameFiber: null,\n });\n setActiveFiber({\n stateNode: null,\n nameFiber: null,\n derived: false,\n });\n };\n }\n\n return () => 0;\n }, [active]);\n\n const selectAppropriateFiber = React.useCallback(\n (start: Fiber | null) => {\n let fiber = start;\n let firstParentOfNodeWithName: Fiber | null;\n let fiberWithStateNode: Fiber | null;\n\n let acceptedName = false;\n\n while (!acceptedName && fiber) {\n // Get the first fiber node that has a name (look up the tree)\n firstParentOfNodeWithName = getFirstFiberHasName(fiber);\n // Get the first fiber node that has a state node (look up the tree)\n fiberWithStateNode = getFirstStateNodeFiber(firstParentOfNodeWithName);\n acceptedName = traceItems.includes(\n getNameFromFiber(firstParentOfNodeWithName) ?? \"\",\n );\n if (!acceptedName) {\n fiber = getParentOfFiber(fiber);\n }\n }\n\n if (fiberWithStateNode && firstParentOfNodeWithName) {\n return {\n stateNode: fiberWithStateNode,\n nameFiber: firstParentOfNodeWithName,\n };\n }\n return {\n stateNode: null,\n nameFiber: null,\n };\n },\n [traceItems],\n );\n\n const pickFiber = React.useCallback(\n (target: HTMLElement) => {\n const fiber = getFiberFromElement(target);\n\n setSelectedFiber(selectAppropriateFiber(fiber));\n return;\n },\n [traceItems],\n );\n\n React.useEffect(() => {\n if (\n activeFiber.stateNode !== selectedFiber.stateNode ||\n activeFiber.nameFiber !== selectedFiber.nameFiber\n ) {\n setActiveFiber({\n stateNode: selectedFiber.stateNode,\n nameFiber: selectedFiber.nameFiber,\n derived: false,\n });\n }\n }, [selectedFiber]);\n\n const previousValues = React.useRef<{\n rect: {\n width: number;\n height: number;\n x: number;\n y: number;\n };\n name: string;\n }>({\n rect: {\n width: 0,\n height: 0,\n x: 0,\n y: 0,\n },\n name: \"\",\n });\n\n const { rect, name } = React.useMemo(() => {\n if (!active) {\n return {\n rect: {\n width: 0,\n height: 0,\n x: 0,\n y: 0,\n },\n name: \"\",\n };\n }\n if (activeFiber.stateNode || activeFiber.nameFiber) {\n // Get the element from the fiber with a state node\n const element = activeFiber.stateNode\n ? getElementFromFiber(activeFiber.stateNode)\n : null;\n // Get the name of the fiber node with a name\n const fiberName = activeFiber.nameFiber\n ? getNameFromFiber(activeFiber.nameFiber)\n : null;\n\n if (!element) {\n return {\n rect: previousValues.current.rect,\n name: fiberName ?? previousValues.current.name,\n };\n }\n\n const bounding = element.getBoundingClientRect?.();\n\n if (!bounding) {\n return {\n rect: previousValues.current.rect,\n name: fiberName ?? previousValues.current.name,\n };\n }\n\n return {\n rect: {\n width: bounding.width,\n height: bounding.height,\n x: bounding.left,\n y: bounding.top,\n },\n name: fiberName ?? previousValues.current.name,\n };\n }\n\n return previousValues.current;\n }, [activeFiber, active]);\n\n previousValues.current = {\n rect,\n name,\n };\n\n React.useEffect(() => {\n if (active) {\n const listener = (e: KeyboardEvent) => {\n // if user presses shift, toggle the derived state and set the active fiber to the parent\n if (e.key === \"Shift\" && activeFiber.stateNode) {\n e.stopPropagation();\n e.preventDefault();\n\n const parent = getParentOfFiber(activeFiber.nameFiber);\n\n const fibers = selectAppropriateFiber(parent);\n\n if (fibers.nameFiber && fibers.stateNode) {\n setActiveFiber({\n ...fibers,\n derived: true,\n });\n return;\n }\n }\n };\n\n document.addEventListener(\"keydown\", listener);\n return () => document.removeEventListener(\"keydown\", listener);\n }\n return () => 0;\n }, [activeFiber, active]);\n\n React.useEffect(() => {\n if (active) {\n let previousTarget: HTMLElement | null = null;\n const listener = debounce((e: MouseEvent) => {\n if (e?.target) {\n if (previousTarget === e.target) {\n return;\n }\n pickFiber(e.target as HTMLElement);\n previousTarget = e.target as HTMLElement;\n }\n }, 50);\n\n document.addEventListener(\"mousemove\", listener);\n\n return () => document.removeEventListener(\"mousemove\", listener);\n }\n return () => 0;\n }, [active, pickFiber]);\n\n return {\n rect,\n name,\n };\n};\n","import React from \"react\";\nimport { ArrowUnionIcon } from \"./icons/arrow-union-icon\";\n\nconst Y_OFFSET = 38;\nconst X_OFFSET = 7;\n\nexport const SelectorBox = ({\n width,\n height,\n x,\n y,\n name,\n}: {\n width: number;\n height: number;\n x: number;\n y: number;\n name: string;\n}) => {\n const namePosition =\n y > Y_OFFSET ? \"top\" : height > 3 * Y_OFFSET ? \"inset\" : \"bottom\";\n\n const outlinePosition = x > X_OFFSET && y > X_OFFSET ? \"outside\" : \"inside\";\n\n return (\n <div\n id=\"selector-box\"\n style={{\n pointerEvents: \"none\",\n position: \"fixed\",\n opacity: name ? 1 : 0,\n transitionProperty: \"width, height, transform, opacity\",\n transitionDuration: \"0.15s\",\n transitionTimingFunction: \"ease-out\",\n border: \"1.5px solid #47EBEB\",\n borderRadius: \"4px\",\n background: \"rgba(37,160,160, 0.25)\",\n backdropFilter: \"sepia(30%) hue-rotate(180deg)\",\n zIndex: 99998,\n ...(outlinePosition === \"outside\"\n ? {\n left: -6,\n top: -6,\n width: width + 10,\n height: height + 10,\n transform: `translate(${x}px, ${y}px)`,\n }\n : {\n left: 0,\n top: 0,\n width: width - 10,\n height: height - 20,\n transform: `translate(${x + 4}px, ${y + 4}px)`,\n }),\n }}\n >\n <div\n style={{\n position: \"absolute\",\n left: \"-1.5px\",\n background: \"#303450\",\n border: \"1px solid #474E6B\",\n borderRadius: \"4px\",\n padding: \"8px 12px\",\n fontSize: \"12px\",\n lineHeight: \"16px\",\n fontWeight: 400,\n color: \"#ffffff\",\n display: name ? \"block\" : \"none\",\n ...(namePosition === \"top\" && {\n top: \"-38px\",\n }),\n ...(namePosition === \"bottom\" && {\n bottom: \"-38px\",\n }),\n ...(namePosition === \"inset\" && {\n top: \"4px\",\n left: \"8px\",\n }),\n }}\n >\n {name}\n\n <ArrowUnionIcon\n style={{\n position: \"absolute\",\n left: \"30%\",\n ...(namePosition === \"top\" && {\n transform: \"translateX(-50%) rotate(180deg)\",\n bottom: \"-9px\",\n }),\n ...(namePosition === \"bottom\" && {\n transform: \"translateX(-50%) \",\n top: \"-9px\",\n }),\n ...(namePosition === \"inset\" && {\n transform: \"translateX(-50%) rotate(-90deg)\",\n top: \"8px\",\n left: \"-1px\",\n }),\n display: name ? \"block\" : \"none\",\n }}\n />\n </div>\n </div>\n );\n};\n","import * as React from \"react\";\nimport { SVGProps } from \"react\";\n\nexport const ArrowUnionIcon = (props: SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width={16}\n height={16}\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n {...props}\n >\n <path\n fill=\"#303450\"\n stroke=\"url(#arrow-union-icon)\"\n d=\"M.5 8.495V15.5h15V8.495a4.5 4.5 0 0 1-3.816-2.483L9.341 1.33c-.553-1.105-2.13-1.105-2.683 0L4.317 6.012A4.5 4.5 0 0 1 .5 8.495Z\"\n />\n <defs>\n <linearGradient\n id=\"arrow-union-icon\"\n x1={8}\n x2={8}\n y1={0}\n y2={10}\n gradientUnits=\"userSpaceOnUse\"\n >\n <stop stopColor=\"#474E6B\" />\n <stop offset={0.9} stopColor=\"#474E6B\" />\n <stop offset={0.901} stopColor=\"#474E6B\" stopOpacity={0} />\n </linearGradient>\n </defs>\n </svg>\n);\n","import React from \"react\";\n\nexport const SelectorHint = ({ active }: { active: boolean }) => {\n return (\n <div\n style={{\n color: \"white\",\n pointerEvents: \"none\",\n position: \"absolute\",\n left: \"calc(-50% - 144px - 14px)\",\n top: \"-36px\",\n width: \"max-content\",\n borderRadius: \"8px\",\n backgroundColor: \"#40414A\",\n opacity: active ? 1 : 0,\n transitionDuration: \"0.2s\",\n transitionProperty: \"transform,opacity\",\n transitionTimingFunction: \"ease-in-out\",\n padding: \"8px\",\n fontSize: \"12px\",\n lineHeight: \"12px\",\n fontWeight: 400,\n textShadow:\n \"0 0 2px #1D1E30, 1px 0 2px #1D1E30, -1px 0 2px #1D1E30, 0 1px 2px #1D1E30, 0 -1px 2px #1D1E30\",\n }}\n >\n <kbd\n style={{\n marginLeft: \"4px\",\n padding: \"2px 4px\",\n borderRadius: \"2px\",\n background: \"#1D1E30\",\n color: \"#CFD7E2\",\n border: \"none\",\n textShadow: \"none\",\n }}\n >\n shift\n </kbd>{\" \"}\n to move to parent.\n <kbd\n style={{\n marginLeft: \"4px\",\n padding: \"2px 4px\",\n borderRadius: \"2px\",\n background: \"#1D1E30\",\n color: \"#CFD7E2\",\n border: \"none\",\n textShadow: \"none\",\n }}\n >\n space\n </kbd>{\" \"}\n to highlight in monitor.\n </div>\n );\n};\n","import * as React from \"react\";\nimport { SVGProps } from \"react\";\n\nexport const DevtoolsIcon = (props: SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width={157}\n height={25}\n viewBox=\"0 0 157 25\"\n fill=\"none\"\n {...props}\n >\n <g>\n <path fill=\"#1D1E30\" d=\"M17 1h123v24H17z\" />\n <path\n fill=\"#1D1E30\"\n d=\"M6.265 9.205A12 12 0 0 1 17.649 1H25v24H1L6.265 9.205ZM150.735 9.205A12 12 0 0 0 139.351 1H132v24h24l-5.265-15.795Z\"\n />\n <path\n fill=\"currentColor\"\n d=\"M25 14.333A1.333 1.333 0 1 1 25 17a1.333 1.333 0 0 1 0-2.667Z\"\n />\n <path\n fill=\"currentColor\"\n fillRule=\"evenodd\"\n d=\"M23.211 20.578a4 4 0 0 0 3.578 0l4-2A4 4 0 0 0 33 15v-4a4 4 0 0 0-2.211-3.578l-4-2a4 4 0 0 0-3.578 0l-4 2A4 4 0 0 0 17 11v4a4 4 0 0 0 2.211 3.578l4 2Zm-.878-4.911a2.667 2.667 0 0 0 5.334 0v-5.334a2.667 2.667 0 0 0-5.334 0v5.334Z\"\n clipRule=\"evenodd\"\n />\n <path\n fill=\"#CFD7E2\"\n d=\"M42.152 17a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h4.2c.288 0 .56.056.816.168a2.135 2.135 0 0 1 1.14 1.128c.112.256.168.532.168.828v3.984c0 .296-.056.572-.168.828a2.135 2.135 0 0 1-1.14 1.128 2.014 2.014 0 0 1-.816.168h-4.2Zm1.38-1.644h2.82a.455.455 0 0 0 .336-.132.497.497 0 0 0 .132-.348v-3.984a.455.455 0 0 0-.132-.336.436.436 0 0 0-.336-.144h-2.82v4.944Zm13.18-5.196a.244.244 0 0 1-.253.252h-4.44v1.656h4.02c.072 0 .132.024.18.072a.227.227 0 0 1 .084.18v1.128a.264.264 0 0 1-.084.192.244.244 0 0 1-.18.072h-4.02v1.644h4.44c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.116a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072h-5.832a.244.244 0 0 1-.18-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.227.227 0 0 1 .18-.084h5.832c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.128ZM63.014 17h-2.232a.387.387 0 0 1-.216-.072.356.356 0 0 1-.144-.168l-1.716-4.296a.853.853 0 0 1-.072-.24 1.783 1.783 0 0 1-.024-.264V9.032c0-.072.024-.132.072-.18a.227.227 0 0 1 .18-.084h1.128c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v2.616c0 .072.008.156.024.252s.04.176.072.24l1.284 3.216h.528l1.284-3.216a.853.853 0 0 0 .072-.24c.016-.096.024-.18.024-.252V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.128c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v2.928c0 .072-.008.16-.024.264a.853.853 0 0 1-.072.24l-1.716 4.296a.356.356 0 0 1-.144.168.387.387 0 0 1-.216.072ZM73.29 8.768c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v1.128a.227.227 0 0 1-.084.18.244.244 0 0 1-.18.072h-2.208v6.324a.264.264 0 0 1-.084.192.244.244 0 0 1-.18.072H69.69a.244.244 0 0 1-.18-.072.287.287 0 0 1-.072-.192v-6.324H67.23a.287.287 0 0 1-.192-.072.244.244 0 0 1-.072-.18V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h6.06Zm6.507.012c.296 0 .572.056.828.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v3.996c0 .288-.056.56-.168.816a2.171 2.171 0 0 1-1.128 1.128 2.043 2.043 0 0 1-.828.168h-2.34c-.296 0-.572-.056-.828-.168a2.171 2.171 0 0 1-1.128-1.128 2.014 2.014 0 0 1-.168-.816v-3.996c0-.288.056-.56.168-.816a2.171 2.171 0 0 1 1.128-1.128c.256-.112.532-.168.828-.168h2.34Zm.48 2.112a.436.436 0 0 0-.144-.336.455.455 0 0 0-.336-.132h-2.34a.497.497 0 0 0-.348.132.455.455 0 0 0-.132.336v3.996c0 .136.044.248.132.336a.497.497 0 0 0 .348.132h2.34a.455.455 0 0 0 .336-.132.436.436 0 0 0 .144-.336v-3.996Zm7.888-2.112c.295 0 .572.056.828.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v3.996c0 .288-.056.56-.168.816a2.171 2.171 0 0 1-1.128 1.128 2.043 2.043 0 0 1-.828.168h-2.34c-.297 0-.573-.056-.829-.168a2.171 2.171 0 0 1-1.127-1.128 2.014 2.014 0 0 1-.168-.816v-3.996c0-.288.056-.56.168-.816a2.171 2.171 0 0 1 1.127-1.128c.257-.112.532-.168.829-.168h2.34Zm.48 2.112a.436.436 0 0 0-.144-.336.455.455 0 0 0-.337-.132h-2.34a.497.497 0 0 0-.347.132.455.455 0 0 0-.133.336v3.996c0 .136.044.248.133.336a.497.497 0 0 0 .347.132h2.34a.455.455 0 0 0 .337-.132.436.436 0 0 0 .143-.336v-3.996ZM98.294 17H92.68a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.116c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v6.324h4.236c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.116a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072Zm7.336-5.76a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192v-.084a.455.455 0 0 0-.132-.336.436.436 0 0 0-.336-.144h-2.352a.46.46 0 0 0-.336.144.455.455 0 0 0-.132.336v.696c0 .136.044.252.132.348a.482.482 0 0 0 .336.132h2.352c.288 0 .56.056.816.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v.696c0 .296-.056.572-.168.828a2.171 2.171 0 0 1-1.128 1.128 2.014 2.014 0 0 1-.816.168h-2.352c-.288 0-.56-.056-.816-.168a2.171 2.171 0 0 1-1.128-1.128 2.043 2.043 0 0 1-.168-.828v-.084c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.116c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v.084c0 .136.044.252.132.348a.482.482 0 0 0 .336.132h2.352a.455.455 0 0 0 .336-.132.497.497 0 0 0 .132-.348v-.696a.455.455 0 0 0-.132-.336.455.455 0 0 0-.336-.132h-2.352c-.288 0-.56-.056-.816-.168a2.171 2.171 0 0 1-1.128-1.128 2.099 2.099 0 0 1-.168-.828v-.696c0-.296.056-.572.168-.828a2.171 2.171 0 0 1 1.128-1.128c.256-.112.528-.168.816-.168h2.352c.288 0 .56.056.816.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.532.168.828v.084a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072h-1.128Z\"\n />\n </g>\n </svg>\n);\n","import React from \"react\";\n\nexport const SelectorButtonIcon = (props: React.SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width={16}\n height={16}\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n {...props}\n >\n <path\n fill=\"#0FBDBD\"\n fillRule=\"evenodd\"\n d=\"M9 1a1 1 0 0 0-2 0v2.1A5.006 5.006 0 0 0 3.1 7H1a1 1 0 0 0 0 2h2.1A5.006 5.006 0 0 0 7 12.9V15a1 1 0 1 0 2 0v-2.1A5.006 5.006 0 0 0 12.9 9H15a1 1 0 1 0 0-2h-2.1A5.006 5.006 0 0 0 9 3.1V1Zm2 7a3 3 0 1 0-6 0 3 3 0 0 0 6 0Z\"\n clipRule=\"evenodd\"\n />\n </svg>\n);\n","import React from \"react\";\nimport { Placement } from \"src/interfaces/placement\";\nimport {\n getDefaultPanelSize,\n getMaxPanelHeight,\n getMaxPanelWidth,\n getPanelPosition,\n getPanelToggleTransforms,\n MIN_PANEL_HEIGHT,\n MIN_PANEL_WIDTH,\n roundToEven,\n} from \"src/utilities\";\nimport { ResizeHandleIcon } from \"./icons/resize-handle-icon\";\n\ntype Props = {\n placement: Placement;\n defaultWidth?: number;\n minWidth?: number;\n maxWidth?: number;\n defaultHeight?: number;\n minHeight?: number;\n maxHeight?: number;\n children: ({ resizing }: { resizing: string | null }) => React.ReactNode;\n onResize?: (width: number, height: number) => void;\n visible?: boolean;\n};\n\nexport const ResizablePane = ({ placement, visible, children }: Props) => {\n const [hover, setHover] = React.useState(false);\n const [resizing, setResizing] = React.useState<\n \"lx\" | \"rx\" | \"ty\" | \"by\" | null\n >(null);\n const [resizePosition, setResizePosition] = React.useState<{\n x: number;\n y: number;\n } | null>(null);\n const [panelSize, setPanelSize] = React.useState<\n Record<\"width\" | \"height\", number>\n >(() => {\n const defaultSize = getDefaultPanelSize(placement);\n\n return {\n width: roundToEven(defaultSize.width),\n height: roundToEven(defaultSize.height),\n };\n });\n\n React.useEffect(() => {\n const handleResize = () => {\n setPanelSize((p) => {\n const defaultSize = getDefaultPanelSize(placement, p);\n\n return {\n width: roundToEven(defaultSize.width),\n height: roundToEven(defaultSize.height),\n };\n });\n };\n\n handleResize();\n\n window.addEventListener(\"resize\", handleResize);\n\n return () => {\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [placement]);\n\n React.useEffect(() => {\n const handleMouseUp = () => {\n setResizing(null);\n };\n\n if (resizing !== null) {\n window.addEventListener(\"mouseup\", handleMouseUp);\n\n return () => {\n window.removeEventListener(\"mouseup\", handleMouseUp);\n };\n }\n\n return;\n }, [resizing]);\n\n React.useEffect(() => {\n const currentCursor = document.body.style.cursor;\n\n if (resizing?.includes(\"x\")) {\n document.body.style.cursor = \"col-resize\";\n } else if (resizing?.includes(\"y\")) {\n document.body.style.cursor = \"row-resize\";\n }\n\n return () => {\n document.body.style.cursor = currentCursor;\n };\n }, [resizing]);\n\n React.useEffect(() => {\n const handleMouseMove = (e: MouseEvent) => {\n if (resizing?.[1] === \"x\") {\n const diff = e.clientX - (resizePosition?.x ?? e.clientX);\n const newWidth =\n panelSize.width + (resizing === \"lx\" ? -diff : diff) * 2;\n\n setPanelSize((p) => ({\n ...p,\n width: roundToEven(\n Math.min(\n getMaxPanelWidth(placement),\n Math.max(MIN_PANEL_WIDTH, newWidth),\n ),\n ),\n }));\n } else if (resizing?.[1] === \"y\") {\n const diff = e.clientY - (resizePosition?.y ?? e.clientY);\n const newHeight =\n panelSize.height + (resizing === \"ty\" ? -diff : diff) * 1;\n\n setPanelSize((p) => ({\n ...p,\n height: roundToEven(\n Math.min(\n getMaxPanelHeight(placement),\n Math.max(MIN_PANEL_HEIGHT, newHeight),\n ),\n ),\n }));\n }\n };\n\n if (resizing !== null) {\n window.addEventListener(\"mousemove\", handleMouseMove);\n\n return () => {\n window.removeEventListener(\"mousemove\", handleMouseMove);\n };\n }\n\n return;\n }, [resizing, placement]);\n\n return (\n <div\n style={{\n position: \"absolute\",\n borderRadius: \"8px\",\n boxShadow: \"0 0 10px rgba(0, 0, 0, 0.5)\",\n border: \"1px solid rgba(0, 0, 0, 0.5)\",\n transitionProperty: \"transform, opacity\",\n transitionTimingFunction: \"ease-in-out\",\n transitionDuration: \"0.2s\",\n ...getPanelPosition(placement),\n opacity: visible ? 1 : 0,\n transform: `${\n getPanelPosition(placement).transform\n } ${getPanelToggleTransforms(visible ?? false)}`,\n ...panelSize,\n }}\n onMouseEnter={() => {\n setHover(true);\n }}\n onMouseLeave={() => {\n setHover(false);\n }}\n >\n {children({ resizing })}\n {/* */}\n <React.Fragment>\n <div\n style={{\n position: \"absolute\",\n left: 0,\n top: \"50%\",\n width: \"10px\",\n height: \"26px\",\n transform: \"translateY(-13px) translateX(-5px)\",\n cursor: \"col-resize\",\n transition: \"opacity ease-in-out 0.2s\",\n pointerEvents: hover || resizing ? \"auto\" : \"none\",\n opacity: hover || resizing ? 1 : 0,\n }}\n onMouseDown={(event) => {\n setResizing(\"lx\");\n setResizePosition({\n x: event.clientX,\n y: event.clientY,\n });\n\n event.preventDefault();\n }}\n >\n <ResizeHandleIcon />\n </div>\n <div\n style={{\n position: \"absolute\",\n right: 0,\n top: \"50%\",\n width: \"10px\",\n height: \"26px\",\n transform: \"translateY(-13px) translateX(5px)\",\n cursor: \"col-resize\",\n transition: \"opacity ease-in-out 0.2s\",\n pointerEvents: hover || resizing ? \"auto\" : \"none\",\n opacity: hover || resizing ? 1 : 0,\n }}\n onMouseDown={(event) => {\n setResizing(\"rx\");\n setResizePosition({\n x: event.clientX,\n y: event.clientY,\n });\n\n event.preventDefault();\n }}\n >\n <ResizeHandleIcon />\n </div>\n <div\n style={{\n position: \"absolute\",\n left: \"50%\",\n top: 0,\n width: \"26px\",\n height: \"10px\",\n transform: \"translateY(-5px) translateX(-13px)\",\n cursor: \"row-resize\",\n transition: \"opacity ease-in-out 0.2s\",\n pointerEvents: hover || resizing ? \"auto\" : \"none\",\n opacity: hover || resizing ? 1 : 0,\n }}\n onMouseDown={(event) => {\n setResizing(\"ty\");\n setResizePosition({\n x: event.clientX,\n y: event.clientY,\n });\n\n event.preventDefault();\n }}\n >\n <ResizeHandleIcon\n style={{\n transform: \"rotate(90deg)\",\n transformOrigin: \"13px 13px\",\n }}\n />\n </div>\n <div\n style={{\n position: \"absolute\",\n left: \"50%\",\n bottom: 0,\n width: \"26px\",\n height: \"10px\",\n transform: \"translateY(5px) translateX(-13px)\",\n cursor: \"row-resize\",\n transition: \"opacity ease-in-out 0.2s\",\n pointerEvents: hover || resizing ? \"auto\" : \"none\",\n opacity: hover || resizing ? 1 : 0,\n }}\n onMouseDown={(event) => {\n setResizing(\"by\");\n setResizePosition({\n x: event.clientX,\n y: event.clientY,\n });\n\n event.preventDefault();\n }}\n >\n <ResizeHandleIcon\n style={{\n transform: \"rotate(90deg)\",\n transformOrigin: \"13px 13px\",\n }}\n />\n </div>\n </React.Fragment>\n </div>\n );\n};\n","import { Placement } from \"src/interfaces/placement\";\n\nexport const getPanelToggleTransforms = (visible: boolean) => {\n return visible ? \"scaleX(1) translateY(0)\" : \"scaleX(0) translateY(25vw)\";\n};\n\nexport const SIZE = 50;\nexport const BUFFER = 10;\n\nconst PREFERRED_DEFAULT_WIDTH = () =>\n typeof window !== \"undefined\" ? window.innerWidth * 0.7 : 1440 * 0.7; // 70% of window width\nconst PREFERRED_DEFAULT_HEIGHT = () =>\n typeof window !== \"undefined\" ? window.innerHeight * 0.7 : 900 * 0.7; // 70% of window height\n\nexport const MIN_PANEL_WIDTH = 640;\nexport const MIN_PANEL_HEIGHT = 360;\n\nexport const getPinButtonTransform = (hover?: boolean) => {\n return `translateY(${hover ? \"0\" : \"50%\"})`;\n};\n\nexport const getPanelPosition = (placement: Placement) => {\n switch (placement) {\n case \"left\":\n return {\n left: `calc(${SIZE}px + ${BUFFER}px)`,\n top: \"50%\",\n transform: \"translateY(-50%)\",\n };\n case \"right\":\n return {\n right: `calc(${SIZE}px + ${BUFFER}px)`,\n top: \"50%\",\n transform: \"translateY(-50%)\",\n };\n case \"top\":\n return {\n left: \"50%\",\n top: `calc(${SIZE}px + ${BUFFER}px)`,\n transform: \"translateX(-50%)\",\n };\n case \"bottom\":\n return {\n left: \"50%\",\n bottom: `calc(${SIZE}px + ${BUFFER}px)`,\n transform: \"translateX(-50%)\",\n };\n }\n};\n\nexport const getMaxPanelWidth = (placement: Placement) => {\n switch (placement) {\n case \"left\":\n case \"right\":\n return (\n -BUFFER -\n SIZE -\n BUFFER +\n (typeof window !== \"undefined\" ? window.innerWidth : 1440) -\n BUFFER\n );\n case \"top\":\n case \"bottom\":\n return (\n -BUFFER +\n (typeof window !== \"undefined\" ? window.innerWidth : 1440) -\n BUFFER\n );\n }\n};\n\nexport const getMaxPanelHeight = (placement: Placement) => {\n switch (placement) {\n case \"left\":\n case \"right\":\n return (\n -BUFFER +\n (typeof window !== \"undefined\" ? window.innerHeight : 900) -\n BUFFER\n );\n case \"top\":\n case \"bottom\":\n return (\n -BUFFER -\n SIZE -\n BUFFER +\n (typeof window !== \"undefined\" ? window.innerHeight : 900) -\n BUFFER\n );\n }\n};\n\nexport const getDefaultPanelSize = (\n placement: Placement,\n preferredSize?: { width: number; height: number },\n): { width: number; height: number } => {\n const defaultPreferred = {\n width: PREFERRED_DEFAULT_WIDTH(),\n height: PREFERRED_DEFAULT_HEIGHT(),\n };\n\n const maxPanelWidth = getMaxPanelWidth(placement);\n const maxPanelHeight = getMaxPanelHeight(placement);\n\n const width = Math.min(\n maxPanelWidth,\n (preferredSize ?? defaultPreferred).width,\n );\n const height = Math.min(\n maxPanelHeight,\n (preferredSize ?? defaultPreferred).height,\n );\n\n return {\n width: width,\n height: height,\n };\n};\n\nexport const roundToEven = (num: number) => {\n const rounded = Math.round(num);\n return rounded % 2 === 0 ? rounded : rounded + 1;\n};\n","import React from \"react\";\n\nexport const ResizeHandleIcon = (props: React.SVGProps<SVGSVGElement>) => (\n <svg\n width={10}\n height={26}\n viewBox=\"0 0 10 26\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n {...props}\n >\n <rect x={0.5} y={0.5} width={9} height={25} rx={4.5} fill=\"#1D1E30\" />\n <path\n d=\"M7 5C7 6.10457 6.10457 7 5 7C3.89543 7 3 6.10457 3 5C3 3.89543 3.89543 3 5 3C6.10457 3 7 3.89543 7 5Z\"\n fill=\"#303450\"\n />\n <path\n d=\"M7 13C7 14.1046 6.10457 15 5 15C3.89543 15 3 14.1046 3 13C3 11.8954 3.89543 11 5 11C6.10457 11 7 11.8954 7 13Z\"\n fill=\"#303450\"\n />\n <path\n d=\"M7 21C7 22.1046 6.10457 23 5 23C3.89543 23 3 22.1046 3 21C3 19.8954 3.89543 19 5 19C6.10457 19 7 19.8954 7 21Z\"\n fill=\"#303450\"\n />\n <rect x={0.5} y={0.5} width={9} height={25} rx={4.5} stroke=\"#303450\" />\n </svg>\n);\n","import React from \"react\";\nimport { DevToolsContextProvider } from \"@refinedev/devtools-shared\";\n\nexport const DevtoolsProvider =\n __DEV_CONDITION__ !== \"development\"\n ? ({ children }: React.PropsWithChildren) => children as any\n : ({ children }: React.PropsWithChildren) => {\n return <DevToolsContextProvider>{children}</DevToolsContextProvider>;\n };\n"],"mappings":"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","names":["src_exports","__export","DevtoolsPanel","DevtoolsProvider","__toCommonJS","import_react","import_react","import_react","import_react_dom","import_dom_to_fiber_utils","import_devtools_shared","import_debounce","import_react","useSelector","active","devtoolsUrl","React","traceItems","setTraceItems","res","data","selectedFiber","setSelectedFiber","activeFiber","setActiveFiber","selectAppropriateFiber","start","fiber","firstParentOfNodeWithName","fiberWithStateNode","acceptedName","pickFiber","target","previousValues","rect","name","_a","element","fiberName","bounding","listener","e","parent","fibers","previousTarget","debounce","import_react","React","ArrowUnionIcon","props","Y_OFFSET","X_OFFSET","SelectorBox","width","height","x","y","name","namePosition","outlinePosition","React","ArrowUnionIcon","import_react","SelectorHint","active","React","DevtoolsSelector","onSelectorOpen","onHighlight","icon","style","hover","setHover","React","active","setActive","rect","name","useSelector","selectorBoxRoot","setSelectorBoxRoot","element","onMouseClick","e","event","_a","SelectorHint","SelectorBox","React","DevtoolsIcon","props","import_react","SelectorButtonIcon","props","React","DevtoolsPin","onClick","onSelectorHighlight","onSelectorOpen","hover","setHover","React","DevtoolsIcon","DevtoolsSelector","SelectorButtonIcon","import_react","getPanelToggleTransforms","visible","SIZE","BUFFER","PREFERRED_DEFAULT_WIDTH","PREFERRED_DEFAULT_HEIGHT","MIN_PANEL_WIDTH","MIN_PANEL_HEIGHT","getPanelPosition","placement","SIZE","BUFFER","getMaxPanelWidth","getMaxPanelHeight","getDefaultPanelSize","preferredSize","defaultPreferred","PREFERRED_DEFAULT_WIDTH","PREFERRED_DEFAULT_HEIGHT","maxPanelWidth","maxPanelHeight","width","height","roundToEven","num","rounded","import_react","ResizeHandleIcon","props","React","ResizablePane","placement","visible","children","hover","setHover","React","resizing","setResizing","resizePosition","setResizePosition","panelSize","setPanelSize","defaultSize","getDefaultPanelSize","roundToEven","handleResize","handleMouseUp","currentCursor","handleMouseMove","e","diff","newWidth","p","getMaxPanelWidth","MIN_PANEL_WIDTH","newHeight","getMaxPanelHeight","MIN_PANEL_HEIGHT","getPanelPosition","getPanelToggleTransforms","event","ResizeHandleIcon","import_devtools_shared","DevtoolsPanel","browser","setBrowser","React","visible","setVisible","placement","devtoolsUrl","ws","width","setWidth","onSelectorHighlight","name","onSelectorOpen","onResize","DevtoolsPin","v","ResizablePane","resizing","import_react","import_devtools_shared","DevtoolsProvider","children","React"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/panel.tsx","../src/components/devtools-pin.tsx","../src/components/devtools-selector.tsx","../src/utilities/use-selector.tsx","../src/components/apply-styles.tsx","../src/components/selectable-elements.tsx","../src/components/icons/selector-button.tsx","../src/components/icons/devtools-icon.tsx","../src/components/resizable-pane.tsx","../src/utilities/index.ts","../src/components/icons/resize-handle-icon.tsx","../src/provider.tsx"],"sourcesContent":["export { DevtoolsPanel } from \"./panel.js\";\nexport { DevtoolsProvider } from \"./provider.js\";\n","import React from \"react\";\nimport { DevtoolsPin } from \"./components/devtools-pin\";\nimport { ResizablePane } from \"./components/resizable-pane\";\n\nimport {\n DevToolsContext,\n DevtoolsEvent,\n send,\n} from \"@refinedev/devtools-shared\";\n\nimport { Placement } from \"./interfaces/placement\";\n\nexport const DevtoolsPanel =\n __DEV_CONDITION__ !== \"development\"\n ? () => null\n : () => {\n const [browser, setBrowser] = React.useState<boolean>(false);\n const [visible, setVisible] = React.useState(false);\n const [placement] = React.useState<Placement>(\"bottom\");\n const { devtoolsUrl, ws } = React.useContext(DevToolsContext);\n const [width, setWidth] = React.useState<number>(0);\n const [selectorActive, setSelectorActive] = React.useState(false);\n\n const onSelectorHighlight = React.useCallback(\n (name: string) => {\n if (ws) {\n send(ws, DevtoolsEvent.DEVTOOLS_HIGHLIGHT_IN_MONITOR, {\n name,\n });\n }\n setVisible(true);\n },\n [ws],\n );\n\n const onSelectorOpen = React.useCallback(() => {\n setVisible(false);\n }, []);\n\n React.useEffect(() => {\n if (selectorActive) {\n setVisible(false);\n }\n }, [selectorActive]);\n\n React.useEffect(() => {\n if (typeof window !== \"undefined\") {\n setBrowser(true);\n }\n }, []);\n\n React.useEffect(() => {\n if (browser) {\n // set width by window size dynamically\n setWidth(window.innerWidth);\n\n const onResize = () => {\n setWidth(window.innerWidth);\n };\n\n window.addEventListener(\"resize\", onResize);\n\n return () => {\n window.removeEventListener(\"resize\", onResize);\n };\n }\n\n return () => undefined;\n }, [browser]);\n\n if (!browser) {\n return null;\n }\n\n return (\n <div\n style={{\n position: \"fixed\",\n left: `${Math.round(width / 2)}px`,\n transform: \"translateX(-50%)\",\n bottom: 0,\n zIndex: 99999,\n }}\n >\n <DevtoolsPin\n onClick={() => {\n setVisible((v) => !v);\n setSelectorActive(false);\n }}\n onSelectorHighlight={onSelectorHighlight}\n selectorActive={selectorActive}\n setSelectorActive={setSelectorActive}\n />\n <ResizablePane visible={visible} placement={placement}>\n {({ resizing }) => (\n <iframe\n allow=\"clipboard-write;\"\n src={devtoolsUrl}\n srcDoc={\n devtoolsUrl\n ? undefined\n : `\n <html style=\"height:100%;padding:0;margin:0;\">\n <body style=\"display:flex;justify-content:center;height:100%;padding:24px;margin:0;align-items:center;box-sizing:border-box;\">\n <h1 style=\"font-family:ui-monospace,monospace;color:#CFD7E2;text-align:center;\">Could not connect to the devtools server</h1>\n </body>\n </html>\n `\n }\n style={{\n width: \"100%\",\n height: \"100%\",\n border: \"none\",\n borderRadius: \"7px\",\n pointerEvents: resizing ? \"none\" : \"auto\",\n background: \"#14141F\",\n }}\n />\n )}\n </ResizablePane>\n </div>\n );\n };\n","import React from \"react\";\nimport { DevtoolsSelector } from \"./devtools-selector\";\nimport { DevtoolsIcon } from \"./icons/devtools-icon\";\nimport { SelectorButtonIcon } from \"./icons/selector-button\";\nimport { ApplyStyles } from \"./apply-styles\";\n\ntype Props = {\n onClick?: () => void;\n groupHover?: boolean;\n onSelectorHighlight: (name: string) => void;\n selectorActive: boolean;\n setSelectorActive: React.Dispatch<React.SetStateAction<boolean>>;\n};\n\nexport const DevtoolsPin = ({\n onClick,\n onSelectorHighlight,\n selectorActive,\n setSelectorActive,\n}: Props) => {\n return (\n // biome-ignore lint/a11y/useKeyWithClickEvents: <explanation>\n <div role=\"button\" className=\"devtools-selector-pin-box\" onClick={onClick}>\n <DevtoolsIcon />\n <DevtoolsSelector\n style={{\n position: \"absolute\",\n top: 5,\n right: 18,\n width: \"16px\",\n height: \"16px\",\n }}\n icon={\n <SelectorButtonIcon\n width={16}\n height={16}\n style={{ pointerEvents: \"none\" }}\n />\n }\n onHighlight={onSelectorHighlight}\n active={selectorActive}\n setActive={setSelectorActive}\n />\n <ApplyStyles>\n {\n /* css */ `\n .devtools-selector-pin-box {\n z-index: 9999;\n position: relative;\n user-select: none;\n -webkit-user-select: none;\n background: none;\n border: none;\n padding: 0;\n margin: 0;\n appearance: none;\n padding-right: 1px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n color: #6C7793;\n transition: color 0.1s ease-in-out;\n }\n\n .devtools-selector-pin-box:hover {\n color: #0FBDBD;\n }\n `\n }\n </ApplyStyles>\n </div>\n );\n};\n","import React from \"react\";\nimport { useSelector } from \"src/utilities/use-selector\";\nimport { ApplyStyles } from \"./apply-styles\";\nimport { SelectableElements } from \"./selectable-elements\";\n\ntype Props = {\n active: boolean;\n setActive: React.Dispatch<React.SetStateAction<boolean>>;\n onHighlight: (name: string) => void;\n icon?: React.ReactNode;\n style?: React.CSSProperties;\n};\n\nexport const DevtoolsSelector = ({\n active,\n setActive,\n onHighlight,\n icon,\n style,\n}: Props) => {\n const { selectableElements } = useSelector(active);\n\n const onSelect = (name: string) => {\n onHighlight(name);\n setActive(false);\n };\n\n return (\n <div style={style}>\n {/* biome-ignore lint/a11y/useKeyWithClickEvents: <explanation> */}\n <div\n role=\"button\"\n title=\"Element Selector\"\n className=\"refine-devtools-selector-button\"\n onClick={(event) => {\n event.preventDefault();\n event.stopPropagation();\n (document?.activeElement as HTMLElement)?.blur();\n setActive((active) => !active);\n }}\n >\n {icon}\n </div>\n {active && (\n <SelectableElements elements={selectableElements} onSelect={onSelect} />\n )}\n <ApplyStyles>\n {\n /* css */ `\n .refine-devtools-selector-button {\n padding: 0;\n margin: 0;\n height: 100%;\n width: 100%;\n transform: rotate(0deg);\n transition: transform 0.2s ease-in-out;\n }\n\n .refine-devtools-selector-button:hover {\n transform: rotate(180deg);\n }\n `\n }\n </ApplyStyles>\n </div>\n );\n};\n","import React from \"react\";\nimport {\n getElementFromFiber,\n getFiberFromElement,\n getFirstFiberHasName,\n getFirstStateNodeFiber,\n getNameFromFiber,\n getParentOfFiber,\n} from \"@aliemir/dom-to-fiber-utils\";\nimport { DevToolsContext } from \"@refinedev/devtools-shared\";\n\ntype Fiber = Exclude<ReturnType<typeof getFiberFromElement>, null>;\n\ntype SelectableElement = {\n element: HTMLElement;\n name: string;\n};\n\nexport const useSelector = (active: boolean) => {\n const { devtoolsUrl } = React.useContext(DevToolsContext);\n const [selectableElements, setSelectableElements] = React.useState<\n SelectableElement[]\n >([]);\n\n const fetchTraceItems = React.useCallback(async () => {\n const response = await fetch(\n `${devtoolsUrl ?? \"http://localhost:5001\"}/api/unique-trace-items`,\n );\n const data = await response.json();\n\n return data.data as string[];\n }, [devtoolsUrl]);\n\n const selectAppropriateFiber = React.useCallback(\n (start: Fiber | null, activeTraceItems: string[]) => {\n let fiber = start;\n let firstParentOfNodeWithName: Fiber | null;\n let fiberWithStateNode: Fiber | null;\n\n let acceptedName = false;\n\n while (!acceptedName && fiber) {\n // Get the first fiber node that has a name (look up the tree)\n firstParentOfNodeWithName = getFirstFiberHasName(fiber);\n // Get the first fiber node that has a state node (look up the tree)\n fiberWithStateNode = getFirstStateNodeFiber(firstParentOfNodeWithName);\n acceptedName = activeTraceItems.includes(\n getNameFromFiber(firstParentOfNodeWithName) ?? \"\",\n );\n if (!acceptedName) {\n fiber = getParentOfFiber(fiber);\n }\n }\n\n if (fiberWithStateNode && firstParentOfNodeWithName) {\n return {\n stateNode: fiberWithStateNode,\n nameFiber: firstParentOfNodeWithName,\n };\n }\n return {\n stateNode: null,\n nameFiber: null,\n };\n },\n [],\n );\n\n const getUniqueNodes = React.useCallback((nodes: SelectableElement[]) => {\n const uniques: SelectableElement[] = [];\n\n nodes.forEach((node) => {\n const isElementExist = uniques.find(\n (item) => item.element === node.element,\n );\n if (!isElementExist) {\n uniques.push(node);\n }\n });\n\n return uniques;\n }, []);\n\n const traverseBodyNodes = React.useCallback(\n (\n node: HTMLElement | null,\n activeTraceItems: string[],\n ): SelectableElement[] => {\n if (!node) {\n return [];\n }\n\n const items: SelectableElement[] = [];\n\n const fiber = getFiberFromElement(node);\n const targetFiber = selectAppropriateFiber(fiber, activeTraceItems);\n\n if (targetFiber.nameFiber && targetFiber.stateNode) {\n const element = getElementFromFiber(targetFiber.stateNode);\n const name = getNameFromFiber(targetFiber.nameFiber);\n if (element && name) {\n items.push({\n element,\n name,\n });\n }\n }\n\n for (let i = 0; i < node?.children?.length ?? 0; i++) {\n items.push(\n ...traverseBodyNodes(\n node.children[i] as HTMLElement,\n activeTraceItems,\n ),\n );\n }\n\n return items;\n },\n [selectAppropriateFiber],\n );\n\n const prepareSelector = React.useCallback(async () => {\n const fetchedTraceItems = await fetchTraceItems();\n const traversedNodes = traverseBodyNodes(document.body, fetchedTraceItems);\n const uniqueNodes = getUniqueNodes(traversedNodes);\n\n setSelectableElements(uniqueNodes);\n }, [fetchTraceItems, traverseBodyNodes, getUniqueNodes]);\n\n React.useEffect(() => {\n if (active) {\n prepareSelector();\n }\n }, [active, prepareSelector]);\n\n return {\n selectableElements,\n };\n};\n","import React from \"react\";\n\ntype Props = {\n children: string;\n};\n\nexport const ApplyStyles = ({ children }: Props) => {\n React.useEffect(() => {\n const element = document.createElement(\"style\");\n element.innerHTML = children;\n document.head.appendChild(element);\n\n return () => {\n document.head.removeChild(element);\n };\n }, [children]);\n\n return null;\n};\n","import React from \"react\";\nimport debounce from \"lodash/debounce\";\nimport { createPortal } from \"react-dom\";\nimport { ApplyStyles } from \"./apply-styles\";\nimport { SelectorIcon } from \"./icons/selector-button\";\n\nconst SelectableElement = ({\n element,\n name,\n onSelect,\n}: {\n element: HTMLElement;\n name: string;\n onSelect: (name: string) => void;\n}) => {\n const [position] = React.useState(() => {\n const { top, left, width, height } = element.getBoundingClientRect();\n const { scrollLeft, scrollTop } = document.documentElement;\n const positionLeft = left + scrollLeft;\n const positionTop = top + scrollTop;\n\n return { left: positionLeft, top: positionTop, width, height };\n });\n\n const elementRef = React.useRef<HTMLButtonElement | null>(null);\n\n React.useEffect(() => {\n // use scroll event listener\n const onScroll = debounce(\n () => {\n const { top, left, width, height } = element.getBoundingClientRect();\n const { scrollLeft, scrollTop } = document.documentElement;\n const positionLeft = left + scrollLeft;\n const positionTop = top + scrollTop;\n\n elementRef.current?.style.setProperty(\"left\", `${positionLeft}px`);\n elementRef.current?.style.setProperty(\"top\", `${positionTop}px`);\n elementRef.current?.style.setProperty(\"width\", `${width}px`);\n elementRef.current?.style.setProperty(\"height\", `${height}px`);\n elementRef.current?.style.setProperty(\"opacity\", \"1\");\n },\n 200,\n {\n leading: false,\n trailing: true,\n },\n );\n\n const opacityOnScroll = debounce(\n () => {\n elementRef.current?.style.setProperty(\"opacity\", \"0\");\n },\n 200,\n {\n leading: true,\n trailing: false,\n },\n );\n\n document.addEventListener(\"scroll\", onScroll);\n document.addEventListener(\"scroll\", opacityOnScroll);\n\n return () => {\n document.removeEventListener(\"scroll\", onScroll);\n document.removeEventListener(\"scroll\", opacityOnScroll);\n };\n }, [element]);\n\n const placement = React.useMemo(() => {\n const tooltipBaseSize = { width: 22, height: 22 };\n const nameWidth = name.length * 7.5;\n const tooltipSize = {\n width: tooltipBaseSize.width + nameWidth,\n height: tooltipBaseSize.height,\n };\n const gap = 4;\n\n // outside top start\n if (\n position.top - tooltipSize.height > 0 &&\n position.left + tooltipSize.width < window.innerWidth &&\n position.width > tooltipSize.width\n ) {\n return { left: gap / 2, top: tooltipSize.height * -1 - gap };\n }\n // inside top start\n if (\n position.height >= tooltipSize.height * 1.5 &&\n position.width >= tooltipSize.width * 1.5\n ) {\n return { left: 0 + gap, top: 0 + gap };\n }\n // outside left start\n if (position.left - tooltipSize.width > 0) {\n return { right: position.width + gap, top: 0 - 1 };\n }\n // outside right start\n if (\n position.left + position.width + tooltipSize.width <\n window.innerWidth\n ) {\n return { left: position.width + gap, top: 0 - 1 };\n }\n // outside bottom start\n if (\n position.top + position.height + tooltipSize.height <\n document.documentElement.scrollHeight\n ) {\n return { left: 0 - 1, top: position.height + gap };\n }\n\n return { left: 0, top: 0 };\n }, [position, name.length]);\n\n return (\n <button\n type=\"button\"\n className=\"selector-xray-box\"\n onClick={(event) => {\n event?.preventDefault();\n event?.stopPropagation();\n onSelect(name);\n }}\n ref={elementRef}\n style={{\n position: \"absolute\",\n ...position,\n }}\n >\n <div\n style={{\n position: \"absolute\",\n ...placement,\n }}\n className=\"selector-xray-info\"\n >\n <span className=\"selector-xray-info-icon\">\n <SelectorIcon\n width={12}\n height={12}\n style={{ pointerEvents: \"none\" }}\n />\n </span>\n <span className=\"selector-xray-info-title\">{` ${name}`}</span>\n </div>\n </button>\n );\n};\n\nexport const SelectableElements = ({\n elements,\n onSelect,\n}: {\n elements: Array<{ element: HTMLElement; name: string }>;\n onSelect: (name: string) => void;\n}) => {\n const [selectorBoxRoot, setSelectorBoxRoot] =\n React.useState<HTMLElement | null>(null);\n\n React.useEffect(() => {\n if (!selectorBoxRoot) {\n const element = document.createElement(\"div\");\n element.id = \"selector-box-root\";\n\n document.body.appendChild(element);\n\n setSelectorBoxRoot(element);\n\n return () => {\n document.body.removeChild(element);\n setSelectorBoxRoot(null);\n };\n }\n\n return () => 0;\n }, []);\n\n if (!selectorBoxRoot) return null;\n\n return (\n <>\n {createPortal(\n elements.map((element, idx) => (\n <SelectableElement\n key={`selector-element-${idx}-${element.name}`}\n {...element}\n onSelect={onSelect}\n />\n )),\n selectorBoxRoot,\n )}\n <ApplyStyles>\n {\n /* css */ `\n .selector-xray-box {\n display: flex;\n margin: 0;\n padding: 0;\n appearance: none;\n z-index: 9999;\n border: 2px dashed #47EBEB;\n border-radius: 6px;\n background: rgba(71, 235, 235, 0.01);\n transition: opacity 0.2s ease-in-out;\n cursor: crosshair;\n }\n \n .selector-xray-info {\n display: flex;\n justify-content: center;\n align-items: center;\n \n z-index: 10;\n \n padding: 3px 0;\n min-width: 22px;\n height: 22px;\n \n color: #14141F;\n background: #47EBEB;\n \n font-size: 12px;\n line-height: 16px;\n font-family: monospace;\n border-radius: 11px;\n }\n \n .selector-xray-info-icon {\n display: flex;\n min-width: 22px;\n justify-content: center;\n align-items: center;\n flex-shrink: 0;\n }\n \n .selector-xray-info-title {\n display: block;\n max-width: 0;\n overflow: hidden;\n transition-property: max-width, padding-right;\n transition-duration: 0.2s;\n transition-timing-function: ease-in-out;\n transition-delay: 0.1s;\n }\n \n .selector-xray-box:hover .selector-xray-info-title {\n max-width: 200px;\n padding-right: 8px;\n }\n `\n }\n </ApplyStyles>\n </>\n );\n};\n","import React from \"react\";\n\nexport const SelectorButtonIcon = (props: React.SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width={16}\n height={16}\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n {...props}\n >\n <path\n fill=\"#0FBDBD\"\n fillRule=\"evenodd\"\n d=\"M9 1a1 1 0 0 0-2 0v2.1A5.006 5.006 0 0 0 3.1 7H1a1 1 0 0 0 0 2h2.1A5.006 5.006 0 0 0 7 12.9V15a1 1 0 1 0 2 0v-2.1A5.006 5.006 0 0 0 12.9 9H15a1 1 0 1 0 0-2h-2.1A5.006 5.006 0 0 0 9 3.1V1Zm2 7a3 3 0 1 0-6 0 3 3 0 0 0 6 0Z\"\n clipRule=\"evenodd\"\n />\n </svg>\n);\n\nexport const SelectorIcon = (props: React.SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width={16}\n height={16}\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n {...props}\n >\n <path\n fill=\"#14141F\"\n fillRule=\"evenodd\"\n d=\"M9 1a1 1 0 0 0-2 0v2.1A5.006 5.006 0 0 0 3.1 7H1a1 1 0 0 0 0 2h2.1A5.006 5.006 0 0 0 7 12.9V15a1 1 0 1 0 2 0v-2.1A5.006 5.006 0 0 0 12.9 9H15a1 1 0 1 0 0-2h-2.1A5.006 5.006 0 0 0 9 3.1V1Zm2 7a3 3 0 1 0-6 0 3 3 0 0 0 6 0Z\"\n clipRule=\"evenodd\"\n />\n </svg>\n);\n","import * as React from \"react\";\nimport { SVGProps } from \"react\";\n\nexport const DevtoolsIcon = (props: SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width={157}\n height={25}\n viewBox=\"0 0 157 25\"\n fill=\"none\"\n {...props}\n >\n <g>\n <path fill=\"#1D1E30\" d=\"M17 1h123v24H17z\" />\n <path\n fill=\"#1D1E30\"\n d=\"M6.265 9.205A12 12 0 0 1 17.649 1H25v24H1L6.265 9.205ZM150.735 9.205A12 12 0 0 0 139.351 1H132v24h24l-5.265-15.795Z\"\n />\n <path\n fill=\"currentColor\"\n d=\"M25 14.333A1.333 1.333 0 1 1 25 17a1.333 1.333 0 0 1 0-2.667Z\"\n />\n <path\n fill=\"currentColor\"\n fillRule=\"evenodd\"\n d=\"M23.211 20.578a4 4 0 0 0 3.578 0l4-2A4 4 0 0 0 33 15v-4a4 4 0 0 0-2.211-3.578l-4-2a4 4 0 0 0-3.578 0l-4 2A4 4 0 0 0 17 11v4a4 4 0 0 0 2.211 3.578l4 2Zm-.878-4.911a2.667 2.667 0 0 0 5.334 0v-5.334a2.667 2.667 0 0 0-5.334 0v5.334Z\"\n clipRule=\"evenodd\"\n />\n <path\n fill=\"#CFD7E2\"\n d=\"M42.152 17a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h4.2c.288 0 .56.056.816.168a2.135 2.135 0 0 1 1.14 1.128c.112.256.168.532.168.828v3.984c0 .296-.056.572-.168.828a2.135 2.135 0 0 1-1.14 1.128 2.014 2.014 0 0 1-.816.168h-4.2Zm1.38-1.644h2.82a.455.455 0 0 0 .336-.132.497.497 0 0 0 .132-.348v-3.984a.455.455 0 0 0-.132-.336.436.436 0 0 0-.336-.144h-2.82v4.944Zm13.18-5.196a.244.244 0 0 1-.253.252h-4.44v1.656h4.02c.072 0 .132.024.18.072a.227.227 0 0 1 .084.18v1.128a.264.264 0 0 1-.084.192.244.244 0 0 1-.18.072h-4.02v1.644h4.44c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.116a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072h-5.832a.244.244 0 0 1-.18-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.227.227 0 0 1 .18-.084h5.832c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.128ZM63.014 17h-2.232a.387.387 0 0 1-.216-.072.356.356 0 0 1-.144-.168l-1.716-4.296a.853.853 0 0 1-.072-.24 1.783 1.783 0 0 1-.024-.264V9.032c0-.072.024-.132.072-.18a.227.227 0 0 1 .18-.084h1.128c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v2.616c0 .072.008.156.024.252s.04.176.072.24l1.284 3.216h.528l1.284-3.216a.853.853 0 0 0 .072-.24c.016-.096.024-.18.024-.252V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.128c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v2.928c0 .072-.008.16-.024.264a.853.853 0 0 1-.072.24l-1.716 4.296a.356.356 0 0 1-.144.168.387.387 0 0 1-.216.072ZM73.29 8.768c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v1.128a.227.227 0 0 1-.084.18.244.244 0 0 1-.18.072h-2.208v6.324a.264.264 0 0 1-.084.192.244.244 0 0 1-.18.072H69.69a.244.244 0 0 1-.18-.072.287.287 0 0 1-.072-.192v-6.324H67.23a.287.287 0 0 1-.192-.072.244.244 0 0 1-.072-.18V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h6.06Zm6.507.012c.296 0 .572.056.828.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v3.996c0 .288-.056.56-.168.816a2.171 2.171 0 0 1-1.128 1.128 2.043 2.043 0 0 1-.828.168h-2.34c-.296 0-.572-.056-.828-.168a2.171 2.171 0 0 1-1.128-1.128 2.014 2.014 0 0 1-.168-.816v-3.996c0-.288.056-.56.168-.816a2.171 2.171 0 0 1 1.128-1.128c.256-.112.532-.168.828-.168h2.34Zm.48 2.112a.436.436 0 0 0-.144-.336.455.455 0 0 0-.336-.132h-2.34a.497.497 0 0 0-.348.132.455.455 0 0 0-.132.336v3.996c0 .136.044.248.132.336a.497.497 0 0 0 .348.132h2.34a.455.455 0 0 0 .336-.132.436.436 0 0 0 .144-.336v-3.996Zm7.888-2.112c.295 0 .572.056.828.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v3.996c0 .288-.056.56-.168.816a2.171 2.171 0 0 1-1.128 1.128 2.043 2.043 0 0 1-.828.168h-2.34c-.297 0-.573-.056-.829-.168a2.171 2.171 0 0 1-1.127-1.128 2.014 2.014 0 0 1-.168-.816v-3.996c0-.288.056-.56.168-.816a2.171 2.171 0 0 1 1.127-1.128c.257-.112.532-.168.829-.168h2.34Zm.48 2.112a.436.436 0 0 0-.144-.336.455.455 0 0 0-.337-.132h-2.34a.497.497 0 0 0-.347.132.455.455 0 0 0-.133.336v3.996c0 .136.044.248.133.336a.497.497 0 0 0 .347.132h2.34a.455.455 0 0 0 .337-.132.436.436 0 0 0 .143-.336v-3.996ZM98.294 17H92.68a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.116c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v6.324h4.236c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.116a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072Zm7.336-5.76a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192v-.084a.455.455 0 0 0-.132-.336.436.436 0 0 0-.336-.144h-2.352a.46.46 0 0 0-.336.144.455.455 0 0 0-.132.336v.696c0 .136.044.252.132.348a.482.482 0 0 0 .336.132h2.352c.288 0 .56.056.816.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v.696c0 .296-.056.572-.168.828a2.171 2.171 0 0 1-1.128 1.128 2.014 2.014 0 0 1-.816.168h-2.352c-.288 0-.56-.056-.816-.168a2.171 2.171 0 0 1-1.128-1.128 2.043 2.043 0 0 1-.168-.828v-.084c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.116c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v.084c0 .136.044.252.132.348a.482.482 0 0 0 .336.132h2.352a.455.455 0 0 0 .336-.132.497.497 0 0 0 .132-.348v-.696a.455.455 0 0 0-.132-.336.455.455 0 0 0-.336-.132h-2.352c-.288 0-.56-.056-.816-.168a2.171 2.171 0 0 1-1.128-1.128 2.099 2.099 0 0 1-.168-.828v-.696c0-.296.056-.572.168-.828a2.171 2.171 0 0 1 1.128-1.128c.256-.112.528-.168.816-.168h2.352c.288 0 .56.056.816.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.532.168.828v.084a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072h-1.128Z\"\n />\n </g>\n </svg>\n);\n","import React from \"react\";\nimport { Placement } from \"src/interfaces/placement\";\nimport {\n getDefaultPanelSize,\n getMaxPanelHeight,\n getMaxPanelWidth,\n getPanelPosition,\n getPanelToggleTransforms,\n MIN_PANEL_HEIGHT,\n MIN_PANEL_WIDTH,\n roundToEven,\n} from \"src/utilities\";\nimport { ResizeHandleIcon } from \"./icons/resize-handle-icon\";\n\ntype Props = {\n placement: Placement;\n defaultWidth?: number;\n minWidth?: number;\n maxWidth?: number;\n defaultHeight?: number;\n minHeight?: number;\n maxHeight?: number;\n children: ({ resizing }: { resizing: string | null }) => React.ReactNode;\n onResize?: (width: number, height: number) => void;\n visible?: boolean;\n};\n\nexport const ResizablePane = ({ placement, visible, children }: Props) => {\n const [hover, setHover] = React.useState(false);\n const [resizing, setResizing] = React.useState<\n \"lx\" | \"rx\" | \"ty\" | \"by\" | null\n >(null);\n const [resizePosition, setResizePosition] = React.useState<{\n x: number;\n y: number;\n } | null>(null);\n const [panelSize, setPanelSize] = React.useState<\n Record<\"width\" | \"height\", number>\n >(() => {\n const defaultSize = getDefaultPanelSize(placement);\n\n return {\n width: roundToEven(defaultSize.width),\n height: roundToEven(defaultSize.height),\n };\n });\n\n React.useEffect(() => {\n const handleResize = () => {\n setPanelSize((p) => {\n const defaultSize = getDefaultPanelSize(placement, p);\n\n return {\n width: roundToEven(defaultSize.width),\n height: roundToEven(defaultSize.height),\n };\n });\n };\n\n handleResize();\n\n window.addEventListener(\"resize\", handleResize);\n\n return () => {\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [placement]);\n\n React.useEffect(() => {\n const handleMouseUp = () => {\n setResizing(null);\n };\n\n if (resizing !== null) {\n window.addEventListener(\"mouseup\", handleMouseUp);\n\n return () => {\n window.removeEventListener(\"mouseup\", handleMouseUp);\n };\n }\n\n return;\n }, [resizing]);\n\n React.useEffect(() => {\n const currentCursor = document.body.style.cursor;\n\n if (resizing?.includes(\"x\")) {\n document.body.style.cursor = \"col-resize\";\n } else if (resizing?.includes(\"y\")) {\n document.body.style.cursor = \"row-resize\";\n }\n\n return () => {\n document.body.style.cursor = currentCursor;\n };\n }, [resizing]);\n\n React.useEffect(() => {\n const handleMouseMove = (e: MouseEvent) => {\n if (resizing?.[1] === \"x\") {\n const diff = e.clientX - (resizePosition?.x ?? e.clientX);\n const newWidth =\n panelSize.width + (resizing === \"lx\" ? -diff : diff) * 2;\n\n setPanelSize((p) => ({\n ...p,\n width: roundToEven(\n Math.min(\n getMaxPanelWidth(placement),\n Math.max(MIN_PANEL_WIDTH, newWidth),\n ),\n ),\n }));\n } else if (resizing?.[1] === \"y\") {\n const diff = e.clientY - (resizePosition?.y ?? e.clientY);\n const newHeight =\n panelSize.height + (resizing === \"ty\" ? -diff : diff) * 1;\n\n setPanelSize((p) => ({\n ...p,\n height: roundToEven(\n Math.min(\n getMaxPanelHeight(placement),\n Math.max(MIN_PANEL_HEIGHT, newHeight),\n ),\n ),\n }));\n }\n };\n\n if (resizing !== null) {\n window.addEventListener(\"mousemove\", handleMouseMove);\n\n return () => {\n window.removeEventListener(\"mousemove\", handleMouseMove);\n };\n }\n\n return;\n }, [resizing, placement]);\n\n return (\n <div\n style={{\n position: \"absolute\",\n borderRadius: \"8px\",\n boxShadow: \"0 0 10px rgba(0, 0, 0, 0.5)\",\n border: \"1px solid rgba(0, 0, 0, 0.5)\",\n transitionProperty: \"transform, opacity\",\n transitionTimingFunction: \"ease-in-out\",\n transitionDuration: \"0.2s\",\n ...getPanelPosition(placement),\n opacity: visible ? 1 : 0,\n transform: `${\n getPanelPosition(placement).transform\n } ${getPanelToggleTransforms(visible ?? false)}`,\n ...panelSize,\n }}\n onMouseEnter={() => {\n setHover(true);\n }}\n onMouseLeave={() => {\n setHover(false);\n }}\n >\n {children({ resizing })}\n {/* */}\n <React.Fragment>\n <div\n style={{\n position: \"absolute\",\n left: 0,\n top: \"50%\",\n width: \"10px\",\n height: \"26px\",\n transform: \"translateY(-13px) translateX(-5px)\",\n cursor: \"col-resize\",\n transition: \"opacity ease-in-out 0.2s\",\n pointerEvents: hover || resizing ? \"auto\" : \"none\",\n opacity: hover || resizing ? 1 : 0,\n }}\n onMouseDown={(event) => {\n setResizing(\"lx\");\n setResizePosition({\n x: event.clientX,\n y: event.clientY,\n });\n\n event.preventDefault();\n }}\n >\n <ResizeHandleIcon />\n </div>\n <div\n style={{\n position: \"absolute\",\n right: 0,\n top: \"50%\",\n width: \"10px\",\n height: \"26px\",\n transform: \"translateY(-13px) translateX(5px)\",\n cursor: \"col-resize\",\n transition: \"opacity ease-in-out 0.2s\",\n pointerEvents: hover || resizing ? \"auto\" : \"none\",\n opacity: hover || resizing ? 1 : 0,\n }}\n onMouseDown={(event) => {\n setResizing(\"rx\");\n setResizePosition({\n x: event.clientX,\n y: event.clientY,\n });\n\n event.preventDefault();\n }}\n >\n <ResizeHandleIcon />\n </div>\n <div\n style={{\n position: \"absolute\",\n left: \"50%\",\n top: 0,\n width: \"26px\",\n height: \"10px\",\n transform: \"translateY(-5px) translateX(-13px)\",\n cursor: \"row-resize\",\n transition: \"opacity ease-in-out 0.2s\",\n pointerEvents: hover || resizing ? \"auto\" : \"none\",\n opacity: hover || resizing ? 1 : 0,\n }}\n onMouseDown={(event) => {\n setResizing(\"ty\");\n setResizePosition({\n x: event.clientX,\n y: event.clientY,\n });\n\n event.preventDefault();\n }}\n >\n <ResizeHandleIcon\n style={{\n transform: \"rotate(90deg)\",\n transformOrigin: \"13px 13px\",\n }}\n />\n </div>\n <div\n style={{\n position: \"absolute\",\n left: \"50%\",\n bottom: 0,\n width: \"26px\",\n height: \"10px\",\n transform: \"translateY(5px) translateX(-13px)\",\n cursor: \"row-resize\",\n transition: \"opacity ease-in-out 0.2s\",\n pointerEvents: hover || resizing ? \"auto\" : \"none\",\n opacity: hover || resizing ? 1 : 0,\n }}\n onMouseDown={(event) => {\n setResizing(\"by\");\n setResizePosition({\n x: event.clientX,\n y: event.clientY,\n });\n\n event.preventDefault();\n }}\n >\n <ResizeHandleIcon\n style={{\n transform: \"rotate(90deg)\",\n transformOrigin: \"13px 13px\",\n }}\n />\n </div>\n </React.Fragment>\n </div>\n );\n};\n","import { Placement } from \"src/interfaces/placement\";\n\nexport const getPanelToggleTransforms = (visible: boolean) => {\n return visible ? \"scaleX(1) translateY(0)\" : \"scaleX(0) translateY(25vw)\";\n};\n\nexport const SIZE = 50;\nexport const BUFFER = 10;\n\nconst PREFERRED_DEFAULT_WIDTH = () =>\n typeof window !== \"undefined\" ? window.innerWidth * 0.7 : 1440 * 0.7; // 70% of window width\nconst PREFERRED_DEFAULT_HEIGHT = () =>\n typeof window !== \"undefined\" ? window.innerHeight * 0.7 : 900 * 0.7; // 70% of window height\n\nexport const MIN_PANEL_WIDTH = 640;\nexport const MIN_PANEL_HEIGHT = 360;\n\nexport const getPinButtonTransform = (hover?: boolean) => {\n return `translateY(${hover ? \"0\" : \"50%\"})`;\n};\n\nexport const getPanelPosition = (placement: Placement) => {\n switch (placement) {\n case \"left\":\n return {\n left: `calc(${SIZE}px + ${BUFFER}px)`,\n top: \"50%\",\n transform: \"translateY(-50%)\",\n };\n case \"right\":\n return {\n right: `calc(${SIZE}px + ${BUFFER}px)`,\n top: \"50%\",\n transform: \"translateY(-50%)\",\n };\n case \"top\":\n return {\n left: \"50%\",\n top: `calc(${SIZE}px + ${BUFFER}px)`,\n transform: \"translateX(-50%)\",\n };\n case \"bottom\":\n return {\n left: \"50%\",\n bottom: `calc(${SIZE}px + ${BUFFER}px)`,\n transform: \"translateX(-50%)\",\n };\n }\n};\n\nexport const getMaxPanelWidth = (placement: Placement) => {\n switch (placement) {\n case \"left\":\n case \"right\":\n return (\n -BUFFER -\n SIZE -\n BUFFER +\n (typeof window !== \"undefined\" ? window.innerWidth : 1440) -\n BUFFER\n );\n case \"top\":\n case \"bottom\":\n return (\n -BUFFER +\n (typeof window !== \"undefined\" ? window.innerWidth : 1440) -\n BUFFER\n );\n }\n};\n\nexport const getMaxPanelHeight = (placement: Placement) => {\n switch (placement) {\n case \"left\":\n case \"right\":\n return (\n -BUFFER +\n (typeof window !== \"undefined\" ? window.innerHeight : 900) -\n BUFFER\n );\n case \"top\":\n case \"bottom\":\n return (\n -BUFFER -\n SIZE -\n BUFFER +\n (typeof window !== \"undefined\" ? window.innerHeight : 900) -\n BUFFER\n );\n }\n};\n\nexport const getDefaultPanelSize = (\n placement: Placement,\n preferredSize?: { width: number; height: number },\n): { width: number; height: number } => {\n const defaultPreferred = {\n width: PREFERRED_DEFAULT_WIDTH(),\n height: PREFERRED_DEFAULT_HEIGHT(),\n };\n\n const maxPanelWidth = getMaxPanelWidth(placement);\n const maxPanelHeight = getMaxPanelHeight(placement);\n\n const width = Math.min(\n maxPanelWidth,\n (preferredSize ?? defaultPreferred).width,\n );\n const height = Math.min(\n maxPanelHeight,\n (preferredSize ?? defaultPreferred).height,\n );\n\n return {\n width: width,\n height: height,\n };\n};\n\nexport const roundToEven = (num: number) => {\n const rounded = Math.round(num);\n return rounded % 2 === 0 ? rounded : rounded + 1;\n};\n","import React from \"react\";\n\nexport const ResizeHandleIcon = (props: React.SVGProps<SVGSVGElement>) => (\n <svg\n width={10}\n height={26}\n viewBox=\"0 0 10 26\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n {...props}\n >\n <rect x={0.5} y={0.5} width={9} height={25} rx={4.5} fill=\"#1D1E30\" />\n <path\n d=\"M7 5C7 6.10457 6.10457 7 5 7C3.89543 7 3 6.10457 3 5C3 3.89543 3.89543 3 5 3C6.10457 3 7 3.89543 7 5Z\"\n fill=\"#303450\"\n />\n <path\n d=\"M7 13C7 14.1046 6.10457 15 5 15C3.89543 15 3 14.1046 3 13C3 11.8954 3.89543 11 5 11C6.10457 11 7 11.8954 7 13Z\"\n fill=\"#303450\"\n />\n <path\n d=\"M7 21C7 22.1046 6.10457 23 5 23C3.89543 23 3 22.1046 3 21C3 19.8954 3.89543 19 5 19C6.10457 19 7 19.8954 7 21Z\"\n fill=\"#303450\"\n />\n <rect x={0.5} y={0.5} width={9} height={25} rx={4.5} stroke=\"#303450\" />\n </svg>\n);\n","import React from \"react\";\nimport { DevToolsContextProvider } from \"@refinedev/devtools-shared\";\n\nexport const DevtoolsProvider =\n __DEV_CONDITION__ !== \"development\"\n ? ({ children }: React.PropsWithChildren) => children as any\n : ({ children }: React.PropsWithChildren) => {\n return <DevToolsContextProvider>{children}</DevToolsContextProvider>;\n };\n"],"mappings":"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","names":["src_exports","__export","DevtoolsPanel","DevtoolsProvider","__toCommonJS","import_react","import_react","import_react","import_react","import_dom_to_fiber_utils","import_devtools_shared","useSelector","active","devtoolsUrl","React","selectableElements","setSelectableElements","fetchTraceItems","selectAppropriateFiber","start","activeTraceItems","fiber","firstParentOfNodeWithName","fiberWithStateNode","acceptedName","getUniqueNodes","nodes","uniques","node","item","traverseBodyNodes","_a","items","targetFiber","element","name","i","prepareSelector","fetchedTraceItems","traversedNodes","uniqueNodes","import_react","ApplyStyles","children","React","element","import_react","import_debounce","import_react_dom","import_react","SelectorButtonIcon","props","React","SelectorIcon","SelectableElement","element","name","onSelect","position","React","top","left","width","height","scrollLeft","scrollTop","positionLeft","positionTop","elementRef","onScroll","debounce","_a","_b","_c","_d","_e","opacityOnScroll","placement","tooltipBaseSize","nameWidth","tooltipSize","gap","event","SelectorIcon","SelectableElements","elements","selectorBoxRoot","setSelectorBoxRoot","idx","ApplyStyles","DevtoolsSelector","active","setActive","onHighlight","icon","style","selectableElements","useSelector","React","event","_a","SelectableElements","name","ApplyStyles","React","DevtoolsIcon","props","DevtoolsPin","onClick","onSelectorHighlight","selectorActive","setSelectorActive","React","DevtoolsIcon","DevtoolsSelector","SelectorButtonIcon","ApplyStyles","import_react","getPanelToggleTransforms","visible","SIZE","BUFFER","PREFERRED_DEFAULT_WIDTH","PREFERRED_DEFAULT_HEIGHT","MIN_PANEL_WIDTH","MIN_PANEL_HEIGHT","getPanelPosition","placement","SIZE","BUFFER","getMaxPanelWidth","getMaxPanelHeight","getDefaultPanelSize","preferredSize","defaultPreferred","PREFERRED_DEFAULT_WIDTH","PREFERRED_DEFAULT_HEIGHT","maxPanelWidth","maxPanelHeight","width","height","roundToEven","num","rounded","import_react","ResizeHandleIcon","props","React","ResizablePane","placement","visible","children","hover","setHover","React","resizing","setResizing","resizePosition","setResizePosition","panelSize","setPanelSize","defaultSize","getDefaultPanelSize","roundToEven","handleResize","p","handleMouseUp","currentCursor","handleMouseMove","e","diff","newWidth","getMaxPanelWidth","MIN_PANEL_WIDTH","newHeight","getMaxPanelHeight","MIN_PANEL_HEIGHT","getPanelPosition","getPanelToggleTransforms","event","ResizeHandleIcon","import_devtools_shared","DevtoolsPanel","browser","setBrowser","React","visible","setVisible","placement","devtoolsUrl","ws","width","setWidth","selectorActive","setSelectorActive","onSelectorHighlight","name","onSelectorOpen","onResize","DevtoolsPin","v","ResizablePane","resizing","import_react","import_devtools_shared","DevtoolsProvider","children","React"]}
package/dist/index.d.cts CHANGED
@@ -1,3 +1,3 @@
1
- export { DevtoolsPanel } from "./panel";
2
- export { DevtoolsProvider } from "./provider";
1
+ export { DevtoolsPanel } from "./panel.js";
2
+ export { DevtoolsProvider } from "./provider.js";
3
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC"}
package/dist/index.d.mts CHANGED
@@ -1,3 +1,3 @@
1
- export { DevtoolsPanel } from "./panel";
2
- export { DevtoolsProvider } from "./provider";
1
+ export { DevtoolsPanel } from "./panel.js";
2
+ export { DevtoolsProvider } from "./provider.js";
3
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC"}
package/dist/index.d.ts CHANGED
@@ -1,3 +1,3 @@
1
- export { DevtoolsPanel } from "./panel";
2
- export { DevtoolsProvider } from "./provider";
1
+ export { DevtoolsPanel } from "./panel.js";
2
+ export { DevtoolsProvider } from "./provider.js";
3
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC"}
package/dist/index.mjs CHANGED
@@ -1,9 +1,101 @@
1
1
  "use client"
2
- import b from"react";import M from"react";import E from"react";import{createPortal as ie}from"react-dom";import{getElementFromFiber as Q,getFiberFromElement as ee,getFirstFiberHasName as te,getFirstStateNodeFiber as oe,getNameFromFiber as _,getParentOfFiber as B}from"@aliemir/dom-to-fiber-utils";import{DevToolsContext as ne}from"@refinedev/devtools-shared";import re from"lodash-es/debounce.js";import g from"react";var O=e=>{let{devtoolsUrl:a}=g.useContext(ne),[p,s]=g.useState([]);g.useEffect(()=>{e&&fetch(`${a??"http://localhost:5001"}/api/unique-trace-items`).then(r=>r.json().then(i=>s(i.data)))},[e,a]);let[l,t]=g.useState({stateNode:null,nameFiber:null}),[n,h]=g.useState({stateNode:null,nameFiber:null,derived:!1});g.useEffect(()=>e?()=>{t({stateNode:null,nameFiber:null}),h({stateNode:null,nameFiber:null,derived:!1})}:()=>0,[e]);let w=g.useCallback(r=>{let i=r,d,x,C=!1;for(;!C&&i;)d=te(i),x=oe(d),C=p.includes(_(d)??""),C||(i=B(i));return x&&d?{stateNode:x,nameFiber:d}:{stateNode:null,nameFiber:null}},[p]),v=g.useCallback(r=>{let i=ee(r);t(w(i))},[p]);g.useEffect(()=>{(n.stateNode!==l.stateNode||n.nameFiber!==l.nameFiber)&&h({stateNode:l.stateNode,nameFiber:l.nameFiber,derived:!1})},[l]);let m=g.useRef({rect:{width:0,height:0,x:0,y:0},name:""}),{rect:o,name:c}=g.useMemo(()=>{var r;if(!e)return{rect:{width:0,height:0,x:0,y:0},name:""};if(n.stateNode||n.nameFiber){let i=n.stateNode?Q(n.stateNode):null,d=n.nameFiber?_(n.nameFiber):null;if(!i)return{rect:m.current.rect,name:d??m.current.name};let x=(r=i.getBoundingClientRect)==null?void 0:r.call(i);return x?{rect:{width:x.width,height:x.height,x:x.left,y:x.top},name:d??m.current.name}:{rect:m.current.rect,name:d??m.current.name}}return m.current},[n,e]);return m.current={rect:o,name:c},g.useEffect(()=>{if(e){let r=i=>{if(i.key==="Shift"&&n.stateNode){i.stopPropagation(),i.preventDefault();let d=B(n.nameFiber),x=w(d);if(x.nameFiber&&x.stateNode){h({...x,derived:!0});return}}};return document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)}return()=>0},[n,e]),g.useEffect(()=>{if(e){let r=null,i=re(d=>{if(d!=null&&d.target){if(r===d.target)return;v(d.target),r=d.target}},50);return document.addEventListener("mousemove",i),()=>document.removeEventListener("mousemove",i)}return()=>0},[e,v]),{rect:o,name:c}};import N from"react";import*as y from"react";var z=e=>y.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},y.createElement("path",{fill:"#303450",stroke:"url(#arrow-union-icon)",d:"M.5 8.495V15.5h15V8.495a4.5 4.5 0 0 1-3.816-2.483L9.341 1.33c-.553-1.105-2.13-1.105-2.683 0L4.317 6.012A4.5 4.5 0 0 1 .5 8.495Z"}),y.createElement("defs",null,y.createElement("linearGradient",{id:"arrow-union-icon",x1:8,x2:8,y1:0,y2:10,gradientUnits:"userSpaceOnUse"},y.createElement("stop",{stopColor:"#474E6B"}),y.createElement("stop",{offset:.9,stopColor:"#474E6B"}),y.createElement("stop",{offset:.901,stopColor:"#474E6B",stopOpacity:0}))));var W=38,Z=7,A=({width:e,height:a,x:p,y:s,name:l})=>{let t=s>W?"top":a>3*W?"inset":"bottom",n=p>Z&&s>Z?"outside":"inside";return N.createElement("div",{id:"selector-box",style:{pointerEvents:"none",position:"fixed",opacity:l?1:0,transitionProperty:"width, height, transform, opacity",transitionDuration:"0.15s",transitionTimingFunction:"ease-out",border:"1.5px solid #47EBEB",borderRadius:"4px",background:"rgba(37,160,160, 0.25)",backdropFilter:"sepia(30%) hue-rotate(180deg)",zIndex:99998,...n==="outside"?{left:-6,top:-6,width:e+10,height:a+10,transform:`translate(${p}px, ${s}px)`}:{left:0,top:0,width:e-10,height:a-20,transform:`translate(${p+4}px, ${s+4}px)`}}},N.createElement("div",{style:{position:"absolute",left:"-1.5px",background:"#303450",border:"1px solid #474E6B",borderRadius:"4px",padding:"8px 12px",fontSize:"12px",lineHeight:"16px",fontWeight:400,color:"#ffffff",display:l?"block":"none",...t==="top"&&{top:"-38px"},...t==="bottom"&&{bottom:"-38px"},...t==="inset"&&{top:"4px",left:"8px"}}},l,N.createElement(z,{style:{position:"absolute",left:"30%",...t==="top"&&{transform:"translateX(-50%) rotate(180deg)",bottom:"-9px"},...t==="bottom"&&{transform:"translateX(-50%) ",top:"-9px"},...t==="inset"&&{transform:"translateX(-50%) rotate(-90deg)",top:"8px",left:"-1px"},display:l?"block":"none"}})))};import T from"react";var G=({active:e})=>T.createElement("div",{style:{color:"white",pointerEvents:"none",position:"absolute",left:"calc(-50% - 144px - 14px)",top:"-36px",width:"max-content",borderRadius:"8px",backgroundColor:"#40414A",opacity:e?1:0,transitionDuration:"0.2s",transitionProperty:"transform,opacity",transitionTimingFunction:"ease-in-out",padding:"8px",fontSize:"12px",lineHeight:"12px",fontWeight:400,textShadow:"0 0 2px #1D1E30, 1px 0 2px #1D1E30, -1px 0 2px #1D1E30, 0 1px 2px #1D1E30, 0 -1px 2px #1D1E30"}},T.createElement("kbd",{style:{marginLeft:"4px",padding:"2px 4px",borderRadius:"2px",background:"#1D1E30",color:"#CFD7E2",border:"none",textShadow:"none"}},"shift")," ","to move to parent.",T.createElement("kbd",{style:{marginLeft:"4px",padding:"2px 4px",borderRadius:"2px",background:"#1D1E30",color:"#CFD7E2",border:"none",textShadow:"none"}},"space")," ","to highlight in monitor.");var R=({onSelectorOpen:e,onHighlight:a,icon:p,style:s})=>{let[l,t]=E.useState(!1),[n,h]=E.useState(!1),{rect:w,name:v}=O(n),[m,o]=E.useState(null);return E.useEffect(()=>{if(!m){let c=document.createElement("div");c.id="selector-box-root",document.body.appendChild(c),o(c)}},[]),E.useEffect(()=>{n?document.body.style.cursor="crosshair":document.body.style.cursor="default"},[n]),E.useEffect(()=>{let c=r=>{n&&v&&(r==null||r.preventDefault(),r==null||r.stopPropagation(),r.stopImmediatePropagation(),a(v),h(!1))};return n?(document.addEventListener("click",c,{capture:!0}),()=>{document.removeEventListener("click",c,{capture:!0})}):()=>0},[v,a,n]),E.useEffect(()=>{n&&e()},[n,e]),E.createElement("div",{style:s},E.createElement("div",{role:"button",title:"Element Selector",onMouseOver:()=>t(!0),onMouseOut:()=>t(!1),onClick:c=>{var r;c.preventDefault(),c.stopPropagation(),(r=document==null?void 0:document.activeElement)==null||r.blur(),h(i=>!i)},style:{padding:0,margin:0,height:"100%",width:"100%",transform:l?"rotate(180deg)":"rotate(0deg)",transition:"transform 0.2s ease-in-out"}},p),E.createElement(G,{active:n}),n&&m&&ie(E.createElement(A,{...w,name:v}),m))};import*as S from"react";var X=e=>S.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:157,height:25,viewBox:"0 0 157 25",fill:"none",...e},S.createElement("g",null,S.createElement("path",{fill:"#1D1E30",d:"M17 1h123v24H17z"}),S.createElement("path",{fill:"#1D1E30",d:"M6.265 9.205A12 12 0 0 1 17.649 1H25v24H1L6.265 9.205ZM150.735 9.205A12 12 0 0 0 139.351 1H132v24h24l-5.265-15.795Z"}),S.createElement("path",{fill:"currentColor",d:"M25 14.333A1.333 1.333 0 1 1 25 17a1.333 1.333 0 0 1 0-2.667Z"}),S.createElement("path",{fill:"currentColor",fillRule:"evenodd",d:"M23.211 20.578a4 4 0 0 0 3.578 0l4-2A4 4 0 0 0 33 15v-4a4 4 0 0 0-2.211-3.578l-4-2a4 4 0 0 0-3.578 0l-4 2A4 4 0 0 0 17 11v4a4 4 0 0 0 2.211 3.578l4 2Zm-.878-4.911a2.667 2.667 0 0 0 5.334 0v-5.334a2.667 2.667 0 0 0-5.334 0v5.334Z",clipRule:"evenodd"}),S.createElement("path",{fill:"#CFD7E2",d:"M42.152 17a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h4.2c.288 0 .56.056.816.168a2.135 2.135 0 0 1 1.14 1.128c.112.256.168.532.168.828v3.984c0 .296-.056.572-.168.828a2.135 2.135 0 0 1-1.14 1.128 2.014 2.014 0 0 1-.816.168h-4.2Zm1.38-1.644h2.82a.455.455 0 0 0 .336-.132.497.497 0 0 0 .132-.348v-3.984a.455.455 0 0 0-.132-.336.436.436 0 0 0-.336-.144h-2.82v4.944Zm13.18-5.196a.244.244 0 0 1-.253.252h-4.44v1.656h4.02c.072 0 .132.024.18.072a.227.227 0 0 1 .084.18v1.128a.264.264 0 0 1-.084.192.244.244 0 0 1-.18.072h-4.02v1.644h4.44c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.116a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072h-5.832a.244.244 0 0 1-.18-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.227.227 0 0 1 .18-.084h5.832c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.128ZM63.014 17h-2.232a.387.387 0 0 1-.216-.072.356.356 0 0 1-.144-.168l-1.716-4.296a.853.853 0 0 1-.072-.24 1.783 1.783 0 0 1-.024-.264V9.032c0-.072.024-.132.072-.18a.227.227 0 0 1 .18-.084h1.128c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v2.616c0 .072.008.156.024.252s.04.176.072.24l1.284 3.216h.528l1.284-3.216a.853.853 0 0 0 .072-.24c.016-.096.024-.18.024-.252V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.128c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v2.928c0 .072-.008.16-.024.264a.853.853 0 0 1-.072.24l-1.716 4.296a.356.356 0 0 1-.144.168.387.387 0 0 1-.216.072ZM73.29 8.768c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v1.128a.227.227 0 0 1-.084.18.244.244 0 0 1-.18.072h-2.208v6.324a.264.264 0 0 1-.084.192.244.244 0 0 1-.18.072H69.69a.244.244 0 0 1-.18-.072.287.287 0 0 1-.072-.192v-6.324H67.23a.287.287 0 0 1-.192-.072.244.244 0 0 1-.072-.18V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h6.06Zm6.507.012c.296 0 .572.056.828.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v3.996c0 .288-.056.56-.168.816a2.171 2.171 0 0 1-1.128 1.128 2.043 2.043 0 0 1-.828.168h-2.34c-.296 0-.572-.056-.828-.168a2.171 2.171 0 0 1-1.128-1.128 2.014 2.014 0 0 1-.168-.816v-3.996c0-.288.056-.56.168-.816a2.171 2.171 0 0 1 1.128-1.128c.256-.112.532-.168.828-.168h2.34Zm.48 2.112a.436.436 0 0 0-.144-.336.455.455 0 0 0-.336-.132h-2.34a.497.497 0 0 0-.348.132.455.455 0 0 0-.132.336v3.996c0 .136.044.248.132.336a.497.497 0 0 0 .348.132h2.34a.455.455 0 0 0 .336-.132.436.436 0 0 0 .144-.336v-3.996Zm7.888-2.112c.295 0 .572.056.828.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v3.996c0 .288-.056.56-.168.816a2.171 2.171 0 0 1-1.128 1.128 2.043 2.043 0 0 1-.828.168h-2.34c-.297 0-.573-.056-.829-.168a2.171 2.171 0 0 1-1.127-1.128 2.014 2.014 0 0 1-.168-.816v-3.996c0-.288.056-.56.168-.816a2.171 2.171 0 0 1 1.127-1.128c.257-.112.532-.168.829-.168h2.34Zm.48 2.112a.436.436 0 0 0-.144-.336.455.455 0 0 0-.337-.132h-2.34a.497.497 0 0 0-.347.132.455.455 0 0 0-.133.336v3.996c0 .136.044.248.133.336a.497.497 0 0 0 .347.132h2.34a.455.455 0 0 0 .337-.132.436.436 0 0 0 .143-.336v-3.996ZM98.294 17H92.68a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.116c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v6.324h4.236c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.116a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072Zm7.336-5.76a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192v-.084a.455.455 0 0 0-.132-.336.436.436 0 0 0-.336-.144h-2.352a.46.46 0 0 0-.336.144.455.455 0 0 0-.132.336v.696c0 .136.044.252.132.348a.482.482 0 0 0 .336.132h2.352c.288 0 .56.056.816.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v.696c0 .296-.056.572-.168.828a2.171 2.171 0 0 1-1.128 1.128 2.014 2.014 0 0 1-.816.168h-2.352c-.288 0-.56-.056-.816-.168a2.171 2.171 0 0 1-1.128-1.128 2.043 2.043 0 0 1-.168-.828v-.084c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.116c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v.084c0 .136.044.252.132.348a.482.482 0 0 0 .336.132h2.352a.455.455 0 0 0 .336-.132.497.497 0 0 0 .132-.348v-.696a.455.455 0 0 0-.132-.336.455.455 0 0 0-.336-.132h-2.352c-.288 0-.56-.056-.816-.168a2.171 2.171 0 0 1-1.128-1.128 2.099 2.099 0 0 1-.168-.828v-.696c0-.296.056-.572.168-.828a2.171 2.171 0 0 1 1.128-1.128c.256-.112.528-.168.816-.168h2.352c.288 0 .56.056.816.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.532.168.828v.084a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072h-1.128Z"})));import $ from"react";var Y=e=>$.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},$.createElement("path",{fill:"#0FBDBD",fillRule:"evenodd",d:"M9 1a1 1 0 0 0-2 0v2.1A5.006 5.006 0 0 0 3.1 7H1a1 1 0 0 0 0 2h2.1A5.006 5.006 0 0 0 7 12.9V15a1 1 0 1 0 2 0v-2.1A5.006 5.006 0 0 0 12.9 9H15a1 1 0 1 0 0-2h-2.1A5.006 5.006 0 0 0 9 3.1V1Zm2 7a3 3 0 1 0-6 0 3 3 0 0 0 6 0Z",clipRule:"evenodd"}));var U=({onClick:e,onSelectorHighlight:a,onSelectorOpen:p})=>{let[s,l]=M.useState(!1);return M.createElement("div",{onMouseOver:()=>l(!0),onMouseOut:()=>l(!1),style:{position:"relative",userSelect:"none",WebkitUserSelect:"none",background:"none",border:"none",padding:0,paddingRight:"1px",margin:0,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer",color:s?"#0FBDBD":"#6C7793",transition:"color 0.1s ease-in-out"},onClick:e},M.createElement(X,null),M.createElement(R,{style:{position:"absolute",top:5,right:18,width:"16px",height:"16px"},icon:M.createElement(Y,{width:16,height:16,style:{pointerEvents:"none"}}),onSelectorOpen:p,onHighlight:a}))};import u from"react";var j=e=>e?"scaleX(1) translateY(0)":"scaleX(0) translateY(25vw)",F=50,f=10,se=()=>typeof window<"u"?window.innerWidth*.7:1440*.7,ae=()=>typeof window<"u"?window.innerHeight*.7:900*.7,q=640,K=360;var L=e=>{switch(e){case"left":return{left:`calc(${F}px + ${f}px)`,top:"50%",transform:"translateY(-50%)"};case"right":return{right:`calc(${F}px + ${f}px)`,top:"50%",transform:"translateY(-50%)"};case"top":return{left:"50%",top:`calc(${F}px + ${f}px)`,transform:"translateX(-50%)"};case"bottom":return{left:"50%",bottom:`calc(${F}px + ${f}px)`,transform:"translateX(-50%)"}}},I=e=>{switch(e){case"left":case"right":return-f-F-f+(typeof window<"u"?window.innerWidth:1440)-f;case"top":case"bottom":return-f+(typeof window<"u"?window.innerWidth:1440)-f}},k=e=>{switch(e){case"left":case"right":return-f+(typeof window<"u"?window.innerHeight:900)-f;case"top":case"bottom":return-f-F-f+(typeof window<"u"?window.innerHeight:900)-f}},V=(e,a)=>{let p={width:se(),height:ae()},s=I(e),l=k(e),t=Math.min(s,(a??p).width),n=Math.min(l,(a??p).height);return{width:t,height:n}},P=e=>{let a=Math.round(e);return a%2===0?a:a+1};import D from"react";var H=e=>D.createElement("svg",{width:10,height:26,viewBox:"0 0 10 26",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},D.createElement("rect",{x:.5,y:.5,width:9,height:25,rx:4.5,fill:"#1D1E30"}),D.createElement("path",{d:"M7 5C7 6.10457 6.10457 7 5 7C3.89543 7 3 6.10457 3 5C3 3.89543 3.89543 3 5 3C6.10457 3 7 3.89543 7 5Z",fill:"#303450"}),D.createElement("path",{d:"M7 13C7 14.1046 6.10457 15 5 15C3.89543 15 3 14.1046 3 13C3 11.8954 3.89543 11 5 11C6.10457 11 7 11.8954 7 13Z",fill:"#303450"}),D.createElement("path",{d:"M7 21C7 22.1046 6.10457 23 5 23C3.89543 23 3 22.1046 3 21C3 19.8954 3.89543 19 5 19C6.10457 19 7 19.8954 7 21Z",fill:"#303450"}),D.createElement("rect",{x:.5,y:.5,width:9,height:25,rx:4.5,stroke:"#303450"}));var J=({placement:e,visible:a,children:p})=>{let[s,l]=u.useState(!1),[t,n]=u.useState(null),[h,w]=u.useState(null),[v,m]=u.useState(()=>{let o=V(e);return{width:P(o.width),height:P(o.height)}});return u.useEffect(()=>{let o=()=>{m(c=>{let r=V(e,c);return{width:P(r.width),height:P(r.height)}})};return o(),window.addEventListener("resize",o),()=>{window.removeEventListener("resize",o)}},[e]),u.useEffect(()=>{let o=()=>{n(null)};if(t!==null)return window.addEventListener("mouseup",o),()=>{window.removeEventListener("mouseup",o)}},[t]),u.useEffect(()=>{let o=document.body.style.cursor;return t!=null&&t.includes("x")?document.body.style.cursor="col-resize":t!=null&&t.includes("y")&&(document.body.style.cursor="row-resize"),()=>{document.body.style.cursor=o}},[t]),u.useEffect(()=>{let o=c=>{if((t==null?void 0:t[1])==="x"){let r=c.clientX-((h==null?void 0:h.x)??c.clientX),i=v.width+(t==="lx"?-r:r)*2;m(d=>({...d,width:P(Math.min(I(e),Math.max(q,i)))}))}else if((t==null?void 0:t[1])==="y"){let r=c.clientY-((h==null?void 0:h.y)??c.clientY),i=v.height+(t==="ty"?-r:r)*1;m(d=>({...d,height:P(Math.min(k(e),Math.max(K,i)))}))}};if(t!==null)return window.addEventListener("mousemove",o),()=>{window.removeEventListener("mousemove",o)}},[t,e]),u.createElement("div",{style:{position:"absolute",borderRadius:"8px",boxShadow:"0 0 10px rgba(0, 0, 0, 0.5)",border:"1px solid rgba(0, 0, 0, 0.5)",transitionProperty:"transform, opacity",transitionTimingFunction:"ease-in-out",transitionDuration:"0.2s",...L(e),opacity:a?1:0,transform:`${L(e).transform} ${j(a??!1)}`,...v},onMouseEnter:()=>{l(!0)},onMouseLeave:()=>{l(!1)}},p({resizing:t}),u.createElement(u.Fragment,null,u.createElement("div",{style:{position:"absolute",left:0,top:"50%",width:"10px",height:"26px",transform:"translateY(-13px) translateX(-5px)",cursor:"col-resize",transition:"opacity ease-in-out 0.2s",pointerEvents:s||t?"auto":"none",opacity:s||t?1:0},onMouseDown:o=>{n("lx"),w({x:o.clientX,y:o.clientY}),o.preventDefault()}},u.createElement(H,null)),u.createElement("div",{style:{position:"absolute",right:0,top:"50%",width:"10px",height:"26px",transform:"translateY(-13px) translateX(5px)",cursor:"col-resize",transition:"opacity ease-in-out 0.2s",pointerEvents:s||t?"auto":"none",opacity:s||t?1:0},onMouseDown:o=>{n("rx"),w({x:o.clientX,y:o.clientY}),o.preventDefault()}},u.createElement(H,null)),u.createElement("div",{style:{position:"absolute",left:"50%",top:0,width:"26px",height:"10px",transform:"translateY(-5px) translateX(-13px)",cursor:"row-resize",transition:"opacity ease-in-out 0.2s",pointerEvents:s||t?"auto":"none",opacity:s||t?1:0},onMouseDown:o=>{n("ty"),w({x:o.clientX,y:o.clientY}),o.preventDefault()}},u.createElement(H,{style:{transform:"rotate(90deg)",transformOrigin:"13px 13px"}})),u.createElement("div",{style:{position:"absolute",left:"50%",bottom:0,width:"26px",height:"10px",transform:"translateY(5px) translateX(-13px)",cursor:"row-resize",transition:"opacity ease-in-out 0.2s",pointerEvents:s||t?"auto":"none",opacity:s||t?1:0},onMouseDown:o=>{n("by"),w({x:o.clientX,y:o.clientY}),o.preventDefault()}},u.createElement(H,{style:{transform:"rotate(90deg)",transformOrigin:"13px 13px"}}))))};import{DevToolsContext as le,DevtoolsEvent as de,send as ce}from"@refinedev/devtools-shared";var ue=process.env.NODE_ENV!=="development"?()=>null:()=>{let[e,a]=b.useState(!1),[p,s]=b.useState(!1),[l]=b.useState("bottom"),{devtoolsUrl:t,ws:n}=b.useContext(le),[h,w]=b.useState(0),v=b.useCallback(o=>{n&&ce(n,de.DEVTOOLS_HIGHLIGHT_IN_MONITOR,{name:o}),s(!0)},[n]),m=b.useCallback(()=>{s(!1)},[]);return b.useEffect(()=>{typeof window<"u"&&a(!0)},[]),b.useEffect(()=>{if(e){w(window.innerWidth);let o=()=>{w(window.innerWidth)};return window.addEventListener("resize",o),()=>{window.removeEventListener("resize",o)}}return()=>{}},[e]),e?b.createElement("div",{style:{position:"fixed",left:`${Math.round(h/2)}px`,transform:"translateX(-50%)",bottom:0,zIndex:99999}},b.createElement(U,{onClick:()=>s(o=>!o),onSelectorHighlight:v,onSelectorOpen:m}),b.createElement(J,{visible:p,placement:l},({resizing:o})=>b.createElement("iframe",{allow:"clipboard-write;",src:t,srcDoc:t?void 0:`
2
+ import g from"react";import M from"react";import F from"react";import b from"react";import{getElementFromFiber as K,getFiberFromElement as Q,getFirstFiberHasName as ee,getFirstStateNodeFiber as te,getNameFromFiber as Z,getParentOfFiber as oe}from"@aliemir/dom-to-fiber-utils";import{DevToolsContext as ne}from"@refinedev/devtools-shared";var W=e=>{let{devtoolsUrl:s}=b.useContext(ne),[m,n]=b.useState([]),c=b.useCallback(async()=>(await(await fetch(`${s??"http://localhost:5001"}/api/unique-trace-items`)).json()).data,[s]),o=b.useCallback((r,p)=>{let t=r,h,i,x=!1;for(;!x&&t;)h=ee(t),i=te(h),x=p.includes(Z(h)??""),x||(t=oe(t));return i&&h?{stateNode:i,nameFiber:h}:{stateNode:null,nameFiber:null}},[]),l=b.useCallback(r=>{let p=[];return r.forEach(t=>{p.find(i=>i.element===t.element)||p.push(t)}),p},[]),d=b.useCallback((r,p)=>{var x;if(!r)return[];let t=[],h=Q(r),i=o(h,p);if(i.nameFiber&&i.stateNode){let w=K(i.stateNode),D=Z(i.nameFiber);w&&D&&t.push({element:w,name:D})}for(let w=0;w<((x=r==null?void 0:r.children)==null?void 0:x.length);w++)t.push(...d(r.children[w],p));return t},[o]),a=b.useCallback(async()=>{let r=await c(),p=d(document.body,r),t=l(p);n(t)},[c,d,l]);return b.useEffect(()=>{e&&a()},[e,a]),{selectableElements:m}};import re from"react";var S=({children:e})=>(re.useEffect(()=>{let s=document.createElement("style");return s.innerHTML=e,document.head.appendChild(s),()=>{document.head.removeChild(s)}},[e]),null);import f from"react";import G from"lodash-es/debounce.js";import{createPortal as ie}from"react-dom";import T from"react";var k=e=>T.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},T.createElement("path",{fill:"#0FBDBD",fillRule:"evenodd",d:"M9 1a1 1 0 0 0-2 0v2.1A5.006 5.006 0 0 0 3.1 7H1a1 1 0 0 0 0 2h2.1A5.006 5.006 0 0 0 7 12.9V15a1 1 0 1 0 2 0v-2.1A5.006 5.006 0 0 0 12.9 9H15a1 1 0 1 0 0-2h-2.1A5.006 5.006 0 0 0 9 3.1V1Zm2 7a3 3 0 1 0-6 0 3 3 0 0 0 6 0Z",clipRule:"evenodd"})),$=e=>T.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},T.createElement("path",{fill:"#14141F",fillRule:"evenodd",d:"M9 1a1 1 0 0 0-2 0v2.1A5.006 5.006 0 0 0 3.1 7H1a1 1 0 0 0 0 2h2.1A5.006 5.006 0 0 0 7 12.9V15a1 1 0 1 0 2 0v-2.1A5.006 5.006 0 0 0 12.9 9H15a1 1 0 1 0 0-2h-2.1A5.006 5.006 0 0 0 9 3.1V1Zm2 7a3 3 0 1 0-6 0 3 3 0 0 0 6 0Z",clipRule:"evenodd"}));var se=({element:e,name:s,onSelect:m})=>{let[n]=f.useState(()=>{let{top:l,left:d,width:a,height:r}=e.getBoundingClientRect(),{scrollLeft:p,scrollTop:t}=document.documentElement,h=d+p,i=l+t;return{left:h,top:i,width:a,height:r}}),c=f.useRef(null);f.useEffect(()=>{let l=G(()=>{var D,V,z,_,B;let{top:a,left:r,width:p,height:t}=e.getBoundingClientRect(),{scrollLeft:h,scrollTop:i}=document.documentElement,x=r+h,w=a+i;(D=c.current)==null||D.style.setProperty("left",`${x}px`),(V=c.current)==null||V.style.setProperty("top",`${w}px`),(z=c.current)==null||z.style.setProperty("width",`${p}px`),(_=c.current)==null||_.style.setProperty("height",`${t}px`),(B=c.current)==null||B.style.setProperty("opacity","1")},200,{leading:!1,trailing:!0}),d=G(()=>{var a;(a=c.current)==null||a.style.setProperty("opacity","0")},200,{leading:!0,trailing:!1});return document.addEventListener("scroll",l),document.addEventListener("scroll",d),()=>{document.removeEventListener("scroll",l),document.removeEventListener("scroll",d)}},[e]);let o=f.useMemo(()=>{let l={width:22,height:22},d=s.length*7.5,a={width:l.width+d,height:l.height},r=4;return n.top-a.height>0&&n.left+a.width<window.innerWidth&&n.width>a.width?{left:r/2,top:a.height*-1-r}:n.height>=a.height*1.5&&n.width>=a.width*1.5?{left:0+r,top:0+r}:n.left-a.width>0?{right:n.width+r,top:0-1}:n.left+n.width+a.width<window.innerWidth?{left:n.width+r,top:0-1}:n.top+n.height+a.height<document.documentElement.scrollHeight?{left:0-1,top:n.height+r}:{left:0,top:0}},[n,s.length]);return f.createElement("button",{type:"button",className:"selector-xray-box",onClick:l=>{l==null||l.preventDefault(),l==null||l.stopPropagation(),m(s)},ref:c,style:{position:"absolute",...n}},f.createElement("div",{style:{position:"absolute",...o},className:"selector-xray-info"},f.createElement("span",{className:"selector-xray-info-icon"},f.createElement($,{width:12,height:12,style:{pointerEvents:"none"}})),f.createElement("span",{className:"selector-xray-info-title"},` ${s}`)))},R=({elements:e,onSelect:s})=>{let[m,n]=f.useState(null);return f.useEffect(()=>{if(!m){let c=document.createElement("div");return c.id="selector-box-root",document.body.appendChild(c),n(c),()=>{document.body.removeChild(c),n(null)}}return()=>0},[]),m?f.createElement(f.Fragment,null,ie(e.map((c,o)=>f.createElement(se,{key:`selector-element-${o}-${c.name}`,...c,onSelect:s})),m),f.createElement(S,null,`
3
+ .selector-xray-box {
4
+ display: flex;
5
+ margin: 0;
6
+ padding: 0;
7
+ appearance: none;
8
+ z-index: 9999;
9
+ border: 2px dashed #47EBEB;
10
+ border-radius: 6px;
11
+ background: rgba(71, 235, 235, 0.01);
12
+ transition: opacity 0.2s ease-in-out;
13
+ cursor: crosshair;
14
+ }
15
+
16
+ .selector-xray-info {
17
+ display: flex;
18
+ justify-content: center;
19
+ align-items: center;
20
+
21
+ z-index: 10;
22
+
23
+ padding: 3px 0;
24
+ min-width: 22px;
25
+ height: 22px;
26
+
27
+ color: #14141F;
28
+ background: #47EBEB;
29
+
30
+ font-size: 12px;
31
+ line-height: 16px;
32
+ font-family: monospace;
33
+ border-radius: 11px;
34
+ }
35
+
36
+ .selector-xray-info-icon {
37
+ display: flex;
38
+ min-width: 22px;
39
+ justify-content: center;
40
+ align-items: center;
41
+ flex-shrink: 0;
42
+ }
43
+
44
+ .selector-xray-info-title {
45
+ display: block;
46
+ max-width: 0;
47
+ overflow: hidden;
48
+ transition-property: max-width, padding-right;
49
+ transition-duration: 0.2s;
50
+ transition-timing-function: ease-in-out;
51
+ transition-delay: 0.1s;
52
+ }
53
+
54
+ .selector-xray-box:hover .selector-xray-info-title {
55
+ max-width: 200px;
56
+ padding-right: 8px;
57
+ }
58
+ `)):null};var X=({active:e,setActive:s,onHighlight:m,icon:n,style:c})=>{let{selectableElements:o}=W(e);return F.createElement("div",{style:c},F.createElement("div",{role:"button",title:"Element Selector",className:"refine-devtools-selector-button",onClick:d=>{var a;d.preventDefault(),d.stopPropagation(),(a=document==null?void 0:document.activeElement)==null||a.blur(),s(r=>!r)}},n),e&&F.createElement(R,{elements:o,onSelect:d=>{m(d),s(!1)}}),F.createElement(S,null,`
59
+ .refine-devtools-selector-button {
60
+ padding: 0;
61
+ margin: 0;
62
+ height: 100%;
63
+ width: 100%;
64
+ transform: rotate(0deg);
65
+ transition: transform 0.2s ease-in-out;
66
+ }
67
+
68
+ .refine-devtools-selector-button:hover {
69
+ transform: rotate(180deg);
70
+ }
71
+ `))};import*as y from"react";var Y=e=>y.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:157,height:25,viewBox:"0 0 157 25",fill:"none",...e},y.createElement("g",null,y.createElement("path",{fill:"#1D1E30",d:"M17 1h123v24H17z"}),y.createElement("path",{fill:"#1D1E30",d:"M6.265 9.205A12 12 0 0 1 17.649 1H25v24H1L6.265 9.205ZM150.735 9.205A12 12 0 0 0 139.351 1H132v24h24l-5.265-15.795Z"}),y.createElement("path",{fill:"currentColor",d:"M25 14.333A1.333 1.333 0 1 1 25 17a1.333 1.333 0 0 1 0-2.667Z"}),y.createElement("path",{fill:"currentColor",fillRule:"evenodd",d:"M23.211 20.578a4 4 0 0 0 3.578 0l4-2A4 4 0 0 0 33 15v-4a4 4 0 0 0-2.211-3.578l-4-2a4 4 0 0 0-3.578 0l-4 2A4 4 0 0 0 17 11v4a4 4 0 0 0 2.211 3.578l4 2Zm-.878-4.911a2.667 2.667 0 0 0 5.334 0v-5.334a2.667 2.667 0 0 0-5.334 0v5.334Z",clipRule:"evenodd"}),y.createElement("path",{fill:"#CFD7E2",d:"M42.152 17a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h4.2c.288 0 .56.056.816.168a2.135 2.135 0 0 1 1.14 1.128c.112.256.168.532.168.828v3.984c0 .296-.056.572-.168.828a2.135 2.135 0 0 1-1.14 1.128 2.014 2.014 0 0 1-.816.168h-4.2Zm1.38-1.644h2.82a.455.455 0 0 0 .336-.132.497.497 0 0 0 .132-.348v-3.984a.455.455 0 0 0-.132-.336.436.436 0 0 0-.336-.144h-2.82v4.944Zm13.18-5.196a.244.244 0 0 1-.253.252h-4.44v1.656h4.02c.072 0 .132.024.18.072a.227.227 0 0 1 .084.18v1.128a.264.264 0 0 1-.084.192.244.244 0 0 1-.18.072h-4.02v1.644h4.44c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.116a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072h-5.832a.244.244 0 0 1-.18-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.227.227 0 0 1 .18-.084h5.832c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.128ZM63.014 17h-2.232a.387.387 0 0 1-.216-.072.356.356 0 0 1-.144-.168l-1.716-4.296a.853.853 0 0 1-.072-.24 1.783 1.783 0 0 1-.024-.264V9.032c0-.072.024-.132.072-.18a.227.227 0 0 1 .18-.084h1.128c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v2.616c0 .072.008.156.024.252s.04.176.072.24l1.284 3.216h.528l1.284-3.216a.853.853 0 0 0 .072-.24c.016-.096.024-.18.024-.252V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.128c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v2.928c0 .072-.008.16-.024.264a.853.853 0 0 1-.072.24l-1.716 4.296a.356.356 0 0 1-.144.168.387.387 0 0 1-.216.072ZM73.29 8.768c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v1.128a.227.227 0 0 1-.084.18.244.244 0 0 1-.18.072h-2.208v6.324a.264.264 0 0 1-.084.192.244.244 0 0 1-.18.072H69.69a.244.244 0 0 1-.18-.072.287.287 0 0 1-.072-.192v-6.324H67.23a.287.287 0 0 1-.192-.072.244.244 0 0 1-.072-.18V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h6.06Zm6.507.012c.296 0 .572.056.828.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v3.996c0 .288-.056.56-.168.816a2.171 2.171 0 0 1-1.128 1.128 2.043 2.043 0 0 1-.828.168h-2.34c-.296 0-.572-.056-.828-.168a2.171 2.171 0 0 1-1.128-1.128 2.014 2.014 0 0 1-.168-.816v-3.996c0-.288.056-.56.168-.816a2.171 2.171 0 0 1 1.128-1.128c.256-.112.532-.168.828-.168h2.34Zm.48 2.112a.436.436 0 0 0-.144-.336.455.455 0 0 0-.336-.132h-2.34a.497.497 0 0 0-.348.132.455.455 0 0 0-.132.336v3.996c0 .136.044.248.132.336a.497.497 0 0 0 .348.132h2.34a.455.455 0 0 0 .336-.132.436.436 0 0 0 .144-.336v-3.996Zm7.888-2.112c.295 0 .572.056.828.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v3.996c0 .288-.056.56-.168.816a2.171 2.171 0 0 1-1.128 1.128 2.043 2.043 0 0 1-.828.168h-2.34c-.297 0-.573-.056-.829-.168a2.171 2.171 0 0 1-1.127-1.128 2.014 2.014 0 0 1-.168-.816v-3.996c0-.288.056-.56.168-.816a2.171 2.171 0 0 1 1.127-1.128c.257-.112.532-.168.829-.168h2.34Zm.48 2.112a.436.436 0 0 0-.144-.336.455.455 0 0 0-.337-.132h-2.34a.497.497 0 0 0-.347.132.455.455 0 0 0-.133.336v3.996c0 .136.044.248.133.336a.497.497 0 0 0 .347.132h2.34a.455.455 0 0 0 .337-.132.436.436 0 0 0 .143-.336v-3.996ZM98.294 17H92.68a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192V9.032c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.116c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v6.324h4.236c.072 0 .132.028.18.084a.244.244 0 0 1 .072.18v1.116a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072Zm7.336-5.76a.287.287 0 0 1-.192-.072.287.287 0 0 1-.072-.192v-.084a.455.455 0 0 0-.132-.336.436.436 0 0 0-.336-.144h-2.352a.46.46 0 0 0-.336.144.455.455 0 0 0-.132.336v.696c0 .136.044.252.132.348a.482.482 0 0 0 .336.132h2.352c.288 0 .56.056.816.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.528.168.816v.696c0 .296-.056.572-.168.828a2.171 2.171 0 0 1-1.128 1.128 2.014 2.014 0 0 1-.816.168h-2.352c-.288 0-.56-.056-.816-.168a2.171 2.171 0 0 1-1.128-1.128 2.043 2.043 0 0 1-.168-.828v-.084c0-.072.024-.132.072-.18a.264.264 0 0 1 .192-.084h1.116c.072 0 .132.028.18.084a.227.227 0 0 1 .084.18v.084c0 .136.044.252.132.348a.482.482 0 0 0 .336.132h2.352a.455.455 0 0 0 .336-.132.497.497 0 0 0 .132-.348v-.696a.455.455 0 0 0-.132-.336.455.455 0 0 0-.336-.132h-2.352c-.288 0-.56-.056-.816-.168a2.171 2.171 0 0 1-1.128-1.128 2.099 2.099 0 0 1-.168-.828v-.696c0-.296.056-.572.168-.828a2.171 2.171 0 0 1 1.128-1.128c.256-.112.528-.168.816-.168h2.352c.288 0 .56.056.816.168a2.171 2.171 0 0 1 1.128 1.128c.112.256.168.532.168.828v.084a.287.287 0 0 1-.072.192.244.244 0 0 1-.18.072h-1.128Z"})));var O=({onClick:e,onSelectorHighlight:s,selectorActive:m,setSelectorActive:n})=>M.createElement("div",{role:"button",className:"devtools-selector-pin-box",onClick:e},M.createElement(Y,null),M.createElement(X,{style:{position:"absolute",top:5,right:18,width:"16px",height:"16px"},icon:M.createElement(k,{width:16,height:16,style:{pointerEvents:"none"}}),onHighlight:s,active:m,setActive:n}),M.createElement(S,null,`
72
+ .devtools-selector-pin-box {
73
+ z-index: 9999;
74
+ position: relative;
75
+ user-select: none;
76
+ -webkit-user-select: none;
77
+ background: none;
78
+ border: none;
79
+ padding: 0;
80
+ margin: 0;
81
+ appearance: none;
82
+ padding-right: 1px;
83
+ display: flex;
84
+ align-items: center;
85
+ justify-content: center;
86
+ cursor: pointer;
87
+ color: #6C7793;
88
+ transition: color 0.1s ease-in-out;
89
+ }
90
+
91
+ .devtools-selector-pin-box:hover {
92
+ color: #0FBDBD;
93
+ }
94
+ `));import u from"react";var U=e=>e?"scaleX(1) translateY(0)":"scaleX(0) translateY(25vw)",P=50,v=10,le=()=>typeof window<"u"?window.innerWidth*.7:1440*.7,ae=()=>typeof window<"u"?window.innerHeight*.7:900*.7,j=640,q=360;var A=e=>{switch(e){case"left":return{left:`calc(${P}px + ${v}px)`,top:"50%",transform:"translateY(-50%)"};case"right":return{right:`calc(${P}px + ${v}px)`,top:"50%",transform:"translateY(-50%)"};case"top":return{left:"50%",top:`calc(${P}px + ${v}px)`,transform:"translateX(-50%)"};case"bottom":return{left:"50%",bottom:`calc(${P}px + ${v}px)`,transform:"translateX(-50%)"}}},N=e=>{switch(e){case"left":case"right":return-v-P-v+(typeof window<"u"?window.innerWidth:1440)-v;case"top":case"bottom":return-v+(typeof window<"u"?window.innerWidth:1440)-v}},L=e=>{switch(e){case"left":case"right":return-v+(typeof window<"u"?window.innerHeight:900)-v;case"top":case"bottom":return-v-P-v+(typeof window<"u"?window.innerHeight:900)-v}},I=(e,s)=>{let m={width:le(),height:ae()},n=N(e),c=L(e),o=Math.min(n,(s??m).width),l=Math.min(c,(s??m).height);return{width:o,height:l}},E=e=>{let s=Math.round(e);return s%2===0?s:s+1};import H from"react";var C=e=>H.createElement("svg",{width:10,height:26,viewBox:"0 0 10 26",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},H.createElement("rect",{x:.5,y:.5,width:9,height:25,rx:4.5,fill:"#1D1E30"}),H.createElement("path",{d:"M7 5C7 6.10457 6.10457 7 5 7C3.89543 7 3 6.10457 3 5C3 3.89543 3.89543 3 5 3C6.10457 3 7 3.89543 7 5Z",fill:"#303450"}),H.createElement("path",{d:"M7 13C7 14.1046 6.10457 15 5 15C3.89543 15 3 14.1046 3 13C3 11.8954 3.89543 11 5 11C6.10457 11 7 11.8954 7 13Z",fill:"#303450"}),H.createElement("path",{d:"M7 21C7 22.1046 6.10457 23 5 23C3.89543 23 3 22.1046 3 21C3 19.8954 3.89543 19 5 19C6.10457 19 7 19.8954 7 21Z",fill:"#303450"}),H.createElement("rect",{x:.5,y:.5,width:9,height:25,rx:4.5,stroke:"#303450"}));var J=({placement:e,visible:s,children:m})=>{let[n,c]=u.useState(!1),[o,l]=u.useState(null),[d,a]=u.useState(null),[r,p]=u.useState(()=>{let t=I(e);return{width:E(t.width),height:E(t.height)}});return u.useEffect(()=>{let t=()=>{p(h=>{let i=I(e,h);return{width:E(i.width),height:E(i.height)}})};return t(),window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}},[e]),u.useEffect(()=>{let t=()=>{l(null)};if(o!==null)return window.addEventListener("mouseup",t),()=>{window.removeEventListener("mouseup",t)}},[o]),u.useEffect(()=>{let t=document.body.style.cursor;return o!=null&&o.includes("x")?document.body.style.cursor="col-resize":o!=null&&o.includes("y")&&(document.body.style.cursor="row-resize"),()=>{document.body.style.cursor=t}},[o]),u.useEffect(()=>{let t=h=>{if((o==null?void 0:o[1])==="x"){let i=h.clientX-((d==null?void 0:d.x)??h.clientX),x=r.width+(o==="lx"?-i:i)*2;p(w=>({...w,width:E(Math.min(N(e),Math.max(j,x)))}))}else if((o==null?void 0:o[1])==="y"){let i=h.clientY-((d==null?void 0:d.y)??h.clientY),x=r.height+(o==="ty"?-i:i)*1;p(w=>({...w,height:E(Math.min(L(e),Math.max(q,x)))}))}};if(o!==null)return window.addEventListener("mousemove",t),()=>{window.removeEventListener("mousemove",t)}},[o,e]),u.createElement("div",{style:{position:"absolute",borderRadius:"8px",boxShadow:"0 0 10px rgba(0, 0, 0, 0.5)",border:"1px solid rgba(0, 0, 0, 0.5)",transitionProperty:"transform, opacity",transitionTimingFunction:"ease-in-out",transitionDuration:"0.2s",...A(e),opacity:s?1:0,transform:`${A(e).transform} ${U(s??!1)}`,...r},onMouseEnter:()=>{c(!0)},onMouseLeave:()=>{c(!1)}},m({resizing:o}),u.createElement(u.Fragment,null,u.createElement("div",{style:{position:"absolute",left:0,top:"50%",width:"10px",height:"26px",transform:"translateY(-13px) translateX(-5px)",cursor:"col-resize",transition:"opacity ease-in-out 0.2s",pointerEvents:n||o?"auto":"none",opacity:n||o?1:0},onMouseDown:t=>{l("lx"),a({x:t.clientX,y:t.clientY}),t.preventDefault()}},u.createElement(C,null)),u.createElement("div",{style:{position:"absolute",right:0,top:"50%",width:"10px",height:"26px",transform:"translateY(-13px) translateX(5px)",cursor:"col-resize",transition:"opacity ease-in-out 0.2s",pointerEvents:n||o?"auto":"none",opacity:n||o?1:0},onMouseDown:t=>{l("rx"),a({x:t.clientX,y:t.clientY}),t.preventDefault()}},u.createElement(C,null)),u.createElement("div",{style:{position:"absolute",left:"50%",top:0,width:"26px",height:"10px",transform:"translateY(-5px) translateX(-13px)",cursor:"row-resize",transition:"opacity ease-in-out 0.2s",pointerEvents:n||o?"auto":"none",opacity:n||o?1:0},onMouseDown:t=>{l("ty"),a({x:t.clientX,y:t.clientY}),t.preventDefault()}},u.createElement(C,{style:{transform:"rotate(90deg)",transformOrigin:"13px 13px"}})),u.createElement("div",{style:{position:"absolute",left:"50%",bottom:0,width:"26px",height:"10px",transform:"translateY(5px) translateX(-13px)",cursor:"row-resize",transition:"opacity ease-in-out 0.2s",pointerEvents:n||o?"auto":"none",opacity:n||o?1:0},onMouseDown:t=>{l("by"),a({x:t.clientX,y:t.clientY}),t.preventDefault()}},u.createElement(C,{style:{transform:"rotate(90deg)",transformOrigin:"13px 13px"}}))))};import{DevToolsContext as ce,DevtoolsEvent as de,send as pe}from"@refinedev/devtools-shared";var he=process.env.NODE_ENV!=="development"?()=>null:()=>{let[e,s]=g.useState(!1),[m,n]=g.useState(!1),[c]=g.useState("bottom"),{devtoolsUrl:o,ws:l}=g.useContext(ce),[d,a]=g.useState(0),[r,p]=g.useState(!1),t=g.useCallback(i=>{l&&pe(l,de.DEVTOOLS_HIGHLIGHT_IN_MONITOR,{name:i}),n(!0)},[l]),h=g.useCallback(()=>{n(!1)},[]);return g.useEffect(()=>{r&&n(!1)},[r]),g.useEffect(()=>{typeof window<"u"&&s(!0)},[]),g.useEffect(()=>{if(e){a(window.innerWidth);let i=()=>{a(window.innerWidth)};return window.addEventListener("resize",i),()=>{window.removeEventListener("resize",i)}}return()=>{}},[e]),e?g.createElement("div",{style:{position:"fixed",left:`${Math.round(d/2)}px`,transform:"translateX(-50%)",bottom:0,zIndex:99999}},g.createElement(O,{onClick:()=>{n(i=>!i),p(!1)},onSelectorHighlight:t,selectorActive:r,setSelectorActive:p}),g.createElement(J,{visible:m,placement:c},({resizing:i})=>g.createElement("iframe",{allow:"clipboard-write;",src:o,srcDoc:o?void 0:`
3
95
  <html style="height:100%;padding:0;margin:0;">
4
96
  <body style="display:flex;justify-content:center;height:100%;padding:24px;margin:0;align-items:center;box-sizing:border-box;">
5
97
  <h1 style="font-family:ui-monospace,monospace;color:#CFD7E2;text-align:center;">Could not connect to the devtools server</h1>
6
98
  </body>
7
99
  </html>
8
- `,style:{width:"100%",height:"100%",border:"none",borderRadius:"7px",pointerEvents:o?"none":"auto",background:"#14141F"}}))):null};import pe from"react";import{DevToolsContextProvider as me}from"@refinedev/devtools-shared";var he=process.env.NODE_ENV!=="development"?({children:e})=>e:({children:e})=>pe.createElement(me,null,e);export{ue as DevtoolsPanel,he as DevtoolsProvider};
100
+ `,style:{width:"100%",height:"100%",border:"none",borderRadius:"7px",pointerEvents:i?"none":"auto",background:"#14141F"}}))):null};import ue from"react";import{DevToolsContextProvider as me}from"@refinedev/devtools-shared";var fe=process.env.NODE_ENV!=="development"?({children:e})=>e:({children:e})=>ue.createElement(me,null,e);export{he as DevtoolsPanel,fe as DevtoolsProvider};
9
101
  //# sourceMappingURL=index.mjs.map