@jotforminc/dnd-builder 2.7.0 → 2.8.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/CHANGELOG.md +14 -0
- package/lib/cjs/components/withClickOutside.js +3 -0
- package/lib/cjs/components/withClickOutside.js.map +1 -1
- package/lib/cjs/styles/_jfReportsPanels.scss +4 -1
- package/lib/cjs/styles/_jfReportsSVG.scss +0 -1
- package/lib/esm/components/withClickOutside.js +3 -0
- package/lib/esm/components/withClickOutside.js.map +1 -1
- package/lib/esm/styles/_jfReportsPanels.scss +4 -1
- package/lib/esm/styles/_jfReportsSVG.scss +0 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,20 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
|
|
4
4
|
|
|
5
|
+
## [2.8.0](https://github.com/jotform/dnd-builder/compare/v2.7.1...v2.8.0) (2023-11-27)
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
### Features
|
|
9
|
+
|
|
10
|
+
* **dnd-builder:** enforce role-based ignores in click outside ([fce52a3](https://github.com/jotform/dnd-builder/commit/fce52a3d8517b0b66ec5524bd2f3ae27037733aa))
|
|
11
|
+
|
|
12
|
+
### [2.7.1](https://github.com/jotform/dnd-builder/compare/v2.7.0...v2.7.1) (2023-11-22)
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
### Bug Fixes
|
|
16
|
+
|
|
17
|
+
* **panel-elements:** size settings lock button alignment ([e221915](https://github.com/jotform/dnd-builder/commit/e22191523a06ba1b6c5616299e4de6eefe20f665))
|
|
18
|
+
|
|
5
19
|
## [2.7.0](https://github.com/jotform/dnd-builder/compare/v2.6.1...v2.7.0) (2023-10-03)
|
|
6
20
|
|
|
7
21
|
|
|
@@ -19,6 +19,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
|
19
19
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
20
20
|
|
|
21
21
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
22
|
+
var IGNORED_ROLES = ['dialog'];
|
|
22
23
|
|
|
23
24
|
function getDisplayName(WrappedComponent) {
|
|
24
25
|
return WrappedComponent.displayName || WrappedComponent.name || 'Component';
|
|
@@ -38,6 +39,8 @@ function withClickOutside(WrappedComponent) {
|
|
|
38
39
|
return exceptionalClasses.includes(xClass);
|
|
39
40
|
}) || exceptionalClasses.some(function (item) {
|
|
40
41
|
return event.target.closest(".".concat(item));
|
|
42
|
+
}) || IGNORED_ROLES.some(function (role) {
|
|
43
|
+
return event.target.closest("[role=".concat(role, "]"));
|
|
41
44
|
}))) {
|
|
42
45
|
return;
|
|
43
46
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"withClickOutside.js","sources":["../../../src/components/withClickOutside.js"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nfunction getDisplayName(WrappedComponent) {\n return WrappedComponent.displayName || WrappedComponent.name || 'Component';\n}\n\nfunction withClickOutside(WrappedComponent) {\n function WithClickOutside(props) {\n const {\n exceptionalClasses,\n onClickOutside,\n withClickOutsideWrapperClass,\n } = props;\n\n const wrapper = useRef(null);\n\n const handleClickOutside = event => {\n const { classList } = event.target;\n if (\n exceptionalClasses\n && (\n classList.contains(exceptionalClasses)\n || Array.from(classList).some(xClass => exceptionalClasses.includes(xClass))\n || exceptionalClasses.some(item => event.target.closest(`.${item}`))\n )\n ) {\n return;\n }\n\n if (wrapper.current && !wrapper.current.contains(event.target)) {\n onClickOutside(event);\n }\n };\n\n useEffect(() => {\n window.addEventListener('mousedown', handleClickOutside, true);\n return () => {\n window.removeEventListener('mousedown', handleClickOutside, true);\n };\n }, []);\n\n // should we memoize this?\n const propsToFilter = ['withClickOutsideWrapperClass', 'exceptionalClasses'];\n const componentName = getDisplayName(WrappedComponent);\n if (componentName === 'Resizable') {\n // beceause resizable wrapper directly passes props to an html el\n propsToFilter.push('onClickOutside');\n }\n const filteredProps = Object.keys(props).reduce((allProps, propKey) => {\n const _allProps = allProps;\n if (propsToFilter.indexOf(propKey) === -1) {\n _allProps[propKey] = props[propKey];\n }\n return _allProps;\n }, {});\n\n return (\n <div\n ref={wrapper}\n className={withClickOutsideWrapperClass}\n >\n <WrappedComponent\n {...filteredProps}\n />\n </div>\n );\n }\n\n WithClickOutside.propTypes = {\n exceptionalClasses: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.string),\n ]),\n onClickOutside: PropTypes.func.isRequired,\n withClickOutsideWrapperClass: PropTypes.string,\n };\n\n WithClickOutside.defaultProps = {\n exceptionalClasses: null,\n withClickOutsideWrapperClass: null,\n };\n\n WithClickOutside.displayName = `inlineEdit(${getDisplayName(WrappedComponent)})`;\n\n return WithClickOutside;\n}\n\nexport default withClickOutside;\n"],"names":["getDisplayName","WrappedComponent","displayName","name","withClickOutside","WithClickOutside","props","exceptionalClasses","onClickOutside","withClickOutsideWrapperClass","wrapper","useRef","handleClickOutside","event","classList","target","contains","Array","from","some","xClass","includes","item","closest","current","useEffect","window","addEventListener","removeEventListener","propsToFilter","componentName","push","filteredProps","Object","keys","reduce","allProps","propKey","_allProps","indexOf","_jsx","propTypes","PropTypes","oneOfType","string","arrayOf","func","isRequired","defaultProps"],"mappings":"
|
|
1
|
+
{"version":3,"file":"withClickOutside.js","sources":["../../../src/components/withClickOutside.js"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nconst IGNORED_ROLES = [\n 'dialog',\n];\n\nfunction getDisplayName(WrappedComponent) {\n return WrappedComponent.displayName || WrappedComponent.name || 'Component';\n}\n\nfunction withClickOutside(WrappedComponent) {\n function WithClickOutside(props) {\n const {\n exceptionalClasses,\n onClickOutside,\n withClickOutsideWrapperClass,\n } = props;\n\n const wrapper = useRef(null);\n\n const handleClickOutside = event => {\n const { classList } = event.target;\n if (\n exceptionalClasses\n && (\n classList.contains(exceptionalClasses)\n || Array.from(classList).some(xClass => exceptionalClasses.includes(xClass))\n || exceptionalClasses.some(item => event.target.closest(`.${item}`))\n || IGNORED_ROLES.some(role => event.target.closest(`[role=${role}]`))\n )\n ) {\n return;\n }\n\n if (wrapper.current && !wrapper.current.contains(event.target)) {\n onClickOutside(event);\n }\n };\n\n useEffect(() => {\n window.addEventListener('mousedown', handleClickOutside, true);\n return () => {\n window.removeEventListener('mousedown', handleClickOutside, true);\n };\n }, []);\n\n // should we memoize this?\n const propsToFilter = ['withClickOutsideWrapperClass', 'exceptionalClasses'];\n const componentName = getDisplayName(WrappedComponent);\n if (componentName === 'Resizable') {\n // beceause resizable wrapper directly passes props to an html el\n propsToFilter.push('onClickOutside');\n }\n const filteredProps = Object.keys(props).reduce((allProps, propKey) => {\n const _allProps = allProps;\n if (propsToFilter.indexOf(propKey) === -1) {\n _allProps[propKey] = props[propKey];\n }\n return _allProps;\n }, {});\n\n return (\n <div\n ref={wrapper}\n className={withClickOutsideWrapperClass}\n >\n <WrappedComponent\n {...filteredProps}\n />\n </div>\n );\n }\n\n WithClickOutside.propTypes = {\n exceptionalClasses: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.string),\n ]),\n onClickOutside: PropTypes.func.isRequired,\n withClickOutsideWrapperClass: PropTypes.string,\n };\n\n WithClickOutside.defaultProps = {\n exceptionalClasses: null,\n withClickOutsideWrapperClass: null,\n };\n\n WithClickOutside.displayName = `inlineEdit(${getDisplayName(WrappedComponent)})`;\n\n return WithClickOutside;\n}\n\nexport default withClickOutside;\n"],"names":["IGNORED_ROLES","getDisplayName","WrappedComponent","displayName","name","withClickOutside","WithClickOutside","props","exceptionalClasses","onClickOutside","withClickOutsideWrapperClass","wrapper","useRef","handleClickOutside","event","classList","target","contains","Array","from","some","xClass","includes","item","closest","role","current","useEffect","window","addEventListener","removeEventListener","propsToFilter","componentName","push","filteredProps","Object","keys","reduce","allProps","propKey","_allProps","indexOf","_jsx","propTypes","PropTypes","oneOfType","string","arrayOf","func","isRequired","defaultProps"],"mappings":"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"}
|
|
@@ -177,10 +177,13 @@
|
|
|
177
177
|
}
|
|
178
178
|
|
|
179
179
|
.forAspect {
|
|
180
|
+
width: 24px;
|
|
181
|
+
padding: 12px 0;
|
|
180
182
|
&:before, &:after {
|
|
181
183
|
content: "";
|
|
182
184
|
position: absolute;
|
|
183
|
-
|
|
185
|
+
top: 50%;
|
|
186
|
+
transform: translateY(-50%);
|
|
184
187
|
width: 4px;
|
|
185
188
|
|
|
186
189
|
border-bottom: 1px solid #303339;
|
|
@@ -13,6 +13,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
|
13
13
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
14
14
|
|
|
15
15
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
16
|
+
var IGNORED_ROLES = ['dialog'];
|
|
16
17
|
|
|
17
18
|
function getDisplayName(WrappedComponent) {
|
|
18
19
|
return WrappedComponent.displayName || WrappedComponent.name || 'Component';
|
|
@@ -32,6 +33,8 @@ function withClickOutside(WrappedComponent) {
|
|
|
32
33
|
return exceptionalClasses.includes(xClass);
|
|
33
34
|
}) || exceptionalClasses.some(function (item) {
|
|
34
35
|
return event.target.closest(".".concat(item));
|
|
36
|
+
}) || IGNORED_ROLES.some(function (role) {
|
|
37
|
+
return event.target.closest("[role=".concat(role, "]"));
|
|
35
38
|
}))) {
|
|
36
39
|
return;
|
|
37
40
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"withClickOutside.js","sources":["../../../src/components/withClickOutside.js"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nfunction getDisplayName(WrappedComponent) {\n return WrappedComponent.displayName || WrappedComponent.name || 'Component';\n}\n\nfunction withClickOutside(WrappedComponent) {\n function WithClickOutside(props) {\n const {\n exceptionalClasses,\n onClickOutside,\n withClickOutsideWrapperClass,\n } = props;\n\n const wrapper = useRef(null);\n\n const handleClickOutside = event => {\n const { classList } = event.target;\n if (\n exceptionalClasses\n && (\n classList.contains(exceptionalClasses)\n || Array.from(classList).some(xClass => exceptionalClasses.includes(xClass))\n || exceptionalClasses.some(item => event.target.closest(`.${item}`))\n )\n ) {\n return;\n }\n\n if (wrapper.current && !wrapper.current.contains(event.target)) {\n onClickOutside(event);\n }\n };\n\n useEffect(() => {\n window.addEventListener('mousedown', handleClickOutside, true);\n return () => {\n window.removeEventListener('mousedown', handleClickOutside, true);\n };\n }, []);\n\n // should we memoize this?\n const propsToFilter = ['withClickOutsideWrapperClass', 'exceptionalClasses'];\n const componentName = getDisplayName(WrappedComponent);\n if (componentName === 'Resizable') {\n // beceause resizable wrapper directly passes props to an html el\n propsToFilter.push('onClickOutside');\n }\n const filteredProps = Object.keys(props).reduce((allProps, propKey) => {\n const _allProps = allProps;\n if (propsToFilter.indexOf(propKey) === -1) {\n _allProps[propKey] = props[propKey];\n }\n return _allProps;\n }, {});\n\n return (\n <div\n ref={wrapper}\n className={withClickOutsideWrapperClass}\n >\n <WrappedComponent\n {...filteredProps}\n />\n </div>\n );\n }\n\n WithClickOutside.propTypes = {\n exceptionalClasses: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.string),\n ]),\n onClickOutside: PropTypes.func.isRequired,\n withClickOutsideWrapperClass: PropTypes.string,\n };\n\n WithClickOutside.defaultProps = {\n exceptionalClasses: null,\n withClickOutsideWrapperClass: null,\n };\n\n WithClickOutside.displayName = `inlineEdit(${getDisplayName(WrappedComponent)})`;\n\n return WithClickOutside;\n}\n\nexport default withClickOutside;\n"],"names":["getDisplayName","WrappedComponent","displayName","name","withClickOutside","WithClickOutside","props","exceptionalClasses","onClickOutside","withClickOutsideWrapperClass","wrapper","useRef","handleClickOutside","event","classList","target","contains","Array","from","some","xClass","includes","item","closest","current","useEffect","window","addEventListener","removeEventListener","propsToFilter","componentName","push","filteredProps","Object","keys","reduce","allProps","propKey","_allProps","indexOf","_jsx","propTypes","PropTypes","oneOfType","string","arrayOf","func","isRequired","defaultProps"],"mappings":"
|
|
1
|
+
{"version":3,"file":"withClickOutside.js","sources":["../../../src/components/withClickOutside.js"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nconst IGNORED_ROLES = [\n 'dialog',\n];\n\nfunction getDisplayName(WrappedComponent) {\n return WrappedComponent.displayName || WrappedComponent.name || 'Component';\n}\n\nfunction withClickOutside(WrappedComponent) {\n function WithClickOutside(props) {\n const {\n exceptionalClasses,\n onClickOutside,\n withClickOutsideWrapperClass,\n } = props;\n\n const wrapper = useRef(null);\n\n const handleClickOutside = event => {\n const { classList } = event.target;\n if (\n exceptionalClasses\n && (\n classList.contains(exceptionalClasses)\n || Array.from(classList).some(xClass => exceptionalClasses.includes(xClass))\n || exceptionalClasses.some(item => event.target.closest(`.${item}`))\n || IGNORED_ROLES.some(role => event.target.closest(`[role=${role}]`))\n )\n ) {\n return;\n }\n\n if (wrapper.current && !wrapper.current.contains(event.target)) {\n onClickOutside(event);\n }\n };\n\n useEffect(() => {\n window.addEventListener('mousedown', handleClickOutside, true);\n return () => {\n window.removeEventListener('mousedown', handleClickOutside, true);\n };\n }, []);\n\n // should we memoize this?\n const propsToFilter = ['withClickOutsideWrapperClass', 'exceptionalClasses'];\n const componentName = getDisplayName(WrappedComponent);\n if (componentName === 'Resizable') {\n // beceause resizable wrapper directly passes props to an html el\n propsToFilter.push('onClickOutside');\n }\n const filteredProps = Object.keys(props).reduce((allProps, propKey) => {\n const _allProps = allProps;\n if (propsToFilter.indexOf(propKey) === -1) {\n _allProps[propKey] = props[propKey];\n }\n return _allProps;\n }, {});\n\n return (\n <div\n ref={wrapper}\n className={withClickOutsideWrapperClass}\n >\n <WrappedComponent\n {...filteredProps}\n />\n </div>\n );\n }\n\n WithClickOutside.propTypes = {\n exceptionalClasses: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.string),\n ]),\n onClickOutside: PropTypes.func.isRequired,\n withClickOutsideWrapperClass: PropTypes.string,\n };\n\n WithClickOutside.defaultProps = {\n exceptionalClasses: null,\n withClickOutsideWrapperClass: null,\n };\n\n WithClickOutside.displayName = `inlineEdit(${getDisplayName(WrappedComponent)})`;\n\n return WithClickOutside;\n}\n\nexport default withClickOutside;\n"],"names":["IGNORED_ROLES","getDisplayName","WrappedComponent","displayName","name","withClickOutside","WithClickOutside","props","exceptionalClasses","onClickOutside","withClickOutsideWrapperClass","wrapper","useRef","handleClickOutside","event","classList","target","contains","Array","from","some","xClass","includes","item","closest","role","current","useEffect","window","addEventListener","removeEventListener","propsToFilter","componentName","push","filteredProps","Object","keys","reduce","allProps","propKey","_allProps","indexOf","_jsx","propTypes","PropTypes","oneOfType","string","arrayOf","func","isRequired","defaultProps"],"mappings":"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"}
|
|
@@ -177,10 +177,13 @@
|
|
|
177
177
|
}
|
|
178
178
|
|
|
179
179
|
.forAspect {
|
|
180
|
+
width: 24px;
|
|
181
|
+
padding: 12px 0;
|
|
180
182
|
&:before, &:after {
|
|
181
183
|
content: "";
|
|
182
184
|
position: absolute;
|
|
183
|
-
|
|
185
|
+
top: 50%;
|
|
186
|
+
transform: translateY(-50%);
|
|
184
187
|
width: 4px;
|
|
185
188
|
|
|
186
189
|
border-bottom: 1px solid #303339;
|