[FEAT]: Add completesureColor and default color for font

src/files-ui/core/color/colors.ts

@@ -5,7 +5,7 @@ import { NAMED_COLORS } from "./namedColors";
  * @param colorInput 
  * @returns the darked color in
  */
- export const darkerColor = (colorInput: string, percentage = 25): string => {
+export const darkerColor = (colorInput: string, percentage = 25): string => {
     let darkedColor = "";
     const reduce = (100 - percentage) / 100;
     let component1: number = 0;
@@ -206,11 +206,26 @@ export const hexTodec = (letter: string): number => {
  * @param color param color given by user
  * @returns returns the same color 
  */
- export const asureColor = (color?: string): string => {
+export const asureColor = (color?: string): string => {
     if (color !== undefined && color !== "") {
         return color;
     } else {
-        return "#646c7f";
+        return DEFAULT_FONT_COLOR;
     }
 }
+/** 
+ * Asure a base color. When not given or when given an incorrect color format
+ * default color is this kind of grey #5d6475
+ * 
+ * @param color param color given by user
+ * @returns returns the same color 
+ */
+export const completeAsureColor = (color?: string, perc = 1): string => {
+
+    return hexColorToRGB(asureColor(colourNameToHex(color)), perc);
+
+}
+
+
 
+export const DEFAULT_FONT_COLOR = "#646c7f";
\ No newline at end of file

src/files-ui/core/color/index.ts

@@ -6,5 +6,6 @@ export {
     darkerColor,
     hexColorToRGB,
     hexTodec,
-    isHexColor
+    isHexColor,
+    completeAsureColor
 } from "./colors";
\ No newline at end of file

src/files-ui/core/index.ts

@@ -163,7 +163,8 @@ export {
     hexColorToRGB,
     hexTodec,
     isHexColor,
-    NAMED_COLORS
+    NAMED_COLORS,
+    completeAsureColor
 } from "./color";
 
 export {

src/files-ui/core/ripple/ripple.ts

-import { asureColor, colourNameToHex, hexColorToRGB } from "../color";
+import { completeAsureColor, hexColorToRGB } from "../color";
 
 const asureRippleColor = (color: string): string => {
-  return hexColorToRGB(
-    asureColor(colourNameToHex(color)),
+  return completeAsureColor(color,
     0.4
   );
 }
@@ -69,10 +68,7 @@ export function createRippleButton<
   circle.classList.add("ripple");
 
   if (variant !== "contained") {
-    circle.style.backgroundColor = hexColorToRGB(
-      asureColor(colourNameToHex(color)),
-      0.4
-    );
+    circle.style.backgroundColor = asureRippleColor(color);
   } else {
 
     circle.style.backgroundColor = hexColorToRGB("#ffffff", 0.4);