@payloadcms/ui 3.0.0-canary.ff8c8fd → 3.0.0

package/dist/elements/Card/index.scss

@@ -1,71 +1,73 @@
 @import '../../scss/styles';
 
-.card {
-  background: var(--theme-elevation-50);
-  padding: base(0.8);
-  width: 100%;
-  min-height: base(4);
-  position: relative;
-  border-radius: var(--style-radius-m);
-  border: 1px solid var(--theme-border-color);
-  transition-property: border, box-shadow, background;
-  transition-duration: 100ms;
-  transition-timing-function: cubic-bezier(0, 0.2, 0.2, 1);
-  display: flex;
-  justify-content: space-between;
-  align-self: start;
-  gap: base(0.8);
-
-  &__title {
-    @extend %h5;
-    letter-spacing: 0;
-    font-weight: 600;
-    line-height: base(0.8);
+@layer payload-default {
+  .card {
+    background: var(--theme-elevation-50);
+    padding: base(0.8);
     width: 100%;
-    margin: base(0.1) 0;
-  }
-
-  &__actions {
+    min-height: base(4);
     position: relative;
-    z-index: 2;
-    display: inline-flex;
-    .btn {
-      margin: 0;
-      flex-shrink: 0;
+    border-radius: var(--style-radius-m);
+    border: 1px solid var(--theme-border-color);
+    transition-property: border, box-shadow, background;
+    transition-duration: 100ms;
+    transition-timing-function: cubic-bezier(0, 0.2, 0.2, 1);
+    display: flex;
+    justify-content: space-between;
+    align-self: start;
+    gap: base(0.8);
+
+    &__title {
+      @extend %h5;
+      letter-spacing: 0;
+      font-weight: 600;
+      line-height: base(0.8);
+      width: 100%;
+      margin: base(0.1) 0;
     }
 
-    .btn__icon {
-      border: 1px solid var(--theme-border-color);
-      transition-property: border, box-shadow, color, background;
-      transition-duration: 100ms;
-      transition-timing-function: cubic-bezier(0, 0.2, 0.2, 1);
+    &__actions {
+      position: relative;
+      z-index: 2;
+      display: inline-flex;
+      .btn {
+        margin: 0;
+        flex-shrink: 0;
+      }
+
+      .btn__icon {
+        border: 1px solid var(--theme-border-color);
+        transition-property: border, box-shadow, color, background;
+        transition-duration: 100ms;
+        transition-timing-function: cubic-bezier(0, 0.2, 0.2, 1);
 
-      &:hover {
-        border: 1px solid var(--theme-elevation-500);
-        background-color: var(--theme-elevation-0);
-        color: currentColor;
-        @include shadow-sm;
+        &:hover {
+          border: 1px solid var(--theme-elevation-500);
+          background-color: var(--theme-elevation-0);
+          color: currentColor;
+          @include shadow-sm;
+        }
       }
     }
-  }
 
-  &--has-onclick {
-    cursor: pointer;
+    &--has-onclick {
+      cursor: pointer;
 
-    &:hover {
-      background: var(--theme-elevation-50);
-      border: 1px solid var(--theme-elevation-250);
-      box-shadow: 0 4px 8px -2px rgba(0, 0, 0, 0.05);
+      &:hover {
+        background: var(--theme-elevation-50);
+        border: 1px solid var(--theme-elevation-250);
+        box-shadow: 0 4px 8px -2px rgba(0, 0, 0, 0.05);
+      }
     }
-  }
 
-  &__click {
-    z-index: 1;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    position: absolute;
-    margin: 0;
+    &__click {
+      z-index: 1;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      position: absolute;
+      margin: 0;
+    }
   }
 }

package/dist/elements/CodeEditor/CodeEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/CodeEditor.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAIvC,OAAO,cAAc,CAAA;AAMrB,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAkC/B,CAAA;AAGD,eAAe,UAAU,CAAA"}
+{"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/CodeEditor.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAIvC,OAAO,cAAc,CAAA;AAMrB,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAqD/B,CAAA;AAGD,eAAe,UAAU,CAAA"}

package/dist/elements/CodeEditor/CodeEditor.js

@@ -3,23 +3,23 @@
 import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
 import EditorImport from '@monaco-editor/react';
-import React from 'react';
+import React, { useState } from 'react';
 import { useTheme } from '../../providers/Theme/index.js';
 import { ShimmerEffect } from '../ShimmerEffect/index.js';
 import './index.scss';
 const Editor = EditorImport.default || EditorImport;
 const baseClass = 'code-editor';
 const CodeEditor = props => {
-  const $ = _c(17);
+  const $ = _c(22);
   let rest;
   let readOnly;
   let className;
-  let height;
   let options;
+  let maxHeight;
   if ($[0] !== props) {
     ({
       className,
-      height,
+      maxHeight,
       options,
       readOnly,
       ...rest
@@ -28,15 +28,16 @@ const CodeEditor = props => {
     $[1] = rest;
     $[2] = readOnly;
     $[3] = className;
-    $[4] = height;
-    $[5] = options;
+    $[4] = options;
+    $[5] = maxHeight;
   } else {
     rest = $[1];
     readOnly = $[2];
     className = $[3];
-    height = $[4];
-    options = $[5];
+    options = $[4];
+    maxHeight = $[5];
   }
+  const [dynamicHeight, setDynamicHeight] = useState(20);
   const {
     theme
   } = useTheme();
@@ -54,36 +55,66 @@ const CodeEditor = props => {
   }
   const classes = t2.join(" ");
   let t3;
-  if ($[10] !== height || $[11] !== readOnly || $[12] !== options || $[13] !== theme || $[14] !== classes || $[15] !== rest) {
+  if ($[10] !== dynamicHeight || $[11] !== readOnly || $[12] !== options || $[13] !== theme || $[14] !== maxHeight || $[15] !== rest || $[16] !== classes) {
+    let t4;
+    if ($[18] !== rest.onChange) {
+      t4 = (value, ev) => {
+        rest.onChange?.(value, ev);
+        setDynamicHeight(Math.max(56, value.split("\n").length * 18 + 2));
+      };
+      $[18] = rest.onChange;
+      $[19] = t4;
+    } else {
+      t4 = $[19];
+    }
+    let t5;
+    if ($[20] !== rest.onMount) {
+      t5 = (editor, monaco) => {
+        rest.onMount?.(editor, monaco);
+        setDynamicHeight(Math.max(56, editor.getValue().split("\n").length * 18 + 2));
+      };
+      $[20] = rest.onMount;
+      $[21] = t5;
+    } else {
+      t5 = $[21];
+    }
     t3 = _jsx(Editor, {
       className: classes,
-      height,
       loading: _jsx(ShimmerEffect, {
-        height
+        height: dynamicHeight
       }),
       options: {
         detectIndentation: true,
+        hideCursorInOverviewRuler: true,
         minimap: {
           enabled: false
         },
+        overviewRulerBorder: false,
         readOnly: Boolean(readOnly),
+        scrollbar: {
+          alwaysConsumeMouseWheel: false
+        },
         scrollBeyondLastLine: false,
         tabSize: 2,
         wordWrap: "on",
         ...options
       },
       theme: theme === "dark" ? "vs-dark" : "vs",
-      ...rest
+      ...rest,
+      height: maxHeight ? Math.min(dynamicHeight, maxHeight) : dynamicHeight,
+      onChange: t4,
+      onMount: t5
     });
-    $[10] = height;
+    $[10] = dynamicHeight;
     $[11] = readOnly;
     $[12] = options;
     $[13] = theme;
-    $[14] = classes;
+    $[14] = maxHeight;
     $[15] = rest;
-    $[16] = t3;
+    $[16] = classes;
+    $[17] = t3;
   } else {
-    t3 = $[16];
+    t3 = $[17];
   }
   return t3;
 };

package/dist/elements/CodeEditor/CodeEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeEditor.js","names":["c","_c","EditorImport","React","useTheme","ShimmerEffect","Editor","default","baseClass","CodeEditor","props","$","rest","readOnly","className","height","options","theme","t0","defaultLanguage","t1","t2","filter","Boolean","classes","join","t3","_jsx","loading","scrollBeyondLastLine","tabSize","wordWrap"],"sources":["../../../src/elements/CodeEditor/CodeEditor.tsx"],"sourcesContent":["'use client'\nimport EditorImport from '@monaco-editor/react'\nimport React from 'react'\n\nimport type { Props } from './types.js'\n\nimport { useTheme } from '../../providers/Theme/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\nimport './index.scss'\n\nconst Editor = (EditorImport.default || EditorImport) as unknown as typeof EditorImport.default\n\nconst baseClass = 'code-editor'\n\nconst CodeEditor: React.FC<Props> = (props) => {\n  const { className, height, options, readOnly, ...rest } = props\n\n  const { theme } = useTheme()\n\n  const classes = [\n    baseClass,\n    className,\n    rest?.defaultLanguage ? `language--${rest.defaultLanguage}` : '',\n    readOnly && 'read-only',\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <Editor\n      className={classes}\n      height={height}\n      loading={<ShimmerEffect height={height} />}\n      options={{\n        detectIndentation: true,\n        minimap: {\n          enabled: false,\n        },\n        readOnly: Boolean(readOnly),\n        scrollBeyondLastLine: false,\n        tabSize: 2,\n        wordWrap: 'on',\n        ...options,\n      }}\n      theme={theme === 'dark' ? 'vs-dark' : 'vs'}\n      {...rest}\n    />\n  )\n}\n\n// eslint-disable-next-line no-restricted-exports\nexport default CodeEditor\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,YAAA,MAAkB;AACzB,OAAOC,KAAA,MAAW;AAIlB,SAASC,QAAQ,QAAQ;AACzB,SAASC,aAAa,QAAQ;AAC9B,OAAO;AAEP,MAAMC,MAAA,GAAUJ,YAAA,CAAaK,OAAO,IAAIL,YAAA;AAExC,MAAMM,SAAA,GAAY;AAElB,MAAMC,UAAA,GAA8BC,KAAA;EAAA,MAAAC,CAAA,GAAAV,EAAA;EAAA,IAAAW,IAAA;EAAA,IAAAC,QAAA;EAAA,IAAAC,SAAA;EAAA,IAAAC,MAAA;EAAA,IAAAC,OAAA;EAAA,IAAAL,CAAA,QAAAD,KAAA;IAClC;MAAAI,SAAA;MAAAC,MAAA;MAAAC,OAAA;MAAAH,QAAA;MAAA,GAAAD;IAAA,IAA0DF,KAAA;IAAAC,CAAA,MAAAD,KAAA;IAAAC,CAAA,MAAAC,IAAA;IAAAD,CAAA,MAAAE,QAAA;IAAAF,CAAA,MAAAG,SAAA;IAAAH,CAAA,MAAAI,MAAA;IAAAJ,CAAA,MAAAK,OAAA;EAAA;IAAAJ,IAAA,GAAAD,CAAA;IAAAE,QAAA,GAAAF,CAAA;IAAAG,SAAA,GAAAH,CAAA;IAAAI,MAAA,GAAAJ,CAAA;IAAAK,OAAA,GAAAL,CAAA;EAAA;EAE1D;IAAAM;EAAA,IAAkBb,QAAA;EAKhB,MAAAc,EAAA,GAAAN,IAAA,EAAAO,eAAA,GAAwB,aAAaP,IAAA,CAAAO,eAAA,EAAsB,GAAG;EAC9D,MAAAC,EAAA,GAAAP,QAAA,IAAY;EAAA,IAAAQ,EAAA;EAAA,IAAAV,CAAA,QAAAG,SAAA,IAAAH,CAAA,QAAAO,EAAA,IAAAP,CAAA,QAAAS,EAAA;IAJEC,EAAA,IAAAb,SAAA,EAEdM,SAAA,EACAI,EAA8D,EAC9DE,EAAY,EAAAE,MAAA,CAAAC,OAEJ;IAAAZ,CAAA,MAAAG,SAAA;IAAAH,CAAA,MAAAO,EAAA;IAAAP,CAAA,MAAAS,EAAA;IAAAT,CAAA,MAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EANV,MAAAa,OAAA,GAAgBH,EAMN,CAAAI,IAAA,CACF;EAAA,IAAAC,EAAA;EAAA,IAAAf,CAAA,SAAAI,MAAA,IAAAJ,CAAA,SAAAE,QAAA,IAAAF,CAAA,SAAAK,OAAA,IAAAL,CAAA,SAAAM,KAAA,IAAAN,CAAA,SAAAa,OAAA,IAAAb,CAAA,SAAAC,IAAA;IAGNc,EAAA,GAAAC,IAAA,CAAArB,MAAA;MAAAQ,SAAA,EACaU,OAAA;MAAAT,MAAA;MAAAa,OAAA,EAEFD,IAAA,CAAAtB,aAAA;QAAAU;MAAA,C;;;;;;kBAMGQ,OAAA,CAAQV,QAAA;QAAAgB,oBAAA;QAAAC,OAAA;QAAAC,QAAA,EAGR;QAAA,GACPf;MAAO;MAAAC,KAAA,EAELA,KAAA,KAAU,SAAS,YAAY;MAAA,GAClCL;IAAI,C;;;;;;;;;;;SAhBVc,E;CAmBJ;AAEA;AACA,eAAejB,UAAA","ignoreList":[]}
+{"version":3,"file":"CodeEditor.js","names":["c","_c","EditorImport","React","useState","useTheme","ShimmerEffect","Editor","default","baseClass","CodeEditor","props","$","rest","readOnly","className","options","maxHeight","dynamicHeight","setDynamicHeight","theme","t0","defaultLanguage","t1","t2","filter","Boolean","classes","join","t3","t4","onChange","value","ev","Math","max","split","length","t5","onMount","editor","monaco","getValue","_jsx","loading","height","scrollbar","alwaysConsumeMouseWheel","scrollBeyondLastLine","tabSize","wordWrap","min"],"sources":["../../../src/elements/CodeEditor/CodeEditor.tsx"],"sourcesContent":["'use client'\nimport EditorImport from '@monaco-editor/react'\nimport React, { useState } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { useTheme } from '../../providers/Theme/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\nimport './index.scss'\n\nconst Editor = (EditorImport.default || EditorImport) as unknown as typeof EditorImport.default\n\nconst baseClass = 'code-editor'\n\nconst CodeEditor: React.FC<Props> = (props) => {\n  const { className, maxHeight, options, readOnly, ...rest } = props\n  const [dynamicHeight, setDynamicHeight] = useState(20)\n  const { theme } = useTheme()\n\n  const MIN_HEIGHT = 56 // equivalent to 3 lines\n\n  const classes = [\n    baseClass,\n    className,\n    rest?.defaultLanguage ? `language--${rest.defaultLanguage}` : '',\n    readOnly && 'read-only',\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <Editor\n      className={classes}\n      loading={<ShimmerEffect height={dynamicHeight} />}\n      options={{\n        detectIndentation: true,\n        hideCursorInOverviewRuler: true,\n        minimap: {\n          enabled: false,\n        },\n        overviewRulerBorder: false,\n        readOnly: Boolean(readOnly),\n        scrollbar: {\n          alwaysConsumeMouseWheel: false,\n        },\n        scrollBeyondLastLine: false,\n        tabSize: 2,\n        wordWrap: 'on',\n        ...options,\n      }}\n      theme={theme === 'dark' ? 'vs-dark' : 'vs'}\n      {...rest}\n      // Since we are not building an IDE and the container\n      // can already have scrolling, we want the height of the\n      // editor to fit its content.\n      // See: https://github.com/microsoft/monaco-editor/discussions/3677\n      height={maxHeight ? Math.min(dynamicHeight, maxHeight) : dynamicHeight}\n      onChange={(value, ev) => {\n        rest.onChange?.(value, ev)\n        setDynamicHeight(Math.max(MIN_HEIGHT, value.split('\\n').length * 18 + 2))\n      }}\n      onMount={(editor, monaco) => {\n        rest.onMount?.(editor, monaco)\n        setDynamicHeight(Math.max(MIN_HEIGHT, editor.getValue().split('\\n').length * 18 + 2))\n      }}\n    />\n  )\n}\n\n// eslint-disable-next-line no-restricted-exports\nexport default CodeEditor\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,YAAA,MAAkB;AACzB,OAAOC,KAAA,IAASC,QAAQ,QAAQ;AAIhC,SAASC,QAAQ,QAAQ;AACzB,SAASC,aAAa,QAAQ;AAC9B,OAAO;AAEP,MAAMC,MAAA,GAAUL,YAAA,CAAaM,OAAO,IAAIN,YAAA;AAExC,MAAMO,SAAA,GAAY;AAElB,MAAMC,UAAA,GAA8BC,KAAA;EAAA,MAAAC,CAAA,GAAAX,EAAA;EAAA,IAAAY,IAAA;EAAA,IAAAC,QAAA;EAAA,IAAAC,SAAA;EAAA,IAAAC,OAAA;EAAA,IAAAC,SAAA;EAAA,IAAAL,CAAA,QAAAD,KAAA;IAClC;MAAAI,SAAA;MAAAE,SAAA;MAAAD,OAAA;MAAAF,QAAA;MAAA,GAAAD;IAAA,IAA6DF,KAAA;IAAAC,CAAA,MAAAD,KAAA;IAAAC,CAAA,MAAAC,IAAA;IAAAD,CAAA,MAAAE,QAAA;IAAAF,CAAA,MAAAG,SAAA;IAAAH,CAAA,MAAAI,OAAA;IAAAJ,CAAA,MAAAK,SAAA;EAAA;IAAAJ,IAAA,GAAAD,CAAA;IAAAE,QAAA,GAAAF,CAAA;IAAAG,SAAA,GAAAH,CAAA;IAAAI,OAAA,GAAAJ,CAAA;IAAAK,SAAA,GAAAL,CAAA;EAAA;EAC7D,OAAAM,aAAA,EAAAC,gBAAA,IAA0Cf,QAAA,GAAS;EACnD;IAAAgB;EAAA,IAAkBf,QAAA;EAOhB,MAAAgB,EAAA,GAAAR,IAAA,EAAAS,eAAA,GAAwB,aAAaT,IAAA,CAAAS,eAAA,EAAsB,GAAG;EAC9D,MAAAC,EAAA,GAAAT,QAAA,IAAY;EAAA,IAAAU,EAAA;EAAA,IAAAZ,CAAA,QAAAG,SAAA,IAAAH,CAAA,QAAAS,EAAA,IAAAT,CAAA,QAAAW,EAAA;IAJEC,EAAA,IAAAf,SAAA,EAEdM,SAAA,EACAM,EAA8D,EAC9DE,EAAY,EAAAE,MAAA,CAAAC,OAEJ;IAAAd,CAAA,MAAAG,SAAA;IAAAH,CAAA,MAAAS,EAAA;IAAAT,CAAA,MAAAW,EAAA;IAAAX,CAAA,MAAAY,EAAA;EAAA;IAAAA,EAAA,GAAAZ,CAAA;EAAA;EANV,MAAAe,OAAA,GAAgBH,EAMN,CAAAI,IAAA,CACF;EAAA,IAAAC,EAAA;EAAA,IAAAjB,CAAA,SAAAM,aAAA,IAAAN,CAAA,SAAAE,QAAA,IAAAF,CAAA,SAAAI,OAAA,IAAAJ,CAAA,SAAAQ,KAAA,IAAAR,CAAA,SAAAK,SAAA,IAAAL,CAAA,SAAAC,IAAA,IAAAD,CAAA,SAAAe,OAAA;IAAA,IAAAG,EAAA;IAAA,IAAAlB,CAAA,SAAAC,IAAA,CAAAkB,QAAA;MA6BMD,EAAA,GAAAA,CAAAE,KAAA,EAAAC,EAAA;QACRpB,IAAA,CAAAkB,QAAA,GAAgBC,KAAA,EAAOC,EAAA;QACvBd,gBAAA,CAAiBe,IAAA,CAAAC,GAAA,KAAqBH,KAAA,CAAAI,KAAA,CAAY,MAAAC,MAAA,KAAe,IAAK;MAAA;MACxEzB,CAAA,OAAAC,IAAA,CAAAkB,QAAA;MAAAnB,CAAA,OAAAkB,EAAA;IAAA;MAAAA,EAAA,GAAAlB,CAAA;IAAA;IAAA,IAAA0B,EAAA;IAAA,IAAA1B,CAAA,SAAAC,IAAA,CAAA0B,OAAA;MACSD,EAAA,GAAAA,CAAAE,MAAA,EAAAC,MAAA;QACP5B,IAAA,CAAA0B,OAAA,GAAeC,MAAA,EAAQC,MAAA;QACvBtB,gBAAA,CAAiBe,IAAA,CAAAC,GAAA,KAAqBK,MAAA,CAAAE,QAAA,CAAe,EAAAN,KAAA,CAAS,MAAAC,MAAA,KAAe,IAAK;MAAA;MACpFzB,CAAA,OAAAC,IAAA,CAAA0B,OAAA;MAAA3B,CAAA,OAAA0B,EAAA;IAAA;MAAAA,EAAA,GAAA1B,CAAA;IAAA;IAjCFiB,EAAA,GAAAc,IAAA,CAAApC,MAAA;MAAAQ,SAAA,EACaY,OAAA;MAAAiB,OAAA,EACFD,IAAA,CAAArC,aAAA;QAAAuC,MAAA,EAAuB3B;MAAA,C;;;;;;;;kBAQpBQ,OAAA,CAAQZ,QAAA;QAAAgC,SAAA;UAAAC,uBAAA;QAAA;QAAAC,oBAAA;QAAAC,OAAA;QAAAC,QAAA,EAMR;QAAA,GACPlC;MAAO;MAAAI,KAAA,EAELA,KAAA,KAAU,SAAS,YAAY;MAAA,GAClCP,IAAI;MAAAgC,MAAA,EAKA5B,SAAA,GAAYiB,IAAA,CAAAiB,GAAA,CAASjC,aAAA,EAAeD,SAAA,IAAaC,aAAA;MAAAa,QAAA,EAC/CD,EAGV;MAAAS,OAAA,EACSD;IAGT,C;;;;;;;;;;;;SAjCFT,E;CAoCJ;AAEA;AACA,eAAenB,UAAA","ignoreList":[]}

package/dist/elements/CodeEditor/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyB,MAAM,OAAO,CAAA;AAE7C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAMvC,YAAY,EAAE,KAAK,EAAE,CAAA;AAErB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAQtC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyB,MAAM,OAAO,CAAA;AAE7C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAMvC,YAAY,EAAE,KAAK,EAAE,CAAA;AAErB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAMtC,CAAA"}

package/dist/elements/CodeEditor/index.js

@@ -1,20 +1,14 @@
 'use client';
 
 import { jsx as _jsx } from "react/jsx-runtime";
-import React, { Suspense, lazy } from 'react';
+import React, { lazy, Suspense } from 'react';
 import { ShimmerEffect } from '../ShimmerEffect/index.js';
 const LazyEditor = /*#__PURE__*/lazy(() => import('./CodeEditor.js'));
 export const CodeEditor = props => {
-  const {
-    height = '35vh'
-  } = props;
   return /*#__PURE__*/_jsx(Suspense, {
-    fallback: /*#__PURE__*/_jsx(ShimmerEffect, {
-      height: height
-    }),
+    fallback: /*#__PURE__*/_jsx(ShimmerEffect, {}),
     children: /*#__PURE__*/_jsx(LazyEditor, {
-      ...props,
-      height: height
+      ...props
     })
   });
 };

package/dist/elements/CodeEditor/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","Suspense","lazy","ShimmerEffect","LazyEditor","CodeEditor","props","height","_jsx","fallback"],"sources":["../../../src/elements/CodeEditor/index.tsx"],"sourcesContent":["'use client'\nimport React, { Suspense, lazy } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\n\nconst LazyEditor = lazy(() => import('./CodeEditor.js'))\n\nexport type { Props }\n\nexport const CodeEditor: React.FC<Props> = (props) => {\n  const { height = '35vh' } = props\n\n  return (\n    <Suspense fallback={<ShimmerEffect height={height} />}>\n      <LazyEditor {...props} height={height} />\n    </Suspense>\n  )\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,IAASC,QAAQ,EAAEC,IAAI,QAAQ;AAItC,SAASC,aAAa,QAAQ;AAE9B,MAAMC,UAAA,gBAAaF,IAAA,CAAK,MAAM,MAAM,CAAC;AAIrC,OAAO,MAAMG,UAAA,GAA+BC,KAAA;EAC1C,MAAM;IAAEC,MAAA,GAAS;EAAM,CAAE,GAAGD,KAAA;EAE5B,oBACEE,IAAA,CAACP,QAAA;IAASQ,QAAA,eAAUD,IAAA,CAACL,aAAA;MAAcI,MAAA,EAAQA;;cACzC,aAAAC,IAAA,CAACJ,UAAA;MAAY,GAAGE,KAAK;MAAEC,MAAA,EAAQA;;;AAGrC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","lazy","Suspense","ShimmerEffect","LazyEditor","CodeEditor","props","_jsx","fallback"],"sources":["../../../src/elements/CodeEditor/index.tsx"],"sourcesContent":["'use client'\nimport React, { lazy, Suspense } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\n\nconst LazyEditor = lazy(() => import('./CodeEditor.js'))\n\nexport type { Props }\n\nexport const CodeEditor: React.FC<Props> = (props) => {\n  return (\n    <Suspense fallback={<ShimmerEffect />}>\n      <LazyEditor {...props} />\n    </Suspense>\n  )\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,IAASC,IAAI,EAAEC,QAAQ,QAAQ;AAItC,SAASC,aAAa,QAAQ;AAE9B,MAAMC,UAAA,gBAAaH,IAAA,CAAK,MAAM,MAAM,CAAC;AAIrC,OAAO,MAAMI,UAAA,GAA+BC,KAAA;EAC1C,oBACEC,IAAA,CAACL,QAAA;IAASM,QAAA,eAAUD,IAAA,CAACJ,aAAA;cACnB,aAAAI,IAAA,CAACH,UAAA;MAAY,GAAGE;;;AAGtB","ignoreList":[]}

package/dist/elements/CodeEditor/index.scss

@@ -1,21 +1,23 @@
 @import '../../scss/styles';
 
-.code-editor {
-  direction: ltr;
-  @include formInput;
-  height: auto;
-  padding: 0;
+@layer payload-default {
+  .code-editor {
+    direction: ltr;
+    @include formInput;
+    height: auto;
+    padding: 0;
 
-  .monaco-editor {
-    .view-overlays .current-line {
-      max-width: calc(100% - 14px);
-      border-width: 0px;
-    }
-
-    &:focus-within {
+    .monaco-editor {
       .view-overlays .current-line {
-        border-right: 0;
-        border-width: 1px;
+        max-width: calc(100% - 14px);
+        border-width: 0px;
+      }
+
+      &:focus-within {
+        .view-overlays .current-line {
+          border-right: 0;
+          border-width: 1px;
+        }
       }
     }
   }

package/dist/elements/CodeEditor/types.d.ts

@@ -1,5 +1,6 @@
 import type { EditorProps } from '@monaco-editor/react';
 export type Props = {
+    maxHeight?: number;
     readOnly?: boolean;
 } & EditorProps;
 //# sourceMappingURL=types.d.ts.map

package/dist/elements/CodeEditor/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAA;AAEvD,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,WAAW,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAA;AAEvD,MAAM,MAAM,KAAK,GAAG;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,WAAW,CAAA"}

package/dist/elements/CodeEditor/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/CodeEditor/types.ts"],"sourcesContent":["import type { EditorProps } from '@monaco-editor/react'\n\nexport type Props = {\n  readOnly?: boolean\n} & EditorProps\n"],"mappings":"AAEA","ignoreList":[]}
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/CodeEditor/types.ts"],"sourcesContent":["import type { EditorProps } from '@monaco-editor/react'\n\nexport type Props = {\n  maxHeight?: number\n  readOnly?: boolean\n} & EditorProps\n"],"mappings":"AAEA","ignoreList":[]}

package/dist/elements/Collapsible/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Collapsible/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAGvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qDAAqD,CAAA;AAQ1F,OAAO,cAAc,CAAA;AACrB,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAInE,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,CAAA;AAE9C,MAAM,MAAM,KAAK,GAAG;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gBAAgB,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IACtC,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;CACxD,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAyFvC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Collapsible/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAGvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qDAAqD,CAAA;AAQ1F,OAAO,cAAc,CAAA;AACrB,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAInE,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,CAAA;AAE9C,MAAM,MAAM,KAAK,GAAG;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gBAAgB,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IACtC,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;CACxD,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA2FvC,CAAA"}

package/dist/elements/Collapsible/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useState","AnimateHeightImport","AnimateHeight","default","ChevronIcon","DragHandleIcon","useTranslation","CollapsibleProvider","useCollapsible","baseClass","Collapsible","t0","$","actions","children","className","collapsibleStyle","t1","dragHandleProps","header","initCollapsed","isCollapsed","collapsedFromProps","onToggle","undefined","collapsedLocal","setCollapsedLocal","Boolean","hoveringToggle","setHoveringToggle","isWithinCollapsible","t","t2","toggleCollapsible","t3","t4","t5","t6","t7","t8","filter","t9","join","t10","t11","Symbol","for","t12","t13","t14","t15","t16","_jsx","attributes","listeners","_jsxs","toggle","onMouseEnter","onMouseLeave","onClick","type","direction","duration","height"],"sources":["../../../src/elements/Collapsible/index.tsx"],"sourcesContent":["'use client'\nimport React, { useState } from 'react'\nimport AnimateHeightImport from 'react-animate-height'\n\nimport type { DragHandleProps } from '../DraggableSortable/DraggableSortableItem/types.js'\n\nconst AnimateHeight = (AnimateHeightImport.default ||\n  AnimateHeightImport) as typeof AnimateHeightImport.default\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { DragHandleIcon } from '../../icons/DragHandle/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\nimport { CollapsibleProvider, useCollapsible } from './provider.js'\n\nconst baseClass = 'collapsible'\n\nexport { CollapsibleProvider, useCollapsible }\n\nexport type Props = {\n  actions?: React.ReactNode\n  children: React.ReactNode\n  className?: string\n  collapsibleStyle?: 'default' | 'error'\n  dragHandleProps?: DragHandleProps\n  header?: React.ReactNode\n  initCollapsed?: boolean\n  isCollapsed?: boolean\n  onToggle?: (collapsed: boolean) => Promise<void> | void\n}\n\nexport const Collapsible: React.FC<Props> = ({\n  actions,\n  children,\n  className,\n  collapsibleStyle = 'default',\n  dragHandleProps,\n  header,\n  initCollapsed,\n  isCollapsed: collapsedFromProps,\n  onToggle,\n}) => {\n  const [collapsedLocal, setCollapsedLocal] = useState(Boolean(initCollapsed))\n  const [hoveringToggle, setHoveringToggle] = useState(false)\n  const { isWithinCollapsible } = useCollapsible()\n  const { t } = useTranslation()\n\n  const isCollapsed = typeof collapsedFromProps === 'boolean' ? collapsedFromProps : collapsedLocal\n\n  const toggleCollapsible = React.useCallback(() => {\n    if (typeof onToggle === 'function') void onToggle(!isCollapsed)\n    setCollapsedLocal(!isCollapsed)\n  }, [onToggle, isCollapsed])\n\n  return (\n    <div\n      className={[\n        baseClass,\n        className,\n        dragHandleProps && `${baseClass}--has-drag-handle`,\n        isCollapsed && `${baseClass}--collapsed`,\n        isWithinCollapsible && `${baseClass}--nested`,\n        hoveringToggle && `${baseClass}--hovered`,\n        `${baseClass}--style-${collapsibleStyle}`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <CollapsibleProvider isCollapsed={isCollapsed} toggle={toggleCollapsible}>\n        <div\n          className={`${baseClass}__toggle-wrap`}\n          onMouseEnter={() => setHoveringToggle(true)}\n          onMouseLeave={() => setHoveringToggle(false)}\n        >\n          <button\n            className={[\n              `${baseClass}__toggle`,\n              `${baseClass}__toggle--${isCollapsed ? 'collapsed' : 'open'}`,\n            ]\n              .filter(Boolean)\n              .join(' ')}\n            onClick={toggleCollapsible}\n            type=\"button\"\n          >\n            <span>{t('fields:toggleBlock')}</span>\n          </button>\n          {dragHandleProps && (\n            <div\n              className={`${baseClass}__drag`}\n              {...dragHandleProps.attributes}\n              {...dragHandleProps.listeners}\n            >\n              <DragHandleIcon />\n            </div>\n          )}\n          {header ? (\n            <div\n              className={[\n                `${baseClass}__header-wrap`,\n                dragHandleProps && `${baseClass}__header-wrap--has-drag-handle`,\n              ]\n                .filter(Boolean)\n                .join(' ')}\n            >\n              {header}\n            </div>\n          ) : null}\n          <div className={`${baseClass}__actions-wrap`}>\n            {actions ? <div className={`${baseClass}__actions`}>{actions}</div> : null}\n            <div className={`${baseClass}__indicator`}>\n              <ChevronIcon direction={!isCollapsed ? 'up' : undefined} />\n            </div>\n          </div>\n        </div>\n        <AnimateHeight duration={200} height={isCollapsed ? 0 : 'auto'}>\n          <div className={`${baseClass}__content`}>{children}</div>\n        </AnimateHeight>\n      </CollapsibleProvider>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useState","AnimateHeightImport","AnimateHeight","default","ChevronIcon","DragHandleIcon","useTranslation","CollapsibleProvider","useCollapsible","baseClass","Collapsible","t0","$","actions","children","className","collapsibleStyle","t1","dragHandleProps","header","initCollapsed","isCollapsed","collapsedFromProps","onToggle","undefined","collapsedLocal","setCollapsedLocal","Boolean","hoveringToggle","setHoveringToggle","isWithinCollapsible","t","t2","toggleCollapsible","t3","t4","t5","t6","t7","t8","filter","t9","join","t10","t11","Symbol","for","t12","t13","t14","t15","t16","_jsx","attributes","listeners","_jsxs","toggle","onMouseEnter","onMouseLeave","onClick","type","direction","duration","height"],"sources":["../../../src/elements/Collapsible/index.tsx"],"sourcesContent":["'use client'\nimport React, { useState } from 'react'\nimport AnimateHeightImport from 'react-animate-height'\n\nimport type { DragHandleProps } from '../DraggableSortable/DraggableSortableItem/types.js'\n\nconst AnimateHeight = (AnimateHeightImport.default ||\n  AnimateHeightImport) as typeof AnimateHeightImport.default\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { DragHandleIcon } from '../../icons/DragHandle/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\nimport { CollapsibleProvider, useCollapsible } from './provider.js'\n\nconst baseClass = 'collapsible'\n\nexport { CollapsibleProvider, useCollapsible }\n\nexport type Props = {\n  actions?: React.ReactNode\n  children: React.ReactNode\n  className?: string\n  collapsibleStyle?: 'default' | 'error'\n  dragHandleProps?: DragHandleProps\n  header?: React.ReactNode\n  initCollapsed?: boolean\n  isCollapsed?: boolean\n  onToggle?: (collapsed: boolean) => Promise<void> | void\n}\n\nexport const Collapsible: React.FC<Props> = ({\n  actions,\n  children,\n  className,\n  collapsibleStyle = 'default',\n  dragHandleProps,\n  header,\n  initCollapsed,\n  isCollapsed: collapsedFromProps,\n  onToggle,\n}) => {\n  const [collapsedLocal, setCollapsedLocal] = useState(Boolean(initCollapsed))\n  const [hoveringToggle, setHoveringToggle] = useState(false)\n  const { isWithinCollapsible } = useCollapsible()\n  const { t } = useTranslation()\n\n  const isCollapsed = typeof collapsedFromProps === 'boolean' ? collapsedFromProps : collapsedLocal\n\n  const toggleCollapsible = React.useCallback(() => {\n    if (typeof onToggle === 'function') {\n      void onToggle(!isCollapsed)\n    }\n    setCollapsedLocal(!isCollapsed)\n  }, [onToggle, isCollapsed])\n\n  return (\n    <div\n      className={[\n        baseClass,\n        className,\n        dragHandleProps && `${baseClass}--has-drag-handle`,\n        isCollapsed && `${baseClass}--collapsed`,\n        isWithinCollapsible && `${baseClass}--nested`,\n        hoveringToggle && `${baseClass}--hovered`,\n        `${baseClass}--style-${collapsibleStyle}`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <CollapsibleProvider isCollapsed={isCollapsed} toggle={toggleCollapsible}>\n        <div\n          className={`${baseClass}__toggle-wrap`}\n          onMouseEnter={() => setHoveringToggle(true)}\n          onMouseLeave={() => setHoveringToggle(false)}\n        >\n          <button\n            className={[\n              `${baseClass}__toggle`,\n              `${baseClass}__toggle--${isCollapsed ? 'collapsed' : 'open'}`,\n            ]\n              .filter(Boolean)\n              .join(' ')}\n            onClick={toggleCollapsible}\n            type=\"button\"\n          >\n            <span>{t('fields:toggleBlock')}</span>\n          </button>\n          {dragHandleProps && (\n            <div\n              className={`${baseClass}__drag`}\n              {...dragHandleProps.attributes}\n              {...dragHandleProps.listeners}\n            >\n              <DragHandleIcon />\n            </div>\n          )}\n          {header ? (\n            <div\n              className={[\n                `${baseClass}__header-wrap`,\n                dragHandleProps && `${baseClass}__header-wrap--has-drag-handle`,\n              ]\n                .filter(Boolean)\n                .join(' ')}\n            >\n              {header}\n            </div>\n          ) : null}\n          <div className={`${baseClass}__actions-wrap`}>\n            {actions ? <div className={`${baseClass}__actions`}>{actions}</div> : null}\n            <div className={`${baseClass}__indicator`}>\n              <ChevronIcon direction={!isCollapsed ? 'up' : undefined} />\n            </div>\n          </div>\n        </div>\n        <AnimateHeight duration={200} height={isCollapsed ? 0 : 'auto'}>\n          <div className={`${baseClass}__content`}>{children}</div>\n        </AnimateHeight>\n      </CollapsibleProvider>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}