@trsys-tech/matrix-library 1.1.6 → 1.1.7

package/dist/datatablecolumnheader.es.js

@@ -0,0 +1,81 @@
+import { jsxs as h, jsx as y } from "react/jsx-runtime";
+import * as a from "react";
+import { useDragDropMonitor as R, useDraggable as T, useDroppable as E } from "@dnd-kit/react";
+import { cn as k } from "./utils.es.js";
+function j({
+  columnId: t,
+  label: l,
+  region: g,
+  disabled: e,
+  className: d,
+  children: x,
+  onClickCapture: b,
+  ...v
+}) {
+  const c = `data-table-column:${g || "center"}`, n = a.useId(), o = a.useRef(!1), i = a.useRef();
+  a.useEffect(() => () => clearTimeout(i.current), []), R({
+    onDragStart: (r) => {
+      r.operation.source?.data.columnId === t && r.nativeEvent?.type.startsWith("pointer") && (clearTimeout(i.current), o.current = !0);
+    },
+    onDragEnd: (r) => {
+      r.operation.source?.data.columnId === t && o.current && (i.current = setTimeout(() => {
+        o.current = !1;
+      }, 300));
+    }
+  });
+  const {
+    ref: s,
+    handleRef: u,
+    isDragSource: p
+  } = T({
+    id: `column:${t}`,
+    type: c,
+    data: { columnId: t },
+    disabled: e
+  }), { ref: m, isDropTarget: f } = E({
+    id: `column:${t}`,
+    accept: c,
+    data: { columnId: t },
+    disabled: e
+  }), D = a.useCallback(
+    (r) => {
+      s(r), m(r), u(r);
+    },
+    [s, m, u]
+  );
+  return /* @__PURE__ */ h(
+    "div",
+    {
+      ...v,
+      ref: D,
+      role: "columnheader",
+      tabIndex: e ? void 0 : 0,
+      "aria-label": l,
+      "aria-describedby": e ? void 0 : n,
+      "data-column-id": t,
+      "data-dragging": p || void 0,
+      "data-drop-target": f || void 0,
+      className: k(
+        d,
+        !e && "mtx-cursor-grab mtx-touch-pan-y active:mtx-cursor-grabbing focus-visible:mtx-outline-none focus-visible:mtx-ring-1 focus-visible:mtx-ring-inset focus-visible:mtx-ring-primary",
+        p && "mtx-opacity-50",
+        f && "mtx-ring-2 mtx-ring-inset mtx-ring-primary-300"
+      ),
+      onClickCapture: (r) => {
+        if (o.current) {
+          o.current = !1, clearTimeout(i.current), r.preventDefault(), r.stopPropagation();
+          return;
+        }
+        b?.(r);
+      },
+      children: [
+        !e && /* @__PURE__ */ y("span", { id: n, className: "mtx-sr-only", children: "Drag to reorder. With this header focused, press Space or Enter to pick up, Left or Right to move, Space or Enter to drop, or Escape to cancel." }),
+        x
+      ]
+    }
+  );
+}
+export {
+  j as DataTableColumnHeader
+};
+//# sourceMappingURL=datatablecolumnheader.es.js.map

