@udecode/plate-indent - npm Package Compare versions

Comparing version 6.3.0 to 6.4.0

CHANGELOG.md

 # @udecode/plate-indent
 
+## 6.4.0
+
+### Minor Changes
+
+- [#1184](https://github.com/udecode/plate/pull/1184) by [@ghingis](https://github.com/ghingis) – `classNames` plugin option now fits `getElementOverrideProps` API:
+
+  ```ts
+  // before
+  {
+    classNames: [
+      'slate-indent-1',
+      'slate-indent-2',
+      'slate-indent-3',
+    ],
+  }
+  // after
+  {
+    classNames: {
+      1: 'slate-indent-1',
+      2: 'slate-indent-2',
+      3: 'slate-indent-3',
+    },
+  }
+  ```
+
+### Patch Changes
+
+- [#1184](https://github.com/udecode/plate/pull/1184) by [@ghingis](https://github.com/ghingis) – now uses `getElementOverrideProps` / `getLeafOverrideProps`
+
+- [#1183](https://github.com/udecode/plate/pull/1183) by [@zbeyens](https://github.com/zbeyens) – fix import
+
 ## 6.3.0
@@ -4,0 +35,0 @@

dist/index.es.js

@@ -0,46 +1,5 @@
+import { getElementOverrideProps, getNodes, setNodes, ELEMENT_DEFAULT } from '@udecode/plate-common';
 import { getPlatePluginOptions, getPlatePluginType } from '@udecode/plate-core';
-import { Editor, Transforms } from 'slate';
-import { getNodes, setNodes, ELEMENT_DEFAULT } from '@udecode/plate-common';
+import { Transforms } from 'slate';
 
-function toVal(mix) {
-	var k, y, str='';
-
-	if (typeof mix === 'string' || typeof mix === 'number') {
-		str += mix;
-	} else if (typeof mix === 'object') {
-		if (Array.isArray(mix)) {
-			for (k=0; k < mix.length; k++) {
-				if (mix[k]) {
-					if (y = toVal(mix[k])) {
-						str && (str += ' ');
-						str += y;
-					}
-				}
-			}
-		} else {
-			for (k in mix) {
-				if (mix[k]) {
-					str && (str += ' ');
-					str += k;
-				}
-			}
-		}
-	}
-
-	return str;
-}
-
-function clsx () {
-	var i=0, tmp, x, str='';
-	while (i < arguments.length) {
-		if (tmp = arguments[i++]) {
-			if (x = toVal(tmp)) {
-				str && (str += ' ');
-				str += x;
-			}
-		}
-	}
-	return str;
-}
-
 const KEY_INDENT = 'indent';
@@ -51,33 +10,9 @@
     types,
+    classNames
+  } = getPlatePluginOptions(editor, KEY_INDENT);
+  return getElementOverrideProps(editor, {
+    type: KEY_INDENT,
     classNames,
-    offset,
-    unit
-  } = getPlatePluginOptions(editor, KEY_INDENT);
-  return ({
-    element,
-    style,
-    className
-  }) => {
-    if (!element) return;
-    const {
-      indent
-    } = element;
-    if (!indent) return;
-    const isBlock = Editor.isBlock(editor, element);
-    if (!isBlock) return;
-
-    if (types.includes(element.type)) {
-      const res = {};
-
-      if (classNames) {
-        res.className = clsx(className, classNames[indent - 1]);
-      } else {
-        res.style = { ...style,
-          marginLeft: offset * indent + unit
-        };
-      }
-
-      return res;
-    }
-  };
+    types
+  });
 };
@@ -1335,3 +1270,8 @@
     offset: 24,
-    unit: 'px'
+    unit: 'px',
+    // The following props will be used by the getOverrideProps
+    cssPropName: 'marginLeft',
+    transformCssValue: params => {
+      return params.value * params.options.offset + params.options.unit;
+    }
   });
