@tinacms/app 0.0.12 → 0.0.13

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();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tinacms/app",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "main": "dist/index.js",
   "exports": {
     ".": {
@@ -11,14 +11,7 @@
   },
   "typings": "dist/index.d.ts",
   "files": [
-    "dist",
-    "script.mjs",
-    "package.json",
-    "public",
-    "appFiles",
-    "tsconfig.json",
-    "tsconfig.node.json",
-    "vite.config.ts"
+    "dist"
   ],
   "license": "Apache-2.0",
   "buildConfig": {
@@ -26,6 +19,10 @@
       {
         "name": "src/index.ts",
         "target": "node"
+      },
+      {
+        "name": "src/prebuild.ts",
+        "target": "node"
       }
     ]
   },
@@ -40,9 +37,9 @@
     "@tailwindcss/aspect-ratio": "^0.4.0",
     "@tailwindcss/line-clamp": "^0.3.1",
     "@tailwindcss/typography": "^0.5.4",
-    "@tinacms/schema-tools": "0.1.3",
+    "@tinacms/schema-tools": "0.1.4",
     "@tinacms/scripts": "0.51.1",
-    "@vitejs/plugin-react": "1.3.2",
+    "@vitejs/plugin-react": "^1.3.2",
     "@xstate/react": "^3.0.0",
     "autoprefixer": "^10.4.0",
     "final-form": "^4.20.7",
@@ -54,16 +51,18 @@
     "postcss-nested": "^5.0.6",
     "react": "17.0.2",
     "react-dom": "17.0.2",
+    "react-is": "18.2.0",
     "react-router-dom": "6",
+    "styled-components": "5.3.5",
     "tailwindcss": "^3.1.6",
-    "tinacms": "0.69.7",
+    "tinacms": "0.69.8",
     "typescript": "^4.6.4",
-    "vite": "^2.4.3",
-    "vite-node": "^0.18.1",
+    "vite": "2.9.15",
+    "vite-node": "^0.23.4",
     "xstate": "^4.32.1"
   },
   "scripts": {
     "types": "rm dist/index.d.ts && touch dist/index.d.ts && echo \"export declare const viteBuild: (args: any) => any\" > dist/index.d.ts",
-    "build": "tinacms-scripts build"
+    "build": "tinacms-scripts build && node dist/prebuild.js"
   }
 }

package/appFiles/lib/formify/formify-utils.ts

