@frollo/frollo-web-ui 8.5.4 → 9.0.0

package/esm/fw-toast.js

@@ -1,17 +1,15 @@
-import { defineComponent, ref, computed, onMounted, watchEffect, openBlock, createElementBlock, Fragment, createBlock, Teleport, createVNode, TransitionGroup, createCommentVNode, Transition, withCtx, normalizeClass, createElementVNode, resolveDynamicComponent, renderSlot } from 'vue';
-import { u as uniqueId } from './uniqueId-DK6xzFd8.js';
-import { i as render$1, j as render$2, p as render$3 } from './index-CzZMBMV_.js';
+import { defineComponent, ref, computed, onMounted, watchEffect, createElementBlock, openBlock, Fragment, createBlock, createCommentVNode, Teleport, createVNode, TransitionGroup, Transition, withCtx, normalizeClass, createElementVNode, renderSlot, resolveDynamicComponent } from 'vue';
+import { u as uniqueId } from './uniqueId-DZdGzBh8.js';
+import { t as render$1, l as render$2, m as render$3 } from './index-BsEH8YYr.js';
 import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
-import './check--YD4Ts6g.js';
 
 var script = defineComponent({
   name: 'FwToast',
   components: {
-    SolidCheckSvg: render$1,
+    SolidCheckSvg: render$3,
     SolidXMarkSvg: render$2,
-    ErrorFilledSvg: render$3
+    ErrorFilledSvg: render$1
   },
-  emits: ['update:modelValue', 'dismissed'],
   props: {
     /**
      * The toast's v-model. Controls the visibility of the toast.
@@ -62,6 +60,7 @@ var script = defineComponent({
       "default": 3500
     }
   },
+  emits: ['update:modelValue', 'dismissed'],
   setup: function setup(props, ctx) {
     var isMounted = ref(false);
     var uuid = uniqueId();
@@ -91,9 +90,9 @@ var script = defineComponent({
     });
     var baseClass = "text-white flex min-w-[70%] max-w-[90%] md:min-w-[320px] md:max-w-[600px]\n     py-3.5 px-6";
     var typeClasses = ref({
-      success: 'bg-success',
-      error: 'bg-error',
-      warning: 'bg-alert'
+      success: 'bg-brand-success-text',
+      error: 'bg-brand-error-text',
+      warning: 'bg-brand-warning-text'
     });
     var svgComponent = ref({
       success: 'SolidCheckSvg',
@@ -119,7 +118,7 @@ var script = defineComponent({
           transform: 'translateY(0)'
         }], {
           duration: 400,
-          easing: 'ease'
+          easing: 'ease-in'
         });
       }
       isMounted.value = true;
@@ -156,10 +155,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     key: 0,
     to: _ctx.element
   }, [createVNode(TransitionGroup, {
+    id: _ctx.containerEl,
     name: "toastAnimate",
     tag: "div",
     appear: "",
-    id: _ctx.containerEl,
     "class": "fw-toast--container"
   }, null, 8, ["id"])], 8, ["to"])) : createCommentVNode("", true), _ctx.isMounted ? (openBlock(), createBlock(Teleport, {
     key: 1,
@@ -170,10 +169,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   }, {
     "default": withCtx(function () {
       return [_ctx.isOpen.value ? (openBlock(), createElementBlock("output", {
-        role: "status",
-        "class": normalizeClass(["fw-toast shadow rounded", [_ctx.baseClass, _ctx.typeClasses[_ctx.type]]]),
         id: "fw-toast-".concat(_ctx.uuid),
-        key: "fw-toast-".concat(_ctx.uuid)
+        key: "fw-toast-".concat(_ctx.uuid),
+        role: "status",
+        "class": normalizeClass(["fw-toast shadow rounded", [_ctx.baseClass, _ctx.typeClasses[_ctx.type]]])
       }, [createElementVNode("div", _hoisted_2, [(openBlock(), createBlock(resolveDynamicComponent(_ctx.svgComponent[_ctx.type]), {
         "aria-hidden": "true",
         "class": "text-white min-w-[24px] min-h-[24px] w-[24px] h-[24px]"

package/esm/fw-transactions-card.js

@@ -1,16 +1,16 @@
-import { defineComponent, createElementVNode, resolveComponent, openBlock, createBlock, withCtx, createCommentVNode, toDisplayString, createElementBlock } from 'vue';
-import { s as script$1 } from './fw-card-bsYbpPmW.js';
-import { s as script$2 } from './fw-image-Dl96Dc27.js';
-import './fw-loading-bar-DThRjdw1.js';
+import { defineComponent, createElementVNode, resolveComponent, createBlock, openBlock, withCtx, createCommentVNode, createElementBlock, toDisplayString } from 'vue';
+import { _ as __default__$1 } from './fw-card-D45R4kN-.js';
+import { _ as __default__ } from './fw-image-D-OHafdw.js';
+import './get-root-colours-DCjlYelc.js';
 import './style-inject.es-tgCJW-Cu.js';
-import './index-CzZMBMV_.js';
-import './check--YD4Ts6g.js';
+import './fw-loading-bar-DecYSBC_.js';
+import './index-BsEH8YYr.js';
 
 var script = defineComponent({
   name: 'FwTransactionsCard',
   components: {
-    FwCard: script$1,
-    FwImage: script$2
+    FwCard: __default__$1,
+    FwImage: __default__
   },
   props: {
     /**

package/esm/get-root-colours-DCjlYelc.js

@@ -0,0 +1,62 @@
+var getHexWithOpacity = function getHexWithOpacity(hexColor, fadePercentage) {
+  var transparencyValues = {
+    fade5: '0d',
+    fade10: '1a',
+    fade20: '33',
+    fade30: '4d',
+    fade40: '66',
+    fade50: '80',
+    fade60: '99',
+    fade70: 'b3',
+    fade80: 'cc',
+    fade90: 'e6',
+    fade95: 'f2',
+    fade100: '00'
+  };
+  var calculatedPercentage = "fade".concat(fadePercentage.toString());
+  var transparency = transparencyValues[calculatedPercentage];
+  return "".concat(hexColor).concat(transparency);
+};
+var useColours = function useColours() {
+  var style = getComputedStyle(document.body);
+  var colorPrimary = style.getPropertyValue('--colorPrimary');
+  var colorSecondary = style.getPropertyValue('--colorSecondary');
+  var colorTertiary = style.getPropertyValue('--colorTertiary');
+  var fontFamily = style.getPropertyValue('--fontFamily');
+  var colorBody = style.getPropertyValue('--colorBody');
+  var colorBrandBg1 = style.getPropertyValue('--colorBg1');
+  var colorErrorText = style.getPropertyValue('--colorErrorText');
+  var primaryFade5 = getHexWithOpacity(colorPrimary, 5);
+  var primaryFade10 = getHexWithOpacity(colorPrimary, 10);
+  var primaryFade20 = getHexWithOpacity(colorPrimary, 20);
+  var primaryFade30 = getHexWithOpacity(colorPrimary, 30);
+  var primaryFade40 = getHexWithOpacity(colorPrimary, 40);
+  var primaryFade50 = getHexWithOpacity(colorPrimary, 50);
+  var primaryFade60 = getHexWithOpacity(colorPrimary, 60);
+  var primaryFade70 = getHexWithOpacity(colorPrimary, 70);
+  var primaryFade80 = getHexWithOpacity(colorPrimary, 80);
+  var primaryFade90 = getHexWithOpacity(colorPrimary, 90);
+  var brandBg1Fade95 = getHexWithOpacity(colorBrandBg1, 95);
+  var colorErrorTextFade5 = getHexWithOpacity(colorErrorText, 5);
+  return {
+    colorPrimary: colorPrimary,
+    colorSecondary: colorSecondary,
+    colorTertiary: colorTertiary,
+    fontFamily: fontFamily,
+    colorBody: colorBody,
+    primaryFade5: primaryFade5,
+    primaryFade10: primaryFade10,
+    primaryFade20: primaryFade20,
+    primaryFade30: primaryFade30,
+    primaryFade40: primaryFade40,
+    primaryFade50: primaryFade50,
+    primaryFade60: primaryFade60,
+    primaryFade70: primaryFade70,
+    primaryFade80: primaryFade80,
+    primaryFade90: primaryFade90,
+    brandBg1Fade95: brandBg1Fade95,
+    colorErrorTextFade5: colorErrorTextFade5
+  };
+};
+
+export { getHexWithOpacity as g, useColours as u };