@elliemae/ds-codeeditor 2.2.0-next.3 → 2.3.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,127 +1,131 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var _jsx = require('@babel/runtime/helpers/jsx');
6
- require('core-js/modules/web.dom-collections.iterator.js');
7
- var React = require('react');
8
- var reactDesc = require('react-desc');
9
- var DSModal = require('@elliemae/ds-modal');
10
- var AceEditor = require('react-ace');
11
- var DSCodeEditorForm = require('./components/DSCodeEditorForm.js');
12
- require('brace/mode/javascript.js');
13
- require('brace/theme/tomorrow.js');
14
- var jsxRuntime = require('react/jsx-runtime');
15
-
16
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
17
-
18
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
19
- var DSModal__default = /*#__PURE__*/_interopDefaultLegacy(DSModal);
20
- var AceEditor__default = /*#__PURE__*/_interopDefaultLegacy(AceEditor);
21
-
22
- const DSCodeEditor = _ref => {
23
- let {
24
- containerProps = {},
25
- value: defaultValue = '',
26
- onSave = () => null,
27
- onClose = () => null,
28
- onReject = () => null,
29
- onChange = () => null,
30
- isOpen = false,
31
- fileName = '',
32
- confirmLabel = 'Save',
33
- maxLines = 20,
34
- minLines = 20,
35
- modalTitle = 'Javascript Editor',
36
- modalType = 'confirm',
37
- rejectLabel = 'Close',
38
- size = 'large',
39
- style = {},
40
- useModal = true,
41
- showHeader = true,
42
- showSyntaxChecks = true
43
- } = _ref;
44
- const [{
45
- value,
46
- errors
47
- }, setState] = React.useState({
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var DSCodeEditor_exports = {};
29
+ __export(DSCodeEditor_exports, {
30
+ CodeEditorWithSchema: () => CodeEditorWithSchema,
31
+ default: () => DSCodeEditor_default
32
+ });
33
+ var React = __toESM(require("react"));
34
+ var import_react = __toESM(require("react"));
35
+ var import_react_desc = require("react-desc");
36
+ var import_ds_modal = __toESM(require("@elliemae/ds-modal"));
37
+ var import_react_ace = __toESM(require("react-ace"));
38
+ var import_DSCodeEditorForm = __toESM(require("./components/DSCodeEditorForm"));
39
+ var import_javascript = require("brace/mode/javascript.js");
40
+ var import_tomorrow = require("brace/theme/tomorrow.js");
41
+ const DSCodeEditor = ({
42
+ containerProps = {},
43
+ value: defaultValue = "",
44
+ onSave = () => null,
45
+ onClose = () => null,
46
+ onReject = () => null,
47
+ onChange = () => null,
48
+ isOpen = false,
49
+ fileName = "",
50
+ confirmLabel = "Save",
51
+ maxLines = 20,
52
+ minLines = 20,
53
+ modalTitle = "Javascript Editor",
54
+ modalType = "confirm",
55
+ rejectLabel = "Close",
56
+ size = "large",
57
+ style = {},
58
+ useModal = true,
59
+ showHeader = true,
60
+ showSyntaxChecks = true
61
+ }) => {
62
+ const [{ value, errors }, setState] = (0, import_react.useState)({
48
63
  value: defaultValue,
49
64
  errors: []
50
65
  });
51
- const reactAceComponent = React.useRef();
52
-
53
- const editor = /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
54
- children: [showHeader && /*#__PURE__*/_jsx__default["default"](DSCodeEditorForm, {
55
- fileName: fileName,
56
- reactAceComponent: reactAceComponent
57
- }), /*#__PURE__*/jsxRuntime.jsx(AceEditor__default["default"], {
58
- ref: reactAceComponent,
59
- editorProps: {
60
- $blockScrolling: true
61
- },
62
- maxLines: maxLines,
63
- minLines: minLines,
64
- mode: "javascript",
65
- name: "ace-code-edior",
66
- onChange: val => {
67
- setState({
68
- errors,
69
- value: val
70
- });
71
- onChange(val, errors);
72
- },
73
- onValidate: annotations => setState({
74
- value,
75
- errors: annotations
76
- }),
77
- theme: "tomorrow",
78
- setOptions: {
79
- useWorker: showSyntaxChecks
80
- },
81
- value: value
82
- })]
83
- });
84
-
85
- if (!useModal) return editor;
86
- return /*#__PURE__*/_jsx__default["default"](DSModal__default["default"], {
66
+ const reactAceComponent = (0, import_react.useRef)();
67
+ const editor = /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, showHeader && /* @__PURE__ */ import_react.default.createElement(import_DSCodeEditorForm.default, {
68
+ fileName,
69
+ reactAceComponent
70
+ }), /* @__PURE__ */ import_react.default.createElement(import_react_ace.default, {
71
+ ref: reactAceComponent,
72
+ editorProps: { $blockScrolling: true },
73
+ maxLines,
74
+ minLines,
75
+ mode: "javascript",
76
+ name: "ace-code-edior",
77
+ onChange: (val) => {
78
+ setState({ errors, value: val });
79
+ onChange(val, errors);
80
+ },
81
+ onValidate: (annotations) => setState({ value, errors: annotations }),
82
+ theme: "tomorrow",
83
+ setOptions: {
84
+ useWorker: showSyntaxChecks
85
+ },
86
+ value
87
+ }));
88
+ if (!useModal)
89
+ return editor;
90
+ return /* @__PURE__ */ import_react.default.createElement(import_ds_modal.default, {
87
91
  centered: false,
88
- confirmLabel: confirmLabel,
89
- containerProps: containerProps,
90
- isOpen: isOpen,
91
- modalTitle: modalTitle,
92
- modalType: modalType,
92
+ confirmLabel,
93
+ containerProps,
94
+ isOpen,
95
+ modalTitle,
96
+ modalType,
93
97
  onClose: () => onClose(value, fileName, errors),
94
98
  onConfirm: () => onSave(value, fileName, errors),
95
99
  onReject: () => onReject(value, fileName, errors),
96
- rejectLabel: rejectLabel,
97
- size: size,
98
- style: style
99
- }, void 0, editor);
100
+ rejectLabel,
101
+ size,
102
+ style
103
+ }, editor);
100
104
  };
