@cntrl-site/sdk 1.2.3 → 1.4.0

package/src/types/article/Section.ts

@@ -0,0 +1,22 @@
+import { ItemAny } from './Item';
+
+export enum SectionHeightMode {
+  ControlUnits = 'control-units' ,
+  ViewportHeightUnits = 'viewport-height-units'
+}
+
+export interface SectionHeight {
+  mode: SectionHeightMode;
+  units: number;
+  vhUnits?: number;
+}
+
+export interface Section {
+  id: string;
+  name?: string;
+  height: Record<string, SectionHeight>;
+  hidden: Record<string, boolean>;
+  items: ItemAny[];
+  position: Record<string, number>;
+  color: Record<string, string | null>;
+}

package/src/types/keyframe/Keyframe.ts

@@ -0,0 +1,102 @@
+export type KeyframeAny = Keyframe<KeyframeType>;
+
+export interface Keyframe<T extends KeyframeType> {
+  id: string;
+  type: T;
+  layoutId: string;
+  itemId: string;
+  position: number;
+  value: KeyframeValueMap[T];
+}
+
+export enum KeyframeType {
+  Dimensions = 'dimensions',
+  Position = 'position',
+  Rotation = 'rotation',
+  BorderRadius = 'border-radius',
+  BorderWidth = 'border-width',
+  Color = 'color',
+  BorderColor = 'border-color',
+  Opacity = 'opacity',
+  Scale = 'scale',
+  TextColor = 'text-color',
+  LetterSpacing = 'letter-spacing',
+  WordSpacing = 'word-spacing',
+  Blur = 'blur',
+  BackdropBlur = 'backdrop-blur'
+}
+
+export interface KeyframeValueMap {
+  [KeyframeType.Dimensions]: DimensionsValue;
+  [KeyframeType.Position]: PositionValue;
+  [KeyframeType.Rotation]: RotationValue;
+  [KeyframeType.BorderRadius]: BorderRadiusValue;
+  [KeyframeType.BorderWidth]: BorderWidthValue;
+  [KeyframeType.Color]: ColorValue;
+  [KeyframeType.BorderColor]: BorderColorValue;
+  [KeyframeType.Opacity]: OpacityValue;
+  [KeyframeType.Scale]: ScaleValue;
+  [KeyframeType.Blur]: BlurValue;
+  [KeyframeType.BackdropBlur]: BackdropBlurValue;
+  [KeyframeType.TextColor]: TextColorValue;
+  [KeyframeType.LetterSpacing]: LetterSpacingValue;
+  [KeyframeType.WordSpacing]: WordSpacingValue;
+}
+
+interface DimensionsValue {
+  width: number;
+  height: number;
+}
+
+interface PositionValue {
+  top: number;
+  left: number;
+}
+
+interface RotationValue {
+  angle: number;
+}
+
+interface BorderRadiusValue {
+  radius: number;
+}
+
+interface BorderWidthValue {
+  borderWidth: number;
+}
+
+interface ColorValue {
+  color: string;
+}
+
+interface BorderColorValue {
+  color: string;
+}
+
+interface OpacityValue {
+  opacity: number;
+}
+
+interface ScaleValue {
+  scale: number;
+}
+
+interface BlurValue {
+  blur: number;
+}
+
+interface BackdropBlurValue {
+  backdropBlur: number;
+}
+
+interface TextColorValue {
+  color: string;
+}
+
+interface LetterSpacingValue {
+  letterSpacing: number;
+}
+
+interface WordSpacingValue {
+  wordSpacing: number;
+}

package/src/types/project/Fonts.ts

@@ -0,0 +1,25 @@
+export enum FontFileTypes {
+  OTF = 'otf',
+  TTF = 'ttf',
+  WOFF = 'woff',
+  WOFF2 = 'woff2',
+  EOT = 'eot'
+}
+
+export interface CustomFontFile {
+  type: FontFileTypes;
+  url: string;
+}
+
+export interface CustomFont {
+  name: string;
+  style: string;
+  weight: number;
+  files: CustomFontFile[];
+}
+
+export interface Fonts {
+  google: string;
+  adobe: string;
+  custom: CustomFont[];
+}

package/src/types/project/Layout.ts

@@ -0,0 +1,6 @@
+export interface Layout {
+  id: string;
+  title: string;
+  startsWith: number;
+  exemplary: number;
+}

package/src/types/project/Meta.ts

@@ -0,0 +1,10 @@
+export interface Meta extends GenericMeta {
+  favicon?: string;
+}
+
+export interface GenericMeta {
+  title?: string;
+  description?: string;
+  opengraphThumbnail?: string;
+  keywords?: string;
+}

package/src/types/project/Page.ts

@@ -0,0 +1,13 @@
+import { GenericMeta } from './Meta';
+
+export interface PageMeta extends GenericMeta {
+  enabled?: boolean;
+}
+
+export interface Page {
+  id: string;
+  title: string;
+  articleId: string;
+  slug: string;
+  meta?: PageMeta;
+}

package/src/types/project/Project.ts

@@ -0,0 +1,19 @@
+import { Layout } from './Layout';
+import { Fonts } from './Fonts';
+import { Meta } from './Meta';
+import { Page } from './Page';
+
+export interface AdditionalHTML {
+  head: string;
+  afterBodyOpen: string;
+  beforeBodyClose: string;
+}
+
+export interface Project {
+  id: string;
+  html: AdditionalHTML;
+  meta: Meta;
+  layouts: Layout[];
+  pages: Page[];
+  fonts: Fonts;
+}

package/src/utils.ts

@@ -1,7 +1,7 @@
-import { TLayout } from '@cntrl-site/core';
+import { Layout } from './types/project/Layout';
 
 export function getLayoutStyles<V, M> (
-  layouts: TLayout[],
+  layouts: Layout[],
   layoutValues: Record<string, V>[],
   mapToStyles: (values: V[], exemplary: number) => M
 ): string {
@@ -20,3 +20,17 @@ export function getLayoutStyles<V, M> (
   return mediaQueries;
 }
 
+export function getLayoutMediaQuery(layoutId: string, layouts: Layout[]): string {
+  const sorted = layouts.slice().sort((a, b) => a.startsWith - b.startsWith);
+  const layoutIndex = sorted.findIndex(l => l.id === layoutId);
+  if (layoutIndex === -1) {
+    throw new Error(`No layout was found by the given id #${layoutId}`);
+  }
+  const current = sorted[layoutIndex];
+  const next = sorted[layoutIndex + 1];
+  if (!next) {
+    return `@media (min-width: ${current.startsWith}px)`;
+  }
+  return `@media (min-width: ${current.startsWith}px) and (max-width: ${next.startsWith - 1}px)`;
+}
+

package/src/Client/__mock__/typePresetsMock.ts

@@ -1,6 +0,0 @@
-import { TTypePresets } from '@cntrl-site/core';
-
-export const typePresetsMock: TTypePresets = {
-  id: 'typePresetsId',
-  presets: []
-};