@qwik.dev/devtools 0.1.2 → 0.2.1

package/dist/ui/components/DevtoolsButton/DevtoolsButton.qwik.cjs

@@ -1,104 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@qwik.dev/core/jsx-runtime");
-const core = require("@qwik.dev/core");
-const DevtoolsButton = core.component$(({ state }) => {
-  const position = core.useSignal({
-    x: 16,
-    y: 16
-  });
-  const isDragging = core.useSignal(false);
-  const elementRef = core.useSignal();
-  const startMousePos = core.useSignal({
-    x: 0,
-    y: 0
-  });
-  const startElementPos = core.useSignal({
-    x: 0,
-    y: 0
-  });
-  const isMoved = core.useSignal(false);
-  const handleMouseMove = core.$((event) => {
-    if (!isDragging.value) return;
-    const deltaX = event.clientX - startMousePos.value.x;
-    const deltaY = event.clientY - startMousePos.value.y;
-    if (Math.abs(deltaX) > 3 || Math.abs(deltaY) > 3) {
-      isMoved.value = true;
-    }
-    let newX = startElementPos.value.x - deltaX;
-    let newY = startElementPos.value.y - deltaY;
-    newX = Math.max(0, newX);
-    newY = Math.max(0, newY);
-    position.value = {
-      x: newX,
-      y: newY
-    };
-  });
-  const handleMouseUp = core.$(() => {
-    if (isDragging.value) {
-      isDragging.value = false;
-    }
-    if (!isMoved.value) {
-      state.isOpen.value = !state.isOpen.value;
-    }
-  });
-  const handleMouseDown = core.$((event) => {
-    if (event.button !== 0) return;
-    if (!elementRef.value) return;
-    event.preventDefault();
-    startMousePos.value = {
-      x: event.clientX,
-      y: event.clientY
-    };
-    const computedStyle = window.getComputedStyle(elementRef.value);
-    const currentRight = parseFloat(computedStyle.right) || 0;
-    const currentBottom = parseFloat(computedStyle.bottom) || 0;
-    startElementPos.value = {
-      x: currentRight,
-      y: currentBottom
-    };
-    position.value = {
-      x: currentRight,
-      y: currentBottom
-    };
-    isDragging.value = true;
-    isMoved.value = false;
-  });
-  core.useTask$(({ track, cleanup }) => {
-    track(() => isDragging.value);
-    if (isDragging.value && typeof window !== "undefined") {
-      window.addEventListener("mousemove", handleMouseMove);
-      window.addEventListener("mouseup", handleMouseUp);
-      cleanup(() => {
-        window.removeEventListener("mousemove", handleMouseMove);
-        window.removeEventListener("mouseup", handleMouseUp);
-      });
-    }
-  });
-  return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    ref: elementRef,
-    class: {
-      "fixed flex h-9 w-9 origin-center select-none items-center justify-center rounded-lg border border-border bg-background backdrop-blur-md": true,
-      "border-accent/50 bg-background/95 shadow-accent/35 rotate-90 shadow-lg": state.isOpen.value && !isDragging.value,
-      "cursor-grab": !isDragging.value,
-      "cursor-grabbing": isDragging.value,
-      "transition-all duration-300 ease-in-out": !isDragging.value
-    },
-    style: {
-      bottom: `${position.value.y}px`,
-      right: `${position.value.x}px`,
-      userSelect: isDragging.value ? "none" : void 0,
-      transition: isDragging.value ? "none" : void 0
-    },
-    onMouseDown$: handleMouseDown,
-    children: /* @__PURE__ */ jsxRuntime.jsx("img", {
-      width: 20,
-      height: 20,
-      src: "https://qwik.dev/logos/qwik-logo.svg",
-      alt: "Qwik Logo",
-      draggable: false,
-      class: "pointer-events-none h-5 w-5 opacity-90 drop-shadow-md"
-    })
-  });
-});
-exports.DevtoolsButton = DevtoolsButton;

package/dist/ui/components/DevtoolsContainer/DevtoolsContainer.qwik.cjs

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@qwik.dev/core/jsx-runtime");
-const core = require("@qwik.dev/core");
-const DevtoolsContainer = core.component$(() => {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    class: "fixed bottom-0 right-0 z-[9999] font-sans",
-    "q:slot": "content",
-    children: /* @__PURE__ */ jsxRuntime.jsx(core.Slot, {})
-  });
-});
-exports.DevtoolsContainer = DevtoolsContainer;