101
-
102
105
  const codeEditorProps = {
103
- containerProps: reactDesc.PropTypes.object.description('Set of Properties attached to the main container'),
104
- value: reactDesc.PropTypes.string.description('editors content').isRequired,
105
- onSave: reactDesc.PropTypes.func.description('function called when the user press save'),
106
- onClose: reactDesc.PropTypes.func.description('function called when the user closes the modal'),
107
- onReject: reactDesc.PropTypes.func.description('function called when is rejected'),
108
- onChange: reactDesc.PropTypes.func.description('function executed when code editor value changes').isRequired,
109
- isOpen: reactDesc.PropTypes.bool.description('Whether the modal is opened or not').defaultValue(false),
110
- fileName: reactDesc.PropTypes.string.description('File name to open in the editor'),
111
- maxLines: reactDesc.PropTypes.number.description('Max lines in the editor content').defaultValue(20),
112
- minLines: reactDesc.PropTypes.number.description('Min lines in the editor content').defaultValue(20),
113
- modalTitle: reactDesc.PropTypes.string.description('Modal title').defaultValue('Javascript Editor'),
114
- confirmLabel: reactDesc.PropTypes.string.description('Customize modal confirm label').defaultValue('Save'),
115
- rejectLabel: reactDesc.PropTypes.string.description('Customize modal rejection label').defaultValue('Close'),
116
- modalType: reactDesc.PropTypes.oneOf(DSModal.modalTypes).description('Modal type').defaultValue('confirm'),
117
- size: reactDesc.PropTypes.oneOf(['xsmall', 'small', 'medium', 'large', 'xlarge']).description('modal size').defaultValue('large'),
118
- style: reactDesc.PropTypes.object.description('css inline style'),
119
- useModal: reactDesc.PropTypes.bool.description('whether to use code editor inside modal or not').defaultValue(true),
120
- showHeader: reactDesc.PropTypes.bool.description('show editors header').defaultValue(true),
121
- showSyntaxChecks: reactDesc.PropTypes.bool.description('show syntax warnings and checks').defaultValue(true)
106
+ containerProps: import_react_desc.PropTypes.object.description("Set of Properties attached to the main container"),
107
+ value: import_react_desc.PropTypes.string.description("editors content").isRequired,
108
+ onSave: import_react_desc.PropTypes.func.description("function called when the user press save"),
109
+ onClose: import_react_desc.PropTypes.func.description("function called when the user closes the modal"),
110
+ onReject: import_react_desc.PropTypes.func.description("function called when is rejected"),
111
+ onChange: import_react_desc.PropTypes.func.description("function executed when code editor value changes").isRequired,
112
+ isOpen: import_react_desc.PropTypes.bool.description("Whether the modal is opened or not").defaultValue(false),
113
+ fileName: import_react_desc.PropTypes.string.description("File name to open in the editor"),
114
+ maxLines: import_react_desc.PropTypes.number.description("Max lines in the editor content").defaultValue(20),
115
+ minLines: import_react_desc.PropTypes.number.description("Min lines in the editor content").defaultValue(20),
116
+ modalTitle: import_react_desc.PropTypes.string.description("Modal title").defaultValue("Javascript Editor"),
117
+ confirmLabel: import_react_desc.PropTypes.string.description("Customize modal confirm label").defaultValue("Save"),
118
+ rejectLabel: import_react_desc.PropTypes.string.description("Customize modal rejection label").defaultValue("Close"),
119
+ modalType: import_react_desc.PropTypes.oneOf(import_ds_modal.modalTypes).description("Modal type").defaultValue("confirm"),
120
+ size: import_react_desc.PropTypes.oneOf(["xsmall", "small", "medium", "large", "xlarge"]).description("modal size").defaultValue("large"),
121
+ style: import_react_desc.PropTypes.object.description("css inline style"),
122
+ useModal: import_react_desc.PropTypes.bool.description("whether to use code editor inside modal or not").defaultValue(true),
123
+ showHeader: import_react_desc.PropTypes.bool.description("show editors header").defaultValue(true),
124
+ showSyntaxChecks: import_react_desc.PropTypes.bool.description("show syntax warnings and checks").defaultValue(true)
122
125
  };
