@synerise/ds-code-area 1.3.2 → 1.3.4

package/dist/components/FullscreenHeader.js

@@ -1,21 +1,20 @@
-import React from 'react';
-import Button from '@synerise/ds-button';
-import Icon, { CloseM, CodeTerminalM } from '@synerise/ds-icon';
-import * as S from '../CodeArea.styles';
-export var FullscreenHeader = function FullscreenHeader(_ref) {
-  var label = _ref.label,
-    texts = _ref.texts,
-    onClick = _ref.onClick;
-  return /*#__PURE__*/React.createElement(S.FullscreenHeader, null, /*#__PURE__*/React.createElement(S.LeftSide, null, /*#__PURE__*/React.createElement(S.FullscreenHeaderTitle, {
-    level: 3
-  }, /*#__PURE__*/React.createElement(Icon, {
-    component: /*#__PURE__*/React.createElement(CodeTerminalM, null)
-  }), label || texts.fullscreenTitle)), /*#__PURE__*/React.createElement(S.RightSide, null, /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    mode: "icon-label",
-    onClick: onClick,
-    icon: /*#__PURE__*/React.createElement(Icon, {
-      component: /*#__PURE__*/React.createElement(CloseM, null)
-    })
-  }, texts.closeFullscreen)));
-};
+import { jsxs, jsx } from "react/jsx-runtime";
+import Button from "@synerise/ds-button";
+import Icon, { CodeTerminalM, CloseM } from "@synerise/ds-icon";
+import { FullscreenHeader as FullscreenHeader$1, LeftSide, FullscreenHeaderTitle, RightSide } from "../CodeArea.styles.js";
+const FullscreenHeader = ({
+  label,
+  texts,
+  onClick
+}) => {
+  return /* @__PURE__ */ jsxs(FullscreenHeader$1, { children: [
+    /* @__PURE__ */ jsx(LeftSide, { children: /* @__PURE__ */ jsxs(FullscreenHeaderTitle, { level: 3, children: [
+      /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(CodeTerminalM, {}) }),
+      label || texts.fullscreenTitle
+    ] }) }),
+    /* @__PURE__ */ jsx(RightSide, { children: /* @__PURE__ */ jsx(Button, { type: "primary", mode: "icon-label", onClick, icon: /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(CloseM, {}) }), children: texts.closeFullscreen }) })
+  ] });
+};
+export {
+  FullscreenHeader
+};

package/dist/components/index.js

@@ -1,6 +1,14 @@
-export * from './ContentAbove';
-export * from './ContentBelow';
-export * from './FullscreenHeader';
-export * from './BottomBar';
-export * from './CodeAreaEditorRaw';
-export * from './CodeAreaEditor';
+import { ContentAbove } from "./ContentAbove.js";
+import { ContentBelow } from "./ContentBelow.js";
+import { FullscreenHeader } from "./FullscreenHeader.js";
+import { BottomBar } from "./BottomBar.js";
+import { CodeAreaEditorRaw } from "./CodeAreaEditorRaw.js";
+import { CodeAreaEditor } from "./CodeAreaEditor.js";
+export {
+  BottomBar,
+  CodeAreaEditor,
+  CodeAreaEditorRaw,
+  ContentAbove,
+  ContentBelow,
+  FullscreenHeader
+};

package/dist/constants.d.ts

@@ -1,4 +1,4 @@
-import type { editor } from 'monaco-editor/esm/vs/editor/editor.api';
+import { editor } from 'monaco-editor/esm/vs/editor/editor.api';
 export declare const MONACO_DEFAULT_OPTIONS: editor.IStandaloneEditorConstructionOptions;
 export declare const TRIGGER_SOURCE = "ds-code-area";
 export declare const DS_MONACO_THEME_NAME = "DSTheme";

package/dist/constants.js