package/dist/ui/components/DevtoolsPanel/DevtoolsPanel.qwik.cjs

@@ -1,35 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@qwik.dev/core/jsx-runtime");
-const core = require("@qwik.dev/core");
-const DevtoolsPanel = core.component$(({ state }) => {
-  const panelRef = core.useSignal();
-  core.useTask$(({ cleanup }) => {
-    const handleKeyPress = (e) => {
-      if (e.key === "`" && e.metaKey) {
-        state.isOpen.value = !state.isOpen.value;
-      }
-      if (e.key === "Escape" && state.isOpen.value) {
-        state.isOpen.value = false;
-      }
-    };
-    const handleClickOutside = (e) => {
-      if (state.isOpen.value && panelRef.value && !panelRef.value.parentElement?.contains(e.target)) {
-        state.isOpen.value = !state.isOpen.value;
-      }
-    };
-    if (!core.isBrowser) return;
-    window.addEventListener("keydown", handleKeyPress);
-    window.addEventListener("mousedown", handleClickOutside);
-    cleanup(() => {
-      window.removeEventListener("keydown", handleKeyPress);
-      window.removeEventListener("mousedown", handleClickOutside);
-    });
-  });
-  return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    ref: panelRef,
-    class: "fixed bottom-6 right-6 flex h-[calc(100vh-3rem)] w-[calc(100vw-3rem)] translate-y-0 transform overflow-hidden rounded-lg border-2 border-border bg-background text-foreground backdrop-blur-lg transition-transform duration-300 ease-in-out",
-    children: /* @__PURE__ */ jsxRuntime.jsx(core.Slot, {})
-  });
-});
-exports.DevtoolsPanel = DevtoolsPanel;

package/dist/ui/components/Tab/Tab.qwik.cjs

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@qwik.dev/core/jsx-runtime");
-const core = require("@qwik.dev/core");
-const Tab = core.component$(({ state, id, title }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("button", {
-    onClick$: () => state.activeTab = id,
-    title,
-    class: {
-      "flex h-10 w-10 items-center justify-center rounded-lg p-2.5 transition-all duration-200": true,
-      "bg-foreground/5 hover:bg-foreground/10 text-muted-foreground hover:bg-primary-hover hover:text-foreground": state.activeTab !== id,
-      "shadow-accent/35 bg-accent text-white shadow-lg": state.activeTab === id
-    },
-    children: /* @__PURE__ */ jsxRuntime.jsx(core.Slot, {})
-  });
-});
-exports.Tab = Tab;

package/dist/ui/components/TabContent/TabContent.qwik.cjs

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@qwik.dev/core/jsx-runtime");
-const core = require("@qwik.dev/core");
-const TabContent = core.component$(() => {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    class: "flex h-full w-full flex-col space-y-6",
-    children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", {
-        class: "flex items-center justify-between border-b border-border pb-4",
-        children: /* @__PURE__ */ jsxRuntime.jsx(core.Slot, {
-          name: "title"
-        })
-      }),
-      /* @__PURE__ */ jsxRuntime.jsx(core.Slot, {
-        name: "content"
-      })
-    ]
-  });
-});
-exports.TabContent = TabContent;

package/dist/ui/components/TabTitle/TabTitle.qwik.cjs

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@qwik.dev/core/jsx-runtime");
-const core = require("@qwik.dev/core");
-const TabTitle = core.component$(({ title }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("h3", {
-    class: "text-xl font-semibold",
-    children: title
-  });
-});
-exports.TabTitle = TabTitle;

package/dist/ui/components/ThemeToggle/ThemeToggle.qwik.cjs