123
- const CodeEditorWithSchema = reactDesc.describe(DSCodeEditor);
126
+ DSCodeEditor.propTypes = codeEditorProps;
127
+ const CodeEditorWithSchema = (0, import_react_desc.describe)(DSCodeEditor);
124
128
  CodeEditorWithSchema.propTypes = codeEditorProps;
125
-
126
- exports.CodeEditorWithSchema = CodeEditorWithSchema;
127
- exports["default"] = DSCodeEditor;
129
+ var DSCodeEditor_default = DSCodeEditor;
130
+ module.exports = __toCommonJS(DSCodeEditor_exports);
131
+ //# sourceMappingURL=DSCodeEditor.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/DSCodeEditor.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useState, useRef } from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport DSModal, { modalTypes } from '@elliemae/ds-modal';\nimport AceEditor from 'react-ace';\nimport DSCodeEditorForm from './components/DSCodeEditorForm';\nimport 'brace/mode/javascript.js';\nimport 'brace/theme/tomorrow.js';\n\nconst DSCodeEditor = ({\n containerProps = {},\n value: defaultValue = '',\n onSave = () => null,\n onClose = () => null,\n onReject = () => null,\n onChange = () => null,\n isOpen = false,\n fileName = '',\n confirmLabel = 'Save',\n maxLines = 20,\n minLines = 20,\n modalTitle = 'Javascript Editor',\n modalType = 'confirm',\n rejectLabel = 'Close',\n size = 'large',\n style = {},\n useModal = true,\n showHeader = true,\n showSyntaxChecks = true,\n}) => {\n const [{ value, errors }, setState] = useState({\n value: defaultValue,\n errors: [],\n });\n const reactAceComponent = useRef();\n\n const editor = (\n <>\n {showHeader && (\n <DSCodeEditorForm\n fileName={fileName}\n reactAceComponent={reactAceComponent}\n />\n )}\n <AceEditor\n ref={reactAceComponent}\n editorProps={{ $blockScrolling: true }}\n maxLines={maxLines}\n minLines={minLines}\n mode=\"javascript\"\n name=\"ace-code-edior\"\n onChange={(val) => {\n setState({ errors, value: val });\n onChange(val, errors);\n }}\n onValidate={(annotations) => setState({ value, errors: annotations })}\n theme=\"tomorrow\"\n setOptions={{\n useWorker: showSyntaxChecks,\n }}\n value={value}\n />\n </>\n );\n if (!useModal) return editor;\n return (\n <DSModal\n centered={false}\n confirmLabel={confirmLabel}\n containerProps={containerProps}\n isOpen={isOpen}\n modalTitle={modalTitle}\n modalType={modalType}\n onClose={() => onClose(value, fileName, errors)}\n onConfirm={() => onSave(value, fileName, errors)}\n onReject={() => onReject(value, fileName, errors)}\n rejectLabel={rejectLabel}\n size={size}\n style={style}\n >\n {editor}\n </DSModal>\n );\n};\n\nconst codeEditorProps = {\n containerProps: PropTypes.object.description(\n 'Set of Properties attached to the main container',\n ),\n value: PropTypes.string.description('editors content').isRequired,\n onSave: PropTypes.func.description(\n 'function called when the user press save',\n ),\n onClose: PropTypes.func.description(\n 'function called when the user closes the modal',\n ),\n onReject: PropTypes.func.description('function called when is rejected'),\n onChange: PropTypes.func.description(\n 'function executed when code editor value changes',\n ).isRequired,\n isOpen: PropTypes.bool\n .description('Whether the modal is opened or not')\n .defaultValue(false),\n fileName: PropTypes.string.description('File name to open in the editor'),\n maxLines: PropTypes.number\n .description('Max lines in the editor content')\n .defaultValue(20),\n minLines: PropTypes.number\n .description('Min lines in the editor content')\n .defaultValue(20),\n modalTitle: PropTypes.string\n .description('Modal title')\n .defaultValue('Javascript Editor'),\n confirmLabel: PropTypes.string\n .description('Customize modal confirm label')\n .defaultValue('Save'),\n rejectLabel: PropTypes.string\n .description('Customize modal rejection label')\n .defaultValue('Close'),\n modalType: PropTypes.oneOf(modalTypes)\n .description('Modal type')\n .defaultValue('confirm'),\n size: PropTypes.oneOf(['xsmall', 'small', 'medium', 'large', 'xlarge'])\n .description('modal size')\n .defaultValue('large'),\n style: PropTypes.object.description('css inline style'),\n useModal: PropTypes.bool\n .description('whether to use code editor inside modal or not')\n .defaultValue(true),\n showHeader: PropTypes.bool\n .description('show editors header')\n .defaultValue(true),\n showSyntaxChecks: PropTypes.bool\n .description('show syntax warnings and checks')\n .defaultValue(true),\n};\n\nDSCodeEditor.propTypes = codeEditorProps;\n\nconst CodeEditorWithSchema = describe(DSCodeEditor);\nCodeEditorWithSchema.propTypes = codeEditorProps;\n\nexport { CodeEditorWithSchema };\nexport default DSCodeEditor;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }
@@ -1,31 +1,44 @@
1
- 'use strict';
2
-
3
- var _jsx = require('@babel/runtime/helpers/jsx');
4
- require('core-js/modules/esnext.async-iterator.find.js');
5
- require('core-js/modules/esnext.iterator.constructor.js');
6
- require('core-js/modules/esnext.iterator.find.js');
7
- require('core-js/modules/es.string.replace.js');
8
- require('core-js/modules/es.string.replace-all.js');
9
- var React = require('react');
10
- var DSButton = require('@elliemae/ds-button');
11
- var dsForm = require('@elliemae/ds-form');
12
- var dsClassnames = require('@elliemae/ds-classnames');
13
- var dsIcons = require('@elliemae/ds-icons');
14
-
15
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
16
-
17
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
18
- var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
19
-
20
- var _DSButton, _ChevronSmallRight;
21
- const blockName = 'code-editor';
22
- const {
23
- cssClassName,
24
- classNameBlock
25
- } = dsClassnames.convertPropToCssClassName(blockName);
26
- const CheckOptionsGroup = dsClassnames.aggregatedClasses('div')("".concat(blockName, "-options-group"));
27
-
28
- class DSCodeEditorForm extends React.Component {
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var DSCodeEditorForm_exports = {};
29
+ __export(DSCodeEditorForm_exports, {
30
+ default: () => DSCodeEditorForm_default
31
+ });
32
+ var React = __toESM(require("react"));
33
+ var import_react = __toESM(require("react"));
34
+ var import_ds_button = __toESM(require("@elliemae/ds-button"));
35
+ var import_ds_form = require("@elliemae/ds-form");
36
+ var import_ds_classnames = require("@elliemae/ds-classnames");
37
+ var import_ds_icons = require("@elliemae/ds-icons");
38
+ const blockName = "code-editor";
39
+ const { cssClassName, classNameBlock } = (0, import_ds_classnames.convertPropToCssClassName)(blockName);
40
+ const CheckOptionsGroup = (0, import_ds_classnames.aggregatedClasses)("div")(`${blockName}-options-group`);
41
+ class DSCodeEditorForm extends import_react.Component {
29
42
  constructor(props) {
30
43
  super(props);
31
44
  this.state = {
@@ -33,25 +46,17 @@ class DSCodeEditorForm extends React.Component {
33
46
  replace: false,
34
47
  isCaseSensitive: false,
35
48
  isWholeWord: false,
36
- filteredText: '',
37
- replaceText: ''
49
+ filteredText: "",
50
+ replaceText: ""
38
51
  };
39
52
  }
40
-
41
53
  searchWord(isReplace, all) {
42
54
  const {
43
55
  reactAceComponent: {
44
- current: {
45
- editor
46
- }
56
+ current: { editor }
47
57
  }
48
58
  } = this.props;
49
- const {
50
- isCaseSensitive,
51
- isWholeWord,
52
- filteredText,
53
- replaceText
54
- } = this.state;
59
+ const { isCaseSensitive, isWholeWord, filteredText, replaceText } = this.state;
55
60
  const options = {
56
61
  backwards: false,
57
62
  wrap: true,
@@ -61,7 +66,6 @@ class DSCodeEditorForm extends React.Component {
61
66
  };
62
67
  editor.find(filteredText, options);
63
68
  const selectedContent = editor.getSelectedText();
64
-
65
69
  if (isReplace && replaceText && selectedContent) {
66
70
  if (all) {
67
71
  editor.findAll(filteredText, options);
@@ -72,118 +76,91 @@ class DSCodeEditorForm extends React.Component {
72
76
  }
73
77
  }
74
78
  }
75
-
76
79
  render() {
77
- const {
78
- fileName
79
- } = this.props;
80
- const {
81
- find,
82
- replace,
83
- isCaseSensitive,
84
- isWholeWord,
85
- filteredText,
86
- replaceText
87
- } = this.state;
88
- return /*#__PURE__*/_jsx__default["default"]("div", {
89
- className: "".concat(cssClassName)
90
- }, void 0, fileName ? /*#__PURE__*/_jsx__default["default"]("div", {
91
- className: classNameBlock('file-name')
92
- }, void 0, "File Name: ", /*#__PURE__*/_jsx__default["default"]("span", {}, void 0, " ", fileName, " ")) : null, /*#__PURE__*/_jsx__default["default"]("div", {
93
- className: classNameBlock('find-replace-btn')
94
- }, void 0, !find && !replace ? /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
80
+ const { fileName } = this.props;
81
+ const { find, replace, isCaseSensitive, isWholeWord, filteredText, replaceText } = this.state;
82
+ return /* @__PURE__ */ import_react.default.createElement("div", {
83
+ className: `${cssClassName}`
84
+ }, fileName ? /* @__PURE__ */ import_react.default.createElement("div", {
85
+ className: classNameBlock("file-name")
86
+ }, "File Name: ", /* @__PURE__ */ import_react.default.createElement("span", null, " ", fileName, " ")) : null, /* @__PURE__ */ import_react.default.createElement("div", {
87
+ className: classNameBlock("find-replace-btn")
88
+ }, !find && !replace ? /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
95
89
  buttonType: "secondary",
96
90
  labelText: "Find",
97
- onClick: () => this.setState({
98
- find: true
99
- }),
91
+ onClick: () => this.setState({ find: true }),
100
92
  size: "m"
101
- }) : null, !replace ? /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
93
+ }) : null, !replace ? /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
102
94
  buttonType: "secondary",
103
95
  labelText: "Find & Replace",
104
- onClick: () => this.setState({
105
- replace: true
106
- }),
96
+ onClick: () => this.setState({ replace: true }),
107
97
  size: "m"
108
- }) : null), find || replace ? /*#__PURE__*/_jsx__default["default"](dsForm.DSInputGroup, {
109
- className: classNameBlock('find')
110
- }, void 0, /*#__PURE__*/_jsx__default["default"](dsForm.DSTextBox, {
98
+ }) : null), find || replace ? /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSInputGroup, {
99
+ className: classNameBlock("find")
100
+ }, /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSTextBox, {
111
101
  className: "find-word",
112
102
  fluidWidth: false,
113
103
  id: "find-textbox",
114
- onChange: e => this.setState({
115
- filteredText: e.currentTarget.value
116
- }),
104
+ onChange: (e) => this.setState({ filteredText: e.currentTarget.value }),
117
105
  placeholder: "Find",
118
- rightComponent: /*#__PURE__*/_jsx__default["default"]("div", {
119
- className: classNameBlock('next-back-btn')
120
- }, void 0, _DSButton || (_DSButton = /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
121
- icon: /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallLeft, {}),
106
+ rightComponent: /* @__PURE__ */ import_react.default.createElement("div", {
107
+ className: classNameBlock("next-back-btn")
108
+ }, /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
109
+ icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ChevronSmallLeft, null),
122
110
  size: "m"
123
- })), /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
124
- icon: _ChevronSmallRight || (_ChevronSmallRight = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallRight, {})),
111
+ }), /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
112
+ icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ChevronSmallRight, null),
125
113
  onClick: () => this.searchWord(),
