@underverse-ui/underverse 2.0.2 → 2.0.3

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.
Files changed (7) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/api-reference.json +1 -1
  3. package/dist/index.cjs +71 -49
  4. package/dist/index.cjs.map +1 -1
  5. package/dist/index.js +71 -49
  6. package/dist/index.js.map +1 -1
  7. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -21558,60 +21558,82 @@ function DataTableHeader({
21558
21558
  const sortByText = sortByLabel ?? gi18n.sortBy ?? "Sort by";
21559
21559
  const sortLabel = `${sortByText} ${columnLabel}`;
21560
21560
  const useEndIcon = (col.iconPosition ?? "end") === "end";
21561
- const titleContent = /* @__PURE__ */ jsxs50("div", { className: cn("flex items-center gap-1", useEndIcon && "flex-1 justify-between"), children: [
21562
- /* @__PURE__ */ jsx58("span", { className: cn("font-medium whitespace-nowrap select-text", headerTitleClass), children: col.title }),
21563
- col.sortable && /* @__PURE__ */ jsx58(
21564
- Tooltip,
21565
- {
21566
- placement: "top",
21567
- content: /* @__PURE__ */ jsx58("span", { className: "text-xs font-medium", children: sortLabel }),
21568
- children: /* @__PURE__ */ jsx58(
21569
- "button",
21561
+ const titleContent = /* @__PURE__ */ jsxs50(
21562
+ "div",
21563
+ {
21564
+ "data-underverse-datatable-header-content": col.key,
21565
+ className: cn(
21566
+ "items-center gap-1",
21567
+ useEndIcon && isCenterAlign ? "grid flex-1 grid-cols-[1fr_auto_1fr]" : "flex",
21568
+ useEndIcon && !isCenterAlign && "flex-1 justify-between"
21569
+ ),
21570
+ children: [
21571
+ /* @__PURE__ */ jsx58(
21572
+ "span",
21570
21573
  {
21571
- type: "button",
21572
- title: sortLabel,
21573
21574
  className: cn(
21574
- "p-1 rounded-lg transition-all duration-200 hover:bg-foreground/10",
21575
- sort?.key === col.key ? "opacity-100 bg-foreground/10" : "opacity-60 hover:opacity-100"
21575
+ "font-medium whitespace-nowrap select-text",
21576
+ useEndIcon && isCenterAlign && "col-start-2",
21577
+ headerTitleClass
21576
21578
  ),
21577
- onClick: () => {
21578
- setCurPage(1);
21579
- setSort((current) => {
21580
- if (!current || current.key !== col.key) return { key: col.key, order: "asc" };
21581
- if (current.order === "asc") return { key: col.key, order: "desc" };
21582
- return null;
21583
- });
21584
- },
21585
- "aria-label": sortLabel,
21586
- children: /* @__PURE__ */ jsxs50("svg", { viewBox: "0 0 20 20", fill: "none", className: cn("inline-block", sortIconClass), children: [
21587
- /* @__PURE__ */ jsx58(
21588
- "path",
21589
- {
21590
- d: "M5 7.5l5-5 5 5",
21591
- stroke: "currentColor",
21592
- strokeWidth: "1.5",
21593
- strokeLinecap: "round",
21594
- strokeLinejoin: "round",
21595
- opacity: sort?.key === col.key && sort.order === "asc" ? 1 : 0.4
21596
- }
21597
- ),
21598
- /* @__PURE__ */ jsx58(
21599
- "path",
21600
- {
21601
- d: "M5 12.5l5 5 5-5",
21602
- stroke: "currentColor",
21603
- strokeWidth: "1.5",
21604
- strokeLinecap: "round",
21605
- strokeLinejoin: "round",
21606
- opacity: sort?.key === col.key && sort.order === "desc" ? 1 : 0.4
21607
- }
21608
- )
21609
- ] })
21579
+ children: col.title
21580
+ }
21581
+ ),
21582
+ col.sortable && /* @__PURE__ */ jsx58(
21583
+ Tooltip,
21584
+ {
21585
+ placement: "top",
21586
+ content: /* @__PURE__ */ jsx58("span", { className: "text-xs font-medium", children: sortLabel }),
21587
+ children: /* @__PURE__ */ jsx58(
21588
+ "button",
21589
+ {
21590
+ type: "button",
21591
+ title: sortLabel,
21592
+ className: cn(
21593
+ "p-1 rounded-lg transition-all duration-200 hover:bg-foreground/10",
21594
+ useEndIcon && isCenterAlign && "col-start-3 justify-self-end",
21595
+ sort?.key === col.key ? "opacity-100 bg-foreground/10" : "opacity-60 hover:opacity-100"
21596
+ ),
21597
+ onClick: () => {
21598
+ setCurPage(1);
21599
+ setSort((current) => {
21600
+ if (!current || current.key !== col.key) return { key: col.key, order: "asc" };
21601
+ if (current.order === "asc") return { key: col.key, order: "desc" };
21602
+ return null;
21603
+ });
21604
+ },
21605
+ "aria-label": sortLabel,
21606
+ children: /* @__PURE__ */ jsxs50("svg", { viewBox: "0 0 20 20", fill: "none", className: cn("inline-block", sortIconClass), children: [
21607
+ /* @__PURE__ */ jsx58(
21608
+ "path",
21609
+ {
21610
+ d: "M5 7.5l5-5 5 5",
21611
+ stroke: "currentColor",
21612
+ strokeWidth: "1.5",
21613
+ strokeLinecap: "round",
21614
+ strokeLinejoin: "round",
21615
+ opacity: sort?.key === col.key && sort.order === "asc" ? 1 : 0.4
21616
+ }
21617
+ ),
21618
+ /* @__PURE__ */ jsx58(
21619
+ "path",
21620
+ {
21621
+ d: "M5 12.5l5 5 5-5",
21622
+ stroke: "currentColor",
21623
+ strokeWidth: "1.5",
21624
+ strokeLinecap: "round",
21625
+ strokeLinejoin: "round",
21626
+ opacity: sort?.key === col.key && sort.order === "desc" ? 1 : 0.4
21627
+ }
21628
+ )
21629
+ ] })
21630
+ }
21631
+ )
21610
21632
  }
21611
21633
  )
21612
- }
21613
- )
21614
- ] });
21634
+ ]
21635
+ }
21636
+ );
21615
21637
  const filterContent = col.filter ? /* @__PURE__ */ jsx58(
21616
21638
  Popover,
21617
21639
  {