@milaboratories/uikit 2.10.37 → 2.10.39

package/dist/components/DataTable/ColumnsCommandMenu.vue2.js

@@ -1,5 +1,28 @@
-import f from "./ColumnsCommandMenu.vue.js";
-export {
-  f as default
-};
-//# sourceMappingURL=ColumnsCommandMenu.vue2.js.map
+import { injectState as e } from "./keys.js";
+import { Fragment as t, computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, defineComponent as o, openBlock as s, renderList as c, toDisplayString as l, withModifiers as u } from "vue";
+var d = {
+	key: 0,
+	class: "command-menu"
+}, f = { key: 0 }, p = ["onClick"], m = /* @__PURE__ */ o({
+	__name: "ColumnsCommandMenu",
+	setup(o) {
+		let m = e(), h = n(() => m.getSelectedColumns()), g = n(() => h.value.length > 0), _ = n(() => m.settings?.value.onSelectedColumns ?? []), v = n(() => _.value.map((e) => ({
+			label: e.label,
+			cb: () => {
+				e.cb(h.value), m.data.selectedColumns.clear();
+			}
+		})));
+		return (e, n) => g.value ? (s(), i("div", d, [
+			h.value.length ? (s(), i("span", f, "selected columns " + l(h.value.length), 1)) : r("", !0),
+			n[0] ||= a("hr", null, null, -1),
+			(s(!0), i(t, null, c(v.value, (e, t) => (s(), i("span", {
+				key: t,
+				class: "command",
+				onClick: u(e.cb, ["stop"])
+			}, l(e.label), 9, p))), 128))
+		])) : r("", !0);
+	}
+});
+export { m as default };
+
+//# sourceMappingURL=ColumnsCommandMenu.vue2.js.map

package/dist/components/DataTable/ColumnsCommandMenu.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnsCommandMenu.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"ColumnsCommandMenu.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/DataTable/ColumnsCommandMenu.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from \"vue\";\nimport { injectState } from \"./keys\";\n\nconst state = injectState();\n\nconst selectedColumns = computed(() => state.getSelectedColumns());\n\nconst isVisible = computed(() => selectedColumns.value.length > 0);\n\nconst ops = computed(() => state.settings?.value.onSelectedColumns ?? []);\n\nconst actions = computed(() =>\n  ops.value.map((op) => ({\n    label: op.label,\n    cb: () => {\n      op.cb(selectedColumns.value);\n      state.data.selectedColumns.clear();\n    },\n  })),\n);\n</script>\n\n<template>\n  <div v-if=\"isVisible\" class=\"command-menu\">\n    <span v-if=\"selectedColumns.length\">selected columns {{ selectedColumns.length }}</span>\n    <hr />\n    <span v-for=\"(action, i) in actions\" :key=\"i\" class=\"command\" @click.stop=\"action.cb\">{{\n      action.label\n    }}</span>\n  </div>\n</template>\n"],"mappings":";;;;;;;;EAIA,IAAM,IAAQ,GAAa,EAErB,IAAkB,QAAe,EAAM,oBAAoB,CAAC,EAE5D,IAAY,QAAe,EAAgB,MAAM,SAAS,EAAE,EAE5D,IAAM,QAAe,EAAM,UAAU,MAAM,qBAAqB,EAAE,CAAC,EAEnE,IAAU,QACd,EAAI,MAAM,KAAK,OAAQ;GACrB,OAAO,EAAG;GACV,UAAU;AAER,IADA,EAAG,GAAG,EAAgB,MAAM,EAC5B,EAAM,KAAK,gBAAgB,OAAO;;GAErC,EAAE,CACJ;mBAIY,EAAA,SAAA,GAAA,EAAX,EAMM,OANN,GAMM;GALQ,EAAA,MAAgB,UAAA,GAAA,EAA5B,EAAwF,QAAA,GAApD,sBAAiB,EAAG,EAAA,MAAgB,OAAM,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA;YAC9E,EAAM,MAAA,MAAA,MAAA,GAAA;WACN,EAES,GAAA,MAAA,EAFmB,EAAA,QAAd,GAAQ,YAAtB,EAES,QAAA;IAF6B,KAAK;IAAG,OAAM;IAAW,SAAK,EAAO,EAAO,IAAE,CAAA,OAAA,CAAA;QAClF,EAAO,MAAK,EAAA,GAAA,EAAA"}

package/dist/components/DataTable/RowsCommandMenu.js

@@ -0,0 +1,5 @@
+import e from "./RowsCommandMenu.vue2.js";
+var t = e;
+export { t as default };
+
+//# sourceMappingURL=RowsCommandMenu.js.map

package/dist/components/DataTable/RowsCommandMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowsCommandMenu.js","names":[],"sources":["../../../src/components/DataTable/RowsCommandMenu.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from \"vue\";\nimport { injectState } from \"./keys\";\n\nconst state = injectState();\n\nconst selectedRows = computed(() => state.getSelectedRows());\n\nconst isVisible = computed(() => selectedRows.value.length > 0);\n\nconst ops = computed(() => state.settings?.value.onSelectedRows ?? []);\n\nconst actions = computed(() =>\n  ops.value.map((op) => ({\n    label: op.label,\n    cb: () => {\n      op.cb(selectedRows.value);\n      state.data.selectedRows.clear();\n      state.data.rows = [];\n    },\n  })),\n);\n</script>\n\n<template>\n  <div v-if=\"isVisible\" class=\"command-menu\">\n    <span v-if=\"selectedRows.length\">{{ selectedRows.length }} rows selected</span>\n    <hr />\n    <span v-for=\"(action, i) in actions\" :key=\"i\" class=\"command\" @click.stop=\"action.cb\">{{\n      action.label\n    }}</span>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/DataTable/RowsCommandMenu.vue2.js

@@ -1,5 +1,28 @@
-import f from "./RowsCommandMenu.vue.js";
-export {
-  f as default
-};
-//# sourceMappingURL=RowsCommandMenu.vue2.js.map
+import { injectState as e } from "./keys.js";
+import { Fragment as t, computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, defineComponent as o, openBlock as s, renderList as c, toDisplayString as l, withModifiers as u } from "vue";
+var d = {
+	key: 0,
+	class: "command-menu"
+}, f = { key: 0 }, p = ["onClick"], m = /* @__PURE__ */ o({
+	__name: "RowsCommandMenu",
+	setup(o) {
+		let m = e(), h = n(() => m.getSelectedRows()), g = n(() => h.value.length > 0), _ = n(() => m.settings?.value.onSelectedRows ?? []), v = n(() => _.value.map((e) => ({
+			label: e.label,
+			cb: () => {
+				e.cb(h.value), m.data.selectedRows.clear(), m.data.rows = [];
+			}
+		})));
+		return (e, n) => g.value ? (s(), i("div", d, [
+			h.value.length ? (s(), i("span", f, l(h.value.length) + " rows selected", 1)) : r("", !0),
+			n[0] ||= a("hr", null, null, -1),
+			(s(!0), i(t, null, c(v.value, (e, t) => (s(), i("span", {
+				key: t,
+				class: "command",
+				onClick: u(e.cb, ["stop"])
+			}, l(e.label), 9, p))), 128))
+		])) : r("", !0);
+	}
+});
+export { m as default };
+
+//# sourceMappingURL=RowsCommandMenu.vue2.js.map