126
114
  size: "m"
127
115
  })),
128
116
  value: filteredText
129
- }), /*#__PURE__*/_jsx__default["default"](CheckOptionsGroup, {}, void 0, /*#__PURE__*/_jsx__default["default"](dsForm.DSCheckbox, {
117
+ }), /* @__PURE__ */ import_react.default.createElement(CheckOptionsGroup, null, /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSCheckbox, {
130
118
  checked: isCaseSensitive,
131
119
  id: "case-sensitive-check",
132
120
  labelText: "Case Sensitive",
133
121
  name: "case-sensitive-check",
134
- onChange: () => this.setState({
135
- isCaseSensitive: !isCaseSensitive
136
- })
137
- }), /*#__PURE__*/_jsx__default["default"](dsForm.DSCheckbox, {
122
+ onChange: () => this.setState({ isCaseSensitive: !isCaseSensitive })
123
+ }), /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSCheckbox, {
138
124
  checked: isWholeWord,
139
125
  id: "whole-word-check",
140
126
  labelText: "Whole Word",
141
127
  name: "whole-word-check",
142
- onChange: () => this.setState({
143
- isWholeWord: !isWholeWord
144
- })
145
- }), /*#__PURE__*/_jsx__default["default"](dsForm.DSCheckbox, {
128
+ onChange: () => this.setState({ isWholeWord: !isWholeWord })
129
+ }), /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSCheckbox, {
146
130
  checked: replace,
147
131
  id: "replace-check",
148
132
  labelText: "Replace",
149
133
  name: "replace-check",
150
- onChange: () => this.setState({
151
- replace: !replace
152
- })
153
- })), /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
134
+ onChange: () => this.setState({ replace: !replace })
135
+ })), /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
154
136
  buttonType: "secondary",
