@osimart/create-storefront 0.0.0-stage → 1.0.1

package/nuxt/osi-sections.ts

@@ -0,0 +1,56 @@
+import { existsSync, readdirSync } from "node:fs";
+import { join } from "node:path";
+import { addTemplate, defineNuxtModule, updateTemplates } from "@nuxt/kit";
+
+/**
+ * Builds the section registry (#build/osi-sections.mjs) from `app/sections`
+ * in every layer — in practice the theme repo.
+ *
+ * nuxt.options._layers is ordered highest priority first, so it's walked in
+ * reverse: a higher layer's file with the same name replaces a lower one.
+ */
+const FILENAME = "osi-sections.mjs";
+const SECTION_FILE = /Section\.vue$/;
+
+/** HeroSection.vue -> HERO ; MediaWithTextSection.vue -> MEDIA_WITH_TEXT */
+function typeFromFile(file: string) {
+  return file
+    .replace(SECTION_FILE, "")
+    .replace(/([a-z0-9])([A-Z])/g, "$1_$2")
+    .toUpperCase();
+}
+
+export default defineNuxtModule({
+  meta: { name: "osi-sections" },
+  setup(_options, nuxt) {
+    const sectionDirs = () =>
+      [...nuxt.options._layers]
+        .reverse()
+        .map((layer) => join(layer.config.srcDir || join(layer.cwd, "app"), "sections"));
+
+    addTemplate({
+      filename: FILENAME,
+      write: true,
+      getContents() {
+        const map = new Map<string, string>();
+        for (const dir of sectionDirs()) {
+          if (!existsSync(dir)) continue;
+          for (const file of readdirSync(dir)) {
+            if (SECTION_FILE.test(file)) map.set(typeFromFile(file), join(dir, file));
+          }
+        }
+        const lines = [...map].map(
+          ([type, path]) => `  ${JSON.stringify(type)}: () => import(${JSON.stringify(path)}),`
+        );
+        return `export const sectionLoaders = {\n${lines.join("\n")}\n};\n`;
+      },
+    });
+
+    // A section file added or removed in dev regenerates the map.
+    nuxt.hook("builder:watch", async (event, path) => {
+      if (event !== "add" && event !== "unlink") return;
+      if (!/(^|[\\/])sections[\\/][^\\/]+Section\.vue$/.test(path)) return;
+      await updateTemplates({ filter: (t) => t.filename === FILENAME });
+    });
+  },
+});

package/nuxt.config.ts

@@ -0,0 +1,60 @@
+import { fileURLToPath } from "node:url";
+import osiSections from "./nuxt/osi-sections";
+
+/**
+ * @ositcom/create-storefront — the platform. Extended by every theme repo:
+ *
+ *   extends: ["@ositcom/create-storefront"]
+ *
+ * This package holds the logic (composables, services, the script of every
+ * theme section/component under app/logic), the platform pages (routing,
+ * checkout, account, auth, builder preview) and the CLI. The theme repo holds
+ * the look: sections, components, layout, CSS and the theme JSON.
+ *
+ * Inside a layer `~` points at the *consuming* app (the theme), so the core
+ * never imports through `~`. It uses:
+ *   #osi/...       this package's app/ (composables, services, utils, theme)
+ *   #logic/...     the script behind each theme file (app/logic)
+ *   #components    components — resolves to the theme's when one exists
+ */
+const appDir = fileURLToPath(new URL("./app", import.meta.url));
+
+export default defineNuxtConfig({
+  compatibilityDate: "2025-07-15",
+
+  alias: {
+    "#osi": appDir,
+    "#logic": `${appDir}/logic`,
+  },
+
+  // Flat names (SiteHeader, not LayoutSiteHeader). A store overrides one by
+  // creating a component with the same file name anywhere in its components/.
+  components: [{ path: `${appDir}/components`, pathPrefix: false }],
+
+  modules: ["@nuxtjs/sitemap", "@pinia/nuxt", osiSections],
+
+  ssr: true,
+
+  // The dashboard embeds the storefront in an iframe for the builder preview.
+  // Only the preview route is relaxed; every other page keeps the default DENY.
+  routeRules: {
+    "/__builder-preview": {
+      headers: {
+        "X-Frame-Options": "ALLOWALL",
+        "Content-Security-Policy": "frame-ancestors *",
+      },
+    },
+  },
+
+  css: ["vue-toastification/dist/index.css"],
+
+  runtimeConfig: {
+    public: {
+      storeApiBase: "",
+    },
+  },
+
+  build: {
+    transpile: ["vue-toastification", "vue-spinner"],
+  },
+});

package/package.json

@@ -1,6 +1,46 @@
 {
   "name": "@osimart/create-storefront",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "1.0.1",
+  "description": "Osimart storefront platform — logic, platform pages and CLI; extended by every theme repo",
+  "type": "module",
+  "main": "./nuxt.config.ts",
+  "bin": {
+    "osimart-theme": "./bin/osimart-theme.mjs"
+  },
+  "files": [
+    "app",
+    "bin",
+    "nuxt",
+    "public",
+    "nuxt.config.ts",
+    "THEME_DEV_API.md"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://git.osinode.com/salim/create-storefront.git"
+  },
+  "peerDependencies": {
+    "nuxt": "^4.5.2"
+  },
+  "dependencies": {
+    "@floating-ui/vue": "^2.0.1",
+    "@nuxt/kit": "^4.5.2",
+    "@nuxtjs/sitemap": "^7.2.10",
+    "@pinia/nuxt": "^1.0.1",
+    "@tanstack/vue-query": "^5.91.2",
+    "js-cookie": "^3.0.5",
+    "pinia": "^4.0.2",
+    "swiper": "^11.2.6",
+    "vue-skeletor": "^1.0.6",
+    "vue-spinner": "^1.0.4",
+    "vue-toastification": "^2.0.0-rc.5"
+  },
+  "devDependencies": {
+    "nuxt": "^4.5.2"
+  },
+  "license": "UNLICENSED",
+  "homepage": "https://osimart.com"
+}

package/public/css/input.css

@@ -0,0 +1,29 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+body {
+  overflow-x: hidden; 
+  margin: 0;         
+  padding: 0;        
+}
+::-webkit-scrollbar {
+    width: 3px;
+}
+
+::-webkit-scrollbar-thumb {
+    background: #7b88948b;
+}
+
+::-webkit-scrollbar-track {
+    background: #5a5a5a00;
+}
+
+input[type="checkbox"]:checked {
+    background-color: 000000;
+    border-color: transparent;
+    background-image: url(data:image/svg+xml;charset=UTF-8,%3Csvg%20viewBox%3D%220%200%2012%209%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M1%204.5L4.5%208L11%201%22%20stroke%3D%22%23fff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E);
+    background-size: 60%;
+    background-position: center;
+    background-repeat: no-repeat;
+}