@upstart.gg/sdk 0.0.130 → 0.0.132

package/src/shared/attributes.ts

@@ -0,0 +1,396 @@
+import { Type, type Static } from "@sinclair/typebox";
+import type { JSONSchemaType } from "ajv";
+import { getSchemaDefaults } from "../shared/utils/schema";
+import { manifest as navbarManifest } from "./bricks/manifests/navbar.manifest";
+import { manifest as footerManifest } from "./bricks/manifests/footer.manifest";
+import { string } from "./bricks/props/string";
+import { boolean } from "./bricks/props/boolean";
+import { datetime } from "./bricks/props/date";
+import { imageRef } from "./bricks/props/image";
+import { colorPresetRef } from "./bricks/props/color-preset";
+import { queryUseRef, type QueryUseSettings } from "./bricks/props/dynamic";
+import { querySchema } from "./datasources/types";
+import { StringEnum } from "./utils/string-enum";
+import { backgroundRef } from "./bricks/props/background";
+import { toLLMSchema } from "./utils/llm";
+
+export type { JSONSchemaType };
+
+// Default attributes
+export const pageAttributesSchema = Type.Object(
+  {
+    backgroundImage: Type.Optional(backgroundRef()),
+    colorPreset: Type.Optional(
+      colorPresetRef({
+        examples: [
+          { color: "base-100" },
+          { color: "primary-500" },
+          { color: "accent-100", gradientDirection: "bg-gradient-to-r" },
+        ],
+      }),
+    ),
+    tags: Type.Optional(
+      Type.Array(string("Tag"), {
+        title: "Tags",
+        description:
+          "Use tags to organize, group and filter pages in navigation elements and in the dashboard. By default, the navbar element display pages having the 'navbar' tag, while the sidebar displays the pages with the tag 'sidebar'.",
+        "ui:field": "tags",
+        examples: [["navbar", "navbar"], ["navbar", "sidebar"], ["sidebar"]],
+      }),
+    ),
+    path: string("URL path", {
+      default: "/",
+      description: "The URL path of the page. Use placeholders like :id or :slug for dynamic paths.",
+      "ui:field": "path",
+      pattern: "^/[a-z0-9-:/]*$",
+      examples: ["/", "/about", "/products/:id"],
+    }),
+    queries: Type.Optional(
+      Type.Array(queryUseRef(), {
+        title: "Page Queries",
+        description:
+          "List of queries to use in this page. All listed queries will be executed when the page loads.",
+        "ai:instructions": "Reference Query IDs to use at the page level.",
+        "ui:field": "page-queries",
+        maxItems: 5,
+      }),
+    ),
+    title: string("Title", {
+      default: "Untitled",
+      "ui:group": "meta",
+      "ui:group:title": "Meta tags",
+      description: "The title of the page. Appears in the browser tab and search results",
+      "ui:placeholder": "Page title",
+    }),
+    description: string("Description", {
+      "ui:widget": "textarea",
+      "ui:group": "meta",
+      "ui:group:title": "Meta tags",
+      description: "A short description of the page. Used by search engines",
+      "ui:multiline": true,
+      "ui:textarea-class": "h-24",
+      default: "",
+      "ui:placeholder": "A brief description of the page",
+    }),
+    keywords: string("Keywords", {
+      "ui:group": "meta",
+      "ui:group:title": "Meta tags",
+      description: "Keywords related to the page. Used by search engines",
+      "ui:multiline": true,
+      default: "",
+      "ui:placeholder": "keyword1, keyword2, keyword3",
+    }),
+
+    ogImage: Type.Optional(
+      imageRef({
+        title: "Social share image",
+        description: "Image shown when this page is shared on social media",
+        "ui:group": "meta",
+        "ai:hidden": true,
+        "ui:no-object-options": true,
+        "ui:no-alt-text": true,
+        "ui:show-img-search": false,
+        "ui:no-dynamic": true,
+        "ui:placeholder": "https://example.com/image.jpg",
+      }),
+    ),
+    robotsIndexing: Type.Optional(
+      boolean("Allow search engines to index this page", true, {
+        description: "Disabling this will prevent search engines from indexing this page",
+        "ai:hidden": true,
+        "ui:group": "meta",
+      }),
+    ),
+    language: Type.Optional(
+      StringEnum(
+        [
+          "ar",
+          "zh",
+          "cs",
+          "nl",
+          "en",
+          "fr",
+          "de",
+          "he",
+          "hi",
+          "it",
+          "ja",
+          "ko",
+          "fa",
+          "pl",
+          "pt",
+          "ru",
+          "es",
+          "tr",
+          "vi",
+        ],
+        {
+          "ai:hidden": true,
+          "ui:group": "meta",
+          title: "Language",
+          default: "en",
+          description:
+            "Overrides the site language for this page. Leave blank to use the site default language.",
+          enumNames: [
+            "Arabic",
+            "Chinese",
+            "Czech",
+            "Dutch",
+            "English",
+            "French",
+            "German",
+            "Hebrew",
+            "Hindi",
+            "Italian",
+            "Japanese",
+            "Korean",
+            "Persian",
+            "Polish",
+            "Portuguese",
+            "Russian",
+            "Spanish",
+            "Turkish",
+            "Vietnamese",
+          ],
+        },
+      ),
+    ),
+    additionalTags: Type.Optional(
+      Type.Object(
+        {
+          headTags: Type.Optional(
+            Type.String({
+              title: "Head script tags",
+              description:
+                "Add custom tags to the <head> of your site. Useful for analytics tags, custom scripts, etc.",
+              "ai:instructions": "Don't include meta tags here, they are automatically generated.",
+              "ui:multiline": true,
+              "ui:textarea-class": "h-40 !font-mono",
+              "ui:placeholder": "<script src='https://example.com/script.js'></script>",
+              "ui:premium": true,
+              "ui:textarea-font-size": "1",
+              "ui:no-dynamic": true,
+            }),
+          ),
+          bodyTags: Type.Optional(
+            Type.String({
+              title: "Body script tags",
+              description:
+                "Add custom tags to the <body> of your site. Useful for analytics tags, custom scripts, etc.",
+              "ui:multiline": true,
+              "ui:premium": true,
+              "ui:textarea-class": "h-40 !font-mono",
+              "ui:textarea-font-size": "1",
+              "ui:placeholder": "<script src='https://example.com/script.js'></script>",
+              "ui:no-dynamic": true,
+            }),
+          ),
+        },
+        { "ui:group": "meta" },
+      ),
+    ),
+
+    noNavbar: Type.Optional(boolean("Hide navbar", false, { "ui:group": "layout" })),
+    noFooter: Type.Optional(boolean("Hide footer", false, { "ui:group": "layout" })),
+    lastUpdated: Type.Optional(
+      datetime("Last updated", {
+        "ui:hidden": true,
+        "ai:hidden": true,
+      }),
+    ),
+  },
+  {
+    "ui:groups": {
+      meta: "SEO & Meta tags",
+      layout: "Layout",
+    },
+  },
+);
+
+export function getPageQueriesSchemaForLLM() {
+  return toLLMSchema(
+    Type.Array(queryUseRef(), {
+      examples: [
+        { queryId: "get-latest-posts", alias: "latestPosts" },
+        {
+          queryId: "get-user-profile",
+          alias: "userProfile",
+          params: [{ field: "userId", op: "eq", value: ":slug" }],
+        },
+      ] satisfies QueryUseSettings[],
+    }),
+  );
+}
+
+export const siteAttributesSchema = Type.Object(
+  {
+    language: StringEnum(
+      [
+        "ar",
+        "zh",
+        "cs",
+        "nl",
+        "en",
+        "fr",
+        "de",
+        "he",
+        "hi",
+        "it",
+        "ja",
+        "ko",
+        "fa",
+        "pl",
+        "pt",
+        "ru",
+        "es",
+        "tr",
+        "vi",
+      ],
+      {
+        title: "Site language",
+        default: "en",
+        enumNames: [
+          "Arabic",
+          "Chinese",
+          "Czech",
+          "Dutch",
+          "English",
+          "French",
+          "German",
+          "Hebrew",
+          "Hindi",
+          "Italian",
+          "Japanese",
+          "Korean",
+          "Persian",
+          "Polish",
+          "Portuguese",
+          "Russian",
+          "Spanish",
+          "Turkish",
+          "Vietnamese",
+        ],
+        "ai:instructions":
+          "Choose a value based on the site description. If the site is in multiple languages, use 'en'.",
+      },
+    ),
+    backgroundImage: Type.Optional(backgroundRef()),
+    colorPreset: Type.Optional(
+      colorPresetRef({
+        examples: [
+          { color: "base-100" },
+          { color: "primary-500" },
+          { color: "secondary-400" },
+          { color: "neutral-400" },
+          { color: "accent-200-gradient", gradientDirection: "bg-gradient-to-r" },
+          { color: "neutral-800-gradient", gradientDirection: "bg-gradient-to-t" },
+        ],
+      }),
+    ),
+    queries: Type.Optional(
+      Type.Array(querySchema, {
+        title: "Site Queries",
+        "ui:field": "site-queries",
+        description: "List of all queries available in this site. These can be used in any page.",
+        "ai:instructions":
+          "This is where queries are first defined. They are then referenced in pages attributes (in the 'queries' field) to use them.",
+      }),
+    ),
+    navbar: Type.Optional(
+      Type.Composite([navbarManifest.props], {
+        title: "Navbar",
+        "ui:group": "navbar",
+      }),
+    ),
+    footer: Type.Optional(
+      Type.Composite([footerManifest.props], {
+        title: "Footer",
+        "ui:group": "footer",
+        // "ui:hidden": true, // Hidden in attributes panel. Users will have to click the brick to configure it, even if the configuration applies globally, so they have the same editing experience
+      }),
+    ),
+    ogImage: Type.Optional(
+      imageRef({
+        title: "Social share image",
+        description: "Image shown when this site is shared on social media",
+        "ai:hidden": true,
+        "ui:group": "meta",
+        "ui:no-object-options": true,
+        "ui:no-alt-text": true,
+        "ui:show-img-search": false,
+        "ui:no-dynamic": true,
+      }),
+    ),
+    robotsIndexing: Type.Optional(
+      boolean("Allow search engines to index this site", true, {
+        description: "Disabling this will prevent search engines from indexing this site entirely",
+        "ai:hidden": true,
+        "ui:group": "meta",
+      }),
+    ),
+    headTags: Type.Optional(
+      Type.String({
+        title: "Head script tags",
+        description:
+          "Add custom tags to the <head> of your site. Useful for analytics tags, custom scripts, etc.",
+        "ai:hidden": true,
+        "ui:multiline": true,
+        "ui:textarea-class": "h-40 !font-mono",
+        "ui:placeholder": "<script src='https://example.com/script.js'></script>",
+        "ui:premium": true,
+        "ui:textarea-font-size": "1",
+        "ui:group": "external",
+        "ui:no-dynamic": true,
+      }),
+    ),
+    bodyTags: Type.Optional(
+      Type.String({
+        title: "Body script tags",
+        description:
+          "Add custom tags to the <body> of your site. Useful for analytics tags, custom scripts, etc.",
+        "ai:hidden": true,
+        "ui:multiline": true,
+        "ui:premium": true,
+        "ui:textarea-class": "h-40 !font-mono",
+        "ui:textarea-font-size": "1",
+        "ui:placeholder": "<script src='https://example.com/script.js'></script>",
+        "ui:group": "external",
+        "ui:no-dynamic": true,
+      }),
+    ),
+  },
+  {
+    "ui:groups": {
+      meta: "SEO & Meta tags",
+      layout: "Layout",
+      navbar: "Navbar",
+      footer: "Footer",
+      external: "External scripts",
+    },
+  },
+);
+
+export function getSiteAttributeschemaForLLM() {
+  return toLLMSchema(Type.Omit(siteAttributesSchema, ["queries"]));
+}
+
+export function getPageAttributeschemaForLLM() {
+  return toLLMSchema(Type.Omit(pageAttributesSchema, ["queries"]));
+}
+
+export function getSiteQueriesSchemaForLLM() {
+  return toLLMSchema(Type.Array(querySchema));
+}
+
+export type PageAttributes = Static<typeof pageAttributesSchema>;
+export type SiteAttributes = Static<typeof siteAttributesSchema>;
+
+export function resolvePageAttributes(data: Partial<PageAttributes> = {}) {
+  const defaultAttrValues = getSchemaDefaults(pageAttributesSchema);
+  return { ...defaultAttrValues, ...data } as PageAttributes;
+}
+
+export function resolveSiteAttributes(data: Partial<SiteAttributes> = {}) {
+  const defaultAttrValues = getSchemaDefaults(siteAttributesSchema);
+  return { ...defaultAttrValues, ...data } as SiteAttributes;
+}