155
137
  labelText: "Done",
156
- onClick: () => this.setState({
157
- replace: false,
158
- find: false
159
- }),
138
+ onClick: () => this.setState({ replace: false, find: false }),
160
139
  size: "m"
161
- })) : null, replace ? /*#__PURE__*/_jsx__default["default"]("div", {
162
- className: classNameBlock('replace')
163
- }, void 0, /*#__PURE__*/_jsx__default["default"](dsForm.DSTextBox, {
140
+ })) : null, replace ? /* @__PURE__ */ import_react.default.createElement("div", {
141
+ className: classNameBlock("replace")
142
+ }, /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSTextBox, {
164
143
  className: "find-word",
165
144
  fluidWidth: false,
166
145
  id: "replace-textbox",
167
- onChange: e => this.setState({
168
- replaceText: e.currentTarget.value
169
- }),
146
+ onChange: (e) => this.setState({ replaceText: e.currentTarget.value }),
170
147
  placeholder: "Replace",
171
148
  value: replaceText
172
- }), /*#__PURE__*/_jsx__default["default"]("div", {
173
- className: classNameBlock('replace-btns')
174
- }, void 0, /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
149
+ }), /* @__PURE__ */ import_react.default.createElement("div", {
150
+ className: classNameBlock("replace-btns")
151
+ }, /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
175
152
  buttonType: "secondary",
176
153
  labelText: "Replace",
177
154
  onClick: () => this.searchWord(true, false),
178
155
  size: "m"
179
- }), /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
156
+ }), /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
180
157
  buttonType: "secondary",
