@react-querybuilder/bulma - npm Package Compare versions

Comparing version 4.0.0 to 4.1.0

dist/index.cjs.js

@@ -1,1 +0,1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports[Symbol.toStringTag]="Module";var f=require("react");function B(t){return t&&typeof t=="object"&&"default"in t?t:{default:t}}var e=B(f);const E=({className:t,handleOnClick:n,label:a,title:c,disabled:u})=>e.default.createElement("button",{className:`${t} button is-small`,title:c,onClick:m=>n(m),disabled:u},a);E.displayName="BulmaActionElement";const b=({className:t,handleOnChange:n,label:a,checked:c,title:u,disabled:m})=>e.default.createElement("label",{className:`${t} checkbox`,title:u},e.default.createElement("input",{type:"checkbox",disabled:m,checked:c,onChange:r=>n(r.target.checked)}),a);b.displayName="BulmaNotToggle";const g=({fieldData:t,operator:n,value:a,handleOnChange:c,title:u,className:m,type:r,inputType:s,values:o,disabled:d})=>{var i;if(f.useEffect(()=>{s==="number"&&!["between","notBetween","in","notIn"].includes(n)&&typeof a=="string"&&a.includes(",")&&c("")},[s,n,a,c]),n==="null"||n==="notNull")return null;const y=(i=t==null?void 0:t.placeholder)!=null?i:"",k=["between","notBetween","in","notIn"].includes(n)?"text":s||"text";switch(r){case"select":return e.default.createElement("div",{title:u,className:`${m} select is-small`},e.default.createElement("select",{value:a,disabled:d,onChange:l=>c(l.target.value)},o&&o.map(l=>e.default.createElement("option",{key:l.name,value:l.name},l.label))));case"checkbox":return e.default.createElement("label",{title:u,className:`${m} checkbox`},e.default.createElement("input",{type:"checkbox",checked:!!a,disabled:d,onChange:l=>c(l.target.checked)}));case"radio":return e.default.createElement("div",{className:`${m} control`,title:u},o.map(l=>e.default.createElement("label",{key:l.name,className:"radio"},e.default.createElement("input",{type:"radio",value:l.name,checked:a===l.name,onChange:()=>c(l.name),disabled:d}),l.label)));default:return e.default.createElement("div",{className:`${m} control`},e.default.createElement("input",{type:k,value:a,title:u,disabled:d,className:"input is-small",placeholder:y,onChange:l=>c(l.target.value)}))}};g.displayName="BulmaValueEditor";const p=({className:t,handleOnChange:n,options:a,value:c,title:u,disabled:m})=>e.default.createElement("div",{title:u,className:`${t} select is-small`},e.default.createElement("select",{value:c,disabled:m,onChange:r=>n(r.target.value)},a.map(r=>{var o;const s=`key-${(o=r.id)!=null?o:r.name}`;return e.default.createElement("option",{key:s,value:r.name},r.label)})));p.displayName="BulmaValueSelector";exports.BulmaActionElement=E;exports.BulmaNotToggle=b;exports.BulmaValueEditor=g;exports.BulmaValueSelector=p;
+"use strict";var _=Object.defineProperty,T=Object.defineProperties;var j=Object.getOwnPropertyDescriptors;var s=Object.getOwnPropertySymbols;var y=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable;var g=(e,t,l)=>t in e?_(e,t,{enumerable:!0,configurable:!0,writable:!0,value:l}):e[t]=l,k=(e,t)=>{for(var l in t||(t={}))y.call(t,l)&&g(e,l,t[l]);if(s)for(var l of s(t))b.call(t,l)&&g(e,l,t[l]);return e},B=(e,t)=>T(e,j(t));var N=(e,t)=>{var l={};for(var a in e)y.call(e,a)&&t.indexOf(a)<0&&(l[a]=e[a]);if(e!=null&&s)for(var a of s(e))t.indexOf(a)<0&&b.call(e,a)&&(l[a]=e[a]);return l};Object.defineProperty(exports,"__esModule",{value:!0});exports[Symbol.toStringTag]="Module";var h=require("react");function C(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var n=C(h);const x=({className:e,handleOnClick:t,label:l,title:a,disabled:c})=>n.default.createElement("button",{className:`${e} button is-small`,title:a,onClick:u=>t(u),disabled:c},l);x.displayName="BulmaActionElement";const A=({className:e,handleOnChange:t,label:l,checked:a,title:c,disabled:u})=>n.default.createElement("label",{className:`${e} checkbox`,title:c},n.default.createElement("input",{type:"checkbox",disabled:u,checked:a,onChange:m=>t(m.target.checked)}),l);A.displayName="BulmaNotToggle";const I=e=>Array.isArray(e)&&e.length>0&&"options"in e[0],M=e=>I(e)?e.map(t=>n.default.createElement("optgroup",{key:t.label,label:t.label},t.options.map(l=>n.default.createElement("option",{key:l.name,value:l.name},l.label)))):Array.isArray(e)?e.map(t=>n.default.createElement("option",{key:t.name,value:t.name},t.label)):null,d=({className:e,handleOnChange:t,options:l,value:a,title:c,disabled:u})=>n.default.createElement("div",{title:c,className:`${e} select is-small`},n.default.createElement("select",{value:a,disabled:u,onChange:m=>t(m.target.value)},M(l)));d.displayName="BulmaValueSelector";const V=R=>{var p=R,{fieldData:e,operator:t,value:l,handleOnChange:a,title:c,className:u,type:m,inputType:i,values:f,disabled:r}=p,$=N(p,["fieldData","operator","value","handleOnChange","title","className","type","inputType","values","disabled"]);var E;if(h.useEffect(()=>{i==="number"&&!["between","notBetween","in","notIn"].includes(t)&&typeof l=="string"&&l.includes(",")&&a("")},[i,t,l,a]),t==="null"||t==="notNull")return null;const w=(E=e==null?void 0:e.placeholder)!=null?E:"",S=["between","notBetween","in","notIn"].includes(t)?"text":i||"text";switch(m){case"select":return n.default.createElement(d,B(k({},$),{title:c,className:u,handleOnChange:a,options:f,value:l,disabled:r}));case"checkbox":return n.default.createElement("label",{title:c,className:`${u} checkbox`},n.default.createElement("input",{type:"checkbox",checked:!!l,disabled:r,onChange:o=>a(o.target.checked)}));case"radio":return n.default.createElement("div",{className:`${u} control`,title:c},f.map(o=>n.default.createElement("label",{key:o.name,className:"radio"},n.default.createElement("input",{type:"radio",value:o.name,checked:l===o.name,onChange:()=>a(o.name),disabled:r}),o.label)));default:return n.default.createElement("div",{className:`${u} control`},n.default.createElement("input",{type:S,value:l,title:c,disabled:r,className:"input is-small",placeholder:w,onChange:o=>a(o.target.value)}))}};V.displayName="BulmaValueEditor";exports.BulmaActionElement=x;exports.BulmaNotToggle=A;exports.BulmaValueEditor=V;exports.BulmaValueSelector=d;

dist/index.es.js

@@ -0,1 +1,32 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 import React, { useEffect } from "react";
@@ -32,15 +63,54 @@ const BulmaActionElement = ({
 BulmaNotToggle.displayName = "BulmaNotToggle";
-const BulmaValueEditor = ({
-  fieldData,
-  operator,
+const isOptionGroupArray = (arr) => Array.isArray(arr) && arr.length > 0 && "options" in arr[0];
+const toOptions = (arr) => isOptionGroupArray(arr) ? arr.map((og) => /* @__PURE__ */ React.createElement("optgroup", {
+  key: og.label,
+  label: og.label
+}, og.options.map((opt) => /* @__PURE__ */ React.createElement("option", {
+  key: opt.name,
+  value: opt.name
+}, opt.label)))) : Array.isArray(arr) ? arr.map((opt) => /* @__PURE__ */ React.createElement("option", {
+  key: opt.name,
+  value: opt.name
+}, opt.label)) : null;
+const BulmaValueSelector = ({
+  className,
+  handleOnChange,
+  options,
   value,
-  handleOnChange,
   title,
-  className,
-  type,
-  inputType,
-  values,
   disabled
-}) => {
-  var _a;
+}) => /* @__PURE__ */ React.createElement("div", {
+  title,
+  className: `${className} select is-small`
+}, /* @__PURE__ */ React.createElement("select", {
+  value,
+  disabled,
+  onChange: (e) => handleOnChange(e.target.value)
+}, toOptions(options)));
+BulmaValueSelector.displayName = "BulmaValueSelector";
+const BulmaValueEditor = (_a) => {
+  var _b = _a, {
+    fieldData,
+    operator,
+    value,
+    handleOnChange,
+    title,
+    className,
+    type,
+    inputType,
+    values,
+    disabled
+  } = _b, props = __objRest(_b, [
+    "fieldData",
+    "operator",
+    "value",
+    "handleOnChange",
+    "title",
+    "className",
+    "type",
+    "inputType",
+    "values",
+    "disabled"
+  ]);
+  var _a2;
   useEffect(() => {
@@ -54,17 +124,14 @@ if (inputType === "number" && !["between", "notBetween", "in", "notIn"].includes(operator) && typeof value === "string" && value.includes(",")) {
   }
-  const placeHolderText = (_a = fieldData == null ? void 0 : fieldData.placeholder) != null ? _a : "";
+  const placeHolderText = (_a2 = fieldData == null ? void 0 : fieldData.placeholder) != null ? _a2 : "";
   const inputTypeCoerced = ["between", "notBetween", "in", "notIn"].includes(operator) ? "text" : inputType || "text";
   switch (type) {
     case "select":
-      return /* @__PURE__ */ React.createElement("div", {
+      return /* @__PURE__ */ React.createElement(BulmaValueSelector, __spreadProps(__spreadValues({}, props), {
         title,
-        className: `${className} select is-small`
-      }, /* @__PURE__ */ React.createElement("select", {
+        className,
+        handleOnChange,
+        options: values,
         value,
-        disabled,
-        onChange: (e) => handleOnChange(e.target.value)
-      }, values && values.map((v) => /* @__PURE__ */ React.createElement("option", {
-        key: v.name,
-        value: v.name
-      }, v.label))));
+        disabled
+      }));
     case "checkbox":
@@ -109,25 +176,2 @@ return /* @__PURE__ */ React.createElement("label", {
 BulmaValueEditor.displayName = "BulmaValueEditor";
-const BulmaValueSelector = ({
-  className,
-  handleOnChange,
-  options,
-  value,
-  title,
-  disabled
-}) => /* @__PURE__ */ React.createElement("div", {
-  title,
-  className: `${className} select is-small`
-}, /* @__PURE__ */ React.createElement("select", {
-  value,
-  disabled,
-  onChange: (e) => handleOnChange(e.target.value)
-}, options.map((option) => {
-  var _a;
-  const key = `key-${(_a = option.id) != null ? _a : option.name}`;
-  return /* @__PURE__ */ React.createElement("option", {
-    key,
-    value: option.name
-  }, option.label);
-})));
-BulmaValueSelector.displayName = "BulmaValueSelector";
 export { BulmaActionElement, BulmaNotToggle, BulmaValueEditor, BulmaValueSelector };

dist/types/BulmaValueEditor.d.ts

 /// <reference types="react" />
 import type { ValueEditorProps } from 'react-querybuilder';
 export declare const BulmaValueEditor: {
-    ({ fieldData, operator, value, handleOnChange, title, className, type, inputType, values, disabled, }: ValueEditorProps): JSX.Element | null;
+    ({ fieldData, operator, value, handleOnChange, title, className, type, inputType, values, disabled, ...props }: ValueEditorProps): JSX.Element | null;
     displayName: string;
 };

package.json

 {
   "name": "@react-querybuilder/bulma",
   "description": "Custom Bulma components for react-querybuilder",
-  "version": "4.0.0",
+  "version": "4.1.0",
   "publishConfig": {
@@ -24,6 +24,6 @@ "access": "public"
   "devDependencies": {
-    "@react-querybuilder/compat": "^4.0.0",
+    "@react-querybuilder/compat": "^4.1.0",
     "@types/react": "^17.0.0",
     "react": "^17.0.1",
-    "react-querybuilder": "^4.0.0",
+    "react-querybuilder": "^4.1.0",
     "typescript": "^4.5.0"
@@ -36,3 +36,3 @@ },
   },
-  "gitHead": "99f25d2dbadcfd341160b9ce4aec1420746f8bf4"
+  "gitHead": "b73987bada7b64b5df892f92ceb8691a488d096c"
 }

No alert changes

Improved metrics

Total package byte prevSize

14322

increased by24.12%

Number of package files

11

increased by10%

Lines of code

220

increased by30.18%

No dependency changes