@elliemae/ds-codeeditor 3.36.0-rc.0 → 3.37.0-next.0
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.
- package/dist/cjs/DSCodeEditor.js +1 -3
- package/dist/cjs/DSCodeEditor.js.map +2 -2
- package/dist/cjs/components/DSCodeEditorForm.js.map +1 -1
- package/dist/cjs/components/DSCodeEditorImpl.js.map +2 -2
- package/dist/esm/DSCodeEditor.js +2 -4
- package/dist/esm/DSCodeEditor.js.map +2 -2
- package/dist/esm/components/DSCodeEditorForm.js.map +1 -1
- package/dist/esm/components/DSCodeEditorImpl.js +1 -1
- package/dist/esm/components/DSCodeEditorImpl.js.map +2 -2
- package/dist/types/DSCodeEditor.d.ts +0 -21
- package/package.json +8 -8
package/dist/cjs/DSCodeEditor.js
CHANGED
|
@@ -93,8 +93,7 @@ const DSCodeEditor = ({
|
|
|
93
93
|
}
|
|
94
94
|
)
|
|
95
95
|
] });
|
|
96
|
-
if (!useModal)
|
|
97
|
-
return editor;
|
|
96
|
+
if (!useModal) return editor;
|
|
98
97
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
99
98
|
import_ds_modal.DSModal,
|
|
100
99
|
{
|
|
@@ -135,7 +134,6 @@ const codeEditorProps = {
|
|
|
135
134
|
showHeader: import_ds_props_helpers.PropTypes.bool.description("show editors header").defaultValue(true),
|
|
136
135
|
showSyntaxChecks: import_ds_props_helpers.PropTypes.bool.description("show syntax warnings and checks").defaultValue(true)
|
|
137
136
|
};
|
|
138
|
-
DSCodeEditor.propTypes = codeEditorProps;
|
|
139
137
|
DSCodeEditor.displayName = "DSCodeEditor";
|
|
140
138
|
const CodeEditorWithSchema = (0, import_ds_props_helpers.describe)(DSCodeEditor);
|
|
141
139
|
CodeEditorWithSchema.propTypes = codeEditorProps;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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 '@elliemae/ds-props-helpers';\nimport { DSModal, modalTypes } from '@elliemae/ds-modal';\nimport
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqCnB;AApCJ,mBAAwC;AACxC,8BAAoC;AACpC,sBAAoC;AACpC,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useState, useRef } from 'react';\nimport { describe, PropTypes } from '@elliemae/ds-props-helpers';\nimport { DSModal, modalTypes } from '@elliemae/ds-modal';\nimport AceEditor from 'react-ace';\nimport DSCodeEditorForm from './components/DSCodeEditorForm.js';\nimport 'ace-builds/src-noconflict/mode-javascript.js';\nimport 'ace-builds/src-noconflict/theme-tomorrow.js';\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 Comp = (AceEditor as any)?.default ?? AceEditor;\n const editor = (\n <>\n {showHeader && <DSCodeEditorForm fileName={fileName} reactAceComponent={reactAceComponent} />}\n <Comp\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('Set of Properties attached to the main container'),\n value: PropTypes.string.description('editors content').isRequired,\n onSave: PropTypes.func.description('function called when the user press save'),\n onClose: PropTypes.func.description('function called when the user closes the modal'),\n onReject: PropTypes.func.description('function called when is rejected'),\n onChange: PropTypes.func.description('function executed when code editor value changes').isRequired,\n isOpen: PropTypes.bool.description('Whether the modal is opened or not').defaultValue(false),\n fileName: PropTypes.string.description('File name to open in the editor'),\n maxLines: PropTypes.number.description('Max lines in the editor content').defaultValue(20),\n minLines: PropTypes.number.description('Min lines in the editor content').defaultValue(20),\n modalTitle: PropTypes.string.description('Modal title').defaultValue('Javascript Editor'),\n confirmLabel: PropTypes.string.description('Customize modal confirm label').defaultValue('Save'),\n rejectLabel: PropTypes.string.description('Customize modal rejection label').defaultValue('Close'),\n modalType: PropTypes.oneOf(modalTypes).description('Modal type').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.description('whether to use code editor inside modal or not').defaultValue(true),\n showHeader: PropTypes.bool.description('show editors header').defaultValue(true),\n showSyntaxChecks: PropTypes.bool.description('show syntax warnings and checks').defaultValue(true),\n};\n\nDSCodeEditor.displayName = 'DSCodeEditor';\nconst CodeEditorWithSchema = describe(DSCodeEditor);\nCodeEditorWithSchema.propTypes = codeEditorProps;\n\nexport { CodeEditorWithSchema, DSCodeEditor };\nexport default DSCodeEditor;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["AceEditor", "DSCodeEditorForm"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/DSCodeEditorForm.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
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 this.searchWord = this.searchWord.bind(this);\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": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgEA;AA9DvB,mBAAiC;AACjC,uBAAyB;AACzB,qBAAoD;AACpD,2BAA6D;AAC7D,sBAAoD;AAEpD,MAAM,YAAY;AAElB,MAAM,EAAE,cAAc,eAAe,QAAI,gDAA0B,SAAS;AAE5E,MAAM,wBAAoB,wCAAkB,KAAK,EAAE,GAAG,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgEA;AA9DvB,mBAAiC;AACjC,uBAAyB;AACzB,qBAAoD;AACpD,2BAA6D;AAC7D,sBAAoD;AAEpD,MAAM,YAAY;AAElB,MAAM,EAAE,cAAc,eAAe,QAAI,gDAA0B,SAAS;AAE5E,MAAM,wBAAoB,wCAAkB,KAAK,EAAE,GAAG,SAAS,gBAAgB;AAE/E,MAAM,yBAAyB,uBAAU;AAAA,EACvC,YAAY,OAAO;AACjB,UAAM,KAAK;AACX,SAAK,QAAQ;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,MACT,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,cAAc;AAAA,MACd,aAAa;AAAA,IACf;AAEA,SAAK,aAAa,KAAK,WAAW,KAAK,IAAI;AAAA,EAC7C;AAAA,EAEA,WAAW,WAAW,KAAK;AACzB,UAAM;AAAA,MACJ,mBAAmB;AAAA,QACjB,SAAS,EAAE,OAAO;AAAA,MACpB;AAAA,IACF,IAAI,KAAK;AACT,UAAM,EAAE,iBAAiB,aAAa,cAAc,YAAY,IAAI,KAAK;AACzE,UAAM,UAAU;AAAA,MACd,WAAW;AAAA,MACX,MAAM;AAAA,MACN,eAAe;AAAA,MACf,WAAW;AAAA,MACX,QAAQ;AAAA,IACV;AACA,WAAO,KAAK,cAAc,OAAO;AACjC,UAAM,kBAAkB,OAAO,gBAAgB;AAC/C,QAAI,aAAa,eAAe,iBAAiB;AAC/C,UAAI,KAAK;AACP,eAAO,QAAQ,cAAc,OAAO;AACpC,eAAO,WAAW,WAAW;AAAA,MAC/B,OAAO;AACL,cAAM,QAAQ,OAAO,UAAU,SAAS;AACxC,eAAO,QAAQ,QAAQ,OAAO,WAAW;AAAA,MAC3C;AAAA,IACF;AAAA,EACF;AAAA,EAEA,SAAS;AACP,UAAM,EAAE,SAAS,IAAI,KAAK;AAE1B,UAAM,EAAE,MAAM,SAAS,iBAAiB,aAAa,cAAc,YAAY,IAAI,KAAK;AACxF,WACE,6CAAC,SAAI,WAAW,GAAG,YAAY,IAC5B;AAAA,iBACC,6CAAC,SAAI,WAAW,eAAe,WAAW,GAAG;AAAA;AAAA,QAChC,6CAAC,UAAK;AAAA;AAAA,UAAE;AAAA,UAAS;AAAA,WAAC;AAAA,SAC/B,IACE;AAAA,MACJ,6CAAC,SAAI,WAAW,eAAe,kBAAkB,GAC9C;AAAA,SAAC,QAAQ,CAAC,UACT,4CAAC,6BAAS,YAAW,aAAY,WAAU,QAAO,SAAS,MAAM,KAAK,SAAS,EAAE,MAAM,KAAK,CAAC,GAAG,MAAK,KAAI,IACvG;AAAA,QACH,CAAC,UACA;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,WAAU;AAAA,YACV,SAAS,MAAM,KAAK,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,YAC9C,MAAK;AAAA;AAAA,QACP,IACE;AAAA,SACN;AAAA,MACC,QAAQ,UACP,6CAAC,+BAAa,WAAW,eAAe,MAAM,GAC5C;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,YAAY;AAAA,YACZ,IAAG;AAAA,YACH,UAAU,CAAC,MAAM,KAAK,SAAS,EAAE,cAAc,EAAE,cAAc,MAAM,CAAC;AAAA,YACtE,aAAY;AAAA,YACZ,gBACE,6CAAC,SAAI,WAAW,eAAe,eAAe,GAC5C;AAAA,0DAAC,6BAAS,MAAM,4CAAC,oCAAiB,GAAI,MAAK,KAAI;AAAA,cAC/C,4CAAC,6BAAS,MAAM,4CAAC,qCAAkB,GAAI,SAAS,MAAM,KAAK,WAAW,GAAG,MAAK,KAAI;AAAA,eACpF;AAAA,YAEF,OAAO;AAAA;AAAA,QACT;AAAA,QACA,6CAAC,qBACC;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,SAAS;AAAA,cACT,IAAG;AAAA,cACH,WAAU;AAAA,cACV,MAAK;AAAA,cACL,UAAU,MAAM,KAAK,SAAS,EAAE,iBAAiB,CAAC,gBAAgB,CAAC;AAAA;AAAA,UACrE;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,SAAS;AAAA,cACT,IAAG;AAAA,cACH,WAAU;AAAA,cACV,MAAK;AAAA,cACL,UAAU,MAAM,KAAK,SAAS,EAAE,aAAa,CAAC,YAAY,CAAC;AAAA;AAAA,UAC7D;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,SAAS;AAAA,cACT,IAAG;AAAA,cACH,WAAU;AAAA,cACV,MAAK;AAAA,cACL,UAAU,MAAM,KAAK,SAAS,EAAE,SAAS,CAAC,QAAQ,CAAC;AAAA;AAAA,UACrD;AAAA,WACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,WAAU;AAAA,YACV,SAAS,MAAM,KAAK,SAAS,EAAE,SAAS,OAAO,MAAM,MAAM,CAAC;AAAA,YAC5D,MAAK;AAAA;AAAA,QACP;AAAA,SACF,IACE;AAAA,MACH,UACC,6CAAC,SAAI,WAAW,eAAe,SAAS,GACtC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,YAAY;AAAA,YACZ,IAAG;AAAA,YACH,UAAU,CAAC,MAAM,KAAK,SAAS,EAAE,aAAa,EAAE,cAAc,MAAM,CAAC;AAAA,YACrE,aAAY;AAAA,YACZ,OAAO;AAAA;AAAA,QACT;AAAA,QACA,6CAAC,SAAI,WAAW,eAAe,cAAc,GAC3C;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,YAAW;AAAA,cACX,WAAU;AAAA,cACV,SAAS,MAAM,KAAK,WAAW,MAAM,KAAK;AAAA,cAC1C,MAAK;AAAA;AAAA,UACP;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,YAAW;AAAA,cACX,WAAU;AAAA,cACV,SAAS,MAAM,KAAK,WAAW,MAAM,IAAI;AAAA,cACzC,MAAK;AAAA;AAAA,UACP;AAAA,WACF;AAAA,SACF,IACE;AAAA,OACN;AAAA,EAEJ;AACF;AAEA,IAAO,2BAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/DSCodeEditorImpl.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { Component } from 'react';\nimport
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADsCjB;AAtCN,mBAAiC;AACjC,
|
|
4
|
+
"sourcesContent": ["import React, { Component } from 'react';\nimport AceEditor from 'react-ace';\nimport { DSModal } from '@elliemae/ds-modal';\nimport DSCodeEditorForm from './DSCodeEditorForm.js';\nimport 'ace-builds/src-noconflict/mode-javascript.js';\nimport 'ace-builds/src-noconflict/theme-tomorrow.js';\n\nclass DSCodeEditorImpl extends Component {\n constructor(props) {\n super(props);\n this.state = {\n value: props.value,\n errors: [],\n };\n this.reactAceComponent = React.createRef();\n }\n\n render() {\n const {\n onSave,\n onClose,\n onReject,\n isOpen,\n fileName,\n confirmLabel,\n maxLines,\n minLines,\n modalTitle,\n modalType,\n rejectLabel,\n size,\n style,\n containerProps,\n } = this.props;\n\n const { value, errors } = this.state;\n const Comp = (AceEditor as any)?.default ?? AceEditor;\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 <DSCodeEditorForm fileName={fileName} reactAceComponent={this.reactAceComponent} />\n <Comp\n ref={this.reactAceComponent}\n editorProps={{ $blockScrolling: true }}\n maxLines={maxLines}\n minLines={minLines}\n mode=\"javascript\"\n name=\"ace-code-edior\"\n onChange={(val) => this.setState({ value: val })}\n onValidate={(annotations) => this.setState({ errors: annotations })}\n theme=\"tomorrow\"\n value={value}\n />\n </DSModal>\n );\n }\n}\n\nexport default DSCodeEditorImpl;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADsCjB;AAtCN,mBAAiC;AACjC,uBAAsB;AACtB,sBAAwB;AACxB,8BAA6B;AAC7B,6BAAO;AACP,4BAAO;AAEP,MAAM,yBAAyB,uBAAU;AAAA,EACvC,YAAY,OAAO;AACjB,UAAM,KAAK;AACX,SAAK,QAAQ;AAAA,MACX,OAAO,MAAM;AAAA,MACb,QAAQ,CAAC;AAAA,IACX;AACA,SAAK,oBAAoB,aAAAA,QAAM,UAAU;AAAA,EAC3C;AAAA,EAEA,SAAS;AACP,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI,KAAK;AAET,UAAM,EAAE,OAAO,OAAO,IAAI,KAAK;AAC/B,UAAM,OAAQ,iBAAAC,SAAmB,WAAW,iBAAAA;AAC5C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAS,MAAM,QAAQ,OAAO,UAAU,MAAM;AAAA,QAC9C,WAAW,MAAM,OAAO,OAAO,UAAU,MAAM;AAAA,QAC/C,UAAU,MAAM,SAAS,OAAO,UAAU,MAAM;AAAA,QAChD;AAAA,QACA;AAAA,QACA;AAAA,QAEA;AAAA,sDAAC,wBAAAC,SAAA,EAAiB,UAAoB,mBAAmB,KAAK,mBAAmB;AAAA,UACjF;AAAA,YAAC;AAAA;AAAA,cACC,KAAK,KAAK;AAAA,cACV,aAAa,EAAE,iBAAiB,KAAK;AAAA,cACrC;AAAA,cACA;AAAA,cACA,MAAK;AAAA,cACL,MAAK;AAAA,cACL,UAAU,CAAC,QAAQ,KAAK,SAAS,EAAE,OAAO,IAAI,CAAC;AAAA,cAC/C,YAAY,CAAC,gBAAgB,KAAK,SAAS,EAAE,QAAQ,YAAY,CAAC;AAAA,cAClE,OAAM;AAAA,cACN;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,IAAO,2BAAQ;",
|
|
6
6
|
"names": ["React", "AceEditor", "DSCodeEditorForm"]
|
|
7
7
|
}
|
package/dist/esm/DSCodeEditor.js
CHANGED
|
@@ -3,7 +3,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { useState, useRef } from "react";
|
|
4
4
|
import { describe, PropTypes } from "@elliemae/ds-props-helpers";
|
|
5
5
|
import { DSModal, modalTypes } from "@elliemae/ds-modal";
|
|
6
|
-
import
|
|
6
|
+
import AceEditor from "react-ace";
|
|
7
7
|
import DSCodeEditorForm from "./components/DSCodeEditorForm.js";
|
|
8
8
|
import "ace-builds/src-noconflict/mode-javascript.js";
|
|
9
9
|
import "ace-builds/src-noconflict/theme-tomorrow.js";
|
|
@@ -58,8 +58,7 @@ const DSCodeEditor = ({
|
|
|
58
58
|
}
|
|
59
59
|
)
|
|
60
60
|
] });
|
|
61
|
-
if (!useModal)
|
|
62
|
-
return editor;
|
|
61
|
+
if (!useModal) return editor;
|
|
63
62
|
return /* @__PURE__ */ jsx(
|
|
64
63
|
DSModal,
|
|
65
64
|
{
|
|
@@ -100,7 +99,6 @@ const codeEditorProps = {
|
|
|
100
99
|
showHeader: PropTypes.bool.description("show editors header").defaultValue(true),
|
|
101
100
|
showSyntaxChecks: PropTypes.bool.description("show syntax warnings and checks").defaultValue(true)
|
|
102
101
|
};
|
|
103
|
-
DSCodeEditor.propTypes = codeEditorProps;
|
|
104
102
|
DSCodeEditor.displayName = "DSCodeEditor";
|
|
105
103
|
const CodeEditorWithSchema = describe(DSCodeEditor);
|
|
106
104
|
CodeEditorWithSchema.propTypes = codeEditorProps;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/DSCodeEditor.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useState, useRef } from 'react';\nimport { describe, PropTypes } from '@elliemae/ds-props-helpers';\nimport { DSModal, modalTypes } from '@elliemae/ds-modal';\nimport
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACqCnB,mBACiB,KADjB;AApCJ,SAAgB,UAAU,cAAc;AACxC,SAAS,UAAU,iBAAiB;AACpC,SAAS,SAAS,kBAAkB;AACpC,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useState, useRef } from 'react';\nimport { describe, PropTypes } from '@elliemae/ds-props-helpers';\nimport { DSModal, modalTypes } from '@elliemae/ds-modal';\nimport AceEditor from 'react-ace';\nimport DSCodeEditorForm from './components/DSCodeEditorForm.js';\nimport 'ace-builds/src-noconflict/mode-javascript.js';\nimport 'ace-builds/src-noconflict/theme-tomorrow.js';\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 Comp = (AceEditor as any)?.default ?? AceEditor;\n const editor = (\n <>\n {showHeader && <DSCodeEditorForm fileName={fileName} reactAceComponent={reactAceComponent} />}\n <Comp\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('Set of Properties attached to the main container'),\n value: PropTypes.string.description('editors content').isRequired,\n onSave: PropTypes.func.description('function called when the user press save'),\n onClose: PropTypes.func.description('function called when the user closes the modal'),\n onReject: PropTypes.func.description('function called when is rejected'),\n onChange: PropTypes.func.description('function executed when code editor value changes').isRequired,\n isOpen: PropTypes.bool.description('Whether the modal is opened or not').defaultValue(false),\n fileName: PropTypes.string.description('File name to open in the editor'),\n maxLines: PropTypes.number.description('Max lines in the editor content').defaultValue(20),\n minLines: PropTypes.number.description('Min lines in the editor content').defaultValue(20),\n modalTitle: PropTypes.string.description('Modal title').defaultValue('Javascript Editor'),\n confirmLabel: PropTypes.string.description('Customize modal confirm label').defaultValue('Save'),\n rejectLabel: PropTypes.string.description('Customize modal rejection label').defaultValue('Close'),\n modalType: PropTypes.oneOf(modalTypes).description('Modal type').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.description('whether to use code editor inside modal or not').defaultValue(true),\n showHeader: PropTypes.bool.description('show editors header').defaultValue(true),\n showSyntaxChecks: PropTypes.bool.description('show syntax warnings and checks').defaultValue(true),\n};\n\nDSCodeEditor.displayName = 'DSCodeEditor';\nconst CodeEditorWithSchema = describe(DSCodeEditor);\nCodeEditorWithSchema.propTypes = codeEditorProps;\n\nexport { CodeEditorWithSchema, DSCodeEditor };\nexport default DSCodeEditor;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/DSCodeEditorForm.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* 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 this.searchWord = this.searchWord.bind(this);\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"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACgEA,SAKX,KALW;AA9DvB,SAAgB,iBAAiB;AACjC,SAAS,gBAAgB;AACzB,SAAS,YAAY,WAAW,oBAAoB;AACpD,SAAS,2BAA2B,yBAAyB;AAC7D,SAAS,kBAAkB,yBAAyB;AAEpD,MAAM,YAAY;AAElB,MAAM,EAAE,cAAc,eAAe,IAAI,0BAA0B,SAAS;AAE5E,MAAM,oBAAoB,kBAAkB,KAAK,EAAE,GAAG,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import React2, { Component } from "react";
|
|
4
|
-
import
|
|
4
|
+
import AceEditor from "react-ace";
|
|
5
5
|
import { DSModal } from "@elliemae/ds-modal";
|
|
6
6
|
import DSCodeEditorForm from "./DSCodeEditorForm.js";
|
|
7
7
|
import "ace-builds/src-noconflict/mode-javascript.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/DSCodeEditorImpl.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { Component } from 'react';\nimport
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACsCjB,SAcE,KAdF;AAtCN,OAAOA,UAAS,iBAAiB;AACjC,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { Component } from 'react';\nimport AceEditor from 'react-ace';\nimport { DSModal } from '@elliemae/ds-modal';\nimport DSCodeEditorForm from './DSCodeEditorForm.js';\nimport 'ace-builds/src-noconflict/mode-javascript.js';\nimport 'ace-builds/src-noconflict/theme-tomorrow.js';\n\nclass DSCodeEditorImpl extends Component {\n constructor(props) {\n super(props);\n this.state = {\n value: props.value,\n errors: [],\n };\n this.reactAceComponent = React.createRef();\n }\n\n render() {\n const {\n onSave,\n onClose,\n onReject,\n isOpen,\n fileName,\n confirmLabel,\n maxLines,\n minLines,\n modalTitle,\n modalType,\n rejectLabel,\n size,\n style,\n containerProps,\n } = this.props;\n\n const { value, errors } = this.state;\n const Comp = (AceEditor as any)?.default ?? AceEditor;\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 <DSCodeEditorForm fileName={fileName} reactAceComponent={this.reactAceComponent} />\n <Comp\n ref={this.reactAceComponent}\n editorProps={{ $blockScrolling: true }}\n maxLines={maxLines}\n minLines={minLines}\n mode=\"javascript\"\n name=\"ace-code-edior\"\n onChange={(val) => this.setState({ value: val })}\n onValidate={(annotations) => this.setState({ errors: annotations })}\n theme=\"tomorrow\"\n value={value}\n />\n </DSModal>\n );\n }\n}\n\nexport default DSCodeEditorImpl;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACsCjB,SAcE,KAdF;AAtCN,OAAOA,UAAS,iBAAiB;AACjC,OAAO,eAAe;AACtB,SAAS,eAAe;AACxB,OAAO,sBAAsB;AAC7B,OAAO;AACP,OAAO;AAEP,MAAM,yBAAyB,UAAU;AAAA,EACvC,YAAY,OAAO;AACjB,UAAM,KAAK;AACX,SAAK,QAAQ;AAAA,MACX,OAAO,MAAM;AAAA,MACb,QAAQ,CAAC;AAAA,IACX;AACA,SAAK,oBAAoBA,OAAM,UAAU;AAAA,EAC3C;AAAA,EAEA,SAAS;AACP,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI,KAAK;AAET,UAAM,EAAE,OAAO,OAAO,IAAI,KAAK;AAC/B,UAAM,OAAQ,WAAmB,WAAW;AAC5C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAS,MAAM,QAAQ,OAAO,UAAU,MAAM;AAAA,QAC9C,WAAW,MAAM,OAAO,OAAO,UAAU,MAAM;AAAA,QAC/C,UAAU,MAAM,SAAS,OAAO,UAAU,MAAM;AAAA,QAChD;AAAA,QACA;AAAA,QACA;AAAA,QAEA;AAAA,8BAAC,oBAAiB,UAAoB,mBAAmB,KAAK,mBAAmB;AAAA,UACjF;AAAA,YAAC;AAAA;AAAA,cACC,KAAK,KAAK;AAAA,cACV,aAAa,EAAE,iBAAiB,KAAK;AAAA,cACrC;AAAA,cACA;AAAA,cACA,MAAK;AAAA,cACL,MAAK;AAAA,cACL,UAAU,CAAC,QAAQ,KAAK,SAAS,EAAE,OAAO,IAAI,CAAC;AAAA,cAC/C,YAAY,CAAC,gBAAgB,KAAK,SAAS,EAAE,QAAQ,YAAY,CAAC;AAAA,cAClE,OAAM;AAAA,cACN;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,IAAO,2BAAQ;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -22,27 +22,6 @@ declare const DSCodeEditor: {
|
|
|
22
22
|
showHeader?: boolean | undefined;
|
|
23
23
|
showSyntaxChecks?: boolean | undefined;
|
|
24
24
|
}): import("react/jsx-runtime.js").JSX.Element;
|
|
25
|
-
propTypes: {
|
|
26
|
-
containerProps: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
27
|
-
value: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
28
|
-
onSave: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
29
|
-
onClose: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
30
|
-
onReject: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
31
|
-
onChange: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
32
|
-
isOpen: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
33
|
-
fileName: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
34
|
-
maxLines: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
35
|
-
minLines: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
36
|
-
modalTitle: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
37
|
-
confirmLabel: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
38
|
-
rejectLabel: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
39
|
-
modalType: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
40
|
-
size: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
41
|
-
style: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
42
|
-
useModal: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
43
|
-
showHeader: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
44
|
-
showSyntaxChecks: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
45
|
-
};
|
|
46
25
|
displayName: string;
|
|
47
26
|
};
|
|
48
27
|
declare const CodeEditorWithSchema: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").DocumentedReactComponent<{
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-codeeditor",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.37.0-next.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Code Editor",
|
|
6
6
|
"files": [
|
|
@@ -38,17 +38,17 @@
|
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"ace-builds": "~1.16.0",
|
|
40
40
|
"react-ace": "~10.1.0",
|
|
41
|
-
"@elliemae/ds-button": "3.
|
|
42
|
-
"@elliemae/ds-classnames": "3.
|
|
43
|
-
"@elliemae/ds-
|
|
44
|
-
"@elliemae/ds-modal": "3.
|
|
45
|
-
"@elliemae/ds-
|
|
46
|
-
"@elliemae/ds-
|
|
41
|
+
"@elliemae/ds-button": "3.37.0-next.0",
|
|
42
|
+
"@elliemae/ds-classnames": "3.37.0-next.0",
|
|
43
|
+
"@elliemae/ds-icons": "3.37.0-next.0",
|
|
44
|
+
"@elliemae/ds-modal": "3.37.0-next.0",
|
|
45
|
+
"@elliemae/ds-form": "3.37.0-next.0",
|
|
46
|
+
"@elliemae/ds-props-helpers": "3.37.0-next.0"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
49
|
"@elliemae/pui-cli": "~9.0.0-next.31",
|
|
50
50
|
"styled-components": "~5.3.9",
|
|
51
|
-
"@elliemae/ds-monorepo-devops": "3.
|
|
51
|
+
"@elliemae/ds-monorepo-devops": "3.37.0-next.0"
|
|
52
52
|
},
|
|
53
53
|
"peerDependencies": {
|
|
54
54
|
"lodash": "^4.17.21",
|