@frollo/frollo-web-ui 6.0.2 → 6.0.3

package/esm/index.js

@@ -1,11 +1,11 @@
-import { _ as _unsupportedIterableToArray, s as script$i } from './index-95659c75.js';
-export { s as FwBarChart } from './index-95659c75.js';
-import { s as script$c } from './fw-image-9c1032f2.js';
-export { s as FwImage } from './fw-image-9c1032f2.js';
-import './es.object.to-string-31ad45ad.js';
-import { d as descriptors, f as functionUncurryThis, t as toIndexedObject$1, o as objectPropertyIsEnumerable } from './is-forced-b8806e4b.js';
-import { _ as _export } from './export-44690f0d.js';
-import { o as objectKeys$1 } from './object-create-200e3764.js';
+import { _ as _unsupportedIterableToArray, s as script$i } from './index-6758f755.js';
+export { s as FwBarChart } from './index-6758f755.js';
+import { s as script$c } from './fw-image-aca2c61d.js';
+export { s as FwImage } from './fw-image-aca2c61d.js';
+import './es.object.to-string-4b07c4d1.js';
+import { d as descriptors, f as functionUncurryThis, t as toIndexedObject$1, o as objectPropertyIsEnumerable } from './is-forced-7cb3ee8f.js';
+import { _ as _export } from './export-10c4adbc.js';
+import { o as objectKeys$1 } from './object-create-51bf02dc.js';
 import './fw-form.js';
 import './fw-input.js';
 import { FwCheckbox as script$1 } from './fw-checkbox.js';
@@ -46,49 +46,49 @@ import { FwEmailPulse as __default__$5, FwSuccessPulse as __default__$6 } from '
 export { FwEmailPulse, FwSuccessPulse } from './fw-animations.js';
 import { F as Form } from './vee-validate.esm-a17a23c3.js';
 export { F as FwForm } from './vee-validate.esm-a17a23c3.js';
-import { s as script } from './fw-input-8fa201f7.js';
-export { s as FwInput } from './fw-input-8fa201f7.js';
-import { s as script$2 } from './fw-dropdown-3f1ae8ee.js';
-export { s as FwDropdown } from './fw-dropdown-3f1ae8ee.js';
+import { s as script } from './fw-input-259e2e18.js';
+export { s as FwInput } from './fw-input-259e2e18.js';
+import { s as script$2 } from './fw-dropdown-6856e66e.js';
+export { s as FwDropdown } from './fw-dropdown-6856e66e.js';
 import { s as script$3 } from './fw-card-1b6a67fe.js';
 export { s as FwCard } from './fw-card-1b6a67fe.js';
-import { s as script$4 } from './fw-button-cbaedd16.js';
-export { s as FwButton } from './fw-button-cbaedd16.js';
-import { _ as __default__ } from './fw-tag-749b4fc6.js';
-export { _ as FwTag } from './fw-tag-749b4fc6.js';
-import { _ as __default__$1, s as script$a, a as script$b } from './fw-table-row-cfbd796c.js';
-export { _ as FwTable, s as FwTableHead, a as FwTableRow } from './fw-table-row-cfbd796c.js';
+import { s as script$4 } from './fw-button-c8502414.js';
+export { s as FwButton } from './fw-button-c8502414.js';
+import { _ as __default__ } from './fw-tag-ac28200a.js';
+export { _ as FwTag } from './fw-tag-ac28200a.js';
+import { _ as __default__$1, s as script$a, a as script$b } from './fw-table-row-23f78218.js';
+export { _ as FwTable, s as FwTableHead, a as FwTableRow } from './fw-table-row-23f78218.js';
 import { s as script$d } from './fw-loading-bar-f5ca605c.js';
 export { s as FwLoadingBar } from './fw-loading-bar-f5ca605c.js';
 import { s as script$m } from './fw-loading-spinner-72d70258.js';
 export { s as FwLoadingSpinner } from './fw-loading-spinner-72d70258.js';
 import { _ as _defineProperty } from './defineProperty-b85f2e0f.js';
 import { reactive, createApp, h } from 'vue';
