@kudoai/chatgpt.js 3.7.1 → 3.8.0

package/starters/chrome/extension/components/modals.js

@@ -1,28 +1,29 @@
 // Requires lib/chatgpt.js + lib/dom.js + app + env
 
 window.modals = {
-    import(deps) { Object.assign(this.imports = this.imports || {}, deps) },
+    import(deps) { Object.assign(this.imports ||= {}, deps) },
 
     stack: [], // of types of undismissed modals
     get class() { return `${this.imports.app.cssPrefix}-modal` },
 
     about() {
+        const { app, env: { ui: { scheme }, browser: { isPortrait }}} = this.imports
 
         // Show modal
         const labelStyles = 'text-transform: uppercase ; font-size: 17px ; font-weight: bold ;'
-                          + `color: ${ this.imports.env.ui.scheme == 'dark' ? 'white' : '#494141' }`
+                          + `color: ${ scheme == 'dark' ? 'white' : '#494141' }`
         const aboutModal = this.alert(
-            `${this.imports.app.symbol} ${chrome.runtime.getManifest().name}`, // title
+            `${app.symbol} ${chrome.runtime.getManifest().name}`, // title
             `<span style="${labelStyles}">🧠 Author:</span> `
-            + `<a href="${this.imports.app.author.url}">${this.imports.app.author.name}</a> `
-                    + `& <a href="${this.imports.app.urls.contributors}">contributors</a>\n`
+            + `<a href="${app.author.url}">${this.imports.app.author.name}</a> `
+                    + `& <a href="${app.urls.contributors}">contributors</a>\n`
             + `<span style="${labelStyles}">🏷️ Version:</span> `
-                    + `<span class="about-em">${this.imports.app.version}</span>\n`
+                    + `<span class="about-em">${app.version}</span>\n`
             + `<span style="${labelStyles}">📜 Open source code:</span> `
-                + `<a href="${this.imports.app.urls.gitHub}" target="_blank" rel="nopener">`
-                    + this.imports.app.urls.gitHub + '</a>\n'
+                + `<a href="${app.urls.gitHub}" target="_blank" rel="nopener">`
+                    + app.urls.gitHub + '</a>\n'
             + `<span style="${labelStyles}">⚡ Powered by:</span> `
-                + `<a href="${this.imports.app.urls.chatgptJS}" target="_blank" rel="noopener">chatgpt.js</a>`,
+                + `<a href="${app.urls.chatgptJS}" target="_blank" rel="noopener">chatgpt.js</a>`,
             [ function getSupport(){}, function rateUs(){}, function moreAiExtensions(){} ], // button labels
             '', 656 // modal width
         )
@@ -32,7 +33,7 @@ window.modals = {
             'text-align: center ; font-size: 51px ; line-height: 46px ; padding: 15px 0' )
         aboutModal.querySelector('p').style.cssText = (
             'text-align: center ; overflow-wrap: anywhere ;'
-          + `margin: ${ this.imports.env.browser.isPortrait ? '6px 0 -16px' : '3px 0 0' }` )
+          + `margin: ${ isPortrait ? '6px 0 -16px' : '3px 0 0' }` )
 
         // Hack buttons
         aboutModal.querySelector('.modal-buttons').style.justifyContent = 'center'
@@ -40,8 +41,7 @@ window.modals = {
             btn.style.cssText = 'height: 55px ; min-width: 136px ; text-align: center'
 
             // Replace buttons w/ clones that don't dismiss modal
-            const btnClone = btn.cloneNode(true)
-            btn.parentNode.replaceChild(btnClone, btn) ; btn = btnClone
+            btn.replaceWith(btn = btn.cloneNode(true))
             btn.onclick = () => this.safeWinOpen(
                 btn.textContent == 'Get Support' ? `${modals.imports.app.urls.gitHub}/issues`
               : btn.textContent == 'Rate Us' ? `${modals.imports.app.urls.gitHub}/discussions`
@@ -73,7 +73,7 @@ window.modals = {
     init(modal) {
         if (!modal) return // to support non-div this.open()s
         if (!this.styles) this.stylize() // to init/append stylesheet
-        modal.classList.add('no-user-select', this.class) ; modal.parentNode.classList.add(`${this.class}-bg`)
+        modal.classList.add(this.class) ; modal.parentNode.classList.add(`${this.class}-bg`)
         dom.addRisingParticles(modal)
     },
 
@@ -104,34 +104,28 @@ window.modals = {
     safeWinOpen(url) { open(url, '_blank', 'noopener') }, // to prevent backdoor vulnerabilities
 
     stylize() {
-        if (!this.styles) {
-            this.styles = dom.create.elem('style') ; this.styles.id = `${this.class}-styles`
-            document.head.append(this.styles)
-        }
+        const { env: { ui: { scheme }, browser: { isMobile }}} = this.imports
+        if (!this.styles) document.head.append(this.styles = dom.create.elem('style'))
         this.styles.innerText = (
-            `.no-user-select {
-                user-select: none ; -webkit-user-select: none ; -moz-user-select: none ; -ms-user-select: none }`
-          + `.${this.class} {` // modals
+            `.${this.class} {` // modals
+              + 'user-select: none ; -webkit-user-select: none ; -moz-user-select: none ; -ms-user-select: none ;'
               + 'font-family: -apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto,'
                   + 'Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif ;'
               + 'padding: 20px 25px 24px 25px !important ; font-size: 20px ;'
-              + `color: ${ this.imports.env.ui.scheme == 'dark' ? 'white' : 'black' } !important ;`
+              + `color: ${ scheme == 'dark' ? 'white' : 'black' } !important ;`
               + `background-image: linear-gradient(180deg, ${
-                     this.imports.env.ui.scheme == 'dark' ? '#99a8a6 -200px, black 200px'
-                                                            : '#b6ebff -296px, white 171px' }) }`
+                     scheme == 'dark' ? '#99a8a6 -200px, black 200px' : '#b6ebff -296px, white 171px' }) }`
           + `.${this.class} [class*=modal-close-btn] {`
               + 'position: absolute !important ; float: right ; top: 14px !important ; right: 16px !important ;'
               + 'cursor: pointer ; width: 33px ; height: 33px ; border-radius: 20px }'
           + `.${this.class} [class*=modal-close-btn] svg { height: 10px }`
           + `.${this.class} [class*=modal-close-btn] path {`
-              + `${ this.imports.env.ui.scheme == 'dark' ? 'stroke: white ; fill: white'
-                                                           : 'stroke: #9f9f9f ; fill: #9f9f9f' }}`
-          + ( this.imports.env.ui.scheme == 'dark' ?  // invert dark mode hover paths
+              + `${ scheme == 'dark' ? 'stroke: white ; fill: white' : 'stroke: #9f9f9f ; fill: #9f9f9f' }}`
+          + ( scheme == 'dark' ?  // invert dark mode hover paths
                 `.${this.class} [class*=modal-close-btn]:hover path { stroke: black ; fill: black }` : '' )
           + `.${this.class} [class*=modal-close-btn]:hover { background-color: #f2f2f2 }` // hover underlay
           + `.${this.class} [class*=modal-close-btn] svg { margin: 11.5px }` // center SVG for hover underlay
-          + `.${this.class} a {`
-              + `color: #${ this.imports.env.ui.scheme == 'dark' ? '00cfff' : '1e9ebb' } !important }`
+          + `.${this.class} a { color: #${ scheme == 'dark' ? '00cfff' : '1e9ebb' } !important }`
           + `.${this.class} h2 { font-weight: bold }`
           + `.${this.class} button {`
               + '--btn-transition: transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out ;'
@@ -141,14 +135,13 @@ window.modals = {
                   + '-webkit-transition: var(--btn-transition) ; -moz-transition: var(--btn-transition) ;'
                   + '-o-transition: var(--btn-transition) ; -ms-transition: var(--btn-transition) ;'
               + 'cursor: pointer !important ;' // add finger cursor
-              + `border: 1px solid ${ this.imports.env.ui.scheme == 'dark' ? 'white' : 'black' } !important ;`
+              + `border: 1px solid ${ scheme == 'dark' ? 'white' : 'black' } !important ;`
               + 'padding: 8px !important ; min-width: 102px }' // resize
           + `.${this.class} button:hover {` // add zoom, re-scheme
               + 'transform: scale(1.055) ; color: black !important ;'
-              + `background-color: #${ this.imports.env.ui.scheme == 'dark' ? '00cfff' : '9cdaff' } !important }`
-          + ( !this.imports.env.browser.isMobile ?
-                `.${this.class} .modal-buttons { margin-left: -13px !important }` : '' )
-          + `.about-em { color: ${ this.imports.env.ui.scheme == 'dark' ? 'white' : 'green' } !important }`
+              + `background-color: #${ scheme == 'dark' ? '00cfff' : '9cdaff' } !important }`
+          + ( !isMobile ? `.${this.class} .modal-buttons { margin-left: -13px !important }` : '' )
+          + `.about-em { color: ${ scheme == 'dark' ? 'white' : 'green' } !important }`
         )
     }
 };

package/starters/chrome/extension/content.js

@@ -18,15 +18,13 @@
     dom.import({ env }) // for env.ui.scheme
     modals.import({ app, env }) // for app data + env.<browser|ui> flags
 
-    // Add CHROME MSG listener
-    chrome.runtime.onMessage.addListener(req => { // from service-worker.js + popup/index.html
-        if (req.action == 'notify')
-            notify(...['msg', 'pos', 'notifDuration', 'shadow'].map(arg => req.options[arg]))
-        else if (req.action == 'alert')
-            modals.alert(...['title', 'msg', 'btns', 'checkbox', 'width'].map(arg => req.options[arg]))
-        else if (req.action == 'showAbout') {
-            config.skipAlert = true ; chatgpt.isLoaded().then(() => modals.open('about'))
-        } else if (req.action == 'syncConfigToUI') syncConfigToUI(req.options)
+    chrome.runtime.onMessage.addListener(({ action, options }) => { // from service-worker.js + popup/index.html
+        ({
+            notify: () => notify(...['msg', 'pos', 'notifDuration', 'shadow'].map(arg => options[arg])),
+            alert: () => modals.alert(...['title', 'msg', 'btns', 'checkbox', 'width'].map(arg => options[arg])),
+            showAbout: () => { config.skipAlert = true ; chatgpt.isLoaded().then(() => modals.open('about')) },
+            syncConfigToUI: () => syncConfigToUI(options)
+        }[action]?.())
     })
 
     // Init SETTINGS
@@ -92,7 +90,8 @@
     // Add RISING PARTICLES styles for modals
     ['gray', 'white'].forEach(color => document.head.append(
         dom.create.elem('link', { rel: 'stylesheet',
-            href: `https://assets.aiwebextensions.com/styles/rising-particles/dist/${color}.min.css?v=727feff`
+            href: `https://cdn.jsdelivr.net/gh/adamlui/ai-web-extensions@727feff/assets/styles/rising-particles/dist/${
+                color}.min.css`
     })))
 
     if (config.extensionDisabled) return

package/starters/chrome/extension/lib/chatgpt.js

@@ -24,26 +24,34 @@ const chatgpt = {
 
     selectors: {
         btns: {
-            continue: 'button:has([class*=rotate] [d^="M4.47189"])', login: '[data-testid*=login]',
-            newChat: 'button[data-testid*=new-chat-button],' // sidebar button (when logged in)
-                   + 'button:has([d^="M3.06957"]),' // Cycle Arrows icon (Temp chat mode)
-                   + 'button:has([d^="M15.6729"])', // Pencil icon (recorded chat mode)
-            regen: 'button[data-testid*="regenerate"],' // oval button in place of chatbar on errors
-                 + 'div[role=menuitem]:has([d^="M3.06957"])', // 'Try Again' entry of model selector below msg
-            scroll: 'button:has([d^="M12 21C11.7348"])',
-            send: '[data-testid=send-button]', sidebar: 'button[data-testid*=sidebar-button]',
-            stop: 'button[data-testid=stop-button]', voice: 'button[data-testid*=composer-speech-button]'
+            continue: 'button:has(svg[class*=rotate] > path[d^="M4.47189"])',
+            createImage: 'button[data-testid="composer-create-image"]',
+            deepResearch: 'button[data-testid="composer-deep-research"]',
+            login: 'button[data-testid*=login]',
+            newChat: 'a[href="/"]:has(svg),' // Pencil button (when logged in)
+                   + 'button:has([d^="M3.06957"])', // Cycle Arrows button (in temp chat logged out)
+            regen: 'button[data-testid*=regenerate],' // oval button in place of chatbar on errors
+                    // 'Try Again' entry of model selector below msg
+                 + 'div[role=menuitem] div:has(svg):has(path[d^="M3.06957"])',
+            scroll: 'button:has(> svg > path[d^="M12 21C11.7348"])',
+            search: 'button[data-testid="composer-button-search"]',
+            reason: 'button[data-testid="composer-button-reason"]',
+            send: 'button[data-testid=send-button]',
+            sidebar: 'button[data-testid*=sidebar-button]',
+            stop: 'button[data-testid=stop-button]',
+            upload: 'button:has(> svg > path[d^="M12 3C12.5523"])',
+            voice: 'button[data-testid*=composer-speech-button]'
         },
         chatDivs: {
-            convo: 'main > div > div > div > div > div > div[class*=group]',
-            msg: 'div[data-message-author-role]', reply: 'div[data-message-author-role=assistant]'
+            convo: 'div[class*=thread]', msg: 'div[data-message-author-role]',
+            reply: 'div[data-message-author-role=assistant]'
         },
-        chatHistory: 'nav',
-        errors: { txt: '[class*=text-error]' },
-        footer: '.min-h-4',
-        header: 'main .sticky',
+        chatHistory: 'div#history',
+        errors: { toast: 'div.toast-root', txt: 'div[class*=text-error]' },
+        footer: 'div#thread-bottom-container > div:last-of-type > div, span.text-sm.leading-none',
+        header: 'div#page-header, main div.sticky:first-of-type',
         links: { newChat: 'nav a[href="/"]', sidebarItem: 'nav a' },
-        sidebar: 'div[class*=sidebar]',
+        sidebar: 'div[class*=sidebar]:has(nav > div#sidebar-header)',
         ssgManifest: 'script[src*="_ssgManifest.js"]'
     },
 
@@ -124,7 +132,8 @@ const chatgpt = {
                     chatgpt.draggingModal = event.currentTarget
                     event.preventDefault() // prevent sub-elems like icons being draggable
                     Object.assign(chatgpt.draggingModal.style, {
-                        cursor: 'grabbing', transition: '0.1s', willChange: 'transform', transform: 'scale(1.05)' });
+                        transition: '0.1s', willChange: 'transform', transform: 'scale(1.05)' })
+                    document.body.style.cursor = 'grabbing'; // update cursor
                     [...chatgpt.draggingModal.children] // prevent hover FX if drag lags behind cursor
                         .forEach(child => child.style.pointerEvents = 'none');
                     ['mousemove', 'mouseup'].forEach(eventType => // add listeners
@@ -143,7 +152,8 @@ const chatgpt = {
 
                 mouseup() { // restore styles/pointer events, remove listeners, reset chatgpt.draggingModal
                     Object.assign(chatgpt.draggingModal.style, { // restore styles
-                        cursor: 'inherit', transition: 'inherit', willChange: 'auto', transform: 'scale(1)' });
+                        cursor: 'inherit', transition: 'inherit', willChange: 'auto', transform: 'scale(1)' })
+                    document.body.style.cursor = ''; // restore cursor
                     [...chatgpt.draggingModal.children] // restore pointer events
                         .forEach(child => child.style.pointerEvents = '');
                     ['mousemove', 'mouseup'].forEach(eventType => // remove listeners
@@ -297,7 +307,7 @@ const chatgpt = {
             // Create/show label
             const checkboxLabel = document.createElement('label')
             checkboxLabel.onclick = () => { checkboxInput.checked = !checkboxInput.checked ; checkboxFn() }
-            checkboxLabel.textContent = checkboxFn.name.charAt(0).toUpperCase() // capitalize first char
+            checkboxLabel.textContent = checkboxFn.name[0].toUpperCase() // capitalize first char
                 + checkboxFn.name.slice(1) // format remaining chars
                     .replace(/([A-Z])/g, (match, letter) => ' ' + letter.toLowerCase()) // insert spaces, convert to lowercase
                     .replace(/\b(\w+)nt\b/gi, '$1n\'t') // insert apostrophe in 'nt' suffixes
@@ -646,7 +656,7 @@ const chatgpt = {
                 const msgs = [] ; let isUserMsg = true
                 chatDivs.forEach(div => {
                     const sender = isUserMsg ? 'USER' : 'CHATGPT'; isUserMsg = !isUserMsg
-                    const msg = Array.from(div.childNodes).map(node => node.innerText)
+                    const msg = [...div.childNodes].map(node => node.innerText)
                               .join('\n\n') // insert double line breaks between paragraphs
                               .replace('Copy code', '')
                     msgs.push(`${sender}: ${msg}`)
@@ -1148,7 +1158,7 @@ const chatgpt = {
         }
     },
 
-    isDarkMode() { return document.documentElement.className.includes('dark') },
+    isDarkMode() { return document.documentElement.classList.contains('dark') },
     isFullScreen() { return chatgpt.browser.isFullScreen() },
 
     async isIdle(timeout = null) {
@@ -1189,7 +1199,7 @@ const chatgpt = {
         return await ( timeoutPromise ? Promise.race([isLoadedPromise, timeoutPromise]) : isLoadedPromise )
     },
 
-    isLightMode() { return document.documentElement.classList.toString().includes('light') },
+    isLightMode() { return document.documentElement.classList.contains('light') },
     isTempChat() { return location.search == '?temporary-chat=true' },
     isTyping() { return !!this.getStopButton() },
     login() { window.location.href = 'https://chat.openai.com/auth/login' },
@@ -1365,7 +1375,7 @@ const chatgpt = {
                 for (const divId of thisQuadrantQueue.slice(0, -1)) { // exclude new div
                     const oldDiv = document.getElementById(divId),
                           offsetProp = oldDiv.style.top ? 'top' : 'bottom', // pick property to change
-                          vOffset = +/\d+/.exec(oldDiv.style[offsetProp])[0] + 5 + oldDiv.getBoundingClientRect().height
+                          vOffset = +parseInt(oldDiv.style[offsetProp]) +5 + oldDiv.getBoundingClientRect().height
                     oldDiv.style[offsetProp] = `${ vOffset }px` // change prop
                 }
             } catch (err) {}
@@ -1496,7 +1506,7 @@ const chatgpt = {
             // Process text node
             if (childNode.nodeType == Node.TEXT_NODE) {
                 const text = childNode.nodeValue,
-                      elems = Array.from(text.matchAll(reTags))
+                      elems = [...text.matchAll(reTags)]
 
                 // Process 1st element to render
                 if (elems.length > 0) {
@@ -1505,7 +1515,7 @@ const chatgpt = {
                           tagNode = document.createElement(tagName) ; tagNode.textContent = tagText
 
                     // Extract/set attributes
-                    const attrs = Array.from(tagAttrs.matchAll(reAttrs))
+                    const attrs = [...tagAttrs.matchAll(reAttrs)]
                     attrs.forEach(attr => {
                         const name = attr[1], value = attr[2].replace(/['"]/g, '')
                         tagNode.setAttribute(name, value)
@@ -1541,9 +1551,8 @@ const chatgpt = {
             // responseToGet = index of response to get (defaults to latest if '' unpassed)
             // regenResponseToGet = index of regenerated response to get (defaults to latest if '' unpassed)
 
-                if (window.location.href.startsWith('https://chatgpt.com/c/'))
-                    return this.getFromDOM.apply(null, arguments)
-                else return this.getFromAPI.apply(null, arguments)
+                return this[`getFrom${ location.href.startsWith('https://chatgpt.com/c/') ? 'DOM' : 'API' }`]
+                    .apply(null, arguments)
         },
 
         getFromAPI(chatToGet, responseToGet) {
@@ -1604,7 +1613,7 @@ const chatgpt = {
         const textArea = chatgpt.getChatBox()
         if (!textArea) return console.error('Chatbar element not found!')
         const msgP = document.createElement('p'); msgP.textContent = msg
-        textArea.replaceChild(msgP, textArea.querySelector('p'))
+        textArea.querySelector('p').replaceWith(msgP)
         textArea.dispatchEvent(new Event('input', { bubbles: true })) // enable send button
         setTimeout(function delaySend() {
             const sendBtn = chatgpt.getSendButton()
@@ -1857,7 +1866,7 @@ const chatgpt = {
         isOn() {
             const sidebar = (() => {
                 return chatgpt.sidebar.exists() ? document.querySelector(chatgpt.selectors.sidebar) : null })()
-            if (!sidebar) { console.error('Sidebar element not found!'); return false }
+            if (!sidebar) { return console.error('Sidebar element not found!') || false }
             else return chatgpt.browser.isMobile() ?
                 document.documentElement.style.overflow == 'hidden'
               : sidebar.style.visibility != 'hidden' && sidebar.style.width != '0px'
@@ -2095,7 +2104,7 @@ const cjsFuncSynonyms = [
 // Define HELPER functions
 
 function toCamelCase(words) {
-    return words.map((word, idx) => idx == 0 ? word : word.charAt(0).toUpperCase() + word.slice(1)).join('') }
+    return words.map((word, idx) => idx == 0 ? word : word[0].toUpperCase() + word.slice(1)).join('') }
 
 // Prefix console logs w/ '🤖 chatgpt.js >> '
 const consolePrefix = '🤖 chatgpt.js >> ', ogError = console.error, ogInfo = console.info

package/starters/chrome/extension/lib/dom.js

@@ -93,8 +93,9 @@ window.dom = {
         computedHeight(elems) { return this.computedSize(elems, { dimension: 'height' }) }, // including margins
         computedWidth(elems) { return this.computedSize(elems, { dimension: 'width' }) }, // including margins
 
-        loadedElem(selector, timeout = null) {
-            const timeoutPromise = timeout ? new Promise(resolve => setTimeout(() => resolve(null), timeout)) : null
+        loadedElem(selector, { timeout = null } = {}) {
+            const timeoutPromise = new Promise(resolve =>
+                timeout ? setTimeout(() => resolve(null), timeout) : undefined)
             const isLoadedPromise = new Promise(resolve => {
                 const elem = document.querySelector(selector)
                 if (elem) resolve(elem)
@@ -103,7 +104,7 @@ window.dom = {
                     if (elem) { obs.disconnect() ; resolve(elem) }
                 }).observe(document.documentElement, { childList: true, subtree: true })
             })
-            return ( timeoutPromise ? Promise.race([isLoadedPromise, timeoutPromise]) : isLoadedPromise )
+            return Promise.race([isLoadedPromise, timeoutPromise])
         }
     }
 };

package/starters/chrome/extension/lib/settings.js

@@ -1,29 +1,55 @@
 window.config = {}
 window.settings = {
 
-    // Init SETTINGS props (for popup menu)
     controls: {
         // Add settings options as keys, with each key's value being an object that includes:
         // - 'type': the control type (e.g. 'toggle' or 'prompt')
         // - 'label': a descriptive label
         // - 'defaultVal' (optional): default value of setting (true for toggles if unspecified, false otherwise)
+        // - 'category' (optional): string key from this.categories to group control under
         // - 'symbol' (optional): for icon display (e.g. ⌚)
-        // NOTE: Toggles are disabled by default unless key name contains 'disabled' or 'hidden' (case insensitive)
-        // NOTE: Controls are displayed in top-to-bottom order
+        // - 'helptip' (optional): tooltip to display on hover
+
+        // NOTE: Controls are displayed in top-to-bottom order (within categories and in top-level)
+        // NOTE: Toggles are disabled by default unless defaultVal is true
+        //    ...or key name contains 'disabled' or 'hidden' (case insensitive)
+
         // EXAMPLES:
         // autoScrollDisabled: { type: 'toggle', label: 'Auto-Scroll' },
         // replyLanguage: { type: 'prompt', symbol: '🌐', label: 'Reply Language' }
     },
 
+    categories: {
+        // Add category entries as keys, with each key's value being an object that includes:
+        // - 'label': a descriptive label
+        // - 'symbol' (optional): for icon display (e.g. ⌚)
+        // - 'color' (optional): hex code (w/o #) of color for left-border
+        // - 'helptip' (optional): tooltip to display on hover
+        // - 'autoExpand' (optional): true/false to auto-expand categories on toolbar icon click
+
+        // NOTE: Categories are displayed in top-to-bottom order
+
+        // EXAMPLE:
+        // displaySettings: {
+        //     symbol: '🖥️', color: '94fca2', label: 'Display Settings', helptip: 'Display-related settings' }
+    },
+
+    typeIsEnabled(key) { // for menu labels + notifs to return ON/OFF for type w/o suffix
+        const reInvertFlags = /disabled|hidden/i
+        return reInvertFlags.test(key) // flag in control key name
+            && !reInvertFlags.test(this.controls[key]?.label) // but not in label name
+                ? !config[key] : config[key] // so invert since flag reps opposite type state, else don't
+    },
+
     load(...keys) {
         return Promise.all(keys.flat().map(async key => // resolve promise when all keys load
-            window.config[key] = (await chrome.storage.local.get(key))[key]
+            config[key] = (await chrome.storage.local.get(key))[key]
                 ?? this.controls[key]?.defaultVal ?? this.controls[key]?.type == 'toggle'
         ))
     },
 
     save(key, val) {
         chrome.storage.local.set({ [key]: val }) // save to Chrome extension storage
-        window.config[key] = val // save to memory
+        config[key] = val // save to memory
     }
 };

package/starters/chrome/extension/manifest.json

@@ -3,21 +3,13 @@
   "name": "ChatGPT Extension",
   "short_name": "ChatGPT 🧩",
   "description": "A Chromium extension template to start using chatgpt.js like a boss!",
-  "version": "2025.2.21",
+  "version": "2025.4.28",
   "author": "KudoAI",
   "homepage_url": "https://github.com/KudoAI/chatgpt.js-chrome-starter",
-  "icons": {
-    "16": "icons/icon16.png",
-    "32": "icons/icon32.png",
-    "64": "icons/icon64.png",
-    "128": "icons/icon128.png"
-  },
+  "icons": { "16": "icons/icon16.png", "32": "icons/icon32.png", "64": "icons/icon64.png", "128": "icons/icon128.png" },
   "permissions": [ "activeTab", "storage" ],
   "action": { "default_popup": "popup/index.html" },
-  "web_accessible_resources": [{
-    "matches": [ "<all_urls>" ],
-    "resources": [ "components/modals.js", "lib/chatgpt.js", "lib/dom.js", "lib/settings.js" ]
-  }],
+  "web_accessible_resources": [{ "matches": [ "<all_urls>" ], "resources": [ "components/*", "lib/*" ]}],
   "content_scripts": [{ "matches": [ "https://chatgpt.com/*" ], "js": [ "content.js" ] }],
   "background": { "service_worker": "service-worker.js" },
   "minimum_chrome_version": "88"