@apipass/design-system 5.7.0 → 5.9.0

package/dist/lib/ui/primitives/JsonViewer/JsonEditor.js

@@ -1,49 +1,50 @@
-import { jsxs as I, jsx as a } from "react/jsx-runtime";
-import { useRef as s, useState as L, useEffect as p } from "react";
-import { clsx as A } from "../../../vendor/clsx/dist/clsx.js";
-import { Compartment as H, EditorState as x } from "@codemirror/state";
-import { EditorView as f } from "@codemirror/view";
-import { foldEffect as N, unfoldAll as O } from "@codemirror/language";
-import { jsonEditorTheme as B, jsonEditorExtensions as D, computeFirstLevelFoldRanges as v, toCssSize as G } from "./json-code-mirror.js";
+import { jsxs as T, jsx as a } from "react/jsx-runtime";
+import { useRef as s, useState as A, useEffect as p } from "react";
+import { clsx as O } from "../../../vendor/clsx/dist/clsx.js";
+import { Compartment as B, EditorState as x } from "@codemirror/state";
+import { EditorView as l } from "@codemirror/view";
+import { foldEffect as J, unfoldAll as P } from "@codemirror/language";
+import { toEditorSizeStyle as V, jsonEditorTheme as k, jsonEditorExtensions as q, computeFirstLevelFoldRanges as v } from "./json-code-mirror.js";
 /* empty css               */