package/dist/components/DataTable/RowsCommandMenu.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"RowsCommandMenu.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"RowsCommandMenu.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/DataTable/RowsCommandMenu.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from \"vue\";\nimport { injectState } from \"./keys\";\n\nconst state = injectState();\n\nconst selectedRows = computed(() => state.getSelectedRows());\n\nconst isVisible = computed(() => selectedRows.value.length > 0);\n\nconst ops = computed(() => state.settings?.value.onSelectedRows ?? []);\n\nconst actions = computed(() =>\n  ops.value.map((op) => ({\n    label: op.label,\n    cb: () => {\n      op.cb(selectedRows.value);\n      state.data.selectedRows.clear();\n      state.data.rows = [];\n    },\n  })),\n);\n</script>\n\n<template>\n  <div v-if=\"isVisible\" class=\"command-menu\">\n    <span v-if=\"selectedRows.length\">{{ selectedRows.length }} rows selected</span>\n    <hr />\n    <span v-for=\"(action, i) in actions\" :key=\"i\" class=\"command\" @click.stop=\"action.cb\">{{\n      action.label\n    }}</span>\n  </div>\n</template>\n"],"mappings":";;;;;;;;EAIA,IAAM,IAAQ,GAAa,EAErB,IAAe,QAAe,EAAM,iBAAiB,CAAC,EAEtD,IAAY,QAAe,EAAa,MAAM,SAAS,EAAE,EAEzD,IAAM,QAAe,EAAM,UAAU,MAAM,kBAAkB,EAAE,CAAC,EAEhE,IAAU,QACd,EAAI,MAAM,KAAK,OAAQ;GACrB,OAAO,EAAG;GACV,UAAU;AAGR,IAFA,EAAG,GAAG,EAAa,MAAM,EACzB,EAAM,KAAK,aAAa,OAAO,EAC/B,EAAM,KAAK,OAAO,EAAE;;GAEvB,EAAE,CACJ;mBAIY,EAAA,SAAA,GAAA,EAAX,EAMM,OANN,GAMM;GALQ,EAAA,MAAa,UAAA,GAAA,EAAzB,EAA+E,QAAA,GAAA,EAA3C,EAAA,MAAa,OAAM,GAAG,kBAAc,EAAA,IAAA,EAAA,IAAA,GAAA;YACxE,EAAM,MAAA,MAAA,MAAA,GAAA;WACN,EAES,GAAA,MAAA,EAFmB,EAAA,QAAd,GAAQ,YAAtB,EAES,QAAA;IAF6B,KAAK;IAAG,OAAM;IAAW,SAAK,EAAO,EAAO,IAAE,CAAA,OAAA,CAAA;QAClF,EAAO,MAAK,EAAA,GAAA,EAAA"}

package/dist/components/DataTable/TScroll.js

@@ -0,0 +1,5 @@
+import e from "./TScroll.vue2.js";
+var t = e;
+export { t as default };
+
+//# sourceMappingURL=TScroll.js.map

package/dist/components/DataTable/TScroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TScroll.js","names":[],"sources":["../../../src/components/DataTable/TScroll.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed, ref } from \"vue\";\nimport { useMouseCapture } from \"../../composition/useMouseCapture\";\n\nconst emit = defineEmits<{\n  (e: \"change:offset\", value: number): void;\n}>();\n\nconst props = defineProps<{\n  offset: number;\n  windowSize: number;\n  dataSize: number;\n}>();\n\nconst handleRef = ref<HTMLElement>();\n\nconst scrollSize = computed(() => props.windowSize - 12);\n\nconst isVisible = computed(() => props.windowSize < props.dataSize);\n\nconst handleOffset = computed(() => Math.ceil(props.offset * (scrollSize.value / props.dataSize)));\n\nconst handleLength = computed(() =>\n  Math.ceil((scrollSize.value * scrollSize.value) / props.dataSize),\n);\n\nconst handleStyle = computed(() => ({\n  top: `${handleOffset.value}px`,\n  height: `${handleLength.value}px`,\n}));\n\nuseMouseCapture(handleRef, (ev, state) => {\n  const newOffset = ((handleOffset.value + ev.dy) * props.dataSize) / scrollSize.value;\n  emit(\"change:offset\", newOffset);\n  state.x = ev.x;\n  state.y = ev.y;\n});\n</script>\n\n<template>\n  <div class=\"t-scroll\" :style=\"{ height: `${windowSize}px` }\">\n    <div>\n      <div v-if=\"isVisible\" ref=\"handleRef\" class=\"t-scroll__handle\" :style=\"handleStyle\" />\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/DataTable/TScroll.vue2.js

@@ -1,5 +1,32 @@
-import f from "./TScroll.vue.js";
-export {
-  f as default
-};
-//# sourceMappingURL=TScroll.vue2.js.map
+import { useMouseCapture as e } from "../../composition/useMouseCapture.js";
+import { computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, normalizeStyle as o, openBlock as s, ref as c } from "vue";
+var l = /* @__PURE__ */ a({
+	__name: "TScroll",
+	props: {
+		offset: {},
+		windowSize: {},
+		dataSize: {}
+	},
+	emits: ["change:offset"],
+	setup(a, { emit: l }) {
+		let u = l, d = a, f = c(), p = t(() => d.windowSize - 12), m = t(() => d.windowSize < d.dataSize), h = t(() => Math.ceil(d.offset * (p.value / d.dataSize))), g = t(() => Math.ceil(p.value * p.value / d.dataSize)), _ = t(() => ({
+			top: `${h.value}px`,
+			height: `${g.value}px`
+		}));
+		return e(f, (e, t) => {
+			u("change:offset", (h.value + e.dy) * d.dataSize / p.value), t.x = e.x, t.y = e.y;
+		}), (e, t) => (s(), r("div", {
+			class: "t-scroll",
+			style: o({ height: `${a.windowSize}px` })
+		}, [i("div", null, [m.value ? (s(), r("div", {
+			key: 0,
+			ref_key: "handleRef",
+			ref: f,
+			class: "t-scroll__handle",
+			style: o(_.value)
+		}, null, 4)) : n("", !0)])], 4));
+	}
+});
+export { l as default };
+
+//# sourceMappingURL=TScroll.vue2.js.map

package/dist/components/DataTable/TScroll.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"TScroll.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"TScroll.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/DataTable/TScroll.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed, ref } from \"vue\";\nimport { useMouseCapture } from \"../../composition/useMouseCapture\";\n\nconst emit = defineEmits<{\n  (e: \"change:offset\", value: number): void;\n}>();\n\nconst props = defineProps<{\n  offset: number;\n  windowSize: number;\n  dataSize: number;\n}>();\n\nconst handleRef = ref<HTMLElement>();\n\nconst scrollSize = computed(() => props.windowSize - 12);\n\nconst isVisible = computed(() => props.windowSize < props.dataSize);\n\nconst handleOffset = computed(() => Math.ceil(props.offset * (scrollSize.value / props.dataSize)));\n\nconst handleLength = computed(() =>\n  Math.ceil((scrollSize.value * scrollSize.value) / props.dataSize),\n);\n\nconst handleStyle = computed(() => ({\n  top: `${handleOffset.value}px`,\n  height: `${handleLength.value}px`,\n}));\n\nuseMouseCapture(handleRef, (ev, state) => {\n  const newOffset = ((handleOffset.value + ev.dy) * props.dataSize) / scrollSize.value;\n  emit(\"change:offset\", newOffset);\n  state.x = ev.x;\n  state.y = ev.y;\n});\n</script>\n\n<template>\n  <div class=\"t-scroll\" :style=\"{ height: `${windowSize}px` }\">\n    <div>\n      <div v-if=\"isVisible\" ref=\"handleRef\" class=\"t-scroll__handle\" :style=\"handleStyle\" />\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;EAIA,IAAM,IAAO,GAIP,IAAQ,GAMR,IAAY,GAAkB,EAE9B,IAAa,QAAe,EAAM,aAAa,GAAG,EAElD,IAAY,QAAe,EAAM,aAAa,EAAM,SAAS,EAE7D,IAAe,QAAe,KAAK,KAAK,EAAM,UAAU,EAAW,QAAQ,EAAM,UAAU,CAAC,EAE5F,IAAe,QACnB,KAAK,KAAM,EAAW,QAAQ,EAAW,QAAS,EAAM,SAAS,CAClE,EAEK,IAAc,SAAgB;GAClC,KAAK,GAAG,EAAa,MAAM;GAC3B,QAAQ,GAAG,EAAa,MAAM;GAC/B,EAAE;SAEH,EAAgB,IAAY,GAAI,MAAU;AAIxC,GAFA,EAAK,kBADe,EAAa,QAAQ,EAAG,MAAM,EAAM,WAAY,EAAW,MAC/C,EAChC,EAAM,IAAI,EAAG,GACb,EAAM,IAAI,EAAG;IACb,kBAIA,EAIM,OAAA;GAJD,OAAM;GAAY,OAAK,EAAA,EAAA,QAAA,GAAe,EAAA,WAAU,KAAA,CAAA;MACnD,EAEM,OAAA,MAAA,CADO,EAAA,SAAA,GAAA,EAAX,EAAsF,OAAA;;YAA5D;GAAJ,KAAI;GAAY,OAAM;GAAoB,OAAK,EAAE,EAAA,MAAW"}

