suneditor 3.0.0-alpha.9 → 3.0.0-beta.2

package/package.json

@@ -1,10 +1,11 @@
 {
 	"name": "suneditor",
-	"version": "3.0.0-alpha.9",
+	"version": "3.0.0-beta.2",
 	"description": "Vanilla javascript based WYSIWYG web editor",
 	"author": "Yi JiHong",
 	"license": "MIT",
 	"main": "src/suneditor.js",
+	"types": "types/index.d.ts",
 	"sideEffects": [
 		"./src/assets/css/*.css"
 	],
@@ -18,8 +19,10 @@
 		"build:prod": "cross-env NODE_ENV=production webpack --config webpack/builder.js",
 		"lint": "eslint src",
 		"lint:fix-js": "npx eslint \"src/**/*.js\" --fix",
-		"lint:fix-ts": "npx eslint \"typings/**/*.ts\" --fix",
-		"lint:fix-all": "npx eslint \"src/**/*.js\" \"typings/**/*.ts\" --fix",
+		"lint:fix-ts": "npx eslint \"types/**/*.ts\" --fix",
+		"lint:fix-all": "npx eslint \"src/**/*.js\" \"types/**/*.ts\" --fix",
+		"ts-build": "(npx tsc || true) && barrelsby --delete --directory types --exclude \"typedef.d.ts\" && node scripts/fix-langs.cjs && node scripts/wrap-dts.cjs && node scripts/rename-index.cjs && node scripts/remove-this-params.cjs && npm run lint:fix-ts",
+		"i18n-build": "cross-env GOOGLE_APPLICATION_CREDENTIALS=./.env/google-api-service-account.json node scripts/i18n-sync.cjs --auto-translate && npx eslint \"src/langs/*.js\" --fix && npx eslint \"types/langs/_Lang.d.ts\" --fix",
 		"test": "karma start",
 		"update-browserslist": "npx browserslist@latest --update-db"
 	},
@@ -31,19 +34,17 @@
 		"type": "git",
 		"url": "https://github.com/JiHong88/SunEditor.git"
 	},
-	"ignore": [
-		"**/.*",
-		"node_modules"
-	],
-	"types": "typings/index.d.ts",
 	"devDependencies": {
 		"@babel/core": "^7.22.1",
 		"@codemirror/lang-html": "^6.4.3",
 		"@codemirror/lang-javascript": "^6.1.8",
-		"@typescript-eslint/eslint-plugin": "^7.1.1",
-		"@typescript-eslint/parser": "^7.1.1",
+		"@google-cloud/translate": "^9.0.1",
+		"@octokit/rest": "^21.1.1",
+		"@typescript-eslint/eslint-plugin": "^8.29.1",
+		"@typescript-eslint/parser": "^8.29.1",
 		"@webpack-cli/serve": "^2.0.4",
 		"babel-loader": "^9.1.2",
+		"barrelsby": "^2.8.1",
 		"clean-webpack-plugin": "^4.0.0",
 		"codemirror": "^6.0.1",
 		"codemirror5": "npm:codemirror@^5.65.9",
@@ -55,10 +56,10 @@
 		"eslint-plugin-compat": "^4.2.0",
 		"eslint-plugin-prettier": "^4.2.1",
 		"file-loader": "^6.2.0",
+		"glob": "^11.0.1",
 		"html-webpack-plugin": "^5.5.1",
-		"html2canvas": "^1.4.1",
 		"jasmine": "^5.0.0",
-		"jspdf": "^2.5.1",
+		"jsdoc": "^4.0.4",
 		"karma": "^6.4.2",
 		"karma-chrome-launcher": "^3.2.0",
 		"karma-firefox-launcher": "^2.1.2",
@@ -67,8 +68,11 @@
 		"karma-safari-launcher": "^1.0.0",
 		"karma-webpack": "^5.0.0",
 		"katex": "^0.16.7",
+		"mathjax-full": "^3.2.2",
 		"mini-css-extract-plugin": "^2.7.6",
 		"prettier": "^2.8.8",
+		"terser-webpack-plugin": "^5.3.10",
+		"typescript": "^5.8.3",
 		"url-loader": "^4.1.1",
 		"webpack": "^5.84.1",
 		"webpack-cli": "^5.1.1",
@@ -76,23 +80,45 @@
 		"webpack-merge": "^5.9.0"
 	},
 	"browserslist": [
-		"last 2 versions",
-		"not dead",
-		"not < 1%",
-		"not ie <= 11"
+		"chrome >= 80",
+		"edge >= 80",
+		"firefox >= 74",
+		"safari >= 13.1",
+		"ios >= 13.4",
+		"opera >= 67",
+		"android >= 80",
+		"samsung >= 13",
+		"not IE <= 11",
+		"not dead"
+	],
+	"ignore": [
+		"**/.*",
+		"node_modules"
+	],
+	"files": [
+		"src",
+		"types",
+		"dist",
+		"README.md",
+		"CONTRIBUTING.md",
+		"LICENSE"
 	],
 	"keywords": [
 		"wysiwyg",
 		"wysiwyg editor",
 		"wysiwyg html editor",
 		"rich text",
-		"rich editor",
 		"rich text editor",
-		"html",
-		"text",
+		"rich editor",
+		"html editor",
+		"text editor",
 		"editor",
+		"javascript editor",
+		"vanilla javascript",
 		"contenteditable",
-		"javascript",
-		"vanillajs"
+		"lightweight editor",
+		"text formatting",
+		"web editor",
+		"browser editor"
 	]
 }

