@robuust-digital/vue-components 2.5.0-beta.4 → 2.5.0

package/dist/_shared/{RichTextEditor.vue_vue_type_script_setup_true_lang-DaCv0Gii.js → RichTextEditor.vue_vue_type_script_setup_true_lang-t14vKtCW.js}

@@ -1,18 +1,18 @@
-import { openBlock as o, createElementBlock as r, createElementVNode as s, defineComponent as L, ref as p, useAttrs as $, computed as x, watch as B, Fragment as C, createVNode as v, withCtx as A, renderSlot as _, normalizeClass as M, unref as f, renderList as y, createBlock as E, resolveDynamicComponent as S, createCommentVNode as U } from "vue";
-import { useEditor as N, EditorContent as O } from "@tiptap/vue-3";
-import T from "@tiptap/starter-kit";
+import { openBlock as s, createElementBlock as r, createElementVNode as o, defineComponent as $, ref as h, useAttrs as B, computed as x, watch as y, Fragment as C, createVNode as v, withCtx as A, renderSlot as _, normalizeClass as M, unref as f, renderList as E, createBlock as S, resolveDynamicComponent as O, createCommentVNode as U } from "vue";
+import { useEditor as N, EditorContent as T } from "@tiptap/vue-3";
+import j from "@tiptap/starter-kit";
 import { _ as z } from "./Tooltip.vue_vue_type_script_setup_true_lang-B3MHy48T.js";
 import { _ as D } from "./FormInput.vue_vue_type_script_setup_true_lang-Bg7YPGyY.js";