181
158
  labelText: "Replace All",
182
159
  onClick: () => this.searchWord(true, true),
183
160
  size: "m"
184
161
  }))) : null);
185
162
  }
186
-
187
163
  }
188
-
189
- module.exports = DSCodeEditorForm;
164
+ var DSCodeEditorForm_default = DSCodeEditorForm;
165
+ module.exports = __toCommonJS(DSCodeEditorForm_exports);
166
+ //# sourceMappingURL=DSCodeEditorForm.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/components/DSCodeEditorForm.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable react/prop-types */\n/* eslint-disable max-lines */\nimport React, { Component } from 'react';\nimport DSButton from '@elliemae/ds-button';\nimport { DSCheckbox, DSTextBox, DSInputGroup } from '@elliemae/ds-form';\nimport { convertPropToCssClassName, aggregatedClasses } from '@elliemae/ds-classnames';\nimport { ChevronSmallLeft, ChevronSmallRight } from '@elliemae/ds-icons';\n\nconst blockName = 'code-editor';\n\nconst { cssClassName, classNameBlock } = convertPropToCssClassName(blockName);\n\nconst CheckOptionsGroup = aggregatedClasses('div')(`${blockName}-options-group`);\n\nclass DSCodeEditorForm extends Component {\n constructor(props) {\n super(props);\n this.state = {\n find: false,\n replace: false,\n isCaseSensitive: false,\n isWholeWord: false,\n filteredText: '',\n replaceText: '',\n };\n }\n\n searchWord(isReplace, all) {\n const {\n reactAceComponent: {\n current: { editor },\n },\n } = this.props;\n const { isCaseSensitive, isWholeWord, filteredText, replaceText } = this.state;\n const options = {\n backwards: false,\n wrap: true,\n caseSensitive: isCaseSensitive,\n wholeWord: isWholeWord,\n regExp: true,\n };\n editor.find(filteredText, options);\n const selectedContent = editor.getSelectedText();\n if (isReplace && replaceText && selectedContent) {\n if (all) {\n editor.findAll(filteredText, options);\n editor.replaceAll(replaceText);\n } else {\n const range = editor.selection.getRange();\n editor.session.replace(range, replaceText);\n }\n }\n }\n\n render() {\n const { fileName } = this.props;\n\n const { find, replace, isCaseSensitive, isWholeWord, filteredText, replaceText } = this.state;\n return (\n <div className={`${cssClassName}`}>\n {fileName ? (\n <div className={classNameBlock('file-name')}>\n File Name: <span> {fileName} </span>\n </div>\n ) : null}\n <div className={classNameBlock('find-replace-btn')}>\n {!find && !replace ? (\n <DSButton buttonType=\"secondary\" labelText=\"Find\" onClick={() => this.setState({ find: true })} size=\"m\" />\n ) : null}\n {!replace ? (\n <DSButton\n buttonType=\"secondary\"\n labelText=\"Find & Replace\"\n onClick={() => this.setState({ replace: true })}\n size=\"m\"\n />\n ) : null}\n </div>\n {find || replace ? (\n <DSInputGroup className={classNameBlock('find')}>\n <DSTextBox\n className=\"find-word\"\n fluidWidth={false}\n id=\"find-textbox\"\n onChange={(e) => this.setState({ filteredText: e.currentTarget.value })}\n placeholder=\"Find\"\n rightComponent={\n <div className={classNameBlock('next-back-btn')}>\n <DSButton icon={<ChevronSmallLeft />} size=\"m\" />\n <DSButton icon={<ChevronSmallRight />} onClick={() => this.searchWord()} size=\"m\" />\n </div>\n }\n value={filteredText}\n />\n <CheckOptionsGroup>\n <DSCheckbox\n checked={isCaseSensitive}\n id=\"case-sensitive-check\"\n labelText=\"Case Sensitive\"\n name=\"case-sensitive-check\"\n onChange={() => this.setState({ isCaseSensitive: !isCaseSensitive })}\n />\n <DSCheckbox\n checked={isWholeWord}\n id=\"whole-word-check\"\n labelText=\"Whole Word\"\n name=\"whole-word-check\"\n onChange={() => this.setState({ isWholeWord: !isWholeWord })}\n />\n <DSCheckbox\n checked={replace}\n id=\"replace-check\"\n labelText=\"Replace\"\n name=\"replace-check\"\n onChange={() => this.setState({ replace: !replace })}\n />\n </CheckOptionsGroup>\n <DSButton\n buttonType=\"secondary\"\n labelText=\"Done\"\n onClick={() => this.setState({ replace: false, find: false })}\n size=\"m\"\n />\n </DSInputGroup>\n ) : null}\n {replace ? (\n <div className={classNameBlock('replace')}>\n <DSTextBox\n className=\"find-word\"\n fluidWidth={false}\n id=\"replace-textbox\"\n onChange={(e) => this.setState({ replaceText: e.currentTarget.value })}\n placeholder=\"Replace\"\n value={replaceText}\n />\n <div className={classNameBlock('replace-btns')}>\n <DSButton\n buttonType=\"secondary\"\n labelText=\"Replace\"\n onClick={() => this.searchWord(true, false)}\n size=\"m\"\n />\n <DSButton\n buttonType=\"secondary\"\n labelText=\"Replace All\"\n onClick={() => this.searchWord(true, true)}\n size=\"m\"\n />\n </div>\n </div>\n ) : null}\n </div>\n );\n }\n}\n\nexport default DSCodeEditorForm;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }