@aspprev/versi-ds 0.4.7 → 0.4.9

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.
@@ -862,10 +862,32 @@ import cs2 from "classnames";
862
862
 
863
863
  // src/components/pagination/components/PageButtons.tsx
864
864
  import cs from "classnames";
865
+
866
+ // src/components/pagination/pagination-styles.ts
867
+ var PAGINATION_SIZE_CLASSES = {
868
+ normal: {
869
+ itemHeight: "box-border h-7 min-h-7",
870
+ pageWidth: "w-8",
871
+ controlPadding: "px-2",
872
+ text: "text-sm",
873
+ gap: "gap-1.5"
874
+ },
875
+ small: {
876
+ itemHeight: "box-border h-6 min-h-6",
877
+ pageWidth: "w-6",
878
+ controlPadding: "px-1.5",
879
+ text: "text-xs",
880
+ gap: "gap-1"
881
+ }
882
+ };
883
+ var PAGINATION_ITEM_HEIGHT_CLASS = PAGINATION_SIZE_CLASSES.normal.itemHeight;
884
+
885
+ // src/components/pagination/components/PageButtons.tsx
865
886
  import { jsx as jsx16 } from "react/jsx-runtime";
866
887
  function PageButtons(props) {
867
- const { currentPage, totalResults, perPage, onClick } = props;
868
- const pages = totalResults > 10 ? Math.ceil(totalResults / perPage) : 1;
888
+ const { currentPage, totalResults, perPage, onClick, size } = props;
889
+ const pages = Math.max(1, Math.ceil(totalResults / perPage));
890
+ const sizeClasses = PAGINATION_SIZE_CLASSES[size];
869
891
  let pagesAfter = pages - currentPage > 2 ? 2 : pages - currentPage;
870
892
  let pagesBefore = currentPage > 2 ? 2 : currentPage === 2 ? 1 : 0;
871
893
  let buttonsBefore = [];
@@ -879,8 +901,13 @@ function PageButtons(props) {
879
901
  type: "button",
880
902
  "aria-label": `P\xE1gina ${page}`,
881
903
  className: cs(
882
- "flex h-7 w-8 items-center justify-center rounded border border-border-default",
883
- "cursor-pointer bg-surface-card text-sm text-content-primary hover:bg-surface-muted",
904
+ sizeClasses.itemHeight,
905
+ "flex",
906
+ sizeClasses.pageWidth,
907
+ "items-center justify-center rounded border border-border-default",
908
+ "cursor-pointer bg-surface-card",
909
+ sizeClasses.text,
910
+ "text-content-primary hover:bg-surface-muted",
884
911
  "focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring"
885
912
  ),
886
913
  onClick: () => onClick(page),
@@ -900,8 +927,13 @@ function PageButtons(props) {
900
927
  type: "button",
901
928
  "aria-label": `P\xE1gina ${page}`,
902
929
  className: cs(
903
- "flex h-7 w-8 items-center justify-center rounded border border-border-default",
904
- "cursor-pointer bg-surface-card text-sm text-content-primary hover:bg-surface-muted",
930
+ sizeClasses.itemHeight,
931
+ "flex",
932
+ sizeClasses.pageWidth,
933
+ "items-center justify-center rounded border border-border-default",
934
+ "cursor-pointer bg-surface-card",
935
+ sizeClasses.text,
936
+ "text-content-primary hover:bg-surface-muted",
905
937
  "focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring"
906
938
  ),
907
939
  onClick: () => onClick(page),
@@ -921,8 +953,13 @@ function PageButtons(props) {
921
953
  "aria-current": "page",
922
954
  disabled: true,
923
955
  className: cs(
924
- "flex h-7 w-8 items-center justify-center rounded border border-selection-border",
925
- "cursor-default bg-selection-background text-sm text-selection-content"
956
+ sizeClasses.itemHeight,
957
+ "flex",
958
+ sizeClasses.pageWidth,
959
+ "items-center justify-center rounded border border-selection-border",
960
+ "cursor-default bg-selection-background",
961
+ sizeClasses.text,
962
+ "text-selection-content"
926
963
  ),
927
964
  children: currentPage
928
965
  },
@@ -936,7 +973,17 @@ var PageButtons_default = PageButtons;
936
973
  // src/components/pagination/PaginationView.tsx
937
974
  import { jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
938
975
  function PaginationView(props) {
939
- const { currentPage, totalResults, perPage, onClick } = props;
976
+ const {
977
+ currentPage,
978
+ totalResults,
979
+ perPage,
980
+ onClick,
981
+ size = "normal",
982
+ variant = "default"
983
+ } = props;
984
+ const totalPages = Math.max(1, Math.ceil(totalResults / perPage));
985
+ const sizeClasses = PAGINATION_SIZE_CLASSES[size];
986
+ const controlWidth = variant === "arrows" ? sizeClasses.pageWidth : "";
940
987
  return /* @__PURE__ */ jsxs9(
941
988
  "nav",
942
989
  {
@@ -954,20 +1001,25 @@ function PaginationView(props) {
954
1001
  totalResults,
955
1002
  " resultados"
956
1003
  ] }),
957
- /* @__PURE__ */ jsxs9("div", { className: "flex items-stretch gap-1.5", children: [
1004
+ /* @__PURE__ */ jsxs9("div", { className: cs2("flex items-stretch", sizeClasses.gap), children: [
958
1005
  currentPage > 1 && /* @__PURE__ */ jsxs9(
959
1006
  "button",
960
1007
  {
961
1008
  type: "button",
1009
+ "aria-label": "Ir para a p\xE1gina anterior",
962
1010
  className: cs2(
963
- "h-7 w-24 rounded-sm border border-border-default",
964
- "flex items-center justify-center gap-1 text-content-primary text-sm",
1011
+ sizeClasses.itemHeight,
1012
+ controlWidth,
1013
+ sizeClasses.controlPadding,
1014
+ "rounded-sm border border-border-default",
1015
+ "flex items-center justify-center gap-1 whitespace-nowrap text-content-primary",
1016
+ sizeClasses.text,
965
1017
  "cursor-pointer focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring"
966
1018
  ),
967
1019
  onClick: () => onClick(currentPage - 1),
968
1020
  children: [
969
- /* @__PURE__ */ jsx17(MdChevronLeft, { size: 10, "aria-hidden": "true", focusable: "false" }),
970
- "Anterior"
1021
+ /* @__PURE__ */ jsx17(MdChevronLeft, { size: size === "small" ? 9 : 10, "aria-hidden": "true", focusable: "false" }),
1022
+ variant === "default" && "Anterior"
971
1023
  ]
972
1024
  }
973
1025
  ),
@@ -977,22 +1029,28 @@ function PaginationView(props) {
977
1029
  currentPage,
978
1030
  totalResults,
979
1031
  perPage,
980
- onClick
1032
+ onClick,
1033
+ size
981
1034
  }
982
1035
  ),
983
- currentPage < Math.ceil(totalResults / 10) && /* @__PURE__ */ jsxs9(
1036
+ currentPage < totalPages && /* @__PURE__ */ jsxs9(
984
1037
  "button",
985
1038
  {
986
1039
  type: "button",
1040
+ "aria-label": "Ir para a pr\xF3xima p\xE1gina",
987
1041
  className: cs2(
988
- "h-7 w-24 rounded-sm border border-border-default",
989
- "flex items-center justify-center gap-1 text-content-primary text-sm",
1042
+ sizeClasses.itemHeight,
1043
+ controlWidth,
1044
+ sizeClasses.controlPadding,
1045
+ "rounded-sm border border-border-default",
1046
+ "flex items-center justify-center gap-1 whitespace-nowrap text-content-primary",
1047
+ sizeClasses.text,
990
1048
  "cursor-pointer focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring"
991
1049
  ),
992
1050
  onClick: () => onClick(currentPage + 1),
993
1051
  children: [
994
- "Pr\xF3xima",
995
- /* @__PURE__ */ jsx17(MdChevronRight, { size: 10, "aria-hidden": "true", focusable: "false" })
1052
+ variant === "default" && "Pr\xF3xima",
1053
+ /* @__PURE__ */ jsx17(MdChevronRight, { size: size === "small" ? 9 : 10, "aria-hidden": "true", focusable: "false" })
996
1054
  ]
997
1055
  }
998
1056
  )
@@ -2461,6 +2519,7 @@ function TableView({
2461
2519
  };
2462
2520
  const isNarrowContainer = tableWidth !== void 0 && tableWidth < 640;
2463
2521
  const paginationVariant = isNarrowContainer ? "arrows" : pagination?.variant ?? "default";
2522
+ const paginationSizeClasses = PAGINATION_SIZE_CLASSES[pagination?.size ?? "normal"];
2464
2523
  const isAdaptiveCompact = overflowMode === "adaptive" && tableWidth !== void 0 && tableWidth < adaptiveBreakpoint;
2465
2524
  const overflowClass = overflowMode === "scroll" ? "overflow-x-auto" : "overflow-x-hidden";
2466
2525
  const resolvedScrollAreaMaxHeight = stickyHeader ? scrollAreaMaxHeight ?? "calc(100dvh - 240px)" : scrollAreaMaxHeight;
@@ -2590,7 +2649,7 @@ function TableView({
2590
2649
  ]
2591
2650
  }
2592
2651
  ),
2593
- /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-1", children: [
2652
+ /* @__PURE__ */ jsxs18("div", { className: `flex items-center ${paginationSizeClasses.gap}`, children: [
2594
2653
  /* @__PURE__ */ jsxs18(
2595
2654
  "button",
2596
2655
  {
@@ -2598,7 +2657,7 @@ function TableView({
2598
2657
  onClick: pagination.onPrevious,
2599
2658
  disabled: pagination.currentPage === 1,
2600
2659
  "aria-label": "Ir para a p\xE1gina anterior",
2601
- className: `inline-flex min-h-11 min-w-11 items-center justify-center gap-1 rounded border border-border-default px-2 text-sm leading-none text-content-primary hover:border-border-strong disabled:cursor-not-allowed disabled:border-border-default disabled:opacity-50 ${paginationVariant === "arrows" ? "min-w-6 tablet:min-w-7" : ""}`,
2660
+ className: `${paginationSizeClasses.itemHeight} inline-flex ${paginationVariant === "arrows" ? paginationSizeClasses.pageWidth : ""} items-center justify-center gap-1 whitespace-nowrap rounded border border-border-default ${paginationSizeClasses.controlPadding} ${paginationSizeClasses.text} leading-none text-content-primary hover:border-border-strong disabled:cursor-not-allowed disabled:border-border-default disabled:opacity-50`,
2602
2661
  children: [
2603
2662
  /* @__PURE__ */ jsx33(MdKeyboardArrowLeft, { className: "h-3 w-3 text-content-muted" }),
2604
2663
  paginationVariant !== "arrows" && "Anterior"
@@ -2610,7 +2669,7 @@ function TableView({
2610
2669
  {
2611
2670
  "aria-live": "polite",
2612
2671
  "aria-atomic": "true",
2613
- className: "inline-flex h-6 min-w-6 items-center justify-center rounded border border-selection-border bg-selection-background px-1.5 text-sm font-bold leading-none text-selection-content tablet:h-7 tablet:min-w-7",
2672
+ className: `${paginationSizeClasses.itemHeight} inline-flex ${paginationSizeClasses.pageWidth} items-center justify-center rounded border border-selection-border bg-selection-background ${paginationSizeClasses.controlPadding} ${paginationSizeClasses.text} font-bold leading-none text-selection-content`,
2614
2673
  children: pagination.currentPage
2615
2674
  }
2616
2675
  ),
@@ -2621,7 +2680,7 @@ function TableView({
2621
2680
  onClick: pagination.onNext,
2622
2681
  disabled: pagination.currentPage === pagination.totalPages,
2623
2682
  "aria-label": "Ir para a pr\xF3xima p\xE1gina",
2624
- className: `inline-flex min-h-11 min-w-11 items-center justify-center gap-1 rounded border border-border-default px-2 text-sm leading-none text-content-primary hover:border-border-strong disabled:cursor-not-allowed disabled:border-border-default disabled:opacity-50 ${paginationVariant === "arrows" ? "min-w-6 tablet:min-w-7" : ""}`,
2683
+ className: `${paginationSizeClasses.itemHeight} inline-flex ${paginationVariant === "arrows" ? paginationSizeClasses.pageWidth : ""} items-center justify-center gap-1 whitespace-nowrap rounded border border-border-default ${paginationSizeClasses.controlPadding} ${paginationSizeClasses.text} leading-none text-content-primary hover:border-border-strong disabled:cursor-not-allowed disabled:border-border-default disabled:opacity-50`,
2625
2684
  children: [
2626
2685
  paginationVariant !== "arrows" && "Pr\xF3xima",
2627
2686
  /* @__PURE__ */ jsx33(MdKeyboardArrowRight, { className: "h-3 w-3 text-content-muted" })
@@ -2657,6 +2716,7 @@ function Table(props) {
2657
2716
  totalWidthUnits,
2658
2717
  showRowDivider = false,
2659
2718
  enableRowHover = false,
2719
+ paginationSize = "normal",
2660
2720
  paginationVariant = "default",
2661
2721
  expandable,
2662
2722
  overflowMode,
@@ -2916,6 +2976,7 @@ function Table(props) {
2916
2976
  totalItems: internalPagination.totalItems,
2917
2977
  startItem: internalPagination.startItem,
2918
2978
  endItem: internalPagination.endItem,
2979
+ size: paginationSize,
2919
2980
  variant: paginationVariant,
2920
2981
  onPrevious: () => setCurrentPage((prev) => Math.max(prev - 1, 1)),
2921
2982
  onNext: () => setCurrentPage(
@@ -2923,6 +2984,7 @@ function Table(props) {
2923
2984
  )
2924
2985
  } : pagination ? {
2925
2986
  ...pagination,
2987
+ size: pagination.size ?? "normal",
2926
2988
  variant: pagination.variant ?? "default"
2927
2989
  } : pagination;
2928
2990
  const resolvedShowPagination = data ? Boolean(
@@ -3148,7 +3210,7 @@ function MobileCardTable({
3148
3210
  onClick: () => setCurrentPage((prev) => Math.max(prev - 1, 1)),
3149
3211
  disabled: pagination.currentPage === 1,
3150
3212
  "aria-label": "Ir para a p\xE1gina anterior",
3151
- className: "inline-flex h-7 items-center justify-center gap-1 rounded border border-border-default px-3 text-sm leading-none text-content-primary hover:border-border-strong disabled:cursor-not-allowed disabled:opacity-50",
3213
+ className: `${PAGINATION_ITEM_HEIGHT_CLASS} inline-flex items-center justify-center gap-1 rounded border border-border-default px-3 text-sm leading-none text-content-primary hover:border-border-strong disabled:cursor-not-allowed disabled:opacity-50`,
3152
3214
  children: [
3153
3215
  /* @__PURE__ */ jsx35(MdKeyboardArrowLeft2, { className: "h-3 w-3 text-content-muted" }),
3154
3216
  "Anterior"
@@ -3160,7 +3222,7 @@ function MobileCardTable({
3160
3222
  {
3161
3223
  "aria-live": "polite",
3162
3224
  "aria-atomic": "true",
3163
- className: "inline-flex h-7 min-w-7 items-center justify-center rounded border border-selection-border bg-selection-background px-2 text-sm font-bold leading-none text-selection-content",
3225
+ className: `${PAGINATION_ITEM_HEIGHT_CLASS} inline-flex min-w-7 items-center justify-center rounded border border-selection-border bg-selection-background px-2 text-sm font-bold leading-none text-selection-content`,
3164
3226
  children: pagination.currentPage
3165
3227
  }
3166
3228
  ),
@@ -3173,7 +3235,7 @@ function MobileCardTable({
3173
3235
  ),
3174
3236
  disabled: pagination.currentPage === pagination.totalPages,
3175
3237
  "aria-label": "Ir para a pr\xF3xima p\xE1gina",
3176
- className: "inline-flex h-7 items-center justify-center gap-1 rounded border border-border-default px-3 text-sm leading-none text-content-primary hover:border-border-strong disabled:cursor-not-allowed disabled:opacity-50",
3238
+ className: `${PAGINATION_ITEM_HEIGHT_CLASS} inline-flex items-center justify-center gap-1 rounded border border-border-default px-3 text-sm leading-none text-content-primary hover:border-border-strong disabled:cursor-not-allowed disabled:opacity-50`,
3177
3239
  children: [
3178
3240
  "Pr\xF3ximo",
3179
3241
  /* @__PURE__ */ jsx35(MdKeyboardArrowRight2, { className: "h-3 w-3 text-content-muted" })
@@ -3277,4 +3339,4 @@ export {
3277
3339
  resolveContainerBreakpoint,
3278
3340
  useContainerBreakpoint
3279
3341
  };
3280
- //# sourceMappingURL=chunk-DD54XX2X.js.map
3342
+ //# sourceMappingURL=chunk-RMWSF4YF.js.map