Skip to content

Commit

Permalink
add autocompletion provider for wpcodebox2
Browse files Browse the repository at this point in the history
  • Loading branch information
suabahasa committed Feb 24, 2025
1 parent 4986635 commit 67eca4d
Show file tree
Hide file tree
Showing 5 changed files with 151 additions and 30 deletions.
2 changes: 1 addition & 1 deletion assets/packages/core/tailwindcss-v4/stylesheet.js
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ export async function loadStylesheet(id, base, volume = {}) {
// CDN

// fetch and store in volume
await fetch(`https://esm.sh${_path}`)
await fetch(`https://esm.sh/${_path}`)
.then((response) => response.text())
.then((data) => {
data = data
Expand Down
4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@
"unplugin-icons": "^22.1.0",
"unplugin-vue-components": "^28.4.0",
"vite": "^6.1.1",
"vite-plugin-external": "^6.0.0",
"vite-plugin-external": "^6.0.1",
"vite-plugin-https-imports": "https://pkg.pr.new/wind-press/vite-plugin-https-imports@28e1201",
"vite-plugin-node-polyfills": "^0.23.0",
"vite-plugin-svgr": "^4.3.0",
Expand Down Expand Up @@ -80,7 +80,7 @@
"lz-string": "https://pkg.pr.new/wind-press/lz-string@2c61edc",
"minimatch": "^10.0.1",
"monaco-editor": "^0.52.2",
"nanoid": "^5.1.0",
"nanoid": "^5.1.2",
"pinia": "^3.0.1",
"postcss": "^8.5.3",
"postcss-import": "^16.1.0",
Expand Down
52 changes: 26 additions & 26 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

117 changes: 117 additions & 0 deletions src/Integration/WPCodeBox2/Editor.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,117 @@
<?php

/*
* This file is part of the WindPress package.
*
* (c) Joshua Gugun Siagian <suabahasa@gmail.com>
*
* For the full copyright and license information, please view the LICENSE
* file that was distributed with this source code.
*/

declare(strict_types=1);

namespace WindPress\WindPress\Integration\WPCodeBox2;

use WIND_PRESS;
use WindPress\WindPress\Core\Runtime;

/**
* @author Joshua Gugun Siagian <suabahasa@gmail.com>
*/
class Editor
{
public function __construct()
{
foreach (['toplevel_page_wpcodebox2', 'tools_page_wpcodebox2'] as $hook) {
add_action('load-' . $hook, function () {
add_action('admin_head', fn () => $this->editor_assets(), 1_000_001);
});
}
}

public function editor_assets()
{
Runtime::get_instance()->print_windpress_metadata();
Runtime::get_instance()->enqueue_play_cdn();
wp_enqueue_script(WIND_PRESS::WP_OPTION . ':autocomplete');
wp_dequeue_script(WIND_PRESS::WP_OPTION . ':observer');

echo <<<HTML
<script>
document.addEventListener('DOMContentLoaded', async function () {
while (!window.monaco) {
await new Promise(resolve => setTimeout(resolve, 100));
}
// create an hidden iframe and mount it
let iframe = document.createElement('iframe');
iframe.style.display = 'none';
document.body.appendChild(iframe);
// filter the script elements. Search for the script with the id prefixed with 'windpress:' except 'windpress:integration-'
let scriptElements = document.querySelectorAll('script');
scriptElements = Array.from(scriptElements).filter(scriptElement => {
let id = scriptElement.getAttribute('id');
return id && (id.startsWith('windpress:') || id.startsWith('vite-client')) && !id.startsWith('windpress:integration-');
});
// move all the script elements to the iframe
scriptElements.forEach(scriptElement => {
iframe.contentDocument.head.appendChild(document.createRange().createContextualFragment(scriptElement.outerHTML));
// remove the script element from the parent document
scriptElement.remove();
});
// Register completion provider for HTML and PHP
['html', 'php'].forEach(language => {
monaco.languages.registerCompletionItemProvider(language, {
triggerCharacters: [' '], // Trigger on space for multiple classes
provideCompletionItems: async (model, position) => {
const textUntilPosition = model.getValueInRange({
startLineNumber: position.lineNumber,
startColumn: 1,
endLineNumber: position.lineNumber,
endColumn: position.column,
});
if (!/class=["|'][^"']*$/i.test(textUntilPosition)) {
return { suggestions: [] };
}
// Check if we are inside a class attribute
const match = textUntilPosition.match(/class=["']([^"']*)$/);
if (!match) return { suggestions: [] };
let userInput = match[1].split(' ').pop(); // Get the current class input
if (!userInput) return { suggestions: [] };
const windpress_suggestions = await iframe.contentWindow.windpress.module.autocomplete.query(userInput);
return {
suggestions: windpress_suggestions.map(entry => ({
kind: entry.color
? 19 //monaco.languages.CompletionItemKind.Color
: 14, //monaco.languages.CompletionItemKind.Constant,
label: entry.value,
insertText: entry.value,
detail: entry.value,
range: {
startLineNumber: position.lineNumber,
endLineNumber: position.lineNumber,
startColumn: textUntilPosition.length - (userInput.length - 1),
endColumn: position.column
}
}))
};
return { suggestions: [] };
}
});
});
});
</script>
HTML;
}
}
6 changes: 5 additions & 1 deletion src/Integration/WPCodeBox2/Main.php
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,11 @@ class Main implements IntegrationInterface
{
public function __construct()
{
add_filter('f!windpress/core/cache:compile.providers', fn (array $providers): array => $this->register_provider($providers));
add_filter('f!windpress/core/cache:compile.providers', fn(array $providers): array => $this->register_provider($providers));

if ($this->is_enabled()) {
new Editor();
}
}

public function get_name(): string
Expand Down

0 comments on commit 67eca4d

Please sign in to comment.