@apipass/design-system 7.2.0 → 7.4.0

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

@@ -1,13 +1,13 @@
 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";
+import { foldGutter as p, syntaxHighlighting as g, HighlightStyle as m } from "@codemirror/language";
+import { tags as t } from "@lezer/highlight";
 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)" }
-]), w = f.theme({
+  { tag: t.propertyName, color: "var(--json-viewer-color-key)" },
+  { tag: t.string, color: "var(--json-viewer-color-string)", fontWeight: 600 },
+  { tag: [t.number, t.bool, t.null], color: "var(--json-viewer-color-scalar)" },
+  { tag: [t.separator, t.squareBracket, t.brace], color: "var(--json-viewer-color-punctuation)" }
+]), S = 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,8 +18,8 @@ const d = m.define([
     paddingLeft: "5px"
   },
   ".cm-scroller": { overflow: "auto" }
-}), S = [u(), g(), p(d)];
-function b(r) {
+}), b = [u(), p(), g(d)];
+function x(r) {
   try {
     return JSON.stringify(r, null, 2) ?? "null";
   } catch {
@@ -29,41 +29,41 @@ function b(r) {
 function a(r) {
   return typeof r == "number" ? `${r}px` : r;
 }
-function x({ height: r, minHeight: e, maxHeight: i }) {
+function E({ 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) {
+function k(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;
+  let l = 0, c = !1, s = -1;
   for (; o < i; o++) {
-    const t = r[o];
+    const n = r[o];
     if (c) {
-      t === "\\" ? o++ : t === '"' && (c = !1);
+      n === "\\" ? o++ : n === '"' && (c = !1);
       continue;
     }
-    if (t === '"') {
+    if (n === '"') {
       c = !0;
       continue;
     }
-    if (t === "{" || t === "[") {
-      s++, s === 2 && (l = o + 1);
+    if (n === "{" || n === "[") {
+      l++, l === 2 && (s = o + 1);
       continue;
     }
-    (t === "}" || t === "]") && (s === 2 && l !== -1 && (e.push({ from: l, to: o }), l = -1), s--);
+    (n === "}" || n === "]") && (l === 2 && s !== -1 && (o === s || e.push({ from: s, to: o }), s = -1), l--);
   }
   return e;
 }
 export {
-  E as computeFirstLevelFoldRanges,
-  S as jsonEditorExtensions,
-  w as jsonEditorTheme,
+  k as computeFirstLevelFoldRanges,
+  b as jsonEditorExtensions,
+  S as jsonEditorTheme,
   d as jsonHighlightStyle,
-  b as serializeJson,
+  x as serializeJson,
   a as toCssSize,
-  x as toEditorSizeStyle
+  E 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 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;"}
+{"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        const isEmptyBlock = i === pendingStart;\n        if (!isEmptyBlock) 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,OACbH,MAAMG,KACRL,EAAO,KAAK,EAAE,MAAMK,GAAc,IAAIH,GAAG,GAC5DG,IAAe,KAEjBF;AAAA,EAEJ;AACA,SAAOH;AACT;"}

package/dist/types/ui/components/charts/TopList/top-list-option.d.ts

@@ -16,6 +16,7 @@ export interface TopListOptionInput {
     colorsByItemId: Record<string, string>;
     animate: boolean;
     labeledRowStep: number;
+    canvasWidthPx: number;
     valueFormatter?: (value: number) => string;
 }
 export declare function rankById(items: TopListItem[], sort: TopListSort): Map<string, number>;

package/dist/types/ui/components/charts/chart-theme.d.ts

@@ -4,6 +4,8 @@ export interface ChartTheme {
     axisLineColor: string;
     splitLineColor: string;
     labelColor: string;
+    emphasizedLabelColor: string;
+    trackColor: string;
     tooltipBackgroundColor: string;
     tooltipBorderColor: string;
     fontFamily: string;

package/dist/types/ui/primitives/Button/Button.d.ts

@@ -8,18 +8,18 @@ export declare const Button: React.ForwardRefExoticComponent<Omit<ButtonBaseProp
     variant?: Exclude<ButtonBaseProps["variant"], "danger-primary" | "danger-subtle">;
 } & React.RefAttributes<HTMLElement>>;
 export type ButtonDangerProps = Omit<ButtonBaseProps, "variant"> & {
-    variant?: Exclude<ButtonBaseProps["variant"], "primary" | "subtle" | "neutral">;
+    variant?: Exclude<ButtonBaseProps["variant"], "primary" | "subtle" | "neutral" | "text">;
 };
 /**
  * Only used for destructive actions
  */
 export declare const ButtonDanger: React.ForwardRefExoticComponent<Omit<ButtonBaseProps, "variant"> & {
-    variant?: Exclude<ButtonBaseProps["variant"], "primary" | "subtle" | "neutral">;
+    variant?: Exclude<ButtonBaseProps["variant"], "primary" | "subtle" | "neutral" | "text">;
 } & React.RefAttributes<HTMLElement>>;
 type ButtonBaseProps = {
     type?: ComponentPropsWithoutRef<"button">["type"];
     size?: "small" | "medium";
-    variant?: "primary" | "neutral" | "subtle" | "danger-primary" | "danger-subtle";
+    variant?: "primary" | "neutral" | "subtle" | "text" | "danger-primary" | "danger-subtle";
 } & AnchorOrButtonProps;
 export type ButtonGroupProps = React.ComponentPropsWithoutRef<"div"> & {
     align?: "start" | "end" | "center" | "justify" | "stack";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apipass/design-system",
-  "version": "7.2.0",
+  "version": "7.4.0",
   "type": "module",
   "description": "APIPass React Design System",
   "sideEffects": [