package/dist/components/DataTable/TableComponent.js

@@ -0,0 +1,5 @@
+import e from "./TableComponent.vue2.js";
+var t = e;
+export { t as default };
+
+//# sourceMappingURL=TableComponent.js.map

package/dist/components/DataTable/TableComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableComponent.js","names":[],"sources":["../../../src/components/DataTable/TableComponent.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport \"./assets/data-table-style.scss\";\nimport { ref, unref, onMounted, nextTick, watchPostEffect, watch, computed } from \"vue\";\nimport TdCell from \"./TdCell.vue\";\nimport type { TableSettings, TableData } from \"./types\";\nimport TableIcon from \"./assets/TableIcon.vue\";\nimport TrHead from \"./TrHead.vue\";\nimport ThCell from \"./ThCell.vue\";\nimport TrBody from \"./TrBody.vue\";\nimport ColumnCaret from \"./ColumnCaret.vue\";\nimport { useEventListener } from \"../../index\";\nimport { tapIf } from \"@milaboratories/helpers\";\nimport { useResize } from \"./composition/useResize\";\nimport RowsCommandMenu from \"./RowsCommandMenu.vue\";\nimport ColumnsCommandMenu from \"./ColumnsCommandMenu.vue\";\nimport TScroll from \"./TScroll.vue\";\nimport { createState } from \"./state\";\n\nconst emit = defineEmits<{\n  (e: \"update:data\", value: TableData): void;\n  (e: \"change:sort\", value: unknown): void;\n}>();\n\nconst props = defineProps<{\n  settings: Readonly<TableSettings>;\n}>();\n\nconst state = createState(props);\n\nconst hasNoData = computed(() => state.data.rows.length === 0);\n\nconst tableBodyStyle = computed(() => ({\n  height: hasNoData.value ? \"212px\" /* css value */ : state.data.bodyHeight + \"px\",\n}));\n\nwatch(state.data, (v) => emit(\"update:data\", v), { deep: true });\n\nwatch(props, () => updateDimensions);\n\nconst tableRef = ref<HTMLElement>();\nconst headRef = ref<HTMLElement>();\nconst bodyRef = ref<HTMLElement>();\n\nconst updateDimensions = () => {\n  tapIf(bodyRef.value, (el) => {\n    state.updateDimensions(el.getBoundingClientRect());\n  });\n};\n\nconst tableColumns = state.tableColumns;\n\nconst tableRows = state.tableRows;\n\nconst { mouseDown } = useResize(state, tableRef);\n\nonMounted(() => {\n  nextTick(updateDimensions);\n});\n\nwatchPostEffect(() => {\n  unref(props.settings);\n  nextTick(updateDimensions);\n});\n\nuseEventListener(window, \"resize\", () => nextTick(updateDimensions));\n\nconst onWheel = (ev: WheelEvent) => {\n  ev.preventDefault();\n  state.updateOffsets(ev);\n};\n</script>\n\n<template>\n  <div ref=\"tableRef\" class=\"data-table\" @mousedown=\"mouseDown\">\n    <div class=\"command-menu__container\">\n      <RowsCommandMenu />\n      <ColumnsCommandMenu />\n    </div>\n    <div ref=\"headRef\" class=\"table-head\">\n      <TrHead>\n        <ThCell\n          v-for=\"(col, i) in tableColumns\"\n          :key=\"i\"\n          :col=\"col\"\n          :style=\"col.style\"\n          @change:sort=\"$emit('change:sort', $event)\"\n        />\n      </TrHead>\n    </div>\n    <div ref=\"bodyRef\" class=\"table-body\" :style=\"tableBodyStyle\" @wheel=\"onWheel\">\n      <div v-if=\"hasNoData\" class=\"table-body__no-data\">\n        <div>\n          <TableIcon />\n          <div>No Data To Show</div>\n        </div>\n      </div>\n      <TrBody v-for=\"(row, i) in tableRows\" :key=\"i\" :row=\"row\">\n        <TdCell\n          v-for=\"cell in row.cells\"\n          :key=\"cell.column.id + ':' + i\"\n          :cell=\"cell\"\n          :style=\"cell.style\"\n        />\n      </TrBody>\n    </div>\n    <div class=\"carets\">\n      <ColumnCaret\n        v-for=\"(col, i) in tableColumns\"\n        :key=\"i\"\n        :column=\"col\"\n        :style=\"col.style\"\n        @change:sort=\"$emit('change:sort', $event)\"\n      />\n    </div>\n    <TScroll\n      :offset=\"state.data.scrollTop\"\n      :window-size=\"state.data.bodyHeight\"\n      :data-size=\"state.data.dataHeight\"\n      @change:offset=\"state.updateScrollTop\"\n    />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/DataTable/TableComponent.vue2.js

