@declarion/react 0.57.0 → 0.59.0

package/dist-lib/SortHeaderMenu-Cijxk4cX.js

@@ -0,0 +1,107 @@
+import { s as e } from "./DynamicIcon-DW5krHuX.js";
+import { Pn as t, rn as n } from "./useCurrentScreen-BL5NZFCw.js";
+import { t as r } from "./useText-BFDCTUSo.js";
+import { useRef as i, useState as a } from "react";
+import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/pages/list/SortHeaderMenu.tsx
+function l({ field: l, activeDir: u, activeNulls: d, inMultiSort: f, canAppend: p, onApply: m, onAppend: h, onClearColumn: g, onClearAll: _ }) {
+	let v = r(), y = i(null), [b, x] = a(!1), S = [
+		{
+			label: v("list.sort.asc_empty_last", "Sort ascending, empty last"),
+			dir: "asc",
+			nulls: "last",
+			icon: e.arrowUp
+		},
+		{
+			label: v("list.sort.asc_empty_first", "Sort ascending, empty first"),
+			dir: "asc",
+			nulls: "first",
+			icon: e.arrowUp
+		},
+		{
+			label: v("list.sort.desc_empty_last", "Sort descending, empty last"),
+			dir: "desc",
+			nulls: "last",
+			icon: e.arrowDown
+		},
+		{
+			label: v("list.sort.desc_empty_first", "Sort descending, empty first"),
+			dir: "desc",
+			nulls: "first",
+			icon: e.arrowDown
+		}
+	], C = d ?? "last", w = !f && p;
+	return /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s("button", {
+		ref: y,
+		type: "button",
+		"aria-label": v("list.sort.options_for", "Sort options for {field}", { field: l }),
+		title: v("list.sort.options_hint", "Sort options. Shift-click the header to add this column to multi-sort."),
+		onClick: (e) => {
+			e.stopPropagation(), x((e) => !e);
+		},
+		style: {
+			display: "inline-flex",
+			alignItems: "center",
+			justifyContent: "center",
+			width: 16,
+			height: 16,
+			padding: 0,
+			background: "transparent",
+			border: "none",
+			color: "var(--text-3)",
+			cursor: "pointer",
+			opacity: b ? 1 : .55
+		},
+		children: /* @__PURE__ */ s(e.cheveron, { size: 12 })
+	}), /* @__PURE__ */ c(t, {
+		open: b,
+		anchor: y.current,
+		onClose: () => x(!1),
+		align: "start",
+		width: 240,
+		children: [
+			S.map((t) => {
+				let r = u === t.dir && C === t.nulls, i = t.icon;
+				return /* @__PURE__ */ s(n, {
+					icon: /* @__PURE__ */ c("span", {
+						style: {
+							display: "inline-flex",
+							alignItems: "center",
+							gap: 2
+						},
+						children: [/* @__PURE__ */ s(i, { size: 11 }), r ? /* @__PURE__ */ s(e.check, { size: 11 }) : null]
+					}),
+					onClick: () => {
+						x(!1), m(t.dir, t.nulls);
+					},
+					children: t.label
+				}, `${t.dir}:${t.nulls}`);
+			}),
+			w ? /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s(n, { divider: !0 }), /* @__PURE__ */ s(n, {
+				icon: /* @__PURE__ */ s(e.plus, { size: 11 }),
+				onClick: () => {
+					x(!1), h("asc", d);
+				},
+				children: v("list.sort.append", "Add to multi-sort (Shift-click shortcut)")
+			})] }) : null,
+			/* @__PURE__ */ s(n, { divider: !0 }),
+			/* @__PURE__ */ s(n, {
+				disabled: u === !1,
+				onClick: () => {
+					x(!1), u !== !1 && g();
+				},
+				children: v("list.sort.clear_column", "Clear sort on this column")
+			}),
+			/* @__PURE__ */ s(n, { divider: !0 }),
+			/* @__PURE__ */ s(n, {
+				disabled: u === !1,
+				onClick: () => {
+					x(!1), _();
+				},
+				children: v("list.sort.clear_all", "Clear all sorts")
+			})
+		]
+	})] });
+}
+//#endregion
+export { l as SortHeaderMenu };