-import './es.number.constructor-bed13ae4.js';
-import './classof-7ba4c6c3.js';
-import './regexp-flags-8d5e20e1.js';
-import './function-apply-5580128b.js';
-import './es.string.iterator-27b735a3.js';
-import './array-iteration-2181d2bd.js';
-import './array-species-create-ff1f78e1.js';
-import './create-property-1bf185fa.js';
-import './es.array.map-582a2b69.js';
-import './array-method-has-species-support-dfbd0c7f.js';
-import './es.function.name-14d69869.js';
-import './does-not-exceed-safe-integer-b66f7ee2.js';
+import './es.number.constructor-fb16fe05.js';
+import './classof-d44bf093.js';
+import './regexp-flags-c09864e5.js';
+import './function-apply-e17cf65b.js';
+import './es.string.iterator-25db8cd2.js';
+import './array-iteration-8267bf22.js';
+import './array-species-create-1c67e297.js';
+import './create-property-eb329361.js';
+import './es.array.map-c56ebffd.js';
+import './array-method-has-species-support-6c675094.js';
+import './es.function.name-6cafd747.js';
+import './does-not-exceed-safe-integer-de37ce28.js';
 import './get-root-colours-865a52ba.js';
 import './uniqueId-fe08534a.js';
-import './es.array.includes-d57031df.js';
-import './add-to-unscopables-cfb87985.js';
-import './array-method-is-strict-7dac83d7.js';
-import './es.array.find-ee91a966.js';
-import './web.timers-991ce9a8.js';
+import './es.array.includes-08e25019.js';
+import './add-to-unscopables-ee05b58f.js';
+import './array-method-is-strict-d313436f.js';
+import './es.array.find-1ded15d5.js';
+import './web.timers-e406c8e6.js';
 import './index-bced3b35.js';
 import './check-94a5917a.js';
 import './style-inject.es-1f59c1d0.js';
