@citruslime/ui 2.0.0-beta.22 → 2.0.0-beta.23

package/dist/citrus-lime-ui.es.js

@@ -36,8 +36,8 @@ import { generateStringId } from "@citruslime/utils";
 import { createI18n, useI18n } from "vue-i18n";
 import Flatpickr from "flatpickr";
 import { useDebouncer, copy } from "@citruslime/vue-utils";
-const _hoisted_1$u = { class: "cl-overflow-hidden" };
-const _sfc_main$v = /* @__PURE__ */ defineComponent({
+const _hoisted_1$w = { class: "cl-overflow-hidden" };
+const _sfc_main$y = /* @__PURE__ */ defineComponent({
   props: {
     exclusive: { type: Boolean, default: false }
   },
@@ -69,17 +69,17 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
       }
     }
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$u, [
+      return openBlock(), createElementBlock("div", _hoisted_1$w, [
         renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({ isItemOpen, toggleItem })))
       ]);
     };
   }
 });
-const _hoisted_1$t = { class: "cl-absolute cl-left-5 cl-top-5" };
+const _hoisted_1$v = { class: "cl-absolute cl-left-5 cl-top-5" };
 const _hoisted_2$n = { class: "cl-font-semibold cl-ml-10 cl-p-4 cl-select-none cl-text-grey-5" };
 const _hoisted_3$h = { class: "cl-overflow-hidden" };
 const _hoisted_4$d = { class: "cl-ml-10 cl-p-4" };
-const _sfc_main$u = /* @__PURE__ */ defineComponent({
+const _sfc_main$x = /* @__PURE__ */ defineComponent({
   props: {
     open: { type: Boolean },
     disabled: { type: Boolean, default: false }
@@ -104,7 +104,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
           }]),
           onClick: toggle
         }, [
-          createElementVNode("div", _hoisted_1$t, [
+          createElementVNode("div", _hoisted_1$v, [
             createVNode(_component_icon, {
               class: normalizeClass(["cl-duration-300 cl-ease-in-out cl-text-grey-3 cl-transform-gpu cl-transition-transform", {
                 "cl-rotate-180": __props.open
@@ -140,14 +140,14 @@ var _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const _sfc_main$t = {};
-const _hoisted_1$s = { class: "cl-border-b cl-border-grey-1 cl-font-semibold cl-pl-14 cl-pr-4 cl-py-2 cl-text-grey-3 cl-text-sm" };
-function _sfc_render$5(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1$s, [
+const _sfc_main$w = {};
+const _hoisted_1$u = { class: "cl-border-b cl-border-grey-1 cl-font-semibold cl-pl-14 cl-pr-4 cl-py-2 cl-text-grey-3 cl-text-sm" };
+function _sfc_render$6(_ctx, _cache) {
+  return openBlock(), createElementBlock("div", _hoisted_1$u, [
     renderSlot(_ctx.$slots, "default")
   ]);
 }
-var clUiAccordionHeader = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["render", _sfc_render$5]]);
+var clUiAccordionHeader = /* @__PURE__ */ _export_sfc(_sfc_main$w, [["render", _sfc_render$6]]);
 const notifications = ref([]);
 function showNotification(notification) {
   const newNotification = __spreadValues({
@@ -159,12 +159,12 @@ function showNotification(notification) {
 function removeNotification(notification) {
   notifications.value = notifications.value.filter((n) => n.id !== notification.id);
 }
-const _hoisted_1$r = ["onClick"];
+const _hoisted_1$t = ["onClick"];
 const _hoisted_2$m = { class: "cl-flex-1 cl-select-none cl-text-ellipsis cl-w-64" };
 const __default__$4 = {
   inheritAttrs: false
 };
-const _sfc_main$s = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, __default__$4), {
+const _sfc_main$v = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, __default__$4), {
   props: {
     container: { default: "body" },
     position: { default: "top-right" }
@@ -202,23 +202,23 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues
                 size: 16,
                 weight: "bold"
               })
-            ], 16, _hoisted_1$r);
+            ], 16, _hoisted_1$t);
           }), 128))
         ], 2)
       ], 8, ["to"]);
     };
   }
 }));
