chore(pplx:ext): update deps

Author: pnd280

perplexity/extension/.cursor/rules/auto-imports.mdc

@@ -1,36 +1,47 @@
 ---
 description: 
-globs: src/**/*
+globs: *.ts,*.tsx
 alwaysApply: false
 ---
-## Auto-Import Reference
-
-This document provides a comprehensive list of automatically imported dependencies, configured in `src/types/unimport.config.ts`.
-
-GUIDANCE: When referencing or utilizing the following modules and functions, do **NOT** include explicit import statements. These are globally available due to the auto-import configuration.
-
-### List of Auto-Imports
-
-| Module/Function      | Source                    |
-| -------------------- | ------------------------- |
-| `useState`           | `react`                   |
-| `useEffect`          | `react`                   |
-| `useRef`             | `react`                   |
-| `useCallback`        | `react`                   |
-| `useMemo`            | `react`                   |
-| `lazy`               | `react`                   |
-| `use`                | `react`                   |
-| `createContext`      | `react`                   |
-| `useDeferredValue`   | `react`                   |
-| `memo`               | `react`                   |
-| `onlyMainWorldGuard` | `src/utils/js-context.ts` |
-| `onlyExtensionGuard` | `src/utils/js-context.ts` |
-| `sleep`              | `src/utils/utils.ts`      |
-| `isMainWorldContext` | `src/utils/utils.ts`      |
-| `isExtensionContext` | `src/utils/utils.ts`      |
-| `cn`                 | `src/utils/cn.ts`         |
-| `i18n`               | `src/utils/i18next.ts`    |
-| `t`                  | `src/utils/i18next.ts`    |
-| `deepEqual`          | `src/utils/deep-equal.ts` |
-| `$` (default)        | `jquery`                  |
-| `Key`                | `ts-key-enum`             |
+# AUTO-IMPORTS
+
+## CRITICAL: NEVER ADD EXPLICIT IMPORTS FOR THESE DEPENDENCIES
+
+This project uses automatic imports via unimport. The following dependencies are AUTOMATICALLY AVAILABLE in all files without explicit imports.
+
+### React Core
+- `useState`, `useEffect`, `useRef`, `useMemo`, `useCallback`, `useLayoutEffect`
+- `useContext`, `useReducer`, `useImperativeHandle`, `useDebugValue`, `useId`
+- `lazy`, `use`, `createContext`, `useDeferredValue`, `memo`
+
+### Utility Functions
+- From `src/utils/js-context-guards.ts`: 
+  - `onlyMainWorldGuard`
+  - `onlyExtensionGuard`
+  
+- From `src/utils/utils.ts`: 
+  - `sleep`
+  - `isMainWorldContext`
+  - `isExtensionContext`
+  
+- From `src/data/i18next.ts`: 
+  - `t`
+  - `i18n`
+  
+- From `src/utils/deep-equal.ts`: 
+  - `deepEqual`
+  
+- From `src/utils/cn.ts`: 
+  - `cn`
+
+### External Libraries
+- From jquery: `$` (default import)
+- From ts-key-enum: `Key`
+
+## IMPORTANT REMINDER
+- DO NOT add import statements for any of the above items
+- Treat these imports as already present in the global scope
+
+
+
+

perplexity/extension/changelogs/1.13.3.md

@@ -0,0 +1,3 @@
+## Bug Fixes
+
+- `Image Model Selector` now works as expected.