package/src/assets/design/color.css

@@ -0,0 +1,121 @@
+.sun-editor,
+.sun-editor-editable {
+	/** --------------------------- content - [colors] ----------- */
+	--se-caret-color: #333;
+	--se-placeholder-color: #bbb;
+	--se-edit-font-color: #333;
+	--se-edit-font-pre: #666;
+	--se-edit-font-quote: #999;
+	--se-edit-background-color: #fff;
+	--se-edit-background-pre: #f9f9f9;
+	--se-edit-border-light: #e1e1e1;
+	--se-edit-border-dark: #b1b1b1;
+	--se-edit-border-dark-n1: #c1c1c1;
+	--se-edit-border-dark-n2: #d1d1d1;
+	--se-edit-anchor: #0056b3;
+	--se-edit-anchor-on-back: #e8f7ff;
+	--se-edit-anchor-on-font: #0093ff;
+	--se-edit-hr-color: #333;
+	--se-edit-hr-on-back: #c7deff;
+	--se-edit-active: #4592ff;
+	--se-edit-hover: #e0f4ff;
+	--se-edit-outline: #9e9e9e;
+
+	/** --------------------------- layout - [colors] ----------- */
+	/** main, common */
+	--se-main-out-color: #dadada;
+	--se-main-color: #000;
+	--se-main-color-lighter: #4c4c4d;
+	--se-main-background-color: #fff;
+	--se-code-view-color: #f5f5f5;
+	--se-main-font-color: #333;
+	--se-code-view-background-color: #222;
+	--se-main-divider-color: #e1e1e1;
+	--se-main-border-color: #d1d1d1;
+	--se-main-outline-color: #b1b1b1;
+	--se-main-shadow-color: #ececec;
+	--se-statusbar-font-color: #666;
+	--se-overlay-background-color: #222;
+
+	/* hover, active */
+	--se-active-color: #5cd2e6;
+	--se-active-dark-color: #80bdff;
+	--se-active-dark2-color: #407dd1;
+	--se-active-dark3-color: #4592ff;
+	--se-active-dark4-color: #3f9dff;
+	--se-active-dark5-color: #1275ff;
+	--se-active-light-color: #e6f2ff;
+	--se-active-light2-color: #eaf3ff;
+	--se-active-light3-color: #d0e3ff;
+	--se-active-light4-color: #dbeaff;
+	--se-active-light5-color: #c4ddff;
+	--se-active-light6-color: #b7ccf2;
+
+	/* [toolbar, menu, modal] layer - shadow */
+	--se-shadow-layer-color: rgba(0, 0, 0, 0.25);
+
+	/* drag */
+	--se-drag-over-color: #f0c20a;
+
+	/* modal, browser, dropdown */
+	--se-modal-background-color: #f9f9f9;
+	--se-modal-color: #333;
+	--se-modal-border-color: #e5e5e5;
+	--se-modal-anchor-color: #004cff;
+	--se-modal-preview-color: #666;
+	--se-modal-file-input-background-color: #f9f9f9;
+	--se-modal-input-disabled-color: #999;
+	--se-modal-input-disabled-background-color: #f3f3f3;
+
+	/* dropdown, selectMenu */
+	--se-dropdown-font-color: #555;
+
+	/* controller */
+	--se-controller-border-color: #999;
+	--se-controller-background-color: #f9f9f9;
+	--se-controller-color: #333;
+	--se-shadow-controller-color: rgba(0, 0, 0, 0.2);
+
+	/* button : input-side */
+	--se-input-btn-border-color: #ccc;
+	--se-input-btn-disabled-color: #bdbdbd;
+
+	/* success */
+	--se-success-color: #008000;
+	--se-success-dark-color: #628562;
+	--se-success-dark2-color: #419c41;
+	--se-success-dark3-color: #006c00;
+	--se-success-light-color: #dff4e6;
+	--se-success-light2-color: #d5f3e0;
+	--se-success-light3-color: #c1f4d3;
+	--se-success-light4-color: #769c76;
+	--se-success-light5-color: #89b589;
+
+	/* error */
+	--se-error-color: #b94a48;
+	--se-error-dark-color: #e1a6a2;
+	--se-error-dark2-color: #db8d8c;
+	--se-error-dark3-color: #d17872;
+	--se-error-light-color: #f5d0c8;
+	--se-error-light2-color: #eed3d7;
+	--se-error-light3-color: #f2dede;
+	--se-error-light4-color: #f7deda;
+	--se-error-light5-color: #f8e3e1;
+
+	/* document type */
+	--se-doc-background: #f2f5fa;
+	--se-doc-info-page-font-color: #f5f5f5;
+	--se-doc-info-page-background-color: #b1b1b1;
+	/* document type - font, active */
+	--se-doc-info-font-color: #4c4c4c;
+	--se-doc-info-active-color: #4a32ff;
+
+	/* loading */
+	--se-loading-color: #07d;
+
+	/* show blocks */
+	--se-show-blocks-color: #3f9dff;
+	--se-show-blocks-li-color: #d539ff;
+	--se-show-blocks-pre-color: #34c38f;
+	--se-show-blocks-component-color: #f4b124;
+}

