@indielayer/ui/lib/components/pagination/PaginationItem.vue.js

Indielayer UI Components with Tailwind CSS build for Vue 3

import { defineComponent as m, openBlock as p, createElementBlock as u, createVNode as d, normalizeStyle as c, unref as o, normalizeClass as f, withCtx as v, createTextVNode as y, toDisplayString as g } from "vue";
import { useTheme as k } from "../../composables/useTheme.js";
import { useCommon as l } from "../../composables/useCommon.js";
import z from "../button/Button.vue.js";
const B = {
  ...l.props(),
  value: {
    type: Number,
    default: 0
  },
  selected: Boolean,
  links: Boolean
}, C = {
  name: "XPaginationItem",
  validators: {
    ...l.validators()
  }
}, S = /* @__PURE__ */ m({
  ...C,
  props: B,
  emits: ["input"],
  setup(s) {
    const n = s, { styles: a, classes: i, className: r } = k("PaginationItem", {}, n);
    return (e, t) => (p(), u("li", null, [
      d(z, {
        to: e.links ? `?page=${e.value}` : void 0,
        size: e.size,
        style: c(o(a)),
        class: f([
          o(r),
          o(i).wrapper
        ]),
        outlined: !e.selected,
        color: e.selected ? "primary" : void 0,
        onClick: t[0] || (t[0] = (N) => e.selected ? null : e.$emit("input", e.value))
      }, {
        default: v(() => [
          y(g(e.value), 1)
        ]),
        _: 1
      }, 8, ["to", "size", "style", "class", "outlined", "color"])
    ]));
  }
});
export {
  S as default
};