@bpmn-io/properties-panel 3.35.0 → 3.36.0

package/dist/assets/properties-panel.css

@@ -1532,3 +1532,9 @@ textarea.bio-properties-panel-input {
 .bio-properties-panel-feel-popup .cm-gutters .cm-lineNumbers .cm-gutterElement {
   text-align: center;
 }
+
+/* Checkbox Group */
+.bio-properties-panel-checkbox-group .bio-properties-panel-checkbox-group-entries > .bio-properties-panel-entry {
+  margin: 0;
+  padding: 0;
+}

package/dist/index.esm.js

@@ -1687,6 +1687,73 @@ function prefixId$8(id) {
   return `bio-properties-panel-${id}`;
 }
 
+/**
+ * @param {Object} props
+ * @param {Object} props.element
+ * @param {String} props.id
+ * @param {String} props.label
+ * @param {Array<{label: String, value: *}>} props.options
+ * @param {Function} props.getValue
+ * @param {Function} props.setValue
+ * @param {String} [props.description]
+ * @param {string|import('preact').Component} [props.tooltip]
+ * @param {boolean} [props.disabled]
+ * @param {Function} [props.onFocus]
+ * @param {Function} [props.onBlur]
+ */
+function CheckboxGroup(props) {
+  const {
+    element,
+    id,
+    label,
+    description,
+    tooltip,
+    options = [],
+    getValue,
+    setValue,
+    disabled,
+    onFocus,
+    onBlur
+  } = props;
+  const value = getValue(element) || [];
+  const handleOptionChange = (optionValue, checked) => {
+    const newValue = checked ? [...value, optionValue] : value.filter(v => v !== optionValue);
+    setValue(newValue);
+  };
+  return jsxs("div", {
+    class: "bio-properties-panel-entry bio-properties-panel-checkbox-group",
+    "data-entry-id": id,
+    children: [jsx("div", {
+      class: "bio-properties-panel-group-header",
+      children: jsx("p", {
+        class: "bio-properties-panel-label",
+        children: jsx(TooltipWrapper, {
+          value: tooltip,
+          forId: id,
+          element: element,
+          children: label
+        })
+      })
+    }), jsx("div", {
+      class: "bio-properties-panel-checkbox-group-entries",
+      children: options.map(option => jsx(CheckboxEntry, {
+        id: `${id}-${option.value}`,
+        label: option.label,
+        setValue: checked => handleOptionChange(option.value, checked),
+        getValue: () => value.includes(option.value),
+        disabled: disabled,
+        onFocus: onFocus,
+        onBlur: onBlur,
+        element: element
+      }, option.value))
+    }), jsx(Description, {
+      forId: id,
+      element: element,
+      value: description
+    })]
+  });
+}
+
 /**
  * Button to open popups.
  *
@@ -2340,7 +2407,6 @@ function FeelTextfield(props) {
   const [localValue, setLocalValue] = useState(value);
   const editorRef = useShowEntryEvent(id);
   const containerRef = useRef();
-  const isTogglingFromPasteRef = useRef(false);
   const onInput = useCallback(newValue => {
     // we don't commit empty FEEL expressions,
     // but instead serialize them as <undefined>
@@ -2383,6 +2449,9 @@ function FeelTextfield(props) {
     if (feelActive) {
       newValue = '=' + newValue;
     }
+    if (newValue === localValue) {
+      return;
+    }
     setLocalValue(newValue);
     if (useDebounce) {
       handleInput(newValue);
@@ -2395,11 +2464,6 @@ function FeelTextfield(props) {
     }
   };
   const handleOnBlur = e => {
-    // Ignore blur when toggling from paste to avoid interference
-    if (isTogglingFromPasteRef.current) {
-      isTogglingFromPasteRef.current = false;
-      return;
-    }
     handleInput.cancel?.();
     if (e.target.type === 'checkbox') {
       onInput(e.target.checked);
@@ -2499,7 +2563,6 @@ function FeelTextfield(props) {
         setLocalValue(trimmedValue);
         handleInput(trimmedValue);
         if (!feelActive && isString(trimmedValue) && trimmedValue.startsWith('=')) {
-          isTogglingFromPasteRef.current = true;
           setFocus(trimmedValue.length - 1);
         }
         event.preventDefault();
@@ -4696,5 +4759,5 @@ var index = {
   feelPopupRenderer: ['type', FeelPopupRenderer]
 };
 
-export { ArrowIcon, CheckboxEntry, CloseIcon, CollapsibleEntry, CreateIcon, index$1 as DebounceInputModule, DeleteIcon, DescriptionContext, Description as DescriptionEntry, DragIcon, DropdownButton, ErrorsContext, EventContext, ExternalLinkIcon, FeelCheckboxEntry, FeelEntry, FeelIcon$1 as FeelIcon, FeelLanguageContext, FeelNumberEntry, index as FeelPopupModule, FeelTemplatingEntry, FeelTextAreaEntry, FeelToggleSwitchEntry, Group, Header, HeaderButton, LaunchIcon, LayoutContext, List as ListEntry, ListGroup, ListItem, NumberFieldEntry, OpenPopupIcon, Placeholder, PropertiesPanel, LayoutContext as PropertiesPanelContext, SelectEntry, Simple as SimpleEntry, TemplatingEntry, TextAreaEntry, TextfieldEntry as TextFieldEntry, ToggleSwitchEntry, TooltipContext, TooltipWrapper as TooltipEntry, isEdited$8 as isCheckboxEntryEdited, isEdited$5 as isFeelEntryEdited, isEdited$6 as isNumberFieldEntryEdited, isEdited$3 as isSelectEntryEdited, isEdited$2 as isSimpleEntryEdited, isEdited$4 as isTemplatingEntryEdited, isEdited$1 as isTextAreaEntryEdited, isEdited as isTextFieldEntryEdited, isEdited$7 as isToggleSwitchEntryEdited, useDebounce, useDescriptionContext, useElementVisible, useError, useErrors, useEvent, useKeyFactory, useLayoutState, usePrevious, useShowEntryEvent, useStaticCallback, useStickyIntersectionObserver, useTooltipContext };
+export { ArrowIcon, CheckboxEntry, CheckboxGroup, CloseIcon, CollapsibleEntry, CreateIcon, index$1 as DebounceInputModule, DeleteIcon, DescriptionContext, Description as DescriptionEntry, DragIcon, DropdownButton, ErrorsContext, EventContext, ExternalLinkIcon, FeelCheckboxEntry, FeelEntry, FeelIcon$1 as FeelIcon, FeelLanguageContext, FeelNumberEntry, index as FeelPopupModule, FeelTemplatingEntry, FeelTextAreaEntry, FeelToggleSwitchEntry, Group, Header, HeaderButton, LaunchIcon, LayoutContext, List as ListEntry, ListGroup, ListItem, NumberFieldEntry, OpenPopupIcon, Placeholder, PropertiesPanel, LayoutContext as PropertiesPanelContext, SelectEntry, Simple as SimpleEntry, TemplatingEntry, TextAreaEntry, TextfieldEntry as TextFieldEntry, ToggleSwitchEntry, TooltipContext, TooltipWrapper as TooltipEntry, isEdited$8 as isCheckboxEntryEdited, isEdited$5 as isFeelEntryEdited, isEdited$6 as isNumberFieldEntryEdited, isEdited$3 as isSelectEntryEdited, isEdited$2 as isSimpleEntryEdited, isEdited$4 as isTemplatingEntryEdited, isEdited$1 as isTextAreaEntryEdited, isEdited as isTextFieldEntryEdited, isEdited$7 as isToggleSwitchEntryEdited, useDebounce, useDescriptionContext, useElementVisible, useError, useErrors, useEvent, useKeyFactory, useLayoutState, usePrevious, useShowEntryEvent, useStaticCallback, useStickyIntersectionObserver, useTooltipContext };
 //# sourceMappingURL=index.esm.js.map