@bpmn-io/properties-panel 3.28.3 → 3.29.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/assets/properties-panel.css +8 -1
- package/dist/index.esm.js +8 -2
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +8 -2
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -819,13 +819,20 @@ textarea.bio-properties-panel-input {
|
|
|
819
819
|
}
|
|
820
820
|
|
|
821
821
|
.bio-properties-panel-list-entry-header {
|
|
822
|
-
position:
|
|
822
|
+
position: sticky;
|
|
823
823
|
overflow: hidden;
|
|
824
824
|
display: flex;
|
|
825
825
|
justify-content: space-between;
|
|
826
826
|
height: 32px;
|
|
827
827
|
}
|
|
828
828
|
|
|
829
|
+
.bio-properties-panel-list-entry-header.sticky {
|
|
830
|
+
background-color: var(--color-white);
|
|
831
|
+
border-bottom: 1px solid var(--sticky-group-bottom-border-color);
|
|
832
|
+
top: 32px;
|
|
833
|
+
z-index: 9;
|
|
834
|
+
}
|
|
835
|
+
|
|
829
836
|
/* Nested list dot */
|
|
830
837
|
.bio-properties-panel-list-entry::before {
|
|
831
838
|
content: "";
|
package/dist/index.esm.js
CHANGED
|
@@ -3058,7 +3058,9 @@ function List(props) {
|
|
|
3058
3058
|
autoFocusEntry,
|
|
3059
3059
|
...restProps
|
|
3060
3060
|
} = props;
|
|
3061
|
+
const entryRef = useRef(null);
|
|
3061
3062
|
const [open, setOpen] = useState(!!shouldOpen);
|
|
3063
|
+
const [sticky, setSticky] = useState(false);
|
|
3062
3064
|
const hasItems = !!items.length;
|
|
3063
3065
|
const toggleOpen = () => hasItems && setOpen(!open);
|
|
3064
3066
|
const elementChanged = usePrevious(element) !== element;
|
|
@@ -3079,11 +3081,15 @@ function List(props) {
|
|
|
3079
3081
|
setOpen(true);
|
|
3080
3082
|
}
|
|
3081
3083
|
}
|
|
3084
|
+
|
|
3085
|
+
// set css class when entry is sticky to top
|
|
3086
|
+
useStickyIntersectionObserver(entryRef, 'div.bio-properties-panel-scroll-container', setSticky);
|
|
3082
3087
|
return jsxs("div", {
|
|
3083
3088
|
"data-entry-id": id,
|
|
3084
3089
|
class: classnames('bio-properties-panel-entry', 'bio-properties-panel-list-entry', hasItems ? '' : 'empty', open ? 'open' : ''),
|
|
3090
|
+
ref: entryRef,
|
|
3085
3091
|
children: [jsxs("div", {
|
|
3086
|
-
class:
|
|
3092
|
+
class: classnames('bio-properties-panel-list-entry-header', sticky && open ? 'sticky' : ''),
|
|
3087
3093
|
onClick: toggleOpen,
|
|
3088
3094
|
children: [jsx("div", {
|
|
3089
3095
|
title: label,
|
|
@@ -3702,7 +3708,7 @@ function prefixId$1(id) {
|
|
|
3702
3708
|
return `bio-properties-panel-${id}`;
|
|
3703
3709
|
}
|
|
3704
3710
|
|
|
3705
|
-
const DEFAULT_DEBOUNCE_TIME =
|
|
3711
|
+
const DEFAULT_DEBOUNCE_TIME = 600;
|
|
3706
3712
|
|
|
3707
3713
|
/**
|
|
3708
3714
|
* Creates a debounced version of a function, delaying its execution based on `debounceDelay`.
|