@oneb/ui-vue 0.3.31 → 0.4.0

package/dist/fileUpload/index.js

@@ -0,0 +1,228 @@
+import { u as ae } from "../useFileUpload-228dbc07.js";
+import { openBlock as r, createElementBlock as p, createElementVNode as c, defineComponent as C, computed as k, normalizeClass as D, createBlock as B, unref as w, toDisplayString as f, ref as S, renderSlot as $, createVNode as L, createTextVNode as N, createCommentVNode as j } from "vue";
+import { OneSpinner as A } from "../spinner/index.js";
+import { useOnebI18n as M } from "../i18n/index.js";
+import { OneButton as V } from "../button/index.js";
+import "../SpinnerIcon-516264ba.js";
+import "../_plugin-vue_export-helper-dad06003.js";
+function E(e, n) {
+  return r(), p("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    "stroke-width": "1.8",
+    stroke: "currentColor",
+    "aria-hidden": "true"
+  }, [
+    c("path", {
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      d: "M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5"
+    })
+  ]);
+}
+const T = (e, n) => n ? n.split(",").map((t) => t.trim().toLowerCase()).some((t) => t ? t.startsWith(".") ? e.name.toLowerCase().endsWith(t) : t.endsWith("/*") ? e.type.toLowerCase().startsWith(t.slice(0, -1)) : e.type.toLowerCase() === t : !1) : !0, F = (e, n) => {
+  const t = [], o = [], m = n.multiple ? e : e.slice(0, 1);
+  for (const l of m) {
+    if (!T(l, n.accept)) {
+      o.push({ code: "type", file: l });
+      continue;
+    }
+    if (n.maxSizeMb != null && l.size > n.maxSizeMb * 1024 * 1024) {
+      o.push({ code: "size", file: l });
+      continue;
+    }
+    t.push(l);
+  }
+  return { accepted: t, errors: o };
+}, W = {
+  key: 2,
+  class: "text-[#525B66] font-medium"
+}, U = {
+  key: 3,
+  class: "text-[#525B66]"
+}, R = ["accept", "multiple", "disabled"], _ = /* @__PURE__ */ C({
+  __name: "OneFileUpload",
+  props: {
+    label: {
+      type: String,
+      default: ""
+    },
+    accept: {
+      type: String,
+      default: void 0
+    },
+    multiple: {
+      type: Boolean,
+      default: !1
+    },
+    maxSizeMb: {
+      type: Number,
+      default: void 0
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    loading: {
+      type: Boolean,
+      default: !1
+    },
+    t: {
+      type: Function,
+      default: void 0
+    }
+  },
+  emits: ["files", "error"],
+  setup(e, { emit: n }) {
+    const t = e, o = n, m = M(), l = k(() => t.t ?? m), s = (d) => {
+      const u = d.target, b = Array.from(u.files ?? []);
+      if (u.value = "", b.length === 0)
+        return;
+      const { accepted: h, errors: v } = F(b, {
+        accept: t.accept,
+        maxSizeMb: t.maxSizeMb,
+        multiple: t.multiple
+      });
+      v.forEach((y) => o("error", y)), h.length > 0 && o("files", h);
+    };
+    return (d, u) => (r(), p("label", {
+      class: D(["hover:text-blue-500 cursor-pointer text-sm w-full h-full flex items-center border hover:bg-gray-50 px-3 py-2 rounded-md gap-3", { "opacity-60 cursor-not-allowed pointer-events-none": e.disabled }])
+    }, [
+      e.loading ? (r(), B(w(A), {
+        key: 0,
+        size: "sm"
+      })) : (r(), B(w(E), {
+        key: 1,
+        class: "w-4 h-4 text-[#525B66]"
+      })),
+      e.loading ? (r(), p("span", U, f(l.value("ui.file_upload.uploading")) + "...", 1)) : (r(), p("span", W, f(e.label || l.value("ui.file_upload.select")), 1)),
+      c("input", {
+        class: "hidden",
+        type: "file",
+        accept: e.accept,
+        multiple: e.multiple,
+        disabled: e.disabled,
+        onChange: s
+      }, null, 40, R)
+    ], 2));
+  }
+}), I = ["accept", "multiple", "disabled"], P = { class: "text-base font-medium text-gray-900" }, q = { class: "text-xs text-gray-500" }, G = {
+  key: 0,
+  class: "mt-4 text-sm text-gray-700"
+}, H = { class: "font-semibold" }, ee = /* @__PURE__ */ C({
+  __name: "OneDropzone",
+  props: {
+    accept: {
+      type: String,
+      default: void 0
+    },
+    multiple: {
+      type: Boolean,
+      default: !1
+    },
+    maxSizeMb: {
+      type: Number,
+      default: void 0
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    hint: {
+      type: String,
+      default: ""
+    },
+    help: {
+      type: String,
+      default: ""
+    },
+    buttonLabel: {
+      type: String,
+      default: ""
+    },
+    t: {
+      type: Function,
+      default: void 0
+    }
+  },
+  emits: ["files", "error"],
+  setup(e, { emit: n }) {
+    const t = e, o = n, m = M(), l = k(() => t.t ?? m), s = S(!1), d = S([]), u = S(null), b = (a) => {
+      const i = Array.from(a ?? []);
+      if (i.length === 0)
+        return;
+      const { accepted: g, errors: O } = F(i, {
+        accept: t.accept,
+        maxSizeMb: t.maxSizeMb,
+        multiple: t.multiple
+      });
+      O.forEach((z) => o("error", z)), g.length > 0 && (d.value = g.map((z) => z.name), o("files", g));
+    }, h = (a) => {
+      var i;
+      a.preventDefault(), s.value = !1, !t.disabled && b(((i = a.dataTransfer) == null ? void 0 : i.files) ?? null);
+    }, v = (a) => {
+      a.preventDefault(), !t.disabled && (s.value = !0);
+    }, y = (a) => {
+      if (t.disabled)
+        return;
+      const i = a.target;
+      b(i.files), i.value = "";
+    }, x = () => {
+      var a;
+      t.disabled || (a = u.value) == null || a.click();
+    };
+    return (a, i) => (r(), p("div", {
+      class: D(["border-2 border-dashed rounded-xl bg-white p-6 flex flex-col items-center justify-center text-center transition-colors", {
+        "border-blue-500 bg-blue-50": s.value && !e.disabled,
+        "border-gray-300": !s.value || e.disabled,
+        "opacity-60 cursor-not-allowed": e.disabled
+      }]),
+      "data-test": "dropzone",
+      onDrop: h,
+      onDragover: v,
+      onDragleave: i[0] || (i[0] = (g) => s.value = !1)
+    }, [
+      c("input", {
+        ref_key: "inputRef",
+        ref: u,
+        type: "file",
+        accept: e.accept,
+        multiple: e.multiple,
+        class: "hidden",
+        disabled: e.disabled,
+        onChange: y
+      }, null, 40, I),
+      $(a.$slots, "default", {
+        isDragging: s.value,
+        openPicker: x
+      }, () => [
+        c("div", {
+          class: "cursor-pointer flex flex-col items-center gap-2",
+          onClick: x
+        }, [
+          c("span", P, f(e.hint || l.value("ui.dropzone.hint")), 1),
+          c("span", q, f(e.help || l.value("ui.dropzone.help")), 1)
+        ]),
+        L(w(V), {
+          type: "button",
+          variant: "primary",
+          class: "mt-3",
+          label: e.buttonLabel || l.value("ui.dropzone.choose"),
+          disabled: e.disabled,
+          onClick: x
+        }, null, 8, ["label", "disabled"]),
+        d.value.length ? (r(), p("div", G, [
+          N(f(l.value("ui.dropzone.selected")) + ": ", 1),
+          c("span", H, f(d.value.join(", ")), 1)
+        ])) : j("", !0)
+      ])
+    ], 34));
+  }
+});
+export {
+  ee as OneDropzone,
+  _ as OneFileUpload,
+  ae as useFileUpload,
+  F as validateFiles
+};

package/dist/filterBuilder/OneFilterBuilder.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/dist/filterBuilder/OneFilterGroup.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/dist/filterBuilder/OneFilterRule.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/dist/filterBuilder/filterBuilder.d.ts

@@ -0,0 +1,17 @@
+export type FilterFieldType = 'string' | 'int' | 'bool';
+export interface FilterFieldConfig {
+    field: string;
+    label: string;
+    type: FilterFieldType;
+}
+export interface FilterRuleNode {
+    field: string;
+    operator: string;
+    value: string | number;
+}
+export interface FilterGroupNode {
+    operator: 'and' | 'or';
+    conditions: (FilterRuleNode | FilterGroupNode)[];
+}
+export declare const isFilterGroup: (node: FilterRuleNode | FilterGroupNode | undefined | null) => node is FilterGroupNode;
+export declare const operatorsForType: (type: FilterFieldType | undefined) => string[];

package/dist/filterBuilder/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),k=require("../i18n/index.cjs"),f=t=>t!=null&&t.conditions!==void 0,B=t=>t==="bool"?["1","0"]:t==="int"?["=","!=","<",">","<=",">="]:t==="string"?["=","!=","*","!*"]:[],E={class:"flex gap-2 items-center hover:bg-gray-100 py-1 px-1 rounded-md","data-test":"filter-rule"},C=["disabled"],x={disabled:"",value:""},h=["value"],F=["disabled"],N={disabled:"",value:""},D=["disabled"],$=["disabled"],V=e.defineComponent({__name:"OneFilterRule",props:{rule:{type:Object,default:()=>({field:"",operator:"",value:""})},config:{type:Array,required:!0},readonly:{type:Boolean,default:!1},t:{type:Function,default:void 0}},emits:["update:rule","remove"],setup(t,{emit:s}){const r=t,c=s,p=k.useOnebI18n(),a=e.computed(()=>r.t??p),o=e.reactive({...r.rule});e.watch(o,()=>{c("update:rule",{...o})},{deep:!0});const i=e.computed(()=>{var u;return(u=r.config.find(n=>n.field===o.field))==null?void 0:u.type}),g=e.computed(()=>B(i.value)),m=()=>{o.operator="",o.value=""};return(u,n)=>(e.openBlock(),e.createElementBlock("div",E,[e.withDirectives(e.createElementVNode("select",{"onUpdate:modelValue":n[0]||(n[0]=l=>o.field=l),class:e.normalizeClass(["pl-2 py-2 pr-6 rounded text-sm flex-shrink flex-grow border",o.field?"":"text-gray-400"]),disabled:t.readonly,"data-test":"rule-field",onChange:m},[e.createElementVNode("option",x,e.toDisplayString(a.value("ui.filter.field")),1),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.config,l=>(e.openBlock(),e.createElementBlock("option",{key:l.field,value:l.field},e.toDisplayString(l.label),9,h))),128))],42,C),[[e.vModelSelect,o.field]]),e.withDirectives(e.createElementVNode("select",{"onUpdate:modelValue":n[1]||(n[1]=l=>o.operator=l),class:e.normalizeClass(["pl-2 py-2 pr-6 rounded text-sm min-w-20 border",o.operator?"":"text-gray-400"]),disabled:t.readonly,"data-test":"rule-operator"},[e.createElementVNode("option",N,e.toDisplayString(a.value("ui.filter.operator")),1),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.value,l=>(e.openBlock(),e.createElementBlock("option",{key:l},e.toDisplayString(l),1))),128))],10,F),[[e.vModelSelect,o.operator]]),i.value==="int"?e.withDirectives((e.openBlock(),e.createElementBlock("input",{key:0,"onUpdate:modelValue":n[2]||(n[2]=l=>o.value=l),type:"number",step:"1",class:"rounded text-sm border px-2 py-2",disabled:t.readonly,"data-test":"rule-value"},null,8,D)),[[e.vModelText,o.value]]):i.value==="string"?e.withDirectives((e.openBlock(),e.createElementBlock("input",{key:1,"onUpdate:modelValue":n[3]||(n[3]=l=>o.value=l),type:"text",class:"rounded text-sm border px-2 py-2",disabled:t.readonly,"data-test":"rule-value"},null,8,$)),[[e.vModelText,o.value]]):e.createCommentVNode("",!0),t.readonly?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("button",{key:2,type:"button",class:"p-2","data-test":"rule-remove",onClick:n[4]||(n[4]=l=>u.$emit("remove"))}," ✕ "))]))}}),S={class:"flex justify-between items-center border-b-2 gap-5 p-1"},w={class:"w-full"},O=["disabled"],U={value:"and"},T={value:"or"},j={class:"space-y-2"},G={key:0,class:"flex gap-2 p-2"},b=e.defineComponent({__name:"OneFilterGroup",props:{group:{type:Object,default:()=>({operator:"and",conditions:[]})},config:{type:Array,required:!0},readonly:{type:Boolean,default:!1},level:{type:Number,default:0},t:{type:Function,default:void 0}},emits:["update:group","remove"],setup(t,{emit:s}){const r=t,c=s,p=k.useOnebI18n(),a=e.computed(()=>r.t??p),o=e.reactive({operator:r.group.operator??"and",conditions:[...r.group.conditions??[]]});e.watch(o,()=>{c("update:group",{operator:o.operator,conditions:[...o.conditions]})},{deep:!0});const i=()=>{o.conditions.push({field:"",operator:"",value:""})},g=()=>{o.conditions.push({operator:"and",conditions:[]})},m=(n,l)=>{o.conditions[n]=l},u=n=>{o.conditions.splice(n,1)};return(n,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["border-l-4 pl-2 py-2 rounded space-y-2",{"border-violet-500":t.level===0,"border-blue-500":t.level===1,"border-green-500":t.level===2,"border-orange-500":t.level===3}]),"data-test":"filter-group"},[e.createElementVNode("div",S,[e.createElementVNode("label",w,[e.withDirectives(e.createElementVNode("select",{"onUpdate:modelValue":l[0]||(l[0]=d=>o.operator=d),class:"py-2 pr-10 border-none w-full",disabled:t.readonly,"data-test":"group-operator"},[e.createElementVNode("option",U,e.toDisplayString(a.value("ui.filter.and")),1),e.createElementVNode("option",T,e.toDisplayString(a.value("ui.filter.or")),1)],8,O),[[e.vModelSelect,o.operator]])]),!t.readonly&&t.level>0?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:"p-2","data-test":"group-remove",onClick:l[1]||(l[1]=d=>n.$emit("remove"))}," ✕ ")):e.createCommentVNode("",!0)]),e.createElementVNode("div",j,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.conditions,(d,y)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(f)(d)?b:V),{key:y,rule:e.unref(f)(d)?void 0:d,group:e.unref(f)(d)?d:void 0,config:t.config,level:t.level+1,readonly:t.readonly,t:r.t,"onUpdate:rule":v=>m(y,v),"onUpdate:group":v=>m(y,v),onRemove:v=>u(y)},null,40,["rule","group","config","level","readonly","t","onUpdate:rule","onUpdate:group","onRemove"]))),128))]),t.readonly?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",G,[e.createElementVNode("button",{type:"button",class:"px-2 py-1 bg-gray-100 rounded-md text-sm hover:bg-gray-200","data-test":"add-rule",onClick:i},e.toDisplayString(a.value("ui.filter.add_rule")),1),t.level<3?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:"px-2 py-1 bg-gray-100 rounded-md text-sm hover:bg-gray-200","data-test":"add-group",onClick:g},e.toDisplayString(a.value("ui.filter.add_group")),1)):e.createCommentVNode("",!0)]))],2))}}),M=e.defineComponent({__name:"OneFilterBuilder",props:{modelValue:{type:Object,default:null},config:{type:Array,required:!0},readonly:{type:Boolean,default:!1},t:{type:Function,default:void 0}},emits:["update:modelValue"],setup(t,{emit:s}){const r=t,c=s,p=e.computed(()=>r.modelValue??{operator:"and",conditions:[]});return(a,o)=>(e.openBlock(),e.createBlock(b,{group:p.value,config:t.config,readonly:t.readonly,t:r.t,"onUpdate:group":o[0]||(o[0]=i=>c("update:modelValue",i))},null,8,["group","config","readonly","t"]))}});exports.OneFilterBuilder=M;exports.OneFilterGroup=b;exports.OneFilterRule=V;exports.isFilterGroup=f;exports.operatorsForType=B;

