@upstart.gg/sdk 0.0.136 → 0.0.137

package/src/shared/bricks/manifests/image.manifest.ts

@@ -1,16 +1,14 @@
 import { defineBrickManifest } from "~/shared/brick-manifest";
 import { defineProps } from "../props/helpers";
-import { imageRef } from "../props/image";
-import { shadowRef } from "../props/effects";
+import { image } from "../props/image";
+import { shadow } from "../props/effects";
 import { RxImage } from "react-icons/rx";
-import { string } from "../props/string";
 import { Type } from "@sinclair/typebox";
 import type { BrickProps } from "../props/types";
-import { backgroundColorRef } from "../props/background";
-import { borderRef, roundingRef } from "../props/border";
-import { loopRef } from "../props/dynamic";
-import { colorPresetRef } from "../props/color-preset";
-import { cssLengthRef } from "../props/css-length";
+import { border, rounding } from "../props/border";
+import { loop } from "../props/dynamic";
+import { cssLength } from "../props/css-length";
+import { colorPreset } from "../props/color-preset";
 
 export const manifest = defineBrickManifest({
   type: "image",
@@ -56,14 +54,14 @@ DO
   defaultWidth: { desktop: "auto", mobile: "100%" },
   icon: RxImage,
   props: defineProps({
-    image: imageRef({
+    image: image({
       metadata: {
         category: "content",
       },
     }),
-    colorPreset: Type.Optional(colorPresetRef()),
+    colorPreset: Type.Optional(colorPreset()),
     padding: Type.Optional(
-      cssLengthRef({
+      cssLength({
         description: "Padding inside the image.",
         title: "Padding",
         "ai:instructions": "Use only a single value like '1rem' or '10px'",
@@ -73,14 +71,15 @@ DO
       }),
     ),
     rounding: Type.Optional(
-      roundingRef({
+      rounding({
         default: "rounded-md",
       }),
     ),
-    border: Type.Optional(borderRef()),
-    shadow: Type.Optional(shadowRef()),
+    border: Type.Optional(border()),
+    shadow: Type.Optional(shadow()),
     blurHash: Type.Optional(
-      string("Blur Hash", {
+      Type.String({
+        title: "Blur hash",
         "ui:field": "hidden",
         description: "A placeholder for the image while it is loading. Use a blur hash string.",
       }),
@@ -88,10 +87,13 @@ DO
     author: Type.Optional(
       Type.Object(
         {
-          name: string("Image Author", {
+          name: Type.String({
+            title: "Image Author",
             description: "Image author. Use this to give credit to the author",
           }),
-          url: string("Image Author URL", {
+          url: Type.String({
+            title: "Image Author URL",
+            format: "uri",
             description: "Image author URL. Use this to give credit to the author",
           }),
         },
@@ -101,12 +103,13 @@ DO
       ),
     ),
     provider: Type.Optional(
-      string("Image Provider", {
+      Type.String({
+        title: "Image Provider",
         "ui:field": "hidden",
         "ai:instructions": "The provider of the image, e.g. 'unsplash', 'pexels', etc.",
       }),
     ),
-    loop: Type.Optional(loopRef()),
+    loop: Type.Optional(loop()),
   }),
 });
 

package/src/shared/bricks/manifests/images-gallery.manifest.ts

@@ -2,13 +2,11 @@ import { Type } from "@sinclair/typebox";
 import { IoGridOutline } from "react-icons/io5";
 import { defineBrickManifest } from "~/shared/brick-manifest";
 import { defineProps } from "../props/helpers";
-import { imageRef } from "../props/image";
-import { string } from "../props/string";
-import type { BrickProps } from "../props/types";
-import { colorPresetRef } from "../props/color-preset";
-import { borderRef, roundingRef } from "../props/border";
-import { loopRef } from "../props/dynamic";
-import { cssLengthRef } from "../props/css-length";
+import { image } from "../props/image";
+import { colorPreset } from "../props/color-preset";
+import { border, rounding } from "../props/border";
+import { loop } from "../props/dynamic";
+import { cssLength } from "../props/css-length";
 import type { BrickExample } from "./_types";
 
 export const manifest = defineBrickManifest({
@@ -34,20 +32,20 @@ export const manifest = defineBrickManifest({
   icon: IoGridOutline,
   props: defineProps({
     colorPreset: Type.Optional(
-      colorPresetRef({
+      colorPreset({
         title: "Color",
       }),
     ),
-    loop: Type.Optional(loopRef()),
+    loop: Type.Optional(loop()),
     images: Type.Array(
       Type.Object({
-        image: imageRef({
+        image: image({
           "ui:responsive": "desktop",
           "ui:no-alt-text": true,
           "ui:no-object-options": true,
           "ui:placeholder": "https://example.com/image.jpg",
         }),
-        legend: Type.Optional(string("Legend")),
+        legend: Type.Optional(Type.String({ title: "Legend" })),
       }),
       {
         title: "Images",
@@ -86,7 +84,7 @@ export const manifest = defineBrickManifest({
       }),
     ),
     gap: Type.Optional(
-      cssLengthRef({
+      cssLength({
         title: "Gap",
         description: "The gap between the images.",
         default: "1rem",
@@ -94,7 +92,7 @@ export const manifest = defineBrickManifest({
       }),
     ),
     padding: Type.Optional(
-      cssLengthRef({
+      cssLength({
         default: "3rem",
         description: "Padding inside the gallery.",
         "ai:instructions": "Use only a single value like '1rem' or '10px'",
@@ -104,8 +102,8 @@ export const manifest = defineBrickManifest({
         "ui:styleId": "styles:padding",
       }),
     ),
-    rounding: Type.Optional(roundingRef()),
-    border: Type.Optional(borderRef()),
+    rounding: rounding(),
+    border: Type.Optional(border()),
   }),
 });
 

package/src/shared/bricks/manifests/map.manifest.ts

@@ -1,12 +1,10 @@
 import { defineBrickManifest } from "~/shared/brick-manifest";
 import { defineProps } from "../props/helpers";
 import { LiaMapMarkedAltSolid } from "react-icons/lia";
-import { roundingRef } from "../props/border";
-import { shadowRef } from "../props/effects";
-import type { BrickProps } from "../props/types";
+import { rounding } from "../props/border";
+import { shadow } from "../props/effects";
 import { Type } from "@sinclair/typebox";
 import { number } from "../props/number";
-import { string } from "../props/string";
 import type { BrickExample } from "./_types";
 
 export const DEFAULTS = {
@@ -40,16 +38,18 @@ export const manifest = defineBrickManifest({
   icon: LiaMapMarkedAltSolid,
   props: defineProps({
     // location: geolocation({ defaultZoom: DEFAULTS.zoom }),
-    lat: string("Latitude", { "ui:field": "hidden" }),
-    lng: string("Longitude", { "ui:field": "hidden" }),
-    address: string("Address", {
+    lat: Type.String({ title: "Latitude", "ui:field": "hidden" }),
+    lng: Type.String({ title: "Longitude", "ui:field": "hidden" }),
+    address: Type.String({
+      title: "Address",
       "ui:field": "geoaddress",
       metadata: {
         category: "content",
       },
     }),
     tooltip: Type.Optional(
-      string("Tooltip", {
+      Type.String({
+        title: "Tooltip",
         metadata: {
           category: "content",
         },
@@ -69,11 +69,11 @@ export const manifest = defineBrickManifest({
       }),
     ),
     rounding: Type.Optional(
-      roundingRef({
+      rounding({
         default: "rounded-xl",
       }),
     ),
-    shadow: Type.Optional(shadowRef()),
+    shadow: Type.Optional(shadow()),
   }),
 });
 

package/src/shared/bricks/manifests/navbar.manifest.ts

@@ -1,17 +1,18 @@
 import { type Static, type TObject, Type } from "@sinclair/typebox";
 import { defineBrickManifest } from "~/shared/brick-manifest";
 import { defineProps } from "../props/helpers";
-import { string, urlOrPageIdRef } from "../props/string";
-import { imageRef } from "../props/image";
-import { textContentRef } from "../props/text";
-import { shadowRef } from "../props/effects";
+import { urlOrPageId } from "../props/string";
+import { image } from "../props/image";
+import { textContent } from "../props/text";
+import { shadow } from "../props/effects";
 import { boolean } from "../props/boolean";
 import { VscLayoutPanelOff } from "react-icons/vsc";
 import type { BrickProps } from "../props/types";
-import { colorPresetRef } from "../props/color-preset";
-import { tagsRef } from "../props/tags";
+import { colorPreset } from "../props/color-preset";
+import { tags } from "../props/tags";
 import { toLLMSchema } from "~/shared/utils/llm";
 import type { BrickExample } from "./_types";
+import { StringEnum } from "~/shared/utils/string-enum";
 
 export const manifest = defineBrickManifest({
   type: "navbar",
@@ -32,14 +33,14 @@ export const manifest = defineBrickManifest({
   props: defineProps(
     {
       colorPreset: Type.Optional(
-        colorPresetRef({
+        colorPreset({
           title: "Color",
           default: { color: "primary-500" },
           examples: [{ color: "primary-500" }, { color: "neutral-900" }, { color: "secondary-200" }],
         }),
       ),
       brand: Type.Optional(
-        textContentRef({
+        textContent({
           title: "Brand name",
           default: "Acme Inc.",
           disableSizing: true,
@@ -52,7 +53,7 @@ export const manifest = defineBrickManifest({
         }),
       ),
       logo: Type.Optional(
-        imageRef({
+        image({
           title: "Logo",
           "ui:show-img-search": false,
           "ui:no-object-options": true,
@@ -75,7 +76,7 @@ export const manifest = defineBrickManifest({
         }),
       ),
       linksTagsFilter: Type.Optional(
-        tagsRef({
+        tags({
           title: "Pages tags",
           description: "Filter pages links in the navbar by tags. Only pages with these tags will be shown.",
           default: ["navbar"],
@@ -88,8 +89,8 @@ export const manifest = defineBrickManifest({
       staticNavItems: Type.Optional(
         Type.Array(
           Type.Object({
-            urlOrPageId: urlOrPageIdRef(),
-            label: Type.Optional(string("Label")),
+            urlOrPageId: urlOrPageId(),
+            label: Type.Optional(Type.String({ title: "Label" })),
           }),
           {
             title: "Static links",
@@ -110,16 +111,14 @@ export const manifest = defineBrickManifest({
         ),
       ),
       linksPosition: Type.Optional(
-        Type.Union(
-          [
-            Type.Literal("left", { title: "Left" }),
-            Type.Literal("center", { title: "Center" }),
-            Type.Literal("right", { title: "Right" }),
-          ],
-          { title: "Links position", default: "right", "ui:responsive": "desktop" },
-        ),
+        StringEnum(["left", "center", "right"], {
+          enumNames: ["Left", "Center", "Right"],
+          title: "Links position",
+          default: "right",
+          "ui:responsive": "desktop",
+        }),
       ),
-      shadow: Type.Optional(shadowRef()),
+      shadow: Type.Optional(shadow()),
     },
     { noAlignSelf: true, noGrow: true },
   ),

package/src/shared/bricks/manifests/sidebar.manifest.ts

@@ -2,12 +2,12 @@ import { defineBrickManifest } from "~/shared/brick-manifest";
 import { defineProps, group } from "../props/helpers";
 import { VscLayoutSidebarLeftOff } from "react-icons/vsc";
 import { Type } from "@sinclair/typebox";
-import { string, urlOrPageIdRef } from "../props/string";
-import { backgroundColorRef } from "../props/background";
-import { borderRef } from "../props/border";
+import { urlOrPageId } from "../props/string";
+import { backgroundColor } from "../props/background";
+import { border } from "../props/border";
 import { fixedPositioned } from "../props/position";
 import type { BrickProps } from "../props/types";
-import { shadowRef } from "../props/effects";
+import { shadow } from "../props/effects";
 import type { BrickExample } from "./_types";
 
 export const manifest = defineBrickManifest({
@@ -30,9 +30,9 @@ export const manifest = defineBrickManifest({
       group({
         title: "Main element",
         children: {
-          backgroundColor: Type.Optional(backgroundColorRef()),
-          border: Type.Optional(borderRef()),
-          shadow: Type.Optional(shadowRef()),
+          backgroundColor: Type.Optional(backgroundColor()),
+          border: Type.Optional(border()),
+          shadow: Type.Optional(shadow()),
           fixedPositioned: Type.Optional(fixedPositioned()),
         },
         metadata: {
@@ -47,8 +47,8 @@ export const manifest = defineBrickManifest({
           navItems: Type.Optional(
             Type.Array(
               Type.Object({
-                urlOrPageId: urlOrPageIdRef(),
-                label: Type.Optional(string("Label")),
+                urlOrPageId: urlOrPageId(),
+                label: Type.Optional(Type.String({ title: "Label" })),
               }),
               { title: "Navigation items", default: [] },
             ),

package/src/shared/bricks/manifests/social-links.manifest.ts

@@ -2,13 +2,13 @@ import { Type } from "@sinclair/typebox";
 import { TiSocialFlickr } from "react-icons/ti";
 import { defineBrickManifest } from "~/shared/brick-manifest";
 import { defineProps } from "../props/helpers";
-import { iconRef, string } from "../props/string";
+import { icon } from "../props/string";
 import type { BrickProps } from "../props/types";
-import { fontSizeRef } from "../props/text";
-import { directionRef } from "../props/direction";
-import { colorPresetRef } from "../props/color-preset";
-import { borderRef, roundingRef } from "../props/border";
-import { cssLengthRef } from "../props/css-length";
+import { fontSize } from "../props/text";
+import { direction } from "../props/direction";
+import { colorPreset } from "../props/color-preset";
+import { border, rounding } from "../props/border";
+import { cssLength } from "../props/css-length";
 import type { BrickExample } from "./_types";
 
 export const manifest = defineBrickManifest({
@@ -21,19 +21,19 @@ export const manifest = defineBrickManifest({
   },
   props: defineProps({
     colorPreset: Type.Optional(
-      colorPresetRef({
+      colorPreset({
         title: "Color",
       }),
     ),
     links: Type.Array(
       Type.Object({
         icon: Type.Optional(
-          iconRef({
+          icon({
             "ui:default-icon-collection": "cib",
           }),
         ),
-        label: Type.Optional(string("Label")),
-        href: string("Link"),
+        label: Type.Optional(Type.String({ title: "Label" })),
+        href: Type.String({ title: "Link" }),
       }),
       {
         title: "Social Links",
@@ -68,13 +68,13 @@ export const manifest = defineBrickManifest({
       },
     ),
     direction: Type.Optional(
-      directionRef({
+      direction({
         default: "flex-row",
       }),
     ),
-    fontSize: Type.Optional(fontSizeRef()),
+    fontSize: Type.Optional(fontSize()),
     padding: Type.Optional(
-      cssLengthRef({
+      cssLength({
         default: "2rem",
         description: "Padding.",
         "ai:instructions": "Use only a single value like '1rem' or '10px'",
@@ -84,12 +84,10 @@ export const manifest = defineBrickManifest({
         "ui:styleId": "styles:padding",
       }),
     ),
-    rounding: Type.Optional(
-      roundingRef({
-        default: "rounded-md",
-      }),
-    ),
-    border: Type.Optional(borderRef()),
+    rounding: rounding({
+      default: "rounded-md",
+    }),
+    border: Type.Optional(border()),
     iconOnly: Type.Optional(
       Type.Boolean({
         title: "Only icons",

package/src/shared/bricks/manifests/table.manifest.ts

@@ -2,13 +2,11 @@ import { Type } from "@sinclair/typebox";
 import { RiTable2 } from "react-icons/ri";
 import { defineBrickManifest } from "~/shared/brick-manifest";
 import { defineProps } from "../props/helpers";
-import { string } from "../props/string";
-import type { BrickProps } from "../props/types";
-import { colorPresetRef } from "../props/color-preset";
-import { borderRef, roundingRef } from "../props/border";
-import { loopRef } from "../props/dynamic";
-import { cssLengthRef } from "../props/css-length";
-import { fontSizeRef } from "../props/text";
+import { colorPreset } from "../props/color-preset";
+import { border, rounding } from "../props/border";
+import { loop } from "../props/dynamic";
+import { cssLength } from "../props/css-length";
+import { fontSize } from "../props/text";
 import { StringEnum } from "~/shared/utils/string-enum";
 import type { BrickExample } from "./_types";
 
@@ -35,18 +33,20 @@ export const manifest = defineBrickManifest({
   icon: RiTable2,
   props: defineProps({
     colorPreset: Type.Optional(
-      colorPresetRef({
+      colorPreset({
         title: "Color",
       }),
     ),
-    loop: Type.Optional(loopRef()),
+    loop: Type.Optional(loop()),
     columns: Type.Array(
       Type.Object({
-        header: string("Header", {
+        header: Type.String({
+          title: "Header",
           default: "Column Header",
           metadata: { category: "content" },
         }),
-        field: string("Field", {
+        field: Type.String({
+          title: "Field",
           default: "fieldName",
           description: "The field name from the data source or static content",
           metadata: { category: "content" },
@@ -125,14 +125,14 @@ export const manifest = defineBrickManifest({
       }),
     ),
     fontSize: Type.Optional(
-      fontSizeRef({
+      fontSize({
         title: "Font Size",
         description: "Text size for table content",
         default: "text-sm",
       }),
     ),
     padding: Type.Optional(
-      cssLengthRef({
+      cssLength({
         default: "1rem",
         description: "Padding inside table cells",
         title: "Cell Padding",
@@ -142,12 +142,12 @@ export const manifest = defineBrickManifest({
       }),
     ),
     rounding: Type.Optional(
-      roundingRef({
+      rounding({
         default: "rounded-lg",
       }),
     ),
     border: Type.Optional(
-      borderRef({
+      border({
         default: { width: "border", color: "border-gray-200" },
       }),
     ),

package/src/shared/bricks/manifests/tabs.manifest.ts

@@ -1,13 +1,13 @@
 import { defineBrickManifest } from "~/shared/brick-manifest";
 import { defineProps } from "../props/helpers";
 import { Type } from "@sinclair/typebox";
-import { borderRef, roundingRef } from "../props/border";
-import { shadowRef } from "../props/effects";
+import { border, rounding } from "../props/border";
+import { shadow } from "../props/effects";
 import type { BrickProps } from "../props/types";
-import { cssLengthRef } from "../props/css-length";
+import { cssLength } from "../props/css-length";
 import { HiOutlineViewColumns } from "react-icons/hi2";
-import { colorPresetRef } from "../props/color-preset";
-import { loopRef } from "../props/dynamic";
+import { colorPreset } from "../props/color-preset";
+import { loop } from "../props/dynamic";
 import { StringEnum } from "~/shared/utils/string-enum";
 import type { BrickExample } from "./_types";
 
@@ -44,7 +44,7 @@ export const manifest = defineBrickManifest({
   icon: HiOutlineViewColumns,
   props: defineProps({
     colorPreset: Type.Optional(
-      colorPresetRef({
+      colorPreset({
         title: "Color",
       }),
     ),
@@ -95,7 +95,7 @@ export const manifest = defineBrickManifest({
       }),
     ),
     padding: Type.Optional(
-      cssLengthRef({
+      cssLength({
         default: "1.5rem",
         description: "Padding inside each tab panel.",
         "ai:instructions": "Use values like '1rem', '1.5rem', or '2rem' for tab content padding",
@@ -105,7 +105,7 @@ export const manifest = defineBrickManifest({
       }),
     ),
     gap: Type.Optional(
-      cssLengthRef({
+      cssLength({
         title: "Tab Gap",
         default: "0.5rem",
         description: "Gap between tab buttons.",
@@ -114,14 +114,12 @@ export const manifest = defineBrickManifest({
         "ui:styleId": "styles:gap",
       }),
     ),
-    rounding: Type.Optional(
-      roundingRef({
-        default: "rounded-md",
-      }),
-    ),
-    border: Type.Optional(borderRef()),
-    shadow: Type.Optional(shadowRef()),
-    loop: Type.Optional(loopRef()),
+    rounding: rounding({
+      default: "rounded-md",
+    }),
+    border: Type.Optional(border()),
+    shadow: Type.Optional(shadow()),
+    loop: Type.Optional(loop()),
     $children: Type.Array(Type.Array(Type.Any()), {
       "ui:field": "hidden",
       description: "Array of child brick arrays - each sub-array represents the content for one tab",