@bpmn-io/properties-panel 0.9.0 → 0.10.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 +11 -0
- package/dist/index.esm.js +1607 -0
- package/dist/index.esm.js.map +1 -0
- package/dist/index.js +1648 -0
- package/dist/index.js.map +1 -0
- package/package.json +16 -7
- package/preact/LICENSE +21 -0
- package/preact/README.md +185 -0
- package/preact/compat/dist/compat.js +2 -0
- package/preact/compat/dist/compat.js.map +1 -0
- package/preact/compat/dist/compat.mjs +2 -0
- package/preact/compat/dist/compat.module.js +2 -0
- package/preact/compat/dist/compat.module.js.map +1 -0
- package/preact/compat/dist/compat.umd.js +2 -0
- package/preact/compat/dist/compat.umd.js.map +1 -0
- package/preact/compat/jsx-dev-runtime.js +1 -0
- package/preact/compat/jsx-dev-runtime.mjs +1 -0
- package/preact/compat/jsx-runtime.js +1 -0
- package/preact/compat/jsx-runtime.mjs +1 -0
- package/preact/compat/package.json +19 -0
- package/preact/compat/server.js +15 -0
- package/preact/compat/server.mjs +4 -0
- package/preact/compat/src/Children.js +21 -0
- package/preact/compat/src/PureComponent.js +15 -0
- package/preact/compat/src/forwardRef.js +51 -0
- package/preact/compat/src/index.d.ts +140 -0
- package/preact/compat/src/index.js +175 -0
- package/preact/compat/src/internal.d.ts +47 -0
- package/preact/compat/src/memo.js +34 -0
- package/preact/compat/src/portals.js +80 -0
- package/preact/compat/src/render.js +219 -0
- package/preact/compat/src/scheduler.js +24 -0
- package/preact/compat/src/suspense-list.d.ts +14 -0
- package/preact/compat/src/suspense-list.js +126 -0
- package/preact/compat/src/suspense.d.ts +15 -0
- package/preact/compat/src/suspense.js +270 -0
- package/preact/compat/src/util.js +28 -0
- package/preact/compat/test-utils.js +1 -0
- package/preact/debug/dist/debug.js +2 -0
- package/preact/debug/dist/debug.js.map +1 -0
- package/preact/debug/dist/debug.mjs +2 -0
- package/preact/debug/dist/debug.module.js +2 -0
- package/preact/debug/dist/debug.module.js.map +1 -0
- package/preact/debug/dist/debug.umd.js +2 -0
- package/preact/debug/dist/debug.umd.js.map +1 -0
- package/preact/debug/package.json +18 -0
- package/preact/debug/src/check-props.js +54 -0
- package/preact/debug/src/component-stack.js +146 -0
- package/preact/debug/src/constants.js +3 -0
- package/preact/debug/src/debug.js +442 -0
- package/preact/debug/src/index.js +6 -0
- package/preact/debug/src/internal.d.ts +82 -0
- package/preact/debug/src/util.js +11 -0
- package/preact/devtools/dist/devtools.js +2 -0
- package/preact/devtools/dist/devtools.js.map +1 -0
- package/preact/devtools/dist/devtools.mjs +2 -0
- package/preact/devtools/dist/devtools.module.js +2 -0
- package/preact/devtools/dist/devtools.module.js.map +1 -0
- package/preact/devtools/dist/devtools.umd.js +2 -0
- package/preact/devtools/dist/devtools.umd.js.map +1 -0
- package/preact/devtools/package.json +16 -0
- package/preact/devtools/src/devtools.js +10 -0
- package/preact/devtools/src/index.d.ts +8 -0
- package/preact/devtools/src/index.js +15 -0
- package/preact/dist/preact.js +2 -0
- package/preact/dist/preact.js.map +1 -0
- package/preact/dist/preact.min.js +2 -0
- package/preact/dist/preact.min.js.map +1 -0
- package/preact/dist/preact.mjs +2 -0
- package/preact/dist/preact.module.js +2 -0
- package/preact/dist/preact.module.js.map +1 -0
- package/preact/dist/preact.umd.js +2 -0
- package/preact/dist/preact.umd.js.map +1 -0
- package/preact/hooks/dist/hooks.js +2 -0
- package/preact/hooks/dist/hooks.js.map +1 -0
- package/preact/hooks/dist/hooks.mjs +2 -0
- package/preact/hooks/dist/hooks.module.js +2 -0
- package/preact/hooks/dist/hooks.module.js.map +1 -0
- package/preact/hooks/dist/hooks.umd.js +2 -0
- package/preact/hooks/dist/hooks.umd.js.map +1 -0
- package/preact/hooks/package.json +26 -0
- package/preact/hooks/src/index.d.ts +130 -0
- package/preact/hooks/src/index.js +386 -0
- package/preact/hooks/src/internal.d.ts +75 -0
- package/preact/jsx-runtime/dist/jsxRuntime.js +2 -0
- package/preact/jsx-runtime/dist/jsxRuntime.js.map +1 -0
- package/preact/jsx-runtime/dist/jsxRuntime.mjs +2 -0
- package/preact/jsx-runtime/dist/jsxRuntime.module.js +2 -0
- package/preact/jsx-runtime/dist/jsxRuntime.module.js.map +1 -0
- package/preact/jsx-runtime/dist/jsxRuntime.umd.js +2 -0
- package/preact/jsx-runtime/dist/jsxRuntime.umd.js.map +1 -0
- package/preact/jsx-runtime/package.json +19 -0
- package/preact/jsx-runtime/src/index.d.ts +50 -0
- package/preact/jsx-runtime/src/index.js +72 -0
- package/preact/package.json +268 -0
- package/preact/src/cjs.js +3 -0
- package/preact/src/clone-element.js +39 -0
- package/preact/src/component.js +225 -0
- package/preact/src/constants.js +3 -0
- package/preact/src/create-context.js +68 -0
- package/preact/src/create-element.js +100 -0
- package/preact/src/diff/catch-error.js +38 -0
- package/preact/src/diff/children.js +347 -0
- package/preact/src/diff/index.js +516 -0
- package/preact/src/diff/props.js +158 -0
- package/preact/src/index.d.ts +310 -0
- package/preact/src/index.js +13 -0
- package/preact/src/internal.d.ts +147 -0
- package/preact/src/jsx.d.ts +955 -0
- package/preact/src/options.js +17 -0
- package/preact/src/render.js +74 -0
- package/preact/src/util.js +23 -0
- package/preact/test-utils/dist/testUtils.js +2 -0
- package/preact/test-utils/dist/testUtils.js.map +1 -0
- package/preact/test-utils/dist/testUtils.mjs +2 -0
- package/preact/test-utils/dist/testUtils.module.js +2 -0
- package/preact/test-utils/dist/testUtils.module.js.map +1 -0
- package/preact/test-utils/dist/testUtils.umd.js +2 -0
- package/preact/test-utils/dist/testUtils.umd.js.map +1 -0
- package/preact/test-utils/package.json +19 -0
- package/preact/test-utils/src/index.d.ts +3 -0
- package/preact/test-utils/src/index.js +117 -0
- package/lib/PropertiesPanel.js +0 -166
- package/lib/PropertiesPanel.js.map +0 -1
- package/lib/components/DropdownButton.js +0 -109
- package/lib/components/DropdownButton.js.map +0 -1
- package/lib/components/Group.js +0 -75
- package/lib/components/Group.js.map +0 -1
- package/lib/components/Header.js +0 -49
- package/lib/components/Header.js.map +0 -1
- package/lib/components/HeaderButton.js +0 -16
- package/lib/components/HeaderButton.js.map +0 -1
- package/lib/components/ListGroup.js +0 -167
- package/lib/components/ListGroup.js.map +0 -1
- package/lib/components/ListItem.js +0 -37
- package/lib/components/ListItem.js.map +0 -1
- package/lib/components/entries/Checkbox.js +0 -83
- package/lib/components/entries/Checkbox.js.map +0 -1
- package/lib/components/entries/Collapsible.js +0 -48
- package/lib/components/entries/Collapsible.js.map +0 -1
- package/lib/components/entries/Description.js +0 -26
- package/lib/components/entries/Description.js.map +0 -1
- package/lib/components/entries/List.js +0 -204
- package/lib/components/entries/List.js.map +0 -1
- package/lib/components/entries/NumberField.js +0 -110
- package/lib/components/entries/NumberField.js.map +0 -1
- package/lib/components/entries/Select.js +0 -110
- package/lib/components/entries/Select.js.map +0 -1
- package/lib/components/entries/Simple.js +0 -56
- package/lib/components/entries/Simple.js.map +0 -1
- package/lib/components/entries/TextArea.js +0 -98
- package/lib/components/entries/TextArea.js.map +0 -1
- package/lib/components/entries/TextField.js +0 -123
- package/lib/components/entries/TextField.js.map +0 -1
- package/lib/components/entries/ToggleSwitch.js +0 -91
- package/lib/components/entries/ToggleSwitch.js.map +0 -1
- package/lib/components/icons/index.js +0 -51
- package/lib/components/icons/index.js.map +0 -1
- package/lib/context/DescriptionContext.js +0 -7
- package/lib/context/DescriptionContext.js.map +0 -1
- package/lib/context/LayoutContext.js +0 -9
- package/lib/context/LayoutContext.js.map +0 -1
- package/lib/context/index.js +0 -3
- package/lib/context/index.js.map +0 -1
- package/lib/features/debounce-input/debounceInput.js +0 -14
- package/lib/features/debounce-input/debounceInput.js.map +0 -1
- package/lib/features/debounce-input/index.js +0 -5
- package/lib/features/debounce-input/index.js.map +0 -1
- package/lib/hooks/index.js +0 -5
- package/lib/hooks/index.js.map +0 -1
- package/lib/hooks/useDescriptionContext.js +0 -25
- package/lib/hooks/useDescriptionContext.js.map +0 -1
- package/lib/hooks/useKeyFactory.js +0 -39
- package/lib/hooks/useKeyFactory.js.map +0 -1
- package/lib/hooks/useLayoutState.js +0 -36
- package/lib/hooks/useLayoutState.js.map +0 -1
- package/lib/hooks/usePrevious.js +0 -16
- package/lib/hooks/usePrevious.js.map +0 -1
- package/lib/index.js +0 -2
- package/lib/index.js.map +0 -1
package/lib/components/Group.js
DELETED
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
import { useEffect, useState } from 'preact/hooks';
|
|
2
|
-
import classnames from 'classnames';
|
|
3
|
-
import { query as domQuery } from 'min-dom';
|
|
4
|
-
import { isFunction } from 'min-dash';
|
|
5
|
-
import { useLayoutState } from '../hooks';
|
|
6
|
-
import { ArrowIcon } from './icons';
|
|
7
|
-
/**
|
|
8
|
-
* @param {import('../PropertiesPanel').GroupDefinition} props
|
|
9
|
-
*/
|
|
10
|
-
|
|
11
|
-
import { jsx as _jsx } from "preact/jsx-runtime";
|
|
12
|
-
import { jsxs as _jsxs } from "preact/jsx-runtime";
|
|
13
|
-
export default function Group(props) {
|
|
14
|
-
const {
|
|
15
|
-
id,
|
|
16
|
-
entries = [],
|
|
17
|
-
label
|
|
18
|
-
} = props;
|
|
19
|
-
const [open, setOpen] = useLayoutState(['groups', id, 'open'], false);
|
|
20
|
-
|
|
21
|
-
const toggleOpen = () => setOpen(!open);
|
|
22
|
-
|
|
23
|
-
const [edited, setEdited] = useState(false); // set edited state depending on all entries
|
|
24
|
-
|
|
25
|
-
useEffect(() => {
|
|
26
|
-
const hasOneEditedEntry = entries.find(entry => {
|
|
27
|
-
const {
|
|
28
|
-
id,
|
|
29
|
-
isEdited
|
|
30
|
-
} = entry;
|
|
31
|
-
const entryNode = domQuery(`[data-entry-id="${id}"]`);
|
|
32
|
-
|
|
33
|
-
if (!isFunction(isEdited) || !entryNode) {
|
|
34
|
-
return false;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
const inputNode = domQuery('.bio-properties-panel-input', entryNode);
|
|
38
|
-
return isEdited(inputNode);
|
|
39
|
-
});
|
|
40
|
-
setEdited(hasOneEditedEntry);
|
|
41
|
-
}, [entries]);
|
|
42
|
-
return _jsxs("div", {
|
|
43
|
-
class: "bio-properties-panel-group",
|
|
44
|
-
"data-group-id": 'group-' + id,
|
|
45
|
-
children: [_jsxs("div", {
|
|
46
|
-
class: classnames('bio-properties-panel-group-header', edited ? '' : 'empty', open ? 'open' : ''),
|
|
47
|
-
onClick: toggleOpen,
|
|
48
|
-
children: [_jsx("div", {
|
|
49
|
-
title: label,
|
|
50
|
-
class: "bio-properties-panel-group-header-title",
|
|
51
|
-
children: label
|
|
52
|
-
}), _jsxs("div", {
|
|
53
|
-
class: "bio-properties-panel-group-header-buttons",
|
|
54
|
-
children: [edited && _jsx(DataMarker, {}), _jsx("button", {
|
|
55
|
-
title: "Toggle section",
|
|
56
|
-
class: "bio-properties-panel-group-header-button bio-properties-panel-arrow",
|
|
57
|
-
children: _jsx(ArrowIcon, {
|
|
58
|
-
class: open ? 'bio-properties-panel-arrow-down' : 'bio-properties-panel-arrow-right'
|
|
59
|
-
})
|
|
60
|
-
})]
|
|
61
|
-
})]
|
|
62
|
-
}), _jsx("div", {
|
|
63
|
-
class: classnames('bio-properties-panel-group-entries', open ? 'open' : ''),
|
|
64
|
-
children: entries.map(e => e.component)
|
|
65
|
-
})]
|
|
66
|
-
});
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
function DataMarker() {
|
|
70
|
-
return _jsx("div", {
|
|
71
|
-
title: "Section contains data",
|
|
72
|
-
class: "bio-properties-panel-dot"
|
|
73
|
-
});
|
|
74
|
-
}
|
|
75
|
-
//# sourceMappingURL=Group.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/Group.js"],"names":["useEffect","useState","classnames","query","domQuery","isFunction","useLayoutState","ArrowIcon","Group","props","id","entries","label","open","setOpen","toggleOpen","edited","setEdited","hasOneEditedEntry","find","entry","isEdited","entryNode","inputNode","map","e","component","DataMarker"],"mappings":"AAAA,SACEA,SADF,EAEEC,QAFF,QAGO,cAHP;AAKA,OAAOC,UAAP,MAAuB,YAAvB;AAEA,SACEC,KAAK,IAAIC,QADX,QAEO,SAFP;AAIA,SACEC,UADF,QAEO,UAFP;AAIA,SACEC,cADF,QAEO,UAFP;AAIA,SAASC,SAAT,QAA0B,SAA1B;AAEA;AACA;AACA;;;;AACA,eAAe,SAASC,KAAT,CAAeC,KAAf,EAAsB;AACnC,QAAM;AACJC,IAAAA,EADI;AAEJC,IAAAA,OAAO,GAAG,EAFN;AAGJC,IAAAA;AAHI,MAIFH,KAJJ;AAMA,QAAM,CAAEI,IAAF,EAAQC,OAAR,IAAoBR,cAAc,CACtC,CAAE,QAAF,EAAYI,EAAZ,EAAgB,MAAhB,CADsC,EAEtC,KAFsC,CAAxC;;AAIA,QAAMK,UAAU,GAAG,MAAMD,OAAO,CAAC,CAACD,IAAF,CAAhC;;AAEA,QAAM,CAAEG,MAAF,EAAUC,SAAV,IAAwBhB,QAAQ,CAAC,KAAD,CAAtC,CAbmC,CAenC;;AACAD,EAAAA,SAAS,CAAC,MAAM;AACd,UAAMkB,iBAAiB,GAAGP,OAAO,CAACQ,IAAR,CAAaC,KAAK,IAAI;AAC9C,YAAM;AACJV,QAAAA,EADI;AAEJW,QAAAA;AAFI,UAGFD,KAHJ;AAKA,YAAME,SAAS,GAAGlB,QAAQ,CAAE,mBAAkBM,EAAG,IAAvB,CAA1B;;AAEA,UAAI,CAACL,UAAU,CAACgB,QAAD,CAAX,IAAyB,CAACC,SAA9B,EAAyC;AACvC,eAAO,KAAP;AACD;;AAED,YAAMC,SAAS,GAAGnB,QAAQ,CAAC,6BAAD,EAAgCkB,SAAhC,CAA1B;AAEA,aAAOD,QAAQ,CAACE,SAAD,CAAf;AACD,KAfyB,CAA1B;AAiBAN,IAAAA,SAAS,CAACC,iBAAD,CAAT;AACD,GAnBQ,EAmBN,CAAEP,OAAF,CAnBM,CAAT;AAqBA,SAAO;AAAK,IAAA,KAAK,EAAC,4BAAX;AAAwC,qBAAgB,WAAWD,EAAnE;AAAA,eACL;AAAK,MAAA,KAAK,EAAGR,UAAU,CACrB,mCADqB,EAErBc,MAAM,GAAG,EAAH,GAAQ,OAFO,EAGrBH,IAAI,GAAE,MAAF,GAAW,EAHM,CAAvB;AAII,MAAA,OAAO,EAAGE,UAJd;AAAA,iBAKE;AAAK,QAAA,KAAK,EAAGH,KAAb;AAAqB,QAAA,KAAK,EAAC,yCAA3B;AAAA,kBACIA;AADJ,QALF,EAQE;AAAK,QAAA,KAAK,EAAC,2CAAX;AAAA,mBAEII,MAAM,IAAI,KAAC,UAAD,KAFd,EAIE;AACE,UAAA,KAAK,EAAC,gBADR;AAEE,UAAA,KAAK,EAAC,qEAFR;AAAA,oBAIE,KAAC,SAAD;AAAW,YAAA,KAAK,EAAGH,IAAI,GAAG,iCAAH,GAAuC;AAA9D;AAJF,UAJF;AAAA,QARF;AAAA,MADK,EAqBL;AAAK,MAAA,KAAK,EAAGX,UAAU,CACrB,oCADqB,EAErBW,IAAI,GAAG,MAAH,GAAY,EAFK,CAAvB;AAAA,gBAKIF,OAAO,CAACa,GAAR,CAAYC,CAAC,IAAIA,CAAC,CAACC,SAAnB;AALJ,MArBK;AAAA,IAAP;AA8BD;;AAED,SAASC,UAAT,GAAsB;AACpB,SACE;AAAK,IAAA,KAAK,EAAC,uBAAX;AAAmC,IAAA,KAAK,EAAC;AAAzC,IADF;AAGD","sourcesContent":["import {\n useEffect,\n useState\n} from 'preact/hooks';\n\nimport classnames from 'classnames';\n\nimport {\n query as domQuery\n} from 'min-dom';\n\nimport {\n isFunction\n} from 'min-dash';\n\nimport {\n useLayoutState\n} from '../hooks';\n\nimport { ArrowIcon } from './icons';\n\n/**\n * @param {import('../PropertiesPanel').GroupDefinition} props\n */\nexport default function Group(props) {\n const {\n id,\n entries = [],\n label\n } = props;\n\n const [ open, setOpen ] = useLayoutState(\n [ 'groups', id, 'open' ],\n false\n );\n const toggleOpen = () => setOpen(!open);\n\n const [ edited, setEdited ] = useState(false);\n\n // set edited state depending on all entries\n useEffect(() => {\n const hasOneEditedEntry = entries.find(entry => {\n const {\n id,\n isEdited\n } = entry;\n\n const entryNode = domQuery(`[data-entry-id=\"${id}\"]`);\n\n if (!isFunction(isEdited) || !entryNode) {\n return false;\n }\n\n const inputNode = domQuery('.bio-properties-panel-input', entryNode);\n\n return isEdited(inputNode);\n });\n\n setEdited(hasOneEditedEntry);\n }, [ entries ]);\n\n return <div class=\"bio-properties-panel-group\" data-group-id={ 'group-' + id }>\n <div class={ classnames(\n 'bio-properties-panel-group-header',\n edited ? '' : 'empty',\n open? 'open' : ''\n ) } onClick={ toggleOpen }>\n <div title={ label } class=\"bio-properties-panel-group-header-title\">\n { label }\n </div>\n <div class=\"bio-properties-panel-group-header-buttons\">\n {\n edited && <DataMarker />\n }\n <button\n title=\"Toggle section\"\n class=\"bio-properties-panel-group-header-button bio-properties-panel-arrow\"\n >\n <ArrowIcon class={ open ? 'bio-properties-panel-arrow-down' : 'bio-properties-panel-arrow-right' } />\n </button>\n </div>\n </div>\n <div class={ classnames(\n 'bio-properties-panel-group-entries',\n open ? 'open' : ''\n ) }>\n {\n entries.map(e => e.component)\n }\n </div>\n </div>;\n}\n\nfunction DataMarker() {\n return (\n <div title=\"Section contains data\" class=\"bio-properties-panel-dot\"></div>\n );\n}"],"file":"Group.js"}
|
package/lib/components/Header.js
DELETED
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "preact/jsx-runtime";
|
|
2
|
-
import { jsxs as _jsxs } from "preact/jsx-runtime";
|
|
3
|
-
|
|
4
|
-
/**
|
|
5
|
-
* @typedef { { getElementLabel: Function, getTypeLabel: Function, getElementIcon: Function } } HeaderProvider
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
* @param {Object} props
|
|
10
|
-
* @param {Object} props.element,
|
|
11
|
-
* @param {HeaderProvider} props.headerProvider
|
|
12
|
-
*/
|
|
13
|
-
export default function Header(props) {
|
|
14
|
-
const {
|
|
15
|
-
element,
|
|
16
|
-
headerProvider
|
|
17
|
-
} = props;
|
|
18
|
-
const {
|
|
19
|
-
getElementLabel,
|
|
20
|
-
getTypeLabel,
|
|
21
|
-
getElementIcon
|
|
22
|
-
} = headerProvider;
|
|
23
|
-
const label = getElementLabel(element);
|
|
24
|
-
const type = getTypeLabel(element);
|
|
25
|
-
const ElementIcon = getElementIcon(element);
|
|
26
|
-
return _jsxs("div", {
|
|
27
|
-
class: "bio-properties-panel-header",
|
|
28
|
-
children: [_jsx("div", {
|
|
29
|
-
class: "bio-properties-panel-header-icon",
|
|
30
|
-
children: ElementIcon && _jsx(ElementIcon, {
|
|
31
|
-
width: "32",
|
|
32
|
-
height: "32",
|
|
33
|
-
viewBox: "0 0 32 32"
|
|
34
|
-
})
|
|
35
|
-
}), _jsxs("div", {
|
|
36
|
-
class: "bio-properties-panel-header-labels",
|
|
37
|
-
children: [_jsx("div", {
|
|
38
|
-
title: type,
|
|
39
|
-
class: "bio-properties-panel-header-type",
|
|
40
|
-
children: type
|
|
41
|
-
}), getElementLabel(element) ? _jsx("div", {
|
|
42
|
-
title: label,
|
|
43
|
-
class: "bio-properties-panel-header-label",
|
|
44
|
-
children: label
|
|
45
|
-
}) : null]
|
|
46
|
-
})]
|
|
47
|
-
});
|
|
48
|
-
}
|
|
49
|
-
//# sourceMappingURL=Header.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/Header.js"],"names":["Header","props","element","headerProvider","getElementLabel","getTypeLabel","getElementIcon","label","type","ElementIcon"],"mappings":";;;AAAA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASA,MAAT,CAAgBC,KAAhB,EAAuB;AAEpC,QAAM;AACJC,IAAAA,OADI;AAEJC,IAAAA;AAFI,MAGFF,KAHJ;AAKA,QAAM;AACJG,IAAAA,eADI;AAEJC,IAAAA,YAFI;AAGJC,IAAAA;AAHI,MAIFH,cAJJ;AAMA,QAAMI,KAAK,GAAGH,eAAe,CAACF,OAAD,CAA7B;AACA,QAAMM,IAAI,GAAGH,YAAY,CAACH,OAAD,CAAzB;AACA,QAAMO,WAAW,GAAGH,cAAc,CAACJ,OAAD,CAAlC;AAEA,SAAQ;AAAK,IAAA,KAAK,EAAC,6BAAX;AAAA,eACN;AAAK,MAAA,KAAK,EAAC,kCAAX;AAAA,gBACIO,WAAW,IAAI,KAAC,WAAD;AAAa,QAAA,KAAK,EAAC,IAAnB;AAAwB,QAAA,MAAM,EAAC,IAA/B;AAAoC,QAAA,OAAO,EAAC;AAA5C;AADnB,MADM,EAIN;AAAK,MAAA,KAAK,EAAC,oCAAX;AAAA,iBACE;AAAK,QAAA,KAAK,EAAGD,IAAb;AAAoB,QAAA,KAAK,EAAC,kCAA1B;AAAA,kBAA+DA;AAA/D,QADF,EAEIJ,eAAe,CAACF,OAAD,CAAf,GACA;AAAK,QAAA,KAAK,EAAGK,KAAb;AAAqB,QAAA,KAAK,EAAC,mCAA3B;AAAA,kBAAiEA;AAAjE,QADA,GAEA,IAJJ;AAAA,MAJM;AAAA,IAAR;AAYD","sourcesContent":["/**\n * @typedef { { getElementLabel: Function, getTypeLabel: Function, getElementIcon: Function } } HeaderProvider\n */\n\n/**\n * @param {Object} props\n * @param {Object} props.element,\n * @param {HeaderProvider} props.headerProvider\n */\nexport default function Header(props) {\n\n const {\n element,\n headerProvider\n } = props;\n\n const {\n getElementLabel,\n getTypeLabel,\n getElementIcon\n } = headerProvider;\n\n const label = getElementLabel(element);\n const type = getTypeLabel(element);\n const ElementIcon = getElementIcon(element);\n\n return (<div class=\"bio-properties-panel-header\">\n <div class=\"bio-properties-panel-header-icon\">\n { ElementIcon && <ElementIcon width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" /> }\n </div>\n <div class=\"bio-properties-panel-header-labels\">\n <div title={ type } class=\"bio-properties-panel-header-type\">{ type }</div>\n { getElementLabel(element) ?\n <div title={ label } class=\"bio-properties-panel-header-label\">{ label }</div> :\n null\n }\n </div>\n </div>);\n}"],"file":"Header.js"}
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import classnames from 'classnames';
|
|
2
|
-
import { jsx as _jsx } from "preact/jsx-runtime";
|
|
3
|
-
export function HeaderButton(props) {
|
|
4
|
-
const {
|
|
5
|
-
children = null,
|
|
6
|
-
class: classname,
|
|
7
|
-
onClick = () => {},
|
|
8
|
-
...otherProps
|
|
9
|
-
} = props;
|
|
10
|
-
return _jsx("button", { ...otherProps,
|
|
11
|
-
onClick: onClick,
|
|
12
|
-
class: classnames('bio-properties-panel-group-header-button', classname),
|
|
13
|
-
children: children
|
|
14
|
-
});
|
|
15
|
-
}
|
|
16
|
-
//# sourceMappingURL=HeaderButton.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/HeaderButton.js"],"names":["classnames","HeaderButton","props","children","class","classname","onClick","otherProps"],"mappings":"AAAA,OAAOA,UAAP,MAAuB,YAAvB;;AAEA,OAAO,SAASC,YAAT,CAAsBC,KAAtB,EAA6B;AAClC,QAAM;AACJC,IAAAA,QAAQ,GAAG,IADP;AAEJC,IAAAA,KAAK,EAAEC,SAFH;AAGJC,IAAAA,OAAO,GAAG,MAAM,CAAE,CAHd;AAIJ,OAAGC;AAJC,MAKFL,KALJ;AAOA,SAAO,oBACAK,UADA;AAEL,IAAA,OAAO,EAAGD,OAFL;AAGL,IAAA,KAAK,EAAGN,UAAU,CAAC,0CAAD,EAA6CK,SAA7C,CAHb;AAAA,cAIHF;AAJG,IAAP;AAMD","sourcesContent":["import classnames from 'classnames';\n\nexport function HeaderButton(props) {\n const {\n children = null,\n class: classname,\n onClick = () => {},\n ...otherProps\n } = props;\n\n return <button\n { ...otherProps }\n onClick={ onClick }\n class={ classnames('bio-properties-panel-group-header-button', classname) }>\n { children }\n </button>;\n}\n"],"file":"HeaderButton.js"}
|
|
@@ -1,167 +0,0 @@
|
|
|
1
|
-
import { useEffect, useState } from 'preact/hooks';
|
|
2
|
-
import classnames from 'classnames';
|
|
3
|
-
import { find, sortBy } from 'min-dash';
|
|
4
|
-
import { useLayoutState, usePrevious } from '../hooks';
|
|
5
|
-
import ListItem from './ListItem';
|
|
6
|
-
import { ArrowIcon, CreateIcon } from './icons';
|
|
7
|
-
import { jsx as _jsx } from "preact/jsx-runtime";
|
|
8
|
-
import { jsxs as _jsxs } from "preact/jsx-runtime";
|
|
9
|
-
|
|
10
|
-
const noop = () => {};
|
|
11
|
-
/**
|
|
12
|
-
* @param {import('../PropertiesPanel').ListGroupDefinition} props
|
|
13
|
-
*/
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
export default function ListGroup(props) {
|
|
17
|
-
const {
|
|
18
|
-
element,
|
|
19
|
-
id,
|
|
20
|
-
items,
|
|
21
|
-
label,
|
|
22
|
-
add,
|
|
23
|
-
shouldSort = true,
|
|
24
|
-
shouldOpen = true
|
|
25
|
-
} = props;
|
|
26
|
-
const [open, setOpen] = useLayoutState(['groups', id, 'open'], false);
|
|
27
|
-
const [ordering, setOrdering] = useState([]);
|
|
28
|
-
const [newItemAdded, setNewItemAdded] = useState(false);
|
|
29
|
-
const prevItems = usePrevious(items);
|
|
30
|
-
const prevElement = usePrevious(element);
|
|
31
|
-
const elementChanged = element !== prevElement;
|
|
32
|
-
const shouldHandleEffects = !elementChanged && (shouldSort || shouldOpen); // reset initial ordering when element changes (before first render)
|
|
33
|
-
|
|
34
|
-
if (elementChanged) {
|
|
35
|
-
setOrdering(createOrdering(shouldSort ? sortItems(items) : items));
|
|
36
|
-
} // keep ordering in sync to items - and open changes
|
|
37
|
-
// (0) set initial ordering from given items
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
useEffect(() => {
|
|
41
|
-
if (!prevItems || !shouldSort) {
|
|
42
|
-
setOrdering(createOrdering(items));
|
|
43
|
-
}
|
|
44
|
-
}, [items, element]); // (1) items were added
|
|
45
|
-
|
|
46
|
-
useEffect(() => {
|
|
47
|
-
if (shouldHandleEffects && prevItems && items.length > prevItems.length) {
|
|
48
|
-
let add = [];
|
|
49
|
-
items.forEach(item => {
|
|
50
|
-
if (!ordering.includes(item.id)) {
|
|
51
|
-
add.push(item.id);
|
|
52
|
-
}
|
|
53
|
-
});
|
|
54
|
-
let newOrdering = ordering; // open if not open and configured
|
|
55
|
-
|
|
56
|
-
if (!open && shouldOpen) {
|
|
57
|
-
toggleOpen(); // if I opened and I should sort, then sort items
|
|
58
|
-
|
|
59
|
-
if (shouldSort) {
|
|
60
|
-
newOrdering = createOrdering(sortItems(items));
|
|
61
|
-
}
|
|
62
|
-
} // add new items on top or bottom depending on sorting behavior
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
newOrdering = newOrdering.filter(item => !add.includes(item));
|
|
66
|
-
|
|
67
|
-
if (shouldSort) {
|
|
68
|
-
newOrdering.unshift(...add);
|
|
69
|
-
} else {
|
|
70
|
-
newOrdering.push(...add);
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
setOrdering(newOrdering);
|
|
74
|
-
setNewItemAdded(true);
|
|
75
|
-
} else {
|
|
76
|
-
setNewItemAdded(false);
|
|
77
|
-
}
|
|
78
|
-
}, [items, open, shouldHandleEffects]); // (2) sort items on open if shouldSort is set
|
|
79
|
-
|
|
80
|
-
useEffect(() => {
|
|
81
|
-
if (shouldSort && open && !newItemAdded) {
|
|
82
|
-
setOrdering(createOrdering(sortItems(items)));
|
|
83
|
-
}
|
|
84
|
-
}, [open, shouldSort]); // (3) items were deleted
|
|
85
|
-
|
|
86
|
-
useEffect(() => {
|
|
87
|
-
if (shouldHandleEffects && prevItems && items.length < prevItems.length) {
|
|
88
|
-
let keep = [];
|
|
89
|
-
ordering.forEach(o => {
|
|
90
|
-
if (getItem(items, o)) {
|
|
91
|
-
keep.push(o);
|
|
92
|
-
}
|
|
93
|
-
});
|
|
94
|
-
setOrdering(keep);
|
|
95
|
-
}
|
|
96
|
-
}, [items, shouldHandleEffects]);
|
|
97
|
-
|
|
98
|
-
const toggleOpen = () => setOpen(!open);
|
|
99
|
-
|
|
100
|
-
const hasItems = !!items.length;
|
|
101
|
-
return _jsxs("div", {
|
|
102
|
-
class: "bio-properties-panel-group",
|
|
103
|
-
"data-group-id": 'group-' + id,
|
|
104
|
-
children: [_jsxs("div", {
|
|
105
|
-
class: classnames('bio-properties-panel-group-header', hasItems ? '' : 'empty', hasItems && open ? 'open' : ''),
|
|
106
|
-
onClick: hasItems ? toggleOpen : noop,
|
|
107
|
-
children: [_jsx("div", {
|
|
108
|
-
title: label,
|
|
109
|
-
class: "bio-properties-panel-group-header-title",
|
|
110
|
-
children: label
|
|
111
|
-
}), _jsxs("div", {
|
|
112
|
-
class: "bio-properties-panel-group-header-buttons",
|
|
113
|
-
children: [add ? _jsxs("button", {
|
|
114
|
-
title: "Create new list item",
|
|
115
|
-
class: "bio-properties-panel-group-header-button bio-properties-panel-add-entry",
|
|
116
|
-
onClick: add,
|
|
117
|
-
children: [_jsx(CreateIcon, {}), !hasItems ? _jsx("span", {
|
|
118
|
-
class: "bio-properties-panel-add-entry-label",
|
|
119
|
-
children: "Create"
|
|
120
|
-
}) : null]
|
|
121
|
-
}) : null, hasItems ? _jsx("div", {
|
|
122
|
-
title: `List contains ${items.length} item${items.length != 1 ? 's' : ''}`,
|
|
123
|
-
class: "bio-properties-panel-list-badge",
|
|
124
|
-
children: items.length
|
|
125
|
-
}) : null, hasItems ? _jsx("button", {
|
|
126
|
-
title: "Toggle section",
|
|
127
|
-
class: "bio-properties-panel-group-header-button bio-properties-panel-arrow",
|
|
128
|
-
children: _jsx(ArrowIcon, {
|
|
129
|
-
class: open ? 'bio-properties-panel-arrow-down' : 'bio-properties-panel-arrow-right'
|
|
130
|
-
})
|
|
131
|
-
}) : null]
|
|
132
|
-
})]
|
|
133
|
-
}), _jsx("div", {
|
|
134
|
-
class: classnames('bio-properties-panel-list', open && hasItems ? 'open' : ''),
|
|
135
|
-
children: ordering.map((o, index) => {
|
|
136
|
-
const item = getItem(items, o);
|
|
137
|
-
|
|
138
|
-
if (!item) {
|
|
139
|
-
return;
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
return _jsx(ListItem, {
|
|
143
|
-
// if item was added, open first or last item based on ordering
|
|
144
|
-
autoOpen: newItemAdded && (shouldSort ? index === 0 : index === ordering.length - 1),
|
|
145
|
-
...item
|
|
146
|
-
}, item.id);
|
|
147
|
-
})
|
|
148
|
-
})]
|
|
149
|
-
});
|
|
150
|
-
} // helpers ////////////////////
|
|
151
|
-
|
|
152
|
-
/**
|
|
153
|
-
* Sorts given items alphanumeric by label
|
|
154
|
-
*/
|
|
155
|
-
|
|
156
|
-
function sortItems(items) {
|
|
157
|
-
return sortBy(items, i => i.label.toLowerCase());
|
|
158
|
-
}
|
|
159
|
-
|
|
160
|
-
function getItem(items, id) {
|
|
161
|
-
return find(items, i => i.id === id);
|
|
162
|
-
}
|
|
163
|
-
|
|
164
|
-
function createOrdering(items) {
|
|
165
|
-
return items.map(i => i.id);
|
|
166
|
-
}
|
|
167
|
-
//# sourceMappingURL=ListGroup.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/ListGroup.js"],"names":["useEffect","useState","classnames","find","sortBy","useLayoutState","usePrevious","ListItem","ArrowIcon","CreateIcon","noop","ListGroup","props","element","id","items","label","add","shouldSort","shouldOpen","open","setOpen","ordering","setOrdering","newItemAdded","setNewItemAdded","prevItems","prevElement","elementChanged","shouldHandleEffects","createOrdering","sortItems","length","forEach","item","includes","push","newOrdering","toggleOpen","filter","unshift","keep","o","getItem","hasItems","map","index","i","toLowerCase"],"mappings":"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","sourcesContent":["import {\n useEffect,\n useState\n} from 'preact/hooks';\n\nimport classnames from 'classnames';\n\nimport {\n find,\n sortBy\n} from 'min-dash';\n\nimport {\n useLayoutState,\n usePrevious\n} from '../hooks';\n\nimport ListItem from './ListItem';\n\nimport {\n ArrowIcon,\n CreateIcon\n} from './icons';\n\nconst noop = () => {};\n\n/**\n * @param {import('../PropertiesPanel').ListGroupDefinition} props\n */\nexport default function ListGroup(props) {\n const {\n element,\n id,\n items,\n label,\n add,\n shouldSort = true,\n shouldOpen = true\n } = props;\n\n\n const [ open, setOpen ] = useLayoutState(\n [ 'groups', id, 'open' ],\n false\n );\n\n const [ ordering, setOrdering ] = useState([]);\n const [ newItemAdded, setNewItemAdded ] = useState(false);\n\n const prevItems = usePrevious(items);\n const prevElement = usePrevious(element);\n\n const elementChanged = element !== prevElement;\n const shouldHandleEffects = !elementChanged && (shouldSort || shouldOpen);\n\n // reset initial ordering when element changes (before first render)\n if (elementChanged) {\n setOrdering(createOrdering(shouldSort ? sortItems(items) : items));\n }\n\n // keep ordering in sync to items - and open changes\n\n // (0) set initial ordering from given items\n useEffect(() => {\n if (!prevItems || !shouldSort) {\n setOrdering(createOrdering(items));\n }\n }, [ items, element ]);\n\n // (1) items were added\n useEffect(() => {\n if (shouldHandleEffects && prevItems && items.length > prevItems.length) {\n\n let add = [];\n\n items.forEach(item => {\n if (!ordering.includes(item.id)) {\n add.push(item.id);\n }\n });\n\n let newOrdering = ordering;\n\n // open if not open and configured\n if (!open && shouldOpen) {\n toggleOpen();\n\n // if I opened and I should sort, then sort items\n if (shouldSort) {\n newOrdering = createOrdering(sortItems(items));\n }\n }\n\n // add new items on top or bottom depending on sorting behavior\n newOrdering = newOrdering.filter(item => !add.includes(item));\n if (shouldSort) {\n newOrdering.unshift(...add);\n } else {\n newOrdering.push(...add);\n }\n\n setOrdering(newOrdering);\n setNewItemAdded(true);\n } else {\n setNewItemAdded(false);\n }\n }, [ items, open, shouldHandleEffects ]);\n\n // (2) sort items on open if shouldSort is set\n useEffect(() => {\n\n if (shouldSort && open && !newItemAdded) {\n setOrdering(createOrdering(sortItems(items)));\n }\n }, [ open, shouldSort ]);\n\n // (3) items were deleted\n useEffect(() => {\n if (shouldHandleEffects && prevItems && items.length < prevItems.length) {\n let keep = [];\n\n ordering.forEach(o => {\n if (getItem(items, o)) {\n keep.push(o);\n }\n });\n\n setOrdering(keep);\n }\n }, [ items, shouldHandleEffects ]);\n\n const toggleOpen = () => setOpen(!open);\n\n const hasItems = !!items.length;\n\n return <div class=\"bio-properties-panel-group\" data-group-id={ 'group-' + id }>\n <div\n class={ classnames(\n 'bio-properties-panel-group-header',\n hasItems ? '' : 'empty',\n (hasItems && open) ? 'open' : ''\n ) }\n onClick={ hasItems ? toggleOpen : noop }>\n <div\n title={ label }\n class=\"bio-properties-panel-group-header-title\"\n >\n { label }\n </div>\n <div class=\"bio-properties-panel-group-header-buttons\">\n {\n add\n ? (\n <button\n title=\"Create new list item\"\n class=\"bio-properties-panel-group-header-button bio-properties-panel-add-entry\"\n onClick={ add }\n >\n <CreateIcon />\n {\n !hasItems ? (\n <span class=\"bio-properties-panel-add-entry-label\">Create</span>\n )\n : null\n }\n </button>\n )\n : null\n }\n {\n hasItems\n ? (\n <div\n title={ `List contains ${items.length} item${items.length != 1 ? 's' : ''}` }\n class=\"bio-properties-panel-list-badge\"\n >\n { items.length }\n </div>\n )\n : null\n }\n {\n hasItems\n ? (\n <button\n title=\"Toggle section\"\n class=\"bio-properties-panel-group-header-button bio-properties-panel-arrow\"\n >\n <ArrowIcon class={ open ? 'bio-properties-panel-arrow-down' : 'bio-properties-panel-arrow-right' } />\n </button>\n )\n : null\n }\n </div>\n </div>\n <div class={ classnames(\n 'bio-properties-panel-list',\n open && hasItems ? 'open' : ''\n ) }>\n {\n ordering.map((o, index) => {\n const item = getItem(items, o);\n\n if (!item) {\n return;\n }\n\n return (\n <ListItem\n key={ item.id }\n\n // if item was added, open first or last item based on ordering\n autoOpen={ newItemAdded && (shouldSort ? index === 0 : index === ordering.length - 1) }\n { ...item } />\n );\n })\n }\n </div>\n </div>;\n}\n\n\n// helpers ////////////////////\n\n/**\n * Sorts given items alphanumeric by label\n */\nfunction sortItems(items) {\n return sortBy(items, i => i.label.toLowerCase());\n}\n\nfunction getItem(items, id) {\n return find(items, i => i.id === id);\n}\n\nfunction createOrdering(items) {\n return items.map(i => i.id);\n}\n"],"file":"ListGroup.js"}
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import { useEffect } from 'preact/hooks';
|
|
2
|
-
import { query as domQuery } from 'min-dom';
|
|
3
|
-
import { isFunction } from 'min-dash';
|
|
4
|
-
import CollapsibleEntry from './entries/Collapsible';
|
|
5
|
-
/**
|
|
6
|
-
* @param {import('../PropertiesPanel').ListItemDefinition} props
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
import { jsx as _jsx } from "preact/jsx-runtime";
|
|
10
|
-
export default function ListItem(props) {
|
|
11
|
-
const {
|
|
12
|
-
autoOpen,
|
|
13
|
-
autoFocusEntry
|
|
14
|
-
} = props; // focus specified entry on auto open
|
|
15
|
-
|
|
16
|
-
useEffect(() => {
|
|
17
|
-
if (autoOpen && autoFocusEntry) {
|
|
18
|
-
const entry = domQuery(`[data-entry-id="${autoFocusEntry}"]`);
|
|
19
|
-
const focusableInput = domQuery('.bio-properties-panel-input', entry);
|
|
20
|
-
|
|
21
|
-
if (focusableInput) {
|
|
22
|
-
if (isFunction(focusableInput.select)) {
|
|
23
|
-
focusableInput.select();
|
|
24
|
-
} else if (isFunction(focusableInput.focus)) {
|
|
25
|
-
focusableInput.focus();
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
}, [autoOpen, autoFocusEntry]);
|
|
30
|
-
return _jsx("div", {
|
|
31
|
-
class: "bio-properties-panel-list-item",
|
|
32
|
-
children: _jsx(CollapsibleEntry, { ...props,
|
|
33
|
-
open: autoOpen
|
|
34
|
-
})
|
|
35
|
-
});
|
|
36
|
-
}
|
|
37
|
-
//# sourceMappingURL=ListItem.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/ListItem.js"],"names":["useEffect","query","domQuery","isFunction","CollapsibleEntry","ListItem","props","autoOpen","autoFocusEntry","entry","focusableInput","select","focus"],"mappings":"AAAA,SACEA,SADF,QAEO,cAFP;AAIA,SACEC,KAAK,IAAIC,QADX,QAEO,SAFP;AAIA,SAASC,UAAT,QAA2B,UAA3B;AAEA,OAAOC,gBAAP,MAA6B,uBAA7B;AAEA;AACA;AACA;;;AACA,eAAe,SAASC,QAAT,CAAkBC,KAAlB,EAAyB;AACtC,QAAM;AACJC,IAAAA,QADI;AAEJC,IAAAA;AAFI,MAGFF,KAHJ,CADsC,CAMtC;;AACAN,EAAAA,SAAS,CAAC,MAAM;AACd,QAAIO,QAAQ,IAAIC,cAAhB,EAAgC;AAC9B,YAAMC,KAAK,GAAGP,QAAQ,CAAE,mBAAkBM,cAAe,IAAnC,CAAtB;AAEA,YAAME,cAAc,GAAGR,QAAQ,CAAC,6BAAD,EAAgCO,KAAhC,CAA/B;;AAEA,UAAIC,cAAJ,EAAoB;AAElB,YAAIP,UAAU,CAACO,cAAc,CAACC,MAAhB,CAAd,EAAuC;AACrCD,UAAAA,cAAc,CAACC,MAAf;AACD,SAFD,MAEO,IAAIR,UAAU,CAACO,cAAc,CAACE,KAAhB,CAAd,EAAsC;AAC3CF,UAAAA,cAAc,CAACE,KAAf;AACD;AAEF;AACF;AACF,GAhBQ,EAgBN,CAAEL,QAAF,EAAYC,cAAZ,CAhBM,CAAT;AAmBA,SACE;AAAK,IAAA,KAAK,EAAC,gCAAX;AAAA,cACE,KAAC,gBAAD,OAAuBF,KAAvB;AAA+B,MAAA,IAAI,EAAGC;AAAtC;AADF,IADF;AAMD","sourcesContent":["import {\n useEffect\n} from 'preact/hooks';\n\nimport {\n query as domQuery\n} from 'min-dom';\n\nimport { isFunction } from 'min-dash';\n\nimport CollapsibleEntry from './entries/Collapsible';\n\n/**\n * @param {import('../PropertiesPanel').ListItemDefinition} props\n */\nexport default function ListItem(props) {\n const {\n autoOpen,\n autoFocusEntry\n } = props;\n\n // focus specified entry on auto open\n useEffect(() => {\n if (autoOpen && autoFocusEntry) {\n const entry = domQuery(`[data-entry-id=\"${autoFocusEntry}\"]`);\n\n const focusableInput = domQuery('.bio-properties-panel-input', entry);\n\n if (focusableInput) {\n\n if (isFunction(focusableInput.select)) {\n focusableInput.select();\n } else if (isFunction(focusableInput.focus)) {\n focusableInput.focus();\n }\n\n }\n }\n }, [ autoOpen, autoFocusEntry ]);\n\n\n return (\n <div class=\"bio-properties-panel-list-item\">\n <CollapsibleEntry { ...props } open={ autoOpen } />\n </div>\n );\n\n}\n"],"file":"ListItem.js"}
|
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
import Description from './Description';
|
|
2
|
-
import { jsx as _jsx } from "preact/jsx-runtime";
|
|
3
|
-
import { jsxs as _jsxs } from "preact/jsx-runtime";
|
|
4
|
-
|
|
5
|
-
function Checkbox(props) {
|
|
6
|
-
const {
|
|
7
|
-
id,
|
|
8
|
-
label,
|
|
9
|
-
onChange,
|
|
10
|
-
disabled,
|
|
11
|
-
value = false
|
|
12
|
-
} = props;
|
|
13
|
-
|
|
14
|
-
const handleChange = ({
|
|
15
|
-
target
|
|
16
|
-
}) => {
|
|
17
|
-
onChange(target.checked);
|
|
18
|
-
};
|
|
19
|
-
|
|
20
|
-
return _jsxs("div", {
|
|
21
|
-
class: "bio-properties-panel-checkbox",
|
|
22
|
-
children: [_jsx("input", {
|
|
23
|
-
id: prefixId(id),
|
|
24
|
-
name: id,
|
|
25
|
-
type: "checkbox",
|
|
26
|
-
class: "bio-properties-panel-input",
|
|
27
|
-
onChange: handleChange,
|
|
28
|
-
checked: value,
|
|
29
|
-
disabled: disabled
|
|
30
|
-
}), _jsx("label", {
|
|
31
|
-
for: prefixId(id),
|
|
32
|
-
class: "bio-properties-panel-label",
|
|
33
|
-
children: label
|
|
34
|
-
})]
|
|
35
|
-
});
|
|
36
|
-
}
|
|
37
|
-
/**
|
|
38
|
-
* @param {Object} props
|
|
39
|
-
* @param {Object} props.element
|
|
40
|
-
* @param {String} props.id
|
|
41
|
-
* @param {String} props.description
|
|
42
|
-
* @param {String} props.label
|
|
43
|
-
* @param {Function} props.getValue
|
|
44
|
-
* @param {Function} props.setValue
|
|
45
|
-
* @param {boolean} [props.disabled]
|
|
46
|
-
*/
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
export default function CheckboxEntry(props) {
|
|
50
|
-
const {
|
|
51
|
-
element,
|
|
52
|
-
id,
|
|
53
|
-
description,
|
|
54
|
-
label,
|
|
55
|
-
getValue,
|
|
56
|
-
setValue,
|
|
57
|
-
disabled
|
|
58
|
-
} = props;
|
|
59
|
-
const value = getValue(element);
|
|
60
|
-
return _jsxs("div", {
|
|
61
|
-
class: "bio-properties-panel-entry bio-properties-panel-checkbox-entry",
|
|
62
|
-
"data-entry-id": id,
|
|
63
|
-
children: [_jsx(Checkbox, {
|
|
64
|
-
id: id,
|
|
65
|
-
label: label,
|
|
66
|
-
onChange: setValue,
|
|
67
|
-
value: value,
|
|
68
|
-
disabled: disabled
|
|
69
|
-
}), _jsx(Description, {
|
|
70
|
-
forId: id,
|
|
71
|
-
element: element,
|
|
72
|
-
value: description
|
|
73
|
-
})]
|
|
74
|
-
});
|
|
75
|
-
}
|
|
76
|
-
export function isEdited(node) {
|
|
77
|
-
return node && !!node.checked;
|
|
78
|
-
} // helpers /////////////////
|
|
79
|
-
|
|
80
|
-
function prefixId(id) {
|
|
81
|
-
return `bio-properties-panel-${id}`;
|
|
82
|
-
}
|
|
83
|
-
//# sourceMappingURL=Checkbox.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/entries/Checkbox.js"],"names":["Description","Checkbox","props","id","label","onChange","disabled","value","handleChange","target","checked","prefixId","CheckboxEntry","element","description","getValue","setValue","isEdited","node"],"mappings":"AAAA,OAAOA,WAAP,MAAwB,eAAxB;;;;AAEA,SAASC,QAAT,CAAkBC,KAAlB,EAAyB;AACvB,QAAM;AACJC,IAAAA,EADI;AAEJC,IAAAA,KAFI;AAGJC,IAAAA,QAHI;AAIJC,IAAAA,QAJI;AAKJC,IAAAA,KAAK,GAAG;AALJ,MAMFL,KANJ;;AAQA,QAAMM,YAAY,GAAG,CAAC;AAAEC,IAAAA;AAAF,GAAD,KAAgB;AACnCJ,IAAAA,QAAQ,CAACI,MAAM,CAACC,OAAR,CAAR;AACD,GAFD;;AAIA,SACE;AAAK,IAAA,KAAK,EAAC,+BAAX;AAAA,eACE;AACE,MAAA,EAAE,EAAGC,QAAQ,CAACR,EAAD,CADf;AAEE,MAAA,IAAI,EAAGA,EAFT;AAGE,MAAA,IAAI,EAAC,UAHP;AAIE,MAAA,KAAK,EAAC,4BAJR;AAKE,MAAA,QAAQ,EAAGK,YALb;AAME,MAAA,OAAO,EAAGD,KANZ;AAOE,MAAA,QAAQ,EAAGD;AAPb,MADF,EASE;AAAO,MAAA,GAAG,EAAGK,QAAQ,CAACR,EAAD,CAArB;AAA4B,MAAA,KAAK,EAAC,4BAAlC;AAAA,gBAAiEC;AAAjE,MATF;AAAA,IADF;AAaD;AAGD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,eAAe,SAASQ,aAAT,CAAuBV,KAAvB,EAA8B;AAC3C,QAAM;AACJW,IAAAA,OADI;AAEJV,IAAAA,EAFI;AAGJW,IAAAA,WAHI;AAIJV,IAAAA,KAJI;AAKJW,IAAAA,QALI;AAMJC,IAAAA,QANI;AAOJV,IAAAA;AAPI,MAQFJ,KARJ;AAUA,QAAMK,KAAK,GAAGQ,QAAQ,CAACF,OAAD,CAAtB;AAEA,SACE;AAAK,IAAA,KAAK,EAAC,gEAAX;AAA4E,qBAAgBV,EAA5F;AAAA,eACE,KAAC,QAAD;AAAU,MAAA,EAAE,EAAGA,EAAf;AAAoB,MAAA,KAAK,EAAGC,KAA5B;AAAoC,MAAA,QAAQ,EAAGY,QAA/C;AAA0D,MAAA,KAAK,EAAGT,KAAlE;AAA0E,MAAA,QAAQ,EAAGD;AAArF,MADF,EAEE,KAAC,WAAD;AAAa,MAAA,KAAK,EAAGH,EAArB;AAA0B,MAAA,OAAO,EAAGU,OAApC;AAA8C,MAAA,KAAK,EAAGC;AAAtD,MAFF;AAAA,IADF;AAMD;AAED,OAAO,SAASG,QAAT,CAAkBC,IAAlB,EAAwB;AAC7B,SAAOA,IAAI,IAAI,CAAC,CAACA,IAAI,CAACR,OAAtB;AACD,C,CAGD;;AAEA,SAASC,QAAT,CAAkBR,EAAlB,EAAsB;AACpB,SAAQ,wBAAwBA,EAAI,EAApC;AACD","sourcesContent":["import Description from './Description';\n\nfunction Checkbox(props) {\n const {\n id,\n label,\n onChange,\n disabled,\n value = false\n } = props;\n\n const handleChange = ({ target }) => {\n onChange(target.checked);\n };\n\n return (\n <div class=\"bio-properties-panel-checkbox\">\n <input\n id={ prefixId(id) }\n name={ id }\n type=\"checkbox\"\n class=\"bio-properties-panel-input\"\n onChange={ handleChange }\n checked={ value }\n disabled={ disabled } />\n <label for={ prefixId(id) } class=\"bio-properties-panel-label\">{ label }</label>\n </div>\n );\n}\n\n\n/**\n * @param {Object} props\n * @param {Object} props.element\n * @param {String} props.id\n * @param {String} props.description\n * @param {String} props.label\n * @param {Function} props.getValue\n * @param {Function} props.setValue\n * @param {boolean} [props.disabled]\n */\nexport default function CheckboxEntry(props) {\n const {\n element,\n id,\n description,\n label,\n getValue,\n setValue,\n disabled\n } = props;\n\n const value = getValue(element);\n\n return (\n <div class=\"bio-properties-panel-entry bio-properties-panel-checkbox-entry\" data-entry-id={ id }>\n <Checkbox id={ id } label={ label } onChange={ setValue } value={ value } disabled={ disabled } />\n <Description forId={ id } element={ element } value={ description } />\n </div>\n );\n}\n\nexport function isEdited(node) {\n return node && !!node.checked;\n}\n\n\n// helpers /////////////////\n\nfunction prefixId(id) {\n return `bio-properties-panel-${ id }`;\n}\n"],"file":"Checkbox.js"}
|
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
import { useState } from 'preact/hooks';
|
|
2
|
-
import classnames from 'classnames';
|
|
3
|
-
import { ArrowIcon, DeleteIcon } from '../icons';
|
|
4
|
-
import { jsx as _jsx } from "preact/jsx-runtime";
|
|
5
|
-
import { jsxs as _jsxs } from "preact/jsx-runtime";
|
|
6
|
-
export default function CollapsibleEntry(props) {
|
|
7
|
-
const {
|
|
8
|
-
id,
|
|
9
|
-
entries = [],
|
|
10
|
-
label,
|
|
11
|
-
remove,
|
|
12
|
-
open: shouldOpen
|
|
13
|
-
} = props;
|
|
14
|
-
const [open, setOpen] = useState(shouldOpen);
|
|
15
|
-
|
|
16
|
-
const toggleOpen = () => setOpen(!open); // todo(pinussilvestrus): translate once we have a translate mechanism for the core
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
const placeholderLabel = '<empty>';
|
|
20
|
-
return _jsxs("div", {
|
|
21
|
-
"data-entry-id": id,
|
|
22
|
-
class: classnames('bio-properties-panel-collapsible-entry', open ? 'open' : ''),
|
|
23
|
-
children: [_jsxs("div", {
|
|
24
|
-
class: "bio-properties-panel-collapsible-entry-header",
|
|
25
|
-
onClick: toggleOpen,
|
|
26
|
-
children: [_jsx("div", {
|
|
27
|
-
title: label || placeholderLabel,
|
|
28
|
-
class: classnames('bio-properties-panel-collapsible-entry-header-title', !label && 'empty'),
|
|
29
|
-
children: label || placeholderLabel
|
|
30
|
-
}), _jsx("button", {
|
|
31
|
-
title: "Toggle list item",
|
|
32
|
-
class: "bio-properties-panel-arrow bio-properties-panel-collapsible-entry-arrow",
|
|
33
|
-
children: _jsx(ArrowIcon, {
|
|
34
|
-
class: open ? 'bio-properties-panel-arrow-down' : 'bio-properties-panel-arrow-right'
|
|
35
|
-
})
|
|
36
|
-
}), remove ? _jsx("button", {
|
|
37
|
-
title: "Delete item",
|
|
38
|
-
class: "bio-properties-panel-remove-entry",
|
|
39
|
-
onClick: remove,
|
|
40
|
-
children: _jsx(DeleteIcon, {})
|
|
41
|
-
}) : null]
|
|
42
|
-
}), _jsx("div", {
|
|
43
|
-
class: classnames('bio-properties-panel-collapsible-entry-entries', open ? 'open' : ''),
|
|
44
|
-
children: entries.map(e => e.component)
|
|
45
|
-
})]
|
|
46
|
-
});
|
|
47
|
-
}
|
|
48
|
-
//# sourceMappingURL=Collapsible.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/entries/Collapsible.js"],"names":["useState","classnames","ArrowIcon","DeleteIcon","CollapsibleEntry","props","id","entries","label","remove","open","shouldOpen","setOpen","toggleOpen","placeholderLabel","map","e","component"],"mappings":"AAAA,SACEA,QADF,QAEO,cAFP;AAIA,OAAOC,UAAP,MAAuB,YAAvB;AAEA,SACEC,SADF,EAEEC,UAFF,QAGO,UAHP;;;AAMA,eAAe,SAASC,gBAAT,CAA0BC,KAA1B,EAAiC;AAC9C,QAAM;AACJC,IAAAA,EADI;AAEJC,IAAAA,OAAO,GAAG,EAFN;AAGJC,IAAAA,KAHI;AAIJC,IAAAA,MAJI;AAKJC,IAAAA,IAAI,EAAEC;AALF,MAMFN,KANJ;AAQA,QAAM,CAAEK,IAAF,EAAQE,OAAR,IAAoBZ,QAAQ,CAACW,UAAD,CAAlC;;AAEA,QAAME,UAAU,GAAG,MAAMD,OAAO,CAAC,CAACF,IAAF,CAAhC,CAX8C,CAa9C;;;AACA,QAAMI,gBAAgB,GAAG,SAAzB;AAEA,SACE;AACE,qBAAgBR,EADlB;AAEE,IAAA,KAAK,EAAGL,UAAU,CAChB,wCADgB,EAEhBS,IAAI,GAAG,MAAH,GAAY,EAFA,CAFpB;AAAA,eAME;AAAK,MAAA,KAAK,EAAC,+CAAX;AAA2D,MAAA,OAAO,EAAGG,UAArE;AAAA,iBACE;AACE,QAAA,KAAK,EAAGL,KAAK,IAAIM,gBADnB;AAEE,QAAA,KAAK,EAAGb,UAAU,CAChB,qDADgB,EAEhB,CAACO,KAAD,IAAU,OAFM,CAFpB;AAAA,kBAMIA,KAAK,IAAIM;AANb,QADF,EASE;AACE,QAAA,KAAK,EAAC,kBADR;AAEE,QAAA,KAAK,EAAC,0EAFR;AAAA,kBAIE,KAAC,SAAD;AAAW,UAAA,KAAK,EAAGJ,IAAI,GAAG,iCAAH,GAAuC;AAA9D;AAJF,QATF,EAgBID,MAAM,GAGF;AAAQ,QAAA,KAAK,EAAC,aAAd;AAA4B,QAAA,KAAK,EAAC,mCAAlC;AAAsE,QAAA,OAAO,EAAGA,MAAhF;AAAA,kBACE,KAAC,UAAD;AADF,QAHE,GAOF,IAvBR;AAAA,MANF,EAgCE;AAAK,MAAA,KAAK,EAAGR,UAAU,CACrB,gDADqB,EAErBS,IAAI,GAAG,MAAH,GAAY,EAFK,CAAvB;AAAA,gBAKIH,OAAO,CAACQ,GAAR,CAAYC,CAAC,IAAIA,CAAC,CAACC,SAAnB;AALJ,MAhCF;AAAA,IADF;AA2CD","sourcesContent":["import {\n useState\n} from 'preact/hooks';\n\nimport classnames from 'classnames';\n\nimport {\n ArrowIcon,\n DeleteIcon,\n} from '../icons';\n\n\nexport default function CollapsibleEntry(props) {\n const {\n id,\n entries = [],\n label,\n remove,\n open: shouldOpen\n } = props;\n\n const [ open, setOpen ] = useState(shouldOpen);\n\n const toggleOpen = () => setOpen(!open);\n\n // todo(pinussilvestrus): translate once we have a translate mechanism for the core\n const placeholderLabel = '<empty>';\n\n return (\n <div\n data-entry-id={ id }\n class={ classnames(\n 'bio-properties-panel-collapsible-entry',\n open ? 'open' : ''\n ) }>\n <div class=\"bio-properties-panel-collapsible-entry-header\" onClick={ toggleOpen }>\n <div\n title={ label || placeholderLabel }\n class={ classnames(\n 'bio-properties-panel-collapsible-entry-header-title',\n !label && 'empty'\n ) }>\n { label || placeholderLabel }\n </div>\n <button\n title=\"Toggle list item\"\n class=\"bio-properties-panel-arrow bio-properties-panel-collapsible-entry-arrow\"\n >\n <ArrowIcon class={ open ? 'bio-properties-panel-arrow-down' : 'bio-properties-panel-arrow-right' } />\n </button>\n {\n remove\n ?\n (\n <button title=\"Delete item\" class=\"bio-properties-panel-remove-entry\" onClick={ remove }>\n <DeleteIcon />\n </button>\n )\n : null\n }\n </div>\n <div class={ classnames(\n 'bio-properties-panel-collapsible-entry-entries',\n open ? 'open' : ''\n ) }>\n {\n entries.map(e => e.component)\n }\n </div>\n </div>\n );\n}"],"file":"Collapsible.js"}
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { useDescriptionContext } from '../../hooks';
|
|
2
|
-
/**
|
|
3
|
-
* @param {Object} props
|
|
4
|
-
* @param {Object} props.element
|
|
5
|
-
* @param {String} props.forId - id of the entry the description is used for
|
|
6
|
-
* @param {String} props.value
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
import { jsx as _jsx } from "preact/jsx-runtime";
|
|
10
|
-
export default function Description(props) {
|
|
11
|
-
const {
|
|
12
|
-
element,
|
|
13
|
-
forId,
|
|
14
|
-
value
|
|
15
|
-
} = props;
|
|
16
|
-
const contextDescription = useDescriptionContext(forId, element);
|
|
17
|
-
const description = value || contextDescription;
|
|
18
|
-
|
|
19
|
-
if (description) {
|
|
20
|
-
return _jsx("div", {
|
|
21
|
-
class: "bio-properties-panel-description",
|
|
22
|
-
children: description
|
|
23
|
-
});
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
//# sourceMappingURL=Description.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/entries/Description.js"],"names":["useDescriptionContext","Description","props","element","forId","value","contextDescription","description"],"mappings":"AAAA,SACEA,qBADF,QAEO,aAFP;AAIA;AACA;AACA;AACA;AACA;AACA;;;AACA,eAAe,SAASC,WAAT,CAAqBC,KAArB,EAA4B;AACzC,QAAM;AACJC,IAAAA,OADI;AAEJC,IAAAA,KAFI;AAGJC,IAAAA;AAHI,MAIFH,KAJJ;AAMA,QAAMI,kBAAkB,GAAGN,qBAAqB,CAACI,KAAD,EAAQD,OAAR,CAAhD;AAEA,QAAMI,WAAW,GAAGF,KAAK,IAAIC,kBAA7B;;AAEA,MAAIC,WAAJ,EAAiB;AACf,WACE;AAAK,MAAA,KAAK,EAAC,kCAAX;AAAA,gBACIA;AADJ,MADF;AAKD;AACF","sourcesContent":["import {\n useDescriptionContext\n} from '../../hooks';\n\n/**\n * @param {Object} props\n * @param {Object} props.element\n * @param {String} props.forId - id of the entry the description is used for\n * @param {String} props.value\n */\nexport default function Description(props) {\n const {\n element,\n forId,\n value\n } = props;\n\n const contextDescription = useDescriptionContext(forId, element);\n\n const description = value || contextDescription;\n\n if (description) {\n return (\n <div class=\"bio-properties-panel-description\">\n { description }\n </div>\n );\n }\n}\n"],"file":"Description.js"}
|