@dbcdk/react-components 0.0.102 → 0.0.104

package/dist/components/datetime-picker/dateTimeHelpers.cjs

@@ -0,0 +1,179 @@
+'use strict';
+
+const RANGE_SEP_RE = /\s*(?:–|\bto\b|\btil\b|\s-\s)\s*/i;
+function normalizeSpaces(s) {
+  return s.trim().replace(/\s+/g, " ");
+}
+function splitDigitOnlyRangeParts(input) {
+  const m = /^\s*(\d{8})\s*-\s*(\d{8})\s*$/.exec(input);
+  if (!m) return null;
+  return [m[1], m[2]];
+}
+function splitRangeParts(input) {
+  var _a;
+  const digitOnly = splitDigitOnlyRangeParts(input);
+  if (digitOnly) return digitOnly;
+  const txt = normalizeSpaces(input);
+  const parts = txt.split(RANGE_SEP_RE);
+  if (parts.length < 2) return null;
+  const left = ((_a = parts[0]) != null ? _a : "").trim();
+  const right = parts.slice(1).join(" ").trim();
+  if (!left || !right) return null;
+  return [left, right];
+}
+const digits = (s) => (s.match(/\d/g) || []).join("");
+function maskDateEU(text) {
+  const d = digits(text).slice(0, 8);
+  const dd = d.slice(0, 2);
+  const mm = d.slice(2, 4);
+  const yyyy = d.slice(4, 8);
+  let out = dd;
+  if (mm.length) out += (out ? "-" : "") + mm;
+  if (yyyy.length) out += (out ? "-" : "") + yyyy;
+  return out;
+}
+function maskTimeHM(text) {
+  const d = digits(text).slice(0, 4);
+  const hh = d.slice(0, 2);
+  const mm = d.slice(2, 4);
+  return mm.length ? `${hh}:${mm}` : hh;
+}
+function maskSingle(text, enableTime) {
+  const t = normalizeSpaces(text);
+  if (!enableTime) return maskDateEU(t);
+  const m = /^(.*?)[ T](.*)$/.exec(t);
+  if (!m) return maskDateEU(t);
+  const datePart = maskDateEU(m[1]);
+  const timePart = maskTimeHM(m[2]);
+  return timePart ? `${datePart} ${timePart}` : datePart;
+}
+function maskRange(text, _enableTime) {
+  const parts = splitRangeParts(text);
+  if (!parts) return maskSingle(text, false);
+  const [left, right] = parts;
+  const a = maskSingle(left, false);
+  const b = maskSingle(right, false);
+  return `${a} \u2013 ${b}`.trim();
+}
+const pad2 = (n) => String(n).padStart(2, "0");
+function isUtcIsoString(v) {
+  return typeof v === "string" && /Z$/.test(v) && !Number.isNaN(Date.parse(v));
+}
+function isDateOnlyString(v) {
+  if (typeof v !== "string") return false;
+  const m = /^(\d{4})-(\d{2})-(\d{2})$/.exec(v);
+  if (!m) return false;
+  const y = +m[1];
+  const mo = +m[2];
+  const d = +m[3];
+  if (mo < 1 || mo > 12) return false;
+  if (d < 1 || d > 31) return false;
+  const local = new Date(y, mo - 1, d, 0, 0, 0, 0);
+  return local.getFullYear() === y && local.getMonth() === mo - 1 && local.getDate() === d;
+}
+function utcMillisFromIso(iso) {
+  return Date.parse(iso);
+}
+function isoFromLocalDate(dLocal) {
+  return dLocal.toISOString();
+}
+function isoFromLocalParts(y, m0, d, hh = 0, mm = 0) {
+  const local = new Date(y, m0, d, hh, mm, 0, 0);
+  if (Number.isNaN(local.getTime())) return null;
+  if (local.getFullYear() !== y || local.getMonth() !== m0 || local.getDate() !== d || local.getHours() !== hh || local.getMinutes() !== mm) {
+    return null;
+  }
+  return local.toISOString();
+}
+function localDateFromIso(iso) {
+  const ms = Date.parse(iso);
+  if (Number.isNaN(ms)) return null;
+  return new Date(ms);
+}
+function dateOnlyFromLocalParts(y, m0, d) {
+  return `${String(y).padStart(4, "0")}-${pad2(m0 + 1)}-${pad2(d)}`;
+}
+function localDateFromDateOnly(s) {
+  if (!isDateOnlyString(s)) return null;
+  const m = /^(\d{4})-(\d{2})-(\d{2})$/.exec(s);
+  if (!m) return null;
+  const y = +m[1];
+  const mo0 = +m[2] - 1;
+  const d = +m[3];
+  const local = new Date(y, mo0, d, 0, 0, 0, 0);
+  if (Number.isNaN(local.getTime())) return null;
+  if (local.getFullYear() !== y || local.getMonth() !== mo0 || local.getDate() !== d) return null;
+  return local;
+}
+function compareDateOnly(a, b) {
+  const da = localDateFromDateOnly(a);
+  const db = localDateFromDateOnly(b);
+  if (!da || !db) return 0;
+  const ta = Date.UTC(da.getFullYear(), da.getMonth(), da.getDate());
+  const tb = Date.UTC(db.getFullYear(), db.getMonth(), db.getDate());
+  return ta - tb;
+}
+function toMaskedFromDate(d, enableTime) {
+  const dd = pad2(d.getDate());
+  const mm = pad2(d.getMonth() + 1);
+  const yyyy = String(d.getFullYear());
+  let out = `${dd}-${mm}-${yyyy}`;
+  if (enableTime) out += ` ${pad2(d.getHours())}:${pad2(d.getMinutes())}`;
+  return out;
+}
+function parseLooseDateOrDateTime(input) {
+  const txt = normalizeSpaces(input);
+  const dateTimeMatch = /^(?<date>[\d./-]{8,10})(?:[ T](?<hh>\d{1,2}):(?<mm>\d{2}))?$/i.exec(txt);
+  if (!(dateTimeMatch == null ? void 0 : dateTimeMatch.groups)) return null;
+  const raw = dateTimeMatch.groups.date;
+  const hh = dateTimeMatch.groups.hh ? parseInt(dateTimeMatch.groups.hh, 10) : 0;
+  const mm = dateTimeMatch.groups.mm ? parseInt(dateTimeMatch.groups.mm, 10) : 0;
+  if (hh < 0 || hh > 23 || mm < 0 || mm > 59) return null;
+  let y, m, d;
+  const mIso = /^(\d{4})-(\d{1,2})-(\d{1,2})$/.exec(raw);
+  if (mIso) {
+    y = +mIso[1];
+    m = +mIso[2] - 1;
+    d = +mIso[3];
+  } else {
+    const mEu = /^(\d{2})[./-](\d{2})[./-](\d{4})$/.exec(raw);
+    if (!mEu) return null;
+    d = +mEu[1];
+    m = +mEu[2] - 1;
+    y = +mEu[3];
+  }
+  const local = new Date(y, m, d, hh, mm, 0, 0);
+  if (Number.isNaN(local.getTime())) return null;
+  if (local.getFullYear() !== y || local.getMonth() !== m || local.getDate() !== d || local.getHours() !== hh || local.getMinutes() !== mm) {
+    return null;
+  }
+  return local;
+}
+function parseLooseRange(input) {
+  const parts = splitRangeParts(input);
+  if (!parts) return null;
+  const [a, b] = parts;
+  const s = parseLooseDateOrDateTime(a);
+  const e = parseLooseDateOrDateTime(b);
+  if (!s || !e) return null;
+  return s <= e ? { start: s, end: e } : { start: e, end: s };
+}
+
+exports.compareDateOnly = compareDateOnly;
+exports.dateOnlyFromLocalParts = dateOnlyFromLocalParts;
+exports.digits = digits;
+exports.isDateOnlyString = isDateOnlyString;
+exports.isUtcIsoString = isUtcIsoString;
+exports.isoFromLocalDate = isoFromLocalDate;
+exports.isoFromLocalParts = isoFromLocalParts;
+exports.localDateFromDateOnly = localDateFromDateOnly;
+exports.localDateFromIso = localDateFromIso;
+exports.maskDateEU = maskDateEU;
+exports.maskRange = maskRange;
+exports.maskSingle = maskSingle;
+exports.maskTimeHM = maskTimeHM;
+exports.pad2 = pad2;
+exports.parseLooseDateOrDateTime = parseLooseDateOrDateTime;
+exports.parseLooseRange = parseLooseRange;
+exports.toMaskedFromDate = toMaskedFromDate;
+exports.utcMillisFromIso = utcMillisFromIso;