@@ -1338,0 +1278,0 @@ const {

dist/index.js

@@ -5,47 +5,6 @@ 'use strict';
 
+var plateCommon = require('@udecode/plate-common');
 var plateCore = require('@udecode/plate-core');
 var slate = require('slate');
-var plateCommon = require('@udecode/plate-common');
 
-function toVal(mix) {
-	var k, y, str='';
-
-	if (typeof mix === 'string' || typeof mix === 'number') {
-		str += mix;
-	} else if (typeof mix === 'object') {
-		if (Array.isArray(mix)) {
-			for (k=0; k < mix.length; k++) {
-				if (mix[k]) {
-					if (y = toVal(mix[k])) {
-						str && (str += ' ');
-						str += y;
-					}
-				}
-			}
-		} else {
-			for (k in mix) {
-				if (mix[k]) {
-					str && (str += ' ');
-					str += k;
-				}
-			}
-		}
-	}
-
-	return str;
-}
-
-function clsx () {
-	var i=0, tmp, x, str='';
-	while (i < arguments.length) {
-		if (tmp = arguments[i++]) {
-			if (x = toVal(tmp)) {
-				str && (str += ' ');
-				str += x;
-			}
-		}
-	}
-	return str;
-}
-
 const KEY_INDENT = 'indent';
@@ -56,33 +15,9 @@
     types,
+    classNames
+  } = plateCore.getPlatePluginOptions(editor, KEY_INDENT);
+  return plateCommon.getElementOverrideProps(editor, {
+    type: KEY_INDENT,
     classNames,
-    offset,
-    unit
-  } = plateCore.getPlatePluginOptions(editor, KEY_INDENT);
-  return ({
-    element,
-    style,
-    className
-  }) => {
-    if (!element) return;
-    const {
-      indent
-    } = element;
-    if (!indent) return;
-    const isBlock = slate.Editor.isBlock(editor, element);
-    if (!isBlock) return;
-
-    if (types.includes(element.type)) {
-      const res = {};
-
-      if (classNames) {
-        res.className = clsx(className, classNames[indent - 1]);
-      } else {
-        res.style = { ...style,
-          marginLeft: offset * indent + unit
-        };
-      }
-
-      return res;
-    }
-  };
+    types
+  });
 };
@@ -1340,3 +1275,8 @@
     offset: 24,
-    unit: 'px'
+    unit: 'px',
+    // The following props will be used by the getOverrideProps
+    cssPropName: 'marginLeft',
+    transformCssValue: params => {
+      return params.value * params.options.offset + params.options.unit;
+    }
   });
@@ -1343,0 +1283,0 @@ const {

dist/onKeyDownHandler.d.ts

 import React from 'react';
-import { TEditor } from '../../core/dist';
+import { TEditor } from '@udecode/plate-core';
 export declare const onKeyDownHandler: (editor: TEditor) => (event: React.KeyboardEvent) => void;
 //# sourceMappingURL=onKeyDownHandler.d.ts.map

dist/types.d.ts

@@ -0,1 +1,2 @@
+import { CSSProperties } from 'react';
 export interface IndentPluginOptions {
@@ -14,6 +15,5 @@ /**
      * List of classNames to pass to each indented block.
-     * First item is indent=1, second item is indent=2,...
      * If defined, the plugin will pass a className prop instead of a style prop.
      */
-    classNames?: string[];
+    classNames?: Record<number, string>;
     /**
@@ -28,3 +28,19 @@ * List of block types supporting indentation.
     indentMax?: number;
+    /** The following props will be used by the getOverrideProps */
+    /**
+     * camelCase name of the css property that the getOverrideProps will use
+     * if not provided it will fall back to the plugin key
+     * @default 'marginLeft'
+     */
+    cssPropName?: keyof CSSProperties;
+    /**
+     * Transformation function that will be used to transform the value from the text
+     * if not provided the value will be used as is
+     * @default ({value, options}) => value * options.offset + options.unit
+     */
+    transformCssValue?: (params: {
+        options: IndentPluginOptions;
+        value: number;
+    }) => string;
 }
 //# sourceMappingURL=types.d.ts.map

package.json

 {
   "name": "@udecode/plate-indent",
-  "version": "6.3.0",
+  "version": "6.4.0",
   "description": "Indent plugin for Plate",
@@ -30,8 +30,8 @@ "keywords": [
     "build:w": "yarn rollup -w",
-    "cti": "sh ../../cti.sh",
-    "rollup": "rollup -c=../../rollup.config.js",
+    "cti": "sh ../../../cti.sh",
+    "rollup": "rollup -c=../../../rollup.config.js",
     "test": "jest"
   },
   "dependencies": {
-    "@udecode/plate-common": "6.3.0",
+    "@udecode/plate-common": "6.4.0",
     "@udecode/plate-core": "6.2.0"
@@ -38,0 +38,0 @@ },

No alert changes

Worsened metrics

Total package byte prevSize

210893

decreased by-2.3%

Lines of code

2384

decreased by-3.64%

Dependency changes

• + Added@udecode/plate-common@6.4.0(transitive)

• - Removed@udecode/plate-common@6.3.0(transitive)

• Updated@udecode/plate-common@6.4.0