@@ -1,64 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@qwik.dev/core/jsx-runtime");
-const core = require("@qwik.dev/core");
-const themeScript = require("../router-head/theme-script.qwik.cjs");
-const hi_qwik = require("../../node_modules/.pnpm/@qwikest_icons@0.0.13_@builder.io_qwik@1.11.0_vite@7.1.3_@types_node@20.14.11_jiti@2.4.2_tsx@4.19.2_yaml@2.7.0__/node_modules/@qwikest/icons/lib/hi.qwik.qwik.cjs");
-const bs_qwik = require("../../node_modules/.pnpm/@qwikest_icons@0.0.13_@builder.io_qwik@1.11.0_vite@7.1.3_@types_node@20.14.11_jiti@2.4.2_tsx@4.19.2_yaml@2.7.0__/node_modules/@qwikest/icons/lib/bs.qwik.qwik.cjs");
-const themToggle = require("./themToggle.css.qwik.cjs");
-const getTheme = () => {
-  if (core.isServer) {
-    return "auto";
-  }
-  let theme;
-  try {
-    theme = localStorage.getItem(themeScript.themeStorageKey);
-  } catch {
-  }
-  return theme || "auto";
-};
-const setTheme = (theme) => {
-  if (theme === "auto") {
-    document.firstElementChild?.removeAttribute("data-theme");
-  } else {
-    document.firstElementChild?.setAttribute("data-theme", theme);
-  }
-  localStorage.setItem(themeScript.themeStorageKey, theme);
-};
-const ThemeToggle = core.component$(() => {
-  core.useStyles$(themToggle);
-  const onClick$ = core.event$(() => {
-    let currentTheme = getTheme();
-    if (currentTheme === "dark") {
-      currentTheme = "light";
-    } else if (currentTheme === "light") {
-      currentTheme = "auto";
-    } else {
-      currentTheme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "light" : "dark";
-    }
-    setTheme(currentTheme);
-  });
-  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
-    children: /* @__PURE__ */ jsxRuntime.jsx("button", {
-      onClick$,
-      class: "group relative flex h-8 w-8 items-center justify-center rounded-md bg-background text-foreground hover:opacity-60",
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", {
-        class: "absolute inset-0 grid place-items-center transition-transform duration-200 ease-out group-hover:scale-110 group-active:scale-75",
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(hi_qwik.HiSunOutline, {
-            class: "themeIcon light col-start-1 row-start-1"
-          }),
-          /* @__PURE__ */ jsxRuntime.jsx(hi_qwik.HiMoonOutline, {
-            class: "themeIcon dark col-start-1 row-start-1"
-          }),
-          /* @__PURE__ */ jsxRuntime.jsx(bs_qwik.BsBrilliance, {
-            class: "themeIcon auto col-start-1 row-start-1"
-          })
-        ]
-      })
-    })
-  });
-});
-exports.ThemeToggle = ThemeToggle;
-exports.getTheme = getTheme;
-exports.setTheme = setTheme;

package/dist/ui/components/ThemeToggle/themToggle.css.qwik.cjs

@@ -1,3 +0,0 @@
-"use strict";
-const themeTogglecss = ".themeIcon {\n  opacity: 0;\n  transition: opacity 400ms ease-in-out;\n}\n\nhtml[data-theme='light'] .themeIcon.light,\nhtml[data-theme='dark'] .themeIcon.dark,\nhtml:not([data-theme]) .themeIcon.auto {\n  opacity: 1;\n}\n";
-module.exports = themeTogglecss;

package/dist/ui/components/ThemeToggle/theme-script.qwik.cjs

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@qwik.dev/core/jsx-runtime");
-const themeScript = require("../router-head/theme-script.qwik.cjs");
-const ThemeScript = () => {
-  const themeScript$1 = `
-        try {
-          const getItem = localStorage.getItem('${themeScript.themeStorageKey}')
-          if(getItem === 'light' || getItem === 'dark'){
-              document.firstElementChild.setAttribute('data-theme', getItem);
-          }
-        } catch (err) { }`;
-  return /* @__PURE__ */ jsxRuntime.jsx("script", {
-    dangerouslySetInnerHTML: themeScript$1
-  });
-};
-exports.ThemeScript = ThemeScript;

package/dist/ui/components/Tree/Tree.qwik.cjs

