@refinedev/devtools 1.2.17 → 2.0.2
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.
- package/dist/components/apply-styles.d.cts.map +1 -1
- package/dist/components/apply-styles.d.ts.map +1 -1
- package/dist/components/devtools-pin.d.cts.map +1 -1
- package/dist/components/devtools-pin.d.ts.map +1 -1
- package/dist/components/devtools-selector.d.cts.map +1 -1
- package/dist/components/devtools-selector.d.ts.map +1 -1
- package/dist/components/icons/arrow-union-icon.d.cts.map +1 -1
- package/dist/components/icons/arrow-union-icon.d.ts.map +1 -1
- package/dist/components/icons/devtools-icon.d.cts.map +1 -1
- package/dist/components/icons/devtools-icon.d.ts.map +1 -1
- package/dist/components/icons/resize-handle-icon.d.cts.map +1 -1
- package/dist/components/icons/resize-handle-icon.d.ts.map +1 -1
- package/dist/components/icons/selector-button.d.cts.map +1 -1
- package/dist/components/icons/selector-button.d.ts.map +1 -1
- package/dist/components/resizable-pane.d.cts.map +1 -1
- package/dist/components/resizable-pane.d.ts.map +1 -1
- package/dist/components/selectable-elements.d.cts.map +1 -1
- package/dist/components/selectable-elements.d.ts.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/index.mjs.map +1 -1
- package/dist/provider.d.cts.map +1 -1
- package/dist/provider.d.ts.map +1 -1
- package/dist/utilities/get-devtools-url-from-env.d.cts.map +1 -1
- package/dist/utilities/get-devtools-url-from-env.d.ts.map +1 -1
- package/dist/utilities/index.d.cts.map +1 -1
- package/dist/utilities/index.d.ts.map +1 -1
- package/dist/utilities/selector-helpers.d.cts.map +1 -1
- package/dist/utilities/selector-helpers.d.ts.map +1 -1
- package/dist/utilities/use-selector.d.cts.map +1 -1
- package/dist/utilities/use-selector.d.ts.map +1 -1
- package/package.json +17 -19
- package/src/utilities/selector-helpers.ts +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"apply-styles.d.ts","sourceRoot":"","sources":["../../src/components/apply-styles.tsx"],"names":[],"mappings":"AAEA,KAAK,KAAK,GAAG;IACX,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"apply-styles.d.ts","sourceRoot":"","sources":["../../src/components/apply-styles.tsx"],"names":[],"mappings":"AAEA,KAAK,KAAK,GAAG;IACX,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,cAAc,KAAK,SAY9C,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"apply-styles.d.ts","sourceRoot":"","sources":["../../src/components/apply-styles.tsx"],"names":[],"mappings":"AAEA,KAAK,KAAK,GAAG;IACX,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"apply-styles.d.ts","sourceRoot":"","sources":["../../src/components/apply-styles.tsx"],"names":[],"mappings":"AAEA,KAAK,KAAK,GAAG;IACX,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,cAAc,KAAK,SAY9C,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"devtools-pin.d.ts","sourceRoot":"","sources":["../../src/components/devtools-pin.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,KAAK,KAAK,GAAG;IACX,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;CAClE,CAAC;AAEF,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"devtools-pin.d.ts","sourceRoot":"","sources":["../../src/components/devtools-pin.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,KAAK,KAAK,GAAG;IACX,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;CAClE,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,sEAKzB,KAAK,sBAqDP,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"devtools-pin.d.ts","sourceRoot":"","sources":["../../src/components/devtools-pin.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,KAAK,KAAK,GAAG;IACX,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;CAClE,CAAC;AAEF,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"devtools-pin.d.ts","sourceRoot":"","sources":["../../src/components/devtools-pin.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,KAAK,KAAK,GAAG;IACX,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;CAClE,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,sEAKzB,KAAK,sBAqDP,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"devtools-selector.d.ts","sourceRoot":"","sources":["../../src/components/devtools-selector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,KAAK,KAAK,GAAG;IACX,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACzD,WAAW,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"devtools-selector.d.ts","sourceRoot":"","sources":["../../src/components/devtools-selector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,KAAK,KAAK,GAAG;IACX,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACzD,WAAW,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,kDAM9B,KAAK,sBA+CP,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"devtools-selector.d.ts","sourceRoot":"","sources":["../../src/components/devtools-selector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,KAAK,KAAK,GAAG;IACX,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACzD,WAAW,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"devtools-selector.d.ts","sourceRoot":"","sources":["../../src/components/devtools-selector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,KAAK,KAAK,GAAG;IACX,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACzD,WAAW,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,kDAM9B,KAAK,sBA+CP,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"arrow-union-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/arrow-union-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,eAAO,MAAM,cAAc,
|
|
1
|
+
{"version":3,"file":"arrow-union-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/arrow-union-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,eAAO,MAAM,cAAc,GAAI,OAAO,QAAQ,CAAC,aAAa,CAAC,sBA6B5D,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"arrow-union-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/arrow-union-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,eAAO,MAAM,cAAc,
|
|
1
|
+
{"version":3,"file":"arrow-union-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/arrow-union-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,eAAO,MAAM,cAAc,GAAI,OAAO,QAAQ,CAAC,aAAa,CAAC,sBA6B5D,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"devtools-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/devtools-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,eAAO,MAAM,YAAY,
|
|
1
|
+
{"version":3,"file":"devtools-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/devtools-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,eAAO,MAAM,YAAY,GAAI,OAAO,QAAQ,CAAC,aAAa,CAAC,sBA+B1D,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"devtools-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/devtools-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,eAAO,MAAM,YAAY,
|
|
1
|
+
{"version":3,"file":"devtools-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/devtools-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,eAAO,MAAM,YAAY,GAAI,OAAO,QAAQ,CAAC,aAAa,CAAC,sBA+B1D,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resize-handle-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/resize-handle-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"resize-handle-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/resize-handle-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,gBAAgB,GAAI,OAAO,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,sBAwBpE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resize-handle-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/resize-handle-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"resize-handle-icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/resize-handle-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,gBAAgB,GAAI,OAAO,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,sBAwBpE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"selector-button.d.ts","sourceRoot":"","sources":["../../../src/components/icons/selector-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"selector-button.d.ts","sourceRoot":"","sources":["../../../src/components/icons/selector-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,kBAAkB,GAAI,OAAO,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,sBAgBtE,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,sBAgBhE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"selector-button.d.ts","sourceRoot":"","sources":["../../../src/components/icons/selector-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"selector-button.d.ts","sourceRoot":"","sources":["../../../src/components/icons/selector-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,kBAAkB,GAAI,OAAO,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,sBAgBtE,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,sBAgBhE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resizable-pane.d.ts","sourceRoot":"","sources":["../../src/components/resizable-pane.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAa1D,KAAK,KAAK,GAAG;IACX,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE;QAAE,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;IACzE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,aAAa,
|
|
1
|
+
{"version":3,"file":"resizable-pane.d.ts","sourceRoot":"","sources":["../../src/components/resizable-pane.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAa1D,KAAK,KAAK,GAAG;IACX,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE;QAAE,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;IACzE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,kCAAkC,KAAK,sBA+PpE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resizable-pane.d.ts","sourceRoot":"","sources":["../../src/components/resizable-pane.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAa1D,KAAK,KAAK,GAAG;IACX,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE;QAAE,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;IACzE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,aAAa,
|
|
1
|
+
{"version":3,"file":"resizable-pane.d.ts","sourceRoot":"","sources":["../../src/components/resizable-pane.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAa1D,KAAK,KAAK,GAAG;IACX,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE;QAAE,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;IACzE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,kCAAkC,KAAK,sBA+PpE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"selectable-elements.d.ts","sourceRoot":"","sources":["../../src/components/selectable-elements.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAyJ1B,eAAO,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"selectable-elements.d.ts","sourceRoot":"","sources":["../../src/components/selectable-elements.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAyJ1B,eAAO,MAAM,kBAAkB,GAAI,yBAGhC;IACD,QAAQ,EAAE,KAAK,CAAC;QAAE,OAAO,EAAE,WAAW,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACxD,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAClC,6BAsGA,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"selectable-elements.d.ts","sourceRoot":"","sources":["../../src/components/selectable-elements.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAyJ1B,eAAO,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"selectable-elements.d.ts","sourceRoot":"","sources":["../../src/components/selectable-elements.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAyJ1B,eAAO,MAAM,kBAAkB,GAAI,yBAGhC;IACD,QAAQ,EAAE,KAAK,CAAC;QAAE,OAAO,EAAE,WAAW,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACxD,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAClC,6BAsGA,CAAC"}
|
package/dist/index.cjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client"
|
|
2
|
-
var se=Object.create;var C=Object.defineProperty;var ae=Object.getOwnPropertyDescriptor;var ce=Object.getOwnPropertyNames;var de=Object.getPrototypeOf,pe=Object.prototype.hasOwnProperty;var me=(e,t)=>{for(var r in t)C(e,r,{get:t[r],enumerable:!0})},U=(e,t,r,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of ce(t))!pe.call(e,i)&&i!==r&&C(e,i,{get:()=>t[i],enumerable:!(o=ae(t,i))||o.enumerable});return e};var g=(e,t,r)=>(r=e!=null?se(de(e)):{},U(t||!e||!e.__esModule?C(r,"default",{value:e,enumerable:!0}):r,e)),ue=e=>U(C({},"__esModule",{value:!0}),e);var Me={};me(Me,{DevtoolsPanel:()=>oe,DevtoolsProvider:()=>le});module.exports=ue(Me);var u=g(require("react"));var F=g(require("react"));var D=g(require("react"));var S=g(require("react")),k=require("@refinedev/devtools-shared");var f=require("@aliemir/dom-to-fiber-utils"),he=e=>e?e.child:null,fe=e=>{let t=e;for(;t;){let r=(0,f.getElementFromFiber)(t);if(r&&r instanceof HTMLElement)return r;t=he(t)}return null},ge=e=>{let t=e;for(;t;){let r=(0,f.getElementFromFiber)(t);if(r&&r instanceof HTMLElement)return r;t=(0,f.getParentOfFiber)(t)}return null},xe=e=>{let t=fe(e);return t?[t,"child"]:(t=ge(e),t?[t,"parent"]:[document.body,"body"])},Ee=(e,t)=>{let r=e,o=null,i=null,n=!1;for(;!n&&r;)o=(0,f.getFirstFiberHasName)(r),i=(0,f.getFirstStateNodeFiber)(o),n=t.includes((0,f.getNameFromFiber)(o)??""),n||(r=(0,f.getParentOfFiber)(r));return i&&o?{stateNode:i,nameFiber:o}:{stateNode:null,nameFiber:null}},z=e=>e.filter(t=>t.element.offsetWidth>0&&t.element.offsetHeight>0),Z=e=>{let t=[];return e.forEach(r=>{t.find(i=>i.element===r.element&&i.name===r.name)||t.push(r)}),t},L=(e,t)=>{var n;if(!e)return[];let r=[],o=(0,f.getFiberFromElement)(e),i=Ee(o,t);if(i.nameFiber){let[s]=xe(i.nameFiber),c=(0,f.getNameFromFiber)(i.nameFiber);s&&c&&r.push({element:s,name:c})}for(let s=0;s<((n=e==null?void 0:e.children)==null?void 0:n.length);s++)r.push(...L(e.children[s],t));return r};var W=e=>{let{httpUrl:t}=S.default.useContext(k.DevToolsContext),[r,o]=S.default.useState([]),i=S.default.useCallback(async()=>(await(await fetch(`${t}/api/unique-trace-items`)).json()).data,[t]),n=S.default.useCallback(async()=>{let s=await i(),c=L(document.body,s),a=z(c),d=Z(a);o(d)},[i]);return S.default.useEffect(()=>{e&&n()},[e,n]),{selectableElements:r}};var Y=g(require("react")),_=({children:e})=>(Y.default.useEffect(()=>{let t=document.createElement("style");return t.innerHTML=e,document.head.appendChild(t),()=>{document.head.removeChild(t)}},[e]),null);var h=g(require("react")),A=g(require("lodash/debounce")),K=require("react-dom");var T=g(require("react")),$=e=>T.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},T.default.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"})),G=e=>T.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},T.default.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 I=22,X=(e,t)=>{let{top:r,left:o,width:i,height:n}=e.getBoundingClientRect(),{scrollLeft:s,scrollTop:c}=t.documentElement,a=o+s-Math.max(0,I-i)/2,d=r+c-Math.max(0,I-n)/2;return{left:a,top:d,width:Math.max(I,i),height:Math.max(I,n)}},ve=({element:e,name:t,onSelect:r})=>{let[o]=h.default.useState(()=>X(e,document)),i=h.default.useRef(null);h.default.useEffect(()=>{let s=(0,A.default)(()=>{var d;let a=X(e,document);["left","top","width","height"].forEach(E=>{var l;(l=i.current)==null||l.style.setProperty(E,`${a[E]}px`)}),(d=i.current)==null||d.style.setProperty("opacity","1")},200,{leading:!1,trailing:!0}),c=(0,A.default)(()=>{var a;(a=i.current)==null||a.style.setProperty("opacity","0")},200,{leading:!0,trailing:!1});return document.addEventListener("scroll",s),document.addEventListener("scroll",c),()=>{document.removeEventListener("scroll",s),document.removeEventListener("scroll",c)}},[e]);let n=h.default.useMemo(()=>{let s={width:22,height:22},c=t.length*7.5,a={width:s.width+c,height:s.height},d=4;return o.top-a.height>0&&o.left+a.width<window.innerWidth&&o.width>a.width?{left:d/2,top:a.height*-1-d}:o.height>=a.height*1.5&&o.width>=a.width*1.5?{left:0+d,top:0+d}:o.left-a.width>0?{right:o.width+d,top:0-1}:o.left+o.width+a.width<window.innerWidth?{left:o.width+d,top:0-1}:o.top+o.height+a.height<document.documentElement.scrollHeight?{left:0-1,top:o.height+d}:{left:0,top:0}},[o,t.length]);return h.default.createElement("button",{type:"button",className:"selector-xray-box",onClick:s=>{s==null||s.preventDefault(),s==null||s.stopPropagation(),r(t)},ref:i,style:{position:"absolute",...o}},h.default.createElement("div",{style:{position:"absolute",...n},className:"selector-xray-info"},h.default.createElement("span",{className:"selector-xray-info-icon"},h.default.createElement(G,{width:12,height:12,style:{pointerEvents:"none"}})),h.default.createElement("span",{className:"selector-xray-info-title"},` ${t}`)))},j=({elements:e,onSelect:t})=>{let[r,o]=h.default.useState(null);return h.default.useEffect(()=>{if(!r){let i=document.createElement("div");return i.id="selector-box-root",document.body.appendChild(i),o(i),()=>{document.body.removeChild(i),o(null)}}return()=>0},[]),r?h.default.createElement(h.default.Fragment,null,(0,K.createPortal)(e.map((i,n)=>h.default.createElement(ve,{key:`selector-element-${n}-${i.name}`,...i,onSelect:t})),r),h.default.createElement(_,null,`
|
|
2
|
+
var se=Object.create;var C=Object.defineProperty;var ae=Object.getOwnPropertyDescriptor;var ce=Object.getOwnPropertyNames;var de=Object.getPrototypeOf,pe=Object.prototype.hasOwnProperty;var me=(e,t)=>{for(var r in t)C(e,r,{get:t[r],enumerable:!0})},U=(e,t,r,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of ce(t))!pe.call(e,i)&&i!==r&&C(e,i,{get:()=>t[i],enumerable:!(o=ae(t,i))||o.enumerable});return e};var g=(e,t,r)=>(r=e!=null?se(de(e)):{},U(t||!e||!e.__esModule?C(r,"default",{value:e,enumerable:!0}):r,e)),ue=e=>U(C({},"__esModule",{value:!0}),e);var Me={};me(Me,{DevtoolsPanel:()=>oe,DevtoolsProvider:()=>le});module.exports=ue(Me);var u=g(require("react"));var F=g(require("react"));var D=g(require("react"));var S=g(require("react")),k=require("@refinedev/devtools-shared");var f=require("@aliemir/dom-to-fiber-utils"),he=e=>e?e.child:null,fe=e=>{let t=e;for(;t;){let r=(0,f.getElementFromFiber)(t);if(r&&r instanceof HTMLElement)return r;t=he(t)}return null},ge=e=>{let t=e;for(;t;){let r=(0,f.getElementFromFiber)(t);if(r&&r instanceof HTMLElement)return r;t=(0,f.getParentOfFiber)(t)}return null},xe=e=>{let t=fe(e);return t?[t,"child"]:(t=ge(e),t?[t,"parent"]:[document.body,"body"])},Ee=(e,t)=>{let r=e,o=null,i=null,n=!1;for(;!n&&r;)o=(0,f.getFirstFiberHasName)(r),i=(0,f.getFirstStateNodeFiber)(o),n=t.includes((0,f.getNameFromFiber)(o)??""),n||(r=(0,f.getParentOfFiber)(r));return i&&o?{stateNode:i,nameFiber:o}:{stateNode:null,nameFiber:null}},z=e=>e.filter(t=>t.element.offsetWidth>0&&t.element.offsetHeight>0),Z=e=>{let t=[];return e.forEach(r=>{t.find(i=>i.element===r.element&&i.name===r.name)||t.push(r)}),t},L=(e,t)=>{var n;if(!e)return[];let r=[],o=(0,f.getFiberFromElement)(e),i=Ee(o,t);if(i.nameFiber){let[s]=xe(i.nameFiber),c=(0,f.getNameFromFiber)(i.nameFiber);s&&c&&r.push({element:s,name:c})}for(let s=0;s<(((n=e==null?void 0:e.children)==null?void 0:n.length)??0);s++)r.push(...L(e.children[s],t));return r};var W=e=>{let{httpUrl:t}=S.default.useContext(k.DevToolsContext),[r,o]=S.default.useState([]),i=S.default.useCallback(async()=>(await(await fetch(`${t}/api/unique-trace-items`)).json()).data,[t]),n=S.default.useCallback(async()=>{let s=await i(),c=L(document.body,s),a=z(c),d=Z(a);o(d)},[i]);return S.default.useEffect(()=>{e&&n()},[e,n]),{selectableElements:r}};var Y=g(require("react")),_=({children:e})=>(Y.default.useEffect(()=>{let t=document.createElement("style");return t.innerHTML=e,document.head.appendChild(t),()=>{document.head.removeChild(t)}},[e]),null);var h=g(require("react")),A=g(require("lodash/debounce")),K=require("react-dom");var T=g(require("react")),$=e=>T.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},T.default.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"})),G=e=>T.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},T.default.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 I=22,X=(e,t)=>{let{top:r,left:o,width:i,height:n}=e.getBoundingClientRect(),{scrollLeft:s,scrollTop:c}=t.documentElement,a=o+s-Math.max(0,I-i)/2,d=r+c-Math.max(0,I-n)/2;return{left:a,top:d,width:Math.max(I,i),height:Math.max(I,n)}},ve=({element:e,name:t,onSelect:r})=>{let[o]=h.default.useState(()=>X(e,document)),i=h.default.useRef(null);h.default.useEffect(()=>{let s=(0,A.default)(()=>{var d;let a=X(e,document);["left","top","width","height"].forEach(E=>{var l;(l=i.current)==null||l.style.setProperty(E,`${a[E]}px`)}),(d=i.current)==null||d.style.setProperty("opacity","1")},200,{leading:!1,trailing:!0}),c=(0,A.default)(()=>{var a;(a=i.current)==null||a.style.setProperty("opacity","0")},200,{leading:!0,trailing:!1});return document.addEventListener("scroll",s),document.addEventListener("scroll",c),()=>{document.removeEventListener("scroll",s),document.removeEventListener("scroll",c)}},[e]);let n=h.default.useMemo(()=>{let s={width:22,height:22},c=t.length*7.5,a={width:s.width+c,height:s.height},d=4;return o.top-a.height>0&&o.left+a.width<window.innerWidth&&o.width>a.width?{left:d/2,top:a.height*-1-d}:o.height>=a.height*1.5&&o.width>=a.width*1.5?{left:0+d,top:0+d}:o.left-a.width>0?{right:o.width+d,top:0-1}:o.left+o.width+a.width<window.innerWidth?{left:o.width+d,top:0-1}:o.top+o.height+a.height<document.documentElement.scrollHeight?{left:0-1,top:o.height+d}:{left:0,top:0}},[o,t.length]);return h.default.createElement("button",{type:"button",className:"selector-xray-box",onClick:s=>{s==null||s.preventDefault(),s==null||s.stopPropagation(),r(t)},ref:i,style:{position:"absolute",...o}},h.default.createElement("div",{style:{position:"absolute",...n},className:"selector-xray-info"},h.default.createElement("span",{className:"selector-xray-info-icon"},h.default.createElement(G,{width:12,height:12,style:{pointerEvents:"none"}})),h.default.createElement("span",{className:"selector-xray-info-title"},` ${t}`)))},j=({elements:e,onSelect:t})=>{let[r,o]=h.default.useState(null);return h.default.useEffect(()=>{if(!r){let i=document.createElement("div");return i.id="selector-box-root",document.body.appendChild(i),o(i),()=>{document.body.removeChild(i),o(null)}}return()=>0},[]),r?h.default.createElement(h.default.Fragment,null,(0,K.createPortal)(e.map((i,n)=>h.default.createElement(ve,{key:`selector-element-${n}-${i.name}`,...i,onSelect:t})),r),h.default.createElement(_,null,`
|
|
3
3
|
.selector-xray-box {
|
|
4
4
|
display: flex;
|
|
5
5
|
margin: 0;
|
package/dist/index.cjs.map
CHANGED
|
@@ -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/utilities/selector-helpers.ts","../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","../src/utilities/get-devtools-url-from-env.ts"],"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 type { Placement } from \"./interfaces/placement\";\n\nconst MAX_IFRAME_WAIT_TIME = 1500;\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 { httpUrl, ws } = React.useContext(DevToolsContext);\n const [width, setWidth] = React.useState<number>(0);\n const [selectorActive, setSelectorActive] = React.useState(false);\n const [iframeStatus, setIframeStatus] = React.useState<\n \"loading\" | \"loaded\" | \"failed\"\n >(\"loading\");\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 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 React.useEffect(() => {\n if (iframeStatus !== \"loaded\") {\n const onMessage = (event: MessageEvent) => {\n if (event.data.type === \"refine-devtools-iframe-loaded\") {\n setIframeStatus(\"loaded\");\n }\n };\n\n window.addEventListener(\"message\", onMessage);\n\n return () => {\n window.removeEventListener(\"message\", onMessage);\n };\n }\n\n return () => 0;\n }, []);\n\n React.useEffect(() => {\n let timeout: number;\n if (iframeStatus === \"loading\") {\n timeout = window.setTimeout(() => {\n setIframeStatus(\"failed\");\n if (timeout) {\n clearInterval(timeout);\n }\n }, MAX_IFRAME_WAIT_TIME);\n }\n return () => {\n if (typeof timeout !== \"undefined\") {\n clearInterval(timeout);\n }\n };\n }, [iframeStatus]);\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={httpUrl}\n srcDoc={\n httpUrl\n ? iframeStatus === \"failed\"\n ? failedConnectionContent\n : undefined\n : missingUrlContent\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\nconst missingUrlContent = `\n <html style=\"height:100%;padding:0;margin:0;background:#14141F;\">\n <body style=\"background:#14141F;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;font-weight:400;color:#CFD7E2;text-align:center;font-size:24px;\">Could not connect to the devtools server.</h1>\n </body>\n </html>\n `;\n\nconst failedConnectionContent = `\n <html style=\"height:100%;padding:0;margin:0;background:#14141F;\">\n <body style=\"background:#14141F;display:flex;flex-direction:column;justify-content:center;height:100%;padding:24px;margin:0;align-items:center;box-sizing:border-box;\">\n <h1 style=\"max-width:480px;min-width:480px;font-family:ui-monospace,monospace;font-weight:400;color:#CFD7E2;text-align:left;font-size:24px;margin-bottom:12px;line-height:24px;\">Devtools Server is unreachable.</h1>\n <p style=\"max-width:480px;font-family:ui-monospace,monospace;font-weight:400;color:#6C7793;text-align:left;font-size:16px;line-height:32px;\">Please make sure Refine Devtools is running and <code style=\"background:#303450;color:#A3ADC2;padding:3px 6px;border-radius:4px;\"><DevtoolsProvider /></code> has valid <code style=\"background:#303450;color:#A3ADC2;padding:3px 6px;border-radius:4px;\">url</code> prop. Environment variables may not always be available in browser depending on your project setup.</p>\n </body>\n </html>\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 <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 <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 line-height: 1;\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 { DevToolsContext } from \"@refinedev/devtools-shared\";\n\nimport {\n filterInvisibleNodes,\n getUniqueNodes,\n traverseDom,\n type SelectableElement,\n} from \"./selector-helpers\";\n\nexport const useSelector = (active: boolean) => {\n const { httpUrl } = React.useContext(DevToolsContext);\n const [selectableElements, setSelectableElements] = React.useState<\n SelectableElement[]\n >([]);\n\n const fetchTraceItems = React.useCallback(async () => {\n const response = await fetch(`${httpUrl}/api/unique-trace-items`);\n const data = await response.json();\n\n return data.data as string[];\n }, [httpUrl]);\n\n const prepareSelector = React.useCallback(async () => {\n const fetchedTraceItems = await fetchTraceItems();\n const traversedNodes = traverseDom(document.body, fetchedTraceItems);\n const filterInvisible = filterInvisibleNodes(traversedNodes);\n const uniqueNodes = getUniqueNodes(filterInvisible);\n\n setSelectableElements(uniqueNodes);\n }, [fetchTraceItems]);\n\n React.useEffect(() => {\n if (active) {\n prepareSelector();\n }\n }, [active, prepareSelector]);\n\n return {\n selectableElements,\n };\n};\n","import {\n getElementFromFiber,\n getFiberFromElement,\n getFirstFiberHasName,\n getFirstStateNodeFiber,\n getNameFromFiber,\n getParentOfFiber,\n} from \"@aliemir/dom-to-fiber-utils\";\n\ntype Fiber = Exclude<ReturnType<typeof getFiberFromElement>, null>;\n\nexport type SelectableElement = {\n element: HTMLElement;\n name: string;\n};\n\nconst getChildOfFiber = (fiber: Fiber | null) => {\n if (!fiber) {\n return null;\n }\n\n return fiber.child;\n};\n\nconst getFirstHTMLElementFromFiberByChild = (fiber: Fiber | null) => {\n let child = fiber;\n\n while (child) {\n const element = getElementFromFiber(child);\n if (element && element instanceof HTMLElement) {\n return element;\n }\n\n child = getChildOfFiber(child) as Fiber;\n }\n\n return null;\n};\n\nconst getFirstHTMLElementFromFiberByParent = (fiber: Fiber | null) => {\n let parent = fiber;\n\n while (parent) {\n const element = getElementFromFiber(parent);\n if (element && element instanceof HTMLElement) {\n return element;\n }\n\n parent = getParentOfFiber(parent) as Fiber;\n }\n\n return null;\n};\n\nconst getFirstHTMLElementFromFiber = (\n fiber: Fiber | null,\n): [element: HTMLElement, \"child\" | \"parent\" | \"body\"] => {\n let element = getFirstHTMLElementFromFiberByChild(fiber);\n\n if (element) {\n return [element, \"child\"];\n }\n\n element = getFirstHTMLElementFromFiberByParent(fiber);\n\n if (element) {\n return [element, \"parent\"];\n }\n\n return [document.body, \"body\"];\n};\n\nconst selectFiber = (start: Fiber | null, activeTraceItems: string[]) => {\n let fiber = start;\n let firstParentOfNodeWithName: Fiber | null = null;\n let fiberWithStateNode: Fiber | null = 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\nexport const filterInvisibleNodes = (nodes: SelectableElement[]) => {\n return nodes.filter(\n (item) => item.element.offsetWidth > 0 && item.element.offsetHeight > 0,\n );\n};\n\nexport const getUniqueNodes = (nodes: SelectableElement[]) => {\n const uniques: SelectableElement[] = [];\n\n nodes.forEach((node) => {\n const isElementExist = uniques.find(\n (item) => item.element === node.element && item.name === node.name,\n );\n if (!isElementExist) {\n uniques.push(node);\n }\n });\n\n return uniques;\n};\n\nexport const traverseDom = (\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 = selectFiber(fiber, activeTraceItems);\n\n if (targetFiber.nameFiber) {\n const [element] = getFirstHTMLElementFromFiber(targetFiber.nameFiber);\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 ...traverseDom(node.children[i] as HTMLElement, activeTraceItems),\n );\n }\n\n return items;\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 MIN_SIZE = 22;\n\nconst getPosition = (element: HTMLElement, document: Document) => {\n const { top, left, width, height } = element.getBoundingClientRect();\n const { scrollLeft, scrollTop } = document.documentElement;\n const positionLeft = left + scrollLeft - Math.max(0, MIN_SIZE - width) / 2;\n const positionTop = top + scrollTop - Math.max(0, MIN_SIZE - height) / 2;\n\n return {\n left: positionLeft,\n top: positionTop,\n width: Math.max(MIN_SIZE, width),\n height: Math.max(MIN_SIZE, height),\n };\n};\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(() => getPosition(element, document));\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 nextPos = getPosition(element, document);\n ([\"left\", \"top\", \"width\", \"height\"] as const).forEach((prop) => {\n elementRef.current?.style.setProperty(prop, `${nextPos[prop]}px`);\n });\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 .selector-xray-box:hover .selector-xray-info-title {\n z-index: 90;\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 type { 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 type { 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 type { 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\";\nimport { getDevtoolsUrlFromEnv } from \"./utilities/get-devtools-url-from-env\";\n\ntype Props = React.PropsWithChildren<{\n /**\n * Devtools URL to connect to the server. This will also be used for the WebSocket connections and serving the Devtools UI.\n * By default, it will use the `REFINE_DEVTOOLS_PORT` environment variable to construct to URL or use `5001` as the default port.\n * If you're using `refine dev` command, it will try to automatically set the environment variable for you and use it.\n * If environment variable is not working for you, you can manually set the URL as a string or a tuple of `[httpUrl: string, wsUrl: string]`.\n */\n url?: string | [httpUrl: string, wsUrl: string];\n}>;\n\nexport const DevtoolsProvider =\n __DEV_CONDITION__ !== \"development\"\n ? ({ children }: Props) => children as any\n : ({ children, url = getDevtoolsUrlFromEnv() }: Props) => {\n return (\n <DevToolsContextProvider url={url}>\n {children}\n </DevToolsContextProvider>\n );\n };\n","const DEFAULT_DEVTOOLS_PORT = 5001;\n\nexport const getDevtoolsUrlFromEnv = () => {\n const PORT_FROM_ENV =\n typeof __PROCESS_KEY__ !== \"undefined\" && \"env\" in __PROCESS_KEY__\n ? __PROCESS_ENV_REFINE_DEVTOOLS_PORT_KEY__ ||\n __PROCESS_ENV_NEXT_PUBLIC_REFINE_DEVTOOLS_PORT_KEY__ ||\n __PROCESS_ENV_REACT_APP_REFINE_DEVTOOLS_PORT_KEY__\n : typeof __IMPORT_META_KEY__ !== \"undefined\" && __IMPORT_META_KEY__.env\n ? __IMPORT_META_ENV_REFINE_DEVTOOLS_PORT_KEY__ ||\n __IMPORT_META_ENV_VITE_REFINE_DEVTOOLS_PORT_KEY__\n : null;\n\n const port = PORT_FROM_ENV || DEFAULT_DEVTOOLS_PORT;\n\n return [`http://localhost:${port}`, `ws://localhost:${port}`] as [\n httpUrl: string,\n wsUrl: string,\n ];\n};\n"],"mappings":"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","names":["src_exports","__export","DevtoolsPanel","DevtoolsProvider","__toCommonJS","import_react","import_react","import_react","import_react","import_devtools_shared","import_dom_to_fiber_utils","getChildOfFiber","fiber","getFirstHTMLElementFromFiberByChild","child","element","getFirstHTMLElementFromFiberByParent","parent","getFirstHTMLElementFromFiber","selectFiber","start","activeTraceItems","firstParentOfNodeWithName","fiberWithStateNode","acceptedName","filterInvisibleNodes","nodes","item","getUniqueNodes","uniques","node","traverseDom","_a","items","targetFiber","name","i","useSelector","active","httpUrl","React","selectableElements","setSelectableElements","fetchTraceItems","prepareSelector","fetchedTraceItems","traversedNodes","traverseDom","filterInvisible","filterInvisibleNodes","uniqueNodes","getUniqueNodes","import_react","ApplyStyles","children","React","element","import_react","import_debounce","import_react_dom","import_react","SelectorButtonIcon","props","React","SelectorIcon","MIN_SIZE","getPosition","element","document","top","left","width","height","scrollLeft","scrollTop","positionLeft","positionTop","SelectableElement","name","onSelect","position","React","elementRef","onScroll","debounce","_a","nextPos","prop","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","PREFERRED_DEFAULT_WIDTH","PREFERRED_DEFAULT_HEIGHT","getPanelPosition","placement","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","newHeight","getMaxPanelHeight","getPanelPosition","getPanelToggleTransforms","event","ResizeHandleIcon","import_devtools_shared","MAX_IFRAME_WAIT_TIME","DevtoolsPanel","browser","setBrowser","React","visible","setVisible","placement","httpUrl","ws","width","setWidth","selectorActive","setSelectorActive","iframeStatus","setIframeStatus","onSelectorHighlight","name","onResize","onMessage","event","timeout","DevtoolsPin","v","ResizablePane","resizing","failedConnectionContent","missingUrlContent","import_react","import_devtools_shared","import_meta","getDevtoolsUrlFromEnv","port","import_meta","DevtoolsProvider","children","url","getDevtoolsUrlFromEnv","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/utilities/selector-helpers.ts","../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","../src/utilities/get-devtools-url-from-env.ts"],"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 type { Placement } from \"./interfaces/placement\";\n\nconst MAX_IFRAME_WAIT_TIME = 1500;\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 { httpUrl, ws } = React.useContext(DevToolsContext);\n const [width, setWidth] = React.useState<number>(0);\n const [selectorActive, setSelectorActive] = React.useState(false);\n const [iframeStatus, setIframeStatus] = React.useState<\n \"loading\" | \"loaded\" | \"failed\"\n >(\"loading\");\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 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 React.useEffect(() => {\n if (iframeStatus !== \"loaded\") {\n const onMessage = (event: MessageEvent) => {\n if (event.data.type === \"refine-devtools-iframe-loaded\") {\n setIframeStatus(\"loaded\");\n }\n };\n\n window.addEventListener(\"message\", onMessage);\n\n return () => {\n window.removeEventListener(\"message\", onMessage);\n };\n }\n\n return () => 0;\n }, []);\n\n React.useEffect(() => {\n let timeout: number;\n if (iframeStatus === \"loading\") {\n timeout = window.setTimeout(() => {\n setIframeStatus(\"failed\");\n if (timeout) {\n clearInterval(timeout);\n }\n }, MAX_IFRAME_WAIT_TIME);\n }\n return () => {\n if (typeof timeout !== \"undefined\") {\n clearInterval(timeout);\n }\n };\n }, [iframeStatus]);\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={httpUrl}\n srcDoc={\n httpUrl\n ? iframeStatus === \"failed\"\n ? failedConnectionContent\n : undefined\n : missingUrlContent\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\nconst missingUrlContent = `\n <html style=\"height:100%;padding:0;margin:0;background:#14141F;\">\n <body style=\"background:#14141F;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;font-weight:400;color:#CFD7E2;text-align:center;font-size:24px;\">Could not connect to the devtools server.</h1>\n </body>\n </html>\n `;\n\nconst failedConnectionContent = `\n <html style=\"height:100%;padding:0;margin:0;background:#14141F;\">\n <body style=\"background:#14141F;display:flex;flex-direction:column;justify-content:center;height:100%;padding:24px;margin:0;align-items:center;box-sizing:border-box;\">\n <h1 style=\"max-width:480px;min-width:480px;font-family:ui-monospace,monospace;font-weight:400;color:#CFD7E2;text-align:left;font-size:24px;margin-bottom:12px;line-height:24px;\">Devtools Server is unreachable.</h1>\n <p style=\"max-width:480px;font-family:ui-monospace,monospace;font-weight:400;color:#6C7793;text-align:left;font-size:16px;line-height:32px;\">Please make sure Refine Devtools is running and <code style=\"background:#303450;color:#A3ADC2;padding:3px 6px;border-radius:4px;\"><DevtoolsProvider /></code> has valid <code style=\"background:#303450;color:#A3ADC2;padding:3px 6px;border-radius:4px;\">url</code> prop. Environment variables may not always be available in browser depending on your project setup.</p>\n </body>\n </html>\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 <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 <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 line-height: 1;\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 { DevToolsContext } from \"@refinedev/devtools-shared\";\n\nimport {\n filterInvisibleNodes,\n getUniqueNodes,\n traverseDom,\n type SelectableElement,\n} from \"./selector-helpers\";\n\nexport const useSelector = (active: boolean) => {\n const { httpUrl } = React.useContext(DevToolsContext);\n const [selectableElements, setSelectableElements] = React.useState<\n SelectableElement[]\n >([]);\n\n const fetchTraceItems = React.useCallback(async () => {\n const response = await fetch(`${httpUrl}/api/unique-trace-items`);\n const data = await response.json();\n\n return data.data as string[];\n }, [httpUrl]);\n\n const prepareSelector = React.useCallback(async () => {\n const fetchedTraceItems = await fetchTraceItems();\n const traversedNodes = traverseDom(document.body, fetchedTraceItems);\n const filterInvisible = filterInvisibleNodes(traversedNodes);\n const uniqueNodes = getUniqueNodes(filterInvisible);\n\n setSelectableElements(uniqueNodes);\n }, [fetchTraceItems]);\n\n React.useEffect(() => {\n if (active) {\n prepareSelector();\n }\n }, [active, prepareSelector]);\n\n return {\n selectableElements,\n };\n};\n","import {\n getElementFromFiber,\n getFiberFromElement,\n getFirstFiberHasName,\n getFirstStateNodeFiber,\n getNameFromFiber,\n getParentOfFiber,\n} from \"@aliemir/dom-to-fiber-utils\";\n\ntype Fiber = Exclude<ReturnType<typeof getFiberFromElement>, null>;\n\nexport type SelectableElement = {\n element: HTMLElement;\n name: string;\n};\n\nconst getChildOfFiber = (fiber: Fiber | null) => {\n if (!fiber) {\n return null;\n }\n\n return fiber.child;\n};\n\nconst getFirstHTMLElementFromFiberByChild = (fiber: Fiber | null) => {\n let child = fiber;\n\n while (child) {\n const element = getElementFromFiber(child);\n if (element && element instanceof HTMLElement) {\n return element;\n }\n\n child = getChildOfFiber(child) as Fiber;\n }\n\n return null;\n};\n\nconst getFirstHTMLElementFromFiberByParent = (fiber: Fiber | null) => {\n let parent = fiber;\n\n while (parent) {\n const element = getElementFromFiber(parent);\n if (element && element instanceof HTMLElement) {\n return element;\n }\n\n parent = getParentOfFiber(parent) as Fiber;\n }\n\n return null;\n};\n\nconst getFirstHTMLElementFromFiber = (\n fiber: Fiber | null,\n): [element: HTMLElement, \"child\" | \"parent\" | \"body\"] => {\n let element = getFirstHTMLElementFromFiberByChild(fiber);\n\n if (element) {\n return [element, \"child\"];\n }\n\n element = getFirstHTMLElementFromFiberByParent(fiber);\n\n if (element) {\n return [element, \"parent\"];\n }\n\n return [document.body, \"body\"];\n};\n\nconst selectFiber = (start: Fiber | null, activeTraceItems: string[]) => {\n let fiber = start;\n let firstParentOfNodeWithName: Fiber | null = null;\n let fiberWithStateNode: Fiber | null = 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\nexport const filterInvisibleNodes = (nodes: SelectableElement[]) => {\n return nodes.filter(\n (item) => item.element.offsetWidth > 0 && item.element.offsetHeight > 0,\n );\n};\n\nexport const getUniqueNodes = (nodes: SelectableElement[]) => {\n const uniques: SelectableElement[] = [];\n\n nodes.forEach((node) => {\n const isElementExist = uniques.find(\n (item) => item.element === node.element && item.name === node.name,\n );\n if (!isElementExist) {\n uniques.push(node);\n }\n });\n\n return uniques;\n};\n\nexport const traverseDom = (\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 = selectFiber(fiber, activeTraceItems);\n\n if (targetFiber.nameFiber) {\n const [element] = getFirstHTMLElementFromFiber(targetFiber.nameFiber);\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 ...traverseDom(node.children[i] as HTMLElement, activeTraceItems),\n );\n }\n\n return items;\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 MIN_SIZE = 22;\n\nconst getPosition = (element: HTMLElement, document: Document) => {\n const { top, left, width, height } = element.getBoundingClientRect();\n const { scrollLeft, scrollTop } = document.documentElement;\n const positionLeft = left + scrollLeft - Math.max(0, MIN_SIZE - width) / 2;\n const positionTop = top + scrollTop - Math.max(0, MIN_SIZE - height) / 2;\n\n return {\n left: positionLeft,\n top: positionTop,\n width: Math.max(MIN_SIZE, width),\n height: Math.max(MIN_SIZE, height),\n };\n};\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(() => getPosition(element, document));\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 nextPos = getPosition(element, document);\n ([\"left\", \"top\", \"width\", \"height\"] as const).forEach((prop) => {\n elementRef.current?.style.setProperty(prop, `${nextPos[prop]}px`);\n });\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 .selector-xray-box:hover .selector-xray-info-title {\n z-index: 90;\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 type { 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 type { 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 type { 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\";\nimport { getDevtoolsUrlFromEnv } from \"./utilities/get-devtools-url-from-env\";\n\ntype Props = React.PropsWithChildren<{\n /**\n * Devtools URL to connect to the server. This will also be used for the WebSocket connections and serving the Devtools UI.\n * By default, it will use the `REFINE_DEVTOOLS_PORT` environment variable to construct to URL or use `5001` as the default port.\n * If you're using `refine dev` command, it will try to automatically set the environment variable for you and use it.\n * If environment variable is not working for you, you can manually set the URL as a string or a tuple of `[httpUrl: string, wsUrl: string]`.\n */\n url?: string | [httpUrl: string, wsUrl: string];\n}>;\n\nexport const DevtoolsProvider =\n __DEV_CONDITION__ !== \"development\"\n ? ({ children }: Props) => children as any\n : ({ children, url = getDevtoolsUrlFromEnv() }: Props) => {\n return (\n <DevToolsContextProvider url={url}>\n {children}\n </DevToolsContextProvider>\n );\n };\n","const DEFAULT_DEVTOOLS_PORT = 5001;\n\nexport const getDevtoolsUrlFromEnv = () => {\n const PORT_FROM_ENV =\n typeof __PROCESS_KEY__ !== \"undefined\" && \"env\" in __PROCESS_KEY__\n ? __PROCESS_ENV_REFINE_DEVTOOLS_PORT_KEY__ ||\n __PROCESS_ENV_NEXT_PUBLIC_REFINE_DEVTOOLS_PORT_KEY__ ||\n __PROCESS_ENV_REACT_APP_REFINE_DEVTOOLS_PORT_KEY__\n : typeof __IMPORT_META_KEY__ !== \"undefined\" && __IMPORT_META_KEY__.env\n ? __IMPORT_META_ENV_REFINE_DEVTOOLS_PORT_KEY__ ||\n __IMPORT_META_ENV_VITE_REFINE_DEVTOOLS_PORT_KEY__\n : null;\n\n const port = PORT_FROM_ENV || DEFAULT_DEVTOOLS_PORT;\n\n return [`http://localhost:${port}`, `ws://localhost:${port}`] as [\n httpUrl: string,\n wsUrl: string,\n ];\n};\n"],"mappings":"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","names":["src_exports","__export","DevtoolsPanel","DevtoolsProvider","__toCommonJS","import_react","import_react","import_react","import_react","import_devtools_shared","import_dom_to_fiber_utils","getChildOfFiber","fiber","getFirstHTMLElementFromFiberByChild","child","element","getFirstHTMLElementFromFiberByParent","parent","getFirstHTMLElementFromFiber","selectFiber","start","activeTraceItems","firstParentOfNodeWithName","fiberWithStateNode","acceptedName","filterInvisibleNodes","nodes","item","getUniqueNodes","uniques","node","traverseDom","_a","items","targetFiber","name","i","useSelector","active","httpUrl","React","selectableElements","setSelectableElements","fetchTraceItems","prepareSelector","fetchedTraceItems","traversedNodes","traverseDom","filterInvisible","filterInvisibleNodes","uniqueNodes","getUniqueNodes","import_react","ApplyStyles","children","React","element","import_react","import_debounce","import_react_dom","import_react","SelectorButtonIcon","props","React","SelectorIcon","MIN_SIZE","getPosition","element","document","top","left","width","height","scrollLeft","scrollTop","positionLeft","positionTop","SelectableElement","name","onSelect","position","React","elementRef","onScroll","debounce","_a","nextPos","prop","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","PREFERRED_DEFAULT_WIDTH","PREFERRED_DEFAULT_HEIGHT","getPanelPosition","placement","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","newHeight","getMaxPanelHeight","getPanelPosition","getPanelToggleTransforms","event","ResizeHandleIcon","import_devtools_shared","MAX_IFRAME_WAIT_TIME","DevtoolsPanel","browser","setBrowser","React","visible","setVisible","placement","httpUrl","ws","width","setWidth","selectorActive","setSelectorActive","iframeStatus","setIframeStatus","onSelectorHighlight","name","onResize","onMessage","event","timeout","DevtoolsPin","v","ResizablePane","resizing","failedConnectionContent","missingUrlContent","import_react","import_devtools_shared","import_meta","getDevtoolsUrlFromEnv","port","import_meta","DevtoolsProvider","children","url","getDevtoolsUrlFromEnv","React"]}
|
package/dist/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client"
|
|
2
|
-
import u from"react";import _ from"react";import T from"react";import S from"react";import{DevToolsContext as ie}from"@refinedev/devtools-shared";import{getElementFromFiber as L,getFiberFromElement as q,getFirstFiberHasName as J,getFirstStateNodeFiber as Q,getNameFromFiber as A,getParentOfFiber as N}from"@aliemir/dom-to-fiber-utils";var ee=e=>e?e.child:null,te=e=>{let t=e;for(;t;){let r=L(t);if(r&&r instanceof HTMLElement)return r;t=ee(t)}return null},oe=e=>{let t=e;for(;t;){let r=L(t);if(r&&r instanceof HTMLElement)return r;t=N(t)}return null},ne=e=>{let t=te(e);return t?[t,"child"]:(t=oe(e),t?[t,"parent"]:[document.body,"body"])},re=(e,t)=>{let r=e,n=null,i=null,o=!1;for(;!o&&r;)n=J(r),i=Q(n),o=t.includes(A(n)??""),o||(r=N(r));return i&&n?{stateNode:i,nameFiber:n}:{stateNode:null,nameFiber:null}},O=e=>e.filter(t=>t.element.offsetWidth>0&&t.element.offsetHeight>0),V=e=>{let t=[];return e.forEach(r=>{t.find(i=>i.element===r.element&&i.name===r.name)||t.push(r)}),t},D=(e,t)=>{var o;if(!e)return[];let r=[],n=q(e),i=re(n,t);if(i.nameFiber){let[s]=ne(i.nameFiber),c=A(i.nameFiber);s&&c&&r.push({element:s,name:c})}for(let s=0;s<((o=e==null?void 0:e.children)==null?void 0:o.length);s++)r.push(...D(e.children[s],t));return r};var B=e=>{let{httpUrl:t}=S.useContext(ie),[r,n]=S.useState([]),i=S.useCallback(async()=>(await(await fetch(`${t}/api/unique-trace-items`)).json()).data,[t]),o=S.useCallback(async()=>{let s=await i(),c=D(document.body,s),a=O(c),d=V(a);n(d)},[i]);return S.useEffect(()=>{e&&o()},[e,o]),{selectableElements:r}};import le from"react";var b=({children:e})=>(le.useEffect(()=>{let t=document.createElement("style");return t.innerHTML=e,document.head.appendChild(t),()=>{document.head.removeChild(t)}},[e]),null);import h from"react";import Z from"lodash-es/debounce.js";import{createPortal as se}from"react-dom";import P from"react";var U=e=>P.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},P.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"})),z=e=>P.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},P.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 M=22,k=(e,t)=>{let{top:r,left:n,width:i,height:o}=e.getBoundingClientRect(),{scrollLeft:s,scrollTop:c}=t.documentElement,a=n+s-Math.max(0,M-i)/2,d=r+c-Math.max(0,M-o)/2;return{left:a,top:d,width:Math.max(M,i),height:Math.max(M,o)}},ae=({element:e,name:t,onSelect:r})=>{let[n]=h.useState(()=>k(e,document)),i=h.useRef(null);h.useEffect(()=>{let s=Z(()=>{var d;let a=k(e,document);["left","top","width","height"].forEach(g=>{var l;(l=i.current)==null||l.style.setProperty(g,`${a[g]}px`)}),(d=i.current)==null||d.style.setProperty("opacity","1")},200,{leading:!1,trailing:!0}),c=Z(()=>{var a;(a=i.current)==null||a.style.setProperty("opacity","0")},200,{leading:!0,trailing:!1});return document.addEventListener("scroll",s),document.addEventListener("scroll",c),()=>{document.removeEventListener("scroll",s),document.removeEventListener("scroll",c)}},[e]);let o=h.useMemo(()=>{let s={width:22,height:22},c=t.length*7.5,a={width:s.width+c,height:s.height},d=4;return n.top-a.height>0&&n.left+a.width<window.innerWidth&&n.width>a.width?{left:d/2,top:a.height*-1-d}:n.height>=a.height*1.5&&n.width>=a.width*1.5?{left:0+d,top:0+d}:n.left-a.width>0?{right:n.width+d,top:0-1}:n.left+n.width+a.width<window.innerWidth?{left:n.width+d,top:0-1}:n.top+n.height+a.height<document.documentElement.scrollHeight?{left:0-1,top:n.height+d}:{left:0,top:0}},[n,t.length]);return h.createElement("button",{type:"button",className:"selector-xray-box",onClick:s=>{s==null||s.preventDefault(),s==null||s.stopPropagation(),r(t)},ref:i,style:{position:"absolute",...n}},h.createElement("div",{style:{position:"absolute",...o},className:"selector-xray-info"},h.createElement("span",{className:"selector-xray-info-icon"},h.createElement(z,{width:12,height:12,style:{pointerEvents:"none"}})),h.createElement("span",{className:"selector-xray-info-title"},` ${t}`)))},W=({elements:e,onSelect:t})=>{let[r,n]=h.useState(null);return h.useEffect(()=>{if(!r){let i=document.createElement("div");return i.id="selector-box-root",document.body.appendChild(i),n(i),()=>{document.body.removeChild(i),n(null)}}return()=>0},[]),r?h.createElement(h.Fragment,null,se(e.map((i,o)=>h.createElement(ae,{key:`selector-element-${o}-${i.name}`,...i,onSelect:t})),r),h.createElement(b,null,`
|
|
2
|
+
import u from"react";import _ from"react";import T from"react";import S from"react";import{DevToolsContext as ie}from"@refinedev/devtools-shared";import{getElementFromFiber as L,getFiberFromElement as q,getFirstFiberHasName as J,getFirstStateNodeFiber as Q,getNameFromFiber as A,getParentOfFiber as N}from"@aliemir/dom-to-fiber-utils";var ee=e=>e?e.child:null,te=e=>{let t=e;for(;t;){let r=L(t);if(r&&r instanceof HTMLElement)return r;t=ee(t)}return null},oe=e=>{let t=e;for(;t;){let r=L(t);if(r&&r instanceof HTMLElement)return r;t=N(t)}return null},ne=e=>{let t=te(e);return t?[t,"child"]:(t=oe(e),t?[t,"parent"]:[document.body,"body"])},re=(e,t)=>{let r=e,n=null,i=null,o=!1;for(;!o&&r;)n=J(r),i=Q(n),o=t.includes(A(n)??""),o||(r=N(r));return i&&n?{stateNode:i,nameFiber:n}:{stateNode:null,nameFiber:null}},O=e=>e.filter(t=>t.element.offsetWidth>0&&t.element.offsetHeight>0),V=e=>{let t=[];return e.forEach(r=>{t.find(i=>i.element===r.element&&i.name===r.name)||t.push(r)}),t},D=(e,t)=>{var o;if(!e)return[];let r=[],n=q(e),i=re(n,t);if(i.nameFiber){let[s]=ne(i.nameFiber),c=A(i.nameFiber);s&&c&&r.push({element:s,name:c})}for(let s=0;s<(((o=e==null?void 0:e.children)==null?void 0:o.length)??0);s++)r.push(...D(e.children[s],t));return r};var B=e=>{let{httpUrl:t}=S.useContext(ie),[r,n]=S.useState([]),i=S.useCallback(async()=>(await(await fetch(`${t}/api/unique-trace-items`)).json()).data,[t]),o=S.useCallback(async()=>{let s=await i(),c=D(document.body,s),a=O(c),d=V(a);n(d)},[i]);return S.useEffect(()=>{e&&o()},[e,o]),{selectableElements:r}};import le from"react";var b=({children:e})=>(le.useEffect(()=>{let t=document.createElement("style");return t.innerHTML=e,document.head.appendChild(t),()=>{document.head.removeChild(t)}},[e]),null);import h from"react";import Z from"lodash-es/debounce.js";import{createPortal as se}from"react-dom";import P from"react";var U=e=>P.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},P.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"})),z=e=>P.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 16 16",fill:"none",...e},P.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 M=22,k=(e,t)=>{let{top:r,left:n,width:i,height:o}=e.getBoundingClientRect(),{scrollLeft:s,scrollTop:c}=t.documentElement,a=n+s-Math.max(0,M-i)/2,d=r+c-Math.max(0,M-o)/2;return{left:a,top:d,width:Math.max(M,i),height:Math.max(M,o)}},ae=({element:e,name:t,onSelect:r})=>{let[n]=h.useState(()=>k(e,document)),i=h.useRef(null);h.useEffect(()=>{let s=Z(()=>{var d;let a=k(e,document);["left","top","width","height"].forEach(g=>{var l;(l=i.current)==null||l.style.setProperty(g,`${a[g]}px`)}),(d=i.current)==null||d.style.setProperty("opacity","1")},200,{leading:!1,trailing:!0}),c=Z(()=>{var a;(a=i.current)==null||a.style.setProperty("opacity","0")},200,{leading:!0,trailing:!1});return document.addEventListener("scroll",s),document.addEventListener("scroll",c),()=>{document.removeEventListener("scroll",s),document.removeEventListener("scroll",c)}},[e]);let o=h.useMemo(()=>{let s={width:22,height:22},c=t.length*7.5,a={width:s.width+c,height:s.height},d=4;return n.top-a.height>0&&n.left+a.width<window.innerWidth&&n.width>a.width?{left:d/2,top:a.height*-1-d}:n.height>=a.height*1.5&&n.width>=a.width*1.5?{left:0+d,top:0+d}:n.left-a.width>0?{right:n.width+d,top:0-1}:n.left+n.width+a.width<window.innerWidth?{left:n.width+d,top:0-1}:n.top+n.height+a.height<document.documentElement.scrollHeight?{left:0-1,top:n.height+d}:{left:0,top:0}},[n,t.length]);return h.createElement("button",{type:"button",className:"selector-xray-box",onClick:s=>{s==null||s.preventDefault(),s==null||s.stopPropagation(),r(t)},ref:i,style:{position:"absolute",...n}},h.createElement("div",{style:{position:"absolute",...o},className:"selector-xray-info"},h.createElement("span",{className:"selector-xray-info-icon"},h.createElement(z,{width:12,height:12,style:{pointerEvents:"none"}})),h.createElement("span",{className:"selector-xray-info-title"},` ${t}`)))},W=({elements:e,onSelect:t})=>{let[r,n]=h.useState(null);return h.useEffect(()=>{if(!r){let i=document.createElement("div");return i.id="selector-box-root",document.body.appendChild(i),n(i),()=>{document.body.removeChild(i),n(null)}}return()=>0},[]),r?h.createElement(h.Fragment,null,se(e.map((i,o)=>h.createElement(ae,{key:`selector-element-${o}-${i.name}`,...i,onSelect:t})),r),h.createElement(b,null,`
|
|
3
3
|
.selector-xray-box {
|
|
4
4
|
display: flex;
|
|
5
5
|
margin: 0;
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/panel.tsx","../src/components/devtools-pin.tsx","../src/components/devtools-selector.tsx","../src/utilities/use-selector.tsx","../src/utilities/selector-helpers.ts","../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","../src/utilities/get-devtools-url-from-env.ts"],"sourcesContent":["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 type { Placement } from \"./interfaces/placement\";\n\nconst MAX_IFRAME_WAIT_TIME = 1500;\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 { httpUrl, ws } = React.useContext(DevToolsContext);\n const [width, setWidth] = React.useState<number>(0);\n const [selectorActive, setSelectorActive] = React.useState(false);\n const [iframeStatus, setIframeStatus] = React.useState<\n \"loading\" | \"loaded\" | \"failed\"\n >(\"loading\");\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 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 React.useEffect(() => {\n if (iframeStatus !== \"loaded\") {\n const onMessage = (event: MessageEvent) => {\n if (event.data.type === \"refine-devtools-iframe-loaded\") {\n setIframeStatus(\"loaded\");\n }\n };\n\n window.addEventListener(\"message\", onMessage);\n\n return () => {\n window.removeEventListener(\"message\", onMessage);\n };\n }\n\n return () => 0;\n }, []);\n\n React.useEffect(() => {\n let timeout: number;\n if (iframeStatus === \"loading\") {\n timeout = window.setTimeout(() => {\n setIframeStatus(\"failed\");\n if (timeout) {\n clearInterval(timeout);\n }\n }, MAX_IFRAME_WAIT_TIME);\n }\n return () => {\n if (typeof timeout !== \"undefined\") {\n clearInterval(timeout);\n }\n };\n }, [iframeStatus]);\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={httpUrl}\n srcDoc={\n httpUrl\n ? iframeStatus === \"failed\"\n ? failedConnectionContent\n : undefined\n : missingUrlContent\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\nconst missingUrlContent = `\n <html style=\"height:100%;padding:0;margin:0;background:#14141F;\">\n <body style=\"background:#14141F;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;font-weight:400;color:#CFD7E2;text-align:center;font-size:24px;\">Could not connect to the devtools server.</h1>\n </body>\n </html>\n `;\n\nconst failedConnectionContent = `\n <html style=\"height:100%;padding:0;margin:0;background:#14141F;\">\n <body style=\"background:#14141F;display:flex;flex-direction:column;justify-content:center;height:100%;padding:24px;margin:0;align-items:center;box-sizing:border-box;\">\n <h1 style=\"max-width:480px;min-width:480px;font-family:ui-monospace,monospace;font-weight:400;color:#CFD7E2;text-align:left;font-size:24px;margin-bottom:12px;line-height:24px;\">Devtools Server is unreachable.</h1>\n <p style=\"max-width:480px;font-family:ui-monospace,monospace;font-weight:400;color:#6C7793;text-align:left;font-size:16px;line-height:32px;\">Please make sure Refine Devtools is running and <code style=\"background:#303450;color:#A3ADC2;padding:3px 6px;border-radius:4px;\"><DevtoolsProvider /></code> has valid <code style=\"background:#303450;color:#A3ADC2;padding:3px 6px;border-radius:4px;\">url</code> prop. Environment variables may not always be available in browser depending on your project setup.</p>\n </body>\n </html>\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 <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 <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 line-height: 1;\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 { DevToolsContext } from \"@refinedev/devtools-shared\";\n\nimport {\n filterInvisibleNodes,\n getUniqueNodes,\n traverseDom,\n type SelectableElement,\n} from \"./selector-helpers\";\n\nexport const useSelector = (active: boolean) => {\n const { httpUrl } = React.useContext(DevToolsContext);\n const [selectableElements, setSelectableElements] = React.useState<\n SelectableElement[]\n >([]);\n\n const fetchTraceItems = React.useCallback(async () => {\n const response = await fetch(`${httpUrl}/api/unique-trace-items`);\n const data = await response.json();\n\n return data.data as string[];\n }, [httpUrl]);\n\n const prepareSelector = React.useCallback(async () => {\n const fetchedTraceItems = await fetchTraceItems();\n const traversedNodes = traverseDom(document.body, fetchedTraceItems);\n const filterInvisible = filterInvisibleNodes(traversedNodes);\n const uniqueNodes = getUniqueNodes(filterInvisible);\n\n setSelectableElements(uniqueNodes);\n }, [fetchTraceItems]);\n\n React.useEffect(() => {\n if (active) {\n prepareSelector();\n }\n }, [active, prepareSelector]);\n\n return {\n selectableElements,\n };\n};\n","import {\n getElementFromFiber,\n getFiberFromElement,\n getFirstFiberHasName,\n getFirstStateNodeFiber,\n getNameFromFiber,\n getParentOfFiber,\n} from \"@aliemir/dom-to-fiber-utils\";\n\ntype Fiber = Exclude<ReturnType<typeof getFiberFromElement>, null>;\n\nexport type SelectableElement = {\n element: HTMLElement;\n name: string;\n};\n\nconst getChildOfFiber = (fiber: Fiber | null) => {\n if (!fiber) {\n return null;\n }\n\n return fiber.child;\n};\n\nconst getFirstHTMLElementFromFiberByChild = (fiber: Fiber | null) => {\n let child = fiber;\n\n while (child) {\n const element = getElementFromFiber(child);\n if (element && element instanceof HTMLElement) {\n return element;\n }\n\n child = getChildOfFiber(child) as Fiber;\n }\n\n return null;\n};\n\nconst getFirstHTMLElementFromFiberByParent = (fiber: Fiber | null) => {\n let parent = fiber;\n\n while (parent) {\n const element = getElementFromFiber(parent);\n if (element && element instanceof HTMLElement) {\n return element;\n }\n\n parent = getParentOfFiber(parent) as Fiber;\n }\n\n return null;\n};\n\nconst getFirstHTMLElementFromFiber = (\n fiber: Fiber | null,\n): [element: HTMLElement, \"child\" | \"parent\" | \"body\"] => {\n let element = getFirstHTMLElementFromFiberByChild(fiber);\n\n if (element) {\n return [element, \"child\"];\n }\n\n element = getFirstHTMLElementFromFiberByParent(fiber);\n\n if (element) {\n return [element, \"parent\"];\n }\n\n return [document.body, \"body\"];\n};\n\nconst selectFiber = (start: Fiber | null, activeTraceItems: string[]) => {\n let fiber = start;\n let firstParentOfNodeWithName: Fiber | null = null;\n let fiberWithStateNode: Fiber | null = 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\nexport const filterInvisibleNodes = (nodes: SelectableElement[]) => {\n return nodes.filter(\n (item) => item.element.offsetWidth > 0 && item.element.offsetHeight > 0,\n );\n};\n\nexport const getUniqueNodes = (nodes: SelectableElement[]) => {\n const uniques: SelectableElement[] = [];\n\n nodes.forEach((node) => {\n const isElementExist = uniques.find(\n (item) => item.element === node.element && item.name === node.name,\n );\n if (!isElementExist) {\n uniques.push(node);\n }\n });\n\n return uniques;\n};\n\nexport const traverseDom = (\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 = selectFiber(fiber, activeTraceItems);\n\n if (targetFiber.nameFiber) {\n const [element] = getFirstHTMLElementFromFiber(targetFiber.nameFiber);\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 ...traverseDom(node.children[i] as HTMLElement, activeTraceItems),\n );\n }\n\n return items;\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-es/debounce.js\";\nimport { createPortal } from \"react-dom\";\nimport { ApplyStyles } from \"./apply-styles\";\nimport { SelectorIcon } from \"./icons/selector-button\";\n\nconst MIN_SIZE = 22;\n\nconst getPosition = (element: HTMLElement, document: Document) => {\n const { top, left, width, height } = element.getBoundingClientRect();\n const { scrollLeft, scrollTop } = document.documentElement;\n const positionLeft = left + scrollLeft - Math.max(0, MIN_SIZE - width) / 2;\n const positionTop = top + scrollTop - Math.max(0, MIN_SIZE - height) / 2;\n\n return {\n left: positionLeft,\n top: positionTop,\n width: Math.max(MIN_SIZE, width),\n height: Math.max(MIN_SIZE, height),\n };\n};\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(() => getPosition(element, document));\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 nextPos = getPosition(element, document);\n ([\"left\", \"top\", \"width\", \"height\"] as const).forEach((prop) => {\n elementRef.current?.style.setProperty(prop, `${nextPos[prop]}px`);\n });\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 .selector-xray-box:hover .selector-xray-info-title {\n z-index: 90;\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 type { 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 type { 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 type { 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\";\nimport { getDevtoolsUrlFromEnv } from \"./utilities/get-devtools-url-from-env\";\n\ntype Props = React.PropsWithChildren<{\n /**\n * Devtools URL to connect to the server. This will also be used for the WebSocket connections and serving the Devtools UI.\n * By default, it will use the `REFINE_DEVTOOLS_PORT` environment variable to construct to URL or use `5001` as the default port.\n * If you're using `refine dev` command, it will try to automatically set the environment variable for you and use it.\n * If environment variable is not working for you, you can manually set the URL as a string or a tuple of `[httpUrl: string, wsUrl: string]`.\n */\n url?: string | [httpUrl: string, wsUrl: string];\n}>;\n\nexport const DevtoolsProvider =\n __DEV_CONDITION__ !== \"development\"\n ? ({ children }: Props) => children as any\n : ({ children, url = getDevtoolsUrlFromEnv() }: Props) => {\n return (\n <DevToolsContextProvider url={url}>\n {children}\n </DevToolsContextProvider>\n );\n };\n","const DEFAULT_DEVTOOLS_PORT = 5001;\n\nexport const getDevtoolsUrlFromEnv = () => {\n const PORT_FROM_ENV =\n typeof __PROCESS_KEY__ !== \"undefined\" && \"env\" in __PROCESS_KEY__\n ? __PROCESS_ENV_REFINE_DEVTOOLS_PORT_KEY__ ||\n __PROCESS_ENV_NEXT_PUBLIC_REFINE_DEVTOOLS_PORT_KEY__ ||\n __PROCESS_ENV_REACT_APP_REFINE_DEVTOOLS_PORT_KEY__\n : typeof __IMPORT_META_KEY__ !== \"undefined\" && __IMPORT_META_KEY__.env\n ? __IMPORT_META_ENV_REFINE_DEVTOOLS_PORT_KEY__ ||\n __IMPORT_META_ENV_VITE_REFINE_DEVTOOLS_PORT_KEY__\n : null;\n\n const port = PORT_FROM_ENV || DEFAULT_DEVTOOLS_PORT;\n\n return [`http://localhost:${port}`, `ws://localhost:${port}`] as [\n httpUrl: string,\n wsUrl: string,\n ];\n};\n"],"mappings":"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","names":["React","React","React","React","DevToolsContext","getElementFromFiber","getFiberFromElement","getFirstFiberHasName","getFirstStateNodeFiber","getNameFromFiber","getParentOfFiber","getChildOfFiber","fiber","getFirstHTMLElementFromFiberByChild","child","element","getFirstHTMLElementFromFiberByParent","parent","getFirstHTMLElementFromFiber","selectFiber","start","activeTraceItems","firstParentOfNodeWithName","fiberWithStateNode","acceptedName","filterInvisibleNodes","nodes","item","getUniqueNodes","uniques","node","traverseDom","_a","items","targetFiber","name","i","useSelector","active","httpUrl","React","DevToolsContext","selectableElements","setSelectableElements","fetchTraceItems","prepareSelector","fetchedTraceItems","traversedNodes","traverseDom","filterInvisible","filterInvisibleNodes","uniqueNodes","getUniqueNodes","React","ApplyStyles","children","element","React","debounce","createPortal","React","SelectorButtonIcon","props","SelectorIcon","MIN_SIZE","getPosition","element","document","top","left","width","height","scrollLeft","scrollTop","positionLeft","positionTop","SelectableElement","name","onSelect","position","React","elementRef","onScroll","debounce","_a","nextPos","prop","opacityOnScroll","placement","tooltipBaseSize","nameWidth","tooltipSize","gap","event","SelectorIcon","SelectableElements","elements","selectorBoxRoot","setSelectorBoxRoot","createPortal","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","React","getPanelToggleTransforms","visible","PREFERRED_DEFAULT_WIDTH","PREFERRED_DEFAULT_HEIGHT","getPanelPosition","placement","getMaxPanelWidth","getMaxPanelHeight","getDefaultPanelSize","preferredSize","defaultPreferred","PREFERRED_DEFAULT_WIDTH","PREFERRED_DEFAULT_HEIGHT","maxPanelWidth","maxPanelHeight","width","height","roundToEven","num","rounded","React","ResizeHandleIcon","props","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","newHeight","getMaxPanelHeight","getPanelPosition","getPanelToggleTransforms","event","ResizeHandleIcon","DevToolsContext","DevtoolsEvent","send","MAX_IFRAME_WAIT_TIME","DevtoolsPanel","browser","setBrowser","React","visible","setVisible","placement","httpUrl","ws","width","setWidth","selectorActive","setSelectorActive","iframeStatus","setIframeStatus","onSelectorHighlight","name","onResize","onMessage","event","timeout","DevtoolsPin","v","ResizablePane","resizing","failedConnectionContent","missingUrlContent","React","DevToolsContextProvider","getDevtoolsUrlFromEnv","port","DevtoolsProvider","children","url","getDevtoolsUrlFromEnv","React","DevToolsContextProvider"]}
|
|
1
|
+
{"version":3,"sources":["../src/panel.tsx","../src/components/devtools-pin.tsx","../src/components/devtools-selector.tsx","../src/utilities/use-selector.tsx","../src/utilities/selector-helpers.ts","../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","../src/utilities/get-devtools-url-from-env.ts"],"sourcesContent":["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 type { Placement } from \"./interfaces/placement\";\n\nconst MAX_IFRAME_WAIT_TIME = 1500;\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 { httpUrl, ws } = React.useContext(DevToolsContext);\n const [width, setWidth] = React.useState<number>(0);\n const [selectorActive, setSelectorActive] = React.useState(false);\n const [iframeStatus, setIframeStatus] = React.useState<\n \"loading\" | \"loaded\" | \"failed\"\n >(\"loading\");\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 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 React.useEffect(() => {\n if (iframeStatus !== \"loaded\") {\n const onMessage = (event: MessageEvent) => {\n if (event.data.type === \"refine-devtools-iframe-loaded\") {\n setIframeStatus(\"loaded\");\n }\n };\n\n window.addEventListener(\"message\", onMessage);\n\n return () => {\n window.removeEventListener(\"message\", onMessage);\n };\n }\n\n return () => 0;\n }, []);\n\n React.useEffect(() => {\n let timeout: number;\n if (iframeStatus === \"loading\") {\n timeout = window.setTimeout(() => {\n setIframeStatus(\"failed\");\n if (timeout) {\n clearInterval(timeout);\n }\n }, MAX_IFRAME_WAIT_TIME);\n }\n return () => {\n if (typeof timeout !== \"undefined\") {\n clearInterval(timeout);\n }\n };\n }, [iframeStatus]);\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={httpUrl}\n srcDoc={\n httpUrl\n ? iframeStatus === \"failed\"\n ? failedConnectionContent\n : undefined\n : missingUrlContent\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\nconst missingUrlContent = `\n <html style=\"height:100%;padding:0;margin:0;background:#14141F;\">\n <body style=\"background:#14141F;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;font-weight:400;color:#CFD7E2;text-align:center;font-size:24px;\">Could not connect to the devtools server.</h1>\n </body>\n </html>\n `;\n\nconst failedConnectionContent = `\n <html style=\"height:100%;padding:0;margin:0;background:#14141F;\">\n <body style=\"background:#14141F;display:flex;flex-direction:column;justify-content:center;height:100%;padding:24px;margin:0;align-items:center;box-sizing:border-box;\">\n <h1 style=\"max-width:480px;min-width:480px;font-family:ui-monospace,monospace;font-weight:400;color:#CFD7E2;text-align:left;font-size:24px;margin-bottom:12px;line-height:24px;\">Devtools Server is unreachable.</h1>\n <p style=\"max-width:480px;font-family:ui-monospace,monospace;font-weight:400;color:#6C7793;text-align:left;font-size:16px;line-height:32px;\">Please make sure Refine Devtools is running and <code style=\"background:#303450;color:#A3ADC2;padding:3px 6px;border-radius:4px;\"><DevtoolsProvider /></code> has valid <code style=\"background:#303450;color:#A3ADC2;padding:3px 6px;border-radius:4px;\">url</code> prop. Environment variables may not always be available in browser depending on your project setup.</p>\n </body>\n </html>\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 <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 <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 line-height: 1;\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 { DevToolsContext } from \"@refinedev/devtools-shared\";\n\nimport {\n filterInvisibleNodes,\n getUniqueNodes,\n traverseDom,\n type SelectableElement,\n} from \"./selector-helpers\";\n\nexport const useSelector = (active: boolean) => {\n const { httpUrl } = React.useContext(DevToolsContext);\n const [selectableElements, setSelectableElements] = React.useState<\n SelectableElement[]\n >([]);\n\n const fetchTraceItems = React.useCallback(async () => {\n const response = await fetch(`${httpUrl}/api/unique-trace-items`);\n const data = await response.json();\n\n return data.data as string[];\n }, [httpUrl]);\n\n const prepareSelector = React.useCallback(async () => {\n const fetchedTraceItems = await fetchTraceItems();\n const traversedNodes = traverseDom(document.body, fetchedTraceItems);\n const filterInvisible = filterInvisibleNodes(traversedNodes);\n const uniqueNodes = getUniqueNodes(filterInvisible);\n\n setSelectableElements(uniqueNodes);\n }, [fetchTraceItems]);\n\n React.useEffect(() => {\n if (active) {\n prepareSelector();\n }\n }, [active, prepareSelector]);\n\n return {\n selectableElements,\n };\n};\n","import {\n getElementFromFiber,\n getFiberFromElement,\n getFirstFiberHasName,\n getFirstStateNodeFiber,\n getNameFromFiber,\n getParentOfFiber,\n} from \"@aliemir/dom-to-fiber-utils\";\n\ntype Fiber = Exclude<ReturnType<typeof getFiberFromElement>, null>;\n\nexport type SelectableElement = {\n element: HTMLElement;\n name: string;\n};\n\nconst getChildOfFiber = (fiber: Fiber | null) => {\n if (!fiber) {\n return null;\n }\n\n return fiber.child;\n};\n\nconst getFirstHTMLElementFromFiberByChild = (fiber: Fiber | null) => {\n let child = fiber;\n\n while (child) {\n const element = getElementFromFiber(child);\n if (element && element instanceof HTMLElement) {\n return element;\n }\n\n child = getChildOfFiber(child) as Fiber;\n }\n\n return null;\n};\n\nconst getFirstHTMLElementFromFiberByParent = (fiber: Fiber | null) => {\n let parent = fiber;\n\n while (parent) {\n const element = getElementFromFiber(parent);\n if (element && element instanceof HTMLElement) {\n return element;\n }\n\n parent = getParentOfFiber(parent) as Fiber;\n }\n\n return null;\n};\n\nconst getFirstHTMLElementFromFiber = (\n fiber: Fiber | null,\n): [element: HTMLElement, \"child\" | \"parent\" | \"body\"] => {\n let element = getFirstHTMLElementFromFiberByChild(fiber);\n\n if (element) {\n return [element, \"child\"];\n }\n\n element = getFirstHTMLElementFromFiberByParent(fiber);\n\n if (element) {\n return [element, \"parent\"];\n }\n\n return [document.body, \"body\"];\n};\n\nconst selectFiber = (start: Fiber | null, activeTraceItems: string[]) => {\n let fiber = start;\n let firstParentOfNodeWithName: Fiber | null = null;\n let fiberWithStateNode: Fiber | null = 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\nexport const filterInvisibleNodes = (nodes: SelectableElement[]) => {\n return nodes.filter(\n (item) => item.element.offsetWidth > 0 && item.element.offsetHeight > 0,\n );\n};\n\nexport const getUniqueNodes = (nodes: SelectableElement[]) => {\n const uniques: SelectableElement[] = [];\n\n nodes.forEach((node) => {\n const isElementExist = uniques.find(\n (item) => item.element === node.element && item.name === node.name,\n );\n if (!isElementExist) {\n uniques.push(node);\n }\n });\n\n return uniques;\n};\n\nexport const traverseDom = (\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 = selectFiber(fiber, activeTraceItems);\n\n if (targetFiber.nameFiber) {\n const [element] = getFirstHTMLElementFromFiber(targetFiber.nameFiber);\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 ...traverseDom(node.children[i] as HTMLElement, activeTraceItems),\n );\n }\n\n return items;\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-es/debounce.js\";\nimport { createPortal } from \"react-dom\";\nimport { ApplyStyles } from \"./apply-styles\";\nimport { SelectorIcon } from \"./icons/selector-button\";\n\nconst MIN_SIZE = 22;\n\nconst getPosition = (element: HTMLElement, document: Document) => {\n const { top, left, width, height } = element.getBoundingClientRect();\n const { scrollLeft, scrollTop } = document.documentElement;\n const positionLeft = left + scrollLeft - Math.max(0, MIN_SIZE - width) / 2;\n const positionTop = top + scrollTop - Math.max(0, MIN_SIZE - height) / 2;\n\n return {\n left: positionLeft,\n top: positionTop,\n width: Math.max(MIN_SIZE, width),\n height: Math.max(MIN_SIZE, height),\n };\n};\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(() => getPosition(element, document));\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 nextPos = getPosition(element, document);\n ([\"left\", \"top\", \"width\", \"height\"] as const).forEach((prop) => {\n elementRef.current?.style.setProperty(prop, `${nextPos[prop]}px`);\n });\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 .selector-xray-box:hover .selector-xray-info-title {\n z-index: 90;\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 type { 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 type { 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 type { 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\";\nimport { getDevtoolsUrlFromEnv } from \"./utilities/get-devtools-url-from-env\";\n\ntype Props = React.PropsWithChildren<{\n /**\n * Devtools URL to connect to the server. This will also be used for the WebSocket connections and serving the Devtools UI.\n * By default, it will use the `REFINE_DEVTOOLS_PORT` environment variable to construct to URL or use `5001` as the default port.\n * If you're using `refine dev` command, it will try to automatically set the environment variable for you and use it.\n * If environment variable is not working for you, you can manually set the URL as a string or a tuple of `[httpUrl: string, wsUrl: string]`.\n */\n url?: string | [httpUrl: string, wsUrl: string];\n}>;\n\nexport const DevtoolsProvider =\n __DEV_CONDITION__ !== \"development\"\n ? ({ children }: Props) => children as any\n : ({ children, url = getDevtoolsUrlFromEnv() }: Props) => {\n return (\n <DevToolsContextProvider url={url}>\n {children}\n </DevToolsContextProvider>\n );\n };\n","const DEFAULT_DEVTOOLS_PORT = 5001;\n\nexport const getDevtoolsUrlFromEnv = () => {\n const PORT_FROM_ENV =\n typeof __PROCESS_KEY__ !== \"undefined\" && \"env\" in __PROCESS_KEY__\n ? __PROCESS_ENV_REFINE_DEVTOOLS_PORT_KEY__ ||\n __PROCESS_ENV_NEXT_PUBLIC_REFINE_DEVTOOLS_PORT_KEY__ ||\n __PROCESS_ENV_REACT_APP_REFINE_DEVTOOLS_PORT_KEY__\n : typeof __IMPORT_META_KEY__ !== \"undefined\" && __IMPORT_META_KEY__.env\n ? __IMPORT_META_ENV_REFINE_DEVTOOLS_PORT_KEY__ ||\n __IMPORT_META_ENV_VITE_REFINE_DEVTOOLS_PORT_KEY__\n : null;\n\n const port = PORT_FROM_ENV || DEFAULT_DEVTOOLS_PORT;\n\n return [`http://localhost:${port}`, `ws://localhost:${port}`] as [\n httpUrl: string,\n wsUrl: string,\n ];\n};\n"],"mappings":"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","names":["React","React","React","React","DevToolsContext","getElementFromFiber","getFiberFromElement","getFirstFiberHasName","getFirstStateNodeFiber","getNameFromFiber","getParentOfFiber","getChildOfFiber","fiber","getFirstHTMLElementFromFiberByChild","child","element","getFirstHTMLElementFromFiberByParent","parent","getFirstHTMLElementFromFiber","selectFiber","start","activeTraceItems","firstParentOfNodeWithName","fiberWithStateNode","acceptedName","filterInvisibleNodes","nodes","item","getUniqueNodes","uniques","node","traverseDom","_a","items","targetFiber","name","i","useSelector","active","httpUrl","React","DevToolsContext","selectableElements","setSelectableElements","fetchTraceItems","prepareSelector","fetchedTraceItems","traversedNodes","traverseDom","filterInvisible","filterInvisibleNodes","uniqueNodes","getUniqueNodes","React","ApplyStyles","children","element","React","debounce","createPortal","React","SelectorButtonIcon","props","SelectorIcon","MIN_SIZE","getPosition","element","document","top","left","width","height","scrollLeft","scrollTop","positionLeft","positionTop","SelectableElement","name","onSelect","position","React","elementRef","onScroll","debounce","_a","nextPos","prop","opacityOnScroll","placement","tooltipBaseSize","nameWidth","tooltipSize","gap","event","SelectorIcon","SelectableElements","elements","selectorBoxRoot","setSelectorBoxRoot","createPortal","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","React","getPanelToggleTransforms","visible","PREFERRED_DEFAULT_WIDTH","PREFERRED_DEFAULT_HEIGHT","getPanelPosition","placement","getMaxPanelWidth","getMaxPanelHeight","getDefaultPanelSize","preferredSize","defaultPreferred","PREFERRED_DEFAULT_WIDTH","PREFERRED_DEFAULT_HEIGHT","maxPanelWidth","maxPanelHeight","width","height","roundToEven","num","rounded","React","ResizeHandleIcon","props","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","newHeight","getMaxPanelHeight","getPanelPosition","getPanelToggleTransforms","event","ResizeHandleIcon","DevToolsContext","DevtoolsEvent","send","MAX_IFRAME_WAIT_TIME","DevtoolsPanel","browser","setBrowser","React","visible","setVisible","placement","httpUrl","ws","width","setWidth","selectorActive","setSelectorActive","iframeStatus","setIframeStatus","onSelectorHighlight","name","onResize","onMessage","event","timeout","DevtoolsPin","v","ResizablePane","resizing","failedConnectionContent","missingUrlContent","React","DevToolsContextProvider","getDevtoolsUrlFromEnv","port","DevtoolsProvider","children","url","getDevtoolsUrlFromEnv","React","DevToolsContextProvider"]}
|
package/dist/provider.d.cts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../src/provider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,KAAK,KAAK,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACnC;;;;;OAKG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;CACjD,CAAC,CAAC;AAEH,eAAO,MAAM,gBAAgB,iBAER,KAAK,
|
|
1
|
+
{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../src/provider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,KAAK,KAAK,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACnC;;;;;OAKG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;CACjD,CAAC,CAAC;AAEH,eAAO,MAAM,gBAAgB,iBAER,KAAK,KAAiB,GAOpC,CAAC"}
|
package/dist/provider.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../src/provider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,KAAK,KAAK,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACnC;;;;;OAKG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;CACjD,CAAC,CAAC;AAEH,eAAO,MAAM,gBAAgB,iBAER,KAAK,
|
|
1
|
+
{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../src/provider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,KAAK,KAAK,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACnC;;;;;OAKG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;CACjD,CAAC,CAAC;AAEH,eAAO,MAAM,gBAAgB,iBAER,KAAK,KAAiB,GAOpC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-devtools-url-from-env.d.ts","sourceRoot":"","sources":["../../src/utilities/get-devtools-url-from-env.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,qBAAqB,
|
|
1
|
+
{"version":3,"file":"get-devtools-url-from-env.d.ts","sourceRoot":"","sources":["../../src/utilities/get-devtools-url-from-env.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,qBAAqB,QAaiC,CAC/D,OAAO,EAAE,MAAM,EACf,KAAK,EAAE,MAAM,CAEhB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-devtools-url-from-env.d.ts","sourceRoot":"","sources":["../../src/utilities/get-devtools-url-from-env.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,qBAAqB,
|
|
1
|
+
{"version":3,"file":"get-devtools-url-from-env.d.ts","sourceRoot":"","sources":["../../src/utilities/get-devtools-url-from-env.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,qBAAqB,QAaiC,CAC/D,OAAO,EAAE,MAAM,EACf,KAAK,EAAE,MAAM,CAEhB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utilities/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAE1D,eAAO,MAAM,wBAAwB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utilities/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAE1D,eAAO,MAAM,wBAAwB,GAAI,SAAS,OAAO,6DAExD,CAAC;AAEF,eAAO,MAAM,IAAI,KAAK,CAAC;AACvB,eAAO,MAAM,MAAM,KAAK,CAAC;AAOzB,eAAO,MAAM,eAAe,MAAM,CAAC;AACnC,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAEpC,eAAO,MAAM,qBAAqB,GAAI,QAAQ,OAAO,WAEpD,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,WAAW,SAAS;;;;;;;;;;;;;;;;;;CA2BpD,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,WAAW,SAAS,WAmBpD,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,WAAW,SAAS,WAmBrD,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAC9B,WAAW,SAAS,EACpB,gBAAgB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,KAChD;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAsBjC,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,KAAK,MAAM,WAGtC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utilities/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAE1D,eAAO,MAAM,wBAAwB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utilities/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAE1D,eAAO,MAAM,wBAAwB,GAAI,SAAS,OAAO,6DAExD,CAAC;AAEF,eAAO,MAAM,IAAI,KAAK,CAAC;AACvB,eAAO,MAAM,MAAM,KAAK,CAAC;AAOzB,eAAO,MAAM,eAAe,MAAM,CAAC;AACnC,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAEpC,eAAO,MAAM,qBAAqB,GAAI,QAAQ,OAAO,WAEpD,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,WAAW,SAAS;;;;;;;;;;;;;;;;;;CA2BpD,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,WAAW,SAAS,WAmBpD,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,WAAW,SAAS,WAmBrD,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAC9B,WAAW,SAAS,EACpB,gBAAgB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,KAChD;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAsBjC,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,KAAK,MAAM,WAGtC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"selector-helpers.d.ts","sourceRoot":"","sources":["../../src/utilities/selector-helpers.ts"],"names":[],"mappings":"AAWA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,EAAE,WAAW,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AA0FF,eAAO,MAAM,oBAAoB,
|
|
1
|
+
{"version":3,"file":"selector-helpers.d.ts","sourceRoot":"","sources":["../../src/utilities/selector-helpers.ts"],"names":[],"mappings":"AAWA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,EAAE,WAAW,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AA0FF,eAAO,MAAM,oBAAoB,GAAI,OAAO,iBAAiB,EAAE,wBAI9D,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,OAAO,iBAAiB,EAAE,wBAaxD,CAAC;AAEF,eAAO,MAAM,WAAW,GACtB,MAAM,WAAW,GAAG,IAAI,EACxB,kBAAkB,MAAM,EAAE,KACzB,iBAAiB,EA4BnB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"selector-helpers.d.ts","sourceRoot":"","sources":["../../src/utilities/selector-helpers.ts"],"names":[],"mappings":"AAWA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,EAAE,WAAW,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AA0FF,eAAO,MAAM,oBAAoB,
|
|
1
|
+
{"version":3,"file":"selector-helpers.d.ts","sourceRoot":"","sources":["../../src/utilities/selector-helpers.ts"],"names":[],"mappings":"AAWA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,EAAE,WAAW,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AA0FF,eAAO,MAAM,oBAAoB,GAAI,OAAO,iBAAiB,EAAE,wBAI9D,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,OAAO,iBAAiB,EAAE,wBAaxD,CAAC;AAEF,eAAO,MAAM,WAAW,GACtB,MAAM,WAAW,GAAG,IAAI,EACxB,kBAAkB,MAAM,EAAE,KACzB,iBAAiB,EA4BnB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-selector.d.ts","sourceRoot":"","sources":["../../src/utilities/use-selector.tsx"],"names":[],"mappings":"AAGA,OAAO,EAIL,KAAK,iBAAiB,EACvB,MAAM,oBAAoB,CAAC;AAE5B,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"use-selector.d.ts","sourceRoot":"","sources":["../../src/utilities/use-selector.tsx"],"names":[],"mappings":"AAGA,OAAO,EAIL,KAAK,iBAAiB,EACvB,MAAM,oBAAoB,CAAC;AAE5B,eAAO,MAAM,WAAW,GAAI,QAAQ,OAAO;;CA+B1C,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-selector.d.ts","sourceRoot":"","sources":["../../src/utilities/use-selector.tsx"],"names":[],"mappings":"AAGA,OAAO,EAIL,KAAK,iBAAiB,EACvB,MAAM,oBAAoB,CAAC;AAE5B,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"use-selector.d.ts","sourceRoot":"","sources":["../../src/utilities/use-selector.tsx"],"names":[],"mappings":"AAGA,OAAO,EAIL,KAAK,iBAAiB,EACvB,MAAM,oBAAoB,CAAC;AAE5B,eAAO,MAAM,WAAW,GAAI,QAAQ,OAAO;;CA+B1C,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@refinedev/devtools",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.2",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "refine devtools offers a set of features from monitoring to quickly prototyping a UI.",
|
|
6
6
|
"repository": {
|
|
@@ -32,38 +32,36 @@
|
|
|
32
32
|
],
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@aliemir/dom-to-fiber-utils": "^0.4.0",
|
|
35
|
-
"@refinedev/devtools-shared": "
|
|
35
|
+
"@refinedev/devtools-shared": "2.0.0",
|
|
36
36
|
"error-stack-parser": "^2.1.4",
|
|
37
37
|
"lodash": "^4.17.21",
|
|
38
38
|
"lodash-es": "^4.17.21"
|
|
39
39
|
},
|
|
40
40
|
"devDependencies": {
|
|
41
41
|
"@esbuild-plugins/node-resolve": "^0.1.4",
|
|
42
|
-
"@testing-library/jest-dom": "^
|
|
43
|
-
"@types/jest": "^29.2.4",
|
|
42
|
+
"@testing-library/jest-dom": "^6.6.3",
|
|
44
43
|
"@types/lodash": "^4.14.171",
|
|
45
|
-
"@types/node": "^
|
|
44
|
+
"@types/node": "^20",
|
|
46
45
|
"@types/react-reconciler": "^0.28.8",
|
|
47
|
-
"@
|
|
48
|
-
"
|
|
49
|
-
"jest-environment-jsdom": "^29.3.1",
|
|
46
|
+
"@vitest/ui": "^2.1.8",
|
|
47
|
+
"jsdom": "^25.0.1",
|
|
50
48
|
"react-router": "^7.0.2",
|
|
51
|
-
"ts-jest": "^29.1.2",
|
|
52
49
|
"tslib": "^2.6.2",
|
|
53
50
|
"tsup": "^6.7.0",
|
|
54
|
-
"typescript": "^5.
|
|
51
|
+
"typescript": "^5.8.3",
|
|
52
|
+
"vitest": "^2.1.8"
|
|
55
53
|
},
|
|
56
54
|
"peerDependencies": {
|
|
57
|
-
"@refinedev/cli": "2.16.
|
|
58
|
-
"@refinedev/core": "^
|
|
59
|
-
"@refinedev/devtools-server": "
|
|
60
|
-
"@types/react": "^
|
|
61
|
-
"@types/react-dom": "^
|
|
62
|
-
"react": "^
|
|
63
|
-
"react-dom": "^
|
|
55
|
+
"@refinedev/cli": "2.16.49",
|
|
56
|
+
"@refinedev/core": "^5.0.0",
|
|
57
|
+
"@refinedev/devtools-server": "2.0.0",
|
|
58
|
+
"@types/react": "^18.0.0 || ^19.0.0",
|
|
59
|
+
"@types/react-dom": "^18.0.0 || ^19.0.0",
|
|
60
|
+
"react": "^18.0.0 || ^19.0.0",
|
|
61
|
+
"react-dom": "^18.0.0 || ^19.0.0"
|
|
64
62
|
},
|
|
65
63
|
"engines": {
|
|
66
|
-
"node": ">=
|
|
64
|
+
"node": ">=20"
|
|
67
65
|
},
|
|
68
66
|
"publishConfig": {
|
|
69
67
|
"access": "public"
|
|
@@ -73,7 +71,7 @@
|
|
|
73
71
|
"build": "tsup && node ../shared/generate-declarations.js",
|
|
74
72
|
"dev": "tsup --watch",
|
|
75
73
|
"publint": "publint --strict=true --level=suggestion",
|
|
76
|
-
"test": "
|
|
74
|
+
"test": "vitest run --passWithNoTests",
|
|
77
75
|
"types": "node ../shared/generate-declarations.js"
|
|
78
76
|
}
|
|
79
77
|
}
|
|
@@ -147,7 +147,7 @@ export const traverseDom = (
|
|
|
147
147
|
}
|
|
148
148
|
}
|
|
149
149
|
|
|
150
|
-
for (let i = 0; i < node?.children?.length ?? 0; i++) {
|
|
150
|
+
for (let i = 0; i < (node?.children?.length ?? 0); i++) {
|
|
151
151
|
items.push(
|
|
152
152
|
...traverseDom(node.children[i] as HTMLElement, activeTraceItems),
|
|
153
153
|
);
|