@@ -1,10 +1,10 @@
-import { theme } from '@synerise/ds-core';
-export var MONACO_DEFAULT_OPTIONS = {
+import { theme } from "@synerise/ds-core";
+const MONACO_DEFAULT_OPTIONS = {
   minimap: {
     enabled: false
   },
   automaticLayout: true,
-  renderLineHighlight: 'none',
+  renderLineHighlight: "none",
   quickSuggestions: {
     other: true,
     strings: true
@@ -12,24 +12,30 @@ export var MONACO_DEFAULT_OPTIONS = {
   scrollbar: {
     verticalScrollbarSize: 11,
     verticalSliderSize: 3,
-    vertical: 'visible',
+    vertical: "visible",
     useShadows: false
   }
 };
-export var TRIGGER_SOURCE = 'ds-code-area';
-var TRANSPARENT = '#00000000';
-export var DS_MONACO_THEME_NAME = 'DSTheme';
-export var DS_MONACO_THEME = {
-  base: 'vs',
+const TRIGGER_SOURCE = "ds-code-area";
+const TRANSPARENT = "#00000000";
+const DS_MONACO_THEME_NAME = "DSTheme";
+const DS_MONACO_THEME = {
+  base: "vs",
   inherit: true,
   rules: [],
   colors: {
-    'editor.foreground': theme.palette['grey-800'],
-    'editor.background': TRANSPARENT,
-    'editorOverviewRuler.border': TRANSPARENT,
-    'scrollbarSlider.background': theme.palette['grey-300'],
-    'scrollbarSlider.hoverBackground': theme.palette['grey-500'],
-    'scrollbarSlider.activeBackground': theme.palette['grey-500'],
-    'editorLineNumber.foreground': theme.palette['grey-500']
+    "editor.foreground": theme.palette["grey-800"],
+    "editor.background": TRANSPARENT,
+    "editorOverviewRuler.border": TRANSPARENT,
+    "scrollbarSlider.background": theme.palette["grey-300"],
+    "scrollbarSlider.hoverBackground": theme.palette["grey-500"],
+    "scrollbarSlider.activeBackground": theme.palette["grey-500"],
+    "editorLineNumber.foreground": theme.palette["grey-500"]
   }
-};
+};
+export {
+  DS_MONACO_THEME,
+  DS_MONACO_THEME_NAME,
+  MONACO_DEFAULT_OPTIONS,
+  TRIGGER_SOURCE
+};

package/dist/index.js

@@ -1,2 +1,25 @@
-export { default } from './CodeArea';
-export * from './CodeArea.styles';
+import { default as default2 } from "./CodeArea.js";
+import { AdditionalDescription, AriaContainer, BottomBar, BottomBarElement, CodeAreaContent, CodeAreaWrapper, ContentAbove, ContentBelow, Counter, Description, EditorInnerWrapper, EditorPlaceholder, EditorWrapper, ErrorText, FullscreenHeader, FullscreenHeaderTitle, LeftSide, RightSide, SyntaxSelect, SyntaxTitle } from "./CodeArea.styles.js";
+export {
+  AdditionalDescription,
+  AriaContainer,
+  BottomBar,
+  BottomBarElement,
+  CodeAreaContent,
+  CodeAreaWrapper,
+  ContentAbove,
+  ContentBelow,
+  Counter,
+  Description,
+  EditorInnerWrapper,
+  EditorPlaceholder,
+  EditorWrapper,
+  ErrorText,
+  FullscreenHeader,
+  FullscreenHeaderTitle,
+  LeftSide,
+  RightSide,
+  SyntaxSelect,
+  SyntaxTitle,
+  default2 as default
+};

package/dist/modules.d.js

@@ -1 +1 @@
-import '@testing-library/jest-dom';
+import "@testing-library/jest-dom";

package/dist/utils/calculateRequiredSpace.js

@@ -1,6 +1,9 @@
-var HEADER_HEIGHT = 64;
-var BAR_HEIGHT = 49;
-var MARGINS = 40;
-export var calculateRequiredSpace = function calculateRequiredSpace(isBottomBarShowing, contentBelowHeight) {
+const HEADER_HEIGHT = 64;
+const BAR_HEIGHT = 49;
+const MARGINS = 40;
+const calculateRequiredSpace = (isBottomBarShowing, contentBelowHeight) => {
   return HEADER_HEIGHT + (isBottomBarShowing ? BAR_HEIGHT : 0) + contentBelowHeight + MARGINS;
-};
+};
+export {
+  calculateRequiredSpace
+};

package/dist/utils/getCharCount.js

@@ -1,6 +1,9 @@
-export var getCharCount = function getCharCount(value, limit) {
+const getCharCount = (value, limit) => {
   if (limit && value && value.toString().length > limit) {
-    return undefined;
+    return void 0;
   }
   return value ? value.toString().length : 0;
-};
+};
+export {
+  getCharCount
+};

package/dist/utils/getDefaultTexts.d.ts

@@ -1,2 +1,2 @@
-import { type CodeAreaTexts } from '../CodeArea.types';
+import { CodeAreaTexts } from '../CodeArea.types';
 export declare const getDefaultTexts: (texts?: Partial<CodeAreaTexts>) => CodeAreaTexts;

package/dist/utils/getDefaultTexts.js

@@ -1,20 +1,16 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React from 'react';
-import { FormattedMessage } from 'react-intl';
-export var getDefaultTexts = function getDefaultTexts(texts) {
-  var defaultTexts = {
-    fullscreen: /*#__PURE__*/React.createElement(FormattedMessage, {
-      id: "DS.CODE-AREA.FULLSCREEN",
-      defaultMessage: "Fullscreen"
-    }),
-    closeFullscreen: /*#__PURE__*/React.createElement(FormattedMessage, {
-      id: "DS.CODE-AREA.CLOSE-FULLSCREEN",
-      defaultMessage: "Close fullscreen"
-    }),
-    fullscreenTitle: /*#__PURE__*/React.createElement(FormattedMessage, {
-      id: "DS.CODE-AREA.FULLSCREEN-TITLE",
-      defaultMessage: "Fullscreen editor"
-    })
+import { jsx } from "react/jsx-runtime";
+import { FormattedMessage } from "react-intl";
+const getDefaultTexts = (texts) => {
+  const defaultTexts = {
+    fullscreen: /* @__PURE__ */ jsx(FormattedMessage, { id: "DS.CODE-AREA.FULLSCREEN", defaultMessage: "Fullscreen" }),
+    closeFullscreen: /* @__PURE__ */ jsx(FormattedMessage, { id: "DS.CODE-AREA.CLOSE-FULLSCREEN", defaultMessage: "Close fullscreen" }),
+    fullscreenTitle: /* @__PURE__ */ jsx(FormattedMessage, { id: "DS.CODE-AREA.FULLSCREEN-TITLE", defaultMessage: "Fullscreen editor" })
   };
-  return _extends({}, defaultTexts, texts);
-};
+  return {
+    ...defaultTexts,
+    ...texts
+  };
+};
+export {
+  getDefaultTexts
+};

package/dist/utils/index.js

@@ -1,3 +1,8 @@
-export * from './getDefaultTexts';
-export * from './getCharCount';
-export * from './calculateRequiredSpace';
+import { getDefaultTexts } from "./getDefaultTexts.js";
+import { getCharCount } from "./getCharCount.js";
+import { calculateRequiredSpace } from "./calculateRequiredSpace.js";
+export {
+  calculateRequiredSpace,
+  getCharCount,
+  getDefaultTexts
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-code-area",
-  "version": "1.3.2",
+  "version": "1.3.4",
   "description": "CodeArea UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -16,10 +16,10 @@
     "access": "public"
   },
   "scripts": {
-    "build": "pnpm run build:js && pnpm run build:css && pnpm run defs",
+    "build": "vite build",
     "build:css": "node ../../../scripts/style/less.js",
     "build:js": "babel --delete-dir-on-start --root-mode upward src --out-dir dist --extensions '.js,.ts,.tsx'",
-    "build:watch": "pnpm run build:js -- --watch",
+    "build:watch": "vite build --watch",
     "defs": "tsc --declaration --outDir dist/ --emitDeclarationOnly",
     "pack:ci": "pnpm pack --pack-destination ../../storybook/storybook-static/static",
     "prepublish": "pnpm run build",
@@ -36,15 +36,15 @@
   "types": "dist/index.d.ts",
   "dependencies": {
     "@monaco-editor/react": "4.4.6",
-    "@synerise/ds-button": "^1.5.17",
-    "@synerise/ds-core": "^1.11.0",
-    "@synerise/ds-form-field": "^1.3.9",
-    "@synerise/ds-icon": "^1.15.0",
-    "@synerise/ds-inline-edit": "^1.1.23",
-    "@synerise/ds-loader": "^1.0.13",
-    "@synerise/ds-tooltip": "^1.4.9",
-    "@synerise/ds-typography": "^1.1.12",
-    "@synerise/ds-utils": "^1.7.0"
+    "@synerise/ds-button": "^1.5.19",
+    "@synerise/ds-core": "^1.11.1",
+    "@synerise/ds-form-field": "^1.3.11",
+    "@synerise/ds-icon": "^1.15.2",
+    "@synerise/ds-inline-edit": "^1.1.25",
+    "@synerise/ds-loader": "^1.0.14",
+    "@synerise/ds-tooltip": "^1.4.11",
+    "@synerise/ds-typography": "^1.1.14",
+    "@synerise/ds-utils": "^1.7.1"
   },
   "peerDependencies": {
     "@synerise/ds-core": "*",
@@ -57,5 +57,5 @@
     "monaco-editor": "0.34.1",
     "vitest": "4"
   },
-  "gitHead": "8efc031fa688c0b87c7b3915bae93546bb63bcac"
+  "gitHead": "c2384982c3533a31eb5e5e0408f8dcecb2b0f399"
 }

package/dist/CodeArea.figma.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/CodeArea.figma.js

@@ -1,119 +0,0 @@
-import figma from '@figma/code-connect';
-import CodeArea from './CodeArea';
-var FIGMA_URL = 'https://www.figma.com/design/fsSZONXpVvtrDsCgtu01Jb/Synerise-Design-System?node-id=3143:21126&m=dev';
-figma.connect(CodeArea, FIGMA_URL, {
-  variant: {
-    State: 'Default',
-    Label: 'True',
-    Border: 'True'
-  },
-  example: function example() {
-    return /*#__PURE__*/React.createElement(CodeArea, {
-      label: "Label",
-      description: "Description",
-      currentSyntax: "json",
-      value: ""
-    });
-  }
-});
-figma.connect(CodeArea, FIGMA_URL, {
-  variant: {
-    State: 'Default',
-    Label: 'False',
-    Border: 'True'
-  },
-  example: function example() {
-    return /*#__PURE__*/React.createElement(CodeArea, {
-      currentSyntax: "json",
-      value: ""
-    });
-  }
-});
-figma.connect(CodeArea, FIGMA_URL, {
-  variant: {
-    State: 'Default',
-    Label: 'False',
-    Border: 'False'
-  },
-  example: function example() {
-    return /*#__PURE__*/React.createElement(CodeArea, {
-      currentSyntax: "json",
-      value: "",
-      noBorder: true
-    });
-  }
-});
-figma.connect(CodeArea, FIGMA_URL, {
-  variant: {
-    State: 'Validated',
-    Label: 'True',
-    Border: 'True'
-  },
-  example: function example() {
-    return /*#__PURE__*/React.createElement(CodeArea, {
-      label: "Label",
-      description: "Description",
-      currentSyntax: "json",
-      value: "",
-      errorText: "Fill Code area"
-    });
-  }
-});
-figma.connect(CodeArea, FIGMA_URL, {
-  variant: {
-    State: 'Validated',
-    Label: 'False',
-    Border: 'True'
-  },
-  example: function example() {
-    return /*#__PURE__*/React.createElement(CodeArea, {
-      currentSyntax: "json",
-      value: "",
-      errorText: "Fill Code area"
-    });
-  }
-});
-figma.connect(CodeArea, FIGMA_URL, {
-  variant: {
-    State: 'Validated',
-    Label: 'False',
-    Border: 'False'
-  },
-  example: function example() {
-    return /*#__PURE__*/React.createElement(CodeArea, {
-      currentSyntax: "json",
-      value: "",
-      errorText: "Fill Code area",
-      noBorder: true
-    });
-  }
-});
-figma.connect(CodeArea, FIGMA_URL, {
-  variant: {
-    State: 'Read only',
-    Label: 'False',
-    Border: 'True'
-  },
-  example: function example() {
-    return /*#__PURE__*/React.createElement(CodeArea, {
-      currentSyntax: "json",
-      value: "",
-      readOnly: true
-    });
-  }
-});
-figma.connect(CodeArea, FIGMA_URL, {
-  variant: {
-    State: 'Read only',
-    Label: 'False',
-    Border: 'False'
-  },
-  example: function example() {
-    return /*#__PURE__*/React.createElement(CodeArea, {
-      currentSyntax: "json",
-      value: "",
-      readOnly: true,
-      noBorder: true
-    });
-  }
-});