package/dist/components/datetime-picker/dateTimeHelpers.js

@@ -0,0 +1,160 @@
+const RANGE_SEP_RE = /\s*(?:–|\bto\b|\btil\b|\s-\s)\s*/i;
+function normalizeSpaces(s) {
+  return s.trim().replace(/\s+/g, " ");
+}
+function splitDigitOnlyRangeParts(input) {
+  const m = /^\s*(\d{8})\s*-\s*(\d{8})\s*$/.exec(input);
+  if (!m) return null;
+  return [m[1], m[2]];
+}
+function splitRangeParts(input) {
+  var _a;
+  const digitOnly = splitDigitOnlyRangeParts(input);
+  if (digitOnly) return digitOnly;
+  const txt = normalizeSpaces(input);
+  const parts = txt.split(RANGE_SEP_RE);
+  if (parts.length < 2) return null;
+  const left = ((_a = parts[0]) != null ? _a : "").trim();
+  const right = parts.slice(1).join(" ").trim();
+  if (!left || !right) return null;
+  return [left, right];
+}
+const digits = (s) => (s.match(/\d/g) || []).join("");
+function maskDateEU(text) {
+  const d = digits(text).slice(0, 8);
+  const dd = d.slice(0, 2);
+  const mm = d.slice(2, 4);
+  const yyyy = d.slice(4, 8);
+  let out = dd;
+  if (mm.length) out += (out ? "-" : "") + mm;
+  if (yyyy.length) out += (out ? "-" : "") + yyyy;
+  return out;
+}
+function maskTimeHM(text) {
+  const d = digits(text).slice(0, 4);
+  const hh = d.slice(0, 2);
+  const mm = d.slice(2, 4);
+  return mm.length ? `${hh}:${mm}` : hh;
+}
+function maskSingle(text, enableTime) {
+  const t = normalizeSpaces(text);
+  if (!enableTime) return maskDateEU(t);
+  const m = /^(.*?)[ T](.*)$/.exec(t);
+  if (!m) return maskDateEU(t);
+  const datePart = maskDateEU(m[1]);
+  const timePart = maskTimeHM(m[2]);
+  return timePart ? `${datePart} ${timePart}` : datePart;
+}
+function maskRange(text, _enableTime) {
+  const parts = splitRangeParts(text);
+  if (!parts) return maskSingle(text, false);
+  const [left, right] = parts;
+  const a = maskSingle(left, false);
+  const b = maskSingle(right, false);
+  return `${a} \u2013 ${b}`.trim();
+}
+const pad2 = (n) => String(n).padStart(2, "0");
+function isUtcIsoString(v) {
+  return typeof v === "string" && /Z$/.test(v) && !Number.isNaN(Date.parse(v));
+}
+function isDateOnlyString(v) {
+  if (typeof v !== "string") return false;
+  const m = /^(\d{4})-(\d{2})-(\d{2})$/.exec(v);
+  if (!m) return false;
+  const y = +m[1];
+  const mo = +m[2];
+  const d = +m[3];
+  if (mo < 1 || mo > 12) return false;
+  if (d < 1 || d > 31) return false;
+  const local = new Date(y, mo - 1, d, 0, 0, 0, 0);
+  return local.getFullYear() === y && local.getMonth() === mo - 1 && local.getDate() === d;
+}
+function utcMillisFromIso(iso) {
+  return Date.parse(iso);
+}
+function isoFromLocalDate(dLocal) {
+  return dLocal.toISOString();
+}
+function isoFromLocalParts(y, m0, d, hh = 0, mm = 0) {
+  const local = new Date(y, m0, d, hh, mm, 0, 0);
+  if (Number.isNaN(local.getTime())) return null;
+  if (local.getFullYear() !== y || local.getMonth() !== m0 || local.getDate() !== d || local.getHours() !== hh || local.getMinutes() !== mm) {
+    return null;
+  }
+  return local.toISOString();
+}
+function localDateFromIso(iso) {
+  const ms = Date.parse(iso);
+  if (Number.isNaN(ms)) return null;
+  return new Date(ms);
+}
+function dateOnlyFromLocalParts(y, m0, d) {
+  return `${String(y).padStart(4, "0")}-${pad2(m0 + 1)}-${pad2(d)}`;
+}
+function localDateFromDateOnly(s) {
+  if (!isDateOnlyString(s)) return null;
+  const m = /^(\d{4})-(\d{2})-(\d{2})$/.exec(s);
+  if (!m) return null;
+  const y = +m[1];
+  const mo0 = +m[2] - 1;
+  const d = +m[3];
+  const local = new Date(y, mo0, d, 0, 0, 0, 0);
+  if (Number.isNaN(local.getTime())) return null;
+  if (local.getFullYear() !== y || local.getMonth() !== mo0 || local.getDate() !== d) return null;
+  return local;
+}
+function compareDateOnly(a, b) {
+  const da = localDateFromDateOnly(a);
+  const db = localDateFromDateOnly(b);
+  if (!da || !db) return 0;
+  const ta = Date.UTC(da.getFullYear(), da.getMonth(), da.getDate());
+  const tb = Date.UTC(db.getFullYear(), db.getMonth(), db.getDate());
+  return ta - tb;
+}
+function toMaskedFromDate(d, enableTime) {
+  const dd = pad2(d.getDate());
+  const mm = pad2(d.getMonth() + 1);
+  const yyyy = String(d.getFullYear());
+  let out = `${dd}-${mm}-${yyyy}`;
+  if (enableTime) out += ` ${pad2(d.getHours())}:${pad2(d.getMinutes())}`;
+  return out;
+}
+function parseLooseDateOrDateTime(input) {
+  const txt = normalizeSpaces(input);
+  const dateTimeMatch = /^(?<date>[\d./-]{8,10})(?:[ T](?<hh>\d{1,2}):(?<mm>\d{2}))?$/i.exec(txt);
+  if (!(dateTimeMatch == null ? void 0 : dateTimeMatch.groups)) return null;
+  const raw = dateTimeMatch.groups.date;
+  const hh = dateTimeMatch.groups.hh ? parseInt(dateTimeMatch.groups.hh, 10) : 0;
+  const mm = dateTimeMatch.groups.mm ? parseInt(dateTimeMatch.groups.mm, 10) : 0;
+  if (hh < 0 || hh > 23 || mm < 0 || mm > 59) return null;
+  let y, m, d;
+  const mIso = /^(\d{4})-(\d{1,2})-(\d{1,2})$/.exec(raw);
+  if (mIso) {
+    y = +mIso[1];
+    m = +mIso[2] - 1;
+    d = +mIso[3];
+  } else {
+    const mEu = /^(\d{2})[./-](\d{2})[./-](\d{4})$/.exec(raw);
+    if (!mEu) return null;
+    d = +mEu[1];
+    m = +mEu[2] - 1;
+    y = +mEu[3];
+  }
+  const local = new Date(y, m, d, hh, mm, 0, 0);
+  if (Number.isNaN(local.getTime())) return null;
+  if (local.getFullYear() !== y || local.getMonth() !== m || local.getDate() !== d || local.getHours() !== hh || local.getMinutes() !== mm) {
+    return null;
+  }
+  return local;
+}
+function parseLooseRange(input) {
+  const parts = splitRangeParts(input);
+  if (!parts) return null;
+  const [a, b] = parts;
+  const s = parseLooseDateOrDateTime(a);
+  const e = parseLooseDateOrDateTime(b);
+  if (!s || !e) return null;
+  return s <= e ? { start: s, end: e } : { start: e, end: s };
+}
+
+export { compareDateOnly, dateOnlyFromLocalParts, digits, isDateOnlyString, isUtcIsoString, isoFromLocalDate, isoFromLocalParts, localDateFromDateOnly, localDateFromIso, maskDateEU, maskRange, maskSingle, maskTimeHM, pad2, parseLooseDateOrDateTime, parseLooseRange, toMaskedFromDate, utcMillisFromIso };

