{"library":"new-javascript","title":"TypeScript types for new JavaScript","description":"This package, `new-javascript`, provides TypeScript type definitions for cutting-edge and experimental Web APIs and JavaScript features that are not yet incorporated into TypeScript's standard `dom` library or `@types/web`. As of version 0.4.7, it covers a wide range of specifications from groups like WICG, including the File System Access API, View Transitions, and Compression Streams. The project's release cadence is driven by the evolution of these web standards and TypeScript's integration schedule. A key differentiator is its proactive approach to providing types for early-stage APIs, using automated WebIDL-to-TypeScript conversion with manual refinement. It also uniquely includes worker-exclusive interfaces by default and offers specific type declarations for various worklet types through distinct import paths, helping developers target specific environments.","language":"javascript","status":"active","last_verified":"Sun Apr 19","install":{"commands":["npm install new-javascript"],"cli":null},"imports":["/// <reference types=\"new-javascript\" />","/// <reference types=\"new-javascript/worklet/audio\" />","/// <reference types=\"new-javascript/worklet/paint\" />"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"npm i -D new-javascript@latest\n\n// tsconfig.json\n// {\n//   \"compilerOptions\": {\n//     \"types\": [\"new-javascript\"],\n//     \"lib\": [\"dom\", \"dom.iterable\", \"esnext\"]\n//   }\n// }\n\n// Example TypeScript file (e.g., src/main.ts)\n/// <reference types=\"new-javascript\" />\n\nasync function demonstrateNewApiUsage() {\n  // Using File System Access API types, like FileSystemFileHandle\n  if ('showOpenFilePicker' in window) {\n    try {\n      const [fileHandle] = await window.showOpenFilePicker();\n      console.log('File picked:', fileHandle.name);\n      const file = await fileHandle.getFile();\n      console.log('File size:', file.size, 'bytes');\n      // Additional operations with fileHandle or file\n    } catch (error) {\n      if (error instanceof DOMException && error.name === 'AbortError') {\n        console.log('File picker was dismissed.');\n      } else {\n        console.error('Error with File System Access API:', error);\n      }\n    }\n  } else {\n    console.warn('File System Access API not supported by this browser.');\n  }\n\n  // Using View Transitions API types, like document.startViewTransition\n  if (document.startViewTransition) {\n    console.log('View Transitions API is supported. Starting a transition.');\n    const transition = document.startViewTransition(() => {\n      // Perform DOM updates that trigger the transition\n      const contentDiv = document.getElementById('content-area');\n      if (contentDiv) {\n        contentDiv.innerHTML = `<h2>Content updated at ${new Date().toLocaleTimeString()}</h2><p>This is new content.</p>`;\n      }\n      return Promise.resolve();\n    });\n\n    try {\n      await transition.finished;\n      console.log('View transition completed successfully.');\n    } catch (error) {\n      console.error('View transition failed:', error);\n    }\n  } else {\n    console.warn('View Transitions API not supported by this browser.');\n  }\n}\n\ndemonstrateNewApiUsage();","lang":"typescript","description":"Demonstrates how to install and configure `new-javascript` types via `tsconfig.json` and a reference directive, then utilizes types from the File System Access API and View Transitions API in a runnable TypeScript example.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}