@react-querybuilder/bootstrap 6.1.3 → 6.2.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +6 -0
- package/dist/cjs/react-querybuilder_bootstrap.cjs.development.js +207 -0
- package/dist/cjs/react-querybuilder_bootstrap.cjs.development.js.map +1 -0
- package/dist/cjs/react-querybuilder_bootstrap.cjs.production.js +2 -0
- package/dist/cjs/react-querybuilder_bootstrap.cjs.production.js.map +1 -0
- package/dist/react-querybuilder_bootstrap.d.ts +22 -0
- package/dist/react-querybuilder_bootstrap.legacy-esm.js +204 -0
- package/dist/react-querybuilder_bootstrap.legacy-esm.js.map +1 -0
- package/dist/react-querybuilder_bootstrap.mjs +183 -0
- package/dist/react-querybuilder_bootstrap.mjs.map +1 -0
- package/dist/react-querybuilder_bootstrap.production.mjs +2 -0
- package/dist/react-querybuilder_bootstrap.production.mjs.map +1 -0
- package/package.json +19 -25
- package/dist/index.cjs +0 -2
- package/dist/index.cjs.map +0 -1
- package/dist/index.mjs +0 -154
- package/dist/index.mjs.map +0 -1
- package/dist/types/Bootstrap.test.d.ts +0 -5
- package/dist/types/Bootstrap.test.d.ts.map +0 -1
- package/dist/types/BootstrapDragHandle.d.ts +0 -4
- package/dist/types/BootstrapDragHandle.d.ts.map +0 -1
- package/dist/types/BootstrapNotToggle.d.ts +0 -6
- package/dist/types/BootstrapNotToggle.d.ts.map +0 -1
- package/dist/types/BootstrapValueEditor.d.ts +0 -6
- package/dist/types/BootstrapValueEditor.d.ts.map +0 -1
- package/dist/types/index.d.ts +0 -9
- package/dist/types/index.d.ts.map +0 -1
- package/index.d.mts +0 -4
|
@@ -0,0 +1,207 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/index.ts
|
|
21
|
+
var src_exports = {};
|
|
22
|
+
__export(src_exports, {
|
|
23
|
+
BootstrapDragHandle: () => BootstrapDragHandle,
|
|
24
|
+
BootstrapNotToggle: () => BootstrapNotToggle,
|
|
25
|
+
BootstrapValueEditor: () => BootstrapValueEditor,
|
|
26
|
+
QueryBuilderBootstrap: () => QueryBuilderBootstrap,
|
|
27
|
+
bootstrapControlClassnames: () => bootstrapControlClassnames,
|
|
28
|
+
bootstrapControlElements: () => bootstrapControlElements
|
|
29
|
+
});
|
|
30
|
+
module.exports = __toCommonJS(src_exports);
|
|
31
|
+
var import_react_querybuilder2 = require("react-querybuilder");
|
|
32
|
+
|
|
33
|
+
// src/BootstrapDragHandle.tsx
|
|
34
|
+
var import_react = require("react");
|
|
35
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
|
+
var BootstrapDragHandle = (0, import_react.forwardRef)(
|
|
37
|
+
({ className, title }, dragRef) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { ref: dragRef, className, title, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("i", { className: "bi bi-grip-vertical" }) })
|
|
38
|
+
);
|
|
39
|
+
BootstrapDragHandle.displayName = "BootstrapDragHandle";
|
|
40
|
+
|
|
41
|
+
// src/BootstrapNotToggle.tsx
|
|
42
|
+
var import_react2 = require("react");
|
|
43
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
44
|
+
var BootstrapNotToggle = ({
|
|
45
|
+
className,
|
|
46
|
+
handleOnChange,
|
|
47
|
+
title,
|
|
48
|
+
label,
|
|
49
|
+
checked,
|
|
50
|
+
disabled
|
|
51
|
+
}) => {
|
|
52
|
+
const id = (0, import_react2.useId)();
|
|
53
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: `form-check-inline form-switch ${className}`, children: [
|
|
54
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
55
|
+
"input",
|
|
56
|
+
{
|
|
57
|
+
id,
|
|
58
|
+
className: "form-check-input",
|
|
59
|
+
type: "checkbox",
|
|
60
|
+
onChange: (e) => handleOnChange(e.target.checked),
|
|
61
|
+
checked: !!checked,
|
|
62
|
+
disabled
|
|
63
|
+
}
|
|
64
|
+
),
|
|
65
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("label", { title, htmlFor: id, className: "form-check-label", children: label })
|
|
66
|
+
] });
|
|
67
|
+
};
|
|
68
|
+
BootstrapNotToggle.displayName = "BootstrapNotToggle";
|
|
69
|
+
|
|
70
|
+
// src/BootstrapValueEditor.tsx
|
|
71
|
+
var import_react_querybuilder = require("react-querybuilder");
|
|
72
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
73
|
+
var import_react3 = require("react");
|
|
74
|
+
var BootstrapValueEditor = (props) => {
|
|
75
|
+
const { valueAsArray, multiValueHandler } = (0, import_react_querybuilder.useValueEditor)({
|
|
76
|
+
handleOnChange: props.handleOnChange,
|
|
77
|
+
inputType: props.inputType,
|
|
78
|
+
operator: props.operator,
|
|
79
|
+
value: props.value,
|
|
80
|
+
type: props.type,
|
|
81
|
+
listsAsArrays: props.listsAsArrays,
|
|
82
|
+
parseNumbers: props.parseNumbers,
|
|
83
|
+
values: props.values
|
|
84
|
+
});
|
|
85
|
+
const { selectorComponent: SelectorComponent = import_react_querybuilder.ValueSelector } = props;
|
|
86
|
+
if (props.operator === "null" || props.operator === "notNull") {
|
|
87
|
+
return null;
|
|
88
|
+
}
|
|
89
|
+
const placeHolderText = props.fieldData?.placeholder ?? "";
|
|
90
|
+
if ((props.operator === "between" || props.operator === "notBetween") && (props.type === "select" || props.type === "text")) {
|
|
91
|
+
const editors = ["from", "to"].map((key, i) => {
|
|
92
|
+
if (props.type === "text") {
|
|
93
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
94
|
+
"input",
|
|
95
|
+
{
|
|
96
|
+
type: props.inputType || "text",
|
|
97
|
+
placeholder: placeHolderText,
|
|
98
|
+
value: valueAsArray[i] ?? "",
|
|
99
|
+
className: `${import_react_querybuilder.standardClassnames.valueListItem} form-control form-control-sm`,
|
|
100
|
+
disabled: props.disabled,
|
|
101
|
+
onChange: (e) => multiValueHandler(e.target.value, i)
|
|
102
|
+
},
|
|
103
|
+
key
|
|
104
|
+
);
|
|
105
|
+
}
|
|
106
|
+
return /* @__PURE__ */ (0, import_react3.createElement)(
|
|
107
|
+
SelectorComponent,
|
|
108
|
+
{
|
|
109
|
+
...props,
|
|
110
|
+
key,
|
|
111
|
+
className: `${import_react_querybuilder.standardClassnames.valueListItem} form-select form-select-sm`,
|
|
112
|
+
handleOnChange: (v) => multiValueHandler(v, i),
|
|
113
|
+
disabled: props.disabled,
|
|
114
|
+
value: valueAsArray[i] ?? (0, import_react_querybuilder.getFirstOption)(props.values),
|
|
115
|
+
options: props.values ?? [],
|
|
116
|
+
listsAsArrays: props.listsAsArrays
|
|
117
|
+
}
|
|
118
|
+
);
|
|
119
|
+
});
|
|
120
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { "data-testid": props.testID, className: import_react_querybuilder.standardClassnames.value, title: props.title, children: [
|
|
121
|
+
editors[0],
|
|
122
|
+
props.separator,
|
|
123
|
+
editors[1]
|
|
124
|
+
] });
|
|
125
|
+
}
|
|
126
|
+
switch (props.type) {
|
|
127
|
+
case "select":
|
|
128
|
+
case "multiselect":
|
|
129
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
130
|
+
import_react_querybuilder.ValueEditor,
|
|
131
|
+
{
|
|
132
|
+
skipHook: true,
|
|
133
|
+
...props,
|
|
134
|
+
className: `${props.className} form-select form-select-sm`
|
|
135
|
+
}
|
|
136
|
+
);
|
|
137
|
+
case "switch":
|
|
138
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: `custom-control custom-switch ${props.className}`, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
139
|
+
"input",
|
|
140
|
+
{
|
|
141
|
+
type: "checkbox",
|
|
142
|
+
className: "form-check-input custom-control-input",
|
|
143
|
+
title: props.title,
|
|
144
|
+
disabled: props.disabled,
|
|
145
|
+
onChange: (e) => props.handleOnChange(e.target.checked),
|
|
146
|
+
checked: !!props.value
|
|
147
|
+
}
|
|
148
|
+
) });
|
|
149
|
+
case "checkbox":
|
|
150
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_querybuilder.ValueEditor, { skipHook: true, ...props, className: `form-check-input ${props.className}` });
|
|
151
|
+
case "radio":
|
|
152
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { title: props.title, className: import_react_querybuilder.standardClassnames.value, children: props.values?.map((v) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "form-check form-check-inline", children: [
|
|
153
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
154
|
+
"input",
|
|
155
|
+
{
|
|
156
|
+
className: "form-check-input",
|
|
157
|
+
type: "radio",
|
|
158
|
+
id: v.name,
|
|
159
|
+
value: v.name,
|
|
160
|
+
checked: props.value === v.name,
|
|
161
|
+
disabled: props.disabled,
|
|
162
|
+
onChange: (e) => props.handleOnChange(e.target.value)
|
|
163
|
+
}
|
|
164
|
+
),
|
|
165
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)("label", { className: "form-check-label", htmlFor: v.name, children: v.label })
|
|
166
|
+
] }, v.name)) });
|
|
167
|
+
}
|
|
168
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_querybuilder.ValueEditor, { skipHook: true, ...props });
|
|
169
|
+
};
|
|
170
|
+
BootstrapValueEditor.displayName = "BootstrapValueEditor";
|
|
171
|
+
|
|
172
|
+
// src/index.ts
|
|
173
|
+
var bootstrapControlElements = {
|
|
174
|
+
dragHandle: BootstrapDragHandle,
|
|
175
|
+
notToggle: BootstrapNotToggle,
|
|
176
|
+
valueEditor: BootstrapValueEditor
|
|
177
|
+
};
|
|
178
|
+
var bootstrapControlClassnames = {
|
|
179
|
+
addGroup: "btn btn-secondary btn-sm",
|
|
180
|
+
addRule: "btn btn-primary btn-sm",
|
|
181
|
+
cloneGroup: "btn btn-secondary btn-sm",
|
|
182
|
+
cloneRule: "btn btn-secondary btn-sm",
|
|
183
|
+
lockGroup: "btn btn-secondary btn-sm",
|
|
184
|
+
lockRule: "btn btn-secondary btn-sm",
|
|
185
|
+
removeGroup: "btn btn-danger btn-sm",
|
|
186
|
+
removeRule: "btn btn-danger btn-sm",
|
|
187
|
+
combinators: "form-select form-select-sm",
|
|
188
|
+
fields: "form-select form-select-sm",
|
|
189
|
+
operators: "form-select form-select-sm",
|
|
190
|
+
value: "form-control form-control-sm",
|
|
191
|
+
valueSource: "form-select form-select-sm"
|
|
192
|
+
};
|
|
193
|
+
var QueryBuilderBootstrap = (0, import_react_querybuilder2.getCompatContextProvider)({
|
|
194
|
+
key: "bootstrap",
|
|
195
|
+
controlClassnames: bootstrapControlClassnames,
|
|
196
|
+
controlElements: bootstrapControlElements
|
|
197
|
+
});
|
|
198
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
199
|
+
0 && (module.exports = {
|
|
200
|
+
BootstrapDragHandle,
|
|
201
|
+
BootstrapNotToggle,
|
|
202
|
+
BootstrapValueEditor,
|
|
203
|
+
QueryBuilderBootstrap,
|
|
204
|
+
bootstrapControlClassnames,
|
|
205
|
+
bootstrapControlElements
|
|
206
|
+
});
|
|
207
|
+
//# sourceMappingURL=react-querybuilder_bootstrap.cjs.development.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/index.ts","../../src/BootstrapDragHandle.tsx","../../src/BootstrapNotToggle.tsx","../../src/BootstrapValueEditor.tsx"],"sourcesContent":["import type { Classnames, Controls } from '@react-querybuilder/ts';\nimport { getCompatContextProvider } from 'react-querybuilder';\nimport { BootstrapDragHandle } from './BootstrapDragHandle';\nimport { BootstrapNotToggle } from './BootstrapNotToggle';\nimport { BootstrapValueEditor } from './BootstrapValueEditor';\nexport { BootstrapDragHandle, BootstrapNotToggle, 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 const QueryBuilderBootstrap = getCompatContextProvider({\n key: 'bootstrap',\n controlClassnames: bootstrapControlClassnames,\n controlElements: bootstrapControlElements,\n});\n","import type { DragHandleProps } from '@react-querybuilder/ts';\nimport { forwardRef } from 'react';\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 type { NotToggleProps } from '@react-querybuilder/ts';\nimport { useId } from 'react';\n\nexport const BootstrapNotToggle = ({\n className,\n handleOnChange,\n title,\n label,\n checked,\n disabled,\n}: NotToggleProps) => {\n const id = useId();\n\n return (\n <div className={`form-check-inline form-switch ${className}`}>\n <input\n id={id}\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} className=\"form-check-label\">\n {label}\n </label>\n </div>\n );\n};\n\nBootstrapNotToggle.displayName = 'BootstrapNotToggle';\n","import type { ValueEditorProps } from 'react-querybuilder';\nimport {\n getFirstOption,\n standardClassnames,\n useValueEditor,\n ValueEditor,\n ValueSelector,\n} from 'react-querybuilder';\n\nexport const BootstrapValueEditor = (props: ValueEditorProps) => {\n const { valueAsArray, multiValueHandler } = useValueEditor({\n handleOnChange: props.handleOnChange,\n inputType: props.inputType,\n operator: props.operator,\n value: props.value,\n type: props.type,\n listsAsArrays: props.listsAsArrays,\n parseNumbers: props.parseNumbers,\n values: props.values,\n });\n\n const { selectorComponent: SelectorComponent = ValueSelector } = props;\n\n if (props.operator === 'null' || props.operator === 'notNull') {\n return null;\n }\n\n const placeHolderText = props.fieldData?.placeholder ?? '';\n\n if (\n (props.operator === 'between' || props.operator === 'notBetween') &&\n (props.type === 'select' || props.type === 'text')\n ) {\n const editors = ['from', 'to'].map((key, i) => {\n if (props.type === 'text') {\n return (\n <input\n key={key}\n type={props.inputType || 'text'}\n placeholder={placeHolderText}\n value={valueAsArray[i] ?? ''}\n className={`${standardClassnames.valueListItem} form-control form-control-sm`}\n disabled={props.disabled}\n onChange={e => multiValueHandler(e.target.value, i)}\n />\n );\n }\n return (\n <SelectorComponent\n {...props}\n key={key}\n className={`${standardClassnames.valueListItem} form-select form-select-sm`}\n handleOnChange={v => multiValueHandler(v, i)}\n disabled={props.disabled}\n value={valueAsArray[i] ?? getFirstOption(props.values)}\n options={props.values ?? []}\n listsAsArrays={props.listsAsArrays}\n />\n );\n });\n\n return (\n <span data-testid={props.testID} className={standardClassnames.value} title={props.title}>\n {editors[0]}\n {props.separator}\n {editors[1]}\n </span>\n );\n }\n\n switch (props.type) {\n case 'select':\n case 'multiselect':\n return (\n <ValueEditor\n skipHook\n {...props}\n className={`${props.className} form-select form-select-sm`}\n />\n );\n\n case 'switch':\n return (\n <span className={`custom-control custom-switch ${props.className}`}>\n <input\n type=\"checkbox\"\n className=\"form-check-input custom-control-input\"\n title={props.title}\n disabled={props.disabled}\n onChange={e => props.handleOnChange(e.target.checked)}\n checked={!!props.value}\n />\n </span>\n );\n\n case 'checkbox':\n return <ValueEditor skipHook {...props} className={`form-check-input ${props.className}`} />;\n\n case 'radio':\n return (\n <span title={props.title} className={standardClassnames.value}>\n {props.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={props.value === v.name}\n disabled={props.disabled}\n onChange={e => props.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 <ValueEditor skipHook {...props} />;\n};\n\nBootstrapValueEditor.displayName = 'BootstrapValueEditor';\n"],"mappings":"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","names":["import_react_querybuilder","import_react","import_jsx_runtime","import_jsx_runtime","import_react"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var h=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var B=Object.getOwnPropertyNames;var H=Object.prototype.hasOwnProperty;var E=(e,t)=>{for(var r in t)h(e,r,{get:t[r],enumerable:!0})},T=(e,t,r,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of B(t))!H.call(e,s)&&s!==r&&h(e,s,{get:()=>t[s],enumerable:!(c=x(t,s))||c.enumerable});return e};var A=e=>T(h({},"__esModule",{value:!0}),e);var V={};E(V,{BootstrapDragHandle:()=>d,BootstrapNotToggle:()=>u,BootstrapValueEditor:()=>b,QueryBuilderBootstrap:()=>P,bootstrapControlClassnames:()=>C,bootstrapControlElements:()=>p});module.exports=A(V);var v=require("react-querybuilder");var g=require("react"),y=require("react/jsx-runtime"),d=(0,g.forwardRef)(({className:e,title:t},r)=>(0,y.jsx)("span",{ref:r,className:e,title:t,children:(0,y.jsx)("i",{className:"bi bi-grip-vertical"})}));d.displayName="BootstrapDragHandle";var N=require("react"),i=require("react/jsx-runtime"),u=({className:e,handleOnChange:t,title:r,label:c,checked:s,disabled:l})=>{let n=(0,N.useId)();return(0,i.jsxs)("div",{className:`form-check-inline form-switch ${e}`,children:[(0,i.jsx)("input",{id:n,className:"form-check-input",type:"checkbox",onChange:m=>t(m.target.checked),checked:!!s,disabled:l}),(0,i.jsx)("label",{title:r,htmlFor:n,className:"form-check-label",children:c})]})};u.displayName="BootstrapNotToggle";var a=require("react-querybuilder"),o=require("react/jsx-runtime"),k=require("react"),b=e=>{let{valueAsArray:t,multiValueHandler:r}=(0,a.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:c=a.ValueSelector}=e;if(e.operator==="null"||e.operator==="notNull")return null;let s=e.fieldData?.placeholder??"";if((e.operator==="between"||e.operator==="notBetween")&&(e.type==="select"||e.type==="text")){let l=["from","to"].map((n,m)=>e.type==="text"?(0,o.jsx)("input",{type:e.inputType||"text",placeholder:s,value:t[m]??"",className:`${a.standardClassnames.valueListItem} form-control form-control-sm`,disabled:e.disabled,onChange:f=>r(f.target.value,m)},n):(0,k.createElement)(c,{...e,key:n,className:`${a.standardClassnames.valueListItem} form-select form-select-sm`,handleOnChange:f=>r(f,m),disabled:e.disabled,value:t[m]??(0,a.getFirstOption)(e.values),options:e.values??[],listsAsArrays:e.listsAsArrays}));return(0,o.jsxs)("span",{"data-testid":e.testID,className:a.standardClassnames.value,title:e.title,children:[l[0],e.separator,l[1]]})}switch(e.type){case"select":case"multiselect":return(0,o.jsx)(a.ValueEditor,{skipHook:!0,...e,className:`${e.className} form-select form-select-sm`});case"switch":return(0,o.jsx)("span",{className:`custom-control custom-switch ${e.className}`,children:(0,o.jsx)("input",{type:"checkbox",className:"form-check-input custom-control-input",title:e.title,disabled:e.disabled,onChange:l=>e.handleOnChange(l.target.checked),checked:!!e.value})});case"checkbox":return(0,o.jsx)(a.ValueEditor,{skipHook:!0,...e,className:`form-check-input ${e.className}`});case"radio":return(0,o.jsx)("span",{title:e.title,className:a.standardClassnames.value,children:e.values?.map(l=>(0,o.jsxs)("div",{className:"form-check form-check-inline",children:[(0,o.jsx)("input",{className:"form-check-input",type:"radio",id:l.name,value:l.name,checked:e.value===l.name,disabled:e.disabled,onChange:n=>e.handleOnChange(n.target.value)}),(0,o.jsx)("label",{className:"form-check-label",htmlFor:l.name,children:l.label})]},l.name))})}return(0,o.jsx)(a.ValueEditor,{skipHook:!0,...e})};b.displayName="BootstrapValueEditor";var p={dragHandle:d,notToggle:u,valueEditor:b},C={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"},P=(0,v.getCompatContextProvider)({key:"bootstrap",controlClassnames:C,controlElements:p});0&&(module.exports={BootstrapDragHandle,BootstrapNotToggle,BootstrapValueEditor,QueryBuilderBootstrap,bootstrapControlClassnames,bootstrapControlElements});
|
|
2
|
+
//# sourceMappingURL=react-querybuilder_bootstrap.cjs.production.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/index.ts","../../src/BootstrapDragHandle.tsx","../../src/BootstrapNotToggle.tsx","../../src/BootstrapValueEditor.tsx"],"sourcesContent":["import type { Classnames, Controls } from '@react-querybuilder/ts';\nimport { getCompatContextProvider } from 'react-querybuilder';\nimport { BootstrapDragHandle } from './BootstrapDragHandle';\nimport { BootstrapNotToggle } from './BootstrapNotToggle';\nimport { BootstrapValueEditor } from './BootstrapValueEditor';\nexport { BootstrapDragHandle, BootstrapNotToggle, 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 const QueryBuilderBootstrap = getCompatContextProvider({\n key: 'bootstrap',\n controlClassnames: bootstrapControlClassnames,\n controlElements: bootstrapControlElements,\n});\n","import type { DragHandleProps } from '@react-querybuilder/ts';\nimport { forwardRef } from 'react';\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 type { NotToggleProps } from '@react-querybuilder/ts';\nimport { useId } from 'react';\n\nexport const BootstrapNotToggle = ({\n className,\n handleOnChange,\n title,\n label,\n checked,\n disabled,\n}: NotToggleProps) => {\n const id = useId();\n\n return (\n <div className={`form-check-inline form-switch ${className}`}>\n <input\n id={id}\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} className=\"form-check-label\">\n {label}\n </label>\n </div>\n );\n};\n\nBootstrapNotToggle.displayName = 'BootstrapNotToggle';\n","import type { ValueEditorProps } from 'react-querybuilder';\nimport {\n getFirstOption,\n standardClassnames,\n useValueEditor,\n ValueEditor,\n ValueSelector,\n} from 'react-querybuilder';\n\nexport const BootstrapValueEditor = (props: ValueEditorProps) => {\n const { valueAsArray, multiValueHandler } = useValueEditor({\n handleOnChange: props.handleOnChange,\n inputType: props.inputType,\n operator: props.operator,\n value: props.value,\n type: props.type,\n listsAsArrays: props.listsAsArrays,\n parseNumbers: props.parseNumbers,\n values: props.values,\n });\n\n const { selectorComponent: SelectorComponent = ValueSelector } = props;\n\n if (props.operator === 'null' || props.operator === 'notNull') {\n return null;\n }\n\n const placeHolderText = props.fieldData?.placeholder ?? '';\n\n if (\n (props.operator === 'between' || props.operator === 'notBetween') &&\n (props.type === 'select' || props.type === 'text')\n ) {\n const editors = ['from', 'to'].map((key, i) => {\n if (props.type === 'text') {\n return (\n <input\n key={key}\n type={props.inputType || 'text'}\n placeholder={placeHolderText}\n value={valueAsArray[i] ?? ''}\n className={`${standardClassnames.valueListItem} form-control form-control-sm`}\n disabled={props.disabled}\n onChange={e => multiValueHandler(e.target.value, i)}\n />\n );\n }\n return (\n <SelectorComponent\n {...props}\n key={key}\n className={`${standardClassnames.valueListItem} form-select form-select-sm`}\n handleOnChange={v => multiValueHandler(v, i)}\n disabled={props.disabled}\n value={valueAsArray[i] ?? getFirstOption(props.values)}\n options={props.values ?? []}\n listsAsArrays={props.listsAsArrays}\n />\n );\n });\n\n return (\n <span data-testid={props.testID} className={standardClassnames.value} title={props.title}>\n {editors[0]}\n {props.separator}\n {editors[1]}\n </span>\n );\n }\n\n switch (props.type) {\n case 'select':\n case 'multiselect':\n return (\n <ValueEditor\n skipHook\n {...props}\n className={`${props.className} form-select form-select-sm`}\n />\n );\n\n case 'switch':\n return (\n <span className={`custom-control custom-switch ${props.className}`}>\n <input\n type=\"checkbox\"\n className=\"form-check-input custom-control-input\"\n title={props.title}\n disabled={props.disabled}\n onChange={e => props.handleOnChange(e.target.checked)}\n checked={!!props.value}\n />\n </span>\n );\n\n case 'checkbox':\n return <ValueEditor skipHook {...props} className={`form-check-input ${props.className}`} />;\n\n case 'radio':\n return (\n <span title={props.title} className={standardClassnames.value}>\n {props.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={props.value === v.name}\n disabled={props.disabled}\n onChange={e => props.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 <ValueEditor skipHook {...props} />;\n};\n\nBootstrapValueEditor.displayName = 'BootstrapValueEditor';\n"],"mappings":"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","names":["src_exports","__export","BootstrapDragHandle","BootstrapNotToggle","BootstrapValueEditor","QueryBuilderBootstrap","bootstrapControlClassnames","bootstrapControlElements","__toCommonJS","import_react_querybuilder","import_react","import_jsx_runtime","BootstrapDragHandle","className","title","dragRef","import_react","import_jsx_runtime","BootstrapNotToggle","className","handleOnChange","title","label","checked","disabled","id","e","import_react_querybuilder","import_jsx_runtime","import_react","BootstrapValueEditor","props","valueAsArray","multiValueHandler","SelectorComponent","placeHolderText","editors","key","i","e","v","bootstrapControlElements","BootstrapDragHandle","BootstrapNotToggle","BootstrapValueEditor","bootstrapControlClassnames","QueryBuilderBootstrap"]}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import * as react_querybuilder from 'react-querybuilder';
|
|
2
|
+
import { ValueEditorProps } from 'react-querybuilder';
|
|
3
|
+
import { DragHandleProps, NotToggleProps, Controls, Classnames } from '@react-querybuilder/ts';
|
|
4
|
+
import * as react from 'react';
|
|
5
|
+
|
|
6
|
+
declare const BootstrapDragHandle: react.ForwardRefExoticComponent<DragHandleProps & react.RefAttributes<HTMLSpanElement>>;
|
|
7
|
+
|
|
8
|
+
declare const BootstrapNotToggle: {
|
|
9
|
+
({ className, handleOnChange, title, label, checked, disabled, }: NotToggleProps): JSX.Element;
|
|
10
|
+
displayName: string;
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
declare const BootstrapValueEditor: {
|
|
14
|
+
(props: ValueEditorProps): JSX.Element | null;
|
|
15
|
+
displayName: string;
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
declare const bootstrapControlElements: Partial<Controls>;
|
|
19
|
+
declare const bootstrapControlClassnames: Partial<Classnames>;
|
|
20
|
+
declare const QueryBuilderBootstrap: react_querybuilder.QueryBuilderContextProvider<Record<string, any>>;
|
|
21
|
+
|
|
22
|
+
export { BootstrapDragHandle, BootstrapNotToggle, BootstrapValueEditor, QueryBuilderBootstrap, bootstrapControlClassnames, bootstrapControlElements };
|
|
@@ -0,0 +1,204 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
|
|
21
|
+
// src/index.ts
|
|
22
|
+
import { getCompatContextProvider } from "react-querybuilder";
|
|
23
|
+
|
|
24
|
+
// src/BootstrapDragHandle.tsx
|
|
25
|
+
import { forwardRef } from "react";
|
|
26
|
+
import { jsx } from "react/jsx-runtime";
|
|
27
|
+
var BootstrapDragHandle = forwardRef(
|
|
28
|
+
({ className, title }, dragRef) => /* @__PURE__ */ jsx("span", { ref: dragRef, className, title, children: /* @__PURE__ */ jsx("i", { className: "bi bi-grip-vertical" }) })
|
|
29
|
+
);
|
|
30
|
+
BootstrapDragHandle.displayName = "BootstrapDragHandle";
|
|
31
|
+
|
|
32
|
+
// src/BootstrapNotToggle.tsx
|
|
33
|
+
import { useId } from "react";
|
|
34
|
+
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
35
|
+
var BootstrapNotToggle = ({
|
|
36
|
+
className,
|
|
37
|
+
handleOnChange,
|
|
38
|
+
title,
|
|
39
|
+
label,
|
|
40
|
+
checked,
|
|
41
|
+
disabled
|
|
42
|
+
}) => {
|
|
43
|
+
const id = useId();
|
|
44
|
+
return /* @__PURE__ */ jsxs("div", { className: `form-check-inline form-switch ${className}`, children: [
|
|
45
|
+
/* @__PURE__ */ jsx2(
|
|
46
|
+
"input",
|
|
47
|
+
{
|
|
48
|
+
id,
|
|
49
|
+
className: "form-check-input",
|
|
50
|
+
type: "checkbox",
|
|
51
|
+
onChange: (e) => handleOnChange(e.target.checked),
|
|
52
|
+
checked: !!checked,
|
|
53
|
+
disabled
|
|
54
|
+
}
|
|
55
|
+
),
|
|
56
|
+
/* @__PURE__ */ jsx2("label", { title, htmlFor: id, className: "form-check-label", children: label })
|
|
57
|
+
] });
|
|
58
|
+
};
|
|
59
|
+
BootstrapNotToggle.displayName = "BootstrapNotToggle";
|
|
60
|
+
|
|
61
|
+
// src/BootstrapValueEditor.tsx
|
|
62
|
+
import {
|
|
63
|
+
getFirstOption,
|
|
64
|
+
standardClassnames,
|
|
65
|
+
useValueEditor,
|
|
66
|
+
ValueEditor,
|
|
67
|
+
ValueSelector
|
|
68
|
+
} from "react-querybuilder";
|
|
69
|
+
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
70
|
+
import { createElement } from "react";
|
|
71
|
+
var BootstrapValueEditor = (props) => {
|
|
72
|
+
var _a, _b, _c;
|
|
73
|
+
const { valueAsArray, multiValueHandler } = useValueEditor({
|
|
74
|
+
handleOnChange: props.handleOnChange,
|
|
75
|
+
inputType: props.inputType,
|
|
76
|
+
operator: props.operator,
|
|
77
|
+
value: props.value,
|
|
78
|
+
type: props.type,
|
|
79
|
+
listsAsArrays: props.listsAsArrays,
|
|
80
|
+
parseNumbers: props.parseNumbers,
|
|
81
|
+
values: props.values
|
|
82
|
+
});
|
|
83
|
+
const { selectorComponent: SelectorComponent = ValueSelector } = props;
|
|
84
|
+
if (props.operator === "null" || props.operator === "notNull") {
|
|
85
|
+
return null;
|
|
86
|
+
}
|
|
87
|
+
const placeHolderText = (_b = (_a = props.fieldData) == null ? void 0 : _a.placeholder) != null ? _b : "";
|
|
88
|
+
if ((props.operator === "between" || props.operator === "notBetween") && (props.type === "select" || props.type === "text")) {
|
|
89
|
+
const editors = ["from", "to"].map((key, i) => {
|
|
90
|
+
var _a2, _b2, _c2;
|
|
91
|
+
if (props.type === "text") {
|
|
92
|
+
return /* @__PURE__ */ jsx3(
|
|
93
|
+
"input",
|
|
94
|
+
{
|
|
95
|
+
type: props.inputType || "text",
|
|
96
|
+
placeholder: placeHolderText,
|
|
97
|
+
value: (_a2 = valueAsArray[i]) != null ? _a2 : "",
|
|
98
|
+
className: `${standardClassnames.valueListItem} form-control form-control-sm`,
|
|
99
|
+
disabled: props.disabled,
|
|
100
|
+
onChange: (e) => multiValueHandler(e.target.value, i)
|
|
101
|
+
},
|
|
102
|
+
key
|
|
103
|
+
);
|
|
104
|
+
}
|
|
105
|
+
return /* @__PURE__ */ createElement(
|
|
106
|
+
SelectorComponent,
|
|
107
|
+
__spreadProps(__spreadValues({}, props), {
|
|
108
|
+
key,
|
|
109
|
+
className: `${standardClassnames.valueListItem} form-select form-select-sm`,
|
|
110
|
+
handleOnChange: (v) => multiValueHandler(v, i),
|
|
111
|
+
disabled: props.disabled,
|
|
112
|
+
value: (_b2 = valueAsArray[i]) != null ? _b2 : getFirstOption(props.values),
|
|
113
|
+
options: (_c2 = props.values) != null ? _c2 : [],
|
|
114
|
+
listsAsArrays: props.listsAsArrays
|
|
115
|
+
})
|
|
116
|
+
);
|
|
117
|
+
});
|
|
118
|
+
return /* @__PURE__ */ jsxs2("span", { "data-testid": props.testID, className: standardClassnames.value, title: props.title, children: [
|
|
119
|
+
editors[0],
|
|
120
|
+
props.separator,
|
|
121
|
+
editors[1]
|
|
122
|
+
] });
|
|
123
|
+
}
|
|
124
|
+
switch (props.type) {
|
|
125
|
+
case "select":
|
|
126
|
+
case "multiselect":
|
|
127
|
+
return /* @__PURE__ */ jsx3(
|
|
128
|
+
ValueEditor,
|
|
129
|
+
__spreadProps(__spreadValues({
|
|
130
|
+
skipHook: true
|
|
131
|
+
}, props), {
|
|
132
|
+
className: `${props.className} form-select form-select-sm`
|
|
133
|
+
})
|
|
134
|
+
);
|
|
135
|
+
case "switch":
|
|
136
|
+
return /* @__PURE__ */ jsx3("span", { className: `custom-control custom-switch ${props.className}`, children: /* @__PURE__ */ jsx3(
|
|
137
|
+
"input",
|
|
138
|
+
{
|
|
139
|
+
type: "checkbox",
|
|
140
|
+
className: "form-check-input custom-control-input",
|
|
141
|
+
title: props.title,
|
|
142
|
+
disabled: props.disabled,
|
|
143
|
+
onChange: (e) => props.handleOnChange(e.target.checked),
|
|
144
|
+
checked: !!props.value
|
|
145
|
+
}
|
|
146
|
+
) });
|
|
147
|
+
case "checkbox":
|
|
148
|
+
return /* @__PURE__ */ jsx3(ValueEditor, __spreadProps(__spreadValues({ skipHook: true }, props), { className: `form-check-input ${props.className}` }));
|
|
149
|
+
case "radio":
|
|
150
|
+
return /* @__PURE__ */ jsx3("span", { title: props.title, className: standardClassnames.value, children: (_c = props.values) == null ? void 0 : _c.map((v) => /* @__PURE__ */ jsxs2("div", { className: "form-check form-check-inline", children: [
|
|
151
|
+
/* @__PURE__ */ jsx3(
|
|
152
|
+
"input",
|
|
153
|
+
{
|
|
154
|
+
className: "form-check-input",
|
|
155
|
+
type: "radio",
|
|
156
|
+
id: v.name,
|
|
157
|
+
value: v.name,
|
|
158
|
+
checked: props.value === v.name,
|
|
159
|
+
disabled: props.disabled,
|
|
160
|
+
onChange: (e) => props.handleOnChange(e.target.value)
|
|
161
|
+
}
|
|
162
|
+
),
|
|
163
|
+
/* @__PURE__ */ jsx3("label", { className: "form-check-label", htmlFor: v.name, children: v.label })
|
|
164
|
+
] }, v.name)) });
|
|
165
|
+
}
|
|
166
|
+
return /* @__PURE__ */ jsx3(ValueEditor, __spreadValues({ skipHook: true }, props));
|
|
167
|
+
};
|
|
168
|
+
BootstrapValueEditor.displayName = "BootstrapValueEditor";
|
|
169
|
+
|
|
170
|
+
// src/index.ts
|
|
171
|
+
var bootstrapControlElements = {
|
|
172
|
+
dragHandle: BootstrapDragHandle,
|
|
173
|
+
notToggle: BootstrapNotToggle,
|
|
174
|
+
valueEditor: BootstrapValueEditor
|
|
175
|
+
};
|
|
176
|
+
var bootstrapControlClassnames = {
|
|
177
|
+
addGroup: "btn btn-secondary btn-sm",
|
|
178
|
+
addRule: "btn btn-primary btn-sm",
|
|
179
|
+
cloneGroup: "btn btn-secondary btn-sm",
|
|
180
|
+
cloneRule: "btn btn-secondary btn-sm",
|
|
181
|
+
lockGroup: "btn btn-secondary btn-sm",
|
|
182
|
+
lockRule: "btn btn-secondary btn-sm",
|
|
183
|
+
removeGroup: "btn btn-danger btn-sm",
|
|
184
|
+
removeRule: "btn btn-danger btn-sm",
|
|
185
|
+
combinators: "form-select form-select-sm",
|
|
186
|
+
fields: "form-select form-select-sm",
|
|
187
|
+
operators: "form-select form-select-sm",
|
|
188
|
+
value: "form-control form-control-sm",
|
|
189
|
+
valueSource: "form-select form-select-sm"
|
|
190
|
+
};
|
|
191
|
+
var QueryBuilderBootstrap = getCompatContextProvider({
|
|
192
|
+
key: "bootstrap",
|
|
193
|
+
controlClassnames: bootstrapControlClassnames,
|
|
194
|
+
controlElements: bootstrapControlElements
|
|
195
|
+
});
|
|
196
|
+
export {
|
|
197
|
+
BootstrapDragHandle,
|
|
198
|
+
BootstrapNotToggle,
|
|
199
|
+
BootstrapValueEditor,
|
|
200
|
+
QueryBuilderBootstrap,
|
|
201
|
+
bootstrapControlClassnames,
|
|
202
|
+
bootstrapControlElements
|
|
203
|
+
};
|
|
204
|
+
//# sourceMappingURL=react-querybuilder_bootstrap.legacy-esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/BootstrapDragHandle.tsx","../src/BootstrapNotToggle.tsx","../src/BootstrapValueEditor.tsx"],"sourcesContent":["import type { Classnames, Controls } from '@react-querybuilder/ts';\nimport { getCompatContextProvider } from 'react-querybuilder';\nimport { BootstrapDragHandle } from './BootstrapDragHandle';\nimport { BootstrapNotToggle } from './BootstrapNotToggle';\nimport { BootstrapValueEditor } from './BootstrapValueEditor';\nexport { BootstrapDragHandle, BootstrapNotToggle, 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 const QueryBuilderBootstrap = getCompatContextProvider({\n key: 'bootstrap',\n controlClassnames: bootstrapControlClassnames,\n controlElements: bootstrapControlElements,\n});\n","import type { DragHandleProps } from '@react-querybuilder/ts';\nimport { forwardRef } from 'react';\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 type { NotToggleProps } from '@react-querybuilder/ts';\nimport { useId } from 'react';\n\nexport const BootstrapNotToggle = ({\n className,\n handleOnChange,\n title,\n label,\n checked,\n disabled,\n}: NotToggleProps) => {\n const id = useId();\n\n return (\n <div className={`form-check-inline form-switch ${className}`}>\n <input\n id={id}\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} className=\"form-check-label\">\n {label}\n </label>\n </div>\n );\n};\n\nBootstrapNotToggle.displayName = 'BootstrapNotToggle';\n","import type { ValueEditorProps } from 'react-querybuilder';\nimport {\n getFirstOption,\n standardClassnames,\n useValueEditor,\n ValueEditor,\n ValueSelector,\n} from 'react-querybuilder';\n\nexport const BootstrapValueEditor = (props: ValueEditorProps) => {\n const { valueAsArray, multiValueHandler } = useValueEditor({\n handleOnChange: props.handleOnChange,\n inputType: props.inputType,\n operator: props.operator,\n value: props.value,\n type: props.type,\n listsAsArrays: props.listsAsArrays,\n parseNumbers: props.parseNumbers,\n values: props.values,\n });\n\n const { selectorComponent: SelectorComponent = ValueSelector } = props;\n\n if (props.operator === 'null' || props.operator === 'notNull') {\n return null;\n }\n\n const placeHolderText = props.fieldData?.placeholder ?? '';\n\n if (\n (props.operator === 'between' || props.operator === 'notBetween') &&\n (props.type === 'select' || props.type === 'text')\n ) {\n const editors = ['from', 'to'].map((key, i) => {\n if (props.type === 'text') {\n return (\n <input\n key={key}\n type={props.inputType || 'text'}\n placeholder={placeHolderText}\n value={valueAsArray[i] ?? ''}\n className={`${standardClassnames.valueListItem} form-control form-control-sm`}\n disabled={props.disabled}\n onChange={e => multiValueHandler(e.target.value, i)}\n />\n );\n }\n return (\n <SelectorComponent\n {...props}\n key={key}\n className={`${standardClassnames.valueListItem} form-select form-select-sm`}\n handleOnChange={v => multiValueHandler(v, i)}\n disabled={props.disabled}\n value={valueAsArray[i] ?? getFirstOption(props.values)}\n options={props.values ?? []}\n listsAsArrays={props.listsAsArrays}\n />\n );\n });\n\n return (\n <span data-testid={props.testID} className={standardClassnames.value} title={props.title}>\n {editors[0]}\n {props.separator}\n {editors[1]}\n </span>\n );\n }\n\n switch (props.type) {\n case 'select':\n case 'multiselect':\n return (\n <ValueEditor\n skipHook\n {...props}\n className={`${props.className} form-select form-select-sm`}\n />\n );\n\n case 'switch':\n return (\n <span className={`custom-control custom-switch ${props.className}`}>\n <input\n type=\"checkbox\"\n className=\"form-check-input custom-control-input\"\n title={props.title}\n disabled={props.disabled}\n onChange={e => props.handleOnChange(e.target.checked)}\n checked={!!props.value}\n />\n </span>\n );\n\n case 'checkbox':\n return <ValueEditor skipHook {...props} className={`form-check-input ${props.className}`} />;\n\n case 'radio':\n return (\n <span title={props.title} className={standardClassnames.value}>\n {props.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={props.value === v.name}\n disabled={props.disabled}\n onChange={e => props.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 <ValueEditor skipHook {...props} />;\n};\n\nBootstrapValueEditor.displayName = 'BootstrapValueEditor';\n"],"mappings":"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","names":["jsx","jsx","jsxs","_a","_b","_c"]}
|
|
@@ -0,0 +1,183 @@
|
|
|
1
|
+
// src/index.ts
|
|
2
|
+
import { getCompatContextProvider } from "react-querybuilder";
|
|
3
|
+
|
|
4
|
+
// src/BootstrapDragHandle.tsx
|
|
5
|
+
import { forwardRef } from "react";
|
|
6
|
+
import { jsx } from "react/jsx-runtime";
|
|
7
|
+
var BootstrapDragHandle = forwardRef(
|
|
8
|
+
({ className, title }, dragRef) => /* @__PURE__ */ jsx("span", { ref: dragRef, className, title, children: /* @__PURE__ */ jsx("i", { className: "bi bi-grip-vertical" }) })
|
|
9
|
+
);
|
|
10
|
+
BootstrapDragHandle.displayName = "BootstrapDragHandle";
|
|
11
|
+
|
|
12
|
+
// src/BootstrapNotToggle.tsx
|
|
13
|
+
import { useId } from "react";
|
|
14
|
+
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
15
|
+
var BootstrapNotToggle = ({
|
|
16
|
+
className,
|
|
17
|
+
handleOnChange,
|
|
18
|
+
title,
|
|
19
|
+
label,
|
|
20
|
+
checked,
|
|
21
|
+
disabled
|
|
22
|
+
}) => {
|
|
23
|
+
const id = useId();
|
|
24
|
+
return /* @__PURE__ */ jsxs("div", { className: `form-check-inline form-switch ${className}`, children: [
|
|
25
|
+
/* @__PURE__ */ jsx2(
|
|
26
|
+
"input",
|
|
27
|
+
{
|
|
28
|
+
id,
|
|
29
|
+
className: "form-check-input",
|
|
30
|
+
type: "checkbox",
|
|
31
|
+
onChange: (e) => handleOnChange(e.target.checked),
|
|
32
|
+
checked: !!checked,
|
|
33
|
+
disabled
|
|
34
|
+
}
|
|
35
|
+
),
|
|
36
|
+
/* @__PURE__ */ jsx2("label", { title, htmlFor: id, className: "form-check-label", children: label })
|
|
37
|
+
] });
|
|
38
|
+
};
|
|
39
|
+
BootstrapNotToggle.displayName = "BootstrapNotToggle";
|
|
40
|
+
|
|
41
|
+
// src/BootstrapValueEditor.tsx
|
|
42
|
+
import {
|
|
43
|
+
getFirstOption,
|
|
44
|
+
standardClassnames,
|
|
45
|
+
useValueEditor,
|
|
46
|
+
ValueEditor,
|
|
47
|
+
ValueSelector
|
|
48
|
+
} from "react-querybuilder";
|
|
49
|
+
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
50
|
+
import { createElement } from "react";
|
|
51
|
+
var BootstrapValueEditor = (props) => {
|
|
52
|
+
const { valueAsArray, multiValueHandler } = useValueEditor({
|
|
53
|
+
handleOnChange: props.handleOnChange,
|
|
54
|
+
inputType: props.inputType,
|
|
55
|
+
operator: props.operator,
|
|
56
|
+
value: props.value,
|
|
57
|
+
type: props.type,
|
|
58
|
+
listsAsArrays: props.listsAsArrays,
|
|
59
|
+
parseNumbers: props.parseNumbers,
|
|
60
|
+
values: props.values
|
|
61
|
+
});
|
|
62
|
+
const { selectorComponent: SelectorComponent = ValueSelector } = props;
|
|
63
|
+
if (props.operator === "null" || props.operator === "notNull") {
|
|
64
|
+
return null;
|
|
65
|
+
}
|
|
66
|
+
const placeHolderText = props.fieldData?.placeholder ?? "";
|
|
67
|
+
if ((props.operator === "between" || props.operator === "notBetween") && (props.type === "select" || props.type === "text")) {
|
|
68
|
+
const editors = ["from", "to"].map((key, i) => {
|
|
69
|
+
if (props.type === "text") {
|
|
70
|
+
return /* @__PURE__ */ jsx3(
|
|
71
|
+
"input",
|
|
72
|
+
{
|
|
73
|
+
type: props.inputType || "text",
|
|
74
|
+
placeholder: placeHolderText,
|
|
75
|
+
value: valueAsArray[i] ?? "",
|
|
76
|
+
className: `${standardClassnames.valueListItem} form-control form-control-sm`,
|
|
77
|
+
disabled: props.disabled,
|
|
78
|
+
onChange: (e) => multiValueHandler(e.target.value, i)
|
|
79
|
+
},
|
|
80
|
+
key
|
|
81
|
+
);
|
|
82
|
+
}
|
|
83
|
+
return /* @__PURE__ */ createElement(
|
|
84
|
+
SelectorComponent,
|
|
85
|
+
{
|
|
86
|
+
...props,
|
|
87
|
+
key,
|
|
88
|
+
className: `${standardClassnames.valueListItem} form-select form-select-sm`,
|
|
89
|
+
handleOnChange: (v) => multiValueHandler(v, i),
|
|
90
|
+
disabled: props.disabled,
|
|
91
|
+
value: valueAsArray[i] ?? getFirstOption(props.values),
|
|
92
|
+
options: props.values ?? [],
|
|
93
|
+
listsAsArrays: props.listsAsArrays
|
|
94
|
+
}
|
|
95
|
+
);
|
|
96
|
+
});
|
|
97
|
+
return /* @__PURE__ */ jsxs2("span", { "data-testid": props.testID, className: standardClassnames.value, title: props.title, children: [
|
|
98
|
+
editors[0],
|
|
99
|
+
props.separator,
|
|
100
|
+
editors[1]
|
|
101
|
+
] });
|
|
102
|
+
}
|
|
103
|
+
switch (props.type) {
|
|
104
|
+
case "select":
|
|
105
|
+
case "multiselect":
|
|
106
|
+
return /* @__PURE__ */ jsx3(
|
|
107
|
+
ValueEditor,
|
|
108
|
+
{
|
|
109
|
+
skipHook: true,
|
|
110
|
+
...props,
|
|
111
|
+
className: `${props.className} form-select form-select-sm`
|
|
112
|
+
}
|
|
113
|
+
);
|
|
114
|
+
case "switch":
|
|
115
|
+
return /* @__PURE__ */ jsx3("span", { className: `custom-control custom-switch ${props.className}`, children: /* @__PURE__ */ jsx3(
|
|
116
|
+
"input",
|
|
117
|
+
{
|
|
118
|
+
type: "checkbox",
|
|
119
|
+
className: "form-check-input custom-control-input",
|
|
120
|
+
title: props.title,
|
|
121
|
+
disabled: props.disabled,
|
|
122
|
+
onChange: (e) => props.handleOnChange(e.target.checked),
|
|
123
|
+
checked: !!props.value
|
|
124
|
+
}
|
|
125
|
+
) });
|
|
126
|
+
case "checkbox":
|
|
127
|
+
return /* @__PURE__ */ jsx3(ValueEditor, { skipHook: true, ...props, className: `form-check-input ${props.className}` });
|
|
128
|
+
case "radio":
|
|
129
|
+
return /* @__PURE__ */ jsx3("span", { title: props.title, className: standardClassnames.value, children: props.values?.map((v) => /* @__PURE__ */ jsxs2("div", { className: "form-check form-check-inline", children: [
|
|
130
|
+
/* @__PURE__ */ jsx3(
|
|
131
|
+
"input",
|
|
132
|
+
{
|
|
133
|
+
className: "form-check-input",
|
|
134
|
+
type: "radio",
|
|
135
|
+
id: v.name,
|
|
136
|
+
value: v.name,
|
|
137
|
+
checked: props.value === v.name,
|
|
138
|
+
disabled: props.disabled,
|
|
139
|
+
onChange: (e) => props.handleOnChange(e.target.value)
|
|
140
|
+
}
|
|
141
|
+
),
|
|
142
|
+
/* @__PURE__ */ jsx3("label", { className: "form-check-label", htmlFor: v.name, children: v.label })
|
|
143
|
+
] }, v.name)) });
|
|
144
|
+
}
|
|
145
|
+
return /* @__PURE__ */ jsx3(ValueEditor, { skipHook: true, ...props });
|
|
146
|
+
};
|
|
147
|
+
BootstrapValueEditor.displayName = "BootstrapValueEditor";
|
|
148
|
+
|
|
149
|
+
// src/index.ts
|
|
150
|
+
var bootstrapControlElements = {
|
|
151
|
+
dragHandle: BootstrapDragHandle,
|
|
152
|
+
notToggle: BootstrapNotToggle,
|
|
153
|
+
valueEditor: BootstrapValueEditor
|
|
154
|
+
};
|
|
155
|
+
var bootstrapControlClassnames = {
|
|
156
|
+
addGroup: "btn btn-secondary btn-sm",
|
|
157
|
+
addRule: "btn btn-primary btn-sm",
|
|
158
|
+
cloneGroup: "btn btn-secondary btn-sm",
|
|
159
|
+
cloneRule: "btn btn-secondary btn-sm",
|
|
160
|
+
lockGroup: "btn btn-secondary btn-sm",
|
|
161
|
+
lockRule: "btn btn-secondary btn-sm",
|
|
162
|
+
removeGroup: "btn btn-danger btn-sm",
|
|
163
|
+
removeRule: "btn btn-danger btn-sm",
|
|
164
|
+
combinators: "form-select form-select-sm",
|
|
165
|
+
fields: "form-select form-select-sm",
|
|
166
|
+
operators: "form-select form-select-sm",
|
|
167
|
+
value: "form-control form-control-sm",
|
|
168
|
+
valueSource: "form-select form-select-sm"
|
|
169
|
+
};
|
|
170
|
+
var QueryBuilderBootstrap = getCompatContextProvider({
|
|
171
|
+
key: "bootstrap",
|
|
172
|
+
controlClassnames: bootstrapControlClassnames,
|
|
173
|
+
controlElements: bootstrapControlElements
|
|
174
|
+
});
|
|
175
|
+
export {
|
|
176
|
+
BootstrapDragHandle,
|
|
177
|
+
BootstrapNotToggle,
|
|
178
|
+
BootstrapValueEditor,
|
|
179
|
+
QueryBuilderBootstrap,
|
|
180
|
+
bootstrapControlClassnames,
|
|
181
|
+
bootstrapControlElements
|
|
182
|
+
};
|
|
183
|
+
//# sourceMappingURL=react-querybuilder_bootstrap.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/BootstrapDragHandle.tsx","../src/BootstrapNotToggle.tsx","../src/BootstrapValueEditor.tsx"],"sourcesContent":["import type { Classnames, Controls } from '@react-querybuilder/ts';\nimport { getCompatContextProvider } from 'react-querybuilder';\nimport { BootstrapDragHandle } from './BootstrapDragHandle';\nimport { BootstrapNotToggle } from './BootstrapNotToggle';\nimport { BootstrapValueEditor } from './BootstrapValueEditor';\nexport { BootstrapDragHandle, BootstrapNotToggle, 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 const QueryBuilderBootstrap = getCompatContextProvider({\n key: 'bootstrap',\n controlClassnames: bootstrapControlClassnames,\n controlElements: bootstrapControlElements,\n});\n","import type { DragHandleProps } from '@react-querybuilder/ts';\nimport { forwardRef } from 'react';\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 type { NotToggleProps } from '@react-querybuilder/ts';\nimport { useId } from 'react';\n\nexport const BootstrapNotToggle = ({\n className,\n handleOnChange,\n title,\n label,\n checked,\n disabled,\n}: NotToggleProps) => {\n const id = useId();\n\n return (\n <div className={`form-check-inline form-switch ${className}`}>\n <input\n id={id}\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} className=\"form-check-label\">\n {label}\n </label>\n </div>\n );\n};\n\nBootstrapNotToggle.displayName = 'BootstrapNotToggle';\n","import type { ValueEditorProps } from 'react-querybuilder';\nimport {\n getFirstOption,\n standardClassnames,\n useValueEditor,\n ValueEditor,\n ValueSelector,\n} from 'react-querybuilder';\n\nexport const BootstrapValueEditor = (props: ValueEditorProps) => {\n const { valueAsArray, multiValueHandler } = useValueEditor({\n handleOnChange: props.handleOnChange,\n inputType: props.inputType,\n operator: props.operator,\n value: props.value,\n type: props.type,\n listsAsArrays: props.listsAsArrays,\n parseNumbers: props.parseNumbers,\n values: props.values,\n });\n\n const { selectorComponent: SelectorComponent = ValueSelector } = props;\n\n if (props.operator === 'null' || props.operator === 'notNull') {\n return null;\n }\n\n const placeHolderText = props.fieldData?.placeholder ?? '';\n\n if (\n (props.operator === 'between' || props.operator === 'notBetween') &&\n (props.type === 'select' || props.type === 'text')\n ) {\n const editors = ['from', 'to'].map((key, i) => {\n if (props.type === 'text') {\n return (\n <input\n key={key}\n type={props.inputType || 'text'}\n placeholder={placeHolderText}\n value={valueAsArray[i] ?? ''}\n className={`${standardClassnames.valueListItem} form-control form-control-sm`}\n disabled={props.disabled}\n onChange={e => multiValueHandler(e.target.value, i)}\n />\n );\n }\n return (\n <SelectorComponent\n {...props}\n key={key}\n className={`${standardClassnames.valueListItem} form-select form-select-sm`}\n handleOnChange={v => multiValueHandler(v, i)}\n disabled={props.disabled}\n value={valueAsArray[i] ?? getFirstOption(props.values)}\n options={props.values ?? []}\n listsAsArrays={props.listsAsArrays}\n />\n );\n });\n\n return (\n <span data-testid={props.testID} className={standardClassnames.value} title={props.title}>\n {editors[0]}\n {props.separator}\n {editors[1]}\n </span>\n );\n }\n\n switch (props.type) {\n case 'select':\n case 'multiselect':\n return (\n <ValueEditor\n skipHook\n {...props}\n className={`${props.className} form-select form-select-sm`}\n />\n );\n\n case 'switch':\n return (\n <span className={`custom-control custom-switch ${props.className}`}>\n <input\n type=\"checkbox\"\n className=\"form-check-input custom-control-input\"\n title={props.title}\n disabled={props.disabled}\n onChange={e => props.handleOnChange(e.target.checked)}\n checked={!!props.value}\n />\n </span>\n );\n\n case 'checkbox':\n return <ValueEditor skipHook {...props} className={`form-check-input ${props.className}`} />;\n\n case 'radio':\n return (\n <span title={props.title} className={standardClassnames.value}>\n {props.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={props.value === v.name}\n disabled={props.disabled}\n onChange={e => props.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 <ValueEditor skipHook {...props} />;\n};\n\nBootstrapValueEditor.displayName = 'BootstrapValueEditor';\n"],"mappings":";AACA,SAAS,gCAAgC;;;ACAzC,SAAS,kBAAkB;AAKrB;AAHC,IAAM,sBAAsB;AAAA,EACjC,CAAC,EAAE,WAAW,MAAM,GAAG,YACrB,oBAAC,UAAK,KAAK,SAAS,WAAsB,OACxC,8BAAC,OAAE,WAAU,uBAAsB,GACrC;AAEJ;AAEA,oBAAoB,cAAc;;;ACVlC,SAAS,aAAa;AAalB,SACE,OAAAA,MADF;AAXG,IAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACpB,QAAM,KAAK,MAAM;AAEjB,SACE,qBAAC,SAAI,WAAW,iCAAiC,aAC/C;AAAA,oBAAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAU;AAAA,QACV,MAAK;AAAA,QACL,UAAU,OAAK,eAAe,EAAE,OAAO,OAAO;AAAA,QAC9C,SAAS,CAAC,CAAC;AAAA,QACX;AAAA;AAAA,IACF;AAAA,IACA,gBAAAA,KAAC,WAAM,OAAc,SAAS,IAAI,WAAU,oBACzC,iBACH;AAAA,KACF;AAEJ;AAEA,mBAAmB,cAAc;;;AC7BjC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AA6BG,gBAAAC,MA0BJ,QAAAC,aA1BI;AAYF;AAvCD,IAAM,uBAAuB,CAAC,UAA4B;AAC/D,QAAM,EAAE,cAAc,kBAAkB,IAAI,eAAe;AAAA,IACzD,gBAAgB,MAAM;AAAA,IACtB,WAAW,MAAM;AAAA,IACjB,UAAU,MAAM;AAAA,IAChB,OAAO,MAAM;AAAA,IACb,MAAM,MAAM;AAAA,IACZ,eAAe,MAAM;AAAA,IACrB,cAAc,MAAM;AAAA,IACpB,QAAQ,MAAM;AAAA,EAChB,CAAC;AAED,QAAM,EAAE,mBAAmB,oBAAoB,cAAc,IAAI;AAEjE,MAAI,MAAM,aAAa,UAAU,MAAM,aAAa,WAAW;AAC7D,WAAO;AAAA,EACT;AAEA,QAAM,kBAAkB,MAAM,WAAW,eAAe;AAExD,OACG,MAAM,aAAa,aAAa,MAAM,aAAa,kBACnD,MAAM,SAAS,YAAY,MAAM,SAAS,SAC3C;AACA,UAAM,UAAU,CAAC,QAAQ,IAAI,EAAE,IAAI,CAAC,KAAK,MAAM;AAC7C,UAAI,MAAM,SAAS,QAAQ;AACzB,eACE,gBAAAD;AAAA,UAAC;AAAA;AAAA,YAEC,MAAM,MAAM,aAAa;AAAA,YACzB,aAAa;AAAA,YACb,OAAO,aAAa,CAAC,KAAK;AAAA,YAC1B,WAAW,GAAG,mBAAmB;AAAA,YACjC,UAAU,MAAM;AAAA,YAChB,UAAU,OAAK,kBAAkB,EAAE,OAAO,OAAO,CAAC;AAAA;AAAA,UAN7C;AAAA,QAOP;AAAA,MAEJ;AACA,aACE;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACJ;AAAA,UACA,WAAW,GAAG,mBAAmB;AAAA,UACjC,gBAAgB,OAAK,kBAAkB,GAAG,CAAC;AAAA,UAC3C,UAAU,MAAM;AAAA,UAChB,OAAO,aAAa,CAAC,KAAK,eAAe,MAAM,MAAM;AAAA,UACrD,SAAS,MAAM,UAAU,CAAC;AAAA,UAC1B,eAAe,MAAM;AAAA;AAAA,MACvB;AAAA,IAEJ,CAAC;AAED,WACE,gBAAAC,MAAC,UAAK,eAAa,MAAM,QAAQ,WAAW,mBAAmB,OAAO,OAAO,MAAM,OAChF;AAAA,cAAQ,CAAC;AAAA,MACT,MAAM;AAAA,MACN,QAAQ,CAAC;AAAA,OACZ;AAAA,EAEJ;AAEA,UAAQ,MAAM,MAAM;AAAA,IAClB,KAAK;AAAA,IACL,KAAK;AACH,aACE,gBAAAD;AAAA,QAAC;AAAA;AAAA,UACC,UAAQ;AAAA,UACP,GAAG;AAAA,UACJ,WAAW,GAAG,MAAM;AAAA;AAAA,MACtB;AAAA,IAGJ,KAAK;AACH,aACE,gBAAAA,KAAC,UAAK,WAAW,gCAAgC,MAAM,aACrD,0BAAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,OAAO,MAAM;AAAA,UACb,UAAU,MAAM;AAAA,UAChB,UAAU,OAAK,MAAM,eAAe,EAAE,OAAO,OAAO;AAAA,UACpD,SAAS,CAAC,CAAC,MAAM;AAAA;AAAA,MACnB,GACF;AAAA,IAGJ,KAAK;AACH,aAAO,gBAAAA,KAAC,eAAY,UAAQ,MAAE,GAAG,OAAO,WAAW,oBAAoB,MAAM,aAAa;AAAA,IAE5F,KAAK;AACH,aACE,gBAAAA,KAAC,UAAK,OAAO,MAAM,OAAO,WAAW,mBAAmB,OACrD,gBAAM,QAAQ,IAAI,OACjB,gBAAAC,MAAC,SAAiB,WAAU,gCAC1B;AAAA,wBAAAD;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,IAAI,EAAE;AAAA,YACN,OAAO,EAAE;AAAA,YACT,SAAS,MAAM,UAAU,EAAE;AAAA,YAC3B,UAAU,MAAM;AAAA,YAChB,UAAU,OAAK,MAAM,eAAe,EAAE,OAAO,KAAK;AAAA;AAAA,QACpD;AAAA,QACA,gBAAAA,KAAC,WAAM,WAAU,oBAAmB,SAAS,EAAE,MAC5C,YAAE,OACL;AAAA,WAZQ,EAAE,IAaZ,CACD,GACH;AAAA,EAEN;AAEA,SAAO,gBAAAA,KAAC,eAAY,UAAQ,MAAE,GAAG,OAAO;AAC1C;AAEA,qBAAqB,cAAc;;;AHrH5B,IAAM,2BAA8C;AAAA,EACzD,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,aAAa;AACf;AAEO,IAAM,6BAAkD;AAAA,EAC7D,UAAU;AAAA,EACV,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,WAAW;AAAA,EACX,UAAU;AAAA,EACV,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,OAAO;AAAA,EACP,aAAa;AACf;AAEO,IAAM,wBAAwB,yBAAyB;AAAA,EAC5D,KAAK;AAAA,EACL,mBAAmB;AAAA,EACnB,iBAAiB;AACnB,CAAC;","names":["jsx","jsx","jsxs"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{getCompatContextProvider as H}from"react-querybuilder";import{forwardRef as N}from"react";import{jsx as h}from"react/jsx-runtime";var d=N(({className:e,title:o},r)=>h("span",{ref:r,className:e,title:o,children:h("i",{className:"bi bi-grip-vertical"})}));d.displayName="BootstrapDragHandle";import{useId as k}from"react";import{jsx as y,jsxs as v}from"react/jsx-runtime";var u=({className:e,handleOnChange:o,title:r,label:c,checked:m,disabled:t})=>{let l=k();return v("div",{className:`form-check-inline form-switch ${e}`,children:[y("input",{id:l,className:"form-check-input",type:"checkbox",onChange:s=>o(s.target.checked),checked:!!m,disabled:t}),y("label",{title:r,htmlFor:l,className:"form-check-label",children:c})]})};u.displayName="BootstrapNotToggle";import{getFirstOption as p,standardClassnames as n,useValueEditor as C,ValueEditor as b,ValueSelector as x}from"react-querybuilder";import{jsx as a,jsxs as g}from"react/jsx-runtime";import{createElement as B}from"react";var f=e=>{let{valueAsArray:o,multiValueHandler:r}=C({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:c=x}=e;if(e.operator==="null"||e.operator==="notNull")return null;let m=e.fieldData?.placeholder??"";if((e.operator==="between"||e.operator==="notBetween")&&(e.type==="select"||e.type==="text")){let t=["from","to"].map((l,s)=>e.type==="text"?a("input",{type:e.inputType||"text",placeholder:m,value:o[s]??"",className:`${n.valueListItem} form-control form-control-sm`,disabled:e.disabled,onChange:i=>r(i.target.value,s)},l):B(c,{...e,key:l,className:`${n.valueListItem} form-select form-select-sm`,handleOnChange:i=>r(i,s),disabled:e.disabled,value:o[s]??p(e.values),options:e.values??[],listsAsArrays:e.listsAsArrays}));return g("span",{"data-testid":e.testID,className:n.value,title:e.title,children:[t[0],e.separator,t[1]]})}switch(e.type){case"select":case"multiselect":return a(b,{skipHook:!0,...e,className:`${e.className} form-select form-select-sm`});case"switch":return a("span",{className:`custom-control custom-switch ${e.className}`,children:a("input",{type:"checkbox",className:"form-check-input custom-control-input",title:e.title,disabled:e.disabled,onChange:t=>e.handleOnChange(t.target.checked),checked:!!e.value})});case"checkbox":return a(b,{skipHook:!0,...e,className:`form-check-input ${e.className}`});case"radio":return a("span",{title:e.title,className:n.value,children:e.values?.map(t=>g("div",{className:"form-check form-check-inline",children:[a("input",{className:"form-check-input",type:"radio",id:t.name,value:t.name,checked:e.value===t.name,disabled:e.disabled,onChange:l=>e.handleOnChange(l.target.value)}),a("label",{className:"form-check-label",htmlFor:t.name,children:t.label})]},t.name))})}return a(b,{skipHook:!0,...e})};f.displayName="BootstrapValueEditor";var E={dragHandle:d,notToggle:u,valueEditor:f},T={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"},M=H({key:"bootstrap",controlClassnames:T,controlElements:E});export{d as BootstrapDragHandle,u as BootstrapNotToggle,f as BootstrapValueEditor,M as QueryBuilderBootstrap,T as bootstrapControlClassnames,E as bootstrapControlElements};
|
|
2
|
+
//# sourceMappingURL=react-querybuilder_bootstrap.production.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/BootstrapDragHandle.tsx","../src/BootstrapNotToggle.tsx","../src/BootstrapValueEditor.tsx"],"sourcesContent":["import type { Classnames, Controls } from '@react-querybuilder/ts';\nimport { getCompatContextProvider } from 'react-querybuilder';\nimport { BootstrapDragHandle } from './BootstrapDragHandle';\nimport { BootstrapNotToggle } from './BootstrapNotToggle';\nimport { BootstrapValueEditor } from './BootstrapValueEditor';\nexport { BootstrapDragHandle, BootstrapNotToggle, 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 const QueryBuilderBootstrap = getCompatContextProvider({\n key: 'bootstrap',\n controlClassnames: bootstrapControlClassnames,\n controlElements: bootstrapControlElements,\n});\n","import type { DragHandleProps } from '@react-querybuilder/ts';\nimport { forwardRef } from 'react';\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 type { NotToggleProps } from '@react-querybuilder/ts';\nimport { useId } from 'react';\n\nexport const BootstrapNotToggle = ({\n className,\n handleOnChange,\n title,\n label,\n checked,\n disabled,\n}: NotToggleProps) => {\n const id = useId();\n\n return (\n <div className={`form-check-inline form-switch ${className}`}>\n <input\n id={id}\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} className=\"form-check-label\">\n {label}\n </label>\n </div>\n );\n};\n\nBootstrapNotToggle.displayName = 'BootstrapNotToggle';\n","import type { ValueEditorProps } from 'react-querybuilder';\nimport {\n getFirstOption,\n standardClassnames,\n useValueEditor,\n ValueEditor,\n ValueSelector,\n} from 'react-querybuilder';\n\nexport const BootstrapValueEditor = (props: ValueEditorProps) => {\n const { valueAsArray, multiValueHandler } = useValueEditor({\n handleOnChange: props.handleOnChange,\n inputType: props.inputType,\n operator: props.operator,\n value: props.value,\n type: props.type,\n listsAsArrays: props.listsAsArrays,\n parseNumbers: props.parseNumbers,\n values: props.values,\n });\n\n const { selectorComponent: SelectorComponent = ValueSelector } = props;\n\n if (props.operator === 'null' || props.operator === 'notNull') {\n return null;\n }\n\n const placeHolderText = props.fieldData?.placeholder ?? '';\n\n if (\n (props.operator === 'between' || props.operator === 'notBetween') &&\n (props.type === 'select' || props.type === 'text')\n ) {\n const editors = ['from', 'to'].map((key, i) => {\n if (props.type === 'text') {\n return (\n <input\n key={key}\n type={props.inputType || 'text'}\n placeholder={placeHolderText}\n value={valueAsArray[i] ?? ''}\n className={`${standardClassnames.valueListItem} form-control form-control-sm`}\n disabled={props.disabled}\n onChange={e => multiValueHandler(e.target.value, i)}\n />\n );\n }\n return (\n <SelectorComponent\n {...props}\n key={key}\n className={`${standardClassnames.valueListItem} form-select form-select-sm`}\n handleOnChange={v => multiValueHandler(v, i)}\n disabled={props.disabled}\n value={valueAsArray[i] ?? getFirstOption(props.values)}\n options={props.values ?? []}\n listsAsArrays={props.listsAsArrays}\n />\n );\n });\n\n return (\n <span data-testid={props.testID} className={standardClassnames.value} title={props.title}>\n {editors[0]}\n {props.separator}\n {editors[1]}\n </span>\n );\n }\n\n switch (props.type) {\n case 'select':\n case 'multiselect':\n return (\n <ValueEditor\n skipHook\n {...props}\n className={`${props.className} form-select form-select-sm`}\n />\n );\n\n case 'switch':\n return (\n <span className={`custom-control custom-switch ${props.className}`}>\n <input\n type=\"checkbox\"\n className=\"form-check-input custom-control-input\"\n title={props.title}\n disabled={props.disabled}\n onChange={e => props.handleOnChange(e.target.checked)}\n checked={!!props.value}\n />\n </span>\n );\n\n case 'checkbox':\n return <ValueEditor skipHook {...props} className={`form-check-input ${props.className}`} />;\n\n case 'radio':\n return (\n <span title={props.title} className={standardClassnames.value}>\n {props.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={props.value === v.name}\n disabled={props.disabled}\n onChange={e => props.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 <ValueEditor skipHook {...props} />;\n};\n\nBootstrapValueEditor.displayName = 'BootstrapValueEditor';\n"],"mappings":"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","names":["getCompatContextProvider","forwardRef","jsx","BootstrapDragHandle","className","title","dragRef","useId","jsx","jsxs","BootstrapNotToggle","className","handleOnChange","title","label","checked","disabled","id","e","getFirstOption","standardClassnames","useValueEditor","ValueEditor","ValueSelector","jsx","jsxs","createElement","BootstrapValueEditor","props","valueAsArray","multiValueHandler","SelectorComponent","placeHolderText","editors","key","i","e","v","bootstrapControlElements","BootstrapDragHandle","BootstrapNotToggle","BootstrapValueEditor","bootstrapControlClassnames","QueryBuilderBootstrap","getCompatContextProvider"]}
|
package/package.json
CHANGED
|
@@ -1,29 +1,23 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-querybuilder/bootstrap",
|
|
3
3
|
"description": "Custom Bootstrap components for react-querybuilder",
|
|
4
|
-
"version": "6.
|
|
4
|
+
"version": "6.2.0-alpha.0",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
7
7
|
},
|
|
8
|
-
"main": "dist/index.
|
|
9
|
-
"module": "dist/
|
|
8
|
+
"main": "./dist/cjs/index.js",
|
|
9
|
+
"module": "./dist/react-querybuilder_bootstrap.legacy-esm.js",
|
|
10
10
|
"exports": {
|
|
11
11
|
"./package.json": "./package.json",
|
|
12
12
|
".": {
|
|
13
|
-
"
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
},
|
|
17
|
-
"require": {
|
|
18
|
-
"types": "./dist/types/index.d.ts",
|
|
19
|
-
"default": "./dist/index.cjs"
|
|
20
|
-
}
|
|
13
|
+
"types": "./dist/react-querybuilder_bootstrap.d.ts",
|
|
14
|
+
"import": "./dist/react-querybuilder_bootstrap.mjs",
|
|
15
|
+
"require": "./dist/cjs/index.js"
|
|
21
16
|
}
|
|
22
17
|
},
|
|
23
|
-
"types": "dist/
|
|
18
|
+
"types": "./dist/react-querybuilder_bootstrap.d.ts",
|
|
24
19
|
"files": [
|
|
25
|
-
"dist"
|
|
26
|
-
"index.d.mts"
|
|
20
|
+
"dist"
|
|
27
21
|
],
|
|
28
22
|
"repository": {
|
|
29
23
|
"type": "git",
|
|
@@ -34,29 +28,29 @@
|
|
|
34
28
|
"homepage": "https://react-querybuilder.js.org/",
|
|
35
29
|
"scripts": {
|
|
36
30
|
"start": "vite",
|
|
37
|
-
"build": "
|
|
31
|
+
"build": "tsup",
|
|
38
32
|
"typecheck": "tsc --noEmit",
|
|
39
|
-
"typecheck:watch": "
|
|
33
|
+
"typecheck:watch": "tsc --noEmit --watch"
|
|
40
34
|
},
|
|
41
35
|
"devDependencies": {
|
|
42
|
-
"@popperjs/core": "^2.11.
|
|
43
|
-
"@react-querybuilder/ts": "^6.
|
|
44
|
-
"@testing-library/react": "^
|
|
45
|
-
"@types/react": "^18.0.
|
|
46
|
-
"@vitejs/plugin-react-swc": "^3.
|
|
36
|
+
"@popperjs/core": "^2.11.7",
|
|
37
|
+
"@react-querybuilder/ts": "^6.2.0-alpha.0",
|
|
38
|
+
"@testing-library/react": "^14.0.0",
|
|
39
|
+
"@types/react": "^18.0.37",
|
|
40
|
+
"@vitejs/plugin-react-swc": "^3.3.0",
|
|
47
41
|
"bootstrap": "^5.2.3",
|
|
48
|
-
"bootstrap-icons": "^1.10.
|
|
42
|
+
"bootstrap-icons": "^1.10.4",
|
|
49
43
|
"react": "^18.2.0",
|
|
50
44
|
"react-dom": "^18.2.0",
|
|
51
|
-
"react-querybuilder": "^6.
|
|
45
|
+
"react-querybuilder": "^6.2.0-alpha.0",
|
|
52
46
|
"rollup-plugin-visualizer": "^5.9.0",
|
|
53
47
|
"typescript": "^4.9.5",
|
|
54
|
-
"vite": "^4.1
|
|
48
|
+
"vite": "^4.3.1"
|
|
55
49
|
},
|
|
56
50
|
"peerDependencies": {
|
|
57
51
|
"bootstrap": ">=5",
|
|
58
52
|
"bootstrap-icons": ">=1.7.0",
|
|
59
53
|
"react": ">=16.8.0"
|
|
60
54
|
},
|
|
61
|
-
"gitHead": "
|
|
55
|
+
"gitHead": "03c4550c7f8ee0320b38b0e7444330f8306e74ac"
|
|
62
56
|
}
|
package/dist/index.cjs
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react-querybuilder"),t=require("react/jsx-runtime"),h=require("react"),d=h.forwardRef(({className:e,title:n},o)=>t.jsx("span",{ref:o,className:e,title:n,children:t.jsx("i",{className:"bi bi-grip-vertical"})}));d.displayName="BootstrapDragHandle";const u=({className:e,handleOnChange:n,title:o,label:c,checked:m,disabled:a})=>{const l=h.useId();return t.jsxs("div",{className:`form-check-inline form-switch ${e}`,children:[t.jsx("input",{id:l,className:"form-check-input",type:"checkbox",onChange:r=>n(r.target.checked),checked:!!m,disabled:a}),t.jsx("label",{title:o,htmlFor:l,className:"form-check-label",children:c})]})};u.displayName="BootstrapNotToggle";const b=e=>{const{valueAsArray:n,multiValueHandler:o}=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:c=s.ValueSelector}=e;if(e.operator==="null"||e.operator==="notNull")return null;const m=e.fieldData?.placeholder??"";if((e.operator==="between"||e.operator==="notBetween")&&(e.type==="select"||e.type==="text")){const a=["from","to"].map((l,r)=>e.type==="text"?t.jsx("input",{type:e.inputType||"text",placeholder:m,value:n[r]??"",className:`${s.standardClassnames.valueListItem} form-control form-control-sm`,disabled:e.disabled,onChange:i=>o(i.target.value,r)},l):t.jsx(c,{...e,className:`${s.standardClassnames.valueListItem} form-select form-select-sm`,handleOnChange:i=>o(i,r),disabled:e.disabled,value:n[r]??s.getFirstOption(e.values),options:e.values??[],listsAsArrays:e.listsAsArrays},l));return t.jsxs("span",{"data-testid":e.testID,className:s.standardClassnames.value,title:e.title,children:[a[0],e.separator,a[1]]})}switch(e.type){case"select":case"multiselect":return t.jsx(s.ValueEditor,{skipHook:!0,...e,className:`${e.className} form-select form-select-sm`});case"switch":return t.jsx("span",{className:`custom-control custom-switch ${e.className}`,children:t.jsx("input",{type:"checkbox",className:"form-check-input custom-control-input",title:e.title,disabled:e.disabled,onChange:a=>e.handleOnChange(a.target.checked),checked:!!e.value})});case"checkbox":return t.jsx(s.ValueEditor,{skipHook:!0,...e,className:`form-check-input ${e.className}`});case"radio":return t.jsx("span",{title:e.title,className:s.standardClassnames.value,children:e.values?.map(a=>t.jsxs("div",{className:"form-check form-check-inline",children:[t.jsx("input",{className:"form-check-input",type:"radio",id:a.name,value:a.name,checked:e.value===a.name,disabled:e.disabled,onChange:l=>e.handleOnChange(l.target.value)}),t.jsx("label",{className:"form-check-label",htmlFor:a.name,children:a.label})]},a.name))})}return t.jsx(s.ValueEditor,{skipHook:!0,...e})};b.displayName="BootstrapValueEditor";const f={dragHandle:d,notToggle:u,valueEditor:b},g={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"},y=s.getCompatContextProvider({key:"bootstrap",controlClassnames:g,controlElements:f});exports.BootstrapDragHandle=d;exports.BootstrapNotToggle=u;exports.BootstrapValueEditor=b;exports.QueryBuilderBootstrap=y;exports.bootstrapControlClassnames=g;exports.bootstrapControlElements=f;
|
|
2
|
-
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../src/BootstrapDragHandle.tsx","../src/BootstrapNotToggle.tsx","../src/BootstrapValueEditor.tsx","../src/index.ts"],"sourcesContent":["import type { DragHandleProps } from '@react-querybuilder/ts';\nimport { forwardRef } from 'react';\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 type { NotToggleProps } from '@react-querybuilder/ts';\nimport { useId } from 'react';\n\nexport const BootstrapNotToggle = ({\n className,\n handleOnChange,\n title,\n label,\n checked,\n disabled,\n}: NotToggleProps) => {\n const id = useId();\n\n return (\n <div className={`form-check-inline form-switch ${className}`}>\n <input\n id={id}\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} className=\"form-check-label\">\n {label}\n </label>\n </div>\n );\n};\n\nBootstrapNotToggle.displayName = 'BootstrapNotToggle';\n","import type { ValueEditorProps } from 'react-querybuilder';\nimport {\n getFirstOption,\n standardClassnames,\n useValueEditor,\n ValueEditor,\n ValueSelector,\n} from 'react-querybuilder';\n\nexport const BootstrapValueEditor = (props: ValueEditorProps) => {\n const { valueAsArray, multiValueHandler } = useValueEditor({\n handleOnChange: props.handleOnChange,\n inputType: props.inputType,\n operator: props.operator,\n value: props.value,\n type: props.type,\n listsAsArrays: props.listsAsArrays,\n parseNumbers: props.parseNumbers,\n values: props.values,\n });\n\n const { selectorComponent: SelectorComponent = ValueSelector } = props;\n\n if (props.operator === 'null' || props.operator === 'notNull') {\n return null;\n }\n\n const placeHolderText = props.fieldData?.placeholder ?? '';\n\n if (\n (props.operator === 'between' || props.operator === 'notBetween') &&\n (props.type === 'select' || props.type === 'text')\n ) {\n const editors = ['from', 'to'].map((key, i) => {\n if (props.type === 'text') {\n return (\n <input\n key={key}\n type={props.inputType || 'text'}\n placeholder={placeHolderText}\n value={valueAsArray[i] ?? ''}\n className={`${standardClassnames.valueListItem} form-control form-control-sm`}\n disabled={props.disabled}\n onChange={e => multiValueHandler(e.target.value, i)}\n />\n );\n }\n return (\n <SelectorComponent\n key={key}\n {...props}\n className={`${standardClassnames.valueListItem} form-select form-select-sm`}\n handleOnChange={v => multiValueHandler(v, i)}\n disabled={props.disabled}\n value={valueAsArray[i] ?? getFirstOption(props.values)}\n options={props.values ?? []}\n listsAsArrays={props.listsAsArrays}\n />\n );\n });\n\n return (\n <span data-testid={props.testID} className={standardClassnames.value} title={props.title}>\n {editors[0]}\n {props.separator}\n {editors[1]}\n </span>\n );\n }\n\n switch (props.type) {\n case 'select':\n case 'multiselect':\n return (\n <ValueEditor\n skipHook\n {...props}\n className={`${props.className} form-select form-select-sm`}\n />\n );\n\n case 'switch':\n return (\n <span className={`custom-control custom-switch ${props.className}`}>\n <input\n type=\"checkbox\"\n className=\"form-check-input custom-control-input\"\n title={props.title}\n disabled={props.disabled}\n onChange={e => props.handleOnChange(e.target.checked)}\n checked={!!props.value}\n />\n </span>\n );\n\n case 'checkbox':\n return <ValueEditor skipHook {...props} className={`form-check-input ${props.className}`} />;\n\n case 'radio':\n return (\n <span title={props.title} className={standardClassnames.value}>\n {props.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={props.value === v.name}\n disabled={props.disabled}\n onChange={e => props.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 <ValueEditor skipHook {...props} />;\n};\n\nBootstrapValueEditor.displayName = 'BootstrapValueEditor';\n","import type { Classnames, Controls } from '@react-querybuilder/ts';\nimport { getCompatContextProvider } from 'react-querybuilder';\nimport { BootstrapDragHandle } from './BootstrapDragHandle';\nimport { BootstrapNotToggle } from './BootstrapNotToggle';\nimport { BootstrapValueEditor } from './BootstrapValueEditor';\nexport { BootstrapDragHandle, BootstrapNotToggle, 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 const QueryBuilderBootstrap = getCompatContextProvider({\n key: 'bootstrap',\n controlClassnames: bootstrapControlClassnames,\n controlElements: bootstrapControlElements,\n});\n"],"names":["BootstrapDragHandle","forwardRef","className","title","dragRef","jsx","BootstrapNotToggle","handleOnChange","label","checked","disabled","id","useId","jsxs","e","BootstrapValueEditor","props","valueAsArray","multiValueHandler","useValueEditor","SelectorComponent","ValueSelector","placeHolderText","editors","key","i","standardClassnames","v","getFirstOption","ValueEditor","bootstrapControlElements","bootstrapControlClassnames","QueryBuilderBootstrap","getCompatContextProvider"],"mappings":"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"}
|
package/dist/index.mjs
DELETED
|
@@ -1,154 +0,0 @@
|
|
|
1
|
-
import { useValueEditor as y, standardClassnames as r, getFirstOption as g, ValueEditor as d, ValueSelector as N, getCompatContextProvider as k } from "react-querybuilder";
|
|
2
|
-
import { jsx as t, jsxs as u } from "react/jsx-runtime";
|
|
3
|
-
import { forwardRef as v, useId as C } from "react";
|
|
4
|
-
const b = v(
|
|
5
|
-
({ className: e, title: n }, s) => /* @__PURE__ */ t("span", { ref: s, className: e, title: n, children: /* @__PURE__ */ t("i", { className: "bi bi-grip-vertical" }) })
|
|
6
|
-
);
|
|
7
|
-
b.displayName = "BootstrapDragHandle";
|
|
8
|
-
const h = ({
|
|
9
|
-
className: e,
|
|
10
|
-
handleOnChange: n,
|
|
11
|
-
title: s,
|
|
12
|
-
label: c,
|
|
13
|
-
checked: m,
|
|
14
|
-
disabled: a
|
|
15
|
-
}) => {
|
|
16
|
-
const l = C();
|
|
17
|
-
return /* @__PURE__ */ u("div", { className: `form-check-inline form-switch ${e}`, children: [
|
|
18
|
-
/* @__PURE__ */ t(
|
|
19
|
-
"input",
|
|
20
|
-
{
|
|
21
|
-
id: l,
|
|
22
|
-
className: "form-check-input",
|
|
23
|
-
type: "checkbox",
|
|
24
|
-
onChange: (o) => n(o.target.checked),
|
|
25
|
-
checked: !!m,
|
|
26
|
-
disabled: a
|
|
27
|
-
}
|
|
28
|
-
),
|
|
29
|
-
/* @__PURE__ */ t("label", { title: s, htmlFor: l, className: "form-check-label", children: c })
|
|
30
|
-
] });
|
|
31
|
-
};
|
|
32
|
-
h.displayName = "BootstrapNotToggle";
|
|
33
|
-
const f = (e) => {
|
|
34
|
-
const { valueAsArray: n, multiValueHandler: s } = y({
|
|
35
|
-
handleOnChange: e.handleOnChange,
|
|
36
|
-
inputType: e.inputType,
|
|
37
|
-
operator: e.operator,
|
|
38
|
-
value: e.value,
|
|
39
|
-
type: e.type,
|
|
40
|
-
listsAsArrays: e.listsAsArrays,
|
|
41
|
-
parseNumbers: e.parseNumbers,
|
|
42
|
-
values: e.values
|
|
43
|
-
}), { selectorComponent: c = N } = e;
|
|
44
|
-
if (e.operator === "null" || e.operator === "notNull")
|
|
45
|
-
return null;
|
|
46
|
-
const m = e.fieldData?.placeholder ?? "";
|
|
47
|
-
if ((e.operator === "between" || e.operator === "notBetween") && (e.type === "select" || e.type === "text")) {
|
|
48
|
-
const a = ["from", "to"].map((l, o) => e.type === "text" ? /* @__PURE__ */ t(
|
|
49
|
-
"input",
|
|
50
|
-
{
|
|
51
|
-
type: e.inputType || "text",
|
|
52
|
-
placeholder: m,
|
|
53
|
-
value: n[o] ?? "",
|
|
54
|
-
className: `${r.valueListItem} form-control form-control-sm`,
|
|
55
|
-
disabled: e.disabled,
|
|
56
|
-
onChange: (i) => s(i.target.value, o)
|
|
57
|
-
},
|
|
58
|
-
l
|
|
59
|
-
) : /* @__PURE__ */ t(
|
|
60
|
-
c,
|
|
61
|
-
{
|
|
62
|
-
...e,
|
|
63
|
-
className: `${r.valueListItem} form-select form-select-sm`,
|
|
64
|
-
handleOnChange: (i) => s(i, o),
|
|
65
|
-
disabled: e.disabled,
|
|
66
|
-
value: n[o] ?? g(e.values),
|
|
67
|
-
options: e.values ?? [],
|
|
68
|
-
listsAsArrays: e.listsAsArrays
|
|
69
|
-
},
|
|
70
|
-
l
|
|
71
|
-
));
|
|
72
|
-
return /* @__PURE__ */ u("span", { "data-testid": e.testID, className: r.value, title: e.title, children: [
|
|
73
|
-
a[0],
|
|
74
|
-
e.separator,
|
|
75
|
-
a[1]
|
|
76
|
-
] });
|
|
77
|
-
}
|
|
78
|
-
switch (e.type) {
|
|
79
|
-
case "select":
|
|
80
|
-
case "multiselect":
|
|
81
|
-
return /* @__PURE__ */ t(
|
|
82
|
-
d,
|
|
83
|
-
{
|
|
84
|
-
skipHook: !0,
|
|
85
|
-
...e,
|
|
86
|
-
className: `${e.className} form-select form-select-sm`
|
|
87
|
-
}
|
|
88
|
-
);
|
|
89
|
-
case "switch":
|
|
90
|
-
return /* @__PURE__ */ t("span", { className: `custom-control custom-switch ${e.className}`, children: /* @__PURE__ */ t(
|
|
91
|
-
"input",
|
|
92
|
-
{
|
|
93
|
-
type: "checkbox",
|
|
94
|
-
className: "form-check-input custom-control-input",
|
|
95
|
-
title: e.title,
|
|
96
|
-
disabled: e.disabled,
|
|
97
|
-
onChange: (a) => e.handleOnChange(a.target.checked),
|
|
98
|
-
checked: !!e.value
|
|
99
|
-
}
|
|
100
|
-
) });
|
|
101
|
-
case "checkbox":
|
|
102
|
-
return /* @__PURE__ */ t(d, { skipHook: !0, ...e, className: `form-check-input ${e.className}` });
|
|
103
|
-
case "radio":
|
|
104
|
-
return /* @__PURE__ */ t("span", { title: e.title, className: r.value, children: e.values?.map((a) => /* @__PURE__ */ u("div", { className: "form-check form-check-inline", children: [
|
|
105
|
-
/* @__PURE__ */ t(
|
|
106
|
-
"input",
|
|
107
|
-
{
|
|
108
|
-
className: "form-check-input",
|
|
109
|
-
type: "radio",
|
|
110
|
-
id: a.name,
|
|
111
|
-
value: a.name,
|
|
112
|
-
checked: e.value === a.name,
|
|
113
|
-
disabled: e.disabled,
|
|
114
|
-
onChange: (l) => e.handleOnChange(l.target.value)
|
|
115
|
-
}
|
|
116
|
-
),
|
|
117
|
-
/* @__PURE__ */ t("label", { className: "form-check-label", htmlFor: a.name, children: a.label })
|
|
118
|
-
] }, a.name)) });
|
|
119
|
-
}
|
|
120
|
-
return /* @__PURE__ */ t(d, { skipHook: !0, ...e });
|
|
121
|
-
};
|
|
122
|
-
f.displayName = "BootstrapValueEditor";
|
|
123
|
-
const x = {
|
|
124
|
-
dragHandle: b,
|
|
125
|
-
notToggle: h,
|
|
126
|
-
valueEditor: f
|
|
127
|
-
}, A = {
|
|
128
|
-
addGroup: "btn btn-secondary btn-sm",
|
|
129
|
-
addRule: "btn btn-primary btn-sm",
|
|
130
|
-
cloneGroup: "btn btn-secondary btn-sm",
|
|
131
|
-
cloneRule: "btn btn-secondary btn-sm",
|
|
132
|
-
lockGroup: "btn btn-secondary btn-sm",
|
|
133
|
-
lockRule: "btn btn-secondary btn-sm",
|
|
134
|
-
removeGroup: "btn btn-danger btn-sm",
|
|
135
|
-
removeRule: "btn btn-danger btn-sm",
|
|
136
|
-
combinators: "form-select form-select-sm",
|
|
137
|
-
fields: "form-select form-select-sm",
|
|
138
|
-
operators: "form-select form-select-sm",
|
|
139
|
-
value: "form-control form-control-sm",
|
|
140
|
-
valueSource: "form-select form-select-sm"
|
|
141
|
-
}, E = k({
|
|
142
|
-
key: "bootstrap",
|
|
143
|
-
controlClassnames: A,
|
|
144
|
-
controlElements: x
|
|
145
|
-
});
|
|
146
|
-
export {
|
|
147
|
-
b as BootstrapDragHandle,
|
|
148
|
-
h as BootstrapNotToggle,
|
|
149
|
-
f as BootstrapValueEditor,
|
|
150
|
-
E as QueryBuilderBootstrap,
|
|
151
|
-
A as bootstrapControlClassnames,
|
|
152
|
-
x as bootstrapControlElements
|
|
153
|
-
};
|
|
154
|
-
//# sourceMappingURL=index.mjs.map
|
package/dist/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../src/BootstrapDragHandle.tsx","../src/BootstrapNotToggle.tsx","../src/BootstrapValueEditor.tsx","../src/index.ts"],"sourcesContent":["import type { DragHandleProps } from '@react-querybuilder/ts';\nimport { forwardRef } from 'react';\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 type { NotToggleProps } from '@react-querybuilder/ts';\nimport { useId } from 'react';\n\nexport const BootstrapNotToggle = ({\n className,\n handleOnChange,\n title,\n label,\n checked,\n disabled,\n}: NotToggleProps) => {\n const id = useId();\n\n return (\n <div className={`form-check-inline form-switch ${className}`}>\n <input\n id={id}\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} className=\"form-check-label\">\n {label}\n </label>\n </div>\n );\n};\n\nBootstrapNotToggle.displayName = 'BootstrapNotToggle';\n","import type { ValueEditorProps } from 'react-querybuilder';\nimport {\n getFirstOption,\n standardClassnames,\n useValueEditor,\n ValueEditor,\n ValueSelector,\n} from 'react-querybuilder';\n\nexport const BootstrapValueEditor = (props: ValueEditorProps) => {\n const { valueAsArray, multiValueHandler } = useValueEditor({\n handleOnChange: props.handleOnChange,\n inputType: props.inputType,\n operator: props.operator,\n value: props.value,\n type: props.type,\n listsAsArrays: props.listsAsArrays,\n parseNumbers: props.parseNumbers,\n values: props.values,\n });\n\n const { selectorComponent: SelectorComponent = ValueSelector } = props;\n\n if (props.operator === 'null' || props.operator === 'notNull') {\n return null;\n }\n\n const placeHolderText = props.fieldData?.placeholder ?? '';\n\n if (\n (props.operator === 'between' || props.operator === 'notBetween') &&\n (props.type === 'select' || props.type === 'text')\n ) {\n const editors = ['from', 'to'].map((key, i) => {\n if (props.type === 'text') {\n return (\n <input\n key={key}\n type={props.inputType || 'text'}\n placeholder={placeHolderText}\n value={valueAsArray[i] ?? ''}\n className={`${standardClassnames.valueListItem} form-control form-control-sm`}\n disabled={props.disabled}\n onChange={e => multiValueHandler(e.target.value, i)}\n />\n );\n }\n return (\n <SelectorComponent\n key={key}\n {...props}\n className={`${standardClassnames.valueListItem} form-select form-select-sm`}\n handleOnChange={v => multiValueHandler(v, i)}\n disabled={props.disabled}\n value={valueAsArray[i] ?? getFirstOption(props.values)}\n options={props.values ?? []}\n listsAsArrays={props.listsAsArrays}\n />\n );\n });\n\n return (\n <span data-testid={props.testID} className={standardClassnames.value} title={props.title}>\n {editors[0]}\n {props.separator}\n {editors[1]}\n </span>\n );\n }\n\n switch (props.type) {\n case 'select':\n case 'multiselect':\n return (\n <ValueEditor\n skipHook\n {...props}\n className={`${props.className} form-select form-select-sm`}\n />\n );\n\n case 'switch':\n return (\n <span className={`custom-control custom-switch ${props.className}`}>\n <input\n type=\"checkbox\"\n className=\"form-check-input custom-control-input\"\n title={props.title}\n disabled={props.disabled}\n onChange={e => props.handleOnChange(e.target.checked)}\n checked={!!props.value}\n />\n </span>\n );\n\n case 'checkbox':\n return <ValueEditor skipHook {...props} className={`form-check-input ${props.className}`} />;\n\n case 'radio':\n return (\n <span title={props.title} className={standardClassnames.value}>\n {props.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={props.value === v.name}\n disabled={props.disabled}\n onChange={e => props.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 <ValueEditor skipHook {...props} />;\n};\n\nBootstrapValueEditor.displayName = 'BootstrapValueEditor';\n","import type { Classnames, Controls } from '@react-querybuilder/ts';\nimport { getCompatContextProvider } from 'react-querybuilder';\nimport { BootstrapDragHandle } from './BootstrapDragHandle';\nimport { BootstrapNotToggle } from './BootstrapNotToggle';\nimport { BootstrapValueEditor } from './BootstrapValueEditor';\nexport { BootstrapDragHandle, BootstrapNotToggle, 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 const QueryBuilderBootstrap = getCompatContextProvider({\n key: 'bootstrap',\n controlClassnames: bootstrapControlClassnames,\n controlElements: bootstrapControlElements,\n});\n"],"names":["BootstrapDragHandle","forwardRef","className","title","dragRef","jsx","BootstrapNotToggle","handleOnChange","label","checked","disabled","id","useId","jsxs","e","BootstrapValueEditor","props","valueAsArray","multiValueHandler","useValueEditor","SelectorComponent","ValueSelector","placeHolderText","editors","key","i","standardClassnames","v","getFirstOption","ValueEditor","bootstrapControlElements","bootstrapControlClassnames","QueryBuilderBootstrap","getCompatContextProvider"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Bootstrap.test.d.ts","sourceRoot":"","sources":["../../src/Bootstrap.test.tsx"],"names":[],"mappings":"AAQA,OAAO,CAAC,MAAM,CAAC;IAEb,IAAI,WAAW,EAAE,OAAO,CAAC;CAC1B"}
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import type { DragHandleProps } from '@react-querybuilder/ts';
|
|
3
|
-
export declare const BootstrapDragHandle: import("react").ForwardRefExoticComponent<DragHandleProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
4
|
-
//# sourceMappingURL=BootstrapDragHandle.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"BootstrapDragHandle.d.ts","sourceRoot":"","sources":["../../src/BootstrapDragHandle.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAG9D,eAAO,MAAM,mBAAmB,6GAM/B,CAAC"}
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import type { NotToggleProps } from '@react-querybuilder/ts';
|
|
2
|
-
export declare const BootstrapNotToggle: {
|
|
3
|
-
({ className, handleOnChange, title, label, checked, disabled, }: NotToggleProps): JSX.Element;
|
|
4
|
-
displayName: string;
|
|
5
|
-
};
|
|
6
|
-
//# sourceMappingURL=BootstrapNotToggle.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"BootstrapNotToggle.d.ts","sourceRoot":"","sources":["../../src/BootstrapNotToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAG7D,eAAO,MAAM,kBAAkB;sEAO5B,cAAc;;CAkBhB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"BootstrapValueEditor.d.ts","sourceRoot":"","sources":["../../src/BootstrapValueEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAS3D,eAAO,MAAM,oBAAoB;YAAW,gBAAgB;;CAiH3D,CAAC"}
|
package/dist/types/index.d.ts
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import type { Classnames, Controls } from '@react-querybuilder/ts';
|
|
2
|
-
import { BootstrapDragHandle } from './BootstrapDragHandle';
|
|
3
|
-
import { BootstrapNotToggle } from './BootstrapNotToggle';
|
|
4
|
-
import { BootstrapValueEditor } from './BootstrapValueEditor';
|
|
5
|
-
export { BootstrapDragHandle, BootstrapNotToggle, BootstrapValueEditor };
|
|
6
|
-
export declare const bootstrapControlElements: Partial<Controls>;
|
|
7
|
-
export declare const bootstrapControlClassnames: Partial<Classnames>;
|
|
8
|
-
export declare const QueryBuilderBootstrap: import("react-querybuilder").QueryBuilderContextProvider<Record<string, any>>;
|
|
9
|
-
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAEnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,CAAC;AAEzE,eAAO,MAAM,wBAAwB,EAAE,OAAO,CAAC,QAAQ,CAItD,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,OAAO,CAAC,UAAU,CAc1D,CAAC;AAEF,eAAO,MAAM,qBAAqB,+EAIhC,CAAC"}
|
package/index.d.mts
DELETED