package/src/assets/design/index.css

@@ -0,0 +1,3 @@
+@import url('color.css');
+@import url('size.css');
+@import url('typography.css');

package/src/assets/design/size.css

@@ -0,0 +1,35 @@
+.sun-editor,
+.sun-editor-editable {
+	/** --------------------------- content - [size] ----------- */
+	/* main */
+	--se-edit-inner-padding: 1.5em 1.5em;
+	--se-edit-inner-padding-doc-type: 2.5rem 2.5rem;
+
+	/** --------------------------- layout - [size] ----------- */
+	/** main, common */
+	--se-border-radius: 2px;
+	--se-min-height: 65px;
+
+	/* modal */
+	--se-modal-input-width: 70px;
+
+	/* input:btn */
+	--se-input-btn-size: 32px;
+
+	/* document type */
+	--se-doc-min-padding: 1rem;
+	--se-doc-max-padding: 1.5rem;
+	--se-doc-padding-factor: 0.5;
+	--se-doc-info-width: 18%;
+	--se-doc-info-min-width: 16ch;
+	--se-doc-info-inner-padding: 2ch;
+	--se-doc-info-inner-line-padding: 0.5ch;
+	--se-doc-info-page-width: 16px;
+	/* document type indent - padding */
+	--se-doc-info-inner-line-indent-h1: 0em;
+	--se-doc-info-inner-line-indent-h2: 0.4em;
+	--se-doc-info-inner-line-indent-h3: 0.8em;
+	--se-doc-info-inner-line-indent-h4: 1.2em;
+	--se-doc-info-inner-line-indent-h5: 1.6em;
+	--se-doc-info-inner-line-indent-h6: 2em;
+}

package/src/assets/design/typography.css

@@ -0,0 +1,37 @@
+.sun-editor,
+.sun-editor-editable {
+	/** --------------------------- content - [typography] ----------- */
+	--se-edit-font-size: 13px;
+	--se-edit-line-height: 1.5em;
+
+	/** --------------------------- layout - [typography] ----------- */
+	/* main */
+	--se-main-font-family: Helvetica Neue;
+	--se-main-font-size: 13px;
+
+	/* button */
+	--se-btn-font-size: 12px;
+
+	/* status */
+	--se-statusbar-font-size: 10px;
+
+	/* modal */
+	--se-modal-title-font-size: 15px;
+	--se-modal-input-font-size: 14px;
+
+	/* browser */
+	--se-browser-title-font-size: 16px;
+
+	/* controller */
+	--se-controller-font-size: 14px;
+
+	/* document type */
+	--se-doc-info-font-size: 14px;
+	/* document type indent - weight */
+	--se-doc-info-inner-line-weight-h1: 700;
+	--se-doc-info-inner-line-weight-h2: 500;
+	--se-doc-info-inner-line-weight-h3: 400;
+	--se-doc-info-inner-line-weight-h4: 300;
+	--se-doc-info-inner-line-weight-h5: 300;
+	--se-doc-info-inner-line-weight-h6: 300;
+}