-import './es.array.concat-d9281ad1.js';
-import './es.string.includes-01e4d90f.js';
-import './es.date.to-string-dc67483a.js';
+import './es.array.concat-99b85557.js';
+import './es.string.includes-061e8272.js';
+import './es.date.to-string-15eb9936.js';
 import './index-0c5cae4f.js';
 
 function _arrayWithHoles(arr) {

package/esm/{object-create-200e3764.js → object-create-51bf02dc.js}

@@ -1,4 +1,4 @@
-import { T as objectKeysInternal, U as enumBugKeys$2, d as descriptors, V as v8PrototypeDefineBug, G as objectDefineProperty, n as anObject$2, t as toIndexedObject$1, D as getBuiltIn$1, W as hiddenKeys$1, a as documentCreateElement$1, O as sharedKey$1 } from './is-forced-b8806e4b.js';
+import { T as objectKeysInternal, U as enumBugKeys$2, d as descriptors, V as v8PrototypeDefineBug, G as objectDefineProperty, n as anObject$2, t as toIndexedObject$1, D as getBuiltIn$1, W as hiddenKeys$1, a as documentCreateElement$1, O as sharedKey$1 } from './is-forced-7cb3ee8f.js';
 
 var internalObjectKeys = objectKeysInternal;
 var enumBugKeys$1 = enumBugKeys$2;

package/esm/{regexp-flags-8d5e20e1.js → regexp-flags-c09864e5.js}

@@ -1,6 +1,6 @@
-import { e as toObject$1, h as fails$1, N as tryToString$1, n as anObject$1 } from './is-forced-b8806e4b.js';
-import { _ as _export } from './export-44690f0d.js';
-import { o as objectKeys } from './object-create-200e3764.js';
+import { e as toObject$1, h as fails$1, N as tryToString$1, n as anObject$1 } from './is-forced-7cb3ee8f.js';
+import { _ as _export } from './export-10c4adbc.js';
+import { o as objectKeys } from './object-create-51bf02dc.js';
 
 var es_object_keys = {};
 

package/esm/{web.timers-991ce9a8.js → web.timers-e406c8e6.js}

@@ -1,6 +1,6 @@
-import { f as functionUncurryThis, g as global$3, x as isCallable$1, j as engineUserAgent } from './is-forced-b8806e4b.js';
-import { _ as _export } from './export-44690f0d.js';
-import { f as functionApply } from './function-apply-5580128b.js';
+import { f as functionUncurryThis, g as global$3, x as isCallable$1, j as engineUserAgent } from './is-forced-7cb3ee8f.js';
+import { _ as _export } from './export-10c4adbc.js';
+import { f as functionApply } from './function-apply-e17cf65b.js';
 
 var web_timers = {};
 

package/frollo-web-ui.esm.js

@@ -7101,13 +7101,14 @@ function render$n(_ctx, _cache, $props, $setup, $data, $options) {
       to: item.to,
       external: item.external,
       size: "md",
-      "aria-current": "page"
+      "aria-current": "page",
+      onClick: item.onClick
     }, {
       "default": withCtx(function () {
         return [createTextVNode(toDisplayString(item.label), 1)];
       }),
       _: 2
-    }, 1032, ["href", "to", "external"]);
+    }, 1032, ["href", "to", "external", "onClick"]);
   }), 128))])])) : createCommentVNode("", true), _ctx.actionLabel ? (openBlock(), createElementBlock("div", _hoisted_5$a, [createVNode(_component_FwButton, {
     onClick: _ctx.actionClicked,
     size: "md",
@@ -7147,13 +7148,14 @@ function render$n(_ctx, _cache, $props, $setup, $data, $options) {
           to: item.to,
           external: item.external,
           size: "md",
-          "aria-current": "page"
+          "aria-current": "page",
+          onClick: item.onClick
         }, {
           "default": withCtx(function () {
             return [createTextVNode(toDisplayString(item.label), 1)];
           }),
           _: 2
-        }, 1032, ["href", "to", "external"]);
+        }, 1032, ["href", "to", "external", "onClick"]);
       }), 128))]), _ctx.actionLabel ? (openBlock(), createBlock(_component_FwButton, {
         key: 0,
         "class": "w-full rounded-md",
@@ -8198,7 +8200,7 @@ var __default__$6 = defineComponent({
     ArrowDownSvg: render$A,
     FwLoadingBar: script$b
   },
-  emits: ['rowClicked'],
+  emits: ['rowClicked', 'columnSorted'],
   props: {
     items: {
       type: Array,
@@ -8233,12 +8235,13 @@ var __default__$6 = defineComponent({
     var currentSortedColumn = ref('');
     onMounted(function () {
       if (Number(props.autoSortColumn) >= 0) {
-        sortColumn(columns.value[Number(props.autoSortColumn)]);
+        sortColumn(columns.value[Number(props.autoSortColumn)], false);
       }
     });
     var _useColours = useColours(),
       bgHoverColor = _useColours.primaryFade5;
     var sortColumn = function sortColumn(column) {
+      var isAction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
       if (!isColumnSortable(column)) return;
       currentSortedColumn.value = column;
       if (sortBy.value === column) {
@@ -8247,6 +8250,7 @@ var __default__$6 = defineComponent({
         sortBy.value = column;
         sortDirection.value = columnInitSort(column);
       }
+      if (isAction) ctx.emit('columnSorted', column, sortDirection.value);
     };
     var sortedData = computed(function () {
       if (!sortBy.value) {
@@ -8321,7 +8325,7 @@ var __default__$6 = defineComponent({
 var __injectCSSVars__$5 = function __injectCSSVars__() {
   useCssVars(function (_ctx) {
     return {
-      "783a25a4": _ctx.bgHoverColor
+      "1f1e2224": _ctx.bgHoverColor
     };
   });
 };
@@ -8332,7 +8336,7 @@ __default__$6.setup = __setup__$5 ? function (props, ctx) {
 } : __injectCSSVars__$5;
 
 var _withScopeId$4 = function _withScopeId(n) {
-  return pushScopeId("data-v-70e44800"), n = n(), popScopeId(), n;
+  return pushScopeId("data-v-2b5e0ff2"), n = n(), popScopeId(), n;
 };
 var _hoisted_1$q = ["aria-busy"];
 var _hoisted_2$o = {
@@ -8441,12 +8445,12 @@ function render$g(_ctx, _cache, $props, $setup, $data, $options) {
   }), 128))])], 10, _hoisted_1$q);
 }
 
-var css_248z$b = ".fw-table-head--sortable[data-v-70e44800]:hover{background-color:var(--783a25a4)}.fw-table-row[data-v-70e44800]:hover{background-color:var(--783a25a4)}";
-var stylesheet$b = ".fw-table-head--sortable[data-v-70e44800]:hover{background-color:var(--783a25a4)}.fw-table-row[data-v-70e44800]:hover{background-color:var(--783a25a4)}";
+var css_248z$b = ".fw-table-head--sortable[data-v-2b5e0ff2]:hover{background-color:var(--1f1e2224)}.fw-table-row[data-v-2b5e0ff2]:hover{background-color:var(--1f1e2224)}";
+var stylesheet$b = ".fw-table-head--sortable[data-v-2b5e0ff2]:hover{background-color:var(--1f1e2224)}.fw-table-row[data-v-2b5e0ff2]:hover{background-color:var(--1f1e2224)}";
 styleInject(css_248z$b);
 
 __default__$6.render = render$g;
-__default__$6.__scopeId = "data-v-70e44800";
+__default__$6.__scopeId = "data-v-2b5e0ff2";
 
 var script$a = defineComponent({
   name: 'FwTableHead'
@@ -8485,6 +8489,7 @@ script$9.render = render$e;
 
 var __default__$5 = defineComponent({
   name: 'FwAccordion',
+  emits: ['toggled'],
   props: {
     /**
      * The header title of the accordion
@@ -8513,8 +8518,11 @@ var __default__$5 = defineComponent({
       "default": true
     }
   },
-  setup: function setup(props) {
+  setup: function setup(props, ctx) {
     var isOpen = ref(props.isOpened);
+    watch(isOpen, function (newValue) {
+      ctx.emit('toggled', newValue);
+    });
     var _useColours = useColours(),
       bgHoverColor = _useColours.primaryFade5;
     var beforeEnter = function beforeEnter(el) {
@@ -8542,7 +8550,7 @@ var __default__$5 = defineComponent({
 var __injectCSSVars__$4 = function __injectCSSVars__() {
   useCssVars(function (_ctx) {
     return {
-      "0ec0724b": _ctx.bgHoverColor
+      "5f2b9a00": _ctx.bgHoverColor
     };
   });
 };
@@ -8553,7 +8561,7 @@ __default__$5.setup = __setup__$4 ? function (props, ctx) {
 } : __injectCSSVars__$4;
 
 var _withScopeId$3 = function _withScopeId(n) {
-  return pushScopeId("data-v-5123413b"), n = n(), popScopeId(), n;
+  return pushScopeId("data-v-a62b48c8"), n = n(), popScopeId(), n;
 };
 var _hoisted_1$n = {
   "class": "fw-accordion rounded-sm border border-grey-40"
@@ -8598,12 +8606,12 @@ function render$d(_ctx, _cache, $props, $setup, $data, $options) {
   }, 8, ["onBeforeEnter", "onEnter", "onBeforeLeave", "onLeave"])]);
 }
 
-var css_248z$a = ".fw-accordion--header-open[data-v-5123413b],.fw-accordion--header[data-v-5123413b]:focus-visible,.fw-accordion--header[data-v-5123413b]:hover{background-color:var(--0ec0724b)}.fw-accordion--icon[data-v-5123413b]{position:relative}.fw-accordion--icon[data-v-5123413b]:after,.fw-accordion--icon[data-v-5123413b]:before{background:var(--colorBody);border-radius:3px;content:\"\";height:.2rem;left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transition:.3s ease-in-out;transition:.3s ease-in-out;width:1rem}.fw-accordion--icon[data-v-5123413b]:after{-webkit-transform:translate(-50%,-50%) rotate(90deg);-ms-transform:translate(-50%,-50%) rotate(90deg);transform:translate(-50%,-50%) rotate(90deg)}.fw-accordion--icon-open[data-v-5123413b]:after{width:0}";
-var stylesheet$a = ".fw-accordion--header-open[data-v-5123413b],.fw-accordion--header[data-v-5123413b]:focus-visible,.fw-accordion--header[data-v-5123413b]:hover{background-color:var(--0ec0724b)}.fw-accordion--icon[data-v-5123413b]{position:relative}.fw-accordion--icon[data-v-5123413b]:after,.fw-accordion--icon[data-v-5123413b]:before{background:var(--colorBody);border-radius:3px;content:\"\";height:.2rem;left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transition:.3s ease-in-out;transition:.3s ease-in-out;width:1rem}.fw-accordion--icon[data-v-5123413b]:after{-webkit-transform:translate(-50%,-50%) rotate(90deg);-ms-transform:translate(-50%,-50%) rotate(90deg);transform:translate(-50%,-50%) rotate(90deg)}.fw-accordion--icon-open[data-v-5123413b]:after{width:0}";
+var css_248z$a = ".fw-accordion--header-open[data-v-a62b48c8],.fw-accordion--header[data-v-a62b48c8]:focus-visible,.fw-accordion--header[data-v-a62b48c8]:hover{background-color:var(--5f2b9a00)}.fw-accordion--icon[data-v-a62b48c8]{position:relative}.fw-accordion--icon[data-v-a62b48c8]:after,.fw-accordion--icon[data-v-a62b48c8]:before{background:var(--colorBody);border-radius:3px;content:\"\";height:.2rem;left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transition:.3s ease-in-out;transition:.3s ease-in-out;width:1rem}.fw-accordion--icon[data-v-a62b48c8]:after{-webkit-transform:translate(-50%,-50%) rotate(90deg);-ms-transform:translate(-50%,-50%) rotate(90deg);transform:translate(-50%,-50%) rotate(90deg)}.fw-accordion--icon-open[data-v-a62b48c8]:after{width:0}";
+var stylesheet$a = ".fw-accordion--header-open[data-v-a62b48c8],.fw-accordion--header[data-v-a62b48c8]:focus-visible,.fw-accordion--header[data-v-a62b48c8]:hover{background-color:var(--5f2b9a00)}.fw-accordion--icon[data-v-a62b48c8]{position:relative}.fw-accordion--icon[data-v-a62b48c8]:after,.fw-accordion--icon[data-v-a62b48c8]:before{background:var(--colorBody);border-radius:3px;content:\"\";height:.2rem;left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transition:.3s ease-in-out;transition:.3s ease-in-out;width:1rem}.fw-accordion--icon[data-v-a62b48c8]:after{-webkit-transform:translate(-50%,-50%) rotate(90deg);-ms-transform:translate(-50%,-50%) rotate(90deg);transform:translate(-50%,-50%) rotate(90deg)}.fw-accordion--icon-open[data-v-a62b48c8]:after{width:0}";
 styleInject(css_248z$a);
 
 __default__$5.render = render$d;
-__default__$5.__scopeId = "data-v-5123413b";
+__default__$5.__scopeId = "data-v-a62b48c8";
 
 var es_array_from = {};
 

package/index.d.ts

@@ -755,6 +755,7 @@ declare interface NavMenuItem {
     href?: string;
     label: string;
     external?: boolean;
+    onClick?: () => void;
 }
 
 declare const _default$h: vue.DefineComponent<{
@@ -1373,7 +1374,7 @@ declare const __default__$5: vue.DefineComponent<{
     columns: vue.ComputedRef<string[]>;
     sortBy: vue.Ref<string>;
     sortDirection: vue.Ref<FwTableSort>;
-    sortColumn: (column: string) => void;
+    sortColumn: (column: string, isAction?: boolean) => void;
     sortedData: vue.ComputedRef<FwTableItem[]>;
     currentSortedColumn: vue.Ref<string>;
     sortedIcon: (sortDir: string, column: string) => boolean;
@@ -1382,7 +1383,7 @@ declare const __default__$5: vue.DefineComponent<{
     isDisabled: (column: string) => boolean;
     rowClicked: (row: FwTableItem) => void;
     bgHoverColor: string;
-}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "rowClicked"[], "rowClicked", vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("rowClicked" | "columnSorted")[], "rowClicked" | "columnSorted", vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
     items: {
         type: PropType<FwTableItem[]>;
         required: true;
@@ -1408,6 +1409,7 @@ declare const __default__$5: vue.DefineComponent<{
     };
 }>> & {
     onRowClicked?: ((...args: any[]) => any) | undefined;
+    onColumnSorted?: ((...args: any[]) => any) | undefined;
 }, {
     loading: boolean;
     clickableRows: boolean;
@@ -1451,7 +1453,7 @@ declare const __default__$4: vue.DefineComponent<{
     beforeLeave: (el: Element) => void;
     leave: (el: Element) => void;
     bgHoverColor: string;
-}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "toggled"[], "toggled", vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
     /**
      * The header title of the accordion
      */
@@ -1478,7 +1480,9 @@ declare const __default__$4: vue.DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-}>>, {
+}>> & {
+    onToggled?: ((...args: any[]) => any) | undefined;
+}, {
     isOpened: boolean;
     iconPositionStart: boolean;
 }>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@frollo/frollo-web-ui",
-  "version": "6.0.2",
+  "version": "6.0.3",
   "description": "Frollo's UI library for components, utilities and configs",
   "exports": {
     "./icons": "./icons/index.ts",

package/types/components/fw-accordion/fw-accordion.vue.d.ts

@@ -32,7 +32,7 @@ declare const __default__: import("vue").DefineComponent<{
     beforeLeave: (el: Element) => void;
     leave: (el: Element) => void;
     bgHoverColor: string;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "toggled"[], "toggled", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     /**
      * The header title of the accordion
      */
@@ -59,7 +59,9 @@ declare const __default__: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-}>>, {
+}>> & {
+    onToggled?: ((...args: any[]) => any) | undefined;
+}, {
     isOpened: boolean;
     iconPositionStart: boolean;
 }>;

package/types/components/fw-navigation-menu/index.types.d.ts

@@ -3,4 +3,5 @@ export declare interface NavMenuItem {
     href?: string;
     label: string;
     external?: boolean;
+    onClick?: () => void;
 }

package/types/components/fw-table/fw-table.vue.d.ts

@@ -28,7 +28,7 @@ declare const __default__: import("vue").DefineComponent<{
     columns: import("vue").ComputedRef<string[]>;
     sortBy: import("vue").Ref<string>;
     sortDirection: import("vue").Ref<FwTableSort>;
-    sortColumn: (column: string) => void;
+    sortColumn: (column: string, isAction?: boolean) => void;
     sortedData: import("vue").ComputedRef<FwTableItem[]>;
     currentSortedColumn: import("vue").Ref<string>;
     sortedIcon: (sortDir: string, column: string) => boolean;
@@ -37,7 +37,7 @@ declare const __default__: import("vue").DefineComponent<{
     isDisabled: (column: string) => boolean;
     rowClicked: (row: FwTableItem) => void;
     bgHoverColor: string;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "rowClicked"[], "rowClicked", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("rowClicked" | "columnSorted")[], "rowClicked" | "columnSorted", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     items: {
         type: PropType<FwTableItem[]>;
         required: true;
@@ -63,6 +63,7 @@ declare const __default__: import("vue").DefineComponent<{
     };
 }>> & {
     onRowClicked?: ((...args: any[]) => any) | undefined;
+    onColumnSorted?: ((...args: any[]) => any) | undefined;
 }, {
     loading: boolean;
     clickableRows: boolean;

package/web-components/index.js

@@ -18551,13 +18551,14 @@
         to: item.to,
         external: item.external,
         size: "md",
-        "aria-current": "page"
+        "aria-current": "page",
+        onClick: item.onClick
       }, {
         "default": withCtx(function () {
           return [createTextVNode(toDisplayString(item.label), 1)];
         }),
         _: 2
-      }, 1032, ["href", "to", "external"]);
+      }, 1032, ["href", "to", "external", "onClick"]);
     }), 128))])])) : createCommentVNode("", true), _ctx.actionLabel ? (openBlock(), createElementBlock("div", _hoisted_5$a, [createVNode(_component_FwButton, {
       onClick: _ctx.actionClicked,
       size: "md",
@@ -18597,13 +18598,14 @@
             to: item.to,
             external: item.external,
             size: "md",
-            "aria-current": "page"
+            "aria-current": "page",
+            onClick: item.onClick
           }, {
             "default": withCtx(function () {
               return [createTextVNode(toDisplayString(item.label), 1)];
             }),
             _: 2
-          }, 1032, ["href", "to", "external"]);
+          }, 1032, ["href", "to", "external", "onClick"]);
         }), 128))]), _ctx.actionLabel ? (openBlock(), createBlock(_component_FwButton, {
           key: 0,
           "class": "w-full rounded-md",
@@ -19648,7 +19650,7 @@
       ArrowDownSvg: render$A,
       FwLoadingBar: script$b
     },
-    emits: ['rowClicked'],
+    emits: ['rowClicked', 'columnSorted'],
     props: {
       items: {
         type: Array,
@@ -19683,12 +19685,13 @@
       var currentSortedColumn = ref('');
       onMounted(function () {
         if (Number(props.autoSortColumn) >= 0) {
-          sortColumn(columns.value[Number(props.autoSortColumn)]);
+          sortColumn(columns.value[Number(props.autoSortColumn)], false);
         }
       });
       var _useColours = useColours(),
         bgHoverColor = _useColours.primaryFade5;
       var sortColumn = function sortColumn(column) {
+        var isAction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
         if (!isColumnSortable(column)) return;
         currentSortedColumn.value = column;
         if (sortBy.value === column) {
@@ -19697,6 +19700,7 @@
           sortBy.value = column;
           sortDirection.value = columnInitSort(column);
         }
+        if (isAction) ctx.emit('columnSorted', column, sortDirection.value);
       };
       var sortedData = computed(function () {
         if (!sortBy.value) {
@@ -19771,7 +19775,7 @@
   var __injectCSSVars__$5 = function __injectCSSVars__() {
     useCssVars(function (_ctx) {
       return {
-        "783a25a4": _ctx.bgHoverColor
+        "1f1e2224": _ctx.bgHoverColor
       };
     });
   };
@@ -19782,7 +19786,7 @@
   } : __injectCSSVars__$5;
 
   var _withScopeId$4 = function _withScopeId(n) {
-    return pushScopeId("data-v-70e44800"), n = n(), popScopeId(), n;
+    return pushScopeId("data-v-2b5e0ff2"), n = n(), popScopeId(), n;
   };
   var _hoisted_1$q = ["aria-busy"];
   var _hoisted_2$o = {
@@ -19891,12 +19895,12 @@
     }), 128))])], 10, _hoisted_1$q);
   }
 
