@react-querybuilder/bootstrap 4.2.4 → 4.3.1

package/README.md

@@ -2,7 +2,7 @@
 
 Official [react-querybuilder](https://npmjs.com/package/react-querybuilder) components for [Bootstrap](https://getbootstrap.com/).
 
-To see them in action, check out the [`react-querybuilder` demo](https://react-querybuilder.js.org/react-querybuilder/) and choose "Bootstrap" from the Style drop-down.
+To see them in action, check out the [`react-querybuilder` demo](https://react-querybuilder.js.org/react-querybuilder/#style=bootstrap) or [load the example in CodeSandbox](https://codesandbox.io/s/github/react-querybuilder/react-querybuilder/tree/main/examples/bootstrap).
 
 ## Installation
 
@@ -15,11 +15,12 @@ yarn add react-querybuilder @react-querybuilder/bootstrap bootstrap bootstrap-ic
 ## Usage
 
 ```tsx
-import QueryBuilder, { RuleGroupType } from 'react-querybuilder';
 import {
   bootstrapControlClassnames,
   bootstrapControlElements,
 } from '@react-querybuilder/bootstrap';
+import { QueryBuilder, RuleGroupType } from 'react-querybuilder';
+import 'bootstrap/scss/bootstrap.scss';
 
 const fields = [
   { name: 'firstName', label: 'First Name' },
@@ -41,20 +42,11 @@ const App = () => {
 };
 ```
 
-To apply the Bootstrap styles, you can add the following SCSS to your app:
+Some additional styling may be necessary, e.g.:
 
-```scss
-@import 'bootstrap/scss/functions';
-@import 'bootstrap/scss/variables';
-@import 'bootstrap/scss/mixins';
-@import 'bootstrap/scss/reboot';
-@import 'bootstrap/scss/type';
-@import 'bootstrap/scss/forms';
-@import 'bootstrap/scss/buttons';
-@import 'bootstrap/scss/dropdown';
-
-.form-control,
-.form-select {
+```css
+.queryBuilder .form-control,
+.queryBuilder .form-select {
   display: inline-block;
   width: auto;
 }

package/dist/index.cjs.js

@@ -1,2 +1,10 @@
-"use strict";var _=Object.defineProperty,$=Object.defineProperties;var G=Object.getOwnPropertyDescriptors;var d=Object.getOwnPropertySymbols;var N=Object.prototype.hasOwnProperty,B=Object.prototype.propertyIsEnumerable;var y=(e,r,t)=>r in e?_(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,w=(e,r)=>{for(var t in r||(r={}))N.call(r,t)&&y(e,t,r[t]);if(d)for(var t of d(r))B.call(r,t)&&y(e,t,r[t]);return e},x=(e,r)=>$(e,G(r));var R=(e,r)=>{var t={};for(var o in e)N.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&d)for(var o of d(e))r.indexOf(o)<0&&B.call(e,o)&&(t[o]=e[o]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var f=require("react"),S=require("react-querybuilder");function V(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var c=V(f);const i=f.forwardRef(({className:e,title:r},t)=>c.default.createElement("span",{ref:t,className:e,title:r},c.default.createElement("i",{className:"bi bi-grip-vertical"})));i.displayName="BootstrapDragHandle";const p=({className:e,handleOnChange:r,title:t,label:o,checked:a,disabled:l})=>{const m=f.useRef(`notToggle-${Math.random()}`);return c.default.createElement("div",{className:`form-check-inline form-switch ${e}`},c.default.createElement("input",{id:m.current,className:"form-check-input",type:"checkbox",onChange:u=>r(u.target.checked),checked:!!a,disabled:l}),c.default.createElement("label",{title:t,htmlFor:m.current,className:"form-check-label"},o))};p.displayName="BootstrapNotToggle";const b=M=>{var k=M,{fieldData:e,operator:r,value:t,handleOnChange:o,title:a,className:l,type:m,inputType:u,values:g,disabled:s}=k,C=R(k,["fieldData","operator","value","handleOnChange","title","className","type","inputType","values","disabled"]);var E;if(f.useEffect(()=>{u==="number"&&!["between","notBetween","in","notIn"].includes(r)&&typeof t=="string"&&t.includes(",")&&o("")},[u,r,t,o]),r==="null"||r==="notNull")return null;const h=(E=e==null?void 0:e.placeholder)!=null?E:"",T=["between","notBetween","in","notIn"].includes(r)?"text":u||"text";switch(m){case"select":case"multiselect":return c.default.createElement(S.ValueSelector,x(w({},C),{className:`${l} form-select form-select-sm`,title:a,handleOnChange:o,value:t,disabled:s,multiple:m==="multiselect",options:g}));case"textarea":return c.default.createElement("textarea",{value:t,title:a,className:l,disabled:s,placeholder:h,onChange:n=>o(n.target.value)});case"switch":return c.default.createElement("span",{className:`custom-control custom-switch ${l}`},c.default.createElement("input",{type:"checkbox",className:"form-check-input custom-control-input",title:a,disabled:s,onChange:n=>o(n.target.checked),checked:!!t}));case"checkbox":return c.default.createElement("input",{type:"checkbox",className:`form-check-input ${l}`,title:a,disabled:s,onChange:n=>o(n.target.checked),checked:!!t});case"radio":return c.default.createElement("span",{title:a},g.map(n=>c.default.createElement("div",{key:n.name,className:"form-check form-check-inline"},c.default.createElement("input",{className:"form-check-input",type:"radio",id:n.name,value:n.name,checked:t===n.name,disabled:s,onChange:H=>o(H.target.value)}),c.default.createElement("label",{className:"form-check-label",htmlFor:n.name},n.label))))}return c.default.createElement("input",{type:T,value:t,title:a,className:l,disabled:s,placeholder:h,onChange:n=>o(n.target.value)})};b.displayName="BootstrapValueEditor";const q={dragHandle:i,notToggle:p,valueEditor:b},v={addGroup:"btn btn-secondary btn-sm",addRule:"btn btn-primary btn-sm",cloneGroup:"btn btn-secondary btn-sm",cloneRule:"btn btn-secondary btn-sm",lockGroup:"btn btn-secondary btn-sm",lockRule:"btn btn-secondary btn-sm",removeGroup:"btn btn-danger btn-sm",removeRule:"btn btn-danger btn-sm",combinators:"form-select form-select-sm",fields:"form-select form-select-sm",operators:"form-select form-select-sm",value:"form-control form-control-sm",valueSource:"form-select form-select-sm"};exports.BootstrapDragHandle=i;exports.BootstrapNotToggle=p;exports.BootstrapValueEditor=b;exports.bootstrapControlClassnames=v;exports.bootstrapControlElements=q;
+"use strict";var q=Object.defineProperty,H=Object.defineProperties;var I=Object.getOwnPropertyDescriptors;var i=Object.getOwnPropertySymbols;var w=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable;var N=(e,t,r)=>t in e?q(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,R=(e,t)=>{for(var r in t||(t={}))w.call(t,r)&&N(e,r,t[r]);if(i)for(var r of i(t))E.call(t,r)&&N(e,r,t[r]);return e},B=(e,t)=>H(e,I(t));var v=(e,t)=>{var r={};for(var o in e)w.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(e!=null&&i)for(var o of i(e))t.indexOf(o)<0&&E.call(e,o)&&(r[o]=e[o]);return r};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var p=require("react"),P=require("react-querybuilder");function F(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var G=F(p),d={exports:{}},f={};/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var L=G.default,V=Symbol.for("react.element"),M=Symbol.for("react.fragment"),D=Object.prototype.hasOwnProperty,O=L.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,U={key:!0,ref:!0,__self:!0,__source:!0};function $(e,t,r){var o,c={},l=null,a=null;r!==void 0&&(l=""+r),t.key!==void 0&&(l=""+t.key),t.ref!==void 0&&(a=t.ref);for(o in t)D.call(t,o)&&!U.hasOwnProperty(o)&&(c[o]=t[o]);if(e&&e.defaultProps)for(o in t=e.defaultProps,t)c[o]===void 0&&(c[o]=t[o]);return{$$typeof:V,type:e,key:l,ref:a,props:c,_owner:O.current}}f.Fragment=M;f.jsx=$;f.jsxs=$;d.exports=f;const s=d.exports.jsx,j=d.exports.jsxs,b=p.forwardRef(({className:e,title:t},r)=>s("span",{ref:r,className:e,title:t,children:s("i",{className:"bi bi-grip-vertical"})}));b.displayName="BootstrapDragHandle";const h=({className:e,handleOnChange:t,title:r,label:o,checked:c,disabled:l})=>{const a=p.useRef(`notToggle-${Math.random()}`);return j("div",{className:`form-check-inline form-switch ${e}`,children:[s("input",{id:a.current,className:"form-check-input",type:"checkbox",onChange:u=>t(u.target.checked),checked:!!c,disabled:l}),s("label",{title:r,htmlFor:a.current,className:"form-check-label",children:o})]})};h.displayName="BootstrapNotToggle";const y=Q=>{var k=Q,{fieldData:e,operator:t,value:r,handleOnChange:o,title:c,className:l,type:a,inputType:u,values:g,disabled:m}=k,S=v(k,["fieldData","operator","value","handleOnChange","title","className","type","inputType","values","disabled"]);var x;if(p.useEffect(()=>{u==="number"&&!["between","notBetween","in","notIn"].includes(t)&&typeof r=="string"&&r.includes(",")&&o("")},[u,t,r,o]),t==="null"||t==="notNull")return null;const _=(x=e==null?void 0:e.placeholder)!=null?x:"",T=["between","notBetween","in","notIn"].includes(t)?"text":u||"text";switch(a){case"select":case"multiselect":return s(P.ValueSelector,B(R({},S),{className:`${l} form-select form-select-sm`,title:c,handleOnChange:o,value:r,disabled:m,multiple:a==="multiselect",options:g}));case"textarea":return s("textarea",{value:r,title:c,className:l,disabled:m,placeholder:_,onChange:n=>o(n.target.value)});case"switch":return s("span",{className:`custom-control custom-switch ${l}`,children:s("input",{type:"checkbox",className:"form-check-input custom-control-input",title:c,disabled:m,onChange:n=>o(n.target.checked),checked:!!r})});case"checkbox":return s("input",{type:"checkbox",className:`form-check-input ${l}`,title:c,disabled:m,onChange:n=>o(n.target.checked),checked:!!r});case"radio":return s("span",{title:c,children:g.map(n=>j("div",{className:"form-check form-check-inline",children:[s("input",{className:"form-check-input",type:"radio",id:n.name,value:n.name,checked:r===n.name,disabled:m,onChange:C=>o(C.target.value)}),s("label",{className:"form-check-label",htmlFor:n.name,children:n.label})]},n.name))})}return s("input",{type:T,value:r,title:c,className:l,disabled:m,placeholder:_,onChange:n=>o(n.target.value)})};y.displayName="BootstrapValueEditor";const A={dragHandle:b,notToggle:h,valueEditor:y},J={addGroup:"btn btn-secondary btn-sm",addRule:"btn btn-primary btn-sm",cloneGroup:"btn btn-secondary btn-sm",cloneRule:"btn btn-secondary btn-sm",lockGroup:"btn btn-secondary btn-sm",lockRule:"btn btn-secondary btn-sm",removeGroup:"btn btn-danger btn-sm",removeRule:"btn btn-danger btn-sm",combinators:"form-select form-select-sm",fields:"form-select form-select-sm",operators:"form-select form-select-sm",value:"form-control form-control-sm",valueSource:"form-select form-select-sm"};exports.BootstrapDragHandle=b;exports.BootstrapNotToggle=h;exports.BootstrapValueEditor=y;exports.bootstrapControlClassnames=J;exports.bootstrapControlElements=A;
 //# sourceMappingURL=index.cjs.js.map

package/dist/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../src/BootstrapDragHandle.tsx","../src/BootstrapNotToggle.tsx","../src/BootstrapValueEditor.tsx","../src/index.ts"],"sourcesContent":["import { forwardRef } from 'react';\nimport type { DragHandleProps } from 'react-querybuilder';\n\nexport const BootstrapDragHandle = forwardRef<HTMLSpanElement, DragHandleProps>(\n  ({ className, title }, dragRef) => (\n    <span ref={dragRef} className={className} title={title}>\n      <i className=\"bi bi-grip-vertical\"></i>\n    </span>\n  )\n);\n\nBootstrapDragHandle.displayName = 'BootstrapDragHandle';\n","import { useRef } from 'react';\nimport type { NotToggleProps } from 'react-querybuilder';\n\nexport const BootstrapNotToggle = ({\n  className,\n  handleOnChange,\n  title,\n  label,\n  checked,\n  disabled,\n}: NotToggleProps) => {\n  const id = useRef(`notToggle-${Math.random()}`);\n\n  return (\n    <div className={`form-check-inline form-switch ${className}`}>\n      <input\n        id={id.current}\n        className=\"form-check-input\"\n        type=\"checkbox\"\n        onChange={e => handleOnChange(e.target.checked)}\n        checked={!!checked}\n        disabled={disabled}\n      />\n      <label title={title} htmlFor={id.current} className=\"form-check-label\">\n        {label}\n      </label>\n    </div>\n  );\n};\n\nBootstrapNotToggle.displayName = 'BootstrapNotToggle';\n","import { useEffect } from 'react';\nimport { ValueEditorProps, ValueSelector } from 'react-querybuilder';\n\nexport const BootstrapValueEditor = ({\n  fieldData,\n  operator,\n  value,\n  handleOnChange,\n  title,\n  className,\n  type,\n  inputType,\n  values,\n  disabled,\n  ...props\n}: ValueEditorProps) => {\n  useEffect(() => {\n    if (\n      inputType === 'number' &&\n      !['between', 'notBetween', 'in', 'notIn'].includes(operator) &&\n      typeof value === 'string' &&\n      value.includes(',')\n    ) {\n      handleOnChange('');\n    }\n  }, [inputType, operator, value, handleOnChange]);\n\n  if (operator === 'null' || operator === 'notNull') {\n    return null;\n  }\n\n  const placeHolderText = fieldData?.placeholder ?? '';\n  const inputTypeCoerced = ['between', 'notBetween', 'in', 'notIn'].includes(operator)\n    ? 'text'\n    : inputType || 'text';\n\n  switch (type) {\n    case 'select':\n    case 'multiselect':\n      return (\n        <ValueSelector\n          {...props}\n          className={`${className} form-select form-select-sm`}\n          title={title}\n          handleOnChange={handleOnChange}\n          value={value}\n          disabled={disabled}\n          multiple={type === 'multiselect'}\n          options={values!}\n        />\n      );\n\n    case 'textarea':\n      return (\n        <textarea\n          value={value}\n          title={title}\n          className={className}\n          disabled={disabled}\n          placeholder={placeHolderText}\n          onChange={e => handleOnChange(e.target.value)}\n        />\n      );\n\n    case 'switch':\n      return (\n        <span className={`custom-control custom-switch ${className}`}>\n          <input\n            type=\"checkbox\"\n            className={`form-check-input custom-control-input`}\n            title={title}\n            disabled={disabled}\n            onChange={e => handleOnChange(e.target.checked)}\n            checked={!!value}\n          />\n        </span>\n      );\n\n    case 'checkbox':\n      return (\n        <input\n          type=\"checkbox\"\n          className={`form-check-input ${className}`}\n          title={title}\n          disabled={disabled}\n          onChange={e => handleOnChange(e.target.checked)}\n          checked={!!value}\n        />\n      );\n\n    case 'radio':\n      return (\n        <span title={title}>\n          {values!.map(v => (\n            <div key={v.name} className=\"form-check form-check-inline\">\n              <input\n                className=\"form-check-input\"\n                type=\"radio\"\n                id={v.name}\n                value={v.name}\n                checked={value === v.name}\n                disabled={disabled}\n                onChange={e => handleOnChange(e.target.value)}\n              />\n              <label className=\"form-check-label\" htmlFor={v.name}>\n                {v.label}\n              </label>\n            </div>\n          ))}\n        </span>\n      );\n  }\n\n  return (\n    <input\n      type={inputTypeCoerced}\n      value={value}\n      title={title}\n      className={className}\n      disabled={disabled}\n      placeholder={placeHolderText}\n      onChange={e => handleOnChange(e.target.value)}\n    />\n  );\n};\n\nBootstrapValueEditor.displayName = 'BootstrapValueEditor';\n","import type { Classnames, Controls } from 'react-querybuilder';\nimport { BootstrapDragHandle } from './BootstrapDragHandle';\nimport { BootstrapNotToggle } from './BootstrapNotToggle';\nimport { BootstrapValueEditor } from './BootstrapValueEditor';\n\nexport const bootstrapControlElements: Partial<Controls> = {\n  dragHandle: BootstrapDragHandle,\n  notToggle: BootstrapNotToggle,\n  valueEditor: BootstrapValueEditor,\n};\n\nexport const bootstrapControlClassnames: Partial<Classnames> = {\n  addGroup: 'btn btn-secondary btn-sm',\n  addRule: 'btn btn-primary btn-sm',\n  cloneGroup: 'btn btn-secondary btn-sm',\n  cloneRule: 'btn btn-secondary btn-sm',\n  lockGroup: 'btn btn-secondary btn-sm',\n  lockRule: 'btn btn-secondary btn-sm',\n  removeGroup: 'btn btn-danger btn-sm',\n  removeRule: 'btn btn-danger btn-sm',\n  combinators: 'form-select form-select-sm',\n  fields: 'form-select form-select-sm',\n  operators: 'form-select form-select-sm',\n  value: 'form-control form-control-sm',\n  valueSource: 'form-select form-select-sm',\n};\n\nexport { BootstrapDragHandle, BootstrapNotToggle, BootstrapValueEditor };\n"],"names":["forwardRef","React","useRef","useEffect","ValueSelector"],"mappings":"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"}
+{"version":3,"file":"index.cjs.js","sources":["../../../node_modules/react/cjs/react-jsx-runtime.production.min.js","../../../node_modules/react/jsx-runtime.js","../react/jsx-runtime","../src/BootstrapDragHandle.tsx","../src/BootstrapNotToggle.tsx","../src/BootstrapValueEditor.tsx","../src/index.ts"],"sourcesContent":["/**\n * @license React\n * react-jsx-runtime.production.min.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n'use strict';var f=require(\"react\"),k=Symbol.for(\"react.element\"),l=Symbol.for(\"react.fragment\"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};\nfunction q(c,a,g){var b,d={},e=null,h=null;void 0!==g&&(e=\"\"+g);void 0!==a.key&&(e=\"\"+a.key);void 0!==a.ref&&(h=a.ref);for(b in a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}exports.Fragment=l;exports.jsx=q;exports.jsxs=q;\n","'use strict';\n\nif (process.env.NODE_ENV === 'production') {\n  module.exports = require('./cjs/react-jsx-runtime.production.min.js');\n} else {\n  module.exports = require('./cjs/react-jsx-runtime.development.js');\n}\n","import * as jsxRuntime from \"/Users/jake/git/react-querybuilder/node_modules/react/jsx-runtime.js\"\nexport const jsx = jsxRuntime.jsx\nexport const jsxs = jsxRuntime.jsxs\nexport const Fragment = jsxRuntime.Fragment","import { forwardRef } from 'react';\nimport type { DragHandleProps } from 'react-querybuilder';\n\nexport const BootstrapDragHandle = forwardRef<HTMLSpanElement, DragHandleProps>(\n  ({ className, title }, dragRef) => (\n    <span ref={dragRef} className={className} title={title}>\n      <i className=\"bi bi-grip-vertical\"></i>\n    </span>\n  )\n);\n\nBootstrapDragHandle.displayName = 'BootstrapDragHandle';\n","import { useRef } from 'react';\nimport type { NotToggleProps } from 'react-querybuilder';\n\nexport const BootstrapNotToggle = ({\n  className,\n  handleOnChange,\n  title,\n  label,\n  checked,\n  disabled,\n}: NotToggleProps) => {\n  const id = useRef(`notToggle-${Math.random()}`);\n\n  return (\n    <div className={`form-check-inline form-switch ${className}`}>\n      <input\n        id={id.current}\n        className=\"form-check-input\"\n        type=\"checkbox\"\n        onChange={e => handleOnChange(e.target.checked)}\n        checked={!!checked}\n        disabled={disabled}\n      />\n      <label title={title} htmlFor={id.current} className=\"form-check-label\">\n        {label}\n      </label>\n    </div>\n  );\n};\n\nBootstrapNotToggle.displayName = 'BootstrapNotToggle';\n","import { useEffect } from 'react';\nimport { ValueEditorProps, ValueSelector } from 'react-querybuilder';\n\nexport const BootstrapValueEditor = ({\n  fieldData,\n  operator,\n  value,\n  handleOnChange,\n  title,\n  className,\n  type,\n  inputType,\n  values,\n  disabled,\n  ...props\n}: ValueEditorProps) => {\n  useEffect(() => {\n    if (\n      inputType === 'number' &&\n      !['between', 'notBetween', 'in', 'notIn'].includes(operator) &&\n      typeof value === 'string' &&\n      value.includes(',')\n    ) {\n      handleOnChange('');\n    }\n  }, [inputType, operator, value, handleOnChange]);\n\n  if (operator === 'null' || operator === 'notNull') {\n    return null;\n  }\n\n  const placeHolderText = fieldData?.placeholder ?? '';\n  const inputTypeCoerced = ['between', 'notBetween', 'in', 'notIn'].includes(operator)\n    ? 'text'\n    : inputType || 'text';\n\n  switch (type) {\n    case 'select':\n    case 'multiselect':\n      return (\n        <ValueSelector\n          {...props}\n          className={`${className} form-select form-select-sm`}\n          title={title}\n          handleOnChange={handleOnChange}\n          value={value}\n          disabled={disabled}\n          multiple={type === 'multiselect'}\n          options={values!}\n        />\n      );\n\n    case 'textarea':\n      return (\n        <textarea\n          value={value}\n          title={title}\n          className={className}\n          disabled={disabled}\n          placeholder={placeHolderText}\n          onChange={e => handleOnChange(e.target.value)}\n        />\n      );\n\n    case 'switch':\n      return (\n        <span className={`custom-control custom-switch ${className}`}>\n          <input\n            type=\"checkbox\"\n            className={`form-check-input custom-control-input`}\n            title={title}\n            disabled={disabled}\n            onChange={e => handleOnChange(e.target.checked)}\n            checked={!!value}\n          />\n        </span>\n      );\n\n    case 'checkbox':\n      return (\n        <input\n          type=\"checkbox\"\n          className={`form-check-input ${className}`}\n          title={title}\n          disabled={disabled}\n          onChange={e => handleOnChange(e.target.checked)}\n          checked={!!value}\n        />\n      );\n\n    case 'radio':\n      return (\n        <span title={title}>\n          {values!.map(v => (\n            <div key={v.name} className=\"form-check form-check-inline\">\n              <input\n                className=\"form-check-input\"\n                type=\"radio\"\n                id={v.name}\n                value={v.name}\n                checked={value === v.name}\n                disabled={disabled}\n                onChange={e => handleOnChange(e.target.value)}\n              />\n              <label className=\"form-check-label\" htmlFor={v.name}>\n                {v.label}\n              </label>\n            </div>\n          ))}\n        </span>\n      );\n  }\n\n  return (\n    <input\n      type={inputTypeCoerced}\n      value={value}\n      title={title}\n      className={className}\n      disabled={disabled}\n      placeholder={placeHolderText}\n      onChange={e => handleOnChange(e.target.value)}\n    />\n  );\n};\n\nBootstrapValueEditor.displayName = 'BootstrapValueEditor';\n","import type { Classnames, Controls } from 'react-querybuilder';\nimport { BootstrapDragHandle } from './BootstrapDragHandle';\nimport { BootstrapNotToggle } from './BootstrapNotToggle';\nimport { BootstrapValueEditor } from './BootstrapValueEditor';\n\nexport const bootstrapControlElements: Partial<Controls> = {\n  dragHandle: BootstrapDragHandle,\n  notToggle: BootstrapNotToggle,\n  valueEditor: BootstrapValueEditor,\n};\n\nexport const bootstrapControlClassnames: Partial<Classnames> = {\n  addGroup: 'btn btn-secondary btn-sm',\n  addRule: 'btn btn-primary btn-sm',\n  cloneGroup: 'btn btn-secondary btn-sm',\n  cloneRule: 'btn btn-secondary btn-sm',\n  lockGroup: 'btn btn-secondary btn-sm',\n  lockRule: 'btn btn-secondary btn-sm',\n  removeGroup: 'btn btn-danger btn-sm',\n  removeRule: 'btn btn-danger btn-sm',\n  combinators: 'form-select form-select-sm',\n  fields: 'form-select form-select-sm',\n  operators: 'form-select form-select-sm',\n  value: 'form-control form-control-sm',\n  valueSource: 'form-select form-select-sm',\n};\n\nexport { BootstrapDragHandle, BootstrapNotToggle, BootstrapValueEditor };\n"],"names":["require$$0","jsxRuntimeModule","jsxRuntime.jsx","jsxRuntime.jsxs","BootstrapDragHandle","forwardRef","className","title","dragRef","displayName","BootstrapNotToggle","handleOnChange","label","checked","disabled","id","useRef","Math","random","_jsx","current","e","target","BootstrapValueEditor","fieldData","operator","value","type","inputType","values","props","useEffect","includes","placeHolderText","placeholder","inputTypeCoerced","ValueSelector","map","v","name"],"mappings":"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"}

package/dist/index.es.js

@@ -29,15 +29,51 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-import React, { forwardRef, useRef, useEffect } from "react";
+import require$$0, { forwardRef, useRef, useEffect } from "react";
 import { ValueSelector } from "react-querybuilder";
-const BootstrapDragHandle = forwardRef(({ className, title }, dragRef) => /* @__PURE__ */ React.createElement("span", {
-  ref: dragRef,
+var jsxRuntime = { exports: {} };
+var reactJsxRuntime_production_min = {};
+/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var f = require$$0, k = Symbol.for("react.element"), l = Symbol.for("react.fragment"), m = Object.prototype.hasOwnProperty, n = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, p = { key: true, ref: true, __self: true, __source: true };
+function q(c, a, g) {
+  var b, d = {}, e = null, h = null;
+  g !== void 0 && (e = "" + g);
+  a.key !== void 0 && (e = "" + a.key);
+  a.ref !== void 0 && (h = a.ref);
+  for (b in a)
+    m.call(a, b) && !p.hasOwnProperty(b) && (d[b] = a[b]);
+  if (c && c.defaultProps)
+    for (b in a = c.defaultProps, a)
+      d[b] === void 0 && (d[b] = a[b]);
+  return { $$typeof: k, type: c, key: e, ref: h, props: d, _owner: n.current };
+}
+reactJsxRuntime_production_min.Fragment = l;
+reactJsxRuntime_production_min.jsx = q;
+reactJsxRuntime_production_min.jsxs = q;
+{
+  jsxRuntime.exports = reactJsxRuntime_production_min;
+}
+const jsx = jsxRuntime.exports.jsx;
+const jsxs = jsxRuntime.exports.jsxs;
+const BootstrapDragHandle = forwardRef(({
   className,
   title
-}, /* @__PURE__ */ React.createElement("i", {
-  className: "bi bi-grip-vertical"
-})));
+}, dragRef) => /* @__PURE__ */ jsx("span", {
+  ref: dragRef,
+  className,
+  title,
+  children: /* @__PURE__ */ jsx("i", {
+    className: "bi bi-grip-vertical"
+  })
+}));
 BootstrapDragHandle.displayName = "BootstrapDragHandle";
 const BootstrapNotToggle = ({
   className,
@@ -48,20 +84,22 @@ const BootstrapNotToggle = ({
   disabled
 }) => {
   const id = useRef(`notToggle-${Math.random()}`);
-  return /* @__PURE__ */ React.createElement("div", {
-    className: `form-check-inline form-switch ${className}`
-  }, /* @__PURE__ */ React.createElement("input", {
-    id: id.current,
-    className: "form-check-input",
-    type: "checkbox",
-    onChange: (e) => handleOnChange(e.target.checked),
-    checked: !!checked,
-    disabled
-  }), /* @__PURE__ */ React.createElement("label", {
-    title,
-    htmlFor: id.current,
-    className: "form-check-label"
-  }, label));
+  return /* @__PURE__ */ jsxs("div", {
+    className: `form-check-inline form-switch ${className}`,
+    children: [/* @__PURE__ */ jsx("input", {
+      id: id.current,
+      className: "form-check-input",
+      type: "checkbox",
+      onChange: (e) => handleOnChange(e.target.checked),
+      checked: !!checked,
+      disabled
+    }), /* @__PURE__ */ jsx("label", {
+      title,
+      htmlFor: id.current,
+      className: "form-check-label",
+      children: label
+    })]
+  });
 };
 BootstrapNotToggle.displayName = "BootstrapNotToggle";
 const BootstrapValueEditor = (_a) => {
@@ -102,7 +140,7 @@ const BootstrapValueEditor = (_a) => {
   switch (type) {
     case "select":
     case "multiselect":
-      return /* @__PURE__ */ React.createElement(ValueSelector, __spreadProps(__spreadValues({}, props), {
+      return /* @__PURE__ */ jsx(ValueSelector, __spreadProps(__spreadValues({}, props), {
         className: `${className} form-select form-select-sm`,
         title,
         handleOnChange,
@@ -112,7 +150,7 @@ const BootstrapValueEditor = (_a) => {
         options: values
       }));
     case "textarea":
-      return /* @__PURE__ */ React.createElement("textarea", {
+      return /* @__PURE__ */ jsx("textarea", {
         value,
         title,
         className,
@@ -121,18 +159,19 @@ const BootstrapValueEditor = (_a) => {
         onChange: (e) => handleOnChange(e.target.value)
       });
     case "switch":
-      return /* @__PURE__ */ React.createElement("span", {
-        className: `custom-control custom-switch ${className}`
-      }, /* @__PURE__ */ React.createElement("input", {
-        type: "checkbox",
-        className: `form-check-input custom-control-input`,
-        title,
-        disabled,
-        onChange: (e) => handleOnChange(e.target.checked),
-        checked: !!value
-      }));
+      return /* @__PURE__ */ jsx("span", {
+        className: `custom-control custom-switch ${className}`,
+        children: /* @__PURE__ */ jsx("input", {
+          type: "checkbox",
+          className: `form-check-input custom-control-input`,
+          title,
+          disabled,
+          onChange: (e) => handleOnChange(e.target.checked),
+          checked: !!value
+        })
+      });
     case "checkbox":
-      return /* @__PURE__ */ React.createElement("input", {
+      return /* @__PURE__ */ jsx("input", {
         type: "checkbox",
         className: `form-check-input ${className}`,
         title,
@@ -141,25 +180,27 @@ const BootstrapValueEditor = (_a) => {
         checked: !!value
       });
     case "radio":
-      return /* @__PURE__ */ React.createElement("span", {
-        title
-      }, values.map((v) => /* @__PURE__ */ React.createElement("div", {
-        key: v.name,
-        className: "form-check form-check-inline"
-      }, /* @__PURE__ */ React.createElement("input", {
-        className: "form-check-input",
-        type: "radio",
-        id: v.name,
-        value: v.name,
-        checked: value === v.name,
-        disabled,
-        onChange: (e) => handleOnChange(e.target.value)
-      }), /* @__PURE__ */ React.createElement("label", {
-        className: "form-check-label",
-        htmlFor: v.name
-      }, v.label))));
+      return /* @__PURE__ */ jsx("span", {
+        title,
+        children: values.map((v) => /* @__PURE__ */ jsxs("div", {
+          className: "form-check form-check-inline",
+          children: [/* @__PURE__ */ jsx("input", {
+            className: "form-check-input",
+            type: "radio",
+            id: v.name,
+            value: v.name,
+            checked: value === v.name,
+            disabled,
+            onChange: (e) => handleOnChange(e.target.value)
+          }), /* @__PURE__ */ jsx("label", {
+            className: "form-check-label",
+            htmlFor: v.name,
+            children: v.label
+          })]
+        }, v.name))
+      });
   }
-  return /* @__PURE__ */ React.createElement("input", {
+  return /* @__PURE__ */ jsx("input", {
     type: inputTypeCoerced,
     value,
     title,

package/dist/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../src/BootstrapDragHandle.tsx","../src/BootstrapNotToggle.tsx","../src/BootstrapValueEditor.tsx","../src/index.ts"],"sourcesContent":["import { forwardRef } from 'react';\nimport type { DragHandleProps } from 'react-querybuilder';\n\nexport const BootstrapDragHandle = forwardRef<HTMLSpanElement, DragHandleProps>(\n  ({ className, title }, dragRef) => (\n    <span ref={dragRef} className={className} title={title}>\n      <i className=\"bi bi-grip-vertical\"></i>\n    </span>\n  )\n);\n\nBootstrapDragHandle.displayName = 'BootstrapDragHandle';\n","import { useRef } from 'react';\nimport type { NotToggleProps } from 'react-querybuilder';\n\nexport const BootstrapNotToggle = ({\n  className,\n  handleOnChange,\n  title,\n  label,\n  checked,\n  disabled,\n}: NotToggleProps) => {\n  const id = useRef(`notToggle-${Math.random()}`);\n\n  return (\n    <div className={`form-check-inline form-switch ${className}`}>\n      <input\n        id={id.current}\n        className=\"form-check-input\"\n        type=\"checkbox\"\n        onChange={e => handleOnChange(e.target.checked)}\n        checked={!!checked}\n        disabled={disabled}\n      />\n      <label title={title} htmlFor={id.current} className=\"form-check-label\">\n        {label}\n      </label>\n    </div>\n  );\n};\n\nBootstrapNotToggle.displayName = 'BootstrapNotToggle';\n","import { useEffect } from 'react';\nimport { ValueEditorProps, ValueSelector } from 'react-querybuilder';\n\nexport const BootstrapValueEditor = ({\n  fieldData,\n  operator,\n  value,\n  handleOnChange,\n  title,\n  className,\n  type,\n  inputType,\n  values,\n  disabled,\n  ...props\n}: ValueEditorProps) => {\n  useEffect(() => {\n    if (\n      inputType === 'number' &&\n      !['between', 'notBetween', 'in', 'notIn'].includes(operator) &&\n      typeof value === 'string' &&\n      value.includes(',')\n    ) {\n      handleOnChange('');\n    }\n  }, [inputType, operator, value, handleOnChange]);\n\n  if (operator === 'null' || operator === 'notNull') {\n    return null;\n  }\n\n  const placeHolderText = fieldData?.placeholder ?? '';\n  const inputTypeCoerced = ['between', 'notBetween', 'in', 'notIn'].includes(operator)\n    ? 'text'\n    : inputType || 'text';\n\n  switch (type) {\n    case 'select':\n    case 'multiselect':\n      return (\n        <ValueSelector\n          {...props}\n          className={`${className} form-select form-select-sm`}\n          title={title}\n          handleOnChange={handleOnChange}\n          value={value}\n          disabled={disabled}\n          multiple={type === 'multiselect'}\n          options={values!}\n        />\n      );\n\n    case 'textarea':\n      return (\n        <textarea\n          value={value}\n          title={title}\n          className={className}\n          disabled={disabled}\n          placeholder={placeHolderText}\n          onChange={e => handleOnChange(e.target.value)}\n        />\n      );\n\n    case 'switch':\n      return (\n        <span className={`custom-control custom-switch ${className}`}>\n          <input\n            type=\"checkbox\"\n            className={`form-check-input custom-control-input`}\n            title={title}\n            disabled={disabled}\n            onChange={e => handleOnChange(e.target.checked)}\n            checked={!!value}\n          />\n        </span>\n      );\n\n    case 'checkbox':\n      return (\n        <input\n          type=\"checkbox\"\n          className={`form-check-input ${className}`}\n          title={title}\n          disabled={disabled}\n          onChange={e => handleOnChange(e.target.checked)}\n          checked={!!value}\n        />\n      );\n\n    case 'radio':\n      return (\n        <span title={title}>\n          {values!.map(v => (\n            <div key={v.name} className=\"form-check form-check-inline\">\n              <input\n                className=\"form-check-input\"\n                type=\"radio\"\n                id={v.name}\n                value={v.name}\n                checked={value === v.name}\n                disabled={disabled}\n                onChange={e => handleOnChange(e.target.value)}\n              />\n              <label className=\"form-check-label\" htmlFor={v.name}>\n                {v.label}\n              </label>\n            </div>\n          ))}\n        </span>\n      );\n  }\n\n  return (\n    <input\n      type={inputTypeCoerced}\n      value={value}\n      title={title}\n      className={className}\n      disabled={disabled}\n      placeholder={placeHolderText}\n      onChange={e => handleOnChange(e.target.value)}\n    />\n  );\n};\n\nBootstrapValueEditor.displayName = 'BootstrapValueEditor';\n","import type { Classnames, Controls } from 'react-querybuilder';\nimport { BootstrapDragHandle } from './BootstrapDragHandle';\nimport { BootstrapNotToggle } from './BootstrapNotToggle';\nimport { BootstrapValueEditor } from './BootstrapValueEditor';\n\nexport const bootstrapControlElements: Partial<Controls> = {\n  dragHandle: BootstrapDragHandle,\n  notToggle: BootstrapNotToggle,\n  valueEditor: BootstrapValueEditor,\n};\n\nexport const bootstrapControlClassnames: Partial<Classnames> = {\n  addGroup: 'btn btn-secondary btn-sm',\n  addRule: 'btn btn-primary btn-sm',\n  cloneGroup: 'btn btn-secondary btn-sm',\n  cloneRule: 'btn btn-secondary btn-sm',\n  lockGroup: 'btn btn-secondary btn-sm',\n  lockRule: 'btn btn-secondary btn-sm',\n  removeGroup: 'btn btn-danger btn-sm',\n  removeRule: 'btn btn-danger btn-sm',\n  combinators: 'form-select form-select-sm',\n  fields: 'form-select form-select-sm',\n  operators: 'form-select form-select-sm',\n  value: 'form-control form-control-sm',\n  valueSource: 'form-select form-select-sm',\n};\n\nexport { BootstrapDragHandle, BootstrapNotToggle, BootstrapValueEditor };\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.es.js","sources":["../../../node_modules/react/cjs/react-jsx-runtime.production.min.js","../../../node_modules/react/jsx-runtime.js","../react/jsx-runtime","../src/BootstrapDragHandle.tsx","../src/BootstrapNotToggle.tsx","../src/BootstrapValueEditor.tsx","../src/index.ts"],"sourcesContent":["/**\n * @license React\n * react-jsx-runtime.production.min.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n'use strict';var f=require(\"react\"),k=Symbol.for(\"react.element\"),l=Symbol.for(\"react.fragment\"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};\nfunction q(c,a,g){var b,d={},e=null,h=null;void 0!==g&&(e=\"\"+g);void 0!==a.key&&(e=\"\"+a.key);void 0!==a.ref&&(h=a.ref);for(b in a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}exports.Fragment=l;exports.jsx=q;exports.jsxs=q;\n","'use strict';\n\nif (process.env.NODE_ENV === 'production') {\n  module.exports = require('./cjs/react-jsx-runtime.production.min.js');\n} else {\n  module.exports = require('./cjs/react-jsx-runtime.development.js');\n}\n","import * as jsxRuntime from \"/Users/jake/git/react-querybuilder/node_modules/react/jsx-runtime.js\"\nexport const jsx = jsxRuntime.jsx\nexport const jsxs = jsxRuntime.jsxs\nexport const Fragment = jsxRuntime.Fragment","import { forwardRef } from 'react';\nimport type { DragHandleProps } from 'react-querybuilder';\n\nexport const BootstrapDragHandle = forwardRef<HTMLSpanElement, DragHandleProps>(\n  ({ className, title }, dragRef) => (\n    <span ref={dragRef} className={className} title={title}>\n      <i className=\"bi bi-grip-vertical\"></i>\n    </span>\n  )\n);\n\nBootstrapDragHandle.displayName = 'BootstrapDragHandle';\n","import { useRef } from 'react';\nimport type { NotToggleProps } from 'react-querybuilder';\n\nexport const BootstrapNotToggle = ({\n  className,\n  handleOnChange,\n  title,\n  label,\n  checked,\n  disabled,\n}: NotToggleProps) => {\n  const id = useRef(`notToggle-${Math.random()}`);\n\n  return (\n    <div className={`form-check-inline form-switch ${className}`}>\n      <input\n        id={id.current}\n        className=\"form-check-input\"\n        type=\"checkbox\"\n        onChange={e => handleOnChange(e.target.checked)}\n        checked={!!checked}\n        disabled={disabled}\n      />\n      <label title={title} htmlFor={id.current} className=\"form-check-label\">\n        {label}\n      </label>\n    </div>\n  );\n};\n\nBootstrapNotToggle.displayName = 'BootstrapNotToggle';\n","import { useEffect } from 'react';\nimport { ValueEditorProps, ValueSelector } from 'react-querybuilder';\n\nexport const BootstrapValueEditor = ({\n  fieldData,\n  operator,\n  value,\n  handleOnChange,\n  title,\n  className,\n  type,\n  inputType,\n  values,\n  disabled,\n  ...props\n}: ValueEditorProps) => {\n  useEffect(() => {\n    if (\n      inputType === 'number' &&\n      !['between', 'notBetween', 'in', 'notIn'].includes(operator) &&\n      typeof value === 'string' &&\n      value.includes(',')\n    ) {\n      handleOnChange('');\n    }\n  }, [inputType, operator, value, handleOnChange]);\n\n  if (operator === 'null' || operator === 'notNull') {\n    return null;\n  }\n\n  const placeHolderText = fieldData?.placeholder ?? '';\n  const inputTypeCoerced = ['between', 'notBetween', 'in', 'notIn'].includes(operator)\n    ? 'text'\n    : inputType || 'text';\n\n  switch (type) {\n    case 'select':\n    case 'multiselect':\n      return (\n        <ValueSelector\n          {...props}\n          className={`${className} form-select form-select-sm`}\n          title={title}\n          handleOnChange={handleOnChange}\n          value={value}\n          disabled={disabled}\n          multiple={type === 'multiselect'}\n          options={values!}\n        />\n      );\n\n    case 'textarea':\n      return (\n        <textarea\n          value={value}\n          title={title}\n          className={className}\n          disabled={disabled}\n          placeholder={placeHolderText}\n          onChange={e => handleOnChange(e.target.value)}\n        />\n      );\n\n    case 'switch':\n      return (\n        <span className={`custom-control custom-switch ${className}`}>\n          <input\n            type=\"checkbox\"\n            className={`form-check-input custom-control-input`}\n            title={title}\n            disabled={disabled}\n            onChange={e => handleOnChange(e.target.checked)}\n            checked={!!value}\n          />\n        </span>\n      );\n\n    case 'checkbox':\n      return (\n        <input\n          type=\"checkbox\"\n          className={`form-check-input ${className}`}\n          title={title}\n          disabled={disabled}\n          onChange={e => handleOnChange(e.target.checked)}\n          checked={!!value}\n        />\n      );\n\n    case 'radio':\n      return (\n        <span title={title}>\n          {values!.map(v => (\n            <div key={v.name} className=\"form-check form-check-inline\">\n              <input\n                className=\"form-check-input\"\n                type=\"radio\"\n                id={v.name}\n                value={v.name}\n                checked={value === v.name}\n                disabled={disabled}\n                onChange={e => handleOnChange(e.target.value)}\n              />\n              <label className=\"form-check-label\" htmlFor={v.name}>\n                {v.label}\n              </label>\n            </div>\n          ))}\n        </span>\n      );\n  }\n\n  return (\n    <input\n      type={inputTypeCoerced}\n      value={value}\n      title={title}\n      className={className}\n      disabled={disabled}\n      placeholder={placeHolderText}\n      onChange={e => handleOnChange(e.target.value)}\n    />\n  );\n};\n\nBootstrapValueEditor.displayName = 'BootstrapValueEditor';\n","import type { Classnames, Controls } from 'react-querybuilder';\nimport { BootstrapDragHandle } from './BootstrapDragHandle';\nimport { BootstrapNotToggle } from './BootstrapNotToggle';\nimport { BootstrapValueEditor } from './BootstrapValueEditor';\n\nexport const bootstrapControlElements: Partial<Controls> = {\n  dragHandle: BootstrapDragHandle,\n  notToggle: BootstrapNotToggle,\n  valueEditor: BootstrapValueEditor,\n};\n\nexport const bootstrapControlClassnames: Partial<Classnames> = {\n  addGroup: 'btn btn-secondary btn-sm',\n  addRule: 'btn btn-primary btn-sm',\n  cloneGroup: 'btn btn-secondary btn-sm',\n  cloneRule: 'btn btn-secondary btn-sm',\n  lockGroup: 'btn btn-secondary btn-sm',\n  lockRule: 'btn btn-secondary btn-sm',\n  removeGroup: 'btn btn-danger btn-sm',\n  removeRule: 'btn btn-danger btn-sm',\n  combinators: 'form-select form-select-sm',\n  fields: 'form-select form-select-sm',\n  operators: 'form-select form-select-sm',\n  value: 'form-control form-control-sm',\n  valueSource: 'form-select form-select-sm',\n};\n\nexport { BootstrapDragHandle, BootstrapNotToggle, BootstrapValueEditor };\n"],"names":["jsxRuntimeModule","require$$0","jsxRuntime.jsx","jsxRuntime.jsxs","BootstrapDragHandle","forwardRef","className","title","dragRef","displayName","BootstrapNotToggle","handleOnChange","label","checked","disabled","id","useRef","Math","random","_jsx","current","e","target","BootstrapValueEditor","fieldData","operator","value","type","inputType","values","props","useEffect","includes","placeHolderText","placeholder","inputTypeCoerced","map","v","name"],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@react-querybuilder/bootstrap",
   "description": "Custom Bootstrap components for react-querybuilder",
-  "version": "4.2.4",
+  "version": "4.3.1",
   "publishConfig": {
     "access": "public"
   },
@@ -19,15 +19,17 @@
   "license": "MIT",
   "homepage": "https://react-querybuilder.js.org/",
   "scripts": {
+    "start": "vite",
     "build": "vite build && tsc --emitDeclarationOnly",
     "type-check": "tsc --noEmit",
     "type-check:watch": "yarn type-check --watch"
   },
   "devDependencies": {
-    "@types/react": "^17.0.0",
+    "@types/react": "^18.0.0",
+    "@vitejs/plugin-react": "^1.3.0",
     "bootstrap-icons": "^1.7.0",
-    "react": "^17.0.1",
-    "react-querybuilder": "^4.2.4",
+    "react": "^18.1.0",
+    "react-querybuilder": "^4.3.1",
     "typescript": "^4.5.0"
   },
   "peerDependencies": {
@@ -36,5 +38,5 @@
     "react": ">=16.8.0",
     "react-querybuilder": ">=4"
   },
-  "gitHead": "124168edfed24d50c74478c99aaa156b6e344fd1"
+  "gitHead": "80ffb29f2d7655dc08a03ef6ca1675e63ced8703"
 }