@indielayer/ui 1.13.0 → 1.13.2

package/docs/pages/component/table/usage.vue

@@ -8,7 +8,7 @@ const headers: TableHeader[] = [
   { text: '#', value: 'id', sortable: true, align: 'center' },
   { text: 'Title', value: 'title' },
   { text: 'Description', value: 'description', truncate: true, width: 400 },
-  { text: 'Published', value: 'published', sortable: true, tooltip: 'Published date' },
+  { text: 'Published', value: 'published', sortable: true, tooltip: 'Published date', align: 'center' },
   { text: 'Status', value: 'status' },
 ]
 

package/lib/components/select/Select.vue.js

@@ -256,7 +256,7 @@ const ol = { class: "relative" }, sl = {
       if (!N.value)
         return 0;
       const e = N.value.querySelectorAll(".x-tag"), t = Array.from(e);
-      let l = 0, a = 0;
+      let l = 0, a = 1;
       const h = N.value.offsetWidth - 30;
       for (let p = 0; p < t.length; p++) {
         const f = t[p];

package/lib/components/table/TableHeader.vue.d.ts

@@ -20,7 +20,7 @@ declare const tableHeaderProps: {
 export type TableHeaderSort = typeof validators.sort[number];
 export type TableHeaderAlign = typeof validators.textAlign[number];
 export type TableHeaderProps = ExtractPublicPropTypes<typeof tableHeaderProps>;
-type InternalClasses = 'th' | 'sortIcon';
+type InternalClasses = 'th' | 'sortIcon' | 'header';
 export interface TableHeaderTheme extends ThemeComponent<TableHeaderProps, InternalClasses> {
 }
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<{

package/lib/components/table/TableHeader.vue.js

@@ -1,43 +1,45 @@
-import { defineComponent as g, openBlock as o, createElementBlock as n, normalizeStyle as k, unref as s, normalizeClass as p, createElementVNode as r, renderSlot as c, createBlock as v, createCommentVNode as d, Fragment as u } from "vue";
-import { useTheme as b } from "../../composables/useTheme.js";
+import { defineComponent as k, openBlock as o, createElementBlock as r, normalizeStyle as g, unref as n, normalizeClass as a, createElementVNode as s, renderSlot as v, createBlock as b, createCommentVNode as d, Fragment as u } from "vue";
+import { useTheme as c } from "../../composables/useTheme.js";
 import h from "../tooltip/ToggleTip.vue.js";
-const B = { class: "flex items-center gap-1 select-none" }, C = {
+const B = {
   key: 2,
   d: "m3 9l4-4l4 4M7 5v14m14-4l-4 4l-4-4m4 4V5"
-}, i = {
+}, p = {
   sort: [1, -1, void 0],
   textAlign: ["left", "center", "right", "justify"]
-}, N = {
+}, C = {
   sort: {
     type: Number,
-    validator: (l) => i.sort.includes(l)
+    validator: (l) => p.sort.includes(l)
   },
   sortable: Boolean,
   textAlign: {
     type: String,
     default: "left",
-    validator: (l) => i.textAlign.includes(l)
+    validator: (l) => p.textAlign.includes(l)
   },
   tooltip: String
-}, S = { name: "XTableHeader", validators: i }, T = /* @__PURE__ */ g({
-  ...S,
-  props: N,
+}, N = { name: "XTableHeader", validators: p }, T = /* @__PURE__ */ k({
+  ...N,
+  props: C,
   setup(l) {
-    const m = l, { styles: y, classes: a, className: f } = b("TableHeader", {}, m);
-    return (e, t) => (o(), n("th", {
-      style: k(s(y)),
-      class: p([s(f), s(a).th, "group/th"])
+    const m = l, { styles: y, classes: i, className: f } = c("TableHeader", {}, m);
+    return (e, t) => (o(), r("th", {
+      style: g(n(y)),
+      class: a([n(f), n(i).th, "group/th"])
     }, [
-      r("div", B, [
-        c(e.$slots, "default"),
-        e.tooltip ? (o(), v(h, {
+      s("div", {
+        class: a(n(i).header)
+      }, [
+        v(e.$slots, "default"),
+        e.tooltip ? (o(), b(h, {
           key: 0,
           content: e.tooltip
         }, null, 8, ["content"])) : d("", !0),
-        e.sortable ? (o(), n("svg", {
+        e.sortable ? (o(), r("svg", {
           key: 1,
-          class: p(["shrink-0", [
-            s(a).sortIcon,
+          class: a(["shrink-0", [
+            n(i).sortIcon,
             [e.sort && [1, -1].includes(e.sort) ? "" : "invisible group-hover/th:visible"],
             [e.sort !== -1 && e.sort !== 1 ? "text-secondary-400" : "text-primary-700"]
           ]]),
@@ -50,25 +52,25 @@ const B = { class: "flex items-center gap-1 select-none" }, C = {
           fill: "none",
           role: "presentation"
         }, [
-          e.sort === -1 ? (o(), n(u, { key: 0 }, [
-            t[0] || (t[0] = r("line", {
+          e.sort === -1 ? (o(), r(u, { key: 0 }, [
+            t[0] || (t[0] = s("line", {
               x1: "12",
               y1: "5",
               x2: "12",
               y2: "19"
             }, null, -1)),
-            t[1] || (t[1] = r("polyline", { points: "19 12 12 19 5 12" }, null, -1))
-          ], 64)) : e.sort === 1 ? (o(), n(u, { key: 1 }, [
-            t[2] || (t[2] = r("line", {
+            t[1] || (t[1] = s("polyline", { points: "19 12 12 19 5 12" }, null, -1))
+          ], 64)) : e.sort === 1 ? (o(), r(u, { key: 1 }, [
+            t[2] || (t[2] = s("line", {
               x1: "12",
               y1: "19",
               x2: "12",
               y2: "5"
             }, null, -1)),
-            t[3] || (t[3] = r("polyline", { points: "5 12 12 5 19 12" }, null, -1))
-          ], 64)) : (o(), n("path", C))
+            t[3] || (t[3] = s("polyline", { points: "5 12 12 5 19 12" }, null, -1))
+          ], 64)) : (o(), r("path", B))
         ], 2)) : d("", !0)
-      ])
+      ], 2)
     ], 6));
   }
 });

package/lib/components/table/theme/TableHeader.base.theme.js

@@ -2,7 +2,11 @@ const s = {
   classes: {
     th: ({ props: e }) => {
       const t = ["relative p-2.5 font-medium"];
-      return e.sortable && t.push("cursor-pointer hover:text-secondary-800 dark:hover:text-secondary-300 transition-colors duration-150 ease-in-out"), e.textAlign === "left" && t.push("text-left"), e.textAlign === "right" && t.push("text-right"), e.textAlign === "center" && t.push("text-center"), e.textAlign === "justify" && t.push("text-justify"), t;
+      return e.sortable && t.push("cursor-pointer hover:text-secondary-800 dark:hover:text-secondary-300 transition-colors duration-150 ease-in-out"), t;
+    },
+    header: ({ props: e }) => {
+      const t = ["flex items-center gap-1 select-none"];
+      return e.textAlign === "left" && t.push("justify-start"), e.textAlign === "right" && t.push("justify-end"), e.textAlign === "center" && t.push("justify-center"), e.textAlign === "justify" && t.push("justify-center"), t;
     },
     sortIcon: ({ props: e }) => ["stroke-2 w-3 h-3"]
   }