@treeui/vue 0.18.0 → 0.19.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/TAppShell.cjs.map +1 -1
- package/dist/components/TAppShell.js.map +1 -1
- package/dist/components/TAppShell.vue.d.ts +24 -2
- package/dist/components/TAppShell.vue.d.ts.map +1 -1
- package/dist/components/TAppShell.vue_vue_type_script_setup_true_lang.cjs +1 -1
- package/dist/components/TAppShell.vue_vue_type_script_setup_true_lang.cjs.map +1 -1
- package/dist/components/TAppShell.vue_vue_type_script_setup_true_lang.js +96 -121
- package/dist/components/TAppShell.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/TButton.cjs.map +1 -1
- package/dist/components/TButton.js.map +1 -1
- package/dist/components/TButton.vue.d.ts +21 -0
- package/dist/components/TButton.vue.d.ts.map +1 -1
- package/dist/components/TButton.vue_vue_type_script_setup_true_lang.cjs +1 -1
- package/dist/components/TButton.vue_vue_type_script_setup_true_lang.cjs.map +1 -1
- package/dist/components/TButton.vue_vue_type_script_setup_true_lang.js +47 -31
- package/dist/components/TButton.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/TLanguageSelect.vue.d.ts +1 -1
- package/dist/components/TLanguageSelect.vue.d.ts.map +1 -1
- package/dist/components/TTable.cjs.map +1 -1
- package/dist/components/TTable.js.map +1 -1
- package/dist/components/TTable.vue.d.ts +8 -2
- package/dist/components/TTable.vue.d.ts.map +1 -1
- package/dist/components/TTable.vue_vue_type_script_setup_true_lang.cjs +1 -1
- package/dist/components/TTable.vue_vue_type_script_setup_true_lang.cjs.map +1 -1
- package/dist/components/TTable.vue_vue_type_script_setup_true_lang.js +71 -80
- package/dist/components/TTable.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/TTag.cjs.map +1 -1
- package/dist/components/TTag.js.map +1 -1
- package/dist/components/TTag.vue.d.ts.map +1 -1
- package/dist/components/TTag.vue_vue_type_script_setup_true_lang.cjs +1 -1
- package/dist/components/TTag.vue_vue_type_script_setup_true_lang.cjs.map +1 -1
- package/dist/components/TTag.vue_vue_type_script_setup_true_lang.js +22 -29
- package/dist/components/TTag.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/TText.cjs.map +1 -1
- package/dist/components/TText.js.map +1 -1
- package/dist/components/TText.vue.d.ts +7 -0
- package/dist/components/TText.vue.d.ts.map +1 -1
- package/dist/components/TText.vue_vue_type_script_setup_true_lang.cjs +1 -1
- package/dist/components/TText.vue_vue_type_script_setup_true_lang.cjs.map +1 -1
- package/dist/components/TText.vue_vue_type_script_setup_true_lang.js +8 -1
- package/dist/components/TText.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +3 -3
|
@@ -1,15 +1,18 @@
|
|
|
1
1
|
import e from "./TSpinner.js";
|
|
2
|
-
import { computed as t, createBlock as n, createCommentVNode as r, createElementBlock as i,
|
|
3
|
-
import { tv as
|
|
2
|
+
import { computed as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createVNode as a, defineComponent as o, normalizeClass as s, openBlock as c, renderSlot as l, resolveDynamicComponent as u, withCtx as d } from "vue";
|
|
3
|
+
import { tv as f } from "@treeui/utils";
|
|
4
4
|
//#region src/components/TButton.vue?vue&type=script&setup=true&lang.ts
|
|
5
|
-
var
|
|
5
|
+
var p = {
|
|
6
6
|
key: 0,
|
|
7
7
|
class: "t-button__spinner"
|
|
8
|
-
},
|
|
8
|
+
}, m = {
|
|
9
9
|
key: 1,
|
|
10
10
|
class: "t-button__icon",
|
|
11
11
|
"aria-hidden": "true"
|
|
12
|
-
},
|
|
12
|
+
}, h = {
|
|
13
|
+
key: 2,
|
|
14
|
+
class: "t-button__label"
|
|
15
|
+
}, g = /*@__PURE__*/ o({
|
|
13
16
|
__name: "TButton",
|
|
14
17
|
props: {
|
|
15
18
|
as: { default: "button" },
|
|
@@ -23,6 +26,16 @@ var m = {
|
|
|
23
26
|
type: Boolean,
|
|
24
27
|
default: !1
|
|
25
28
|
},
|
|
29
|
+
loadingLabel: { default: "Loading" },
|
|
30
|
+
hideIconWhileLoading: {
|
|
31
|
+
type: Boolean,
|
|
32
|
+
default: !0
|
|
33
|
+
},
|
|
34
|
+
iconOnly: {
|
|
35
|
+
type: Boolean,
|
|
36
|
+
default: !1
|
|
37
|
+
},
|
|
38
|
+
label: { default: void 0 },
|
|
26
39
|
type: { default: "button" },
|
|
27
40
|
block: {
|
|
28
41
|
type: Boolean,
|
|
@@ -31,8 +44,8 @@ var m = {
|
|
|
31
44
|
align: { default: "center" }
|
|
32
45
|
},
|
|
33
46
|
emits: ["click"],
|
|
34
|
-
setup(
|
|
35
|
-
let
|
|
47
|
+
setup(o, { emit: g }) {
|
|
48
|
+
let _ = o, v = g, y = f({
|
|
36
49
|
base: "t-button",
|
|
37
50
|
variants: {
|
|
38
51
|
variant: {
|
|
@@ -49,39 +62,41 @@ var m = {
|
|
|
49
62
|
lg: "t-button--lg"
|
|
50
63
|
}
|
|
51
64
|
}
|
|
52
|
-
}),
|
|
53
|
-
variant:
|
|
54
|
-
size:
|
|
65
|
+
}), b = t(() => _.as === "button"), x = t(() => _.disabled || _.loading), S = t(() => _.loading && _.hideIconWhileLoading), C = t(() => y({
|
|
66
|
+
variant: _.variant,
|
|
67
|
+
size: _.size,
|
|
55
68
|
class: {
|
|
56
|
-
"is-loading":
|
|
57
|
-
"is-disabled":
|
|
58
|
-
"t-button--block":
|
|
59
|
-
"t-button--
|
|
60
|
-
"t-button--align-
|
|
69
|
+
"is-loading": _.loading,
|
|
70
|
+
"is-disabled": x.value,
|
|
71
|
+
"t-button--block": _.block,
|
|
72
|
+
"t-button--icon": _.iconOnly,
|
|
73
|
+
"t-button--align-start": _.align === "start",
|
|
74
|
+
"t-button--align-end": _.align === "end"
|
|
61
75
|
}
|
|
62
76
|
})), w = (e) => {
|
|
63
|
-
if (
|
|
77
|
+
if (x.value) {
|
|
64
78
|
e.preventDefault(), e.stopPropagation();
|
|
65
79
|
return;
|
|
66
80
|
}
|
|
67
|
-
|
|
81
|
+
v("click", e);
|
|
68
82
|
};
|
|
69
|
-
return (t,
|
|
70
|
-
type:
|
|
71
|
-
class:
|
|
72
|
-
disabled:
|
|
73
|
-
"aria-disabled": !
|
|
74
|
-
"aria-busy":
|
|
75
|
-
|
|
83
|
+
return (t, f) => (c(), n(u(o.as), {
|
|
84
|
+
type: b.value ? o.type : void 0,
|
|
85
|
+
class: s(C.value),
|
|
86
|
+
disabled: b.value ? x.value : void 0,
|
|
87
|
+
"aria-disabled": !b.value && x.value ? "true" : void 0,
|
|
88
|
+
"aria-busy": o.loading || void 0,
|
|
89
|
+
"aria-label": o.label,
|
|
90
|
+
tabindex: !b.value && x.value ? -1 : void 0,
|
|
76
91
|
onClick: w
|
|
77
92
|
}, {
|
|
78
|
-
default:
|
|
79
|
-
|
|
93
|
+
default: d(() => [
|
|
94
|
+
o.loading ? (c(), i("span", p, [a(e, {
|
|
80
95
|
size: "sm",
|
|
81
|
-
label:
|
|
82
|
-
})])) : r("", !0),
|
|
83
|
-
t.$slots.icon ? (
|
|
84
|
-
|
|
96
|
+
label: o.loadingLabel
|
|
97
|
+
}, null, 8, ["label"])])) : r("", !0),
|
|
98
|
+
t.$slots.icon && !S.value ? (c(), i("span", m, [l(t.$slots, "icon")])) : r("", !0),
|
|
99
|
+
o.iconOnly ? r("", !0) : (c(), i("span", h, [l(t.$slots, "default")]))
|
|
85
100
|
]),
|
|
86
101
|
_: 3
|
|
87
102
|
}, 8, [
|
|
@@ -90,11 +105,12 @@ var m = {
|
|
|
90
105
|
"disabled",
|
|
91
106
|
"aria-disabled",
|
|
92
107
|
"aria-busy",
|
|
108
|
+
"aria-label",
|
|
93
109
|
"tabindex"
|
|
94
110
|
]));
|
|
95
111
|
}
|
|
96
112
|
});
|
|
97
113
|
//#endregion
|
|
98
|
-
export {
|
|
114
|
+
export { g as default };
|
|
99
115
|
|
|
100
116
|
//# sourceMappingURL=TButton.vue_vue_type_script_setup_true_lang.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TButton.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../src/components/TButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { tv } from '@treeui/utils';\nimport type { TSize, TVariant } from '../types/contracts';\nimport TSpinner from './TSpinner.vue';\n\nconst props = withDefaults(\n defineProps<{\n as?: string;\n variant?: TVariant | 'brand';\n size?: TSize;\n disabled?: boolean;\n loading?: boolean;\n type?: 'button' | 'submit' | 'reset';\n /** Stretch to the full width of the container. */\n block?: boolean;\n /** Content alignment — only meaningful together with `block`. */\n align?: 'start' | 'center' | 'end';\n }>(),\n {\n as: 'button',\n variant: 'solid',\n size: 'md',\n disabled: false,\n loading: false,\n type: 'button',\n block: false,\n align: 'center',\n },\n);\n\nconst emit = defineEmits<{\n click: [event: MouseEvent];\n}>();\n\nconst buttonClass = tv({\n base: 't-button',\n variants: {\n variant: {\n solid: 't-button--solid',\n outline: 't-button--outline',\n ghost: 't-button--ghost',\n soft: 't-button--soft',\n danger: 't-button--danger',\n brand: 't-button--brand',\n },\n size: {\n sm: 't-button--sm',\n md: 't-button--md',\n lg: 't-button--lg',\n },\n },\n});\n\nconst isNativeButton = computed(() => props.as === 'button');\nconst isDisabled = computed(() => props.disabled || props.loading);\nconst classes = computed(() =>\n buttonClass({\n variant: props.variant,\n size: props.size,\n class: {\n 'is-loading': props.loading,\n 'is-disabled': isDisabled.value,\n 't-button--block': props.block,\n 't-button--align-start': props.align === 'start',\n 't-button--align-end': props.align === 'end',\n },\n }),\n);\n\nconst onClick = (event: MouseEvent) => {\n if (isDisabled.value) {\n event.preventDefault();\n event.stopPropagation();\n return;\n }\n\n emit('click', event);\n};\n</script>\n\n<template>\n <component\n :is=\"as\"\n :type=\"isNativeButton ? type : undefined\"\n :class=\"classes\"\n :disabled=\"isNativeButton ? isDisabled : undefined\"\n :aria-disabled=\"!isNativeButton && isDisabled ? 'true' : undefined\"\n :aria-busy=\"loading || undefined\"\n :tabindex=\"!isNativeButton && isDisabled ? -1 : undefined\"\n @click=\"onClick\"\n >\n <span\n v-if=\"loading\"\n class=\"t-button__spinner\"\n >\n <TSpinner\n size=\"sm\"\n label=\"
|
|
1
|
+
{"version":3,"file":"TButton.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../src/components/TButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { tv } from '@treeui/utils';\nimport type { TSize, TVariant } from '../types/contracts';\nimport TSpinner from './TSpinner.vue';\n\nconst props = withDefaults(\n defineProps<{\n as?: string;\n variant?: TVariant | 'brand';\n size?: TSize;\n disabled?: boolean;\n loading?: boolean;\n /**\n * Accessible announcement while `loading`, forwarded to the spinner.\n * The default is English; pass the active locale's string to localize it.\n */\n loadingLabel?: string;\n /**\n * While `loading`, hide the `icon` slot so the spinner replaces the icon\n * instead of rendering beside it. Set to `false` to keep both visible.\n */\n hideIconWhileLoading?: boolean;\n /**\n * Square, icon-only button. The visible label is dropped, so an accessible\n * name is required — pass `label` (or `aria-label`).\n */\n iconOnly?: boolean;\n /** Accessible name, rendered as `aria-label`. Required when `iconOnly`. */\n label?: string;\n type?: 'button' | 'submit' | 'reset';\n /** Stretch to the full width of the container. */\n block?: boolean;\n /** Content alignment — only meaningful together with `block`. */\n align?: 'start' | 'center' | 'end';\n }>(),\n {\n as: 'button',\n variant: 'solid',\n size: 'md',\n disabled: false,\n loading: false,\n loadingLabel: 'Loading',\n hideIconWhileLoading: true,\n iconOnly: false,\n label: undefined,\n type: 'button',\n block: false,\n align: 'center',\n },\n);\n\nconst emit = defineEmits<{\n click: [event: MouseEvent];\n}>();\n\nconst buttonClass = tv({\n base: 't-button',\n variants: {\n variant: {\n solid: 't-button--solid',\n outline: 't-button--outline',\n ghost: 't-button--ghost',\n soft: 't-button--soft',\n danger: 't-button--danger',\n brand: 't-button--brand',\n },\n size: {\n sm: 't-button--sm',\n md: 't-button--md',\n lg: 't-button--lg',\n },\n },\n});\n\nconst isNativeButton = computed(() => props.as === 'button');\nconst isDisabled = computed(() => props.disabled || props.loading);\n\n// The spinner takes the icon's leading position, so rendering both would show\n// two glyphs and widen the button mid-action.\nconst isIconHidden = computed(() => props.loading && props.hideIconWhileLoading);\n\nconst classes = computed(() =>\n buttonClass({\n variant: props.variant,\n size: props.size,\n class: {\n 'is-loading': props.loading,\n 'is-disabled': isDisabled.value,\n 't-button--block': props.block,\n 't-button--icon': props.iconOnly,\n 't-button--align-start': props.align === 'start',\n 't-button--align-end': props.align === 'end',\n },\n }),\n);\n\nconst onClick = (event: MouseEvent) => {\n if (isDisabled.value) {\n event.preventDefault();\n event.stopPropagation();\n return;\n }\n\n emit('click', event);\n};\n</script>\n\n<template>\n <component\n :is=\"as\"\n :type=\"isNativeButton ? type : undefined\"\n :class=\"classes\"\n :disabled=\"isNativeButton ? isDisabled : undefined\"\n :aria-disabled=\"!isNativeButton && isDisabled ? 'true' : undefined\"\n :aria-busy=\"loading || undefined\"\n :aria-label=\"label\"\n :tabindex=\"!isNativeButton && isDisabled ? -1 : undefined\"\n @click=\"onClick\"\n >\n <span\n v-if=\"loading\"\n class=\"t-button__spinner\"\n >\n <TSpinner\n size=\"sm\"\n :label=\"loadingLabel\"\n />\n </span>\n <span\n v-if=\"$slots.icon && !isIconHidden\"\n class=\"t-button__icon\"\n aria-hidden=\"true\"\n >\n <slot name=\"icon\" />\n </span>\n <span\n v-if=\"!iconOnly\"\n class=\"t-button__label\"\n >\n <slot />\n </span>\n </component>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMA,IAAM,IAAQ,GA8CR,IAAO,GAIP,IAAc,EAAG;GACrB,MAAM;GACN,UAAU;IACR,SAAS;KACP,OAAO;KACP,SAAS;KACT,OAAO;KACP,MAAM;KACN,QAAQ;KACR,OAAO;IACT;IACA,MAAM;KACJ,IAAI;KACJ,IAAI;KACJ,IAAI;IACN;GACF;EACF,CAAC,GAEK,IAAiB,QAAe,EAAM,OAAO,QAAQ,GACrD,IAAa,QAAe,EAAM,YAAY,EAAM,OAAO,GAI3D,IAAe,QAAe,EAAM,WAAW,EAAM,oBAAoB,GAEzE,IAAU,QACd,EAAY;GACV,SAAS,EAAM;GACf,MAAM,EAAM;GACZ,OAAO;IACL,cAAc,EAAM;IACpB,eAAe,EAAW;IAC1B,mBAAmB,EAAM;IACzB,kBAAkB,EAAM;IACxB,yBAAyB,EAAM,UAAU;IACzC,uBAAuB,EAAM,UAAU;GACzC;EACF,CAAC,CACH,GAEM,KAAW,MAAsB;GACrC,IAAI,EAAW,OAAO;IAEpB,AADA,EAAM,eAAe,GACrB,EAAM,gBAAgB;IACtB;GACF;GAEA,EAAK,SAAS,CAAK;EACrB;yBAIE,EAiCY,EAhCL,EAAA,EAAE,GAAA;GACN,MAAM,EAAA,QAAiB,EAAA,OAAO,KAAA;GAC9B,OAAK,EAAE,EAAA,KAAO;GACd,UAAU,EAAA,QAAiB,EAAA,QAAa,KAAA;GACxC,iBAAa,CAAG,EAAA,SAAkB,EAAA,QAAU,SAAY,KAAA;GACxD,aAAW,EAAA,WAAW,KAAA;GACtB,cAAY,EAAA;GACZ,UAAQ,CAAG,EAAA,SAAkB,EAAA,QAAU,KAAQ,KAAA;GACxC;;oBAUD;IAPC,EAAA,WAAA,EAAA,GADR,EAQO,QARP,GAQO,CAJL,EAGE,GAAA;KAFA,MAAK;KACJ,OAAO,EAAA;;IAIJA,EAAAA,OAAO,QAAI,CAAK,EAAA,SAAA,EAAA,GADxB,EAMO,QANP,GAMO,CADL,EAAoB,EAAA,QAAA,MAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA;IAGb,EAAA,WAGC,EAAA,IAAA,EAAA,KAHD,EAAA,GADT,EAKO,QALP,GAKO,CADL,EAAQ,EAAA,QAAA,SAAA,CAAA,CAAA"}
|
|
@@ -80,13 +80,13 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
|
|
|
80
80
|
width: TFieldWidth;
|
|
81
81
|
variant: TLanguageSelectVariant;
|
|
82
82
|
loading: boolean;
|
|
83
|
+
iconOnly: boolean;
|
|
83
84
|
invalid: boolean;
|
|
84
85
|
options: TLanguageOption[];
|
|
85
86
|
open: boolean;
|
|
86
87
|
defaultOpen: boolean;
|
|
87
88
|
placeholder: string;
|
|
88
89
|
emptyText: string;
|
|
89
|
-
iconOnly: boolean;
|
|
90
90
|
flagBaseUrl: string;
|
|
91
91
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
92
92
|
rootRef: HTMLDivElement;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TLanguageSelect.vue.d.ts","sourceRoot":"","sources":["../../src/components/TLanguageSelect.vue"],"names":[],"mappings":"AAifA,OAAO,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAS7D;;;;;;;;GAQG;AACH,MAAM,MAAM,sBAAsB,GAAG,OAAO,GAAG,UAAU,CAAC;AAE1D,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,kFAAkF;IAClF,KAAK,EAAE,MAAM,CAAC;IACd,mFAAmF;IACnF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mDAAmD;IACnD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,KAAK,WAAW,GAAG;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,eAAe,EAAE,CAAC;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,oEAAoE;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kDAAkD;IAClD,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAmTJ,iBAAS,cAAc;WAyOT,OAAO,IAA6B;;iBA/fvC,MAAM,OAAO;iBACb,CAAC,KAAK,EAAE;YAAE,MAAM,EAAE,eAAe,CAAC;YAAC,QAAQ,EAAE,OAAO,CAAC;YAAC,OAAO,EAAE,OAAO,CAAA;SAAE,KAAK,OAAO;gBACrF,MAAM,OAAO;;iBAFZ,MAAM,OAAO;iBACb,CAAC,KAAK,EAAE;YAAE,MAAM,EAAE,eAAe,CAAC;YAAC,QAAQ,EAAE,OAAO,CAAC;YAAC,OAAO,EAAE,OAAO,CAAA;SAAE,KAAK,OAAO;gBACrF,MAAM,OAAO;;;;;;;;EAkgBtB;AAgCD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;gBAnlBJ,MAAM;cAUR,OAAO;UANX,KAAK;WAKJ,WAAW;aAJT,sBAAsB;aAMtB,OAAO;
|
|
1
|
+
{"version":3,"file":"TLanguageSelect.vue.d.ts","sourceRoot":"","sources":["../../src/components/TLanguageSelect.vue"],"names":[],"mappings":"AAifA,OAAO,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAS7D;;;;;;;;GAQG;AACH,MAAM,MAAM,sBAAsB,GAAG,OAAO,GAAG,UAAU,CAAC;AAE1D,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,kFAAkF;IAClF,KAAK,EAAE,MAAM,CAAC;IACd,mFAAmF;IACnF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mDAAmD;IACnD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,KAAK,WAAW,GAAG;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,eAAe,EAAE,CAAC;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,oEAAoE;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kDAAkD;IAClD,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAmTJ,iBAAS,cAAc;WAyOT,OAAO,IAA6B;;iBA/fvC,MAAM,OAAO;iBACb,CAAC,KAAK,EAAE;YAAE,MAAM,EAAE,eAAe,CAAC;YAAC,QAAQ,EAAE,OAAO,CAAC;YAAC,OAAO,EAAE,OAAO,CAAA;SAAE,KAAK,OAAO;gBACrF,MAAM,OAAO;;iBAFZ,MAAM,OAAO;iBACb,CAAC,KAAK,EAAE;YAAE,MAAM,EAAE,eAAe,CAAC;YAAC,QAAQ,EAAE,OAAO,CAAC;YAAC,OAAO,EAAE,OAAO,CAAA;SAAE,KAAK,OAAO;gBACrF,MAAM,OAAO;;;;;;;;EAkgBtB;AAgCD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;gBAnlBJ,MAAM;cAUR,OAAO;UANX,KAAK;WAKJ,WAAW;aAJT,sBAAsB;aAMtB,OAAO;cAJN,OAAO;aAKR,OAAO;aAXP,eAAe,EAAE;UACpB,OAAO;iBACA,OAAO;iBAUP,MAAM;eAGR,MAAM;iBADJ,MAAM;;;;;OA6kBtB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TTable.cjs","names":[],"sources":["../../src/components/TTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue';\nimport type { TSize } from '../types/contracts';\n\nexport type TTableColumn = {\n key: string;\n label: string;\n sortable?: boolean;\n align?: 'left' | 'center' | 'right';\n width?: string;\n};\n\nexport type TTableSortDirection = 'asc' | 'desc' | 'none';\n\nexport type TTableSortState = {\n key: string;\n direction: TTableSortDirection;\n};\n\nconst props = withDefaults(\n defineProps<{\n columns: TTableColumn[];\n rows: Record<string, unknown>[];\n size?: TSize;\n sortBy?: TTableSortState;\n }>(),\n {\n size: 'md',\n sortBy: undefined,\n },\n);\n\nconst emit = defineEmits<{\n (e: 'sort', state: TTableSortState): void;\n}>();\n\ndefineSlots<{\n [key: `cell-${string}`]: (props: { row: Record<string, unknown>; value: unknown }) => void;\n [key: `header-${string}`]: (props: { column: TTableColumn }) => void;\n empty: () => void;\n}>();\n\nconst internalSort = ref<TTableSortState | undefined>(undefined);\n\nconst currentSort = computed(() => props.sortBy ?? internalSort.value);\n\nconst classes = computed(() => [\n 't-table',\n `t-table--${props.size}`,\n]);\n\nconst sortedRows = computed(() => {\n const sort = currentSort.value;\n if (!sort || sort.direction === 'none') return props.rows;\n\n return [...props.rows].sort((a, b) => {\n const aVal = a[sort.key];\n const bVal = b[sort.key];\n\n if (aVal == null && bVal == null) return 0;\n if (aVal == null) return 1;\n if (bVal == null) return -1;\n\n const cmp =\n typeof aVal === 'number' && typeof bVal === 'number'\n ? aVal - bVal\n : String(aVal).localeCompare(String(bVal));\n\n return sort.direction === 'desc' ? -cmp : cmp;\n });\n});\n\nfunction handleSort(column: TTableColumn) {\n if (!column.sortable) return;\n\n const cur = currentSort.value;\n let direction: TTableSortDirection = 'asc';\n\n if (cur?.key === column.key) {\n if (cur.direction === 'asc') direction = 'desc';\n else if (cur.direction === 'desc') direction = 'none';\n else direction = 'asc';\n }\n\n const state: TTableSortState = { key: column.key, direction };\n internalSort.value = state;\n emit('sort', state);\n}\n\nfunction sortAriaSort(column: TTableColumn): 'none' | 'ascending' | 'descending' | undefined {\n if (!column.sortable) return undefined;\n const cur = currentSort.value;\n if (cur?.key !== column.key || cur.direction === 'none') return 'none';\n return cur.direction === 'asc' ? 'ascending' : 'descending';\n}\n\nfunction handleHeaderKeydown(event: KeyboardEvent, column: TTableColumn) {\n if (column.sortable && (event.key === 'Enter' || event.key === ' ')) {\n event.preventDefault();\n handleSort(column);\n }\n}\n</script>\n\n<template>\n <div
|
|
1
|
+
{"version":3,"file":"TTable.cjs","names":[],"sources":["../../src/components/TTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, useAttrs } from 'vue';\nimport type { TIconName } from '@treeui/icons';\nimport type { TSize } from '../types/contracts';\nimport TIcon from './TIcon.vue';\n\n// The scroll container is the root element, but the accessible name and any\n// aria-*/id belong on the <table> itself, so attrs are split rather than\n// inherited onto the wrapper.\ndefineOptions({\n inheritAttrs: false,\n});\n\nexport type TTableColumn = {\n key: string;\n label: string;\n sortable?: boolean;\n align?: 'left' | 'center' | 'right';\n width?: string;\n};\n\nexport type TTableSortDirection = 'asc' | 'desc' | 'none';\n\nexport type TTableSortState = {\n key: string;\n direction: TTableSortDirection;\n};\n\nconst props = withDefaults(\n defineProps<{\n columns: TTableColumn[];\n rows: Record<string, unknown>[];\n size?: TSize;\n sortBy?: TTableSortState;\n /**\n * Visible `<caption>` naming the table. For a name without visible text,\n * pass `aria-label` / `aria-labelledby` instead — both land on the `<table>`.\n */\n caption?: string;\n }>(),\n {\n size: 'md',\n sortBy: undefined,\n caption: undefined,\n },\n);\n\nconst emit = defineEmits<{\n (e: 'sort', state: TTableSortState): void;\n}>();\n\ndefineSlots<{\n [key: `cell-${string}`]: (props: { row: Record<string, unknown>; value: unknown }) => void;\n [key: `header-${string}`]: (props: { column: TTableColumn }) => void;\n empty: () => void;\n}>();\n\nconst internalSort = ref<TTableSortState | undefined>(undefined);\n\nconst currentSort = computed(() => props.sortBy ?? internalSort.value);\n\nconst classes = computed(() => [\n 't-table',\n `t-table--${props.size}`,\n]);\n\nconst sortedRows = computed(() => {\n const sort = currentSort.value;\n if (!sort || sort.direction === 'none') return props.rows;\n\n return [...props.rows].sort((a, b) => {\n const aVal = a[sort.key];\n const bVal = b[sort.key];\n\n if (aVal == null && bVal == null) return 0;\n if (aVal == null) return 1;\n if (bVal == null) return -1;\n\n const cmp =\n typeof aVal === 'number' && typeof bVal === 'number'\n ? aVal - bVal\n : String(aVal).localeCompare(String(bVal));\n\n return sort.direction === 'desc' ? -cmp : cmp;\n });\n});\n\nfunction handleSort(column: TTableColumn) {\n if (!column.sortable) return;\n\n const cur = currentSort.value;\n let direction: TTableSortDirection = 'asc';\n\n if (cur?.key === column.key) {\n if (cur.direction === 'asc') direction = 'desc';\n else if (cur.direction === 'desc') direction = 'none';\n else direction = 'asc';\n }\n\n const state: TTableSortState = { key: column.key, direction };\n internalSort.value = state;\n emit('sort', state);\n}\n\nfunction sortAriaSort(column: TTableColumn): 'none' | 'ascending' | 'descending' | undefined {\n if (!column.sortable) return undefined;\n const cur = currentSort.value;\n if (cur?.key !== column.key || cur.direction === 'none') return 'none';\n return cur.direction === 'asc' ? 'ascending' : 'descending';\n}\n\nfunction handleHeaderKeydown(event: KeyboardEvent, column: TTableColumn) {\n if (column.sortable && (event.key === 'Enter' || event.key === ' ')) {\n event.preventDefault();\n handleSort(column);\n }\n}\n\nfunction isSortedBy(column: TTableColumn): boolean {\n const cur = currentSort.value;\n return cur?.key === column.key && cur.direction !== 'none';\n}\n\nfunction sortIconName(column: TTableColumn): TIconName {\n const cur = currentSort.value;\n if (!isSortedBy(column)) return 'chevrons-up-down';\n return cur?.direction === 'asc' ? 'chevron-up' : 'chevron-down';\n}\n\nconst attrs = useAttrs();\n\n// class/style stay on the scroll wrapper (the root); everything else —\n// aria-label, aria-labelledby, id, data-* — is forwarded to the <table>.\nconst tableAttrs = computed(() => {\n const { class: _class, style: _style, ...rest } = attrs;\n return rest;\n});\n</script>\n\n<template>\n <div\n class=\"t-table-wrapper\"\n :class=\"attrs.class\"\n :style=\"attrs.style\"\n >\n <table\n v-bind=\"tableAttrs\"\n :class=\"classes\"\n >\n <caption\n v-if=\"caption\"\n class=\"t-table__caption\"\n >\n {{ caption }}\n </caption>\n <thead class=\"t-table__head\">\n <tr class=\"t-table__row\">\n <th\n v-for=\"column in columns\"\n :key=\"column.key\"\n class=\"t-table__header\"\n :class=\"[\n column.sortable ? 't-table__header--sortable' : '',\n column.align ? `t-table__header--${column.align}` : '',\n ]\"\n :style=\"column.width ? { width: column.width } : undefined\"\n :aria-sort=\"sortAriaSort(column)\"\n :tabindex=\"column.sortable ? 0 : undefined\"\n scope=\"col\"\n @click=\"handleSort(column)\"\n @keydown=\"handleHeaderKeydown($event, column)\"\n >\n <slot\n :name=\"`header-${column.key}`\"\n :column=\"column\"\n >\n <span class=\"t-table__header-content\">\n {{ column.label }}\n <span\n v-if=\"column.sortable\"\n class=\"t-table__sort-icon\"\n :class=\"{ 'is-inactive': !isSortedBy(column) }\"\n aria-hidden=\"true\"\n >\n <TIcon\n :name=\"sortIconName(column)\"\n :size=\"14\"\n />\n </span>\n </span>\n </slot>\n </th>\n </tr>\n </thead>\n <tbody class=\"t-table__body\">\n <tr\n v-if=\"sortedRows.length === 0\"\n class=\"t-table__row t-table__row--empty\"\n >\n <td\n :colspan=\"columns.length\"\n class=\"t-table__cell t-table__cell--empty\"\n >\n <slot name=\"empty\">\n No data available.\n </slot>\n </td>\n </tr>\n <tr\n v-for=\"(row, index) in sortedRows\"\n :key=\"index\"\n class=\"t-table__row\"\n >\n <td\n v-for=\"column in columns\"\n :key=\"column.key\"\n class=\"t-table__cell\"\n :class=\"column.align ? `t-table__cell--${column.align}` : ''\"\n >\n <slot\n :name=\"`cell-${column.key}`\"\n :row=\"row\"\n :value=\"row[column.key]\"\n >\n {{ row[column.key] ?? '' }}\n </slot>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n</template>\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TTable.js","names":[],"sources":["../../src/components/TTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue';\nimport type { TSize } from '../types/contracts';\n\nexport type TTableColumn = {\n key: string;\n label: string;\n sortable?: boolean;\n align?: 'left' | 'center' | 'right';\n width?: string;\n};\n\nexport type TTableSortDirection = 'asc' | 'desc' | 'none';\n\nexport type TTableSortState = {\n key: string;\n direction: TTableSortDirection;\n};\n\nconst props = withDefaults(\n defineProps<{\n columns: TTableColumn[];\n rows: Record<string, unknown>[];\n size?: TSize;\n sortBy?: TTableSortState;\n }>(),\n {\n size: 'md',\n sortBy: undefined,\n },\n);\n\nconst emit = defineEmits<{\n (e: 'sort', state: TTableSortState): void;\n}>();\n\ndefineSlots<{\n [key: `cell-${string}`]: (props: { row: Record<string, unknown>; value: unknown }) => void;\n [key: `header-${string}`]: (props: { column: TTableColumn }) => void;\n empty: () => void;\n}>();\n\nconst internalSort = ref<TTableSortState | undefined>(undefined);\n\nconst currentSort = computed(() => props.sortBy ?? internalSort.value);\n\nconst classes = computed(() => [\n 't-table',\n `t-table--${props.size}`,\n]);\n\nconst sortedRows = computed(() => {\n const sort = currentSort.value;\n if (!sort || sort.direction === 'none') return props.rows;\n\n return [...props.rows].sort((a, b) => {\n const aVal = a[sort.key];\n const bVal = b[sort.key];\n\n if (aVal == null && bVal == null) return 0;\n if (aVal == null) return 1;\n if (bVal == null) return -1;\n\n const cmp =\n typeof aVal === 'number' && typeof bVal === 'number'\n ? aVal - bVal\n : String(aVal).localeCompare(String(bVal));\n\n return sort.direction === 'desc' ? -cmp : cmp;\n });\n});\n\nfunction handleSort(column: TTableColumn) {\n if (!column.sortable) return;\n\n const cur = currentSort.value;\n let direction: TTableSortDirection = 'asc';\n\n if (cur?.key === column.key) {\n if (cur.direction === 'asc') direction = 'desc';\n else if (cur.direction === 'desc') direction = 'none';\n else direction = 'asc';\n }\n\n const state: TTableSortState = { key: column.key, direction };\n internalSort.value = state;\n emit('sort', state);\n}\n\nfunction sortAriaSort(column: TTableColumn): 'none' | 'ascending' | 'descending' | undefined {\n if (!column.sortable) return undefined;\n const cur = currentSort.value;\n if (cur?.key !== column.key || cur.direction === 'none') return 'none';\n return cur.direction === 'asc' ? 'ascending' : 'descending';\n}\n\nfunction handleHeaderKeydown(event: KeyboardEvent, column: TTableColumn) {\n if (column.sortable && (event.key === 'Enter' || event.key === ' ')) {\n event.preventDefault();\n handleSort(column);\n }\n}\n</script>\n\n<template>\n <div
|
|
1
|
+
{"version":3,"file":"TTable.js","names":[],"sources":["../../src/components/TTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, useAttrs } from 'vue';\nimport type { TIconName } from '@treeui/icons';\nimport type { TSize } from '../types/contracts';\nimport TIcon from './TIcon.vue';\n\n// The scroll container is the root element, but the accessible name and any\n// aria-*/id belong on the <table> itself, so attrs are split rather than\n// inherited onto the wrapper.\ndefineOptions({\n inheritAttrs: false,\n});\n\nexport type TTableColumn = {\n key: string;\n label: string;\n sortable?: boolean;\n align?: 'left' | 'center' | 'right';\n width?: string;\n};\n\nexport type TTableSortDirection = 'asc' | 'desc' | 'none';\n\nexport type TTableSortState = {\n key: string;\n direction: TTableSortDirection;\n};\n\nconst props = withDefaults(\n defineProps<{\n columns: TTableColumn[];\n rows: Record<string, unknown>[];\n size?: TSize;\n sortBy?: TTableSortState;\n /**\n * Visible `<caption>` naming the table. For a name without visible text,\n * pass `aria-label` / `aria-labelledby` instead — both land on the `<table>`.\n */\n caption?: string;\n }>(),\n {\n size: 'md',\n sortBy: undefined,\n caption: undefined,\n },\n);\n\nconst emit = defineEmits<{\n (e: 'sort', state: TTableSortState): void;\n}>();\n\ndefineSlots<{\n [key: `cell-${string}`]: (props: { row: Record<string, unknown>; value: unknown }) => void;\n [key: `header-${string}`]: (props: { column: TTableColumn }) => void;\n empty: () => void;\n}>();\n\nconst internalSort = ref<TTableSortState | undefined>(undefined);\n\nconst currentSort = computed(() => props.sortBy ?? internalSort.value);\n\nconst classes = computed(() => [\n 't-table',\n `t-table--${props.size}`,\n]);\n\nconst sortedRows = computed(() => {\n const sort = currentSort.value;\n if (!sort || sort.direction === 'none') return props.rows;\n\n return [...props.rows].sort((a, b) => {\n const aVal = a[sort.key];\n const bVal = b[sort.key];\n\n if (aVal == null && bVal == null) return 0;\n if (aVal == null) return 1;\n if (bVal == null) return -1;\n\n const cmp =\n typeof aVal === 'number' && typeof bVal === 'number'\n ? aVal - bVal\n : String(aVal).localeCompare(String(bVal));\n\n return sort.direction === 'desc' ? -cmp : cmp;\n });\n});\n\nfunction handleSort(column: TTableColumn) {\n if (!column.sortable) return;\n\n const cur = currentSort.value;\n let direction: TTableSortDirection = 'asc';\n\n if (cur?.key === column.key) {\n if (cur.direction === 'asc') direction = 'desc';\n else if (cur.direction === 'desc') direction = 'none';\n else direction = 'asc';\n }\n\n const state: TTableSortState = { key: column.key, direction };\n internalSort.value = state;\n emit('sort', state);\n}\n\nfunction sortAriaSort(column: TTableColumn): 'none' | 'ascending' | 'descending' | undefined {\n if (!column.sortable) return undefined;\n const cur = currentSort.value;\n if (cur?.key !== column.key || cur.direction === 'none') return 'none';\n return cur.direction === 'asc' ? 'ascending' : 'descending';\n}\n\nfunction handleHeaderKeydown(event: KeyboardEvent, column: TTableColumn) {\n if (column.sortable && (event.key === 'Enter' || event.key === ' ')) {\n event.preventDefault();\n handleSort(column);\n }\n}\n\nfunction isSortedBy(column: TTableColumn): boolean {\n const cur = currentSort.value;\n return cur?.key === column.key && cur.direction !== 'none';\n}\n\nfunction sortIconName(column: TTableColumn): TIconName {\n const cur = currentSort.value;\n if (!isSortedBy(column)) return 'chevrons-up-down';\n return cur?.direction === 'asc' ? 'chevron-up' : 'chevron-down';\n}\n\nconst attrs = useAttrs();\n\n// class/style stay on the scroll wrapper (the root); everything else —\n// aria-label, aria-labelledby, id, data-* — is forwarded to the <table>.\nconst tableAttrs = computed(() => {\n const { class: _class, style: _style, ...rest } = attrs;\n return rest;\n});\n</script>\n\n<template>\n <div\n class=\"t-table-wrapper\"\n :class=\"attrs.class\"\n :style=\"attrs.style\"\n >\n <table\n v-bind=\"tableAttrs\"\n :class=\"classes\"\n >\n <caption\n v-if=\"caption\"\n class=\"t-table__caption\"\n >\n {{ caption }}\n </caption>\n <thead class=\"t-table__head\">\n <tr class=\"t-table__row\">\n <th\n v-for=\"column in columns\"\n :key=\"column.key\"\n class=\"t-table__header\"\n :class=\"[\n column.sortable ? 't-table__header--sortable' : '',\n column.align ? `t-table__header--${column.align}` : '',\n ]\"\n :style=\"column.width ? { width: column.width } : undefined\"\n :aria-sort=\"sortAriaSort(column)\"\n :tabindex=\"column.sortable ? 0 : undefined\"\n scope=\"col\"\n @click=\"handleSort(column)\"\n @keydown=\"handleHeaderKeydown($event, column)\"\n >\n <slot\n :name=\"`header-${column.key}`\"\n :column=\"column\"\n >\n <span class=\"t-table__header-content\">\n {{ column.label }}\n <span\n v-if=\"column.sortable\"\n class=\"t-table__sort-icon\"\n :class=\"{ 'is-inactive': !isSortedBy(column) }\"\n aria-hidden=\"true\"\n >\n <TIcon\n :name=\"sortIconName(column)\"\n :size=\"14\"\n />\n </span>\n </span>\n </slot>\n </th>\n </tr>\n </thead>\n <tbody class=\"t-table__body\">\n <tr\n v-if=\"sortedRows.length === 0\"\n class=\"t-table__row t-table__row--empty\"\n >\n <td\n :colspan=\"columns.length\"\n class=\"t-table__cell t-table__cell--empty\"\n >\n <slot name=\"empty\">\n No data available.\n </slot>\n </td>\n </tr>\n <tr\n v-for=\"(row, index) in sortedRows\"\n :key=\"index\"\n class=\"t-table__row\"\n >\n <td\n v-for=\"column in columns\"\n :key=\"column.key\"\n class=\"t-table__cell\"\n :class=\"column.align ? `t-table__cell--${column.align}` : ''\"\n >\n <slot\n :name=\"`cell-${column.key}`\"\n :row=\"row\"\n :value=\"row[column.key]\"\n >\n {{ row[column.key] ?? '' }}\n </slot>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n</template>\n"],"mappings":""}
|
|
@@ -16,6 +16,11 @@ type __VLS_Props = {
|
|
|
16
16
|
rows: Record<string, unknown>[];
|
|
17
17
|
size?: TSize;
|
|
18
18
|
sortBy?: TTableSortState;
|
|
19
|
+
/**
|
|
20
|
+
* Visible `<caption>` naming the table. For a name without visible text,
|
|
21
|
+
* pass `aria-label` / `aria-labelledby` instead — both land on the `<table>`.
|
|
22
|
+
*/
|
|
23
|
+
caption?: string;
|
|
19
24
|
};
|
|
20
25
|
declare function __VLS_template(): {
|
|
21
26
|
attrs: Partial<{}>;
|
|
@@ -39,7 +44,7 @@ declare function __VLS_template(): {
|
|
|
39
44
|
empty: () => void;
|
|
40
45
|
};
|
|
41
46
|
refs: {};
|
|
42
|
-
rootEl:
|
|
47
|
+
rootEl: any;
|
|
43
48
|
};
|
|
44
49
|
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
45
50
|
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
@@ -48,8 +53,9 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
|
|
|
48
53
|
onSort?: ((state: TTableSortState) => any) | undefined;
|
|
49
54
|
}>, {
|
|
50
55
|
size: TSize;
|
|
56
|
+
caption: string;
|
|
51
57
|
sortBy: TTableSortState;
|
|
52
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {},
|
|
58
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
53
59
|
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
54
60
|
export default _default;
|
|
55
61
|
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TTable.vue.d.ts","sourceRoot":"","sources":["../../src/components/TTable.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TTable.vue.d.ts","sourceRoot":"","sources":["../../src/components/TTable.vue"],"names":[],"mappings":"AA4OA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAUhD,MAAM,MAAM,YAAY,GAAG;IACzB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;AAE1D,MAAM,MAAM,eAAe,GAAG;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,mBAAmB,CAAC;CAChC,CAAC;AAEF,KAAK,WAAW,GAAG;IACf,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;IAChC,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AA6GJ,iBAAS,cAAc;WAkHT,OAAO,IAA6B;;yCA/Mf;YAAE,GAAG,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YAAC,KAAK,EAAE,OAAO,CAAA;SAAE,KAAK,IAAI;2CACvD;YAAE,MAAM,EAAE,YAAY,CAAA;SAAE,KAAK,IAAI;eAC7D,MAAM,IAAI;;yCAFgB;YAAE,GAAG,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YAAC,KAAK,EAAE,OAAO,CAAA;SAAE,KAAK,IAAI;2CACvD;YAAE,MAAM,EAAE,YAAY,CAAA;SAAE,KAAK,IAAI;eAC7D,MAAM,IAAI;;;;EAkNlB;AAoBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;UAhQV,KAAK;aAMF,MAAM;YALP,eAAe;6EAuQ1B,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
const e=require("./TIcon.cjs");let t=require("vue");var n={key:0,class:`t-table__caption`},r={class:`t-table__head`},i={class:`t-table__row`},a=[`aria-sort`,`tabindex`,`onClick`,`onKeydown`],o={class:`t-table__header-content`},s={class:`t-table__body`},c={key:0,class:`t-table__row t-table__row--empty`},l=[`colspan`],u=(0,t.defineComponent)({inheritAttrs:!1,__name:`TTable`,props:{columns:{},rows:{},size:{default:`md`},sortBy:{default:void 0},caption:{default:void 0}},emits:[`sort`],setup(u,{emit:d}){let f=u,p=d,m=(0,t.ref)(void 0),h=(0,t.computed)(()=>f.sortBy??m.value),g=(0,t.computed)(()=>[`t-table`,`t-table--${f.size}`]),_=(0,t.computed)(()=>{let e=h.value;return!e||e.direction===`none`?f.rows:[...f.rows].sort((t,n)=>{let r=t[e.key],i=n[e.key];if(r==null&&i==null)return 0;if(r==null)return 1;if(i==null)return-1;let a=typeof r==`number`&&typeof i==`number`?r-i:String(r).localeCompare(String(i));return e.direction===`desc`?-a:a})});function v(e){if(!e.sortable)return;let t=h.value,n=`asc`;t?.key===e.key&&(n=t.direction===`asc`?`desc`:t.direction===`desc`?`none`:`asc`);let r={key:e.key,direction:n};m.value=r,p(`sort`,r)}function y(e){if(!e.sortable)return;let t=h.value;return t?.key!==e.key||t.direction===`none`?`none`:t.direction===`asc`?`ascending`:`descending`}function b(e,t){t.sortable&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),v(t))}function x(e){let t=h.value;return t?.key===e.key&&t.direction!==`none`}function S(e){let t=h.value;return x(e)?t?.direction===`asc`?`chevron-up`:`chevron-down`:`chevrons-up-down`}let C=(0,t.useAttrs)(),w=(0,t.computed)(()=>{let{class:e,style:t,...n}=C;return n});return(d,f)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{class:(0,t.normalizeClass)([`t-table-wrapper`,(0,t.unref)(C).class]),style:(0,t.normalizeStyle)((0,t.unref)(C).style)},[(0,t.createElementVNode)(`table`,(0,t.mergeProps)(w.value,{class:g.value}),[u.caption?((0,t.openBlock)(),(0,t.createElementBlock)(`caption`,n,(0,t.toDisplayString)(u.caption),1)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`thead`,r,[(0,t.createElementVNode)(`tr`,i,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(u.columns,n=>((0,t.openBlock)(),(0,t.createElementBlock)(`th`,{key:n.key,class:(0,t.normalizeClass)([`t-table__header`,[n.sortable?`t-table__header--sortable`:``,n.align?`t-table__header--${n.align}`:``]]),style:(0,t.normalizeStyle)(n.width?{width:n.width}:void 0),"aria-sort":y(n),tabindex:n.sortable?0:void 0,scope:`col`,onClick:e=>v(n),onKeydown:e=>b(e,n)},[(0,t.renderSlot)(d.$slots,`header-${n.key}`,{column:n},()=>[(0,t.createElementVNode)(`span`,o,[(0,t.createTextVNode)((0,t.toDisplayString)(n.label)+` `,1),n.sortable?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,{key:0,class:(0,t.normalizeClass)([`t-table__sort-icon`,{"is-inactive":!x(n)}]),"aria-hidden":`true`},[(0,t.createVNode)(e.default,{name:S(n),size:14},null,8,[`name`])],2)):(0,t.createCommentVNode)(``,!0)])])],46,a))),128))])]),(0,t.createElementVNode)(`tbody`,s,[_.value.length===0?((0,t.openBlock)(),(0,t.createElementBlock)(`tr`,c,[(0,t.createElementVNode)(`td`,{colspan:u.columns.length,class:`t-table__cell t-table__cell--empty`},[(0,t.renderSlot)(d.$slots,`empty`,{},()=>[f[0]||=(0,t.createTextVNode)(` No data available. `,-1)])],8,l)])):(0,t.createCommentVNode)(``,!0),((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(_.value,(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`tr`,{key:n,class:`t-table__row`},[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(u.columns,n=>((0,t.openBlock)(),(0,t.createElementBlock)(`td`,{key:n.key,class:(0,t.normalizeClass)([`t-table__cell`,n.align?`t-table__cell--${n.align}`:``])},[(0,t.renderSlot)(d.$slots,`cell-${n.key}`,{row:e,value:e[n.key]},()=>[(0,t.createTextVNode)((0,t.toDisplayString)(e[n.key]??``),1)])],2))),128))]))),128))])],16)],6))}});exports.default=u;
|
|
2
2
|
//# sourceMappingURL=TTable.vue_vue_type_script_setup_true_lang.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TTable.vue_vue_type_script_setup_true_lang.cjs","names":[],"sources":["../../src/components/TTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue';\nimport type { TSize } from '../types/contracts';\n\nexport type TTableColumn = {\n key: string;\n label: string;\n sortable?: boolean;\n align?: 'left' | 'center' | 'right';\n width?: string;\n};\n\nexport type TTableSortDirection = 'asc' | 'desc' | 'none';\n\nexport type TTableSortState = {\n key: string;\n direction: TTableSortDirection;\n};\n\nconst props = withDefaults(\n defineProps<{\n columns: TTableColumn[];\n rows: Record<string, unknown>[];\n size?: TSize;\n sortBy?: TTableSortState;\n }>(),\n {\n size: 'md',\n sortBy: undefined,\n },\n);\n\nconst emit = defineEmits<{\n (e: 'sort', state: TTableSortState): void;\n}>();\n\ndefineSlots<{\n [key: `cell-${string}`]: (props: { row: Record<string, unknown>; value: unknown }) => void;\n [key: `header-${string}`]: (props: { column: TTableColumn }) => void;\n empty: () => void;\n}>();\n\nconst internalSort = ref<TTableSortState | undefined>(undefined);\n\nconst currentSort = computed(() => props.sortBy ?? internalSort.value);\n\nconst classes = computed(() => [\n 't-table',\n `t-table--${props.size}`,\n]);\n\nconst sortedRows = computed(() => {\n const sort = currentSort.value;\n if (!sort || sort.direction === 'none') return props.rows;\n\n return [...props.rows].sort((a, b) => {\n const aVal = a[sort.key];\n const bVal = b[sort.key];\n\n if (aVal == null && bVal == null) return 0;\n if (aVal == null) return 1;\n if (bVal == null) return -1;\n\n const cmp =\n typeof aVal === 'number' && typeof bVal === 'number'\n ? aVal - bVal\n : String(aVal).localeCompare(String(bVal));\n\n return sort.direction === 'desc' ? -cmp : cmp;\n });\n});\n\nfunction handleSort(column: TTableColumn) {\n if (!column.sortable) return;\n\n const cur = currentSort.value;\n let direction: TTableSortDirection = 'asc';\n\n if (cur?.key === column.key) {\n if (cur.direction === 'asc') direction = 'desc';\n else if (cur.direction === 'desc') direction = 'none';\n else direction = 'asc';\n }\n\n const state: TTableSortState = { key: column.key, direction };\n internalSort.value = state;\n emit('sort', state);\n}\n\nfunction sortAriaSort(column: TTableColumn): 'none' | 'ascending' | 'descending' | undefined {\n if (!column.sortable) return undefined;\n const cur = currentSort.value;\n if (cur?.key !== column.key || cur.direction === 'none') return 'none';\n return cur.direction === 'asc' ? 'ascending' : 'descending';\n}\n\nfunction handleHeaderKeydown(event: KeyboardEvent, column: TTableColumn) {\n if (column.sortable && (event.key === 'Enter' || event.key === ' ')) {\n event.preventDefault();\n handleSort(column);\n }\n}\n</script>\n\n<template>\n <div class=\"t-table-wrapper\">\n <table\n :class=\"classes\"\n role=\"grid\"\n >\n <thead class=\"t-table__head\">\n <tr class=\"t-table__row\">\n <th\n v-for=\"column in columns\"\n :key=\"column.key\"\n class=\"t-table__header\"\n :class=\"[\n column.sortable ? 't-table__header--sortable' : '',\n column.align ? `t-table__header--${column.align}` : '',\n ]\"\n :style=\"column.width ? { width: column.width } : undefined\"\n :aria-sort=\"sortAriaSort(column)\"\n :tabindex=\"column.sortable ? 0 : undefined\"\n scope=\"col\"\n @click=\"handleSort(column)\"\n @keydown=\"handleHeaderKeydown($event, column)\"\n >\n <slot\n :name=\"`header-${column.key}`\"\n :column=\"column\"\n >\n <span class=\"t-table__header-content\">\n {{ column.label }}\n <span\n v-if=\"column.sortable\"\n class=\"t-table__sort-icon\"\n aria-hidden=\"true\"\n >\n <svg\n v-if=\"currentSort?.key === column.key && currentSort.direction === 'asc'\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n >\n <path d=\"m18 15-6-6-6 6\" />\n </svg>\n <svg\n v-else-if=\"currentSort?.key === column.key && currentSort.direction === 'desc'\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n >\n <path d=\"m6 9 6 6 6-6\" />\n </svg>\n <svg\n v-else\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n style=\"opacity: 0.4\"\n >\n <path d=\"m7 15 5 5 5-5\" />\n <path d=\"m7 9 5-5 5 5\" />\n </svg>\n </span>\n </span>\n </slot>\n </th>\n </tr>\n </thead>\n <tbody class=\"t-table__body\">\n <tr\n v-if=\"sortedRows.length === 0\"\n class=\"t-table__row t-table__row--empty\"\n >\n <td\n :colspan=\"columns.length\"\n class=\"t-table__cell t-table__cell--empty\"\n >\n <slot name=\"empty\">\n No data available.\n </slot>\n </td>\n </tr>\n <tr\n v-for=\"(row, index) in sortedRows\"\n :key=\"index\"\n class=\"t-table__row\"\n >\n <td\n v-for=\"column in columns\"\n :key=\"column.key\"\n class=\"t-table__cell\"\n :class=\"column.align ? `t-table__cell--${column.align}` : ''\"\n >\n <slot\n :name=\"`cell-${column.key}`\"\n :row=\"row\"\n :value=\"row[column.key]\"\n >\n {{ row[column.key] ?? '' }}\n </slot>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n</template>\n"],"mappings":"yjCAmBA,IAAM,EAAQ,EAaR,EAAO,EAUP,GAAA,EAAA,EAAA,IAAA,CAAgD,IAAA,EAAS,EAEzD,GAAA,EAAA,EAAA,SAAA,KAA6B,EAAM,QAAU,EAAa,KAAK,EAE/D,GAAA,EAAA,EAAA,SAAA,KAAyB,CAC7B,UACA,YAAY,EAAM,MACpB,CAAC,EAEK,GAAA,EAAA,EAAA,SAAA,KAA4B,CAChC,IAAM,EAAO,EAAY,MAGzB,MAFI,CAAC,GAAQ,EAAK,YAAc,OAAe,EAAM,KAE9C,CAAC,GAAG,EAAM,IAAI,CAAC,CAAC,MAAM,EAAG,IAAM,CACpC,IAAM,EAAO,EAAE,EAAK,KACd,EAAO,EAAE,EAAK,KAEpB,GAAI,GAAQ,MAAQ,GAAQ,KAAM,MAAO,GACzC,GAAI,GAAQ,KAAM,MAAO,GACzB,GAAI,GAAQ,KAAM,MAAO,GAEzB,IAAM,EACJ,OAAO,GAAS,UAAY,OAAO,GAAS,SACxC,EAAO,EACP,OAAO,CAAI,CAAC,CAAC,cAAc,OAAO,CAAI,CAAC,EAE7C,OAAO,EAAK,YAAc,OAAS,CAAC,EAAM,CAC5C,CAAC,CACH,CAAC,EAED,SAAS,EAAW,EAAsB,CACxC,GAAI,CAAC,EAAO,SAAU,OAEtB,IAAM,EAAM,EAAY,MACpB,EAAiC,MAEjC,GAAK,MAAQ,EAAO,MACtB,AAEK,EAFD,EAAI,YAAc,MAAmB,OAChC,EAAI,YAAc,OAAoB,OAC9B,OAGnB,IAAM,EAAyB,CAAE,IAAK,EAAO,IAAK,WAAU,EAC5D,EAAa,MAAQ,EACrB,EAAK,OAAQ,CAAK,CACpB,CAEA,SAAS,EAAa,EAAuE,CAC3F,GAAI,CAAC,EAAO,SAAU,OACtB,IAAM,EAAM,EAAY,MAExB,OADI,GAAK,MAAQ,EAAO,KAAO,EAAI,YAAc,OAAe,OACzD,EAAI,YAAc,MAAQ,YAAc,YACjD,CAEA,SAAS,EAAoB,EAAsB,EAAsB,CACnE,EAAO,WAAa,EAAM,MAAQ,SAAW,EAAM,MAAQ,OAC7D,EAAM,eAAe,EACrB,EAAW,CAAM,EAErB,0DA2HQ,MAvHN,EAuHM,EAAA,EAAA,EAAA,mBAAA,CADI,QAAA,CApHL,OAAA,EAAA,EAAA,eAAA,CAAO,EAAA,KAAO,EACf,KAAK,kCA+EG,QA7ER,EA6EQ,EAAA,EAAA,EAAA,mBAAA,CADD,KA3EL,EA2EK,GAAA,EAAA,EAAA,UAAA,CAAA,EAAA,GAAA,EAAA,EAAA,mBAAA,CADE,EAAA,SAAA,MAAA,EAAA,EAAA,WAAA,CAxEc,EAAA,QAAV,+CAwEJ,KAAA,CAvEF,IAAK,EAAO,IACb,OAAA,EAAA,EAAA,eAAA,CAAK,CAAC,kBAAiB,CACC,EAAO,SAAQ,4BAAA,GAAmD,EAAO,MAAK,oBAAuB,EAAO,QAAK,EAAA,CAAA,CAAA,EAIxI,OAAA,EAAA,EAAA,eAAA,CAAO,EAAO,MAAK,CAAA,MAAY,EAAO,KAAK,EAAK,IAAA,EAAS,EACzD,YAAW,EAAa,CAAM,EAC9B,SAAU,EAAO,SAAQ,EAAO,IAAA,GACjC,MAAM,MACL,QAAK,GAAE,EAAW,CAAM,EACxB,UAAO,GAAE,EAAoB,EAAQ,CAAM,qBA2DrC,EAAA,OAAA,UAxDY,EAAO,MAAG,CAClB,QAAM,MAuDV,EAAA,EAAA,EAAA,mBAAA,CADE,OApDP,EAoDO,EAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,EAAA,gBAAA,CAnDF,EAAO,KAAK,EAAG,IAClB,CAAA,EACQ,EAAO,WAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAgDR,OAjDP,EAiDO,CA3CG,EAAA,OAAa,MAAQ,EAAO,KAAO,EAAA,MAAY,YAAS,QAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAY1D,MAbN,EAaM,CAAA,GAAA,AAAA,EAAA,KAAA,EAAA,EAAA,EAAA,mBAAA,CADuB,OAAA,CAArB,EAAE,gBAAgB,EAAA,KAAA,EAAA,CAAA,CAAA,CAAA,GAGb,EAAA,OAAa,MAAQ,EAAO,KAAO,EAAA,MAAY,YAAS,SAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAY/D,MAbN,EAaM,CAAA,GAAA,AAAA,EAAA,KAAA,EAAA,EAAA,EAAA,mBAAA,CADqB,OAAA,CAAnB,EAAE,cAAc,EAAA,KAAA,EAAA,CAAA,CAAA,CAAA,KAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAiBlB,MAfN,EAeM,CAAA,GAAA,AAAA,EAAA,KAAA,EAAA,EAAA,EAAA,mBAAA,CAFsB,OAAA,CAApB,EAAE,eAAe,EAAA,KAAA,EAAA,GAAA,EAAA,EAAA,mBAAA,CACE,OAAA,CAAnB,EAAE,cAAc,EAAA,KAAA,EAAA,CAAA,CAAA,CAAA,EAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,EAAA,GAAA,CAAA,uCA0C5B,QAlCR,EAkCQ,CAhCE,EAAA,MAAW,SAAM,IAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAWpB,KAZL,EAYK,EAAA,EAAA,EAAA,mBAAA,CADE,KAAA,CANF,QAAS,EAAA,QAAQ,OAClB,MAAM,wDAIC,EAAA,OAAA,QAAA,CAAA,MAAA,CAAA,AAAA,EAAA,MAAA,EAAA,EAAA,gBAAA,CAFY,uBAEnB,EAAA,CAAA,CAAA,CAAA,EAAA,EAAA,CAAA,CAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA,IAAA,EAAA,EAAA,UAAA,CAAA,EAAA,GAAA,EAAA,EAAA,mBAAA,CAsBC,EAAA,SAAA,MAAA,EAAA,EAAA,WAAA,CAlBoB,EAAA,OAAf,EAAK,gDAkBV,KAAA,CAjBF,IAAK,EACN,MAAM,+DAeD,EAAA,SAAA,MAAA,EAAA,EAAA,WAAA,CAZc,EAAA,QAAV,+CAYJ,KAAA,CAXF,IAAK,EAAO,IACb,OAAA,EAAA,EAAA,eAAA,CAAK,CAAC,gBACE,EAAO,MAAK,kBAAqB,EAAO,QAAK,EAAA,CAAA,qBAQ9C,EAAA,OAAA,QALU,EAAO,MAAG,CACnB,MACL,MAAO,EAAI,EAAO,UAGd,EAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,EAAA,gBAAA,CADF,EAAI,EAAO,MAAG,EAAA,EAAA,CAAA,CAAA,CAAA,CAAA,EAAA,CAAA"}
|
|
1
|
+
{"version":3,"file":"TTable.vue_vue_type_script_setup_true_lang.cjs","names":[],"sources":["../../src/components/TTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, useAttrs } from 'vue';\nimport type { TIconName } from '@treeui/icons';\nimport type { TSize } from '../types/contracts';\nimport TIcon from './TIcon.vue';\n\n// The scroll container is the root element, but the accessible name and any\n// aria-*/id belong on the <table> itself, so attrs are split rather than\n// inherited onto the wrapper.\ndefineOptions({\n inheritAttrs: false,\n});\n\nexport type TTableColumn = {\n key: string;\n label: string;\n sortable?: boolean;\n align?: 'left' | 'center' | 'right';\n width?: string;\n};\n\nexport type TTableSortDirection = 'asc' | 'desc' | 'none';\n\nexport type TTableSortState = {\n key: string;\n direction: TTableSortDirection;\n};\n\nconst props = withDefaults(\n defineProps<{\n columns: TTableColumn[];\n rows: Record<string, unknown>[];\n size?: TSize;\n sortBy?: TTableSortState;\n /**\n * Visible `<caption>` naming the table. For a name without visible text,\n * pass `aria-label` / `aria-labelledby` instead — both land on the `<table>`.\n */\n caption?: string;\n }>(),\n {\n size: 'md',\n sortBy: undefined,\n caption: undefined,\n },\n);\n\nconst emit = defineEmits<{\n (e: 'sort', state: TTableSortState): void;\n}>();\n\ndefineSlots<{\n [key: `cell-${string}`]: (props: { row: Record<string, unknown>; value: unknown }) => void;\n [key: `header-${string}`]: (props: { column: TTableColumn }) => void;\n empty: () => void;\n}>();\n\nconst internalSort = ref<TTableSortState | undefined>(undefined);\n\nconst currentSort = computed(() => props.sortBy ?? internalSort.value);\n\nconst classes = computed(() => [\n 't-table',\n `t-table--${props.size}`,\n]);\n\nconst sortedRows = computed(() => {\n const sort = currentSort.value;\n if (!sort || sort.direction === 'none') return props.rows;\n\n return [...props.rows].sort((a, b) => {\n const aVal = a[sort.key];\n const bVal = b[sort.key];\n\n if (aVal == null && bVal == null) return 0;\n if (aVal == null) return 1;\n if (bVal == null) return -1;\n\n const cmp =\n typeof aVal === 'number' && typeof bVal === 'number'\n ? aVal - bVal\n : String(aVal).localeCompare(String(bVal));\n\n return sort.direction === 'desc' ? -cmp : cmp;\n });\n});\n\nfunction handleSort(column: TTableColumn) {\n if (!column.sortable) return;\n\n const cur = currentSort.value;\n let direction: TTableSortDirection = 'asc';\n\n if (cur?.key === column.key) {\n if (cur.direction === 'asc') direction = 'desc';\n else if (cur.direction === 'desc') direction = 'none';\n else direction = 'asc';\n }\n\n const state: TTableSortState = { key: column.key, direction };\n internalSort.value = state;\n emit('sort', state);\n}\n\nfunction sortAriaSort(column: TTableColumn): 'none' | 'ascending' | 'descending' | undefined {\n if (!column.sortable) return undefined;\n const cur = currentSort.value;\n if (cur?.key !== column.key || cur.direction === 'none') return 'none';\n return cur.direction === 'asc' ? 'ascending' : 'descending';\n}\n\nfunction handleHeaderKeydown(event: KeyboardEvent, column: TTableColumn) {\n if (column.sortable && (event.key === 'Enter' || event.key === ' ')) {\n event.preventDefault();\n handleSort(column);\n }\n}\n\nfunction isSortedBy(column: TTableColumn): boolean {\n const cur = currentSort.value;\n return cur?.key === column.key && cur.direction !== 'none';\n}\n\nfunction sortIconName(column: TTableColumn): TIconName {\n const cur = currentSort.value;\n if (!isSortedBy(column)) return 'chevrons-up-down';\n return cur?.direction === 'asc' ? 'chevron-up' : 'chevron-down';\n}\n\nconst attrs = useAttrs();\n\n// class/style stay on the scroll wrapper (the root); everything else —\n// aria-label, aria-labelledby, id, data-* — is forwarded to the <table>.\nconst tableAttrs = computed(() => {\n const { class: _class, style: _style, ...rest } = attrs;\n return rest;\n});\n</script>\n\n<template>\n <div\n class=\"t-table-wrapper\"\n :class=\"attrs.class\"\n :style=\"attrs.style\"\n >\n <table\n v-bind=\"tableAttrs\"\n :class=\"classes\"\n >\n <caption\n v-if=\"caption\"\n class=\"t-table__caption\"\n >\n {{ caption }}\n </caption>\n <thead class=\"t-table__head\">\n <tr class=\"t-table__row\">\n <th\n v-for=\"column in columns\"\n :key=\"column.key\"\n class=\"t-table__header\"\n :class=\"[\n column.sortable ? 't-table__header--sortable' : '',\n column.align ? `t-table__header--${column.align}` : '',\n ]\"\n :style=\"column.width ? { width: column.width } : undefined\"\n :aria-sort=\"sortAriaSort(column)\"\n :tabindex=\"column.sortable ? 0 : undefined\"\n scope=\"col\"\n @click=\"handleSort(column)\"\n @keydown=\"handleHeaderKeydown($event, column)\"\n >\n <slot\n :name=\"`header-${column.key}`\"\n :column=\"column\"\n >\n <span class=\"t-table__header-content\">\n {{ column.label }}\n <span\n v-if=\"column.sortable\"\n class=\"t-table__sort-icon\"\n :class=\"{ 'is-inactive': !isSortedBy(column) }\"\n aria-hidden=\"true\"\n >\n <TIcon\n :name=\"sortIconName(column)\"\n :size=\"14\"\n />\n </span>\n </span>\n </slot>\n </th>\n </tr>\n </thead>\n <tbody class=\"t-table__body\">\n <tr\n v-if=\"sortedRows.length === 0\"\n class=\"t-table__row t-table__row--empty\"\n >\n <td\n :colspan=\"columns.length\"\n class=\"t-table__cell t-table__cell--empty\"\n >\n <slot name=\"empty\">\n No data available.\n </slot>\n </td>\n </tr>\n <tr\n v-for=\"(row, index) in sortedRows\"\n :key=\"index\"\n class=\"t-table__row\"\n >\n <td\n v-for=\"column in columns\"\n :key=\"column.key\"\n class=\"t-table__cell\"\n :class=\"column.align ? `t-table__cell--${column.align}` : ''\"\n >\n <slot\n :name=\"`cell-${column.key}`\"\n :row=\"row\"\n :value=\"row[column.key]\"\n >\n {{ row[column.key] ?? '' }}\n </slot>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n</template>\n"],"mappings":"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"}
|
|
@@ -1,64 +1,32 @@
|
|
|
1
|
-
import
|
|
1
|
+
import e from "./TIcon.js";
|
|
2
|
+
import { Fragment as t, computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createTextVNode as o, createVNode as s, defineComponent as c, mergeProps as l, normalizeClass as u, normalizeStyle as d, openBlock as f, ref as p, renderList as m, renderSlot as h, toDisplayString as g, unref as _, useAttrs as v } from "vue";
|
|
2
3
|
//#region src/components/TTable.vue?vue&type=script&setup=true&lang.ts
|
|
3
|
-
var
|
|
4
|
+
var y = {
|
|
5
|
+
key: 0,
|
|
6
|
+
class: "t-table__caption"
|
|
7
|
+
}, b = { class: "t-table__head" }, x = { class: "t-table__row" }, S = [
|
|
4
8
|
"aria-sort",
|
|
5
9
|
"tabindex",
|
|
6
10
|
"onClick",
|
|
7
11
|
"onKeydown"
|
|
8
|
-
],
|
|
9
|
-
key: 0,
|
|
10
|
-
class: "t-table__sort-icon",
|
|
11
|
-
"aria-hidden": "true"
|
|
12
|
-
}, b = {
|
|
13
|
-
key: 0,
|
|
14
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
15
|
-
width: "14",
|
|
16
|
-
height: "14",
|
|
17
|
-
viewBox: "0 0 24 24",
|
|
18
|
-
fill: "none",
|
|
19
|
-
stroke: "currentColor",
|
|
20
|
-
"stroke-width": "2",
|
|
21
|
-
"stroke-linecap": "round",
|
|
22
|
-
"stroke-linejoin": "round"
|
|
23
|
-
}, x = {
|
|
24
|
-
key: 1,
|
|
25
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
26
|
-
width: "14",
|
|
27
|
-
height: "14",
|
|
28
|
-
viewBox: "0 0 24 24",
|
|
29
|
-
fill: "none",
|
|
30
|
-
stroke: "currentColor",
|
|
31
|
-
"stroke-width": "2",
|
|
32
|
-
"stroke-linecap": "round",
|
|
33
|
-
"stroke-linejoin": "round"
|
|
34
|
-
}, S = {
|
|
35
|
-
key: 2,
|
|
36
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
37
|
-
width: "14",
|
|
38
|
-
height: "14",
|
|
39
|
-
viewBox: "0 0 24 24",
|
|
40
|
-
fill: "none",
|
|
41
|
-
stroke: "currentColor",
|
|
42
|
-
"stroke-width": "2",
|
|
43
|
-
"stroke-linecap": "round",
|
|
44
|
-
"stroke-linejoin": "round",
|
|
45
|
-
style: { opacity: "0.4" }
|
|
46
|
-
}, C = { class: "t-table__body" }, w = {
|
|
12
|
+
], C = { class: "t-table__header-content" }, w = { class: "t-table__body" }, T = {
|
|
47
13
|
key: 0,
|
|
48
14
|
class: "t-table__row t-table__row--empty"
|
|
49
|
-
},
|
|
15
|
+
}, E = ["colspan"], D = /*@__PURE__*/ c({
|
|
16
|
+
inheritAttrs: !1,
|
|
50
17
|
__name: "TTable",
|
|
51
18
|
props: {
|
|
52
19
|
columns: {},
|
|
53
20
|
rows: {},
|
|
54
21
|
size: { default: "md" },
|
|
55
|
-
sortBy: { default: void 0 }
|
|
22
|
+
sortBy: { default: void 0 },
|
|
23
|
+
caption: { default: void 0 }
|
|
56
24
|
},
|
|
57
25
|
emits: ["sort"],
|
|
58
|
-
setup(
|
|
59
|
-
let
|
|
60
|
-
let e =
|
|
61
|
-
return !e || e.direction === "none" ?
|
|
26
|
+
setup(c, { emit: D }) {
|
|
27
|
+
let O = c, k = D, A = p(void 0), j = n(() => O.sortBy ?? A.value), M = n(() => ["t-table", `t-table--${O.size}`]), N = n(() => {
|
|
28
|
+
let e = j.value;
|
|
29
|
+
return !e || e.direction === "none" ? O.rows : [...O.rows].sort((t, n) => {
|
|
62
30
|
let r = t[e.key], i = n[e.key];
|
|
63
31
|
if (r == null && i == null) return 0;
|
|
64
32
|
if (r == null) return 1;
|
|
@@ -67,52 +35,75 @@ var m = { class: "t-table-wrapper" }, h = { class: "t-table__head" }, g = { clas
|
|
|
67
35
|
return e.direction === "desc" ? -a : a;
|
|
68
36
|
});
|
|
69
37
|
});
|
|
70
|
-
function
|
|
38
|
+
function P(e) {
|
|
71
39
|
if (!e.sortable) return;
|
|
72
|
-
let t =
|
|
40
|
+
let t = j.value, n = "asc";
|
|
73
41
|
t?.key === e.key && (n = t.direction === "asc" ? "desc" : t.direction === "desc" ? "none" : "asc");
|
|
74
42
|
let r = {
|
|
75
43
|
key: e.key,
|
|
76
44
|
direction: n
|
|
77
45
|
};
|
|
78
|
-
|
|
46
|
+
A.value = r, k("sort", r);
|
|
79
47
|
}
|
|
80
|
-
function
|
|
48
|
+
function F(e) {
|
|
81
49
|
if (!e.sortable) return;
|
|
82
|
-
let t =
|
|
50
|
+
let t = j.value;
|
|
83
51
|
return t?.key !== e.key || t.direction === "none" ? "none" : t.direction === "asc" ? "ascending" : "descending";
|
|
84
52
|
}
|
|
85
|
-
function
|
|
86
|
-
t.sortable && (e.key === "Enter" || e.key === " ") && (e.preventDefault(),
|
|
53
|
+
function I(e, t) {
|
|
54
|
+
t.sortable && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), P(t));
|
|
55
|
+
}
|
|
56
|
+
function L(e) {
|
|
57
|
+
let t = j.value;
|
|
58
|
+
return t?.key === e.key && t.direction !== "none";
|
|
87
59
|
}
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
class:
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
60
|
+
function R(e) {
|
|
61
|
+
let t = j.value;
|
|
62
|
+
return L(e) ? t?.direction === "asc" ? "chevron-up" : "chevron-down" : "chevrons-up-down";
|
|
63
|
+
}
|
|
64
|
+
let z = v(), B = n(() => {
|
|
65
|
+
let { class: e, style: t, ...n } = z;
|
|
66
|
+
return n;
|
|
67
|
+
});
|
|
68
|
+
return (n, p) => (f(), i("div", {
|
|
69
|
+
class: u(["t-table-wrapper", _(z).class]),
|
|
70
|
+
style: d(_(z).style)
|
|
71
|
+
}, [a("table", l(B.value, { class: M.value }), [
|
|
72
|
+
c.caption ? (f(), i("caption", y, g(c.caption), 1)) : r("", !0),
|
|
73
|
+
a("thead", b, [a("tr", x, [(f(!0), i(t, null, m(c.columns, (t) => (f(), i("th", {
|
|
74
|
+
key: t.key,
|
|
75
|
+
class: u(["t-table__header", [t.sortable ? "t-table__header--sortable" : "", t.align ? `t-table__header--${t.align}` : ""]]),
|
|
76
|
+
style: d(t.width ? { width: t.width } : void 0),
|
|
77
|
+
"aria-sort": F(t),
|
|
78
|
+
tabindex: t.sortable ? 0 : void 0,
|
|
79
|
+
scope: "col",
|
|
80
|
+
onClick: (e) => P(t),
|
|
81
|
+
onKeydown: (e) => I(e, t)
|
|
82
|
+
}, [h(n.$slots, `header-${t.key}`, { column: t }, () => [a("span", C, [o(g(t.label) + " ", 1), t.sortable ? (f(), i("span", {
|
|
83
|
+
key: 0,
|
|
84
|
+
class: u(["t-table__sort-icon", { "is-inactive": !L(t) }]),
|
|
85
|
+
"aria-hidden": "true"
|
|
86
|
+
}, [s(e, {
|
|
87
|
+
name: R(t),
|
|
88
|
+
size: 14
|
|
89
|
+
}, null, 8, ["name"])], 2)) : r("", !0)])])], 46, S))), 128))])]),
|
|
90
|
+
a("tbody", w, [N.value.length === 0 ? (f(), i("tr", T, [a("td", {
|
|
91
|
+
colspan: c.columns.length,
|
|
92
|
+
class: "t-table__cell t-table__cell--empty"
|
|
93
|
+
}, [h(n.$slots, "empty", {}, () => [p[0] ||= o(" No data available. ", -1)])], 8, E)])) : r("", !0), (f(!0), i(t, null, m(N.value, (e, r) => (f(), i("tr", {
|
|
94
|
+
key: r,
|
|
95
|
+
class: "t-table__row"
|
|
96
|
+
}, [(f(!0), i(t, null, m(c.columns, (t) => (f(), i("td", {
|
|
97
|
+
key: t.key,
|
|
98
|
+
class: u(["t-table__cell", t.align ? `t-table__cell--${t.align}` : ""])
|
|
99
|
+
}, [h(n.$slots, `cell-${t.key}`, {
|
|
100
|
+
row: e,
|
|
101
|
+
value: e[t.key]
|
|
102
|
+
}, () => [o(g(e[t.key] ?? ""), 1)])], 2))), 128))]))), 128))])
|
|
103
|
+
], 16)], 6));
|
|
113
104
|
}
|
|
114
105
|
});
|
|
115
106
|
//#endregion
|
|
116
|
-
export {
|
|
107
|
+
export { D as default };
|
|
117
108
|
|
|
118
109
|
//# sourceMappingURL=TTable.vue_vue_type_script_setup_true_lang.js.map
|