Merge pull request #5 from gtokman/fix-update-to-use-svgs

feat: update to use svgs

Author: Gary Tokman

.github/workflows/test.yml

@@ -15,12 +15,12 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [12.x]
+        node-version: [20.x]
 
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
       - run: npm ci

index.ts

@@ -1,7 +1,6 @@
 const plugin = require('./index.ts');
 
-const base64Mask1x =
-  'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJYAAACWCAYAAAA8AXHiAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAlqADAAQAAAABAAAAlgAAAAAXS0ggAAAI6UlEQVR4Ae2dzWtUVxjGtcYYQkRIiSBBIcGARXEh2oqg0KUupVC00EWFQhcVCkL/hnbVTTeu7bIuhGrXLsQvsvADREUhIUiNBj+CaGJin98kZ5hv7szcM3Nn7vPCkztz5tw39/zex3Nn7pxcN27ovdisQx6TdkqT0oS0SxqXaB+VRqRhaVAakDZJG9elTdfik34zWpE+SkvSO2lRWpDmpTlpRnoqPZFmJdqXpZ4JYGc1PtOBYZpD0pH17ZS2GCfLx63DSz0wI8Z7JN2Srq1vMd+qlLnIUoEw0n7phHRcOiAx6zjqE2C2m5auSJelO1Imjabj6mgM6bdhogvSC4l/mVbrDGAIS5jCNndxUCM+L72UbKQ4DGALY1j3dfCm+5R0Q7KZOssA5rCnBn0TDOaM9FCyobrLgBpQi5432EkN4q4Nlbl/UNSE2vRc7NERX5I8Q2WbATWiVpkPLhmclV5JNlVvMKBW1IzaZTJ26KguSjZUbzKgdtQwU3FUR8NVYZuqtxlQQ2qZiTito3gj2VT9wYBaUtOuBudmvky1qfqLATWltl2Jc/qtfC9lU/UnA2pLjTsauNmm6k9DlU4U1LhjMxfnX5/++t9UwWDUOvp7Lj4x+I16fkwVzEXNm/q02Mx6LK5xXJV2S478EXisIR+TniUZetKrrfT7U7KpklDtzz7UHg8k8gxrwZPEz+r0S5KO7tPXBL7Q6BYkluE0jCSnQr6kvC5ta5jJL+aFwGsN9LD0oNGAk0xrvyuBTdWIYr5ewwt4oq04qb3DJwNvzaLUA3ijbjQ6FbLKcFraV3dvv5BnAvc0+ANSzb93bHQq/F472VR5tk7jseMNPFIz6s1YzFb3pamae7nRBNYIsMxmr1Q1a9Wbsb5RZ5tqDZ5/1ieAR/BKVdSbsbhO8WVVbzeYQDWBm2r6qrK5lrEOqhP3B3CYQFIC3F/jdmnnWqfCH0s7+LEJJCBQ5ZnKGWtISeak0QTJ3MUEAgG+5hmX3oeGyhnra71gUwU63iYlgGfwTjEqjfVd8RU/MIHmCJR5p/RUiMmeS583l8+9TaBAgLvbbJdYzly2tma/nttUUHG0QgDv4KFClJ4KT4RGb02gRQJFD5Ua63iLybybCQQCRQ+F91gY7K00HHp4awItEOCeqFul1TBjTeiJTdUCSe9SRgAP4aXim3cuyTtMIA0CBS+FGetIGhmdwwREoOClYCzPWPZEWgTKZiyvvUoLq/MUvMSnws3SByl8QjQaE2iHAH9wsYVT4ZhkU7WD0vuWEsBLYxhrZ2mrH5tACgR2YqzJFBI5hQmUEpjEWBOlLX5sAikQmMBYu1JI5BQmUEpgF8ZiSanDBNIkMI6x+FToMIE0CRQ+FXqNe5pInQsCo8xYI2ZhAikTGMFYXi6TMlWn2zCMsQYNwgRSJjCIsQZSTup0JjCAsZLe4Na4TCApgU0Yy19AJ8XlfkkJbMRULHNwmECqBJixHCaQOgEbK3WkTggBG8s+iELAxoqC1UltLHsgCgEbKwpWJ7Wx7IEoBGysKFid1MayB6IQsLGiYHVSG8seiELAxoqC1UltLHsgCgEbKwpWJ7Wx7IEoBGysKFid1MayB6IQsLGiYHVSG8seiELAxoqC1UltLHsgCgEbKwpWJ7Wx7IEoBGysKFid1MayB6IQsLGiYHVSG8seiELAxoqC1UltLHsgCgEbKwpWJ7Wx7IEoBDCW748VBW2uk36ysXJd/2iDLxhrJVp6J84rgRVmrI95Hb3HHY3AR4y1FC29E+eVwBLGepfX0Xvc0Qi8w1iL0dI7cV4JLGKshbyO3uOORmABY81HS+/EeSUwj7Hm8jp6jzsagTmMNRMtvRPnlcAMxnqa19F73NEIPMVYT6Kld+K8EniCsWbzOnqPOxqBWf73r83SB8n/vVw0zrlKzGqZLcxYy5KvZeWq9lEHi5eWMRbxaG3jnybQNoGCl4KxbrWdzglMYI1AwUvBWNdMxQRSIlDwUjCWZ6yUqDrNhoKXwidBDPZWGjYYE2iDAEuwtkqrYcZa1ZPpNhJ6VxOAAB7CS2X/de8VGhwm0AaBoofCjEWuy20k9K4mAIGih8J7LBox2XPpc544TKBJAi/Vf7tUdSqk4d8mk7m7CQQCeKdgKhpKT4U8/4sfDhNogUCZd0pPheQaklhROsoThwkkJMD3g+PS+9C/csbihb/Di96aQEICeKZoKvapNBZt5/nhMIEmCFR5ppaxbivhzSaSumu+CeAVPFMWtYxFhz/KevmJCdQnUNMrlW/ew+6sKr0vTYUGb02gBgHWXu2Vlitfqzdj0fG3ys5+bgIVBPBIlanoU2/G4jVmLb5U3McThwlUELin5wekmsbaVNG59ClXUf+Tvi1t9GMTWCfwk7a8XWo5LmlP/vLCMoPgATzRMBqdCsOOe/TgurQtNHibawKvNfrD0oNGFBqdCsN+L/SAlYHHQ4O3uSbwq0b/T1oE+PR4UQpTobf5ZIEH6l1JKPNaklNh2GGHHlyVdocGb3NF4LFGe0x6lmTUidy3noiEP0j80YUjXwSoObVPZKpW0ZzWjtzC26fDfDCg1tS8I3FWv4XrXDZXfzOgxtS6o3FOv83m6l9jUVtq3JXAzT4t9p+5qGnHZ6pKB3P+fSP5tNgfDKhlx95TVZqp8vlRNTySbK7eZkANqWWmgutcFyWbqzcZUDtqmMnguhjn5leSDdYbDKgVNWvmmqa6dyf44tqrIrJvLGpErXouTuqI70qevbLFgJpQm54OVqKekR5KNlh3GVADakFN+iYYzCnphmSDdZYBzGHfV4bSeKrioFrOS9yhxCaLwwC2MIZ17mJII2YB4QWJBYU2WXsMYAhLmMK2a9HMeqzYB8nH3f3SCQkwB6RhyVGfACt7pyXupMdNz+5IfMfX9ciSsSphYLQJ6ZB0ZH07pe2olOXj1uGlHszkCxJXxrkrMbe8ZvtUyoSRdBxl0YsF4g3omLRTmpQw3y5pXKId441IzHaD0oDE2n7G2u3xhlP9io6FL3qXJGadRQnjzEtz0oyEaZ5IsxLty1LPxP8oUpVx+bZXHwAAAABJRU5ErkJggg==';
+const svgMask1x = `data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150' viewBox='0 0 150 150'%3E%3Crect width='150' height='150' rx='50' fill='black'/%3E%3C/svg%3E`;
 
 describe('Smooth Corners Plugin', () => {
   it('should generate basic utilities with default sizes', () => {
@@ -22,6 +21,6 @@ describe('Smooth Corners Plugin', () => {
       utilities['.smooth-corners-sm']['@supports (mask-border-width: 60px)'][
         'mask-border'
       ]
-    ).toBe(`url("${base64Mask1x}") 49% fill / 25px`);
+    ).toBe(`url("${svgMask1x}") 49% fill / 25px`);
   });
 });