@@ -1,106 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("@qwik.dev/core/jsx-runtime");
-const core = require("@qwik.dev/core");
-const hi_qwik = require("../../node_modules/.pnpm/@qwikest_icons@0.0.13_@builder.io_qwik@1.11.0_vite@7.1.3_@types_node@20.14.11_jiti@2.4.2_tsx@4.19.2_yaml@2.7.0__/node_modules/@qwikest/icons/lib/hi.qwik.qwik.cjs");
-const TreeNodeComponent = core.component$((props) => {
-  const isExpanded = core.useSignal(props.expandLevel <= props.level);
-  const hasChildren = props.node.children && props.node.children.length > 0;
-  const handleNodeClick = core.$(() => {
-    props.onNodeClick(props.node);
-    if (hasChildren) {
-      isExpanded.value = !isExpanded.value;
-    }
-  });
-  const iterateProps = (porps) => {
-    const displayProp = [
-      "q:id",
-      "q:key"
-    ];
-    return displayProp.reduce((totalStr, prop) => {
-      if (porps[prop]) {
-        totalStr += `${prop}="${porps[prop]}" `;
-      }
-      return totalStr;
-    }, "");
-  };
-  const isActive = props.isHover ? props.node.id === props.activeNodeId : false;
-  const duration = props.animationDuration ?? 200;
-  const shouldShowChildren = hasChildren && !isExpanded.value;
-  const renderChildren = props.node.children?.map((child) => /* @__PURE__ */ jsxRuntime.jsx(TreeNodeComponent, {
-    isHover: props.isHover,
-    node: child,
-    gap: props.gap,
-    expandLevel: props.expandLevel,
-    level: props.level + 1,
-    activeNodeId: props.activeNodeId,
-    onNodeClick: props.onNodeClick,
-    renderNode: props.renderNode,
-    animate: props.animate,
-    animationDuration: props.animationDuration
-  }, child.id));
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    class: "w-full",
-    children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", {
-        style: {
-          paddingLeft: `${props.level * props.gap}px`
-        },
-        class: `flex w-full cursor-pointer items-center rounded-md p-1 transition-colors duration-150 
-                ${isActive ? "bg-primary  text-white " : "hover:bg-primary-hover "}`,
-        onClick$: handleNodeClick,
-        children: [
-          hasChildren ? /* @__PURE__ */ jsxRuntime.jsx(hi_qwik.HiChevronUpMini, {
-            class: `mr-2 h-4 w-4 flex-shrink-0 transition-transform duration-200 ${isExpanded.value ? "rotate-90" : "rotate-180"}`
-          }) : /* @__PURE__ */ jsxRuntime.jsx("div", {
-            class: "mr-2 w-4 flex-shrink-0"
-          }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", {
-            class: "cursor-pointer whitespace-nowrap text-sm",
-            children: props.renderNode ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
-              children: props.renderNode(props.node)
-            }) : `<${props.node.label || props.node.name} ${iterateProps(props.node.props || {})}>`
-          })
-        ]
-      }),
-      hasChildren ? props.animate ? /* @__PURE__ */ jsxRuntime.jsx("div", {
-        class: `overflow-hidden transition-all ease-in-out`,
-        style: {
-          maxHeight: shouldShowChildren ? "1000px" : "0px",
-          opacity: shouldShowChildren ? "1" : "0",
-          transition: `max-height ${duration}ms ease-in-out, opacity ${duration}ms ease-in-out`
-        },
-        children: renderChildren
-      }) : shouldShowChildren && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
-        children: renderChildren
-      }) : null
-    ]
-  });
-});
-const Tree = core.component$((props) => {
-  const ref = core.useSignal();
-  const store = props.data;
-  const activeNodeId = core.useSignal("");
-  const setActiveNode = core.$((node) => {
-    ref.value.scrollLeft = ref.value.scrollWidth;
-    activeNodeId.value = node.id;
-    props.onNodeClick && props.onNodeClick(node);
-  });
-  return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    class: "h-full w-full overflow-x-auto overflow-y-auto",
-    ref,
-    children: store.value.map((rootNode) => /* @__PURE__ */ jsxRuntime.jsx(TreeNodeComponent, {
-      isHover: props.isHover === false ? false : true,
-      gap: props.gap || 20,
-      node: rootNode,
-      level: 0,
-      expandLevel: props.expandLevel ?? 2,
-      activeNodeId: activeNodeId.value,
-      onNodeClick: setActiveNode,
-      renderNode: props.renderNode,
-      animate: props.animate ?? true,
-      animationDuration: props.animationDuration
-    }, rootNode.id))
-  });
-});
-exports.Tree = Tree;

