@frollo/frollo-web-ui 8.5.3 → 9.0.0

package/esm/fw-popover.js

@@ -1,293 +1,6 @@
-import { c as _asyncToGenerator, d as _regeneratorRuntime, e as _defineProperty } from './_rollupPluginBabelHelpers-DpC_oIQV.js';
-import { defineComponent, ref, computed, watchEffect, onBeforeUnmount, onMounted, onUpdated, useCssVars, pushScopeId, popScopeId, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
-import { c as createPopper } from './index-BVcOAKar.js';
-import { u as uniqueId } from './uniqueId-DK6xzFd8.js';
-import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
-
-/**
- * Gets the first element of `array`.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @alias first
- * @category Array
- * @param {Array} array The array to query.
- * @returns {*} Returns the first element of `array`.
- * @example
- *
- * _.head([1, 2, 3]);
- * // => 1
- *
- * _.head([]);
- * // => undefined
- */
-function head(array) {
-  return (array && array.length) ? array[0] : undefined;
-}
-
-var __default__ = defineComponent({
-  name: 'FwPopover',
-  emits: ['closed'],
-  props: {
-    /**
-     * The title of the popover
-     */
-    title: String,
-    /**
-     * The side of the target element the popover should be placed against. Accepts 'top', 'right', 'bottom' and 'left'
-     */
-    placement: {
-      type: String,
-      "default": 'bottom',
-      validator: function validator(value) {
-        return ['top', 'right', 'bottom', 'left', 'auto', 'auto-start', 'auto-end', 'top-start', 'top-end', 'bottom-start', 'bottom-end', 'right-start', 'right-end', 'left-start', 'left-end'].includes(value);
-      }
-    },
-    /**
-     * Whether to use `fixed` or `absolute` positioning.
-     * Absolute is more performant if you have a lot of popovers; fixed is more robust
-     */
-    position: {
-      type: String,
-      "default": 'absolute',
-      validator: function validator(value) {
-        return ['fixed', 'absolute'].includes(value);
-      }
-    },
-    /**
-     * The input event which causes the popover to show. Accepts 'click' and 'hover'
-     */
-    trigger: {
-      type: String,
-      "default": 'click',
-      validator: function validator(value) {
-        return ['click', 'hover', 'focus'].includes(value);
-      }
-    },
-    /**
-     * Whether to show component on top of all components by setting the highest z-index
-     */
-    showOnTop: {
-      type: Boolean,
-      "default": false
-    },
-    /**
-     * Close the popover automatically when the user clicks inside of the popover
-     */
-    closeOnClick: {
-      type: Boolean,
-      "default": false
-    },
-    /**
-     * Close the popover automatically when the user clicks outside of the popover
-     */
-    closeOnClickOutside: {
-      type: Boolean,
-      "default": true
-    },
-    /**
-     * The text alignment of the popover content should be placed against. Accepts 'center', 'right' and 'left'
-     */
-    textAlign: {
-      type: String,
-      "default": 'left',
-      validator: function validator(value) {
-        return ['center', 'left', 'right'].includes(value);
-      }
-    },
-    /**
-     * Whether to show the arrow
-     **/
-    showArrow: {
-      type: Boolean,
-      "default": false
-    }
-  },
-  setup: function setup(props, ctx) {
-    var targetElement = ref();
-    var contentElement = ref();
-    var timer = ref();
-    var spacingSize = computed(function () {
-      return props.showArrow ? '12px' : '2px';
-    });
-    var visible = ref(false);
-    var computedVisible = computed(function () {
-      return visible.value && (props.title || ctx.slots.content);
-    });
-    var onHover = function onHover() {
-      if (props.trigger === 'hover' || props.trigger === 'focus') {
-        timer.value = setTimeout(function () {
-          visible.value = true;
-        }, 600);
-      }
-    };
-    var onLeave = function onLeave() {
-      if (props.trigger === 'hover' || props.trigger === 'focus') {
-        clearTimeout(timer.value);
-        timer.value = setTimeout(function () {
-          visible.value = false;
-        }, 200);
-      }
-    };
-    var onClick = function onClick() {
-      if (props.trigger === 'click') {
-        visible.value = !visible.value;
-      }
-    };
-    var onClickOutside = function onClickOutside(e) {
-      var _contentElement$value, _targetElement$value;
-      if (props.closeOnClickOutside && e.target instanceof Node &&
-      // Check if the click happened inside the popover
-      !((_contentElement$value = contentElement.value) !== null && _contentElement$value !== void 0 && _contentElement$value.contains(e.target)) &&
-      // Check if the click happened inside the button
-      !((_targetElement$value = targetElement.value) !== null && _targetElement$value !== void 0 && _targetElement$value.contains(e.target))) {
-        visible.value = false;
-        ctx.emit('closed');
-      }
-    };
-    var autoCloseContent = function autoCloseContent(e) {
-      var _contentElement$value2;
-      if (props.closeOnClick && (_contentElement$value2 = contentElement.value) !== null && _contentElement$value2 !== void 0 && _contentElement$value2.contains(e.target)) {
-        visible.value = false;
-        ctx.emit('closed');
-      }
-    };
-    watchEffect(function () {
-      if (computedVisible.value) {
-        document.addEventListener('click', onClickOutside);
-      } else {
-        document.removeEventListener('click', onClickOutside);
-      }
-    });
-    onBeforeUnmount(function () {
-      return document.removeEventListener('click', onClickOutside);
-    });
-    var popper = ref(null);
-    var popperPlacement = computed(function () {
-      return props.placement;
-    });
-    var popperStrategy = computed(function () {
-      return props.position;
-    });
-    onMounted(function () {
-      if (targetElement.value && contentElement.value) {
-        popper.value = createPopper(targetElement.value, contentElement.value, {
-          placement: popperPlacement.value,
-          strategy: popperStrategy.value,
-          modifiers: [{
-            name: 'arrow',
-            options: {
-              padding: 5
-            }
-          }]
-        });
-      }
-    });
-    onUpdated( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-      return _regeneratorRuntime().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            if (!popper.value) {
-              _context.next = 3;
-              break;
-            }
-            _context.next = 3;
-            return popper.value.update();
-          case 3:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee);
-    })));
-    var contentElementId = uniqueId();
-    var setTargetElementAriaDescribedBy = function setTargetElementAriaDescribedBy() {
-      var _targetElement$value2;
-      var targetElementFirstChild = head((_targetElement$value2 = targetElement.value) === null || _targetElement$value2 === void 0 ? void 0 : _targetElement$value2.children);
-      if (targetElementFirstChild && targetElementFirstChild.getAttribute('aria-describedby') === null) {
-        targetElementFirstChild.setAttribute('aria-describedby', contentElementId);
-      }
-    };
-    onMounted(setTargetElementAriaDescribedBy);
-    watchEffect(setTargetElementAriaDescribedBy);
-    return {
-      targetElement: targetElement,
-      contentElement: contentElement,
-      contentElementId: contentElementId,
-      computedVisible: computedVisible,
-      onHover: onHover,
-      onClick: onClick,
-      onLeave: onLeave,
-      autoCloseContent: autoCloseContent,
-      visible: visible,
-      spacingSize: spacingSize
-    };
-  }
-});
-var __injectCSSVars__ = function __injectCSSVars__() {
-  useCssVars(function (_ctx) {
-    return {
-      "bf2f5546": _ctx.spacingSize
-    };
-  });
-};
-var __setup__ = __default__.setup;
-__default__.setup = __setup__ ? function (props, ctx) {
-  __injectCSSVars__();
-  return __setup__(props, ctx);
-} : __injectCSSVars__;
-
-var _withScopeId = function _withScopeId(n) {
-  return pushScopeId("data-v-6df01fae"), n = n(), popScopeId(), n;
-};
-var _hoisted_1 = ["id", "aria-hidden"];
-var _hoisted_2 = {
-  key: 0,
-  "data-popper-arrow": "",
-  "class": "fw-popover__arrow after:content-[''] after:bg-white after:border after:border-grey-light after:absolute"
-};
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("span", {
-    "class": normalizeClass(["fw-popover", _defineProperty(_defineProperty({
-      'fw-popover--visible': _ctx.computedVisible
-    }, "fw-popover--placement-".concat(_ctx.placement), !!_ctx.placement), 'fw-visibile-on-top', _ctx.showOnTop)])
-  }, [createElementVNode("div", {
-    "class": "fw-popover__target",
-    ref: "targetElement",
-    onMouseenter: _cache[0] || (_cache[0] = function () {
-      return _ctx.onHover && _ctx.onHover.apply(_ctx, arguments);
-    }),
-    onMouseleave: _cache[1] || (_cache[1] = function () {
-      return _ctx.onLeave && _ctx.onLeave.apply(_ctx, arguments);
-    }),
-    onClick: _cache[2] || (_cache[2] = function () {
-      return _ctx.onClick && _ctx.onClick.apply(_ctx, arguments);
-    }),
-    onFocusin: _cache[3] || (_cache[3] = function () {
-      return _ctx.onHover && _ctx.onHover.apply(_ctx, arguments);
-    }),
-    onFocusout: _cache[4] || (_cache[4] = function () {
-      return _ctx.onLeave && _ctx.onLeave.apply(_ctx, arguments);
-    })
-  }, [renderSlot(_ctx.$slots, "default")], 544), createElementVNode("span", {
-    id: _ctx.contentElementId,
-    "aria-hidden": !_ctx.computedVisible,
-    ref: "contentElement",
-    "class": normalizeClass(["fw-popover__content rounded bg-white border border-grey-light shadow-card pointer-events-none", _defineProperty({}, "fw-popover__content--".concat(_ctx.textAlign), !!_ctx.textAlign)]),
-    role: "popover",
-    onClick: _cache[5] || (_cache[5] = function () {
-      return _ctx.autoCloseContent && _ctx.autoCloseContent.apply(_ctx, arguments);
-    })
-  }, [renderSlot(_ctx.$slots, "content", {}, function () {
-    return [createTextVNode(toDisplayString(_ctx.title), 1)];
-  }), _ctx.showArrow ? (openBlock(), createElementBlock("span", _hoisted_2)) : createCommentVNode("", true)], 10, _hoisted_1)], 2);
-}
-
-var css_248z = ".fw-popover__content[data-v-6df01fae]{opacity:0;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease;white-space:normal;z-index:9999}.fw-popover__content--center[data-v-6df01fae]{text-align:center}.fw-popover__content--left[data-v-6df01fae]{text-align:left}.fw-popover__content--right[data-v-6df01fae]{text-align:right}.fw-popover--visible .fw-popover__content[data-v-6df01fae]{opacity:1;pointer-events:all}.fw-popover__arrow[data-v-6df01fae]:after{height:var(--bf2f5546);left:0;top:0;-webkit-transform:translate(-50%,-50%) rotate(45deg);-moz-transform:translate(-50%,-50%) rotate(45deg);-ms-transform:translate(-50%,-50%) rotate(45deg);transform:translate(-50%,-50%) rotate(45deg);width:var(--bf2f5546)}.fw-popover__content[data-popper-placement^=top][data-v-6df01fae]{margin-bottom:var(--bf2f5546)!important}.fw-popover__content[data-popper-placement^=right][data-v-6df01fae]{margin-left:var(--bf2f5546)!important}.fw-popover__content[data-popper-placement^=bottom][data-v-6df01fae]{margin-top:var(--bf2f5546)!important}.fw-popover__content[data-popper-placement^=left][data-v-6df01fae]{margin-right:var(--bf2f5546)!important}.fw-popover__content[data-popper-placement^=top] .fw-popover__arrow[data-v-6df01fae]{bottom:0}.fw-popover__content[data-popper-placement^=right] .fw-popover__arrow[data-v-6df01fae]{left:0}.fw-popover__content[data-popper-placement^=bottom] .fw-popover__arrow[data-v-6df01fae]{top:0}.fw-popover__content[data-popper-placement^=left] .fw-popover__arrow[data-v-6df01fae]{right:0}.fw-popover__content[data-popper-placement^=top] .fw-popover__arrow[data-v-6df01fae]{bottom:-1px}.fw-popover__content[data-popper-placement^=top] .fw-popover__arrow[data-v-6df01fae]:after{border-left:none;border-top:none}.fw-popover__content[data-popper-placement^=right] .fw-popover__arrow[data-v-6df01fae]{left:-1px}.fw-popover__content[data-popper-placement^=right] .fw-popover__arrow[data-v-6df01fae]:after{border-right:none;border-top:none}.fw-popover__content[data-popper-placement^=bottom] .fw-popover__arrow[data-v-6df01fae]{top:-1px}.fw-popover__content[data-popper-placement^=bottom] .fw-popover__arrow[data-v-6df01fae]:after{border-bottom:none;border-right:none}.fw-popover__content[data-popper-placement^=left] .fw-popover__arrow[data-v-6df01fae]{right:-1px}.fw-popover__content[data-popper-placement^=left] .fw-popover__arrow[data-v-6df01fae]:after{border-bottom:none;border-left:none}";
-var stylesheet = ".fw-popover__content[data-v-6df01fae]{opacity:0;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease;white-space:normal;z-index:9999}.fw-popover__content--center[data-v-6df01fae]{text-align:center}.fw-popover__content--left[data-v-6df01fae]{text-align:left}.fw-popover__content--right[data-v-6df01fae]{text-align:right}.fw-popover--visible .fw-popover__content[data-v-6df01fae]{opacity:1;pointer-events:all}.fw-popover__arrow[data-v-6df01fae]:after{height:var(--bf2f5546);left:0;top:0;-webkit-transform:translate(-50%,-50%) rotate(45deg);-moz-transform:translate(-50%,-50%) rotate(45deg);-ms-transform:translate(-50%,-50%) rotate(45deg);transform:translate(-50%,-50%) rotate(45deg);width:var(--bf2f5546)}.fw-popover__content[data-popper-placement^=top][data-v-6df01fae]{margin-bottom:var(--bf2f5546)!important}.fw-popover__content[data-popper-placement^=right][data-v-6df01fae]{margin-left:var(--bf2f5546)!important}.fw-popover__content[data-popper-placement^=bottom][data-v-6df01fae]{margin-top:var(--bf2f5546)!important}.fw-popover__content[data-popper-placement^=left][data-v-6df01fae]{margin-right:var(--bf2f5546)!important}.fw-popover__content[data-popper-placement^=top] .fw-popover__arrow[data-v-6df01fae]{bottom:0}.fw-popover__content[data-popper-placement^=right] .fw-popover__arrow[data-v-6df01fae]{left:0}.fw-popover__content[data-popper-placement^=bottom] .fw-popover__arrow[data-v-6df01fae]{top:0}.fw-popover__content[data-popper-placement^=left] .fw-popover__arrow[data-v-6df01fae]{right:0}.fw-popover__content[data-popper-placement^=top] .fw-popover__arrow[data-v-6df01fae]{bottom:-1px}.fw-popover__content[data-popper-placement^=top] .fw-popover__arrow[data-v-6df01fae]:after{border-left:none;border-top:none}.fw-popover__content[data-popper-placement^=right] .fw-popover__arrow[data-v-6df01fae]{left:-1px}.fw-popover__content[data-popper-placement^=right] .fw-popover__arrow[data-v-6df01fae]:after{border-right:none;border-top:none}.fw-popover__content[data-popper-placement^=bottom] .fw-popover__arrow[data-v-6df01fae]{top:-1px}.fw-popover__content[data-popper-placement^=bottom] .fw-popover__arrow[data-v-6df01fae]:after{border-bottom:none;border-right:none}.fw-popover__content[data-popper-placement^=left] .fw-popover__arrow[data-v-6df01fae]{right:-1px}.fw-popover__content[data-popper-placement^=left] .fw-popover__arrow[data-v-6df01fae]:after{border-bottom:none;border-left:none}";
-styleInject(css_248z);
-
-__default__.render = render;
-__default__.__scopeId = "data-v-6df01fae";
-
-export { __default__ as FwPopover };
+export { _ as FwPopover } from './fw-popover-B4bsfuxm.js';
+import './_rollupPluginBabelHelpers-DODWUb5N.js';
+import 'vue';
+import './index-BVcOAKar.js';
+import './uniqueId-DZdGzBh8.js';
+import './style-inject.es-tgCJW-Cu.js';

