@tinacms/app 0.0.11 → 0.0.13

package/dist/index.js

@@ -2,8 +2,22 @@ var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
 var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
 var __export = (target, all) => {
   __markAsModule(target);
@@ -29,36 +43,313 @@ __export(exports, {
 var import_plugin_react = __toModule(require("@vitejs/plugin-react"));
 var import_fs_extra = __toModule(require("fs-extra"));
 var import_vite = __toModule(require("vite"));
+var import_path2 = __toModule(require("path"));
+
+// src/tailwind.ts
+var import_tailwindcss = __toModule(require("tailwindcss"));
+var import_postcss_nested = __toModule(require("postcss-nested/index.js"));
+var import_nesting = __toModule(require("tailwindcss/nesting/index.js"));
+var import_defaultTheme = __toModule(require("tailwindcss/defaultTheme.js"));
+var import_typography = __toModule(require("@tailwindcss/typography"));
+var import_line_clamp = __toModule(require("@tailwindcss/line-clamp"));
+var import_aspect_ratio = __toModule(require("@tailwindcss/aspect-ratio"));
 var import_path = __toModule(require("path"));
+var viteTina = () => {
+  return {
+    name: "vite-plugin-tina",
+    config: () => {
+      const plugins = [];
+      const tw = (0, import_tailwindcss.default)({
+        important: ".tina-tailwind",
+        theme: {
+          columns: {
+            auto: "auto",
+            1: "1",
+            2: "2",
+            3: "3",
+            4: "4",
+            5: "5",
+            6: "6",
+            7: "7",
+            8: "8",
+            9: "9",
+            10: "10",
+            11: "11",
+            12: "12",
+            "3xs": "256px",
+            "2xs": "288px",
+            xs: "320px",
+            sm: "384px",
+            md: "448px",
+            lg: "512px",
+            xl: "576px",
+            "2xl": "672px",
+            "3xl": "768px",
+            "4xl": "896px",
+            "5xl": "1024px",
+            "6xl": "1152px",
+            "7xl": "1280px"
+          },
+          spacing: {
+            px: "1px",
+            0: "0px",
+            0.5: "2px",
+            1: "4px",
+            1.5: "6px",
+            2: "8px",
+            2.5: "10px",
+            3: "12px",
+            3.5: "14px",
+            4: "16px",
+            5: "20px",
+            6: "24px",
+            7: "28px",
+            8: "32px",
+            9: "36px",
+            10: "40px",
+            11: "44px",
+            12: "48px",
+            14: "56px",
+            16: "64px",
+            18: "72px",
+            20: "80px",
+            24: "96px",
+            28: "114px",
+            32: "128px",
+            36: "144px",
+            40: "160px",
+            44: "176px",
+            48: "192px",
+            52: "208px",
+            56: "224px",
+            60: "240px",
+            64: "256px",
+            72: "288px",
+            80: "320px",
+            96: "384px"
+          },
+          borderRadius: {
+            none: "0px",
+            sm: "2px",
+            DEFAULT: "4px",
+            md: "6px",
+            lg: "8px",
+            xl: "12px",
+            "2xl": "16px",
+            "3xl": "24px",
+            full: "9999px"
+          },
+          borderWidth: {
+            DEFAULT: "1px",
+            0: "0",
+            2: "2px",
+            3: "3px",
+            4: "4px",
+            6: "6px",
+            8: "8px"
+          },
+          fontSize: {
+            xs: ["13px", { lineHeight: "1.33" }],
+            sm: ["14px", { lineHeight: "1.43" }],
+            base: ["16px", { lineHeight: "1.5" }],
+            md: ["16px", { lineHeight: "1.5" }],
+            lg: ["18px", { lineHeight: "1.55" }],
+            xl: ["20px", { lineHeight: "1.4" }],
+            "2xl": ["24px", { lineHeight: "1.33" }],
+            "3xl": ["30px", { lineHeight: "1.2" }],
+            "4xl": ["36px", { lineHeight: "1.1" }],
+            "5xl": ["48px", { lineHeight: "1" }],
+            "6xl": ["60px", { lineHeight: "1" }],
+            "7xl": ["72px", { lineHeight: "1" }],
+            "8xl": ["96px", { lineHeight: "1" }],
+            "9xl": ["128px", { lineHeight: "1" }]
+          },
+          opacity: {
+            0: "0",
+            5: ".05",
+            7: ".07",
+            10: ".1",
+            15: ".15",
+            20: ".2",
+            25: ".25",
+            30: ".3",
+            40: ".4",
+            50: ".5",
+            60: ".6",
+            70: ".7",
+            75: ".75",
+            80: ".8",
+            90: ".9",
+            100: "1"
+          },
+          zIndex: {
+            "-1": "-1",
+            base: "9000",
+            panel: "9400",
+            menu: "9800",
+            chrome: "10200",
+            overlay: "10600",
+            modal: "10800",
+            0: "0",
+            10: "10",
+            20: "20",
+            30: "30",
+            40: "40",
+            25: "25",
+            50: "50",
+            75: "75",
+            100: "100",
+            auto: "auto"
+          },
+          extend: {
+            scale: {
+              97: ".97",
+              103: "1.03"
+            },
+            transitionDuration: {
+              0: "0ms",
+              2e3: "2000ms"
+            },
+            boxShadow: {
+              xs: "0 0 0 1px rgba(0, 0, 0, 0.05)",
+              outline: "0 0 0 3px rgba(66, 153, 225, 0.5)"
+            },
+            colors: {
+              blue: {
+                50: "#DCEEFF",
+                100: "#B4DBFF",
+                200: "#85C5FE",
+                300: "#4EABFE",
+                400: "#2296fe",
+                500: "#0084FF",
+                600: "#0574e4",
+                700: "#0D5DBD",
+                800: "#144696",
+                900: "#1D2C6C",
+                1e3: "#241748"
+              },
+              gray: {
+                50: "#F6F6F9",
+                100: "#EDECF3",
+                150: "#E6E3EF",
+                200: "#E1DDEC",
+                250: "#C9C5D5",
+                300: "#b2adbe",
+                400: "#918c9e",
+                500: "#716c7f",
+                600: "#565165",
+                700: "#433e52",
+                800: "#363145",
+                900: "#252336",
+                1e3: "#1c1b2e"
+              },
+              orange: {
+                400: "#EB6337",
+                500: "#EC4815",
+                600: "#DC4419"
+              }
+            },
+            fontFamily: {
+              sans: ["Inter", ...import_defaultTheme.default.fontFamily.sans]
+            },
+            lineHeight: {
+              3: "12px",
+              4: "16px",
+              5: "20px",
+              6: "24px",
+              7: "28px",
+              8: "32px",
+              9: "36px",
+              10: "40px"
+            },
+            maxWidth: {
+              form: "900px"
+            }
+          }
+        },
+        content: [
+          import_path.default.join(__dirname, "../appFiles/src/**/*.{vue,js,ts,jsx,tsx,svelte}")
+        ],
+        plugins: [
+          (0, import_typography.default)({ className: "tina-prose" }),
+          import_line_clamp.default,
+          import_aspect_ratio.default
+        ]
+      });
+      plugins.push(import_nesting.default);
+      plugins.push(import_postcss_nested.default);
+      plugins.push(tw);
+      return {
+        css: {
+          postcss: {
+            plugins
+          }
+        }
+      };
+    }
+  };
+};
+
+// src/index.ts
+var import_esbuild = __toModule(require("esbuild"));
+var server;
 var viteBuild = async ({
   rootPath,
   outputFolder,
   publicFolder,
-  local
+  local,
+  apiUrl
 }) => {
-  const root = import_path.default.resolve(__dirname, "..", "appFiles");
-  const pathToConfig = import_path.default.join(rootPath, ".tina", "config");
-  const outDir = import_path.default.join(rootPath, publicFolder, outputFolder);
+  const prebuildPath = import_path2.default.resolve(__dirname, "assets");
+  const pathToConfig = import_path2.default.join(rootPath, ".tina", "config");
+  const packageJSONFilePath = import_path2.default.join(rootPath, "package.json");
+  const outDir = import_path2.default.join(rootPath, publicFolder, outputFolder);
   await import_fs_extra.default.emptyDir(outDir);
   await import_fs_extra.default.ensureDir(outDir);
-  await import_fs_extra.default.writeFile(import_path.default.join(rootPath, publicFolder, outputFolder, ".gitignore"), `index.html
+  await import_fs_extra.default.writeFile(import_path2.default.join(rootPath, publicFolder, outputFolder, ".gitignore"), `index.html
 assets/
 vite.svg`);
+  const packageJSON = JSON.parse(import_fs_extra.default.readFileSync(packageJSONFilePath).toString() || "{}");
+  const define = {};
+  const deps = (packageJSON == null ? void 0 : packageJSON.dependencies) || [];
+  const peerDeps = (packageJSON == null ? void 0 : packageJSON.peerDependencies) || [];
+  const devDeps = (packageJSON == null ? void 0 : packageJSON.devDependencies) || [];
+  const external = Object.keys(__spreadValues(__spreadValues(__spreadValues({}, deps), peerDeps), devDeps));
+  const out = import_path2.default.join(rootPath, ".tina", "__generated__", "out.jsx");
+  await (0, import_esbuild.build)({
+    bundle: true,
+    platform: "browser",
+    target: ["es2020"],
+    entryPoints: [pathToConfig],
+    format: "esm",
+    treeShaking: true,
+    outfile: out,
+    external: [...external, "./node_modules/*"],
+    loader: loaders,
+    define
+  });
   const base = `/${outputFolder}/`;
+  const MONOREPO_DEV = process.env.MONOREPO_DEV;
+  const root = MONOREPO_DEV ? import_path2.default.join(__dirname, "../appFiles") : outDir;
   const config = {
     root,
     base,
     mode: local ? "development" : "production",
-    plugins: [(0, import_plugin_react.default)()],
+    plugins: [(0, import_plugin_react.default)(), viteTina()],
     define: {
-      "process.env": {}
+      "process.env": {},
+      __API_URL__: `"${apiUrl}"`
     },
     server: {
-      strictPort: true
+      strictPort: true,
+      port: 5173,
+      fs: {
+        strict: false
+      }
     },
     resolve: {
       alias: {
-        TINA_IMPORT: pathToConfig
+        TINA_IMPORT: out
       }
     },
     build: {
@@ -68,7 +359,52 @@ vite.svg`);
     },
     logLevel: "silent"
   };
-  await (0, import_vite.build)(config);
+  if (local) {
+    const indexDev = await import_fs_extra.default.readFileSync(import_path2.default.join(__dirname, "index.dev.html")).toString();
+    if (MONOREPO_DEV) {
+      console.warn("MONOREPO_DEV mode, vite root is @tinacms/app");
+      await import_fs_extra.default.outputFileSync(import_path2.default.join(outDir, "index.html"), indexDev.replace(`INSERT_OUTPUT_FOLDER_NAME`, outputFolder).replace("assets/out.es.js", "src/main.tsx"));
+    } else {
+      await import_fs_extra.default.outputFileSync(import_path2.default.join(outDir, "index.html"), indexDev.replace(`INSERT_OUTPUT_FOLDER_NAME`, outputFolder));
+      await import_fs_extra.default.copySync(prebuildPath, import_path2.default.join(outDir, "assets"));
+    }
+    if (server) {
+      await server.close();
+    }
+    server = await (0, import_vite.createServer)(config);
+    await server.listen();
+    await server.printUrls();
+  } else {
+    await import_fs_extra.default.copyFileSync(import_path2.default.join(__dirname, "index.html"), import_path2.default.join(outDir, "index.html"));
+    await import_fs_extra.default.copySync(prebuildPath, import_path2.default.join(outDir, "assets"));
+    await (0, import_vite.build)(config);
+    await import_fs_extra.default.rmSync(out);
+  }
+};
+var loaders = {
+  ".aac": "file",
+  ".css": "file",
+  ".eot": "file",
+  ".flac": "file",
+  ".gif": "file",
+  ".jpeg": "file",
+  ".jpg": "file",
+  ".json": "json",
+  ".mp3": "file",
+  ".mp4": "file",
+  ".ogg": "file",
+  ".otf": "file",
+  ".png": "file",
+  ".svg": "file",
+  ".ttf": "file",
+  ".wav": "file",
+  ".webm": "file",
+  ".webp": "file",
+  ".woff": "file",
+  ".woff2": "file",
+  ".js": "jsx",
+  ".jsx": "jsx",
+  ".tsx": "tsx"
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/prebuild.d.ts

@@ -0,0 +1 @@
+export * from "../src/prebuild"

package/dist/prebuild.js

@@ -0,0 +1,302 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+
+// src/prebuild.ts
+var import_plugin_react = __toModule(require("@vitejs/plugin-react"));
+var import_vite = __toModule(require("vite"));
+var import_path2 = __toModule(require("path"));
+var import_fs_extra = __toModule(require("fs-extra"));
+
+// src/tailwind.ts
+var import_tailwindcss = __toModule(require("tailwindcss"));
+var import_postcss_nested = __toModule(require("postcss-nested/index.js"));
+var import_nesting = __toModule(require("tailwindcss/nesting/index.js"));
+var import_defaultTheme = __toModule(require("tailwindcss/defaultTheme.js"));
+var import_typography = __toModule(require("@tailwindcss/typography"));
+var import_line_clamp = __toModule(require("@tailwindcss/line-clamp"));
+var import_aspect_ratio = __toModule(require("@tailwindcss/aspect-ratio"));
+var import_path = __toModule(require("path"));
+var viteTina = () => {
+  return {
+    name: "vite-plugin-tina",
+    config: () => {
+      const plugins = [];
+      const tw = (0, import_tailwindcss.default)({
+        important: ".tina-tailwind",
+        theme: {
+          columns: {
+            auto: "auto",
+            1: "1",
+            2: "2",
+            3: "3",
+            4: "4",
+            5: "5",
+            6: "6",
+            7: "7",
+            8: "8",
+            9: "9",
+            10: "10",
+            11: "11",
+            12: "12",
+            "3xs": "256px",
+            "2xs": "288px",
+            xs: "320px",
+            sm: "384px",
+            md: "448px",
+            lg: "512px",
+            xl: "576px",
+            "2xl": "672px",
+            "3xl": "768px",
+            "4xl": "896px",
+            "5xl": "1024px",
+            "6xl": "1152px",
+            "7xl": "1280px"
+          },
+          spacing: {
+            px: "1px",
+            0: "0px",
+            0.5: "2px",
+            1: "4px",
+            1.5: "6px",
+            2: "8px",
+            2.5: "10px",
+            3: "12px",
+            3.5: "14px",
+            4: "16px",
+            5: "20px",
+            6: "24px",
+            7: "28px",
+            8: "32px",
+            9: "36px",
+            10: "40px",
+            11: "44px",
+            12: "48px",
+            14: "56px",
+            16: "64px",
+            18: "72px",
+            20: "80px",
+            24: "96px",
+            28: "114px",
+            32: "128px",
+            36: "144px",
+            40: "160px",
+            44: "176px",
+            48: "192px",
+            52: "208px",
+            56: "224px",
+            60: "240px",
+            64: "256px",
+            72: "288px",
+            80: "320px",
+            96: "384px"
+          },
+          borderRadius: {
+            none: "0px",
+            sm: "2px",
+            DEFAULT: "4px",
+            md: "6px",
+            lg: "8px",
+            xl: "12px",
+            "2xl": "16px",
+            "3xl": "24px",
+            full: "9999px"
+          },
+          borderWidth: {
+            DEFAULT: "1px",
+            0: "0",
+            2: "2px",
+            3: "3px",
+            4: "4px",
+            6: "6px",
+            8: "8px"
+          },
+          fontSize: {
+            xs: ["13px", { lineHeight: "1.33" }],
+            sm: ["14px", { lineHeight: "1.43" }],
+            base: ["16px", { lineHeight: "1.5" }],
+            md: ["16px", { lineHeight: "1.5" }],
+            lg: ["18px", { lineHeight: "1.55" }],
+            xl: ["20px", { lineHeight: "1.4" }],
+            "2xl": ["24px", { lineHeight: "1.33" }],
+            "3xl": ["30px", { lineHeight: "1.2" }],
+            "4xl": ["36px", { lineHeight: "1.1" }],
+            "5xl": ["48px", { lineHeight: "1" }],
+            "6xl": ["60px", { lineHeight: "1" }],
+            "7xl": ["72px", { lineHeight: "1" }],
+            "8xl": ["96px", { lineHeight: "1" }],
+            "9xl": ["128px", { lineHeight: "1" }]
+          },
+          opacity: {
+            0: "0",
+            5: ".05",
+            7: ".07",
+            10: ".1",
+            15: ".15",
+            20: ".2",
+            25: ".25",
+            30: ".3",
+            40: ".4",
+            50: ".5",
+            60: ".6",
+            70: ".7",
+            75: ".75",
+            80: ".8",
+            90: ".9",
+            100: "1"
+          },
+          zIndex: {
+            "-1": "-1",
+            base: "9000",
+            panel: "9400",
+            menu: "9800",
+            chrome: "10200",
+            overlay: "10600",
+            modal: "10800",
+            0: "0",
+            10: "10",
+            20: "20",
+            30: "30",
+            40: "40",
+            25: "25",
+            50: "50",
+            75: "75",
+            100: "100",
+            auto: "auto"
+          },
+          extend: {
+            scale: {
+              97: ".97",
+              103: "1.03"
+            },
+            transitionDuration: {
+              0: "0ms",
+              2e3: "2000ms"
+            },
+            boxShadow: {
+              xs: "0 0 0 1px rgba(0, 0, 0, 0.05)",
+              outline: "0 0 0 3px rgba(66, 153, 225, 0.5)"
+            },
+            colors: {
+              blue: {
+                50: "#DCEEFF",
+                100: "#B4DBFF",
+                200: "#85C5FE",
+                300: "#4EABFE",
+                400: "#2296fe",
+                500: "#0084FF",
+                600: "#0574e4",
+                700: "#0D5DBD",
+                800: "#144696",
+                900: "#1D2C6C",
+                1e3: "#241748"
+              },
+              gray: {
+                50: "#F6F6F9",
+                100: "#EDECF3",
+                150: "#E6E3EF",
+                200: "#E1DDEC",
+                250: "#C9C5D5",
+                300: "#b2adbe",
+                400: "#918c9e",
+                500: "#716c7f",
+                600: "#565165",
+                700: "#433e52",
+                800: "#363145",
+                900: "#252336",
+                1e3: "#1c1b2e"
+              },
+              orange: {
+                400: "#EB6337",
+                500: "#EC4815",
+                600: "#DC4419"
+              }
+            },
+            fontFamily: {
+              sans: ["Inter", ...import_defaultTheme.default.fontFamily.sans]
+            },
+            lineHeight: {
+              3: "12px",
+              4: "16px",
+              5: "20px",
+              6: "24px",
+              7: "28px",
+              8: "32px",
+              9: "36px",
+              10: "40px"
+            },
+            maxWidth: {
+              form: "900px"
+            }
+          }
+        },
+        content: [
+          import_path.default.join(__dirname, "../appFiles/src/**/*.{vue,js,ts,jsx,tsx,svelte}")
+        ],
+        plugins: [
+          (0, import_typography.default)({ className: "tina-prose" }),
+          import_line_clamp.default,
+          import_aspect_ratio.default
+        ]
+      });
+      plugins.push(import_nesting.default);
+      plugins.push(import_postcss_nested.default);
+      plugins.push(tw);
+      return {
+        css: {
+          postcss: {
+            plugins
+          }
+        }
+      };
+    }
+  };
+};
+
+// src/prebuild.ts
+var prebuild = async () => {
+  const outDir = import_path2.default.join(__dirname, "../dist/assets");
+  const outDevHTML = import_path2.default.join(__dirname, "../dist/index.dev.html");
+  await import_fs_extra.default.copyFileSync(import_path2.default.join(__dirname, "../appFiles/index.dev.html"), outDevHTML);
+  const outHTML = import_path2.default.join(__dirname, "../dist/index.html");
+  await import_fs_extra.default.copyFileSync(import_path2.default.join(__dirname, "../appFiles/index.html"), outHTML);
+  const entry = import_path2.default.join(__dirname, "../appFiles/src/main.tsx");
+  const libConfig = {
+    plugins: [(0, import_plugin_react.default)(), viteTina()],
+    define: {
+      __API_URL__: `__API_URL__`
+    },
+    build: {
+      minify: false,
+      sourcemap: false,
+      rollupOptions: {
+        external: "TINA_IMPORT"
+      },
+      outDir,
+      emptyOutDir: true,
+      lib: {
+        entry,
+        formats: ["es"],
+        fileName: "out"
+      }
+    },
+    logLevel: "silent"
+  };
+  await (0, import_vite.build)(libConfig);
+};
+prebuild();