package/dist/datatablecolumnheader.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datatablecolumnheader.es.js","sources":["../src/components/data-table/DataTableColumnHeader.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { useDraggable, useDroppable, useDragDropMonitor } from \"@dnd-kit/react\";\n\nimport { cn } from \"../../lib/utils\";\n\ntype DataTableColumnHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n  columnId: string;\n  label: string;\n  region: \"start\" | \"end\" | false;\n  disabled: boolean;\n};\n\n/** The header is the drag surface; menus and resizing opt out through the sensor. */\nexport function DataTableColumnHeader({\n  columnId,\n  label,\n  region,\n  disabled,\n  className,\n  children,\n  onClickCapture,\n  ...props\n}: DataTableColumnHeaderProps) {\n  const type = `data-table-column:${region || \"center\"}`;\n  const instructionsId = React.useId();\n  const suppressClick = React.useRef(false);\n  const clickTimer = React.useRef<ReturnType<typeof setTimeout>>();\n  React.useEffect(() => () => clearTimeout(clickTimer.current), []);\n  useDragDropMonitor({\n    onDragStart: event => {\n      if (event.operation.source?.data.columnId === columnId && event.nativeEvent?.type.startsWith(\"pointer\")) {\n        clearTimeout(clickTimer.current);\n        suppressClick.current = true;\n      }\n    },\n    onDragEnd: event => {\n      if (event.operation.source?.data.columnId === columnId && suppressClick.current) {\n        clickTimer.current = setTimeout(() => {\n          suppressClick.current = false;\n        }, 300);\n      }\n    },\n  });\n  const {\n    ref: sourceRef,\n    handleRef,\n    isDragSource,\n  } = useDraggable({\n    id: `column:${columnId}`,\n    type,\n    data: { columnId },\n    disabled,\n  });\n  const { ref: targetRef, isDropTarget } = useDroppable({\n    id: `column:${columnId}`,\n    accept: type,\n    data: { columnId },\n    disabled,\n  });\n  const ref = React.useCallback(\n    (element: HTMLDivElement | null) => {\n      sourceRef(element);\n      targetRef(element);\n      handleRef(element);\n    },\n    [sourceRef, targetRef, handleRef],\n  );\n  return (\n    <div\n      {...props}\n      ref={ref}\n      role=\"columnheader\"\n      tabIndex={disabled ? undefined : 0}\n      aria-label={label}\n      aria-describedby={disabled ? undefined : instructionsId}\n      data-column-id={columnId}\n      data-dragging={isDragSource || undefined}\n      data-drop-target={isDropTarget || undefined}\n      className={cn(\n        className,\n        !disabled &&\n          \"mtx-cursor-grab mtx-touch-pan-y active:mtx-cursor-grabbing focus-visible:mtx-outline-none focus-visible:mtx-ring-1 focus-visible:mtx-ring-inset focus-visible:mtx-ring-primary\",\n        isDragSource && \"mtx-opacity-50\",\n        isDropTarget && \"mtx-ring-2 mtx-ring-inset mtx-ring-primary-300\",\n      )}\n      onClickCapture={event => {\n        if (suppressClick.current) {\n          suppressClick.current = false;\n          clearTimeout(clickTimer.current);\n          event.preventDefault();\n          event.stopPropagation();\n          return;\n        }\n        onClickCapture?.(event);\n      }}\n    >\n      {!disabled && (\n        <span id={instructionsId} className=\"mtx-sr-only\">\n          Drag to reorder. With this header focused, press Space or Enter to pick up, Left or Right to move, Space or Enter to drop, or Escape to\n          cancel.\n        </span>\n      )}\n      {children}\n    </div>\n  );\n}\n"],"names":["DataTableColumnHeader","columnId","label","region","disabled","className","children","onClickCapture","props","type","instructionsId","React","suppressClick","clickTimer","useDragDropMonitor","event","sourceRef","handleRef","isDragSource","useDraggable","targetRef","isDropTarget","useDroppable","ref","element","jsxs","cn","jsx"],"mappings":";;;;AAeO,SAASA,EAAsB;AAAA,EACpC,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,GAAGC;AACL,GAA+B;AAC7B,QAAMC,IAAO,qBAAqBN,KAAU,QAAQ,IAC9CO,IAAiBC,EAAM,MAAA,GACvBC,IAAgBD,EAAM,OAAO,EAAK,GAClCE,IAAaF,EAAM,OAAA;AACzB,EAAAA,EAAM,UAAU,MAAM,MAAM,aAAaE,EAAW,OAAO,GAAG,EAAE,GAChEC,EAAmB;AAAA,IACjB,aAAa,CAAAC,MAAS;AACpB,MAAIA,EAAM,UAAU,QAAQ,KAAK,aAAad,KAAYc,EAAM,aAAa,KAAK,WAAW,SAAS,MACpG,aAAaF,EAAW,OAAO,GAC/BD,EAAc,UAAU;AAAA,IAE5B;AAAA,IACA,WAAW,CAAAG,MAAS;AAClB,MAAIA,EAAM,UAAU,QAAQ,KAAK,aAAad,KAAYW,EAAc,YACtEC,EAAW,UAAU,WAAW,MAAM;AACpC,QAAAD,EAAc,UAAU;AAAA,MAC1B,GAAG,GAAG;AAAA,IAEV;AAAA,EAAA,CACD;AACD,QAAM;AAAA,IACJ,KAAKI;AAAA,IACL,WAAAC;AAAA,IACA,cAAAC;AAAA,EAAA,IACEC,EAAa;AAAA,IACf,IAAI,UAAUlB,CAAQ;AAAA,IACtB,MAAAQ;AAAA,IACA,MAAM,EAAE,UAAAR,EAAA;AAAA,IACR,UAAAG;AAAA,EAAA,CACD,GACK,EAAE,KAAKgB,GAAW,cAAAC,EAAA,IAAiBC,EAAa;AAAA,IACpD,IAAI,UAAUrB,CAAQ;AAAA,IACtB,QAAQQ;AAAA,IACR,MAAM,EAAE,UAAAR,EAAA;AAAA,IACR,UAAAG;AAAA,EAAA,CACD,GACKmB,IAAMZ,EAAM;AAAA,IAChB,CAACa,MAAmC;AAClC,MAAAR,EAAUQ,CAAO,GACjBJ,EAAUI,CAAO,GACjBP,EAAUO,CAAO;AAAA,IACnB;AAAA,IACA,CAACR,GAAWI,GAAWH,CAAS;AAAA,EAAA;AAElC,SACE,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGjB;AAAA,MACJ,KAAAe;AAAA,MACA,MAAK;AAAA,MACL,UAAUnB,IAAW,SAAY;AAAA,MACjC,cAAYF;AAAA,MACZ,oBAAkBE,IAAW,SAAYM;AAAA,MACzC,kBAAgBT;AAAA,MAChB,iBAAeiB,KAAgB;AAAA,MAC/B,oBAAkBG,KAAgB;AAAA,MAClC,WAAWK;AAAA,QACTrB;AAAA,QACA,CAACD,KACC;AAAA,QACFc,KAAgB;AAAA,QAChBG,KAAgB;AAAA,MAAA;AAAA,MAElB,gBAAgB,CAAAN,MAAS;AACvB,YAAIH,EAAc,SAAS;AACzB,UAAAA,EAAc,UAAU,IACxB,aAAaC,EAAW,OAAO,GAC/BE,EAAM,eAAA,GACNA,EAAM,gBAAA;AACN;AAAA,QACF;AACA,QAAAR,IAAiBQ,CAAK;AAAA,MACxB;AAAA,MAEC,UAAA;AAAA,QAAA,CAACX,KACA,gBAAAuB,EAAC,QAAA,EAAK,IAAIjB,GAAgB,WAAU,eAAc,UAAA,mJAGlD;AAAA,QAEDJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/datatablecolumnmenu.es.js