@@ -1,5 +1,98 @@
-import f from "./TableComponent.vue.js";
-export {
-  f as default
-};
-//# sourceMappingURL=TableComponent.vue2.js.map
+import './assets/data-table-style.css';/* empty css                        */
+import e from "./TdCell.js";
+import t from "./assets/TableIcon.js";
+import n from "./TrHead.js";
+import r from "./ThCell.js";
+import i from "./TrBody.js";
+import a from "./ColumnCaret.js";
+import { useEventListener as o } from "../../composition/useEventListener.js";
+import { useResize as s } from "./composition/useResize.js";
+import c from "./RowsCommandMenu.js";
+import l from "./ColumnsCommandMenu.js";
+import u from "./TScroll.js";
+import { createState as d } from "./state.js";
+import { Fragment as f, computed as p, createBlock as m, createCommentVNode as h, createElementBlock as g, createElementVNode as _, createVNode as v, defineComponent as y, nextTick as b, normalizeStyle as x, onMounted as S, openBlock as C, ref as w, renderList as T, unref as E, watch as D, watchPostEffect as O, withCtx as k } from "vue";
+import { tapIf as A } from "@milaboratories/helpers";
+var j = { class: "command-menu__container" }, M = {
+	key: 0,
+	class: "table-body__no-data"
+}, N = { class: "carets" }, P = /* @__PURE__ */ y({
+	__name: "TableComponent",
+	props: { settings: {} },
+	emits: ["update:data", "change:sort"],
+	setup(y, { emit: P }) {
+		let F = P, I = y, L = d(I), R = p(() => L.data.rows.length === 0), z = p(() => ({ height: R.value ? "212px" : L.data.bodyHeight + "px" }));
+		D(L.data, (e) => F("update:data", e), { deep: !0 }), D(I, () => U);
+		let B = w(), V = w(), H = w(), U = () => {
+			A(H.value, (e) => {
+				L.updateDimensions(e.getBoundingClientRect());
+			});
+		}, W = L.tableColumns, G = L.tableRows, { mouseDown: K } = s(L, B);
+		S(() => {
+			b(U);
+		}), O(() => {
+			E(I.settings), b(U);
+		}), o(window, "resize", () => b(U));
+		let q = (e) => {
+			e.preventDefault(), L.updateOffsets(e);
+		};
+		return (o, s) => (C(), g("div", {
+			ref_key: "tableRef",
+			ref: B,
+			class: "data-table",
+			onMousedown: s[2] ||= (...e) => E(K) && E(K)(...e)
+		}, [
+			_("div", j, [v(c), v(l)]),
+			_("div", {
+				ref_key: "headRef",
+				ref: V,
+				class: "table-head"
+			}, [v(n, null, {
+				default: k(() => [(C(!0), g(f, null, T(E(W), (e, t) => (C(), m(r, {
+					key: t,
+					col: e,
+					style: x(e.style),
+					"onChange:sort": s[0] ||= (e) => o.$emit("change:sort", e)
+				}, null, 8, ["col", "style"]))), 128))]),
+				_: 1
+			})], 512),
+			_("div", {
+				ref_key: "bodyRef",
+				ref: H,
+				class: "table-body",
+				style: x(z.value),
+				onWheel: q
+			}, [R.value ? (C(), g("div", M, [_("div", null, [v(t), s[3] ||= _("div", null, "No Data To Show", -1)])])) : h("", !0), (C(!0), g(f, null, T(E(G), (t, n) => (C(), m(i, {
+				key: n,
+				row: t
+			}, {
+				default: k(() => [(C(!0), g(f, null, T(t.cells, (t) => (C(), m(e, {
+					key: t.column.id + ":" + n,
+					cell: t,
+					style: x(t.style)
+				}, null, 8, ["cell", "style"]))), 128))]),
+				_: 2
+			}, 1032, ["row"]))), 128))], 36),
+			_("div", N, [(C(!0), g(f, null, T(E(W), (e, t) => (C(), m(a, {
+				key: t,
+				column: e,
+				style: x(e.style),
+				"onChange:sort": s[1] ||= (e) => o.$emit("change:sort", e)
+			}, null, 8, ["column", "style"]))), 128))]),
+			v(u, {
+				offset: E(L).data.scrollTop,
+				"window-size": E(L).data.bodyHeight,
+				"data-size": E(L).data.dataHeight,
+				"onChange:offset": E(L).updateScrollTop
+			}, null, 8, [
+				"offset",
+				"window-size",
+				"data-size",
+				"onChange:offset"
+			])
+		], 544));
+	}
+});
+export { P as default };
+
+//# sourceMappingURL=TableComponent.vue2.js.map

package/dist/components/DataTable/TableComponent.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableComponent.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"TableComponent.vue_vue_type_script_setup_true_lang.js","names":["$emit"],"sources":["../../../src/components/DataTable/TableComponent.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport \"./assets/data-table-style.scss\";\nimport { ref, unref, onMounted, nextTick, watchPostEffect, watch, computed } from \"vue\";\nimport TdCell from \"./TdCell.vue\";\nimport type { TableSettings, TableData } from \"./types\";\nimport TableIcon from \"./assets/TableIcon.vue\";\nimport TrHead from \"./TrHead.vue\";\nimport ThCell from \"./ThCell.vue\";\nimport TrBody from \"./TrBody.vue\";\nimport ColumnCaret from \"./ColumnCaret.vue\";\nimport { useEventListener } from \"../../index\";\nimport { tapIf } from \"@milaboratories/helpers\";\nimport { useResize } from \"./composition/useResize\";\nimport RowsCommandMenu from \"./RowsCommandMenu.vue\";\nimport ColumnsCommandMenu from \"./ColumnsCommandMenu.vue\";\nimport TScroll from \"./TScroll.vue\";\nimport { createState } from \"./state\";\n\nconst emit = defineEmits<{\n  (e: \"update:data\", value: TableData): void;\n  (e: \"change:sort\", value: unknown): void;\n}>();\n\nconst props = defineProps<{\n  settings: Readonly<TableSettings>;\n}>();\n\nconst state = createState(props);\n\nconst hasNoData = computed(() => state.data.rows.length === 0);\n\nconst tableBodyStyle = computed(() => ({\n  height: hasNoData.value ? \"212px\" /* css value */ : state.data.bodyHeight + \"px\",\n}));\n\nwatch(state.data, (v) => emit(\"update:data\", v), { deep: true });\n\nwatch(props, () => updateDimensions);\n\nconst tableRef = ref<HTMLElement>();\nconst headRef = ref<HTMLElement>();\nconst bodyRef = ref<HTMLElement>();\n\nconst updateDimensions = () => {\n  tapIf(bodyRef.value, (el) => {\n    state.updateDimensions(el.getBoundingClientRect());\n  });\n};\n\nconst tableColumns = state.tableColumns;\n\nconst tableRows = state.tableRows;\n\nconst { mouseDown } = useResize(state, tableRef);\n\nonMounted(() => {\n  nextTick(updateDimensions);\n});\n\nwatchPostEffect(() => {\n  unref(props.settings);\n  nextTick(updateDimensions);\n});\n\nuseEventListener(window, \"resize\", () => nextTick(updateDimensions));\n\nconst onWheel = (ev: WheelEvent) => {\n  ev.preventDefault();\n  state.updateOffsets(ev);\n};\n</script>\n\n<template>\n  <div ref=\"tableRef\" class=\"data-table\" @mousedown=\"mouseDown\">\n    <div class=\"command-menu__container\">\n      <RowsCommandMenu />\n      <ColumnsCommandMenu />\n    </div>\n    <div ref=\"headRef\" class=\"table-head\">\n      <TrHead>\n        <ThCell\n          v-for=\"(col, i) in tableColumns\"\n          :key=\"i\"\n          :col=\"col\"\n          :style=\"col.style\"\n          @change:sort=\"$emit('change:sort', $event)\"\n        />\n      </TrHead>\n    </div>\n    <div ref=\"bodyRef\" class=\"table-body\" :style=\"tableBodyStyle\" @wheel=\"onWheel\">\n      <div v-if=\"hasNoData\" class=\"table-body__no-data\">\n        <div>\n          <TableIcon />\n          <div>No Data To Show</div>\n        </div>\n      </div>\n      <TrBody v-for=\"(row, i) in tableRows\" :key=\"i\" :row=\"row\">\n        <TdCell\n          v-for=\"cell in row.cells\"\n          :key=\"cell.column.id + ':' + i\"\n          :cell=\"cell\"\n          :style=\"cell.style\"\n        />\n      </TrBody>\n    </div>\n    <div class=\"carets\">\n      <ColumnCaret\n        v-for=\"(col, i) in tableColumns\"\n        :key=\"i\"\n        :column=\"col\"\n        :style=\"col.style\"\n        @change:sort=\"$emit('change:sort', $event)\"\n      />\n    </div>\n    <TScroll\n      :offset=\"state.data.scrollTop\"\n      :window-size=\"state.data.bodyHeight\"\n      :data-size=\"state.data.dataHeight\"\n      @change:offset=\"state.updateScrollTop\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;EAkBA,IAAM,IAAO,GAKP,IAAQ,GAIR,IAAQ,EAAY,EAAM,EAE1B,IAAY,QAAe,EAAM,KAAK,KAAK,WAAW,EAAE,EAExD,IAAiB,SAAgB,EACrC,QAAQ,EAAU,QAAQ,UAA0B,EAAM,KAAK,aAAa,MAC7E,EAAE;AAIH,EAFA,EAAM,EAAM,OAAO,MAAM,EAAK,eAAe,EAAE,EAAE,EAAE,MAAM,IAAM,CAAC,EAEhE,EAAM,SAAa,EAAiB;EAEpC,IAAM,IAAW,GAAkB,EAC7B,IAAU,GAAkB,EAC5B,IAAU,GAAkB,EAE5B,UAAyB;AAC7B,KAAM,EAAQ,QAAQ,MAAO;AAC3B,MAAM,iBAAiB,EAAG,uBAAuB,CAAC;KAClD;KAGE,IAAe,EAAM,cAErB,IAAY,EAAM,WAElB,EAAE,iBAAc,EAAU,GAAO,EAAS;AAWhD,EATA,QAAgB;AACd,KAAS,EAAiB;IAC1B,EAEF,QAAsB;AAEpB,GADA,EAAM,EAAM,SAAS,EACrB,EAAS,EAAiB;IAC1B,EAEF,EAAiB,QAAQ,gBAAgB,EAAS,EAAiB,CAAC;EAEpE,IAAM,KAAW,MAAmB;AAElC,GADA,EAAG,gBAAgB,EACnB,EAAM,cAAc,EAAG;;yBAKvB,EA+CM,OAAA;YA/CG;GAAJ,KAAI;GAAW,OAAM;GAAc,aAAS,AAAA,EAAA,QAAA,GAAA,MAAE,EAAA,EAAA,IAAA,EAAA,EAAA,CAAA,GAAA,EAAS;;GAC1D,EAGM,OAHN,GAGM,CAFJ,EAAmB,EAAA,EACnB,EAAsB,EAAA,CAAA,CAAA;GAExB,EAUM,OAAA;aAVG;IAAJ,KAAI;IAAU,OAAM;OACvB,EAQS,GAAA,MAAA;qBAN2B,EAAA,EAAA,GAAA,EADlC,EAME,GAAA,MAAA,EALmB,EAAA,EAAY,GAAvB,GAAK,YADf,EAME,GAAA;KAJC,KAAK;KACA;KACL,OAAK,EAAE,EAAI,MAAK;KAChB,iBAAW,AAAA,EAAA,QAAA,MAAEA,EAAAA,MAAK,eAAgB,EAAM;;;;GAI/C,EAeM,OAAA;aAfG;IAAJ,KAAI;IAAU,OAAM;IAAc,OAAK,EAAE,EAAA,MAAc;IAAU;OACzD,EAAA,SAAA,GAAA,EAAX,EAKM,OALN,GAKM,CAJJ,EAGM,OAAA,MAAA,CAFJ,EAAa,EAAA,EAAA,AAAA,EAAA,OACb,EAA0B,OAAA,MAArB,mBAAe,GAAA,CAAA,CAAA,CAAA,CAAA,IAAA,EAAA,IAAA,GAAA,GAAA,EAAA,GAAA,EAGxB,EAOS,GAAA,MAAA,EAPkB,EAAA,EAAS,GAApB,GAAK,YAArB,EAOS,GAAA;IAP8B,KAAK;IAAS;;qBAExB,EAAA,EAAA,GAAA,EAD3B,EAKE,GAAA,MAAA,EAJe,EAAI,QAAZ,YADT,EAKE,GAAA;KAHC,KAAK,EAAK,OAAO,KAAE,MAAS;KACtB;KACN,OAAK,EAAE,EAAK,MAAK;;;;GAIxB,EAQM,OARN,GAQM,EAAA,EAAA,GAAA,EAPJ,EAME,GAAA,MAAA,EALmB,EAAA,EAAY,GAAvB,GAAK,YADf,EAME,GAAA;IAJC,KAAK;IACL,QAAQ;IACR,OAAK,EAAE,EAAI,MAAK;IAChB,iBAAW,AAAA,EAAA,QAAA,MAAEA,EAAAA,MAAK,eAAgB,EAAM;;GAG7C,EAKE,GAAA;IAJC,QAAQ,EAAA,EAAK,CAAC,KAAK;IACnB,eAAa,EAAA,EAAK,CAAC,KAAK;IACxB,aAAW,EAAA,EAAK,CAAC,KAAK;IACtB,mBAAe,EAAA,EAAK,CAAC"}

