From 21593922698b40ed8376c449582c062e31822333 Mon Sep 17 00:00:00 2001
From: mgmeyers <matthew.gregory.meyers@gmail.com>
Date: Fri, 6 Aug 2021 11:24:58 -0700
Subject: [PATCH] Fix #17

---
 src/settingHandlers.ts | 26 +++++++++++++++++++++++++-
 1 file changed, 25 insertions(+), 1 deletion(-)

diff --git a/src/settingHandlers.ts b/src/settingHandlers.ts
index 5e9ed68..e38cd47 100644
--- a/src/settingHandlers.ts
+++ b/src/settingHandlers.ts
@@ -104,7 +104,10 @@ export function createHeading(opts: {
           .then((b) => {
             b.extraSettingsEl.onClickEvent((e) => {
               e.stopPropagation();
-              const title = opts.sectionName === opts.config.title ? opts.config.title : `${opts.sectionName} > ${opts.config.title}`;
+              const title =
+                opts.sectionName === opts.config.title
+                  ? opts.config.title
+                  : `${opts.sectionName} > ${opts.config.title}`;
               opts.settingsManager.export(
                 title,
                 opts.settingsManager.getSettings(opts.sectionId, opts.children)
@@ -468,6 +471,13 @@ export function createVariableColor(opts: {
           instance.hide();
           instance.addSwatch(color.toHEXA().toString());
         })
+        .on("show", () => {
+          const { result } = (pickr.getRoot() as any).interaction;
+
+          requestAnimationFrame(() =>
+            requestAnimationFrame(() => result.select())
+          );
+        })
         .on("cancel", onPickrCancel);
     })
     .addExtraButton((b) => {
@@ -596,6 +606,13 @@ export function createVariableThemedColor(opts: {
                     : config["default-light"],
               })
             )
+              .on("show", () => {
+                const { result } = (pickrLight.getRoot() as any).interaction;
+
+                requestAnimationFrame(() =>
+                  requestAnimationFrame(() => result.select())
+                );
+              })
               .on("save", onSave(idLight))
               .on("cancel", onPickrCancel);
 
@@ -622,6 +639,13 @@ export function createVariableThemedColor(opts: {
                     : config["default-dark"],
               })
             )
+              .on("show", () => {
+                const { result } = (pickrDark.getRoot() as any).interaction;
+
+                requestAnimationFrame(() =>
+                  requestAnimationFrame(() => result.select())
+                );
+              })
               .on("save", onSave(idDark))
               .on("cancel", onPickrCancel);