@apify/ui-library 1.100.0 → 1.100.2

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@apify/ui-library",
-    "version": "1.100.0",
+    "version": "1.100.2",
     "description": "React UI library used by apify.com",
     "license": "Apache-2.0",
     "type": "module",
@@ -26,7 +26,7 @@
         "It's not nice, but helps us to get around the problem of multiple react instances."
     ],
     "dependencies": {
-        "@apify/ui-icons": "^1.19.0",
+        "@apify/ui-icons": "^1.20.0",
         "@floating-ui/react": "^0.26.2",
         "@react-hook/resize-observer": "^2.0.2",
         "clsx": "^2.0.0",
@@ -64,5 +64,5 @@
         "src",
         "style"
     ],
-    "gitHead": "8773d9462fbe733c88199f30130ed557f676f07d"
+    "gitHead": "b3e6eee6f7abcd8ef155cd0662caba7301b187b1"
 }

package/src/design_system/colors/build_color_tokens.js

@@ -113,7 +113,7 @@ async function buildTheme(theme) {
     // Select only tokens for theme colors (Decorative and Palette)
     StyleDictionary.registerFilter({
         name: 'only-theme',
-        filter: (token) => ['Decorative', 'Palette'].includes(token.path[0]),
+        filter: (token) => ['Decorative', 'Palette', 'Brand'].includes(token.path[0]),
     });
 
     const styleDictionary = await (new StyleDictionary()).extend({

package/src/design_system/colors/figma_color_tokens.dark.json

@@ -435,167 +435,115 @@
       }
     }
   },
