@tanstack/devtools 0.6.13 → 0.6.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/dev.js +1 -1
  2. package/dist/devtools/{CEW5WR2V.js → DUZIYUCH.js} +3 -3
  3. package/dist/devtools/{VPJ3HSEY.js → EZ6UNLQL.js} +3 -3
  4. package/dist/index.js +1 -1
  5. package/package.json +1 -1
  6. package/src/components/main-panel.tsx +5 -1
  7. package/src/styles/use-styles.ts +6 -2
package/dist/dev.js CHANGED
@@ -29,7 +29,7 @@ var TanStackDevtoolsCore = class {
29
29
  const mountTo = el;
30
30
  const dispose = render(() => {
31
31
  const _self$ = this;
32
- this.#Component = lazy(() => import('./devtools/VPJ3HSEY.js'));
32
+ this.#Component = lazy(() => import('./devtools/EZ6UNLQL.js'));
33
33
  const Devtools = this.#Component;
34
34
  this.#eventBus = new ClientEventBus(this.#eventBusConfig);
35
35
  this.#eventBus.start();
package/dist/devtools/{CEW5WR2V.js → DUZIYUCH.js} RENAMED
@@ -618,7 +618,7 @@ var stylesFactory = (theme) => {
618
618
  transition: all 0.4s ease;
619
619
  `;
620
620
  },
621
- devtoolsPanelContainerAnimation: (isOpen, height) => {
621
+ devtoolsPanelContainerAnimation: (isOpen, height, panelLocation) => {
622
622
  if (isOpen) {
623
623
  return css2`
624
624
  pointer-events: auto;
@@ -627,7 +627,7 @@ var stylesFactory = (theme) => {
627
627
  }
628
628
  return css2`
629
629
  pointer-events: none;
630
- transform: translateY(${height}px);
630
+ transform: translateY(${panelLocation === "top" ? -height : height}px);
631
631
  `;
632
632
  },
633
633
  devtoolsPanel: css2`
@@ -916,7 +916,7 @@ var MainPanel = (props) => {
916
916
  settings
917
917
  } = useDevtoolsSettings();
918
918
  const pip = usePiPWindow();
919
- return ssr(_tmpl$2, ssrAttribute("id", escape(TANSTACK_DEVTOOLS, true), false), "height:" + (pip().pipWindow ? "100vh" : escape(height(), true) + "px"), ssrAttribute("class", escape(clsx3(styles().devtoolsPanelContainer(settings().panelLocation, Boolean(pip().pipWindow)), styles().devtoolsPanelContainerAnimation(props.isOpen(), height()), styles().devtoolsPanelContainerVisibility(props.isOpen()), styles().devtoolsPanelContainerResizing(props.isResizing)), true), false), escape(createComponent(DrawClientProvider, {
919
+ return ssr(_tmpl$2, ssrAttribute("id", escape(TANSTACK_DEVTOOLS, true), false), "height:" + (pip().pipWindow ? "100vh" : escape(height(), true) + "px"), ssrAttribute("class", escape(clsx3(styles().devtoolsPanelContainer(settings().panelLocation, Boolean(pip().pipWindow)), styles().devtoolsPanelContainerAnimation(props.isOpen(), height(), settings().panelLocation), styles().devtoolsPanelContainerVisibility(props.isOpen()), styles().devtoolsPanelContainerResizing(props.isResizing)), true), false), escape(createComponent(DrawClientProvider, {
920
920
  animationMs: 400,
921
921
  get children() {
922
922
  return props.children;
package/dist/devtools/{VPJ3HSEY.js → EZ6UNLQL.js} RENAMED
@@ -618,7 +618,7 @@ var stylesFactory = (theme) => {
618
618
  transition: all 0.4s ease;
619
619
  `;
620
620
  },
621
- devtoolsPanelContainerAnimation: (isOpen, height) => {
621
+ devtoolsPanelContainerAnimation: (isOpen, height, panelLocation) => {
622
622
  if (isOpen) {
623
623
  return css2`
624
624
  pointer-events: auto;
@@ -627,7 +627,7 @@ var stylesFactory = (theme) => {
627
627
  }
628
628
  return css2`
629
629
  pointer-events: none;
630
- transform: translateY(${height}px);
630
+ transform: translateY(${panelLocation === "top" ? -height : height}px);
631
631
  `;
632
632
  },
633
633
  devtoolsPanel: css2`
@@ -933,7 +933,7 @@ var MainPanel = (props) => {
933
933
  }
934
934
  }));
935
935
  effect((_p$) => {
936
- var _v$ = pip().pipWindow ? "100vh" : height() + "px", _v$2 = clsx3(styles().devtoolsPanelContainer(settings().panelLocation, Boolean(pip().pipWindow)), styles().devtoolsPanelContainerAnimation(props.isOpen(), height()), styles().devtoolsPanelContainerVisibility(props.isOpen()), styles().devtoolsPanelContainerResizing(props.isResizing));
936
+ var _v$ = pip().pipWindow ? "100vh" : height() + "px", _v$2 = clsx3(styles().devtoolsPanelContainer(settings().panelLocation, Boolean(pip().pipWindow)), styles().devtoolsPanelContainerAnimation(props.isOpen(), height(), settings().panelLocation), styles().devtoolsPanelContainerVisibility(props.isOpen()), styles().devtoolsPanelContainerResizing(props.isResizing));
937
937
  _v$ !== _p$.e && ((_p$.e = _v$) != null ? _el$.style.setProperty("height", _v$) : _el$.style.removeProperty("height"));
938
938
  _v$2 !== _p$.t && className(_el$, _p$.t = _v$2);
939
939
  return _p$;
package/dist/index.js CHANGED
@@ -29,7 +29,7 @@ var TanStackDevtoolsCore = class {
29
29
  const mountTo = el;
30
30
  const dispose = render(() => {
31
31
  const _self$ = this;
32
- this.#Component = lazy(() => import('./devtools/VPJ3HSEY.js'));
32
+ this.#Component = lazy(() => import('./devtools/EZ6UNLQL.js'));
33
33
  const Devtools = this.#Component;
34
34
  this.#eventBus = new ClientEventBus(this.#eventBusConfig);
35
35
  this.#eventBus.start();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tanstack/devtools",
3
- "version": "0.6.13",
3
+ "version": "0.6.14",
4
4
  "description": "TanStack Devtools is a set of tools for building advanced devtools for your application.",
5
5
  "author": "Tanner Linsley",
6
6
  "license": "MIT",
package/src/components/main-panel.tsx CHANGED
@@ -27,7 +27,11 @@ export const MainPanel = (props: {
27
27
  settings().panelLocation,
28
28
  Boolean(pip().pipWindow),
29
29
  ),
30
- styles().devtoolsPanelContainerAnimation(props.isOpen(), height()),
30
+ styles().devtoolsPanelContainerAnimation(
31
+ props.isOpen(),
32
+ height(),
33
+ settings().panelLocation,
34
+ ),
31
35
  styles().devtoolsPanelContainerVisibility(props.isOpen()),
32
36
  styles().devtoolsPanelContainerResizing(props.isResizing),
33
37
  )}
package/src/styles/use-styles.ts CHANGED
@@ -166,7 +166,11 @@ const stylesFactory = (theme: DevtoolsStore['settings']['theme']) => {
166
166
  transition: all 0.4s ease;
167
167
  `
168
168
  },
169
- devtoolsPanelContainerAnimation: (isOpen: boolean, height: number) => {
169
+ devtoolsPanelContainerAnimation: (
170
+ isOpen: boolean,
171
+ height: number,
172
+ panelLocation: TanStackDevtoolsConfig['panelLocation'],
173
+ ) => {
170
174
  if (isOpen) {
171
175
  return css`
172
176
  pointer-events: auto;
@@ -175,7 +179,7 @@ const stylesFactory = (theme: DevtoolsStore['settings']['theme']) => {
175
179
  }
176
180
  return css`
177
181
  pointer-events: none;
178
- transform: translateY(${height}px);
182
+ transform: translateY(${panelLocation === 'top' ? -height : height}px);
179
183
  `
180
184
  },
181
185
  devtoolsPanel: css`