package/dist/components/DataTable/TdCell.js

@@ -0,0 +1,5 @@
+import e from "./TdCell.vue2.js";
+var t = e;
+export { t as default };
+
+//# sourceMappingURL=TdCell.js.map

package/dist/components/DataTable/TdCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TdCell.js","names":[],"sources":["../../../src/components/DataTable/TdCell.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { tapIf } from \"@milaboratories/helpers\";\nimport { showContextMenu } from \"../contextMenu\";\nimport type { ContextOption } from \"../contextMenu/types\";\nimport { injectState } from \"./keys\";\nimport type { Row, TableCell } from \"./types\";\nimport { computed, ref } from \"vue\";\nimport BaseCellComponent from \"./BaseCellComponent.vue\";\n\nconst props = defineProps<{\n  cell: TableCell;\n}>();\n\nconst state = injectState();\n\nconst valueTypeRef = computed(() => props.cell.column.valueType);\n\nconst onInput = (value: unknown) => {\n  tapIf(state.settings.value.onUpdatedRow, (f) => {\n    const row = props.cell.row;\n\n    const dataRow = { ...row.dataRow, [props.cell.id]: value };\n\n    f({ ...row, dataRow });\n  });\n};\n\nconst onClick = (ev: MouseEvent) => {\n  if (ev.metaKey) {\n    state.selectRow(props.cell.row.primaryKey);\n  }\n};\n\nconst onContextMenu = (ev: MouseEvent, row: Row) => {\n  if (ev.type === \"contextmenu\") {\n    ev.preventDefault();\n  } else {\n    return;\n  }\n\n  const settings = state.settings ?? {};\n\n  const options = [] as ContextOption[];\n\n  const { onSelectedRows, onSelectedColumns } = settings.value;\n\n  const isSelected = state.data.selectedRows.has(row.primaryKey);\n\n  if (onSelectedRows && onSelectedRows.length) {\n    if (isSelected) {\n      options.push({\n        text: \"Deselect row\",\n        cb() {\n          state.data.selectedRows.delete(props.cell.row.primaryKey);\n        },\n      });\n    } else {\n      options.push({\n        text: \"Select row\",\n        cb() {\n          state.selectRow(props.cell.row.primaryKey);\n        },\n      });\n    }\n  }\n\n  if (onSelectedColumns && onSelectedColumns.length) {\n    options.push({\n      text: \"Select column\",\n      cb() {\n        state.selectColumn(props.cell.column.id);\n      },\n    });\n\n    options.push({\n      text: \"Unselect column\",\n      cb() {\n        state.unselectColumn(props.cell.column.id);\n      },\n    });\n  }\n\n  if (!options.length) {\n    return;\n  }\n\n  showContextMenu(ev, options);\n};\n\nconst cellRef = ref<HTMLElement>();\n\nconst CustomComponent = computed(() =>\n  props.cell.column.component ? props.cell.column.component() : undefined,\n);\n</script>\n\n<template>\n  <div\n    ref=\"cellRef\"\n    class=\"td-cell\"\n    :class=\"{ [cell.class]: true }\"\n    :data-row-index.attr=\"cell.row.index\"\n    @click=\"onClick\"\n    @contextmenu=\"(ev) => onContextMenu(ev, cell.row)\"\n  >\n    <div v-if=\"cell.control\" class=\"control-cell\">{{ cell.row.index }}</div>\n    <component\n      :is=\"CustomComponent\"\n      v-else-if=\"CustomComponent\"\n      :model-value=\"cell.value\"\n      @update:model-value=\"onInput\"\n    />\n    <BaseCellComponent\n      v-else\n      :model-value=\"cell.value\"\n      :value-type=\"valueTypeRef\"\n      :editable=\"cell.column.editable\"\n      @update:model-value=\"onInput\"\n    />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/DataTable/TdCell.vue2.js

