@digital-ai/dot-illustrations 2.0.39 → 2.0.40

package/demo/script.js

@@ -117,8 +117,8 @@ document.addEventListener('DOMContentLoaded', () => {
   const mainTabs = document.querySelectorAll('.tab-btn');
   const floatingTabs = document.querySelectorAll('.floating-tab');
 
-  // ── Upload New button (in header) ────────────────────────────────────────
-  // ── Upload New: type picker → form ──────────────────────────────────────
+  // ── Upload New button (in header) ────────────────────────────────────────
+  // ── Upload New: type picker → form ──────────────────────────────────────
   function showUploadStep(step) {
     // step: 'picker' | 'illustration' | 'integration'
     document.getElementById('upload-type-picker').classList.toggle('hidden', step !== 'picker');
@@ -140,7 +140,7 @@ document.addEventListener('DOMContentLoaded', () => {
 
   document.getElementById('upload-new-btn')?.addEventListener('click', openUploadModal);
 
-  // Backdrop click does NOT close — use X button or Escape
+  // Backdrop click does NOT close — use X button or Escape
 
   // Close on X button
   document.getElementById('upload-modal-close')?.addEventListener('click', closeUploadModal);
@@ -155,7 +155,7 @@ document.addEventListener('DOMContentLoaded', () => {
   document.getElementById('back-from-illus')?.addEventListener('click', () => showUploadStep('picker'));
   document.getElementById('back-from-integ')?.addEventListener('click', () => showUploadStep('picker'));
 
-  // ── Section switcher (Illustrations | Integrations) — pill style ──────────
+  // ── Section switcher (Illustrations | Integrations) — pill style ──────────
   function updateSectionUI(section) {
     document.querySelectorAll('.section-btn, .floating-section-btn').forEach(btn => {
       const active = btn.dataset.section === section;
@@ -186,12 +186,12 @@ document.addEventListener('DOMContentLoaded', () => {
       grid.classList.remove('hidden');
       illusSubTabs.classList.add('hidden');
       if (floatingTabs) floatingTabs.classList.add('hidden');
-      // Alphabet strip — show as flex for integrations (110 items benefit from A–Z jump)
+      // Alphabet strip — show as flex for integrations (110 items benefit from A–Z jump)
       alphaStrip.style.display = 'flex';
       renderAlphabetStrip();
       renderIllustrations();
     } else {
-      // Illustrations — search is sufficient for 72 items; hide alphabet strip
+      // Illustrations — search is sufficient for 72 items; hide alphabet strip
       grid.classList.remove('hidden');
       illusSubTabs.classList.remove('hidden');
       if (floatingTabs) floatingTabs.classList.remove('hidden');
@@ -205,7 +205,7 @@ document.addEventListener('DOMContentLoaded', () => {
     btn.addEventListener('click', () => setSection(btn.dataset.section));
   });
 
-  // ── Illustration sub-tabs — pill style ───────────────────────────────────
+  // ── Illustration sub-tabs — pill style ───────────────────────────────────
   function updateTabUI(tab) {
     document.querySelectorAll('.tab-btn').forEach(t => {
       const active = t.dataset.tab === tab;
@@ -330,6 +330,7 @@ document.addEventListener('DOMContentLoaded', () => {
     "sonarcloud","sonarqube","sonatype","svn","team-forge","teamcity","terraform",
     "testlink","topaz","travis-ci","urbancode-deploy","vmware","webhook",
     "windows","xray","zendesk",
+    "grafana",
   ];
 
   // --- FAVOURITES LOGIC ---
@@ -386,7 +387,7 @@ document.addEventListener('DOMContentLoaded', () => {
     if (integFields) integFields.classList.toggle('hidden', !isInteg);
 
     if (isInteg) {
-      // Integration modal — single usage field
+      // Integration modal — single usage field
       modalImage.innerHTML = `<img src="../integrations/${item}.svg" alt="${item}" style="width:140px;height:140px;object-fit:contain;" />`;
       const usageCode = `<span class="dot-integration"><img class="${item}"/></span>`;
       const integCodeEl = document.getElementById('modal-integ-code');
@@ -402,7 +403,7 @@ document.addEventListener('DOMContentLoaded', () => {
         };
       }
     } else {
-      // Illustration modal — Dot Code + HTML Code
+      // Illustration modal — Dot Code + HTML Code
       const cat     = globalList.includes(item) ? 'global' : 'dashboards';
       const svgPath = `illustrations/${themeClass}/${cat}/${item}.svg`;
       modalImage.innerHTML = `<span class="dot-illustration"><img src="${svgPath}" class="${item} ${themeClass}" style="width:220px;height:220px;object-fit:contain;"/></span>`;
@@ -520,8 +521,8 @@ document.addEventListener('DOMContentLoaded', () => {
       const isFav = favs.includes(item);
 
       if (isInteg) {
-        // Integration card — use direct <img src> so the image always loads
-        // ── Integration card ─────────────────────────────────────────────
+        // Integration card — use direct <img src> so the image always loads
+        // ── Integration card ─────────────────────────────────────────────
         const htmlCode = `<span class="dot-integration"><img class="${item}"/></span>`;
         const div = document.createElement('div');
         div.className = 'copy-container group relative bg-white dark:bg-gray-900 rounded-2xl overflow-hidden cursor-pointer shadow-sm transition-all duration-200 hover:shadow-md hover:ring-2 hover:ring-blue-400/30 dark:hover:ring-blue-500/30';
@@ -545,7 +546,7 @@ document.addEventListener('DOMContentLoaded', () => {
         `;
         list.appendChild(div);
       } else {
-        // ── Illustration card ─────────────────────────────────────────────
+        // ── Illustration card ─────────────────────────────────────────────
         let categoryFolder = globalList.includes(item) ? 'global' : 'dashboards';
         const svgPath   = `illustrations/${themeClass}/${categoryFolder}/${item}.svg`;
         const codeString = `<span class="dot-illustration"><img src="${svgPath}" class="${item} ${themeClass}"/></span>`;
@@ -596,7 +597,7 @@ document.addEventListener('DOMContentLoaded', () => {
   document.getElementById('myInput').value = '';
   document.getElementById('floatingInput').value = '';
 
-  // ── GitHub auth ──────────────────────────────────────────────────────────
+  // ── GitHub auth ──────────────────────────────────────────────────────────
   function updateAuthBadge(user) {
     const btn   = document.getElementById('gh-connect-btn');
     const badge = document.getElementById('gh-user-badge');
@@ -680,12 +681,12 @@ document.addEventListener('DOMContentLoaded', () => {
     }
   });
 
-  // Auto-connect via local proxy (node demo/local-proxy.js) — no token input needed
+  // Auto-connect via local proxy (node demo/local-proxy.js) — no token input needed
   window.GitHubUpload?.tryLocalProxy?.().then(user => {
     if (user) { updateAuthBadge(user); updateUploadAuthUI(); }
   });
 
-  // ── Upload panel ─────────────────────────────────────────────────────────
+  // ── Upload panel ─────────────────────────────────────────────────────────
   const uploadBufs = { illusLight: null, illusDark: null, integSvg: null };
 
   function bindFileDrop(dropId, inputId, nameId, bufKey) {
@@ -705,7 +706,7 @@ document.addEventListener('DOMContentLoaded', () => {
     const reader = new FileReader();
     reader.onload = e => {
       uploadBufs[bufKey] = e.target.result;
-      if (nameEl) { nameEl.textContent = `✓ ${file.name}`; nameEl.classList.remove('hidden'); }
+      if (nameEl) { nameEl.textContent = `✓ ${file.name}`; nameEl.classList.remove('hidden'); }
       drop.classList.add('border-green-400', 'dark:border-green-600');
       drop.classList.remove('border-gray-300', 'dark:border-gray-600');
     };
@@ -726,7 +727,7 @@ document.addEventListener('DOMContentLoaded', () => {
     if (!uploadBufs.illusLight) { showToast('Select the light SVG'); return; }
     if (!uploadBufs.illusDark)  { showToast('Select the dark SVG');  return; }
     if (!window.GitHubUpload?.getToken?.()) { showToast('Connect GitHub first'); return; }
-    btn.disabled = true; btn.textContent = 'Creating PR…';
+    btn.disabled = true; btn.textContent = 'Creating PR…';
     status.classList.add('hidden'); prLink.classList.add('hidden');
     try {
       const url = await window.GitHubUpload.createIllustrationPR(id, cat, uploadBufs.illusLight, uploadBufs.illusDark);
@@ -751,7 +752,7 @@ document.addEventListener('DOMContentLoaded', () => {
     if (!id)                 { showToast('Enter integration ID'); return; }
     if (!uploadBufs.integSvg) { showToast('Select an SVG file'); return; }
     if (!window.GitHubUpload?.getToken?.()) { showToast('Connect GitHub first'); return; }
-    btn.disabled = true; btn.textContent = 'Creating PR…';
+    btn.disabled = true; btn.textContent = 'Creating PR…';
     status.classList.add('hidden'); prLink.classList.add('hidden');
     try {
       const url = await window.GitHubUpload.createIntegrationPR(id, uploadBufs.integSvg);
@@ -771,7 +772,7 @@ document.addEventListener('DOMContentLoaded', () => {
   document.getElementById('upload-illus-btn')?.addEventListener('click', handleIllusUpload);
   document.getElementById('upload-integ-btn')?.addEventListener('click', handleIntegUpload);
 
-  // Initial render — start on illustrations, alphabet hidden
+  // Initial render — start on illustrations, alphabet hidden
   const strip = document.getElementById('alphabet-strip');
   if (strip) strip.style.display = 'none';
   updateSectionUI('illustrations');

package/index.css

@@ -583,3 +583,7 @@
 .dot-illustration img.data-extraction.dark {
     content: url('./illustrations/dark/dashboards/data-extraction.svg');
 }
+
+.dot-integration img.grafana {
+    content: url('./integrations/grafana.svg');
+}

package/integrations/grafana.svg

@@ -0,0 +1,24 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<g clip-path="url(#clip0_28507_3779)">
+<mask id="mask0_28507_3779" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="10" y="10" width="19" height="21">
+<path d="M28.7716 19.2632C28.7407 18.928 28.6837 18.5406 28.5714 18.1125C28.4591 17.6861 28.2931 17.219 28.0555 16.7339C27.8129 16.2522 27.4956 15.7476 27.087 15.2626C26.9275 15.0705 26.7534 14.8834 26.5646 14.6994C26.8462 13.5797 26.2228 12.6129 26.2228 12.6129C25.1469 12.5461 24.4633 12.9465 24.2078 13.1321C24.1655 13.1142 24.1232 13.0946 24.0809 13.0783C23.8986 13.0035 23.7081 12.9335 23.5144 12.8733C23.3208 12.813 23.1222 12.7577 22.9204 12.7073C22.7185 12.6601 22.5118 12.6194 22.3035 12.5868C22.2661 12.5803 22.2303 12.5754 22.1945 12.5722C21.7241 11.0666 20.3748 10.44 20.3748 10.44C18.8725 11.3938 18.5861 12.7284 18.5861 12.7284C18.5861 12.7284 18.5795 12.7593 18.5714 12.8082C18.4868 12.8326 18.4054 12.8554 18.3224 12.8814C18.2068 12.9156 18.0945 12.9595 17.9773 13.0002C17.8634 13.0458 17.7495 13.0881 17.6355 13.1386C17.4093 13.2346 17.1831 13.3453 16.9633 13.4673C16.7501 13.5878 16.5418 13.7196 16.3367 13.8612C16.3058 13.8482 16.2846 13.8368 16.2846 13.8368C14.2045 13.0425 12.3556 13.9979 12.3556 13.9979C12.1879 16.2115 13.1857 17.6063 13.3842 17.8586C13.3338 17.997 13.2898 18.1337 13.2459 18.2737C13.0913 18.775 12.9773 19.2893 12.9057 19.8231C12.8943 19.898 12.8862 19.9761 12.8781 20.0543C10.9575 21.0015 10.3878 22.9498 10.3878 22.9498C11.9926 24.7955 13.8628 24.9094 13.8628 24.9094C13.8644 24.9078 13.8676 24.9078 13.8676 24.9045C14.1069 25.3277 14.382 25.733 14.6896 26.1089C14.8182 26.2652 14.9565 26.4182 15.0965 26.5647C14.5105 28.2362 15.1779 29.6311 15.1779 29.6311C16.9633 29.6978 18.1385 28.8498 18.3842 28.6545C18.5633 28.7147 18.7407 28.7685 18.9246 28.8157C19.4731 28.9573 20.0346 29.0403 20.5962 29.0647C20.7361 29.0712 20.8761 29.0728 21.0177 29.0728H21.0861L21.1316 29.0712L21.2195 29.0696L21.3074 29.0647L21.309 29.0663C22.1505 30.2675 23.6316 30.4367 23.6316 30.4367C24.6831 29.3267 24.7449 28.2265 24.7449 27.9872C24.7449 27.9872 24.7449 27.9791 24.7449 27.9726C24.7449 27.953 24.7449 27.9384 24.7449 27.9384C24.7449 27.9205 24.7433 27.9058 24.7433 27.8863C24.9646 27.7317 25.1762 27.5657 25.3732 27.3866C25.7947 27.0058 26.1626 26.5712 26.4685 26.1041C26.4962 26.0617 26.5239 26.0162 26.5532 25.9706C27.7446 26.039 28.5844 25.2317 28.5844 25.2317C28.3859 23.9898 27.6779 23.386 27.533 23.2688C27.533 23.2688 27.5265 23.2639 27.5184 23.2574C27.5102 23.2509 27.5053 23.246 27.5053 23.246C27.4972 23.2411 27.4874 23.2346 27.4793 23.2281C27.4858 23.1532 27.4923 23.08 27.4972 23.0035C27.5053 22.87 27.5102 22.7366 27.5102 22.6031V22.5038V22.455V22.4289C27.5102 22.3948 27.5102 22.4078 27.5102 22.3948L27.5053 22.3101L27.4988 22.1978C27.4972 22.1588 27.4939 22.1246 27.4907 22.0904C27.4891 22.0562 27.4842 22.022 27.4793 21.9879L27.4663 21.8853L27.4516 21.7828C27.4321 21.6477 27.4044 21.511 27.3751 21.3759C27.2498 20.8404 27.0415 20.3326 26.7664 19.8769C26.4913 19.4211 26.1463 19.0158 25.7605 18.6757C25.3732 18.3339 24.9402 18.0604 24.4861 17.8554C24.032 17.6503 23.5551 17.5201 23.0782 17.4599C22.8406 17.4289 22.603 17.4175 22.3686 17.4192L22.2807 17.4208H22.2596C22.2531 17.4208 22.227 17.4208 22.2286 17.4208L22.1928 17.4224L22.1066 17.4289C22.074 17.4306 22.0398 17.4338 22.0105 17.4371C21.8901 17.4485 21.7697 17.4647 21.6525 17.4892C21.1821 17.577 20.7361 17.7479 20.3422 17.9823C19.95 18.2167 19.6082 18.5113 19.3315 18.8433C19.0532 19.177 18.8383 19.5448 18.6902 19.9257C18.5421 20.3065 18.4591 20.7004 18.4363 21.0829C18.4298 21.1773 18.4282 21.275 18.4298 21.3677C18.4298 21.3922 18.4298 21.4149 18.4314 21.4394L18.4331 21.5175C18.4379 21.563 18.4396 21.6103 18.4445 21.6558C18.464 21.8495 18.4982 22.0351 18.5503 22.2157C18.6528 22.5722 18.8188 22.8977 19.0255 23.1728C19.2306 23.4478 19.4747 23.6757 19.7351 23.8547C19.9956 24.0338 20.2739 24.1607 20.549 24.2405C20.824 24.3218 21.0975 24.356 21.3562 24.356C21.3888 24.356 21.4213 24.356 21.4523 24.3544C21.4702 24.3544 21.4865 24.3528 21.5044 24.3528C21.5223 24.3528 21.5385 24.3511 21.5564 24.3511C21.5841 24.3495 21.6101 24.3446 21.6378 24.343C21.6443 24.343 21.6525 24.3414 21.6606 24.3414L21.6866 24.3365C21.7045 24.3349 21.7192 24.3316 21.7355 24.33C21.7697 24.3251 21.7973 24.3186 21.8299 24.3121C21.8608 24.3056 21.8901 24.3007 21.921 24.2925C21.9812 24.2795 22.0366 24.2616 22.0935 24.2421C22.2059 24.2063 22.3116 24.1607 22.4093 24.1102C22.5086 24.0582 22.5981 24.0028 22.6827 23.9442C22.7055 23.9263 22.7299 23.9101 22.7544 23.8905C22.8455 23.8189 22.8601 23.6887 22.7869 23.6008C22.7251 23.5227 22.6144 23.5048 22.5281 23.5504C22.507 23.5617 22.4842 23.5748 22.463 23.5845C22.3881 23.6203 22.31 23.6529 22.2254 23.6806C22.1407 23.7066 22.0561 23.7278 21.965 23.7457C21.9194 23.7522 21.8738 23.7587 21.8266 23.7636C21.8038 23.7652 21.7794 23.7685 21.7583 23.7685C21.7338 23.7685 21.7111 23.7701 21.6899 23.7701C21.6687 23.7701 21.6443 23.7701 21.6232 23.7685C21.5955 23.7668 21.5678 23.7668 21.5385 23.7636C21.5385 23.7636 21.5239 23.7636 21.5369 23.7636H21.5288L21.5092 23.7619C21.4962 23.7603 21.4832 23.7603 21.4734 23.7571C21.4474 23.7554 21.4246 23.7505 21.3986 23.7489C21.1967 23.7213 20.9917 23.6627 20.7963 23.5731C20.5994 23.4853 20.409 23.3599 20.2397 23.2069C20.0704 23.0539 19.9207 22.8684 19.8051 22.6601C19.6896 22.4517 19.6066 22.2206 19.5675 21.9781C19.548 21.8576 19.5398 21.7307 19.5431 21.6086C19.5447 21.5744 19.5447 21.5419 19.548 21.5077C19.548 21.5158 19.548 21.5028 19.548 21.5012V21.4914L19.5496 21.4654C19.5512 21.4475 19.5512 21.4328 19.5545 21.4166C19.561 21.3498 19.5724 21.2831 19.5822 21.2164C19.6749 20.6874 19.9402 20.1714 20.3504 19.7792C20.4529 19.6832 20.5636 19.5904 20.6824 19.5106C20.8012 19.4293 20.9249 19.3576 21.0551 19.2974C21.187 19.2372 21.3221 19.1884 21.462 19.1509C21.602 19.1135 21.7452 19.0891 21.8901 19.0761C21.9633 19.0696 22.0366 19.0679 22.1098 19.0679C22.1294 19.0679 22.144 19.0679 22.1603 19.0679L22.2205 19.0696L22.2579 19.0712C22.2726 19.0712 22.2579 19.0712 22.2644 19.0712H22.2791L22.3393 19.0761C22.4956 19.0891 22.6534 19.1103 22.8081 19.1477C23.1173 19.216 23.4184 19.33 23.7016 19.4862C24.2631 19.7987 24.7433 20.2838 25.0363 20.8713C25.1844 21.1643 25.2885 21.4784 25.339 21.8039C25.352 21.8853 25.3601 21.9667 25.3667 22.0497L25.3715 22.1116L25.3732 22.1734C25.3748 22.1946 25.3748 22.2141 25.3748 22.2353C25.3748 22.2564 25.3764 22.2792 25.3748 22.2938V22.3476L25.3732 22.4078C25.3715 22.4485 25.3683 22.5136 25.3667 22.5543C25.3601 22.6454 25.352 22.7333 25.3406 22.8228C25.3292 22.9107 25.3146 22.9986 25.2999 23.0881C25.282 23.176 25.2641 23.2623 25.2413 23.3485C25.199 23.5211 25.142 23.692 25.0753 23.858C24.9435 24.1916 24.7677 24.5074 24.5561 24.8004C24.1329 25.383 23.5535 25.8583 22.8943 26.161C22.5639 26.3091 22.2156 26.4198 21.8608 26.4768C21.6818 26.5077 21.5011 26.524 21.3204 26.5305L21.2863 26.5321H21.2586H21.2H21.1121H21.0665C21.0893 26.5321 21.0616 26.5321 21.0649 26.5321H21.047C20.9493 26.5305 20.8533 26.5256 20.7557 26.5175C20.3683 26.4898 19.9874 26.4214 19.618 26.3124C19.2485 26.205 18.8888 26.0601 18.5486 25.8795C17.8683 25.5149 17.2612 25.0185 16.7859 24.4179C16.5467 24.1184 16.3383 23.7978 16.1658 23.4608C15.9933 23.1223 15.8582 22.7675 15.7573 22.4061C15.658 22.0432 15.5962 21.6721 15.5717 21.2978L15.5669 21.2261L15.5652 21.2082V21.1936V21.1627L15.5636 21.1008V21.0862V21.065V21.0211L15.562 20.9348V20.9169C15.562 20.9185 15.562 20.9185 15.562 20.9104V20.8762C15.562 20.8306 15.5636 20.7851 15.5636 20.7379C15.5701 20.5523 15.5848 20.3635 15.6108 20.1747C15.6352 19.9859 15.6661 19.7938 15.7052 19.605C15.7443 19.4162 15.7915 19.2291 15.8435 19.0451C15.9493 18.6773 16.0812 18.3192 16.2374 17.9823C16.5499 17.3069 16.9585 16.7112 17.4516 16.2326C17.5737 16.1122 17.7006 15.9983 17.8341 15.8925C17.9659 15.7867 18.1027 15.6874 18.2459 15.5963C18.3859 15.5035 18.5323 15.4172 18.6821 15.3407C18.7553 15.3 18.8335 15.2658 18.9083 15.2284C18.9474 15.2105 18.9865 15.1942 19.0239 15.1763C19.0629 15.1584 19.102 15.1422 19.1394 15.1259C19.2941 15.0591 19.4552 15.0054 19.618 14.9533C19.6587 14.9403 19.6993 14.9289 19.74 14.9159C19.7807 14.9029 19.8214 14.8948 19.8621 14.8817C19.9435 14.8573 20.0281 14.8394 20.1095 14.8199C20.1502 14.8085 20.1941 14.8004 20.2348 14.7922C20.2755 14.7841 20.3195 14.7743 20.3601 14.7662C20.4025 14.758 20.4448 14.7515 20.4871 14.7418L20.549 14.7304L20.6108 14.7222C20.6547 14.7157 20.6954 14.7092 20.7378 14.7027C20.785 14.6946 20.8322 14.6913 20.8794 14.6832C20.9184 14.6783 20.9819 14.6701 21.021 14.6653C21.0519 14.6636 21.0812 14.6588 21.1121 14.6571L21.1723 14.6506L21.2032 14.649L21.2374 14.6474C21.2846 14.6457 21.3318 14.6408 21.3807 14.6392L21.4523 14.6343C21.4523 14.6343 21.4783 14.6343 21.4572 14.6343H21.4718L21.5027 14.6327C21.5434 14.6311 21.5841 14.6278 21.6248 14.6262C21.7859 14.6213 21.9471 14.6213 22.1082 14.6262C22.4288 14.6392 22.743 14.6734 23.049 14.732C23.6593 14.8459 24.2338 15.0412 24.7547 15.3C25.2755 15.5539 25.7426 15.8681 26.1463 16.2082C26.1723 16.2294 26.1951 16.2522 26.2212 16.2733C26.2456 16.2945 26.2716 16.3173 26.2944 16.3384C26.3432 16.3824 26.3904 16.4263 26.4376 16.4703C26.4848 16.5142 26.5304 16.5582 26.576 16.6037C26.6215 16.6493 26.6671 16.6949 26.7078 16.7388C26.8803 16.9211 27.0398 17.105 27.1814 17.2906C27.4695 17.6601 27.7006 18.036 27.8829 18.3876C27.8927 18.4088 27.9057 18.4315 27.9171 18.4543C27.9285 18.4755 27.9383 18.4983 27.9497 18.5211C27.9708 18.565 27.9936 18.6073 28.0115 18.6496C28.031 18.6936 28.0522 18.7359 28.0701 18.7766C28.0896 18.8189 28.1059 18.8612 28.1238 18.9019C28.1922 19.0679 28.2557 19.2242 28.3045 19.3739C28.3891 19.6132 28.451 19.8297 28.4982 20.0201C28.5177 20.095 28.5893 20.1454 28.6658 20.1389C28.7456 20.1324 28.8074 20.0657 28.809 19.9859C28.7993 19.7711 28.796 19.5351 28.7716 19.2632Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_28507_3779)">
+<mask id="mask1_28507_3779" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="10" y="10" width="19" height="21">
+<path d="M28.8123 10.44H10.3878V30.44H28.8123V10.44Z" fill="white"/>
+</mask>
+<g mask="url(#mask1_28507_3779)">
+<rect width="18.75" height="20.2344" transform="matrix(1 0 0 -1 10.2683 30.5525)" fill="url(#pattern0_28507_3779)"/>
+</g>
+</g>
+</g>
+<defs>
+<pattern id="pattern0_28507_3779" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_28507_3779" transform="scale(0.00413223 0.00384615)"/>
+</pattern>
+<clipPath id="clip0_28507_3779">
+<rect width="18.4245" height="20" fill="white" transform="translate(10.3878 10.44)"/>
+</clipPath>
+<image id="image0_28507_3779" width="242" height="260" preserveAspectRatio="none" xlink:href="data:image/jpeg;base64,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"/>
+</defs>
+</svg>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digital-ai/dot-illustrations",
-  "version": "2.0.39",
+  "version": "2.0.40",
   "description": "A central place for the design team to keep illustrations and for dev teams to find them.",
   "main": "./index.css",
   "scripts": {