package/src/shared/brick-manifest.ts

@@ -0,0 +1,119 @@
+import type { TObject, TProperties, TArray } from "@sinclair/typebox";
+import type { IconBase, IconType } from "react-icons/lib";
+import { getSchemaDefaults } from "./utils/schema";
+import type { ReactNode } from "react";
+
+export type BrickCategory = "layout" | "basic" | "media" | "widgets" | "container";
+
+type BrickManifestProps<BProps extends TProperties, DSSchema extends TObject | TArray<TObject>> = {
+  type: string;
+  category?: BrickCategory;
+  name: string;
+  icon: IconType;
+  iconClassName?: string;
+  staticClasses?: string;
+  description?: string;
+  // Min width in pixels
+  minWidth?: {
+    mobile?: number;
+    desktop?: number;
+  };
+  // Max width in pixels
+  maxWidth?: {
+    mobile?: number;
+    desktop?: number;
+  };
+  // Min height in pixels
+  minHeight?: {
+    mobile?: number;
+    desktop?: number;
+  };
+  // Max height in pixels
+  maxHeight?: {
+    mobile?: number;
+    desktop?: number;
+  };
+  // default width can be in various css units, but should be a number
+  defaultWidth?: {
+    mobile?: string;
+    desktop?: string;
+  };
+  defaultHeight?: {
+    mobile?: string;
+    desktop?: string;
+  };
+  props: TObject<BProps>;
+  hideInLibrary?: boolean;
+
+  isGlobalBrick?: boolean;
+  /**
+   * If true, the brick can consume multiple rows of data from a data source.
+   * This is useful for bricks that display lists or collections of items.
+   */
+  consumesMultipleQueryRows?: boolean;
+  defaultInspectorTab?: "preset" | "style" | "content";
+  deletable?: boolean;
+  movable?: boolean;
+  resizable?: boolean | "horizontal" | "vertical";
+  duplicatable?: boolean;
+  /**
+   * Some specific bricks like sidebar or header may not be draggable inline, as we want to place them manually in the layout.
+   */
+  inlineDragDisabled?: boolean;
+  isContainer?: boolean;
+  aiInstructions?: string;
+};
+
+export function defineBrickManifest<BProps extends TProperties, DSSchema extends TObject | TArray<TObject>>({
+  props,
+  defaultHeight,
+  defaultWidth,
+  category = "widgets",
+  isContainer = false,
+  hideInLibrary = false,
+  isGlobalBrick = false,
+  deletable = true,
+  movable = true,
+  resizable = true,
+  duplicatable = true,
+  defaultInspectorTab = "preset",
+  icon,
+  ...rest
+}: BrickManifestProps<BProps, DSSchema>) {
+  return {
+    ...rest,
+    icon,
+    props,
+    category,
+    defaultInspectorTab,
+    hideInLibrary,
+    deletable,
+    movable,
+    resizable,
+    duplicatable,
+    isContainer,
+    isGlobalBrick,
+    defaultWidth: { mobile: defaultWidth?.mobile ?? "auto", desktop: defaultWidth?.desktop ?? "auto" },
+    defaultHeight: {
+      mobile: defaultHeight?.mobile ?? "auto",
+      desktop: defaultHeight?.desktop ?? "auto",
+    },
+  } as const;
+}
+
+export type BrickManifest = ReturnType<typeof defineBrickManifest>;
+
+export function getBrickManifestDefaults<M extends BrickManifest>(manifest: M) {
+  return {
+    manifest,
+    props: getSchemaDefaults(manifest.props),
+    mobileProps: {},
+  };
+}
+
+export type BrickDefaults = ReturnType<typeof getBrickManifestDefaults>;
+
+export type BrickConstraints = Pick<
+  BrickManifest,
+  "defaultWidth" | "defaultHeight" | "minWidth" | "minHeight" | "maxWidth" | "resizable" | "movable"
+>;