@@ -1,5 +1,78 @@
-import f from "./TdCell.vue.js";
-export {
-  f as default
-};
-//# sourceMappingURL=TdCell.vue2.js.map
+import { showContextMenu as e } from "../contextMenu/index.js";
+import { injectState as t } from "./keys.js";
+import n from "./BaseCellComponent.js";
+import { computed as r, createBlock as i, createElementBlock as a, defineComponent as o, normalizeClass as s, openBlock as c, ref as l, resolveDynamicComponent as u, toDisplayString as d } from "vue";
+import { tapIf as f } from "@milaboratories/helpers";
+var p = ["^data-row-index"], m = {
+	key: 0,
+	class: "control-cell"
+}, h = /* @__PURE__ */ o({
+	__name: "TdCell",
+	props: { cell: {} },
+	setup(o) {
+		let h = o, g = t(), _ = r(() => h.cell.column.valueType), v = (e) => {
+			f(g.settings.value.onUpdatedRow, (t) => {
+				let n = h.cell.row, r = {
+					...n.dataRow,
+					[h.cell.id]: e
+				};
+				t({
+					...n,
+					dataRow: r
+				});
+			});
+		}, y = (e) => {
+			e.metaKey && g.selectRow(h.cell.row.primaryKey);
+		}, b = (t, n) => {
+			if (t.type === "contextmenu") t.preventDefault();
+			else return;
+			let r = g.settings ?? {}, i = [], { onSelectedRows: a, onSelectedColumns: o } = r.value, s = g.data.selectedRows.has(n.primaryKey);
+			a && a.length && (s ? i.push({
+				text: "Deselect row",
+				cb() {
+					g.data.selectedRows.delete(h.cell.row.primaryKey);
+				}
+			}) : i.push({
+				text: "Select row",
+				cb() {
+					g.selectRow(h.cell.row.primaryKey);
+				}
+			})), o && o.length && (i.push({
+				text: "Select column",
+				cb() {
+					g.selectColumn(h.cell.column.id);
+				}
+			}), i.push({
+				text: "Unselect column",
+				cb() {
+					g.unselectColumn(h.cell.column.id);
+				}
+			})), i.length && e(t, i);
+		}, x = l(), S = r(() => h.cell.column.component ? h.cell.column.component() : void 0);
+		return (e, t) => (c(), a("div", {
+			ref_key: "cellRef",
+			ref: x,
+			class: s(["td-cell", { [o.cell.class]: !0 }]),
+			"^data-row-index": o.cell.row.index,
+			onClick: y,
+			onContextmenu: t[0] ||= (e) => b(e, o.cell.row)
+		}, [o.cell.control ? (c(), a("div", m, d(o.cell.row.index), 1)) : S.value ? (c(), i(u(S.value), {
+			key: 1,
+			"model-value": o.cell.value,
+			"onUpdate:modelValue": v
+		}, null, 8, ["model-value"])) : (c(), i(n, {
+			key: 2,
+			"model-value": o.cell.value,
+			"value-type": _.value,
+			editable: o.cell.column.editable,
+			"onUpdate:modelValue": v
+		}, null, 8, [
+			"model-value",
+			"value-type",
+			"editable"
+		]))], 42, p));
+	}
+});
+export { h as default };
+
+//# sourceMappingURL=TdCell.vue2.js.map

package/dist/components/DataTable/TdCell.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"TdCell.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"TdCell.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/DataTable/TdCell.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { tapIf } from \"@milaboratories/helpers\";\nimport { showContextMenu } from \"../contextMenu\";\nimport type { ContextOption } from \"../contextMenu/types\";\nimport { injectState } from \"./keys\";\nimport type { Row, TableCell } from \"./types\";\nimport { computed, ref } from \"vue\";\nimport BaseCellComponent from \"./BaseCellComponent.vue\";\n\nconst props = defineProps<{\n  cell: TableCell;\n}>();\n\nconst state = injectState();\n\nconst valueTypeRef = computed(() => props.cell.column.valueType);\n\nconst onInput = (value: unknown) => {\n  tapIf(state.settings.value.onUpdatedRow, (f) => {\n    const row = props.cell.row;\n\n    const dataRow = { ...row.dataRow, [props.cell.id]: value };\n\n    f({ ...row, dataRow });\n  });\n};\n\nconst onClick = (ev: MouseEvent) => {\n  if (ev.metaKey) {\n    state.selectRow(props.cell.row.primaryKey);\n  }\n};\n\nconst onContextMenu = (ev: MouseEvent, row: Row) => {\n  if (ev.type === \"contextmenu\") {\n    ev.preventDefault();\n  } else {\n    return;\n  }\n\n  const settings = state.settings ?? {};\n\n  const options = [] as ContextOption[];\n\n  const { onSelectedRows, onSelectedColumns } = settings.value;\n\n  const isSelected = state.data.selectedRows.has(row.primaryKey);\n\n  if (onSelectedRows && onSelectedRows.length) {\n    if (isSelected) {\n      options.push({\n        text: \"Deselect row\",\n        cb() {\n          state.data.selectedRows.delete(props.cell.row.primaryKey);\n        },\n      });\n    } else {\n      options.push({\n        text: \"Select row\",\n        cb() {\n          state.selectRow(props.cell.row.primaryKey);\n        },\n      });\n    }\n  }\n\n  if (onSelectedColumns && onSelectedColumns.length) {\n    options.push({\n      text: \"Select column\",\n      cb() {\n        state.selectColumn(props.cell.column.id);\n      },\n    });\n\n    options.push({\n      text: \"Unselect column\",\n      cb() {\n        state.unselectColumn(props.cell.column.id);\n      },\n    });\n  }\n\n  if (!options.length) {\n    return;\n  }\n\n  showContextMenu(ev, options);\n};\n\nconst cellRef = ref<HTMLElement>();\n\nconst CustomComponent = computed(() =>\n  props.cell.column.component ? props.cell.column.component() : undefined,\n);\n</script>\n\n<template>\n  <div\n    ref=\"cellRef\"\n    class=\"td-cell\"\n    :class=\"{ [cell.class]: true }\"\n    :data-row-index.attr=\"cell.row.index\"\n    @click=\"onClick\"\n    @contextmenu=\"(ev) => onContextMenu(ev, cell.row)\"\n  >\n    <div v-if=\"cell.control\" class=\"control-cell\">{{ cell.row.index }}</div>\n    <component\n      :is=\"CustomComponent\"\n      v-else-if=\"CustomComponent\"\n      :model-value=\"cell.value\"\n      @update:model-value=\"onInput\"\n    />\n    <BaseCellComponent\n      v-else\n      :model-value=\"cell.value\"\n      :value-type=\"valueTypeRef\"\n      :editable=\"cell.column.editable\"\n      @update:model-value=\"onInput\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;EASA,IAAM,IAAQ,GAIR,IAAQ,GAAa,EAErB,IAAe,QAAe,EAAM,KAAK,OAAO,UAAU,EAE1D,KAAW,MAAmB;AAClC,KAAM,EAAM,SAAS,MAAM,eAAe,MAAM;IAC9C,IAAM,IAAM,EAAM,KAAK,KAEjB,IAAU;KAAE,GAAG,EAAI;MAAU,EAAM,KAAK,KAAK;KAAO;AAE1D,MAAE;KAAE,GAAG;KAAK;KAAS,CAAC;KACtB;KAGE,KAAW,MAAmB;AAClC,GAAI,EAAG,WACL,EAAM,UAAU,EAAM,KAAK,IAAI,WAAW;KAIxC,KAAiB,GAAgB,MAAa;AAClD,OAAI,EAAG,SAAS,cACd,GAAG,gBAAgB;OAEnB;GAGF,IAAM,IAAW,EAAM,YAAY,EAAE,EAE/B,IAAU,EAAE,EAEZ,EAAE,mBAAgB,yBAAsB,EAAS,OAEjD,IAAa,EAAM,KAAK,aAAa,IAAI,EAAI,WAAW;AAE9D,GAAI,KAAkB,EAAe,WAC/B,IACF,EAAQ,KAAK;IACX,MAAM;IACN,KAAK;AACH,OAAM,KAAK,aAAa,OAAO,EAAM,KAAK,IAAI,WAAW;;IAE5D,CAAC,GAEF,EAAQ,KAAK;IACX,MAAM;IACN,KAAK;AACH,OAAM,UAAU,EAAM,KAAK,IAAI,WAAW;;IAE7C,CAAC,GAIF,KAAqB,EAAkB,WACzC,EAAQ,KAAK;IACX,MAAM;IACN,KAAK;AACH,OAAM,aAAa,EAAM,KAAK,OAAO,GAAG;;IAE3C,CAAC,EAEF,EAAQ,KAAK;IACX,MAAM;IACN,KAAK;AACH,OAAM,eAAe,EAAM,KAAK,OAAO,GAAG;;IAE7C,CAAC,GAGC,EAAQ,UAIb,EAAgB,GAAI,EAAQ;KAGxB,IAAU,GAAkB,EAE5B,IAAkB,QACtB,EAAM,KAAK,OAAO,YAAY,EAAM,KAAK,OAAO,WAAW,GAAG,KAAA,EAC/D;yBAIC,EAsBM,OAAA;YArBA;GAAJ,KAAI;GACJ,OAAK,EAAA,CAAC,WAAS,GACJ,EAAA,KAAK,QAAK,IAAA,CAAA,CAAA;GACpB,mBAAqB,EAAA,KAAK,IAAI;GACvB;GACP,eAAW,AAAA,EAAA,QAAG,MAAO,EAAc,GAAI,EAAA,KAAK,IAAG;MAErC,EAAA,KAAK,WAAA,GAAA,EAAhB,EAAwE,OAAxE,GAAwE,EAAvB,EAAA,KAAK,IAAI,MAAK,EAAA,EAAA,IAGlD,EAAA,SAAA,GAAA,EAFb,EAKE,EAJK,EAAA,MAAe,EAAA;;GAEnB,eAAa,EAAA,KAAK;GAClB,uBAAoB;wCAEvB,EAME,GAAA;;GAJC,eAAa,EAAA,KAAK;GAClB,cAAY,EAAA;GACZ,UAAU,EAAA,KAAK,OAAO;GACtB,uBAAoB"}

