@react-querybuilder/bulma - npm Package Compare versions

Comparing version 7.0.0-alpha.2 to 7.0.0-alpha.3

dist/cjs/react-querybuilder_bulma.cjs.development.d.ts

@@ -1,2 +0,2 @@
-import * as react from 'react';
+import * as React from 'react';
 import * as react_querybuilder from 'react-querybuilder';
@@ -6,3 +6,3 @@ import { ActionProps, NotToggleProps, ValueEditorProps, ValueSelectorProps, Field } from 'react-querybuilder';
 declare const BulmaActionElement: {
-    ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: ActionProps): react.JSX.Element;
+    ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: ActionProps): React.JSX.Element;
     displayName: string;
@@ -12,3 +12,3 @@ };
 declare const BulmaNotToggle: {
-    ({ className, handleOnChange, label, checked, title, disabled, }: NotToggleProps): react.JSX.Element;
+    ({ className, handleOnChange, label, checked, title, disabled, }: NotToggleProps): React.JSX.Element;
     displayName: string;
@@ -18,3 +18,3 @@ };
 declare const BulmaValueEditor: {
-    (props: ValueEditorProps): react.JSX.Element | null;
+    (props: ValueEditorProps): React.JSX.Element | null;
     displayName: string;
@@ -24,3 +24,3 @@ };
 declare const BulmaValueSelector: {
-    ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: ValueSelectorProps): react.JSX.Element;
+    ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: ValueSelectorProps): React.JSX.Element;
     displayName: string;
@@ -30,58 +30,18 @@ };
 declare const bulmaControlElements: {
+    actionElement: {
+        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): React.JSX.Element;
+        displayName: string;
+    };
     notToggle: {
-        ({ className, handleOnChange, label, checked, title, disabled, }: react_querybuilder.NotToggleProps): react.JSX.Element;
+        ({ className, handleOnChange, label, checked, title, disabled, }: react_querybuilder.NotToggleProps): React.JSX.Element;
         displayName: string;
     };
     valueEditor: {
-        (props: react_querybuilder.ValueEditorProps<Field<string, string, string, react_querybuilder.Option<string>, react_querybuilder.Option<string>>, string>): react.JSX.Element | null;
+        (props: react_querybuilder.ValueEditorProps<Field<string, string, string, react_querybuilder.Option<string>, react_querybuilder.Option<string>>, string>): React.JSX.Element | null;
         displayName: string;
     };
-    addGroupAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
+    valueSelector: {
+        ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: react_querybuilder.ValueSelectorProps<react_querybuilder.Option<string>>): React.JSX.Element;
         displayName: string;
     };
-    addRuleAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    cloneGroupAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    cloneRuleAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    combinatorSelector: {
-        ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: react_querybuilder.ValueSelectorProps<react_querybuilder.Option<string>>): react.JSX.Element;
-        displayName: string;
-    };
-    fieldSelector: {
-        ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: react_querybuilder.ValueSelectorProps<react_querybuilder.Option<string>>): react.JSX.Element;
-        displayName: string;
-    };
-    operatorSelector: {
-        ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: react_querybuilder.ValueSelectorProps<react_querybuilder.Option<string>>): react.JSX.Element;
-        displayName: string;
-    };
-    lockRuleAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    lockGroupAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    removeGroupAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    removeRuleAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    valueSourceSelector: {
-        ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: react_querybuilder.ValueSelectorProps<react_querybuilder.Option<string>>): react.JSX.Element;
-        displayName: string;
-    };
 };
@@ -88,0 +48,0 @@ declare const QueryBuilderBulma: react_querybuilder.QueryBuilderContextProvider<Record<string, any>>;

dist/cjs/react-querybuilder_bulma.cjs.development.js

@@ -86,41 +86,6 @@ "use strict";
 // src/BulmaValueEditor.tsx
-var React4 = __toESM(require("react"));
-var import_react_querybuilder3 = require("react-querybuilder");
-
-// src/BulmaValueSelector.tsx
 var React3 = __toESM(require("react"));
-var import_react_querybuilder2 = require("react-querybuilder");
-
-// src/utils.ts
 var import_react_querybuilder = require("react-querybuilder");