-import { IconChevronDown as J } from "../../icons/IconChevronDown.js";
-import { IconChevronRight as P } from "../../icons/IconChevronRight.js";
-import { Button as U } from "../Button/Button.js";
-const V = 220;
-function j(e, o) {
-  o.length > 0 && e.dispatch({ effects: o.map((l) => N.of(l)) });
+import { IconChevronDown as D } from "../../icons/IconChevronDown.js";
+import { IconChevronRight as G } from "../../icons/IconChevronRight.js";
+import { Button as H } from "../Button/Button.js";
+function S(e, o) {
+  o.length > 0 && e.dispatch({ effects: o.map((f) => J.of(f)) });
 }
-function tt({
+function et({
   value: e,
   onChange: o,
-  expandAllLabel: l,
-  className: R,
-  height: S,
+  expandAllLabel: f,
+  className: j,
+  height: y,
+  minHeight: R,
+  maxHeight: z,
   isDisabled: E = !1,
-  isReadOnly: y = !1,
-  "aria-label": T
+  isReadOnly: C = !1,
+  "aria-label": F
 }) {
-  const d = s(null), n = s(null), h = s(new H()), c = s(o), m = s(e), [u, z] = L(!1), C = G(S ?? V), i = !E && !y;
+  const d = s(null), n = s(null), w = s(new B()), c = s(o), m = s(e), [u, I] = A(!1), L = V({ height: y, minHeight: R, maxHeight: z }), i = !E && !C;
   c.current = o, p(() => {
     if (!d.current) return;
-    const t = f.updateListener.of((w) => {
-      var b;
-      if (!w.docChanged) return;
-      const g = w.state.doc.toString();
-      m.current = g, (b = c.current) == null || b.call(c, g);
-    }), r = new f({
+    const t = l.updateListener.of((h) => {
+      var g;
+      if (!h.docChanged) return;
+      const b = h.state.doc.toString();
+      m.current = b, (g = c.current) == null || g.call(c, b);
+    }), r = new l({
       parent: d.current,
       state: x.create({
         doc: e,
         extensions: [
-          h.current.of([f.editable.of(i), x.readOnly.of(!i)]),
-          B,
-          ...D,
+          w.current.of([l.editable.of(i), x.readOnly.of(!i)]),
+          k,
+          ...q,
           t
         ]
       })
     });
-    return n.current = r, j(r, v(e)), () => {
+    return n.current = r, S(r, v(e)), () => {
       r.destroy(), n.current = null;
     };
   }, []), p(() => {
@@ -54,26 +55,26 @@ function tt({
   }, [e]), p(() => {
     const t = n.current;
     t && t.dispatch({
-      effects: h.current.reconfigure([
-        f.editable.of(i),
+      effects: w.current.reconfigure([
+        l.editable.of(i),
         x.readOnly.of(!i)
       ])
     });
   }, [i]);
-  const F = () => {
+  const N = () => {
     const t = n.current;
-    t && (u ? j(t, v(t.state.doc.toString())) : O(t), z(!u));
+    t && (u ? S(t, v(t.state.doc.toString())) : P(t), I(!u));
   };
-  return /* @__PURE__ */ I("div", { className: A("json-viewer", "json-viewer-editable", R), "data-disabled": E || void 0, children: [
+  return /* @__PURE__ */ T("div", { className: O("json-viewer", "json-viewer-editable", j), "data-disabled": E || void 0, children: [
     /* @__PURE__ */ a(
-      U,
+      H,
       {
-        "aria-label": l,
+        "aria-label": f,
         variant: "subtle",
         size: "small",
         className: "json-viewer-expand-all",
-        onPress: F,
-        children: u ? /* @__PURE__ */ a(J, { size: "14" }) : /* @__PURE__ */ a(P, { size: "14" })
+        onPress: N,
+        children: u ? /* @__PURE__ */ a(D, { size: "14" }) : /* @__PURE__ */ a(G, { size: "14" })
       }
     ),
     /* @__PURE__ */ a(
@@ -81,8 +82,8 @@ function tt({
       {
         ref: d,
         className: "json-viewer-content",
-        style: { height: C },
-        "aria-label": T,
+        style: L,
+        "aria-label": F,
         role: "textbox",
         "aria-multiline": "true"
       }
@@ -90,6 +91,6 @@ function tt({
   ] });
 }
 export {
-  tt as JsonEditor
+  et as JsonEditor
 };
 //# sourceMappingURL=JsonEditor.js.map

package/dist/lib/ui/primitives/JsonViewer/JsonEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"JsonEditor.js","sources":["../../../../../src/ui/primitives/JsonViewer/JsonEditor.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport clsx from \"clsx\";\nimport { Compartment, EditorState } from \"@codemirror/state\";\nimport { EditorView } from \"@codemirror/view\";\nimport { foldEffect, unfoldAll } from \"@codemirror/language\";\nimport { Button } from \"primitives\";\nimport { IconChevronDown, IconChevronRight } from \"icons\";\nimport { computeFirstLevelFoldRanges, jsonEditorExtensions, jsonEditorTheme, toCssSize } from \"./json-code-mirror\";\nimport \"./jsonviewer.css\";\n\nexport interface JsonEditorProps {\n  value: string;\n  onChange?: (value: string) => void;\n  expandAllLabel: string;\n  className?: string;\n  height?: string | number;\n  isDisabled?: boolean;\n  isReadOnly?: boolean;\n  \"aria-label\"?: string;\n}\n\nconst DEFAULT_HEIGHT = 220;\n\nfunction applyFoldRanges(view: EditorView, ranges: { from: number; to: number }[]) {\n  if (ranges.length > 0) view.dispatch({ effects: ranges.map((range) => foldEffect.of(range)) });\n}\n\n/**\n * Editable sibling of `JsonViewer`: same CodeMirror-based visual (syntax\n * colors, gutter, scrollbar, border/background) but with typing enabled.\n * `JsonViewer` stays read-only-only on purpose so its bundle keeps assuming\n * a static document; this component owns the editable/controlled behavior.\n */\nexport function JsonEditor({\n  value,\n  onChange,\n  expandAllLabel,\n  className,\n  height,\n  isDisabled = false,\n  isReadOnly = false,\n  \"aria-label\": ariaLabel,\n}: JsonEditorProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const viewRef = useRef<EditorView | null>(null);\n  const editableCompartment = useRef(new Compartment());\n  const onChangeRef = useRef(onChange);\n  const lastEmittedRef = useRef(value);\n  const [isExpanded, setIsExpanded] = useState(false);\n  const editorHeight = toCssSize(height ?? DEFAULT_HEIGHT);\n  const isEditable = !isDisabled && !isReadOnly;\n\n  onChangeRef.current = onChange;\n\n  useEffect(() => {\n    if (!containerRef.current) return;\n    const updateListener = EditorView.updateListener.of((update) => {\n      if (!update.docChanged) return;\n      const nextText = update.state.doc.toString();\n      lastEmittedRef.current = nextText;\n      onChangeRef.current?.(nextText);\n    });\n    const view = new EditorView({\n      parent: containerRef.current,\n      state: EditorState.create({\n        doc: value,\n        extensions: [\n          editableCompartment.current.of([EditorView.editable.of(isEditable), EditorState.readOnly.of(!isEditable)]),\n          jsonEditorTheme,\n          ...jsonEditorExtensions,\n          updateListener,\n        ],\n      }),\n    });\n    viewRef.current = view;\n    applyFoldRanges(view, computeFirstLevelFoldRanges(value));\n    return () => {\n      view.destroy();\n      viewRef.current = null;\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    const view = viewRef.current;\n    if (!view) return;\n    const currentText = view.state.doc.toString();\n    if (value !== currentText && value !== lastEmittedRef.current) {\n      view.dispatch({ changes: { from: 0, to: currentText.length, insert: value } });\n      lastEmittedRef.current = value;\n    }\n  }, [value]);\n\n  useEffect(() => {\n    const view = viewRef.current;\n    if (!view) return;\n    view.dispatch({\n      effects: editableCompartment.current.reconfigure([\n        EditorView.editable.of(isEditable),\n        EditorState.readOnly.of(!isEditable),\n      ]),\n    });\n  }, [isEditable]);\n\n  const toggleExpandAll = () => {\n    const view = viewRef.current;\n    if (!view) return;\n    if (isExpanded) {\n      applyFoldRanges(view, computeFirstLevelFoldRanges(view.state.doc.toString()));\n    } else {\n      unfoldAll(view);\n    }\n    setIsExpanded(!isExpanded);\n  };\n\n  return (\n    <div className={clsx(\"json-viewer\", \"json-viewer-editable\", className)} data-disabled={isDisabled || undefined}>\n      <Button\n        aria-label={expandAllLabel}\n        variant=\"subtle\"\n        size=\"small\"\n        className=\"json-viewer-expand-all\"\n        onPress={toggleExpandAll}\n      >\n        {isExpanded ? <IconChevronDown size=\"14\" /> : <IconChevronRight size=\"14\" />}\n      </Button>\n      <div\n        ref={containerRef}\n        className=\"json-viewer-content\"\n        style={{ height: editorHeight }}\n        aria-label={ariaLabel}\n        role=\"textbox\"\n        aria-multiline=\"true\"\n      />\n    </div>\n  );\n}\n"],"names":["DEFAULT_HEIGHT","applyFoldRanges","view","ranges","range","foldEffect","JsonEditor","value","onChange","expandAllLabel","className","height","isDisabled","isReadOnly","ariaLabel","containerRef","useRef","viewRef","editableCompartment","Compartment","onChangeRef","lastEmittedRef","isExpanded","setIsExpanded","useState","editorHeight","toCssSize","isEditable","useEffect","updateListener","EditorView","update","nextText","_a","EditorState","jsonEditorTheme","jsonEditorExtensions","computeFirstLevelFoldRanges","currentText","toggleExpandAll","unfoldAll","jsxs","clsx","jsx","Button","IconChevronDown","IconChevronRight"],"mappings":"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"}
+{"version":3,"file":"JsonEditor.js","sources":["../../../../../src/ui/primitives/JsonViewer/JsonEditor.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport clsx from \"clsx\";\nimport { Compartment, EditorState } from \"@codemirror/state\";\nimport { EditorView } from \"@codemirror/view\";\nimport { foldEffect, unfoldAll } from \"@codemirror/language\";\nimport { Button } from \"primitives\";\nimport { IconChevronDown, IconChevronRight } from \"icons\";\nimport {\n  computeFirstLevelFoldRanges,\n  jsonEditorExtensions,\n  jsonEditorTheme,\n  toEditorSizeStyle,\n} from \"./json-code-mirror\";\nimport type { JsonEditorSize } from \"./json-code-mirror\";\nimport \"./jsonviewer.css\";\n\nexport interface JsonEditorProps extends JsonEditorSize {\n  value: string;\n  onChange?: (value: string) => void;\n  expandAllLabel: string;\n  className?: string;\n  isDisabled?: boolean;\n  isReadOnly?: boolean;\n  \"aria-label\"?: string;\n}\n\nfunction applyFoldRanges(view: EditorView, ranges: { from: number; to: number }[]) {\n  if (ranges.length > 0) view.dispatch({ effects: ranges.map((range) => foldEffect.of(range)) });\n}\n\n/**\n * Editable sibling of `JsonViewer`: same CodeMirror-based visual (syntax\n * colors, gutter, scrollbar, border/background) but with typing enabled.\n * `JsonViewer` stays read-only-only on purpose so its bundle keeps assuming\n * a static document; this component owns the editable/controlled behavior.\n */\nexport function JsonEditor({\n  value,\n  onChange,\n  expandAllLabel,\n  className,\n  height,\n  minHeight,\n  maxHeight,\n  isDisabled = false,\n  isReadOnly = false,\n  \"aria-label\": ariaLabel,\n}: JsonEditorProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const viewRef = useRef<EditorView | null>(null);\n  const editableCompartment = useRef(new Compartment());\n  const onChangeRef = useRef(onChange);\n  const lastEmittedRef = useRef(value);\n  const [isExpanded, setIsExpanded] = useState(false);\n  const editorSizeStyle = toEditorSizeStyle({ height, minHeight, maxHeight });\n  const isEditable = !isDisabled && !isReadOnly;\n\n  onChangeRef.current = onChange;\n\n  useEffect(() => {\n    if (!containerRef.current) return;\n    const updateListener = EditorView.updateListener.of((update) => {\n      if (!update.docChanged) return;\n      const nextText = update.state.doc.toString();\n      lastEmittedRef.current = nextText;\n      onChangeRef.current?.(nextText);\n    });\n    const view = new EditorView({\n      parent: containerRef.current,\n      state: EditorState.create({\n        doc: value,\n        extensions: [\n          editableCompartment.current.of([EditorView.editable.of(isEditable), EditorState.readOnly.of(!isEditable)]),\n          jsonEditorTheme,\n          ...jsonEditorExtensions,\n          updateListener,\n        ],\n      }),\n    });\n    viewRef.current = view;\n    applyFoldRanges(view, computeFirstLevelFoldRanges(value));\n    return () => {\n      view.destroy();\n      viewRef.current = null;\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    const view = viewRef.current;\n    if (!view) return;\n    const currentText = view.state.doc.toString();\n    if (value !== currentText && value !== lastEmittedRef.current) {\n      view.dispatch({ changes: { from: 0, to: currentText.length, insert: value } });\n      lastEmittedRef.current = value;\n    }\n  }, [value]);\n\n  useEffect(() => {\n    const view = viewRef.current;\n    if (!view) return;\n    view.dispatch({\n      effects: editableCompartment.current.reconfigure([\n        EditorView.editable.of(isEditable),\n        EditorState.readOnly.of(!isEditable),\n      ]),\n    });\n  }, [isEditable]);\n\n  const toggleExpandAll = () => {\n    const view = viewRef.current;\n    if (!view) return;\n    if (isExpanded) {\n      applyFoldRanges(view, computeFirstLevelFoldRanges(view.state.doc.toString()));\n    } else {\n      unfoldAll(view);\n    }\n    setIsExpanded(!isExpanded);\n  };\n\n  return (\n    <div className={clsx(\"json-viewer\", \"json-viewer-editable\", className)} data-disabled={isDisabled || undefined}>\n      <Button\n        aria-label={expandAllLabel}\n        variant=\"subtle\"\n        size=\"small\"\n        className=\"json-viewer-expand-all\"\n        onPress={toggleExpandAll}\n      >\n        {isExpanded ? <IconChevronDown size=\"14\" /> : <IconChevronRight size=\"14\" />}\n      </Button>\n      <div\n        ref={containerRef}\n        className=\"json-viewer-content\"\n        style={editorSizeStyle}\n        aria-label={ariaLabel}\n        role=\"textbox\"\n        aria-multiline=\"true\"\n      />\n    </div>\n  );\n}\n"],"names":["applyFoldRanges","view","ranges","range","foldEffect","JsonEditor","value","onChange","expandAllLabel","className","height","minHeight","maxHeight","isDisabled","isReadOnly","ariaLabel","containerRef","useRef","viewRef","editableCompartment","Compartment","onChangeRef","lastEmittedRef","isExpanded","setIsExpanded","useState","editorSizeStyle","toEditorSizeStyle","isEditable","useEffect","updateListener","EditorView","update","nextText","_a","EditorState","jsonEditorTheme","jsonEditorExtensions","computeFirstLevelFoldRanges","currentText","toggleExpandAll","unfoldAll","jsxs","clsx","jsx","Button","IconChevronDown","IconChevronRight"],"mappings":"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"}

package/dist/lib/ui/primitives/JsonViewer/JsonViewer.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),s=require("react"),R=require("../../../vendor/clsx/dist/clsx.cjs"),x=require("@codemirror/state"),g=require("@codemirror/view"),w=require("@codemirror/language"),o=require("./json-code-mirror.cjs");;/* empty css                 */const b=require("../../icons/IconChevronDown.cjs"),y=require("../../icons/IconChevronRight.cjs"),j=require("../Button/Button.cjs"),S=220;function f(i,c){c.length>0&&i.dispatch({effects:c.map(r=>w.foldEffect.of(r))})}function z({value:i,expandAllLabel:c,actions:r,className:m,height:E}){const u=s.useRef(null),l=s.useRef(null),[d,h]=s.useState(!1),n=s.useMemo(()=>o.serializeJson(i),[i]),a=s.useMemo(()=>o.computeFirstLevelFoldRanges(n),[n]),p=o.toCssSize(E??S);s.useEffect(()=>{if(!u.current)return;const e=new g.EditorView({parent:u.current,state:x.EditorState.create({doc:n,extensions:[g.EditorView.editable.of(!1),x.EditorState.readOnly.of(!0),o.jsonEditorTheme,...o.jsonEditorExtensions]})});return l.current=e,f(e,a),()=>{e.destroy(),l.current=null}},[]),s.useEffect(()=>{const e=l.current;if(!e)return;const v=e.state.doc.toString();v!==n&&(e.dispatch({changes:{from:0,to:v.length,insert:n}}),f(e,a),h(!1))},[n,a]);const q=()=>{const e=l.current;e&&(d?f(e,a):w.unfoldAll(e),h(!d))};return t.jsxs("div",{className:R.clsx("json-viewer",m),children:[t.jsx(j.Button,{"aria-label":c,variant:"subtle",size:"small",className:"json-viewer-expand-all",onPress:q,children:d?t.jsx(b.IconChevronDown,{size:"14"}):t.jsx(y.IconChevronRight,{size:"14"})}),r&&r.length>0&&t.jsx("div",{className:"json-viewer-actions",children:r.map(e=>t.jsx(j.Button,{"aria-label":e.label,variant:"subtle",size:"small",className:"json-viewer-action",onPress:e.onPress,children:e.icon},e.key))}),t.jsx("div",{ref:u,className:"json-viewer-content",style:{height:p}})]})}exports.JsonViewer=z;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),s=require("react"),y=require("../../../vendor/clsx/dist/clsx.cjs"),h=require("@codemirror/state"),j=require("@codemirror/view"),m=require("@codemirror/language"),o=require("./json-code-mirror.cjs");;/* empty css                 */const b=require("../../icons/IconChevronDown.cjs"),z=require("../../icons/IconChevronRight.cjs"),w=require("../Button/Button.cjs");function f(i,c){c.length>0&&i.dispatch({effects:c.map(r=>m.foldEffect.of(r))})}function C({value:i,expandAllLabel:c,actions:r,className:g,height:E,minHeight:p,maxHeight:q}){const u=s.useRef(null),l=s.useRef(null),[d,v]=s.useState(!1),n=s.useMemo(()=>o.serializeJson(i),[i]),a=s.useMemo(()=>o.computeFirstLevelFoldRanges(n),[n]),R=o.toEditorSizeStyle({height:E,minHeight:p,maxHeight:q});s.useEffect(()=>{if(!u.current)return;const e=new j.EditorView({parent:u.current,state:h.EditorState.create({doc:n,extensions:[j.EditorView.editable.of(!1),h.EditorState.readOnly.of(!0),o.jsonEditorTheme,...o.jsonEditorExtensions]})});return l.current=e,f(e,a),()=>{e.destroy(),l.current=null}},[]),s.useEffect(()=>{const e=l.current;if(!e)return;const x=e.state.doc.toString();x!==n&&(e.dispatch({changes:{from:0,to:x.length,insert:n}}),f(e,a),v(!1))},[n,a]);const S=()=>{const e=l.current;e&&(d?f(e,a):m.unfoldAll(e),v(!d))};return t.jsxs("div",{className:y.clsx("json-viewer",g),children:[t.jsx(w.Button,{"aria-label":c,variant:"subtle",size:"small",className:"json-viewer-expand-all",onPress:S,children:d?t.jsx(b.IconChevronDown,{size:"14"}):t.jsx(z.IconChevronRight,{size:"14"})}),r&&r.length>0&&t.jsx("div",{className:"json-viewer-actions",children:r.map(e=>t.jsx(w.Button,{"aria-label":e.label,variant:"subtle",size:"small",className:"json-viewer-action",onPress:e.onPress,children:e.icon},e.key))}),t.jsx("div",{ref:u,className:"json-viewer-content",style:R})]})}exports.JsonViewer=C;
 //# sourceMappingURL=JsonViewer.cjs.map

package/dist/lib/ui/primitives/JsonViewer/JsonViewer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"JsonViewer.cjs","sources":["../../../../../src/ui/primitives/JsonViewer/JsonViewer.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport clsx from \"clsx\";\nimport { EditorState } from \"@codemirror/state\";\nimport { EditorView } from \"@codemirror/view\";\nimport { foldEffect, unfoldAll } from \"@codemirror/language\";\nimport { Button } from \"primitives\";\nimport { IconChevronDown, IconChevronRight } from \"icons\";\nimport {\n  computeFirstLevelFoldRanges,\n  jsonEditorExtensions,\n  jsonEditorTheme,\n  serializeJson,\n  toCssSize,\n} from \"./json-code-mirror\";\nimport \"./jsonviewer.css\";\n\nexport interface JsonViewerAction {\n  key: string;\n  label: string;\n  icon: ReactNode;\n  onPress: () => void;\n}\n\nexport interface JsonViewerProps {\n  value: unknown;\n  expandAllLabel: string;\n  actions?: JsonViewerAction[];\n  className?: string;\n  height?: string | number;\n}\n\nconst DEFAULT_HEIGHT = 220;\n\nfunction applyFoldRanges(view: EditorView, ranges: { from: number; to: number }[]) {\n  if (ranges.length > 0) view.dispatch({ effects: ranges.map((range) => foldEffect.of(range)) });\n}\n\nexport function JsonViewer({ value, expandAllLabel, actions, className, height }: JsonViewerProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const viewRef = useRef<EditorView | null>(null);\n  const [isExpanded, setIsExpanded] = useState(false);\n  const text = useMemo(() => serializeJson(value), [value]);\n  const foldRanges = useMemo(() => computeFirstLevelFoldRanges(text), [text]);\n  const editorHeight = toCssSize(height ?? DEFAULT_HEIGHT);\n\n  useEffect(() => {\n    if (!containerRef.current) return;\n    const view = new EditorView({\n      parent: containerRef.current,\n      state: EditorState.create({\n        doc: text,\n        extensions: [EditorView.editable.of(false), EditorState.readOnly.of(true), jsonEditorTheme, ...jsonEditorExtensions],\n      }),\n    });\n    viewRef.current = view;\n    applyFoldRanges(view, foldRanges);\n    return () => {\n      view.destroy();\n      viewRef.current = null;\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    const view = viewRef.current;\n    if (!view) return;\n    const currentText = view.state.doc.toString();\n    if (currentText !== text) {\n      view.dispatch({ changes: { from: 0, to: currentText.length, insert: text } });\n      applyFoldRanges(view, foldRanges);\n      setIsExpanded(false);\n    }\n  }, [text, foldRanges]);\n\n  const toggleExpandAll = () => {\n    const view = viewRef.current;\n    if (!view) return;\n    if (isExpanded) {\n      applyFoldRanges(view, foldRanges);\n    } else {\n      unfoldAll(view);\n    }\n    setIsExpanded(!isExpanded);\n  };\n\n  return (\n    <div className={clsx(\"json-viewer\", className)}>\n      <Button\n        aria-label={expandAllLabel}\n        variant=\"subtle\"\n        size=\"small\"\n        className=\"json-viewer-expand-all\"\n        onPress={toggleExpandAll}\n      >\n        {isExpanded ? <IconChevronDown size=\"14\" /> : <IconChevronRight size=\"14\" />}\n      </Button>\n      {actions && actions.length > 0 && (\n        <div className=\"json-viewer-actions\">\n          {actions.map((action) => (\n            <Button\n              key={action.key}\n              aria-label={action.label}\n              variant=\"subtle\"\n              size=\"small\"\n              className=\"json-viewer-action\"\n              onPress={action.onPress}\n            >\n              {action.icon}\n            </Button>\n          ))}\n        </div>\n      )}\n      <div ref={containerRef} className=\"json-viewer-content\" style={{ height: editorHeight }} />\n    </div>\n  );\n}\n"],"names":["DEFAULT_HEIGHT","applyFoldRanges","view","ranges","range","foldEffect","JsonViewer","value","expandAllLabel","actions","className","height","containerRef","useRef","viewRef","isExpanded","setIsExpanded","useState","text","useMemo","serializeJson","foldRanges","computeFirstLevelFoldRanges","editorHeight","toCssSize","useEffect","EditorView","EditorState","jsonEditorTheme","jsonEditorExtensions","currentText","toggleExpandAll","unfoldAll","clsx","jsx","Button","IconChevronDown","IconChevronRight","action"],"mappings":"8dAgCMA,EAAiB,IAEvB,SAASC,EAAgBC,EAAkBC,EAAwC,CAC7EA,EAAO,OAAS,GAAGD,EAAK,SAAS,CAAE,QAASC,EAAO,IAAKC,GAAUC,EAAAA,WAAW,GAAGD,CAAK,CAAC,EAAG,CAC/F,CAEO,SAASE,EAAW,CAAE,MAAAC,EAAO,eAAAC,EAAgB,QAAAC,EAAS,UAAAC,EAAW,OAAAC,GAA2B,CACjG,MAAMC,EAAeC,EAAAA,OAAuB,IAAI,EAC1CC,EAAUD,EAAAA,OAA0B,IAAI,EACxC,CAACE,EAAYC,CAAa,EAAIC,EAAAA,SAAS,EAAK,EAC5CC,EAAOC,EAAAA,QAAQ,IAAMC,EAAAA,cAAcb,CAAK,EAAG,CAACA,CAAK,CAAC,EAClDc,EAAaF,EAAAA,QAAQ,IAAMG,EAAAA,4BAA4BJ,CAAI,EAAG,CAACA,CAAI,CAAC,EACpEK,EAAeC,EAAAA,UAAUb,GAAUX,CAAc,EAEvDyB,EAAAA,UAAU,IAAM,CACd,GAAI,CAACb,EAAa,QAAS,OAC3B,MAAMV,EAAO,IAAIwB,aAAW,CAC1B,OAAQd,EAAa,QACrB,MAAOe,EAAAA,YAAY,OAAO,CACxB,IAAKT,EACL,WAAY,CAACQ,EAAAA,WAAW,SAAS,GAAG,EAAK,EAAGC,cAAY,SAAS,GAAG,EAAI,EAAGC,EAAAA,gBAAiB,GAAGC,EAAAA,oBAAoB,CAAA,CACpH,CAAA,CACF,EACD,OAAAf,EAAQ,QAAUZ,EAClBD,EAAgBC,EAAMmB,CAAU,EACzB,IAAM,CACXnB,EAAK,QAAA,EACLY,EAAQ,QAAU,IACpB,CAEF,EAAG,CAAA,CAAE,EAELW,EAAAA,UAAU,IAAM,CACd,MAAMvB,EAAOY,EAAQ,QACrB,GAAI,CAACZ,EAAM,OACX,MAAM4B,EAAc5B,EAAK,MAAM,IAAI,SAAA,EAC/B4B,IAAgBZ,IAClBhB,EAAK,SAAS,CAAE,QAAS,CAAE,KAAM,EAAG,GAAI4B,EAAY,OAAQ,OAAQZ,CAAA,CAAK,CAAG,EAC5EjB,EAAgBC,EAAMmB,CAAU,EAChCL,EAAc,EAAK,EAEvB,EAAG,CAACE,EAAMG,CAAU,CAAC,EAErB,MAAMU,EAAkB,IAAM,CAC5B,MAAM7B,EAAOY,EAAQ,QAChBZ,IACDa,EACFd,EAAgBC,EAAMmB,CAAU,EAEhCW,EAAAA,UAAU9B,CAAI,EAEhBc,EAAc,CAACD,CAAU,EAC3B,EAEA,cACG,MAAA,CAAI,UAAWkB,EAAAA,KAAK,cAAevB,CAAS,EAC3C,SAAA,CAAAwB,EAAAA,IAACC,EAAAA,OAAA,CACC,aAAY3B,EACZ,QAAQ,SACR,KAAK,QACL,UAAU,yBACV,QAASuB,EAER,SAAAhB,QAAcqB,EAAAA,gBAAA,CAAgB,KAAK,KAAK,EAAKF,EAAAA,IAACG,EAAAA,iBAAA,CAAiB,KAAK,IAAA,CAAK,CAAA,CAAA,EAE3E5B,GAAWA,EAAQ,OAAS,GAC3ByB,EAAAA,IAAC,MAAA,CAAI,UAAU,sBACZ,SAAAzB,EAAQ,IAAK6B,GACZJ,EAAAA,IAACC,EAAAA,OAAA,CAEC,aAAYG,EAAO,MACnB,QAAQ,SACR,KAAK,QACL,UAAU,qBACV,QAASA,EAAO,QAEf,SAAAA,EAAO,IAAA,EAPHA,EAAO,GAAA,CASf,EACH,EAEFJ,EAAAA,IAAC,MAAA,CAAI,IAAKtB,EAAc,UAAU,sBAAsB,MAAO,CAAE,OAAQW,EAAa,CAAG,CAAA,EAC3F,CAEJ"}
+{"version":3,"file":"JsonViewer.cjs","sources":["../../../../../src/ui/primitives/JsonViewer/JsonViewer.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport clsx from \"clsx\";\nimport { EditorState } from \"@codemirror/state\";\nimport { EditorView } from \"@codemirror/view\";\nimport { foldEffect, unfoldAll } from \"@codemirror/language\";\nimport { Button } from \"primitives\";\nimport { IconChevronDown, IconChevronRight } from \"icons\";\nimport {\n  computeFirstLevelFoldRanges,\n  jsonEditorExtensions,\n  jsonEditorTheme,\n  serializeJson,\n  toEditorSizeStyle,\n} from \"./json-code-mirror\";\nimport type { JsonEditorSize } from \"./json-code-mirror\";\nimport \"./jsonviewer.css\";\n\nexport interface JsonViewerAction {\n  key: string;\n  label: string;\n  icon: ReactNode;\n  onPress: () => void;\n}\n\nexport interface JsonViewerProps extends JsonEditorSize {\n  value: unknown;\n  expandAllLabel: string;\n  actions?: JsonViewerAction[];\n  className?: string;\n}\n\nfunction applyFoldRanges(view: EditorView, ranges: { from: number; to: number }[]) {\n  if (ranges.length > 0) view.dispatch({ effects: ranges.map((range) => foldEffect.of(range)) });\n}\n\nexport function JsonViewer({\n  value,\n  expandAllLabel,\n  actions,\n  className,\n  height,\n  minHeight,\n  maxHeight,\n}: JsonViewerProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const viewRef = useRef<EditorView | null>(null);\n  const [isExpanded, setIsExpanded] = useState(false);\n  const text = useMemo(() => serializeJson(value), [value]);\n  const foldRanges = useMemo(() => computeFirstLevelFoldRanges(text), [text]);\n  const editorSizeStyle = toEditorSizeStyle({ height, minHeight, maxHeight });\n\n  useEffect(() => {\n    if (!containerRef.current) return;\n    const view = new EditorView({\n      parent: containerRef.current,\n      state: EditorState.create({\n        doc: text,\n        extensions: [EditorView.editable.of(false), EditorState.readOnly.of(true), jsonEditorTheme, ...jsonEditorExtensions],\n      }),\n    });\n    viewRef.current = view;\n    applyFoldRanges(view, foldRanges);\n    return () => {\n      view.destroy();\n      viewRef.current = null;\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    const view = viewRef.current;\n    if (!view) return;\n    const currentText = view.state.doc.toString();\n    if (currentText !== text) {\n      view.dispatch({ changes: { from: 0, to: currentText.length, insert: text } });\n      applyFoldRanges(view, foldRanges);\n      setIsExpanded(false);\n    }\n  }, [text, foldRanges]);\n\n  const toggleExpandAll = () => {\n    const view = viewRef.current;\n    if (!view) return;\n    if (isExpanded) {\n      applyFoldRanges(view, foldRanges);\n    } else {\n      unfoldAll(view);\n    }\n    setIsExpanded(!isExpanded);\n  };\n\n  return (\n    <div className={clsx(\"json-viewer\", className)}>\n      <Button\n        aria-label={expandAllLabel}\n        variant=\"subtle\"\n        size=\"small\"\n        className=\"json-viewer-expand-all\"\n        onPress={toggleExpandAll}\n      >\n        {isExpanded ? <IconChevronDown size=\"14\" /> : <IconChevronRight size=\"14\" />}\n      </Button>\n      {actions && actions.length > 0 && (\n        <div className=\"json-viewer-actions\">\n          {actions.map((action) => (\n            <Button\n              key={action.key}\n              aria-label={action.label}\n              variant=\"subtle\"\n              size=\"small\"\n              className=\"json-viewer-action\"\n              onPress={action.onPress}\n            >\n              {action.icon}\n            </Button>\n          ))}\n        </div>\n      )}\n      <div ref={containerRef} className=\"json-viewer-content\" style={editorSizeStyle} />\n    </div>\n  );\n}\n"],"names":["applyFoldRanges","view","ranges","range","foldEffect","JsonViewer","value","expandAllLabel","actions","className","height","minHeight","maxHeight","containerRef","useRef","viewRef","isExpanded","setIsExpanded","useState","text","useMemo","serializeJson","foldRanges","computeFirstLevelFoldRanges","editorSizeStyle","toEditorSizeStyle","useEffect","EditorView","EditorState","jsonEditorTheme","jsonEditorExtensions","currentText","toggleExpandAll","unfoldAll","clsx","jsx","Button","IconChevronDown","IconChevronRight","action"],"mappings":"8dAgCA,SAASA,EAAgBC,EAAkBC,EAAwC,CAC7EA,EAAO,OAAS,GAAGD,EAAK,SAAS,CAAE,QAASC,EAAO,IAAKC,GAAUC,EAAAA,WAAW,GAAGD,CAAK,CAAC,EAAG,CAC/F,CAEO,SAASE,EAAW,CACzB,MAAAC,EACA,eAAAC,EACA,QAAAC,EACA,UAAAC,EACA,OAAAC,EACA,UAAAC,EACA,UAAAC,CACF,EAAoB,CAClB,MAAMC,EAAeC,EAAAA,OAAuB,IAAI,EAC1CC,EAAUD,EAAAA,OAA0B,IAAI,EACxC,CAACE,EAAYC,CAAa,EAAIC,EAAAA,SAAS,EAAK,EAC5CC,EAAOC,EAAAA,QAAQ,IAAMC,EAAAA,cAAcf,CAAK,EAAG,CAACA,CAAK,CAAC,EAClDgB,EAAaF,EAAAA,QAAQ,IAAMG,EAAAA,4BAA4BJ,CAAI,EAAG,CAACA,CAAI,CAAC,EACpEK,EAAkBC,EAAAA,kBAAkB,CAAE,OAAAf,EAAQ,UAAAC,EAAW,UAAAC,EAAW,EAE1Ec,EAAAA,UAAU,IAAM,CACd,GAAI,CAACb,EAAa,QAAS,OAC3B,MAAMZ,EAAO,IAAI0B,aAAW,CAC1B,OAAQd,EAAa,QACrB,MAAOe,EAAAA,YAAY,OAAO,CACxB,IAAKT,EACL,WAAY,CAACQ,EAAAA,WAAW,SAAS,GAAG,EAAK,EAAGC,cAAY,SAAS,GAAG,EAAI,EAAGC,EAAAA,gBAAiB,GAAGC,EAAAA,oBAAoB,CAAA,CACpH,CAAA,CACF,EACD,OAAAf,EAAQ,QAAUd,EAClBD,EAAgBC,EAAMqB,CAAU,EACzB,IAAM,CACXrB,EAAK,QAAA,EACLc,EAAQ,QAAU,IACpB,CAEF,EAAG,CAAA,CAAE,EAELW,EAAAA,UAAU,IAAM,CACd,MAAMzB,EAAOc,EAAQ,QACrB,GAAI,CAACd,EAAM,OACX,MAAM8B,EAAc9B,EAAK,MAAM,IAAI,SAAA,EAC/B8B,IAAgBZ,IAClBlB,EAAK,SAAS,CAAE,QAAS,CAAE,KAAM,EAAG,GAAI8B,EAAY,OAAQ,OAAQZ,CAAA,CAAK,CAAG,EAC5EnB,EAAgBC,EAAMqB,CAAU,EAChCL,EAAc,EAAK,EAEvB,EAAG,CAACE,EAAMG,CAAU,CAAC,EAErB,MAAMU,EAAkB,IAAM,CAC5B,MAAM/B,EAAOc,EAAQ,QAChBd,IACDe,EACFhB,EAAgBC,EAAMqB,CAAU,EAEhCW,EAAAA,UAAUhC,CAAI,EAEhBgB,EAAc,CAACD,CAAU,EAC3B,EAEA,cACG,MAAA,CAAI,UAAWkB,EAAAA,KAAK,cAAezB,CAAS,EAC3C,SAAA,CAAA0B,EAAAA,IAACC,EAAAA,OAAA,CACC,aAAY7B,EACZ,QAAQ,SACR,KAAK,QACL,UAAU,yBACV,QAASyB,EAER,SAAAhB,QAAcqB,EAAAA,gBAAA,CAAgB,KAAK,KAAK,EAAKF,EAAAA,IAACG,EAAAA,iBAAA,CAAiB,KAAK,IAAA,CAAK,CAAA,CAAA,EAE3E9B,GAAWA,EAAQ,OAAS,GAC3B2B,EAAAA,IAAC,MAAA,CAAI,UAAU,sBACZ,SAAA3B,EAAQ,IAAK+B,GACZJ,EAAAA,IAACC,EAAAA,OAAA,CAEC,aAAYG,EAAO,MACnB,QAAQ,SACR,KAAK,QACL,UAAU,qBACV,QAASA,EAAO,QAEf,SAAAA,EAAO,IAAA,EAPHA,EAAO,GAAA,CASf,EACH,QAED,MAAA,CAAI,IAAK1B,EAAc,UAAU,sBAAsB,MAAOW,CAAA,CAAiB,CAAA,EAClF,CAEJ"}

package/dist/lib/ui/primitives/JsonViewer/JsonViewer.js

@@ -1,33 +1,40 @@
-import { jsxs as b, jsx as r } from "react/jsx-runtime";
-import { useRef as u, useState as z, useMemo as p, useEffect as h } from "react";
-import { clsx as y } from "../../../vendor/clsx/dist/clsx.js";
-import { EditorState as v } from "@codemirror/state";
+import { jsxs as S, jsx as r } from "react/jsx-runtime";
+import { useRef as u, useState as b, useMemo as p, useEffect as v } from "react";
+import { clsx as N } from "../../../vendor/clsx/dist/clsx.js";
+import { EditorState as h } from "@codemirror/state";
 import { EditorView as w } from "@codemirror/view";
-import { foldEffect as N, unfoldAll as F } from "@codemirror/language";
-import { serializeJson as I, computeFirstLevelFoldRanges as S, jsonEditorTheme as T, jsonEditorExtensions as A, toCssSize as C } from "./json-code-mirror.js";
+import { foldEffect as F, unfoldAll as I } from "@codemirror/language";
+import { serializeJson as P, computeFirstLevelFoldRanges as A, jsonEditorTheme as C, jsonEditorExtensions as J, toEditorSizeStyle as T } from "./json-code-mirror.js";
 /* empty css               */
-import { IconChevronDown as H } from "../../icons/IconChevronDown.js";
-import { IconChevronRight as P } from "../../icons/IconChevronRight.js";
-import { Button as g } from "../Button/Button.js";
-const D = 220;
-function f(s, n) {
-  n.length > 0 && s.dispatch({ effects: n.map((o) => N.of(o)) });
+import { IconChevronDown as V } from "../../icons/IconChevronDown.js";
+import { IconChevronRight as k } from "../../icons/IconChevronRight.js";
+import { Button as x } from "../Button/Button.js";
+function f(n, s) {
+  s.length > 0 && n.dispatch({ effects: s.map((o) => F.of(o)) });
 }
-function K({ value: s, expandAllLabel: n, actions: o, className: x, height: E }) {
-  const a = u(null), i = u(null), [c, m] = z(!1), t = p(() => I(s), [s]), l = p(() => S(t), [t]), j = C(E ?? D);
-  h(() => {
+function W({
+  value: n,
+  expandAllLabel: s,
+  actions: o,
+  className: E,
+  height: g,
+  minHeight: j,
+  maxHeight: y
+}) {
+  const a = u(null), i = u(null), [c, m] = b(!1), t = p(() => P(n), [n]), l = p(() => A(t), [t]), z = T({ height: g, minHeight: j, maxHeight: y });
+  v(() => {
     if (!a.current) return;
     const e = new w({
       parent: a.current,
-      state: v.create({
+      state: h.create({
         doc: t,
-        extensions: [w.editable.of(!1), v.readOnly.of(!0), T, ...A]
+        extensions: [w.editable.of(!1), h.readOnly.of(!0), C, ...J]
       })
     });
     return i.current = e, f(e, l), () => {
       e.destroy(), i.current = null;
     };
-  }, []), h(() => {
+  }, []), v(() => {
     const e = i.current;
     if (!e) return;
     const d = e.state.doc.toString();
@@ -35,22 +42,22 @@ function K({ value: s, expandAllLabel: n, actions: o, className: x, height: E })
   }, [t, l]);
   const R = () => {
     const e = i.current;
-    e && (c ? f(e, l) : F(e), m(!c));
+    e && (c ? f(e, l) : I(e), m(!c));
   };
-  return /* @__PURE__ */ b("div", { className: y("json-viewer", x), children: [
+  return /* @__PURE__ */ S("div", { className: N("json-viewer", E), children: [
     /* @__PURE__ */ r(
-      g,
+      x,
       {
-        "aria-label": n,
+        "aria-label": s,
         variant: "subtle",
         size: "small",
         className: "json-viewer-expand-all",
         onPress: R,
-        children: c ? /* @__PURE__ */ r(H, { size: "14" }) : /* @__PURE__ */ r(P, { size: "14" })
+        children: c ? /* @__PURE__ */ r(V, { size: "14" }) : /* @__PURE__ */ r(k, { size: "14" })
       }
     ),
     o && o.length > 0 && /* @__PURE__ */ r("div", { className: "json-viewer-actions", children: o.map((e) => /* @__PURE__ */ r(
-      g,
+      x,
       {
         "aria-label": e.label,
         variant: "subtle",
@@ -61,10 +68,10 @@ function K({ value: s, expandAllLabel: n, actions: o, className: x, height: E })
       },
       e.key
     )) }),
-    /* @__PURE__ */ r("div", { ref: a, className: "json-viewer-content", style: { height: j } })
+    /* @__PURE__ */ r("div", { ref: a, className: "json-viewer-content", style: z })
   ] });
 }
 export {
-  K as JsonViewer
+  W as JsonViewer
 };
 //# sourceMappingURL=JsonViewer.js.map

package/dist/lib/ui/primitives/JsonViewer/JsonViewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"JsonViewer.js","sources":["../../../../../src/ui/primitives/JsonViewer/JsonViewer.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport clsx from \"clsx\";\nimport { EditorState } from \"@codemirror/state\";\nimport { EditorView } from \"@codemirror/view\";\nimport { foldEffect, unfoldAll } from \"@codemirror/language\";\nimport { Button } from \"primitives\";\nimport { IconChevronDown, IconChevronRight } from \"icons\";\nimport {\n  computeFirstLevelFoldRanges,\n  jsonEditorExtensions,\n  jsonEditorTheme,\n  serializeJson,\n  toCssSize,\n} from \"./json-code-mirror\";\nimport \"./jsonviewer.css\";\n\nexport interface JsonViewerAction {\n  key: string;\n  label: string;\n  icon: ReactNode;\n  onPress: () => void;\n}\n\nexport interface JsonViewerProps {\n  value: unknown;\n  expandAllLabel: string;\n  actions?: JsonViewerAction[];\n  className?: string;\n  height?: string | number;\n}\n\nconst DEFAULT_HEIGHT = 220;\n\nfunction applyFoldRanges(view: EditorView, ranges: { from: number; to: number }[]) {\n  if (ranges.length > 0) view.dispatch({ effects: ranges.map((range) => foldEffect.of(range)) });\n}\n\nexport function JsonViewer({ value, expandAllLabel, actions, className, height }: JsonViewerProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const viewRef = useRef<EditorView | null>(null);\n  const [isExpanded, setIsExpanded] = useState(false);\n  const text = useMemo(() => serializeJson(value), [value]);\n  const foldRanges = useMemo(() => computeFirstLevelFoldRanges(text), [text]);\n  const editorHeight = toCssSize(height ?? DEFAULT_HEIGHT);\n\n  useEffect(() => {\n    if (!containerRef.current) return;\n    const view = new EditorView({\n      parent: containerRef.current,\n      state: EditorState.create({\n        doc: text,\n        extensions: [EditorView.editable.of(false), EditorState.readOnly.of(true), jsonEditorTheme, ...jsonEditorExtensions],\n      }),\n    });\n    viewRef.current = view;\n    applyFoldRanges(view, foldRanges);\n    return () => {\n      view.destroy();\n      viewRef.current = null;\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    const view = viewRef.current;\n    if (!view) return;\n    const currentText = view.state.doc.toString();\n    if (currentText !== text) {\n      view.dispatch({ changes: { from: 0, to: currentText.length, insert: text } });\n      applyFoldRanges(view, foldRanges);\n      setIsExpanded(false);\n    }\n  }, [text, foldRanges]);\n\n  const toggleExpandAll = () => {\n    const view = viewRef.current;\n    if (!view) return;\n    if (isExpanded) {\n      applyFoldRanges(view, foldRanges);\n    } else {\n      unfoldAll(view);\n    }\n    setIsExpanded(!isExpanded);\n  };\n\n  return (\n    <div className={clsx(\"json-viewer\", className)}>\n      <Button\n        aria-label={expandAllLabel}\n        variant=\"subtle\"\n        size=\"small\"\n        className=\"json-viewer-expand-all\"\n        onPress={toggleExpandAll}\n      >\n        {isExpanded ? <IconChevronDown size=\"14\" /> : <IconChevronRight size=\"14\" />}\n      </Button>\n      {actions && actions.length > 0 && (\n        <div className=\"json-viewer-actions\">\n          {actions.map((action) => (\n            <Button\n              key={action.key}\n              aria-label={action.label}\n              variant=\"subtle\"\n              size=\"small\"\n              className=\"json-viewer-action\"\n              onPress={action.onPress}\n            >\n              {action.icon}\n            </Button>\n          ))}\n        </div>\n      )}\n      <div ref={containerRef} className=\"json-viewer-content\" style={{ height: editorHeight }} />\n    </div>\n  );\n}\n"],"names":["DEFAULT_HEIGHT","applyFoldRanges","view","ranges","range","foldEffect","JsonViewer","value","expandAllLabel","actions","className","height","containerRef","useRef","viewRef","isExpanded","setIsExpanded","useState","text","useMemo","serializeJson","foldRanges","computeFirstLevelFoldRanges","editorHeight","toCssSize","useEffect","EditorView","EditorState","jsonEditorTheme","jsonEditorExtensions","currentText","toggleExpandAll","unfoldAll","clsx","jsx","Button","IconChevronDown","IconChevronRight","action"],"mappings":";;;;;;;;;;;AAgCA,MAAMA,IAAiB;AAEvB,SAASC,EAAgBC,GAAkBC,GAAwC;AACjF,EAAIA,EAAO,SAAS,KAAGD,EAAK,SAAS,EAAE,SAASC,EAAO,IAAI,CAACC,MAAUC,EAAW,GAAGD,CAAK,CAAC,GAAG;AAC/F;AAEO,SAASE,EAAW,EAAE,OAAAC,GAAO,gBAAAC,GAAgB,SAAAC,GAAS,WAAAC,GAAW,QAAAC,KAA2B;AACjG,QAAMC,IAAeC,EAAuB,IAAI,GAC1CC,IAAUD,EAA0B,IAAI,GACxC,CAACE,GAAYC,CAAa,IAAIC,EAAS,EAAK,GAC5CC,IAAOC,EAAQ,MAAMC,EAAcb,CAAK,GAAG,CAACA,CAAK,CAAC,GAClDc,IAAaF,EAAQ,MAAMG,EAA4BJ,CAAI,GAAG,CAACA,CAAI,CAAC,GACpEK,IAAeC,EAAUb,KAAUX,CAAc;AAEvD,EAAAyB,EAAU,MAAM;AACd,QAAI,CAACb,EAAa,QAAS;AAC3B,UAAMV,IAAO,IAAIwB,EAAW;AAAA,MAC1B,QAAQd,EAAa;AAAA,MACrB,OAAOe,EAAY,OAAO;AAAA,QACxB,KAAKT;AAAA,QACL,YAAY,CAACQ,EAAW,SAAS,GAAG,EAAK,GAAGC,EAAY,SAAS,GAAG,EAAI,GAAGC,GAAiB,GAAGC,CAAoB;AAAA,MAAA,CACpH;AAAA,IAAA,CACF;AACD,WAAAf,EAAQ,UAAUZ,GAClBD,EAAgBC,GAAMmB,CAAU,GACzB,MAAM;AACX,MAAAnB,EAAK,QAAA,GACLY,EAAQ,UAAU;AAAA,IACpB;AAAA,EAEF,GAAG,CAAA,CAAE,GAELW,EAAU,MAAM;AACd,UAAMvB,IAAOY,EAAQ;AACrB,QAAI,CAACZ,EAAM;AACX,UAAM4B,IAAc5B,EAAK,MAAM,IAAI,SAAA;AACnC,IAAI4B,MAAgBZ,MAClBhB,EAAK,SAAS,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI4B,EAAY,QAAQ,QAAQZ,EAAA,EAAK,CAAG,GAC5EjB,EAAgBC,GAAMmB,CAAU,GAChCL,EAAc,EAAK;AAAA,EAEvB,GAAG,CAACE,GAAMG,CAAU,CAAC;AAErB,QAAMU,IAAkB,MAAM;AAC5B,UAAM7B,IAAOY,EAAQ;AACrB,IAAKZ,MACDa,IACFd,EAAgBC,GAAMmB,CAAU,IAEhCW,EAAU9B,CAAI,GAEhBc,EAAc,CAACD,CAAU;AAAA,EAC3B;AAEA,2BACG,OAAA,EAAI,WAAWkB,EAAK,eAAevB,CAAS,GAC3C,UAAA;AAAA,IAAA,gBAAAwB;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,cAAY3B;AAAA,QACZ,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAASuB;AAAA,QAER,UAAAhB,sBAAcqB,GAAA,EAAgB,MAAK,MAAK,IAAK,gBAAAF,EAACG,GAAA,EAAiB,MAAK,KAAA,CAAK;AAAA,MAAA;AAAA,IAAA;AAAA,IAE3E5B,KAAWA,EAAQ,SAAS,KAC3B,gBAAAyB,EAAC,OAAA,EAAI,WAAU,uBACZ,UAAAzB,EAAQ,IAAI,CAAC6B,MACZ,gBAAAJ;AAAA,MAACC;AAAA,MAAA;AAAA,QAEC,cAAYG,EAAO;AAAA,QACnB,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAASA,EAAO;AAAA,QAEf,UAAAA,EAAO;AAAA,MAAA;AAAA,MAPHA,EAAO;AAAA,IAAA,CASf,GACH;AAAA,IAEF,gBAAAJ,EAAC,OAAA,EAAI,KAAKtB,GAAc,WAAU,uBAAsB,OAAO,EAAE,QAAQW,IAAa,CAAG;AAAA,EAAA,GAC3F;AAEJ;"}
+{"version":3,"file":"JsonViewer.js","sources":["../../../../../src/ui/primitives/JsonViewer/JsonViewer.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport clsx from \"clsx\";\nimport { EditorState } from \"@codemirror/state\";\nimport { EditorView } from \"@codemirror/view\";\nimport { foldEffect, unfoldAll } from \"@codemirror/language\";\nimport { Button } from \"primitives\";\nimport { IconChevronDown, IconChevronRight } from \"icons\";\nimport {\n  computeFirstLevelFoldRanges,\n  jsonEditorExtensions,\n  jsonEditorTheme,\n  serializeJson,\n  toEditorSizeStyle,\n} from \"./json-code-mirror\";\nimport type { JsonEditorSize } from \"./json-code-mirror\";\nimport \"./jsonviewer.css\";\n\nexport interface JsonViewerAction {\n  key: string;\n  label: string;\n  icon: ReactNode;\n  onPress: () => void;\n}\n\nexport interface JsonViewerProps extends JsonEditorSize {\n  value: unknown;\n  expandAllLabel: string;\n  actions?: JsonViewerAction[];\n  className?: string;\n}\n\nfunction applyFoldRanges(view: EditorView, ranges: { from: number; to: number }[]) {\n  if (ranges.length > 0) view.dispatch({ effects: ranges.map((range) => foldEffect.of(range)) });\n}\n\nexport function JsonViewer({\n  value,\n  expandAllLabel,\n  actions,\n  className,\n  height,\n  minHeight,\n  maxHeight,\n}: JsonViewerProps) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const viewRef = useRef<EditorView | null>(null);\n  const [isExpanded, setIsExpanded] = useState(false);\n  const text = useMemo(() => serializeJson(value), [value]);\n  const foldRanges = useMemo(() => computeFirstLevelFoldRanges(text), [text]);\n  const editorSizeStyle = toEditorSizeStyle({ height, minHeight, maxHeight });\n\n  useEffect(() => {\n    if (!containerRef.current) return;\n    const view = new EditorView({\n      parent: containerRef.current,\n      state: EditorState.create({\n        doc: text,\n        extensions: [EditorView.editable.of(false), EditorState.readOnly.of(true), jsonEditorTheme, ...jsonEditorExtensions],\n      }),\n    });\n    viewRef.current = view;\n    applyFoldRanges(view, foldRanges);\n    return () => {\n      view.destroy();\n      viewRef.current = null;\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    const view = viewRef.current;\n    if (!view) return;\n    const currentText = view.state.doc.toString();\n    if (currentText !== text) {\n      view.dispatch({ changes: { from: 0, to: currentText.length, insert: text } });\n      applyFoldRanges(view, foldRanges);\n      setIsExpanded(false);\n    }\n  }, [text, foldRanges]);\n\n  const toggleExpandAll = () => {\n    const view = viewRef.current;\n    if (!view) return;\n    if (isExpanded) {\n      applyFoldRanges(view, foldRanges);\n    } else {\n      unfoldAll(view);\n    }\n    setIsExpanded(!isExpanded);\n  };\n\n  return (\n    <div className={clsx(\"json-viewer\", className)}>\n      <Button\n        aria-label={expandAllLabel}\n        variant=\"subtle\"\n        size=\"small\"\n        className=\"json-viewer-expand-all\"\n        onPress={toggleExpandAll}\n      >\n        {isExpanded ? <IconChevronDown size=\"14\" /> : <IconChevronRight size=\"14\" />}\n      </Button>\n      {actions && actions.length > 0 && (\n        <div className=\"json-viewer-actions\">\n          {actions.map((action) => (\n            <Button\n              key={action.key}\n              aria-label={action.label}\n              variant=\"subtle\"\n              size=\"small\"\n              className=\"json-viewer-action\"\n              onPress={action.onPress}\n            >\n              {action.icon}\n            </Button>\n          ))}\n        </div>\n      )}\n      <div ref={containerRef} className=\"json-viewer-content\" style={editorSizeStyle} />\n    </div>\n  );\n}\n"],"names":["applyFoldRanges","view","ranges","range","foldEffect","JsonViewer","value","expandAllLabel","actions","className","height","minHeight","maxHeight","containerRef","useRef","viewRef","isExpanded","setIsExpanded","useState","text","useMemo","serializeJson","foldRanges","computeFirstLevelFoldRanges","editorSizeStyle","toEditorSizeStyle","useEffect","EditorView","EditorState","jsonEditorTheme","jsonEditorExtensions","currentText","toggleExpandAll","unfoldAll","clsx","jsx","Button","IconChevronDown","IconChevronRight","action"],"mappings":"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"}

package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("@codemirror/view"),f=require("@codemirror/lang-json"),c=require("@codemirror/language"),e=require("@lezer/highlight"),g=c.HighlightStyle.define([{tag:e.tags.propertyName,color:"var(--json-viewer-color-key)"},{tag:e.tags.string,color:"var(--json-viewer-color-string)",fontWeight:600},{tag:[e.tags.number,e.tags.bool,e.tags.null],color:"var(--json-viewer-color-scalar)"},{tag:[e.tags.separator,e.tags.squareBracket,e.tags.brace],color:"var(--json-viewer-color-punctuation)"}]),p=u.EditorView.theme({"&":{backgroundColor:"transparent",color:"var(--json-viewer-color-punctuation)",fontSize:"13px"},"&.cm-focused":{outline:"none"},".cm-content":{fontFamily:"var(--sds-typography-family-mono)",padding:"8px 124px 12px 4px"},".cm-gutters":{backgroundColor:"transparent",border:"none",color:"var(--json-viewer-color-caret)",paddingLeft:"5px"},".cm-scroller":{overflow:"auto"}}),d=[f.json(),c.foldGutter(),c.syntaxHighlighting(g)];function h(o){try{return JSON.stringify(o,null,2)??"null"}catch{return String(o)}}function m(o){return typeof o=="number"?`${o}px`:o}function v(o){const s=[],a=o.length;let t=0;for(;t<a&&o[t]!=="{"&&o[t]!=="[";)t++;if(t>=a)return s;let r=0,l=!1,i=-1;for(;t<a;t++){const n=o[t];if(l){n==="\\"?t++:n==='"'&&(l=!1);continue}if(n==='"'){l=!0;continue}if(n==="{"||n==="["){r++,r===2&&(i=t+1);continue}(n==="}"||n==="]")&&(r===2&&i!==-1&&(s.push({from:i,to:t}),i=-1),r--)}return s}exports.computeFirstLevelFoldRanges=v;exports.jsonEditorExtensions=d;exports.jsonEditorTheme=p;exports.jsonHighlightStyle=g;exports.serializeJson=h;exports.toCssSize=m;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("@codemirror/view"),d=require("@codemirror/lang-json"),g=require("@codemirror/language"),t=require("@lezer/highlight"),u=g.HighlightStyle.define([{tag:t.tags.propertyName,color:"var(--json-viewer-color-key)"},{tag:t.tags.string,color:"var(--json-viewer-color-string)",fontWeight:600},{tag:[t.tags.number,t.tags.bool,t.tags.null],color:"var(--json-viewer-color-scalar)"},{tag:[t.tags.separator,t.tags.squareBracket,t.tags.brace],color:"var(--json-viewer-color-punctuation)"}]),p=f.EditorView.theme({"&":{backgroundColor:"transparent",color:"var(--json-viewer-color-punctuation)",fontSize:"13px"},"&.cm-focused":{outline:"none"},".cm-content":{fontFamily:"var(--sds-typography-family-mono)",padding:"8px 124px 12px 4px"},".cm-gutters":{backgroundColor:"transparent",border:"none",color:"var(--json-viewer-color-caret)",paddingLeft:"5px"},".cm-scroller":{overflow:"auto"}}),h=[d.json(),g.foldGutter(),g.syntaxHighlighting(u)];function v(e){try{return JSON.stringify(e,null,2)??"null"}catch{return String(e)}}function a(e){return typeof e=="number"?`${e}px`:e}function j({height:e,minHeight:r,maxHeight:i}){const o={};return e!==void 0&&(o["--json-viewer-height"]=a(e)),r!==void 0&&(o["--json-viewer-min-height"]=a(r)),i!==void 0&&(o["--json-viewer-max-height"]=a(i)),o}function m(e){const r=[],i=e.length;let o=0;for(;o<i&&e[o]!=="{"&&e[o]!=="[";)o++;if(o>=i)return r;let s=0,c=!1,l=-1;for(;o<i;o++){const n=e[o];if(c){n==="\\"?o++:n==='"'&&(c=!1);continue}if(n==='"'){c=!0;continue}if(n==="{"||n==="["){s++,s===2&&(l=o+1);continue}(n==="}"||n==="]")&&(s===2&&l!==-1&&(r.push({from:l,to:o}),l=-1),s--)}return r}exports.computeFirstLevelFoldRanges=m;exports.jsonEditorExtensions=h;exports.jsonEditorTheme=p;exports.jsonHighlightStyle=u;exports.serializeJson=v;exports.toCssSize=a;exports.toEditorSizeStyle=j;
 //# sourceMappingURL=json-code-mirror.cjs.map

package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"json-code-mirror.cjs","sources":["../../../../../src/ui/primitives/JsonViewer/json-code-mirror.ts"],"sourcesContent":["import { EditorView } from \"@codemirror/view\";\nimport { json } from \"@codemirror/lang-json\";\nimport { foldGutter, HighlightStyle, syntaxHighlighting } from \"@codemirror/language\";\nimport { tags as t } from \"@lezer/highlight\";\n\nexport const jsonHighlightStyle = HighlightStyle.define([\n  { tag: t.propertyName, color: \"var(--json-viewer-color-key)\" },\n  { tag: t.string, color: \"var(--json-viewer-color-string)\", fontWeight: 600 },\n  { tag: [t.number, t.bool, t.null], color: \"var(--json-viewer-color-scalar)\" },\n  { tag: [t.separator, t.squareBracket, t.brace], color: \"var(--json-viewer-color-punctuation)\" },\n]);\n\nexport const jsonEditorTheme = EditorView.theme({\n  \"&\": { backgroundColor: \"transparent\", color: \"var(--json-viewer-color-punctuation)\", fontSize: \"13px\" },\n  \"&.cm-focused\": { outline: \"none\" },\n  \".cm-content\": { fontFamily: \"var(--sds-typography-family-mono)\", padding: \"8px 124px 12px 4px\" },\n  \".cm-gutters\": {\n    backgroundColor: \"transparent\",\n    border: \"none\",\n    color: \"var(--json-viewer-color-caret)\",\n    paddingLeft: \"5px\",\n  },\n  \".cm-scroller\": { overflow: \"auto\" },\n});\n\nexport const jsonEditorExtensions = [json(), foldGutter(), syntaxHighlighting(jsonHighlightStyle)];\n\nexport function serializeJson(value: unknown): string {\n  try {\n    return JSON.stringify(value, null, 2) ?? \"null\";\n  } catch {\n    return String(value);\n  }\n}\n\nexport function toCssSize(size: string | number): string {\n  return typeof size === \"number\" ? `${size}px` : size;\n}\n\n/**\n * Finds the fold range of every direct child (depth 1) of the root object/array\n * by scanning the text itself for matching brackets. This mirrors what\n * CodeMirror's `foldable()` would compute, but doesn't depend on the lezer\n * parser having finished tokenizing the document — which for a multi-MB\n * document is not guaranteed synchronously at mount time.\n */\nexport function computeFirstLevelFoldRanges(text: string): { from: number; to: number }[] {\n  const ranges: { from: number; to: number }[] = [];\n  const n = text.length;\n  let i = 0;\n  while (i < n && text[i] !== \"{\" && text[i] !== \"[\") i++;\n  if (i >= n) return ranges;\n\n  let depth = 0;\n  let inString = false;\n  let pendingStart = -1;\n  for (; i < n; i++) {\n    const ch = text[i];\n    if (inString) {\n      if (ch === \"\\\\\") i++;\n      else if (ch === '\"') inString = false;\n      continue;\n    }\n    if (ch === '\"') {\n      inString = true;\n      continue;\n    }\n    if (ch === \"{\" || ch === \"[\") {\n      depth++;\n      if (depth === 2) pendingStart = i + 1;\n      continue;\n    }\n    if (ch === \"}\" || ch === \"]\") {\n      if (depth === 2 && pendingStart !== -1) {\n        ranges.push({ from: pendingStart, to: i });\n        pendingStart = -1;\n      }\n      depth--;\n    }\n  }\n  return ranges;\n}\n"],"names":["jsonHighlightStyle","HighlightStyle","t","jsonEditorTheme","EditorView","jsonEditorExtensions","json","foldGutter","syntaxHighlighting","serializeJson","value","toCssSize","size","computeFirstLevelFoldRanges","text","ranges","n","i","depth","inString","pendingStart","ch"],"mappings":"uNAKaA,EAAqBC,EAAAA,eAAe,OAAO,CACtD,CAAE,IAAKC,EAAAA,KAAE,aAAc,MAAO,8BAAA,EAC9B,CAAE,IAAKA,EAAAA,KAAE,OAAQ,MAAO,kCAAmC,WAAY,GAAA,EACvE,CAAE,IAAK,CAACA,OAAE,OAAQA,EAAAA,KAAE,KAAMA,EAAAA,KAAE,IAAI,EAAG,MAAO,iCAAA,EAC1C,CAAE,IAAK,CAACA,EAAAA,KAAE,UAAWA,EAAAA,KAAE,cAAeA,OAAE,KAAK,EAAG,MAAO,sCAAA,CACzD,CAAC,EAEYC,EAAkBC,EAAAA,WAAW,MAAM,CAC9C,IAAK,CAAE,gBAAiB,cAAe,MAAO,uCAAwC,SAAU,MAAA,EAChG,eAAgB,CAAE,QAAS,MAAA,EAC3B,cAAe,CAAE,WAAY,oCAAqC,QAAS,oBAAA,EAC3E,cAAe,CACb,gBAAiB,cACjB,OAAQ,OACR,MAAO,iCACP,YAAa,KAAA,EAEf,eAAgB,CAAE,SAAU,MAAA,CAC9B,CAAC,EAEYC,EAAuB,CAACC,EAAAA,KAAA,EAAQC,EAAAA,aAAcC,EAAAA,mBAAmBR,CAAkB,CAAC,EAE1F,SAASS,EAAcC,EAAwB,CACpD,GAAI,CACF,OAAO,KAAK,UAAUA,EAAO,KAAM,CAAC,GAAK,MAC3C,MAAQ,CACN,OAAO,OAAOA,CAAK,CACrB,CACF,CAEO,SAASC,EAAUC,EAA+B,CACvD,OAAO,OAAOA,GAAS,SAAW,GAAGA,CAAI,KAAOA,CAClD,CASO,SAASC,EAA4BC,EAA8C,CACxF,MAAMC,EAAyC,CAAA,EACzCC,EAAIF,EAAK,OACf,IAAIG,EAAI,EACR,KAAOA,EAAID,GAAKF,EAAKG,CAAC,IAAM,KAAOH,EAAKG,CAAC,IAAM,KAAKA,IACpD,GAAIA,GAAKD,EAAG,OAAOD,EAEnB,IAAIG,EAAQ,EACRC,EAAW,GACXC,EAAe,GACnB,KAAOH,EAAID,EAAGC,IAAK,CACjB,MAAMI,EAAKP,EAAKG,CAAC,EACjB,GAAIE,EAAU,CACRE,IAAO,KAAMJ,IACRI,IAAO,MAAKF,EAAW,IAChC,QACF,CACA,GAAIE,IAAO,IAAK,CACdF,EAAW,GACX,QACF,CACA,GAAIE,IAAO,KAAOA,IAAO,IAAK,CAC5BH,IACIA,IAAU,IAAGE,EAAeH,EAAI,GACpC,QACF,EACII,IAAO,KAAOA,IAAO,OACnBH,IAAU,GAAKE,IAAiB,KAClCL,EAAO,KAAK,CAAE,KAAMK,EAAc,GAAIH,EAAG,EACzCG,EAAe,IAEjBF,IAEJ,CACA,OAAOH,CACT"}
+{"version":3,"file":"json-code-mirror.cjs","sources":["../../../../../src/ui/primitives/JsonViewer/json-code-mirror.ts"],"sourcesContent":["import type { CSSProperties } from \"react\";\nimport { EditorView } from \"@codemirror/view\";\nimport { json } from \"@codemirror/lang-json\";\nimport { foldGutter, HighlightStyle, syntaxHighlighting } from \"@codemirror/language\";\nimport { tags as t } from \"@lezer/highlight\";\n\nexport const jsonHighlightStyle = HighlightStyle.define([\n  { tag: t.propertyName, color: \"var(--json-viewer-color-key)\" },\n  { tag: t.string, color: \"var(--json-viewer-color-string)\", fontWeight: 600 },\n  { tag: [t.number, t.bool, t.null], color: \"var(--json-viewer-color-scalar)\" },\n  { tag: [t.separator, t.squareBracket, t.brace], color: \"var(--json-viewer-color-punctuation)\" },\n]);\n\nexport const jsonEditorTheme = EditorView.theme({\n  \"&\": { backgroundColor: \"transparent\", color: \"var(--json-viewer-color-punctuation)\", fontSize: \"13px\" },\n  \"&.cm-focused\": { outline: \"none\" },\n  \".cm-content\": { fontFamily: \"var(--sds-typography-family-mono)\", padding: \"8px 124px 12px 4px\" },\n  \".cm-gutters\": {\n    backgroundColor: \"transparent\",\n    border: \"none\",\n    color: \"var(--json-viewer-color-caret)\",\n    paddingLeft: \"5px\",\n  },\n  \".cm-scroller\": { overflow: \"auto\" },\n});\n\nexport const jsonEditorExtensions = [json(), foldGutter(), syntaxHighlighting(jsonHighlightStyle)];\n\nexport function serializeJson(value: unknown): string {\n  try {\n    return JSON.stringify(value, null, 2) ?? \"null\";\n  } catch {\n    return String(value);\n  }\n}\n\nexport function toCssSize(size: string | number): string {\n  return typeof size === \"number\" ? `${size}px` : size;\n}\n\nexport interface JsonEditorSize {\n  height?: string | number;\n  minHeight?: string | number;\n  maxHeight?: string | number;\n}\n\nexport function toEditorSizeStyle({ height, minHeight, maxHeight }: JsonEditorSize): CSSProperties {\n  const sizeVariables: Record<string, string> = {};\n  if (height !== undefined) sizeVariables[\"--json-viewer-height\"] = toCssSize(height);\n  if (minHeight !== undefined) sizeVariables[\"--json-viewer-min-height\"] = toCssSize(minHeight);\n  if (maxHeight !== undefined) sizeVariables[\"--json-viewer-max-height\"] = toCssSize(maxHeight);\n  return sizeVariables as CSSProperties;\n}\n\n/**\n * Finds the fold range of every direct child (depth 1) of the root object/array\n * by scanning the text itself for matching brackets. This mirrors what\n * CodeMirror's `foldable()` would compute, but doesn't depend on the lezer\n * parser having finished tokenizing the document — which for a multi-MB\n * document is not guaranteed synchronously at mount time.\n */\nexport function computeFirstLevelFoldRanges(text: string): { from: number; to: number }[] {\n  const ranges: { from: number; to: number }[] = [];\n  const n = text.length;\n  let i = 0;\n  while (i < n && text[i] !== \"{\" && text[i] !== \"[\") i++;\n  if (i >= n) return ranges;\n\n  let depth = 0;\n  let inString = false;\n  let pendingStart = -1;\n  for (; i < n; i++) {\n    const ch = text[i];\n    if (inString) {\n      if (ch === \"\\\\\") i++;\n      else if (ch === '\"') inString = false;\n      continue;\n    }\n    if (ch === '\"') {\n      inString = true;\n      continue;\n    }\n    if (ch === \"{\" || ch === \"[\") {\n      depth++;\n      if (depth === 2) pendingStart = i + 1;\n      continue;\n    }\n    if (ch === \"}\" || ch === \"]\") {\n      if (depth === 2 && pendingStart !== -1) {\n        ranges.push({ from: pendingStart, to: i });\n        pendingStart = -1;\n      }\n      depth--;\n    }\n  }\n  return ranges;\n}\n"],"names":["jsonHighlightStyle","HighlightStyle","t","jsonEditorTheme","EditorView","jsonEditorExtensions","json","foldGutter","syntaxHighlighting","serializeJson","value","toCssSize","size","toEditorSizeStyle","height","minHeight","maxHeight","sizeVariables","computeFirstLevelFoldRanges","text","ranges","n","i","depth","inString","pendingStart","ch"],"mappings":"uNAMaA,EAAqBC,EAAAA,eAAe,OAAO,CACtD,CAAE,IAAKC,EAAAA,KAAE,aAAc,MAAO,8BAAA,EAC9B,CAAE,IAAKA,EAAAA,KAAE,OAAQ,MAAO,kCAAmC,WAAY,GAAA,EACvE,CAAE,IAAK,CAACA,OAAE,OAAQA,EAAAA,KAAE,KAAMA,EAAAA,KAAE,IAAI,EAAG,MAAO,iCAAA,EAC1C,CAAE,IAAK,CAACA,EAAAA,KAAE,UAAWA,EAAAA,KAAE,cAAeA,OAAE,KAAK,EAAG,MAAO,sCAAA,CACzD,CAAC,EAEYC,EAAkBC,EAAAA,WAAW,MAAM,CAC9C,IAAK,CAAE,gBAAiB,cAAe,MAAO,uCAAwC,SAAU,MAAA,EAChG,eAAgB,CAAE,QAAS,MAAA,EAC3B,cAAe,CAAE,WAAY,oCAAqC,QAAS,oBAAA,EAC3E,cAAe,CACb,gBAAiB,cACjB,OAAQ,OACR,MAAO,iCACP,YAAa,KAAA,EAEf,eAAgB,CAAE,SAAU,MAAA,CAC9B,CAAC,EAEYC,EAAuB,CAACC,EAAAA,KAAA,EAAQC,EAAAA,aAAcC,EAAAA,mBAAmBR,CAAkB,CAAC,EAE1F,SAASS,EAAcC,EAAwB,CACpD,GAAI,CACF,OAAO,KAAK,UAAUA,EAAO,KAAM,CAAC,GAAK,MAC3C,MAAQ,CACN,OAAO,OAAOA,CAAK,CACrB,CACF,CAEO,SAASC,EAAUC,EAA+B,CACvD,OAAO,OAAOA,GAAS,SAAW,GAAGA,CAAI,KAAOA,CAClD,CAQO,SAASC,EAAkB,CAAE,OAAAC,EAAQ,UAAAC,EAAW,UAAAC,GAA4C,CACjG,MAAMC,EAAwC,CAAA,EAC9C,OAAIH,IAAW,SAAWG,EAAc,sBAAsB,EAAIN,EAAUG,CAAM,GAC9EC,IAAc,SAAWE,EAAc,0BAA0B,EAAIN,EAAUI,CAAS,GACxFC,IAAc,SAAWC,EAAc,0BAA0B,EAAIN,EAAUK,CAAS,GACrFC,CACT,CASO,SAASC,EAA4BC,EAA8C,CACxF,MAAMC,EAAyC,CAAA,EACzCC,EAAIF,EAAK,OACf,IAAIG,EAAI,EACR,KAAOA,EAAID,GAAKF,EAAKG,CAAC,IAAM,KAAOH,EAAKG,CAAC,IAAM,KAAKA,IACpD,GAAIA,GAAKD,EAAG,OAAOD,EAEnB,IAAIG,EAAQ,EACRC,EAAW,GACXC,EAAe,GACnB,KAAOH,EAAID,EAAGC,IAAK,CACjB,MAAMI,EAAKP,EAAKG,CAAC,EACjB,GAAIE,EAAU,CACRE,IAAO,KAAMJ,IACRI,IAAO,MAAKF,EAAW,IAChC,QACF,CACA,GAAIE,IAAO,IAAK,CACdF,EAAW,GACX,QACF,CACA,GAAIE,IAAO,KAAOA,IAAO,IAAK,CAC5BH,IACIA,IAAU,IAAGE,EAAeH,EAAI,GACpC,QACF,EACII,IAAO,KAAOA,IAAO,OACnBH,IAAU,GAAKE,IAAiB,KAClCL,EAAO,KAAK,CAAE,KAAMK,EAAc,GAAIH,EAAG,EACzCG,EAAe,IAEjBF,IAEJ,CACA,OAAOH,CACT"}

package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.js

@@ -1,13 +1,13 @@
-import { EditorView as s } from "@codemirror/view";
-import { json as f } from "@codemirror/lang-json";
-import { foldGutter as u, syntaxHighlighting as g, HighlightStyle as p } from "@codemirror/language";
+import { EditorView as f } from "@codemirror/view";
+import { json as u } from "@codemirror/lang-json";
+import { foldGutter as g, syntaxHighlighting as p, HighlightStyle as m } from "@codemirror/language";
 import { tags as n } from "@lezer/highlight";
-const m = p.define([
+const d = m.define([
   { tag: n.propertyName, color: "var(--json-viewer-color-key)" },
   { tag: n.string, color: "var(--json-viewer-color-string)", fontWeight: 600 },
   { tag: [n.number, n.bool, n.null], color: "var(--json-viewer-color-scalar)" },
   { tag: [n.separator, n.squareBracket, n.brace], color: "var(--json-viewer-color-punctuation)" }
-]), j = s.theme({
+]), w = f.theme({
   "&": { backgroundColor: "transparent", color: "var(--json-viewer-color-punctuation)", fontSize: "13px" },
   "&.cm-focused": { outline: "none" },
   ".cm-content": { fontFamily: "var(--sds-typography-family-mono)", padding: "8px 124px 12px 4px" },
@@ -18,47 +18,52 @@ const m = p.define([
     paddingLeft: "5px"
   },
   ".cm-scroller": { overflow: "auto" }
-}), w = [f(), u(), g(m)];
-function S(o) {
+}), S = [u(), g(), p(d)];
+function b(r) {
   try {
-    return JSON.stringify(o, null, 2) ?? "null";
+    return JSON.stringify(r, null, 2) ?? "null";
   } catch {
-    return String(o);
+    return String(r);
   }
 }
-function b(o) {
-  return typeof o == "number" ? `${o}px` : o;
+function a(r) {
+  return typeof r == "number" ? `${r}px` : r;
 }
-function x(o) {
-  const l = [], c = o.length;
-  let r = 0;
-  for (; r < c && o[r] !== "{" && o[r] !== "["; ) r++;
-  if (r >= c) return l;
-  let e = 0, a = !1, i = -1;
-  for (; r < c; r++) {
-    const t = o[r];
-    if (a) {
-      t === "\\" ? r++ : t === '"' && (a = !1);
+function x({ height: r, minHeight: e, maxHeight: i }) {
+  const o = {};
+  return r !== void 0 && (o["--json-viewer-height"] = a(r)), e !== void 0 && (o["--json-viewer-min-height"] = a(e)), i !== void 0 && (o["--json-viewer-max-height"] = a(i)), o;
+}
+function E(r) {
+  const e = [], i = r.length;
+  let o = 0;
+  for (; o < i && r[o] !== "{" && r[o] !== "["; ) o++;
+  if (o >= i) return e;
+  let s = 0, c = !1, l = -1;
+  for (; o < i; o++) {
+    const t = r[o];
+    if (c) {
+      t === "\\" ? o++ : t === '"' && (c = !1);
       continue;
     }
     if (t === '"') {
-      a = !0;
+      c = !0;
       continue;
     }
     if (t === "{" || t === "[") {
-      e++, e === 2 && (i = r + 1);
+      s++, s === 2 && (l = o + 1);
       continue;
     }
-    (t === "}" || t === "]") && (e === 2 && i !== -1 && (l.push({ from: i, to: r }), i = -1), e--);
+    (t === "}" || t === "]") && (s === 2 && l !== -1 && (e.push({ from: l, to: o }), l = -1), s--);
   }
-  return l;
+  return e;
 }
 export {
-  x as computeFirstLevelFoldRanges,
-  w as jsonEditorExtensions,
-  j as jsonEditorTheme,
-  m as jsonHighlightStyle,
-  S as serializeJson,
-  b as toCssSize
+  E as computeFirstLevelFoldRanges,
+  S as jsonEditorExtensions,
+  w as jsonEditorTheme,
+  d as jsonHighlightStyle,
+  b as serializeJson,
+  a as toCssSize,
+  x as toEditorSizeStyle
 };
 //# sourceMappingURL=json-code-mirror.js.map

package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.js.map

@@ -1 +1 @@
-{"version":3,"file":"json-code-mirror.js","sources":["../../../../../src/ui/primitives/JsonViewer/json-code-mirror.ts"],"sourcesContent":["import { EditorView } from \"@codemirror/view\";\nimport { json } from \"@codemirror/lang-json\";\nimport { foldGutter, HighlightStyle, syntaxHighlighting } from \"@codemirror/language\";\nimport { tags as t } from \"@lezer/highlight\";\n\nexport const jsonHighlightStyle = HighlightStyle.define([\n  { tag: t.propertyName, color: \"var(--json-viewer-color-key)\" },\n  { tag: t.string, color: \"var(--json-viewer-color-string)\", fontWeight: 600 },\n  { tag: [t.number, t.bool, t.null], color: \"var(--json-viewer-color-scalar)\" },\n  { tag: [t.separator, t.squareBracket, t.brace], color: \"var(--json-viewer-color-punctuation)\" },\n]);\n\nexport const jsonEditorTheme = EditorView.theme({\n  \"&\": { backgroundColor: \"transparent\", color: \"var(--json-viewer-color-punctuation)\", fontSize: \"13px\" },\n  \"&.cm-focused\": { outline: \"none\" },\n  \".cm-content\": { fontFamily: \"var(--sds-typography-family-mono)\", padding: \"8px 124px 12px 4px\" },\n  \".cm-gutters\": {\n    backgroundColor: \"transparent\",\n    border: \"none\",\n    color: \"var(--json-viewer-color-caret)\",\n    paddingLeft: \"5px\",\n  },\n  \".cm-scroller\": { overflow: \"auto\" },\n});\n\nexport const jsonEditorExtensions = [json(), foldGutter(), syntaxHighlighting(jsonHighlightStyle)];\n\nexport function serializeJson(value: unknown): string {\n  try {\n    return JSON.stringify(value, null, 2) ?? \"null\";\n  } catch {\n    return String(value);\n  }\n}\n\nexport function toCssSize(size: string | number): string {\n  return typeof size === \"number\" ? `${size}px` : size;\n}\n\n/**\n * Finds the fold range of every direct child (depth 1) of the root object/array\n * by scanning the text itself for matching brackets. This mirrors what\n * CodeMirror's `foldable()` would compute, but doesn't depend on the lezer\n * parser having finished tokenizing the document — which for a multi-MB\n * document is not guaranteed synchronously at mount time.\n */\nexport function computeFirstLevelFoldRanges(text: string): { from: number; to: number }[] {\n  const ranges: { from: number; to: number }[] = [];\n  const n = text.length;\n  let i = 0;\n  while (i < n && text[i] !== \"{\" && text[i] !== \"[\") i++;\n  if (i >= n) return ranges;\n\n  let depth = 0;\n  let inString = false;\n  let pendingStart = -1;\n  for (; i < n; i++) {\n    const ch = text[i];\n    if (inString) {\n      if (ch === \"\\\\\") i++;\n      else if (ch === '\"') inString = false;\n      continue;\n    }\n    if (ch === '\"') {\n      inString = true;\n      continue;\n    }\n    if (ch === \"{\" || ch === \"[\") {\n      depth++;\n      if (depth === 2) pendingStart = i + 1;\n      continue;\n    }\n    if (ch === \"}\" || ch === \"]\") {\n      if (depth === 2 && pendingStart !== -1) {\n        ranges.push({ from: pendingStart, to: i });\n        pendingStart = -1;\n      }\n      depth--;\n    }\n  }\n  return ranges;\n}\n"],"names":["jsonHighlightStyle","HighlightStyle","t","jsonEditorTheme","EditorView","jsonEditorExtensions","json","foldGutter","syntaxHighlighting","serializeJson","value","toCssSize","size","computeFirstLevelFoldRanges","text","ranges","n","i","depth","inString","pendingStart","ch"],"mappings":";;;;AAKO,MAAMA,IAAqBC,EAAe,OAAO;AAAA,EACtD,EAAE,KAAKC,EAAE,cAAc,OAAO,+BAAA;AAAA,EAC9B,EAAE,KAAKA,EAAE,QAAQ,OAAO,mCAAmC,YAAY,IAAA;AAAA,EACvE,EAAE,KAAK,CAACA,EAAE,QAAQA,EAAE,MAAMA,EAAE,IAAI,GAAG,OAAO,kCAAA;AAAA,EAC1C,EAAE,KAAK,CAACA,EAAE,WAAWA,EAAE,eAAeA,EAAE,KAAK,GAAG,OAAO,uCAAA;AACzD,CAAC,GAEYC,IAAkBC,EAAW,MAAM;AAAA,EAC9C,KAAK,EAAE,iBAAiB,eAAe,OAAO,wCAAwC,UAAU,OAAA;AAAA,EAChG,gBAAgB,EAAE,SAAS,OAAA;AAAA,EAC3B,eAAe,EAAE,YAAY,qCAAqC,SAAS,qBAAA;AAAA,EAC3E,eAAe;AAAA,IACb,iBAAiB;AAAA,IACjB,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,aAAa;AAAA,EAAA;AAAA,EAEf,gBAAgB,EAAE,UAAU,OAAA;AAC9B,CAAC,GAEYC,IAAuB,CAACC,EAAA,GAAQC,KAAcC,EAAmBR,CAAkB,CAAC;AAE1F,SAASS,EAAcC,GAAwB;AACpD,MAAI;AACF,WAAO,KAAK,UAAUA,GAAO,MAAM,CAAC,KAAK;AAAA,EAC3C,QAAQ;AACN,WAAO,OAAOA,CAAK;AAAA,EACrB;AACF;AAEO,SAASC,EAAUC,GAA+B;AACvD,SAAO,OAAOA,KAAS,WAAW,GAAGA,CAAI,OAAOA;AAClD;AASO,SAASC,EAA4BC,GAA8C;AACxF,QAAMC,IAAyC,CAAA,GACzCC,IAAIF,EAAK;AACf,MAAIG,IAAI;AACR,SAAOA,IAAID,KAAKF,EAAKG,CAAC,MAAM,OAAOH,EAAKG,CAAC,MAAM,MAAK,CAAAA;AACpD,MAAIA,KAAKD,EAAG,QAAOD;AAEnB,MAAIG,IAAQ,GACRC,IAAW,IACXC,IAAe;AACnB,SAAOH,IAAID,GAAGC,KAAK;AACjB,UAAMI,IAAKP,EAAKG,CAAC;AACjB,QAAIE,GAAU;AACZ,MAAIE,MAAO,OAAMJ,MACRI,MAAO,QAAKF,IAAW;AAChC;AAAA,IACF;AACA,QAAIE,MAAO,KAAK;AACd,MAAAF,IAAW;AACX;AAAA,IACF;AACA,QAAIE,MAAO,OAAOA,MAAO,KAAK;AAC5B,MAAAH,KACIA,MAAU,MAAGE,IAAeH,IAAI;AACpC;AAAA,IACF;AACA,KAAII,MAAO,OAAOA,MAAO,SACnBH,MAAU,KAAKE,MAAiB,OAClCL,EAAO,KAAK,EAAE,MAAMK,GAAc,IAAIH,GAAG,GACzCG,IAAe,KAEjBF;AAAA,EAEJ;AACA,SAAOH;AACT;"}
+{"version":3,"file":"json-code-mirror.js","sources":["../../../../../src/ui/primitives/JsonViewer/json-code-mirror.ts"],"sourcesContent":["import type { CSSProperties } from \"react\";\nimport { EditorView } from \"@codemirror/view\";\nimport { json } from \"@codemirror/lang-json\";\nimport { foldGutter, HighlightStyle, syntaxHighlighting } from \"@codemirror/language\";\nimport { tags as t } from \"@lezer/highlight\";\n\nexport const jsonHighlightStyle = HighlightStyle.define([\n  { tag: t.propertyName, color: \"var(--json-viewer-color-key)\" },\n  { tag: t.string, color: \"var(--json-viewer-color-string)\", fontWeight: 600 },\n  { tag: [t.number, t.bool, t.null], color: \"var(--json-viewer-color-scalar)\" },\n  { tag: [t.separator, t.squareBracket, t.brace], color: \"var(--json-viewer-color-punctuation)\" },\n]);\n\nexport const jsonEditorTheme = EditorView.theme({\n  \"&\": { backgroundColor: \"transparent\", color: \"var(--json-viewer-color-punctuation)\", fontSize: \"13px\" },\n  \"&.cm-focused\": { outline: \"none\" },\n  \".cm-content\": { fontFamily: \"var(--sds-typography-family-mono)\", padding: \"8px 124px 12px 4px\" },\n  \".cm-gutters\": {\n    backgroundColor: \"transparent\",\n    border: \"none\",\n    color: \"var(--json-viewer-color-caret)\",\n    paddingLeft: \"5px\",\n  },\n  \".cm-scroller\": { overflow: \"auto\" },\n});\n\nexport const jsonEditorExtensions = [json(), foldGutter(), syntaxHighlighting(jsonHighlightStyle)];\n\nexport function serializeJson(value: unknown): string {\n  try {\n    return JSON.stringify(value, null, 2) ?? \"null\";\n  } catch {\n    return String(value);\n  }\n}\n\nexport function toCssSize(size: string | number): string {\n  return typeof size === \"number\" ? `${size}px` : size;\n}\n\nexport interface JsonEditorSize {\n  height?: string | number;\n  minHeight?: string | number;\n  maxHeight?: string | number;\n}\n\nexport function toEditorSizeStyle({ height, minHeight, maxHeight }: JsonEditorSize): CSSProperties {\n  const sizeVariables: Record<string, string> = {};\n  if (height !== undefined) sizeVariables[\"--json-viewer-height\"] = toCssSize(height);\n  if (minHeight !== undefined) sizeVariables[\"--json-viewer-min-height\"] = toCssSize(minHeight);\n  if (maxHeight !== undefined) sizeVariables[\"--json-viewer-max-height\"] = toCssSize(maxHeight);\n  return sizeVariables as CSSProperties;\n}\n\n/**\n * Finds the fold range of every direct child (depth 1) of the root object/array\n * by scanning the text itself for matching brackets. This mirrors what\n * CodeMirror's `foldable()` would compute, but doesn't depend on the lezer\n * parser having finished tokenizing the document — which for a multi-MB\n * document is not guaranteed synchronously at mount time.\n */\nexport function computeFirstLevelFoldRanges(text: string): { from: number; to: number }[] {\n  const ranges: { from: number; to: number }[] = [];\n  const n = text.length;\n  let i = 0;\n  while (i < n && text[i] !== \"{\" && text[i] !== \"[\") i++;\n  if (i >= n) return ranges;\n\n  let depth = 0;\n  let inString = false;\n  let pendingStart = -1;\n  for (; i < n; i++) {\n    const ch = text[i];\n    if (inString) {\n      if (ch === \"\\\\\") i++;\n      else if (ch === '\"') inString = false;\n      continue;\n    }\n    if (ch === '\"') {\n      inString = true;\n      continue;\n    }\n    if (ch === \"{\" || ch === \"[\") {\n      depth++;\n      if (depth === 2) pendingStart = i + 1;\n      continue;\n    }\n    if (ch === \"}\" || ch === \"]\") {\n      if (depth === 2 && pendingStart !== -1) {\n        ranges.push({ from: pendingStart, to: i });\n        pendingStart = -1;\n      }\n      depth--;\n    }\n  }\n  return ranges;\n}\n"],"names":["jsonHighlightStyle","HighlightStyle","t","jsonEditorTheme","EditorView","jsonEditorExtensions","json","foldGutter","syntaxHighlighting","serializeJson","value","toCssSize","size","toEditorSizeStyle","height","minHeight","maxHeight","sizeVariables","computeFirstLevelFoldRanges","text","ranges","n","i","depth","inString","pendingStart","ch"],"mappings":";;;;AAMO,MAAMA,IAAqBC,EAAe,OAAO;AAAA,EACtD,EAAE,KAAKC,EAAE,cAAc,OAAO,+BAAA;AAAA,EAC9B,EAAE,KAAKA,EAAE,QAAQ,OAAO,mCAAmC,YAAY,IAAA;AAAA,EACvE,EAAE,KAAK,CAACA,EAAE,QAAQA,EAAE,MAAMA,EAAE,IAAI,GAAG,OAAO,kCAAA;AAAA,EAC1C,EAAE,KAAK,CAACA,EAAE,WAAWA,EAAE,eAAeA,EAAE,KAAK,GAAG,OAAO,uCAAA;AACzD,CAAC,GAEYC,IAAkBC,EAAW,MAAM;AAAA,EAC9C,KAAK,EAAE,iBAAiB,eAAe,OAAO,wCAAwC,UAAU,OAAA;AAAA,EAChG,gBAAgB,EAAE,SAAS,OAAA;AAAA,EAC3B,eAAe,EAAE,YAAY,qCAAqC,SAAS,qBAAA;AAAA,EAC3E,eAAe;AAAA,IACb,iBAAiB;AAAA,IACjB,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,aAAa;AAAA,EAAA;AAAA,EAEf,gBAAgB,EAAE,UAAU,OAAA;AAC9B,CAAC,GAEYC,IAAuB,CAACC,EAAA,GAAQC,KAAcC,EAAmBR,CAAkB,CAAC;AAE1F,SAASS,EAAcC,GAAwB;AACpD,MAAI;AACF,WAAO,KAAK,UAAUA,GAAO,MAAM,CAAC,KAAK;AAAA,EAC3C,QAAQ;AACN,WAAO,OAAOA,CAAK;AAAA,EACrB;AACF;AAEO,SAASC,EAAUC,GAA+B;AACvD,SAAO,OAAOA,KAAS,WAAW,GAAGA,CAAI,OAAOA;AAClD;AAQO,SAASC,EAAkB,EAAE,QAAAC,GAAQ,WAAAC,GAAW,WAAAC,KAA4C;AACjG,QAAMC,IAAwC,CAAA;AAC9C,SAAIH,MAAW,WAAWG,EAAc,sBAAsB,IAAIN,EAAUG,CAAM,IAC9EC,MAAc,WAAWE,EAAc,0BAA0B,IAAIN,EAAUI,CAAS,IACxFC,MAAc,WAAWC,EAAc,0BAA0B,IAAIN,EAAUK,CAAS,IACrFC;AACT;AASO,SAASC,EAA4BC,GAA8C;AACxF,QAAMC,IAAyC,CAAA,GACzCC,IAAIF,EAAK;AACf,MAAIG,IAAI;AACR,SAAOA,IAAID,KAAKF,EAAKG,CAAC,MAAM,OAAOH,EAAKG,CAAC,MAAM,MAAK,CAAAA;AACpD,MAAIA,KAAKD,EAAG,QAAOD;AAEnB,MAAIG,IAAQ,GACRC,IAAW,IACXC,IAAe;AACnB,SAAOH,IAAID,GAAGC,KAAK;AACjB,UAAMI,IAAKP,EAAKG,CAAC;AACjB,QAAIE,GAAU;AACZ,MAAIE,MAAO,OAAMJ,MACRI,MAAO,QAAKF,IAAW;AAChC;AAAA,IACF;AACA,QAAIE,MAAO,KAAK;AACd,MAAAF,IAAW;AACX;AAAA,IACF;AACA,QAAIE,MAAO,OAAOA,MAAO,KAAK;AAC5B,MAAAH,KACIA,MAAU,MAAGE,IAAeH,IAAI;AACpC;AAAA,IACF;AACA,KAAII,MAAO,OAAOA,MAAO,SACnBH,MAAU,KAAKE,MAAiB,OAClCL,EAAO,KAAK,EAAE,MAAMK,GAAc,IAAIH,GAAG,GACzCG,IAAe,KAEjBF;AAAA,EAEJ;AACA,SAAOH;AACT;"}

package/dist/lib/ui/primitives/Table/DataDrivenTable.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),u=require("react"),l=require("./TableBase.cjs"),ee=require("../../layout/Flex/Flex.cjs"),ae=require("../Search/Search.cjs"),se=require("../../icons/IconChevronDown.cjs"),te=require("../../icons/IconChevronRight.cjs"),ne=require("../Pagination/Pagination.cjs"),le=require("../PermissionGate/PermissionGate.cjs");function re({action:o,item:c}){const d=o.isAllowed!==!1,i=a.jsx("button",{type:"button",className:"data-table-row-action-btn","aria-label":o.label,disabled:!d,onClick:d?()=>o.onPress(c):void 0,children:o.icon});return d?i:a.jsx(le.PermissionGate,{isAllowed:!1,noAccessLabel:o.noAccessLabel??"",children:i})}function D({columns:o,data:c,actions:d,rowActions:i,rowActionsLabel:E="",selectable:S=!1,selectionType:T="checkbox",selectedKeys:B,onSelectionChange:I,searchPlaceholder:F="Search...",searchKeys:p=[],isLoading:G=!1,loadingMessage:v="Loading...",emptyMessage:H="No records found",previousLabel:$="Previous",nextLabel:O="Next",pageSize:h=10,nestedColumns:M,getNestedData:P,nestedLoadingMessage:Q="Loading...",nestedEmptyMessage:z="No records found",nestedSearchKeys:J,nestedSearchPlaceholder:U,nestedActions:j,nestedPageSize:V}){const[w,W]=u.useState(""),[X,y]=u.useState(1),[R,Y]=u.useState(new Set),[q,b]=u.useState(new Map),f=!!P&&!!M,m=!!i;function k(e,s){Y(n=>{const r=new Set(n);return s?r.add(e):r.delete(e),r})}function Z(e){const s=e.id,n=!R.has(s);if(k(s,n),!n||q.has(s))return;const r=P(e);r instanceof Promise?(b(t=>new Map(t).set(s,{status:"loading",data:[]})),r.then(t=>{b(g=>new Map(g).set(s,{status:"loaded",data:t}))},()=>{b(t=>{const g=new Map(t);return g.delete(s),g}),k(s,!1)})):b(t=>new Map(t).set(s,{status:"loaded",data:r}))}const x=p.length>0,_=x||!!d,C=u.useMemo(()=>{if(!w.trim()||!x)return c;const e=w.toLowerCase();return c.filter(s=>p.some(n=>String(s[n]??"").toLowerCase().includes(e)))},[c,w,p,x]),L=Math.max(1,Math.ceil(C.length/h)),N=Math.min(X,L),A=C.slice((N-1)*h,N*h);function K(e,s){return s.render?s.render(e):String(e[s.key]??"")}return a.jsxs(ee.Flex,{direction:"column",gap:"300",className:"data-table",children:[_&&a.jsxs("div",{className:"data-table-toolbar",children:[x&&a.jsx(ae.Search,{placeholder:F,onSearch:e=>{W(e),y(1)},className:"data-table-search"}),d&&a.jsx("div",{className:"data-table-actions",children:d})]}),G?a.jsx("div",{role:"status","aria-live":"polite","aria-label":v,className:"data-table-status",children:v}):C.length===0?a.jsx("div",{role:"status",className:"data-table-status data-table-empty",children:H}):a.jsxs(l.TableBase,{selectionMode:S?T==="radio"?"single":"multiple":"none",selectionType:T,selectedKeys:B,onSelectionChange:I,children:[a.jsxs(l.TableHead,{children:[f&&a.jsx(l.TableColumn,{className:"data-table-expand-col"}),o.map((e,s)=>a.jsx(l.TableColumn,{align:e.align,isRowHeader:s===0,children:e.label},String(e.key))),m&&a.jsx(l.TableColumn,{align:"right",className:"data-table-row-actions-col",children:E})]}),a.jsx(l.TableBody,{children:A.flatMap(e=>{const s=R.has(e.id),n=q.get(e.id),r=[a.jsxs(l.TableRow,{id:e.id,children:[f&&a.jsx(l.TableCell,{className:"data-table-expand-cell",children:a.jsx("button",{type:"button",className:"data-table-expand-btn","aria-label":s?"Collapse row":"Expand row","aria-expanded":s,onClick:()=>Z(e),children:s?a.jsx(se.IconChevronDown,{size:"16"}):a.jsx(te.IconChevronRight,{size:"16"})})}),o.map(t=>a.jsx(l.TableCell,{align:t.align,children:K(e,t)},String(t.key))),m&&a.jsx(l.TableCell,{align:"right",className:"data-table-row-actions-cell",children:a.jsx("div",{className:"data-table-row-actions",children:(typeof i=="function"?i(e):i).map(t=>a.jsx(re,{action:t,item:e},t.key))})})]},e.id)];return s&&r.push(a.jsx(l.TableRow,{id:`${e.id}-nested`,className:"data-table-nested-row",children:a.jsx(l.TableCell,{colSpan:o.length+(f?1:0)+(S?1:0)+(m?1:0),className:"data-table-nested-cell",children:a.jsx(D,{columns:M,data:(n==null?void 0:n.data)??[],isLoading:!n||n.status==="loading",loadingMessage:Q,emptyMessage:z,searchKeys:J,searchPlaceholder:U,actions:j==null?void 0:j(e),pageSize:V??h})})},`${e.id}-nested`)),r})})]}),a.jsx(ne.Pagination,{page:N,totalPages:L,onPageChange:y,previousLabel:$,nextLabel:O})]})}exports.DataDrivenTable=D;
+//# sourceMappingURL=DataDrivenTable.cjs.map