package/esm/fw-progress-bar.js

@@ -1,5 +1,5 @@
-import { defineComponent, resolveComponent, openBlock, createElementBlock, createElementVNode, Fragment, renderList, normalizeClass, createBlock, toDisplayString, normalizeStyle, createCommentVNode } from 'vue';
-import { r as render$1 } from './check--YD4Ts6g.js';
+import { defineComponent, resolveComponent, createElementBlock, openBlock, createElementVNode, Fragment, renderList, normalizeClass, createCommentVNode, createBlock, toDisplayString, normalizeStyle } from 'vue';
+import { b as render$1 } from './index-BsEH8YYr.js';
 
 var script = defineComponent({
   name: 'FwProgressBar',
@@ -75,6 +75,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       "class": normalizeClass(["w-[30px] h-[30px] mx-auto mb-2 flex items-center justify-center text-center rounded-full", step.position <= _ctx.activeStep ? 'bg-primary text-tertiary' : 'bg-grey-40 text-body'])
     }, [step.position < _ctx.activeStep ? (openBlock(), createBlock(_component_CheckSvg, {
       key: 0,
+      name: "check",
       "class": "w-[18px]"
     })) : (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(step.position), 1))], 2), createElementVNode("div", {
       "class": normalizeClass(["m-0 md:leading-tight text-sm md:text-base", {

package/esm/fw-provider-list.js

@@ -1,22 +1,20 @@
-import { e as _defineProperty } from './_rollupPluginBabelHelpers-DpC_oIQV.js';
-import { defineComponent, ref, computed, createElementVNode, resolveComponent, openBlock, createElementBlock, toDisplayString, createVNode, withCtx, createBlock, createCommentVNode, createTextVNode } from 'vue';
-import { _ as __default__, s as script$4, a as script$5 } from './fw-table-row-BetVCzHJ.js';
-import { s as script$1 } from './fw-input-XeI-IKly.js';
-import { _ as __default__$1 } from './fw-tag-V0jMl-It.js';
-import { s as script$3 } from './fw-button-DNozvo7B.js';
-import { s as script$2 } from './fw-dropdown-CbgOvgOt.js';
-import { i as render$1, j as render$2, k as render$3 } from './index-CzZMBMV_.js';
+import { e as _defineProperty } from './_rollupPluginBabelHelpers-DODWUb5N.js';
+import { defineComponent, ref, computed, useCssVars, createElementVNode, resolveComponent, createElementBlock, openBlock, toDisplayString, createVNode, withCtx, createBlock, createCommentVNode, createTextVNode } from 'vue';
+import { a as script, s as script$1, _ as __default__$4 } from './fw-table-row-C61Bi8KB.js';
+import { _ as __default__$3 } from './fw-input-C2-cZ-BY.js';
+import { _ as __default__$1 } from './fw-tag-FWH6KttB.js';
+import { s as script$2 } from './fw-button-CnQvA7oM.js';
+import { _ as __default__$2 } from './fw-dropdown-58wyuzsW.js';
+import { l as render$1, m as render$2, n as render$3 } from './index-BsEH8YYr.js';
+import { u as useColours } from './get-root-colours-DCjlYelc.js';
 import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
-import './get-root-colours-DYEoJPEb.js';
-import './fw-loading-bar-DThRjdw1.js';
-import './vee-validate.esm-3ptvCDR1.js';
-import './uniqueId-DK6xzFd8.js';
 import './fw-button.js';
-import './fw-loading-spinner-BFpFFRJm.js';
-import './fw-image-Dl96Dc27.js';
-import './check--YD4Ts6g.js';
+import './fw-loading.js';
+import './fw-loading-bar-DecYSBC_.js';
+import './vee-validate.esm-3ptvCDR1.js';
+import './fw-image-D-OHafdw.js';
 
-var script = defineComponent({
+var __default__ = defineComponent({
   name: 'FwProviderList',
   emits: [
   /**
@@ -24,16 +22,16 @@ var script = defineComponent({
    */
   'changed'],
   components: {
-    FwTable: __default__,
-    FwInput: script$1,
-    FwDropdown: script$2,
-    FwButton: script$3,
-    FwTableHead: script$4,
-    FwTableRow: script$5,
+    FwTable: __default__$4,
+    FwInput: __default__$3,
+    FwDropdown: __default__$2,
+    FwButton: script$2,
+    FwTableHead: script$1,
+    FwTableRow: script,
     FwTag: __default__$1,
-    SolidCheckSvg: render$1,
-    SolidXMarkSvg: render$2,
-    SearchSvg: render$3
+    SearchSvg: render$3,
+    SolidCheckSvg: render$2,
+    SolidXMarkSvg: render$1
   },
   props: {
     /**
@@ -125,14 +123,35 @@ var script = defineComponent({
       ctx.emit('changed', sortedItems.length);
       return sortedItems;
     });
+    var _useColours = useColours(),
+      primaryFade5 = _useColours.primaryFade5,
+      primaryFade20 = _useColours.primaryFade20,
+      primaryFade40 = _useColours.primaryFade40;
     return {
       options: options,
       sortedTableItems: sortedTableItems,
       searchFilterModel: searchFilterModel,
-      statusFilterModel: statusFilterModel
+      statusFilterModel: statusFilterModel,
+      primaryFade5: primaryFade5,
+      primaryFade20: primaryFade20,
+      primaryFade40: primaryFade40
     };
   }
 });
+var __injectCSSVars__ = function __injectCSSVars__() {
+  useCssVars(function (_ctx) {
+    return {
+      "9bf5c9b4": _ctx.primaryFade5,
+      "e2c36d26": _ctx.primaryFade20,
+      "e2c36caa": _ctx.primaryFade40
+    };
+  });
+};
+var __setup__ = __default__.setup;
+__default__.setup = __setup__ ? function (props, ctx) {
+  __injectCSSVars__();
+  return __setup__(props, ctx);
+} : __injectCSSVars__;
 
 var _hoisted_1 = {
   "class": "fw-provider-list flex flex-col w-full space-y-4"
@@ -148,7 +167,7 @@ var _hoisted_4 = {
 };
 var _hoisted_5 = {
   key: 0,
-  "class": "fw-provider-list--table w-full shadow-card"
+  "class": "fw-provider-list--table w-full rounded"
 };
 var _hoisted_6 = {
   key: 1
@@ -184,7 +203,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   }, {
     prefix: withCtx(function () {
       return [createVNode(_component_SearchSvg, {
-        "class": "text-primary w-5 h-5"
+        name: "search",
+        "class": "text-body w-5 h-5"
       })];
     }),
     suffix: withCtx(function () {
@@ -199,7 +219,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         rounded: ""
       }, {
         "default": withCtx(function () {
-          return [createVNode(_component_SolidXMarkSvg)];
+          return [createVNode(_component_SolidXMarkSvg, {
+            name: "solid-xmark"
+          })];
         }),
         _: 1
       })) : createCommentVNode("", true)];
@@ -225,7 +247,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       value: 'supported'
     }]
   }, null, 8, ["modelValue", "label"])])]), _ctx.sortedTableItems && _ctx.sortedTableItems.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_5, [createVNode(_component_FwTable, {
-    "class": "w-full min-w-max bg-grey-20",
+    "class": "w-full",
     items: _ctx.sortedTableItems,
     options: _ctx.options
   }, {
@@ -252,6 +274,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           }, {
             "default": withCtx(function () {
               return [createVNode(_component_SolidXMarkSvg, {
+                name: "solid-xmark",
                 "class": "w-4 h-4 mr-1"
               }), createTextVNode("Outage ")];
             }),
@@ -263,6 +286,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           }, {
             "default": withCtx(function () {
               return [createVNode(_component_SolidCheckSvg, {
+                name: "solid-check",
                 "class": "w-4 h-4 mr-1"
               }), createTextVNode(" Available ")];
             }),
@@ -276,10 +300,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   }, 8, ["items", "options"])])) : (openBlock(), createElementBlock("div", _hoisted_6, _hoisted_8))]);
 }
 
-var css_248z = ".fw-provider-list--table{overflow-x:auto}.fw-provider-list--table::-webkit-scrollbar{-webkit-appearance:none;height:8px}.fw-provider-list--table::-webkit-scrollbar-track{--tw-bg-opacity:1;background-color:rgb(228 228 228/var(--tw-bg-opacity));border-radius:12px}.fw-provider-list--table::-webkit-scrollbar-thumb{--tw-bg-opacity:1;background-color:rgb(75 75 75/var(--tw-bg-opacity));border-radius:12px;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.fw-provider-list--table::-webkit-scrollbar-thumb:hover{background-color:var(--colorBody);cursor:pointer}";
-var stylesheet = ".fw-provider-list--table{overflow-x:auto}.fw-provider-list--table::-webkit-scrollbar{-webkit-appearance:none;height:8px}.fw-provider-list--table::-webkit-scrollbar-track{--tw-bg-opacity:1;background-color:rgb(228 228 228/var(--tw-bg-opacity));border-radius:12px}.fw-provider-list--table::-webkit-scrollbar-thumb{--tw-bg-opacity:1;background-color:rgb(75 75 75/var(--tw-bg-opacity));border-radius:12px;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.fw-provider-list--table::-webkit-scrollbar-thumb:hover{background-color:var(--colorBody);cursor:pointer}";
+var css_248z = ".fw-provider-list--table{background-color:var(--9bf5c9b4);overflow-x:auto}.fw-provider-list--table::-webkit-scrollbar{-webkit-appearance:none;height:8px}.fw-provider-list--table::-webkit-scrollbar-track{background-color:var(--e2c36d26);border-radius:12px}.fw-provider-list--table::-webkit-scrollbar-thumb{background-color:var(--e2c36caa);border-radius:12px;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.fw-provider-list--table::-webkit-scrollbar-thumb:hover{background-color:var(--colorBody);cursor:pointer}";
+var stylesheet = ".fw-provider-list--table{background-color:var(--9bf5c9b4);overflow-x:auto}.fw-provider-list--table::-webkit-scrollbar{-webkit-appearance:none;height:8px}.fw-provider-list--table::-webkit-scrollbar-track{background-color:var(--e2c36d26);border-radius:12px}.fw-provider-list--table::-webkit-scrollbar-thumb{background-color:var(--e2c36caa);border-radius:12px;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.fw-provider-list--table::-webkit-scrollbar-thumb:hover{background-color:var(--colorBody);cursor:pointer}";
 styleInject(css_248z);
 
-script.render = render;
+__default__.render = render;
 
-export { script as FwProviderList };
+export { __default__ as FwProviderList };

package/esm/fw-sidebar-menu.js

@@ -1,9 +1,7 @@
-import { defineComponent, computed, resolveComponent, openBlock, createElementBlock, normalizeClass, createVNode, withCtx, Transition, withDirectives, createElementVNode, renderSlot, createCommentVNode, Fragment, renderList, createBlock, createTextVNode, toDisplayString, vShow } from 'vue';
-import { s as script$1 } from './fw-button-DNozvo7B.js';
-import { l as render$1 } from './index-CzZMBMV_.js';
+import { defineComponent, computed, resolveComponent, createElementBlock, createCommentVNode, openBlock, normalizeClass, createVNode, withCtx, Transition, withDirectives, createElementVNode, renderSlot, Fragment, renderList, createBlock, createTextVNode, toDisplayString, vShow } from 'vue';
+import { s as script$1 } from './fw-button-CnQvA7oM.js';
+import { o as render$1 } from './index-BsEH8YYr.js';
 import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
-import './fw-loading-spinner-BFpFFRJm.js';
-import './check--YD4Ts6g.js';
 
 var script = defineComponent({
   name: 'FwSidebarMenu',
@@ -47,10 +45,20 @@ var script = defineComponent({
     closedWidth: {
       type: String,
       "default": 'w-6'
+    },
+    /**
+     * The button variant of the toggle button
+     */
+    toggleButtonVariant: {
+      type: String,
+      "default": 'secondary',
+      validator: function validator(value) {
+        return ['primary', 'secondary', 'tertiary', 'quaternary', 'error', 'success', 'link', 'text', 'transparent', 'gradient'].includes(value);
+      }
     }
   },
   setup: function setup(props, ctx) {
-    var baseClass = "h-full shadow-md bg-grey-lightest border-r border-grey-20 \n      fixed top-0 left-0 transition-all duration-300";
+    var baseClass = "h-full shadow-md border-r border-grey-20 \n      fixed top-0 left-0 transition-all duration-300";
     var isMenuOpen = computed({
       get: function get() {
         return props.modelValue;
@@ -90,7 +98,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     "class": normalizeClass(["fw-sidebar-menu", [_ctx.baseClass, _ctx.isMenuOpen ? _ctx.openWidth : _ctx.closedWidth]]),
     "aria-label": "Aside navigation menu"
   }, [createVNode(_component_FwButton, {
-    variant: "primary",
+    variant: _ctx.toggleButtonVariant,
     tabindex: "",
     title: _ctx.isMenuOpen ? 'Close sidebar navigation menu' : 'Open sidebar navigation menu',
     onClick: _cache[0] || (_cache[0] = function ($event) {
@@ -100,11 +108,12 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   }, {
     "default": withCtx(function () {
       return [createVNode(_component_ChevronRightSvg, {
-        "class": normalizeClass(["w-6 h-6 inline-block m-0 transition-rotate duration-200", _ctx.isMenuOpen ? 'rotate-180' : ''])
+        name: "chevron-right",
+        "class": normalizeClass(["size-6 inline-block m-0 transition-rotate duration-200", _ctx.isMenuOpen ? 'rotate-180' : ''])
       }, null, 8, ["class"])];
     }),
     _: 1
-  }, 8, ["title", "class"]), createVNode(Transition, {
+  }, 8, ["variant", "title", "class"]), createVNode(Transition, {
     name: "sidebarMenuSlide"
   }, {
     "default": withCtx(function () {
@@ -114,8 +123,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         }, [!item.disabled ? (openBlock(), createBlock(_component_FwButton, {
           key: 0,
           rounded: false,
-          "class": "!text-left !px-4 text-grey-base",
-          variant: "transparent",
+          "class": "!text-left !px-4 bg-transparent border-none !no-underline hover:!bg-brand-bg4 focus:bg-brand-bg4",
+          variant: "quaternary",
           href: item.href,
           to: item.to,
           external: item.external,
@@ -134,8 +143,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   })], 2)) : createCommentVNode("", true);
 }
 
-var css_248z = ".sidebarMenuSlide-enter-active{-webkit-transition:all .6s ease-in;-moz-transition:all .6s ease-in;transition:all .6s ease-in}.sidebarMenuSlide-leave-active{-webkit-transition:opacity 10ms ease-in;-moz-transition:opacity 10ms ease-in;transition:opacity 10ms ease-in}.sidebarMenuSlide-enter-from,.sidebarMenuSlide-leave-to{opacity:0}.sidebarMenuSlide-enter-to,.sidebarMenuSlide-leave-from{opacity:1}";
-var stylesheet = ".sidebarMenuSlide-enter-active{-webkit-transition:all .6s ease-in;-moz-transition:all .6s ease-in;transition:all .6s ease-in}.sidebarMenuSlide-leave-active{-webkit-transition:opacity 10ms ease-in;-moz-transition:opacity 10ms ease-in;transition:opacity 10ms ease-in}.sidebarMenuSlide-enter-from,.sidebarMenuSlide-leave-to{opacity:0}.sidebarMenuSlide-enter-to,.sidebarMenuSlide-leave-from{opacity:1}";
+var css_248z = ".sidebarMenuSlide-enter-active{-webkit-transition:all .6s ease-in;-moz-transition:all .6s ease-in;transition:all .6s ease-in}.sidebarMenuSlide-leave-active{-webkit-transition:opacity 10ms ease-in;-moz-transition:opacity 10ms ease-in;transition:opacity 10ms ease-in}.sidebarMenuSlide-enter-from,.sidebarMenuSlide-leave-to{opacity:0}.sidebarMenuSlide-enter-to,.sidebarMenuSlide-leave-from{opacity:1}.fw-sidebar-menu .fw-button--quaternary.router-link-active{background-color:var(--colorBg4)}";
+var stylesheet = ".sidebarMenuSlide-enter-active{-webkit-transition:all .6s ease-in;-moz-transition:all .6s ease-in;transition:all .6s ease-in}.sidebarMenuSlide-leave-active{-webkit-transition:opacity 10ms ease-in;-moz-transition:opacity 10ms ease-in;transition:opacity 10ms ease-in}.sidebarMenuSlide-enter-from,.sidebarMenuSlide-leave-to{opacity:0}.sidebarMenuSlide-enter-to,.sidebarMenuSlide-leave-from{opacity:1}.fw-sidebar-menu .fw-button--quaternary.router-link-active{background-color:var(--colorBg4)}";
 styleInject(css_248z);
 
 script.render = render;

package/esm/fw-slider.js

@@ -1,5 +1,5 @@
-import { a as _slicedToArray } from './_rollupPluginBabelHelpers-DpC_oIQV.js';
-import { defineComponent, computed, watch, openBlock, createElementBlock, createElementVNode, normalizeStyle, toDisplayString, withDirectives, vModelText } from 'vue';
+import { a as _slicedToArray } from './_rollupPluginBabelHelpers-DODWUb5N.js';
+import { defineComponent, computed, watch, createElementBlock, openBlock, createElementVNode, withDirectives, normalizeStyle, toDisplayString, vModelText } from 'vue';
 import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
 
 var script = defineComponent({
@@ -109,9 +109,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       left: "".concat(_ctx.maxPercentage, "%")
     })
   }, toDisplayString(_ctx.maximumValue) + "% ", 5), createElementVNode("div", {
-    "class": "h-1.5 rounded-full bg-grey-base-light [--fill:var(--colorButtonPrimary)]",
+    "class": "h-1.5 rounded-full bg-white shadow-card [--fill:var(--colorButtonPrimary)]",
     style: normalizeStyle({
-      background: "linear-gradient(to right,\n          var(--track, #e5e7eb) 0%,\n          var(--track, #e5e7eb) ".concat(_ctx.minPercentage, "%,\n          var(--fill) ").concat(_ctx.minPercentage, "%,\n          var(--fill) ").concat(_ctx.maxPercentage, "%,\n          var(--track, #e5e7eb) ").concat(_ctx.maxPercentage, "%,\n          var(--track, #e5e7eb) 100%)")
+      background: "linear-gradient(to right,\n          var(--track, #ffffff) 0%,\n          var(--track, #ffffff) ".concat(_ctx.minPercentage, "%,\n          var(--fill) ").concat(_ctx.minPercentage, "%,\n          var(--fill) ").concat(_ctx.maxPercentage, "%,\n          var(--track, #ffffff) ").concat(_ctx.maxPercentage, "%,\n          var(--track, #ffffff) 100%)")
     })
   }, null, 4), withDirectives(createElementVNode("input", {
     "class": "fw-slider absolute inset-0 w-full appearance-none bg-transparent pointer-events-none focus:outline-none",