package/dist/components/DataTable/ThCell.js

@@ -0,0 +1,5 @@
+import e from "./ThCell.vue2.js";
+var t = e;
+export { t as default };
+
+//# sourceMappingURL=ThCell.js.map

package/dist/components/DataTable/ThCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThCell.js","names":[],"sources":["../../../src/components/DataTable/ThCell.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { showContextMenu } from \"../contextMenu\";\nimport type { ContextOption } from \"../contextMenu/types\";\nimport { rotate } from \"./domain\";\nimport type { ColumnSpecSettings } from \"./types\";\n\nconst emit = defineEmits([\"delete:column\", \"expand:column\", \"change:sort\"]);\n\ndefineProps<{\n  col: ColumnSpecSettings;\n}>();\n\nfunction onContextMenu(ev: MouseEvent) {\n  ev.preventDefault();\n\n  const options = [] as ContextOption[]; // @TODO\n\n  if (!options.length) {\n    return;\n  }\n\n  showContextMenu(ev, options);\n}\n\nfunction onSort(col: ColumnSpecSettings) {\n  const v = col.sort?.direction ?? \"DESC\";\n  emit(\"change:sort\", {\n    colId: col.id,\n    direction: rotate(v, [\"DESC\", \"ASC\"]),\n  });\n}\n</script>\n\n<template>\n  <div\n    class=\"cell th-cell\"\n    :data-col-id.attr=\"col.id\"\n    :class=\"{ 'justify-center': col.justify, frozen: col.frozen }\"\n    @contextmenu=\"onContextMenu\"\n  >\n    <div v-if=\"col.valueType\" :class=\"col.valueType\" />\n    {{ col.label }}\n    <div v-if=\"col.sort\" class=\"sort\" :class=\"col.sort.direction\" @click.stop=\"() => onSort(col)\" />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/DataTable/ThCell.vue2.js

@@ -1,5 +1,49 @@
-import f from "./ThCell.vue.js";
-export {
-  f as default
-};
-//# sourceMappingURL=ThCell.vue2.js.map
+import { showContextMenu as e } from "../contextMenu/index.js";
+import { rotate as t } from "./domain.js";
+import { createCommentVNode as n, createElementBlock as r, createTextVNode as i, defineComponent as a, normalizeClass as o, openBlock as s, toDisplayString as c, withModifiers as l } from "vue";
+var u = ["^data-col-id"], d = /* @__PURE__ */ a({
+	__name: "ThCell",
+	props: { col: {} },
+	emits: [
+		"delete:column",
+		"expand:column",
+		"change:sort"
+	],
+	setup(a, { emit: d }) {
+		let f = d;
+		function p(t) {
+			t.preventDefault();
+			let n = [];
+			n.length && e(t, n);
+		}
+		function m(e) {
+			let n = e.sort?.direction ?? "DESC";
+			f("change:sort", {
+				colId: e.id,
+				direction: t(n, ["DESC", "ASC"])
+			});
+		}
+		return (e, t) => (s(), r("div", {
+			class: o(["cell th-cell", {
+				"justify-center": a.col.justify,
+				frozen: a.col.frozen
+			}]),
+			"^data-col-id": a.col.id,
+			onContextmenu: p
+		}, [
+			a.col.valueType ? (s(), r("div", {
+				key: 0,
+				class: o(a.col.valueType)
+			}, null, 2)) : n("", !0),
+			i(" " + c(a.col.label) + " ", 1),
+			a.col.sort ? (s(), r("div", {
+				key: 1,
+				class: o(["sort", a.col.sort.direction]),
+				onClick: t[0] ||= l(() => m(a.col), ["stop"])
+			}, null, 2)) : n("", !0)
+		], 42, u));
+	}
+});
+export { d as default };
+
+//# sourceMappingURL=ThCell.vue2.js.map