package/dist/filterBuilder/index.d.ts

@@ -0,0 +1,5 @@
+export { default as OneFilterBuilder } from './OneFilterBuilder.vue';
+export { default as OneFilterGroup } from './OneFilterGroup.vue';
+export { default as OneFilterRule } from './OneFilterRule.vue';
+export { isFilterGroup, operatorsForType } from './filterBuilder';
+export type { FilterFieldConfig, FilterFieldType, FilterRuleNode, FilterGroupNode } from './filterBuilder';

package/dist/filterBuilder/index.js

@@ -0,0 +1,257 @@
+import { defineComponent as w, computed as g, reactive as R, watch as G, openBlock as r, createElementBlock as n, withDirectives as m, createElementVNode as a, normalizeClass as V, toDisplayString as s, Fragment as O, renderList as U, vModelSelect as B, vModelText as j, createCommentVNode as b, createBlock as T, resolveDynamicComponent as D, unref as h } from "vue";
+import { useOnebI18n as q } from "../i18n/index.js";
+const C = (e) => e != null && e.conditions !== void 0, N = (e) => e === "bool" ? ["1", "0"] : e === "int" ? ["=", "!=", "<", ">", "<=", ">="] : e === "string" ? ["=", "!=", "*", "!*"] : [], E = {
+  class: "flex gap-2 items-center hover:bg-gray-100 py-1 px-1 rounded-md",
+  "data-test": "filter-rule"
+}, M = ["disabled"], S = {
+  disabled: "",
+  value: ""
+}, z = ["value"], I = ["disabled"], L = {
+  disabled: "",
+  value: ""
+}, H = ["disabled"], J = ["disabled"], K = /* @__PURE__ */ w({
+  __name: "OneFilterRule",
+  props: {
+    rule: {
+      type: Object,
+      default: () => ({ field: "", operator: "", value: "" })
+    },
+    config: {
+      type: Array,
+      required: !0
+    },
+    readonly: {
+      type: Boolean,
+      default: !1
+    },
+    t: {
+      type: Function,
+      default: void 0
+    }
+  },
+  emits: ["update:rule", "remove"],
+  setup(e, { emit: y }) {
+    const d = e, v = y, f = q(), u = g(() => d.t ?? f), t = R({ ...d.rule });
+    G(
+      t,
+      () => {
+        v("update:rule", { ...t });
+      },
+      { deep: !0 }
+    );
+    const p = g(
+      () => {
+        var c;
+        return (c = d.config.find((l) => l.field === t.field)) == null ? void 0 : c.type;
+      }
+    ), F = g(() => N(p.value)), x = () => {
+      t.operator = "", t.value = "";
+    };
+    return (c, l) => (r(), n("div", E, [
+      m(a("select", {
+        "onUpdate:modelValue": l[0] || (l[0] = (o) => t.field = o),
+        class: V(["pl-2 py-2 pr-6 rounded text-sm flex-shrink flex-grow border", t.field ? "" : "text-gray-400"]),
+        disabled: e.readonly,
+        "data-test": "rule-field",
+        onChange: x
+      }, [
+        a("option", S, s(u.value("ui.filter.field")), 1),
+        (r(!0), n(O, null, U(e.config, (o) => (r(), n("option", {
+          key: o.field,
+          value: o.field
+        }, s(o.label), 9, z))), 128))
+      ], 42, M), [
+        [B, t.field]
+      ]),
+      m(a("select", {
+        "onUpdate:modelValue": l[1] || (l[1] = (o) => t.operator = o),
+        class: V(["pl-2 py-2 pr-6 rounded text-sm min-w-20 border", t.operator ? "" : "text-gray-400"]),
+        disabled: e.readonly,
+        "data-test": "rule-operator"
+      }, [
+        a("option", L, s(u.value("ui.filter.operator")), 1),
+        (r(!0), n(O, null, U(F.value, (o) => (r(), n("option", { key: o }, s(o), 1))), 128))
+      ], 10, I), [
+        [B, t.operator]
+      ]),
+      p.value === "int" ? m((r(), n("input", {
+        key: 0,
+        "onUpdate:modelValue": l[2] || (l[2] = (o) => t.value = o),
+        type: "number",
+        step: "1",
+        class: "rounded text-sm border px-2 py-2",
+        disabled: e.readonly,
+        "data-test": "rule-value"
+      }, null, 8, H)), [
+        [j, t.value]
+      ]) : p.value === "string" ? m((r(), n("input", {
+        key: 1,
+        "onUpdate:modelValue": l[3] || (l[3] = (o) => t.value = o),
+        type: "text",
+        class: "rounded text-sm border px-2 py-2",
+        disabled: e.readonly,
+        "data-test": "rule-value"
+      }, null, 8, J)), [
+        [j, t.value]
+      ]) : b("", !0),
+      e.readonly ? b("", !0) : (r(), n("button", {
+        key: 2,
+        type: "button",
+        class: "p-2",
+        "data-test": "rule-remove",
+        onClick: l[4] || (l[4] = (o) => c.$emit("remove"))
+      }, " ✕ "))
+    ]));
+  }
+}), P = { class: "flex justify-between items-center border-b-2 gap-5 p-1" }, Q = { class: "w-full" }, W = ["disabled"], X = { value: "and" }, Y = { value: "or" }, Z = { class: "space-y-2" }, _ = {
+  key: 0,
+  class: "flex gap-2 p-2"
+}, A = /* @__PURE__ */ w({
+  __name: "OneFilterGroup",
+  props: {
+    group: {
+      type: Object,
+      default: () => ({ operator: "and", conditions: [] })
+    },
+    config: {
+      type: Array,
+      required: !0
+    },
+    readonly: {
+      type: Boolean,
+      default: !1
+    },
+    level: {
+      type: Number,
+      default: 0
+    },
+    t: {
+      type: Function,
+      default: void 0
+    }
+  },
+  emits: ["update:group", "remove"],
+  setup(e, { emit: y }) {
+    const d = e, v = y, f = q(), u = g(() => d.t ?? f), t = R({
+      operator: d.group.operator ?? "and",
+      conditions: [...d.group.conditions ?? []]
+    });
+    G(
+      t,
+      () => {
+        v("update:group", { operator: t.operator, conditions: [...t.conditions] });
+      },
+      { deep: !0 }
+    );
+    const p = () => {
+      t.conditions.push({ field: "", operator: "", value: "" });
+    }, F = () => {
+      t.conditions.push({ operator: "and", conditions: [] });
+    }, x = (l, o) => {
+      t.conditions[l] = o;
+    }, c = (l) => {
+      t.conditions.splice(l, 1);
+    };
+    return (l, o) => (r(), n("div", {
+      class: V(["border-l-4 pl-2 py-2 rounded space-y-2", {
+        "border-violet-500": e.level === 0,
+        "border-blue-500": e.level === 1,
+        "border-green-500": e.level === 2,
+        "border-orange-500": e.level === 3
+      }]),
+      "data-test": "filter-group"
+    }, [
+      a("div", P, [
+        a("label", Q, [
+          m(a("select", {
+            "onUpdate:modelValue": o[0] || (o[0] = (i) => t.operator = i),
+            class: "py-2 pr-10 border-none w-full",
+            disabled: e.readonly,
+            "data-test": "group-operator"
+          }, [
+            a("option", X, s(u.value("ui.filter.and")), 1),
+            a("option", Y, s(u.value("ui.filter.or")), 1)
+          ], 8, W), [
+            [B, t.operator]
+          ])
+        ]),
+        !e.readonly && e.level > 0 ? (r(), n("button", {
+          key: 0,
+          type: "button",
+          class: "p-2",
+          "data-test": "group-remove",
+          onClick: o[1] || (o[1] = (i) => l.$emit("remove"))
+        }, " ✕ ")) : b("", !0)
+      ]),
+      a("div", Z, [
+        (r(!0), n(O, null, U(t.conditions, (i, k) => (r(), T(D(h(C)(i) ? A : K), {
+          key: k,
+          rule: h(C)(i) ? void 0 : i,
+          group: h(C)(i) ? i : void 0,
+          config: e.config,
+          level: e.level + 1,
+          readonly: e.readonly,
+          t: d.t,
+          "onUpdate:rule": ($) => x(k, $),
+          "onUpdate:group": ($) => x(k, $),
+          onRemove: ($) => c(k)
+        }, null, 40, ["rule", "group", "config", "level", "readonly", "t", "onUpdate:rule", "onUpdate:group", "onRemove"]))), 128))
+      ]),
+      e.readonly ? b("", !0) : (r(), n("div", _, [
+        a("button", {
+          type: "button",
+          class: "px-2 py-1 bg-gray-100 rounded-md text-sm hover:bg-gray-200",
+          "data-test": "add-rule",
+          onClick: p
+        }, s(u.value("ui.filter.add_rule")), 1),
+        e.level < 3 ? (r(), n("button", {
+          key: 0,
+          type: "button",
+          class: "px-2 py-1 bg-gray-100 rounded-md text-sm hover:bg-gray-200",
+          "data-test": "add-group",
+          onClick: F
+        }, s(u.value("ui.filter.add_group")), 1)) : b("", !0)
+      ]))
+    ], 2));
+  }
+}), oe = /* @__PURE__ */ w({
+  __name: "OneFilterBuilder",
+  props: {
+    modelValue: {
+      type: Object,
+      default: null
+    },
+    config: {
+      type: Array,
+      required: !0
+    },
+    readonly: {
+      type: Boolean,
+      default: !1
+    },
+    t: {
+      type: Function,
+      default: void 0
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(e, { emit: y }) {
+    const d = e, v = y, f = g(
+      () => d.modelValue ?? { operator: "and", conditions: [] }
+    );
+    return (u, t) => (r(), T(A, {
+      group: f.value,
+      config: e.config,
+      readonly: e.readonly,
+      t: d.t,
+      "onUpdate:group": t[0] || (t[0] = (p) => v("update:modelValue", p))
+    }, null, 8, ["group", "config", "readonly", "t"]));
+  }
+});
+export {
+  oe as OneFilterBuilder,
+  A as OneFilterGroup,
+  K as OneFilterRule,
+  C as isFilterGroup,
+  N as operatorsForType
+};

package/dist/form/form.d.ts

@@ -101,7 +101,7 @@ export declare const formInputProps: {
     };
     /** Type of input field */
     type: {
-        type: PropType<"number" | "checkbox" | "text" | "search" | "select" | "color" | "password" | "email" | "tel" | "url" | "radio" | "range" | "textarea" | "date" | "time" | "datetime-local" | "month" | "week">;
+        type: PropType<"number" | "checkbox" | "text" | "textarea" | "select" | "time" | "search" | "color" | "password" | "email" | "tel" | "url" | "radio" | "range" | "date" | "datetime-local" | "month" | "week">;
         default: string;
     };
     /** Additional CSS classes to apply to the input element */

package/dist/form/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),j=require("../XMarkIcon-f94baa4c.cjs"),I={id:{type:String,required:!1},validation:{type:Object,required:!1}},L={id:{type:String,required:!1},label:{type:String,required:!1},name:{type:String,required:!1},required:{required:!1,type:Boolean,default:!1},hint:{type:String,required:!1,default:""},errors:{type:Array,required:!1}},D={name:{type:String,required:!1},errors:{type:Array,required:!1}},A={label:{type:String,required:!1}},M={id:{type:String,required:!1},name:{type:String,required:!1},placeholder:{type:String,default:""},icon:{type:[Function,Object]},type:{type:String,default:"text"},inputClass:{required:!1,type:[Array,String]},modelValue:{required:!1,type:[String,Number,Array,Boolean,Object,null]},autofocus:{type:Boolean,default:!1},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},clearable:{type:Boolean,default:!1},rounded:{type:Boolean,default:!1},large:{type:Boolean,default:!1},invalid:{type:Boolean,required:!1,default:!1},options:{type:Array,required:!1,default:[]},autocomplete:{type:String,required:!1,default:""},maxlength:{type:Number,required:!1},minlength:{type:Number,required:!1},min:{type:[Number,String],required:!1},max:{type:[Number,String],required:!1},step:{type:[Number,String],required:!1},pattern:{type:String,required:!1},rows:{type:Number,default:3},cols:{type:Number,required:!1},resize:{type:String,default:"vertical"},spellcheck:{type:Boolean,required:!1},inputmode:{type:String,required:!1},tabindex:{type:Number,required:!1},ariaLabel:{type:String,required:!1},ariaDescribedby:{type:String,required:!1}},V=()=>e.inject("BaseForm",()=>({formId:e.computed(()=>{}),validation:e.computed(()=>{})}),!0),w=()=>e.inject("BaseFormField",()=>({inputId:e.computed(()=>{}),inputName:e.computed(()=>{}),hasError:e.computed(()=>!1)}),!0),P=["id"],K=e.defineComponent({__name:"OneForm",props:I,emits:["submit"],setup(i,{emit:n}){const a=i,l=n;e.provide("BaseForm",{formId:e.computed(()=>a.id),validation:e.computed(()=>a.validation)});const t=()=>{l("submit")};return(o,c)=>(e.openBlock(),e.createElementBlock("form",{onSubmit:e.withModifiers(t,["prevent"]),id:o.id,class:"space-y-3"},[e.renderSlot(o.$slots,"default")],40,P))}}),T=["for"],q=e.defineComponent({__name:"OneFormLabel",props:A,setup(i){const{inputId:n}=w();return(a,l)=>(e.openBlock(),e.createElementBlock("label",{for:e.unref(n),class:"text-sm font-medium text-primary-content select-none flex justify-between"},[e.createElementVNode("span",null,[e.renderSlot(a.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(a.label),1)])]),e.renderSlot(a.$slots,"right")],8,T))}}),X={key:0,class:"text-danger-content text-xs space-y-1"},C=e.defineComponent({__name:"OneFormFeedback",props:D,setup(i){const n=i,{validation:a}=V(),{inputName:l}=w(),t=e.computed(()=>l.value==null&&n.name==null?n.errors??[]:a.value==null?n.errors??[]:(a.value??{})[n.name||l.value]??n.errors??[]);return(o,c)=>t.value.length>0?(e.openBlock(),e.createElementBlock("div",X,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.value,u=>(e.openBlock(),e.createElementBlock("div",{key:u},e.toDisplayString(u),1))),128))])):e.createCommentVNode("",!0)}});function G(i,n){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z"}),e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M15 12a3 3 0 11-6 0 3 3 0 016 0z"})])}function H(i,n){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M3.98 8.223A10.477 10.477 0 001.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.45 10.45 0 0112 4.5c4.756 0 8.773 3.162 10.065 7.498a10.523 10.523 0 01-4.293 5.774M6.228 6.228L3 3m3.228 3.228l3.65 3.65m7.894 7.894L21 21m-3.228-3.228l-3.65-3.65m0 0a3 3 0 10-4.243-4.243m4.242 4.242L9.88 9.88"})])}const J=["id","disabled","tabindex"],Q=["selected"],R=["selected","value"],U=["name","id","value","rows","cols","maxlength","minlength","spellcheck","placeholder","disabled","readonly","tabindex","aria-label","aria-describedby"],W={key:2,class:"flex w-full space-x-3 items-center"},Y=["type","name","id","disabled","readonly","tabindex","aria-label","aria-describedby","checked"],Z=["for"],x={key:3,class:"w-full space-y-1"},_=["name","id","value","disabled","readonly","tabindex","checked"],ee=["for"],re={key:4,class:"relative"},le={class:"absolute p-2 px-3 rounded-md h-full flex items-center select-none pointer-events-none"},ne=["type","name","id","value","placeholder","disabled","readonly","maxlength","minlength","min","max","step","pattern","spellcheck","inputmode","tabindex","autocomplete","aria-label","aria-describedby"],N=e.defineComponent({__name:"OneFormInput",props:M,emits:["update:modelValue","focus","blur","change","input","keydown","keyup","keypress","clear","toggle-password"],setup(i,{expose:n,emit:a}){const l=i,t=a,{inputId:o,inputName:c,hasError:u}=w(),s=e.ref(null),m=e.ref(!1);e.onMounted(()=>{l.autofocus&&s.value&&s.value.focus()});const F=e.computed(()=>l.modelValue!=null&&l.modelValue!==""),p=e.computed(()=>{if(l.id)return l.id;const r=(o==null?void 0:o.value)||"";return l.name?`${r}-${l.name}`:r||""}),$=()=>{t("update:modelValue",""),t("clear"),E()},z=()=>{m.value=!m.value,t("toggle-password",m.value)},E=()=>{if(s.value){const r=Array.isArray(s.value)?s.value[0]:s.value;r==null||r.focus()}},O=e.computed(()=>{const r={"shadow-sm":l.type!=="range","border-danger-base":u.value||l.invalid,"pl-10":l.icon!=null,"pr-10":l.type==="password","rounded-full":l.rounded,"rounded-md":!l.rounded,"text-lg":l.large,"py-2.5":l.large,"py-2":!l.large};return l.inputClass!=null&&(typeof l.inputClass=="string"?r[l.inputClass]=!0:l.inputClass instanceof Array&&l.inputClass.forEach(h=>{r[h]=!0})),r}),y=r=>{const h=r.target;if(l.type==="checkbox"){const d=h.checked;t("update:modelValue",d),t("input",r)}else t("update:modelValue",h.value),t("input",r)},f=r=>t("focus",r),b=r=>t("blur",r),k=r=>t("change",r),g=r=>t("keydown",r),v=r=>t("keyup",r),B=r=>t("keypress",r);return n({focus:E}),(r,h)=>r.type==="select"?(e.openBlock(),e.createElementBlock("select",{key:0,id:p.value,ref_key:"inputElement",ref:s,class:e.normalizeClass(["border border-primary-stroke px-3 w-full",{"border-danger-base":e.unref(u)||r.invalid,"text-secondary-content":r.modelValue===""||r.modelValue==null,"rounded-full":r.rounded,"rounded-md":!r.rounded,"text-lg":r.large,"py-2.5":r.large,"py-2":!r.large}]),disabled:r.disabled,tabindex:r.tabindex,onInput:y,onFocus:f,onBlur:b,onChange:k,onKeydown:g,onKeyup:v,onKeypress:B},[r.placeholder?(e.openBlock(),e.createElementBlock("option",{key:0,selected:r.modelValue===""||r.modelValue==null,disabled:"",hidden:""},e.toDisplayString(r.placeholder),9,Q)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.options,d=>(e.openBlock(),e.createElementBlock("option",{selected:d.key===r.modelValue,key:d.key,value:d.key},e.toDisplayString(d.value),9,R))),128))],42,J)):r.type==="textarea"?(e.openBlock(),e.createElementBlock("textarea",{key:1,name:r.name||e.unref(c),id:p.value,value:r.modelValue,rows:r.rows,cols:r.cols,maxlength:r.maxlength,minlength:r.minlength,spellcheck:r.spellcheck,placeholder:r.placeholder,disabled:r.disabled,readonly:r.readonly,tabindex:r.tabindex,"aria-label":r.ariaLabel,"aria-describedby":r.ariaDescribedby,onInput:y,onFocus:f,onBlur:b,onChange:k,onKeydown:g,onKeyup:v,onKeypress:B,class:e.normalizeClass(["border border-primary-stroke px-3 w-full placeholder-gray-400",{"border-danger-base":e.unref(u),"rounded-3xl":r.rounded,"rounded-md":!r.rounded,"text-lg":r.large,"py-2.5":r.large,"py-2":!r.large,"resize-none":r.resize==="none","resize-both":r.resize==="both","resize-x":r.resize==="horizontal","resize-y":r.resize==="vertical"}]),ref_key:"inputElement",ref:s},null,42,U)):r.type==="checkbox"?(e.openBlock(),e.createElementBlock("div",W,[e.createElementVNode("input",{type:r.type,name:r.name||e.unref(c),id:p.value,value:!0,disabled:r.disabled,readonly:r.readonly,tabindex:r.tabindex,"aria-label":r.ariaLabel,"aria-describedby":r.ariaDescribedby,checked:r.modelValue===!0,onInput:y,onFocus:f,onBlur:b,onChange:k,class:e.normalizeClass(["rounded-md border border-primary-stroke px-2 py-2 shadow-sm",{"border-danger-base":e.unref(u)||r.invalid}]),ref_key:"inputElement",ref:s},null,42,Y),e.createElementVNode("label",{for:p.value,class:"text-primary-content select-none"},e.toDisplayString(r.placeholder),9,Z)])):r.type==="radio"?(e.openBlock(),e.createElementBlock("div",x,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.options,(d,S)=>(e.openBlock(),e.createElementBlock("div",{key:d.key,class:"flex w-full space-x-3 items-center"},[e.createElementVNode("input",{type:"radio",name:r.name||e.unref(c),id:`${p.value}-${S}`,value:d.key,disabled:r.disabled,readonly:r.readonly,tabindex:r.tabindex,checked:d.key===r.modelValue,onInput:y,onFocus:f,onBlur:b,onChange:k,class:e.normalizeClass(["rounded-md border border-primary-stroke px-3 py-2 shadow-sm",{"border-danger-base":e.unref(u)||r.invalid}]),ref_for:!0,ref_key:"inputElement",ref:s},null,42,_),e.createElementVNode("label",{for:`${p.value}-${S}`,class:"text-primary-content select-none"},e.toDisplayString(d.value),9,ee)]))),128))])):(e.openBlock(),e.createElementBlock("div",re,[e.createElementVNode("div",le,[r.icon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.icon),{key:0,class:"w-5 h-5 text-primary-content"})):e.createCommentVNode("",!0)]),e.createElementVNode("input",{type:m.value?"text":r.type,name:r.name||e.unref(c),id:p.value,value:r.modelValue,placeholder:r.placeholder,disabled:r.disabled,readonly:r.readonly,maxlength:r.maxlength,minlength:r.minlength,min:r.min,max:r.max,step:r.step,pattern:r.pattern,spellcheck:r.spellcheck,inputmode:r.inputmode,tabindex:r.tabindex,autocomplete:r.autocomplete,"aria-label":r.ariaLabel,"aria-describedby":r.ariaDescribedby,onInput:y,onFocus:f,onBlur:b,onChange:k,onKeydown:g,onKeyup:v,onKeypress:B,class:e.normalizeClass(["border border-primary-stroke w-full px-3 placeholder-gray-400 disabled:bg-gray-50",O.value]),ref_key:"inputElement",ref:s},null,42,ne),r.clearable&&F.value?(e.openBlock(),e.createElementBlock("div",{key:0,onClick:$,class:"absolute p-2 px-3 rounded-md h-full flex items-center right-0 top-0 hover:cursor-pointer select-none"},[e.createVNode(e.unref(j.render),{class:"w-5 h-5 text-secondary-content hover:text-primary-base"})])):r.type==="password"?(e.openBlock(),e.createElementBlock("div",{key:1,onClick:z,class:"absolute p-2 px-3 rounded-md h-full flex items-center right-0 top-0 hover:cursor-pointer select-none"},[m.value?(e.openBlock(),e.createBlock(e.unref(H),{key:0,class:"w-5 h-5 text-primary-content hover:text-primary-base"})):(e.openBlock(),e.createBlock(e.unref(G),{key:1,class:"w-5 h-5 text-secondary-content hover:text-primary-base"}))])):e.createCommentVNode("",!0)]))}}),te={class:"space-y-1"},oe={key:2,class:"text-xs text-secondary-content select-none"},ae=e.defineComponent({__name:"OneFormField",props:L,setup(i){const n=i,{formId:a,validation:l}=V(),t=e.computed(()=>n.errors!=null&&n.errors.length>0?!0:n.name==null?!1:(l.value??{})[n.name]!=null);return e.provide("BaseFormField",{inputId:e.computed(()=>{const o=a.value||"form";if(n.id!=null)return`${o}-${n.id}`;if(n.name!=null)return`${o}-field-${n.name}`}),inputName:e.computed(()=>n.name),hasError:t}),(o,c)=>(e.openBlock(),e.createElementBlock("div",te,[o.label?(e.openBlock(),e.createBlock(q,{key:0,label:o.label},{right:e.withCtx(()=>[e.renderSlot(o.$slots,"right")]),_:3},8,["label"])):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"default",{},()=>[e.createVNode(N)]),t.value?(e.openBlock(),e.createBlock(C,{key:1,errors:o.errors},null,8,["errors"])):o.hint.length>0?(e.openBlock(),e.createElementBlock("p",oe,e.toDisplayString(o.hint),1)):e.createCommentVNode("",!0)]))}});exports.OneForm=K;exports.OneFormFeedback=C;exports.OneFormField=ae;exports.OneFormInput=N;exports.OneFormLabel=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),n=require("../OneFormInput.vue_vue_type_script_setup_true_lang-f6f7cd96.cjs");require("../XMarkIcon-f94baa4c.cjs");const d=["id"],p=e.defineComponent({__name:"OneForm",props:n.formProps,emits:["submit"],setup(a,{emit:t}){const o=a,l=t;e.provide("BaseForm",{formId:e.computed(()=>o.id),validation:e.computed(()=>o.validation)});const s=()=>{l("submit")};return(r,i)=>(e.openBlock(),e.createElementBlock("form",{onSubmit:e.withModifiers(s,["prevent"]),id:r.id,class:"space-y-3"},[e.renderSlot(r.$slots,"default")],40,d))}}),f=["for"],m=e.defineComponent({__name:"OneFormLabel",props:n.formLabelProps,setup(a){const{inputId:t}=n.injectFormField();return(o,l)=>(e.openBlock(),e.createElementBlock("label",{for:e.unref(t),class:"text-sm font-medium text-primary-content select-none flex justify-between"},[e.createElementVNode("span",null,[e.renderSlot(o.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(o.label),1)])]),e.renderSlot(o.$slots,"right")],8,f))}}),_={key:0,class:"text-danger-content text-xs space-y-1"},u=e.defineComponent({__name:"OneFormFeedback",props:n.formFeedbackProps,setup(a){const t=a,{validation:o}=n.injectForm(),{inputName:l}=n.injectFormField(),s=e.computed(()=>l.value==null&&t.name==null?t.errors??[]:o.value==null?t.errors??[]:(o.value??{})[t.name||l.value]??t.errors??[]);return(r,i)=>s.value.length>0?(e.openBlock(),e.createElementBlock("div",_,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.value,c=>(e.openBlock(),e.createElementBlock("div",{key:c},e.toDisplayString(c),1))),128))])):e.createCommentVNode("",!0)}}),v={class:"space-y-1"},k={key:2,class:"text-xs text-secondary-content select-none"},F=e.defineComponent({__name:"OneFormField",props:n.formFieldProps,setup(a){const t=a,{formId:o,validation:l}=n.injectForm(),s=e.computed(()=>t.errors!=null&&t.errors.length>0?!0:t.name==null?!1:(l.value??{})[t.name]!=null);return e.provide("BaseFormField",{inputId:e.computed(()=>{const r=o.value||"form";if(t.id!=null)return`${r}-${t.id}`;if(t.name!=null)return`${r}-field-${t.name}`}),inputName:e.computed(()=>t.name),hasError:s}),(r,i)=>(e.openBlock(),e.createElementBlock("div",v,[r.label?(e.openBlock(),e.createBlock(m,{key:0,label:r.label},{right:e.withCtx(()=>[e.renderSlot(r.$slots,"right")]),_:3},8,["label"])):e.createCommentVNode("",!0),e.renderSlot(r.$slots,"default",{},()=>[e.createVNode(n._sfc_main)]),s.value?(e.openBlock(),e.createBlock(u,{key:1,errors:r.errors},null,8,["errors"])):r.hint.length>0?(e.openBlock(),e.createElementBlock("p",k,e.toDisplayString(r.hint),1)):e.createCommentVNode("",!0)]))}});exports.OneFormInput=n._sfc_main;exports.OneForm=p;exports.OneFormFeedback=u;exports.OneFormField=F;exports.OneFormLabel=m;