@robuust-digital/vue-components 2.0.0 → 2.2.0-rc.0

package/dist/_shared/Tabs.vue_vue_type_script_setup_true_lang-CsGx6wBK.js

@@ -0,0 +1,676 @@
+import { createElementBlock as n, openBlock as a, createElementVNode as c, defineComponent as C, Fragment as k, renderList as w, renderSlot as u, createTextVNode as M, toDisplayString as g, createVNode as L, unref as h, normalizeClass as b, createBlock as B, resolveDynamicComponent as P, withCtx as I, createCommentVNode as $, computed as S, useAttrs as z, ref as _, withDirectives as O, mergeProps as y, vModelDynamic as E, normalizeProps as H, guardReactiveProps as R, vModelSelect as U, vModelText as Z } from "vue";
+import { r as K } from "./XMarkIcon-90mcPzBs.js";
+import { u as N } from "./FormInput.vue_vue_type_script_setup_true_lang-BhJpG-Fw.js";
+import { S as q } from "./icon-spinner-CmxIOqaK.js";
+import { r as G } from "./ChevronDownIcon-DaaXfD3C.js";
+function J(f, s) {
+  return a(), n("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    "data-slot": "icon"
+  }, [
+    c("path", {
+      "fill-rule": "evenodd",
+      d: "M19.916 4.626a.75.75 0 0 1 .208 1.04l-9 13.5a.75.75 0 0 1-1.154.114l-6-6a.75.75 0 0 1 1.06-1.06l5.353 5.353 8.493-12.74a.75.75 0 0 1 1.04-.207Z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+function Q(f, s) {
+  return a(), n("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    "data-slot": "icon"
+  }, [
+    c("path", {
+      "fill-rule": "evenodd",
+      d: "M12 3.75a.75.75 0 0 1 .75.75v6.75h6.75a.75.75 0 0 1 0 1.5h-6.75v6.75a.75.75 0 0 1-1.5 0v-6.75H4.5a.75.75 0 0 1 0-1.5h6.75V4.5a.75.75 0 0 1 .75-.75Z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+const W = { class: "rvc-accordion" }, X = ["open", "name"], Y = ["innerHTML"], Oe = /* @__PURE__ */ C({
+  __name: "Accordion",
+  props: {
+    items: {},
+    name: {},
+    defaultOpenIndex: {},
+    contentClass: {}
+  },
+  setup(f) {
+    return (s, d) => (a(), n("div", W, [
+      (a(!0), n(k, null, w(s.items, (p, o) => (a(), n("details", {
+        key: o,
+        open: s.defaultOpenIndex === o,
+        name: s.name
+      }, [
+        c("summary", null, [
+          u(s.$slots, "summary", {
+            item: p,
+            index: o
+          }, () => [
+            M(g(p.title) + " ", 1),
+            u(s.$slots, "icon", { classList: "rvc-accordion-icon" }, () => [
+              L(h(Q), { class: "rvc-accordion-icon" })
+            ])
+          ])
+        ]),
+        c("div", {
+          class: b(["rvc-accordion-content", s.contentClass])
+        }, [
+          u(s.$slots, "content", { item: p }, () => [
+            c("div", {
+              innerHTML: p.content
+            }, null, 8, Y)
+          ])
+        ], 2)
+      ], 8, X))), 128))
+    ]));
+  }
+}), x = { class: "rvc-alert-title" }, Ne = /* @__PURE__ */ C({
+  __name: "Alert",
+  props: {
+    as: { default: "div" },
+    title: { default: "" },
+    icon: { type: [Function, Object, null], default: null },
+    type: { default: "info" },
+    close: { type: Boolean, default: !1 }
+  },
+  emits: ["alert:close"],
+  setup(f) {
+    return (s, d) => (a(), B(P(s.as), {
+      class: b(["rvc-alert", `rvc-alert-${s.type}`])
+    }, {
+      default: I(() => [
+        u(s.$slots, "icon", {}, () => [
+          s.icon ? (a(), B(P(s.icon), {
+            key: 0,
+            class: "rvc-alert-icon"
+          })) : $("", !0)
+        ]),
+        c("div", null, [
+          u(s.$slots, "title", {}, () => [
+            c("span", x, g(s.title), 1)
+          ]),
+          u(s.$slots, "default")
+        ]),
+        u(s.$slots, "close", {}, () => [
+          s.close ? (a(), n("button", {
+            key: 0,
+            type: "button",
+            class: "rvc-alert-close",
+            onClick: d[0] || (d[0] = (p) => s.$emit("alert:close"))
+          }, [
+            L(h(K))
+          ])) : $("", !0)
+        ])
+      ]),
+      _: 3
+    }, 8, ["class"]));
+  }
+}), ee = { class: "rvc-checkbox-input" }, te = {
+  key: 0,
+  class: "rvc-checkbox-label"
+}, Fe = /* @__PURE__ */ C({
+  inheritAttrs: !1,
+  __name: "Checkbox",
+  props: {
+    modelValue: { type: [Number, String, Object, Array, Boolean, null], default: null },
+    label: { default: "" },
+    rootClass: { default: "" }
+  },
+  emits: ["update:modelValue"],
+  setup(f, { emit: s }) {
+    const d = f, p = s, o = S({
+      get: () => d.modelValue,
+      set: (t) => p("update:modelValue", t)
+    }), { hasModelBinding: r } = N(), m = z(), e = S(() => ({
+      ...m,
+      type: "checkbox"
+    })), l = _(null);
+    return (t, i) => (a(), n("label", {
+      class: b(["rvc-checkbox", t.rootClass])
+    }, [
+      h(r) ? O((a(), n("input", y({ key: 0 }, e.value, {
+        ref_key: "input",
+        ref: l,
+        "onUpdate:modelValue": i[0] || (i[0] = (v) => o.value = v)
+      }), null, 16)), [
+        [E, o.value]
+      ]) : (a(), n("input", y({ key: 1 }, e.value, {
+        ref_key: "input",
+        ref: l
+      }), null, 16)),
+      u(t.$slots, "input", {}, () => [
+        c("span", ee, [
+          u(t.$slots, "icon", {}, () => [
+            L(h(J))
+          ])
+        ])
+      ]),
+      u(t.$slots, "default", { label: t.label }, () => [
+        t.label ? (a(), n("span", te, g(t.label), 1)) : $("", !0)
+      ])
+    ], 2));
+  }
+});
+function ae(f, s) {
+  return a(), n("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 16 16",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    "data-slot": "icon"
+  }, [
+    c("path", {
+      "fill-rule": "evenodd",
+      d: "M8 14a.75.75 0 0 1-.75-.75V4.56L4.03 7.78a.75.75 0 0 1-1.06-1.06l4.5-4.5a.75.75 0 0 1 1.06 0l4.5 4.5a.75.75 0 0 1-1.06 1.06L8.75 4.56v8.69A.75.75 0 0 1 8 14Z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+function le(f, s) {
+  return a(), n("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 20 20",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    "data-slot": "icon"
+  }, [
+    c("path", {
+      "fill-rule": "evenodd",
+      d: "M11.78 5.22a.75.75 0 0 1 0 1.06L8.06 10l3.72 3.72a.75.75 0 1 1-1.06 1.06l-4.25-4.25a.75.75 0 0 1 0-1.06l4.25-4.25a.75.75 0 0 1 1.06 0Z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+function ne(f, s) {
+  return a(), n("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 20 20",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    "data-slot": "icon"
+  }, [
+    c("path", {
+      "fill-rule": "evenodd",
+      d: "M8.22 5.22a.75.75 0 0 1 1.06 0l4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.75.75 0 0 1-1.06-1.06L11.94 10 8.22 6.28a.75.75 0 0 1 0-1.06Z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+const se = ["value"], oe = ["value"], D = /* @__PURE__ */ C({
+  inheritAttrs: !1,
+  __name: "FormSelect",
+  props: {
+    modelValue: { type: [String, Number, Object, Boolean, null], default: null },
+    rootClass: { default: "" },
+    prefixIcon: { type: [Function, Object, null], default: null },
+    icon: { type: [Function, Object, null], default: null },
+    size: { default: "base" },
+    options: { default: () => [] },
+    optionLabel: { default: "name" },
+    optionValue: { default: "id" }
+  },
+  emits: ["update:modelValue"],
+  setup(f, { emit: s }) {
+    const d = f, p = s, o = S({
+      get: () => d.modelValue,
+      set: (e) => p("update:modelValue", e)
+    }), { hasModelBinding: r } = N(), m = _(null);
+    return (e, l) => (a(), n("div", {
+      class: b([
+        "rvc-select",
+        `rvc-select-${e.size}`,
+        e.rootClass
+      ])
+    }, [
+      e.prefixIcon ? u(e.$slots, "prefixIcon", {
+        key: 0,
+        icon: e.prefixIcon
+      }, () => [
+        (a(), B(P(e.prefixIcon), { "aria-hidden": "true" }))
+      ]) : $("", !0),
+      u(e.$slots, "select", H(R(e.$attrs)), () => [
+        h(r) ? O((a(), n("select", y({ key: 0 }, e.$attrs, {
+          ref_key: "select",
+          ref: m,
+          "onUpdate:modelValue": l[0] || (l[0] = (t) => o.value = t)
+        }), [
+          u(e.$slots, "default", {}, () => [
+            e.options.length > 0 ? (a(!0), n(k, { key: 0 }, w(e.options, (t, i) => (a(), n("option", {
+              key: `option-${i}-${t[e.optionValue]}`,
+              value: t[e.optionValue]
+            }, g(t[e.optionLabel]), 9, se))), 128)) : $("", !0)
+          ])
+        ], 16)), [
+          [U, o.value]
+        ]) : (a(), n("select", y({ key: 1 }, e.$attrs, {
+          ref_key: "select",
+          ref: m
+        }), [
+          u(e.$slots, "default", {}, () => [
+            e.options.length > 0 ? (a(!0), n(k, { key: 0 }, w(e.options, (t, i) => (a(), n("option", {
+              key: `option-${i}-${t[e.optionValue]}`,
+              value: t[e.optionValue]
+            }, g(t[e.optionLabel]), 9, oe))), 128)) : $("", !0)
+          ])
+        ], 16))
+      ]),
+      u(e.$slots, "icon", { icon: e.icon }, () => [
+        (a(), B(P(e.icon ?? h(G)), { "aria-hidden": "true" }))
+      ])
+    ], 2));
+  }
+}), re = {
+  key: 0,
+  class: "rvc-pagination"
+}, ie = ["value"], ue = { class: "rvc-pagination-info" }, ce = { class: "rvc-pagination-nav-list" }, de = ["disabled", "onClick"], pe = { key: 2 }, ve = { key: 3 }, fe = /* @__PURE__ */ C({
+  __name: "Pagination",
+  props: {
+    pagination: {},
+    perPage: { default: 10 },
+    perPageLabel: { default: "per page" },
+    perPageOptions: { default: () => [10, 20, 50] },
+    fromLabel: { default: "of" }
+  },
+  emits: ["pagination:change", "pagination:perPage"],
+  setup(f, { emit: s }) {
+    const d = f, p = s, o = _(d.perPage);
+    return (r, m) => {
+      var e;
+      return (e = r.pagination) != null && e.total ? (a(), n("div", re, [
+        u(r.$slots, "perPage", y(r.pagination, { perPage: o.value }), () => [
+          L(D, {
+            modelValue: o.value,
+            "onUpdate:modelValue": [
+              m[0] || (m[0] = (l) => o.value = l),
+              m[1] || (m[1] = (l) => p("pagination:perPage", Number(l)))
+            ],
+            size: "sm",
+            "root-class": "rvc-pagination-per-page"
+          }, {
+            default: I(() => [
+              (a(!0), n(k, null, w(r.perPageOptions, (l) => (a(), n("option", {
+                key: `pagination-items-per-page-option-${l}`,
+                value: l
+              }, g(l) + " " + g(r.perPageLabel), 9, ie))), 128))
+            ]),
+            _: 1
+          }, 8, ["modelValue"])
+        ]),
+        u(r.$slots, "info", y(r.pagination, { fromLabel: r.fromLabel }), () => [
+          c("div", ue, g(r.pagination.from) + " - " + g(r.pagination.to) + " " + g(r.fromLabel) + " " + g(r.pagination.total), 1)
+        ]),
+        c("nav", null, [
+          c("ol", ce, [
+            (a(!0), n(k, null, w(r.pagination.links, (l, t) => (a(), n("li", {
+              key: `pagination-link-${l.label}-${t}`,
+              class: "rvc-pagination-nav-list-item"
+            }, [
+              c("button", {
+                type: "button",
+                disabled: l.label === "..." || !l.url,
+                class: b([
+                  "rvc-pagination-button",
+                  { "rvc-pagination-button-active": l.active }
+                ]),
+                onClick: (i) => l.url && p("pagination:change", l.url)
+              }, [
+                l.url !== "..." && t === 0 ? (a(), B(h(le), {
+                  key: 0,
+                  "aria-hidden": "true",
+                  class: b([
+                    "rvc-pagination-button-icon",
+                    { "rvc-pagination-button-icon-disabled": !l.url }
+                  ])
+                }, null, 8, ["class"])) : l.label !== "..." && t === r.pagination.links.length - 1 ? (a(), B(h(ne), {
+                  key: 1,
+                  "aria-hidden": "true",
+                  class: b([
+                    "rvc-pagination-button-icon",
+                    { "rvc-pagination-button-icon-disabled": !l.url }
+                  ])
+                }, null, 8, ["class"])) : l.label === "..." ? (a(), n("span", pe, " ... ")) : (a(), n("span", ve, g(l.label), 1))
+              ], 10, de)
+            ]))), 128))
+          ])
+        ])
+      ])) : $("", !0);
+    };
+  }
+}), ge = { key: 0 }, me = ["aria-label", "onClick"], be = ["innerHTML"], ye = { key: 1 }, $e = ["colspan"], he = { key: 2 }, ke = ["colspan"], Ve = { class: "rvc-table-spinner-wrapper" }, we = { key: 1 }, je = /* @__PURE__ */ C({
+  __name: "DataTable",
+  props: {
+    headers: { default: () => [] },
+    items: {},
+    noResultsText: { default: "No results found." },
+    loadingText: { default: "Loading content..." },
+    striped: { type: Boolean, default: !1 },
+    spinning: { type: Boolean, default: !1 },
+    pagination: { default: null },
+    wrapperClass: { default: "" },
+    defaultSort: { default: null }
+  },
+  emits: ["table:sortBy", "pagination:change", "pagination:perPage"],
+  setup(f, { emit: s }) {
+    const d = f, p = s, o = _(d.defaultSort), r = (e) => d.headers.find((l) => l.key === e), m = (e) => {
+      e.key && (!o.value || o.value.key !== e.key ? o.value = {
+        key: e.key,
+        direction: "asc"
+      } : o.value.direction === "asc" ? o.value = {
+        key: e.key,
+        direction: "desc"
+      } : o.value = null, p("table:sortBy", o.value));
+    };
+    return (e, l) => (a(), n("div", null, [
+      c("div", {
+        class: b(["rvc-table-wrapper", e.wrapperClass])
+      }, [
+        c("table", {
+          class: b([{ "rvc-table-striped": e.striped }, "rvc-table"])
+        }, [
+          e.headers.length ? (a(), n("thead", ge, [
+            u(e.$slots, "headers", { headers: e.headers }, () => [
+              c("tr", null, [
+                (a(!0), n(k, null, w(e.headers, (t, i) => u(e.$slots, "header", {
+                  header: t,
+                  index: i
+                }, () => {
+                  var v, V;
+                  return [
+                    (a(), n("th", y({ ref_for: !0 }, { ...t, id: String(t.id) }, {
+                      key: `rvc-table-header-${t.id}`,
+                      class: {
+                        "rvc-table-text-left": t.align === "left" || !t.align,
+                        "rvc-table-text-center": t.align === "center",
+                        "rvc-table-text-right": t.align === "right"
+                      }
+                    }), [
+                      t.sortable && t.key ? (a(), n("button", {
+                        key: 0,
+                        type: "button",
+                        "aria-label": `Sort on ${t.label}`,
+                        class: b([
+                          "rvc-table-sort-button",
+                          {
+                            "rvc-table-sort-button-center": t.align === "center",
+                            "rvc-table-sort-button-right": t.align === "right"
+                          }
+                        ]),
+                        onClick: (T) => m(t)
+                      }, [
+                        u(e.$slots, "header-label", {
+                          sortBy: o.value,
+                          header: t
+                        }, () => [
+                          M(g(t.label), 1)
+                        ]),
+                        L(h(ae), {
+                          class: b([
+                            "rvc-table-sort-icon",
+                            {
+                              "rvc-table-sort-icon-visible": ((v = o.value) == null ? void 0 : v.key) === t.key,
+                              "rvc-table-sort-icon-invisible": !o.value || o.value.key !== t.key,
+                              "rvc-table-sort-icon-rotated": ((V = o.value) == null ? void 0 : V.key) === t.key && o.value.direction === "desc"
+                            }
+                          ])
+                        }, null, 8, ["class"])
+                      ], 10, me)) : u(e.$slots, "header-label", {
+                        key: 1,
+                        sortBy: o.value,
+                        header: t
+                      }, () => [
+                        M(g(t.label), 1)
+                      ])
+                    ], 16))
+                  ];
+                })), 256))
+              ])
+            ])
+          ])) : $("", !0),
+          c("tbody", null, [
+            e.items.length && !e.spinning ? (a(!0), n(k, { key: 0 }, w(e.items, (t, i) => u(e.$slots, "items", {
+              item: t,
+              index: i
+            }, () => [
+              (a(), n("tr", {
+                key: `rvc-table-row-${i}-${t.id}`
+              }, [
+                u(e.$slots, "item", {
+                  item: t,
+                  index: i
+                }, () => [
+                  (a(!0), n(k, null, w(t, (v, V) => {
+                    var T, A, F, j;
+                    return a(), n("td", y({
+                      key: `rvc-table-row-${i}-column-${V}-${t.id}`
+                    }, { ref_for: !0 }, t.attrs, {
+                      class: {
+                        "rvc-table-text-left": ((T = r(String(V))) == null ? void 0 : T.align) === "left" || !((A = r(String(V))) != null && A.align),
+                        "rvc-table-text-center": ((F = r(String(V))) == null ? void 0 : F.align) === "center",
+                        "rvc-table-text-right": ((j = r(String(V))) == null ? void 0 : j.align) === "right"
+                      },
+                      innerHTML: v
+                    }), null, 16, be);
+                  }), 128))
+                ])
+              ]))
+            ])), 256)) : !e.items.length && !e.spinning ? (a(), n("tr", ye, [
+              c("td", {
+                colspan: e.headers.length,
+                class: "rvc-table-state"
+              }, [
+                c("p", null, g(e.noResultsText), 1)
+              ], 8, $e)
+            ])) : (a(), n("tr", he, [
+              c("td", {
+                colspan: e.headers.length,
+                class: "rvc-table-state"
+              }, [
+                u(e.$slots, "spinner", {
+                  spinning: e.spinning,
+                  label: e.loadingText
+                }, () => [
+                  c("div", Ve, [
+                    e.spinning ? (a(), B(h(q), {
+                      key: 0,
+                      "aria-hidden": "true",
+                      class: "rvc-table-spinner"
+                    })) : $("", !0),
+                    M(" " + g(e.loadingText), 1)
+                  ])
+                ])
+              ], 8, ke)
+            ]))
+          ]),
+          e.$slots.footer ? (a(), n("tfoot", we, [
+            u(e.$slots, "footer", {
+              headers: e.headers,
+              items: e.items
+            })
+          ])) : $("", !0)
+        ], 2)
+      ], 2),
+      e.pagination ? u(e.$slots, "pagination", H(y({ key: 0 }, e.pagination)), () => [
+        L(fe, {
+          pagination: e.pagination,
+          "onPagination:change": l[0] || (l[0] = (t) => p("pagination:change", t)),
+          "onPagination:perPage": l[1] || (l[1] = (t) => p("pagination:perPage", t))
+        }, null, 8, ["pagination"])
+      ]) : $("", !0)
+    ]));
+  }
+}), Ce = {
+  key: 1,
+  class: "rvc-empty-state-title"
+}, ze = /* @__PURE__ */ C({
+  __name: "EmptyState",
+  props: {
+    title: {},
+    background: { type: Boolean },
+    icon: { type: [Function, Object, null] }
+  },
+  setup(f) {
+    return (s, d) => (a(), n("div", {
+      class: b(["rvc-empty-state", { "rvc-empty-state-bg": s.background }])
+    }, [
+      s.icon ? (a(), B(P(s.icon), {
+        key: 0,
+        class: "rvc-empty-state-icon"
+      })) : $("", !0),
+      s.title ? (a(), n("p", Ce, g(s.title), 1)) : $("", !0),
+      u(s.$slots, "default")
+    ], 2));
+  }
+}), Ee = /* @__PURE__ */ C({
+  __name: "FormTextarea",
+  props: {
+    modelValue: { default: void 0 },
+    size: { default: "base" }
+  },
+  emits: ["update:modelValue"],
+  setup(f, { emit: s }) {
+    const d = f, p = s, { hasModelBinding: o } = N(), r = _(null), m = S({
+      get: () => d.modelValue,
+      set: (l) => p("update:modelValue", l)
+    }), e = S(() => [
+      "rvc-textarea",
+      `rvc-textarea-${d.size}`
+    ]);
+    return (l, t) => h(o) ? O((a(), n("textarea", {
+      key: 0,
+      ref_key: "textarea",
+      ref: r,
+      "onUpdate:modelValue": t[0] || (t[0] = (i) => m.value = i),
+      class: b(e.value)
+    }, null, 2)), [
+      [Z, m.value]
+    ]) : (a(), n("textarea", {
+      key: 1,
+      ref_key: "textarea",
+      ref: r,
+      class: b(e.value)
+    }, null, 2));
+  }
+}), Be = { class: "rvc-radio" }, Se = { class: "rvc-radio-label" }, He = /* @__PURE__ */ C({
+  inheritAttrs: !1,
+  __name: "Radio",
+  props: {
+    modelValue: { type: [Boolean, String, Array, Object, Number, null], default: null },
+    label: { default: "" }
+  },
+  emits: ["update:modelValue"],
+  setup(f, { emit: s }) {
+    const d = f, p = s, o = S({
+      get: () => d.modelValue,
+      set: (t) => p("update:modelValue", t)
+    }), { hasModelBinding: r } = N(), m = z(), e = S(() => ({
+      ...m,
+      type: "radio"
+    })), l = _(null);
+    return (t, i) => (a(), n("label", Be, [
+      h(r) ? O((a(), n("input", y({ key: 0 }, e.value, {
+        ref_key: "input",
+        ref: l,
+        "onUpdate:modelValue": i[0] || (i[0] = (v) => o.value = v)
+      }), null, 16)), [
+        [E, o.value]
+      ]) : (a(), n("input", y({ key: 1 }, e.value, {
+        ref_key: "input",
+        ref: l
+      }), null, 16)),
+      u(t.$slots, "input", {}, () => [
+        i[1] || (i[1] = c("span", { class: "rvc-radio-input" }, null, -1))
+      ]),
+      u(t.$slots, "default", {}, () => [
+        c("span", Se, g(t.label), 1)
+      ])
+    ]));
+  }
+}), Le = { class: "rvc-tabs-nav" }, Pe = ["value", "selected"], De = /* @__PURE__ */ C({
+  inheritAttrs: !1,
+  __name: "Tabs",
+  props: {
+    modelValue: { default: void 0 },
+    tabs: { default: () => [] },
+    tabStyle: { default: "default" }
+  },
+  emits: ["update:modelValue", "tabs:change"],
+  setup(f, { emit: s }) {
+    const d = f, p = s, o = () => {
+      const l = d.tabs.findIndex((t) => t.active);
+      return l >= 0 ? l : 0;
+    }, r = S({
+      get: () => d.modelValue ?? o(),
+      set: (l) => {
+        const t = d.tabs[l];
+        p("update:modelValue", l), t && p("tabs:change", t);
+      }
+    }), m = (l) => {
+      const i = +l.target.value;
+      r.value = i;
+      const v = d.tabs[i];
+      v != null && v.selectEvent && v.selectEvent();
+    }, e = (l) => {
+      const {
+        active: t,
+        as: i,
+        bindAs: v,
+        selectEvent: V,
+        name: T,
+        ...A
+      } = l;
+      return A;
+    };
+    return (l, t) => (a(), n(k, null, [
+      c("div", y(l.$attrs, {
+        class: ["rvc-tabs", { "rvc-tabs-buttons": l.tabStyle === "buttons" }]
+      }), [
+        c("nav", Le, [
+          (a(!0), n(k, null, w(l.tabs, (i, v) => (a(), B(P(i.as ? i.as : "button"), y({ ref_for: !0 }, e(i), {
+            key: `${v}-tab-item`,
+            as: i.bindAs ? i.bindAs : void 0,
+            class: ["rvc-tab", { "rvc-tab-active": r.value === v }],
+            onClick: (V) => r.value = v
+          }), {
+            default: I(() => [
+              M(g(i.name), 1)
+            ]),
+            _: 2
+          }, 1040, ["as", "class", "onClick"]))), 128))
+        ])
+      ], 16),
+      L(D, y(l.$attrs, {
+        "root-class": "rvc-tabs-select",
+        value: r.value,
+        onChange: m
+      }), {
+        default: I(() => [
+          (a(!0), n(k, null, w(l.tabs, (i, v) => (a(), n("option", {
+            key: `${v}-tab-item-select-option`,
+            value: v,
+            selected: r.value === v
+          }, g(i.name), 9, Pe))), 128))
+        ]),
+        _: 1
+      }, 16, ["value"])
+    ], 64));
+  }
+});
+export {
+  Oe as _,
+  Ne as a,
+  Fe as b,
+  je as c,
+  ze as d,
+  D as e,
+  Ee as f,
+  fe as g,
+  He as h,
+  De as i
+};