@@ -1,299 +0,0 @@
-/**
-Copyright 2021 Forestry.io Holdings, Inc.
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-    http://www.apache.org/licenses/LICENSE-2.0
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-import * as G from 'graphql'
-
-import type { BlueprintPath } from './types'
-import { getBlueprintNamePath } from './util'
-
-/**
- *
- * This check ensures that at type is a Document, but only one
- * that can be "formified". When using `Node` or `Document`, those
- * query fields should not have forms generated since they can't contain
- * fields.
- *
- * ```graphql
- * # Can be formified
- * {
- *   getPostDocument(relativePath: "") {
- *     data {
- *       title
- *     }
- *   }
- * }
- * ```
- *
- * ```graphql
- * # cannot be formified, even though it is a document field
- * {
- *   getPostDocument(relativePath: "") {
- *     ...on Document {
- *       id
- *     }
- *   }
- * }
- * ```
- */
-export const isFormifiableDocument = (t: G.GraphQLOutputType) => {
-  const type = G.getNamedType(t)
-  if (G.isUnionType(type)) {
-    return type.getTypes().every((type) => {
-      return type.getInterfaces().find((intfc) => intfc.name === 'Node')
-    })
-  } else if (G.isObjectType(type)) {
-    return !!type.getInterfaces().find((intfc) => intfc.name === 'Node')
-  } else {
-    return false
-  }
-}
-
-export const isScalarType = (t: G.GraphQLOutputType) => {
-  const namedType = G.getNamedType(t)
-  return G.isScalarType(namedType)
-}
-
-export const isConnectionField = (t: G.GraphQLOutputType) => {
-  const type = G.getNamedType(t)
-  if (G.isObjectType(type)) {
-    return !!type.getInterfaces().find((intfc) => intfc.name === 'Connection')
-  } else {
-    throw new Error(`Expected GraphQLObjectType for isConnectionField check`)
-  }
-}
-
-/**
- * Selects the appropriate field from a GraphQLObject based on the selection's name
- */
-export const getObjectField = (
-  object: G.GraphQLOutputType,
-  selectionNode: G.FieldNode
-) => {
-  const namedType = G.getNamedType(object)
-  ensureObjectOrInterfaceType(namedType)
-  return namedType.getFields()[selectionNode.name.value]
-}
-
-/**
- * Selects the appropriate type from a union based on the selection's typeCondition
- *
- * ```graphql
- * post {
- *    # would return PostDocument
- *   ...on PostDocument { ... }
- * }
- * ```
- */
-export const getSelectedUnionType = (
-  unionType: G.GraphQLOutputType,
-  selectionNode: G.InlineFragmentNode
-) => {
-  const namedType = G.getNamedType(unionType)
-  if (!G.isUnionType(namedType)) {
-    return
-  }
-  const types = namedType.getTypes()
-
-  const typeCondition = selectionNode.typeCondition.name.value
-  let intfc
-  types.forEach((type) => {
-    intfc = type.getInterfaces().find((intfc) => intfc.name === typeCondition)
-  })
-  if (intfc) {
-    return intfc
-  }
-
-  return namedType.getTypes().find((type) => type.name === typeCondition)
-}
-
-/**
- * Checks if the given type is a list type. Even though
- * this function is built-in to GraphQL it doesn't handle
- * the scenario where the list type is wrapped in a non-null
- * type, so the extra check here is needed.
- */
-export function isListType(type: unknown) {
-  if (G.isListType(type)) {
-    return true
-  } else if (G.isNonNullType(type)) {
-    if (G.isListType(type.ofType)) {
-      return true
-    }
-  }
-  return false
-}
-
-/**
- *
- * Throws an error if the provided type is not a GraphQLUnionType
- */
-function ensureUnionType(type: unknown): asserts type is G.GraphQLUnionType {
-  if (!G.isUnionType(type)) {
-    throw new Error(`Expected type to be GraphQLUnionType`)
-  }
-}
-
-/**
- *
- * Throws an error if the provided type is not a GraphQLObjectType or GraphQLInterfaceType
- */
-function ensureObjectOrInterfaceType(
-  type: unknown
-): asserts type is G.GraphQLObjectType | G.GraphQLInterfaceType {
-  if (G.isInterfaceType(type) || G.isObjectType(type)) {
-  } else {
-    console.log(
-      'Expected type to be GraphQLObjectType or GraphQLInterfaceType',
-      type
-    )
-    throw new Error(
-      `Expected type to be GraphQLObjectType or GraphQLInterfaceType`
-    )
-  }
-}
-
-/**
- *
- * Throws an error if the provided type is not a GraphQLUnionType
- */
-export function ensureOperationDefinition(
-  type: G.DefinitionNode
-): asserts type is G.OperationDefinitionNode {
-  if (type.kind !== 'OperationDefinition') {
-    throw new Error(
-      `Expected top-level definition to be an OperationDefinition node, ensure your query has been optimized before calling formify`
-    )
-  }
-}
-
-/**
- * Generates the name and alias information for a given field node
- * and appends it to a shallow copy of the path provided
- */
-export function buildPath({
-  fieldNode,
-  type,
-  parentTypename,
-  path,
-}: {
-  fieldNode: G.FieldNode
-  type: G.GraphQLOutputType
-  parentTypename?: string
-  path?: BlueprintPath[]
-}): BlueprintPath[] {
-  const p = path || []
-  const list = isListType(type)
-  const isNode = isFormifiableDocument(type)
-  return [
-    ...p,
-    {
-      name: fieldNode.name.value,
-      alias: fieldNode.alias ? fieldNode.alias.value : fieldNode.name.value,
-      parentTypename: parentTypename,
-      list: !!list,
-      isNode: !!isNode,
-    },
-  ]
-}
-
-/**
- * This is a dummy query which we pull apart and spread
- * back into the the selectionSet for all "Node" fields
- */
-const node = G.parse(`
- query Sample {
-  ...on Document {
-    _internalSys: _sys {
-      path
-      relativePath
-      collection {
-        name
-      }
-    }
-    _values
-  }
- }`)
-export const metaFields: G.SelectionNode[] =
-  // @ts-ignore
-  node.definitions[0].selectionSet.selections
-
-export const getRelativeBlueprint = (path: BlueprintPath[]) => {
-  let indexOfLastNode = 0
-  path.forEach((item, i) => {
-    if (item.isNode) {
-      if (i === path.length - 1) {
-        // skip if the item is a node, we still want to treat it as a field for the parent
-      } else {
-        indexOfLastNode = i
-      }
-    }
-  })
-
-  const documentBlueprintPath = path.slice(0, indexOfLastNode + 1)
-  return getBlueprintNamePath({ path: documentBlueprintPath })
-}
-
-export const isSysField = (fieldNode: G.FieldNode) => {
-  if (fieldNode.name.value === '__typename') {
-    return true
-  }
-  if (fieldNode.name.value === '_sys') {
-    return true
-  }
-  if (fieldNode.name.value === '_values') {
-    return true
-  }
-  if (fieldNode.name.value === 'id') {
-    return true
-  }
-
-  return false
-}
-
-export const getBlueprintId = (path: BlueprintPath[]) => {
-  const namePath = []
-  const aliasPath = []
-  path.forEach((p) => {
-    namePath.push(p.name)
-    aliasPath.push(p.alias)
-    if (p.list) {
-      namePath.push('[]')
-      aliasPath.push('[]')
-    }
-  })
-
-  return namePath.join('.')
-}
-
-export const getFieldAliasForBlueprint = (path: BlueprintPath[]) => {
-  const reversePath = [...path].reverse()
-  const accum = []
-  reversePath.every((item, index) => {
-    if (index === 0) {
-      if (item.list) {
-        accum.push('[]')
-      }
-      accum.push(item.alias)
-    } else {
-      if (item.isNode) {
-        return false
-      }
-      if (item.list) {
-        accum.push('[]')
-      }
-      accum.push(item.alias)
-    }
-    return true
-  })
-  return accum.reverse().slice(1).join('.')
-}