@nu-grid/nuxt 0.3.0 → 0.3.1
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/module.json +1 -1
- package/dist/runtime/components/NuGrid.vue +6 -2
- package/dist/runtime/components/_internal/NuGridBase.vue +1 -1
- package/dist/runtime/components/_internal/NuGridGroup.vue +1 -1
- package/dist/runtime/components/_internal/NuGridGroupCheckbox.vue +1 -1
- package/dist/runtime/components/_internal/NuGridSplitGroup.vue +1 -1
- package/dist/runtime/composables/_internal/useNuGridUI.d.ts +45 -45
- package/dist/runtime/config/_internal/options-defaults.d.ts +0 -1
- package/dist/runtime/config/_internal/options-defaults.js +2 -2
- package/dist/runtime/themes/nuGridTheme.d.ts +1 -1
- package/dist/runtime/themes/nuGridTheme.js +2 -1
- package/dist/runtime/themes/nuGridThemeCompact.d.ts +1 -1
- package/dist/runtime/themes/nuGridThemeCompact.js +1 -0
- package/package.json +5 -5
package/dist/module.json
CHANGED
|
@@ -40,7 +40,7 @@ import NuGridSplitGroup from "./_internal/NuGridSplitGroup.vue";
|
|
|
40
40
|
import NuGridTooltip from "./_internal/NuGridTooltip.vue";
|
|
41
41
|
defineOptions({ inheritAttrs: false });
|
|
42
42
|
const props = defineProps({
|
|
43
|
-
ui: { type:
|
|
43
|
+
ui: { type: Object, required: false },
|
|
44
44
|
preset: { type: String, required: false },
|
|
45
45
|
focus: { type: Object, required: false },
|
|
46
46
|
editing: { type: [Boolean, Object], required: false },
|
|
@@ -254,7 +254,11 @@ watch(
|
|
|
254
254
|
);
|
|
255
255
|
const rows = orderedRows;
|
|
256
256
|
const stickyEnabled = computed(() => props.layout?.stickyHeaders ?? false);
|
|
257
|
-
const resizeMode = computed(() =>
|
|
257
|
+
const resizeMode = computed(() => {
|
|
258
|
+
if (props.layout?.resizeMode) return props.layout.resizeMode;
|
|
259
|
+
if (props.layout?.autoSize === "fill") return "shift";
|
|
260
|
+
return "expand";
|
|
261
|
+
});
|
|
258
262
|
const {
|
|
259
263
|
virtualizer,
|
|
260
264
|
virtualizationEnabled,
|
|
@@ -16,7 +16,7 @@ import NuGridHeaderSortButton from "./NuGridHeaderSortButton.vue";
|
|
|
16
16
|
import NuGridRow from "./NuGridRow.vue";
|
|
17
17
|
defineOptions({ inheritAttrs: false });
|
|
18
18
|
const props = defineProps({
|
|
19
|
-
ui: { type:
|
|
19
|
+
ui: { type: Object, required: false },
|
|
20
20
|
preset: { type: String, required: false },
|
|
21
21
|
focus: { type: Object, required: false },
|
|
22
22
|
editing: { type: [Boolean, Object], required: false },
|
|
@@ -19,7 +19,7 @@ import NuGridHeaderSortButton from "./NuGridHeaderSortButton.vue";
|
|
|
19
19
|
import NuGridRow from "./NuGridRow.vue";
|
|
20
20
|
defineOptions({ inheritAttrs: false });
|
|
21
21
|
const props = defineProps({
|
|
22
|
-
ui: { type:
|
|
22
|
+
ui: { type: Object, required: false },
|
|
23
23
|
preset: { type: String, required: false },
|
|
24
24
|
focus: { type: Object, required: false },
|
|
25
25
|
editing: { type: [Boolean, Object], required: false },
|
|
@@ -16,7 +16,7 @@ const props = defineProps({
|
|
|
16
16
|
icon: { type: null, required: false },
|
|
17
17
|
indeterminateIcon: { type: null, required: false },
|
|
18
18
|
class: { type: null, required: false },
|
|
19
|
-
ui: { type:
|
|
19
|
+
ui: { type: Object, required: false },
|
|
20
20
|
disabled: { type: Boolean, required: false },
|
|
21
21
|
required: { type: Boolean, required: false },
|
|
22
22
|
name: { type: String, required: false },
|
|
@@ -19,7 +19,7 @@ import NuGridHeaderSortButton from "./NuGridHeaderSortButton.vue";
|
|
|
19
19
|
import NuGridRow from "./NuGridRow.vue";
|
|
20
20
|
defineOptions({ inheritAttrs: false });
|
|
21
21
|
const props = defineProps({
|
|
22
|
-
ui: { type:
|
|
22
|
+
ui: { type: Object, required: false },
|
|
23
23
|
preset: { type: String, required: false },
|
|
24
24
|
focus: { type: Object, required: false },
|
|
25
25
|
editing: { type: [Boolean, Object], required: false },
|
|
@@ -585,7 +585,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
585
585
|
virtualize?: boolean | undefined;
|
|
586
586
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
587
587
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
588
|
-
|
|
588
|
+
tbody: (slotProps?: ({
|
|
589
589
|
loading?: boolean | undefined;
|
|
590
590
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
591
591
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -643,7 +643,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
643
643
|
virtualize?: boolean | undefined;
|
|
644
644
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
645
645
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
646
|
-
|
|
646
|
+
loading: (slotProps?: ({
|
|
647
647
|
loading?: boolean | undefined;
|
|
648
648
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
649
649
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -701,7 +701,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
701
701
|
virtualize?: boolean | undefined;
|
|
702
702
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
703
703
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
704
|
-
|
|
704
|
+
empty: (slotProps?: ({
|
|
705
705
|
loading?: boolean | undefined;
|
|
706
706
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
707
707
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -759,7 +759,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
759
759
|
virtualize?: boolean | undefined;
|
|
760
760
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
761
761
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
762
|
-
|
|
762
|
+
separator: (slotProps?: ({
|
|
763
763
|
loading?: boolean | undefined;
|
|
764
764
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
765
765
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -817,7 +817,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
817
817
|
virtualize?: boolean | undefined;
|
|
818
818
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
819
819
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
820
|
-
|
|
820
|
+
rowDragHandle: (slotProps?: ({
|
|
821
821
|
loading?: boolean | undefined;
|
|
822
822
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
823
823
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -875,7 +875,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
875
875
|
virtualize?: boolean | undefined;
|
|
876
876
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
877
877
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
878
|
-
|
|
878
|
+
colResizeHandle: (slotProps?: ({
|
|
879
879
|
loading?: boolean | undefined;
|
|
880
880
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
881
881
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -933,7 +933,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
933
933
|
virtualize?: boolean | undefined;
|
|
934
934
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
935
935
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
936
|
-
|
|
936
|
+
colResizer: (slotProps?: ({
|
|
937
937
|
loading?: boolean | undefined;
|
|
938
938
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
939
939
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -991,7 +991,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
991
991
|
virtualize?: boolean | undefined;
|
|
992
992
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
993
993
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
994
|
-
|
|
994
|
+
rowDragHeaderHandle: (slotProps?: ({
|
|
995
995
|
loading?: boolean | undefined;
|
|
996
996
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
997
997
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1049,7 +1049,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1049
1049
|
virtualize?: boolean | undefined;
|
|
1050
1050
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1051
1051
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1052
|
-
|
|
1052
|
+
thInner: (slotProps?: ({
|
|
1053
1053
|
loading?: boolean | undefined;
|
|
1054
1054
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1055
1055
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1107,7 +1107,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1107
1107
|
virtualize?: boolean | undefined;
|
|
1108
1108
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1109
1109
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1110
|
-
|
|
1110
|
+
sortHandle: (slotProps?: ({
|
|
1111
1111
|
loading?: boolean | undefined;
|
|
1112
1112
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1113
1113
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1165,7 +1165,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1165
1165
|
virtualize?: boolean | undefined;
|
|
1166
1166
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1167
1167
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1168
|
-
|
|
1168
|
+
sortHandleHover: (slotProps?: ({
|
|
1169
1169
|
loading?: boolean | undefined;
|
|
1170
1170
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1171
1171
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1223,7 +1223,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1223
1223
|
virtualize?: boolean | undefined;
|
|
1224
1224
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1225
1225
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1226
|
-
|
|
1226
|
+
rowDragIcon: (slotProps?: ({
|
|
1227
1227
|
loading?: boolean | undefined;
|
|
1228
1228
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1229
1229
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1281,7 +1281,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1281
1281
|
virtualize?: boolean | undefined;
|
|
1282
1282
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1283
1283
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1284
|
-
|
|
1284
|
+
headerContainer: (slotProps?: ({
|
|
1285
1285
|
loading?: boolean | undefined;
|
|
1286
1286
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1287
1287
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1339,7 +1339,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1339
1339
|
virtualize?: boolean | undefined;
|
|
1340
1340
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1341
1341
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1342
|
-
|
|
1342
|
+
headerControls: (slotProps?: ({
|
|
1343
1343
|
loading?: boolean | undefined;
|
|
1344
1344
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1345
1345
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1397,7 +1397,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1397
1397
|
virtualize?: boolean | undefined;
|
|
1398
1398
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1399
1399
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1400
|
-
|
|
1400
|
+
columnMenu: (slotProps?: ({
|
|
1401
1401
|
loading?: boolean | undefined;
|
|
1402
1402
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1403
1403
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1455,7 +1455,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1455
1455
|
virtualize?: boolean | undefined;
|
|
1456
1456
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1457
1457
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1458
|
-
|
|
1458
|
+
footerContent: (slotProps?: ({
|
|
1459
1459
|
loading?: boolean | undefined;
|
|
1460
1460
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1461
1461
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1513,7 +1513,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1513
1513
|
virtualize?: boolean | undefined;
|
|
1514
1514
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1515
1515
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1516
|
-
|
|
1516
|
+
groupHeader: (slotProps?: ({
|
|
1517
1517
|
loading?: boolean | undefined;
|
|
1518
1518
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1519
1519
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1571,7 +1571,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1571
1571
|
virtualize?: boolean | undefined;
|
|
1572
1572
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1573
1573
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1574
|
-
|
|
1574
|
+
groupHeaderLeft: (slotProps?: ({
|
|
1575
1575
|
loading?: boolean | undefined;
|
|
1576
1576
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1577
1577
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1629,7 +1629,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1629
1629
|
virtualize?: boolean | undefined;
|
|
1630
1630
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1631
1631
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1632
|
-
|
|
1632
|
+
groupIcon: (slotProps?: ({
|
|
1633
1633
|
loading?: boolean | undefined;
|
|
1634
1634
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1635
1635
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1687,7 +1687,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1687
1687
|
virtualize?: boolean | undefined;
|
|
1688
1688
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1689
1689
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1690
|
-
|
|
1690
|
+
groupLabel: (slotProps?: ({
|
|
1691
1691
|
loading?: boolean | undefined;
|
|
1692
1692
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1693
1693
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1745,7 +1745,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1745
1745
|
virtualize?: boolean | undefined;
|
|
1746
1746
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1747
1747
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1748
|
-
|
|
1748
|
+
groupHeaderSpacer: (slotProps?: ({
|
|
1749
1749
|
loading?: boolean | undefined;
|
|
1750
1750
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1751
1751
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1803,7 +1803,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1803
1803
|
virtualize?: boolean | undefined;
|
|
1804
1804
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1805
1805
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1806
|
-
|
|
1806
|
+
collapsedHeaderCell: (slotProps?: ({
|
|
1807
1807
|
loading?: boolean | undefined;
|
|
1808
1808
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1809
1809
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1861,7 +1861,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1861
1861
|
virtualize?: boolean | undefined;
|
|
1862
1862
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1863
1863
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1864
|
-
|
|
1864
|
+
collapsedText: (slotProps?: ({
|
|
1865
1865
|
loading?: boolean | undefined;
|
|
1866
1866
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1867
1867
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1919,7 +1919,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1919
1919
|
virtualize?: boolean | undefined;
|
|
1920
1920
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1921
1921
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1922
|
-
|
|
1922
|
+
expandedText: (slotProps?: ({
|
|
1923
1923
|
loading?: boolean | undefined;
|
|
1924
1924
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1925
1925
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -1977,7 +1977,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
1977
1977
|
virtualize?: boolean | undefined;
|
|
1978
1978
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
1979
1979
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
1980
|
-
|
|
1980
|
+
stickyGroupHeader: (slotProps?: ({
|
|
1981
1981
|
loading?: boolean | undefined;
|
|
1982
1982
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
1983
1983
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2035,7 +2035,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2035
2035
|
virtualize?: boolean | undefined;
|
|
2036
2036
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2037
2037
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2038
|
-
|
|
2038
|
+
stickyColumnHeader: (slotProps?: ({
|
|
2039
2039
|
loading?: boolean | undefined;
|
|
2040
2040
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2041
2041
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2093,7 +2093,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2093
2093
|
virtualize?: boolean | undefined;
|
|
2094
2094
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2095
2095
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2096
|
-
|
|
2096
|
+
thGroup: (slotProps?: ({
|
|
2097
2097
|
loading?: boolean | undefined;
|
|
2098
2098
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2099
2099
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2151,7 +2151,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2151
2151
|
virtualize?: boolean | undefined;
|
|
2152
2152
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2153
2153
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2154
|
-
|
|
2154
|
+
thGroupInner: (slotProps?: ({
|
|
2155
2155
|
loading?: boolean | undefined;
|
|
2156
2156
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2157
2157
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2209,7 +2209,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2209
2209
|
virtualize?: boolean | undefined;
|
|
2210
2210
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2211
2211
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2212
|
-
|
|
2212
|
+
editorErrorRing: (slotProps?: ({
|
|
2213
2213
|
loading?: boolean | undefined;
|
|
2214
2214
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2215
2215
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2267,7 +2267,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2267
2267
|
virtualize?: boolean | undefined;
|
|
2268
2268
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2269
2269
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2270
|
-
|
|
2270
|
+
validationPopoverContent: (slotProps?: ({
|
|
2271
2271
|
loading?: boolean | undefined;
|
|
2272
2272
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2273
2273
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2325,7 +2325,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2325
2325
|
virtualize?: boolean | undefined;
|
|
2326
2326
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2327
2327
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2328
|
-
|
|
2328
|
+
validationPopoverInner: (slotProps?: ({
|
|
2329
2329
|
loading?: boolean | undefined;
|
|
2330
2330
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2331
2331
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2383,7 +2383,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2383
2383
|
virtualize?: boolean | undefined;
|
|
2384
2384
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2385
2385
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2386
|
-
|
|
2386
|
+
multiRowHeaderRow: (slotProps?: ({
|
|
2387
2387
|
loading?: boolean | undefined;
|
|
2388
2388
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2389
2389
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2441,7 +2441,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2441
2441
|
virtualize?: boolean | undefined;
|
|
2442
2442
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2443
2443
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2444
|
-
|
|
2444
|
+
multiRowContainer: (slotProps?: ({
|
|
2445
2445
|
loading?: boolean | undefined;
|
|
2446
2446
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2447
2447
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2499,7 +2499,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2499
2499
|
virtualize?: boolean | undefined;
|
|
2500
2500
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2501
2501
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2502
|
-
|
|
2502
|
+
multiRowDragHandle: (slotProps?: ({
|
|
2503
2503
|
loading?: boolean | undefined;
|
|
2504
2504
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2505
2505
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2557,7 +2557,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2557
2557
|
virtualize?: boolean | undefined;
|
|
2558
2558
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2559
2559
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2560
|
-
|
|
2560
|
+
multiRowContent: (slotProps?: ({
|
|
2561
2561
|
loading?: boolean | undefined;
|
|
2562
2562
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2563
2563
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2615,7 +2615,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2615
2615
|
virtualize?: boolean | undefined;
|
|
2616
2616
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2617
2617
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2618
|
-
|
|
2618
|
+
visualRow: (slotProps?: ({
|
|
2619
2619
|
loading?: boolean | undefined;
|
|
2620
2620
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2621
2621
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2673,7 +2673,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2673
2673
|
virtualize?: boolean | undefined;
|
|
2674
2674
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2675
2675
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2676
|
-
|
|
2676
|
+
alignedLayout: (slotProps?: ({
|
|
2677
2677
|
loading?: boolean | undefined;
|
|
2678
2678
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2679
2679
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2731,7 +2731,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2731
2731
|
virtualize?: boolean | undefined;
|
|
2732
2732
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2733
2733
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2734
|
-
|
|
2734
|
+
alignedPinnedLeft: (slotProps?: ({
|
|
2735
2735
|
loading?: boolean | undefined;
|
|
2736
2736
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2737
2737
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2789,7 +2789,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2789
2789
|
virtualize?: boolean | undefined;
|
|
2790
2790
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2791
2791
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2792
|
-
|
|
2792
|
+
alignedPinnedRight: (slotProps?: ({
|
|
2793
2793
|
loading?: boolean | undefined;
|
|
2794
2794
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2795
2795
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2847,7 +2847,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2847
2847
|
virtualize?: boolean | undefined;
|
|
2848
2848
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2849
2849
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2850
|
-
|
|
2850
|
+
alignedContent: (slotProps?: ({
|
|
2851
2851
|
loading?: boolean | undefined;
|
|
2852
2852
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2853
2853
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2905,7 +2905,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2905
2905
|
virtualize?: boolean | undefined;
|
|
2906
2906
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2907
2907
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2908
|
-
|
|
2908
|
+
alignedFiller: (slotProps?: ({
|
|
2909
2909
|
loading?: boolean | undefined;
|
|
2910
2910
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2911
2911
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -2963,7 +2963,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
2963
2963
|
virtualize?: boolean | undefined;
|
|
2964
2964
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
2965
2965
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
2966
|
-
|
|
2966
|
+
rowAnimation: (slotProps?: ({
|
|
2967
2967
|
loading?: boolean | undefined;
|
|
2968
2968
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
2969
2969
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -3021,7 +3021,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
3021
3021
|
virtualize?: boolean | undefined;
|
|
3022
3022
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
3023
3023
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
3024
|
-
|
|
3024
|
+
addRowIndicator: (slotProps?: ({
|
|
3025
3025
|
loading?: boolean | undefined;
|
|
3026
3026
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
3027
3027
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -3079,7 +3079,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
3079
3079
|
virtualize?: boolean | undefined;
|
|
3080
3080
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
3081
3081
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
3082
|
-
|
|
3082
|
+
caption: (slotProps?: ({
|
|
3083
3083
|
loading?: boolean | undefined;
|
|
3084
3084
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
3085
3085
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -3137,7 +3137,7 @@ export declare function useNuGridUI(props: NuGridProps): {
|
|
|
3137
3137
|
virtualize?: boolean | undefined;
|
|
3138
3138
|
sticky?: boolean | "header" | "footer" | undefined;
|
|
3139
3139
|
} & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
|
|
3140
|
-
|
|
3140
|
+
thead: (slotProps?: ({
|
|
3141
3141
|
loading?: boolean | undefined;
|
|
3142
3142
|
loadingAnimation?: "carousel" | "carousel-inverse" | "swing" | "elastic" | undefined;
|
|
3143
3143
|
loadingColor?: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral" | undefined;
|
|
@@ -43,8 +43,8 @@ export const nuGridDefaults = {
|
|
|
43
43
|
mode: "div",
|
|
44
44
|
stickyHeaders: false,
|
|
45
45
|
scrollbars: "scroll",
|
|
46
|
-
autoSize: "fill"
|
|
47
|
-
resizeMode
|
|
46
|
+
autoSize: "fill"
|
|
47
|
+
// resizeMode defaults to 'shift' when autoSize is 'fill', otherwise 'expand'
|
|
48
48
|
},
|
|
49
49
|
columnDefaults: {
|
|
50
50
|
sortIcons: {
|
|
@@ -10,6 +10,7 @@ export declare const nuGridTheme: {
|
|
|
10
10
|
th: string;
|
|
11
11
|
td: string;
|
|
12
12
|
tr: string;
|
|
13
|
+
tbody: string;
|
|
13
14
|
loading: string;
|
|
14
15
|
empty: string;
|
|
15
16
|
separator: string;
|
|
@@ -54,7 +55,6 @@ export declare const nuGridTheme: {
|
|
|
54
55
|
addRowIndicator: string;
|
|
55
56
|
caption: string;
|
|
56
57
|
thead: string;
|
|
57
|
-
tbody: string;
|
|
58
58
|
tfoot: string;
|
|
59
59
|
};
|
|
60
60
|
variants: {
|
|
@@ -12,12 +12,13 @@ export const nuGridTheme = {
|
|
|
12
12
|
checkboxContainer: "",
|
|
13
13
|
checkboxIcon: "",
|
|
14
14
|
// Base slots with div mode styles merged in - pb-3 provides space for horizontal scrollbar
|
|
15
|
-
base: "flex flex-col pb-3 w-max min-w-0
|
|
15
|
+
base: "flex flex-col pb-3 w-max min-w-0",
|
|
16
16
|
// Scrollbar styling - uses tailwind-scrollbar plugin
|
|
17
17
|
scrollbar: "scrollbar-thin scrollbar-track-transparent scrollbar-thumb-gray-400/50 hover:scrollbar-thumb-gray-500/60 dark:scrollbar-thumb-gray-500/50 dark:hover:scrollbar-thumb-gray-400/60 scrollbar-thumb-rounded",
|
|
18
18
|
th: "flex shrink-0 items-stretch p-0! group text-left rtl:text-right text-sm font-semibold text-highlighted py-2 first:rounded-l-lg last:rounded-r-lg border-y border-default first:border-l last:border-r",
|
|
19
19
|
td: "flex shrink-0 items-center overflow-hidden p-4 whitespace-nowrap text-sm text-muted outline-none! focus-visible:outline-none! border-b border-default",
|
|
20
20
|
tr: "flex outline-none! focus-visible:outline-none!",
|
|
21
|
+
tbody: "divide-y-0",
|
|
21
22
|
loading: "flex-1",
|
|
22
23
|
empty: "flex-1",
|
|
23
24
|
separator: "flex-1 h-0",
|
|
@@ -13,6 +13,7 @@ export declare const nuGridThemeCompact: {
|
|
|
13
13
|
th: string;
|
|
14
14
|
td: string;
|
|
15
15
|
tr: string;
|
|
16
|
+
tbody: string;
|
|
16
17
|
loading: string;
|
|
17
18
|
empty: string;
|
|
18
19
|
separator: string;
|
|
@@ -56,7 +57,6 @@ export declare const nuGridThemeCompact: {
|
|
|
56
57
|
addRowIndicator: string;
|
|
57
58
|
caption: string;
|
|
58
59
|
thead: string;
|
|
59
|
-
tbody: string;
|
|
60
60
|
tfoot: string;
|
|
61
61
|
};
|
|
62
62
|
variants: {
|
|
@@ -18,6 +18,7 @@ export const nuGridThemeCompact = {
|
|
|
18
18
|
// Tighter cell padding: px-2 py-1 instead of p-4
|
|
19
19
|
td: "flex shrink-0 items-center overflow-hidden border-r border-gray-300/50 dark:border-gray-600/50 last:border-r-0 px-2 py-1 whitespace-nowrap text-sm text-gray-900 dark:text-white outline-none! focus-visible:outline-none!",
|
|
20
20
|
tr: "flex border-b border-gray-300 dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-700 outline-none! focus-visible:outline-none!",
|
|
21
|
+
tbody: "divide-y-0",
|
|
21
22
|
loading: "flex-1",
|
|
22
23
|
empty: "flex-1",
|
|
23
24
|
separator: "flex-1",
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nu-grid/nuxt",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.3.
|
|
4
|
+
"version": "0.3.1",
|
|
5
5
|
"description": "A powerful data grid component for Nuxt with virtualization, cell editing, and TanStack Table integration",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"homepage": "https://www.nu-grid.dev",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
}
|
|
62
62
|
},
|
|
63
63
|
"dependencies": {
|
|
64
|
-
"@nuxt/kit": "^4.
|
|
64
|
+
"@nuxt/kit": "^4.3.0",
|
|
65
65
|
"@tanstack/vue-table": "^8.21.3",
|
|
66
66
|
"defu": "^6.1.4",
|
|
67
67
|
"tailwind-scrollbar": "^4.0.2"
|
|
@@ -74,9 +74,9 @@
|
|
|
74
74
|
"@nuxt/devtools": "^3.1.0",
|
|
75
75
|
"@nuxt/eslint": "^1.11.0",
|
|
76
76
|
"@nuxt/module-builder": "^1.0.2",
|
|
77
|
-
"@nuxt/schema": "^4.
|
|
77
|
+
"@nuxt/schema": "^4.3.0",
|
|
78
78
|
"@nuxt/test-utils": "^3.20.1",
|
|
79
|
-
"@nuxt/ui": "^4.
|
|
79
|
+
"@nuxt/ui": "^4.4.0",
|
|
80
80
|
"@playwright/test": "^1.57.0",
|
|
81
81
|
"@types/node": "latest",
|
|
82
82
|
"@vitest/ui": "^4.0.14",
|
|
@@ -86,7 +86,7 @@
|
|
|
86
86
|
"eslint-config-prettier": "^10.1.8",
|
|
87
87
|
"eslint-plugin-prettier": "^5.5.4",
|
|
88
88
|
"happy-dom": "^20.0.11",
|
|
89
|
-
"nuxt": "^4.
|
|
89
|
+
"nuxt": "^4.3.0",
|
|
90
90
|
"prettier": "^3.7.4",
|
|
91
91
|
"prettier-plugin-classnames": "^0.8.6",
|
|
92
92
|
"typescript": "^5.9.3",
|