package/dist/components/divider/Divider.cjs

@@ -0,0 +1,22 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+
+const spacingMap = {
+  sm: "var(--spacing-sm)",
+  md: "var(--spacing-md)",
+  lg: "var(--spacing-lg)"
+};
+const Divider = ({ spacing = "md" }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      style: {
+        borderTop: "1px solid var(--color-border-subtle)",
+        marginBlock: spacingMap[spacing]
+      }
+    }
+  );
+};
+
+exports.Divider = Divider;

package/dist/components/divider/Divider.js

@@ -0,0 +1,20 @@
+import { jsx } from 'react/jsx-runtime';
+
+const spacingMap = {
+  sm: "var(--spacing-sm)",
+  md: "var(--spacing-md)",
+  lg: "var(--spacing-lg)"
+};
+const Divider = ({ spacing = "md" }) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: {
+        borderTop: "1px solid var(--color-border-subtle)",
+        marginBlock: spacingMap[spacing]
+      }
+    }
+  );
+};
+
+export { Divider };

package/dist/components/filter-field/FilterField.cjs

@@ -0,0 +1,296 @@
+'use client';
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var lucideReact = require('lucide-react');
+var react = require('react');
+var Input = require('../../components/forms/input/Input');
+var Typeahead = require('../../components/forms/typeahead/Typeahead');
+var styles = require('./FilterField.module.css');
+var Menu = require('../menu/Menu');
+var Popover = require('../popover/Popover');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var styles__default = /*#__PURE__*/_interopDefault(styles);
+
+const LABELS = {
+  is: "is",
+  isNot: "not",
+  contains: "contains",
+  notContains: "not contain",
+  startsWith: "starts with",
+  endsWith: "ends with",
+  gt: ">",
+  lt: "<",
+  gte: "\u2265",
+  lte: "\u2264",
+  in: "",
+  notIn: "not in",
+  isEmpty: "empty",
+  isNotEmpty: "not empty"
+};
+const DEFAULT_TEXT_OPERATORS = [
+  "is",
+  "isNot",
+  "contains",
+  "notContains",
+  "startsWith",
+  "endsWith",
+  "isEmpty",
+  "isNotEmpty"
+];
+const NUMBER_OPERATORS = [
+  "is",
+  "isNot",
+  "gt",
+  "lt",
+  "gte",
+  "lte",
+  "isEmpty",
+  "isNotEmpty"
+];
+const VALUELESS_OPERATORS = ["isEmpty", "isNotEmpty"];
+const INPUT_DEBOUNCE_MS = 500;
+function OperatorDropdown({
+  value,
+  onChange,
+  operators,
+  size = "sm",
+  disabled
+}) {
+  const popRef = react.useRef(null);
+  const [activeIndex, setActiveIndex] = react.useState(() => Math.max(0, operators.indexOf(value)));
+  react.useEffect(() => {
+    setActiveIndex(Math.max(0, operators.indexOf(value)));
+  }, [operators, value]);
+  const handleSelect = (op) => {
+    var _a;
+    onChange(op);
+    setActiveIndex(operators.indexOf(op));
+    (_a = popRef.current) == null ? void 0 : _a.close();
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Popover.Popover,
+    {
+      ref: popRef,
+      minWidth: "160px",
+      trigger: (toggle, icon) => /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: toggle,
+          disabled,
+          "aria-label": "Skift operator",
+          className: `${styles__default.default.operatorTrigger} ${styles__default.default[size]}`,
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles__default.default.operatorText, children: LABELS[value] }),
+            icon
+          ]
+        }
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsx(Menu.Menu, { children: operators.map((op) => {
+        const selected = op === value;
+        return /* @__PURE__ */ jsxRuntime.jsx(Menu.Menu.Item, { active: selected, children: /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", onClick: () => handleSelect(op), disabled, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { style: { width: 16, display: "inline-flex", justifyContent: "center" }, children: selected ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { size: 16 }) : null }),
+          LABELS[op]
+        ] }) }, op);
+      }) })
+    }
+  );
+}
+function isFilterActive(value) {
+  if (Array.isArray(value)) return value.length > 0;
+  if (typeof value === "string") return value.trim().length > 0;
+  return value != null;
+}
+function FilterField({
+  field,
+  control,
+  operator,
+  value,
+  onChange,
+  operators,
+  options = [],
+  single = true,
+  size = "md",
+  variant = "surface",
+  label,
+  placeholder = "Type value\u2026",
+  disabled,
+  "data-cy": dataCy,
+  minWidth,
+  width,
+  maxWidth,
+  popoverWidth,
+  debounceTime = INPUT_DEBOUNCE_MS,
+  ...inputProps
+}) {
+  var _a, _b, _c, _d;
+  const filterFieldRef = react.useRef(null);
+  const ops = react.useMemo(() => operators != null ? operators : DEFAULT_TEXT_OPERATORS, [operators]);
+  const shouldAutoFitTypeahead = control === "select" && single && !width;
+  const [selectedOperator, setSelectedOperator] = react.useState(operator);
+  const active = isFilterActive(value);
+  react.useEffect(() => {
+    if (ops.includes(operator)) {
+      setSelectedOperator(operator);
+    }
+  }, [operator, ops]);
+  const [localValue, setLocalValue] = react.useState(value != null ? value : "");
+  const debounceRef = react.useRef(null);
+  const pendingValueRef = react.useRef(null);
+  const emit = (next) => {
+    var _a2, _b2;
+    const nextOperator = (_a2 = next.operator) != null ? _a2 : selectedOperator;
+    const nextValue = (_b2 = next.value) != null ? _b2 : value;
+    if (next.operator) {
+      setSelectedOperator(nextOperator);
+    }
+    onChange({
+      field,
+      operator: nextOperator,
+      value: nextValue
+    });
+  };
+  const clearDebounce = () => {
+    if (debounceRef.current) {
+      clearTimeout(debounceRef.current);
+      debounceRef.current = null;
+    }
+  };
+  const scheduleEmitValue = (nextVal) => {
+    clearDebounce();
+    pendingValueRef.current = nextVal;
+    debounceRef.current = setTimeout(() => {
+      emit({ value: nextVal });
+    }, debounceTime);
+  };
+  const flushPendingValue = () => {
+    if (control !== "input") return;
+    clearDebounce();
+    pendingValueRef.current = localValue;
+    emit({ value: localValue });
+  };
+  const handleOperatorChange = (op) => {
+    setSelectedOperator(op);
+    if (!active && !VALUELESS_OPERATORS.includes(op)) return;
+    if (VALUELESS_OPERATORS.includes(op)) {
+      clearDebounce();
+      pendingValueRef.current = null;
+      emit({ operator: op, value: null });
+      return;
+    }
+    clearDebounce();
+    pendingValueRef.current = control === "input" ? localValue : typeof value === "string" ? value : null;
+    emit({ operator: op });
+  };
+  react.useEffect(() => {
+    if (control !== "input") return;
+    const incoming = value != null ? value : "";
+    const pending = pendingValueRef.current;
+    if (pending !== null) {
+      if (incoming === pending) {
+        pendingValueRef.current = null;
+      }
+      return;
+    }
+    if (incoming !== localValue) {
+      setLocalValue(incoming);
+    }
+  }, [value, control, localValue]);
+  react.useEffect(() => {
+    return () => {
+      clearDebounce();
+    };
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref: filterFieldRef,
+      ...dataCy ? { "data-cy": dataCy } : {},
+      className: [styles__default.default.filterField, styles__default.default[size], styles__default.default[variant], active ? styles__default.default.active : ""].filter(Boolean).join(" "),
+      children: [
+        label ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${styles__default.default.label} ${styles__default.default[size]}`, children: label }) : null,
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles__default.default.operatorWrapper, children: /* @__PURE__ */ jsxRuntime.jsx(
+          OperatorDropdown,
+          {
+            value: selectedOperator,
+            onChange: handleOperatorChange,
+            operators: ops,
+            size,
+            disabled
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: [
+              styles__default.default.valueWrapper,
+              control === "input" ? "dbc-flex dbc-flex-grow" : "",
+              shouldAutoFitTypeahead ? styles__default.default.autoWidth : ""
+            ].filter(Boolean).join(" "),
+            style: shouldAutoFitTypeahead ? maxWidth ? { maxWidth } : void 0 : { width, maxWidth },
+            children: control === "input" ? /* @__PURE__ */ jsxRuntime.jsx(
+              Input.Input,
+              {
+                variant: "embedded",
+                ...inputProps,
+                fieldClassName: styles__default.default.embeddedInputField,
+                inputClassName: styles__default.default.embeddedInputElement,
+                value: localValue,
+                onChange: (e) => {
+                  const next = e.currentTarget.value;
+                  setLocalValue(next);
+                  scheduleEmitValue(next);
+                },
+                onBlur: () => {
+                  flushPendingValue();
+                },
+                fullWidth: true,
+                inputSize: size,
+                placeholder,
+                disabled,
+                autoComplete: (_a = inputProps.autoComplete) != null ? _a : "off",
+                autoCorrect: (_b = inputProps.autoCorrect) != null ? _b : "off",
+                autoCapitalize: (_c = inputProps.autoCapitalize) != null ? _c : "none",
+                spellCheck: (_d = inputProps.spellCheck) != null ? _d : false,
+                onClear: () => {
+                  clearDebounce();
+                  pendingValueRef.current = "";
+                  setLocalValue("");
+                  emit({ value: "" });
+                }
+              }
+            ) : /* @__PURE__ */ jsxRuntime.jsx(
+              Typeahead.Typeahead,
+              {
+                options,
+                mode: single ? "single" : "multi",
+                selectedValue: single ? value != null ? value : null : Array.isArray(value) ? value : [],
+                onChange: (v) => emit({ value: v }),
+                minWidth,
+                popoverWidth,
+                popoverAnchorRef: filterFieldRef,
+                placeholder,
+                variant: "embedded",
+                inputProps: {
+                  inputSize: size,
+                  fieldClassName: styles__default.default.embeddedInputField,
+                  inputClassName: styles__default.default.embeddedInputElement
+                },
+                onClear: () => emit({ value: single ? "" : [] }),
+                disabled,
+                fullWidth: !shouldAutoFitTypeahead,
+                fitContent: shouldAutoFitTypeahead
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+
+exports.FilterField = FilterField;
+exports.NUMBER_OPERATORS = NUMBER_OPERATORS;