-  var css_248z$b = ".fw-table-head--sortable[data-v-70e44800]:hover{background-color:var(--783a25a4)}.fw-table-row[data-v-70e44800]:hover{background-color:var(--783a25a4)}";
-  var stylesheet$b = ".fw-table-head--sortable[data-v-70e44800]:hover{background-color:var(--783a25a4)}.fw-table-row[data-v-70e44800]:hover{background-color:var(--783a25a4)}";
+  var css_248z$b = ".fw-table-head--sortable[data-v-2b5e0ff2]:hover{background-color:var(--1f1e2224)}.fw-table-row[data-v-2b5e0ff2]:hover{background-color:var(--1f1e2224)}";
+  var stylesheet$b = ".fw-table-head--sortable[data-v-2b5e0ff2]:hover{background-color:var(--1f1e2224)}.fw-table-row[data-v-2b5e0ff2]:hover{background-color:var(--1f1e2224)}";
   styleInject(css_248z$b);
 
   __default__$6.render = render$g;
-  __default__$6.__scopeId = "data-v-70e44800";
+  __default__$6.__scopeId = "data-v-2b5e0ff2";
 
   var script$a = defineComponent({
     name: 'FwTableHead'
@@ -19935,6 +19939,7 @@
 
   var __default__$5 = defineComponent({
     name: 'FwAccordion',
+    emits: ['toggled'],
     props: {
       /**
        * The header title of the accordion
@@ -19963,8 +19968,11 @@
         "default": true
       }
     },
-    setup: function setup(props) {
+    setup: function setup(props, ctx) {
       var isOpen = ref(props.isOpened);
+      watch(isOpen, function (newValue) {
+        ctx.emit('toggled', newValue);
+      });
       var _useColours = useColours(),
         bgHoverColor = _useColours.primaryFade5;
       var beforeEnter = function beforeEnter(el) {
@@ -19992,7 +20000,7 @@
   var __injectCSSVars__$4 = function __injectCSSVars__() {
     useCssVars(function (_ctx) {
       return {
-        "0ec0724b": _ctx.bgHoverColor
+        "5f2b9a00": _ctx.bgHoverColor
       };
     });
   };
@@ -20003,7 +20011,7 @@
   } : __injectCSSVars__$4;
 
   var _withScopeId$3 = function _withScopeId(n) {
-    return pushScopeId("data-v-5123413b"), n = n(), popScopeId(), n;
+    return pushScopeId("data-v-a62b48c8"), n = n(), popScopeId(), n;
   };
   var _hoisted_1$n = {
     "class": "fw-accordion rounded-sm border border-grey-40"
@@ -20048,12 +20056,12 @@
     }, 8, ["onBeforeEnter", "onEnter", "onBeforeLeave", "onLeave"])]);
   }
 
-  var css_248z$a = ".fw-accordion--header-open[data-v-5123413b],.fw-accordion--header[data-v-5123413b]:focus-visible,.fw-accordion--header[data-v-5123413b]:hover{background-color:var(--0ec0724b)}.fw-accordion--icon[data-v-5123413b]{position:relative}.fw-accordion--icon[data-v-5123413b]:after,.fw-accordion--icon[data-v-5123413b]:before{background:var(--colorBody);border-radius:3px;content:\"\";height:.2rem;left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transition:.3s ease-in-out;transition:.3s ease-in-out;width:1rem}.fw-accordion--icon[data-v-5123413b]:after{-webkit-transform:translate(-50%,-50%) rotate(90deg);-ms-transform:translate(-50%,-50%) rotate(90deg);transform:translate(-50%,-50%) rotate(90deg)}.fw-accordion--icon-open[data-v-5123413b]:after{width:0}";
-  var stylesheet$a = ".fw-accordion--header-open[data-v-5123413b],.fw-accordion--header[data-v-5123413b]:focus-visible,.fw-accordion--header[data-v-5123413b]:hover{background-color:var(--0ec0724b)}.fw-accordion--icon[data-v-5123413b]{position:relative}.fw-accordion--icon[data-v-5123413b]:after,.fw-accordion--icon[data-v-5123413b]:before{background:var(--colorBody);border-radius:3px;content:\"\";height:.2rem;left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transition:.3s ease-in-out;transition:.3s ease-in-out;width:1rem}.fw-accordion--icon[data-v-5123413b]:after{-webkit-transform:translate(-50%,-50%) rotate(90deg);-ms-transform:translate(-50%,-50%) rotate(90deg);transform:translate(-50%,-50%) rotate(90deg)}.fw-accordion--icon-open[data-v-5123413b]:after{width:0}";
+  var css_248z$a = ".fw-accordion--header-open[data-v-a62b48c8],.fw-accordion--header[data-v-a62b48c8]:focus-visible,.fw-accordion--header[data-v-a62b48c8]:hover{background-color:var(--5f2b9a00)}.fw-accordion--icon[data-v-a62b48c8]{position:relative}.fw-accordion--icon[data-v-a62b48c8]:after,.fw-accordion--icon[data-v-a62b48c8]:before{background:var(--colorBody);border-radius:3px;content:\"\";height:.2rem;left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transition:.3s ease-in-out;transition:.3s ease-in-out;width:1rem}.fw-accordion--icon[data-v-a62b48c8]:after{-webkit-transform:translate(-50%,-50%) rotate(90deg);-ms-transform:translate(-50%,-50%) rotate(90deg);transform:translate(-50%,-50%) rotate(90deg)}.fw-accordion--icon-open[data-v-a62b48c8]:after{width:0}";
+  var stylesheet$a = ".fw-accordion--header-open[data-v-a62b48c8],.fw-accordion--header[data-v-a62b48c8]:focus-visible,.fw-accordion--header[data-v-a62b48c8]:hover{background-color:var(--5f2b9a00)}.fw-accordion--icon[data-v-a62b48c8]{position:relative}.fw-accordion--icon[data-v-a62b48c8]:after,.fw-accordion--icon[data-v-a62b48c8]:before{background:var(--colorBody);border-radius:3px;content:\"\";height:.2rem;left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transition:.3s ease-in-out;transition:.3s ease-in-out;width:1rem}.fw-accordion--icon[data-v-a62b48c8]:after{-webkit-transform:translate(-50%,-50%) rotate(90deg);-ms-transform:translate(-50%,-50%) rotate(90deg);transform:translate(-50%,-50%) rotate(90deg)}.fw-accordion--icon-open[data-v-a62b48c8]:after{width:0}";
   styleInject(css_248z$a);
 
   __default__$5.render = render$d;
-  __default__$5.__scopeId = "data-v-5123413b";
+  __default__$5.__scopeId = "data-v-a62b48c8";
 
   var es_array_from = {};