@tomaszjarosz/react-visualizers 0.1.2 → 0.1.4
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/index.cjs +5 -5
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +5 -5
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -314,7 +314,7 @@ const CodePanel = ({
|
|
|
314
314
|
/* @__PURE__ */ jsxRuntime.jsx("div", { children: code.map((line, idx) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
315
315
|
"div",
|
|
316
316
|
{
|
|
317
|
-
className: `px-0.5 rounded transition-
|
|
317
|
+
className: `px-0.5 rounded transition-colors whitespace-pre ${idx === activeLine ? "bg-yellow-500/30 text-yellow-200 border-l border-yellow-400" : "text-gray-400 border-l border-transparent"}`,
|
|
318
318
|
children: [
|
|
319
319
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-gray-600 mr-1 select-none text-[9px]", children: idx + 1 }),
|
|
320
320
|
line || " "
|
|
@@ -322,9 +322,9 @@ const CodePanel = ({
|
|
|
322
322
|
},
|
|
323
323
|
idx
|
|
324
324
|
)) }),
|
|
325
|
-
|
|
325
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1 pt-1 border-t border-gray-700 min-h-[36px]", children: [
|
|
326
326
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[8px] text-gray-500 uppercase tracking-wide mb-0.5", children: "Vars" }),
|
|
327
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-0.5", children: Object.entries(variables).map(([key, value]) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
327
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-0.5", children: variables && Object.keys(variables).length > 0 ? Object.entries(variables).map(([key, value]) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
328
328
|
"span",
|
|
329
329
|
{
|
|
330
330
|
className: "px-0.5 bg-gray-800 rounded text-[9px] text-gray-300",
|
|
@@ -335,7 +335,7 @@ const CodePanel = ({
|
|
|
335
335
|
]
|
|
336
336
|
},
|
|
337
337
|
key
|
|
338
|
-
)) })
|
|
338
|
+
)) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[9px] text-gray-600", children: "—" }) })
|
|
339
339
|
] })
|
|
340
340
|
] });
|
|
341
341
|
const HelpPanel = () => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-gray-100 rounded-lg p-2 text-[10px]", children: [
|
|
@@ -4810,7 +4810,7 @@ const HashTableVisualizerComponent = ({
|
|
|
4810
4810
|
] })
|
|
4811
4811
|
] }) }) }),
|
|
4812
4812
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex gap-4 ${showCode ? "flex-col lg:flex-row" : ""}`, children: [
|
|
4813
|
-
/* @__PURE__ */ jsxRuntime.jsxs(VisualizationArea, { minHeight: 350, children: [
|
|
4813
|
+
/* @__PURE__ */ jsxRuntime.jsxs(VisualizationArea, { minHeight: 350, className: "flex-1 min-w-0", children: [
|
|
4814
4814
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4", children: [
|
|
4815
4815
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-medium text-gray-700 mb-2", children: "Keys to insert:" }),
|
|
4816
4816
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: keys.map((k, idx) => {
|