@cntrl-site/sdk 1.13.0 → 1.15.0

package/lib/schemas/article/Item.schema.js

@@ -24,19 +24,20 @@ exports.FXControlSchema = zod_1.z.discriminatedUnion('type', [
         value: zod_1.z.tuple([zod_1.z.number(), zod_1.z.number()])
     })
 ]);
+const FXParams = zod_1.z.object({
+    url: zod_1.z.string().min(1),
+    hasGLEffect: zod_1.z.boolean().optional(),
+    fragmentShader: zod_1.z.string().nullable(),
+    FXCursor: zod_1.z.object({
+        type: zod_1.z.enum(['mouse', 'manual']),
+        x: zod_1.z.number(),
+        y: zod_1.z.number()
+    }).nullable(),
+    FXControls: zod_1.z.array(exports.FXControlSchema).optional()
+});
 const ImageItemSchema = ItemBase_schema_1.ItemBaseSchema.extend({
     type: zod_1.z.literal(ArticleItemType_1.ArticleItemType.Image),
-    commonParams: zod_1.z.object({
-        url: zod_1.z.string().min(1),
-        hasGLEffect: zod_1.z.boolean().optional(),
-        fragmentShader: zod_1.z.string().nullable(),
-        FXCursor: zod_1.z.object({
-            type: zod_1.z.enum(['mouse', 'manual']),
-            x: zod_1.z.number(),
-            y: zod_1.z.number()
-        }).nullable(),
-        FXControls: zod_1.z.array(exports.FXControlSchema).optional()
-    }),
+    commonParams: FXParams,
     sticky: zod_1.z.record(zod_1.z.object({
         from: zod_1.z.number(),
         to: zod_1.z.number().optional()
@@ -53,9 +54,8 @@ const ImageItemSchema = ItemBase_schema_1.ItemBaseSchema.extend({
 const VideoItemSchema = ItemBase_schema_1.ItemBaseSchema.extend({
     type: zod_1.z.literal(ArticleItemType_1.ArticleItemType.Video),
     commonParams: zod_1.z.object({
-        url: zod_1.z.string().min(1),
         coverUrl: zod_1.z.string().nullable()
-    }),
+    }).merge(FXParams),
     sticky: zod_1.z.record(zod_1.z.object({
         from: zod_1.z.number(),
         to: zod_1.z.number().optional()
@@ -188,5 +188,20 @@ exports.ItemSchema = zod_1.z.lazy(() => zod_1.z.discriminatedUnion('type', [
             opacity: zod_1.z.number().nonnegative()
         })),
         state: zod_1.z.record(zod_1.z.record(ItemState_schema_1.GroupStateParamsSchema))
+    }),
+    ItemBase_schema_1.ItemBaseSchema.extend({
+        type: zod_1.z.literal(ArticleItemType_1.ArticleItemType.Compound),
+        commonParams: zod_1.z.object({
+            overflow: zod_1.z.enum(['hidden', 'visible']),
+        }),
+        items: zod_1.z.array(exports.ItemSchema),
+        sticky: zod_1.z.record(zod_1.z.object({
+            from: zod_1.z.number(),
+            to: zod_1.z.number().optional()
+        }).nullable()),
+        layoutParams: zod_1.z.record(zod_1.z.object({
+            opacity: zod_1.z.number().nonnegative()
+        })),
+        state: zod_1.z.record(zod_1.z.record(ItemState_schema_1.CompoundStateParamsSchema))
     })
 ]));

package/lib/schemas/article/ItemBase.schema.js

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ItemBaseSchema = exports.Link = void 0;
+exports.ItemBaseSchema = exports.CompoundSettingsSchema = exports.Link = void 0;
 const zod_1 = require("zod");
 const ItemArea_schema_1 = require("./ItemArea.schema");
+const ItemArea_1 = require("../../types/article/ItemArea");
 exports.Link = zod_1.z.object({
     url: zod_1.z.string().min(1),
     target: zod_1.z.string().min(1)
@@ -10,11 +11,17 @@ exports.Link = zod_1.z.object({
 const CommonParamsBase = zod_1.z.object({
     sizing: zod_1.z.string().min(1)
 });
+exports.CompoundSettingsSchema = zod_1.z.object({
+    positionAnchor: zod_1.z.nativeEnum(ItemArea_1.AreaAnchor),
+    widthMode: zod_1.z.nativeEnum(ItemArea_1.DimensionMode),
+    heightMode: zod_1.z.nativeEnum(ItemArea_1.DimensionMode),
+});
 exports.ItemBaseSchema = zod_1.z.object({
     id: zod_1.z.string().min(1),
     area: zod_1.z.record(ItemArea_schema_1.ItemAreaSchema),
     hidden: zod_1.z.record(zod_1.z.boolean()),
     link: exports.Link.optional(),
     commonParams: CommonParamsBase,
+    compoundSettings: zod_1.z.record(exports.CompoundSettingsSchema).optional(),
     layoutParams: zod_1.z.record(zod_1.z.any()).optional()
 });

package/lib/schemas/article/ItemState.schema.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ItemStateParamsSchema = exports.CodeEmbedStateParamsSchema = exports.GroupStateParamsSchema = exports.RichTextStateParamsSchema = exports.EmbedStateParamsSchema = exports.CustomItemStateParamsSchema = exports.RectangleStateParamsSchema = exports.MediaStateParamsSchema = exports.ItemStateBaseSchema = exports.getStateParamsSchema = void 0;
+exports.ItemStateParamsSchema = exports.CodeEmbedStateParamsSchema = exports.CompoundStateParamsSchema = exports.GroupStateParamsSchema = exports.RichTextStateParamsSchema = exports.EmbedStateParamsSchema = exports.CustomItemStateParamsSchema = exports.RectangleStateParamsSchema = exports.MediaStateParamsSchema = exports.ItemStateBaseSchema = exports.getStateParamsSchema = void 0;
 const zod_1 = require("zod");
 const TransitionSchema = zod_1.z.object({
     timing: zod_1.z.string(),
@@ -51,6 +51,9 @@ exports.RichTextStateParamsSchema = zod_1.z.object({
 exports.GroupStateParamsSchema = zod_1.z.object({
     opacity: (0, exports.getStateParamsSchema)(zod_1.z.number().nonnegative())
 }).merge(exports.ItemStateBaseSchema);
+exports.CompoundStateParamsSchema = zod_1.z.object({
+    opacity: (0, exports.getStateParamsSchema)(zod_1.z.number().nonnegative())
+}).merge(exports.ItemStateBaseSchema);
 exports.CodeEmbedStateParamsSchema = zod_1.z.object({
     opacity: (0, exports.getStateParamsSchema)(zod_1.z.number().nonnegative())
 }).merge(exports.ItemStateBaseSchema);
@@ -61,5 +64,6 @@ exports.ItemStateParamsSchema = zod_1.z.union([
     exports.RichTextStateParamsSchema,
     exports.CustomItemStateParamsSchema,
     exports.GroupStateParamsSchema,
+    exports.CompoundStateParamsSchema,
     exports.CodeEmbedStateParamsSchema
 ]);

package/lib/types/article/ArticleItemType.js

@@ -12,4 +12,5 @@ var ArticleItemType;
     ArticleItemType["Custom"] = "custom";
     ArticleItemType["Group"] = "group";
     ArticleItemType["CodeEmbed"] = "code-embed";
+    ArticleItemType["Compound"] = "compound";
 })(ArticleItemType || (exports.ArticleItemType = ArticleItemType = {}));

package/lib/types/article/CompoundSettings.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/types/article/ItemArea.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.AreaAnchor = exports.PositionType = exports.AnchorSide = void 0;
+exports.DimensionMode = exports.AreaAnchor = exports.PositionType = exports.AnchorSide = void 0;
 var AnchorSide;
 (function (AnchorSide) {
     AnchorSide["Top"] = "top";
@@ -24,3 +24,8 @@ var AreaAnchor;
     AreaAnchor["BottomCenter"] = "bottom-center";
     AreaAnchor["BottomRight"] = "bottom-right";
 })(AreaAnchor || (exports.AreaAnchor = AreaAnchor = {}));
+var DimensionMode;
+(function (DimensionMode) {
+    DimensionMode["ControlUnits"] = "control-units";
+    DimensionMode["Relative"] = "relative";
+})(DimensionMode || (exports.DimensionMode = DimensionMode = {}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cntrl-site/sdk",
-  "version": "1.13.0",
+  "version": "1.15.0",
   "description": "Generic SDK for use in public websites.",
   "main": "lib/index.js",
   "types": "src/index.ts",

package/src/Client/__mock__/articleMock.ts

@@ -11,5 +11,6 @@ export const articleMock: Article = {
       hidden: {},
       color: {}
     }
-  ]
+  ],
+  interactions: []
 };

package/src/index.ts

@@ -17,7 +17,7 @@ export type { Section, SectionHeight } from './types/article/Section';
 export type {
   Item, ImageItem, ItemAny, CustomItem, ItemCommonParamsMap,
   ItemLayoutParamsMap, RectangleItem, StickyParams, VideoItem, RichTextItem,
-  Link, VimeoEmbedItem, YoutubeEmbedItem, GroupItem, CodeEmbedItem
+  Link, VimeoEmbedItem, YoutubeEmbedItem, GroupItem, CodeEmbedItem, CompoundItem
 } from './types/article/Item';
 export type { RichTextBlock, RichTextEntity, RichTextStyle } from './types/article/RichText';
 export type { ItemArea } from './types/article/ItemArea';
@@ -27,3 +27,4 @@ export type { Layout } from './types/project/Layout';
 export type { Project } from './types/project/Project';
 export type { Meta } from './types/project/Meta';
 export type { KeyframeValueMap, KeyframeAny } from './types/keyframe/Keyframe';
+export type { CompoundSettings } from './types/article/CompoundSettings';

package/src/schemas/article/Item.schema.ts

@@ -10,7 +10,7 @@ import {
   YoutubeEmbedItem
 } from '../../types/article/Item';
 import {
-  CodeEmbedStateParamsSchema,
+  CodeEmbedStateParamsSchema, CompoundStateParamsSchema,
   CustomItemStateParamsSchema,
   EmbedStateParamsSchema, GroupStateParamsSchema,
   MediaStateParamsSchema,
@@ -40,19 +40,21 @@ export const FXControlSchema = z.discriminatedUnion('type',[
   })
 ]) satisfies ZodType<FXControlAny>;
 
+const FXParams = z.object({
+  url: z.string().min(1),
+  hasGLEffect: z.boolean().optional(),
+  fragmentShader: z.string().nullable(),
+  FXCursor: z.object({
+    type: z.enum(['mouse', 'manual']),
+    x: z.number(),
+    y: z.number()
+  }).nullable(),
+  FXControls: z.array(FXControlSchema).optional()
+});
+
 const ImageItemSchema = ItemBaseSchema.extend({
   type: z.literal(ArticleItemType.Image),
-  commonParams: z.object({
-    url: z.string().min(1),
-    hasGLEffect: z.boolean().optional(),
-    fragmentShader: z.string().nullable(),
-    FXCursor: z.object({
-      type: z.enum(['mouse', 'manual']),
-      x: z.number(),
-      y: z.number()
-    }).nullable(),
-    FXControls: z.array(FXControlSchema).optional()
-  }),
+  commonParams: FXParams,
   sticky: z.record(
     z.object({
       from: z.number(),
@@ -74,9 +76,8 @@ const ImageItemSchema = ItemBaseSchema.extend({
 const VideoItemSchema = ItemBaseSchema.extend({
   type: z.literal(ArticleItemType.Video),
   commonParams: z.object({
-    url: z.string().min(1),
     coverUrl: z.string().nullable()
-  }),
+  }).merge(FXParams),
   sticky: z.record(
     z.object({
       from: z.number(),
@@ -241,5 +242,24 @@ export const ItemSchema: ZodType<ItemAny> = z.lazy(() => z.discriminatedUnion('t
       })
     ),
     state: z.record(z.record(GroupStateParamsSchema))
+  }),
+  ItemBaseSchema.extend({
+    type: z.literal(ArticleItemType.Compound),
+    commonParams: z.object({
+      overflow: z.enum(['hidden', 'visible']),
+    }),
+    items: z.array(ItemSchema),
+    sticky: z.record(
+      z.object({
+        from: z.number(),
+        to: z.number().optional()
+      }).nullable(),
+    ),
+    layoutParams: z.record(
+      z.object({
+        opacity: z.number().nonnegative()
+      })
+    ),
+    state: z.record(z.record(CompoundStateParamsSchema))
   })
 ]));

package/src/schemas/article/ItemBase.schema.ts

@@ -1,5 +1,6 @@
 import { z } from 'zod';
 import { ItemAreaSchema } from './ItemArea.schema';
+import { AreaAnchor, DimensionMode } from '../../types/article/ItemArea';
 
 export const Link = z.object({
   url: z.string().min(1),
@@ -10,11 +11,18 @@ const CommonParamsBase = z.object({
   sizing: z.string().min(1)
 });
 
+export const CompoundSettingsSchema = z.object({
+  positionAnchor: z.nativeEnum(AreaAnchor),
+  widthMode: z.nativeEnum(DimensionMode),
+  heightMode: z.nativeEnum(DimensionMode),
+});
+
 export const ItemBaseSchema = z.object({
   id: z.string().min(1),
   area: z.record(ItemAreaSchema),
   hidden: z.record(z.boolean()),
   link: Link.optional(),
   commonParams: CommonParamsBase,
+  compoundSettings: z.record(CompoundSettingsSchema).optional(),
   layoutParams: z.record(z.any()).optional()
 });

package/src/schemas/article/ItemState.schema.ts

@@ -6,7 +6,7 @@ import {
   GroupStateParams,
   MediaStateParams,
   RectangleStateParams,
-  RichTextStateParams
+  RichTextStateParams, CompoundStateParams
 } from '../../types/article/ItemState';
 
 const TransitionSchema = z.object({
@@ -67,6 +67,10 @@ export const GroupStateParamsSchema = z.object({
   opacity: getStateParamsSchema(z.number().nonnegative())
 }).merge(ItemStateBaseSchema) satisfies ZodType<GroupStateParams>;
 
+export const CompoundStateParamsSchema = z.object({
+  opacity: getStateParamsSchema(z.number().nonnegative())
+}).merge(ItemStateBaseSchema) satisfies ZodType<CompoundStateParams>;
+
 export const CodeEmbedStateParamsSchema = z.object({
   opacity: getStateParamsSchema(z.number().nonnegative())
 }).merge(ItemStateBaseSchema) satisfies ZodType<CodeEmbedStateParams>;
@@ -78,5 +82,6 @@ export const ItemStateParamsSchema = z.union([
   RichTextStateParamsSchema,
   CustomItemStateParamsSchema,
   GroupStateParamsSchema,
+  CompoundStateParamsSchema,
   CodeEmbedStateParamsSchema
 ]);

package/src/types/article/ArticleItemType.ts

@@ -7,5 +7,6 @@ export enum ArticleItemType {
   YoutubeEmbed = 'youtube-embed',
   Custom = 'custom',
   Group = 'group',
-  CodeEmbed = 'code-embed'
+  CodeEmbed = 'code-embed',
+  Compound = 'compound'
 }

package/src/types/article/CompoundSettings.ts

@@ -0,0 +1,7 @@
+import { AreaAnchor, DimensionMode } from './ItemArea';
+
+export interface CompoundSettings {
+  positionAnchor: AreaAnchor;
+  widthMode: DimensionMode;
+  heightMode: DimensionMode;
+}

package/src/types/article/Item.ts

@@ -3,7 +3,7 @@ import { ArticleItemType } from './ArticleItemType';
 import { AreaAnchor, ItemArea } from './ItemArea';
 import { ItemState } from './ItemState';
 import { FXControlAny, FXCursor } from './FX';
-import { z } from 'zod';
+import { CompoundSettings } from './CompoundSettings';
 
 export type ItemAny = Item<ArticleItemType>;
 
@@ -13,8 +13,9 @@ export interface Item<T extends ArticleItemType> {
   area: Record<LayoutIdentifier, ItemArea>;
   hidden: Record<LayoutIdentifier, boolean>;
   link?: Link;
-  items?: T extends ArticleItemType.Group ? ItemAny[] : never;
+  items?: T extends (ArticleItemType.Group | ArticleItemType.Compound) ? ItemAny[] : never;
   sticky: Record<LayoutIdentifier, StickyParams | null>;
+  compoundSettings?: Record<LayoutIdentifier, CompoundSettings>;
   commonParams: ItemCommonParamsMap[T];
   state: ItemState<T>;
   layoutParams: Record<LayoutIdentifier, ItemLayoutParamsMap[T]>;
@@ -29,6 +30,7 @@ export interface ItemCommonParamsMap {
   [ArticleItemType.YoutubeEmbed]: YoutubeEmbedCommonParams;
   [ArticleItemType.Custom]: CustomCommonParams;
   [ArticleItemType.Group]: GroupCommonParams;
+  [ArticleItemType.Compound]: CompoundCommonParams;
   [ArticleItemType.CodeEmbed]: CodeEmbedCommonParams
 }
 
@@ -41,23 +43,23 @@ export interface ItemLayoutParamsMap {
   [ArticleItemType.YoutubeEmbed]: YoutubeEmbedLayoutParams;
   [ArticleItemType.Custom]: CustomLayoutParams;
   [ArticleItemType.Group]: GroupLayoutParams;
+  [ArticleItemType.Compound]: CompoundLayoutParams;
   [ArticleItemType.CodeEmbed]: CodeEmbedLayoutParams;
 }
 
 interface MediaCommonParams {
   url: string;
+  hasGLEffect?: boolean;
+  fragmentShader: string | null;
+  FXCursor: FXCursor | null;
+  FXControls?: FXControlAny[];
 }
 
 interface VideoCommonParams extends MediaCommonParams {
   coverUrl: string | null;
 }
 
-interface ImageCommonParams extends MediaCommonParams {
-  hasGLEffect?: boolean;
-  fragmentShader: string | null;
-  FXCursor: FXCursor | null;
-  FXControls?: FXControlAny[];
-}
+interface ImageCommonParams extends MediaCommonParams {}
 
 interface RichTextCommonParams {
   text: string;
@@ -74,6 +76,10 @@ interface CustomCommonParams {
 
 interface GroupCommonParams {}
 
+interface CompoundCommonParams {
+  overflow: 'hidden' | 'visible';
+}
+
 interface CodeEmbedCommonParams {
   html: string;
   scale: boolean;
@@ -112,6 +118,10 @@ interface GroupLayoutParams {
   opacity: number;
 }
 
+interface CompoundLayoutParams {
+  opacity: number;
+}
+
 interface CodeEmbedLayoutParams {
   areaAnchor: AreaAnchor;
   opacity: number;
@@ -191,3 +201,4 @@ export type YoutubeEmbedItem = Item<ArticleItemType.YoutubeEmbed>;
 export type CustomItem = Item<ArticleItemType.Custom>;
 export type GroupItem = Item<ArticleItemType.Group>;
 export type CodeEmbedItem = Item<ArticleItemType.CodeEmbed>;
+export type CompoundItem = Item<ArticleItemType.Compound>;

package/src/types/article/ItemArea.ts

@@ -21,6 +21,11 @@ export enum AreaAnchor {
   BottomRight = 'bottom-right'
 }
 
+export enum DimensionMode {
+  ControlUnits = 'control-units',
+  Relative = 'relative',
+}
+
 export interface ItemArea {
   top: number;
   left: number;

package/src/types/article/ItemState.ts

@@ -17,6 +17,7 @@ export interface ItemStatesMap {
   [ArticleItemType.Custom]: CustomItemStateParams;
   [ArticleItemType.Group]: GroupStateParams;
   [ArticleItemType.CodeEmbed]: CodeEmbedStateParams;
+  [ArticleItemType.Compound]: CompoundStateParams;
 }
 
 export interface StateParams<T> {
@@ -75,6 +76,10 @@ export interface GroupStateParams extends ItemStatesBaseMap {
   opacity?: StateParams<number>;
 }
 
+export interface CompoundStateParams extends ItemStatesBaseMap {
+  opacity?: StateParams<number>;
+}
+
 export interface CodeEmbedStateParams extends ItemStatesBaseMap {
   opacity?: StateParams<number>;
 }