create-outsystems-astro 0.8.2 → 0.10.0

package/template/.yarnrc.yml

@@ -0,0 +1,8 @@
+approvedGitRepositories:
+  - "**"
+enableScripts: true
+nodeLinker: node-modules
+npmMinimalAgeGate: 7d
+yarnPath: .yarn/releases/yarn-4.15.0.cjs
+npmPreapprovedPackages:
+  - "tmp@^0.2.6"

package/template/AGENTS.md

@@ -6,6 +6,7 @@
 - The output generation will be only client side. No server side rendering or server side components will be used.
 - The Astro Islands can be used generated with the following frameworks:
   - Angular - Documentation available at https://analogjs.org/docs/packages/astro-angular/overview
+  - HTML - Documentation available at https://hs2323.github.io/create-outsystems-astro/guides/integrations/html/
   - Preact - Documentation available at https://docs.astro.build/en/guides/integrations-guide/preact/
   - React - Documentation available at https://docs.astro.build/en/guides/integrations-guide/react/
   - SolidJS - Documentation available at https://docs.astro.build/en/guides/integrations-guide/solid-js/
@@ -38,6 +39,7 @@ In OutSystems Developer Cloud, the Islands library is available at https://www.o
 - The files in src/pages/\*.astro are used as a starting point and holds the components for generation. They can be tested by running `npm run dev`. That will show what the component looks like as rendered. The sample example pages are broken out by framework name (src/pages/react, src/pages/vue, etc). This page will house the component(s) entry points.
 - When importing a component, the component must have the attribute of the client:only= + the framework name.\
   - Angular: `client:load`
+  - HTML: `client:load`
   - Preact: `client:only="preact"`
   - React: `client:only="react"`
   - SolidJS: `client:only="solid-js"`
@@ -88,6 +90,10 @@ Astro slots can be sent in. A slot can be either the default one or the named on
 
 Angular does not support the use of slots. Any use of slots with Angular should be discouraged.
 
+##### HTML
+
+The HTML integration does not support the use of slots. Any use of slots with the HTML integration should be discouraged.
+
 ##### Preact
 
 - In Preact, slots are handled as props. The default slot is the `children` prop. A named slot will have the name of its slot as the parameter. For example, a slot with the following:
@@ -98,7 +104,7 @@ Angular does not support the use of slots. Any use of slots with Angular should
 
 will have the parameter named header.
 
-- The slots are then rendered using the regular React rendering parameter method. With the following Astro component:
+- The slots are then rendered using the regular Preact rendering parameter method. With the following Astro component:
 
 ```js
 ---
@@ -300,6 +306,45 @@ Nano Stores are currently supported for only Preact - https://github.com/nanosto
 
 In OutSystems, the store will be on the Window object. The Islands component will then have to access it from there.
 
+#### HTML
+
+```html
+<div class="nanostore-value"></div>
+<script>
+  const nanostoreEl = container.querySelector(".nanostore-value");
+
+  if (!window.Stores) window.Stores = {};
+  if (!window.Stores["htmlStore"]) {
+    let _value = "Test Value";
+    const _subs = [];
+    window.Stores["htmlStore"] = {
+      get: function () {
+        return _value;
+      },
+      set: function (v) {
+        _value = v;
+        _subs.forEach(function (fn) {
+          fn(v);
+        });
+      },
+      subscribe: function (fn) {
+        fn(_value);
+        _subs.push(fn);
+        return function () {
+          _subs.splice(_subs.indexOf(fn), 1);
+        };
+      },
+    };
+  }
+
+  const store = window.Stores["htmlStore"];
+  nanostoreEl.textContent = store.get();
+  store.subscribe(function (value) {
+    nanostoreEl.textContent = value;
+  });
+</script>
+```
+
 #### Preact
 
 ```jsx

package/template/README.md

@@ -0,0 +1,15 @@
+# create-outsystems-astro
+
+To install dependencies:
+
+```bash
+bun install
+```
+
+To run:
+
+```bash
+bun run
+```
+
+This project was created using `bun init` in bun v1.3.5. [Bun](https://bun.com) is a fast all-in-one JavaScript runtime.

package/template/astro.config.mjs

@@ -6,10 +6,12 @@ import solid from "@astrojs/solid-js";
 import svelte from "@astrojs/svelte";
 import vue from "@astrojs/vue";
 import { defineConfig } from "astro/config";
+import html from "islands-integrations/html";
 
 // https://astro.build/config
 export default defineConfig({
   build: {
+    assets: "assets",
     inlineStylesheets: "always",
   },
   integrations: [
@@ -20,6 +22,9 @@ export default defineConfig({
         },
       },
     }),
+    html({
+      include: ["src/framework/html/*"],
+    }),
     preact({
       compat: true,
       include: ["src/framework/preact/*"],
@@ -46,9 +51,9 @@ export default defineConfig({
     build: {
       rollupOptions: {
         output: {
-          assetFileNames: `assets/[name]_[hash].[ext]`,
-          chunkFileNames: `[name]_[hash].js`,
-          entryFileNames: `[name]_[hash].js`,
+          assetFileNames: `assets/[name].[hash].[ext]`,
+          chunkFileNames: `[name].[hash].js`,
+          entryFileNames: `[name].[hash].js`,
           manualChunks: (id) => {
             if (id.includes("node_modules")) {
               return "app";