-import { _ as I } from "./Modal.vue_vue_type_script_setup_true_lang-CB0Gez7v.js";
+import { _ as I } from "./Modal.vue_vue_type_script_setup_true_lang-MN3D46CX.js";
 function q(n, c) {
-  return o(), r("svg", {
+  return s(), r("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 16 16",
     fill: "currentColor",
     "aria-hidden": "true",
     "data-slot": "icon"
   }, [
-    s("path", {
+    o("path", {
       "fill-rule": "evenodd",
       d: "M3 3a1 1 0 0 1 1-1h5a3.5 3.5 0 0 1 2.843 5.541A3.75 3.75 0 0 1 9.25 14H4a1 1 0 0 1-1-1V3Zm2.5 3.5v-2H9a1 1 0 0 1 0 2H5.5Zm0 2.5v2.5h3.75a1.25 1.25 0 1 0 0-2.5H5.5Z",
       "clip-rule": "evenodd"
@@ -20,14 +20,14 @@ function q(n, c) {
   ]);
 }
 function F(n, c) {
-  return o(), r("svg", {
+  return s(), r("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 16 16",
     fill: "currentColor",
     "aria-hidden": "true",
     "data-slot": "icon"
   }, [
-    s("path", {
+    o("path", {
       "fill-rule": "evenodd",
       d: "M6.25 2.75A.75.75 0 0 1 7 2h6a.75.75 0 0 1 0 1.5h-2.483l-3.429 9H9A.75.75 0 0 1 9 14H3a.75.75 0 0 1 0-1.5h2.483l3.429-9H7a.75.75 0 0 1-.75-.75Z",
       "clip-rule": "evenodd"
@@ -35,19 +35,19 @@ function F(n, c) {
   ]);
 }
 function K(n, c) {
-  return o(), r("svg", {
+  return s(), r("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 16 16",
     fill: "currentColor",
     "aria-hidden": "true",
     "data-slot": "icon"
   }, [
-    s("path", {
+    o("path", {
       "fill-rule": "evenodd",
       d: "M8.914 6.025a.75.75 0 0 1 1.06 0 3.5 3.5 0 0 1 0 4.95l-2 2a3.5 3.5 0 0 1-5.396-4.402.75.75 0 0 1 1.251.827 2 2 0 0 0 3.085 2.514l2-2a2 2 0 0 0 0-2.828.75.75 0 0 1 0-1.06Z",
       "clip-rule": "evenodd"
     }),
-    s("path", {
+    o("path", {
       "fill-rule": "evenodd",
       d: "M7.086 9.975a.75.75 0 0 1-1.06 0 3.5 3.5 0 0 1 0-4.95l2-2a3.5 3.5 0 0 1 5.396 4.402.75.75 0 0 1-1.251-.827 2 2 0 0 0-3.085-2.514l-2 2a2 2 0 0 0 0 2.828.75.75 0 0 1 0 1.06Z",
       "clip-rule": "evenodd"
@@ -55,28 +55,28 @@ function K(n, c) {
   ]);
 }
 function P(n, c) {
-  return o(), r("svg", {
+  return s(), r("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 16 16",
     fill: "currentColor",
     "aria-hidden": "true",
     "data-slot": "icon"
   }, [
-    s("path", { d: "M3 4.75a1 1 0 1 0 0-2 1 1 0 0 0 0 2ZM6.25 3a.75.75 0 0 0 0 1.5h7a.75.75 0 0 0 0-1.5h-7ZM6.25 7.25a.75.75 0 0 0 0 1.5h7a.75.75 0 0 0 0-1.5h-7ZM6.25 11.5a.75.75 0 0 0 0 1.5h7a.75.75 0 0 0 0-1.5h-7ZM4 12.25a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM3 9a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z" })
+    o("path", { d: "M3 4.75a1 1 0 1 0 0-2 1 1 0 0 0 0 2ZM6.25 3a.75.75 0 0 0 0 1.5h7a.75.75 0 0 0 0-1.5h-7ZM6.25 7.25a.75.75 0 0 0 0 1.5h7a.75.75 0 0 0 0-1.5h-7ZM6.25 11.5a.75.75 0 0 0 0 1.5h7a.75.75 0 0 0 0-1.5h-7ZM4 12.25a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM3 9a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z" })
   ]);
 }
 function R(n, c) {
-  return o(), r("svg", {
+  return s(), r("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 16 16",
     fill: "currentColor",
     "aria-hidden": "true",
     "data-slot": "icon"
   }, [
-    s("path", { d: "M2.995 1a.625.625 0 1 0 0 1.25h.38v2.125a.625.625 0 1 0 1.25 0v-2.75A.625.625 0 0 0 4 1H2.995ZM3.208 7.385a2.37 2.37 0 0 1 1.027-.124L2.573 8.923a.625.625 0 0 0 .439 1.067l1.987.011a.625.625 0 0 0 .006-1.25l-.49-.003.777-.776c.215-.215.335-.506.335-.809 0-.465-.297-.957-.842-1.078a3.636 3.636 0 0 0-1.993.121.625.625 0 1 0 .416 1.179ZM2.625 11a.625.625 0 1 0 0 1.25H4.25a.125.125 0 0 1 0 .25H3.5a.625.625 0 1 0 0 1.25h.75a.125.125 0 0 1 0 .25H2.625a.625.625 0 1 0 0 1.25H4.25a1.375 1.375 0 0 0 1.153-2.125A1.375 1.375 0 0 0 4.25 11H2.625ZM7.25 2a.75.75 0 0 0 0 1.5h6a.75.75 0 0 0 0-1.5h-6ZM7.25 7.25a.75.75 0 0 0 0 1.5h6a.75.75 0 0 0 0-1.5h-6ZM6.5 13.25a.75.75 0 0 1 .75-.75h6a.75.75 0 0 1 0 1.5h-6a.75.75 0 0 1-.75-.75Z" })
+    o("path", { d: "M2.995 1a.625.625 0 1 0 0 1.25h.38v2.125a.625.625 0 1 0 1.25 0v-2.75A.625.625 0 0 0 4 1H2.995ZM3.208 7.385a2.37 2.37 0 0 1 1.027-.124L2.573 8.923a.625.625 0 0 0 .439 1.067l1.987.011a.625.625 0 0 0 .006-1.25l-.49-.003.777-.776c.215-.215.335-.506.335-.809 0-.465-.297-.957-.842-1.078a3.636 3.636 0 0 0-1.993.121.625.625 0 1 0 .416 1.179ZM2.625 11a.625.625 0 1 0 0 1.25H4.25a.125.125 0 0 1 0 .25H3.5a.625.625 0 1 0 0 1.25h.75a.125.125 0 0 1 0 .25H2.625a.625.625 0 1 0 0 1.25H4.25a1.375 1.375 0 0 0 1.153-2.125A1.375 1.375 0 0 0 4.25 11H2.625ZM7.25 2a.75.75 0 0 0 0 1.5h6a.75.75 0 0 0 0-1.5h-6ZM7.25 7.25a.75.75 0 0 0 0 1.5h6a.75.75 0 0 0 0-1.5h-6ZM6.5 13.25a.75.75 0 0 1 .75-.75h6a.75.75 0 0 1 0 1.5h-6a.75.75 0 0 1-.75-.75Z" })
   ]);
 }
-const j = { class: "rvc-rich-text-toolbar" }, G = ["disabled", "aria-label", "onClick"], te = /* @__PURE__ */ L({
+const G = { class: "rvc-rich-text-toolbar" }, J = ["disabled", "aria-label", "onClick"], le = /* @__PURE__ */ $({
   inheritAttrs: !1,
   __name: "RichTextEditor",
   props: {
@@ -90,16 +90,20 @@ const j = { class: "rvc-rich-text-toolbar" }, G = ["disabled", "aria-label", "on
   },
   emits: ["update:modelValue", "tiptap:onCreate"],
   setup(n, { emit: c }) {
-    const a = n, b = c, w = p(!1), u = p(!1), d = p(""), m = $(), k = m.class ? `${m.class} ` : "", V = T.configure({
+    const a = n, b = c, g = h(!1), u = h(!1), d = h(""), m = B(), k = m.class ? `${m.class} ` : "", V = Object.fromEntries(
+      Object.entries(m).filter(
+        (l) => l[0] !== "class" && typeof l[1] == "string"
+      )
+    ), Z = j.configure({
       link: {
         openOnClick: !1
       }
     }), e = N({
-      extensions: [V, ...a.customExtensions],
+      extensions: [Z, ...a.customExtensions],
       content: a.modelValue,
       editorProps: {
         attributes: {
-          ...m,
+          ...V,
           id: a.id,
           class: `${k}rvc-textarea rvc-rich-text-textarea`
         }
@@ -112,9 +116,9 @@ const j = { class: "rvc-rich-text-toolbar" }, G = ["disabled", "aria-label", "on
         b("update:modelValue", i);
       },
       onSelectionUpdate({ editor: l }) {
-        w.value = !l.view.state.selection.empty;
+        g.value = !l.view.state.selection.empty;
       }
-    }), Z = x(() => [
+    }), H = x(() => [
       {
         name: "bold",
         icon: q,
@@ -152,40 +156,40 @@ const j = { class: "rvc-rich-text-toolbar" }, G = ["disabled", "aria-label", "on
         icon: K,
         title: "Hyperlink",
         isVisible: a.config === "default",
-        disabled: !w.value && !(e.value?.isActive("link") ?? !1),
+        disabled: !g.value && !(e.value?.isActive("link") ?? !1),
         isActive: () => e.value?.isActive("link") ?? !1,
         action: () => {
           d.value = e.value?.getAttributes("link").href || "", u.value = !0;
         }
       }
-    ]), g = x(() => {
-      const l = Z.value.filter((t) => a.config === "default" || ["bold", "italic"].includes(t.name)), i = a.customCommands.map((t) => {
-        let h = !1;
-        return typeof t.disabled == "function" ? h = e.value ? t.disabled(e.value) : !1 : h = t.disabled ?? !1, {
+    ]), w = x(() => {
+      const l = H.value.filter((t) => a.config === "default" || ["bold", "italic"].includes(t.name)), i = a.customCommands.map((t) => {
+        let p = !1;
+        return typeof t.disabled == "function" ? p = e.value ? t.disabled(e.value) : !1 : p = t.disabled ?? !1, {
           ...t,
           isVisible: t.isVisible ?? !0,
-          disabled: h,
+          disabled: p,
           isActive: () => t.isActive && e.value ? t.isActive(e.value) : !1,
           action: () => e.value && t.action(e.value)
         };
       });
       return [...l, ...i];
     });
-    B(() => a.modelValue, (l) => {
+    y(() => a.modelValue, (l) => {
       if (!e.value) return;
       e.value.getHTML() === l || e.value.commands.setContent(l, { emitUpdate: !1 });
     });
-    const H = () => {
+    const L = () => {
       e.value && (e.value.commands.setLink({ href: d.value }), u.value = !1, d.value = "");
     };
-    return (l, i) => (o(), r(C, null, [
+    return (l, i) => (s(), r(C, null, [
       v(I, {
         id: `${a.id}-modal-add-hyperlink`,
         title: "Add Hyperlink",
         as: "form",
         show: u.value,
         "onModal:close": i[1] || (i[1] = (t) => u.value = !1),
-        "onModal:save": H
+        "onModal:save": L
       }, {
         default: A(() => [
           v(D, {
@@ -199,16 +203,16 @@ const j = { class: "rvc-rich-text-toolbar" }, G = ["disabled", "aria-label", "on
         _: 1
       }, 8, ["id", "show"]),
       _(l.$slots, "default"),
-      s("div", {
+      o("div", {
         class: M(["rvc-rich-text", n.rootClass, { "rvc-rich-text-disabled": n.disabled }])
       }, [
         f(e) ? _(l.$slots, "toolbar", {
           key: 0,
-          commands: g.value,
+          commands: w.value,
           tiptap: f(e)
         }, () => [
-          s("ul", j, [
-            (o(!0), r(C, null, y(g.value.filter((t) => t.isVisible), (t) => (o(), r("li", {
+          o("ul", G, [
+            (s(!0), r(C, null, E(w.value.filter((t) => t.isVisible), (t) => (s(), r("li", {
               key: `toolbar-item-command-${t.name}`
             }, [
               v(z, {
@@ -218,26 +222,26 @@ const j = { class: "rvc-rich-text-toolbar" }, G = ["disabled", "aria-label", "on
                 class: "rvc-rich-text-tooltip"
               }, {
                 default: A(() => [
-                  s("button", {
+                  o("button", {
                     disabled: t.disabled,
                     type: "button",
                     "aria-label": t.title,
                     class: M([{ "rvc-rich-text-button-active": t.isActive() }, "rvc-rich-text-button"]),
                     onClick: t.action
                   }, [
-                    (o(), E(S(t.icon)))
-                  ], 10, G)
+                    (s(), S(O(t.icon)))
+                  ], 10, J)
                 ]),
                 _: 2
               }, 1032, ["content"])
             ]))), 128))
           ])
         ]) : U("", !0),
-        v(f(O), { editor: f(e) }, null, 8, ["editor"])
+        v(f(T), { editor: f(e) }, null, 8, ["editor"])
       ], 2)
     ], 64));
   }
 });
 export {
-  te as _
+  le as _
 };

package/dist/core/badge.css

@@ -5,6 +5,9 @@
   --rvc-badge-padding-y: calc(var(--spacing) * 1.5);
   --rvc-badge-font-weight: var(--font-weight-medium);
   --rvc-badge-border-radius: calc(infinity * 1px);
+  --rvc-badge-border-width: 0;
+  --rvc-badge-border-style: solid;
+  --rvc-badge-border-color: transparent;
   --rvc-badge-font-size: var(--text-base);
   --rvc-badge-gap: calc(var(--spacing) * 1);
 
@@ -61,6 +64,7 @@
     height: var(--rvc-badge-height);
     padding-block: var(--rvc-badge-padding-y);
     padding-inline: var(--rvc-badge-padding-x);
+    border: var(--rvc-badge-border-width) var(--rvc-badge-border-style) var(--rvc-badge-border-color);
     border-radius: var(--rvc-badge-border-radius);
     background-color: var(--rvc-badge-bg-color);
     color: var(--rvc-badge-color);

package/dist/core/empty-state.css

@@ -1,5 +1,8 @@
 :root {
   --rvc-empty-state-border-radius: var(--rvc-base-border-radius);
+  --rvc-empty-state-border-width: 0;
+  --rvc-empty-state-border-style: solid;
+  --rvc-empty-state-border-color: transparent;
   --rvc-empty-state-color: var(--color-slate-700);
   --rvc-empty-state-bg-color: var(--color-slate-50);
   --rvc-empty-state-padding-x: calc(var(--spacing) * 12);
@@ -15,6 +18,7 @@
 
 @layer components {
   .rvc-empty-state {
+    border: var(--rvc-empty-state-border-width) var(--rvc-empty-state-border-style) var(--rvc-empty-state-border-color);
     color: var(--rvc-empty-state-color);
     font-size: var(--rvc-empty-state-font-size);
 

package/dist/core/pagination.css

@@ -9,10 +9,14 @@
   --rvc-pagination-color: var(--color-slate-600);
   --rvc-pagination-color-active: var(--color-slate-800);
   --rvc-pagination-bg-color: transparent;
+  --rvc-pagination-bg-color-active: var(--rvc-pagination-bg-color);
   --rvc-pagination-bg-color-hover: var(--color-slate-100);
   --rvc-pagination-border-color: transparent;
+  --rvc-pagination-nav-gap-md: calc(var(--spacing) * 0.5);
+  --rvc-pagination-nav-gap-xl: calc(var(--spacing) * 1);
   --rvc-pagination-info-color: var(--color-slate-400);
   --rvc-pagination-info-font-size: var(--text-sm);
+  --rvc-pagination-icon-color: var(--color-slate-800);
 }
 
 @layer components {
@@ -46,11 +50,12 @@
       text-align: center;
 
       &.rvc-pagination-button-active {
+        background-color: var(--rvc-pagination-bg-color-active);
         color: var(--rvc-pagination-color-active);
         font-weight: var(--rvc-pagination-font-weight-active);
       }
 
-      &:not([disabled]):hover {
+      &:not(.rvc-pagination-button-active, [disabled]):hover {
         background-color: var(--rvc-pagination-bg-color-hover);
       }
     }
@@ -72,11 +77,11 @@
       justify-content: flex-end;
 
       @media (width >= theme(--breakpoint-md)) {
-        gap: calc(var(--spacing) * 0.5);
+        gap: var(--rvc-pagination-nav-gap-md);
       }
 
       @media (width >= theme(--breakpoint-xl)) {
-        gap: calc(var(--spacing) * 1);
+        gap: var(--rvc-pagination-nav-gap-xl);
       }
     }
 
@@ -99,7 +104,7 @@
     .rvc-pagination-button-icon {
       width: calc(var(--spacing) * 5);
       height: calc(var(--spacing) * 5);
-      color: var(--color-slate-800);
+      color: var(--rvc-pagination-icon-color);
 
       &.rvc-pagination-button-icon-disabled {
         opacity: 0.5;

package/dist/core/table.css

@@ -16,6 +16,9 @@
   --rvc-table-white-space: nowrap;
   --rvc-table-line-height: 1.1;
   --rvc-table-spinner-size: calc(var(--spacing) * 5);
+  --rvc-table-striped-cell-border-color: transparent;
+  --rvc-table-striped-cell-border-style: solid;
+  --rvc-table-striped-cell-border-width: 0;
 }
 
 @layer components {
@@ -40,6 +43,11 @@
 
       td {
         padding-inline: var(--rvc-table-padding-x);
+        border-bottom: var(--rvc-table-striped-cell-border-width) var(--rvc-table-striped-cell-border-style) var(--rvc-table-striped-cell-border-color);
+      }
+
+      tr:hover td {
+        background-color: var(--rvc-table-striped-row-bg-color-hover);
       }
     }
 

package/dist/core/tabs.css

@@ -16,6 +16,10 @@
   --rvc-tabs-tab-active-border-color: var(--color-indigo-600);
   --rvc-tabs-tab-button-height: calc(var(--spacing) * 9);
   --rvc-tabs-tab-button-padding-x: calc(var(--spacing) * 3);
+  --rvc-tabs-tab-button-border-width: 0;
+  --rvc-tabs-tab-button-border-style: solid;
+  --rvc-tabs-tab-button-border-color: transparent;
+  --rvc-tabs-tab-button-border-color-active: var(--rvc-tabs-tab-button-border-color);
   --rvc-tabs-tab-active-button-bg-color: var(--color-indigo-100);
 }
 
@@ -43,10 +47,12 @@
         height: var(--rvc-tabs-tab-button-height);
         padding-bottom: 0;
         padding-inline: var(--rvc-tabs-tab-button-padding-x);
+        border: var(--rvc-tabs-tab-button-border-width) var(--rvc-tabs-tab-button-border-style) var(--rvc-tabs-tab-button-border-color);
         border-bottom: 0;
         border-radius: var(--rvc-tabs-tab-button-border-radius);
 
         &.rvc-tab-active {
+          border-color: var(--rvc-tabs-tab-button-border-color-active);
           background-color: var(--rvc-tabs-tab-active-button-bg-color);
         }
       }

package/dist/dialogs/index.js

@@ -1,5 +1,5 @@
-import { _ as a } from "../_shared/Drawer.vue_vue_type_script_setup_true_lang-CZMVooMV.js";
-import { _ as f } from "../_shared/Modal.vue_vue_type_script_setup_true_lang-CB0Gez7v.js";
+import { _ as a } from "../_shared/Drawer.vue_vue_type_script_setup_true_lang-DjP68vua.js";
+import { _ as f } from "../_shared/Modal.vue_vue_type_script_setup_true_lang-MN3D46CX.js";
 export {
   a as Drawer,
   f as Modal

package/dist/dialogs.d.ts

@@ -16,13 +16,13 @@ declare const __VLS_component: DefineComponent<DrawerProps, {}, {}, {}, {}, Comp
 "drawer:open": () => any;
 "drawer:opened": () => any;
 "drawer:close": () => any;
-"drawer:save": (event: Event) => any;
+"drawer:save": (event?: Event | undefined) => any;
 "drawer:closed": () => any;
 }, string, PublicProps, Readonly<DrawerProps> & Readonly<{
 "onDrawer:open"?: (() => any) | undefined;
 "onDrawer:opened"?: (() => any) | undefined;
 "onDrawer:close"?: (() => any) | undefined;
-"onDrawer:save"?: ((event: Event) => any) | undefined;
+"onDrawer:save"?: ((event?: Event | undefined) => any) | undefined;
 "onDrawer:closed"?: (() => any) | undefined;
 }>, {
 as: string;
@@ -67,6 +67,42 @@ contentRef: HTMLDivElement;
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: {
+        panel?(_: {
+            title: string;
+            loading: boolean;
+            isForm: boolean;
+            titleId: string;
+            descriptionId: string;
+            contentRef: HTMLElement | null;
+            dialogTitle: DefineComponent<    {
+            as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+            };
+            id: {
+            type: StringConstructor;
+            default: null;
+            };
+            }, () => VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+            }> | VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+            }>[] | null, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Record<string, any>, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<    {
+            as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+            };
+            id: {
+            type: StringConstructor;
+            default: null;
+            };
+            }>>, {
+            id: string;
+            as: string | Record<string, any>;
+            }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+            emitClose: () => void;
+            emitSave: (event?: undefined) => void;
+        }): any;
         header?(_: {
             title: string;
             showClose: boolean;
@@ -123,8 +159,45 @@ declare function __VLS_template(): {
 declare function __VLS_template_2(): {
     attrs: Partial<{}>;
     slots: {
+        panel?(_: {
+            title: string;
+            loading: boolean;
+            isForm: boolean;
+            titleId: string;
+            descriptionId: string;
+            contentRef: HTMLElement | null;
+            dialogTitle: DefineComponent<    {
+            as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+            };
+            id: {
+            type: StringConstructor;
+            default: null;
+            };
+            }, () => VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+            }> | VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+            }>[] | null, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Record<string, any>, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<    {
+            as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+            };
+            id: {
+            type: StringConstructor;
+            default: null;
+            };
+            }>>, {
+            id: string;
+            as: string | Record<string, any>;
+            }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+            emitClose: () => void;
+            emitSave: (event?: undefined) => void;
+        }): any;
         header?(_: {
             title: string;
+            showClose: boolean;
         }): any;
         header?(_: {}): any;
         title?(_: {

package/dist/index/index.js

@@ -3,11 +3,11 @@ import { _ as d } from "../_shared/ChevronDownIcon-BYWciGnh.js";
 import { _ as n } from "../_shared/ButtonBase.vue_vue_type_script_setup_true_lang-ZYVNEyNx.js";
 import { _ as h } from "../_shared/FormInput.vue_vue_type_script_setup_true_lang-Bg7YPGyY.js";
 import { _ as g } from "../_shared/Combobox.vue_vue_type_script_setup_true_lang-BwTRzqr6.js";
-import { _ as B } from "../_shared/Drawer.vue_vue_type_script_setup_true_lang-CZMVooMV.js";
-import { _ as F } from "../_shared/Modal.vue_vue_type_script_setup_true_lang-CB0Gez7v.js";
+import { _ as B } from "../_shared/Drawer.vue_vue_type_script_setup_true_lang-DjP68vua.js";
+import { _ as F } from "../_shared/Modal.vue_vue_type_script_setup_true_lang-MN3D46CX.js";
 import { _ as A } from "../_shared/Dropdown.vue_vue_type_script_setup_true_lang-L_lQEUBC.js";
 import { _ as E } from "../_shared/Lightswitch.vue_vue_type_script_setup_true_lang-hiuDVfo5.js";
-import { _ as S } from "../_shared/RichTextEditor.vue_vue_type_script_setup_true_lang-DaCv0Gii.js";
+import { _ as S } from "../_shared/RichTextEditor.vue_vue_type_script_setup_true_lang-t14vKtCW.js";
 import { _ as y } from "../_shared/Toast.vue_vue_type_script_setup_true_lang-DS6keeu7.js";
 import { _ as L } from "../_shared/Tooltip.vue_vue_type_script_setup_true_lang-B3MHy48T.js";
 export {

package/dist/index.d.ts

@@ -89,13 +89,13 @@ declare const __VLS_component_13: DefineComponent<DrawerProps, {}, {}, {}, {}, C
 "drawer:open": () => any;
 "drawer:opened": () => any;
 "drawer:close": () => any;
-"drawer:save": (event: Event) => any;
+"drawer:save": (event?: Event | undefined) => any;
 "drawer:closed": () => any;
 }, string, PublicProps, Readonly<DrawerProps> & Readonly<{
 "onDrawer:open"?: (() => any) | undefined;
 "onDrawer:opened"?: (() => any) | undefined;
 "onDrawer:close"?: (() => any) | undefined;
-"onDrawer:save"?: ((event: Event) => any) | undefined;
+"onDrawer:save"?: ((event?: Event | undefined) => any) | undefined;
 "onDrawer:closed"?: (() => any) | undefined;
 }>, {
 as: string;
@@ -399,6 +399,42 @@ declare function __VLS_template_12(): {
 declare function __VLS_template_13(): {
     attrs: Partial<{}>;
     slots: {
+        panel?(_: {
+            title: string;
+            loading: boolean;
+            isForm: boolean;
+            titleId: string;
+            descriptionId: string;
+            contentRef: HTMLElement | null;
+            dialogTitle: DefineComponent<    {
+            as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+            };
+            id: {
+            type: StringConstructor;
+            default: null;
+            };
+            }, () => VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+            }> | VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+            }>[] | null, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Record<string, any>, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<    {
+            as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+            };
+            id: {
+            type: StringConstructor;
+            default: null;
+            };
+            }>>, {
+            id: string;
+            as: string | Record<string, any>;
+            }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+            emitClose: () => void;
+            emitSave: (event?: undefined) => void;
+        }): any;
         header?(_: {
             title: string;
             showClose: boolean;
@@ -455,8 +491,45 @@ declare function __VLS_template_13(): {
 declare function __VLS_template_14(): {
     attrs: Partial<{}>;
     slots: {
+        panel?(_: {
+            title: string;
+            loading: boolean;
+            isForm: boolean;
+            titleId: string;
+            descriptionId: string;
+            contentRef: HTMLElement | null;
+            dialogTitle: DefineComponent<    {
+            as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+            };
+            id: {
+            type: StringConstructor;
+            default: null;
+            };
+            }, () => VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+            }> | VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+            }>[] | null, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Record<string, any>, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<    {
+            as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+            };
+            id: {
+            type: StringConstructor;
+            default: null;
+            };
+            }>>, {
+            id: string;
+            as: string | Record<string, any>;
+            }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+            emitClose: () => void;
+            emitSave: (event?: undefined) => void;
+        }): any;
         header?(_: {
             title: string;
+            showClose: boolean;
         }): any;
         header?(_: {}): any;
         title?(_: {

package/dist/rich-text-editor/index.js

@@ -1,4 +1,4 @@
-import { _ as t } from "../_shared/RichTextEditor.vue_vue_type_script_setup_true_lang-DaCv0Gii.js";
+import { _ as t } from "../_shared/RichTextEditor.vue_vue_type_script_setup_true_lang-t14vKtCW.js";
 export {
   t as RichTextEditor,
   t as default

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@robuust-digital/vue-components",
-  "version": "2.5.0-beta.4",
+  "version": "2.5.0",
   "type": "module",
   "publishConfig": {
     "access": "public"