perplexity/extension/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pplx-ext",
-  "version": "1.13.2",
+  "version": "1.13.3",
   "author": "pnd280",
   "dependencies": {
     "@ark-ui/react": "^5.7.0",
@@ -16,8 +16,8 @@
     "@radix-ui/react-scroll-area": "^1.2.6",
     "@radix-ui/react-slot": "^1.2.0",
     "@radix-ui/react-toast": "^1.2.11",
-    "@tanstack/react-query": "^5.74.4",
-    "@tanstack/react-query-persist-client": "^5.74.6",
+    "@tanstack/react-query": "^5.74.11",
+    "@tanstack/react-query-persist-client": "^5.74.11",
     "@types/howler": "^2.2.12",
     "@uidotdev/usehooks": "^2.4.1",
     "@webext-core/match-patterns": "^1.0.3",
@@ -32,7 +32,7 @@
     "engine.io-parser": "^5.2.3",
     "fast-equals": "^5.2.2",
     "howler": "^2.2.4",
-    "i18next": "^25.0.1",
+    "i18next": "^25.0.2",
     "immer": "^10.1.1",
     "jquery": "^3.7.1",
     "js-base64": "^3.7.7",
@@ -48,7 +48,7 @@
     "react-icons": "^5.5.0",
     "react-lazily": "^0.9.2",
     "react-markdown": "^10.1.0",
-    "react-router-dom": "7.5.2",
+    "react-router-dom": "7.5.3",
     "react-syntax-highlighter": "^15.6.1",
     "rehype-raw": "^7.0.0",
     "rehype-stringify": "^10.0.1",
@@ -76,14 +76,14 @@
     "@tailwindcss/cli": "^4.1.4",
     "@tailwindcss/typography": "^0.5.16",
     "@tailwindcss/vite": "^4.1.4",
-    "@tanstack/eslint-plugin-query": "^5.73.3",
-    "@tanstack/react-query-devtools": "^5.74.6",
+    "@tanstack/eslint-plugin-query": "^5.74.7",
+    "@tanstack/react-query-devtools": "^5.74.11",
     "@types/chrome": "0.0.317",
     "@types/culori": "^2.1.1",
     "@types/jquery": "^3.5.32",
     "@types/lodash": "^4.17.16",
     "@types/mdast": "^4.0.4",
-    "@types/node": "^20.17.31",
+    "@types/node": "^20.17.32",
     "@types/pako": "^2.0.3",
     "@types/react": "^19.1.2",
     "@types/react-dom": "^19.1.2",
@@ -92,7 +92,7 @@
     "@vitejs/plugin-react": "^4.4.1",
     "@vitest/ui": "^3.1.2",
     "browserslist": "^4.24.4",
-    "caniuse-lite": "^1.0.30001715",
+    "caniuse-lite": "^1.0.30001716",
     "chalk": "^5.4.1",
     "eslint-plugin-boundaries": "^5.0.1",
     "glob": "^11.0.2",
@@ -110,7 +110,7 @@
     "tailwindcss-animate": "^1.0.7",
     "typescript": "5.8.2",
     "unimport": "^5.0.0",
-    "vite": "^6.3.3",
+    "vite": "^6.3.4",
     "vitest": "^3.1.2"
   },
   "engines": {

perplexity/extension/src/plugins/_core/ui/groups/query-box/follow-up-query-box.css

@@ -1,51 +1,23 @@
 @reference "../../../../../assets/index.css";
 
 [cplx-follow-up-query-box] {
-  /* Enlarge the query box (tall mode) */
-  @apply x:rounded-2xl;
-
-  > div {
-    @apply x:rounded-2xl;
-
-    > div {
-      @apply x:rounded-2xl x:p-2.5 x:py-3;
-
-      > div {
-        display: grid !important;
-        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
-        grid-template-rows: 1fr auto !important;
-
-        > div:nth-child(1) {
-          order: 0;
-          grid-column: span 3 / span 3;
-          grid-column-start: 1;
-
-          @apply x:p-2 x:pt-0;
-        }
-
-        > div:nth-child(2) {
-          grid-column: span 2 / span 2;
-          grid-column-start: 1;
-          align-items: center;
-          order: 1;
+  & > div > div {
+    @apply x:py-3;
+  }
 
-          &.-ml-1 {
-            margin-left: unset;
-          }
-        }
+  [data-cplx-component="query-box-components-wrapper"] {
+    @apply x:grid x:grid-cols-3 x:grid-rows-[1fr_auto] x:px-4;
 
-        > div:nth-child(3) {
-          grid-column: span 1 / span 1;
+    > div:nth-child(1) {
+      @apply x:col-start-1 x:col-end-4 x:p-0 x:pb-2;
+    }
 
-          &.-mr-1 {
-            margin-right: unset;
-          }
-        }
-      }
+    > div:nth-child(2) {
+      @apply x:col-start-1 x:row-start-2 x:-ml-1;
     }
-  }
 
-  [data-cplx-component="query-box-components-wrapper"] > div:nth-child(3) {
-    max-height: max-content;
+    > div:nth-child(3) {
+      @apply x:col-start-3 x:row-start-2 x:-mr-1;
+    }
   }
 }

perplexity/extension/src/plugins/image-gen-popover/ImageGenModelSelector.tsx

@@ -1,5 +1,5 @@
 import { createListCollection } from "@ark-ui/react";
-import { LuCpu as Cpu, LuImage as Image } from "react-icons/lu";
+import { LuCpu as Cpu, LuImage as Image, LuCpu } from "react-icons/lu";
 
 import Tooltip from "@/components/Tooltip";
 import { Portal } from "@/components/ui/portal";
@@ -67,9 +67,6 @@ export function ImageGenModelSelector() {
                   )?.shortLabel
                 }
               </SelectValue>
-              <span className="x:self-start x:text-[.5rem] x:text-primary">
-                {limit}
-              </span>
             </div>
           </SelectTrigger>
         </Tooltip>
@@ -80,9 +77,7 @@ export function ImageGenModelSelector() {
           )}
         >
           {PplxImageModelsService.allModels.map((model) => {
-            const Icon = PplxImageModelsService.icons[model.code];
-
-            if (Icon == null) return null;
+            const Icon = PplxImageModelsService.icons[model.code] ?? LuCpu;
 
             return (
               <Tooltip

perplexity/extension/src/services/cplx-api/remote-resources/pplx-image-models/defaults.ts

@@ -1,8 +1,13 @@
 export const pplxLocalImageModels = [
+  {
+    label: "Auto",
+    shortLabel: "Auto",
+    code: "default",
+  },
   {
     label: "GPT-4o",
     shortLabel: "GPT-4o",
-    code: "default",
+    code: "gpt-4o-image",
   },
   {
     label: "FLUX.1",

perplexity/extension/src/services/cplx-api/remote-resources/pplx-image-models/icons.tsx

@@ -1,12 +1,13 @@
-import { AiOutlineOpenAI } from "react-icons/ai";
+import { FaShuffle } from "react-icons/fa6";
 import { SiGooglegemini, SiOpenai } from "react-icons/si";
 
 import BlackForestLabs from "@/components/icons/BlackForestLabsIcon";
 import type { ImageModel } from "@/services/cplx-api/remote-resources/pplx-image-models/types";
 
 export const imageModelIcons: Record<ImageModel["code"], React.ElementType> = {
-  default: SiOpenai,
+  default: FaShuffle,
+  "gpt-4o-image": SiOpenai,
   flux: BlackForestLabs,
-  "dall-e-3": AiOutlineOpenAI,
+  "dall-e-3": SiOpenai,
   "gemini-flash": SiGooglegemini,
 };

perplexity/extension/src/services/cplx-api/remote-resources/utils.ts

@@ -8,7 +8,7 @@ import { errorWrapper } from "@/utils/error-wrapper";
 export async function getRemoteResource<T>(
   resourceConfig: RemoteResource<T>,
 ): Promise<T> {
-  if (APP_CONFIG.IS_DEV) return resourceConfig.fallback;
+  // if (APP_CONFIG.IS_DEV) return resourceConfig.fallback;
 
   if (APP_CONFIG.CPLX_CDN_URL == null) return resourceConfig.fallback;
 

perplexity/extension/src/services/cplx-api/versioned-remote-resources/utils.ts

@@ -11,7 +11,7 @@ import { errorWrapper } from "@/utils/error-wrapper";
 export async function getVersionedRemoteResource<T>(
   resourceConfig: VersionedRemoteResource<T>,
 ): Promise<T> {
-  if (APP_CONFIG.IS_DEV) return resourceConfig.fallback;
+  // if (APP_CONFIG.IS_DEV) return resourceConfig.fallback;
 
   if (APP_CONFIG.CPLX_CDN_URL == null) return resourceConfig.fallback;