package/dist/ui/components/Tree/filterVnode.qwik.cjs

@@ -1,66 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const internal = require("@qwik.dev/core/internal");
-const vnode = require("./vnode.qwik.cjs");
-const location = require("../../utils/location.qwik.cjs");
-require("../../node_modules/.pnpm/superjson@2.2.2/node_modules/superjson/dist/index.qwik.cjs");
-const constants = require("../../packages/kit/src/constants.qwik.cjs");
-require("../../node_modules/.pnpm/dree@5.1.5/node_modules/dree/bundled/lib/esm/index.esm.qwik.cjs");
-let index = 0;
-function initVnode({ name = "text", props = {}, element = {}, children = [] }) {
-  return {
-    name,
-    props,
-    element,
-    children,
-    label: name,
-    id: `vnode-${index++}`
-  };
-}
-function vnode_toObject(vnodeItem) {
-  if (vnodeItem === null || vnodeItem === void 0) {
-    return null;
-  }
-  return buildTreeRecursive(vnodeItem);
-}
-const container = location.htmlContainer();
-function buildTreeRecursive(vnode$1, materialize) {
-  if (!vnode$1) {
-    return [];
-  }
-  const result = [];
-  let currentVNode = vnode$1;
-  while (currentVNode) {
-    const isVirtual = internal._vnode_isVirtualVNode(currentVNode);
-    const isFragment = isVirtual && typeof container.getHostProp(currentVNode, constants.QRENDERFN) === "function";
-    if (isFragment) {
-      const vnodeObject = initVnode({
-        element: currentVNode
-      });
-      internal._vnode_getAttrKeys(currentVNode).forEach((key) => {
-        if (key === constants.QTYPE) return;
-        const value = container.getHostProp(currentVNode, key);
-        internal._vnode_getProps(currentVNode)[internal._vnode_getProps(currentVNode).indexOf(key) + 1] = value;
-        vnodeObject.props[key] = internal._vnode_getAttr(currentVNode, key);
-        if (key === constants.QRENDERFN) {
-          vnodeObject.label = vnode.normalizeName(value.getSymbol());
-          vnodeObject.name = vnode.normalizeName(value.getSymbol());
-        }
-      });
-      const firstChild = internal._vnode_getFirstChild(currentVNode);
-      const children = firstChild ? buildTreeRecursive(firstChild) : [];
-      if (children.length > 0) {
-        vnodeObject.children = children;
-      }
-      result.push(vnodeObject);
-    } else if (internal._vnode_isMaterialized(currentVNode) || isVirtual && !isFragment) {
-      const firstChild = internal._vnode_getFirstChild(currentVNode);
-      if (firstChild) {
-        result.push(...buildTreeRecursive(firstChild));
-      }
-    }
-    currentVNode = internal._vnode_getNextSibling(currentVNode);
-  }
-  return result;
-}
-exports.vnode_toObject = vnode_toObject;

package/dist/ui/components/Tree/type.qwik.cjs

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const ISDEVTOOL = "Qwikdevtools";
-exports.ISDEVTOOL = ISDEVTOOL;

package/dist/ui/components/Tree/vnode.qwik.cjs

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-function normalizeName(str) {
-  const array = str.split("_");
-  if (array.length > 0) {
-    const componentName = array[0];
-    return componentName.charAt(0).toUpperCase() + componentName.slice(1).toLowerCase();
-  } else {
-    return "";
-  }
-}
-function removeNodeFromTree(tree, callback) {
-  return tree.filter((node) => {
-    if (callback(node)) {
-      return false;
-    }
-    if (node.children && node.children.length > 0) {
-      node.children = removeNodeFromTree(node.children, callback);
-    }
-    return true;
-  });
-}
-exports.normalizeName = normalizeName;
-exports.removeNodeFromTree = removeNodeFromTree;

package/dist/ui/components/router-head/theme-script.qwik.cjs

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const themeStorageKey = "vueuse-color-scheme";
-exports.themeStorageKey = themeStorageKey;