@m4l/components 9.24.0-beta-feature-731-m4l-components-code-editor.3 → 9.24.0-beta-feature-731-m4l-components-code-editor.4

package/components/extended/ReactSimpleCodeEditor/CodeEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/extended/ReactSimpleCodeEditor/CodeEditor.tsx"],"names":[],"mappings":"AAyCA,OAAO,KAAK,EAEV,eAAe,EAEhB,MAAM,SAAS,CAAC;AAgBjB;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,oDAsXhD"}
+{"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/extended/ReactSimpleCodeEditor/CodeEditor.tsx"],"names":[],"mappings":"AAyCA,OAAO,KAAK,EAEV,eAAe,EAEhB,MAAM,SAAS,CAAC;AAgBjB;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,oDAuXhD"}

package/components/extended/ReactSimpleCodeEditor/CodeEditor.js

@@ -1,91 +1,91 @@
 import { jsx as a, jsxs as D } from "@emotion/react/jsx-runtime";
-import { useModuleDictionary as Ae, useModuleSkeleton as Me } from "@m4l/core";
+import { useModuleDictionary as Me, useModuleSkeleton as Ve } from "@m4l/core";
 import _ from "clsx";
-import { useId as Ve, useState as J, useRef as Pe, useMemo as E, useEffect as Q, useCallback as k } from "react";
-import { useTheme as ke } from "@mui/material/styles";
-import { getPropDataTestId as x, getNameDataTestId as ze } from "../../../test/getNameDataTestId.js";
-import { CODE_EDITOR_DEFAULT_MAX_LINES as Be, CODE_EDITOR_DEFAULT_MIN_LINES as He, CODE_EDITOR_DEFAULT_LANGUAGE as we, CODE_EDITOR_LINE_HEIGHT_BY_SIZE as Ge, CODE_EDITOR_CLASSES as C, CODE_EDITOR_KEY_COMPONENT as p, CODE_EDITOR_READ_ONLY_LABEL as Ue, CODE_EDITOR_LANGUAGE_CHIP_ICON_INSTANCE_ID as Ye } from "./constants.js";
-import { CODE_EDITOR_DICTIONARY as W } from "./dictionary.js";
-import { resolveCodeEditorLanguageIcon as Fe } from "./helpers/languageIcon.js";
-import { ensureCodeEditorRuntimeDependencies as je, getCodeEditorLineCount as qe, createCodeEditorPrismTheme as Ke, resolveCodeEditorLanguageTemplate as Xe, validateCodeEditorSyntax as Ze, highlightCode as $e } from "./helpers/highlighting.js";
-import { SkeletonStyled as Je, RootStyled as Qe, HeaderStyled as We, LanguageChipStyled as et, LanguageChipIconStyled as tt, HeaderBadgesStyled as at, ReadOnlyChipStyled as nt, BodyStyled as rt, LineNumbersStyled as ot, LineNumberStyled as lt, EditorScrollerStyled as it, PlaceholderStyled as st, EditorStyled as dt } from "./slots/CodeEditorSlots.js";
+import { useId as Pe, useState as Q, useRef as ke, useMemo as E, useEffect as W, useCallback as z } from "react";
+import { useTheme as ze } from "@mui/material/styles";
+import { getPropDataTestId as x, getNameDataTestId as Be } from "../../../test/getNameDataTestId.js";
+import { CODE_EDITOR_DEFAULT_MAX_LINES as He, CODE_EDITOR_DEFAULT_MIN_LINES as we, CODE_EDITOR_DEFAULT_LANGUAGE as Ge, CODE_EDITOR_LINE_HEIGHT_BY_SIZE as Ue, CODE_EDITOR_CLASSES as C, CODE_EDITOR_KEY_COMPONENT as p, CODE_EDITOR_READ_ONLY_LABEL as Ye, CODE_EDITOR_LANGUAGE_CHIP_ICON_INSTANCE_ID as Fe } from "./constants.js";
+import { CODE_EDITOR_DICTIONARY as ee } from "./dictionary.js";
+import { resolveCodeEditorLanguageIcon as je } from "./helpers/languageIcon.js";
+import { ensureCodeEditorRuntimeDependencies as qe, getCodeEditorLineCount as Ke, createCodeEditorPrismTheme as Xe, resolveCodeEditorLanguageTemplate as Ze, validateCodeEditorSyntax as $e, highlightCode as Je } from "./helpers/highlighting.js";
+import { SkeletonStyled as Qe, RootStyled as We, HeaderStyled as et, LanguageChipStyled as tt, LanguageChipIconStyled as at, HeaderBadgesStyled as nt, ReadOnlyChipStyled as rt, BodyStyled as ot, LineNumbersStyled as lt, LineNumberStyled as it, EditorScrollerStyled as st, PlaceholderStyled as dt, EditorStyled as ct } from "./slots/CodeEditorSlots.js";
 import { CodeEditorSlots as f } from "./slots/CodeEditorEnum.js";