@@ -0,0 +1,191 @@
+import { jsxs as r, jsx as a, Fragment as g } from "react/jsx-runtime";
+import * as d from "react";
+import { Filter as q } from "@trsys-tech/matrix-icons";
+import { cn as N } from "./utils.es.js";
+import { Button as i } from "./button.es.js";
+import { Popover as T, PopoverTrigger as F, PopoverContent as w } from "./popover.es.js";
+import { filterType as b } from "./datatablemodel.es.js";
+import { dataTableInputClass as c } from "./datatablestyles.es.js";
+function V({
+  table: f,
+  column: l,
+  definition: o
+}) {
+  const [h, s] = d.useState(!1), [t, p] = d.useState({ operator: b(o) === "text" ? "contains" : "equals", value: "" }), n = b(o), v = f.getCoreRowModel().rows, x = d.useMemo(
+    () => h && n === "select" ? o.filterOptions?.map((e) => typeof e == "string" ? { value: e, label: e } : e) ?? Array.from(
+      new Set(
+        v.map((e) => e.getValue(l.id)).filter((e) => e != null && e !== "").map(String)
+      )
+    ).sort().map((e) => ({ value: e, label: e })) : [],
+    [h, n, v, l.id, o.filterOptions]
+  ), C = n === "text" ? ["contains", "notContains", "equals", "notEqual", "startsWith", "endsWith", "blank", "notBlank"] : n === "select" ? ["equals", "notEqual", "blank", "notBlank"] : ["equals", "notEqual", "greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual", "inRange", "blank", "notBlank"], k = {
+    contains: "Contains",
+    notContains: "Does not contain",
+    equals: "Equals",
+    notEqual: "Does not equal",
+    startsWith: "Starts with",
+    endsWith: "Ends with",
+    greaterThan: "Greater than",
+    greaterThanOrEqual: "Greater than or equal",
+    lessThan: "Less than",
+    lessThanOrEqual: "Less than or equal",
+    inRange: "Between",
+    blank: "Blank",
+    notBlank: "Not blank"
+  }, u = l.getCanPin(), m = l.getCanHide();
+  return !l.getCanFilter() && !u && !m ? null : /* @__PURE__ */ r(
+    T,
+    {
+      open: h,
+      onOpenChange: (e) => {
+        e && p(l.getFilterValue() ?? { operator: n === "text" ? "contains" : "equals", value: "" }), s(e);
+      },
+      children: [
+        /* @__PURE__ */ a(F, { asChild: !0, children: /* @__PURE__ */ a(
+          "button",
+          {
+            type: "button",
+            "aria-label": `Column options ${l.id}`,
+            className: N("mtx-shrink-0 mtx-rounded-sm mtx-p-0.5 hover:mtx-bg-primary-100/80", l.getIsFiltered() && "mtx-text-primary"),
+            children: /* @__PURE__ */ a(q, { className: "mtx-h-4.5 mtx-w-4.5" })
+          }
+        ) }),
+        /* @__PURE__ */ r(w, { align: "end", className: "mtx-w-56 mtx-space-y-2 mtx-text-xs mtx-font-normal", children: [
+          l.getCanFilter() && /* @__PURE__ */ r(g, { children: [
+            /* @__PURE__ */ r("label", { className: "mtx-block", children: [
+              "Filter ",
+              typeof o.headerName == "string" ? o.headerName : l.id,
+              /* @__PURE__ */ a(
+                "select",
+                {
+                  "aria-label": "Filter operator",
+                  className: c,
+                  value: t.operator,
+                  onChange: (e) => p({ ...t, operator: e.target.value }),
+                  children: C.map((e) => /* @__PURE__ */ a("option", { value: e, children: k[e] }, e))
+                }
+              )
+            ] }),
+            t.operator !== "blank" && t.operator !== "notBlank" && (n === "select" ? /* @__PURE__ */ r(
+              "select",
+              {
+                "aria-label": "Filter value",
+                className: c,
+                value: t.value ?? "",
+                onChange: (e) => p({ ...t, value: e.target.value }),
+                children: [
+                  /* @__PURE__ */ a("option", { value: "", children: "All" }),
+                  t.value && !x.some((e) => e.value === t.value) && /* @__PURE__ */ a("option", { value: t.value, children: t.value }),
+                  x.map(({ value: e, label: y }) => /* @__PURE__ */ a("option", { value: e, children: y }, e))
+                ]
+              }
+            ) : /* @__PURE__ */ a(
+              "input",
+              {
+                "aria-label": "Filter value",
+                className: c,
+                type: n === "text" ? "text" : n,
+                value: t.value ?? "",
+                onChange: (e) => p({ ...t, value: e.target.value })
+              }
+            )),
+            n !== "select" && t.operator === "inRange" && /* @__PURE__ */ a(
+              "input",
+              {
+                "aria-label": "Filter upper value",
+                className: c,
+                type: n === "text" ? "text" : n,
+                value: t.valueTo ?? "",
+                onChange: (e) => p({ ...t, valueTo: e.target.value })
+              }
+            ),
+            /* @__PURE__ */ r("div", { className: "mtx-flex mtx-gap-2", children: [
+              /* @__PURE__ */ a(
+                i,
+                {
+                  type: "button",
+                  size: "sm",
+                  onClick: () => {
+                    l.setFilterValue(
+                      n === "select" && !t.value && t.operator !== "blank" && t.operator !== "notBlank" ? void 0 : t
+                    ), s(!1);
+                  },
+                  children: "Apply"
+                }
+              ),
+              /* @__PURE__ */ a(
+                i,
+                {
+                  type: "button",
+                  size: "sm",
+                  variant: "text",
+                  onClick: () => {
+                    l.setFilterValue(void 0), s(!1);
+                  },
+                  children: "Reset"
+                }
+              )
+            ] }),
+            (u || m) && /* @__PURE__ */ a("hr", { className: "mtx-border-gray-200" })
+          ] }),
+          (u || m) && /* @__PURE__ */ r("div", { className: "mtx-flex mtx-flex-wrap mtx-gap-1", children: [
+            u && /* @__PURE__ */ r(g, { children: [
+              /* @__PURE__ */ a(
+                i,
+                {
+                  type: "button",
+                  size: "sm",
+                  variant: "text",
+                  onClick: () => {
+                    l.pin("start"), s(!1);
+                  },
+                  children: "Pin start"
+                }
+              ),
+              /* @__PURE__ */ a(
+                i,
+                {
+                  type: "button",
+                  size: "sm",
+                  variant: "text",
+                  onClick: () => {
+                    l.pin("end"), s(!1);
+                  },
+                  children: "Pin end"
+                }
+              ),
+              /* @__PURE__ */ a(
+                i,
+                {
+                  type: "button",
+                  size: "sm",
+                  variant: "text",
+                  onClick: () => {
+                    l.pin(!1), s(!1);
+                  },
+                  children: "Unpin"
+                }
+              )
+            ] }),
+            m && /* @__PURE__ */ a(
+              i,
+              {
+                type: "button",
+                size: "sm",
+                variant: "text",
+                onClick: () => {
+                  l.toggleVisibility(!1), s(!1);
+                },
+                children: "Hide column"
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  V as DataTableColumnMenu
+};
+//# sourceMappingURL=datatablecolumnmenu.es.js.map

package/dist/datatablecolumnmenu.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datatablecolumnmenu.es.js","sources":["../src/components/data-table/DataTableColumnMenu.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport type { Column } from \"@tanstack/react-table\";\nimport { Filter } from \"@trsys-tech/matrix-icons\";\nimport { cn } from \"../../lib/utils\";\nimport { Button } from \"../button/Button\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover/Popover\";\nimport { filterType } from \"./dataTableModel\";\nimport { dataTableInputClass } from \"./dataTableStyles\";\nimport type { DataTableInstance, DataTableFeatures, DataTableColumn, DataTableFilter, DataTableFilterOperator } from \"./DataTable.types\";\n\nexport function DataTableColumnMenu<T extends object>({\n  table,\n  column,\n  definition,\n}: {\n  table: DataTableInstance<T>;\n  column: Column<DataTableFeatures, T>;\n  definition: DataTableColumn<T>;\n}) {\n  const [open, setOpen] = React.useState(false);\n  const [draft, setDraft] = React.useState<DataTableFilter>({ operator: filterType(definition) === \"text\" ? \"contains\" : \"equals\", value: \"\" });\n  const type = filterType(definition);\n  const coreRows = table.getCoreRowModel().rows;\n  const selectOptions = React.useMemo(\n    () =>\n      open && type === \"select\"\n        ? (definition.filterOptions?.map(option => (typeof option === \"string\" ? { value: option, label: option } : option)) ??\n          Array.from(\n            new Set(\n              coreRows\n                .map(row => row.getValue(column.id))\n                .filter(value => value !== null && value !== undefined && value !== \"\")\n                .map(String),\n            ),\n          )\n            .sort()\n            .map(value => ({ value, label: value })))\n        : [],\n    [open, type, coreRows, column.id, definition.filterOptions],\n  );\n  const operators: DataTableFilterOperator[] =\n    type === \"text\"\n      ? [\"contains\", \"notContains\", \"equals\", \"notEqual\", \"startsWith\", \"endsWith\", \"blank\", \"notBlank\"]\n      : type === \"select\"\n        ? [\"equals\", \"notEqual\", \"blank\", \"notBlank\"]\n        : [\"equals\", \"notEqual\", \"greaterThan\", \"greaterThanOrEqual\", \"lessThan\", \"lessThanOrEqual\", \"inRange\", \"blank\", \"notBlank\"];\n  const labels: Record<DataTableFilterOperator, string> = {\n    contains: \"Contains\",\n    notContains: \"Does not contain\",\n    equals: \"Equals\",\n    notEqual: \"Does not equal\",\n    startsWith: \"Starts with\",\n    endsWith: \"Ends with\",\n    greaterThan: \"Greater than\",\n    greaterThanOrEqual: \"Greater than or equal\",\n    lessThan: \"Less than\",\n    lessThanOrEqual: \"Less than or equal\",\n    inRange: \"Between\",\n    blank: \"Blank\",\n    notBlank: \"Not blank\",\n  };\n  const canPin = column.getCanPin();\n  const canHide = column.getCanHide();\n  if (!column.getCanFilter() && !canPin && !canHide) return null;\n\n  return (\n    <Popover\n      open={open}\n      onOpenChange={next => {\n        if (next) setDraft((column.getFilterValue() as DataTableFilter) ?? { operator: type === \"text\" ? \"contains\" : \"equals\", value: \"\" });\n        setOpen(next);\n      }}\n    >\n      <PopoverTrigger asChild>\n        <button\n          type=\"button\"\n          aria-label={`Column options ${column.id}`}\n          className={cn(\"mtx-shrink-0 mtx-rounded-sm mtx-p-0.5 hover:mtx-bg-primary-100/80\", column.getIsFiltered() && \"mtx-text-primary\")}\n        >\n          <Filter className=\"mtx-h-4.5 mtx-w-4.5\" />\n        </button>\n      </PopoverTrigger>\n      <PopoverContent align=\"end\" className=\"mtx-w-56 mtx-space-y-2 mtx-text-xs mtx-font-normal\">\n        {column.getCanFilter() && (\n          <>\n            <label className=\"mtx-block\">\n              Filter {typeof definition.headerName === \"string\" ? definition.headerName : column.id}\n              <select\n                aria-label=\"Filter operator\"\n                className={dataTableInputClass}\n                value={draft.operator}\n                onChange={event => setDraft({ ...draft, operator: event.target.value as DataTableFilterOperator })}\n              >\n                {operators.map(operator => (\n                  <option key={operator} value={operator}>\n                    {labels[operator]}\n                  </option>\n                ))}\n              </select>\n            </label>\n            {draft.operator !== \"blank\" &&\n              draft.operator !== \"notBlank\" &&\n              (type === \"select\" ? (\n                <select\n                  aria-label=\"Filter value\"\n                  className={dataTableInputClass}\n                  value={draft.value ?? \"\"}\n                  onChange={event => setDraft({ ...draft, value: event.target.value })}\n                >\n                  <option value=\"\">All</option>\n                  {draft.value && !selectOptions.some(option => option.value === draft.value) && <option value={draft.value}>{draft.value}</option>}\n                  {selectOptions.map(({ value, label }) => (\n                    <option key={value} value={value}>\n                      {label}\n                    </option>\n                  ))}\n                </select>\n              ) : (\n                <input\n                  aria-label=\"Filter value\"\n                  className={dataTableInputClass}\n                  type={type === \"text\" ? \"text\" : type}\n                  value={draft.value ?? \"\"}\n                  onChange={event => setDraft({ ...draft, value: event.target.value })}\n                />\n              ))}\n            {type !== \"select\" && draft.operator === \"inRange\" && (\n              <input\n                aria-label=\"Filter upper value\"\n                className={dataTableInputClass}\n                type={type === \"text\" ? \"text\" : type}\n                value={draft.valueTo ?? \"\"}\n                onChange={event => setDraft({ ...draft, valueTo: event.target.value })}\n              />\n            )}\n            <div className=\"mtx-flex mtx-gap-2\">\n              <Button\n                type=\"button\"\n                size=\"sm\"\n                onClick={() => {\n                  column.setFilterValue(\n                    type === \"select\" && !draft.value && draft.operator !== \"blank\" && draft.operator !== \"notBlank\" ? undefined : draft,\n                  );\n                  setOpen(false);\n                }}\n              >\n                Apply\n              </Button>\n              <Button\n                type=\"button\"\n                size=\"sm\"\n                variant=\"text\"\n                onClick={() => {\n                  column.setFilterValue(undefined);\n                  setOpen(false);\n                }}\n              >\n                Reset\n              </Button>\n            </div>\n            {(canPin || canHide) && <hr className=\"mtx-border-gray-200\" />}\n          </>\n        )}\n        {(canPin || canHide) && (\n          <div className=\"mtx-flex mtx-flex-wrap mtx-gap-1\">\n            {canPin && (\n              <>\n                <Button\n                  type=\"button\"\n                  size=\"sm\"\n                  variant=\"text\"\n                  onClick={() => {\n                    column.pin(\"start\");\n                    setOpen(false);\n                  }}\n                >\n                  Pin start\n                </Button>\n                <Button\n                  type=\"button\"\n                  size=\"sm\"\n                  variant=\"text\"\n                  onClick={() => {\n                    column.pin(\"end\");\n                    setOpen(false);\n                  }}\n                >\n                  Pin end\n                </Button>\n                <Button\n                  type=\"button\"\n                  size=\"sm\"\n                  variant=\"text\"\n                  onClick={() => {\n                    column.pin(false);\n                    setOpen(false);\n                  }}\n                >\n                  Unpin\n                </Button>\n              </>\n            )}\n            {canHide && (\n              <Button\n                type=\"button\"\n                size=\"sm\"\n                variant=\"text\"\n                onClick={() => {\n                  column.toggleVisibility(false);\n                  setOpen(false);\n                }}\n              >\n                Hide column\n              </Button>\n            )}\n          </div>\n        )}\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"names":["DataTableColumnMenu","table","column","definition","open","setOpen","React","draft","setDraft","filterType","type","coreRows","selectOptions","option","row","value","operators","labels","canPin","canHide","jsxs","Popover","next","jsx","PopoverTrigger","cn","Filter","PopoverContent","Fragment","dataTableInputClass","event","operator","label","Button"],"mappings":"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"}