|
1 | 1 | # JavaScriptKit |
2 | 2 |
|
3 | 3 | [](https://github.com/swiftwasm/JavaScriptKit/actions/workflows/test.yml) |
4 | | -[](https://swiftpackageindex.com/swiftwasm/JavaScriptKit/documentation) |
| 4 | +[](https://swiftpackageindex.com/swiftwasm/JavaScriptKit/documentation) |
5 | 5 |
|
6 | 6 | Swift framework to interact with JavaScript through WebAssembly. |
7 | 7 |
|
@@ -40,7 +40,81 @@ button.onclick = .object(JSClosure { _ in |
40 | 40 | _ = document.body.appendChild(button) |
41 | 41 | ``` |
42 | 42 |
|
43 | | -Check out the [examples](https://github.com/swiftwasm/JavaScriptKit/tree/main/Examples) for more detailed usage. |
| 43 | +**Learn more:** [JavaScript Interop Cheat Sheet](https://swiftpackageindex.com/swiftwasm/JavaScriptKit/documentation/javascriptkit/javascript-interop-cheat-sheet) |
| 44 | + |
| 45 | +## BridgeJS Plugin |
| 46 | + |
| 47 | +> **Note:** BridgeJS is experimental. APIs may change in future releases. |
| 48 | +
|
| 49 | +BridgeJS provides easy interoperability between Swift and JavaScript/TypeScript. It enables: |
| 50 | + |
| 51 | +- **Exporting Swift APIs to JavaScript**: Make your Swift code callable from JavaScript |
| 52 | +- **Importing TypeScript APIs into Swift**: Use JavaScript APIs with type safety in Swift |
| 53 | + |
| 54 | +For architecture details, see the [BridgeJS Plugin README](Plugins/BridgeJS/README.md). |
| 55 | + |
| 56 | +### Exporting Swift to JavaScript |
| 57 | + |
| 58 | +Mark Swift code with `@JS` to make it callable from JavaScript: |
| 59 | + |
| 60 | +```swift |
| 61 | +import JavaScriptKit |
| 62 | + |
| 63 | +@JS class Greeter { |
| 64 | + @JS var name: String |
| 65 | + |
| 66 | + @JS init(name: String) { |
| 67 | + self.name = name |
| 68 | + } |
| 69 | + |
| 70 | + @JS func greet() -> String { |
| 71 | + return "Hello, \(name)!" |
| 72 | + } |
| 73 | +} |
| 74 | +``` |
| 75 | + |
| 76 | +**JavaScript usage:** |
| 77 | +```javascript |
| 78 | +const greeter = new exports.Greeter("World"); |
| 79 | +console.log(greeter.greet()); // "Hello, World!" |
| 80 | +``` |
| 81 | + |
| 82 | +**Learn more:** [Exporting Swift to JavaScript](https://swiftpackageindex.com/swiftwasm/JavaScriptKit/documentation/javascriptkit/exporting-swift-to-javascript) |
| 83 | + |
| 84 | +### Importing TypeScript into Swift |
| 85 | + |
| 86 | +Define TypeScript interfaces and BridgeJS generates type-safe Swift bindings: |
| 87 | + |
| 88 | +```typescript |
| 89 | +// bridge-js.d.ts |
| 90 | +interface Document { |
| 91 | + title: string; |
| 92 | + getElementById(id: string): HTMLElement; |
| 93 | + createElement(tagName: string): HTMLElement; |
| 94 | +} |
| 95 | + |
| 96 | +export function getDocument(): Document; |
| 97 | +``` |
| 98 | + |
| 99 | +**Swift usage:** |
| 100 | +```swift |
| 101 | +@JS func run() throws(JSException) { |
| 102 | + let document = try getDocument() |
| 103 | + try document.setTitle("My Swift App") |
| 104 | + let button = try document.createElement("button") |
| 105 | + try button.setInnerText("Click Me") |
| 106 | +} |
| 107 | +``` |
| 108 | + |
| 109 | +**Learn more:** [Importing TypeScript into Swift](https://swiftpackageindex.com/swiftwasm/JavaScriptKit/documentation/javascriptkit/importing-typescript-into-swift) |
| 110 | + |
| 111 | +### Try It Online |
| 112 | + |
| 113 | +Use the [BridgeJS Playground](https://swiftwasm.org/JavaScriptKit/PlayBridgeJS/) to preview what interfaces will be exposed on the Swift/TypeScript sides. |
| 114 | + |
| 115 | +## Examples |
| 116 | + |
| 117 | +Check out the [examples](https://github.com/swiftwasm/JavaScriptKit/tree/main/Examples) for more detailed usage patterns. |
44 | 118 |
|
45 | 119 | ## Contributing |
46 | 120 |
|
|
0 commit comments