-  "Decorative": {
-    "Rose": {
-      "Light": {
-        "$type": "color",
-        "$value": "#e88bb3"
-      },
-      "Base": {
-        "$type": "color",
-        "$value": "#b8487b"
-      },
-      "Dark": {
-        "$type": "color",
-        "$value": "#6f234f"
-      },
-      "Text": {
-        "$type": "color",
-        "$value": "#ed8bb5"
-      }
-    },
-    "Buttercup": {
-      "Light": {
+  "Brand": {
+    "Magenta": {
+      "Deep": {
         "$type": "color",
-        "$value": "#f9deaa"
+        "$value": "#694d6b"
       },
-      "Base": {
+      "Main": {
         "$type": "color",
-        "$value": "#e5b557"
+        "$value": "#9d829f"
       },
-      "Dark": {
+      "Tint": {
         "$type": "color",
-        "$value": "#b87939"
+        "$value": "#fef3ff"
       },
-      "Text": {
+      "Accent": {
         "$type": "color",
-        "$value": "#ebbf6c"
+        "$value": "#ff64b8"
       }
     },
-    "Paprika": {
-      "Light": {
+    "Mondo": {
+      "Deep": {
         "$type": "color",
-        "$value": "#e26c7d"
+        "$value": "#ff4800"
       },
-      "Base": {
+      "Main": {
         "$type": "color",
-        "$value": "#9e384b"
+        "$value": "#b94013"
       },
-      "Dark": {
+      "Medium": {
         "$type": "color",
-        "$value": "#511d27"
+        "$value": "#d4673f"
       },
-      "Text": {
+      "Muted": {
         "$type": "color",
-        "$value": "#f67c8d"
-      }
-    },
-    "Teal": {
-      "Light": {
-        "$type": "color",
-        "$value": "#aef0f5"
+        "$value": "#db8663"
       },
-      "Base": {
+      "Subtle": {
         "$type": "color",
-        "$value": "#58bcc4"
+        "$value": "#f3b390"
       },
-      "Dark": {
+      "Tint": {
         "$type": "color",
-        "$value": "#408288"
+        "$value": "#fcdece"
       },
-      "Text": {
+      "Accent": {
         "$type": "color",
-        "$value": "#62c1c8"
+        "$value": "#4e4236"
       }
     },
-    "Indigo": {
-      "Light": {
+    "Lime": {
+      "Deep": {
         "$type": "color",
-        "$value": "#a8b7ed"
+        "$value": "#756506"
       },
-      "Base": {
+      "Main": {
         "$type": "color",
-        "$value": "#6d85ca"
-      },
-      "Dark": {
-        "$type": "color",
-        "$value": "#425484"
-      },
-      "Text": {
-        "$type": "color",
-        "$value": "#a2b2eb"
-      }
-    },
-    "Slate": {
-      "Light": {
-        "$type": "color",
-        "$value": "#c2c5dc"
+        "$value": "#968108"
       },
-      "Base": {
+      "Medium": {
         "$type": "color",
-        "$value": "#8690bf"
+        "$value": "#c69f3d"
       },
-      "Dark": {
+      "Tint": {
         "$type": "color",
-        "$value": "#535c81"
+        "$value": "#e8e3b5"
       },
-      "Text": {
+      "Accent": {
         "$type": "color",
-        "$value": "#afb2c9"
+        "$value": "#ffff5a"
       }
     },
-    "Coral": {
-      "Light": {
+    "Meteorite": {
+      "Deep": {
         "$type": "color",
-        "$value": "#f3ccb0"
+        "$value": "#321868"
       },
-      "Base": {
-        "$type": "color",
-        "$value": "#f08848"
-      },
-      "Dark": {
+      "Main": {
         "$type": "color",
-        "$value": "#9a4e2d"
+        "$value": "#6759e6"
       },
-      "Text": {
-        "$type": "color",
-        "$value": "#f9b27b"
-      }
-    },
-    "Lavender": {
-      "Light": {
+      "Medium": {
         "$type": "color",
-        "$value": "#b482ed"
+        "$value": "#bcb8ee"
       },
-      "Base": {
+      "Accent": {
         "$type": "color",
-        "$value": "#8148c9"
+        "$value": "#38fb9d"
       },
-      "Dark": {
+      "Muted": {
         "$type": "color",
-        "$value": "#48296f"
+        "$value": "#a4ffd3"
       },
-      "Text": {
+      "Tint": {
         "$type": "color",
-        "$value": "#be8af9"
+        "$value": "#dffff0"
       }
     },
-    "Bamboo": {
-      "Light": {
-        "$type": "color",
-        "$value": "#7acaa9"
-      },
-      "Base": {
+    "Logo": {
+      "Orange": {
         "$type": "color",
-        "$value": "#439274"
+        "$value": "#f86606"
       },
-      "Dark": {
+      "Green": {
         "$type": "color",
-        "$value": "#305b4a"
+        "$value": "#20a34e"
       },
-      "Text": {
+      "Blue": {
         "$type": "color",
-        "$value": "#65bc99"
+        "$value": "#246dff"
       }
     }
   },
@@ -882,5 +830,169 @@
         "$value": "#151d34"
       }
     }
+  },
+  "Decorative": {
+    "Rose": {
+      "Light": {
+        "$type": "color",
+        "$value": "#e88bb3"
+      },
+      "Base": {
+        "$type": "color",
+        "$value": "#b8487b"
+      },
+      "Dark": {
+        "$type": "color",
+        "$value": "#6f234f"
+      },
+      "Text": {
+        "$type": "color",
+        "$value": "#ed8bb5"
+      }
+    },
+    "Buttercup": {
+      "Light": {
+        "$type": "color",
+        "$value": "#f9deaa"
+      },
+      "Base": {
+        "$type": "color",
+        "$value": "#e5b557"
+      },
+      "Dark": {
+        "$type": "color",
+        "$value": "#b87939"
+      },
+      "Text": {
+        "$type": "color",
+        "$value": "#ebbf6c"
+      }
+    },
+    "Paprika": {
+      "Light": {
+        "$type": "color",
+        "$value": "#e26c7d"
+      },
+      "Base": {
+        "$type": "color",
+        "$value": "#9e384b"
+      },
+      "Dark": {
+        "$type": "color",
+        "$value": "#511d27"
+      },
+      "Text": {
+        "$type": "color",
+        "$value": "#f67c8d"
+      }
+    },
+    "Teal": {
+      "Light": {
+        "$type": "color",
+        "$value": "#aef0f5"
+      },
+      "Base": {
+        "$type": "color",
+        "$value": "#58bcc4"
+      },
+      "Dark": {
+        "$type": "color",
+        "$value": "#408288"
+      },
+      "Text": {
+        "$type": "color",
+        "$value": "#62c1c8"
+      }
+    },
+    "Indigo": {
+      "Light": {
+        "$type": "color",
+        "$value": "#a8b7ed"
+      },
+      "Base": {
+        "$type": "color",
+        "$value": "#6d85ca"
+      },
+      "Dark": {
+        "$type": "color",
+        "$value": "#425484"
+      },
+      "Text": {
+        "$type": "color",
+        "$value": "#a2b2eb"
+      }
+    },
+    "Slate": {
+      "Light": {
+        "$type": "color",
+        "$value": "#c2c5dc"
+      },
+      "Base": {
+        "$type": "color",
+        "$value": "#8690bf"
+      },
+      "Dark": {
+        "$type": "color",
+        "$value": "#535c81"
+      },
+      "Text": {
+        "$type": "color",
+        "$value": "#afb2c9"
+      }
+    },
+    "Coral": {
+      "Light": {
+        "$type": "color",
+        "$value": "#f3ccb0"
+      },
+      "Base": {
+        "$type": "color",
+        "$value": "#f08848"
+      },
+      "Dark": {
+        "$type": "color",
+        "$value": "#9a4e2d"
+      },
+      "Text": {
+        "$type": "color",
+        "$value": "#f9b27b"
+      }
+    },
+    "Lavender": {
+      "Light": {
+        "$type": "color",
+        "$value": "#b482ed"
+      },
+      "Base": {
+        "$type": "color",
+        "$value": "#8148c9"
+      },
+      "Dark": {
+        "$type": "color",
+        "$value": "#48296f"
+      },
+      "Text": {
+        "$type": "color",
+        "$value": "#be8af9"
+      }
+    },
+    "Bamboo": {
+      "Light": {
+        "$type": "color",
+        "$value": "#7acaa9"
+      },
+      "Base": {
+        "$type": "color",
+        "$value": "#439274"
+      },
+      "Dark": {
+        "$type": "color",
+        "$value": "#305b4a"
+      },
+      "Text": {
+        "$type": "color",
+        "$value": "#65bc99"
+      }
+    }
   }
 }