@webitel/ui-sdk 26.8.93 → 26.8.95

package/types/components/wt-table/_internals/wt-table-column-filter.vue.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Column header filter icon: popover content from the default slot (scope `hide`); while
+ * `active`, hovering shows the `preview` slot in a second popover instead.
+ * `data-pc-section="columnfilterbutton"` stops PrimeVue sorting on click here while still
+ * bubbling to `document` (closes other popovers); `@mousedown.stop` blocks column drag.
+ *
+ * [WTEL-7727](https://webitel.atlassian.net/browse/WTEL-7727)
+ */
+type __VLS_Props = {
+    /** Shows the badge on the icon (a filter is applied to this column) */
+    active?: boolean;
+};
+declare var __VLS_31: {}, __VLS_34: {
+    hide: (event?: Event) => void;
+};
+type __VLS_Slots = {} & {
+    preview?: (props: typeof __VLS_31) => any;
+} & {
+    default?: (props: typeof __VLS_34) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/types/components/wt-table/types/WtTable.d.ts

@@ -17,6 +17,20 @@ export type WtTableHeader = {
     show?: boolean;
     /** `false` excludes the column from drag-to-reorder and pins it to the start */
     reorderable?: boolean;
+    /**
+     * Name of the filter shown in the column header popover (`column-filter` slot).
+     * Set only on columns that have a header filter.
+     *
+     * [WTEL-7727](https://webitel.atlassian.net/browse/WTEL-7727)
+     */
+    filter?: string;
+    /**
+     * Shows the badge on the filter icon. Set by whoever owns `headers` (mirrors `sort`: read
+     * here, written by the caller), not derived from a separate table-wide prop.
+     *
+     * [WTEL-7727](https://webitel.atlassian.net/browse/WTEL-7727)
+     */
+    filtered?: boolean;
 };
 /** TODO(types): every cell is read through a header-driven runtime `field` key. */
 export type WtTableRow = any;

package/types/components/wt-table/wt-table.vue.d.ts

@@ -66,32 +66,45 @@ interface Props extends DataTableProps {
     loading?: boolean;
     itemSize?: number | undefined;
 }
-declare var __VLS_71: `header-${string}`, __VLS_72: {
+declare var __VLS_1: {}, __VLS_73: `header-${string}`, __VLS_74: {
     index: number;
     header: WtTableHeader;
-}, __VLS_86: string, __VLS_87: {
+}, __VLS_93: {
+    header: WtTableHeader;
+    hide: (event?: Event) => void;
+    formView: boolean;
+}, __VLS_96: {
+    header: WtTableHeader;
+    formView: boolean;
+}, __VLS_100: string, __VLS_101: {
     index: any;
     item: any;
-}, __VLS_92: `${string}-footer`, __VLS_93: {}, __VLS_102: {}, __VLS_105: {
+}, __VLS_106: `${string}-footer`, __VLS_107: {}, __VLS_116: {}, __VLS_119: {
     index: any;
     item: any;
-}, __VLS_108: {
+}, __VLS_122: {
     item: any;
-}, __VLS_111: {};
+}, __VLS_125: {};
 type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_71>]?: (props: typeof __VLS_72) => any;
+    [K in NonNullable<typeof __VLS_73>]?: (props: typeof __VLS_74) => any;
+} & {
+    [K in NonNullable<typeof __VLS_100>]?: (props: typeof __VLS_101) => any;
+} & {
+    [K in NonNullable<typeof __VLS_106>]?: (props: typeof __VLS_107) => any;
+} & {
+    empty?: (props: typeof __VLS_1) => any;
 } & {
-    [K in NonNullable<typeof __VLS_86>]?: (props: typeof __VLS_87) => any;
+    'column-filter'?: (props: typeof __VLS_93) => any;
 } & {
-    [K in NonNullable<typeof __VLS_92>]?: (props: typeof __VLS_93) => any;
+    'column-filter'?: (props: typeof __VLS_96) => any;
 } & {
-    'actions-header'?: (props: typeof __VLS_102) => any;
+    'actions-header'?: (props: typeof __VLS_116) => any;
 } & {
-    actions?: (props: typeof __VLS_105) => any;
+    actions?: (props: typeof __VLS_119) => any;
 } & {
-    expansion?: (props: typeof __VLS_108) => any;
+    expansion?: (props: typeof __VLS_122) => any;
 } & {
-    footer?: (props: typeof __VLS_111) => any;
+    footer?: (props: typeof __VLS_125) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     sort: (...args: any[]) => void;

package/dist/wt-icon-btn-BzraLc-w.js

@@ -1,110 +0,0 @@
-import { t as e } from "./wt-icon-iRDqWkjp.js";
-import { t } from "./_plugin-vue_export-helper-B3ysoDQm.js";
-import { computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createVNode as s, defineComponent as c, guardReactiveProps as l, mergeModels as u, mergeProps as d, normalizeClass as f, normalizeProps as p, openBlock as m, renderSlot as h, resolveComponent as g, toDisplayString as _, useModel as v, useSlots as y, withCtx as b } from "vue";
-//#region src/components/wt-checkbox/wt-checkbox.vue?vue&type=script&setup=true&lang.ts
-var x = { class: "wt-checkbox" }, S = { class: "wt-checkbox__checkmark" }, C = {
-	key: 0,
-	class: "wt-checkbox__label"
-}, w = /*#__PURE__*/ t(/* @__PURE__ */ c({
-	__name: "wt-checkbox",
-	props: /*@__PURE__*/ u({
-		value: {
-			type: [String, Boolean],
-			default: ""
-		},
-		label: { default: "" },
-		disabled: {
-			type: Boolean,
-			default: !1
-		},
-		modelValue: {},
-		defaultValue: {},
-		name: {},
-		binary: { type: Boolean },
-		indeterminate: { type: Boolean },
-		size: {},
-		invalid: { type: Boolean },
-		variant: {},
-		readonly: { type: Boolean },
-		required: { type: Boolean },
-		tabindex: {},
-		trueValue: {},
-		falseValue: {},
-		inputId: {},
-		inputClass: {},
-		inputStyle: {},
-		ariaLabelledby: {},
-		ariaLabel: {},
-		formControl: {},
-		dt: {},
-		pt: {},
-		ptOptions: {},
-		unstyled: { type: Boolean }
-	}, {
-		selected: {
-			type: [Boolean, Array],
-			required: !0
-		},
-		selectedModifiers: {}
-	}),
-	emits: ["update:selected"],
-	setup(e) {
-		let t = e, c = v(e, "selected"), u = `checkbox-${Math.random().toString(36).slice(2, 11)}`, d = y(), f = n(() => t.label || d.label), w = n(() => !Array.isArray(c.value)), T = n(() => w.value ? c.value : Array.isArray(c.value) ? c.value.includes(String(t.value)) : !1), E = n(() => T.value ? "checkbox-tick" : ""), D = n(() => t.disabled ? "disabled" : T.value ? "active" : null);
-		return (t, n) => {
-			let d = g("wt-icon"), v = g("p-checkbox"), y = g("wt-label");
-			return m(), a("div", x, [s(v, {
-				modelValue: c.value,
-				"onUpdate:modelValue": n[0] ||= (e) => c.value = e,
-				binary: w.value,
-				disabled: e.disabled,
-				"input-id": u,
-				value: e.value
-			}, {
-				icon: b(() => [o("span", S, [s(d, {
-					color: D.value,
-					icon: E.value
-				}, null, 8, ["color", "icon"])])]),
-				_: 1
-			}, 8, [
-				"modelValue",
-				"binary",
-				"disabled",
-				"value"
-			]), f.value ? (m(), r(y, {
-				key: 0,
-				disabled: e.disabled
-			}, {
-				default: b(() => [h(t.$slots, "label", p(l({
-					label: e.label,
-					isChecked: T.value,
-					disabled: e.disabled
-				})), () => [e.label ? (m(), a("div", C, _(e.label), 1)) : i("", !0)], !0)], void 0, !0),
-				_: 3
-			}, 8, ["disabled"])) : i("", !0)]);
-		};
-	}
-}), [["__scopeId", "data-v-b8e46222"]]), T = /*#__PURE__*/ t(/* @__PURE__ */ c({
-	__name: "wt-icon-btn",
-	props: { disabled: {
-		type: Boolean,
-		default: !1
-	} },
-	emits: ["click", "mousedown"],
-	setup(t, { emit: n }) {
-		let r = n;
-		return (n, i) => (m(), a("button", {
-			class: f([{ "wt-icon-btn--disabled": t.disabled }, "wt-icon-btn"]),
-			type: "button",
-			onClick: i[0] ||= (e) => r("click", e),
-			onMousedown: i[1] ||= (e) => r("mousedown", e)
-		}, [s(e, d({
-			...n.$attrs,
-			class: ""
-		}, {
-			icon: String(n.$attrs.icon ?? ""),
-			disabled: t.disabled
-		}), null, 16, ["icon", "disabled"])], 34));
-	}
-}), [["__scopeId", "data-v-933e78e4"]]);
-//#endregion
-export { w as n, T as t };

package/dist/wt-table-C-DMIrud.js

@@ -1,377 +0,0 @@
-import { t as e } from "./_plugin-vue_export-helper-B3ysoDQm.js";
-import { t } from "./vue-i18n-B88GcHzn.js";
-import { n, t as r } from "./sortQueryAdapters-CyYXvnDN.js";
-import { t as i } from "./composables-OP5kSvlh.js";
-import { Fragment as a, computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createSlots as d, createTextVNode as f, createVNode as p, defineComponent as m, nextTick as h, normalizeStyle as g, onMounted as _, onUnmounted as v, openBlock as y, ref as b, renderList as ee, renderSlot as x, resolveComponent as S, resolveDirective as C, toDisplayString as w, useSlots as T, useTemplateRef as E, withCtx as D, withDirectives as O, withModifiers as k } from "vue";
-//#region src/components/wt-table/wt-table.vue?vue&type=script&setup=true&lang.ts
-var A = { class: "wt-table__th__content typo-body-1-bold" }, j = { class: "wt-table__td__actions" }, M = /*#__PURE__*/ e(/* @__PURE__ */ m({
-	__name: "wt-table",
-	props: {
-		headers: { default: () => [] },
-		data: { default: () => [] },
-		sortable: {
-			type: Boolean,
-			default: !1
-		},
-		selectable: {
-			type: Boolean,
-			default: !0
-		},
-		selected: {},
-		gridActions: {
-			type: Boolean,
-			default: !0
-		},
-		fixedActions: {
-			type: Boolean,
-			default: !1
-		},
-		headless: {
-			type: Boolean,
-			default: !1
-		},
-		stripedRows: {
-			type: Boolean,
-			default: !1
-		},
-		rowReorder: {
-			type: Boolean,
-			default: !1
-		},
-		dataKey: { default: "" },
-		isRowReorderDisabled: {
-			type: Function,
-			default: () => !1
-		},
-		rowExpansion: {
-			type: Boolean,
-			default: !1
-		},
-		rowClass: {
-			type: Function,
-			default: () => ""
-		},
-		rowStyle: {
-			type: Function,
-			default: () => ({})
-		},
-		resizableColumns: {
-			type: Boolean,
-			default: !1
-		},
-		reorderableColumns: {
-			type: Boolean,
-			default: !1
-		},
-		rowExpansionDisabled: {
-			type: Function,
-			default: () => !1
-		},
-		lazy: {
-			type: Boolean,
-			default: !1
-		},
-		onLoading: {},
-		loading: { type: Boolean },
-		itemSize: { default: 40 },
-		value: {},
-		rows: {},
-		first: {},
-		totalRecords: {},
-		paginator: { type: Boolean },
-		paginatorPosition: {},
-		alwaysShowPaginator: { type: Boolean },
-		paginatorTemplate: {},
-		pageLinkSize: {},
-		rowsPerPageOptions: {},
-		currentPageReportTemplate: {},
-		loadingIcon: {},
-		sortField: {},
-		sortOrder: {},
-		nullSortOrder: {},
-		defaultSortOrder: {},
-		multiSortMeta: {},
-		sortMode: {},
-		removableSort: { type: Boolean },
-		filters: {},
-		filterDisplay: {},
-		globalFilterFields: {},
-		filterLocale: {},
-		selection: {},
-		selectionMode: {},
-		compareSelectionBy: {},
-		metaKeySelection: { type: Boolean },
-		contextMenu: { type: Boolean },
-		contextMenuSelection: {},
-		selectAll: {},
-		rowHover: { type: Boolean },
-		csvSeparator: {},
-		exportFilename: {},
-		exportFunction: {},
-		columnResizeMode: {},
-		expandedRows: {},
-		expandedRowIcon: {},
-		collapsedRowIcon: {},
-		rowGroupMode: {},
-		groupRowsBy: {},
-		expandableRowGroups: { type: Boolean },
-		expandedRowGroups: {},
-		stateStorage: {},
-		stateKey: {},
-		editMode: {},
-		editingRows: {},
-		scrollable: { type: Boolean },
-		scrollHeight: {},
-		virtualScrollerOptions: {},
-		frozenValue: {},
-		breakpoint: {},
-		showHeaders: { type: Boolean },
-		showGridlines: { type: Boolean },
-		highlightOnSelect: { type: Boolean },
-		size: {},
-		tableStyle: {},
-		tableClass: {},
-		tableProps: {},
-		filterInputProps: {},
-		filterButtonProps: {},
-		editButtonProps: {},
-		dt: {},
-		pt: {},
-		ptOptions: {},
-		unstyled: { type: Boolean }
-	},
-	emits: [
-		"sort",
-		"update:selected",
-		"reorder:row",
-		"column-resize",
-		"column-reorder"
-	],
-	setup(e, { emit: m }) {
-		let M = e, { t: N } = t(), P = T(), F = m, I = ({ dragIndex: e, dropIndex: t }) => F("reorder:row", {
-			oldIndex: e,
-			newIndex: t
-		}), L = E("table"), R = b(0), z = b([]), { addTableDragListener: B, removeTableDragListener: V } = i(L, M.reorderableColumns), H = o(() => M.selectable ? M.selected || M.data.filter((e) => e._isSelected) : []), U = o(() => {
-			let e = M.headers.map((e) => !e.text && e.locale ? {
-				...e,
-				text: typeof e.locale == "string" ? N(e.locale) : N(...e.locale)
-			} : e), t = e.filter((e) => e.reorderable === !1), n = e.filter((e) => e.reorderable !== !1);
-			return [...t, ...n];
-		}), W = [
-			"row-select",
-			"row-reorder",
-			"row-actions",
-			"row-expander"
-		], G = o(() => [...U.value.filter((e) => e.reorderable === !1).map((e) => e.field || e.value), ...W]), K = (e) => e.show === !1, q = (e) => ({ minWidth: e.width || "140px" }), J = o(() => Object.keys(P).some((e) => e.includes("-footer"))), Y = o(() => Object.keys(P).some((e) => e === "footer")), X = o(() => H.value.length === M.data.length && M.data.length > 0), Z = o(() => M.headers.find((e) => e.sort === r.ASC || e.sort === r.DESC)?.field ?? null), Q = ({ sortField: e }) => {
-			let t = U.value.find((t) => t.field === e);
-			if (!t || !$(t)) return;
-			let r = n(t.sort);
-			F("sort", t, r);
-		}, $ = ({ sort: e }) => M.sortable && e !== void 0, te = () => {
-			M.selected ? X.value ? F("update:selected", []) : F("update:selected", [...M.data]) : X.value ? M.data.forEach((e) => {
-				e._isSelected = !1;
-			}) : M.data.forEach((e) => {
-				e._isSelected = !0;
-			});
-		}, ne = (e, t) => {
-			M.selected ? t ? F("update:selected", [...H.value, e]) : F("update:selected", H.value.filter((t) => t !== e)) : e._isSelected = !e._isSelected;
-		}, re = ({ element: e }) => {
-			let t = e.getAttribute("data-column-field"), n = getComputedStyle(e), r = Number.parseFloat(n.paddingLeft), i = Number.parseFloat(n.paddingRight), a = e.offsetWidth - r - i;
-			F("column-resize", {
-				columnName: t,
-				columnWidth: `${a}px`
-			});
-		}, ie = () => {
-			let e = L.value?.$el?.querySelector(".p-datatable-table-container")?.scrollLeft, t = L.value?.d_columnOrder.filter((e) => !G.value.includes(e));
-			R.value += 1, F("column-reorder", t), h(() => {
-				B();
-				let t = L.value?.$el?.querySelector(".p-datatable-table-container");
-				t && (t.scrollLeft = e);
-			});
-		}, ae = (e) => z.value.some((t) => t?.id === e?.id), oe = (e) => {
-			let t = z.value.findIndex((t) => t.id === e.id);
-			t === -1 ? z.value.push(e) : z.value.splice(t, 1);
-		}, se = o(() => {
-			if (M.lazy) return {
-				lazy: M.lazy,
-				onLazyLoad: M.onLoading,
-				itemSize: M.itemSize,
-				numToleratedItems: M.data.length,
-				totalRecords: M.data.length,
-				autoSize: !0
-			};
-		});
-		return _(() => {
-			B();
-		}), v(() => {
-			V();
-		}), (t, n) => {
-			let r = S("wt-icon-btn"), i = S("p-column"), o = S("wt-icon"), m = S("wt-checkbox"), h = S("p-table"), _ = C("tooltip");
-			return y(), s(h, {
-				key: R.value,
-				ref_key: "table",
-				ref: L,
-				"expanded-rows": z.value,
-				"reorderable-columns": e.reorderableColumns,
-				"resizable-columns": e.resizableColumns,
-				"row-class": e.rowClass,
-				"row-style": e.rowStyle,
-				"show-headers": !e.headless,
-				"striped-rows": e.stripedRows,
-				value: e.data,
-				"sort-field": Z.value,
-				"data-key": M.dataKey,
-				class: "wt-table",
-				"column-resize-mode": "expand",
-				lazy: "",
-				"scroll-height": "flex",
-				scrollable: "",
-				"virtual-scroller-options": se.value,
-				pt: { tableContainer: "wt-scrollbar" },
-				onSort: Q,
-				"onUpdate:expandedRows": n[0] ||= (e) => z.value = e,
-				onColumnResizeEnd: re,
-				onColumnReorder: ie,
-				onRowReorder: I
-			}, d({
-				expansion: D(({ data: e }) => [u("div", null, [x(t.$slots, "expansion", { item: e }, void 0, !0)])]),
-				default: D(() => [
-					e.rowExpansion ? (y(), s(i, {
-						key: 0,
-						pt: { columnresizer: { class: { hidden: !0 } } },
-						"reorderable-column": !1,
-						"body-style": "width: 1%;",
-						"column-key": "row-expander",
-						"header-style": "width: 1%;"
-					}, {
-						body: D(({ data: e }) => [p(r, {
-							disabled: M.rowExpansionDisabled(e),
-							icon: ae(e) ? "arrow-down" : "arrow-right",
-							onClick: k((t) => oe(e), ["stop"])
-						}, null, 8, [
-							"disabled",
-							"icon",
-							"onClick"
-						])]),
-						_: 1
-					})) : c("", !0),
-					e.rowReorder ? (y(), s(i, {
-						key: 1,
-						pt: { columnresizer: { class: { hidden: !0 } } },
-						"reorderable-column": !1,
-						"body-style": "width: 1%;",
-						"column-key": "row-reorder",
-						"header-style": "width: 1%;",
-						"row-reorder": ""
-					}, {
-						body: D(({ data: t }) => [e.isRowReorderDisabled(t) ? c("", !0) : (y(), s(o, {
-							key: 0,
-							"data-pc-section": "reorderablerowhandle",
-							icon: "move"
-						}))]),
-						_: 1
-					})) : c("", !0),
-					e.selectable ? (y(), s(i, {
-						key: 2,
-						pt: { columnresizer: { class: { hidden: !0 } } },
-						"reorderable-column": !1,
-						"body-style": "width: 1%;",
-						"column-key": "row-select",
-						"header-style": "width: 1%;"
-					}, {
-						header: D(() => [p(m, {
-							selected: X.value,
-							"onUpdate:selected": te
-						}, null, 8, ["selected"])]),
-						body: D(({ data: e }) => [e ? (y(), s(m, {
-							key: 0,
-							selected: H.value.includes(e),
-							"onUpdate:selected": (t) => ne(e, t)
-						}, null, 8, ["selected", "onUpdate:selected"])) : c("", !0)]),
-						_: 1
-					})) : c("", !0),
-					(y(!0), l(a, null, ee(U.value, (e, n) => (y(), s(i, {
-						key: e.value,
-						"column-key": e.field || e.value,
-						field: e.field,
-						"reorderable-column": e.reorderable !== !1,
-						hidden: K(e),
-						pt: { root: { "data-column-field": e.field } },
-						sortable: $(e)
-					}, d({
-						header: D(() => [x(t.$slots, `header-${e.value}`, {
-							index: n,
-							header: e
-						}, () => [u("div", A, [O((y(), l("span", null, [f(w(e.text), 1)])), [[_, e.text]]), e.sort === "asc" ? (y(), s(o, {
-							key: 0,
-							class: "wt-table__th__sort-arrow wt-table__th__sort-arrow--asc",
-							icon: "sort-arrow-up",
-							size: "sm"
-						})) : e.sort === "desc" ? (y(), s(o, {
-							key: 1,
-							class: "wt-table__th__sort-arrow wt-table__th__sort-arrow--desc",
-							icon: "sort-arrow-down",
-							size: "sm"
-						})) : c("", !0)])], !0)]),
-						body: D(({ data: n, index: r }) => [u("div", {
-							style: g(q(e)),
-							class: "wt-table__td__content typo-body-1"
-						}, [n ? x(t.$slots, e.value, {
-							key: 0,
-							index: r,
-							item: n
-						}, () => [f(w(n[e.value]), 1)], !0) : c("", !0)], 4)]),
-						sorticon: D(() => []),
-						_: 2
-					}, [J.value ? {
-						name: "footer",
-						fn: D(() => [x(t.$slots, `${e.value}-footer`, {}, void 0, !0)]),
-						key: "0"
-					} : void 0]), 1032, [
-						"column-key",
-						"field",
-						"reorderable-column",
-						"hidden",
-						"pt",
-						"sortable"
-					]))), 128)),
-					e.gridActions ? (y(), s(i, {
-						key: 3,
-						frozen: e.fixedActions,
-						"reorderable-column": !1,
-						"align-frozen": "right",
-						"column-key": "row-actions",
-						style: { width: "112px" }
-					}, {
-						header: D(() => [x(t.$slots, "actions-header", {}, void 0, !0)]),
-						body: D(({ data: e, index: n }) => [u("div", j, [e ? x(t.$slots, "actions", {
-							key: 0,
-							index: n,
-							item: e
-						}, void 0, !0) : c("", !0)])]),
-						_: 3
-					}, 8, ["frozen"])) : c("", !0)
-				], void 0, !0),
-				_: 2
-			}, [Y.value ? {
-				name: "footer",
-				fn: D(() => [x(t.$slots, "footer", {}, void 0, !0)]),
-				key: "0"
-			} : void 0]), 1032, [
-				"expanded-rows",
-				"reorderable-columns",
-				"resizable-columns",
-				"row-class",
-				"row-style",
-				"show-headers",
-				"striped-rows",
-				"value",
-				"sort-field",
-				"data-key",
-				"virtual-scroller-options"
-			]);
-		};
-	}
-}), [["__scopeId", "data-v-474acbb2"]]);
-//#endregion
-export { M as default };