fontsource V5

Author: cedric07

package.json

@@ -14,7 +14,7 @@
   },
   "license": "GPL-2.0",
   "dependencies": {
-    "@fontsource/poppins": "^4.5.10",
+    "@fontsource/poppins": "^5.0.5",
     "lazysizes": "^5.3.2",
     "oneloop.js": "^5.0.0",
     "what-input": "^5.2.10"

src/scss/03-base/_fonts.scss

@@ -1,38 +1,33 @@
 /**
  * Fontsource
- * Fonts list : https://fontsource.org/fonts
- * Documentation : https://fontsource.org/docs/sass/mixins
- * For variable font : https://fontsource.org/docs/sass/variable-mixins
+ * Fonts list : https://fontsource.org/
+ * Documentation : https://fontsource.org/docs/getting-started/faces-mixin
  *
  * examples :
  *
  *      1 - Install the font by the command :
- *          yarn add @fontsource/lexend
+ *          // For Classic font
+ *          yarn add @fontsource/myFont
  *
- *      2 - Declare font-face :
- *          @use "~@fontsource/lexend/scss/mixins" as Lexend;
+ *          // For Variable font
+ *          yarn add @fontsource-variable/myFont
  *
+ *      2 - Declare font-face :
  *          // For Classic font
- *          @include Lexend.fontFace($weight: 400);
- *          @include Lexend.fontFace($weight: 400, $style: italic);
- *          @include Lexend.fontFace($weight: 700);
+ *          @use "~@fontsource/myFont/scss/mixins" as MyFont;
+ *          @include MyFont.faces($weights: (400, 700));
  *          ...
  *
  *          // For Variable font
- *          @include Lexend.fontFaceVariable($weight: 100 900);
+ *          @use "~@fontsource-variable/myFont/scss/mixins" as MyFont;
+ *          @include MyFont.faces($weights: 100 900);
  *          ...
  */
 
 @use "~@fontsource/poppins/scss/mixins" as Poppins;
 
-@include Poppins.fontFace($weight: 300);
-@include Poppins.fontFace($weight: 300, $style: italic);
-@include Poppins.fontFace($weight: 400);
-@include Poppins.fontFace($weight: 400, $style: italic);
-@include Poppins.fontFace($weight: 500);
-@include Poppins.fontFace($weight: 500, $style: italic);
-@include Poppins.fontFace($weight: 700);
-@include Poppins.fontFace($weight: 700, $style: italic);
+@include Poppins.faces($weights: (300, 400, 500, 700), $styles: normal);
+@include Poppins.faces($weights: (300, 400, 500, 700), $styles: italic);
 
 /**
  * Custom font here

yarn.lock

@@ -1830,10 +1830,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@fontsource/poppins@npm:^4.5.10":
-  version: 4.5.10
-  resolution: "@fontsource/poppins@npm:4.5.10"
-  checksum: 873ea31740a9819cbc39bf5895159101e87674e3c9da03629b6331e7752b657f3704cd1c6ae81ac9af2f5aa4a9d85847eae8015c926bb48e1f7a5bbacfeca8ee
+"@fontsource/poppins@npm:^5.0.5":
+  version: 5.0.5
+  resolution: "@fontsource/poppins@npm:5.0.5"
+  checksum: aafb41250a8aab42ae2f8a435913889c6ee3a3ce3ff6b792bc3e9033877ca7999a98ccdc43feb17e43cfd3fdfa610ec64d6c203d005522e9416f61d5ce0a032e
   languageName: node
   linkType: hard
 
@@ -3162,7 +3162,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "beapi-frontend-framework@workspace:."
   dependencies:
-    "@fontsource/poppins": ^4.5.10
+    "@fontsource/poppins": ^5.0.5
     "@wordpress/blocks": ^11.16.0
     "@wordpress/dependency-extraction-webpack-plugin": ^4.0.0
     "@wordpress/dom-ready": ^3.17.0