package/dist/components/DataTable/ThCell.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThCell.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"ThCell.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/DataTable/ThCell.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { showContextMenu } from \"../contextMenu\";\nimport type { ContextOption } from \"../contextMenu/types\";\nimport { rotate } from \"./domain\";\nimport type { ColumnSpecSettings } from \"./types\";\n\nconst emit = defineEmits([\"delete:column\", \"expand:column\", \"change:sort\"]);\n\ndefineProps<{\n  col: ColumnSpecSettings;\n}>();\n\nfunction onContextMenu(ev: MouseEvent) {\n  ev.preventDefault();\n\n  const options = [] as ContextOption[]; // @TODO\n\n  if (!options.length) {\n    return;\n  }\n\n  showContextMenu(ev, options);\n}\n\nfunction onSort(col: ColumnSpecSettings) {\n  const v = col.sort?.direction ?? \"DESC\";\n  emit(\"change:sort\", {\n    colId: col.id,\n    direction: rotate(v, [\"DESC\", \"ASC\"]),\n  });\n}\n</script>\n\n<template>\n  <div\n    class=\"cell th-cell\"\n    :data-col-id.attr=\"col.id\"\n    :class=\"{ 'justify-center': col.justify, frozen: col.frozen }\"\n    @contextmenu=\"onContextMenu\"\n  >\n    <div v-if=\"col.valueType\" :class=\"col.valueType\" />\n    {{ col.label }}\n    <div v-if=\"col.sort\" class=\"sort\" :class=\"col.sort.direction\" @click.stop=\"() => onSort(col)\" />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;EAMA,IAAM,IAAO;EAMb,SAAS,EAAc,GAAgB;AACrC,KAAG,gBAAgB;GAEnB,IAAM,IAAU,EAAE;AAEb,KAAQ,UAIb,EAAgB,GAAI,EAAQ;;EAG9B,SAAS,EAAO,GAAyB;GACvC,IAAM,IAAI,EAAI,MAAM,aAAa;AACjC,KAAK,eAAe;IAClB,OAAO,EAAI;IACX,WAAW,EAAO,GAAG,CAAC,QAAQ,MAAM,CAAC;IACtC,CAAC;;yBAKF,EASM,OAAA;GARJ,OAAK,EAAA,CAAC,gBAAc;IAAA,kBAEQ,EAAA,IAAI;IAAO,QAAU,EAAA,IAAI;IAAM,CAAA,CAAA;GAD1D,gBAAkB,EAAA,IAAI;GAEtB,eAAa;;GAEH,EAAA,IAAI,aAAA,GAAA,EAAf,EAAmD,OAAA;;IAAxB,OAAK,EAAE,EAAA,IAAI,UAAS;;KAAI,MACnD,EAAG,EAAA,IAAI,MAAK,GAAG,KACf,EAAA;GAAW,EAAA,IAAI,QAAA,GAAA,EAAf,EAAgG,OAAA;;IAA3E,OAAK,EAAA,CAAC,QAAe,EAAA,IAAI,KAAK,UAAS,CAAA;IAAG,SAAK,AAAA,EAAA,OAAA,QAAa,EAAO,EAAA,IAAG,EAAA,CAAA,OAAA,CAAA"}

package/dist/components/DataTable/TrBody.js

@@ -0,0 +1,5 @@
+import e from "./TrBody.vue2.js";
+var t = e;
+export { t as default };
+
+//# sourceMappingURL=TrBody.js.map

package/dist/components/DataTable/TrBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrBody.js","names":[],"sources":["../../../src/components/DataTable/TrBody.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ref, nextTick } from \"vue\";\nimport type { TableRow } from \"./types\";\nimport { tapIf } from \"@milaboratories/helpers\";\n\ndefineProps<{\n  row: TableRow;\n}>();\n\nconst trRef = ref<HTMLElement>();\n\n// hook to prevent weird left scroll after child repaint (@TODO)\nconst onScroll = () => {\n  nextTick().then(() => {\n    tapIf(trRef.value, (el) => (el.scrollLeft = 0));\n  });\n};\n</script>\n\n<template>\n  <div\n    ref=\"trRef\"\n    class=\"tr-body\"\n    scroll=\"no\"\n    :style=\"row.style\"\n    :class=\"{ selected: row.selected }\"\n    @scroll=\"onScroll\"\n  >\n    <slot />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/DataTable/TrBody.vue2.js

@@ -1,5 +1,24 @@
-import f from "./TrBody.vue.js";
-export {
-  f as default
-};
-//# sourceMappingURL=TrBody.vue2.js.map
+import { createElementBlock as e, defineComponent as t, nextTick as n, normalizeClass as r, normalizeStyle as i, openBlock as a, ref as o, renderSlot as s } from "vue";
+import { tapIf as c } from "@milaboratories/helpers";
+var l = /* @__PURE__ */ t({
+	__name: "TrBody",
+	props: { row: {} },
+	setup(t) {
+		let l = o(), u = () => {
+			n().then(() => {
+				c(l.value, (e) => e.scrollLeft = 0);
+			});
+		};
+		return (n, o) => (a(), e("div", {
+			ref_key: "trRef",
+			ref: l,
+			class: r(["tr-body", { selected: t.row.selected }]),
+			scroll: "no",
+			style: i(t.row.style),
+			onScroll: u
+		}, [s(n.$slots, "default")], 38));
+	}
+});
+export { l as default };
+
+//# sourceMappingURL=TrBody.vue2.js.map

package/dist/components/DataTable/TrBody.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"TrBody.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"TrBody.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/DataTable/TrBody.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ref, nextTick } from \"vue\";\nimport type { TableRow } from \"./types\";\nimport { tapIf } from \"@milaboratories/helpers\";\n\ndefineProps<{\n  row: TableRow;\n}>();\n\nconst trRef = ref<HTMLElement>();\n\n// hook to prevent weird left scroll after child repaint (@TODO)\nconst onScroll = () => {\n  nextTick().then(() => {\n    tapIf(trRef.value, (el) => (el.scrollLeft = 0));\n  });\n};\n</script>\n\n<template>\n  <div\n    ref=\"trRef\"\n    class=\"tr-body\"\n    scroll=\"no\"\n    :style=\"row.style\"\n    :class=\"{ selected: row.selected }\"\n    @scroll=\"onScroll\"\n  >\n    <slot />\n  </div>\n</template>\n"],"mappings":";;;;;;EASA,IAAM,IAAQ,GAAkB,EAG1B,UAAiB;AACrB,MAAU,CAAC,WAAW;AACpB,MAAM,EAAM,QAAQ,MAAQ,EAAG,aAAa,EAAG;KAC/C;;yBAKF,EASM,OAAA;YARA;GAAJ,KAAI;GACJ,OAAK,EAAA,CAAC,WAAS,EAAA,UAGK,EAAA,IAAI,UAAQ,CAAA,CAAA;GAFhC,QAAO;GACN,OAAK,EAAE,EAAA,IAAI,MAAK;GAER;MAET,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,GAAA"}

package/dist/components/DataTable/TrHead.js

@@ -0,0 +1,5 @@
+import e from "./TrHead.vue2.js";
+var t = e;
+export { t as default };
+
+//# sourceMappingURL=TrHead.js.map

package/dist/components/DataTable/TrHead.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrHead.js","names":[],"sources":["../../../src/components/DataTable/TrHead.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n//\n</script>\n\n<template>\n  <div class=\"tr-head\">\n    <slot />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/DataTable/TrHead.vue2.js

@@ -1,5 +1,10 @@
-import f from "./TrHead.vue.js";
-export {
-  f as default
-};
-//# sourceMappingURL=TrHead.vue2.js.map
+import { createElementBlock as e, defineComponent as t, openBlock as n, renderSlot as r } from "vue";
+var i = { class: "tr-head" }, a = /* @__PURE__ */ t({
+	__name: "TrHead",
+	setup(t) {
+		return (t, a) => (n(), e("div", i, [r(t.$slots, "default")]));
+	}
+});
+export { a as default };
+
+//# sourceMappingURL=TrHead.vue2.js.map

package/dist/components/DataTable/TrHead.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"TrHead.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"TrHead.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/DataTable/TrHead.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n//\n</script>\n\n<template>\n  <div class=\"tr-head\">\n    <slot />\n  </div>\n</template>\n"],"mappings":";;;;yBAKE,EAEM,OAFN,GAEM,CADJ,EAAQ,EAAA,QAAA,UAAA,CAAA,CAAA"}