v 1.0.0.

evilmartians · Sep 7, 2023 · beaa9c5 · beaa9c5
1 parent 912f95b
commit beaa9c5
Show file tree

Hide file tree

Showing 9 changed files with 44 additions and 40 deletions.
diff --git a/manifest.json b/manifest.json
@@ -1,8 +1,11 @@
 {
   "name": "Polychrom",
-  "id": "00000000",
+  "id": "1281280685402026529",
   "api": "1.0.0",
   "main": "dist/bg.js",
   "ui": "dist/index.html",
-  "editorType": ["figma"]
+  "editorType": ["figma"],
+  "networkAccess": {
+    "allowedDomains": ["none"]
+  }
 }
diff --git a/src/bg/index.ts b/src/bg/index.ts
@@ -5,7 +5,7 @@ import { sendSelectionDataToUI } from './send-selection-data-to-ui.ts';
 figma.skipInvisibleInstanceChildren = true;
 
 figma.showUI(__html__, {
-  height: 258,
+  height: 260,
   themeColors: true,
   width: 328,
 });

diff --git a/src/ui/components/App.tsx b/src/ui/components/App.tsx
@@ -69,11 +69,10 @@ export const App: React.FC = () => {
         <Tooltip>
           <TooltipTrigger>
             <a
-              className="mb-2"
+              className="interactive mb-2 flex h-6 w-6 items-center justify-center rounded-full border-0.5 border-secondary-35 text-gray-500 hover:border-transparent hover:bg-elevation-1 active:border-transparent active:bg-universal-25 dark:text-gray-300"
               href="https://git.apcacontrast.com/documentation/APCA_in_a_Nutshell"
               rel="noreferrer"
               target="_blank"
-              type="button"
             >
               <HelpIcon />
             </a>
@@ -84,6 +83,7 @@ export const App: React.FC = () => {
         <Tooltip>
           <TooltipTrigger>
             <a
+              className="interactive"
               href="https://evilmartians.com/?utm_source=figma-plugin-apca-contrast"
               rel="noreferrer"
               target="_blank"
@@ -97,7 +97,7 @@ export const App: React.FC = () => {
         <Tooltip>
           <TooltipTrigger>
             <button
-              className="mb-2"
+              className="interactive mb-2 flex h-6 w-6 items-center justify-center rounded-full border-0.5 border-secondary-35 text-gray-500 hover:border-transparent hover:bg-elevation-1 active:border-transparent active:bg-universal-25 dark:text-gray-300"
               onClick={changeColorSpaceDisplayMode}
               type="button"
             >

diff --git a/src/ui/components/ColorIndicator.tsx b/src/ui/components/ColorIndicator.tsx
@@ -65,29 +65,30 @@ export const ColorIndicator = ({
   });
 
   return (
-    <button
-      style={{
-        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-expect-error
-        '--indicators-active': `${hoverBgColor}3D`,
-        '--indicators-hover': `${hoverBgColor}28`,
-        color,
-      }}
-      onClick={setCopied}
-      type="button"
-    >
-      <Tooltip>
-        <TooltipTrigger>
+    <Tooltip>
+      <TooltipTrigger>
+        <button
+          style={{
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-expect-error
+            '--indicators-active': `${hoverBgColor}3D`,
+            '--indicators-hover': `${hoverBgColor}28`,
+            color,
+          }}
+          className="interactive"
+          onClick={setCopied}
+          type="button"
+        >
           <div className="flex items-center rounded-md p-0.5 hover:bg-indicatorsHover active:bg-indicatorsActive">
             <Indicator
               borderColor={borderColor}
               indicatorColor={indicatorColor}
             />
             <span style={{ color }}>{displayValue}</span>
           </div>
-        </TooltipTrigger>
-        <TooltipContent>{isCopied ? 'Copied!' : 'Copy as CSS'}</TooltipContent>
-      </Tooltip>
-    </button>
+        </button>
+      </TooltipTrigger>
+      <TooltipContent>{isCopied ? 'Copied!' : 'Copy as CSS'}</TooltipContent>
+    </Tooltip>
   );
 };
diff --git a/src/ui/components/HelpIcon.tsx b/src/ui/components/HelpIcon.tsx
@@ -2,15 +2,9 @@ import { type ReactElement } from 'react';
 
 export const HelpIcon = (): ReactElement => {
   return (
-    <svg
-      className="rounded-full border-0.5 border-secondary-35 text-gray-500 hover:border-transparent hover:bg-elevation-1 active:border-transparent active:bg-universal-25 dark:text-gray-300"
-      fill="none"
-      height="26"
-      width="26"
-      xmlns="http://www.w3.org/2000/svg"
-    >
+    <svg fill="none" height="14" width="8" xmlns="http://www.w3.org/2000/svg">
       <path
-        d="M11.085 15.09v-.21c0-.46.08-.87.24-1.23.17-.36.375-.67.615-.93s.56-.57.96-.93c.37-.34.665-.63.885-.87.23-.24.42-.52.57-.84.16-.32996.24-.69996.24-1.10996 0-.66-.23-1.19-.69-1.59-.45-.4-1.05-.6-1.8-.6-.76 0-1.385.225-1.875.675-.48.45-.785 1.085-.915 1.905H8.28c.15-1.13.56-2.005 1.23-2.625.67-.63 1.54-.945 2.61-.945.7 0 1.315.135 1.845.405.54.27.955.645 1.245 1.125.3.48.45 1.03.45 1.65 0 .54-.09 1.015-.27 1.42496-.18.4-.4.74-.66 1.02s-.605.605-1.035.975c-.36.32-.645.59-.855.81-.21.21-.39.465-.54.765-.14.29-.21.615-.21.975v.15h-1.005Zm.525 3c-.31 0-.55-.075-.72-.225-.17-.15-.255-.355-.255-.615 0-.27.085-.48.255-.63.17-.15.41-.225.72-.225.3 0 .535.075.705.225.17.15.255.36.255.63 0 .26-.085.465-.255.615-.17.15-.405.225-.705.225Z"
+        d="M3.085 10.09v-.21001c0-.46.08-.87.24-1.23.17-.36.375-.67.615-.93s.56-.57.96-.93c.37-.34.665-.63.885-.87.23-.24.42-.52.57-.84.16-.33.24-.7.24-1.11 0-.66-.23-1.19-.69-1.59-.45-.4-1.05-.6-1.8-.6-.76 0-1.385.225-1.875.675-.48.45-.785 1.085-.915 1.905H.279999c.15-1.13.56-2.005 1.230001-2.625.67-.63 1.54-.944997 2.61-.944997.7 0 1.315.135 1.845.404997.54.27.955.645 1.245 1.125.3.48.45 1.03.45 1.65 0 .54-.09 1.015-.27 1.425-.18.4-.4.74-.66 1.02s-.605.605-1.035.975c-.36.32-.645.59-.855.81-.21.21-.39.465-.54.765-.14.29-.21.615-.21.975V10.09H3.085Zm.525 3c-.31 0-.55-.075-.72-.225-.17-.15-.255-.355-.255-.615 0-.27.085-.48.255-.63.17-.15.41-.225.72-.225.3 0 .535.075.705.225.17.15.255.36.255.63 0 .26-.085.465-.255.615-.17.15-.405.225-.705.225Z"
         fill="currentColor"
       />
     </svg>

diff --git a/src/ui/components/SettingsIcon.tsx b/src/ui/components/SettingsIcon.tsx
@@ -2,16 +2,10 @@ import { type ReactElement } from 'react';
 
 export const SettingsIcon = (): ReactElement => {
   return (
-    <svg
-      className="rounded-full border-0.5 border-secondary-35 text-gray-500 hover:border-transparent hover:bg-elevation-1 active:border-transparent active:bg-universal-25 dark:text-gray-300"
-      fill="none"
-      height="26"
-      width="26"
-      xmlns="http://www.w3.org/2000/svg"
-    >
+    <svg fill="none" height="16" width="16" xmlns="http://www.w3.org/2000/svg">
       <path
         clipRule="evenodd"
-        d="M11.781 4c-.1028 0-.1888.07786-.199.1801l-.0838.83762c-.2785.01973-.5525.05574-.821.1071l-.2974-.78646c-.0363-.09611-.1396-.14905-.2388-.12246l-.42309.11337c-.09925.02659-.1622.12406-.14561.22547l.13562.82915c-.26254.09094-.51798.19707-.76529.31733l-.49057-.68245c-.05998-.08343-.17341-.10784-.2624-.05646l-.37932.219c-.08899.05137-.12456.16182-.0823.25547l.3461.76691c-.22885.1553-.44802.3238-.65641.50441l-.65166-.53317c-.07952-.06507-.19541-.05929-.26807.01337l-.30971.30971c-.07266.07266-.07844.18855-.01337.26807l.53317.65166c-.1806.20839-.3491.42756-.50441.65641l-.76691-.34611c-.09365-.04226-.2041-.00668-.25547.0823l-.219.37932c-.05138.08899-.02697.20242.05646.2624l.68245.49058c-.12026.2473-.22639.50275-.31733.76528l-.82914-.13561c-.1014-.01659-.19887.04636-.22546.14561l-.11337.42308c-.02659.0992.02635.2025.12246.2388l.78644.2974c-.05136.2685-.08738.5425-.1071.821l-.83761.0838c-.10224.0102-.1801.0962-.1801.199v.438c0 .1028.07786.1888.1801.199l.83761.0838c.01972.2785.05574.5525.1071.821l-.78644.2974c-.09611.0363-.14905.1396-.12246.2388l.11337.4231c.02659.0992.12406.1622.22546.1456l.82913-.1356c.09094.2625.19707.518.31733.7653l-.68244.4905c-.08343.06-.10784.1735-.05646.2624l.219.3794c.05137.0889.16182.1245.25547.0823l.7669-.3461c.1553.2288.32381.448.50441.6564l-.53316.6516c-.06507.0795-.05929.1954.01337.2681l.30971.3097c.07266.0727.18855.0784.26807.0134l.65164-.5332c.2084.1806.42757.3491.65642.5044l-.34609.7669c-.04226.0937-.00669.2041.0823.2555l.37932.219c.08899.0514.20242.027.2624-.0565l.49056-.6824c.2473.1203.50275.2264.76529.3173l-.13562.8292c-.01658.1014.04637.1988.14562.2254l.42309.1134c.0992.0266.2025-.0263.2388-.1225l.2974-.7864c.2685.0514.5425.0874.821.1071l.0838.8376c.0102.1022.0962.1801.199.1801h.438c.1028 0 .1888-.0779.199-.1801l.0838-.8376c.2785-.0197.5525-.0557.821-.1071l.2974.7864c.0363.0962.1396.1491.2388.1225l.4231-.1134c.0992-.0266.1622-.124.1456-.2254l-.1356-.8292c.2625-.0909.518-.197.7653-.3173l.4905.6824c.06.0835.1735.1079.2624.0565l.3794-.219c.0889-.0514.1245-.1618.0823-.2555l-.3461-.7669c.2288-.1553.448-.3238.6564-.5044l.6516.5332c.0796.065.1954.0593.2681-.0134l.3097-.3097c.0727-.0727.0784-.1886.0134-.2681l-.5332-.6516c.1806-.2084.3491-.4276.5044-.6564l.7669.3461c.0937.0422.2041.0066.2555-.0823l.219-.3794c.0514-.0889.027-.2024-.0565-.2624l-.6824-.4905c.1203-.2473.2264-.5028.3173-.7653l.8292.1356c.1014.0166.1988-.0464.2254-.1456l.1134-.4231c.0266-.0992-.0264-.2025-.1225-.2388l-.7864-.2974c.0514-.2685.0874-.5425.1071-.821l.8376-.0838c.1022-.0102.1801-.0962.1801-.199v-.438c0-.1028-.0779-.1888-.1801-.199l-.8376-.0838c-.0197-.2785-.0558-.5525-.1071-.821l.7864-.2974c.0961-.0363.1491-.1396.1225-.2388l-.1134-.42308c-.0266-.09925-.124-.1622-.2254-.14562l-.8292.13562c-.0909-.26254-.197-.51798-.3173-.76529l.6824-.49058c.0835-.05997.1079-.17341.0565-.26239l-.219-.37932c-.0514-.08899-.1618-.12457-.2555-.0823l-.7669.3461c-.1553-.22884-.3238-.44801-.5044-.6564l.5332-.65166c.065-.07952.0593-.19541-.0134-.26807l-.3097-.30971c-.0727-.07266-.1885-.07844-.2681-.01337l-.6516.53317c-.2084-.18061-.4276-.34911-.6564-.50441l.3461-.76691c.0422-.09365.0066-.2041-.0823-.25547l-.3794-.219c-.0889-.05138-.2024-.02697-.2624.05646l-.4905.68245c-.2473-.12026-.5028-.22639-.7653-.31733l.1356-.82916c.0166-.1014-.0464-.19887-.1456-.22547l-.4231-.11336c-.0992-.02659-.2025.02635-.2388.12246l-.2974.78647c-.2685-.05137-.5425-.08738-.821-.10711l-.0838-.83762C12.4078 4.07786 12.3218 4 12.219 4h-.438Zm-1.2098 2.17119-.16.04287c-.52666.17435-.7088.80639-.42528 1.29746L11.4226 10c.5359.9282 1.5263 1.5 2.5981 1.5h2.8729c.567 0 1.0234-.474.9115-1.0174l-.045-.1677c-.1246-.42679-.2954-.83388-.5066-1.21551l-.1091-.18909c-.5064-.84123-1.2132-1.54811-2.0544-2.05449l-.1897-.10949c-.3818-.21125-.7891-.38207-1.2161-.50671l-.2553-.06841c-.4579-.11187-.9365-.17119-1.4289-.17119-.4924 0-.9709.05931-1.4288.17118ZM6.85573 8.91015l-.10936.1894c-.21111.38158-.38186.7886-.50649 1.21535l-.06893.2572C6.05923 11.0297 6 11.508 6 12s.05921.9701.17089 1.4277l.06906.2577c.12457.4265.29521.8332.50617 1.2146l.10987.1903c.25004.4153.54896.7979.88879 1.1397.41279.4153 1.08365.2633 1.3764-.2437L10.5566 13.5c.5359-.9282.5359-2.0718 0-3L9.12119 8.01376c-.29275-.50706-.96362-.65901-1.37641-.24378-.33995.34197-.63896.72468-.88905 1.14017Zm3.55507 8.87565.1613.0433c.4538.1108.9279.1699 1.4156.1709h.0246c.4877-.001.9617-.0601 1.4155-.1709l.2575-.069c.4262-.1245.8328-.295 1.214-.5058l.1917-.1107c.4163-.2507.7997-.5506 1.1421-.8915l.019-.019c.3411-.3426.6411-.7262.8919-1.1427l.1099-.1905c.211-.3813.3816-.788.5061-1.2144l.0451-.1682c.1118-.5434-.3446-1.0173-.9115-1.0173h-2.8729c-1.0718 0-2.0622.5718-2.5981 1.5l-1.43669 2.4885c-.28346.491-.10146 1.1228.42489 1.2973ZM12 12.5c.2761 0 .5-.2239.5-.5s-.2239-.5-.5-.5-.5.2239-.5.5.2239.5.5.5Z"
+        d="M7.781 0c-.10275 0-.18879.077859-.19901.180099l-.08376.837621c-.2785.01973-.5525.05574-.82105.1071L6.37983.338357c-.03634-.09611-.13959-.149049-.23884-.122456l-.42308.113365c-.09925.026593-.1622.124066-.14561.225469l.13562.829155c-.26254.09094-.51798.19707-.76529.31733l-.49057-.68245c-.05998-.083427-.17341-.107839-.2624-.056463l-.37932.219003c-.08899.05137-.12456.16182-.0823.25547l.3461.76691c-.22885.1553-.44802.3238-.65641.50441l-.65166-.53317c-.07952-.06507-.19541-.05929-.26807.01337l-.30971.30971c-.07266.07266-.07844.18855-.01337.26807l.53317.65166c-.1806.20839-.3491.42756-.50441.65641l-.76691-.34611c-.09365-.04226-.2041-.00668-.25547.0823l-.219004.37932c-.051375.08899-.026964.20242.056464.2624l.68245.49058c-.12026.2473-.22639.50275-.31733.76528l-.829136-.13561c-.101402-.01659-.198875.04636-.225469.14561L.215911 6.141c-.026594.09925.026345.2025.122456.23884l.786443.29734c-.05136.26855-.08738.54255-.1071.82105l-.837611.08376C.0778589 7.59221 0 7.67825 0 7.781v.438c0 .10275.077859.18879.180099.19901l.837611.08376c.01972.2785.05574.5525.1071.82105l-.786443.29734c-.096111.03634-.14905.13959-.122456.23884l.113364.4231c.026594.0992.124067.1622.22547.1456l.829125-.1356c.09094.2625.19707.518.31733.7653l-.68244.4905c-.083428.06-.107839.1735-.056464.2624l.219004.3794c.05137.0889.16182.1245.25547.0823l.7669-.3461c.1553.2288.32381.448.50441.6564l-.53316.6516c-.06507.0795-.05929.1954.01337.2681l.30971.3097c.07266.0727.18855.0784.26807.0134l.65164-.5332c.2084.1806.42757.3491.65642.5044l-.34609.7669c-.04226.0937-.00669.2041.0823.2555l.37932.219c.08899.0514.20242.027.2624-.0565l.49056-.6824c.2473.1203.50275.2264.76529.3173l-.13562.8292c-.01658.1014.04637.1988.14562.2254l.42308.1134c.09925.0266.2025-.0263.23884-.1225l.29734-.7864c.26855.0514.54256.0874.82106.1071l.08376.8376c.01022.1022.09626.1801.19901.1801h.438c.10275 0 .18879-.0779.19901-.1801l.08376-.8376c.27851-.0197.55251-.0557.82106-.1071l.29734.7864c.03634.0962.13959.1491.23884.1225l.42309-.1134c.0992-.0266.1622-.124.1456-.2254l-.1356-.8292c.2625-.0909.518-.197.7653-.3173l.4905.6824c.06.0835.1735.1079.2624.0565l.3794-.219c.0889-.0514.1245-.1618.0823-.2555l-.3461-.7669c.2288-.1553.448-.3238.6564-.5044l.6516.5332c.0796.065.1954.0593.2681-.0134l.3097-.3097c.0727-.0727.0784-.1886.0134-.2681l-.5332-.6516c.1806-.2084.3491-.4276.5044-.6564l.7669.3461c.0937.0422.2041.0066.2555-.0823l.219-.3794c.0514-.0889.027-.2024-.0565-.2624l-.6824-.4905c.1203-.2473.2264-.5028.3173-.7653l.8292.1356c.1014.0166.1988-.0464.2254-.1456l.1134-.4231c.0266-.09925-.0264-.2025-.1225-.23884l-.7864-.29734c.0514-.26855.0874-.54255.1071-.82105l.8376-.08376C15.9221 8.40779 16 8.32175 16 8.219v-.438c0-.10275-.0779-.18879-.1801-.19901l-.8376-.08376c-.0197-.2785-.0558-.5525-.1071-.82105l.7864-.29734c.0961-.03634.1491-.13959.1225-.23884l-.1134-.42308c-.0266-.09925-.124-.1622-.2254-.14562l-.8292.13562c-.0909-.26254-.197-.51798-.3173-.76529l.6824-.49058c.0835-.05997.1079-.17341.0565-.26239l-.219-.37932c-.0514-.08899-.1618-.12457-.2555-.0823l-.7669.3461c-.1553-.22884-.3238-.44801-.5044-.6564l.5332-.65166c.0651-.07952.0593-.19541-.0134-.26807l-.3097-.30971c-.0727-.07266-.1885-.07844-.2681-.01337l-.6516.53317c-.2084-.18061-.4276-.34911-.6564-.50441l.3461-.76691c.0422-.09365.0066-.2041-.0823-.25547l-.3794-.219003c-.0889-.051375-.2024-.026964-.2624.056463l-.4905.68245c-.2473-.12026-.5028-.22639-.7653-.31733l.1356-.829156c.0166-.101403-.0464-.198876-.1456-.225469L9.85901.215901c-.09925-.026594-.2025.026345-.23884.122455l-.29734.786474c-.26856-.05137-.54256-.08738-.82106-.10711L8.41801.180099C8.40779.0778589 8.32175 0 8.219 0h-.438ZM6.57117 2.17119l-.15999.04287c-.52664.17435-.70878.80639-.42526 1.29746l1.43673 2.48849c.5359.9282 1.52628 1.5 2.59805 1.5h2.8729c.567 0 1.0234-.47397.9115-1.01744l-.045-.1677c-.1246-.42677-.2954-.83385-.5066-1.21548l-.1091-.18909c-.5064-.84124-1.2132-1.54811-2.0544-2.05449l-.1897-.10949c-.3818-.21124-.7891-.38207-1.2161-.50671l-.2553-.06841C8.97095 2.05933 8.4924 2.00001 8 2.00001c-.49238 0-.97091.05931-1.42883.17118ZM2.85573 4.91015l-.10936.1894c-.21111.38158-.38187.78861-.50649 1.21531l-.06893.25723C2.05923 7.02974 2 7.50796 2 8.00001c0 .49197.05921.97011.17089 1.42768l.06906.25772c.12457.42649.29521.83319.50617 1.21459l.10987.1903c.25004.4153.54896.7979.88879 1.1397.41279.4153 1.08365.2633 1.3764-.2437L6.55662 9.5c.5359-.9282.5359-2.07179 0-3L5.12119 4.01376c-.29275-.50706-.96362-.65901-1.37641-.24378-.33995.34197-.63896.72468-.88905 1.14017Zm3.55508 8.87565.16134.0433c.4538.1108.92783.1699 1.41552.1709h.02466c.48768-.001.9617-.0601 1.41549-.1709l.25744-.069c.42624-.1245.83284-.295 1.21404-.5058l.1917-.1107c.4163-.2507.7997-.5506 1.1421-.8915l.019-.019c.3411-.3426.6411-.7262.8919-1.1427l.1099-.1905c.211-.3813.3816-.788.5061-1.21442l.0451-.16817c.1118-.54341-.3446-1.0173-.9115-1.0173h-2.8729c-1.07178 0-2.06216.57179-2.59806 1.49999l-1.43673 2.4885c-.28346.491-.10146 1.1228.4249 1.2973ZM8 8.5c.27614 0 .5-.22386.5-.5s-.22386-.5-.5-.5-.5.22386-.5.5.22386.5.5.5Z"
         fill="currentColor"
         fillRule="evenodd"
       />

diff --git a/src/ui/index.html b/src/ui/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Figma + Vite + React + TS</title>
+    <title>Polychrom</title>
   </head>
   <body>
     <div id="root"></div>

diff --git a/src/ui/style.css b/src/ui/style.css
diff --git a/tailwind.config.js b/tailwind.config.js
@@ -56,6 +56,7 @@ module.exports = {
           35: 'var(--secondary-35)',
           75: 'var(--secondary-75)',
         },
+        focus: 'var(--figma-color-border-selected)',
       },
     },
   },