-const _hoisted_1$q = { class: "cl-absolute cl-flex cl-flex-wrap cl-h-screen cl-max-h-screen cl-max-w-full cl-min-h-screen cl-min-w-full cl-w-full" };
-const _sfc_main$r = /* @__PURE__ */ defineComponent({
+const _hoisted_1$s = { class: "cl-absolute cl-flex cl-flex-wrap cl-h-screen cl-max-h-screen cl-max-w-full cl-min-h-screen cl-min-w-full cl-w-full" };
+const _sfc_main$u = /* @__PURE__ */ defineComponent({
   props: {
     removePadding: { type: Boolean, default: false }
   },
   setup(__props) {
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(Fragment, null, [
-        createVNode(_sfc_main$s),
-        createElementVNode("div", _hoisted_1$q, [
+        createVNode(_sfc_main$v),
+        createElementVNode("div", _hoisted_1$s, [
           renderSlot(_ctx.$slots, "header"),
           createElementVNode("div", {
             class: normalizeClass(["cl-content-start cl-flex cl-flex-nowrap cl-items-stretch cl-max-h-screen cl-relative cl-w-full", {
@@ -240,17 +240,17 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
   }
 });
 var clUiLoadingSpinner_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _sfc_main$q = {};
-const _hoisted_1$p = { class: "loading-spinner" };
-function _sfc_render$4(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1$p);
+const _sfc_main$t = {};
+const _hoisted_1$r = { class: "loading-spinner" };
+function _sfc_render$5(_ctx, _cache) {
+  return openBlock(), createElementBlock("div", _hoisted_1$r);
 }
-var ClUiLoadingSpinner = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$4], ["__scopeId", "data-v-60d7cfd0"]]);
-const _hoisted_1$o = ["disabled"];
+var ClUiLoadingSpinner = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["render", _sfc_render$5], ["__scopeId", "data-v-60d7cfd0"]]);
+const _hoisted_1$q = ["disabled"];
 const __default__$3 = {
   inheritAttrs: false
 };
-const _sfc_main$p = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, __default__$3), {
+const _sfc_main$s = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, __default__$3), {
   props: {
     colour: { default: "default" },
     size: { default: "medium" },
@@ -278,7 +278,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues
           disabled: __props.disabled
         }), [
           renderSlot(_ctx.$slots, "default")
-        ], 16, _hoisted_1$o), [
+        ], 16, _hoisted_1$q), [
           [vShow, !__props.loading]
         ])
       ], 64);
@@ -297,8 +297,8 @@ const buttonSizes = [
   "medium",
   "large"
 ];
-const _hoisted_1$n = { key: 0 };
-const _sfc_main$o = /* @__PURE__ */ defineComponent({
+const _hoisted_1$p = { key: 0 };
+const _sfc_main$r = /* @__PURE__ */ defineComponent({
   props: {
     size: { default: "medium" },
     hover: { type: Boolean, default: false }
@@ -310,7 +310,7 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
           "cl-cursor-pointer hover:cl-shadow-xl hover:cl-border-grey-0": __props.hover
         }])
       }, [
-        _ctx.$slots.image ? (openBlock(), createElementBlock("div", _hoisted_1$n, [
+        _ctx.$slots.image ? (openBlock(), createElementBlock("div", _hoisted_1$p, [
           renderSlot(_ctx.$slots, "image")
         ])) : createCommentVNode("", true),
         _ctx.$slots.title ? (openBlock(), createElementBlock("div", {
@@ -554,7 +554,7 @@ function validateMinValue(minimumValue, typeOfValue, valueName, actualValue) {
       valid: false,
       message: ""
     };
-    if (minimumValue) {
+    if (minimumValue !== null && minimumValue !== void 0) {
       let isValid;
       let timeValue;
       switch (typeOfValue) {
@@ -604,7 +604,7 @@ function validateMaxValue(maximumValue, typeOfValue, valueName, actualValue) {
       valid: false,
       message: ""
     };
-    if (maximumValue) {
+    if (maximumValue !== null && maximumValue !== void 0) {
       let isValid;
       let timeValue;
       switch (typeOfValue) {
@@ -1155,9 +1155,9 @@ function getFormattedTimeForMinMax(date) {
 }
 var clUiCalendar_vue_vue_type_style_index_0_lang = "";
 var clUiCalendar_vue_vue_type_style_index_1_scoped_true_lang = "";
-const _hoisted_1$m = ["placeholder", "disabled"];
+const _hoisted_1$o = ["placeholder", "disabled"];
 const _hoisted_2$l = { class: "cl-absolute cl-bg-white cl-flex cl-right-2 cl-text-grey-4 cl-top-3.5" };
-const _sfc_main$n = /* @__PURE__ */ defineComponent({
+const _sfc_main$q = /* @__PURE__ */ defineComponent({
   props: {
     date: { default: null },
     datePlaceholder: { default: "Select date." },
@@ -1343,7 +1343,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
           type: "text",
           placeholder: unref(placeholder),
           disabled: __props.disabled
-        }), null, 16, _hoisted_1$m),
+        }), null, 16, _hoisted_1$o),
         withDirectives(createVNode(_component_icon, {
           class: normalizeClass(["cl-absolute cl-bg-white cl-right-2 cl-text-grey-4 cl-top-3.5", {
             "!cl-bg-off-white": __props.disabled
@@ -1384,14 +1384,14 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var clUiCalendar = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["__scopeId", "data-v-533d446d"]]);
+var clUiCalendar = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-533d446d"]]);
 const calendarTypes = [
   "date",
   "datetime",
   "time"
 ];
 var clUiSlider_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1$l = { class: "cl-flex cl-flex-wrap cl-items-center" };
+const _hoisted_1$n = { class: "cl-flex cl-flex-wrap cl-items-center" };
 const _hoisted_2$k = { class: "cl-flex cl-flex-1 cl-flex-wrap cl-items-center cl-mb-2 cl-mt-3 cl-relative md:cl-mt-0" };
 const _hoisted_3$g = { class: "cl-absolute cl-bg-grey-0 cl-leading-6 cl-ml-0 cl-px-3 cl-rounded-full cl-text-center cl-text-xs cl-top-full" };
 const _hoisted_4$c = {
@@ -1404,7 +1404,7 @@ const _hoisted_7$7 = {
   key: 1,
   class: "emphasis-danger text-sm w-full"
 };
-const _sfc_main$m = /* @__PURE__ */ defineComponent({
+const _sfc_main$p = /* @__PURE__ */ defineComponent({
   props: {
     value: null,
     min: null,
@@ -1459,7 +1459,7 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
         withDirectives(createElementVNode("div", { class: "cl-bg-transparent cl-relative cl-text-center cl-text-sm" }, toDisplayString(unref(currentValue)), 513), [
           [vShow, !__props.showNumericInput]
         ]),
-        createElementVNode("div", _hoisted_1$l, [
+        createElementVNode("div", _hoisted_1$n, [
           withDirectives(createVNode(_component_cl_ui_input, {
             modelValue: numericInputValue.value,
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => numericInputValue.value = $event),
@@ -1503,7 +1503,7 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var clUiSlider = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["__scopeId", "data-v-26895858"]]);
+var clUiSlider = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__scopeId", "data-v-26895858"]]);
 function isInputText(type) {
   let isText = false;
   switch (type) {
@@ -1555,7 +1555,7 @@ function getInputTypeAsCalendarType(type) {
   return calendarType;
 }
 var clUiInput_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1$k = { class: "cl-align-top cl-border-none cl-inline-block cl-text-left" };
+const _hoisted_1$m = { class: "cl-align-top cl-border-none cl-inline-block cl-text-left" };
 const _hoisted_2$j = { class: "cl-flex cl-justify-between" };
 const _hoisted_3$f = { class: "cl-w-full" };
 const _hoisted_4$b = {
@@ -1580,7 +1580,7 @@ const _hoisted_10$5 = {
   key: 1,
   class: "cl-bg-danger-light cl-px-2 cl-rounded-md cl-text-center cl-text-danger-default cl-text-xs cl-w-auto cl-whitespace-pre-line"
 };
-const _sfc_main$l = /* @__PURE__ */ defineComponent({
+const _sfc_main$o = /* @__PURE__ */ defineComponent({
   props: {
     inputType: { default: "text" },
     modelValue: { type: [String, Number, Boolean, Date, null], default: void 0 },
@@ -1771,7 +1771,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
     watch(() => props.externalErrors, () => updateAndValidateValue(currentValue.value));
     return (_ctx, _cache) => {
       const _component_icon = resolveComponent("icon");
-      return openBlock(), createElementBlock("div", _hoisted_1$k, [
+      return openBlock(), createElementBlock("div", _hoisted_1$m, [
         createElementVNode("div", {
           onMouseenter: _cache[10] || (_cache[10] = ($event) => toggleFocus(true)),
           onMouseleave: _cache[11] || (_cache[11] = ($event) => toggleFocus(false))
@@ -1893,14 +1893,14 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var ClUiInput = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-007f3e50"]]);
-const _hoisted_1$j = { class: "cl-align-items-center cl-bg-black cl-bg-opacity-40 cl-bottom-0 cl-fixed cl-flex cl-h-screen cl-justify-center cl-left-0 cl-right-0 cl-top-0 cl-w-full cl-z-40" };
+var ClUiInput = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["__scopeId", "data-v-007f3e50"]]);
+const _hoisted_1$l = { class: "cl-align-items-center cl-bg-black cl-bg-opacity-40 cl-bottom-0 cl-fixed cl-flex cl-h-screen cl-justify-center cl-left-0 cl-right-0 cl-top-0 cl-w-full cl-z-40" };
 const _hoisted_2$i = ["onKeypress"];
 const _hoisted_3$e = { class: "cl-overflow-y-auto cl-p-2 cl-w-full" };
 const __default__$2 = {
   inheritAttrs: false
 };
-const _sfc_main$k = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, __default__$2), {
+const _sfc_main$n = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, __default__$2), {
   props: {
     headerColour: { default: "white" },
     preventClose: { type: Boolean, default: false },
@@ -1931,7 +1931,7 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues
         (openBlock(), createBlock(Teleport, { to: "body" }, [
           createVNode(Transition, { name: "fade" }, {
             default: withCtx(() => [
-              withDirectives(createElementVNode("div", _hoisted_1$j, [
+              withDirectives(createElementVNode("div", _hoisted_1$l, [
                 createElementVNode("div", mergeProps(_ctx.$attrs, {
                   class: ["cl-bg-white cl-flex cl-flex-wrap cl-mx-0 cl-my-auto cl-overflow-y-auto cl-relative cl-rounded-lg cl-shadow-lg", {
                     "lg:cl-w-2/12 cl-w-10/12": __props.size === "x-small",
@@ -1978,12 +1978,12 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues
     };
   }
 }));
-const _hoisted_1$i = { class: "cl-bg-grey-2 cl-border-b cl-border-grey-2 cl-border-t cl-flex cl-p-1" };
+const _hoisted_1$k = { class: "cl-bg-grey-2 cl-border-b cl-border-grey-2 cl-border-t cl-flex cl-p-1" };
 const _hoisted_2$h = {
   key: 0,
   class: "cl-w-1/2"
 };
-const _sfc_main$j = /* @__PURE__ */ defineComponent({
+const _sfc_main$m = /* @__PURE__ */ defineComponent({
   props: {
     showClearButton: { type: Boolean, default: false },
     text: { default: "" },
@@ -1995,7 +1995,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
   setup(__props) {
     return (_ctx, _cache) => {
       const _component_icon = resolveComponent("icon");
-      return openBlock(), createElementBlock("div", _hoisted_1$i, [
+      return openBlock(), createElementBlock("div", _hoisted_1$k, [
         __props.additionalText !== "" ? (openBlock(), createElementBlock("div", _hoisted_2$h, toDisplayString(__props.additionalText), 1)) : createCommentVNode("", true),
         createElementVNode("div", {
           class: normalizeClass({
@@ -2018,12 +2018,12 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$h = {
+const _hoisted_1$j = {
   key: 0,
   class: "cl-w-1/2"
 };
 const _hoisted_2$g = { class: "cl-float-right cl-py-1.5" };
-const _sfc_main$i = /* @__PURE__ */ defineComponent({
+const _sfc_main$l = /* @__PURE__ */ defineComponent({
   props: {
     isCreateNewOption: { type: Boolean, default: false },
     selectedIndex: { default: -1 },
@@ -2085,7 +2085,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
         onMousemove: _cache[0] || (_cache[0] = ($event) => onHover(true)),
         onMouseleave: _cache[1] || (_cache[1] = ($event) => onHover(false))
       }, [
-        __props.option !== null && ((_a = __props.option) == null ? void 0 : _a.parentId) !== 0 && ((_b = __props.option) == null ? void 0 : _b.parentId) !== void 0 ? (openBlock(), createElementBlock("div", _hoisted_1$h, toDisplayString(unref(displayedParent)), 1)) : createCommentVNode("", true),
+        __props.option !== null && ((_a = __props.option) == null ? void 0 : _a.parentId) !== 0 && ((_b = __props.option) == null ? void 0 : _b.parentId) !== void 0 ? (openBlock(), createElementBlock("div", _hoisted_1$j, toDisplayString(unref(displayedParent)), 1)) : createCommentVNode("", true),
         createElementVNode("div", {
           class: normalizeClass({
             "cl-w-1/2": unref(displayedParent) !== "",
@@ -2104,10 +2104,10 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$g = ["onKeyup"];
+const _hoisted_1$i = ["onKeyup"];
 const _hoisted_2$f = { class: "cl-flex" };
 const _hoisted_3$d = { key: 5 };
-const _sfc_main$h = /* @__PURE__ */ defineComponent({
+const _sfc_main$k = /* @__PURE__ */ defineComponent({
   props: {
     loading: { type: Boolean, default: false },
     objectType: null,
@@ -2256,27 +2256,27 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
             [vShow, __props.loading]
           ])
         ]),
-        __props.currentObjectName !== "" ? (openBlock(), createBlock(_sfc_main$j, {
+        __props.currentObjectName !== "" ? (openBlock(), createBlock(_sfc_main$m, {
           key: 0,
           "show-clear-button": __props.canClearSelectedObject,
           text: __props.currentObjectName,
           onClearObject: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("clear-object"))
         }, null, 8, ["show-clear-button", "text"])) : createCommentVNode("", true),
-        __props.objectParentType !== "" && __props.results !== void 0 && __props.results.length > 0 && __props.errorMessage === "" ? (openBlock(), createBlock(_sfc_main$j, {
+        __props.objectParentType !== "" && __props.results !== void 0 && __props.results.length > 0 && __props.errorMessage === "" ? (openBlock(), createBlock(_sfc_main$m, {
           key: 1,
           text: __props.objectType,
           "additional-text": __props.objectParentType
         }, null, 8, ["text", "additional-text"])) : createCommentVNode("", true),
-        __props.results !== null && ((_a = __props.results) == null ? void 0 : _a.length) === 0 && searchText.value.trim() !== "" && __props.canCreateNewObject === false && __props.errorMessage === "" ? (openBlock(), createBlock(_sfc_main$j, {
+        __props.results !== null && ((_a = __props.results) == null ? void 0 : _a.length) === 0 && searchText.value.trim() !== "" && __props.canCreateNewObject === false && __props.errorMessage === "" ? (openBlock(), createBlock(_sfc_main$m, {
           key: 2,
           text: unref(t2)("comboBox.noResults", { value: searchText.value })
         }, null, 8, ["text"])) : createCommentVNode("", true),
-        __props.errorMessage !== "" ? (openBlock(), createBlock(_sfc_main$j, {
+        __props.errorMessage !== "" ? (openBlock(), createBlock(_sfc_main$m, {
           key: 3,
           class: "!cl-bg-danger-light cl-border-danger-light cl-rounded cl-text-danger-dark",
           text: unref(t2)("comboBox.errorMessage", { error: __props.errorMessage })
         }, null, 8, ["text"])) : createCommentVNode("", true),
-        showAddNewOption.value ? (openBlock(), createBlock(_sfc_main$i, {
+        showAddNewOption.value ? (openBlock(), createBlock(_sfc_main$l, {
           key: 4,
           "is-create-new-option": true,
           text: unref(t2)("comboBox.addPrompt", { value: searchText.value, object: __props.objectType }),
@@ -2287,7 +2287,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
         }, null, 8, ["text", "selected-index"])) : createCommentVNode("", true),
         __props.errorMessage === "" && __props.results !== null ? (openBlock(), createElementBlock("div", _hoisted_3$d, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(__props.results, (result, index) => {
-            return openBlock(), createBlock(_sfc_main$i, {
+            return openBlock(), createBlock(_sfc_main$l, {
               key: index,
               option: result,
               index,
@@ -2297,16 +2297,16 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
             }, null, 8, ["option", "index", "selected-index"]);
           }), 128))
         ])) : createCommentVNode("", true)
-      ], 40, _hoisted_1$g);
+      ], 40, _hoisted_1$i);
     };
   }
 });
-const _hoisted_1$f = { class: "cl-flex" };
+const _hoisted_1$h = { class: "cl-flex" };
 const _hoisted_2$e = { class: "cl-relative cl-right-20 cl-top-0.5" };
 const _hoisted_3$c = { class: "cl-absolute cl-flex cl-float-right cl-font-semibold cl-mt-2 cl-text-danger-default cl-text-sm" };
 const _hoisted_4$a = { class: "cl-ml-4 cl-w-11/12" };
 const _hoisted_5$7 = { class: "cl-p-2 cl-text-right cl-w-full" };
-const _sfc_main$g = /* @__PURE__ */ defineComponent({
+const _sfc_main$j = /* @__PURE__ */ defineComponent({
   props: {
     loading: { type: Boolean, default: false },
     disabled: { type: Boolean, default: false },
@@ -2465,7 +2465,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
       const _component_icon = resolveComponent("icon");
       const _component_cl_ui_combo_box = resolveComponent("cl-ui-combo-box", true);
       return openBlock(), createElementBlock("div", null, [
-        createElementVNode("div", _hoisted_1$f, [
+        createElementVNode("div", _hoisted_1$h, [
           createVNode(ClUiInput, {
             modelValue: unref(currentText),
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(currentText) ? currentText.value = $event : null),
@@ -2503,12 +2503,12 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
             })
           ], 2)
         ]),
-        createVNode(_sfc_main$k, { size: "x-small" }, {
+        createVNode(_sfc_main$n, { size: "x-small" }, {
           title: withCtx(() => [
             createTextVNode(toDisplayString(unref(t2)("comboBox.createTitle", { object: __props.objectType })), 1)
           ]),
           trigger: withCtx(({ open }) => [
-            withDirectives(createVNode(_sfc_main$h, {
+            withDirectives(createVNode(_sfc_main$k, {
               "can-create-new-object": __props.canCreateNewObject,
               "can-clear-selected-object": __props.canClearSelectedObject,
               loading: __props.loading,
@@ -2529,7 +2529,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
           ]),
           footer: withCtx(({ close }) => [
             createElementVNode("div", _hoisted_5$7, [
-              createVNode(_sfc_main$p, {
+              createVNode(_sfc_main$s, {
                 class: "cl-mr-4",
                 colour: "primary",
                 size: "small",
@@ -2544,7 +2544,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
                 ]),
                 _: 2
               }, 1032, ["disabled", "onClick"]),
-              createVNode(_sfc_main$p, {
+              createVNode(_sfc_main$s, {
                 colour: "danger",
                 size: "small",
                 onClick: close
@@ -2594,8 +2594,8 @@ function isComboBoxItem(objectToTest) {
 function isComboBoxCreateRequest(objectToTest) {
   return typeof objectToTest.name === "string";
 }
-const _sfc_main$f = {};
-const _hoisted_1$e = { class: "cl-flex cl-flex-wrap cl-left-0 cl-mt-4 cl-w-full" };
+const _sfc_main$i = {};
+const _hoisted_1$g = { class: "cl-flex cl-flex-wrap cl-left-0 cl-mt-4 cl-w-full" };
 const _hoisted_2$d = {
   key: 0,
   class: "cl-w-full"
@@ -2606,8 +2606,8 @@ const _hoisted_3$b = {
 };
 const _hoisted_4$9 = { class: "cl-float-left" };
 const _hoisted_5$6 = { class: "cl-float-right" };
-function _sfc_render$3(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1$e, [
+function _sfc_render$4(_ctx, _cache) {
+  return openBlock(), createElementBlock("div", _hoisted_1$g, [
     _ctx.$slots.default ? (openBlock(), createElementBlock("div", _hoisted_2$d, [
       renderSlot(_ctx.$slots, "default")
     ])) : createCommentVNode("", true),
@@ -2621,8 +2621,8 @@ function _sfc_render$3(_ctx, _cache) {
     ])) : createCommentVNode("", true)
   ]);
 }
-var clUiFooter = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["render", _sfc_render$3]]);
-const _hoisted_1$d = { class: "cl-mr-2 lg:cl-hidden" };
+var clUiFooter = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["render", _sfc_render$4]]);
+const _hoisted_1$f = { class: "cl-mr-2 lg:cl-hidden" };
 const _hoisted_2$c = { class: "cl-mr-2 lg:cl-hidden" };
 const _hoisted_3$a = {
   key: 0,
@@ -2635,7 +2635,7 @@ const _hoisted_4$8 = {
 const __default__$1 = {
   inheritAttrs: false
 };
-const _sfc_main$e = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, __default__$1), {
+const _sfc_main$h = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, __default__$1), {
   props: {
     column: null,
     record: null,
@@ -2686,7 +2686,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues
           "cl-bg-link-lighter": unref(edited)
         }]
       }), [
-        createElementVNode("strong", _hoisted_1$d, toDisplayString(__props.column.caption), 1),
+        createElementVNode("strong", _hoisted_1$f, toDisplayString(__props.column.caption), 1),
         renderSlot(_ctx.$slots, `${__props.column.name}Edit`, normalizeProps(guardReactiveProps({
           cellFocused,
           column: __props.column,
@@ -2893,7 +2893,7 @@ const filterMethods = [
     ]
   }
 ];
-const _hoisted_1$c = {
+const _hoisted_1$e = {
   key: 0,
   class: "cl-border-grey-2 cl-border-r cl-capitalize cl-group cl-inline cl-relative cl-w-auto"
 };
@@ -2911,7 +2911,7 @@ const _hoisted_12$3 = {
   key: 1,
   class: "cl-flex cl-w-full"
 };
-const _sfc_main$d = /* @__PURE__ */ defineComponent({
+const _sfc_main$g = /* @__PURE__ */ defineComponent({
   props: {
     request: null,
     column: null,
@@ -3038,7 +3038,7 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
           "cl-border": __props.column.type !== "slot" || __props.column.slotType !== void 0 && __props.column.field !== void 0
         }])
       }, [
-        __props.column.type !== "slot" || __props.column.slotType !== void 0 && __props.column.field !== void 0 ? (openBlock(), createElementBlock("div", _hoisted_1$c, [
+        __props.column.type !== "slot" || __props.column.slotType !== void 0 && __props.column.field !== void 0 ? (openBlock(), createElementBlock("div", _hoisted_1$e, [
           createElementVNode("div", _hoisted_2$b, [
             createVNode(_component_icon, {
               icon: "ph:sliders-horizontal",
@@ -3119,7 +3119,7 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$b = {
+const _hoisted_1$d = {
   key: 0,
   class: "cl-flex cl-flex-wrap cl-justify-end cl-mt-4 cl-w-full"
 };
@@ -3138,7 +3138,7 @@ const _hoisted_13$1 = ["onClick"];
 const _hoisted_14$1 = { class: "cl-mb-2 cl-w-full lg:cl-p-2 md:cl-mb-0 md:cl-w-auto" };
 const _hoisted_15$1 = { class: "cl-block cl-mb-2 cl-text-grey-3 cl-w-full lg:cl-inline-block lg:cl-mb-0 lg:cl-mr-1 lg:cl-w-auto" };
 const _hoisted_16$1 = { class: "cl-block lg:cl-inline-block" };
-const _sfc_main$c = /* @__PURE__ */ defineComponent({
+const _sfc_main$f = /* @__PURE__ */ defineComponent({
   props: {
     request: null,
     data: { default: null }
@@ -3194,7 +3194,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       var _a;
       const _component_icon = resolveComponent("icon");
-      return __props.data && ((_a = __props.data.results) == null ? void 0 : _a.length) && __props.request ? (openBlock(), createElementBlock("div", _hoisted_1$b, [
+      return __props.data && ((_a = __props.data.results) == null ? void 0 : _a.length) && __props.request ? (openBlock(), createElementBlock("div", _hoisted_1$d, [
         createElementVNode("div", _hoisted_2$a, [
           createElementVNode("span", _hoisted_3$8, toDisplayString(unref(t2)("grid.jumpToPage")), 1),
           createVNode(ClUiInput, {
@@ -3294,7 +3294,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$a = { class: "cl-fixed cl-flex cl-h-full cl-justify-end cl-right-0 cl-shadow-lg cl-top-0 cl-z-50" };
+const _hoisted_1$c = { class: "cl-fixed cl-flex cl-h-full cl-justify-end cl-right-0 cl-shadow-lg cl-top-0 cl-z-50" };
 const _hoisted_2$9 = { class: "cl-bg-secondary-default cl-h-full cl-overflow-y-auto cl-px-10 cl-py-20 cl-relative cl-text-grey-2 cl-w-80" };
 const _hoisted_3$7 = { class: "cl-mb-4 cl-text-2xl cl-text-off-white" };
 const _hoisted_4$5 = { class: "cl-border-grey-3 cl-border-t cl-flex cl-flex-wrap cl-text-sm cl-w-full" };
@@ -3309,7 +3309,7 @@ const _hoisted_12$1 = { key: 1 };
 const __default__ = {
   inheritAttrs: false
 };
-const _sfc_main$b = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, __default__), {
+const _sfc_main$e = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, __default__), {
   props: {
     columns: null
   },
@@ -3344,7 +3344,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues
     return (_ctx, _cache) => {
       const _component_icon = resolveComponent("icon");
       return openBlock(), createElementBlock(Fragment, null, [
-        createVNode(_sfc_main$p, mergeProps(_ctx.$attrs, {
+        createVNode(_sfc_main$s, mergeProps(_ctx.$attrs, {
           class: "cl-w-full",
           size: "small",
           onClick: _cache[0] || (_cache[0] = withModifiers(($event) => visible.value = true, ["prevent"]))
@@ -3357,7 +3357,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues
         (openBlock(), createBlock(Teleport, { to: "body" }, [
           createVNode(Transition, { name: "slide-left" }, {
             default: withCtx(() => [
-              withDirectives(createElementVNode("div", _hoisted_1$a, [
+              withDirectives(createElementVNode("div", _hoisted_1$c, [
                 createElementVNode("div", _hoisted_2$9, [
                   createVNode(_component_icon, {
                     class: "cl-absolute cl-cursor-pointer cl-right-3 cl-text-off-white cl-top-3",
@@ -3416,14 +3416,14 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues
     };
   }
 }));
-const _hoisted_1$9 = {
+const _hoisted_1$b = {
   key: 0,
   class: "cl-pb-2 cl-pr-2 cl-w-1/2 lg:cl-pb-0 lg:cl-w-auto"
 };
 const _hoisted_2$8 = { class: "cl-hidden cl-pr-2 lg:cl-inline-block" };
 const _hoisted_3$6 = { class: "cl-pb-2 cl-pr-2 cl-w-1/2 lg:cl-pb-0 lg:cl-pr-0 lg:cl-w-auto" };
 const _hoisted_4$4 = { class: "cl-pr-2 cl-w-full lg:cl-hidden md:cl-w-1/2" };
-const _sfc_main$a = /* @__PURE__ */ defineComponent({
+const _sfc_main$d = /* @__PURE__ */ defineComponent({
   props: {
     columns: null,
     editMode: { type: Boolean },
@@ -3445,8 +3445,8 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(Fragment, null, [
-        __props.editEnabled ? (openBlock(), createElementBlock("span", _hoisted_1$9, [
-          createVNode(_sfc_main$p, {
+        __props.editEnabled ? (openBlock(), createElementBlock("span", _hoisted_1$b, [
+          createVNode(_sfc_main$s, {
             class: "cl-w-full lg:cl-w-auto",
             size: "small",
             colour: "default",
@@ -3463,13 +3463,13 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
           })
         ])) : createCommentVNode("", true),
         createElementVNode("span", _hoisted_2$8, [
-          createVNode(_sfc_main$b, {
+          createVNode(_sfc_main$e, {
             columns: unref(currentColumns),
             "onUpdate:columns": _cache[1] || (_cache[1] = ($event) => isRef(currentColumns) ? currentColumns.value = $event : null)
           }, null, 8, ["columns"])
         ]),
         createElementVNode("span", _hoisted_3$6, [
-          createVNode(_sfc_main$p, {
+          createVNode(_sfc_main$s, {
             class: "cl-w-full lg:cl-w-auto",
             size: "small",
             onClick: _cache[2] || (_cache[2] = withModifiers(($event) => _ctx.$emit("reset-filters"), ["prevent"]))
@@ -3481,7 +3481,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
           })
         ]),
         createElementVNode("span", _hoisted_4$4, [
-          createVNode(_sfc_main$p, {
+          createVNode(_sfc_main$s, {
             class: "cl-w-full",
             colour: "blue",
             size: "small",
@@ -3498,7 +3498,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
   }
 });
 var clUiGrid_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1$8 = { class: "cl-hidden cl-mb-4 cl-w-full lg:cl-block lg:cl-text-right" };
+const _hoisted_1$a = { class: "cl-hidden cl-mb-4 cl-w-full lg:cl-block lg:cl-text-right" };
 const _hoisted_2$7 = ["data-loading"];
 const _hoisted_3$5 = { class: "cl-absolute cl-bg-white cl-h-full cl-opacity-40 cl-w-full cl-z-20" };
 const _hoisted_4$3 = { class: "cl-bg-white cl-flex cl-flex-wrap cl-sticky cl-top-0 cl-w-full lg:cl-hidden" };
@@ -3526,7 +3526,7 @@ const _hoisted_22 = {
   key: 0,
   class: "cl-w-full"
 };
-const _sfc_main$9 = /* @__PURE__ */ defineComponent({
+const _sfc_main$c = /* @__PURE__ */ defineComponent({
   props: {
     columns: null,
     request: null,
@@ -3642,8 +3642,8 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
       var _a, _b;
       const _component_icon = resolveComponent("icon");
       return openBlock(), createElementBlock(Fragment, null, [
-        createElementVNode("div", _hoisted_1$8, [
-          createVNode(_sfc_main$a, {
+        createElementVNode("div", _hoisted_1$a, [
+          createVNode(_sfc_main$d, {
             columns: unref(currentColumns),
             "onUpdate:columns": _cache[0] || (_cache[0] = ($event) => isRef(currentColumns) ? currentColumns.value = $event : null),
             "edit-mode": editMode.value,
@@ -3668,7 +3668,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
             createElementVNode("div", _hoisted_5$2, [
               createElementVNode("strong", _hoisted_6$2, toDisplayString(unref(t2)("grid.gridTools")), 1),
               createElementVNode("div", _hoisted_7$2, [
-                createVNode(_sfc_main$a, {
+                createVNode(_sfc_main$d, {
                   columns: unref(currentColumns),
                   "onUpdate:columns": _cache[2] || (_cache[2] = ($event) => isRef(currentColumns) ? currentColumns.value = $event : null),
                   "edit-mode": editMode.value,
@@ -3704,7 +3704,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
                       class: "cl-grid cl-grid-cols-3 cl-mb-4 cl-w-full"
                     }, [
                       createElementVNode("div", null, toDisplayString(column.caption), 1),
-                      createVNode(_sfc_main$d, {
+                      createVNode(_sfc_main$g, {
                         request: unref(currentRequest),
                         "onUpdate:request": _cache[6] || (_cache[6] = ($event) => isRef(currentRequest) ? currentRequest.value = $event : null),
                         column
@@ -3785,7 +3785,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
                       class: "cl-p-1",
                       style: normalizeStyle(getStyleForColumn(column.name))
                     }, [
-                      createVNode(_sfc_main$d, {
+                      createVNode(_sfc_main$g, {
                         request: unref(currentRequest),
                         "onUpdate:request": _cache[7] || (_cache[7] = ($event) => isRef(currentRequest) ? currentRequest.value = $event : null),
                         column,
@@ -3805,7 +3805,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
                     })
                   }, [
                     (openBlock(true), createElementBlock(Fragment, null, renderList(unref(visibleColumns), (column, columnIndex) => {
-                      return openBlock(), createBlock(_sfc_main$e, {
+                      return openBlock(), createBlock(_sfc_main$h, {
                         key: columnIndex,
                         class: "cl-align-top cl-p-2 cl-rounded cl-whitespace-nowrap",
                         style: normalizeStyle(getStyleForColumn(column.name)),
@@ -3838,7 +3838,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
                       createElementVNode("strong", null, toDisplayString(unref(t2)("grid.noData")), 1),
                       unref(currentRequest).filters.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_22, [
                         createTextVNode(toDisplayString(unref(t2)("grid.noDataFiltersPresent")) + " ", 1),
-                        createVNode(_sfc_main$p, {
+                        createVNode(_sfc_main$s, {
                           size: "small",
                           onClick: withModifiers(resetFilters, ["prevent"])
                         }, {
@@ -3854,7 +3854,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
               ])
             ])
           ]),
-          createVNode(_sfc_main$c, {
+          createVNode(_sfc_main$f, {
             request: unref(currentRequest),
             "onUpdate:request": _cache[8] || (_cache[8] = ($event) => isRef(currentRequest) ? currentRequest.value = $event : null),
             data: __props.data
@@ -3864,12 +3864,12 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var clUiGrid = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-7df0fada"]]);
-const _sfc_main$8 = {};
-const _hoisted_1$7 = { class: "cl-absolute cl-bg-secondary-default cl-flex cl-h-20 cl-items-center cl-justify-between cl-left-0 cl-top-0 cl-w-full cl-z-40" };
+var clUiGrid = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-7df0fada"]]);
+const _sfc_main$b = {};
+const _hoisted_1$9 = { class: "cl-absolute cl-bg-secondary-default cl-flex cl-h-20 cl-items-center cl-justify-between cl-left-0 cl-top-0 cl-w-full cl-z-40" };
 const _hoisted_2$6 = { class: "cl-flex cl-flex-nowrap" };
-function _sfc_render$2(_ctx, _cache) {
-  return openBlock(), createElementBlock("header", _hoisted_1$7, [
+function _sfc_render$3(_ctx, _cache) {
+  return openBlock(), createElementBlock("header", _hoisted_1$9, [
     renderSlot(_ctx.$slots, "logo"),
     createElementVNode("div", _hoisted_2$6, [
       renderSlot(_ctx.$slots, "menu"),
@@ -3877,8 +3877,8 @@ function _sfc_render$2(_ctx, _cache) {
     ])
   ]);
 }
-var clUiHeader = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["render", _sfc_render$2]]);
-const _hoisted_1$6 = { class: "md:cl-relative" };
+var clUiHeader = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["render", _sfc_render$3]]);
+const _hoisted_1$8 = { class: "md:cl-relative" };
 const _hoisted_2$5 = { class: "cl-bg-blue-light cl-flex cl-items-center cl-select-none md:cl-min-w-[320px]" };
 const _hoisted_3$4 = ["src"];
 const _hoisted_4$2 = { class: "cl-cursor-default cl-grow cl-hidden cl-my-4 cl-text-white md:cl-block" };
@@ -3891,7 +3891,7 @@ const _hoisted_6$1 = {
   class: "cl-cursor-default cl-text-ellipsis cl-text-xs cl-whitespace-nowrap"
 };
 const _hoisted_7$1 = { class: "cl-absolute cl-bg-white cl-right-0 cl-shadow-2xl cl-top-20 cl-w-full cl-z-20" };
-const _sfc_main$7 = /* @__PURE__ */ defineComponent({
+const _sfc_main$a = /* @__PURE__ */ defineComponent({
   props: {
     username: { default: "" },
     group: { default: "" },
@@ -3901,7 +3901,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     const isOpen = ref(false);
     return (_ctx, _cache) => {
       const _component_icon = resolveComponent("icon");
-      return openBlock(), createElementBlock("div", _hoisted_1$6, [
+      return openBlock(), createElementBlock("div", _hoisted_1$8, [
         createElementVNode("div", _hoisted_2$5, [
           __props.image ? (openBlock(), createElementBlock("img", {
             key: 0,
@@ -3983,14 +3983,14 @@ function isLanguageArray(arrayToTest) {
 function isLanguage(objectToTest) {
   return typeof objectToTest.name === "string" && typeof objectToTest.nativeName === "string" && typeof objectToTest.localeCode === "string";
 }
-const _hoisted_1$5 = {
+const _hoisted_1$7 = {
   key: 0,
   class: "cl-flex cl-relative cl-select-none cl-w-auto cl-z-30"
 };
 const _hoisted_2$4 = { class: "cl-absolute cl-bg-white cl-border cl-border-grey-0 cl-overflow-hidden cl-right-0 cl-rounded cl-shadow-xl cl-text-black cl-top-6 cl-z-3" };
 const _hoisted_3$3 = ["data-localename", "data-localecode", "onClick"];
 const _hoisted_4$1 = { class: "cl-text-xs" };
-const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+const _sfc_main$9 = /* @__PURE__ */ defineComponent({
   props: {
     supportedLanguages: null,
     disabled: { type: Boolean, default: false }
@@ -4015,7 +4015,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
       }
     });
     return (_ctx, _cache) => {
-      return unref(selectedLanguage) !== null && unref(isLanguageLocaleFormat)(unref(selectedLanguage)) ? (openBlock(), createElementBlock("div", _hoisted_1$5, [
+      return unref(selectedLanguage) !== null && unref(isLanguageLocaleFormat)(unref(selectedLanguage)) ? (openBlock(), createElementBlock("div", _hoisted_1$7, [
         createElementVNode("div", {
           class: normalizeClass(["cl-flex cl-items-center", {
             "cl-cursor-pointer": !__props.disabled
@@ -4055,7 +4055,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$4 = { class: "cl-relative" };
+const _hoisted_1$6 = { class: "cl-relative" };
 const _hoisted_2$3 = { class: "cl-h-screen cl-z-0" };
 const _hoisted_3$2 = { class: "cl-absolute cl-bg-secondary-default cl-gap-y-1 cl-grid cl-grid-cols-1 cl-left-0 cl-opacity-95 cl-p-6 cl-top-0 cl-w-full cl-z-10 lg:cl-gap-x-1 lg:cl-grid-cols-10 lg:cl-p-10" };
 const _hoisted_4 = { class: "cl-col-span-10 lg:cl-col-span-3" };
@@ -4068,7 +4068,7 @@ const _hoisted_7 = { class: "cl-inline cl-relative cl-text-grey-4" };
 const _hoisted_8 = { class: "cl-col-span-3" };
 const _hoisted_9 = { class: "cl-inline cl-relative cl-text-grey-4" };
 const _hoisted_10 = { class: "cl-col-span-10 cl-emphasis-danger cl-mt-10 cl-p-3 cl-rounded-md cl-text-sm md:cl-mt-3" };
-const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+const _sfc_main$8 = /* @__PURE__ */ defineComponent({
   props: {
     errors: { default: () => [] },
     loading: { type: Boolean, default: false }
@@ -4108,7 +4108,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
     }
     return (_ctx, _cache) => {
       const _component_icon = resolveComponent("icon");
-      return openBlock(), createElementBlock("div", _hoisted_1$4, [
+      return openBlock(), createElementBlock("div", _hoisted_1$6, [
         createElementVNode("div", _hoisted_2$3, [
           renderSlot(_ctx.$slots, "background")
         ]),
@@ -4197,7 +4197,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
                 "cl-mt-1.5 cl-mb-1 md:cl-mt-0.5 md:cl-mb-7 lg:cl-mb-0": __props.loading
               }])
             }, [
-              createVNode(_sfc_main$p, {
+              createVNode(_sfc_main$s, {
                 class: "!cl-leading-9 cl-w-full",
                 colour: "blue",
                 loading: __props.loading,
@@ -4246,13 +4246,13 @@ const modalColours = [
   "white"
 ];
 var clUiNavigation_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1$3 = { class: "cl-flex cl-flex-nowrap cl-h-full cl-max-h-full cl-min-h-full cl-min-w-20 cl-relative cl-self-start cl-w-auto" };
+const _hoisted_1$5 = { class: "cl-flex cl-flex-nowrap cl-h-full cl-max-h-full cl-min-h-full cl-min-w-20 cl-relative cl-self-start cl-w-auto" };
 const _hoisted_2$2 = {
   id: "group-container",
   class: "cl-bg-blue-default cl-h-full cl-left-0 cl-max-h-full cl-min-h-full cl-min-w-20 cl-overflow-y-auto cl-self-start cl-sticky cl-w-20 cl-z-30"
 };
 const _hoisted_3$1 = { class: "cl-relative cl-w-full" };
-const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const open = computed(() => groups.value.filter((i) => i.open === true).length > 0);
     const groups = ref([]);
@@ -4281,7 +4281,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     }
     return (_ctx, _cache) => {
       const _component_icon = resolveComponent("icon");
-      return openBlock(), createElementBlock("div", _hoisted_1$3, [
+      return openBlock(), createElementBlock("div", _hoisted_1$5, [
         createElementVNode("div", _hoisted_2$2, [
           renderSlot(_ctx.$slots, "icon", normalizeProps(guardReactiveProps({ groupIsOpen, toggleOpen })), void 0, true)
         ]),
@@ -4320,8 +4320,8 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-var clUiNavigation = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-6759d3a1"]]);
-const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+var clUiNavigation = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-6759d3a1"]]);
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
   props: {
     icon: null,
     open: { type: Boolean }
@@ -4343,19 +4343,19 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$2 = {
+const _hoisted_1$4 = {
   key: 0,
   class: "cl-font-bold cl-leading-8 cl-mb-8 cl-pr-8 cl-select-none cl-text-blue-light cl-text-lg"
 };
 const _hoisted_2$1 = { class: "cl-flex cl-flex-wrap cl-space-y-8 cl-text-sm cl-w-full" };
-const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   props: {
     open: { type: Boolean }
   },
   setup(__props) {
     return (_ctx, _cache) => {
       return __props.open ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-        _ctx.$slots.title ? (openBlock(), createElementBlock("div", _hoisted_1$2, [
+        _ctx.$slots.title ? (openBlock(), createElementBlock("div", _hoisted_1$4, [
           renderSlot(_ctx.$slots, "title")
         ])) : createCommentVNode("", true),
         createElementVNode("div", _hoisted_2$1, [
@@ -4365,15 +4365,15 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$1 = {};
-const _hoisted_1$1 = { class: "cl-w-full" };
+const _sfc_main$4 = {};
+const _hoisted_1$3 = { class: "cl-w-full" };
 const _hoisted_2 = {
   key: 0,
   class: "cl-font-bold cl-mb-4 cl-select-none"
 };
 const _hoisted_3 = { class: "cl-flex cl-flex-wrap cl-space-y-2" };
-function _sfc_render$1(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1$1, [
+function _sfc_render$2(_ctx, _cache) {
+  return openBlock(), createElementBlock("div", _hoisted_1$3, [
     _ctx.$slots.title ? (openBlock(), createElementBlock("div", _hoisted_2, [
       renderSlot(_ctx.$slots, "title")
     ])) : createCommentVNode("", true),
@@ -4382,28 +4382,188 @@ function _sfc_render$1(_ctx, _cache) {
     ])
   ]);
 }
-var clUiNavigationSection = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
-const _sfc_main = {};
-const _hoisted_1 = { class: "cl-cursor-pointer cl-transition-colors cl-w-full hover:cl-text-blue-light" };
-function _sfc_render(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1, [
+var clUiNavigationSection = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render$2]]);
+const _sfc_main$3 = {};
+const _hoisted_1$2 = { class: "cl-cursor-pointer cl-transition-colors cl-w-full hover:cl-text-blue-light" };
+function _sfc_render$1(_ctx, _cache) {
+  return openBlock(), createElementBlock("div", _hoisted_1$2, [
     renderSlot(_ctx.$slots, "default")
   ]);
 }
-var clUiNavigationItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+var clUiNavigationItem = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$1]]);
+const _hoisted_1$1 = { class: "cl-w-full" };
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  props: {
+    currentTab: { default: 0 },
+    disabled: { type: Boolean, default: false },
+    colour: { default: "default" }
+  },
+  setup(__props) {
+    const props = __props;
+    const headerContainer = ref();
+    const showLeftArrow = ref(false);
+    const showRightArrow = ref(false);
+    function isTabOpen(tabId) {
+      return tabId === props.currentTab;
+    }
+    function onScroll() {
+      if (headerContainer.value) {
+        const maxScroll = headerContainer.value.scrollWidth - headerContainer.value.clientWidth;
+        showLeftArrow.value = headerContainer.value.scrollLeft > 0;
+        showRightArrow.value = headerContainer.value.scrollLeft < maxScroll;
+      } else {
+        showLeftArrow.value = false;
+        showRightArrow.value = false;
+      }
+    }
+    function initialiseScroll() {
+      onScroll();
+      window.addEventListener("resize", onScroll);
+    }
+    function scrollOnClick(direction) {
+      if (headerContainer.value) {
+        const scrollAmount = headerContainer.value.scrollWidth / 5;
+        let scrollTo = scrollAmount;
+        if (direction === "left") {
+          scrollTo = -scrollAmount;
+        }
+        headerContainer.value.scroll(headerContainer.value.scrollLeft + scrollTo, 0);
+      }
+    }
+    onMounted(() => initialiseScroll());
+    onUnmounted(() => window.removeEventListener("resize", onScroll));
+    return (_ctx, _cache) => {
+      const _component_icon = resolveComponent("icon");
+      return openBlock(), createElementBlock("div", _hoisted_1$1, [
+        createElementVNode("div", null, [
+          showLeftArrow.value ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: "cl-bg-white cl-cursor-pointer cl-float-left cl-h-11 cl-w-4",
+            onClick: _cache[0] || (_cache[0] = ($event) => scrollOnClick("left"))
+          }, [
+            createVNode(_component_icon, {
+              icon: "ph:caret-left",
+              class: "cl-mt-4 cl-text-secondary-default"
+            })
+          ])) : createCommentVNode("", true),
+          createElementVNode("div", {
+            ref_key: "headerContainer",
+            ref: headerContainer,
+            class: normalizeClass(["cl-flex cl-overflow-x-auto", {
+              "cl-shadow-[inset_0_-1px_0_#eeeeee]": !__props.disabled && __props.colour === "default",
+              "cl-shadow-[inset_0_-1px_0_#9acd32]": !__props.disabled && __props.colour === "primary",
+              "cl-shadow-[inset_0_-1px_0_#30363e]": !__props.disabled && __props.colour === "secondary",
+              "cl-shadow-[inset_0_-1px_0_#f0506e]": !__props.disabled && __props.colour === "danger",
+              "cl-shadow-[inset_0_-1px_0_#1e90ff]": !__props.disabled && __props.colour === "blue",
+              "cl-shadow-[inset_0_-1px_0_#d7d7d7]": __props.disabled,
+              "cl-mr-4": showRightArrow.value
+            }]),
+            onScrollPassive: onScroll
+          }, [
+            renderSlot(_ctx.$slots, "headings", normalizeProps(guardReactiveProps({ isTabOpen, disabled: __props.disabled, colour: __props.colour })))
+          ], 34),
+          showRightArrow.value ? (openBlock(), createElementBlock("div", {
+            key: 1,
+            class: "cl-bg-white cl-bottom-12 cl-cursor-pointer cl-float-right cl-h-11 cl-relative cl-w-4",
+            onClick: _cache[1] || (_cache[1] = ($event) => scrollOnClick("right"))
+          }, [
+            createVNode(_component_icon, {
+              icon: "ph:caret-right",
+              class: "cl-mt-4 cl-text-secondary-default"
+            })
+          ])) : createCommentVNode("", true)
+        ]),
+        renderSlot(_ctx.$slots, "content", normalizeProps(guardReactiveProps({ isTabOpen, disabled: __props.disabled, colour: __props.colour })))
+      ]);
+    };
+  }
+});
+const _hoisted_1 = ["onKeyup"];
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  props: {
+    id: null,
+    currentTab: null,
+    disabled: { type: Boolean, default: false },
+    colour: { default: "default" }
+  },
+  emits: {
+    "update:currentTab": null
+  },
+  setup(__props, { emit }) {
+    const props = __props;
+    const tabbed = ref();
+    const hovered = ref();
+    const open = computed(() => props.id === props.currentTab);
+    function tabClicked() {
+      if (!props.disabled) {
+        tabbed.value = false;
+        hovered.value = false;
+        emit("update:currentTab", props.id);
+      }
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["cl-border-b cl-cursor-pointer cl-flex cl-items-center cl-px-4 cl-py-2 cl-rounded-b-none cl-rounded-sm cl-select-none cl-text-xl cl-transition cl-whitespace-nowrap focus:cl-outline-none", {
+          "!cl-cursor-default cl-text-grey-4 !cl-border-grey-2": __props.disabled,
+          "cl-border cl-border-b-0 cl-rounded-t-md cl-shadow-[inset_0_-1px_0_#ffffff] cl-cursor-default": unref(open),
+          "cl-border-grey-0": __props.colour === "default",
+          "cl-border-primary-default": __props.colour === "primary",
+          "cl-border-secondary-default": __props.colour === "secondary",
+          "cl-border-danger-default": __props.colour === "danger",
+          "cl-border-link-default": __props.colour === "blue",
+          "hover:cl-bg-grey-0": !unref(open) && !__props.disabled && __props.colour === "default",
+          "hover:cl-bg-primary-lighter": !unref(open) && !__props.disabled && __props.colour === "primary",
+          "hover:cl-bg-secondary-light focus:cl-text-white hover:cl-text-white": !unref(open) && !__props.disabled && __props.colour === "secondary",
+          "hover:cl-bg-danger-light": !unref(open) && !__props.disabled && __props.colour === "danger",
+          "hover:cl-bg-link-lighter": !unref(open) && !__props.disabled && __props.colour === "blue",
+          "cl-bg-grey-0": tabbed.value && !__props.disabled && __props.colour === "default",
+          "cl-bg-primary-lighter": tabbed.value && !__props.disabled && __props.colour === "primary",
+          "cl-bg-secondary-light cl-text-white": tabbed.value && !__props.disabled && __props.colour === "secondary",
+          "cl-bg-danger-light": tabbed.value && !__props.disabled && __props.colour === "danger",
+          "cl-bg-link-lighter": tabbed.value && !__props.disabled && __props.colour === "blue"
+        }]),
+        tabindex: "0",
+        onClick: tabClicked,
+        onMouseover: _cache[0] || (_cache[0] = ($event) => hovered.value = true),
+        onMouseout: _cache[1] || (_cache[1] = ($event) => hovered.value = false),
+        onFocusin: _cache[2] || (_cache[2] = ($event) => tabbed.value = true),
+        onFocusout: _cache[3] || (_cache[3] = ($event) => tabbed.value = false),
+        onKeyup: withKeys(withModifiers(tabClicked, ["self"]), ["enter"])
+      }, [
+        renderSlot(_ctx.$slots, "default")
+      ], 42, _hoisted_1);
+    };
+  }
+});
+const _sfc_main = {};
+function _sfc_render(_ctx, _cache) {
+  return renderSlot(_ctx.$slots, "default");
+}
+var clUiTabContent = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+const tabColours = [
+  "default",
+  "primary",
+  "secondary",
+  "danger",
+  "blue"
+];
+const tabScroll = [
+  "left",
+  "right"
+];
 var components = /* @__PURE__ */ Object.freeze({
   __proto__: null,
   [Symbol.toStringTag]: "Module",
-  clUiAccordion: _sfc_main$v,
-  clUiAccordionItem: _sfc_main$u,
+  clUiAccordion: _sfc_main$y,
+  clUiAccordionItem: _sfc_main$x,
   clUiAccordionHeader,
-  clUiApp: _sfc_main$r,
-  clUiButton: _sfc_main$p,
+  clUiApp: _sfc_main$u,
+  clUiButton: _sfc_main$s,
   buttonColours,
   buttonSizes,
-  clUiCard: _sfc_main$o,
+  clUiCard: _sfc_main$r,
   cardSizes,
-  clUiComboBox: _sfc_main$g,
+  clUiComboBox: _sfc_main$j,
   isComboBoxItem,
   isComboBoxCreateRequest,
   clUiFooter,
@@ -4419,23 +4579,28 @@ var components = /* @__PURE__ */ Object.freeze({
   isFilterRequest,
   isFilterResponse,
   clUiHeader,
-  clUiHeaderMenu: _sfc_main$7,
+  clUiHeaderMenu: _sfc_main$a,
   clUiInput: ClUiInput,
   inputTypes,
-  clUiLanguageSwitcher: _sfc_main$6,
+  clUiLanguageSwitcher: _sfc_main$9,
   isLanguageLocaleFormat,
   isLanguageArray,
   clUiLoadingSpinner: ClUiLoadingSpinner,
-  clUiLogin: _sfc_main$5,
-  clUiModal: _sfc_main$k,
+  clUiLogin: _sfc_main$8,
+  clUiModal: _sfc_main$n,
   modalSizes,
   modalColours,
   clUiNavigation,
-  clUiNavigationIcon: _sfc_main$3,
-  clUiNavigationGroup: _sfc_main$2,
+  clUiNavigationIcon: _sfc_main$6,
+  clUiNavigationGroup: _sfc_main$5,
   clUiNavigationSection,
   clUiNavigationItem,
-  clUiNotification: _sfc_main$s
+  clUiNotification: _sfc_main$v,
+  clUiTab: _sfc_main$2,
+  clUiTabHeader: _sfc_main$1,
+  clUiTabContent,
+  tabColours,
+  tabScroll
 });
 var main = "";
 const install = (app) => {
@@ -4448,4 +4613,4 @@ const install = (app) => {
     app.component(name, component);
   });
 };
-export { DateFormat, FilterOperation, NumberFormat, buttonColours, buttonSizes, cardSizes, _sfc_main$v as clUiAccordion, clUiAccordionHeader, _sfc_main$u as clUiAccordionItem, _sfc_main$r as clUiApp, _sfc_main$p as clUiButton, _sfc_main$o as clUiCard, _sfc_main$g as clUiComboBox, clUiFooter, clUiGrid, clUiHeader, _sfc_main$7 as clUiHeaderMenu, ClUiInput as clUiInput, _sfc_main$6 as clUiLanguageSwitcher, ClUiLoadingSpinner as clUiLoadingSpinner, _sfc_main$5 as clUiLogin, _sfc_main$k as clUiModal, clUiNavigation, _sfc_main$2 as clUiNavigationGroup, _sfc_main$3 as clUiNavigationIcon, clUiNavigationItem, clUiNavigationSection, _sfc_main$s as clUiNotification, datetimeFormats, install as default, filterMethodTypes, gridColumnTypes, i18n, inputTypes, isComboBoxCreateRequest, isComboBoxItem, isFilterRequest, isFilterResponse, isGridColumn, isGridColumnArray, isLanguageArray, isLanguageLocaleFormat, messages, modalColours, modalSizes, numberFormats, setCurrentLocale, setLocaleDateTimeFormats, setLocaleMessages, setLocaleNumberFormats, showNotification, stringFormats, validateEmail, validateMaxValue, validateMinValue };
+export { DateFormat, FilterOperation, NumberFormat, buttonColours, buttonSizes, cardSizes, _sfc_main$y as clUiAccordion, clUiAccordionHeader, _sfc_main$x as clUiAccordionItem, _sfc_main$u as clUiApp, _sfc_main$s as clUiButton, _sfc_main$r as clUiCard, _sfc_main$j as clUiComboBox, clUiFooter, clUiGrid, clUiHeader, _sfc_main$a as clUiHeaderMenu, ClUiInput as clUiInput, _sfc_main$9 as clUiLanguageSwitcher, ClUiLoadingSpinner as clUiLoadingSpinner, _sfc_main$8 as clUiLogin, _sfc_main$n as clUiModal, clUiNavigation, _sfc_main$5 as clUiNavigationGroup, _sfc_main$6 as clUiNavigationIcon, clUiNavigationItem, clUiNavigationSection, _sfc_main$v as clUiNotification, _sfc_main$2 as clUiTab, clUiTabContent, _sfc_main$1 as clUiTabHeader, datetimeFormats, install as default, filterMethodTypes, gridColumnTypes, i18n, inputTypes, isComboBoxCreateRequest, isComboBoxItem, isFilterRequest, isFilterResponse, isGridColumn, isGridColumnArray, isLanguageArray, isLanguageLocaleFormat, messages, modalColours, modalSizes, numberFormats, setCurrentLocale, setLocaleDateTimeFormats, setLocaleMessages, setLocaleNumberFormats, showNotification, stringFormats, tabColours, tabScroll, validateEmail, validateMaxValue, validateMinValue };