-function ct(L, y) {
+function ut(L, y) {
   return L.length !== y.length ? !1 : L.every((S, o) => S === y[o]);
 }
-function Dt(L) {
+function _t(L) {
   const {
     className: y,
     customLanguages: S,
     dataTestId: o,
-    defaultValue: ee,
-    disabled: I = !1,
-    editorClassName: te,
-    error: ae = !1,
-    highlightTheme: z,
-    id: ne,
-    insertSpaces: re,
-    languageIcon: oe,
-    languageLabel: le,
+    defaultValue: te,
+    disabled: T = !1,
+    editorClassName: ae,
+    error: ne = !1,
+    highlightTheme: B,
+    id: re,
+    insertSpaces: oe,
+    languageIcon: le,
+    languageLabel: ie,
     languageTemplate: n,
-    languageText: ie,
-    maxLines: se = Be,
-    minLines: O = He,
-    onBlur: de,
+    languageText: se,
+    maxLines: de = He,
+    minLines: O = we,
+    onBlur: ce,
     onChange: v,
     placeholder: R,
-    preClassName: ce,
+    preClassName: ue,
     readOnly: d = !1,
-    readOnlyLabel: ue,
+    readOnlyLabel: me,
     runtimeDependencies: c,
-    showLineNumbers: B = !1,
-    showPlaceholder: H = !0,
-    size: w = "medium",
+    showLineNumbers: H = !1,
+    showPlaceholder: w = !0,
+    size: G = "medium",
     syntaxValidator: N,
-    skeleton: me = !1,
-    textareaClassName: ge,
-    validateSyntax: G = !1,
+    skeleton: ge = !1,
+    textareaClassName: he,
+    validateSyntax: U = !1,
     value: u,
-    variant: he = "outlined",
-    ...T
-  } = L, Ee = Ve(), Ce = ne || Ee, U = ke(), { getLabel: pe } = Ae(), fe = Me() || me, m = v === void 0, [b, Le] = J(0), A = Pe([]), [ye, Y] = J(
-    u ?? ee ?? ""
-  ), F = E(() => c ? Array.isArray(c) ? c : [c] : [], [c]);
-  ct(
-    A.current,
-    F
-  ) || (A.current = F);
-  const M = A.current;
-  Q(() => {
-    m && u !== void 0 && Y(u);
-  }, [m, u]), Q(() => {
-    if (!M.length)
+    variant: Ee = "outlined",
+    ...I
+  } = L, Ce = Pe(), pe = re || Ce, b = ze(), Y = b.palette.mode, { getLabel: fe } = Me(), Le = Ve() || ge, m = v === void 0, [A, ye] = Q(0), M = ke([]), [Se, F] = Q(
+    u ?? te ?? ""
+  ), j = E(() => c ? Array.isArray(c) ? c : [c] : [], [c]);
+  ut(
+    M.current,
+    j
+  ) || (M.current = j);
+  const V = M.current;
+  W(() => {
+    m && u !== void 0 && F(u);
+  }, [m, u]), W(() => {
+    if (!V.length)
       return;
     let e = !0;
-    return je(M).catch(() => {
+    return qe(V).catch(() => {
     }).then(() => {
-      e && Le((s) => s + 1);
+      e && ye((s) => s + 1);
     }), () => {
       e = !1;
     };
-  }, [M]);
-  const r = m ? ye : u ?? "", Se = H && r.length === 0 && !!R, Ie = Ge[w], j = qe(r), q = Math.max(j, O), V = Math.max(O, se), Te = Math.min(q, V), De = j >= V, K = E(
-    () => z ?? Ke(U),
-    [z, U]
+  }, [V]);
+  const r = m ? Se : u ?? "", Te = w && r.length === 0 && !!R, Ie = Ue[G], q = Ke(r), K = Math.max(q, O), P = Math.max(O, de), De = Math.min(K, P), _e = q >= P, X = E(
+    () => B ?? Xe(b, Y),
+    [B, Y, b]
   ), l = E(
-    () => Xe(n),
-    [n, b]
-  ), g = ie ?? l?.languageText ?? we, X = le ?? l?.languageLabel, Z = !!X, _e = Fe(
-    oe ?? l?.languageIcon
-  ), P = d ? pe(W.readOnly) : void 0, xe = ue ?? (P && P !== W.readOnly ? P : Ue), h = E(() => {
+    () => Ze(n),
+    [n, A]
+  ), g = se ?? l?.languageText ?? Ge, Z = ie ?? l?.languageLabel, $ = !!Z, xe = je(
+    le ?? l?.languageIcon
+  ), k = d ? fe(ee.readOnly) : void 0, Oe = me ?? (k && k !== ee.readOnly ? k : Ye), h = E(() => {
     if (N)
       return N({
         code: r,
         languageTemplate: l ?? n,
         languageText: g
       });
-    if (G)
-      return Ze({
+    if (U)
+      return $e({
         code: r,
         languageTemplate: l ?? n,
         languageText: g
@@ -95,121 +95,121 @@ function Dt(L) {
     l,
     g,
     r,
-    b,
+    A,
     N,
-    G
-  ]), $ = ae || !!h && !h.isValid, i = h && !h.isValid ? h.errorRange : void 0, Oe = E(() => {
+    U
+  ]), J = ne || !!h && !h.isValid, i = h && !h.isValid ? h.errorRange : void 0, ve = E(() => {
     if (!i)
       return /* @__PURE__ */ new Set();
     const e = i.start.line, s = i.end?.line ?? e;
     return new Set(
       Array.from(
         { length: Math.max(s - e + 1, 1) },
-        (ut, be) => e + be
+        (mt, Ae) => e + Ae
       )
     );
   }, [i]), t = {
-    disabled: I,
-    error: $,
-    isLineCapped: De,
+    disabled: T,
+    error: J,
+    isLineCapped: _e,
     isEmpty: r.length === 0,
-    isPlaceholderVisible: Se,
+    isPlaceholderVisible: Te,
     lineHeight: Ie,
-    maxLines: V,
+    maxLines: P,
     minLines: O,
     readOnly: d,
-    showLineNumbers: B,
-    size: w,
-    variant: he,
-    visibleLineCount: Te
-  }, ve = k(
-    (e) => $e({
+    showLineNumbers: H,
+    size: G,
+    variant: Ee,
+    visibleLineCount: De
+  }, Re = z(
+    (e) => Je({
       code: e,
       customLanguages: S,
       languageTemplate: n,
       languageText: g,
-      prismTheme: K,
+      prismTheme: X,
       syntaxErrorRange: i
     }),
     [
       S,
       n,
-      K,
+      X,
       g,
-      b,
+      A,
       i
     ]
-  ), Re = k(
+  ), Ne = z(
     (e) => {
-      m && Y(e), v?.(e);
+      m && F(e), v?.(e);
     },
     [v, m]
-  ), Ne = k(
+  ), be = z(
     (e) => {
-      if (I || e.target instanceof Element && e.target.closest("textarea"))
+      if (T || e.target instanceof Element && e.target.closest("textarea"))
         return;
       e.currentTarget.querySelector("textarea")?.focus();
     },
-    [I]
+    [T]
   );
-  return fe ? /* @__PURE__ */ a(Je, { ownerState: t }) : /* @__PURE__ */ D(
-    Qe,
+  return Le ? /* @__PURE__ */ a(Qe, { ownerState: t }) : /* @__PURE__ */ D(
+    We,
     {
       ownerState: t,
       "aria-disabled": t.disabled || void 0,
       className: _(C.root, y),
       ...x(p, f.root, o),
       children: [
-        Z || d ? /* @__PURE__ */ D(We, { ownerState: t, className: C.header, children: [
-          Z ? /* @__PURE__ */ a(
-            et,
+        $ || d ? /* @__PURE__ */ D(et, { ownerState: t, className: C.header, children: [
+          $ ? /* @__PURE__ */ a(
+            tt,
             {
-              label: X,
+              label: Z,
               size: "small",
               variant: "outlined",
               color: "default",
               startIcon: /* @__PURE__ */ a(
-                tt,
+                at,
                 {
                   ...x(
                     p,
                     f.languageChipIcon,
-                    Ye
+                    Fe
                   ),
-                  children: /* @__PURE__ */ a(_e, { fontSize: "small" })
+                  children: /* @__PURE__ */ a(xe, { fontSize: "small" })
                 }
               )
             }
           ) : null,
-          /* @__PURE__ */ a(at, { ownerState: t, children: d ? /* @__PURE__ */ a(
-            nt,
+          /* @__PURE__ */ a(nt, { ownerState: t, children: d ? /* @__PURE__ */ a(
+            rt,
             {
-              label: xe,
+              label: Oe,
               size: "small"
             }
           ) : null })
         ] }) : null,
         /* @__PURE__ */ D(
-          rt,
+          ot,
           {
             ownerState: t,
-            onClick: Ne,
+            onClick: be,
             ...x(p, f.body, o),
             children: [
-              B ? /* @__PURE__ */ a(ot, { ownerState: t, "aria-hidden": "true", children: Array.from({ length: q }, (e, s) => s + 1).map(
+              H ? /* @__PURE__ */ a(lt, { ownerState: t, "aria-hidden": "true", children: Array.from({ length: K }, (e, s) => s + 1).map(
                 (e) => /* @__PURE__ */ a(
-                  lt,
+                  it,
                   {
                     ownerState: t,
-                    "data-code-editor-error-line": Oe.has(e) || void 0,
+                    "data-code-editor-error-line": ve.has(e) || void 0,
                     children: e
                   },
                   `code-editor-line-${e}`
                 )
               ) }) : null,
-              /* @__PURE__ */ D(it, { ownerState: t, children: [
-                H && t.isEmpty && R ? /* @__PURE__ */ a(
-                  st,
+              /* @__PURE__ */ D(st, { ownerState: t, children: [
+                w && t.isEmpty && R ? /* @__PURE__ */ a(
+                  dt,
                   {
                     ownerState: t,
                     ...x(
@@ -221,31 +221,31 @@ function Dt(L) {
                   }
                 ) : null,
                 /* @__PURE__ */ a(
-                  dt,
+                  ct,
                   {
-                    ...T,
+                    ...I,
                     ownerState: t,
-                    "aria-label": T["aria-label"] ?? "Code editor",
-                    "aria-invalid": T["aria-invalid"] ?? ($ || void 0),
-                    className: _(C.editor, te),
-                    "data-testid": ze(
+                    "aria-label": I["aria-label"] ?? "Code editor",
+                    "aria-invalid": I["aria-invalid"] ?? (J || void 0),
+                    className: _(C.editor, ae),
+                    "data-testid": Be(
                       p,
                       f.textarea,
                       o
                     ),
-                    disabled: I,
-                    highlight: ve,
-                    insertSpaces: re,
-                    onBlur: de,
-                    onValueChange: Re,
-                    preClassName: _(C.pre, ce),
+                    disabled: T,
+                    highlight: Re,
+                    insertSpaces: oe,
+                    onBlur: ce,
+                    onValueChange: Ne,
+                    preClassName: _(C.pre, ue),
                     readOnly: d,
-                    tabSize: T.tabSize,
+                    tabSize: I.tabSize,
                     textareaClassName: _(
                       C.textarea,
-                      ge
+                      he
                     ),
-                    textareaId: Ce,
+                    textareaId: pe,
                     value: r
                   }
                 )
@@ -258,5 +258,5 @@ function Dt(L) {
   );
 }
 export {
-  Dt as CodeEditor
+  _t as CodeEditor
 };

package/components/extended/ReactSimpleCodeEditor/CodeEditor.styles.js

@@ -1,5 +1,5 @@
 import { getTypographyStyles as d } from "../../../utils/getTypographyStyles.js";
-import { getCodeEditorVSCodeModernPalette as s, CODE_EDITOR_LINE_HEIGHT_BY_SIZE as n, CODE_EDITOR_MONO_FONT_FAMILY as t, CODE_EDITOR_PADDING_PX as i } from "./constants.js";
+import { getCodeEditorVSCodeModernPalette as s, CODE_EDITOR_LINE_HEIGHT_BY_SIZE as n, CODE_EDITOR_MONO_FONT_FAMILY as l, CODE_EDITOR_PADDING_PX as i } from "./constants.js";
 import { getSizeStyles as p } from "../../../utils/getSizeStyles/getSizeStyles.js";
 const b = {
   /** Resolve the interactive shell colors and focus treatment for the editor root. */
@@ -156,14 +156,14 @@ const b = {
   }),
   /** Build the two-column layout used by the gutter and editor scroller. */
   body: ({ theme: r, ownerState: e }) => {
-    const o = e?.visibleLineCount || e?.minLines || 1, a = e?.lineHeight || n.medium, l = e?.isLineCapped ? i : i * 2;
+    const o = e?.visibleLineCount || e?.minLines || 1, a = e?.lineHeight || n.medium, t = e?.isLineCapped ? i : i * 2;
     return {
       display: "grid",
       gridTemplateColumns: e?.showLineNumbers ? "auto minmax(0, 1fr)" : "minmax(0, 1fr)",
       width: "100%",
       alignItems: "start",
       columnGap: 0,
-      maxHeight: `${o * a + l}px`,
+      maxHeight: `${o * a + t}px`,
       minHeight: 0,
       overflow: "auto",
       pointerEvents: e?.disabled ? "none" : "auto",
@@ -183,7 +183,7 @@ const b = {
       color: e?.disabled ? o.surface.placeholderForeground : o.surface.lineNumberForeground,
       userSelect: "none",
       ...d(r.generalSettings.isMobile, e?.size || "medium", "bodyStandard"),
-      fontFamily: t,
+      fontFamily: l,
       lineHeight: `${n[e?.size || "medium"]}px`
     };
   },
@@ -203,7 +203,7 @@ const b = {
     };
   },
   /** Provide horizontal overflow for long code lines without wrapping them. */
-  editorScroller: ({ theme: r, ownerState: e }) => ({
+  editorScroller: ({ theme: r }) => ({
     position: "relative",
     width: "fit-content",
     minWidth: "100%",
@@ -215,21 +215,21 @@ const b = {
   }),
   /** Style the underlying react-simple-code-editor surface and its inner elements. */
   editor: ({ theme: r, ownerState: e }) => {
-    const o = s(r), a = e?.isLineCapped ? 0 : i, l = i + a;
+    const o = s(r), a = e?.isLineCapped ? 0 : i, t = i + a;
     return {
       position: "relative",
       zIndex: 0,
       width: "max-content",
       minWidth: "100%",
-      minHeight: `calc(${e?.minLines || 1} * ${e?.lineHeight || n.medium}px + ${l}px)`,
+      minHeight: `calc(${e?.minLines || 1} * ${e?.lineHeight || n.medium}px + ${t}px)`,
       backgroundColor: "transparent",
-      fontFamily: t,
+      fontFamily: l,
       fontSize: "11px",
       lineHeight: `${e?.lineHeight || n.medium}px`,
       fontWeight: 400,
       "& textarea, & pre": {
         ...d(r.generalSettings.isMobile, e?.size || "medium", "bodyStandard"),
-        fontFamily: t,
+        fontFamily: l,
         lineHeight: `${e?.lineHeight || n.medium}px`,
         whiteSpace: "pre !important",
         wordBreak: "normal",
@@ -280,7 +280,7 @@ const b = {
       pointerEvents: "none",
       color: o.surface.placeholderForeground,
       ...d(r.generalSettings.isMobile, e?.size || "medium", "bodyStandard"),
-      fontFamily: t,
+      fontFamily: l,
       lineHeight: `${e?.lineHeight || n.medium}px`,
       whiteSpace: "pre-wrap"
     };

package/components/extended/ReactSimpleCodeEditor/constants.d.ts

@@ -76,7 +76,7 @@ export declare const CODE_EDITOR_FALLBACK_LANGUAGE_ICON: import('@mui/material/O
     muiName: string;
 };
 /** Resolve the exact VS Code Modern palette for the current light or dark theme mode. */
-export declare function getCodeEditorVSCodeModernPalette(theme: Theme): CodeEditorVSCodeModernPalette;
+export declare function getCodeEditorVSCodeModernPalette(theme: Theme, modeOverride?: Theme['palette']['mode']): CodeEditorVSCodeModernPalette;
 export declare const CODE_EDITOR_CLASSES: Record<"root" | "skeleton" | "body" | "header" | "pre" | "textarea" | "placeholder" | "headerBadges" | "languageChip" | "languageChipIcon" | "readOnlyChip" | "lineNumbers" | "lineNumber" | "editorScroller" | "editor", string>;
 export {};
 //# sourceMappingURL=constants.d.ts.map

package/components/extended/ReactSimpleCodeEditor/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/extended/ReactSimpleCodeEditor/constants.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/extended/ReactSimpleCodeEditor/constants.ts"],"names":[],"mappings":"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"}

package/components/extended/ReactSimpleCodeEditor/constants.js

@@ -1,7 +1,7 @@
-import { FileFolderFileOutlined as n } from "@m4l/icons";
-import { getComponentClasses as a } from "../../../utils/getComponentSlotRoot.js";
-import { CodeEditorSlots as t } from "./slots/CodeEditorEnum.js";
-const C = {
+import { FileFolderFileOutlined as a } from "@m4l/icons";
+import { getComponentClasses as t } from "../../../utils/getComponentSlotRoot.js";
+import { CodeEditorSlots as C } from "./slots/CodeEditorEnum.js";
+const d = {
   dark: {
     bracketPalette: ["#FFD700", "#DA70D6", "#179FFF"],
     surface: {
@@ -100,15 +100,15 @@ const C = {
       variable: "#001080"
     }
   }
-}, d = "M4LCodeEditor", i = "text", g = 4, u = 10, D = 12, _ = {
+}, E = "M4LCodeEditor", g = "text", u = 4, D = 10, _ = 12, B = {
   small: 18,
   medium: 20
-}, B = '"Geist Mono", "JetBrains Mono", "Cascadia Code", "Liberation Mono", monospace', s = "Read Only", r = "at-commands", l = "at-basic", A = "AT Commands", O = "CodeEditorLanguageChipIcon", T = {
+}, s = '"Geist Mono", "JetBrains Mono", "Cascadia Code", "Liberation Mono", monospace', l = "Read Only", r = "at-commands", A = "at-basic", O = "AT Commands", T = "CodeEditorLanguageChipIcon", m = {
   commandPrefixes: ["AT+", "+"],
   concatenationSeparators: [";"],
   argumentSeparators: [","],
   reservedWords: ["SET", "INFO", "SAVE", "CLEAR"]
-}, m = {
+}, p = {
   js: "javascript",
   jsx: "jsx",
   ts: "typescript",
@@ -119,31 +119,31 @@ const C = {
   yml: "yaml",
   at: r,
   "telemetry-at": r
-}, p = n;
-function I(o) {
-  const e = o.palette.mode === "dark" ? "dark" : "light";
-  return C[e];
+}, I = a;
+function L(o, e) {
+  const n = (e ?? o.palette.mode) === "dark" ? "dark" : "light";
+  return d[n];
 }
-const L = a(
-  d,
-  t
+const h = t(
+  E,
+  C
 );
 export {
   r as CODE_EDITOR_AT_LANGUAGE,
-  A as CODE_EDITOR_AT_TEMPLATE_LANGUAGE_LABEL,
-  l as CODE_EDITOR_AT_TEMPLATE_NAME,
-  T as CODE_EDITOR_AT_TEMPLATE_TOKENS,
-  L as CODE_EDITOR_CLASSES,
-  i as CODE_EDITOR_DEFAULT_LANGUAGE,
-  u as CODE_EDITOR_DEFAULT_MAX_LINES,
-  g as CODE_EDITOR_DEFAULT_MIN_LINES,
-  p as CODE_EDITOR_FALLBACK_LANGUAGE_ICON,
-  d as CODE_EDITOR_KEY_COMPONENT,
-  m as CODE_EDITOR_LANGUAGE_ALIASES,
-  O as CODE_EDITOR_LANGUAGE_CHIP_ICON_INSTANCE_ID,
-  _ as CODE_EDITOR_LINE_HEIGHT_BY_SIZE,
-  B as CODE_EDITOR_MONO_FONT_FAMILY,
-  D as CODE_EDITOR_PADDING_PX,
-  s as CODE_EDITOR_READ_ONLY_LABEL,
-  I as getCodeEditorVSCodeModernPalette
+  O as CODE_EDITOR_AT_TEMPLATE_LANGUAGE_LABEL,
+  A as CODE_EDITOR_AT_TEMPLATE_NAME,
+  m as CODE_EDITOR_AT_TEMPLATE_TOKENS,
+  h as CODE_EDITOR_CLASSES,
+  g as CODE_EDITOR_DEFAULT_LANGUAGE,
+  D as CODE_EDITOR_DEFAULT_MAX_LINES,
+  u as CODE_EDITOR_DEFAULT_MIN_LINES,
+  I as CODE_EDITOR_FALLBACK_LANGUAGE_ICON,
+  E as CODE_EDITOR_KEY_COMPONENT,
+  p as CODE_EDITOR_LANGUAGE_ALIASES,
+  T as CODE_EDITOR_LANGUAGE_CHIP_ICON_INSTANCE_ID,
+  B as CODE_EDITOR_LINE_HEIGHT_BY_SIZE,
+  s as CODE_EDITOR_MONO_FONT_FAMILY,
+  _ as CODE_EDITOR_PADDING_PX,
+  l as CODE_EDITOR_READ_ONLY_LABEL,
+  L as getCodeEditorVSCodeModernPalette
 };

package/components/extended/ReactSimpleCodeEditor/helpers/highlighting.d.ts

@@ -51,7 +51,7 @@ export declare function getCodeEditorLineCount(value: string): number;
 /**
  * Build the Prism theme used by CodeEditor from the exact VS Code Modern palettes.
  */
-export declare function createCodeEditorPrismTheme(theme: Theme): PrismTheme;
+export declare function createCodeEditorPrismTheme(theme: Theme, modeOverride?: Theme['palette']['mode']): PrismTheme;
 /**
  * Render the highlighted code tree consumed by react-simple-code-editor.
  */

package/components/extended/ReactSimpleCodeEditor/helpers/highlighting.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"highlighting.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/extended/ReactSimpleCodeEditor/helpers/highlighting.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,KAAK,MAAM,SAAS,CAAC;AAC5B,OAAO,EAA4B,KAAK,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAUjF,OAAO,KAAK,EACV,yBAAyB,EAEzB,qCAAqC,EACrC,0BAA0B,EAC1B,+BAA+B,EAC/B,2BAA2B,EAC3B,oBAAoB,EAGpB,iCAAiC,EACjC,yBAAyB,EACzB,gCAAgC,EACjC,MAAM,UAAU,CAAC;AA2GlB,eAAO,MAAM,wCAAwC,EAAE,0BAWtD,CAAC;AA0RF,2EAA2E;AAC3E,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAEvD;AAED,0EAA0E;AAC1E,wBAAgB,sBAAsB,CAAC,MAAM,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,GAAG,SAAS,CAU5E;AAED,uFAAuF;AACvF,wBAAgB,qBAAqB,CACnC,QAAQ,EAAE,0BAA0B,GACnC,KAAK,CAAC,OAAO,CAmDf;AAED,gFAAgF;AAChF,wBAAgB,+BAA+B,CAC7C,QAAQ,EAAE,0BAA0B,GACnC,KAAK,CAAC,OAAO,CAOf;AAED;;GAEG;AACH,wBAAgB,0BAA0B,CACxC,YAAY,EAAE,MAAM,EACpB,OAAO,EAAE,KAAK,CAAC,OAAO,GACrB,IAAI,CAMN;AAED,uFAAuF;AACvF,wBAAgB,kCAAkC,CAChD,QAAQ,EAAE,0BAA0B,GACnC,IAAI,CAQN;AAED,kFAAkF;AAClF,wBAAgB,iCAAiC,CAC/C,QAAQ,CAAC,EAAE,+BAA+B,GACzC,0BAA0B,GAAG,SAAS,CAUxC;AAED,uFAAuF;AACvF,wBAAgB,gCAAgC,CAC9C,QAAQ,CAAC,EAAE,+BAA+B,GACzC,0BAA0B,GAAG,SAAS,CAExC;AAED;;GAEG;AACH,wBAAgB,iCAAiC,CAC/C,YAAY,EAAE,MAAM,EACpB,eAAe,EAAE,yBAAyB,GACzC,IAAI,CAMN;AAED;;GAEG;AACH,wBAAgB,oCAAoC,CAClD,OAAO,EAAE,qCAAqC,GAC7C,yBAAyB,CAG3B;AAeD;;GAEG;AACH,wBAAsB,mCAAmC,CACvD,mBAAmB,CAAC,EAAE,2BAA2B,GAAG,2BAA2B,EAAE,GAChF,OAAO,CAAC,IAAI,CAAC,CAsBf;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CACvC,eAAe,CAAC,EAAE,yBAAyB,GAC1C,IAAI,CAQN;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CACvC,YAAY,CAAC,EAAE,MAAM,GACpB,MAAM,CAKR;AAmqBD,qGAAqG;AACrG,wBAAgB,wBAAwB,CAAC,EACvC,IAAI,EACJ,gBAAgB,EAChB,YAAY,GACb,EAAE,iCAAiC,GAAG,gCAAgC,CAkBtE;AAED;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAE5D;AA+HD;;GAEG;AACH,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,KAAK,GAAG,UAAU,CAiInE;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC5B,IAAI,EACJ,eAAe,EACf,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,gBAAgB,GACjB,EAAE,oBAAoB,GAAG,YAAY,CA6QrC"}
+{"version":3,"file":"highlighting.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/extended/ReactSimpleCodeEditor/helpers/highlighting.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,KAAK,MAAM,SAAS,CAAC;AAC5B,OAAO,EAA4B,KAAK,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAUjF,OAAO,KAAK,EACV,yBAAyB,EAEzB,qCAAqC,EACrC,0BAA0B,EAC1B,+BAA+B,EAC/B,2BAA2B,EAC3B,oBAAoB,EAGpB,iCAAiC,EACjC,yBAAyB,EACzB,gCAAgC,EACjC,MAAM,UAAU,CAAC;AA2GlB,eAAO,MAAM,wCAAwC,EAAE,0BAWtD,CAAC;AAgSF,2EAA2E;AAC3E,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAEvD;AAED,0EAA0E;AAC1E,wBAAgB,sBAAsB,CAAC,MAAM,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,GAAG,SAAS,CAU5E;AAED,uFAAuF;AACvF,wBAAgB,qBAAqB,CACnC,QAAQ,EAAE,0BAA0B,GACnC,KAAK,CAAC,OAAO,CAmDf;AAED,gFAAgF;AAChF,wBAAgB,+BAA+B,CAC7C,QAAQ,EAAE,0BAA0B,GACnC,KAAK,CAAC,OAAO,CAOf;AAED;;GAEG;AACH,wBAAgB,0BAA0B,CACxC,YAAY,EAAE,MAAM,EACpB,OAAO,EAAE,KAAK,CAAC,OAAO,GACrB,IAAI,CAMN;AAED,uFAAuF;AACvF,wBAAgB,kCAAkC,CAChD,QAAQ,EAAE,0BAA0B,GACnC,IAAI,CAQN;AAED,kFAAkF;AAClF,wBAAgB,iCAAiC,CAC/C,QAAQ,CAAC,EAAE,+BAA+B,GACzC,0BAA0B,GAAG,SAAS,CAUxC;AAED,uFAAuF;AACvF,wBAAgB,gCAAgC,CAC9C,QAAQ,CAAC,EAAE,+BAA+B,GACzC,0BAA0B,GAAG,SAAS,CAExC;AAED;;GAEG;AACH,wBAAgB,iCAAiC,CAC/C,YAAY,EAAE,MAAM,EACpB,eAAe,EAAE,yBAAyB,GACzC,IAAI,CAMN;AAED;;GAEG;AACH,wBAAgB,oCAAoC,CAClD,OAAO,EAAE,qCAAqC,GAC7C,yBAAyB,CAG3B;AAeD;;GAEG;AACH,wBAAsB,mCAAmC,CACvD,mBAAmB,CAAC,EAAE,2BAA2B,GAAG,2BAA2B,EAAE,GAChF,OAAO,CAAC,IAAI,CAAC,CAsBf;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CACvC,eAAe,CAAC,EAAE,yBAAyB,GAC1C,IAAI,CAQN;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CACvC,YAAY,CAAC,EAAE,MAAM,GACpB,MAAM,CAKR;AAmqBD,qGAAqG;AACrG,wBAAgB,wBAAwB,CAAC,EACvC,IAAI,EACJ,gBAAgB,EAChB,YAAY,GACb,EAAE,iCAAiC,GAAG,gCAAgC,CAkBtE;AAED;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAE5D;AA+HD;;GAEG;AACH,wBAAgB,0BAA0B,CACxC,KAAK,EAAE,KAAK,EACZ,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,GACtC,UAAU,CAiIZ;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC5B,IAAI,EACJ,eAAe,EACf,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,gBAAgB,GACjB,EAAE,oBAAoB,GAAG,YAAY,CA6QrC"}

package/components/extended/ReactSimpleCodeEditor/helpers/highlighting.js

@@ -1,4 +1,4 @@
-import { jsx as f, Fragment as st } from "@emotion/react/jsx-runtime";
+import { jsx as d, Fragment as st } from "@emotion/react/jsx-runtime";
 import K from "prismjs";
 import { Highlight as Tt } from "prism-react-renderer";
 import { CODE_EDITOR_AT_TEMPLATE_TOKENS as S, CODE_EDITOR_AT_LANGUAGE as B, CODE_EDITOR_AT_TEMPLATE_NAME as St, CODE_EDITOR_AT_TEMPLATE_LANGUAGE_LABEL as vt, CODE_EDITOR_DEFAULT_LANGUAGE as at, CODE_EDITOR_LANGUAGE_ALIASES as Ot, getCodeEditorVSCodeModernPalette as Q } from "../constants.js";
@@ -67,15 +67,15 @@ const V = K.languages, ct = {}, lt = {}, j = /* @__PURE__ */ new WeakMap(), At =
     reservedWords: [...S.reservedWords]
   }
 };
-function Nt(t) {
-  return [...Q(t).bracketPalette];
+function Nt(t, e) {
+  return [...Q(t, e).bracketPalette];
 }
-function Rt(t) {
-  const e = Q(t);
+function Rt(t, e) {
+  const n = Q(t, e);
   return {
-    constant: e.syntax.constant,
-    type: e.syntax.type,
-    variable: e.syntax.variable
+    constant: n.syntax.constant,
+    type: n.syntax.type,
+    variable: n.syntax.variable
   };
 }
 function Pt(t) {
@@ -298,7 +298,7 @@ function m(t, e) {
     offset: n
   };
 }
-function dt(t, e, n) {
+function ft(t, e, n) {
   const r = t.split(`
 `), s = Math.min(Math.max(e, 1), Math.max(r.length, 1)), o = r.slice(0, s - 1).join(`
 `), i = s === 1 ? 0 : o.length + 1, c = r[s - 1] || "";
@@ -310,7 +310,7 @@ function dt(t, e, n) {
 function it(t, e) {
   return typeof e.offset == "number" ? m(t, e.offset) : m(
     t,
-    dt(t, e.line, e.column)
+    ft(t, e.line, e.column)
   );
 }
 function w(t, e, n) {
@@ -379,7 +379,7 @@ function Jt(t, e) {
     return D(t, Number(n[1]));
   const r = e.match(/\bline\s+(\d+)\s+column\s+(\d+)\b/i);
   if (r)
-    return dt(
+    return ft(
       t,
       Number(r[1]),
       Number(r[2])
@@ -719,129 +719,129 @@ function le(t, e, n) {
     text: t.slice(c)
   }), a.filter((l) => l.text.length > 0);
 }
-function Se(t) {
-  const e = Q(t), n = Rt(t);
+function Se(t, e) {
+  const n = Q(t, e), r = Rt(t, e);
   return {
     plain: {
       backgroundColor: "transparent",
-      color: e.surface.editorForeground
+      color: n.surface.editorForeground
     },
-    bracketPalette: Nt(t),
-    semanticPalette: n,
+    bracketPalette: Nt(t, e),
+    semanticPalette: r,
     styles: [
       {
         types: ["comment", "prolog", "doctype", "cdata"],
         style: {
-          color: e.syntax.comment,
+          color: n.syntax.comment,
           fontStyle: "italic"
         }
       },
       {
         types: ["punctuation"],
         style: {
-          color: e.surface.editorForeground
+          color: n.surface.editorForeground
         }
       },
       {
         types: ["operator"],
         style: {
-          color: e.syntax.operator
+          color: n.syntax.operator
         }
       },
       {
         types: ["property", "literal-property", "selector"],
         style: {
-          color: n.variable
+          color: r.variable
         }
       },
       {
         types: ["attr-name"],
         style: {
-          color: e.syntax.attributeName
+          color: n.syntax.attributeName
         }
       },
       {
         types: ["tag"],
         style: {
-          color: e.syntax.tag
+          color: n.syntax.tag
         }
       },
       {
         types: ["boolean"],
         style: {
-          color: e.syntax.boolean
+          color: n.syntax.boolean
         }
       },
       {
         types: ["number"],
         style: {
-          color: e.syntax.number
+          color: n.syntax.number
         }
       },
       {
         types: ["symbol"],
         style: {
-          color: e.syntax.constant
+          color: n.syntax.constant
         }
       },
       {
         types: ["atrule"],
         style: {
-          color: e.syntax.keyword
+          color: n.syntax.keyword
         }
       },
       {
         types: ["constant"],
         style: {
-          color: n.constant
+          color: r.constant
         }
       },
       {
         types: ["string", "char", "inserted"],
         style: {
-          color: e.syntax.string
+          color: n.syntax.string
         }
       },
       {
         types: ["regex"],
         style: {
-          color: e.syntax.regex
+          color: n.syntax.regex
         }
       },
       {
         types: ["constant.character.escape"],
         style: {
-          color: e.syntax.escape
+          color: n.syntax.escape
         }
       },
       {
         types: ["keyword"],
         style: {
-          color: e.syntax.keyword
+          color: n.syntax.keyword
         }
       },
       {
         types: ["function", "function-variable", "method", "method-variable"],
         style: {
-          color: e.syntax.function
+          color: n.syntax.function
         }
       },
       {
         types: ["builtin", "class-name", "known-class-name", "maybe-class-name"],
         style: {
-          color: n.type
+          color: r.type
         }
       },
       {
         types: ["alias", "imports", "parameter", "variable"],
         style: {
-          color: n.variable
+          color: r.variable
         }
       },
       {
         types: ["deleted"],
         style: {
-          color: e.surface.errorBorderColor
+          color: n.surface.errorBorderColor
         }
       }
     ]
@@ -864,8 +864,8 @@ function ve({
 `), M = q(l), C = jt(
     t,
     o
-  ), ft = ce(c, a);
-  return !a || c === at ? /* @__PURE__ */ f(st, { children: l.map((L, _) => {
+  ), dt = ce(c, a);
+  return !a || c === at ? /* @__PURE__ */ d(st, { children: l.map((L, _) => {
     const k = M[_] || 0, N = A(
       C,
       k,
@@ -875,12 +875,12 @@ function ve({
       k,
       C
     ) : [{ hasError: !1, text: L || " " }];
-    return /* @__PURE__ */ f(
+    return /* @__PURE__ */ d(
       "div",
       {
         className: "token-line",
         "data-code-editor-error-line": N || void 0,
-        children: R.map(($, z) => /* @__PURE__ */ f(
+        children: R.map(($, z) => /* @__PURE__ */ d(
           "span",
           {
             className: "token plain",
@@ -892,18 +892,18 @@ function ve({
       },
       `plain-line-${_}`
     );
-  }) }) : /* @__PURE__ */ f(
+  }) }) : /* @__PURE__ */ d(
     Tt,
     {
       code: t || " ",
       language: c,
-      prism: ft,
+      prism: dt,
       theme: s,
       children: ({ tokens: L, getLineProps: _, getTokenProps: k }) => {
         const N = s.bracketPalette, R = s.semanticPalette, $ = !!R && Pt(c);
         let z = 0;
         const x = {};
-        return /* @__PURE__ */ f(st, { children: L.map((W, O) => {
+        return /* @__PURE__ */ d(st, { children: L.map((W, O) => {
           const H = M[O] || 0, mt = l[O] || "", pt = A(
             C,
             H,
@@ -911,7 +911,7 @@ function ve({
           );
           let et = 0;
           const gt = _({ line: W });
-          return /* @__PURE__ */ f(
+          return /* @__PURE__ */ d(
             "div",
             {
               ...gt,
@@ -930,28 +930,28 @@ function ve({
                   const g = It(u.content);
                   if (g.some((h) => h.isIdentifier)) {
                     let h = 0;
-                    return g.map((d, F) => {
-                      const P = `token-${O}-${G}-${F}`, rt = T + h, yt = rt + d.content.length, ot = A(
+                    return g.map((f, F) => {
+                      const P = `token-${O}-${G}-${F}`, rt = T + h, yt = rt + f.content.length, ot = A(
                         C,
                         rt,
                         yt
                       );
-                      if (h += d.content.length, !d.isIdentifier || !R)
+                      if (h += f.content.length, !f.isIdentifier || !R)
                         return I(
                           x,
-                          d.content
-                        ), /* @__PURE__ */ f(
+                          f.content
+                        ), /* @__PURE__ */ d(
                           "span",
                           {
                             className: p.className,
                             style: p.style,
                             "data-code-editor-error-token": ot || void 0,
-                            children: d.content
+                            children: f.content
                           },
                           P
                         );
                       const Ct = g.slice(F + 1).map((xt) => xt.content).join(""), U = Gt({
-                        identifier: d.content,
+                        identifier: f.content,
                         nextSignificantText: wt(
                           W,
                           G,
@@ -962,9 +962,9 @@ function ve({
                       });
                       return I(
                         x,
-                        d.content,
+                        f.content,
                         U
-                      ), /* @__PURE__ */ f(
+                      ), /* @__PURE__ */ d(
                         "span",
                         {
                           className: p.className,
@@ -974,7 +974,7 @@ function ve({
                           } : p.style,
                           "data-code-editor-error-token": ot || void 0,
                           "data-code-editor-token-group": U,
-                          children: d.content
+                          children: f.content
                         },
                         P
                       );
@@ -985,7 +985,7 @@ function ve({
                   x,
                   u.content,
                   nt
-                ), /* @__PURE__ */ f(
+                ), /* @__PURE__ */ d(
                   "span",
                   {
                     ...p,
@@ -994,9 +994,9 @@ function ve({
                   },
                   `token-${O}-${G}`
                 )) : Array.from(u.content).map((g, h) => {
-                  const d = `token-${O}-${G}-${h}`;
+                  const f = `token-${O}-${G}-${h}`;
                   if (!Ft(g))
-                    return I(x, g), /* @__PURE__ */ f(
+                    return I(x, g), /* @__PURE__ */ d(
                       "span",
                       {
                         className: p.className,
@@ -1008,13 +1008,13 @@ function ve({
                         ) || void 0,
                         children: g
                       },
-                      d
+                      f
                     );
                   const {
                     nextBracketDepth: F,
                     renderedBracketDepth: P
                   } = Ut(g, z);
-                  return z = F, I(x, g), /* @__PURE__ */ f(
+                  return z = F, I(x, g), /* @__PURE__ */ d(
                     "span",
                     {
                       className: p.className,
@@ -1030,7 +1030,7 @@ function ve({
                       "data-code-editor-bracket-depth": P,
                       children: g
                     },
-                    d
+                    f
                   );
                 });
               })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/components",
-  "version": "9.24.0-beta-feature-731-m4l-components-code-editor.3",
+  "version": "9.24.0-beta-feature-731-m4l-components-code-editor.4",
   "publishConfig": {
     "access": "public"
   },
@@ -53,24 +53,24 @@
     "@hookform/resolvers": "2.9.11",
     "nprogress": "0.2.0",
     "react-transition-group": "4.4.5",
-    "react-dropzone": "14.4.1",
-    "react-color": "2.19.3",
     "react-rnd": "10.5.2",
     "@mui/x-date-pickers": "6.20.2",
+    "react-color": "2.19.3",
     "react-draggable": "4.5.0",
-    "date-fns": "2.30.0",
     "react-spinners": "0.13.8",
+    "date-fns": "2.30.0",
+    "react-dropzone": "14.4.1",
     "chart.js": "4.5.1",
     "chartjs-chart-error-bars": "4.4.5",
     "qrcode.react": "3.2.0",
-    "react-resizable-panels": "2.1.9",
-    "react-simple-code-editor": "0.14.1",
     "simplebar-react": "3.2.6",
+    "react-simple-code-editor": "0.14.1",
+    "react-resizable-panels": "2.1.9",
     "react-data-grid": "7.0.0-beta.47",
     "react-dnd": "16.0.1",
     "react-dnd-html5-backend": "16.0.1",
-    "react-window": "1.8.11",
     "react-resizable": "3.1.3",
+    "react-window": "1.8.11",
     "@tanstack/react-virtual": "3.13.23"
   }
 }