-
-// src/BulmaValueSelector.tsx
-var BulmaValueSelector = ({
-  className,
-  handleOnChange,
-  options,
-  value,
-  title,
-  disabled,
-  multiple,
-  listsAsArrays
-}) => {
-  const { onChange, val } = (0, import_react_querybuilder2.useValueSelector)({ handleOnChange, listsAsArrays, multiple, value });
-  const selectElementChangeHandler = (0, import_react_querybuilder2.useSelectElementChangeHandler)({ multiple, onChange });
-  return /* @__PURE__ */ React3.createElement("div", { title, className: `${className} select${multiple ? " is-multiple" : ""}` }, /* @__PURE__ */ React3.createElement(
-    "select",
-    {
-      value: val,
-      multiple,
-      disabled,
-      onChange: selectElementChangeHandler
-    },
-    (0, import_react_querybuilder.toOptions)(options)
-  ));
-};
-BulmaValueSelector.displayName = "BulmaValueSelector";
-
-// src/BulmaValueEditor.tsx
 var BulmaValueEditor = (props) => {
-  const { valueAsArray, multiValueHandler } = (0, import_react_querybuilder3.useValueEditor)({
+  const { valueAsArray, multiValueHandler } = (0, import_react_querybuilder.useValueEditor)({
     handleOnChange: props.handleOnChange,
@@ -135,3 +100,3 @@ inputType: props.inputType,
   });
-  const { selectorComponent: SelectorComponent = BulmaValueSelector } = props;
+  const { selectorComponent: SelectorComponent = props.schema.controls.valueSelector } = props;
   if (props.operator === "null" || props.operator === "notNull") {
@@ -145,3 +110,3 @@ return null;
       if (props.type === "text") {
-        return /* @__PURE__ */ React4.createElement(
+        return /* @__PURE__ */ React3.createElement(
           "input",
@@ -153,3 +118,3 @@ {
             value: valueAsArray[i] ?? "",
-            className: `${import_react_querybuilder3.standardClassnames.valueListItem} input`,
+            className: `${import_react_querybuilder.standardClassnames.valueListItem} input`,
             disabled: props.disabled,
@@ -160,3 +125,3 @@ onChange: (e) => multiValueHandler(e.target.value, i)
       }
-      return /* @__PURE__ */ React4.createElement(
+      return /* @__PURE__ */ React3.createElement(
         SelectorComponent,
@@ -166,6 +131,6 @@ {
           key,
-          className: import_react_querybuilder3.standardClassnames.valueListItem,
+          className: import_react_querybuilder.standardClassnames.valueListItem,
           handleOnChange: (v) => multiValueHandler(v, i),
           disabled: props.disabled,
-          value: valueAsArray[i] ?? (0, import_react_querybuilder3.getFirstOption)(values),
+          value: valueAsArray[i] ?? (0, import_react_querybuilder.getFirstOption)(values),
           options: values,
@@ -176,3 +141,3 @@ listsAsArrays: props.listsAsArrays
     });
-    return /* @__PURE__ */ React4.createElement("span", { "data-testid": props.testID, className: props.className, title: props.title }, editors[0], props.separator, editors[1]);
+    return /* @__PURE__ */ React3.createElement("span", { "data-testid": props.testID, className: props.className, title: props.title }, editors[0], props.separator, editors[1]);
   }
@@ -182,3 +147,3 @@ switch (props.type) {
     case "multiselect":
-      return /* @__PURE__ */ React4.createElement(
+      return /* @__PURE__ */ React3.createElement(
         SelectorComponent,
@@ -198,8 +163,8 @@ {
     case "textarea":
-      return /* @__PURE__ */ React4.createElement("div", { className: `${props.className} control` }, /* @__PURE__ */ React4.createElement(import_react_querybuilder3.ValueEditor, { skipHook: true, ...props, className: "textarea" }));
+      return /* @__PURE__ */ React3.createElement("div", { className: `${props.className} control` }, /* @__PURE__ */ React3.createElement(import_react_querybuilder.ValueEditor, { skipHook: true, ...props, className: "textarea" }));
     case "switch":
     case "checkbox":
-      return /* @__PURE__ */ React4.createElement("label", { title: props.title, className: `${props.className} checkbox` }, /* @__PURE__ */ React4.createElement(import_react_querybuilder3.ValueEditor, { skipHook: true, ...props, title: "", className: "" }));
+      return /* @__PURE__ */ React3.createElement("label", { title: props.title, className: `${props.className} checkbox` }, /* @__PURE__ */ React3.createElement(import_react_querybuilder.ValueEditor, { skipHook: true, ...props, title: "", className: "" }));
     case "radio":
-      return /* @__PURE__ */ React4.createElement("div", { className: `${props.className} control`, title: props.title }, values.map((v) => /* @__PURE__ */ React4.createElement("label", { key: v.name, className: "radio" }, /* @__PURE__ */ React4.createElement(
+      return /* @__PURE__ */ React3.createElement("div", { className: `${props.className} control`, title: props.title }, values.map((v) => /* @__PURE__ */ React3.createElement("label", { key: v.name, className: "radio" }, /* @__PURE__ */ React3.createElement(
         "input",
@@ -215,22 +180,45 @@ {
   }
-  return /* @__PURE__ */ React4.createElement("div", { className: `${props.className} control` }, /* @__PURE__ */ React4.createElement(import_react_querybuilder3.ValueEditor, { skipHook: true, ...props, disabled: props.disabled, className: "input" }));
+  return /* @__PURE__ */ React3.createElement("div", { className: `${props.className} control` }, /* @__PURE__ */ React3.createElement(import_react_querybuilder.ValueEditor, { skipHook: true, ...props, disabled: props.disabled, className: "input" }));
 };
 BulmaValueEditor.displayName = "BulmaValueEditor";
 
+// src/BulmaValueSelector.tsx
+var React4 = __toESM(require("react"));
+var import_react_querybuilder3 = require("react-querybuilder");
+
+// src/utils.ts
+var import_react_querybuilder2 = require("react-querybuilder");
+
+// src/BulmaValueSelector.tsx
+var BulmaValueSelector = ({
+  className,
+  handleOnChange,
+  options,
+  value,
+  title,
+  disabled,
+  multiple,
+  listsAsArrays
+}) => {
+  const { onChange, val } = (0, import_react_querybuilder3.useValueSelector)({ handleOnChange, listsAsArrays, multiple, value });
+  const selectElementChangeHandler = (0, import_react_querybuilder3.useSelectElementChangeHandler)({ multiple, onChange });
+  return /* @__PURE__ */ React4.createElement("div", { title, className: `${className} select${multiple ? " is-multiple" : ""}` }, /* @__PURE__ */ React4.createElement(
+    "select",
+    {
+      value: val,
+      multiple,
+      disabled,
+      onChange: selectElementChangeHandler
+    },
+    (0, import_react_querybuilder2.toOptions)(options)
+  ));
+};
+BulmaValueSelector.displayName = "BulmaValueSelector";
+
 // src/index.ts
 var bulmaControlElements = {
+  actionElement: BulmaActionElement,
   notToggle: BulmaNotToggle,
   valueEditor: BulmaValueEditor,
-  addGroupAction: BulmaActionElement,
-  addRuleAction: BulmaActionElement,
-  cloneGroupAction: BulmaActionElement,
-  cloneRuleAction: BulmaActionElement,
-  combinatorSelector: BulmaValueSelector,
-  fieldSelector: BulmaValueSelector,
-  operatorSelector: BulmaValueSelector,
-  lockRuleAction: BulmaActionElement,
-  lockGroupAction: BulmaActionElement,
-  removeGroupAction: BulmaActionElement,
-  removeRuleAction: BulmaActionElement,
-  valueSourceSelector: BulmaValueSelector
+  valueSelector: BulmaValueSelector
 };
@@ -237,0 +225,0 @@ var QueryBuilderBulma = (0, import_react_querybuilder4.getCompatContextProvider)({

dist/cjs/react-querybuilder_bulma.cjs.production.d.ts

@@ -1,2 +0,2 @@
-import * as react from 'react';
+import * as React from 'react';
 import * as react_querybuilder from 'react-querybuilder';
@@ -6,3 +6,3 @@ import { ActionProps, NotToggleProps, ValueEditorProps, ValueSelectorProps, Field } from 'react-querybuilder';
 declare const BulmaActionElement: {
-    ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: ActionProps): react.JSX.Element;
+    ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: ActionProps): React.JSX.Element;
     displayName: string;
@@ -12,3 +12,3 @@ };
 declare const BulmaNotToggle: {
-    ({ className, handleOnChange, label, checked, title, disabled, }: NotToggleProps): react.JSX.Element;
+    ({ className, handleOnChange, label, checked, title, disabled, }: NotToggleProps): React.JSX.Element;
     displayName: string;
@@ -18,3 +18,3 @@ };
 declare const BulmaValueEditor: {
-    (props: ValueEditorProps): react.JSX.Element | null;
+    (props: ValueEditorProps): React.JSX.Element | null;
     displayName: string;
@@ -24,3 +24,3 @@ };
 declare const BulmaValueSelector: {
-    ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: ValueSelectorProps): react.JSX.Element;
+    ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: ValueSelectorProps): React.JSX.Element;
     displayName: string;
@@ -30,58 +30,18 @@ };
 declare const bulmaControlElements: {
+    actionElement: {
+        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): React.JSX.Element;
+        displayName: string;
+    };
     notToggle: {
-        ({ className, handleOnChange, label, checked, title, disabled, }: react_querybuilder.NotToggleProps): react.JSX.Element;
+        ({ className, handleOnChange, label, checked, title, disabled, }: react_querybuilder.NotToggleProps): React.JSX.Element;
         displayName: string;
     };
     valueEditor: {
-        (props: react_querybuilder.ValueEditorProps<Field<string, string, string, react_querybuilder.Option<string>, react_querybuilder.Option<string>>, string>): react.JSX.Element | null;
+        (props: react_querybuilder.ValueEditorProps<Field<string, string, string, react_querybuilder.Option<string>, react_querybuilder.Option<string>>, string>): React.JSX.Element | null;
         displayName: string;
     };
-    addGroupAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
+    valueSelector: {
+        ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: react_querybuilder.ValueSelectorProps<react_querybuilder.Option<string>>): React.JSX.Element;
         displayName: string;
     };
-    addRuleAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    cloneGroupAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    cloneRuleAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    combinatorSelector: {
-        ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: react_querybuilder.ValueSelectorProps<react_querybuilder.Option<string>>): react.JSX.Element;
-        displayName: string;
-    };
-    fieldSelector: {
-        ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: react_querybuilder.ValueSelectorProps<react_querybuilder.Option<string>>): react.JSX.Element;
-        displayName: string;
-    };
-    operatorSelector: {
-        ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: react_querybuilder.ValueSelectorProps<react_querybuilder.Option<string>>): react.JSX.Element;
-        displayName: string;
-    };
-    lockRuleAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    lockGroupAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    removeGroupAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    removeRuleAction: {
-        ({ className, handleOnClick, label, title, disabled, disabledTranslation, }: react_querybuilder.ActionProps): react.JSX.Element;
-        displayName: string;
-    };
-    valueSourceSelector: {
-        ({ className, handleOnChange, options, value, title, disabled, multiple, listsAsArrays, }: react_querybuilder.ValueSelectorProps<react_querybuilder.Option<string>>): react.JSX.Element;
-        displayName: string;
-    };
 };
@@ -88,0 +48,0 @@ declare const QueryBuilderBulma: react_querybuilder.QueryBuilderContextProvider<Record<string, any>>;

dist/cjs/react-querybuilder_bulma.cjs.production.js

@@ -1,2 +0,2 @@
-"use strict";var S=Object.create;var b=Object.defineProperty;var O=Object.getOwnPropertyDescriptor;var P=Object.getOwnPropertyNames;var $=Object.getPrototypeOf,R=Object.prototype.hasOwnProperty;var H=(e,t)=>{for(var a in t)b(e,a,{get:t[a],enumerable:!0})},C=(e,t,a,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of P(t))!R.call(e,o)&&o!==a&&b(e,o,{get:()=>t[o],enumerable:!(n=O(t,o))||n.enumerable});return e};var N=(e,t,a)=>(a=e!=null?S($(e)):{},C(t||!e||!e.__esModule?b(a,"default",{value:e,enumerable:!0}):a,e)),T=e=>C(b({},"__esModule",{value:!0}),e);var G={};H(G,{BulmaActionElement:()=>c,BulmaNotToggle:()=>g,BulmaValueEditor:()=>A,BulmaValueSelector:()=>s,QueryBuilderBulma:()=>p,bulmaControlElements:()=>E});module.exports=T(G);var B=require("react-querybuilder");var k=N(require("react")),c=({className:e,handleOnClick:t,label:a,title:n,disabled:o,disabledTranslation:r})=>k.createElement("button",{type:"button",className:`button ${e}`,title:r&&o?r.title:n,onClick:l=>t(l),disabled:o&&!r},r&&o?r.label:a);c.displayName="BulmaActionElement";var v=N(require("react")),g=({className:e,handleOnChange:t,label:a,checked:n,title:o,disabled:r})=>v.createElement("label",{className:`${e} checkbox`,title:o},v.createElement("input",{type:"checkbox",disabled:r,checked:n,onChange:l=>t(l.target.checked)}),a);g.displayName="BulmaNotToggle";var i=N(require("react")),m=require("react-querybuilder");var x=N(require("react")),f=require("react-querybuilder");var h=require("react-querybuilder");var s=({className:e,handleOnChange:t,options:a,value:n,title:o,disabled:r,multiple:l,listsAsArrays:y})=>{let{onChange:u,val:d}=(0,f.useValueSelector)({handleOnChange:t,listsAsArrays:y,multiple:l,value:n}),V=(0,f.useSelectElementChangeHandler)({multiple:l,onChange:u});return x.createElement("div",{title:o,className:`${e} select${l?" is-multiple":""}`},x.createElement("select",{value:d,multiple:l,disabled:r,onChange:V},(0,h.toOptions)(a)))};s.displayName="BulmaValueSelector";var A=e=>{let{valueAsArray:t,multiValueHandler:a}=(0,m.useValueEditor)({handleOnChange:e.handleOnChange,inputType:e.inputType,operator:e.operator,value:e.value,type:e.type,listsAsArrays:e.listsAsArrays,parseNumbers:e.parseNumbers,values:e.values}),{selectorComponent:n=s}=e;if(e.operator==="null"||e.operator==="notNull")return null;let o=e.fieldData?.placeholder??"",{values:r=[]}=e;if((e.operator==="between"||e.operator==="notBetween")&&(e.type==="select"||e.type==="text")){let l=["from","to"].map((y,u)=>e.type==="text"?i.createElement("input",{key:y,type:e.inputType||"text",placeholder:o,value:t[u]??"",className:`${m.standardClassnames.valueListItem} input`,disabled:e.disabled,onChange:d=>a(d.target.value,u)}):i.createElement(n,{...e,key:y,className:m.standardClassnames.valueListItem,handleOnChange:d=>a(d,u),disabled:e.disabled,value:t[u]??(0,m.getFirstOption)(r),options:r,listsAsArrays:e.listsAsArrays}));return i.createElement("span",{"data-testid":e.testID,className:e.className,title:e.title},l[0],e.separator,l[1])}switch(e.type){case"select":case"multiselect":return i.createElement(n,{...e,title:e.title,className:e.className,handleOnChange:e.handleOnChange,options:r,value:e.value,disabled:e.disabled,multiple:e.type==="multiselect",listsAsArrays:e.listsAsArrays});case"textarea":return i.createElement("div",{className:`${e.className} control`},i.createElement(m.ValueEditor,{skipHook:!0,...e,className:"textarea"}));case"switch":case"checkbox":return i.createElement("label",{title:e.title,className:`${e.className} checkbox`},i.createElement(m.ValueEditor,{skipHook:!0,...e,title:"",className:""}));case"radio":return i.createElement("div",{className:`${e.className} control`,title:e.title},r.map(l=>i.createElement("label",{key:l.name,className:"radio"},i.createElement("input",{type:"radio",value:l.name,checked:e.value===l.name,onChange:()=>e.handleOnChange(l.name),disabled:e.disabled}),l.label)))}return i.createElement("div",{className:`${e.className} control`},i.createElement(m.ValueEditor,{skipHook:!0,...e,disabled:e.disabled,className:"input"}))};A.displayName="BulmaValueEditor";var E={notToggle:g,valueEditor:A,addGroupAction:c,addRuleAction:c,cloneGroupAction:c,cloneRuleAction:c,combinatorSelector:s,fieldSelector:s,operatorSelector:s,lockRuleAction:c,lockGroupAction:c,removeGroupAction:c,removeRuleAction:c,valueSourceSelector:s},p=(0,B.getCompatContextProvider)({key:"bulma",controlElements:E});0&&(module.exports={BulmaActionElement,BulmaNotToggle,BulmaValueEditor,BulmaValueSelector,QueryBuilderBulma,bulmaControlElements});
+"use strict";var O=Object.create;var d=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var S=Object.getOwnPropertyNames;var $=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty;var T=(e,t)=>{for(var a in t)d(e,a,{get:t[a],enumerable:!0})},A=(e,t,a,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of S(t))!H.call(e,o)&&o!==a&&d(e,o,{get:()=>t[o],enumerable:!(n=P(t,o))||n.enumerable});return e};var y=(e,t,a)=>(a=e!=null?O($(e)):{},A(t||!e||!e.__esModule?d(a,"default",{value:e,enumerable:!0}):a,e)),q=e=>A(d({},"__esModule",{value:!0}),e);var R={};T(R,{BulmaActionElement:()=>N,BulmaNotToggle:()=>b,BulmaValueEditor:()=>h,BulmaValueSelector:()=>v,QueryBuilderBulma:()=>w,bulmaControlElements:()=>B});module.exports=q(R);var E=require("react-querybuilder");var k=y(require("react")),N=({className:e,handleOnClick:t,label:a,title:n,disabled:o,disabledTranslation:r})=>k.createElement("button",{type:"button",className:`button ${e}`,title:r&&o?r.title:n,onClick:l=>t(l),disabled:o&&!r},r&&o?r.label:a);N.displayName="BulmaActionElement";var x=y(require("react")),b=({className:e,handleOnChange:t,label:a,checked:n,title:o,disabled:r})=>x.createElement("label",{className:`${e} checkbox`,title:o},x.createElement("input",{type:"checkbox",disabled:r,checked:n,onChange:l=>t(l.target.checked)}),a);b.displayName="BulmaNotToggle";var i=y(require("react")),s=require("react-querybuilder"),h=e=>{let{valueAsArray:t,multiValueHandler:a}=(0,s.useValueEditor)({handleOnChange:e.handleOnChange,inputType:e.inputType,operator:e.operator,value:e.value,type:e.type,listsAsArrays:e.listsAsArrays,parseNumbers:e.parseNumbers,values:e.values}),{selectorComponent:n=e.schema.controls.valueSelector}=e;if(e.operator==="null"||e.operator==="notNull")return null;let o=e.fieldData?.placeholder??"",{values:r=[]}=e;if((e.operator==="between"||e.operator==="notBetween")&&(e.type==="select"||e.type==="text")){let l=["from","to"].map((u,m)=>e.type==="text"?i.createElement("input",{key:u,type:e.inputType||"text",placeholder:o,value:t[m]??"",className:`${s.standardClassnames.valueListItem} input`,disabled:e.disabled,onChange:c=>a(c.target.value,m)}):i.createElement(n,{...e,key:u,className:s.standardClassnames.valueListItem,handleOnChange:c=>a(c,m),disabled:e.disabled,value:t[m]??(0,s.getFirstOption)(r),options:r,listsAsArrays:e.listsAsArrays}));return i.createElement("span",{"data-testid":e.testID,className:e.className,title:e.title},l[0],e.separator,l[1])}switch(e.type){case"select":case"multiselect":return i.createElement(n,{...e,title:e.title,className:e.className,handleOnChange:e.handleOnChange,options:r,value:e.value,disabled:e.disabled,multiple:e.type==="multiselect",listsAsArrays:e.listsAsArrays});case"textarea":return i.createElement("div",{className:`${e.className} control`},i.createElement(s.ValueEditor,{skipHook:!0,...e,className:"textarea"}));case"switch":case"checkbox":return i.createElement("label",{title:e.title,className:`${e.className} checkbox`},i.createElement(s.ValueEditor,{skipHook:!0,...e,title:"",className:""}));case"radio":return i.createElement("div",{className:`${e.className} control`,title:e.title},r.map(l=>i.createElement("label",{key:l.name,className:"radio"},i.createElement("input",{type:"radio",value:l.name,checked:e.value===l.name,onChange:()=>e.handleOnChange(l.name),disabled:e.disabled}),l.label)))}return i.createElement("div",{className:`${e.className} control`},i.createElement(s.ValueEditor,{skipHook:!0,...e,disabled:e.disabled,className:"input"}))};h.displayName="BulmaValueEditor";var C=y(require("react")),f=require("react-querybuilder");var g=require("react-querybuilder");var v=({className:e,handleOnChange:t,options:a,value:n,title:o,disabled:r,multiple:l,listsAsArrays:u})=>{let{onChange:m,val:c}=(0,f.useValueSelector)({handleOnChange:t,listsAsArrays:u,multiple:l,value:n}),V=(0,f.useSelectElementChangeHandler)({multiple:l,onChange:m});return C.createElement("div",{title:o,className:`${e} select${l?" is-multiple":""}`},C.createElement("select",{value:c,multiple:l,disabled:r,onChange:V},(0,g.toOptions)(a)))};v.displayName="BulmaValueSelector";var B={actionElement:N,notToggle:b,valueEditor:h,valueSelector:v},w=(0,E.getCompatContextProvider)({key:"bulma",controlElements:B});0&&(module.exports={BulmaActionElement,BulmaNotToggle,BulmaValueEditor,BulmaValueSelector,QueryBuilderBulma,bulmaControlElements});
 //# sourceMappingURL=react-querybuilder_bulma.cjs.production.js.map

dist/react-querybuilder_bulma.legacy-esm.js

@@ -67,3 +67,3 @@ var __defProp = Object.defineProperty;
 // src/BulmaValueEditor.tsx
-import * as React4 from "react";
+import * as React3 from "react";
 import {
@@ -75,37 +75,2 @@ getFirstOption,
 } from "react-querybuilder";
-
-// src/BulmaValueSelector.tsx
-import * as React3 from "react";
-import { useSelectElementChangeHandler, useValueSelector } from "react-querybuilder";
-
-// src/utils.ts
-import { isOptionGroupArray, toOptions } from "react-querybuilder";
-
-// src/BulmaValueSelector.tsx
-var BulmaValueSelector = ({
-  className,
-  handleOnChange,
-  options,
-  value,
-  title,
-  disabled,
-  multiple,
-  listsAsArrays
-}) => {
-  const { onChange, val } = useValueSelector({ handleOnChange, listsAsArrays, multiple, value });
-  const selectElementChangeHandler = useSelectElementChangeHandler({ multiple, onChange });
-  return /* @__PURE__ */ React3.createElement("div", { title, className: `${className} select${multiple ? " is-multiple" : ""}` }, /* @__PURE__ */ React3.createElement(
-    "select",
-    {
-      value: val,
-      multiple,
-      disabled,
-      onChange: selectElementChangeHandler
-    },
-    toOptions(options)
-  ));
-};
-BulmaValueSelector.displayName = "BulmaValueSelector";
-
-// src/BulmaValueEditor.tsx
 var BulmaValueEditor = (props) => {
@@ -123,3 +88,3 @@ var _a, _b;
   });
-  const { selectorComponent: SelectorComponent = BulmaValueSelector } = props;
+  const { selectorComponent: SelectorComponent = props.schema.controls.valueSelector } = props;
   if (props.operator === "null" || props.operator === "notNull") {
@@ -134,3 +99,3 @@ return null;
       if (props.type === "text") {
-        return /* @__PURE__ */ React4.createElement(
+        return /* @__PURE__ */ React3.createElement(
           "input",
@@ -148,3 +113,3 @@ {
       }
-      return /* @__PURE__ */ React4.createElement(
+      return /* @__PURE__ */ React3.createElement(
         SelectorComponent,
@@ -162,3 +127,3 @@ __spreadProps(__spreadValues({}, props), {
     });
-    return /* @__PURE__ */ React4.createElement("span", { "data-testid": props.testID, className: props.className, title: props.title }, editors[0], props.separator, editors[1]);
+    return /* @__PURE__ */ React3.createElement("span", { "data-testid": props.testID, className: props.className, title: props.title }, editors[0], props.separator, editors[1]);
   }
@@ -168,3 +133,3 @@ switch (props.type) {
     case "multiselect":
-      return /* @__PURE__ */ React4.createElement(
+      return /* @__PURE__ */ React3.createElement(
         SelectorComponent,
@@ -183,8 +148,8 @@ __spreadProps(__spreadValues({}, props), {
     case "textarea":
-      return /* @__PURE__ */ React4.createElement("div", { className: `${props.className} control` }, /* @__PURE__ */ React4.createElement(ValueEditor, __spreadProps(__spreadValues({ skipHook: true }, props), { className: "textarea" })));
+      return /* @__PURE__ */ React3.createElement("div", { className: `${props.className} control` }, /* @__PURE__ */ React3.createElement(ValueEditor, __spreadProps(__spreadValues({ skipHook: true }, props), { className: "textarea" })));
     case "switch":
     case "checkbox":
-      return /* @__PURE__ */ React4.createElement("label", { title: props.title, className: `${props.className} checkbox` }, /* @__PURE__ */ React4.createElement(ValueEditor, __spreadProps(__spreadValues({ skipHook: true }, props), { title: "", className: "" })));
+      return /* @__PURE__ */ React3.createElement("label", { title: props.title, className: `${props.className} checkbox` }, /* @__PURE__ */ React3.createElement(ValueEditor, __spreadProps(__spreadValues({ skipHook: true }, props), { title: "", className: "" })));
     case "radio":
-      return /* @__PURE__ */ React4.createElement("div", { className: `${props.className} control`, title: props.title }, values.map((v) => /* @__PURE__ */ React4.createElement("label", { key: v.name, className: "radio" }, /* @__PURE__ */ React4.createElement(
+      return /* @__PURE__ */ React3.createElement("div", { className: `${props.className} control`, title: props.title }, values.map((v) => /* @__PURE__ */ React3.createElement("label", { key: v.name, className: "radio" }, /* @__PURE__ */ React3.createElement(
         "input",
@@ -200,22 +165,45 @@ {
   }
-  return /* @__PURE__ */ React4.createElement("div", { className: `${props.className} control` }, /* @__PURE__ */ React4.createElement(ValueEditor, __spreadProps(__spreadValues({ skipHook: true }, props), { disabled: props.disabled, className: "input" })));
+  return /* @__PURE__ */ React3.createElement("div", { className: `${props.className} control` }, /* @__PURE__ */ React3.createElement(ValueEditor, __spreadProps(__spreadValues({ skipHook: true }, props), { disabled: props.disabled, className: "input" })));
 };
 BulmaValueEditor.displayName = "BulmaValueEditor";
 
+// src/BulmaValueSelector.tsx
+import * as React4 from "react";
+import { useSelectElementChangeHandler, useValueSelector } from "react-querybuilder";
+
+// src/utils.ts
+import { isOptionGroupArray, toOptions } from "react-querybuilder";
+
+// src/BulmaValueSelector.tsx
+var BulmaValueSelector = ({
+  className,
+  handleOnChange,
+  options,
+  value,
+  title,
+  disabled,
+  multiple,
+  listsAsArrays
+}) => {
+  const { onChange, val } = useValueSelector({ handleOnChange, listsAsArrays, multiple, value });
+  const selectElementChangeHandler = useSelectElementChangeHandler({ multiple, onChange });
+  return /* @__PURE__ */ React4.createElement("div", { title, className: `${className} select${multiple ? " is-multiple" : ""}` }, /* @__PURE__ */ React4.createElement(
+    "select",
+    {
+      value: val,
+      multiple,
+      disabled,
+      onChange: selectElementChangeHandler
+    },
+    toOptions(options)
+  ));
+};
+BulmaValueSelector.displayName = "BulmaValueSelector";
+
 // src/index.ts
 var bulmaControlElements = {
+  actionElement: BulmaActionElement,
   notToggle: BulmaNotToggle,
   valueEditor: BulmaValueEditor,
-  addGroupAction: BulmaActionElement,
-  addRuleAction: BulmaActionElement,
-  cloneGroupAction: BulmaActionElement,
-  cloneRuleAction: BulmaActionElement,
-  combinatorSelector: BulmaValueSelector,
-  fieldSelector: BulmaValueSelector,
-  operatorSelector: BulmaValueSelector,
-  lockRuleAction: BulmaActionElement,
-  lockGroupAction: BulmaActionElement,
-  removeGroupAction: BulmaActionElement,
-  removeRuleAction: BulmaActionElement,
-  valueSourceSelector: BulmaValueSelector
+  valueSelector: BulmaValueSelector
 };
@@ -222,0 +210,0 @@ var QueryBuilderBulma = getCompatContextProvider({

package.json

 {
   "name": "@react-querybuilder/bulma",
   "description": "Custom Bulma components for react-querybuilder",
-  "version": "7.0.0-alpha.2",
+  "version": "7.0.0-alpha.3",
   "publishConfig": {
@@ -41,12 +41,12 @@ "access": "public"
   "devDependencies": {
-    "@testing-library/react": "^14.0.0",
-    "@types/react": "^18.2.33",
-    "@vitejs/plugin-react-swc": "^3.4.1",
+    "@testing-library/react": "^14.1.2",
+    "@types/react": "^18.2.42",
+    "@vitejs/plugin-react-swc": "^3.5.0",
     "bulma": "^0.9.4",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-querybuilder": "^7.0.0-alpha.2",
-    "rollup-plugin-visualizer": "^5.9.2",
-    "typescript": "^5.2.2",
-    "vite": "^4.5.0"
+    "react-querybuilder": "^7.0.0-alpha.3",
+    "rollup-plugin-visualizer": "^5.10.0",
+    "typescript": "^5.3.2",
+    "vite": "^5.0.6"
   },
@@ -56,5 +56,5 @@ "peerDependencies": {
     "react": ">=16.8.0",
-    "react-querybuilder": "^7.0.0-alpha.2"
+    "react-querybuilder": "^7.0.0-alpha.3"
   },
-  "gitHead": "b2557742eb611820d453681120a2fc0f3d679692"
+  "gitHead": "91296c05fff0d40cc868a551cd7ff0153e9eab30"
 }

No alert changes

Worsened metrics

Total package byte prevSize

100372

decreased by-13.29%

Lines of code

729

decreased by-13.63%

No dependency changes